@kommo-crm/crm-react-ui-kit 1.1.1-beta.0 → 1.1.1-beta.3

package/dist/components/CheckboxGroup/CheckboxGroup.context.d.ts

@@ -1,5 +1,5 @@
-import { CheckboxContextProps } from './CheckboxGroup.props';
+import { type CheckboxContextProps } from './CheckboxGroup.props';
 declare const DISPLAY_NAME = "CheckboxGroup";
-declare const CheckboxGroupProvider: import('../../lib/react/createComponentContext').ContextProps<CheckboxContextProps>, useCheckboxGroupContext: (consumerName: string) => CheckboxContextProps;
+declare const CheckboxGroupProvider: import("../../lib/react/createComponentContext").ContextProps<CheckboxContextProps>, useCheckboxGroupContext: (consumerName: string) => CheckboxContextProps;
 export { CheckboxGroupProvider, useCheckboxGroupContext, DISPLAY_NAME };
 //# sourceMappingURL=CheckboxGroup.context.d.ts.map

package/dist/components/CheckboxGroup/CheckboxGroup.context.js

@@ -1,7 +1,4 @@
-import { createComponentContext as o } from "../../lib/react/createComponentContext/createComponentContext.js";
-const e = "CheckboxGroup", [r, c] = o(e);
-export {
-  r as CheckboxGroupProvider,
-  e as DISPLAY_NAME,
-  c as useCheckboxGroupContext
-};
+import { createComponentContext } from 'src/lib/react';
+const DISPLAY_NAME = 'CheckboxGroup';
+const [CheckboxGroupProvider, useCheckboxGroupContext] = createComponentContext(DISPLAY_NAME);
+export { CheckboxGroupProvider, useCheckboxGroupContext, DISPLAY_NAME };

package/dist/components/CheckboxGroup/CheckboxGroup.d.ts

@@ -1,3 +1,3 @@
-import { CheckboxGroupType } from './CheckboxGroup.props';
+import { type CheckboxGroupType } from './CheckboxGroup.props';
 export declare const CheckboxGroup: CheckboxGroupType;
 //# sourceMappingURL=CheckboxGroup.d.ts.map

package/dist/components/CheckboxGroup/CheckboxGroup.js

