@kadconsulting/dry
Version:
KAD Reusable Component Library
31 lines • 1.45 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
import classnames from 'classnames';
import { IconSizes } from './IconTypes';
import { forwardRef, memo, useMemo } from 'react';
const Icon = forwardRef(({ className = '', size = IconSizes.MEDIUM, Path: PathComponent, PathProps, fill = 'white', stroke, ...props }, ref) => {
const dimensions = useMemo(() => {
if (!size)
return {
width: props.width,
height: props.height,
};
return {
width: size,
height: size,
};
}, [size, props.width, props.height]);
let color = stroke && stroke;
if (!stroke && PathProps?.stroke) {
color = `var(--${PathProps?.stroke})`;
}
else if (!stroke && !PathProps?.stroke) {
color = '#000';
}
return (_jsx(_Fragment, { children: _jsx("svg", { ref: ref, fill: fill, viewBox: '0 0 24 24' // Note: an SVG's viewBox must match the bounds of the path (`d` prop) of the underlying icon; for Untitled, all icons are 24x24
, width: dimensions.width, height: dimensions.height, className: classnames('dry-icon', className), ...props, children: _jsx(PathComponent, { ...PathProps,
// TODO-p3 remove ts-ignore once we have a better way to handle this
// @ts-ignore
stroke: color }) }) }));
});
export default memo(Icon);
//# sourceMappingURL=Icon.js.map