@dryui/ui 0.1.11 → 0.1.13

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 (209) hide show
  1. package/dist/adjust/adjust.svelte +4 -2
  2. package/dist/alpha-slider/alpha-slider.svelte +4 -2
  3. package/dist/aspect-ratio/aspect-ratio.svelte +2 -1
  4. package/dist/aurora/aurora.svelte +12 -2
  5. package/dist/beam/beam.svelte +23 -22
  6. package/dist/chromatic-aberration/chromatic-aberration.svelte +3 -0
  7. package/dist/color-picker/color-picker-alpha-slider.svelte +2 -1
  8. package/dist/color-picker/color-picker-area.svelte +11 -5
  9. package/dist/color-picker/color-picker-swatch.svelte +6 -3
  10. package/dist/displacement/displacement.svelte +3 -0
  11. package/dist/gauge/gauge.svelte +3 -3
  12. package/dist/god-rays/god-rays.svelte +10 -0
  13. package/dist/image-comparison/image-comparison.svelte +3 -1
  14. package/dist/map/map-marker.svelte +5 -4
  15. package/dist/map/map-popup.svelte +5 -4
  16. package/dist/marquee/marquee.svelte +9 -13
  17. package/dist/progress/progress.svelte +8 -4
  18. package/dist/qr-code/qr-code.svelte +1 -1
  19. package/dist/reveal/reveal.svelte +3 -1
  20. package/dist/shader-canvas/shader-canvas.svelte +3 -2
  21. package/dist/skeleton/skeleton.svelte +8 -5
  22. package/dist/slider/slider.svelte +1 -1
  23. package/dist/splitter/splitter-root.svelte +7 -4
  24. package/dist/spotlight/spotlight.svelte +7 -0
  25. package/dist/thumbnail/accordion.svelte +2 -2
  26. package/dist/thumbnail/add-on-selector.svelte +2 -2
  27. package/dist/thumbnail/affix-group.svelte +2 -2
  28. package/dist/thumbnail/alert-dialog.svelte +2 -2
  29. package/dist/thumbnail/alert.svelte +2 -2
  30. package/dist/thumbnail/alpha-slider.svelte +2 -2
  31. package/dist/thumbnail/amenity-grid.svelte +2 -2
  32. package/dist/thumbnail/aspect-ratio.svelte +2 -2
  33. package/dist/thumbnail/aurora.svelte +2 -2
  34. package/dist/thumbnail/avatar.svelte +2 -2
  35. package/dist/thumbnail/backdrop.svelte +2 -2
  36. package/dist/thumbnail/badge.svelte +2 -2
  37. package/dist/thumbnail/booking-confirmation.svelte +2 -2
  38. package/dist/thumbnail/breadcrumb.svelte +2 -2
  39. package/dist/thumbnail/button-group.svelte +2 -2
  40. package/dist/thumbnail/button.svelte +2 -2
  41. package/dist/thumbnail/calendar.svelte +2 -2
  42. package/dist/thumbnail/card.svelte +2 -2
  43. package/dist/thumbnail/carousel.svelte +2 -2
  44. package/dist/thumbnail/chart.svelte +2 -2
  45. package/dist/thumbnail/chat-thread.svelte +2 -2
  46. package/dist/thumbnail/checkbox.svelte +2 -2
  47. package/dist/thumbnail/chip-group.svelte +2 -2
  48. package/dist/thumbnail/chip.svelte +2 -2
  49. package/dist/thumbnail/chromatic-shift.svelte +2 -2
  50. package/dist/thumbnail/clipboard.svelte +2 -2
  51. package/dist/thumbnail/code-block.svelte +2 -2
  52. package/dist/thumbnail/collapsible.svelte +2 -2
  53. package/dist/thumbnail/color-picker.svelte +2 -2
  54. package/dist/thumbnail/combobox.svelte +2 -2
  55. package/dist/thumbnail/command-palette.svelte +2 -2
  56. package/dist/thumbnail/commerce-header.svelte +2 -2
  57. package/dist/thumbnail/comparison-table.svelte +2 -2
  58. package/dist/thumbnail/container.svelte +2 -2
  59. package/dist/thumbnail/context-menu.svelte +2 -2
  60. package/dist/thumbnail/country-select.svelte +2 -2
  61. package/dist/thumbnail/currency-selector.svelte +2 -2
  62. package/dist/thumbnail/data-grid.svelte +2 -2
  63. package/dist/thumbnail/date-field.svelte +2 -2
  64. package/dist/thumbnail/date-picker.svelte +2 -2
  65. package/dist/thumbnail/date-range-picker.svelte +2 -2
  66. package/dist/thumbnail/date-time-input.svelte +2 -2
  67. package/dist/thumbnail/description-list.svelte +2 -2
  68. package/dist/thumbnail/dialog.svelte +2 -2
  69. package/dist/thumbnail/displacement.svelte +2 -2
  70. package/dist/thumbnail/drag-and-drop.svelte +2 -2
  71. package/dist/thumbnail/drawer.svelte +2 -2
  72. package/dist/thumbnail/drop-zone.svelte +2 -2
  73. package/dist/thumbnail/dropdown-menu.svelte +2 -2
  74. package/dist/thumbnail/fare-class-picker.svelte +2 -2
  75. package/dist/thumbnail/field.svelte +2 -2
  76. package/dist/thumbnail/fieldset.svelte +2 -2
  77. package/dist/thumbnail/file-select.svelte +2 -2
  78. package/dist/thumbnail/file-upload.svelte +2 -2
  79. package/dist/thumbnail/filter-sidebar.svelte +2 -2
  80. package/dist/thumbnail/flexible-dates-grid.svelte +2 -2
  81. package/dist/thumbnail/flight-timeline.svelte +2 -2
  82. package/dist/thumbnail/flip-card.svelte +2 -2
  83. package/dist/thumbnail/float-button.svelte +2 -2
  84. package/dist/thumbnail/focus-trap.svelte +2 -2
  85. package/dist/thumbnail/format-bytes.svelte +2 -2
  86. package/dist/thumbnail/format-date.svelte +2 -2
  87. package/dist/thumbnail/format-number.svelte +2 -2
  88. package/dist/thumbnail/gauge.svelte +2 -2
  89. package/dist/thumbnail/glow.svelte +2 -2
  90. package/dist/thumbnail/gradient-mesh.svelte +2 -2
  91. package/dist/thumbnail/guest-room-selector.svelte +2 -2
  92. package/dist/thumbnail/halftone.svelte +2 -2
  93. package/dist/thumbnail/heading.svelte +2 -2
  94. package/dist/thumbnail/hotel-gallery.svelte +2 -2
  95. package/dist/thumbnail/hotkey.svelte +2 -2
  96. package/dist/thumbnail/hover-card.svelte +2 -2
  97. package/dist/thumbnail/icon.svelte +2 -2
  98. package/dist/thumbnail/image-comparison.svelte +2 -2
  99. package/dist/thumbnail/image.svelte +2 -2
  100. package/dist/thumbnail/infinite-scroll.svelte +2 -2
  101. package/dist/thumbnail/input-group.svelte +2 -2
  102. package/dist/thumbnail/input.svelte +2 -2
  103. package/dist/thumbnail/itinerary-timeline.svelte +2 -2
  104. package/dist/thumbnail/kbd.svelte +2 -2
  105. package/dist/thumbnail/label.svelte +2 -2
  106. package/dist/thumbnail/layout-header-content-footer.svelte +2 -2
  107. package/dist/thumbnail/layout-header-sidebar-main.svelte +2 -2
  108. package/dist/thumbnail/layout-sidebar-main.svelte +2 -2
  109. package/dist/thumbnail/link-preview.svelte +2 -2
  110. package/dist/thumbnail/link.svelte +2 -2
  111. package/dist/thumbnail/list.svelte +2 -2
  112. package/dist/thumbnail/listbox.svelte +2 -2
  113. package/dist/thumbnail/location-autocomplete.svelte +2 -2
  114. package/dist/thumbnail/loyalty-points-display.svelte +2 -2
  115. package/dist/thumbnail/map-list-toggle.svelte +2 -2
  116. package/dist/thumbnail/map.svelte +2 -2
  117. package/dist/thumbnail/markdown-renderer.svelte +2 -2
  118. package/dist/thumbnail/marquee.svelte +2 -2
  119. package/dist/thumbnail/mask-reveal.svelte +2 -2
  120. package/dist/thumbnail/mega-menu.svelte +2 -2
  121. package/dist/thumbnail/menubar.svelte +2 -2
  122. package/dist/thumbnail/multi-city-search-form.svelte +2 -2
  123. package/dist/thumbnail/multi-select-combobox.svelte +2 -2
  124. package/dist/thumbnail/navigation-menu.svelte +2 -2
  125. package/dist/thumbnail/noise.svelte +2 -2
  126. package/dist/thumbnail/notification-center.svelte +2 -2
  127. package/dist/thumbnail/number-input.svelte +2 -2
  128. package/dist/thumbnail/option-swatch-group.svelte +2 -2
  129. package/dist/thumbnail/pagination.svelte +2 -2
  130. package/dist/thumbnail/passenger-class-selector.svelte +2 -2
  131. package/dist/thumbnail/payment-card-input.svelte +2 -2
  132. package/dist/thumbnail/phone-input.svelte +2 -2
  133. package/dist/thumbnail/pin-input.svelte +2 -2
  134. package/dist/thumbnail/popover.svelte +2 -2
  135. package/dist/thumbnail/portal.svelte +2 -2
  136. package/dist/thumbnail/price-calendar.svelte +2 -2
  137. package/dist/thumbnail/price-summary-panel.svelte +2 -2
  138. package/dist/thumbnail/progress-ring.svelte +2 -2
  139. package/dist/thumbnail/progress.svelte +2 -2
  140. package/dist/thumbnail/promo-code-input.svelte +2 -2
  141. package/dist/thumbnail/promo-mosaic.svelte +2 -2
  142. package/dist/thumbnail/prompt-input.svelte +2 -2
  143. package/dist/thumbnail/qr-code.svelte +2 -2
  144. package/dist/thumbnail/radio-group.svelte +2 -2
  145. package/dist/thumbnail/range-calendar.svelte +2 -2
  146. package/dist/thumbnail/rating.svelte +2 -2
  147. package/dist/thumbnail/recent-searches.svelte +2 -2
  148. package/dist/thumbnail/relative-time.svelte +2 -2
  149. package/dist/thumbnail/result-card-car.svelte +2 -2
  150. package/dist/thumbnail/result-card-flight.svelte +2 -2
  151. package/dist/thumbnail/result-card-hotel.svelte +2 -2
  152. package/dist/thumbnail/reveal.svelte +2 -2
  153. package/dist/thumbnail/review-card.svelte +2 -2
  154. package/dist/thumbnail/rich-text-editor.svelte +2 -2
  155. package/dist/thumbnail/room-type-picker.svelte +2 -2
  156. package/dist/thumbnail/root.svelte +2 -2
  157. package/dist/thumbnail/route-map.svelte +2 -2
  158. package/dist/thumbnail/scroll-area.svelte +2 -2
  159. package/dist/thumbnail/scroll-to-top.svelte +2 -2
  160. package/dist/thumbnail/search-form-tabs.svelte +2 -2
  161. package/dist/thumbnail/seat-map.svelte +2 -2
  162. package/dist/thumbnail/segmented-control.svelte +2 -2
  163. package/dist/thumbnail/select.svelte +2 -2
  164. package/dist/thumbnail/selectable-tile-group.svelte +2 -2
  165. package/dist/thumbnail/separator.svelte +2 -2
  166. package/dist/thumbnail/shader-canvas.svelte +2 -2
  167. package/dist/thumbnail/sidebar.svelte +2 -2
  168. package/dist/thumbnail/skeleton.svelte +2 -2
  169. package/dist/thumbnail/slider.svelte +2 -2
  170. package/dist/thumbnail/sort-bar.svelte +2 -2
  171. package/dist/thumbnail/spacer.svelte +2 -2
  172. package/dist/thumbnail/sparkline.svelte +2 -2
  173. package/dist/thumbnail/spinner.svelte +2 -2
  174. package/dist/thumbnail/splitter.svelte +2 -2
  175. package/dist/thumbnail/spotlight.svelte +2 -2
  176. package/dist/thumbnail/star-rating.svelte +2 -2
  177. package/dist/thumbnail/stepper.svelte +2 -2
  178. package/dist/thumbnail/svg.svelte +2 -2
  179. package/dist/thumbnail/system-map.svelte +2 -2
  180. package/dist/thumbnail/table-of-contents.svelte +2 -2
  181. package/dist/thumbnail/table.svelte +2 -2
  182. package/dist/thumbnail/tabs.svelte +2 -2
  183. package/dist/thumbnail/tag.svelte +2 -2
  184. package/dist/thumbnail/tags-input.svelte +2 -2
  185. package/dist/thumbnail/text.svelte +2 -2
  186. package/dist/thumbnail/textarea.svelte +2 -2
  187. package/dist/thumbnail/time-input.svelte +2 -2
  188. package/dist/thumbnail/timeline.svelte +2 -2
  189. package/dist/thumbnail/toast.svelte +2 -2
  190. package/dist/thumbnail/toggle-group.svelte +2 -2
  191. package/dist/thumbnail/toggle.svelte +2 -2
  192. package/dist/thumbnail/toolbar.svelte +2 -2
  193. package/dist/thumbnail/tooltip.svelte +2 -2
  194. package/dist/thumbnail/tour.svelte +2 -2
  195. package/dist/thumbnail/transfer.svelte +2 -2
  196. package/dist/thumbnail/tree.svelte +2 -2
  197. package/dist/thumbnail/trip-card.svelte +2 -2
  198. package/dist/thumbnail/trust-badges.svelte +2 -2
  199. package/dist/thumbnail/typing-indicator.svelte +2 -2
  200. package/dist/thumbnail/typography.svelte +2 -2
  201. package/dist/thumbnail/video-embed.svelte +2 -2
  202. package/dist/thumbnail/virtual-list.svelte +2 -2
  203. package/dist/thumbnail/visually-hidden.svelte +2 -2
  204. package/dist/toast/toast-root.svelte +1 -1
  205. package/dist/tree/tree-item-children.svelte +3 -2
  206. package/dist/video-embed/video-embed.svelte +2 -1
  207. package/dist/virtual-list/virtual-list.svelte +9 -5
  208. package/package.json +2 -2
  209. package/skills/dryui/SKILL.md +11 -3
