npm - @mirohq/design-system-checkbox - Versions diffs - 1.1.30 → 1.1.32 - Mend

@mirohq/design-system-checkbox 1.1.30 → 1.1.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/main.js CHANGED Viewed

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
+var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var designSystemUtils = require('@mirohq/design-system-utils');
 var reactCheckbox = require('@radix-ui/react-checkbox');
@@ -208,35 +209,44 @@ const Checkbox = React__default["default"].forwardRef(
       true: onChecked,
       false: onUnchecked
     };
-    return /* @__PURE__ */ React__default["default"].createElement(StyledCheckbox, {
-      ...restProps,
-      "aria-disabled": ariaDisabled,
-      checked: internalChecked,
-      defaultChecked,
-      disabled,
-      size,
-      variant,
-      onClick: (e) => {
-        if (isAriaDisabled) {
-          e.preventDefault();
-          return;
-        }
-        onClick == null ? void 0 : onClick(e);
-      },
-      onCheckedChange: (checked2) => {
-        var _a;
-        setCheckedState(checked2);
-        (_a = checkedStateEvents[`${checked2}`]) == null ? void 0 : _a.call(checkedStateEvents);
-      },
-      ref: forwardRef
-    }, /* @__PURE__ */ React__default["default"].createElement(StyledCheckboxContent, null, /* @__PURE__ */ React__default["default"].createElement(reactCheckbox.Indicator, null, internalChecked === "indeterminate" && /* @__PURE__ */ React__default["default"].createElement(StyledIndeterminateMark, {
-      size
-    }), internalChecked === true && /* @__PURE__ */ React__default["default"].createElement(StyledCheckMark, {
-      size
-    })), disabledUnchecked && /* @__PURE__ */ React__default["default"].createElement(StyledDisabledMark, {
-      weight: size === "small" ? "thin" : void 0,
-      size
-    })));
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      StyledCheckbox,
+      {
+        ...restProps,
+        "aria-disabled": ariaDisabled,
+        checked: internalChecked,
+        defaultChecked,
+        disabled,
+        size,
+        variant,
+        onClick: (e) => {
+          if (isAriaDisabled) {
+            e.preventDefault();
+            return;
+          }
+          onClick == null ? void 0 : onClick(e);
+        },
+        onCheckedChange: (checked2) => {
+          var _a;
+          setCheckedState(checked2);
+          (_a = checkedStateEvents[`${checked2}`]) == null ? void 0 : _a.call(checkedStateEvents);
+        },
+        ref: forwardRef,
+        children: /* @__PURE__ */ jsxRuntime.jsxs(StyledCheckboxContent, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(reactCheckbox.Indicator, { children: [
+            internalChecked === "indeterminate" && /* @__PURE__ */ jsxRuntime.jsx(StyledIndeterminateMark, { size }),
+            internalChecked === true && /* @__PURE__ */ jsxRuntime.jsx(StyledCheckMark, { size })
+          ] }),
+          disabledUnchecked && /* @__PURE__ */ jsxRuntime.jsx(
+            StyledDisabledMark,
+            {
+              weight: size === "small" ? "thin" : void 0,
+              size
+            }
+          )
+        ] })
+      }
+    );
   }
 );

