@dryui/ui 3.0.0 → 4.0.1

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 (1075) hide show
  1. package/dist/accordion/accordion-root.svelte +1 -1
  2. package/dist/adjust/adjust.svelte +12 -8
  3. package/dist/alpha-slider/alpha-slider-input.svelte +14 -13
  4. package/dist/app-frame/app-frame.svelte +4 -1
  5. package/dist/aspect-ratio/aspect-ratio.svelte +7 -6
  6. package/dist/aurora/aurora.svelte +144 -81
  7. package/dist/avatar/avatar.svelte +22 -15
  8. package/dist/badge/badge.svelte +10 -22
  9. package/dist/beam/beam.svelte +20 -21
  10. package/dist/button/button.svelte +45 -24
  11. package/dist/button/button.svelte.d.ts +14 -0
  12. package/dist/button-group/button-group.svelte +4 -5
  13. package/dist/calendar/calendar-button-grid.svelte +11 -4
  14. package/dist/calendar/calendar-button-grid.svelte.d.ts +2 -2
  15. package/dist/calendar/calendar-event-legend.svelte +63 -0
  16. package/dist/calendar/calendar-event-legend.svelte.d.ts +6 -0
  17. package/dist/calendar/calendar-header.svelte +3 -1
  18. package/dist/calendar/calendar-heading.svelte +21 -9
  19. package/dist/calendar/calendar-nav-button.svelte +15 -2
  20. package/dist/calendar/calendar-root.svelte +94 -11
  21. package/dist/calendar/calendar-root.svelte.d.ts +10 -1
  22. package/dist/calendar/calendar-week.svelte +515 -0
  23. package/dist/calendar/calendar-week.svelte.d.ts +12 -0
  24. package/dist/calendar/calendar.meta.js +2 -2
  25. package/dist/calendar/context.svelte.d.ts +19 -0
  26. package/dist/calendar/index.d.ts +11 -1
  27. package/dist/calendar/index.js +5 -1
  28. package/dist/calendar/types.d.ts +32 -0
  29. package/dist/calendar/types.js +1 -0
  30. package/dist/calendar/week-utils.d.ts +12 -0
  31. package/dist/calendar/week-utils.js +133 -0
  32. package/dist/carousel/carousel-button-dots.svelte +12 -6
  33. package/dist/carousel/carousel-root.svelte +201 -17
  34. package/dist/carousel/carousel-root.svelte.d.ts +1 -1
  35. package/dist/carousel/carousel-viewport.svelte +19 -1
  36. package/dist/chart/chart-bars.svelte +43 -19
  37. package/dist/chart/chart-donut.svelte +50 -23
  38. package/dist/chart/chart-root.svelte +19 -4
  39. package/dist/chart/chart-stacked-bar.svelte +3 -2
  40. package/dist/chart/series-color.d.ts +7 -0
  41. package/dist/chart/series-color.js +11 -0
  42. package/dist/chat-thread/chat-thread.svelte +15 -126
  43. package/dist/chat-thread/chat-thread.svelte.d.ts +4 -7
  44. package/dist/chat-thread/index.d.ts +4 -7
  45. package/dist/checkbox/checkbox-input.svelte +48 -41
  46. package/dist/chip/chip-button.svelte +14 -17
  47. package/dist/chip/chip-button.svelte.d.ts +2 -3
  48. package/dist/chip-group/chip-group-root.svelte +6 -4
  49. package/dist/chromatic-aberration/chromatic-aberration.svelte +34 -19
  50. package/dist/chromatic-shift/chromatic-shift.svelte +7 -8
  51. package/dist/code-block/code-block-button.svelte +72 -40
  52. package/dist/color-picker/color-picker-area.svelte +20 -25
  53. package/dist/color-picker/color-picker-input-hue-slider.svelte +12 -9
  54. package/dist/color-picker/color-picker-root.svelte +18 -17
  55. package/dist/color-picker/color-picker-swatch.svelte +17 -16
  56. package/dist/combobox/combobox-content.svelte +4 -14
  57. package/dist/combobox/combobox-input-root.svelte +6 -3
  58. package/dist/combobox/combobox-input-root.svelte.d.ts +2 -1
  59. package/dist/combobox/combobox-input.svelte +13 -10
  60. package/dist/combobox/combobox-item.svelte +9 -4
  61. package/dist/command-palette/command-palette-dialog-root.svelte +1 -0
  62. package/dist/command-palette/command-palette-item.svelte +7 -4
  63. package/dist/context-menu/context-menu-content.svelte +7 -15
  64. package/dist/data-grid/data-grid-button-input-column.svelte +2 -2
  65. package/dist/data-grid/data-grid-cell.svelte +1 -1
  66. package/dist/data-grid/data-grid-input-select-all.svelte +1 -1
  67. package/dist/data-grid/data-grid-input-select-cell.svelte +1 -1
  68. package/dist/date-field/date-field-segment.svelte +10 -12
  69. package/dist/date-picker/datepicker-button-calendar.svelte +2 -2
  70. package/dist/date-picker/datepicker-button-calendar.svelte.d.ts +2 -2
  71. package/dist/date-picker/datepicker-button-trigger.svelte +146 -44
  72. package/dist/date-picker/index.d.ts +4 -1
  73. package/dist/date-range-picker/date-range-picker-button-calendar.svelte +2 -2
  74. package/dist/date-range-picker/date-range-picker-button-calendar.svelte.d.ts +2 -2
  75. package/dist/date-range-picker/date-range-picker-button-trigger.svelte +151 -40
  76. package/dist/date-range-picker/date-range-picker-button-trigger.svelte.d.ts +1 -0
  77. package/dist/date-range-picker/index.d.ts +4 -1
  78. package/dist/diagram/edge-routing.js +18 -7
  79. package/dist/diagram/layout.js +31 -16
  80. package/dist/displacement/displacement.svelte +30 -43
  81. package/dist/drag-and-drop/drag-and-drop-root.svelte +17 -5
  82. package/dist/drag-and-drop/index.d.ts +14 -1
  83. package/dist/drop-zone/drop-zone.svelte +7 -4
  84. package/dist/dropdown-menu/dropdown-menu-content.svelte +15 -16
  85. package/dist/field/field-description.svelte +6 -9
  86. package/dist/field/field-error.svelte +6 -10
  87. package/dist/file-select/file-select-root.svelte +13 -18
  88. package/dist/file-select/file-select-root.svelte.d.ts +2 -1
  89. package/dist/file-upload/file-upload-dropzone.svelte +22 -22
  90. package/dist/file-upload/file-upload-item.svelte +1 -1
  91. package/dist/file-upload/file-upload-list.svelte +1 -1
  92. package/dist/flip-card/flip-card-root.svelte +2 -2
  93. package/dist/float-button/context.svelte.d.ts +2 -0
  94. package/dist/float-button/float-button-action.svelte +41 -11
  95. package/dist/float-button/float-button-root.svelte +52 -13
  96. package/dist/float-button/float-button-trigger.svelte +25 -12
  97. package/dist/format-bytes/format-bytes.svelte +2 -5
  98. package/dist/format-date/format-date.svelte +2 -6
  99. package/dist/format-number/format-number.svelte +2 -6
  100. package/dist/gauge/gauge.svelte +9 -2
  101. package/dist/glass/glass.svelte +4 -3
  102. package/dist/glow/glow.svelte +0 -5
  103. package/dist/god-rays/god-rays.svelte +6 -6
  104. package/dist/gradient-mesh/gradient-mesh.svelte +112 -111
  105. package/dist/halftone/halftone.svelte +17 -28
  106. package/dist/heading/heading.svelte +0 -6
  107. package/dist/hover-card/hover-card-content.svelte +8 -5
  108. package/dist/hover-card/hover-card.meta.js +2 -2
  109. package/dist/icon/icon.svelte +24 -13
  110. package/dist/icon/icon.svelte.d.ts +2 -2
  111. package/dist/icon-swap/icon-swap.svelte +4 -3
  112. package/dist/icon-swap/icon-swap.svelte.d.ts +2 -1
  113. package/dist/image/image.svelte +5 -13
  114. package/dist/image-comparison/image-comparison.svelte +39 -45
  115. package/dist/index.d.ts +3 -5
  116. package/dist/index.js +1 -2
  117. package/dist/input/input.svelte +88 -9
  118. package/dist/input/input.svelte.d.ts +24 -1
  119. package/dist/internal/anchored-overlay-content.svelte.d.ts +12 -6
  120. package/dist/internal/anchored-overlay-content.svelte.js +13 -16
  121. package/dist/internal/calendar-event-layout.d.ts +53 -0
  122. package/dist/internal/calendar-event-layout.js +191 -0
  123. package/dist/internal/calendar-grid-button.svelte +618 -76
  124. package/dist/internal/calendar-grid-button.svelte.d.ts +2 -2
  125. package/dist/internal/calendar-grid-utils.d.ts +3 -0
  126. package/dist/internal/calendar-grid-utils.js +24 -0
  127. package/dist/internal/form-control-wrapper-attrs.d.ts +9 -0
  128. package/dist/internal/form-control-wrapper-attrs.js +1 -0
  129. package/dist/internal/menu-item.svelte +1 -0
  130. package/dist/internal/modal-content.svelte +2 -4
  131. package/dist/internal/motion.d.ts +1 -1
  132. package/dist/internal/motion.js +5 -2
  133. package/dist/internal/picker-popover-content.svelte +15 -16
  134. package/dist/link/link.svelte +8 -5
  135. package/dist/link-preview/link-preview-content.svelte +12 -15
  136. package/dist/link-preview/link-preview-trigger.svelte +3 -6
  137. package/dist/listbox/listbox-item.svelte +13 -18
  138. package/dist/listbox/listbox-root.svelte +4 -9
  139. package/dist/logo-mark/logo-mark.svelte +31 -31
  140. package/dist/map/map-marker.svelte +2 -2
  141. package/dist/map/map-root.svelte +11 -2
  142. package/dist/markdown-renderer/markdown-renderer.svelte +141 -164
  143. package/dist/marquee/marquee.svelte +12 -13
  144. package/dist/mask-reveal/mask-reveal.svelte +14 -27
  145. package/dist/mega-menu/mega-menu-column.svelte +1 -1
  146. package/dist/mega-menu/mega-menu-link.svelte +7 -7
  147. package/dist/mega-menu/mega-menu-panel.svelte +18 -32
  148. package/dist/menubar/menubar-content.svelte +18 -19
  149. package/dist/menubar/menubar-item.svelte +1 -0
  150. package/dist/menubar/menubar-menu.svelte +1 -2
  151. package/dist/menubar/menubar-root.svelte +1 -11
  152. package/dist/motion/enter.svelte +15 -14
  153. package/dist/motion/enter.svelte.d.ts +2 -1
  154. package/dist/motion/exit.svelte +6 -5
  155. package/dist/motion/exit.svelte.d.ts +2 -1
  156. package/dist/motion/stagger.svelte +10 -9
  157. package/dist/motion/stagger.svelte.d.ts +2 -1
  158. package/dist/multi-select-combobox/multi-select-combobox-content.svelte +4 -14
  159. package/dist/multi-select-combobox/multi-select-combobox-input.svelte +6 -5
  160. package/dist/multi-select-combobox/multi-select-combobox-item.svelte +25 -31
  161. package/dist/multi-select-combobox/multi-select-combobox-root-input.svelte +12 -16
  162. package/dist/noise/noise.svelte +20 -19
  163. package/dist/notification-center/notification-center-item.svelte +1 -1
  164. package/dist/notification-center/notification-center-panel.svelte +17 -19
  165. package/dist/number-input/number-input-button.svelte +78 -12
  166. package/dist/number-input/number-input-button.svelte.d.ts +15 -1
  167. package/dist/numeric/numeric.svelte +27 -12
  168. package/dist/numeric/numeric.svelte.d.ts +2 -1
  169. package/dist/option-picker/option-picker-item.svelte +8 -15
  170. package/dist/option-picker/option-picker-preview.svelte +44 -24
  171. package/dist/pagination/pagination-root.svelte +7 -0
  172. package/dist/pin-input/pin-input-root.svelte +2 -11
  173. package/dist/popover/popover-content.svelte +7 -4
  174. package/dist/progress/progress.svelte +2 -2
  175. package/dist/prompt-input/prompt-input-button-textarea.svelte +2 -10
  176. package/dist/qr-code/qr-code.svelte +78 -38
  177. package/dist/qr-code/qr-code.svelte.d.ts +1 -1
  178. package/dist/radio-group/radio-group-item-input.svelte +60 -14
  179. package/dist/radio-group/radio-group-item-input.svelte.d.ts +9 -2
  180. package/dist/range-calendar/index.d.ts +4 -1
  181. package/dist/range-calendar/range-calendar-grid-button.svelte +2 -2
  182. package/dist/range-calendar/range-calendar-grid-button.svelte.d.ts +2 -2
  183. package/dist/relative-time/relative-time.svelte +15 -15
  184. package/dist/reveal/reveal.svelte +12 -24
  185. package/dist/rich-text-editor/rich-text-editor-content.svelte +1 -4
  186. package/dist/scroll-to-top/scroll-to-top-button.svelte +5 -3
  187. package/dist/scroll-to-top/scroll-to-top-button.svelte.d.ts +2 -2
  188. package/dist/segmented-control/segmented-control-root.svelte +0 -3
  189. package/dist/select/index.d.ts +7 -1
  190. package/dist/select/select-content.svelte +15 -16
  191. package/dist/select/select-item.svelte +1 -0
  192. package/dist/select/select-root-input.svelte +5 -4
  193. package/dist/select/select-root-input.svelte.d.ts +2 -2
  194. package/dist/select/select-trigger-button.svelte +122 -16
  195. package/dist/select/select-trigger-button.svelte.d.ts +2 -2
  196. package/dist/shader-canvas/shader-canvas.svelte +11 -20
  197. package/dist/shimmer/shimmer.svelte +28 -25
  198. package/dist/skeleton/skeleton.svelte +18 -23
  199. package/dist/slider/slider-input.svelte +8 -7
  200. package/dist/sparkline/sparkline.svelte +1 -1
  201. package/dist/splitter/splitter-handle.svelte +3 -3
  202. package/dist/splitter/splitter-root.svelte +13 -12
  203. package/dist/spotlight/spotlight.svelte +30 -62
  204. package/dist/star-rating/star-rating-root.svelte +3 -4
  205. package/dist/stepper/stepper-step-button.svelte +2 -2
  206. package/dist/table-of-contents/table-of-contents-root.svelte +5 -16
  207. package/dist/tabs/tabs-content.svelte +7 -1
  208. package/dist/tag/tag-button.svelte +70 -68
  209. package/dist/tags-input/tags-input-root.svelte +2 -9
  210. package/dist/tags-input/tags-input-tag.svelte +1 -1
  211. package/dist/text/index.d.ts +2 -3
  212. package/dist/text/text.svelte +6 -12
  213. package/dist/text/text.svelte.d.ts +2 -3
  214. package/dist/textarea/textarea.svelte +91 -16
  215. package/dist/textarea/textarea.svelte.d.ts +20 -1
  216. package/dist/themes/aurora.css +155 -113
  217. package/dist/themes/component-defaults.css +47 -0
  218. package/dist/themes/dark.css +115 -229
  219. package/dist/themes/default.css +71 -176
  220. package/dist/themes/midnight.css +80 -65
  221. package/dist/themes/terminal.css +69 -73
  222. package/dist/time-input/index.d.ts +2 -2
  223. package/dist/time-input/time-input.meta.js +1 -1
  224. package/dist/time-input/time-input.svelte +5 -3
  225. package/dist/time-input/time-input.svelte.d.ts +2 -2
  226. package/dist/timeline/timeline-title.svelte +0 -6
  227. package/dist/toast/toast-root.svelte +10 -9
  228. package/dist/toggle/toggle-button.svelte +17 -6
  229. package/dist/toggle-group/toggle-group-root.svelte +3 -3
  230. package/dist/token-scope/index.d.ts +6 -0
  231. package/dist/token-scope/index.js +1 -0
  232. package/dist/token-scope/token-scope.meta.js +7 -0
  233. package/dist/toolbar/toolbar-root.svelte +4 -4
  234. package/dist/tooltip/tooltip-content.svelte +24 -13
  235. package/dist/tour/tour-root.css +6 -2
  236. package/dist/transfer/transfer-list-input.svelte +1 -2
  237. package/dist/transfer/transfer-root.svelte +0 -10
  238. package/dist/tree/tree-root.svelte +7 -4
  239. package/dist/typography/blockquote.svelte +2 -2
  240. package/dist/typography/code.svelte +2 -2
  241. package/dist/typography/heading.svelte +2 -2
  242. package/dist/typography/index.d.ts +0 -1
  243. package/dist/typography/text.svelte +2 -13
  244. package/dist/video-embed/video-embed-button.svelte +9 -9
  245. package/package.json +13 -12
  246. package/src/accordion/accordion-button-trigger.svelte +60 -0
  247. package/src/accordion/accordion-content.svelte +37 -0
  248. package/src/accordion/accordion-item.svelte +62 -0
  249. package/src/accordion/accordion-root.svelte +61 -0
  250. package/src/accordion/accordion.meta.ts +7 -0
  251. package/src/accordion/context.svelte.ts +19 -0
  252. package/src/accordion/index.ts +41 -0
  253. package/src/adjust/adjust.meta.ts +7 -0
  254. package/src/adjust/adjust.svelte +71 -0
  255. package/src/adjust/index.ts +20 -0
  256. package/src/alert/alert.meta.ts +7 -0
  257. package/src/alert/alert.svelte +174 -0
  258. package/src/alert/index.ts +18 -0
  259. package/src/alert-dialog/alert-dialog-body.svelte +23 -0
  260. package/src/alert-dialog/alert-dialog-button-action.svelte +15 -0
  261. package/src/alert-dialog/alert-dialog-button-cancel.svelte +18 -0
  262. package/src/alert-dialog/alert-dialog-content.svelte +26 -0
  263. package/src/alert-dialog/alert-dialog-footer.svelte +29 -0
  264. package/src/alert-dialog/alert-dialog-header.svelte +26 -0
  265. package/src/alert-dialog/alert-dialog-overlay.svelte +34 -0
  266. package/src/alert-dialog/alert-dialog-root.svelte +31 -0
  267. package/src/alert-dialog/alert-dialog-trigger.svelte +56 -0
  268. package/src/alert-dialog/alert-dialog.meta.ts +7 -0
  269. package/src/alert-dialog/context.svelte.ts +11 -0
  270. package/src/alert-dialog/index.ts +43 -0
  271. package/src/alpha-slider/alpha-slider-input.svelte +165 -0
  272. package/src/alpha-slider/alpha-slider.meta.ts +7 -0
  273. package/src/alpha-slider/index.ts +10 -0
  274. package/src/app-frame/app-frame.meta.ts +8 -0
  275. package/src/app-frame/app-frame.svelte +141 -0
  276. package/src/app-frame/index.ts +10 -0
  277. package/src/aspect-ratio/aspect-ratio.meta.ts +7 -0
  278. package/src/aspect-ratio/aspect-ratio.svelte +29 -0
  279. package/src/aspect-ratio/index.ts +9 -0
  280. package/src/aurora/aurora.meta.ts +8 -0
  281. package/src/aurora/aurora.svelte +526 -0
  282. package/src/aurora/index.ts +24 -0
  283. package/src/avatar/avatar.meta.ts +7 -0
  284. package/src/avatar/avatar.svelte +213 -0
  285. package/src/avatar/index.ts +15 -0
  286. package/src/backdrop/backdrop.meta.ts +7 -0
  287. package/src/backdrop/backdrop.svelte +51 -0
  288. package/src/backdrop/index.ts +3 -0
  289. package/src/badge/badge.meta.ts +7 -0
  290. package/src/badge/badge.svelte +334 -0
  291. package/src/badge/index.ts +12 -0
  292. package/src/beam/beam.meta.ts +8 -0
  293. package/src/beam/beam.svelte +118 -0
  294. package/src/beam/index.ts +17 -0
  295. package/src/border-beam/border-beam.meta.ts +8 -0
  296. package/src/border-beam/border-beam.svelte +42 -0
  297. package/src/border-beam/index.ts +10 -0
  298. package/src/breadcrumb/breadcrumb-item.svelte +23 -0
  299. package/src/breadcrumb/breadcrumb-link.svelte +60 -0
  300. package/src/breadcrumb/breadcrumb-list.svelte +28 -0
  301. package/src/breadcrumb/breadcrumb-root.svelte +14 -0
  302. package/src/breadcrumb/breadcrumb-separator.svelte +25 -0
  303. package/src/breadcrumb/breadcrumb.meta.ts +7 -0
  304. package/src/breadcrumb/index.ts +44 -0
  305. package/src/button/button.meta.ts +7 -0
  306. package/src/button/button.svelte +675 -0
  307. package/src/button/index.ts +29 -0
  308. package/src/button-group/button-group.meta.ts +7 -0
  309. package/src/button-group/button-group.svelte +61 -0
  310. package/src/button-group/context.svelte.ts +15 -0
  311. package/src/button-group/index.ts +7 -0
  312. package/src/calendar/calendar-button-grid.svelte +58 -0
  313. package/src/calendar/calendar-button-next.svelte +13 -0
  314. package/src/calendar/calendar-button-prev.svelte +13 -0
  315. package/src/calendar/calendar-event-legend.svelte +63 -0
  316. package/src/calendar/calendar-header.svelte +28 -0
  317. package/src/calendar/calendar-heading.svelte +42 -0
  318. package/src/calendar/calendar-nav-button.svelte +39 -0
  319. package/src/calendar/calendar-root.svelte +211 -0
  320. package/src/calendar/calendar-week.svelte +515 -0
  321. package/src/calendar/calendar.meta.ts +7 -0
  322. package/src/calendar/context.svelte.ts +43 -0
  323. package/src/calendar/index.ts +57 -0
  324. package/src/calendar/types.ts +39 -0
  325. package/src/calendar/week-utils.ts +175 -0
  326. package/src/carousel/carousel-button-dots.svelte +74 -0
  327. package/src/carousel/carousel-button-next.svelte +13 -0
  328. package/src/carousel/carousel-button-prev.svelte +13 -0
  329. package/src/carousel/carousel-button-thumbnails.svelte +82 -0
  330. package/src/carousel/carousel-nav-button.svelte +31 -0
  331. package/src/carousel/carousel-root.svelte +432 -0
  332. package/src/carousel/carousel-slide.svelte +39 -0
  333. package/src/carousel/carousel-viewport.svelte +91 -0
  334. package/src/carousel/carousel.meta.ts +7 -0
  335. package/src/carousel/context.svelte.ts +22 -0
  336. package/src/carousel/index.ts +35 -0
  337. package/src/chart/chart-area.svelte +76 -0
  338. package/src/chart/chart-bars.svelte +102 -0
  339. package/src/chart/chart-donut.svelte +145 -0
  340. package/src/chart/chart-horizontal-bar.svelte +67 -0
  341. package/src/chart/chart-line.svelte +66 -0
  342. package/src/chart/chart-root.svelte +257 -0
  343. package/src/chart/chart-stacked-bar.svelte +77 -0
  344. package/src/chart/chart-x-axis.svelte +50 -0
  345. package/src/chart/chart-y-axis.svelte +71 -0
  346. package/src/chart/chart.meta.ts +7 -0
  347. package/src/chart/context.svelte.ts +29 -0
  348. package/src/chart/index.ts +86 -0
  349. package/src/chart/series-color.ts +12 -0
  350. package/src/chat-thread/chat-thread.meta.ts +7 -0
  351. package/src/chat-thread/chat-thread.svelte +97 -0
  352. package/src/chat-thread/index.ts +10 -0
  353. package/src/checkbox/checkbox-input.svelte +259 -0
  354. package/src/checkbox/checkbox.meta.ts +7 -0
  355. package/src/checkbox/index.ts +7 -0
  356. package/src/chip/chip-button.svelte +170 -0
  357. package/src/chip/chip.meta.ts +7 -0
  358. package/src/chip/index.ts +29 -0
  359. package/src/chip-group/chip-group-button-item.svelte +36 -0
  360. package/src/chip-group/chip-group-label.svelte +26 -0
  361. package/src/chip-group/chip-group-root.svelte +129 -0
  362. package/src/chip-group/chip-group.meta.ts +19 -0
  363. package/src/chip-group/context.svelte.ts +11 -0
  364. package/src/chip-group/index.ts +26 -0
  365. package/src/chromatic-aberration/chromatic-aberration.meta.ts +7 -0
  366. package/src/chromatic-aberration/chromatic-aberration.svelte +87 -0
  367. package/src/chromatic-aberration/index.ts +10 -0
  368. package/src/chromatic-shift/chromatic-shift.meta.ts +7 -0
  369. package/src/chromatic-shift/chromatic-shift.svelte +226 -0
  370. package/src/chromatic-shift/index.ts +5 -0
  371. package/src/clipboard/clipboard.meta.ts +7 -0
  372. package/src/clipboard/clipboard.svelte +38 -0
  373. package/src/clipboard/index.ts +3 -0
  374. package/src/code-block/code-block-button.svelte +371 -0
  375. package/src/code-block/code-block.meta.ts +7 -0
  376. package/src/code-block/highlighter/css.ts +387 -0
  377. package/src/code-block/highlighter/generic.ts +24 -0
  378. package/src/code-block/highlighter/index.ts +30 -0
  379. package/src/code-block/highlighter/svelte.ts +597 -0
  380. package/src/code-block/highlighter/types.ts +7 -0
  381. package/src/code-block/index.ts +11 -0
  382. package/src/collapsible/collapsible-button-trigger.svelte +50 -0
  383. package/src/collapsible/collapsible-content.svelte +57 -0
  384. package/src/collapsible/collapsible-root.svelte +48 -0
  385. package/src/collapsible/collapsible.meta.ts +7 -0
  386. package/src/collapsible/context.svelte.ts +10 -0
  387. package/src/collapsible/index.ts +30 -0
  388. package/src/color-picker/color-picker-area.svelte +181 -0
  389. package/src/color-picker/color-picker-button-eyedropper.svelte +61 -0
  390. package/src/color-picker/color-picker-channel-input.svelte +85 -0
  391. package/src/color-picker/color-picker-input-alpha-slider.svelte +144 -0
  392. package/src/color-picker/color-picker-input-hue-slider.svelte +146 -0
  393. package/src/color-picker/color-picker-input.svelte +129 -0
  394. package/src/color-picker/color-picker-root.svelte +185 -0
  395. package/src/color-picker/color-picker-swatch.svelte +116 -0
  396. package/src/color-picker/color-picker.meta.ts +7 -0
  397. package/src/color-picker/context.svelte.ts +19 -0
  398. package/src/color-picker/index.ts +45 -0
  399. package/src/combobox/combobox-content.svelte +124 -0
  400. package/src/combobox/combobox-empty.svelte +23 -0
  401. package/src/combobox/combobox-group.svelte +35 -0
  402. package/src/combobox/combobox-input-root.svelte +109 -0
  403. package/src/combobox/combobox-input.svelte +348 -0
  404. package/src/combobox/combobox-item.svelte +150 -0
  405. package/src/combobox/combobox.meta.ts +7 -0
  406. package/src/combobox/context.svelte.ts +22 -0
  407. package/src/combobox/index.ts +44 -0
  408. package/src/command-palette/command-palette-dialog-root.svelte +184 -0
  409. package/src/command-palette/command-palette-empty.svelte +30 -0
  410. package/src/command-palette/command-palette-group.svelte +37 -0
  411. package/src/command-palette/command-palette-input.svelte +91 -0
  412. package/src/command-palette/command-palette-item.svelte +100 -0
  413. package/src/command-palette/command-palette-list.svelte +52 -0
  414. package/src/command-palette/command-palette-separator.svelte +17 -0
  415. package/src/command-palette/command-palette.meta.ts +7 -0
  416. package/src/command-palette/context.svelte.ts +19 -0
  417. package/src/command-palette/index.ts +35 -0
  418. package/src/container/container.meta.ts +7 -0
  419. package/src/container/container.svelte +66 -0
  420. package/src/container/index.ts +10 -0
  421. package/src/context-menu/context-menu-content.svelte +114 -0
  422. package/src/context-menu/context-menu-group.svelte +15 -0
  423. package/src/context-menu/context-menu-item.svelte +27 -0
  424. package/src/context-menu/context-menu-label.svelte +15 -0
  425. package/src/context-menu/context-menu-root.svelte +26 -0
  426. package/src/context-menu/context-menu-separator.svelte +10 -0
  427. package/src/context-menu/context-menu-trigger.svelte +35 -0
  428. package/src/context-menu/context-menu.meta.ts +7 -0
  429. package/src/context-menu/context.svelte.ts +7 -0
  430. package/src/context-menu/index.ts +35 -0
  431. package/src/data-grid/context.svelte.ts +28 -0
  432. package/src/data-grid/data-grid-body.svelte +17 -0
  433. package/src/data-grid/data-grid-button-expand-trigger.svelte +45 -0
  434. package/src/data-grid/data-grid-button-input-column.svelte +263 -0
  435. package/src/data-grid/data-grid-button-pagination.svelte +130 -0
  436. package/src/data-grid/data-grid-cell.svelte +37 -0
  437. package/src/data-grid/data-grid-expandable-row.svelte +58 -0
  438. package/src/data-grid/data-grid-header.svelte +21 -0
  439. package/src/data-grid/data-grid-input-select-all.svelte +52 -0
  440. package/src/data-grid/data-grid-input-select-cell.svelte +40 -0
  441. package/src/data-grid/data-grid-root.svelte +229 -0
  442. package/src/data-grid/data-grid-row.svelte +38 -0
  443. package/src/data-grid/data-grid-table.svelte +21 -0
  444. package/src/data-grid/data-grid.meta.ts +7 -0
  445. package/src/data-grid/index.ts +75 -0
  446. package/src/date-field/context.svelte.ts +50 -0
  447. package/src/date-field/date-field-input-root.svelte +284 -0
  448. package/src/date-field/date-field-segment.svelte +180 -0
  449. package/src/date-field/date-field-separator.svelte +25 -0
  450. package/src/date-field/date-field.meta.ts +7 -0
  451. package/src/date-field/index.ts +23 -0
  452. package/src/date-picker/context.svelte.ts +27 -0
  453. package/src/date-picker/date-picker.meta.ts +7 -0
  454. package/src/date-picker/datepicker-button-calendar.svelte +58 -0
  455. package/src/date-picker/datepicker-button-trigger.svelte +174 -0
  456. package/src/date-picker/datepicker-content.svelte +35 -0
  457. package/src/date-picker/datepicker-input-root.svelte +137 -0
  458. package/src/date-picker/index.ts +27 -0
  459. package/src/date-range-picker/context.svelte.ts +30 -0
  460. package/src/date-range-picker/date-range-picker-button-calendar.svelte +96 -0
  461. package/src/date-range-picker/date-range-picker-button-preset.svelte +25 -0
  462. package/src/date-range-picker/date-range-picker-button-trigger.svelte +188 -0
  463. package/src/date-range-picker/date-range-picker-content.svelte +35 -0
  464. package/src/date-range-picker/date-range-picker-root.svelte +155 -0
  465. package/src/date-range-picker/date-range-picker.meta.ts +7 -0
  466. package/src/date-range-picker/index.ts +30 -0
  467. package/src/date-time-input/date-time-input.meta.ts +7 -0
  468. package/src/date-time-input/date-time-input.svelte +104 -0
  469. package/src/date-time-input/index.ts +7 -0
  470. package/src/description-list/description-list-description.svelte +23 -0
  471. package/src/description-list/description-list-item.svelte +34 -0
  472. package/src/description-list/description-list-root.svelte +22 -0
  473. package/src/description-list/description-list-term.svelte +23 -0
  474. package/src/description-list/description-list.meta.ts +7 -0
  475. package/src/description-list/index.ts +35 -0
  476. package/src/diagram/diagram.meta.ts +8 -0
  477. package/src/diagram/diagram.svelte +966 -0
  478. package/src/diagram/edge-routing.ts +782 -0
  479. package/src/diagram/index.ts +23 -0
  480. package/src/diagram/layout.ts +2024 -0
  481. package/src/diagram/types.ts +262 -0
  482. package/src/dialog/context.svelte.ts +10 -0
  483. package/src/dialog/dialog-body.svelte +23 -0
  484. package/src/dialog/dialog-close.svelte +18 -0
  485. package/src/dialog/dialog-content.svelte +18 -0
  486. package/src/dialog/dialog-footer.svelte +35 -0
  487. package/src/dialog/dialog-header.svelte +26 -0
  488. package/src/dialog/dialog-overlay.svelte +28 -0
  489. package/src/dialog/dialog-root.svelte +31 -0
  490. package/src/dialog/dialog-trigger.svelte +56 -0
  491. package/src/dialog/dialog.meta.ts +7 -0
  492. package/src/dialog/index.ts +39 -0
  493. package/src/displacement/displacement.meta.ts +7 -0
  494. package/src/displacement/displacement.svelte +140 -0
  495. package/src/displacement/index.ts +5 -0
  496. package/src/drag-and-drop/context.svelte.ts +21 -0
  497. package/src/drag-and-drop/drag-and-drop-group.svelte +37 -0
  498. package/src/drag-and-drop/drag-and-drop-handle.svelte +106 -0
  499. package/src/drag-and-drop/drag-and-drop-item.svelte +151 -0
  500. package/src/drag-and-drop/drag-and-drop-root.svelte +876 -0
  501. package/src/drag-and-drop/drag-and-drop.meta.ts +7 -0
  502. package/src/drag-and-drop/group-context.svelte.ts +20 -0
  503. package/src/drag-and-drop/index.ts +34 -0
  504. package/src/drawer/context.svelte.ts +11 -0
  505. package/src/drawer/drawer-body.svelte +33 -0
  506. package/src/drawer/drawer-close.svelte +18 -0
  507. package/src/drawer/drawer-dialog-content.svelte +18 -0
  508. package/src/drawer/drawer-footer.svelte +27 -0
  509. package/{dist/card/card-footer.svelte → src/drawer/drawer-header.svelte} +8 -10
  510. package/src/drawer/drawer-overlay.svelte +34 -0
  511. package/src/drawer/drawer-root.svelte +35 -0
  512. package/src/drawer/drawer-trigger.svelte +56 -0
  513. package/src/drawer/drawer.meta.ts +7 -0
  514. package/src/drawer/index.ts +43 -0
  515. package/src/drop-zone/drop-zone.meta.ts +7 -0
  516. package/src/drop-zone/drop-zone.svelte +95 -0
  517. package/src/drop-zone/index.ts +6 -0
  518. package/src/dropdown-menu/context.svelte.ts +7 -0
  519. package/src/dropdown-menu/dropdown-menu-content.svelte +137 -0
  520. package/src/dropdown-menu/dropdown-menu-group.svelte +15 -0
  521. package/src/dropdown-menu/dropdown-menu-item.svelte +27 -0
  522. package/src/dropdown-menu/dropdown-menu-label.svelte +15 -0
  523. package/src/dropdown-menu/dropdown-menu-root.svelte +26 -0
  524. package/src/dropdown-menu/dropdown-menu-separator.svelte +10 -0
  525. package/src/dropdown-menu/dropdown-menu-trigger.svelte +65 -0
  526. package/src/dropdown-menu/dropdown-menu.meta.ts +7 -0
  527. package/src/dropdown-menu/index.ts +35 -0
  528. package/src/enter/enter.meta.ts +8 -0
  529. package/src/enter/index.ts +1 -0
  530. package/src/exit/exit.meta.ts +8 -0
  531. package/src/exit/index.ts +1 -0
  532. package/src/field/field-description.svelte +38 -0
  533. package/src/field/field-error.svelte +40 -0
  534. package/src/field/field-root.svelte +98 -0
  535. package/src/field/field.meta.ts +7 -0
  536. package/src/field/index.ts +15 -0
  537. package/src/fieldset/fieldset-content.svelte +21 -0
  538. package/src/fieldset/fieldset-description.svelte +26 -0
  539. package/src/fieldset/fieldset-legend.svelte +26 -0
  540. package/src/fieldset/fieldset-root.svelte +27 -0
  541. package/src/fieldset/fieldset.meta.ts +7 -0
  542. package/src/fieldset/index.ts +35 -0
  543. package/src/file-select/context.svelte.ts +10 -0
  544. package/src/file-select/file-select-button-clear.svelte +37 -0
  545. package/src/file-select/file-select-button-trigger.svelte +26 -0
  546. package/src/file-select/file-select-root.svelte +168 -0
  547. package/src/file-select/file-select-value.svelte +43 -0
  548. package/src/file-select/file-select.meta.ts +7 -0
  549. package/src/file-select/index.ts +29 -0
  550. package/src/file-upload/context.svelte.ts +17 -0
  551. package/src/file-upload/file-upload-button-item-delete.svelte +36 -0
  552. package/src/file-upload/file-upload-button-trigger.svelte +31 -0
  553. package/src/file-upload/file-upload-dropzone.svelte +145 -0
  554. package/src/file-upload/file-upload-input-root.svelte +144 -0
  555. package/src/file-upload/file-upload-item.svelte +63 -0
  556. package/src/file-upload/file-upload-list.svelte +37 -0
  557. package/src/file-upload/file-upload.meta.ts +7 -0
  558. package/src/file-upload/index.ts +52 -0
  559. package/src/flip-card/context.svelte.ts +8 -0
  560. package/src/flip-card/flip-card-back.svelte +34 -0
  561. package/src/flip-card/flip-card-front.svelte +25 -0
  562. package/src/flip-card/flip-card-root.svelte +116 -0
  563. package/src/flip-card/flip-card.meta.ts +7 -0
  564. package/src/flip-card/index.ts +15 -0
  565. package/src/float-button/context.svelte.ts +10 -0
  566. package/src/float-button/float-button-action.svelte +56 -0
  567. package/src/float-button/float-button-root.svelte +102 -0
  568. package/src/float-button/float-button-trigger.svelte +43 -0
  569. package/src/float-button/float-button.meta.ts +7 -0
  570. package/src/float-button/index.ts +29 -0
  571. package/src/focus-trap/focus-trap.meta.ts +7 -0
  572. package/src/focus-trap/focus-trap.svelte +16 -0
  573. package/src/focus-trap/index.ts +3 -0
  574. package/src/format-bytes/format-bytes.meta.ts +7 -0
  575. package/src/format-bytes/format-bytes.svelte +60 -0
  576. package/src/format-bytes/index.ts +3 -0
  577. package/src/format-date/format-date.meta.ts +7 -0
  578. package/src/format-date/format-date.svelte +80 -0
  579. package/src/format-date/index.ts +3 -0
  580. package/src/format-number/format-number.meta.ts +7 -0
  581. package/src/format-number/format-number.svelte +59 -0
  582. package/src/format-number/index.ts +3 -0
  583. package/src/gauge/gauge.meta.ts +7 -0
  584. package/src/gauge/gauge.svelte +143 -0
  585. package/src/gauge/index.ts +2 -0
  586. package/src/glass/glass.meta.ts +7 -0
  587. package/src/glass/glass.svelte +49 -0
  588. package/src/glass/index.ts +11 -0
  589. package/src/glow/glow.meta.ts +7 -0
  590. package/src/glow/glow.svelte +60 -0
  591. package/src/glow/index.ts +15 -0
  592. package/src/god-rays/god-rays.meta.ts +8 -0
  593. package/src/god-rays/god-rays.svelte +132 -0
  594. package/src/god-rays/index.ts +17 -0
  595. package/src/gradient-mesh/gradient-mesh.meta.ts +7 -0
  596. package/src/gradient-mesh/gradient-mesh.svelte +295 -0
  597. package/src/gradient-mesh/index.ts +5 -0
  598. package/src/halftone/halftone.meta.ts +7 -0
  599. package/src/halftone/halftone.svelte +93 -0
  600. package/src/halftone/index.ts +14 -0
  601. package/src/heading/heading.meta.ts +7 -0
  602. package/src/heading/heading.svelte +120 -0
  603. package/src/heading/index.ts +17 -0
  604. package/src/hotkey/hotkey.meta.ts +7 -0
  605. package/src/hotkey/index.ts +2 -0
  606. package/src/hover-card/context.svelte.ts +1 -0
  607. package/src/hover-card/hover-card-content.svelte +121 -0
  608. package/src/hover-card/hover-card-root.svelte +11 -0
  609. package/src/hover-card/hover-card-trigger.svelte +109 -0
  610. package/src/hover-card/hover-card.meta.ts +7 -0
  611. package/src/hover-card/index.ts +19 -0
  612. package/src/icon/icon.meta.ts +7 -0
  613. package/src/icon/icon.svelte +92 -0
  614. package/src/icon/index.ts +11 -0
  615. package/src/icon-swap/icon-swap.meta.ts +7 -0
  616. package/src/icon-swap/icon-swap.svelte +48 -0
  617. package/src/icon-swap/index.ts +1 -0
  618. package/src/image/image.meta.ts +7 -0
  619. package/src/image/image.svelte +73 -0
  620. package/src/image/index.ts +3 -0
  621. package/src/image-comparison/image-comparison.meta.ts +7 -0
  622. package/src/image-comparison/image-comparison.svelte +272 -0
  623. package/src/image-comparison/index.ts +3 -0
  624. package/src/index.ts +863 -0
  625. package/src/infinite-scroll/index.ts +3 -0
  626. package/src/infinite-scroll/infinite-scroll.meta.ts +7 -0
  627. package/src/infinite-scroll/infinite-scroll.svelte +109 -0
  628. package/src/input/index.ts +8 -0
  629. package/src/input/input.meta.ts +7 -0
  630. package/src/input/input.svelte +261 -0
  631. package/src/input-group/context.svelte.ts +9 -0
  632. package/src/input-group/index.ts +45 -0
  633. package/src/input-group/input-group-action-button.svelte +29 -0
  634. package/src/input-group/input-group-input.svelte +57 -0
  635. package/src/input-group/input-group-prefix.svelte +43 -0
  636. package/src/input-group/input-group-root.svelte +108 -0
  637. package/src/input-group/input-group-select.svelte +70 -0
  638. package/src/input-group/input-group-separator.svelte +38 -0
  639. package/src/input-group/input-group-suffix.svelte +43 -0
  640. package/src/input-group/input-group.meta.ts +8 -0
  641. package/src/internal/anchored-overlay-content.svelte.ts +42 -0
  642. package/src/internal/calendar-event-layout.ts +294 -0
  643. package/src/internal/calendar-grid-button.svelte +805 -0
  644. package/src/internal/calendar-grid-utils.ts +123 -0
  645. package/src/internal/close-button-base.svelte +35 -0
  646. package/src/internal/color-aliases.ts +37 -0
  647. package/src/internal/date-family-controller.svelte.ts +165 -0
  648. package/src/internal/form-control-wrapper-attrs.ts +20 -0
  649. package/src/internal/menu-group.svelte +15 -0
  650. package/src/internal/menu-item.svelte +89 -0
  651. package/src/internal/menu-label.svelte +24 -0
  652. package/src/internal/menu-root-state.svelte.ts +73 -0
  653. package/src/internal/menu-separator.svelte +19 -0
  654. package/src/internal/modal-content.svelte +351 -0
  655. package/src/internal/motion.ts +85 -0
  656. package/src/internal/nav-arrow-button.svelte +42 -0
  657. package/src/internal/picker-popover-content.svelte +111 -0
  658. package/src/kbd/index.ts +9 -0
  659. package/src/kbd/kbd.meta.ts +7 -0
  660. package/src/kbd/kbd.svelte +56 -0
  661. package/src/label/index.ts +7 -0
  662. package/src/label/label.meta.ts +7 -0
  663. package/src/label/label.svelte +74 -0
  664. package/src/link/index.ts +7 -0
  665. package/src/link/link.meta.ts +7 -0
  666. package/src/link/link.svelte +104 -0
  667. package/src/link-preview/context.svelte.ts +15 -0
  668. package/src/link-preview/index.ts +19 -0
  669. package/src/link-preview/link-preview-content.svelte +87 -0
  670. package/src/link-preview/link-preview-root.svelte +72 -0
  671. package/src/link-preview/link-preview-trigger.svelte +61 -0
  672. package/src/link-preview/link-preview.meta.ts +7 -0
  673. package/src/list/context.svelte.ts +7 -0
  674. package/src/list/index.ts +27 -0
  675. package/src/list/list-item-icon.svelte +22 -0
  676. package/src/list/list-item-text.svelte +42 -0
  677. package/src/list/list-item.svelte +116 -0
  678. package/src/list/list-root.svelte +71 -0
  679. package/src/list/list-subheader.svelte +25 -0
  680. package/src/list/list.meta.ts +7 -0
  681. package/src/listbox/context.svelte.ts +10 -0
  682. package/src/listbox/index.ts +12 -0
  683. package/src/listbox/listbox-item.svelte +90 -0
  684. package/src/listbox/listbox-root.svelte +115 -0
  685. package/src/listbox/listbox.meta.ts +7 -0
  686. package/src/logo-mark/index.ts +12 -0
  687. package/src/logo-mark/logo-mark.meta.ts +7 -0
  688. package/src/logo-mark/logo-mark.svelte +154 -0
  689. package/src/map/context.svelte.ts +19 -0
  690. package/src/map/index.ts +77 -0
  691. package/src/map/map-controls.svelte +68 -0
  692. package/src/map/map-layer.svelte +101 -0
  693. package/src/map/map-marker.svelte +83 -0
  694. package/src/map/map-popup.svelte +71 -0
  695. package/src/map/map-root.svelte +244 -0
  696. package/src/map/map.meta.ts +7 -0
  697. package/src/markdown-renderer/index.ts +4 -0
  698. package/src/markdown-renderer/markdown-renderer.meta.ts +7 -0
  699. package/src/markdown-renderer/markdown-renderer.svelte +202 -0
  700. package/src/marquee/index.ts +3 -0
  701. package/src/marquee/marquee.meta.ts +7 -0
  702. package/src/marquee/marquee.svelte +218 -0
  703. package/src/mask-reveal/index.ts +5 -0
  704. package/src/mask-reveal/mask-reveal.meta.ts +7 -0
  705. package/src/mask-reveal/mask-reveal.svelte +214 -0
  706. package/src/mega-menu/context.svelte.ts +17 -0
  707. package/src/mega-menu/index.ts +31 -0
  708. package/src/mega-menu/mega-menu-button-trigger.svelte +37 -0
  709. package/src/mega-menu/mega-menu-column.svelte +34 -0
  710. package/src/mega-menu/mega-menu-item.svelte +51 -0
  711. package/src/mega-menu/mega-menu-link.svelte +137 -0
  712. package/src/mega-menu/mega-menu-panel.svelte +134 -0
  713. package/src/mega-menu/mega-menu-root.svelte +98 -0
  714. package/src/mega-menu/mega-menu.meta.ts +7 -0
  715. package/src/menubar/context.svelte.ts +24 -0
  716. package/src/menubar/index.ts +35 -0
  717. package/src/menubar/menubar-button-trigger.svelte +75 -0
  718. package/src/menubar/menubar-content.svelte +147 -0
  719. package/src/menubar/menubar-item.svelte +96 -0
  720. package/{dist/card/card-header.svelte → src/menubar/menubar-label.svelte} +6 -10
  721. package/src/menubar/menubar-menu.svelte +32 -0
  722. package/src/menubar/menubar-root.svelte +78 -0
  723. package/src/menubar/menubar-separator.svelte +17 -0
  724. package/src/menubar/menubar.meta.ts +7 -0
  725. package/src/motion/enter.svelte +29 -0
  726. package/src/motion/enter.ts +46 -0
  727. package/src/motion/exit.svelte +21 -0
  728. package/src/motion/index.ts +7 -0
  729. package/src/motion/leave.ts +41 -0
  730. package/src/motion/motion.meta.ts +8 -0
  731. package/src/motion/stagger.svelte +30 -0
  732. package/src/multi-select-combobox/context.svelte.ts +31 -0
  733. package/src/multi-select-combobox/index.ts +43 -0
  734. package/src/multi-select-combobox/multi-select-combobox-content.svelte +118 -0
  735. package/src/multi-select-combobox/multi-select-combobox-empty.svelte +28 -0
  736. package/src/multi-select-combobox/multi-select-combobox-group.svelte +33 -0
  737. package/src/multi-select-combobox/multi-select-combobox-input.svelte +161 -0
  738. package/src/multi-select-combobox/multi-select-combobox-item.svelte +140 -0
  739. package/src/multi-select-combobox/multi-select-combobox-root-input.svelte +286 -0
  740. package/src/multi-select-combobox/multi-select-combobox-selection-item.svelte +63 -0
  741. package/src/multi-select-combobox/multi-select-combobox-selection-list.svelte +29 -0
  742. package/src/multi-select-combobox/multi-select-combobox-selection-remove-button.svelte +36 -0
  743. package/src/multi-select-combobox/multi-select-combobox.meta.ts +7 -0
  744. package/src/navigation-menu/context.svelte.ts +18 -0
  745. package/src/navigation-menu/index.ts +50 -0
  746. package/src/navigation-menu/navigation-menu-content.svelte +55 -0
  747. package/src/navigation-menu/navigation-menu-item.svelte +35 -0
  748. package/src/navigation-menu/navigation-menu-link.svelte +49 -0
  749. package/src/navigation-menu/navigation-menu-list.svelte +47 -0
  750. package/src/navigation-menu/navigation-menu-root.svelte +46 -0
  751. package/src/navigation-menu/navigation-menu-trigger-button.svelte +62 -0
  752. package/src/navigation-menu/navigation-menu.meta.ts +7 -0
  753. package/src/noise/index.ts +15 -0
  754. package/src/noise/noise.meta.ts +7 -0
  755. package/src/noise/noise.svelte +179 -0
  756. package/src/notification-center/context.svelte.ts +24 -0
  757. package/src/notification-center/index.ts +28 -0
  758. package/src/notification-center/notification-center-group.svelte +30 -0
  759. package/src/notification-center/notification-center-item.svelte +70 -0
  760. package/src/notification-center/notification-center-panel.svelte +162 -0
  761. package/src/notification-center/notification-center-root.svelte +73 -0
  762. package/src/notification-center/notification-center-trigger-button.svelte +28 -0
  763. package/src/notification-center/notification-center.meta.ts +7 -0
  764. package/src/number-input/index.ts +7 -0
  765. package/src/number-input/number-input-button.svelte +222 -0
  766. package/src/number-input/number-input.meta.ts +7 -0
  767. package/src/numeric/index.ts +1 -0
  768. package/src/numeric/numeric.meta.ts +7 -0
  769. package/src/numeric/numeric.svelte +64 -0
  770. package/src/option-picker/context.svelte.ts +11 -0
  771. package/src/option-picker/index.ts +52 -0
  772. package/src/option-picker/option-picker-description.svelte +25 -0
  773. package/src/option-picker/option-picker-item.svelte +242 -0
  774. package/src/option-picker/option-picker-label.svelte +24 -0
  775. package/src/option-picker/option-picker-meta.svelte +24 -0
  776. package/src/option-picker/option-picker-preview.svelte +164 -0
  777. package/src/option-picker/option-picker-root.svelte +82 -0
  778. package/src/option-picker/option-picker.meta.ts +8 -0
  779. package/src/pagination/context.svelte.ts +12 -0
  780. package/src/pagination/index.ts +35 -0
  781. package/src/pagination/pagination-content.svelte +27 -0
  782. package/src/pagination/pagination-ellipsis.svelte +19 -0
  783. package/src/pagination/pagination-item.svelte +14 -0
  784. package/src/pagination/pagination-link-button.svelte +28 -0
  785. package/src/pagination/pagination-nav-button.svelte +28 -0
  786. package/src/pagination/pagination-next-button.svelte +13 -0
  787. package/src/pagination/pagination-previous-button.svelte +13 -0
  788. package/src/pagination/pagination-root.svelte +48 -0
  789. package/src/pagination/pagination.meta.ts +7 -0
  790. package/src/phone-input/index.ts +9 -0
  791. package/src/phone-input/phone-input-select.svelte +286 -0
  792. package/src/phone-input/phone-input.meta.ts +7 -0
  793. package/src/pin-input/context.svelte.ts +18 -0
  794. package/src/pin-input/index.ts +31 -0
  795. package/src/pin-input/pin-input-cell.svelte +117 -0
  796. package/src/pin-input/pin-input-group.svelte +24 -0
  797. package/src/pin-input/pin-input-root.svelte +315 -0
  798. package/src/pin-input/pin-input-separator.svelte +28 -0
  799. package/src/pin-input/pin-input.meta.ts +7 -0
  800. package/src/popover/context.svelte.ts +13 -0
  801. package/src/popover/index.ts +15 -0
  802. package/src/popover/popover-content.svelte +112 -0
  803. package/src/popover/popover-root.svelte +39 -0
  804. package/src/popover/popover-trigger.svelte +62 -0
  805. package/src/popover/popover.meta.ts +7 -0
  806. package/src/portal/index.ts +3 -0
  807. package/src/portal/portal.meta.ts +7 -0
  808. package/src/portal/portal.svelte +14 -0
  809. package/src/progress/index.ts +14 -0
  810. package/src/progress/progress.meta.ts +7 -0
  811. package/src/progress/progress.svelte +302 -0
  812. package/src/progress-ring/index.ts +8 -0
  813. package/src/progress-ring/progress-ring.meta.ts +7 -0
  814. package/src/progress-ring/progress-ring.svelte +169 -0
  815. package/src/prompt-input/index.ts +16 -0
  816. package/src/prompt-input/prompt-input-button-textarea.svelte +171 -0
  817. package/src/prompt-input/prompt-input.meta.ts +7 -0
  818. package/src/qr-code/index.ts +3 -0
  819. package/src/qr-code/qr-code.meta.ts +7 -0
  820. package/src/qr-code/qr-code.svelte +149 -0
  821. package/src/radio-group/context.svelte.ts +10 -0
  822. package/src/radio-group/index.ts +12 -0
  823. package/src/radio-group/radio-group-item-input.svelte +197 -0
  824. package/src/radio-group/radio-group.meta.ts +7 -0
  825. package/src/radio-group/radio-group.svelte +117 -0
  826. package/src/range-calendar/context.svelte.ts +22 -0
  827. package/src/range-calendar/index.ts +16 -0
  828. package/src/range-calendar/range-calendar-grid-button.svelte +77 -0
  829. package/src/range-calendar/range-calendar-root.svelte +146 -0
  830. package/src/range-calendar/range-calendar.meta.ts +7 -0
  831. package/src/rating/index.ts +7 -0
  832. package/src/rating/rating-button-input.svelte +265 -0
  833. package/src/rating/rating.meta.ts +7 -0
  834. package/src/relative-time/index.ts +3 -0
  835. package/src/relative-time/relative-time.meta.ts +7 -0
  836. package/src/relative-time/relative-time.svelte +71 -0
  837. package/src/reveal/index.ts +7 -0
  838. package/src/reveal/reveal.meta.ts +8 -0
  839. package/src/reveal/reveal.svelte +190 -0
  840. package/src/rich-text-editor/index.ts +19 -0
  841. package/src/rich-text-editor/rich-text-editor-content.svelte +184 -0
  842. package/src/rich-text-editor/rich-text-editor-root.svelte +213 -0
  843. package/src/rich-text-editor/rich-text-editor-toolbar-button-input.svelte +541 -0
  844. package/src/rich-text-editor/rich-text-editor.meta.ts +7 -0
  845. package/src/scroll-area/index.ts +3 -0
  846. package/src/scroll-area/scroll-area.meta.ts +7 -0
  847. package/src/scroll-area/scroll-area.svelte +85 -0
  848. package/src/scroll-to-top/index.ts +8 -0
  849. package/src/scroll-to-top/scroll-to-top-button.svelte +89 -0
  850. package/src/scroll-to-top/scroll-to-top.meta.ts +7 -0
  851. package/src/segmented-control/context.svelte.ts +10 -0
  852. package/src/segmented-control/index.ts +12 -0
  853. package/src/segmented-control/segmented-control-item-button.svelte +37 -0
  854. package/src/segmented-control/segmented-control-root.svelte +125 -0
  855. package/src/segmented-control/segmented-control.meta.ts +7 -0
  856. package/src/select/context.svelte.ts +17 -0
  857. package/src/select/index.ts +33 -0
  858. package/src/select/select-content.svelte +202 -0
  859. package/src/select/select-item.svelte +118 -0
  860. package/src/select/select-root-input.svelte +105 -0
  861. package/src/select/select-trigger-button.svelte +183 -0
  862. package/src/select/select-value.svelte +27 -0
  863. package/src/select/select.meta.ts +7 -0
  864. package/src/separator/index.ts +9 -0
  865. package/src/separator/separator.meta.ts +7 -0
  866. package/src/separator/separator.svelte +70 -0
  867. package/src/shader-canvas/index.ts +28 -0
  868. package/src/shader-canvas/presets.ts +212 -0
  869. package/src/shader-canvas/shader-canvas.meta.ts +7 -0
  870. package/src/shader-canvas/shader-canvas.svelte +115 -0
  871. package/src/shimmer/index.ts +10 -0
  872. package/src/shimmer/shimmer.meta.ts +7 -0
  873. package/src/shimmer/shimmer.svelte +125 -0
  874. package/src/sidebar/context.svelte.ts +10 -0
  875. package/src/sidebar/index.ts +66 -0
  876. package/src/sidebar/sidebar-content.svelte +43 -0
  877. package/src/sidebar/sidebar-footer.svelte +28 -0
  878. package/src/sidebar/sidebar-group-label.svelte +45 -0
  879. package/src/sidebar/sidebar-group.svelte +29 -0
  880. package/src/sidebar/sidebar-header.svelte +34 -0
  881. package/src/sidebar/sidebar-item.svelte +57 -0
  882. package/src/sidebar/sidebar-root.svelte +76 -0
  883. package/src/sidebar/sidebar-trigger-button.svelte +29 -0
  884. package/src/sidebar/sidebar.meta.ts +7 -0
  885. package/src/skeleton/index.ts +9 -0
  886. package/src/skeleton/skeleton.meta.ts +7 -0
  887. package/src/skeleton/skeleton.svelte +97 -0
  888. package/src/slider/index.ts +12 -0
  889. package/src/slider/slider-input.svelte +277 -0
  890. package/src/slider/slider.meta.ts +7 -0
  891. package/src/spacer/index.ts +8 -0
  892. package/src/spacer/spacer.meta.ts +7 -0
  893. package/src/spacer/spacer.svelte +84 -0
  894. package/src/sparkline/index.ts +3 -0
  895. package/src/sparkline/sparkline.meta.ts +7 -0
  896. package/src/sparkline/sparkline.svelte +113 -0
  897. package/src/spinner/index.ts +9 -0
  898. package/src/spinner/spinner.meta.ts +7 -0
  899. package/src/spinner/spinner.svelte +110 -0
  900. package/src/splitter/context.svelte.ts +11 -0
  901. package/src/splitter/index.ts +15 -0
  902. package/src/splitter/splitter-handle.svelte +171 -0
  903. package/src/splitter/splitter-panel.svelte +28 -0
  904. package/src/splitter/splitter-root.svelte +128 -0
  905. package/src/splitter/splitter.meta.ts +7 -0
  906. package/src/spotlight/index.ts +5 -0
  907. package/src/spotlight/spotlight.meta.ts +8 -0
  908. package/src/spotlight/spotlight.svelte +249 -0
  909. package/src/stagger/index.ts +1 -0
  910. package/src/stagger/stagger.meta.ts +8 -0
  911. package/src/star-rating/index.ts +16 -0
  912. package/src/star-rating/star-rating-root.svelte +109 -0
  913. package/src/star-rating/star-rating.meta.ts +7 -0
  914. package/src/stepper/context.svelte.ts +9 -0
  915. package/src/stepper/index.ts +23 -0
  916. package/src/stepper/stepper-list.svelte +37 -0
  917. package/src/stepper/stepper-root.svelte +51 -0
  918. package/src/stepper/stepper-separator.svelte +45 -0
  919. package/src/stepper/stepper-step-button.svelte +113 -0
  920. package/src/stepper/stepper.meta.ts +7 -0
  921. package/src/svg/index.ts +5 -0
  922. package/src/svg/svg.meta.ts +7 -0
  923. package/src/svg/svg.svelte +19 -0
  924. package/src/table/index.ts +39 -0
  925. package/src/table/table-body.svelte +14 -0
  926. package/src/table/table-caption.svelte +25 -0
  927. package/src/table/table-cell.svelte +24 -0
  928. package/src/table/table-footer.svelte +21 -0
  929. package/src/table/table-head.svelte +26 -0
  930. package/src/table/table-header.svelte +21 -0
  931. package/src/table/table-root.svelte +64 -0
  932. package/src/table/table-row.svelte +28 -0
  933. package/src/table/table.meta.ts +7 -0
  934. package/src/table-of-contents/context.svelte.ts +14 -0
  935. package/src/table-of-contents/index.ts +20 -0
  936. package/src/table-of-contents/table-of-contents-item.svelte +86 -0
  937. package/src/table-of-contents/table-of-contents-list.svelte +87 -0
  938. package/src/table-of-contents/table-of-contents-root.svelte +88 -0
  939. package/src/table-of-contents/table-of-contents.meta.ts +7 -0
  940. package/src/tabs/context.svelte.ts +16 -0
  941. package/src/tabs/index.ts +43 -0
  942. package/src/tabs/tabs-content.svelte +42 -0
  943. package/src/tabs/tabs-list.svelte +102 -0
  944. package/src/tabs/tabs-root.svelte +59 -0
  945. package/src/tabs/tabs-trigger-button.svelte +41 -0
  946. package/src/tabs/tabs.meta.ts +7 -0
  947. package/src/tag/index.ts +12 -0
  948. package/src/tag/tag-button.svelte +250 -0
  949. package/src/tag/tag.meta.ts +7 -0
  950. package/src/tags-input/context.svelte.ts +13 -0
  951. package/src/tags-input/index.ts +32 -0
  952. package/src/tags-input/tags-input-input.svelte +85 -0
  953. package/src/tags-input/tags-input-list.svelte +20 -0
  954. package/src/tags-input/tags-input-root.svelte +136 -0
  955. package/src/tags-input/tags-input-tag-delete-button.svelte +31 -0
  956. package/src/tags-input/tags-input-tag.svelte +61 -0
  957. package/src/tags-input/tags-input.meta.ts +7 -0
  958. package/src/text/index.ts +20 -0
  959. package/src/text/text.meta.ts +7 -0
  960. package/src/text/text.svelte +150 -0
  961. package/src/textarea/index.ts +7 -0
  962. package/src/textarea/textarea.meta.ts +7 -0
  963. package/src/textarea/textarea.svelte +210 -0
  964. package/src/theme-toggle/index.ts +30 -0
  965. package/src/theme-toggle/theme-controller.svelte.ts +171 -0
  966. package/src/theme-toggle/theme-flash.ts +39 -0
  967. package/src/theme-toggle/theme-toggle.meta.ts +7 -0
  968. package/src/theme-toggle/theme-toggle.svelte +199 -0
  969. package/src/themes/aurora.css +291 -0
  970. package/src/themes/component-defaults.css +47 -0
  971. package/src/themes/dark.css +377 -0
  972. package/src/themes/default.css +643 -0
  973. package/src/themes/midnight.css +177 -0
  974. package/src/themes/terminal.css +191 -0
  975. package/src/themes/token-scope.ts +1 -0
  976. package/src/time-input/index.ts +14 -0
  977. package/src/time-input/time-input.meta.ts +7 -0
  978. package/src/time-input/time-input.svelte +157 -0
  979. package/src/timeline/index.ts +40 -0
  980. package/src/timeline/timeline-content.svelte +22 -0
  981. package/src/timeline/timeline-description.svelte +22 -0
  982. package/src/timeline/timeline-icon.svelte +41 -0
  983. package/src/timeline/timeline-item.svelte +57 -0
  984. package/src/timeline/timeline-root.svelte +43 -0
  985. package/src/timeline/timeline-time.svelte +22 -0
  986. package/src/timeline/timeline-title.svelte +55 -0
  987. package/src/timeline/timeline.meta.ts +7 -0
  988. package/src/toast/context.svelte.ts +7 -0
  989. package/src/toast/index.ts +33 -0
  990. package/src/toast/toast-action-button.svelte +16 -0
  991. package/src/toast/toast-close-button.svelte +35 -0
  992. package/src/toast/toast-description.svelte +24 -0
  993. package/src/toast/toast-provider.svelte +120 -0
  994. package/src/toast/toast-root.svelte +169 -0
  995. package/src/toast/toast-title.svelte +25 -0
  996. package/src/toast/toast.meta.ts +7 -0
  997. package/src/toggle/index.ts +9 -0
  998. package/src/toggle/toggle-button.svelte +218 -0
  999. package/src/toggle/toggle.meta.ts +7 -0
  1000. package/src/toggle-group/context.svelte.ts +12 -0
  1001. package/src/toggle-group/index.ts +18 -0
  1002. package/src/toggle-group/toggle-group-item-button.svelte +36 -0
  1003. package/src/toggle-group/toggle-group-root.svelte +106 -0
  1004. package/src/toggle-group/toggle-group.meta.ts +7 -0
  1005. package/src/token-scope/index.ts +8 -0
  1006. package/src/token-scope/token-scope.meta.ts +7 -0
  1007. package/src/toolbar/context.svelte.ts +6 -0
  1008. package/src/toolbar/index.ts +23 -0
  1009. package/src/toolbar/toolbar-button.svelte +16 -0
  1010. package/src/toolbar/toolbar-link.svelte +46 -0
  1011. package/src/toolbar/toolbar-root.svelte +100 -0
  1012. package/src/toolbar/toolbar-separator.svelte +33 -0
  1013. package/src/toolbar/toolbar.meta.ts +7 -0
  1014. package/src/tooltip/context.svelte.ts +14 -0
  1015. package/src/tooltip/index.ts +15 -0
  1016. package/src/tooltip/tooltip-content.svelte +106 -0
  1017. package/src/tooltip/tooltip-root.svelte +73 -0
  1018. package/src/tooltip/tooltip-trigger.svelte +74 -0
  1019. package/src/tooltip/tooltip.meta.ts +7 -0
  1020. package/src/tour/index.ts +12 -0
  1021. package/src/tour/tour-root.css +215 -0
  1022. package/src/tour/tour-root.css.d.ts +2 -0
  1023. package/src/tour/tour-root.svelte +19 -0
  1024. package/src/tour/tour-tooltip-button.svelte +48 -0
  1025. package/src/tour/tour.meta.ts +7 -0
  1026. package/src/transfer/context.svelte.ts +31 -0
  1027. package/src/transfer/index.ts +29 -0
  1028. package/src/transfer/transfer-actions-button.svelte +91 -0
  1029. package/src/transfer/transfer-item.svelte +35 -0
  1030. package/src/transfer/transfer-list-input.svelte +204 -0
  1031. package/src/transfer/transfer-root.svelte +145 -0
  1032. package/src/transfer/transfer.meta.ts +7 -0
  1033. package/src/tree/context.svelte.ts +24 -0
  1034. package/src/tree/index.ts +23 -0
  1035. package/src/tree/tree-item-children.svelte +51 -0
  1036. package/src/tree/tree-item-label.svelte +56 -0
  1037. package/src/tree/tree-item.svelte +63 -0
  1038. package/src/tree/tree-root.svelte +246 -0
  1039. package/src/tree/tree.meta.ts +7 -0
  1040. package/src/typing-indicator/index.ts +5 -0
  1041. package/src/typing-indicator/typing-indicator.meta.ts +7 -0
  1042. package/src/typing-indicator/typing-indicator.svelte +72 -0
  1043. package/src/typography/blockquote.svelte +24 -0
  1044. package/src/typography/code.svelte +25 -0
  1045. package/src/typography/heading.svelte +17 -0
  1046. package/src/typography/index.ts +30 -0
  1047. package/src/typography/text.svelte +25 -0
  1048. package/src/typography/typography.meta.ts +7 -0
  1049. package/src/video-embed/index.ts +3 -0
  1050. package/src/video-embed/video-embed-button.svelte +177 -0
  1051. package/src/video-embed/video-embed.meta.ts +7 -0
  1052. package/src/virtual-list/index.ts +3 -0
  1053. package/src/virtual-list/virtual-list.meta.ts +7 -0
  1054. package/src/virtual-list/virtual-list.svelte +239 -0
  1055. package/src/visually-hidden/index.ts +8 -0
  1056. package/src/visually-hidden/visually-hidden.meta.ts +7 -0
  1057. package/src/visually-hidden/visually-hidden.svelte +28 -0
  1058. package/dist/card/card-content.svelte +0 -32
  1059. package/dist/card/card-content.svelte.d.ts +0 -9
  1060. package/dist/card/card-footer.svelte.d.ts +0 -8
  1061. package/dist/card/card-header.svelte.d.ts +0 -8
  1062. package/dist/card/card-root.svelte +0 -184
  1063. package/dist/card/card-root.svelte.d.ts +0 -15
  1064. package/dist/card/card.meta.js +0 -7
  1065. package/dist/card/index.d.ts +0 -31
  1066. package/dist/card/index.js +0 -10
  1067. package/skills/dryui/SKILL.md +0 -306
  1068. package/skills/dryui/agents/openai.yaml +0 -10
  1069. package/skills/dryui/rules/accessibility.md +0 -215
  1070. package/skills/dryui/rules/composition.md +0 -500
  1071. package/skills/dryui/rules/compound-components.md +0 -312
  1072. package/skills/dryui/rules/native-web-transitions.md +0 -99
  1073. package/skills/dryui/rules/svelte.md +0 -234
  1074. package/skills/dryui/rules/theming.md +0 -305
  1075. /package/dist/{card/card.meta.d.ts → token-scope/token-scope.meta.d.ts} +0 -0