package/dist/thumbnail/toast.svelte CHANGED
@@ -86,8 +86,8 @@
86
86
  <style>
87
87
  [data-thumbnail] {
88
88
  display: inline-grid;
89
- width: var(--thumbnail-w);
90
- height: var(--thumbnail-h);
89
+ width: var(--thumbnail-w, 80px);
90
+ height: var(--thumbnail-h, 53px);
91
91
  }
92
92
 
93
93
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/toggle-group.svelte CHANGED
@@ -57,8 +57,8 @@
57
57
  <style>
58
58
  [data-thumbnail] {
59
59
  display: inline-grid;
60
- width: var(--thumbnail-w);
61
- height: var(--thumbnail-h);
60
+ width: var(--thumbnail-w, 80px);
61
+ height: var(--thumbnail-h, 53px);
62
62
  }
63
63
 
64
64
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/toggle.svelte CHANGED
@@ -27,8 +27,8 @@
27
27
  <style>
28
28
  [data-thumbnail] {
29
29
  display: inline-grid;
30
- width: var(--thumbnail-w);
31
- height: var(--thumbnail-h);
30
+ width: var(--thumbnail-w, 80px);
31
+ height: var(--thumbnail-h, 53px);
32
32
  }
33
33
 
34
34
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/toolbar.svelte CHANGED
@@ -90,8 +90,8 @@
90
90
  <style>
