vanilla-breeze 0.3.0 → 0.4.0

package/dist/cdn/components/work-item.js

@@ -1,447 +0,0 @@
-var c=`
-:host {
-  --_bg:        var(--work-item-bg, var(--color-surface, #ffffff));
-  --_text:      var(--work-item-text, var(--color-text, #1a1a1a));
-  --_muted:     var(--work-item-muted, var(--color-text-muted, #666));
-  --_border:    var(--work-item-border, var(--color-border, #e0e0e0));
-  --_accent:    var(--work-item-accent, var(--color-interactive, #0066cc));
-  --_card-bg:   var(--work-item-card-bg, var(--color-surface-raised, #f8f9fa));
-  --_highlight: var(--work-item-highlight, color-mix(in srgb, var(--_accent) 8%, transparent));
-  --_radius:    var(--work-item-radius, var(--radius-l, 0.75rem));
-  --_shadow:       var(--work-item-shadow, var(--shadow-sm));
-  --_shadow-hover: var(--work-item-shadow-hover, var(--shadow-md));
-  --_duration:     var(--work-item-duration, var(--duration-normal, 200ms));
-  --_ease:         var(--work-item-ease, var(--ease-default, ease));
-  --_space-2xs:    var(--work-item-space-2xs, var(--size-2xs, 0.25rem));
-  --_space-xs:     var(--work-item-space-xs, var(--size-xs, 0.5rem));
-  --_space-s:      var(--work-item-space-s, var(--size-s, 0.75rem));
-  --_space-m:      var(--work-item-space-m, var(--size-m, 1rem));
-  --_font-xs:      var(--work-item-font-xs, var(--font-size-xs, 0.75rem));
-  --_font-sm:      var(--work-item-font-sm, var(--font-size-sm, 0.875rem));
-  --_font-md:      var(--work-item-font-md, var(--font-size-md, 1rem));
-  --_font-lg:      var(--work-item-font-lg, var(--font-size-lg, 1.125rem));
-  --_font-mono:    var(--work-item-font-mono, var(--font-mono, ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, monospace));
-  --_radius-s:     var(--work-item-radius-s, var(--radius-s, 0.25rem));
-  --_radius-full:  var(--work-item-radius-full, var(--radius-full, 9999px));
-
-  display: block;
-  font-family: var(--work-item-font, var(--font-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif));
-}
-
-*, *::before, *::after { box-sizing: border-box; margin: 0; }
-
-/* \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 */
-.wi-card {
-  background: var(--_bg);
-  border: 1px solid var(--_border);
-  border-radius: var(--_radius);
-  overflow: hidden;
-  box-shadow: var(--_shadow);
-  transition: box-shadow var(--_duration) var(--_ease);
-}
-
-.wi-card:hover {
-  box-shadow: var(--_shadow-hover);
-}
-
-/* \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 */
-.wi-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: var(--_space-s) var(--_space-m);
-  background: var(--_card-bg);
-  border-block-end: 1px solid var(--_border);
-  gap: var(--_space-s);
-  flex-wrap: wrap;
-}
-
-.wi-meta {
-  display: flex;
-  align-items: center;
-  gap: var(--_space-xs);
-  flex-wrap: wrap;
-  min-width: 0;
-}
-
-.wi-id {
-  font-size: var(--_font-xs);
-  font-weight: 600;
-  color: var(--_muted);
-  font-family: var(--_font-mono);
-}
-
-/* \u2500\u2500 Type 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\u2500\u2500 */
-.wi-type {
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-  font-size: 11px;
-  font-weight: 600;
-  padding: 3px 8px;
-  border-radius: var(--_radius-s);
-  text-transform: capitalize;
-}
-
-.wi-type svg {
-  width: 12px;
-  height: 12px;
-}
-
-/* Type colors \u2014 driven by VB theme tokens, with color-mix surfaces so the
-   pill background shifts with the active theme. */
-.wi-type[data-type="task"]    { color: var(--color-info,    #3b82f6); background: color-mix(in oklch, var(--color-info,    #3b82f6) 12%, transparent); }
-.wi-type[data-type="bug"]     { color: var(--color-error,   #dc2626); background: color-mix(in oklch, var(--color-error,   #dc2626) 12%, transparent); }
-.wi-type[data-type="chore"]   { color: var(--color-text-muted, #6b7280); background: color-mix(in oklch, var(--color-text-muted, #6b7280) 12%, transparent); }
-.wi-type[data-type="spike"]   { color: var(--color-accent,  #8b5cf6); background: color-mix(in oklch, var(--color-accent,  #8b5cf6) 12%, transparent); }
-.wi-type[data-type="feature"] { color: var(--color-success, #059669); background: color-mix(in oklch, var(--color-success, #059669) 12%, transparent); }
-
-/* \u2500\u2500 Badges \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 */
-.wi-badges {
-  display: flex;
-  align-items: center;
-  gap: var(--_space-xs);
-}
-
-.wi-priority,
-.wi-status {
-  font-size: 11px;
-  padding: 4px 10px;
-  border-radius: var(--_radius-full);
-  font-weight: 600;
-  text-transform: uppercase;
-  letter-spacing: 0.3px;
-}
-
-.wi-estimate {
-  width: 28px;
-  height: 28px;
-  border-radius: var(--_radius-full);
-  background: var(--_accent);
-  color: white;
-  font-size: var(--_font-xs);
-  font-weight: 700;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-/* \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 */
-.wi-body {
-  padding: 16px 20px;
-}
-
-.wi-title-wrap {
-  margin-block-end: var(--_space-xs);
-}
-
-.wi-title-wrap:last-child {
-  margin-block-end: 0;
-}
-
-::slotted([slot="title"]) {
-  font-size: var(--_font-lg) !important;
-  font-weight: 700 !important;
-  color: var(--_text) !important;
-  line-height: 1.4 !important;
-  margin: 0 !important;
-}
-
-.wi-title-fallback {
-  font-size: var(--_font-lg);
-  font-weight: 700;
-  color: var(--_text);
-  line-height: 1.4;
-}
-
-.wi-title:last-child {
-  margin-block-end: 0;
-}
-
-/* \u2500\u2500 Assignee \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 */
-.wi-assignee {
-  display: inline-flex;
-  align-items: center;
-  gap: 5px;
-  font-size: var(--_font-xs);
-  color: var(--_muted);
-  margin-block-start: var(--_space-xs);
-}
-
-.wi-assignee__avatar {
-  width: 20px;
-  height: 20px;
-  border-radius: var(--_radius-full);
-  font-size: 9px;
-  font-weight: 700;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--color-text-inverted, #fff);
-  flex-shrink: 0;
-}
-
-/* \u2500\u2500 Linked stories \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 */
-.wi-links {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 4px;
-  margin-block-start: var(--_space-s);
-}
-
-.wi-link {
-  display: inline-flex;
-  align-items: center;
-  gap: 3px;
-  font-size: 11px;
-  font-weight: 500;
-  padding: 2px 8px;
-  border-radius: var(--_radius-s);
-  background: var(--_highlight);
-  color: var(--_accent);
-  text-decoration: none;
-}
-
-.wi-link:hover {
-  text-decoration: underline;
-}
-
-.wi-link svg {
-  width: 11px;
-  height: 11px;
-}
-
-/* \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 */
-.wi-sections {
-  border-block-start: 1px solid var(--_border);
-}
-
-.wi-section {
-  padding: 14px 20px;
-  border-block-end: 1px solid var(--_border);
-}
-
-.wi-section:last-child {
-  border-block-end: none;
-}
-
-.wi-section-header {
-  display: flex;
-  align-items: center;
-  gap: var(--_space-xs);
-  margin-block-end: var(--_space-s);
-}
-
-.wi-section-icon {
-  width: 22px;
-  height: 22px;
-  border-radius: 5px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.wi-section-icon svg {
-  width: 13px;
-  height: 13px;
-  fill: var(--color-text-inverted, #fff);
-}
-
-.wi-section-icon.description { background: var(--color-info,    #3b82f6); }
-.wi-section-icon.checklist   { background: var(--color-success, #22c55e); }
-.wi-section-icon.notes       { background: var(--color-warning, #f59e0b); }
-
-.wi-section-title {
-  font-size: var(--_font-xs);
-  font-weight: 600;
-  color: var(--_muted);
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-}
-
-.wi-section-content {
-  color: var(--_text);
-  font-size: var(--_font-sm);
-  line-height: 1.6;
-}
-
-.wi-section-content ::slotted(ul),
-.wi-section-content ::slotted(ol) {
-  margin: 0;
-  padding-inline-start: 20px;
-}
-
-.wi-section-content ::slotted(p) {
-  margin: 0;
-}
-
-.slot-fallback {
-  color: var(--_muted);
-  font-style: italic;
-}
-
-/* \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 */
-.wi-card--minimal {
-  padding: var(--_space-xs);
-  cursor: pointer;
-}
-
-.wi-card--minimal:hover {
-  box-shadow: var(--_shadow-hover);
-}
-
-.wi-card--minimal:focus-visible {
-  outline: 2px solid var(--_accent);
-  outline-offset: 2px;
-}
-
-.wi-card--minimal .wi-header { display: none; }
-.wi-card--minimal .wi-sections { display: none; }
-.wi-card--minimal .wi-links { display: none; }
-.wi-card--minimal .wi-assignee { display: none; }
-
-.wi-card--minimal .wi-body {
-  padding: var(--_space-xs) var(--_space-s);
-}
-
-.wi-card--minimal .wi-title-fallback,
-.wi-card--minimal ::slotted([slot="title"]) {
-  font-size: var(--_font-sm) !important;
-  font-weight: 600 !important;
-}
-
-.wi-card--minimal .wi-id {
-  display: block;
-  margin-block-end: var(--_space-2xs);
-}
-
-.wi-card--minimal .wi-type {
-  font-size: 10px;
-  padding: 2px 6px;
-}
-
-/* \u2500\u2500 Compact detail \u2014 hide empty sections \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
-.wi-card--compact .wi-section[data-empty] {
-  display: none;
-}
-
-.wi-card--compact .slot-fallback {
-  display: none;
-}
-
-.wi-card--compact .wi-body {
-  padding: var(--_space-s) var(--_space-m);
-}
-
-/* \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 */
-@media (max-width: 480px) {
-  .wi-header {
-    flex-direction: column;
-    align-items: flex-start;
-  }
-
-  .wi-badges {
-    width: 100%;
-    justify-content: flex-start;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .wi-card {
-    transition: none;
-  }
-}
-
-@media print {
-  .wi-card {
-    box-shadow: none;
-    break-inside: avoid;
-  }
-}
-
-.state-msg        { padding: var(--_space-m); font-size: var(--_font-sm); color: var(--_muted); font-style: italic; }
-.state-msg--error { color: var(--color-error-text, var(--color-error, #dc2626)); }
-`;var _=window.matchMedia("(prefers-reduced-motion: reduce)");var v=new Map;function w(r,t,e={}){let i=e.priority??10,o={impl:t,bundle:e.bundle,contract:e.contract,priority:i},s=v.get(r);if(customElements.get(r)){if(!s||s.priority>=i){s&&s.priority===i&&s.impl!==t&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${s.bundle}" (priority ${s.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${r}> defined by "${s.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(s&&s.priority>=i){s.priority===i&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${s.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}v.set(r,o),customElements.define(r,t)}function a(r){return String(r).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;")}function b(r){return r.split(" ").map(t=>t[0]).join("").toUpperCase().slice(0,2)}function y(r){let t=0;for(let i=0;i<r.length;i++)t=r.charCodeAt(i)+((t<<5)-t);return`hsl(${(t%360+360)%360}, 65%, 55%)`}function d(r){return`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${r}</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"/>'},$={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 x={task:'<rect x="3" y="3" width="18" height="18" rx="2"/><path d="m9 12 2 2 4-4"/>',bug:'<path d="m8 2 1.88 1.88"/><path d="M14.12 3.88 16 2"/><path d="M9 7.13v-1a3.003 3.003 0 1 1 6 0v1"/><path d="M12 20c-3.3 0-6-2.7-6-6v-3a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v3c0 3.3-2.7 6-6 6"/><path d="M12 20v-9"/><path d="M6.53 9C4.6 8.8 3 7.1 3 5"/><path d="M6 13H2"/><path d="M3 21c0-2.1 1.7-3.9 3.8-4"/><path d="M20.97 5c0 2.1-1.6 3.8-3.5 4"/><path d="M22 13h-4"/><path d="M17.2 17c2.1.1 3.8 1.9 3.8 4"/>',chore:'<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"/>',spike:'<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"/>',feature:'<circle cx="12" cy="12" r="10"/><path d="m9 12 2 2 4-4"/>'},h={critical:{label:"Critical",color:"#dc2626",bg:"rgba(220, 38, 38, 0.1)"},high:{label:"High",color:"#ea580c",bg:"rgba(234, 88, 12, 0.1)"},medium:{label:"Medium",color:"#ca8a04",bg:"rgba(202, 138, 4, 0.1)"},low:{label:"Low",color:"#16a34a",bg:"rgba(22, 163, 74, 0.1)"}},m={backlog:{label:"Backlog",color:"#6b7280",bg:"rgba(107, 114, 128, 0.1)"},"to-do":{label:"To Do",color:"#3b82f6",bg:"rgba(59, 130, 246, 0.1)"},"in-progress":{label:"In Progress",color:"#8b5cf6",bg:"rgba(139, 92, 246, 0.1)"},review:{label:"Review",color:"#f59e0b",bg:"rgba(245, 158, 11, 0.1)"},done:{label:"Done",color:"#22c55e",bg:"rgba(34, 197, 94, 0.1)"},blocked:{label:"Blocked",color:"#dc2626",bg:"rgba(220, 38, 38, 0.1)"}},u=class extends HTMLElement{static get observedAttributes(){return["item-id","type","priority","status","estimate","assignee","story-ids","detail","compact","src"]}#e=new Map;constructor(){super(),this.attachShadow({mode:"open"})}#i(){for(let t of[...this.children]){let e=t.getAttribute("slot");e&&this.#e.set(e,t.textContent.trim())}}_resolve(t){return this.getAttribute(t)||this.#e.get(t)||""}connectedCallback(){this.#i(),this.itemId&&!this.id&&(this.id=this.itemId),this.hasAttribute("src")&&this._loadSrc(this.getAttribute("src")),this.#t(),this.setAttribute("data-upgraded","")}disconnectedCallback(){this.removeAttribute("data-upgraded")}attributeChangedCallback(t,e,i){e!==i&&this.shadowRoot&&(t==="src"&&this.isConnected?this._loadSrc(i):this.#t())}get itemId(){return this.getAttribute("item-id")||""}get itemTitle(){return this.querySelector('[slot="title"]')?.textContent?.trim()||this.#e.get("title")||""}get itemType(){return this.getAttribute("type")||"task"}get priority(){return this.getAttribute("priority")||"medium"}get status(){return this.getAttribute("status")||"backlog"}get estimate(){return this.getAttribute("estimate")||""}get assignee(){return this.getAttribute("assignee")||""}get storyIds(){let t=this.getAttribute("story-ids")||"";return t?t.split(",").map(e=>e.trim()).filter(Boolean):[]}get _detailLevel(){return this.getAttribute("detail")?this.getAttribute("detail"):this.hasAttribute("compact")?"compact":"full"}get _minimalLabel(){return this.itemTitle||this.itemId||"Work item"}updateStatus(t){m[t]&&(this.setAttribute("status",t),this.dispatchEvent(new CustomEvent("work-item:status",{detail:{status:t,itemId:this.itemId},bubbles:!0,composed:!0})))}updatePriority(t){h[t]&&(this.setAttribute("priority",t),this.dispatchEvent(new CustomEvent("work-item:priority",{detail:{priority:t,itemId:this.itemId},bubbles:!0,composed:!0})))}get data(){return{itemId:this.itemId||void 0,type:this.itemType,priority:this.priority,status:this.status,estimate:this.estimate||void 0,assignee:this.assignee||void 0,storyIds:this.storyIds.length?this.storyIds:void 0,detail:this.getAttribute("detail")||void 0,title:this.itemTitle||void 0}}set data(t){!t||typeof t!="object"||(this._applyData(t),this.shadowRoot&&this.#t(),this.dispatchEvent(new CustomEvent("work-item:data-changed",{detail:{data:this.data,source:"property"},bubbles:!0,composed:!0})))}_applyData(t){for(let[e,i]of[["itemId","item-id"],["type","type"],["priority","priority"],["status","status"],["estimate","estimate"],["assignee","assignee"],["detail","detail"]])t[e]!=null&&this.setAttribute(i,String(t[e]));if(t.storyIds&&this.setAttribute("story-ids",Array.isArray(t.storyIds)?t.storyIds.join(","):String(t.storyIds)),t.title&&!this.querySelector('[slot="title"]')){let e=document.createElement("h3");e.slot="title",e.textContent=String(t.title),this.appendChild(e)}for(let e of["description","notes"])if(t[e]&&!this.querySelector(`[slot="${e}"]`)){let i=document.createElement("p");i.slot=e,i.textContent=String(t[e]),this.appendChild(i)}if(t.checklist&&!this.querySelector('[slot="checklist"]')){let e=document.createElement("ul");e.slot="checklist";let i=Array.isArray(t.checklist)?t.checklist:[t.checklist];for(let o of i){let s=document.createElement("li");s.textContent=String(o),e.appendChild(s)}this.appendChild(e)}}async _loadSrc(t){if(!t)return;let e=this.shadowRoot;e.innerHTML=`<style>${c}</style><div class="state-msg">Loading\u2026</div>`;try{let i=await fetch(t);if(!i.ok)throw new Error(`HTTP ${i.status}`);let o=await i.json();this._applyData(o),this.#t()}catch(i){e.innerHTML=`<style>${c}</style><div class="state-msg state-msg--error">Could not load: ${a(i.message)}</div>`}}#t(){let t=this.shadowRoot,e=h[this.priority]||h.medium,i=m[this.status]||m.backlog,o=this.itemType,s=x[o]||x.task,p=this._detailLevel,f=this.itemId?`Work item: ${a(this.itemId)}`:"Work item";if(p==="minimal"){t.innerHTML=`<style>${c}</style>
-        <article class="wi-card wi-card--minimal" role="article" aria-label="${f}"
-          tabindex="0">
-          <div class="wi-body">
-            <div class="wi-meta">
-              ${this.itemId?`<span class="wi-id">${a(this.itemId)}</span>`:""}
-              <span class="wi-type" data-type="${a(o)}">${d(s)} ${a(o)}</span>
-            </div>
-            <div class="wi-title-wrap">
-              <slot name="title"><span class="wi-title-fallback">${a(this._minimalLabel)}</span></slot>
-            </div>
-          </div>
-        </article>`;return}if(t.innerHTML=`<style>${c}</style>
-      <article class="wi-card wi-card--${p}" role="article" aria-label="${f}">
-
-        <header class="wi-header">
-          <div class="wi-meta">
-            ${this.itemId?`<span class="wi-id">${a(this.itemId)}</span>`:""}
-            <span class="wi-type" data-type="${a(o)}">${d(s)} ${a(o)}</span>
-          </div>
-          <div class="wi-badges">
-            <span class="wi-priority" style="color:${e.color};background:${e.bg}">${a(e.label)}</span>
-            <span class="wi-status" style="color:${i.color};background:${i.bg}">${a(i.label)}</span>
-            ${this.estimate?`<span class="wi-estimate" title="Estimate">${a(this.estimate)}</span>`:""}
-          </div>
-        </header>
-
-        <div class="wi-body">
-          <div class="wi-title-wrap">
-            <slot name="title"><span class="wi-title-fallback">[Untitled work item]</span></slot>
-          </div>
-
-          ${this.assignee?`
-            <div class="wi-assignee">
-              <span class="wi-assignee__avatar" style="background:${y(this.assignee)}">${b(this.assignee)}</span>
-              ${a(this.assignee)}
-            </div>`:""}
-
-          ${this.storyIds.length?`
-            <div class="wi-links">
-              ${this.storyIds.map(n=>`<a class="wi-link" href="#${a(n)}">${d('<rect x="3" y="3" width="18" height="18" rx="2"/><path d="M7 7h10"/><path d="M7 12h10"/><path d="M7 17h10"/>')} ${a(n)}</a>`).join("")}
-            </div>`:""}
-        </div>
-
-        <div class="wi-sections">
-          <div class="wi-section">
-            <div class="wi-section-header">
-              <div class="wi-section-icon description">
-                <svg viewBox="0 0 24 24"><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"/></svg>
-              </div>
-              <span class="wi-section-title">Description</span>
-            </div>
-            <div class="wi-section-content">
-              <slot name="description"><em class="slot-fallback">No description.</em></slot>
-            </div>
-          </div>
-
-          <div class="wi-section">
-            <div class="wi-section-header">
-              <div class="wi-section-icon checklist">
-                <svg viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
-              </div>
-              <span class="wi-section-title">Checklist</span>
-            </div>
-            <div class="wi-section-content">
-              <slot name="checklist"><em class="slot-fallback">No checklist items.</em></slot>
-            </div>
-          </div>
-
-          <div class="wi-section">
-            <div class="wi-section-header">
-              <div class="wi-section-icon notes">
-                <svg viewBox="0 0 24 24"><path d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"/></svg>
-              </div>
-              <span class="wi-section-title">Notes</span>
-            </div>
-            <div class="wi-section-content">
-              <slot name="notes"><em class="slot-fallback">No notes.</em></slot>
-            </div>
-          </div>
-        </div>
-
-      </article>`,p==="compact")for(let n of t.querySelectorAll(".wi-section")){let g=n.querySelector("slot");g&&g.assignedNodes().length===0&&n.setAttribute("data-empty","")}this.dispatchEvent(new CustomEvent("work-item:ready",{detail:{itemId:this.itemId,title:this.itemTitle,type:o,priority:this.priority,status:this.status},bubbles:!0,composed:!0}))}};w("work-item",u);export{u as WorkItem};
-//# sourceMappingURL=work-item.js.map

package/dist/cdn/packs/design-system.full.css

@@ -1,2 +0,0 @@
-color-palette:not(:defined){display:block}color-palette{display:block}color-palette .palette{display:flex;flex-wrap:wrap;gap:var(--size-xs, .5rem)}color-palette .palette.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}color-palette .palette.list{flex-direction:column}color-palette .palette.list .swatch-wrap{flex-direction:row;align-items:center;gap:var(--size-s, .75rem)}color-palette .palette.list .color-box{inline-size:36px!important;block-size:36px!important}color-palette .swatch-wrap{display:flex;flex-direction:column;align-items:center;gap:var(--size-2xs, .25rem)}color-palette .color-box{position:relative;border:1px solid oklch(0% 0 0 / .15);border-radius:var(--radius-s, .25rem);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;font-family:var(--font-mono, monospace);transition:transform .15s ease,box-shadow .15s ease;overflow:hidden}color-palette .color-box:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000026;z-index:1}color-palette .color-box:focus-visible{outline:2px solid var(--color-focus-ring, currentColor);outline-offset:2px}color-palette .color-value{font-size:.625rem;line-height:1.2;opacity:0;transition:opacity .15s ease;text-align:center;padding:2px 4px;word-break:break-all}color-palette .color-box:hover .color-value,color-palette .color-box:focus-visible .color-value,color-palette .color-value.visible{opacity:1}color-palette .color-box.copied:after{content:"Copied!";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0009;color:#fff;font-size:var(--font-size-xs, .75rem);font-weight:600;font-family:var(--font-sans, system-ui);border-radius:inherit}color-palette .color-name{font-size:var(--font-size-xs, .75rem);color:var(--color-text-muted, #666);text-align:center;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}type-specimen:not(:defined){display:block}type-specimen{display:block}type-specimen .specimen-header{margin-block-end:var(--size-s, .75rem)}type-specimen .specimen-label{display:block;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted, #666);margin-block-end:var(--size-2xs, .25rem);font-family:var(--font-sans, system-ui)}type-specimen .specimen-sample{font-size:var(--font-size-3xl, 1.875rem);line-height:1.2;margin:0;padding:var(--size-xs, .5rem);border:1px dashed transparent;border-radius:var(--radius-s, .25rem);transition:border-color .15s ease;cursor:text}type-specimen .specimen-sample:hover{border-color:var(--color-border, #ddd)}type-specimen .specimen-sample:focus{outline:none;border-color:var(--color-primary, #333)}type-specimen .specimen-chars{display:flex;flex-direction:column;gap:var(--size-2xs, .25rem);margin-block-end:var(--size-s, .75rem);padding:var(--size-xs, .5rem);background:var(--color-surface-raised, #f8f8f8);border-radius:var(--radius-s, .25rem)}type-specimen .char-row{display:flex;flex-wrap:wrap;gap:2px;align-items:center;font-size:var(--font-size-sm, .875rem)}type-specimen .char-label{font-family:var(--font-sans, system-ui);font-size:var(--font-size-xs, .75rem);font-weight:600;color:var(--color-text-muted, #666);inline-size:3.5rem;flex-shrink:0}type-specimen .char-row span:not(.char-label){inline-size:1.25em;text-align:center}type-specimen .specimen-weights{display:flex;flex-wrap:wrap;gap:var(--size-s, .75rem);margin-block-end:var(--size-s, .75rem)}type-specimen .weight-sample{display:flex;flex-direction:column;align-items:center;gap:2px}type-specimen .weight-label{font-family:var(--font-mono, monospace);font-size:var(--font-size-xs, .75rem);color:var(--color-text-muted, #666)}type-specimen .weight-text{font-size:var(--font-size-2xl, 1.5rem)}type-specimen .specimen-scale{display:flex;flex-direction:column;gap:var(--size-2xs, .25rem)}type-specimen .scale-step{display:flex;align-items:baseline;gap:var(--size-s, .75rem);line-height:1.3}type-specimen .scale-label{font-family:var(--font-mono, monospace);font-size:var(--font-size-xs, .75rem);color:var(--color-text-muted, #666);inline-size:2.5rem;flex-shrink:0;text-align:end}type-specimen .scale-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}spacing-specimen:not(:defined){display:block}spacing-specimen{display:block}spacing-specimen .specimen-label{display:block;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted, #666);margin-block-end:var(--size-s, .75rem);font-family:var(--font-sans, system-ui)}spacing-specimen .specimen-scale{display:flex;flex-direction:column;gap:var(--size-2xs, .25rem)}spacing-specimen .scale-step{display:grid;grid-template-columns:3rem 1fr auto;align-items:center;gap:var(--size-s, .75rem);min-block-size:1.75rem}spacing-specimen .scale-name{font-family:var(--font-mono, monospace);font-size:var(--font-size-sm, .875rem);color:var(--color-text-muted, #666);text-align:end}spacing-specimen .scale-bar{display:block;block-size:var(--size-m, 1rem);min-inline-size:2px;background:var(--color-interactive, oklch(55% .2 260));border-radius:var(--radius-s, .25rem);transition:inline-size .3s ease}spacing-specimen .scale-value{font-family:var(--font-mono, monospace);font-size:var(--font-size-xs, .75rem);color:var(--color-text-muted, #666);font-variant-numeric:tabular-nums;min-inline-size:3.5rem;text-align:end}token-specimen:not(:defined){display:block;min-height:2rem}token-specimen{display:block}component-sampler:not(:defined){display:block}component-sampler{display:block}[data-list=do-dont],[data-list=pro-con]{list-style:none;padding-inline-start:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:var(--size-s, .5rem)}[data-list]>[data-do],[data-list]>[data-pro]{padding:var(--size-s, .5rem) var(--size-m, 1rem);border-inline-start:4px solid var(--color-success, oklch(55% .2 145));background:var(--color-success-subtle, oklch(95% .03 145));border-radius:var(--radius-s, .25rem)}[data-list]>[data-dont],[data-list]>[data-con]{padding:var(--size-s, .5rem) var(--size-m, 1rem);border-inline-start:4px solid var(--color-error, oklch(55% .22 25));background:var(--color-error-subtle, oklch(95% .03 25));border-radius:var(--radius-s, .25rem)}[data-list=do-dont]>[data-do]:before{content:"Do";display:block;font-weight:700;font-size:var(--font-size-xs, .75rem);color:var(--color-success, oklch(45% .2 145));margin-block-end:var(--size-2xs, .25rem);text-transform:uppercase;letter-spacing:.05em}[data-list=do-dont]>[data-dont]:before{content:"Don\2019t";display:block;font-weight:700;font-size:var(--font-size-xs, .75rem);color:var(--color-error, oklch(45% .22 25));margin-block-end:var(--size-2xs, .25rem);text-transform:uppercase;letter-spacing:.05em}[data-list=pro-con]>[data-pro]:before{content:"Pro";display:block;font-weight:700;font-size:var(--font-size-xs, .75rem);color:var(--color-success, oklch(45% .2 145));margin-block-end:var(--size-2xs, .25rem);text-transform:uppercase;letter-spacing:.05em}[data-list=pro-con]>[data-con]:before{content:"Con";display:block;font-weight:700;font-size:var(--font-size-xs, .75rem);color:var(--color-error, oklch(45% .22 25));margin-block-end:var(--size-2xs, .25rem);text-transform:uppercase;letter-spacing:.05em}.ds-token-table{width:100%;border-collapse:collapse;font-size:var(--font-size-s, .875rem)}.ds-token-table thead{border-block-end:2px solid var(--color-border, #ddd)}.ds-token-table th{text-align:start;padding:var(--size-xs, .25rem) var(--size-s, .5rem);font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted, #666)}.ds-token-table td{padding:var(--size-xs, .25rem) var(--size-s, .5rem);border-block-end:1px solid var(--color-border, #eee);vertical-align:middle}.ds-token-table code{font-family:var(--font-mono, monospace);font-size:var(--font-size-xs, .75rem)}.ds-token-table .ds-swatch{display:inline-block;width:2.5rem;height:1.5rem;border-radius:var(--radius-s, .25rem);border:1px solid var(--color-border, #ddd);vertical-align:middle}.ds-token-table token-swatch{display:inline-flex}.ds-token-table token-swatch>[data-preview]{width:2.5rem;height:1.5rem;border-radius:var(--radius-s, .25rem);border:1px solid var(--color-border, #ddd)}
-/*# sourceMappingURL=design-system.full.css.map */