@codefast/ui 0.0.55 → 0.0.57

package/src/react/carousel.tsx

@@ -3,11 +3,9 @@
 import * as React from 'react';
 import useEmblaCarousel, { type UseEmblaCarouselType } from 'embla-carousel-react';
 import { ArrowLeftIcon, ArrowRightIcon } from '@radix-ui/react-icons';
-import { createContextScope } from '@radix-ui/react-context';
+import { createContextScope, type Scope } from '@radix-ui/react-context';
 import { cn } from '../lib/utils';
-import { Button } from './button';
-import type { ButtonProps } from './button';
-import type { Scope } from '@radix-ui/react-context';
+import { Button, type ButtonProps } from './button';
 
 /* -----------------------------------------------------------------------------
  * Context: Carousel

package/src/react/checkbox-group.primitive.tsx

@@ -1,13 +1,12 @@
 import * as React from 'react';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import { createCheckboxScope } from '@radix-ui/react-checkbox';
-import { createContextScope } from '@radix-ui/react-context';
+import { createContextScope, type Scope } from '@radix-ui/react-context';
 import * as RovingFocusGroup from '@radix-ui/react-roving-focus';
 import { createRovingFocusGroupScope } from '@radix-ui/react-roving-focus';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { useDirection } from '@radix-ui/react-direction';
 import { Primitive } from '@radix-ui/react-primitive';
-import type { Scope } from '@radix-ui/react-context';
 
 /* -------------------------------------------------------------------------------------------------
  * Component: CheckboxGroup

package/src/react/data-table.tsx

@@ -12,6 +12,7 @@ import {
   EyeNoneIcon,
   MixerHorizontalIcon,
 } from '@radix-ui/react-icons';
+import type * as ReactTable from '@tanstack/react-table';
 import { cn } from '../lib/utils';
 import {
   DropdownMenu,
@@ -24,7 +25,6 @@ import {
 } from './dropdown-menu';
 import { Button } from './button';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from './select';
-import type * as ReactTable from '@tanstack/react-table';
 
 /* -----------------------------------------------------------------------------
  * Component: DataTableViewOptions

package/src/react/form.tsx

@@ -13,9 +13,9 @@ import {
   type Merge,
   useFormContext,
 } from 'react-hook-form';
+import type * as LabelPrimitive from '@radix-ui/react-label';
 import { cn } from '../lib/utils';
 import { Label } from './label';
-import type * as LabelPrimitive from '@radix-ui/react-label';
 
 /* -----------------------------------------------------------------------------
  * Context: Form

package/src/react/input.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
+import { type VariantProps } from 'cva';
 import { cva } from '../lib/utils';
-import type { VariantProps } from 'cva';
 
 /* -----------------------------------------------------------------------------
  * Variant: Input

package/src/react/pagination.tsx

@@ -1,8 +1,7 @@
 import * as React from 'react';
 import { ChevronLeftIcon, ChevronRightIcon, DotsHorizontalIcon } from '@radix-ui/react-icons';
 import { cn } from '../lib/utils';
-import { buttonVariants } from './button';
-import type { ButtonProps } from './button';
+import { buttonVariants, type ButtonProps } from './button';
 
 /* -----------------------------------------------------------------------------
  * Component: Pagination

package/src/react/scroll-area.tsx

@@ -2,26 +2,74 @@
 
 import * as React from 'react';
 import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
-import { cn } from '../lib/utils';
+import { createContextScope, type Scope } from '@radix-ui/react-context';
+import { type VariantProps } from 'cva';
+import { cn, cva } from '../lib/utils';
 
 /* -----------------------------------------------------------------------------
  * Component: ScrollArea
  * -------------------------------------------------------------------------- */
 
+const SCROLL_AREA_NAME = 'ScrollArea';
+
+type ScopedProps<P> = P & { __scopeScrollArea?: Scope };
+
+const [createCarouselContext] = createContextScope(SCROLL_AREA_NAME);
+
+type ScrollAreaContextValue = Pick<ScrollAreaScrollbarVariantsProps, 'size'>;
+
+const [CarouselProvider, useCarouselContext] = createCarouselContext<ScrollAreaContextValue>(SCROLL_AREA_NAME);
+
 type ScrollAreaElement = React.ElementRef<typeof ScrollAreaPrimitive.Root>;