91
91
  [data-thumbnail] {
92
92
  display: inline-grid;
93
- width: var(--thumbnail-w);
94
- height: var(--thumbnail-h);
93
+ width: var(--thumbnail-w, 80px);
94
+ height: var(--thumbnail-h, 53px);
95
95
  }
96
96
 
97
97
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/tooltip.svelte CHANGED
@@ -66,8 +66,8 @@
66
66
  <style>
67
67
  [data-thumbnail] {
68
68
  display: inline-grid;
69
- width: var(--thumbnail-w);
70
- height: var(--thumbnail-h);
69
+ width: var(--thumbnail-w, 80px);
70
+ height: var(--thumbnail-h, 53px);
71
71
  }
72
72
 
73
73
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/tour.svelte CHANGED
@@ -130,8 +130,8 @@
130
130
  <style>
131
131
  [data-thumbnail] {
132
132
  display: inline-grid;
133
- width: var(--thumbnail-w);
134
- height: var(--thumbnail-h);
133
+ width: var(--thumbnail-w, 80px);
134
+ height: var(--thumbnail-h, 53px);
135
135
  }
136
136
 
137
137
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/transfer.svelte CHANGED
@@ -149,8 +149,8 @@
149
149
  <style>
150
150
  [data-thumbnail] {
151
151
  display: inline-grid;
152
- width: var(--thumbnail-w);
153
- height: var(--thumbnail-h);
152
+ width: var(--thumbnail-w, 80px);
153
+ height: var(--thumbnail-h, 53px);
154
154
  }
