@dryui/ui 0.2.2 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (433) hide show
  1. package/dist/adjust/adjust.svelte +1 -1
  2. package/dist/aurora/aurora.svelte +58 -11
  3. package/dist/aurora/aurora.svelte.d.ts +1 -0
  4. package/dist/aurora/index.d.ts +2 -0
  5. package/dist/diagram/diagram.svelte +769 -0
  6. package/dist/diagram/diagram.svelte.d.ts +10 -0
  7. package/dist/diagram/edge-routing.d.ts +9 -0
  8. package/dist/diagram/edge-routing.js +281 -0
  9. package/dist/diagram/index.d.ts +9 -0
  10. package/dist/diagram/index.js +1 -0
  11. package/dist/diagram/layout.d.ts +2 -0
  12. package/dist/diagram/layout.js +985 -0
  13. package/dist/diagram/types.d.ts +196 -0
  14. package/dist/displacement/displacement.svelte +39 -3
  15. package/dist/drag-and-drop/context.svelte.d.ts +1 -0
  16. package/dist/drag-and-drop/drag-and-drop-group.svelte +37 -0
  17. package/dist/drag-and-drop/drag-and-drop-group.svelte.d.ts +8 -0
  18. package/dist/drag-and-drop/drag-and-drop-handle.svelte +2 -0
  19. package/dist/drag-and-drop/drag-and-drop-item.svelte +25 -6
  20. package/dist/drag-and-drop/drag-and-drop-root.svelte +624 -34
  21. package/dist/drag-and-drop/group-context.svelte.d.ts +13 -0
  22. package/dist/drag-and-drop/group-context.svelte.js +8 -0
  23. package/dist/drag-and-drop/index.d.ts +2 -0
  24. package/dist/drag-and-drop/index.js +3 -1
  25. package/dist/drawer/drawer-content.svelte +2 -1
  26. package/dist/drawer/drawer-footer.svelte +1 -1
  27. package/dist/gradient-mesh/gradient-mesh.svelte +42 -5
  28. package/dist/halftone/halftone.svelte +16 -36
  29. package/dist/index.d.ts +1 -4
  30. package/dist/index.js +1 -2
  31. package/dist/logo-mark/logo-mark.svelte +2 -2
  32. package/dist/noise/noise.svelte +2 -2
  33. package/dist/shader-canvas/presets.js +1 -1
  34. package/dist/shader-canvas/shader-canvas.svelte +4 -1
  35. package/dist/sidebar/sidebar-footer.svelte +5 -4
  36. package/dist/spotlight/spotlight.svelte +42 -4
  37. package/dist/themes/aurora.css +229 -0
  38. package/dist/themes/dark.css +134 -0
  39. package/dist/themes/default.css +76 -0
  40. package/dist/themes/midnight.css +142 -0
  41. package/dist/themes/terminal.css +175 -0
  42. package/package.json +22 -27
  43. package/skills/dryui/SKILL.md +1 -0
  44. package/dist/system-map/index.d.ts +0 -17
  45. package/dist/system-map/index.js +0 -1
  46. package/dist/system-map/system-map.svelte +0 -311
  47. package/dist/system-map/system-map.svelte.d.ts +0 -25
  48. package/dist/system-map/types.d.ts +0 -99
  49. package/dist/thumbnail/_layout-content.svelte +0 -89
  50. package/dist/thumbnail/_layout-content.svelte.d.ts +0 -9
  51. package/dist/thumbnail/_layout-footer.svelte +0 -54
  52. package/dist/thumbnail/_layout-footer.svelte.d.ts +0 -9
  53. package/dist/thumbnail/_layout-header.svelte +0 -76
  54. package/dist/thumbnail/_layout-header.svelte.d.ts +0 -9
  55. package/dist/thumbnail/_layout-sidebar.svelte +0 -75
  56. package/dist/thumbnail/_layout-sidebar.svelte.d.ts +0 -9
  57. package/dist/thumbnail/accordion.svelte +0 -144
  58. package/dist/thumbnail/accordion.svelte.d.ts +0 -7
  59. package/dist/thumbnail/add-on-selector.svelte +0 -213
  60. package/dist/thumbnail/add-on-selector.svelte.d.ts +0 -7
  61. package/dist/thumbnail/affix-group.svelte +0 -55
  62. package/dist/thumbnail/affix-group.svelte.d.ts +0 -7
  63. package/dist/thumbnail/alert-dialog.svelte +0 -100
  64. package/dist/thumbnail/alert-dialog.svelte.d.ts +0 -7
  65. package/dist/thumbnail/alert.svelte +0 -79
  66. package/dist/thumbnail/alert.svelte.d.ts +0 -7
  67. package/dist/thumbnail/alpha-slider.svelte +0 -55
  68. package/dist/thumbnail/alpha-slider.svelte.d.ts +0 -7
  69. package/dist/thumbnail/amenity-grid.svelte +0 -236
  70. package/dist/thumbnail/amenity-grid.svelte.d.ts +0 -7
  71. package/dist/thumbnail/app-frame.svelte.d.ts +0 -7
  72. package/dist/thumbnail/apply-size.d.ts +0 -3
  73. package/dist/thumbnail/apply-size.js +0 -14
  74. package/dist/thumbnail/aspect-ratio.svelte +0 -64
  75. package/dist/thumbnail/aspect-ratio.svelte.d.ts +0 -7
  76. package/dist/thumbnail/aurora.svelte +0 -88
  77. package/dist/thumbnail/aurora.svelte.d.ts +0 -7
  78. package/dist/thumbnail/avatar-group.svelte.d.ts +0 -7
  79. package/dist/thumbnail/avatar.svelte +0 -60
  80. package/dist/thumbnail/avatar.svelte.d.ts +0 -7
  81. package/dist/thumbnail/backdrop.svelte +0 -73
  82. package/dist/thumbnail/backdrop.svelte.d.ts +0 -7
  83. package/dist/thumbnail/badge.svelte +0 -100
  84. package/dist/thumbnail/badge.svelte.d.ts +0 -7
  85. package/dist/thumbnail/booking-confirmation.svelte +0 -109
  86. package/dist/thumbnail/booking-confirmation.svelte.d.ts +0 -7
  87. package/dist/thumbnail/breadcrumb.svelte +0 -80
  88. package/dist/thumbnail/breadcrumb.svelte.d.ts +0 -7
  89. package/dist/thumbnail/button-group.svelte +0 -76
  90. package/dist/thumbnail/button-group.svelte.d.ts +0 -7
  91. package/dist/thumbnail/button.svelte +0 -62
  92. package/dist/thumbnail/button.svelte.d.ts +0 -7
  93. package/dist/thumbnail/calendar.svelte +0 -86
  94. package/dist/thumbnail/calendar.svelte.d.ts +0 -7
  95. package/dist/thumbnail/card.svelte +0 -113
  96. package/dist/thumbnail/card.svelte.d.ts +0 -7
  97. package/dist/thumbnail/carousel.svelte +0 -111
  98. package/dist/thumbnail/carousel.svelte.d.ts +0 -7
  99. package/dist/thumbnail/chart.svelte +0 -93
  100. package/dist/thumbnail/chart.svelte.d.ts +0 -7
  101. package/dist/thumbnail/chat-message.svelte.d.ts +0 -7
  102. package/dist/thumbnail/chat-thread.svelte +0 -140
  103. package/dist/thumbnail/chat-thread.svelte.d.ts +0 -7
  104. package/dist/thumbnail/checkbox.svelte +0 -71
  105. package/dist/thumbnail/checkbox.svelte.d.ts +0 -7
  106. package/dist/thumbnail/chip-group.svelte +0 -79
  107. package/dist/thumbnail/chip-group.svelte.d.ts +0 -7
  108. package/dist/thumbnail/chip.svelte +0 -76
  109. package/dist/thumbnail/chip.svelte.d.ts +0 -7
  110. package/dist/thumbnail/chromatic-shift.svelte +0 -55
  111. package/dist/thumbnail/chromatic-shift.svelte.d.ts +0 -7
  112. package/dist/thumbnail/clipboard.svelte +0 -68
  113. package/dist/thumbnail/clipboard.svelte.d.ts +0 -7
  114. package/dist/thumbnail/code-block.svelte +0 -125
  115. package/dist/thumbnail/code-block.svelte.d.ts +0 -7
  116. package/dist/thumbnail/collapsible.svelte +0 -101
  117. package/dist/thumbnail/collapsible.svelte.d.ts +0 -7
  118. package/dist/thumbnail/color-picker.svelte +0 -108
  119. package/dist/thumbnail/color-picker.svelte.d.ts +0 -7
  120. package/dist/thumbnail/combobox.svelte +0 -122
  121. package/dist/thumbnail/combobox.svelte.d.ts +0 -7
  122. package/dist/thumbnail/command-palette.svelte +0 -134
  123. package/dist/thumbnail/command-palette.svelte.d.ts +0 -7
  124. package/dist/thumbnail/commerce-header.svelte +0 -55
  125. package/dist/thumbnail/commerce-header.svelte.d.ts +0 -7
  126. package/dist/thumbnail/comparison-table.svelte +0 -193
  127. package/dist/thumbnail/comparison-table.svelte.d.ts +0 -7
  128. package/dist/thumbnail/container.svelte +0 -119
  129. package/dist/thumbnail/container.svelte.d.ts +0 -7
  130. package/dist/thumbnail/context-menu.svelte +0 -108
  131. package/dist/thumbnail/context-menu.svelte.d.ts +0 -7
  132. package/dist/thumbnail/country-select.svelte +0 -111
  133. package/dist/thumbnail/country-select.svelte.d.ts +0 -7
  134. package/dist/thumbnail/currency-selector.svelte +0 -111
  135. package/dist/thumbnail/currency-selector.svelte.d.ts +0 -7
  136. package/dist/thumbnail/data-grid.svelte +0 -230
  137. package/dist/thumbnail/data-grid.svelte.d.ts +0 -7
  138. package/dist/thumbnail/date-field.svelte +0 -132
  139. package/dist/thumbnail/date-field.svelte.d.ts +0 -7
  140. package/dist/thumbnail/date-picker.svelte +0 -126
  141. package/dist/thumbnail/date-picker.svelte.d.ts +0 -7
  142. package/dist/thumbnail/date-range-picker.svelte +0 -100
  143. package/dist/thumbnail/date-range-picker.svelte.d.ts +0 -7
  144. package/dist/thumbnail/date-time-input.svelte +0 -182
  145. package/dist/thumbnail/date-time-input.svelte.d.ts +0 -7
  146. package/dist/thumbnail/description-list.svelte +0 -142
  147. package/dist/thumbnail/description-list.svelte.d.ts +0 -7
  148. package/dist/thumbnail/dialog.svelte +0 -136
  149. package/dist/thumbnail/dialog.svelte.d.ts +0 -7
  150. package/dist/thumbnail/displacement.svelte +0 -55
  151. package/dist/thumbnail/displacement.svelte.d.ts +0 -7
  152. package/dist/thumbnail/drag-and-drop.svelte +0 -139
  153. package/dist/thumbnail/drag-and-drop.svelte.d.ts +0 -7
  154. package/dist/thumbnail/drawer.svelte +0 -112
  155. package/dist/thumbnail/drawer.svelte.d.ts +0 -7
  156. package/dist/thumbnail/drop-zone.svelte +0 -55
  157. package/dist/thumbnail/drop-zone.svelte.d.ts +0 -7
  158. package/dist/thumbnail/dropdown-menu.svelte +0 -128
  159. package/dist/thumbnail/dropdown-menu.svelte.d.ts +0 -7
  160. package/dist/thumbnail/empty-state.svelte.d.ts +0 -7
  161. package/dist/thumbnail/fare-class-picker.svelte +0 -225
  162. package/dist/thumbnail/fare-class-picker.svelte.d.ts +0 -7
  163. package/dist/thumbnail/feature-split-section.svelte.d.ts +0 -7
  164. package/dist/thumbnail/field.svelte +0 -82
  165. package/dist/thumbnail/field.svelte.d.ts +0 -7
  166. package/dist/thumbnail/fieldset.svelte +0 -123
  167. package/dist/thumbnail/fieldset.svelte.d.ts +0 -7
  168. package/dist/thumbnail/file-select.svelte +0 -90
  169. package/dist/thumbnail/file-select.svelte.d.ts +0 -7
  170. package/dist/thumbnail/file-upload.svelte +0 -84
  171. package/dist/thumbnail/file-upload.svelte.d.ts +0 -7
  172. package/dist/thumbnail/filter-sidebar.svelte +0 -201
  173. package/dist/thumbnail/filter-sidebar.svelte.d.ts +0 -7
  174. package/dist/thumbnail/flexible-dates-grid.svelte +0 -210
  175. package/dist/thumbnail/flexible-dates-grid.svelte.d.ts +0 -7
  176. package/dist/thumbnail/flight-timeline.svelte +0 -155
  177. package/dist/thumbnail/flight-timeline.svelte.d.ts +0 -7
  178. package/dist/thumbnail/flip-card.svelte +0 -128
  179. package/dist/thumbnail/flip-card.svelte.d.ts +0 -7
  180. package/dist/thumbnail/float-button.svelte +0 -63
  181. package/dist/thumbnail/float-button.svelte.d.ts +0 -7
  182. package/dist/thumbnail/focus-trap.svelte +0 -110
  183. package/dist/thumbnail/focus-trap.svelte.d.ts +0 -7
  184. package/dist/thumbnail/format-bytes.svelte +0 -51
  185. package/dist/thumbnail/format-bytes.svelte.d.ts +0 -7
  186. package/dist/thumbnail/format-date.svelte +0 -51
  187. package/dist/thumbnail/format-date.svelte.d.ts +0 -7
  188. package/dist/thumbnail/format-number.svelte +0 -51
  189. package/dist/thumbnail/format-number.svelte.d.ts +0 -7
  190. package/dist/thumbnail/gauge.svelte +0 -90
  191. package/dist/thumbnail/gauge.svelte.d.ts +0 -7
  192. package/dist/thumbnail/glass-surface.svelte.d.ts +0 -7
  193. package/dist/thumbnail/glow.svelte +0 -55
  194. package/dist/thumbnail/glow.svelte.d.ts +0 -7
  195. package/dist/thumbnail/gradient-mesh.svelte +0 -55
  196. package/dist/thumbnail/gradient-mesh.svelte.d.ts +0 -7
  197. package/dist/thumbnail/guest-room-selector.svelte +0 -214
  198. package/dist/thumbnail/guest-room-selector.svelte.d.ts +0 -7
  199. package/dist/thumbnail/halftone.svelte +0 -55
  200. package/dist/thumbnail/halftone.svelte.d.ts +0 -7
  201. package/dist/thumbnail/heading.svelte +0 -91
  202. package/dist/thumbnail/heading.svelte.d.ts +0 -7
  203. package/dist/thumbnail/hotel-gallery.svelte +0 -117
  204. package/dist/thumbnail/hotel-gallery.svelte.d.ts +0 -7
  205. package/dist/thumbnail/hotkey.svelte +0 -108
  206. package/dist/thumbnail/hotkey.svelte.d.ts +0 -7
  207. package/dist/thumbnail/hover-card.svelte +0 -117
  208. package/dist/thumbnail/hover-card.svelte.d.ts +0 -7
  209. package/dist/thumbnail/icon.svelte +0 -55
  210. package/dist/thumbnail/icon.svelte.d.ts +0 -7
  211. package/dist/thumbnail/image-comparison.svelte +0 -96
  212. package/dist/thumbnail/image-comparison.svelte.d.ts +0 -7
  213. package/dist/thumbnail/image.svelte +0 -74
  214. package/dist/thumbnail/image.svelte.d.ts +0 -7
  215. package/dist/thumbnail/index.d.ts +0 -12
  216. package/dist/thumbnail/index.js +0 -359
  217. package/dist/thumbnail/infinite-scroll.svelte +0 -129
  218. package/dist/thumbnail/infinite-scroll.svelte.d.ts +0 -7
  219. package/dist/thumbnail/input-group.svelte +0 -55
  220. package/dist/thumbnail/input-group.svelte.d.ts +0 -7
  221. package/dist/thumbnail/input.svelte +0 -74
  222. package/dist/thumbnail/input.svelte.d.ts +0 -7
  223. package/dist/thumbnail/itinerary-timeline.svelte +0 -143
  224. package/dist/thumbnail/itinerary-timeline.svelte.d.ts +0 -7
  225. package/dist/thumbnail/kbd.svelte +0 -112
  226. package/dist/thumbnail/kbd.svelte.d.ts +0 -7
  227. package/dist/thumbnail/label.svelte +0 -54
  228. package/dist/thumbnail/label.svelte.d.ts +0 -7
  229. package/dist/thumbnail/layout-header-content-footer.svelte +0 -64
  230. package/dist/thumbnail/layout-header-content-footer.svelte.d.ts +0 -7
  231. package/dist/thumbnail/layout-header-sidebar-main.svelte +0 -64
  232. package/dist/thumbnail/layout-header-sidebar-main.svelte.d.ts +0 -7
  233. package/dist/thumbnail/layout-sidebar-main.svelte +0 -57
  234. package/dist/thumbnail/layout-sidebar-main.svelte.d.ts +0 -7
  235. package/dist/thumbnail/link-preview.svelte +0 -141
  236. package/dist/thumbnail/link-preview.svelte.d.ts +0 -7
  237. package/dist/thumbnail/link.svelte +0 -70
  238. package/dist/thumbnail/link.svelte.d.ts +0 -7
  239. package/dist/thumbnail/list.svelte +0 -86
  240. package/dist/thumbnail/list.svelte.d.ts +0 -7
  241. package/dist/thumbnail/listbox.svelte +0 -102
  242. package/dist/thumbnail/listbox.svelte.d.ts +0 -7
  243. package/dist/thumbnail/location-autocomplete.svelte +0 -219
  244. package/dist/thumbnail/location-autocomplete.svelte.d.ts +0 -7
  245. package/dist/thumbnail/logo-cloud.svelte.d.ts +0 -7
  246. package/dist/thumbnail/loyalty-points-display.svelte +0 -147
  247. package/dist/thumbnail/loyalty-points-display.svelte.d.ts +0 -7
  248. package/dist/thumbnail/map-list-toggle.svelte +0 -140
  249. package/dist/thumbnail/map-list-toggle.svelte.d.ts +0 -7
  250. package/dist/thumbnail/map.svelte +0 -112
  251. package/dist/thumbnail/map.svelte.d.ts +0 -7
  252. package/dist/thumbnail/markdown-renderer.svelte +0 -113
  253. package/dist/thumbnail/markdown-renderer.svelte.d.ts +0 -7
  254. package/dist/thumbnail/marquee.svelte +0 -114
  255. package/dist/thumbnail/marquee.svelte.d.ts +0 -7
  256. package/dist/thumbnail/mask-reveal.svelte +0 -55
  257. package/dist/thumbnail/mask-reveal.svelte.d.ts +0 -7
  258. package/dist/thumbnail/mega-menu.svelte +0 -176
  259. package/dist/thumbnail/mega-menu.svelte.d.ts +0 -7
  260. package/dist/thumbnail/menubar.svelte +0 -99
  261. package/dist/thumbnail/menubar.svelte.d.ts +0 -7
  262. package/dist/thumbnail/multi-city-search-form.svelte +0 -241
  263. package/dist/thumbnail/multi-city-search-form.svelte.d.ts +0 -7
  264. package/dist/thumbnail/multi-select-combobox.svelte +0 -142
  265. package/dist/thumbnail/multi-select-combobox.svelte.d.ts +0 -7
  266. package/dist/thumbnail/navigation-menu.svelte +0 -102
  267. package/dist/thumbnail/navigation-menu.svelte.d.ts +0 -7
  268. package/dist/thumbnail/noise.svelte +0 -72
  269. package/dist/thumbnail/noise.svelte.d.ts +0 -7
  270. package/dist/thumbnail/notification-center.svelte +0 -152
  271. package/dist/thumbnail/notification-center.svelte.d.ts +0 -7
  272. package/dist/thumbnail/number-input.svelte +0 -113
  273. package/dist/thumbnail/number-input.svelte.d.ts +0 -7
  274. package/dist/thumbnail/option-swatch-group.svelte +0 -55
  275. package/dist/thumbnail/option-swatch-group.svelte.d.ts +0 -7
  276. package/dist/thumbnail/page-header.svelte.d.ts +0 -7
  277. package/dist/thumbnail/pagination.svelte +0 -121
  278. package/dist/thumbnail/pagination.svelte.d.ts +0 -7
  279. package/dist/thumbnail/passenger-class-selector.svelte +0 -142
  280. package/dist/thumbnail/passenger-class-selector.svelte.d.ts +0 -7
  281. package/dist/thumbnail/payment-card-input.svelte +0 -172
  282. package/dist/thumbnail/payment-card-input.svelte.d.ts +0 -7
  283. package/dist/thumbnail/phone-input.svelte +0 -103
  284. package/dist/thumbnail/phone-input.svelte.d.ts +0 -7
  285. package/dist/thumbnail/pin-input.svelte +0 -72
  286. package/dist/thumbnail/pin-input.svelte.d.ts +0 -7
  287. package/dist/thumbnail/popover.svelte +0 -122
  288. package/dist/thumbnail/popover.svelte.d.ts +0 -7
  289. package/dist/thumbnail/portal.svelte +0 -115
  290. package/dist/thumbnail/portal.svelte.d.ts +0 -7
  291. package/dist/thumbnail/price-calendar.svelte +0 -366
  292. package/dist/thumbnail/price-calendar.svelte.d.ts +0 -7
  293. package/dist/thumbnail/price-summary-panel.svelte +0 -165
  294. package/dist/thumbnail/price-summary-panel.svelte.d.ts +0 -7
  295. package/dist/thumbnail/progress-ring.svelte +0 -63
  296. package/dist/thumbnail/progress-ring.svelte.d.ts +0 -7
  297. package/dist/thumbnail/progress.svelte +0 -66
  298. package/dist/thumbnail/progress.svelte.d.ts +0 -7
  299. package/dist/thumbnail/promo-code-input.svelte +0 -111
  300. package/dist/thumbnail/promo-code-input.svelte.d.ts +0 -7
  301. package/dist/thumbnail/promo-mosaic.svelte +0 -55
  302. package/dist/thumbnail/promo-mosaic.svelte.d.ts +0 -7
  303. package/dist/thumbnail/prompt-input.svelte +0 -91
  304. package/dist/thumbnail/prompt-input.svelte.d.ts +0 -7
  305. package/dist/thumbnail/qr-code.svelte +0 -217
  306. package/dist/thumbnail/qr-code.svelte.d.ts +0 -7
  307. package/dist/thumbnail/radio-group.svelte +0 -97
  308. package/dist/thumbnail/radio-group.svelte.d.ts +0 -7
  309. package/dist/thumbnail/range-calendar.svelte +0 -92
  310. package/dist/thumbnail/range-calendar.svelte.d.ts +0 -7
  311. package/dist/thumbnail/rating.svelte +0 -61
  312. package/dist/thumbnail/rating.svelte.d.ts +0 -7
  313. package/dist/thumbnail/recent-searches.svelte +0 -197
  314. package/dist/thumbnail/recent-searches.svelte.d.ts +0 -7
  315. package/dist/thumbnail/relative-time.svelte +0 -51
  316. package/dist/thumbnail/relative-time.svelte.d.ts +0 -7
  317. package/dist/thumbnail/result-card-car.svelte +0 -149
  318. package/dist/thumbnail/result-card-car.svelte.d.ts +0 -7
  319. package/dist/thumbnail/result-card-flight.svelte +0 -170
  320. package/dist/thumbnail/result-card-flight.svelte.d.ts +0 -7
  321. package/dist/thumbnail/result-card-hotel.svelte +0 -174
  322. package/dist/thumbnail/result-card-hotel.svelte.d.ts +0 -7
  323. package/dist/thumbnail/reveal.svelte +0 -109
  324. package/dist/thumbnail/reveal.svelte.d.ts +0 -7
  325. package/dist/thumbnail/review-card.svelte +0 -153
  326. package/dist/thumbnail/review-card.svelte.d.ts +0 -7
  327. package/dist/thumbnail/rich-text-editor.svelte +0 -134
  328. package/dist/thumbnail/rich-text-editor.svelte.d.ts +0 -7
  329. package/dist/thumbnail/room-type-picker.svelte +0 -212
  330. package/dist/thumbnail/room-type-picker.svelte.d.ts +0 -7
  331. package/dist/thumbnail/root.svelte +0 -52
  332. package/dist/thumbnail/root.svelte.d.ts +0 -10
  333. package/dist/thumbnail/route-map.svelte +0 -132
  334. package/dist/thumbnail/route-map.svelte.d.ts +0 -7
  335. package/dist/thumbnail/scroll-area.svelte +0 -124
  336. package/dist/thumbnail/scroll-area.svelte.d.ts +0 -7
  337. package/dist/thumbnail/scroll-to-top.svelte +0 -60
  338. package/dist/thumbnail/scroll-to-top.svelte.d.ts +0 -7
  339. package/dist/thumbnail/search-form-tabs.svelte +0 -192
  340. package/dist/thumbnail/search-form-tabs.svelte.d.ts +0 -7
  341. package/dist/thumbnail/seat-map.svelte +0 -358
  342. package/dist/thumbnail/seat-map.svelte.d.ts +0 -7
  343. package/dist/thumbnail/segmented-control.svelte +0 -93
  344. package/dist/thumbnail/segmented-control.svelte.d.ts +0 -7
  345. package/dist/thumbnail/select.svelte +0 -82
  346. package/dist/thumbnail/select.svelte.d.ts +0 -7
  347. package/dist/thumbnail/selectable-tile-group.svelte +0 -55
  348. package/dist/thumbnail/selectable-tile-group.svelte.d.ts +0 -7
  349. package/dist/thumbnail/separator.svelte +0 -94
  350. package/dist/thumbnail/separator.svelte.d.ts +0 -7
  351. package/dist/thumbnail/shader-canvas.svelte +0 -55
  352. package/dist/thumbnail/shader-canvas.svelte.d.ts +0 -7
  353. package/dist/thumbnail/sidebar.svelte +0 -109
  354. package/dist/thumbnail/sidebar.svelte.d.ts +0 -7
  355. package/dist/thumbnail/skeleton.svelte +0 -94
  356. package/dist/thumbnail/skeleton.svelte.d.ts +0 -7
  357. package/dist/thumbnail/slider.svelte +0 -71
  358. package/dist/thumbnail/slider.svelte.d.ts +0 -7
  359. package/dist/thumbnail/sort-bar.svelte +0 -156
  360. package/dist/thumbnail/sort-bar.svelte.d.ts +0 -7
  361. package/dist/thumbnail/spacer.svelte +0 -95
  362. package/dist/thumbnail/spacer.svelte.d.ts +0 -7
  363. package/dist/thumbnail/sparkline.svelte +0 -59
  364. package/dist/thumbnail/sparkline.svelte.d.ts +0 -7
  365. package/dist/thumbnail/spinner.svelte +0 -63
  366. package/dist/thumbnail/spinner.svelte.d.ts +0 -7
  367. package/dist/thumbnail/splitter.svelte +0 -79
  368. package/dist/thumbnail/splitter.svelte.d.ts +0 -7
  369. package/dist/thumbnail/spotlight.svelte +0 -90
  370. package/dist/thumbnail/spotlight.svelte.d.ts +0 -7
  371. package/dist/thumbnail/star-rating.svelte +0 -106
  372. package/dist/thumbnail/star-rating.svelte.d.ts +0 -7
  373. package/dist/thumbnail/stat-card.svelte.d.ts +0 -7
  374. package/dist/thumbnail/stepper.svelte +0 -94
  375. package/dist/thumbnail/stepper.svelte.d.ts +0 -7
  376. package/dist/thumbnail/svg.svelte +0 -55
  377. package/dist/thumbnail/svg.svelte.d.ts +0 -8
  378. package/dist/thumbnail/swatch-strip.svelte.d.ts +0 -7
  379. package/dist/thumbnail/switch.svelte.d.ts +0 -7
  380. package/dist/thumbnail/system-map.svelte +0 -154
  381. package/dist/thumbnail/system-map.svelte.d.ts +0 -7
  382. package/dist/thumbnail/table-of-contents.svelte +0 -101
  383. package/dist/thumbnail/table-of-contents.svelte.d.ts +0 -7
  384. package/dist/thumbnail/table.svelte +0 -214
  385. package/dist/thumbnail/table.svelte.d.ts +0 -7
  386. package/dist/thumbnail/tabs.svelte +0 -133
  387. package/dist/thumbnail/tabs.svelte.d.ts +0 -7
  388. package/dist/thumbnail/tag.svelte +0 -95
  389. package/dist/thumbnail/tag.svelte.d.ts +0 -7
  390. package/dist/thumbnail/tags-input.svelte +0 -142
  391. package/dist/thumbnail/tags-input.svelte.d.ts +0 -7
  392. package/dist/thumbnail/text.svelte +0 -72
  393. package/dist/thumbnail/text.svelte.d.ts +0 -7
  394. package/dist/thumbnail/textarea.svelte +0 -111
  395. package/dist/thumbnail/textarea.svelte.d.ts +0 -7
  396. package/dist/thumbnail/time-input.svelte +0 -94
  397. package/dist/thumbnail/time-input.svelte.d.ts +0 -7
  398. package/dist/thumbnail/timeline.svelte +0 -123
  399. package/dist/thumbnail/timeline.svelte.d.ts +0 -7
  400. package/dist/thumbnail/toast.svelte +0 -105
  401. package/dist/thumbnail/toast.svelte.d.ts +0 -7
  402. package/dist/thumbnail/toggle-group.svelte +0 -76
  403. package/dist/thumbnail/toggle-group.svelte.d.ts +0 -7
  404. package/dist/thumbnail/toggle.svelte +0 -46
  405. package/dist/thumbnail/toggle.svelte.d.ts +0 -7
  406. package/dist/thumbnail/token-preview.svelte.d.ts +0 -7
  407. package/dist/thumbnail/toolbar.svelte +0 -109
  408. package/dist/thumbnail/toolbar.svelte.d.ts +0 -7
  409. package/dist/thumbnail/tooltip.svelte +0 -85
  410. package/dist/thumbnail/tooltip.svelte.d.ts +0 -7
  411. package/dist/thumbnail/tour.svelte +0 -149
  412. package/dist/thumbnail/tour.svelte.d.ts +0 -7
  413. package/dist/thumbnail/transfer.svelte +0 -168
  414. package/dist/thumbnail/transfer.svelte.d.ts +0 -7
  415. package/dist/thumbnail/tree.svelte +0 -215
  416. package/dist/thumbnail/tree.svelte.d.ts +0 -7
  417. package/dist/thumbnail/trip-card.svelte +0 -137
  418. package/dist/thumbnail/trip-card.svelte.d.ts +0 -7
  419. package/dist/thumbnail/trust-badges.svelte +0 -207
  420. package/dist/thumbnail/trust-badges.svelte.d.ts +0 -7
  421. package/dist/thumbnail/typing-indicator.svelte +0 -65
  422. package/dist/thumbnail/typing-indicator.svelte.d.ts +0 -7
  423. package/dist/thumbnail/typography.svelte +0 -80
  424. package/dist/thumbnail/typography.svelte.d.ts +0 -7
  425. package/dist/thumbnail/user.svelte.d.ts +0 -7
  426. package/dist/thumbnail/video-embed.svelte +0 -87
  427. package/dist/thumbnail/video-embed.svelte.d.ts +0 -7
  428. package/dist/thumbnail/virtual-list.svelte +0 -178
  429. package/dist/thumbnail/virtual-list.svelte.d.ts +0 -7
  430. package/dist/thumbnail/visually-hidden.svelte +0 -106
  431. package/dist/thumbnail/visually-hidden.svelte.d.ts +0 -7
  432. package/dist/thumbnail/wave-divider.svelte.d.ts +0 -7
  433. /package/dist/{system-map → diagram}/types.js +0 -0
