@ds-mo/ui 15.2.0 → 15.4.0

package/dist/components/ds-map-entity-marker.js

@@ -1,2 +1,2 @@
-import{p as e,H as r,c as t,h as a,a as s,t as i}from"./index.js";import{d as o}from"./p-DjkUFlDW.js";import{d as n}from"./p-ZwRLjD5M.js";const c=()=>`@media (forced-colors: active){.sc-ds-map-entity-marker:root,.sc-ds-map-entity-marker-h,.ds-forced-colors-scope.sc-ds-map-entity-marker{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-map-entity-marker-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-map-entity-marker-h,.ds-focus-ring.sc-ds-map-entity-marker,.ds-focus-ring-inset.sc-ds-map-entity-marker-h,.ds-focus-ring-inset.sc-ds-map-entity-marker{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-map-entity-marker-h:focus-visible,.ds-focus-ring.sc-ds-map-entity-marker:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-map-entity-marker-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-map-entity-marker{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-map-entity-marker-h:focus-visible,.ds-focus-ring-inset.sc-ds-map-entity-marker:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-map-entity-marker-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-map-entity-marker:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-map-entity-marker-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-map-entity-marker{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-map-entity-marker-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-map-entity-marker::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-map-entity-marker-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}.sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-in-motion);--_map-marker-foreground:var(--color-entity-marker-foreground);--_map-marker-interaction-hover:var(--color-entity-marker-interaction-hover);--_map-marker-interaction-pressed:var(--color-entity-marker-interaction-pressed);position:relative;display:inline-flex;width:max-content;overflow:visible;vertical-align:middle;transition:var(--effect-transition-interaction-opacity-short-2)}.map-marker--dimmed.sc-ds-map-entity-marker-h{opacity:var(--effect-opacity-medium)}.map-marker--dimmed.sc-ds-map-entity-marker-h:focus-within{opacity:1}.map-marker__button.sc-ds-map-entity-marker{all:unset;position:relative;z-index:0;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:var(--dimension-size-300);min-width:var(--dimension-size-300);overflow:hidden;color:var(--_map-marker-foreground);background:var(--_map-marker-background);box-shadow:0 0 0 var(--dimension-stroke-width-012) var(--color-border-tertiary);cursor:pointer;transition:var(--effect-transition-interaction-opacity-short-2)}.map-marker__button.sc-ds-map-entity-marker::before{content:'';position:absolute;z-index:1;inset:0;border-radius:inherit;pointer-events:none}.map-marker__button.sc-ds-map-entity-marker::after{content:'';position:absolute;z-index:3;inset:0;border-radius:inherit;outline:var(--dimension-stroke-width-018) solid currentColor;outline-offset:calc(-1 * var(--dimension-stroke-width-037));pointer-events:none}.map-marker__caption.sc-ds-map-entity-marker{position:absolute;z-index:2;top:calc(100% + var(--dimension-space-050));left:50%;display:none;box-sizing:border-box;align-items:center;justify-content:center;width:max-content;max-width:calc(var(--dimension-size-800) * 4);height:var(--dimension-size-200);padding:0 var(--dimension-space-050);overflow:visible;border-radius:var(--dimension-radius-025);color:var(--_map-marker-foreground);background:var(--_map-marker-background);pointer-events:none;transform:translateX(-50%);line-height:0;white-space:nowrap}.sc-ds-map-entity-marker-h:focus-within .map-marker__caption.sc-ds-map-entity-marker{display:inline-flex}@media (hover: hover) and (pointer: fine){.map-marker--dimmed.sc-ds-map-entity-marker-h:hover{opacity:1}.sc-ds-map-entity-marker-h:hover .map-marker__caption.sc-ds-map-entity-marker{display:inline-flex}.map-marker__button.sc-ds-map-entity-marker:hover::before{background:var(--_map-marker-interaction-hover)}}.map-marker__button.sc-ds-map-entity-marker:active::before{background:var(--_map-marker-interaction-pressed)}@media (forced-colors: active){.map-marker__button.sc-ds-map-entity-marker{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);color:var(--ds-forced-color-content);background:var(--ds-forced-color-surface);box-shadow:none}.map-marker__button.sc-ds-map-entity-marker::before{display:none}.map-marker__button.sc-ds-map-entity-marker::after{outline-color:var(--ds-forced-color-control-boundary)}.map-marker__caption.sc-ds-map-entity-marker{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);color:var(--ds-forced-color-content);background:var(--ds-forced-color-surface)}}[state='in-motion'].sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-in-motion)}[state='idling'].sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-idling)}[state='stationary'].sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-stationary)}[state='immobilized'].sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-immobilized)}[state='stale'].sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-stale)}.map-marker__button.sc-ds-map-entity-marker{width:var(--dimension-size-300);border-radius:var(--dimension-radius-half)}.map-entity-marker--stale.sc-ds-map-entity-marker-h .map-marker__button.sc-ds-map-entity-marker::after{display:none}.map-entity-marker__stale-outline.sc-ds-map-entity-marker{position:absolute;z-index:3;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;transform:rotate(-90deg);fill:none;stroke:currentcolor;stroke-width:1;stroke-linecap:butt}.map-entity-marker__glyph.sc-ds-map-entity-marker{position:relative;z-index:2;display:inline-flex;transform:rotate(var(--ds-map-entity-marker-heading))}@media (forced-colors: active){.map-entity-marker--stale.sc-ds-map-entity-marker-h .map-marker__button.sc-ds-map-entity-marker::after{display:block;outline-style:dashed}.map-entity-marker__stale-outline.sc-ds-map-entity-marker{display:none}}`;const d=e=>{if(!Number.isFinite(e))return 0;return(e%360+360)%360};const m=new Set(["MapEntityTravelGroup","MapEntityVehicle"]);const l=8;const p=6.5;const u=45;const f=6;const k=e=>{const r=e*Math.PI/180;return[l+p*Math.cos(r),l+p*Math.sin(r)]};const y=Array.from({length:8},((e,r)=>{const t=r*u+f;const a=(r+1)*u-f;const[s,i]=k(t);const[o,n]=k(a);return`M ${s.toFixed(3)} ${i.toFixed(3)} A ${p} ${p} 0 0 1 ${o.toFixed(3)} ${n.toFixed(3)}`})).join(" ");const h=e(class e extends r{constructor(e){super();if(e!==false){this.__registerHost()}this.dsClick=t(this,"dsClick",7);this.caption="";this.icon="MapEntityTravelGroup";this.state="in-motion";this.stale=false;this.heading=0;this.dimmed=false;this.handleClick=e=>{this.dsClick.emit(e)}}async setFocus(){this.buttonEl?.focus()}render(){const e=this.caption.trim();const r=this.stale||this.state==="stale";const t=this.state==="immobilized"?"MapKey":this.icon;const i=m.has(t)?d(this.heading):0;return a(s,{key:"cec02ba810c70549c87655f8a43fa11ec76f4207",class:{"map-entity-marker":true,"map-marker--dimmed":this.dimmed,"map-entity-marker--stale":r}},a("button",{key:"5ba7de01f0a81f82870749b5b3403ec3b869c52d",ref:e=>this.buttonEl=e,type:"button",class:"map-marker__button ds-focus-ring","aria-label":this.label,onClick:this.handleClick},a("span",{key:"c2cacbbe42974a8eac4620784368fd16ddf41734",class:"map-entity-marker__glyph",style:{"--ds-map-entity-marker-heading":`${i}deg`},"aria-hidden":"true"},a("ds-icon",{key:"2d5ba32c26ba17dfbe05a78f681bc9b9c5174ac8",name:t,size:"sm",color:"inherit"})),r&&a("svg",{key:"9362c1c830a9945ededc3c87a9d43854d96b9cb9",class:"map-entity-marker__stale-outline",viewBox:"0 0 16 16","aria-hidden":"true"},a("path",{key:"f6aadf5db7cd89b9d66b204f2b8ae6b7d452121b",d:y}))),e&&a("ds-text",{key:"8a59f401e7dadd200ec08613d88975d224ce073e",class:"map-marker__caption",as:"span",variant:"text-caption",color:"inherit","aria-hidden":"true"},e))}static get style(){return c()}},[2,"ds-map-entity-marker",{label:[1],caption:[1],icon:[1],state:[513],stale:[516],heading:[2],dimmed:[516],setFocus:[64]}]);function b(){if(typeof customElements==="undefined"){return}const e=["ds-map-entity-marker","ds-icon","ds-text"];e.forEach((e=>{switch(e){case"ds-map-entity-marker":if(!customElements.get(i(e))){customElements.define(i(e),h)}break;case"ds-icon":if(!customElements.get(i(e))){o()}break;case"ds-text":if(!customElements.get(i(e))){n()}break}}))}b();const v=h;const g=b;export{v as DsMapEntityMarker,g as defineCustomElement};
+import{p as e,H as r,c as t,h as a,a as s,t as i}from"./index.js";import{d as o}from"./p-DjkUFlDW.js";import{d as n}from"./p-D8OWhnID.js";const c=()=>`@media (forced-colors: active){.sc-ds-map-entity-marker:root,.sc-ds-map-entity-marker-h,.ds-forced-colors-scope.sc-ds-map-entity-marker{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-map-entity-marker-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-map-entity-marker-h,.ds-focus-ring.sc-ds-map-entity-marker,.ds-focus-ring-inset.sc-ds-map-entity-marker-h,.ds-focus-ring-inset.sc-ds-map-entity-marker{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-map-entity-marker-h:focus-visible,.ds-focus-ring.sc-ds-map-entity-marker:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-map-entity-marker-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-map-entity-marker{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-map-entity-marker-h:focus-visible,.ds-focus-ring-inset.sc-ds-map-entity-marker:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-map-entity-marker-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-map-entity-marker:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-map-entity-marker-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-map-entity-marker{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-map-entity-marker-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-map-entity-marker::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-map-entity-marker-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}.sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-in-motion);--_map-marker-foreground:var(--color-entity-marker-foreground);--_map-marker-interaction-hover:var(--color-entity-marker-interaction-hover);--_map-marker-interaction-pressed:var(--color-entity-marker-interaction-pressed);position:relative;display:inline-flex;width:max-content;overflow:visible;vertical-align:middle;transition:var(--effect-transition-interaction-opacity-short-2)}.map-marker--dimmed.sc-ds-map-entity-marker-h{opacity:var(--effect-opacity-medium)}.map-marker--dimmed.sc-ds-map-entity-marker-h:focus-within{opacity:1}.map-marker__button.sc-ds-map-entity-marker{all:unset;position:relative;z-index:0;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:var(--dimension-size-300);min-width:var(--dimension-size-300);overflow:hidden;color:var(--_map-marker-foreground);background:var(--_map-marker-background);box-shadow:0 0 0 var(--dimension-stroke-width-012) var(--color-border-tertiary);cursor:pointer;transition:var(--effect-transition-interaction-opacity-short-2)}.map-marker__button.sc-ds-map-entity-marker::before{content:'';position:absolute;z-index:1;inset:0;border-radius:inherit;pointer-events:none}.map-marker__button.sc-ds-map-entity-marker::after{content:'';position:absolute;z-index:3;inset:0;border-radius:inherit;outline:var(--dimension-stroke-width-018) solid currentColor;outline-offset:calc(-1 * var(--dimension-stroke-width-037));pointer-events:none}.map-marker__caption.sc-ds-map-entity-marker{position:absolute;z-index:2;top:calc(100% + var(--dimension-space-050));left:50%;display:none;box-sizing:border-box;align-items:center;justify-content:center;width:max-content;max-width:calc(var(--dimension-size-800) * 4);height:var(--dimension-size-200);padding:0 var(--dimension-space-050);overflow:visible;border-radius:var(--dimension-radius-025);color:var(--_map-marker-foreground);background:var(--_map-marker-background);pointer-events:none;transform:translateX(-50%);line-height:0;white-space:nowrap}.sc-ds-map-entity-marker-h:focus-within .map-marker__caption.sc-ds-map-entity-marker{display:inline-flex}@media (hover: hover) and (pointer: fine){.map-marker--dimmed.sc-ds-map-entity-marker-h:hover{opacity:1}.sc-ds-map-entity-marker-h:hover .map-marker__caption.sc-ds-map-entity-marker{display:inline-flex}.map-marker__button.sc-ds-map-entity-marker:hover::before{background:var(--_map-marker-interaction-hover)}}.map-marker__button.sc-ds-map-entity-marker:active::before{background:var(--_map-marker-interaction-pressed)}@media (forced-colors: active){.map-marker__button.sc-ds-map-entity-marker{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);color:var(--ds-forced-color-content);background:var(--ds-forced-color-surface);box-shadow:none}.map-marker__button.sc-ds-map-entity-marker::before{display:none}.map-marker__button.sc-ds-map-entity-marker::after{outline-color:var(--ds-forced-color-control-boundary)}.map-marker__caption.sc-ds-map-entity-marker{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);color:var(--ds-forced-color-content);background:var(--ds-forced-color-surface)}}[state='moving'].sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-in-motion)}[state='idling'].sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-idling)}[state='stationary'].sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-stationary)}[state='immobilized'].sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-immobilized)}[state='unknown'].sc-ds-map-entity-marker-h{--_map-marker-background:var(--color-entity-marker-background-stale)}.map-marker__button.sc-ds-map-entity-marker{width:var(--dimension-size-300);border-radius:var(--dimension-radius-half)}.map-entity-marker--dashed.sc-ds-map-entity-marker-h .map-marker__button.sc-ds-map-entity-marker::after{display:none}.map-entity-marker__dashed-outline.sc-ds-map-entity-marker{position:absolute;z-index:3;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;transform:rotate(-90deg);fill:none;stroke:currentcolor;stroke-width:1;stroke-linecap:butt}.map-entity-marker__glyph.sc-ds-map-entity-marker{position:relative;z-index:2;display:inline-flex;transform:rotate(var(--ds-map-entity-marker-bearing))}@media (forced-colors: active){.map-entity-marker--dashed.sc-ds-map-entity-marker-h .map-marker__button.sc-ds-map-entity-marker::after{display:block;outline-style:dashed}.map-entity-marker__dashed-outline.sc-ds-map-entity-marker{display:none}}`;const d=e=>{if(!Number.isFinite(e))return 0;return(e%360+360)%360};const m=new Set(["MapEntityTravelGroup","MapEntityVehicle"]);const l=8;const p=6.5;const f=45;const u=6;const k=e=>{const r=e*Math.PI/180;return[l+p*Math.cos(r),l+p*Math.sin(r)]};const h=Array.from({length:8},((e,r)=>{const t=r*f+u;const a=(r+1)*f-u;const[s,i]=k(t);const[o,n]=k(a);return`M ${s.toFixed(3)} ${i.toFixed(3)} A ${p} ${p} 0 0 1 ${o.toFixed(3)} ${n.toFixed(3)}`})).join(" ");const y=e(class e extends r{constructor(e){super();if(e!==false){this.__registerHost()}this.dsClick=t(this,"dsClick",7);this.caption="";this.icon="MapEntityTravelGroup";this.state="moving";this.dashed=false;this.bearing=0;this.dimmed=false;this.handleClick=e=>{this.dsClick.emit(e)}}async setFocus(){this.buttonEl?.focus()}render(){const e=this.caption.trim();const r=this.state==="immobilized"?"MapKey":this.icon;const t=m.has(r)?d(this.bearing):0;return a(s,{key:"72b2773d3c200db96c9e95d5c8b926c4aca356c0",class:{"map-entity-marker":true,"map-marker--dimmed":this.dimmed,"map-entity-marker--dashed":this.dashed}},a("button",{key:"1dd7a027d37f8a7b65443e3b761ce44b4ce3ed30",ref:e=>this.buttonEl=e,type:"button",class:"map-marker__button ds-focus-ring","aria-label":this.label,onClick:this.handleClick},a("span",{key:"8a059ee059d92cfe852811c29ea76d10d6ee4166",class:"map-entity-marker__glyph",style:{"--ds-map-entity-marker-bearing":`${t}deg`},"aria-hidden":"true"},a("ds-icon",{key:"3c8dede17fcc7d6477cc5f9a79806f0886bda8f6",name:r,size:"sm",color:"inherit"})),this.dashed&&a("svg",{key:"f381ca70fa20f6f702488fdf98c35751eddddb57",class:"map-entity-marker__dashed-outline",viewBox:"0 0 16 16","aria-hidden":"true"},a("path",{key:"cf2c1c7d09f67a7ecbf5e0e09146ee028316e455",d:h}))),e&&a("ds-text",{key:"fa665a11ee1150ce75823f0c7b34f829ff0d6c53",class:"map-marker__caption",as:"span",variant:"text-caption",color:"inherit","aria-hidden":"true"},e))}static get style(){return c()}},[2,"ds-map-entity-marker",{label:[1],caption:[1],icon:[1],state:[513],dashed:[516],bearing:[2],dimmed:[516],setFocus:[64]}]);function v(){if(typeof customElements==="undefined"){return}const e=["ds-map-entity-marker","ds-icon","ds-text"];e.forEach((e=>{switch(e){case"ds-map-entity-marker":if(!customElements.get(i(e))){customElements.define(i(e),y)}break;case"ds-icon":if(!customElements.get(i(e))){o()}break;case"ds-text":if(!customElements.get(i(e))){n()}break}}))}v();const b=y;const g=v;export{b as DsMapEntityMarker,g as defineCustomElement};
 //# sourceMappingURL=ds-map-entity-marker.js.map

package/dist/components/ds-map-entity-marker.js.map

