@agent-ui-kit/web-components 0.0.14 → 0.0.16

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 (211) hide show
  1. package/dist/agent-ui.css +1 -1
  2. package/dist/api.colors.json +2 -2
  3. package/dist/api.colors.yaml +2 -2
  4. package/dist/api.components.json +3878 -636
  5. package/dist/api.tokens.json +35 -3
  6. package/dist/api.tokens.yaml +27 -3
  7. package/dist/chunks/{agent-C72JZNe6.js → agent-XMhz_6OA.js} +85 -76
  8. package/dist/chunks/{agent-C72JZNe6.js.map → agent-XMhz_6OA.js.map} +1 -1
  9. package/dist/chunks/{empty-state-5M3uR5CM.js → form-oekEhwja.js} +1409 -960
  10. package/dist/chunks/form-oekEhwja.js.map +1 -0
  11. package/dist/components/agent.js +6 -6
  12. package/dist/components/avatar/avatar.d.ts +0 -0
  13. package/dist/components/badge/badge.d.ts +0 -0
  14. package/dist/components/bar/bar.d.ts +0 -0
  15. package/dist/components/breadcrumb/breadcrumb.d.ts +2 -0
  16. package/dist/components/button-group/button-group.d.ts +0 -0
  17. package/dist/components/checkbox-group/checkbox-group.d.ts +14 -0
  18. package/dist/components/checkbox-group/index.d.ts +1 -0
  19. package/dist/components/code/code.d.ts +0 -0
  20. package/dist/components/color-area/color-area.d.ts +2 -1
  21. package/dist/components/color-picker/color-picker.d.ts +1 -0
  22. package/dist/components/color-picker/oklch-utils.d.ts +18 -0
  23. package/dist/components/color-slider/color-slider.d.ts +1 -1
  24. package/dist/components/color-swatch/color-swatch.d.ts +0 -0
  25. package/dist/components/content/content.d.ts +0 -0
  26. package/dist/components/description-list/description-list.d.ts +0 -0
  27. package/dist/components/divider/divider.d.ts +0 -0
  28. package/dist/components/editor.js +1 -1
  29. package/dist/components/fieldset/fieldset.d.ts +0 -0
  30. package/dist/components/footer/footer.d.ts +0 -0
  31. package/dist/components/form/form.d.ts +12 -0
  32. package/dist/components/form/index.d.ts +1 -0
  33. package/dist/components/graph.js +1 -1
  34. package/dist/components/grid/grid.d.ts +0 -0
  35. package/dist/components/header/header.d.ts +0 -0
  36. package/dist/components/heading/heading.d.ts +0 -0
  37. package/dist/components/index.d.ts +2 -0
  38. package/dist/components/input-group/input-group.d.ts +0 -0
  39. package/dist/components/inset/inset.d.ts +0 -0
  40. package/dist/components/kbd/kbd.d.ts +0 -0
  41. package/dist/components/noodles/noodle-controller.d.ts +1 -1
  42. package/dist/components/stack/stack.d.ts +0 -0
  43. package/dist/components/stat/stat.d.ts +4 -0
  44. package/dist/components/text/text.d.ts +0 -0
  45. package/dist/components/time-field/time-field.d.ts +1 -0
  46. package/dist/components/wrap/wrap.d.ts +0 -0
  47. package/dist/components.js +115 -126
  48. package/dist/components.js.map +1 -1
  49. package/dist/docs/blocks/agent-chat.yaml +33 -25
  50. package/dist/docs/blocks/announcement-card.yaml +14 -10
  51. package/dist/docs/blocks/bpm-process.yaml +216 -4
  52. package/dist/docs/blocks/chart-activity.yaml +12 -10
  53. package/dist/docs/blocks/chart-card.yaml +14 -11
  54. package/dist/docs/blocks/chart-donut.yaml +27 -23
  55. package/dist/docs/blocks/chart-grouped.yaml +14 -11
  56. package/dist/docs/blocks/chart-horizontal.yaml +13 -10
  57. package/dist/docs/blocks/chart-interactive.yaml +20 -17
  58. package/dist/docs/blocks/chart-labeled.yaml +14 -11
  59. package/dist/docs/blocks/checkout-form.yaml +26 -16
  60. package/dist/docs/blocks/clinical-trial.yaml +180 -4
  61. package/dist/docs/blocks/contributors.yaml +17 -11
  62. package/dist/docs/blocks/cyber-threat.yaml +158 -4
  63. package/dist/docs/blocks/dashboard-layout.yaml +25 -18
  64. package/dist/docs/blocks/data-eng-dag.yaml +222 -6
  65. package/dist/docs/blocks/date-picker.yaml +11 -10
  66. package/dist/docs/blocks/ddx-workflow.yaml +202 -6
  67. package/dist/docs/blocks/empty-state.yaml +8 -11
  68. package/dist/docs/blocks/env-variables.yaml +29 -20
  69. package/dist/docs/blocks/feature-upgrade.yaml +25 -18
  70. package/dist/docs/blocks/financial-risk.yaml +161 -4
  71. package/dist/docs/blocks/flow-editor.yaml +27 -18
  72. package/dist/docs/blocks/gen-ai-pipeline.yaml +232 -5
  73. package/dist/docs/blocks/issue-assign.yaml +25 -14
  74. package/dist/docs/blocks/keyboard-shortcuts.yaml +14 -9
  75. package/dist/docs/blocks/login-branded.yaml +62 -23
  76. package/dist/docs/blocks/login-email-only.yaml +14 -13
  77. package/dist/docs/blocks/login-form.yaml +17 -11
  78. package/dist/docs/blocks/login-simple.yaml +18 -12
  79. package/dist/docs/blocks/login-social.yaml +21 -14
  80. package/dist/docs/blocks/login-two-column.yaml +42 -22
  81. package/dist/docs/blocks/marketing-automation.yaml +209 -4
  82. package/dist/docs/blocks/member-list.yaml +23 -18
  83. package/dist/docs/blocks/ml-pipeline.yaml +163 -4
  84. package/dist/docs/blocks/nav-card.yaml +13 -11
  85. package/dist/docs/blocks/notification-list.yaml +18 -13
  86. package/dist/docs/blocks/oncology-pathway.yaml +227 -4
  87. package/dist/docs/blocks/pricing-card.yaml +20 -13
  88. package/dist/docs/blocks/processing-state.yaml +14 -11
  89. package/dist/docs/blocks/profile-card.yaml +22 -16
  90. package/dist/docs/blocks/saas-onboarding.yaml +222 -4
  91. package/dist/docs/blocks/settings-form.yaml +20 -11
  92. package/dist/docs/blocks/settings-panel.yaml +23 -22
  93. package/dist/docs/blocks/sidebar-nav.yaml +23 -15
  94. package/dist/docs/blocks/signup-form.yaml +17 -11
  95. package/dist/docs/blocks/stat-cards.yaml +12 -13
  96. package/dist/docs/blocks/status-card.yaml +20 -17
  97. package/dist/docs/blocks/suggested-labs.yaml +20 -13
  98. package/dist/docs/blocks/supply-chain.yaml +160 -4
  99. package/dist/docs/blocks/survey-card.yaml +21 -13
  100. package/dist/docs/blocks/tabbed-panel.yaml +21 -15
  101. package/dist/docs/blocks/team-empty.yaml +8 -9
  102. package/dist/docs/blocks/usage-billing.yaml +20 -16
  103. package/dist/docs/components/accordion-item.yaml +13 -21
  104. package/dist/docs/components/accordion.yaml +23 -29
  105. package/dist/docs/components/agent-activity.yaml +49 -41
  106. package/dist/docs/components/agent-feed.yaml +15 -22
  107. package/dist/docs/components/agent-input.yaml +238 -0
  108. package/dist/docs/components/agent-message.yaml +29 -48
  109. package/dist/docs/components/agent-panel.yaml +21 -24
  110. package/dist/docs/components/agent-prompt.yaml +29 -47
  111. package/dist/docs/components/agent-seeds.yaml +16 -24
  112. package/dist/docs/components/agent-text.yaml +14 -24
  113. package/dist/docs/components/agent-thread.yaml +15 -24
  114. package/dist/docs/components/alert.yaml +41 -39
  115. package/dist/docs/components/avatar-group.yaml +72 -45
  116. package/dist/docs/components/avatar.yaml +99 -0
  117. package/dist/docs/components/badge.yaml +110 -0
  118. package/dist/docs/components/bar.yaml +84 -0
  119. package/dist/docs/components/breadcrumb-item.yaml +8 -17
  120. package/dist/docs/components/breadcrumb.yaml +91 -29
  121. package/dist/docs/components/button-group.yaml +93 -0
  122. package/dist/docs/components/button.yaml +188 -261
  123. package/dist/docs/components/calendar-picker.yaml +16 -35
  124. package/dist/docs/components/calendar-range-picker.yaml +11 -29
  125. package/dist/docs/components/calendar.yaml +11 -29
  126. package/dist/docs/components/canvas.yaml +44 -61
  127. package/dist/docs/components/checkbox.yaml +37 -49
  128. package/dist/docs/components/chip.yaml +89 -55
  129. package/dist/docs/components/code-block.yaml +54 -53
  130. package/dist/docs/components/code.yaml +37 -0
  131. package/dist/docs/components/color-area.yaml +119 -0
  132. package/dist/docs/components/color-field.yaml +121 -0
  133. package/dist/docs/components/color-picker.yaml +87 -35
  134. package/dist/docs/components/color-slider.yaml +153 -0
  135. package/dist/docs/components/color-swatch.yaml +98 -0
  136. package/dist/docs/components/command.yaml +13 -18
  137. package/dist/docs/components/container.yaml +84 -73
  138. package/dist/docs/components/content.yaml +100 -0
  139. package/dist/docs/components/context-menu.yaml +11 -20
  140. package/dist/docs/components/date-field.yaml +81 -33
  141. package/dist/docs/components/description-list.yaml +81 -0
  142. package/dist/docs/components/disclosure-group.yaml +61 -42
  143. package/dist/docs/components/disclosure.yaml +60 -46
  144. package/dist/docs/components/divider.yaml +63 -0
  145. package/dist/docs/components/dropdown-menu.yaml +16 -25
  146. package/dist/docs/components/feed.yaml +15 -24
  147. package/dist/docs/components/field.yaml +50 -71
  148. package/dist/docs/components/fieldset.yaml +92 -0
  149. package/dist/docs/components/footer.yaml +147 -0
  150. package/dist/docs/components/grid.yaml +87 -0
  151. package/dist/docs/components/gripper.yaml +11 -23
  152. package/dist/docs/components/header.yaml +168 -0
  153. package/dist/docs/components/heading.yaml +58 -0
  154. package/dist/docs/components/hover-card.yaml +17 -25
  155. package/dist/docs/components/icon.yaml +32 -65
  156. package/dist/docs/components/index.yaml +11 -1
  157. package/dist/docs/components/input-group.yaml +102 -0
  158. package/dist/docs/components/input-otp.yaml +20 -19
  159. package/dist/docs/components/input.yaml +100 -139
  160. package/dist/docs/components/inset.yaml +59 -0
  161. package/dist/docs/components/kbd.yaml +57 -0
  162. package/dist/docs/components/link.yaml +36 -45
  163. package/dist/docs/components/meter.yaml +54 -42
  164. package/dist/docs/components/nav-item.yaml +54 -43
  165. package/dist/docs/components/noodles.yaml +72 -104
  166. package/dist/docs/components/option.yaml +12 -23
  167. package/dist/docs/components/pagination.yaml +21 -18
  168. package/dist/docs/components/pane.yaml +18 -32
  169. package/dist/docs/components/panes.yaml +19 -27
  170. package/dist/docs/components/progress-circle.yaml +64 -55
  171. package/dist/docs/components/progress.yaml +35 -51
  172. package/dist/docs/components/radio-group.yaml +99 -40
  173. package/dist/docs/components/radio.yaml +40 -41
  174. package/dist/docs/components/range.yaml +24 -27
  175. package/dist/docs/components/segmented-control.yaml +58 -17
  176. package/dist/docs/components/select.yaml +80 -100
  177. package/dist/docs/components/skeleton.yaml +39 -39
  178. package/dist/docs/components/sparkline.yaml +28 -45
  179. package/dist/docs/components/spinner.yaml +32 -33
  180. package/dist/docs/components/stack.yaml +126 -0
  181. package/dist/docs/components/stat.yaml +164 -0
  182. package/dist/docs/components/stepper.yaml +46 -53
  183. package/dist/docs/components/switch.yaml +36 -47
  184. package/dist/docs/components/tab-panel.yaml +27 -18
  185. package/dist/docs/components/tab.yaml +25 -22
  186. package/dist/docs/components/table-header.yaml +22 -12
  187. package/dist/docs/components/tabs.yaml +103 -20
  188. package/dist/docs/components/tag-group.yaml +63 -47
  189. package/dist/docs/components/text.yaml +67 -0
  190. package/dist/docs/components/textarea.yaml +43 -60
  191. package/dist/docs/components/time-field.yaml +108 -34
  192. package/dist/docs/components/toast.yaml +13 -30
  193. package/dist/docs/components/tooltip.yaml +56 -49
  194. package/dist/docs/components/tree-item.yaml +9 -10
  195. package/dist/docs/components/tree.yaml +127 -10
  196. package/dist/docs/components/wrap.yaml +60 -0
  197. package/dist/docs/traits/toggle-theme.yaml +34 -0
  198. package/dist/element.js +1 -1
  199. package/dist/icons.js +79 -59
  200. package/dist/icons.js.map +1 -1
  201. package/dist/reactivity.js +2 -2
  202. package/dist/register.d.ts +0 -1
  203. package/dist/register.js +368 -352
  204. package/dist/register.js.map +1 -1
  205. package/dist/store.js +1 -1
  206. package/dist/traits/toggle-theme/toggle-theme.d.ts +0 -0
  207. package/dist/traits/toggle-theme/toggle-theme.trait.d.ts +2 -0
  208. package/dist/traits.js +528 -485
  209. package/dist/traits.js.map +1 -1
  210. package/package.json +1 -1
  211. package/dist/chunks/empty-state-5M3uR5CM.js.map +0 -1