155
155
 
156
156
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/tree.svelte CHANGED
@@ -196,8 +196,8 @@
196
196
  <style>
197
197
  [data-thumbnail] {
198
198
  display: inline-grid;
199
- width: var(--thumbnail-w);
200
- height: var(--thumbnail-h);
199
+ width: var(--thumbnail-w, 80px);
200
+ height: var(--thumbnail-h, 53px);
201
201
  }
202
202
 
203
203
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/trip-card.svelte CHANGED
@@ -118,8 +118,8 @@
118
118
  <style>
119
119
  [data-thumbnail] {
120
120
  display: inline-grid;
121
- width: var(--thumbnail-w);
122
- height: var(--thumbnail-h);
121
+ width: var(--thumbnail-w, 80px);
122
+ height: var(--thumbnail-h, 53px);
123
123
  }
124
124
 
125
125
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/trust-badges.svelte CHANGED
@@ -188,8 +188,8 @@
188
188
  <style>
189
189
  [data-thumbnail] {
190
190
  display: inline-grid;
191
- width: var(--thumbnail-w);
192
- height: var(--thumbnail-h);
191
+ width: var(--thumbnail-w, 80px);
192
+ height: var(--thumbnail-h, 53px);
193
193
  }
194
194
 
195
195
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/typing-indicator.svelte CHANGED
@@ -46,8 +46,8 @@
46
46
  <style>
