export type Icon = (props?: IconProps) => HTMLElement;
interface IconCreatorProps {
viewBox?: string;
size?: string;
}
export interface IconProps {
fill?: string;
}
const createIcon =
(
children: string,
{ viewBox = '0 0 1024 1024', size = '1.5em' }: IconCreatorProps = {},
) =>
({ fill = 'currentColor' }: IconProps = {}) => {
const html = ``;
return document.createRange().createContextualFragment(html)
.firstElementChild as HTMLElement;
};
export const TEXT_ICONS = {
fontFamily: createIcon(
``,
{ size: '1.2em' },
),
fontSize: createIcon(
``,
{ size: '1.2em' },
),
align: createIcon(
``,
),
alignTop: createIcon(
``,
),
alignRight: createIcon(
``,
),
alignBottom: createIcon(
``,
),
alignLeft: createIcon(
``,
),
alignCenter: createIcon(
``,
),
alignMiddle: createIcon(
``,
),
};
export const RESET_ICON = createIcon(
``,
);
export const ELEMENT_ICONS = {
align: createIcon(
``,
),
alignTop: createIcon(
`
`,
),
alignRight: createIcon(
``,
),
alignBottom: createIcon(
``,
),
alignLeft: createIcon(
``,
),
alignH: createIcon(
``,
),
alignV: createIcon(
``,
),
distributeH: createIcon(
``,
),
distributeV: createIcon(
``,
),
};