package/dist/docs/blocks/marketing-automation.yaml CHANGED
@@ -1,7 +1,212 @@
1
1
  name: marketing-automation
2
2
  type: block
3
3
  summary: Marketing Automation Engine — 16 nodes, 19 connections.
4
- description: >
5
- Visual graph block rendered from the Marketing Automation Engine dataset using
6
- aui-graph components with port-selector noodle connections.
7
- components: [aui-container, aui-text, aui-graph-ui, aui-graph-layer, aui-graph-node, aui-graph-noodle, aui-graph-port]
4
+ description: |
5
+ Visual graph block rendered from the Marketing Automation Engine dataset using aui-graph components with port-selector noodle connections.
6
+ components:
7
+ - aui-container
8
+ - aui-text
9
+ - aui-graph-ui
10
+ - aui-graph-layer
11
+ - aui-graph-node
12
+ - aui-graph-noodle
13
+ - aui-graph-port
14
+ examples:
15
+ - description: Marketing Automation Engine — 16 nodes, 19 connections.
16
+ html: |-
17
+ <aui-graph-ui connectable style="width: 100%; height: 37.25rem; min-width: 91.875rem;">
18
+ <aui-graph-layer name="wires" type="svg">
19
+ <!-- Lead Capture Form → CRM Enrichment -->
20
+ <aui-graph-noodle from="ma-lead-form:right" to="ma-crm-enrich:left" color="accent" weight="2"></aui-graph-noodle>
21
+ <!-- Social Ad Import → CRM Enrichment -->
22
+ <aui-graph-noodle from="ma-social:right" to="ma-crm-enrich:left" color="accent" weight="2"></aui-graph-noodle>
23
+ <!-- Social Ad Import → Lead Scoring Engine -->
24
+ <aui-graph-noodle from="ma-social:right" to="ma-score:left" color="accent" weight="2"></aui-graph-noodle>
25
+ <!-- Webinar Registration → Lead Scoring Engine -->
26
+ <aui-graph-noodle from="ma-webinar:right" to="ma-score:left" color="accent" weight="2"></aui-graph-noodle>
27
+ <!-- CRM Enrichment → Audience Segmentation -->
28
+ <aui-graph-noodle from="ma-crm-enrich:right" to="ma-segment:left" color="accent" weight="2"></aui-graph-noodle>
29
+ <!-- Lead Scoring Engine → Nurture Sequence -->
30
+ <aui-graph-noodle from="ma-score:right" to="ma-nurture:left" color="accent" weight="2"></aui-graph-noodle>
31
+ <!-- Lead Scoring Engine → A/B Test Split -->
32
+ <aui-graph-noodle from="ma-score:right" to="ma-abtest:left" color="accent" weight="2"></aui-graph-noodle>
33
+ <!-- Audience Segmentation → Engagement Tracker -->
34
+ <aui-graph-noodle from="ma-segment:right" to="ma-engage:left" color="accent" weight="2"></aui-graph-noodle>
35
+ <!-- Nurture Sequence → Engagement Tracker -->
36
+ <aui-graph-noodle from="ma-nurture:right" to="ma-engage:left" color="accent" weight="2"></aui-graph-noodle>
37
+ <!-- A/B Test Split → Email Variant A -->
38
+ <aui-graph-noodle from="ma-abtest:right" to="ma-email-a:left" color="accent" weight="2"></aui-graph-noodle>
39
+ <!-- A/B Test Split → Email Variant B -->
40
+ <aui-graph-noodle from="ma-abtest:right" to="ma-email-b:left" color="accent" weight="2"></aui-graph-noodle>
41
+ <!-- Engagement Tracker → MQL Qualification -->
42
+ <aui-graph-noodle from="ma-engage:right" to="ma-mql:left" color="accent" weight="2"></aui-graph-noodle>
43
+ <!-- Email Variant A → MQL Qualification -->
44
+ <aui-graph-noodle from="ma-email-a:right" to="ma-mql:left" color="accent" weight="2"></aui-graph-noodle>
45
+ <!-- Email Variant B → Retargeting Pixel -->
46
+ <aui-graph-noodle from="ma-email-b:right" to="ma-retarget:left" color="accent" weight="2"></aui-graph-noodle>
47
+ <!-- MQL Qualification → Sales Handoff -->
48
+ <aui-graph-noodle from="ma-mql:bottom" to="ma-sales:top" color="accent" weight="2"></aui-graph-noodle>
49
+ <!-- Sales Handoff → Campaign Analytics -->
50
+ <aui-graph-noodle from="ma-sales:right" to="ma-report:left" color="accent" weight="2"></aui-graph-noodle>
51
+ <!-- Retargeting Pixel → Campaign Analytics -->
52
+ <aui-graph-noodle from="ma-retarget:right" to="ma-report:left" color="accent" weight="2"></aui-graph-noodle>
53
+ <!-- Retargeting Pixel → Unsubscribe Handler -->
54
+ <aui-graph-noodle from="ma-retarget:bottom" to="ma-unsubscribe:left" color="danger" weight="2"></aui-graph-noodle>
55
+ <!-- Retargeting Pixel → Nurture Sequence -->
56
+ <aui-graph-noodle from="ma-retarget:left" to="ma-nurture:bottom" color="warning" weight="2"></aui-graph-noodle>
57
+ </aui-graph-layer>
58
+ <aui-graph-layer name="content">
59
+ <!-- Lead Capture Form -->
60
+ <aui-graph-node x="24" y="46" node-id="ma-lead-form">
61
+ <aui-container kind="card" bordered padding="3" accent>
62
+ <aui-text weight="medium">Lead Capture Form</aui-text>
63
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
64
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
65
+ </aui-container>
66
+ </aui-graph-node>
67
+ <!-- Social Ad Import -->
68
+ <aui-graph-node x="24" y="186" node-id="ma-social">
69
+ <aui-container kind="card" bordered padding="3" accent>
70
+ <aui-text weight="medium">Social Ad Import</aui-text>
71
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
72
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
73
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
74
+ </aui-container>
75
+ </aui-graph-node>
76
+ <!-- Webinar Registration -->
77
+ <aui-graph-node x="24" y="326" node-id="ma-webinar">
78
+ <aui-container kind="card" bordered padding="3" accent>
79
+ <aui-text weight="medium">Webinar Registration</aui-text>
80
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
81
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
82
+ </aui-container>
83
+ </aui-graph-node>
84
+ <!-- CRM Enrichment -->
85
+ <aui-graph-node x="260" y="116" node-id="ma-crm-enrich">
86
+ <aui-container kind="card" bordered padding="3" info>
87
+ <aui-text weight="medium">CRM Enrichment</aui-text>
88
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
89
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
90
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
91
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
92
+ </aui-container>
93
+ </aui-graph-node>
94
+ <!-- Lead Scoring Engine -->
95
+ <aui-graph-node x="260" y="256" node-id="ma-score">
96
+ <aui-container kind="card" bordered padding="3" info>
97
+ <aui-text weight="medium">Lead Scoring Engine</aui-text>
98
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
99
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
100
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
101
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
102
+ </aui-container>
103
+ </aui-graph-node>
104
+ <!-- Audience Segmentation -->
105
+ <aui-graph-node x="500" y="46" node-id="ma-segment">
106
+ <aui-container kind="card" bordered padding="3" warning>
107
+ <aui-text weight="medium">Audience Segmentation</aui-text>
108
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
109
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
110
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
111
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
112
+ </aui-container>
113
+ </aui-graph-node>
114
+ <!-- Nurture Sequence -->
115
+ <aui-graph-node x="500" y="186" node-id="ma-nurture">
116
+ <aui-container kind="card" bordered padding="3" warning>
117
+ <aui-text weight="medium">Nurture Sequence</aui-text>
118
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
119
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
120
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
121
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
122
+ </aui-container>
123
+ </aui-graph-node>
124
+ <!-- A/B Test Split -->
125
+ <aui-graph-node x="500" y="326" node-id="ma-abtest">
126
+ <aui-container kind="card" bordered padding="3" warning>
127
+ <aui-text weight="medium">A/B Test Split</aui-text>
128
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
129
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
130
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
131
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
132
+ </aui-container>
133
+ </aui-graph-node>
134
+ <!-- Email Variant A -->
135
+ <aui-graph-node x="740" y="256" node-id="ma-email-a">
136
+ <aui-container kind="card" bordered padding="3" info>
137
+ <aui-text weight="medium">Email Variant A</aui-text>
138
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
139
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
140
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
141
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
142
+ </aui-container>
143
+ </aui-graph-node>
144
+ <!-- Email Variant B -->
145
+ <aui-graph-node x="740" y="396" node-id="ma-email-b">
146
+ <aui-container kind="card" bordered padding="3" info>
147
+ <aui-text weight="medium">Email Variant B</aui-text>
148
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
149
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
150
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
151
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
152
+ </aui-container>
153
+ </aui-graph-node>
154
+ <!-- Engagement Tracker -->
155
+ <aui-graph-node x="740" y="116" node-id="ma-engage">
156
+ <aui-container kind="card" bordered padding="3" success>
157
+ <aui-text weight="medium">Engagement Tracker</aui-text>
158
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
159
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
160
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
161
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
162
+ </aui-container>
163
+ </aui-graph-node>
164
+ <!-- MQL Qualification -->
165
+ <aui-graph-node x="980" y="116" node-id="ma-mql">
166
+ <aui-container kind="card" bordered padding="3" success>
167
+ <aui-text weight="medium">MQL Qualification</aui-text>
168
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
169
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
170
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
171
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
172
+ </aui-container>
173
+ </aui-graph-node>
174
+ <!-- Sales Handoff -->
175
+ <aui-graph-node x="980" y="256" node-id="ma-sales">
176
+ <aui-container kind="card" bordered padding="3" success>
177
+ <aui-text weight="medium">Sales Handoff</aui-text>
178
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
179
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
180
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
181
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
182
+ </aui-container>
183
+ </aui-graph-node>
184
+ <!-- Retargeting Pixel -->
185
+ <aui-graph-node x="980" y="396" node-id="ma-retarget">
186
+ <aui-container kind="card" bordered padding="3" danger>
187
+ <aui-text weight="medium">Retargeting Pixel</aui-text>
188
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
189
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
190
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
191
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
192
+ </aui-container>
193
+ </aui-graph-node>
194
+ <!-- Campaign Analytics -->
195
+ <aui-graph-node x="1220" y="186" node-id="ma-report">
196
+ <aui-container kind="card" bordered padding="3" info>
197
+ <aui-text weight="medium">Campaign Analytics</aui-text>
198
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
199
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
200
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
201
+ </aui-container>
202
+ </aui-graph-node>
203
+ <!-- Unsubscribe Handler -->
204
+ <aui-graph-node x="1220" y="396" node-id="ma-unsubscribe">
205
+ <aui-container kind="card" bordered padding="3" danger>
206
+ <aui-text weight="medium">Unsubscribe Handler</aui-text>
207
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
208
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
209
+ </aui-container>
210
+ </aui-graph-node>
211
+ </aui-graph-layer>
212
+ </aui-graph-ui>
package/dist/docs/blocks/member-list.yaml CHANGED
@@ -1,28 +1,34 @@
1
1
  name: member-list