package/dist/main.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"main.js","sources":["../src/checkbox.styled.tsx","../src/checkbox.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Root } from '@radix-ui/react-checkbox'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport {\n IconProhibit,\n IconCheckMark,\n IconMinus,\n} from '@mirohq/design-system-icons'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledCheckboxContent = styled(Primitive.div, {\n display: 'block',\n pointerEvents: 'none',\n borderRadius: '$50',\n position: 'relative',\n margin: 'auto',\n boxSizing: 'border-box',\n})\n\nconst checkboxContentSelector = `& ${StyledCheckboxContent}`\n\nconst checkedAndIndeterminate =\n '&[data-state=\"checked\"], &[data-state=\"indeterminate\"]'\nconst ariaDisabledCheckedIndeterminate = [\n '&[aria-disabled=\"true\"][data-state=\"checked\"]',\n '&:disabled[data-state=\"checked\"]',\n '&[aria-disabled=\"true\"][data-state=\"indeterminate\"]',\n '&:disabled[data-state=\"indeterminate\"]',\n].join(' ,')\nconst hoverCheckedIndeterminate =\n '&:hover[data-state=\"checked\"], &:hover[data-state=\"indeterminate\"]'\nconst ariaDisabledUnChecked =\n '&[aria-disabled=\"true\"][data-state=\"unchecked\"], &:disabled[data-state=\"unchecked\"]'\nconst hoverCheckedIndeterminateDisabled = [\n '&:hover[data-state=\"checked\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"checked\"]&:disabled',\n '&:hover[data-state=\"indeterminate\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"indeterminate\"]&:disabled',\n].join(' ,')\n\nconst hoverAriaDisabled = [\n '&:hover[data-state=\"unchecked\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"unchecked\"]&:disabled',\n ...hoverCheckedIndeterminateDisabled.split(' ,'),\n].join(' ,')\n\nexport const StyledCheckbox = styled(Root, {\n all: 'unset',\n square: '$6',\n color: '$icon-primary-inverted',\n cursor: 'pointer',\n\n '&[aria-disabled=\"true\"], &:disabled': {\n cursor: 'default',\n },\n '&:focus': {\n [checkboxContentSelector]: {\n boxShadow: '$focus-controls',\n },\n },\n [hoverCheckedIndeterminateDisabled]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n },\n },\n\n [hoverAriaDisabled]: {\n [checkboxContentSelector]: {\n color: '$icon-neutrals-disabled',\n },\n },\n [ariaDisabledCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n color: '$icon-neutrals-disabled',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n color: '$icon-neutrals-disabled',\n },\n },\n variants: {\n variant: {\n 'solid-prominent': {\n '&[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n border: '1px solid $border-neutrals-controls',\n },\n },\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-prominent',\n color: '$icon-primary-inverted',\n },\n },\n [hoverCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-prominent-hover',\n },\n },\n '&:hover[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n border: '1px solid $border-primary',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n border: '1px solid $border-neutrals-controls-disabled',\n },\n },\n },\n 'solid-subtle': {\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle',\n color: '$icon-primary',\n },\n },\n '&[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle',\n },\n },\n [`${hoverCheckedIndeterminate}, &:hover[data-state=\"unchecked\"]`]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle-hover',\n color: '$icon-primary-hover',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n },\n },\n },\n ghost: {\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n color: '$icon-primary',\n },\n },\n [hoverCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n color: '$icon-primary-hover',\n },\n },\n [ariaDisabledCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n },\n },\n [hoverCheckedIndeterminateDisabled]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n },\n },\n },\n },\n size: {\n large: {\n [checkboxContentSelector]: {\n square: '$5',\n },\n },\n small: {\n [checkboxContentSelector]: {\n square: '$4',\n },\n },\n },\n },\n})\n\nconst markStyles = {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%,-50%)',\n variants: {\n size: {\n large: { width: '18px' },\n small: { width: '12px' },\n },\n },\n}\n\nexport const StyledDisabledMark = styled(IconProhibit, markStyles)\n\nexport const StyledCheckMark = styled(IconCheckMark, markStyles)\n\nexport const StyledIndeterminateMark = styled(IconMinus, markStyles)\n\nexport type StyledCheckboxProps = StrictComponentProps<typeof StyledCheckbox>\n","import React, { useState } from 'react'\nimport { booleanify } from '@mirohq/design-system-utils'\nimport { Indicator as RadixIndicator } from '@radix-ui/react-checkbox'\nimport type { ElementRef } from 'react'\nimport type { Booleanish } from '@mirohq/design-system-types'\n\nimport {\n StyledCheckboxContent,\n StyledCheckbox,\n StyledCheckMark,\n StyledDisabledMark,\n StyledIndeterminateMark,\n} from './checkbox.styled'\nimport type { StyledCheckboxProps } from './checkbox.styled'\n\nexport interface CheckboxProps extends StyledCheckboxProps {\n /*\n The checked state of the checkbox when it is initially rendered. Use when\n * you do not need to control its checked state.\n /\n defaultChecked?: boolean\n\n /\n The style of the checkbox.\n /\n variant?: StyledCheckboxProps['variant']\n\n /\n The size of the checkbox.\n /\n size?: StyledCheckboxProps['size']\n\n /\n The controlled checked state of the checkbox. Must be used in conjunction\n * with onChecked and onUnchecked.\n /\n checked?: boolean \| 'indeterminate'\n\n /\n When true, indicates that the user must check the checkbox before the\n * owning form can be submitted.\n /\n required?: boolean\n\n /\n The name of the checkbox. Submitted with its owning form as part of a\n * name/value pair.\n /\n name?: string\n\n /\n The value given as data when submitted with a name.\n /\n value?: string\n\n /\n When true, prevents the user from interacting with the checkbox.\n /\n disabled?: boolean\n\n /\n Event handler called when the checked state equals true.\n /\n onChecked?: () => void\n\n /\n Event handler called when the checked state equals false.\n /\n onUnchecked?: () => void\n\n /\n When true, prevents the user from interacting with the checkbox but focus\n * is still possible.\n */\n 'aria-disabled'?: Booleanish\n}\n\nexport const Checkbox = React.forwardRef<\n ElementRef<typeof StyledCheckbox>,\n CheckboxProps\n>(\n (\n {\n 'aria-disabled': ariaDisabled,\n checked,\n defaultChecked,\n disabled,\n onChecked,\n onUnchecked,\n onClick,\n onKeyDown,\n size = 'large',\n variant = 'solid-prominent',\n ...restProps\n },\n forwardRef\n ) => {\n const [checkedState, setCheckedState] = useState<CheckboxProps['checked']>(\n defaultChecked ?? false\n )\n const internalChecked = checked ?? checkedState\n const isAriaDisabled = booleanify(ariaDisabled ?? false)\n const disabledUnchecked =\n (disabled === true \|\| isAriaDisabled) && internalChecked === false\n const checkedStateEvents = {\n true: onChecked,\n false: onUnchecked,\n }\n\n return (\n <StyledCheckbox\n {...restProps}\n aria-disabled={ariaDisabled}\n checked={internalChecked}\n defaultChecked={defaultChecked}\n disabled={disabled}\n size={size}\n variant={variant}\n onClick={e => {\n if (isAriaDisabled) {\n e.preventDefault()\n return\n }\n onClick?.(e)\n }}\n onCheckedChange={(checked: boolean) => {\n setCheckedState(checked)\n\n checkedStateEvents[`${checked}`]?.()\n }}\n ref={forwardRef}\n >\n <StyledCheckboxContent>\n <RadixIndicator>\n {internalChecked === 'indeterminate' && (\n <StyledIndeterminateMark size={size} />\n )}\n {internalChecked === true && <StyledCheckMark size={size} />}\n </RadixIndicator>\n {disabledUnchecked && (\n <StyledDisabledMark\n weight={size === 'small' ? 'thin' : undefined}\n size={size}\n />\n )}\n </StyledCheckboxContent>\n </StyledCheckbox>\n )\n }\n)\n"],"names":["styled","Primitive","Root","IconProhibit","IconCheckMark","IconMinus","React","useState","booleanify","checked","RadixIndicator"],"mappings":"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"}
1	+ {"version":3,"file":"main.js","sources":["../src/checkbox.styled.tsx","../src/checkbox.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Root } from '@radix-ui/react-checkbox'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport {\n IconProhibit,\n IconCheckMark,\n IconMinus,\n} from '@mirohq/design-system-icons'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledCheckboxContent = styled(Primitive.div, {\n display: 'block',\n pointerEvents: 'none',\n borderRadius: '$50',\n position: 'relative',\n margin: 'auto',\n boxSizing: 'border-box',\n})\n\nconst checkboxContentSelector = `& ${StyledCheckboxContent}`\n\nconst checkedAndIndeterminate =\n '&[data-state=\"checked\"], &[data-state=\"indeterminate\"]'\nconst ariaDisabledCheckedIndeterminate = [\n '&[aria-disabled=\"true\"][data-state=\"checked\"]',\n '&:disabled[data-state=\"checked\"]',\n '&[aria-disabled=\"true\"][data-state=\"indeterminate\"]',\n '&:disabled[data-state=\"indeterminate\"]',\n].join(' ,')\nconst hoverCheckedIndeterminate =\n '&:hover[data-state=\"checked\"], &:hover[data-state=\"indeterminate\"]'\nconst ariaDisabledUnChecked =\n '&[aria-disabled=\"true\"][data-state=\"unchecked\"], &:disabled[data-state=\"unchecked\"]'\nconst hoverCheckedIndeterminateDisabled = [\n '&:hover[data-state=\"checked\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"checked\"]&:disabled',\n '&:hover[data-state=\"indeterminate\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"indeterminate\"]&:disabled',\n].join(' ,')\n\nconst hoverAriaDisabled = [\n '&:hover[data-state=\"unchecked\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"unchecked\"]&:disabled',\n ...hoverCheckedIndeterminateDisabled.split(' ,'),\n].join(' ,')\n\nexport const StyledCheckbox = styled(Root, {\n all: 'unset',\n square: '$6',\n color: '$icon-primary-inverted',\n cursor: 'pointer',\n\n '&[aria-disabled=\"true\"], &:disabled': {\n cursor: 'default',\n },\n '&:focus': {\n [checkboxContentSelector]: {\n boxShadow: '$focus-controls',\n },\n },\n [hoverCheckedIndeterminateDisabled]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n },\n },\n\n [hoverAriaDisabled]: {\n [checkboxContentSelector]: {\n color: '$icon-neutrals-disabled',\n },\n },\n [ariaDisabledCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n color: '$icon-neutrals-disabled',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n color: '$icon-neutrals-disabled',\n },\n },\n variants: {\n variant: {\n 'solid-prominent': {\n '&[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n border: '1px solid $border-neutrals-controls',\n },\n },\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-prominent',\n color: '$icon-primary-inverted',\n },\n },\n [hoverCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-prominent-hover',\n },\n },\n '&:hover[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n border: '1px solid $border-primary',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n border: '1px solid $border-neutrals-controls-disabled',\n },\n },\n },\n 'solid-subtle': {\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle',\n color: '$icon-primary',\n },\n },\n '&[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle',\n },\n },\n [`${hoverCheckedIndeterminate}, &:hover[data-state=\"unchecked\"]`]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle-hover',\n color: '$icon-primary-hover',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n },\n },\n },\n ghost: {\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n color: '$icon-primary',\n },\n },\n [hoverCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n color: '$icon-primary-hover',\n },\n },\n [ariaDisabledCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n },\n },\n [hoverCheckedIndeterminateDisabled]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n },\n },\n },\n },\n size: {\n large: {\n [checkboxContentSelector]: {\n square: '$5',\n },\n },\n small: {\n [checkboxContentSelector]: {\n square: '$4',\n },\n },\n },\n },\n})\n\nconst markStyles = {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%,-50%)',\n variants: {\n size: {\n large: { width: '18px' },\n small: { width: '12px' },\n },\n },\n}\n\nexport const StyledDisabledMark = styled(IconProhibit, markStyles)\n\nexport const StyledCheckMark = styled(IconCheckMark, markStyles)\n\nexport const StyledIndeterminateMark = styled(IconMinus, markStyles)\n\nexport type StyledCheckboxProps = StrictComponentProps<typeof StyledCheckbox>\n","import React, { useState } from 'react'\nimport { booleanify } from '@mirohq/design-system-utils'\nimport { Indicator as RadixIndicator } from '@radix-ui/react-checkbox'\nimport type { ElementRef } from 'react'\nimport type { Booleanish } from '@mirohq/design-system-types'\n\nimport {\n StyledCheckboxContent,\n StyledCheckbox,\n StyledCheckMark,\n StyledDisabledMark,\n StyledIndeterminateMark,\n} from './checkbox.styled'\nimport type { StyledCheckboxProps } from './checkbox.styled'\n\nexport interface CheckboxProps extends StyledCheckboxProps {\n /*\n The checked state of the checkbox when it is initially rendered. Use when\n * you do not need to control its checked state.\n /\n defaultChecked?: boolean\n\n /\n The style of the checkbox.\n /\n variant?: StyledCheckboxProps['variant']\n\n /\n The size of the checkbox.\n /\n size?: StyledCheckboxProps['size']\n\n /\n The controlled checked state of the checkbox. Must be used in conjunction\n * with onChecked and onUnchecked.\n /\n checked?: boolean \| 'indeterminate'\n\n /\n When true, indicates that the user must check the checkbox before the\n * owning form can be submitted.\n /\n required?: boolean\n\n /\n The name of the checkbox. Submitted with its owning form as part of a\n * name/value pair.\n /\n name?: string\n\n /\n The value given as data when submitted with a name.\n /\n value?: string\n\n /\n When true, prevents the user from interacting with the checkbox.\n /\n disabled?: boolean\n\n /\n Event handler called when the checked state equals true.\n /\n onChecked?: () => void\n\n /\n Event handler called when the checked state equals false.\n /\n onUnchecked?: () => void\n\n /\n When true, prevents the user from interacting with the checkbox but focus\n * is still possible.\n */\n 'aria-disabled'?: Booleanish\n}\n\nexport const Checkbox = React.forwardRef<\n ElementRef<typeof StyledCheckbox>,\n CheckboxProps\n>(\n (\n {\n 'aria-disabled': ariaDisabled,\n checked,\n defaultChecked,\n disabled,\n onChecked,\n onUnchecked,\n onClick,\n onKeyDown,\n size = 'large',\n variant = 'solid-prominent',\n ...restProps\n },\n forwardRef\n ) => {\n const [checkedState, setCheckedState] = useState<CheckboxProps['checked']>(\n defaultChecked ?? false\n )\n const internalChecked = checked ?? checkedState\n const isAriaDisabled = booleanify(ariaDisabled ?? false)\n const disabledUnchecked =\n (disabled === true \|\| isAriaDisabled) && internalChecked === false\n const checkedStateEvents = {\n true: onChecked,\n false: onUnchecked,\n }\n\n return (\n <StyledCheckbox\n {...restProps}\n aria-disabled={ariaDisabled}\n checked={internalChecked}\n defaultChecked={defaultChecked}\n disabled={disabled}\n size={size}\n variant={variant}\n onClick={e => {\n if (isAriaDisabled) {\n e.preventDefault()\n return\n }\n onClick?.(e)\n }}\n onCheckedChange={(checked: boolean) => {\n setCheckedState(checked)\n\n checkedStateEvents[`${checked}`]?.()\n }}\n ref={forwardRef}\n >\n <StyledCheckboxContent>\n <RadixIndicator>\n {internalChecked === 'indeterminate' && (\n <StyledIndeterminateMark size={size} />\n )}\n {internalChecked === true && <StyledCheckMark size={size} />}\n </RadixIndicator>\n {disabledUnchecked && (\n <StyledDisabledMark\n weight={size === 'small' ? 'thin' : undefined}\n size={size}\n />\n )}\n </StyledCheckboxContent>\n </StyledCheckbox>\n )\n }\n)\n"],"names":["styled","Primitive","Root","IconProhibit","IconCheckMark","IconMinus","React","useState","booleanify","jsx","checked","jsxs","RadixIndicator"],"mappings":"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"}

