@wonderflow/react-components/dist/components/symbol/symbol.js

UI components from Wonderflow's Wanda design system

import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
// eslint-disable-next-line import/extensions
import sprite from '@wonderflow/symbols/sprite.svg';
import clsx from 'clsx';
import { Children, cloneElement, forwardRef, useMemo, } from 'react';
import * as styles from './symbol.module.css';
export const Symbol = forwardRef(({ className, source, dimension = 16, weight = 'outline', fill, ...otherProps }, forwardedRef) => {
    const computedStyle = useMemo(() => (+dimension < 18 ? 'solid' : weight), [weight, dimension]);
    const colorFill = { '--fill': fill ?? otherProps.color ?? 'currentcolor' };
    return (typeof source === 'string')
        ? (_jsx("svg", { "aria-hidden": "true", width: dimension, height: dimension, fill: fill, className: clsx(styles.Icon, className), style: colorFill, ref: forwardedRef, ...otherProps, children: _jsx("use", { href: `${sprite}#${computedStyle}/${source}` }) }))
        : (_jsx(_Fragment, { children: Children.map(source, (child) => cloneElement(child, {
                className,
                'aria-hidden': 'true',
                width: dimension,
                height: dimension,
                color: fill ?? 'currentcolor',
            })) }));
});
Symbol.displayName = 'Symbol';