47
47
  [data-thumbnail] {
48
48
  display: inline-grid;
49
- width: var(--thumbnail-w);
50
- height: var(--thumbnail-h);
49
+ width: var(--thumbnail-w, 80px);
50
+ height: var(--thumbnail-h, 53px);
51
51
  }
52
52
 
53
53
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/typography.svelte CHANGED
@@ -61,8 +61,8 @@
61
61
  <style>
62
62
  [data-thumbnail] {
63
63
  display: inline-grid;
64
- width: var(--thumbnail-w);
65
- height: var(--thumbnail-h);
64
+ width: var(--thumbnail-w, 80px);
65
+ height: var(--thumbnail-h, 53px);
66
66
  }
67
67
 
68
68
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/video-embed.svelte CHANGED
@@ -68,8 +68,8 @@
68
68
  <style>
69
69
  [data-thumbnail] {
70
70
  display: inline-grid;
71
- width: var(--thumbnail-w);
72
- height: var(--thumbnail-h);
71
+ width: var(--thumbnail-w, 80px);
72
+ height: var(--thumbnail-h, 53px);
73
73
  }
74
74
 
75
75
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/virtual-list.svelte CHANGED
@@ -159,8 +159,8 @@
159
159
  <style>
160
160
  [data-thumbnail] {
161
161
  display: inline-grid;
162
- width: var(--thumbnail-w);
163
- height: var(--thumbnail-h);
162
+ width: var(--thumbnail-w, 80px);
163
+ height: var(--thumbnail-h, 53px);
164
164
  }
