@ds-mo/ui 14.0.0 → 14.0.1

package/dist/.package-ready.json

@@ -1 +1 @@
-{"schemaVersion":1,"package":"@ds-mo/ui","version":"14.0.0","components":69,"digest":"fe271f437982df4da994c053163c0f969e8d7dd994aa055089686f6f3da3b093","completedAt":"2026-08-14T23:15:47.625Z"}
+{"schemaVersion":1,"package":"@ds-mo/ui","version":"14.0.1","components":69,"digest":"5f293c98010725ac5dc5f527062082b7c80b238e9ce8417fbe179496d21e5350","completedAt":"2026-08-15T02:01:20.084Z"}

package/dist/agent-patterns.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": "1.0.0",
   "package": "@ds-mo/ui",
-  "packageVersion": "14.0.0",
+  "packageVersion": "14.0.1",
   "kind": "patterns",
   "entries": [
     {

package/dist/agent.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": "1.0.0",
   "package": "@ds-mo/ui",
-  "packageVersion": "14.0.0",
+  "packageVersion": "14.0.1",
   "kind": "components",
   "entries": [
     {
@@ -5830,6 +5830,7 @@
           "Dashboard presents day-to-day operational destinations; Settings presents administrative and configuration destinations.",
           "The standard footer switches the entire destination collection and navStyle between Dashboard and Settings and exposes the user/account entry.",
           "The host owns the external user menu opened from dsNavUserAction.",
+          "While the external user menu is open or closing, accountMenuExpanded keeps its trigger visibly pressed without applying selected-destination foreground treatment in either expanded or collapsed presentation.",
           "Item and header controls inherit the shared md control radius while local shell geometry continues to own collapsed layout and footer animation positioning.",
           "On desktop, allow user-controlled expand and collapse and persist the preference with storageKey when cross-session persistence is appropriate."
         ],

package/dist/components/ds-input.js

@@ -1,2 +1,2 @@
-import{p as t,H as i,c as e,h as s,a as n,t as o}from"./index.js";import{d as r}from"./p-D8nnhQNJ.js";import{d}from"./p--z-DWRkg.js";import{d as a}from"./p-BFfLvMZd.js";import{d as c}from"./p-Ca-I2UnB.js";import{d as l}from"./p-DZFilC--.js";import{D as p,s as u}from"./p-DOUk4KoT.js";import{s as h,r as v}from"./p-D2xWcVv6.js";import{C as f}from"./p-CuwopElg.js";import{c as g}from"./p-DAW6G8Sl.js";const m=()=>`@media (forced-colors: active){.sc-ds-input:root,.sc-ds-input-h,.ds-forced-colors-scope.sc-ds-input{--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-input-h,.ds-interaction-fill.sc-ds-input{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-input-h::before,.ds-interaction-fill.sc-ds-input::before,.ds-interaction-fill.sc-ds-input-h::after,.ds-interaction-fill.sc-ds-input::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-input-h::before,.ds-interaction-fill.sc-ds-input::before{z-index:1}.ds-interaction-fill.sc-ds-input-h::after,.ds-interaction-fill.sc-ds-input::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-input-h,.ds-interaction-fill--bordered.sc-ds-input{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-input-h::before,.ds-interaction-fill--selected.sc-ds-input::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-input-h,.ds-interaction-fill--selected.sc-ds-input{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-input-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-input:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-input-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-input:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-input-h::after,.ds-interaction-fill--grouped.sc-ds-input::after,.ds-interaction-fill--grouped.sc-ds-input-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-input:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-input-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-input:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-input-h,.ds-interaction-fill--grouped.sc-ds-input{--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-input-h>.ds-interaction-fill__content.sc-ds-input,.ds-interaction-fill.sc-ds-input>.ds-interaction-fill__content.sc-ds-input,.ds-interaction-fill__content.sc-ds-input{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-input-h,.ds-interaction-fill--on-faint.sc-ds-input{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-input-h,.ds-interaction-fill--on-medium.sc-ds-input{--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-input-h,.ds-interaction-fill--on-bold.sc-ds-input{--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-input-h,.ds-interaction-fill--on-strong.sc-ds-input{--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-input-h,.ds-interaction-fill--on-translucent.sc-ds-input{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-input-h,.ds-interaction-fill--on-inverted.sc-ds-input{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-input-h,.ds-interaction-fill--on-media.sc-ds-input{--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-input-h,.ds-interaction-fill--on-always-dark.sc-ds-input{--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);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-input-h,.ds-interaction-fill--on-navigation.sc-ds-input{--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)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-input-h::after,.ds-interaction-fill.sc-ds-input::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--selected.sc-ds-input-h::before,.ds-interaction-fill--selected.sc-ds-input::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-input-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-input: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-input:root,.sc-ds-input-h,.ds-forced-colors-scope.sc-ds-input{--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-input-h,.ds-control-inactive.sc-ds-input{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-input-h,.ds-control-inactive.sc-ds-input{color:var(--ds-forced-color-disabled);opacity:1}}.ds-control--lg.sc-ds-input,.ds-control--lg.sc-ds-input-h,.ds-control--md.sc-ds-input-h,.ds-control--md.sc-ds-input,.ds-control--sm.sc-ds-input-h,.ds-control--sm.sc-ds-input,.ds-control--xs.sc-ds-input-h,.ds-control--xs.sc-ds-input{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-input-h,.ds-control--lg.sc-ds-input{--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-input-h,.ds-control--md.sc-ds-input{--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-input-h,.ds-control--sm.sc-ds-input{--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-input-h,.ds-control--xs.sc-ds-input{--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}.ds-control-frame.sc-ds-input{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-input{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc(     var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-control-icon-box.sc-ds-input{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-input{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-input{position:relative;padding-inline-end:calc(     var(--ds-control-label-inset, var(--dimension-space-025)) +       var(--ds-control-gap, var(--dimension-space-050))   )}.ds-control-label-dot__badge.sc-ds-input{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-control-width--hug.sc-ds-input-h,.ds-control-width--hug.sc-ds-input{width:fit-content;max-width:100%;flex:0 0 auto;align-self:flex-start}.ds-control-width--fill.sc-ds-input-h,.ds-control-width--fill.sc-ds-input{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}.ds-field-stack.sc-ds-input-h,.ds-field-stack.sc-ds-input{display:flex;flex-direction:column;gap:var(--dimension-space-050)}.ds-text--display-medium.sc-ds-input-h,.ds-text--display-medium.sc-ds-input{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-input-h,.ds-text--display-small.sc-ds-input{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-input-h,.ds-text--title-large.sc-ds-input{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-input-h,.ds-text--title-medium.sc-ds-input{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-input-h,.ds-text--title-small.sc-ds-input{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-input-h,.ds-text--body-large.sc-ds-input{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-input-h,.ds-text--body-medium.sc-ds-input{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-input-h,.ds-text--body-small.sc-ds-input{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-input-h,.ds-text--caption.sc-ds-input{font-size:var(--typography-fontsize-xs);line-height:var(--typography-lineheight-xs);text-transform:uppercase}.ds-text--display-medium.ds-text--emphasis.sc-ds-input-h,.ds-text--display-small.ds-text--emphasis.sc-ds-input-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-input,.ds-text--display-small.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-input-h,.ds-text--display-small.ds-text--regular.sc-ds-input-h,.ds-text--display-medium.ds-text--regular.sc-ds-input,.ds-text--display-small.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-input-h,.ds-text--title-large.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-input-h,.ds-text--title-large.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-input-h,.ds-text--title-small.ds-text--emphasis.sc-ds-input-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-input,.ds-text--title-small.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-input-h,.ds-text--title-small.ds-text--regular.sc-ds-input-h,.ds-text--title-medium.ds-text--regular.sc-ds-input,.ds-text--title-small.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-input-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-input-h,.ds-text--body-large.ds-text--emphasis.sc-ds-input,.ds-text--body-medium.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-input-h,.ds-text--body-medium.ds-text--regular.sc-ds-input-h,.ds-text--body-large.ds-text--regular.sc-ds-input,.ds-text--body-medium.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-input-h,.ds-text--body-small.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-input-h,.ds-text--body-small.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-input-h,.ds-text--caption.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-input-h,.ds-text--caption.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}@media (forced-colors: active){.sc-ds-input:root,.sc-ds-input-h,.ds-forced-colors-scope.sc-ds-input{--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}}.input-host.sc-ds-input-h{display:inline-flex;--ds-input-fg:var(--color-foreground-primary);--ds-input-placeholder:var(--color-foreground-secondary);--ds-input-placeholder-active:var(--color-foreground-quaternary);--ds-input-adornment-fg:var(--color-foreground-secondary);--ds-input-border:var(--color-border-secondary)}.ds-control-width--fill.sc-ds-input-h,.ds-control-width--fill.sc-ds-input-h .input-control.sc-ds-input{width:100%}.input-control.sc-ds-input{overflow:hidden;background:transparent;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));color:var(--ds-input-fg)}.input-control--bordered.sc-ds-input{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--ds-input-border)}.input-control--error.sc-ds-input{--ds-interaction-border-width:var(--dimension-stroke-width-018);--ds-interaction-border-color:var(--color-border-bold-negative)}.input-control--bordered.sc-ds-input:focus-within:not(.input-control--error){--ds-interaction-border-width:var(--dimension-stroke-width-018);--ds-interaction-border-color:var(--color-border-bold-brand)}.ds-control-inactive.sc-ds-input-h .input-control.sc-ds-input::after{background:transparent}.native-input.sc-ds-input{position:relative;z-index:2;flex:1 1 auto;min-width:0;height:100%;background:transparent;border:none;border-radius:inherit;outline:none;color:var(--ds-input-fg);font-family:inherit;-webkit-appearance:none;appearance:none}.native-input.sc-ds-input:disabled{cursor:not-allowed}.native-input.sc-ds-input:read-only:not(:disabled){cursor:default}.native-input.sc-ds-input::placeholder{color:var(--ds-input-placeholder)}.native-input.sc-ds-input:focus::placeholder{color:var(--ds-input-placeholder-active)}.native-input[type='search'].sc-ds-input::-webkit-search-cancel-button,.native-input[type='search'].sc-ds-input::-webkit-search-decoration{display:none}.input-control__prefix.sc-ds-input,.input-control__suffix.sc-ds-input{position:relative;z-index:2;color:var(--ds-input-adornment-fg)}.input-control__suffix--empty.sc-ds-input{display:none}.input-control__clear.sc-ds-input{position:relative;z-index:2;flex-shrink:0;align-self:center}.input-control.ds-control--lg.sc-ds-input:has(.input-control__clear),.input-control.ds-control--md.sc-ds-input:has(.input-control__clear),.input-control.ds-control--sm.sc-ds-input:has(.input-control__clear){padding-right:var(--dimension-space-050)}.input-control.ds-control--xs.sc-ds-input:has(.input-control__clear){padding-right:0}.error-text.sc-ds-input{width:100%}@media (forced-colors: active){.input-control--bordered.sc-ds-input:focus-within:not(.input-control--error)::after{outline-color:var(--ds-forced-color-selected)}.input-control--error.sc-ds-input::after{outline-style:dashed}}`;const b={lg:"lg",md:"md",sm:"sm",xs:"xs"};const y={lg:"md",md:"sm",sm:"xs",xs:"xs"};let x=0;const w=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.dsChange=e(this,"dsChange");this.dsClear=e(this,"dsClear");this.internals=this.attachInternals();this.generatedId=`ds-input-${++x}`;this.errorId=`${this.generatedId}-error`;this.value="";this.disabled=false;this.readOnly=false;this.required=false;this.requiredMessage=p;this.clearLabel="Clear";this.type="text";this.inputMode="";this.enterKeyHint="";this.size="md";this.width="fill";this.hasBorder=true;this.isInactive=false;this.autoFocus=false;this.error=false;this.ariaLabel=null;this.initialValue="";this.formDisabled=false;this.hasSuffix=false;this.focused=false;this.touched=false;this.handleInput=t=>{this.value=t.target.value;this.dsChange.emit(this.value)};this.handleFocus=()=>{this.focused=true};this.handleBlur=()=>{this.focused=false;this.touched=true};this.handleClear=()=>{this.value="";this.dsChange.emit("");this.dsClear.emit();this.el.querySelector("input")?.focus()}}componentWillLoad(){this.initialValue=this.value;this.hasSuffix=Boolean(this.el.querySelector('[slot="suffix"]'));this.syncFormValue()}componentDidRender(){const t=Boolean(this.el.querySelector('[slot="suffix"]'));if(t!==this.hasSuffix)this.hasSuffix=t}syncFormValue(){const t=this.isInactive||this.disabled||this.formDisabled;h(this.internals,this.value,{inactive:t});const i=this.required&&!t&&this.value.length===0;u(this.internals,i,this.requiredMessage)}formDisabledCallback(t){this.formDisabled=t;this.syncFormValue()}formResetCallback(){this.value=this.initialValue}formStateRestoreCallback(t){this.value=v(t)}async setFocus(){this.el.querySelector("input")?.focus()}render(){const t=this.inputId??this.generatedId;const i=this.isInactive||this.disabled||this.formDisabled;const e=this.value.length>0;const o=this.value!==this.initialValue;const r=this.type==="search"&&e&&!i&&!this.readOnly;const d=this.error&&Boolean(this.errorMessage);const a=f[this.size];const c=b[this.size];const l=[this.ariaDescribedby,d?this.errorId:undefined].filter(Boolean).join(" ")||undefined;return s(n,{key:"14f89a3b7a1be509fba635d3290e0348a0460b76",class:{"input-host":true,"ds-field-stack":true,"ds-control-inactive":i,[`ds-control--${this.size}`]:true,...g(this.width)},"data-disabled":i?"":undefined,"data-readonly":this.readOnly?"":undefined,"data-required":this.required?"":undefined,"data-invalid":this.error?"":undefined,"data-filled":e?"":undefined,"data-focused":this.focused?"":undefined,"data-dirty":o?"":undefined,"data-touched":this.touched?"":undefined},s("div",{key:"a6c669ad78164a9affcc260f6da29b17e4c353fc",class:{"input-control":true,"ds-control-frame":true,"input-control--bordered":this.hasBorder,"input-control--error":this.hasBorder&&this.error,"ds-interaction-fill":true,[`ds-control--${this.size}`]:true}},this.icon&&s("span",{key:"2b62ab06e67a1b2bff44cb3c1455b7e4dd6cf62e",class:"input-control__prefix ds-control-icon-box ds-interaction-fill__content","aria-hidden":"true"},s("ds-icon",{key:"64219f98843f921a4457cd45360c2d607b9bedbc",name:this.icon,size:c,color:"inherit"})),s("input",{key:"71f6185c46e329293c4f2c57181166ad3a7396e2",type:this.type,id:t,value:this.value,placeholder:this.placeholder,disabled:i,readOnly:this.readOnly,required:this.required,autoFocus:this.autoFocus,autoComplete:this.autoComplete,inputMode:this.inputMode||undefined,enterKeyHint:this.enterKeyHint||undefined,class:`native-input ds-control-label-box ds-text--${a.replace("text-","")} ds-text--regular ds-interaction-fill__content`,"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-describedby":l,"aria-invalid":this.error?"true":undefined,onInput:this.handleInput,onFocus:this.handleFocus,onBlur:this.handleBlur}),s("span",{key:"fd4624ce08f45a0e6a49d56323c7626bb66be365",class:{"input-control__suffix":true,"ds-control-icon-box":true,"input-control__suffix--empty":!this.hasSuffix}},s("slot",{key:"435efca1095cf41b26509a1d0dd701646ee4e88b",name:"suffix"})),r&&s("ds-button-unfilled",{key:"f93a95e7e25398a130067fe8e231a5fcd2ce163d",class:"input-control__clear",variant:"icon",size:y[this.size],icon:"CrossCircle",hasBorder:false,rounded:true,ariaLabel:this.clearLabel,onDsClick:this.handleClear})),d&&s("ds-text",{key:"a19b77e72d04078c142ed481e8c38f198f8e9cd8",class:"error-text",as:"div",variant:"text-body-small",color:"negative",textId:this.errorId,role:"alert"},this.errorMessage))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}]}}static get style(){return m()}},[326,"ds-input",{value:[1025],name:[513],form:[513],disabled:[516],readOnly:[516,"read-only"],required:[516],requiredMessage:[1,"required-message"],clearLabel:[1,"clear-label"],placeholder:[1],type:[1],autoComplete:[1,"autocomplete"],inputMode:[1,"inputmode"],enterKeyHint:[1,"enterkeyhint"],size:[1],width:[1],hasBorder:[4,"has-border"],icon:[1],isInactive:[4,"is-inactive"],autoFocus:[4,"auto-focus"],error:[4],errorMessage:[1,"error-message"],inputId:[1,"input-id"],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],ariaDescribedby:[1,"aria-describedby"],formDisabled:[32],hasSuffix:[32],focused:[32],touched:[32],setFocus:[64]},undefined,{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}]}]);function k(){if(typeof customElements==="undefined"){return}const t=["ds-input","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text"];t.forEach((t=>{switch(t){case"ds-input":if(!customElements.get(o(t))){customElements.define(o(t),w)}break;case"ds-badge":if(!customElements.get(o(t))){r()}break;case"ds-button-unfilled":if(!customElements.get(o(t))){d()}break;case"ds-icon":if(!customElements.get(o(t))){a()}break;case"ds-loader":if(!customElements.get(o(t))){c()}break;case"ds-text":if(!customElements.get(o(t))){l()}break}}))}k();const z=w;const _=k;export{z as DsInput,_ as defineCustomElement};
+import{p as t,H as i,c as e,h as s,a as n,t as o}from"./index.js";import{d as r}from"./p-D8nnhQNJ.js";import{d}from"./p--z-DWRkg.js";import{d as a}from"./p-BFfLvMZd.js";import{d as c}from"./p-Ca-I2UnB.js";import{d as l}from"./p-DZFilC--.js";import{D as p,s as u}from"./p-DOUk4KoT.js";import{s as h,r as v}from"./p-D2xWcVv6.js";import{C as f}from"./p-CuwopElg.js";import{c as g}from"./p-DAW6G8Sl.js";const m=()=>`@media (forced-colors: active){.sc-ds-input:root,.sc-ds-input-h,.ds-forced-colors-scope.sc-ds-input{--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-input-h,.ds-interaction-fill.sc-ds-input{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-input-h::before,.ds-interaction-fill.sc-ds-input::before,.ds-interaction-fill.sc-ds-input-h::after,.ds-interaction-fill.sc-ds-input::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-input-h::before,.ds-interaction-fill.sc-ds-input::before{z-index:1}.ds-interaction-fill.sc-ds-input-h::after,.ds-interaction-fill.sc-ds-input::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-input-h,.ds-interaction-fill--bordered.sc-ds-input{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-input-h::before,.ds-interaction-fill--selected.sc-ds-input::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-input-h,.ds-interaction-fill--selected.sc-ds-input{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-input-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-input:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-input-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-input:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-input-h::after,.ds-interaction-fill--grouped.sc-ds-input::after,.ds-interaction-fill--grouped.sc-ds-input-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-input:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-input-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-input:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-input-h,.ds-interaction-fill--grouped.sc-ds-input{--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-input-h>.ds-interaction-fill__content.sc-ds-input,.ds-interaction-fill.sc-ds-input>.ds-interaction-fill__content.sc-ds-input,.ds-interaction-fill__content.sc-ds-input{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-input-h,.ds-interaction-fill--on-faint.sc-ds-input{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-input-h,.ds-interaction-fill--on-medium.sc-ds-input{--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-input-h,.ds-interaction-fill--on-bold.sc-ds-input{--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-input-h,.ds-interaction-fill--on-strong.sc-ds-input{--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-input-h,.ds-interaction-fill--on-translucent.sc-ds-input{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-input-h,.ds-interaction-fill--on-inverted.sc-ds-input{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-input-h,.ds-interaction-fill--on-media.sc-ds-input{--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-input-h,.ds-interaction-fill--on-always-dark.sc-ds-input{--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);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-input-h,.ds-interaction-fill--on-navigation.sc-ds-input{--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)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-input-h::after,.ds-interaction-fill.sc-ds-input::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--selected.sc-ds-input-h::before,.ds-interaction-fill--selected.sc-ds-input::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-input-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-input: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-input:root,.sc-ds-input-h,.ds-forced-colors-scope.sc-ds-input{--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-input-h,.ds-control-inactive.sc-ds-input{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-input-h,.ds-control-inactive.sc-ds-input{color:var(--ds-forced-color-disabled);opacity:1}}.ds-control--lg.sc-ds-input,.ds-control--lg.sc-ds-input-h,.ds-control--md.sc-ds-input-h,.ds-control--md.sc-ds-input,.ds-control--sm.sc-ds-input-h,.ds-control--sm.sc-ds-input,.ds-control--xs.sc-ds-input-h,.ds-control--xs.sc-ds-input{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-input-h,.ds-control--lg.sc-ds-input{--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-input-h,.ds-control--md.sc-ds-input{--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-input-h,.ds-control--sm.sc-ds-input{--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-input-h,.ds-control--xs.sc-ds-input{--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}.ds-control-frame.sc-ds-input{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-input{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc(     var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-control-icon-box.sc-ds-input{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-input{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-input{position:relative;padding-inline-end:calc(     var(--ds-control-label-inset, var(--dimension-space-025)) +       var(--ds-control-gap, var(--dimension-space-050))   )}.ds-control-label-dot__badge.sc-ds-input{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-control-width--hug.sc-ds-input-h,.ds-control-width--hug.sc-ds-input{width:fit-content;max-width:100%;flex:0 0 auto;align-self:flex-start}.ds-control-width--fill.sc-ds-input-h,.ds-control-width--fill.sc-ds-input{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}.ds-field-stack.sc-ds-input-h,.ds-field-stack.sc-ds-input{display:flex;flex-direction:column;gap:var(--dimension-space-050)}.ds-text--display-medium.sc-ds-input-h,.ds-text--display-medium.sc-ds-input{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-input-h,.ds-text--display-small.sc-ds-input{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-input-h,.ds-text--title-large.sc-ds-input{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-input-h,.ds-text--title-medium.sc-ds-input{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-input-h,.ds-text--title-small.sc-ds-input{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-input-h,.ds-text--body-large.sc-ds-input{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-input-h,.ds-text--body-medium.sc-ds-input{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-input-h,.ds-text--body-small.sc-ds-input{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-input-h,.ds-text--caption.sc-ds-input{font-size:var(--typography-fontsize-xs);line-height:var(--typography-lineheight-xs);text-transform:uppercase}.ds-text--display-medium.ds-text--emphasis.sc-ds-input-h,.ds-text--display-small.ds-text--emphasis.sc-ds-input-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-input,.ds-text--display-small.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-input-h,.ds-text--display-small.ds-text--regular.sc-ds-input-h,.ds-text--display-medium.ds-text--regular.sc-ds-input,.ds-text--display-small.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-input-h,.ds-text--title-large.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-input-h,.ds-text--title-large.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-input-h,.ds-text--title-small.ds-text--emphasis.sc-ds-input-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-input,.ds-text--title-small.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-input-h,.ds-text--title-small.ds-text--regular.sc-ds-input-h,.ds-text--title-medium.ds-text--regular.sc-ds-input,.ds-text--title-small.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-input-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-input-h,.ds-text--body-large.ds-text--emphasis.sc-ds-input,.ds-text--body-medium.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-input-h,.ds-text--body-medium.ds-text--regular.sc-ds-input-h,.ds-text--body-large.ds-text--regular.sc-ds-input,.ds-text--body-medium.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-input-h,.ds-text--body-small.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-input-h,.ds-text--body-small.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-input-h,.ds-text--caption.ds-text--emphasis.sc-ds-input{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-input-h,.ds-text--caption.ds-text--regular.sc-ds-input{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}@media (forced-colors: active){.sc-ds-input:root,.sc-ds-input-h,.ds-forced-colors-scope.sc-ds-input{--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}}.input-host.sc-ds-input-h{display:inline-flex;--ds-input-fg:var(--color-foreground-primary);--ds-input-placeholder:var(--color-foreground-secondary);--ds-input-placeholder-active:var(--color-foreground-quaternary);--ds-input-adornment-fg:var(--color-foreground-secondary);--ds-input-border:var(--color-border-secondary)}.ds-control-width--fill.sc-ds-input-h,.ds-control-width--fill.sc-ds-input-h .input-control.sc-ds-input{width:100%}.input-control.sc-ds-input{overflow:hidden;background:transparent;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));color:var(--ds-input-fg)}.input-control--bordered.sc-ds-input{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--ds-input-border)}.input-control--error.sc-ds-input{--ds-interaction-border-width:var(--dimension-stroke-width-018);--ds-interaction-border-color:var(--color-border-bold-negative)}.input-control--bordered.sc-ds-input:focus-within:not(.input-control--error){--ds-interaction-border-width:var(--dimension-stroke-width-018);--ds-interaction-border-color:var(--color-border-bold-brand)}.ds-control-inactive.sc-ds-input-h .input-control.sc-ds-input::after{background:transparent}.native-input.sc-ds-input{position:relative;z-index:2;flex:1 1 auto;min-width:0;height:100%;background:transparent;border:none;border-radius:inherit;outline:none;color:var(--ds-input-fg);font-family:inherit;-webkit-appearance:none;appearance:none}.native-input.sc-ds-input:disabled{cursor:not-allowed}.native-input.sc-ds-input:read-only:not(:disabled){cursor:default}.native-input.sc-ds-input::placeholder{color:var(--ds-input-placeholder)}.native-input.sc-ds-input:focus::placeholder{color:var(--ds-input-placeholder-active)}.native-input[type='search'].sc-ds-input::-webkit-search-cancel-button,.native-input[type='search'].sc-ds-input::-webkit-search-decoration{display:none}.input-control__prefix.sc-ds-input,.input-control__suffix.sc-ds-input{position:relative;z-index:2;color:var(--ds-input-adornment-fg)}.input-control__suffix--empty.sc-ds-input{display:none}.input-control.sc-ds-input>.input-control__clear.sc-ds-input{position:relative;z-index:2;flex-shrink:0;align-self:center}.input-control.ds-control--lg.sc-ds-input:has(.input-control__clear),.input-control.ds-control--md.sc-ds-input:has(.input-control__clear),.input-control.ds-control--sm.sc-ds-input:has(.input-control__clear){padding-right:var(--dimension-space-050)}.input-control.ds-control--xs.sc-ds-input:has(.input-control__clear){padding-right:0}.error-text.sc-ds-input{width:100%}@media (forced-colors: active){.input-control--bordered.sc-ds-input:focus-within:not(.input-control--error)::after{outline-color:var(--ds-forced-color-selected)}.input-control--error.sc-ds-input::after{outline-style:dashed}}`;const b={lg:"lg",md:"md",sm:"sm",xs:"xs"};const y={lg:"md",md:"sm",sm:"xs",xs:"xs"};let x=0;const w=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.dsChange=e(this,"dsChange");this.dsClear=e(this,"dsClear");this.internals=this.attachInternals();this.generatedId=`ds-input-${++x}`;this.errorId=`${this.generatedId}-error`;this.value="";this.disabled=false;this.readOnly=false;this.required=false;this.requiredMessage=p;this.clearLabel="Clear";this.type="text";this.inputMode="";this.enterKeyHint="";this.size="md";this.width="fill";this.hasBorder=true;this.isInactive=false;this.autoFocus=false;this.error=false;this.ariaLabel=null;this.initialValue="";this.formDisabled=false;this.hasSuffix=false;this.focused=false;this.touched=false;this.handleInput=t=>{this.value=t.target.value;this.dsChange.emit(this.value)};this.handleFocus=()=>{this.focused=true};this.handleBlur=()=>{this.focused=false;this.touched=true};this.handleClear=()=>{this.value="";this.dsChange.emit("");this.dsClear.emit();this.el.querySelector("input")?.focus()}}componentWillLoad(){this.initialValue=this.value;this.hasSuffix=Boolean(this.el.querySelector('[slot="suffix"]'));this.syncFormValue()}componentDidRender(){const t=Boolean(this.el.querySelector('[slot="suffix"]'));if(t!==this.hasSuffix)this.hasSuffix=t}syncFormValue(){const t=this.isInactive||this.disabled||this.formDisabled;h(this.internals,this.value,{inactive:t});const i=this.required&&!t&&this.value.length===0;u(this.internals,i,this.requiredMessage)}formDisabledCallback(t){this.formDisabled=t;this.syncFormValue()}formResetCallback(){this.value=this.initialValue}formStateRestoreCallback(t){this.value=v(t)}async setFocus(){this.el.querySelector("input")?.focus()}render(){const t=this.inputId??this.generatedId;const i=this.isInactive||this.disabled||this.formDisabled;const e=this.value.length>0;const o=this.value!==this.initialValue;const r=this.type==="search"&&e&&!i&&!this.readOnly;const d=this.error&&Boolean(this.errorMessage);const a=f[this.size];const c=b[this.size];const l=[this.ariaDescribedby,d?this.errorId:undefined].filter(Boolean).join(" ")||undefined;return s(n,{key:"14f89a3b7a1be509fba635d3290e0348a0460b76",class:{"input-host":true,"ds-field-stack":true,"ds-control-inactive":i,[`ds-control--${this.size}`]:true,...g(this.width)},"data-disabled":i?"":undefined,"data-readonly":this.readOnly?"":undefined,"data-required":this.required?"":undefined,"data-invalid":this.error?"":undefined,"data-filled":e?"":undefined,"data-focused":this.focused?"":undefined,"data-dirty":o?"":undefined,"data-touched":this.touched?"":undefined},s("div",{key:"a6c669ad78164a9affcc260f6da29b17e4c353fc",class:{"input-control":true,"ds-control-frame":true,"input-control--bordered":this.hasBorder,"input-control--error":this.hasBorder&&this.error,"ds-interaction-fill":true,[`ds-control--${this.size}`]:true}},this.icon&&s("span",{key:"2b62ab06e67a1b2bff44cb3c1455b7e4dd6cf62e",class:"input-control__prefix ds-control-icon-box ds-interaction-fill__content","aria-hidden":"true"},s("ds-icon",{key:"64219f98843f921a4457cd45360c2d607b9bedbc",name:this.icon,size:c,color:"inherit"})),s("input",{key:"71f6185c46e329293c4f2c57181166ad3a7396e2",type:this.type,id:t,value:this.value,placeholder:this.placeholder,disabled:i,readOnly:this.readOnly,required:this.required,autoFocus:this.autoFocus,autoComplete:this.autoComplete,inputMode:this.inputMode||undefined,enterKeyHint:this.enterKeyHint||undefined,class:`native-input ds-control-label-box ds-text--${a.replace("text-","")} ds-text--regular ds-interaction-fill__content`,"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-describedby":l,"aria-invalid":this.error?"true":undefined,onInput:this.handleInput,onFocus:this.handleFocus,onBlur:this.handleBlur}),s("span",{key:"fd4624ce08f45a0e6a49d56323c7626bb66be365",class:{"input-control__suffix":true,"ds-control-icon-box":true,"input-control__suffix--empty":!this.hasSuffix}},s("slot",{key:"435efca1095cf41b26509a1d0dd701646ee4e88b",name:"suffix"})),r&&s("ds-button-unfilled",{key:"f93a95e7e25398a130067fe8e231a5fcd2ce163d",class:"input-control__clear",variant:"icon",size:y[this.size],icon:"CrossCircle",hasBorder:false,rounded:true,ariaLabel:this.clearLabel,onDsClick:this.handleClear})),d&&s("ds-text",{key:"a19b77e72d04078c142ed481e8c38f198f8e9cd8",class:"error-text",as:"div",variant:"text-body-small",color:"negative",textId:this.errorId,role:"alert"},this.errorMessage))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}]}}static get style(){return m()}},[326,"ds-input",{value:[1025],name:[513],form:[513],disabled:[516],readOnly:[516,"read-only"],required:[516],requiredMessage:[1,"required-message"],clearLabel:[1,"clear-label"],placeholder:[1],type:[1],autoComplete:[1,"autocomplete"],inputMode:[1,"inputmode"],enterKeyHint:[1,"enterkeyhint"],size:[1],width:[1],hasBorder:[4,"has-border"],icon:[1],isInactive:[4,"is-inactive"],autoFocus:[4,"auto-focus"],error:[4],errorMessage:[1,"error-message"],inputId:[1,"input-id"],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],ariaDescribedby:[1,"aria-describedby"],formDisabled:[32],hasSuffix:[32],focused:[32],touched:[32],setFocus:[64]},undefined,{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}]}]);function k(){if(typeof customElements==="undefined"){return}const t=["ds-input","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text"];t.forEach((t=>{switch(t){case"ds-input":if(!customElements.get(o(t))){customElements.define(o(t),w)}break;case"ds-badge":if(!customElements.get(o(t))){r()}break;case"ds-button-unfilled":if(!customElements.get(o(t))){d()}break;case"ds-icon":if(!customElements.get(o(t))){a()}break;case"ds-loader":if(!customElements.get(o(t))){c()}break;case"ds-text":if(!customElements.get(o(t))){l()}break}}))}k();const z=w;const _=k;export{z as DsInput,_ as defineCustomElement};
 //# sourceMappingURL=ds-input.js.map

