@atom-learning/components 6.17.0 → 8.0.0

package/dist/components/carousel/CarouselSlide.js

@@ -1,10 +1,24 @@
+import { cn } from "../../styled.js";
+import { CarouselSlideGapContext, toSlideGapClass } from "./CarouselSlider.js";
+import { useCarousel } from "./Carousel.js";
 import * as React$1 from "react";
-import { Slide } from "pure-react-carousel";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/carousel/CarouselSlide.tsx
-var CarouselSlide = ({ children, ...remainingProps }) => /* @__PURE__ */ React$1.createElement(Slide, {
-	...remainingProps,
-	tag: "div"
-}, /* @__PURE__ */ React$1.createElement("div", { className: "px-3" }, children));
+var CarouselSlide = ({ children, className, index, ...rest }) => {
+	const { selectedIndex } = useCarousel();
+	const gap = React$1.useContext(CarouselSlideGapContext);
+	const isSelected = selectedIndex === index;
+	return /* @__PURE__ */ jsx("div", {
+		role: "option",
+		"aria-selected": isSelected,
+		className: cn("min-w-0", "basis-full", "shrink-0", className),
+		...rest,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("flex items-center justify-center", toSlideGapClass[gap]),
+			children
+		})
+	});
+};
 //#endregion
 export { CarouselSlide };
 

package/dist/components/carousel/CarouselSlide.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselSlide.js","names":[],"sources":["../../../src/components/carousel/CarouselSlide.tsx"],"sourcesContent":["import { Slide as BaseSlide } from 'pure-react-carousel'\nimport * as React from 'react'\n\nexport const CarouselSlide = ({\n  children,\n  ...remainingProps\n}: React.ComponentProps<typeof BaseSlide> & {\n  className?: string\n  index: number\n}) => (\n  <BaseSlide {...remainingProps} tag=\"div\">\n    {/* padding to create the gap between slides */}\n    <div className=\"px-3\">{children}</div>\n  </BaseSlide>\n)\n"],"mappings":";;;AAGA,IAAa,iBAAiB,EAC5B,UACA,GAAG,qBAKH,wBAAA,cAAC,OAAD;CAAW,GAAI;CAAgB,KAAI;CAGvB,EADV,wBAAA,cAAC,OAAD,EAAK,WAAU,QAAuB,EAAf,SAAe,CAC5B"}
+{"version":3,"file":"CarouselSlide.js","names":[],"sources":["../../../src/components/carousel/CarouselSlide.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '~/styled'\n\nimport { useCarousel } from './Carousel'\nimport { CarouselSlideGapContext, toSlideGapClass } from './CarouselSlider'\n\nexport const CarouselSlide = ({\n  children,\n  className,\n  index,\n  ...rest\n}: React.PropsWithChildren<\n  { index: number } & React.HTMLAttributes<HTMLDivElement>\n>) => {\n  const { selectedIndex } = useCarousel()\n  const gap = React.useContext(CarouselSlideGapContext)\n  const isSelected = selectedIndex === index\n\n  return (\n    <div\n      role=\"option\"\n      aria-selected={isSelected}\n      // min-w-0 so basis-full wins over the content's min-content size and\n      // the slide never outgrows the slider viewport\n      className={cn('min-w-0', 'basis-full', 'shrink-0', className)}\n      {...rest}\n    >\n      {/* padding to create the gap between slides; gap=\"none\" for full-bleed */}\n      <div\n        className={cn('flex items-center justify-center', toSlideGapClass[gap])}\n      >\n        {children}\n      </div>\n    </div>\n  )\n}\n"],"mappings":";;;;;;AAOA,IAAa,iBAAiB,EAC5B,UACA,WACA,OACA,GAAG,WAGC;CACJ,MAAM,EAAE,kBAAkB,aAAa;CACvC,MAAM,MAAM,QAAM,WAAW,wBAAwB;CACrD,MAAM,aAAa,kBAAkB;AAErC,QACE,oBAAC,OAAD;EACE,MAAK;EACL,iBAAe;EAGf,WAAW,GAAG,WAAW,cAAc,YAAY,UAAU;EAC7D,GAAI;YAGJ,oBAAC,OAAD;GACE,WAAW,GAAG,oCAAoC,gBAAgB,KAAK;GAEtE;GACG,CAAA;EACF,CAAA"}

package/dist/components/carousel/CarouselSlider.d.ts

@@ -1,7 +1,13 @@
-import { Slider as BaseSlider } from 'pure-react-carousel';
 import * as React from 'react';
-export declare const CarouselSlider: ({ children, className, overflow, ...rest }: React.PropsWithChildren<typeof BaseSlider & {
-    tabIndex?: number;
+export type TCarouselSlideGap = 'none' | 0 | 1 | 2 | 3 | 4;
+export declare const toSlideGapClass: Record<TCarouselSlideGap, string>;
+export declare const CarouselSlideGapContext: React.Context<TCarouselSlideGap>;
+type CarouselSliderProps = {
+    children?: React.ReactNode;
     className?: string;
+    gap?: TCarouselSlideGap;
     overflow?: boolean;
-}>) => React.JSX.Element;
+    tabIndex?: number;
+};
+export declare const CarouselSlider: ({ children, className, gap, overflow, tabIndex, ...rest }: CarouselSliderProps) => React.JSX.Element;
+export {};

package/dist/components/carousel/CarouselSlider.js

@@ -1,12 +1,36 @@
 import { cn } from "../../styled.js";
+import { useCarousel } from "./Carousel.js";
 import * as React$1 from "react";
-import { Slider } from "pure-react-carousel";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/carousel/CarouselSlider.tsx
-var CarouselSlider = ({ children, className, overflow, ...rest }) => /* @__PURE__ */ React$1.createElement(Slider, {
-	...rest,
-	className: cn(String.raw`ml-[50%] -translate-x-1/2 cursor-grab overflow-hidden **:[[class*=slideInner]]:flex **:[[class*=slideInner]]:justify-center **:[[class*=slide\_]]:float-left **:[[class*=slide\_]]:pb-0! **:[[class*=sliderTray\_]]:transition-transform **:[[class*=sliderTray\_]]:duration-500 **:[[class*=sliderTray\_]]:ease-[cubic-bezier(.645,.045,.355,1)]`, overflow && "overflow-visible", className)
-}, children);
+var toSlideGapClass = {
+	none: "",
+	0: "px-0.5",
+	1: "px-1",
+	2: "px-2",
+	3: "px-3",
+	4: "px-4"
+};
+var CarouselSlideGapContext = React$1.createContext(3);
+var CarouselSlider = ({ children, className, gap = 3, overflow, tabIndex = 0, ...rest }) => {
+	const { emblaRef } = useCarousel();
+	return /* @__PURE__ */ jsx("div", {
+		ref: emblaRef,
+		className: cn("ml-[50%]", "-translate-x-1/2", "cursor-grab", overflow ? "overflow-visible" : "overflow-hidden", className),
+		role: "listbox",
+		"aria-live": "polite",
+		tabIndex,
+		...rest,
+		children: /* @__PURE__ */ jsx("div", {
+			className: "flex",
+			children: /* @__PURE__ */ jsx(CarouselSlideGapContext.Provider, {
+				value: gap,
+				children
+			})
+		})
+	});
+};
 //#endregion
-export { CarouselSlider };
+export { CarouselSlideGapContext, CarouselSlider, toSlideGapClass };
 
 //# sourceMappingURL=CarouselSlider.js.map

package/dist/components/carousel/CarouselSlider.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselSlider.js","names":[],"sources":["../../../src/components/carousel/CarouselSlider.tsx"],"sourcesContent":["import { Slider as BaseSlider } from 'pure-react-carousel'\nimport * as React from 'react'\n\nimport { cn } from '~/styled'\n\nexport const CarouselSlider = ({\n  children,\n  className,\n  overflow,\n  ...rest\n}: React.PropsWithChildren<\n  typeof BaseSlider & {\n    tabIndex?: number\n    className?: string\n    overflow?: boolean\n  }\n>) => (\n  <BaseSlider\n    {...rest}\n    className={cn(\n      String.raw`ml-[50%] -translate-x-1/2 cursor-grab overflow-hidden **:[[class*=slideInner]]:flex **:[[class*=slideInner]]:justify-center **:[[class*=slide\\_]]:float-left **:[[class*=slide\\_]]:pb-0! **:[[class*=sliderTray\\_]]:transition-transform **:[[class*=sliderTray\\_]]:duration-500 **:[[class*=sliderTray\\_]]:ease-[cubic-bezier(.645,.045,.355,1)]`,\n      overflow && 'overflow-visible',\n      className\n    )}\n  >\n    {children}\n  </BaseSlider>\n)\n"],"mappings":";;;;AAKA,IAAa,kBAAkB,EAC7B,UACA,WACA,UACA,GAAG,WAQH,wBAAA,cAAC,QAAD;CACE,GAAI;CACJ,WAAW,GACT,OAAO,GAAG,qVACV,YAAY,oBACZ,UACD;CAGU,EADV,SACU"}
+{"version":3,"file":"CarouselSlider.js","names":[],"sources":["../../../src/components/carousel/CarouselSlider.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '~/styled'\n\nimport { useCarousel } from './Carousel'\n\nexport type TCarouselSlideGap = 'none' | 0 | 1 | 2 | 3 | 4\n\n// Horizontal padding applied around each slide's content, on the same\n// spacing scale as Flex/ToggleGroup's gap. 'none' renders full-bleed slides.\nexport const toSlideGapClass: Record<TCarouselSlideGap, string> = {\n  none: '',\n  0: 'px-0.5',\n  1: 'px-1',\n  2: 'px-2',\n  3: 'px-3',\n  4: 'px-4'\n}\n\n// Slides read the gap via context so it is configured once on the slider.\nexport const CarouselSlideGapContext = React.createContext<TCarouselSlideGap>(3)\n\ntype CarouselSliderProps = {\n  children?: React.ReactNode\n  className?: string\n  gap?: TCarouselSlideGap\n  overflow?: boolean\n  tabIndex?: number\n}\n\nexport const CarouselSlider = ({\n  children,\n  className,\n  gap = 3,\n  overflow,\n  tabIndex = 0,\n  ...rest\n}: CarouselSliderProps) => {\n  const { emblaRef } = useCarousel()\n\n  return (\n    <div\n      ref={emblaRef}\n      className={cn(\n        'ml-[50%]',\n        '-translate-x-1/2',\n        'cursor-grab',\n        overflow ? 'overflow-visible' : 'overflow-hidden',\n        className\n      )}\n      role=\"listbox\"\n      aria-live=\"polite\"\n      tabIndex={tabIndex}\n      {...rest}\n    >\n      <div className=\"flex\">\n        <CarouselSlideGapContext.Provider value={gap}>\n          {children}\n        </CarouselSlideGapContext.Provider>\n      </div>\n    </div>\n  )\n}\n"],"mappings":";;;;;AAUA,IAAa,kBAAqD;CAChE,MAAM;CACN,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACJ;AAGD,IAAa,0BAA0B,QAAM,cAAiC,EAAE;AAUhF,IAAa,kBAAkB,EAC7B,UACA,WACA,MAAM,GACN,UACA,WAAW,GACX,GAAG,WACsB;CACzB,MAAM,EAAE,aAAa,aAAa;AAElC,QACE,oBAAC,OAAD;EACE,KAAK;EACL,WAAW,GACT,YACA,oBACA,eACA,WAAW,qBAAqB,mBAChC,UACD;EACD,MAAK;EACL,aAAU;EACA;EACV,GAAI;YAEJ,oBAAC,OAAD;GAAK,WAAU;aACb,oBAAC,wBAAwB,UAAzB;IAAkC,OAAO;IACtC;IACgC,CAAA;GAC/B,CAAA;EACF,CAAA"}

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