package/dist/themes/terminal.css ADDED
@@ -0,0 +1,175 @@
1
+ /*
2
+ * Terminal — Monospace Precision
3
+ *
4
+ * Inspired by: System Diagnostics panels, HUD radar interfaces,
5
+ * Bridgetown Research dark data viz, ARCLIN design system.
6
+ *
7
+ * Pure black, bright white, green accent, monospace everything,
8
+ * sharp corners, data-dense layouts. Dark-only theme.
9
+ * Use with: <html class="theme-terminal"> or <html data-theme="terminal">
10
+ */
11
+
12
+ [data-theme='terminal'],
13
+ .theme-terminal {
14
+ /* ─── Brand — terminal green ──────────────────────────────────── */
15
+ --dry-color-brand: hsl(145, 80%, 50%);
16
+ --dry-color-text-brand: hsl(145, 80%, 50%);
17
+ --dry-color-fill-brand: hsl(145, 80%, 50%);
18
+ --dry-color-fill-brand-hover: hsl(145, 80%, 42%);
19
+ --dry-color-fill-brand-active: hsl(145, 80%, 36%);
20
+ --dry-color-fill-brand-weak: hsla(145, 80%, 50%, 0.08);
21
+ --dry-color-stroke-brand: hsla(145, 80%, 50%, 0.5);
22
+ --dry-color-stroke-brand-strong: hsla(145, 80%, 50%, 0.8);
23
+ --dry-color-stroke-brand-weak: hsla(145, 80%, 50%, 0.15);
24
+ --dry-color-on-brand: hsl(145, 30%, 5%);
25
+ --dry-color-focus-ring: hsla(145, 80%, 50%, 0.4);
26
+
27
+ /* ─── Accent — amber warning tone ─────────────────────────────── */
28
+ --dry-color-accent: hsl(45, 90%, 55%);
29
+ --dry-color-text-accent: hsl(45, 90%, 55%);
30
+ --dry-color-fill-accent: hsl(45, 90%, 55%);
31
+ --dry-color-fill-accent-hover: hsl(45, 90%, 47%);
32
+ --dry-color-fill-accent-active: hsl(45, 90%, 41%);
33
+ --dry-color-fill-accent-weak: hsla(45, 90%, 55%, 0.08);
34
+ --dry-color-stroke-accent: hsla(45, 90%, 55%, 0.5);
35
+ --dry-color-stroke-accent-strong: hsla(45, 90%, 55%, 0.8);
36
+ --dry-color-stroke-accent-weak: hsla(45, 90%, 55%, 0.15);
37
+ --dry-color-icon-accent: hsla(45, 90%, 55%, 0.8);
38
+ --dry-color-on-accent: hsl(45, 30%, 5%);
39
+
40
+ /* ─── Backgrounds — pure black, minimal saturation ────────────── */
41
+ --dry-color-bg-base: hsl(0, 0%, 2%);
42
+ --dry-color-bg-raised: hsl(0, 0%, 6%);
43
+ --dry-color-bg-overlay: hsl(0, 0%, 10%);
44
+ --dry-color-bg-elevated: hsl(0, 0%, 14%);
45
+ --dry-color-bg-floating: hsl(0, 0%, 18%);
46
+ --dry-color-bg-sunken: hsl(0, 0%, 0%);
47
+ --dry-color-bg-brand: var(--dry-color-fill-brand);
48
+ --dry-color-bg-inverse: hsl(0, 0%, 95%);
49
+
50
+ /* ─── Neutrals — pure achromatic ──────────────────────────────── */
51
+ --dry-color-text-strong: hsla(0, 0%, 100%, 0.95);
52
+ --dry-color-text-weak: hsla(0, 0%, 100%, 0.55);
53
+ --dry-color-icon: hsla(0, 0%, 100%, 0.7);
54
+ --dry-color-stroke-strong: hsla(0, 0%, 100%, 0.4);
55
+ --dry-color-stroke-weak: hsla(0, 0%, 100%, 0.1);
56
+ --dry-color-fill: hsla(0, 0%, 100%, 0.04);
57
+ --dry-color-fill-hover: hsla(0, 0%, 100%, 0.07);
58
+ --dry-color-fill-active: hsla(0, 0%, 100%, 0.12);
59
+
60
+ /* ─── Shadows — barely there, screens glow instead ────────────── */
61
+ --dry-shadow-raised: 0 1px 2px hsla(0, 0%, 0%, 0.6);
62
+ --dry-shadow-overlay: 0 4px 16px hsla(0, 0%, 0%, 0.7);
63
+ --dry-shadow-sunken: inset 0 1px 3px hsla(0, 0%, 0%, 0.5);
64
+ --dry-shadow-brand: 0 0 12px hsla(145, 80%, 50%, 0.15), 0 0 4px hsla(145, 80%, 50%, 0.1);
65
+ --dry-shadow-accent: 0 0 12px hsla(45, 90%, 55%, 0.15), 0 0 4px hsla(45, 90%, 55%, 0.1);
66
+
67
+ /* ─── Glass — minimal, tinted dark ────────────────────────────── */
68
+ --dry-glass-blur: 8px;
69
+ --dry-glass-tint: hsla(0, 0%, 4%, 0.85);
70
+ --dry-glass-opacity: 88%;
71
+ --dry-glass-saturation: 100%;
72
+ --dry-glass-border: hsla(0, 0%, 100%, 0.08);
73
+ --dry-glass-border-strong: hsla(0, 0%, 100%, 0.15);
74
+
75
+ /* ─── Glow — scanline / CRT feel ──────────────────────────────── */
76
+ --dry-glow-color: var(--dry-color-fill-brand);
77
+ --dry-glow-blur: 16px;
78
+ --dry-glow-spread: 32px;
79
+ --dry-glow-ring: 0 0 0 1px hsla(145, 80%, 50%, 0.3), 0 0 8px 1px hsla(145, 80%, 50%, 0.15);
80
+ --dry-glow-ring-accent: 0 0 0 1px hsla(45, 90%, 55%, 0.3), 0 0 8px 1px hsla(45, 90%, 55%, 0.15);
81
+ --dry-glow-ambient: hsla(145, 80%, 50%, 0.02);
82
+ --dry-glow-ambient-accent: hsla(45, 90%, 55%, 0.02);
83
+
84
+ /* ─── Gradient palette — data viz inspired ────────────────────── */
85
+ --dry-gradient-warm: linear-gradient(
86
+ 135deg,
87
+ hsl(45, 90%, 55%) 0%,
88
+ hsl(25, 80%, 50%) 50%,
89
+ hsl(0, 70%, 45%) 100%
90
+ );
91
+ --dry-gradient-cool: linear-gradient(
92
+ 135deg,
93
+ hsl(145, 70%, 45%) 0%,
94
+ hsl(180, 60%, 40%) 50%,
95
+ hsl(210, 55%, 45%) 100%
96
+ );
97
+ --dry-gradient-sunset: linear-gradient(
98
+ 135deg,
99
+ hsl(45, 90%, 55%) 0%,
100
+ hsl(15, 85%, 50%) 40%,
101
+ hsl(350, 75%, 45%) 100%
102
+ );
103
+ --dry-gradient-ocean: linear-gradient(
104
+ 135deg,
105
+ hsl(180, 70%, 40%) 0%,
106
+ hsl(200, 65%, 45%) 50%,
107
+ hsl(230, 55%, 50%) 100%
108
+ );
109
+ --dry-gradient-surface: linear-gradient(180deg, hsl(0, 0%, 2%) 0%, hsl(0, 0%, 6%) 100%);
110
+
111
+ /* ─── Grain — CRT noise ───────────────────────────────────────── */
112
+ --dry-grain-opacity: 0.08;
113
+ --dry-grain-size: 0.8;
114
+ --dry-grain-blend: overlay;
115
+
116
+ /* ─── Typography — monospace everything ────────────────────────── */
117
+ --dry-font-sans:
118
+ ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
119
+ monospace;
120
+ --dry-font-display:
121
+ ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
122
+ monospace;
123
+
124
+ /* ─── Font weights — lighter for that CRT look ────────────────── */
125
+ --dry-font-weight-normal: 400;
126
+ --dry-font-weight-medium: 400;
127
+ --dry-font-weight-semibold: 500;
128
+ --dry-font-weight-bold: 600;
129
+
130
+ /* ─── Letter spacing — wider for monospace readability ─────────── */
131
+ --dry-tracking-tight: 0;
132
+ --dry-tracking-normal: 0.02em;
133
+
134
+ /* ─── Motion — snappy, precise ────────────────────────────────── */
135
+ --dry-duration-fast: 80ms;
136
+ --dry-duration-normal: 160ms;
137
+ --dry-duration-slow: 280ms;
138
+ --dry-ease-spring: var(--dry-ease-spring-snappy);
139
+
140
+ /* ─── Beam blend ──────────────────────────────────────────────── */
141
+ --dry-beam-default-blend: screen;
142
+
143
+ /* ─── Overlay backdrops ───────────────────────────────────────── */
144
+ --dry-color-overlay-backdrop: hsla(0, 0%, 0%, 0.7);
145
+ --dry-color-overlay-backdrop-strong: hsla(0, 0%, 0%, 0.85);
146
+
147
+ /* ─── Radius — sharp, no rounded corners ──────────────────────── */
148
+ --dry-radius-none: 0;
149
+ --dry-radius-sm: 2px;
150
+ --dry-radius-md: 2px;
151
+ --dry-radius-lg: 4px;
152
+ --dry-radius-xl: 4px;
153
+ --dry-radius-2xl: 6px;
154
+ --dry-radius-full: 9999px;
155
+
156
+ /* ─── Toggle — terminal themed ────────────────────────────────── */
157
+ --dry-toggle-track-bg: hsla(0, 0%, 100%, 0.04);
158
+ --dry-toggle-track-stroke: hsla(0, 0%, 100%, 0.4);
159
+ --dry-toggle-selected-bg: hsl(145, 80%, 50%);
160
+ --dry-toggle-selected-stroke: hsl(145, 80%, 50%);
161
+ --dry-toggle-thumb-bg: hsl(0, 0%, 2%);
162
+ --dry-toggle-hover-bg: hsla(0, 0%, 100%, 0.06);
163
+ --dry-toggle-press-bg: hsla(0, 0%, 100%, 0.1);
164
+ --dry-toggle-focus-ring: hsl(145, 80%, 50%);
165
+
166
+ /* ─── Status overrides — more vivid for data-dense UIs ────────── */
167
+ --dry-color-text-error: hsl(0, 80%, 65%);
168
+ --dry-color-fill-error: hsl(0, 80%, 55%);
169
+ --dry-color-text-warning: hsl(45, 90%, 60%);
170
+ --dry-color-fill-warning: hsl(45, 90%, 55%);
171
+ --dry-color-text-success: hsl(145, 80%, 55%);
172
+ --dry-color-fill-success: hsl(145, 80%, 50%);
173
+ --dry-color-text-info: hsl(200, 80%, 65%);
174
+ --dry-color-fill-info: hsl(200, 80%, 55%);
175
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dryui/ui",
3
- "version": "0.2.2",
3
+ "version": "0.3.0",
4
4
  "author": "Rob Balfre",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -216,6 +216,11 @@
216
216
  "svelte": "./dist/description-list/index.js",
217
217
  "default": "./dist/description-list/index.js"
218
218
  },
