@adia-ai/web-components 0.7.2 → 0.7.4

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 (145) hide show
  1. package/CHANGELOG.md +42 -0
  2. package/components/accordion/accordion.css +2 -2
  3. package/components/action-list/action-list.css +2 -2
  4. package/components/agent-artifact/agent-artifact.css +31 -31
  5. package/components/agent-feedback-bar/agent-feedback-bar.css +10 -10
  6. package/components/agent-questions/agent-questions.css +59 -57
  7. package/components/agent-reasoning/agent-reasoning.css +54 -54
  8. package/components/agent-suggestions/agent-suggestions.css +4 -4
  9. package/components/agent-trace/agent-trace.css +53 -53
  10. package/components/alert/alert.css +53 -53
  11. package/components/avatar/avatar.css +27 -27
  12. package/components/badge/badge.css +56 -53
  13. package/components/block/block.css +16 -16
  14. package/components/blockquote/blockquote.css +16 -16
  15. package/components/breadcrumb/breadcrumb.css +23 -23
  16. package/components/button/button.css +99 -100
  17. package/components/calendar-grid/calendar-grid.css +95 -92
  18. package/components/calendar-picker/calendar-picker.css +141 -139
  19. package/components/canvas/canvas.css +12 -12
  20. package/components/card/card.css +83 -83
  21. package/components/chart/chart.css +218 -218
  22. package/components/chart-legend/chart-legend.css +26 -26
  23. package/components/check/check.css +40 -40
  24. package/components/code/code.css +125 -125
  25. package/components/col/col.a2ui.json +1 -1
  26. package/components/col/col.css +15 -15
  27. package/components/col/col.d.ts +1 -1
  28. package/components/col/col.yaml +6 -3
  29. package/components/color-picker/color-picker.css +55 -55
  30. package/components/combobox/combobox.css +64 -62
  31. package/components/command/command.css +91 -91
  32. package/components/context-menu/context-menu.css +1 -1
  33. package/components/date-range-picker/date-range-picker.css +59 -59
  34. package/components/datetime-picker/datetime-picker.css +25 -25
  35. package/components/demo-toggle/demo-toggle.css +27 -27
  36. package/components/description-list/description-list.css +18 -18
  37. package/components/divider/divider.css +24 -24
  38. package/components/embed/embed.css +6 -6
  39. package/components/empty-state/empty-state.css +29 -29
  40. package/components/feed/feed.css +12 -12
  41. package/components/field/field.css +28 -28
  42. package/components/field/field.test.js +2 -2
  43. package/components/fields/fields.css +5 -5
  44. package/components/grid/grid.a2ui.json +11 -1
  45. package/components/grid/grid.css +26 -7
  46. package/components/grid/grid.d.ts +5 -1
  47. package/components/grid/grid.yaml +18 -3
  48. package/components/heatmap/heatmap.css +61 -61
  49. package/components/icon/icon.css +12 -12
  50. package/components/image/image.css +14 -14
  51. package/components/inline-edit/inline-edit.css +16 -16
  52. package/components/inline-message/inline-message.css +16 -16
  53. package/components/input/input.css +69 -66
  54. package/components/inspector/inspector.css +6 -6
  55. package/components/integration-card/integration-card.css +41 -41
  56. package/components/integration-card/integration-card.test.js +4 -4
  57. package/components/kbd/kbd.css +47 -40
  58. package/components/link/link.css +12 -12
  59. package/components/list/list.css +8 -8
  60. package/components/list-window/list-window.css +10 -10
  61. package/components/loading-overlay/loading-overlay.css +17 -18
  62. package/components/loading-overlay/loading-overlay.test.js +8 -8
  63. package/components/mark/mark.css +16 -16
  64. package/components/menu/menu.css +9 -9
  65. package/components/modal/modal.class.js +5 -9
  66. package/components/modal/modal.css +43 -43
  67. package/components/nav/nav.css +40 -40
  68. package/components/nav-group/nav-group.css +54 -54
  69. package/components/nav-item/nav-item.css +44 -44
  70. package/components/noodles/noodles.css +31 -31
  71. package/components/number-format/number-format.css +4 -4
  72. package/components/option-card/option-card.css +70 -70
  73. package/components/otp-input/otp-input.css +29 -29
  74. package/components/page/page.a2ui.json +1 -1
  75. package/components/page/page.css +27 -27
  76. package/components/page/page.d.ts +1 -1
  77. package/components/page/page.yaml +1 -1
  78. package/components/pagination/pagination.css +6 -6
  79. package/components/pane/pane.css +57 -57
  80. package/components/password-strength/password-strength.css +32 -32
  81. package/components/pipeline-status/pipeline-status.css +67 -67
  82. package/components/popover/popover.css +11 -11
  83. package/components/preview/preview.css +21 -21
  84. package/components/progress/progress.css +23 -23
  85. package/components/progress-row/progress-row.css +17 -17
  86. package/components/qr-code/qr-code.css +4 -4
  87. package/components/radio/radio.css +39 -39
  88. package/components/range/range.css +58 -55
  89. package/components/rating/rating.css +28 -28
  90. package/components/relative-time/relative-time.css +6 -6
  91. package/components/richtext/richtext.css +133 -133
  92. package/components/row/row.a2ui.json +1 -1
  93. package/components/row/row.css +24 -22
  94. package/components/row/row.d.ts +1 -1
  95. package/components/row/row.yaml +4 -2
  96. package/components/search/search.css +5 -5
  97. package/components/segment/segment.css +29 -24
  98. package/components/segmented/segmented.css +30 -25
  99. package/components/select/select.css +95 -93
  100. package/components/skeleton/skeleton.css +14 -14
  101. package/components/skip-nav/skip-nav.css +4 -4
  102. package/components/slider/slider.css +61 -61
  103. package/components/spinner/spinner.css +40 -40
  104. package/components/spinner/spinner.test.js +10 -12
  105. package/components/stack/stack.css +11 -11
  106. package/components/stat/stat.css +27 -27
  107. package/components/step-progress/step-progress.css +20 -20
  108. package/components/stepper/stepper.css +29 -29
  109. package/components/stream/stream.css +12 -12
  110. package/components/swatch/swatch.css +68 -68
  111. package/components/swiper/swiper.class.js +5 -12
  112. package/components/swiper/swiper.css +57 -57
  113. package/components/switch/switch.css +53 -53
  114. package/components/table/table.css +166 -163
  115. package/components/table-toolbar/table-toolbar.css +33 -33
  116. package/components/tabs/tabs.css +54 -51
  117. package/components/tag/tag.css +74 -71
  118. package/components/tag/tag.test.js +14 -14
  119. package/components/tags-input/tags-input.css +51 -49
  120. package/components/text/text.css +44 -44
  121. package/components/textarea/textarea.css +49 -46
  122. package/components/time-picker/time-picker.css +47 -47
  123. package/components/timeline/timeline.css +54 -54
  124. package/components/toast/toast.css +58 -58
  125. package/components/toc/toc.css +28 -28
  126. package/components/toggle-group/toggle-group.css +9 -6
  127. package/components/toggle-scheme/toggle-scheme.css +2 -2
  128. package/components/toolbar/toolbar.css +18 -18
  129. package/components/tooltip/tooltip.css +2 -2
  130. package/components/tour/tour.css +4 -4
  131. package/components/tree/tree.class.js +89 -16
  132. package/components/tree/tree.css +37 -37
  133. package/components/tree/tree.test.js +49 -0
  134. package/components/upload/upload.css +49 -49
  135. package/dist/host.min.css +1 -0
  136. package/dist/web-components.min.css +1 -1
  137. package/dist/web-components.min.js +3 -3
  138. package/package.json +1 -1
  139. package/styles/api/sizing.css +52 -16
  140. package/styles/foundation/space.css +25 -8
  141. package/styles/host.css +48 -0
  142. package/styles/prose.css +187 -170
  143. package/styles/type/scale.css +6 -0
  144. package/styles/typography.css +10 -5
  145. package/styles/verse.css +122 -0