2
2
  type: block
3
3
  summary: Panel with header and avatar-based member rows.
4
- description: >
5
- A spacious panel listing team members. Header has an icon, title,
6
- subtitle, and a primary action button. Each member row shows an
7
- avatar, name, metadata, and a role badge.
8
-
9
- components: [aui-container, aui-header, aui-content, aui-inset, aui-stack, aui-heading, aui-text, aui-avatar, aui-icon, aui-badge, aui-button]
4
+ description: |
5
+ A spacious panel listing team members. Header has an icon, title, subtitle, and a primary action button. Each member row shows an avatar, name, metadata, and a role badge.
6
+ components:
7
+ - aui-container
8
+ - aui-header
9
+ - aui-content
10
+ - aui-inset
11
+ - aui-stack
12
+ - aui-heading
13
+ - aui-text
14
+ - aui-avatar
15
+ - aui-icon
16
+ - aui-badge
17
+ - aui-button
10
18
  kind: panel
11
-
12
19
  examples:
13
- - html: |
20
+ - description: Panel with header and avatar-based member rows.
21
+ html: |-
14
22
  <aui-container kind="panel" bordered max-width="xl">
15
23
  <aui-header>
16
- <span slot="leading">
17
- <aui-stack direction="row" gap="3" align-items="center">
18
- <aui-avatar size="lg" square><aui-icon name="user"></aui-icon></aui-avatar>
19
- <aui-stack gap="1">
20
- <aui-heading size="xl">Team Members</aui-heading>
21
- <aui-text muted size="sm">Manage who has access to this project.</aui-text>
22
- </aui-stack>
24
+ <aui-stack direction="row" gap="3" align-items="center">
25
+ <aui-avatar size="lg" square><aui-icon name="users-three"></aui-icon></aui-avatar>
26
+ <aui-stack gap="1" spacer>
27
+ <aui-heading size="xl">Team Members</aui-heading>
28
+ <aui-text muted size="sm">Manage who has access to this project.</aui-text>
23
29
  </aui-stack>