219
+ "./diagram": {
220
+ "types": "./dist/diagram/index.d.ts",
221
+ "svelte": "./dist/diagram/index.js",
222
+ "default": "./dist/diagram/index.js"
223
+ },
219
224
  "./dialog": {
220
225
  "types": "./dist/dialog/index.d.ts",
221
226
  "svelte": "./dist/dialog/index.js",
@@ -626,11 +631,6 @@
626
631
  "svelte": "./dist/svg/index.js",
627
632
  "default": "./dist/svg/index.js"
628
633
  },
629
- "./system-map": {
630
- "types": "./dist/system-map/index.d.ts",
631
- "svelte": "./dist/system-map/index.js",
632
- "default": "./dist/system-map/index.js"
633
- },
634
634
  "./table": {
635
635
  "types": "./dist/table/index.d.ts",
636
636
  "svelte": "./dist/table/index.js",
@@ -666,11 +666,6 @@
666
666
  "svelte": "./dist/textarea/index.js",
667
667
  "default": "./dist/textarea/index.js"
668
668
  },
669
- "./thumbnail": {
670
- "types": "./dist/thumbnail/index.d.ts",
671
- "svelte": "./dist/thumbnail/index.js",
672
- "default": "./dist/thumbnail/index.js"
673
- },
674
669
  "./time-input": {
675
670
  "types": "./dist/time-input/index.d.ts",
676
671
  "svelte": "./dist/time-input/index.js",
@@ -753,8 +748,11 @@
753
748
  },
