@brightspot/ui 6.8.0 → 6.8.1

package/dist/storybook/assets/{ActionBar.stories-CJBn-mku.js → ActionBar.stories-BOXYJYXy.js}

@@ -1,4 +1,7 @@
-import{g as p,x as e}from"./iframe-B9buZjP7.js";import{o as u}from"./style-map-qCiIYcp5.js";import"./preload-helper-PPVm8Dsz.js";const{events:y,args:v,argTypes:a}=p("btu-action-bar"),x={title:"Components/Action Bar",component:"btu-action-bar",tags:["autodocs"],parameters:{docs:{subtitle:"A persistent container for primary, secondary, tertiary, and destructive actions",description:{component:`
+import{i as C,x as l,g as z}from"./iframe-Byo_x5o2.js";import{o as k}from"./style-map-DxZm5Cj7.js";import{n as b}from"./property-_few0Xe5.js";import{E as I,R as A}from"./ReadyMixin-C8HW2nGE.js";import{R as P}from"./RovingTabindexMixin-DI5rmyR7.js";import"./DropdownMenu-WoWnJiQk.js";import"./ActionItem-WoDvowFu.js";import"./preload-helper-PPVm8Dsz.js";import"./aria-D5THOgos.js";import"./TooltipMixin-CRNNusJ7.js";import"./Icon-DPQKiWDz.js";import"./Badge-AV20mCMJ.js";import"./if-defined-DL7cQU7O.js";import"./CircularProgress-BeE2fWON.js";import"./ProgressMixin-D1atDw3n.js";var T=Object.defineProperty,d=(n,t,e,a)=>{for(var i=void 0,o=n.length-1,r;o>=0;o--)(r=n[o])&&(i=r(t,e,i)||i);return i&&T(t,e,i),i};const u={tertiary:0,secondary:1,primary:2,destructive:0};class m extends P(I(A(C))){constructor(){super(...arguments),this.position="bottom",this.sticky=!1,this.alignment="default",this.shadow=!1,this.label="",this.compact=!1,this.initialClasses=[],this._initialClassesCaptured=!1,this._items=[],this._startZone=null,this._endZone=null,this._moreDropdown=null,this._ro=null,this._rafId=null,this._expandedWidths=new Map,this._compactedWidths=new Map,this._hasOverflow=!1,this._compactedItems=new Set,this._boundKeydown=this._handleKeydown.bind(this)}createRenderRoot(){return this}_getRovingTargets(){const t=[];if(this._startZone){for(const e of this._startZone.querySelectorAll("btu-action-item"))if(e.style.display!=="none"){const a=e.querySelector("button");a&&t.push(a)}}if(this._moreDropdown&&this._moreDropdown.style.display!=="none"){const e=this._moreDropdown.querySelector("button");e&&t.push(e)}for(const e of this._getEndZoneItems())if(e.style.display!=="none"){const a=e.querySelector("button");a&&t.push(a)}return t}connectedCallback(){this._initialClassesCaptured||(this.className&&(this.initialClasses=this.className.split(" ").filter(t=>t.trim())),this._initialClassesCaptured=!0),this._items=Array.from(this.querySelectorAll("btu-action-item")),this._items.forEach(t=>t.remove()),this.setAttribute("role","toolbar"),this.setAttribute("aria-orientation","horizontal"),super.connectedCallback(),this.addEventListener("keydown",this._boundKeydown)}willUpdate(){const t=[...this.initialClasses,"btu-action-bar"];this.className=t.filter(Boolean).join(" "),this.label?this.setAttribute("aria-label",this.label):this.removeAttribute("aria-label")}firstUpdated(){if(this._startZone=this.querySelector(".btu-action-bar-start"),this._endZone=this.querySelector(".btu-action-bar-end"),!(!this._startZone||!this._endZone)){for(const t of this._items)(this._getItemZone(t)==="start"?this._startZone:this._endZone).appendChild(t);this._sortEndZoneItems(),this._createOverflowDropdown(this._endZone),this._cacheWidths(this._expandedWidths,!1),this._cacheWidths(this._compactedWidths,!0),this._setupOverflowDetection(),this._updateTabindex(0),this.emit("btu-action-bar-ready")}}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("keydown",this._boundKeydown),this._ro&&(this._ro.disconnect(),this._ro=null),this._rafId&&(cancelAnimationFrame(this._rafId),this._rafId=null)}_getItemZone(t){return t.zone==="start"||t.zone==="end"?t.zone:t.variant==="destructive"?"start":"end"}_getVisibleItems(){const t=[];return this._startZone&&t.push(...Array.from(this._startZone.querySelectorAll("btu-action-item"))),this._endZone&&t.push(...Array.from(this._endZone.querySelectorAll(":scope > btu-action-item"))),t.filter(e=>e.style.display!=="none")}_getEndZoneItems(){return this._endZone?Array.from(this._endZone.querySelectorAll(":scope > btu-action-item")):[]}_sortEndZoneItems(){if(!this._endZone)return;const t=this._getEndZoneItems(),e=this.alignment==="start";t.sort((a,i)=>{const o=u[a.variant]??0,r=u[i.variant]??0;return e?r-o:o-r});for(const a of t)this._endZone.appendChild(a)}_cacheWidths(t,e){t.clear();for(const a of this._getEndZoneItems()){const o=e&&a.compactable&&a.symbol&&!a.iconOnly?a.querySelector("button"):null;o&&o.classList.add("btu-button-text-hidden"),t.set(a,a.getBoundingClientRect().width),o&&o.classList.remove("btu-button-text-hidden")}}_calcTotalWidth(t){const e=parseFloat(getComputedStyle(this._endZone).gap)||12;let a=0;for(const i of t){if(i.style.display==="none")continue;const r=(this._compactedItems.has(i)?this._compactedWidths:this._expandedWidths).get(i)||i.getBoundingClientRect().width;a>0&&(a+=e),a+=r}return a}_setupOverflowDetection(){this._ro=new ResizeObserver(()=>this._scheduleRecalc()),this._ro.observe(this)}_scheduleRecalc(){this._rafId||(this._rafId=requestAnimationFrame(()=>{this._rafId=null,this._recalculateOverflow()}))}_recalculateOverflow(){if(!this._endZone)return;const t=this._getEndZoneItems(),e=this._endZone.clientWidth,a=40,i=parseFloat(getComputedStyle(this._endZone).gap)||12;if(t.forEach(s=>s.style.display=""),this._compactedItems.clear(),this._calcTotalWidth(t)<=e){this._hasOverflow=!1,this._updateOverflowDropdown([]),this._updateTabindex(Math.min(this._rovingIndex,this._getVisibleItems().length-1));return}const o=[...t].sort((s,S)=>(u[s.variant]??0)-(u[S.variant]??0));if(this.compact){for(const s of o)if(!(!s.compactable||!s.symbol||s.iconOnly)&&(this._compactedItems.add(s),this._calcTotalWidth(t)<=e)){this._hasOverflow=!1,this._updateOverflowDropdown([]),this._updateTabindex(Math.min(this._rovingIndex,this._getVisibleItems().length-1));return}}const r=[];for(const s of o){const S=t.filter(D=>!r.includes(D));if(this._calcTotalWidth(S)+a+i<=e)break;r.push(s),s.style.display="none"}this._hasOverflow=r.length>0,this._updateOverflowDropdown(r),this._updateTabindex(Math.min(this._rovingIndex,Math.max(0,this._getVisibleItems().length-1)))}_createOverflowDropdown(t){this._moreDropdown=document.createElement("btu-dropdown"),this._moreDropdown.setAttribute("symbol","ellipsis"),this._moreDropdown.setAttribute("icon-only",""),this._moreDropdown.setAttribute("variant","tertiary"),this._moreDropdown.setAttribute("size","sm"),this._moreDropdown.setAttribute("no-chevron",""),this._moreDropdown.setAttribute("aria-label","More actions"),this._moreDropdown.style.display="none";const e=document.createElement("btu-dropdown-menu");this._moreDropdown.appendChild(e),t.prepend(this._moreDropdown),this._moreDropdown.addEventListener("btu-dropdown-item-select",this._handleOverflowSelect.bind(this))}_updateOverflowDropdown(t){if(!this._moreDropdown)return;const e=this._moreDropdown.querySelector("btu-dropdown-menu");if(!e)return;if(t.length===0){this._moreDropdown.style.display="none",e.innerHTML="";return}this._moreDropdown.style.display="",e.innerHTML="";const a=[...t].reverse();for(const i of a){const o=document.createElement("btu-dropdown-item");o.setAttribute("label",i.label),o.dataset.itemIndex=String(this._items.indexOf(i)),i.symbol&&o.setAttribute("symbol",i.symbol),i.disabled&&o.setAttribute("disabled",""),e.appendChild(o)}}_handleOverflowSelect(t){const e=t.target,a=parseInt(e.dataset.itemIndex||"-1",10),i=this._items[a];i&&!i.disabled&&!i.loading&&i.emit("btu-action-item-click",{label:i.label})}_updateTabindex(t){this._rovingFocus(t,!1);const a=this._getRovingTargets()[this._rovingIndex];this._getVisibleItems().forEach(o=>{const r=o.querySelector("button");o._configure({tabindex:r===a?0:-1,collapsed:this._compactedItems.has(o)})})}updated(t){(t.has("compact")||t.has("alignment"))&&this._scheduleRecalc()}_handleKeydown(t){const e=getComputedStyle(this).direction==="rtl",a=e?"ArrowLeft":"ArrowRight",i=e?"ArrowRight":"ArrowLeft";switch(t.key){case a:t.preventDefault(),this._rovingNext();break;case i:t.preventDefault(),this._rovingPrev();break;case"Home":t.preventDefault(),this._rovingFirst();break;case"End":t.preventDefault(),this._rovingLast();break}}render(){return l`
+      <div class="btu-action-bar-start"></div>
+      <div class="btu-action-bar-end"></div>
+    `}}d([b({type:String,reflect:!0})],m.prototype,"position");d([b({type:Boolean,reflect:!0})],m.prototype,"sticky");d([b({type:String,reflect:!0,attribute:"item-alignment"})],m.prototype,"alignment");d([b({type:Boolean,reflect:!0})],m.prototype,"shadow");d([b({type:String})],m.prototype,"label");d([b({type:Boolean,reflect:!0})],m.prototype,"compact");customElements.get("btu-action-bar")||customElements.define("btu-action-bar",m);const{events:Z,args:O,argTypes:c}=z("btu-action-bar"),J={title:"Components/Action Bar",component:"btu-action-bar",tags:["autodocs"],parameters:{docs:{subtitle:"A persistent container for primary, secondary, tertiary, and destructive actions",description:{component:`
 ActionBar provides a horizontal bar for grouping action buttons, typically anchored to the bottom of a view.
 
 <h3>Two-Zone Layout:</h3>
@@ -17,15 +20,15 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
   <li><strong>Tab</strong> — Exit toolbar</li>
   <li><strong>Initial focus</strong> — Lands on the first item in visual order per WAI-ARIA toolbar conventions, not the primary action. Arrow keys reach any item quickly.</li>
 </ul>
-        `}},actions:{handles:y},controls:{expanded:!0}},args:{...v,label:"Content actions",position:"bottom","item-alignment":"default",shadow:!1,sticky:!1,compact:!1},argTypes:{...a,"--action-bar-gap":{table:{disable:!0}},"--action-bar-padding":{table:{disable:!0}},"--action-bar-background":{table:{disable:!0}},"--action-bar-border-color":{table:{disable:!0}},"--action-bar-z-index":{table:{disable:!0}},label:{...a.label,control:{type:"text"},description:"Accessible label for the toolbar region"},position:{...a.position,control:{type:"select"},options:["top","bottom"],description:"Bar position (top or bottom). Use with `sticky` for sticky behavior."},sticky:{...a.sticky,control:{type:"boolean"},description:"CSS sticky positioning (combines with position for direction)"},"item-alignment":{...a["item-alignment"],control:{type:"select"},options:["default","start","center","end"],description:"Content alignment (non-default disables two-zone layout)"},shadow:{...a.shadow,control:{type:"boolean"},description:"Adds a box-shadow"},compact:{...a.compact,control:{type:"boolean"},description:"Progressive label compacting before overflow (items need `compactable`)"},customGap:{name:"--action-bar-gap",control:{type:"text"},description:"Gap between items (default: 0.75rem)",table:{category:"css properties"}},customPadding:{name:"--action-bar-padding",control:{type:"text"},description:"Bar padding (default: 1.5rem)",table:{category:"css properties"}},customBackground:{name:"--action-bar-background",control:{type:"color"},description:"Background color",table:{category:"css properties"}},customBorderColor:{name:"--action-bar-border-color",control:{type:"color"},description:"Border color",table:{category:"css properties"}}},render:t=>{const o={};return t.customGap&&(o["--action-bar-gap"]=t.customGap),t.customPadding&&(o["--action-bar-padding"]=t.customPadding),t.customBackground&&(o["--action-bar-background"]=t.customBackground),t.customBorderColor&&(o["--action-bar-border-color"]=t.customBorderColor),e`
+        `}},actions:{handles:Z},controls:{expanded:!0}},args:{...O,label:"Content actions",position:"bottom","item-alignment":"default",shadow:!1,sticky:!1,compact:!1},argTypes:{...c,"--action-bar-gap":{table:{disable:!0}},"--action-bar-padding":{table:{disable:!0}},"--action-bar-background":{table:{disable:!0}},"--action-bar-border-color":{table:{disable:!0}},"--action-bar-z-index":{table:{disable:!0}},label:{...c.label,control:{type:"text"},description:"Accessible label for the toolbar region"},position:{...c.position,control:{type:"select"},options:["top","bottom"],description:"Bar position (top or bottom). Use with `sticky` for sticky behavior."},sticky:{...c.sticky,control:{type:"boolean"},description:"CSS sticky positioning (combines with position for direction)"},"item-alignment":{...c["item-alignment"],control:{type:"select"},options:["default","start","center","end"],description:"Content alignment (non-default disables two-zone layout)"},shadow:{...c.shadow,control:{type:"boolean"},description:"Adds a box-shadow"},compact:{...c.compact,control:{type:"boolean"},description:"Progressive label compacting before overflow (items need `compactable`)"},customGap:{name:"--action-bar-gap",control:{type:"text"},description:"Gap between items (default: 0.75rem)",table:{category:"css properties"}},customPadding:{name:"--action-bar-padding",control:{type:"text"},description:"Bar padding (default: 1.5rem)",table:{category:"css properties"}},customBackground:{name:"--action-bar-background",control:{type:"color"},description:"Background color",table:{category:"css properties"}},customBorderColor:{name:"--action-bar-border-color",control:{type:"color"},description:"Border color",table:{category:"css properties"}}},render:n=>{const t={};return n.customGap&&(t["--action-bar-gap"]=n.customGap),n.customPadding&&(t["--action-bar-padding"]=n.customPadding),n.customBackground&&(t["--action-bar-background"]=n.customBackground),n.customBorderColor&&(t["--action-bar-border-color"]=n.customBorderColor),l`
       <btu-action-bar
-        label="${t.label}"
-        position="${t.position}"
-        ?sticky="${t.sticky}"
-        item-alignment="${t["item-alignment"]}"
-        ?shadow="${t.shadow}"
-        ?compact="${t.compact}"
-        style=${u(o)}
+        label="${n.label}"
+        position="${n.position}"
+        ?sticky="${n.sticky}"
+        item-alignment="${n["item-alignment"]}"
+        ?shadow="${n.shadow}"
+        ?compact="${n.compact}"
+        style=${k(t)}
       >
         <btu-action-item
           zone="start"
@@ -36,7 +39,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
         <btu-action-item zone="end" variant="secondary" label="Cancel"></btu-action-item>
         <btu-action-item zone="end" variant="primary" label="Save Changes"></btu-action-item>
       </btu-action-bar>
-    `}},i={args:{}},r={render:()=>e`
+    `}},p={args:{}},h={render:()=>l`
     <div class="flex flex-col gap-4">
       <div>
         <p class="mb-2 text-sm font-medium text-gray-500">
@@ -70,7 +73,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
         </btu-action-bar>
       </div>
     </div>
-  `,parameters:{docs:{description:{story:"Items are automatically sorted by variant priority regardless of authored DOM order. In default/end/center alignment, primary is rightmost. In start alignment, primary is leftmost. Items with the same variant maintain their author order."}}}},n={render:()=>e`
+  `,parameters:{docs:{description:{story:"Items are automatically sorted by variant priority regardless of authored DOM order. In default/end/center alignment, primary is rightmost. In start alignment, primary is leftmost. Items with the same variant maintain their author order."}}}},y={render:()=>l`
     <div class="flex flex-col gap-4">
       <div>
         <p class="mb-2 text-sm font-medium text-gray-500">item-alignment="default" (two-zone layout)</p>
@@ -101,7 +104,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
         </btu-action-bar>
       </div>
     </div>
-  `,parameters:{docs:{description:{story:'The `item-alignment` attribute controls content positioning. The default "two-zone" layout separates start and end items; other alignments place all items together. Items are auto-sorted by variant priority.'}}}},s={render:()=>e`
+  `,parameters:{docs:{description:{story:'The `item-alignment` attribute controls content positioning. The default "two-zone" layout separates start and end items; other alignments place all items together. Items are auto-sorted by variant priority.'}}}},v={render:()=>l`
     <div class="flex flex-wrap gap-4">
       <div class="flex h-[300px] w-[300px] flex-col rounded-lg border border-gray-200">
         <div class="flex-1 p-4 text-sm text-gray-500">position="bottom" (default)</div>
@@ -132,12 +135,12 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
         </div>
       </div>
     </div>
-  `,parameters:{docs:{description:{story:"Position variants: `bottom` (default, margin-top: auto), `top` (margin-bottom: auto). The `sticky` attribute enables CSS sticky positioning — combine with `position` for direction."}}}},l={render:()=>e`
+  `,parameters:{docs:{description:{story:"Position variants: `bottom` (default, margin-top: auto), `top` (margin-bottom: auto). The `sticky` attribute enables CSS sticky positioning — combine with `position` for direction."}}}},f={render:()=>l`
     <btu-action-bar label="Shadow bar" shadow>
       <btu-action-item zone="end" variant="secondary" label="Cancel"></btu-action-item>
       <btu-action-item zone="end" variant="primary" label="Save Changes"></btu-action-item>
     </btu-action-bar>
-  `,parameters:{docs:{description:{story:"The `shadow` attribute adds a box-shadow to the bar for visual elevation."}}}},c={render:()=>e`
+  `,parameters:{docs:{description:{story:"The `shadow` attribute adds a box-shadow to the bar for visual elevation."}}}},g={render:()=>l`
     <div
       style="width: 400px; max-width: 100%; resize: horizontal; overflow: hidden; border: 1px solid oklch(var(--btu-theme-gray-200)); border-radius: 0.5rem;"
     >
@@ -148,7 +151,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
         <btu-action-item zone="end" variant="primary" label="Publish" symbol="send"></btu-action-item>
       </btu-action-bar>
     </div>
-  `,parameters:{docs:{description:{story:`When items don't fit, the least important overflow first into a "More" dropdown. Resize to see: tertiary "Preview" overflows before secondary "Save Draft", which overflows before primary "Publish".`}}}},b={render:()=>e`
+  `,parameters:{docs:{description:{story:`When items don't fit, the least important overflow first into a "More" dropdown. Resize to see: tertiary "Preview" overflows before secondary "Save Draft", which overflows before primary "Publish".`}}}},w={render:()=>l`
     <div
       style="width: 600px; max-width: 100%; resize: horizontal; overflow: hidden; border: 1px solid oklch(var(--btu-theme-gray-200)); border-radius: 0.5rem;"
     >
@@ -159,7 +162,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
         <btu-action-item variant="primary" label="Publish" symbol="send" compactable></btu-action-item>
       </btu-action-bar>
     </div>
-  `,parameters:{docs:{description:{story:'With `compact` on the bar and `compactable` on items, labels progressively compact to icon-only mode (least important first) before overflowing. Resize the container to see:\n1. Tertiary "Preview" compacts first\n2. Then secondary "Save Draft" compacts\n3. Then primary "Publish" compacts\n4. Finally items overflow into "More" dropdown'}}}},m={render:()=>e`
+  `,parameters:{docs:{description:{story:'With `compact` on the bar and `compactable` on items, labels progressively compact to icon-only mode (least important first) before overflowing. Resize the container to see:\n1. Tertiary "Preview" compacts first\n2. Then secondary "Save Draft" compacts\n3. Then primary "Publish" compacts\n4. Finally items overflow into "More" dropdown'}}}},x={render:()=>l`
     <div
       style="width: 500px; max-width: 100%; resize: horizontal; overflow: hidden; border: 1px solid oklch(var(--btu-theme-gray-200)); border-radius: 0.5rem;"
     >
@@ -170,18 +173,18 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
         <btu-action-item variant="primary" label="Publish" symbol="send"></btu-action-item>
       </btu-action-bar>
     </div>
-  `,parameters:{docs:{description:{story:'Items without `compactable` (or without an icon) skip the compact phase and go directly to overflow. Here, "Help" (no icon) and "Publish" (not marked compactable) never compact — only "Preview" and "Save Draft" can.'}}}},d={render:()=>e`
+  `,parameters:{docs:{description:{story:'Items without `compactable` (or without an icon) skip the compact phase and go directly to overflow. Here, "Help" (no icon) and "Publish" (not marked compactable) never compact — only "Preview" and "Save Draft" can.'}}}},_={render:()=>l`
     <btu-action-bar
       label="Custom styled"
       shadow
-      style=${u({"--action-bar-gap":"2rem","--action-bar-padding":"1.5rem 3rem","--action-bar-background":"oklch(0.25 0.05 260)","--action-bar-border-color":"oklch(0.55 0.15 280)"})}
+      style=${k({"--action-bar-gap":"2rem","--action-bar-padding":"1.5rem 3rem","--action-bar-background":"oklch(0.25 0.05 260)","--action-bar-border-color":"oklch(0.55 0.15 280)"})}
     >
       <btu-action-item zone="end" variant="secondary" label="Cancel"></btu-action-item>
       <btu-action-item zone="end" variant="primary" label="Save Changes"></btu-action-item>
     </btu-action-bar>
-  `,parameters:{docs:{description:{story:"CSS custom properties allow full visual customization of the bar. Use the controls panel to experiment with `--action-bar-*` properties."}}}};i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:`{
+  `,parameters:{docs:{description:{story:"CSS custom properties allow full visual customization of the bar. Use the controls panel to experiment with `--action-bar-*` properties."}}}};p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
   args: {}
-}`,...i.parameters?.docs?.source}}};r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:`{
+}`,...p.parameters?.docs?.source}}};h.parameters={...h.parameters,docs:{...h.parameters?.docs,source:{originalSource:`{
   render: () => html\`
     <div class="flex flex-col gap-4">
       <div>
@@ -224,7 +227,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
       }
     }
   }
-}`,...r.parameters?.docs?.source}}};n.parameters={...n.parameters,docs:{...n.parameters?.docs,source:{originalSource:`{
+}`,...h.parameters?.docs?.source}}};y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`{
   render: () => html\`
     <div class="flex flex-col gap-4">
       <div>
@@ -264,7 +267,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
       }
     }
   }
-}`,...n.parameters?.docs?.source}}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`{
+}`,...y.parameters?.docs?.source}}};v.parameters={...v.parameters,docs:{...v.parameters?.docs,source:{originalSource:`{
   render: () => html\`
     <div class="flex flex-wrap gap-4">
       <div class="flex h-[300px] w-[300px] flex-col rounded-lg border border-gray-200">
@@ -304,7 +307,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
       }
     }
   }
-}`,...s.parameters?.docs?.source}}};l.parameters={...l.parameters,docs:{...l.parameters?.docs,source:{originalSource:`{
+}`,...v.parameters?.docs?.source}}};f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`{
   render: () => html\`
     <btu-action-bar label="Shadow bar" shadow>
       <btu-action-item zone="end" variant="secondary" label="Cancel"></btu-action-item>
@@ -318,7 +321,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
       }
     }
   }
-}`,...l.parameters?.docs?.source}}};c.parameters={...c.parameters,docs:{...c.parameters?.docs,source:{originalSource:`{
+}`,...f.parameters?.docs?.source}}};g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
   render: () => html\`
     <div
       style="width: 400px; max-width: 100%; resize: horizontal; overflow: hidden; border: 1px solid oklch(var(--btu-theme-gray-200)); border-radius: 0.5rem;"
@@ -338,7 +341,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
       }
     }
   }
-}`,...c.parameters?.docs?.source}}};b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`{
+}`,...g.parameters?.docs?.source}}};w.parameters={...w.parameters,docs:{...w.parameters?.docs,source:{originalSource:`{
   render: () => html\`
     <div
       style="width: 600px; max-width: 100%; resize: horizontal; overflow: hidden; border: 1px solid oklch(var(--btu-theme-gray-200)); border-radius: 0.5rem;"
@@ -362,7 +365,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
       }
     }
   }
-}`,...b.parameters?.docs?.source}}};m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
+}`,...w.parameters?.docs?.source}}};x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`{
   render: () => html\`
     <div
       style="width: 500px; max-width: 100%; resize: horizontal; overflow: hidden; border: 1px solid oklch(var(--btu-theme-gray-200)); border-radius: 0.5rem;"
@@ -382,7 +385,7 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
       }
     }
   }
-}`,...m.parameters?.docs?.source}}};d.parameters={...d.parameters,docs:{...d.parameters?.docs,source:{originalSource:`{
+}`,...x.parameters?.docs?.source}}};_.parameters={..._.parameters,docs:{..._.parameters?.docs,source:{originalSource:`{
   render: () => html\`
     <btu-action-bar
       label="Custom styled"
@@ -405,4 +408,4 @@ ActionBar provides a horizontal bar for grouping action buttons, typically ancho
       }
     }
   }
-}`,...d.parameters?.docs?.source}}};const w=["Default","AutoSort","Alignments","Positions","Shadow","Overflow","ProgressiveCompact","MixedCompactable","CustomStyling"];export{n as Alignments,r as AutoSort,d as CustomStyling,i as Default,m as MixedCompactable,c as Overflow,s as Positions,b as ProgressiveCompact,l as Shadow,w as __namedExportsOrder,x as default};
+}`,..._.parameters?.docs?.source}}};const Y=["Default","AutoSort","Alignments","Positions","Shadow","Overflow","ProgressiveCompact","MixedCompactable","CustomStyling"];export{y as Alignments,h as AutoSort,_ as CustomStyling,p as Default,x as MixedCompactable,g as Overflow,v as Positions,w as ProgressiveCompact,f as Shadow,Y as __namedExportsOrder,J as default};

package/dist/storybook/assets/ActionItem-WoDvowFu.js

@@ -0,0 +1,16 @@
+import{i as p,E as u,x as b}from"./iframe-Byo_x5o2.js";import{n as r}from"./property-_few0Xe5.js";import{o as d}from"./if-defined-DL7cQU7O.js";import{o as y}from"./style-map-DxZm5Cj7.js";import{E as m,R as f}from"./ReadyMixin-C8HW2nGE.js";import{T as g}from"./TooltipMixin-CRNNusJ7.js";import"./CircularProgress-BeE2fWON.js";import"./Icon-DPQKiWDz.js";var _=Object.defineProperty,n=(l,t,e,s)=>{for(var o=void 0,a=l.length-1,c;a>=0;a--)(c=l[a])&&(o=c(t,e,o)||o);return o&&_(t,e,o),o};const h={primary:["btu-button","btu-button-primary","btu-button-sm"],secondary:["btu-button","btu-button-gray","btu-button-sm"],tertiary:["btu-button","btu-button-gray","btu-button-sm","btu-button-fill-none"],destructive:["btu-button","btu-button-error","btu-button-sm","btu-button-fill-none"]};class i extends g(m(f(p))){constructor(){super(...arguments),this.label="",this.variant="secondary",this.symbol="",this.iconOnly=!1,this.disabled=!1,this.loading=!1,this.zone="",this.compactable=!1,this._tabindex=0,this._collapsed=!1}createRenderRoot(){return this}_configure(t){this._tabindex=t.tabindex,this._collapsed=t.collapsed,this._collapsed&&this.symbol?(this.tooltip=this.label,this.tooltipPosition="top"):this.iconOnly||(this.tooltip=""),queueMicrotask(()=>this.requestUpdate())}updated(t){super.updated(t),this._relayTooltipAttrs()}_relayTooltipAttrs(){const t=this.querySelector("button");if(!t)return;const e=this.style.getPropertyValue("anchor-name");e&&(this.style.removeProperty("anchor-name"),t.style.setProperty("anchor-name",e));const s=this.querySelector("[data-tooltip-internal]");s?(this.removeAttribute("aria-describedby"),t.setAttribute("aria-describedby",s.id)):t.removeAttribute("aria-describedby")}firstUpdated(){!this.label&&!this.symbol&&console.warn("[btu-action-item] No label or icon provided.",this),this.compactable&&!this.symbol&&console.warn("[btu-action-item] `compactable` has no effect without an icon.",this),this.iconOnly&&this.symbol&&queueMicrotask(()=>{this.tooltip=this.label,this.tooltipPosition="top"})}_handleClick(){this.disabled||this.loading||this.emit("btu-action-item-click",{label:this.label})}_getSpinnerColor(){return this.variant==="primary"||this.variant==="destructive"?"white":"gray"}_buildButtonClasses(){const e=[...h[this.variant]??h.secondary];return(this.iconOnly||this._collapsed)&&e.push("btu-button-text-hidden"),e.join(" ")}_getButtonStyles(){const t={},e=this.style.getPropertyValue("--button-color").trim();e&&(t["--button-color"]=e);const s=this.style.getPropertyValue("--button-text-color").trim();s&&(t["--button-text-color"]=s);const o=this.style.getPropertyValue("--button-border-radius").trim();return o&&(t["--button-border-radius"]=o),t}render(){const t=this.iconOnly||this._collapsed,e=t&&this.label||void 0,s=this.symbol&&!this.loading,o=this.loading;return b`
+      <button
+        type="button"
+        class="${this._buildButtonClasses()}"
+        style=${y(this._getButtonStyles())}
+        aria-label=${d(e)}
+        aria-disabled="${this.disabled?"true":"false"}"
+        aria-busy="${this.loading?"true":"false"}"
+        tabindex="${this._tabindex}"
+        @click="${this._handleClick}"
+      >
+        ${o?b`<btu-circular-progress size="sm" color="${this._getSpinnerColor()}"></btu-circular-progress>`:u}
+        ${s?b`<btu-icon symbol="${this.symbol}" size="sm"></btu-icon>`:u}
+        ${t?u:this.label}
+      </button>
+    `}}n([r({type:String})],i.prototype,"label");n([r({type:String})],i.prototype,"variant");n([r({type:String})],i.prototype,"symbol");n([r({type:Boolean,attribute:"icon-only"})],i.prototype,"iconOnly");n([r({type:Boolean,reflect:!0})],i.prototype,"disabled");n([r({type:Boolean,reflect:!0})],i.prototype,"loading");n([r({type:String,reflect:!0})],i.prototype,"zone");n([r({type:Boolean,reflect:!0})],i.prototype,"compactable");customElements.get("btu-action-item")||customElements.define("btu-action-item",i);

package/dist/storybook/assets/{ActionItem.stories-DXzC9C1u.js → ActionItem.stories-CVFoWP54.js}

@@ -1,4 +1,4 @@
-import{g as d,x as a}from"./iframe-B9buZjP7.js";import{o as b}from"./style-map-qCiIYcp5.js";import"./preload-helper-PPVm8Dsz.js";const{events:m,args:u,argTypes:e}=d("btu-action-item"),g={title:"Components/Action Bar/Action Item",component:"btu-action-item",tags:["autodocs"],parameters:{docs:{subtitle:"A button element for use within an ActionBar",description:{component:`
+import{g as d,x as a}from"./iframe-Byo_x5o2.js";import{o as b}from"./style-map-DxZm5Cj7.js";import"./ActionItem-WoDvowFu.js";import"./preload-helper-PPVm8Dsz.js";import"./property-_few0Xe5.js";import"./if-defined-DL7cQU7O.js";import"./ReadyMixin-C8HW2nGE.js";import"./TooltipMixin-CRNNusJ7.js";import"./CircularProgress-BeE2fWON.js";import"./ProgressMixin-D1atDw3n.js";import"./aria-D5THOgos.js";import"./Icon-DPQKiWDz.js";const{events:m,args:u,argTypes:e}=d("btu-action-item"),$={title:"Components/Action Bar/Action Item",component:"btu-action-item",tags:["autodocs"],parameters:{docs:{subtitle:"A button element for use within an ActionBar",description:{component:`
 ActionItem renders a styled button using existing \`btu-button-*\` classes. It supports four visual variants — primary, secondary, tertiary, and destructive — along with optional icons, icon-only mode, loading state, and disabled state.
 
 <h3>Standalone vs. Inside ActionBar:</h3>
@@ -200,4 +200,4 @@ ActionItem renders a styled button using existing \`btu-button-*\` classes. It s
       }
     }
   }
-}`,...c.parameters?.docs?.source}}};const h=["Default","Variants","WithIcons","IconOnly","States","CustomStyling"];export{c as CustomStyling,o as Default,s as IconOnly,l as States,n as Variants,r as WithIcons,h as __namedExportsOrder,g as default};
+}`,...c.parameters?.docs?.source}}};const L=["Default","Variants","WithIcons","IconOnly","States","CustomStyling"];export{c as CustomStyling,o as Default,s as IconOnly,l as States,n as Variants,r as WithIcons,L as __namedExportsOrder,$ as default};

package/dist/storybook/assets/AiSparkle.stories-Psv9jNpy.js

@@ -0,0 +1,73 @@
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./lottie_svg-3t2UJxjZ.js","./iframe-Byo_x5o2.js","./preload-helper-PPVm8Dsz.js","./iframe-BzrT7trF.css"])))=>i.map(i=>d[i]);
+import{i as b,x as r,g as _}from"./iframe-Byo_x5o2.js";import{o as v}from"./style-map-DxZm5Cj7.js";import{_ as u}from"./preload-helper-PPVm8Dsz.js";import{n as f}from"./property-_few0Xe5.js";import{e as z,n as x}from"./ref-BaIdO8Sk.js";import{E as k,R as w}from"./ReadyMixin-C8HW2nGE.js";var S=Object.defineProperty,y=(t,e,i,p)=>{for(var s=void 0,a=t.length-1,h;a>=0;a--)(h=t[a])&&(s=h(e,i,s)||s);return s&&S(e,i,s),s};const O=()=>u(()=>import("./ai-sparkle-BZMJJAxY.js"),[],import.meta.url).then(t=>t.default);let $;const A=()=>$??=u(()=>import("./lottie_svg-3t2UJxjZ.js").then(t=>t.l),__vite__mapDeps([0,1,2,3]),import.meta.url),m={xs:"1.25rem",sm:"2rem",md:"2.5rem",lg:"3rem",xl:"3.5rem"};class d extends k(w(b)){constructor(){super(...arguments),this.playing=!1,this.size="md",this._containerRef=z(),this._animation=null,this._loaded=!1,this._loadToken=0,this._reduceMotion=!1,this._visible=!0,this._onMotionChange=e=>{this._reduceMotion=e.matches,this._sync()}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.hasAttribute("aria-hidden")||this.setAttribute("aria-hidden","true"),this.style.display||(this.style.display="inline-block"),this._applySize(),this._motionQuery=window.matchMedia?.("(prefers-reduced-motion: reduce)"),this._reduceMotion=this._motionQuery?.matches??!1,this._motionQuery?.addEventListener("change",this._onMotionChange)}disconnectedCallback(){super.disconnectedCallback(),this._resizeObserver?.disconnect(),this._resizeObserver=void 0,this._intersectionObserver?.disconnect(),this._intersectionObserver=void 0,this._motionQuery?.removeEventListener("change",this._onMotionChange),this._loadToken++,this._animation?.destroy(),this._animation=null}firstUpdated(e){super.firstUpdated(e),this._resizeObserver=new ResizeObserver(()=>this._animation?.resize()),this._resizeObserver.observe(this),this._intersectionObserver=new IntersectionObserver(([i])=>{this._visible=i.isIntersecting,this._visible&&this._animation?.resize(),this._sync()}),this._intersectionObserver.observe(this),this._build(),this.emit("btu-ai-sparkle-ready")}updated(e){super.updated(e),e.has("playing")&&this._sync(),e.has("size")&&this._applySize()}render(){return r`<div ${x(this._containerRef)} style="width: 100%; height: 100%"></div>`}_applySize(){const e=m[this.size]??m.md;this.style.width=`var(--ai-sparkle-size, ${e})`,this.style.height=`var(--ai-sparkle-size, ${e})`}async _build(){const e=++this._loadToken,[{default:i},p]=await Promise.all([A(),O()]),s=this._containerRef.value;if(e!==this._loadToken||!s||this._animation)return;const a=i.loadAnimation({container:s,renderer:"svg",loop:!0,autoplay:!1,animationData:structuredClone(p)});a.addEventListener("DOMLoaded",()=>{this._loaded=!0,a.resize(),this._sync()}),this._animation=a}_sync(){const e=this._animation;if(!(!e||!this._loaded)){if(!this.playing||this._reduceMotion){const i=Math.max(0,e.getDuration(!0)-1);e.goToAndStop(i,!0);return}this._visible?e.play():e.pause()}}}y([f({reflect:!0,converter:{fromAttribute:t=>t!==null&&t!=="false",toAttribute:t=>t?"":null}})],d.prototype,"playing");y([f({type:String,reflect:!0})],d.prototype,"size");customElements.get("btu-ai-sparkle")||customElements.define("btu-ai-sparkle",d);const{events:E,args:T,argTypes:c}=_("btu-ai-sparkle"),g=["xs","sm","md","lg","xl"],L={title:"Components/AI/Sparkle",component:"btu-ai-sparkle",tags:["autodocs"],parameters:{docs:{subtitle:"The animated AI-branding sparkle",description:{component:`
+<h3>When to use:</h3>
+<ul>
+  <li>On the control that opens an AI surface (e.g. the button that opens the Esca assistant), to draw the eye to it</li>
+</ul>
+
+<p>Drive it with the <code>playing</code> boolean: <code>true</code> loops the clip while the AI surface is closed; set it <code>false</code> once the surface is open so it holds a static frame and stops competing for attention. Reduced-motion users always get the frozen frame.</p>
+
+<h3>Accessibility:</h3>
+<ul>
+  <li>Decorative by default (<code>aria-hidden="true"</code>, set only when absent) — the control it sits in owns the accessible name.</li>
+</ul>
+        `}},actions:{handles:E},controls:{expanded:!0}},args:{...T,playing:!0,size:"md"},argTypes:{...c,"--ai-sparkle-size":{table:{disable:!0}},playing:{...c.playing,control:{type:"boolean"},description:"Whether the sparkle animates. `false` (default) holds the last (fully-formed) frame.",table:{category:"Attributes",defaultValue:{summary:"false"}}},size:{...c.size,control:{type:"select"},options:g,description:"Sparkle size scale (mirrors btu-avatar). Overridden by `--ai-sparkle-size`.",table:{category:"Attributes",defaultValue:{summary:"md"}}},customSize:{name:"--ai-sparkle-size",control:{type:"text"},description:'Width/height override (e.g. "20px"). Beats the `size` attribute; default box is 2.5rem (md).',table:{category:"css properties"}}},render:t=>{const e={};return t.customSize&&(e["--ai-sparkle-size"]=t.customSize),r`<btu-ai-sparkle
+      ?playing=${t.playing}
+      size="${t.size}"
+      style=${v(e)}
+    ></btu-ai-sparkle>`}},n={args:{},parameters:{docs:{description:{story:"Toggle `playing` to switch between the looping animation and the static frame, and resize with `size`."}}}},o={render:()=>r`<div class="flex flex-row items-start gap-8">
+      ${[!0,!1].map(t=>r`
+          <div class="flex flex-col items-center gap-2">
+            <btu-ai-sparkle ?playing=${t} size="xl"></btu-ai-sparkle>
+            <span class="text-xs font-medium text-gray-700">${t?"playing":"static"}</span>
+          </div>
+        `)}
+    </div>`,parameters:{docs:{description:{story:'The looping state (left) next to the frozen frame (right) that `playing="false"` holds.'}}}},l={render:()=>r`<div class="flex flex-row items-center gap-6">
+      ${g.map(t=>r`
+          <div class="flex flex-col items-center gap-2">
+            <btu-ai-sparkle size="${t}"></btu-ai-sparkle>
+            <span class="text-xs text-gray-600">${t}</span>
+          </div>
+        `)}
+    </div>`,parameters:{docs:{description:{story:"The `size` scale (`xs`–`xl`), mirroring `<btu-avatar>`. For an arbitrary size, override with the `--ai-sparkle-size` custom property."}}}};n.parameters={...n.parameters,docs:{...n.parameters?.docs,source:{originalSource:`{
+  args: {},
+  parameters: {
+    docs: {
+      description: {
+        story: 'Toggle \`playing\` to switch between the looping animation and the static frame, and resize with \`size\`.'
+      }
+    }
+  }
+}`,...n.parameters?.docs?.source}}};o.parameters={...o.parameters,docs:{...o.parameters?.docs,source:{originalSource:`{
+  render: () => html\`<div class="flex flex-row items-start gap-8">
+      \${([true, false] as const).map(playing => html\`
+          <div class="flex flex-col items-center gap-2">
+            <btu-ai-sparkle ?playing=\${playing} size="xl"></btu-ai-sparkle>
+            <span class="text-xs font-medium text-gray-700">\${playing ? 'playing' : 'static'}</span>
+          </div>
+        \`)}
+    </div>\`,
+  parameters: {
+    docs: {
+      description: {
+        story: 'The looping state (left) next to the frozen frame (right) that \`playing="false"\` holds.'
+      }
+    }
+  }
+}`,...o.parameters?.docs?.source}}};l.parameters={...l.parameters,docs:{...l.parameters?.docs,source:{originalSource:`{
+  render: () => html\`<div class="flex flex-row items-center gap-6">
+      \${sizeOptions.map(size => html\`
+          <div class="flex flex-col items-center gap-2">
+            <btu-ai-sparkle size="\${size}"></btu-ai-sparkle>
+            <span class="text-xs text-gray-600">\${size}</span>
+          </div>
+        \`)}
+    </div>\`,
+  parameters: {
+    docs: {
+      description: {
+        story: 'The \`size\` scale (\`xs\`–\`xl\`), mirroring \`<btu-avatar>\`. For an arbitrary size, override with the \`--ai-sparkle-size\` custom property.'
+      }
+    }
+  }
+}`,...l.parameters?.docs?.source}}};const V=["Default","PlayingVsStatic","Sizes"];export{n as Default,o as PlayingVsStatic,l as Sizes,V as __namedExportsOrder,L as default};