165
165
 
166
166
  [data-thumbnail][data-size='sm'] {
package/dist/thumbnail/visually-hidden.svelte CHANGED
@@ -87,8 +87,8 @@
87
87
  <style>
88
88
  [data-thumbnail] {
89
89
  display: inline-grid;
90
- width: var(--thumbnail-w);
91
- height: var(--thumbnail-h);
90
+ width: var(--thumbnail-w, 80px);
91
+ height: var(--thumbnail-h, 53px);
92
92
  }
93
93
 
94
94
  [data-thumbnail][data-size='sm'] {
package/dist/toast/toast-root.svelte CHANGED
@@ -35,7 +35,7 @@
35
35
 
36
36
  function applyProgressStyles(node: HTMLElement) {
37
37
  $effect(() => {
38
- node.style.cssText = `--progress-width: ${progress}%`;
38
+ node.style.setProperty('--progress-width', `${progress}%`);
39
39
  });
40
40
  }
41
41
  </script>
package/dist/tree/tree-item-children.svelte CHANGED
@@ -16,8 +16,7 @@
16
16
  function applyStyles(node: HTMLElement) {
17
17
  $effect(() => {
18
18
  node.style.cssText = style || '';
19
- node.style.setProperty('display', 'grid');
20
- node.style.setProperty('grid-template-rows', open ? '1fr' : '0fr');
19
+ node.style.setProperty('--_rows', open ? '1fr' : '0fr');
21
20
  });
22
21
  }
23
22
  </script>
@@ -42,6 +41,8 @@
42
41
  }
43
42
 
44
43
  [data-part='children'] {
44
+ display: grid;
45
+ grid-template-rows: var(--_rows, 0fr);
45
46
  padding-left: var(--dry-tree-indent, var(--dry-space-4));
46
47
  transition: grid-template-rows var(--dry-duration-normal, 200ms) var(--dry-ease-default, ease);
47
48
  }
package/dist/video-embed/video-embed.svelte CHANGED
@@ -59,7 +59,7 @@
59
59
 
60
60
  function applyAspectRatio(node: HTMLElement) {
61
61
  $effect(() => {
62
- node.style.setProperty('aspect-ratio', aspectRatio);
62
+ node.style.setProperty('--_ratio', aspectRatio);
63
63
  });
64
64
  }
65
65
  </script>
@@ -129,6 +129,7 @@
129
129
  overflow: hidden;
130
130
  border-radius: var(--dry-video-embed-radius);
131
131
  background: var(--dry-color-fill, #0f0f0f);
132
+ aspect-ratio: var(--_ratio, 16/9);
132
133
  }
133
134
 
134
135
  [data-video-embed] [data-part='media'] {
package/dist/virtual-list/virtual-list.svelte CHANGED
@@ -146,15 +146,12 @@
146
146
  function applyContainerStyles(node: HTMLElement) {
147
147
  $effect(() => {
148
148
  node.style.cssText = style || '';
149
- node.style.setProperty('position', 'relative');
150
- node.style.setProperty('overflow-y', 'auto');
151
149
  });
152
150
  }
153
151
 
154
152
  function applyInnerStyles(node: HTMLElement) {
155
153
  $effect(() => {
156
- node.style.setProperty('height', `${totalHeight}px`);
157
- node.style.setProperty('position', 'relative');
154
+ node.style.setProperty('--_inner-height', `${totalHeight}px`);
158
155
  });
159
156
  }
160
157
 
@@ -191,7 +188,7 @@
191
188
  data-virtual-list
192
189
  {...rest}
193
190
  >
194
- <div use:applyInnerStyles>
191
+ <div data-virtual-list-inner use:applyInnerStyles>
195
192
  {#each visibleItems as entry (entry.index)}
196
193
  {@render children(entry)}
197
194
  {/each}
@@ -200,6 +197,8 @@
200
197
 
201
198
  <style>
202
199
  [data-virtual-list] {
200
+ position: relative;
201
+ overflow-y: auto;
203
202
  height: 100%;
204
203
  --dry-virtual-list-scrollbar-width: 8px;
205
204
  --dry-virtual-list-scrollbar-track: var(--dry-color-bg-raised, transparent);
@@ -232,4 +231,9 @@
232
231
  [data-virtual-list]::-webkit-scrollbar-thumb:hover {
233
232
  background: var(--dry-virtual-list-scrollbar-thumb-hover);
234
233
  }
234
+
235
+ [data-virtual-list-inner] {
236
+ position: relative;
237
+ height: var(--_inner-height, 0px);
238
+ }
235
239
  </style>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dryui/ui",
3
- "version": "0.1.11",
3
+ "version": "0.1.13",
4
4
  "author": "Rob Balfre",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -1504,7 +1504,7 @@
1504
1504
  "thumbnail:create": "bun scripts/create-thumbnail.ts"
1505
1505
  },
1506
1506
  "dependencies": {
1507
- "@dryui/primitives": "^0.1.10"
1507
+ "@dryui/primitives": "^0.1.13"
1508
1508
  },
1509
1509
  "peerDependencies": {
1510
1510
  "svelte": "^5.55.1"
package/skills/dryui/SKILL.md CHANGED
@@ -112,13 +112,20 @@ The test: search your markup for raw `<input`, `<select>`, `<dialog>`, `<button>
112
112
  - Codex: `$skill-installer install https://github.com/rob-balfre/dryui/tree/main/packages/ui/skills/dryui` then `codex mcp add dryui -- npx -y @dryui/mcp`
113
113
  - Copilot/Cursor/Windsurf: `npx degit rob-balfre/dryui/packages/ui/skills/dryui .agents/skills/dryui` + add MCP config (see https://dryui.dev/tools)
114
114
 
115
- **3. Run the install planner** — it detects your project and returns a tailored step-by-step plan:
115
+ **3. Bootstrap the project** — `init` detects your project state and applies whatever is missing:
116
116
 
117
117
  ```
118
- npx -y @dryui/cli install --toon
118
+ npx -y @dryui/cli init
119
119
  ```
120
120
 
121
- Execute each `"pending"` step. Then verify: `npx -y @dryui/cli detect --toon` — output should show `project: ready`.
121
+ **New project from scratch?** Pass a directory name to scaffold SvelteKit + DryUI in one step:
122
+
123
+ ```
124
+ npx -y @dryui/cli init my-app
125
+ cd my-app && npm run dev
126
+ ```
127
+
128
+ This works for greenfield (empty directory), brownfield (existing non-SvelteKit project), and existing SvelteKit projects. Verify: `npx -y @dryui/cli detect --toon` — output should show `project: ready`.
122
129
 
123
130
  ### Manual setup
124
131
 
@@ -160,6 +167,7 @@ Use these to look up APIs, discover components, plan setup, and validate code.
160
167
  All commands support `--toon` for token-optimized agent output and `--full` to disable truncation.
161
168
 
162
169
  ```bash
170
+ bunx @dryui/cli init [path] [--pm bun] # Bootstrap SvelteKit + DryUI project
163
171
  bunx @dryui/cli info <component> --toon # Look up component API
164
172
  bunx @dryui/cli compose "date input" --toon # Composition guidance
165
173
  bunx @dryui/cli detect [path] --toon # Check project setup