package/dist/module.js CHANGED Viewed

@@ -1,3 +1,4 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
 import React, { useState } from 'react';
 import { booleanify } from '@mirohq/design-system-utils';
 import { Root, Indicator } from '@radix-ui/react-checkbox';
@@ -200,35 +201,44 @@ const Checkbox = React.forwardRef(
       true: onChecked,
       false: onUnchecked
     };
-    return /* @__PURE__ */ React.createElement(StyledCheckbox, {
-      ...restProps,
-      "aria-disabled": ariaDisabled,
-      checked: internalChecked,
-      defaultChecked,
-      disabled,
-      size,
-      variant,
-      onClick: (e) => {
-        if (isAriaDisabled) {
-          e.preventDefault();
-          return;
-        }
-        onClick == null ? void 0 : onClick(e);
-      },
-      onCheckedChange: (checked2) => {
-        var _a;
-        setCheckedState(checked2);
-        (_a = checkedStateEvents[`${checked2}`]) == null ? void 0 : _a.call(checkedStateEvents);
-      },
-      ref: forwardRef
-    }, /* @__PURE__ */ React.createElement(StyledCheckboxContent, null, /* @__PURE__ */ React.createElement(Indicator, null, internalChecked === "indeterminate" && /* @__PURE__ */ React.createElement(StyledIndeterminateMark, {
-      size
-    }), internalChecked === true && /* @__PURE__ */ React.createElement(StyledCheckMark, {
-      size
-    })), disabledUnchecked && /* @__PURE__ */ React.createElement(StyledDisabledMark, {
-      weight: size === "small" ? "thin" : void 0,
-      size
-    })));
+    return /* @__PURE__ */ jsx(
+      StyledCheckbox,
+      {
+        ...restProps,
+        "aria-disabled": ariaDisabled,
+        checked: internalChecked,
+        defaultChecked,
+        disabled,
+        size,
+        variant,
+        onClick: (e) => {
+          if (isAriaDisabled) {
+            e.preventDefault();
+            return;
+          }
+          onClick == null ? void 0 : onClick(e);
+        },
+        onCheckedChange: (checked2) => {
+          var _a;
+          setCheckedState(checked2);
+          (_a = checkedStateEvents[`${checked2}`]) == null ? void 0 : _a.call(checkedStateEvents);
+        },
+        ref: forwardRef,
+        children: /* @__PURE__ */ jsxs(StyledCheckboxContent, { children: [
+          /* @__PURE__ */ jsxs(Indicator, { children: [
+            internalChecked === "indeterminate" && /* @__PURE__ */ jsx(StyledIndeterminateMark, { size }),
+            internalChecked === true && /* @__PURE__ */ jsx(StyledCheckMark, { size })
+          ] }),
+          disabledUnchecked && /* @__PURE__ */ jsx(
+            StyledDisabledMark,
+            {
+              weight: size === "small" ? "thin" : void 0,
+              size
+            }
+          )
+        ] })
+      }
+    );
   }
 );