@@ -1 +1 @@
-{"version":3,"names":["mapEntityMarkerCss","normalizeHeading","heading","Number","isFinite","HEADING_ICONS","Set","STALE_OUTLINE_CENTER","STALE_OUTLINE_RADIUS","STALE_OUTLINE_SEGMENT_ANGLE","STALE_OUTLINE_HALF_GAP_ANGLE","staleOutlinePoint","angle","radians","Math","PI","cos","sin","STALE_OUTLINE_PATH","Array","from","length","_","index","segmentStart","segmentEnd","startX","startY","endX","endY","toFixed","join","MapEntityMarker","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","caption","icon","state","stale","dimmed","handleClick","event","dsClick","emit","setFocus","buttonEl","focus","render","trim","markerIsStale","markerIcon","has","h","Host","key","class","ref","element","type","label","onClick","style","name","size","color","viewBox","d","as","variant"],"sources":["src/wc/components/MapEntityMarker/MapEntityMarker.css?tag=ds-map-entity-marker&encapsulation=scoped","src/wc/components/MapEntityMarker/MapEntityMarker.tsx"],"sourcesContent":["@import '../../utils/focus-ring.css';\n@import '../../utils/map-marker.css';\n\n:host([state='in-motion']) {\n  --_map-marker-background: var(--color-entity-marker-background-in-motion);\n}\n\n:host([state='idling']) {\n  --_map-marker-background: var(--color-entity-marker-background-idling);\n}\n\n:host([state='stationary']) {\n  --_map-marker-background: var(--color-entity-marker-background-stationary);\n}\n\n:host([state='immobilized']) {\n  --_map-marker-background: var(--color-entity-marker-background-immobilized);\n}\n\n:host([state='stale']) {\n  --_map-marker-background: var(--color-entity-marker-background-stale);\n}\n\n.map-marker__button {\n  width: var(--dimension-size-300);\n  border-radius: var(--dimension-radius-half);\n}\n\n:host(.map-entity-marker--stale) .map-marker__button::after {\n  display: none;\n}\n\n.map-entity-marker__stale-outline {\n  position: absolute;\n  z-index: 3;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  overflow: visible;\n  pointer-events: none;\n  transform: rotate(-90deg);\n  fill: none;\n  stroke: currentcolor;\n  stroke-width: 1;\n  stroke-linecap: butt;\n}\n\n.map-entity-marker__glyph {\n  position: relative;\n  z-index: 2;\n  display: inline-flex;\n  transform: rotate(var(--ds-map-entity-marker-heading));\n}\n\n@media (forced-colors: active) {\n  :host(.map-entity-marker--stale) .map-marker__button::after {\n    display: block;\n    outline-style: dashed;\n  }\n\n  .map-entity-marker__stale-outline {\n    display: none;\n  }\n}\n","import { Component, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\n\nexport type MapEntityMarkerState = 'in-motion' | 'idling' | 'stationary' | 'immobilized' | 'stale';\n\nconst normalizeHeading = (heading: number): number => {\n  if (!Number.isFinite(heading)) return 0;\n  return ((heading % 360) + 360) % 360;\n};\n\nconst HEADING_ICONS = new Set(['MapEntityTravelGroup', 'MapEntityVehicle']);\n\nconst STALE_OUTLINE_CENTER = 8;\nconst STALE_OUTLINE_RADIUS = 6.5;\nconst STALE_OUTLINE_SEGMENT_ANGLE = 45;\nconst STALE_OUTLINE_HALF_GAP_ANGLE = 6;\n\nconst staleOutlinePoint = (angle: number): [number, number] => {\n  const radians = (angle * Math.PI) / 180;\n  return [\n    STALE_OUTLINE_CENTER + STALE_OUTLINE_RADIUS * Math.cos(radians),\n    STALE_OUTLINE_CENTER + STALE_OUTLINE_RADIUS * Math.sin(radians),\n  ];\n};\n\nconst STALE_OUTLINE_PATH = Array.from({ length: 8 }, (_, index) => {\n  const segmentStart = index * STALE_OUTLINE_SEGMENT_ANGLE + STALE_OUTLINE_HALF_GAP_ANGLE;\n  const segmentEnd = (index + 1) * STALE_OUTLINE_SEGMENT_ANGLE - STALE_OUTLINE_HALF_GAP_ANGLE;\n  const [startX, startY] = staleOutlinePoint(segmentStart);\n  const [endX, endY] = staleOutlinePoint(segmentEnd);\n  return `M ${startX.toFixed(3)} ${startY.toFixed(3)} A ${STALE_OUTLINE_RADIUS} ${STALE_OUTLINE_RADIUS} 0 0 1 ${endX.toFixed(3)} ${endY.toFixed(3)}`;\n}).join(' ');\n\n@Component({\n  tag: 'ds-map-entity-marker',\n  styleUrl: 'MapEntityMarker.css',\n  scoped: true,\n})\nexport class MapEntityMarker {\n  /** Accessible action label. Describe what activating the marker opens. */\n  @Prop() label!: string;\n\n  /** Short visible identifier revealed on hover or keyboard focus. */\n  @Prop() caption: string = '';\n\n  /** Canonical IcoMo icon name for the represented map entity. Immobilized state uses MapKey. */\n  @Prop() icon: string = 'MapEntityTravelGroup';\n\n  /** Semantic operating state that selects the marker background. */\n  @Prop({ reflect: true }) state: MapEntityMarkerState = 'in-motion';\n\n  /** Adds the stale-data outline while preserving the last known operating state. */\n  @Prop({ reflect: true }) stale: boolean = false;\n\n  /** Clockwise map heading for travel-group and vehicle icons. Values are normalized to 0–359. */\n  @Prop() heading: number = 0;\n\n  /** De-emphasizes this marker when an owner-managed selection is active elsewhere. */\n  @Prop({ reflect: true }) dimmed: boolean = false;\n\n  /** Fired when the marker's native button is activated. */\n  @Event() dsClick!: EventEmitter<MouseEvent>;\n\n  private buttonEl?: HTMLButtonElement;\n\n  /** Moves keyboard focus to the marker button. */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.buttonEl?.focus();\n  }\n\n  private handleClick = (event: MouseEvent) => {\n    this.dsClick.emit(event);\n  };\n\n  render() {\n    const caption = this.caption.trim();\n    const markerIsStale = this.stale || this.state === 'stale';\n    const markerIcon = this.state === 'immobilized' ? 'MapKey' : this.icon;\n    const heading = HEADING_ICONS.has(markerIcon) ? normalizeHeading(this.heading) : 0;\n\n    return (\n      <Host\n        class={{\n          'map-entity-marker': true,\n          'map-marker--dimmed': this.dimmed,\n          'map-entity-marker--stale': markerIsStale,\n        }}\n      >\n        <button\n          ref={element => (this.buttonEl = element)}\n          type=\"button\"\n          class=\"map-marker__button ds-focus-ring\"\n          aria-label={this.label}\n          onClick={this.handleClick}\n        >\n          <span\n            class=\"map-entity-marker__glyph\"\n            style={{ '--ds-map-entity-marker-heading': `${heading}deg` }}\n            aria-hidden=\"true\"\n          >\n            <ds-icon name={markerIcon} size=\"sm\" color=\"inherit\"></ds-icon>\n          </span>\n          {markerIsStale && (\n            // eslint-disable-next-line compomo/prefer-ds-icon -- The stale ring is a component-owned geometric primitive with eight exact equal arcs.\n            <svg class=\"map-entity-marker__stale-outline\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n              <path d={STALE_OUTLINE_PATH}></path>\n            </svg>\n          )}\n        </button>\n        {caption && (\n          <ds-text\n            class=\"map-marker__caption\"\n            as=\"span\"\n            variant=\"text-caption\"\n            color=\"inherit\"\n            aria-hidden=\"true\"\n          >\n            {caption}\n          </ds-text>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"0IAAA,MAAMA,EAAqB,IAAM,kwNCIjC,MAAMC,EAAoBC,IACxB,IAAKC,OAAOC,SAASF,GAAU,OAAO,EACtC,OAASA,EAAU,IAAO,KAAO,GAAG,EAGtC,MAAMG,EAAgB,IAAIC,IAAI,CAAC,uBAAwB,qBAEvD,MAAMC,EAAuB,EAC7B,MAAMC,EAAuB,IAC7B,MAAMC,EAA8B,GACpC,MAAMC,EAA+B,EAErC,MAAMC,EAAqBC,IACzB,MAAMC,EAAWD,EAAQE,KAAKC,GAAM,IACpC,MAAO,CACLR,EAAuBC,EAAuBM,KAAKE,IAAIH,GACvDN,EAAuBC,EAAuBM,KAAKG,IAAIJ,GACxD,EAGH,MAAMK,EAAqBC,MAAMC,KAAK,CAAEC,OAAQ,IAAK,CAACC,EAAGC,KACvD,MAAMC,EAAeD,EAAQd,EAA8BC,EAC3D,MAAMe,GAAcF,EAAQ,GAAKd,EAA8BC,EAC/D,MAAOgB,EAAQC,GAAUhB,EAAkBa,GAC3C,MAAOI,EAAMC,GAAQlB,EAAkBc,GACvC,MAAO,KAAKC,EAAOI,QAAQ,MAAMH,EAAOG,QAAQ,QAAQtB,KAAwBA,WAA8BoB,EAAKE,QAAQ,MAAMD,EAAKC,QAAQ,IAAI,IACjJC,KAAK,K,MAOKC,EAAeC,EAAA,MAAAD,UAAAE,EAL5B,WAAAC,CAAAC,G,6EAUUC,KAAAC,QAAkB,GAGlBD,KAAAE,KAAe,uBAGEF,KAAAG,MAA8B,YAG9BH,KAAAI,MAAiB,MAGlCJ,KAAAnC,QAAkB,EAGDmC,KAAAK,OAAkB,MAanCL,KAAAM,YAAeC,IACrBP,KAAKQ,QAAQC,KAAKF,EAAM,CAoD3B,CAzDC,cAAMG,GACJV,KAAKW,UAAUC,O,CAOjB,MAAAC,GACE,MAAMZ,EAAUD,KAAKC,QAAQa,OAC7B,MAAMC,EAAgBf,KAAKI,OAASJ,KAAKG,QAAU,QACnD,MAAMa,EAAahB,KAAKG,QAAU,cAAgB,SAAWH,KAAKE,KAClE,MAAMrC,EAAUG,EAAciD,IAAID,GAAcpD,EAAiBoC,KAAKnC,SAAW,EAEjF,OACEqD,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,oBAAqB,KACrB,qBAAsBrB,KAAKK,OAC3B,2BAA4BU,IAG9BG,EAAA,UAAAE,IAAA,2CACEE,IAAKC,GAAYvB,KAAKW,SAAWY,EACjCC,KAAK,SACLH,MAAM,mCAAkC,aAC5BrB,KAAKyB,MACjBC,QAAS1B,KAAKM,aAEdY,EAAA,QAAAE,IAAA,2CACEC,MAAM,2BACNM,MAAO,CAAE,iCAAkC,GAAG9D,QAAc,cAChD,QAEZqD,EAAA,WAAAE,IAAA,2CAASQ,KAAMZ,EAAYa,KAAK,KAAKC,MAAM,aAE5Cf,GAECG,EAAA,OAAAE,IAAA,2CAAKC,MAAM,mCAAmCU,QAAQ,YAAW,cAAa,QAC5Eb,EAAA,QAAAE,IAAA,2CAAMY,EAAGnD,MAIdoB,GACCiB,EAAA,WAAAE,IAAA,2CACEC,MAAM,sBACNY,GAAG,OACHC,QAAQ,eACRJ,MAAM,UAAS,cACH,QAEX7B,G","ignoreList":[]}
+{"version":3,"names":["mapEntityMarkerCss","normalizeBearing","bearing","Number","isFinite","BEARING_ICONS","Set","DASHED_OUTLINE_CENTER","DASHED_OUTLINE_RADIUS","DASHED_OUTLINE_SEGMENT_ANGLE","DASHED_OUTLINE_HALF_GAP_ANGLE","dashedOutlinePoint","angle","radians","Math","PI","cos","sin","DASHED_OUTLINE_PATH","Array","from","length","_","index","segmentStart","segmentEnd","startX","startY","endX","endY","toFixed","join","MapEntityMarker","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","caption","icon","state","dashed","dimmed","handleClick","event","dsClick","emit","setFocus","buttonEl","focus","render","trim","markerIcon","has","h","Host","key","class","ref","element","type","label","onClick","style","name","size","color","viewBox","d","as","variant"],"sources":["src/wc/components/MapEntityMarker/MapEntityMarker.css?tag=ds-map-entity-marker&encapsulation=scoped","src/wc/components/MapEntityMarker/MapEntityMarker.tsx"],"sourcesContent":["@import '../../utils/focus-ring.css';\n@import '../../utils/map-marker.css';\n\n:host([state='moving']) {\n  --_map-marker-background: var(--color-entity-marker-background-in-motion);\n}\n\n:host([state='idling']) {\n  --_map-marker-background: var(--color-entity-marker-background-idling);\n}\n\n:host([state='stationary']) {\n  --_map-marker-background: var(--color-entity-marker-background-stationary);\n}\n\n:host([state='immobilized']) {\n  --_map-marker-background: var(--color-entity-marker-background-immobilized);\n}\n\n:host([state='unknown']) {\n  --_map-marker-background: var(--color-entity-marker-background-stale);\n}\n\n.map-marker__button {\n  width: var(--dimension-size-300);\n  border-radius: var(--dimension-radius-half);\n}\n\n:host(.map-entity-marker--dashed) .map-marker__button::after {\n  display: none;\n}\n\n.map-entity-marker__dashed-outline {\n  position: absolute;\n  z-index: 3;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  overflow: visible;\n  pointer-events: none;\n  transform: rotate(-90deg);\n  fill: none;\n  stroke: currentcolor;\n  stroke-width: 1;\n  stroke-linecap: butt;\n}\n\n.map-entity-marker__glyph {\n  position: relative;\n  z-index: 2;\n  display: inline-flex;\n  transform: rotate(var(--ds-map-entity-marker-bearing));\n}\n\n@media (forced-colors: active) {\n  :host(.map-entity-marker--dashed) .map-marker__button::after {\n    display: block;\n    outline-style: dashed;\n  }\n\n  .map-entity-marker__dashed-outline {\n    display: none;\n  }\n}\n","import { Component, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\n\nexport type MapEntityMarkerState = 'moving' | 'idling' | 'stationary' | 'immobilized' | 'unknown';\n\nconst normalizeBearing = (bearing: number): number => {\n  if (!Number.isFinite(bearing)) return 0;\n  return ((bearing % 360) + 360) % 360;\n};\n\nconst BEARING_ICONS = new Set(['MapEntityTravelGroup', 'MapEntityVehicle']);\n\nconst DASHED_OUTLINE_CENTER = 8;\nconst DASHED_OUTLINE_RADIUS = 6.5;\nconst DASHED_OUTLINE_SEGMENT_ANGLE = 45;\nconst DASHED_OUTLINE_HALF_GAP_ANGLE = 6;\n\nconst dashedOutlinePoint = (angle: number): [number, number] => {\n  const radians = (angle * Math.PI) / 180;\n  return [\n    DASHED_OUTLINE_CENTER + DASHED_OUTLINE_RADIUS * Math.cos(radians),\n    DASHED_OUTLINE_CENTER + DASHED_OUTLINE_RADIUS * Math.sin(radians),\n  ];\n};\n\nconst DASHED_OUTLINE_PATH = Array.from({ length: 8 }, (_, index) => {\n  const segmentStart = index * DASHED_OUTLINE_SEGMENT_ANGLE + DASHED_OUTLINE_HALF_GAP_ANGLE;\n  const segmentEnd = (index + 1) * DASHED_OUTLINE_SEGMENT_ANGLE - DASHED_OUTLINE_HALF_GAP_ANGLE;\n  const [startX, startY] = dashedOutlinePoint(segmentStart);\n  const [endX, endY] = dashedOutlinePoint(segmentEnd);\n  return `M ${startX.toFixed(3)} ${startY.toFixed(3)} A ${DASHED_OUTLINE_RADIUS} ${DASHED_OUTLINE_RADIUS} 0 0 1 ${endX.toFixed(3)} ${endY.toFixed(3)}`;\n}).join(' ');\n\n@Component({\n  tag: 'ds-map-entity-marker',\n  styleUrl: 'MapEntityMarker.css',\n  scoped: true,\n})\nexport class MapEntityMarker {\n  /** Accessible action label. Describe what activating the marker opens. */\n  @Prop() label!: string;\n\n  /** Short visible identifier revealed on hover or keyboard focus. */\n  @Prop() caption: string = '';\n\n  /** Canonical IcoMo icon name for the represented map entity. Immobilized state uses MapKey. */\n  @Prop() icon: string = 'MapEntityTravelGroup';\n\n  /** Semantic operating state that selects the marker background. */\n  @Prop({ reflect: true }) state: MapEntityMarkerState = 'moving';\n\n  /** Adds an optional dashed outline without changing the operating state. */\n  @Prop({ reflect: true }) dashed: boolean = false;\n\n  /** Clockwise map bearing for travel-group and vehicle icons. Values are normalized to 0–359. */\n  @Prop() bearing: number = 0;\n\n  /** De-emphasizes this marker when an owner-managed selection is active elsewhere. */\n  @Prop({ reflect: true }) dimmed: boolean = false;\n\n  /** Fired when the marker's native button is activated. */\n  @Event() dsClick!: EventEmitter<MouseEvent>;\n\n  private buttonEl?: HTMLButtonElement;\n\n  /** Moves keyboard focus to the marker button. */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.buttonEl?.focus();\n  }\n\n  private handleClick = (event: MouseEvent) => {\n    this.dsClick.emit(event);\n  };\n\n  render() {\n    const caption = this.caption.trim();\n    const markerIcon = this.state === 'immobilized' ? 'MapKey' : this.icon;\n    const bearing = BEARING_ICONS.has(markerIcon) ? normalizeBearing(this.bearing) : 0;\n\n    return (\n      <Host\n        class={{\n          'map-entity-marker': true,\n          'map-marker--dimmed': this.dimmed,\n          'map-entity-marker--dashed': this.dashed,\n        }}\n      >\n        <button\n          ref={element => (this.buttonEl = element)}\n          type=\"button\"\n          class=\"map-marker__button ds-focus-ring\"\n          aria-label={this.label}\n          onClick={this.handleClick}\n        >\n          <span\n            class=\"map-entity-marker__glyph\"\n            style={{ '--ds-map-entity-marker-bearing': `${bearing}deg` }}\n            aria-hidden=\"true\"\n          >\n            <ds-icon name={markerIcon} size=\"sm\" color=\"inherit\"></ds-icon>\n          </span>\n          {this.dashed && (\n            // eslint-disable-next-line compomo/prefer-ds-icon -- The dashed ring is a component-owned geometric primitive with eight exact equal arcs.\n            <svg class=\"map-entity-marker__dashed-outline\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n              <path d={DASHED_OUTLINE_PATH}></path>\n            </svg>\n          )}\n        </button>\n        {caption && (\n          <ds-text\n            class=\"map-marker__caption\"\n            as=\"span\"\n            variant=\"text-caption\"\n            color=\"inherit\"\n            aria-hidden=\"true\"\n          >\n            {caption}\n          </ds-text>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"0IAAA,MAAMA,EAAqB,IAAM,qwNCIjC,MAAMC,EAAoBC,IACxB,IAAKC,OAAOC,SAASF,GAAU,OAAO,EACtC,OAASA,EAAU,IAAO,KAAO,GAAG,EAGtC,MAAMG,EAAgB,IAAIC,IAAI,CAAC,uBAAwB,qBAEvD,MAAMC,EAAwB,EAC9B,MAAMC,EAAwB,IAC9B,MAAMC,EAA+B,GACrC,MAAMC,EAAgC,EAEtC,MAAMC,EAAsBC,IAC1B,MAAMC,EAAWD,EAAQE,KAAKC,GAAM,IACpC,MAAO,CACLR,EAAwBC,EAAwBM,KAAKE,IAAIH,GACzDN,EAAwBC,EAAwBM,KAAKG,IAAIJ,GAC1D,EAGH,MAAMK,EAAsBC,MAAMC,KAAK,CAAEC,OAAQ,IAAK,CAACC,EAAGC,KACxD,MAAMC,EAAeD,EAAQd,EAA+BC,EAC5D,MAAMe,GAAcF,EAAQ,GAAKd,EAA+BC,EAChE,MAAOgB,EAAQC,GAAUhB,EAAmBa,GAC5C,MAAOI,EAAMC,GAAQlB,EAAmBc,GACxC,MAAO,KAAKC,EAAOI,QAAQ,MAAMH,EAAOG,QAAQ,QAAQtB,KAAyBA,WAA+BoB,EAAKE,QAAQ,MAAMD,EAAKC,QAAQ,IAAI,IACnJC,KAAK,K,MAOKC,EAAeC,EAAA,MAAAD,UAAAE,EAL5B,WAAAC,CAAAC,G,6EAUUC,KAAAC,QAAkB,GAGlBD,KAAAE,KAAe,uBAGEF,KAAAG,MAA8B,SAG9BH,KAAAI,OAAkB,MAGnCJ,KAAAnC,QAAkB,EAGDmC,KAAAK,OAAkB,MAanCL,KAAAM,YAAeC,IACrBP,KAAKQ,QAAQC,KAAKF,EAAM,CAmD3B,CAxDC,cAAMG,GACJV,KAAKW,UAAUC,O,CAOjB,MAAAC,GACE,MAAMZ,EAAUD,KAAKC,QAAQa,OAC7B,MAAMC,EAAaf,KAAKG,QAAU,cAAgB,SAAWH,KAAKE,KAClE,MAAMrC,EAAUG,EAAcgD,IAAID,GAAcnD,EAAiBoC,KAAKnC,SAAW,EAEjF,OACEoD,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,oBAAqB,KACrB,qBAAsBpB,KAAKK,OAC3B,4BAA6BL,KAAKI,SAGpCa,EAAA,UAAAE,IAAA,2CACEE,IAAKC,GAAYtB,KAAKW,SAAWW,EACjCC,KAAK,SACLH,MAAM,mCAAkC,aAC5BpB,KAAKwB,MACjBC,QAASzB,KAAKM,aAEdW,EAAA,QAAAE,IAAA,2CACEC,MAAM,2BACNM,MAAO,CAAE,iCAAkC,GAAG7D,QAAc,cAChD,QAEZoD,EAAA,WAAAE,IAAA,2CAASQ,KAAMZ,EAAYa,KAAK,KAAKC,MAAM,aAE5C7B,KAAKI,QAEJa,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oCAAoCU,QAAQ,YAAW,cAAa,QAC7Eb,EAAA,QAAAE,IAAA,2CAAMY,EAAGlD,MAIdoB,GACCgB,EAAA,WAAAE,IAAA,2CACEC,MAAM,sBACNY,GAAG,OACHC,QAAQ,eACRJ,MAAM,UAAS,cACH,QAEX5B,G","ignoreList":[]}

package/dist/components/ds-markdown.js

@@ -1,2 +1,2 @@
-import{M as o,d as s}from"./p-CuWPWC3t.js";const t=o;const p=s;export{t as DsMarkdown,p as defineCustomElement};
+import{M as s,d as o}from"./p-BQspV5U7.js";const p=s;const t=o;export{p as DsMarkdown,t as defineCustomElement};
 //# sourceMappingURL=ds-markdown.js.map

package/dist/components/ds-menu.js

@@ -1,2 +1,2 @@
-import{M as o,d as s}from"./p-BR5OC2PX.js";const t=o;const p=s;export{t as DsMenu,p as defineCustomElement};
+import{M as o,d as s}from"./p-Dnt5xUBD.js";const t=o;const n=s;export{t as DsMenu,n as defineCustomElement};
 //# sourceMappingURL=ds-menu.js.map

package/dist/components/ds-message-actions.js

@@ -1,2 +1,2 @@
-import{p as s,H as e,c as t,h as i,a,t as o}from"./index.js";import{C as n}from"./p-BnhGV__o.js";import{d}from"./p-Cn6AfzeF.js";import{d as l}from"./p-D7K1ZHML.js";import{d as c}from"./p-DjkUFlDW.js";import{d as r}from"./p-0XTyQNRG.js";import{d as p}from"./p-ZwRLjD5M.js";import{d as h}from"./p-C_Ma6Xa-.js";const m=()=>`.sc-ds-message-actions-h{display:inline-flex;box-sizing:border-box}.message-actions.sc-ds-message-actions{display:inline-flex;align-items:center;gap:var(--dimension-space-050)}`;const f=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsCopyResult=t(this,"dsCopyResult",7);this.dsFeedbackChange=t(this,"dsFeedbackChange",7);this.feedbackEnabled=false;this.copied=false;this.copyFeedback=new n((s=>{this.copied=s}));this.copy=async()=>{const s=await this.copyFeedback.copy(this.copyText??"");if(s===undefined)return;this.dsCopyResult.emit({status:s?"success":"error"})}}connectedCallback(){this.copyFeedback.connect()}handleCopyTextChange(){this.copyFeedback.reset()}disconnectedCallback(){this.copyFeedback.disconnect()}changeFeedback(s,e){this.dsFeedbackChange.emit(e?s:undefined)}render(){const s=this.copied?"Copied":"Copy message";return i(a,{key:"9d5b1916c0374ba8d8b7a8449d8b65d40b37ed11"},i("div",{key:"17bd6014e73a5724432f365ed722f29fe96668dc",class:"message-actions",role:"group","aria-label":"Message actions"},this.copyText?i("ds-tooltip",{label:s,side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:this.copied?"Check":"Copy",size:"xs","aria-label":s,hasBorder:false,onDsClick:this.copy})):null,this.feedbackEnabled?i("ds-tooltip",{label:"Good response",side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:this.feedback==="positive"?"ThumbsUpFilled":"ThumbsUp",size:"xs","aria-label":"Good response",hasBorder:false,activeFill:false,pressed:this.feedback==="positive",onDsChange:s=>this.changeFeedback("positive",s.detail)})):null,this.feedbackEnabled?i("ds-tooltip",{label:"Bad response",side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:this.feedback==="negative"?"ThumbsDownFilled":"ThumbsDown",size:"xs","aria-label":"Bad response",hasBorder:false,activeFill:false,pressed:this.feedback==="negative",onDsChange:s=>this.changeFeedback("negative",s.detail)})):null))}static get watchers(){return{copyText:[{handleCopyTextChange:0}]}}static get style(){return m()}},[2,"ds-message-actions",{copyText:[1,"copy-text"],feedbackEnabled:[4,"feedback-enabled"],feedback:[1],copied:[32]},undefined,{copyText:[{handleCopyTextChange:0}]}]);function b(){if(typeof customElements==="undefined"){return}const s=["ds-message-actions","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-message-actions":if(!customElements.get(o(s))){customElements.define(o(s),f)}break;case"ds-badge":if(!customElements.get(o(s))){d()}break;case"ds-button-unfilled":if(!customElements.get(o(s))){l()}break;case"ds-icon":if(!customElements.get(o(s))){c()}break;case"ds-loader":if(!customElements.get(o(s))){r()}break;case"ds-text":if(!customElements.get(o(s))){p()}break;case"ds-tooltip":if(!customElements.get(o(s))){h()}break}}))}b();const u=f;const g=b;export{u as DsMessageActions,g as defineCustomElement};
+import{p as s,H as e,c as t,h as i,a,t as o}from"./index.js";import{C as n}from"./p-BnhGV__o.js";import{d}from"./p-CwdRaJER.js";import{d as l}from"./p-D6FRqNhN.js";import{d as c}from"./p-DjkUFlDW.js";import{d as r}from"./p-0XTyQNRG.js";import{d as p}from"./p-D8OWhnID.js";import{d as h}from"./p-DIQiHX0q.js";const m=()=>`.sc-ds-message-actions-h{display:inline-flex;box-sizing:border-box}.message-actions.sc-ds-message-actions{display:inline-flex;align-items:center;gap:var(--dimension-space-050)}`;const f=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsCopyResult=t(this,"dsCopyResult",7);this.dsFeedbackChange=t(this,"dsFeedbackChange",7);this.feedbackEnabled=false;this.copied=false;this.copyFeedback=new n((s=>{this.copied=s}));this.copy=async()=>{const s=await this.copyFeedback.copy(this.copyText??"");if(s===undefined)return;this.dsCopyResult.emit({status:s?"success":"error"})}}connectedCallback(){this.copyFeedback.connect()}handleCopyTextChange(){this.copyFeedback.reset()}disconnectedCallback(){this.copyFeedback.disconnect()}changeFeedback(s,e){this.dsFeedbackChange.emit(e?s:undefined)}render(){const s=this.copied?"Copied":"Copy message";return i(a,{key:"ad317e282b565db4c7e0989d557e9c8fb58a509e"},i("div",{key:"2c61dbcf5af784fddfdf74aaae6ee31db9215f64",class:"message-actions",role:"group","aria-label":"Message actions"},this.copyText?i("ds-tooltip",{label:s,side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:this.copied?"Check":"Copy",size:"xs","aria-label":s,hasBorder:false,onDsClick:this.copy})):null,this.feedbackEnabled?i("ds-tooltip",{label:"Good response",side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:this.feedback==="positive"?"ThumbsUpFilled":"ThumbsUp",size:"xs","aria-label":"Good response",hasBorder:false,activeFill:false,pressed:this.feedback==="positive",onDsChange:s=>this.changeFeedback("positive",s.detail)})):null,this.feedbackEnabled?i("ds-tooltip",{label:"Bad response",side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:this.feedback==="negative"?"ThumbsDownFilled":"ThumbsDown",size:"xs","aria-label":"Bad response",hasBorder:false,activeFill:false,pressed:this.feedback==="negative",onDsChange:s=>this.changeFeedback("negative",s.detail)})):null))}static get watchers(){return{copyText:[{handleCopyTextChange:0}]}}static get style(){return m()}},[2,"ds-message-actions",{copyText:[1,"copy-text"],feedbackEnabled:[4,"feedback-enabled"],feedback:[1],copied:[32]},undefined,{copyText:[{handleCopyTextChange:0}]}]);function b(){if(typeof customElements==="undefined"){return}const s=["ds-message-actions","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-message-actions":if(!customElements.get(o(s))){customElements.define(o(s),f)}break;case"ds-badge":if(!customElements.get(o(s))){d()}break;case"ds-button-unfilled":if(!customElements.get(o(s))){l()}break;case"ds-icon":if(!customElements.get(o(s))){c()}break;case"ds-loader":if(!customElements.get(o(s))){r()}break;case"ds-text":if(!customElements.get(o(s))){p()}break;case"ds-tooltip":if(!customElements.get(o(s))){h()}break}}))}b();const u=f;const g=b;export{u as DsMessageActions,g as defineCustomElement};
 //# sourceMappingURL=ds-message-actions.js.map