package/dist/themes/default.css CHANGED
@@ -1,59 +1,48 @@
1
+ /* Tokens + motion utilities components depend on. Host page decides paint. */
1
2
  *,
2
3
  *::before,
3
4
  *::after {
5
+ /* Components are authored against border-box sizing math. */
4
6
  box-sizing: border-box;
5
- margin: 0;
6
- }
7
-
8
- html {
9
- font-family: var(--dry-font-sans);
10
- color: var(--dry-color-text-strong);
11
- background: var(--dry-color-bg-base);
12
- -webkit-font-smoothing: antialiased;
13
- -moz-osx-font-smoothing: grayscale;
14
- text-rendering: optimizeLegibility;
15
- }
16
-
17
- body {
18
- margin: 0;
19
- min-height: 100dvh;
20
- }
21
-
22
- :where(h1, h2, h3, h4, h5, h6) {
23
- text-wrap: balance;
24
- }
25
- :where(p) {
26
- text-wrap: pretty;
27
- }
28
-
29
- code,
30
- pre,
31
- kbd,
32
- samp {
33
- font-family: var(--dry-font-mono);
34
7
  }
35
8
 
36
9
  :root {
10
+ color-scheme: light;
11
+
12
+ /* ─── Public aliases (Tier 2, documented) ──────────────────────────
13
+ Override at `:root` to retheme. Tier 3 tokens below derive via
14
+ `var(--alias)` so overrides cascade. See skills/dryui-build/SKILL.md. */
15
+ --dry-color-primary: hsl(230, 64%, 57%);
16
+ --dry-color-primary-hover: hsl(230, 64%, 49%);
17
+ --dry-color-text: hsla(230, 100%, 7%, 0.9);
18
+ --dry-color-text-secondary: hsla(230, 100%, 10%, 0.65);
19
+ --dry-color-foreground: var(--dry-color-text);
20
+ --dry-color-muted: hsla(230, 100%, 20%, 0.1);
21
+ --dry-color-warning: hsl(40, 80%, 50%);
22
+ --dry-color-success: hsl(145, 60%, 45%);
23
+ --dry-color-danger: hsl(0, 70%, 50%);
24
+ --dry-color-border: hsla(230, 100%, 20%, 0.1);
25
+ --dry-color-border-hover: hsla(230, 100%, 15%, 0.45);
26
+
37
27
  /* ─── Neutral ─────────────────────────────────────────────────── */
38
- --dry-color-text-strong: hsla(230, 100%, 7%, 0.9);
39
- --dry-color-text-weak: hsla(230, 100%, 10%, 0.65);
28
+ --dry-color-text-strong: var(--dry-color-text);
29
+ --dry-color-text-weak: var(--dry-color-text-secondary);
40
30
  --dry-color-icon: hsla(230, 100%, 15%, 0.7);
41
- --dry-color-stroke-strong: hsla(230, 100%, 15%, 0.45);
42
- --dry-color-stroke-weak: hsla(230, 100%, 20%, 0.1);
31
+ --dry-color-stroke-strong: var(--dry-color-border-hover);
32
+ --dry-color-stroke-weak: var(--dry-color-border);
43
33
  --dry-color-fill: hsla(230, 100%, 25%, 0.04);
44
34
  --dry-color-fill-hover: hsla(230, 100%, 25%, 0.04);
45
35
  --dry-color-fill-active: hsla(230, 100%, 25%, 0.12);
46
36
 
47
37
  /* ─── Brand (hue 230) ─────────────────────────────────────────── */
48
- --dry-color-brand: hsl(230, 64%, 57%);
49
- --dry-color-text-brand: hsl(230, 64%, 57%);
50
- --dry-color-fill-brand: hsl(230, 64%, 57%);
51
- --dry-color-fill-brand-hover: hsl(230, 64%, 49%);
38
+ --dry-color-brand: var(--dry-color-primary);
39
+ --dry-color-text-brand: var(--dry-color-primary);
40
+ --dry-color-fill-brand: var(--dry-color-primary);
41
+ --dry-color-fill-brand-hover: var(--dry-color-primary-hover);
52
42
  --dry-color-fill-brand-active: hsl(230, 64%, 43%);
53
43
  --dry-color-fill-brand-weak: hsla(230, 100%, 67%, 0.05);
54
44
  --dry-color-stroke-brand: hsla(230, 64%, 57%, 0.5);
55
45
  --dry-color-stroke-brand-strong: hsla(230, 64%, 57%, 0.8);
56
- --dry-color-stroke-brand-weak: hsla(230, 64%, 57%, 0.2);
57
46
  --dry-color-on-brand: #ffffff;
58
47
  --dry-color-focus-ring: hsla(230, 64%, 57%, 0.4);
59
48
 
@@ -63,43 +52,32 @@ samp {
63
52
  --dry-color-bg-overlay: #f1f3f5;
64
53
 
65
54
  /* ─── Semantic parity extensions ──────────────────────────────── */
66
- --dry-color-text-disabled: var(--dry-color-stroke-weak);
55
+ --dry-color-text-disabled: var(--dry-color-muted);
67
56
  --dry-color-text-inverse: hsla(0, 0%, 100%, 1);
68
57
  --dry-color-text-inverse-weak: hsla(0, 0%, 100%, 0.78);
69
58
  --dry-color-text-inverse-disabled: hsla(0, 0%, 100%, 0.12);
70
59
 
71
- --dry-color-icon-brand: var(--dry-color-stroke-brand-strong);
72
- --dry-color-icon-disabled: var(--dry-color-stroke-weak);
73
- --dry-color-icon-inverse: var(--dry-color-stroke-inverse);
74
- --dry-color-icon-inverse-strong: var(--dry-color-text-inverse);
75
- --dry-color-icon-inverse-weak: var(--dry-color-text-inverse-weak);
76
- --dry-color-icon-inverse-disabled: var(--dry-color-text-inverse-disabled);
77
-
78
60
  --dry-color-stroke-focus: var(--dry-color-brand);
79
61
  --dry-color-stroke-selected: var(--dry-color-brand);
80
62
  --dry-color-stroke-disabled: var(--dry-color-stroke-weak);
81
63
  --dry-color-stroke-inverse: hsla(0, 0%, 100%, 0.6);
82
64
  --dry-color-stroke-inverse-weak: hsla(0, 0%, 100%, 0.12);
83
65
 
84
- --dry-color-fill-strong: var(--dry-color-text-strong);
85
66
  --dry-color-fill-weak: var(--dry-color-fill);
86
67
  --dry-color-fill-weaker: hsla(230, 100%, 25%, 0.02);
87
68
  --dry-color-fill-selected: var(--dry-color-fill-brand);
88
69
  --dry-color-fill-disabled: var(--dry-color-stroke-weak);
89
- --dry-color-fill-overlay: var(--dry-color-stroke-strong);
90
70
  --dry-color-fill-inverse: var(--dry-color-text-inverse);
91
71
  --dry-color-fill-inverse-weak: hsla(0, 0%, 100%, 0.06);
92
- --dry-color-fill-inverse-hover: var(--dry-color-fill-inverse-weak);
93
- --dry-color-fill-inverse-active: hsla(0, 0%, 100%, 0.12);
94
- --dry-color-fill-inverse-disabled: #ffffff1f;
95
- --dry-color-fill-white: #ffffff;
96
72
  --dry-color-fill-yellow: #fec62e;
97
73
 
98
74
  --dry-color-bg-sunken: #f5f6fa;
99
75
  --dry-color-bg-alternate: var(--dry-color-bg-sunken);
100
- --dry-color-bg-brand: var(--dry-color-fill-brand);
101
76
  --dry-color-bg-inverse: hsl(233, 18%, 9%);
102
77
 
78
+ /* Resolves at use-time so it tracks the active theme. */
79
+ --dry-color-bg: var(--dry-color-bg-base);
80
+
103
81
  /* ─── Image edge ring ────────────────────────────────────────────
104
82
  Subtle 1px outline for image surfaces (avatars, images, image
105
83
  skeletons). Prevents image edges from reading as surface
@@ -110,17 +88,15 @@ samp {
110
88
  Derived from semantic tokens so brand overrides (e.g. a consumer
111
89
  retheming --dry-color-fill-brand) flow through to toggles too.
112
90
  Thumb bg is intentionally a neutral literal — it's a surface knob,
113
- not a brand-tinted element. */
91
+ not a brand-tinted element. Mirrored in `component-defaults.css`
92
+ for consumers who want to import the component layer alone. */
114
93
  --dry-toggle-track-bg: var(--dry-color-fill-brand-weak);
115
94
  --dry-toggle-track-stroke: var(--dry-color-stroke-strong);
116
95
  --dry-toggle-selected-bg: var(--dry-color-fill-brand);
117
96
  --dry-toggle-selected-stroke: var(--dry-color-fill-brand);
118
97
  --dry-toggle-thumb-bg: #ffffff;
119
- --dry-toggle-hover-bg: var(--dry-color-fill-brand-weak);
120
- --dry-toggle-press-bg: var(--dry-color-fill-active);
121
98
  --dry-toggle-disabled-fill: var(--dry-color-stroke-weak);
122
99
  --dry-toggle-disabled-stroke: var(--dry-color-stroke-weak);
123
- --dry-toggle-focus-ring: var(--dry-color-fill-brand);
124
100
  --dry-toggle-label-color: var(--dry-color-text-strong);
125
101
  --dry-toggle-label-disabled-color: var(--dry-color-text-disabled);
126
102
 
@@ -129,59 +105,60 @@ samp {
129
105
 
130
106
  /* ─── Status: Error (hue 0) ───────────────────────────────────── */
131
107
  --dry-color-text-error: hsl(0, 70%, 35%);
132
- --dry-color-fill-error: hsl(0, 70%, 50%);
108
+ --dry-color-fill-error: var(--dry-color-danger);
133
109
  --dry-color-fill-error-hover: hsl(0, 70%, 42%);
134
110
  --dry-color-fill-error-weak: hsla(0, 70%, 50%, 0.1);
135
111
  --dry-color-stroke-error: hsl(0, 50%, 70%);
136
112
  --dry-color-stroke-error-strong: hsla(0, 70%, 50%, 0.8);
137
- --dry-color-icon-error: var(--dry-color-stroke-error-strong);
138
113
  --dry-color-on-error: #ffffff;
139
114
 
140
115
  /* ─── Status: Warning (hue 40) ────────────────────────────────── */
141
116
  --dry-color-text-warning: hsl(40, 80%, 30%);
142
- --dry-color-fill-warning: hsl(40, 80%, 50%);
143
- --dry-color-fill-warning-hover: hsl(40, 80%, 42%);
117
+ --dry-color-fill-warning: var(--dry-color-warning);
144
118
  --dry-color-fill-warning-weak: hsla(40, 80%, 50%, 0.1);
145
119
  --dry-color-stroke-warning: hsl(40, 60%, 65%);
146
120
  --dry-color-stroke-warning-strong: hsla(40, 80%, 50%, 0.8);
147
- --dry-color-icon-warning: var(--dry-color-stroke-warning-strong);
148
121
  --dry-color-on-warning: hsl(40, 80%, 15%);
149
122
 
150
123
  /* ─── Status: Success (hue 145) ───────────────────────────────── */
151
124
  --dry-color-text-success: hsl(145, 60%, 30%);
152
- --dry-color-fill-success: hsl(145, 60%, 45%);
153
- --dry-color-fill-success-hover: hsl(145, 60%, 37%);
125
+ --dry-color-fill-success: var(--dry-color-success);
154
126
  --dry-color-fill-success-weak: hsla(145, 60%, 45%, 0.1);
155
127
  --dry-color-stroke-success: hsl(145, 50%, 65%);
156
128
  --dry-color-stroke-success-strong: hsla(145, 60%, 45%, 0.8);
157
- --dry-color-icon-success: var(--dry-color-stroke-success-strong);
158
- --dry-color-on-success: #ffffff;
129
+ --dry-color-on-success: hsl(145, 60%, 12%);
159
130
 
160
131
  /* ─── Status: Info (hue 210) ──────────────────────────────────── */
161
132
  --dry-color-text-info: hsl(210, 70%, 35%);
162
133
  --dry-color-fill-info: hsl(210, 70%, 50%);
163
- --dry-color-fill-info-hover: hsl(210, 70%, 42%);
164
134
  --dry-color-fill-info-weak: hsla(210, 70%, 50%, 0.1);
165
135
  --dry-color-stroke-info: hsl(210, 50%, 70%);
166
136
  --dry-color-stroke-info-strong: hsla(210, 70%, 50%, 0.8);
167
- --dry-color-icon-info: var(--dry-color-stroke-info-strong);
168
- --dry-color-on-info: #ffffff;
137
+ --dry-color-on-info: hsl(210, 70%, 7%);
169
138
 
170
139
  /* ─── Accent tone (warm counterpoint to brand) ───────────────── */
171
- --dry-color-accent: hsl(25, 90%, 58%);
172
- --dry-color-text-accent: hsl(25, 80%, 38%);
173
140
  --dry-color-fill-accent: hsl(25, 90%, 58%);
174
- --dry-color-fill-accent-hover: hsl(25, 90%, 50%);
175
- --dry-color-fill-accent-active: hsl(25, 90%, 44%);
176
141
  --dry-color-fill-accent-weak: hsla(25, 90%, 58%, 0.08);
177
142
  --dry-color-stroke-accent: hsla(25, 90%, 58%, 0.5);
178
143
  --dry-color-stroke-accent-strong: hsla(25, 90%, 58%, 0.8);
179
- --dry-color-stroke-accent-weak: hsla(25, 90%, 58%, 0.2);
180
- --dry-color-icon-accent: hsla(25, 90%, 58%, 0.8);
181
- --dry-color-on-accent: #ffffff;
144
+ --dry-color-on-accent: hsl(25, 90%, 12%);
145
+
146
+ /* ─── Purple semantic palette (badge / tag purple variants) ───── */
147
+ --dry-color-text-purple: hsl(280, 60%, 38%);
148
+ --dry-color-fill-purple: hsl(280, 65%, 55%);
149
+ --dry-color-fill-purple-weak: hsla(280, 65%, 55%, 0.1);
150
+ --dry-color-stroke-purple: hsla(280, 65%, 55%, 0.5);
151
+ --dry-color-on-purple: #ffffff;
152
+
153
+ /* ─── Orange semantic palette (badge / tag orange variants) ───── */
154
+ --dry-color-fill-orange: color-mix(
155
+ in srgb,
156
+ var(--dry-color-fill-warning) 70%,
157
+ var(--dry-color-fill-error)
158
+ );
159
+ --dry-color-on-orange: hsl(25, 80%, 12%);
182
160
 
183
161
  /* ─── Extended surface depth ──────────────────────────────────── */
184
- --dry-color-bg-elevated: #eceef2;
185
162
  --dry-color-bg-floating: #ffffff;
186
163
 
187
164
  /* ─── Semantic shadows ────────────────────────────────────────── */
@@ -190,8 +167,6 @@ samp {
190
167
  --dry-shadow-sunken: inset 0 1px 4px rgba(0, 0, 0, 0.08);
191
168
 
192
169
  /* ─── Tinted shadows ──────────────────────────────────────────── */
193
- --dry-shadow-brand: 0 4px 14px hsla(230, 64%, 57%, 0.2), 0 2px 6px hsla(230, 64%, 57%, 0.12);
194
- --dry-shadow-accent: 0 4px 14px hsla(25, 90%, 58%, 0.2), 0 2px 6px hsla(25, 90%, 58%, 0.12);
195
170
 
196
171
  /* ─── Overlay backdrops ───────────────────────────────────────── */
197
172
  --dry-color-overlay-backdrop: hsla(0, 0%, 0%, 0.4);
@@ -216,20 +191,8 @@ samp {
216
191
  --dry-space-12: 3rem;
217
192
  --dry-space-14: 3.5rem;
218
193
  --dry-space-16: 4rem;
219
- --dry-space-20: 5rem;
220
- --dry-space-24: 6rem;
221
- --dry-space-32: 8rem;
222
- --dry-space-40: 2.5rem;
223
- --dry-space-56: 3.5rem;
224
- --dry-space-64: 4rem;
225
- --dry-space-80: 5rem;
226
- --dry-space-96: 6rem;
227
- --dry-space-128: 8rem;
228
- --dry-space-192: 12rem;
229
- --dry-space-256: 16rem;
230
194
 
231
195
  /* ─── Radius ──────────────────────────────────────────────────── */
232
- --dry-radius-none: 0;
233
196
  --dry-radius-xs: 2px;
234
197
  --dry-radius-sm: 4px;
235
198
  --dry-radius-md: 8px;
@@ -248,7 +211,7 @@ samp {
248
211
  --dry-radius-popover: var(--dry-radius-xl);
249
212
  --dry-radius-sheet: var(--dry-radius-2xl);
250
213
  --dry-radius-toast: var(--dry-radius-lg);
251
- --dry-radius-tooltip: var(--dry-radius-md);
214
+ --dry-radius-tooltip: calc(var(--dry-radius-md) - var(--dry-radius-xs));
252
215
 
253
216
  --dry-padding-card: var(--dry-space-8);
254
217
  --dry-padding-dialog: var(--dry-space-6);
@@ -258,10 +221,6 @@ samp {
258
221
  --dry-padding-tooltip: var(--dry-space-2);
259
222
  --dry-padding-field: var(--dry-space-4);
260
223
 
261
- --dry-radius-nested-card: max(
262
- var(--dry-radius-sm),
263
- calc(var(--dry-radius-card) - var(--dry-padding-card))
264
- );
265
224
  --dry-radius-nested-dialog: max(
266
225
  var(--dry-radius-sm),
267
226
  calc(var(--dry-radius-dialog) - var(--dry-padding-dialog))
@@ -270,10 +229,6 @@ samp {
270
229
  var(--dry-radius-xs),
271
230
  calc(var(--dry-radius-popover) - var(--dry-padding-popover))
272
231
  );
273
- --dry-radius-nested-sheet: max(
274
- var(--dry-radius-sm),
275
- calc(var(--dry-radius-sheet) - var(--dry-padding-sheet))
276
- );
277
232
  --dry-radius-nested-toast: max(
278
233
  var(--dry-radius-xs),
279
234
  calc(var(--dry-radius-toast) - var(--dry-padding-toast))
@@ -297,11 +252,7 @@ samp {
297
252
  --dry-font-display: var(--dry-font-sans);
298
253
 
299
254
  /* ─── Font weights ────────────────────────────────────────────── */
300
- --dry-font-weight-light: 300;
301
- --dry-font-weight-normal: 400;
302
255
  --dry-font-weight-medium: 500;
303
- --dry-font-weight-semibold: 600;
304
- --dry-font-weight-bold: 700;
305
256
 
306
257
  /* Practical UI-style named scale tokens */
307
258
  --dry-type-display-size: 3.5rem;
@@ -319,7 +270,6 @@ samp {
319
270
  --dry-type-tiny-size: 0.875rem;
320
271
  --dry-type-tiny-leading: 1.25rem;
321
272
  --dry-type-xs-size: 0.625rem;
322
- --dry-type-2xs-size: 0.5625rem;
323
273
 
324
274
  /* Semantic UI typography aliases derived from the Practical UI scale */
325
275
  --dry-type-ui-caption-size: calc(var(--dry-type-tiny-size) * 0.8571428571);
@@ -327,7 +277,6 @@ samp {
327
277
  --dry-type-ui-control-size: var(--dry-type-tiny-size);
328
278
  --dry-type-ui-control-leading: var(--dry-type-tiny-leading);
329
279
  --dry-type-ui-body-size: var(--dry-type-small-size);
330
- --dry-type-ui-body-leading: var(--dry-type-small-leading);
331
280
  --dry-type-ui-body-strong-size: calc(
332
281
  (var(--dry-type-small-size) + var(--dry-type-heading-4-size)) / 2
333
282
  );
@@ -356,10 +305,8 @@ samp {
356
305
  /* Legacy text ladder kept as a compatibility bridge onto the named scale */
357
306
  --dry-text-xs-size: var(--dry-type-ui-caption-size);
358
307
  --dry-text-xs-leading: var(--dry-type-ui-caption-leading);
359
- --dry-text-xs-tracking: 0.02em;
360
308
  --dry-text-sm-size: var(--dry-type-ui-control-size);
361
309
  --dry-text-sm-leading: var(--dry-type-ui-control-leading);
362
- --dry-text-sm-tracking: 0.01em;
363
310
  --dry-text-base-size: var(--dry-type-ui-body-strong-size);
364
311
  --dry-text-base-leading: var(--dry-type-ui-body-strong-leading);
365
312
  --dry-text-lg-size: var(--dry-type-ui-title-size);
@@ -367,12 +314,8 @@ samp {
367
314
  --dry-text-xl-size: var(--dry-type-ui-title-strong-size);
368
315
  --dry-text-xl-leading: var(--dry-type-ui-title-strong-leading);
369
316
  --dry-text-2xl-size: var(--dry-type-ui-section-size);
370
- --dry-text-2xl-leading: var(--dry-type-ui-section-leading);
371
- --dry-text-2xl-tracking: -0.01em;
372
317
  --dry-text-3xl-size: var(--dry-type-ui-section-strong-size);
373
- --dry-text-3xl-leading: var(--dry-type-ui-section-strong-leading);
374
318
  --dry-text-4xl-size: var(--dry-type-ui-display-size);
375
- --dry-text-4xl-leading: var(--dry-type-ui-display-leading);
376
319
 
377
320
  /* ─── State ───────────────────────────────────────────────────────
378
321
  Shared shorthands for focus / disabled state. Consumers can
@@ -386,7 +329,7 @@ samp {
386
329
 
387
330
  /* ─── Form control shared tokens ──────────────────────────────────
388
331
  Consumed by input, textarea, combobox-input, and color-picker-input.
389
- Per-component `--dry-<name>-*` overrides still work — they now
332
+ Per-component `--dry-<name>-*` overrides still work; they now
390
333
  resolve through this shared family by default, so consumers can
391
334
  restyle all form controls with one change at :root.
392
335
  Intentionally excluded (pre-existing divergence):
@@ -448,15 +391,6 @@ samp {
448
391
  --dry-enter-stagger-letter: 40ms;
449
392
  --dry-enter-stagger-max: 16;
450
393
 
451
- /* ─── Exit motion ──────────────────────────────────────────────
452
- Subtle dismissal — small fixed offset, not full container
453
- travel. Consumed by the `leave` Svelte transition and any
454
- overlay primitive using `out:leave`. */
455
- --dry-exit-translate: 12px;
456
- --dry-exit-blur: 4px;
457
- --dry-exit-duration: var(--dry-duration-slow);
458
- --dry-exit-ease: var(--dry-ease-out);
459
-
460
394
  /* ─── Icon swap ────────────────────────────────────────────────
461
395
  Motion for `<IconSwap>` when one icon replaces another
462
396
  (copy ↔ check, play ↔ pause). Uses the same retarget-friendly
@@ -480,63 +414,20 @@ samp {
480
414
 
481
415
  /* ─── Glass surface ───────────────────────────────────────────── */
482
416
  --dry-glass-blur: 12px;
483
- --dry-glass-tint: var(--dry-color-bg-raised);
484
- --dry-glass-opacity: 72%;
417
+ --dry-color-glass-tint: var(--dry-color-bg-raised);
418
+ --dry-glass-tint: var(--dry-color-glass-tint);
485
419
  --dry-glass-saturation: 180%;
486
- --dry-glass-border: hsla(0, 0%, 100%, 0.08);
487
- --dry-glass-border-strong: hsla(0, 0%, 100%, 0.15);
488
420
 
489
421
  /* ─── Glow ────────────────────────────────────────────────────── */
490
422
  --dry-glow-color: var(--dry-color-fill-brand);
491
- --dry-glow-blur: 24px;
492
- --dry-glow-spread: 48px;
493
- --dry-glow-ring: 0 0 0 1px var(--dry-color-fill-brand), 0 0 12px 2px hsla(230, 64%, 57%, 0.25);
494
- --dry-glow-ring-accent:
495
- 0 0 0 1px var(--dry-color-fill-accent), 0 0 12px 2px hsla(25, 90%, 58%, 0.25);
496
- --dry-glow-ambient: hsla(230, 64%, 57%, 0.06);
497
- --dry-glow-ambient-accent: hsla(25, 90%, 58%, 0.06);
498
423
 
499
424
  /* ─── Gradient palette ────────────────────────────────────────── */
500
- --dry-gradient-warm: linear-gradient(
501
- 135deg,
502
- hsl(25, 90%, 65%) 0%,
503
- hsl(350, 70%, 60%) 50%,
504
- hsl(280, 60%, 55%) 100%
505
- );
506
- --dry-gradient-cool: linear-gradient(
507
- 135deg,
508
- hsl(210, 80%, 60%) 0%,
509
- hsl(250, 70%, 55%) 50%,
510
- hsl(280, 50%, 50%) 100%
511
- );
512
- --dry-gradient-sunset: linear-gradient(
513
- 135deg,
514
- hsl(40, 95%, 60%) 0%,
515
- hsl(15, 90%, 58%) 40%,
516
- hsl(340, 75%, 55%) 100%
517
- );
518
- --dry-gradient-ocean: linear-gradient(
519
- 135deg,
520
- hsl(195, 80%, 50%) 0%,
521
- hsl(220, 85%, 55%) 50%,
522
- hsl(250, 70%, 60%) 100%
523
- );
524
- --dry-gradient-surface: linear-gradient(
525
- 180deg,
526
- var(--dry-color-bg-base) 0%,
527
- var(--dry-color-bg-raised) 100%
528
- );
529
425
 
530
426
  /* ─── Grain / noise texture ───────────────────────────────────── */
531
427
  --dry-grain-opacity: 0.04;
532
- --dry-grain-size: 0.65;
533
- --dry-grain-blend: overlay;
534
428
 
535
429
  /* ─── Typography extras ───────────────────────────────────────── */
536
- --dry-tracking-tight: -0.025em;
537
430
  --dry-tracking-normal: 0;
538
- --dry-tracking-wide: 0.05em;
539
- --dry-tracking-wider: 0.1em;
540
431
 
541
432
  /* ─── Utility shadows — three-layer shadow-as-border recipe ──────
542
433
  Edge + close contact + ambient, so a raised surface reads as
@@ -555,12 +446,6 @@ samp {
555
446
  --dry-shadow-xl:
556
447
  0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 8px 16px -4px rgba(0, 0, 0, 0.1),
557
448
  0px 20px 40px -8px rgba(0, 0, 0, 0.08);
558
- --dry-shadow-sm-hover:
559
- 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 1px 2px -1px rgba(0, 0, 0, 0.08),
560
- 0px 2px 4px 0px rgba(0, 0, 0, 0.06);
561
- --dry-shadow-md-hover:
562
- 0px 0px 0px 1px rgba(0, 0, 0, 0.09), 0px 2px 4px -1px rgba(0, 0, 0, 0.1),
563
- 0px 4px 8px -2px rgba(0, 0, 0, 0.06);
564
449
 
565
450
  /* ─── Layers ──────────────────────────────────────────────────── */
566
451
  --dry-layer-overlay: 50;
@@ -575,6 +460,19 @@ samp {
575
460
  --dry-scrollbar-width: 8px;
576
461
  }
577
462
 
463
+ @supports (color: contrast-color(white)) {
464
+ :root {
465
+ --dry-color-on-brand: contrast-color(var(--dry-color-fill-brand));
466
+ --dry-color-on-error: contrast-color(var(--dry-color-fill-error));
467
+ --dry-color-on-warning: contrast-color(var(--dry-color-fill-warning));
468
+ --dry-color-on-success: contrast-color(var(--dry-color-fill-success));
469
+ --dry-color-on-info: contrast-color(var(--dry-color-fill-info));
470
+ --dry-color-on-accent: contrast-color(var(--dry-color-fill-accent));
471
+ --dry-color-on-purple: contrast-color(var(--dry-color-fill-purple));
472
+ --dry-color-on-orange: contrast-color(var(--dry-color-fill-orange));
473
+ }
474
+ }
475
+
578
476
  :where([data-dry-type-mode='desktop']) {
579
477
  --dry-type-display-size: 3.5rem;
580
478
  --dry-type-display-leading: 4rem;
@@ -630,9 +528,6 @@ samp {
630
528
  --dry-enter-stagger-section: 0ms;
631
529
  --dry-enter-stagger-word: 0ms;
632
530
  --dry-enter-stagger-letter: 0ms;
633
- --dry-exit-translate: 0px;
634
- --dry-exit-blur: 0px;
635
- --dry-exit-duration: 1ms;
636
531
  --dry-icon-swap-duration: 0ms;
637
532
  --dry-icon-swap-scale-out: 1;
638
533
  --dry-icon-swap-blur-out: 0px;
package/dist/themes/midnight.css CHANGED
@@ -12,48 +12,94 @@
12
12
 
13
13
  [data-theme='midnight'],
14
14
  .theme-midnight {
15
+ color-scheme: dark;
16
+
17
+ /* ─── Public aliases (midnight) ───────────────────────────────── */
18
+ --dry-color-primary: hsl(250, 70%, 75%);
19
+ --dry-color-primary-hover: hsl(250, 70%, 67%);
20
+ --dry-color-text: hsla(240, 20%, 98%, 1);
21
+ --dry-color-text-secondary: hsla(240, 15%, 90%, 0.7);
22
+ --dry-color-muted: hsla(240, 15%, 80%, 0.1);
23
+ --dry-color-warning: hsl(38, 75%, 55%);
24
+ --dry-color-success: hsl(150, 55%, 50%);
25
+ --dry-color-danger: hsl(355, 70%, 60%);
26
+ --dry-color-border: hsla(240, 15%, 80%, 0.1);
27
+ --dry-color-border-hover: hsla(240, 15%, 85%, 0.5);
28
+
15
29
  /* ─── Brand — soft lavender ───────────────────────────────────── */
16
- --dry-color-brand: hsl(250, 70%, 75%);
17
- --dry-color-text-brand: hsl(250, 70%, 75%);
18
- --dry-color-fill-brand: hsl(250, 70%, 75%);
19
- --dry-color-fill-brand-hover: hsl(250, 70%, 67%);
30
+ --dry-color-fill-brand: var(--dry-color-primary);
20
31
  --dry-color-fill-brand-active: hsl(250, 70%, 62%);
21
32
  --dry-color-fill-brand-weak: hsla(250, 70%, 75%, 0.08);
22
33
  --dry-color-stroke-brand: hsla(250, 70%, 75%, 0.45);
23
34
  --dry-color-stroke-brand-strong: hsla(250, 70%, 75%, 0.75);
24
- --dry-color-stroke-brand-weak: hsla(250, 70%, 75%, 0.18);
25
35
  --dry-color-on-brand: hsl(250, 30%, 8%);
26
36
  --dry-color-focus-ring: hsla(250, 70%, 75%, 0.35);
27
37
 
28
38
  /* ─── Accent — soft rose (the avatar ring glow) ───────────────── */
29
- --dry-color-accent: hsl(350, 60%, 70%);
30
- --dry-color-text-accent: hsl(350, 60%, 70%);
31
39
  --dry-color-fill-accent: hsl(350, 60%, 70%);
32
- --dry-color-fill-accent-hover: hsl(350, 60%, 62%);
33
- --dry-color-fill-accent-active: hsl(350, 60%, 56%);
34
40
  --dry-color-fill-accent-weak: hsla(350, 60%, 70%, 0.08);
35
41
  --dry-color-stroke-accent: hsla(350, 60%, 70%, 0.45);
36
42
  --dry-color-stroke-accent-strong: hsla(350, 60%, 70%, 0.75);
37
- --dry-color-stroke-accent-weak: hsla(350, 60%, 70%, 0.18);
38
- --dry-color-icon-accent: hsla(350, 60%, 70%, 0.75);
39
- --dry-color-on-accent: hsl(350, 20%, 8%);
43
+ --dry-color-on-accent: hsl(350, 30%, 8%);
44
+
45
+ /* ─── Status: Error ───────────────────────────────────────────── */
46
+ --dry-color-text-error: hsl(355, 70%, 72%);
47
+ --dry-color-fill-error: var(--dry-color-danger);
48
+ --dry-color-fill-error-hover: hsl(355, 70%, 62%);
49
+ --dry-color-fill-error-weak: hsla(355, 70%, 60%, 0.12);
50
+ --dry-color-stroke-error: hsl(355, 50%, 55%);
51
+ --dry-color-stroke-error-strong: hsla(355, 70%, 60%, 0.8);
52
+ --dry-color-on-error: hsl(355, 30%, 8%);
53
+
54
+ /* ─── Status: Warning ─────────────────────────────────────────── */
55
+ --dry-color-text-warning: hsl(38, 80%, 68%);
56
+ --dry-color-fill-warning: var(--dry-color-warning);
57
+ --dry-color-fill-warning-weak: hsla(38, 75%, 55%, 0.12);
58
+ --dry-color-stroke-warning: hsl(38, 55%, 55%);
59
+ --dry-color-stroke-warning-strong: hsla(38, 75%, 55%, 0.8);
60
+ --dry-color-on-warning: hsl(38, 30%, 10%);
61
+
62
+ /* ─── Status: Success ─────────────────────────────────────────── */
63
+ --dry-color-text-success: hsl(150, 55%, 68%);
64
+ --dry-color-fill-success: var(--dry-color-success);
65
+ --dry-color-fill-success-weak: hsla(150, 55%, 50%, 0.12);
66
+ --dry-color-stroke-success: hsl(150, 45%, 55%);
67
+ --dry-color-stroke-success-strong: hsla(150, 55%, 50%, 0.8);
68
+ --dry-color-on-success: hsl(150, 30%, 8%);
69
+
70
+ /* ─── Status: Info ────────────────────────────────────────────── */
71
+ --dry-color-text-info: hsl(215, 70%, 72%);
72
+ --dry-color-fill-info: hsl(215, 65%, 60%);
73
+ --dry-color-fill-info-weak: hsla(215, 65%, 60%, 0.12);
74
+ --dry-color-stroke-info: hsl(215, 45%, 55%);
75
+ --dry-color-stroke-info-strong: hsla(215, 65%, 60%, 0.8);
76
+ --dry-color-on-info: hsl(215, 30%, 8%);
77
+
78
+ /* ─── Purple semantic palette (badge / tag purple variants) ───── */
79
+ --dry-color-text-purple: hsl(285, 70%, 78%);
80
+ --dry-color-fill-purple: hsl(285, 70%, 70%);
81
+ --dry-color-fill-purple-weak: hsla(285, 70%, 70%, 0.12);
82
+ --dry-color-stroke-purple: hsla(285, 70%, 70%, 0.5);
83
+ --dry-color-on-purple: hsl(285, 30%, 8%);
84
+
85
+ /* ─── Orange semantic palette (badge / tag orange variants) ───── */
86
+ --dry-color-fill-orange: color-mix(
87
+ in srgb,
88
+ var(--dry-color-fill-warning) 70%,
89
+ var(--dry-color-fill-error)
90
+ );
91
+ --dry-color-on-orange: hsl(30, 30%, 8%);
40
92
 
41
93
  /* ─── Backgrounds — deep layered dark ─────────────────────────── */
42
94
  --dry-color-bg-base: hsl(240, 20%, 6%);
43
95
  --dry-color-bg-raised: hsl(240, 15%, 10%);
44
96
  --dry-color-bg-overlay: hsl(240, 12%, 14%);
45
- --dry-color-bg-elevated: hsl(240, 10%, 18%);
46
97
  --dry-color-bg-floating: hsl(240, 8%, 22%);
47
98
  --dry-color-bg-sunken: hsl(240, 22%, 4%);
48
- --dry-color-bg-brand: var(--dry-color-fill-brand);
49
99
  --dry-color-bg-inverse: hsl(240, 10%, 95%);
50
100
 
51
101
  /* ─── Neutrals — cool silver white ────────────────────────────── */
52
- --dry-color-text-strong: hsla(240, 20%, 98%, 1);
53
- --dry-color-text-weak: hsla(240, 15%, 90%, 0.7);
54
102
  --dry-color-icon: hsla(240, 15%, 88%, 0.78);
55
- --dry-color-stroke-strong: hsla(240, 15%, 85%, 0.5);
56
- --dry-color-stroke-weak: hsla(240, 15%, 80%, 0.1);
57
103
  --dry-color-fill: hsla(240, 15%, 85%, 0.05);
58
104
  --dry-color-fill-hover: hsla(240, 15%, 85%, 0.08);
59
105
  --dry-color-fill-active: hsla(240, 15%, 85%, 0.13);
@@ -62,8 +108,6 @@
62
108
  --dry-shadow-raised: 0 1px 4px hsla(240, 40%, 3%, 0.5), 0 1px 2px hsla(240, 40%, 3%, 0.4);
63
109
  --dry-shadow-overlay: 0 8px 32px hsla(240, 40%, 3%, 0.6), 0 2px 8px hsla(240, 40%, 3%, 0.45);
64
110
  --dry-shadow-sunken: inset 0 1px 4px hsla(240, 40%, 3%, 0.4);
65
- --dry-shadow-brand: 0 4px 20px hsla(250, 70%, 75%, 0.12), 0 2px 8px hsla(250, 70%, 75%, 0.08);
66
- --dry-shadow-accent: 0 4px 20px hsla(350, 60%, 70%, 0.12), 0 2px 8px hsla(350, 60%, 70%, 0.08);
67
111
 
68
112
  /* ─── Utility shadows — dark edge + deep ink layers ─────────────── */
69
113
  --dry-shadow-sm:
@@ -78,60 +122,20 @@
78
122
  --dry-shadow-xl:
79
123
  0px 0px 0px 1px rgba(255, 255, 255, 0.08), 0px 8px 16px -4px hsla(240, 40%, 3%, 0.6),
80
124
  0px 20px 40px -8px hsla(240, 40%, 3%, 0.55);
81
- --dry-shadow-sm-hover:
82
- 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 1px 2px -1px hsla(240, 40%, 3%, 0.55),
83
- 0px 2px 4px 0px hsla(240, 40%, 3%, 0.45);
84
- --dry-shadow-md-hover:
85
- 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 2px 4px -1px hsla(240, 40%, 3%, 0.6),
86
- 0px 4px 8px -2px hsla(240, 40%, 3%, 0.45);
87
125
 
88
126
  /* ─── Glass — the hero feature of this theme ──────────────────── */
89
127
  --dry-glass-blur: 16px;
90
- --dry-glass-tint: hsla(240, 15%, 10%, 0.65);
91
- --dry-glass-opacity: 58%;
128
+ --dry-color-glass-tint: hsla(240, 15%, 10%, 0.65);
129
+ --dry-glass-tint: var(--dry-color-glass-tint);
92
130
  --dry-glass-saturation: 150%;
93
- --dry-glass-border: hsla(240, 20%, 90%, 0.06);
94
- --dry-glass-border-strong: hsla(240, 20%, 90%, 0.12);
95
131
 
96
132
  /* ─── Glow — ethereal halos ───────────────────────────────────── */
97
133
  --dry-glow-color: var(--dry-color-fill-brand);
98
- --dry-glow-blur: 32px;
99
- --dry-glow-spread: 64px;
100
- --dry-glow-ring: 0 0 0 1px hsla(250, 70%, 75%, 0.2), 0 0 20px 4px hsla(250, 70%, 75%, 0.1);
101
- --dry-glow-ring-accent: 0 0 0 1px hsla(350, 60%, 70%, 0.2), 0 0 20px 4px hsla(350, 60%, 70%, 0.1);
102
- --dry-glow-ambient: hsla(250, 70%, 75%, 0.03);
103
- --dry-glow-ambient-accent: hsla(350, 60%, 70%, 0.03);
104
134
 
105
135
  /* ─── Gradient palette — cool ethereal ────────────────────────── */
106
- --dry-gradient-warm: linear-gradient(
107
- 135deg,
108
- hsl(350, 55%, 65%) 0%,
109
- hsl(280, 50%, 60%) 50%,
110
- hsl(250, 60%, 65%) 100%
111
- );
112
- --dry-gradient-cool: linear-gradient(
113
- 135deg,
114
- hsl(220, 70%, 65%) 0%,
115
- hsl(260, 60%, 60%) 50%,
116
- hsl(290, 40%, 58%) 100%
117
- );
118
- --dry-gradient-sunset: linear-gradient(
119
- 135deg,
120
- hsl(350, 65%, 68%) 0%,
121
- hsl(310, 50%, 58%) 40%,
122
- hsl(260, 55%, 55%) 100%
123
- );
124
- --dry-gradient-ocean: linear-gradient(
125
- 135deg,
126
- hsl(210, 65%, 60%) 0%,
127
- hsl(240, 60%, 58%) 50%,
128
- hsl(270, 50%, 55%) 100%
129
- );
130
- --dry-gradient-surface: linear-gradient(180deg, hsl(240, 20%, 6%) 0%, hsl(240, 15%, 10%) 100%);
131
136
 
132
137
  /* ─── Grain — subtle texture ──────────────────────────────────── */
133
138
  --dry-grain-opacity: 0.05;
134
- --dry-grain-blend: soft-light;
135
139
 
136
140
  /* ─── Motion — slightly slower, dreamier ──────────────────────── */
137
141
  --dry-duration-normal: 260ms;
@@ -156,7 +160,18 @@
156
160
  --dry-toggle-selected-bg: hsl(350, 60%, 70%);
157
161
  --dry-toggle-selected-stroke: hsl(350, 60%, 70%);
158
162
  --dry-toggle-thumb-bg: hsl(240, 20%, 8%);
159
- --dry-toggle-hover-bg: hsla(240, 15%, 85%, 0.08);
160
- --dry-toggle-press-bg: hsla(240, 15%, 85%, 0.12);
161
- --dry-toggle-focus-ring: hsl(350, 60%, 70%);
163
+ }
164
+
165
+ @supports (color: contrast-color(white)) {
166
+ [data-theme='midnight'],
167
+ .theme-midnight {
168
+ --dry-color-on-brand: contrast-color(var(--dry-color-fill-brand));
169
+ --dry-color-on-error: contrast-color(var(--dry-color-fill-error));
170
+ --dry-color-on-warning: contrast-color(var(--dry-color-fill-warning));
171
+ --dry-color-on-success: contrast-color(var(--dry-color-fill-success));
172
+ --dry-color-on-info: contrast-color(var(--dry-color-fill-info));
173
+ --dry-color-on-accent: contrast-color(var(--dry-color-fill-accent));
174
+ --dry-color-on-purple: contrast-color(var(--dry-color-fill-purple));
175
+ --dry-color-on-orange: contrast-color(var(--dry-color-fill-orange));
176
+ }
162
177
  }