@@ -1,6 +1,8 @@
 import * as RadixCheckbox from '@radix-ui/react-checkbox';
 import * as React from 'react';
-export declare const Checkbox: React.ForwardRefExoticComponent<Omit<Omit<RadixCheckbox.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "size" | "state"> & {
+export declare const Checkbox: React.ForwardRefExoticComponent<Omit<Omit<Omit<RadixCheckbox.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | React.RefObject<HTMLButtonElement> | null | undefined;
+}, "size" | "state"> & {
     state?: "error" | undefined;
     size?: "md" | "lg" | undefined;
 } & {

package/dist/components/checkbox/Checkbox.js

@@ -2,6 +2,7 @@ import { styled } from "../../styled.js";
 import { Icon } from "../icon/Icon.js";
 import { overrideStyledVariantValue } from "../../utilities/override-styled-variant-value/overrideStyledVariantValue.js";
 import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Minus, Ok } from "@atom-learning/icons";
 import * as RadixCheckbox from "@radix-ui/react-checkbox";
 //#region src/components/checkbox/Checkbox.tsx
@@ -63,16 +64,23 @@ var toIconSize = {
 };
 var Checkbox = React$1.forwardRef(({ size = "md", checked, ...rest }, ref) => {
 	const iconSize = React$1.useMemo(() => overrideStyledVariantValue(size, (s) => toIconSize[s]), [size]);
-	return /* @__PURE__ */ React$1.createElement("div", { className: "relative z-1" }, /* @__PURE__ */ React$1.createElement(StyledCheckbox, {
-		ref,
-		checked,
-		size,
-		...rest
-	}, /* @__PURE__ */ React$1.createElement("div", { className: "absolute -inset-3 opacity-50" }), /* @__PURE__ */ React$1.createElement(RadixCheckbox.Indicator, { asChild: true }, /* @__PURE__ */ React$1.createElement(Icon, {
-		is: checked === "indeterminate" ? Minus : Ok,
-		size: iconSize,
-		className: "stroke-3"
-	}))));
+	return /* @__PURE__ */ jsx("div", {
+		className: "relative z-1",
+		children: /* @__PURE__ */ jsxs(StyledCheckbox, {
+			ref,
+			checked,
+			size,
+			...rest,
+			children: [/* @__PURE__ */ jsx("div", { className: "absolute -inset-3 opacity-50" }), /* @__PURE__ */ jsx(RadixCheckbox.Indicator, {
+				asChild: true,
+				children: /* @__PURE__ */ jsx(Icon, {
+					is: checked === "indeterminate" ? Minus : Ok,
+					size: iconSize,
+					className: "stroke-3"
+				})
+			})]
+		})
+	});
 });
 Checkbox.displayName = "Checkbox";
 //#endregion

package/dist/components/checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","names":[],"sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import { Minus, Ok } from '@atom-learning/icons'\nimport * as RadixCheckbox from '@radix-ui/react-checkbox'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { Icon } from '../icon/Icon'\n\nconst StyledCheckbox = styled(RadixCheckbox.Root, {\n  base: [\n    'appearance-none',\n    'relative',\n    'bg-transparent',\n    'border',\n    'border-grey-800',\n    'rounded-[3px]',\n    'text-white',\n    'bg-white',\n    'cursor-pointer',\n    'size-4',\n    'p-0',\n    'flex',\n    'items-center',\n    'justify-center',\n    'transition-all',\n    'duration-50',\n    'ease-out',\n    'shrink-0',\n    'not-disabled:before:-inset-2',\n    'not-disabled:before:-z-1',\n    'not-disabled:before:absolute',\n    'not-disabled:before:bg-primary-300',\n    \"not-disabled:before:content-['']\",\n    'not-disabled:before:duration-125',\n    'not-disabled:before:ease-in-out',\n    'not-disabled:before:opacity-0',\n    'not-disabled:before:rounded-[50%]',\n    'not-disabled:before:scale-0',\n    'not-disabled:before:transition-[opacity,scale]',\n    'not-disabled:hover:before:opacity-100',\n    'not-disabled:hover:before:scale-100',\n    'data-[state=checked]:bg-primary-800',\n    'data-[state=checked]:border-primary-800',\n    'data-[state=indeterminate]:bg-primary-800',\n    'data-[state=indeterminate]:border-primary-800',\n    'focus:-outline-offset-1',\n    'focus:outline-2',\n    'focus:outline-primary-800',\n    'focus:outline-solid',\n    'disabled:cursor-not-allowed',\n    'disabled:opacity-30'\n  ],\n  variants: {\n    state: {\n      error: ['border-danger']\n    },\n    size: {\n      md: ['size-4'],\n      lg: ['mt-px', 'size-6']\n    }\n  }\n})\n\nconst toIconSize = {\n  md: 'sm',\n  lg: 'sm'\n}\n\nexport const Checkbox = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentProps<typeof StyledCheckbox>\n>(({ size = 'md', checked, ...rest }, ref) => {\n  const iconSize = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => toIconSize[s]),\n    [size]\n  )\n\n  return (\n    <div className=\"relative z-1\">\n      <StyledCheckbox ref={ref} checked={checked} size={size} {...rest}>\n        <div className=\"absolute -inset-3 opacity-50\" />\n        <RadixCheckbox.Indicator asChild>\n          <Icon\n            is={checked === 'indeterminate' ? Minus : Ok}\n            size={iconSize}\n            className=\"stroke-3\"\n          />\n        </RadixCheckbox.Indicator>\n      </StyledCheckbox>\n    </div>\n  )\n})\n\nCheckbox.displayName = 'Checkbox'\n"],"mappings":";;;;;;;AASA,IAAM,iBAAiB,OAAO,cAAc,MAAM;CAChD,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO,EACL,OAAO,CAAC,gBAAgB,EACzB;EACD,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS,SAAS;GACxB;EACF;CACF,CAAC;AAEF,IAAM,aAAa;CACjB,IAAI;CACJ,IAAI;CACL;AAED,IAAa,WAAW,QAAM,YAG3B,EAAE,OAAO,MAAM,SAAS,GAAG,QAAQ,QAAQ;CAC5C,MAAM,WAAW,QAAM,cACf,2BAA2B,OAAO,MAAM,WAAW,GAAG,EAC5D,CAAC,KAAK,CACP;AAED,QACE,wBAAA,cAAC,OAAD,EAAK,WAAU,gBAWT,EAVJ,wBAAA,cAAC,gBAAD;EAAqB;EAAc;EAAe;EAAM,GAAI;EAS3C,EARf,wBAAA,cAAC,OAAD,EAAK,WAAU,gCAAiC,CAAA,EAChD,wBAAA,cAAC,cAAc,WAAf,EAAyB,SAAA,MAMC,EALxB,wBAAA,cAAC,MAAD;EACE,IAAI,YAAY,kBAAkB,QAAQ;EAC1C,MAAM;EACN,WAAU;EACV,CAAA,CACsB,CACX,CACb;EAER;AAEF,SAAS,cAAc"}
+{"version":3,"file":"Checkbox.js","names":[],"sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import { Minus, Ok } from '@atom-learning/icons'\nimport * as RadixCheckbox from '@radix-ui/react-checkbox'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { Icon } from '../icon/Icon'\n\nconst StyledCheckbox = styled(RadixCheckbox.Root, {\n  base: [\n    'appearance-none',\n    'relative',\n    'bg-transparent',\n    'border',\n    'border-grey-800',\n    'rounded-[3px]',\n    'text-white',\n    'bg-white',\n    'cursor-pointer',\n    'size-4',\n    'p-0',\n    'flex',\n    'items-center',\n    'justify-center',\n    'transition-all',\n    'duration-50',\n    'ease-out',\n    'shrink-0',\n    'not-disabled:before:-inset-2',\n    'not-disabled:before:-z-1',\n    'not-disabled:before:absolute',\n    'not-disabled:before:bg-primary-300',\n    \"not-disabled:before:content-['']\",\n    'not-disabled:before:duration-125',\n    'not-disabled:before:ease-in-out',\n    'not-disabled:before:opacity-0',\n    'not-disabled:before:rounded-[50%]',\n    'not-disabled:before:scale-0',\n    'not-disabled:before:transition-[opacity,scale]',\n    'not-disabled:hover:before:opacity-100',\n    'not-disabled:hover:before:scale-100',\n    'data-[state=checked]:bg-primary-800',\n    'data-[state=checked]:border-primary-800',\n    'data-[state=indeterminate]:bg-primary-800',\n    'data-[state=indeterminate]:border-primary-800',\n    'focus:-outline-offset-1',\n    'focus:outline-2',\n    'focus:outline-primary-800',\n    'focus:outline-solid',\n    'disabled:cursor-not-allowed',\n    'disabled:opacity-30'\n  ],\n  variants: {\n    state: {\n      error: ['border-danger']\n    },\n    size: {\n      md: ['size-4'],\n      lg: ['mt-px', 'size-6']\n    }\n  }\n})\n\nconst toIconSize = {\n  md: 'sm',\n  lg: 'sm'\n}\n\nexport const Checkbox = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentProps<typeof StyledCheckbox>\n>(({ size = 'md', checked, ...rest }, ref) => {\n  const iconSize = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => toIconSize[s]),\n    [size]\n  )\n\n  return (\n    <div className=\"relative z-1\">\n      <StyledCheckbox ref={ref} checked={checked} size={size} {...rest}>\n        <div className=\"absolute -inset-3 opacity-50\" />\n        <RadixCheckbox.Indicator asChild>\n          <Icon\n            is={checked === 'indeterminate' ? Minus : Ok}\n            size={iconSize}\n            className=\"stroke-3\"\n          />\n        </RadixCheckbox.Indicator>\n      </StyledCheckbox>\n    </div>\n  )\n})\n\nCheckbox.displayName = 'Checkbox'\n"],"mappings":";;;;;;;;AASA,IAAM,iBAAiB,OAAO,cAAc,MAAM;CAChD,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO,EACL,OAAO,CAAC,gBAAgB,EACzB;EACD,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS,SAAS;GACxB;EACF;CACF,CAAC;AAEF,IAAM,aAAa;CACjB,IAAI;CACJ,IAAI;CACL;AAED,IAAa,WAAW,QAAM,YAG3B,EAAE,OAAO,MAAM,SAAS,GAAG,QAAQ,QAAQ;CAC5C,MAAM,WAAW,QAAM,cACf,2BAA2B,OAAO,MAAM,WAAW,GAAG,EAC5D,CAAC,KAAK,CACP;AAED,QACE,oBAAC,OAAD;EAAK,WAAU;YACb,qBAAC,gBAAD;GAAqB;GAAc;GAAe;GAAM,GAAI;aAA5D,CACE,oBAAC,OAAD,EAAK,WAAU,gCAAiC,CAAA,EAChD,oBAAC,cAAc,WAAf;IAAyB,SAAA;cACvB,oBAAC,MAAD;KACE,IAAI,YAAY,kBAAkB,QAAQ;KAC1C,MAAM;KACN,WAAU;KACV,CAAA;IACsB,CAAA,CACX;;EACb,CAAA;EAER;AAEF,SAAS,cAAc"}