-type ScrollAreaProps = React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>;
+type ScrollAreaProps = React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root> & ScrollAreaContextValue;
 
-const ScrollArea = React.forwardRef<ScrollAreaElement, ScrollAreaProps>(({ children, className, ...props }, ref) => (
-  <ScrollAreaPrimitive.Root ref={ref} className={cn('relative overflow-hidden', className)} {...props}>
-    <ScrollAreaPrimitive.Viewport className="size-full rounded-[inherit]">{children}</ScrollAreaPrimitive.Viewport>
-    <ScrollAreaScrollbar orientation="vertical" />
-    <ScrollAreaScrollbar orientation="horizontal" />
-    <ScrollAreaPrimitive.Corner />
-  </ScrollAreaPrimitive.Root>
-));
+const ScrollArea = React.forwardRef<ScrollAreaElement, ScrollAreaProps>(
+  ({ __scopeScrollArea, children, className, size = '1', ...props }: ScopedProps<ScrollAreaProps>, ref) => (
+    <CarouselProvider scope={__scopeScrollArea} size={size}>
+      <ScrollAreaPrimitive.Root ref={ref} className={cn('relative overflow-hidden', className)} {...props}>
+        <ScrollAreaPrimitive.Viewport className="size-full rounded-[inherit] [&>*]:min-h-full">
+          {children}
+        </ScrollAreaPrimitive.Viewport>
+        <ScrollAreaScrollbar orientation="vertical" />
+        <ScrollAreaScrollbar orientation="horizontal" />
+        <ScrollAreaPrimitive.Corner />
+      </ScrollAreaPrimitive.Root>
+    </CarouselProvider>
+  ),
+);
 
 ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
 
+/* -----------------------------------------------------------------------------
+ * Variant: ScrollAreaScrollbar
+ * -------------------------------------------------------------------------- */
+
+const scrollAreaScrollbarVariants = cva({
+  base: 'flex touch-none select-none transition p-px',
+  variants: {
+    orientation: {
+      vertical: 'h-full flex-row border-l border-l-transparent',
+      horizontal: 'w-full flex-col border-t border-t-transparent',
+    },
+    size: {
+      none: '',
+      '1': '',
+      '2': '',
+      '3': '',
+    },
+  },
+  compoundVariants: [
+    { orientation: 'vertical', size: '1', className: 'w-1.5' },
+    { orientation: 'vertical', size: '2', className: 'w-2' },
+    { orientation: 'vertical', size: '3', className: 'w-2.5' },
+    { orientation: 'horizontal', size: '1', className: 'h-1.5' },
+    { orientation: 'horizontal', size: '2', className: 'h-2' },
+    { orientation: 'horizontal', size: '3', className: 'h-2.5' },
+  ],
+});
+
+type ScrollAreaScrollbarVariantsProps = VariantProps<typeof scrollAreaScrollbarVariants>;
+
 /* -----------------------------------------------------------------------------
  * Component: ScrollAreaScrollbar
  * -------------------------------------------------------------------------- */
