@cloudflare/kumo 1.5.1 → 1.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 (150) hide show
  1. package/CHANGELOG.md +90 -0
  2. package/ai/component-registry.json +52 -3
  3. package/ai/component-registry.md +291 -2
  4. package/ai/schemas.ts +11 -2
  5. package/dist/.build-complete +1 -1
  6. package/dist/ai/schemas.d.ts +24 -5
  7. package/dist/ai/schemas.d.ts.map +1 -1
  8. package/dist/catalog.js +1 -1
  9. package/dist/{checkbox-CWANiedi.js → checkbox-Dt8iSNOg.js} +3 -3
  10. package/dist/{checkbox-CWANiedi.js.map → checkbox-Dt8iSNOg.js.map} +1 -1
  11. package/dist/clipboard-text-Bw5rKPXz.js +185 -0
  12. package/dist/clipboard-text-Bw5rKPXz.js.map +1 -0
  13. package/dist/{combobox-C9koouxM.js → combobox-BIC-YZ2L.js} +41 -41
  14. package/dist/combobox-BIC-YZ2L.js.map +1 -0
  15. package/dist/command-line/cli.js +88 -30
  16. package/dist/command-line/commands/add.js +88 -30
  17. package/dist/{command-palette-TGXgr6Vq.js → command-palette-D3MNR7w9.js} +31 -31
  18. package/dist/{command-palette-TGXgr6Vq.js.map → command-palette-D3MNR7w9.js.map} +1 -1
  19. package/dist/components/checkbox.js +1 -1
  20. package/dist/components/clipboard-text.js +1 -1
  21. package/dist/components/combobox.js +1 -1
  22. package/dist/components/command-palette.js +1 -1
  23. package/dist/components/date-picker.js +6 -0
  24. package/dist/components/date-picker.js.map +1 -0
  25. package/dist/components/dialog.js +1 -1
  26. package/dist/components/dropdown.js +1 -1
  27. package/dist/components/field.js +1 -1
  28. package/dist/components/input.js +3 -3
  29. package/dist/components/label.js +1 -1
  30. package/dist/components/link.js +1 -1
  31. package/dist/components/menubar.js +1 -1
  32. package/dist/components/meter.js +1 -1
  33. package/dist/components/pagination.js +1 -1
  34. package/dist/components/popover.js +1 -1
  35. package/dist/components/radio.js +1 -1
  36. package/dist/components/select.js +1 -1
  37. package/dist/components/sensitive-input.js +1 -1
  38. package/dist/components/switch.js +1 -1
  39. package/dist/components/table.js +1 -1
  40. package/dist/components/tabs.js +1 -1
  41. package/dist/components/toast.js +2 -2
  42. package/dist/components/tooltip.js +1 -1
  43. package/dist/date-picker-M6uNX5Ca.js +2921 -0
  44. package/dist/date-picker-M6uNX5Ca.js.map +1 -0
  45. package/dist/{dialog-CpCeOqSZ.js → dialog-toS9krNF.js} +17 -17
  46. package/dist/dialog-toS9krNF.js.map +1 -0
  47. package/dist/{dropdown-DFeFcKfn.js → dropdown-BquiYKKC.js} +38 -38
  48. package/dist/dropdown-BquiYKKC.js.map +1 -0
  49. package/dist/{field-Dt-XuSaQ.js → field-DCq04TgZ.js} +3 -3
  50. package/dist/{field-Dt-XuSaQ.js.map → field-DCq04TgZ.js.map} +1 -1
  51. package/dist/index.js +51 -49
  52. package/dist/index.js.map +1 -1
  53. package/dist/{input-GZAWBXYX.js → input-CCR8NGG7.js} +3 -3
  54. package/dist/{input-GZAWBXYX.js.map → input-CCR8NGG7.js.map} +1 -1
  55. package/dist/{input-area-CS1-ceY4.js → input-area-DU2Yvp_t.js} +3 -3
  56. package/dist/{input-area-CS1-ceY4.js.map → input-area-DU2Yvp_t.js.map} +1 -1
  57. package/dist/{input-group-COo-wz5O.js → input-group-C365-qBq.js} +2 -2
  58. package/dist/{input-group-COo-wz5O.js.map → input-group-C365-qBq.js.map} +1 -1
  59. package/dist/{label-ChZ2Pp5p.js → label-zjtV7oXa.js} +2 -2
  60. package/dist/{label-ChZ2Pp5p.js.map → label-zjtV7oXa.js.map} +1 -1
  61. package/dist/{link-Mj2WM1AS.js → link-C8pUZ4Q-.js} +8 -8
  62. package/dist/{link-Mj2WM1AS.js.map → link-C8pUZ4Q-.js.map} +1 -1
  63. package/dist/{menubar-CbXWXQYR.js → menubar-D7WvAf6x.js} +6 -6
  64. package/dist/menubar-D7WvAf6x.js.map +1 -0
  65. package/dist/{meter-Bu5f3mAc.js → meter-jQGKS1z4.js} +4 -4
  66. package/dist/{meter-Bu5f3mAc.js.map → meter-jQGKS1z4.js.map} +1 -1
  67. package/dist/{pagination-Cf-yRO-n.js → pagination-BN80iKY6.js} +2 -2
  68. package/dist/{pagination-Cf-yRO-n.js.map → pagination-BN80iKY6.js.map} +1 -1
  69. package/dist/{popover-D7yeRosi.js → popover-syU1104E.js} +4 -4
  70. package/dist/{popover-D7yeRosi.js.map → popover-syU1104E.js.map} +1 -1
  71. package/dist/primitives/accordion.js +1 -1
  72. package/dist/primitives/alert-dialog.js +1 -1
  73. package/dist/primitives/autocomplete.js +1 -1
  74. package/dist/primitives/avatar.js +1 -1
  75. package/dist/primitives/button.js +1 -1
  76. package/dist/primitives/checkbox-group.js +1 -1
  77. package/dist/primitives/checkbox.js +1 -1
  78. package/dist/primitives/collapsible.js +1 -1
  79. package/dist/primitives/combobox.js +1 -1
  80. package/dist/primitives/context-menu.js +1 -1
  81. package/dist/primitives/dialog.js +1 -1
  82. package/dist/primitives/direction-provider.js +1 -1
  83. package/dist/primitives/field.js +1 -1
  84. package/dist/primitives/fieldset.js +1 -1
  85. package/dist/primitives/form.js +1 -1
  86. package/dist/primitives/input.js +1 -1
  87. package/dist/primitives/menu.js +1 -1
  88. package/dist/primitives/menubar.js +1 -1
  89. package/dist/primitives/meter.js +1 -1
  90. package/dist/primitives/navigation-menu.js +1 -1
  91. package/dist/primitives/number-field.js +1 -1
  92. package/dist/primitives/popover.js +1 -1
  93. package/dist/primitives/preview-card.js +1 -1
  94. package/dist/primitives/progress.js +1 -1
  95. package/dist/primitives/radio-group.js +1 -1
  96. package/dist/primitives/radio.js +1 -1
  97. package/dist/primitives/scroll-area.js +1 -1
  98. package/dist/primitives/select.js +1 -1
  99. package/dist/primitives/separator.js +1 -1
  100. package/dist/primitives/slider.js +1 -1
  101. package/dist/primitives/switch.js +1 -1
  102. package/dist/primitives/tabs.js +1 -1
  103. package/dist/primitives/toast.js +1 -1
  104. package/dist/primitives/toggle-group.js +1 -1
  105. package/dist/primitives/toggle.js +1 -1
  106. package/dist/primitives/toolbar.js +1 -1
  107. package/dist/primitives/tooltip.js +1 -1
  108. package/dist/primitives.js +1 -1
  109. package/dist/{radio-CKn09bGo.js → radio-CWMtSx65.js} +8 -8
  110. package/dist/{radio-CKn09bGo.js.map → radio-CWMtSx65.js.map} +1 -1
  111. package/dist/{schemas-H10xB2M_.js → schemas-DbIwo0ET.js} +251 -239
  112. package/dist/{schemas-H10xB2M_.js.map → schemas-DbIwo0ET.js.map} +1 -1
  113. package/dist/{select-DvpgiOau.js → select-G6JqBVkg.js} +37 -37
  114. package/dist/{select-DvpgiOau.js.map → select-G6JqBVkg.js.map} +1 -1
  115. package/dist/{sensitive-input-BuYT6U6C.js → sensitive-input-DNFpycoy.js} +4 -4
  116. package/dist/{sensitive-input-BuYT6U6C.js.map → sensitive-input-DNFpycoy.js.map} +1 -1
  117. package/dist/src/command-line/utils/transformer.d.ts +8 -4
  118. package/dist/src/command-line/utils/transformer.d.ts.map +1 -1
  119. package/dist/src/components/clipboard-text/clipboard-text.d.ts +23 -0
  120. package/dist/src/components/clipboard-text/clipboard-text.d.ts.map +1 -1
  121. package/dist/src/components/date-picker/date-picker.d.ts +65 -0
  122. package/dist/src/components/date-picker/date-picker.d.ts.map +1 -0
  123. package/dist/src/components/date-picker/index.d.ts +4 -0
  124. package/dist/src/components/date-picker/index.d.ts.map +1 -0
  125. package/dist/src/components/dropdown/dropdown.d.ts.map +1 -1
  126. package/dist/src/index.d.ts +1 -0
  127. package/dist/src/index.d.ts.map +1 -1
  128. package/dist/styles/kumo-binding.css +0 -4
  129. package/dist/styles/kumo-standalone.css +1 -1
  130. package/dist/styles/kumo.css +541 -0
  131. package/dist/{switch-Tu34uFoa.js → switch-CmsZ4z-g.js} +9 -9
  132. package/dist/{switch-Tu34uFoa.js.map → switch-CmsZ4z-g.js.map} +1 -1
  133. package/dist/{table-DtUrZ2Rj.js → table-Dc0AGcLV.js} +2 -2
  134. package/dist/{table-DtUrZ2Rj.js.map → table-Dc0AGcLV.js.map} +1 -1
  135. package/dist/{tabs-B7THfqHW.js → tabs-BpD1iUiz.js} +2 -2
  136. package/dist/{tabs-B7THfqHW.js.map → tabs-BpD1iUiz.js.map} +1 -1
  137. package/dist/{toast-Du4y8qng.js → toast-BrR0pjLE.js} +8 -8
  138. package/dist/{toast-Du4y8qng.js.map → toast-BrR0pjLE.js.map} +1 -1
  139. package/dist/{tooltip-BxV1H6AV.js → tooltip-daVJYtXY.js} +2 -2
  140. package/dist/{tooltip-BxV1H6AV.js.map → tooltip-daVJYtXY.js.map} +1 -1
  141. package/dist/{vendor-base-ui-CQ6wEonS.js → vendor-base-ui-9w7J6BvW.js} +7246 -7245
  142. package/dist/{vendor-base-ui-CQ6wEonS.js.map → vendor-base-ui-9w7J6BvW.js.map} +1 -1
  143. package/package.json +6 -1
  144. package/scripts/component-registry/discovery.ts +1 -7
  145. package/dist/clipboard-text-B32_yb2r.js +0 -108
  146. package/dist/clipboard-text-B32_yb2r.js.map +0 -1
  147. package/dist/combobox-C9koouxM.js.map +0 -1
  148. package/dist/dialog-CpCeOqSZ.js.map +0 -1
  149. package/dist/dropdown-DFeFcKfn.js.map +0 -1
  150. package/dist/menubar-CbXWXQYR.js.map +0 -1