package/dist/components/ds-input.js.map

@@ -1 +1 @@
-{"version":3,"names":["inputCss","ICON_SIZE","lg","md","sm","xs","CLEAR_BUTTON_SIZE","idCounter","Input","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","generatedId","errorId","value","disabled","readOnly","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","clearLabel","type","inputMode","enterKeyHint","size","width","hasBorder","isInactive","autoFocus","error","ariaLabel","initialValue","formDisabled","hasSuffix","focused","touched","handleInput","e","target","dsChange","emit","handleFocus","handleBlur","handleClear","dsClear","el","querySelector","focus","componentWillLoad","Boolean","syncFormValue","componentDidRender","inactive","setFormControlValue","internals","missing","length","setRequiredValidity","formDisabledCallback","formResetCallback","formStateRestoreCallback","state","restoreStringFormState","setFocus","render","inputId","filled","dirty","showClear","showError","errorMessage","textVariant","CONTROL_TEXT_VARIANT","iconSize","describedBy","ariaDescribedby","undefined","filter","join","h","Host","key","class","controlWidthClass","icon","name","color","id","placeholder","autoComplete","replace","ariaLabelledby","onInput","onFocus","onBlur","variant","rounded","onDsClick","as","textId","role"],"sources":["src/wc/components/Input/Input.css?tag=ds-input&encapsulation=scoped","src/wc/components/Input/Input.tsx"],"sourcesContent":["@import '../../utils/interaction-fill.css';\n@import '../../utils/control-inactive.css';\n@import '../../utils/control-density.css';\n@import '../../utils/control-parts.css';\n@import '../../utils/control-width.css';\n@import '../../utils/field-stack.css';\n@import '../../utils/typography.css';\n@import '../../utils/forced-colors.css';\n\n:host(.input-host) {\n  display: inline-flex;\n  --ds-input-fg: var(--color-foreground-primary);\n  --ds-input-placeholder: var(--color-foreground-secondary);\n  --ds-input-placeholder-active: var(--color-foreground-quaternary);\n  --ds-input-adornment-fg: var(--color-foreground-secondary);\n  --ds-input-border: var(--color-border-secondary);\n}\n\n:host(.ds-control-width--fill),\n:host(.ds-control-width--fill) .input-control {\n  width: 100%;\n}\n\n.input-control {\n  overflow: hidden;\n  background: transparent;\n  border: none;\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n  color: var(--ds-input-fg);\n}\n\n.input-control--bordered {\n  --ds-interaction-border-width: var(--dimension-stroke-width-012);\n  --ds-interaction-border-color: var(--ds-input-border);\n}\n\n.input-control--error {\n  --ds-interaction-border-width: var(--dimension-stroke-width-018);\n  --ds-interaction-border-color: var(--color-border-bold-negative);\n}\n\n.input-control--bordered:focus-within:not(.input-control--error) {\n  --ds-interaction-border-width: var(--dimension-stroke-width-018);\n  --ds-interaction-border-color: var(--color-border-bold-brand);\n}\n\n:host(.ds-control-inactive) .input-control::after {\n  background: transparent;\n}\n\n.native-input {\n  position: relative;\n  z-index: 2;\n  flex: 1 1 auto;\n  min-width: 0;\n  height: 100%;\n  background: transparent;\n  border: none;\n  border-radius: inherit;\n  outline: none;\n  color: var(--ds-input-fg);\n  font-family: inherit;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.native-input:disabled {\n  cursor: not-allowed;\n}\n\n.native-input:read-only:not(:disabled) {\n  cursor: default;\n}\n\n.native-input::placeholder {\n  color: var(--ds-input-placeholder);\n}\n\n.native-input:focus::placeholder {\n  color: var(--ds-input-placeholder-active);\n}\n\n.native-input[type='search']::-webkit-search-cancel-button,\n.native-input[type='search']::-webkit-search-decoration {\n  display: none;\n}\n\n.input-control__prefix,\n.input-control__suffix {\n  position: relative;\n  z-index: 2;\n  color: var(--ds-input-adornment-fg);\n}\n\n.input-control__suffix--empty {\n  display: none;\n}\n\n.input-control__clear {\n  position: relative;\n  z-index: 2;\n  flex-shrink: 0;\n  align-self: center;\n}\n\n.input-control.ds-control--lg:has(.input-control__clear),\n.input-control.ds-control--md:has(.input-control__clear),\n.input-control.ds-control--sm:has(.input-control__clear) {\n  padding-right: var(--dimension-space-050);\n}\n\n.input-control.ds-control--xs:has(.input-control__clear) {\n  padding-right: 0;\n}\n\n.error-text {\n  width: 100%;\n}\n\n@media (forced-colors: active) {\n  .input-control--bordered:focus-within:not(.input-control--error)::after {\n    outline-color: var(--ds-forced-color-selected);\n  }\n\n  .input-control--error::after {\n    outline-style: dashed;\n  }\n}\n","import { AttachInternals, Component, Prop, State, Event, EventEmitter, Element, Method, Watch, h, Host } from '@stencil/core';\nimport {\n  controlWidthClass,\n  CONTROL_TEXT_VARIANT,\n  DEFAULT_REQUIRED_MESSAGE,\n  restoreStringFormState,\n  setFormControlValue,\n  setRequiredValidity,\n  type ControlWidth,\n} from '../../utils';\n\nexport type InputType = 'text' | 'email' | 'tel' | 'url' | 'search' | 'password';\nexport type InputSize = 'lg' | 'md' | 'sm' | 'xs';\nexport type InputWidth = ControlWidth;\n\nconst ICON_SIZE: Record<InputSize, 'lg' | 'md' | 'sm' | 'xs'> = {\n  lg: 'lg',\n  md: 'md',\n  sm: 'sm',\n  xs: 'xs',\n};\n\nconst CLEAR_BUTTON_SIZE: Record<InputSize, 'md' | 'sm' | 'xs'> = {\n  lg: 'md',\n  md: 'sm',\n  sm: 'xs',\n  xs: 'xs',\n};\n\nlet idCounter = 0;\n\n@Component({\n  tag: 'ds-input',\n  styleUrl: 'Input.css',\n  scoped: true,\n  formAssociated: true,\n})\nexport class Input {\n  @Element() el!: HTMLElement;\n  @AttachInternals() internals!: ElementInternals;\n\n  private generatedId = `ds-input-${++idCounter}`;\n  private errorId = `${this.generatedId}-error`;\n\n  @Prop({ mutable: true }) value: string = '';\n  @Prop({ reflect: true }) name: string | undefined;\n  @Prop({ reflect: true }) form: string | undefined;\n  @Prop({ reflect: true }) disabled: boolean = false;\n  /** Keeps the value focusable and submittable while preventing edits. */\n  @Prop({ reflect: true }) readOnly: boolean = false;\n  @Prop({ reflect: true }) required: boolean = false;\n  @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n  @Prop() clearLabel: string = 'Clear';\n  @Prop() placeholder: string | undefined;\n  @Prop() type: InputType = 'text';\n  /** Native browser autofill hint. */\n  @Prop({ attribute: 'autocomplete' }) autoComplete: string | undefined;\n  /** Preferred virtual keyboard without changing the value semantics. */\n  @Prop({ attribute: 'inputmode' }) inputMode: string = '';\n  /** Preferred virtual-keyboard action label. */\n  @Prop({ attribute: 'enterkeyhint' }) enterKeyHint: string = '';\n  /** Control density. */\n  @Prop() size: InputSize = 'md';\n  /** Width fit — fill the parent (default) or hug the available content. */\n  @Prop() width: InputWidth = 'fill';\n  /** Show the standard inset border, including focused and invalid strokes. */\n  @Prop() hasBorder: boolean = true;\n  /** Optional leading icon name. */\n  @Prop() icon: string | undefined;\n  @Prop() isInactive: boolean = false;\n  @Prop() autoFocus: boolean = false;\n  @Prop() error: boolean = false;\n  @Prop() errorMessage: string | undefined;\n  /** Associates the internal input with an external <label>. */\n  @Prop() inputId: string | undefined;\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n  @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n  @Prop({ attribute: 'aria-describedby' }) ariaDescribedby: string | undefined;\n\n  @Event() dsChange!: EventEmitter<string>;\n  @Event() dsClear!: EventEmitter<void>;\n\n  private initialValue = '';\n  @State() private formDisabled = false;\n  @State() private hasSuffix = false;\n  @State() private focused = false;\n  @State() private touched = false;\n\n  componentWillLoad() {\n    this.initialValue = this.value;\n    this.hasSuffix = Boolean(this.el.querySelector('[slot=\"suffix\"]'));\n    this.syncFormValue();\n  }\n\n  componentDidRender() {\n    const hasSuffix = Boolean(this.el.querySelector('[slot=\"suffix\"]'));\n    if (hasSuffix !== this.hasSuffix) this.hasSuffix = hasSuffix;\n  }\n\n  @Watch('value')\n  @Watch('disabled')\n  @Watch('isInactive')\n  @Watch('required')\n  syncFormValue() {\n    const inactive = this.isInactive || this.disabled || this.formDisabled;\n    setFormControlValue(this.internals, this.value, { inactive });\n    const missing = this.required && !inactive && this.value.length === 0;\n    setRequiredValidity(this.internals, missing, this.requiredMessage);\n  }\n\n  formDisabledCallback(disabled: boolean) {\n    this.formDisabled = disabled;\n    this.syncFormValue();\n  }\n\n  formResetCallback() {\n    this.value = this.initialValue;\n  }\n\n  formStateRestoreCallback(state: string | File | FormData | null) {\n    this.value = restoreStringFormState(state);\n  }\n\n  @Method()\n  async setFocus() {\n    this.el.querySelector('input')?.focus();\n  }\n\n  private handleInput = (e: Event) => {\n    this.value = (e.target as HTMLInputElement).value;\n    this.dsChange.emit(this.value);\n  };\n\n  private handleFocus = () => {\n    this.focused = true;\n  };\n\n  private handleBlur = () => {\n    this.focused = false;\n    this.touched = true;\n  };\n\n  private handleClear = () => {\n    this.value = '';\n    this.dsChange.emit('');\n    this.dsClear.emit();\n    this.el.querySelector('input')?.focus();\n  };\n\n  render() {\n    const inputId = this.inputId ?? this.generatedId;\n    const inactive = this.isInactive || this.disabled || this.formDisabled;\n    const filled = this.value.length > 0;\n    const dirty = this.value !== this.initialValue;\n    const showClear = this.type === 'search' && filled && !inactive && !this.readOnly;\n    const showError = this.error && Boolean(this.errorMessage);\n    const textVariant = CONTROL_TEXT_VARIANT[this.size];\n    const iconSize = ICON_SIZE[this.size];\n\n    const describedBy = [\n      this.ariaDescribedby,\n      showError ? this.errorId : undefined,\n    ].filter(Boolean).join(' ') || undefined;\n\n    return (\n      <Host\n        class={{\n          'input-host': true,\n          'ds-field-stack': true,\n          'ds-control-inactive': inactive,\n          [`ds-control--${this.size}`]: true,\n          ...controlWidthClass(this.width),\n        }}\n        data-disabled={inactive ? '' : undefined}\n        data-readonly={this.readOnly ? '' : undefined}\n        data-required={this.required ? '' : undefined}\n        data-invalid={this.error ? '' : undefined}\n        data-filled={filled ? '' : undefined}\n        data-focused={this.focused ? '' : undefined}\n        data-dirty={dirty ? '' : undefined}\n        data-touched={this.touched ? '' : undefined}\n      >\n        <div\n          class={{\n            'input-control': true,\n            'ds-control-frame': true,\n            'input-control--bordered': this.hasBorder,\n            'input-control--error': this.hasBorder && this.error,\n            'ds-interaction-fill': true,\n            [`ds-control--${this.size}`]: true,\n          }}\n        >\n          {this.icon && (\n            <span class=\"input-control__prefix ds-control-icon-box ds-interaction-fill__content\" aria-hidden=\"true\">\n              <ds-icon name={this.icon} size={iconSize} color=\"inherit\" />\n            </span>\n          )}\n          <input\n            type={this.type}\n            id={inputId}\n            value={this.value}\n            placeholder={this.placeholder}\n            disabled={inactive}\n            readOnly={this.readOnly}\n            required={this.required}\n            autoFocus={this.autoFocus}\n            autoComplete={this.autoComplete}\n            inputMode={this.inputMode || undefined}\n            enterKeyHint={this.enterKeyHint || undefined}\n            class={`native-input ds-control-label-box ds-text--${textVariant.replace('text-', '')} ds-text--regular ds-interaction-fill__content`}\n            aria-label={this.ariaLabel}\n            aria-labelledby={this.ariaLabelledby}\n            aria-describedby={describedBy}\n            aria-invalid={this.error ? 'true' : undefined}\n            onInput={this.handleInput}\n            onFocus={this.handleFocus}\n            onBlur={this.handleBlur}\n          />\n          <span class={{ 'input-control__suffix': true, 'ds-control-icon-box': true, 'input-control__suffix--empty': !this.hasSuffix }}>\n            <slot name=\"suffix\" />\n          </span>\n          {showClear && (\n            <ds-button-unfilled\n              class=\"input-control__clear\"\n              variant=\"icon\"\n              size={CLEAR_BUTTON_SIZE[this.size]}\n              icon=\"CrossCircle\"\n              hasBorder={false}\n              rounded\n              ariaLabel={this.clearLabel}\n              onDsClick={this.handleClear}\n            />\n          )}\n        </div>\n        {showError && (\n          <ds-text\n            class=\"error-text\"\n            as=\"div\"\n            variant=\"text-body-small\"\n            color=\"negative\"\n            textId={this.errorId}\n            role=\"alert\"\n          >\n            {this.errorMessage}\n          </ds-text>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["inputCss","ICON_SIZE","lg","md","sm","xs","CLEAR_BUTTON_SIZE","idCounter","Input","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","generatedId","errorId","value","disabled","readOnly","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","clearLabel","type","inputMode","enterKeyHint","size","width","hasBorder","isInactive","autoFocus","error","ariaLabel","initialValue","formDisabled","hasSuffix","focused","touched","handleInput","e","target","dsChange","emit","handleFocus","handleBlur","handleClear","dsClear","el","querySelector","focus","componentWillLoad","Boolean","syncFormValue","componentDidRender","inactive","setFormControlValue","internals","missing","length","setRequiredValidity","formDisabledCallback","formResetCallback","formStateRestoreCallback","state","restoreStringFormState","setFocus","render","inputId","filled","dirty","showClear","showError","errorMessage","textVariant","CONTROL_TEXT_VARIANT","iconSize","describedBy","ariaDescribedby","undefined","filter","join","h","Host","key","class","controlWidthClass","icon","name","color","id","placeholder","autoComplete","replace","ariaLabelledby","onInput","onFocus","onBlur","variant","rounded","onDsClick","as","textId","role"],"sources":["src/wc/components/Input/Input.css?tag=ds-input&encapsulation=scoped","src/wc/components/Input/Input.tsx"],"sourcesContent":["@import '../../utils/interaction-fill.css';\n@import '../../utils/control-inactive.css';\n@import '../../utils/control-density.css';\n@import '../../utils/control-parts.css';\n@import '../../utils/control-width.css';\n@import '../../utils/field-stack.css';\n@import '../../utils/typography.css';\n@import '../../utils/forced-colors.css';\n\n:host(.input-host) {\n  display: inline-flex;\n  --ds-input-fg: var(--color-foreground-primary);\n  --ds-input-placeholder: var(--color-foreground-secondary);\n  --ds-input-placeholder-active: var(--color-foreground-quaternary);\n  --ds-input-adornment-fg: var(--color-foreground-secondary);\n  --ds-input-border: var(--color-border-secondary);\n}\n\n:host(.ds-control-width--fill),\n:host(.ds-control-width--fill) .input-control {\n  width: 100%;\n}\n\n.input-control {\n  overflow: hidden;\n  background: transparent;\n  border: none;\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n  color: var(--ds-input-fg);\n}\n\n.input-control--bordered {\n  --ds-interaction-border-width: var(--dimension-stroke-width-012);\n  --ds-interaction-border-color: var(--ds-input-border);\n}\n\n.input-control--error {\n  --ds-interaction-border-width: var(--dimension-stroke-width-018);\n  --ds-interaction-border-color: var(--color-border-bold-negative);\n}\n\n.input-control--bordered:focus-within:not(.input-control--error) {\n  --ds-interaction-border-width: var(--dimension-stroke-width-018);\n  --ds-interaction-border-color: var(--color-border-bold-brand);\n}\n\n:host(.ds-control-inactive) .input-control::after {\n  background: transparent;\n}\n\n.native-input {\n  position: relative;\n  z-index: 2;\n  flex: 1 1 auto;\n  min-width: 0;\n  height: 100%;\n  background: transparent;\n  border: none;\n  border-radius: inherit;\n  outline: none;\n  color: var(--ds-input-fg);\n  font-family: inherit;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.native-input:disabled {\n  cursor: not-allowed;\n}\n\n.native-input:read-only:not(:disabled) {\n  cursor: default;\n}\n\n.native-input::placeholder {\n  color: var(--ds-input-placeholder);\n}\n\n.native-input:focus::placeholder {\n  color: var(--ds-input-placeholder-active);\n}\n\n.native-input[type='search']::-webkit-search-cancel-button,\n.native-input[type='search']::-webkit-search-decoration {\n  display: none;\n}\n\n.input-control__prefix,\n.input-control__suffix {\n  position: relative;\n  z-index: 2;\n  color: var(--ds-input-adornment-fg);\n}\n\n.input-control__suffix--empty {\n  display: none;\n}\n\n/* Keep this more specific than ButtonUnfilled's host-level hug alignment so\n   component stylesheet hydration order cannot move the nested action. */\n.input-control > .input-control__clear {\n  position: relative;\n  z-index: 2;\n  flex-shrink: 0;\n  align-self: center;\n}\n\n.input-control.ds-control--lg:has(.input-control__clear),\n.input-control.ds-control--md:has(.input-control__clear),\n.input-control.ds-control--sm:has(.input-control__clear) {\n  padding-right: var(--dimension-space-050);\n}\n\n.input-control.ds-control--xs:has(.input-control__clear) {\n  padding-right: 0;\n}\n\n.error-text {\n  width: 100%;\n}\n\n@media (forced-colors: active) {\n  .input-control--bordered:focus-within:not(.input-control--error)::after {\n    outline-color: var(--ds-forced-color-selected);\n  }\n\n  .input-control--error::after {\n    outline-style: dashed;\n  }\n}\n","import { AttachInternals, Component, Prop, State, Event, EventEmitter, Element, Method, Watch, h, Host } from '@stencil/core';\nimport {\n  controlWidthClass,\n  CONTROL_TEXT_VARIANT,\n  DEFAULT_REQUIRED_MESSAGE,\n  restoreStringFormState,\n  setFormControlValue,\n  setRequiredValidity,\n  type ControlWidth,\n} from '../../utils';\n\nexport type InputType = 'text' | 'email' | 'tel' | 'url' | 'search' | 'password';\nexport type InputSize = 'lg' | 'md' | 'sm' | 'xs';\nexport type InputWidth = ControlWidth;\n\nconst ICON_SIZE: Record<InputSize, 'lg' | 'md' | 'sm' | 'xs'> = {\n  lg: 'lg',\n  md: 'md',\n  sm: 'sm',\n  xs: 'xs',\n};\n\nconst CLEAR_BUTTON_SIZE: Record<InputSize, 'md' | 'sm' | 'xs'> = {\n  lg: 'md',\n  md: 'sm',\n  sm: 'xs',\n  xs: 'xs',\n};\n\nlet idCounter = 0;\n\n@Component({\n  tag: 'ds-input',\n  styleUrl: 'Input.css',\n  scoped: true,\n  formAssociated: true,\n})\nexport class Input {\n  @Element() el!: HTMLElement;\n  @AttachInternals() internals!: ElementInternals;\n\n  private generatedId = `ds-input-${++idCounter}`;\n  private errorId = `${this.generatedId}-error`;\n\n  @Prop({ mutable: true }) value: string = '';\n  @Prop({ reflect: true }) name: string | undefined;\n  @Prop({ reflect: true }) form: string | undefined;\n  @Prop({ reflect: true }) disabled: boolean = false;\n  /** Keeps the value focusable and submittable while preventing edits. */\n  @Prop({ reflect: true }) readOnly: boolean = false;\n  @Prop({ reflect: true }) required: boolean = false;\n  @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n  @Prop() clearLabel: string = 'Clear';\n  @Prop() placeholder: string | undefined;\n  @Prop() type: InputType = 'text';\n  /** Native browser autofill hint. */\n  @Prop({ attribute: 'autocomplete' }) autoComplete: string | undefined;\n  /** Preferred virtual keyboard without changing the value semantics. */\n  @Prop({ attribute: 'inputmode' }) inputMode: string = '';\n  /** Preferred virtual-keyboard action label. */\n  @Prop({ attribute: 'enterkeyhint' }) enterKeyHint: string = '';\n  /** Control density. */\n  @Prop() size: InputSize = 'md';\n  /** Width fit — fill the parent (default) or hug the available content. */\n  @Prop() width: InputWidth = 'fill';\n  /** Show the standard inset border, including focused and invalid strokes. */\n  @Prop() hasBorder: boolean = true;\n  /** Optional leading icon name. */\n  @Prop() icon: string | undefined;\n  @Prop() isInactive: boolean = false;\n  @Prop() autoFocus: boolean = false;\n  @Prop() error: boolean = false;\n  @Prop() errorMessage: string | undefined;\n  /** Associates the internal input with an external <label>. */\n  @Prop() inputId: string | undefined;\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n  @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n  @Prop({ attribute: 'aria-describedby' }) ariaDescribedby: string | undefined;\n\n  @Event() dsChange!: EventEmitter<string>;\n  @Event() dsClear!: EventEmitter<void>;\n\n  private initialValue = '';\n  @State() private formDisabled = false;\n  @State() private hasSuffix = false;\n  @State() private focused = false;\n  @State() private touched = false;\n\n  componentWillLoad() {\n    this.initialValue = this.value;\n    this.hasSuffix = Boolean(this.el.querySelector('[slot=\"suffix\"]'));\n    this.syncFormValue();\n  }\n\n  componentDidRender() {\n    const hasSuffix = Boolean(this.el.querySelector('[slot=\"suffix\"]'));\n    if (hasSuffix !== this.hasSuffix) this.hasSuffix = hasSuffix;\n  }\n\n  @Watch('value')\n  @Watch('disabled')\n  @Watch('isInactive')\n  @Watch('required')\n  syncFormValue() {\n    const inactive = this.isInactive || this.disabled || this.formDisabled;\n    setFormControlValue(this.internals, this.value, { inactive });\n    const missing = this.required && !inactive && this.value.length === 0;\n    setRequiredValidity(this.internals, missing, this.requiredMessage);\n  }\n\n  formDisabledCallback(disabled: boolean) {\n    this.formDisabled = disabled;\n    this.syncFormValue();\n  }\n\n  formResetCallback() {\n    this.value = this.initialValue;\n  }\n\n  formStateRestoreCallback(state: string | File | FormData | null) {\n    this.value = restoreStringFormState(state);\n  }\n\n  @Method()\n  async setFocus() {\n    this.el.querySelector('input')?.focus();\n  }\n\n  private handleInput = (e: Event) => {\n    this.value = (e.target as HTMLInputElement).value;\n    this.dsChange.emit(this.value);\n  };\n\n  private handleFocus = () => {\n    this.focused = true;\n  };\n\n  private handleBlur = () => {\n    this.focused = false;\n    this.touched = true;\n  };\n\n  private handleClear = () => {\n    this.value = '';\n    this.dsChange.emit('');\n    this.dsClear.emit();\n    this.el.querySelector('input')?.focus();\n  };\n\n  render() {\n    const inputId = this.inputId ?? this.generatedId;\n    const inactive = this.isInactive || this.disabled || this.formDisabled;\n    const filled = this.value.length > 0;\n    const dirty = this.value !== this.initialValue;\n    const showClear = this.type === 'search' && filled && !inactive && !this.readOnly;\n    const showError = this.error && Boolean(this.errorMessage);\n    const textVariant = CONTROL_TEXT_VARIANT[this.size];\n    const iconSize = ICON_SIZE[this.size];\n\n    const describedBy = [\n      this.ariaDescribedby,\n      showError ? this.errorId : undefined,\n    ].filter(Boolean).join(' ') || undefined;\n\n    return (\n      <Host\n        class={{\n          'input-host': true,\n          'ds-field-stack': true,\n          'ds-control-inactive': inactive,\n          [`ds-control--${this.size}`]: true,\n          ...controlWidthClass(this.width),\n        }}\n        data-disabled={inactive ? '' : undefined}\n        data-readonly={this.readOnly ? '' : undefined}\n        data-required={this.required ? '' : undefined}\n        data-invalid={this.error ? '' : undefined}\n        data-filled={filled ? '' : undefined}\n        data-focused={this.focused ? '' : undefined}\n        data-dirty={dirty ? '' : undefined}\n        data-touched={this.touched ? '' : undefined}\n      >\n        <div\n          class={{\n            'input-control': true,\n            'ds-control-frame': true,\n            'input-control--bordered': this.hasBorder,\n            'input-control--error': this.hasBorder && this.error,\n            'ds-interaction-fill': true,\n            [`ds-control--${this.size}`]: true,\n          }}\n        >\n          {this.icon && (\n            <span class=\"input-control__prefix ds-control-icon-box ds-interaction-fill__content\" aria-hidden=\"true\">\n              <ds-icon name={this.icon} size={iconSize} color=\"inherit\" />\n            </span>\n          )}\n          <input\n            type={this.type}\n            id={inputId}\n            value={this.value}\n            placeholder={this.placeholder}\n            disabled={inactive}\n            readOnly={this.readOnly}\n            required={this.required}\n            autoFocus={this.autoFocus}\n            autoComplete={this.autoComplete}\n            inputMode={this.inputMode || undefined}\n            enterKeyHint={this.enterKeyHint || undefined}\n            class={`native-input ds-control-label-box ds-text--${textVariant.replace('text-', '')} ds-text--regular ds-interaction-fill__content`}\n            aria-label={this.ariaLabel}\n            aria-labelledby={this.ariaLabelledby}\n            aria-describedby={describedBy}\n            aria-invalid={this.error ? 'true' : undefined}\n            onInput={this.handleInput}\n            onFocus={this.handleFocus}\n            onBlur={this.handleBlur}\n          />\n          <span class={{ 'input-control__suffix': true, 'ds-control-icon-box': true, 'input-control__suffix--empty': !this.hasSuffix }}>\n            <slot name=\"suffix\" />\n          </span>\n          {showClear && (\n            <ds-button-unfilled\n              class=\"input-control__clear\"\n              variant=\"icon\"\n              size={CLEAR_BUTTON_SIZE[this.size]}\n              icon=\"CrossCircle\"\n              hasBorder={false}\n              rounded\n              ariaLabel={this.clearLabel}\n              onDsClick={this.handleClear}\n            />\n          )}\n        </div>\n        {showError && (\n          <ds-text\n            class=\"error-text\"\n            as=\"div\"\n            variant=\"text-body-small\"\n            color=\"negative\"\n            textId={this.errorId}\n            role=\"alert\"\n          >\n            {this.errorMessage}\n          </ds-text>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,2 +1,2 @@
-import{p as e,H as s,c as t,h as r,a as o,t as a}from"./index.js";import{S as i}from"./p-CJq3n5kA.js";import{r as l}from"./p-BMc0DE59.js";import{d}from"./p-D8nnhQNJ.js";import{d as n}from"./p--z-DWRkg.js";import{d as c}from"./p-BFfLvMZd.js";import{d as h}from"./p-Ca-I2UnB.js";import{d as f}from"./p-DZFilC--.js";import{d as g}from"./p-CtSxm6PI.js";const m=()=>`@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 v=()=>`.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 u=24;const p=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsReachStart=t(this,"dsReachStart");this.busy=false;this.autoFollow=true;this.defaultPosition="last-anchor";this.messagesLabel="Messages";this.showScrollToLatest=false;this.following=true;this.followReleased=false;this.atStart=false;this.programmatic=false;this.transcriptChildren=[];this.knownTranscriptElements=new Set;this.knownTurnAnchors=new Set;this.turnClearance=0;this.prependReconciliation=0;this.handleTranscriptChange=()=>{const e=this.getTranscriptChildren();const s=this.transcriptChildren;const t=this.knownTranscriptElements.size>0;const r=new Set(this.knownTranscriptElements);const o=[...e].reverse().find(((s,t)=>{if(!s.matches("ds-message[scroll-anchor]")||this.knownTurnAnchors.has(s)){return false}const r=e.length-t-1;return e.slice(r+1).every((e=>!this.knownTranscriptElements.has(e)))}));e.forEach((e=>{this.knownTranscriptElements.add(e);if(e.matches("ds-message[scroll-anchor]")){this.knownTurnAnchors.add(e)}}));if(!s.length){this.transcriptChildren=e;if(o&&t){requestAnimationFrame((()=>this.positionNewTurn(o)))}return}const a=e.findIndex((e=>r.has(e)));const i=e.filter((e=>!r.has(e)));const l=e.length>s.length&&s.every(((t,r)=>e[e.length-s.length+r]===t))||!o&&i.length>0&&a>0&&i.every((s=>e.indexOf(s)<a));this.transcriptChildren=e;if(l){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,i)}}this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync();return}if(o){requestAnimationFrame((()=>this.positionNewTurn(o)))}};this.handleTranscriptSlotChange=()=>this.handleTranscriptChange();this.handleScroll=()=>{if(!this.viewport)return;this.scrollOverlayController?.sync();this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();if(this.programmatic)return;this.following=this.isAtLiveEdge();this.followReleased=!this.following;this.showScrollToLatest=!this.following;const e=this.viewport.scrollTop<=u;if(e&&!this.atStart)this.dsReachStart.emit();this.atStart=e};this.releaseFollow=()=>{this.prependReconciliation+=1;this.following=false;this.followReleased=true;this.showScrollToLatest=true};this.handleSelectionChange=()=>{const e=document.getSelection();if(e&&!e.isCollapsed&&e.anchorNode&&this.el.contains(e.anchorNode)){this.following=false;this.followReleased=true;this.showScrollToLatest=!this.isAtLiveEdge()}}}componentDidLoad(){this.transcriptChildren=this.getTranscriptChildren();this.transcriptChildren.forEach((e=>{this.knownTranscriptElements.add(e);if(e.matches("ds-message[scroll-anchor]")){this.knownTurnAnchors.add(e)}}));this.rememberFirstChildTop();this.connectObservers();requestAnimationFrame((()=>this.applyDefaultPosition()));document.addEventListener("selectionchange",this.handleSelectionChange)}disconnectedCallback(){this.prependReconciliation+=1;this.scrollOverlayController?.disconnect();this.mutationObserver?.disconnect();if(this.programmaticTimer)clearTimeout(this.programmaticTimer);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.following=false;this.followReleased=true;this.showScrollToLatest=true;s.scrollIntoView({block:"start",behavior:this.motionBehavior()});return true}async scrollToStart(){this.scrollTo(0);this.following=false;this.followReleased=true;this.showScrollToLatest=Boolean(this.viewport&&this.viewport.scrollHeight>this.viewport.clientHeight)}async scrollToEnd(){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)}connectObservers(){if(!this.viewport||!this.content||!this.overlay)return;this.scrollOverlayController=new i({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}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 r=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 r.length>t.length?r: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 r=++this.prependReconciliation;const o=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(o).then((()=>{requestAnimationFrame((()=>{if(r!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);requestAnimationFrame((()=>{if(r!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync()}))}))}))}positionNewTurn(e){if(!this.viewport)return;this.activeTurnAnchor=e;this.syncTurnClearance();requestAnimationFrame((()=>this.finishPositionNewTurn(e)))}finishPositionNewTurn(e){if(!this.viewport||!e.isConnected)return;const s=this.viewport.getBoundingClientRect();const t=e.getBoundingClientRect().top-s.top+this.viewport.scrollTop;const r=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const o=l(r,"var(--dimension-space-800)");const a=Math.max(this.viewport.scrollHeight-this.viewport.clientHeight,0);const i=Math.min(Math.max(t-o,0),a);this.following=a-i<=u;this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.programmatic=true;this.viewport.scrollTop=i;requestAnimationFrame((()=>{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 r=s.getBoundingClientRect();const o=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const a=l(o,"var(--dimension-space-800)");const i=Math.max(r.bottom-t.top,0);const d=Math.max(Math.ceil(this.viewport.clientHeight-a-i),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;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<=u}render(){return r(o,{key:"0a8c9ae379392c3bd9ec71cc5d13d88ac061c60b"},r("div",{key:"9be5bf7cc9b426c459952b9c68b9ad1a3c42a0ea",class:"message-scroller"},r("div",{key:"5a37fe790bbad857b6f7d7642845bf2e439cfbbc",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()}}},r("div",{key:"da8fb472c0994d2e030d499b321d40afd53ba28f",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},r("slot",{key:"dbc2cfa9e4809d93fd7f3750e4ce0fad23587018",ref:e=>{this.transcriptSlot=e},onSlotchange:this.handleTranscriptSlotChange}))),r("div",{key:"b4e6824f51b894b9c669085e0cda064c38a0cc70",class:"message-scroller__overlay",ref:e=>{this.overlay=e}},r("div",{key:"718b32e254beb7e2d06237bb55017325549c8e19",class:"message-scroller__overlay-stack"},r("div",{key:"5d4733b1c0d39971b282d63228b19c1cfeb78eb2",class:"message-scroller__interaction"},r("slot",{key:"6710679a181e015d81dc6cdacc7aa746c3816957",name:"interaction"})),r("div",{key:"2c393063337c06ac00f4e55b91b4c5f946234f3d",class:"message-scroller__overlay-content"},r("slot",{key:"2a42744394df7b882b9ced50e87a68bb69b40aa7",name:"overlay"})))),this.showScrollToLatest?r("div",{class:"message-scroller__control ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale"},r("ds-tooltip",{label:"Scroll to latest message",side:"top",size:"sm"},r("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 m()+v()}},[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 b(){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),p)}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}}))}b();const k=p;const w=b;export{k as DsMessageScroller,w as defineCustomElement};
+import{p as e,H as s,c as t,h as r,a as o,t as a}from"./index.js";import{S as i}from"./p-CJq3n5kA.js";import{r as l}from"./p-BMc0DE59.js";import{d}from"./p-D8nnhQNJ.js";import{d as n}from"./p--z-DWRkg.js";import{d as c}from"./p-BFfLvMZd.js";import{d as h}from"./p-Ca-I2UnB.js";import{d as f}from"./p-DZFilC--.js";import{d as g}from"./p-CtSxm6PI.js";const m=()=>`@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 v=()=>`.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 u=24;const p=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsReachStart=t(this,"dsReachStart");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.handleTranscriptChange=()=>{const e=this.getTranscriptChildren();const s=this.transcriptChildren;const t=this.knownTranscriptElements.size>0;const r=new Set(this.knownTranscriptElements);const o=[...e].reverse().find(((s,t)=>{if(!s.matches("ds-message[scroll-anchor]")||this.knownTurnAnchors.has(s)){return false}const r=e.length-t-1;return e.slice(r+1).every((e=>!this.knownTranscriptElements.has(e)))}));e.forEach((e=>{this.knownTranscriptElements.add(e);if(e.matches("ds-message[scroll-anchor]")){this.knownTurnAnchors.add(e)}}));if(!s.length){this.transcriptChildren=e;if(o&&t){requestAnimationFrame((()=>this.positionNewTurn(o)))}return}const a=e.findIndex((e=>r.has(e)));const i=e.filter((e=>!r.has(e)));const l=e.length>s.length&&s.every(((t,r)=>e[e.length-s.length+r]===t))||!o&&i.length>0&&a>0&&i.every((s=>e.indexOf(s)<a));this.transcriptChildren=e;if(l){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,i)}}this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync();return}if(o){requestAnimationFrame((()=>this.positionNewTurn(o)))}};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<=u;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.transcriptChildren=this.getTranscriptChildren();this.transcriptChildren.forEach((e=>{this.knownTranscriptElements.add(e);if(e.matches("ds-message[scroll-anchor]")){this.knownTurnAnchors.add(e)}}));this.rememberFirstChildTop();this.connectObservers();requestAnimationFrame((()=>this.applyDefaultPosition()));document.addEventListener("selectionchange",this.handleSelectionChange)}disconnectedCallback(){this.prependReconciliation+=1;this.scrollOverlayController?.disconnect();this.mutationObserver?.disconnect();if(this.programmaticTimer)clearTimeout(this.programmaticTimer);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)}connectObservers(){if(!this.viewport||!this.content||!this.overlay)return;this.scrollOverlayController=new i({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 r=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 r.length>t.length?r: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 r=++this.prependReconciliation;const o=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(o).then((()=>{requestAnimationFrame((()=>{if(r!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);requestAnimationFrame((()=>{if(r!==this.prependReconciliation)return;this.reconcilePrependPosition(e,s);this.rememberFirstChildTop();this.rememberActiveTurnAnchorTop();this.scrollOverlayController?.sync()}))}))}))}positionNewTurn(e){if(!this.viewport)return;this.activeTurnAnchor=e;this.syncTurnClearance();requestAnimationFrame((()=>this.finishPositionNewTurn(e)))}finishPositionNewTurn(e){if(!this.viewport||!e.isConnected)return;const s=this.viewport.getBoundingClientRect();const t=e.getBoundingClientRect().top-s.top+this.viewport.scrollTop;const r=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const o=l(r,"var(--dimension-space-800)");const a=Math.max(this.viewport.scrollHeight-this.viewport.clientHeight,0);const i=Math.min(Math.max(t-o,0),a);this.following=a-i<=u;this.followReleased=!this.following;this.showScrollToLatest=!this.following;this.programmatic=true;this.viewport.scrollTop=i;requestAnimationFrame((()=>{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 r=s.getBoundingClientRect();const o=getComputedStyle(this.el).getPropertyValue("--ds-message-scroller-anchor-offset").trim();const a=l(o,"var(--dimension-space-800)");const i=Math.max(r.bottom-t.top,0);const d=Math.max(Math.ceil(this.viewport.clientHeight-a-i),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<=u}render(){return r(o,{key:"2b24fa377b7ab4634b6013a07a26de5c41e73081"},r("div",{key:"62756c2da5d22c1196a87e254f6667248a3c5c6f",class:"message-scroller"},r("div",{key:"69424395330947fa9c8b337303be949784cce30f",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()}}},r("div",{key:"f2e7d4816eeb6e9146c6feb848d25e26c1b0caeb",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},r("slot",{key:"07a14ba3f96ea801ffd519b91dd2ce0f8c34895d",ref:e=>{this.transcriptSlot=e},onSlotchange:this.handleTranscriptSlotChange}))),r("div",{key:"f2129cf319fdf8dc9116710b5898f5240797d00d",class:"message-scroller__overlay",ref:e=>{this.overlay=e}},r("div",{key:"d621d9770f2851bb1407e6d65420371dad534f02",class:"message-scroller__overlay-stack"},r("div",{key:"849efc67d66251235fc583e439f45704b3110df8",class:"message-scroller__interaction"},r("slot",{key:"e33aa4bb0cd289189a8cfcc1137837d3ff93d355",name:"interaction"})),r("div",{key:"50eac1d606cf25c9ce773a72d01c66cbcd2f5119",class:"message-scroller__overlay-content"},r("slot",{key:"f05007f7d601c10be815c9d427d89752ab58490c",name:"overlay"})))),this.showScrollToLatest?r("div",{class:"message-scroller__control ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale"},r("ds-tooltip",{label:"Scroll to latest message",side:"top",size:"sm"},r("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 m()+v()}},[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 b(){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),p)}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}}))}b();const k=p;const w=b;export{k as DsMessageScroller,w as defineCustomElement};
 //# sourceMappingURL=ds-message-scroller.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["scrollEdgeFadeCss","messageScrollerCss","LIVE_EDGE_THRESHOLD","MessageScroller","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","busy","autoFollow","defaultPosition","messagesLabel","showScrollToLatest","following","followReleased","atStart","programmatic","transcriptChildren","knownTranscriptElements","Set","knownTurnAnchors","turnClearance","prependReconciliation","handleTranscriptChange","current","getTranscriptChildren","previous","hadKnownTranscript","size","previouslyKnown","appendedAnchor","reverse","find","element","reverseIndex","matches","has","index","length","slice","every","next","forEach","add","requestAnimationFrame","positionNewTurn","firstKnownIndex","findIndex","newTranscript","filter","prepended","indexOf","viewport","preservedElement","activeTurnAnchor","isConnected","preservedTop","activeTurnAnchorViewportTop","firstChildViewportTop","undefined","reconcilePrependPosition","schedulePrependReconciliation","rememberFirstChildTop","rememberActiveTurnAnchorTop","scrollOverlayController","sync","handleTranscriptSlotChange","handleScroll","isAtLiveEdge","nextAtStart","scrollTop","dsReachStart","emit","releaseFollow","handleSelectionChange","selection","document","getSelection","isCollapsed","anchorNode","el","contains","componentDidLoad","connectObservers","applyDefaultPosition","addEventListener","disconnectedCallback","disconnect","mutationObserver","programmaticTimer","clearTimeout","removeEventListener","scrollToMessage","id","message","Array","from","querySelectorAll","item","messageId","getAttribute","scrollIntoView","block","behavior","motionBehavior","scrollToStart","scrollTo","Boolean","scrollHeight","clientHeight","scrollToEnd","matchMedia","top","setTimeout","content","overlay","ScrollOverlayController","host","overlayContentSelector","onGeometryChange","handleContentGrowth","connect","MutationObserver","observe","childList","subtree","characterData","syncTurnClearance","nextHeight","first","getBoundingClientRect","assigned","transcriptSlot","assignedElements","assignedTranscript","queriedTranscript","closest","viewportTop","nextTop","generation","pending","flatMap","map","componentOnReady","call","catch","promise","Promise","all","then","anchor","finishPositionNewTurn","viewportRect","anchorTop","customOffset","getComputedStyle","getPropertyValue","trim","offset","resolveCssLengthPx","max","Math","target","min","children","last","anchorRect","lastRect","contentAfterAnchor","bottom","clearance","ceil","style","setProperty","anchors","render","h","Host","key","class","ref","role","tabIndex","onScroll","onPointerDown","event","pointerType","onWheel","onKeyDown","includes","onSlotchange","name","label","side","variant","icon","rounded","hasBorder","onDsClick"],"sources":["src/wc/utils/scroll-edge-fade.css?tag=ds-message-scroller&encapsulation=scoped","src/wc/components/MessageScroller/MessageScroller.css?tag=ds-message-scroller&encapsulation=scoped","src/wc/components/MessageScroller/MessageScroller.tsx"],"sourcesContent":["/**\n * Scroll-edge alpha fade — the single edge-fade utility for overflow containers.\n * Masks scrolling content to transparent so flat surfaces, shell gradients, and\n * images show through.\n *\n * Static fades are the default (PanelNav intentionally keeps its bottom fade).\n * Add `.scroll-edge-fade--scroll-aware` to reveal/hide each configured edge from\n * the container's own scroll position without JavaScript. Browsers without CSS\n * scroll-driven animations retain the configured static fades.\n *\n * @see scroll-edge-fade.ts — `scrollEdgeFadeClassMap`, `isScrollAtEdge`, size helpers.\n */\n\n@property --ds-scroll-edge-fade-top {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@property --ds-scroll-edge-fade-bottom {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@property --ds-scroll-edge-fade-left {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@property --ds-scroll-edge-fade-right {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@keyframes ds-scroll-edge-fade-reveal-top {\n  from { --ds-scroll-edge-fade-top: 0px; }\n  to { --ds-scroll-edge-fade-top: var(--ds-scroll-edge-fade-target-top); }\n}\n\n@keyframes ds-scroll-edge-fade-reveal-bottom {\n  from { --ds-scroll-edge-fade-bottom: var(--ds-scroll-edge-fade-target-bottom); }\n  to { --ds-scroll-edge-fade-bottom: 0px; }\n}\n\n@keyframes ds-scroll-edge-fade-reveal-left {\n  from { --ds-scroll-edge-fade-left: 0px; }\n  to { --ds-scroll-edge-fade-left: var(--ds-scroll-edge-fade-target-left); }\n}\n\n@keyframes ds-scroll-edge-fade-reveal-right {\n  from { --ds-scroll-edge-fade-right: var(--ds-scroll-edge-fade-target-right); }\n  to { --ds-scroll-edge-fade-right: 0px; }\n}\n\n/* Mask gradients use #000 / transparent as alpha stops — not theme colors. */\n/* stylelint-disable color-no-hex */\n\n.scroll-edge-fade {\n  --ds-scroll-edge-fade-size: var(--dimension-size-600);\n  --ds-scroll-edge-fade-reveal-distance: var(--dimension-size-800);\n  --ds-scroll-edge-fade-target-top: 0px;\n  --ds-scroll-edge-fade-target-bottom: 0px;\n  --ds-scroll-edge-fade-target-left: 0px;\n  --ds-scroll-edge-fade-target-right: 0px;\n  --ds-scroll-edge-fade-top: var(--ds-scroll-edge-fade-target-top);\n  --ds-scroll-edge-fade-bottom: var(--ds-scroll-edge-fade-target-bottom);\n  --ds-scroll-edge-fade-left: var(--ds-scroll-edge-fade-target-left);\n  --ds-scroll-edge-fade-right: var(--ds-scroll-edge-fade-target-right);\n  --ds-scroll-edge-fade-block-mask: linear-gradient(\n    to bottom,\n    transparent 0,\n    #000 var(--ds-scroll-edge-fade-top),\n    #000 calc(100% - var(--ds-scroll-edge-fade-bottom)),\n    transparent 100%\n  );\n  --ds-scroll-edge-fade-inline-mask: linear-gradient(\n    to right,\n    transparent 0,\n    #000 var(--ds-scroll-edge-fade-left),\n    #000 calc(100% - var(--ds-scroll-edge-fade-right)),\n    transparent 100%\n  );\n\n  /* Intersecting the block and inline masks lets every edge compose correctly. */\n  -webkit-mask-image:\n    var(--ds-scroll-edge-fade-block-mask),\n    var(--ds-scroll-edge-fade-inline-mask);\n  mask-image:\n    var(--ds-scroll-edge-fade-block-mask),\n    var(--ds-scroll-edge-fade-inline-mask);\n  -webkit-mask-composite: source-in;\n  mask-composite: intersect;\n  -webkit-mask-repeat: no-repeat;\n  mask-repeat: no-repeat;\n  -webkit-mask-size: 100% 100%;\n  mask-size: 100% 100%;\n}\n\n.scroll-edge-fade--top {\n  --ds-scroll-edge-fade-target-top: var(--ds-scroll-edge-fade-size);\n}\n\n.scroll-edge-fade--bottom {\n  --ds-scroll-edge-fade-target-bottom: var(--ds-scroll-edge-fade-size);\n}\n\n.scroll-edge-fade--left {\n  --ds-scroll-edge-fade-target-left: var(--ds-scroll-edge-fade-size);\n}\n\n.scroll-edge-fade--right {\n  --ds-scroll-edge-fade-target-right: var(--ds-scroll-edge-fade-size);\n}\n\n/* Manual per-edge state remains available when scroll state already lives in JS. */\n.scroll-edge-fade--top-at-edge {\n  --ds-scroll-edge-fade-target-top: 0px;\n}\n\n.scroll-edge-fade--bottom-at-edge {\n  --ds-scroll-edge-fade-target-bottom: 0px;\n}\n\n.scroll-edge-fade--left-at-edge {\n  --ds-scroll-edge-fade-target-left: 0px;\n}\n\n.scroll-edge-fade--right-at-edge {\n  --ds-scroll-edge-fade-target-right: 0px;\n}\n\n@supports (animation-timeline: scroll()) {\n  .scroll-edge-fade--scroll-aware {\n    animation-name:\n      ds-scroll-edge-fade-reveal-top,\n      ds-scroll-edge-fade-reveal-bottom,\n      ds-scroll-edge-fade-reveal-left,\n      ds-scroll-edge-fade-reveal-right;\n    /* stylelint-disable-next-line declaration-property-value-disallowed-list -- scroll timelines require a nonzero sentinel duration; elapsed time is ignored. */\n    animation-duration: 1ms;\n    animation-timing-function: ease-in-out;\n    animation-fill-mode: both;\n    animation-timeline: scroll(self y), scroll(self y), scroll(self x), scroll(self x);\n    animation-range:\n      0 var(--ds-scroll-edge-fade-reveal-distance),\n      calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%,\n      0 var(--ds-scroll-edge-fade-reveal-distance),\n      calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .scroll-edge-fade--scroll-aware {\n      animation: none;\n    }\n  }\n}\n\n.scroll-edge-fade--at-end,\n.scroll-edge-fade--hidden {\n  -webkit-mask-image: none;\n  mask-image: none;\n}\n\n/**\n * Masks a long content element against a scrollport-relative block window.\n * The owner updates the start/end offsets as the scrollport moves. Keeping the\n * mask on the content instead of the overflow element leaves native scrollbars\n * outside the fade.\n */\n.scroll-edge-fade--block-window {\n  --ds-scroll-edge-fade-window-start: 100%;\n  --ds-scroll-edge-fade-window-end: 100%;\n\n  -webkit-mask-image: linear-gradient(\n    to bottom,\n    #000 0,\n    #000 var(--ds-scroll-edge-fade-window-start),\n    transparent var(--ds-scroll-edge-fade-window-end)\n  );\n  mask-image: linear-gradient(\n    to bottom,\n    #000 0,\n    #000 var(--ds-scroll-edge-fade-window-start),\n    transparent var(--ds-scroll-edge-fade-window-end)\n  );\n  -webkit-mask-repeat: no-repeat;\n  mask-repeat: no-repeat;\n}\n\n/* stylelint-enable color-no-hex */\n","@import '../../styles/control-elevation.css';\n\n:host {\n  --ds-message-scroller-anchor-offset: var(--dimension-space-800);\n\n  display: block;\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n}\n\n.message-scroller {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n}\n\n.message-scroller__viewport {\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  overflow: auto;\n  overflow-anchor: none;\n  overscroll-behavior: contain;\n  box-sizing: border-box;\n}\n\n.message-scroller__viewport:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-border-bold-brand);\n  outline-offset: calc(-1 * var(--dimension-stroke-width-025));\n}\n\n.message-scroller__content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-300);\n  width: 100%;\n  max-width: var(\n    --ds-message-scroller-content-max-width,\n    var(--dimension-panel-width-2xl)\n  );\n  min-height: 100%;\n  margin-inline: auto;\n  padding-block-start: var(--dimension-space-200);\n  padding-inline: var(--dimension-space-200);\n  padding-block-end: max(\n    calc(var(--dimension-space-200) + var(--ds-scroll-overlay-block-size, 0px)),\n    var(--ds-message-scroller-turn-clearance, 0px)\n  );\n  box-sizing: border-box;\n}\n\n.message-scroller__overlay {\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: var(--dimension-z-index-floating);\n}\n\n.message-scroller__overlay-stack {\n  display: grid;\n  width: 100%;\n}\n\n.message-scroller__interaction,\n.message-scroller__overlay-content {\n  min-width: 0;\n}\n\n.message-scroller__control {\n  position: absolute;\n  bottom: calc(\n    var(--ds-scroll-overlay-content-block-size, 0px) + var(--dimension-space-200)\n  );\n  left: 50%;\n  z-index: var(--dimension-z-index-floating);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--dimension-radius-half);\n  background: var(--color-background-transparent);\n  transform: translateX(-50%);\n  -webkit-backdrop-filter: blur(var(--effect-blur-sm));\n  backdrop-filter: blur(var(--effect-blur-sm));\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from '@stencil/core';\nimport type { MessageScrollerPosition } from '../conversation-types';\nimport { ScrollOverlayController } from '../../utils/scroll-overlay-controller';\nimport { resolveCssLengthPx } from '../../utils/resolve-css-length-px';\n\nconst LIVE_EDGE_THRESHOLD = 24;\n\n@Component({\n  tag: 'ds-message-scroller',\n  styleUrl: 'MessageScroller.css',\n  styleUrls: ['../../utils/scroll-edge-fade.css'],\n  scoped: true,\n})\nexport class MessageScroller {\n  @Element() el!: HTMLElement;\n\n  @Prop() busy: boolean = false;\n  @Prop() autoFollow: boolean = true;\n  @Prop() defaultPosition: MessageScrollerPosition = 'last-anchor';\n  @Prop() messagesLabel: string = 'Messages';\n\n  @Event() dsReachStart!: EventEmitter<void>;\n\n  @State() private showScrollToLatest = false;\n\n  private viewport?: HTMLElement;\n  private content?: HTMLElement;\n  private overlay?: HTMLElement;\n  private transcriptSlot?: HTMLSlotElement;\n  private scrollOverlayController?: ScrollOverlayController;\n  private mutationObserver?: MutationObserver;\n  private following = true;\n  private followReleased = false;\n  private atStart = false;\n  private programmatic = false;\n  private programmaticTimer?: ReturnType<typeof setTimeout>;\n  private transcriptChildren: HTMLElement[] = [];\n  private knownTranscriptElements = new Set<HTMLElement>();\n  private knownTurnAnchors = new Set<HTMLElement>();\n  private firstChildViewportTop?: number;\n  private activeTurnAnchor?: HTMLElement;\n  private activeTurnAnchorViewportTop?: number;\n  private turnClearance = 0;\n  private prependReconciliation = 0;\n\n  componentDidLoad() {\n    this.transcriptChildren = this.getTranscriptChildren();\n    this.transcriptChildren.forEach(element => {\n      this.knownTranscriptElements.add(element);\n      if (element.matches('ds-message[scroll-anchor]')) {\n        this.knownTurnAnchors.add(element);\n      }\n    });\n    this.rememberFirstChildTop();\n    this.connectObservers();\n    requestAnimationFrame(() => this.applyDefaultPosition());\n    document.addEventListener('selectionchange', this.handleSelectionChange);\n  }\n\n  disconnectedCallback() {\n    this.prependReconciliation += 1;\n    this.scrollOverlayController?.disconnect();\n    this.mutationObserver?.disconnect();\n    if (this.programmaticTimer) clearTimeout(this.programmaticTimer);\n    document.removeEventListener('selectionchange', this.handleSelectionChange);\n  }\n\n  @Method()\n  async scrollToMessage(id: string): Promise<boolean> {\n    const message = Array.from(\n      this.el.querySelectorAll<HTMLElement & { messageId?: string }>('ds-message')\n    ).find(item => item.messageId === id || item.getAttribute('message-id') === id);\n    if (!message) return false;\n    this.following = false;\n    this.followReleased = true;\n    this.showScrollToLatest = true;\n    message.scrollIntoView({ block: 'start', behavior: this.motionBehavior() });\n    return true;\n  }\n\n  @Method()\n  async scrollToStart() {\n    this.scrollTo(0);\n    this.following = false;\n    this.followReleased = true;\n    this.showScrollToLatest = Boolean(\n      this.viewport && this.viewport.scrollHeight > this.viewport.clientHeight\n    );\n  }\n\n  @Method()\n  async scrollToEnd() {\n    this.following = true;\n    this.followReleased = false;\n    this.showScrollToLatest = false;\n    this.scrollTo(this.viewport?.scrollHeight ?? 0);\n  }\n\n  private motionBehavior(): ScrollBehavior {\n    return matchMedia('(prefers-reduced-motion: reduce)').matches ? 'auto' : 'smooth';\n  }\n\n  private scrollTo(top: number) {\n    if (!this.viewport) return;\n    this.programmatic = true;\n    const behavior = this.motionBehavior();\n    this.viewport.scrollTo({ top, behavior });\n    if (this.programmaticTimer) clearTimeout(this.programmaticTimer);\n    this.programmaticTimer = setTimeout(() => {\n      this.programmatic = false;\n      this.programmaticTimer = undefined;\n      if (this.following) {\n        this.viewport!.scrollTop = top;\n        this.showScrollToLatest = false;\n      }\n    }, behavior === 'smooth' ? 600 : 0);\n  }\n\n  private connectObservers() {\n    if (!this.viewport || !this.content || !this.overlay) return;\n    this.scrollOverlayController = new ScrollOverlayController({\n      host: this.el,\n      viewport: this.viewport,\n      content: this.content,\n      overlay: this.overlay,\n      overlayContentSelector: '.message-scroller__overlay-stack',\n      onGeometryChange: () => this.handleContentGrowth(),\n    });\n    this.scrollOverlayController.connect();\n    this.mutationObserver = new MutationObserver(() => {\n      this.handleTranscriptChange();\n      this.handleContentGrowth();\n    });\n    this.mutationObserver.observe(this.el, {\n      childList: true,\n      subtree: true,\n      characterData: true,\n    });\n  }\n\n  private handleContentGrowth() {\n    if (!this.viewport) return;\n    this.syncTurnClearance();\n    const nextHeight = this.viewport.scrollHeight;\n    if (this.autoFollow && this.following && !this.followReleased) {\n      this.viewport.scrollTop = nextHeight;\n    }\n    this.showScrollToLatest = !this.following && !this.isAtLiveEdge();\n    this.scrollOverlayController?.sync();\n  }\n\n  private rememberFirstChildTop() {\n    if (!this.viewport) return;\n    const first = this.getTranscriptChildren()[0];\n    this.firstChildViewportTop = first\n      ? first.getBoundingClientRect().top - this.viewport.getBoundingClientRect().top\n      : undefined;\n  }\n\n  private getTranscriptChildren(): HTMLElement[] {\n    const assigned = this.transcriptSlot?.assignedElements() ?? [];\n    const assignedTranscript = assigned.filter(\n      (element): element is HTMLElement =>\n        element instanceof HTMLElement &&\n        (element.matches('ds-message') || element.matches('ds-agent-response')),\n    );\n    const queriedTranscript = Array.from(\n      this.el.querySelectorAll<HTMLElement>('ds-message, ds-agent-response'),\n    ).filter(element => {\n      if (\n        element.closest(\n          '.message-scroller__interaction, .message-scroller__overlay-content',\n        )\n      ) {\n        return false;\n      }\n      if (element.matches('ds-agent-response')) return true;\n      return !element.closest('ds-agent-response');\n    });\n    return queriedTranscript.length > assignedTranscript.length\n      ? queriedTranscript\n      : assignedTranscript;\n  }\n\n  private handleTranscriptChange = () => {\n    const current = this.getTranscriptChildren();\n    const previous = this.transcriptChildren;\n    const hadKnownTranscript = this.knownTranscriptElements.size > 0;\n    const previouslyKnown = new Set(this.knownTranscriptElements);\n    const appendedAnchor = [...current].reverse().find((element, reverseIndex) => {\n      if (\n        !element.matches('ds-message[scroll-anchor]') ||\n        this.knownTurnAnchors.has(element)\n      ) {\n        return false;\n      }\n      const index = current.length - reverseIndex - 1;\n      return current\n        .slice(index + 1)\n        .every(next => !this.knownTranscriptElements.has(next));\n    });\n    current.forEach(element => {\n      this.knownTranscriptElements.add(element);\n      if (element.matches('ds-message[scroll-anchor]')) {\n        this.knownTurnAnchors.add(element);\n      }\n    });\n    if (!previous.length) {\n      this.transcriptChildren = current;\n      if (appendedAnchor && hadKnownTranscript) {\n        requestAnimationFrame(() => this.positionNewTurn(appendedAnchor));\n      }\n      return;\n    }\n\n    const firstKnownIndex = current.findIndex(element => previouslyKnown.has(element));\n    const newTranscript = current.filter(element => !previouslyKnown.has(element));\n    const prepended =\n      (current.length > previous.length && previous.every(\n        (element, index) => current[current.length - previous.length + index] === element,\n      )) ||\n      (!appendedAnchor &&\n        newTranscript.length > 0 &&\n        firstKnownIndex > 0 &&\n        newTranscript.every(element => current.indexOf(element) < firstKnownIndex));\n\n    this.transcriptChildren = current;\n    if (prepended) {\n      if (this.viewport) {\n        const preservedElement = this.activeTurnAnchor?.isConnected\n          ? this.activeTurnAnchor\n          : previous[0];\n        const preservedTop = this.activeTurnAnchor?.isConnected\n          ? this.activeTurnAnchorViewportTop\n          : this.firstChildViewportTop;\n        if (preservedElement && preservedTop !== undefined) {\n          this.reconcilePrependPosition(preservedElement, preservedTop);\n          this.schedulePrependReconciliation(\n            preservedElement,\n            preservedTop,\n            newTranscript,\n          );\n        }\n      }\n      this.rememberFirstChildTop();\n      this.rememberActiveTurnAnchorTop();\n      this.scrollOverlayController?.sync();\n      return;\n    }\n    if (appendedAnchor) {\n      requestAnimationFrame(() => this.positionNewTurn(appendedAnchor));\n    }\n  };\n\n  private reconcilePrependPosition(element: HTMLElement, viewportTop: number) {\n    if (!this.viewport || !element.isConnected) return;\n    const nextTop =\n      element.getBoundingClientRect().top - this.viewport.getBoundingClientRect().top;\n    this.viewport.scrollTop += nextTop - viewportTop;\n  }\n\n  private schedulePrependReconciliation(\n    element: HTMLElement,\n    viewportTop: number,\n    prepended: HTMLElement[],\n  ) {\n    const generation = ++this.prependReconciliation;\n    // Prepended custom elements can gain height after their child-list mutation.\n    // Reconcile against the original coordinate after their layouts settle.\n    const pending = prepended\n      .flatMap(item => [item, ...Array.from(item.querySelectorAll<HTMLElement>('*'))])\n      .map(item => {\n        const componentOnReady = (\n          item as HTMLElement & { componentOnReady?: () => Promise<unknown> }\n        ).componentOnReady;\n        return componentOnReady ? componentOnReady.call(item).catch(() => undefined) : null;\n      })\n      .filter((promise): promise is Promise<unknown> => Boolean(promise));\n\n    void Promise.all(pending).then(() => {\n      requestAnimationFrame(() => {\n        if (generation !== this.prependReconciliation) return;\n        this.reconcilePrependPosition(element, viewportTop);\n        requestAnimationFrame(() => {\n          if (generation !== this.prependReconciliation) return;\n          this.reconcilePrependPosition(element, viewportTop);\n          this.rememberFirstChildTop();\n          this.rememberActiveTurnAnchorTop();\n          this.scrollOverlayController?.sync();\n        });\n      });\n    });\n  }\n\n  private handleTranscriptSlotChange = () => this.handleTranscriptChange();\n\n  private positionNewTurn(anchor: HTMLElement) {\n    if (!this.viewport) return;\n    this.activeTurnAnchor = anchor;\n    this.syncTurnClearance();\n    requestAnimationFrame(() => this.finishPositionNewTurn(anchor));\n  }\n\n  private finishPositionNewTurn(anchor: HTMLElement) {\n    if (!this.viewport || !anchor.isConnected) return;\n    const viewportRect = this.viewport.getBoundingClientRect();\n    const anchorTop =\n      anchor.getBoundingClientRect().top - viewportRect.top + this.viewport.scrollTop;\n    const customOffset = getComputedStyle(this.el)\n      .getPropertyValue('--ds-message-scroller-anchor-offset')\n      .trim();\n    const offset = resolveCssLengthPx(customOffset, 'var(--dimension-space-800)');\n    const max = Math.max(this.viewport.scrollHeight - this.viewport.clientHeight, 0);\n    const target = Math.min(Math.max(anchorTop - offset, 0), max);\n    this.following = max - target <= LIVE_EDGE_THRESHOLD;\n    this.followReleased = !this.following;\n    this.showScrollToLatest = !this.following;\n    this.programmatic = true;\n    this.viewport.scrollTop = target;\n    requestAnimationFrame(() => {\n      this.programmatic = false;\n      this.following = this.isAtLiveEdge();\n      this.followReleased = !this.following;\n      this.showScrollToLatest = !this.following;\n      this.rememberFirstChildTop();\n      this.rememberActiveTurnAnchorTop();\n    });\n    this.scrollOverlayController?.sync();\n  }\n\n  private rememberActiveTurnAnchorTop() {\n    if (!this.viewport || !this.activeTurnAnchor?.isConnected) return;\n    this.activeTurnAnchorViewportTop =\n      this.activeTurnAnchor.getBoundingClientRect().top -\n      this.viewport.getBoundingClientRect().top;\n  }\n\n  private syncTurnClearance() {\n    if (!this.viewport || !this.activeTurnAnchor?.isConnected) return;\n    const children = this.getTranscriptChildren();\n    const last = children[children.length - 1];\n    if (!last) return;\n    const anchorRect = this.activeTurnAnchor.getBoundingClientRect();\n    const lastRect = last.getBoundingClientRect();\n    const customOffset = getComputedStyle(this.el)\n      .getPropertyValue('--ds-message-scroller-anchor-offset')\n      .trim();\n    const offset = resolveCssLengthPx(customOffset, 'var(--dimension-space-800)');\n    const contentAfterAnchor = Math.max(lastRect.bottom - anchorRect.top, 0);\n    const clearance = Math.max(\n      Math.ceil(this.viewport.clientHeight - offset - contentAfterAnchor),\n      0,\n    );\n    if (clearance === this.turnClearance) return;\n    this.turnClearance = clearance;\n    this.el.style.setProperty('--ds-message-scroller-turn-clearance', `${clearance}px`);\n  }\n\n  private applyDefaultPosition() {\n    if (!this.viewport) return;\n    if (this.defaultPosition === 'start') {\n      this.viewport.scrollTop = 0;\n      this.following = false;\n      this.followReleased = true;\n      this.showScrollToLatest = this.viewport.scrollHeight > this.viewport.clientHeight;\n      this.scrollOverlayController?.sync();\n      return;\n    }\n    if (this.defaultPosition === 'last-anchor') {\n      const anchors = this.el.querySelectorAll<HTMLElement>('ds-message[scroll-anchor]');\n      const last = anchors.item(anchors.length - 1);\n      if (last) {\n        last.scrollIntoView({ block: 'start' });\n        this.following = this.isAtLiveEdge();\n        this.followReleased = !this.following;\n        this.showScrollToLatest = !this.following;\n        this.scrollOverlayController?.sync();\n        return;\n      }\n    }\n    this.viewport.scrollTop = this.viewport.scrollHeight;\n    this.following = true;\n    this.followReleased = false;\n    this.showScrollToLatest = false;\n    this.scrollOverlayController?.sync();\n  }\n\n  private isAtLiveEdge(): boolean {\n    if (!this.viewport) return true;\n    return (\n      this.viewport.scrollHeight - this.viewport.clientHeight - this.viewport.scrollTop <=\n      LIVE_EDGE_THRESHOLD\n    );\n  }\n\n  private handleScroll = () => {\n    if (!this.viewport) return;\n    this.scrollOverlayController?.sync();\n    this.rememberFirstChildTop();\n    this.rememberActiveTurnAnchorTop();\n    if (this.programmatic) return;\n    this.following = this.isAtLiveEdge();\n    this.followReleased = !this.following;\n    this.showScrollToLatest = !this.following;\n    const nextAtStart = this.viewport.scrollTop <= LIVE_EDGE_THRESHOLD;\n    if (nextAtStart && !this.atStart) this.dsReachStart.emit();\n    this.atStart = nextAtStart;\n  };\n\n  private releaseFollow = () => {\n    this.prependReconciliation += 1;\n    this.following = false;\n    this.followReleased = true;\n    this.showScrollToLatest = true;\n  };\n\n  private handleSelectionChange = () => {\n    const selection = document.getSelection();\n    if (\n      selection &&\n      !selection.isCollapsed &&\n      selection.anchorNode &&\n      this.el.contains(selection.anchorNode)\n    ) {\n      this.following = false;\n      this.followReleased = true;\n      this.showScrollToLatest = !this.isAtLiveEdge();\n    }\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"message-scroller\">\n          <div\n            class=\"message-scroller__viewport\"\n            ref={element => {\n              this.viewport = element;\n            }}\n            role=\"region\"\n            aria-label={this.messagesLabel}\n            tabIndex={0}\n            onScroll={this.handleScroll}\n            onPointerDown={(event: PointerEvent) => {\n              if (event.pointerType === 'touch') this.releaseFollow();\n            }}\n            onWheel={this.releaseFollow}\n            onKeyDown={(event: KeyboardEvent) => {\n              if (\n                ['ArrowUp', 'ArrowDown', 'PageUp', 'PageDown', 'Home', 'End', ' '].includes(\n                  event.key,\n                )\n              ) {\n                this.releaseFollow();\n              }\n            }}\n          >\n            <div\n              class=\"message-scroller__content scroll-edge-fade--block-window\"\n              ref={element => {\n                this.content = element;\n              }}\n              role=\"log\"\n              aria-live=\"polite\"\n              aria-relevant=\"additions\"\n              aria-busy={this.busy ? 'true' : undefined}\n            >\n              <slot\n                ref={element => {\n                  this.transcriptSlot = element;\n                }}\n                onSlotchange={this.handleTranscriptSlotChange}\n              />\n            </div>\n          </div>\n          <div\n            class=\"message-scroller__overlay\"\n            ref={element => {\n              this.overlay = element;\n            }}\n          >\n            <div class=\"message-scroller__overlay-stack\">\n              <div class=\"message-scroller__interaction\">\n                <slot name=\"interaction\" />\n              </div>\n              <div class=\"message-scroller__overlay-content\">\n                <slot name=\"overlay\" />\n              </div>\n            </div>\n          </div>\n          {this.showScrollToLatest ? (\n            <div class=\"message-scroller__control ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale\">\n              <ds-tooltip label=\"Scroll to latest message\" side=\"top\" size=\"sm\">\n                <ds-button-unfilled\n                  variant=\"icon\"\n                  icon=\"ChevronDown\"\n                  size=\"md\"\n                  rounded\n                  hasBorder={false}\n                  aria-label=\"Scroll to latest message\"\n                  onDsClick={() => void this.scrollToEnd()}\n                />\n              </ds-tooltip>\n            </div>\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["scrollEdgeFadeCss","messageScrollerCss","LIVE_EDGE_THRESHOLD","MessageScroller","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","busy","autoFollow","defaultPosition","messagesLabel","showScrollToLatest","following","followReleased","releasePendingAtLiveEdge","atStart","programmatic","transcriptChildren","knownTranscriptElements","Set","knownTurnAnchors","turnClearance","prependReconciliation","handleTranscriptChange","current","getTranscriptChildren","previous","hadKnownTranscript","size","previouslyKnown","appendedAnchor","reverse","find","element","reverseIndex","matches","has","index","length","slice","every","next","forEach","add","requestAnimationFrame","positionNewTurn","firstKnownIndex","findIndex","newTranscript","filter","prepended","indexOf","viewport","preservedElement","activeTurnAnchor","isConnected","preservedTop","activeTurnAnchorViewportTop","firstChildViewportTop","undefined","reconcilePrependPosition","schedulePrependReconciliation","rememberFirstChildTop","rememberActiveTurnAnchorTop","scrollOverlayController","sync","handleTranscriptSlotChange","handleScroll","atLiveEdge","isAtLiveEdge","nextAtStart","scrollTop","dsReachStart","emit","releaseFollow","handleSelectionChange","selection","document","getSelection","isCollapsed","anchorNode","el","contains","componentDidLoad","connectObservers","applyDefaultPosition","addEventListener","disconnectedCallback","disconnect","mutationObserver","programmaticTimer","clearTimeout","removeEventListener","scrollToMessage","id","message","Array","from","querySelectorAll","item","messageId","getAttribute","scrollIntoView","block","behavior","motionBehavior","scrollToStart","scrollTo","Boolean","scrollHeight","clientHeight","scrollToEnd","matchMedia","top","setTimeout","content","overlay","ScrollOverlayController","host","overlayContentSelector","onGeometryChange","handleContentGrowth","connect","MutationObserver","observe","childList","subtree","characterData","syncTurnClearance","nextHeight","first","getBoundingClientRect","assigned","transcriptSlot","assignedElements","assignedTranscript","queriedTranscript","closest","viewportTop","nextTop","generation","pending","flatMap","map","componentOnReady","call","catch","promise","Promise","all","then","anchor","finishPositionNewTurn","viewportRect","anchorTop","customOffset","getComputedStyle","getPropertyValue","trim","offset","resolveCssLengthPx","max","Math","target","min","children","last","anchorRect","lastRect","contentAfterAnchor","bottom","clearance","ceil","style","setProperty","anchors","render","h","Host","key","class","ref","role","tabIndex","onScroll","onPointerDown","event","pointerType","onWheel","onKeyDown","includes","onSlotchange","name","label","side","variant","icon","rounded","hasBorder","onDsClick"],"sources":["src/wc/utils/scroll-edge-fade.css?tag=ds-message-scroller&encapsulation=scoped","src/wc/components/MessageScroller/MessageScroller.css?tag=ds-message-scroller&encapsulation=scoped","src/wc/components/MessageScroller/MessageScroller.tsx"],"sourcesContent":["/**\n * Scroll-edge alpha fade — the single edge-fade utility for overflow containers.\n * Masks scrolling content to transparent so flat surfaces, shell gradients, and\n * images show through.\n *\n * Static fades are the default (PanelNav intentionally keeps its bottom fade).\n * Add `.scroll-edge-fade--scroll-aware` to reveal/hide each configured edge from\n * the container's own scroll position without JavaScript. Browsers without CSS\n * scroll-driven animations retain the configured static fades.\n *\n * @see scroll-edge-fade.ts — `scrollEdgeFadeClassMap`, `isScrollAtEdge`, size helpers.\n */\n\n@property --ds-scroll-edge-fade-top {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@property --ds-scroll-edge-fade-bottom {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@property --ds-scroll-edge-fade-left {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@property --ds-scroll-edge-fade-right {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@keyframes ds-scroll-edge-fade-reveal-top {\n  from { --ds-scroll-edge-fade-top: 0px; }\n  to { --ds-scroll-edge-fade-top: var(--ds-scroll-edge-fade-target-top); }\n}\n\n@keyframes ds-scroll-edge-fade-reveal-bottom {\n  from { --ds-scroll-edge-fade-bottom: var(--ds-scroll-edge-fade-target-bottom); }\n  to { --ds-scroll-edge-fade-bottom: 0px; }\n}\n\n@keyframes ds-scroll-edge-fade-reveal-left {\n  from { --ds-scroll-edge-fade-left: 0px; }\n  to { --ds-scroll-edge-fade-left: var(--ds-scroll-edge-fade-target-left); }\n}\n\n@keyframes ds-scroll-edge-fade-reveal-right {\n  from { --ds-scroll-edge-fade-right: var(--ds-scroll-edge-fade-target-right); }\n  to { --ds-scroll-edge-fade-right: 0px; }\n}\n\n/* Mask gradients use #000 / transparent as alpha stops — not theme colors. */\n/* stylelint-disable color-no-hex */\n\n.scroll-edge-fade {\n  --ds-scroll-edge-fade-size: var(--dimension-size-600);\n  --ds-scroll-edge-fade-reveal-distance: var(--dimension-size-800);\n  --ds-scroll-edge-fade-target-top: 0px;\n  --ds-scroll-edge-fade-target-bottom: 0px;\n  --ds-scroll-edge-fade-target-left: 0px;\n  --ds-scroll-edge-fade-target-right: 0px;\n  --ds-scroll-edge-fade-top: var(--ds-scroll-edge-fade-target-top);\n  --ds-scroll-edge-fade-bottom: var(--ds-scroll-edge-fade-target-bottom);\n  --ds-scroll-edge-fade-left: var(--ds-scroll-edge-fade-target-left);\n  --ds-scroll-edge-fade-right: var(--ds-scroll-edge-fade-target-right);\n  --ds-scroll-edge-fade-block-mask: linear-gradient(\n    to bottom,\n    transparent 0,\n    #000 var(--ds-scroll-edge-fade-top),\n    #000 calc(100% - var(--ds-scroll-edge-fade-bottom)),\n    transparent 100%\n  );\n  --ds-scroll-edge-fade-inline-mask: linear-gradient(\n    to right,\n    transparent 0,\n    #000 var(--ds-scroll-edge-fade-left),\n    #000 calc(100% - var(--ds-scroll-edge-fade-right)),\n    transparent 100%\n  );\n\n  /* Intersecting the block and inline masks lets every edge compose correctly. */\n  -webkit-mask-image:\n    var(--ds-scroll-edge-fade-block-mask),\n    var(--ds-scroll-edge-fade-inline-mask);\n  mask-image:\n    var(--ds-scroll-edge-fade-block-mask),\n    var(--ds-scroll-edge-fade-inline-mask);\n  -webkit-mask-composite: source-in;\n  mask-composite: intersect;\n  -webkit-mask-repeat: no-repeat;\n  mask-repeat: no-repeat;\n  -webkit-mask-size: 100% 100%;\n  mask-size: 100% 100%;\n}\n\n.scroll-edge-fade--top {\n  --ds-scroll-edge-fade-target-top: var(--ds-scroll-edge-fade-size);\n}\n\n.scroll-edge-fade--bottom {\n  --ds-scroll-edge-fade-target-bottom: var(--ds-scroll-edge-fade-size);\n}\n\n.scroll-edge-fade--left {\n  --ds-scroll-edge-fade-target-left: var(--ds-scroll-edge-fade-size);\n}\n\n.scroll-edge-fade--right {\n  --ds-scroll-edge-fade-target-right: var(--ds-scroll-edge-fade-size);\n}\n\n/* Manual per-edge state remains available when scroll state already lives in JS. */\n.scroll-edge-fade--top-at-edge {\n  --ds-scroll-edge-fade-target-top: 0px;\n}\n\n.scroll-edge-fade--bottom-at-edge {\n  --ds-scroll-edge-fade-target-bottom: 0px;\n}\n\n.scroll-edge-fade--left-at-edge {\n  --ds-scroll-edge-fade-target-left: 0px;\n}\n\n.scroll-edge-fade--right-at-edge {\n  --ds-scroll-edge-fade-target-right: 0px;\n}\n\n@supports (animation-timeline: scroll()) {\n  .scroll-edge-fade--scroll-aware {\n    animation-name:\n      ds-scroll-edge-fade-reveal-top,\n      ds-scroll-edge-fade-reveal-bottom,\n      ds-scroll-edge-fade-reveal-left,\n      ds-scroll-edge-fade-reveal-right;\n    /* stylelint-disable-next-line declaration-property-value-disallowed-list -- scroll timelines require a nonzero sentinel duration; elapsed time is ignored. */\n    animation-duration: 1ms;\n    animation-timing-function: ease-in-out;\n    animation-fill-mode: both;\n    animation-timeline: scroll(self y), scroll(self y), scroll(self x), scroll(self x);\n    animation-range:\n      0 var(--ds-scroll-edge-fade-reveal-distance),\n      calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%,\n      0 var(--ds-scroll-edge-fade-reveal-distance),\n      calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .scroll-edge-fade--scroll-aware {\n      animation: none;\n    }\n  }\n}\n\n.scroll-edge-fade--at-end,\n.scroll-edge-fade--hidden {\n  -webkit-mask-image: none;\n  mask-image: none;\n}\n\n/**\n * Masks a long content element against a scrollport-relative block window.\n * The owner updates the start/end offsets as the scrollport moves. Keeping the\n * mask on the content instead of the overflow element leaves native scrollbars\n * outside the fade.\n */\n.scroll-edge-fade--block-window {\n  --ds-scroll-edge-fade-window-start: 100%;\n  --ds-scroll-edge-fade-window-end: 100%;\n\n  -webkit-mask-image: linear-gradient(\n    to bottom,\n    #000 0,\n    #000 var(--ds-scroll-edge-fade-window-start),\n    transparent var(--ds-scroll-edge-fade-window-end)\n  );\n  mask-image: linear-gradient(\n    to bottom,\n    #000 0,\n    #000 var(--ds-scroll-edge-fade-window-start),\n    transparent var(--ds-scroll-edge-fade-window-end)\n  );\n  -webkit-mask-repeat: no-repeat;\n  mask-repeat: no-repeat;\n}\n\n/* stylelint-enable color-no-hex */\n","@import '../../styles/control-elevation.css';\n\n:host {\n  --ds-message-scroller-anchor-offset: var(--dimension-space-800);\n\n  display: block;\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n}\n\n.message-scroller {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n}\n\n.message-scroller__viewport {\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  overflow: auto;\n  overflow-anchor: none;\n  overscroll-behavior: contain;\n  box-sizing: border-box;\n}\n\n.message-scroller__viewport:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-border-bold-brand);\n  outline-offset: calc(-1 * var(--dimension-stroke-width-025));\n}\n\n.message-scroller__content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-300);\n  width: 100%;\n  max-width: var(\n    --ds-message-scroller-content-max-width,\n    var(--dimension-panel-width-2xl)\n  );\n  min-height: 100%;\n  margin-inline: auto;\n  padding-block-start: var(--dimension-space-200);\n  padding-inline: var(--dimension-space-200);\n  padding-block-end: max(\n    calc(var(--dimension-space-200) + var(--ds-scroll-overlay-block-size, 0px)),\n    var(--ds-message-scroller-turn-clearance, 0px)\n  );\n  box-sizing: border-box;\n}\n\n.message-scroller__overlay {\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: var(--dimension-z-index-floating);\n}\n\n.message-scroller__overlay-stack {\n  display: grid;\n  width: 100%;\n}\n\n.message-scroller__interaction,\n.message-scroller__overlay-content {\n  min-width: 0;\n}\n\n.message-scroller__control {\n  position: absolute;\n  bottom: calc(\n    var(--ds-scroll-overlay-content-block-size, 0px) + var(--dimension-space-200)\n  );\n  left: 50%;\n  z-index: var(--dimension-z-index-floating);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--dimension-radius-half);\n  background: var(--color-background-transparent);\n  transform: translateX(-50%);\n  -webkit-backdrop-filter: blur(var(--effect-blur-sm));\n  backdrop-filter: blur(var(--effect-blur-sm));\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from '@stencil/core';\nimport type { MessageScrollerPosition } from '../conversation-types';\nimport { ScrollOverlayController } from '../../utils/scroll-overlay-controller';\nimport { resolveCssLengthPx } from '../../utils/resolve-css-length-px';\n\nconst LIVE_EDGE_THRESHOLD = 24;\n\n@Component({\n  tag: 'ds-message-scroller',\n  styleUrl: 'MessageScroller.css',\n  styleUrls: ['../../utils/scroll-edge-fade.css'],\n  scoped: true,\n})\nexport class MessageScroller {\n  @Element() el!: HTMLElement;\n\n  @Prop() busy: boolean = false;\n  @Prop() autoFollow: boolean = true;\n  @Prop() defaultPosition: MessageScrollerPosition = 'last-anchor';\n  @Prop() messagesLabel: string = 'Messages';\n\n  @Event() dsReachStart!: EventEmitter<void>;\n\n  @State() private showScrollToLatest = false;\n\n  private viewport?: HTMLElement;\n  private content?: HTMLElement;\n  private overlay?: HTMLElement;\n  private transcriptSlot?: HTMLSlotElement;\n  private scrollOverlayController?: ScrollOverlayController;\n  private mutationObserver?: MutationObserver;\n  private following = true;\n  private followReleased = false;\n  private releasePendingAtLiveEdge = false;\n  private atStart = false;\n  private programmatic = false;\n  private programmaticTimer?: ReturnType<typeof setTimeout>;\n  private transcriptChildren: HTMLElement[] = [];\n  private knownTranscriptElements = new Set<HTMLElement>();\n  private knownTurnAnchors = new Set<HTMLElement>();\n  private firstChildViewportTop?: number;\n  private activeTurnAnchor?: HTMLElement;\n  private activeTurnAnchorViewportTop?: number;\n  private turnClearance = 0;\n  private prependReconciliation = 0;\n\n  componentDidLoad() {\n    this.transcriptChildren = this.getTranscriptChildren();\n    this.transcriptChildren.forEach(element => {\n      this.knownTranscriptElements.add(element);\n      if (element.matches('ds-message[scroll-anchor]')) {\n        this.knownTurnAnchors.add(element);\n      }\n    });\n    this.rememberFirstChildTop();\n    this.connectObservers();\n    requestAnimationFrame(() => this.applyDefaultPosition());\n    document.addEventListener('selectionchange', this.handleSelectionChange);\n  }\n\n  disconnectedCallback() {\n    this.prependReconciliation += 1;\n    this.scrollOverlayController?.disconnect();\n    this.mutationObserver?.disconnect();\n    if (this.programmaticTimer) clearTimeout(this.programmaticTimer);\n    document.removeEventListener('selectionchange', this.handleSelectionChange);\n  }\n\n  @Method()\n  async scrollToMessage(id: string): Promise<boolean> {\n    const message = Array.from(\n      this.el.querySelectorAll<HTMLElement & { messageId?: string }>('ds-message')\n    ).find(item => item.messageId === id || item.getAttribute('message-id') === id);\n    if (!message) return false;\n    this.releasePendingAtLiveEdge = false;\n    this.following = false;\n    this.followReleased = true;\n    this.showScrollToLatest = true;\n    message.scrollIntoView({ block: 'start', behavior: this.motionBehavior() });\n    return true;\n  }\n\n  @Method()\n  async scrollToStart() {\n    this.releasePendingAtLiveEdge = false;\n    this.scrollTo(0);\n    this.following = false;\n    this.followReleased = true;\n    this.showScrollToLatest = Boolean(\n      this.viewport && this.viewport.scrollHeight > this.viewport.clientHeight\n    );\n  }\n\n  @Method()\n  async scrollToEnd() {\n    this.releasePendingAtLiveEdge = false;\n    this.following = true;\n    this.followReleased = false;\n    this.showScrollToLatest = false;\n    this.scrollTo(this.viewport?.scrollHeight ?? 0);\n  }\n\n  private motionBehavior(): ScrollBehavior {\n    return matchMedia('(prefers-reduced-motion: reduce)').matches ? 'auto' : 'smooth';\n  }\n\n  private scrollTo(top: number) {\n    if (!this.viewport) return;\n    this.programmatic = true;\n    const behavior = this.motionBehavior();\n    this.viewport.scrollTo({ top, behavior });\n    if (this.programmaticTimer) clearTimeout(this.programmaticTimer);\n    this.programmaticTimer = setTimeout(() => {\n      this.programmatic = false;\n      this.programmaticTimer = undefined;\n      if (this.following) {\n        this.viewport!.scrollTop = top;\n        this.showScrollToLatest = false;\n      }\n    }, behavior === 'smooth' ? 600 : 0);\n  }\n\n  private connectObservers() {\n    if (!this.viewport || !this.content || !this.overlay) return;\n    this.scrollOverlayController = new ScrollOverlayController({\n      host: this.el,\n      viewport: this.viewport,\n      content: this.content,\n      overlay: this.overlay,\n      overlayContentSelector: '.message-scroller__overlay-stack',\n      onGeometryChange: () => this.handleContentGrowth(),\n    });\n    this.scrollOverlayController.connect();\n    this.mutationObserver = new MutationObserver(() => {\n      this.handleTranscriptChange();\n      this.handleContentGrowth();\n    });\n    this.mutationObserver.observe(this.el, {\n      childList: true,\n      subtree: true,\n      characterData: true,\n    });\n  }\n\n  private handleContentGrowth() {\n    if (!this.viewport) return;\n    this.syncTurnClearance();\n    const nextHeight = this.viewport.scrollHeight;\n    if (this.autoFollow && this.following && !this.followReleased) {\n      this.viewport.scrollTop = nextHeight;\n    }\n    if (this.releasePendingAtLiveEdge && !this.isAtLiveEdge()) {\n      this.releasePendingAtLiveEdge = false;\n    }\n    this.showScrollToLatest = !this.following && !this.isAtLiveEdge();\n    this.scrollOverlayController?.sync();\n  }\n\n  private rememberFirstChildTop() {\n    if (!this.viewport) return;\n    const first = this.getTranscriptChildren()[0];\n    this.firstChildViewportTop = first\n      ? first.getBoundingClientRect().top - this.viewport.getBoundingClientRect().top\n      : undefined;\n  }\n\n  private getTranscriptChildren(): HTMLElement[] {\n    const assigned = this.transcriptSlot?.assignedElements() ?? [];\n    const assignedTranscript = assigned.filter(\n      (element): element is HTMLElement =>\n        element instanceof HTMLElement &&\n        (element.matches('ds-message') || element.matches('ds-agent-response')),\n    );\n    const queriedTranscript = Array.from(\n      this.el.querySelectorAll<HTMLElement>('ds-message, ds-agent-response'),\n    ).filter(element => {\n      if (\n        element.closest(\n          '.message-scroller__interaction, .message-scroller__overlay-content',\n        )\n      ) {\n        return false;\n      }\n      if (element.matches('ds-agent-response')) return true;\n      return !element.closest('ds-agent-response');\n    });\n    return queriedTranscript.length > assignedTranscript.length\n      ? queriedTranscript\n      : assignedTranscript;\n  }\n\n  private handleTranscriptChange = () => {\n    const current = this.getTranscriptChildren();\n    const previous = this.transcriptChildren;\n    const hadKnownTranscript = this.knownTranscriptElements.size > 0;\n    const previouslyKnown = new Set(this.knownTranscriptElements);\n    const appendedAnchor = [...current].reverse().find((element, reverseIndex) => {\n      if (\n        !element.matches('ds-message[scroll-anchor]') ||\n        this.knownTurnAnchors.has(element)\n      ) {\n        return false;\n      }\n      const index = current.length - reverseIndex - 1;\n      return current\n        .slice(index + 1)\n        .every(next => !this.knownTranscriptElements.has(next));\n    });\n    current.forEach(element => {\n      this.knownTranscriptElements.add(element);\n      if (element.matches('ds-message[scroll-anchor]')) {\n        this.knownTurnAnchors.add(element);\n      }\n    });\n    if (!previous.length) {\n      this.transcriptChildren = current;\n      if (appendedAnchor && hadKnownTranscript) {\n        requestAnimationFrame(() => this.positionNewTurn(appendedAnchor));\n      }\n      return;\n    }\n\n    const firstKnownIndex = current.findIndex(element => previouslyKnown.has(element));\n    const newTranscript = current.filter(element => !previouslyKnown.has(element));\n    const prepended =\n      (current.length > previous.length && previous.every(\n        (element, index) => current[current.length - previous.length + index] === element,\n      )) ||\n      (!appendedAnchor &&\n        newTranscript.length > 0 &&\n        firstKnownIndex > 0 &&\n        newTranscript.every(element => current.indexOf(element) < firstKnownIndex));\n\n    this.transcriptChildren = current;\n    if (prepended) {\n      if (this.viewport) {\n        const preservedElement = this.activeTurnAnchor?.isConnected\n          ? this.activeTurnAnchor\n          : previous[0];\n        const preservedTop = this.activeTurnAnchor?.isConnected\n          ? this.activeTurnAnchorViewportTop\n          : this.firstChildViewportTop;\n        if (preservedElement && preservedTop !== undefined) {\n          this.reconcilePrependPosition(preservedElement, preservedTop);\n          this.schedulePrependReconciliation(\n            preservedElement,\n            preservedTop,\n            newTranscript,\n          );\n        }\n      }\n      this.rememberFirstChildTop();\n      this.rememberActiveTurnAnchorTop();\n      this.scrollOverlayController?.sync();\n      return;\n    }\n    if (appendedAnchor) {\n      requestAnimationFrame(() => this.positionNewTurn(appendedAnchor));\n    }\n  };\n\n  private reconcilePrependPosition(element: HTMLElement, viewportTop: number) {\n    if (!this.viewport || !element.isConnected) return;\n    const nextTop =\n      element.getBoundingClientRect().top - this.viewport.getBoundingClientRect().top;\n    this.viewport.scrollTop += nextTop - viewportTop;\n  }\n\n  private schedulePrependReconciliation(\n    element: HTMLElement,\n    viewportTop: number,\n    prepended: HTMLElement[],\n  ) {\n    const generation = ++this.prependReconciliation;\n    // Prepended custom elements can gain height after their child-list mutation.\n    // Reconcile against the original coordinate after their layouts settle.\n    const pending = prepended\n      .flatMap(item => [item, ...Array.from(item.querySelectorAll<HTMLElement>('*'))])\n      .map(item => {\n        const componentOnReady = (\n          item as HTMLElement & { componentOnReady?: () => Promise<unknown> }\n        ).componentOnReady;\n        return componentOnReady ? componentOnReady.call(item).catch(() => undefined) : null;\n      })\n      .filter((promise): promise is Promise<unknown> => Boolean(promise));\n\n    void Promise.all(pending).then(() => {\n      requestAnimationFrame(() => {\n        if (generation !== this.prependReconciliation) return;\n        this.reconcilePrependPosition(element, viewportTop);\n        requestAnimationFrame(() => {\n          if (generation !== this.prependReconciliation) return;\n          this.reconcilePrependPosition(element, viewportTop);\n          this.rememberFirstChildTop();\n          this.rememberActiveTurnAnchorTop();\n          this.scrollOverlayController?.sync();\n        });\n      });\n    });\n  }\n\n  private handleTranscriptSlotChange = () => this.handleTranscriptChange();\n\n  private positionNewTurn(anchor: HTMLElement) {\n    if (!this.viewport) return;\n    this.activeTurnAnchor = anchor;\n    this.syncTurnClearance();\n    requestAnimationFrame(() => this.finishPositionNewTurn(anchor));\n  }\n\n  private finishPositionNewTurn(anchor: HTMLElement) {\n    if (!this.viewport || !anchor.isConnected) return;\n    const viewportRect = this.viewport.getBoundingClientRect();\n    const anchorTop =\n      anchor.getBoundingClientRect().top - viewportRect.top + this.viewport.scrollTop;\n    const customOffset = getComputedStyle(this.el)\n      .getPropertyValue('--ds-message-scroller-anchor-offset')\n      .trim();\n    const offset = resolveCssLengthPx(customOffset, 'var(--dimension-space-800)');\n    const max = Math.max(this.viewport.scrollHeight - this.viewport.clientHeight, 0);\n    const target = Math.min(Math.max(anchorTop - offset, 0), max);\n    this.following = max - target <= LIVE_EDGE_THRESHOLD;\n    this.followReleased = !this.following;\n    this.showScrollToLatest = !this.following;\n    this.programmatic = true;\n    this.viewport.scrollTop = target;\n    requestAnimationFrame(() => {\n      this.programmatic = false;\n      this.following = this.isAtLiveEdge();\n      this.followReleased = !this.following;\n      this.showScrollToLatest = !this.following;\n      this.rememberFirstChildTop();\n      this.rememberActiveTurnAnchorTop();\n    });\n    this.scrollOverlayController?.sync();\n  }\n\n  private rememberActiveTurnAnchorTop() {\n    if (!this.viewport || !this.activeTurnAnchor?.isConnected) return;\n    this.activeTurnAnchorViewportTop =\n      this.activeTurnAnchor.getBoundingClientRect().top -\n      this.viewport.getBoundingClientRect().top;\n  }\n\n  private syncTurnClearance() {\n    if (!this.viewport || !this.activeTurnAnchor?.isConnected) return;\n    const children = this.getTranscriptChildren();\n    const last = children[children.length - 1];\n    if (!last) return;\n    const anchorRect = this.activeTurnAnchor.getBoundingClientRect();\n    const lastRect = last.getBoundingClientRect();\n    const customOffset = getComputedStyle(this.el)\n      .getPropertyValue('--ds-message-scroller-anchor-offset')\n      .trim();\n    const offset = resolveCssLengthPx(customOffset, 'var(--dimension-space-800)');\n    const contentAfterAnchor = Math.max(lastRect.bottom - anchorRect.top, 0);\n    const clearance = Math.max(\n      Math.ceil(this.viewport.clientHeight - offset - contentAfterAnchor),\n      0,\n    );\n    if (clearance === this.turnClearance) return;\n    this.turnClearance = clearance;\n    this.el.style.setProperty('--ds-message-scroller-turn-clearance', `${clearance}px`);\n  }\n\n  private applyDefaultPosition() {\n    if (!this.viewport) return;\n    this.releasePendingAtLiveEdge = false;\n    if (this.defaultPosition === 'start') {\n      this.viewport.scrollTop = 0;\n      this.following = false;\n      this.followReleased = true;\n      this.showScrollToLatest = this.viewport.scrollHeight > this.viewport.clientHeight;\n      this.scrollOverlayController?.sync();\n      return;\n    }\n    if (this.defaultPosition === 'last-anchor') {\n      const anchors = this.el.querySelectorAll<HTMLElement>('ds-message[scroll-anchor]');\n      const last = anchors.item(anchors.length - 1);\n      if (last) {\n        last.scrollIntoView({ block: 'start' });\n        this.following = this.isAtLiveEdge();\n        this.followReleased = !this.following;\n        this.showScrollToLatest = !this.following;\n        this.scrollOverlayController?.sync();\n        return;\n      }\n    }\n    this.viewport.scrollTop = this.viewport.scrollHeight;\n    this.following = true;\n    this.followReleased = false;\n    this.showScrollToLatest = false;\n    this.scrollOverlayController?.sync();\n  }\n\n  private isAtLiveEdge(): boolean {\n    if (!this.viewport) return true;\n    return (\n      this.viewport.scrollHeight - this.viewport.clientHeight - this.viewport.scrollTop <=\n      LIVE_EDGE_THRESHOLD\n    );\n  }\n\n  private handleScroll = () => {\n    if (!this.viewport) return;\n    this.scrollOverlayController?.sync();\n    this.rememberFirstChildTop();\n    this.rememberActiveTurnAnchorTop();\n    if (this.programmatic) return;\n    const atLiveEdge = this.isAtLiveEdge();\n    if (this.releasePendingAtLiveEdge && atLiveEdge) {\n      // A scroll event queued by the previous auto-follow can arrive after\n      // reader input. Keep that stale event from restoring follow mode.\n      this.following = false;\n      this.followReleased = true;\n      this.showScrollToLatest = false;\n      return;\n    }\n    this.releasePendingAtLiveEdge = false;\n    this.following = atLiveEdge;\n    this.followReleased = !this.following;\n    this.showScrollToLatest = !this.following;\n    const nextAtStart = this.viewport.scrollTop <= LIVE_EDGE_THRESHOLD;\n    if (nextAtStart && !this.atStart) this.dsReachStart.emit();\n    this.atStart = nextAtStart;\n  };\n\n  private releaseFollow = () => {\n    this.prependReconciliation += 1;\n    this.releasePendingAtLiveEdge = this.isAtLiveEdge();\n    this.following = false;\n    this.followReleased = true;\n    this.showScrollToLatest = !this.releasePendingAtLiveEdge;\n  };\n\n  private handleSelectionChange = () => {\n    const selection = document.getSelection();\n    if (\n      selection &&\n      !selection.isCollapsed &&\n      selection.anchorNode &&\n      this.el.contains(selection.anchorNode)\n    ) {\n      this.releaseFollow();\n    }\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"message-scroller\">\n          <div\n            class=\"message-scroller__viewport\"\n            ref={element => {\n              this.viewport = element;\n            }}\n            role=\"region\"\n            aria-label={this.messagesLabel}\n            tabIndex={0}\n            onScroll={this.handleScroll}\n            onPointerDown={(event: PointerEvent) => {\n              if (event.pointerType === 'touch') this.releaseFollow();\n            }}\n            onWheel={this.releaseFollow}\n            onKeyDown={(event: KeyboardEvent) => {\n              if (\n                ['ArrowUp', 'ArrowDown', 'PageUp', 'PageDown', 'Home', 'End', ' '].includes(\n                  event.key,\n                )\n              ) {\n                this.releaseFollow();\n              }\n            }}\n          >\n            <div\n              class=\"message-scroller__content scroll-edge-fade--block-window\"\n              ref={element => {\n                this.content = element;\n              }}\n              role=\"log\"\n              aria-live=\"polite\"\n              aria-relevant=\"additions\"\n              aria-busy={this.busy ? 'true' : undefined}\n            >\n              <slot\n                ref={element => {\n                  this.transcriptSlot = element;\n                }}\n                onSlotchange={this.handleTranscriptSlotChange}\n              />\n            </div>\n          </div>\n          <div\n            class=\"message-scroller__overlay\"\n            ref={element => {\n              this.overlay = element;\n            }}\n          >\n            <div class=\"message-scroller__overlay-stack\">\n              <div class=\"message-scroller__interaction\">\n                <slot name=\"interaction\" />\n              </div>\n              <div class=\"message-scroller__overlay-content\">\n                <slot name=\"overlay\" />\n              </div>\n            </div>\n          </div>\n          {this.showScrollToLatest ? (\n            <div class=\"message-scroller__control ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale\">\n              <ds-tooltip label=\"Scroll to latest message\" side=\"top\" size=\"sm\">\n                <ds-button-unfilled\n                  variant=\"icon\"\n                  icon=\"ChevronDown\"\n                  size=\"md\"\n                  rounded\n                  hasBorder={false}\n                  aria-label=\"Scroll to latest message\"\n                  onDsClick={() => void this.scrollToEnd()}\n                />\n              </ds-tooltip>\n            </div>\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

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

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