@devalok/shilp-sutra 0.44.1 → 0.45.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 (131) hide show
  1. package/AGENTS.md +13 -11
  2. package/BREAKING.json +209 -27
  3. package/MIGRATION.md +34 -0
  4. package/README.md +12 -0
  5. package/dist/_chunks/badge-group.js +1 -0
  6. package/dist/_chunks/badge-group.js.map +1 -1
  7. package/dist/_chunks/block-shell.js +25 -0
  8. package/dist/_chunks/block-shell.js.map +1 -0
  9. package/dist/_chunks/chat.js +4 -2
  10. package/dist/_chunks/chat.js.map +1 -1
  11. package/dist/_chunks/document-preview.js +1 -1
  12. package/dist/_chunks/image-preview.js +4 -4
  13. package/dist/_chunks/shared.js +65 -78
  14. package/dist/_chunks/shared.js.map +1 -1
  15. package/dist/_chunks/success.js +108 -106
  16. package/dist/_chunks/success.js.map +1 -1
  17. package/dist/ai/blocks/block-shell.d.ts +19 -0
  18. package/dist/ai/blocks/block-shell.d.ts.map +1 -0
  19. package/dist/ai/blocks/block-table.d.ts.map +1 -1
  20. package/dist/ai/blocks/confirm.d.ts.map +1 -1
  21. package/dist/ai/blocks/error.d.ts.map +1 -1
  22. package/dist/ai/blocks/error.js +5 -5
  23. package/dist/ai/blocks/error.js.map +1 -1
  24. package/dist/ai/blocks/success.d.ts.map +1 -1
  25. package/dist/ai/blocks/text.d.ts.map +1 -1
  26. package/dist/ai/blocks/text.js +4 -3
  27. package/dist/ai/blocks/text.js.map +1 -1
  28. package/dist/composed/activity-feed.d.ts.map +1 -1
  29. package/dist/composed/activity-feed.js +14 -12
  30. package/dist/composed/activity-feed.js.map +1 -1
  31. package/dist/composed/file-preview/audio-preview.d.ts.map +1 -1
  32. package/dist/composed/file-preview/shared.d.ts +10 -0
  33. package/dist/composed/file-preview/shared.d.ts.map +1 -1
  34. package/dist/composed/file-preview/video-preview.d.ts.map +1 -1
  35. package/dist/composed/file-preview.js +149 -188
  36. package/dist/composed/file-preview.js.map +1 -1
  37. package/dist/composed/master-detail.d.ts.map +1 -1
  38. package/dist/composed/master-detail.js +13 -4
  39. package/dist/composed/master-detail.js.map +1 -1
  40. package/dist/composed/schedule-view.d.ts.map +1 -1
  41. package/dist/composed/schedule-view.js +52 -39
  42. package/dist/composed/schedule-view.js.map +1 -1
  43. package/dist/shell/notification-preferences.d.ts.map +1 -1
  44. package/dist/shell/notification-preferences.js +115 -114
  45. package/dist/shell/notification-preferences.js.map +1 -1
  46. package/dist/ui/badge-group.d.ts.map +1 -1
  47. package/dist/ui/card.d.ts +66 -16
  48. package/dist/ui/card.d.ts.map +1 -1
  49. package/dist/ui/card.js +85 -60
  50. package/dist/ui/card.js.map +1 -1
  51. package/dist/ui/chat/message.d.ts.map +1 -1
  52. package/dist/ui/color-input.d.ts.map +1 -1
  53. package/dist/ui/color-input.js +18 -18
  54. package/dist/ui/color-input.js.map +1 -1
  55. package/dist/ui/data-table-body.d.ts.map +1 -1
  56. package/dist/ui/data-table-body.js +94 -64
  57. package/dist/ui/data-table-body.js.map +1 -1
  58. package/dist/ui/data-table-card.d.ts.map +1 -1
  59. package/dist/ui/data-table-card.js +50 -43
  60. package/dist/ui/data-table-card.js.map +1 -1
  61. package/dist/ui/data-table-context.d.ts +0 -4
  62. package/dist/ui/data-table-context.d.ts.map +1 -1
  63. package/dist/ui/data-table-context.js +8 -12
  64. package/dist/ui/data-table-context.js.map +1 -1
  65. package/dist/ui/data-table-header.d.ts.map +1 -1
  66. package/dist/ui/data-table-header.js +2 -2
  67. package/dist/ui/data-table-header.js.map +1 -1
  68. package/dist/ui/data-table.d.ts.map +1 -1
  69. package/dist/ui/data-table.js +185 -182
  70. package/dist/ui/data-table.js.map +1 -1
  71. package/dist/ui/index.d.ts +3 -2
  72. package/dist/ui/index.d.ts.map +1 -1
  73. package/dist/ui/index.js +59 -58
  74. package/dist/ui/index.js.map +1 -1
  75. package/dist/ui/segmented-control.js +4 -4
  76. package/dist/ui/segmented-control.js.map +1 -1
  77. package/dist/ui/separator.d.ts +6 -5
  78. package/dist/ui/separator.d.ts.map +1 -1
  79. package/dist/ui/separator.js +7 -10
  80. package/dist/ui/separator.js.map +1 -1
  81. package/dist/ui/split-button.d.ts.map +1 -1
  82. package/dist/ui/split-button.js +62 -129
  83. package/dist/ui/split-button.js.map +1 -1
  84. package/dist/ui/stat-card.d.ts +7 -0
  85. package/dist/ui/stat-card.d.ts.map +1 -1
  86. package/dist/ui/stat-card.js +144 -126
  87. package/dist/ui/stat-card.js.map +1 -1
  88. package/dist/ui/table-row-link.d.ts +45 -0
  89. package/dist/ui/table-row-link.d.ts.map +1 -0
  90. package/dist/ui/table-row-link.js +16 -0
  91. package/dist/ui/table-row-link.js.map +1 -0
  92. package/dist/ui/table.d.ts +49 -5
  93. package/dist/ui/table.d.ts.map +1 -1
  94. package/dist/ui/table.js +39 -29
  95. package/dist/ui/table.js.map +1 -1
  96. package/dist/ui/toast-types.d.ts +10 -0
  97. package/dist/ui/toast-types.d.ts.map +1 -1
  98. package/dist/ui/toast.d.ts +6 -2
  99. package/dist/ui/toast.d.ts.map +1 -1
  100. package/dist/ui/toast.js +56 -54
  101. package/dist/ui/toast.js.map +1 -1
  102. package/docs/components/composed/content-card.md +2 -0
  103. package/docs/components/ui/button.md +3 -3
  104. package/docs/components/ui/card.md +27 -10
  105. package/docs/components/ui/color-input.md +2 -2
  106. package/docs/components/ui/data-table.md +8 -1
  107. package/docs/components/ui/segmented-control.md +2 -2
  108. package/docs/components/ui/separator.md +3 -1
  109. package/docs/components/ui/split-button.md +3 -0
  110. package/docs/components/ui/stat-card.md +10 -2
  111. package/docs/components/ui/table-row-link.md +41 -0
  112. package/docs/components/ui/table.md +69 -0
  113. package/docs/components/ui/toast.md +10 -6
  114. package/docs/recipes/install-next-app-router.md +1 -1
  115. package/docs/recipes/troubleshoot.md +1 -1
  116. package/llms.txt +159 -781
  117. package/make-kit/components/card.md +54 -16
  118. package/make-kit/components/table.md +45 -7
  119. package/make-kit/foundations/spacing.md +3 -1
  120. package/make-kit/foundations/surfaces.md +1 -1
  121. package/mcp-manifest.json +12349 -0
  122. package/mcp-manifest.schema.json +232 -0
  123. package/package.json +3 -3
  124. package/skill/README.md +0 -1
  125. package/skill/SKILL.md +9 -8
  126. package/skill/references/components.md +159 -781
  127. package/skill/references/setup-next-app-router.md +1 -1
  128. package/skill/references/troubleshoot.md +1 -1
  129. package/llms-full.txt +0 -7198
  130. package/llms-quick.txt +0 -251
  131. package/skill/references/components-full.md +0 -7200
@@ -4,16 +4,13 @@ import { cn as t } from "./lib/utils.js";
4
4
  import * as n from "react";
5
5
  import { jsx as r } from "react/jsx-runtime";
6
6
  //#region src/ui/separator.tsx
7
- var i = n.forwardRef(({ className: n, orientation: i = "horizontal", decorative: a = !0, variant: o = "default", ...s }, c) => {
8
- let l = i === "horizontal" ? "90deg" : "180deg";
9
- return /* @__PURE__ */ r(e, {
10
- ref: c,
11
- decorative: a,
12
- orientation: i,
13
- className: t("shrink-0", o === "gradient" ? `bg-transparent bg-[image:linear-gradient(${l},transparent,var(--color-surface-border)_15%,var(--color-surface-border)_85%,transparent)]` : o === "gradient-left" ? `bg-transparent bg-[image:linear-gradient(${l},transparent,var(--color-surface-border)_30%)]` : o === "gradient-right" ? `bg-transparent bg-[image:linear-gradient(${l},var(--color-surface-border)_70%,transparent)]` : "bg-surface-border", i === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]", n),
14
- ...s
15
- });
16
- });
7
+ var i = n.forwardRef(({ className: n, orientation: i = "horizontal", decorative: a = !0, variant: o, ...s }, c) => /* @__PURE__ */ r(e, {
8
+ ref: c,
9
+ decorative: a,
10
+ orientation: i,
11
+ className: t("shrink-0 bg-surface-border", i === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]", n),
12
+ ...s
13
+ }));
17
14
  i.displayName = e.displayName;