754
749
  "./*/*": null,
755
750
  "./internal/*": null,
751
+ "./themes/aurora.css": "./dist/themes/aurora.css",
756
752
  "./themes/dark.css": "./dist/themes/dark.css",
757
- "./themes/default.css": "./dist/themes/default.css"
753
+ "./themes/default.css": "./dist/themes/default.css",
754
+ "./themes/midnight.css": "./dist/themes/midnight.css",
755
+ "./themes/terminal.css": "./dist/themes/terminal.css"
758
756
  },
759
757
  "publishConfig": {
760
758
  "access": "public",
@@ -961,6 +959,11 @@
961
959
  "svelte": "./dist/description-list/index.js",
962
960
  "default": "./dist/description-list/index.js"
963
961
  },
962
+ "./diagram": {
963
+ "types": "./dist/diagram/index.d.ts",
964
+ "svelte": "./dist/diagram/index.js",
965
+ "default": "./dist/diagram/index.js"
966
+ },
964
967
  "./dialog": {
965
968
  "types": "./dist/dialog/index.d.ts",
966
969
  "svelte": "./dist/dialog/index.js",
@@ -1371,11 +1374,6 @@
1371
1374
  "svelte": "./dist/svg/index.js",
1372
1375
  "default": "./dist/svg/index.js"
1373
1376
  },