24
- </span>
25
- <span slot="trailing"><aui-button primary accent>Invite</aui-button></span>
30
+ <aui-button primary accent>Invite</aui-button>
31
+ </aui-stack>
26
32
  </aui-header>
27
33
  <aui-content>
28
34
  <aui-inset>
@@ -55,4 +61,3 @@ examples:
55
61
  </aui-inset>
56
62
  </aui-content>
57
63
  </aui-container>
58
- description: Team member list with avatars, roles, and an invite action.
package/dist/docs/blocks/ml-pipeline.yaml CHANGED
@@ -1,7 +1,166 @@
1
1
  name: ml-pipeline
2
2
  type: block
3
3
  summary: ML Training Pipeline — 12 nodes, 14 connections.
4
- description: >
5
- Visual graph block rendered from the ML Training Pipeline dataset using
6
- aui-graph components with port-selector noodle connections.
7
- components: [aui-container, aui-text, aui-graph-ui, aui-graph-layer, aui-graph-node, aui-graph-noodle, aui-graph-port]
4
+ description: |
5
+ Visual graph block rendered from the ML Training Pipeline dataset using aui-graph components with port-selector noodle connections.
6
+ components:
7
+ - aui-container
8
+ - aui-text
9
+ - aui-graph-ui
10
+ - aui-graph-layer
11
+ - aui-graph-node
12
+ - aui-graph-noodle
13
+ - aui-graph-port
14
+ examples:
15
+ - description: ML Training Pipeline — 12 nodes, 14 connections.
16
+ html: |-
17
+ <aui-graph-ui connectable style="width: 100%; height: 37.25rem; min-width: 84.625rem;">
18
+ <aui-graph-layer name="wires" type="svg">
19
+ <!-- Data Lake → Feature Store -->
20
+ <aui-graph-noodle from="ml-lake:right" to="ml-features:left" color="accent" weight="2"></aui-graph-noodle>
21
+ <!-- Schema Validator → Feature Store -->
22
+ <aui-graph-noodle from="ml-schema:right" to="ml-features:left" color="accent" weight="2"></aui-graph-noodle>
23
+ <!-- Feature Store → Training Cluster GPU -->
24
+ <aui-graph-noodle from="ml-features:right" to="ml-train:left" color="accent" weight="2"></aui-graph-noodle>
25
+ <!-- Feature Store → Hyperparameter Tuner -->
26
+ <aui-graph-noodle from="ml-features:right" to="ml-hyper:left" color="accent" weight="2"></aui-graph-noodle>
27
+ <!-- Training Cluster GPU → Validation Split -->
28
+ <aui-graph-noodle from="ml-train:right" to="ml-validate:left" color="accent" weight="2"></aui-graph-noodle>
29
+ <!-- Hyperparameter Tuner → Training Cluster GPU -->
30
+ <aui-graph-noodle from="ml-hyper:right" to="ml-train:left" color="accent" weight="2"></aui-graph-noodle>
31
+ <!-- Validation Split → Model Registry -->
32
+ <aui-graph-noodle from="ml-validate:right" to="ml-registry:left" color="accent" weight="2"></aui-graph-noodle>
33
+ <!-- Model Registry → A/B Test Gate -->
34
+ <aui-graph-noodle from="ml-registry:right" to="ml-abtest:left" color="accent" weight="2"></aui-graph-noodle>
35
+ <!-- Model Registry → Canary Deploy -->
36
+ <aui-graph-noodle from="ml-registry:right" to="ml-canary:left" color="accent" weight="2"></aui-graph-noodle>
37
+ <!-- A/B Test Gate → Production Endpoint -->
38
+ <aui-graph-noodle from="ml-abtest:right" to="ml-prod:left" color="accent" weight="2"></aui-graph-noodle>
39
+ <!-- Canary Deploy → Production Endpoint -->
40
+ <aui-graph-noodle from="ml-canary:right" to="ml-prod:left" color="accent" weight="2"></aui-graph-noodle>
41
+ <!-- Production Endpoint → Drift Monitor -->
42
+ <aui-graph-noodle from="ml-prod:right" to="ml-drift:left" color="accent" weight="2"></aui-graph-noodle>
43
+ <!-- Drift Monitor → Retraining Trigger -->
44
+ <aui-graph-noodle from="ml-drift:right" to="ml-retrain:left" color="danger" weight="2"></aui-graph-noodle>
45
+ <!-- Retraining Trigger → Feature Store -->
46
+ <aui-graph-noodle from="ml-retrain:bottom" to="ml-features:bottom" color="warning" weight="2"></aui-graph-noodle>
47
+ </aui-graph-layer>
48
+ <aui-graph-layer name="content">
49
+ <!-- Data Lake -->
50
+ <aui-graph-node x="24" y="116" node-id="ml-lake">
51
+ <aui-container kind="card" bordered padding="3" accent>
52
+ <aui-text weight="medium">Data Lake</aui-text>
53
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
54
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
55
+ </aui-container>
56
+ </aui-graph-node>
57
+ <!-- Schema Validator -->
58
+ <aui-graph-node x="24" y="256" node-id="ml-schema">
59
+ <aui-container kind="card" bordered padding="3" accent>
60
+ <aui-text weight="medium">Schema Validator</aui-text>
61
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
62
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
63
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
64
+ </aui-container>
65
+ </aui-graph-node>
66
+ <!-- Feature Store -->
67
+ <aui-graph-node x="240" y="186" node-id="ml-features">
68
+ <aui-container kind="card" bordered padding="3" info>
69
+ <aui-text weight="medium">Feature Store</aui-text>
70
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
71
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
72
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
73
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
74
+ </aui-container>
75
+ </aui-graph-node>
76
+ <!-- Training Cluster GPU -->
77
+ <aui-graph-node x="456" y="116" node-id="ml-train">
78
+ <aui-container kind="card" bordered padding="3" warning>
79
+ <aui-text weight="medium">Training Cluster GPU</aui-text>
80
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
81
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
82
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
83
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
84
+ </aui-container>
85
+ </aui-graph-node>
86
+ <!-- Hyperparameter Tuner -->
87
+ <aui-graph-node x="456" y="256" node-id="ml-hyper">
88
+ <aui-container kind="card" bordered padding="3" warning>
89
+ <aui-text weight="medium">Hyperparameter Tuner</aui-text>
90
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
91
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
92
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
93
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
94
+ </aui-container>
95
+ </aui-graph-node>
96
+ <!-- Validation Split -->
97
+ <aui-graph-node x="672" y="116" node-id="ml-validate">
98
+ <aui-container kind="card" bordered padding="3" success>
99
+ <aui-text weight="medium">Validation Split</aui-text>
100
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
101
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
102
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
103
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
104
+ </aui-container>
105
+ </aui-graph-node>
106
+ <!-- Model Registry -->
107
+ <aui-graph-node x="672" y="256" node-id="ml-registry">
108
+ <aui-container kind="card" bordered padding="3" success>
109
+ <aui-text weight="medium">Model Registry</aui-text>
110
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
111
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
112
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
113
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
114
+ </aui-container>
115
+ </aui-graph-node>
116
+ <!-- A/B Test Gate -->
117
+ <aui-graph-node x="888" y="116" node-id="ml-abtest">
118
+ <aui-container kind="card" bordered padding="3" info>
119
+ <aui-text weight="medium">A/B Test Gate</aui-text>
120
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
121
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
122
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
123
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
124
+ </aui-container>
125
+ </aui-graph-node>
126
+ <!-- Canary Deploy -->
127
+ <aui-graph-node x="888" y="256" node-id="ml-canary">
128
+ <aui-container kind="card" bordered padding="3" info>
129
+ <aui-text weight="medium">Canary Deploy</aui-text>
130
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
131
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
132
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
133
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
134
+ </aui-container>
135
+ </aui-graph-node>
136
+ <!-- Production Endpoint -->
137
+ <aui-graph-node x="1104" y="116" node-id="ml-prod">
138
+ <aui-container kind="card" bordered padding="3" success>
139
+ <aui-text weight="medium">Production Endpoint</aui-text>
140
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
141
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
142
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
143
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
144
+ </aui-container>
145
+ </aui-graph-node>
146
+ <!-- Drift Monitor -->
147
+ <aui-graph-node x="1104" y="256" node-id="ml-drift">
148
+ <aui-container kind="card" bordered padding="3" danger>
149
+ <aui-text weight="medium">Drift Monitor</aui-text>
150
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
151
+ <aui-graph-port port-id="right" side="right" type="output"></aui-graph-port>
152
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
153
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
154
+ </aui-container>
155
+ </aui-graph-node>
156
+ <!-- Retraining Trigger -->
157
+ <aui-graph-node x="1104" y="396" node-id="ml-retrain">
158
+ <aui-container kind="card" bordered padding="3" danger>
159
+ <aui-text weight="medium">Retraining Trigger</aui-text>
160
+ <aui-graph-port port-id="left" side="left" type="input"></aui-graph-port>
161
+ <aui-graph-port port-id="top" side="top" type="input"></aui-graph-port>
162
+ <aui-graph-port port-id="bottom" side="bottom" type="output"></aui-graph-port>
163
+ </aui-container>
164
+ </aui-graph-node>
165
+ </aui-graph-layer>
166
+ </aui-graph-ui>
package/dist/docs/blocks/nav-card.yaml CHANGED
@@ -1,21 +1,24 @@
1
1
  name: nav-card