18
15
  //#endregion
19
16
  export { i as Separator };
@@ -1 +1 @@
1
- {"version":3,"file":"separator.js","names":[],"sources":["../../src/ui/separator.tsx"],"sourcesContent":["'use client'\n\nimport * as SeparatorPrimitive from '@primitives/react-separator'\nimport * as React from 'react'\n\nimport { cn } from './lib/utils'\n\nexport interface SeparatorProps\n extends React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root> {\n /** Visual variant:\n * - `default` solid line\n * - `gradient` fades at both edges\n * - `gradient-left`fades on the left, solid on the right\n * - `gradient-right` fades on the right, solid on the left\n */\n variant?: 'default' | 'gradient' | 'gradient-left' | 'gradient-right'\n}\n\nconst Separator = React.forwardRef<\n React.ElementRef<typeof SeparatorPrimitive.Root>,\n SeparatorProps\n>(\n (\n { className, orientation = 'horizontal', decorative = true, variant = 'default', ...props },\n ref,\n ) => {\n // Gradient direction: 90deg (left→right) for horizontal, 180deg (top→bottom) for vertical\n const deg = orientation === 'horizontal' ? '90deg' : '180deg'\n\n return (\n <SeparatorPrimitive.Root\n ref={ref}\n decorative={decorative}\n orientation={orientation}\n className={cn(\n 'shrink-0',\n variant === 'gradient'\n ? `bg-transparent bg-[image:linear-gradient(${deg},transparent,var(--color-surface-border)_15%,var(--color-surface-border)_85%,transparent)]`\n : variant === 'gradient-left'\n ? `bg-transparent bg-[image:linear-gradient(${deg},transparent,var(--color-surface-border)_30%)]`\n : variant === 'gradient-right'\n ? `bg-transparent bg-[image:linear-gradient(${deg},var(--color-surface-border)_70%,transparent)]`\n : 'bg-surface-border',\n orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',\n className,\n )}\n {...props}\n />\n )\n },\n)\nSeparator.displayName = SeparatorPrimitive.Root.displayName\n\nexport { Separator }\n"],"mappings":";;;;;;AAkBA,IAAM,IAAY,EAAM,YAKpB,EAAE,cAAW,iBAAc,cAAc,gBAAa,IAAM,aAAU,WAAW,GAAG,KACpF,MACG;CAEH,IAAM,IAAM,MAAgB,eAAe,UAAU;AAErD,QACE,kBAAC,GAAD;EACO;EACO;EACC;EACb,WAAW,EACT,YACA,MAAY,aACR,4CAA4C,EAAI,8FAChD,MAAY,kBACV,4CAA4C,EAAI,kDAChD,MAAY,mBACV,4CAA4C,EAAI,kDAChD,qBACR,MAAgB,eAAe,mBAAmB,kBAClD,EACD;EACD,GAAI;EACJ,CAAA;EAGP;AACD,EAAU,cAAA,EAAsC"}
1
+ {"version":3,"file":"separator.js","names":[],"sources":["../../src/ui/separator.tsx"],"sourcesContent":["'use client'\n\nimport * as SeparatorPrimitive from '@primitives/react-separator'\nimport * as React from 'react'\n\nimport { cn } from './lib/utils'\n\nexport interface SeparatorProps\n extends React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root> {\n /**\n * @deprecated Separator is always a solid hairline. The `gradient` /\n * `gradient-left` / `gradient-right` variants were decorative (and never\n * rendered in production the interpolated class couldn't be emitted by the\n * Tailwind 4 scanner). They now render solid; the `variant` prop is removed in\n * 0.45.0.\n */\n variant?: 'default' | 'gradient' | 'gradient-left' | 'gradient-right'\n}\n\nconst Separator = React.forwardRef<\n React.ElementRef<typeof SeparatorPrimitive.Root>,\n SeparatorProps\n>(\n (\n // `variant` accepted for back-compat but no longer rendered (see @deprecated above).\n { className, orientation = 'horizontal', decorative = true, variant: _variant, ...props },\n ref,\n ) => {\n return (\n <SeparatorPrimitive.Root\n ref={ref}\n decorative={decorative}\n orientation={orientation}\n className={cn(\n 'shrink-0 bg-surface-border',\n orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',\n className,\n )}\n {...props}\n />\n )\n },\n)\nSeparator.displayName = SeparatorPrimitive.Root.displayName\n\nexport { Separator }\n"],"mappings":";;;;;;AAmBA,IAAM,IAAY,EAAM,YAMpB,EAAE,cAAW,iBAAc,cAAc,gBAAa,IAAM,SAAS,GAAU,GAAG,KAClF,MAGE,kBAAC,GAAD;CACO;CACO;CACC;CACb,WAAW,EACT,8BACA,MAAgB,eAAe,mBAAmB,kBAClD,EACD;CACD,GAAI;CACJ,CAAA,CAGP;AACD,EAAU,cAAA,EAAsC"}
@@ -1 +1 @@
1
- {"version":3,"file":"split-button.d.ts","sourceRoot":"","sources":["../../src/ui/split-button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA6C,KAAK,SAAS,EAAQ,MAAM,kBAAkB,CAAA;AAClG,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAE5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAMzC,KAAK,kBAAkB,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAA;AACtD,KAAK,gBAAgB,GAAG,WAAW,CAAC,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,CAAA;AACjF,KAAK,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAA;AAE7E,MAAM,WAAW,gBAAgB;IAC/B,0CAA0C;IAC1C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,yCAAyC;IACzC,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;IACzD,2DAA2D;IAC3D,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACjC,6BAA6B;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,+DAA+D;IAC/D,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC,uBAAuB;IACvB,OAAO,CAAC,EAAE,kBAAkB,CAAA;IAC5B,wBAAwB;IACxB,KAAK,CAAC,EAAE,gBAAgB,CAAA;IACxB,oBAAoB;IACpB,IAAI,CAAC,EAAE,eAAe,CAAA;IACtB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,mEAAmE;IACnE,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,sEAAsE;IACtE,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,gEAAgE;IAChE,WAAW,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC9B,qEAAqE;IACrE,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,2DAA2D;IAC3D,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AA2FD,QAAA,MAAM,WAAW,yFAwNhB,CAAA;AAID,OAAO,EAAE,WAAW,EAAE,CAAA;AACtB,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAC,kBAAkB,EAAE,CAAA"}
1
+ {"version":3,"file":"split-button.d.ts","sourceRoot":"","sources":["../../src/ui/split-button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAMzC,KAAK,kBAAkB,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAA;AACtD,KAAK,gBAAgB,GAAG,WAAW,CAAC,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,CAAA;AACjF,KAAK,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAA;AAE7E,MAAM,WAAW,gBAAgB;IAC/B,0CAA0C;IAC1C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,yCAAyC;IACzC,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;IACzD,2DAA2D;IAC3D,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACjC,6BAA6B;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,+DAA+D;IAC/D,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC,uBAAuB;IACvB,OAAO,CAAC,EAAE,kBAAkB,CAAA;IAC5B,wBAAwB;IACxB,KAAK,CAAC,EAAE,gBAAgB,CAAA;IACxB,oBAAoB;IACpB,IAAI,CAAC,EAAE,eAAe,CAAA;IACtB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,mEAAmE;IACnE,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,sEAAsE;IACtE,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,gEAAgE;IAChE,WAAW,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC9B,qEAAqE;IACrE,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,2DAA2D;IAC3D,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AA2FD,QAAA,MAAM,WAAW,yFAuIhB,CAAA;AAID,OAAO,EAAE,WAAW,EAAE,CAAA;AACtB,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAC,kBAAkB,EAAE,CAAA"}
@@ -1,12 +1,10 @@
1
1
  "use client";
2
- import { cn as e, ln as t, mn as n, pn as r, un as i } from "../_chunks/primitives.js";
3
- import { durations as a } from "./lib/motion.js";
4
- import { cn as o } from "./lib/utils.js";
5
- import * as s from "react";
6
- import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
7
- import { AnimatePresence as d, motion as f } from "framer-motion";
2
+ import { cn as e } from "./lib/utils.js";
3
+ import { i as t, r as n, t as r } from "../_chunks/popover.js";
4
+ import * as i from "react";
5
+ import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
8
6
  //#region src/ui/split-button.tsx
9
- var p = {
7
+ var c = {
10
8
  solid: {
11
9
  accent: "bg-accent-11/20",
12
10
  error: "bg-error-11/20",
@@ -28,35 +26,35 @@ var p = {
28
26
  warning: "bg-warning-7",
29
27
  neutral: "bg-surface-border-strong"
30
28
  }
31
- }, m = {
29
+ }, l = {
32
30
  xs: "h-ds-xs-plus",
33
31
  sm: "h-ds-sm",
34
32
  md: "h-ds-md",
35
33
  "icon-xs": "h-ds-xs-plus",
36
34
  "icon-sm": "h-ds-sm",
37
35
  "icon-md": "h-ds-md"
38
- }, h = {
36
+ }, u = {
39
37
  xs: "text-ds-sm",
40
38
  sm: "text-ds-sm",
41
39
  md: "text-ds-md",
42
40
  "icon-xs": "text-ds-sm",
43
41
  "icon-sm": "text-ds-sm",
44
42
  "icon-md": "text-ds-md"
45
- }, g = {
43
+ }, d = {
46
44
  xs: "px-ds-03 gap-1",
47
45
  sm: "px-ds-04 gap-1.5",
48
46
  md: "px-ds-05 gap-2",
49
47
  "icon-xs": "px-ds-02",
50
48
  "icon-sm": "px-ds-03",
51
49
  "icon-md": "px-ds-04"
52
- }, _ = {
50
+ }, f = {
53
51
  xs: "px-ds-02",
54
52
  sm: "px-ds-02",
55
53
  md: "px-ds-03",
56
54
  "icon-xs": "px-ds-01",
57
55
  "icon-sm": "px-ds-02",
58
56
  "icon-md": "px-ds-02"
59
- }, v = {
57
+ }, p = {
60
58
  xs: "rounded-control",
61
59
  sm: "rounded-control",
62
60
  md: "rounded-control",
@@ -64,7 +62,7 @@ var p = {
64
62
  "icon-sm": "rounded-control",
65
63
  "icon-md": "rounded-control"
66
64
  };
67
- function y(e, t) {
65
+ function m(e, t) {
68
66
  let n = {
69
67
  solid: {
70
68
  accent: "bg-accent-9 text-accent-fg hover:bg-accent-10 active:bg-accent-11",
@@ -90,7 +88,7 @@ function y(e, t) {
90
88
  };
91
89
  return n[e][t] ?? n[e].accent;
92
90
  }
93
- function b(e) {
91
+ function h(e) {
94
92
  let t = {
95
93
  accent: "border-accent-7",
96
94
  error: "border-error-7",
@@ -100,15 +98,15 @@ function b(e) {
100
98
  };
101
99
  return t[e] ?? t.accent;
102
100
  }
103
- function x({ className: e }) {
104
- return /* @__PURE__ */ l("svg", {
101
+ function g({ className: e }) {
102
+ return /* @__PURE__ */ o("svg", {
105
103
  width: "12",
106
104
  height: "12",
107
105
  viewBox: "0 0 12 12",
108
106
  fill: "none",
109
107
  className: e,
110
108
  "aria-hidden": "true",
111
- children: /* @__PURE__ */ l("path", {
109
+ children: /* @__PURE__ */ o("path", {
112
110
  d: "M3 4.5L6 7.5L9 4.5",
113
111
  stroke: "currentColor",
114
112
  strokeWidth: "1.5",
@@ -117,118 +115,53 @@ function x({ className: e }) {
117
115
  })
118
116
  });
119
117
  }
120
- var S = s.forwardRef(function({ children: S, onClick: C, dropdownContent: w, open: T, onOpenChange: E, variant: D = "solid", color: O = "accent", size: k = "md", disabled: A = !1, "aria-label": j, dropdownLabel: M = "More options", dropdownIcon: N, triggerSide: P = "right", placement: F = "top-end", triggerWidth: I, className: L }, R) {
121
- let [z, B] = s.useState(!1), V = T !== void 0, H = V ? T : z, U = s.useRef(null), W = s.useRef(null), G = s.useId(), K = s.useCallback((e) => {
122
- E && E(e), V || B(e);
123
- }, [E, V]);
124
- s.useEffect(() => {
125
- if (!H || !U.current || !W.current) return;
126
- let a = U.current, o = W.current;
127
- return e(a, o, () => {
128
- t(a, o, {
129
- placement: F,
130
- middleware: [
131
- r(8),
132
- i({ fallbackPlacements: [
133
- "bottom-end",
134
- "top-start",
135
- "bottom-start"
136
- ] }),
137
- n({ padding: 8 })
138
- ]
139
- }).then(({ x: e, y: t }) => {
140
- Object.assign(o.style, {
141
- left: `${e}px`,
142
- top: `${t}px`
143
- });
144
- });
145
- });
146
- }, [H, F]), s.useEffect(() => {
147
- if (!H) return;
148
- let e = (e) => {
149
- let t = e.target;
150
- U.current?.contains(t) || W.current?.contains(t) || K(!1);
151
- };
152
- return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
153
- }, [H, K]), s.useEffect(() => {
154
- if (!H) return;
155
- let e = (e) => {
156
- e.key === "Escape" && K(!1);
157
- };
158
- return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
159
- }, [H, K]);
160
- let q = y(D, O), J = p[D][O] ?? p[D].accent, Y = I == null ? void 0 : { width: typeof I == "number" ? `${I}px` : I };
161
- return /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l("div", {
162
- ref: R,
163
- role: "group",
164
- "aria-label": j ?? void 0,
165
- className: o("relative inline-flex", L),
166
- children: /* @__PURE__ */ u("div", {
167
- ref: U,
168
- className: o("inline-flex items-stretch overflow-hidden", v[k], D === "solid" && "shadow-raised", D === "outline" && `border ${b(O)}`),
169
- children: [
170
- P === "left" && /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l("button", {
171
- type: "button",
172
- onClick: () => K(!H),
173
- disabled: A,
174
- "aria-label": M,
175
- "aria-haspopup": "menu",
176
- "aria-expanded": H,
177
- "aria-controls": H ? G : void 0,
178
- className: o("inline-flex items-center justify-center select-none", "transition-colors duration-fast-01 ease-productive-standard", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset", "disabled:pointer-events-none disabled:opacity-action-disabled", q, m[k], _[k]),
179
- style: Y,
180
- children: N ?? /* @__PURE__ */ l(x, {})
181
- }), /* @__PURE__ */ l("div", { className: o("w-px self-stretch", J) })] }),
182
- /* @__PURE__ */ l("button", {
183
- type: "button",
184
- onClick: C,
185
- disabled: A,
186
- "aria-label": j,
187
- className: o("inline-flex items-center justify-center font-semibold select-none whitespace-nowrap", "transition-[colors,transform] duration-fast-01 ease-productive-standard", "active:scale-[0.97]", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset", "disabled:pointer-events-none disabled:opacity-action-disabled", q, m[k], h[k], g[k]),
188
- children: S
189
- }),
190
- P === "right" && /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l("div", { className: o("w-px self-stretch", J) }), /* @__PURE__ */ l("button", {
191
- type: "button",
192
- onClick: () => K(!H),
193
- disabled: A,
194
- "aria-label": M,
195
- "aria-haspopup": "menu",
196
- "aria-expanded": H,
197
- "aria-controls": H ? G : void 0,
198
- className: o("inline-flex items-center justify-center select-none", "transition-colors duration-fast-01 ease-productive-standard", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset", "disabled:pointer-events-none disabled:opacity-action-disabled", q, m[k], _[k]),
199
- style: Y,
200
- children: N ?? /* @__PURE__ */ l(x, {})
201
- })] })
202
- ]
203
- })
204
- }), /* @__PURE__ */ l(d, { children: H && w && /* @__PURE__ */ l("div", {
205
- ref: W,
206
- id: G,
207
- role: "menu",
208
- className: "fixed z-popover",
209
- style: {
210
- top: 0,
211
- left: 0
212
- },
213
- children: /* @__PURE__ */ l(f.div, {
214
- initial: {
215
- opacity: 0,
216
- scale: .95
217
- },
218
- animate: {
219
- opacity: 1,
220
- scale: 1
221
- },
222
- exit: {
223
- opacity: 0,
224
- scale: .95
225
- },
226
- transition: { duration: a.moderate01 },
227
- className: "rounded-overlay bg-surface-overlay shadow-floating",
228
- children: w
118
+ var _ = i.forwardRef(function({ children: _, onClick: v, dropdownContent: y, open: b, onOpenChange: x, variant: S = "solid", color: C = "accent", size: w = "md", disabled: T = !1, "aria-label": E, dropdownLabel: D = "More options", dropdownIcon: O, triggerSide: k = "right", placement: A = "top-end", triggerWidth: j, className: M }, N) {
119
+ let [P, F] = i.useMemo(() => {
120
+ let [e, t] = A.split("-");
121
+ return [e, t === "start" ? "start" : t === "end" ? "end" : "center"];
122
+ }, [A]), I = m(S, C), L = c[S][C] ?? c[S].accent, R = j == null ? void 0 : { width: typeof j == "number" ? `${j}px` : j }, z = /* @__PURE__ */ o(t, {
123
+ asChild: !0,
124
+ children: /* @__PURE__ */ o("button", {
125
+ type: "button",
126
+ disabled: T,
127
+ "aria-label": D,
128
+ className: e("inline-flex items-center justify-center select-none", "transition-colors duration-fast-01 ease-productive-standard", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset", "disabled:pointer-events-none disabled:opacity-action-disabled", I, l[w], f[w]),
129
+ style: R,
130
+ children: O ?? /* @__PURE__ */ o(g, {})
229
131
  })
230
- }) })] });
132
+ });
133
+ return /* @__PURE__ */ s(r, {
134
+ open: b,
135
+ onOpenChange: x,
136
+ children: [/* @__PURE__ */ o("div", {
137
+ ref: N,
138
+ role: "group",
139
+ "aria-label": E ?? void 0,
140
+ className: e("relative inline-flex", M),
141
+ children: /* @__PURE__ */ s("div", {
142
+ className: e("inline-flex items-stretch overflow-hidden", p[w], S === "solid" && "shadow-raised", S === "outline" && `border ${h(C)}`),
143
+ children: [
144
+ k === "left" && /* @__PURE__ */ s(a, { children: [z, /* @__PURE__ */ o("div", { className: e("w-px self-stretch", L) })] }),
145
+ /* @__PURE__ */ o("button", {
146
+ type: "button",
147
+ onClick: v,
148
+ disabled: T,
149
+ "aria-label": E,
150
+ className: e("inline-flex items-center justify-center font-semibold select-none whitespace-nowrap", "transition-[colors,transform] duration-fast-01 ease-productive-standard", "active:scale-[0.97]", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset", "disabled:pointer-events-none disabled:opacity-action-disabled", I, l[w], u[w], d[w]),
151
+ children: _
152
+ }),
153
+ k === "right" && /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("div", { className: e("w-px self-stretch", L) }), z] })
154
+ ]
155
+ })
156
+ }), y && /* @__PURE__ */ o(n, {
157
+ side: P,
158
+ align: F,
159
+ sideOffset: 8,
160
+ className: "w-auto min-w-[10rem] p-ds-01",
161
+ children: y
162
+ })]
163
+ });
231
164
  });
232
- S.displayName = "SplitButton";
165
+ _.displayName = "SplitButton";
233
166
  //#endregion
234
- export { S as SplitButton };
167
+ export { _ as SplitButton };
@@ -1 +1 @@
1
- {"version":3,"file":"split-button.js","names":[],"sources":["../../src/ui/split-button.tsx"],"sourcesContent":["'use client'\n\nimport { autoUpdate, computePosition, flip, offset, type Placement,shift } from '@floating-ui/dom'\nimport { type VariantProps } from 'class-variance-authority'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { buttonVariants } from './button'\nimport { durations } from './lib/motion'\nimport { cn } from './lib/utils'\n\n// ── Types ───────────────────────────────────────────────────────\n\ntype SplitButtonVariant = 'solid' | 'soft' | 'outline'\ntype SplitButtonColor = NonNullable<VariantProps<typeof buttonVariants>['color']>\ntype SplitButtonSize = 'xs' | 'sm' | 'md' | 'icon-xs' | 'icon-sm' | 'icon-md'\n\nexport interface SplitButtonProps {\n /** Primary action content (left side). */\n children: React.ReactNode\n /** Primary click handler (left side). */\n onClick: (e: React.MouseEvent<HTMLButtonElement>) => void\n /** Content rendered inside the floating dropdown panel. */\n dropdownContent?: React.ReactNode\n /** Controlled open state. */\n open?: boolean\n /** Called when open state changes. Uncontrolled if omitted. */\n onOpenChange?: (open: boolean) => void\n /** @default 'solid' */\n variant?: SplitButtonVariant\n /** @default 'accent' */\n color?: SplitButtonColor\n /** @default 'md' */\n size?: SplitButtonSize\n /** Disable both halves. */\n disabled?: boolean\n /** aria-label for the primary button. */\n 'aria-label'?: string\n /** aria-label for the dropdown trigger. @default 'More options' */\n dropdownLabel?: string\n /** Custom icon for the dropdown trigger. Defaults to chevron-down. */\n dropdownIcon?: React.ReactNode\n /** Which side the dropdown trigger sits on. @default 'right' */\n triggerSide?: 'left' | 'right'\n /** Preferred placement for the dropdown panel. @default 'top-end' */\n placement?: Placement\n /** Width of the trigger (chevron) half. @default 'auto' */\n triggerWidth?: number | string\n className?: string\n}\n\n// ── Styling maps ────────────────────────────────────────────────\n\nconst dividerColor: Record<SplitButtonVariant, Record<string, string>> = {\n solid: {\n accent: 'bg-accent-11/20', error: 'bg-error-11/20', success: 'bg-success-11/20',\n warning: 'bg-warning-11/20', neutral: 'bg-neutral-8/30',\n },\n soft: {\n accent: 'bg-accent-6', error: 'bg-error-6', success: 'bg-success-6',\n warning: 'bg-warning-6', neutral: 'bg-surface-border',\n },\n outline: {\n accent: 'bg-accent-7', error: 'bg-error-7', success: 'bg-success-7',\n warning: 'bg-warning-7', neutral: 'bg-surface-border-strong',\n },\n}\n\nconst heightClass: Record<SplitButtonSize, string> = {\n xs: 'h-ds-xs-plus', sm: 'h-ds-sm', md: 'h-ds-md',\n 'icon-xs': 'h-ds-xs-plus', 'icon-sm': 'h-ds-sm', 'icon-md': 'h-ds-md',\n}\n\nconst textClass: Record<SplitButtonSize, string> = {\n xs: 'text-ds-sm', sm: 'text-ds-sm', md: 'text-ds-md',\n 'icon-xs': 'text-ds-sm', 'icon-sm': 'text-ds-sm', 'icon-md': 'text-ds-md',\n}\n\nconst primaryPadding: Record<SplitButtonSize, string> = {\n xs: 'px-ds-03 gap-1', sm: 'px-ds-04 gap-1.5', md: 'px-ds-05 gap-2',\n 'icon-xs': 'px-ds-02', 'icon-sm': 'px-ds-03', 'icon-md': 'px-ds-04',\n}\n\nconst triggerPadding: Record<SplitButtonSize, string> = {\n xs: 'px-ds-02', sm: 'px-ds-02', md: 'px-ds-03',\n 'icon-xs': 'px-ds-01', 'icon-sm': 'px-ds-02', 'icon-md': 'px-ds-02',\n}\n\nconst radiusClass: Record<SplitButtonSize, string> = {\n xs: 'rounded-control', sm: 'rounded-control', md: 'rounded-control',\n 'icon-xs': 'rounded-control', 'icon-sm': 'rounded-control', 'icon-md': 'rounded-control',\n}\n\nfunction getHalfClasses(variant: SplitButtonVariant, color: string): string {\n const map: Record<SplitButtonVariant, Record<string, string>> = {\n solid: {\n accent: 'bg-accent-9 text-accent-fg hover:bg-accent-10 active:bg-accent-11',\n error: 'bg-error-9 text-error-fg hover:bg-error-10 active:bg-error-11',\n success: 'bg-success-9 text-success-fg hover:bg-success-10 active:bg-success-11',\n warning: 'bg-warning-9 text-warning-fg hover:bg-warning-10 active:bg-warning-11',\n neutral: 'bg-neutral-5 text-surface-fg hover:bg-neutral-7 active:bg-neutral-8',\n },\n soft: {\n accent: 'bg-accent-3 text-accent-11 hover:bg-accent-4 active:bg-accent-5',\n error: 'bg-error-3 text-error-11 hover:bg-error-4 active:bg-error-5',\n success: 'bg-success-3 text-success-11 hover:bg-success-4 active:bg-success-5',\n warning: 'bg-warning-3 text-warning-11 hover:bg-warning-4 active:bg-warning-5',\n neutral: 'bg-surface-raised-hover text-surface-fg-muted hover:bg-surface-raised-active active:bg-neutral-5',\n },\n outline: {\n accent: 'bg-transparent text-accent-11 hover:bg-accent-3 active:bg-accent-4',\n error: 'bg-transparent text-error-11 hover:bg-error-3 active:bg-error-4',\n success: 'bg-transparent text-success-11 hover:bg-success-3 active:bg-success-4',\n warning: 'bg-transparent text-warning-11 hover:bg-warning-3 active:bg-warning-4',\n neutral: 'bg-transparent text-surface-fg hover:bg-surface-raised-hover active:bg-surface-raised-active',\n },\n }\n return map[variant][color] ?? map[variant].accent\n}\n\nfunction getOutlineBorderColor(color: string): string {\n const map: Record<string, string> = {\n accent: 'border-accent-7', error: 'border-error-7', success: 'border-success-7',\n warning: 'border-warning-7', neutral: 'border-surface-border-strong',\n }\n return map[color] ?? map.accent\n}\n\n// ── Chevron SVG ─────────────────────────────────────────────────\n\nfunction ChevronDown({ className }: { className?: string }) {\n return (\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" className={className} aria-hidden=\"true\">\n <path d=\"M3 4.5L6 7.5L9 4.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\n// ── Component ───────────────────────────────────────────────────\n\nconst SplitButton = React.forwardRef<HTMLDivElement, SplitButtonProps>(\n function SplitButton(\n {\n children,\n onClick,\n dropdownContent,\n open: openProp,\n onOpenChange,\n variant = 'solid',\n color = 'accent',\n size = 'md',\n disabled = false,\n 'aria-label': ariaLabel,\n dropdownLabel = 'More options',\n dropdownIcon,\n triggerSide = 'right',\n placement: placementProp = 'top-end',\n triggerWidth,\n className,\n },\n ref,\n ) {\n const [internalOpen, setInternalOpen] = React.useState(false)\n const isControlled = openProp !== undefined\n const isOpen = isControlled ? openProp : internalOpen\n\n const anchorRef = React.useRef<HTMLDivElement>(null)\n const floatingRef = React.useRef<HTMLDivElement>(null)\n const menuId = React.useId()\n\n const setOpen = React.useCallback(\n (value: boolean) => {\n if (onOpenChange) onOpenChange(value)\n if (!isControlled) setInternalOpen(value)\n },\n [onOpenChange, isControlled],\n )\n\n // ── Floating UI positioning ──\n React.useEffect(() => {\n if (!isOpen || !anchorRef.current || !floatingRef.current) return\n\n const anchor = anchorRef.current\n const floating = floatingRef.current\n\n const update = () => {\n computePosition(anchor, floating, {\n placement: placementProp,\n middleware: [\n offset(8),\n flip({ fallbackPlacements: ['bottom-end', 'top-start', 'bottom-start'] }),\n shift({ padding: 8 }),\n ],\n }).then(({ x, y }) => {\n Object.assign(floating.style, { left: `${x}px`, top: `${y}px` })\n })\n }\n\n const cleanup = autoUpdate(anchor, floating, update)\n return cleanup\n }, [isOpen, placementProp])\n\n // ── Close on outside click ──\n React.useEffect(() => {\n if (!isOpen) return\n const handleClick = (e: MouseEvent) => {\n const target = e.target as Node\n if (\n anchorRef.current?.contains(target) ||\n floatingRef.current?.contains(target)\n ) return\n setOpen(false)\n }\n document.addEventListener('mousedown', handleClick)\n return () => document.removeEventListener('mousedown', handleClick)\n }, [isOpen, setOpen])\n\n // ── Close on Escape ──\n React.useEffect(() => {\n if (!isOpen) return\n const handleKey = (e: KeyboardEvent) => {\n if (e.key === 'Escape') setOpen(false)\n }\n document.addEventListener('keydown', handleKey)\n return () => document.removeEventListener('keydown', handleKey)\n }, [isOpen, setOpen])\n\n const halfClasses = getHalfClasses(variant, color)\n const divider = dividerColor[variant][color] ?? dividerColor[variant].accent\n\n const triggerStyle = triggerWidth != null\n ? { width: typeof triggerWidth === 'number' ? `${triggerWidth}px` : triggerWidth }\n : undefined\n\n return (\n <>\n {/* Button group */}\n <div\n ref={ref}\n role=\"group\"\n aria-label={ariaLabel ?? undefined}\n className={cn('relative inline-flex', className)}\n >\n <div\n ref={anchorRef}\n className={cn(\n 'inline-flex items-stretch overflow-hidden',\n radiusClass[size],\n variant === 'solid' && 'shadow-raised',\n variant === 'outline' && `border ${getOutlineBorderColor(color)}`,\n )}\n >\n {triggerSide === 'left' && (\n <>\n {/* Dropdown trigger (left) */}\n <button\n type=\"button\"\n onClick={() => setOpen(!isOpen)}\n disabled={disabled}\n aria-label={dropdownLabel}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n aria-controls={isOpen ? menuId : undefined}\n className={cn(\n 'inline-flex items-center justify-center select-none',\n 'transition-colors duration-fast-01 ease-productive-standard',\n 'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset',\n 'disabled:pointer-events-none disabled:opacity-action-disabled',\n halfClasses,\n heightClass[size],\n triggerPadding[size],\n )}\n style={triggerStyle}\n >\n {dropdownIcon ?? <ChevronDown />}\n </button>\n <div className={cn('w-px self-stretch', divider)} />\n </>\n )}\n\n {/* Primary action */}\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n aria-label={ariaLabel}\n className={cn(\n 'inline-flex items-center justify-center font-semibold select-none whitespace-nowrap',\n 'transition-[colors,transform] duration-fast-01 ease-productive-standard',\n 'active:scale-[0.97]',\n 'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset',\n 'disabled:pointer-events-none disabled:opacity-action-disabled',\n halfClasses,\n heightClass[size],\n textClass[size],\n primaryPadding[size],\n )}\n >\n {children}\n </button>\n\n {triggerSide === 'right' && (\n <>\n <div className={cn('w-px self-stretch', divider)} />\n {/* Dropdown trigger (right) */}\n <button\n type=\"button\"\n onClick={() => setOpen(!isOpen)}\n disabled={disabled}\n aria-label={dropdownLabel}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n aria-controls={isOpen ? menuId : undefined}\n className={cn(\n 'inline-flex items-center justify-center select-none',\n 'transition-colors duration-fast-01 ease-productive-standard',\n 'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset',\n 'disabled:pointer-events-none disabled:opacity-action-disabled',\n halfClasses,\n heightClass[size],\n triggerPadding[size],\n )}\n style={triggerStyle}\n >\n {dropdownIcon ?? <ChevronDown />}\n </button>\n </>\n )}\n </div>\n </div>\n\n {/* Floating dropdown panel */}\n <AnimatePresence>\n {isOpen && dropdownContent && (\n <div\n ref={floatingRef}\n id={menuId}\n role=\"menu\"\n className=\"fixed z-popover\"\n style={{ top: 0, left: 0 }}\n >\n <motion.div\n initial={{ opacity: 0, scale: 0.95 }}\n animate={{ opacity: 1, scale: 1 }}\n exit={{ opacity: 0, scale: 0.95 }}\n transition={{ duration: durations.moderate01 }}\n className=\"rounded-overlay bg-surface-overlay shadow-floating\"\n >\n {dropdownContent}\n </motion.div>\n </div>\n )}\n </AnimatePresence>\n </>\n )\n },\n)\n\nSplitButton.displayName = 'SplitButton'\n\nexport { SplitButton }\nexport type { SplitButtonColor, SplitButtonSize,SplitButtonVariant }\n"],"mappings":";;;;;;;;AAqDA,IAAM,IAAmE;CACvE,OAAO;EACL,QAAQ;EAAmB,OAAO;EAAkB,SAAS;EAC7D,SAAS;EAAoB,SAAS;EACvC;CACD,MAAM;EACJ,QAAQ;EAAe,OAAO;EAAc,SAAS;EACrD,SAAS;EAAgB,SAAS;EACnC;CACD,SAAS;EACP,QAAQ;EAAe,OAAO;EAAc,SAAS;EACrD,SAAS;EAAgB,SAAS;EACnC;CACF,EAEK,IAA+C;CACnD,IAAI;CAAgB,IAAI;CAAW,IAAI;CACvC,WAAW;CAAgB,WAAW;CAAW,WAAW;CAC7D,EAEK,IAA6C;CACjD,IAAI;CAAc,IAAI;CAAc,IAAI;CACxC,WAAW;CAAc,WAAW;CAAc,WAAW;CAC9D,EAEK,IAAkD;CACtD,IAAI;CAAkB,IAAI;CAAoB,IAAI;CAClD,WAAW;CAAY,WAAW;CAAY,WAAW;CAC1D,EAEK,IAAkD;CACtD,IAAI;CAAY,IAAI;CAAY,IAAI;CACpC,WAAW;CAAY,WAAW;CAAY,WAAW;CAC1D,EAEK,IAA+C;CACnD,IAAI;CAAmB,IAAI;CAAmB,IAAI;CAClD,WAAW;CAAmB,WAAW;CAAmB,WAAW;CACxE;AAED,SAAS,EAAe,GAA6B,GAAuB;CAC1E,IAAM,IAA0D;EAC9D,OAAO;GACL,QAAQ;GACR,OAAO;GACP,SAAS;GACT,SAAS;GACT,SAAS;GACV;EACD,MAAM;GACJ,QAAQ;GACR,OAAO;GACP,SAAS;GACT,SAAS;GACT,SAAS;GACV;EACD,SAAS;GACP,QAAQ;GACR,OAAO;GACP,SAAS;GACT,SAAS;GACT,SAAS;GACV;EACF;AACD,QAAO,EAAI,GAAS,MAAU,EAAI,GAAS;;AAG7C,SAAS,EAAsB,GAAuB;CACpD,IAAM,IAA8B;EAClC,QAAQ;EAAmB,OAAO;EAAkB,SAAS;EAC7D,SAAS;EAAoB,SAAS;EACvC;AACD,QAAO,EAAI,MAAU,EAAI;;AAK3B,SAAS,EAAY,EAAE,gBAAqC;AAC1D,QACE,kBAAC,OAAD;EAAK,OAAM;EAAK,QAAO;EAAK,SAAQ;EAAY,MAAK;EAAkB;EAAW,eAAY;YAC5F,kBAAC,QAAD;GAAM,GAAE;GAAqB,QAAO;GAAe,aAAY;GAAM,eAAc;GAAQ,gBAAe;GAAU,CAAA;EAChH,CAAA;;AAMV,IAAM,IAAc,EAAM,WACxB,SACE,EACE,aACA,YACA,oBACA,MAAM,GACN,iBACA,aAAU,SACV,WAAQ,UACR,UAAO,MACP,cAAW,IACX,cAAc,GACd,mBAAgB,gBAChB,iBACA,iBAAc,SACd,WAAW,IAAgB,WAC3B,iBACA,gBAEF,GACA;CACA,IAAM,CAAC,GAAc,KAAmB,EAAM,SAAS,GAAM,EACvD,IAAe,MAAa,KAAA,GAC5B,IAAS,IAAe,IAAW,GAEnC,IAAY,EAAM,OAAuB,KAAK,EAC9C,IAAc,EAAM,OAAuB,KAAK,EAChD,IAAS,EAAM,OAAO,EAEtB,IAAU,EAAM,aACnB,MAAmB;AAElB,EADI,KAAc,EAAa,EAAM,EAChC,KAAc,EAAgB,EAAM;IAE3C,CAAC,GAAc,EAAa,CAC7B;AA0CD,CAvCA,EAAM,gBAAgB;AACpB,MAAI,CAAC,KAAU,CAAC,EAAU,WAAW,CAAC,EAAY,QAAS;EAE3D,IAAM,IAAS,EAAU,SACnB,IAAW,EAAY;AAgB7B,SADgB,EAAW,GAAQ,SAbd;AACnB,KAAgB,GAAQ,GAAU;IAChC,WAAW;IACX,YAAY;KACV,EAAO,EAAE;KACT,EAAK,EAAE,oBAAoB;MAAC;MAAc;MAAa;MAAe,EAAE,CAAC;KACzE,EAAM,EAAE,SAAS,GAAG,CAAC;KACtB;IACF,CAAC,CAAC,MAAM,EAAE,MAAG,WAAQ;AACpB,WAAO,OAAO,EAAS,OAAO;KAAE,MAAM,GAAG,EAAE;KAAK,KAAK,GAAG,EAAE;KAAK,CAAC;KAChE;IAGgD;IAEnD,CAAC,GAAQ,EAAc,CAAC,EAG3B,EAAM,gBAAgB;AACpB,MAAI,CAAC,EAAQ;EACb,IAAM,KAAe,MAAkB;GACrC,IAAM,IAAS,EAAE;AAEf,KAAU,SAAS,SAAS,EAAO,IACnC,EAAY,SAAS,SAAS,EAAO,IAEvC,EAAQ,GAAM;;AAGhB,SADA,SAAS,iBAAiB,aAAa,EAAY,QACtC,SAAS,oBAAoB,aAAa,EAAY;IAClE,CAAC,GAAQ,EAAQ,CAAC,EAGrB,EAAM,gBAAgB;AACpB,MAAI,CAAC,EAAQ;EACb,IAAM,KAAa,MAAqB;AACtC,GAAI,EAAE,QAAQ,YAAU,EAAQ,GAAM;;AAGxC,SADA,SAAS,iBAAiB,WAAW,EAAU,QAClC,SAAS,oBAAoB,WAAW,EAAU;IAC9D,CAAC,GAAQ,EAAQ,CAAC;CAErB,IAAM,IAAc,EAAe,GAAS,EAAM,EAC5C,IAAU,EAAa,GAAS,MAAU,EAAa,GAAS,QAEhE,IAAe,KAAgB,OAEjC,KAAA,IADA,EAAE,OAAO,OAAO,KAAiB,WAAW,GAAG,EAAa,MAAM,GAAc;AAGpF,QACE,kBAAA,GAAA,EAAA,UAAA,CAEE,kBAAC,OAAD;EACO;EACL,MAAK;EACL,cAAY,KAAa,KAAA;EACzB,WAAW,EAAG,wBAAwB,EAAU;YAEhD,kBAAC,OAAD;GACE,KAAK;GACL,WAAW,EACT,6CACA,EAAY,IACZ,MAAY,WAAW,iBACvB,MAAY,aAAa,UAAU,EAAsB,EAAM,GAChE;aAPH;IASG,MAAgB,UACf,kBAAA,GAAA,EAAA,UAAA,CAEE,kBAAC,UAAD;KACE,MAAK;KACL,eAAe,EAAQ,CAAC,EAAO;KACrB;KACV,cAAY;KACZ,iBAAc;KACd,iBAAe;KACf,iBAAe,IAAS,IAAS,KAAA;KACjC,WAAW,EACT,uDACA,+DACA,0GACA,iEACA,GACA,EAAY,IACZ,EAAe,GAChB;KACD,OAAO;eAEN,KAAgB,kBAAC,GAAD,EAAe,CAAA;KACzB,CAAA,EACT,kBAAC,OAAD,EAAK,WAAW,EAAG,qBAAqB,EAAQ,EAAI,CAAA,CACnD,EAAA,CAAA;IAIL,kBAAC,UAAD;KACE,MAAK;KACI;KACC;KACV,cAAY;KACZ,WAAW,EACT,uFACA,2EACA,uBACA,0GACA,iEACA,GACA,EAAY,IACZ,EAAU,IACV,EAAe,GAChB;KAEA;KACM,CAAA;IAER,MAAgB,WACf,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD,EAAK,WAAW,EAAG,qBAAqB,EAAQ,EAAI,CAAA,EAEpD,kBAAC,UAAD;KACE,MAAK;KACL,eAAe,EAAQ,CAAC,EAAO;KACrB;KACV,cAAY;KACZ,iBAAc;KACd,iBAAe;KACf,iBAAe,IAAS,IAAS,KAAA;KACjC,WAAW,EACT,uDACA,+DACA,0GACA,iEACA,GACA,EAAY,IACZ,EAAe,GAChB;KACD,OAAO;eAEN,KAAgB,kBAAC,GAAD,EAAe,CAAA;KACzB,CAAA,CACR,EAAA,CAAA;IAED;;EACF,CAAA,EAGN,kBAAC,GAAD,EAAA,UACG,KAAU,KACT,kBAAC,OAAD;EACE,KAAK;EACL,IAAI;EACJ,MAAK;EACL,WAAU;EACV,OAAO;GAAE,KAAK;GAAG,MAAM;GAAG;YAE1B,kBAAC,EAAO,KAAR;GACE,SAAS;IAAE,SAAS;IAAG,OAAO;IAAM;GACpC,SAAS;IAAE,SAAS;IAAG,OAAO;IAAG;GACjC,MAAM;IAAE,SAAS;IAAG,OAAO;IAAM;GACjC,YAAY,EAAE,UAAU,EAAU,YAAY;GAC9C,WAAU;aAET;GACU,CAAA;EACT,CAAA,EAEQ,CAAA,CACjB,EAAA,CAAA;EAGR;AAED,EAAY,cAAc"}
1
+ {"version":3,"file":"split-button.js","names":[],"sources":["../../src/ui/split-button.tsx"],"sourcesContent":["'use client'\n\nimport { type Placement } from '@floating-ui/dom'\nimport { type VariantProps } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { buttonVariants } from './button'\nimport { cn } from './lib/utils'\nimport { Popover, PopoverContent, PopoverTrigger } from './popover'\n\n// ── Types ───────────────────────────────────────────────────────\n\ntype SplitButtonVariant = 'solid' | 'soft' | 'outline'\ntype SplitButtonColor = NonNullable<VariantProps<typeof buttonVariants>['color']>\ntype SplitButtonSize = 'xs' | 'sm' | 'md' | 'icon-xs' | 'icon-sm' | 'icon-md'\n\nexport interface SplitButtonProps {\n /** Primary action content (left side). */\n children: React.ReactNode\n /** Primary click handler (left side). */\n onClick: (e: React.MouseEvent<HTMLButtonElement>) => void\n /** Content rendered inside the floating dropdown panel. */\n dropdownContent?: React.ReactNode\n /** Controlled open state. */\n open?: boolean\n /** Called when open state changes. Uncontrolled if omitted. */\n onOpenChange?: (open: boolean) => void\n /** @default 'solid' */\n variant?: SplitButtonVariant\n /** @default 'accent' */\n color?: SplitButtonColor\n /** @default 'md' */\n size?: SplitButtonSize\n /** Disable both halves. */\n disabled?: boolean\n /** aria-label for the primary button. */\n 'aria-label'?: string\n /** aria-label for the dropdown trigger. @default 'More options' */\n dropdownLabel?: string\n /** Custom icon for the dropdown trigger. Defaults to chevron-down. */\n dropdownIcon?: React.ReactNode\n /** Which side the dropdown trigger sits on. @default 'right' */\n triggerSide?: 'left' | 'right'\n /** Preferred placement for the dropdown panel. @default 'top-end' */\n placement?: Placement\n /** Width of the trigger (chevron) half. @default 'auto' */\n triggerWidth?: number | string\n className?: string\n}\n\n// ── Styling maps ────────────────────────────────────────────────\n\nconst dividerColor: Record<SplitButtonVariant, Record<string, string>> = {\n solid: {\n accent: 'bg-accent-11/20', error: 'bg-error-11/20', success: 'bg-success-11/20',\n warning: 'bg-warning-11/20', neutral: 'bg-neutral-8/30',\n },\n soft: {\n accent: 'bg-accent-6', error: 'bg-error-6', success: 'bg-success-6',\n warning: 'bg-warning-6', neutral: 'bg-surface-border',\n },\n outline: {\n accent: 'bg-accent-7', error: 'bg-error-7', success: 'bg-success-7',\n warning: 'bg-warning-7', neutral: 'bg-surface-border-strong',\n },\n}\n\nconst heightClass: Record<SplitButtonSize, string> = {\n xs: 'h-ds-xs-plus', sm: 'h-ds-sm', md: 'h-ds-md',\n 'icon-xs': 'h-ds-xs-plus', 'icon-sm': 'h-ds-sm', 'icon-md': 'h-ds-md',\n}\n\nconst textClass: Record<SplitButtonSize, string> = {\n xs: 'text-ds-sm', sm: 'text-ds-sm', md: 'text-ds-md',\n 'icon-xs': 'text-ds-sm', 'icon-sm': 'text-ds-sm', 'icon-md': 'text-ds-md',\n}\n\nconst primaryPadding: Record<SplitButtonSize, string> = {\n xs: 'px-ds-03 gap-1', sm: 'px-ds-04 gap-1.5', md: 'px-ds-05 gap-2',\n 'icon-xs': 'px-ds-02', 'icon-sm': 'px-ds-03', 'icon-md': 'px-ds-04',\n}\n\nconst triggerPadding: Record<SplitButtonSize, string> = {\n xs: 'px-ds-02', sm: 'px-ds-02', md: 'px-ds-03',\n 'icon-xs': 'px-ds-01', 'icon-sm': 'px-ds-02', 'icon-md': 'px-ds-02',\n}\n\nconst radiusClass: Record<SplitButtonSize, string> = {\n xs: 'rounded-control', sm: 'rounded-control', md: 'rounded-control',\n 'icon-xs': 'rounded-control', 'icon-sm': 'rounded-control', 'icon-md': 'rounded-control',\n}\n\nfunction getHalfClasses(variant: SplitButtonVariant, color: string): string {\n const map: Record<SplitButtonVariant, Record<string, string>> = {\n solid: {\n accent: 'bg-accent-9 text-accent-fg hover:bg-accent-10 active:bg-accent-11',\n error: 'bg-error-9 text-error-fg hover:bg-error-10 active:bg-error-11',\n success: 'bg-success-9 text-success-fg hover:bg-success-10 active:bg-success-11',\n warning: 'bg-warning-9 text-warning-fg hover:bg-warning-10 active:bg-warning-11',\n neutral: 'bg-neutral-5 text-surface-fg hover:bg-neutral-7 active:bg-neutral-8',\n },\n soft: {\n accent: 'bg-accent-3 text-accent-11 hover:bg-accent-4 active:bg-accent-5',\n error: 'bg-error-3 text-error-11 hover:bg-error-4 active:bg-error-5',\n success: 'bg-success-3 text-success-11 hover:bg-success-4 active:bg-success-5',\n warning: 'bg-warning-3 text-warning-11 hover:bg-warning-4 active:bg-warning-5',\n neutral: 'bg-surface-raised-hover text-surface-fg-muted hover:bg-surface-raised-active active:bg-neutral-5',\n },\n outline: {\n accent: 'bg-transparent text-accent-11 hover:bg-accent-3 active:bg-accent-4',\n error: 'bg-transparent text-error-11 hover:bg-error-3 active:bg-error-4',\n success: 'bg-transparent text-success-11 hover:bg-success-3 active:bg-success-4',\n warning: 'bg-transparent text-warning-11 hover:bg-warning-3 active:bg-warning-4',\n neutral: 'bg-transparent text-surface-fg hover:bg-surface-raised-hover active:bg-surface-raised-active',\n },\n }\n return map[variant][color] ?? map[variant].accent\n}\n\nfunction getOutlineBorderColor(color: string): string {\n const map: Record<string, string> = {\n accent: 'border-accent-7', error: 'border-error-7', success: 'border-success-7',\n warning: 'border-warning-7', neutral: 'border-surface-border-strong',\n }\n return map[color] ?? map.accent\n}\n\n// ── Chevron SVG ─────────────────────────────────────────────────\n\nfunction ChevronDown({ className }: { className?: string }) {\n return (\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" className={className} aria-hidden=\"true\">\n <path d=\"M3 4.5L6 7.5L9 4.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )\n}\n\n// ── Component ───────────────────────────────────────────────────\n\nconst SplitButton = React.forwardRef<HTMLDivElement, SplitButtonProps>(\n function SplitButton(\n {\n children,\n onClick,\n dropdownContent,\n open: openProp,\n onOpenChange,\n variant = 'solid',\n color = 'accent',\n size = 'md',\n disabled = false,\n 'aria-label': ariaLabel,\n dropdownLabel = 'More options',\n dropdownIcon,\n triggerSide = 'right',\n placement: placementProp = 'top-end',\n triggerWidth,\n className,\n },\n ref,\n ) {\n // Map the floating-ui `placement` (e.g. 'top-end') to Radix side + align.\n // Positioning, focus-in/return, outside-click, and Escape all come from the\n // Popover primitive now — no hand-rolled floating-ui / listeners.\n const [side, align] = React.useMemo(() => {\n const [s, a] = placementProp.split('-')\n return [\n s as 'top' | 'right' | 'bottom' | 'left',\n (a === 'start' ? 'start' : a === 'end' ? 'end' : 'center') as\n | 'start'\n | 'center'\n | 'end',\n ]\n }, [placementProp])\n\n const halfClasses = getHalfClasses(variant, color)\n const divider = dividerColor[variant][color] ?? dividerColor[variant].accent\n\n const triggerStyle = triggerWidth != null\n ? { width: typeof triggerWidth === 'number' ? `${triggerWidth}px` : triggerWidth }\n : undefined\n\n // Dropdown trigger (the chevron half). PopoverTrigger wires aria-haspopup /\n // aria-expanded / focus-return for us.\n const dropdownTrigger = (\n <PopoverTrigger asChild>\n <button\n type=\"button\"\n disabled={disabled}\n aria-label={dropdownLabel}\n className={cn(\n 'inline-flex items-center justify-center select-none',\n 'transition-colors duration-fast-01 ease-productive-standard',\n 'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset',\n 'disabled:pointer-events-none disabled:opacity-action-disabled',\n halfClasses,\n heightClass[size],\n triggerPadding[size],\n )}\n style={triggerStyle}\n >\n {dropdownIcon ?? <ChevronDown />}\n </button>\n </PopoverTrigger>\n )\n\n return (\n <Popover open={openProp} onOpenChange={onOpenChange}>\n {/* Button group */}\n <div\n ref={ref}\n role=\"group\"\n aria-label={ariaLabel ?? undefined}\n className={cn('relative inline-flex', className)}\n >\n <div\n className={cn(\n 'inline-flex items-stretch overflow-hidden',\n radiusClass[size],\n variant === 'solid' && 'shadow-raised',\n variant === 'outline' && `border ${getOutlineBorderColor(color)}`,\n )}\n >\n {triggerSide === 'left' && (\n <>\n {dropdownTrigger}\n <div className={cn('w-px self-stretch', divider)} />\n </>\n )}\n\n {/* Primary action */}\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n aria-label={ariaLabel}\n className={cn(\n 'inline-flex items-center justify-center font-semibold select-none whitespace-nowrap',\n 'transition-[colors,transform] duration-fast-01 ease-productive-standard',\n 'active:scale-[0.97]',\n 'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset',\n 'disabled:pointer-events-none disabled:opacity-action-disabled',\n halfClasses,\n heightClass[size],\n textClass[size],\n primaryPadding[size],\n )}\n >\n {children}\n </button>\n\n {triggerSide === 'right' && (\n <>\n <div className={cn('w-px self-stretch', divider)} />\n {dropdownTrigger}\n </>\n )}\n </div>\n </div>\n\n {/* Dropdown panel — Popover handles focus, Escape, outside-click, return */}\n {dropdownContent && (\n <PopoverContent\n side={side}\n align={align}\n sideOffset={8}\n className=\"w-auto min-w-[10rem] p-ds-01\"\n >\n {dropdownContent}\n </PopoverContent>\n )}\n </Popover>\n )\n },\n)\n\nSplitButton.displayName = 'SplitButton'\n\nexport { SplitButton }\nexport type { SplitButtonColor, SplitButtonSize,SplitButtonVariant }\n"],"mappings":";;;;;;AAoDA,IAAM,IAAmE;CACvE,OAAO;EACL,QAAQ;EAAmB,OAAO;EAAkB,SAAS;EAC7D,SAAS;EAAoB,SAAS;EACvC;CACD,MAAM;EACJ,QAAQ;EAAe,OAAO;EAAc,SAAS;EACrD,SAAS;EAAgB,SAAS;EACnC;CACD,SAAS;EACP,QAAQ;EAAe,OAAO;EAAc,SAAS;EACrD,SAAS;EAAgB,SAAS;EACnC;CACF,EAEK,IAA+C;CACnD,IAAI;CAAgB,IAAI;CAAW,IAAI;CACvC,WAAW;CAAgB,WAAW;CAAW,WAAW;CAC7D,EAEK,IAA6C;CACjD,IAAI;CAAc,IAAI;CAAc,IAAI;CACxC,WAAW;CAAc,WAAW;CAAc,WAAW;CAC9D,EAEK,IAAkD;CACtD,IAAI;CAAkB,IAAI;CAAoB,IAAI;CAClD,WAAW;CAAY,WAAW;CAAY,WAAW;CAC1D,EAEK,IAAkD;CACtD,IAAI;CAAY,IAAI;CAAY,IAAI;CACpC,WAAW;CAAY,WAAW;CAAY,WAAW;CAC1D,EAEK,IAA+C;CACnD,IAAI;CAAmB,IAAI;CAAmB,IAAI;CAClD,WAAW;CAAmB,WAAW;CAAmB,WAAW;CACxE;AAED,SAAS,EAAe,GAA6B,GAAuB;CAC1E,IAAM,IAA0D;EAC9D,OAAO;GACL,QAAQ;GACR,OAAO;GACP,SAAS;GACT,SAAS;GACT,SAAS;GACV;EACD,MAAM;GACJ,QAAQ;GACR,OAAO;GACP,SAAS;GACT,SAAS;GACT,SAAS;GACV;EACD,SAAS;GACP,QAAQ;GACR,OAAO;GACP,SAAS;GACT,SAAS;GACT,SAAS;GACV;EACF;AACD,QAAO,EAAI,GAAS,MAAU,EAAI,GAAS;;AAG7C,SAAS,EAAsB,GAAuB;CACpD,IAAM,IAA8B;EAClC,QAAQ;EAAmB,OAAO;EAAkB,SAAS;EAC7D,SAAS;EAAoB,SAAS;EACvC;AACD,QAAO,EAAI,MAAU,EAAI;;AAK3B,SAAS,EAAY,EAAE,gBAAqC;AAC1D,QACE,kBAAC,OAAD;EAAK,OAAM;EAAK,QAAO;EAAK,SAAQ;EAAY,MAAK;EAAkB;EAAW,eAAY;YAC5F,kBAAC,QAAD;GAAM,GAAE;GAAqB,QAAO;GAAe,aAAY;GAAM,eAAc;GAAQ,gBAAe;GAAU,CAAA;EAChH,CAAA;;AAMV,IAAM,IAAc,EAAM,WACxB,SACE,EACE,aACA,YACA,oBACA,MAAM,GACN,iBACA,aAAU,SACV,WAAQ,UACR,UAAO,MACP,cAAW,IACX,cAAc,GACd,mBAAgB,gBAChB,iBACA,iBAAc,SACd,WAAW,IAAgB,WAC3B,iBACA,gBAEF,GACA;CAIA,IAAM,CAAC,GAAM,KAAS,EAAM,cAAc;EACxC,IAAM,CAAC,GAAG,KAAK,EAAc,MAAM,IAAI;AACvC,SAAO,CACL,GACC,MAAM,UAAU,UAAU,MAAM,QAAQ,QAAQ,SAIlD;IACA,CAAC,EAAc,CAAC,EAEb,IAAc,EAAe,GAAS,EAAM,EAC5C,IAAU,EAAa,GAAS,MAAU,EAAa,GAAS,QAEhE,IAAe,KAAgB,OAEjC,KAAA,IADA,EAAE,OAAO,OAAO,KAAiB,WAAW,GAAG,EAAa,MAAM,GAAc,EAK9E,IACJ,kBAAC,GAAD;EAAgB,SAAA;YACd,kBAAC,UAAD;GACE,MAAK;GACK;GACV,cAAY;GACZ,WAAW,EACT,uDACA,+DACA,0GACA,iEACA,GACA,EAAY,IACZ,EAAe,GAChB;GACD,OAAO;aAEN,KAAgB,kBAAC,GAAD,EAAe,CAAA;GACzB,CAAA;EACM,CAAA;AAGnB,QACE,kBAAC,GAAD;EAAS,MAAM;EAAwB;YAAvC,CAEE,kBAAC,OAAD;GACO;GACL,MAAK;GACL,cAAY,KAAa,KAAA;GACzB,WAAW,EAAG,wBAAwB,EAAU;aAEhD,kBAAC,OAAD;IACE,WAAW,EACT,6CACA,EAAY,IACZ,MAAY,WAAW,iBACvB,MAAY,aAAa,UAAU,EAAsB,EAAM,GAChE;cANH;KAQG,MAAgB,UACf,kBAAA,GAAA,EAAA,UAAA,CACG,GACD,kBAAC,OAAD,EAAK,WAAW,EAAG,qBAAqB,EAAQ,EAAI,CAAA,CACnD,EAAA,CAAA;KAIL,kBAAC,UAAD;MACE,MAAK;MACI;MACC;MACV,cAAY;MACZ,WAAW,EACT,uFACA,2EACA,uBACA,0GACA,iEACA,GACA,EAAY,IACZ,EAAU,IACV,EAAe,GAChB;MAEA;MACM,CAAA;KAER,MAAgB,WACf,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD,EAAK,WAAW,EAAG,qBAAqB,EAAQ,EAAI,CAAA,EACnD,EACA,EAAA,CAAA;KAED;;GACF,CAAA,EAGL,KACC,kBAAC,GAAD;GACQ;GACC;GACP,YAAY;GACZ,WAAU;aAET;GACc,CAAA,CAEX;;EAGf;AAED,EAAY,cAAc"}
@@ -1,4 +1,5 @@
1
1
  "use client";
2
+ import { CardSize } from './card';
2
3
  import { IconInput } from './lib/icon-input';
3
4
  import { FlashPreset, FlashSpec, FlashSpeed } from './stat-flash';
4
5
  import * as React from 'react';
@@ -76,6 +77,12 @@ export interface StatCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>
76
77
  progress?: number;
77
78
  /** Surface variant, delegated to Card: `default` (ring-in-shadow) | `elevated` | `outline` (border, no shadow) | `flat`. @default 'default' */
78
79
  variant?: 'default' | 'elevated' | 'outline' | 'flat';
80
+ /**
81
+ * Tile density, delegated to Card's size axis. `sm` tightens padding to 16px and steps
82
+ * the value down to `text-ds-2xl` — use it for dense KPI rows and narrow stat grids
83
+ * (e.g. stat-row's 140px tiles). @default 'md'
84
+ */
85
+ size?: CardSize;
79
86
  /** How the brand accent reads: `none` (neutral — default), `icon` (accent chip around `icon`), or `tint` (subtle accent surface wash + accent value). */
80
87
  accentStyle?: 'none' | 'icon' | 'tint';
81
88
  /** When `accentStyle="icon"`: `soft` (tinted chip) or `solid` (filled accent chip). @default 'soft' */
@@ -1 +1 @@
1
- {"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../src/ui/stat-card.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AAKjD,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,KAAK,UAAU,EAAY,MAAM,cAAc,CAAA;AAE1F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACxF,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE;QACN,KAAK,EAAE,MAAM,CAAA;QACb,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAA;KACrC,CAAA;IACD,kJAAkJ;IAClJ,cAAc,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACnC,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,sEAAsE;IACtE,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kEAAkE;IAClE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,+IAA+I;IAC/I,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,SAAS,GAAG,MAAM,CAAA;IACrD,yJAAyJ;IACzJ,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAA;IACtC,uGAAuG;IACvG,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC3B;;;;OAIG;IACH,KAAK,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IAC/B,iFAAiF;IACjF,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yEAAyE;IACzE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB;AA+FD,QAAA,MAAM,QAAQ,sFA2Pb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,CAAA"}
1
+ {"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../src/ui/stat-card.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAiC,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAGrE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AAKjD,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,KAAK,UAAU,EAAY,MAAM,cAAc,CAAA;AAE1F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACxF,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE;QACN,KAAK,EAAE,MAAM,CAAA;QACb,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAA;KACrC,CAAA;IACD,kJAAkJ;IAClJ,cAAc,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACnC,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,sEAAsE;IACtE,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kEAAkE;IAClE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,+IAA+I;IAC/I,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,SAAS,GAAG,MAAM,CAAA;IACrD;;;;OAIG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,yJAAyJ;IACzJ,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAA;IACtC,uGAAuG;IACvG,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC3B;;;;OAIG;IACH,KAAK,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IAC/B,iFAAiF;IACjF,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yEAAyE;IACzE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB;AA+FD,QAAA,MAAM,QAAQ,sFA0Qb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,CAAA"}