package/dist/components/checkbox-field/CheckboxField.js

@@ -2,6 +2,7 @@ import { Checkbox } from "../checkbox/Checkbox.js";
 import { InlineFieldWrapper } from "../field-wrapper/InlineFieldWrapper.js";
 import { useFieldError } from "../form/useFieldError.js";
 import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
 import { useController, useFormContext } from "react-hook-form";
 //#region src/components/checkbox-field/CheckboxField.tsx
 var CheckboxValue = /* @__PURE__ */ function(CheckboxValue) {
@@ -21,24 +22,25 @@ var CheckboxField = ({ className, label, name, validation, description, defaultC
 	React$1.useEffect(() => {
 		if (typeof checked !== "undefined") onChange(checked);
 	}, [checked]);
-	return /* @__PURE__ */ React$1.createElement(InlineFieldWrapper, {
+	return /* @__PURE__ */ jsx(InlineFieldWrapper, {
 		className,
 		description,
 		error,
 		label,
-		required: Boolean(validation?.required)
-	}, /* @__PURE__ */ React$1.createElement(Checkbox, {
-		ref,
-		name: innerName,
-		...remainingProps,
-		onCheckedChange: (newChecked) => {
-			onChange(newChecked);
-			onCheckedChange?.(newChecked);
-		},
-		value: innerChecked ? CheckboxValue.ON : CheckboxValue.OFF,
-		checked: innerChecked,
-		...error && { state: "error" }
-	}));
+		required: Boolean(validation?.required),
+		children: /* @__PURE__ */ jsx(Checkbox, {
+			ref,
+			name: innerName,
+			...remainingProps,
+			onCheckedChange: (newChecked) => {
+				onChange(newChecked);
+				onCheckedChange?.(newChecked);
+			},
+			value: innerChecked ? CheckboxValue.ON : CheckboxValue.OFF,
+			checked: innerChecked,
+			...error && { state: "error" }
+		})
+	});
 };
 CheckboxField.displayName = "CheckboxField";
 //#endregion

package/dist/components/checkbox-field/CheckboxField.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxField.js","names":[],"sources":["../../../src/components/checkbox-field/CheckboxField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { Checkbox } from '~/components/checkbox/Checkbox'\nimport { FieldElementWrapperProps } from '~/components/field-wrapper/FieldWrapper'\nimport { InlineFieldWrapper } from '~/components/field-wrapper/InlineFieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\n\nenum CheckboxValue {\n  ON = 'on',\n  OFF = 'off'\n}\n\nexport const CheckboxField = ({\n  className,\n  label,\n  name,\n  validation,\n  description,\n  defaultChecked = false,\n  checked,\n  onCheckedChange,\n  ...remainingProps\n}: React.ComponentProps<typeof Checkbox> & FieldElementWrapperProps) => {\n  const { control } = useFormContext()\n  const { error } = useFieldError(name)\n  const {\n    field: { ref, onChange, value: innerChecked, name: innerName }\n  } = useController({\n    name,\n    control,\n    rules: validation,\n    defaultValue: defaultChecked\n  })\n\n  React.useEffect(() => {\n    // Update the react-hook-form inner checked to match what is passed in.\n    if (typeof checked !== 'undefined') onChange(checked)\n  }, [checked])\n\n  return (\n    <InlineFieldWrapper\n      className={className}\n      description={description}\n      error={error}\n      label={label}\n      required={Boolean(validation?.required)}\n    >\n      <Checkbox\n        ref={ref}\n        name={innerName}\n        {...remainingProps}\n        onCheckedChange={(newChecked) => {\n          onChange(newChecked)\n          onCheckedChange?.(newChecked)\n        }}\n        value={innerChecked ? CheckboxValue.ON : CheckboxValue.OFF}\n        checked={innerChecked}\n        {...(error && { state: 'error' })}\n      />\n    </InlineFieldWrapper>\n  )\n}\n\nCheckboxField.displayName = 'CheckboxField'\n"],"mappings":";;;;;;AAQA,IAAK,gBAAL,yBAAA,eAAA;AACE,eAAA,QAAA;AACA,eAAA,SAAA;;EAFG,iBAAA,EAAA,CAGJ;AAED,IAAa,iBAAiB,EAC5B,WACA,OACA,MACA,YACA,aACA,iBAAiB,OACjB,SACA,iBACA,GAAG,qBACmE;CACtE,MAAM,EAAE,YAAY,gBAAgB;CACpC,MAAM,EAAE,UAAU,cAAc,KAAK;CACrC,MAAM,EACJ,OAAO,EAAE,KAAK,UAAU,OAAO,cAAc,MAAM,gBACjD,cAAc;EAChB;EACA;EACA,OAAO;EACP,cAAc;EACf,CAAC;AAEF,SAAM,gBAAgB;AAEpB,MAAI,OAAO,YAAY,YAAa,UAAS,QAAQ;IACpD,CAAC,QAAQ,CAAC;AAEb,QACE,wBAAA,cAAC,oBAAD;EACa;EACE;EACN;EACA;EACP,UAAU,QAAQ,YAAY,SAAS;EAcpB,EAZnB,wBAAA,cAAC,UAAD;EACO;EACL,MAAM;EACN,GAAI;EACJ,kBAAkB,eAAe;AAC/B,YAAS,WAAW;AACpB,qBAAkB,WAAW;;EAE/B,OAAO,eAAe,cAAc,KAAK,cAAc;EACvD,SAAS;EACT,GAAK,SAAS,EAAE,OAAO,SAAS;EAChC,CAAA,CACiB;;AAIzB,cAAc,cAAc"}
+{"version":3,"file":"CheckboxField.js","names":[],"sources":["../../../src/components/checkbox-field/CheckboxField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { Checkbox } from '~/components/checkbox/Checkbox'\nimport { FieldElementWrapperProps } from '~/components/field-wrapper/FieldWrapper'\nimport { InlineFieldWrapper } from '~/components/field-wrapper/InlineFieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\n\nenum CheckboxValue {\n  ON = 'on',\n  OFF = 'off'\n}\n\nexport const CheckboxField = ({\n  className,\n  label,\n  name,\n  validation,\n  description,\n  defaultChecked = false,\n  checked,\n  onCheckedChange,\n  ...remainingProps\n}: React.ComponentProps<typeof Checkbox> & FieldElementWrapperProps) => {\n  const { control } = useFormContext()\n  const { error } = useFieldError(name)\n  const {\n    field: { ref, onChange, value: innerChecked, name: innerName }\n  } = useController({\n    name,\n    control,\n    rules: validation,\n    defaultValue: defaultChecked\n  })\n\n  React.useEffect(() => {\n    // Update the react-hook-form inner checked to match what is passed in.\n    if (typeof checked !== 'undefined') onChange(checked)\n  }, [checked])\n\n  return (\n    <InlineFieldWrapper\n      className={className}\n      description={description}\n      error={error}\n      label={label}\n      required={Boolean(validation?.required)}\n    >\n      <Checkbox\n        ref={ref}\n        name={innerName}\n        {...remainingProps}\n        onCheckedChange={(newChecked) => {\n          onChange(newChecked)\n          onCheckedChange?.(newChecked)\n        }}\n        value={innerChecked ? CheckboxValue.ON : CheckboxValue.OFF}\n        checked={innerChecked}\n        {...(error && { state: 'error' })}\n      />\n    </InlineFieldWrapper>\n  )\n}\n\nCheckboxField.displayName = 'CheckboxField'\n"],"mappings":";;;;;;;AAQA,IAAK,gBAAL,yBAAA,eAAA;AACE,eAAA,QAAA;AACA,eAAA,SAAA;;EAFG,iBAAA,EAAA,CAGJ;AAED,IAAa,iBAAiB,EAC5B,WACA,OACA,MACA,YACA,aACA,iBAAiB,OACjB,SACA,iBACA,GAAG,qBACmE;CACtE,MAAM,EAAE,YAAY,gBAAgB;CACpC,MAAM,EAAE,UAAU,cAAc,KAAK;CACrC,MAAM,EACJ,OAAO,EAAE,KAAK,UAAU,OAAO,cAAc,MAAM,gBACjD,cAAc;EAChB;EACA;EACA,OAAO;EACP,cAAc;EACf,CAAC;AAEF,SAAM,gBAAgB;AAEpB,MAAI,OAAO,YAAY,YAAa,UAAS,QAAQ;IACpD,CAAC,QAAQ,CAAC;AAEb,QACE,oBAAC,oBAAD;EACa;EACE;EACN;EACA;EACP,UAAU,QAAQ,YAAY,SAAS;YAEvC,oBAAC,UAAD;GACO;GACL,MAAM;GACN,GAAI;GACJ,kBAAkB,eAAe;AAC/B,aAAS,WAAW;AACpB,sBAAkB,WAAW;;GAE/B,OAAO,eAAe,cAAc,KAAK,cAAc;GACvD,SAAS;GACT,GAAK,SAAS,EAAE,OAAO,SAAS;GAChC,CAAA;EACiB,CAAA;;AAIzB,cAAc,cAAc"}

package/dist/components/checkbox-group/CheckboxGroup.d.ts

@@ -7,14 +7,16 @@ type CheckboxGroupRootProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'defaul
     asChild?: boolean;
 };
 export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange, asChild, ...rest }: CheckboxGroupRootProps) => React.JSX.Element) & {
-    Item: ({ value, title, onCheckedChange, ...rest }: Omit<Omit<Omit<import("@radix-ui/react-checkbox").CheckboxProps & React.RefAttributes<HTMLButtonElement>, "size" | "state"> & {
+    Item: ({ value, title, onCheckedChange, ...rest }: Omit<Omit<Omit<Omit<import("@radix-ui/react-checkbox").CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | React.RefObject<HTMLButtonElement> | null | undefined;
+    }, "size" | "state"> & {
         state?: "error" | undefined;
         size?: "md" | "lg" | undefined;
     } & {
         as?: React.ElementType;
     }, "ref"> & React.RefAttributes<HTMLButtonElement>, "defaultChecked" | "checked" | "onCheckedChange"> & {
         onCheckedChange?: (newChecked: boolean) => void;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
     AllItem: ({ onCheckedChange, title, ...rest }: {
         required?: boolean | undefined;
         content?: string | undefined | undefined;
@@ -27,7 +29,8 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         slot?: string | undefined | undefined;
         style?: React.CSSProperties | undefined;
         title?: string | undefined | undefined;
-        ref?: React.Ref<HTMLButtonElement> | undefined;
+        ref?: React.LegacyRef<HTMLButtonElement> | undefined;
+        suppressHydrationWarning?: boolean | undefined | undefined;
         className?: string | undefined | undefined;
         id?: string | undefined | undefined;
         lang?: string | undefined | undefined;
@@ -38,14 +41,18 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         "aria-activedescendant"?: string | undefined | undefined;
         "aria-atomic"?: (boolean | "true" | "false") | undefined;
         "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
+        "aria-braillelabel"?: string | undefined | undefined;
+        "aria-brailleroledescription"?: string | undefined | undefined;
         "aria-busy"?: (boolean | "true" | "false") | undefined;
         "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
         "aria-colcount"?: number | undefined | undefined;
         "aria-colindex"?: number | undefined | undefined;
+        "aria-colindextext"?: string | undefined | undefined;
         "aria-colspan"?: number | undefined | undefined;
         "aria-controls"?: string | undefined | undefined;
         "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
         "aria-describedby"?: string | undefined | undefined;
+        "aria-description"?: string | undefined | undefined;
         "aria-details"?: string | undefined | undefined;
         "aria-disabled"?: (boolean | "true" | "false") | undefined;
         "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
@@ -75,6 +82,7 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         "aria-roledescription"?: string | undefined | undefined;
         "aria-rowcount"?: number | undefined | undefined;
         "aria-rowindex"?: number | undefined | undefined;
+        "aria-rowindextext"?: string | undefined | undefined;
         "aria-rowspan"?: number | undefined | undefined;
         "aria-selected"?: (boolean | "true" | "false") | undefined;
         "aria-setsize"?: number | undefined | undefined;
@@ -104,7 +112,7 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         onBlurCapture?: React.FocusEventHandler<HTMLButtonElement> | undefined;
         onChange?: React.FormEventHandler<HTMLButtonElement> | undefined;
         onChangeCapture?: React.FormEventHandler<HTMLButtonElement> | undefined;
-        onBeforeInput?: React.FormEventHandler<HTMLButtonElement> | undefined;
+        onBeforeInput?: React.InputEventHandler<HTMLButtonElement> | undefined;
         onBeforeInputCapture?: React.FormEventHandler<HTMLButtonElement> | undefined;
         onInput?: React.FormEventHandler<HTMLButtonElement> | undefined;
         onInputCapture?: React.FormEventHandler<HTMLButtonElement> | undefined;
@@ -223,9 +231,7 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         onPointerCancel?: React.PointerEventHandler<HTMLButtonElement> | undefined;
         onPointerCancelCapture?: React.PointerEventHandler<HTMLButtonElement> | undefined;
         onPointerEnter?: React.PointerEventHandler<HTMLButtonElement> | undefined;
-        onPointerEnterCapture?: React.PointerEventHandler<HTMLButtonElement> | undefined;
         onPointerLeave?: React.PointerEventHandler<HTMLButtonElement> | undefined;
-        onPointerLeaveCapture?: React.PointerEventHandler<HTMLButtonElement> | undefined;
         onPointerOver?: React.PointerEventHandler<HTMLButtonElement> | undefined;
         onPointerOverCapture?: React.PointerEventHandler<HTMLButtonElement> | undefined;
         onPointerOut?: React.PointerEventHandler<HTMLButtonElement> | undefined;
@@ -249,16 +255,16 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         key?: React.Key | null | undefined;
         defaultValue?: string | number | readonly string[] | undefined;
         suppressContentEditableWarning?: boolean | undefined | undefined;
-        suppressHydrationWarning?: boolean | undefined | undefined;
         accessKey?: string | undefined | undefined;
+        autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
         autoFocus?: boolean | undefined | undefined;
-        contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
+        contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
         contextMenu?: string | undefined | undefined;
         dir?: string | undefined | undefined;
         draggable?: (boolean | "true" | "false") | undefined;
+        enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
         hidden?: boolean | undefined | undefined;
         nonce?: string | undefined | undefined;
-        placeholder?: string | undefined | undefined;
         spellCheck?: (boolean | "true" | "false") | undefined;
         radioGroup?: string | undefined | undefined;
         about?: string | undefined | undefined;
@@ -270,7 +276,6 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         rev?: string | undefined | undefined;
         typeof?: string | undefined | undefined;
         vocab?: string | undefined | undefined;
-        autoCapitalize?: string | undefined | undefined;
         autoCorrect?: string | undefined | undefined;
         autoSave?: string | undefined | undefined;
         itemProp?: string | undefined | undefined;
@@ -283,10 +288,12 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         unselectable?: "on" | "off" | undefined | undefined;
         inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
         is?: string | undefined | undefined;
+        exportparts?: string | undefined | undefined;
+        part?: string | undefined | undefined;
         disabled?: boolean | undefined | undefined;
         value?: string | number | readonly string[] | undefined;
         as?: React.ElementType | undefined;
-        formAction?: string | undefined | undefined;
+        formAction?: string | undefined;
         formEncType?: string | undefined | undefined;
         formMethod?: string | undefined | undefined;
         formNoValidate?: boolean | undefined | undefined;
@@ -294,9 +301,9 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         asChild?: boolean | undefined;
         state?: "error" | undefined;
         onCheckedChange?: ((checked: import("@radix-ui/react-checkbox").CheckedState) => void) | undefined;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
     Sub: ({ asChild, ...rest }: React.HTMLAttributes<HTMLDivElement> & {
         asChild?: boolean;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
 };
 export {};

package/dist/components/checkbox-group/CheckboxGroup.js

@@ -3,16 +3,17 @@ import { CheckboxGroupMountedProvider } from "./context/CheckboxGroupMounted.con
 import { CheckboxGroupAllItem } from "./CheckboxGroupAllItem.js";
 import { CheckboxGroupItem } from "./CheckboxGroupItem.js";
 import { CheckboxGroupSub } from "./CheckboxGroupSub.js";
-import * as React$1 from "react";
+import "react";
+import { jsx } from "react/jsx-runtime";
 import { Slot } from "@radix-ui/react-slot";
 //#region src/components/checkbox-group/CheckboxGroup.tsx
 var CheckboxGroupRoot = ({ checked, defaultChecked, onCheckedChange, asChild = false, ...rest }) => {
-	const Component = asChild ? Slot : "div";
-	return /* @__PURE__ */ React$1.createElement(CheckboxGroupCheckedProvider, {
+	return /* @__PURE__ */ jsx(CheckboxGroupCheckedProvider, {
 		checked,
 		defaultChecked,
-		onCheckedChange
-	}, /* @__PURE__ */ React$1.createElement(CheckboxGroupMountedProvider, null, /* @__PURE__ */ React$1.createElement(Component, rest)));
+		onCheckedChange,
+		children: /* @__PURE__ */ jsx(CheckboxGroupMountedProvider, { children: /* @__PURE__ */ jsx(asChild ? Slot : "div", { ...rest }) })
+	});
 };
 var CheckboxGroup = Object.assign(CheckboxGroupRoot, {
 	Item: CheckboxGroupItem,

package/dist/components/checkbox-group/CheckboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.js","names":[],"sources":["../../../src/components/checkbox-group/CheckboxGroup.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport type { CheckboxGroupItemValue } from './CheckboxGroup.types'\nimport { CheckboxGroupAllItem } from './CheckboxGroupAllItem'\nimport { CheckboxGroupItem } from './CheckboxGroupItem'\nimport { CheckboxGroupSub } from './CheckboxGroupSub'\nimport { CheckboxGroupCheckedProvider } from './context/CheckboxGroupChecked.context'\nimport { CheckboxGroupMountedProvider } from './context/CheckboxGroupMounted.context'\n\ntype CheckboxGroupRootProps = Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  'defaultChecked'\n> & {\n  checked?: CheckboxGroupItemValue[]\n  onCheckedChange?: (checked: CheckboxGroupItemValue[]) => void\n  defaultChecked?: CheckboxGroupItemValue[]\n  asChild?: boolean\n}\n\nconst CheckboxGroupRoot = ({\n  checked,\n  defaultChecked,\n  onCheckedChange,\n  asChild = false,\n  ...rest\n}: CheckboxGroupRootProps) => {\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <CheckboxGroupCheckedProvider\n      checked={checked}\n      defaultChecked={defaultChecked}\n      onCheckedChange={onCheckedChange}\n    >\n      <CheckboxGroupMountedProvider>\n        <Component {...rest} />\n      </CheckboxGroupMountedProvider>\n    </CheckboxGroupCheckedProvider>\n  )\n}\n\nexport const CheckboxGroup = Object.assign(CheckboxGroupRoot, {\n  Item: CheckboxGroupItem,\n  AllItem: CheckboxGroupAllItem,\n  Sub: CheckboxGroupSub\n})\n"],"mappings":";;;;;;;;AAoBA,IAAM,qBAAqB,EACzB,SACA,gBACA,iBACA,UAAU,OACV,GAAG,WACyB;CAC5B,MAAM,YAAY,UAAU,OAAO;AAEnC,QACE,wBAAA,cAAC,8BAAD;EACW;EACO;EACC;EAKY,EAH7B,wBAAA,cAAC,8BAAA,MACC,wBAAA,cAAC,WAAc,KAAQ,CACM,CACF;;AAInC,IAAa,gBAAgB,OAAO,OAAO,mBAAmB;CAC5D,MAAM;CACN,SAAS;CACT,KAAK;CACN,CAAC"}
+{"version":3,"file":"CheckboxGroup.js","names":[],"sources":["../../../src/components/checkbox-group/CheckboxGroup.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport type { CheckboxGroupItemValue } from './CheckboxGroup.types'\nimport { CheckboxGroupAllItem } from './CheckboxGroupAllItem'\nimport { CheckboxGroupItem } from './CheckboxGroupItem'\nimport { CheckboxGroupSub } from './CheckboxGroupSub'\nimport { CheckboxGroupCheckedProvider } from './context/CheckboxGroupChecked.context'\nimport { CheckboxGroupMountedProvider } from './context/CheckboxGroupMounted.context'\n\ntype CheckboxGroupRootProps = Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  'defaultChecked'\n> & {\n  checked?: CheckboxGroupItemValue[]\n  onCheckedChange?: (checked: CheckboxGroupItemValue[]) => void\n  defaultChecked?: CheckboxGroupItemValue[]\n  asChild?: boolean\n}\n\nconst CheckboxGroupRoot = ({\n  checked,\n  defaultChecked,\n  onCheckedChange,\n  asChild = false,\n  ...rest\n}: CheckboxGroupRootProps) => {\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <CheckboxGroupCheckedProvider\n      checked={checked}\n      defaultChecked={defaultChecked}\n      onCheckedChange={onCheckedChange}\n    >\n      <CheckboxGroupMountedProvider>\n        <Component {...rest} />\n      </CheckboxGroupMountedProvider>\n    </CheckboxGroupCheckedProvider>\n  )\n}\n\nexport const CheckboxGroup = Object.assign(CheckboxGroupRoot, {\n  Item: CheckboxGroupItem,\n  AllItem: CheckboxGroupAllItem,\n  Sub: CheckboxGroupSub\n})\n"],"mappings":";;;;;;;;;AAoBA,IAAM,qBAAqB,EACzB,SACA,gBACA,iBACA,UAAU,OACV,GAAG,WACyB;AAG5B,QACE,oBAAC,8BAAD;EACW;EACO;EACC;YAEjB,oBAAC,8BAAD,EAAA,UACE,oBATY,UAAU,OAAO,OAS7B,EAAW,GAAI,MAAQ,CAAA,EACM,CAAA;EACF,CAAA;;AAInC,IAAa,gBAAgB,OAAO,OAAO,mBAAmB;CAC5D,MAAM;CACN,SAAS;CACT,KAAK;CACN,CAAC"}

package/dist/components/checkbox-group/CheckboxGroupAllItem.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
 import { Checkbox } from '../checkbox/Checkbox';
 type CheckboxGroupAllItemProps = Omit<React.ComponentProps<typeof Checkbox>, 'checked' | 'defaultChecked'>;
-export declare const CheckboxGroupAllItem: ({ onCheckedChange, title, ...rest }: CheckboxGroupAllItemProps) => JSX.Element;
+export declare const CheckboxGroupAllItem: ({ onCheckedChange, title, ...rest }: CheckboxGroupAllItemProps) => React.JSX.Element;
 export {};

package/dist/components/checkbox-group/CheckboxGroupAllItem.js

@@ -2,6 +2,7 @@ import { Checkbox } from "../checkbox/Checkbox.js";
 import { CheckboxGroupCheckedContext } from "./context/CheckboxGroupChecked.context.js";
 import { CheckboxGroupMountedContext } from "./context/CheckboxGroupMounted.context.js";
 import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/checkbox-group/CheckboxGroupAllItem.tsx
 var CheckboxGroupAllItem = ({ onCheckedChange, title = "all", ...rest }) => {
 	const { checked: checkedItems, handleItemCheckedChange: handleItemCheckedChangeContext } = React$1.useContext(CheckboxGroupCheckedContext);
@@ -12,15 +13,14 @@ var CheckboxGroupAllItem = ({ onCheckedChange, title = "all", ...rest }) => {
 		});
 		onCheckedChange?.(newChecked);
 	};
-	const isAllChecked = (() => {
-		if (!checkedItems.length || !mountedItems.length) return false;
-		if (mountedItems.every((mountedItem) => checkedItems.includes(mountedItem))) return true;
-		if (mountedItems.some((mountedItem) => checkedItems.includes(mountedItem))) return "indeterminate";
-		return false;
-	})();
-	return /* @__PURE__ */ React$1.createElement(Checkbox, {
+	return /* @__PURE__ */ jsx(Checkbox, {
 		onCheckedChange: handleItemCheckedChange,
-		checked: isAllChecked,
+		checked: (() => {
+			if (!checkedItems.length || !mountedItems.length) return false;
+			if (mountedItems.every((mountedItem) => checkedItems.includes(mountedItem))) return true;
+			if (mountedItems.some((mountedItem) => checkedItems.includes(mountedItem))) return "indeterminate";
+			return false;
+		})(),
 		title,
 		...rest
 	});

package/dist/components/checkbox-group/CheckboxGroupAllItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroupAllItem.js","names":[],"sources":["../../../src/components/checkbox-group/CheckboxGroupAllItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Checkbox } from '../checkbox/Checkbox'\nimport { CheckboxGroupCheckedContext } from './context/CheckboxGroupChecked.context'\nimport { CheckboxGroupMountedContext } from './context/CheckboxGroupMounted.context'\n\ntype CheckboxGroupAllItemProps = Omit<\n  React.ComponentProps<typeof Checkbox>,\n  'checked' | 'defaultChecked'\n>\n\nexport const CheckboxGroupAllItem = ({\n  onCheckedChange,\n  title = 'all',\n  ...rest\n}: CheckboxGroupAllItemProps): JSX.Element => {\n  const {\n    checked: checkedItems,\n    handleItemCheckedChange: handleItemCheckedChangeContext\n  } = React.useContext(CheckboxGroupCheckedContext)\n  const { mounted: mountedItems } = React.useContext(\n    CheckboxGroupMountedContext\n  )\n\n  const handleItemCheckedChange = (newChecked) => {\n    mountedItems.forEach((value) => {\n      handleItemCheckedChangeContext(newChecked, value)\n    })\n    onCheckedChange?.(newChecked)\n  }\n\n  const isAllChecked = (() => {\n    if (!checkedItems.length || !mountedItems.length) return false\n\n    if (mountedItems.every((mountedItem) => checkedItems.includes(mountedItem)))\n      return true\n\n    if (mountedItems.some((mountedItem) => checkedItems.includes(mountedItem)))\n      return 'indeterminate'\n\n    return false\n  })()\n\n  return (\n    <Checkbox\n      onCheckedChange={handleItemCheckedChange}\n      checked={isAllChecked}\n      title={title}\n      {...rest}\n    />\n  )\n}\n"],"mappings":";;;;;AAWA,IAAa,wBAAwB,EACnC,iBACA,QAAQ,OACR,GAAG,WACyC;CAC5C,MAAM,EACJ,SAAS,cACT,yBAAyB,mCACvB,QAAM,WAAW,4BAA4B;CACjD,MAAM,EAAE,SAAS,iBAAiB,QAAM,WACtC,4BACD;CAED,MAAM,2BAA2B,eAAe;AAC9C,eAAa,SAAS,UAAU;AAC9B,kCAA+B,YAAY,MAAM;IACjD;AACF,oBAAkB,WAAW;;CAG/B,MAAM,sBAAsB;AAC1B,MAAI,CAAC,aAAa,UAAU,CAAC,aAAa,OAAQ,QAAO;AAEzD,MAAI,aAAa,OAAO,gBAAgB,aAAa,SAAS,YAAY,CAAC,CACzE,QAAO;AAET,MAAI,aAAa,MAAM,gBAAgB,aAAa,SAAS,YAAY,CAAC,CACxE,QAAO;AAET,SAAO;KACL;AAEJ,QACE,wBAAA,cAAC,UAAD;EACE,iBAAiB;EACjB,SAAS;EACF;EACP,GAAI;EACJ,CAAA"}
+{"version":3,"file":"CheckboxGroupAllItem.js","names":[],"sources":["../../../src/components/checkbox-group/CheckboxGroupAllItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Checkbox } from '../checkbox/Checkbox'\nimport { CheckboxGroupCheckedContext } from './context/CheckboxGroupChecked.context'\nimport { CheckboxGroupMountedContext } from './context/CheckboxGroupMounted.context'\n\ntype CheckboxGroupAllItemProps = Omit<\n  React.ComponentProps<typeof Checkbox>,\n  'checked' | 'defaultChecked'\n>\n\nexport const CheckboxGroupAllItem = ({\n  onCheckedChange,\n  title = 'all',\n  ...rest\n}: CheckboxGroupAllItemProps): React.JSX.Element => {\n  const {\n    checked: checkedItems,\n    handleItemCheckedChange: handleItemCheckedChangeContext\n  } = React.useContext(CheckboxGroupCheckedContext)\n  const { mounted: mountedItems } = React.useContext(\n    CheckboxGroupMountedContext\n  )\n\n  const handleItemCheckedChange = (newChecked) => {\n    mountedItems.forEach((value) => {\n      handleItemCheckedChangeContext(newChecked, value)\n    })\n    onCheckedChange?.(newChecked)\n  }\n\n  const isAllChecked = (() => {\n    if (!checkedItems.length || !mountedItems.length) return false\n\n    if (mountedItems.every((mountedItem) => checkedItems.includes(mountedItem)))\n      return true\n\n    if (mountedItems.some((mountedItem) => checkedItems.includes(mountedItem)))\n      return 'indeterminate'\n\n    return false\n  })()\n\n  return (\n    <Checkbox\n      onCheckedChange={handleItemCheckedChange}\n      checked={isAllChecked}\n      title={title}\n      {...rest}\n    />\n  )\n}\n"],"mappings":";;;;;;AAWA,IAAa,wBAAwB,EACnC,iBACA,QAAQ,OACR,GAAG,WAC+C;CAClD,MAAM,EACJ,SAAS,cACT,yBAAyB,mCACvB,QAAM,WAAW,4BAA4B;CACjD,MAAM,EAAE,SAAS,iBAAiB,QAAM,WACtC,4BACD;CAED,MAAM,2BAA2B,eAAe;AAC9C,eAAa,SAAS,UAAU;AAC9B,kCAA+B,YAAY,MAAM;IACjD;AACF,oBAAkB,WAAW;;AAe/B,QACE,oBAAC,UAAD;EACE,iBAAiB;EACjB,gBAfwB;AAC1B,OAAI,CAAC,aAAa,UAAU,CAAC,aAAa,OAAQ,QAAO;AAEzD,OAAI,aAAa,OAAO,gBAAgB,aAAa,SAAS,YAAY,CAAC,CACzE,QAAO;AAET,OAAI,aAAa,MAAM,gBAAgB,aAAa,SAAS,YAAY,CAAC,CACxE,QAAO;AAET,UAAO;MACL;EAMO;EACP,GAAI;EACJ,CAAA"}

package/dist/components/checkbox-group/CheckboxGroupItem.d.ts

@@ -3,5 +3,5 @@ import { Checkbox } from '../checkbox/Checkbox';
 type CheckboxGroupItemProps = Omit<React.ComponentProps<typeof Checkbox>, 'onCheckedChange' | 'checked' | 'defaultChecked'> & {
     onCheckedChange?: (newChecked: boolean) => void;
 };
-export declare const CheckboxGroupItem: ({ value, title, onCheckedChange, ...rest }: CheckboxGroupItemProps) => JSX.Element;
+export declare const CheckboxGroupItem: ({ value, title, onCheckedChange, ...rest }: CheckboxGroupItemProps) => React.JSX.Element;
 export {};

package/dist/components/checkbox-group/CheckboxGroupItem.js

@@ -2,6 +2,7 @@ import { Checkbox } from "../checkbox/Checkbox.js";
 import { CheckboxGroupCheckedContext } from "./context/CheckboxGroupChecked.context.js";
 import { CheckboxGroupMountedContext } from "./context/CheckboxGroupMounted.context.js";
 import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/checkbox-group/CheckboxGroupItem.tsx
 var CheckboxGroupItem = ({ value, title, onCheckedChange, ...rest }) => {
 	const { checked: checkedItems, handleItemCheckedChange: handleItemCheckedChangeContext } = React$1.useContext(CheckboxGroupCheckedContext);
@@ -16,7 +17,7 @@ var CheckboxGroupItem = ({ value, title, onCheckedChange, ...rest }) => {
 			handleItemMountedChange(false, value);
 		};
 	}, [handleItemMountedChange, value]);
-	return /* @__PURE__ */ React$1.createElement(Checkbox, {
+	return /* @__PURE__ */ jsx(Checkbox, {
 		onCheckedChange: handleItemCheckedChange,
 		checked: checkedItems.includes(value),
 		title: title ?? String(value),

package/dist/components/checkbox-group/CheckboxGroupItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroupItem.js","names":[],"sources":["../../../src/components/checkbox-group/CheckboxGroupItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Checkbox } from '../checkbox/Checkbox'\nimport { CheckboxGroupCheckedContext } from './context/CheckboxGroupChecked.context'\nimport { CheckboxGroupMountedContext } from './context/CheckboxGroupMounted.context'\n\ntype CheckboxGroupItemProps = Omit<\n  React.ComponentProps<typeof Checkbox>,\n  'onCheckedChange' | 'checked' | 'defaultChecked'\n> & {\n  onCheckedChange?: (newChecked: boolean) => void\n}\n\nexport const CheckboxGroupItem = ({\n  value,\n  title,\n  onCheckedChange,\n  ...rest\n}: CheckboxGroupItemProps): JSX.Element => {\n  const {\n    checked: checkedItems,\n    handleItemCheckedChange: handleItemCheckedChangeContext\n  } = React.useContext(CheckboxGroupCheckedContext)\n  const { handleItemMountedChange } = React.useContext(\n    CheckboxGroupMountedContext\n  )\n\n  const handleItemCheckedChange = (newChecked) => {\n    handleItemCheckedChangeContext(newChecked, value)\n    onCheckedChange?.(newChecked)\n  }\n\n  React.useEffect(() => {\n    handleItemMountedChange(true, value)\n    return () => {\n      handleItemMountedChange(false, value)\n    }\n  }, [handleItemMountedChange, value])\n\n  return (\n    <Checkbox\n      onCheckedChange={handleItemCheckedChange}\n      checked={checkedItems.includes(value)}\n      title={title ?? String(value)}\n      {...rest}\n    />\n  )\n}\n"],"mappings":";;;;;AAaA,IAAa,qBAAqB,EAChC,OACA,OACA,iBACA,GAAG,WACsC;CACzC,MAAM,EACJ,SAAS,cACT,yBAAyB,mCACvB,QAAM,WAAW,4BAA4B;CACjD,MAAM,EAAE,4BAA4B,QAAM,WACxC,4BACD;CAED,MAAM,2BAA2B,eAAe;AAC9C,iCAA+B,YAAY,MAAM;AACjD,oBAAkB,WAAW;;AAG/B,SAAM,gBAAgB;AACpB,0BAAwB,MAAM,MAAM;AACpC,eAAa;AACX,2BAAwB,OAAO,MAAM;;IAEtC,CAAC,yBAAyB,MAAM,CAAC;AAEpC,QACE,wBAAA,cAAC,UAAD;EACE,iBAAiB;EACjB,SAAS,aAAa,SAAS,MAAM;EACrC,OAAO,SAAS,OAAO,MAAM;EAC7B,GAAI;EACJ,CAAA"}
+{"version":3,"file":"CheckboxGroupItem.js","names":[],"sources":["../../../src/components/checkbox-group/CheckboxGroupItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Checkbox } from '../checkbox/Checkbox'\nimport { CheckboxGroupCheckedContext } from './context/CheckboxGroupChecked.context'\nimport { CheckboxGroupMountedContext } from './context/CheckboxGroupMounted.context'\n\ntype CheckboxGroupItemProps = Omit<\n  React.ComponentProps<typeof Checkbox>,\n  'onCheckedChange' | 'checked' | 'defaultChecked'\n> & {\n  onCheckedChange?: (newChecked: boolean) => void\n}\n\nexport const CheckboxGroupItem = ({\n  value,\n  title,\n  onCheckedChange,\n  ...rest\n}: CheckboxGroupItemProps): React.JSX.Element => {\n  const {\n    checked: checkedItems,\n    handleItemCheckedChange: handleItemCheckedChangeContext\n  } = React.useContext(CheckboxGroupCheckedContext)\n  const { handleItemMountedChange } = React.useContext(\n    CheckboxGroupMountedContext\n  )\n\n  const handleItemCheckedChange = (newChecked) => {\n    handleItemCheckedChangeContext(newChecked, value)\n    onCheckedChange?.(newChecked)\n  }\n\n  React.useEffect(() => {\n    handleItemMountedChange(true, value)\n    return () => {\n      handleItemMountedChange(false, value)\n    }\n  }, [handleItemMountedChange, value])\n\n  return (\n    <Checkbox\n      onCheckedChange={handleItemCheckedChange}\n      checked={checkedItems.includes(value)}\n      title={title ?? String(value)}\n      {...rest}\n    />\n  )\n}\n"],"mappings":";;;;;;AAaA,IAAa,qBAAqB,EAChC,OACA,OACA,iBACA,GAAG,WAC4C;CAC/C,MAAM,EACJ,SAAS,cACT,yBAAyB,mCACvB,QAAM,WAAW,4BAA4B;CACjD,MAAM,EAAE,4BAA4B,QAAM,WACxC,4BACD;CAED,MAAM,2BAA2B,eAAe;AAC9C,iCAA+B,YAAY,MAAM;AACjD,oBAAkB,WAAW;;AAG/B,SAAM,gBAAgB;AACpB,0BAAwB,MAAM,MAAM;AACpC,eAAa;AACX,2BAAwB,OAAO,MAAM;;IAEtC,CAAC,yBAAyB,MAAM,CAAC;AAEpC,QACE,oBAAC,UAAD;EACE,iBAAiB;EACjB,SAAS,aAAa,SAAS,MAAM;EACrC,OAAO,SAAS,OAAO,MAAM;EAC7B,GAAI;EACJ,CAAA"}

package/dist/components/checkbox-group/CheckboxGroupSub.d.ts

@@ -2,5 +2,5 @@ import * as React from 'react';
 type CheckboxGroupSubProps = React.HTMLAttributes<HTMLDivElement> & {
     asChild?: boolean;
 };
-export declare const CheckboxGroupSub: ({ asChild, ...rest }: CheckboxGroupSubProps) => JSX.Element;
+export declare const CheckboxGroupSub: ({ asChild, ...rest }: CheckboxGroupSubProps) => React.JSX.Element;
 export {};

package/dist/components/checkbox-group/CheckboxGroupSub.js

@@ -1,10 +1,10 @@
 import { CheckboxGroupMountedProvider } from "./context/CheckboxGroupMounted.context.js";
-import * as React$1 from "react";
+import "react";
+import { jsx } from "react/jsx-runtime";
 import { Slot } from "@radix-ui/react-slot";
 //#region src/components/checkbox-group/CheckboxGroupSub.tsx
 var CheckboxGroupSub = ({ asChild = false, ...rest }) => {
-	const Component = asChild ? Slot : "div";
-	return /* @__PURE__ */ React$1.createElement(CheckboxGroupMountedProvider, null, /* @__PURE__ */ React$1.createElement(Component, rest));
+	return /* @__PURE__ */ jsx(CheckboxGroupMountedProvider, { children: /* @__PURE__ */ jsx(asChild ? Slot : "div", { ...rest }) });
 };
 //#endregion
 export { CheckboxGroupSub };

package/dist/components/checkbox-group/CheckboxGroupSub.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroupSub.js","names":[],"sources":["../../../src/components/checkbox-group/CheckboxGroupSub.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { CheckboxGroupMountedProvider } from './context/CheckboxGroupMounted.context'\n\ntype CheckboxGroupSubProps = React.HTMLAttributes<HTMLDivElement> & {\n  asChild?: boolean\n}\n\nexport const CheckboxGroupSub = ({\n  asChild = false,\n  ...rest\n}: CheckboxGroupSubProps): JSX.Element => {\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <CheckboxGroupMountedProvider>\n      <Component {...rest} />\n    </CheckboxGroupMountedProvider>\n  )\n}\n"],"mappings":";;;;AASA,IAAa,oBAAoB,EAC/B,UAAU,OACV,GAAG,WACqC;CACxC,MAAM,YAAY,UAAU,OAAO;AAEnC,QACE,wBAAA,cAAC,8BAAA,MACC,wBAAA,cAAC,WAAc,KAAQ,CACM"}
+{"version":3,"file":"CheckboxGroupSub.js","names":[],"sources":["../../../src/components/checkbox-group/CheckboxGroupSub.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { CheckboxGroupMountedProvider } from './context/CheckboxGroupMounted.context'\n\ntype CheckboxGroupSubProps = React.HTMLAttributes<HTMLDivElement> & {\n  asChild?: boolean\n}\n\nexport const CheckboxGroupSub = ({\n  asChild = false,\n  ...rest\n}: CheckboxGroupSubProps): React.JSX.Element => {\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <CheckboxGroupMountedProvider>\n      <Component {...rest} />\n    </CheckboxGroupMountedProvider>\n  )\n}\n"],"mappings":";;;;;AASA,IAAa,oBAAoB,EAC/B,UAAU,OACV,GAAG,WAC2C;AAG9C,QACE,oBAAC,8BAAD,EAAA,UACE,oBAJc,UAAU,OAAO,OAI/B,EAAW,GAAI,MAAQ,CAAA,EACM,CAAA"}

package/dist/components/checkbox-group/context/CheckboxGroupChecked.context.js

@@ -1,4 +1,5 @@
 import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/checkbox-group/context/CheckboxGroupChecked.context.tsx
 var CheckboxGroupCheckedContext = React$1.createContext({
 	checked: [],
@@ -38,7 +39,7 @@ var CheckboxGroupCheckedProvider = ({ checked: controlledChecked, defaultChecked
 		handleItemControlledCheckedChange,
 		controlledChecked
 	]);
-	return /* @__PURE__ */ React$1.createElement(CheckboxGroupCheckedContext.Provider, {
+	return /* @__PURE__ */ jsx(CheckboxGroupCheckedContext.Provider, {
 		value,
 		...rest
 	});

package/dist/components/checkbox-group/context/CheckboxGroupChecked.context.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroupChecked.context.js","names":[],"sources":["../../../../src/components/checkbox-group/context/CheckboxGroupChecked.context.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport type { CheckboxGroupItemValue } from '../CheckboxGroup.types'\n\ntype CheckboxGroupCheckedContextValue = {\n  checked: CheckboxGroupItemValue[]\n  handleItemCheckedChange: (\n    newItemChecked: boolean,\n    itemValue: CheckboxGroupItemValue\n  ) => void\n}\n\ntype CheckboxGroupCheckedContextProps = {\n  checked?: CheckboxGroupCheckedContextValue['checked']\n  defaultChecked?: CheckboxGroupCheckedContextValue['checked']\n  onCheckedChange?: (\n    checked: CheckboxGroupCheckedContextValue['checked']\n  ) => void\n}\n\nexport const CheckboxGroupCheckedContext =\n  React.createContext<CheckboxGroupCheckedContextValue>({\n    checked: [],\n    handleItemCheckedChange: () => null\n  })\n\nconst generateNewCheckedFn = (\n  currentChecked: CheckboxGroupCheckedContextValue['checked']\n) => {\n  return (newItemChecked, itemValue) => {\n    const newCheckedSet = new Set(currentChecked)\n    if (newItemChecked) {\n      newCheckedSet.add(itemValue)\n    } else {\n      newCheckedSet.delete(itemValue)\n    }\n    const newChecked = Array.from(newCheckedSet)\n    return newChecked\n  }\n}\n\nexport const CheckboxGroupCheckedProvider = ({\n  checked: controlledChecked,\n  defaultChecked = [],\n  onCheckedChange,\n  ...rest\n}: React.PropsWithChildren<CheckboxGroupCheckedContextProps>) => {\n  const [checked, setChecked] = React.useState(defaultChecked)\n\n  const handleItemControlledCheckedChange = React.useCallback(\n    (newItemChecked, itemValue) => {\n      if (!controlledChecked) return () => null\n      const newCheckedFn = generateNewCheckedFn(controlledChecked)\n      const newChecked = newCheckedFn(newItemChecked, itemValue)\n      onCheckedChange?.(newChecked)\n    },\n    [onCheckedChange, controlledChecked]\n  )\n\n  const handleItemCheckedChange = React.useCallback(\n    (newItemChecked, itemValue) => {\n      setChecked((prevChecked) => {\n        const newCheckedFn = generateNewCheckedFn(prevChecked)\n        const newChecked = newCheckedFn(newItemChecked, itemValue)\n        onCheckedChange?.(newChecked)\n        return newChecked\n      })\n    },\n    [onCheckedChange]\n  )\n\n  const value = React.useMemo<CheckboxGroupCheckedContextValue>(() => {\n    const isControlled = Array.isArray(controlledChecked)\n    return {\n      checked: isControlled\n        ? (controlledChecked as CheckboxGroupCheckedContextValue['checked']) // We're literally JUST checking it above but TS still flags it, wrongly, so casting\n        : checked,\n      handleItemCheckedChange: isControlled\n        ? handleItemControlledCheckedChange\n        : handleItemCheckedChange\n    }\n  }, [\n    checked,\n    handleItemCheckedChange,\n    handleItemControlledCheckedChange,\n    controlledChecked\n  ])\n\n  return <CheckboxGroupCheckedContext.Provider value={value} {...rest} />\n}\n"],"mappings":";;AAoBA,IAAa,8BACX,QAAM,cAAgD;CACpD,SAAS,EAAE;CACX,+BAA+B;CAChC,CAAC;AAEJ,IAAM,wBACJ,mBACG;AACH,SAAQ,gBAAgB,cAAc;EACpC,MAAM,gBAAgB,IAAI,IAAI,eAAe;AAC7C,MAAI,eACF,eAAc,IAAI,UAAU;MAE5B,eAAc,OAAO,UAAU;AAGjC,SADmB,MAAM,KAAK,cAAc;;;AAKhD,IAAa,gCAAgC,EAC3C,SAAS,mBACT,iBAAiB,EAAE,EACnB,iBACA,GAAG,WAC4D;CAC/D,MAAM,CAAC,SAAS,cAAc,QAAM,SAAS,eAAe;CAE5D,MAAM,oCAAoC,QAAM,aAC7C,gBAAgB,cAAc;AAC7B,MAAI,CAAC,kBAAmB,cAAa;EAErC,MAAM,aADe,qBAAqB,kBAAkB,CAC5B,gBAAgB,UAAU;AAC1D,oBAAkB,WAAW;IAE/B,CAAC,iBAAiB,kBAAkB,CACrC;CAED,MAAM,0BAA0B,QAAM,aACnC,gBAAgB,cAAc;AAC7B,cAAY,gBAAgB;GAE1B,MAAM,aADe,qBAAqB,YAAY,CACtB,gBAAgB,UAAU;AAC1D,qBAAkB,WAAW;AAC7B,UAAO;IACP;IAEJ,CAAC,gBAAgB,CAClB;CAED,MAAM,QAAQ,QAAM,cAAgD;EAClE,MAAM,eAAe,MAAM,QAAQ,kBAAkB;AACrD,SAAO;GACL,SAAS,eACJ,oBACD;GACJ,yBAAyB,eACrB,oCACA;GACL;IACA;EACD;EACA;EACA;EACA;EACD,CAAC;AAEF,QAAO,wBAAA,cAAC,4BAA4B,UAA7B;EAA6C;EAAO,GAAI;EAAQ,CAAA"}
+{"version":3,"file":"CheckboxGroupChecked.context.js","names":[],"sources":["../../../../src/components/checkbox-group/context/CheckboxGroupChecked.context.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport type { CheckboxGroupItemValue } from '../CheckboxGroup.types'\n\ntype CheckboxGroupCheckedContextValue = {\n  checked: CheckboxGroupItemValue[]\n  handleItemCheckedChange: (\n    newItemChecked: boolean,\n    itemValue: CheckboxGroupItemValue\n  ) => void\n}\n\ntype CheckboxGroupCheckedContextProps = {\n  checked?: CheckboxGroupCheckedContextValue['checked']\n  defaultChecked?: CheckboxGroupCheckedContextValue['checked']\n  onCheckedChange?: (\n    checked: CheckboxGroupCheckedContextValue['checked']\n  ) => void\n}\n\nexport const CheckboxGroupCheckedContext =\n  React.createContext<CheckboxGroupCheckedContextValue>({\n    checked: [],\n    handleItemCheckedChange: () => null\n  })\n\nconst generateNewCheckedFn = (\n  currentChecked: CheckboxGroupCheckedContextValue['checked']\n) => {\n  return (newItemChecked, itemValue) => {\n    const newCheckedSet = new Set(currentChecked)\n    if (newItemChecked) {\n      newCheckedSet.add(itemValue)\n    } else {\n      newCheckedSet.delete(itemValue)\n    }\n    const newChecked = Array.from(newCheckedSet)\n    return newChecked\n  }\n}\n\nexport const CheckboxGroupCheckedProvider = ({\n  checked: controlledChecked,\n  defaultChecked = [],\n  onCheckedChange,\n  ...rest\n}: React.PropsWithChildren<CheckboxGroupCheckedContextProps>) => {\n  const [checked, setChecked] = React.useState(defaultChecked)\n\n  const handleItemControlledCheckedChange = React.useCallback(\n    (newItemChecked, itemValue) => {\n      if (!controlledChecked) return () => null\n      const newCheckedFn = generateNewCheckedFn(controlledChecked)\n      const newChecked = newCheckedFn(newItemChecked, itemValue)\n      onCheckedChange?.(newChecked)\n    },\n    [onCheckedChange, controlledChecked]\n  )\n\n  const handleItemCheckedChange = React.useCallback(\n    (newItemChecked, itemValue) => {\n      setChecked((prevChecked) => {\n        const newCheckedFn = generateNewCheckedFn(prevChecked)\n        const newChecked = newCheckedFn(newItemChecked, itemValue)\n        onCheckedChange?.(newChecked)\n        return newChecked\n      })\n    },\n    [onCheckedChange]\n  )\n\n  const value = React.useMemo<CheckboxGroupCheckedContextValue>(() => {\n    const isControlled = Array.isArray(controlledChecked)\n    return {\n      checked: isControlled\n        ? (controlledChecked as CheckboxGroupCheckedContextValue['checked']) // We're literally JUST checking it above but TS still flags it, wrongly, so casting\n        : checked,\n      handleItemCheckedChange: isControlled\n        ? handleItemControlledCheckedChange\n        : handleItemCheckedChange\n    }\n  }, [\n    checked,\n    handleItemCheckedChange,\n    handleItemControlledCheckedChange,\n    controlledChecked\n  ])\n\n  return <CheckboxGroupCheckedContext.Provider value={value} {...rest} />\n}\n"],"mappings":";;;AAoBA,IAAa,8BACX,QAAM,cAAgD;CACpD,SAAS,EAAE;CACX,+BAA+B;CAChC,CAAC;AAEJ,IAAM,wBACJ,mBACG;AACH,SAAQ,gBAAgB,cAAc;EACpC,MAAM,gBAAgB,IAAI,IAAI,eAAe;AAC7C,MAAI,eACF,eAAc,IAAI,UAAU;MAE5B,eAAc,OAAO,UAAU;AAGjC,SADmB,MAAM,KAAK,cAAc;;;AAKhD,IAAa,gCAAgC,EAC3C,SAAS,mBACT,iBAAiB,EAAE,EACnB,iBACA,GAAG,WAC4D;CAC/D,MAAM,CAAC,SAAS,cAAc,QAAM,SAAS,eAAe;CAE5D,MAAM,oCAAoC,QAAM,aAC7C,gBAAgB,cAAc;AAC7B,MAAI,CAAC,kBAAmB,cAAa;EAErC,MAAM,aADe,qBAAqB,kBAAkB,CAC5B,gBAAgB,UAAU;AAC1D,oBAAkB,WAAW;IAE/B,CAAC,iBAAiB,kBAAkB,CACrC;CAED,MAAM,0BAA0B,QAAM,aACnC,gBAAgB,cAAc;AAC7B,cAAY,gBAAgB;GAE1B,MAAM,aADe,qBAAqB,YAAY,CACtB,gBAAgB,UAAU;AAC1D,qBAAkB,WAAW;AAC7B,UAAO;IACP;IAEJ,CAAC,gBAAgB,CAClB;CAED,MAAM,QAAQ,QAAM,cAAgD;EAClE,MAAM,eAAe,MAAM,QAAQ,kBAAkB;AACrD,SAAO;GACL,SAAS,eACJ,oBACD;GACJ,yBAAyB,eACrB,oCACA;GACL;IACA;EACD;EACA;EACA;EACA;EACD,CAAC;AAEF,QAAO,oBAAC,4BAA4B,UAA7B;EAA6C;EAAO,GAAI;EAAQ,CAAA"}

package/dist/components/checkbox-group/context/CheckboxGroupMounted.context.js

@@ -1,4 +1,5 @@
 import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/components/checkbox-group/context/CheckboxGroupMounted.context.tsx
 var CheckboxGroupMountedContext = React$1.createContext({
 	mounted: [],
@@ -20,7 +21,7 @@ var CheckboxGroupMountedProvider = (props) => {
 		mounted,
 		handleItemMountedChange
 	}), [mounted, handleItemMountedChange]);
-	return /* @__PURE__ */ React$1.createElement(CheckboxGroupMountedContext.Provider, {
+	return /* @__PURE__ */ jsx(CheckboxGroupMountedContext.Provider, {
 		value,
 		...props
 	});