vanilla-breeze 0.1.0 → 0.1.2

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 (99) hide show
  1. package/dist/cdn/components/adr-record.js +383 -0
  2. package/dist/cdn/components/adr-wc.js +403 -0
  3. package/dist/cdn/components/analytics-panel.js +34 -0
  4. package/dist/cdn/components/author-index.js +3 -0
  5. package/dist/cdn/components/brand-mark.js +2 -0
  6. package/dist/cdn/components/calendar-wc.js +2 -2
  7. package/dist/cdn/components/carousel-wc.js +1 -1
  8. package/dist/cdn/components/chart-wc.js +25 -25
  9. package/dist/cdn/components/color-palette.js +13 -7
  10. package/dist/cdn/components/comment-wc.js +2 -0
  11. package/dist/cdn/components/consent-banner.js +1 -1
  12. package/dist/cdn/components/content-lens.js +2 -0
  13. package/dist/cdn/components/day-view.js +2 -0
  14. package/dist/cdn/components/empathy-map.js +42 -25
  15. package/dist/cdn/components/flow-diagram.js +2 -0
  16. package/dist/cdn/components/font-pairer.js +108 -0
  17. package/dist/cdn/components/gantt-chart.js +2 -0
  18. package/dist/cdn/components/geo-map.js +7 -7
  19. package/dist/cdn/components/glossary-wc.js +2 -0
  20. package/dist/cdn/components/gradient-builder.js +52 -0
  21. package/dist/cdn/components/highlight-wc.js +3 -0
  22. package/dist/cdn/components/manifest.json +134 -26
  23. package/dist/cdn/components/markdown-viewer.js +3 -3
  24. package/dist/cdn/components/motion-specimen.js +21 -0
  25. package/dist/cdn/components/note-wc.js +3 -0
  26. package/dist/cdn/components/notification-wc.js +37 -0
  27. package/dist/cdn/components/page-info.js +55 -24
  28. package/dist/cdn/components/page-toc.js +1 -1
  29. package/dist/cdn/components/popularity-index.js +9 -0
  30. package/dist/cdn/components/print-page.js +1 -1
  31. package/dist/cdn/components/recently-visited.js +3 -0
  32. package/dist/cdn/components/review-surface.js +541 -0
  33. package/dist/cdn/components/selection-menu.js +2 -0
  34. package/dist/cdn/components/semantic-palette.js +30 -0
  35. package/dist/cdn/components/settings-panel.js +55 -51
  36. package/dist/cdn/components/share-wc.js +2 -2
  37. package/dist/cdn/components/site-map-wc.js +2 -0
  38. package/dist/cdn/components/spacing-specimen.js +5 -5
  39. package/dist/cdn/components/split-surface.js +1 -1
  40. package/dist/cdn/components/text-reader.js +2 -2
  41. package/dist/cdn/components/theme-export.js +18 -0
  42. package/dist/cdn/components/theme-picker.js +58 -58
  43. package/dist/cdn/components/token-specimen.js +25 -20
  44. package/dist/cdn/components/topic-map.js +3 -0
  45. package/dist/cdn/components/trust-filter.js +4 -0
  46. package/dist/cdn/components/type-specimen.js +16 -13
  47. package/dist/cdn/components/user-journey.js +48 -30
  48. package/dist/cdn/components/user-persona.js +17 -15
  49. package/dist/cdn/components/user-story.js +55 -22
  50. package/dist/cdn/components/watch-wc.js +3 -0
  51. package/dist/cdn/components/week-view.js +2 -0
  52. package/dist/cdn/components/work-item.js +446 -0
  53. package/dist/cdn/packs/design-system.full.js +124 -47
  54. package/dist/cdn/packs/effects.full.js +1 -1
  55. package/dist/cdn/packs/kawaii.full.css +1 -1
  56. package/dist/cdn/packs/kawaii.full.js +1 -1
  57. package/dist/cdn/packs/kawaii.theme.css +1 -1
  58. package/dist/cdn/packs/manifest.json +10 -40
  59. package/dist/cdn/packs/prototype.full.js +1 -1
  60. package/dist/cdn/packs/ui.full.css +1 -1
  61. package/dist/cdn/packs/ui.full.js +50 -50
  62. package/dist/cdn/packs/ux-planning.full.css +1 -1
  63. package/dist/cdn/packs/ux-planning.full.js +1546 -92
  64. package/dist/cdn/themes/8bit.css +1 -1
  65. package/dist/cdn/themes/alpha1999.css +1 -1
  66. package/dist/cdn/themes/bauhaus.css +1 -1
  67. package/dist/cdn/themes/brutalist.css +1 -1
  68. package/dist/cdn/themes/claymorphism.css +1 -1
  69. package/dist/cdn/themes/cottagecore.css +1 -1
  70. package/dist/cdn/themes/cyber.css +1 -1
  71. package/dist/cdn/themes/genai.css +1 -1
  72. package/dist/cdn/themes/glassmorphism.css +1 -1
  73. package/dist/cdn/themes/kawaii.css +1 -1
  74. package/dist/cdn/themes/magna.css +1 -1
  75. package/dist/cdn/themes/manifest.json +20 -20
  76. package/dist/cdn/themes/nes.css +1 -1
  77. package/dist/cdn/themes/neumorphism.css +1 -1
  78. package/dist/cdn/themes/organic.css +1 -1
  79. package/dist/cdn/themes/rough.css +1 -1
  80. package/dist/cdn/themes/startup.css +1 -1
  81. package/dist/cdn/themes/super2026.css +1 -1
  82. package/dist/cdn/themes/terminal.css +1 -1
  83. package/dist/cdn/themes/vaporwave.css +1 -1
  84. package/dist/cdn/themes/win9x.css +1 -1
  85. package/dist/cdn/vanilla-breeze-charts.js +25 -25
  86. package/dist/cdn/vanilla-breeze-core.css +1 -1
  87. package/dist/cdn/vanilla-breeze-core.js +119 -47
  88. package/dist/cdn/vanilla-breeze-dev.js +1 -1
  89. package/dist/cdn/vanilla-breeze-extras.js +154 -74
  90. package/dist/cdn/vanilla-breeze.css +1 -1
  91. package/dist/cdn/vanilla-breeze.js +1988 -248
  92. package/package.json +8 -6
  93. package/dist/cdn/packs/retro.bundle.js +0 -2
  94. package/dist/cdn/packs/retro.components.js +0 -1
  95. package/dist/cdn/packs/retro.effects.css +0 -2
  96. package/dist/cdn/packs/retro.effects.js +0 -16
  97. package/dist/cdn/packs/retro.full.css +0 -5
  98. package/dist/cdn/packs/retro.full.js +0 -16
  99. package/dist/cdn/packs/retro.theme.css +0 -2