package/dist/storybook/assets/Avatar-CIQcHS8b.js

@@ -0,0 +1,4 @@
+import{i as c,x as h}from"./iframe-Byo_x5o2.js";import{n as r}from"./property-_few0Xe5.js";import{r as n}from"./state-BBcPmYaV.js";import{E as f,R as p}from"./ReadyMixin-C8HW2nGE.js";import{T as u}from"./TooltipMixin-CRNNusJ7.js";var g=Object.defineProperty,s=(o,t,i,d)=>{for(var a=void 0,l=o.length-1,m;l>=0;l--)(m=o[l])&&(a=m(t,i,a)||a);return a&&g(t,i,a),a};class e extends u(f(p(c))){constructor(){super(...arguments),this.src="",this.alt="",this.fallback="",this.size="md",this.initialClasses=[],this._initialClassesCaptured=!1,this.imageLoaded=!1,this.imageError=!1}connectedCallback(){super.connectedCallback(),this._initialClassesCaptured||(this.className&&(this.initialClasses=this.className.split(" ").filter(t=>t.trim())),this._initialClassesCaptured=!0)}createRenderRoot(){return this}willUpdate(){const t=[...this.initialClasses,"btu-avatar",`btu-avatar-${this.size}`,this.imageLoaded?"btu-avatar-image-loaded":""];this.className=t.filter(Boolean).join(" ")}firstUpdated(){if(this.emit("btu-avatar-ready"),this.src){const t=this.querySelector("img");t&&(t.addEventListener("load",()=>{this.imageLoaded=!0,this.imageError=!1,this.emit("btu-avatar-image-loaded",{src:this.src})}),t.addEventListener("error",i=>{this.imageLoaded=!1,this.imageError=!0,this.emit("btu-avatar-image-error",{src:this.src,error:i})}))}}updated(t){if(super.updated(t),t.has("src")&&(this.imageError=!1,this.imageLoaded=!1,this.src)){const i=this.querySelector("img");i&&(i.addEventListener("load",()=>{this.imageLoaded=!0,this.imageError=!1,this.emit("btu-avatar-image-loaded",{src:this.src})}),i.addEventListener("error",d=>{this.imageLoaded=!1,this.imageError=!0,this.emit("btu-avatar-image-error",{src:this.src,error:d})}))}}render(){return h`
+      <div class="btu-avatar-fallback">${this.fallback}</div>
+      ${this.src&&!this.imageError?h`<img src="${this.src}" alt="${this.alt}" />`:""}
+    `}}s([r({type:String})],e.prototype,"src");s([r({type:String})],e.prototype,"alt");s([r({type:String})],e.prototype,"fallback");s([r({type:String})],e.prototype,"size");s([n()],e.prototype,"imageLoaded");s([n()],e.prototype,"imageError");customElements.get("btu-avatar")||customElements.define("btu-avatar",e);

