@devalok/shilp-sutra 0.37.1 → 0.39.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 (260) hide show
  1. package/MIGRATION.md +185 -0
  2. package/dist/_chunks/badge-group.js +4 -4
  3. package/dist/_chunks/badge-group.js.map +1 -1
  4. package/dist/_chunks/chat.js +14 -14
  5. package/dist/_chunks/chat.js.map +1 -1
  6. package/dist/_chunks/date-picker.js +9 -9
  7. package/dist/_chunks/date-picker.js.map +1 -1
  8. package/dist/_chunks/document-preview.js +2 -2
  9. package/dist/_chunks/document-preview.js.map +1 -1
  10. package/dist/_chunks/file-preview.js +11 -11
  11. package/dist/_chunks/file-preview.js.map +1 -1
  12. package/dist/_chunks/image-preview.js +2 -2
  13. package/dist/_chunks/image-preview.js.map +1 -1
  14. package/dist/_chunks/mention-suggestion.js +5 -5
  15. package/dist/_chunks/mention-suggestion.js.map +1 -1
  16. package/dist/_chunks/popover.js +3 -3
  17. package/dist/_chunks/popover.js.map +1 -1
  18. package/dist/_chunks/rich-chat-input.js +33 -33
  19. package/dist/_chunks/rich-chat-input.js.map +1 -1
  20. package/dist/_chunks/shared.js +5 -5
  21. package/dist/_chunks/shared.js.map +1 -1
  22. package/dist/_chunks/text.js +2 -2
  23. package/dist/_chunks/text.js.map +1 -1
  24. package/dist/_chunks/tiptap.js +977 -968
  25. package/dist/_chunks/tiptap.js.map +1 -1
  26. package/dist/_chunks/tree-view.js +1 -1
  27. package/dist/_chunks/tree-view.js.map +1 -1
  28. package/dist/_chunks/use-calendar.js +5 -5
  29. package/dist/_chunks/use-calendar.js.map +1 -1
  30. package/dist/ai/command-bar.js +10 -10
  31. package/dist/ai/command-bar.js.map +1 -1
  32. package/dist/ai/conversation.js +4 -4
  33. package/dist/ai/conversation.js.map +1 -1
  34. package/dist/composed/activity-feed.js +5 -5
  35. package/dist/composed/activity-feed.js.map +1 -1
  36. package/dist/composed/avatar-group.js +4 -4
  37. package/dist/composed/avatar-group.js.map +1 -1
  38. package/dist/composed/bulk-action-bar.js +1 -1
  39. package/dist/composed/bulk-action-bar.js.map +1 -1
  40. package/dist/composed/command-palette.js +5 -5
  41. package/dist/composed/command-palette.js.map +1 -1
  42. package/dist/composed/content-card.js +1 -1
  43. package/dist/composed/content-card.js.map +1 -1
  44. package/dist/composed/emoji-picker.js +4 -4
  45. package/dist/composed/emoji-picker.js.map +1 -1
  46. package/dist/composed/empty-state.js +1 -1
  47. package/dist/composed/empty-state.js.map +1 -1
  48. package/dist/composed/error-boundary.js +3 -3
  49. package/dist/composed/error-boundary.js.map +1 -1
  50. package/dist/composed/filter-bar.js +1 -1
  51. package/dist/composed/filter-bar.js.map +1 -1
  52. package/dist/composed/index.d.ts +0 -2
  53. package/dist/composed/index.d.ts.map +1 -1
  54. package/dist/composed/index.js +5 -6
  55. package/dist/composed/inline-edit.js +1 -1
  56. package/dist/composed/inline-edit.js.map +1 -1
  57. package/dist/composed/loading-skeleton.js +9 -9
  58. package/dist/composed/loading-skeleton.js.map +1 -1
  59. package/dist/composed/markdown-viewer.js +3 -3
  60. package/dist/composed/markdown-viewer.js.map +1 -1
  61. package/dist/composed/multi-select-popover.js +1 -1
  62. package/dist/composed/multi-select-popover.js.map +1 -1
  63. package/dist/composed/page-header.js +1 -1
  64. package/dist/composed/page-header.js.map +1 -1
  65. package/dist/composed/page-skeletons.js +15 -15
  66. package/dist/composed/page-skeletons.js.map +1 -1
  67. package/dist/composed/priority-indicator.js +3 -3
  68. package/dist/composed/priority-indicator.js.map +1 -1
  69. package/dist/composed/rich-text-editor.js +11 -11
  70. package/dist/composed/rich-text-editor.js.map +1 -1
  71. package/dist/composed/schedule-view.js +3 -3
  72. package/dist/composed/schedule-view.js.map +1 -1
  73. package/dist/composed/status-badge.js +3 -3
  74. package/dist/composed/status-badge.js.map +1 -1
  75. package/dist/hooks/index.d.ts +2 -2
  76. package/dist/hooks/index.d.ts.map +1 -1
  77. package/dist/hooks/index.js +0 -1
  78. package/dist/shell/bottom-navbar.js +6 -6
  79. package/dist/shell/bottom-navbar.js.map +1 -1
  80. package/dist/shell/notification-center.js +8 -8
  81. package/dist/shell/notification-center.js.map +1 -1
  82. package/dist/shell/notification-preferences.js +1 -1
  83. package/dist/shell/notification-preferences.js.map +1 -1
  84. package/dist/shell/sidebar.js +6 -6
  85. package/dist/shell/sidebar.js.map +1 -1
  86. package/dist/shell/top-bar.js +4 -4
  87. package/dist/shell/top-bar.js.map +1 -1
  88. package/dist/tokens/semantic.css +82 -9
  89. package/dist/ui/accordion.js +1 -1
  90. package/dist/ui/accordion.js.map +1 -1
  91. package/dist/ui/alert-dialog.js +3 -3
  92. package/dist/ui/alert-dialog.js.map +1 -1
  93. package/dist/ui/alert.d.ts +1 -2
  94. package/dist/ui/alert.d.ts.map +1 -1
  95. package/dist/ui/alert.js +3 -29
  96. package/dist/ui/alert.js.map +1 -1
  97. package/dist/ui/autocomplete.js +2 -2
  98. package/dist/ui/autocomplete.js.map +1 -1
  99. package/dist/ui/avatar.js +11 -11
  100. package/dist/ui/avatar.js.map +1 -1
  101. package/dist/ui/badge-indicator.js +1 -1
  102. package/dist/ui/badge-indicator.js.map +1 -1
  103. package/dist/ui/banner.d.ts +3 -5
  104. package/dist/ui/banner.d.ts.map +1 -1
  105. package/dist/ui/banner.js +14 -14
  106. package/dist/ui/banner.js.map +1 -1
  107. package/dist/ui/breadcrumb.js +1 -1
  108. package/dist/ui/breadcrumb.js.map +1 -1
  109. package/dist/ui/button.d.ts +2 -2
  110. package/dist/ui/button.js +14 -14
  111. package/dist/ui/button.js.map +1 -1
  112. package/dist/ui/card.js +5 -5
  113. package/dist/ui/card.js.map +1 -1
  114. package/dist/ui/charts/index.js +5 -5
  115. package/dist/ui/charts/index.js.map +1 -1
  116. package/dist/ui/checkbox.js +1 -1
  117. package/dist/ui/checkbox.js.map +1 -1
  118. package/dist/ui/code.js +2 -2
  119. package/dist/ui/code.js.map +1 -1
  120. package/dist/ui/color-input.js +10 -10
  121. package/dist/ui/color-input.js.map +1 -1
  122. package/dist/ui/color-swatch.js +3 -3
  123. package/dist/ui/color-swatch.js.map +1 -1
  124. package/dist/ui/combobox.js +5 -5
  125. package/dist/ui/combobox.js.map +1 -1
  126. package/dist/ui/context-menu.js +6 -6
  127. package/dist/ui/context-menu.js.map +1 -1
  128. package/dist/ui/data-table-body.js +1 -1
  129. package/dist/ui/data-table-body.js.map +1 -1
  130. package/dist/ui/data-table-bulk-actions.js +2 -2
  131. package/dist/ui/data-table-bulk-actions.js.map +1 -1
  132. package/dist/ui/data-table-card.js +2 -2
  133. package/dist/ui/data-table-card.js.map +1 -1
  134. package/dist/ui/data-table-header.js +2 -2
  135. package/dist/ui/data-table-header.js.map +1 -1
  136. package/dist/ui/data-table-pagination.js +3 -3
  137. package/dist/ui/data-table-pagination.js.map +1 -1
  138. package/dist/ui/data-table-toolbar.js +1 -1
  139. package/dist/ui/data-table-toolbar.js.map +1 -1
  140. package/dist/ui/data-table.js +1 -1
  141. package/dist/ui/data-table.js.map +1 -1
  142. package/dist/ui/devalok-grain.d.ts +1 -1
  143. package/dist/ui/devalok-grain.js.map +1 -1
  144. package/dist/ui/dialog.js +2 -2
  145. package/dist/ui/dialog.js.map +1 -1
  146. package/dist/ui/dropdown-menu.js +6 -6
  147. package/dist/ui/dropdown-menu.js.map +1 -1
  148. package/dist/ui/file-upload.js +4 -4
  149. package/dist/ui/file-upload.js.map +1 -1
  150. package/dist/ui/hover-card.js +1 -1
  151. package/dist/ui/hover-card.js.map +1 -1
  152. package/dist/ui/icon-button.js +1 -1
  153. package/dist/ui/icon-button.js.map +1 -1
  154. package/dist/ui/index.d.ts +1 -1
  155. package/dist/ui/index.d.ts.map +1 -1
  156. package/dist/ui/index.js +2 -2
  157. package/dist/ui/index.js.map +1 -1
  158. package/dist/ui/input-otp.js +1 -1
  159. package/dist/ui/input-otp.js.map +1 -1
  160. package/dist/ui/input.d.ts +1 -9
  161. package/dist/ui/input.d.ts.map +1 -1
  162. package/dist/ui/input.js +28 -29
  163. package/dist/ui/input.js.map +1 -1
  164. package/dist/ui/link.js +1 -1
  165. package/dist/ui/link.js.map +1 -1
  166. package/dist/ui/menubar.js +8 -8
  167. package/dist/ui/menubar.js.map +1 -1
  168. package/dist/ui/navigation-menu.js +3 -3
  169. package/dist/ui/navigation-menu.js.map +1 -1
  170. package/dist/ui/number-input.js +3 -3
  171. package/dist/ui/number-input.js.map +1 -1
  172. package/dist/ui/pagination.js +1 -1
  173. package/dist/ui/pagination.js.map +1 -1
  174. package/dist/ui/progress.js +1 -1
  175. package/dist/ui/progress.js.map +1 -1
  176. package/dist/ui/radio.js +1 -1
  177. package/dist/ui/radio.js.map +1 -1
  178. package/dist/ui/segmented-control.d.ts +1 -1
  179. package/dist/ui/segmented-control.d.ts.map +1 -1
  180. package/dist/ui/segmented-control.js +5 -7
  181. package/dist/ui/segmented-control.js.map +1 -1
  182. package/dist/ui/select.js +3 -3
  183. package/dist/ui/select.js.map +1 -1
  184. package/dist/ui/sheet.js +2 -2
  185. package/dist/ui/sheet.js.map +1 -1
  186. package/dist/ui/sidebar.js +11 -11
  187. package/dist/ui/sidebar.js.map +1 -1
  188. package/dist/ui/skeleton.js +9 -9
  189. package/dist/ui/skeleton.js.map +1 -1
  190. package/dist/ui/slider.js +2 -2
  191. package/dist/ui/slider.js.map +1 -1
  192. package/dist/ui/split-button.js +7 -7
  193. package/dist/ui/split-button.js.map +1 -1
  194. package/dist/ui/stat-card.js +7 -7
  195. package/dist/ui/stat-card.js.map +1 -1
  196. package/dist/ui/status-dot.js +2 -2
  197. package/dist/ui/status-dot.js.map +1 -1
  198. package/dist/ui/stepper.js +2 -2
  199. package/dist/ui/stepper.js.map +1 -1
  200. package/dist/ui/switch.js +2 -2
  201. package/dist/ui/switch.js.map +1 -1
  202. package/dist/ui/tabs.js +3 -3
  203. package/dist/ui/tabs.js.map +1 -1
  204. package/dist/ui/textarea.js +1 -1
  205. package/dist/ui/textarea.js.map +1 -1
  206. package/dist/ui/toast.js +8 -8
  207. package/dist/ui/toast.js.map +1 -1
  208. package/dist/ui/toggle.js +1 -1
  209. package/dist/ui/toggle.js.map +1 -1
  210. package/dist/ui/tooltip.js +1 -1
  211. package/dist/ui/tooltip.js.map +1 -1
  212. package/docs/components/_header.md +91 -2
  213. package/docs/components/ui/alert.md +4 -1
  214. package/docs/components/ui/banner.md +3 -1
  215. package/docs/components/ui/input.md +4 -2
  216. package/docs/components/ui/segmented-control.md +13 -6
  217. package/docs/recipes/customize-brand.md +297 -0
  218. package/docs/recipes/index.md +51 -0
  219. package/docs/recipes/install-astro.md +178 -0
  220. package/docs/recipes/install-next-app-router.md +230 -0
  221. package/docs/recipes/install-next-pages.md +123 -0
  222. package/docs/recipes/install-remix.md +171 -0
  223. package/docs/recipes/install-tanstack-start.md +143 -0
  224. package/docs/recipes/install-vite.md +170 -0
  225. package/docs/recipes/server-components.md +209 -0
  226. package/docs/recipes/troubleshoot.md +217 -0
  227. package/llms-full.txt +116 -54
  228. package/llms.txt +42 -17
  229. package/package.json +46 -35
  230. package/skill/README.md +99 -0
  231. package/skill/SKILL.md +144 -0
  232. package/skill/install.sh +59 -0
  233. package/skill/references/components-full.md +6997 -0
  234. package/skill/references/components.md +673 -0
  235. package/skill/references/customize-brand.md +299 -0
  236. package/skill/references/server-components.md +211 -0
  237. package/skill/references/setup-astro.md +180 -0
  238. package/skill/references/setup-next-app-router.md +232 -0
  239. package/skill/references/setup-next-pages.md +125 -0
  240. package/skill/references/setup-remix.md +173 -0
  241. package/skill/references/setup-tanstack-start.md +145 -0
  242. package/skill/references/setup-vite.md +172 -0
  243. package/skill/references/troubleshoot.md +219 -0
  244. package/dist/composed/responsive-overlay.d.ts +0 -23
  245. package/dist/composed/responsive-overlay.d.ts.map +0 -1
  246. package/dist/composed/responsive-overlay.js +0 -40
  247. package/dist/composed/responsive-overlay.js.map +0 -1
  248. package/dist/hooks/use-toast.d.ts +0 -17
  249. package/dist/hooks/use-toast.d.ts.map +0 -1
  250. package/dist/hooks/use-toast.js +0 -3
  251. package/dist/tailwind/index.cjs +0 -41
  252. package/dist/tailwind/index.d.ts +0 -2
  253. package/dist/tailwind/index.d.ts.map +0 -1
  254. package/dist/tailwind/index.js +0 -2
  255. package/dist/tailwind/preset.d.ts +0 -25
  256. package/dist/tailwind/preset.d.ts.map +0 -1
  257. package/dist/tailwind/preset.js +0 -17
  258. package/dist/tailwind/preset.js.map +0 -1
  259. package/docs/components/composed/responsive-overlay.md +0 -41
  260. /package/{LICENSE → skill/LICENSE} +0 -0
@@ -3,7 +3,7 @@ import { cn as t } from "../ui/lib/utils.js";
3
3
  import * as n from "react";
4
4
  import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
5
5
  //#region src/composed/content-card.tsx