package/components/upload/upload.css CHANGED
@@ -1,48 +1,48 @@
1
1
  @scope (upload-ui) {
2
2
  :where(:scope) {
3
3
  /* ── Tokens ── */
4
- --upload-gap-default: var(--a-space-2);
5
- --upload-radius-default: var(--a-radius-md);
6
- --upload-font-default: var(--a-ui-size);
7
- --upload-border-default: var(--a-border-subtle);
8
- --upload-border-hover-default: var(--a-accent);
9
- --upload-border-dragover-default: var(--a-accent-bg);
10
- --upload-bg-dragover-default: var(--a-accent-muted);
11
- --upload-fg-default: var(--a-fg-subtle);
12
- --upload-fg-hover-default: var(--a-accent);
13
- --upload-label-fg-default: var(--a-fg);
14
- --upload-label-weight-default: var(--a-weight-medium);
15
- --upload-label-size-default: var(--a-label-size);
16
- --upload-hint-fg-default: var(--a-fg-muted);
17
- --upload-hint-size-default: var(--a-ui-sm);
18
- --upload-bg-disabled-default: var(--a-ui-bg-disabled);
19
- --upload-fg-disabled-default: var(--a-ui-text-disabled);
20
- --upload-border-disabled-default: var(--a-ui-border-disabled);
21
- --upload-focus-ring-default: var(--a-focus-ring);
22
- --upload-focus-ring-invalid-default: var(--a-focus-ring-invalid);
4
+ --upload-gap: var(--a-space-2);
5
+ --upload-radius: var(--a-radius-md);
6
+ --upload-font: var(--a-ui-size);
7
+ --upload-border: var(--a-border-subtle);
8
+ --upload-border-hover: var(--a-accent);
9
+ --upload-border-dragover: var(--a-accent-bg);
10
+ --upload-bg-dragover: var(--a-accent-muted);
11
+ --upload-fg: var(--a-fg-subtle);
12
+ --upload-fg-hover: var(--a-accent);
13
+ --upload-label-fg: var(--a-fg);
14
+ --upload-label-weight: var(--a-weight-medium);
15
+ --upload-label-size: var(--a-label-size);
16
+ --upload-hint-fg: var(--a-fg-muted);
17
+ --upload-hint-size: var(--a-ui-sm);
18
+ --upload-bg-disabled: var(--a-ui-bg-disabled);
19
+ --upload-fg-disabled: var(--a-ui-text-disabled);
20
+ --upload-border-disabled: var(--a-ui-border-disabled);
21
+ --upload-focus-ring: var(--a-focus-ring);
22
+ --upload-focus-ring-invalid: var(--a-focus-ring-invalid);
23
23
 
24
24
  /* ── Spacing ── */
25
- --upload-dropzone-pad-default: var(--a-space-6);
25
+ --upload-dropzone-pad: var(--a-space-6);
26
26
 
27
27
  /* ── Transitions ── */
28
- --upload-duration-default: var(--a-duration-fast);
29
- --upload-easing-default: var(--a-easing);
28
+ --upload-duration: var(--a-duration-fast);
29
+ --upload-easing: var(--a-easing);
30
30
  }
31
31
 
32
32
  :scope {
33
33
  box-sizing: border-box;
34
34
  display: flex;
35
35
  flex-direction: column;
36
- gap: var(--upload-gap, var(--upload-gap-default));
37
- font-size: var(--upload-font, var(--upload-font-default));
36
+ gap: var(--upload-gap);
37
+ font-size: var(--upload-font);
38
38
  }
39
39
 
40
40
  /* Label via ::before */
41
41
  :scope::before {
42
42
  content: attr(label);
43
- font-size: var(--upload-label-size, var(--upload-label-size-default));
44
- font-weight: var(--upload-label-weight, var(--upload-label-weight-default));
45
- color: var(--upload-label-fg, var(--upload-label-fg-default));
43
+ font-size: var(--upload-label-size);
44
+ font-weight: var(--upload-label-weight);
45
+ color: var(--upload-label-fg);
46
46
  }
47
47
  :scope:not([label])::before,
48
48
  :scope[label=""]::before {
@@ -54,38 +54,38 @@
54
54
  display: flex;
55
55
  align-items: center;
56
56
  justify-content: center;
57
- padding: var(--upload-dropzone-pad, var(--upload-dropzone-pad-default));
58
- border: 2px dashed var(--upload-border, var(--upload-border-default));
59
- border-radius: var(--upload-radius, var(--upload-radius-default));
60
- color: var(--upload-fg, var(--upload-fg-default));
61
- font-size: var(--upload-font, var(--upload-font-default));
57
+ padding: var(--upload-dropzone-pad);
58
+ border: 2px dashed var(--upload-border);
59
+ border-radius: var(--upload-radius);
60
+ color: var(--upload-fg);
61
+ font-size: var(--upload-font);
62
62
  text-align: center;
63
63
  cursor: pointer;
64
64
  transition:
65
- border-color var(--upload-duration, var(--upload-duration-default)) var(--upload-easing, var(--upload-easing-default)),
66
- background var(--upload-duration, var(--upload-duration-default)) var(--upload-easing, var(--upload-easing-default)),
67
- color var(--upload-duration, var(--upload-duration-default)) var(--upload-easing, var(--upload-easing-default)),
68
- box-shadow var(--upload-duration, var(--upload-duration-default)) var(--upload-easing, var(--upload-easing-default));
65
+ border-color var(--upload-duration) var(--upload-easing),
66
+ background var(--upload-duration) var(--upload-easing),
67
+ color var(--upload-duration) var(--upload-easing),
68
+ box-shadow var(--upload-duration) var(--upload-easing);
69
69
  }
70
70
  [data-dropzone]:hover {
71
- border-color: var(--upload-border-hover, var(--upload-border-hover-default));
72
- color: var(--upload-fg-hover, var(--upload-fg-hover-default));
71
+ border-color: var(--upload-border-hover);
72
+ color: var(--upload-fg-hover);
73
73
  }
74
74
  [data-dropzone]:focus-visible {
75
75
  /* Canonical ring via L3 token (see semantics.css FOCUS block). */
76
76
  outline: none;
77
- box-shadow: var(--upload-focus-ring, var(--upload-focus-ring-default));
77
+ box-shadow: var(--upload-focus-ring);
78
78
  }
79
79
  [data-dropzone][data-dragover] {
80
- border-color: var(--upload-border-dragover, var(--upload-border-dragover-default));
81
- background: var(--upload-bg-dragover, var(--upload-bg-dragover-default));
80
+ border-color: var(--upload-border-dragover);
81
+ background: var(--upload-bg-dragover);
82
82
  }
83
83
 
84
84
  /* Hint via ::after on span */
85
85
  span[hint]::after {
86
86
  content: attr(hint);
87
- font-size: var(--upload-hint-size, var(--upload-hint-size-default));
88
- color: var(--upload-hint-fg, var(--upload-hint-fg-default));
87
+ font-size: var(--upload-hint-size);
88
+ color: var(--upload-hint-fg);
89
89
  }
90
90
  span[hint=""]::after {
91
91
  display: none;
@@ -98,8 +98,8 @@
98
98
  [data-filelist] {
99
99
  display: flex;
100
100
  flex-direction: column;
101
- gap: var(--upload-gap, var(--upload-gap-default));
102
- font-size: var(--upload-font, var(--upload-font-default));
101
+ gap: var(--upload-gap);
102
+ font-size: var(--upload-font);
103
103
  }
104
104
  [data-filelist]:empty {
105
105
  display: none;
@@ -108,12 +108,12 @@
108
108
  /* Disabled */
109
109
  :scope[disabled] {
110
110
  pointer-events: none;
111
- color: var(--upload-fg-disabled, var(--upload-fg-disabled-default));
111
+ color: var(--upload-fg-disabled);
112
112
  }
113
113
  :scope[disabled] [data-dropzone] {
114
- background: var(--upload-bg-disabled, var(--upload-bg-disabled-default));
115
- border-color: var(--upload-border-disabled, var(--upload-border-disabled-default));
116
- color: var(--upload-fg-disabled, var(--upload-fg-disabled-default));
114
+ background: var(--upload-bg-disabled);
115
+ border-color: var(--upload-border-disabled);
116
+ color: var(--upload-fg-disabled);
117
117
  cursor: not-allowed;
118
118
  }
119
119
  }