@editora/ui-core 0.1.21 → 0.1.22

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 (274) hide show
  1. package/dist/accordion.cjs.js +3 -3
  2. package/dist/accordion.esm.js +3 -3
  3. package/dist/alert-dialog.cjs.js +32 -32
  4. package/dist/alert-dialog.esm.js +95 -75
  5. package/dist/alert.cjs.js +6 -6
  6. package/dist/alert.esm.js +6 -6
  7. package/dist/animated-list.cjs.js +4 -4
  8. package/dist/animated-list.esm.js +4 -4
  9. package/dist/animated-text.cjs.js +4 -4
  10. package/dist/animated-text.esm.js +4 -4
  11. package/dist/app-header.cjs.js +3 -3
  12. package/dist/app-header.esm.js +3 -3
  13. package/dist/aspect-ratio.cjs.js +3 -3
  14. package/dist/aspect-ratio.esm.js +3 -3
  15. package/dist/avatar.cjs.js +14 -14
  16. package/dist/avatar.esm.js +31 -29
  17. package/dist/badge.cjs.js +4 -4
  18. package/dist/badge.esm.js +4 -4
  19. package/dist/block-controls.cjs.js +4 -4
  20. package/dist/block-controls.esm.js +4 -4
  21. package/dist/box.cjs.js +2 -2
  22. package/dist/box.esm.js +2 -2
  23. package/dist/breadcrumb.cjs.js +5 -5
  24. package/dist/breadcrumb.esm.js +5 -5
  25. package/dist/button.cjs.js +1 -1
  26. package/dist/button.esm.js +1 -1
  27. package/dist/{calendar-DLY4acgn.mjs → calendar-DbxYRdlv.mjs} +227 -183
  28. package/dist/{calendar-Dkof-FTK.js → calendar-Qa-cFOp3.js} +74 -35
  29. package/dist/calendar.cjs.js +1 -1
  30. package/dist/calendar.esm.js +1 -1
  31. package/dist/card.cjs.js +8 -8
  32. package/dist/card.esm.js +63 -20
  33. package/dist/chart.cjs.js +4 -4
  34. package/dist/chart.esm.js +6 -6
  35. package/dist/checkbox.cjs.js +2 -2
  36. package/dist/checkbox.esm.js +2 -2
  37. package/dist/collapsible.cjs.js +7 -7
  38. package/dist/collapsible.esm.js +7 -7
  39. package/dist/color-picker.cjs.js +30 -10
  40. package/dist/color-picker.esm.js +82 -60
  41. package/dist/combobox.cjs.js +29 -27
  42. package/dist/combobox.esm.js +51 -45
  43. package/dist/command.cjs.js +2 -2
  44. package/dist/command.esm.js +2 -2
  45. package/dist/components/ui-alert-dialog.d.ts +1 -0
  46. package/dist/components/ui-alert-dialog.d.ts.map +1 -1
  47. package/dist/components/ui-avatar.d.ts +1 -0
  48. package/dist/components/ui-avatar.d.ts.map +1 -1
  49. package/dist/components/ui-button.d.ts +1 -0
  50. package/dist/components/ui-button.d.ts.map +1 -1
  51. package/dist/components/ui-calendar.d.ts.map +1 -1
  52. package/dist/components/ui-card.d.ts +3 -0
  53. package/dist/components/ui-card.d.ts.map +1 -1
  54. package/dist/components/ui-checkbox.d.ts.map +1 -1
  55. package/dist/components/ui-color-picker.d.ts.map +1 -1
  56. package/dist/components/ui-combobox.d.ts.map +1 -1
  57. package/dist/components/ui-data-table.d.ts.map +1 -1
  58. package/dist/components/ui-date-field.d.ts.map +1 -1
  59. package/dist/components/ui-date-picker.d.ts.map +1 -1
  60. package/dist/components/ui-date-range-picker.d.ts.map +1 -1
  61. package/dist/components/ui-date-range-time-picker.d.ts.map +1 -1
  62. package/dist/components/ui-date-time-picker.d.ts.map +1 -1
  63. package/dist/components/ui-dock.d.ts +1 -0
  64. package/dist/components/ui-dock.d.ts.map +1 -1
  65. package/dist/components/ui-drawer.d.ts.map +1 -1
  66. package/dist/components/ui-dropdown.d.ts.map +1 -1
  67. package/dist/components/ui-field.d.ts.map +1 -1
  68. package/dist/components/ui-file-upload.d.ts.map +1 -1
  69. package/dist/components/ui-gantt.d.ts.map +1 -1
  70. package/dist/components/ui-input.d.ts.map +1 -1
  71. package/dist/components/ui-menu.d.ts.map +1 -1
  72. package/dist/components/ui-multi-select.d.ts.map +1 -1
  73. package/dist/components/ui-number-field.d.ts.map +1 -1
  74. package/dist/components/ui-password-field.d.ts.map +1 -1
  75. package/dist/components/ui-pin-input.d.ts +1 -0
  76. package/dist/components/ui-pin-input.d.ts.map +1 -1
  77. package/dist/components/ui-placement-grid.d.ts.map +1 -1
  78. package/dist/components/ui-progress.d.ts.map +1 -1
  79. package/dist/components/ui-radio.d.ts.map +1 -1
  80. package/dist/components/ui-rating.d.ts +1 -0
  81. package/dist/components/ui-rating.d.ts.map +1 -1
  82. package/dist/components/ui-select.d.ts.map +1 -1
  83. package/dist/components/ui-sortable.d.ts.map +1 -1
  84. package/dist/components/ui-switch.d.ts.map +1 -1
  85. package/dist/components/ui-table.d.ts.map +1 -1
  86. package/dist/components/ui-tabs.d.ts +1 -0
  87. package/dist/components/ui-tabs.d.ts.map +1 -1
  88. package/dist/components/ui-tags-input.d.ts +1 -0
  89. package/dist/components/ui-tags-input.d.ts.map +1 -1
  90. package/dist/components/ui-textarea.d.ts.map +1 -1
  91. package/dist/components/ui-time-field.d.ts.map +1 -1
  92. package/dist/components/ui-toggle-group.d.ts.map +1 -1
  93. package/dist/components/ui-toggle.d.ts.map +1 -1
  94. package/dist/components/ui-tree.d.ts.map +1 -1
  95. package/dist/components/ui-wizard.d.ts.map +1 -1
  96. package/dist/context-menu.cjs.js +3 -3
  97. package/dist/context-menu.esm.js +4 -4
  98. package/dist/control-name-BmoI1m3a.js +1 -0
  99. package/dist/control-name-Bpj7F34X.mjs +48 -0
  100. package/dist/data-table.cjs.js +5 -2
  101. package/dist/data-table.esm.js +145 -142
  102. package/dist/date-field.cjs.js +5 -5
  103. package/dist/date-field.esm.js +34 -31
  104. package/dist/date-picker.cjs.js +16 -16
  105. package/dist/date-picker.esm.js +48 -44
  106. package/dist/date-range-picker.cjs.js +5 -5
  107. package/dist/date-range-picker.esm.js +120 -118
  108. package/dist/date-range-time-picker.cjs.js +22 -22
  109. package/dist/date-range-time-picker.esm.js +88 -84
  110. package/dist/date-time-picker.cjs.js +23 -23
  111. package/dist/date-time-picker.esm.js +102 -98
  112. package/dist/{date-time-utils-Dmost5Ee.js → date-time-utils-BzfTpeU-.js} +1 -1
  113. package/dist/{date-time-utils-y1N2gvG2.mjs → date-time-utils-Cps2aSu2.mjs} +1 -1
  114. package/dist/description.cjs.js +3 -3
  115. package/dist/description.esm.js +3 -3
  116. package/dist/dialog.cjs.js +2 -2
  117. package/dist/dialog.esm.js +2 -2
  118. package/dist/dock.cjs.js +12 -12
  119. package/dist/dock.esm.js +72 -74
  120. package/dist/drawer.cjs.js +19 -19
  121. package/dist/drawer.esm.js +58 -58
  122. package/dist/dropdown.cjs.js +13 -13
  123. package/dist/dropdown.esm.js +49 -48
  124. package/dist/empty-state.cjs.js +3 -3
  125. package/dist/empty-state.esm.js +3 -3
  126. package/dist/field-error.cjs.js +1 -1
  127. package/dist/field-error.esm.js +1 -1
  128. package/dist/field.cjs.js +12 -12
  129. package/dist/field.esm.js +84 -75
  130. package/dist/fieldset.cjs.js +4 -4
  131. package/dist/fieldset.esm.js +4 -4
  132. package/dist/file-upload.cjs.js +3 -3
  133. package/dist/file-upload.esm.js +5 -3
  134. package/dist/floating-toolbar.cjs.js +8 -8
  135. package/dist/floating-toolbar.esm.js +9 -9
  136. package/dist/form.cjs.js +11 -11
  137. package/dist/form.esm.js +11 -11
  138. package/dist/gantt.cjs.js +43 -32
  139. package/dist/gantt.esm.js +99 -88
  140. package/dist/icon-cloud.cjs.js +3 -3
  141. package/dist/icon-cloud.esm.js +3 -3
  142. package/dist/icon.cjs.js +1 -1
  143. package/dist/icon.esm.js +1 -1
  144. package/dist/index.cjs.js +1 -1
  145. package/dist/index.esm.js +121 -118
  146. package/dist/inline-edit.cjs.js +1 -1
  147. package/dist/inline-edit.esm.js +1 -1
  148. package/dist/input.cjs.js +14 -14
  149. package/dist/input.esm.js +39 -32
  150. package/dist/label.cjs.js +3 -3
  151. package/dist/label.esm.js +3 -3
  152. package/dist/{listbox-B6QgECax.js → listbox-CTpRpuF7.js} +1 -1
  153. package/dist/{listbox-DJamVeFj.mjs → listbox-hMVOhKHC.mjs} +1 -1
  154. package/dist/listbox.cjs.js +1 -1
  155. package/dist/listbox.esm.js +1 -1
  156. package/dist/marquee.cjs.js +3 -3
  157. package/dist/marquee.esm.js +3 -3
  158. package/dist/{menu-item-styles-CbNUEwP2.js → menu-item-styles-B4onAr4C.js} +3 -3
  159. package/dist/{menu-item-styles-CZiPwPwl.mjs → menu-item-styles-IGSFLAHu.mjs} +3 -3
  160. package/dist/menu.cjs.js +7 -7
  161. package/dist/menu.esm.js +29 -28
  162. package/dist/menubar.cjs.js +1 -1
  163. package/dist/menubar.esm.js +2 -2
  164. package/dist/meter.cjs.js +1 -1
  165. package/dist/meter.esm.js +1 -1
  166. package/dist/multi-select.cjs.js +17 -17
  167. package/dist/multi-select.esm.js +51 -43
  168. package/dist/navigation-menu.cjs.js +1 -1
  169. package/dist/navigation-menu.esm.js +1 -1
  170. package/dist/number-field.cjs.js +11 -13
  171. package/dist/number-field.esm.js +29 -27
  172. package/dist/number-ticker.cjs.js +4 -4
  173. package/dist/number-ticker.esm.js +4 -4
  174. package/dist/odometer.cjs.js +2 -2
  175. package/dist/odometer.esm.js +2 -2
  176. package/dist/orbiter.cjs.js +3 -3
  177. package/dist/orbiter.esm.js +3 -3
  178. package/dist/pagination.cjs.js +1 -1
  179. package/dist/pagination.esm.js +1 -1
  180. package/dist/password-field.cjs.js +23 -23
  181. package/dist/password-field.esm.js +48 -47
  182. package/dist/pin-input.cjs.js +8 -6
  183. package/dist/pin-input.esm.js +21 -15
  184. package/dist/placement-grid.cjs.js +4 -4
  185. package/dist/placement-grid.esm.js +58 -58
  186. package/dist/plugin-panel.cjs.js +1 -1
  187. package/dist/plugin-panel.esm.js +1 -1
  188. package/dist/popover.cjs.js +5 -5
  189. package/dist/popover.esm.js +4 -4
  190. package/dist/primitives/control-name.d.ts +30 -0
  191. package/dist/primitives/control-name.d.ts.map +1 -0
  192. package/dist/primitives/trigger.d.ts +2 -0
  193. package/dist/primitives/trigger.d.ts.map +1 -0
  194. package/dist/progress.cjs.js +4 -4
  195. package/dist/progress.esm.js +20 -18
  196. package/dist/quick-actions.cjs.js +3 -3
  197. package/dist/quick-actions.esm.js +3 -3
  198. package/dist/radio-group.cjs.js +1 -1
  199. package/dist/radio-group.esm.js +1 -1
  200. package/dist/radio.cjs.js +2 -2
  201. package/dist/radio.esm.js +2 -2
  202. package/dist/rating.cjs.js +17 -16
  203. package/dist/rating.esm.js +91 -92
  204. package/dist/{runtime-D1gFh1fS.mjs → runtime-CFnK53iC.mjs} +133 -94
  205. package/dist/runtime-DwE-tizc.js +1 -0
  206. package/dist/runtime.cjs.js +1 -1
  207. package/dist/runtime.d.ts +1 -1
  208. package/dist/runtime.d.ts.map +1 -1
  209. package/dist/runtime.esm.js +29 -26
  210. package/dist/select.cjs.js +20 -19
  211. package/dist/select.esm.js +36 -32
  212. package/dist/selection-popup.cjs.js +2 -2
  213. package/dist/selection-popup.esm.js +2 -2
  214. package/dist/separator.cjs.js +7 -7
  215. package/dist/separator.esm.js +7 -7
  216. package/dist/sidebar.cjs.js +7 -7
  217. package/dist/sidebar.esm.js +7 -7
  218. package/dist/skeleton.cjs.js +7 -7
  219. package/dist/skeleton.esm.js +7 -7
  220. package/dist/slider.cjs.js +3 -3
  221. package/dist/slider.esm.js +3 -3
  222. package/dist/slot.cjs.js +3 -3
  223. package/dist/slot.esm.js +3 -3
  224. package/dist/sortable.cjs.js +41 -42
  225. package/dist/sortable.esm.js +98 -99
  226. package/dist/spinning-text.cjs.js +3 -3
  227. package/dist/spinning-text.esm.js +3 -3
  228. package/dist/split-button.cjs.js +1 -1
  229. package/dist/split-button.esm.js +1 -1
  230. package/dist/stepper.cjs.js +1 -1
  231. package/dist/stepper.esm.js +1 -1
  232. package/dist/switch.cjs.js +10 -12
  233. package/dist/switch.esm.js +10 -12
  234. package/dist/table.cjs.js +9 -6
  235. package/dist/table.esm.js +46 -43
  236. package/dist/tabs.cjs.js +20 -21
  237. package/dist/tabs.esm.js +70 -66
  238. package/dist/tags-input.cjs.js +9 -9
  239. package/dist/tags-input.esm.js +32 -25
  240. package/dist/textarea.cjs.js +10 -10
  241. package/dist/textarea.esm.js +30 -21
  242. package/dist/theme.d.ts +18 -0
  243. package/dist/theme.d.ts.map +1 -1
  244. package/dist/time-field.cjs.js +5 -5
  245. package/dist/time-field.esm.js +21 -18
  246. package/dist/time-picker.cjs.js +4 -4
  247. package/dist/time-picker.esm.js +5 -5
  248. package/dist/timeline.cjs.js +2 -2
  249. package/dist/timeline.esm.js +4 -4
  250. package/dist/toast.cjs.js +6 -6
  251. package/dist/toast.esm.js +13 -13
  252. package/dist/toggle-group.cjs.js +5 -6
  253. package/dist/toggle-group.esm.js +63 -60
  254. package/dist/toggle.cjs.js +18 -18
  255. package/dist/toggle.esm.js +32 -31
  256. package/dist/tooltip.cjs.js +4 -4
  257. package/dist/tooltip.esm.js +4 -4
  258. package/dist/transfer-list.cjs.js +3 -3
  259. package/dist/transfer-list.esm.js +3 -3
  260. package/dist/tree-7qbVnpGp.js +39 -0
  261. package/dist/{tree-B3kE8ESs.mjs → tree-Deoft-kO.mjs} +34 -33
  262. package/dist/tree.cjs.js +1 -1
  263. package/dist/tree.esm.js +1 -1
  264. package/dist/trigger-BjnxLCeQ.mjs +9 -0
  265. package/dist/trigger-DkPsKxsP.js +1 -0
  266. package/dist/{ui-button-rXQOS9QJ.js → ui-button-BInsgSbr.js} +27 -26
  267. package/dist/{ui-button-Q0GNNWKC.mjs → ui-button-rfiuUnUD.mjs} +65 -48
  268. package/dist/{ui-icon-YI6lyuqU.mjs → ui-icon-BSi_GtqO.mjs} +2 -2
  269. package/dist/{ui-icon-BzVNC_lr.js → ui-icon-Bvt9oIIR.js} +5 -5
  270. package/dist/wizard.cjs.js +12 -13
  271. package/dist/wizard.esm.js +17 -15
  272. package/package.json +1 -1
  273. package/dist/runtime-CTaOSmBj.js +0 -1
  274. package/dist/tree-Dx_kv_ih.js +0 -39
