@zentauri-ui/zentauri-components 2.1.7 → 2.1.8

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 (75) hide show
  1. package/README.md +7 -5
  2. package/cli/props.json +189 -3
  3. package/cli/registry.json +9 -0
  4. package/dist/{chunk-KVSRUAXP.mjs → chunk-4PAHLHYF.mjs} +3 -3
  5. package/dist/{chunk-KVSRUAXP.mjs.map → chunk-4PAHLHYF.mjs.map} +1 -1
  6. package/dist/chunk-4SLVTSHM.js +241 -0
  7. package/dist/chunk-4SLVTSHM.js.map +1 -0
  8. package/dist/chunk-6OVDBAMI.js +19 -0
  9. package/dist/{chunk-5FU57ZVQ.js.map → chunk-6OVDBAMI.js.map} +1 -1
  10. package/dist/{chunk-5ELR6MIN.js → chunk-BAAXQPZ7.js} +6 -6
  11. package/dist/{chunk-5ELR6MIN.js.map → chunk-BAAXQPZ7.js.map} +1 -1
  12. package/dist/{chunk-DBNGLT5U.mjs → chunk-D7ZTSAA6.mjs} +4 -4
  13. package/dist/{chunk-DBNGLT5U.mjs.map → chunk-D7ZTSAA6.mjs.map} +1 -1
  14. package/dist/{chunk-TJ2EWPER.js → chunk-DPNTQ4AK.js} +47 -3
  15. package/dist/chunk-DPNTQ4AK.js.map +1 -0
  16. package/dist/chunk-IHDM7AHY.mjs +233 -0
  17. package/dist/chunk-IHDM7AHY.mjs.map +1 -0
  18. package/dist/{chunk-G7FVHZRB.js → chunk-L5QORCUO.js} +12 -12
  19. package/dist/{chunk-G7FVHZRB.js.map → chunk-L5QORCUO.js.map} +1 -1
  20. package/dist/{chunk-7UXPXCKV.mjs → chunk-OWVQVAOY.mjs} +3 -3
  21. package/dist/{chunk-7UXPXCKV.mjs.map → chunk-OWVQVAOY.mjs.map} +1 -1
  22. package/dist/{chunk-FUCW5GPE.mjs → chunk-UVP3MUBU.mjs} +39 -4
  23. package/dist/chunk-UVP3MUBU.mjs.map +1 -0
  24. package/dist/design-system/facade.js +3 -3
  25. package/dist/design-system/facade.mjs +2 -2
  26. package/dist/design-system/index.d.ts +1 -0
  27. package/dist/design-system/index.d.ts.map +1 -1
  28. package/dist/design-system/split-button.d.ts +25 -0
  29. package/dist/design-system/split-button.d.ts.map +1 -0
  30. package/dist/ui/buttons/animated.js +5 -5
  31. package/dist/ui/buttons/animated.mjs +3 -3
  32. package/dist/ui/buttons.js +6 -6
  33. package/dist/ui/buttons.mjs +4 -4
  34. package/dist/ui/data-table.js +16 -16
  35. package/dist/ui/data-table.mjs +6 -6
  36. package/dist/ui/dropdown/dropdown.d.ts +1 -1
  37. package/dist/ui/dropdown/dropdown.d.ts.map +1 -1
  38. package/dist/ui/dropdown/types.d.ts +2 -2
  39. package/dist/ui/dropdown/types.d.ts.map +1 -1
  40. package/dist/ui/dropdown.js +31 -231
  41. package/dist/ui/dropdown.js.map +1 -1
  42. package/dist/ui/dropdown.mjs +4 -229
  43. package/dist/ui/dropdown.mjs.map +1 -1
  44. package/dist/ui/dynamic-stepper.js +15 -15
  45. package/dist/ui/dynamic-stepper.mjs +4 -4
  46. package/dist/ui/pagination.js +7 -7
  47. package/dist/ui/pagination.mjs +4 -4
  48. package/dist/ui/split-button/index.d.ts +4 -0
  49. package/dist/ui/split-button/index.d.ts.map +1 -0
  50. package/dist/ui/split-button/split-button-base.d.ts +6 -0
  51. package/dist/ui/split-button/split-button-base.d.ts.map +1 -0
  52. package/dist/ui/split-button/split-button.d.ts +6 -0
  53. package/dist/ui/split-button/split-button.d.ts.map +1 -0
  54. package/dist/ui/split-button/types.d.ts +30 -0
  55. package/dist/ui/split-button/types.d.ts.map +1 -0
  56. package/dist/ui/split-button/variants.d.ts +16 -0
  57. package/dist/ui/split-button/variants.d.ts.map +1 -0
  58. package/dist/ui/split-button.js +287 -0
  59. package/dist/ui/split-button.js.map +1 -0
  60. package/dist/ui/split-button.mjs +278 -0
  61. package/dist/ui/split-button.mjs.map +1 -0
  62. package/package.json +1 -1
  63. package/src/design-system/index.ts +1 -0
  64. package/src/design-system/split-button.ts +38 -0
  65. package/src/ui/dropdown/dropdown.tsx +7 -3
  66. package/src/ui/dropdown/types.ts +2 -2
  67. package/src/ui/split-button/index.ts +19 -0
  68. package/src/ui/split-button/split-button-base.tsx +232 -0
  69. package/src/ui/split-button/split-button.test.tsx +208 -0
  70. package/src/ui/split-button/split-button.tsx +9 -0
  71. package/src/ui/split-button/types.ts +46 -0
  72. package/src/ui/split-button/variants.ts +46 -0
  73. package/dist/chunk-5FU57ZVQ.js +0 -19
  74. package/dist/chunk-FUCW5GPE.mjs.map +0 -1
  75. package/dist/chunk-TJ2EWPER.js.map +0 -1