@@ -1,53 +1,25 @@
-import { jsx as r } from "react/jsx-runtime";
-import { forwardRef as x } from "react";
-import { c as k } from "../../index-L8X2o7IH.mjs";
-import { useThemeClassName as u } from "../../hooks/useThemeClassName/useThemeClassName.js";
-import { Label as _ } from "../Label/Label.js";
-import { useCheckboxGroupState as C } from "./hooks/useCheckboxGroupState.js";
-import { CheckboxGroupProvider as d, DISPLAY_NAME as g } from "./CheckboxGroup.context.js";
-import { Checkbox as A } from "./components/Checkbox/Checkbox.js";
-import { CheckboxSelectAll as N } from "./components/CheckboxSelectAll/CheckboxSelectAll.js";
-import { ItemRootSelectAll as S } from "./components/CheckboxSelectAll/ItemRootSelectAll.js";
-import { ItemRoot as z } from "./components/ItemRoot/ItemRoot.js";
-import '../../assets/CheckboxGroup.css';const I = "_checkbox_group_12s2l_1", R = "_horizontal_12s2l_11", t = {
-  checkbox_group: I,
-  horizontal: R
-}, o = x((m, c) => {
-  const {
-    className: l,
-    isDisabled: e = !1,
-    theme: s,
-    children: a,
-    orientation: i = "vertical",
-    onChange: h,
-    ...p
-  } = m, n = u(s), { register: b, state: f } = C({ onChange: h, isDisabled: e });
-  return /* @__PURE__ */ r(
-    d,
-    {
-      values: f,
-      register: b,
-      isDisabled: e,
-      children: /* @__PURE__ */ r(
-        "div",
-        {
-          className: k(t.checkbox_group, n, l, {
-            [t.horizontal]: i === "horizontal"
-          }),
-          ref: c,
-          ...p,
-          children: a
-        }
-      )
-    }
-  );
+import React, { forwardRef } from 'react';
+import cx from 'classnames';
+import { useThemeClassName } from 'src/hooks/useThemeClassName';
+import { Label } from '../Label';
+import { useCheckboxGroupState } from './hooks';
+import { CheckboxGroupProvider, DISPLAY_NAME } from './CheckboxGroup.context';
+import { Checkbox } from './components/Checkbox';
+import { CheckboxSelectAll, ItemRootSelectAll, } from './components/CheckboxSelectAll';
+import { ItemRoot } from './components/ItemRoot';
+import s from './CheckboxGroup.module.css';
+export const CheckboxGroup = forwardRef((props, ref) => {
+    const { className, isDisabled = false, theme, children, orientation = 'vertical', onChange, ...rest } = props;
+    const themeClassName = useThemeClassName(theme);
+    const { register, state } = useCheckboxGroupState({ onChange, isDisabled });
+    return (React.createElement(CheckboxGroupProvider, { values: state, register: register, isDisabled: isDisabled },
+        React.createElement("div", { className: cx(s.checkbox_group, themeClassName, className, {
+                [s.horizontal]: orientation === 'horizontal',
+            }), ref: ref, ...rest }, children)));
 });
-o.displayName = g;
-o.ItemRoot = z;
-o.Checkbox = A;
-o.Label = _;
-o.CheckboxSelectAll = N;
-o.ItemRootSelectAll = S;
-export {
-  o as CheckboxGroup
-};
+CheckboxGroup.displayName = DISPLAY_NAME;
+CheckboxGroup.ItemRoot = ItemRoot;
+CheckboxGroup.Checkbox = Checkbox;
+CheckboxGroup.Label = Label;
+CheckboxGroup.CheckboxSelectAll = CheckboxSelectAll;
+CheckboxGroup.ItemRootSelectAll = ItemRootSelectAll;

package/dist/components/CheckboxGroup/CheckboxGroup.props.d.ts

@@ -1,9 +1,9 @@
-import { default as React, HTMLAttributes } from 'react';
-import { LabelProps } from '../Label';
-import { CheckboxGroupThemeType } from './CheckboxGroup.themes';
-import { CheckboxProps } from './components/Checkbox/Checkbox.props';
-import { ItemRootProps } from './components/ItemRoot';
-import { ItemRootSelectAllProps } from './components/CheckboxSelectAll/ItemRootSelectAll.props';
+import React, { type HTMLAttributes } from 'react';
+import { type LabelProps } from '../Label';
+import { type CheckboxGroupThemeType } from './CheckboxGroup.themes';
+import { type CheckboxProps } from './components/Checkbox/Checkbox.props';
+import { type ItemRootProps } from './components/ItemRoot';
+import { type ItemRootSelectAllProps } from './components/CheckboxSelectAll/ItemRootSelectAll.props';
 export type LabelGroupOrientation = 'horizontal' | 'vertical';
 export type CheckboxGroupChangeEvent = (values: CheckboxStateType[], changedValue: InternalCheckboxGroupChangeEvent) => void;
 export type InternalCheckboxGroupChangeEvent = {

package/dist/components/CheckboxGroup/CheckboxGroup.props.js

@@ -1 +1 @@
-
+export {};

package/dist/components/CheckboxGroup/CheckboxGroup.themes.js

@@ -1,6 +1,3 @@
-const c = {
-  "--crm-ui-kit-checkbox-group-spacing": "8px"
-};
-export {
-  c as CheckboxGroupTheme
+export const CheckboxGroupTheme = {
+    '--crm-ui-kit-checkbox-group-spacing': '8px',
 };

package/dist/components/CheckboxGroup/components/Checkbox/Checkbox.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from 'react';
-import { CheckboxProps } from './Checkbox.props';
+import React from 'react';
+import { type CheckboxProps } from './Checkbox.props';
 export declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
 //# sourceMappingURL=Checkbox.d.ts.map

package/dist/components/CheckboxGroup/components/Checkbox/Checkbox.js

@@ -1,34 +1,17 @@
-import { jsx as k } from "react/jsx-runtime";
-import { forwardRef as p } from "react";
-import { Checkbox as f } from "../../../Checkbox/Checkbox.js";
-import { useCheckboxGroupContext as u } from "../../CheckboxGroup.context.js";
-import { useCheckboxItemRootContext as g } from "../ItemRoot/ItemRoot.context.js";
-const e = "CheckboxGroup.Checkbox", D = p((t, a) => {
-  var s;
-  const { theme: n, className: c, ...r } = t, { values: i, isDisabled: m } = u(e), {
-    isDisabled: h,
-    name: o,
-    value: C,
-    onChange: b
-  } = g(e), l = m || h, x = !!((s = i.get(o || "")) != null && s.isChecked);
-  return /* @__PURE__ */ k(
-    f,
-    {
-      ref: a,
-      className: c,
-      name: o,
-      value: C,
-      theme: n,
-      onChange: (d) => {
-        b({ type: "checkbox", name: d.target.name });
-      },
-      isChecked: x,
-      isDisabled: l,
-      ...r
-    }
-  );
+import React, { forwardRef } from 'react';
+import { Checkbox as CheckboxCore } from 'src/components/Checkbox/Checkbox';
+import { useCheckboxGroupContext } from '../../CheckboxGroup.context';
+import { useCheckboxItemRootContext } from '../ItemRoot/ItemRoot.context';
+const DISPLAY_NAME = 'CheckboxGroup.Checkbox';
+export const Checkbox = forwardRef((props, ref) => {
+    const { theme, className, ...rest } = props;
+    const { values, isDisabled: isGlobalDisabled } = useCheckboxGroupContext(DISPLAY_NAME);
+    const { isDisabled: isItemRootIsDisabled, name, value, onChange, } = useCheckboxItemRootContext(DISPLAY_NAME);
+    const isDisabled = isGlobalDisabled || isItemRootIsDisabled;
+    const isChecked = Boolean(values.get(name || '')?.isChecked);
+    const handleChange = (e) => {
+        onChange({ type: 'checkbox', name: e.target.name });
+    };
+    return (React.createElement(CheckboxCore, { ref: ref, className: className, name: name, value: value, theme: theme, onChange: handleChange, isChecked: isChecked, isDisabled: isDisabled, ...rest }));
 });
-D.displayName = e;
-export {
-  D as Checkbox
-};
+Checkbox.displayName = DISPLAY_NAME;

package/dist/components/CheckboxGroup/components/Checkbox/Checkbox.props.d.ts

@@ -1,3 +1,3 @@
-import { CheckboxProps as CheckboxCoreProps } from '../../../Checkbox/Checkbox.props';
+import { type CheckboxProps as CheckboxCoreProps } from 'src/components/Checkbox/Checkbox.props';
 export type CheckboxProps = Omit<CheckboxCoreProps, 'onChange' | 'value' | 'isDisabled' | 'isChecked' | 'isDefaultChecked'>;
 //# sourceMappingURL=Checkbox.props.d.ts.map

package/dist/components/CheckboxGroup/components/Checkbox/Checkbox.props.js

@@ -1 +1 @@
-
+export {};

package/dist/components/CheckboxGroup/components/Checkbox/index.js

@@ -1,4 +1 @@
-import { Checkbox as r } from "./Checkbox.js";
-export {
-  r as Checkbox
-};
+export { Checkbox } from './Checkbox';

package/dist/components/CheckboxGroup/components/CheckboxSelectAll/CheckboxSelectAll.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from 'react';
-import { CheckboxProps } from '../Checkbox/Checkbox.props';
+import React from 'react';
+import { type CheckboxProps } from '../Checkbox/Checkbox.props';
 export declare const CheckboxSelectAll: React.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
 //# sourceMappingURL=CheckboxSelectAll.d.ts.map

package/dist/components/CheckboxGroup/components/CheckboxSelectAll/CheckboxSelectAll.js

@@ -1,37 +1,26 @@
-import { jsx as d } from "react/jsx-runtime";
-import { forwardRef as k } from "react";
-import { Checkbox as p } from "../../../Checkbox/Checkbox.js";
-import { useCheckboxGroupContext as b } from "../../CheckboxGroup.context.js";
-import { useCheckboxItemRootSelectAllContext as u } from "./ItemRootSelectAll.context.js";
-const t = "CheckboxGroup.CheckboxSelectAll", o = "selectAll", x = k((a, l) => {
-  const { theme: r, className: n, ...c } = a, { values: s, isDisabled: m } = b(t), { onChange: h, isDisabled: i } = u(t);
-  return /* @__PURE__ */ d(
-    p,
-    {
-      ref: l,
-      className: n,
-      onChange: () => {
-        h({ type: o, name: o });
-      },
-      theme: r,
-      value: o,
-      isDisabled: m || i,
-      ...(() => {
-        const C = Array.from(s.values()).every(
-          (e) => e.isChecked
-        ) ? "mark" : "indeterminate";
+import React, { forwardRef } from 'react';
+import { Checkbox } from 'src/components/Checkbox/Checkbox';
+import { useCheckboxGroupContext } from '../../CheckboxGroup.context';
+import { useCheckboxItemRootSelectAllContext } from './ItemRootSelectAll.context';
+const DISPLAY_NAME = 'CheckboxGroup.CheckboxSelectAll';
+const SELECT_ALL = 'selectAll';
+export const CheckboxSelectAll = forwardRef((props, ref) => {
+    const { theme, className, ...rest } = props;
+    const { values, isDisabled: isGlobalDisabled } = useCheckboxGroupContext(DISPLAY_NAME);
+    const { onChange, isDisabled } = useCheckboxItemRootSelectAllContext(DISPLAY_NAME);
+    const handleChange = () => {
+        onChange({ type: SELECT_ALL, name: SELECT_ALL });
+    };
+    const getPropsBasedOnInternalState = () => {
+        const allChecked = Array.from(values.values()).every((checkbox) => checkbox.isChecked);
+        const checkedStyle = allChecked
+            ? 'mark'
+            : 'indeterminate';
         return {
-          isChecked: Array.from(s.values()).some(
-            (e) => e.isChecked
-          ),
-          checkedStyle: C
+            isChecked: Array.from(values.values()).some((checkbox) => checkbox.isChecked),
+            checkedStyle,
         };
-      })(),
-      ...c
-    }
-  );
+    };
+    return (React.createElement(Checkbox, { ref: ref, className: className, onChange: handleChange, theme: theme, value: SELECT_ALL, isDisabled: isGlobalDisabled || isDisabled, ...getPropsBasedOnInternalState(), ...rest }));
 });
-x.displayName = t;
-export {
-  x as CheckboxSelectAll
-};
+CheckboxSelectAll.displayName = DISPLAY_NAME;

package/dist/components/CheckboxGroup/components/CheckboxSelectAll/ItemRootSelectAll.context.d.ts

@@ -1,5 +1,5 @@
-import { CheckboxItemSelectAllContextValue } from './ItemRootSelectAll.props';
+import { type CheckboxItemSelectAllContextValue } from './ItemRootSelectAll.props';
 declare const DISPLAY_NAME = "CheckboxGroup.ItemRootSelectAll";
-declare const CheckboxItemRootSelectAllProvider: import('../../../../lib/react/createComponentContext').ContextProps<CheckboxItemSelectAllContextValue>, useCheckboxItemRootSelectAllContext: (consumerName: string) => NonNullable<CheckboxItemSelectAllContextValue>;
+declare const CheckboxItemRootSelectAllProvider: import("../../../../lib/react/createComponentContext").ContextProps<CheckboxItemSelectAllContextValue>, useCheckboxItemRootSelectAllContext: (consumerName: string) => NonNullable<CheckboxItemSelectAllContextValue>;
 export { CheckboxItemRootSelectAllProvider, useCheckboxItemRootSelectAllContext, DISPLAY_NAME, };
 //# sourceMappingURL=ItemRootSelectAll.context.d.ts.map

package/dist/components/CheckboxGroup/components/CheckboxSelectAll/ItemRootSelectAll.context.js

@@ -1,7 +1,4 @@
-import { createComponentContext as e } from "../../../../lib/react/createComponentContext/createComponentContext.js";
-const o = "CheckboxGroup.ItemRootSelectAll", [c, l] = e(o);
-export {
-  c as CheckboxItemRootSelectAllProvider,
-  o as DISPLAY_NAME,
-  l as useCheckboxItemRootSelectAllContext
-};
+import { createComponentContext } from 'src/lib/react';
+const DISPLAY_NAME = 'CheckboxGroup.ItemRootSelectAll';
+const [CheckboxItemRootSelectAllProvider, useCheckboxItemRootSelectAllContext] = createComponentContext(DISPLAY_NAME);
+export { CheckboxItemRootSelectAllProvider, useCheckboxItemRootSelectAllContext, DISPLAY_NAME, };

package/dist/components/CheckboxGroup/components/CheckboxSelectAll/ItemRootSelectAll.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from 'react';
-import { ItemRootSelectAllProps } from './ItemRootSelectAll.props';
+import React from 'react';
+import { type ItemRootSelectAllProps } from './ItemRootSelectAll.props';
 export declare const ItemRootSelectAll: React.FC<ItemRootSelectAllProps>;
 //# sourceMappingURL=ItemRootSelectAll.d.ts.map

package/dist/components/CheckboxGroup/components/CheckboxSelectAll/ItemRootSelectAll.js

@@ -1,41 +1,22 @@
-import { jsx as o } from "react/jsx-runtime";
-import { c as p } from "../../../../index-L8X2o7IH.mjs";
-import { useThemeClassName as d } from "../../../../hooks/useThemeClassName/useThemeClassName.js";
-import { useCheckboxGroupContext as f } from "../../CheckboxGroup.context.js";
-import { DISPLAY_NAME as r, CheckboxItemRootSelectAllProvider as n } from "./ItemRootSelectAll.context.js";
-import { s as t } from "../../../../ItemRoot.module-DaaOqYPx.mjs";
-const x = ({
-  children: m,
-  theme: s,
-  className: l,
-  isDisabled: e
-}) => {
-  const i = d(s), { isDisabled: a, register: c } = f(r);
-  return /* @__PURE__ */ o(
-    n,
-    {
-      isDisabled: e,
-      ...c("selectAll"),
-      children: /* @__PURE__ */ o(
-        "div",
-        {
-          className: p(t.item_root, i, l, {
-            /**
-             * If `isDisabled` was passed directly to the component
-             * Blocking a specific Checkbox.
-             *
-             * If passed to the CheckboxGroup component
-             * We block all Checkboxes.
-             */
-            [t.disabled]: a || e
-          }),
-          children: m
-        }
-      )
-    }
-  );
-};
-x.displayName = r;
-export {
-  x as ItemRootSelectAll
+import React from 'react';
+import cx from 'classnames';
+import { useThemeClassName } from 'src/hooks/useThemeClassName';
+import { useCheckboxGroupContext } from '../../CheckboxGroup.context';
+import { CheckboxItemRootSelectAllProvider, DISPLAY_NAME, } from './ItemRootSelectAll.context';
+import s from '../ItemRoot/ItemRoot.module.css';
+export const ItemRootSelectAll = ({ children, theme, className, isDisabled, }) => {
+    const themeClassName = useThemeClassName(theme);
+    const { isDisabled: isGlobalDisabled, register } = useCheckboxGroupContext(DISPLAY_NAME);
+    return (React.createElement(CheckboxItemRootSelectAllProvider, { isDisabled: isDisabled, ...register('selectAll') },
+        React.createElement("div", { className: cx(s.item_root, themeClassName, className, {
+                /**
+                 * If `isDisabled` was passed directly to the component
+                 * Blocking a specific Checkbox.
+                 *
+                 * If passed to the CheckboxGroup component
+                 * We block all Checkboxes.
+                 */
+                [s.disabled]: isGlobalDisabled || isDisabled,
+            }) }, children)));
 };
+ItemRootSelectAll.displayName = DISPLAY_NAME;

package/dist/components/CheckboxGroup/components/CheckboxSelectAll/ItemRootSelectAll.props.d.ts

@@ -1,5 +1,5 @@
-import { InternalCheckboxGroupChangeEvent } from '../../CheckboxGroup.props';
-import { ItemRootProps } from '../ItemRoot';
+import { type InternalCheckboxGroupChangeEvent } from '../../CheckboxGroup.props';
+import { type ItemRootProps } from '../ItemRoot';
 export type ItemRootSelectAllProps = Omit<ItemRootProps, 'name' | 'isDefaultChecked' | 'value'>;
 export type CheckboxItemSelectAllContextValue = Omit<ItemRootSelectAllProps, 'theme' | 'children' | 'className'> & {
     /**

package/dist/components/CheckboxGroup/components/CheckboxSelectAll/ItemRootSelectAll.props.js

@@ -1 +1 @@
-
+export {};

package/dist/components/CheckboxGroup/components/CheckboxSelectAll/index.js

@@ -1,6 +1,2 @@
-import { CheckboxSelectAll as l } from "./CheckboxSelectAll.js";
-import { ItemRootSelectAll as r } from "./ItemRootSelectAll.js";
-export {
-  l as CheckboxSelectAll,
-  r as ItemRootSelectAll
-};
+export { CheckboxSelectAll } from './CheckboxSelectAll';
+export { ItemRootSelectAll } from './ItemRootSelectAll';

package/dist/components/CheckboxGroup/components/ItemRoot/ItemRoot.context.d.ts

@@ -1,5 +1,5 @@
-import { CheckboxItemContextProps } from './ItemRoot.props';
+import { type CheckboxItemContextProps } from './ItemRoot.props';
 declare const DISPLAY_NAME = "CheckboxGroup.ItemRoot";
-declare const CheckboxItemRootProvider: import('../../../../lib/react/createComponentContext').ContextProps<CheckboxItemContextProps>, useCheckboxItemRootContext: (consumerName: string) => NonNullable<CheckboxItemContextProps>;
+declare const CheckboxItemRootProvider: import("../../../../lib/react/createComponentContext").ContextProps<CheckboxItemContextProps>, useCheckboxItemRootContext: (consumerName: string) => NonNullable<CheckboxItemContextProps>;
 export { CheckboxItemRootProvider, useCheckboxItemRootContext, DISPLAY_NAME };
 //# sourceMappingURL=ItemRoot.context.d.ts.map

package/dist/components/CheckboxGroup/components/ItemRoot/ItemRoot.context.js

@@ -1,7 +1,4 @@
-import { createComponentContext as o } from "../../../../lib/react/createComponentContext/createComponentContext.js";
-const t = "CheckboxGroup.ItemRoot", [r, c] = o(t);
-export {
-  r as CheckboxItemRootProvider,
-  t as DISPLAY_NAME,
-  c as useCheckboxItemRootContext
-};
+import { createComponentContext } from 'src/lib/react';
+const DISPLAY_NAME = 'CheckboxGroup.ItemRoot';
+const [CheckboxItemRootProvider, useCheckboxItemRootContext] = createComponentContext(DISPLAY_NAME);
+export { CheckboxItemRootProvider, useCheckboxItemRootContext, DISPLAY_NAME };

package/dist/components/CheckboxGroup/components/ItemRoot/ItemRoot.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from 'react';
-import { ItemRootProps } from './ItemRoot.props';
+import React from 'react';
+import { type ItemRootProps } from './ItemRoot.props';
 export declare const ItemRoot: React.FC<ItemRootProps>;
 //# sourceMappingURL=ItemRoot.d.ts.map

package/dist/components/CheckboxGroup/components/ItemRoot/ItemRoot.js

@@ -1,36 +1,22 @@
-import { jsx as e } from "react/jsx-runtime";
-import { c as f } from "../../../../index-L8X2o7IH.mjs";
-import { useThemeClassName as n } from "../../../../hooks/useThemeClassName/useThemeClassName.js";
-import { useCheckboxGroupContext as x } from "../../CheckboxGroup.context.js";
-import { DISPLAY_NAME as r, CheckboxItemRootProvider as C } from "./ItemRoot.context.js";
-import { s as m } from "../../../../ItemRoot.module-DaaOqYPx.mjs";
-const N = ({
-  children: t,
-  theme: s,
-  className: i,
-  name: a,
-  value: d,
-  ...o
-}) => {
-  const l = n(s), { isDisabled: p, register: c } = x(r);
-  return /* @__PURE__ */ e(C, { value: d, ...c(a, o), children: /* @__PURE__ */ e(
-    "div",
-    {
-      className: f(m.item_root, l, i, {
-        /**
-         * If `isDisabled` was passed directly to the component
-         * Blocking a specific Checkbox.
-         *
-         * If passed to the CheckboxGroup component
-         * We block all Checkboxes.
-         */
-        [m.disabled]: p || o.isDisabled
-      }),
-      children: t
-    }
-  ) });
-};
-N.displayName = r;
-export {
-  N as ItemRoot
+import React from 'react';
+import cx from 'classnames';
+import { useThemeClassName } from 'src/hooks/useThemeClassName';
+import { useCheckboxGroupContext } from '../../CheckboxGroup.context';
+import { CheckboxItemRootProvider, DISPLAY_NAME } from './ItemRoot.context';
+import s from './ItemRoot.module.css';
+export const ItemRoot = ({ children, theme, className, name, value, ...checkboxProps }) => {
+    const themeClassName = useThemeClassName(theme);
+    const { isDisabled, register } = useCheckboxGroupContext(DISPLAY_NAME);
+    return (React.createElement(CheckboxItemRootProvider, { value: value, ...register(name, checkboxProps) },
+        React.createElement("div", { className: cx(s.item_root, themeClassName, className, {
+                /**
+                 * If `isDisabled` was passed directly to the component
+                 * Blocking a specific Checkbox.
+                 *
+                 * If passed to the CheckboxGroup component
+                 * We block all Checkboxes.
+                 */
+                [s.disabled]: isDisabled || checkboxProps.isDisabled,
+            }) }, children)));
 };
+ItemRoot.displayName = DISPLAY_NAME;

package/dist/components/CheckboxGroup/components/ItemRoot/ItemRoot.props.d.ts

@@ -1,5 +1,5 @@
-import { InternalCheckboxGroupChangeEvent } from '../../CheckboxGroup.props';
-import { ItemRootThemeType } from './ItemRoot.themes';
+import { type InternalCheckboxGroupChangeEvent } from '../../CheckboxGroup.props';
+import { type ItemRootThemeType } from './ItemRoot.themes';
 export type ItemRootProps = {
     /**
      * The unique name used to identify the `checkbox` element.

package/dist/components/CheckboxGroup/components/ItemRoot/ItemRoot.props.js

@@ -1 +1 @@
-
+export {};

package/dist/components/CheckboxGroup/components/ItemRoot/ItemRoot.themes.js

@@ -1,6 +1,3 @@
-const o = {
-  "--crm-ui-kit-checkbox-group-item-root-disabled-opacity": "var(--crm-ui-kit-disabled-opacity)"
-};
-export {
-  o as CheckboxGroupItemRootTheme
+export const CheckboxGroupItemRootTheme = {
+    '--crm-ui-kit-checkbox-group-item-root-disabled-opacity': 'var(--crm-ui-kit-disabled-opacity)',
 };

package/dist/components/CheckboxGroup/components/ItemRoot/index.js

@@ -1,6 +1,2 @@
-import { ItemRoot as t } from "./ItemRoot.js";
-import { CheckboxGroupItemRootTheme as r } from "./ItemRoot.themes.js";
-export {
-  r as CheckboxGroupItemRootTheme,
-  t as ItemRoot
-};
+export { ItemRoot } from './ItemRoot';
+export { CheckboxGroupItemRootTheme, } from './ItemRoot.themes';

package/dist/components/CheckboxGroup/hooks/index.js

@@ -1,4 +1 @@
-import { useCheckboxGroupState as r } from "./useCheckboxGroupState.js";
-export {
-  r as useCheckboxGroupState
-};
+export { useCheckboxGroupState } from './useCheckboxGroupState';

package/dist/components/CheckboxGroup/hooks/useCheckboxGroupState.d.ts

@@ -1,4 +1,4 @@
-import { RegisterHandlerType, CheckboxStateType, UseCheckboxGroupStateArgs } from '../CheckboxGroup.props';
+import { type RegisterHandlerType, type CheckboxStateType, type UseCheckboxGroupStateArgs } from '../CheckboxGroup.props';
 export declare const useCheckboxGroupState: ({ isDisabled, onChange, }: UseCheckboxGroupStateArgs) => {
     state: Map<string, CheckboxStateType>;
     register: RegisterHandlerType;