2
2
  type: block
3
3
  summary: Compact clickable card for navigation menus.
4
- description: >
5
- A widget-sized interactive card that navigates on click.
6
- Shows an icon in a square avatar, a title, a description,
7
- and a trailing chevron. Uses interactive and href for
8
- click-to-navigate behavior.
9
-
10
- components: [aui-container, aui-inset, aui-stack, aui-heading, aui-text, aui-avatar, aui-icon]
4
+ description: |
5
+ A widget-sized interactive card that navigates on click. Shows an icon in a square avatar, a title, a description, and a trailing chevron. Uses interactive and href for click-to-navigate behavior.
6
+ components:
7
+ - aui-container
8
+ - aui-inset
9
+ - aui-stack
10
+ - aui-heading
11
+ - aui-text
12
+ - aui-avatar
13
+ - aui-icon
11
14
  kind: widget
12
-
13
15
  examples:
14
- - html: |
16
+ - description: Compact clickable card for navigation menus.
17
+ html: |-
15
18
  <aui-container kind="widget" bordered interactive href="#" max-width="sm">
16
19
  <aui-inset>
17
20
  <aui-stack direction="row" gap="2" align-items="center">
18
- <aui-avatar square><aui-icon name="gear"></aui-icon></aui-avatar>
21
+ <aui-avatar size="lg" square><aui-icon name="gear"></aui-icon></aui-avatar>
19
22
  <aui-stack gap="1" spacer>