package/dist/storybook/assets/Avatar.stories-BE2Xn8fx.js

@@ -0,0 +1,213 @@
+import{g as A,x as n}from"./iframe-Byo_x5o2.js";import{o as c}from"./style-map-DxZm5Cj7.js";import"./Avatar-CIQcHS8b.js";import"./preload-helper-PPVm8Dsz.js";import"./property-_few0Xe5.js";import"./state-BBcPmYaV.js";import"./ReadyMixin-C8HW2nGE.js";import"./TooltipMixin-CRNNusJ7.js";const{events:p,args:g,argTypes:a}=A("btu-avatar"),f=["xs","sm","md","lg","xl","xxl"],r="data:image/jpeg;base64,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",S={title:"Components/Avatar",component:"btu-avatar",tags:["autodocs"],parameters:{docs:{subtitle:"Display user avatars with image loading and fallback text",description:{component:`
+<h3>When to use:</h3>
+<ul>
+  <li>To represent a user or entity with a profile picture</li>
+  <li>In user lists, comment threads, or navigation bars</li>
+  <li>When you need graceful fallback to initials</li>
+</ul>
+
+<h3>When not to use:</h3>
+<ul>
+  <li>For decorative images (use img tag instead)</li>
+  <li>For non-user entities without fallback text</li>
+</ul>
+
+<h3>Use Cases in the CMS:</h3>
+<ul>
+  <li>The user profile control in the main navigation bar</li>
+  <li>Viewers in a search result item</li>
+  <li>Viewers in the recent activity dashboard widget</li>
+  <li>Used by [AvatarGroup](?path=/docs/components-avatargroup--docs)</li>
+</ul>
+        `}},actions:{handles:p},controls:{expanded:!0}},args:{...g,alt:"Dylan",fallback:"DG",size:"md",tooltip:"Dylan G.","tooltip-position":"top"},argTypes:{...a,"--avatar-size":{table:{disable:!0}},"--avatar-bg-color":{table:{disable:!0}},"--avatar-corner-rounding":{table:{disable:!0}},"--avatar-ring-color":{table:{disable:!0}},"--avatar-ring-width":{table:{disable:!0}},src:{...a.src,control:{type:"text"},description:"Image source URL"},alt:{...a.alt,control:{type:"text"},description:"Alt text for the image"},fallback:{...a.fallback,control:{type:"text"},description:"Fallback text (typically initials)"},size:{...a.size,control:{type:"select"},options:f},tooltip:{...a.tooltip,control:{type:"text"},description:"Tooltip text shown on hover (via TooltipMixin)",table:{category:"Tooltip"}},"tooltip-position":{...a["tooltip-position"],control:{type:"select"},options:["top","bottom","left","right"],description:"Tooltip placement",table:{category:"Tooltip"}},customSize:{name:"--avatar-size",control:{type:"text"},description:'Custom size - overrides the size prop (e.g., "5rem")',table:{category:"css properties"}},customBgColor:{name:"--avatar-bg-color",control:{type:"color"},description:"Custom background color for fallback",table:{category:"css properties"}},customCornerRounding:{name:"--avatar-corner-rounding",control:{type:"text"},description:"Custom corner rounding for avatar shape",table:{category:"css properties"}},customRingColor:{name:"--avatar-ring-color",control:{type:"color"},description:"Optional ring border color",table:{category:"css properties"}},customRingWidth:{name:"--avatar-ring-width",control:{type:"text"},description:"Ring border width (default: 2px)",table:{category:"css properties"}}},render:t=>{const e={};return t.customSize&&(e["--avatar-size"]=t.customSize),t.customBgColor&&(e["--avatar-bg-color"]=t.customBgColor),t.customCornerRounding&&(e["--avatar-corner-rounding"]=t.customCornerRounding),t.customRingColor&&(e["--avatar-ring-color"]=t.customRingColor),t.customRingWidth&&(e["--avatar-ring-width"]=t.customRingWidth),n`<btu-avatar
+      style=${c(e)}
+      src="${t.src}"
+      alt="${t.alt}"
+      fallback="${t.fallback}"
+      size="${t.size}"
+      tooltip="${t.tooltip}"
+      tooltip-position="${t["tooltip-position"]}"
+    ></btu-avatar>`}},o={args:{}},s={render:()=>n`<div class="flex flex-row items-center gap-4">
+      <btu-avatar src=${r} alt="dg" fallback="DG" size="xs" tooltip="Extra Small"></btu-avatar>
+      <btu-avatar src=${r} alt="dg" fallback="DG" size="sm" tooltip="Small"></btu-avatar>
+      <btu-avatar src=${r} alt="dg" fallback="DG" size="md" tooltip="Medium"></btu-avatar>
+      <btu-avatar src=${r} alt="dg" fallback="DG" size="lg" tooltip="Large"></btu-avatar>
+      <btu-avatar src=${r} alt="dg" fallback="DG" size="xl" tooltip="Extra Large"></btu-avatar>
+      <btu-avatar src=${r} alt="dg" fallback="DG" size="xxl" tooltip="Extra Extra Large"></btu-avatar>
+    </div>`,parameters:{docs:{description:{story:"Avatar supports six size variants: xs (1.5rem), sm (2.25rem), md (2.5rem), lg (3rem), xl (3.5rem), and xxl (4rem)."}}}},i={render:()=>n`<div class="flex flex-row items-center gap-4">
+      <div class="flex flex-col items-center gap-2">
+        <btu-avatar src="" alt="No Image" fallback="NI" size="lg" tooltip="No Image"></btu-avatar>
+        <span class="text-xs text-gray-600 dark:text-gray-400">No image</span>
+      </div>
+      <div class="flex flex-col items-center gap-2">
+        <btu-avatar
+          src="https://invalid-url-that-will-fail.example.com/image.jpg"
+          alt="Failed load"
+          fallback="FL"
+          size="lg"
+          tooltip="Failed Load"
+        ></btu-avatar>
+        <span class="text-xs text-gray-600 dark:text-gray-400">Image failed to load</span>
+      </div>
+    </div>`,parameters:{docs:{description:{story:"Avatars automatically display fallback text when no image source is provided or when an image fails to load. The failed image is removed from the DOM."}}}},l={render:()=>{const t=`data:image/svg+xml;base64,${btoa(`
+      <svg width="100" height="100" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+        <defs>
+          <linearGradient id="starGrad" x1="0%" y1="0%" x2="100%" y2="100%">
+            <stop offset="0%" style="stop-color:rgb(234,179,8);stop-opacity:1" />
+            <stop offset="100%" style="stop-color:rgb(249,115,22);stop-opacity:1" />
+          </linearGradient>
+        </defs>
+        <!-- Star shape with gradient fill, transparent background -->
+        <polygon
+          points="50,15 61,40 88,40 67,56 73,82 50,67 27,82 33,56 12,40 39,40"
+          fill="url(#starGrad)"
+          stroke="rgb(251,191,36)"
+          stroke-width="2"
+        />
+      </svg>
+    `)}`;return n`<div class="flex flex-col gap-4">
+      <div class="flex items-center gap-2">
+        <strong>Transparent Image:</strong>
+        <btu-avatar src=${t} alt="Transparent" fallback="YO" size="lg"></btu-avatar>
+      </div>
+      <div class="story-custom-colors flex items-center gap-2">
+        <strong>Custom Colors:</strong>
+        <btu-avatar fallback="🫠" size="lg" style="--avatar-bg-color: oklch(70% 0.3 var(--hue))"></btu-avatar>
+      </div>
+      <div class="story-custom-colors flex items-center gap-2">
+        <strong>Custom Shape:</strong>
+        <btu-avatar fallback="🙃" size="lg" style="--avatar-corner-rounding: 0.5rem"></btu-avatar>
+      </div>
+      <div class="flex items-center gap-2">
+        <strong>With Ring:</strong>
+        <btu-avatar
+          src=${r}
+          alt="dg"
+          fallback="DG"
+          size="lg"
+          style="--avatar-ring-color: oklch(var(--btu-theme-primary-500)); --avatar-ring-width: 3px"
+        ></btu-avatar>
+        <btu-avatar
+          fallback="DG"
+          size="lg"
+          style="--avatar-ring-color: oklch(var(--btu-theme-success-500)); --avatar-ring-width: 3px"
+        ></btu-avatar>
+      </div>
+    </div>`},parameters:{docs:{description:{story:`
+Avatars support advanced customization through CSS properties and content composition:
+
+**Transparent Images:** When an avatar image has transparent areas, the fallback initials are automatically hidden once the image loads.
+
+**Custom Color:** Override the fallback background color using the \`--avatar-bg-color\` CSS property.
+
+**Custom Shape:** Overrides the fallback circular shape (making it a rounded square) using the \`--avatar-corner-rounding\` CSS property.
+
+**With Ring:** Add a colored ring border using \`--avatar-ring-color\` and \`--avatar-ring-width\` CSS properties. Useful for indicating status or highlighting specific users.`}}}};o.parameters={...o.parameters,docs:{...o.parameters?.docs,source:{originalSource:`{
+  args: {}
+}`,...o.parameters?.docs?.source}}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`{
+  render: () => html\`<div class="flex flex-row items-center gap-4">
+      <btu-avatar src=\${DGDATA} alt="dg" fallback="DG" size="xs" tooltip="Extra Small"></btu-avatar>
+      <btu-avatar src=\${DGDATA} alt="dg" fallback="DG" size="sm" tooltip="Small"></btu-avatar>
+      <btu-avatar src=\${DGDATA} alt="dg" fallback="DG" size="md" tooltip="Medium"></btu-avatar>
+      <btu-avatar src=\${DGDATA} alt="dg" fallback="DG" size="lg" tooltip="Large"></btu-avatar>
+      <btu-avatar src=\${DGDATA} alt="dg" fallback="DG" size="xl" tooltip="Extra Large"></btu-avatar>
+      <btu-avatar src=\${DGDATA} alt="dg" fallback="DG" size="xxl" tooltip="Extra Extra Large"></btu-avatar>
+    </div>\`,
+  parameters: {
+    docs: {
+      description: {
+        story: 'Avatar supports six size variants: xs (1.5rem), sm (2.25rem), md (2.5rem), lg (3rem), xl (3.5rem), and xxl (4rem).'
+      }
+    }
+  }
+}`,...s.parameters?.docs?.source}}};i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:`{
+  render: () => html\`<div class="flex flex-row items-center gap-4">
+      <div class="flex flex-col items-center gap-2">
+        <btu-avatar src="" alt="No Image" fallback="NI" size="lg" tooltip="No Image"></btu-avatar>
+        <span class="text-xs text-gray-600 dark:text-gray-400">No image</span>
+      </div>
+      <div class="flex flex-col items-center gap-2">
+        <btu-avatar
+          src="https://invalid-url-that-will-fail.example.com/image.jpg"
+          alt="Failed load"
+          fallback="FL"
+          size="lg"
+          tooltip="Failed Load"
+        ></btu-avatar>
+        <span class="text-xs text-gray-600 dark:text-gray-400">Image failed to load</span>
+      </div>
+    </div>\`,
+  parameters: {
+    docs: {
+      description: {
+        story: 'Avatars automatically display fallback text when no image source is provided or when an image fails to load. The failed image is removed from the DOM.'
+      }
+    }
+  }
+}`,...i.parameters?.docs?.source}}};l.parameters={...l.parameters,docs:{...l.parameters?.docs,source:{originalSource:`{
+  render: () => {
+    // SVG star shape with transparent background - demonstrates that fallback doesn't show through
+    const transparentAvatarSvg = \`data:image/svg+xml;base64,\${btoa(\`
+      <svg width="100" height="100" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+        <defs>
+          <linearGradient id="starGrad" x1="0%" y1="0%" x2="100%" y2="100%">
+            <stop offset="0%" style="stop-color:rgb(234,179,8);stop-opacity:1" />
+            <stop offset="100%" style="stop-color:rgb(249,115,22);stop-opacity:1" />
+          </linearGradient>
+        </defs>
+        <!-- Star shape with gradient fill, transparent background -->
+        <polygon
+          points="50,15 61,40 88,40 67,56 73,82 50,67 27,82 33,56 12,40 39,40"
+          fill="url(#starGrad)"
+          stroke="rgb(251,191,36)"
+          stroke-width="2"
+        />
+      </svg>
+    \`)}\`;
+    return html\`<div class="flex flex-col gap-4">
+      <div class="flex items-center gap-2">
+        <strong>Transparent Image:</strong>
+        <btu-avatar src=\${transparentAvatarSvg} alt="Transparent" fallback="YO" size="lg"></btu-avatar>
+      </div>
+      <div class="story-custom-colors flex items-center gap-2">
+        <strong>Custom Colors:</strong>
+        <btu-avatar fallback="🫠" size="lg" style="--avatar-bg-color: oklch(70% 0.3 var(--hue))"></btu-avatar>
+      </div>
+      <div class="story-custom-colors flex items-center gap-2">
+        <strong>Custom Shape:</strong>
+        <btu-avatar fallback="🙃" size="lg" style="--avatar-corner-rounding: 0.5rem"></btu-avatar>
+      </div>
+      <div class="flex items-center gap-2">
+        <strong>With Ring:</strong>
+        <btu-avatar
+          src=\${DGDATA}
+          alt="dg"
+          fallback="DG"
+          size="lg"
+          style="--avatar-ring-color: oklch(var(--btu-theme-primary-500)); --avatar-ring-width: 3px"
+        ></btu-avatar>
+        <btu-avatar
+          fallback="DG"
+          size="lg"
+          style="--avatar-ring-color: oklch(var(--btu-theme-success-500)); --avatar-ring-width: 3px"
+        ></btu-avatar>
+      </div>
+    </div>\`;
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: \`
+Avatars support advanced customization through CSS properties and content composition:
+
+**Transparent Images:** When an avatar image has transparent areas, the fallback initials are automatically hidden once the image loads.
+
+**Custom Color:** Override the fallback background color using the \\\`--avatar-bg-color\\\` CSS property.
+
+**Custom Shape:** Overrides the fallback circular shape (making it a rounded square) using the \\\`--avatar-corner-rounding\\\` CSS property.
+
+**With Ring:** Add a colored ring border using \\\`--avatar-ring-color\\\` and \\\`--avatar-ring-width\\\` CSS properties. Useful for indicating status or highlighting specific users.\`
+      }
+    }
+  }
+}`,...l.parameters?.docs?.source}}};const P=["Default","Sizes","FallbackStates","AdvancedUsage"];export{l as AdvancedUsage,o as Default,i as FallbackStates,s as Sizes,P as __namedExportsOrder,S as default};

