@moduix/react 2.5.0 → 2.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (200) hide show
  1. package/README.md +65 -86
  2. package/THIRD_PARTY_NOTICES.md +49 -0
  3. package/dist/components/accordion/Accordion.js +7 -8
  4. package/dist/components/alert/Alert.js +6 -7
  5. package/dist/components/alert/Alert_module.css +3 -16
  6. package/dist/components/angle-slider/AngleSlider.d.ts +5 -11
  7. package/dist/components/angle-slider/AngleSlider.js +17 -59
  8. package/dist/components/aspect-ratio/AspectRatio.js +1 -2
  9. package/dist/components/aspect-ratio/AspectRatio_module.css +0 -13
  10. package/dist/components/avatar/Avatar.d.ts +3 -6
  11. package/dist/components/avatar/Avatar.js +7 -50
  12. package/dist/components/avatar/Avatar.module.js +1 -2
  13. package/dist/components/avatar/Avatar_module.css +0 -6
  14. package/dist/components/badge/Badge.d.ts +2 -2
  15. package/dist/components/badge/Badge.js +5 -10
  16. package/dist/components/badge/Badge_module.css +7 -14
  17. package/dist/components/bleed/Bleed.js +1 -2
  18. package/dist/components/breadcrumbs/Breadcrumbs.d.ts +1 -1
  19. package/dist/components/breadcrumbs/Breadcrumbs.js +16 -32
  20. package/dist/components/breadcrumbs/Breadcrumbs_module.css +12 -14
  21. package/dist/components/button/Button.d.ts +4 -4
  22. package/dist/components/button/Button.js +1 -2
  23. package/dist/components/button/Button_module.css +2 -7
  24. package/dist/components/card/Card.d.ts +15 -15
  25. package/dist/components/card/Card.js +10 -11
  26. package/dist/components/card/Card_module.css +1 -17
  27. package/dist/components/carousel/Carousel.js +12 -13
  28. package/dist/components/carousel/Carousel_module.css +10 -3
  29. package/dist/components/chart/Chart.d.ts +9 -8
  30. package/dist/components/chart/Chart.js +7 -8
  31. package/dist/components/chart/Chart_module.css +0 -2
  32. package/dist/components/checkbox/Checkbox.d.ts +3 -2
  33. package/dist/components/checkbox/Checkbox.js +12 -35
  34. package/dist/components/clipboard/Clipboard.js +8 -9
  35. package/dist/components/close-button/CloseButton.js +1 -2
  36. package/dist/components/close-button/CloseButton_module.css +1 -10
  37. package/dist/components/collapsible/Collapsible.js +6 -9
  38. package/dist/components/collapsible/Collapsible_module.css +2 -4
  39. package/dist/components/color-picker/ColorPicker.d.ts +4 -3
  40. package/dist/components/color-picker/ColorPicker.js +32 -45
  41. package/dist/components/color-picker/ColorPicker_module.css +0 -1
  42. package/dist/components/combobox/Combobox.d.ts +5 -5
  43. package/dist/components/combobox/Combobox.js +20 -29
  44. package/dist/components/combobox/Combobox_module.css +0 -1
  45. package/dist/components/command-palette/CommandPalette.d.ts +7 -18
  46. package/dist/components/command-palette/CommandPalette.js +51 -78
  47. package/dist/components/command-palette/CommandPalette_module.css +11 -18
  48. package/dist/components/container/Container.js +1 -2
  49. package/dist/components/date-input/DateInput.d.ts +7 -9
  50. package/dist/components/date-input/DateInput.js +14 -44
  51. package/dist/components/date-input/DateInput_module.css +0 -1
  52. package/dist/components/date-picker/DatePicker.d.ts +1 -1
  53. package/dist/components/date-picker/DatePicker.js +34 -43
  54. package/dist/components/date-picker/DatePicker.module.js +1 -1
  55. package/dist/components/date-picker/DatePicker_module.css +14 -4
  56. package/dist/components/dialog/Dialog.d.ts +1 -1
  57. package/dist/components/dialog/Dialog.js +11 -12
  58. package/dist/components/drawer/Drawer.d.ts +6 -3
  59. package/dist/components/drawer/Drawer.js +33 -24
  60. package/dist/components/editable/Editable.d.ts +1 -1
  61. package/dist/components/editable/Editable.js +10 -11
  62. package/dist/components/empty/Empty.js +6 -7
  63. package/dist/components/field/Field.js +10 -11
  64. package/dist/components/fieldset/Fieldset.js +5 -6
  65. package/dist/components/file-upload/FileUpload.d.ts +3 -2
  66. package/dist/components/file-upload/FileUpload.js +28 -55
  67. package/dist/components/file-upload/FileUpload_module.css +4 -13
  68. package/dist/components/floating-panel/FloatingPanel.d.ts +2 -2
  69. package/dist/components/floating-panel/FloatingPanel.js +14 -15
  70. package/dist/components/floating-panel/FloatingPanel_module.css +4 -17
  71. package/dist/components/heading/Heading.js +1 -2
  72. package/dist/components/highlight/Highlight.js +1 -2
  73. package/dist/components/hover-card/HoverCard.d.ts +2 -1
  74. package/dist/components/hover-card/HoverCard.js +15 -6
  75. package/dist/components/hover-card/HoverCard.module.js +1 -0
  76. package/dist/components/hover-card/HoverCard_module.css +18 -3
  77. package/dist/components/image/Image.js +1 -2
  78. package/dist/components/image-cropper/ImageCropper.d.ts +1 -1
  79. package/dist/components/image-cropper/ImageCropper.js +7 -8
  80. package/dist/components/input/Input.d.ts +4 -4
  81. package/dist/components/input/Input.js +1 -2
  82. package/dist/components/input-group/InputGroup.d.ts +5 -5
  83. package/dist/components/input-group/InputGroup.js +5 -6
  84. package/dist/components/json-tree-view/JsonTreeView.js +3 -4
  85. package/dist/components/json-tree-view/JsonTreeView_module.css +26 -10
  86. package/dist/components/kbd/Kbd.js +2 -3
  87. package/dist/components/lightbox/Lightbox.d.ts +1 -1
  88. package/dist/components/lightbox/Lightbox.js +13 -14
  89. package/dist/components/lightbox/Lightbox_module.css +0 -3
  90. package/dist/components/list/List.js +2 -3
  91. package/dist/components/listbox/Listbox.d.ts +5 -5
  92. package/dist/components/listbox/Listbox.js +19 -25
  93. package/dist/components/listbox/Listbox.module.js +2 -2
  94. package/dist/components/listbox/Listbox_module.css +3 -13
  95. package/dist/components/marquee/Marquee.js +6 -7
  96. package/dist/components/menu/Menu.d.ts +2 -1
  97. package/dist/components/menu/Menu.js +34 -41
  98. package/dist/components/menu/Menu.module.js +1 -1
  99. package/dist/components/menu/Menu_module.css +8 -8
  100. package/dist/components/native-select/NativeSelect.js +2 -3
  101. package/dist/components/native-select/NativeSelect_module.css +0 -1
  102. package/dist/components/navigation-menu/NavigationMenu.js +17 -36
  103. package/dist/components/navigation-menu/NavigationMenu.module.js +2 -3
  104. package/dist/components/navigation-menu/NavigationMenu_module.css +15 -32
  105. package/dist/components/number-input/NumberInput.js +9 -10
  106. package/dist/components/pagination/Pagination.js +17 -20
  107. package/dist/components/pagination/Pagination_module.css +1 -5
  108. package/dist/components/password-input/PasswordInput.js +7 -8
  109. package/dist/components/pin-input/PinInput.d.ts +3 -2
  110. package/dist/components/pin-input/PinInput.js +13 -54
  111. package/dist/components/popover/Popover.d.ts +5 -3
  112. package/dist/components/popover/Popover.js +16 -17
  113. package/dist/components/progress-circular/ProgressCircular.js +8 -9
  114. package/dist/components/progress-circular/ProgressCircular.module.js +1 -3
  115. package/dist/components/progress-circular/ProgressCircular_module.css +0 -10
  116. package/dist/components/progress-linear/ProgressLinear.js +7 -8
  117. package/dist/components/progress-linear/ProgressLinear.module.js +1 -5
  118. package/dist/components/progress-linear/ProgressLinear_module.css +0 -20
  119. package/dist/components/qr-code/QrCode.js +6 -7
  120. package/dist/components/radio-group/RadioGroup.d.ts +1 -0
  121. package/dist/components/radio-group/RadioGroup.js +13 -27
  122. package/dist/components/radio-group/RadioGroup_module.css +0 -1
  123. package/dist/components/rating-group/RatingGroup.d.ts +1 -0
  124. package/dist/components/rating-group/RatingGroup.js +12 -29
  125. package/dist/components/rating-group/RatingGroup_module.css +1 -1
  126. package/dist/components/scroll-area/ScrollArea.js +7 -8
  127. package/dist/components/segment-group/SegmentGroup.d.ts +1 -0
  128. package/dist/components/segment-group/SegmentGroup.js +16 -30
  129. package/dist/components/segment-group/SegmentGroup_module.css +4 -0
  130. package/dist/components/select/Select.d.ts +4 -7
  131. package/dist/components/select/Select.js +36 -86
  132. package/dist/components/select/Select.module.js +1 -1
  133. package/dist/components/select/Select_module.css +4 -31
  134. package/dist/components/separator/Separator.d.ts +6 -6
  135. package/dist/components/separator/Separator.js +1 -2
  136. package/dist/components/sidebar/Sidebar.d.ts +24 -22
  137. package/dist/components/sidebar/Sidebar.js +88 -75
  138. package/dist/components/sidebar/Sidebar.module.js +2 -3
  139. package/dist/components/sidebar/Sidebar_module.css +112 -178
  140. package/dist/components/signature-pad/SignaturePad.d.ts +5 -8
  141. package/dist/components/signature-pad/SignaturePad.js +17 -46
  142. package/dist/components/signature-pad/SignaturePad_module.css +0 -1
  143. package/dist/components/simple-grid/SimpleGrid.js +13 -8
  144. package/dist/components/skeleton/Skeleton.d.ts +2 -2
  145. package/dist/components/skeleton/Skeleton.js +1 -2
  146. package/dist/components/slider/Slider.d.ts +2 -2
  147. package/dist/components/slider/Slider.js +18 -32
  148. package/dist/components/spinner/Spinner.d.ts +2 -2
  149. package/dist/components/spinner/Spinner.js +1 -2
  150. package/dist/components/split-button/SplitButton.d.ts +4 -4
  151. package/dist/components/split-button/SplitButton.js +11 -8
  152. package/dist/components/splitter/Splitter.js +5 -6
  153. package/dist/components/splitter/Splitter_module.css +2 -10
  154. package/dist/components/stack/Stack.d.ts +6 -6
  155. package/dist/components/stack/Stack.js +4 -5
  156. package/dist/components/stack/Stack_module.css +1 -1
  157. package/dist/components/steps/Steps.js +12 -13
  158. package/dist/components/steps/Steps_module.css +2 -3
  159. package/dist/components/swap/Swap.js +3 -4
  160. package/dist/components/switch/Switch.d.ts +3 -2
  161. package/dist/components/switch/Switch.js +12 -35
  162. package/dist/components/switch/Switch_module.css +0 -1
  163. package/dist/components/table/Table.d.ts +5 -5
  164. package/dist/components/table/Table.js +12 -13
  165. package/dist/components/tabs/Tabs.js +6 -7
  166. package/dist/components/tabs/Tabs_module.css +5 -10
  167. package/dist/components/tag/Tag.js +5 -6
  168. package/dist/components/tag/Tag_module.css +2 -4
  169. package/dist/components/tags-input/TagsInput.d.ts +3 -3
  170. package/dist/components/tags-input/TagsInput.js +21 -75
  171. package/dist/components/tags-input/TagsInput_module.css +0 -1
  172. package/dist/components/text/Text.js +1 -2
  173. package/dist/components/textarea/Textarea.js +1 -2
  174. package/dist/components/timer/Timer.js +7 -8
  175. package/dist/components/toast/Toast.d.ts +1 -1
  176. package/dist/components/toast/Toast.js +7 -8
  177. package/dist/components/toast/Toast_module.css +1 -2
  178. package/dist/components/toc/Toc.js +10 -11
  179. package/dist/components/toc/Toc_module.css +2 -2
  180. package/dist/components/toggle/Toggle.js +2 -3
  181. package/dist/components/toggle-group/ToggleGroup.d.ts +1 -1
  182. package/dist/components/toggle-group/ToggleGroup.js +3 -4
  183. package/dist/components/tooltip/Tooltip.d.ts +1 -1
  184. package/dist/components/tooltip/Tooltip.js +6 -7
  185. package/dist/components/tooltip/Tooltip_module.css +1 -1
  186. package/dist/components/tour/Tour.d.ts +1 -1
  187. package/dist/components/tour/Tour.js +14 -15
  188. package/dist/components/tree-view/TreeView.d.ts +4 -4
  189. package/dist/components/tree-view/TreeView.js +17 -18
  190. package/dist/components/tree-view/TreeView_module.css +39 -12
  191. package/dist/components/typeset/Typeset.js +2 -3
  192. package/dist/components/typeset/Typeset_module.css +300 -159
  193. package/dist/internal/icons/ui/Icons.d.ts +9 -30
  194. package/dist/internal/icons/ui/Icons.js +67 -807
  195. package/dist/internal/icons/ui/index.d.ts +1 -1
  196. package/dist/styles/animations.css +310 -0
  197. package/dist/styles/style.css +168 -2
  198. package/package.json +25 -25
  199. package/dist/internal/normalizeClassName.d.ts +0 -1
  200. package/dist/internal/normalizeClassName.js +0 -2