1374
- "./system-map": {
1375
- "types": "./dist/system-map/index.d.ts",
1376
- "svelte": "./dist/system-map/index.js",
1377
- "default": "./dist/system-map/index.js"
1378
- },
1379
1377
  "./table": {
1380
1378
  "types": "./dist/table/index.d.ts",
1381
1379
  "svelte": "./dist/table/index.js",
@@ -1411,11 +1409,6 @@
1411
1409
  "svelte": "./dist/textarea/index.js",
1412
1410
  "default": "./dist/textarea/index.js"
1413
1411
  },
1414
- "./thumbnail": {
1415
- "types": "./dist/thumbnail/index.d.ts",
1416
- "svelte": "./dist/thumbnail/index.js",
1417
- "default": "./dist/thumbnail/index.js"
1418
- },
1419
1412
  "./time-input": {
1420
1413
  "types": "./dist/time-input/index.d.ts",
1421
1414
  "svelte": "./dist/time-input/index.js",
@@ -1498,8 +1491,11 @@
1498
1491
  },
1499
1492
  "./*/*": null,
1500
1493
  "./internal/*": null,
1494
+ "./themes/aurora.css": "./dist/themes/aurora.css",
1501
1495
  "./themes/dark.css": "./dist/themes/dark.css",
1502
- "./themes/default.css": "./dist/themes/default.css"
1496
+ "./themes/default.css": "./dist/themes/default.css",
1497
+ "./themes/midnight.css": "./dist/themes/midnight.css",
1498
+ "./themes/terminal.css": "./dist/themes/terminal.css"
1503
1499
  }