package/dist/components/ds-message-bubble.js

@@ -1,2 +1,2 @@
-import{p as e,H as s,h as r,a,t}from"./index.js";const o=()=>`.sc-ds-message-bubble-h{display:inline-flex;max-width:80%;box-sizing:border-box;-webkit-user-select:text;user-select:text}.message-bubble.sc-ds-message-bubble{min-width:0;padding-block:var(--dimension-space-100);padding-inline:calc(var(--dimension-space-100) + var(--dimension-space-025));border-radius:var(--dimension-radius-050);background:transparent;color:var(--color-foreground-primary);font-family:var(--typography-font-family-ui);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half);box-sizing:border-box;overflow-wrap:anywhere}.message-bubble--user.sc-ds-message-bubble-h .message-bubble.sc-ds-message-bubble{background:var(--color-translucent-translucent);color:var(--color-foreground-secondary);box-shadow:inset 0 0 0 var(--dimension-stroke-width-012) var(--color-border-tertiary)}.message-bubble--received.sc-ds-message-bubble-h .message-bubble.sc-ds-message-bubble{box-shadow:inset 0 0 0 var(--dimension-stroke-width-012) var(--color-border-tertiary)}`;const b=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.variant="received"}render(){return r(a,{key:"70636f0924b43c0484fc141d1c9d367bfa85d823",class:`message-bubble--${this.variant}`},r("div",{key:"d94035e9f8ac926081e1c5afb194200eae0dd22d",class:"message-bubble"},r("slot",{key:"87e3cf4f779b1373632869830452bd6d6c1db3d2"})))}static get style(){return o()}},[262,"ds-message-bubble",{variant:[1]}]);function i(){if(typeof customElements==="undefined"){return}const e=["ds-message-bubble"];e.forEach((e=>{switch(e){case"ds-message-bubble":if(!customElements.get(t(e))){customElements.define(t(e),b)}break}}))}i();const n=b;const d=i;export{n as DsMessageBubble,d as defineCustomElement};
+import{p as e,H as s,h as a,a as r,t as b}from"./index.js";const o=()=>`.sc-ds-message-bubble-h{display:inline-flex;max-width:80%;box-sizing:border-box;-webkit-user-select:text;user-select:text}.message-bubble.sc-ds-message-bubble{min-width:0;padding-block:var(--dimension-space-100);padding-inline:calc(var(--dimension-space-100) + var(--dimension-space-025));border-radius:var(--dimension-radius-100);background:var(--color-chrome-background-secondary);color:var(--color-foreground-secondary);font-family:var(--typography-font-family-ui);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half);box-sizing:border-box;overflow-wrap:anywhere}.message-bubble--user.sc-ds-message-bubble-h .message-bubble.sc-ds-message-bubble{background:var(--color-chrome-background-primary);color:var(--color-foreground-primary)}@media (max-width: 767px){.message-bubble.sc-ds-message-bubble{background:var(--color-background-secondary)}.message-bubble--user.sc-ds-message-bubble-h .message-bubble.sc-ds-message-bubble{background:var(--color-background-faint-neutral)}}`;const c=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.variant="received"}render(){return a(r,{key:"290c112e36a7d2d04c30e0b401642e7ff5cde7c3",class:`message-bubble--${this.variant}`},a("div",{key:"bf637b83127cfa1ffca9ecff881269ab0464340c",class:"message-bubble"},a("slot",{key:"642a2545c1eeb6855aabce135a39fe3e94655ed6"})))}static get style(){return o()}},[262,"ds-message-bubble",{variant:[1]}]);function n(){if(typeof customElements==="undefined"){return}const e=["ds-message-bubble"];e.forEach((e=>{switch(e){case"ds-message-bubble":if(!customElements.get(b(e))){customElements.define(b(e),c)}break}}))}n();const t=c;const i=n;export{t as DsMessageBubble,i as defineCustomElement};
 //# sourceMappingURL=ds-message-bubble.js.map

package/dist/components/ds-message-bubble.js.map

@@ -1 +1 @@
-{"version":3,"names":["messageBubbleCss","MessageBubble","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","variant","render","h","Host","key","class"],"sources":["src/wc/components/MessageBubble/MessageBubble.css?tag=ds-message-bubble&encapsulation=scoped","src/wc/components/MessageBubble/MessageBubble.tsx"],"sourcesContent":[":host {\n  display: inline-flex;\n  max-width: 80%;\n  box-sizing: border-box;\n  -webkit-user-select: text;\n  user-select: text;\n}\n\n.message-bubble {\n  min-width: 0;\n  padding-block: var(--dimension-space-100);\n  padding-inline: calc(var(--dimension-space-100) + var(--dimension-space-025));\n  border-radius: var(--dimension-radius-050);\n  background: transparent;\n  color: var(--color-foreground-primary);\n  font-family: var(--typography-font-family-ui);\n  font-size: var(--typography-fontsize-md);\n  line-height: var(--typography-lineheight-md);\n  font-weight: var(--typography-weight-regular);\n  letter-spacing: var(--typography-letterspacing-negative-half);\n  box-sizing: border-box;\n  overflow-wrap: anywhere;\n}\n\n:host(.message-bubble--user) .message-bubble {\n  background: var(--color-translucent-translucent);\n  color: var(--color-foreground-secondary);\n  box-shadow: inset 0 0 0 var(--dimension-stroke-width-012) var(--color-border-tertiary);\n}\n\n:host(.message-bubble--received) .message-bubble {\n  box-shadow: inset 0 0 0 var(--dimension-stroke-width-012) var(--color-border-tertiary);\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\nexport type MessageBubbleVariant = 'user' | 'received';\n\n@Component({\n  tag: 'ds-message-bubble',\n  styleUrl: 'MessageBubble.css',\n  scoped: true,\n})\nexport class MessageBubble {\n  @Prop() variant: MessageBubbleVariant = 'received';\n\n  render() {\n    return (\n      <Host class={`message-bubble--${this.variant}`}>\n        <div class=\"message-bubble\">\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"iDAAA,MAAMA,EAAmB,IAAM,+kC,MCSlBC,EAAaC,EAAA,MAAAD,UAAAE,EAL1B,WAAAC,CAAAC,G,4CAMUC,KAAAC,QAAgC,UAWzC,CATC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,mBAAmBN,KAAKC,WACnCE,EAAA,OAAAE,IAAA,2CAAKC,MAAM,kBACTH,EAAA,QAAAE,IAAA,8C","ignoreList":[]}
+{"version":3,"names":["messageBubbleCss","MessageBubble","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","variant","render","h","Host","key","class"],"sources":["src/wc/components/MessageBubble/MessageBubble.css?tag=ds-message-bubble&encapsulation=scoped","src/wc/components/MessageBubble/MessageBubble.tsx"],"sourcesContent":[":host {\n  display: inline-flex;\n  max-width: 80%;\n  box-sizing: border-box;\n  -webkit-user-select: text;\n  user-select: text;\n}\n\n.message-bubble {\n  min-width: 0;\n  padding-block: var(--dimension-space-100);\n  padding-inline: calc(var(--dimension-space-100) + var(--dimension-space-025));\n  border-radius: var(--dimension-radius-100);\n  background: var(--color-chrome-background-secondary);\n  color: var(--color-foreground-secondary);\n  font-family: var(--typography-font-family-ui);\n  font-size: var(--typography-fontsize-md);\n  line-height: var(--typography-lineheight-md);\n  font-weight: var(--typography-weight-regular);\n  letter-spacing: var(--typography-letterspacing-negative-half);\n  box-sizing: border-box;\n  overflow-wrap: anywhere;\n}\n\n:host(.message-bubble--user) .message-bubble {\n  background: var(--color-chrome-background-primary);\n  color: var(--color-foreground-primary);\n}\n\n@media (max-width: 767px) {\n  .message-bubble {\n    background: var(--color-background-secondary);\n  }\n\n  :host(.message-bubble--user) .message-bubble {\n    background: var(--color-background-faint-neutral);\n  }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\nexport type MessageBubbleVariant = 'user' | 'received';\n\n@Component({\n  tag: 'ds-message-bubble',\n  styleUrl: 'MessageBubble.css',\n  scoped: true,\n})\nexport class MessageBubble {\n  @Prop() variant: MessageBubbleVariant = 'received';\n\n  render() {\n    return (\n      <Host class={`message-bubble--${this.variant}`}>\n        <div class=\"message-bubble\">\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"2DAAA,MAAMA,EAAmB,IAAM,4lC,MCSlBC,EAAaC,EAAA,MAAAD,UAAAE,EAL1B,WAAAC,CAAAC,G,4CAMUC,KAAAC,QAAgC,UAWzC,CATC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,mBAAmBN,KAAKC,WACnCE,EAAA,OAAAE,IAAA,2CAAKC,MAAM,kBACTH,EAAA,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/components/ds-message-composer.js

@@ -1,2 +1,2 @@
-import{p as e,H as s,c as o,h as r,a,t}from"./index.js";import{d as c}from"./p-Cn6AfzeF.js";import{d as i}from"./p-BzYW1IqO.js";import{d}from"./p-D7K1ZHML.js";import{d as m}from"./p-DjkUFlDW.js";import{d as n}from"./p-0XTyQNRG.js";import{d as l}from"./p-ZwRLjD5M.js";import{d as p}from"./p-C_Ma6Xa-.js";const g=()=>`@media (forced-colors: active){.sc-ds-message-composer:root,.sc-ds-message-composer-h,.ds-forced-colors-scope.sc-ds-message-composer{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-message-composer-h{display:block;width:100%;box-sizing:border-box;-webkit-user-select:none;user-select:none}.message-composer.sc-ds-message-composer{display:flex;flex-direction:column;gap:var(--dimension-space-050);width:100%;margin:0}.message-composer__attachments.sc-ds-message-composer:empty,.message-composer__tools.sc-ds-message-composer:empty,.message-composer__error-actions.sc-ds-message-composer:empty{display:none}.message-composer__error-support.sc-ds-message-composer,.message-composer__error-message.sc-ds-message-composer,.message-composer__error-actions.sc-ds-message-composer{display:flex;align-items:center}.message-composer__error-support.sc-ds-message-composer{justify-content:space-between;flex-wrap:wrap;gap:var(--dimension-space-075) var(--dimension-space-100);min-width:0;padding:var(--dimension-space-075) var(--dimension-space-100);background:var(--color-background-faint-negative)}.message-composer__error-message.sc-ds-message-composer{flex:1 1 var(--dimension-panel-width-xs);gap:var(--dimension-space-050);min-width:0;color:var(--color-foreground-bold-negative)}.message-composer__error-actions.sc-ds-message-composer{flex:0 1 auto;flex-wrap:wrap;gap:var(--dimension-space-050)}.message-composer__stack.sc-ds-message-composer{min-width:0}.message-composer--error.sc-ds-message-composer .message-composer__stack.sc-ds-message-composer{overflow:hidden;border:var(--dimension-stroke-width-012) solid var(--color-border-bold-negative);border-radius:var(--dimension-radius-125);background:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-md)}.message-composer__field.sc-ds-message-composer{display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-100);border-radius:var(--dimension-radius-125);background:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-md);overflow:hidden}.message-composer.sc-ds-message-composer:not(.message-composer--error) .message-composer__field.sc-ds-message-composer:focus-within{box-shadow:var(--effect-elevation-elevated-md),     inset 0 0 0 var(--dimension-stroke-width-018) var(--color-border-bold-brand)}.message-composer--error.sc-ds-message-composer .message-composer__field.sc-ds-message-composer{border-radius:0;box-shadow:none}textarea.sc-ds-message-composer{field-sizing:content;width:100%;min-height:calc(var(--typography-lineheight-md) * 2 + var(--dimension-space-150));max-height:calc(var(--typography-lineheight-md) * 6 + var(--dimension-space-150));padding:var(--dimension-space-075);border:none;outline:none;resize:none;overflow-y:auto;box-sizing:border-box;background:transparent;color:var(--color-foreground-primary);font-family:var(--typography-font-family-ui);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half);-webkit-user-select:text;user-select:text}textarea.sc-ds-message-composer::placeholder{color:var(--color-foreground-secondary)}textarea.sc-ds-message-composer:focus::placeholder{color:var(--color-foreground-quaternary)}textarea.sc-ds-message-composer:focus,textarea.sc-ds-message-composer:focus-visible{outline:none}.message-composer__tools.sc-ds-message-composer{display:flex;align-items:center;gap:var(--dimension-space-050);min-height:var(--dimension-size-400)}.message-composer__controls.sc-ds-message-composer{display:flex;align-items:center;justify-content:space-between;gap:var(--dimension-space-050);width:100%;min-width:0}.message-composer__actions.sc-ds-message-composer{display:flex;align-items:center;gap:var(--dimension-space-100);flex:0 0 auto;margin-inline-start:auto}@media (forced-colors: active){.message-composer__field.sc-ds-message-composer{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);box-shadow:none}.message-composer--error.sc-ds-message-composer .message-composer__field.sc-ds-message-composer{border:0}.message-composer--error.sc-ds-message-composer .message-composer__stack.sc-ds-message-composer{border:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-content);box-shadow:none}.message-composer__error-support.sc-ds-message-composer{border-block-end:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);background:var(--ds-forced-color-surface)}}`;let f=0;const h=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsInput=o(this,"dsInput",7);this.dsSubmit=o(this,"dsSubmit",7);this.dsStop=o(this,"dsStop",7);this.value="";this.placeholder="Write a message";this.label="Message";this.status="ready";this.isInactive=false;this.submitIntent="brand";this.errorId=`ds-message-composer-error-${++f}`;this.handleInput=e=>{this.value=e.target.value;this.dsInput.emit(this.value)};this.handleKeyDown=e=>{if(e.key!=="Enter"||e.shiftKey||e.isComposing)return;e.preventDefault();this.submit()};this.handleAction=()=>{if(this.streaming)this.dsStop.emit();else this.submit()}}async setFocus(){this.textarea?.focus()}get streaming(){return this.status==="submitted"||this.status==="streaming"}submit(){const e=this.value.trim();if(!e||this.isInactive||this.streaming)return;this.dsSubmit.emit({text:e})}render(){const e=this.status==="error";const s=this.errorMessage||"Message could not be sent.";const o=!this.streaming&&(this.isInactive||!this.value.trim());return r(a,{key:"34890a5cdb648f9f2b0c2c71a7f92f149a052786"},r("form",{key:"9faa43a81aa840aad112554daf942abfed25886a",class:{"message-composer":true,"message-composer--error":e},"aria-busy":this.streaming?"true":undefined,onSubmit:e=>{e.preventDefault();this.submit()}},r("div",{key:"6e13f7c820fed6f9bff9b4e20395ee5f715b8929",class:"message-composer__attachments"},r("slot",{key:"ef670111d0ded902a713ebd23ad44a03d75d9f5d",name:"attachments"})),r("div",{key:"e08157be5913465cd704660fe1fd89e725d08c21",class:"message-composer__stack"},e?r("div",{class:"message-composer__error-support"},r("div",{id:this.errorId,class:"message-composer__error-message",role:"alert"},r("ds-icon",{name:"ExclamationTriangle",size:"xs",color:"inherit"}),r("ds-text",{variant:"text-body-small",color:"negative"},s)),r("div",{class:"message-composer__error-actions"},r("slot",{name:"error-actions"}))):null,r("div",{key:"3b76f088848b923ffe49dbb4c1e1dc2e897d0f08",class:"message-composer__field"},r("textarea",{key:"e6783ce622e97a4ffe58d29232b18cb8e1258ac5",ref:e=>{this.textarea=e},value:this.value,placeholder:this.placeholder,"aria-label":this.label,"aria-invalid":e?"true":undefined,"aria-describedby":e?this.errorId:undefined,disabled:this.isInactive,onInput:this.handleInput,onKeyDown:this.handleKeyDown}),r("div",{key:"a829b52b36369fada6a5b6edff98aadbe7388b61",class:"message-composer__controls"},r("div",{key:"4143f08477e208a47eac1130a67a9fd708932413",class:"message-composer__tools"},r("slot",{key:"dce17e805952ce77b1dc1392429ba21238719b82",name:"tools"})),r("div",{key:"bf92ee3f7a3e5ecf107f06f5adc7ca5d7fce9a55",class:"message-composer__actions"},r("slot",{key:"a23c756eb9c931cfedc028d0c37368caec106794",name:"actions"}),o?r("ds-tooltip",{label:"Send message",side:"top",size:"sm"},r("ds-button-unfilled",{class:"message-composer__action",variant:"icon",icon:"ArrowUp",size:"md","aria-label":"Send message",hasBorder:true,isInactive:true,onDsClick:this.handleAction})):r("ds-tooltip",{label:this.streaming?"Stop response":"Send message",side:"top",size:"sm"},r("ds-button-filled",{class:"message-composer__action",variant:"icon",icon:this.streaming?"SquareFilled":"ArrowUp",intent:this.streaming?"brand":this.submitIntent,contrast:"bold",size:"md","aria-label":this.streaming?"Stop response":"Send message",onDsClick:this.handleAction}))))))))}get el(){return this}static get style(){return g()}},[262,"ds-message-composer",{value:[1025],placeholder:[1],label:[1],status:[1],errorMessage:[1,"error-message"],isInactive:[4,"is-inactive"],submitIntent:[1,"submit-intent"],setFocus:[64]}]);function b(){if(typeof customElements==="undefined"){return}const e=["ds-message-composer","ds-badge","ds-button-filled","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-message-composer":if(!customElements.get(t(e))){customElements.define(t(e),h)}break;case"ds-badge":if(!customElements.get(t(e))){c()}break;case"ds-button-filled":if(!customElements.get(t(e))){i()}break;case"ds-button-unfilled":if(!customElements.get(t(e))){d()}break;case"ds-icon":if(!customElements.get(t(e))){m()}break;case"ds-loader":if(!customElements.get(t(e))){n()}break;case"ds-text":if(!customElements.get(t(e))){l()}break;case"ds-tooltip":if(!customElements.get(t(e))){p()}break}}))}b();const u=h;const v=b;export{u as DsMessageComposer,v as defineCustomElement};
+import{p as e,H as s,c as o,h as r,a,t}from"./index.js";import{d as c}from"./p-CwdRaJER.js";import{d as i}from"./p-MOJmB6vX.js";import{d}from"./p-D6FRqNhN.js";import{d as m}from"./p-DjkUFlDW.js";import{d as n}from"./p-0XTyQNRG.js";import{d as l}from"./p-D8OWhnID.js";import{d as p}from"./p-DIQiHX0q.js";const g=()=>`@media (forced-colors: active){.sc-ds-message-composer:root,.sc-ds-message-composer-h,.ds-forced-colors-scope.sc-ds-message-composer{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-message-composer-h{display:block;width:100%;box-sizing:border-box;-webkit-user-select:none;user-select:none}.message-composer.sc-ds-message-composer{display:flex;flex-direction:column;gap:var(--dimension-space-050);width:100%;margin:0}.message-composer__attachments.sc-ds-message-composer:empty,.message-composer__tools.sc-ds-message-composer:empty,.message-composer__error-actions.sc-ds-message-composer:empty{display:none}.message-composer__error-support.sc-ds-message-composer,.message-composer__error-message.sc-ds-message-composer,.message-composer__error-actions.sc-ds-message-composer{display:flex;align-items:center}.message-composer__error-support.sc-ds-message-composer{justify-content:space-between;flex-wrap:wrap;gap:var(--dimension-space-075) var(--dimension-space-100);min-width:0;padding:var(--dimension-space-075) var(--dimension-space-100);background:var(--color-background-faint-negative)}.message-composer__error-message.sc-ds-message-composer{flex:1 1 var(--dimension-panel-width-xs);gap:var(--dimension-space-050);min-width:0;color:var(--color-foreground-bold-negative)}.message-composer__error-actions.sc-ds-message-composer{flex:0 1 auto;flex-wrap:wrap;gap:var(--dimension-space-050)}.message-composer__stack.sc-ds-message-composer{min-width:0}.message-composer--error.sc-ds-message-composer .message-composer__stack.sc-ds-message-composer{overflow:hidden;border:var(--dimension-stroke-width-012) solid var(--color-border-bold-negative);border-radius:var(--dimension-radius-050);background:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-md)}.message-composer__field.sc-ds-message-composer{display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-100);border-radius:var(--dimension-radius-050);background:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-md);overflow:hidden}.message-composer.sc-ds-message-composer:not(.message-composer--error) .message-composer__field.sc-ds-message-composer:focus-within{box-shadow:var(--effect-elevation-elevated-md),     inset 0 0 0 var(--dimension-stroke-width-018) var(--color-border-bold-brand)}.message-composer--error.sc-ds-message-composer .message-composer__field.sc-ds-message-composer{border-radius:0;box-shadow:none}textarea.sc-ds-message-composer{field-sizing:content;width:100%;min-height:calc(var(--typography-lineheight-md) * 2 + var(--dimension-space-150));max-height:calc(var(--typography-lineheight-md) * 6 + var(--dimension-space-150));padding:var(--dimension-space-075);border:none;outline:none;resize:none;overflow-y:auto;box-sizing:border-box;background:transparent;color:var(--color-foreground-primary);font-family:var(--typography-font-family-ui);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half);-webkit-user-select:text;user-select:text}textarea.sc-ds-message-composer::placeholder{color:var(--color-foreground-secondary)}textarea.sc-ds-message-composer:focus::placeholder{color:var(--color-foreground-quaternary)}textarea.sc-ds-message-composer:focus,textarea.sc-ds-message-composer:focus-visible{outline:none}.message-composer__tools.sc-ds-message-composer{display:flex;align-items:center;gap:var(--dimension-space-050);min-height:var(--dimension-size-400)}.message-composer__controls.sc-ds-message-composer{display:flex;align-items:center;justify-content:space-between;gap:var(--dimension-space-050);width:100%;min-width:0}.message-composer__actions.sc-ds-message-composer{display:flex;align-items:center;gap:var(--dimension-space-100);flex:0 0 auto;margin-inline-start:auto}@media (forced-colors: active){.message-composer__field.sc-ds-message-composer{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);box-shadow:none}.message-composer--error.sc-ds-message-composer .message-composer__field.sc-ds-message-composer{border:0}.message-composer--error.sc-ds-message-composer .message-composer__stack.sc-ds-message-composer{border:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-content);box-shadow:none}.message-composer__error-support.sc-ds-message-composer{border-block-end:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);background:var(--ds-forced-color-surface)}}`;let f=0;const h=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsInput=o(this,"dsInput",7);this.dsSubmit=o(this,"dsSubmit",7);this.dsStop=o(this,"dsStop",7);this.value="";this.placeholder="Write a message";this.label="Message";this.status="ready";this.isInactive=false;this.submitIntent="brand";this.errorId=`ds-message-composer-error-${++f}`;this.handleInput=e=>{this.value=e.target.value;this.dsInput.emit(this.value)};this.handleKeyDown=e=>{if(e.key!=="Enter"||e.shiftKey||e.isComposing)return;e.preventDefault();this.submit()};this.handleAction=()=>{if(this.streaming)this.dsStop.emit();else this.submit()}}async setFocus(){this.textarea?.focus()}get streaming(){return this.status==="submitted"||this.status==="streaming"}submit(){const e=this.value.trim();if(!e||this.isInactive||this.streaming)return;this.dsSubmit.emit({text:e})}render(){const e=this.status==="error";const s=this.errorMessage||"Message could not be sent.";const o=!this.streaming&&(this.isInactive||!this.value.trim());return r(a,{key:"b5f2fc58bbe5bf758567aed1d3e08364ae1428b6"},r("form",{key:"74525da3a570c022e2a996fca9c32fd3d0c44bcc",class:{"message-composer":true,"message-composer--error":e},"aria-busy":this.streaming?"true":undefined,onSubmit:e=>{e.preventDefault();this.submit()}},r("div",{key:"a40db00d85e4141b386b277b2f88b64b462125f2",class:"message-composer__attachments"},r("slot",{key:"db8b10ea9469aacb48c5bac7d6007ad65c7fed0a",name:"attachments"})),r("div",{key:"549233ad35d4d0c619f9a58dc27f96dc9ad6de0b",class:"message-composer__stack"},e?r("div",{class:"message-composer__error-support"},r("div",{id:this.errorId,class:"message-composer__error-message",role:"alert"},r("ds-icon",{name:"ExclamationTriangle",size:"xs",color:"inherit"}),r("ds-text",{variant:"text-body-small",color:"negative"},s)),r("div",{class:"message-composer__error-actions"},r("slot",{name:"error-actions"}))):null,r("div",{key:"f093404acfe8469822a0640c4c73a67fa2a03ce3",class:"message-composer__field"},r("textarea",{key:"1161ae734d2cb967125980d6ca4f967b6d5f11b2",ref:e=>{this.textarea=e},value:this.value,placeholder:this.placeholder,"aria-label":this.label,"aria-invalid":e?"true":undefined,"aria-describedby":e?this.errorId:undefined,disabled:this.isInactive,onInput:this.handleInput,onKeyDown:this.handleKeyDown}),r("div",{key:"3e5f32d5a0fc5e18872ac3e3309806a40dc65b0d",class:"message-composer__controls"},r("div",{key:"2b4bb931fdda4cf9f27dd9bd0d4139ea6d08be4f",class:"message-composer__tools"},r("slot",{key:"81246c9f186c528e3d6a2b4774ae54490650f4d3",name:"tools"})),r("div",{key:"8348079cf396a5d6a53b77c99dd74de8f7ff16a0",class:"message-composer__actions"},r("slot",{key:"accd8598c054639a3e2bf3aa77ab5c7ddc2da496",name:"actions"}),o?r("ds-tooltip",{label:"Send message",side:"top",size:"sm"},r("ds-button-unfilled",{class:"message-composer__action",variant:"icon",icon:"ArrowUp",size:"md",rounded:true,"aria-label":"Send message",hasBorder:true,isInactive:true,onDsClick:this.handleAction})):r("ds-tooltip",{label:this.streaming?"Stop response":"Send message",side:"top",size:"sm"},r("ds-button-filled",{class:"message-composer__action",variant:"icon",icon:this.streaming?"SquareFilled":"ArrowUp",intent:this.streaming?"brand":this.submitIntent,contrast:"bold",size:"md",rounded:true,"aria-label":this.streaming?"Stop response":"Send message",onDsClick:this.handleAction}))))))))}get el(){return this}static get style(){return g()}},[262,"ds-message-composer",{value:[1025],placeholder:[1],label:[1],status:[1],errorMessage:[1,"error-message"],isInactive:[4,"is-inactive"],submitIntent:[1,"submit-intent"],setFocus:[64]}]);function b(){if(typeof customElements==="undefined"){return}const e=["ds-message-composer","ds-badge","ds-button-filled","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-message-composer":if(!customElements.get(t(e))){customElements.define(t(e),h)}break;case"ds-badge":if(!customElements.get(t(e))){c()}break;case"ds-button-filled":if(!customElements.get(t(e))){i()}break;case"ds-button-unfilled":if(!customElements.get(t(e))){d()}break;case"ds-icon":if(!customElements.get(t(e))){m()}break;case"ds-loader":if(!customElements.get(t(e))){n()}break;case"ds-text":if(!customElements.get(t(e))){l()}break;case"ds-tooltip":if(!customElements.get(t(e))){p()}break}}))}b();const u=h;const v=b;export{u as DsMessageComposer,v as defineCustomElement};
 //# sourceMappingURL=ds-message-composer.js.map