@@ -30,21 +78,23 @@ type ScrollAreaScrollbarElement = React.ElementRef<typeof ScrollAreaPrimitive.Sc
 type ScrollAreaScrollbarProps = React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Scrollbar>;
 
 const ScrollAreaScrollbar = React.forwardRef<ScrollAreaScrollbarElement, ScrollAreaScrollbarProps>(
-  ({ className, orientation = 'vertical', ...props }, ref) => (
-    <ScrollAreaPrimitive.Scrollbar
-      ref={ref}
-      orientation={orientation}
-      className={cn(
-        'flex touch-none select-none transition',
-        orientation === 'vertical' && 'h-full w-2.5 border-l border-l-transparent p-px',
-        orientation === 'horizontal' && 'h-2.5 flex-col border-t border-t-transparent p-px',
-        className,
-      )}
-      {...props}
-    >
-      <ScrollAreaPrimitive.ScrollAreaThumb className="bg-border relative flex-1 rounded-full" />
-    </ScrollAreaPrimitive.Scrollbar>
-  ),
+  (
+    { __scopeScrollArea, className, orientation = 'vertical', ...props }: ScopedProps<ScrollAreaScrollbarProps>,
+    ref,
+  ) => {
+    const { size } = useCarouselContext(SCROLL_AREA_NAME, __scopeScrollArea);
+
+    return (
+      <ScrollAreaPrimitive.Scrollbar
+        ref={ref}
+        orientation={orientation}
+        className={scrollAreaScrollbarVariants({ orientation, size, className })}
+        {...props}
+      >
+        <ScrollAreaPrimitive.ScrollAreaThumb className="bg-border relative flex-1 rounded-full" />
+      </ScrollAreaPrimitive.Scrollbar>
+    );
+  },
 );
 
 ScrollAreaScrollbar.displayName = ScrollAreaPrimitive.Scrollbar.displayName;

package/src/react/sheet.tsx

@@ -3,8 +3,8 @@
 import * as React from 'react';
 import * as SheetPrimitive from '@radix-ui/react-dialog';
 import { Cross2Icon } from '@radix-ui/react-icons';
+import { type VariantProps } from 'cva';
 import { cn, cva } from '../lib/utils';
-import type { VariantProps } from 'cva';
 
 /* -----------------------------------------------------------------------------
  * Variant: Sheet

package/src/react/toggle-group.tsx

@@ -3,11 +3,9 @@
 import * as React from 'react';
 import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
 import { createToggleGroupScope } from '@radix-ui/react-toggle-group';
-import { createContextScope } from '@radix-ui/react-context';
+import { createContextScope, type Scope } from '@radix-ui/react-context';
 import { cn } from '../lib/utils';
-import { toggleVariants } from './toggle';
-import type { ToggleVariantsProps } from './toggle';
-import type { Scope } from '@radix-ui/react-context';
+import { toggleVariants, type ToggleVariantsProps } from './toggle';
 
 /* -----------------------------------------------------------------------------
  * Component: ToggleGroup

package/src/react/toggle.tsx

@@ -2,8 +2,8 @@
 
 import * as React from 'react';
 import * as TogglePrimitive from '@radix-ui/react-toggle';
+import { type VariantProps } from 'cva';
 import { cva } from '../lib/utils';
-import type { VariantProps } from 'cva';
 
 /* -----------------------------------------------------------------------------
  * Variant: Toggle

package/tailwind.config.ts

@@ -2,7 +2,7 @@ import { fontFamily } from 'tailwindcss/defaultTheme';
 import animate from './plugin/animate.plugin';
 import base from './plugin/base.plugin';
 import perspective from './plugin/perspective.plugin';
-import type { Config } from 'tailwindcss';
+import { Config } from 'tailwindcss';
 
 const tailwindcssConfig: Config = {
   content: ['./src/**/*.{js,ts,jsx,tsx,mdx}'],