1504
1500
  },
1505
1501
  "files": [
@@ -1510,17 +1506,16 @@
1510
1506
  "build": "svelte-package -i src",
1511
1507
  "check": "svelte-check --tsconfig ./tsconfig.json",
1512
1508
  "prepack": "bun ../../scripts/prepack-exports.ts",
1513
- "postpack": "bun ../../scripts/postpack-exports.ts",
1514
- "thumbnail:create": "bun scripts/create-thumbnail.ts"
1509
+ "postpack": "bun ../../scripts/postpack-exports.ts"
1515
1510
  },
1516
1511
  "dependencies": {
1517
- "@dryui/primitives": "^0.2.0"
1512
+ "@dryui/primitives": "^0.3.0"
1518
1513
  },
1519
1514
  "peerDependencies": {
1520
1515
  "svelte": "^5.55.1"
1521
1516
  },
1522
1517
  "devDependencies": {
1523
- "svelte": "^5.55.1",
1518
+ "svelte": "^5.55.3",
1524
1519
  "@sveltejs/package": "^2.5.7",
1525
1520
  "svelte-check": "^4.4.6",
1526
1521
  "typescript": "^6.0.2"
package/skills/dryui/SKILL.md CHANGED
@@ -212,6 +212,7 @@ Read these when you need deeper guidance:
212
212
  - **`rules/accessibility.md`** — Field.Root, ARIA, focus management, pre-ship checklist
213
213
  - **`rules/svelte.md`** — Runes, snippets, native browser APIs, styling rules
214
214
  - **`rules/design.md`** — Minimal code, no premature abstraction, naming conventions
215
+ - **`rules/visual-effects-performance.md`** — Tiered budgets and implementation rules for shader, blur, glass, and pointer-reactive effects
215
216
  - **`rules/native-web-transitions.md`** — View Transition API, scroll animations, reduced-motion
216
217
 
217
218
  ---
package/dist/system-map/index.d.ts DELETED
@@ -1,17 +0,0 @@
1
- import type { HTMLAttributes } from 'svelte/elements';
2
- import type { DolphinEdgeType, DolphinGraph, DolphinLayer, DolphinNodeKind, DolphinPackage, DolphinVisibility } from './types.js';
3
- export type { DolphinCluster, DolphinEdge, DolphinEdgeType, DolphinGraph, DolphinLayer, DolphinMismatch, DolphinMismatchKind, DolphinNode, DolphinNodeKind, DolphinPackage, DolphinSignals, DolphinSummary, DolphinVisibility, SystemMapEdge, SystemMapEdgeKind, SystemMapGraph, SystemMapLayer, SystemMapNode, SystemMapNodeKind, SystemMapVisibility } from './types.js';
4
- export interface SystemMapProps extends HTMLAttributes<HTMLDivElement> {
5
- graph: DolphinGraph;
6
- focusId?: string | null;
7
- layerFilter?: readonly DolphinLayer[];
8
- kindFilter?: readonly DolphinNodeKind[];
9
- edgeFilter?: readonly DolphinEdgeType[];
10
- packageFilter?: readonly DolphinPackage[];
11
- visibilityFilter?: readonly DolphinVisibility[];
12
- categoryFilter?: readonly string[];
13
- showLegend?: boolean;
14
- showThumbnails?: boolean;
15
- showEdgeLabels?: boolean;
16
- }
17
- export { default as SystemMap } from './system-map.svelte';
package/dist/system-map/index.js DELETED
@@ -1 +0,0 @@
1
- export { default as SystemMap } from './system-map.svelte';
package/dist/system-map/system-map.svelte DELETED
@@ -1,311 +0,0 @@
1
- <script lang="ts">
2
- import { SvelteSet } from 'svelte/reactivity';
3
- import type { HTMLAttributes } from 'svelte/elements';
4
- import { Text } from '../text/index.js';
5
- import type {
6
- DolphinPackage,
7
- SystemMapEdgeKind,
8
- SystemMapGraph,
9
- SystemMapLayer,
10
- SystemMapNode,
11
- SystemMapNodeKind,
12
- SystemMapVisibility
13
- } from './types.js';
14
-
15
- interface Props extends HTMLAttributes<HTMLDivElement> {
16
- graph: SystemMapGraph;
17
- focusId?: string | null;
18
- layerFilter?: readonly SystemMapLayer[];
19
- kindFilter?: readonly SystemMapNodeKind[];
20
- edgeFilter?: readonly SystemMapEdgeKind[];
21
- packageFilter?: readonly DolphinPackage[];
22
- visibilityFilter?: readonly SystemMapVisibility[];
23
- categoryFilter?: readonly string[];
24
- showLegend?: boolean;
25
- showThumbnails?: boolean;
26
- showEdgeLabels?: boolean;
27
- }
28
-
29
- interface ViewNode {
30
- id: string;
31
- label: string;
32
- sublabel: string;
33
- helper: string;
34
- isFocused: boolean;
35
- }
36
-
37
- interface EdgeRow {
38
- id: string;
39
- source: ViewNode;
40
- target: ViewNode;
41
- label: string;
42
- }
43
-
44
- const layerOrder: SystemMapLayer[] = [
45
- 'primitive',
46
- 'ui-wrapper',
47
- 'ui-composite',
48
- 'part',
49
- 'catalog',
50
- 'cluster'
51
- ];
52
-
53
- const packageLabels: Record<DolphinPackage, string> = {
54
- primitives: 'Primitives',
55
- ui: 'UI',
56
- docs: 'Docs',
57
- audit: 'Audit'
58
- };
59
-
60
- const edgeLabels: Record<SystemMapEdgeKind, string> = {
61
- wraps: 'wraps',
62
- composes: 'composes',
63
- compound_part: 'part of',
64
- related: 'related',
65
- docs: 'docs',
66
- duplication_cluster: 'duplicates'
67
- };
68
-
69
- let {
70
- graph,
71
- focusId = null,
72
- layerFilter,
73
- kindFilter,
74
- edgeFilter,
75
- packageFilter,
76
- visibilityFilter,
77
- categoryFilter,
78
- showLegend = true,
79
- showThumbnails = true,
80
- showEdgeLabels = false,
81
- class: className,
82
- ...rest
83
- }: Props = $props();
84
-
85
- function compareStrings(left: string, right: string): number {
86
- return left.localeCompare(right, undefined, { sensitivity: 'base' });
87
- }
88
-
89
- function formatTokenLabel(value: string): string {
90
- return value
91
- .replace(/[-_]+/g, ' ')
92
- .replace(/\s+/g, ' ')
93
- .trim()
94
- .replace(/\b\w/g, (match) => match.toUpperCase());
95
- }
96
-
97
- function sublabelFor(node: SystemMapNode): string {
98
- const labels = [packageLabels[node.package], formatTokenLabel(node.kind)];
99
- if (node.visibility) labels.push(formatTokenLabel(node.visibility));
100
- return labels.join(' \u2022 ');
101
- }
102
-
103
- function helperFor(node: SystemMapNode): string {
104
- if (node.kind === 'part') return node.description || 'Public part export.';
105
- if (node.layer === 'cluster') return node.description || 'Audit cluster.';
106
- if (node.layer === 'catalog') return node.sourcePath || node.description || 'Catalog asset.';
107
- const metrics: string[] = [];
108
- if (node.parts.length > 0) metrics.push(`${node.parts.length} parts`);
109
- if (node.componentImportCount && node.componentImportCount > 0)
110
- metrics.push(`${node.componentImportCount} links`);
111
- if (metrics.length > 0) return metrics.join(' \u2022 ');
112
- return node.description || node.category || 'Public surface.';
113
- }
114
-
115
- function toViewNode(node: SystemMapNode): ViewNode {
116
- return {
117
- id: node.id,
118
- label: node.label,
119
- sublabel: sublabelFor(node),
120
- helper: helperFor(node),
121
- isFocused: focusId === node.id
122
- };
123
- }
124
-
125
- const normalizedNodes = $derived(
126
- [...graph.nodes].sort((left, right) => {
127
- const layerDelta = layerOrder.indexOf(left.layer) - layerOrder.indexOf(right.layer);
128
- if (layerDelta !== 0) return layerDelta;
129
- return compareStrings(left.label, right.label);
130
- })
131
- );
132
-
133
- const filteredNodes = $derived(
134
- (() => {
135
- const allowedLayers = layerFilter ? new Set(layerFilter) : null;
136
- const allowedKinds = kindFilter ? new Set(kindFilter) : null;
137
- const allowedPackages = packageFilter ? new Set(packageFilter) : null;
138
- const allowedVisibility = visibilityFilter ? new Set(visibilityFilter) : null;
139
- const allowedCategories = categoryFilter ? new Set(categoryFilter) : null;
140
- return normalizedNodes.filter((node) => {
141
- if (allowedLayers && !allowedLayers.has(node.layer)) return false;
142
- if (allowedKinds && !allowedKinds.has(node.kind)) return false;
143
- if (allowedPackages && !allowedPackages.has(node.package)) return false;
144
- if (allowedVisibility && (!node.visibility || !allowedVisibility.has(node.visibility)))
145
- return false;
146
- if (allowedCategories && !allowedCategories.has(node.category)) return false;
147
- return true;
148
- });
149
- })()
150
- );
151
-
152
- const filteredNodeIds = $derived(new SvelteSet(filteredNodes.map((n) => n.id)));
153
-
154
- const filteredEdges = $derived(
155
- (() => {
156
- const allowedEdges = edgeFilter ? new Set(edgeFilter) : null;
157
- return graph.edges
158
- .filter((e) => filteredNodeIds.has(e.from) && filteredNodeIds.has(e.to))
159
- .filter((e) => !allowedEdges || allowedEdges.has(e.type))
160
- .sort((a, b) => compareStrings(a.id, b.id));
161
- })()
162
- );
163
-
164
- const visibleNodeIds = $derived(
165
- (() => {
166
- if (!focusId || !filteredNodeIds.has(focusId)) return filteredNodeIds;
167
- const ids = new SvelteSet<string>([focusId]);
168
- for (const edge of filteredEdges) {
169
- if (edge.from === focusId || edge.to === focusId) {
170
- ids.add(edge.from);
171
- ids.add(edge.to);
172
- }
173
- }
174
- return ids;
175
- })()
176
- );
177
-
178
- const visibleNodes = $derived(filteredNodes.filter((n) => visibleNodeIds.has(n.id)));
179
- const visibleEdges = $derived(
180
- filteredEdges.filter((e) => visibleNodeIds.has(e.from) && visibleNodeIds.has(e.to))
181
- );
182
-
183
- const edgeRows = $derived(
184
- visibleEdges
185
- .map((edge) => {
186
- const source = visibleNodes.find((n) => n.id === edge.from);
187
- const target = visibleNodes.find((n) => n.id === edge.to);
188
- if (!source || !target) return null;
189
- return {
190
- id: edge.id,
191
- source: toViewNode(source),
192
- target: toViewNode(target),
193
- label: edgeLabels[edge.type]
194
- } satisfies EdgeRow;
195
- })
196
- .filter((row): row is EdgeRow => row !== null)
197
- );
198
-
199
- const connectedNodeIds = $derived(new Set(visibleEdges.flatMap((e) => [e.from, e.to])));
200
-
201
- const orphanNodes = $derived(
202
- visibleNodes.filter((n) => !connectedNodeIds.has(n.id)).map(toViewNode)
203
- );
204
- </script>
205
-
206
- <div data-system-map class={className} {...rest}>
207
- {#if edgeRows.length === 0 && orphanNodes.length === 0}
208
- <div data-empty>
209
- <Text as="p" color="muted">No nodes match the active filters.</Text>
210
- </div>
211
- {:else}
212
- {#each edgeRows as row (row.id)}
213
- <div data-edge-row>
214
- <div data-node data-focused={row.source.isFocused || undefined}>
215
- <Text as="p" data-node-name>{row.source.label}</Text>
216
- <Text as="p" size="xs" color="muted">{row.source.sublabel}</Text>
217
- <Text as="p" size="xs" color="muted" data-node-helper>{row.source.helper}</Text>
218
- </div>
219
-
220
- <div data-connector>
221
- <span data-connector-line></span>
222
- <Text as="span" size="xs" color="muted" data-connector-label>{row.label}</Text>
223
- <span data-connector-line></span>
224
- </div>
225
-
226
- <div data-node data-focused={row.target.isFocused || undefined}>
227
- <Text as="p" data-node-name>{row.target.label}</Text>
228
- <Text as="p" size="xs" color="muted">{row.target.sublabel}</Text>
229
- <Text as="p" size="xs" color="muted" data-node-helper>{row.target.helper}</Text>
230
- </div>
231
- </div>
232
- {/each}
233
-
234
- {#if orphanNodes.length > 0}
235
- <div data-orphans>
236
- {#each orphanNodes as node (node.id)}
237
- <div data-node data-focused={node.isFocused || undefined}>
238
- <Text as="p" data-node-name>{node.label}</Text>
239
- <Text as="p" size="xs" color="muted">{node.sublabel}</Text>
240
- <Text as="p" size="xs" color="muted" data-node-helper>{node.helper}</Text>
241
- </div>
242
- {/each}
243
- </div>
244
- {/if}
245
- {/if}
246
- </div>
247
-
248
- <style>
249
- [data-system-map] {
250
- display: grid;
251
- gap: var(--dry-space-3);
252
- color: var(--dry-color-text-strong);
253
- }
254
-
255
- [data-empty] {
256
- display: grid;
257
- place-items: center;
258
- padding: var(--dry-space-8);
259
- }
260
-
261
- [data-edge-row] {
262
- display: grid;
263
- grid-template-columns: 1fr auto 1fr;
264
- gap: var(--dry-space-3);
265
- align-items: center;
266
- }
267
-
268
- [data-node] {
269
- display: grid;
270
- gap: var(--dry-space-1);
271
- padding: var(--dry-space-3);
272
- border-radius: var(--dry-radius-lg);
273
- background: var(--dry-color-bg-raised);
274
- border: 1px solid var(--dry-color-stroke-weak);
275
- }
276
-
277
- [data-node][data-focused] {
278
- border-color: var(--dry-color-stroke-strong);
279
- }
280
-
281
- [data-node-name] {
282
- font-weight: 600;
283
- }
284
-
285
- [data-node-helper] {
286
- opacity: 0.7;
287
- }
288
-
289
- [data-connector] {
290
- display: grid;
291
- grid-template-columns: 1fr auto 1fr;
292
- gap: var(--dry-space-2);
293
- align-items: center;
294
- }
295
-
296
- [data-connector-line] {
297
- display: grid;
298
- height: 0;
299
- border-top: 1px solid var(--dry-color-stroke-weak);
300
- }
301
-
302
- [data-connector-label] {
303
- white-space: nowrap;
304
- }
305
-
306
- [data-orphans] {
307
- display: grid;
308
- grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
309
- gap: var(--dry-space-3);
310
- }
311
- </style>
package/dist/system-map/system-map.svelte.d.ts DELETED
@@ -1,25 +0,0 @@
1
- import type { HTMLAttributes } from 'svelte/elements';
2
- import type {
3
- DolphinPackage,
4
- SystemMapEdgeKind,
5
- SystemMapGraph,
6
- SystemMapLayer,
7
- SystemMapNodeKind,
8
- SystemMapVisibility
9
- } from './types.js';
10
- interface Props extends HTMLAttributes<HTMLDivElement> {
11
- graph: SystemMapGraph;
12
- focusId?: string | null;
13
- layerFilter?: readonly SystemMapLayer[];
14
- kindFilter?: readonly SystemMapNodeKind[];
15
- edgeFilter?: readonly SystemMapEdgeKind[];
16
- packageFilter?: readonly DolphinPackage[];
17
- visibilityFilter?: readonly SystemMapVisibility[];
18
- categoryFilter?: readonly string[];
19
- showLegend?: boolean;
20
- showThumbnails?: boolean;
21
- showEdgeLabels?: boolean;
22
- }
23
- declare const SystemMap: import('svelte').Component<Props, {}, ''>;
24
- type SystemMap = ReturnType<typeof SystemMap>;
25
- export default SystemMap;