package/dist/components/ds-message-composer.js.map

@@ -1 +1 @@
-{"version":3,"names":["messageComposerCss","composerId","MessageComposer","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","placeholder","label","status","isInactive","submitIntent","errorId","handleInput","event","target","dsInput","emit","handleKeyDown","key","shiftKey","isComposing","preventDefault","submit","handleAction","streaming","dsStop","setFocus","textarea","focus","text","trim","dsSubmit","render","error","visibleErrorMessage","errorMessage","actionInactive","h","Host","class","undefined","onSubmit","name","id","role","size","color","variant","ref","element","disabled","onInput","onKeyDown","side","icon","hasBorder","onDsClick","intent","contrast"],"sources":["src/wc/components/MessageComposer/MessageComposer.css?tag=ds-message-composer&encapsulation=scoped","src/wc/components/MessageComposer/MessageComposer.tsx"],"sourcesContent":["@import '../../utils/forced-colors.css';\n\n:host {\n  display: block;\n  width: 100%;\n  box-sizing: border-box;\n  -webkit-user-select: none;\n  user-select: none;\n}\n\n.message-composer {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050);\n  width: 100%;\n  margin: 0;\n}\n\n.message-composer__attachments:empty,\n.message-composer__tools:empty,\n.message-composer__error-actions:empty {\n  display: none;\n}\n\n.message-composer__error-support,\n.message-composer__error-message,\n.message-composer__error-actions {\n  display: flex;\n  align-items: center;\n}\n\n.message-composer__error-support {\n  justify-content: space-between;\n  flex-wrap: wrap;\n  gap: var(--dimension-space-075) var(--dimension-space-100);\n  min-width: 0;\n  padding: var(--dimension-space-075) var(--dimension-space-100);\n  background: var(--color-background-faint-negative);\n}\n\n.message-composer__error-message {\n  flex: 1 1 var(--dimension-panel-width-xs);\n  gap: var(--dimension-space-050);\n  min-width: 0;\n  color: var(--color-foreground-bold-negative);\n}\n\n.message-composer__error-actions {\n  flex: 0 1 auto;\n  flex-wrap: wrap;\n  gap: var(--dimension-space-050);\n}\n\n.message-composer__stack {\n  min-width: 0;\n}\n\n.message-composer--error .message-composer__stack {\n  overflow: hidden;\n  border: var(--dimension-stroke-width-012) solid var(--color-border-bold-negative);\n  border-radius: var(--dimension-radius-125);\n  background: var(--color-background-primary);\n  box-shadow: var(--effect-elevation-elevated-md);\n}\n\n.message-composer__field {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050);\n  padding: var(--dimension-space-100);\n  border-radius: var(--dimension-radius-125);\n  background: var(--color-background-primary);\n  box-shadow: var(--effect-elevation-elevated-md);\n  overflow: hidden;\n}\n\n.message-composer:not(.message-composer--error) .message-composer__field:focus-within {\n  box-shadow:\n    var(--effect-elevation-elevated-md),\n    inset 0 0 0 var(--dimension-stroke-width-018) var(--color-border-bold-brand);\n}\n\n.message-composer--error .message-composer__field {\n  border-radius: 0;\n  box-shadow: none;\n}\n\ntextarea {\n  field-sizing: content;\n  width: 100%;\n  min-height: calc(var(--typography-lineheight-md) * 2 + var(--dimension-space-150));\n  max-height: calc(var(--typography-lineheight-md) * 6 + var(--dimension-space-150));\n  padding: var(--dimension-space-075);\n  border: none;\n  outline: none;\n  resize: none;\n  overflow-y: auto;\n  box-sizing: border-box;\n  background: transparent;\n  color: var(--color-foreground-primary);\n  font-family: var(--typography-font-family-ui);\n  font-size: var(--typography-fontsize-md);\n  line-height: var(--typography-lineheight-md);\n  font-weight: var(--typography-weight-regular);\n  letter-spacing: var(--typography-letterspacing-negative-half);\n  -webkit-user-select: text;\n  user-select: text;\n}\n\ntextarea::placeholder {\n  color: var(--color-foreground-secondary);\n}\n\ntextarea:focus::placeholder {\n  color: var(--color-foreground-quaternary);\n}\n\ntextarea:focus,\ntextarea:focus-visible {\n  outline: none;\n}\n\n.message-composer__tools {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-050);\n  min-height: var(--dimension-size-400);\n}\n\n.message-composer__controls {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--dimension-space-050);\n  width: 100%;\n  min-width: 0;\n}\n\n.message-composer__actions {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-100);\n  flex: 0 0 auto;\n  margin-inline-start: auto;\n}\n\n@media (forced-colors: active) {\n  .message-composer__field {\n    border: var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);\n    box-shadow: none;\n  }\n\n  .message-composer--error .message-composer__field {\n    border: 0;\n  }\n\n  .message-composer--error .message-composer__stack {\n    border: var(--dimension-stroke-width-025) dashed var(--ds-forced-color-content);\n    box-shadow: none;\n  }\n\n  .message-composer__error-support {\n    border-block-end: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n    background: var(--ds-forced-color-surface);\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport type { ButtonFilledIntent } from '../ButtonFilled/ButtonFilled';\nimport type { MessageComposerStatus } from '../conversation-types';\n\nlet composerId = 0;\n\n@Component({\n  tag: 'ds-message-composer',\n  styleUrl: 'MessageComposer.css',\n  scoped: true,\n})\nexport class MessageComposer {\n  @Element() el!: HTMLElement;\n\n  @Prop({ mutable: true }) value: string = '';\n  @Prop() placeholder: string = 'Write a message';\n  @Prop() label: string = 'Message';\n  @Prop() status: MessageComposerStatus = 'ready';\n  /** Submission failure shown while status is error. */\n  @Prop() errorMessage?: string;\n  @Prop() isInactive: boolean = false;\n  @Prop() submitIntent: ButtonFilledIntent = 'brand';\n\n  @Event() dsInput!: EventEmitter<string>;\n  @Event() dsSubmit!: EventEmitter<{ text: string }>;\n  @Event() dsStop!: EventEmitter<void>;\n\n  private textarea?: HTMLTextAreaElement;\n  private readonly errorId = `ds-message-composer-error-${++composerId}`;\n\n  @Method()\n  async setFocus() {\n    this.textarea?.focus();\n  }\n\n  private get streaming(): boolean {\n    return this.status === 'submitted' || this.status === 'streaming';\n  }\n\n  private handleInput = (event: Event) => {\n    this.value = (event.target as HTMLTextAreaElement).value;\n    this.dsInput.emit(this.value);\n  };\n\n  private submit() {\n    const text = this.value.trim();\n    if (!text || this.isInactive || this.streaming) return;\n    this.dsSubmit.emit({ text });\n  }\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key !== 'Enter' || event.shiftKey || event.isComposing) return;\n    event.preventDefault();\n    this.submit();\n  };\n\n  private handleAction = () => {\n    if (this.streaming) this.dsStop.emit();\n    else this.submit();\n  };\n\n  render() {\n    const error = this.status === 'error';\n    const visibleErrorMessage = this.errorMessage || 'Message could not be sent.';\n    const actionInactive = !this.streaming && (this.isInactive || !this.value.trim());\n    return (\n      <Host>\n        <form\n          class={{ 'message-composer': true, 'message-composer--error': error }}\n          aria-busy={this.streaming ? 'true' : undefined}\n          onSubmit={(event: Event) => {\n            event.preventDefault();\n            this.submit();\n          }}\n        >\n          <div class=\"message-composer__attachments\">\n            <slot name=\"attachments\" />\n          </div>\n          <div class=\"message-composer__stack\">\n            {error ? (\n              <div class=\"message-composer__error-support\">\n                <div id={this.errorId} class=\"message-composer__error-message\" role=\"alert\">\n                  <ds-icon name=\"ExclamationTriangle\" size=\"xs\" color=\"inherit\" />\n                  <ds-text variant=\"text-body-small\" color=\"negative\">\n                    {visibleErrorMessage}\n                  </ds-text>\n                </div>\n                <div class=\"message-composer__error-actions\">\n                  <slot name=\"error-actions\" />\n                </div>\n              </div>\n            ) : null}\n            <div class=\"message-composer__field\">\n              <textarea\n                ref={element => {\n                  this.textarea = element;\n                }}\n                value={this.value}\n                placeholder={this.placeholder}\n                aria-label={this.label}\n                aria-invalid={error ? 'true' : undefined}\n                aria-describedby={error ? this.errorId : undefined}\n                disabled={this.isInactive}\n                onInput={this.handleInput}\n                onKeyDown={this.handleKeyDown}\n              />\n              <div class=\"message-composer__controls\">\n                <div class=\"message-composer__tools\">\n                  <slot name=\"tools\" />\n                </div>\n                <div class=\"message-composer__actions\">\n                  <slot name=\"actions\" />\n                  {actionInactive ? (\n                    <ds-tooltip label=\"Send message\" side=\"top\" size=\"sm\">\n                      <ds-button-unfilled\n                        class=\"message-composer__action\"\n                        variant=\"icon\"\n                        icon=\"ArrowUp\"\n                        size=\"md\"\n                        aria-label=\"Send message\"\n                        hasBorder\n                        isInactive\n                        onDsClick={this.handleAction}\n                      />\n                    </ds-tooltip>\n                  ) : (\n                    <ds-tooltip\n                      label={this.streaming ? 'Stop response' : 'Send message'}\n                      side=\"top\"\n                      size=\"sm\"\n                    >\n                      <ds-button-filled\n                        class=\"message-composer__action\"\n                        variant=\"icon\"\n                        icon={this.streaming ? 'SquareFilled' : 'ArrowUp'}\n                        intent={this.streaming ? 'brand' : this.submitIntent}\n                        contrast=\"bold\"\n                        size=\"md\"\n                        aria-label={this.streaming ? 'Stop response' : 'Send message'}\n                        onDsClick={this.handleAction}\n                      />\n                    </ds-tooltip>\n                  )}\n                </div>\n              </div>\n            </div>\n          </div>\n        </form>\n      </Host>\n    );\n  }\n}\n"],"mappings":"+SAAA,MAAMA,EAAqB,IAAM,ioJCIjC,IAAIC,EAAa,E,MAOJC,EAAeC,EAAA,MAAAD,UAAAE,EAL5B,WAAAC,CAAAC,G,+IAQ2BC,KAAAC,MAAgB,GACjCD,KAAAE,YAAsB,kBACtBF,KAAAG,MAAgB,UAChBH,KAAAI,OAAgC,QAGhCJ,KAAAK,WAAsB,MACtBL,KAAAM,aAAmC,QAO1BN,KAAAO,QAAU,+BAA+Bb,IAWlDM,KAAAQ,YAAeC,IACrBT,KAAKC,MAASQ,EAAMC,OAA+BT,MACnDD,KAAKW,QAAQC,KAAKZ,KAAKC,MAAM,EASvBD,KAAAa,cAAiBJ,IACvB,GAAIA,EAAMK,MAAQ,SAAWL,EAAMM,UAAYN,EAAMO,YAAa,OAClEP,EAAMQ,iBACNjB,KAAKkB,QAAQ,EAGPlB,KAAAmB,aAAe,KACrB,GAAInB,KAAKoB,UAAWpB,KAAKqB,OAAOT,YAC3BZ,KAAKkB,QAAQ,CA6FrB,CAxHC,cAAMI,GACJtB,KAAKuB,UAAUC,O,CAGjB,aAAYJ,GACV,OAAOpB,KAAKI,SAAW,aAAeJ,KAAKI,SAAW,W,CAQhD,MAAAc,GACN,MAAMO,EAAOzB,KAAKC,MAAMyB,OACxB,IAAKD,GAAQzB,KAAKK,YAAcL,KAAKoB,UAAW,OAChDpB,KAAK2B,SAASf,KAAK,CAAEa,Q,CAcvB,MAAAG,GACE,MAAMC,EAAQ7B,KAAKI,SAAW,QAC9B,MAAM0B,EAAsB9B,KAAK+B,cAAgB,6BACjD,MAAMC,GAAkBhC,KAAKoB,YAAcpB,KAAKK,aAAeL,KAAKC,MAAMyB,QAC1E,OACEO,EAACC,EAAI,CAAApB,IAAA,4CACHmB,EAAA,QAAAnB,IAAA,2CACEqB,MAAO,CAAE,mBAAoB,KAAM,0BAA2BN,GAAO,YAC1D7B,KAAKoB,UAAY,OAASgB,UACrCC,SAAW5B,IACTA,EAAMQ,iBACNjB,KAAKkB,QAAQ,GAGfe,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,iCACTF,EAAA,QAAAnB,IAAA,2CAAMwB,KAAK,iBAEbL,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,2BACRN,EACCI,EAAA,OAAKE,MAAM,mCACTF,EAAA,OAAKM,GAAIvC,KAAKO,QAAS4B,MAAM,kCAAkCK,KAAK,SAClEP,EAAA,WAASK,KAAK,sBAAsBG,KAAK,KAAKC,MAAM,YACpDT,EAAA,WAASU,QAAQ,kBAAkBD,MAAM,YACtCZ,IAGLG,EAAA,OAAKE,MAAM,mCACTF,EAAA,QAAMK,KAAK,oBAGb,KACJL,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,2BACTF,EAAA,YAAAnB,IAAA,2CACE8B,IAAKC,IACH7C,KAAKuB,SAAWsB,CAAO,EAEzB5C,MAAOD,KAAKC,MACZC,YAAaF,KAAKE,YAAW,aACjBF,KAAKG,MAAK,eACR0B,EAAQ,OAASO,UAAS,mBACtBP,EAAQ7B,KAAKO,QAAU6B,UACzCU,SAAU9C,KAAKK,WACf0C,QAAS/C,KAAKQ,YACdwC,UAAWhD,KAAKa,gBAElBoB,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,8BACTF,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,2BACTF,EAAA,QAAAnB,IAAA,2CAAMwB,KAAK,WAEbL,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,6BACTF,EAAA,QAAAnB,IAAA,2CAAMwB,KAAK,YACVN,EACCC,EAAA,cAAY9B,MAAM,eAAe8C,KAAK,MAAMR,KAAK,MAC/CR,EAAA,sBACEE,MAAM,2BACNQ,QAAQ,OACRO,KAAK,UACLT,KAAK,KAAI,aACE,eACXU,UAAS,KACT9C,WAAU,KACV+C,UAAWpD,KAAKmB,gBAIpBc,EAAA,cACE9B,MAAOH,KAAKoB,UAAY,gBAAkB,eAC1C6B,KAAK,MACLR,KAAK,MAELR,EAAA,oBACEE,MAAM,2BACNQ,QAAQ,OACRO,KAAMlD,KAAKoB,UAAY,eAAiB,UACxCiC,OAAQrD,KAAKoB,UAAY,QAAUpB,KAAKM,aACxCgD,SAAS,OACTb,KAAK,KAAI,aACGzC,KAAKoB,UAAY,gBAAkB,eAC/CgC,UAAWpD,KAAKmB,qB","ignoreList":[]}
+{"version":3,"names":["messageComposerCss","composerId","MessageComposer","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","placeholder","label","status","isInactive","submitIntent","errorId","handleInput","event","target","dsInput","emit","handleKeyDown","key","shiftKey","isComposing","preventDefault","submit","handleAction","streaming","dsStop","setFocus","textarea","focus","text","trim","dsSubmit","render","error","visibleErrorMessage","errorMessage","actionInactive","h","Host","class","undefined","onSubmit","name","id","role","size","color","variant","ref","element","disabled","onInput","onKeyDown","side","icon","rounded","hasBorder","onDsClick","intent","contrast"],"sources":["src/wc/components/MessageComposer/MessageComposer.css?tag=ds-message-composer&encapsulation=scoped","src/wc/components/MessageComposer/MessageComposer.tsx"],"sourcesContent":["@import '../../utils/forced-colors.css';\n\n:host {\n  display: block;\n  width: 100%;\n  box-sizing: border-box;\n  -webkit-user-select: none;\n  user-select: none;\n}\n\n.message-composer {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050);\n  width: 100%;\n  margin: 0;\n}\n\n.message-composer__attachments:empty,\n.message-composer__tools:empty,\n.message-composer__error-actions:empty {\n  display: none;\n}\n\n.message-composer__error-support,\n.message-composer__error-message,\n.message-composer__error-actions {\n  display: flex;\n  align-items: center;\n}\n\n.message-composer__error-support {\n  justify-content: space-between;\n  flex-wrap: wrap;\n  gap: var(--dimension-space-075) var(--dimension-space-100);\n  min-width: 0;\n  padding: var(--dimension-space-075) var(--dimension-space-100);\n  background: var(--color-background-faint-negative);\n}\n\n.message-composer__error-message {\n  flex: 1 1 var(--dimension-panel-width-xs);\n  gap: var(--dimension-space-050);\n  min-width: 0;\n  color: var(--color-foreground-bold-negative);\n}\n\n.message-composer__error-actions {\n  flex: 0 1 auto;\n  flex-wrap: wrap;\n  gap: var(--dimension-space-050);\n}\n\n.message-composer__stack {\n  min-width: 0;\n}\n\n.message-composer--error .message-composer__stack {\n  overflow: hidden;\n  border: var(--dimension-stroke-width-012) solid var(--color-border-bold-negative);\n  border-radius: var(--dimension-radius-050);\n  background: var(--color-background-primary);\n  box-shadow: var(--effect-elevation-elevated-md);\n}\n\n.message-composer__field {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050);\n  padding: var(--dimension-space-100);\n  border-radius: var(--dimension-radius-050);\n  background: var(--color-background-primary);\n  box-shadow: var(--effect-elevation-elevated-md);\n  overflow: hidden;\n}\n\n.message-composer:not(.message-composer--error) .message-composer__field:focus-within {\n  box-shadow:\n    var(--effect-elevation-elevated-md),\n    inset 0 0 0 var(--dimension-stroke-width-018) var(--color-border-bold-brand);\n}\n\n.message-composer--error .message-composer__field {\n  border-radius: 0;\n  box-shadow: none;\n}\n\ntextarea {\n  field-sizing: content;\n  width: 100%;\n  min-height: calc(var(--typography-lineheight-md) * 2 + var(--dimension-space-150));\n  max-height: calc(var(--typography-lineheight-md) * 6 + var(--dimension-space-150));\n  padding: var(--dimension-space-075);\n  border: none;\n  outline: none;\n  resize: none;\n  overflow-y: auto;\n  box-sizing: border-box;\n  background: transparent;\n  color: var(--color-foreground-primary);\n  font-family: var(--typography-font-family-ui);\n  font-size: var(--typography-fontsize-md);\n  line-height: var(--typography-lineheight-md);\n  font-weight: var(--typography-weight-regular);\n  letter-spacing: var(--typography-letterspacing-negative-half);\n  -webkit-user-select: text;\n  user-select: text;\n}\n\ntextarea::placeholder {\n  color: var(--color-foreground-secondary);\n}\n\ntextarea:focus::placeholder {\n  color: var(--color-foreground-quaternary);\n}\n\ntextarea:focus,\ntextarea:focus-visible {\n  outline: none;\n}\n\n.message-composer__tools {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-050);\n  min-height: var(--dimension-size-400);\n}\n\n.message-composer__controls {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--dimension-space-050);\n  width: 100%;\n  min-width: 0;\n}\n\n.message-composer__actions {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-100);\n  flex: 0 0 auto;\n  margin-inline-start: auto;\n}\n\n@media (forced-colors: active) {\n  .message-composer__field {\n    border: var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);\n    box-shadow: none;\n  }\n\n  .message-composer--error .message-composer__field {\n    border: 0;\n  }\n\n  .message-composer--error .message-composer__stack {\n    border: var(--dimension-stroke-width-025) dashed var(--ds-forced-color-content);\n    box-shadow: none;\n  }\n\n  .message-composer__error-support {\n    border-block-end: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n    background: var(--ds-forced-color-surface);\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport type { ButtonFilledIntent } from '../ButtonFilled/ButtonFilled';\nimport type { MessageComposerStatus } from '../conversation-types';\n\nlet composerId = 0;\n\n@Component({\n  tag: 'ds-message-composer',\n  styleUrl: 'MessageComposer.css',\n  scoped: true,\n})\nexport class MessageComposer {\n  @Element() el!: HTMLElement;\n\n  @Prop({ mutable: true }) value: string = '';\n  @Prop() placeholder: string = 'Write a message';\n  @Prop() label: string = 'Message';\n  @Prop() status: MessageComposerStatus = 'ready';\n  /** Submission failure shown while status is error. */\n  @Prop() errorMessage?: string;\n  @Prop() isInactive: boolean = false;\n  @Prop() submitIntent: ButtonFilledIntent = 'brand';\n\n  @Event() dsInput!: EventEmitter<string>;\n  @Event() dsSubmit!: EventEmitter<{ text: string }>;\n  @Event() dsStop!: EventEmitter<void>;\n\n  private textarea?: HTMLTextAreaElement;\n  private readonly errorId = `ds-message-composer-error-${++composerId}`;\n\n  @Method()\n  async setFocus() {\n    this.textarea?.focus();\n  }\n\n  private get streaming(): boolean {\n    return this.status === 'submitted' || this.status === 'streaming';\n  }\n\n  private handleInput = (event: Event) => {\n    this.value = (event.target as HTMLTextAreaElement).value;\n    this.dsInput.emit(this.value);\n  };\n\n  private submit() {\n    const text = this.value.trim();\n    if (!text || this.isInactive || this.streaming) return;\n    this.dsSubmit.emit({ text });\n  }\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key !== 'Enter' || event.shiftKey || event.isComposing) return;\n    event.preventDefault();\n    this.submit();\n  };\n\n  private handleAction = () => {\n    if (this.streaming) this.dsStop.emit();\n    else this.submit();\n  };\n\n  render() {\n    const error = this.status === 'error';\n    const visibleErrorMessage = this.errorMessage || 'Message could not be sent.';\n    const actionInactive = !this.streaming && (this.isInactive || !this.value.trim());\n    return (\n      <Host>\n        <form\n          class={{ 'message-composer': true, 'message-composer--error': error }}\n          aria-busy={this.streaming ? 'true' : undefined}\n          onSubmit={(event: Event) => {\n            event.preventDefault();\n            this.submit();\n          }}\n        >\n          <div class=\"message-composer__attachments\">\n            <slot name=\"attachments\" />\n          </div>\n          <div class=\"message-composer__stack\">\n            {error ? (\n              <div class=\"message-composer__error-support\">\n                <div id={this.errorId} class=\"message-composer__error-message\" role=\"alert\">\n                  <ds-icon name=\"ExclamationTriangle\" size=\"xs\" color=\"inherit\" />\n                  <ds-text variant=\"text-body-small\" color=\"negative\">\n                    {visibleErrorMessage}\n                  </ds-text>\n                </div>\n                <div class=\"message-composer__error-actions\">\n                  <slot name=\"error-actions\" />\n                </div>\n              </div>\n            ) : null}\n            <div class=\"message-composer__field\">\n              <textarea\n                ref={element => {\n                  this.textarea = element;\n                }}\n                value={this.value}\n                placeholder={this.placeholder}\n                aria-label={this.label}\n                aria-invalid={error ? 'true' : undefined}\n                aria-describedby={error ? this.errorId : undefined}\n                disabled={this.isInactive}\n                onInput={this.handleInput}\n                onKeyDown={this.handleKeyDown}\n              />\n              <div class=\"message-composer__controls\">\n                <div class=\"message-composer__tools\">\n                  <slot name=\"tools\" />\n                </div>\n                <div class=\"message-composer__actions\">\n                  <slot name=\"actions\" />\n                  {actionInactive ? (\n                    <ds-tooltip label=\"Send message\" side=\"top\" size=\"sm\">\n                      <ds-button-unfilled\n                        class=\"message-composer__action\"\n                        variant=\"icon\"\n                        icon=\"ArrowUp\"\n                        size=\"md\"\n                        rounded\n                        aria-label=\"Send message\"\n                        hasBorder\n                        isInactive\n                        onDsClick={this.handleAction}\n                      />\n                    </ds-tooltip>\n                  ) : (\n                    <ds-tooltip\n                      label={this.streaming ? 'Stop response' : 'Send message'}\n                      side=\"top\"\n                      size=\"sm\"\n                    >\n                      <ds-button-filled\n                        class=\"message-composer__action\"\n                        variant=\"icon\"\n                        icon={this.streaming ? 'SquareFilled' : 'ArrowUp'}\n                        intent={this.streaming ? 'brand' : this.submitIntent}\n                        contrast=\"bold\"\n                        size=\"md\"\n                        rounded\n                        aria-label={this.streaming ? 'Stop response' : 'Send message'}\n                        onDsClick={this.handleAction}\n                      />\n                    </ds-tooltip>\n                  )}\n                </div>\n              </div>\n            </div>\n          </div>\n        </form>\n      </Host>\n    );\n  }\n}\n"],"mappings":"+SAAA,MAAMA,EAAqB,IAAM,ioJCIjC,IAAIC,EAAa,E,MAOJC,EAAeC,EAAA,MAAAD,UAAAE,EAL5B,WAAAC,CAAAC,G,+IAQ2BC,KAAAC,MAAgB,GACjCD,KAAAE,YAAsB,kBACtBF,KAAAG,MAAgB,UAChBH,KAAAI,OAAgC,QAGhCJ,KAAAK,WAAsB,MACtBL,KAAAM,aAAmC,QAO1BN,KAAAO,QAAU,+BAA+Bb,IAWlDM,KAAAQ,YAAeC,IACrBT,KAAKC,MAASQ,EAAMC,OAA+BT,MACnDD,KAAKW,QAAQC,KAAKZ,KAAKC,MAAM,EASvBD,KAAAa,cAAiBJ,IACvB,GAAIA,EAAMK,MAAQ,SAAWL,EAAMM,UAAYN,EAAMO,YAAa,OAClEP,EAAMQ,iBACNjB,KAAKkB,QAAQ,EAGPlB,KAAAmB,aAAe,KACrB,GAAInB,KAAKoB,UAAWpB,KAAKqB,OAAOT,YAC3BZ,KAAKkB,QAAQ,CA+FrB,CA1HC,cAAMI,GACJtB,KAAKuB,UAAUC,O,CAGjB,aAAYJ,GACV,OAAOpB,KAAKI,SAAW,aAAeJ,KAAKI,SAAW,W,CAQhD,MAAAc,GACN,MAAMO,EAAOzB,KAAKC,MAAMyB,OACxB,IAAKD,GAAQzB,KAAKK,YAAcL,KAAKoB,UAAW,OAChDpB,KAAK2B,SAASf,KAAK,CAAEa,Q,CAcvB,MAAAG,GACE,MAAMC,EAAQ7B,KAAKI,SAAW,QAC9B,MAAM0B,EAAsB9B,KAAK+B,cAAgB,6BACjD,MAAMC,GAAkBhC,KAAKoB,YAAcpB,KAAKK,aAAeL,KAAKC,MAAMyB,QAC1E,OACEO,EAACC,EAAI,CAAApB,IAAA,4CACHmB,EAAA,QAAAnB,IAAA,2CACEqB,MAAO,CAAE,mBAAoB,KAAM,0BAA2BN,GAAO,YAC1D7B,KAAKoB,UAAY,OAASgB,UACrCC,SAAW5B,IACTA,EAAMQ,iBACNjB,KAAKkB,QAAQ,GAGfe,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,iCACTF,EAAA,QAAAnB,IAAA,2CAAMwB,KAAK,iBAEbL,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,2BACRN,EACCI,EAAA,OAAKE,MAAM,mCACTF,EAAA,OAAKM,GAAIvC,KAAKO,QAAS4B,MAAM,kCAAkCK,KAAK,SAClEP,EAAA,WAASK,KAAK,sBAAsBG,KAAK,KAAKC,MAAM,YACpDT,EAAA,WAASU,QAAQ,kBAAkBD,MAAM,YACtCZ,IAGLG,EAAA,OAAKE,MAAM,mCACTF,EAAA,QAAMK,KAAK,oBAGb,KACJL,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,2BACTF,EAAA,YAAAnB,IAAA,2CACE8B,IAAKC,IACH7C,KAAKuB,SAAWsB,CAAO,EAEzB5C,MAAOD,KAAKC,MACZC,YAAaF,KAAKE,YAAW,aACjBF,KAAKG,MAAK,eACR0B,EAAQ,OAASO,UAAS,mBACtBP,EAAQ7B,KAAKO,QAAU6B,UACzCU,SAAU9C,KAAKK,WACf0C,QAAS/C,KAAKQ,YACdwC,UAAWhD,KAAKa,gBAElBoB,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,8BACTF,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,2BACTF,EAAA,QAAAnB,IAAA,2CAAMwB,KAAK,WAEbL,EAAA,OAAAnB,IAAA,2CAAKqB,MAAM,6BACTF,EAAA,QAAAnB,IAAA,2CAAMwB,KAAK,YACVN,EACCC,EAAA,cAAY9B,MAAM,eAAe8C,KAAK,MAAMR,KAAK,MAC/CR,EAAA,sBACEE,MAAM,2BACNQ,QAAQ,OACRO,KAAK,UACLT,KAAK,KACLU,QAAO,kBACI,eACXC,UAAS,KACT/C,WAAU,KACVgD,UAAWrD,KAAKmB,gBAIpBc,EAAA,cACE9B,MAAOH,KAAKoB,UAAY,gBAAkB,eAC1C6B,KAAK,MACLR,KAAK,MAELR,EAAA,oBACEE,MAAM,2BACNQ,QAAQ,OACRO,KAAMlD,KAAKoB,UAAY,eAAiB,UACxCkC,OAAQtD,KAAKoB,UAAY,QAAUpB,KAAKM,aACxCiD,SAAS,OACTd,KAAK,KACLU,QAAO,kBACKnD,KAAKoB,UAAY,gBAAkB,eAC/CiC,UAAWrD,KAAKmB,qB","ignoreList":[]}