package/dist/chunk-K63K4LTH.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/react/checkbox-group.primitive.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox';\nimport { createCheckboxScope } from '@radix-ui/react-checkbox';\nimport { createContextScope } from '@radix-ui/react-context';\nimport * as RovingFocusGroup from '@radix-ui/react-roving-focus';\nimport { createRovingFocusGroupScope } from '@radix-ui/react-roving-focus';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { useDirection } from '@radix-ui/react-direction';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Component: CheckboxGroup\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_GROUP_NAME = 'CheckboxGroup';\n\ntype ScopedProps<P> = P & { __scopeCheckboxGroup?: Scope };\n\nconst [createCheckboxGroupContext, createCheckboxGroupScope] = createContextScope(CHECKBOX_GROUP_NAME, [\n  createRovingFocusGroupScope,\n  createCheckboxScope,\n]);\n\nconst useRovingFocusGroupScope = createRovingFocusGroupScope();\nconst useCheckboxScope = createCheckboxScope();\n\ninterface CheckboxGroupContextValue {\n  name?: string;\n  required: boolean;\n  disabled: boolean;\n  value?: string[];\n  onItemCheck: (value: string) => void;\n  onItemUncheck: (value: string) => void;\n}\n\nconst [CheckboxGroupProvider, useCheckboxGroupContext] =\n  createCheckboxGroupContext<CheckboxGroupContextValue>(CHECKBOX_GROUP_NAME);\n\ntype CheckboxGroupElement = React.ElementRef<typeof Primitive.div>;\n\ninterface CheckboxGroupProps extends React.ComponentPropsWithoutRef<typeof Primitive.div> {\n  name?: CheckboxGroupContextValue['name'];\n  required?: React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>['required'];\n  disabled?: React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>['disabled'];\n  dir?: RovingFocusGroup.RovingFocusGroupProps['dir'];\n  orientation?: RovingFocusGroup.RovingFocusGroupProps['orientation'];\n  loop?: RovingFocusGroup.RovingFocusGroupProps['loop'];\n  defaultValue?: string[];\n  value?: CheckboxGroupContextValue['value'];\n  onValueChange?: (value: string[]) => void;\n}\n\nconst CheckboxGroup = React.forwardRef<CheckboxGroupElement, CheckboxGroupProps>(\n  (\n    {\n      __scopeCheckboxGroup,\n      name,\n      defaultValue,\n      value: valueProp,\n      required = false,\n      disabled = false,\n      orientation,\n      dir,\n      loop = true,\n      onValueChange,\n      ...props\n    }: ScopedProps<CheckboxGroupProps>,\n    ref,\n  ) => {\n    const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeCheckboxGroup);\n    const direction = useDirection(dir);\n    const [value = [], setValue] = useControllableState({\n      prop: valueProp,\n      defaultProp: defaultValue,\n      onChange: onValueChange,\n    });\n\n    const handleItemCheck = React.useCallback(\n      (itemValue: string) => {\n        setValue((prevValue = []) => [...prevValue, itemValue]);\n      },\n      [setValue],\n    );\n\n    const handleItemUncheck = React.useCallback(\n      (itemValue: string) => {\n        setValue((prevValue = []) => prevValue.filter((val) => val !== itemValue));\n      },\n      [setValue],\n    );\n\n    return (\n      <CheckboxGroupProvider\n        scope={__scopeCheckboxGroup}\n        name={name}\n        required={required}\n        disabled={disabled}\n        value={value}\n        onItemCheck={handleItemCheck}\n        onItemUncheck={handleItemUncheck}\n      >\n        <RovingFocusGroup.Root asChild {...rovingFocusGroupScope} orientation={orientation} dir={direction} loop={loop}>\n          {/* eslint-disable-next-line react/jsx-pascal-case -- radix-ui */}\n          <Primitive.div ref={ref} role=\"group\" data-disabled={disabled ? '' : undefined} dir={direction} {...props} />\n        </RovingFocusGroup.Root>\n      </CheckboxGroupProvider>\n    );\n  },\n);\n\nCheckboxGroup.displayName = CHECKBOX_GROUP_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * Component: CheckboxGroupItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = `${CHECKBOX_GROUP_NAME}Item`;\n\ntype CheckboxGroupItemElement = React.ElementRef<typeof CheckboxPrimitive.Root>;\n\ninterface CheckboxGroupItemProps\n  extends Omit<\n    React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>,\n    'checked' | 'defaultChecked' | 'onCheckedChange' | 'name'\n  > {\n  value: string;\n}\n\nconst CheckboxGroupItem = React.forwardRef<CheckboxGroupItemElement, CheckboxGroupItemProps>(\n  ({ __scopeCheckboxGroup, disabled, ...props }: ScopedProps<CheckboxGroupItemProps>, ref) => {\n    const context = useCheckboxGroupContext(ITEM_NAME, __scopeCheckboxGroup);\n    const isDisabled = context.disabled || disabled;\n    const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeCheckboxGroup);\n    const checkboxScope = useCheckboxScope(__scopeCheckboxGroup);\n    const checked = context.value?.includes(props.value);\n\n    return (\n      <RovingFocusGroup.Item asChild {...rovingFocusGroupScope} focusable={!isDisabled} active={checked}>\n        <CheckboxPrimitive.Root\n          ref={ref}\n          name={context.name}\n          disabled={isDisabled}\n          required={context.required}\n          checked={checked}\n          {...checkboxScope}\n          {...props}\n          onCheckedChange={(checkedState) => {\n            if (checkedState) {\n              context.onItemCheck(props.value);\n            } else {\n              context.onItemUncheck(props.value);\n            }\n          }}\n        />\n      </RovingFocusGroup.Item>\n    );\n  },\n);\n\nCheckboxGroupItem.displayName = ITEM_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * Component: CheckboxGroupIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = `${CHECKBOX_GROUP_NAME}Indicator`;\n\ntype CheckboxGroupIndicatorElement = React.ElementRef<typeof CheckboxPrimitive.Indicator>;\ntype CheckboxGroupIndicatorProps = React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Indicator>;\n\nconst CheckboxGroupIndicator = React.forwardRef<CheckboxGroupIndicatorElement, CheckboxGroupIndicatorProps>(\n  ({ __scopeCheckboxGroup, ...props }: ScopedProps<CheckboxGroupIndicatorProps>, ref) => {\n    const checkboxScope = useCheckboxScope(__scopeCheckboxGroup);\n\n    return <CheckboxPrimitive.Indicator ref={ref} {...checkboxScope} {...props} />;\n  },\n);\n\nCheckboxGroupIndicator.displayName = INDICATOR_NAME;\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nconst Root = CheckboxGroup;\nconst Item = CheckboxGroupItem;\nconst Indicator = CheckboxGroupIndicator;\n\nexport {\n  createCheckboxGroupScope,\n  CheckboxGroup,\n  CheckboxGroupItem,\n  CheckboxGroupIndicator,\n  Root,\n  Item,\n  Indicator,\n  type CheckboxGroupProps,\n  type CheckboxGroupItemProps,\n  type CheckboxGroupIndicatorProps,\n};\n"],"mappings":"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","names":["React","CheckboxPrimitive","createCheckboxScope","createContextScope","RovingFocusGroup","createRovingFocusGroupScope","useControllableState","useDirection","Primitive","jsx","CHECKBOX_GROUP_NAME","createCheckboxGroupContext","createCheckboxGroupScope","useRovingFocusGroupScope","useCheckboxScope","CheckboxGroupProvider","useCheckboxGroupContext","CheckboxGroup","__scopeCheckboxGroup","name","defaultValue","valueProp","required","disabled","orientation","dir","loop","onValueChange","props","ref","rovingFocusGroupScope","direction","value","setValue","handleItemCheck","itemValue","prevValue","handleItemUncheck","val","ITEM_NAME","CheckboxGroupItem","context","isDisabled","checkboxScope","checked","checkedState","INDICATOR_NAME","CheckboxGroupIndicator","Root","Item","Indicator"]}

