@hitachivantara/uikit-react-core
Version:
UI Kit Core React components.
77 lines (76 loc) • 2.61 kB
JavaScript
;
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
const uikitStyles = require("@hitachivantara/uikit-styles");
const icons = require("../icons.cjs");
const { useClasses } = uikitReactUtils.createClasses("HvCheckBoxIcon", {
root: {
color: uikitStyles.theme.colors.bgContainer,
borderRadius: uikitStyles.theme.radii.base,
border: `1px solid ${uikitStyles.theme.colors.borderStrong}`
},
checked: {
borderColor: "transparent",
backgroundColor: `var(--bg-color, ${uikitStyles.theme.colors.primaryStrong})`,
color: uikitStyles.theme.colors.bgContainer
},
indeterminate: {
color: uikitStyles.theme.colors.textSubtle,
backgroundColor: uikitStyles.theme.colors.bgContainer
},
semantic: {
"&[data-variant=indeterminate]": {
backgroundColor: uikitStyles.theme.colors.bgContainer,
borderColor: uikitStyles.theme.colors.borderStrong
}
},
disabled: {
color: uikitStyles.theme.colors.bgDisabled,
borderColor: uikitStyles.theme.colors.borderDisabled,
backgroundColor: uikitStyles.theme.colors.bgDisabled,
"&[data-variant=checked],&[data-variant=indeterminate]": {
color: uikitStyles.theme.colors.textDisabled,
borderColor: "currentcolor"
}
}
});
const HvCheckBoxIcon = (props) => {
const {
className,
classes: classesProp,
variant,
disabled,
semantic,
color
} = uikitReactUtils.useDefaultProps("HvCheckBoxIcon", props);
const { classes, cx } = useClasses(classesProp, false);
const d = React.useMemo(() => {
switch (variant) {
case "checked":
return "m5.03,12.06l-3.76,-3.75l1.42,-1.42l2.24,2.25l6.3,-7.2l1.5,1.31l-7.7,8.81z";
case "indeterminate":
return "m3,8l8,0l0,-2l-8,0l0,2z";
case "default":
default:
return "m0,0l16,0l0,16l-16,0l0,-16z";
}
}, [variant]);
return /* @__PURE__ */ jsxRuntime.jsx(
icons.SvgBase,
{
viewBox: "0 0 14 14",
"data-variant": variant,
className: cx(classes.root, className, {
[classes.checked]: variant === "checked",
[classes.indeterminate]: variant === "indeterminate",
[classes.semantic]: semantic,
[classes.disabled]: disabled
}),
style: uikitReactUtils.mergeStyles({}, { "--bg-color": uikitStyles.getColor(color) }),
children: /* @__PURE__ */ jsxRuntime.jsx("path", { d })
}
);
};
exports.HvCheckBoxIcon = HvCheckBoxIcon;