package/dist/module.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"module.js","sources":["../src/checkbox.styled.tsx","../src/checkbox.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Root } from '@radix-ui/react-checkbox'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport {\n IconProhibit,\n IconCheckMark,\n IconMinus,\n} from '@mirohq/design-system-icons'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledCheckboxContent = styled(Primitive.div, {\n display: 'block',\n pointerEvents: 'none',\n borderRadius: '$50',\n position: 'relative',\n margin: 'auto',\n boxSizing: 'border-box',\n})\n\nconst checkboxContentSelector = `& ${StyledCheckboxContent}`\n\nconst checkedAndIndeterminate =\n '&[data-state=\"checked\"], &[data-state=\"indeterminate\"]'\nconst ariaDisabledCheckedIndeterminate = [\n '&[aria-disabled=\"true\"][data-state=\"checked\"]',\n '&:disabled[data-state=\"checked\"]',\n '&[aria-disabled=\"true\"][data-state=\"indeterminate\"]',\n '&:disabled[data-state=\"indeterminate\"]',\n].join(' ,')\nconst hoverCheckedIndeterminate =\n '&:hover[data-state=\"checked\"], &:hover[data-state=\"indeterminate\"]'\nconst ariaDisabledUnChecked =\n '&[aria-disabled=\"true\"][data-state=\"unchecked\"], &:disabled[data-state=\"unchecked\"]'\nconst hoverCheckedIndeterminateDisabled = [\n '&:hover[data-state=\"checked\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"checked\"]&:disabled',\n '&:hover[data-state=\"indeterminate\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"indeterminate\"]&:disabled',\n].join(' ,')\n\nconst hoverAriaDisabled = [\n '&:hover[data-state=\"unchecked\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"unchecked\"]&:disabled',\n ...hoverCheckedIndeterminateDisabled.split(' ,'),\n].join(' ,')\n\nexport const StyledCheckbox = styled(Root, {\n all: 'unset',\n square: '$6',\n color: '$icon-primary-inverted',\n cursor: 'pointer',\n\n '&[aria-disabled=\"true\"], &:disabled': {\n cursor: 'default',\n },\n '&:focus': {\n [checkboxContentSelector]: {\n boxShadow: '$focus-controls',\n },\n },\n [hoverCheckedIndeterminateDisabled]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n },\n },\n\n [hoverAriaDisabled]: {\n [checkboxContentSelector]: {\n color: '$icon-neutrals-disabled',\n },\n },\n [ariaDisabledCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n color: '$icon-neutrals-disabled',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n color: '$icon-neutrals-disabled',\n },\n },\n variants: {\n variant: {\n 'solid-prominent': {\n '&[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n border: '1px solid $border-neutrals-controls',\n },\n },\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-prominent',\n color: '$icon-primary-inverted',\n },\n },\n [hoverCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-prominent-hover',\n },\n },\n '&:hover[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n border: '1px solid $border-primary',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n border: '1px solid $border-neutrals-controls-disabled',\n },\n },\n },\n 'solid-subtle': {\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle',\n color: '$icon-primary',\n },\n },\n '&[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle',\n },\n },\n [`${hoverCheckedIndeterminate}, &:hover[data-state=\"unchecked\"]`]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle-hover',\n color: '$icon-primary-hover',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n },\n },\n },\n ghost: {\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n color: '$icon-primary',\n },\n },\n [hoverCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n color: '$icon-primary-hover',\n },\n },\n [ariaDisabledCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n },\n },\n [hoverCheckedIndeterminateDisabled]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n },\n },\n },\n },\n size: {\n large: {\n [checkboxContentSelector]: {\n square: '$5',\n },\n },\n small: {\n [checkboxContentSelector]: {\n square: '$4',\n },\n },\n },\n },\n})\n\nconst markStyles = {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%,-50%)',\n variants: {\n size: {\n large: { width: '18px' },\n small: { width: '12px' },\n },\n },\n}\n\nexport const StyledDisabledMark = styled(IconProhibit, markStyles)\n\nexport const StyledCheckMark = styled(IconCheckMark, markStyles)\n\nexport const StyledIndeterminateMark = styled(IconMinus, markStyles)\n\nexport type StyledCheckboxProps = StrictComponentProps<typeof StyledCheckbox>\n","import React, { useState } from 'react'\nimport { booleanify } from '@mirohq/design-system-utils'\nimport { Indicator as RadixIndicator } from '@radix-ui/react-checkbox'\nimport type { ElementRef } from 'react'\nimport type { Booleanish } from '@mirohq/design-system-types'\n\nimport {\n StyledCheckboxContent,\n StyledCheckbox,\n StyledCheckMark,\n StyledDisabledMark,\n StyledIndeterminateMark,\n} from './checkbox.styled'\nimport type { StyledCheckboxProps } from './checkbox.styled'\n\nexport interface CheckboxProps extends StyledCheckboxProps {\n /*\n The checked state of the checkbox when it is initially rendered. Use when\n * you do not need to control its checked state.\n /\n defaultChecked?: boolean\n\n /\n The style of the checkbox.\n /\n variant?: StyledCheckboxProps['variant']\n\n /\n The size of the checkbox.\n /\n size?: StyledCheckboxProps['size']\n\n /\n The controlled checked state of the checkbox. Must be used in conjunction\n * with onChecked and onUnchecked.\n /\n checked?: boolean \| 'indeterminate'\n\n /\n When true, indicates that the user must check the checkbox before the\n * owning form can be submitted.\n /\n required?: boolean\n\n /\n The name of the checkbox. Submitted with its owning form as part of a\n * name/value pair.\n /\n name?: string\n\n /\n The value given as data when submitted with a name.\n /\n value?: string\n\n /\n When true, prevents the user from interacting with the checkbox.\n /\n disabled?: boolean\n\n /\n Event handler called when the checked state equals true.\n /\n onChecked?: () => void\n\n /\n Event handler called when the checked state equals false.\n /\n onUnchecked?: () => void\n\n /\n When true, prevents the user from interacting with the checkbox but focus\n * is still possible.\n */\n 'aria-disabled'?: Booleanish\n}\n\nexport const Checkbox = React.forwardRef<\n ElementRef<typeof StyledCheckbox>,\n CheckboxProps\n>(\n (\n {\n 'aria-disabled': ariaDisabled,\n checked,\n defaultChecked,\n disabled,\n onChecked,\n onUnchecked,\n onClick,\n onKeyDown,\n size = 'large',\n variant = 'solid-prominent',\n ...restProps\n },\n forwardRef\n ) => {\n const [checkedState, setCheckedState] = useState<CheckboxProps['checked']>(\n defaultChecked ?? false\n )\n const internalChecked = checked ?? checkedState\n const isAriaDisabled = booleanify(ariaDisabled ?? false)\n const disabledUnchecked =\n (disabled === true \|\| isAriaDisabled) && internalChecked === false\n const checkedStateEvents = {\n true: onChecked,\n false: onUnchecked,\n }\n\n return (\n <StyledCheckbox\n {...restProps}\n aria-disabled={ariaDisabled}\n checked={internalChecked}\n defaultChecked={defaultChecked}\n disabled={disabled}\n size={size}\n variant={variant}\n onClick={e => {\n if (isAriaDisabled) {\n e.preventDefault()\n return\n }\n onClick?.(e)\n }}\n onCheckedChange={(checked: boolean) => {\n setCheckedState(checked)\n\n checkedStateEvents[`${checked}`]?.()\n }}\n ref={forwardRef}\n >\n <StyledCheckboxContent>\n <RadixIndicator>\n {internalChecked === 'indeterminate' && (\n <StyledIndeterminateMark size={size} />\n )}\n {internalChecked === true && <StyledCheckMark size={size} />}\n </RadixIndicator>\n {disabledUnchecked && (\n <StyledDisabledMark\n weight={size === 'small' ? 'thin' : undefined}\n size={size}\n />\n )}\n </StyledCheckboxContent>\n </StyledCheckbox>\n )\n }\n)\n"],"names":["checked","RadixIndicator"],"mappings":"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"}
1	+ {"version":3,"file":"module.js","sources":["../src/checkbox.styled.tsx","../src/checkbox.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Root } from '@radix-ui/react-checkbox'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport {\n IconProhibit,\n IconCheckMark,\n IconMinus,\n} from '@mirohq/design-system-icons'\nimport type { StrictComponentProps } from '@mirohq/design-system-stitches'\n\nexport const StyledCheckboxContent = styled(Primitive.div, {\n display: 'block',\n pointerEvents: 'none',\n borderRadius: '$50',\n position: 'relative',\n margin: 'auto',\n boxSizing: 'border-box',\n})\n\nconst checkboxContentSelector = `& ${StyledCheckboxContent}`\n\nconst checkedAndIndeterminate =\n '&[data-state=\"checked\"], &[data-state=\"indeterminate\"]'\nconst ariaDisabledCheckedIndeterminate = [\n '&[aria-disabled=\"true\"][data-state=\"checked\"]',\n '&:disabled[data-state=\"checked\"]',\n '&[aria-disabled=\"true\"][data-state=\"indeterminate\"]',\n '&:disabled[data-state=\"indeterminate\"]',\n].join(' ,')\nconst hoverCheckedIndeterminate =\n '&:hover[data-state=\"checked\"], &:hover[data-state=\"indeterminate\"]'\nconst ariaDisabledUnChecked =\n '&[aria-disabled=\"true\"][data-state=\"unchecked\"], &:disabled[data-state=\"unchecked\"]'\nconst hoverCheckedIndeterminateDisabled = [\n '&:hover[data-state=\"checked\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"checked\"]&:disabled',\n '&:hover[data-state=\"indeterminate\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"indeterminate\"]&:disabled',\n].join(' ,')\n\nconst hoverAriaDisabled = [\n '&:hover[data-state=\"unchecked\"][aria-disabled=\"true\"]',\n '&:hover[data-state=\"unchecked\"]&:disabled',\n ...hoverCheckedIndeterminateDisabled.split(' ,'),\n].join(' ,')\n\nexport const StyledCheckbox = styled(Root, {\n all: 'unset',\n square: '$6',\n color: '$icon-primary-inverted',\n cursor: 'pointer',\n\n '&[aria-disabled=\"true\"], &:disabled': {\n cursor: 'default',\n },\n '&:focus': {\n [checkboxContentSelector]: {\n boxShadow: '$focus-controls',\n },\n },\n [hoverCheckedIndeterminateDisabled]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n },\n },\n\n [hoverAriaDisabled]: {\n [checkboxContentSelector]: {\n color: '$icon-neutrals-disabled',\n },\n },\n [ariaDisabledCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n color: '$icon-neutrals-disabled',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n color: '$icon-neutrals-disabled',\n },\n },\n variants: {\n variant: {\n 'solid-prominent': {\n '&[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n border: '1px solid $border-neutrals-controls',\n },\n },\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-prominent',\n color: '$icon-primary-inverted',\n },\n },\n [hoverCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-prominent-hover',\n },\n },\n '&:hover[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n border: '1px solid $border-primary',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n border: '1px solid $border-neutrals-controls-disabled',\n },\n },\n },\n 'solid-subtle': {\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle',\n color: '$icon-primary',\n },\n },\n '&[data-state=\"unchecked\"]': {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle',\n },\n },\n [`${hoverCheckedIndeterminate}, &:hover[data-state=\"unchecked\"]`]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-primary-subtle-hover',\n color: '$icon-primary-hover',\n },\n },\n [ariaDisabledUnChecked]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals-controls-disabled',\n },\n },\n },\n ghost: {\n [checkedAndIndeterminate]: {\n [checkboxContentSelector]: {\n color: '$icon-primary',\n },\n },\n [hoverCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n color: '$icon-primary-hover',\n },\n },\n [ariaDisabledCheckedIndeterminate]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n },\n },\n [hoverCheckedIndeterminateDisabled]: {\n [checkboxContentSelector]: {\n backgroundColor: '$background-neutrals',\n },\n },\n },\n },\n size: {\n large: {\n [checkboxContentSelector]: {\n square: '$5',\n },\n },\n small: {\n [checkboxContentSelector]: {\n square: '$4',\n },\n },\n },\n },\n})\n\nconst markStyles = {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%,-50%)',\n variants: {\n size: {\n large: { width: '18px' },\n small: { width: '12px' },\n },\n },\n}\n\nexport const StyledDisabledMark = styled(IconProhibit, markStyles)\n\nexport const StyledCheckMark = styled(IconCheckMark, markStyles)\n\nexport const StyledIndeterminateMark = styled(IconMinus, markStyles)\n\nexport type StyledCheckboxProps = StrictComponentProps<typeof StyledCheckbox>\n","import React, { useState } from 'react'\nimport { booleanify } from '@mirohq/design-system-utils'\nimport { Indicator as RadixIndicator } from '@radix-ui/react-checkbox'\nimport type { ElementRef } from 'react'\nimport type { Booleanish } from '@mirohq/design-system-types'\n\nimport {\n StyledCheckboxContent,\n StyledCheckbox,\n StyledCheckMark,\n StyledDisabledMark,\n StyledIndeterminateMark,\n} from './checkbox.styled'\nimport type { StyledCheckboxProps } from './checkbox.styled'\n\nexport interface CheckboxProps extends StyledCheckboxProps {\n /*\n The checked state of the checkbox when it is initially rendered. Use when\n * you do not need to control its checked state.\n /\n defaultChecked?: boolean\n\n /\n The style of the checkbox.\n /\n variant?: StyledCheckboxProps['variant']\n\n /\n The size of the checkbox.\n /\n size?: StyledCheckboxProps['size']\n\n /\n The controlled checked state of the checkbox. Must be used in conjunction\n * with onChecked and onUnchecked.\n /\n checked?: boolean \| 'indeterminate'\n\n /\n When true, indicates that the user must check the checkbox before the\n * owning form can be submitted.\n /\n required?: boolean\n\n /\n The name of the checkbox. Submitted with its owning form as part of a\n * name/value pair.\n /\n name?: string\n\n /\n The value given as data when submitted with a name.\n /\n value?: string\n\n /\n When true, prevents the user from interacting with the checkbox.\n /\n disabled?: boolean\n\n /\n Event handler called when the checked state equals true.\n /\n onChecked?: () => void\n\n /\n Event handler called when the checked state equals false.\n /\n onUnchecked?: () => void\n\n /\n When true, prevents the user from interacting with the checkbox but focus\n * is still possible.\n */\n 'aria-disabled'?: Booleanish\n}\n\nexport const Checkbox = React.forwardRef<\n ElementRef<typeof StyledCheckbox>,\n CheckboxProps\n>(\n (\n {\n 'aria-disabled': ariaDisabled,\n checked,\n defaultChecked,\n disabled,\n onChecked,\n onUnchecked,\n onClick,\n onKeyDown,\n size = 'large',\n variant = 'solid-prominent',\n ...restProps\n },\n forwardRef\n ) => {\n const [checkedState, setCheckedState] = useState<CheckboxProps['checked']>(\n defaultChecked ?? false\n )\n const internalChecked = checked ?? checkedState\n const isAriaDisabled = booleanify(ariaDisabled ?? false)\n const disabledUnchecked =\n (disabled === true \|\| isAriaDisabled) && internalChecked === false\n const checkedStateEvents = {\n true: onChecked,\n false: onUnchecked,\n }\n\n return (\n <StyledCheckbox\n {...restProps}\n aria-disabled={ariaDisabled}\n checked={internalChecked}\n defaultChecked={defaultChecked}\n disabled={disabled}\n size={size}\n variant={variant}\n onClick={e => {\n if (isAriaDisabled) {\n e.preventDefault()\n return\n }\n onClick?.(e)\n }}\n onCheckedChange={(checked: boolean) => {\n setCheckedState(checked)\n\n checkedStateEvents[`${checked}`]?.()\n }}\n ref={forwardRef}\n >\n <StyledCheckboxContent>\n <RadixIndicator>\n {internalChecked === 'indeterminate' && (\n <StyledIndeterminateMark size={size} />\n )}\n {internalChecked === true && <StyledCheckMark size={size} />}\n </RadixIndicator>\n {disabledUnchecked && (\n <StyledDisabledMark\n weight={size === 'small' ? 'thin' : undefined}\n size={size}\n />\n )}\n </StyledCheckboxContent>\n </StyledCheckbox>\n )\n }\n)\n"],"names":["checked","RadixIndicator"],"mappings":"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"}