@@ -1,14 +1,14 @@
1
- import { E as g } from "./ElementBase-YlTLMsGk.mjs";
2
- const u = `
1
+ import { E as l } from "./ElementBase-YlTLMsGk.mjs";
2
+ const g = `
3
3
  :host {
4
4
  --ui-toggle-radius: 10px;
5
5
  --ui-toggle-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 74%, transparent);
6
6
  --ui-toggle-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 96%, transparent);
7
7
  --ui-toggle-color: var(--ui-color-text, #0f172a);
8
8
  --ui-toggle-active-bg: var(--ui-color-primary, #2563eb);
9
- --ui-toggle-active-color: var(--ui-color-primary-foreground, #ffffff);
9
+ --ui-toggle-active-color: var(--ui-color-primary-foreground, var(--ui-color-foreground-on-primary, #ffffff));
10
10
  --ui-toggle-active-border: color-mix(in srgb, var(--ui-toggle-active-bg) 72%, #0f172a 28%);
11
- --ui-toggle-muted: var(--ui-color-muted, #64748b);
11
+ --ui-toggle-muted: var(--ui-color-muted, #526175);
12
12
  --ui-toggle-focus: var(--ui-color-focus-ring, #2563eb);
13
13
  --ui-toggle-shadow:
14
14
  none;
@@ -67,7 +67,7 @@ const u = `
67
67
 
68
68
  :host([pressed]) .control,
69
69
  .control[aria-pressed="true"] {
70
- background: color-mix(in srgb, var(--ui-toggle-active-bg) 88%, #ffffff 12%);
70
+ background: var(--ui-toggle-active-bg);
71
71
  border-color: var(--ui-toggle-active-border);
72
72
  color: var(--ui-toggle-active-color);
73
73
  }
@@ -161,17 +161,22 @@ const u = `
161
161
  }
162
162
 
163
163
  :host([tone="success"]) {
164
- --ui-toggle-active-bg: var(--ui-color-success, #16a34a);
164
+ --ui-toggle-active-bg: var(--ui-color-success, #15803d);
165
165
  }
166
166
 
167
167
  :host([tone="warning"]) {
168
- --ui-toggle-active-bg: var(--ui-color-warning, #d97706);
168
+ --ui-toggle-active-bg: var(--ui-color-warning, #b45309);
169
169
  }
170
170
 
171
171
  :host([tone="danger"]) {
172
172
  --ui-toggle-active-bg: var(--ui-color-danger, #dc2626);
173
173
  }
174
174
 
175
+ /* The contrast variant draws dark text on its pressed fill, so the tones need light fills there. */
176
+ :host([variant="contrast"][tone="success"]) { --ui-toggle-active-bg: #86efac; }
177
+ :host([variant="contrast"][tone="warning"]) { --ui-toggle-active-bg: #fcd34d; }
178
+ :host([variant="contrast"][tone="danger"]) { --ui-toggle-active-bg: #fca5a5; }
179
+
175
180
  :host([disabled]) .control,
176
181
  :host([loading]) .control {
177
182
  opacity: 0.56;
@@ -219,7 +224,7 @@ const u = `
219
224
  --ui-toggle-shadow: none;
220
225
  }
221
226
  }
222
- `, l = /* @__PURE__ */ new Set(["icon-on", "icon-off", "aria-label"]);
227
+ `, a = /* @__PURE__ */ new Set(["icon-on", "icon-off", "aria-label"]);
223
228
  function c(o) {
224
229
  if (o == null) return !1;
225
230
  const e = String(o).toLowerCase();
@@ -228,7 +233,7 @@ function c(o) {
228
233
  function n(o) {
229
234
  return String(o).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
230
235
  }
231
- class d extends g {
236
+ class u extends l {
232
237
  constructor() {
233
238
  super(), this._control = null, this._onClick = this._onClick.bind(this), this._onKeyDown = this._onKeyDown.bind(this);
234
239
  }
@@ -260,7 +265,7 @@ class d extends g {
260
265
  }
261
266
  attributeChangedCallback(e, t, i) {
262
267
  if (t !== i) {
263
- if (l.has(e)) {
268
+ if (a.has(e)) {
264
269
  super.attributeChangedCallback(e, t, i);
265
270
  return;
266
271
  }
@@ -296,16 +301,16 @@ class d extends g {
296
301
  this.dispatchEvent(new CustomEvent("input", { detail: i, bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent("change", { detail: i, bubbles: !0, composed: !0 }));
297
302
  }
298
303
  _syncAria() {
299
- const e = this.pressed, t = this.disabled, i = this.hasAttribute("loading"), s = this.hasAttribute("data-group-item");
300
- s ? this.hasAttribute("aria-pressed") && this.removeAttribute("aria-pressed") : (this.setAttribute("role", "button"), this.setAttribute("aria-pressed", e ? "true" : "false")), this.setAttribute("aria-disabled", t ? "true" : "false"), this.setAttribute("aria-busy", i ? "true" : "false");
304
+ const e = this.pressed, t = this.disabled, i = this.hasAttribute("loading");
305
+ this.hasAttribute("data-group-item") ? this.hasAttribute("aria-pressed") && this.removeAttribute("aria-pressed") : (this.setAttribute("role", "button"), this.setAttribute("aria-pressed", e ? "true" : "false")), this.setAttribute("aria-disabled", t ? "true" : "false"), this.setAttribute("aria-busy", i ? "true" : "false");
301
306
  const r = this.getAttribute("tabindex");
302
307
  if (t)
303
308
  this.hasAttribute("data-ui-prev-tabindex") || this.setAttribute("data-ui-prev-tabindex", r ?? ""), r !== "-1" && this.setAttribute("tabindex", "-1");
304
309
  else {
305
- const a = this.getAttribute("data-ui-prev-tabindex");
306
- a != null ? (a ? this.setAttribute("tabindex", a) : this.removeAttribute("tabindex"), this.removeAttribute("data-ui-prev-tabindex")) : r == null && this.setAttribute("tabindex", "0");
310
+ const s = this.getAttribute("data-ui-prev-tabindex");
311
+ s != null ? (s ? this.setAttribute("tabindex", s) : this.removeAttribute("tabindex"), this.removeAttribute("data-ui-prev-tabindex")) : r == null && this.setAttribute("tabindex", "0");
307
312
  }
308
- this._control && (this._control.disabled = t, s ? this._control.removeAttribute("aria-pressed") : this._control.setAttribute("aria-pressed", e ? "true" : "false"), this._control.setAttribute("aria-disabled", t ? "true" : "false"), this._control.setAttribute("aria-busy", i ? "true" : "false"));
313
+ this._control && this._control.toggleAttribute("data-disabled", t);
309
314
  }
310
315
  _onClick(e) {
311
316
  const t = e.target;
@@ -315,30 +320,26 @@ class d extends g {
315
320
  this.disabled || (e.key === " " || e.key === "Enter") && (e.preventDefault(), this.toggle());
316
321
  }
317
322
  render() {
318
- const e = this.pressed, t = this.disabled, i = this.getAttribute("icon-on") || "●", s = this.getAttribute("icon-off") || "○", r = this.getAttribute("aria-label") || "Toggle";
319
- this.setContent(`
320
- <style>${u}</style>
321
- <button
322
- type="button"
323
+ this.pressed;
324
+ const e = this.disabled, t = this.getAttribute("icon-on") || "●", i = this.getAttribute("icon-off") || "○";
325
+ this.getAttribute("aria-label"), this.setContent(`
326
+ <style>${g}</style>
327
+ <span
323
328
  class="control"
324
329
  part="control"
325
- aria-label="${n(r)}"
326
- aria-pressed="${e ? "true" : "false"}"
327
- aria-disabled="${t ? "true" : "false"}"
328
- tabindex="-1"
329
- ${t ? "disabled" : ""}
330
+ ${e ? "data-disabled" : ""}
330
331
  >
331
- <span class="icon icon-off" part="icon-off" aria-hidden="true">${n(s)}</span>
332
- <span class="icon icon-on" part="icon-on" aria-hidden="true">${n(i)}</span>
332
+ <span class="icon icon-off" part="icon-off" aria-hidden="true">${n(i)}</span>
333
+ <span class="icon icon-on" part="icon-on" aria-hidden="true">${n(t)}</span>
333
334
  <span class="label" part="label"><slot></slot></span>
334
- </button>
335
+ </span>
335
336
  `), this._control = this.root.querySelector(".control"), this._syncAria();
336
337
  }
337
338
  shouldRenderOnAttributeChange(e, t, i) {
338
- return l.has(e);
339
+ return a.has(e);
339
340
  }
340
341
  }
341
- typeof customElements < "u" && !customElements.get("ui-toggle") && customElements.define("ui-toggle", d);
342
+ typeof customElements < "u" && !customElements.get("ui-toggle") && customElements.define("ui-toggle", u);
342
343
  export {
343
- d as UIToggle
344
+ u as UIToggle
344
345
  };
@@ -77,13 +77,13 @@
77
77
  }
78
78
 
79
79
  .tooltip[data-tone="success"] {
80
- --ui-tooltip-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 84%, #052e16 16%);
81
- --ui-tooltip-border: color-mix(in srgb, var(--ui-color-success, #16a34a) 42%, transparent);
80
+ --ui-tooltip-bg: color-mix(in srgb, var(--ui-color-success, #15803d) 84%, #052e16 16%);
81
+ --ui-tooltip-border: color-mix(in srgb, var(--ui-color-success, #15803d) 42%, transparent);
82
82
  }
83
83
 
84
84
  .tooltip[data-tone="warning"] {
85
- --ui-tooltip-bg: color-mix(in srgb, var(--ui-color-warning, #d97706) 84%, #451a03 16%);
86
- --ui-tooltip-border: color-mix(in srgb, var(--ui-color-warning, #d97706) 42%, transparent);
85
+ --ui-tooltip-bg: color-mix(in srgb, var(--ui-color-warning, #b45309) 84%, #451a03 16%);
86
+ --ui-tooltip-border: color-mix(in srgb, var(--ui-color-warning, #b45309) 42%, transparent);
87
87
  }
88
88
 
89
89
  .tooltip[data-tone="danger"] {
@@ -79,13 +79,13 @@ const d = 140, w = 120, m = `
79
79
  }
80
80
 
81
81
  .tooltip[data-tone="success"] {
82
- --ui-tooltip-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 84%, #052e16 16%);
83
- --ui-tooltip-border: color-mix(in srgb, var(--ui-color-success, #16a34a) 42%, transparent);
82
+ --ui-tooltip-bg: color-mix(in srgb, var(--ui-color-success, #15803d) 84%, #052e16 16%);
83
+ --ui-tooltip-border: color-mix(in srgb, var(--ui-color-success, #15803d) 42%, transparent);
84
84
  }
85
85
 
86
86
  .tooltip[data-tone="warning"] {
87
- --ui-tooltip-bg: color-mix(in srgb, var(--ui-color-warning, #d97706) 84%, #451a03 16%);
88
- --ui-tooltip-border: color-mix(in srgb, var(--ui-color-warning, #d97706) 42%, transparent);
87
+ --ui-tooltip-bg: color-mix(in srgb, var(--ui-color-warning, #b45309) 84%, #451a03 16%);
88
+ --ui-tooltip-border: color-mix(in srgb, var(--ui-color-warning, #b45309) 42%, transparent);
89
89
  }
90
90
 
91
91
  .tooltip[data-tone="danger"] {
@@ -2,7 +2,7 @@
2
2
  :host {
3
3
  --ui-transfer-accent: var(--ui-color-primary, #2563eb);
4
4
  --ui-transfer-text: var(--ui-color-text, #0f172a);
5
- --ui-transfer-muted: var(--ui-color-muted, #64748b);
5
+ --ui-transfer-muted: var(--ui-color-muted, #526175);
6
6
  --ui-transfer-shell-bg: transparent;
7
7
  --ui-transfer-shell-border-color: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 84%, transparent);
8
8
  --ui-transfer-shell-border: 1px solid var(--ui-transfer-shell-border-color);
@@ -193,11 +193,11 @@
193
193
  }
194
194
 
195
195
  :host([tone="success"]) {
196
- --ui-transfer-accent: var(--ui-color-success, #16a34a);
196
+ --ui-transfer-accent: var(--ui-color-success, #15803d);
197
197
  }
198
198
 
199
199
  :host([tone="warning"]) {
200
- --ui-transfer-accent: var(--ui-color-warning, #d97706);
200
+ --ui-transfer-accent: var(--ui-color-warning, #b45309);
201
201
  }
202
202
 
203
203
  :host([tone="danger"]) {
@@ -3,7 +3,7 @@ const q = `
3
3
  :host {
4
4
  --ui-transfer-accent: var(--ui-color-primary, #2563eb);
5
5
  --ui-transfer-text: var(--ui-color-text, #0f172a);
6
- --ui-transfer-muted: var(--ui-color-muted, #64748b);
6
+ --ui-transfer-muted: var(--ui-color-muted, #526175);
7
7
  --ui-transfer-shell-bg: transparent;
8
8
  --ui-transfer-shell-border-color: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 84%, transparent);
9
9
  --ui-transfer-shell-border: 1px solid var(--ui-transfer-shell-border-color);
@@ -194,11 +194,11 @@ const q = `
194
194
  }
195
195
 
196
196
  :host([tone="success"]) {
197
- --ui-transfer-accent: var(--ui-color-success, #16a34a);
197
+ --ui-transfer-accent: var(--ui-color-success, #15803d);
198
198
  }
199
199
 
200
200
  :host([tone="warning"]) {
201
- --ui-transfer-accent: var(--ui-color-warning, #d97706);
201
+ --ui-transfer-accent: var(--ui-color-warning, #b45309);
202
202
  }
203
203
 
204
204
  :host([tone="danger"]) {
@@ -0,0 +1,39 @@
1
+ "use strict";const v=require("./ElementBase-EV6mVBUV.js"),p=require("./collection-qv8A8rq4.js"),f=require("./tree-item.cjs.js");function x(l,t){const e=[],i=t.getExpanded||(()=>!1),r=t.getDisabled||(()=>!1),s=(d,n,o)=>{d.forEach(a=>{const u=t.getChildren(a)||[],c={item:a,id:t.getId(a),label:t.getLabel(a),level:n,parentId:o,disabled:r(a),expanded:i(a),hasChildren:u.length>0};e.push(c),s(u,n+1,c.id)})};return s(l,1,null),e}function g(l,t){const e=[],i=t.getExpanded||(()=>!1),r=t.getDisabled||(()=>!1),s=(d,n,o)=>{d.forEach(a=>{const u=t.getChildren(a)||[],c=i(a),h={item:a,id:t.getId(a),label:t.getLabel(a),level:n,parentId:o,disabled:r(a),expanded:c,hasChildren:u.length>0};e.push(h),h.hasChildren&&c&&s(u,n+1,h.id)})};return s(l,1,null),e}function b(l,t){return l.findIndex(e=>e.id===t)}function _(l,t){const e=l[t];return e?.parentId?l.findIndex(i=>i.id===e.parentId):-1}function y(l,t,e=-1){const i=p.normalizeCollectionText(t);if(!i)return-1;for(let r=1;r<=l.length;r+=1){const s=(e+r+l.length)%l.length,d=l[s];if(!d.disabled&&p.normalizeCollectionText(d.label).startsWith(i))return s}return-1}const T=`
2
+ :host {
3
+ --ui-tree-indent: 16px;
4
+ --ui-tree-radius: 14px;
5
+ --ui-tree-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 98%, transparent);
6
+ --ui-tree-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 72%, transparent);
7
+ --ui-tree-text: var(--ui-color-text, #0f172a);
8
+ --ui-tree-muted: var(--ui-color-muted, #526175);
9
+ display: block;
10
+ min-inline-size: 0;
11
+ color-scheme: light dark;
12
+ font-family: "Inter", "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
13
+ }
14
+
15
+ .tree {
16
+ min-inline-size: 0;
17
+ display: grid;
18
+ gap: 4px;
19
+ padding: 10px;
20
+ border: 1px solid var(--ui-tree-border);
21
+ border-radius: var(--ui-tree-radius);
22
+ background: var(--ui-tree-bg);
23
+ color: var(--ui-tree-text);
24
+ }
25
+
26
+ @media (forced-colors: active) {
27
+ .tree {
28
+ forced-color-adjust: none;
29
+ background: Canvas;
30
+ color: CanvasText;
31
+ border-color: CanvasText;
32
+ }
33
+ }
34
+ `;class m extends v.ElementBase{constructor(){super(),this._observer=null,this._focusedValue=null,this._typeaheadBuffer="",this._typeaheadTimer=null,this._onClick=this._onClick.bind(this),this._onKeyDown=this._onKeyDown.bind(this),this._onMutation=this._onMutation.bind(this)}static get observedAttributes(){return["value","indent-size","aria-label","aria-labelledby"]}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this._onClick),this.addEventListener("keydown",this._onKeyDown),this._observer=new MutationObserver(this._onMutation),this._observer.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["expanded","selected","disabled","label","value"]}),queueMicrotask(()=>this._syncTree())}disconnectedCallback(){this.removeEventListener("click",this._onClick),this.removeEventListener("keydown",this._onKeyDown),this._observer?.disconnect(),this._observer=null,this._typeaheadTimer!=null&&window.clearTimeout(this._typeaheadTimer),super.disconnectedCallback()}get value(){return this.getAttribute("value")||""}set value(t){t?this.setAttribute("value",t):this.removeAttribute("value")}expand(t){const e=this._findByValue(t);!e||e.childItems.length===0||(e.setAttribute("expanded",""),this._emitToggle(e,!0),this._syncTree())}collapse(t){const e=this._findByValue(t);!e||e.childItems.length===0||(e.removeAttribute("expanded"),this._emitToggle(e,!1),this._syncTree())}toggle(t){const e=this._findByValue(t);if(!e||e.childItems.length===0)return;const i=!e.hasAttribute("expanded");e.toggleAttribute("expanded",i),this._emitToggle(e,i),this._syncTree()}select(t){const e=this._findByValue(t);!e||e.hasAttribute("disabled")||(this.value=t,this._focusedValue=t,this._emitSelect(e),this._syncTree())}focusValue(t){const e=this._findByValue(t);e&&(this._focusedValue=t,this._syncTree(),e.focusRow({preventScroll:!0}))}_onMutation(){this._syncTree()}_allItems(){return Array.from(this.querySelectorAll("ui-tree-item")).filter(t=>t instanceof f.UITreeItem&&t.closest("ui-tree")===this)}_rootItems(){return Array.from(this.children).filter(t=>t instanceof f.UITreeItem)}_visibleRecords(){const t=this._rootItems();return g(t,{getId:e=>e.value,getLabel:e=>e.label,getChildren:e=>e.childItems,getExpanded:e=>e.hasAttribute("expanded"),getDisabled:e=>e.hasAttribute("disabled")}).map(e=>({...e,item:e.item}))}_findByValue(t){return this._allItems().find(e=>e.value===t)||null}_syncTree(){const t=this._allItems(),e=this._visibleRecords(),i=this.value||e.find(n=>!n.disabled)?.id||"",r=this._focusedValue&&e.some(n=>n.id===this._focusedValue)?this._focusedValue:i;this._focusedValue=r||null;const s=new Set(e.map(n=>n.id)),d=new Map(e.map(n=>[n.id,n]));t.forEach(n=>{const o=d.get(n.value);n.style.setProperty("--ui-tree-indent",this.getAttribute("indent-size")||"16px"),n.applyTreeState({level:o?.level||1,hasChildren:n.childItems.length>0,expanded:n.hasAttribute("expanded"),selected:n.value===i,active:n.value===r,hidden:!s.has(n.value)})})}_moveFocus(t){const e=this._visibleRecords();if(!e.length)return;const i=b(e,this._focusedValue||this.value||""),r=i>=0?i:-1;for(let s=1;s<=e.length;s+=1){const d=(r+t*s+e.length)%e.length,n=e[d];if(!n.disabled){this.focusValue(n.id);return}}}_emitSelect(t){this.dispatchEvent(new CustomEvent("select",{detail:{value:t.value,label:t.label},bubbles:!0,composed:!0}))}_emitToggle(t,e){this.dispatchEvent(new CustomEvent("expanded-change",{detail:{value:t.value,expanded:e},bubbles:!0,composed:!0}))}_onClick(t){const e=t.composedPath(),i=e.find(s=>s instanceof f.UITreeItem);if(!i||i.hasAttribute("disabled"))return;const r=e.find(s=>s instanceof HTMLElement&&s.getAttribute("data-action")==="toggle");if(this._focusedValue=i.value,r&&i.childItems.length>0){this.toggle(i.value);return}this.select(i.value)}_onKeyDown(t){const e=this._visibleRecords();if(!e.length)return;const i=b(e,this._focusedValue||this.value||""),r=i>=0?e[i]:e[0];if(r){if(t.key==="ArrowDown"){t.preventDefault(),this._moveFocus(1);return}if(t.key==="ArrowUp"){t.preventDefault(),this._moveFocus(-1);return}if(t.key==="Home"){t.preventDefault(),this.focusValue(e[0].id);return}if(t.key==="End"){t.preventDefault(),this.focusValue(e[e.length-1].id);return}if(t.key==="ArrowRight"){if(t.preventDefault(),r.hasChildren&&!r.expanded){this.expand(r.id);return}if(r.hasChildren&&r.expanded){const s=e[i+1];s?.parentId===r.id&&this.focusValue(s.id)}return}if(t.key==="ArrowLeft"){if(t.preventDefault(),r.hasChildren&&r.expanded){this.collapse(r.id);return}const s=_(e,i);s>=0&&this.focusValue(e[s].id);return}if(t.key==="Enter"||t.key===" "){t.preventDefault(),this.select(r.id);return}if(t.key.length===1&&/\S/.test(t.key)){this._typeaheadBuffer=`${this._typeaheadBuffer}${t.key.toLowerCase()}`.slice(0,24),this._typeaheadTimer!=null&&window.clearTimeout(this._typeaheadTimer),this._typeaheadTimer=window.setTimeout(()=>{this._typeaheadBuffer="",this._typeaheadTimer=null},420);const s=y(e,this._typeaheadBuffer,i);s>=0&&(t.preventDefault(),this.focusValue(e[s].id))}}}shouldRenderOnAttributeChange(t){return t==="indent-size"||t==="aria-label"||t==="aria-labelledby"}render(){const t=(this.getAttribute("aria-label")||"").trim(),e=(this.getAttribute("aria-labelledby")||"").trim(),i=s=>s.replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/</g,"&lt;"),r=(t?` aria-label="${i(t)}"`:"")+(e?` aria-labelledby="${i(e)}"`:"");this.setContent(`
35
+ <style>${T}</style>
36
+ <div class="tree" part="tree" role="tree"${r}>
37
+ <slot></slot>
38
+ </div>
39
+ `),queueMicrotask(()=>this._syncTree())}}typeof customElements<"u"&&!customElements.get("ui-tree")&&customElements.define("ui-tree",m);exports.UITree=m;exports.findParentTreeRecordIndex=_;exports.findTreeRecordIndexById=b;exports.findTreeTypeaheadMatch=y;exports.flattenTree=x;exports.flattenVisibleTree=g;
@@ -1,54 +1,54 @@
1
1
  import { E as g } from "./ElementBase-YlTLMsGk.mjs";
2
2
  import { n as b } from "./collection-C7URGjEI.mjs";
3
3
  import { UITreeItem as f } from "./tree-item.esm.js";
4
- function C(l, t) {
4
+ function C(a, t) {
5
5
  const e = [], i = t.getExpanded || (() => !1), r = t.getDisabled || (() => !1), s = (d, n, o) => {
6
- d.forEach((a) => {
7
- const u = t.getChildren(a) || [], c = {
8
- item: a,
9
- id: t.getId(a),
10
- label: t.getLabel(a),
6
+ d.forEach((l) => {
7
+ const u = t.getChildren(l) || [], c = {
8
+ item: l,
9
+ id: t.getId(l),
10
+ label: t.getLabel(l),
11
11
  level: n,
12
12
  parentId: o,
13
- disabled: r(a),
14
- expanded: i(a),
13
+ disabled: r(l),
14
+ expanded: i(l),
15
15
  hasChildren: u.length > 0
16
16
  };
17
17
  e.push(c), s(u, n + 1, c.id);
18
18
  });
19
19
  };
20
- return s(l, 1, null), e;
20
+ return s(a, 1, null), e;
21
21
  }
22
- function _(l, t) {
22
+ function _(a, t) {
23
23
  const e = [], i = t.getExpanded || (() => !1), r = t.getDisabled || (() => !1), s = (d, n, o) => {
24
- d.forEach((a) => {
25
- const u = t.getChildren(a) || [], c = i(a), h = {
26
- item: a,
27
- id: t.getId(a),
28
- label: t.getLabel(a),
24
+ d.forEach((l) => {
25
+ const u = t.getChildren(l) || [], c = i(l), h = {
26
+ item: l,
27
+ id: t.getId(l),
28
+ label: t.getLabel(l),
29
29
  level: n,
30
30
  parentId: o,
31
- disabled: r(a),
31
+ disabled: r(l),
32
32
  expanded: c,
33
33
  hasChildren: u.length > 0
34
34
  };
35
35
  e.push(h), h.hasChildren && c && s(u, n + 1, h.id);
36
36
  });
37
37
  };
38
- return s(l, 1, null), e;
38
+ return s(a, 1, null), e;
39
39
  }
40
- function p(l, t) {
41
- return l.findIndex((e) => e.id === t);
40
+ function p(a, t) {
41
+ return a.findIndex((e) => e.id === t);
42
42
  }
43
- function m(l, t) {
44
- const e = l[t];
45
- return e?.parentId ? l.findIndex((i) => i.id === e.parentId) : -1;
43
+ function y(a, t) {
44
+ const e = a[t];
45
+ return e?.parentId ? a.findIndex((i) => i.id === e.parentId) : -1;
46
46
  }
47
- function y(l, t, e = -1) {
47
+ function m(a, t, e = -1) {
48
48
  const i = b(t);
49
49
  if (!i) return -1;
50
- for (let r = 1; r <= l.length; r += 1) {
51
- const s = (e + r + l.length) % l.length, d = l[s];
50
+ for (let r = 1; r <= a.length; r += 1) {
51
+ const s = (e + r + a.length) % a.length, d = a[s];
52
52
  if (!d.disabled && b(d.label).startsWith(i))
53
53
  return s;
54
54
  }
@@ -61,7 +61,7 @@ const v = `
61
61
  --ui-tree-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 98%, transparent);
62
62
  --ui-tree-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 72%, transparent);
63
63
  --ui-tree-text: var(--ui-color-text, #0f172a);
64
- --ui-tree-muted: var(--ui-color-muted, #64748b);
64
+ --ui-tree-muted: var(--ui-color-muted, #526175);
65
65
  display: block;
66
66
  min-inline-size: 0;
67
67
  color-scheme: light dark;
@@ -93,7 +93,7 @@ class x extends g {
93
93
  super(), this._observer = null, this._focusedValue = null, this._typeaheadBuffer = "", this._typeaheadTimer = null, this._onClick = this._onClick.bind(this), this._onKeyDown = this._onKeyDown.bind(this), this._onMutation = this._onMutation.bind(this);
94
94
  }
95
95
  static get observedAttributes() {
96
- return ["value", "indent-size"];
96
+ return ["value", "indent-size", "aria-label", "aria-labelledby"];
97
97
  }
98
98
  connectedCallback() {
99
99
  super.connectedCallback(), this.addEventListener("click", this._onClick), this.addEventListener("keydown", this._onKeyDown), this._observer = new MutationObserver(this._onMutation), this._observer.observe(this, { childList: !0, subtree: !0, attributes: !0, attributeFilter: ["expanded", "selected", "disabled", "label", "value"] }), queueMicrotask(() => this._syncTree());
@@ -247,7 +247,7 @@ class x extends g {
247
247
  this.collapse(r.id);
248
248
  return;
249
249
  }
250
- const s = m(e, i);
250
+ const s = y(e, i);
251
251
  s >= 0 && this.focusValue(e[s].id);
252
252
  return;
253
253
  }
@@ -259,18 +259,19 @@ class x extends g {
259
259
  this._typeaheadBuffer = `${this._typeaheadBuffer}${t.key.toLowerCase()}`.slice(0, 24), this._typeaheadTimer != null && window.clearTimeout(this._typeaheadTimer), this._typeaheadTimer = window.setTimeout(() => {
260
260
  this._typeaheadBuffer = "", this._typeaheadTimer = null;
261
261
  }, 420);
262
- const s = y(e, this._typeaheadBuffer, i);
262
+ const s = m(e, this._typeaheadBuffer, i);
263
263
  s >= 0 && (t.preventDefault(), this.focusValue(e[s].id));
264
264
  }
265
265
  }
266
266
  }
267
267
  shouldRenderOnAttributeChange(t) {
268
- return t === "indent-size";
268
+ return t === "indent-size" || t === "aria-label" || t === "aria-labelledby";
269
269
  }
270
270
  render() {
271
+ const t = (this.getAttribute("aria-label") || "").trim(), e = (this.getAttribute("aria-labelledby") || "").trim(), i = (s) => s.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;"), r = (t ? ` aria-label="${i(t)}"` : "") + (e ? ` aria-labelledby="${i(e)}"` : "");
271
272
  this.setContent(`
272
273
  <style>${v}</style>
273
- <div class="tree" part="tree" role="tree">
274
+ <div class="tree" part="tree" role="tree"${r}>
274
275
  <slot></slot>
275
276
  </div>
276
277
  `), queueMicrotask(() => this._syncTree());
@@ -280,8 +281,8 @@ typeof customElements < "u" && !customElements.get("ui-tree") && customElements.
280
281
  export {
281
282
  x as U,
282
283
  p as a,
283
- y as b,
284
+ m as b,
284
285
  C as c,
285
286
  _ as d,
286
- m as f
287
+ y as f
287
288
  };
package/dist/tree.cjs.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./tree-Dx_kv_ih.js");exports.UITree=e.UITree;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./tree-7qbVnpGp.js");exports.UITree=e.UITree;
package/dist/tree.esm.js CHANGED
@@ -1,4 +1,4 @@
1
- import { U as o } from "./tree-B3kE8ESs.mjs";
1
+ import { U as o } from "./tree-Deoft-kO.mjs";
2
2
  export {
3
3
  o as UITree
4
4
  };
@@ -0,0 +1,9 @@
1
+ const n = 'button, a[href], input, select, textarea, summary, [role="button"], [tabindex]:not([tabindex="-1"]), ui-button';
2
+ function o(t) {
3
+ if (t.matches(n)) return t;
4
+ const e = t.querySelector(n);
5
+ return e || (t.hasAttribute("role") || t.setAttribute("role", "button"), t.hasAttribute("tabindex") || t.setAttribute("tabindex", "0"), t);
6
+ }
7
+ export {
8
+ o as r
9
+ };
@@ -0,0 +1 @@
1
+ "use strict";const n='button, a[href], input, select, textarea, summary, [role="button"], [tabindex]:not([tabindex="-1"]), ui-button';function o(t){if(t.matches(n))return t;const e=t.querySelector(n);return e||(t.hasAttribute("role")||t.setAttribute("role","button"),t.hasAttribute("tabindex")||t.setAttribute("tabindex","0"),t)}exports.resolveTriggerControl=o;
@@ -1,4 +1,4 @@
1
- "use strict";const D=require("./ElementBase-EV6mVBUV.js");require("./ui-icon-BzVNC_lr.js");const F=`
1
+ "use strict";const P=require("./ElementBase-EV6mVBUV.js");require("./ui-icon-Bvt9oIIR.js");const I=`
2
2
  :host {
3
3
  --ui-btn-radius: var(--ui-control-radius, var(--ui-radius, 4px));
4
4
  --ui-btn-min-height: var(--ui-control-min-height, var(--base-button-height-md, 40px));
@@ -17,7 +17,7 @@
17
17
  --ui-btn-surface: var(--ui-color-surface, #ffffff);
18
18
  --ui-btn-surface-alt: var(--ui-color-surface-alt, #f8fafc);
19
19
  --ui-btn-text: var(--ui-color-text, #0f172a);
20
- --ui-btn-muted: var(--ui-color-muted, #64748b);
20
+ --ui-btn-muted: var(--ui-color-muted, #526175);
21
21
  --ui-btn-ring: var(--ui-color-focus-ring, #2563eb);
22
22
 
23
23
  display: inline-flex;
@@ -33,7 +33,7 @@
33
33
  }
34
34
 
35
35
  :host([tone="neutral"]) {
36
- --ui-btn-accent: color-mix(in srgb, var(--ui-color-muted, #64748b) 74%, var(--ui-color-text, #0f172a) 26%);
36
+ --ui-btn-accent: color-mix(in srgb, var(--ui-color-muted, #526175) 74%, var(--ui-color-text, #0f172a) 26%);
37
37
  }
38
38
 
39
39
  :host([tone="info"]) {
@@ -41,11 +41,11 @@
41
41
  }
42
42
 
43
43
  :host([tone="success"]) {
44
- --ui-btn-accent: var(--ui-color-success, #16a34a);
44
+ --ui-btn-accent: var(--ui-color-success, #15803d);
45
45
  }
46
46
 
47
47
  :host([tone="warning"]) {
48
- --ui-btn-accent: var(--ui-color-warning, #d97706);
48
+ --ui-btn-accent: var(--ui-color-warning, #b45309);
49
49
  }
50
50
 
51
51
  :host([tone="danger"]) {
@@ -57,7 +57,7 @@
57
57
  }
58
58
 
59
59
  :host([state="success"]) {
60
- --ui-btn-accent: var(--ui-color-success, #16a34a);
60
+ --ui-btn-accent: var(--ui-color-success, #15803d);
61
61
  }
62
62
 
63
63
  :host([theme="dark"]) {
@@ -85,8 +85,8 @@
85
85
  }
86
86
 
87
87
  :host([recipe="soft"]) {
88
- --ui-btn-surface: color-mix(in srgb, var(--ui-btn-accent) 10%, white);
89
- --ui-btn-surface-alt: color-mix(in srgb, var(--ui-btn-accent) 14%, white);
88
+ --ui-btn-surface: color-mix(in srgb, var(--ui-btn-accent) 10%, var(--ui-color-surface, #ffffff));
89
+ --ui-btn-surface-alt: color-mix(in srgb, var(--ui-btn-accent) 14%, var(--ui-color-surface, #ffffff));
90
90
  }
91
91
 
92
92
  :host([recipe="soft"]) .btn--secondary {
@@ -229,7 +229,8 @@
229
229
 
230
230
  .btn--primary {
231
231
  background: var(--ui-btn-accent);
232
- color: #ffffff;
232
+ /* The theme's text colour for a primary fill: the default theme's amber needs dark text. */
233
+ color: var(--ui-color-foreground-on-primary, #ffffff);
233
234
  border-color: color-mix(in srgb, var(--ui-btn-accent) 74%, #0f172a 26%);
234
235
  box-shadow: 0 1px 2px rgba(2, 6, 23, 0.12), 0 8px 18px color-mix(in srgb, var(--ui-btn-accent) 22%, transparent);
235
236
  }
@@ -240,7 +241,7 @@
240
241
 
241
242
  .btn--secondary {
242
243
  background: var(--ui-btn-surface);
243
- color: color-mix(in srgb, var(--ui-btn-accent) 78%, var(--ui-btn-text) 22%);
244
+ color: color-mix(in srgb, var(--ui-btn-accent) 50%, var(--ui-btn-text) 50%);
244
245
  border-color: color-mix(in srgb, var(--ui-btn-accent) 22%, var(--ui-btn-muted));
245
246
  box-shadow: 0 1px 2px rgba(2, 6, 23, 0.06);
246
247
  }
@@ -251,7 +252,7 @@
251
252
 
252
253
  .btn--ghost {
253
254
  background: transparent;
254
- color: color-mix(in srgb, var(--ui-btn-accent) 80%, var(--ui-btn-text) 20%);
255
+ color: color-mix(in srgb, var(--ui-btn-accent) 50%, var(--ui-btn-text) 50%);
255
256
  border-color: transparent;
256
257
  box-shadow: none;
257
258
  }
@@ -272,25 +273,25 @@
272
273
  }
273
274
 
274
275
  .btn--success {
275
- background: var(--ui-color-success, #16a34a);
276
+ background: var(--ui-color-success, #15803d);
276
277
  color: #ffffff;
277
- border-color: color-mix(in srgb, var(--ui-color-success, #16a34a) 70%, #0f172a 30%);
278
- box-shadow: 0 1px 2px rgba(2, 6, 23, 0.12), 0 8px 18px color-mix(in srgb, var(--ui-color-success, #16a34a) 20%, transparent);
278
+ border-color: color-mix(in srgb, var(--ui-color-success, #15803d) 70%, #0f172a 30%);
279
+ box-shadow: 0 1px 2px rgba(2, 6, 23, 0.12), 0 8px 18px color-mix(in srgb, var(--ui-color-success, #15803d) 20%, transparent);
279
280
  }
280
281
 
281
282
  .btn--success:hover:not([disabled]) {
282
- background: color-mix(in srgb, var(--ui-color-success, #16a34a) 86%, #0f172a 14%);
283
+ background: color-mix(in srgb, var(--ui-color-success, #15803d) 86%, #0f172a 14%);
283
284
  }
284
285
 
285
286
  .btn--warning {
286
- background: var(--ui-color-warning, #d97706);
287
+ background: var(--ui-color-warning, #b45309);
287
288
  color: #ffffff;
288
- border-color: color-mix(in srgb, var(--ui-color-warning, #d97706) 70%, #0f172a 30%);
289
- box-shadow: 0 1px 2px rgba(2, 6, 23, 0.12), 0 8px 18px color-mix(in srgb, var(--ui-color-warning, #d97706) 18%, transparent);
289
+ border-color: color-mix(in srgb, var(--ui-color-warning, #b45309) 70%, #0f172a 30%);
290
+ box-shadow: 0 1px 2px rgba(2, 6, 23, 0.12), 0 8px 18px color-mix(in srgb, var(--ui-color-warning, #b45309) 18%, transparent);
290
291
  }
291
292
 
292
293
  .btn--warning:hover:not([disabled]) {
293
- background: color-mix(in srgb, var(--ui-color-warning, #d97706) 86%, #0f172a 14%);
294
+ background: color-mix(in srgb, var(--ui-color-warning, #b45309) 86%, #0f172a 14%);
294
295
  }
295
296
 
296
297
  :host([size="sm"]) {
@@ -318,7 +319,7 @@
318
319
  }
319
320
 
320
321
  :host([state="success"]) .btn:not([disabled]) {
321
- box-shadow: 0 0 0 1px color-mix(in srgb, var(--ui-color-success, #16a34a) 30%, transparent), 0 8px 18px rgba(22, 163, 74, 0.14);
322
+ box-shadow: 0 0 0 1px color-mix(in srgb, var(--ui-color-success, #15803d) 30%, transparent), 0 8px 18px rgba(22, 163, 74, 0.14);
322
323
  }
323
324
 
324
325
  :host([data-animation]) .btn:not([disabled]):hover {
@@ -501,21 +502,21 @@
501
502
  color: HighlightText;
502
503
  }
503
504
  }
504
- `;function _(t){return t!==null&&t.toLowerCase()!=="false"&&t!=="0"}function I(t){return t==="secondary"||t==="ghost"||t==="danger"||t==="success"||t==="warning"?t:"primary"}function U(t){return t==="sm"||t==="lg"?t:"md"}function S(t){return t==="scale"||t==="pulse"||t==="none"?t:null}function N(t){return t==="neutral"||t==="info"||t==="success"||t==="warning"||t==="danger"?t:null}function G(t){return t==="loading"||t==="error"||t==="success"?t:"idle"}function $(t){return t==="submit"||t==="reset"?t:"button"}function J(t){return t==="classic"||t==="solid"||t==="soft"||t==="surface"||t==="outline"||t==="ghost"?t:null}function K(t){return t==="none"||t==="sm"||t==="md"||t==="lg"||t==="full"?t:null}function Q(t){return t==="1"||t==="2"||t==="3"||t==="4"?t:null}function V(t){if(!t)return null;const n=t.trim();return n?n==="full"?"999px":/^-?\d+(\.\d+)?$/.test(n)?`${n}px`:n:null}function r(t,n){const e=t.getAttribute(n);if(e!=null)return e;const i=t[n];return typeof i=="string"&&i.length>0?i:null}function c(t,n){const e=t.getAttribute(n);if(e!=null)return _(e);const i=t[n];return typeof i=="boolean"?i:typeof i=="string"?_(i):!1}function u(t){return t.replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}function L(t,n){return!!t.querySelector(`[slot="${n}"]`)}function W(t,n){if(n==="button")return;const e=t.closest("form");if(!e)return;if(n==="reset"){e.reset();return}if(typeof e.requestSubmit=="function"){e.requestSubmit();return}const i=new Event("submit",{bubbles:!0,cancelable:!0});e.dispatchEvent(i)}class E extends D.ElementBase{constructor(){super(),this._slots=[],this._contentObserver=null,this._onRootClick=this._onRootClick.bind(this),this._onSlotChange=this._onSlotChange.bind(this),this._onContentMutations=this._onContentMutations.bind(this)}static get observedAttributes(){return["disabled","variant","size","headless","loading","icon","block","animation","theme","tone","state","type","recipe","shape","radius","scale","loading-label","aria-label"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("click",this._onRootClick),this._contentObserver=new MutationObserver(this._onContentMutations),this._contentObserver.observe(this,{childList:!0,subtree:!1,characterData:!0})}disconnectedCallback(){this.root.removeEventListener("click",this._onRootClick),this._contentObserver?.disconnect(),this._contentObserver=null,this._detachSlotListeners(),super.disconnectedCallback()}attributeChangedCallback(n,e,i){if(e!==i){if(n==="animation"){const o=S(i);o?this.setAttribute("data-animation",o):this.removeAttribute("data-animation")}this.isConnected&&this.requestRender()}}_onRootClick(n){const i=n.target?.closest('button[data-ui-button="true"]');if(!i||i.disabled)return;const o=$(i.getAttribute("data-request-type"));queueMicrotask(()=>{n.defaultPrevented||W(this,o)})}_attachSlotListeners(){this._detachSlotListeners(),this._slots=Array.from(this.root.querySelectorAll("slot")),this._slots.forEach(n=>n.addEventListener("slotchange",this._onSlotChange))}_detachSlotListeners(){this._slots.forEach(n=>n.removeEventListener("slotchange",this._onSlotChange)),this._slots=[]}_onSlotChange(){this.requestRender()}_onContentMutations(){this.requestRender()}render(){const n=c(this,"disabled"),e=c(this,"loading"),i=r(this,"state"),o=G(i),s=e||o==="loading",l=r(this,"icon"),q=I(r(this,"variant")),b=r(this,"size"),d=U(b),h=S(r(this,"animation")),a=r(this,"theme"),p=a==="dark"||a==="brand"?a:null,f=r(this,"tone"),g=N(f),R=c(this,"block"),T=c(this,"headless"),M=$(r(this,"type")),m=J(r(this,"recipe")),x=r(this,"shape"),v=K(x),B=r(this,"radius"),y=V(B),w=Q(r(this,"scale")),k=r(this,"aria-label"),j=r(this,"loading-label")||"Loading";h?this.setAttribute("data-animation",h):this.removeAttribute("data-animation"),R?this.setAttribute("block",""):this.removeAttribute("block"),T?this.setAttribute("headless",""):this.removeAttribute("headless"),f!=null&&(g?this.setAttribute("tone",g):this.removeAttribute("tone")),b!=null&&(d==="md"?this.removeAttribute("size"):this.setAttribute("size",d)),a!=null&&(p?this.setAttribute("theme",p):this.removeAttribute("theme")),i!=null&&(o==="idle"?this.removeAttribute("state"):this.setAttribute("state",o)),m?this.setAttribute("recipe",m):this.removeAttribute("recipe"),x!=null&&(v?this.setAttribute("shape",v):this.removeAttribute("shape")),y?this.style.setProperty("--ui-btn-radius",y):this.style.removeProperty("--ui-btn-radius"),w?this.setAttribute("scale",w):this.removeAttribute("scale");const z=n||s;z?this.setAttribute("aria-disabled","true"):this.removeAttribute("aria-disabled"),s?this.setAttribute("aria-busy","true"):this.removeAttribute("aria-busy");const H=L(this,"prefix"),O=L(this,"suffix"),A=!s&&l?`<ui-icon class="icon" name="${u(l)}" aria-hidden="true"></ui-icon>`:"",C=s?'<span class="spinner" aria-hidden="true" part="spinner"></span>':"",Y=C||A||H?`<span class="slot slot--prefix" part="prefix">${C}${A}${s?"":'<slot name="prefix"></slot>'}</span>`:"",P=O?'<span class="slot slot--suffix" part="suffix"><slot name="suffix"></slot></span>':"";this.setContent(`
505
- <style>${F}</style>
505
+ `;function S(t){return t!==null&&t.toLowerCase()!=="false"&&t!=="0"}function U(t){return t==="secondary"||t==="ghost"||t==="danger"||t==="success"||t==="warning"?t:"primary"}function N(t){return t==="sm"||t==="lg"?t:"md"}function C(t){return t==="scale"||t==="pulse"||t==="none"?t:null}function W(t){return t==="neutral"||t==="info"||t==="success"||t==="warning"||t==="danger"?t:null}function G(t){return t==="loading"||t==="error"||t==="success"?t:"idle"}function $(t){return t==="submit"||t==="reset"?t:"button"}function J(t){return t==="classic"||t==="solid"||t==="soft"||t==="surface"||t==="outline"||t==="ghost"?t:null}function K(t){return t==="none"||t==="sm"||t==="md"||t==="lg"||t==="full"?t:null}function Q(t){return t==="1"||t==="2"||t==="3"||t==="4"?t:null}function V(t){if(!t)return null;const n=t.trim();return n?n==="full"?"999px":/^-?\d+(\.\d+)?$/.test(n)?`${n}px`:n:null}function r(t,n){const e=t.getAttribute(n);if(e!=null)return e;const i=t[n];return typeof i=="string"&&i.length>0?i:null}function c(t,n){const e=t.getAttribute(n);if(e!=null)return S(e);const i=t[n];return typeof i=="boolean"?i:typeof i=="string"?S(i):!1}function u(t){return t.replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}function E(t,n){return!!t.querySelector(`[slot="${n}"]`)}function X(t,n){if(n==="button")return;const e=t.closest("form");if(!e)return;if(n==="reset"){e.reset();return}if(typeof e.requestSubmit=="function"){e.requestSubmit();return}const i=new Event("submit",{bubbles:!0,cancelable:!0});e.dispatchEvent(i)}const T=["aria-expanded","aria-haspopup","aria-pressed"];class L extends P.ElementBase{constructor(){super(),this._slots=[],this._contentObserver=null,this._onRootClick=this._onRootClick.bind(this),this._onSlotChange=this._onSlotChange.bind(this),this._onContentMutations=this._onContentMutations.bind(this)}static get observedAttributes(){return["disabled","variant","size","headless","loading","icon","block","animation","theme","tone","state","type","recipe","shape","radius","scale","loading-label","aria-label","aria-expanded","aria-haspopup","aria-pressed"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("click",this._onRootClick),this._contentObserver=new MutationObserver(this._onContentMutations),this._contentObserver.observe(this,{childList:!0,subtree:!1,characterData:!0})}disconnectedCallback(){this.root.removeEventListener("click",this._onRootClick),this._contentObserver?.disconnect(),this._contentObserver=null,this._detachSlotListeners(),super.disconnectedCallback()}attributeChangedCallback(n,e,i){if(e!==i){if(n==="animation"){const o=C(i);o?this.setAttribute("data-animation",o):this.removeAttribute("data-animation")}if(T.includes(n)){this._syncForwardedState();return}this.isConnected&&this.requestRender()}}_syncForwardedState(){const n=this.root.querySelector('button[data-ui-button="true"]');if(n)for(const e of T){const i=this.getAttribute(e);i==null||i===""?n.removeAttribute(e):n.getAttribute(e)!==i&&n.setAttribute(e,i)}}_onRootClick(n){const i=n.target?.closest('button[data-ui-button="true"]');if(!i||i.disabled)return;const o=$(i.getAttribute("data-request-type"));queueMicrotask(()=>{n.defaultPrevented||X(this,o)})}_attachSlotListeners(){this._detachSlotListeners(),this._slots=Array.from(this.root.querySelectorAll("slot")),this._slots.forEach(n=>n.addEventListener("slotchange",this._onSlotChange))}_detachSlotListeners(){this._slots.forEach(n=>n.removeEventListener("slotchange",this._onSlotChange)),this._slots=[]}_onSlotChange(){this.requestRender()}_onContentMutations(){this.requestRender()}render(){const n=c(this,"disabled"),e=c(this,"loading"),i=r(this,"state"),o=G(i),s=e||o==="loading",l=r(this,"icon"),q=U(r(this,"variant")),b=r(this,"size"),d=N(b),h=C(r(this,"animation")),a=r(this,"theme"),p=a==="dark"||a==="brand"?a:null,f=r(this,"tone"),g=W(f),R=c(this,"block"),M=c(this,"headless"),B=$(r(this,"type")),m=J(r(this,"recipe")),x=r(this,"shape"),v=K(x),O=r(this,"radius"),y=V(O),w=Q(r(this,"scale")),k=r(this,"aria-label"),j=r(this,"loading-label")||"Loading";h?this.setAttribute("data-animation",h):this.removeAttribute("data-animation"),R?this.setAttribute("block",""):this.removeAttribute("block"),M?this.setAttribute("headless",""):this.removeAttribute("headless"),f!=null&&(g?this.setAttribute("tone",g):this.removeAttribute("tone")),b!=null&&(d==="md"?this.removeAttribute("size"):this.setAttribute("size",d)),a!=null&&(p?this.setAttribute("theme",p):this.removeAttribute("theme")),i!=null&&(o==="idle"?this.removeAttribute("state"):this.setAttribute("state",o)),m?this.setAttribute("recipe",m):this.removeAttribute("recipe"),x!=null&&(v?this.setAttribute("shape",v):this.removeAttribute("shape")),y?this.style.setProperty("--ui-btn-radius",y):this.style.removeProperty("--ui-btn-radius"),w?this.setAttribute("scale",w):this.removeAttribute("scale");const A=n||s;A?this.setAttribute("aria-disabled","true"):this.removeAttribute("aria-disabled"),s?this.setAttribute("aria-busy","true"):this.removeAttribute("aria-busy");const F=E(this,"prefix"),H=E(this,"suffix"),z=!s&&l?`<ui-icon class="icon" name="${u(l)}" aria-hidden="true"></ui-icon>`:"",_=s?'<span class="spinner" aria-hidden="true" part="spinner"></span>':"",Y=_||z||F?`<span class="slot slot--prefix" part="prefix">${_}${z}${s?"":'<slot name="prefix"></slot>'}</span>`:"",D=H?'<span class="slot slot--suffix" part="suffix"><slot name="suffix"></slot></span>':"";this.setContent(`
506
+ <style>${I}</style>
506
507
  <button
507
508
  class="btn btn--${q}"
508
509
  part="button"
509
510
  type="button"
510
511
  data-ui-button="true"
511
- data-request-type="${M}"
512
+ data-request-type="${B}"
512
513
  aria-busy="${s?"true":"false"}"
513
514
  ${k?`aria-label="${u(k)}"`:""}
514
- ${z?"disabled":""}
515
+ ${A?"disabled":""}
515
516
  >
516
517
  ${Y}
517
518
  <span class="slot slot--label" part="label"><slot></slot></span>
518
- ${P}
519
+ ${D}
519
520
  ${s?`<span class="sr-only">${u(j)}</span>`:""}
520
521
  </button>
521
- `),this._attachSlotListeners()}}typeof customElements<"u"&&!customElements.get("ui-button")&&customElements.define("ui-button",E);exports.UIButton=E;
522
+ `),this._syncForwardedState(),this._attachSlotListeners()}}typeof customElements<"u"&&!customElements.get("ui-button")&&customElements.define("ui-button",L);exports.UIButton=L;