package/README.md CHANGED
@@ -15,7 +15,7 @@ Published artifacts live under `dist/`. Imports use **per-entry subpaths**: `@ze
15
15
 
16
16
  | Surface | Count | Import shape |
17
17
  | ------------------- | ----: | ----------------------------------------------------- |
18
- | Static UI entries | 42 | `@zentauri-ui/zentauri-components/ui/<name>` |
18
+ | Static UI entries | 43 | `@zentauri-ui/zentauri-components/ui/<name>` |
19
19
  | Animated UI entries | 27 | `@zentauri-ui/zentauri-components/ui/<name>/animated` |
20
20
  | Animation entries | 41 | `@zentauri-ui/zentauri-components/animations/<name>` |
21
21
  | Chart entries | 9 | `@zentauri-ui/zentauri-components/charts/<type>` |
@@ -29,12 +29,12 @@ Generated from the component package Vitest JSON report via `pnpm --filter @zent
29
29
 
30
30
  | Metric | Result |
31
31
  | ---------- | ---------------- |
32
- | Test files | 97 passed (97) |
33
- | Tests | 808 passed (808) |
32
+ | Test files | 98 passed (98) |
33
+ | Tests | 819 passed (819) |
34
34
 
35
35
  | Area | Test files | Tests |
36
36
  | ------------------------------ | ---------- | ----- |
37
- | Components and UI utilities | 48 | 503 |
37
+ | Components and UI utilities | 49 | 514 |
38
38
  | Standalone animations | 1 | 45 |
39
39
  | React hooks | 41 | 174 |
40
40
  | Design system facade | 1 | 11 |
