@spark-ui/components 13.1.4 → 13.2.0

package/dist/checkbox/index.mjs

@@ -1,42 +1,18 @@
-import {
-  Label
-} from "../chunk-HLXYG643.mjs";
-import {
-  Icon
-} from "../chunk-UMUMFMFB.mjs";
-import "../chunk-KEGAAGJW.mjs";
-import "../chunk-6QCEPQ3U.mjs";
-
-// src/checkbox/Checkbox.tsx
-import { useFormFieldControl } from "@spark-ui/components/form-field";
-import { useMergeRefs } from "@spark-ui/hooks/use-merge-refs";
-import { cx } from "class-variance-authority";
-import { useId, useMemo, useRef } from "react";
-
-// src/checkbox/CheckboxGroupContext.tsx
-import { createContext, useContext } from "react";
-var CheckboxGroupContext = createContext({});
-var useCheckboxGroup = () => {
-  const context = useContext(CheckboxGroupContext);
-  return context;
-};
-
-// src/checkbox/CheckboxInput.tsx
-import { Check } from "@spark-ui/icons/Check";
-import { Minus } from "@spark-ui/icons/Minus";
-import { Checkbox as Checkbox2 } from "radix-ui";
-
-// src/checkbox/CheckboxIndicator.tsx
-import { Checkbox } from "radix-ui";
-import { jsx } from "react/jsx-runtime";
-var CheckboxIndicatorPrimitive = Checkbox.CheckboxIndicator;
-var CheckboxIndicator = (props) => /* @__PURE__ */ jsx(CheckboxIndicatorPrimitive, { className: "flex size-full items-center justify-center", ...props });
-CheckboxIndicator.displayName = "CheckboxIndicator";
-
-// src/checkbox/CheckboxInput.styles.ts
-import { makeVariants } from "@spark-ui/internal-utils";
-import { cva } from "class-variance-authority";
-var checkboxInputStyles = cva(
+import { jsx as e, jsxs as E, Fragment as M } from "react/jsx-runtime";
+import { useFormFieldControl as D } from "@spark-ui/components/form-field";
+import { useMergeRefs as ae } from "@spark-ui/hooks/use-merge-refs";
+import { cva as V, cx as re } from "class-variance-authority";
+import { createContext as ne, useContext as oe, useId as A, useRef as X, useMemo as _, useEffect as ce } from "react";
+import { Check as ie } from "@spark-ui/icons/Check";
+import { Minus as se } from "@spark-ui/icons/Minus";
+import { Checkbox as B } from "radix-ui";
+import { I as de } from "../Icon-Ck-dhfLd.mjs";
+import { makeVariants as le } from "@spark-ui/internal-utils";
+import { Label as be } from "../label/index.mjs";
+import { useCombinedState as ue } from "@spark-ui/hooks/use-combined-state";
+const H = ne({}), he = () => oe(H), me = B.CheckboxIndicator, J = (a) => /* @__PURE__ */ e(me, { className: "flex size-full items-center justify-center", ...a });
+J.displayName = "CheckboxIndicator";
+const ke = V(
   [
     "size-sz-24 shrink-0 items-center justify-center rounded-sm border-md bg-transparent",
     "disabled:cursor-not-allowed disabled:opacity-dim-3 disabled:hover:ring-0",
@@ -49,7 +25,7 @@ var checkboxInputStyles = cva(
       /**
        * Color scheme of the checkbox.
        */
-      intent: makeVariants({
+      intent: le({
         main: [
           "text-on-main",
           "hover:ring-main-container",
@@ -119,34 +95,26 @@ var checkboxInputStyles = cva(
       intent: "basic"
     }
   }
-);
-
-// src/checkbox/CheckboxInput.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var CheckboxPrimitive = Checkbox2.Checkbox;
-var CheckboxInput = ({
-  className,
-  icon = /* @__PURE__ */ jsx2(Check, {}),
-  indeterminateIcon = /* @__PURE__ */ jsx2(Minus, {}),
-  intent,
-  checked,
-  ref,
-  ...others
-}) => /* @__PURE__ */ jsx2(
-  CheckboxPrimitive,
+), xe = B.Checkbox, K = ({
+  className: a,
+  icon: c = /* @__PURE__ */ e(ie, {}),
+  indeterminateIcon: b = /* @__PURE__ */ e(se, {}),
+  intent: u,
+  checked: n,
+  ref: s,
+  ...i
+}) => /* @__PURE__ */ e(
+  xe,
   {
-    ref,
-    className: checkboxInputStyles({ intent, className }),
-    checked,
-    ...others,
-    children: /* @__PURE__ */ jsx2(CheckboxIndicator, { children: /* @__PURE__ */ jsx2(Icon, { size: "sm", children: checked === "indeterminate" ? indeterminateIcon : icon }) })
+    ref: s,
+    className: ke({ intent: u, className: a }),
+    checked: n,
+    ...i,
+    children: /* @__PURE__ */ e(J, { children: /* @__PURE__ */ e(de, { size: "sm", children: n === "indeterminate" ? b : c }) })
   }
 );
-CheckboxInput.displayName = "CheckboxInput";
-
-// src/checkbox/CheckboxLabel.styles.ts
-import { cva as cva2 } from "class-variance-authority";
-var labelStyles = cva2("grow", {
+K.displayName = "CheckboxInput";
+const pe = V("grow", {
   variants: {
     disabled: {
       true: ["text-neutral/dim-2", "cursor-not-allowed"],
@@ -154,122 +122,80 @@ var labelStyles = cva2("grow", {
     }
   },
   defaultVariants: {
-    disabled: false
+    disabled: !1
   }
-});
-
-// src/checkbox/CheckboxLabel.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
-var CheckboxLabel = ({ disabled, ...others }) => /* @__PURE__ */ jsx3(Label, { className: labelStyles({ disabled }), ...others });
-CheckboxLabel.displayName = "CheckboxLabel";
-
-// src/checkbox/Checkbox.tsx
-import { Fragment, jsx as jsx4, jsxs } from "react/jsx-runtime";
-var ID_PREFIX = ":checkbox";
-var Checkbox3 = ({
-  id: idProp,
-  className,
-  intent: intentProp,
-  checked: checkedProp,
-  value,
-  disabled,
-  reverse = false,
-  onCheckedChange,
-  children,
-  ref: forwardedRef,
-  ...others
+}), O = ({ disabled: a, ...c }) => /* @__PURE__ */ e(be, { className: pe({ disabled: a }), ...c });
+O.displayName = "CheckboxLabel";
+const P = ":checkbox", fe = ({
+  id: a,
+  className: c,
+  intent: b,
+  checked: u,
+  value: n,
+  disabled: s,
+  reverse: i = !1,
+  onCheckedChange: g,
+  children: h,
+  ref: F,
+  ...z
 }) => {
-  const checkboxId = `${ID_PREFIX}-${useId()}`;
-  const innerId = idProp || checkboxId;
-  const innerLabelId = `${ID_PREFIX}-${useId()}`;
-  const field = useFormFieldControl();
-  const group = useCheckboxGroup();
-  const rootRef = useRef(null);
-  const ref = useMergeRefs(forwardedRef, rootRef);
-  const getCheckboxAttributes = ({
-    fieldState,
-    groupState,
-    checkboxIntent
+  const m = `${P}-${A()}`, k = a || m, x = `${P}-${A()}`, d = D(), t = he(), v = X(null), p = ae(F, v), C = ({
+    fieldState: r,
+    groupState: o,
+    checkboxIntent: T
   }) => {
-    const name2 = fieldState.name ?? groupState.name;
-    const isRequired2 = fieldState.isRequired ?? groupState.isRequired;
-    const state = fieldState.state ?? groupState.state;
-    const isInvalid2 = fieldState.isInvalid ?? groupState.isInvalid;
-    const isFieldEnclosed = fieldState.id !== groupState.id;
-    const id2 = isFieldEnclosed ? fieldState.id : void 0;
-    const description2 = isFieldEnclosed ? fieldState.description : void 0;
-    const intent2 = state ?? checkboxIntent ?? groupState.intent;
-    return { name: name2, isRequired: isRequired2, isInvalid: isInvalid2, id: id2, description: description2, intent: intent2 };
-  };
-  const checked = value ? group.value?.includes(value) : checkedProp;
-  const handleCheckedChange = (isChecked) => {
-    onCheckedChange?.(isChecked);
-    const rootRefValue = rootRef.current?.value;
-    if (rootRefValue && group.onCheckedChange) {
-      group.onCheckedChange(isChecked, rootRefValue);
-    }
-  };
-  const {
-    id,
-    name,
-    isInvalid,
-    description,
-    intent,
-    isRequired: isRequiredAttr
-  } = getCheckboxAttributes({
-    fieldState: field,
-    groupState: group,
-    checkboxIntent: intentProp
-  });
-  const isRequired = useMemo(() => {
-    if (!group) return isRequiredAttr;
-    return isRequiredAttr ? !group.value?.length : false;
-  }, [group, isRequiredAttr]);
-  const checkboxLabel = children && /* @__PURE__ */ jsx4(CheckboxLabel, { disabled, htmlFor: id || innerId, id: innerLabelId, children });
-  const checkboxInput = /* @__PURE__ */ jsx4(
-    CheckboxInput,
+    const U = r.name ?? o.name, W = r.isRequired ?? o.isRequired, Y = r.state ?? o.state, Z = r.isInvalid ?? o.isInvalid, w = r.id !== o.id, S = w ? r.id : void 0, ee = w ? r.description : void 0, te = Y ?? T ?? o.intent;
+    return { name: U, isRequired: W, isInvalid: Z, id: S, description: ee, intent: te };
+  }, I = n ? t.value?.includes(n) : u, y = (r) => {
+    g?.(r);
+    const o = v.current?.value;
+    o && t.onCheckedChange && t.onCheckedChange(r, o);
+  }, {
+    id: f,
+    name: G,
+    isInvalid: $,
+    description: L,
+    intent: R,
+    isRequired: l
+  } = C({
+    fieldState: d,
+    groupState: t,
+    checkboxIntent: b
+  }), N = _(() => t ? l ? !t.value?.length : !1 : l, [t, l]), q = h && /* @__PURE__ */ e(O, { disabled: s, htmlFor: f || k, id: x, children: h }), j = /* @__PURE__ */ e(
+    K,
     {
-      ref,
-      id: id || innerId,
-      name,
-      value,
-      intent,
-      checked,
-      disabled,
-      required: isRequired,
-      "aria-describedby": description,
-      "aria-invalid": isInvalid,
-      onCheckedChange: handleCheckedChange,
-      "aria-labelledby": children ? innerLabelId : field.labelId,
-      ...others
+      ref: p,
+      id: f || k,
+      name: G,
+      value: n,
+      intent: R,
+      checked: I,
+      disabled: s,
+      required: N,
+      "aria-describedby": L,
+      "aria-invalid": $,
+      onCheckedChange: y,
+      "aria-labelledby": h ? x : d.labelId,
+      ...z
     }
-  );
-  const content = group.reverse || reverse ? /* @__PURE__ */ jsxs(Fragment, { children: [
-    checkboxLabel,
-    checkboxInput
-  ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-    checkboxInput,
-    checkboxLabel
+  ), Q = t.reverse || i ? /* @__PURE__ */ E(M, { children: [
+    q,
+    j
+  ] }) : /* @__PURE__ */ E(M, { children: [
+    j,
+    q
   ] });
-  return /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ e(
     "div",
     {
       "data-spark-component": "checkbox",
-      className: cx("gap-md text-body-1 relative flex items-start", className),
-      children: content
+      className: re("gap-md text-body-1 relative flex items-start", c),
+      children: Q
     }
   );
 };
-Checkbox3.displayName = "Checkbox";
-
-// src/checkbox/CheckboxGroup.tsx
-import { useFormFieldControl as useFormFieldControl2 } from "@spark-ui/components/form-field";
-import { useCombinedState } from "@spark-ui/hooks/use-combined-state";
-import { useEffect, useMemo as useMemo2, useRef as useRef2 } from "react";
-
-// src/checkbox/CheckboxGroup.styles.ts
-import { cva as cva3 } from "class-variance-authority";
-var checkboxGroupStyles = cva3(["flex"], {
+fe.displayName = "Checkbox";
+const ge = V(["flex"], {
   variants: {
     /**
      * Prop to set the orientation of the checkbox group which could be `vertical` or `horizontal`.
@@ -279,69 +205,52 @@ var checkboxGroupStyles = cva3(["flex"], {
       horizontal: ["gap-xl"]
     }
   }
-});
-
-// src/checkbox/CheckboxGroup.tsx
-import { jsx as jsx5 } from "react/jsx-runtime";
-var CheckboxGroup = ({
-  name: nameProp,
-  value: valueProp,
-  defaultValue,
-  className,
-  intent,
-  orientation = "vertical",
-  onCheckedChange: onCheckedChangeProp,
-  reverse = false,
-  children,
-  ref,
-  ...others
+}), ve = ({
+  name: a,
+  value: c,
+  defaultValue: b,
+  className: u,
+  intent: n,
+  orientation: s = "vertical",
+  onCheckedChange: i,
+  reverse: g = !1,
+  children: h,
+  ref: F,
+  ...z
 }) => {
-  const [value, setValue] = useCombinedState(valueProp, defaultValue);
-  const field = useFormFieldControl2();
-  const onCheckedChangeRef = useRef2(onCheckedChangeProp);
-  const { id, labelId, description, state, isInvalid, isRequired } = field;
-  const name = nameProp ?? field.name;
-  const current = useMemo2(() => {
-    const handleCheckedChange = (checked, changed) => {
-      const values = value || [];
-      const modified = checked ? [...values, changed] : values.filter((val) => val !== changed);
-      setValue(modified);
-      if (onCheckedChangeRef.current) {
-        onCheckedChangeRef.current(modified);
-      }
-    };
-    return {
-      id,
-      name,
-      value,
-      intent,
-      state,
-      isInvalid,
-      description,
-      isRequired,
-      reverse,
-      onCheckedChange: handleCheckedChange
-    };
-  }, [id, name, value, intent, state, isInvalid, description, isRequired, setValue, reverse]);
-  useEffect(() => {
-    onCheckedChangeRef.current = onCheckedChangeProp;
-  }, [onCheckedChangeProp]);
-  return /* @__PURE__ */ jsx5(CheckboxGroupContext.Provider, { value: current, children: /* @__PURE__ */ jsx5(
+  const [m, k] = ue(c, b), x = D(), d = X(i), { id: t, labelId: v, description: p, state: C, isInvalid: I, isRequired: y } = x, f = a ?? x.name, G = _(() => ({
+    id: t,
+    name: f,
+    value: m,
+    intent: n,
+    state: C,
+    isInvalid: I,
+    description: p,
+    isRequired: y,
+    reverse: g,
+    onCheckedChange: (L, R) => {
+      const l = m || [], N = L ? [...l, R] : l.filter((q) => q !== R);
+      k(N), d.current && d.current(N);
+    }
+  }), [t, f, m, n, C, I, p, y, k, g]);
+  return ce(() => {
+    d.current = i;
+  }, [i]), /* @__PURE__ */ e(H.Provider, { value: G, children: /* @__PURE__ */ e(
     "div",
     {
-      ref,
-      className: checkboxGroupStyles({ className, orientation }),
+      ref: F,
+      className: ge({ className: u, orientation: s }),
       role: "group",
-      "aria-labelledby": labelId,
-      "aria-describedby": description,
-      ...others,
-      children
+      "aria-labelledby": v,
+      "aria-describedby": p,
+      ...z,
+      children: h
     }
   ) });
 };
-CheckboxGroup.displayName = "CheckboxGroup";
+ve.displayName = "CheckboxGroup";
 export {
-  Checkbox3 as Checkbox,
-  CheckboxGroup
+  fe as Checkbox,
+  ve as CheckboxGroup
 };
-//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/checkbox/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/checkbox/Checkbox.tsx","../../src/checkbox/CheckboxGroupContext.tsx","../../src/checkbox/CheckboxInput.tsx","../../src/checkbox/CheckboxIndicator.tsx","../../src/checkbox/CheckboxInput.styles.ts","../../src/checkbox/CheckboxLabel.styles.ts","../../src/checkbox/CheckboxLabel.tsx","../../src/checkbox/CheckboxGroup.tsx","../../src/checkbox/CheckboxGroup.styles.ts"],"sourcesContent":["import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { cx } from 'class-variance-authority'\nimport { Ref, useId, useMemo, useRef } from 'react'\n\nimport { CheckboxGroupContextState, useCheckboxGroup } from './CheckboxGroupContext'\nimport { CheckboxInput, CheckboxInputProps } from './CheckboxInput'\nimport { CheckboxLabel } from './CheckboxLabel'\n\nexport type CheckboxProps = CheckboxInputProps &\n  Pick<CheckboxGroupContextState, 'reverse'> & {\n    ref?: Ref<HTMLButtonElement>\n  }\n\nconst ID_PREFIX = ':checkbox'\n\nexport const Checkbox = ({\n  id: idProp,\n  className,\n  intent: intentProp,\n  checked: checkedProp,\n  value,\n  disabled,\n  reverse = false,\n  onCheckedChange,\n  children,\n  ref: forwardedRef,\n  ...others\n}: CheckboxProps) => {\n  const checkboxId = `${ID_PREFIX}-${useId()}`\n  const innerId = idProp || checkboxId\n\n  const innerLabelId = `${ID_PREFIX}-${useId()}`\n\n  const field = useFormFieldControl()\n  const group = useCheckboxGroup()\n\n  const rootRef = useRef<HTMLButtonElement | undefined>(null)\n  const ref = useMergeRefs(forwardedRef, rootRef)\n\n  const getCheckboxAttributes = ({\n    fieldState,\n    groupState,\n    checkboxIntent,\n  }: {\n    fieldState: ReturnType<typeof useFormFieldControl>\n    groupState: ReturnType<typeof useCheckboxGroup>\n    checkboxIntent: CheckboxInputProps['intent']\n  }) => {\n    const name = fieldState.name ?? groupState.name\n    const isRequired = fieldState.isRequired ?? groupState.isRequired\n    const state = fieldState.state ?? groupState.state\n    const isInvalid = fieldState.isInvalid ?? groupState.isInvalid\n\n    const isFieldEnclosed = fieldState.id !== groupState.id\n    const id = isFieldEnclosed ? fieldState.id : undefined\n    const description = isFieldEnclosed ? fieldState.description : undefined\n\n    const intent = state ?? checkboxIntent ?? groupState.intent\n\n    return { name, isRequired, isInvalid, id, description, intent }\n  }\n\n  const checked = value ? group.value?.includes(value) : checkedProp\n\n  const handleCheckedChange = (isChecked: boolean) => {\n    onCheckedChange?.(isChecked)\n\n    const rootRefValue = rootRef.current?.value\n    if (rootRefValue && group.onCheckedChange) {\n      group.onCheckedChange(isChecked, rootRefValue)\n    }\n  }\n\n  const {\n    id,\n    name,\n    isInvalid,\n    description,\n    intent,\n    isRequired: isRequiredAttr,\n  } = getCheckboxAttributes({\n    fieldState: field,\n    groupState: group,\n    checkboxIntent: intentProp,\n  })\n\n  const isRequired = useMemo(() => {\n    if (!group) return isRequiredAttr\n\n    return isRequiredAttr ? !group.value?.length : false\n  }, [group, isRequiredAttr])\n\n  const checkboxLabel = children && (\n    <CheckboxLabel disabled={disabled} htmlFor={id || innerId} id={innerLabelId}>\n      {children}\n    </CheckboxLabel>\n  )\n\n  const checkboxInput = (\n    <CheckboxInput\n      ref={ref}\n      id={id || innerId}\n      name={name}\n      value={value}\n      intent={intent}\n      checked={checked}\n      disabled={disabled}\n      required={isRequired}\n      aria-describedby={description}\n      aria-invalid={isInvalid}\n      onCheckedChange={handleCheckedChange}\n      aria-labelledby={children ? innerLabelId : field.labelId}\n      {...others}\n    />\n  )\n\n  const content =\n    group.reverse || reverse ? (\n      <>\n        {checkboxLabel}\n        {checkboxInput}\n      </>\n    ) : (\n      <>\n        {checkboxInput}\n        {checkboxLabel}\n      </>\n    )\n\n  return (\n    <div\n      data-spark-component=\"checkbox\"\n      className={cx('gap-md text-body-1 relative flex items-start', className)}\n    >\n      {content}\n    </div>\n  )\n}\n\nCheckbox.displayName = 'Checkbox'\n","import { createContext, useContext } from 'react'\n\nimport { CheckboxInputStylesProps } from './CheckboxInput.styles'\n\nexport interface CheckboxGroupContextState extends Pick<CheckboxInputStylesProps, 'intent'> {\n  /**\n   * The id of the checkbox group.\n   */\n  id: string\n  /**\n   * The name of the group. Submitted with its owning form as part of a name/value pair.\n   */\n  name?: string\n  /**\n   * The value of the checkbox group.\n   */\n  value?: string[]\n  /**\n   * A set of ids separated by a space used to describe the input component given by a set of messages.\n   */\n  description?: string\n  /**\n   * The validation state of the checkbox group.\n   */\n  state?: 'error' | 'success' | 'alert'\n  /**\n   * If true, the checkbox group will be invalid.\n   */\n  isInvalid?: boolean\n  /**\n   * If true, the checkbox group will be required.\n   */\n  isRequired?: boolean\n  /**\n   * Callback used to update or notify the value of the checkbox group.\n   */\n  onCheckedChange?: (checked: boolean, changed: string) => void\n  /**\n   * When true, the label will be placed on the left side of the Checkbox\n   */\n  reverse?: boolean\n}\n\nexport const CheckboxGroupContext = createContext<Partial<CheckboxGroupContextState>>({})\n\nexport const useCheckboxGroup = () => {\n  const context = useContext(CheckboxGroupContext)\n\n  return context\n}\n","import { Check } from '@spark-ui/icons/Check'\nimport { Minus } from '@spark-ui/icons/Minus'\nimport { Checkbox } from 'radix-ui'\nimport { ComponentPropsWithoutRef, ReactNode, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { CheckboxIndicator } from './CheckboxIndicator'\nimport { checkboxInputStyles, type CheckboxInputStylesProps } from './CheckboxInput.styles'\n\ntype CheckedStatus = boolean | 'indeterminate'\n\nconst CheckboxPrimitive = Checkbox.Checkbox\n\nexport interface CheckboxInputProps\n  extends CheckboxInputStylesProps,\n    Omit<ComponentPropsWithoutRef<'button'>, 'onChange' | 'value' | 'checked' | 'defaultChecked'> {\n  /**\n   * The checked icon to use.\n   */\n  icon?: ReactNode\n  /**\n   * The indeterminate icon to use.\n   */\n  indeterminateIcon?: ReactNode\n  /**\n   * The checked state of the checkbox when it is initially rendered. Use when you do not need to control its checked state.\n   */\n  defaultChecked?: boolean\n  /**\n   * The controlled checked state of the checkbox. Must be used in conjunction with onCheckedChange.\n   */\n  checked?: CheckedStatus\n  /**\n   * When true, prevents the user from interacting with the checkbox.\n   */\n  disabled?: boolean\n  /**\n   * When true, indicates that the user must check the checkbox before the owning form can be submitted.\n   */\n  required?: boolean\n  /**\n   * The name of the checkbox. Submitted with its owning form as part of a name/value pair.\n   */\n  name?: string\n  /**\n   * The value given as data when submitted with a name.\n   */\n  value?: string\n  /**\n   * Event handler called when the checked state of the checkbox changes.\n   */\n  onCheckedChange?: (checked: boolean) => void\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const CheckboxInput = ({\n  className,\n  icon = <Check />,\n  indeterminateIcon = <Minus />,\n  intent,\n  checked,\n  ref,\n  ...others\n}: CheckboxInputProps) => (\n  <CheckboxPrimitive\n    ref={ref}\n    className={checkboxInputStyles({ intent, className })}\n    checked={checked}\n    {...others}\n  >\n    <CheckboxIndicator>\n      <Icon size=\"sm\">{checked === 'indeterminate' ? indeterminateIcon : icon}</Icon>\n    </CheckboxIndicator>\n  </CheckboxPrimitive>\n)\n\nCheckboxInput.displayName = 'CheckboxInput'\n","import { Checkbox } from 'radix-ui'\nimport { Ref } from 'react'\n\nconst CheckboxIndicatorPrimitive = Checkbox.CheckboxIndicator\n\nexport type CheckboxIndicatorProps = Checkbox.CheckboxIndicatorProps & {\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const CheckboxIndicator = (props: CheckboxIndicatorProps) => (\n  <CheckboxIndicatorPrimitive className=\"flex size-full items-center justify-center\" {...props} />\n)\n\nCheckboxIndicator.displayName = 'CheckboxIndicator'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const checkboxInputStyles = cva(\n  [\n    'size-sz-24 shrink-0 items-center justify-center rounded-sm border-md bg-transparent',\n    'disabled:cursor-not-allowed disabled:opacity-dim-3 disabled:hover:ring-0',\n    'focus-visible:u-outline',\n    'hover:ring-4 hover:cursor-pointer',\n    'u-shadow-border-transition',\n  ],\n  {\n    variants: {\n      /**\n       * Color scheme of the checkbox.\n       */\n      intent: makeVariants<\n        'intent',\n        ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n      >({\n        main: [\n          'text-on-main',\n          'hover:ring-main-container',\n          'data-[state=unchecked]:border-outline',\n          'data-[state=indeterminate]:border-main data-[state=indeterminate]:bg-main',\n          'data-[state=checked]:border-main data-[state=checked]:bg-main',\n        ],\n        support: [\n          'text-on-support',\n          'hover:ring-support-container',\n          'data-[state=unchecked]:border-outline',\n          'data-[state=indeterminate]:border-support data-[state=indeterminate]:bg-support',\n          'data-[state=checked]:border-support data-[state=checked]:bg-support',\n        ],\n        accent: [\n          'text-on-accent',\n          'hover:ring-accent-container',\n          'data-[state=unchecked]:border-outline',\n          'data-[state=indeterminate]:border-accent data-[state=indeterminate]:bg-accent',\n          'data-[state=checked]:border-accent data-[state=checked]:bg-accent',\n        ],\n        basic: [\n          'text-on-basic',\n          'hover:ring-basic-container',\n          'data-[state=unchecked]:border-outline',\n          'data-[state=indeterminate]:border-basic data-[state=indeterminate]:bg-basic',\n          'data-[state=checked]:border-basic data-[state=checked]:bg-basic',\n        ],\n        success: [\n          'text-on-success',\n          'hover:ring-success-container',\n          'data-[state=unchecked]:border-success',\n          'data-[state=indeterminate]:border-success data-[state=indeterminate]:bg-success',\n          'data-[state=checked]:border-success data-[state=checked]:bg-success',\n        ],\n        alert: [\n          'text-on-alert',\n          'hover:ring-alert-container',\n          'data-[state=unchecked]:border-alert',\n          'data-[state=indeterminate]:border-alert data-[state=indeterminate]:bg-alert',\n          'data-[state=checked]:border-alert data-[state=checked]:bg-alert',\n        ],\n        error: [\n          'text-on-error',\n          'hover:ring-error-container',\n          'data-[state=unchecked]:border-error',\n          'data-[state=indeterminate]:border-error data-[state=indeterminate]:bg-error',\n          'data-[state=checked]:border-error data-[state=checked]:bg-error',\n        ],\n        info: [\n          'text-on-info',\n          'hover:ring-info-container',\n          'data-[state=unchecked]:border-info',\n          'data-[state=indeterminate]:border-info data-[state=indeterminate]:bg-info',\n          'data-[state=checked]:border-info data-[state=checked]:bg-info',\n        ],\n        neutral: [\n          'text-on-neutral',\n          'hover:ring-neutral-container',\n          'data-[state=unchecked]:border-outline',\n          'data-[state=indeterminate]:border-neutral data-[state=indeterminate]:bg-neutral',\n          'data-[state=checked]:border-neutral data-[state=checked]:bg-neutral',\n        ],\n      }),\n    },\n    defaultVariants: {\n      intent: 'basic',\n    },\n  }\n)\n\nexport type CheckboxInputStylesProps = VariantProps<typeof checkboxInputStyles>\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const labelStyles = cva('grow', {\n  variants: {\n    disabled: {\n      true: ['text-neutral/dim-2', 'cursor-not-allowed'],\n      false: ['cursor-pointer'],\n    },\n  },\n  defaultVariants: {\n    disabled: false,\n  },\n})\n\nexport type LabelStylesProps = VariantProps<typeof labelStyles>\n","import { Label, LabelProps } from '../label'\nimport { labelStyles, type LabelStylesProps } from './CheckboxLabel.styles'\n\nexport interface CheckboxLabelProps extends LabelProps, LabelStylesProps {\n  /**\n   * When true, prevents the user from interacting with the checkbox item.\n   */\n  disabled?: boolean\n}\n\nexport const CheckboxLabel = ({ disabled, ...others }: CheckboxLabelProps) => (\n  <Label className={labelStyles({ disabled })} {...others} />\n)\n\nCheckboxLabel.displayName = 'CheckboxLabel'\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { ComponentPropsWithoutRef, Ref, useEffect, useMemo, useRef } from 'react'\n\nimport { checkboxGroupStyles, CheckboxGroupStylesProps } from './CheckboxGroup.styles'\nimport { CheckboxGroupContext, CheckboxGroupContextState } from './CheckboxGroupContext'\n\nexport interface CheckboxGroupProps\n  extends Omit<ComponentPropsWithoutRef<'div'>, 'value' | 'defaultValue' | 'onChange'>,\n    CheckboxGroupStylesProps,\n    Pick<CheckboxGroupContextState, 'intent' | 'name' | 'value' | 'reverse'> {\n  /**\n   * The initial value of the checkbox group\n   */\n  defaultValue?: string[]\n  /**\n   * The callback fired when any children Checkbox is checked or unchecked\n   */\n  onCheckedChange?: (value: string[]) => void\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const CheckboxGroup = ({\n  name: nameProp,\n  value: valueProp,\n  defaultValue,\n  className,\n  intent,\n  orientation = 'vertical',\n  onCheckedChange: onCheckedChangeProp,\n  reverse = false,\n  children,\n  ref,\n  ...others\n}: CheckboxGroupProps) => {\n  const [value, setValue] = useCombinedState(valueProp, defaultValue)\n  const field = useFormFieldControl()\n  const onCheckedChangeRef = useRef(onCheckedChangeProp)\n\n  const { id, labelId, description, state, isInvalid, isRequired } = field\n  const name = nameProp ?? field.name\n\n  const current = useMemo(() => {\n    const handleCheckedChange = (checked: boolean, changed: string) => {\n      const values = value || []\n      const modified = checked ? [...values, changed] : values.filter(val => val !== changed)\n\n      setValue(modified)\n\n      if (onCheckedChangeRef.current) {\n        onCheckedChangeRef.current(modified)\n      }\n    }\n\n    return {\n      id,\n      name,\n      value,\n      intent,\n      state,\n      isInvalid,\n      description,\n      isRequired,\n      reverse,\n      onCheckedChange: handleCheckedChange,\n    }\n  }, [id, name, value, intent, state, isInvalid, description, isRequired, setValue, reverse])\n\n  useEffect(() => {\n    onCheckedChangeRef.current = onCheckedChangeProp\n  }, [onCheckedChangeProp])\n\n  return (\n    <CheckboxGroupContext.Provider value={current}>\n      <div\n        ref={ref}\n        className={checkboxGroupStyles({ className, orientation })}\n        role=\"group\"\n        aria-labelledby={labelId}\n        aria-describedby={description}\n        {...others}\n      >\n        {children}\n      </div>\n    </CheckboxGroupContext.Provider>\n  )\n}\n\nCheckboxGroup.displayName = 'CheckboxGroup'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const checkboxGroupStyles = cva(['flex'], {\n  variants: {\n    /**\n     * Prop to set the orientation of the checkbox group which could be `vertical` or `horizontal`.\n     */\n    orientation: {\n      vertical: ['flex-col', 'gap-lg'],\n      horizontal: ['gap-xl'],\n    },\n  },\n})\n\nexport type CheckboxGroupStylesProps = VariantProps<typeof checkboxGroupStyles>\n"],"mappings":"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","names":["Checkbox","jsx","Checkbox","cva","jsx","jsx","Checkbox","name","isRequired","isInvalid","id","description","intent","useFormFieldControl","useMemo","useRef","cva","jsx","useFormFieldControl","useRef","useMemo"]}
+{"version":3,"file":"index.mjs","sources":["../../src/checkbox/CheckboxGroupContext.tsx","../../src/checkbox/CheckboxIndicator.tsx","../../src/checkbox/CheckboxInput.styles.ts","../../src/checkbox/CheckboxInput.tsx","../../src/checkbox/CheckboxLabel.styles.ts","../../src/checkbox/CheckboxLabel.tsx","../../src/checkbox/Checkbox.tsx","../../src/checkbox/CheckboxGroup.styles.ts","../../src/checkbox/CheckboxGroup.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nimport { CheckboxInputStylesProps } from './CheckboxInput.styles'\n\nexport interface CheckboxGroupContextState extends Pick<CheckboxInputStylesProps, 'intent'> {\n  /**\n   * The id of the checkbox group.\n   */\n  id: string\n  /**\n   * The name of the group. Submitted with its owning form as part of a name/value pair.\n   */\n  name?: string\n  /**\n   * The value of the checkbox group.\n   */\n  value?: string[]\n  /**\n   * A set of ids separated by a space used to describe the input component given by a set of messages.\n   */\n  description?: string\n  /**\n   * The validation state of the checkbox group.\n   */\n  state?: 'error' | 'success' | 'alert'\n  /**\n   * If true, the checkbox group will be invalid.\n   */\n  isInvalid?: boolean\n  /**\n   * If true, the checkbox group will be required.\n   */\n  isRequired?: boolean\n  /**\n   * Callback used to update or notify the value of the checkbox group.\n   */\n  onCheckedChange?: (checked: boolean, changed: string) => void\n  /**\n   * When true, the label will be placed on the left side of the Checkbox\n   */\n  reverse?: boolean\n}\n\nexport const CheckboxGroupContext = createContext<Partial<CheckboxGroupContextState>>({})\n\nexport const useCheckboxGroup = () => {\n  const context = useContext(CheckboxGroupContext)\n\n  return context\n}\n","import { Checkbox } from 'radix-ui'\nimport { Ref } from 'react'\n\nconst CheckboxIndicatorPrimitive = Checkbox.CheckboxIndicator\n\nexport type CheckboxIndicatorProps = Checkbox.CheckboxIndicatorProps & {\n  ref?: Ref<HTMLSpanElement>\n}\n\nexport const CheckboxIndicator = (props: CheckboxIndicatorProps) => (\n  <CheckboxIndicatorPrimitive className=\"flex size-full items-center justify-center\" {...props} />\n)\n\nCheckboxIndicator.displayName = 'CheckboxIndicator'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const checkboxInputStyles = cva(\n  [\n    'size-sz-24 shrink-0 items-center justify-center rounded-sm border-md bg-transparent',\n    'disabled:cursor-not-allowed disabled:opacity-dim-3 disabled:hover:ring-0',\n    'focus-visible:u-outline',\n    'hover:ring-4 hover:cursor-pointer',\n    'u-shadow-border-transition',\n  ],\n  {\n    variants: {\n      /**\n       * Color scheme of the checkbox.\n       */\n      intent: makeVariants<\n        'intent',\n        ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n      >({\n        main: [\n          'text-on-main',\n          'hover:ring-main-container',\n          'data-[state=unchecked]:border-outline',\n          'data-[state=indeterminate]:border-main data-[state=indeterminate]:bg-main',\n          'data-[state=checked]:border-main data-[state=checked]:bg-main',\n        ],\n        support: [\n          'text-on-support',\n          'hover:ring-support-container',\n          'data-[state=unchecked]:border-outline',\n          'data-[state=indeterminate]:border-support data-[state=indeterminate]:bg-support',\n          'data-[state=checked]:border-support data-[state=checked]:bg-support',\n        ],\n        accent: [\n          'text-on-accent',\n          'hover:ring-accent-container',\n          'data-[state=unchecked]:border-outline',\n          'data-[state=indeterminate]:border-accent data-[state=indeterminate]:bg-accent',\n          'data-[state=checked]:border-accent data-[state=checked]:bg-accent',\n        ],\n        basic: [\n          'text-on-basic',\n          'hover:ring-basic-container',\n          'data-[state=unchecked]:border-outline',\n          'data-[state=indeterminate]:border-basic data-[state=indeterminate]:bg-basic',\n          'data-[state=checked]:border-basic data-[state=checked]:bg-basic',\n        ],\n        success: [\n          'text-on-success',\n          'hover:ring-success-container',\n          'data-[state=unchecked]:border-success',\n          'data-[state=indeterminate]:border-success data-[state=indeterminate]:bg-success',\n          'data-[state=checked]:border-success data-[state=checked]:bg-success',\n        ],\n        alert: [\n          'text-on-alert',\n          'hover:ring-alert-container',\n          'data-[state=unchecked]:border-alert',\n          'data-[state=indeterminate]:border-alert data-[state=indeterminate]:bg-alert',\n          'data-[state=checked]:border-alert data-[state=checked]:bg-alert',\n        ],\n        error: [\n          'text-on-error',\n          'hover:ring-error-container',\n          'data-[state=unchecked]:border-error',\n          'data-[state=indeterminate]:border-error data-[state=indeterminate]:bg-error',\n          'data-[state=checked]:border-error data-[state=checked]:bg-error',\n        ],\n        info: [\n          'text-on-info',\n          'hover:ring-info-container',\n          'data-[state=unchecked]:border-info',\n          'data-[state=indeterminate]:border-info data-[state=indeterminate]:bg-info',\n          'data-[state=checked]:border-info data-[state=checked]:bg-info',\n        ],\n        neutral: [\n          'text-on-neutral',\n          'hover:ring-neutral-container',\n          'data-[state=unchecked]:border-outline',\n          'data-[state=indeterminate]:border-neutral data-[state=indeterminate]:bg-neutral',\n          'data-[state=checked]:border-neutral data-[state=checked]:bg-neutral',\n        ],\n      }),\n    },\n    defaultVariants: {\n      intent: 'basic',\n    },\n  }\n)\n\nexport type CheckboxInputStylesProps = VariantProps<typeof checkboxInputStyles>\n","import { Check } from '@spark-ui/icons/Check'\nimport { Minus } from '@spark-ui/icons/Minus'\nimport { Checkbox } from 'radix-ui'\nimport { ComponentPropsWithoutRef, ReactNode, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { CheckboxIndicator } from './CheckboxIndicator'\nimport { checkboxInputStyles, type CheckboxInputStylesProps } from './CheckboxInput.styles'\n\ntype CheckedStatus = boolean | 'indeterminate'\n\nconst CheckboxPrimitive = Checkbox.Checkbox\n\nexport interface CheckboxInputProps\n  extends CheckboxInputStylesProps,\n    Omit<ComponentPropsWithoutRef<'button'>, 'onChange' | 'value' | 'checked' | 'defaultChecked'> {\n  /**\n   * The checked icon to use.\n   */\n  icon?: ReactNode\n  /**\n   * The indeterminate icon to use.\n   */\n  indeterminateIcon?: ReactNode\n  /**\n   * The checked state of the checkbox when it is initially rendered. Use when you do not need to control its checked state.\n   */\n  defaultChecked?: boolean\n  /**\n   * The controlled checked state of the checkbox. Must be used in conjunction with onCheckedChange.\n   */\n  checked?: CheckedStatus\n  /**\n   * When true, prevents the user from interacting with the checkbox.\n   */\n  disabled?: boolean\n  /**\n   * When true, indicates that the user must check the checkbox before the owning form can be submitted.\n   */\n  required?: boolean\n  /**\n   * The name of the checkbox. Submitted with its owning form as part of a name/value pair.\n   */\n  name?: string\n  /**\n   * The value given as data when submitted with a name.\n   */\n  value?: string\n  /**\n   * Event handler called when the checked state of the checkbox changes.\n   */\n  onCheckedChange?: (checked: boolean) => void\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const CheckboxInput = ({\n  className,\n  icon = <Check />,\n  indeterminateIcon = <Minus />,\n  intent,\n  checked,\n  ref,\n  ...others\n}: CheckboxInputProps) => (\n  <CheckboxPrimitive\n    ref={ref}\n    className={checkboxInputStyles({ intent, className })}\n    checked={checked}\n    {...others}\n  >\n    <CheckboxIndicator>\n      <Icon size=\"sm\">{checked === 'indeterminate' ? indeterminateIcon : icon}</Icon>\n    </CheckboxIndicator>\n  </CheckboxPrimitive>\n)\n\nCheckboxInput.displayName = 'CheckboxInput'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const labelStyles = cva('grow', {\n  variants: {\n    disabled: {\n      true: ['text-neutral/dim-2', 'cursor-not-allowed'],\n      false: ['cursor-pointer'],\n    },\n  },\n  defaultVariants: {\n    disabled: false,\n  },\n})\n\nexport type LabelStylesProps = VariantProps<typeof labelStyles>\n","import { Label, LabelProps } from '../label'\nimport { labelStyles, type LabelStylesProps } from './CheckboxLabel.styles'\n\nexport interface CheckboxLabelProps extends LabelProps, LabelStylesProps {\n  /**\n   * When true, prevents the user from interacting with the checkbox item.\n   */\n  disabled?: boolean\n}\n\nexport const CheckboxLabel = ({ disabled, ...others }: CheckboxLabelProps) => (\n  <Label className={labelStyles({ disabled })} {...others} />\n)\n\nCheckboxLabel.displayName = 'CheckboxLabel'\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { cx } from 'class-variance-authority'\nimport { Ref, useId, useMemo, useRef } from 'react'\n\nimport { CheckboxGroupContextState, useCheckboxGroup } from './CheckboxGroupContext'\nimport { CheckboxInput, CheckboxInputProps } from './CheckboxInput'\nimport { CheckboxLabel } from './CheckboxLabel'\n\nexport type CheckboxProps = CheckboxInputProps &\n  Pick<CheckboxGroupContextState, 'reverse'> & {\n    ref?: Ref<HTMLButtonElement>\n  }\n\nconst ID_PREFIX = ':checkbox'\n\nexport const Checkbox = ({\n  id: idProp,\n  className,\n  intent: intentProp,\n  checked: checkedProp,\n  value,\n  disabled,\n  reverse = false,\n  onCheckedChange,\n  children,\n  ref: forwardedRef,\n  ...others\n}: CheckboxProps) => {\n  const checkboxId = `${ID_PREFIX}-${useId()}`\n  const innerId = idProp || checkboxId\n\n  const innerLabelId = `${ID_PREFIX}-${useId()}`\n\n  const field = useFormFieldControl()\n  const group = useCheckboxGroup()\n\n  const rootRef = useRef<HTMLButtonElement | undefined>(null)\n  const ref = useMergeRefs(forwardedRef, rootRef)\n\n  const getCheckboxAttributes = ({\n    fieldState,\n    groupState,\n    checkboxIntent,\n  }: {\n    fieldState: ReturnType<typeof useFormFieldControl>\n    groupState: ReturnType<typeof useCheckboxGroup>\n    checkboxIntent: CheckboxInputProps['intent']\n  }) => {\n    const name = fieldState.name ?? groupState.name\n    const isRequired = fieldState.isRequired ?? groupState.isRequired\n    const state = fieldState.state ?? groupState.state\n    const isInvalid = fieldState.isInvalid ?? groupState.isInvalid\n\n    const isFieldEnclosed = fieldState.id !== groupState.id\n    const id = isFieldEnclosed ? fieldState.id : undefined\n    const description = isFieldEnclosed ? fieldState.description : undefined\n\n    const intent = state ?? checkboxIntent ?? groupState.intent\n\n    return { name, isRequired, isInvalid, id, description, intent }\n  }\n\n  const checked = value ? group.value?.includes(value) : checkedProp\n\n  const handleCheckedChange = (isChecked: boolean) => {\n    onCheckedChange?.(isChecked)\n\n    const rootRefValue = rootRef.current?.value\n    if (rootRefValue && group.onCheckedChange) {\n      group.onCheckedChange(isChecked, rootRefValue)\n    }\n  }\n\n  const {\n    id,\n    name,\n    isInvalid,\n    description,\n    intent,\n    isRequired: isRequiredAttr,\n  } = getCheckboxAttributes({\n    fieldState: field,\n    groupState: group,\n    checkboxIntent: intentProp,\n  })\n\n  const isRequired = useMemo(() => {\n    if (!group) return isRequiredAttr\n\n    return isRequiredAttr ? !group.value?.length : false\n  }, [group, isRequiredAttr])\n\n  const checkboxLabel = children && (\n    <CheckboxLabel disabled={disabled} htmlFor={id || innerId} id={innerLabelId}>\n      {children}\n    </CheckboxLabel>\n  )\n\n  const checkboxInput = (\n    <CheckboxInput\n      ref={ref}\n      id={id || innerId}\n      name={name}\n      value={value}\n      intent={intent}\n      checked={checked}\n      disabled={disabled}\n      required={isRequired}\n      aria-describedby={description}\n      aria-invalid={isInvalid}\n      onCheckedChange={handleCheckedChange}\n      aria-labelledby={children ? innerLabelId : field.labelId}\n      {...others}\n    />\n  )\n\n  const content =\n    group.reverse || reverse ? (\n      <>\n        {checkboxLabel}\n        {checkboxInput}\n      </>\n    ) : (\n      <>\n        {checkboxInput}\n        {checkboxLabel}\n      </>\n    )\n\n  return (\n    <div\n      data-spark-component=\"checkbox\"\n      className={cx('gap-md text-body-1 relative flex items-start', className)}\n    >\n      {content}\n    </div>\n  )\n}\n\nCheckbox.displayName = 'Checkbox'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const checkboxGroupStyles = cva(['flex'], {\n  variants: {\n    /**\n     * Prop to set the orientation of the checkbox group which could be `vertical` or `horizontal`.\n     */\n    orientation: {\n      vertical: ['flex-col', 'gap-lg'],\n      horizontal: ['gap-xl'],\n    },\n  },\n})\n\nexport type CheckboxGroupStylesProps = VariantProps<typeof checkboxGroupStyles>\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { ComponentPropsWithoutRef, Ref, useEffect, useMemo, useRef } from 'react'\n\nimport { checkboxGroupStyles, CheckboxGroupStylesProps } from './CheckboxGroup.styles'\nimport { CheckboxGroupContext, CheckboxGroupContextState } from './CheckboxGroupContext'\n\nexport interface CheckboxGroupProps\n  extends Omit<ComponentPropsWithoutRef<'div'>, 'value' | 'defaultValue' | 'onChange'>,\n    CheckboxGroupStylesProps,\n    Pick<CheckboxGroupContextState, 'intent' | 'name' | 'value' | 'reverse'> {\n  /**\n   * The initial value of the checkbox group\n   */\n  defaultValue?: string[]\n  /**\n   * The callback fired when any children Checkbox is checked or unchecked\n   */\n  onCheckedChange?: (value: string[]) => void\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const CheckboxGroup = ({\n  name: nameProp,\n  value: valueProp,\n  defaultValue,\n  className,\n  intent,\n  orientation = 'vertical',\n  onCheckedChange: onCheckedChangeProp,\n  reverse = false,\n  children,\n  ref,\n  ...others\n}: CheckboxGroupProps) => {\n  const [value, setValue] = useCombinedState(valueProp, defaultValue)\n  const field = useFormFieldControl()\n  const onCheckedChangeRef = useRef(onCheckedChangeProp)\n\n  const { id, labelId, description, state, isInvalid, isRequired } = field\n  const name = nameProp ?? field.name\n\n  const current = useMemo(() => {\n    const handleCheckedChange = (checked: boolean, changed: string) => {\n      const values = value || []\n      const modified = checked ? [...values, changed] : values.filter(val => val !== changed)\n\n      setValue(modified)\n\n      if (onCheckedChangeRef.current) {\n        onCheckedChangeRef.current(modified)\n      }\n    }\n\n    return {\n      id,\n      name,\n      value,\n      intent,\n      state,\n      isInvalid,\n      description,\n      isRequired,\n      reverse,\n      onCheckedChange: handleCheckedChange,\n    }\n  }, [id, name, value, intent, state, isInvalid, description, isRequired, setValue, reverse])\n\n  useEffect(() => {\n    onCheckedChangeRef.current = onCheckedChangeProp\n  }, [onCheckedChangeProp])\n\n  return (\n    <CheckboxGroupContext.Provider value={current}>\n      <div\n        ref={ref}\n        className={checkboxGroupStyles({ className, orientation })}\n        role=\"group\"\n        aria-labelledby={labelId}\n        aria-describedby={description}\n        {...others}\n      >\n        {children}\n      </div>\n    </CheckboxGroupContext.Provider>\n  )\n}\n\nCheckboxGroup.displayName = 'CheckboxGroup'\n"],"names":["CheckboxGroupContext","createContext","useCheckboxGroup","useContext","CheckboxIndicatorPrimitive","Checkbox","CheckboxIndicator","props","jsx","checkboxInputStyles","cva","makeVariants","CheckboxPrimitive","CheckboxInput","className","icon","Check","indeterminateIcon","Minus","intent","checked","ref","others","Icon","labelStyles","CheckboxLabel","disabled","Label","ID_PREFIX","idProp","intentProp","checkedProp","value","reverse","onCheckedChange","children","forwardedRef","checkboxId","useId","innerId","innerLabelId","field","useFormFieldControl","group","rootRef","useRef","useMergeRefs","getCheckboxAttributes","fieldState","groupState","checkboxIntent","name","isRequired","state","isInvalid","isFieldEnclosed","id","description","handleCheckedChange","isChecked","rootRefValue","isRequiredAttr","useMemo","checkboxLabel","checkboxInput","content","jsxs","Fragment","cx","checkboxGroupStyles","CheckboxGroup","nameProp","valueProp","defaultValue","orientation","onCheckedChangeProp","setValue","useCombinedState","onCheckedChangeRef","labelId","current","changed","values","modified","val","useEffect"],"mappings":"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"}

package/dist/chip/Chip.d.ts

@@ -0,0 +1,34 @@
+import { ComponentPropsWithoutRef, MouseEvent, Ref } from 'react';
+import { ChipStylesProps } from './Chip.styles';
+type ChipPrimitiveProps = Omit<ComponentPropsWithoutRef<'button'>, 'onClick' | 'disabled' | 'type'>;
+export interface ChipProps extends ChipPrimitiveProps, Omit<ChipStylesProps, 'hasClearButton'> {
+    /**
+     * Configures a toggleButton aria-pressed initial value
+     */
+    defaultPressed?: boolean;
+    /**
+     * Configures a toggleButton aria-pressed value
+     */
+    pressed?: boolean;
+    /**
+     * Change the component to the HTML tag or custom component of the only child.
+     */
+    asChild?: boolean;
+    /**
+     * Event handler fired each clicking event
+     */
+    onClick?: (event: MouseEvent<HTMLButtonElement>, args: {
+        pressed: boolean;
+        value?: number | string | readonly string[];
+    }) => void;
+    /**
+     * Clear chip handler
+     */
+    onClear?: (event?: MouseEvent<HTMLButtonElement>) => void;
+    ref?: Ref<HTMLButtonElement | HTMLDivElement>;
+}
+export declare const Chip: {
+    ({ design, disabled, children, intent, defaultPressed, pressed, asChild, className, onClick, onClear, ref: forwardedRef, ...otherProps }: ChipProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/chip/Chip.styles.d.ts

@@ -0,0 +1,8 @@
+import { VariantProps } from 'class-variance-authority';
+export declare const chipStyles: (props?: ({
+    design?: "outlined" | "dashed" | "tinted" | null | undefined;
+    intent?: "main" | "alert" | "support" | "accent" | "basic" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
+    disabled?: boolean | null | undefined;
+    hasClearButton?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export type ChipStylesProps = VariantProps<typeof chipStyles>;

package/dist/chip/ChipClearButton.d.ts

@@ -0,0 +1,10 @@
+import { ComponentPropsWithoutRef, Ref } from 'react';
+import { ChipClearButtonStylesProps } from './ChipClearButton.styles';
+export interface ChipClearButtonProps extends ComponentPropsWithoutRef<'span'>, ChipClearButtonStylesProps {
+    label: string;
+    ref?: Ref<HTMLSpanElement>;
+}
+export declare const ChipClearButton: {
+    ({ children, tabIndex, label, ref: forwardedRef, }: ChipClearButtonProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/chip/ChipClearButton.styles.d.ts

@@ -0,0 +1,10 @@
+import { VariantProps } from 'class-variance-authority';
+export declare const chipClearButtonWrapperStyles: (props?: ({
+    disabled?: boolean | null | undefined;
+    isBordered?: boolean | null | undefined;
+    design?: "outlined" | "dashed" | "tinted" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export declare const chipClearButtonStyles: (props?: ({
+    disabled?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export type ChipClearButtonStylesProps = VariantProps<typeof chipClearButtonWrapperStyles>;

package/dist/chip/ChipContent.d.ts

@@ -0,0 +1,8 @@
+import { ComponentPropsWithoutRef, Ref } from 'react';
+export type ChipContentProps = ComponentPropsWithoutRef<'span'> & {
+    ref?: Ref<HTMLSpanElement>;
+};
+export declare const ChipContent: {
+    ({ children, className, ref: forwardedRef }: ChipContentProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/chip/ChipIcon.d.ts

@@ -0,0 +1,8 @@
+import { ComponentPropsWithoutRef, Ref } from 'react';
+export type ChipIconProps = ComponentPropsWithoutRef<'span'> & {
+    ref?: Ref<HTMLSpanElement>;
+};
+export declare const ChipIcon: {
+    ({ children, className, ref: forwardedRef }: ChipIconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/chip/ChipLeadingIcon.d.ts

@@ -0,0 +1,9 @@
+import { Ref } from 'react';
+import { ChipIconProps } from './ChipIcon';
+export type ChipLeadingIconProps = ChipIconProps & {
+    ref?: Ref<HTMLSpanElement>;
+};
+export declare const ChipLeadingIcon: {
+    ({ className, ref: forwardedRef, ...props }: ChipLeadingIconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/chip/ChipTrailingIcon.d.ts

@@ -0,0 +1,9 @@
+import { Ref } from 'react';
+import { ChipIconProps } from './ChipIcon';
+export type ChipTrailingIconProps = ChipIconProps & {
+    ref?: Ref<HTMLSpanElement>;
+};
+export declare const ChipTrailingIcon: {
+    ({ className, ref: forwardedRef, ...props }: ChipTrailingIconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};