@@ -0,0 +1,383 @@
1
+ var c=`
2
+ :host {
3
+ --_bg: var(--adr-record-bg, var(--color-surface, #ffffff));
4
+ --_text: var(--adr-record-text, var(--color-text, #1a1a1a));
5
+ --_muted: var(--adr-record-muted, var(--color-text-muted, #666));
6
+ --_border: var(--adr-record-border, var(--color-border, #e0e0e0));
7
+ --_accent: var(--adr-record-accent, var(--color-interactive, #0066cc));
8
+ --_card-bg: var(--adr-record-card-bg, var(--color-surface-raised, #f8f9fa));
9
+ --_highlight: var(--adr-record-highlight, color-mix(in srgb, var(--_accent) 8%, transparent));
10
+ --_radius: var(--adr-record-radius, var(--radius-l, 0.75rem));
11
+ --_shadow: var(--adr-record-shadow, var(--shadow-sm));
12
+ --_shadow-hover: var(--adr-record-shadow-hover, var(--shadow-md));
13
+ --_duration: var(--adr-record-duration, var(--duration-normal, 200ms));
14
+ --_ease: var(--adr-record-ease, var(--ease-default, ease));
15
+ --_space-2xs: var(--adr-record-space-2xs, var(--size-2xs, 0.25rem));
16
+ --_space-xs: var(--adr-record-space-xs, var(--size-xs, 0.5rem));
17
+ --_space-s: var(--adr-record-space-s, var(--size-s, 0.75rem));
18
+ --_space-m: var(--adr-record-space-m, var(--size-m, 1rem));
19
+ --_font-xs: var(--adr-record-font-xs, var(--font-size-xs, 0.75rem));
20
+ --_font-sm: var(--adr-record-font-sm, var(--font-size-sm, 0.875rem));
21
+ --_font-md: var(--adr-record-font-md, var(--font-size-md, 1rem));
22
+ --_font-lg: var(--adr-record-font-lg, var(--font-size-lg, 1.125rem));
23
+ --_font-mono: var(--adr-record-font-mono, var(--font-mono, ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, monospace));
24
+ --_radius-s: var(--adr-record-radius-s, var(--radius-s, 0.25rem));
25
+ --_radius-full: var(--adr-record-radius-full, var(--radius-full, 9999px));
26
+
27
+ display: block;
28
+ font-family: var(--adr-record-font, var(--font-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif));
29
+ }
30
+
31
+ *, *::before, *::after { box-sizing: border-box; margin: 0; }
32
+
33
+ /* \u2500\u2500 Card \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
34
+ .adr-card {
35
+ background: var(--_bg);
36
+ border: 1px solid var(--_border);
37
+ border-radius: var(--_radius);
38
+ overflow: hidden;
39
+ box-shadow: var(--_shadow);
40
+ transition: box-shadow var(--_duration) var(--_ease);
41
+ }
42
+
43
+ .adr-card:hover {
44
+ box-shadow: var(--_shadow-hover);
45
+ }
46
+
47
+ /* \u2500\u2500 Header \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
48
+ .adr-header {
49
+ display: flex;
50
+ align-items: center;
51
+ justify-content: space-between;
52
+ padding: var(--_space-s) var(--_space-m);
53
+ background: var(--_card-bg);
54
+ border-block-end: 1px solid var(--_border);
55
+ gap: var(--_space-s);
56
+ flex-wrap: wrap;
57
+ }
58
+
59
+ .adr-meta {
60
+ display: flex;
61
+ align-items: center;
62
+ gap: var(--_space-xs);
63
+ flex-wrap: wrap;
64
+ min-width: 0;
65
+ }
66
+
67
+ .adr-id {
68
+ font-size: var(--_font-xs);
69
+ font-weight: 600;
70
+ color: var(--_muted);
71
+ font-family: var(--_font-mono);
72
+ }
73
+
74
+ /* \u2500\u2500 Status badge \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
75
+ .adr-badges {
76
+ display: flex;
77
+ align-items: center;
78
+ gap: var(--_space-xs);
79
+ }
80
+
81
+ .adr-status {
82
+ font-size: 11px;
83
+ padding: 4px 10px;
84
+ border-radius: var(--_radius-full);
85
+ font-weight: 600;
86
+ text-transform: uppercase;
87
+ letter-spacing: 0.3px;
88
+ }
89
+
90
+ .adr-date {
91
+ display: inline-flex;
92
+ align-items: center;
93
+ gap: 4px;
94
+ font-size: var(--_font-xs);
95
+ color: var(--_muted);
96
+ font-family: var(--_font-mono);
97
+ }
98
+
99
+ .adr-date svg {
100
+ width: 12px;
101
+ height: 12px;
102
+ }
103
+
104
+ /* \u2500\u2500 Body \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
105
+ .adr-body {
106
+ padding: 16px 20px;
107
+ }
108
+
109
+ .adr-title {
110
+ font-size: var(--_font-lg);
111
+ font-weight: 700;
112
+ color: var(--_text);
113
+ line-height: 1.4;
114
+ margin-block-end: 0;
115
+ }
116
+
117
+ /* \u2500\u2500 Supersedes / Superseded-by links \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
118
+ .adr-links {
119
+ display: flex;
120
+ flex-wrap: wrap;
121
+ gap: 4px;
122
+ margin-block-start: var(--_space-s);
123
+ }
124
+
125
+ .adr-links-label {
126
+ font-size: 11px;
127
+ font-weight: 600;
128
+ color: var(--_muted);
129
+ text-transform: uppercase;
130
+ letter-spacing: 0.3px;
131
+ margin-inline-end: var(--_space-2xs);
132
+ align-self: center;
133
+ }
134
+
135
+ .adr-link {
136
+ display: inline-flex;
137
+ align-items: center;
138
+ gap: 3px;
139
+ font-size: 11px;
140
+ font-weight: 500;
141
+ padding: 2px 8px;
142
+ border-radius: var(--_radius-s);
143
+ background: var(--_highlight);
144
+ color: var(--_accent);
145
+ text-decoration: none;
146
+ }
147
+
148
+ .adr-link:hover {
149
+ text-decoration: underline;
150
+ }
151
+
152
+ .adr-link svg {
153
+ width: 11px;
154
+ height: 11px;
155
+ }
156
+
157
+ /* \u2500\u2500 Sections \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
158
+ .adr-sections {
159
+ border-block-start: 1px solid var(--_border);
160
+ }
161
+
162
+ .adr-section {
163
+ padding: 14px 20px;
164
+ border-block-end: 1px solid var(--_border);
165
+ }
166
+
167
+ .adr-section:last-child {
168
+ border-block-end: none;
169
+ }
170
+
171
+ .adr-section-header {
172
+ display: flex;
173
+ align-items: center;
174
+ gap: var(--_space-xs);
175
+ margin-block-end: var(--_space-s);
176
+ }
177
+
178
+ .adr-section-icon {
179
+ width: 22px;
180
+ height: 22px;
181
+ border-radius: 5px;
182
+ display: flex;
183
+ align-items: center;
184
+ justify-content: center;
185
+ }
186
+
187
+ .adr-section-icon svg {
188
+ width: 13px;
189
+ height: 13px;
190
+ fill: white;
191
+ }
192
+
193
+ .adr-section-icon.context { background: #8b5cf6; }
194
+ .adr-section-icon.decision { background: #22c55e; }
195
+ .adr-section-icon.consequences { background: #f59e0b; }
196
+
197
+ .adr-section-title {
198
+ font-size: var(--_font-xs);
199
+ font-weight: 600;
200
+ color: var(--_muted);
201
+ text-transform: uppercase;
202
+ letter-spacing: 0.5px;
203
+ }
204
+
205
+ .adr-section-content {
206
+ color: var(--_text);
207
+ font-size: var(--_font-sm);
208
+ line-height: 1.6;
209
+ }
210
+
211
+ .adr-section-content ::slotted(ul),
212
+ .adr-section-content ::slotted(ol) {
213
+ margin: 0;
214
+ padding-inline-start: 20px;
215
+ }
216
+
217
+ .adr-section-content ::slotted(p) {
218
+ margin: 0;
219
+ }
220
+
221
+ .slot-fallback {
222
+ color: var(--_muted);
223
+ font-style: italic;
224
+ }
225
+
226
+ /* \u2500\u2500 Minimal detail \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
227
+ .adr-card--minimal {
228
+ padding: var(--_space-xs);
229
+ cursor: pointer;
230
+ }
231
+
232
+ .adr-card--minimal:hover {
233
+ box-shadow: var(--_shadow-hover);
234
+ }
235
+
236
+ .adr-card--minimal:focus-visible {
237
+ outline: 2px solid var(--_accent);
238
+ outline-offset: 2px;
239
+ }
240
+
241
+ .adr-card--minimal .adr-header { display: none; }
242
+ .adr-card--minimal .adr-sections { display: none; }
243
+ .adr-card--minimal .adr-links { display: none; }
244
+
245
+ .adr-card--minimal .adr-body {
246
+ padding: var(--_space-xs) var(--_space-s);
247
+ }
248
+
249
+ .adr-card--minimal .adr-title {
250
+ font-size: var(--_font-sm);
251
+ font-weight: 600;
252
+ }
253
+
254
+ .adr-card--minimal .adr-id {
255
+ display: block;
256
+ margin-block-end: var(--_space-2xs);
257
+ }
258
+
259
+ .adr-card--minimal .adr-status {
260
+ font-size: 10px;
261
+ padding: 2px 6px;
262
+ }
263
+
264
+ /* \u2500\u2500 Compact detail \u2014 hide empty sections \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
265
+ .adr-card--compact .adr-section[data-empty] {
266
+ display: none;
267
+ }
268
+
269
+ .adr-card--compact .slot-fallback {
270
+ display: none;
271
+ }
272
+
273
+ .adr-card--compact .adr-body {
274
+ padding: var(--_space-s) var(--_space-m);
275
+ }
276
+
277
+ /* \u2500\u2500 Responsive \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
278
+ @media (max-width: 480px) {
279
+ .adr-header {
280
+ flex-direction: column;
281
+ align-items: flex-start;
282
+ }
283
+
284
+ .adr-badges {
285
+ width: 100%;
286
+ justify-content: flex-start;
287
+ }
288
+ }
289
+
290
+ @media (prefers-reduced-motion: reduce) {
291
+ .adr-card {
292
+ transition: none;
293
+ }
294
+ }
295
+
296
+ @media print {
297
+ .adr-card {
298
+ box-shadow: none;
299
+ break-inside: avoid;
300
+ }
301
+ }
302
+
303
+ .state-msg { padding: var(--_space-m); font-size: var(--_font-sm); color: var(--_muted); font-style: italic; }
304
+ .state-msg--error { color: #dc2626; }
305
+ `;var v=window.matchMedia("(prefers-reduced-motion: reduce)");var h=new Map;function u(d,e,r={}){let a=r.priority??10,t={impl:e,bundle:r.bundle,contract:r.contract,priority:a},s=h.get(d);if(customElements.get(d)){if(!s||s.priority>=a){s&&s.priority===a&&s.impl!==e&&console.warn(`[VB Bundle] Tag <${d}> already registered by "${s.bundle}" (priority ${s.priority}). Skipping "${r.bundle}".`);return}console.warn(`[VB Bundle] Tag <${d}> defined by "${s.bundle}" cannot be replaced (customElements.define is permanent). "${r.bundle}" has higher priority but arrived late.`);return}if(s&&s.priority>=a){s.priority===a&&console.warn(`[VB Bundle] Tag <${d}> already registered by "${s.bundle}". Skipping "${r.bundle}" (first wins at equal priority).`);return}h.set(d,t),customElements.define(d,e)}function o(d){return String(d).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;")}function i(d){return`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${d}</svg>`}var l={user:'<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/>',pencil:'<path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/><path d="m15 5 4 4"/>',check:'<path d="M20 6 9 17l-5-5"/>',target:'<circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/>',alertTriangle:'<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/>',messageCircle:'<path d="M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719"/>',lightbulb:'<path d="M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5"/><path d="M9 18h6"/><path d="M10 22h4"/>',wrench:'<path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z"/>',heart:'<path d="M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5"/>',mapPin:'<path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/>',checkCircle:'<path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><path d="m9 11 3 3L22 4"/>',x:'<path d="M18 6 6 18"/><path d="m6 6 12 12"/>',download:'<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" x2="12" y1="15" y2="3"/>',send:'<path d="M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z"/><path d="m21.854 2.147-10.94 10.939"/>'},g={says:{label:"Says",icon:l.messageCircle,color:"#3b82f6"},thinks:{label:"Thinks",icon:l.lightbulb,color:"#8b5cf6"},does:{label:"Does",icon:l.wrench,color:"#f59e0b"},feels:{label:"Feels",icon:l.heart,color:"#ef4444"}};var f={proposed:{label:"Proposed",color:"#3b82f6",bg:"rgba(59, 130, 246, 0.1)"},accepted:{label:"Accepted",color:"#22c55e",bg:"rgba(34, 197, 94, 0.1)"},deprecated:{label:"Deprecated",color:"#f59e0b",bg:"rgba(245, 158, 11, 0.1)"},superseded:{label:"Superseded",color:"#6b7280",bg:"rgba(107, 114, 128, 0.1)"}},n={calendar:'<rect width="18" height="18" x="3" y="4" rx="2" ry="2"/><line x1="16" x2="16" y1="2" y2="6"/><line x1="8" x2="8" y1="2" y2="6"/><line x1="3" x2="21" y1="10" y2="10"/>',context:'<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" x2="8" y1="13" y2="13"/><line x1="16" x2="8" y1="17" y2="17"/><line x1="10" x2="8" y1="9" y2="9"/>',decision:'<path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><path d="m9 11 3 3L22 4"/>',consequences:'<path d="m16 16 3-8 3 8c-.87.65-1.92 1-3 1s-2.13-.35-3-1Z"/><path d="m2 16 3-8 3 8c-.87.65-1.92 1-3 1s-2.13-.35-3-1Z"/><path d="M7 21h10"/><path d="M12 3v18"/><path d="M3 7h2c2 0 5-1 7-2 2 1 5 2 7 2h2"/>',arrowRight:'<path d="M5 12h14"/><path d="m12 5 7 7-7 7"/>'},p=class extends HTMLElement{static get observedAttributes(){return["adr-id","title","status","date","supersedes","superseded-by","detail","compact","src"]}#e=new Map;constructor(){super(),this.attachShadow({mode:"open"})}#a(){for(let e of[...this.children]){let r=e.getAttribute("slot");r&&!this.getAttribute(r)&&this.#e.set(r,e.textContent.trim())}}_resolve(e){return this.getAttribute(e)||this.#e.get(e)||""}connectedCallback(){this.#a(),this.adrId&&!this.id&&(this.id=this.adrId),this.hasAttribute("src")&&this._loadSrc(this.getAttribute("src")),this.#r(),this.setAttribute("data-upgraded","")}disconnectedCallback(){this.removeAttribute("data-upgraded")}attributeChangedCallback(e,r,a){r!==a&&this.shadowRoot&&(e==="src"&&this.isConnected?this._loadSrc(a):this.#r())}get adrId(){return this._resolve("adr-id")||""}get adrTitle(){return this._resolve("title")||""}get status(){return this.getAttribute("status")||"proposed"}get date(){return this.getAttribute("date")||""}get supersedes(){let e=this.getAttribute("supersedes")||"";return e?e.split(",").map(r=>r.trim()).filter(Boolean):[]}get supersededBy(){let e=this.getAttribute("superseded-by")||"";return e?e.split(",").map(r=>r.trim()).filter(Boolean):[]}get _detailLevel(){return this.getAttribute("detail")?this.getAttribute("detail"):this.hasAttribute("compact")?"compact":"full"}get _minimalLabel(){return this.adrTitle||this.adrId||"ADR"}async _loadSrc(e){if(e){this.shadowRoot.innerHTML=`<style>${c}</style><div class="state-msg">Loading\u2026</div>`;try{let r=await fetch(e);if(!r.ok)throw new Error(`HTTP ${r.status}`);let a=await r.json();for(let[t,s]of[["adrId","adr-id"],["title","title"],["status","status"],["date","date"],["detail","detail"]])a[t]!=null&&this.setAttribute(s,String(a[t]));a.supersedes&&this.setAttribute("supersedes",Array.isArray(a.supersedes)?a.supersedes.join(","):a.supersedes),a.supersededBy&&this.setAttribute("superseded-by",Array.isArray(a.supersededBy)?a.supersededBy.join(","):a.supersededBy);for(let t of["context","decision","consequences"])a[t]&&this.#e.set(t,a[t]);this.#r()}catch(r){this.shadowRoot.innerHTML=`<style>${c}</style><div class="state-msg state-msg--error">Could not load: ${o(r.message)}</div>`}}}#r(){let e=f[this.status]||f.proposed,r=this._detailLevel,a=this.adrId?`ADR: ${o(this.adrId)}`:"Architectural Decision Record";if(r==="minimal"){this.shadowRoot.innerHTML=`<style>${c}</style>
306
+ <article class="adr-card adr-card--minimal" role="article" aria-label="${a}"
307
+ tabindex="0">
308
+ <div class="adr-body">
309
+ <div class="adr-meta">
310
+ ${this.adrId?`<span class="adr-id">${o(this.adrId)}</span>`:""}
311
+ <span class="adr-status" style="color:${e.color};background:${e.bg}">${o(e.label)}</span>
312
+ </div>
313
+ <p class="adr-title">${o(this._minimalLabel)}</p>
314
+ </div>
315
+ </article>`;return}if(this.shadowRoot.innerHTML=`<style>${c}</style>
316
+ <article class="adr-card adr-card--${r}" role="article" aria-label="${a}">
317
+
318
+ <header class="adr-header">
319
+ <div class="adr-meta">
320
+ ${this.adrId?`<span class="adr-id">${o(this.adrId)}</span>`:""}
321
+ ${this.date?`<span class="adr-date">${i(n.calendar)} ${o(this.date)}</span>`:""}
322
+ </div>
323
+ <div class="adr-badges">
324
+ <span class="adr-status" style="color:${e.color};background:${e.bg}">${o(e.label)}</span>
325
+ </div>
326
+ </header>
327
+
328
+ <div class="adr-body">
329
+ <h3 class="adr-title">${o(this.adrTitle||"[Untitled ADR]")}</h3>
330
+
331
+ ${this.supersedes.length?`
332
+ <div class="adr-links">
333
+ <span class="adr-links-label">Supersedes</span>
334
+ ${this.supersedes.map(t=>`<a class="adr-link" href="#${o(t)}">${i(n.arrowRight)} ${o(t)}</a>`).join("")}
335
+ </div>`:""}
336
+
337
+ ${this.supersededBy.length?`
338
+ <div class="adr-links">
339
+ <span class="adr-links-label">Superseded by</span>
340
+ ${this.supersededBy.map(t=>`<a class="adr-link" href="#${o(t)}">${i(n.arrowRight)} ${o(t)}</a>`).join("")}
341
+ </div>`:""}
342
+ </div>
343
+
344
+ <div class="adr-sections">
345
+ <div class="adr-section">
346
+ <div class="adr-section-header">
347
+ <div class="adr-section-icon context">
348
+ ${i(n.context)}
349
+ </div>
350
+ <span class="adr-section-title">Context</span>
351
+ </div>
352
+ <div class="adr-section-content">
353
+ <slot name="context"><em class="slot-fallback">No context provided.</em></slot>
354
+ </div>
355
+ </div>
356
+
357
+ <div class="adr-section">
358
+ <div class="adr-section-header">
359
+ <div class="adr-section-icon decision">
360
+ ${i(n.decision)}
361
+ </div>
362
+ <span class="adr-section-title">Decision</span>
363
+ </div>
364
+ <div class="adr-section-content">
365
+ <slot name="decision"><em class="slot-fallback">No decision recorded.</em></slot>
366
+ </div>
367
+ </div>
368
+
369
+ <div class="adr-section">
370
+ <div class="adr-section-header">
371
+ <div class="adr-section-icon consequences">
372
+ ${i(n.consequences)}
373
+ </div>
374
+ <span class="adr-section-title">Consequences</span>
375
+ </div>
376
+ <div class="adr-section-content">
377
+ <slot name="consequences"><em class="slot-fallback">No consequences documented.</em></slot>
378
+ </div>
379
+ </div>
380
+ </div>
381
+
382
+ </article>`,r==="compact")for(let t of this.shadowRoot.querySelectorAll(".adr-section")){let s=t.querySelector("slot");s&&s.assignedNodes().length===0&&t.setAttribute("data-empty","")}this.dispatchEvent(new CustomEvent("adr-record:ready",{detail:{adrId:this.adrId,title:this.adrTitle,status:this.status},bubbles:!0,composed:!0}))}};u("adr-record",p);export{p as AdrRecord};
383
+ //# sourceMappingURL=adr-record.js.map