package/dist/components/ds-message-scroller.js

@@ -1,2 +1,2 @@
-import{p as e,H as s,c as t,h as i,a as r,t as a}from"./index.js";import{S as o}from"./p-Ck1hgD6g.js";import{r as l}from"./p-CochmPyg.js";import{d}from"./p-Cn6AfzeF.js";import{d as n}from"./p-D7K1ZHML.js";import{d as c}from"./p-DjkUFlDW.js";import{d as h}from"./p-0XTyQNRG.js";import{d as f}from"./p-ZwRLjD5M.js";import{d as g}from"./p-C_Ma6Xa-.js";function m(e,s){if(!e.length)return false;if(!s.length)return true;const t=new Set(e);return!s.some((e=>t.has(e)))}function u(e,s){const t=new Set(s);for(const s of e){if(!t.has(s))e.delete(s)}}const v=()=>`@property --ds-scroll-edge-fade-top{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-bottom{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-left{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-right{syntax:'<length-percentage>';inherits:false;initial-value:0px}@keyframes ds-scroll-edge-fade-reveal-top{from{--ds-scroll-edge-fade-top:0px}to{--ds-scroll-edge-fade-top:var(--ds-scroll-edge-fade-target-top)}}@keyframes ds-scroll-edge-fade-reveal-bottom{from{--ds-scroll-edge-fade-bottom:var(--ds-scroll-edge-fade-target-bottom)}to{--ds-scroll-edge-fade-bottom:0px}}@keyframes ds-scroll-edge-fade-reveal-left{from{--ds-scroll-edge-fade-left:0px}to{--ds-scroll-edge-fade-left:var(--ds-scroll-edge-fade-target-left)}}@keyframes ds-scroll-edge-fade-reveal-right{from{--ds-scroll-edge-fade-right:var(--ds-scroll-edge-fade-target-right)}to{--ds-scroll-edge-fade-right:0px}}.scroll-edge-fade.sc-ds-message-scroller{--ds-scroll-edge-fade-size:var(--dimension-size-600);--ds-scroll-edge-fade-reveal-distance:var(--dimension-size-800);--ds-scroll-edge-fade-target-top:0px;--ds-scroll-edge-fade-target-bottom:0px;--ds-scroll-edge-fade-target-left:0px;--ds-scroll-edge-fade-target-right:0px;--ds-scroll-edge-fade-top:var(--ds-scroll-edge-fade-target-top);--ds-scroll-edge-fade-bottom:var(--ds-scroll-edge-fade-target-bottom);--ds-scroll-edge-fade-left:var(--ds-scroll-edge-fade-target-left);--ds-scroll-edge-fade-right:var(--ds-scroll-edge-fade-target-right);--ds-scroll-edge-fade-block-mask:linear-gradient(     to bottom,     transparent 0,     #000 var(--ds-scroll-edge-fade-top),     #000 calc(100% - var(--ds-scroll-edge-fade-bottom)),     transparent 100%   );--ds-scroll-edge-fade-inline-mask:linear-gradient(     to right,     transparent 0,     #000 var(--ds-scroll-edge-fade-left),     #000 calc(100% - var(--ds-scroll-edge-fade-right)),     transparent 100%   );-webkit-mask-image:var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);mask-image:var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);-webkit-mask-composite:source-in;mask-composite:intersect;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--top.sc-ds-message-scroller{--ds-scroll-edge-fade-target-top:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--bottom.sc-ds-message-scroller{--ds-scroll-edge-fade-target-bottom:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--left.sc-ds-message-scroller{--ds-scroll-edge-fade-target-left:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--right.sc-ds-message-scroller{--ds-scroll-edge-fade-target-right:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--top-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-top:0px}.scroll-edge-fade--bottom-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-bottom:0px}.scroll-edge-fade--left-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-left:0px}.scroll-edge-fade--right-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-right:0px}@supports (animation-timeline: scroll()){.scroll-edge-fade--scroll-aware.sc-ds-message-scroller{animation-name:ds-scroll-edge-fade-reveal-top, ds-scroll-edge-fade-reveal-bottom,       ds-scroll-edge-fade-reveal-left, ds-scroll-edge-fade-reveal-right;animation-duration:1ms;animation-timing-function:ease-in-out;animation-fill-mode:both;animation-timeline:scroll(self y), scroll(self y), scroll(self x), scroll(self x);animation-range:0 var(--ds-scroll-edge-fade-reveal-distance),       calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%,       0 var(--ds-scroll-edge-fade-reveal-distance),       calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%}@media (prefers-reduced-motion: reduce){.scroll-edge-fade--scroll-aware.sc-ds-message-scroller{animation:none}}}.scroll-edge-fade--at-end.sc-ds-message-scroller,.scroll-edge-fade--hidden.sc-ds-message-scroller{-webkit-mask-image:none;mask-image:none}.scroll-edge-fade--block-window.sc-ds-message-scroller{--ds-scroll-edge-fade-window-start:100%;--ds-scroll-edge-fade-window-end:100%;-webkit-mask-image:linear-gradient(     to bottom,     #000 0,     #000 var(--ds-scroll-edge-fade-window-start),     transparent var(--ds-scroll-edge-fade-window-end)   );mask-image:linear-gradient(     to bottom,     #000 0,     #000 var(--ds-scroll-edge-fade-window-start),     transparent var(--ds-scroll-edge-fade-window-end)   );-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}`;const p=()=>`.ds-control-elevation.sc-ds-message-scroller-h,.ds-control-elevation.sc-ds-message-scroller{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-message-scroller-h::after,.ds-control-elevation.sc-ds-message-scroller::after{content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;box-shadow:var(--ds-control-elevation-highlight, none);pointer-events:none}.ds-control-elevation--sm.sc-ds-message-scroller-h,.ds-control-elevation--sm.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-message-scroller-h,.ds-control-elevation--md.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-message-scroller-h,.ds-control-elevation--floating.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-floating);--ds-control-elevation-highlight:var(--effect-highlight-elevated-floating)}.ds-control-elevation--press-scale.sc-ds-message-scroller{--ds-control-press-active-scale:var(--dimension-scale-default);transition:scale var(--effect-motion-short-2)}.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-message-scroller{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-message-scroller,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-message-scroller{scale:none;transition:none}}.sc-ds-message-scroller-h{--ds-message-scroller-anchor-offset:var(--dimension-space-800);display:block;width:100%;height:100%;min-height:0;box-sizing:border-box}.message-scroller.sc-ds-message-scroller{position:relative;width:100%;height:100%;min-height:0}.message-scroller__viewport.sc-ds-message-scroller{width:100%;height:100%;min-height:0;overflow:auto;overflow-anchor:none;overscroll-behavior:contain;box-sizing:border-box}.message-scroller__viewport.sc-ds-message-scroller:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-border-bold-brand);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.message-scroller__content.sc-ds-message-scroller{display:flex;flex-direction:column;gap:var(--dimension-space-300);width:100%;max-width:var(--ds-message-scroller-content-max-width, var(--dimension-panel-width-2xl));min-height:100%;margin-inline:auto;padding-block-start:var(--dimension-space-200);padding-inline:var(--dimension-space-200);padding-block-end:max(     calc(var(--dimension-space-200) + var(--ds-scroll-overlay-block-size, 0px)),     var(--ds-message-scroller-turn-clearance, 0px)   );box-sizing:border-box}.message-scroller__overlay.sc-ds-message-scroller{position:absolute;right:0;bottom:0;left:0;z-index:var(--dimension-z-index-floating)}.message-scroller__overlay-stack.sc-ds-message-scroller{display:grid;width:100%}.message-scroller__interaction.sc-ds-message-scroller,.message-scroller__overlay-content.sc-ds-message-scroller{min-width:0}.message-scroller__control.sc-ds-message-scroller{position:absolute;bottom:calc(var(--ds-scroll-overlay-content-block-size, 0px) + var(--dimension-space-200));left:50%;z-index:var(--dimension-z-index-floating);display:flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-half);background:var(--color-background-transparent);transform:translateX(-50%);-webkit-backdrop-filter:blur(var(--effect-blur-sm));backdrop-filter:blur(var(--effect-blur-sm))}`;const b=24;const k=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsReachStart=t(this,"dsReachStart",7);this.busy=false;this.autoFollow=true;this.defaultPosition="last-anchor";this.messagesLabel="Messages";this.showScrollToLatest=false;this.following=true;this.followReleased=false;this.releasePendingAtLiveEdge=false;this.atStart=false;this.programmatic=false;this.transcriptChildren=[];this.knownTranscriptElements=new Set;this.knownTurnAnchors=new Set;this.turnClearance=0;this.prependReconciliation=0;this.turnPositionGeneration=0;this.defaultPositionGeneration=0;this.transcriptResetPending=false;this.hasLoaded=false;this.handleTranscriptChange=()=>{const e=this.getTranscriptChildren();const s=this.transcriptChildren;const t=m(s,e)||this.transcriptResetPending&&e.length>0;if(t){this.invalidateTranscriptWork();this.resetTranscriptTracking();this.resetTranscriptPositionState();this.transcriptChildren=e;this.trackTranscript(e);this.transcriptResetPending=e.length===0;this.rememberFirstChildTop();this.scrollOverlayController?.sync();if(e.length)this.scheduleDefaultPosition();return}const i=this.knownTranscriptElements.size>0;const r=new Set(this.knownTranscriptElements);const a=[...e].reverse().find(((s,t)=>{if(!s.matches("ds-message[scroll-anchor]")||this.knownTurnAnchors.has(s)){return false}const i=e.length-t-1;return e.slice(i+1).every((e=>!this.knownTranscriptElements.has(e)))}));this.trackTranscript(e);this.pruneTranscriptTracking(e);if(!s.length){this.transcriptChildren=e;if(a&&i){this.scheduleNewTurnPosition(a)}return}const o=e.findIndex((e=>r.has(e)));const l=e.filter((e=>!r.has(e)));const d=e.length>s.length&&s.every(((t,i)=>e[e.length-s.length+i]===t))||!a&&l.length>0&&o>0&&l.every((s=>e.indexOf(s)<o));this.transcriptChildren=e;if(d){if(this.viewport){const e=this.activeTurnAnchor?.isConnected?this.activeTurnAnchor:s[0];const t=this.activeTurnAnchor?.isConnected?this.activeTurnAnchorViewportTop:this.firstChildViewportTop;if(e&&t!==undefined){this.reconcilePrependPosition(e,t);this.schedulePrependReconciliation(e,t,l)}}this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync();return}if(a){this.scheduleNewTurnPosition(a)}};this.handleTranscriptSlotChange=()=>this.handleTranscriptChange();this.handleScroll=()=>{if(!this.viewport)return;this.scrollOverlayController?.sync();this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();if(this.programmatic)return;const e=this.isAtLiveEdge();if(this.releasePendingAtLiveEdge&&e){this.following=false;this.followReleased=true;this.showScrollToLatest=false;return}this.releasePendingAtLiveEdge=false;this.following=e;this.followReleased=!this.following;this.showScrollToLatest=!this.following;const s=this.viewport.scrollTop<=b;if(s&&!this.atStart)this.dsReachStart.emit();this.atStart=s};this.releaseFollow=()=>{this.prependReconciliation+=1;this.releasePendingAtLiveEdge=this.isAtLiveEdge();this.following=false;this.followReleased=true;this.showScrollToLatest=!this.releasePendingAtLiveEdge};this.handleSelectionChange=()=>{const e=document.getSelection();if(e&&!e.isCollapsed&&e.anchorNode&&this.el.contains(e.anchorNode)){this.releaseFollow()}}}componentDidLoad(){this.hasLoaded=true;this.seedTranscriptBaseline();this.connectObservers();this.scheduleDefaultPosition();document.removeEventListener("selectionchange",this.handleSelectionChange);document.addEventListener("selectionchange",this.handleSelectionChange)}connectedCallback(){if(!this.hasLoaded)return;this.seedTranscriptBaseline();this.connectObservers();this.scheduleDefaultPosition();document.removeEventListener("selectionchange",this.handleSelectionChange);document.addEventListener("selectionchange",this.handleSelectionChange)}disconnectedCallback(){this.invalidateTranscriptWork();this.scrollOverlayController?.disconnect();this.scrollOverlayController=undefined;this.mutationObserver?.disconnect();this.mutationObserver=undefined;this.resetTranscriptTracking();this.resetTranscriptPositionState();this.transcriptResetPending=false;document.removeEventListener("selectionchange",this.handleSelectionChange)}async scrollToMessage(e){const s=Array.from(this.el.querySelectorAll("ds-message")).find((s=>s.messageId===e||s.getAttribute("message-id")===e));if(!s)return false;this.releasePendingAtLiveEdge=false;this.following=false;this.followReleased=true;this.showScrollToLatest=true;s.scrollIntoView({block:"start",behavior:this.motionBehavior()});return true}async scrollToStart(){this.releasePendingAtLiveEdge=false;this.scrollTo(0);this.following=false;this.followReleased=true;this.showScrollToLatest=Boolean(this.viewport&&this.viewport.scrollHeight>this.viewport.clientHeight)}async scrollToEnd(){this.releasePendingAtLiveEdge=false;this.following=true;this.followReleased=false;this.showScrollToLatest=false;this.scrollTo(this.viewport?.scrollHeight??0)}motionBehavior(){return matchMedia("(prefers-reduced-motion: reduce)").matches?"auto":"smooth"}scrollTo(e){if(!this.viewport)return;this.programmatic=true;const s=this.motionBehavior();this.viewport.scrollTo({top:e,behavior:s});if(this.programmaticTimer)clearTimeout(this.programmaticTimer);this.programmaticTimer=setTimeout((()=>{this.programmatic=false;this.programmaticTimer=undefined;if(this.following){this.viewport.scrollTop=e;this.showScrollToLatest=false}}),s==="smooth"?600:0)}invalidateTranscriptWork(){this.prependReconciliation+=1;this.turnPositionGeneration+=1;this.defaultPositionGeneration+=1;if(this.programmaticTimer)clearTimeout(this.programmaticTimer);this.programmaticTimer=undefined;this.programmatic=false}clearActiveTurnAnchor(){this.activeTurnAnchor=undefined;this.activeTurnAnchorViewportTop=undefined;this.turnClearance=0;this.el.style.removeProperty("--ds-message-scroller-turn-clearance")}resetTranscriptTracking(){this.transcriptChildren=[];this.knownTranscriptElements.clear();this.knownTurnAnchors.clear();this.firstChildViewportTop=undefined;this.clearActiveTurnAnchor()}resetTranscriptPositionState(){this.following=true;this.followReleased=false;this.releasePendingAtLiveEdge=false;this.atStart=false;this.showScrollToLatest=false}trackTranscript(e){e.forEach((e=>{this.knownTranscriptElements.add(e);if(e.matches("ds-message[scroll-anchor]")){this.knownTurnAnchors.add(e)}}))}seedTranscriptBaseline(){this.resetTranscriptTracking();this.transcriptChildren=this.getTranscriptChildren();this.trackTranscript(this.transcriptChildren);this.transcriptResetPending=false;this.rememberFirstChildTop()}pruneTranscriptTracking(e){u(this.knownTranscriptElements,e);u(this.knownTurnAnchors,e);if(this.activeTurnAnchor&&!e.includes(this.activeTurnAnchor)){this.clearActiveTurnAnchor()}}scheduleDefaultPosition(){const e=++this.defaultPositionGeneration;requestAnimationFrame((()=>{if(e!==this.defaultPositionGeneration||!this.el.isConnected)return;this.applyDefaultPosition()}))}connectObservers(){if(!this.viewport||!this.content||!this.overlay)return;this.scrollOverlayController?.disconnect();this.mutationObserver?.disconnect();this.scrollOverlayController=new o({host:this.el,viewport:this.viewport,content:this.content,overlay:this.overlay,overlayContentSelector:".message-scroller__overlay-stack",onGeometryChange:()=>this.handleContentGrowth()});this.scrollOverlayController.connect();this.mutationObserver=new MutationObserver((()=>{this.handleTranscriptChange();this.handleContentGrowth()}));this.mutationObserver.observe(this.el,{childList:true,subtree:true,characterData:true})}handleContentGrowth(){if(!this.viewport)return;this.syncTurnClearance();const e=this.viewport.scrollHeight;if(this.autoFollow&&this.following&&!this.followReleased){this.viewport.scrollTop=e}if(this.releasePendingAtLiveEdge&&!this.isAtLiveEdge()){this.releasePendingAtLiveEdge=false}this.showScrollToLatest=!this.following&&!this.isAtLiveEdge();this.scrollOverlayController?.sync()}rememberFirstChildTop(){if(!this.viewport)return;const e=this.getTranscriptChildren()[0];this.firstChildViewportTop=e?e.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top:undefined}getTranscriptChildren(){const e=this.transcriptSlot?.assignedElements()??[];const t=e.filter((e=>e instanceof s&&(e.matches("ds-message")||e.matches("ds-agent-response"))));const i=Array.from(this.el.querySelectorAll("ds-message, ds-agent-response")).filter((e=>{if(e.closest(".message-scroller__interaction, .message-scroller__overlay-content")){return false}if(e.matches("ds-agent-response"))return true;return!e.closest("ds-agent-response")}));return i.length>t.length?i:t}reconcilePrependPosition(e,s){if(!this.viewport||!e.isConnected)return;const t=e.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top;this.viewport.scrollTop+=t-s}schedulePrependReconciliation(e,s,t){const i=++this.prependReconciliation;const r=t.flatMap((e=>[e,...Array.from(e.querySelectorAll("*"))])).map((e=>{const s=e.componentOnReady;return s?s.call(e).catch((()=>undefined)):null})).filter((e=>Boolean(e)));void Promise.all(r).then((()=>{requestAnimationFrame((()=>{if(i!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);requestAnimationFrame((()=>{if(i!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync()}))}))}))}scheduleNewTurnPosition(e){const s=++this.turnPositionGeneration;requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration||!e.isConnected||!this.viewport){return}this.positionNewTurn(e,s)}))}positionNewTurn(e,s){if(s!==this.turnPositionGeneration||!this.viewport||!e.isConnected)return;this.activeTurnAnchor=e;this.syncTurnClearance();requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration)return;this.finishPositionNewTurn(e,s)}))}finishPositionNewTurn(e,s){if(s!==this.turnPositionGeneration||!this.viewport||!e.isConnected){return}const t=this.viewport.getBoundingClientRect();const i=e.getBoundingClientRect().top-t.top+this.viewport.scrollTop;const r=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const a=l(r,"var(--dimension-space-800)");const o=Math.max(this.viewport.scrollHeight-this.viewport.clientHeight,0);const d=Math.min(Math.max(i-a,0),o);this.following=o-d<=b;this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.programmatic=true;this.viewport.scrollTop=d;requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration)return;this.programmatic=false;this.following=this.isAtLiveEdge();this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop()}));this.scrollOverlayController?.sync()}rememberActiveTurnAnchorTop(){if(!this.viewport||!this.activeTurnAnchor?.isConnected)return;this.activeTurnAnchorViewportTop=this.activeTurnAnchor.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top}syncTurnClearance(){if(!this.viewport||!this.activeTurnAnchor?.isConnected)return;const e=this.getTranscriptChildren();const s=e[e.length-1];if(!s)return;const t=this.activeTurnAnchor.getBoundingClientRect();const i=s.getBoundingClientRect();const r=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const a=l(r,"var(--dimension-space-800)");const o=Math.max(i.bottom-t.top,0);const d=Math.max(Math.ceil(this.viewport.clientHeight-a-o),0);if(d===this.turnClearance)return;this.turnClearance=d;this.el.style.setProperty("--ds-message-scroller-turn-clearance",`${d}px`)}applyDefaultPosition(){if(!this.viewport)return;this.releasePendingAtLiveEdge=false;if(this.defaultPosition==="start"){this.viewport.scrollTop=0;this.following=false;this.followReleased=true;this.showScrollToLatest=this.viewport.scrollHeight>this.viewport.clientHeight;this.scrollOverlayController?.sync();return}if(this.defaultPosition==="last-anchor"){const e=this.el.querySelectorAll("ds-message[scroll-anchor]");const s=e.item(e.length-1);if(s){s.scrollIntoView({block:"start"});this.following=this.isAtLiveEdge();this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.scrollOverlayController?.sync();return}}this.viewport.scrollTop=this.viewport.scrollHeight;this.following=true;this.followReleased=false;this.showScrollToLatest=false;this.scrollOverlayController?.sync()}isAtLiveEdge(){if(!this.viewport)return true;return this.viewport.scrollHeight-this.viewport.clientHeight-this.viewport.scrollTop<=b}render(){return i(r,{key:"fefed5f3e0f9f3c9f01fe5951a7bfdb7d6c868d8"},i("div",{key:"d77ba3b732e5e7e0fa0f37130dd5f54531f7abbc",class:"message-scroller"},i("div",{key:"0ee8693ed189abbf5743adb56f8b5d001d6d5715",class:"message-scroller__viewport",ref:e=>{this.viewport=e},role:"region","aria-label":this.messagesLabel,tabIndex:0,onScroll:this.handleScroll,onPointerDown:e=>{if(e.pointerType==="touch")this.releaseFollow()},onWheel:this.releaseFollow,onKeyDown:e=>{if(["ArrowUp","ArrowDown","PageUp","PageDown","Home","End"," "].includes(e.key)){this.releaseFollow()}}},i("div",{key:"8acfdc5746f33aeea75c333c9e22fb30d0f5eed0",class:"message-scroller__content scroll-edge-fade--block-window",ref:e=>{this.content=e},role:"log","aria-live":"polite","aria-relevant":"additions","aria-busy":this.busy?"true":undefined},i("slot",{key:"095f2078f4107f4c58e2ddcd2633f94cf742424c",ref:e=>{this.transcriptSlot=e},onSlotchange:this.handleTranscriptSlotChange}))),i("div",{key:"65de06cb597843e7c62215c2e016ea8204ae4a43",class:"message-scroller__overlay",ref:e=>{this.overlay=e}},i("div",{key:"102f60e479e52dd9784f39f3ea691f546d2e08da",class:"message-scroller__overlay-stack"},i("div",{key:"ea07c48fc15d8935c71f60ffb9b7e5c72dec1977",class:"message-scroller__interaction"},i("slot",{key:"120f5c535c7d8251a3d98a6a7e74b2a4d327b045",name:"interaction"})),i("div",{key:"7f6a3d7d6654b85b16310f245b635d8ff9eee6ad",class:"message-scroller__overlay-content"},i("slot",{key:"84da7d3465c79f9ed3250f358c60799929795ed3",name:"overlay"})))),this.showScrollToLatest?i("div",{class:"message-scroller__control ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale"},i("ds-tooltip",{label:"Scroll to latest message",side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:"ChevronDown",size:"md",rounded:true,hasBorder:false,"aria-label":"Scroll to latest message",onDsClick:()=>void this.scrollToEnd()}))):null))}get el(){return this}static get style(){return v()+p()}},[262,"ds-message-scroller",{busy:[4],autoFollow:[4,"auto-follow"],defaultPosition:[1,"default-position"],messagesLabel:[1,"messages-label"],showScrollToLatest:[32],scrollToMessage:[64],scrollToStart:[64],scrollToEnd:[64]}]);function w(){if(typeof customElements==="undefined"){return}const e=["ds-message-scroller","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-message-scroller":if(!customElements.get(a(e))){customElements.define(a(e),k)}break;case"ds-badge":if(!customElements.get(a(e))){d()}break;case"ds-button-unfilled":if(!customElements.get(a(e))){n()}break;case"ds-icon":if(!customElements.get(a(e))){c()}break;case"ds-loader":if(!customElements.get(a(e))){h()}break;case"ds-text":if(!customElements.get(a(e))){f()}break;case"ds-tooltip":if(!customElements.get(a(e))){g()}break}}))}w();const y=k;const x=w;export{y as DsMessageScroller,x as defineCustomElement};
+import{p as e,H as s,c as t,h as i,a as r,t as a}from"./index.js";import{S as o}from"./p-Ck1hgD6g.js";import{r as l}from"./p-CochmPyg.js";import{d as n}from"./p-CwdRaJER.js";import{d}from"./p-D6FRqNhN.js";import{d as c}from"./p-DjkUFlDW.js";import{d as h}from"./p-0XTyQNRG.js";import{d as f}from"./p-D8OWhnID.js";import{d as g}from"./p-DIQiHX0q.js";function m(e,s){if(!e.length)return false;if(!s.length)return true;const t=new Set(e);return!s.some((e=>t.has(e)))}function u(e,s){const t=new Set(s);for(const s of e){if(!t.has(s))e.delete(s)}}const v=()=>`@property --ds-scroll-edge-fade-top{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-bottom{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-left{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-right{syntax:'<length-percentage>';inherits:false;initial-value:0px}@keyframes ds-scroll-edge-fade-reveal-top{from{--ds-scroll-edge-fade-top:0px}to{--ds-scroll-edge-fade-top:var(--ds-scroll-edge-fade-target-top)}}@keyframes ds-scroll-edge-fade-reveal-bottom{from{--ds-scroll-edge-fade-bottom:var(--ds-scroll-edge-fade-target-bottom)}to{--ds-scroll-edge-fade-bottom:0px}}@keyframes ds-scroll-edge-fade-reveal-left{from{--ds-scroll-edge-fade-left:0px}to{--ds-scroll-edge-fade-left:var(--ds-scroll-edge-fade-target-left)}}@keyframes ds-scroll-edge-fade-reveal-right{from{--ds-scroll-edge-fade-right:var(--ds-scroll-edge-fade-target-right)}to{--ds-scroll-edge-fade-right:0px}}.scroll-edge-fade.sc-ds-message-scroller{--ds-scroll-edge-fade-size:var(--dimension-size-600);--ds-scroll-edge-fade-reveal-distance:var(--dimension-size-800);--ds-scroll-edge-fade-target-top:0px;--ds-scroll-edge-fade-target-bottom:0px;--ds-scroll-edge-fade-target-left:0px;--ds-scroll-edge-fade-target-right:0px;--ds-scroll-edge-fade-top:var(--ds-scroll-edge-fade-target-top);--ds-scroll-edge-fade-bottom:var(--ds-scroll-edge-fade-target-bottom);--ds-scroll-edge-fade-left:var(--ds-scroll-edge-fade-target-left);--ds-scroll-edge-fade-right:var(--ds-scroll-edge-fade-target-right);--ds-scroll-edge-fade-block-mask:linear-gradient(     to bottom,     transparent 0,     #000 var(--ds-scroll-edge-fade-top),     #000 calc(100% - var(--ds-scroll-edge-fade-bottom)),     transparent 100%   );--ds-scroll-edge-fade-inline-mask:linear-gradient(     to right,     transparent 0,     #000 var(--ds-scroll-edge-fade-left),     #000 calc(100% - var(--ds-scroll-edge-fade-right)),     transparent 100%   );-webkit-mask-image:var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);mask-image:var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);-webkit-mask-composite:source-in;mask-composite:intersect;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--top.sc-ds-message-scroller{--ds-scroll-edge-fade-target-top:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--bottom.sc-ds-message-scroller{--ds-scroll-edge-fade-target-bottom:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--left.sc-ds-message-scroller{--ds-scroll-edge-fade-target-left:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--right.sc-ds-message-scroller{--ds-scroll-edge-fade-target-right:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--top-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-top:0px}.scroll-edge-fade--bottom-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-bottom:0px}.scroll-edge-fade--left-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-left:0px}.scroll-edge-fade--right-at-edge.sc-ds-message-scroller{--ds-scroll-edge-fade-target-right:0px}@supports (animation-timeline: scroll()){.scroll-edge-fade--scroll-aware.sc-ds-message-scroller{animation-name:ds-scroll-edge-fade-reveal-top, ds-scroll-edge-fade-reveal-bottom,       ds-scroll-edge-fade-reveal-left, ds-scroll-edge-fade-reveal-right;animation-duration:1ms;animation-timing-function:ease-in-out;animation-fill-mode:both;animation-timeline:scroll(self y), scroll(self y), scroll(self x), scroll(self x);animation-range:0 var(--ds-scroll-edge-fade-reveal-distance),       calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%,       0 var(--ds-scroll-edge-fade-reveal-distance),       calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%}@media (prefers-reduced-motion: reduce){.scroll-edge-fade--scroll-aware.sc-ds-message-scroller{animation:none}}}.scroll-edge-fade--at-end.sc-ds-message-scroller,.scroll-edge-fade--hidden.sc-ds-message-scroller{-webkit-mask-image:none;mask-image:none}.scroll-edge-fade--block-window.sc-ds-message-scroller{--ds-scroll-edge-fade-window-start:100%;--ds-scroll-edge-fade-window-end:100%;-webkit-mask-image:linear-gradient(     to bottom,     #000 0,     #000 var(--ds-scroll-edge-fade-window-start),     transparent var(--ds-scroll-edge-fade-window-end)   );mask-image:linear-gradient(     to bottom,     #000 0,     #000 var(--ds-scroll-edge-fade-window-start),     transparent var(--ds-scroll-edge-fade-window-end)   );-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}`;const p=()=>`.ds-control-elevation.sc-ds-message-scroller-h,.ds-control-elevation.sc-ds-message-scroller{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-message-scroller-h::after,.ds-control-elevation.sc-ds-message-scroller::after{content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;box-shadow:var(--ds-control-elevation-highlight, none);pointer-events:none}.ds-control-elevation--sm.sc-ds-message-scroller-h,.ds-control-elevation--sm.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-message-scroller-h,.ds-control-elevation--md.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-message-scroller-h,.ds-control-elevation--floating.sc-ds-message-scroller{--ds-control-elevation-shadow:var(--effect-shadow-elevated-floating);--ds-control-elevation-highlight:var(--effect-highlight-elevated-floating)}.ds-control-elevation--press-scale.sc-ds-message-scroller{--ds-control-press-active-scale:var(--dimension-scale-default);transition:scale var(--effect-motion-short-2)}.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-message-scroller{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-message-scroller,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-message-scroller{scale:none;transition:none}}.sc-ds-message-scroller-h{--ds-message-scroller-anchor-offset:var(--dimension-space-800);display:block;width:100%;height:100%;min-height:0;box-sizing:border-box}.message-scroller.sc-ds-message-scroller{position:relative;width:100%;height:100%;min-height:0}.message-scroller__viewport.sc-ds-message-scroller{width:100%;height:100%;min-height:0;overflow:auto;overflow-anchor:none;overscroll-behavior:contain;box-sizing:border-box}.message-scroller__viewport.sc-ds-message-scroller:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-border-bold-brand);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.message-scroller__content.sc-ds-message-scroller{display:flex;flex-direction:column;gap:var(--dimension-space-300);width:100%;max-width:var(--ds-message-scroller-content-max-width, var(--dimension-panel-width-2xl));min-height:100%;margin-inline:auto;padding-block-start:var(--dimension-space-200);padding-inline:var(--dimension-space-200);padding-block-end:max(     calc(var(--dimension-space-200) + var(--ds-scroll-overlay-block-size, 0px)),     var(--ds-message-scroller-turn-clearance, 0px)   );box-sizing:border-box}.message-scroller__overlay.sc-ds-message-scroller{position:absolute;right:0;bottom:0;left:0;z-index:var(--dimension-z-index-floating)}.message-scroller__overlay-stack.sc-ds-message-scroller{display:grid;width:100%}.message-scroller__interaction.sc-ds-message-scroller,.message-scroller__overlay-content.sc-ds-message-scroller{min-width:0}.message-scroller__control.sc-ds-message-scroller{position:absolute;bottom:calc(var(--ds-scroll-overlay-content-block-size, 0px) + var(--dimension-space-200));left:50%;z-index:var(--dimension-z-index-floating);display:flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-half);background:var(--color-background-transparent);transform:translateX(-50%);-webkit-backdrop-filter:blur(var(--effect-blur-sm));backdrop-filter:blur(var(--effect-blur-sm))}`;const b=24;const k=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsReachStart=t(this,"dsReachStart",7);this.busy=false;this.autoFollow=true;this.defaultPosition="last-anchor";this.messagesLabel="Messages";this.showScrollToLatest=false;this.following=true;this.followReleased=false;this.releasePendingAtLiveEdge=false;this.atStart=false;this.programmatic=false;this.transcriptChildren=[];this.knownTranscriptElements=new Set;this.knownTurnAnchors=new Set;this.turnClearance=0;this.prependReconciliation=0;this.turnPositionGeneration=0;this.defaultPositionGeneration=0;this.transcriptResetPending=false;this.hasLoaded=false;this.handleTranscriptChange=()=>{const e=this.getTranscriptChildren();const s=this.transcriptChildren;const t=m(s,e)||this.transcriptResetPending&&e.length>0;if(t){this.invalidateTranscriptWork();this.resetTranscriptTracking();this.resetTranscriptPositionState();this.transcriptChildren=e;this.trackTranscript(e);this.transcriptResetPending=e.length===0;this.rememberFirstChildTop();this.scrollOverlayController?.sync();if(e.length)this.scheduleDefaultPosition();return}const i=this.knownTranscriptElements.size>0;const r=new Set(this.knownTranscriptElements);const a=[...e].reverse().find(((s,t)=>{if(!s.matches("ds-message[scroll-anchor]")||this.knownTurnAnchors.has(s)){return false}const i=e.length-t-1;return e.slice(i+1).every((e=>!this.knownTranscriptElements.has(e)))}));this.trackTranscript(e);this.pruneTranscriptTracking(e);if(!s.length){this.transcriptChildren=e;if(a&&i){this.scheduleNewTurnPosition(a)}return}const o=e.findIndex((e=>r.has(e)));const l=e.filter((e=>!r.has(e)));const n=e.length>s.length&&s.every(((t,i)=>e[e.length-s.length+i]===t))||!a&&l.length>0&&o>0&&l.every((s=>e.indexOf(s)<o));this.transcriptChildren=e;if(n){if(this.viewport){const e=this.activeTurnAnchor?.isConnected?this.activeTurnAnchor:s[0];const t=this.activeTurnAnchor?.isConnected?this.activeTurnAnchorViewportTop:this.firstChildViewportTop;if(e&&t!==undefined){this.reconcilePrependPosition(e,t);this.schedulePrependReconciliation(e,t,l)}}this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync();return}if(a){this.scheduleNewTurnPosition(a)}};this.handleTranscriptSlotChange=()=>this.handleTranscriptChange();this.handleScroll=()=>{if(!this.viewport)return;this.scrollOverlayController?.sync();this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();if(this.programmatic)return;const e=this.isAtLiveEdge();if(this.releasePendingAtLiveEdge&&e){this.following=false;this.followReleased=true;this.showScrollToLatest=false;return}this.releasePendingAtLiveEdge=false;this.following=e;this.followReleased=!this.following;this.showScrollToLatest=!this.following;const s=this.viewport.scrollTop<=b;if(s&&!this.atStart)this.dsReachStart.emit();this.atStart=s};this.releaseFollow=()=>{this.prependReconciliation+=1;this.releasePendingAtLiveEdge=this.isAtLiveEdge();this.following=false;this.followReleased=true;this.showScrollToLatest=!this.releasePendingAtLiveEdge};this.handleSelectionChange=()=>{const e=document.getSelection();if(e&&!e.isCollapsed&&e.anchorNode&&this.el.contains(e.anchorNode)){this.releaseFollow()}}}componentDidLoad(){this.hasLoaded=true;this.seedTranscriptBaseline();this.connectObservers();this.scheduleDefaultPosition();document.removeEventListener("selectionchange",this.handleSelectionChange);document.addEventListener("selectionchange",this.handleSelectionChange)}connectedCallback(){if(!this.hasLoaded)return;this.seedTranscriptBaseline();this.connectObservers();this.scheduleDefaultPosition();document.removeEventListener("selectionchange",this.handleSelectionChange);document.addEventListener("selectionchange",this.handleSelectionChange)}disconnectedCallback(){this.invalidateTranscriptWork();this.scrollOverlayController?.disconnect();this.scrollOverlayController=undefined;this.mutationObserver?.disconnect();this.mutationObserver=undefined;this.resetTranscriptTracking();this.resetTranscriptPositionState();this.transcriptResetPending=false;document.removeEventListener("selectionchange",this.handleSelectionChange)}async scrollToMessage(e){const s=Array.from(this.el.querySelectorAll("ds-message")).find((s=>s.messageId===e||s.getAttribute("message-id")===e));if(!s)return false;this.releasePendingAtLiveEdge=false;this.following=false;this.followReleased=true;this.showScrollToLatest=true;s.scrollIntoView({block:"start",behavior:this.motionBehavior()});return true}async scrollToStart(){this.releasePendingAtLiveEdge=false;this.scrollTo(0);this.following=false;this.followReleased=true;this.showScrollToLatest=Boolean(this.viewport&&this.viewport.scrollHeight>this.viewport.clientHeight)}async scrollToEnd(){this.releasePendingAtLiveEdge=false;this.following=true;this.followReleased=false;this.showScrollToLatest=false;this.scrollTo(this.viewport?.scrollHeight??0)}motionBehavior(){return matchMedia("(prefers-reduced-motion: reduce)").matches?"auto":"smooth"}scrollTo(e){if(!this.viewport)return;this.programmatic=true;const s=this.motionBehavior();this.viewport.scrollTo({top:e,behavior:s});if(this.programmaticTimer)clearTimeout(this.programmaticTimer);this.programmaticTimer=setTimeout((()=>{this.programmatic=false;this.programmaticTimer=undefined;if(this.following){this.viewport.scrollTop=e;this.showScrollToLatest=false}}),s==="smooth"?600:0)}invalidateTranscriptWork(){this.prependReconciliation+=1;this.turnPositionGeneration+=1;this.defaultPositionGeneration+=1;if(this.programmaticTimer)clearTimeout(this.programmaticTimer);this.programmaticTimer=undefined;this.programmatic=false}clearActiveTurnAnchor(){this.activeTurnAnchor=undefined;this.activeTurnAnchorViewportTop=undefined;this.turnClearance=0;this.el.style.removeProperty("--ds-message-scroller-turn-clearance")}resetTranscriptTracking(){this.transcriptChildren=[];this.knownTranscriptElements.clear();this.knownTurnAnchors.clear();this.firstChildViewportTop=undefined;this.clearActiveTurnAnchor()}resetTranscriptPositionState(){this.following=true;this.followReleased=false;this.releasePendingAtLiveEdge=false;this.atStart=false;this.showScrollToLatest=false}trackTranscript(e){e.forEach((e=>{this.knownTranscriptElements.add(e);if(e.matches("ds-message[scroll-anchor]")){this.knownTurnAnchors.add(e)}}))}seedTranscriptBaseline(){this.resetTranscriptTracking();this.transcriptChildren=this.getTranscriptChildren();this.trackTranscript(this.transcriptChildren);this.transcriptResetPending=false;this.rememberFirstChildTop()}pruneTranscriptTracking(e){u(this.knownTranscriptElements,e);u(this.knownTurnAnchors,e);if(this.activeTurnAnchor&&!e.includes(this.activeTurnAnchor)){this.clearActiveTurnAnchor()}}scheduleDefaultPosition(){const e=++this.defaultPositionGeneration;requestAnimationFrame((()=>{if(e!==this.defaultPositionGeneration||!this.el.isConnected)return;this.applyDefaultPosition()}))}connectObservers(){if(!this.viewport||!this.content||!this.overlay)return;this.scrollOverlayController?.disconnect();this.mutationObserver?.disconnect();this.scrollOverlayController=new o({host:this.el,viewport:this.viewport,content:this.content,overlay:this.overlay,overlayContentSelector:".message-scroller__overlay-stack",onGeometryChange:()=>this.handleContentGrowth()});this.scrollOverlayController.connect();this.mutationObserver=new MutationObserver((()=>{this.handleTranscriptChange();this.handleContentGrowth()}));this.mutationObserver.observe(this.el,{childList:true,subtree:true,characterData:true})}handleContentGrowth(){if(!this.viewport)return;this.syncTurnClearance();const e=this.viewport.scrollHeight;if(this.autoFollow&&this.following&&!this.followReleased){this.viewport.scrollTop=e}if(this.releasePendingAtLiveEdge&&!this.isAtLiveEdge()){this.releasePendingAtLiveEdge=false}this.showScrollToLatest=!this.following&&!this.isAtLiveEdge();this.scrollOverlayController?.sync()}rememberFirstChildTop(){if(!this.viewport)return;const e=this.getTranscriptChildren()[0];this.firstChildViewportTop=e?e.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top:undefined}getTranscriptChildren(){const e=this.transcriptSlot?.assignedElements()??[];const t=e.filter((e=>e instanceof s&&(e.matches("ds-message")||e.matches("ds-agent-response"))));const i=Array.from(this.el.querySelectorAll("ds-message, ds-agent-response")).filter((e=>{if(e.closest(".message-scroller__interaction, .message-scroller__overlay-content")){return false}if(e.matches("ds-agent-response"))return true;return!e.closest("ds-agent-response")}));return i.length>t.length?i:t}reconcilePrependPosition(e,s){if(!this.viewport||!e.isConnected)return;const t=e.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top;this.viewport.scrollTop+=t-s}schedulePrependReconciliation(e,s,t){const i=++this.prependReconciliation;const r=t.flatMap((e=>[e,...Array.from(e.querySelectorAll("*"))])).map((e=>{const s=e.componentOnReady;return s?s.call(e).catch((()=>undefined)):null})).filter((e=>Boolean(e)));void Promise.all(r).then((()=>{requestAnimationFrame((()=>{if(i!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);requestAnimationFrame((()=>{if(i!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync()}))}))}))}scheduleNewTurnPosition(e){const s=++this.turnPositionGeneration;requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration||!e.isConnected||!this.viewport){return}this.positionNewTurn(e,s)}))}positionNewTurn(e,s){if(s!==this.turnPositionGeneration||!this.viewport||!e.isConnected)return;this.activeTurnAnchor=e;this.syncTurnClearance();requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration)return;this.finishPositionNewTurn(e,s)}))}finishPositionNewTurn(e,s){if(s!==this.turnPositionGeneration||!this.viewport||!e.isConnected){return}const t=this.viewport.getBoundingClientRect();const i=e.getBoundingClientRect().top-t.top+this.viewport.scrollTop;const r=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const a=l(r,"var(--dimension-space-800)");const o=Math.max(this.viewport.scrollHeight-this.viewport.clientHeight,0);const n=Math.min(Math.max(i-a,0),o);this.following=o-n<=b;this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.programmatic=true;this.viewport.scrollTop=n;requestAnimationFrame((()=>{if(s!==this.turnPositionGeneration)return;this.programmatic=false;this.following=this.isAtLiveEdge();this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop()}));this.scrollOverlayController?.sync()}rememberActiveTurnAnchorTop(){if(!this.viewport||!this.activeTurnAnchor?.isConnected)return;this.activeTurnAnchorViewportTop=this.activeTurnAnchor.getBoundingClientRect().top-this.viewport.getBoundingClientRect().top}syncTurnClearance(){if(!this.viewport||!this.activeTurnAnchor?.isConnected)return;const e=this.getTranscriptChildren();const s=e[e.length-1];if(!s)return;const t=this.activeTurnAnchor.getBoundingClientRect();const i=s.getBoundingClientRect();const r=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const a=l(r,"var(--dimension-space-800)");const o=Math.max(i.bottom-t.top,0);const n=Math.max(Math.ceil(this.viewport.clientHeight-a-o),0);if(n===this.turnClearance)return;this.turnClearance=n;this.el.style.setProperty("--ds-message-scroller-turn-clearance",`${n}px`)}applyDefaultPosition(){if(!this.viewport)return;this.releasePendingAtLiveEdge=false;if(this.defaultPosition==="start"){this.viewport.scrollTop=0;this.following=false;this.followReleased=true;this.showScrollToLatest=this.viewport.scrollHeight>this.viewport.clientHeight;this.scrollOverlayController?.sync();return}if(this.defaultPosition==="last-anchor"){const e=this.el.querySelectorAll("ds-message[scroll-anchor]");const s=e.item(e.length-1);if(s){s.scrollIntoView({block:"start"});this.following=this.isAtLiveEdge();this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.scrollOverlayController?.sync();return}}this.viewport.scrollTop=this.viewport.scrollHeight;this.following=true;this.followReleased=false;this.showScrollToLatest=false;this.scrollOverlayController?.sync()}isAtLiveEdge(){if(!this.viewport)return true;return this.viewport.scrollHeight-this.viewport.clientHeight-this.viewport.scrollTop<=b}render(){return i(r,{key:"8be3e264353694549447c0cb1c6a2f4eac09464b"},i("div",{key:"3d10fa5311a7151b6e25b5c10a0ff04179d265aa",class:"message-scroller"},i("div",{key:"4840e785d6a21f4758b08250a75b70e1149008b3",class:"message-scroller__viewport",ref:e=>{this.viewport=e},role:"region","aria-label":this.messagesLabel,tabIndex:0,onScroll:this.handleScroll,onPointerDown:e=>{if(e.pointerType==="touch")this.releaseFollow()},onWheel:this.releaseFollow,onKeyDown:e=>{if(["ArrowUp","ArrowDown","PageUp","PageDown","Home","End"," "].includes(e.key)){this.releaseFollow()}}},i("div",{key:"373ac850cf6701fb1992ae972db952396c32046f",class:"message-scroller__content scroll-edge-fade--block-window",ref:e=>{this.content=e},role:"log","aria-live":"polite","aria-relevant":"additions","aria-busy":this.busy?"true":undefined},i("slot",{key:"67fd7986485c8eb8cf89f8b9c95c6c770e53029e",ref:e=>{this.transcriptSlot=e},onSlotchange:this.handleTranscriptSlotChange}))),i("div",{key:"932419600931ed6d4b0102e8cc2370326aee4963",class:"message-scroller__overlay",ref:e=>{this.overlay=e}},i("div",{key:"95b4d83ef84fb773b337116dacc914b9882fe199",class:"message-scroller__overlay-stack"},i("div",{key:"11d117ff87de44408bae938bad2595002cf4cdb4",class:"message-scroller__interaction"},i("slot",{key:"5fe2fab2a3248061e2c73513ed1fa7ad21012ea1",name:"interaction"})),i("div",{key:"655c4b085faab4cfbe35972448c0b6452c64d10f",class:"message-scroller__overlay-content"},i("slot",{key:"806efef607bf7fae477f7311031c1df97a112d74",name:"overlay"})))),this.showScrollToLatest?i("div",{class:"message-scroller__control ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale"},i("ds-tooltip",{label:"Scroll to latest message",side:"top",size:"sm"},i("ds-button-unfilled",{variant:"icon",icon:"ChevronDown",size:"md",rounded:true,hasBorder:false,"aria-label":"Scroll to latest message",onDsClick:()=>void this.scrollToEnd()}))):null))}get el(){return this}static get style(){return v()+p()}},[262,"ds-message-scroller",{busy:[4],autoFollow:[4,"auto-follow"],defaultPosition:[1,"default-position"],messagesLabel:[1,"messages-label"],showScrollToLatest:[32],scrollToMessage:[64],scrollToStart:[64],scrollToEnd:[64]}]);function w(){if(typeof customElements==="undefined"){return}const e=["ds-message-scroller","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-message-scroller":if(!customElements.get(a(e))){customElements.define(a(e),k)}break;case"ds-badge":if(!customElements.get(a(e))){n()}break;case"ds-button-unfilled":if(!customElements.get(a(e))){d()}break;case"ds-icon":if(!customElements.get(a(e))){c()}break;case"ds-loader":if(!customElements.get(a(e))){h()}break;case"ds-text":if(!customElements.get(a(e))){f()}break;case"ds-tooltip":if(!customElements.get(a(e))){g()}break}}))}w();const y=k;const x=w;export{y as DsMessageScroller,x as defineCustomElement};
 //# sourceMappingURL=ds-message-scroller.js.map