@@ -1,8 +1,8 @@
1
1
  "use client";
2
- import { jsx as o, jsxs as m } from "react/jsx-runtime";
2
+ import { jsx as t, jsxs as m } from "react/jsx-runtime";
3
3
  import { S as p } from "./surface-BIC6CXiz.js";
4
- import { c as t } from "./cn-Bhsu1vx2.js";
5
- import { a9 as u, aa as D, ab as f, ac as y, ad as x, ae as w, af as T, ag as b } from "./vendor-base-ui-CQ6wEonS.js";
4
+ import { c as o } from "./cn-Bhsu1vx2.js";
5
+ import { am as u, an as D, ao as f, ap as y, aq as x, ar as w, as as T, at as b } from "./vendor-base-ui-9w7J6BvW.js";
6
6
  const N = {
7
7
  size: {
8
8
  base: {
@@ -25,29 +25,29 @@ const N = {
25
25
  }, s = {
26
26
  size: "base"
27
27
  };
28
- function z({
28
+ function A({
29
29
  size: a = s.size
30
30
  } = {}) {
31
- return t(
31
+ return o(
32
32
  // Base styles
33
- "shadow-m z-modal fixed top-1/2 left-1/2 w-full sm:w-auto max-w-[calc(100vw-2rem)] sm:max-w-[calc(100vw-3rem)] -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-xl bg-kumo-base text-kumo-default duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0",
33
+ "shadow-m fixed top-1/2 left-1/2 w-full sm:w-auto max-w-[calc(100vw-2rem)] sm:max-w-[calc(100vw-3rem)] -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-xl bg-kumo-base text-kumo-default duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0",
34
34
  // Apply size from KUMO_DIALOG_VARIANTS
35
35
  N.size[a].classes
36
36
  );
37
37
  }
38
- function A({
38
+ function v({
39
39
  className: a,
40
40
  children: i,
41
41
  style: g,
42
42
  size: d = s.size
43
43
  }) {
44
44
  return /* @__PURE__ */ m(w, { children: [
45
- /* @__PURE__ */ o(T, { className: "z-modal fixed inset-0 bg-kumo-overlay opacity-80 transition-all duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0" }),
46
- /* @__PURE__ */ o(
45
+ /* @__PURE__ */ t(T, { className: "fixed inset-0 bg-kumo-overlay opacity-80 transition-all duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0" }),
46
+ /* @__PURE__ */ t(
47
47
  p,
48
48
  {
49
49
  as: b,
50
- className: t(z({ size: d }), a),
50
+ className: o(A({ size: d }), a),
51
51
  style: {
52
52
  transitionProperty: "scale, opacity",
53
53
  transitionTimingFunction: "var(--default-transition-timing-function)",
@@ -60,26 +60,26 @@ function A({
60
60
  ] });
61
61
  }
62
62
  function e({ children: a, ...i }) {
63
- return /* @__PURE__ */ o(u, { ...i, children: a });
63
+ return /* @__PURE__ */ t(u, { ...i, children: a });
64
64
  }
65
65
  e.displayName = "Dialog.Root";
66
66
  function l({ children: a, ...i }) {
67
- return /* @__PURE__ */ o(D, { ...i, children: a });
67
+ return /* @__PURE__ */ t(D, { ...i, children: a });
68
68
  }
69
69
  l.displayName = "Dialog.Trigger";
70
70
  function n({ className: a, ...i }) {
71
- return /* @__PURE__ */ o(f, { className: a, ...i });
71
+ return /* @__PURE__ */ t(f, { className: a, ...i });
72
72
  }
73
73
  n.displayName = "Dialog.Title";
74
74
  function r({ className: a, ...i }) {
75
- return /* @__PURE__ */ o(y, { className: a, ...i });
75
+ return /* @__PURE__ */ t(y, { className: a, ...i });
76
76
  }
77
77
  r.displayName = "Dialog.Description";
78
78
  function c({ children: a, ...i }) {
79
- return /* @__PURE__ */ o(x, { ...i, children: a });
79
+ return /* @__PURE__ */ t(x, { ...i, children: a });
80
80
  }
81
81
  c.displayName = "Dialog.Close";
82
- const O = Object.assign(A, {
82
+ const O = Object.assign(v, {
83
83
  Root: e,
84
84
  Trigger: l,
85
85
  Title: n,
@@ -94,4 +94,4 @@ export {
94
94
  r as d,
95
95
  c as e
96
96
  };
97
- //# sourceMappingURL=dialog-CpCeOqSZ.js.map
97
+ //# sourceMappingURL=dialog-toS9krNF.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"dialog-toS9krNF.js","sources":["../src/components/dialog/dialog.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, CSSProperties, ReactNode } from \"react\";\nimport { Dialog as DialogBase } from \"@base-ui/react/dialog\";\nimport { Surface } from \"../surface\";\nimport { cn } from \"../../utils/cn\";\n\n/** Dialog size variant definitions mapping sizes to their minimum widths. */\nexport const KUMO_DIALOG_VARIANTS = {\n size: {\n base: {\n classes: \"sm:min-w-96\",\n description: \"Default dialog width\",\n },\n sm: {\n classes: \"min-w-72\",\n description: \"Small dialog for simple confirmations\",\n },\n lg: {\n classes: \"min-w-[32rem]\",\n description: \"Large dialog for complex content\",\n },\n xl: {\n classes: \"min-w-[48rem]\",\n description: \"Extra large dialog for detailed views\",\n },\n },\n} as const;\n\nexport const KUMO_DIALOG_DEFAULT_VARIANTS = {\n size: \"base\",\n} as const;\n\nexport const KUMO_DIALOG_STYLING = {\n dimensions: {\n sm: {\n width: 350,\n titleSize: 20,\n descSize: 16,\n padding: 16,\n gap: 8,\n buttonSize: \"sm\",\n },\n base: {\n width: 384,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n lg: {\n width: 512,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n xl: {\n width: 768,\n titleSize: 20,\n descSize: 16,\n padding: 24,\n gap: 16,\n buttonSize: \"base\",\n },\n },\n baseTokens: {\n background: \"color-surface\",\n text: \"text-color-surface\",\n borderRadius: 12,\n shadow: \"shadow-m\",\n },\n backdrop: {\n background: \"color-surface-secondary\",\n opacity: 0.8,\n },\n header: {\n title: { fontWeight: 600, color: \"text-color-surface\" },\n closeIcon: { name: \"ph-x\", size: 20, color: \"text-color-muted\" },\n },\n description: {\n fontWeight: 400,\n color: \"text-color-muted\",\n },\n buttons: {\n primary: { background: \"color-primary\", text: \"white\" },\n secondary: { ring: \"color-border\", text: \"text-color-surface\" },\n },\n} as const;\n\n// Derived types from KUMO_DIALOG_VARIANTS\nexport type KumoDialogSize = keyof typeof KUMO_DIALOG_VARIANTS.size;\n\nexport interface KumoDialogVariantsProps {\n /**\n * Dialog width.\n * - `\"sm\"` — Small (min 288px) for simple confirmations\n * - `\"base\"` — Default (min 384px)\n * - `\"lg\"` — Large (min 512px) for complex content\n * - `\"xl\"` — Extra large (min 768px) for detailed views\n * @default \"base\"\n */\n size?: KumoDialogSize;\n}\n\nexport function dialogVariants({\n size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n}: KumoDialogVariantsProps = {}) {\n return cn(\n // Base styles\n \"shadow-m fixed top-1/2 left-1/2 w-full sm:w-auto max-w-[calc(100vw-2rem)] sm:max-w-[calc(100vw-3rem)] -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-xl bg-kumo-base text-kumo-default duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0\",\n // Apply size from KUMO_DIALOG_VARIANTS\n KUMO_DIALOG_VARIANTS.size[size].classes,\n );\n}\n\n/**\n * Dialog component props — the modal content panel.\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger render={(p) => <Button {...p}>Open</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Confirm Action</Dialog.Title>\n * <Dialog.Description>Are you sure?</Dialog.Description>\n * <Dialog.Close render={(p) => <Button {...p}>Cancel</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n */\nexport type DialogProps = KumoDialogVariantsProps & {\n /** Additional CSS classes merged via `cn()`. */\n className?: string;\n /** Dialog content (typically Title, Description, Close, and action buttons). */\n children: ReactNode;\n /** Inline styles. */\n style?: CSSProperties;\n};\n\n/**\n * Modal dialog overlay with backdrop. Compound component with `Dialog.Root`,\n * `Dialog.Trigger`, `Dialog.Title`, `Dialog.Description`, and `Dialog.Close`.\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n * <Dialog.Trigger render={(p) => <Button {...p}>Delete</Button>} />\n * <Dialog className=\"p-8\">\n * <Dialog.Title>Delete Item</Dialog.Title>\n * <Dialog.Description>This action cannot be undone.</Dialog.Description>\n * <Dialog.Close render={(p) => <Button variant=\"destructive\" {...p}>Delete</Button>} />\n * </Dialog>\n * </Dialog.Root>\n * ```\n */\nfunction DialogContent({\n className,\n children,\n style,\n size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n}: DialogProps) {\n return (\n <DialogBase.Portal>\n <DialogBase.Backdrop className=\"fixed inset-0 bg-kumo-overlay opacity-80 transition-all duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0\" />\n <Surface\n as={DialogBase.Popup}\n className={cn(dialogVariants({ size }), className)}\n style={\n {\n transitionProperty: \"scale, opacity\",\n transitionTimingFunction:\n \"var(--default-transition-timing-function)\",\n \"--tw-shadow\":\n \"0 20px 25px -5px rgb(0 0 0 / 0.03), 0 8px 10px -6px rgb(0 0 0 / 0.03)\",\n ...style,\n } as CSSProperties\n }\n >\n {children}\n </Surface>\n </DialogBase.Portal>\n );\n}\n\n// ============================================================================\n// Dialog Root\n// ============================================================================\n\ntype BaseDialogRootProps = ComponentPropsWithoutRef<typeof DialogBase.Root>;\n\nexport type DialogRootProps = BaseDialogRootProps;\n\nfunction DialogRoot({ children, ...props }: DialogRootProps) {\n return <DialogBase.Root {...props}>{children}</DialogBase.Root>;\n}\n\nDialogRoot.displayName = \"Dialog.Root\";\n\n// ============================================================================\n// Dialog Trigger\n// ============================================================================\n\ntype BaseDialogTriggerProps = ComponentPropsWithoutRef<\n typeof DialogBase.Trigger\n>;\n\nexport type DialogTriggerProps = BaseDialogTriggerProps;\n\nfunction DialogTrigger({ children, ...props }: DialogTriggerProps) {\n return <DialogBase.Trigger {...props}>{children}</DialogBase.Trigger>;\n}\n\nDialogTrigger.displayName = \"Dialog.Trigger\";\n\n// ============================================================================\n// Dialog Title\n// ============================================================================\n\ntype BaseDialogTitleProps = ComponentPropsWithoutRef<typeof DialogBase.Title>;\n\nexport type DialogTitleProps = BaseDialogTitleProps;\n\nfunction DialogTitle({ className, ...props }: DialogTitleProps) {\n return <DialogBase.Title className={className} {...props} />;\n}\n\nDialogTitle.displayName = \"Dialog.Title\";\n\n// ============================================================================\n// Dialog Description\n// ============================================================================\n\ntype BaseDialogDescriptionProps = ComponentPropsWithoutRef<\n typeof DialogBase.Description\n>;\n\nexport type DialogDescriptionProps = BaseDialogDescriptionProps;\n\nfunction DialogDescription({ className, ...props }: DialogDescriptionProps) {\n return <DialogBase.Description className={className} {...props} />;\n}\n\nDialogDescription.displayName = \"Dialog.Description\";\n\n// ============================================================================\n// Dialog Close\n// ============================================================================\n\ntype BaseDialogCloseProps = ComponentPropsWithoutRef<typeof DialogBase.Close>;\n\nexport type DialogCloseProps = BaseDialogCloseProps;\n\nfunction DialogClose({ children, ...props }: DialogCloseProps) {\n return <DialogBase.Close {...props}>{children}</DialogBase.Close>;\n}\n\nDialogClose.displayName = \"Dialog.Close\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\nconst Dialog = Object.assign(DialogContent, {\n Root: DialogRoot,\n Trigger: DialogTrigger,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n});\n\nexport {\n Dialog,\n DialogRoot,\n DialogTrigger,\n DialogTitle,\n DialogDescription,\n DialogClose,\n};\n"],"names":["KUMO_DIALOG_VARIANTS","KUMO_DIALOG_DEFAULT_VARIANTS","dialogVariants","size","cn","DialogContent","className","children","style","jsxs","DialogBase.Portal","jsx","DialogBase.Backdrop","Surface","DialogBase.Popup","DialogRoot","props","DialogBase.Root","DialogTrigger","DialogBase.Trigger","DialogTitle","DialogBase.Title","DialogDescription","DialogBase.Description","DialogClose","DialogBase.Close","Dialog"],"mappings":";;;;;AAMO,MAAMA,IAAuB;AAAA,EAClC,MAAM;AAAA,IACJ,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA+B;AAAA,EAC1C,MAAM;AACR;AA4EO,SAASC,EAAe;AAAA,EAC7B,MAAAC,IAAOF,EAA6B;AACtC,IAA6B,IAAI;AAC/B,SAAOG;AAAA;AAAA,IAEL;AAAA;AAAA,IAEAJ,EAAqB,KAAKG,CAAI,EAAE;AAAA,EAAA;AAEpC;AA0CA,SAASE,EAAc;AAAA,EACrB,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAL,IAAOF,EAA6B;AACtC,GAAgB;AACd,SACE,gBAAAQ,EAACC,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAoB,WAAU,iIAAA,CAAiI;AAAA,IAChK,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,IAAIC;AAAAA,QACJ,WAAWV,EAAGF,EAAe,EAAE,MAAAC,EAAA,CAAM,GAAGG,CAAS;AAAA,QACjD,OACE;AAAA,UACE,oBAAoB;AAAA,UACpB,0BACE;AAAA,UACF,eACE;AAAA,UACF,GAAGE;AAAA,QAAA;AAAA,QAIN,UAAAD;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;AAUA,SAASQ,EAAW,EAAE,UAAAR,GAAU,GAAGS,KAA0B;AAC3D,2BAAQC,GAAA,EAAiB,GAAGD,GAAQ,UAAAT,EAAA,CAAS;AAC/C;AAEAQ,EAAW,cAAc;AAYzB,SAASG,EAAc,EAAE,UAAAX,GAAU,GAAGS,KAA6B;AACjE,2BAAQG,GAAA,EAAoB,GAAGH,GAAQ,UAAAT,EAAA,CAAS;AAClD;AAEAW,EAAc,cAAc;AAU5B,SAASE,EAAY,EAAE,WAAAd,GAAW,GAAGU,KAA2B;AAC9D,2BAAQK,GAAA,EAAiB,WAAAf,GAAuB,GAAGU,EAAA,CAAO;AAC5D;AAEAI,EAAY,cAAc;AAY1B,SAASE,EAAkB,EAAE,WAAAhB,GAAW,GAAGU,KAAiC;AAC1E,2BAAQO,GAAA,EAAuB,WAAAjB,GAAuB,GAAGU,EAAA,CAAO;AAClE;AAEAM,EAAkB,cAAc;AAUhC,SAASE,EAAY,EAAE,UAAAjB,GAAU,GAAGS,KAA2B;AAC7D,2BAAQS,GAAA,EAAkB,GAAGT,GAAQ,UAAAT,EAAA,CAAS;AAChD;AAEAiB,EAAY,cAAc;AAM1B,MAAME,IAAS,OAAO,OAAOrB,GAAe;AAAA,EAC1C,MAAMU;AAAA,EACN,SAASG;AAAA,EACT,OAAOE;AAAA,EACP,aAAaE;AAAA,EACb,OAAOE;AACT,CAAC;"}
@@ -1,11 +1,11 @@
1
1
  "use client";
2
- import { jsx as n, jsxs as u, Fragment as V } from "react/jsx-runtime";
2
+ import { jsx as n, jsxs as u, Fragment as j } from "react/jsx-runtime";
3
3
  import * as i from "react";
4
4
  import { c as s } from "./cn-Bhsu1vx2.js";
5
5
  import { u as z } from "./link-provider-DPBGo-0n.js";
6
- import { C as U } from "./checkbox-CWANiedi.js";
7
- import { CheckIcon as b, CaretRightIcon as W } from "@phosphor-icons/react";
8
- import { ah as F, ai as K, aj as q, ak as B, al as x, S as w, am as N, an as H, ao as J, ap as M, aq as k, ar as Q, as as X, at as R, au as Y } from "./vendor-base-ui-CQ6wEonS.js";
6
+ import { C as F } from "./checkbox-Dt8iSNOg.js";
7
+ import { CheckIcon as b, CaretRightIcon as U } from "@phosphor-icons/react";
8
+ import { au as K, av as W, aw as B, ax as H, ay as x, S as w, az as N, aA as q, aB as J, aC as M, aD as y, aE as Q, aF as X, aG as R, aH as Y } from "./vendor-base-ui-9w7J6BvW.js";
9
9
  const Z = {
10
10
  variant: {
11
11
  default: {
@@ -25,7 +25,7 @@ function ee({
25
25
  } = {}) {
26
26
  return s(Z.variant[e].classes);
27
27
  }
28
- const y = i.forwardRef(({ className: e, inset: t, children: a, icon: o, ...r }, d) => /* @__PURE__ */ u(
28
+ const k = i.forwardRef(({ className: e, inset: t, children: a, icon: o, ...r }, d) => /* @__PURE__ */ u(
29
29
  R,
30
30
  {
31
31
  ref: d,
@@ -46,11 +46,11 @@ const y = i.forwardRef(({ className: e, inset: t, children: a, icon: o, ...r },
46
46
  children: [
47
47
  o && /* @__PURE__ */ n(o, { className: "mr-2 h-4 w-4" }),
48
48
  a,
49
- /* @__PURE__ */ n(W, { className: "ml-auto h-4 w-4" })
49
+ /* @__PURE__ */ n(U, { className: "ml-auto h-4 w-4" })
50
50
  ]
51
51
  }
52
52
  ));
53
- y.displayName = R.displayName;
53
+ k.displayName = R.displayName;
54
54
  const h = i.forwardRef(({ className: e, sideOffset: t = 8, children: a, ...o }, r) => /* @__PURE__ */ n(x, { children: /* @__PURE__ */ n(
55
55
  Q,
56
56
  {
@@ -61,7 +61,7 @@ const h = i.forwardRef(({ className: e, sideOffset: t = 8, children: a, ...o },
61
61
  X,
62
62
  {
63
63
  className: s(
64
- "z-50 overflow-hidden bg-kumo-control text-kumo-default",
64
+ "overflow-hidden bg-kumo-control text-kumo-default",
65
65
  // background
66
66
  "rounded-lg shadow-lg ring ring-kumo-line",
67
67
  // border part
@@ -95,20 +95,20 @@ const h = i.forwardRef(({ className: e, sideOffset: t = 8, children: a, ...o },
95
95
  render: d,
96
96
  href: l,
97
97
  variant: m = "default",
98
- ..._
99
- }, j) => {
100
- const f = z(), A = i.useMemo(() => {
101
- const c = /* @__PURE__ */ u(V, { children: [
98
+ ...E
99
+ }, G) => {
100
+ const f = z(), L = i.useMemo(() => {
101
+ const c = /* @__PURE__ */ u(j, { children: [
102
102
  a && D(a),
103
103
  o,
104
104
  r && /* @__PURE__ */ n("span", { className: "inline-flex", children: /* @__PURE__ */ n(b, {}) })
105
105
  ] });
106
106
  if (!l) return c;
107
- const G = l.startsWith("https://"), g = s(
107
+ const V = /^(https?:)?\/\//.test(l), g = s(
108
108
  "flex items-center",
109
109
  m === "danger" && "text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger"
110
110
  );
111
- return G ? /* @__PURE__ */ n(
111
+ return V ? /* @__PURE__ */ n(
112
112
  "a",
113
113
  {
114
114
  className: s(g, "w-full text-inherit! no-underline!"),
@@ -128,26 +128,26 @@ const h = i.forwardRef(({ className: e, sideOffset: t = 8, children: a, ...o },
128
128
  children: c
129
129
  }
130
130
  );
131
- }, [l, a, o, r, m, f]), E = l || d;
131
+ }, [l, a, o, r, m, f]), _ = l || d;
132
132
  return /* @__PURE__ */ n(
133
- k,
133
+ y,
134
134
  {
135
- ref: j,
135
+ ref: G,
136
136
  className: s(
137
137
  "relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none focus:text-kumo-default data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-overlay",
138
138
  t && "pl-8",
139
139
  ee({ variant: m }),
140
140
  e
141
141
  ),
142
- render: l ? A : d,
143
- ..._,
144
- children: E ? void 0 : o
142
+ render: l ? L : d,
143
+ ...E,
144
+ children: _ ? void 0 : o
145
145
  }
146
146
  );
147
147
  }
148
148
  );
149
- I.displayName = k.displayName;
150
- const S = i.forwardRef(({ className: e, children: t, checked: a, ...o }, r) => /* @__PURE__ */ u(
149
+ I.displayName = y.displayName;
150
+ const v = i.forwardRef(({ className: e, children: t, checked: a, ...o }, r) => /* @__PURE__ */ u(
151
151
  M,
152
152
  {
153
153
  ref: r,
@@ -158,13 +158,13 @@ const S = i.forwardRef(({ className: e, children: t, checked: a, ...o }, r) => /
158
158
  checked: a,
159
159
  ...o,
160
160
  children: [
161
- /* @__PURE__ */ n("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-inherit", children: /* @__PURE__ */ n(U, { checked: a }) }),
161
+ /* @__PURE__ */ n("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-inherit", children: /* @__PURE__ */ n(F, { checked: a }) }),
162
162
  t
163
163
  ]
164
164
  }
165
165
  ));
166
- S.displayName = M.displayName;
167
- const v = i.forwardRef(({ className: e, inset: t, ...a }, o) => /* @__PURE__ */ n(
166
+ v.displayName = M.displayName;
167
+ const S = i.forwardRef(({ className: e, inset: t, ...a }, o) => /* @__PURE__ */ n(
168
168
  N,
169
169
  {
170
170
  ref: o,
@@ -176,7 +176,7 @@ const v = i.forwardRef(({ className: e, inset: t, ...a }, o) => /* @__PURE__ */
176
176
  ...a
177
177
  }
178
178
  ));
179
- v.displayName = N.displayName;
179
+ S.displayName = N.displayName;
180
180
  const C = i.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ n(
181
181
  w,
182
182
  {
@@ -216,7 +216,7 @@ const P = i.forwardRef(({ className: e, children: t, inset: a, icon: o, ...r },
216
216
  ));
217
217
  P.displayName = "DropdownMenuRadioItem";
218
218
  const O = i.forwardRef(({ className: e, children: t, ...a }, o) => /* @__PURE__ */ n(
219
- H,
219
+ q,
220
220
  {
221
221
  ref: o,
222
222
  className: s("ml-auto", e),
@@ -225,7 +225,7 @@ const O = i.forwardRef(({ className: e, children: t, ...a }, o) => /* @__PURE__
225
225
  }
226
226
  ));
227
227
  O.displayName = "DropdownMenuRadioItemIndicator";
228
- const L = i.forwardRef(({ children: e, render: t, ...a }, o) => {
228
+ const A = i.forwardRef(({ children: e, render: t, ...a }, o) => {
229
229
  const r = i.isValidElement(e) ? e : null, d = t ?? r;
230
230
  return /* @__PURE__ */ n(
231
231
  Y,
@@ -239,25 +239,25 @@ const L = i.forwardRef(({ children: e, render: t, ...a }, o) => {
239
239
  }
240
240
  );
241
241
  });
242
- L.displayName = "DropdownMenuTrigger";
243
- const ie = Object.assign(F, {
244
- Trigger: L,
242
+ A.displayName = "DropdownMenuTrigger";
243
+ const ie = Object.assign(K, {
244
+ Trigger: A,
245
245
  Portal: x,
246
- Sub: B,
247
- SubTrigger: y,
246
+ Sub: H,
247
+ SubTrigger: k,
248
248
  SubContent: h,
249
249
  Content: h,
250
250
  Item: I,
251
- CheckboxItem: S,
252
- RadioGroup: q,
251
+ CheckboxItem: v,
252
+ RadioGroup: B,
253
253
  RadioItem: P,
254
254
  RadioItemIndicator: O,
255
- Label: v,
255
+ Label: S,
256
256
  Separator: C,
257
257
  Shortcut: T,
258
- Group: K
258
+ Group: W
259
259
  });
260
260
  export {
261
261
  ie as D
262
262
  };
263
- //# sourceMappingURL=dropdown-DFeFcKfn.js.map
263
+ //# sourceMappingURL=dropdown-BquiYKKC.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"dropdown-BquiYKKC.js","sources":["../src/components/dropdown/dropdown.tsx"],"sourcesContent":["import { Menu as DropdownMenuPrimitive } from \"@base-ui/react/menu\";\nimport * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\nimport { Checkbox } from \"../checkbox\";\nimport {\n CaretRightIcon as CaretRight,\n CheckIcon as Check,\n type Icon,\n} from \"@phosphor-icons/react\";\n\n/** Dropdown item variant definitions (default and danger styles). */\nexport const KUMO_DROPDOWN_VARIANTS = {\n variant: {\n default: {\n classes: \"\",\n description: \"Default dropdown item appearance\",\n },\n danger: {\n classes:\n \"text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger\",\n description: \"Destructive action item\",\n },\n },\n} as const;\n\nexport const KUMO_DROPDOWN_DEFAULT_VARIANTS = {\n variant: \"default\",\n} as const;\n\n// Derived types from KUMO_DROPDOWN_VARIANTS\nexport type KumoDropdownVariant = keyof typeof KUMO_DROPDOWN_VARIANTS.variant;\n\nexport interface KumoDropdownVariantsProps {\n /**\n * Visual style of the dropdown item.\n * - `\"default\"` — Standard item appearance\n * - `\"danger\"` — Destructive action with red text\n * @default \"default\"\n */\n variant?: KumoDropdownVariant;\n}\n\nexport function dropdownVariants({\n variant = KUMO_DROPDOWN_DEFAULT_VARIANTS.variant,\n}: KumoDropdownVariantsProps = {}) {\n return cn(KUMO_DROPDOWN_VARIANTS.variant[variant].classes);\n}\n\nconst DropdownMenuSubTrigger = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.SubmenuTrigger>,\n React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.SubmenuTrigger\n > & {\n inset?: boolean;\n icon?: Icon;\n }\n>(({ className, inset, children, icon: IconComponent, ...props }, ref) => (\n <DropdownMenuPrimitive.SubmenuTrigger\n ref={ref}\n className={cn(\n \"flex cursor-default items-center rounded-sm text-base outline-hidden select-none\", // base styles\n \"px-2 py-1.5\", // spacing\n \"focus:bg-kumo-tint\", // focus state\n \"data-[state=open]:bg-kumo-tint\", // open state\n inset && \"pl-8\", // conditional inset\n className,\n )}\n {...props}\n >\n {IconComponent && <IconComponent className=\"mr-2 h-4 w-4\" />}\n {children}\n <CaretRight className=\"ml-auto h-4 w-4\" />\n </DropdownMenuPrimitive.SubmenuTrigger>\n));\n\nDropdownMenuSubTrigger.displayName =\n DropdownMenuPrimitive.SubmenuTrigger.displayName;\n\nconst DropdownMenuContent = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Positioner>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Positioner>\n>(({ className, sideOffset = 8, children, ...props }, ref) => (\n <DropdownMenuPrimitive.Portal>\n <DropdownMenuPrimitive.Positioner\n ref={ref}\n sideOffset={sideOffset}\n {...props}\n >\n <DropdownMenuPrimitive.Popup\n className={cn(\n \"overflow-hidden bg-kumo-control text-kumo-default\", // background\n \"rounded-lg shadow-lg ring ring-kumo-line\", // border part\n \"min-w-36 p-1.5\", // spacing\n \"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\", // open animation\n \"data-[side=bottom]:slide-in-from-top-2\", // bottom side animation\n \"data-[side=left]:slide-in-from-right-2\", // left side animation\n \"data-[side=right]:slide-in-from-left-2\", // right side animation\n \"data-[side=top]:slide-in-from-bottom-2\", // top side animation\n \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\", // close animation\n className,\n )}\n >\n {children}\n </DropdownMenuPrimitive.Popup>\n </DropdownMenuPrimitive.Positioner>\n </DropdownMenuPrimitive.Portal>\n));\n\nconst renderIconNode = (IconComponent?: Icon | React.ReactNode) => {\n if (!IconComponent) return null;\n if (React.isValidElement(IconComponent)) return IconComponent;\n const Comp = IconComponent as React.ComponentType<Record<string, unknown>>;\n return <Comp className=\"mr-2 h-4 w-4\" />;\n};\n\nconst DropdownMenuItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n selected?: boolean;\n href?: string;\n variant?: \"default\" | \"danger\";\n }\n>(\n (\n {\n className,\n inset,\n icon: IconComponent,\n children,\n selected,\n render,\n href,\n variant = \"default\",\n ...props\n },\n ref,\n ) => {\n const LinkComponent = useLinkComponent();\n const content = React.useMemo(() => {\n const innerContent = (\n <>\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n {selected && (\n <span className=\"inline-flex\">\n <Check />\n </span>\n )}\n </>\n );\n\n if (!href) return innerContent;\n\n // Matches http://, https://, or protocol-relative //\n const isExternal = /^(https?:)?\\/\\//.test(href);\n const styles = cn(\n \"flex items-center\",\n variant === \"danger\" &&\n \"text-kumo-danger data-highlighted:bg-kumo-danger/5 data-highlighted:text-kumo-danger\",\n );\n if (isExternal) {\n return (\n <a\n className={cn(styles, \"w-full text-inherit! no-underline!\")}\n href={href}\n target=\"_blank\"\n rel=\"noreferrer\"\n /**\n * For some reason we need this here to prevent the outer link\n * from being clicked (thereby going to the worker details\n * instead of visiting the link)\n */\n onClick={(e) => e.stopPropagation()}\n >\n {innerContent}\n </a>\n );\n }\n return (\n <LinkComponent\n className={cn(styles, \"w-full text-inherit! no-underline!\")}\n href={href}\n to={href}\n /**\n * For some reason we need this here to prevent the outer link\n * from being clicked (thereby going to the worker details\n * instead of visiting the link)\n */\n onClick={(e) => e.stopPropagation()}\n >\n {innerContent}\n </LinkComponent>\n );\n }, [href, IconComponent, children, selected, variant, LinkComponent]);\n\n // When href is provided, content already contains children via innerContent\n // When render prop is provided, caller controls children rendering\n // Only pass children directly when neither href nor render is used\n const useRenderProp = href || render;\n\n return (\n <DropdownMenuPrimitive.Item\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none focus:text-kumo-default data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-overlay\",\n inset && \"pl-8\",\n dropdownVariants({ variant }),\n className,\n )}\n render={href ? content : render}\n {...props}\n >\n {useRenderProp ? undefined : children}\n </DropdownMenuPrimitive.Item>\n );\n },\n);\n\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\n\nconst DropdownMenuCheckboxItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n <DropdownMenuPrimitive.CheckboxItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-sm py-1.5 pr-2 pl-8 text-base outline-hidden transition-colors select-none focus:bg-kumo-tint focus:text-kumo-default data-disabled:pointer-events-none data-disabled:opacity-50\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-inherit\">\n <Checkbox checked={checked} />\n </span>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n));\nDropdownMenuCheckboxItem.displayName =\n DropdownMenuPrimitive.CheckboxItem.displayName;\n\nconst DropdownMenuLabel = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.GroupLabel>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.GroupLabel> & {\n inset?: boolean;\n }\n>(({ className, inset, ...props }, ref) => (\n <DropdownMenuPrimitive.GroupLabel\n ref={ref}\n className={cn(\n \"px-2 py-1.5 text-base font-semibold\",\n inset && \"pl-8\",\n className,\n )}\n {...props}\n />\n));\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.GroupLabel.displayName;\n\nconst DropdownMenuSeparator = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n <DropdownMenuPrimitive.Separator\n ref={ref}\n className={cn(\"-mx-1 my-1 h-px bg-kumo-line\", className)}\n {...props}\n />\n));\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;\n\nconst DropdownMenuShortcut = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n return (\n <span\n className={cn(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n {...props}\n />\n );\n};\nDropdownMenuShortcut.displayName = \"DropdownMenuShortcut\";\n\nconst DropdownMenuRadioItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem> & {\n inset?: boolean;\n icon?: Icon | React.ReactNode;\n }\n>(({ className, children, inset, icon: IconComponent, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioItem\n ref={ref}\n className={cn(\n \"relative flex cursor-default items-center rounded-md px-2 py-1.5 text-base outline-hidden select-none\",\n \"data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-kumo-tint\",\n inset && \"pl-8\",\n className,\n )}\n {...props}\n >\n {IconComponent && renderIconNode(IconComponent)}\n {children}\n </DropdownMenuPrimitive.RadioItem>\n));\nDropdownMenuRadioItem.displayName = \"DropdownMenuRadioItem\";\n\nconst DropdownMenuRadioItemIndicator = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioItemIndicator>,\n React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.RadioItemIndicator\n >\n>(({ className, children, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioItemIndicator\n ref={ref}\n className={cn(\"ml-auto\", className)}\n {...props}\n >\n {children ?? <Check className=\"h-4 w-4\" />}\n </DropdownMenuPrimitive.RadioItemIndicator>\n));\nDropdownMenuRadioItemIndicator.displayName = \"DropdownMenuRadioItemIndicator\";\n\n/**\n * Custom Trigger that converts a single child element to the `render` prop\n * to avoid nested button issues with base-ui's Menu.Trigger.\n */\nconst DropdownMenuTrigger = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Trigger>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger>\n>(({ children, render, ...props }, ref) => {\n // If render prop is provided, use it directly\n // Otherwise, convert single child element to render prop\n const childElement = React.isValidElement(children) ? children : null;\n const effectiveRender = render ?? childElement;\n\n return (\n <DropdownMenuPrimitive.Trigger\n ref={ref}\n {...props}\n {...(effectiveRender && {\n render: effectiveRender as React.ReactElement<Record<string, unknown>>,\n })}\n >\n {/* Only pass children if not using as render prop */}\n {childElement ? undefined : children}\n </DropdownMenuPrimitive.Trigger>\n );\n});\nDropdownMenuTrigger.displayName = \"DropdownMenuTrigger\";\n\n/**\n * DropdownMenu — accessible dropdown menu anchored to a trigger.\n *\n * Compound component: `DropdownMenu` (Root), `.Trigger`, `.Content`, `.Item`,\n * `.CheckboxItem`, `.RadioGroup`, `.RadioItem`, `.RadioItemIndicator`,\n * `.Sub`, `.SubTrigger`, `.SubContent`, `.Label`, `.Separator`, `.Shortcut`, `.Group`.\n *\n * Built on `@base-ui/react/menu`.\n *\n * @example\n * ```tsx\n * <DropdownMenu>\n * <DropdownMenu.Trigger>\n * <Button>Actions</Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n * <DropdownMenu.Item icon={CopyIcon}>Duplicate</DropdownMenu.Item>\n * <DropdownMenu.Separator />\n * <DropdownMenu.Item variant=\"danger\">Delete</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu>\n * ```\n *\n * @see https://base-ui.com/react/components/menu\n */\nexport const DropdownMenu = Object.assign(DropdownMenuPrimitive.Root, {\n Trigger: DropdownMenuTrigger,\n Portal: DropdownMenuPrimitive.Portal,\n Sub: DropdownMenuPrimitive.SubmenuRoot,\n SubTrigger: DropdownMenuSubTrigger,\n SubContent: DropdownMenuContent,\n Content: DropdownMenuContent,\n Item: DropdownMenuItem,\n CheckboxItem: DropdownMenuCheckboxItem,\n RadioGroup: DropdownMenuPrimitive.RadioGroup,\n RadioItem: DropdownMenuRadioItem,\n RadioItemIndicator: DropdownMenuRadioItemIndicator,\n Label: DropdownMenuLabel,\n Separator: DropdownMenuSeparator,\n Shortcut: DropdownMenuShortcut,\n Group: DropdownMenuPrimitive.Group,\n});\n"],"names":["KUMO_DROPDOWN_VARIANTS","KUMO_DROPDOWN_DEFAULT_VARIANTS","dropdownVariants","variant","cn","DropdownMenuSubTrigger","React","className","inset","children","IconComponent","props","ref","jsxs","DropdownMenuPrimitive.SubmenuTrigger","jsx","CaretRight","DropdownMenuContent","sideOffset","DropdownMenuPrimitive.Portal","DropdownMenuPrimitive.Positioner","DropdownMenuPrimitive.Popup","renderIconNode","DropdownMenuItem","selected","render","href","LinkComponent","useLinkComponent","content","innerContent","Fragment","Check","isExternal","styles","e","useRenderProp","DropdownMenuPrimitive.Item","DropdownMenuCheckboxItem","checked","DropdownMenuPrimitive.CheckboxItem","Checkbox","DropdownMenuLabel","DropdownMenuPrimitive.GroupLabel","DropdownMenuSeparator","DropdownMenuPrimitive.Separator","DropdownMenuShortcut","DropdownMenuRadioItem","DropdownMenuPrimitive.RadioItem","DropdownMenuRadioItemIndicator","DropdownMenuPrimitive.RadioItemIndicator","DropdownMenuTrigger","childElement","effectiveRender","DropdownMenuPrimitive.Trigger","DropdownMenu","DropdownMenuPrimitive.Root","DropdownMenuPrimitive.SubmenuRoot","DropdownMenuPrimitive.RadioGroup","DropdownMenuPrimitive.Group"],"mappings":"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"}
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import { jsxs as h, jsx as e } from "react/jsx-runtime";
3
3
  import { c as a } from "./cn-Bhsu1vx2.js";
4
- import { L as m } from "./label-ChZ2Pp5p.js";
5
- import { K as f, L as p, av as u, aw as x } from "./vendor-base-ui-CQ6wEonS.js";
4
+ import { L as m } from "./label-zjtV7oXa.js";
5
+ import { K as f, L as p, aI as u, aJ as x } from "./vendor-base-ui-9w7J6BvW.js";
6
6
  const g = {
7
7
  // Field currently has no variant options but structure is ready for future additions
8
8
  }, L = {};
@@ -68,4 +68,4 @@ export {
68
68
  L as a,
69
69
  d as f
70
70
  };
71
- //# sourceMappingURL=field-Dt-XuSaQ.js.map
71
+ //# sourceMappingURL=field-DCq04TgZ.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"field-Dt-XuSaQ.js","sources":["../src/components/field/field.tsx"],"sourcesContent":["import { Field as FieldBase } from \"@base-ui/react/field\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Label } from \"../label\";\n\n/** Field variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_FIELD_VARIANTS = {\n // Field currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_FIELD_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_FIELD_VARIANTS\nexport interface KumoFieldVariantsProps {\n /**\n * When true, places the control (checkbox/switch) before the label visually.\n * When false (default), places the label before the control.\n * Used to support different layout patterns (e.g., iOS-style toggles on the right).\n */\n controlFirst?: boolean;\n}\n\nexport function fieldVariants({\n controlFirst = false,\n}: KumoFieldVariantsProps = {}) {\n return cn(\n // Base styles - vertical layout (default)\n \"grid gap-2\",\n\n // Horizontal layout for checkbox and switch\n // Default: Grid auto-reverses in RTL (desired)\n \"has-[input[type=checkbox]]:grid-cols-[auto_1fr] has-[input[type=checkbox]]:items-center\",\n \"has-[[role=switch]]:grid-cols-[auto_1fr] has-[[role=switch]]:items-center\",\n\n // Control first: use flexbox with row-reverse to flip visual order without affecting text direction\n // flex-row-reverse in LTR: Control→Label, in RTL: Label→Control (opposite of grid default)\n controlFirst && [\n \"has-[input[type=checkbox]]:flex has-[input[type=checkbox]]:flex-row-reverse has-[input[type=checkbox]]:flex-wrap has-[input[type=checkbox]]:items-center\",\n \"has-[[role=switch]]:flex has-[[role=switch]]:flex-row-reverse has-[[role=switch]]:flex-wrap has-[[role=switch]]:items-center\",\n \"[&>label]:flex-1\",\n ],\n );\n}\n\n/**\n * Match type for field validation errors.\n * Can be a boolean or a key from the browser's ValidityState interface.\n * Source: BaseErrorProps[\"match\"] (ComponentPropsWithoutRef<typeof FieldBase.Error>)\n */\nexport type FieldErrorMatch =\n | boolean\n | \"badInput\"\n | \"customError\"\n | \"patternMismatch\"\n | \"rangeOverflow\"\n | \"rangeUnderflow\"\n | \"stepMismatch\"\n | \"tooLong\"\n | \"tooShort\"\n | \"typeMismatch\"\n | \"valid\"\n | \"valueMissing\";\n\n/**\n * Field component props — wraps a form control with label, description, and error message.\n *\n * @example\n * ```tsx\n * <Field label=\"Email\" required>\n * <Input placeholder=\"you@example.com\" />\n * </Field>\n *\n * <Field label=\"Phone\" required={false} description=\"We'll only use this for account recovery.\">\n * <Input placeholder=\"+1 555-0000\" />\n * </Field>\n * ```\n */\nexport interface FieldProps extends KumoFieldVariantsProps {\n /** The form control element(s) to wrap (Input, Select, Checkbox, etc.). */\n children: ReactNode;\n /** The label content — can be a string or any React node. */\n label: ReactNode;\n /**\n * When explicitly `false`, shows gray \"(optional)\" text after the label.\n * When `true` or `undefined`, no indicator is shown.\n */\n required?: boolean;\n /** Tooltip content displayed next to the label via an info icon. */\n labelTooltip?: ReactNode;\n /** Validation error with a message and a browser `ValidityState` match key. */\n error?: {\n message: ReactNode;\n match: FieldErrorMatch;\n };\n /** Helper text displayed below the control (hidden when `error` is present). */\n description?: ReactNode;\n /** When `true`, places the control before the label (for checkbox/switch layouts). */\n controlFirst?: boolean;\n}\n\n/**\n * Form field wrapper that provides a label, optional description, and error display\n * around any form control. Built on Base UI Field primitives.\n *\n * @example\n * ```tsx\n * <Field label=\"Username\">\n * <Input placeholder=\"Choose a username\" />\n * </Field>\n * ```\n */\nexport function Field({\n children,\n label,\n required,\n labelTooltip,\n error,\n description,\n controlFirst = false,\n}: FieldProps) {\n // Show \"(optional)\" when required is explicitly false\n const showOptional = required === false;\n\n return (\n <FieldBase.Root className={fieldVariants({ controlFirst })}>\n <FieldBase.Label className=\"text-base font-medium text-kumo-default\">\n <Label showOptional={showOptional} tooltip={labelTooltip} asContent>\n {label}\n </Label>\n </FieldBase.Label>\n {children}\n {error ? (\n <FieldBase.Error\n className={cn(\n \"text-sm text-kumo-danger\",\n // Span full width in horizontal layout\n \"col-span-full\",\n )}\n match={error.match}\n >\n {error.message}\n </FieldBase.Error>\n ) : (\n description && (\n <FieldBase.Description\n className={cn(\n \"text-sm leading-snug text-kumo-subtle\",\n // Span full width in horizontal layout\n \"col-span-full\",\n )}\n >\n {description}\n </FieldBase.Description>\n )\n )}\n </FieldBase.Root>\n );\n}\n"],"names":["KUMO_FIELD_VARIANTS","KUMO_FIELD_DEFAULT_VARIANTS","fieldVariants","controlFirst","cn","Field","children","label","required","labelTooltip","error","description","showOptional","jsxs","FieldBase.Root","jsx","FieldBase.Label","Label","FieldBase.Error","FieldBase.Description"],"mappings":";;;;;AAMO,MAAMA,IAAsB;AAAA;AAEnC,GAEaC,IAA8B,CAAA;AAYpC,SAASC,EAAc;AAAA,EAC5B,cAAAC,IAAe;AACjB,IAA4B,IAAI;AAC9B,SAAOC;AAAA;AAAA,IAEL;AAAA;AAAA;AAAA,IAIA;AAAA,IACA;AAAA;AAAA;AAAA,IAIAD,KAAgB;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;AAqEO,SAASE,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAR,IAAe;AACjB,GAAe;AAEb,QAAMS,IAAeJ,MAAa;AAElC,SACE,gBAAAK,EAACC,GAAA,EAAe,WAAWZ,EAAc,EAAE,cAAAC,EAAA,CAAc,GACvD,UAAA;AAAA,IAAA,gBAAAY,EAACC,GAAA,EAAgB,WAAU,2CACzB,UAAA,gBAAAD,EAACE,GAAA,EAAM,cAAAL,GAA4B,SAASH,GAAc,WAAS,IAChE,aACH,GACF;AAAA,IACCH;AAAA,IACAI,IACC,gBAAAK;AAAA,MAACG;AAAAA,MAAA;AAAA,QACC,WAAWd;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAEF,OAAOM,EAAM;AAAA,QAEZ,UAAAA,EAAM;AAAA,MAAA;AAAA,IAAA,IAGTC,KACE,gBAAAI;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,WAAWf;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAGD,UAAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GAGN;AAEJ;"}
1
+ {"version":3,"file":"field-DCq04TgZ.js","sources":["../src/components/field/field.tsx"],"sourcesContent":["import { Field as FieldBase } from \"@base-ui/react/field\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Label } from \"../label\";\n\n/** Field variant definitions (currently empty, reserved for future additions). */\nexport const KUMO_FIELD_VARIANTS = {\n // Field currently has no variant options but structure is ready for future additions\n} as const;\n\nexport const KUMO_FIELD_DEFAULT_VARIANTS = {} as const;\n\n// Derived types from KUMO_FIELD_VARIANTS\nexport interface KumoFieldVariantsProps {\n /**\n * When true, places the control (checkbox/switch) before the label visually.\n * When false (default), places the label before the control.\n * Used to support different layout patterns (e.g., iOS-style toggles on the right).\n */\n controlFirst?: boolean;\n}\n\nexport function fieldVariants({\n controlFirst = false,\n}: KumoFieldVariantsProps = {}) {\n return cn(\n // Base styles - vertical layout (default)\n \"grid gap-2\",\n\n // Horizontal layout for checkbox and switch\n // Default: Grid auto-reverses in RTL (desired)\n \"has-[input[type=checkbox]]:grid-cols-[auto_1fr] has-[input[type=checkbox]]:items-center\",\n \"has-[[role=switch]]:grid-cols-[auto_1fr] has-[[role=switch]]:items-center\",\n\n // Control first: use flexbox with row-reverse to flip visual order without affecting text direction\n // flex-row-reverse in LTR: Control→Label, in RTL: Label→Control (opposite of grid default)\n controlFirst && [\n \"has-[input[type=checkbox]]:flex has-[input[type=checkbox]]:flex-row-reverse has-[input[type=checkbox]]:flex-wrap has-[input[type=checkbox]]:items-center\",\n \"has-[[role=switch]]:flex has-[[role=switch]]:flex-row-reverse has-[[role=switch]]:flex-wrap has-[[role=switch]]:items-center\",\n \"[&>label]:flex-1\",\n ],\n );\n}\n\n/**\n * Match type for field validation errors.\n * Can be a boolean or a key from the browser's ValidityState interface.\n * Source: BaseErrorProps[\"match\"] (ComponentPropsWithoutRef<typeof FieldBase.Error>)\n */\nexport type FieldErrorMatch =\n | boolean\n | \"badInput\"\n | \"customError\"\n | \"patternMismatch\"\n | \"rangeOverflow\"\n | \"rangeUnderflow\"\n | \"stepMismatch\"\n | \"tooLong\"\n | \"tooShort\"\n | \"typeMismatch\"\n | \"valid\"\n | \"valueMissing\";\n\n/**\n * Field component props — wraps a form control with label, description, and error message.\n *\n * @example\n * ```tsx\n * <Field label=\"Email\" required>\n * <Input placeholder=\"you@example.com\" />\n * </Field>\n *\n * <Field label=\"Phone\" required={false} description=\"We'll only use this for account recovery.\">\n * <Input placeholder=\"+1 555-0000\" />\n * </Field>\n * ```\n */\nexport interface FieldProps extends KumoFieldVariantsProps {\n /** The form control element(s) to wrap (Input, Select, Checkbox, etc.). */\n children: ReactNode;\n /** The label content — can be a string or any React node. */\n label: ReactNode;\n /**\n * When explicitly `false`, shows gray \"(optional)\" text after the label.\n * When `true` or `undefined`, no indicator is shown.\n */\n required?: boolean;\n /** Tooltip content displayed next to the label via an info icon. */\n labelTooltip?: ReactNode;\n /** Validation error with a message and a browser `ValidityState` match key. */\n error?: {\n message: ReactNode;\n match: FieldErrorMatch;\n };\n /** Helper text displayed below the control (hidden when `error` is present). */\n description?: ReactNode;\n /** When `true`, places the control before the label (for checkbox/switch layouts). */\n controlFirst?: boolean;\n}\n\n/**\n * Form field wrapper that provides a label, optional description, and error display\n * around any form control. Built on Base UI Field primitives.\n *\n * @example\n * ```tsx\n * <Field label=\"Username\">\n * <Input placeholder=\"Choose a username\" />\n * </Field>\n * ```\n */\nexport function Field({\n children,\n label,\n required,\n labelTooltip,\n error,\n description,\n controlFirst = false,\n}: FieldProps) {\n // Show \"(optional)\" when required is explicitly false\n const showOptional = required === false;\n\n return (\n <FieldBase.Root className={fieldVariants({ controlFirst })}>\n <FieldBase.Label className=\"text-base font-medium text-kumo-default\">\n <Label showOptional={showOptional} tooltip={labelTooltip} asContent>\n {label}\n </Label>\n </FieldBase.Label>\n {children}\n {error ? (\n <FieldBase.Error\n className={cn(\n \"text-sm text-kumo-danger\",\n // Span full width in horizontal layout\n \"col-span-full\",\n )}\n match={error.match}\n >\n {error.message}\n </FieldBase.Error>\n ) : (\n description && (\n <FieldBase.Description\n className={cn(\n \"text-sm leading-snug text-kumo-subtle\",\n // Span full width in horizontal layout\n \"col-span-full\",\n )}\n >\n {description}\n </FieldBase.Description>\n )\n )}\n </FieldBase.Root>\n );\n}\n"],"names":["KUMO_FIELD_VARIANTS","KUMO_FIELD_DEFAULT_VARIANTS","fieldVariants","controlFirst","cn","Field","children","label","required","labelTooltip","error","description","showOptional","jsxs","FieldBase.Root","jsx","FieldBase.Label","Label","FieldBase.Error","FieldBase.Description"],"mappings":";;;;;AAMO,MAAMA,IAAsB;AAAA;AAEnC,GAEaC,IAA8B,CAAA;AAYpC,SAASC,EAAc;AAAA,EAC5B,cAAAC,IAAe;AACjB,IAA4B,IAAI;AAC9B,SAAOC;AAAA;AAAA,IAEL;AAAA;AAAA;AAAA,IAIA;AAAA,IACA;AAAA;AAAA;AAAA,IAIAD,KAAgB;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;AAqEO,SAASE,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAR,IAAe;AACjB,GAAe;AAEb,QAAMS,IAAeJ,MAAa;AAElC,SACE,gBAAAK,EAACC,GAAA,EAAe,WAAWZ,EAAc,EAAE,cAAAC,EAAA,CAAc,GACvD,UAAA;AAAA,IAAA,gBAAAY,EAACC,GAAA,EAAgB,WAAU,2CACzB,UAAA,gBAAAD,EAACE,GAAA,EAAM,cAAAL,GAA4B,SAASH,GAAc,WAAS,IAChE,aACH,GACF;AAAA,IACCH;AAAA,IACAI,IACC,gBAAAK;AAAA,MAACG;AAAAA,MAAA;AAAA,QACC,WAAWd;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAEF,OAAOM,EAAM;AAAA,QAEZ,UAAAA,EAAM;AAAA,MAAA;AAAA,IAAA,IAGTC,KACE,gBAAAI;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,WAAWf;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,QAAA;AAAA,QAGD,UAAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GAGN;AAEJ;"}
package/dist/index.js CHANGED
@@ -5,50 +5,51 @@ import { a as Y } from "./banner-4fkH6Sbt.js";
5
5
  import { B as n } from "./button-Bh96oxRL.js";
6
6
  import { L as aa, R as ea, b as oa } from "./button-Bh96oxRL.js";
7
7
  import { D as ta } from "./date-range-picker-CbKEQ9pi.js";
8
- import { C as ia } from "./checkbox-CWANiedi.js";
9
- import { C as na } from "./clipboard-text-B32_yb2r.js";
8
+ import { C as ia } from "./checkbox-Dt8iSNOg.js";
9
+ import { C as na } from "./clipboard-text-Bw5rKPXz.js";
10
10
  import { C as pa, a as fa } from "./code-T2wPDiM0.js";
11
- import { C as ca } from "./combobox-C9koouxM.js";
12
- import { a as N, D as O, c as U, e as A } from "./dialog-CpCeOqSZ.js";
13
- import { d as Ta, b as ua } from "./dialog-CpCeOqSZ.js";
14
- import { D as _a } from "./dropdown-DFeFcKfn.js";
11
+ import { C as ca } from "./combobox-BIC-YZ2L.js";
12
+ import { a as N, D as O, c as U, e as A } from "./dialog-toS9krNF.js";
13
+ import { d as Ta, b as ua } from "./dialog-toS9krNF.js";
14
+ import { D as _a } from "./dropdown-BquiYKKC.js";
15
15
  import { C as Ca } from "./collapsible-OBNkTO48.js";
16
- import { F as La, a as Ra, K as Ea, f as Sa } from "./field-Dt-XuSaQ.js";
17
- import { b as Na, K as Oa, L as Ua, a as ga, l as Da } from "./label-ChZ2Pp5p.js";
18
- import { I as g } from "./input-GZAWBXYX.js";
19
- import { i as Ka } from "./input-GZAWBXYX.js";
20
- import { I as va, T as ka } from "./input-area-CS1-ceY4.js";
21
- import { I as Pa } from "./input-group-COo-wz5O.js";
16
+ import { F as La, a as Ra, K as Ea, f as Sa } from "./field-DCq04TgZ.js";
17
+ import { b as Na, K as Oa, L as Ua, a as ga, l as Da } from "./label-zjtV7oXa.js";
18
+ import { I as g } from "./input-CCR8NGG7.js";
19
+ import { i as Ka } from "./input-CCR8NGG7.js";
20
+ import { I as ka, T as va } from "./input-area-DU2Yvp_t.js";
21
+ import { I as ya } from "./input-group-C365-qBq.js";
22
22
  import { L as Ba } from "./layer-card-C8j5Hkkj.js";
23
23
  import { L as za } from "./loader-DHGMYlC6.js";
24
24
  import { S as ja } from "./skeleton-line-CtpS1u1J.js";
25
- import { M as qa, u as Wa } from "./menubar-CbXWXQYR.js";
26
- import { M as Ha } from "./meter-Bu5f3mAc.js";
27
- import { P as Qa } from "./pagination-Cf-yRO-n.js";
28
- import { S as Za } from "./select-DvpgiOau.js";
25
+ import { M as qa, u as Wa } from "./menubar-D7WvAf6x.js";
26
+ import { M as Ha } from "./meter-jQGKS1z4.js";
27
+ import { P as Qa } from "./pagination-BN80iKY6.js";
28
+ import { S as Za } from "./select-G6JqBVkg.js";
29
29
  import { S as ee } from "./surface-BIC6CXiz.js";
30
- import { S as re } from "./switch-Tu34uFoa.js";
31
- import { T as se } from "./tabs-B7THfqHW.js";
32
- import { T as le } from "./table-DtUrZ2Rj.js";
30
+ import { S as re } from "./switch-CmsZ4z-g.js";
31
+ import { T as se } from "./tabs-BpD1iUiz.js";
32
+ import { T as le } from "./table-Dc0AGcLV.js";
33
33
  import { T as me } from "./text-BEhqwMfe.js";
34
- import { a as fe, T as de, u as ce } from "./toast-Du4y8qng.js";
35
- import { T as Te, a as ue } from "./tooltip-BxV1H6AV.js";
36
- import { g as _e, K as Ie, P as Ce } from "./popover-D7yeRosi.js";
37
- import { a as Le, K as Re, S as Ee } from "./sensitive-input-BuYT6U6C.js";
38
- import { b as he, K as Ne, R as Oe, a as Ue } from "./radio-CKn09bGo.js";
39
- import { C as De, a as Ve, K as Ke } from "./command-palette-TGXgr6Vq.js";
40
- import { a as ve, K as ke, L as ye, l as Pe } from "./link-Mj2WM1AS.js";
34
+ import { a as fe, T as de, u as ce } from "./toast-BrR0pjLE.js";
35
+ import { T as Te, a as ue } from "./tooltip-daVJYtXY.js";
36
+ import { g as _e, K as Ie, P as Ce } from "./popover-syU1104E.js";
37
+ import { a as Le, K as Re, S as Ee } from "./sensitive-input-DNFpycoy.js";
38
+ import { b as he, K as Ne, R as Oe, a as Ue } from "./radio-CWMtSx65.js";
39
+ import { C as De, a as Ve, K as Ke } from "./command-palette-D3MNR7w9.js";
40
+ import { a as ke, K as ve, L as Pe, l as ye } from "./link-C8pUZ4Q-.js";
41
41
  import { B as Be } from "./breadcrumbs-DyKi7BcP.js";
42
42
  import { E as ze } from "./empty-D03cbzRS.js";
43
43
  import { G as je, a as $e, c as qe, K as We, b as Xe, g as He } from "./grid-DKajRHh8.js";
44
44
  import { C as Qe, a as Ye, K as Ze, P as ao, g as eo } from "./cloudflare-logo-Dqd1VD9z.js";
45
+ import { D as ro } from "./date-picker-M6uNX5Ca.js";
45
46
  import { c as D } from "./cn-Bhsu1vx2.js";
46
- import { s as ro } from "./cn-Bhsu1vx2.js";
47
- import { L as so, u as io } from "./link-provider-DPBGo-0n.js";
47
+ import { s as so } from "./cn-Bhsu1vx2.js";
48
+ import { L as lo, u as no } from "./link-provider-DPBGo-0n.js";
48
49
  import { jsx as a, jsxs as e } from "react/jsx-runtime";
49
50
  import { useState as _, useEffect as V, useCallback as m } from "react";
50
- import { XIcon as K, WarningCircleIcon as M, CheckIcon as v, CopyIcon as k } from "@phosphor-icons/react";
51
- import { i as no } from "./vendor-base-ui-CQ6wEonS.js";
51
+ import { XIcon as K, WarningCircleIcon as M, CheckIcon as k, CopyIcon as v } from "@phosphor-icons/react";
52
+ import { i as po } from "./vendor-base-ui-9w7J6BvW.js";
52
53
  const W = {
53
54
  size: {
54
55
  sm: {
@@ -60,10 +61,10 @@ const W = {
60
61
  description: "Default delete confirmation dialog size"
61
62
  }
62
63
  }
63
- }, y = {
64
+ }, P = {
64
65
  size: "base"
65
66
  };
66
- function P({
67
+ function y({
67
68
  open: s,
68
69
  onOpenChange: I,
69
70
  resourceType: p,
@@ -72,7 +73,7 @@ function P({
72
73
  isDeleting: t = !1,
73
74
  caseSensitive: d = !0,
74
75
  deleteButtonText: C,
75
- size: b = y.size,
76
+ size: b = P.size,
76
77
  errorMessage: c,
77
78
  className: L
78
79
  }) {
@@ -137,14 +138,14 @@ function P({
137
138
  children: [
138
139
  o,
139
140
  R ? /* @__PURE__ */ a(
140
- v,
141
+ k,
141
142
  {
142
143
  size: 12,
143
144
  weight: "bold",
144
145
  className: "inline ml-1.5"
145
146
  }
146
147
  ) : /* @__PURE__ */ a(
147
- k,
148
+ v,
148
149
  {
149
150
  size: 12,
150
151
  weight: "bold",
@@ -194,7 +195,7 @@ function P({
194
195
  ] })
195
196
  ] }) });
196
197
  }
197
- P.displayName = "DeleteResource";
198
+ y.displayName = "DeleteResource";
198
199
  export {
199
200
  J as Badge,
200
201
  h as Banner,
@@ -209,8 +210,9 @@ export {
209
210
  Ca as Collapsible,
210
211
  ca as Combobox,
211
212
  De as CommandPalette,
213
+ ro as DatePicker,
212
214
  ta as DateRangePicker,
213
- P as DeleteResource,
215
+ y as DeleteResource,
214
216
  O as Dialog,
215
217
  A as DialogClose,
216
218
  Ta as DialogDescription,
@@ -223,13 +225,13 @@ export {
223
225
  je as Grid,
224
226
  $e as GridItem,
225
227
  g as Input,
226
- va as InputArea,
227
- Pa as InputGroup,
228
+ ka as InputArea,
229
+ ya as InputGroup,
228
230
  Ye as KUMO_CLOUDFLARE_LOGO_DEFAULT_VARIANTS,
229
231
  Ze as KUMO_CLOUDFLARE_LOGO_VARIANTS,
230
232
  Ve as KUMO_COMMAND_PALETTE_DEFAULT_VARIANTS,
231
233
  Ke as KUMO_COMMAND_PALETTE_VARIANTS,
232
- y as KUMO_DELETE_RESOURCE_DEFAULT_VARIANTS,
234
+ P as KUMO_DELETE_RESOURCE_DEFAULT_VARIANTS,
233
235
  W as KUMO_DELETE_RESOURCE_VARIANTS,
234
236
  Ra as KUMO_FIELD_DEFAULT_VARIANTS,
235
237
  Ea as KUMO_FIELD_VARIANTS,
@@ -237,8 +239,8 @@ export {
237
239
  We as KUMO_GRID_VARIANTS,
238
240
  Na as KUMO_LABEL_DEFAULT_VARIANTS,
239
241
  Oa as KUMO_LABEL_VARIANTS,
240
- ve as KUMO_LINK_DEFAULT_VARIANTS,
241
- ke as KUMO_LINK_VARIANTS,
242
+ ke as KUMO_LINK_DEFAULT_VARIANTS,
243
+ ve as KUMO_LINK_VARIANTS,
242
244
  _e as KUMO_POPOVER_DEFAULT_VARIANTS,
243
245
  Ie as KUMO_POPOVER_VARIANTS,
244
246
  he as KUMO_RADIO_DEFAULT_VARIANTS,
@@ -247,9 +249,9 @@ export {
247
249
  Re as KUMO_SENSITIVE_INPUT_VARIANTS,
248
250
  Ua as Label,
249
251
  Ba as LayerCard,
250
- ye as Link,
252
+ Pe as Link,
251
253
  aa as LinkButton,
252
- so as LinkProvider,
254
+ lo as LinkProvider,
253
255
  za as Loader,
254
256
  qa as MenuBar,
255
257
  Ha as Meter,
@@ -267,8 +269,8 @@ export {
267
269
  le as Table,
268
270
  se as Tabs,
269
271
  me as Text,
270
- ka as Textarea,
271
- no as Toast,
272
+ va as Textarea,
273
+ po as Toast,
272
274
  fe as ToastProvider,
273
275
  de as Toasty,
274
276
  Te as Tooltip,
@@ -282,10 +284,10 @@ export {
282
284
  Ka as inputVariants,
283
285
  ga as labelContentVariants,
284
286
  Da as labelVariants,
285
- Pe as linkVariants,
286
- ro as safeRandomId,
287
+ ye as linkVariants,
288
+ so as safeRandomId,
287
289
  ce as useKumoToastManager,
288
- io as useLinkComponent,
290
+ no as useLinkComponent,
289
291
  Wa as useMenuNavigation
290
292
  };
291
293
  //# sourceMappingURL=index.js.map