package/dist/chunk-X4BEEJEW.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/react/checkbox-group.primitive.tsx"],"names":["React","CheckboxPrimitive","createCheckboxScope","createContextScope","RovingFocusGroup","createRovingFocusGroupScope","useControllableState","useDirection","Primitive","jsx","CHECKBOX_GROUP_NAME","createCheckboxGroupContext","createCheckboxGroupScope","useRovingFocusGroupScope","useCheckboxScope","CheckboxGroupProvider","useCheckboxGroupContext","CheckboxGroup","__scopeCheckboxGroup","name","defaultValue","valueProp","required","disabled","orientation","dir","loop","onValueChange","props","ref","rovingFocusGroupScope","direction","value","setValue","handleItemCheck","itemValue","prevValue","handleItemUncheck","val","ITEM_NAME","CheckboxGroupItem","context","isDisabled","checkboxScope","checked","checkedState","INDICATOR_NAME","CheckboxGroupIndicator","Root","Item","Indicator"],"mappings":"AAAA,UAAYA,MAAW,QACvB,UAAYC,MAAuB,2BACnC,OAAS,uBAAAC,MAA2B,2BACpC,OAAS,sBAAAC,MAA0B,0BACnC,UAAYC,MAAsB,+BAClC,OAAS,+BAAAC,MAAmC,+BAC5C,OAAS,wBAAAC,MAA4B,yCACrC,OAAS,gBAAAC,MAAoB,4BAC7B,OAAS,aAAAC,MAAiB,4BAgGhB,cAAAC,MAAA,oBAzFV,IAAMC,EAAsB,gBAItB,CAACC,EAA4BC,CAAwB,EAAIT,EAAmBO,EAAqB,CACrGL,EACAH,CACF,CAAC,EAEKW,EAA2BR,EAA4B,EACvDS,EAAmBZ,EAAoB,EAWvC,CAACa,EAAuBC,CAAuB,EACnDL,EAAsDD,CAAmB,EAgBrEO,EAAsB,aAC1B,CACE,CACE,qBAAAC,EACA,KAAAC,EACA,aAAAC,EACA,MAAOC,EACP,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,YAAAC,EACA,IAAAC,EACA,KAAAC,EAAO,GACP,cAAAC,EACA,GAAGC,CACL,EACAC,IACG,CACH,IAAMC,EAAwBjB,EAAyBK,CAAoB,EACrEa,EAAYxB,EAAakB,CAAG,EAC5B,CAACO,EAAQ,CAAC,EAAGC,CAAQ,EAAI3B,EAAqB,CAClD,KAAMe,EACN,YAAaD,EACb,SAAUO,CACZ,CAAC,EAEKO,EAAwB,cAC3BC,GAAsB,CACrBF,EAAS,CAACG,EAAY,CAAC,IAAM,CAAC,GAAGA,EAAWD,CAAS,CAAC,CACxD,EACA,CAACF,CAAQ,CACX,EAEMI,EAA0B,cAC7BF,GAAsB,CACrBF,EAAS,CAACG,EAAY,CAAC,IAAMA,EAAU,OAAQE,GAAQA,IAAQH,CAAS,CAAC,CAC3E,EACA,CAACF,CAAQ,CACX,EAEA,OACExB,EAACM,EAAA,CACC,MAAOG,EACP,KAAMC,EACN,SAAUG,EACV,SAAUC,EACV,MAAOS,EACP,YAAaE,EACb,cAAeG,EAEf,SAAA5B,EAAkB,OAAjB,CAAsB,QAAO,GAAE,GAAGqB,EAAuB,YAAaN,EAAa,IAAKO,EAAW,KAAML,EAExG,SAAAjB,EAACD,EAAU,IAAV,CAAc,IAAKqB,EAAK,KAAK,QAAQ,gBAAeN,EAAW,GAAK,OAAW,IAAKQ,EAAY,GAAGH,EAAO,EAC7G,EACF,CAEJ,CACF,EAEAX,EAAc,YAAcP,EAM5B,IAAM6B,EAAY,GAAG7B,CAAmB,OAYlC8B,EAA0B,aAC9B,CAAC,CAAE,qBAAAtB,EAAsB,SAAAK,EAAU,GAAGK,CAAM,EAAwCC,IAAQ,CAC1F,IAAMY,EAAUzB,EAAwBuB,EAAWrB,CAAoB,EACjEwB,EAAaD,EAAQ,UAAYlB,EACjCO,EAAwBjB,EAAyBK,CAAoB,EACrEyB,EAAgB7B,EAAiBI,CAAoB,EACrD0B,EAAUH,EAAQ,OAAO,SAASb,EAAM,KAAK,EAEnD,OACEnB,EAAkB,OAAjB,CAAsB,QAAO,GAAE,GAAGqB,EAAuB,UAAW,CAACY,EAAY,OAAQE,EACxF,SAAAnC,EAAmB,OAAlB,CACC,IAAKoB,EACL,KAAMY,EAAQ,KACd,SAAUC,EACV,SAAUD,EAAQ,SAClB,QAASG,EACR,GAAGD,EACH,GAAGf,EACJ,gBAAkBiB,GAAiB,CAC7BA,EACFJ,EAAQ,YAAYb,EAAM,KAAK,EAE/Ba,EAAQ,cAAcb,EAAM,KAAK,CAErC,EACF,EACF,CAEJ,CACF,EAEAY,EAAkB,YAAcD,EAMhC,IAAMO,EAAiB,GAAGpC,CAAmB,YAKvCqC,EAA+B,aACnC,CAAC,CAAE,qBAAA7B,EAAsB,GAAGU,CAAM,EAA6CC,IAAQ,CACrF,IAAMc,EAAgB7B,EAAiBI,CAAoB,EAE3D,OAAOT,EAAmB,YAAlB,CAA4B,IAAKoB,EAAM,GAAGc,EAAgB,GAAGf,EAAO,CAC9E,CACF,EAEAmB,EAAuB,YAAcD,EAMrC,IAAME,EAAO/B,EACPgC,EAAOT,EACPU,EAAYH","sourcesContent":["import * as React from 'react';\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox';\nimport { createCheckboxScope } from '@radix-ui/react-checkbox';\nimport { createContextScope } from '@radix-ui/react-context';\nimport * as RovingFocusGroup from '@radix-ui/react-roving-focus';\nimport { createRovingFocusGroupScope } from '@radix-ui/react-roving-focus';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { useDirection } from '@radix-ui/react-direction';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Component: CheckboxGroup\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_GROUP_NAME = 'CheckboxGroup';\n\ntype ScopedProps<P> = P & { __scopeCheckboxGroup?: Scope };\n\nconst [createCheckboxGroupContext, createCheckboxGroupScope] = createContextScope(CHECKBOX_GROUP_NAME, [\n  createRovingFocusGroupScope,\n  createCheckboxScope,\n]);\n\nconst useRovingFocusGroupScope = createRovingFocusGroupScope();\nconst useCheckboxScope = createCheckboxScope();\n\ninterface CheckboxGroupContextValue {\n  name?: string;\n  required: boolean;\n  disabled: boolean;\n  value?: string[];\n  onItemCheck: (value: string) => void;\n  onItemUncheck: (value: string) => void;\n}\n\nconst [CheckboxGroupProvider, useCheckboxGroupContext] =\n  createCheckboxGroupContext<CheckboxGroupContextValue>(CHECKBOX_GROUP_NAME);\n\ntype CheckboxGroupElement = React.ElementRef<typeof Primitive.div>;\n\ninterface CheckboxGroupProps extends React.ComponentPropsWithoutRef<typeof Primitive.div> {\n  name?: CheckboxGroupContextValue['name'];\n  required?: React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>['required'];\n  disabled?: React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>['disabled'];\n  dir?: RovingFocusGroup.RovingFocusGroupProps['dir'];\n  orientation?: RovingFocusGroup.RovingFocusGroupProps['orientation'];\n  loop?: RovingFocusGroup.RovingFocusGroupProps['loop'];\n  defaultValue?: string[];\n  value?: CheckboxGroupContextValue['value'];\n  onValueChange?: (value: string[]) => void;\n}\n\nconst CheckboxGroup = React.forwardRef<CheckboxGroupElement, CheckboxGroupProps>(\n  (\n    {\n      __scopeCheckboxGroup,\n      name,\n      defaultValue,\n      value: valueProp,\n      required = false,\n      disabled = false,\n      orientation,\n      dir,\n      loop = true,\n      onValueChange,\n      ...props\n    }: ScopedProps<CheckboxGroupProps>,\n    ref,\n  ) => {\n    const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeCheckboxGroup);\n    const direction = useDirection(dir);\n    const [value = [], setValue] = useControllableState({\n      prop: valueProp,\n      defaultProp: defaultValue,\n      onChange: onValueChange,\n    });\n\n    const handleItemCheck = React.useCallback(\n      (itemValue: string) => {\n        setValue((prevValue = []) => [...prevValue, itemValue]);\n      },\n      [setValue],\n    );\n\n    const handleItemUncheck = React.useCallback(\n      (itemValue: string) => {\n        setValue((prevValue = []) => prevValue.filter((val) => val !== itemValue));\n      },\n      [setValue],\n    );\n\n    return (\n      <CheckboxGroupProvider\n        scope={__scopeCheckboxGroup}\n        name={name}\n        required={required}\n        disabled={disabled}\n        value={value}\n        onItemCheck={handleItemCheck}\n        onItemUncheck={handleItemUncheck}\n      >\n        <RovingFocusGroup.Root asChild {...rovingFocusGroupScope} orientation={orientation} dir={direction} loop={loop}>\n          {/* eslint-disable-next-line react/jsx-pascal-case -- radix-ui */}\n          <Primitive.div ref={ref} role=\"group\" data-disabled={disabled ? '' : undefined} dir={direction} {...props} />\n        </RovingFocusGroup.Root>\n      </CheckboxGroupProvider>\n    );\n  },\n);\n\nCheckboxGroup.displayName = CHECKBOX_GROUP_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * Component: CheckboxGroupItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = `${CHECKBOX_GROUP_NAME}Item`;\n\ntype CheckboxGroupItemElement = React.ElementRef<typeof CheckboxPrimitive.Root>;\n\ninterface CheckboxGroupItemProps\n  extends Omit<\n    React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>,\n    'checked' | 'defaultChecked' | 'onCheckedChange' | 'name'\n  > {\n  value: string;\n}\n\nconst CheckboxGroupItem = React.forwardRef<CheckboxGroupItemElement, CheckboxGroupItemProps>(\n  ({ __scopeCheckboxGroup, disabled, ...props }: ScopedProps<CheckboxGroupItemProps>, ref) => {\n    const context = useCheckboxGroupContext(ITEM_NAME, __scopeCheckboxGroup);\n    const isDisabled = context.disabled || disabled;\n    const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeCheckboxGroup);\n    const checkboxScope = useCheckboxScope(__scopeCheckboxGroup);\n    const checked = context.value?.includes(props.value);\n\n    return (\n      <RovingFocusGroup.Item asChild {...rovingFocusGroupScope} focusable={!isDisabled} active={checked}>\n        <CheckboxPrimitive.Root\n          ref={ref}\n          name={context.name}\n          disabled={isDisabled}\n          required={context.required}\n          checked={checked}\n          {...checkboxScope}\n          {...props}\n          onCheckedChange={(checkedState) => {\n            if (checkedState) {\n              context.onItemCheck(props.value);\n            } else {\n              context.onItemUncheck(props.value);\n            }\n          }}\n        />\n      </RovingFocusGroup.Item>\n    );\n  },\n);\n\nCheckboxGroupItem.displayName = ITEM_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * Component: CheckboxGroupIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = `${CHECKBOX_GROUP_NAME}Indicator`;\n\ntype CheckboxGroupIndicatorElement = React.ElementRef<typeof CheckboxPrimitive.Indicator>;\ntype CheckboxGroupIndicatorProps = React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Indicator>;\n\nconst CheckboxGroupIndicator = React.forwardRef<CheckboxGroupIndicatorElement, CheckboxGroupIndicatorProps>(\n  ({ __scopeCheckboxGroup, ...props }: ScopedProps<CheckboxGroupIndicatorProps>, ref) => {\n    const checkboxScope = useCheckboxScope(__scopeCheckboxGroup);\n\n    return <CheckboxPrimitive.Indicator ref={ref} {...checkboxScope} {...props} />;\n  },\n);\n\nCheckboxGroupIndicator.displayName = INDICATOR_NAME;\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nconst Root = CheckboxGroup;\nconst Item = CheckboxGroupItem;\nconst Indicator = CheckboxGroupIndicator;\n\nexport {\n  createCheckboxGroupScope,\n  CheckboxGroup,\n  CheckboxGroupItem,\n  CheckboxGroupIndicator,\n  Root,\n  Item,\n  Indicator,\n  type CheckboxGroupProps,\n  type CheckboxGroupItemProps,\n  type CheckboxGroupIndicatorProps,\n};\n"]}