@@ -3,13 +3,12 @@ import { jsx, jsxs } from "react/jsx-runtime";
3
3
  import { ImageCropper, useImageCropper, useImageCropperContext } from "@ark-ui/react/image-cropper";
4
4
  import { clsx } from "clsx";
5
5
  import { forwardRef } from "react";
6
- import { normalizeClassName } from "../../internal/normalizeClassName.js";
7
6
  import ImageCropper_module from "./ImageCropper.module.js";
8
7
  const ImageCropper_ImageCropperRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
9
8
  return /*#__PURE__*/ jsx(ImageCropper.Root, {
10
9
  ref: ref,
11
10
  "data-slot": "image-cropper-root",
12
- className: clsx(ImageCropper_module.root, normalizeClassName(className)),
11
+ className: clsx(ImageCropper_module.root, className),
13
12
  ...props
14
13
  });
15
14
  });
@@ -17,7 +16,7 @@ const ImageCropper_ImageCropperRootProvider = /*#__PURE__*/ forwardRef(function(
17
16
  return /*#__PURE__*/ jsx(ImageCropper.RootProvider, {
18
17
  ref: ref,
19
18
  "data-slot": "image-cropper-root-provider",
20
- className: clsx(ImageCropper_module.root, normalizeClassName(className)),
19
+ className: clsx(ImageCropper_module.root, className),
21
20
  ...props
22
21
  });
23
22
  });