package/dist/storybook/assets/AvatarGroup-Chs0VKPg.js

@@ -0,0 +1 @@
+import{i as u,x as d}from"./iframe-Byo_x5o2.js";import{n}from"./property-_few0Xe5.js";import{E as v,R as f}from"./ReadyMixin-C8HW2nGE.js";var m=Object.defineProperty,h=(r,t,s,i)=>{for(var e=void 0,a=r.length-1,o;a>=0;a--)(o=r[a])&&(e=o(t,s,e)||e);return e&&m(t,s,e),e};class l extends v(f(u)){constructor(){super(...arguments),this.size="md",this.initialClasses=[],this._initialClassesCaptured=!1,this.overflowAvatar=null,this.managedAvatars=new Set}connectedCallback(){super.connectedCallback(),this._initialClassesCaptured||(this.className&&(this.initialClasses=this.className.split(" ").filter(t=>t.trim())),this._initialClassesCaptured=!0)}createRenderRoot(){return this}willUpdate(){const t=[...this.initialClasses,"btu-avatar-group","flex","items-center","-space-x-2","*:ring-2","*:ring-white","dark:*:ring-gray-900"];this.className=t.join(" ")}firstUpdated(){this.processAvatars(),this.emit("btu-avatar-group-ready")}processAvatars(){const t=Array.from(this.querySelectorAll("btu-avatar"));this.overflowAvatar&&(this.overflowAvatar.remove(),this.overflowAvatar=null);const s=this.max||t.length,i=Math.max(0,t.length-s);t.forEach((e,a)=>{if(this.max&&a>=this.max){e.style.display="none";return}e.style.display="",!e.hasAttribute("size")&&!this.managedAvatars.has(e)&&this.managedAvatars.add(e),this.managedAvatars.has(e)&&e.setAttribute("size",this.size)}),i>0&&(this.createOverflowAvatar(i),this.emit("btu-avatar-group-overflow",{hidden:i}))}createOverflowAvatar(t){const s=document.createElement("btu-avatar");s.setAttribute("fallback",`+${t}`),s.setAttribute("size",this.size),s.classList.add("btu-avatar-group-overflow"),this.appendChild(s),this.overflowAvatar=s}updated(t){(t.has("max")||t.has("size"))&&this.processAvatars()}render(){return d``}}h([n({type:Number})],l.prototype,"max");h([n({type:String})],l.prototype,"size");customElements.get("btu-avatar-group")||customElements.define("btu-avatar-group",l);