Icons

1. Construct array of SvgIcon objects, bundling from default provided by this package or your own.

// atoms/constants/svg-icons.tsx

import { Icons, SvgIcon } from "andculturecode-javascript-react-components";
import { ReactComponent as Checkmark } from "andculturecode-javascript-react-components/dist/assets/icons/16px/Checkmark.svg";
import { ReactComponent as CheckmarkLarge } from "andculturecode-javascript-react-components/dist/assets/icons/24px/Checkmark.svg";

const SvgIcons: SvgIcon[] = [
    { type: Icons.Checkmark, base: Checkmark, large: CheckmarkLarge },
];

export { SvgIcons };

2. Register your icons

// app.tsx

import { Icon, Icons, IconUtils } from "andculturecode-javascript-react-components";
import { SvgIcons } from "atoms/constants/svg-icons";

const App: React.FC = () => {

    IconUtils.register(SvgIcons);

    return (
        <React.Fragment>
            <Icon type={Icons.Checkmark} />
        </React.Fragment>
    );
};

3. (Optional) Using storybook? Globally register icons

// .storybook/config.js

import { IconUtils } from "andculturecode-javascript-react-components";
import { SvgIcons } from "atoms/constants/svg-icons";

IconUtils.register(SvgIcons);