@@ -25,7 +24,7 @@ const ImageCropper_ImageCropperViewport = /*#__PURE__*/ forwardRef(function({ cl
25
24
  return /*#__PURE__*/ jsx(ImageCropper.Viewport, {
26
25
  ref: ref,
27
26
  "data-slot": "image-cropper-viewport",
28
- className: clsx(ImageCropper_module.viewport, normalizeClassName(className)),
27
+ className: clsx(ImageCropper_module.viewport, className),
29
28
  ...props
30
29
  });
31
30
  });
@@ -33,7 +32,7 @@ const ImageCropper_ImageCropperImage = /*#__PURE__*/ forwardRef(function({ class
33
32
  return /*#__PURE__*/ jsx(ImageCropper.Image, {
34
33
  ref: ref,
35
34
  "data-slot": "image-cropper-image",
36
- className: clsx(ImageCropper_module.image, normalizeClassName(className)),
35
+ className: clsx(ImageCropper_module.image, className),
37
36
  ...props
38
37
  });
39
38
  });
@@ -41,7 +40,7 @@ const ImageCropper_ImageCropperSelection = /*#__PURE__*/ forwardRef(function({ c
41
40
  return /*#__PURE__*/ jsx(ImageCropper.Selection, {
42
41
  ref: ref,
43
42
  "data-slot": "image-cropper-selection",
44
- className: clsx(ImageCropper_module.selection, normalizeClassName(className)),
43
+ className: clsx(ImageCropper_module.selection, className),
45
44
  ...props
46
45
  });
47
46
  });
@@ -49,7 +48,7 @@ const ImageCropper_ImageCropperGrid = /*#__PURE__*/ forwardRef(function({ classN
49
48
  return /*#__PURE__*/ jsx(ImageCropper.Grid, {
50
49
  ref: ref,
51
50
  "data-slot": "image-cropper-grid",
52
- className: clsx(ImageCropper_module.grid, normalizeClassName(className)),
51
+ className: clsx(ImageCropper_module.grid, className),
53
52
  ...props
54
53
  });
55
54
  });
@@ -57,7 +56,7 @@ const ImageCropper_ImageCropperHandle = /*#__PURE__*/ forwardRef(function({ clas
57
56
  return /*#__PURE__*/ jsx(ImageCropper.Handle, {
58
57
  ref: ref,
59
58
  "data-slot": "image-cropper-handle",
60
- className: clsx(ImageCropper_module.handle, normalizeClassName(className)),
59
+ className: clsx(ImageCropper_module.handle, className),
61
60
  ...props
62
61
  });
63
62
  });
@@ -1,12 +1,12 @@
1
1
  import { Field as FieldPrimitive } from '@ark-ui/react/field';
2
2
  import type { ComponentProps } from 'react';
3
3
  declare const Input: import("react").ForwardRefExoticComponent<Omit<Omit<FieldPrimitive.InputProps & import("react").RefAttributes<HTMLInputElement>, "size"> & {
4
- size?: "xs" | "sm" | "md" | "lg" | "xl";
5
- htmlSize?: ComponentProps<"input">["size"];
4
+ size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
5
+ htmlSize?: ComponentProps<'input'>['size'];
6
6
  }, "ref"> & import("react").RefAttributes<HTMLInputElement>> & {
7
7
  Root: import("react").ForwardRefExoticComponent<Omit<Omit<FieldPrimitive.InputProps & import("react").RefAttributes<HTMLInputElement>, "size"> & {
8
- size?: "xs" | "sm" | "md" | "lg" | "xl";
9
- htmlSize?: ComponentProps<"input">["size"];
8
+ size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
9
+ htmlSize?: ComponentProps<'input'>['size'];
10
10
  }, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
11
11
  };
12
12
  export { Input };
@@ -2,7 +2,6 @@ import { jsx } from "react/jsx-runtime";
2
2
  import { Field } from "@ark-ui/react/field";
3
3
  import { clsx } from "clsx";
4
4
  import { forwardRef } from "react";
5
- import { normalizeClassName } from "../../internal/normalizeClassName.js";
6
5
  import Input_module from "./Input.module.js";
7
6
  const Input_InputRoot = /*#__PURE__*/ forwardRef(function({ className, size = 'md', htmlSize, ...props }, ref) {
8
7
  return /*#__PURE__*/ jsx(Field.Input, {
@@ -13,7 +12,7 @@ const Input_InputRoot = /*#__PURE__*/ forwardRef(function({ className, size = 'm
13
12
  "data-slot": "input-root",
14
13
  "data-size": size,
15
14
  "data-html-size": void 0 === htmlSize ? void 0 : '',
16
- className: clsx(Input_module.root, normalizeClassName(className)),
15
+ className: clsx(Input_module.root, className),
17
16
  size: htmlSize
18
17
  });
19
18
  });
@@ -1,5 +1,5 @@
1
1
  import { type ComponentProps } from 'react';
2
- import { Input } from '../input';
2
+ import { Input } from '../input/index.js';
3
3
  type InputGroupSize = NonNullable<ComponentProps<typeof Input>['size']>;
4
4
  declare const InputGroup: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & {
5
5
  size?: InputGroupSize;
@@ -8,15 +8,15 @@ declare const InputGroup: import("react").ForwardRefExoticComponent<Omit<import(
8
8
  size?: InputGroupSize;
9
9
  } & import("react").RefAttributes<HTMLDivElement>>;
10
10
  Input: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@ark-ui/react/field").FieldInputProps & import("react").RefAttributes<HTMLInputElement>, "size"> & {
11
- size?: "xs" | "sm" | "md" | "lg" | "xl";
12
- htmlSize?: ComponentProps<"input">["size"];
11
+ size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
12
+ htmlSize?: ComponentProps<'input'>['size'];
13
13
  }, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
14
14
  Addon: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLSpanElement>>;
15
15
  Text: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLSpanElement>>;
16
16
  Button: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & {
17
17
  loading?: boolean;
18
- variant?: "default" | "outline" | "secondary" | "destructive" | "destructive-outline" | "ghost" | "link";
19
- size?: "xs" | "sm" | "md" | "lg" | "xl" | "icon-sm" | "icon-md" | "icon-lg";
18
+ variant?: 'default' | 'outline' | 'secondary' | 'destructive' | 'destructive-outline' | 'ghost' | 'link';
19
+ size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'icon-sm' | 'icon-md' | 'icon-lg';
20
20
  'data-scope'?: string;
21
21
  'data-part'?: string;
22
22
  'data-slot'?: string;
@@ -3,7 +3,6 @@ import { jsx } from "react/jsx-runtime";
3
3
  import { ark } from "@ark-ui/react/factory";
4
4
  import { clsx } from "clsx";
5
5
  import { createContext, forwardRef, useContext } from "react";
6
- import { normalizeClassName } from "../../internal/normalizeClassName.js";
7
6
  import { Button } from "../button/index.js";
8
7
  import { Input } from "../input/index.js";
9
8
  import InputGroup_module from "./InputGroup.module.js";
@@ -18,7 +17,7 @@ const InputGroup_InputGroupRoot = /*#__PURE__*/ forwardRef(function({ children,
18
17
  "data-part": "root",
19
18
  "data-slot": "input-group-root",
20
19
  "data-size": size,
21
- className: clsx(InputGroup_module.root, normalizeClassName(className)),
20
+ className: clsx(InputGroup_module.root, className),
22
21
  children: children
23
22
  })
24
23
  });
@@ -27,7 +26,7 @@ const InputGroup_InputGroupInput = /*#__PURE__*/ forwardRef(function({ className
27
26
  const groupSize = useContext(InputGroupSizeContext);
28
27
  return /*#__PURE__*/ jsx(Input, {
29
28
  ref: ref,
30
- className: clsx(InputGroup_module.input, normalizeClassName(className)),
29
+ className: clsx(InputGroup_module.input, className),
31
30
  size: size ?? groupSize,
32
31
  ...props
33
32
  });
@@ -39,7 +38,7 @@ const InputGroup_InputGroupAddon = /*#__PURE__*/ forwardRef(function({ className
39
38
  "data-scope": "input-group",
40
39
  "data-part": "addon",
41
40
  "data-slot": "input-group-addon",
42
- className: clsx(InputGroup_module.addon, normalizeClassName(className))
41
+ className: clsx(InputGroup_module.addon, className)
43
42
  });
44
43
  });
45
44
  const InputGroup_InputGroupText = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
@@ -49,7 +48,7 @@ const InputGroup_InputGroupText = /*#__PURE__*/ forwardRef(function({ className,
49
48
  "data-scope": "input-group",
50
49
  "data-part": "text",
51
50
  "data-slot": "input-group-text",
52
- className: clsx(InputGroup_module.text, normalizeClassName(className))
51
+ className: clsx(InputGroup_module.text, className)
53
52
  });
54
53
  });
55
54
  const InputGroup_InputGroupButton = /*#__PURE__*/ forwardRef(function({ className, variant = 'ghost', size, type = 'button', ...props }, ref) {
@@ -58,7 +57,7 @@ const InputGroup_InputGroupButton = /*#__PURE__*/ forwardRef(function({ classNam
58
57
  ref: ref,
59
58
  ...props,
60
59
  "data-slot": "input-group-button",
61
- className: clsx(InputGroup_module.button, normalizeClassName(className)),
60
+ className: clsx(InputGroup_module.button, className),
62
61
  variant: variant,
63
62
  size: size ?? groupSize,
64
63
  type: type
@@ -4,12 +4,11 @@ import { JsonTreeView, useJsonTreeView } from "@ark-ui/react/json-tree-view";
4
4
  import { clsx } from "clsx";
5
5
  import { forwardRef } from "react";
6
6
  import { ChevronRightIcon } from "../../internal/icons/ui/index.js";
7
- import { normalizeClassName } from "../../internal/normalizeClassName.js";
8
7
  import JsonTreeView_module from "./JsonTreeView.module.js";
9
8
  const JsonTreeView_JsonTreeViewRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
10
9
  return /*#__PURE__*/ jsx(JsonTreeView.Root, {
11
10
  ref: ref,
12
- className: clsx(JsonTreeView_module.root, normalizeClassName(className)),
11
+ className: clsx(JsonTreeView_module.root, className),
13
12
  ...props,
14
13
  "data-slot": "json-tree-view-root"
15
14
  });
@@ -17,7 +16,7 @@ const JsonTreeView_JsonTreeViewRoot = /*#__PURE__*/ forwardRef(function({ classN
17
16
  const JsonTreeView_JsonTreeViewRootProvider = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
18
17
  return /*#__PURE__*/ jsx(JsonTreeView.RootProvider, {
19
18
  ref: ref,
20
- className: clsx(JsonTreeView_module.root, normalizeClassName(className)),
19
+ className: clsx(JsonTreeView_module.root, className),
21
20
  ...props,
22
21
  "data-slot": "json-tree-view-root-provider"
23
22
  });
@@ -28,7 +27,7 @@ const JsonTreeView_JsonTreeViewTree = /*#__PURE__*/ forwardRef(function({ arrow,
28
27
  arrow: arrow ?? /*#__PURE__*/ jsx(ChevronRightIcon, {
29
28
  "aria-hidden": "true"
30
29
  }),
31
- className: clsx(JsonTreeView_module.tree, normalizeClassName(className)),
30
+ className: clsx(JsonTreeView_module.tree, className),
32
31
  ...props,
33
32
  "data-slot": "json-tree-view-tree"
34
33
  });
@@ -23,6 +23,7 @@
23
23
  }
24
24
 
25
25
  .root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"]) {
26
+ z-index: 0;
26
27
  box-sizing: border-box;
27
28
  width: 100%;
28
29
  min-width: 0;
@@ -34,28 +35,43 @@
34
35
  color: inherit;
35
36
  cursor: pointer;
36
37
  font: inherit;
37
- outline: var(--moduix-border-width-sm) solid transparent;
38
- outline-offset: calc(var(--moduix-border-width-sm) * -1);
39
38
  text-align: start;
40
- transition: background-color var(--moduix-transition-default),
41
- outline-color var(--moduix-transition-default);
39
+ transition: color var(--moduix-transition-default),
40
+ opacity var(--moduix-transition-default);
42
41
  -webkit-user-select: none;
43
42
  user-select: none;
44
43
  background-color: #0000;
45
44
  border: 0;
46
- padding-inline-start: calc(var(--moduix-spacing-1) + ((var(--depth, 1) - 1) * 1rem));
45
+ outline: none;
46
+ padding-inline-start: calc(var(--moduix-spacing-1) + var(--moduix-spacing-1) + ((var(--depth, 1) - 1) * 1rem));
47
47
  padding-inline-end: var(--moduix-spacing-1);
48
48
  display: flex;
49
+ position: relative;
50
+ }
51
+
52
+ .root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"]):before {
53
+ z-index: -1;
54
+ border-radius: inherit;
55
+ box-shadow: inset 0 0 0 var(--moduix-border-width-sm) transparent;
56
+ content: "";
57
+ pointer-events: none;
58
+ transition: background-color var(--moduix-transition-default),
59
+ box-shadow var(--moduix-transition-default);
60
+ background-color: #0000;
61
+ position: absolute;
62
+ inset-block: 0;
63
+ inset-inline-start: calc(var(--moduix-spacing-1) + ((var(--depth, 1) - 1) * 1rem));
64
+ inset-inline-end: 0;
49
65
  }
50
66
 
51
- .root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"]):not([data-disabled]):hover, .root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"])[data-selected] {
67
+ :is(.root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"]):not([data-disabled]):hover, .root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"])[data-selected]):before {
52
68
  background-color: color-mix(in oklab,
53
- var(--moduix-color-accent) 72%,
54
- var(--moduix-color-background));
69
+ var(--moduix-color-accent) 72%,
70
+ var(--moduix-color-background));
55
71
  }
56
72
 
57
- .root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"]):focus-visible, .root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"])[data-focus] {
58
- outline-color: var(--moduix-color-ring);
73
+ :is(.root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"]):focus-visible, .root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"])[data-focus]):before {
74
+ box-shadow: inset 0 0 0 var(--moduix-border-width-sm) var(--moduix-color-ring);
59
75
  }
60
76
 
61
77
  .root-jp1ege :where([data-scope="json-tree-view"][data-part="branch-control"], [data-scope="json-tree-view"][data-part="item"])[data-disabled] {
@@ -2,7 +2,6 @@ import { jsx } from "react/jsx-runtime";
2
2
  import { ark } from "@ark-ui/react/factory";
3
3
  import { clsx } from "clsx";
4
4
  import { forwardRef } from "react";
5
- import { normalizeClassName } from "../../internal/normalizeClassName.js";
6
5
  import Kbd_module from "./Kbd.module.js";
7
6
  const Kbd_KbdRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
8
7
  return /*#__PURE__*/ jsx(ark.kbd, {
@@ -10,7 +9,7 @@ const Kbd_KbdRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, r
10
9
  "data-scope": "kbd",
11
10
  "data-part": "root",
12
11
  "data-slot": "kbd-root",
13
- className: clsx(Kbd_module.root, normalizeClassName(className)),
12
+ className: clsx(Kbd_module.root, className),
14
13
  ...props
15
14
  });
16
15
  });
@@ -21,7 +20,7 @@ const Kbd_KbdGroupPart = /*#__PURE__*/ forwardRef(function({ className, ...props
21
20
  "data-scope": "kbd",
22
21
  "data-part": "group",
23
22
  "data-slot": "kbd-group",
24
- className: clsx(Kbd_module.group, normalizeClassName(className)),
23
+ className: clsx(Kbd_module.group, className),
25
24
  ...props
26
25
  });
27
26
  });
@@ -1,6 +1,6 @@
1
1
  import { Dialog as DialogPrimitive, useDialog, useDialogContext } from '@ark-ui/react/dialog';
2
2
  import type { ComponentProps, RefObject } from 'react';
3
- import { type OverlayPortalProps } from '../../internal/overlayPortal';
3
+ import { type OverlayPortalProps } from '../../internal/overlayPortal.js';
4
4
  type LightboxImageSelectDetails = {
5
5
  alt?: string;
6
6
  element: HTMLImageElement;
@@ -4,7 +4,6 @@ import { Dialog, useDialog, useDialogContext } from "@ark-ui/react/dialog";
4
4
  import { ark } from "@ark-ui/react/factory";
5
5
  import { clsx } from "clsx";
6
6
  import { forwardRef, useEffect } from "react";
7
- import { normalizeClassName } from "../../internal/normalizeClassName.js";
8
7
  import { OverlayPortal, OverlayPortalProvider } from "../../internal/overlayPortal.js";
9
8
  import { CloseButton } from "../close-button/index.js";
10
9
  import Lightbox_module from "./Lightbox.module.js";
@@ -54,7 +53,7 @@ const Lightbox_LightboxTrigger = /*#__PURE__*/ forwardRef(function({ className,
54
53
  return /*#__PURE__*/ jsx(Dialog.Trigger, {
55
54
  ref: ref,
56
55
  "data-slot": "lightbox-trigger",
57
- className: clsx(Lightbox_module.trigger, normalizeClassName(className)),
56
+ className: clsx(Lightbox_module.trigger, className),
58
57
  ...props
59
58
  });
60
59
  });
@@ -63,7 +62,7 @@ const Lightbox_LightboxBackdrop = /*#__PURE__*/ forwardRef(function({ className,
63
62
  children: /*#__PURE__*/ jsx(Dialog.Backdrop, {
64
63
  ref: ref,
65
64
  "data-slot": "lightbox-backdrop",
66
- className: clsx(Lightbox_module.backdrop, normalizeClassName(className)),
65
+ className: clsx(Lightbox_module.backdrop, className),
67
66
  ...props
68
67
  })
69
68
  });
@@ -73,7 +72,7 @@ const Lightbox_LightboxPositioner = /*#__PURE__*/ forwardRef(function({ classNam
73
72
  children: /*#__PURE__*/ jsx(Dialog.Positioner, {
74
73
  ref: ref,
75
74
  "data-slot": "lightbox-positioner",
76
- className: clsx(Lightbox_module.positioner, normalizeClassName(className)),
75
+ className: clsx(Lightbox_module.positioner, className),
77
76
  ...props
78
77
  })
79
78
  });
@@ -82,7 +81,7 @@ const Lightbox_LightboxContent = /*#__PURE__*/ forwardRef(function({ className,
82
81
  return /*#__PURE__*/ jsx(Dialog.Content, {
83
82
  ref: ref,
84
83
  "data-slot": "lightbox-content",
85
- className: clsx(Lightbox_module.content, normalizeClassName(className)),
84
+ className: clsx(Lightbox_module.content, className),
86
85
  ...props
87
86
  });
88
87
  });
@@ -90,7 +89,7 @@ const Lightbox_LightboxTitle = /*#__PURE__*/ forwardRef(function({ className, ..
90
89
  return /*#__PURE__*/ jsx(Dialog.Title, {
91
90
  ref: ref,
92
91
  "data-slot": "lightbox-title",
93
- className: clsx(Lightbox_module.title, normalizeClassName(className)),
92
+ className: clsx(Lightbox_module.title, className),
94
93
  ...props
95
94
  });
96
95
  });
@@ -98,7 +97,7 @@ const Lightbox_LightboxDescription = /*#__PURE__*/ forwardRef(function({ classNa
98
97
  return /*#__PURE__*/ jsx(Dialog.Description, {
99
98
  ref: ref,
100
99
  "data-slot": "lightbox-description",
101
- className: clsx(Lightbox_module.description, normalizeClassName(className)),
100
+ className: clsx(Lightbox_module.description, className),
102
101
  ...props
103
102
  });
104
103
  });
@@ -106,7 +105,7 @@ const Lightbox_LightboxCloseTrigger = /*#__PURE__*/ forwardRef(function({ classN
106
105
  return /*#__PURE__*/ jsx(Dialog.CloseTrigger, {
107
106
  ref: ref,
108
107
  "data-slot": "lightbox-close-trigger",
109
- className: normalizeClassName(className),
108
+ className: className,
110
109
  ...props
111
110
  });
112
111
  });
@@ -120,7 +119,7 @@ const Lightbox_LightboxCloseIcon = /*#__PURE__*/ forwardRef(function({ className
120
119
  "data-slot": "lightbox-close-icon",
121
120
  "data-state": dialog.open ? 'open' : 'closed',
122
121
  "aria-label": ariaLabel,
123
- className: clsx(Lightbox_module.closeIcon, normalizeClassName(className)),
122
+ className: clsx(Lightbox_module.closeIcon, className),
124
123
  children: children
125
124
  })
126
125
  });
@@ -135,7 +134,7 @@ const Lightbox_LightboxImage = /*#__PURE__*/ forwardRef(function({ className, cl
135
134
  ref: ref,
136
135
  "data-slot": "lightbox-image",
137
136
  "data-close-on-click": closeOnClick ? '' : void 0,
138
- className: clsx(Lightbox_module.image, normalizeClassName(className)),
137
+ className: clsx(Lightbox_module.image, className),
139
138
  onClick: handleClick,
140
139
  ...props
141
140
  });
@@ -144,7 +143,7 @@ const Lightbox_LightboxGallery = /*#__PURE__*/ forwardRef(function({ className,
144
143
  return /*#__PURE__*/ jsx(ark.div, {
145
144
  ref: ref,
146
145
  "data-slot": "lightbox-gallery",
147
- className: clsx(Lightbox_module.gallery, normalizeClassName(className)),
146
+ className: clsx(Lightbox_module.gallery, className),
148
147
  ...props
149
148
  });
150
149
  });
@@ -152,7 +151,7 @@ const Lightbox_LightboxHeader = /*#__PURE__*/ forwardRef(function({ className, .
152
151
  return /*#__PURE__*/ jsx(ark.div, {
153
152
  ref: ref,
154
153
  "data-slot": "lightbox-header",
155
- className: clsx(Lightbox_module.header, normalizeClassName(className)),
154
+ className: clsx(Lightbox_module.header, className),
156
155
  ...props
157
156
  });
158
157
  });
@@ -160,7 +159,7 @@ const Lightbox_LightboxBody = /*#__PURE__*/ forwardRef(function({ className, ...
160
159
  return /*#__PURE__*/ jsx(ark.div, {
161
160
  ref: ref,
162
161
  "data-slot": "lightbox-body",
163
- className: clsx(Lightbox_module.body, normalizeClassName(className)),
162
+ className: clsx(Lightbox_module.body, className),
164
163
  ...props
165
164
  });
166
165
  });
@@ -168,7 +167,7 @@ const Lightbox_LightboxFooter = /*#__PURE__*/ forwardRef(function({ className, .
168
167
  return /*#__PURE__*/ jsx(ark.div, {
169
168
  ref: ref,
170
169
  "data-slot": "lightbox-footer",
171
- className: clsx(Lightbox_module.footer, normalizeClassName(className)),
170
+ className: clsx(Lightbox_module.footer, className),
172
171
  ...props
173
172
  });
174
173
  });
@@ -44,7 +44,6 @@
44
44
  .content-N4c6Zm {
45
45
  box-sizing: border-box;
46
46
  gap: var(--moduix-lightbox-content-gap, var(--moduix-spacing-3));
47
- width: -moz-fit-content;
48
47
  width: fit-content;
49
48
  max-width: min(var(--moduix-lightbox-content-max-width, 80vw),
50
49
  calc(100vw - var(--moduix-lightbox-positioner-padding, var(--moduix-spacing-4)) * 2));
@@ -119,7 +118,6 @@
119
118
 
120
119
  .gallery-d_JY9F {
121
120
  --moduix-carousel-gap: var(--moduix-lightbox-gallery-gap, var(--moduix-spacing-4));
122
- width: auto;
123
121
  max-width: min(var(--moduix-lightbox-gallery-max-width, 72rem),
124
122
  calc(100vw - var(--moduix-lightbox-positioner-padding, var(--moduix-spacing-4)) * 2));
125
123
  justify-self: center;
@@ -154,7 +152,6 @@
154
152
 
155
153
  .gallery-d_JY9F [data-slot="carousel-indicator-group"] {
156
154
  flex-wrap: wrap;
157
- width: -moz-fit-content;
158
155
  width: fit-content;
159
156
  max-width: 100%;
160
157
  margin-inline: auto;
@@ -2,7 +2,6 @@ import { jsx } from "react/jsx-runtime";
2
2
  import { ark } from "@ark-ui/react/factory";
3
3
  import { clsx } from "clsx";
4
4
  import { forwardRef } from "react";
5
- import { normalizeClassName } from "../../internal/normalizeClassName.js";
6
5
  import List_module from "./List.module.js";
7
6
  const List_ListRoot = /*#__PURE__*/ forwardRef(function({ as, asChild, className, gap = 'sm', marker, role, size = 'md', tone = 'default', ...props }, ref) {
8
7
  const markerValue = marker ?? 'auto';
@@ -17,7 +16,7 @@ const List_ListRoot = /*#__PURE__*/ forwardRef(function({ as, asChild, className
17
16
  'data-marker': markerValue,
18
17
  'data-size': size,
19
18
  'data-tone': tone,
20
- className: clsx(List_module.root, normalizeClassName(className))
19
+ className: clsx(List_module.root, className)
21
20
  };
22
21
  if ('ol' === as) return /*#__PURE__*/ jsx(ark.ol, {
23
22
  ref: ref,
@@ -36,7 +35,7 @@ const List_ListItem = /*#__PURE__*/ forwardRef(function({ asChild, className, ..
36
35
  "data-scope": "list",
37
36
  "data-part": "item",
38
37
  "data-slot": "list-item",
39
- className: normalizeClassName(className)
38
+ className: className
40
39
  });
41
40
  });
42
41
  const List = Object.assign(List_ListRoot, {
@@ -1,13 +1,13 @@
1
- import { Listbox as ListboxPrimitive, useListbox, useListboxContext, useListboxItemContext } from '@ark-ui/react/listbox';
1
+ import { Listbox as ListboxPrimitive, type ListboxRootComponent, type ListboxRootProviderComponent, useListbox, useListboxContext, useListboxItemContext } from '@ark-ui/react/listbox';
2
2
  import type { ComponentProps } from 'react';
3
3
  declare function ListboxFilter({ className, children, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
4
- declare const Listbox: ListboxPrimitive.RootComponent & {
5
- Root: ListboxPrimitive.RootComponent;
6
- RootProvider: ListboxPrimitive.RootProviderComponent;
4
+ declare const Listbox: ListboxRootComponent & {
5
+ Root: ListboxRootComponent;
6
+ RootProvider: ListboxRootProviderComponent;
7
7
  Label: import("react").ForwardRefExoticComponent<Omit<ListboxPrimitive.LabelProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
8
8
  Input: import("react").ForwardRefExoticComponent<Omit<ListboxPrimitive.InputProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
9
9
  Filter: typeof ListboxFilter;
10
- ClearTrigger: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
10
+ ClearTrigger: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLButtonElement>>;
11
11
  Content: import("react").ForwardRefExoticComponent<Omit<ListboxPrimitive.ContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
12
12
  Empty: import("react").ForwardRefExoticComponent<Omit<ListboxPrimitive.EmptyProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
13
13
  ItemGroup: import("react").ForwardRefExoticComponent<Omit<ListboxPrimitive.ItemGroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;