20
23
  <aui-heading size="md" weight="medium">Preferences</aui-heading>
21
24
  <aui-text muted size="sm">Language, theme, and notifications</aui-text>
@@ -24,4 +27,3 @@ examples:
24
27
  </aui-stack>
25
28
  </aui-inset>
26
29
  </aui-container>
27
- description: Clickable settings navigation card with icon and chevron.
package/dist/docs/blocks/notification-list.yaml CHANGED
@@ -1,22 +1,28 @@
1
1
  name: notification-list
2
2
  type: block
3
3
  summary: Panel listing recent notifications with avatars and timestamps.
4
- description: >
5
- A panel-style container for displaying a chronological list of
6
- notifications. The header includes a title and a bulk action to
7
- mark all items as read. Each notification row shows an avatar,
8
- a title, a message excerpt, and a relative timestamp. Suitable
9
- for notification drawers, activity feeds, or inbox-style sidebars.
10
-
11
- components: [aui-container, aui-header, aui-content, aui-inset, aui-stack, aui-heading, aui-text, aui-avatar, aui-button]
4
+ description: |
5
+ A panel-style container for displaying a chronological list of notifications. The header includes a title and a bulk action to mark all items as read. Each notification row shows an avatar, a title, a message excerpt, and a relative timestamp. Suitable for notification drawers, activity feeds, or inbox-style sidebars.
6
+ components:
7
+ - aui-container
8
+ - aui-header
9
+ - aui-content
10
+ - aui-inset
11
+ - aui-stack
12
+ - aui-heading
13
+ - aui-text
14
+ - aui-avatar
15
+ - aui-button
12
16
  kind: panel
13
-
14
17
  examples:
15
- - html: |
18
+ - description: Panel listing recent notifications with avatars and timestamps.
19
+ html: |-
16
20
  <aui-container kind="panel" bordered max-width="lg">
17
21
  <aui-header>
18
- <span slot="leading"><aui-heading size="xl">Notifications</aui-heading></span>
19
- <span slot="trailing"><aui-button scrim>Mark all read</aui-button></span>
22
+ <aui-stack direction="row" gap="2" align-items="center">
23
+ <aui-heading size="xl" spacer>Notifications</aui-heading>
24
+ <aui-button scrim>Mark all read</aui-button>
25
+ </aui-stack>
20
26
  </aui-header>
21
27
  <aui-content>
22
28
  <aui-inset>
@@ -55,4 +61,3 @@ examples:
55
61
  </aui-inset>
56
62
  </aui-content>
57
63
  </aui-container>
58
- description: Notification list with three items showing comments, builds, and team activity.