package/dist/types.d.ts CHANGED Viewed

@@ -7,7 +7,7 @@ import { StrictComponentProps } from '@mirohq/design-system-stitches';
 import * as _stitches_react_types_css_util from '@stitches/react/types/css-util';
 import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
-declare const StyledCheckbox: react.ForwardRefExoticComponent<Pick<Omit<{
+declare const StyledCheckbox: react.ForwardRefExoticComponent<Omit<Omit<{
     variant?: "solid-prominent" | "solid-subtle" | "ghost" | undefined;
     size?: "small" | "large" | undefined;
 }, "size" | "variant"> & _stitches_react_types_styled_component.TransformProps<{
@@ -460,7 +460,7 @@ declare const StyledCheckbox: react.ForwardRefExoticComponent<Pick<Omit<{
     }> | undefined;
 }> & {
     children?: react.ReactNode;
-} & _mirohq_design_system_stitches.CustomStylesProps, "form" | "slot" | "title" | "children" | "color" | "translate" | "hidden" | "size" | "prefix" | "asChild" | "autoFocus" | "checked" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "placeholder" | "required" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | keyof _mirohq_design_system_stitches.CustomStylesProps | "variant" | "onCheckedChange"> & react.RefAttributes<HTMLButtonElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_radix_ui_react_checkbox.CheckboxProps & react.RefAttributes<HTMLButtonElement>>, {
+} & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLButtonElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_radix_ui_react_checkbox.CheckboxProps & react.RefAttributes<HTMLButtonElement>>, {
     variant?: "solid-prominent" | "solid-subtle" | "ghost" | undefined;
     size?: "small" | "large" | undefined;
 }, {}>;
@@ -517,6 +517,6 @@ interface CheckboxProps extends StyledCheckboxProps {
      */
     'aria-disabled'?: Booleanish;
 }
-declare const Checkbox: react__default.ForwardRefExoticComponent<Pick<CheckboxProps, "form" | "slot" | "title" | "children" | "color" | "translate" | "hidden" | "size" | "css" | "prefix" | "asChild" | "UNSAFE_style" | "autoFocus" | "checked" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "placeholder" | "required" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "variant" | "onChecked" | "onUnchecked"> & react__default.RefAttributes<HTMLButtonElement>>;
+declare const Checkbox: react__default.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & react__default.RefAttributes<HTMLButtonElement>>;
 export { Checkbox, CheckboxProps };

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@mirohq/design-system-checkbox",
-  "version": "1.1.30",
+  "version": "1.1.32",
   "description": "",
   "author": "Miro",
   "source": "src/index.ts",
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@radix-ui/react-checkbox": "^1.0.0",
-    "@mirohq/design-system-icons": "^0.25.0",
+    "@mirohq/design-system-icons": "^0.25.2",
     "@mirohq/design-system-primitive": "^1.1.0",
     "@mirohq/design-system-stitches": "^2.3.3",
     "@mirohq/design-system-types": "^0.5.0"