6
- var o = e("rounded-ds-lg will-change-[box-shadow] transition-[color,background-color,border-color,box-shadow] duration-fast-02 ease-productive-standard", {
6
+ var o = e("rounded-surface will-change-[box-shadow] transition-[color,background-color,border-color,box-shadow] duration-fast-02 ease-productive-standard", {
7
7
  variants: {
8
8
  variant: {
9
9
  default: "border border-surface-border-strong bg-surface-raised shadow-raised hover:shadow-raised-hover",
@@ -1 +1 @@
1
- {"version":3,"file":"content-card.js","names":[],"sources":["../../src/composed/content-card.tsx"],"sourcesContent":["// @server-safe\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { cn } from '../ui/lib/utils'\n\nconst contentCardVariants = cva(\n 'rounded-ds-lg will-change-[box-shadow] transition-[color,background-color,border-color,box-shadow] duration-fast-02 ease-productive-standard',\n {\n variants: {\n variant: {\n default:\n 'border border-surface-border-strong bg-surface-raised shadow-raised hover:shadow-raised-hover',\n outline:\n 'border border-surface-border bg-transparent hover:border-surface-border-strong',\n ghost:\n 'border border-transparent bg-transparent hover:bg-surface-raised',\n },\n padding: {\n default: 'p-ds-05b',\n compact: 'p-ds-04',\n spacious: 'p-ds-06',\n none: 'p-0',\n },\n },\n defaultVariants: {\n variant: 'default',\n padding: 'default',\n },\n },\n)\n\nconst getPadding = (padding: string | null | undefined) => {\n switch (padding) {\n case 'compact': return 'px-ds-04 py-ds-03'\n case 'spacious': return 'px-ds-06 py-ds-05'\n default: return 'px-ds-05b py-ds-04'\n }\n}\n\nconst getContentPadding = (padding: string | null | undefined) => {\n switch (padding) {\n case 'compact': return 'p-ds-04'\n case 'spacious': return 'p-ds-06'\n default: return 'p-ds-05b'\n }\n}\n\nexport interface ContentCardProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof contentCardVariants> {\n header?: React.ReactNode\n headerTitle?: string\n headerActions?: React.ReactNode\n footer?: React.ReactNode\n}\n\nconst ContentCard = React.forwardRef<HTMLDivElement, ContentCardProps>(\n (\n {\n variant,\n padding,\n header,\n headerTitle,\n headerActions,\n footer,\n className,\n children,\n ...props\n },\n ref,\n ) => {\n const hasHeader = header || headerTitle || headerActions\n\n return (\n <div\n ref={ref}\n className={cn(\n contentCardVariants({ variant, padding: hasHeader || footer ? 'none' : padding }),\n className,\n )}\n {...props}\n >\n {hasHeader && (\n <div\n className={cn(\n 'flex items-center justify-between border-b border-surface-border-strong',\n getPadding(padding),\n )}\n >\n {header ?? (\n <>\n {headerTitle && (\n <h3 className=\"text-ds-base font-semibold text-surface-fg\">\n {headerTitle}\n </h3>\n )}\n {headerActions && (\n <div className=\"flex items-center gap-ds-03\">{headerActions}</div>\n )}\n </>\n )}\n </div>\n )}\n\n <div\n className={cn(\n (hasHeader || footer) && getContentPadding(padding),\n )}\n >\n {children}\n </div>\n\n {footer && (\n <div\n className={cn(\n 'border-t border-surface-border-strong',\n getPadding(padding),\n )}\n >\n {footer}\n </div>\n )}\n </div>\n )\n },\n)\nContentCard.displayName = 'ContentCard'\n\nexport { ContentCard, contentCardVariants }\n"],"mappings":";;;;;AAMA,IAAM,IAAsB,EAC1B,gJACA;CACE,UAAU;EACR,SAAS;GACP,SACE;GACF,SACE;GACF,OACE;GACH;EACD,SAAS;GACP,SAAS;GACT,SAAS;GACT,UAAU;GACV,MAAM;GACP;EACF;CACD,iBAAiB;EACf,SAAS;EACT,SAAS;EACV;CACF,CACF,EAEK,KAAc,MAAuC;AACzD,SAAQ,GAAR;EACE,KAAK,UAAW,QAAO;EACvB,KAAK,WAAY,QAAO;EACxB,QAAS,QAAO;;GAId,KAAqB,MAAuC;AAChE,SAAQ,GAAR;EACE,KAAK,UAAW,QAAO;EACvB,KAAK,WAAY,QAAO;EACxB,QAAS,QAAO;;GAad,IAAc,EAAM,YAEtB,EACE,YACA,YACA,WACA,gBACA,kBACA,WACA,cACA,aACA,GAAG,KAEL,MACG;CACH,IAAM,IAAY,KAAU,KAAe;AAE3C,QACE,kBAAC,OAAD;EACO;EACL,WAAW,EACT,EAAoB;GAAE;GAAS,SAAS,KAAa,IAAS,SAAS;GAAS,CAAC,EACjF,EACD;EACD,GAAI;YANN;GAQG,KACC,kBAAC,OAAD;IACE,WAAW,EACT,2EACA,EAAW,EAAQ,CACpB;cAEA,KACC,kBAAA,GAAA,EAAA,UAAA,CACG,KACC,kBAAC,MAAD;KAAI,WAAU;eACX;KACE,CAAA,EAEN,KACC,kBAAC,OAAD;KAAK,WAAU;eAA+B;KAAoB,CAAA,CAEnE,EAAA,CAAA;IAED,CAAA;GAGR,kBAAC,OAAD;IACE,WAAW,GACR,KAAa,MAAW,EAAkB,EAAQ,CACpD;IAEA;IACG,CAAA;GAEL,KACC,kBAAC,OAAD;IACE,WAAW,EACT,yCACA,EAAW,EAAQ,CACpB;cAEA;IACG,CAAA;GAEJ;;EAGX;AACD,EAAY,cAAc"}
1
+ {"version":3,"file":"content-card.js","names":[],"sources":["../../src/composed/content-card.tsx"],"sourcesContent":["// @server-safe\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { cn } from '../ui/lib/utils'\n\nconst contentCardVariants = cva(\n 'rounded-surface will-change-[box-shadow] transition-[color,background-color,border-color,box-shadow] duration-fast-02 ease-productive-standard',\n {\n variants: {\n variant: {\n default:\n 'border border-surface-border-strong bg-surface-raised shadow-raised hover:shadow-raised-hover',\n outline:\n 'border border-surface-border bg-transparent hover:border-surface-border-strong',\n ghost:\n 'border border-transparent bg-transparent hover:bg-surface-raised',\n },\n padding: {\n default: 'p-ds-05b',\n compact: 'p-ds-04',\n spacious: 'p-ds-06',\n none: 'p-0',\n },\n },\n defaultVariants: {\n variant: 'default',\n padding: 'default',\n },\n },\n)\n\nconst getPadding = (padding: string | null | undefined) => {\n switch (padding) {\n case 'compact': return 'px-ds-04 py-ds-03'\n case 'spacious': return 'px-ds-06 py-ds-05'\n default: return 'px-ds-05b py-ds-04'\n }\n}\n\nconst getContentPadding = (padding: string | null | undefined) => {\n switch (padding) {\n case 'compact': return 'p-ds-04'\n case 'spacious': return 'p-ds-06'\n default: return 'p-ds-05b'\n }\n}\n\nexport interface ContentCardProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof contentCardVariants> {\n header?: React.ReactNode\n headerTitle?: string\n headerActions?: React.ReactNode\n footer?: React.ReactNode\n}\n\nconst ContentCard = React.forwardRef<HTMLDivElement, ContentCardProps>(\n (\n {\n variant,\n padding,\n header,\n headerTitle,\n headerActions,\n footer,\n className,\n children,\n ...props\n },\n ref,\n ) => {\n const hasHeader = header || headerTitle || headerActions\n\n return (\n <div\n ref={ref}\n className={cn(\n contentCardVariants({ variant, padding: hasHeader || footer ? 'none' : padding }),\n className,\n )}\n {...props}\n >\n {hasHeader && (\n <div\n className={cn(\n 'flex items-center justify-between border-b border-surface-border-strong',\n getPadding(padding),\n )}\n >\n {header ?? (\n <>\n {headerTitle && (\n <h3 className=\"text-ds-base font-semibold text-surface-fg\">\n {headerTitle}\n </h3>\n )}\n {headerActions && (\n <div className=\"flex items-center gap-ds-03\">{headerActions}</div>\n )}\n </>\n )}\n </div>\n )}\n\n <div\n className={cn(\n (hasHeader || footer) && getContentPadding(padding),\n )}\n >\n {children}\n </div>\n\n {footer && (\n <div\n className={cn(\n 'border-t border-surface-border-strong',\n getPadding(padding),\n )}\n >\n {footer}\n </div>\n )}\n </div>\n )\n },\n)\nContentCard.displayName = 'ContentCard'\n\nexport { ContentCard, contentCardVariants }\n"],"mappings":";;;;;AAMA,IAAM,IAAsB,EAC1B,kJACA;CACE,UAAU;EACR,SAAS;GACP,SACE;GACF,SACE;GACF,OACE;GACH;EACD,SAAS;GACP,SAAS;GACT,SAAS;GACT,UAAU;GACV,MAAM;GACP;EACF;CACD,iBAAiB;EACf,SAAS;EACT,SAAS;EACV;CACF,CACF,EAEK,KAAc,MAAuC;AACzD,SAAQ,GAAR;EACE,KAAK,UAAW,QAAO;EACvB,KAAK,WAAY,QAAO;EACxB,QAAS,QAAO;;GAId,KAAqB,MAAuC;AAChE,SAAQ,GAAR;EACE,KAAK,UAAW,QAAO;EACvB,KAAK,WAAY,QAAO;EACxB,QAAS,QAAO;;GAad,IAAc,EAAM,YAEtB,EACE,YACA,YACA,WACA,gBACA,kBACA,WACA,cACA,aACA,GAAG,KAEL,MACG;CACH,IAAM,IAAY,KAAU,KAAe;AAE3C,QACE,kBAAC,OAAD;EACO;EACL,WAAW,EACT,EAAoB;GAAE;GAAS,SAAS,KAAa,IAAS,SAAS;GAAS,CAAC,EACjF,EACD;EACD,GAAI;YANN;GAQG,KACC,kBAAC,OAAD;IACE,WAAW,EACT,2EACA,EAAW,EAAQ,CACpB;cAEA,KACC,kBAAA,GAAA,EAAA,UAAA,CACG,KACC,kBAAC,MAAD;KAAI,WAAU;eACX;KACE,CAAA,EAEN,KACC,kBAAC,OAAD;KAAK,WAAU;eAA+B;KAAoB,CAAA,CAEnE,EAAA,CAAA;IAED,CAAA;GAGR,kBAAC,OAAD;IACE,WAAW,GACR,KAAa,MAAW,EAAkB,EAAQ,CACpD;IAEA;IACG,CAAA;GAEL,KACC,kBAAC,OAAD;IACE,WAAW,EACT,yCACA,EAAW,EAAQ,CACpB;cAEA;IACG,CAAA;GAEJ;;EAGX;AACD,EAAY,cAAc"}
@@ -36,8 +36,8 @@ function m({ onSelect: n, set: r = "native", theme: i = "auto", previewPosition:
36
36
  className: h,
37
37
  children: /* @__PURE__ */ s(o.Suspense, {
38
38
  fallback: /* @__PURE__ */ s("div", {
39
- className: t("rounded-ds-lg", h),
40
- children: /* @__PURE__ */ s(a, { className: "h-[435px] w-[352px] rounded-ds-lg" })
39
+ className: t("rounded-surface", h),
40
+ children: /* @__PURE__ */ s(a, { className: "h-[435px] w-[352px] rounded-surface" })
41
41
  }),
42
42
  children: /* @__PURE__ */ s(d, {
43
43
  data: v,
@@ -53,8 +53,8 @@ function m({ onSelect: n, set: r = "native", theme: i = "auto", previewPosition:
53
53
  animate: { opacity: 1 },
54
54
  exit: { opacity: 0 },
55
55
  transition: e.snappy,
56
- className: t("rounded-ds-lg", h),
57
- children: /* @__PURE__ */ s(a, { className: "h-[435px] w-[352px] rounded-ds-lg" })
56
+ className: t("rounded-surface", h),
57
+ children: /* @__PURE__ */ s(a, { className: "h-[435px] w-[352px] rounded-surface" })
58
58
  }, "skeleton")
59
59
  });
60
60
  }
@@ -1 +1 @@
1
- {"version":3,"file":"emoji-picker.js","names":[],"sources":["../../src/composed/emoji-picker.tsx"],"sourcesContent":["'use client'\n\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { springs } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\nimport {\n Popover,\n PopoverContent,\n PopoverTrigger,\n} from '../ui/popover'\nimport { Skeleton } from '../ui/skeleton'\n\n// ============================================================\n// Types\n// ============================================================\n\nexport interface EmojiData {\n id: string\n native: string\n shortcodes?: string\n}\n\nexport type EmojiSet = 'native' | 'apple' | 'google' | 'twitter' | 'facebook'\n\nexport interface EmojiPickerProps {\n onSelect: (emoji: EmojiData) => void\n /** Emoji art style. Set once — dynamic switching is not supported (emoji-mart limitation). @default 'native' */\n set?: EmojiSet\n /** @default 'auto' */\n theme?: 'auto' | 'light' | 'dark'\n /** @default 'none' */\n previewPosition?: 'top' | 'bottom' | 'none'\n /** @default 'search' */\n skinTonePosition?: 'search' | 'preview' | 'none'\n className?: string\n}\n\nexport interface EmojiPickerPopoverProps extends EmojiPickerProps {\n children: React.ReactNode\n /** @default 'start' */\n align?: 'start' | 'center' | 'end'\n}\n\n// ============================================================\n// Lazy-loaded picker\n// ============================================================\n\nconst LazyPicker = React.lazy(() =>\n import('@emoji-mart/react').then((mod) => ({\n default: mod.default,\n })),\n)\n\n// emoji-mart caches data in a module-level singleton that is set once and never\n// replaced. Each set (apple, google, etc.) needs its own data file with\n// spritesheet x/y coordinates. The `set` prop should be treated as immutable\n// configuration — dynamic switching within a single page is NOT supported.\nexport const emojiDataLoaders: Record<string, () => Promise<{ default: unknown }>> = {\n native: () => import('@emoji-mart/data'),\n apple: () => import('@emoji-mart/data/sets/15/apple.json'),\n google: () => import('@emoji-mart/data/sets/15/google.json'),\n twitter: () => import('@emoji-mart/data/sets/15/twitter.json'),\n facebook: () => import('@emoji-mart/data/sets/15/facebook.json'),\n}\n\nfunction resolveTheme(theme: 'auto' | 'light' | 'dark'): 'light' | 'dark' {\n if (theme !== 'auto') return theme\n if (typeof document === 'undefined') return 'light'\n return document.documentElement.classList.contains('dark') ? 'dark' : 'light'\n}\n\n// ============================================================\n// EmojiPicker\n// ============================================================\n\nfunction EmojiPicker({\n onSelect,\n set = 'native',\n theme = 'auto',\n previewPosition = 'none',\n skinTonePosition = 'search',\n className,\n}: EmojiPickerProps) {\n const [mounted, setMounted] = React.useState(false)\n const [data, setData] = React.useState<unknown>(null)\n\n React.useEffect(() => {\n setMounted(true)\n const loader = emojiDataLoaders[set] ?? emojiDataLoaders.native\n loader().then((mod) => setData(mod.default))\n }, [set])\n\n const isReady = mounted && !!data\n\n return (\n <AnimatePresence mode=\"wait\">\n {!isReady ? (\n <motion.div\n key=\"skeleton\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={springs.snappy}\n className={cn('rounded-ds-lg', className)}\n >\n <Skeleton className=\"h-[435px] w-[352px] rounded-ds-lg\" />\n </motion.div>\n ) : (\n <motion.div\n key=\"picker\"\n initial={{ opacity: 0, scale: 0.95 }}\n animate={{ opacity: 1, scale: 1 }}\n transition={springs.snappy}\n className={className}\n >\n <React.Suspense\n fallback={\n <div className={cn('rounded-ds-lg', className)}>\n <Skeleton className=\"h-[435px] w-[352px] rounded-ds-lg\" />\n </div>\n }\n >\n <LazyPicker\n data={data}\n set={set}\n onEmojiSelect={onSelect}\n theme={resolveTheme(theme)}\n previewPosition={previewPosition}\n skinTonePosition={skinTonePosition}\n />\n </React.Suspense>\n </motion.div>\n )}\n </AnimatePresence>\n )\n}\n\n// ============================================================\n// EmojiPickerPopover\n// ============================================================\n\nfunction EmojiPickerPopover({\n children,\n align = 'start',\n onSelect,\n set,\n theme,\n previewPosition,\n skinTonePosition,\n className,\n}: EmojiPickerPopoverProps) {\n const [open, setOpen] = React.useState(false)\n\n const handleSelect = (emoji: EmojiData) => {\n onSelect(emoji)\n setOpen(false)\n }\n\n return (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild>{children}</PopoverTrigger>\n <PopoverContent\n align={align}\n className=\"w-auto border-none bg-transparent p-0 shadow-none\"\n sideOffset={8}\n >\n <EmojiPicker\n onSelect={handleSelect}\n set={set}\n theme={theme}\n previewPosition={previewPosition}\n skinTonePosition={skinTonePosition}\n className={className}\n />\n </PopoverContent>\n </Popover>\n )\n}\n\nEmojiPicker.displayName = 'EmojiPicker'\nEmojiPickerPopover.displayName = 'EmojiPickerPopover'\n\nexport { EmojiPicker, EmojiPickerPopover }\n"],"mappings":";;;;;;;;;AAiDA,IAAM,IAAa,EAAM,WACvB,OAAO,qBAAqB,MAAM,OAAS,EACzC,SAAS,EAAI,SACd,EAAE,CACJ,EAMY,IAAwE;CACnF,cAAc,OAAO;CACrB,aAAa,OAAO;CACpB,cAAc,OAAO;CACrB,eAAe,OAAO;CACtB,gBAAgB,OAAO;CACxB;AAED,SAAS,EAAa,GAAoD;AAGxE,QAFI,MAAU,SACV,OAAO,WAAa,MAAoB,UACrC,SAAS,gBAAgB,UAAU,SAAS,OAAO,GAAG,SAAS,UAFzC;;AAS/B,SAAS,EAAY,EACnB,aACA,SAAM,UACN,WAAQ,QACR,qBAAkB,QAClB,sBAAmB,UACnB,gBACmB;CACnB,IAAM,CAAC,GAAS,KAAc,EAAM,SAAS,GAAM,EAC7C,CAAC,GAAM,KAAW,EAAM,SAAkB,KAAK;AAUrD,QARA,EAAM,gBAAgB;AAGpB,EAFA,EAAW,GAAK,GACD,EAAiB,MAAQ,EAAiB,SACjD,CAAC,MAAM,MAAQ,EAAQ,EAAI,QAAQ,CAAC;IAC3C,CAAC,EAAI,CAAC,EAKP,kBAAC,GAAD;EAAiB,MAAK;YAHR,KAAa,IAgBvB,kBAAC,EAAO,KAAR;GAEE,SAAS;IAAE,SAAS;IAAG,OAAO;IAAM;GACpC,SAAS;IAAE,SAAS;IAAG,OAAO;IAAG;GACjC,YAAY,EAAQ;GACT;aAEX,kBAAC,EAAM,UAAP;IACE,UACE,kBAAC,OAAD;KAAK,WAAW,EAAG,iBAAiB,EAAU;eAC5C,kBAAC,GAAD,EAAU,WAAU,qCAAsC,CAAA;KACtD,CAAA;cAGR,kBAAC,GAAD;KACQ;KACD;KACL,eAAe;KACf,OAAO,EAAa,EAAM;KACT;KACC;KAClB,CAAA;IACa,CAAA;GACN,EAtBP,SAsBO,GAlCb,kBAAC,EAAO,KAAR;GAEE,SAAS,EAAE,SAAS,GAAG;GACvB,SAAS,EAAE,SAAS,GAAG;GACvB,MAAM,EAAE,SAAS,GAAG;GACpB,YAAY,EAAQ;GACpB,WAAW,EAAG,iBAAiB,EAAU;aAEzC,kBAAC,GAAD,EAAU,WAAU,qCAAsC,CAAA;GAC/C,EARP,WAQO;EA2BC,CAAA;;AAQtB,SAAS,EAAmB,EAC1B,aACA,WAAQ,SACR,aACA,QACA,UACA,oBACA,qBACA,gBAC0B;CAC1B,IAAM,CAAC,GAAM,KAAW,EAAM,SAAS,GAAM;AAO7C,QACE,kBAAC,GAAD;EAAe;EAAM,cAAc;YAAnC,CACE,kBAAC,GAAD;GAAgB,SAAA;GAAS;GAA0B,CAAA,EACnD,kBAAC,GAAD;GACS;GACP,WAAU;GACV,YAAY;aAEZ,kBAAC,GAAD;IACE,WAdc,MAAqB;AAEzC,KADA,EAAS,EAAM,EACf,EAAQ,GAAM;;IAaH;IACE;IACU;IACC;IACP;IACX,CAAA;GACa,CAAA,CACT;;;AAId,EAAY,cAAc,eAC1B,EAAmB,cAAc"}
1
+ {"version":3,"file":"emoji-picker.js","names":[],"sources":["../../src/composed/emoji-picker.tsx"],"sourcesContent":["'use client'\n\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { springs } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\nimport {\n Popover,\n PopoverContent,\n PopoverTrigger,\n} from '../ui/popover'\nimport { Skeleton } from '../ui/skeleton'\n\n// ============================================================\n// Types\n// ============================================================\n\nexport interface EmojiData {\n id: string\n native: string\n shortcodes?: string\n}\n\nexport type EmojiSet = 'native' | 'apple' | 'google' | 'twitter' | 'facebook'\n\nexport interface EmojiPickerProps {\n onSelect: (emoji: EmojiData) => void\n /** Emoji art style. Set once — dynamic switching is not supported (emoji-mart limitation). @default 'native' */\n set?: EmojiSet\n /** @default 'auto' */\n theme?: 'auto' | 'light' | 'dark'\n /** @default 'none' */\n previewPosition?: 'top' | 'bottom' | 'none'\n /** @default 'search' */\n skinTonePosition?: 'search' | 'preview' | 'none'\n className?: string\n}\n\nexport interface EmojiPickerPopoverProps extends EmojiPickerProps {\n children: React.ReactNode\n /** @default 'start' */\n align?: 'start' | 'center' | 'end'\n}\n\n// ============================================================\n// Lazy-loaded picker\n// ============================================================\n\nconst LazyPicker = React.lazy(() =>\n import('@emoji-mart/react').then((mod) => ({\n default: mod.default,\n })),\n)\n\n// emoji-mart caches data in a module-level singleton that is set once and never\n// replaced. Each set (apple, google, etc.) needs its own data file with\n// spritesheet x/y coordinates. The `set` prop should be treated as immutable\n// configuration — dynamic switching within a single page is NOT supported.\nexport const emojiDataLoaders: Record<string, () => Promise<{ default: unknown }>> = {\n native: () => import('@emoji-mart/data'),\n apple: () => import('@emoji-mart/data/sets/15/apple.json'),\n google: () => import('@emoji-mart/data/sets/15/google.json'),\n twitter: () => import('@emoji-mart/data/sets/15/twitter.json'),\n facebook: () => import('@emoji-mart/data/sets/15/facebook.json'),\n}\n\nfunction resolveTheme(theme: 'auto' | 'light' | 'dark'): 'light' | 'dark' {\n if (theme !== 'auto') return theme\n if (typeof document === 'undefined') return 'light'\n return document.documentElement.classList.contains('dark') ? 'dark' : 'light'\n}\n\n// ============================================================\n// EmojiPicker\n// ============================================================\n\nfunction EmojiPicker({\n onSelect,\n set = 'native',\n theme = 'auto',\n previewPosition = 'none',\n skinTonePosition = 'search',\n className,\n}: EmojiPickerProps) {\n const [mounted, setMounted] = React.useState(false)\n const [data, setData] = React.useState<unknown>(null)\n\n React.useEffect(() => {\n setMounted(true)\n const loader = emojiDataLoaders[set] ?? emojiDataLoaders.native\n loader().then((mod) => setData(mod.default))\n }, [set])\n\n const isReady = mounted && !!data\n\n return (\n <AnimatePresence mode=\"wait\">\n {!isReady ? (\n <motion.div\n key=\"skeleton\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={springs.snappy}\n className={cn('rounded-surface', className)}\n >\n <Skeleton className=\"h-[435px] w-[352px] rounded-surface\" />\n </motion.div>\n ) : (\n <motion.div\n key=\"picker\"\n initial={{ opacity: 0, scale: 0.95 }}\n animate={{ opacity: 1, scale: 1 }}\n transition={springs.snappy}\n className={className}\n >\n <React.Suspense\n fallback={\n <div className={cn('rounded-surface', className)}>\n <Skeleton className=\"h-[435px] w-[352px] rounded-surface\" />\n </div>\n }\n >\n <LazyPicker\n data={data}\n set={set}\n onEmojiSelect={onSelect}\n theme={resolveTheme(theme)}\n previewPosition={previewPosition}\n skinTonePosition={skinTonePosition}\n />\n </React.Suspense>\n </motion.div>\n )}\n </AnimatePresence>\n )\n}\n\n// ============================================================\n// EmojiPickerPopover\n// ============================================================\n\nfunction EmojiPickerPopover({\n children,\n align = 'start',\n onSelect,\n set,\n theme,\n previewPosition,\n skinTonePosition,\n className,\n}: EmojiPickerPopoverProps) {\n const [open, setOpen] = React.useState(false)\n\n const handleSelect = (emoji: EmojiData) => {\n onSelect(emoji)\n setOpen(false)\n }\n\n return (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild>{children}</PopoverTrigger>\n <PopoverContent\n align={align}\n className=\"w-auto border-none bg-transparent p-0 shadow-none\"\n sideOffset={8}\n >\n <EmojiPicker\n onSelect={handleSelect}\n set={set}\n theme={theme}\n previewPosition={previewPosition}\n skinTonePosition={skinTonePosition}\n className={className}\n />\n </PopoverContent>\n </Popover>\n )\n}\n\nEmojiPicker.displayName = 'EmojiPicker'\nEmojiPickerPopover.displayName = 'EmojiPickerPopover'\n\nexport { EmojiPicker, EmojiPickerPopover }\n"],"mappings":";;;;;;;;;AAiDA,IAAM,IAAa,EAAM,WACvB,OAAO,qBAAqB,MAAM,OAAS,EACzC,SAAS,EAAI,SACd,EAAE,CACJ,EAMY,IAAwE;CACnF,cAAc,OAAO;CACrB,aAAa,OAAO;CACpB,cAAc,OAAO;CACrB,eAAe,OAAO;CACtB,gBAAgB,OAAO;CACxB;AAED,SAAS,EAAa,GAAoD;AAGxE,QAFI,MAAU,SACV,OAAO,WAAa,MAAoB,UACrC,SAAS,gBAAgB,UAAU,SAAS,OAAO,GAAG,SAAS,UAFzC;;AAS/B,SAAS,EAAY,EACnB,aACA,SAAM,UACN,WAAQ,QACR,qBAAkB,QAClB,sBAAmB,UACnB,gBACmB;CACnB,IAAM,CAAC,GAAS,KAAc,EAAM,SAAS,GAAM,EAC7C,CAAC,GAAM,KAAW,EAAM,SAAkB,KAAK;AAUrD,QARA,EAAM,gBAAgB;AAGpB,EAFA,EAAW,GAAK,GACD,EAAiB,MAAQ,EAAiB,SACjD,CAAC,MAAM,MAAQ,EAAQ,EAAI,QAAQ,CAAC;IAC3C,CAAC,EAAI,CAAC,EAKP,kBAAC,GAAD;EAAiB,MAAK;YAHR,KAAa,IAgBvB,kBAAC,EAAO,KAAR;GAEE,SAAS;IAAE,SAAS;IAAG,OAAO;IAAM;GACpC,SAAS;IAAE,SAAS;IAAG,OAAO;IAAG;GACjC,YAAY,EAAQ;GACT;aAEX,kBAAC,EAAM,UAAP;IACE,UACE,kBAAC,OAAD;KAAK,WAAW,EAAG,mBAAmB,EAAU;eAC9C,kBAAC,GAAD,EAAU,WAAU,uCAAwC,CAAA;KACxD,CAAA;cAGR,kBAAC,GAAD;KACQ;KACD;KACL,eAAe;KACf,OAAO,EAAa,EAAM;KACT;KACC;KAClB,CAAA;IACa,CAAA;GACN,EAtBP,SAsBO,GAlCb,kBAAC,EAAO,KAAR;GAEE,SAAS,EAAE,SAAS,GAAG;GACvB,SAAS,EAAE,SAAS,GAAG;GACvB,MAAM,EAAE,SAAS,GAAG;GACpB,YAAY,EAAQ;GACpB,WAAW,EAAG,mBAAmB,EAAU;aAE3C,kBAAC,GAAD,EAAU,WAAU,uCAAwC,CAAA;GACjD,EARP,WAQO;EA2BC,CAAA;;AAQtB,SAAS,EAAmB,EAC1B,aACA,WAAQ,SACR,aACA,QACA,UACA,oBACA,qBACA,gBAC0B;CAC1B,IAAM,CAAC,GAAM,KAAW,EAAM,SAAS,GAAM;AAO7C,QACE,kBAAC,GAAD;EAAe;EAAM,cAAc;YAAnC,CACE,kBAAC,GAAD;GAAgB,SAAA;GAAS;GAA0B,CAAA,EACnD,kBAAC,GAAD;GACS;GACP,WAAU;GACV,YAAY;aAEZ,kBAAC,GAAD;IACE,WAdc,MAAqB;AAEzC,KADA,EAAS,EAAM,EACf,EAAQ,GAAM;;IAaH;IACE;IACU;IACC;IACP;IACX,CAAA;GACa,CAAA,CACT;;;AAId,EAAY,cAAc,eAC1B,EAAmB,cAAc"}
@@ -24,7 +24,7 @@ var s = ({ className: e }) => /* @__PURE__ */ r("svg", {
24
24
  ...h,
25
25
  children: [
26
26
  /* @__PURE__ */ r(a.div, {
27
- className: t("flex items-center justify-center rounded-ds-xl bg-surface-raised", f ? "h-ds-md w-ds-md" : "h-ds-lg w-ds-lg", !y && c != null && v),
27
+ className: t("flex items-center justify-center rounded-overlay-lg bg-surface-raised", f ? "h-ds-md w-ds-md" : "h-ds-lg w-ds-lg", !y && c != null && v),
28
28
  animate: _ ? {} : { y: [
29
29
  0,
30
30
  -4,
@@ -1 +1 @@
1
- {"version":3,"file":"empty-state.js","names":[],"sources":["../../src/composed/empty-state.tsx"],"sourcesContent":["'use client'\n\nimport { motion, useReducedMotion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { tweens } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\n\nexport interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement> {\n icon?: React.ReactNode | React.ComponentType<{ className?: string }>\n title: string\n description?: string\n action?: React.ReactNode\n compact?: boolean\n /** Icon size. Defaults to 'sm' when compact, 'md' otherwise. */\n iconSize?: 'sm' | 'md' | 'lg'\n}\n\nconst DevalokChakraIcon = ({ className }: { className?: string }) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 32 32\"\n fill=\"currentColor\"\n className={className}\n aria-hidden=\"true\"\n >\n <path d=\"M25.97,21.39c-0.9-1.85,0.08-3.95-1.72-5.39c1.76-1.44,0.8-3.55,1.69-5.39c0.05-0.12,0.04-0.25-0.02-0.35c-0.06-0.1-0.16-0.18-0.29-0.19c-2.05-0.15-3.35-2.04-5.5-1.21c-0.39-2.21-2.7-2.44-3.84-4.13c-0.08-0.1-0.19-0.16-0.31-0.16c-0.12,0-0.23,0.05-0.31,0.16c-1.14,1.69-3.43,1.92-3.82,4.13c-2.14-0.83-3.47,1.07-5.52,1.21c-0.13,0.01-0.23,0.09-0.29,0.19c-0.06,0.1-0.07,0.23-0.02,0.35c0.9,1.85-0.08,3.95,1.72,5.39c-1.76,1.44-0.8,3.55-1.69,5.39C6,21.51,6.02,21.64,6.07,21.74c0.06,0.1,0.16,0.18,0.29,0.19c2.05,0.15,3.38,2.06,5.52,1.23c0.39,2.21,2.67,2.43,3.82,4.12c0.08,0.1,0.19,0.16,0.31,0.16c0.12,0,0.23-0.05,0.31-0.16c1.14-1.69,3.42-1.92,3.81-4.13c2.14,0.83,3.48-1.07,5.53-1.22c0.13-0.01,0.23-0.09,0.29-0.19C26.01,21.64,26.02,21.51,25.97,21.39z\" />\n </svg>\n)\n\nconst EmptyState = React.forwardRef<HTMLDivElement, EmptyStateProps>(\n (\n {\n icon,\n title,\n description,\n action,\n compact = false,\n iconSize,\n className,\n ...props\n },\n ref,\n ) => {\n const reducedMotion = useReducedMotion()\n const resolvedIconSize = iconSize ?? (compact ? 'sm' : 'md')\n const iconSizeMap = {\n sm: 'h-ico-sm w-ico-sm',\n md: 'h-ico-lg w-ico-lg',\n lg: 'h-ico-xl w-ico-xl',\n } as const\n const iconSizeClass = iconSizeMap[resolvedIconSize]\n const isComponentType =\n icon != null && !React.isValidElement(icon) && (typeof icon === 'function' || (typeof icon === 'object' && '$$typeof' in (icon as object)))\n const resolvedIcon = icon\n ? isComponentType\n ? React.createElement(icon as React.ComponentType<{ className?: string }>, {\n className: cn('text-surface-fg-subtle', iconSizeClass),\n })\n : icon\n : (\n <DevalokChakraIcon\n className={cn('text-surface-fg-subtle', iconSizeClass)}\n />\n )\n\n return (\n <div\n ref={ref}\n className={cn(\n 'flex flex-col items-center justify-center text-center',\n compact ? 'gap-ds-04 py-ds-07' : 'gap-ds-05 py-ds-10',\n className,\n )}\n {...props}\n >\n <motion.div\n className={cn(\n 'flex items-center justify-center rounded-ds-xl bg-surface-raised',\n compact ? 'h-ds-md w-ds-md' : 'h-ds-lg w-ds-lg',\n !isComponentType && icon != null && iconSizeClass,\n )}\n animate={reducedMotion ? {} : { y: [0, -4, 0] }}\n transition={reducedMotion ? {} : { repeat: Infinity, duration: 3, ease: 'easeInOut' }}\n >\n {resolvedIcon}\n </motion.div>\n\n <motion.div\n className=\"flex max-w-[280px] flex-col gap-ds-02\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ delay: 0.2, ...tweens.fade }}\n >\n <h3\n className={cn(\n 'text-surface-fg',\n compact ? 'text-ds-md font-semibold' : 'text-ds-base font-semibold',\n )}\n >\n {title}\n </h3>\n {description && (\n <p\n className={cn(\n 'text-surface-fg-subtle',\n compact ? 'text-ds-sm' : 'text-ds-md',\n )}\n >\n {description}\n </p>\n )}\n </motion.div>\n\n {action && <div className=\"mt-ds-02\">{action}</div>}\n </div>\n )\n },\n)\nEmptyState.displayName = 'EmptyState'\n\nexport { EmptyState }\n"],"mappings":";;;;;;;AAkBA,IAAM,KAAqB,EAAE,mBAC3B,kBAAC,OAAD;CACE,OAAM;CACN,SAAQ;CACR,MAAK;CACM;CACX,eAAY;WAEZ,kBAAC,QAAD,EAAM,GAAE,iuBAAkuB,CAAA;CACtuB,CAAA,EAGF,IAAa,EAAM,YAErB,EACE,SACA,UACA,gBACA,WACA,aAAU,IACV,aACA,cACA,GAAG,KAEL,MACG;CACH,IAAM,IAAgB,GAAkB,EAOlC,IALc;EAClB,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,CALwB,MAAa,IAAU,OAAO,QAOjD,IACJ,KAAQ,QAAQ,CAAC,EAAM,eAAe,EAAK,KAAK,OAAO,KAAS,cAAe,OAAO,KAAS,YAAY,cAAe,IACtH,IAAe,IACjB,IACE,EAAM,cAAc,GAAqD,EACvE,WAAW,EAAG,0BAA0B,EAAc,EACvD,CAAC,GACF,IAEF,kBAAC,GAAD,EACE,WAAW,EAAG,0BAA0B,EAAc,EACtD,CAAA;AAGN,QACE,kBAAC,OAAD;EACO;EACL,WAAW,EACT,yDACA,IAAU,uBAAuB,sBACjC,EACD;EACD,GAAI;YAPN;GASE,kBAAC,EAAO,KAAR;IACE,WAAW,EACT,oEACA,IAAU,oBAAoB,mBAC9B,CAAC,KAAmB,KAAQ,QAAQ,EACrC;IACD,SAAS,IAAgB,EAAE,GAAG,EAAE,GAAG;KAAC;KAAG;KAAI;KAAE,EAAE;IAC/C,YAAY,IAAgB,EAAE,GAAG;KAAE,QAAQ;KAAU,UAAU;KAAG,MAAM;KAAa;cAEpF;IACU,CAAA;GAEb,kBAAC,EAAO,KAAR;IACE,WAAU;IACV,SAAS,EAAE,SAAS,GAAG;IACvB,SAAS,EAAE,SAAS,GAAG;IACvB,YAAY;KAAE,OAAO;KAAK,GAAG,EAAO;KAAM;cAJ5C,CAME,kBAAC,MAAD;KACE,WAAW,EACT,mBACA,IAAU,6BAA6B,6BACxC;eAEA;KACE,CAAA,EACJ,KACC,kBAAC,KAAD;KACE,WAAW,EACT,0BACA,IAAU,eAAe,aAC1B;eAEA;KACC,CAAA,CAEK;;GAEZ,KAAU,kBAAC,OAAD;IAAK,WAAU;cAAY;IAAa,CAAA;GAC/C;;EAGX;AACD,EAAW,cAAc"}
1
+ {"version":3,"file":"empty-state.js","names":[],"sources":["../../src/composed/empty-state.tsx"],"sourcesContent":["'use client'\n\nimport { motion, useReducedMotion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { tweens } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\n\nexport interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement> {\n icon?: React.ReactNode | React.ComponentType<{ className?: string }>\n title: string\n description?: string\n action?: React.ReactNode\n compact?: boolean\n /** Icon size. Defaults to 'sm' when compact, 'md' otherwise. */\n iconSize?: 'sm' | 'md' | 'lg'\n}\n\nconst DevalokChakraIcon = ({ className }: { className?: string }) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 32 32\"\n fill=\"currentColor\"\n className={className}\n aria-hidden=\"true\"\n >\n <path d=\"M25.97,21.39c-0.9-1.85,0.08-3.95-1.72-5.39c1.76-1.44,0.8-3.55,1.69-5.39c0.05-0.12,0.04-0.25-0.02-0.35c-0.06-0.1-0.16-0.18-0.29-0.19c-2.05-0.15-3.35-2.04-5.5-1.21c-0.39-2.21-2.7-2.44-3.84-4.13c-0.08-0.1-0.19-0.16-0.31-0.16c-0.12,0-0.23,0.05-0.31,0.16c-1.14,1.69-3.43,1.92-3.82,4.13c-2.14-0.83-3.47,1.07-5.52,1.21c-0.13,0.01-0.23,0.09-0.29,0.19c-0.06,0.1-0.07,0.23-0.02,0.35c0.9,1.85-0.08,3.95,1.72,5.39c-1.76,1.44-0.8,3.55-1.69,5.39C6,21.51,6.02,21.64,6.07,21.74c0.06,0.1,0.16,0.18,0.29,0.19c2.05,0.15,3.38,2.06,5.52,1.23c0.39,2.21,2.67,2.43,3.82,4.12c0.08,0.1,0.19,0.16,0.31,0.16c0.12,0,0.23-0.05,0.31-0.16c1.14-1.69,3.42-1.92,3.81-4.13c2.14,0.83,3.48-1.07,5.53-1.22c0.13-0.01,0.23-0.09,0.29-0.19C26.01,21.64,26.02,21.51,25.97,21.39z\" />\n </svg>\n)\n\nconst EmptyState = React.forwardRef<HTMLDivElement, EmptyStateProps>(\n (\n {\n icon,\n title,\n description,\n action,\n compact = false,\n iconSize,\n className,\n ...props\n },\n ref,\n ) => {\n const reducedMotion = useReducedMotion()\n const resolvedIconSize = iconSize ?? (compact ? 'sm' : 'md')\n const iconSizeMap = {\n sm: 'h-ico-sm w-ico-sm',\n md: 'h-ico-lg w-ico-lg',\n lg: 'h-ico-xl w-ico-xl',\n } as const\n const iconSizeClass = iconSizeMap[resolvedIconSize]\n const isComponentType =\n icon != null && !React.isValidElement(icon) && (typeof icon === 'function' || (typeof icon === 'object' && '$$typeof' in (icon as object)))\n const resolvedIcon = icon\n ? isComponentType\n ? React.createElement(icon as React.ComponentType<{ className?: string }>, {\n className: cn('text-surface-fg-subtle', iconSizeClass),\n })\n : icon\n : (\n <DevalokChakraIcon\n className={cn('text-surface-fg-subtle', iconSizeClass)}\n />\n )\n\n return (\n <div\n ref={ref}\n className={cn(\n 'flex flex-col items-center justify-center text-center',\n compact ? 'gap-ds-04 py-ds-07' : 'gap-ds-05 py-ds-10',\n className,\n )}\n {...props}\n >\n <motion.div\n className={cn(\n 'flex items-center justify-center rounded-overlay-lg bg-surface-raised',\n compact ? 'h-ds-md w-ds-md' : 'h-ds-lg w-ds-lg',\n !isComponentType && icon != null && iconSizeClass,\n )}\n animate={reducedMotion ? {} : { y: [0, -4, 0] }}\n transition={reducedMotion ? {} : { repeat: Infinity, duration: 3, ease: 'easeInOut' }}\n >\n {resolvedIcon}\n </motion.div>\n\n <motion.div\n className=\"flex max-w-[280px] flex-col gap-ds-02\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ delay: 0.2, ...tweens.fade }}\n >\n <h3\n className={cn(\n 'text-surface-fg',\n compact ? 'text-ds-md font-semibold' : 'text-ds-base font-semibold',\n )}\n >\n {title}\n </h3>\n {description && (\n <p\n className={cn(\n 'text-surface-fg-subtle',\n compact ? 'text-ds-sm' : 'text-ds-md',\n )}\n >\n {description}\n </p>\n )}\n </motion.div>\n\n {action && <div className=\"mt-ds-02\">{action}</div>}\n </div>\n )\n },\n)\nEmptyState.displayName = 'EmptyState'\n\nexport { EmptyState }\n"],"mappings":";;;;;;;AAkBA,IAAM,KAAqB,EAAE,mBAC3B,kBAAC,OAAD;CACE,OAAM;CACN,SAAQ;CACR,MAAK;CACM;CACX,eAAY;WAEZ,kBAAC,QAAD,EAAM,GAAE,iuBAAkuB,CAAA;CACtuB,CAAA,EAGF,IAAa,EAAM,YAErB,EACE,SACA,UACA,gBACA,WACA,aAAU,IACV,aACA,cACA,GAAG,KAEL,MACG;CACH,IAAM,IAAgB,GAAkB,EAOlC,IALc;EAClB,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,CALwB,MAAa,IAAU,OAAO,QAOjD,IACJ,KAAQ,QAAQ,CAAC,EAAM,eAAe,EAAK,KAAK,OAAO,KAAS,cAAe,OAAO,KAAS,YAAY,cAAe,IACtH,IAAe,IACjB,IACE,EAAM,cAAc,GAAqD,EACvE,WAAW,EAAG,0BAA0B,EAAc,EACvD,CAAC,GACF,IAEF,kBAAC,GAAD,EACE,WAAW,EAAG,0BAA0B,EAAc,EACtD,CAAA;AAGN,QACE,kBAAC,OAAD;EACO;EACL,WAAW,EACT,yDACA,IAAU,uBAAuB,sBACjC,EACD;EACD,GAAI;YAPN;GASE,kBAAC,EAAO,KAAR;IACE,WAAW,EACT,yEACA,IAAU,oBAAoB,mBAC9B,CAAC,KAAmB,KAAQ,QAAQ,EACrC;IACD,SAAS,IAAgB,EAAE,GAAG,EAAE,GAAG;KAAC;KAAG;KAAI;KAAE,EAAE;IAC/C,YAAY,IAAgB,EAAE,GAAG;KAAE,QAAQ;KAAU,UAAU;KAAG,MAAM;KAAa;cAEpF;IACU,CAAA;GAEb,kBAAC,EAAO,KAAR;IACE,WAAU;IACV,SAAS,EAAE,SAAS,GAAG;IACvB,SAAS,EAAE,SAAS,GAAG;IACvB,YAAY;KAAE,OAAO;KAAK,GAAG,EAAO;KAAM;cAJ5C,CAME,kBAAC,MAAD;KACE,WAAW,EACT,mBACA,IAAU,6BAA6B,6BACxC;eAEA;KACE,CAAA,EACJ,KACC,kBAAC,KAAD;KACE,WAAW,EACT,0BACA,IAAU,eAAe,aAC1B;eAEA;KACC,CAAA,CAEK;;GAEZ,KAAU,kBAAC,OAAD;IAAK,WAAU;cAAY;IAAa,CAAA;GAC/C;;EAGX;AACD,EAAW,cAAc"}
@@ -60,10 +60,10 @@ var m = r.forwardRef(function({ error: r, onReset: o, className: s, ...c }, l) {
60
60
  ...c,
61
61
  className: e("flex min-h-[60vh] items-center justify-center p-ds-05", s),
62
62
  children: /* @__PURE__ */ a("div", {
63
- className: "flex w-full max-w-lg flex-col items-center gap-ds-06 rounded-ds-xl border border-surface-border-strong bg-surface-raised p-ds-07 text-center shadow-raised",
63
+ className: "flex w-full max-w-lg flex-col items-center gap-ds-06 rounded-overlay-lg border border-surface-border-strong bg-surface-raised p-ds-07 text-center shadow-raised",
64
64
  children: [
65
65
  /* @__PURE__ */ i("div", {
66
- className: e("flex h-ds-lg w-ds-lg items-center justify-center rounded-ds-2xl", v.bgClass),
66
+ className: e("flex h-ds-lg w-ds-lg items-center justify-center rounded-bubble", v.bgClass),
67
67
  children: /* @__PURE__ */ i(t, {
68
68
  icon: y,
69
69
  size: "2xl",
@@ -97,7 +97,7 @@ var m = r.forwardRef(function({ error: r, onReset: o, className: s, ...c }, l) {
97
97
  })
98
98
  }),
99
99
  _ && g && /* @__PURE__ */ a("div", {
100
- className: "w-full overflow-auto rounded-ds-lg border border-surface-border-strong bg-surface-raised p-ds-05 text-left",
100
+ className: "w-full overflow-auto rounded-surface border border-surface-border-strong bg-surface-raised p-ds-05 text-left",
101
101
  children: [/* @__PURE__ */ i("p", {
102
102
  className: "text-ds-sm mb-ds-03 font-semibold text-surface-fg",
103
103
  children: "Stack Trace (development only)"
@@ -1 +1 @@
1
- {"version":3,"file":"error-boundary.js","names":[],"sources":["../../src/composed/error-boundary.tsx"],"sourcesContent":["'use client'\n\nimport { IconAlertTriangle, IconBan, IconFileUnknown, IconServerOff } from '@tabler/icons-react'\nimport * as React from 'react'\n\nimport { Button } from '../ui/button'\nimport { Icon } from '../ui/icon'\nimport { cn } from '../ui/lib/utils'\n\ndeclare const process: { env: { NODE_ENV?: string } } | undefined\n\nexport interface ErrorDisplayProps extends React.ComponentPropsWithoutRef<'div'> {\n error: unknown\n onReset?: () => void\n}\n\nfunction getStatusFromError(error: unknown): number | undefined {\n if (\n error &&\n typeof error === 'object' &&\n 'status' in error &&\n typeof (error as Record<string, unknown>).status === 'number'\n ) {\n return (error as Record<string, unknown>).status as number\n }\n return undefined\n}\n\nfunction getMessageFromError(error: unknown): string | undefined {\n if (error instanceof Error) {\n return error.message\n }\n if (\n error &&\n typeof error === 'object' &&\n 'data' in error\n ) {\n const data = (error as Record<string, unknown>).data\n if (typeof data === 'string') return data\n if (data && typeof data === 'object' && 'message' in data) {\n return String((data as Record<string, unknown>).message)\n }\n }\n if (typeof error === 'string') {\n return error\n }\n return undefined\n}\n\nfunction getStackFromError(error: unknown): string | undefined {\n if (error instanceof Error) {\n return error.stack\n }\n return undefined\n}\n\nfunction getErrorConfig(status?: number) {\n switch (status) {\n case 404:\n return {\n icon: IconFileUnknown,\n title: 'Page not found',\n message:\n 'The page you are looking for does not exist or has been moved.',\n bgClass: 'bg-accent-2',\n iconClass: 'text-accent-11',\n }\n case 403:\n return {\n icon: IconBan,\n title: 'Access denied',\n message:\n 'You do not have permission to view this page. Contact your administrator if you believe this is a mistake.',\n bgClass: 'bg-warning-3',\n iconClass: 'text-warning-11',\n }\n case 500:\n return {\n icon: IconServerOff,\n title: 'Server error',\n message:\n 'Something went wrong on our end. Please try again later or contact support if the issue persists.',\n bgClass: 'bg-error-3',\n iconClass: 'text-error-11',\n }\n default:\n return {\n icon: IconAlertTriangle,\n title: 'Something went wrong',\n message:\n 'An unexpected error occurred. Please try again or go back to the home page.',\n bgClass: 'bg-accent-2',\n iconClass: 'text-accent-11',\n }\n }\n}\n\nconst ErrorDisplay = React.forwardRef<HTMLDivElement, ErrorDisplayProps>(\n function ErrorDisplay({ error, onReset, className, ...props }, ref) {\n const status = getStatusFromError(error)\n const message = getMessageFromError(error)\n const stack = getStackFromError(error)\n const isDev =\n typeof process !== 'undefined' &&\n process.env &&\n process.env.NODE_ENV === 'development'\n\n const errorConfig = getErrorConfig(status)\n const ErrorIcon = errorConfig.icon\n\n return (\n <div ref={ref} {...props} className={cn(\"flex min-h-[60vh] items-center justify-center p-ds-05\", className)}>\n <div\n className=\"flex w-full max-w-lg flex-col items-center gap-ds-06 rounded-ds-xl border border-surface-border-strong bg-surface-raised p-ds-07 text-center shadow-raised\"\n >\n {/* Error Icon */}\n <div\n className={cn(\n 'flex h-ds-lg w-ds-lg items-center justify-center rounded-ds-2xl',\n errorConfig.bgClass,\n )}\n >\n <Icon\n icon={ErrorIcon}\n size=\"2xl\"\n className={errorConfig.iconClass}\n />\n </div>\n\n {/* Error IconInfoCircle */}\n <div className=\"flex flex-col gap-ds-03\">\n {status && (\n <span className=\"text-ds-sm text-surface-fg-subtle\">\n Error {status}\n </span>\n )}\n <h2 className=\"text-ds-2xl font-semibold text-surface-fg\">\n {errorConfig.title}\n </h2>\n <p className=\"text-ds-base text-surface-fg-subtle\">\n {message || errorConfig.message}\n </p>\n </div>\n\n {/* Actions */}\n {onReset && (\n <div className=\"flex items-center gap-ds-04\">\n <Button\n variant=\"outline\"\n size=\"md\"\n onClick={onReset}\n >\n Try Again\n </Button>\n </div>\n )}\n\n {/* Dev stack trace */}\n {isDev && stack && (\n <div className=\"w-full overflow-auto rounded-ds-lg border border-surface-border-strong bg-surface-raised p-ds-05 text-left\">\n <p className=\"text-ds-sm mb-ds-03 font-semibold text-surface-fg\">\n Stack Trace (development only)\n </p>\n <pre className=\"whitespace-pre-wrap text-ds-sm text-surface-fg-subtle\">\n {stack}\n </pre>\n </div>\n )}\n </div>\n </div>\n )\n},\n)\n\nErrorDisplay.displayName = 'ErrorDisplay'\n\ninterface ErrorBoundaryProps {\n children: React.ReactNode\n /** Optional callback when the user clicks \"Try Again\" */\n onReset?: () => void\n /** Optional custom fallback — receives the caught error. Defaults to ErrorDisplay. */\n fallback?: (props: { error: unknown; onReset?: () => void }) => React.ReactNode\n}\n\ninterface ErrorBoundaryState {\n error: unknown | null\n}\n\nclass ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n constructor(props: ErrorBoundaryProps) {\n super(props)\n this.state = { error: null }\n }\n\n static getDerivedStateFromError(error: unknown): ErrorBoundaryState {\n return { error }\n }\n\n private handleReset = () => {\n this.setState({ error: null })\n this.props.onReset?.()\n }\n\n render() {\n if (this.state.error !== null) {\n if (this.props.fallback) {\n return this.props.fallback({ error: this.state.error, onReset: this.handleReset })\n }\n return <ErrorDisplay error={this.state.error} onReset={this.handleReset} />\n }\n return this.props.children\n }\n}\n\nexport { ErrorBoundary,ErrorDisplay }\nexport type { ErrorBoundaryProps }\n"],"mappings":"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"}
1
+ {"version":3,"file":"error-boundary.js","names":[],"sources":["../../src/composed/error-boundary.tsx"],"sourcesContent":["'use client'\n\nimport { IconAlertTriangle, IconBan, IconFileUnknown, IconServerOff } from '@tabler/icons-react'\nimport * as React from 'react'\n\nimport { Button } from '../ui/button'\nimport { Icon } from '../ui/icon'\nimport { cn } from '../ui/lib/utils'\n\ndeclare const process: { env: { NODE_ENV?: string } } | undefined\n\nexport interface ErrorDisplayProps extends React.ComponentPropsWithoutRef<'div'> {\n error: unknown\n onReset?: () => void\n}\n\nfunction getStatusFromError(error: unknown): number | undefined {\n if (\n error &&\n typeof error === 'object' &&\n 'status' in error &&\n typeof (error as Record<string, unknown>).status === 'number'\n ) {\n return (error as Record<string, unknown>).status as number\n }\n return undefined\n}\n\nfunction getMessageFromError(error: unknown): string | undefined {\n if (error instanceof Error) {\n return error.message\n }\n if (\n error &&\n typeof error === 'object' &&\n 'data' in error\n ) {\n const data = (error as Record<string, unknown>).data\n if (typeof data === 'string') return data\n if (data && typeof data === 'object' && 'message' in data) {\n return String((data as Record<string, unknown>).message)\n }\n }\n if (typeof error === 'string') {\n return error\n }\n return undefined\n}\n\nfunction getStackFromError(error: unknown): string | undefined {\n if (error instanceof Error) {\n return error.stack\n }\n return undefined\n}\n\nfunction getErrorConfig(status?: number) {\n switch (status) {\n case 404:\n return {\n icon: IconFileUnknown,\n title: 'Page not found',\n message:\n 'The page you are looking for does not exist or has been moved.',\n bgClass: 'bg-accent-2',\n iconClass: 'text-accent-11',\n }\n case 403:\n return {\n icon: IconBan,\n title: 'Access denied',\n message:\n 'You do not have permission to view this page. Contact your administrator if you believe this is a mistake.',\n bgClass: 'bg-warning-3',\n iconClass: 'text-warning-11',\n }\n case 500:\n return {\n icon: IconServerOff,\n title: 'Server error',\n message:\n 'Something went wrong on our end. Please try again later or contact support if the issue persists.',\n bgClass: 'bg-error-3',\n iconClass: 'text-error-11',\n }\n default:\n return {\n icon: IconAlertTriangle,\n title: 'Something went wrong',\n message:\n 'An unexpected error occurred. Please try again or go back to the home page.',\n bgClass: 'bg-accent-2',\n iconClass: 'text-accent-11',\n }\n }\n}\n\nconst ErrorDisplay = React.forwardRef<HTMLDivElement, ErrorDisplayProps>(\n function ErrorDisplay({ error, onReset, className, ...props }, ref) {\n const status = getStatusFromError(error)\n const message = getMessageFromError(error)\n const stack = getStackFromError(error)\n const isDev =\n typeof process !== 'undefined' &&\n process.env &&\n process.env.NODE_ENV === 'development'\n\n const errorConfig = getErrorConfig(status)\n const ErrorIcon = errorConfig.icon\n\n return (\n <div ref={ref} {...props} className={cn(\"flex min-h-[60vh] items-center justify-center p-ds-05\", className)}>\n <div\n className=\"flex w-full max-w-lg flex-col items-center gap-ds-06 rounded-overlay-lg border border-surface-border-strong bg-surface-raised p-ds-07 text-center shadow-raised\"\n >\n {/* Error Icon */}\n <div\n className={cn(\n 'flex h-ds-lg w-ds-lg items-center justify-center rounded-bubble',\n errorConfig.bgClass,\n )}\n >\n <Icon\n icon={ErrorIcon}\n size=\"2xl\"\n className={errorConfig.iconClass}\n />\n </div>\n\n {/* Error IconInfoCircle */}\n <div className=\"flex flex-col gap-ds-03\">\n {status && (\n <span className=\"text-ds-sm text-surface-fg-subtle\">\n Error {status}\n </span>\n )}\n <h2 className=\"text-ds-2xl font-semibold text-surface-fg\">\n {errorConfig.title}\n </h2>\n <p className=\"text-ds-base text-surface-fg-subtle\">\n {message || errorConfig.message}\n </p>\n </div>\n\n {/* Actions */}\n {onReset && (\n <div className=\"flex items-center gap-ds-04\">\n <Button\n variant=\"outline\"\n size=\"md\"\n onClick={onReset}\n >\n Try Again\n </Button>\n </div>\n )}\n\n {/* Dev stack trace */}\n {isDev && stack && (\n <div className=\"w-full overflow-auto rounded-surface border border-surface-border-strong bg-surface-raised p-ds-05 text-left\">\n <p className=\"text-ds-sm mb-ds-03 font-semibold text-surface-fg\">\n Stack Trace (development only)\n </p>\n <pre className=\"whitespace-pre-wrap text-ds-sm text-surface-fg-subtle\">\n {stack}\n </pre>\n </div>\n )}\n </div>\n </div>\n )\n},\n)\n\nErrorDisplay.displayName = 'ErrorDisplay'\n\ninterface ErrorBoundaryProps {\n children: React.ReactNode\n /** Optional callback when the user clicks \"Try Again\" */\n onReset?: () => void\n /** Optional custom fallback — receives the caught error. Defaults to ErrorDisplay. */\n fallback?: (props: { error: unknown; onReset?: () => void }) => React.ReactNode\n}\n\ninterface ErrorBoundaryState {\n error: unknown | null\n}\n\nclass ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n constructor(props: ErrorBoundaryProps) {\n super(props)\n this.state = { error: null }\n }\n\n static getDerivedStateFromError(error: unknown): ErrorBoundaryState {\n return { error }\n }\n\n private handleReset = () => {\n this.setState({ error: null })\n this.props.onReset?.()\n }\n\n render() {\n if (this.state.error !== null) {\n if (this.props.fallback) {\n return this.props.fallback({ error: this.state.error, onReset: this.handleReset })\n }\n return <ErrorDisplay error={this.state.error} onReset={this.handleReset} />\n }\n return this.props.children\n }\n}\n\nexport { ErrorBoundary,ErrorDisplay }\nexport type { ErrorBoundaryProps }\n"],"mappings":"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"}
@@ -70,7 +70,7 @@ function b({ label: i, value: a, onValueChange: o, options: s, className: c }) {
70
70
  searchPlaceholder: `Search ${i.toLowerCase()}...`,
71
71
  children: /* @__PURE__ */ m("button", {
72
72
  type: "button",
73
- className: t("flex items-center justify-between gap-ds-02 whitespace-nowrap rounded-ds-md border bg-surface-raised-hover text-surface-fg", "hover:bg-surface-raised-active transition-colors duration-fast-01 ease-productive-standard", {
73
+ className: t("flex items-center justify-between gap-ds-02 whitespace-nowrap rounded-control border bg-surface-raised-hover text-surface-fg", "hover:bg-surface-raised-active transition-colors duration-fast-01 ease-productive-standard", {
74
74
  xs: "h-ds-xs-plus text-ds-sm px-ds-02",
75
75
  sm: "h-ds-sm text-ds-sm px-ds-03",
76
76
  md: "h-ds-md text-ds-md px-ds-04"
@@ -1 +1 @@
1
- {"version":3,"file":"filter-bar.js","names":[],"sources":["../../src/composed/filter-bar.tsx"],"sourcesContent":["'use client'\n\nimport { IconChevronDown } from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Badge } from '../ui/badge'\nimport { Button } from '../ui/button'\nimport { Icon } from '../ui/icon'\nimport { springs } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\nimport { SearchInput } from '../ui/search-input'\nimport {\n Select,\n SelectContent,\n SelectItem,\n SelectTrigger,\n SelectValue,\n} from '../ui/select'\nimport { type MultiSelectItem,MultiSelectPopover } from './multi-select-popover'\n\n// ============================================================\n// Context\n// ============================================================\n\ntype FilterBarSize = 'xs' | 'sm' | 'md'\n\nconst FilterBarContext = React.createContext<{ size: FilterBarSize }>({ size: 'sm' })\n\n// ============================================================\n// FilterBar\n// ============================================================\n\n/**\n * A toolbar for filtering lists/tables. Composes a search input, slot-based\n * filter controls (Select, MultiSelect), and an optional \"Clear all\" button.\n * Size is propagated to all child controls via context.\n */\nexport interface FilterBarProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Controlled search input value. Omit `onSearchChange` to hide the search input entirely. */\n searchValue?: string\n /** Called when the search input changes. If not provided, the search input is hidden. */\n onSearchChange?: (value: string) => void\n searchPlaceholder?: string\n /** When provided, a \"Clear all\" button appears that calls this handler. */\n onClearAll?: () => void\n /** Size propagated to all child controls. @default 'sm' */\n size?: FilterBarSize\n}\n\nconst FilterBar = React.forwardRef<HTMLDivElement, FilterBarProps>(({\n searchValue,\n onSearchChange,\n searchPlaceholder = 'Search...',\n onClearAll,\n size = 'sm',\n children,\n className,\n ...props\n}, ref) => {\n return (\n <FilterBarContext.Provider value={{ size }}>\n <div\n ref={ref}\n className={cn('flex flex-wrap items-center gap-ds-03', className)}\n role=\"toolbar\"\n aria-label=\"Filters\"\n {...props}\n >\n {onSearchChange && (\n <SearchInput\n size={size}\n value={searchValue}\n onChange={(e) => onSearchChange(e.target.value)}\n onClear={searchValue ? () => onSearchChange('') : undefined}\n placeholder={searchPlaceholder}\n className=\"w-48\"\n />\n )}\n {children}\n {onClearAll && (\n <Button variant=\"ghost\" size={size} onClick={onClearAll}>\n Clear all\n </Button>\n )}\n </div>\n </FilterBarContext.Provider>\n )\n})\nFilterBar.displayName = 'FilterBar'\n\n// ============================================================\n// FilterSelect\n// ============================================================\n\nexport interface FilterSelectProps {\n label: string\n value: string\n onValueChange: (value: string) => void\n options: { value: string; label: string }[]\n /** Label for the \"all\" option @default 'All' */\n allLabel?: string\n className?: string\n}\n\nfunction FilterSelect({\n label,\n value,\n onValueChange,\n options,\n allLabel = 'All',\n className,\n}: FilterSelectProps) {\n const { size } = React.useContext(FilterBarContext)\n const isFiltered = value !== '' && value !== 'all'\n\n return (\n <Select value={value} onValueChange={onValueChange}>\n <SelectTrigger\n size={size}\n className={cn('w-40', isFiltered && 'border-accent-7', className)}\n >\n <SelectValue placeholder={label} />\n </SelectTrigger>\n <SelectContent>\n <SelectItem value=\"all\">{allLabel}</SelectItem>\n {options.map((o) => (\n <SelectItem key={o.value} value={o.value}>\n {o.label}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n )\n}\n\n// ============================================================\n// FilterMultiSelect\n// ============================================================\n\nexport interface FilterMultiSelectProps {\n label: string\n value: string[]\n onValueChange: (values: string[]) => void\n options: { value: string; label: string }[]\n className?: string\n}\n\nfunction FilterMultiSelect({\n label,\n value,\n onValueChange,\n options,\n className,\n}: FilterMultiSelectProps) {\n const { size } = React.useContext(FilterBarContext)\n const count = value.length\n\n const items: MultiSelectItem[] = React.useMemo(\n () => options.map((o) => ({ id: o.value, label: o.label })),\n [options],\n )\n\n // Trigger button sized by FilterBar context\n const triggerSizeClasses: Record<string, string> = {\n xs: 'h-ds-xs-plus text-ds-sm px-ds-02',\n sm: 'h-ds-sm text-ds-sm px-ds-03',\n md: 'h-ds-md text-ds-md px-ds-04',\n }\n\n return (\n <MultiSelectPopover\n items={items}\n value={value}\n onValueChange={onValueChange}\n searchPlaceholder={`Search ${label.toLowerCase()}...`}\n >\n <button\n type=\"button\"\n className={cn(\n 'flex items-center justify-between gap-ds-02 whitespace-nowrap rounded-ds-md border bg-surface-raised-hover text-surface-fg',\n 'hover:bg-surface-raised-active transition-colors duration-fast-01 ease-productive-standard',\n triggerSizeClasses[size],\n count > 0 ? 'border-accent-7' : 'border-surface-border-strong',\n 'w-40',\n className,\n )}\n >\n <span className=\"flex items-center gap-ds-02 truncate\">\n <span>{label}</span>\n {count > 0 && (\n <motion.span\n key={count}\n initial={{ scale: 0.8 }}\n animate={{ scale: 1 }}\n transition={springs.bouncy}\n className=\"inline-flex\"\n >\n <Badge size=\"xs\" variant=\"solid\" className=\"ml-ds-01\">\n {count}\n </Badge>\n </motion.span>\n )}\n </span>\n <Icon icon={IconChevronDown} size=\"xs\" className=\"opacity-50 shrink-0\" />\n </button>\n </MultiSelectPopover>\n )\n}\n\nexport { FilterBar, FilterMultiSelect,FilterSelect }\n"],"mappings":";;;;;;;;;;;;;;AA2BA,IAAM,IAAmB,EAAM,cAAuC,EAAE,MAAM,MAAM,CAAC,EAuB/E,IAAY,EAAM,YAA4C,EAClE,gBACA,mBACA,uBAAoB,aACpB,eACA,UAAO,MACP,aACA,cACA,GAAG,KACF,MAEC,kBAAC,EAAiB,UAAlB;CAA2B,OAAO,EAAE,SAAM;WACxC,kBAAC,OAAD;EACO;EACL,WAAW,EAAG,yCAAyC,EAAU;EACjE,MAAK;EACL,cAAW;EACX,GAAI;YALN;GAOG,KACC,kBAAC,GAAD;IACQ;IACN,OAAO;IACP,WAAW,MAAM,EAAe,EAAE,OAAO,MAAM;IAC/C,SAAS,UAAoB,EAAe,GAAG,GAAG,KAAA;IAClD,aAAa;IACb,WAAU;IACV,CAAA;GAEH;GACA,KACC,kBAAC,GAAD;IAAQ,SAAQ;IAAc;IAAM,SAAS;cAAY;IAEhD,CAAA;GAEP;;CACoB,CAAA,CAE9B;AACF,EAAU,cAAc;AAgBxB,SAAS,EAAa,EACpB,UACA,UACA,kBACA,YACA,cAAW,OACX,gBACoB;CACpB,IAAM,EAAE,YAAS,EAAM,WAAW,EAAiB;AAGnD,QACE,kBAAC,GAAD;EAAe;EAAsB;YAArC,CACE,kBAAC,GAAD;GACQ;GACN,WAAW,EAAG,QAND,MAAU,MAAM,MAAU,SAMH,mBAAmB,EAAU;aAEjE,kBAAC,GAAD,EAAa,aAAa,GAAS,CAAA;GACrB,CAAA,EAChB,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;GAAY,OAAM;aAAO;GAAsB,CAAA,EAC9C,EAAQ,KAAK,MACZ,kBAAC,GAAD;GAA0B,OAAO,EAAE;aAChC,EAAE;GACQ,EAFI,EAAE,MAEN,CACb,CACY,EAAA,CAAA,CACT;;;AAgBb,SAAS,EAAkB,EACzB,UACA,UACA,kBACA,YACA,gBACyB;CACzB,IAAM,EAAE,YAAS,EAAM,WAAW,EAAiB,EAC7C,IAAQ,EAAM;AAcpB,QACE,kBAAC,GAAD;EACS,OAdsB,EAAM,cAC/B,EAAQ,KAAK,OAAO;GAAE,IAAI,EAAE;GAAO,OAAO,EAAE;GAAO,EAAE,EAC3D,CAAC,EAAQ,CACV;EAYU;EACQ;EACf,mBAAmB,UAAU,EAAM,aAAa,CAAC;YAEjD,kBAAC,UAAD;GACE,MAAK;GACL,WAAW,EACT,8HACA,8FAjB2C;IACjD,IAAI;IACJ,IAAI;IACJ,IAAI;IACL,CAc0B,IACnB,IAAQ,IAAI,oBAAoB,gCAChC,QACA,EACD;aATH,CAWE,kBAAC,QAAD;IAAM,WAAU;cAAhB,CACE,kBAAC,QAAD,EAAA,UAAO,GAAa,CAAA,EACnB,IAAQ,KACP,kBAAC,EAAO,MAAR;KAEE,SAAS,EAAE,OAAO,IAAK;KACvB,SAAS,EAAE,OAAO,GAAG;KACrB,YAAY,EAAQ;KACpB,WAAU;eAEV,kBAAC,GAAD;MAAO,MAAK;MAAK,SAAQ;MAAQ,WAAU;gBACxC;MACK,CAAA;KACI,EATP,EASO,CAEX;OACP,kBAAC,GAAD;IAAM,MAAM;IAAiB,MAAK;IAAK,WAAU;IAAwB,CAAA,CAClE;;EACU,CAAA"}
1
+ {"version":3,"file":"filter-bar.js","names":[],"sources":["../../src/composed/filter-bar.tsx"],"sourcesContent":["'use client'\n\nimport { IconChevronDown } from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { Badge } from '../ui/badge'\nimport { Button } from '../ui/button'\nimport { Icon } from '../ui/icon'\nimport { springs } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\nimport { SearchInput } from '../ui/search-input'\nimport {\n Select,\n SelectContent,\n SelectItem,\n SelectTrigger,\n SelectValue,\n} from '../ui/select'\nimport { type MultiSelectItem,MultiSelectPopover } from './multi-select-popover'\n\n// ============================================================\n// Context\n// ============================================================\n\ntype FilterBarSize = 'xs' | 'sm' | 'md'\n\nconst FilterBarContext = React.createContext<{ size: FilterBarSize }>({ size: 'sm' })\n\n// ============================================================\n// FilterBar\n// ============================================================\n\n/**\n * A toolbar for filtering lists/tables. Composes a search input, slot-based\n * filter controls (Select, MultiSelect), and an optional \"Clear all\" button.\n * Size is propagated to all child controls via context.\n */\nexport interface FilterBarProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Controlled search input value. Omit `onSearchChange` to hide the search input entirely. */\n searchValue?: string\n /** Called when the search input changes. If not provided, the search input is hidden. */\n onSearchChange?: (value: string) => void\n searchPlaceholder?: string\n /** When provided, a \"Clear all\" button appears that calls this handler. */\n onClearAll?: () => void\n /** Size propagated to all child controls. @default 'sm' */\n size?: FilterBarSize\n}\n\nconst FilterBar = React.forwardRef<HTMLDivElement, FilterBarProps>(({\n searchValue,\n onSearchChange,\n searchPlaceholder = 'Search...',\n onClearAll,\n size = 'sm',\n children,\n className,\n ...props\n}, ref) => {\n return (\n <FilterBarContext.Provider value={{ size }}>\n <div\n ref={ref}\n className={cn('flex flex-wrap items-center gap-ds-03', className)}\n role=\"toolbar\"\n aria-label=\"Filters\"\n {...props}\n >\n {onSearchChange && (\n <SearchInput\n size={size}\n value={searchValue}\n onChange={(e) => onSearchChange(e.target.value)}\n onClear={searchValue ? () => onSearchChange('') : undefined}\n placeholder={searchPlaceholder}\n className=\"w-48\"\n />\n )}\n {children}\n {onClearAll && (\n <Button variant=\"ghost\" size={size} onClick={onClearAll}>\n Clear all\n </Button>\n )}\n </div>\n </FilterBarContext.Provider>\n )\n})\nFilterBar.displayName = 'FilterBar'\n\n// ============================================================\n// FilterSelect\n// ============================================================\n\nexport interface FilterSelectProps {\n label: string\n value: string\n onValueChange: (value: string) => void\n options: { value: string; label: string }[]\n /** Label for the \"all\" option @default 'All' */\n allLabel?: string\n className?: string\n}\n\nfunction FilterSelect({\n label,\n value,\n onValueChange,\n options,\n allLabel = 'All',\n className,\n}: FilterSelectProps) {\n const { size } = React.useContext(FilterBarContext)\n const isFiltered = value !== '' && value !== 'all'\n\n return (\n <Select value={value} onValueChange={onValueChange}>\n <SelectTrigger\n size={size}\n className={cn('w-40', isFiltered && 'border-accent-7', className)}\n >\n <SelectValue placeholder={label} />\n </SelectTrigger>\n <SelectContent>\n <SelectItem value=\"all\">{allLabel}</SelectItem>\n {options.map((o) => (\n <SelectItem key={o.value} value={o.value}>\n {o.label}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n )\n}\n\n// ============================================================\n// FilterMultiSelect\n// ============================================================\n\nexport interface FilterMultiSelectProps {\n label: string\n value: string[]\n onValueChange: (values: string[]) => void\n options: { value: string; label: string }[]\n className?: string\n}\n\nfunction FilterMultiSelect({\n label,\n value,\n onValueChange,\n options,\n className,\n}: FilterMultiSelectProps) {\n const { size } = React.useContext(FilterBarContext)\n const count = value.length\n\n const items: MultiSelectItem[] = React.useMemo(\n () => options.map((o) => ({ id: o.value, label: o.label })),\n [options],\n )\n\n // Trigger button sized by FilterBar context\n const triggerSizeClasses: Record<string, string> = {\n xs: 'h-ds-xs-plus text-ds-sm px-ds-02',\n sm: 'h-ds-sm text-ds-sm px-ds-03',\n md: 'h-ds-md text-ds-md px-ds-04',\n }\n\n return (\n <MultiSelectPopover\n items={items}\n value={value}\n onValueChange={onValueChange}\n searchPlaceholder={`Search ${label.toLowerCase()}...`}\n >\n <button\n type=\"button\"\n className={cn(\n 'flex items-center justify-between gap-ds-02 whitespace-nowrap rounded-control border bg-surface-raised-hover text-surface-fg',\n 'hover:bg-surface-raised-active transition-colors duration-fast-01 ease-productive-standard',\n triggerSizeClasses[size],\n count > 0 ? 'border-accent-7' : 'border-surface-border-strong',\n 'w-40',\n className,\n )}\n >\n <span className=\"flex items-center gap-ds-02 truncate\">\n <span>{label}</span>\n {count > 0 && (\n <motion.span\n key={count}\n initial={{ scale: 0.8 }}\n animate={{ scale: 1 }}\n transition={springs.bouncy}\n className=\"inline-flex\"\n >\n <Badge size=\"xs\" variant=\"solid\" className=\"ml-ds-01\">\n {count}\n </Badge>\n </motion.span>\n )}\n </span>\n <Icon icon={IconChevronDown} size=\"xs\" className=\"opacity-50 shrink-0\" />\n </button>\n </MultiSelectPopover>\n )\n}\n\nexport { FilterBar, FilterMultiSelect,FilterSelect }\n"],"mappings":";;;;;;;;;;;;;;AA2BA,IAAM,IAAmB,EAAM,cAAuC,EAAE,MAAM,MAAM,CAAC,EAuB/E,IAAY,EAAM,YAA4C,EAClE,gBACA,mBACA,uBAAoB,aACpB,eACA,UAAO,MACP,aACA,cACA,GAAG,KACF,MAEC,kBAAC,EAAiB,UAAlB;CAA2B,OAAO,EAAE,SAAM;WACxC,kBAAC,OAAD;EACO;EACL,WAAW,EAAG,yCAAyC,EAAU;EACjE,MAAK;EACL,cAAW;EACX,GAAI;YALN;GAOG,KACC,kBAAC,GAAD;IACQ;IACN,OAAO;IACP,WAAW,MAAM,EAAe,EAAE,OAAO,MAAM;IAC/C,SAAS,UAAoB,EAAe,GAAG,GAAG,KAAA;IAClD,aAAa;IACb,WAAU;IACV,CAAA;GAEH;GACA,KACC,kBAAC,GAAD;IAAQ,SAAQ;IAAc;IAAM,SAAS;cAAY;IAEhD,CAAA;GAEP;;CACoB,CAAA,CAE9B;AACF,EAAU,cAAc;AAgBxB,SAAS,EAAa,EACpB,UACA,UACA,kBACA,YACA,cAAW,OACX,gBACoB;CACpB,IAAM,EAAE,YAAS,EAAM,WAAW,EAAiB;AAGnD,QACE,kBAAC,GAAD;EAAe;EAAsB;YAArC,CACE,kBAAC,GAAD;GACQ;GACN,WAAW,EAAG,QAND,MAAU,MAAM,MAAU,SAMH,mBAAmB,EAAU;aAEjE,kBAAC,GAAD,EAAa,aAAa,GAAS,CAAA;GACrB,CAAA,EAChB,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;GAAY,OAAM;aAAO;GAAsB,CAAA,EAC9C,EAAQ,KAAK,MACZ,kBAAC,GAAD;GAA0B,OAAO,EAAE;aAChC,EAAE;GACQ,EAFI,EAAE,MAEN,CACb,CACY,EAAA,CAAA,CACT;;;AAgBb,SAAS,EAAkB,EACzB,UACA,UACA,kBACA,YACA,gBACyB;CACzB,IAAM,EAAE,YAAS,EAAM,WAAW,EAAiB,EAC7C,IAAQ,EAAM;AAcpB,QACE,kBAAC,GAAD;EACS,OAdsB,EAAM,cAC/B,EAAQ,KAAK,OAAO;GAAE,IAAI,EAAE;GAAO,OAAO,EAAE;GAAO,EAAE,EAC3D,CAAC,EAAQ,CACV;EAYU;EACQ;EACf,mBAAmB,UAAU,EAAM,aAAa,CAAC;YAEjD,kBAAC,UAAD;GACE,MAAK;GACL,WAAW,EACT,gIACA,8FAjB2C;IACjD,IAAI;IACJ,IAAI;IACJ,IAAI;IACL,CAc0B,IACnB,IAAQ,IAAI,oBAAoB,gCAChC,QACA,EACD;aATH,CAWE,kBAAC,QAAD;IAAM,WAAU;cAAhB,CACE,kBAAC,QAAD,EAAA,UAAO,GAAa,CAAA,EACnB,IAAQ,KACP,kBAAC,EAAO,MAAR;KAEE,SAAS,EAAE,OAAO,IAAK;KACvB,SAAS,EAAE,OAAO,GAAG;KACrB,YAAY,EAAQ;KACpB,WAAU;eAEV,kBAAC,GAAD;MAAO,MAAK;MAAK,SAAQ;MAAQ,WAAU;gBACxC;MACK,CAAA;KACI,EATP,EASO,CAEX;OACP,kBAAC,GAAD;IAAM,MAAM;IAAiB,MAAK;IAAK,WAAU;IAAwB,CAAA,CAClE;;EACU,CAAA"}
@@ -65,8 +65,6 @@ export { PageHeader } from './page-header';
65
65
  export { DashboardSkeleton, ProjectListSkeleton, TaskDetailSkeleton, } from './page-skeletons';
66
66
  export type { Priority, PriorityIndicatorProps } from './priority-indicator';
67
67
  export { PriorityIndicator } from './priority-indicator';
68
- export type { ResponsiveOverlayProps } from './responsive-overlay';
69
- export { ResponsiveOverlay } from './responsive-overlay';
70
68
  export type { AudioPlayerProps, AudioWaveformProps, ChatToolbarItem, RichChatInputMessage, RichChatInputProps, UseVoiceRecorderOptions, UseVoiceRecorderReturn } from './rich-chat-input';
71
69
  export { AudioPlayer, AudioWaveform, RichChatInput, useVoiceRecorder } from './rich-chat-input';
72
70
  export type { MentionItem, RichTextEditorProps, RichTextViewerProps, ToolbarItem } from './rich-text-editor';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/composed/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/composed/index.ts"],"names":[],"mappings":"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"}
@@ -27,9 +27,8 @@ import { MemberPicker as V } from "./member-picker.js";
27
27
  import { PageHeader as H } from "./page-header.js";
28
28
  import { DashboardSkeleton as U, ProjectListSkeleton as W, TaskDetailSkeleton as G } from "./page-skeletons.js";
29
29
  import { PriorityIndicator as K } from "./priority-indicator.js";
30
- import { ResponsiveOverlay as q } from "./responsive-overlay.js";
31
- import { b as J, n as Y, t as X, y as Z } from "../_chunks/rich-chat-input.js";
32
- import { RichTextEditor as Q, RichTextViewer as $ } from "./rich-text-editor.js";
33
- import { ScheduleView as ee } from "./schedule-view.js";
34
- import { StatusBadge as te, statusBadgeVariants as ne } from "./status-badge.js";
35
- export { t as ActivityFeed, Z as AudioPlayer, J as AudioWaveform, r as AvatarGroup, F as BoardSkeleton, i as BulkActionBar, C as CalendarGrid, I as CardSkeleton, a as CommandPalette, o as ConfirmDialog, s as ContentCard, U as DashboardSkeleton, T as DatePicker, k as DateRangePicker, D as DateTimePicker, u as DeadlineIndicator, M as EmojiNode, d as EmojiPicker, f as EmojiPickerPopover, p as EmptyState, m as ErrorBoundary, h as ErrorDisplay, g as FilePreview, v as FilterBar, y as FilterMultiSelect, b as FilterSelect, x as FormSection, S as GlobalLoading, P as InlineEdit, L as ListSkeleton, z as MarkdownViewer, B as MasterDetail, V as MemberPicker, A as MonthPicker, _ as MultiSelectPopover, H as PageHeader, E as Presets, K as PriorityIndicator, W as ProjectListSkeleton, q as ResponsiveOverlay, X as RichChatInput, Q as RichTextEditor, $ as RichTextViewer, ee as ScheduleView, l as SimpleTooltip, te as StatusBadge, R as TableSkeleton, G as TaskDetailSkeleton, j as TimePicker, O as YearPicker, c as contentCardVariants, N as createEmojiSuggestion, e as getInitials, n as groupItemsByTime, ne as statusBadgeVariants, w as useCalendar, Y as useVoiceRecorder };
30
+ import { b as q, n as J, t as Y, y as X } from "../_chunks/rich-chat-input.js";
31
+ import { RichTextEditor as Z, RichTextViewer as Q } from "./rich-text-editor.js";
32
+ import { ScheduleView as $ } from "./schedule-view.js";
33
+ import { StatusBadge as ee, statusBadgeVariants as te } from "./status-badge.js";
34
+ export { t as ActivityFeed, X as AudioPlayer, q as AudioWaveform, r as AvatarGroup, F as BoardSkeleton, i as BulkActionBar, C as CalendarGrid, I as CardSkeleton, a as CommandPalette, o as ConfirmDialog, s as ContentCard, U as DashboardSkeleton, T as DatePicker, k as DateRangePicker, D as DateTimePicker, u as DeadlineIndicator, M as EmojiNode, d as EmojiPicker, f as EmojiPickerPopover, p as EmptyState, m as ErrorBoundary, h as ErrorDisplay, g as FilePreview, v as FilterBar, y as FilterMultiSelect, b as FilterSelect, x as FormSection, S as GlobalLoading, P as InlineEdit, L as ListSkeleton, z as MarkdownViewer, B as MasterDetail, V as MemberPicker, A as MonthPicker, _ as MultiSelectPopover, H as PageHeader, E as Presets, K as PriorityIndicator, W as ProjectListSkeleton, Y as RichChatInput, Z as RichTextEditor, Q as RichTextViewer, $ as ScheduleView, l as SimpleTooltip, ee as StatusBadge, R as TableSkeleton, G as TaskDetailSkeleton, j as TimePicker, O as YearPicker, c as contentCardVariants, N as createEmojiSuggestion, e as getInitials, n as groupItemsByTime, te as statusBadgeVariants, w as useCalendar, J as useVoiceRecorder };
@@ -78,7 +78,7 @@ var s = r.forwardRef(({ value: s, onSave: c, placeholder: l = "Click to edit", t
78
78
  onInput: j,
79
79
  onPaste: M,
80
80
  spellCheck: x,
81
- className: e("font-sans text-surface-fg outline-hidden", u, !d && !x && "cursor-text rounded-ds-sm -mx-ds-01 px-ds-01 hover:bg-surface-raised-hover transition-colors duration-fast-01", x && "rounded-ds-sm -mx-ds-01 px-ds-01 bg-surface-raised-hover ring-1 ring-accent-7", E && !x && "text-surface-fg-subtle italic", d && "cursor-default"),
81
+ className: e("font-sans text-surface-fg outline-hidden", u, !d && !x && "cursor-text rounded-control-inner -mx-ds-01 px-ds-01 hover:bg-surface-raised-hover transition-colors duration-fast-01", x && "rounded-control-inner -mx-ds-01 px-ds-01 bg-surface-raised-hover ring-1 ring-accent-7", E && !x && "text-surface-fg-subtle italic", d && "cursor-default"),
82
82
  "data-placeholder": l,
83
83
  children: s || (x ? "" : l)
84
84
  }),
@@ -1 +1 @@
1
- {"version":3,"file":"inline-edit.js","names":[],"sources":["../../src/composed/inline-edit.tsx"],"sourcesContent":["'use client'\n\nimport { IconPencil } from '@tabler/icons-react'\nimport * as React from 'react'\n\nimport { Icon } from '../ui/icon'\nimport { cn } from '../ui/lib/utils'\nimport { Spinner } from '../ui/spinner'\n\n// ============================================================\n// Types\n// ============================================================\n\nexport interface InlineEditProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSave'> {\n value: string\n onSave: (newValue: string) => void | Promise<void>\n placeholder?: string\n /** CSS class applied to the editable text (e.g. 'text-ds-lg font-semibold') */\n textClassName?: string\n readOnly?: boolean\n maxLength?: number\n /** External saving state — shows spinner */\n saving?: boolean\n}\n\n// ============================================================\n// InlineEdit — contentEditable approach\n//\n// No mode switch. No input field. The text IS the editor.\n// Click → cursor appears in the text. Type. Enter saves. Escape reverts.\n// Like Notion, Linear, Figma layer names.\n// ============================================================\n\nconst InlineEdit = React.forwardRef<HTMLDivElement, InlineEditProps>(({\n value,\n onSave,\n placeholder = 'Click to edit',\n textClassName,\n readOnly = false,\n maxLength,\n saving: savingProp = false,\n className,\n // aria-label / aria-labelledby apply to the editable textbox (the inner\n // span), not the outer wrapper div. Intercept them from ...props so they\n // land on the role=\"textbox\" element that actually needs the name.\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n ...props\n}, ref) => {\n const [saving, setSaving] = React.useState(false)\n const [focused, setFocused] = React.useState(false)\n const editRef = React.useRef<HTMLSpanElement>(null)\n const snapshotRef = React.useRef(value)\n\n const isSaving = savingProp || saving\n const isEmpty = !value\n\n // Sync DOM text when value changes externally (and not focused)\n React.useEffect(() => {\n if (!focused && editRef.current) {\n editRef.current.textContent = value\n }\n }, [value, focused])\n\n function handleFocus() {\n if (readOnly || isSaving) return\n setFocused(true)\n snapshotRef.current = value\n\n // Select all text on focus (like clicking a file name in Finder)\n requestAnimationFrame(() => {\n if (!editRef.current) return\n const range = document.createRange()\n range.selectNodeContents(editRef.current)\n const sel = window.getSelection()\n sel?.removeAllRanges()\n sel?.addRange(range)\n })\n }\n\n async function commit() {\n if (!editRef.current) return\n setFocused(false)\n const raw = editRef.current.textContent ?? ''\n const trimmed = raw.trim()\n\n // Enforce maxLength\n const final = maxLength ? trimmed.slice(0, maxLength) : trimmed\n\n // Reset DOM to clean value\n editRef.current.textContent = final || value\n\n if (final === value) return\n const result = onSave(final)\n if (result instanceof Promise) {\n setSaving(true)\n try {\n await result\n } catch {\n // Revert on error\n if (editRef.current) editRef.current.textContent = value\n } finally {\n setSaving(false)\n }\n }\n }\n\n function cancel() {\n if (!editRef.current) return\n editRef.current.textContent = snapshotRef.current\n setFocused(false)\n editRef.current.blur()\n }\n\n function handleKeyDown(e: React.KeyboardEvent) {\n if (e.key === 'Escape') {\n e.preventDefault()\n cancel()\n } else if (e.key === 'Enter') {\n e.preventDefault()\n commit()\n }\n }\n\n function handleInput() {\n if (!editRef.current || !maxLength) return\n const text = editRef.current.textContent ?? ''\n if (text.length > maxLength) {\n editRef.current.textContent = text.slice(0, maxLength)\n // Move cursor to end\n const range = document.createRange()\n range.selectNodeContents(editRef.current)\n range.collapse(false)\n const sel = window.getSelection()\n sel?.removeAllRanges()\n sel?.addRange(range)\n }\n }\n\n // Prevent paste from inserting rich content\n function handlePaste(e: React.ClipboardEvent) {\n e.preventDefault()\n const text = e.clipboardData.getData('text/plain')\n document.execCommand('insertText', false, text)\n }\n\n return (\n <div ref={ref} className={cn('group inline-flex items-center gap-ds-02', className)} {...props}>\n <span\n ref={editRef}\n role={readOnly ? undefined : 'textbox'}\n contentEditable={!readOnly && !isSaving}\n suppressContentEditableWarning\n tabIndex={readOnly ? undefined : 0}\n // Fall back to the placeholder when no explicit label is supplied —\n // screen readers need _something_ on role=\"textbox\".\n aria-label={readOnly ? undefined : (ariaLabel ?? (ariaLabelledBy ? undefined : placeholder))}\n aria-labelledby={readOnly ? undefined : ariaLabelledBy}\n onFocus={handleFocus}\n onBlur={commit}\n onKeyDown={handleKeyDown}\n onInput={handleInput}\n onPaste={handlePaste}\n spellCheck={focused}\n className={cn(\n 'font-sans text-surface-fg outline-hidden',\n textClassName,\n // Idle: subtle hover hint\n !readOnly && !focused && 'cursor-text rounded-ds-sm -mx-ds-01 px-ds-01 hover:bg-surface-raised-hover transition-colors duration-fast-01',\n // Focused: subtle underline to indicate editing\n focused && 'rounded-ds-sm -mx-ds-01 px-ds-01 bg-surface-raised-hover ring-1 ring-accent-7',\n // Empty: show placeholder styling\n isEmpty && !focused && 'text-surface-fg-subtle italic',\n // Read-only\n readOnly && 'cursor-default',\n )}\n data-placeholder={placeholder}\n >\n {value || (focused ? '' : placeholder)}\n </span>\n {!readOnly && !focused && !isSaving && (\n <Icon icon={IconPencil} size=\"xs\" className=\"text-surface-fg-subtle opacity-0 group-hover:opacity-100 transition-opacity duration-fast-01 shrink-0\" />\n )}\n {isSaving && <Spinner size=\"sm\" />}\n </div>\n )\n})\nInlineEdit.displayName = 'InlineEdit'\n\nexport { InlineEdit }\n"],"mappings":"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"}
1
+ {"version":3,"file":"inline-edit.js","names":[],"sources":["../../src/composed/inline-edit.tsx"],"sourcesContent":["'use client'\n\nimport { IconPencil } from '@tabler/icons-react'\nimport * as React from 'react'\n\nimport { Icon } from '../ui/icon'\nimport { cn } from '../ui/lib/utils'\nimport { Spinner } from '../ui/spinner'\n\n// ============================================================\n// Types\n// ============================================================\n\nexport interface InlineEditProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSave'> {\n value: string\n onSave: (newValue: string) => void | Promise<void>\n placeholder?: string\n /** CSS class applied to the editable text (e.g. 'text-ds-lg font-semibold') */\n textClassName?: string\n readOnly?: boolean\n maxLength?: number\n /** External saving state — shows spinner */\n saving?: boolean\n}\n\n// ============================================================\n// InlineEdit — contentEditable approach\n//\n// No mode switch. No input field. The text IS the editor.\n// Click → cursor appears in the text. Type. Enter saves. Escape reverts.\n// Like Notion, Linear, Figma layer names.\n// ============================================================\n\nconst InlineEdit = React.forwardRef<HTMLDivElement, InlineEditProps>(({\n value,\n onSave,\n placeholder = 'Click to edit',\n textClassName,\n readOnly = false,\n maxLength,\n saving: savingProp = false,\n className,\n // aria-label / aria-labelledby apply to the editable textbox (the inner\n // span), not the outer wrapper div. Intercept them from ...props so they\n // land on the role=\"textbox\" element that actually needs the name.\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n ...props\n}, ref) => {\n const [saving, setSaving] = React.useState(false)\n const [focused, setFocused] = React.useState(false)\n const editRef = React.useRef<HTMLSpanElement>(null)\n const snapshotRef = React.useRef(value)\n\n const isSaving = savingProp || saving\n const isEmpty = !value\n\n // Sync DOM text when value changes externally (and not focused)\n React.useEffect(() => {\n if (!focused && editRef.current) {\n editRef.current.textContent = value\n }\n }, [value, focused])\n\n function handleFocus() {\n if (readOnly || isSaving) return\n setFocused(true)\n snapshotRef.current = value\n\n // Select all text on focus (like clicking a file name in Finder)\n requestAnimationFrame(() => {\n if (!editRef.current) return\n const range = document.createRange()\n range.selectNodeContents(editRef.current)\n const sel = window.getSelection()\n sel?.removeAllRanges()\n sel?.addRange(range)\n })\n }\n\n async function commit() {\n if (!editRef.current) return\n setFocused(false)\n const raw = editRef.current.textContent ?? ''\n const trimmed = raw.trim()\n\n // Enforce maxLength\n const final = maxLength ? trimmed.slice(0, maxLength) : trimmed\n\n // Reset DOM to clean value\n editRef.current.textContent = final || value\n\n if (final === value) return\n const result = onSave(final)\n if (result instanceof Promise) {\n setSaving(true)\n try {\n await result\n } catch {\n // Revert on error\n if (editRef.current) editRef.current.textContent = value\n } finally {\n setSaving(false)\n }\n }\n }\n\n function cancel() {\n if (!editRef.current) return\n editRef.current.textContent = snapshotRef.current\n setFocused(false)\n editRef.current.blur()\n }\n\n function handleKeyDown(e: React.KeyboardEvent) {\n if (e.key === 'Escape') {\n e.preventDefault()\n cancel()\n } else if (e.key === 'Enter') {\n e.preventDefault()\n commit()\n }\n }\n\n function handleInput() {\n if (!editRef.current || !maxLength) return\n const text = editRef.current.textContent ?? ''\n if (text.length > maxLength) {\n editRef.current.textContent = text.slice(0, maxLength)\n // Move cursor to end\n const range = document.createRange()\n range.selectNodeContents(editRef.current)\n range.collapse(false)\n const sel = window.getSelection()\n sel?.removeAllRanges()\n sel?.addRange(range)\n }\n }\n\n // Prevent paste from inserting rich content\n function handlePaste(e: React.ClipboardEvent) {\n e.preventDefault()\n const text = e.clipboardData.getData('text/plain')\n document.execCommand('insertText', false, text)\n }\n\n return (\n <div ref={ref} className={cn('group inline-flex items-center gap-ds-02', className)} {...props}>\n <span\n ref={editRef}\n role={readOnly ? undefined : 'textbox'}\n contentEditable={!readOnly && !isSaving}\n suppressContentEditableWarning\n tabIndex={readOnly ? undefined : 0}\n // Fall back to the placeholder when no explicit label is supplied —\n // screen readers need _something_ on role=\"textbox\".\n aria-label={readOnly ? undefined : (ariaLabel ?? (ariaLabelledBy ? undefined : placeholder))}\n aria-labelledby={readOnly ? undefined : ariaLabelledBy}\n onFocus={handleFocus}\n onBlur={commit}\n onKeyDown={handleKeyDown}\n onInput={handleInput}\n onPaste={handlePaste}\n spellCheck={focused}\n className={cn(\n 'font-sans text-surface-fg outline-hidden',\n textClassName,\n // Idle: subtle hover hint\n !readOnly && !focused && 'cursor-text rounded-control-inner -mx-ds-01 px-ds-01 hover:bg-surface-raised-hover transition-colors duration-fast-01',\n // Focused: subtle underline to indicate editing\n focused && 'rounded-control-inner -mx-ds-01 px-ds-01 bg-surface-raised-hover ring-1 ring-accent-7',\n // Empty: show placeholder styling\n isEmpty && !focused && 'text-surface-fg-subtle italic',\n // Read-only\n readOnly && 'cursor-default',\n )}\n data-placeholder={placeholder}\n >\n {value || (focused ? '' : placeholder)}\n </span>\n {!readOnly && !focused && !isSaving && (\n <Icon icon={IconPencil} size=\"xs\" className=\"text-surface-fg-subtle opacity-0 group-hover:opacity-100 transition-opacity duration-fast-01 shrink-0\" />\n )}\n {isSaving && <Spinner size=\"sm\" />}\n </div>\n )\n})\nInlineEdit.displayName = 'InlineEdit'\n\nexport { InlineEdit }\n"],"mappings":"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"}
@@ -7,7 +7,7 @@ var a = n.forwardRef(function({ className: n, ...a }, o) {
7
7
  return /* @__PURE__ */ i("div", {
8
8
  ref: o,
9
9
  ...a,
10
- className: e("rounded-ds-lg border border-surface-border-strong bg-surface-raised p-ds-05b", n),
10
+ className: e("rounded-surface border border-surface-border-strong bg-surface-raised p-ds-05b", n),
11
11
  children: [
12
12
  /* @__PURE__ */ i("div", {
13
13
  className: "flex items-center justify-between pb-ds-05",
@@ -23,7 +23,7 @@ var a = n.forwardRef(function({ className: n, ...a }, o) {
23
23
  }),
24
24
  /* @__PURE__ */ i("div", {
25
25
  className: "flex items-center gap-ds-03 pt-ds-05",
26
- children: [/* @__PURE__ */ r(t, { className: "h-ds-xs w-ds-xs rounded-ds-full bg-surface-raised-hover" }), /* @__PURE__ */ r(t, { className: "h-[12px] w-[80px] bg-surface-raised-hover" })]
26
+ children: [/* @__PURE__ */ r(t, { className: "h-ds-xs w-ds-xs rounded-pill bg-surface-raised-hover" }), /* @__PURE__ */ r(t, { className: "h-[12px] w-[80px] bg-surface-raised-hover" })]
27
27
  })
28
28
  ]
29
29
  });
@@ -33,7 +33,7 @@ var o = n.forwardRef(function({ rows: n = 5, columns: a = 4, className: o, ...s
33
33
  return /* @__PURE__ */ i("div", {
34
34
  ref: c,
35
35
  ...s,
36
- className: e("overflow-hidden rounded-ds-lg border border-surface-border-strong", o),
36
+ className: e("overflow-hidden rounded-surface border border-surface-border-strong", o),
37
37
  children: [/* @__PURE__ */ r("div", {
38
38
  className: "flex items-center gap-ds-05 border-b border-surface-border-strong bg-surface-raised px-ds-05 py-ds-04",
39
39
  children: Array.from({ length: a }).map((n, i) => /* @__PURE__ */ r(t, { className: e("h-[12px] bg-surface-raised-hover", i === 0 ? "w-[160px]" : "flex-1") }, `head-${i}`))
@@ -59,11 +59,11 @@ var s = n.forwardRef(function({ columns: n = 4, cardsPerColumn: a = 3, className
59
59
  children: [
60
60
  /* @__PURE__ */ r(t, { className: "h-[12px] w-[12px] rounded bg-surface-raised-hover" }),
61
61
  /* @__PURE__ */ r(t, { className: "h-[12px] w-[80px] bg-surface-raised-hover" }),
62
- /* @__PURE__ */ r(t, { className: "h-[16px] w-[20px] rounded-ds-full bg-surface-raised-hover" })
62
+ /* @__PURE__ */ r(t, { className: "h-[16px] w-[20px] rounded-pill bg-surface-raised-hover" })
63
63
  ]
64
64
  }), /* @__PURE__ */ r(t, { className: "h-ico-sm w-ico-sm rounded bg-surface-raised-hover" })]
65
65
  }), Array.from({ length: a }).map((e, o) => /* @__PURE__ */ i("div", {
66
- className: "rounded-ds-lg border border-surface-border-strong bg-surface-raised p-ds-04",
66
+ className: "rounded-surface border border-surface-border-strong bg-surface-raised p-ds-04",
67
67
  style: { animationDelay: `${(n * a + o) * 50}ms` },
68
68
  children: [/* @__PURE__ */ i("div", {
69
69
  className: "space-y-ds-03",
@@ -72,8 +72,8 @@ var s = n.forwardRef(function({ columns: n = 4, cardsPerColumn: a = 3, className
72
72
  className: "flex items-center justify-between pt-ds-04",
73
73
  children: [/* @__PURE__ */ i("div", {
74
74
  className: "flex items-center gap-ds-02b",
75
- children: [/* @__PURE__ */ r(t, { className: "h-ico-md w-ico-md rounded-ds-full bg-surface-raised-hover" }), /* @__PURE__ */ r(t, { className: "h-ds-03 w-[64px] bg-surface-raised-hover" })]
76
- }), /* @__PURE__ */ r(t, { className: "h-[16px] w-ds-lg rounded-ds-full bg-surface-raised-hover" })]
75
+ children: [/* @__PURE__ */ r(t, { className: "h-ico-md w-ico-md rounded-pill bg-surface-raised-hover" }), /* @__PURE__ */ r(t, { className: "h-ds-03 w-[64px] bg-surface-raised-hover" })]
76
+ }), /* @__PURE__ */ r(t, { className: "h-[16px] w-ds-lg rounded-pill bg-surface-raised-hover" })]
77
77
  })]
78
78
  }, `card-${n}-${o}`))]
79
79
  }, `col-${n}`))
@@ -89,12 +89,12 @@ var c = n.forwardRef(function({ rows: n = 6, showAvatar: a = !0, className: o, .
89
89
  className: e("flex items-center gap-ds-04 py-ds-04", s < n - 1 && "border-b border-surface-border-strong"),
90
90
  style: { animationDelay: `${s * 50}ms` },
91
91
  children: [
92
- a && /* @__PURE__ */ r(t, { className: "h-ds-sm w-ds-sm shrink-0 rounded-ds-full bg-surface-raised-hover" }),
92
+ a && /* @__PURE__ */ r(t, { className: "h-ds-sm w-ds-sm shrink-0 rounded-pill bg-surface-raised-hover" }),
93
93
  /* @__PURE__ */ i("div", {
94
94
  className: "flex flex-1 flex-col gap-ds-02b",
95
95
  children: [/* @__PURE__ */ r(t, { className: "h-[12px] w-2/5 bg-surface-raised-hover" }), /* @__PURE__ */ r(t, { className: "h-ds-03 w-3/5 bg-surface-raised-hover" })]
96
96
  }),
97
- /* @__PURE__ */ r(t, { className: "h-[20px] w-[56px] rounded-ds-full bg-surface-raised-hover" })
97
+ /* @__PURE__ */ r(t, { className: "h-[20px] w-[56px] rounded-pill bg-surface-raised-hover" })
98
98
  ]
99
99
  }, `list-${s}`))
100
100
  });
@@ -1 +1 @@
1
- {"version":3,"file":"loading-skeleton.js","names":[],"sources":["../../src/composed/loading-skeleton.tsx"],"sourcesContent":["// @server-safe\nimport * as React from 'react'\n\nimport { cn } from '../ui/lib/utils'\nimport { Skeleton } from '../ui/skeleton'\n\nexport interface CardSkeletonProps extends React.ComponentPropsWithoutRef<'div'> {\n className?: string\n}\n\nconst CardSkeleton = React.forwardRef<HTMLDivElement, CardSkeletonProps>(\n function CardSkeleton({ className, ...props }, ref) {\n return (\n <div\n ref={ref}\n {...props}\n className={cn(\n 'rounded-ds-lg border border-surface-border-strong bg-surface-raised p-ds-05b',\n className,\n )}\n >\n <div className=\"flex items-center justify-between pb-ds-05\">\n <Skeleton className=\"h-[16px] w-[128px] bg-surface-raised-hover\" />\n <Skeleton className=\"h-ico-sm w-ico-sm rounded bg-surface-raised-hover\" />\n </div>\n <div className=\"space-y-ds-04\">\n <Skeleton className=\"h-[12px] w-full bg-surface-raised-hover\" />\n <Skeleton className=\"h-[12px] w-4/5 bg-surface-raised-hover\" />\n <Skeleton className=\"h-[12px] w-3/5 bg-surface-raised-hover\" />\n </div>\n <div className=\"flex items-center gap-ds-03 pt-ds-05\">\n <Skeleton className=\"h-ds-xs w-ds-xs rounded-ds-full bg-surface-raised-hover\" />\n <Skeleton className=\"h-[12px] w-[80px] bg-surface-raised-hover\" />\n </div>\n </div>\n )\n},\n)\n\nCardSkeleton.displayName = 'CardSkeleton'\n\nexport interface TableSkeletonProps extends CardSkeletonProps {\n rows?: number\n columns?: number\n}\n\nconst TableSkeleton = React.forwardRef<HTMLDivElement, TableSkeletonProps>(\n function TableSkeleton({\n rows = 5,\n columns = 4,\n className,\n ...props\n}, ref) {\n return (\n <div\n ref={ref}\n {...props}\n className={cn(\n 'overflow-hidden rounded-ds-lg border border-surface-border-strong',\n className,\n )}\n >\n {/* Header */}\n <div className=\"flex items-center gap-ds-05 border-b border-surface-border-strong bg-surface-raised px-ds-05 py-ds-04\">\n {Array.from({ length: columns }).map((_, i) => (\n <Skeleton\n key={`head-${i}`}\n className={cn(\n 'h-[12px] bg-surface-raised-hover',\n i === 0 ? 'w-[160px]' : 'flex-1',\n )}\n />\n ))}\n </div>\n\n {/* Rows */}\n {Array.from({ length: rows }).map((_, rowIndex) => (\n <div\n key={`row-${rowIndex}`}\n className={cn(\n 'flex items-center gap-ds-05 px-ds-05 py-ds-04',\n rowIndex < rows - 1 && 'border-b border-surface-border-strong',\n )}\n style={{ animationDelay: `${rowIndex * 50}ms` }}\n >\n {Array.from({ length: columns }).map((_, colIndex) => (\n <Skeleton\n key={`cell-${rowIndex}-${colIndex}`}\n className={cn(\n 'h-[12px] bg-surface-raised-hover',\n colIndex === 0 ? 'w-[160px]' : 'flex-1',\n )}\n />\n ))}\n </div>\n ))}\n </div>\n )\n},\n)\n\nTableSkeleton.displayName = 'TableSkeleton'\n\nexport interface BoardSkeletonProps extends CardSkeletonProps {\n columns?: number\n cardsPerColumn?: number\n}\n\nconst BoardSkeleton = React.forwardRef<HTMLDivElement, BoardSkeletonProps>(\n function BoardSkeleton({\n columns = 4,\n cardsPerColumn = 3,\n className,\n ...props\n}, ref) {\n return (\n <div ref={ref} {...props} className={cn('flex gap-ds-05 overflow-x-auto', className)}>\n {Array.from({ length: columns }).map((_, colIndex) => (\n <div\n key={`col-${colIndex}`}\n className=\"flex w-[272px] shrink-0 flex-col gap-ds-03\"\n >\n {/* Column header */}\n <div className=\"flex items-center justify-between px-ds-02 py-ds-03\">\n <div className=\"flex items-center gap-ds-03\">\n <Skeleton className=\"h-[12px] w-[12px] rounded bg-surface-raised-hover\" />\n <Skeleton className=\"h-[12px] w-[80px] bg-surface-raised-hover\" />\n <Skeleton className=\"h-[16px] w-[20px] rounded-ds-full bg-surface-raised-hover\" />\n </div>\n <Skeleton className=\"h-ico-sm w-ico-sm rounded bg-surface-raised-hover\" />\n </div>\n\n {/* Column cards */}\n {Array.from({ length: cardsPerColumn }).map((_, cardIndex) => (\n <div\n key={`card-${colIndex}-${cardIndex}`}\n className=\"rounded-ds-lg border border-surface-border-strong bg-surface-raised p-ds-04\"\n style={{ animationDelay: `${(colIndex * cardsPerColumn + cardIndex) * 50}ms` }}\n >\n <div className=\"space-y-ds-03\">\n <Skeleton className=\"h-[12px] w-4/5 bg-surface-raised-hover\" />\n <Skeleton className=\"h-[12px] w-3/5 bg-surface-raised-hover\" />\n </div>\n <div className=\"flex items-center justify-between pt-ds-04\">\n <div className=\"flex items-center gap-ds-02b\">\n <Skeleton className=\"h-ico-md w-ico-md rounded-ds-full bg-surface-raised-hover\" />\n <Skeleton className=\"h-ds-03 w-[64px] bg-surface-raised-hover\" />\n </div>\n <Skeleton className=\"h-[16px] w-ds-lg rounded-ds-full bg-surface-raised-hover\" />\n </div>\n </div>\n ))}\n </div>\n ))}\n </div>\n )\n},\n)\n\nBoardSkeleton.displayName = 'BoardSkeleton'\n\nexport interface ListSkeletonProps extends CardSkeletonProps {\n rows?: number\n showAvatar?: boolean\n}\n\nconst ListSkeleton = React.forwardRef<HTMLDivElement, ListSkeletonProps>(\n function ListSkeleton({\n rows = 6,\n showAvatar = true,\n className,\n ...props\n}, ref) {\n return (\n <div ref={ref} {...props} className={cn('flex flex-col', className)}>\n {Array.from({ length: rows }).map((_, i) => (\n <div\n key={`list-${i}`}\n className={cn(\n 'flex items-center gap-ds-04 py-ds-04',\n i < rows - 1 && 'border-b border-surface-border-strong',\n )}\n style={{ animationDelay: `${i * 50}ms` }}\n >\n {showAvatar && (\n <Skeleton className=\"h-ds-sm w-ds-sm shrink-0 rounded-ds-full bg-surface-raised-hover\" />\n )}\n <div className=\"flex flex-1 flex-col gap-ds-02b\">\n <Skeleton className=\"h-[12px] w-2/5 bg-surface-raised-hover\" />\n <Skeleton className=\"h-ds-03 w-3/5 bg-surface-raised-hover\" />\n </div>\n <Skeleton className=\"h-[20px] w-[56px] rounded-ds-full bg-surface-raised-hover\" />\n </div>\n ))}\n </div>\n )\n},\n)\n\nListSkeleton.displayName = 'ListSkeleton'\n\nexport { BoardSkeleton, CardSkeleton, ListSkeleton,TableSkeleton }\n"],"mappings":"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"}
1
+ {"version":3,"file":"loading-skeleton.js","names":[],"sources":["../../src/composed/loading-skeleton.tsx"],"sourcesContent":["// @server-safe\nimport * as React from 'react'\n\nimport { cn } from '../ui/lib/utils'\nimport { Skeleton } from '../ui/skeleton'\n\nexport interface CardSkeletonProps extends React.ComponentPropsWithoutRef<'div'> {\n className?: string\n}\n\nconst CardSkeleton = React.forwardRef<HTMLDivElement, CardSkeletonProps>(\n function CardSkeleton({ className, ...props }, ref) {\n return (\n <div\n ref={ref}\n {...props}\n className={cn(\n 'rounded-surface border border-surface-border-strong bg-surface-raised p-ds-05b',\n className,\n )}\n >\n <div className=\"flex items-center justify-between pb-ds-05\">\n <Skeleton className=\"h-[16px] w-[128px] bg-surface-raised-hover\" />\n <Skeleton className=\"h-ico-sm w-ico-sm rounded bg-surface-raised-hover\" />\n </div>\n <div className=\"space-y-ds-04\">\n <Skeleton className=\"h-[12px] w-full bg-surface-raised-hover\" />\n <Skeleton className=\"h-[12px] w-4/5 bg-surface-raised-hover\" />\n <Skeleton className=\"h-[12px] w-3/5 bg-surface-raised-hover\" />\n </div>\n <div className=\"flex items-center gap-ds-03 pt-ds-05\">\n <Skeleton className=\"h-ds-xs w-ds-xs rounded-pill bg-surface-raised-hover\" />\n <Skeleton className=\"h-[12px] w-[80px] bg-surface-raised-hover\" />\n </div>\n </div>\n )\n},\n)\n\nCardSkeleton.displayName = 'CardSkeleton'\n\nexport interface TableSkeletonProps extends CardSkeletonProps {\n rows?: number\n columns?: number\n}\n\nconst TableSkeleton = React.forwardRef<HTMLDivElement, TableSkeletonProps>(\n function TableSkeleton({\n rows = 5,\n columns = 4,\n className,\n ...props\n}, ref) {\n return (\n <div\n ref={ref}\n {...props}\n className={cn(\n 'overflow-hidden rounded-surface border border-surface-border-strong',\n className,\n )}\n >\n {/* Header */}\n <div className=\"flex items-center gap-ds-05 border-b border-surface-border-strong bg-surface-raised px-ds-05 py-ds-04\">\n {Array.from({ length: columns }).map((_, i) => (\n <Skeleton\n key={`head-${i}`}\n className={cn(\n 'h-[12px] bg-surface-raised-hover',\n i === 0 ? 'w-[160px]' : 'flex-1',\n )}\n />\n ))}\n </div>\n\n {/* Rows */}\n {Array.from({ length: rows }).map((_, rowIndex) => (\n <div\n key={`row-${rowIndex}`}\n className={cn(\n 'flex items-center gap-ds-05 px-ds-05 py-ds-04',\n rowIndex < rows - 1 && 'border-b border-surface-border-strong',\n )}\n style={{ animationDelay: `${rowIndex * 50}ms` }}\n >\n {Array.from({ length: columns }).map((_, colIndex) => (\n <Skeleton\n key={`cell-${rowIndex}-${colIndex}`}\n className={cn(\n 'h-[12px] bg-surface-raised-hover',\n colIndex === 0 ? 'w-[160px]' : 'flex-1',\n )}\n />\n ))}\n </div>\n ))}\n </div>\n )\n},\n)\n\nTableSkeleton.displayName = 'TableSkeleton'\n\nexport interface BoardSkeletonProps extends CardSkeletonProps {\n columns?: number\n cardsPerColumn?: number\n}\n\nconst BoardSkeleton = React.forwardRef<HTMLDivElement, BoardSkeletonProps>(\n function BoardSkeleton({\n columns = 4,\n cardsPerColumn = 3,\n className,\n ...props\n}, ref) {\n return (\n <div ref={ref} {...props} className={cn('flex gap-ds-05 overflow-x-auto', className)}>\n {Array.from({ length: columns }).map((_, colIndex) => (\n <div\n key={`col-${colIndex}`}\n className=\"flex w-[272px] shrink-0 flex-col gap-ds-03\"\n >\n {/* Column header */}\n <div className=\"flex items-center justify-between px-ds-02 py-ds-03\">\n <div className=\"flex items-center gap-ds-03\">\n <Skeleton className=\"h-[12px] w-[12px] rounded bg-surface-raised-hover\" />\n <Skeleton className=\"h-[12px] w-[80px] bg-surface-raised-hover\" />\n <Skeleton className=\"h-[16px] w-[20px] rounded-pill bg-surface-raised-hover\" />\n </div>\n <Skeleton className=\"h-ico-sm w-ico-sm rounded bg-surface-raised-hover\" />\n </div>\n\n {/* Column cards */}\n {Array.from({ length: cardsPerColumn }).map((_, cardIndex) => (\n <div\n key={`card-${colIndex}-${cardIndex}`}\n className=\"rounded-surface border border-surface-border-strong bg-surface-raised p-ds-04\"\n style={{ animationDelay: `${(colIndex * cardsPerColumn + cardIndex) * 50}ms` }}\n >\n <div className=\"space-y-ds-03\">\n <Skeleton className=\"h-[12px] w-4/5 bg-surface-raised-hover\" />\n <Skeleton className=\"h-[12px] w-3/5 bg-surface-raised-hover\" />\n </div>\n <div className=\"flex items-center justify-between pt-ds-04\">\n <div className=\"flex items-center gap-ds-02b\">\n <Skeleton className=\"h-ico-md w-ico-md rounded-pill bg-surface-raised-hover\" />\n <Skeleton className=\"h-ds-03 w-[64px] bg-surface-raised-hover\" />\n </div>\n <Skeleton className=\"h-[16px] w-ds-lg rounded-pill bg-surface-raised-hover\" />\n </div>\n </div>\n ))}\n </div>\n ))}\n </div>\n )\n},\n)\n\nBoardSkeleton.displayName = 'BoardSkeleton'\n\nexport interface ListSkeletonProps extends CardSkeletonProps {\n rows?: number\n showAvatar?: boolean\n}\n\nconst ListSkeleton = React.forwardRef<HTMLDivElement, ListSkeletonProps>(\n function ListSkeleton({\n rows = 6,\n showAvatar = true,\n className,\n ...props\n}, ref) {\n return (\n <div ref={ref} {...props} className={cn('flex flex-col', className)}>\n {Array.from({ length: rows }).map((_, i) => (\n <div\n key={`list-${i}`}\n className={cn(\n 'flex items-center gap-ds-04 py-ds-04',\n i < rows - 1 && 'border-b border-surface-border-strong',\n )}\n style={{ animationDelay: `${i * 50}ms` }}\n >\n {showAvatar && (\n <Skeleton className=\"h-ds-sm w-ds-sm shrink-0 rounded-pill bg-surface-raised-hover\" />\n )}\n <div className=\"flex flex-1 flex-col gap-ds-02b\">\n <Skeleton className=\"h-[12px] w-2/5 bg-surface-raised-hover\" />\n <Skeleton className=\"h-ds-03 w-3/5 bg-surface-raised-hover\" />\n </div>\n <Skeleton className=\"h-[20px] w-[56px] rounded-pill bg-surface-raised-hover\" />\n </div>\n ))}\n </div>\n )\n},\n)\n\nListSkeleton.displayName = 'ListSkeleton'\n\nexport { BoardSkeleton, CardSkeleton, ListSkeleton,TableSkeleton }\n"],"mappings":"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"}
@@ -52,7 +52,7 @@ function m({ language: t, code: n, mb: i }) {
52
52
  }, []), !s) return /* @__PURE__ */ o("div", {
53
53
  className: e("group relative", i),
54
54
  children: [/* @__PURE__ */ a("pre", {
55
- className: "bg-surface-sunken rounded-ds-md p-ds-04 overflow-x-auto text-ds-sm font-mono",
55
+ className: "bg-surface-sunken rounded-control p-ds-04 overflow-x-auto text-ds-sm font-mono",
56
56
  children: /* @__PURE__ */ a("code", { children: n })
57
57
  }), /* @__PURE__ */ a(p, { code: n })]
58
58
  });
@@ -143,7 +143,7 @@ var h = r.forwardRef(({ content: t, compact: n = !1, allowHtml: r = !1, linkTarg
143
143
  });
144
144
  }
145
145
  return /* @__PURE__ */ a("code", {
146
- className: "bg-surface-sunken rounded-ds-sm px-1.5 py-0.5 text-ds-sm font-mono text-surface-fg",
146
+ className: "bg-surface-sunken rounded-control-inner px-1.5 py-0.5 text-ds-sm font-mono text-surface-fg",
147
147
  ...n,
148
148
  children: t
149
149
  });
@@ -180,7 +180,7 @@ var h = r.forwardRef(({ content: t, compact: n = !1, allowHtml: r = !1, linkTarg
180
180
  img: ({ src: e, alt: t }) => /* @__PURE__ */ a("img", {
181
181
  src: e,
182
182
  alt: t ?? "",
183
- className: "rounded-ds-md max-w-full",
183
+ className: "rounded-control max-w-full",
184
184
  loading: "lazy"
185
185
  })
186
186
  },