@@ -62,6 +62,7 @@ Generated from the component package Vitest JSON report via `pnpm --filter @zent
62
62
  | `src/ui/alert/alert.test.tsx` | 11 |
63
63
  | `src/ui/rating/rating.test.tsx` | 11 |
64
64
  | `src/ui/select/select.test.tsx` | 11 |
65
+ | `src/ui/split-button/split-button.test.tsx` | 11 |
65
66
  | `src/ui/table/table.test.tsx` | 11 |
66
67
  | `src/hooks/usePagination/usePagination.test.ts` | 10 |
67
68
  | `src/ui/marquee/marquee.test.tsx` | 10 |
@@ -245,6 +246,7 @@ Import static primitives from `@zentauri-ui/zentauri-components/ui/<subpath>` wh
245
246
  | Skeleton | `skeleton` | `skeleton/animated` |
246
247
  | Slider | `slider` | — |
247
248
  | Spinner | — | `spinner/animated` |
249
+ | Split button | `split-button` | — |
248
250
  | Table | `table` | `table/animated` |
249
251
  | Tabs | `tabs` | `tabs/animated` |
250
252
  | Timeline | `timeline` | `timeline/animated` |
@@ -852,7 +854,7 @@ From this package directory in the monorepo:
852
854
 
853
855
  - `pnpm build` (or `npm run build`) — production bundle via `tsup` (Rollup treeshake + `scripts/prepend-use-client.mjs` via `onSuccess` so each UI entry under `dist/ui/`, animation entry under `dist/animations/`, chart entry under `dist/charts/`, and `dist/ui/<name>/animated.*` starts with `"use client"` where needed)
854
856
  - `pnpm dev` — `tsup` watch mode (same `onSuccess` hook after each rebuild)
855
- - `pnpm test` / `pnpm test:watch` — **Vitest** and **Testing Library** unit tests // currently covered 808 test cases in total
857
+ - `pnpm test` / `pnpm test:watch` — **Vitest** and **Testing Library** unit tests // currently covered 819 test cases in total
856
858
  - `pnpm test:a11y` — focused accessibility coverage for package-level UI primitives and compound components: **axe-core** audits for every interactive component plus **keyboard-interaction** tests (focus order, arrow-key nav, Home/End, Escape/Enter) for the compound components
857
859
  - `pnpm check:tokens` — enforce the `--zui-*` token contract across design-system, variant, and local custom-property usage without generating a large checked-in token catalog
858
860
  - **`pnpm run generate:registry`** — runs `scripts/generate-registry.mjs`, which reads **`uiComponentNames`**, **`uiAnimatedComponentNames`**, **`animationEntryNames`**, **`chartEntryNames`**, and **`hooksEntryNames`** from `tsup.config.ts`, applies fixed **`nameAliases`**, scans each component/chart source to build **`peerHints`**, and writes **`cli/registry.json`** (`components` + `animations` + `hooks` + `peerHints`). Run this after adding or renaming UI, animation, chart, or hook entries so the CLI stays in sync (the script prints counts).
package/cli/props.json CHANGED
@@ -6252,9 +6252,44 @@
6252
6252
  {
6253
6253
  "name": "children",
6254
6254
  "type": "ReactNode",
6255
- "required": true,
6255
+ "required": false,
6256
6256
  "group": "content",
6257
6257
  "deprecated": false
6258
+ },
6259
+ {
6260
+ "name": "className",
6261
+ "type": "string | undefined",
6262
+ "required": false,
6263
+ "group": "dom",
6264
+ "deprecated": false
6265
+ },
6266
+ {
6267
+ "name": "id",
6268
+ "type": "string | undefined",
6269
+ "required": false,
6270
+ "group": "dom",
6271
+ "deprecated": false
6272
+ },
6273
+ {
6274
+ "name": "onClick",
6275
+ "type": "MouseEventHandler<HTMLDivElement> | undefined",
6276
+ "required": false,
6277
+ "group": "dom",
6278
+ "deprecated": false
6279
+ },
6280
+ {
6281
+ "name": "style",
6282
+ "type": "CSSProperties | undefined",
6283
+ "required": false,
6284
+ "group": "dom",
6285
+ "deprecated": false
6286
+ },
6287
+ {
6288
+ "name": "title",
6289
+ "type": "string | undefined",
6290
+ "required": false,
6291
+ "group": "dom",
6292
+ "deprecated": false
6258
6293
  }
6259
6294
  ]
6260
6295
  },
@@ -6337,8 +6372,8 @@
6337
6372
  "props": [
6338
6373
  {
6339
6374
  "name": "value",
6340
- "type": "string",
6341
- "required": true,
6375
+ "type": "string | undefined",
6376
+ "required": false,
6342
6377
  "group": "controlled",
6343
6378
  "deprecated": false
6344
6379
  },
@@ -12728,6 +12763,157 @@
12728
12763
  }
12729
12764
  ]
12730
12765
  },
12766
+ "split-button": {
12767
+ "slug": "split-button",
12768
+ "subcomponents": [
12769
+ {
12770
+ "name": "static:SplitButton",
12771
+ "displayName": "SplitButton",
12772
+ "propsType": "SplitButtonProps",
12773
+ "source": "static",
12774
+ "props": [
12775
+ {
12776
+ "name": "fullWidth",
12777
+ "type": "enum",
12778
+ "required": false,
12779
+ "group": "variant",
12780
+ "isVariant": true,
12781
+ "options": [
12782
+ "true"
12783
+ ],
12784
+ "variantGroup": "fullWidth",
12785
+ "deprecated": false
12786
+ },
12787
+ {
12788
+ "name": "defaultOpen",
12789
+ "type": "boolean | undefined",
12790
+ "required": false,
12791
+ "group": "controlled",
12792
+ "deprecated": false
12793
+ },
12794
+ {
12795
+ "name": "onOpenChange",
12796
+ "type": "((open: boolean) => void) | undefined",
12797
+ "required": false,
12798
+ "group": "controlled",
12799
+ "deprecated": false
12800
+ },
12801
+ {
12802
+ "name": "open",
12803
+ "type": "boolean | undefined",
12804
+ "required": false,
12805
+ "group": "controlled",
12806
+ "deprecated": false
12807
+ },
12808
+ {
12809
+ "name": "appearance",
12810
+ "type": "'default' | 'outline' | 'ghost' | 'blue' | 'cyan' | 'green' | 'lime' | 'mint' | 'ocean' | 'sapphire' | 'lavender' | 'ruby' | 'red' | 'slate' | 'zinc' | 'stone' | 'royal' | 'electric' | 'forest' | 'sunset' | 'magenta' | 'crimson' | 'aqua' | 'plum' | 'sky' | 'rose' | 'purple' | 'pink' | 'orange' | 'yellow' | 'teal' | 'indigo' | 'emerald' | 'gradient-blue' | 'gradient-green' | 'gradient-red' | 'gradient-yellow' | 'gradient-purple' | 'gradient-teal' | 'gradient-indigo' | 'gradient-pink' | 'gradient-orange' | 'link' | 'gray' | 'violet' | 'secondary' | 'destructive' | 'amber' | 'glass' | null | undefined",
12811
+ "required": false,
12812
+ "group": "behavior",
12813
+ "deprecated": false
12814
+ },
12815
+ {
12816
+ "name": "disabled",
12817
+ "type": "boolean | undefined",
12818
+ "required": false,
12819
+ "group": "behavior",
12820
+ "deprecated": false
12821
+ },
12822
+ {
12823
+ "name": "items",
12824
+ "type": "SplitButtonItem[]",
12825
+ "required": true,
12826
+ "group": "behavior",
12827
+ "deprecated": false
12828
+ },
12829
+ {
12830
+ "name": "label",
12831
+ "type": "string",
12832
+ "required": true,
12833
+ "group": "behavior",
12834
+ "deprecated": false
12835
+ },
12836
+ {
12837
+ "name": "loading",
12838
+ "type": "boolean | undefined",
12839
+ "required": false,
12840
+ "group": "behavior",
12841
+ "deprecated": false
12842
+ },
12843
+ {
12844
+ "name": "onClick",
12845
+ "type": "MouseEventHandler<HTMLButtonElement> | undefined",
12846
+ "required": false,
12847
+ "group": "behavior",
12848
+ "deprecated": false
12849
+ },
12850
+ {
12851
+ "name": "size",
12852
+ "type": "SplitButtonSize | undefined",
12853
+ "required": false,
12854
+ "group": "behavior",
12855
+ "deprecated": false
12856
+ },
12857
+ {
12858
+ "name": "startIcon",
12859
+ "type": "ReactNode",
12860
+ "required": false,
12861
+ "group": "behavior",
12862
+ "deprecated": false
12863
+ },
12864
+ {
12865
+ "name": "triggerLabel",
12866
+ "type": "string | undefined",
12867
+ "required": false,
12868
+ "group": "behavior",
12869
+ "deprecated": false
12870
+ },
12871
+ {
12872
+ "name": "triggerOn",
12873
+ "type": "'hover' | 'click' | undefined",
12874
+ "required": false,
12875
+ "group": "behavior",
12876
+ "deprecated": false
12877
+ },
12878
+ {
12879
+ "name": "variant",
12880
+ "type": "SplitButtonVariant | undefined",
12881
+ "required": false,
12882
+ "group": "behavior",
12883
+ "deprecated": false
12884
+ },
12885
+ {
12886
+ "name": "className",
12887
+ "type": "string | undefined",
12888
+ "required": false,
12889
+ "group": "dom",
12890
+ "deprecated": false
12891
+ },
12892
+ {
12893
+ "name": "id",
12894
+ "type": "string | undefined",
12895
+ "required": false,
12896
+ "group": "dom",
12897
+ "deprecated": false
12898
+ },
12899
+ {
12900
+ "name": "style",
12901
+ "type": "CSSProperties | undefined",
12902
+ "required": false,
12903
+ "group": "dom",
12904
+ "deprecated": false
12905
+ },
12906
+ {
12907
+ "name": "title",
12908
+ "type": "string | undefined",
12909
+ "required": false,
12910
+ "group": "dom",
12911
+ "deprecated": false
12912
+ }
12913
+ ]
12914
+ }
12915
+ ]
12916
+ },
12731
12917
  "table": {
12732
12918
  "slug": "table",
12733
12919
  "subcomponents": [
package/cli/registry.json CHANGED
@@ -38,6 +38,7 @@
38
38
  "select",
39
39
  "skeleton",
40
40
  "slider",
41
+ "split-button",
41
42
  "table",
42
43
  "tabs",
43
44
  "timeline",
@@ -175,6 +176,7 @@
175
176
  "skeleton",
176
177
  "slider",
177
178
  "spinner",
179
+ "split-button",
178
180
  "table",
179
181
  "tabs",
180
182
  "timeline",
@@ -286,6 +288,10 @@
286
288
  ],
287
289
  "search": [
288
290
  "inputs"
291
+ ],
292
+ "split-button": [
293
+ "buttons",
294
+ "dropdown"
289
295
  ]
290
296
  },
291
297
  "peerHints": {
@@ -361,6 +367,9 @@
361
367
  "skeleton": [
362
368
  "framer-motion"
363
369
  ],
370
+ "split-button": [
371
+ "react-icons"
372
+ ],
364
373
  "table": [
365
374
  "framer-motion"
366
375
  ],
@@ -1,4 +1,4 @@
1
- import { zuiButtonBase, zuiButtonSizes, zuiButtonAppearances } from './chunk-FUCW5GPE.mjs';
1
+ import { zuiButtonBase, zuiButtonSizes, zuiButtonAppearances } from './chunk-UVP3MUBU.mjs';
2
2
  import { cva } from 'class-variance-authority';
3
3
 
4
4
  var buttonVariants = cva(zuiButtonBase, {
@@ -13,5 +13,5 @@ var buttonVariants = cva(zuiButtonBase, {
13
13
  });
14
14
 
15
15
  export { buttonVariants };
16
- //# sourceMappingURL=chunk-KVSRUAXP.mjs.map
17
- //# sourceMappingURL=chunk-KVSRUAXP.mjs.map
16
+ //# sourceMappingURL=chunk-4PAHLHYF.mjs.map
17
+ //# sourceMappingURL=chunk-4PAHLHYF.mjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/ui/buttons/variants.ts"],"names":[],"mappings":";;;AAQO,IAAM,cAAA,GAAiB,IAAI,aAAA,EAAe;AAAA,EAC/C,QAAA,EAAU;AAAA,IACR,UAAA,EAAY,oBAAA;AAAA,IACZ,IAAA,EAAM;AAAA,GACR;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,UAAA,EAAY,SAAA;AAAA,IACZ,IAAA,EAAM;AAAA;AAEV,CAAC","file":"chunk-KVSRUAXP.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n zuiButtonAppearances,\n zuiButtonBase,\n zuiButtonSizes,\n} from \"../../design-system\";\n\nexport const buttonVariants = cva(zuiButtonBase, {\n variants: {\n appearance: zuiButtonAppearances,\n size: zuiButtonSizes,\n },\n defaultVariants: {\n appearance: \"default\",\n size: \"md\",\n },\n});\n"]}
1
+ {"version":3,"sources":["../src/ui/buttons/variants.ts"],"names":[],"mappings":";;;AAQO,IAAM,cAAA,GAAiB,IAAI,aAAA,EAAe;AAAA,EAC/C,QAAA,EAAU;AAAA,IACR,UAAA,EAAY,oBAAA;AAAA,IACZ,IAAA,EAAM;AAAA,GACR;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,UAAA,EAAY,SAAA;AAAA,IACZ,IAAA,EAAM;AAAA;AAEV,CAAC","file":"chunk-4PAHLHYF.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n zuiButtonAppearances,\n zuiButtonBase,\n zuiButtonSizes,\n} from \"../../design-system\";\n\nexport const buttonVariants = cva(zuiButtonBase, {\n variants: {\n appearance: zuiButtonAppearances,\n size: zuiButtonSizes,\n },\n defaultVariants: {\n appearance: \"default\",\n size: \"md\",\n },\n});\n"]}
@@ -0,0 +1,241 @@
1
+ 'use strict';
2
+
3
+ var chunk7DCFVPWN_js = require('./chunk-7DCFVPWN.js');
4
+ var chunkY5JAQEBF_js = require('./chunk-Y5JAQEBF.js');
5
+ var chunkZS5756ZC_js = require('./chunk-ZS5756ZC.js');
6
+ var react = require('react');
7
+ var fi = require('react-icons/fi');
8
+ var classVarianceAuthority = require('class-variance-authority');
9
+ var jsxRuntime = require('react/jsx-runtime');
10
+
11
+ var triggerVariants = classVarianceAuthority.cva(chunkY5JAQEBF_js.zuiDropdownTriggerBase, {
12
+ variants: {
13
+ variant: chunkY5JAQEBF_js.zuiDropdownTriggerVariants,
14
+ size: chunkY5JAQEBF_js.zuiDropdownTriggerSizes
15
+ },
16
+ defaultVariants: {
17
+ variant: "default",
18
+ size: "md"
19
+ }
20
+ });
21
+ var contentVariants = classVarianceAuthority.cva(chunkY5JAQEBF_js.zuiDropdownContentBase, {
22
+ variants: {
23
+ placement: chunkY5JAQEBF_js.zuiDropdownPlacements,
24
+ spacing: chunkY5JAQEBF_js.zuiDropdownSpacing
25
+ },
26
+ defaultVariants: {
27
+ placement: "bottom",
28
+ spacing: "default"
29
+ }
30
+ });
31
+ var itemVariants = classVarianceAuthority.cva(chunkY5JAQEBF_js.zuiDropdownItemBase, {
32
+ variants: {
33
+ variant: chunkY5JAQEBF_js.zuiDropdownItemVariants
34
+ },
35
+ defaultVariants: {
36
+ variant: "default"
37
+ }
38
+ });
39
+ var DropdownContext = react.createContext(null);
40
+ var useDropdown = () => {
41
+ const ctx = react.useContext(DropdownContext);
42
+ if (!ctx) throw new Error("Use inside Dropdown");
43
+ return ctx;
44
+ };
45
+ var Dropdown = ({
46
+ children,
47
+ className,
48
+ defaultOpen = false,
49
+ open: controlledOpen,
50
+ onOpenChange,
51
+ multiSelect = false,
52
+ ...props
53
+ }) => {
54
+ const menuId = `${react.useId()}-menu`;
55
+ const [uncontrolledOpen, setUncontrolledOpen] = react.useState(defaultOpen);
56
+ const [selectedValues, setSelectedValues] = react.useState([]);
57
+ const open = controlledOpen ?? uncontrolledOpen;
58
+ const setOpen = (val) => {
59
+ if (controlledOpen !== void 0) {
60
+ onOpenChange?.(val);
61
+ } else {
62
+ setUncontrolledOpen(val);
63
+ }
64
+ };
65
+ const toggle = () => setOpen(!open);
66
+ const toggleSelect = (value) => {
67
+ if (!multiSelect) {
68
+ setSelectedValues([value]);
69
+ setOpen(false);
70
+ return;
71
+ }
72
+ setSelectedValues(
73
+ (prev) => prev.includes(value) ? prev.filter((v) => v !== value) : [...prev, value]
74
+ );
75
+ };
76
+ return /* @__PURE__ */ jsxRuntime.jsx(
77
+ DropdownContext.Provider,
78
+ {
79
+ value: {
80
+ open,
81
+ setOpen,
82
+ toggle,
83
+ selectedValues,
84
+ toggleSelect,
85
+ multiSelect,
86
+ menuId
87
+ },
88
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkZS5756ZC_js.cn("relative inline-block", className), ...props, children })
89
+ }
90
+ );
91
+ };
92
+ var DropdownTrigger = ({
93
+ children,
94
+ className,
95
+ variant,
96
+ size,
97
+ onClick,
98
+ ...props
99
+ }) => {
100
+ const { toggle, open, menuId } = useDropdown();
101
+ return /* @__PURE__ */ jsxRuntime.jsx(
102
+ "button",
103
+ {
104
+ type: "button",
105
+ "aria-expanded": open,
106
+ "aria-haspopup": "menu",
107
+ "aria-controls": menuId,
108
+ className: chunkZS5756ZC_js.cn(triggerVariants({ variant, size }), className),
109
+ ...props,
110
+ onClick: (event) => {
111
+ onClick?.(event);
112
+ if (!event.defaultPrevented) {
113
+ toggle();
114
+ }
115
+ },
116
+ children
117
+ }
118
+ );
119
+ };
120
+ var DropdownContent = ({
121
+ children,
122
+ className,
123
+ placement = "bottom",
124
+ spacing = "default",
125
+ divider,
126
+ ...props
127
+ }) => {
128
+ const { open, setOpen, menuId } = useDropdown();
129
+ const ref = react.useRef(null);
130
+ chunk7DCFVPWN_js.useClickOutside({ ref, setOpen });
131
+ react.useEffect(() => {
132
+ if (!open) {
133
+ return;
134
+ }
135
+ ref.current?.querySelector('[role="menuitem"]')?.focus();
136
+ }, [open]);
137
+ if (!open) return null;
138
+ return /* @__PURE__ */ jsxRuntime.jsx(
139
+ "div",
140
+ {
141
+ ref,
142
+ id: menuId,
143
+ role: "menu",
144
+ className: chunkZS5756ZC_js.cn(
145
+ contentVariants({ placement, spacing }),
146
+ className,
147
+ divider && "divide-y divide-current"
148
+ ),
149
+ ...props,
150
+ children
151
+ }
152
+ );
153
+ };
154
+ var DropdownItem = ({
155
+ children,
156
+ value,
157
+ className,
158
+ variant,
159
+ onClick,
160
+ onKeyDown,
161
+ onSelect,
162
+ leftIcon,
163
+ rightIcon,
164
+ ...props
165
+ }) => {
166
+ const { toggleSelect, selectedValues } = useDropdown();
167
+ const isSelected = value !== void 0 && selectedValues.includes(value);
168
+ const handleClick = () => {
169
+ if (value !== void 0) toggleSelect(value);
170
+ onSelect?.();
171
+ };
172
+ const focusSiblingItem = (event, direction) => {
173
+ const menu = event.currentTarget.closest('[role="menu"]');
174
+ const items = Array.from(
175
+ menu?.querySelectorAll('[role="menuitem"]') ?? []
176
+ );
177
+ const currentIndex = items.indexOf(event.currentTarget);
178
+ if (currentIndex === -1 || items.length === 0) {
179
+ return;
180
+ }
181
+ const nextIndex = direction === "first" ? 0 : direction === "last" ? items.length - 1 : (currentIndex + (direction === "next" ? 1 : -1) + items.length) % items.length;
182
+ items[nextIndex]?.focus();
183
+ };
184
+ return /* @__PURE__ */ jsxRuntime.jsxs(
185
+ "div",
186
+ {
187
+ role: "menuitem",
188
+ tabIndex: -1,
189
+ onClick: (event) => {
190
+ onClick?.(event);
191
+ if (!event.defaultPrevented) {
192
+ handleClick();
193
+ }
194
+ },
195
+ onKeyDown: (e) => {
196
+ onKeyDown?.(e);
197
+ if (e.defaultPrevented) {
198
+ return;
199
+ }
200
+ if (e.key === "Enter" || e.key === " ") {
201
+ e.preventDefault();
202
+ handleClick();
203
+ } else if (e.key === "ArrowDown") {
204
+ e.preventDefault();
205
+ focusSiblingItem(e, "next");
206
+ } else if (e.key === "ArrowUp") {
207
+ e.preventDefault();
208
+ focusSiblingItem(e, "previous");
209
+ } else if (e.key === "Home") {
210
+ e.preventDefault();
211
+ focusSiblingItem(e, "first");
212
+ } else if (e.key === "End") {
213
+ e.preventDefault();
214
+ focusSiblingItem(e, "last");
215
+ }
216
+ },
217
+ className: chunkZS5756ZC_js.cn(itemVariants({ variant }), className),
218
+ ...props,
219
+ children: [
220
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
221
+ leftIcon,
222
+ children
223
+ ] }),
224
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
225
+ isSelected && /* @__PURE__ */ jsxRuntime.jsx(fi.FiCheck, {}),
226
+ rightIcon
227
+ ] })
228
+ ]
229
+ }
230
+ );
231
+ };
232
+
233
+ exports.Dropdown = Dropdown;
234
+ exports.DropdownContent = DropdownContent;
235
+ exports.DropdownItem = DropdownItem;
236
+ exports.DropdownTrigger = DropdownTrigger;
237
+ exports.contentVariants = contentVariants;
238
+ exports.itemVariants = itemVariants;
239
+ exports.triggerVariants = triggerVariants;
240
+ //# sourceMappingURL=chunk-4SLVTSHM.js.map
241
+ //# sourceMappingURL=chunk-4SLVTSHM.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/ui/dropdown/variants.ts","../src/ui/dropdown/dropdown.tsx"],"names":["cva","zuiDropdownTriggerBase","zuiDropdownTriggerVariants","zuiDropdownTriggerSizes","zuiDropdownContentBase","zuiDropdownPlacements","zuiDropdownSpacing","zuiDropdownItemBase","zuiDropdownItemVariants","createContext","useContext","useId","useState","jsx","cn","useRef","useClickOutside","useEffect","jsxs","FiCheck"],"mappings":"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","file":"chunk-4SLVTSHM.js","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n zuiDropdownContentBase,\n zuiDropdownItemBase,\n zuiDropdownItemVariants,\n zuiDropdownPlacements,\n zuiDropdownSpacing,\n zuiDropdownTriggerBase,\n zuiDropdownTriggerSizes,\n zuiDropdownTriggerVariants,\n} from \"../../design-system/dropdown\";\n\nexport const triggerVariants = cva(zuiDropdownTriggerBase, {\n variants: {\n variant: zuiDropdownTriggerVariants,\n size: zuiDropdownTriggerSizes,\n },\n defaultVariants: {\n variant: \"default\",\n size: \"md\",\n },\n});\n\nexport const contentVariants = cva(zuiDropdownContentBase, {\n variants: {\n placement: zuiDropdownPlacements,\n spacing: zuiDropdownSpacing,\n },\n defaultVariants: {\n placement: \"bottom\",\n spacing: \"default\",\n },\n});\n\nexport const itemVariants = cva(zuiDropdownItemBase, {\n variants: {\n variant: zuiDropdownItemVariants,\n },\n defaultVariants: {\n variant: \"default\",\n },\n});\n","\"use client\";\n\nimport {\n createContext,\n useContext,\n useState,\n useRef,\n useEffect,\n useId,\n type KeyboardEvent,\n} from \"react\";\nimport { FiCheck } from \"react-icons/fi\";\nimport { cn } from \"../../lib/utils\";\nimport type {\n DropdownContextType,\n DropdownProps,\n DropdownTriggerProps,\n DropdownContentProps,\n DropdownItemProps,\n} from \"./types\";\nimport { triggerVariants, contentVariants, itemVariants } from \"./variants\";\nimport { useClickOutside } from \"../../hooks/useClickOutside\";\n\n/* =========================\n Context\n========================= */\nconst DropdownContext = createContext<DropdownContextType | null>(null);\n\nconst useDropdown = () => {\n const ctx = useContext(DropdownContext);\n if (!ctx) throw new Error(\"Use inside Dropdown\");\n return ctx;\n};\n\n/* =========================\n Root\n========================= */\nexport const Dropdown = ({\n children,\n className,\n defaultOpen = false,\n open: controlledOpen,\n onOpenChange,\n multiSelect = false,\n ...props\n}: DropdownProps) => {\n const menuId = `${useId()}-menu`;\n const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n const [selectedValues, setSelectedValues] = useState<string[]>([]);\n\n const open = controlledOpen ?? uncontrolledOpen;\n\n const setOpen = (val: boolean) => {\n if (controlledOpen !== undefined) {\n onOpenChange?.(val);\n } else {\n setUncontrolledOpen(val);\n }\n };\n\n const toggle = () => setOpen(!open);\n\n const toggleSelect = (value: string) => {\n if (!multiSelect) {\n setSelectedValues([value]);\n setOpen(false);\n return;\n }\n\n setSelectedValues((prev) =>\n prev.includes(value) ? prev.filter((v) => v !== value) : [...prev, value],\n );\n };\n\n return (\n <DropdownContext.Provider\n value={{\n open,\n setOpen,\n toggle,\n selectedValues,\n toggleSelect,\n multiSelect,\n menuId,\n }}\n >\n <div className={cn(\"relative inline-block\", className)} {...props}>\n {children}\n </div>\n </DropdownContext.Provider>\n );\n};\n\n/* =========================\n Trigger\n========================= */\nexport const DropdownTrigger = ({\n children,\n className,\n variant,\n size,\n onClick,\n ...props\n}: DropdownTriggerProps) => {\n const { toggle, open, menuId } = useDropdown();\n\n return (\n <button\n type=\"button\"\n aria-expanded={open}\n aria-haspopup=\"menu\"\n aria-controls={menuId}\n className={cn(triggerVariants({ variant, size }), className)}\n {...props}\n onClick={(event) => {\n onClick?.(event);\n if (!event.defaultPrevented) {\n toggle();\n }\n }}\n >\n {children}\n </button>\n );\n};\n\n/* =========================\n Content\n========================= */\nexport const DropdownContent = ({\n children,\n className,\n placement = \"bottom\",\n spacing = \"default\",\n divider,\n ...props\n}: DropdownContentProps) => {\n const { open, setOpen, menuId } = useDropdown();\n const ref = useRef<HTMLDivElement>(null);\n\n // click outside\n useClickOutside({ ref, setOpen });\n\n useEffect(() => {\n if (!open) {\n return;\n }\n\n ref.current?.querySelector<HTMLElement>('[role=\"menuitem\"]')?.focus();\n }, [open]);\n\n if (!open) return null;\n\n return (\n <div\n ref={ref}\n id={menuId}\n role=\"menu\"\n className={cn(\n contentVariants({ placement, spacing }),\n className,\n divider && \"divide-y divide-current\",\n )}\n {...props}\n >\n {children}\n </div>\n );\n};\n\n/* =========================\n Item\n========================= */\nexport const DropdownItem = ({\n children,\n value,\n className,\n variant,\n onClick,\n onKeyDown,\n onSelect,\n leftIcon,\n rightIcon,\n ...props\n}: DropdownItemProps) => {\n const { toggleSelect, selectedValues } = useDropdown();\n const isSelected = value !== undefined && selectedValues.includes(value);\n\n const handleClick = () => {\n if (value !== undefined) toggleSelect(value);\n onSelect?.();\n };\n\n const focusSiblingItem = (\n event: KeyboardEvent<HTMLDivElement>,\n direction: \"next\" | \"previous\" | \"first\" | \"last\",\n ) => {\n const menu = event.currentTarget.closest('[role=\"menu\"]');\n const items = Array.from(\n menu?.querySelectorAll<HTMLElement>('[role=\"menuitem\"]') ?? [],\n );\n const currentIndex = items.indexOf(event.currentTarget);\n\n if (currentIndex === -1 || items.length === 0) {\n return;\n }\n\n const nextIndex =\n direction === \"first\"\n ? 0\n : direction === \"last\"\n ? items.length - 1\n : (currentIndex + (direction === \"next\" ? 1 : -1) + items.length) %\n items.length;\n\n items[nextIndex]?.focus();\n };\n\n return (\n <div\n role=\"menuitem\"\n tabIndex={-1}\n onClick={(event) => {\n onClick?.(event);\n if (!event.defaultPrevented) {\n handleClick();\n }\n }}\n onKeyDown={(e) => {\n onKeyDown?.(e);\n if (e.defaultPrevented) {\n return;\n }\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n handleClick();\n } else if (e.key === \"ArrowDown\") {\n e.preventDefault();\n focusSiblingItem(e, \"next\");\n } else if (e.key === \"ArrowUp\") {\n e.preventDefault();\n focusSiblingItem(e, \"previous\");\n } else if (e.key === \"Home\") {\n e.preventDefault();\n focusSiblingItem(e, \"first\");\n } else if (e.key === \"End\") {\n e.preventDefault();\n focusSiblingItem(e, \"last\");\n }\n }}\n className={cn(itemVariants({ variant }), className)}\n {...props}\n >\n <div className=\"flex items-center gap-2\">\n {leftIcon}\n {children}\n </div>\n\n <div className=\"flex items-center gap-2\">\n {isSelected && <FiCheck />}\n {rightIcon}\n </div>\n </div>\n );\n};\n"]}
@@ -0,0 +1,19 @@
1
+ 'use strict';
2
+
3
+ var chunkDPNTQ4AK_js = require('./chunk-DPNTQ4AK.js');
4
+ var classVarianceAuthority = require('class-variance-authority');
5
+
6
+ var buttonVariants = classVarianceAuthority.cva(chunkDPNTQ4AK_js.zuiButtonBase, {
7
+ variants: {
8
+ appearance: chunkDPNTQ4AK_js.zuiButtonAppearances,
9
+ size: chunkDPNTQ4AK_js.zuiButtonSizes
10
+ },
11
+ defaultVariants: {
12
+ appearance: "default",
13
+ size: "md"
14
+ }
15
+ });
16
+
17
+ exports.buttonVariants = buttonVariants;
18
+ //# sourceMappingURL=chunk-6OVDBAMI.js.map
19
+ //# sourceMappingURL=chunk-6OVDBAMI.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/ui/buttons/variants.ts"],"names":["cva","zuiButtonBase","zuiButtonAppearances","zuiButtonSizes"],"mappings":";;;;;AAQO,IAAM,cAAA,GAAiBA,2BAAIC,8BAAA,EAAe;AAAA,EAC/C,QAAA,EAAU;AAAA,IACR,UAAA,EAAYC,qCAAA;AAAA,IACZ,IAAA,EAAMC;AAAA,GACR;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,UAAA,EAAY,SAAA;AAAA,IACZ,IAAA,EAAM;AAAA;AAEV,CAAC","file":"chunk-5FU57ZVQ.js","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n zuiButtonAppearances,\n zuiButtonBase,\n zuiButtonSizes,\n} from \"../../design-system\";\n\nexport const buttonVariants = cva(zuiButtonBase, {\n variants: {\n appearance: zuiButtonAppearances,\n size: zuiButtonSizes,\n },\n defaultVariants: {\n appearance: \"default\",\n size: \"md\",\n },\n});\n"]}
1
+ {"version":3,"sources":["../src/ui/buttons/variants.ts"],"names":["cva","zuiButtonBase","zuiButtonAppearances","zuiButtonSizes"],"mappings":";;;;;AAQO,IAAM,cAAA,GAAiBA,2BAAIC,8BAAA,EAAe;AAAA,EAC/C,QAAA,EAAU;AAAA,IACR,UAAA,EAAYC,qCAAA;AAAA,IACZ,IAAA,EAAMC;AAAA,GACR;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,UAAA,EAAY,SAAA;AAAA,IACZ,IAAA,EAAM;AAAA;AAEV,CAAC","file":"chunk-6OVDBAMI.js","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n zuiButtonAppearances,\n zuiButtonBase,\n zuiButtonSizes,\n} from \"../../design-system\";\n\nexport const buttonVariants = cva(zuiButtonBase, {\n variants: {\n appearance: zuiButtonAppearances,\n size: zuiButtonSizes,\n },\n defaultVariants: {\n appearance: \"default\",\n size: \"md\",\n },\n});\n"]}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var chunk5FU57ZVQ_js = require('./chunk-5FU57ZVQ.js');
3
+ var chunk6OVDBAMI_js = require('./chunk-6OVDBAMI.js');
4
4
  var chunkZS5756ZC_js = require('./chunk-ZS5756ZC.js');
5
5
  var react = require('react');
6
6
  var jsxRuntime = require('react/jsx-runtime');
@@ -40,7 +40,7 @@ var ButtonBase = (props) => {
40
40
  "data-slot": "button",
41
41
  onClick: handleClick,
42
42
  className: chunkZS5756ZC_js.cn(
43
- chunk5FU57ZVQ_js.buttonVariants({ appearance: appearance2, size: size2 }),
43
+ chunk6OVDBAMI_js.buttonVariants({ appearance: appearance2, size: size2 }),
44
44
  children2.props.className,
45
45
  className2
46
46
  )
@@ -65,7 +65,7 @@ var ButtonBase = (props) => {
65
65
  target,
66
66
  rel: target === "_blank" ? "noopener noreferrer" : void 0,
67
67
  "data-slot": "button",
68
- className: chunkZS5756ZC_js.cn(chunk5FU57ZVQ_js.buttonVariants({ appearance: appearance2, size: size2 }), className2),
68
+ className: chunkZS5756ZC_js.cn(chunk6OVDBAMI_js.buttonVariants({ appearance: appearance2, size: size2 }), className2),
69
69
  ...rest2,
70
70
  children: children2
71
71
  }
@@ -86,7 +86,7 @@ var ButtonBase = (props) => {
86
86
  ref,
87
87
  type,
88
88
  "data-slot": "button",
89
- className: chunkZS5756ZC_js.cn(chunk5FU57ZVQ_js.buttonVariants({ appearance, size }), className),
89
+ className: chunkZS5756ZC_js.cn(chunk6OVDBAMI_js.buttonVariants({ appearance, size }), className),
90
90
  ...rest,
91
91
  children
92
92
  }
@@ -99,5 +99,5 @@ var Button = (props) => {
99
99
  Button.displayName = "Button";
100
100
 
101
101
  exports.Button = Button;
102
- //# sourceMappingURL=chunk-5ELR6MIN.js.map
103
- //# sourceMappingURL=chunk-5ELR6MIN.js.map
102
+ //# sourceMappingURL=chunk-BAAXQPZ7.js.map
103
+ //# sourceMappingURL=chunk-BAAXQPZ7.js.map