package/dist/components/ds-message.js

@@ -1,2 +1,2 @@
-import{M as o,d as s}from"./p-BX506yEW.js";const t=o;const p=s;export{t as DsMessage,p as defineCustomElement};
+import{M as o,d as s}from"./p-DebLYW7A.js";const t=o;const p=s;export{t as DsMessage,p as defineCustomElement};
 //# sourceMappingURL=ds-message.js.map

package/dist/components/ds-mobile-bar-nav.js

@@ -1,2 +1,2 @@
-import{M as o,d as s}from"./p-YrnU2fM7.js";const r=o;const t=s;export{r as DsMobileBarNav,t as defineCustomElement};
+import{M as o,d as s}from"./p-7TVdPhGR.js";const t=o;const p=s;export{t as DsMobileBarNav,p as defineCustomElement};
 //# sourceMappingURL=ds-mobile-bar-nav.js.map

package/dist/components/ds-mobile-header.js

@@ -1,2 +1,2 @@
-import{M as o,d as s}from"./p-C1gaWjOm.js";const t=o;const a=s;export{t as DsMobileHeader,a as defineCustomElement};
+import{M as o,d as s}from"./p-DSZPO06T.js";const t=o;const p=s;export{t as DsMobileHeader,p as defineCustomElement};
 //# sourceMappingURL=ds-mobile-header.js.map

package/dist/components/ds-mobile-section-switcher.js

@@ -1,2 +1,2 @@
-import{M as o,d as s}from"./p-CNZ6-kWd.js";const t=o;const p=s;export{t as DsMobileSectionSwitcher,p as defineCustomElement};
+import{M as o,d as s}from"./p-CPamUzaj.js";const a=o;const t=s;export{a as DsMobileSectionSwitcher,t as defineCustomElement};
 //# sourceMappingURL=ds-mobile-section-switcher.js.map

package/dist/components/ds-mobile-sheet-nav.js

@@ -1,2 +1,2 @@
-import{M as o,d as s}from"./p-CRk0TjQv.js";const t=o;const p=s;export{t as DsMobileSheetNav,p as defineCustomElement};
+import{M as o,d as s}from"./p-C4huuwed.js";const t=o;const p=s;export{t as DsMobileSheetNav,p as defineCustomElement};
 //# sourceMappingURL=ds-mobile-sheet-nav.js.map

package/dist/components/ds-modal.js

@@ -1,2 +1,2 @@
-import{M as o,d as s}from"./p-BLSSaVWm.js";const t=o;const a=s;export{t as DsModal,a as defineCustomElement};
+import{M as o,d as p}from"./p-pp1IQN4Z.js";const s=o;const t=p;export{s as DsModal,t as defineCustomElement};
 //# sourceMappingURL=ds-modal.js.map

package/dist/components/ds-pagination.js

@@ -1,2 +1,2 @@
-import{P as o,d as s}from"./p-Dlp1HqgS.js";const p=o;const t=s;export{p as DsPagination,t as defineCustomElement};
+import{P as o,d as s}from"./p-DXk1eml1.js";const t=o;const m=s;export{t as DsPagination,m as defineCustomElement};
 //# sourceMappingURL=ds-pagination.js.map

package/dist/components/ds-panel-nav.js

@@ -1,2 +1,2 @@
-import{P as o,d as r}from"./p-Br5e83Fr.js";const s=o;const t=r;export{s as DsPanelNav,t as defineCustomElement};
+import{P as o,d as s}from"./p-BhjqYTiY.js";const t=o;const p=s;export{t as DsPanelNav,p as defineCustomElement};
 //# sourceMappingURL=ds-panel-nav.js.map

package/dist/components/ds-panel-sub-nav.js

@@ -1,2 +1,2 @@
-import{p as n,H as s,c as e,h as o,a as i,t as a}from"./index.js";import{d as r}from"./p-ZwRLjD5M.js";const t=()=>`.sc-ds-panel-sub-nav-h,.sc-ds-panel-sub-nav:where(.ds-table),.sc-ds-panel-sub-nav:where(.tooltip-popup),.sc-ds-panel-sub-nav:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.ds-control--lg.sc-ds-panel-sub-nav,.ds-control--lg.sc-ds-panel-sub-nav-h,.ds-control--md.sc-ds-panel-sub-nav-h,.ds-control--md.sc-ds-panel-sub-nav,.ds-control--sm.sc-ds-panel-sub-nav-h,.ds-control--sm.sc-ds-panel-sub-nav,.ds-control--xs.sc-ds-panel-sub-nav-h,.ds-control--xs.sc-ds-panel-sub-nav{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-panel-sub-nav-h,.ds-control--lg.sc-ds-panel-sub-nav{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-panel-sub-nav-h,.ds-control--md.sc-ds-panel-sub-nav{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-panel-sub-nav-h,.ds-control--sm.sc-ds-panel-sub-nav{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-panel-sub-nav-h,.ds-control--xs.sc-ds-panel-sub-nav{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}@media (forced-colors: active){.sc-ds-panel-sub-nav:root,.sc-ds-panel-sub-nav-h,.ds-forced-colors-scope.sc-ds-panel-sub-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-panel-sub-nav-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-panel-sub-nav-h,.ds-focus-ring.sc-ds-panel-sub-nav,.ds-focus-ring-inset.sc-ds-panel-sub-nav-h,.ds-focus-ring-inset.sc-ds-panel-sub-nav{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-panel-sub-nav-h:focus-visible,.ds-focus-ring.sc-ds-panel-sub-nav:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-panel-sub-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-panel-sub-nav{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-panel-sub-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-panel-sub-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-panel-sub-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-panel-sub-nav:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-sub-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-sub-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-sub-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-sub-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-panel-sub-nav-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-panel-sub-nav:root,.sc-ds-panel-sub-nav-h,.ds-forced-colors-scope.sc-ds-panel-sub-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-panel-sub-nav-h,.ds-interaction-fill.sc-ds-panel-sub-nav{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-panel-sub-nav-h::before,.ds-interaction-fill.sc-ds-panel-sub-nav::before,.ds-interaction-fill.sc-ds-panel-sub-nav-h::after,.ds-interaction-fill.sc-ds-panel-sub-nav::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-panel-sub-nav-h::before,.ds-interaction-fill.sc-ds-panel-sub-nav::before{z-index:1}.ds-interaction-fill.sc-ds-panel-sub-nav-h::after,.ds-interaction-fill.sc-ds-panel-sub-nav::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-panel-sub-nav-h,.ds-interaction-fill--bordered.sc-ds-panel-sub-nav{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-panel-sub-nav-h::before,.ds-interaction-fill--selected.sc-ds-panel-sub-nav::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-panel-sub-nav-h,.ds-interaction-fill--selected.sc-ds-panel-sub-nav{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-panel-sub-nav-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-panel-sub-nav:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-panel-sub-nav-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-panel-sub-nav:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-panel-sub-nav-h::after,.ds-interaction-fill--grouped.sc-ds-panel-sub-nav::after,.ds-interaction-fill--grouped.sc-ds-panel-sub-nav-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-panel-sub-nav:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-panel-sub-nav-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-panel-sub-nav:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-panel-sub-nav-h,.ds-interaction-fill--grouped.sc-ds-panel-sub-nav{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-panel-sub-nav-h>.ds-interaction-fill__content.sc-ds-panel-sub-nav,.ds-interaction-fill.sc-ds-panel-sub-nav>.ds-interaction-fill__content.sc-ds-panel-sub-nav,.ds-interaction-fill__content.sc-ds-panel-sub-nav{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-faint.sc-ds-panel-sub-nav{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-medium.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-bold.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-strong.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-translucent.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-inverted.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-media.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-always-dark.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-navigation.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-panel-sub-nav-h:not(:disabled)::after,.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-panel-sub-nav:not(:disabled)::after{background:var(--ds-interaction-pressed)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-panel-sub-nav-h::after,.ds-interaction-fill.sc-ds-panel-sub-nav::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--surface-open.sc-ds-panel-sub-nav-h:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill--surface-open.sc-ds-panel-sub-nav:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.ds-interaction-fill--selected.sc-ds-panel-sub-nav-h::before,.ds-interaction-fill--selected.sc-ds-panel-sub-nav::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-panel-sub-nav-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-panel-sub-nav:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-panel-sub-nav:root,.sc-ds-panel-sub-nav-h,.ds-forced-colors-scope.sc-ds-panel-sub-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-panel-sub-nav-h,.ds-control-inactive.sc-ds-panel-sub-nav{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-panel-sub-nav-h,.ds-control-inactive.sc-ds-panel-sub-nav{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-panel-sub-nav-h{display:block;width:100%}.panel-sub-nav.sc-ds-panel-sub-nav{display:flex;flex-direction:column;gap:var(--dimension-space-050);width:100%}.panel-sub-nav__item.sc-ds-panel-sub-nav{display:flex;align-items:center;justify-content:flex-start;gap:var(--ds-control-gap);width:100%;height:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);box-sizing:border-box;border:none;border-radius:var(--ds-control-radius);background:transparent;color:var(--color-foreground-secondary);cursor:default;text-align:left;-webkit-user-select:none;user-select:none;transition:color var(--effect-motion-short-2)}.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-foreground-primary)}.panel-sub-nav__item--on-medium.sc-ds-panel-sub-nav{color:var(--color-foreground-on-medium-background-secondary)}.panel-sub-nav__item--on-medium.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-foreground-on-medium-background-primary)}.panel-sub-nav__item--on-bold.sc-ds-panel-sub-nav{color:var(--color-foreground-on-bold-background-secondary)}.panel-sub-nav__item--on-bold.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-foreground-on-bold-background-primary)}.panel-sub-nav__item--on-strong.sc-ds-panel-sub-nav{color:var(--color-foreground-on-strong-background-secondary)}.panel-sub-nav__item--on-strong.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-foreground-on-strong-background-primary)}.panel-sub-nav__item--on-translucent.sc-ds-panel-sub-nav{color:var(--color-translucent-foreground-secondary)}.panel-sub-nav__item--on-translucent.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-translucent-foreground-primary)}.panel-sub-nav__item--on-inverted.sc-ds-panel-sub-nav{color:var(--color-inverted-foreground-secondary)}.panel-sub-nav__item--on-inverted.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-inverted-foreground-primary)}.panel-sub-nav__item--on-media.sc-ds-panel-sub-nav{color:var(--color-media-foreground-secondary)}.panel-sub-nav__item--on-media.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-media-foreground-primary)}.panel-sub-nav__item--on-always-dark.sc-ds-panel-sub-nav{color:var(--color-always-dark-foreground-secondary)}.panel-sub-nav__item--on-always-dark.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-always-dark-foreground-primary)}ds-text.panel-sub-nav__label.sc-ds-panel-sub-nav{flex:1;min-width:0;padding:0 var(--ds-control-label-inset)}`;const d=n(class n extends s{constructor(n){super();if(n!==false){this.__registerHost()}this.dsChange=e(this,"dsChange",7);this.value="";this.items=[];this.ariaLabel=null}get enabledItems(){return this.items.filter((n=>!n.isInactive))}get focusableId(){return this.enabledItems.some((n=>n.id===this.value))?this.value:this.enabledItems[0]?.id??""}selectItem(n){this.value=n;this.dsChange.emit(n);this.focusItem(n)}focusItem(n){const s=this.el.querySelector(`[data-panel-sub-nav-id="${n}"]`);s?.focus({preventScroll:true})}onValueChange(n,s){if(s===undefined||n===s)return;requestAnimationFrame((()=>{const s=document.activeElement;if(!s||!this.el.contains(s))return;this.focusItem(this.enabledItems.some((s=>s.id===n))?n:this.focusableId)}))}findEnabled(n,s){const e=this.items.length;for(let o=1;o<=e;o++){const i=(n+s*o+e*o)%e;if(!this.items[i]?.isInactive)return i}return n}handleKeyDown(n){if(!this.enabledItems.length)return;const s=n.target?.closest("[data-panel-sub-nav-id]")?.dataset["panelSubNavId"];const e=this.items.findIndex((n=>n.id===s));const o=this.items.findIndex((n=>n.id===this.value&&!n.isInactive));const i=e>=0?e:o>=0?o:n.key==="ArrowUp"?0:-1;let a=null;if(n.key==="ArrowDown"){a=this.findEnabled(i,1)}else if(n.key==="ArrowUp"){a=this.findEnabled(i,-1)}else if(n.key==="Home"){a=this.items.findIndex((n=>!n.isInactive))}else if(n.key==="End"){const n=[...this.items].reverse().findIndex((n=>!n.isInactive));a=n<0?null:this.items.length-1-n}if(a===null||a<0)return;const r=this.items[a];if(!r||r.isInactive)return;n.preventDefault();this.selectItem(r.id)}render(){const n=this.focusableId;const s=this.background;return o(i,{key:"9c519a0d1b002eeb6392aa5ea2da96272e6d5664"},o("div",{key:"62e2cab4fbc5624c8935e393104962d10d26958f",class:"panel-sub-nav",role:"tablist","aria-orientation":"vertical","aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby},this.items.map((e=>{const i=e.id===this.value;return o("button",{id:e.id,type:"button",role:"tab","data-panel-sub-nav-id":e.id,class:{"panel-sub-nav__item":true,"panel-sub-nav__item--selected":i,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-interaction-fill":!e.isInactive,"ds-interaction-fill--selected":i&&!e.isInactive,"ds-interaction-fill--on-faint":s==="faint","ds-interaction-fill--on-medium":s==="medium","ds-interaction-fill--on-bold":s==="bold","ds-interaction-fill--on-strong":s==="strong","ds-interaction-fill--on-translucent":s==="translucent","ds-interaction-fill--on-inverted":s==="inverted","ds-interaction-fill--on-media":s==="media","ds-interaction-fill--on-always-dark":s==="always-dark",[`panel-sub-nav__item--on-${s}`]:!!s,"ds-control-inactive":!!e.isInactive},"aria-selected":i?"true":"false","aria-controls":e.panelId,"aria-disabled":e.isInactive?"true":undefined,disabled:e.isInactive,tabIndex:e.id===n?0:-1,onClick:()=>!e.isInactive&&this.selectItem(e.id)},o("ds-text",{class:"panel-sub-nav__label ds-interaction-fill__content",as:"span",variant:"text-body-medium",color:"inherit"},e.label))}))))}get el(){return this}static get watchers(){return{value:[{onValueChange:0}]}}static get style(){return t()}},[2,"ds-panel-sub-nav",{value:[1025],items:[16],background:[1],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"]},[[0,"keydown","handleKeyDown"]],{value:[{onValueChange:0}]}]);function c(){if(typeof customElements==="undefined"){return}const n=["ds-panel-sub-nav","ds-text"];n.forEach((n=>{switch(n){case"ds-panel-sub-nav":if(!customElements.get(a(n))){customElements.define(a(n),d)}break;case"ds-text":if(!customElements.get(a(n))){r()}break}}))}c();const l=d;const v=c;export{l as DsPanelSubNav,v as defineCustomElement};
+import{p as n,H as s,c as e,h as o,a as i,t as a}from"./index.js";import{d as r}from"./p-D8OWhnID.js";const t=()=>`.sc-ds-panel-sub-nav-h,.sc-ds-panel-sub-nav:where(.ds-table),.sc-ds-panel-sub-nav:where(.tooltip-popup),.sc-ds-panel-sub-nav:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.ds-control--lg.sc-ds-panel-sub-nav,.ds-control--lg.sc-ds-panel-sub-nav-h,.ds-control--md.sc-ds-panel-sub-nav-h,.ds-control--md.sc-ds-panel-sub-nav,.ds-control--sm.sc-ds-panel-sub-nav-h,.ds-control--sm.sc-ds-panel-sub-nav,.ds-control--xs.sc-ds-panel-sub-nav-h,.ds-control--xs.sc-ds-panel-sub-nav{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-panel-sub-nav-h,.ds-control--lg.sc-ds-panel-sub-nav{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-panel-sub-nav-h,.ds-control--md.sc-ds-panel-sub-nav{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-panel-sub-nav-h,.ds-control--sm.sc-ds-panel-sub-nav{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-panel-sub-nav-h,.ds-control--xs.sc-ds-panel-sub-nav{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}@media (forced-colors: active){.sc-ds-panel-sub-nav:root,.sc-ds-panel-sub-nav-h,.ds-forced-colors-scope.sc-ds-panel-sub-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-panel-sub-nav-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-panel-sub-nav-h,.ds-focus-ring.sc-ds-panel-sub-nav,.ds-focus-ring-inset.sc-ds-panel-sub-nav-h,.ds-focus-ring-inset.sc-ds-panel-sub-nav{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-panel-sub-nav-h:focus-visible,.ds-focus-ring.sc-ds-panel-sub-nav:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-panel-sub-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-panel-sub-nav{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-panel-sub-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-panel-sub-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-panel-sub-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-panel-sub-nav:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-sub-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-sub-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-sub-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-sub-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-panel-sub-nav-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-panel-sub-nav:root,.sc-ds-panel-sub-nav-h,.ds-forced-colors-scope.sc-ds-panel-sub-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-panel-sub-nav-h,.ds-interaction-fill.sc-ds-panel-sub-nav{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-panel-sub-nav-h::before,.ds-interaction-fill.sc-ds-panel-sub-nav::before,.ds-interaction-fill.sc-ds-panel-sub-nav-h::after,.ds-interaction-fill.sc-ds-panel-sub-nav::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-panel-sub-nav-h::before,.ds-interaction-fill.sc-ds-panel-sub-nav::before{z-index:1}.ds-interaction-fill.sc-ds-panel-sub-nav-h::after,.ds-interaction-fill.sc-ds-panel-sub-nav::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-panel-sub-nav-h,.ds-interaction-fill--bordered.sc-ds-panel-sub-nav{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-panel-sub-nav-h::before,.ds-interaction-fill--selected.sc-ds-panel-sub-nav::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-panel-sub-nav-h,.ds-interaction-fill--selected.sc-ds-panel-sub-nav{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-panel-sub-nav-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-panel-sub-nav:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-panel-sub-nav-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-panel-sub-nav:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-panel-sub-nav-h::after,.ds-interaction-fill--grouped.sc-ds-panel-sub-nav::after,.ds-interaction-fill--grouped.sc-ds-panel-sub-nav-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-panel-sub-nav:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-panel-sub-nav-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-panel-sub-nav:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-panel-sub-nav-h,.ds-interaction-fill--grouped.sc-ds-panel-sub-nav{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-panel-sub-nav-h>.ds-interaction-fill__content.sc-ds-panel-sub-nav,.ds-interaction-fill.sc-ds-panel-sub-nav>.ds-interaction-fill__content.sc-ds-panel-sub-nav,.ds-interaction-fill__content.sc-ds-panel-sub-nav{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-faint.sc-ds-panel-sub-nav{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-medium.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-bold.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-strong.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-translucent.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-inverted.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-media.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-always-dark.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-chrome.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-chrome.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-chrome-interaction-hover);--ds-interaction-pressed:var(--color-chrome-interaction-pressed);--ds-interaction-active:var(--color-chrome-interaction-active);--ds-focus-ring-color:var(--color-chrome-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-panel-sub-nav-h,.ds-interaction-fill--on-navigation.sc-ds-panel-sub-nav{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-panel-sub-nav-h:not(:disabled)::after,.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-panel-sub-nav:not(:disabled)::after{background:var(--ds-interaction-pressed)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-panel-sub-nav-h::after,.ds-interaction-fill.sc-ds-panel-sub-nav::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--surface-open.sc-ds-panel-sub-nav-h:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill--surface-open.sc-ds-panel-sub-nav:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.ds-interaction-fill--selected.sc-ds-panel-sub-nav-h::before,.ds-interaction-fill--selected.sc-ds-panel-sub-nav::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-panel-sub-nav-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-panel-sub-nav:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-panel-sub-nav:root,.sc-ds-panel-sub-nav-h,.ds-forced-colors-scope.sc-ds-panel-sub-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-panel-sub-nav-h,.ds-control-inactive.sc-ds-panel-sub-nav{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-panel-sub-nav-h,.ds-control-inactive.sc-ds-panel-sub-nav{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-panel-sub-nav-h{display:block;width:100%}.panel-sub-nav.sc-ds-panel-sub-nav{display:flex;flex-direction:column;gap:var(--dimension-space-050);width:100%}.panel-sub-nav__item.sc-ds-panel-sub-nav{display:flex;align-items:center;justify-content:flex-start;gap:var(--ds-control-gap);width:100%;height:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);box-sizing:border-box;border:none;border-radius:var(--ds-control-radius);background:transparent;color:var(--color-foreground-secondary);cursor:default;text-align:left;-webkit-user-select:none;user-select:none;transition:color var(--effect-motion-short-2)}.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-foreground-primary)}.panel-sub-nav__item--on-medium.sc-ds-panel-sub-nav{color:var(--color-foreground-on-medium-background-secondary)}.panel-sub-nav__item--on-medium.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-foreground-on-medium-background-primary)}.panel-sub-nav__item--on-bold.sc-ds-panel-sub-nav{color:var(--color-foreground-on-bold-background-secondary)}.panel-sub-nav__item--on-bold.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-foreground-on-bold-background-primary)}.panel-sub-nav__item--on-strong.sc-ds-panel-sub-nav{color:var(--color-foreground-on-strong-background-secondary)}.panel-sub-nav__item--on-strong.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-foreground-on-strong-background-primary)}.panel-sub-nav__item--on-translucent.sc-ds-panel-sub-nav{color:var(--color-translucent-foreground-secondary)}.panel-sub-nav__item--on-translucent.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-translucent-foreground-primary)}.panel-sub-nav__item--on-inverted.sc-ds-panel-sub-nav{color:var(--color-inverted-foreground-secondary)}.panel-sub-nav__item--on-inverted.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-inverted-foreground-primary)}.panel-sub-nav__item--on-media.sc-ds-panel-sub-nav{color:var(--color-media-foreground-secondary)}.panel-sub-nav__item--on-media.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-media-foreground-primary)}.panel-sub-nav__item--on-always-dark.sc-ds-panel-sub-nav{color:var(--color-always-dark-foreground-secondary)}.panel-sub-nav__item--on-always-dark.panel-sub-nav__item--selected.sc-ds-panel-sub-nav{color:var(--color-always-dark-foreground-primary)}ds-text.panel-sub-nav__label.sc-ds-panel-sub-nav{flex:1;min-width:0;padding:0 var(--ds-control-label-inset)}`;const d=n(class n extends s{constructor(n){super();if(n!==false){this.__registerHost()}this.dsChange=e(this,"dsChange",7);this.value="";this.items=[];this.ariaLabel=null}get enabledItems(){return this.items.filter((n=>!n.isInactive))}get focusableId(){return this.enabledItems.some((n=>n.id===this.value))?this.value:this.enabledItems[0]?.id??""}selectItem(n){this.value=n;this.dsChange.emit(n);this.focusItem(n)}focusItem(n){const s=this.el.querySelector(`[data-panel-sub-nav-id="${n}"]`);s?.focus({preventScroll:true})}onValueChange(n,s){if(s===undefined||n===s)return;requestAnimationFrame((()=>{const s=document.activeElement;if(!s||!this.el.contains(s))return;this.focusItem(this.enabledItems.some((s=>s.id===n))?n:this.focusableId)}))}findEnabled(n,s){const e=this.items.length;for(let o=1;o<=e;o++){const i=(n+s*o+e*o)%e;if(!this.items[i]?.isInactive)return i}return n}handleKeyDown(n){if(!this.enabledItems.length)return;const s=n.target?.closest("[data-panel-sub-nav-id]")?.dataset["panelSubNavId"];const e=this.items.findIndex((n=>n.id===s));const o=this.items.findIndex((n=>n.id===this.value&&!n.isInactive));const i=e>=0?e:o>=0?o:n.key==="ArrowUp"?0:-1;let a=null;if(n.key==="ArrowDown"){a=this.findEnabled(i,1)}else if(n.key==="ArrowUp"){a=this.findEnabled(i,-1)}else if(n.key==="Home"){a=this.items.findIndex((n=>!n.isInactive))}else if(n.key==="End"){const n=[...this.items].reverse().findIndex((n=>!n.isInactive));a=n<0?null:this.items.length-1-n}if(a===null||a<0)return;const r=this.items[a];if(!r||r.isInactive)return;n.preventDefault();this.selectItem(r.id)}render(){const n=this.focusableId;const s=this.background;return o(i,{key:"b914bd7d6871dff34a5bf23c7da3e5e105695537"},o("div",{key:"3ec26d528b33216f8414130e41a10e404252d863",class:"panel-sub-nav",role:"tablist","aria-orientation":"vertical","aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby},this.items.map((e=>{const i=e.id===this.value;return o("button",{id:e.id,type:"button",role:"tab","data-panel-sub-nav-id":e.id,class:{"panel-sub-nav__item":true,"panel-sub-nav__item--selected":i,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-interaction-fill":!e.isInactive,"ds-interaction-fill--selected":i&&!e.isInactive,"ds-interaction-fill--on-faint":s==="faint","ds-interaction-fill--on-medium":s==="medium","ds-interaction-fill--on-bold":s==="bold","ds-interaction-fill--on-strong":s==="strong","ds-interaction-fill--on-translucent":s==="translucent","ds-interaction-fill--on-inverted":s==="inverted","ds-interaction-fill--on-media":s==="media","ds-interaction-fill--on-always-dark":s==="always-dark",[`panel-sub-nav__item--on-${s}`]:!!s,"ds-control-inactive":!!e.isInactive},"aria-selected":i?"true":"false","aria-controls":e.panelId,"aria-disabled":e.isInactive?"true":undefined,disabled:e.isInactive,tabIndex:e.id===n?0:-1,onClick:()=>!e.isInactive&&this.selectItem(e.id)},o("ds-text",{class:"panel-sub-nav__label ds-interaction-fill__content",as:"span",variant:"text-body-medium",color:"inherit"},e.label))}))))}get el(){return this}static get watchers(){return{value:[{onValueChange:0}]}}static get style(){return t()}},[2,"ds-panel-sub-nav",{value:[1025],items:[16],background:[1],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"]},[[0,"keydown","handleKeyDown"]],{value:[{onValueChange:0}]}]);function c(){if(typeof customElements==="undefined"){return}const n=["ds-panel-sub-nav","ds-text"];n.forEach((n=>{switch(n){case"ds-panel-sub-nav":if(!customElements.get(a(n))){customElements.define(a(n),d)}break;case"ds-text":if(!customElements.get(a(n))){r()}break}}))}c();const l=d;const v=c;export{l as DsPanelSubNav,v as defineCustomElement};
 //# sourceMappingURL=ds-panel-sub-nav.js.map