@ds-mo/ui 9.2.1 → 11.0.0

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

@@ -1 +1 @@
-{"version":3,"names":["panelSubNavCss","PanelSubNav","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","items","ariaLabel","enabledItems","filter","item","isInactive","focusableId","some","id","selectItem","dsChange","emit","focusItem","el","querySelector","focus","preventScroll","onValueChange","next","previous","undefined","requestAnimationFrame","active","document","activeElement","contains","findEnabled","from","step","length","offset","index","handleKeyDown","event","focusedId","target","closest","dataset","focusedIndex","findIndex","selectedIndex","currentIndex","key","nextIndex","reversedIndex","reverse","preventDefault","render","background","h","Host","class","role","ariaLabelledby","map","isSelected","type","panelId","disabled","tabIndex","onClick","as","variant","color","label"],"sources":["src/wc/components/PanelSubNav/PanelSubNav.css?tag=ds-panel-sub-nav&encapsulation=scoped","src/wc/components/PanelSubNav/PanelSubNav.tsx"],"sourcesContent":["@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n@import '../../utils/control-inactive.css';\n\n:host {\n  display: block;\n  width: 100%;\n}\n\n.panel-sub-nav {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050);\n  width: 100%;\n}\n\n.panel-sub-nav__item {\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  gap: var(--ds-control-gap);\n  width: 100%;\n  height: var(--ds-control-height);\n  padding: 0 var(--ds-control-padding-inline);\n  box-sizing: border-box;\n  border: none;\n  border-radius: var(--ds-control-radius);\n  background: transparent;\n  color: var(--color-foreground-secondary);\n  cursor: pointer;\n  text-align: left;\n  -webkit-user-select: none;\n  user-select: none;\n  transition: color var(--effect-motion-short-2);\n}\n\n.panel-sub-nav__item--selected {\n  color: var(--color-foreground-primary);\n}\n\n.panel-sub-nav__item--on-medium {\n  color: var(--color-foreground-on-medium-background-secondary);\n}\n\n.panel-sub-nav__item--on-medium.panel-sub-nav__item--selected {\n  color: var(--color-foreground-on-medium-background-primary);\n}\n\n.panel-sub-nav__item--on-bold {\n  color: var(--color-foreground-on-bold-background-secondary);\n}\n\n.panel-sub-nav__item--on-bold.panel-sub-nav__item--selected {\n  color: var(--color-foreground-on-bold-background-primary);\n}\n\n.panel-sub-nav__item--on-strong {\n  color: var(--color-foreground-on-strong-background-secondary);\n}\n\n.panel-sub-nav__item--on-strong.panel-sub-nav__item--selected {\n  color: var(--color-foreground-on-strong-background-primary);\n}\n\n.panel-sub-nav__item--on-translucent {\n  color: var(--color-translucent-foreground-secondary);\n}\n\n.panel-sub-nav__item--on-translucent.panel-sub-nav__item--selected {\n  color: var(--color-translucent-foreground-primary);\n}\n\n.panel-sub-nav__item--on-inverted {\n  color: var(--color-inverted-foreground-secondary);\n}\n\n.panel-sub-nav__item--on-inverted.panel-sub-nav__item--selected {\n  color: var(--color-inverted-foreground-primary);\n}\n\n.panel-sub-nav__item--on-media {\n  color: var(--color-media-foreground-secondary);\n}\n\n.panel-sub-nav__item--on-media.panel-sub-nav__item--selected {\n  color: var(--color-media-foreground-primary);\n}\n\n.panel-sub-nav__item--on-always-dark {\n  color: var(--color-always-dark-foreground-secondary);\n}\n\n.panel-sub-nav__item--on-always-dark.panel-sub-nav__item--selected {\n  color: var(--color-always-dark-foreground-primary);\n}\n\nds-text.panel-sub-nav__label {\n  flex: 1;\n  min-width: 0;\n  padding: 0 var(--ds-control-label-inset);\n}\n","import { Component, Prop, Event, EventEmitter, Element, Listen, Watch, h, Host } from '@stencil/core';\nimport type { PanelSubNavItem } from './panel-sub-nav-types';\n\nexport type PanelSubNavBackground =\n  | 'faint'\n  | 'medium'\n  | 'bold'\n  | 'strong'\n  | 'translucent'\n  | 'inverted'\n  | 'media'\n  | 'always-dark';\n\n@Component({\n  tag: 'ds-panel-sub-nav',\n  styleUrl: 'PanelSubNav.css',\n  scoped: true,\n})\nexport class PanelSubNav {\n  @Element() el!: HTMLElement;\n\n  /** Required selected item id when enabled items exist. Keep synchronized with the visible panel. */\n  @Prop({ mutable: true }) value: string = '';\n  /**\n   * Local panel tabs. Assign this array through the JavaScript property.\n   * Replace the array reference when items change.\n   */\n  @Prop() items: PanelSubNavItem[] = [];\n  /** Actual parent surface context. Omit on primary and secondary surfaces. */\n  @Prop() background: PanelSubNavBackground | undefined;\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n  @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n\n  @Event() dsChange!: EventEmitter<string>;\n\n  private get enabledItems(): PanelSubNavItem[] {\n    return this.items.filter(item => !item.isInactive);\n  }\n\n  private get focusableId(): string {\n    return this.enabledItems.some(item => item.id === this.value)\n      ? this.value\n      : (this.enabledItems[0]?.id ?? '');\n  }\n\n  private selectItem(id: string) {\n    this.value = id;\n    this.dsChange.emit(id);\n    this.focusItem(id);\n  }\n\n  private focusItem(id: string) {\n    const item = this.el.querySelector(`[data-panel-sub-nav-id=\"${id}\"]`) as HTMLElement | null;\n    item?.focus({ preventScroll: true });\n  }\n\n  @Watch('value')\n  onValueChange(next: string, previous: string | undefined) {\n    if (previous === undefined || next === previous) return;\n\n    requestAnimationFrame(() => {\n      const active = document.activeElement as HTMLElement | null;\n      if (!active || !this.el.contains(active)) return;\n      this.focusItem(this.enabledItems.some(item => item.id === next) ? next : this.focusableId);\n    });\n  }\n\n  private findEnabled(from: number, step: 1 | -1): number {\n    const length = this.items.length;\n    for (let offset = 1; offset <= length; offset++) {\n      const index = (from + step * offset + length * offset) % length;\n      if (!this.items[index]?.isInactive) return index;\n    }\n    return from;\n  }\n\n  @Listen('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    if (!this.enabledItems.length) return;\n\n    const focusedId = (event.target as Element | null)\n      ?.closest<HTMLElement>('[data-panel-sub-nav-id]')\n      ?.dataset['panelSubNavId'];\n    const focusedIndex = this.items.findIndex(item => item.id === focusedId);\n    const selectedIndex = this.items.findIndex(item => item.id === this.value && !item.isInactive);\n    const currentIndex = focusedIndex >= 0\n      ? focusedIndex\n      : selectedIndex >= 0\n        ? selectedIndex\n      : (event.key === 'ArrowUp' ? 0 : -1);\n    let nextIndex: number | null = null;\n\n    if (event.key === 'ArrowDown') {\n      nextIndex = this.findEnabled(currentIndex, 1);\n    } else if (event.key === 'ArrowUp') {\n      nextIndex = this.findEnabled(currentIndex, -1);\n    } else if (event.key === 'Home') {\n      nextIndex = this.items.findIndex(item => !item.isInactive);\n    } else if (event.key === 'End') {\n      const reversedIndex = [...this.items].reverse().findIndex(item => !item.isInactive);\n      nextIndex = reversedIndex < 0 ? null : this.items.length - 1 - reversedIndex;\n    }\n\n    if (nextIndex === null || nextIndex < 0) return;\n    const next = this.items[nextIndex];\n    if (!next || next.isInactive) return;\n\n    event.preventDefault();\n    this.selectItem(next.id);\n  }\n\n  render() {\n    const focusableId = this.focusableId;\n    const background = this.background;\n\n    return (\n      <Host>\n        <div\n          class=\"panel-sub-nav\"\n          role=\"tablist\"\n          aria-orientation=\"vertical\"\n          aria-label={this.ariaLabel}\n          aria-labelledby={this.ariaLabelledby}\n        >\n          {this.items.map(item => {\n            const isSelected = item.id === this.value;\n            return (\n              <button\n                id={item.id}\n                type=\"button\"\n                role=\"tab\"\n                data-panel-sub-nav-id={item.id}\n                class={{\n                  'panel-sub-nav__item': true,\n                  'panel-sub-nav__item--selected': isSelected,\n                  'ds-control--md': true,\n                  'ds-focus-ring-inset': true,\n                  'ds-interaction-fill': !item.isInactive,\n                  'ds-interaction-fill--selected': isSelected && !item.isInactive,\n                  'ds-interaction-fill--on-faint': background === 'faint',\n                  'ds-interaction-fill--on-medium': background === 'medium',\n                  'ds-interaction-fill--on-bold': background === 'bold',\n                  'ds-interaction-fill--on-strong': background === 'strong',\n                  'ds-interaction-fill--on-translucent': background === 'translucent',\n                  'ds-interaction-fill--on-inverted': background === 'inverted',\n                  'ds-interaction-fill--on-media': background === 'media',\n                  'ds-interaction-fill--on-always-dark': background === 'always-dark',\n                  [`panel-sub-nav__item--on-${background}`]: !!background,\n                  'ds-control-inactive': !!item.isInactive,\n                }}\n                aria-selected={isSelected ? 'true' : 'false'}\n                aria-controls={item.panelId}\n                aria-disabled={item.isInactive ? 'true' : undefined}\n                disabled={item.isInactive}\n                tabIndex={item.id === focusableId ? 0 : -1}\n                onClick={() => !item.isInactive && this.selectItem(item.id)}\n              >\n                <ds-text\n                  class=\"panel-sub-nav__label ds-interaction-fill__content\"\n                  as=\"span\"\n                  variant=\"text-body-medium\"\n                  color=\"inherit\"\n                >\n                  {item.label}\n                </ds-text>\n              </button>\n            );\n          })}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["panelSubNavCss","PanelSubNav","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","items","ariaLabel","enabledItems","filter","item","isInactive","focusableId","some","id","selectItem","dsChange","emit","focusItem","el","querySelector","focus","preventScroll","onValueChange","next","previous","undefined","requestAnimationFrame","active","document","activeElement","contains","findEnabled","from","step","length","offset","index","handleKeyDown","event","focusedId","target","closest","dataset","focusedIndex","findIndex","selectedIndex","currentIndex","key","nextIndex","reversedIndex","reverse","preventDefault","render","background","h","Host","class","role","ariaLabelledby","map","isSelected","type","panelId","disabled","tabIndex","onClick","as","variant","color","label"],"sources":["src/wc/components/PanelSubNav/PanelSubNav.css?tag=ds-panel-sub-nav&encapsulation=scoped","src/wc/components/PanelSubNav/PanelSubNav.tsx"],"sourcesContent":["@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n@import '../../utils/control-inactive.css';\n\n:host {\n  display: block;\n  width: 100%;\n}\n\n.panel-sub-nav {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050);\n  width: 100%;\n}\n\n.panel-sub-nav__item {\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  gap: var(--ds-control-gap);\n  width: 100%;\n  height: var(--ds-control-height);\n  padding: 0 var(--ds-control-padding-inline);\n  box-sizing: border-box;\n  border: none;\n  border-radius: var(--ds-control-radius);\n  background: transparent;\n  color: var(--color-foreground-secondary);\n  cursor: pointer;\n  text-align: left;\n  -webkit-user-select: none;\n  user-select: none;\n  transition: color var(--effect-motion-short-2);\n}\n\n.panel-sub-nav__item--selected {\n  color: var(--color-foreground-primary);\n}\n\n.panel-sub-nav__item--on-medium {\n  color: var(--color-foreground-on-medium-background-secondary);\n}\n\n.panel-sub-nav__item--on-medium.panel-sub-nav__item--selected {\n  color: var(--color-foreground-on-medium-background-primary);\n}\n\n.panel-sub-nav__item--on-bold {\n  color: var(--color-foreground-on-bold-background-secondary);\n}\n\n.panel-sub-nav__item--on-bold.panel-sub-nav__item--selected {\n  color: var(--color-foreground-on-bold-background-primary);\n}\n\n.panel-sub-nav__item--on-strong {\n  color: var(--color-foreground-on-strong-background-secondary);\n}\n\n.panel-sub-nav__item--on-strong.panel-sub-nav__item--selected {\n  color: var(--color-foreground-on-strong-background-primary);\n}\n\n.panel-sub-nav__item--on-translucent {\n  color: var(--color-translucent-foreground-secondary);\n}\n\n.panel-sub-nav__item--on-translucent.panel-sub-nav__item--selected {\n  color: var(--color-translucent-foreground-primary);\n}\n\n.panel-sub-nav__item--on-inverted {\n  color: var(--color-inverted-foreground-secondary);\n}\n\n.panel-sub-nav__item--on-inverted.panel-sub-nav__item--selected {\n  color: var(--color-inverted-foreground-primary);\n}\n\n.panel-sub-nav__item--on-media {\n  color: var(--color-media-foreground-secondary);\n}\n\n.panel-sub-nav__item--on-media.panel-sub-nav__item--selected {\n  color: var(--color-media-foreground-primary);\n}\n\n.panel-sub-nav__item--on-always-dark {\n  color: var(--color-always-dark-foreground-secondary);\n}\n\n.panel-sub-nav__item--on-always-dark.panel-sub-nav__item--selected {\n  color: var(--color-always-dark-foreground-primary);\n}\n\nds-text.panel-sub-nav__label {\n  flex: 1;\n  min-width: 0;\n  padding: 0 var(--ds-control-label-inset);\n}\n","import { Component, Prop, Event, EventEmitter, Element, Listen, Watch, h, Host } from '@stencil/core';\nimport type { PanelSubNavItem } from './panel-sub-nav-types';\n\nexport type PanelSubNavBackground =\n  | 'faint'\n  | 'medium'\n  | 'bold'\n  | 'strong'\n  | 'translucent'\n  | 'inverted'\n  | 'media'\n  | 'always-dark';\n\n@Component({\n  tag: 'ds-panel-sub-nav',\n  styleUrl: 'PanelSubNav.css',\n  scoped: true,\n})\nexport class PanelSubNav {\n  @Element() el!: HTMLElement;\n\n  /** Required selected item id when enabled items exist. Keep synchronized with the visible panel. */\n  @Prop({ mutable: true }) value: string = '';\n  /**\n   * Local panel tabs. Assign this array through the JavaScript property.\n   * Replace the array reference when items change.\n   */\n  @Prop() items: PanelSubNavItem[] = [];\n  /** Actual parent surface context. Omit on primary and secondary surfaces. */\n  @Prop() background: PanelSubNavBackground | undefined;\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n  @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n\n  @Event() dsChange!: EventEmitter<string>;\n\n  private get enabledItems(): PanelSubNavItem[] {\n    return this.items.filter(item => !item.isInactive);\n  }\n\n  private get focusableId(): string {\n    return this.enabledItems.some(item => item.id === this.value)\n      ? this.value\n      : (this.enabledItems[0]?.id ?? '');\n  }\n\n  private selectItem(id: string) {\n    this.value = id;\n    this.dsChange.emit(id);\n    this.focusItem(id);\n  }\n\n  private focusItem(id: string) {\n    const item = this.el.querySelector(`[data-panel-sub-nav-id=\"${id}\"]`) as HTMLElement | null;\n    item?.focus({ preventScroll: true });\n  }\n\n  @Watch('value')\n  onValueChange(next: string, previous: string | undefined) {\n    if (previous === undefined || next === previous) return;\n\n    requestAnimationFrame(() => {\n      const active = document.activeElement as HTMLElement | null;\n      if (!active || !this.el.contains(active)) return;\n      this.focusItem(this.enabledItems.some(item => item.id === next) ? next : this.focusableId);\n    });\n  }\n\n  private findEnabled(from: number, step: 1 | -1): number {\n    const length = this.items.length;\n    for (let offset = 1; offset <= length; offset++) {\n      const index = (from + step * offset + length * offset) % length;\n      if (!this.items[index]?.isInactive) return index;\n    }\n    return from;\n  }\n\n  @Listen('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    if (!this.enabledItems.length) return;\n\n    const focusedId = (event.target as Element | null)\n      ?.closest<HTMLElement>('[data-panel-sub-nav-id]')\n      ?.dataset['panelSubNavId'];\n    const focusedIndex = this.items.findIndex(item => item.id === focusedId);\n    const selectedIndex = this.items.findIndex(item => item.id === this.value && !item.isInactive);\n    const currentIndex = focusedIndex >= 0\n      ? focusedIndex\n      : selectedIndex >= 0\n        ? selectedIndex\n      : (event.key === 'ArrowUp' ? 0 : -1);\n    let nextIndex: number | null = null;\n\n    if (event.key === 'ArrowDown') {\n      nextIndex = this.findEnabled(currentIndex, 1);\n    } else if (event.key === 'ArrowUp') {\n      nextIndex = this.findEnabled(currentIndex, -1);\n    } else if (event.key === 'Home') {\n      nextIndex = this.items.findIndex(item => !item.isInactive);\n    } else if (event.key === 'End') {\n      const reversedIndex = [...this.items].reverse().findIndex(item => !item.isInactive);\n      nextIndex = reversedIndex < 0 ? null : this.items.length - 1 - reversedIndex;\n    }\n\n    if (nextIndex === null || nextIndex < 0) return;\n    const next = this.items[nextIndex];\n    if (!next || next.isInactive) return;\n\n    event.preventDefault();\n    this.selectItem(next.id);\n  }\n\n  render() {\n    const focusableId = this.focusableId;\n    const background = this.background;\n\n    return (\n      <Host>\n        <div\n          class=\"panel-sub-nav\"\n          role=\"tablist\"\n          aria-orientation=\"vertical\"\n          aria-label={this.ariaLabel}\n          aria-labelledby={this.ariaLabelledby}\n        >\n          {this.items.map(item => {\n            const isSelected = item.id === this.value;\n            return (\n              <button\n                id={item.id}\n                type=\"button\"\n                role=\"tab\"\n                data-panel-sub-nav-id={item.id}\n                class={{\n                  'panel-sub-nav__item': true,\n                  'panel-sub-nav__item--selected': isSelected,\n                  'ds-control--md': true,\n                  'ds-focus-ring-inset': true,\n                  'ds-interaction-fill': !item.isInactive,\n                  'ds-interaction-fill--selected': isSelected && !item.isInactive,\n                  'ds-interaction-fill--on-faint': background === 'faint',\n                  'ds-interaction-fill--on-medium': background === 'medium',\n                  'ds-interaction-fill--on-bold': background === 'bold',\n                  'ds-interaction-fill--on-strong': background === 'strong',\n                  'ds-interaction-fill--on-translucent': background === 'translucent',\n                  'ds-interaction-fill--on-inverted': background === 'inverted',\n                  'ds-interaction-fill--on-media': background === 'media',\n                  'ds-interaction-fill--on-always-dark': background === 'always-dark',\n                  [`panel-sub-nav__item--on-${background}`]: !!background,\n                  'ds-control-inactive': !!item.isInactive,\n                }}\n                aria-selected={isSelected ? 'true' : 'false'}\n                aria-controls={item.panelId}\n                aria-disabled={item.isInactive ? 'true' : undefined}\n                disabled={item.isInactive}\n                tabIndex={item.id === focusableId ? 0 : -1}\n                onClick={() => !item.isInactive && this.selectItem(item.id)}\n              >\n                <ds-text\n                  class=\"panel-sub-nav__label ds-interaction-fill__content\"\n                  as=\"span\"\n                  variant=\"text-body-medium\"\n                  color=\"inherit\"\n                >\n                  {item.label}\n                </ds-text>\n              </button>\n            );\n          })}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/ds-panel-tool-header.js

@@ -1,2 +1,2 @@
-import{P as o,d as s}from"./p-BHpWYKtP.js";const t=o;const p=s;export{t as DsPanelToolHeader,p as defineCustomElement};
+import{P as o,d as s}from"./p-DirD-b2y.js";const r=o;const t=s;export{r as DsPanelToolHeader,t as defineCustomElement};
 //# sourceMappingURL=ds-panel-tool-header.js.map

package/dist/components/ds-panel-tool-search.js

@@ -1,2 +1,2 @@
-import{p as e,H as s,c as t,h as a,a as o,t as r}from"./index.js";import{C as l}from"./p-CKaJx0IX.js";import{d as i}from"./p-CiwdnKKp.js";import{d as n}from"./p-Dst-OliP.js";import{d}from"./p-Ci_nVk5P.js";import{d as c}from"./p-CBYuvZKM.js";import{d as h}from"./p-Cpr3K41-.js";import{d as p}from"./p-BSOZXagj.js";const g=()=>`.ds-control--md.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search{--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-radius:var(--dimension-radius-025)}.ds-control--sm.sc-ds-panel-tool-search-h,.ds-control--sm.sc-ds-panel-tool-search{--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-radius:var(--dimension-radius-025)}.ds-control--xs.sc-ds-panel-tool-search-h,.ds-control--xs.sc-ds-panel-tool-search{--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-radius:var(--dimension-radius-025)}.select-search.sc-ds-panel-tool-search{position:relative;box-sizing:border-box;padding:var(--dimension-space-050);background:transparent}.select-search.sc-ds-panel-tool-search::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-panel-tool-search:focus-within::after{height:var(--dimension-stroke-width-018);background-color:var(--color-border-bold-brand)}.select-search__control.sc-ds-panel-tool-search{display:flex;align-items:center;box-sizing:border-box;gap:var(--ds-control-gap, var(--dimension-space-050));height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));border:0;border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.select-search__control.sc-ds-panel-tool-search:has(.select-search__clear){padding-right:0}.select-search__control.sc-ds-panel-tool-search>ds-icon.sc-ds-panel-tool-search{flex-shrink:0;color:var(--color-foreground-secondary)}.select-search.sc-ds-panel-tool-search .select-search__control.sc-ds-panel-tool-search>.select-search__clear.sc-ds-panel-tool-search{align-self:center;flex-shrink:0;margin-right:var(--dimension-space-050)}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search{flex:1;min-width:0;height:100%;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));border:0;outline:none;background:transparent;color:var(--color-foreground-primary);font-family:inherit}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search::placeholder{color:var(--color-foreground-secondary)}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search:focus::placeholder{color:var(--color-foreground-quaternary)}.select-search__control.sc-ds-panel-tool-search input[type='search'].sc-ds-panel-tool-search::-webkit-search-cancel-button,.select-search__control.sc-ds-panel-tool-search input[type='search'].sc-ds-panel-tool-search::-webkit-search-decoration{display:none}.ds-text--display-medium.sc-ds-panel-tool-search-h,.ds-text--display-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-panel-tool-search-h,.ds-text--display-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-panel-tool-search-h,.ds-text--title-large.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-panel-tool-search-h,.ds-text--title-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-panel-tool-search-h,.ds-text--title-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-panel-tool-search-h,.ds-text--body-large.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-panel-tool-search-h,.ds-text--body-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-panel-tool-search-h,.ds-text--body-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-panel-tool-search-h,.ds-text--caption.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-xs);line-height:var(--typography-lineheight-xs);text-transform:uppercase}.ds-text--display-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--display-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--display-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--display-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--display-medium.ds-text--regular.sc-ds-panel-tool-search,.ds-text--display-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-large.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-large.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--title-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-medium.ds-text--regular.sc-ds-panel-tool-search,.ds-text--title-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-large.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--body-medium.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-large.ds-text--regular.sc-ds-panel-tool-search,.ds-text--body-medium.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--caption.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--caption.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}.sc-ds-panel-tool-search-h{display:block;flex:0 0 var(--dimension-size-600);width:100%;min-width:0;height:var(--dimension-size-600);box-sizing:border-box;background:transparent}.panel-tool-search.sc-ds-panel-tool-search{position:relative;display:flex;align-items:center;gap:var(--dimension-space-100);width:100%;height:100%;padding:var(--dimension-space-100);box-sizing:border-box;background:transparent}.panel-tool-search.sc-ds-panel-tool-search::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-panel-tool-search{flex:1 1 auto;width:auto;min-width:0;height:var(--dimension-size-400);padding:0}.select-search.sc-ds-panel-tool-search::after{display:none}.panel-tool-search__filter-group.sc-ds-panel-tool-search{display:flex;flex:0 0 auto;align-items:center;gap:var(--dimension-space-100)}.panel-tool-search__divider.sc-ds-panel-tool-search,.panel-tool-search__filter.sc-ds-panel-tool-search{flex:0 0 auto}`;const m=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.dsClear=t(this,"dsClear");this.dsFilterToggle=t(this,"dsFilterToggle");this.value="";this.placeholder="Search";this.ariaLabel="Search";this.isInactive=false;this.showFilter=false;this.filterAriaLabel="Filter";this.filterTriggerId="";this.filterExpanded=false;this.filterActive=false;this.handleChange=e=>{this.value=e;this.dsChange.emit(e)}}componentDidRender(){const e=this.el.querySelector("input");if(e&&e.value!==this.value)e.value=this.value}async setFocus(){this.el.querySelector("input")?.focus()}async focusFilterTrigger(){const e=this.el.querySelector("ds-button-unfilled.panel-tool-search__filter");await(e?.setFocus?.())}render(){return a(o,{key:"81bd343f6cafd6728b489742ec6deb18b4e51c02"},a("div",{key:"528fb6802685f83fcbc08edd100d1f10cd9e3f25",class:"panel-tool-search"},a(l,{key:"183ad42768e2fe5bdbb1dae6ffc680c4ddb16bb8",value:this.value,placeholder:this.placeholder,ariaLabel:this.ariaLabel,controls:this.controls,disabled:this.isInactive,inputRef:()=>undefined,clearLabel:"Clear",onValueChange:this.handleChange,onClear:()=>this.dsClear.emit(),onKeyDown:()=>undefined}),this.showFilter?a("div",{class:"panel-tool-search__filter-group"},a("ds-divider",{class:"panel-tool-search__divider",orientation:"vertical",length:"var(--dimension-size-200)"}),a("ds-button-unfilled",{id:this.filterTriggerId||undefined,class:"panel-tool-search__filter",variant:"icon",icon:"Filters",size:"md","aria-label":this.filterAriaLabel,haspopup:"menu",controls:this.filterControls,expanded:this.filterExpanded,isActive:this.filterActive,isInactive:this.isInactive,activeFill:false,hasBorder:false,onDsChange:e=>{e.stopPropagation()},onDsClick:e=>{e.stopPropagation();this.dsFilterToggle.emit(e.detail)}})):null))}get el(){return this}static get style(){return g()}},[2,"ds-panel-tool-search",{value:[1025],placeholder:[1],ariaLabel:[1,"aria-label"],controls:[1],isInactive:[4,"is-inactive"],showFilter:[4,"show-filter"],filterAriaLabel:[1,"filter-aria-label"],filterTriggerId:[1,"filter-trigger-id"],filterControls:[1,"filter-controls"],filterExpanded:[4,"filter-expanded"],filterActive:[4,"filter-active"],setFocus:[64],focusFilterTrigger:[64]}]);function y(){if(typeof customElements==="undefined"){return}const e=["ds-panel-tool-search","ds-badge","ds-button-unfilled","ds-divider","ds-icon","ds-loader","ds-text"];e.forEach((e=>{switch(e){case"ds-panel-tool-search":if(!customElements.get(r(e))){customElements.define(r(e),m)}break;case"ds-badge":if(!customElements.get(r(e))){i()}break;case"ds-button-unfilled":if(!customElements.get(r(e))){n()}break;case"ds-divider":if(!customElements.get(r(e))){d()}break;case"ds-icon":if(!customElements.get(r(e))){c()}break;case"ds-loader":if(!customElements.get(r(e))){h()}break;case"ds-text":if(!customElements.get(r(e))){p()}break}}))}y();const x=m;const u=y;export{x as DsPanelToolSearch,u as defineCustomElement};
+import{p as e,H as s,c as t,h as a,a as o,t as l}from"./index.js";import{C as r}from"./p-CKaJx0IX.js";import{d as i}from"./p-DrDHC7V6.js";import{d as n}from"./p-DTqCBjUj.js";import{d}from"./p-BkwBtZs3.js";import{d as c}from"./p-DuNZGFkV.js";import{d as h}from"./p-Cpr3K41-.js";import{d as p}from"./p-CZZYGqKz.js";const g=()=>`.ds-control--md.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search,.ds-control--sm.sc-ds-panel-tool-search-h,.ds-control--sm.sc-ds-panel-tool-search,.ds-control--xs.sc-ds-panel-tool-search-h,.ds-control--xs.sc-ds-panel-tool-search{--ds-control-radius:var(--dimension-radius-025)}.ds-control--md.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-panel-tool-search-h,.ds-control--sm.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-panel-tool-search-h,.ds-control--xs.sc-ds-panel-tool-search{--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}.select-search.sc-ds-panel-tool-search{position:relative;box-sizing:border-box;padding:var(--dimension-space-050);background:transparent}.select-search.sc-ds-panel-tool-search::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-panel-tool-search:focus-within::after{height:var(--dimension-stroke-width-018);background-color:var(--color-border-bold-brand)}.select-search__control.sc-ds-panel-tool-search{display:flex;align-items:center;box-sizing:border-box;gap:var(--ds-control-gap, var(--dimension-space-050));height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));border:0;border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.select-search__control.sc-ds-panel-tool-search:has(.select-search__clear){padding-right:0}.select-search__control.sc-ds-panel-tool-search>ds-icon.sc-ds-panel-tool-search{flex-shrink:0;color:var(--color-foreground-secondary)}.select-search.sc-ds-panel-tool-search .select-search__control.sc-ds-panel-tool-search>.select-search__clear.sc-ds-panel-tool-search{align-self:center;flex-shrink:0;margin-right:var(--dimension-space-050)}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search{flex:1;min-width:0;height:100%;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));border:0;outline:none;background:transparent;color:var(--color-foreground-primary);font-family:inherit}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search::placeholder{color:var(--color-foreground-secondary)}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search:focus::placeholder{color:var(--color-foreground-quaternary)}.select-search__control.sc-ds-panel-tool-search input[type='search'].sc-ds-panel-tool-search::-webkit-search-cancel-button,.select-search__control.sc-ds-panel-tool-search input[type='search'].sc-ds-panel-tool-search::-webkit-search-decoration{display:none}.ds-text--display-medium.sc-ds-panel-tool-search-h,.ds-text--display-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-panel-tool-search-h,.ds-text--display-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-panel-tool-search-h,.ds-text--title-large.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-panel-tool-search-h,.ds-text--title-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-panel-tool-search-h,.ds-text--title-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-panel-tool-search-h,.ds-text--body-large.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-panel-tool-search-h,.ds-text--body-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-panel-tool-search-h,.ds-text--body-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-panel-tool-search-h,.ds-text--caption.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-xs);line-height:var(--typography-lineheight-xs);text-transform:uppercase}.ds-text--display-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--display-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--display-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--display-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--display-medium.ds-text--regular.sc-ds-panel-tool-search,.ds-text--display-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-large.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-large.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--title-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-medium.ds-text--regular.sc-ds-panel-tool-search,.ds-text--title-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-large.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--body-medium.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-large.ds-text--regular.sc-ds-panel-tool-search,.ds-text--body-medium.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--caption.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--caption.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}.sc-ds-panel-tool-search-h{display:block;flex:0 0 var(--dimension-size-600);width:100%;min-width:0;height:var(--dimension-size-600);box-sizing:border-box;background:transparent}.panel-tool-search.sc-ds-panel-tool-search{position:relative;display:flex;align-items:center;gap:var(--dimension-space-100);width:100%;height:100%;padding:var(--dimension-space-100);box-sizing:border-box;background:transparent}.panel-tool-search.sc-ds-panel-tool-search::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-panel-tool-search{flex:1 1 auto;width:auto;min-width:0;height:var(--dimension-size-400);padding:0}.select-search.sc-ds-panel-tool-search::after{display:none}.panel-tool-search__filter-group.sc-ds-panel-tool-search{display:flex;flex:0 0 auto;align-items:center;gap:var(--dimension-space-100)}.panel-tool-search__divider.sc-ds-panel-tool-search,.panel-tool-search__filter.sc-ds-panel-tool-search{flex:0 0 auto}`;const m=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.dsClear=t(this,"dsClear");this.dsFilterToggle=t(this,"dsFilterToggle");this.value="";this.placeholder="Search";this.ariaLabel="Search";this.isInactive=false;this.showFilter=false;this.filterAriaLabel="Filter";this.filterTriggerId="";this.filterExpanded=false;this.filterActive=false;this.handleChange=e=>{this.value=e;this.dsChange.emit(e)}}componentDidRender(){const e=this.el.querySelector("input");if(e&&e.value!==this.value)e.value=this.value}async setFocus(){this.el.querySelector("input")?.focus()}async focusFilterTrigger(){const e=this.el.querySelector("ds-button-unfilled.panel-tool-search__filter");await(e?.setFocus?.())}render(){return a(o,{key:"7a13682d07f8197fabe89da816457c8270a46d83"},a("div",{key:"84505b73d21aa472939962c43104956a4816f311",class:"panel-tool-search"},a(r,{key:"4eee9545acddc363ad9d8b680388697a259c20a2",value:this.value,placeholder:this.placeholder,ariaLabel:this.ariaLabel,controls:this.controls,disabled:this.isInactive,inputRef:()=>undefined,clearLabel:"Clear",onValueChange:this.handleChange,onClear:()=>this.dsClear.emit(),onKeyDown:()=>undefined}),this.showFilter?a("div",{class:"panel-tool-search__filter-group"},a("ds-divider",{class:"panel-tool-search__divider",orientation:"vertical",length:"var(--dimension-size-200)"}),a("ds-button-unfilled",{id:this.filterTriggerId||undefined,class:"panel-tool-search__filter",variant:"icon",icon:"Filters",size:"md","aria-label":this.filterAriaLabel,haspopup:"menu",controls:this.filterControls,expanded:this.filterExpanded,isActive:this.filterActive,isInactive:this.isInactive,activeFill:false,hasBorder:false,onDsChange:e=>{e.stopPropagation()},onDsClick:e=>{e.stopPropagation();this.dsFilterToggle.emit(e.detail)}})):null))}get el(){return this}static get style(){return g()}},[2,"ds-panel-tool-search",{value:[1025],placeholder:[1],ariaLabel:[1,"aria-label"],controls:[1],isInactive:[4,"is-inactive"],showFilter:[4,"show-filter"],filterAriaLabel:[1,"filter-aria-label"],filterTriggerId:[1,"filter-trigger-id"],filterControls:[1,"filter-controls"],filterExpanded:[4,"filter-expanded"],filterActive:[4,"filter-active"],setFocus:[64],focusFilterTrigger:[64]}]);function y(){if(typeof customElements==="undefined"){return}const e=["ds-panel-tool-search","ds-badge","ds-button-unfilled","ds-divider","ds-icon","ds-loader","ds-text"];e.forEach((e=>{switch(e){case"ds-panel-tool-search":if(!customElements.get(l(e))){customElements.define(l(e),m)}break;case"ds-badge":if(!customElements.get(l(e))){i()}break;case"ds-button-unfilled":if(!customElements.get(l(e))){n()}break;case"ds-divider":if(!customElements.get(l(e))){d()}break;case"ds-icon":if(!customElements.get(l(e))){c()}break;case"ds-loader":if(!customElements.get(l(e))){h()}break;case"ds-text":if(!customElements.get(l(e))){p()}break}}))}y();const x=m;const u=y;export{x as DsPanelToolSearch,u as defineCustomElement};
 //# sourceMappingURL=ds-panel-tool-search.js.map

package/dist/components/ds-panel-tool-search.js.map

@@ -1 +1 @@
-{"version":3,"names":["panelToolSearchCss","PanelToolSearch","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","placeholder","ariaLabel","isInactive","showFilter","filterAriaLabel","filterTriggerId","filterExpanded","filterActive","handleChange","dsChange","emit","componentDidRender","input","el","querySelector","setFocus","focus","focusFilterTrigger","trigger","render","h","Host","key","class","ChoiceSearch","controls","disabled","inputRef","undefined","clearLabel","onValueChange","onClear","dsClear","onKeyDown","orientation","length","id","variant","icon","size","haspopup","filterControls","expanded","isActive","activeFill","hasBorder","onDsChange","event","stopPropagation","onDsClick","dsFilterToggle","detail"],"sources":["src/wc/components/PanelToolSearch/PanelToolSearch.css?tag=ds-panel-tool-search&encapsulation=scoped","src/wc/components/PanelToolSearch/PanelToolSearch.tsx"],"sourcesContent":["@import '../../utils/control-density.css';\n@import '../../utils/search-control.css';\n@import '../../utils/typography.css';\n\n:host {\n  display: block;\n  flex: 0 0 var(--dimension-size-600);\n  width: 100%;\n  min-width: 0;\n  height: var(--dimension-size-600);\n  box-sizing: border-box;\n  background: transparent;\n}\n\n.panel-tool-search {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-100);\n  width: 100%;\n  height: 100%;\n  padding: var(--dimension-space-100);\n  box-sizing: border-box;\n  background: transparent;\n}\n\n.panel-tool-search::after {\n  content: '';\n  position: absolute;\n  inset: auto 0 0;\n  height: var(--dimension-stroke-width-012);\n  background-color: var(--color-border-tertiary);\n  pointer-events: none;\n}\n\n.select-search {\n  flex: 1 1 auto;\n  width: auto;\n  min-width: 0;\n  height: var(--dimension-size-400);\n  padding: 0;\n}\n\n.select-search::after {\n  display: none;\n}\n\n.panel-tool-search__filter-group {\n  display: flex;\n  flex: 0 0 auto;\n  align-items: center;\n  gap: var(--dimension-space-100);\n}\n\n.panel-tool-search__divider,\n.panel-tool-search__filter {\n  flex: 0 0 auto;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n} from '@stencil/core';\nimport { ChoiceSearch } from '../../utils/choice-list-parts';\n\n@Component({\n  tag: 'ds-panel-tool-search',\n  styleUrl: 'PanelToolSearch.css',\n  scoped: true,\n})\nexport class PanelToolSearch {\n  @Element() el!: HTMLElement;\n\n  /** Current search query. */\n  @Prop({ mutable: true }) value: string = '';\n  /** Search guidance shown while the query is empty. */\n  @Prop() placeholder: string = 'Search';\n  /** Accessible name for the search field. */\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string = 'Search';\n  /** Optional ID of the results region filtered by this search. */\n  @Prop() controls: string | undefined;\n  /** Prevents search interaction while keeping the row visible. */\n  @Prop() isInactive: boolean = false;\n  /** Show the optional trailing filter-menu trigger. */\n  @Prop() showFilter: boolean = false;\n  /** Accessible name for the filter-menu trigger. */\n  @Prop() filterAriaLabel: string = 'Filter';\n  /** Stable id placed on the filter trigger for ds-menu anchoring. */\n  @Prop() filterTriggerId: string = '';\n  /** Id of the menu controlled by the filter trigger. */\n  @Prop() filterControls: string | undefined;\n  /** Whether the controlled filter menu is open. */\n  @Prop() filterExpanded: boolean = false;\n  /** Promote the trigger foreground when one or more filters are applied. */\n  @Prop() filterActive: boolean = false;\n\n  @Event() dsChange!: EventEmitter<string>;\n  @Event() dsClear!: EventEmitter<void>;\n  @Event() dsFilterToggle!: EventEmitter<MouseEvent>;\n\n  componentDidRender() {\n    const input = this.el.querySelector('input');\n    if (input && input.value !== this.value) input.value = this.value;\n  }\n\n  @Method()\n  async setFocus() {\n    this.el.querySelector('input')?.focus();\n  }\n\n  @Method()\n  async focusFilterTrigger() {\n    const trigger = this.el.querySelector('ds-button-unfilled.panel-tool-search__filter') as\n      | (HTMLElement & { setFocus?: () => Promise<void> })\n      | null;\n    await trigger?.setFocus?.();\n  }\n\n  private handleChange = (value: string) => {\n    this.value = value;\n    this.dsChange.emit(value);\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"panel-tool-search\">\n          <ChoiceSearch\n            value={this.value}\n            placeholder={this.placeholder}\n            ariaLabel={this.ariaLabel}\n            controls={this.controls}\n            disabled={this.isInactive}\n            inputRef={() => undefined}\n            clearLabel=\"Clear\"\n            onValueChange={this.handleChange}\n            onClear={() => this.dsClear.emit()}\n            onKeyDown={() => undefined}\n          />\n          {this.showFilter ? (\n            <div class=\"panel-tool-search__filter-group\">\n              <ds-divider\n                class=\"panel-tool-search__divider\"\n                orientation=\"vertical\"\n                length=\"var(--dimension-size-200)\"\n              />\n              <ds-button-unfilled\n                id={this.filterTriggerId || undefined}\n                class=\"panel-tool-search__filter\"\n                variant=\"icon\"\n                icon=\"Filters\"\n                size=\"md\"\n                aria-label={this.filterAriaLabel}\n                haspopup=\"menu\"\n                controls={this.filterControls}\n                expanded={this.filterExpanded}\n                isActive={this.filterActive}\n                isInactive={this.isInactive}\n                activeFill={false}\n                hasBorder={false}\n                onDsChange={(event: CustomEvent<boolean>) => {\n                  event.stopPropagation();\n                }}\n                onDsClick={(event: CustomEvent<MouseEvent>) => {\n                  event.stopPropagation();\n                  this.dsFilterToggle.emit(event.detail);\n                }}\n              />\n            </div>\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yTAAA,MAAMA,EAAqB,IAAM,isS,MCiBpBC,EAAeC,EAAA,MAAAD,UAAAE,EAL5B,WAAAC,CAAAC,G,yJAS2BC,KAAAC,MAAgB,GAEjCD,KAAAE,YAAsB,SAEKF,KAAAG,UAAoB,SAI/CH,KAAAI,WAAsB,MAEtBJ,KAAAK,WAAsB,MAEtBL,KAAAM,gBAA0B,SAE1BN,KAAAO,gBAA0B,GAI1BP,KAAAQ,eAA0B,MAE1BR,KAAAS,aAAwB,MAwBxBT,KAAAU,aAAgBT,IACtBD,KAAKC,MAAQA,EACbD,KAAKW,SAASC,KAAKX,EAAM,CAsD5B,CA1EC,kBAAAY,GACE,MAAMC,EAAQd,KAAKe,GAAGC,cAAc,SACpC,GAAIF,GAASA,EAAMb,QAAUD,KAAKC,MAAOa,EAAMb,MAAQD,KAAKC,K,CAI9D,cAAMgB,GACJjB,KAAKe,GAAGC,cAAc,UAAUE,O,CAIlC,wBAAMC,GACJ,MAAMC,EAAUpB,KAAKe,GAAGC,cAAc,sDAGhCI,GAASH,a,CAQjB,MAAAI,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,qBACTH,EAACI,EAAY,CAAAF,IAAA,2CACXvB,MAAOD,KAAKC,MACZC,YAAaF,KAAKE,YAClBC,UAAWH,KAAKG,UAChBwB,SAAU3B,KAAK2B,SACfC,SAAU5B,KAAKI,WACfyB,SAAU,IAAMC,UAChBC,WAAW,QACXC,cAAehC,KAAKU,aACpBuB,QAAS,IAAMjC,KAAKkC,QAAQtB,OAC5BuB,UAAW,IAAML,YAElB9B,KAAKK,WACJiB,EAAA,OAAKG,MAAM,mCACTH,EAAA,cACEG,MAAM,6BACNW,YAAY,WACZC,OAAO,8BAETf,EAAA,sBACEgB,GAAItC,KAAKO,iBAAmBuB,UAC5BL,MAAM,4BACNc,QAAQ,OACRC,KAAK,UACLC,KAAK,KAAI,aACGzC,KAAKM,gBACjBoC,SAAS,OACTf,SAAU3B,KAAK2C,eACfC,SAAU5C,KAAKQ,eACfqC,SAAU7C,KAAKS,aACfL,WAAYJ,KAAKI,WACjB0C,WAAY,MACZC,UAAW,MACXC,WAAaC,IACXA,EAAMC,iBAAiB,EAEzBC,UAAYF,IACVA,EAAMC,kBACNlD,KAAKoD,eAAexC,KAAKqC,EAAMI,OAAO,KAI1C,M","ignoreList":[]}
+{"version":3,"names":["panelToolSearchCss","PanelToolSearch","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","placeholder","ariaLabel","isInactive","showFilter","filterAriaLabel","filterTriggerId","filterExpanded","filterActive","handleChange","dsChange","emit","componentDidRender","input","el","querySelector","setFocus","focus","focusFilterTrigger","trigger","render","h","Host","key","class","ChoiceSearch","controls","disabled","inputRef","undefined","clearLabel","onValueChange","onClear","dsClear","onKeyDown","orientation","length","id","variant","icon","size","haspopup","filterControls","expanded","isActive","activeFill","hasBorder","onDsChange","event","stopPropagation","onDsClick","dsFilterToggle","detail"],"sources":["src/wc/components/PanelToolSearch/PanelToolSearch.css?tag=ds-panel-tool-search&encapsulation=scoped","src/wc/components/PanelToolSearch/PanelToolSearch.tsx"],"sourcesContent":["@import '../../utils/control-density.css';\n@import '../../utils/search-control.css';\n@import '../../utils/typography.css';\n\n:host {\n  display: block;\n  flex: 0 0 var(--dimension-size-600);\n  width: 100%;\n  min-width: 0;\n  height: var(--dimension-size-600);\n  box-sizing: border-box;\n  background: transparent;\n}\n\n.panel-tool-search {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-100);\n  width: 100%;\n  height: 100%;\n  padding: var(--dimension-space-100);\n  box-sizing: border-box;\n  background: transparent;\n}\n\n.panel-tool-search::after {\n  content: '';\n  position: absolute;\n  inset: auto 0 0;\n  height: var(--dimension-stroke-width-012);\n  background-color: var(--color-border-tertiary);\n  pointer-events: none;\n}\n\n.select-search {\n  flex: 1 1 auto;\n  width: auto;\n  min-width: 0;\n  height: var(--dimension-size-400);\n  padding: 0;\n}\n\n.select-search::after {\n  display: none;\n}\n\n.panel-tool-search__filter-group {\n  display: flex;\n  flex: 0 0 auto;\n  align-items: center;\n  gap: var(--dimension-space-100);\n}\n\n.panel-tool-search__divider,\n.panel-tool-search__filter {\n  flex: 0 0 auto;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n} from '@stencil/core';\nimport { ChoiceSearch } from '../../utils/choice-list-parts';\n\n@Component({\n  tag: 'ds-panel-tool-search',\n  styleUrl: 'PanelToolSearch.css',\n  scoped: true,\n})\nexport class PanelToolSearch {\n  @Element() el!: HTMLElement;\n\n  /** Current search query. */\n  @Prop({ mutable: true }) value: string = '';\n  /** Search guidance shown while the query is empty. */\n  @Prop() placeholder: string = 'Search';\n  /** Accessible name for the search field. */\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string = 'Search';\n  /** Optional ID of the results region filtered by this search. */\n  @Prop() controls: string | undefined;\n  /** Prevents search interaction while keeping the row visible. */\n  @Prop() isInactive: boolean = false;\n  /** Show the optional trailing filter-menu trigger. */\n  @Prop() showFilter: boolean = false;\n  /** Accessible name for the filter-menu trigger. */\n  @Prop() filterAriaLabel: string = 'Filter';\n  /** Stable id placed on the filter trigger for ds-menu anchoring. */\n  @Prop() filterTriggerId: string = '';\n  /** Id of the menu controlled by the filter trigger. */\n  @Prop() filterControls: string | undefined;\n  /** Whether the controlled filter menu is open. */\n  @Prop() filterExpanded: boolean = false;\n  /** Promote the trigger foreground when one or more filters are applied. */\n  @Prop() filterActive: boolean = false;\n\n  @Event() dsChange!: EventEmitter<string>;\n  @Event() dsClear!: EventEmitter<void>;\n  @Event() dsFilterToggle!: EventEmitter<MouseEvent>;\n\n  componentDidRender() {\n    const input = this.el.querySelector('input');\n    if (input && input.value !== this.value) input.value = this.value;\n  }\n\n  @Method()\n  async setFocus() {\n    this.el.querySelector('input')?.focus();\n  }\n\n  @Method()\n  async focusFilterTrigger() {\n    const trigger = this.el.querySelector('ds-button-unfilled.panel-tool-search__filter') as\n      | (HTMLElement & { setFocus?: () => Promise<void> })\n      | null;\n    await trigger?.setFocus?.();\n  }\n\n  private handleChange = (value: string) => {\n    this.value = value;\n    this.dsChange.emit(value);\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"panel-tool-search\">\n          <ChoiceSearch\n            value={this.value}\n            placeholder={this.placeholder}\n            ariaLabel={this.ariaLabel}\n            controls={this.controls}\n            disabled={this.isInactive}\n            inputRef={() => undefined}\n            clearLabel=\"Clear\"\n            onValueChange={this.handleChange}\n            onClear={() => this.dsClear.emit()}\n            onKeyDown={() => undefined}\n          />\n          {this.showFilter ? (\n            <div class=\"panel-tool-search__filter-group\">\n              <ds-divider\n                class=\"panel-tool-search__divider\"\n                orientation=\"vertical\"\n                length=\"var(--dimension-size-200)\"\n              />\n              <ds-button-unfilled\n                id={this.filterTriggerId || undefined}\n                class=\"panel-tool-search__filter\"\n                variant=\"icon\"\n                icon=\"Filters\"\n                size=\"md\"\n                aria-label={this.filterAriaLabel}\n                haspopup=\"menu\"\n                controls={this.filterControls}\n                expanded={this.filterExpanded}\n                isActive={this.filterActive}\n                isInactive={this.isInactive}\n                activeFill={false}\n                hasBorder={false}\n                onDsChange={(event: CustomEvent<boolean>) => {\n                  event.stopPropagation();\n                }}\n                onDsClick={(event: CustomEvent<MouseEvent>) => {\n                  event.stopPropagation();\n                  this.dsFilterToggle.emit(event.detail);\n                }}\n              />\n            </div>\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yTAAA,MAAMA,EAAqB,IAAM,u1S,MCiBpBC,EAAeC,EAAA,MAAAD,UAAAE,EAL5B,WAAAC,CAAAC,G,yJAS2BC,KAAAC,MAAgB,GAEjCD,KAAAE,YAAsB,SAEKF,KAAAG,UAAoB,SAI/CH,KAAAI,WAAsB,MAEtBJ,KAAAK,WAAsB,MAEtBL,KAAAM,gBAA0B,SAE1BN,KAAAO,gBAA0B,GAI1BP,KAAAQ,eAA0B,MAE1BR,KAAAS,aAAwB,MAwBxBT,KAAAU,aAAgBT,IACtBD,KAAKC,MAAQA,EACbD,KAAKW,SAASC,KAAKX,EAAM,CAsD5B,CA1EC,kBAAAY,GACE,MAAMC,EAAQd,KAAKe,GAAGC,cAAc,SACpC,GAAIF,GAASA,EAAMb,QAAUD,KAAKC,MAAOa,EAAMb,MAAQD,KAAKC,K,CAI9D,cAAMgB,GACJjB,KAAKe,GAAGC,cAAc,UAAUE,O,CAIlC,wBAAMC,GACJ,MAAMC,EAAUpB,KAAKe,GAAGC,cAAc,sDAGhCI,GAASH,a,CAQjB,MAAAI,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,qBACTH,EAACI,EAAY,CAAAF,IAAA,2CACXvB,MAAOD,KAAKC,MACZC,YAAaF,KAAKE,YAClBC,UAAWH,KAAKG,UAChBwB,SAAU3B,KAAK2B,SACfC,SAAU5B,KAAKI,WACfyB,SAAU,IAAMC,UAChBC,WAAW,QACXC,cAAehC,KAAKU,aACpBuB,QAAS,IAAMjC,KAAKkC,QAAQtB,OAC5BuB,UAAW,IAAML,YAElB9B,KAAKK,WACJiB,EAAA,OAAKG,MAAM,mCACTH,EAAA,cACEG,MAAM,6BACNW,YAAY,WACZC,OAAO,8BAETf,EAAA,sBACEgB,GAAItC,KAAKO,iBAAmBuB,UAC5BL,MAAM,4BACNc,QAAQ,OACRC,KAAK,UACLC,KAAK,KAAI,aACGzC,KAAKM,gBACjBoC,SAAS,OACTf,SAAU3B,KAAK2C,eACfC,SAAU5C,KAAKQ,eACfqC,SAAU7C,KAAKS,aACfL,WAAYJ,KAAKI,WACjB0C,WAAY,MACZC,UAAW,MACXC,WAAaC,IACXA,EAAMC,iBAAiB,EAEzBC,UAAYF,IACVA,EAAMC,kBACNlD,KAAKoD,eAAexC,KAAKqC,EAAMI,OAAO,KAI1C,M","ignoreList":[]}

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

@@ -1,2 +1,2 @@
-import{p as e,H as s,c as t,h as o,a as i,t as n}from"./index.js";import{p as a}from"./p-BOQnc-M4.js";import{p as l}from"./p-BHtg1fh3.js";import{d as r}from"./p-CiwdnKKp.js";import{d}from"./p-Dst-OliP.js";import{d as c}from"./p-CBYuvZKM.js";import{d as h}from"./p-Cpr3K41-.js";import{d as p}from"./p-BHpWYKtP.js";import{d as f}from"./p-BSOZXagj.js";import{d as u}from"./p-BO6C8abO.js";const m=["search","agents","messages","stacks","activity","help"];const g="search";const v="help";const _={search:"Search",messages:"Messages",stacks:"Stacks",activity:"Activity",agents:"Agents",help:"Help & Support"};const b={search:"K",agents:"A",messages:"M",stacks:"S",activity:"N",help:"?"};function w(e,s){if(s){return a(s,[])}return e??[]}function y(e){const s=new Map;for(const t of e){if(!s.has(t.id))s.set(t.id,t)}return m.flatMap((e=>{const t=s.get(e);return t?[t]:[]}))}function x(e){return e!==null&&m.includes(e)}function k(e,s,t){if(!t||e.some((e=>e.id===t))){return{open:s,activeTool:t,removedTool:""}}return{open:false,activeTool:"",removedTool:t}}function C(e){const s=e.transitionProperty.split(",").map((e=>e.trim()));const t=e.transitionDuration.split(",").map((e=>l(e.trim(),0)));const o=e.transitionDelay.split(",").map((e=>l(e.trim(),0)));return s.reduce(((e,s,i)=>{if(s!=="all"&&s!=="max-width")return e;const n=t[i%t.length]??0;const a=o[i%o.length]??0;return Math.max(e,n+a,0)}),0)}function T(e,s){return!e&&s==="idle"}function A(e,s,t){if(t==="closing")return e<=.5;if(t==="opening")return s>0&&e>=s-.5;return true}function z(e,s,t){if(e&&s===t){return{open:false,activeTool:t,selected:false}}return{open:true,activeTool:t,selected:true}}const S=()=>`.ds-control--md.sc-ds-panel-tools-h,.ds-control--md.sc-ds-panel-tools{--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-radius:var(--dimension-radius-025)}.ds-control--sm.sc-ds-panel-tools-h,.ds-control--sm.sc-ds-panel-tools{--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-radius:var(--dimension-radius-025)}.ds-control--xs.sc-ds-panel-tools-h,.ds-control--xs.sc-ds-panel-tools{--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-radius:var(--dimension-radius-025)}.sc-ds-panel-tools-h{display:block;flex:0 0 auto;box-sizing:border-box;height:100%;min-height:0;overflow:hidden;--_panel-tools-rail-width:var(--dimension-size-600);--_panel-tools-drawer-width:var(--ds-shell-panel-tools-width, var(--dimension-panel-width-xs));--_panel-tools-border:var(--dimension-stroke-width-012, 1px) solid var(--color-border-tertiary);--_panel-tools-expand-dur:var(--effect-animation-duration-medium-1, 300ms)}.panel-tools__layout.sc-ds-panel-tools{display:flex;flex-direction:row-reverse;align-items:stretch;height:100%;min-height:0;box-sizing:border-box}.panel-tools__drawer.sc-ds-panel-tools{flex:0 0 auto;max-width:0;min-width:0;height:100%;min-height:0;overflow:hidden;box-sizing:border-box;transition:none}.panel-tools--ready.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:max-width var(--_panel-tools-expand-dur)     var(--effect-animation-easing-ease-in-out, ease)}.panel-tools--ready.panel-tools--motion-opening.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:max-width var(--_panel-tools-expand-dur)     var(--effect-animation-easing-ease-out, ease-out)}.panel-tools--ready.panel-tools--motion-closing.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:max-width var(--_panel-tools-expand-dur)     var(--effect-animation-easing-ease-in, ease-in)}.panel-tools--open.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{max-width:var(--_panel-tools-drawer-width)}.panel-tools__drawer--visible.sc-ds-panel-tools{border-left:var(--_panel-tools-border)}.panel-tools__drawer-surface.sc-ds-panel-tools{display:flex;flex-direction:column;width:var(--_panel-tools-drawer-width);height:100%;min-height:0;box-sizing:border-box;background-color:transparent}.panel-tools__full-views.sc-ds-panel-tools,.panel-tools__full-view.sc-ds-panel-tools{flex:1 1 auto;min-height:0;overflow:hidden}.panel-tools__full-view.sc-ds-panel-tools{height:100%}.panel-tools__full-view.sc-ds-panel-tools{display:none}.panel-tools__full-view--active.sc-ds-panel-tools{display:block}[presentation='fullscreen'].sc-ds-panel-tools-h{height:100vh;inset:0;position:fixed;width:100vw;z-index:var(--dimension-z-index-modal)}[presentation='fullscreen'].sc-ds-panel-tools-h .panel-tools__rail.sc-ds-panel-tools{display:none}[presentation='fullscreen'].sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{max-width:100vw;transition:none;width:100vw}[presentation='fullscreen'].sc-ds-panel-tools-h .panel-tools__drawer--visible.sc-ds-panel-tools{border-left:none}[presentation='fullscreen'].sc-ds-panel-tools-h .panel-tools__drawer-surface.sc-ds-panel-tools{background-color:transparent;width:100vw}.panel-tools--presentation-snap.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:none}.panel-tools__body.sc-ds-panel-tools{flex:1 1 auto;min-height:0;overflow:auto;position:relative}.panel-tools--drawer-resting.sc-ds-panel-tools-h .panel-tools__body.sc-ds-panel-tools{content-visibility:auto;contain-intrinsic-size:auto 200px}.panel-tools__view.sc-ds-panel-tools{display:none;height:100%;min-height:0;box-sizing:border-box;padding:var(--dimension-space-200);color:var(--color-foreground-secondary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.panel-tools__view.sc-ds-panel-tools-s>*,.panel-tools__view .sc-ds-panel-tools-s>*{margin:0;color:var(--color-foreground-secondary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.panel-tools__view--active.sc-ds-panel-tools{display:block}.panel-tools__rail.sc-ds-panel-tools{flex:0 0 var(--_panel-tools-rail-width);width:var(--_panel-tools-rail-width);min-width:var(--_panel-tools-rail-width);display:flex;flex-direction:column;box-sizing:border-box;height:100%;min-height:0;border-left:var(--_panel-tools-border);background-color:transparent}.panel-tools__rail-header.sc-ds-panel-tools{display:flex;align-items:center;justify-content:center;height:var(--dimension-size-600);padding:var(--dimension-space-100);flex-shrink:0;box-sizing:border-box;border-bottom:var(--_panel-tools-border)}.panel-tools__rail-body.sc-ds-panel-tools{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-100);box-sizing:border-box;scrollbar-width:none}.panel-tools__rail-body.sc-ds-panel-tools::-webkit-scrollbar{display:none}.panel-tools__rail-footer.sc-ds-panel-tools{display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:auto;padding:var(--dimension-space-100);box-sizing:border-box}.panel-tools__rail-action.sc-ds-panel-tools{display:flex;align-items:center;justify-content:center;width:100%;height:var(--ds-control-height);flex-shrink:0}@media (prefers-reduced-motion: reduce){.panel-tools--ready.panel-tools--motion-opening.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools,.panel-tools--ready.panel-tools--motion-closing.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:none}}`;const j=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsToolChange=t(this,"dsToolChange");this.dsPresentationChange=t(this,"dsPresentationChange");this.dsHeaderBack=t(this,"dsHeaderBack");this.dsHeaderAction=t(this,"dsHeaderAction");this.dsChromeTransitionStart=t(this,"dsChromeTransitionStart");this.dsChromeTransitionEnd=t(this,"dsChromeTransitionEnd");this.open=false;this.presentation="drawer";this.fullscreenHeaderMode="shared";this.activeTool="";this.items=[];this.itemsJson="";this.toolsLabel="Tools";this.toolShortcutsLabel="Tool shortcuts";this.headers={};this.headersJson="";this.storageKey="";this.motion="idle";this.drawerSurfaceRetained=false;this.readyForMotion=false;this.presentationMotionSuppressed=false;this.rovingIndex=0;this.fullViewToolIds=[];this.motionEnableGeneration=0;this.presentationMotionGeneration=0;this.transitionGeneration=0;this.transitionFallbackTimer=null;this.ignoreReplacementTerminal=false;this.focusBeforeFullscreen=null;this.fullViewObserver=null;this.handleComposedHeaderAction=e=>{const s=e.detail;if(!this.activeTool||!s?.id)return;e.stopPropagation();this.dsHeaderAction.emit({tool:this.activeTool,id:s.id})};this.handleTransitionEnd=e=>{const s=this.el.querySelector(".panel-tools__drawer");if(e.target!==s)return;if(e.propertyName!=="max-width")return;if(this.ignoreReplacementTerminal){this.ignoreReplacementTerminal=false;return}if(e.type==="transitioncancel")return;if(s&&!this.drawerTransitionAtTerminal(s,this.motion))return;this.finishDrawerTransition()};this.handleToolChange=e=>{const s=z(this.open,this.activeTool,e);this.open=s.open;this.activeTool=s.activeTool;this.dsToolChange.emit({id:e,selected:s.selected})};this.handleRailKeyDown=(e,s)=>{const t=this.orderedRailItems;if(!t.length)return;if(e.key==="Enter"||e.key===" "){e.preventDefault();this.handleToolChange(t[s].id);return}if(e.key==="ArrowDown"){if(s>=t.length-1)return;e.preventDefault();this.focusRailAt(s+1);return}if(e.key==="ArrowUp"){if(s<=0)return;e.preventDefault();this.focusRailAt(s-1)}}}get railItems(){return w(this.items,this.itemsJson)}get orderedRailItems(){const e=y(this.railItems);const s=e.find((e=>e.id===g));const t=e.find((e=>e.id===v));const o=e.filter((e=>e.id!==g&&e.id!==v));const i=[];if(s)i.push(s);i.push(...o);if(t)i.push(t);return i}disconnectedCallback(){this.el.removeEventListener("transitionend",this.handleTransitionEnd);this.el.removeEventListener("transitioncancel",this.handleTransitionEnd);this.el.removeEventListener("dsAction",this.handleComposedHeaderAction);this.clearTransitionCompletion();this.motionEnableGeneration+=1;this.fullViewObserver?.disconnect();this.fullViewObserver=null}presentationChanged(e,t){if(e===t)return;const o=++this.presentationMotionGeneration;this.presentationMotionSuppressed=true;requestAnimationFrame((()=>{requestAnimationFrame((()=>{if(o!==this.presentationMotionGeneration)return;this.presentationMotionSuppressed=false}))}));if(e==="fullscreen"){this.focusBeforeFullscreen=document.activeElement instanceof s?document.activeElement:null;this.open=true}else if(t==="fullscreen"){const e=this.focusBeforeFullscreen;const s=this.activeHeader().actions?.[0]?.id;requestAnimationFrame((async()=>{if(e?.isConnected){e.focus({preventScroll:true})}const t=e?document.activeElement===e||e.contains(document.activeElement):false;if(!t&&s)await this.focusHeaderAction(s);this.focusBeforeFullscreen=null}))}this.dsPresentationChange.emit({presentation:e})}handleFullscreenEscape(e){if(this.presentation!=="fullscreen"||e.key!=="Escape")return;e.preventDefault();e.stopPropagation();this.presentation="drawer"}deferMotionEnable(){if(this.readyForMotion)return;const e=++this.motionEnableGeneration;requestAnimationFrame((()=>{if(e!==this.motionEnableGeneration)return;requestAnimationFrame((()=>{if(e!==this.motionEnableGeneration)return;this.readyForMotion=true}))}))}connectedCallback(){this.el.addEventListener("transitionend",this.handleTransitionEnd);this.el.addEventListener("transitioncancel",this.handleTransitionEnd);this.el.addEventListener("dsAction",this.handleComposedHeaderAction)}componentWillLoad(){this.restoreLastActiveTool();this.drawerSurfaceRetained=this.open}openChanged(e,s){if(e)this.drawerSurfaceRetained=true;if(this.readyForMotion&&s!==undefined&&s!==e){this.startDrawerTransition(e?"opening":"closing")}else if(!e){this.drawerSurfaceRetained=false}this.deferMotionEnable()}activeToolChanged(){this.persistLastActiveTool();this.deferMotionEnable()}storageKeyChanged(){this.restoreLastActiveTool()}componentDidLoad(){this.deferMotionEnable();this.syncFullViewTools();this.fullViewObserver=new MutationObserver((()=>this.syncFullViewTools()));this.fullViewObserver.observe(this.el,{childList:true,attributes:true,attributeFilter:["slot"]})}itemsChanged(){this.rovingIndex=0;this.reconcileActiveTool();this.deferMotionEnable()}restoreLastActiveTool(){if(!this.storageKey||this.activeTool)return;try{const e=localStorage.getItem(this.storageKey);if(x(e))this.activeTool=e}catch{}}persistLastActiveTool(){if(!this.storageKey||!this.activeTool)return;try{localStorage.setItem(this.storageKey,this.activeTool)}catch{}}clearPersistedTool(){if(!this.storageKey)return;try{localStorage.removeItem(this.storageKey)}catch{}}reconcileActiveTool(){const e=k(this.railItems,this.open,this.activeTool);if(!e.removedTool)return;this.clearPersistedTool();this.open=e.open;this.activeTool=e.activeTool;this.dsToolChange.emit({id:e.removedTool,selected:false})}startDrawerTransition(e){const s=this.el.querySelector(".panel-tools__drawer");if(this.motion!=="idle"){this.finishDrawerTransition();this.ignoreReplacementTerminal=true}this.motion=e;this.dsChromeTransitionStart.emit({source:"panel-tools",phase:e});const t=++this.transitionGeneration;requestAnimationFrame((()=>{requestAnimationFrame((()=>{if(t!==this.transitionGeneration||this.motion!==e)return;if(!s){this.finishDrawerTransition();return}if(this.drawerTransitionAtTerminal(s,e)){this.finishDrawerTransition();return}const o=C(getComputedStyle(s));if(o<=0){this.finishDrawerTransition();return}this.transitionFallbackTimer=window.setTimeout((()=>{this.finishDrawerTransition()}),o)}))}))}drawerTransitionAtTerminal(e,s){const t=e.getBoundingClientRect().width;const o=e.querySelector(".panel-tools__drawer-surface");const i=o?.getBoundingClientRect().width??0;return A(t,i,s)}finishDrawerTransition(){const e=this.motion;const s=e!=="idle";this.clearTransitionCompletion();if(!s)return;this.ignoreReplacementTerminal=false;this.motion="idle";if(e==="closing"&&!this.open){this.drawerSurfaceRetained=false}this.dsChromeTransitionEnd.emit({source:"panel-tools"})}clearTransitionCompletion(){this.transitionGeneration+=1;if(this.transitionFallbackTimer!==null){window.clearTimeout(this.transitionFallbackTimer);this.transitionFallbackTimer=null}}isRailSelected(e){return this.open&&this.activeTool===e}isDrawerPresent(){return this.open||this.drawerSurfaceRetained}isViewActive(e){return this.isDrawerPresent()&&this.activeTool===e}hasFullView(e){return this.fullViewToolIds.includes(e)}syncFullViewTools(){const e=["search","messages","stacks","activity","agents","help"];const s=e.filter((e=>Boolean(this.el.querySelector(`[slot="${e}-view"]`))));if(s.join("|")!==this.fullViewToolIds.join("|"))this.fullViewToolIds=s}headerLabel(){if(!this.isDrawerPresent()||!this.activeTool)return"";return _[this.activeTool]??""}resolvedHeaders(){if(Object.keys(this.headers).length)return this.headers;if(!this.headersJson.trim())return{};try{const e=JSON.parse(this.headersJson);return e&&typeof e==="object"&&!Array.isArray(e)?e:{}}catch{return{}}}activeHeader(){if(!this.activeTool)return{};return this.resolvedHeaders()[this.activeTool]??{}}async activateTool(e){const s=this.railItems.find((s=>s.id===e));if(!s||s.isInactive)return;this.handleToolChange(e)}async closeDrawer(){if(!this.open)return;const e=this.activeTool;this.open=false;if(e){this.dsToolChange.emit({id:e,selected:false})}}async focusHeaderAction(e){const s=this.el.querySelector(`[data-header-action-id="${CSS.escape(e)}"]`);await(s?.setFocus?.())}focusRailAt(e){const s=this.orderedRailItems;if(!s.length)return;const t=Math.max(0,Math.min(e,s.length-1));if(t===this.rovingIndex)return;this.rovingIndex=t;const o=Array.from(this.el.querySelectorAll(".panel-tools__rail-action .button-icon"));o[t]?.focus({preventScroll:true})}renderRailAction(e,s){const t=e.ariaLabel??_[e.id];return o("ds-tooltip",{key:e.id,label:t,shortcutKey:b[e.id],side:"left",size:"sm"},o("ds-button-unfilled",{variant:"icon",class:"panel-tools__rail-action",icon:e.icon,isActive:this.isRailSelected(e.id),activeFill:false,hasBorder:false,dot:e.dot??false,isInactive:e.isInactive,focusTabIndex:s===this.rovingIndex?0:-1,"aria-label":t,pressed:this.isRailSelected(e.id),onFocusin:()=>{this.rovingIndex=s},onKeyDown:e=>this.handleRailKeyDown(e,s),onDsClick:()=>this.handleToolChange(e.id)}))}render(){const e=this.headerLabel();const s=this.activeHeader();const t=s.title?.trim()||e;const n=s.actions??[];const a=this.orderedRailItems;const l=a.find((e=>e.id===g));const r=a.find((e=>e.id===v));const d=a.filter((e=>e.id!==g&&e.id!==v));const c=r?(l?1:0)+d.length:-1;const h=this.isDrawerPresent();const p=T(this.open,this.motion);const f=Boolean(h&&this.activeTool&&this.hasFullView(this.activeTool));const u=["search","messages","stacks","activity","agents","help"];return o(i,{key:"35b05dd1b26e7305bbc98078e33d2884adae5c53",class:{"panel-tools":true,"panel-tools--open":this.open,"panel-tools--ready":this.readyForMotion,"panel-tools--motion-opening":this.motion==="opening","panel-tools--motion-closing":this.motion==="closing","panel-tools--drawer-resting":p,"panel-tools--fullscreen":this.presentation==="fullscreen","panel-tools--presentation-snap":this.presentationMotionSuppressed},role:this.presentation==="fullscreen"?"dialog":"complementary","aria-modal":this.presentation==="fullscreen"?"true":undefined,"aria-label":this.toolsLabel},o("div",{key:"8dffdedaf7cbe6d36af423da01cdc635b9f80a19",class:"panel-tools__layout"},o("nav",{key:"6fa3613d670f98007e84a06fa91f6b1dc60f8d5b",class:"panel-tools__rail","aria-label":this.toolShortcutsLabel},l?o("div",{class:"panel-tools__rail-header"},this.renderRailAction(l,0)):null,o("div",{key:"ee7de9480aefa76021f091256c14b28230d6af0c",class:"panel-tools__rail-body"},d.map(((e,s)=>this.renderRailAction(e,l?s+1:s)))),r?o("div",{class:"panel-tools__rail-footer"},this.renderRailAction(r,c)):null),o("div",{key:"f4357997b0189740bfcaf0dafbfa5e081410999f",class:{"panel-tools__drawer":true,"panel-tools__drawer--visible":h},"aria-hidden":h?null:"true",inert:h?undefined:true},o("div",{key:"d5ea635f71abf05a4089fad07b3286a4d6fb9ae0",class:"panel-tools__drawer-surface"},this.presentation!=="fullscreen"||this.fullscreenHeaderMode==="shared"?o("ds-panel-tool-header",{class:"panel-tools__header",heading:t,showBack:s.showBack??false,backIcon:s.backIcon||"ChevronLeft",backAriaLabel:s.backAriaLabel||"Back",showMenu:false,ref:e=>{const s=e;if(s)s.actions=n},onDsBack:()=>{if(this.activeTool)this.dsHeaderBack.emit({tool:this.activeTool})}}):null,o("div",{key:"4e0c987c947b9381cd988d3de7b6ff11eec83a74",class:"panel-tools__body",hidden:f},u.map((e=>{const s=this.isViewActive(e);return o("div",{class:{"panel-tools__view":true,"panel-tools__view--active":s},hidden:!s},o("slot",{name:e}))}))),o("div",{key:"6108f7fd96f32c1021da81bccf3a4cc03b915410",class:"panel-tools__full-views",hidden:!f},u.map((e=>o("div",{class:{"panel-tools__full-view":true,"panel-tools__full-view--active":this.isViewActive(e)&&this.hasFullView(e)},hidden:!(this.isViewActive(e)&&this.hasFullView(e))},o("slot",{name:`${e}-view`})))))))))}get el(){return this}static get watchers(){return{presentation:[{presentationChanged:0}],open:[{openChanged:0}],activeTool:[{activeToolChanged:0}],storageKey:[{storageKeyChanged:0}],items:[{itemsChanged:0}],itemsJson:[{itemsChanged:0}]}}static get style(){return S()}},[262,"ds-panel-tools",{open:[1540],presentation:[1537],fullscreenHeaderMode:[513,"fullscreen-header-mode"],activeTool:[1537,"active-tool"],items:[16],itemsJson:[1,"items-json"],toolsLabel:[1,"tools-label"],toolShortcutsLabel:[1,"tool-shortcuts-label"],headers:[16],headersJson:[1,"headers-json"],storageKey:[1,"storage-key"],motion:[32],drawerSurfaceRetained:[32],readyForMotion:[32],presentationMotionSuppressed:[32],rovingIndex:[32],fullViewToolIds:[32],activateTool:[64],closeDrawer:[64],focusHeaderAction:[64]},[[10,"keydown","handleFullscreenEscape"]],{presentation:[{presentationChanged:0}],open:[{openChanged:0}],activeTool:[{activeToolChanged:0}],storageKey:[{storageKeyChanged:0}],items:[{itemsChanged:0}],itemsJson:[{itemsChanged:0}]}]);function E(){if(typeof customElements==="undefined"){return}const e=["ds-panel-tools","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-panel-tool-header","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-panel-tools":if(!customElements.get(n(e))){customElements.define(n(e),j)}break;case"ds-badge":if(!customElements.get(n(e))){r()}break;case"ds-button-unfilled":if(!customElements.get(n(e))){d()}break;case"ds-icon":if(!customElements.get(n(e))){c()}break;case"ds-loader":if(!customElements.get(n(e))){h()}break;case"ds-panel-tool-header":if(!customElements.get(n(e))){p()}break;case"ds-text":if(!customElements.get(n(e))){f()}break;case"ds-tooltip":if(!customElements.get(n(e))){u()}break}}))}E();const F=j;const K=E;export{F as DsPanelTools,K as defineCustomElement};
+import{p as s,H as e,c as t,h as o,a as i,t as n}from"./index.js";import{p as a}from"./p-BOQnc-M4.js";import{p as l}from"./p-BHtg1fh3.js";import{d as r}from"./p-DrDHC7V6.js";import{d}from"./p-DTqCBjUj.js";import{d as c}from"./p-DuNZGFkV.js";import{d as h}from"./p-Cpr3K41-.js";import{d as p}from"./p-DirD-b2y.js";import{d as f}from"./p-CZZYGqKz.js";import{d as u}from"./p-BMwnjAIq.js";const m=["search","agents","messages","stacks","activity","help"];const g="search";const v="help";const _={search:"Search",messages:"Messages",stacks:"Stacks",activity:"Activity",agents:"Agents",help:"Help & Support"};const b={search:"K",agents:"A",messages:"M",stacks:"S",activity:"N",help:"?"};function w(s,e){if(e){return a(e,[])}return s??[]}function y(s){const e=new Map;for(const t of s){if(!e.has(t.id))e.set(t.id,t)}return m.flatMap((s=>{const t=e.get(s);return t?[t]:[]}))}function x(s){return s!==null&&m.includes(s)}function k(s,e,t){if(!t||s.some((s=>s.id===t))){return{open:e,activeTool:t,removedTool:""}}return{open:false,activeTool:"",removedTool:t}}function C(s){const e=s.transitionProperty.split(",").map((s=>s.trim()));const t=s.transitionDuration.split(",").map((s=>l(s.trim(),0)));const o=s.transitionDelay.split(",").map((s=>l(s.trim(),0)));return e.reduce(((s,e,i)=>{if(e!=="all"&&e!=="max-width")return s;const n=t[i%t.length]??0;const a=o[i%o.length]??0;return Math.max(s,n+a,0)}),0)}function T(s,e){return!s&&e==="idle"}function A(s,e,t){if(t==="closing")return s<=.5;if(t==="opening")return e>0&&s>=e-.5;return true}function z(s,e,t){if(s&&e===t){return{open:false,activeTool:t,selected:false}}return{open:true,activeTool:t,selected:true}}const j=()=>`.ds-control--md.sc-ds-panel-tools-h,.ds-control--md.sc-ds-panel-tools,.ds-control--sm.sc-ds-panel-tools-h,.ds-control--sm.sc-ds-panel-tools,.ds-control--xs.sc-ds-panel-tools-h,.ds-control--xs.sc-ds-panel-tools{--ds-control-radius:var(--dimension-radius-025)}.ds-control--md.sc-ds-panel-tools-h,.ds-control--md.sc-ds-panel-tools{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-panel-tools-h,.ds-control--sm.sc-ds-panel-tools{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-panel-tools-h,.ds-control--xs.sc-ds-panel-tools{--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}.sc-ds-panel-tools-h{display:block;flex:0 0 auto;box-sizing:border-box;height:100%;min-height:0;overflow:hidden;--_panel-tools-rail-width:var(--dimension-size-600);--_panel-tools-drawer-width:var(--ds-shell-panel-tools-width, var(--dimension-panel-width-xs));--_panel-tools-border:var(--dimension-stroke-width-012, 1px) solid var(--color-border-tertiary);--_panel-tools-expand-dur:var(--effect-animation-duration-medium-1, 300ms)}.panel-tools__layout.sc-ds-panel-tools{display:flex;flex-direction:row-reverse;align-items:stretch;height:100%;min-height:0;box-sizing:border-box}.panel-tools__drawer.sc-ds-panel-tools{flex:0 0 auto;max-width:0;min-width:0;height:100%;min-height:0;overflow:hidden;box-sizing:border-box;transition:none}.panel-tools--ready.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:max-width var(--_panel-tools-expand-dur)     var(--effect-animation-easing-ease-in-out, ease)}.panel-tools--ready.panel-tools--motion-opening.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:max-width var(--_panel-tools-expand-dur)     var(--effect-animation-easing-ease-out, ease-out)}.panel-tools--ready.panel-tools--motion-closing.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:max-width var(--_panel-tools-expand-dur)     var(--effect-animation-easing-ease-in, ease-in)}.panel-tools--open.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{max-width:var(--_panel-tools-drawer-width)}.panel-tools__drawer--visible.sc-ds-panel-tools{border-left:var(--_panel-tools-border)}.panel-tools__drawer-surface.sc-ds-panel-tools{display:flex;flex-direction:column;width:var(--_panel-tools-drawer-width);height:100%;min-height:0;box-sizing:border-box;background-color:transparent}.panel-tools__full-views.sc-ds-panel-tools,.panel-tools__full-view.sc-ds-panel-tools{flex:1 1 auto;min-height:0;overflow:hidden}.panel-tools__full-view.sc-ds-panel-tools{height:100%}.panel-tools__full-view.sc-ds-panel-tools{display:none}.panel-tools__full-view--active.sc-ds-panel-tools{display:block}[presentation='fullscreen'].sc-ds-panel-tools-h{height:100vh;inset:0;position:fixed;width:100vw;z-index:var(--dimension-z-index-modal)}[presentation='fullscreen'].sc-ds-panel-tools-h .panel-tools__rail.sc-ds-panel-tools{display:none}[presentation='fullscreen'].sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{max-width:100vw;transition:none;width:100vw}[presentation='fullscreen'].sc-ds-panel-tools-h .panel-tools__drawer--visible.sc-ds-panel-tools{border-left:none}[presentation='fullscreen'].sc-ds-panel-tools-h .panel-tools__drawer-surface.sc-ds-panel-tools{background-color:transparent;width:100vw}.panel-tools--presentation-snap.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:none}.panel-tools__body.sc-ds-panel-tools{flex:1 1 auto;min-height:0;overflow:auto;position:relative}.panel-tools--drawer-resting.sc-ds-panel-tools-h .panel-tools__body.sc-ds-panel-tools{content-visibility:auto;contain-intrinsic-size:auto 200px}.panel-tools__view.sc-ds-panel-tools{display:none;height:100%;min-height:0;box-sizing:border-box;padding:var(--dimension-space-200);color:var(--color-foreground-secondary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.panel-tools__view.sc-ds-panel-tools-s>*,.panel-tools__view .sc-ds-panel-tools-s>*{margin:0;color:var(--color-foreground-secondary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.panel-tools__view--active.sc-ds-panel-tools{display:block}.panel-tools__rail.sc-ds-panel-tools{flex:0 0 var(--_panel-tools-rail-width);width:var(--_panel-tools-rail-width);min-width:var(--_panel-tools-rail-width);display:flex;flex-direction:column;box-sizing:border-box;height:100%;min-height:0;border-left:var(--_panel-tools-border);background-color:transparent}.panel-tools__rail-header.sc-ds-panel-tools{display:flex;align-items:center;justify-content:center;height:var(--dimension-size-600);padding:var(--dimension-space-100);flex-shrink:0;box-sizing:border-box;border-bottom:var(--_panel-tools-border)}.panel-tools__rail-body.sc-ds-panel-tools{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-100);box-sizing:border-box;scrollbar-width:none}.panel-tools__rail-body.sc-ds-panel-tools::-webkit-scrollbar{display:none}.panel-tools__rail-footer.sc-ds-panel-tools{display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:auto;padding:var(--dimension-space-100);box-sizing:border-box}.panel-tools__rail-action.sc-ds-panel-tools{display:flex;align-items:center;justify-content:center;width:100%;height:var(--ds-control-height);flex-shrink:0}@media (prefers-reduced-motion: reduce){.panel-tools--ready.panel-tools--motion-opening.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools,.panel-tools--ready.panel-tools--motion-closing.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:none}}`;const S=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsToolChange=t(this,"dsToolChange");this.dsPresentationChange=t(this,"dsPresentationChange");this.dsHeaderBack=t(this,"dsHeaderBack");this.dsHeaderAction=t(this,"dsHeaderAction");this.dsChromeTransitionStart=t(this,"dsChromeTransitionStart");this.dsChromeTransitionEnd=t(this,"dsChromeTransitionEnd");this.open=false;this.presentation="drawer";this.fullscreenHeaderMode="shared";this.activeTool="";this.items=[];this.itemsJson="";this.toolsLabel="Tools";this.toolShortcutsLabel="Tool shortcuts";this.headers={};this.headersJson="";this.storageKey="";this.motion="idle";this.drawerSurfaceRetained=false;this.readyForMotion=false;this.presentationMotionSuppressed=false;this.rovingIndex=0;this.fullViewToolIds=[];this.motionEnableGeneration=0;this.presentationMotionGeneration=0;this.transitionGeneration=0;this.transitionFallbackTimer=null;this.ignoreReplacementTerminal=false;this.focusBeforeFullscreen=null;this.fullViewObserver=null;this.handleComposedHeaderAction=s=>{const e=s.detail;if(!this.activeTool||!e?.id)return;s.stopPropagation();this.dsHeaderAction.emit({tool:this.activeTool,id:e.id})};this.handleTransitionEnd=s=>{const e=this.el.querySelector(".panel-tools__drawer");if(s.target!==e)return;if(s.propertyName!=="max-width")return;if(this.ignoreReplacementTerminal){this.ignoreReplacementTerminal=false;return}if(s.type==="transitioncancel")return;if(e&&!this.drawerTransitionAtTerminal(e,this.motion))return;this.finishDrawerTransition()};this.handleToolChange=s=>{const e=z(this.open,this.activeTool,s);this.open=e.open;this.activeTool=e.activeTool;this.dsToolChange.emit({id:s,selected:e.selected})};this.handleRailKeyDown=(s,e)=>{const t=this.orderedRailItems;if(!t.length)return;if(s.key==="Enter"||s.key===" "){s.preventDefault();this.handleToolChange(t[e].id);return}if(s.key==="ArrowDown"){if(e>=t.length-1)return;s.preventDefault();this.focusRailAt(e+1);return}if(s.key==="ArrowUp"){if(e<=0)return;s.preventDefault();this.focusRailAt(e-1)}}}get railItems(){return w(this.items,this.itemsJson)}get orderedRailItems(){const s=y(this.railItems);const e=s.find((s=>s.id===g));const t=s.find((s=>s.id===v));const o=s.filter((s=>s.id!==g&&s.id!==v));const i=[];if(e)i.push(e);i.push(...o);if(t)i.push(t);return i}disconnectedCallback(){this.el.removeEventListener("transitionend",this.handleTransitionEnd);this.el.removeEventListener("transitioncancel",this.handleTransitionEnd);this.el.removeEventListener("dsAction",this.handleComposedHeaderAction);this.clearTransitionCompletion();this.motionEnableGeneration+=1;this.fullViewObserver?.disconnect();this.fullViewObserver=null}presentationChanged(s,t){if(s===t)return;const o=++this.presentationMotionGeneration;this.presentationMotionSuppressed=true;requestAnimationFrame((()=>{requestAnimationFrame((()=>{if(o!==this.presentationMotionGeneration)return;this.presentationMotionSuppressed=false}))}));if(s==="fullscreen"){this.focusBeforeFullscreen=document.activeElement instanceof e?document.activeElement:null;this.open=true}else if(t==="fullscreen"){const s=this.focusBeforeFullscreen;const e=this.activeHeader().actions?.[0]?.id;requestAnimationFrame((async()=>{if(s?.isConnected){s.focus({preventScroll:true})}const t=s?document.activeElement===s||s.contains(document.activeElement):false;if(!t&&e)await this.focusHeaderAction(e);this.focusBeforeFullscreen=null}))}this.dsPresentationChange.emit({presentation:s})}handleFullscreenEscape(s){if(this.presentation!=="fullscreen"||s.key!=="Escape")return;s.preventDefault();s.stopPropagation();this.presentation="drawer"}deferMotionEnable(){if(this.readyForMotion)return;const s=++this.motionEnableGeneration;requestAnimationFrame((()=>{if(s!==this.motionEnableGeneration)return;requestAnimationFrame((()=>{if(s!==this.motionEnableGeneration)return;this.readyForMotion=true}))}))}connectedCallback(){this.el.addEventListener("transitionend",this.handleTransitionEnd);this.el.addEventListener("transitioncancel",this.handleTransitionEnd);this.el.addEventListener("dsAction",this.handleComposedHeaderAction)}componentWillLoad(){this.restoreLastActiveTool();this.drawerSurfaceRetained=this.open}openChanged(s,e){if(s)this.drawerSurfaceRetained=true;if(this.readyForMotion&&e!==undefined&&e!==s){this.startDrawerTransition(s?"opening":"closing")}else if(!s){this.drawerSurfaceRetained=false}this.deferMotionEnable()}activeToolChanged(){this.persistLastActiveTool();this.deferMotionEnable()}storageKeyChanged(){this.restoreLastActiveTool()}componentDidLoad(){this.deferMotionEnable();this.syncFullViewTools();this.fullViewObserver=new MutationObserver((()=>this.syncFullViewTools()));this.fullViewObserver.observe(this.el,{childList:true,attributes:true,attributeFilter:["slot"]})}itemsChanged(){this.rovingIndex=0;this.reconcileActiveTool();this.deferMotionEnable()}restoreLastActiveTool(){if(!this.storageKey||this.activeTool)return;try{const s=localStorage.getItem(this.storageKey);if(x(s))this.activeTool=s}catch{}}persistLastActiveTool(){if(!this.storageKey||!this.activeTool)return;try{localStorage.setItem(this.storageKey,this.activeTool)}catch{}}clearPersistedTool(){if(!this.storageKey)return;try{localStorage.removeItem(this.storageKey)}catch{}}reconcileActiveTool(){const s=k(this.railItems,this.open,this.activeTool);if(!s.removedTool)return;this.clearPersistedTool();this.open=s.open;this.activeTool=s.activeTool;this.dsToolChange.emit({id:s.removedTool,selected:false})}startDrawerTransition(s){const e=this.el.querySelector(".panel-tools__drawer");if(this.motion!=="idle"){this.finishDrawerTransition();this.ignoreReplacementTerminal=true}this.motion=s;this.dsChromeTransitionStart.emit({source:"panel-tools",phase:s});const t=++this.transitionGeneration;requestAnimationFrame((()=>{requestAnimationFrame((()=>{if(t!==this.transitionGeneration||this.motion!==s)return;if(!e){this.finishDrawerTransition();return}if(this.drawerTransitionAtTerminal(e,s)){this.finishDrawerTransition();return}const o=C(getComputedStyle(e));if(o<=0){this.finishDrawerTransition();return}this.transitionFallbackTimer=window.setTimeout((()=>{this.finishDrawerTransition()}),o)}))}))}drawerTransitionAtTerminal(s,e){const t=s.getBoundingClientRect().width;const o=s.querySelector(".panel-tools__drawer-surface");const i=o?.getBoundingClientRect().width??0;return A(t,i,e)}finishDrawerTransition(){const s=this.motion;const e=s!=="idle";this.clearTransitionCompletion();if(!e)return;this.ignoreReplacementTerminal=false;this.motion="idle";if(s==="closing"&&!this.open){this.drawerSurfaceRetained=false}this.dsChromeTransitionEnd.emit({source:"panel-tools"})}clearTransitionCompletion(){this.transitionGeneration+=1;if(this.transitionFallbackTimer!==null){window.clearTimeout(this.transitionFallbackTimer);this.transitionFallbackTimer=null}}isRailSelected(s){return this.open&&this.activeTool===s}isDrawerPresent(){return this.open||this.drawerSurfaceRetained}isViewActive(s){return this.isDrawerPresent()&&this.activeTool===s}hasFullView(s){return this.fullViewToolIds.includes(s)}syncFullViewTools(){const s=["search","messages","stacks","activity","agents","help"];const e=s.filter((s=>Boolean(this.el.querySelector(`[slot="${s}-view"]`))));if(e.join("|")!==this.fullViewToolIds.join("|"))this.fullViewToolIds=e}headerLabel(){if(!this.isDrawerPresent()||!this.activeTool)return"";return _[this.activeTool]??""}resolvedHeaders(){if(Object.keys(this.headers).length)return this.headers;if(!this.headersJson.trim())return{};try{const s=JSON.parse(this.headersJson);return s&&typeof s==="object"&&!Array.isArray(s)?s:{}}catch{return{}}}activeHeader(){if(!this.activeTool)return{};return this.resolvedHeaders()[this.activeTool]??{}}async activateTool(s){const e=this.railItems.find((e=>e.id===s));if(!e||e.isInactive)return;this.handleToolChange(s)}async closeDrawer(){if(!this.open)return;const s=this.activeTool;this.open=false;if(s){this.dsToolChange.emit({id:s,selected:false})}}async focusHeaderAction(s){const e=this.el.querySelector(`[data-header-action-id="${CSS.escape(s)}"]`);await(e?.setFocus?.())}focusRailAt(s){const e=this.orderedRailItems;if(!e.length)return;const t=Math.max(0,Math.min(s,e.length-1));if(t===this.rovingIndex)return;this.rovingIndex=t;const o=Array.from(this.el.querySelectorAll(".panel-tools__rail-action .button-icon"));o[t]?.focus({preventScroll:true})}renderRailAction(s,e){const t=s.ariaLabel??_[s.id];return o("ds-tooltip",{key:s.id,label:t,shortcutKey:b[s.id],side:"left",size:"sm"},o("ds-button-unfilled",{variant:"icon",class:"panel-tools__rail-action",icon:s.icon,isActive:this.isRailSelected(s.id),activeFill:false,hasBorder:false,dot:s.dot??false,isInactive:s.isInactive,focusTabIndex:e===this.rovingIndex?0:-1,"aria-label":t,pressed:this.isRailSelected(s.id),onFocusin:()=>{this.rovingIndex=e},onKeyDown:s=>this.handleRailKeyDown(s,e),onDsClick:()=>this.handleToolChange(s.id)}))}render(){const s=this.headerLabel();const e=this.activeHeader();const t=e.title?.trim()||s;const n=e.actions??[];const a=this.orderedRailItems;const l=a.find((s=>s.id===g));const r=a.find((s=>s.id===v));const d=a.filter((s=>s.id!==g&&s.id!==v));const c=r?(l?1:0)+d.length:-1;const h=this.isDrawerPresent();const p=T(this.open,this.motion);const f=Boolean(h&&this.activeTool&&this.hasFullView(this.activeTool));const u=["search","messages","stacks","activity","agents","help"];return o(i,{key:"6e53a5db6f3e4027c855ab918f370b1b74fb46d1",class:{"panel-tools":true,"panel-tools--open":this.open,"panel-tools--ready":this.readyForMotion,"panel-tools--motion-opening":this.motion==="opening","panel-tools--motion-closing":this.motion==="closing","panel-tools--drawer-resting":p,"panel-tools--fullscreen":this.presentation==="fullscreen","panel-tools--presentation-snap":this.presentationMotionSuppressed},role:this.presentation==="fullscreen"?"dialog":"complementary","aria-modal":this.presentation==="fullscreen"?"true":undefined,"aria-label":this.toolsLabel},o("div",{key:"1942aeb6c04ec6b14f4e7ca5820468f59d857a7b",class:"panel-tools__layout"},o("nav",{key:"74469965ae97f378121eb9068b08016e735409e9",class:"panel-tools__rail","aria-label":this.toolShortcutsLabel},l?o("div",{class:"panel-tools__rail-header"},this.renderRailAction(l,0)):null,o("div",{key:"4033a1843f5afb86e9c3efacda5a3db9e70e9ba5",class:"panel-tools__rail-body"},d.map(((s,e)=>this.renderRailAction(s,l?e+1:e)))),r?o("div",{class:"panel-tools__rail-footer"},this.renderRailAction(r,c)):null),o("div",{key:"766c43d23eeb985064f5424e7842ad7f853f67fe",class:{"panel-tools__drawer":true,"panel-tools__drawer--visible":h},"aria-hidden":h?null:"true",inert:h?undefined:true},o("div",{key:"7a093621e1748f1792f1db0740ed77905efd507c",class:"panel-tools__drawer-surface"},this.presentation!=="fullscreen"||this.fullscreenHeaderMode==="shared"?o("ds-panel-tool-header",{class:"panel-tools__header",heading:t,showBack:e.showBack??false,backIcon:e.backIcon||"ChevronLeft",backAriaLabel:e.backAriaLabel||"Back",showMenu:false,ref:s=>{const e=s;if(e)e.actions=n},onDsBack:()=>{if(this.activeTool)this.dsHeaderBack.emit({tool:this.activeTool})}}):null,o("div",{key:"9c2816144f736216793aded4f57bf76de16339f1",class:"panel-tools__body",hidden:f},u.map((s=>{const e=this.isViewActive(s);return o("div",{class:{"panel-tools__view":true,"panel-tools__view--active":e},hidden:!e},o("slot",{name:s}))}))),o("div",{key:"2c2a00774d1412e3448bad3fbf5d7509dc71b149",class:"panel-tools__full-views",hidden:!f},u.map((s=>o("div",{class:{"panel-tools__full-view":true,"panel-tools__full-view--active":this.isViewActive(s)&&this.hasFullView(s)},hidden:!(this.isViewActive(s)&&this.hasFullView(s))},o("slot",{name:`${s}-view`})))))))))}get el(){return this}static get watchers(){return{presentation:[{presentationChanged:0}],open:[{openChanged:0}],activeTool:[{activeToolChanged:0}],storageKey:[{storageKeyChanged:0}],items:[{itemsChanged:0}],itemsJson:[{itemsChanged:0}]}}static get style(){return j()}},[262,"ds-panel-tools",{open:[1540],presentation:[1537],fullscreenHeaderMode:[513,"fullscreen-header-mode"],activeTool:[1537,"active-tool"],items:[16],itemsJson:[1,"items-json"],toolsLabel:[1,"tools-label"],toolShortcutsLabel:[1,"tool-shortcuts-label"],headers:[16],headersJson:[1,"headers-json"],storageKey:[1,"storage-key"],motion:[32],drawerSurfaceRetained:[32],readyForMotion:[32],presentationMotionSuppressed:[32],rovingIndex:[32],fullViewToolIds:[32],activateTool:[64],closeDrawer:[64],focusHeaderAction:[64]},[[10,"keydown","handleFullscreenEscape"]],{presentation:[{presentationChanged:0}],open:[{openChanged:0}],activeTool:[{activeToolChanged:0}],storageKey:[{storageKeyChanged:0}],items:[{itemsChanged:0}],itemsJson:[{itemsChanged:0}]}]);function D(){if(typeof customElements==="undefined"){return}const s=["ds-panel-tools","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-panel-tool-header","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-panel-tools":if(!customElements.get(n(s))){customElements.define(n(s),S)}break;case"ds-badge":if(!customElements.get(n(s))){r()}break;case"ds-button-unfilled":if(!customElements.get(n(s))){d()}break;case"ds-icon":if(!customElements.get(n(s))){c()}break;case"ds-loader":if(!customElements.get(n(s))){h()}break;case"ds-panel-tool-header":if(!customElements.get(n(s))){p()}break;case"ds-text":if(!customElements.get(n(s))){f()}break;case"ds-tooltip":if(!customElements.get(n(s))){u()}break}}))}D();const E=S;const F=D;export{E as DsPanelTools,F as defineCustomElement};
 //# sourceMappingURL=ds-panel-tools.js.map

package/dist/components/ds-panel-tools.js.map

@@ -1 +1 @@
-{"version":3,"names":["PANEL_TOOLS_TOOL_IDS","PANEL_TOOLS_PRIMARY_TOOL_ID","PANEL_TOOLS_FOOTER_TOOL_ID","PANEL_TOOLS_LABELS","search","messages","stacks","activity","agents","help","PANEL_TOOLS_SHORTCUTS","parsePanelToolsItems","items","itemsJson","parseJsonArrayProp","orderPanelToolsItems","firstById","Map","item","has","id","set","flatMap","get","isPanelToolsToolId","value","includes","reconcilePanelToolsAvailability","open","activeTool","some","removedTool","panelToolsDrawerTransitionMs","style","properties","transitionProperty","split","map","trim","durations","transitionDuration","parseCssTimeMs","delays","transitionDelay","reduce","max","property","index","duration","length","delay","Math","panelToolsDrawerResting","motion","panelToolsDrawerAtTerminal","width","targetWidth","resolvePanelToolActivation","selected","panelToolsCss","PanelTools","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","presentation","fullscreenHeaderMode","toolsLabel","toolShortcutsLabel","headers","headersJson","storageKey","drawerSurfaceRetained","readyForMotion","presentationMotionSuppressed","rovingIndex","fullViewToolIds","motionEnableGeneration","presentationMotionGeneration","transitionGeneration","transitionFallbackTimer","ignoreReplacementTerminal","focusBeforeFullscreen","fullViewObserver","handleComposedHeaderAction","event","detail","stopPropagation","dsHeaderAction","emit","tool","handleTransitionEnd","drawer","el","querySelector","target","propertyName","type","drawerTransitionAtTerminal","finishDrawerTransition","handleToolChange","next","dsToolChange","handleRailKeyDown","e","orderedRailItems","key","preventDefault","focusRailAt","railItems","headerItem","find","footerItem","bodyItems","filter","ordered","push","disconnectedCallback","removeEventListener","clearTransitionCompletion","disconnect","presentationChanged","previous","presentationGeneration","requestAnimationFrame","document","activeElement","fallbackActionId","activeHeader","actions","async","isConnected","focus","preventScroll","focusRestored","contains","focusHeaderAction","dsPresentationChange","handleFullscreenEscape","deferMotionEnable","generation","connectedCallback","addEventListener","componentWillLoad","restoreLastActiveTool","openChanged","isOpen","wasOpen","undefined","startDrawerTransition","activeToolChanged","persistLastActiveTool","storageKeyChanged","componentDidLoad","syncFullViewTools","MutationObserver","observe","childList","attributes","attributeFilter","itemsChanged","reconcileActiveTool","stored","localStorage","getItem","setItem","clearPersistedTool","removeItem","phase","dsChromeTransitionStart","source","fallbackMs","getComputedStyle","window","setTimeout","getBoundingClientRect","surface","completedPhase","wasTransitioning","dsChromeTransitionEnd","clearTimeout","isRailSelected","isDrawerPresent","isViewActive","hasFullView","ids","Boolean","join","headerLabel","resolvedHeaders","Object","keys","parsed","JSON","parse","Array","isArray","activateTool","entry","isInactive","closeDrawer","action","CSS","escape","setFocus","bounded","min","from","querySelectorAll","renderRailAction","label","ariaLabel","h","shortcutKey","side","size","variant","class","icon","isActive","activeFill","hasBorder","dot","focusTabIndex","pressed","onFocusin","onKeyDown","onDsClick","render","header","headerTitle","title","headerActions","footerIndex","showDrawerChrome","drawerResting","activeFullView","toolIds","Host","role","bodyIdx","inert","heading","showBack","backIcon","backAriaLabel","showMenu","ref","element","toolHeader","onDsBack","dsHeaderBack","hidden","active","name"],"sources":["src/wc/components/PanelTools/panel-tools-types.ts","src/wc/components/PanelTools/panel-tools-utils.ts","src/wc/components/PanelTools/PanelTools.css?tag=ds-panel-tools&encapsulation=scoped","src/wc/components/PanelTools/PanelTools.tsx"],"sourcesContent":["/** Tool ids for the `ds-panel-tools` rail and drawer views. */\nexport type PanelToolsToolId = 'search' | 'agents' | 'messages' | 'stacks' | 'activity' | 'help';\n\nexport const PANEL_TOOLS_TOOL_IDS: PanelToolsToolId[] = [\n  'search',\n  'agents',\n  'messages',\n  'stacks',\n  'activity',\n  'help',\n];\n\n/** Rail header slot — mirrors panel-nav M logo row. */\nexport const PANEL_TOOLS_PRIMARY_TOOL_ID: PanelToolsToolId = 'search';\n\n/** Rail footer slot — flush to the bottom of the tools column. */\nexport const PANEL_TOOLS_FOOTER_TOOL_ID: PanelToolsToolId = 'help';\n\nexport const PANEL_TOOLS_LABELS: Record<PanelToolsToolId, string> = {\n  search: 'Search',\n  messages: 'Messages',\n  stacks: 'Stacks',\n  activity: 'Activity',\n  agents: 'Agents',\n  help: 'Help & Support',\n};\n\nexport const PANEL_TOOLS_SHORTCUTS: Partial<Record<PanelToolsToolId, string>> = {\n  search: 'K',\n  agents: 'A',\n  messages: 'M',\n  stacks: 'S',\n  activity: 'N',\n  help: '?',\n};\n\nexport interface PanelToolsItem {\n  id: PanelToolsToolId;\n  /** Icon name for <ds-icon>. */\n  icon: string;\n  /** Whether this rail button is currently pressed/active. */\n  selected?: boolean;\n  /** Show a notification dot. */\n  dot?: boolean;\n  isInactive?: boolean;\n  ariaLabel?: string;\n}\n\nexport interface PanelToolsHeaderAction {\n  id: string;\n  icon: string;\n  ariaLabel: string;\n  triggerId?: string;\n  controls?: string;\n  expanded?: boolean;\n  haspopup?: 'menu' | 'dialog' | 'listbox' | 'tree' | 'grid';\n  pressed?: boolean;\n  isInactive?: boolean;\n}\n\nexport interface PanelToolsHeaderConfig {\n  title?: string;\n  showBack?: boolean;\n  backIcon?: string;\n  backAriaLabel?: string;\n  actions?: PanelToolsHeaderAction[];\n}\n\n/** Per-tool header state. The application replaces the object when a tool changes depth or actions. */\nexport type PanelToolsHeaders = Partial<Record<PanelToolsToolId, PanelToolsHeaderConfig>>;\n","import { parseJsonArrayProp } from '../BarNav/bar-nav-utils';\nimport { parseCssTimeMs } from '../../utils/resolve-css-time-ms';\nimport {\n  PANEL_TOOLS_TOOL_IDS,\n  type PanelToolsItem,\n  type PanelToolsToolId,\n} from './panel-tools-types';\n\nexport function parsePanelToolsItems(items: PanelToolsItem[], itemsJson: string): PanelToolsItem[] {\n  if (itemsJson) {\n    return parseJsonArrayProp<PanelToolsItem>(itemsJson, []);\n  }\n  return items ?? [];\n}\n\nexport function orderPanelToolsItems(items: PanelToolsItem[]): PanelToolsItem[] {\n  const firstById = new Map<PanelToolsToolId, PanelToolsItem>();\n  for (const item of items) {\n    if (!firstById.has(item.id)) firstById.set(item.id, item);\n  }\n  return PANEL_TOOLS_TOOL_IDS.flatMap(id => {\n    const item = firstById.get(id);\n    return item ? [item] : [];\n  });\n}\n\nexport function isPanelToolsToolId(value: string | null): value is PanelToolsToolId {\n  return value !== null && PANEL_TOOLS_TOOL_IDS.includes(value as PanelToolsToolId);\n}\n\nexport function reconcilePanelToolsAvailability(\n  items: PanelToolsItem[],\n  open: boolean,\n  activeTool: PanelToolsToolId | ''\n): { open: boolean; activeTool: PanelToolsToolId | ''; removedTool: PanelToolsToolId | '' } {\n  if (!activeTool || items.some(item => item.id === activeTool)) {\n    return { open, activeTool, removedTool: '' };\n  }\n  return { open: false, activeTool: '', removedTool: activeTool };\n}\n\nexport function shouldResyncPanelToolsItems(\n  prev: PanelToolsItem[],\n  next: PanelToolsItem[]\n): boolean {\n  if (prev.length !== next.length) return true;\n  return next.some((item, index) => {\n    const prior = prev[index];\n    if (!prior) return true;\n    return (\n      prior.id !== item.id ||\n      prior.icon !== item.icon ||\n      prior.selected !== item.selected ||\n      prior.dot !== item.dot ||\n      prior.isInactive !== item.isInactive ||\n      prior.ariaLabel !== item.ariaLabel\n    );\n  });\n}\n\nexport type PanelToolsMotion = 'opening' | 'closing' | 'idle';\n\nexport interface PanelToolsTransitionStyle {\n  transitionProperty: string;\n  transitionDuration: string;\n  transitionDelay: string;\n}\n\n/** Maximum computed time for the drawer's max-width transition, including delay. */\nexport function panelToolsDrawerTransitionMs(style: PanelToolsTransitionStyle): number {\n  const properties = style.transitionProperty.split(',').map(item => item.trim());\n  const durations = style.transitionDuration.split(',').map(item => parseCssTimeMs(item.trim(), 0));\n  const delays = style.transitionDelay.split(',').map(item => parseCssTimeMs(item.trim(), 0));\n\n  return properties.reduce((max, property, index) => {\n    if (property !== 'all' && property !== 'max-width') return max;\n    const duration = durations[index % durations.length] ?? 0;\n    const delay = delays[index % delays.length] ?? 0;\n    return Math.max(max, duration + delay, 0);\n  }, 0);\n}\n\n/** True when the drawer clip is fully closed — safe to skip painting slot content. */\nexport function panelToolsDrawerResting(open: boolean, motion: PanelToolsMotion): boolean {\n  return !open && motion === 'idle';\n}\n\n/** True only when the animated clip has reached the terminal width for its motion phase. */\nexport function panelToolsDrawerAtTerminal(\n  width: number,\n  targetWidth: number,\n  motion: PanelToolsMotion\n): boolean {\n  if (motion === 'closing') return width <= 0.5;\n  if (motion === 'opening') return targetWidth > 0 && width >= targetWidth - 0.5;\n  return true;\n}\n\n/** Toggle or switch rail tool selection — repeat activation closes the active tool. */\nexport function resolvePanelToolActivation(\n  open: boolean,\n  activeTool: PanelToolsToolId | '',\n  id: PanelToolsToolId\n): { open: boolean; activeTool: PanelToolsToolId; selected: boolean } {\n  if (open && activeTool === id) {\n    return { open: false, activeTool: id, selected: false };\n  }\n  return { open: true, activeTool: id, selected: true };\n}\n","@import '../../utils/control-density.css';\n\n:host {\n  display: block;\n  flex: 0 0 auto;\n  box-sizing: border-box;\n  height: 100%;\n  min-height: 0;\n  overflow: hidden;\n  --_panel-tools-rail-width: var(--dimension-size-600);\n  --_panel-tools-drawer-width: var(--ds-shell-panel-tools-width, var(--dimension-panel-width-xs));\n  --_panel-tools-border: var(--dimension-stroke-width-012, 1px) solid var(--color-border-tertiary);\n  /* Match panel-nav expand timing (medium-1); easing differs by direction. */\n  --_panel-tools-expand-dur: var(--effect-animation-duration-medium-1, 300ms);\n}\n\n.panel-tools__layout {\n  display: flex;\n  flex-direction: row-reverse;\n  align-items: stretch;\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n}\n\n/* Clip frame — only max-width animates (slide reveal, same as pre-rail :host). */\n.panel-tools__drawer {\n  flex: 0 0 auto;\n  max-width: 0;\n  min-width: 0;\n  height: 100%;\n  min-height: 0;\n  overflow: hidden;\n  box-sizing: border-box;\n  transition: none;\n}\n\n:host(.panel-tools--ready) .panel-tools__drawer {\n  transition: max-width var(--_panel-tools-expand-dur)\n    var(--effect-animation-easing-ease-in-out, ease);\n}\n\n:host(.panel-tools--ready.panel-tools--motion-opening) .panel-tools__drawer {\n  transition: max-width var(--_panel-tools-expand-dur)\n    var(--effect-animation-easing-ease-out, ease-out);\n}\n\n:host(.panel-tools--ready.panel-tools--motion-closing) .panel-tools__drawer {\n  transition: max-width var(--_panel-tools-expand-dur)\n    var(--effect-animation-easing-ease-in, ease-in);\n}\n\n:host(.panel-tools--open) .panel-tools__drawer {\n  max-width: var(--_panel-tools-drawer-width);\n}\n\n.panel-tools__drawer--visible {\n  border-left: var(--_panel-tools-border);\n}\n\n/* Fixed-width surface — AppShell supplies the standard 300px tools width. */\n.panel-tools__drawer-surface {\n  display: flex;\n  flex-direction: column;\n  width: var(--_panel-tools-drawer-width);\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n  background-color: transparent;\n}\n\n.panel-tools__full-views,\n.panel-tools__full-view {\n  flex: 1 1 auto;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.panel-tools__full-view {\n  height: 100%;\n}\n\n.panel-tools__full-view {\n  display: none;\n}\n.panel-tools__full-view--active {\n  display: block;\n}\n\n:host([presentation='fullscreen']) {\n  height: 100vh;\n  inset: 0;\n  position: fixed;\n  width: 100vw;\n  z-index: var(--dimension-z-index-modal);\n}\n\n:host([presentation='fullscreen']) .panel-tools__rail {\n  display: none;\n}\n:host([presentation='fullscreen']) .panel-tools__drawer {\n  max-width: 100vw;\n  transition: none;\n  width: 100vw;\n}\n:host([presentation='fullscreen']) .panel-tools__drawer--visible {\n  border-left: none;\n}\n:host([presentation='fullscreen']) .panel-tools__drawer-surface {\n  background-color: transparent;\n  width: 100vw;\n}\n\n:host(.panel-tools--presentation-snap) .panel-tools__drawer {\n  transition: none;\n}\n\n.panel-tools__body {\n  flex: 1 1 auto;\n  min-height: 0;\n  overflow: auto;\n  position: relative;\n}\n\n/* Skip paint while fully closed; cleared during open/close motion for WYSIWYG slide. */\n:host(.panel-tools--drawer-resting) .panel-tools__body {\n  content-visibility: auto;\n  contain-intrinsic-size: auto 200px;\n}\n\n.panel-tools__view {\n  display: none;\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n  padding: var(--dimension-space-200);\n  color: var(--color-foreground-secondary);\n  font-family: var(--typography-font-family);\n  font-size: var(--typography-fontsize-md);\n  line-height: var(--typography-lineheight-md);\n  font-weight: var(--typography-weight-regular);\n  letter-spacing: var(--typography-letterspacing-negative-half);\n}\n\n.panel-tools__view ::slotted(*) {\n  margin: 0;\n  color: var(--color-foreground-secondary);\n  font-family: var(--typography-font-family);\n  font-size: var(--typography-fontsize-md);\n  line-height: var(--typography-lineheight-md);\n  font-weight: var(--typography-weight-regular);\n  letter-spacing: var(--typography-letterspacing-negative-half);\n}\n\n.panel-tools__view--active {\n  display: block;\n}\n\n/* Rail — mirrors collapsed panel-nav width, padding, and item rhythm. */\n.panel-tools__rail {\n  flex: 0 0 var(--_panel-tools-rail-width);\n  width: var(--_panel-tools-rail-width);\n  min-width: var(--_panel-tools-rail-width);\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  height: 100%;\n  min-height: 0;\n  border-left: var(--_panel-tools-border);\n  background-color: transparent;\n}\n\n.panel-tools__rail-header {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: var(--dimension-size-600);\n  padding: var(--dimension-space-100);\n  flex-shrink: 0;\n  box-sizing: border-box;\n  border-bottom: var(--_panel-tools-border);\n}\n\n.panel-tools__rail-body {\n  flex: 1 1 auto;\n  min-height: 0;\n  overflow-y: auto;\n  overflow-x: hidden;\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050);\n  padding: var(--dimension-space-100);\n  box-sizing: border-box;\n  scrollbar-width: none;\n}\n\n.panel-tools__rail-body::-webkit-scrollbar {\n  display: none;\n}\n\n/* Flush to the bottom of the rail — mirrors Search header pin. */\n.panel-tools__rail-footer {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  margin-top: auto;\n  padding: var(--dimension-space-100);\n  box-sizing: border-box;\n}\n\n.panel-tools__rail-action {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: var(--ds-control-height);\n  flex-shrink: 0;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  :host(.panel-tools--ready.panel-tools--motion-opening) .panel-tools__drawer,\n  :host(.panel-tools--ready.panel-tools--motion-closing) .panel-tools__drawer {\n    transition: none;\n  }\n}\n","import {\n  Component,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n  State,\n  Watch,\n  Method,\n  Listen,\n  h,\n  Host,\n} from '@stencil/core';\nimport type { ChromeTransitionDetail } from '../../shell/chrome-transition';\nimport {\n  PANEL_TOOLS_FOOTER_TOOL_ID,\n  PANEL_TOOLS_LABELS,\n  PANEL_TOOLS_PRIMARY_TOOL_ID,\n  PANEL_TOOLS_SHORTCUTS,\n  type PanelToolsHeaderAction,\n  type PanelToolsHeaderConfig,\n  type PanelToolsHeaders,\n  type PanelToolsItem,\n  type PanelToolsToolId,\n} from './panel-tools-types';\nimport {\n  isPanelToolsToolId,\n  orderPanelToolsItems,\n  panelToolsDrawerAtTerminal,\n  parsePanelToolsItems,\n  panelToolsDrawerResting,\n  panelToolsDrawerTransitionMs,\n  reconcilePanelToolsAvailability,\n  resolvePanelToolActivation,\n} from './panel-tools-utils';\n\n@Component({\n  tag: 'ds-panel-tools',\n  styleUrl: 'PanelTools.css',\n  scoped: true,\n})\nexport class PanelTools {\n  @Element() el!: HTMLElement;\n\n  /** When false, only the icon rail is shown. */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /** Drawer presentation or viewport-covering presentation for the active tool. */\n  @Prop({ mutable: true, reflect: true }) presentation: 'drawer' | 'fullscreen' = 'drawer';\n\n  /** Let a fullscreen product supply independent master/detail headers inside its view. */\n  @Prop({ attribute: 'fullscreen-header-mode', reflect: true })\n  fullscreenHeaderMode: 'shared' | 'split' = 'shared';\n\n  /** Active tool view — `search`, `agents`, `messages`, `stacks`, `activity`, or `help`. */\n  @Prop({ mutable: true, attribute: 'active-tool', reflect: true })\n  activeTool: PanelToolsToolId | '' = '';\n\n  /**\n   * Rail items rendered in the right column.\n   * Set via JS property: `el.items = [...]`. Replace the array reference to update.\n   */\n  @Prop() items: PanelToolsItem[] = [];\n\n  /** JSON fallback for `items` — useful when framework bindings don't propagate arrays. */\n  @Prop({ attribute: 'items-json' }) itemsJson: string = '';\n  @Prop() toolsLabel: string = 'Tools';\n  @Prop() toolShortcutsLabel: string = 'Tool shortcuts';\n\n  /** Active header state per tool. Replace the object when title, depth, or actions change. */\n  @Prop() headers: PanelToolsHeaders = {};\n\n  /** JSON fallback for `headers`. The `headers` property takes precedence when non-empty. */\n  @Prop({ attribute: 'headers-json' }) headersJson: string = '';\n\n  /**\n   * Optional localStorage key for the last active tool. The drawer always starts\n   * closed; only the tool identity is restored for continuity within this browser.\n   */\n  @Prop({ attribute: 'storage-key' }) storageKey: string = '';\n\n  /** Emitted when a rail button is toggled. Detail = { id, selected }. */\n  @Event({ bubbles: true, composed: true }) dsToolChange!: EventEmitter<{\n    id: PanelToolsToolId;\n    selected: boolean;\n  }>;\n\n  /** Emitted when fullscreen changes, including Escape-initiated exits. */\n  @Event({ bubbles: true, composed: true }) dsPresentationChange!: EventEmitter<{\n    presentation: 'drawer' | 'fullscreen';\n  }>;\n\n  /** Requests navigation to the active tool's parent view. */\n  @Event({ bubbles: true, composed: true }) dsHeaderBack!: EventEmitter<{\n    tool: PanelToolsToolId;\n  }>;\n\n  /** Requests one application-owned action from the active tool header. */\n  @Event({ bubbles: true, composed: true }) dsHeaderAction!: EventEmitter<{\n    tool: PanelToolsToolId;\n    id: string;\n  }>;\n\n  /** Bubbling lifecycle — `ds-bar-nav` defers overflow checks during drawer motion. */\n  @Event({ bubbles: true, composed: true })\n  dsChromeTransitionStart!: EventEmitter<ChromeTransitionDetail>;\n\n  @Event({ bubbles: true, composed: true })\n  dsChromeTransitionEnd!: EventEmitter<ChromeTransitionDetail>;\n\n  /** Arms open vs close easing for the in-flight width transition. */\n  @State() private motion: 'opening' | 'closing' | 'idle' = 'idle';\n\n  /** Keeps header and slotted content painted until the closing clip transition completes. */\n  @State() private drawerSurfaceRetained = false;\n\n  /** Suppresses width transition until the host has painted its initial open state. */\n  @State() private readyForMotion = false;\n\n  /** Fullscreen presentation changes snap without borrowing drawer width motion. */\n  @State() private presentationMotionSuppressed = false;\n\n  @State() private rovingIndex = 0;\n  @State() private fullViewToolIds: PanelToolsToolId[] = [];\n\n  private motionEnableGeneration = 0;\n  private presentationMotionGeneration = 0;\n  private transitionGeneration = 0;\n  private transitionFallbackTimer: number | null = null;\n  /** Ignores the old transition's terminal event when reversing direction. */\n  private ignoreReplacementTerminal = false;\n  private focusBeforeFullscreen: HTMLElement | null = null;\n  private fullViewObserver: MutationObserver | null = null;\n\n  private get railItems(): PanelToolsItem[] {\n    return parsePanelToolsItems(this.items, this.itemsJson);\n  }\n\n  private get orderedRailItems(): PanelToolsItem[] {\n    const railItems = orderPanelToolsItems(this.railItems);\n    const headerItem = railItems.find(item => item.id === PANEL_TOOLS_PRIMARY_TOOL_ID);\n    const footerItem = railItems.find(item => item.id === PANEL_TOOLS_FOOTER_TOOL_ID);\n    const bodyItems = railItems.filter(\n      item => item.id !== PANEL_TOOLS_PRIMARY_TOOL_ID && item.id !== PANEL_TOOLS_FOOTER_TOOL_ID\n    );\n    const ordered: PanelToolsItem[] = [];\n    if (headerItem) ordered.push(headerItem);\n    ordered.push(...bodyItems);\n    if (footerItem) ordered.push(footerItem);\n    return ordered;\n  }\n\n  disconnectedCallback() {\n    this.el.removeEventListener('transitionend', this.handleTransitionEnd);\n    this.el.removeEventListener('transitioncancel', this.handleTransitionEnd);\n    this.el.removeEventListener('dsAction', this.handleComposedHeaderAction);\n    this.clearTransitionCompletion();\n    this.motionEnableGeneration += 1;\n    this.fullViewObserver?.disconnect();\n    this.fullViewObserver = null;\n  }\n\n  @Watch('presentation')\n  presentationChanged(next: 'drawer' | 'fullscreen', previous?: 'drawer' | 'fullscreen') {\n    if (next === previous) return;\n    const presentationGeneration = ++this.presentationMotionGeneration;\n    this.presentationMotionSuppressed = true;\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        if (presentationGeneration !== this.presentationMotionGeneration) return;\n        this.presentationMotionSuppressed = false;\n      });\n    });\n    if (next === 'fullscreen') {\n      this.focusBeforeFullscreen =\n        document.activeElement instanceof HTMLElement ? document.activeElement : null;\n      this.open = true;\n    } else if (previous === 'fullscreen') {\n      const focusBeforeFullscreen = this.focusBeforeFullscreen;\n      const fallbackActionId = this.activeHeader().actions?.[0]?.id;\n      requestAnimationFrame(async () => {\n        if (focusBeforeFullscreen?.isConnected) {\n          focusBeforeFullscreen.focus({ preventScroll: true });\n        }\n        const focusRestored = focusBeforeFullscreen\n          ? document.activeElement === focusBeforeFullscreen ||\n            focusBeforeFullscreen.contains(document.activeElement)\n          : false;\n        if (!focusRestored && fallbackActionId) await this.focusHeaderAction(fallbackActionId);\n        this.focusBeforeFullscreen = null;\n      });\n    }\n    this.dsPresentationChange.emit({ presentation: next });\n  }\n\n  @Listen('keydown', { target: 'window', capture: true })\n  handleFullscreenEscape(event: KeyboardEvent) {\n    if (this.presentation !== 'fullscreen' || event.key !== 'Escape') return;\n    event.preventDefault();\n    event.stopPropagation();\n    this.presentation = 'drawer';\n  }\n\n  private deferMotionEnable() {\n    if (this.readyForMotion) return;\n    const generation = ++this.motionEnableGeneration;\n    requestAnimationFrame(() => {\n      if (generation !== this.motionEnableGeneration) return;\n      requestAnimationFrame(() => {\n        if (generation !== this.motionEnableGeneration) return;\n        this.readyForMotion = true;\n      });\n    });\n  }\n\n  connectedCallback() {\n    this.el.addEventListener('transitionend', this.handleTransitionEnd);\n    this.el.addEventListener('transitioncancel', this.handleTransitionEnd);\n    this.el.addEventListener('dsAction', this.handleComposedHeaderAction);\n  }\n\n  private handleComposedHeaderAction = (event: Event) => {\n    const detail = (event as CustomEvent<{ id?: string }>).detail;\n    if (!this.activeTool || !detail?.id) return;\n    event.stopPropagation();\n    this.dsHeaderAction.emit({ tool: this.activeTool, id: detail.id });\n  };\n\n  componentWillLoad() {\n    this.restoreLastActiveTool();\n    this.drawerSurfaceRetained = this.open;\n  }\n\n  @Watch('open')\n  openChanged(isOpen: boolean, wasOpen?: boolean) {\n    if (isOpen) this.drawerSurfaceRetained = true;\n    if (this.readyForMotion && wasOpen !== undefined && wasOpen !== isOpen) {\n      this.startDrawerTransition(isOpen ? 'opening' : 'closing');\n    } else if (!isOpen) {\n      this.drawerSurfaceRetained = false;\n    }\n    this.deferMotionEnable();\n  }\n\n  @Watch('activeTool')\n  activeToolChanged() {\n    this.persistLastActiveTool();\n    this.deferMotionEnable();\n  }\n\n  @Watch('storageKey')\n  storageKeyChanged() {\n    this.restoreLastActiveTool();\n  }\n\n  componentDidLoad() {\n    this.deferMotionEnable();\n    this.syncFullViewTools();\n    this.fullViewObserver = new MutationObserver(() => this.syncFullViewTools());\n    this.fullViewObserver.observe(this.el, {\n      childList: true,\n      attributes: true,\n      attributeFilter: ['slot'],\n    });\n  }\n\n  @Watch('items')\n  @Watch('itemsJson')\n  itemsChanged() {\n    this.rovingIndex = 0;\n    this.reconcileActiveTool();\n    this.deferMotionEnable();\n  }\n\n  private restoreLastActiveTool() {\n    if (!this.storageKey || this.activeTool) return;\n    try {\n      const stored = localStorage.getItem(this.storageKey);\n      if (isPanelToolsToolId(stored)) this.activeTool = stored;\n    } catch {\n      /* localStorage unavailable */\n    }\n  }\n\n  private persistLastActiveTool() {\n    if (!this.storageKey || !this.activeTool) return;\n    try {\n      localStorage.setItem(this.storageKey, this.activeTool);\n    } catch {\n      /* unavailable */\n    }\n  }\n\n  private clearPersistedTool() {\n    if (!this.storageKey) return;\n    try {\n      localStorage.removeItem(this.storageKey);\n    } catch {\n      /* unavailable */\n    }\n  }\n\n  private reconcileActiveTool() {\n    const next = reconcilePanelToolsAvailability(this.railItems, this.open, this.activeTool);\n    if (!next.removedTool) return;\n    this.clearPersistedTool();\n    this.open = next.open;\n    this.activeTool = next.activeTool;\n    this.dsToolChange.emit({ id: next.removedTool, selected: false });\n  }\n\n  private startDrawerTransition(phase: 'opening' | 'closing') {\n    const drawer = this.el.querySelector('.panel-tools__drawer') as HTMLElement | null;\n    if (this.motion !== 'idle') {\n      this.finishDrawerTransition();\n      this.ignoreReplacementTerminal = true;\n    }\n    this.motion = phase;\n    this.dsChromeTransitionStart.emit({ source: 'panel-tools', phase });\n    const generation = ++this.transitionGeneration;\n\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        if (generation !== this.transitionGeneration || this.motion !== phase) return;\n        if (!drawer) {\n          this.finishDrawerTransition();\n          return;\n        }\n\n        if (this.drawerTransitionAtTerminal(drawer, phase)) {\n          this.finishDrawerTransition();\n          return;\n        }\n\n        const fallbackMs = panelToolsDrawerTransitionMs(getComputedStyle(drawer));\n        if (fallbackMs <= 0) {\n          this.finishDrawerTransition();\n          return;\n        }\n        this.transitionFallbackTimer = window.setTimeout(() => {\n          this.finishDrawerTransition();\n        }, fallbackMs);\n      });\n    });\n  }\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    const drawer = this.el.querySelector('.panel-tools__drawer') as HTMLElement | null;\n    if (event.target !== drawer) return;\n    if (event.propertyName !== 'max-width') return;\n    if (this.ignoreReplacementTerminal) {\n      this.ignoreReplacementTerminal = false;\n      return;\n    }\n    // Changing from the neutral transition recipe to the direction-specific\n    // easing can cancel the transition that the reflected `open` class began.\n    // The replacement transition and its watchdog still own completion; ending\n    // motion here would hide the fixed-width tool surface while it is visible.\n    if (event.type === 'transitioncancel') return;\n    if (drawer && !this.drawerTransitionAtTerminal(drawer, this.motion)) return;\n    this.finishDrawerTransition();\n  };\n\n  private drawerTransitionAtTerminal(\n    drawer: HTMLElement,\n    phase: 'opening' | 'closing' | 'idle'\n  ): boolean {\n    const width = drawer.getBoundingClientRect().width;\n    const surface = drawer.querySelector('.panel-tools__drawer-surface') as HTMLElement | null;\n    const targetWidth = surface?.getBoundingClientRect().width ?? 0;\n    return panelToolsDrawerAtTerminal(width, targetWidth, phase);\n  }\n\n  private finishDrawerTransition() {\n    const completedPhase = this.motion;\n    const wasTransitioning = completedPhase !== 'idle';\n    this.clearTransitionCompletion();\n    if (!wasTransitioning) return;\n    this.ignoreReplacementTerminal = false;\n    this.motion = 'idle';\n    if (completedPhase === 'closing' && !this.open) {\n      this.drawerSurfaceRetained = false;\n    }\n    this.dsChromeTransitionEnd.emit({ source: 'panel-tools' });\n  }\n\n  private clearTransitionCompletion() {\n    this.transitionGeneration += 1;\n    if (this.transitionFallbackTimer !== null) {\n      window.clearTimeout(this.transitionFallbackTimer);\n      this.transitionFallbackTimer = null;\n    }\n  }\n\n  /** Rail selection follows `open` immediately — independent of the slide animation. */\n  private isRailSelected(id: PanelToolsToolId): boolean {\n    return this.open && this.activeTool === id;\n  }\n\n  /** Drawer body stays mounted while the clip frame animates closed. */\n  private isDrawerPresent(): boolean {\n    return this.open || this.drawerSurfaceRetained;\n  }\n\n  private isViewActive(id: PanelToolsToolId): boolean {\n    return this.isDrawerPresent() && this.activeTool === id;\n  }\n\n  private hasFullView(id: PanelToolsToolId): boolean {\n    return this.fullViewToolIds.includes(id);\n  }\n\n  private syncFullViewTools() {\n    const ids: PanelToolsToolId[] = ['search', 'messages', 'stacks', 'activity', 'agents', 'help'];\n    const next = ids.filter(id => Boolean(this.el.querySelector(`[slot=\"${id}-view\"]`)));\n    if (next.join('|') !== this.fullViewToolIds.join('|')) this.fullViewToolIds = next;\n  }\n\n  private headerLabel(): string {\n    if (!this.isDrawerPresent() || !this.activeTool) return '';\n    return PANEL_TOOLS_LABELS[this.activeTool as PanelToolsToolId] ?? '';\n  }\n\n  private resolvedHeaders(): PanelToolsHeaders {\n    if (Object.keys(this.headers).length) return this.headers;\n    if (!this.headersJson.trim()) return {};\n    try {\n      const parsed = JSON.parse(this.headersJson);\n      return parsed && typeof parsed === 'object' && !Array.isArray(parsed)\n        ? (parsed as PanelToolsHeaders)\n        : {};\n    } catch {\n      return {};\n    }\n  }\n\n  private activeHeader(): PanelToolsHeaderConfig {\n    if (!this.activeTool) return {};\n    return this.resolvedHeaders()[this.activeTool] ?? {};\n  }\n\n  private handleToolChange = (id: PanelToolsToolId) => {\n    const next = resolvePanelToolActivation(this.open, this.activeTool, id);\n    this.open = next.open;\n    this.activeTool = next.activeTool;\n    this.dsToolChange.emit({ id, selected: next.selected });\n  };\n\n  /** Toggle any rail tool open/closed — shell shortcuts K/A/S/M/N call this. */\n  @Method()\n  async activateTool(id: PanelToolsToolId) {\n    const item = this.railItems.find(entry => entry.id === id);\n    if (!item || item.isInactive) return;\n    this.handleToolChange(id);\n  }\n\n  /** Close the tools drawer when open — used by shell keyboard shortcuts. */\n  @Method()\n  async closeDrawer() {\n    if (!this.open) return;\n    const id = this.activeTool;\n    this.open = false;\n    if (id) {\n      this.dsToolChange.emit({ id, selected: false });\n    }\n  }\n\n  /** Focus an active tool-header action by its application-owned id. */\n  @Method()\n  async focusHeaderAction(id: string) {\n    const action = this.el.querySelector(`[data-header-action-id=\"${CSS.escape(id)}\"]`) as\n      | (HTMLElement & { setFocus?: () => Promise<void> })\n      | null;\n    await action?.setFocus?.();\n  }\n\n  private focusRailAt(index: number) {\n    const items = this.orderedRailItems;\n    if (!items.length) return;\n    const bounded = Math.max(0, Math.min(index, items.length - 1));\n    if (bounded === this.rovingIndex) return;\n    this.rovingIndex = bounded;\n    const actions = Array.from(\n      this.el.querySelectorAll<HTMLElement>('.panel-tools__rail-action .button-icon')\n    );\n    actions[bounded]?.focus({ preventScroll: true });\n  }\n\n  private handleRailKeyDown = (e: KeyboardEvent, index: number) => {\n    const items = this.orderedRailItems;\n    if (!items.length) return;\n\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      this.handleToolChange(items[index].id);\n      return;\n    }\n\n    if (e.key === 'ArrowDown') {\n      if (index >= items.length - 1) return;\n      e.preventDefault();\n      this.focusRailAt(index + 1);\n      return;\n    }\n\n    if (e.key === 'ArrowUp') {\n      if (index <= 0) return;\n      e.preventDefault();\n      this.focusRailAt(index - 1);\n    }\n  };\n\n  private renderRailAction(item: PanelToolsItem, index: number) {\n    const label = item.ariaLabel ?? PANEL_TOOLS_LABELS[item.id];\n    return (\n      <ds-tooltip\n        key={item.id}\n        label={label}\n        shortcutKey={PANEL_TOOLS_SHORTCUTS[item.id]}\n        side=\"left\"\n        size=\"sm\"\n      >\n        <ds-button-unfilled\n          variant=\"icon\"\n          class=\"panel-tools__rail-action\"\n          icon={item.icon}\n          isActive={this.isRailSelected(item.id)}\n          activeFill={false}\n          hasBorder={false}\n          dot={item.dot ?? false}\n          isInactive={item.isInactive}\n          focusTabIndex={index === this.rovingIndex ? 0 : -1}\n          aria-label={label}\n          pressed={this.isRailSelected(item.id)}\n          onFocusin={() => {\n            this.rovingIndex = index;\n          }}\n          onKeyDown={(e: KeyboardEvent) => this.handleRailKeyDown(e, index)}\n          onDsClick={() => this.handleToolChange(item.id)}\n        />\n      </ds-tooltip>\n    );\n  }\n\n  render() {\n    const headerLabel = this.headerLabel();\n    const header = this.activeHeader();\n    const headerTitle = header.title?.trim() || headerLabel;\n    const headerActions = header.actions ?? [];\n    const orderedRailItems = this.orderedRailItems;\n    const headerItem = orderedRailItems.find(item => item.id === PANEL_TOOLS_PRIMARY_TOOL_ID);\n    const footerItem = orderedRailItems.find(item => item.id === PANEL_TOOLS_FOOTER_TOOL_ID);\n    const bodyItems = orderedRailItems.filter(\n      item => item.id !== PANEL_TOOLS_PRIMARY_TOOL_ID && item.id !== PANEL_TOOLS_FOOTER_TOOL_ID\n    );\n    const footerIndex = footerItem ? (headerItem ? 1 : 0) + bodyItems.length : -1;\n    const showDrawerChrome = this.isDrawerPresent();\n    const drawerResting = panelToolsDrawerResting(this.open, this.motion);\n    const activeFullView = Boolean(\n      showDrawerChrome && this.activeTool && this.hasFullView(this.activeTool)\n    );\n    const toolIds: PanelToolsToolId[] = [\n      'search',\n      'messages',\n      'stacks',\n      'activity',\n      'agents',\n      'help',\n    ];\n\n    return (\n      <Host\n        class={{\n          'panel-tools': true,\n          'panel-tools--open': this.open,\n          'panel-tools--ready': this.readyForMotion,\n          'panel-tools--motion-opening': this.motion === 'opening',\n          'panel-tools--motion-closing': this.motion === 'closing',\n          'panel-tools--drawer-resting': drawerResting,\n          'panel-tools--fullscreen': this.presentation === 'fullscreen',\n          'panel-tools--presentation-snap': this.presentationMotionSuppressed,\n        }}\n        role={this.presentation === 'fullscreen' ? 'dialog' : 'complementary'}\n        aria-modal={this.presentation === 'fullscreen' ? 'true' : undefined}\n        aria-label={this.toolsLabel}\n      >\n        <div class=\"panel-tools__layout\">\n          <nav class=\"panel-tools__rail\" aria-label={this.toolShortcutsLabel}>\n            {headerItem ? (\n              <div class=\"panel-tools__rail-header\">{this.renderRailAction(headerItem, 0)}</div>\n            ) : null}\n            <div class=\"panel-tools__rail-body\">\n              {bodyItems.map((item, bodyIdx) =>\n                this.renderRailAction(item, headerItem ? bodyIdx + 1 : bodyIdx)\n              )}\n            </div>\n            {footerItem ? (\n              <div class=\"panel-tools__rail-footer\">\n                {this.renderRailAction(footerItem, footerIndex)}\n              </div>\n            ) : null}\n          </nav>\n\n          <div\n            class={{\n              'panel-tools__drawer': true,\n              'panel-tools__drawer--visible': showDrawerChrome,\n            }}\n            aria-hidden={showDrawerChrome ? null : 'true'}\n            inert={showDrawerChrome ? undefined : true}\n          >\n            <div class=\"panel-tools__drawer-surface\">\n              {this.presentation !== 'fullscreen' || this.fullscreenHeaderMode === 'shared' ? (\n                <ds-panel-tool-header\n                  class=\"panel-tools__header\"\n                  heading={headerTitle}\n                  showBack={header.showBack ?? false}\n                  backIcon={header.backIcon || 'ChevronLeft'}\n                  backAriaLabel={header.backAriaLabel || 'Back'}\n                  showMenu={false}\n                  ref={element => {\n                    const toolHeader = element as\n                      | (HTMLDsPanelToolHeaderElement & {\n                          actions: PanelToolsHeaderAction[];\n                        })\n                      | undefined;\n                    if (toolHeader) toolHeader.actions = headerActions;\n                  }}\n                  onDsBack={() => {\n                    if (this.activeTool) this.dsHeaderBack.emit({ tool: this.activeTool });\n                  }}\n                />\n              ) : null}\n              <div class=\"panel-tools__body\" hidden={activeFullView}>\n                {toolIds.map(id => {\n                  const active = this.isViewActive(id);\n                  return (\n                    <div\n                      class={{\n                        'panel-tools__view': true,\n                        'panel-tools__view--active': active,\n                      }}\n                      hidden={!active}\n                    >\n                      <slot name={id} />\n                    </div>\n                  );\n                })}\n              </div>\n              <div class=\"panel-tools__full-views\" hidden={!activeFullView}>\n                {toolIds.map(id => (\n                  <div\n                    class={{\n                      'panel-tools__full-view': true,\n                      'panel-tools__full-view--active':\n                        this.isViewActive(id) && this.hasFullView(id),\n                    }}\n                    hidden={!(this.isViewActive(id) && this.hasFullView(id))}\n                  >\n                    <slot name={`${id}-view`} />\n                  </div>\n                ))}\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["PANEL_TOOLS_TOOL_IDS","PANEL_TOOLS_PRIMARY_TOOL_ID","PANEL_TOOLS_FOOTER_TOOL_ID","PANEL_TOOLS_LABELS","search","messages","stacks","activity","agents","help","PANEL_TOOLS_SHORTCUTS","parsePanelToolsItems","items","itemsJson","parseJsonArrayProp","orderPanelToolsItems","firstById","Map","item","has","id","set","flatMap","get","isPanelToolsToolId","value","includes","reconcilePanelToolsAvailability","open","activeTool","some","removedTool","panelToolsDrawerTransitionMs","style","properties","transitionProperty","split","map","trim","durations","transitionDuration","parseCssTimeMs","delays","transitionDelay","reduce","max","property","index","duration","length","delay","Math","panelToolsDrawerResting","motion","panelToolsDrawerAtTerminal","width","targetWidth","resolvePanelToolActivation","selected","panelToolsCss","PanelTools","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","presentation","fullscreenHeaderMode","toolsLabel","toolShortcutsLabel","headers","headersJson","storageKey","drawerSurfaceRetained","readyForMotion","presentationMotionSuppressed","rovingIndex","fullViewToolIds","motionEnableGeneration","presentationMotionGeneration","transitionGeneration","transitionFallbackTimer","ignoreReplacementTerminal","focusBeforeFullscreen","fullViewObserver","handleComposedHeaderAction","event","detail","stopPropagation","dsHeaderAction","emit","tool","handleTransitionEnd","drawer","el","querySelector","target","propertyName","type","drawerTransitionAtTerminal","finishDrawerTransition","handleToolChange","next","dsToolChange","handleRailKeyDown","e","orderedRailItems","key","preventDefault","focusRailAt","railItems","headerItem","find","footerItem","bodyItems","filter","ordered","push","disconnectedCallback","removeEventListener","clearTransitionCompletion","disconnect","presentationChanged","previous","presentationGeneration","requestAnimationFrame","document","activeElement","fallbackActionId","activeHeader","actions","async","isConnected","focus","preventScroll","focusRestored","contains","focusHeaderAction","dsPresentationChange","handleFullscreenEscape","deferMotionEnable","generation","connectedCallback","addEventListener","componentWillLoad","restoreLastActiveTool","openChanged","isOpen","wasOpen","undefined","startDrawerTransition","activeToolChanged","persistLastActiveTool","storageKeyChanged","componentDidLoad","syncFullViewTools","MutationObserver","observe","childList","attributes","attributeFilter","itemsChanged","reconcileActiveTool","stored","localStorage","getItem","setItem","clearPersistedTool","removeItem","phase","dsChromeTransitionStart","source","fallbackMs","getComputedStyle","window","setTimeout","getBoundingClientRect","surface","completedPhase","wasTransitioning","dsChromeTransitionEnd","clearTimeout","isRailSelected","isDrawerPresent","isViewActive","hasFullView","ids","Boolean","join","headerLabel","resolvedHeaders","Object","keys","parsed","JSON","parse","Array","isArray","activateTool","entry","isInactive","closeDrawer","action","CSS","escape","setFocus","bounded","min","from","querySelectorAll","renderRailAction","label","ariaLabel","h","shortcutKey","side","size","variant","class","icon","isActive","activeFill","hasBorder","dot","focusTabIndex","pressed","onFocusin","onKeyDown","onDsClick","render","header","headerTitle","title","headerActions","footerIndex","showDrawerChrome","drawerResting","activeFullView","toolIds","Host","role","bodyIdx","inert","heading","showBack","backIcon","backAriaLabel","showMenu","ref","element","toolHeader","onDsBack","dsHeaderBack","hidden","active","name"],"sources":["src/wc/components/PanelTools/panel-tools-types.ts","src/wc/components/PanelTools/panel-tools-utils.ts","src/wc/components/PanelTools/PanelTools.css?tag=ds-panel-tools&encapsulation=scoped","src/wc/components/PanelTools/PanelTools.tsx"],"sourcesContent":["/** Tool ids for the `ds-panel-tools` rail and drawer views. */\nexport type PanelToolsToolId = 'search' | 'agents' | 'messages' | 'stacks' | 'activity' | 'help';\n\nexport const PANEL_TOOLS_TOOL_IDS: PanelToolsToolId[] = [\n  'search',\n  'agents',\n  'messages',\n  'stacks',\n  'activity',\n  'help',\n];\n\n/** Rail header slot — mirrors panel-nav M logo row. */\nexport const PANEL_TOOLS_PRIMARY_TOOL_ID: PanelToolsToolId = 'search';\n\n/** Rail footer slot — flush to the bottom of the tools column. */\nexport const PANEL_TOOLS_FOOTER_TOOL_ID: PanelToolsToolId = 'help';\n\nexport const PANEL_TOOLS_LABELS: Record<PanelToolsToolId, string> = {\n  search: 'Search',\n  messages: 'Messages',\n  stacks: 'Stacks',\n  activity: 'Activity',\n  agents: 'Agents',\n  help: 'Help & Support',\n};\n\nexport const PANEL_TOOLS_SHORTCUTS: Partial<Record<PanelToolsToolId, string>> = {\n  search: 'K',\n  agents: 'A',\n  messages: 'M',\n  stacks: 'S',\n  activity: 'N',\n  help: '?',\n};\n\nexport interface PanelToolsItem {\n  id: PanelToolsToolId;\n  /** Icon name for <ds-icon>. */\n  icon: string;\n  /** Whether this rail button is currently pressed/active. */\n  selected?: boolean;\n  /** Show a notification dot. */\n  dot?: boolean;\n  isInactive?: boolean;\n  ariaLabel?: string;\n}\n\nexport interface PanelToolsHeaderAction {\n  id: string;\n  icon: string;\n  ariaLabel: string;\n  triggerId?: string;\n  controls?: string;\n  expanded?: boolean;\n  haspopup?: 'menu' | 'dialog' | 'listbox' | 'tree' | 'grid';\n  pressed?: boolean;\n  isInactive?: boolean;\n}\n\nexport interface PanelToolsHeaderConfig {\n  title?: string;\n  showBack?: boolean;\n  backIcon?: string;\n  backAriaLabel?: string;\n  actions?: PanelToolsHeaderAction[];\n}\n\n/** Per-tool header state. The application replaces the object when a tool changes depth or actions. */\nexport type PanelToolsHeaders = Partial<Record<PanelToolsToolId, PanelToolsHeaderConfig>>;\n","import { parseJsonArrayProp } from '../BarNav/bar-nav-utils';\nimport { parseCssTimeMs } from '../../utils/resolve-css-time-ms';\nimport {\n  PANEL_TOOLS_TOOL_IDS,\n  type PanelToolsItem,\n  type PanelToolsToolId,\n} from './panel-tools-types';\n\nexport function parsePanelToolsItems(items: PanelToolsItem[], itemsJson: string): PanelToolsItem[] {\n  if (itemsJson) {\n    return parseJsonArrayProp<PanelToolsItem>(itemsJson, []);\n  }\n  return items ?? [];\n}\n\nexport function orderPanelToolsItems(items: PanelToolsItem[]): PanelToolsItem[] {\n  const firstById = new Map<PanelToolsToolId, PanelToolsItem>();\n  for (const item of items) {\n    if (!firstById.has(item.id)) firstById.set(item.id, item);\n  }\n  return PANEL_TOOLS_TOOL_IDS.flatMap(id => {\n    const item = firstById.get(id);\n    return item ? [item] : [];\n  });\n}\n\nexport function isPanelToolsToolId(value: string | null): value is PanelToolsToolId {\n  return value !== null && PANEL_TOOLS_TOOL_IDS.includes(value as PanelToolsToolId);\n}\n\nexport function reconcilePanelToolsAvailability(\n  items: PanelToolsItem[],\n  open: boolean,\n  activeTool: PanelToolsToolId | ''\n): { open: boolean; activeTool: PanelToolsToolId | ''; removedTool: PanelToolsToolId | '' } {\n  if (!activeTool || items.some(item => item.id === activeTool)) {\n    return { open, activeTool, removedTool: '' };\n  }\n  return { open: false, activeTool: '', removedTool: activeTool };\n}\n\nexport function shouldResyncPanelToolsItems(\n  prev: PanelToolsItem[],\n  next: PanelToolsItem[]\n): boolean {\n  if (prev.length !== next.length) return true;\n  return next.some((item, index) => {\n    const prior = prev[index];\n    if (!prior) return true;\n    return (\n      prior.id !== item.id ||\n      prior.icon !== item.icon ||\n      prior.selected !== item.selected ||\n      prior.dot !== item.dot ||\n      prior.isInactive !== item.isInactive ||\n      prior.ariaLabel !== item.ariaLabel\n    );\n  });\n}\n\nexport type PanelToolsMotion = 'opening' | 'closing' | 'idle';\n\nexport interface PanelToolsTransitionStyle {\n  transitionProperty: string;\n  transitionDuration: string;\n  transitionDelay: string;\n}\n\n/** Maximum computed time for the drawer's max-width transition, including delay. */\nexport function panelToolsDrawerTransitionMs(style: PanelToolsTransitionStyle): number {\n  const properties = style.transitionProperty.split(',').map(item => item.trim());\n  const durations = style.transitionDuration.split(',').map(item => parseCssTimeMs(item.trim(), 0));\n  const delays = style.transitionDelay.split(',').map(item => parseCssTimeMs(item.trim(), 0));\n\n  return properties.reduce((max, property, index) => {\n    if (property !== 'all' && property !== 'max-width') return max;\n    const duration = durations[index % durations.length] ?? 0;\n    const delay = delays[index % delays.length] ?? 0;\n    return Math.max(max, duration + delay, 0);\n  }, 0);\n}\n\n/** True when the drawer clip is fully closed — safe to skip painting slot content. */\nexport function panelToolsDrawerResting(open: boolean, motion: PanelToolsMotion): boolean {\n  return !open && motion === 'idle';\n}\n\n/** True only when the animated clip has reached the terminal width for its motion phase. */\nexport function panelToolsDrawerAtTerminal(\n  width: number,\n  targetWidth: number,\n  motion: PanelToolsMotion\n): boolean {\n  if (motion === 'closing') return width <= 0.5;\n  if (motion === 'opening') return targetWidth > 0 && width >= targetWidth - 0.5;\n  return true;\n}\n\n/** Toggle or switch rail tool selection — repeat activation closes the active tool. */\nexport function resolvePanelToolActivation(\n  open: boolean,\n  activeTool: PanelToolsToolId | '',\n  id: PanelToolsToolId\n): { open: boolean; activeTool: PanelToolsToolId; selected: boolean } {\n  if (open && activeTool === id) {\n    return { open: false, activeTool: id, selected: false };\n  }\n  return { open: true, activeTool: id, selected: true };\n}\n","@import '../../utils/control-density.css';\n\n:host {\n  display: block;\n  flex: 0 0 auto;\n  box-sizing: border-box;\n  height: 100%;\n  min-height: 0;\n  overflow: hidden;\n  --_panel-tools-rail-width: var(--dimension-size-600);\n  --_panel-tools-drawer-width: var(--ds-shell-panel-tools-width, var(--dimension-panel-width-xs));\n  --_panel-tools-border: var(--dimension-stroke-width-012, 1px) solid var(--color-border-tertiary);\n  /* Match panel-nav expand timing (medium-1); easing differs by direction. */\n  --_panel-tools-expand-dur: var(--effect-animation-duration-medium-1, 300ms);\n}\n\n.panel-tools__layout {\n  display: flex;\n  flex-direction: row-reverse;\n  align-items: stretch;\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n}\n\n/* Clip frame — only max-width animates (slide reveal, same as pre-rail :host). */\n.panel-tools__drawer {\n  flex: 0 0 auto;\n  max-width: 0;\n  min-width: 0;\n  height: 100%;\n  min-height: 0;\n  overflow: hidden;\n  box-sizing: border-box;\n  transition: none;\n}\n\n:host(.panel-tools--ready) .panel-tools__drawer {\n  transition: max-width var(--_panel-tools-expand-dur)\n    var(--effect-animation-easing-ease-in-out, ease);\n}\n\n:host(.panel-tools--ready.panel-tools--motion-opening) .panel-tools__drawer {\n  transition: max-width var(--_panel-tools-expand-dur)\n    var(--effect-animation-easing-ease-out, ease-out);\n}\n\n:host(.panel-tools--ready.panel-tools--motion-closing) .panel-tools__drawer {\n  transition: max-width var(--_panel-tools-expand-dur)\n    var(--effect-animation-easing-ease-in, ease-in);\n}\n\n:host(.panel-tools--open) .panel-tools__drawer {\n  max-width: var(--_panel-tools-drawer-width);\n}\n\n.panel-tools__drawer--visible {\n  border-left: var(--_panel-tools-border);\n}\n\n/* Fixed-width surface — AppShell supplies the standard 300px tools width. */\n.panel-tools__drawer-surface {\n  display: flex;\n  flex-direction: column;\n  width: var(--_panel-tools-drawer-width);\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n  background-color: transparent;\n}\n\n.panel-tools__full-views,\n.panel-tools__full-view {\n  flex: 1 1 auto;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.panel-tools__full-view {\n  height: 100%;\n}\n\n.panel-tools__full-view {\n  display: none;\n}\n.panel-tools__full-view--active {\n  display: block;\n}\n\n:host([presentation='fullscreen']) {\n  height: 100vh;\n  inset: 0;\n  position: fixed;\n  width: 100vw;\n  z-index: var(--dimension-z-index-modal);\n}\n\n:host([presentation='fullscreen']) .panel-tools__rail {\n  display: none;\n}\n:host([presentation='fullscreen']) .panel-tools__drawer {\n  max-width: 100vw;\n  transition: none;\n  width: 100vw;\n}\n:host([presentation='fullscreen']) .panel-tools__drawer--visible {\n  border-left: none;\n}\n:host([presentation='fullscreen']) .panel-tools__drawer-surface {\n  background-color: transparent;\n  width: 100vw;\n}\n\n:host(.panel-tools--presentation-snap) .panel-tools__drawer {\n  transition: none;\n}\n\n.panel-tools__body {\n  flex: 1 1 auto;\n  min-height: 0;\n  overflow: auto;\n  position: relative;\n}\n\n/* Skip paint while fully closed; cleared during open/close motion for WYSIWYG slide. */\n:host(.panel-tools--drawer-resting) .panel-tools__body {\n  content-visibility: auto;\n  contain-intrinsic-size: auto 200px;\n}\n\n.panel-tools__view {\n  display: none;\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n  padding: var(--dimension-space-200);\n  color: var(--color-foreground-secondary);\n  font-family: var(--typography-font-family);\n  font-size: var(--typography-fontsize-md);\n  line-height: var(--typography-lineheight-md);\n  font-weight: var(--typography-weight-regular);\n  letter-spacing: var(--typography-letterspacing-negative-half);\n}\n\n.panel-tools__view ::slotted(*) {\n  margin: 0;\n  color: var(--color-foreground-secondary);\n  font-family: var(--typography-font-family);\n  font-size: var(--typography-fontsize-md);\n  line-height: var(--typography-lineheight-md);\n  font-weight: var(--typography-weight-regular);\n  letter-spacing: var(--typography-letterspacing-negative-half);\n}\n\n.panel-tools__view--active {\n  display: block;\n}\n\n/* Rail — mirrors collapsed panel-nav width, padding, and item rhythm. */\n.panel-tools__rail {\n  flex: 0 0 var(--_panel-tools-rail-width);\n  width: var(--_panel-tools-rail-width);\n  min-width: var(--_panel-tools-rail-width);\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  height: 100%;\n  min-height: 0;\n  border-left: var(--_panel-tools-border);\n  background-color: transparent;\n}\n\n.panel-tools__rail-header {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: var(--dimension-size-600);\n  padding: var(--dimension-space-100);\n  flex-shrink: 0;\n  box-sizing: border-box;\n  border-bottom: var(--_panel-tools-border);\n}\n\n.panel-tools__rail-body {\n  flex: 1 1 auto;\n  min-height: 0;\n  overflow-y: auto;\n  overflow-x: hidden;\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050);\n  padding: var(--dimension-space-100);\n  box-sizing: border-box;\n  scrollbar-width: none;\n}\n\n.panel-tools__rail-body::-webkit-scrollbar {\n  display: none;\n}\n\n/* Flush to the bottom of the rail — mirrors Search header pin. */\n.panel-tools__rail-footer {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  margin-top: auto;\n  padding: var(--dimension-space-100);\n  box-sizing: border-box;\n}\n\n.panel-tools__rail-action {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: var(--ds-control-height);\n  flex-shrink: 0;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  :host(.panel-tools--ready.panel-tools--motion-opening) .panel-tools__drawer,\n  :host(.panel-tools--ready.panel-tools--motion-closing) .panel-tools__drawer {\n    transition: none;\n  }\n}\n","import {\n  Component,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n  State,\n  Watch,\n  Method,\n  Listen,\n  h,\n  Host,\n} from '@stencil/core';\nimport type { ChromeTransitionDetail } from '../../shell/chrome-transition';\nimport {\n  PANEL_TOOLS_FOOTER_TOOL_ID,\n  PANEL_TOOLS_LABELS,\n  PANEL_TOOLS_PRIMARY_TOOL_ID,\n  PANEL_TOOLS_SHORTCUTS,\n  type PanelToolsHeaderAction,\n  type PanelToolsHeaderConfig,\n  type PanelToolsHeaders,\n  type PanelToolsItem,\n  type PanelToolsToolId,\n} from './panel-tools-types';\nimport {\n  isPanelToolsToolId,\n  orderPanelToolsItems,\n  panelToolsDrawerAtTerminal,\n  parsePanelToolsItems,\n  panelToolsDrawerResting,\n  panelToolsDrawerTransitionMs,\n  reconcilePanelToolsAvailability,\n  resolvePanelToolActivation,\n} from './panel-tools-utils';\n\n@Component({\n  tag: 'ds-panel-tools',\n  styleUrl: 'PanelTools.css',\n  scoped: true,\n})\nexport class PanelTools {\n  @Element() el!: HTMLElement;\n\n  /** When false, only the icon rail is shown. */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /** Drawer presentation or viewport-covering presentation for the active tool. */\n  @Prop({ mutable: true, reflect: true }) presentation: 'drawer' | 'fullscreen' = 'drawer';\n\n  /** Let a fullscreen product supply independent master/detail headers inside its view. */\n  @Prop({ attribute: 'fullscreen-header-mode', reflect: true })\n  fullscreenHeaderMode: 'shared' | 'split' = 'shared';\n\n  /** Active tool view — `search`, `agents`, `messages`, `stacks`, `activity`, or `help`. */\n  @Prop({ mutable: true, attribute: 'active-tool', reflect: true })\n  activeTool: PanelToolsToolId | '' = '';\n\n  /**\n   * Rail items rendered in the right column.\n   * Set via JS property: `el.items = [...]`. Replace the array reference to update.\n   */\n  @Prop() items: PanelToolsItem[] = [];\n\n  /** JSON fallback for `items` — useful when framework bindings don't propagate arrays. */\n  @Prop({ attribute: 'items-json' }) itemsJson: string = '';\n  @Prop() toolsLabel: string = 'Tools';\n  @Prop() toolShortcutsLabel: string = 'Tool shortcuts';\n\n  /** Active header state per tool. Replace the object when title, depth, or actions change. */\n  @Prop() headers: PanelToolsHeaders = {};\n\n  /** JSON fallback for `headers`. The `headers` property takes precedence when non-empty. */\n  @Prop({ attribute: 'headers-json' }) headersJson: string = '';\n\n  /**\n   * Optional localStorage key for the last active tool. The drawer always starts\n   * closed; only the tool identity is restored for continuity within this browser.\n   */\n  @Prop({ attribute: 'storage-key' }) storageKey: string = '';\n\n  /** Emitted when a rail button is toggled. Detail = { id, selected }. */\n  @Event({ bubbles: true, composed: true }) dsToolChange!: EventEmitter<{\n    id: PanelToolsToolId;\n    selected: boolean;\n  }>;\n\n  /** Emitted when fullscreen changes, including Escape-initiated exits. */\n  @Event({ bubbles: true, composed: true }) dsPresentationChange!: EventEmitter<{\n    presentation: 'drawer' | 'fullscreen';\n  }>;\n\n  /** Requests navigation to the active tool's parent view. */\n  @Event({ bubbles: true, composed: true }) dsHeaderBack!: EventEmitter<{\n    tool: PanelToolsToolId;\n  }>;\n\n  /** Requests one application-owned action from the active tool header. */\n  @Event({ bubbles: true, composed: true }) dsHeaderAction!: EventEmitter<{\n    tool: PanelToolsToolId;\n    id: string;\n  }>;\n\n  /** Bubbling lifecycle — `ds-bar-nav` defers overflow checks during drawer motion. */\n  @Event({ bubbles: true, composed: true })\n  dsChromeTransitionStart!: EventEmitter<ChromeTransitionDetail>;\n\n  @Event({ bubbles: true, composed: true })\n  dsChromeTransitionEnd!: EventEmitter<ChromeTransitionDetail>;\n\n  /** Arms open vs close easing for the in-flight width transition. */\n  @State() private motion: 'opening' | 'closing' | 'idle' = 'idle';\n\n  /** Keeps header and slotted content painted until the closing clip transition completes. */\n  @State() private drawerSurfaceRetained = false;\n\n  /** Suppresses width transition until the host has painted its initial open state. */\n  @State() private readyForMotion = false;\n\n  /** Fullscreen presentation changes snap without borrowing drawer width motion. */\n  @State() private presentationMotionSuppressed = false;\n\n  @State() private rovingIndex = 0;\n  @State() private fullViewToolIds: PanelToolsToolId[] = [];\n\n  private motionEnableGeneration = 0;\n  private presentationMotionGeneration = 0;\n  private transitionGeneration = 0;\n  private transitionFallbackTimer: number | null = null;\n  /** Ignores the old transition's terminal event when reversing direction. */\n  private ignoreReplacementTerminal = false;\n  private focusBeforeFullscreen: HTMLElement | null = null;\n  private fullViewObserver: MutationObserver | null = null;\n\n  private get railItems(): PanelToolsItem[] {\n    return parsePanelToolsItems(this.items, this.itemsJson);\n  }\n\n  private get orderedRailItems(): PanelToolsItem[] {\n    const railItems = orderPanelToolsItems(this.railItems);\n    const headerItem = railItems.find(item => item.id === PANEL_TOOLS_PRIMARY_TOOL_ID);\n    const footerItem = railItems.find(item => item.id === PANEL_TOOLS_FOOTER_TOOL_ID);\n    const bodyItems = railItems.filter(\n      item => item.id !== PANEL_TOOLS_PRIMARY_TOOL_ID && item.id !== PANEL_TOOLS_FOOTER_TOOL_ID\n    );\n    const ordered: PanelToolsItem[] = [];\n    if (headerItem) ordered.push(headerItem);\n    ordered.push(...bodyItems);\n    if (footerItem) ordered.push(footerItem);\n    return ordered;\n  }\n\n  disconnectedCallback() {\n    this.el.removeEventListener('transitionend', this.handleTransitionEnd);\n    this.el.removeEventListener('transitioncancel', this.handleTransitionEnd);\n    this.el.removeEventListener('dsAction', this.handleComposedHeaderAction);\n    this.clearTransitionCompletion();\n    this.motionEnableGeneration += 1;\n    this.fullViewObserver?.disconnect();\n    this.fullViewObserver = null;\n  }\n\n  @Watch('presentation')\n  presentationChanged(next: 'drawer' | 'fullscreen', previous?: 'drawer' | 'fullscreen') {\n    if (next === previous) return;\n    const presentationGeneration = ++this.presentationMotionGeneration;\n    this.presentationMotionSuppressed = true;\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        if (presentationGeneration !== this.presentationMotionGeneration) return;\n        this.presentationMotionSuppressed = false;\n      });\n    });\n    if (next === 'fullscreen') {\n      this.focusBeforeFullscreen =\n        document.activeElement instanceof HTMLElement ? document.activeElement : null;\n      this.open = true;\n    } else if (previous === 'fullscreen') {\n      const focusBeforeFullscreen = this.focusBeforeFullscreen;\n      const fallbackActionId = this.activeHeader().actions?.[0]?.id;\n      requestAnimationFrame(async () => {\n        if (focusBeforeFullscreen?.isConnected) {\n          focusBeforeFullscreen.focus({ preventScroll: true });\n        }\n        const focusRestored = focusBeforeFullscreen\n          ? document.activeElement === focusBeforeFullscreen ||\n            focusBeforeFullscreen.contains(document.activeElement)\n          : false;\n        if (!focusRestored && fallbackActionId) await this.focusHeaderAction(fallbackActionId);\n        this.focusBeforeFullscreen = null;\n      });\n    }\n    this.dsPresentationChange.emit({ presentation: next });\n  }\n\n  @Listen('keydown', { target: 'window', capture: true })\n  handleFullscreenEscape(event: KeyboardEvent) {\n    if (this.presentation !== 'fullscreen' || event.key !== 'Escape') return;\n    event.preventDefault();\n    event.stopPropagation();\n    this.presentation = 'drawer';\n  }\n\n  private deferMotionEnable() {\n    if (this.readyForMotion) return;\n    const generation = ++this.motionEnableGeneration;\n    requestAnimationFrame(() => {\n      if (generation !== this.motionEnableGeneration) return;\n      requestAnimationFrame(() => {\n        if (generation !== this.motionEnableGeneration) return;\n        this.readyForMotion = true;\n      });\n    });\n  }\n\n  connectedCallback() {\n    this.el.addEventListener('transitionend', this.handleTransitionEnd);\n    this.el.addEventListener('transitioncancel', this.handleTransitionEnd);\n    this.el.addEventListener('dsAction', this.handleComposedHeaderAction);\n  }\n\n  private handleComposedHeaderAction = (event: Event) => {\n    const detail = (event as CustomEvent<{ id?: string }>).detail;\n    if (!this.activeTool || !detail?.id) return;\n    event.stopPropagation();\n    this.dsHeaderAction.emit({ tool: this.activeTool, id: detail.id });\n  };\n\n  componentWillLoad() {\n    this.restoreLastActiveTool();\n    this.drawerSurfaceRetained = this.open;\n  }\n\n  @Watch('open')\n  openChanged(isOpen: boolean, wasOpen?: boolean) {\n    if (isOpen) this.drawerSurfaceRetained = true;\n    if (this.readyForMotion && wasOpen !== undefined && wasOpen !== isOpen) {\n      this.startDrawerTransition(isOpen ? 'opening' : 'closing');\n    } else if (!isOpen) {\n      this.drawerSurfaceRetained = false;\n    }\n    this.deferMotionEnable();\n  }\n\n  @Watch('activeTool')\n  activeToolChanged() {\n    this.persistLastActiveTool();\n    this.deferMotionEnable();\n  }\n\n  @Watch('storageKey')\n  storageKeyChanged() {\n    this.restoreLastActiveTool();\n  }\n\n  componentDidLoad() {\n    this.deferMotionEnable();\n    this.syncFullViewTools();\n    this.fullViewObserver = new MutationObserver(() => this.syncFullViewTools());\n    this.fullViewObserver.observe(this.el, {\n      childList: true,\n      attributes: true,\n      attributeFilter: ['slot'],\n    });\n  }\n\n  @Watch('items')\n  @Watch('itemsJson')\n  itemsChanged() {\n    this.rovingIndex = 0;\n    this.reconcileActiveTool();\n    this.deferMotionEnable();\n  }\n\n  private restoreLastActiveTool() {\n    if (!this.storageKey || this.activeTool) return;\n    try {\n      const stored = localStorage.getItem(this.storageKey);\n      if (isPanelToolsToolId(stored)) this.activeTool = stored;\n    } catch {\n      /* localStorage unavailable */\n    }\n  }\n\n  private persistLastActiveTool() {\n    if (!this.storageKey || !this.activeTool) return;\n    try {\n      localStorage.setItem(this.storageKey, this.activeTool);\n    } catch {\n      /* unavailable */\n    }\n  }\n\n  private clearPersistedTool() {\n    if (!this.storageKey) return;\n    try {\n      localStorage.removeItem(this.storageKey);\n    } catch {\n      /* unavailable */\n    }\n  }\n\n  private reconcileActiveTool() {\n    const next = reconcilePanelToolsAvailability(this.railItems, this.open, this.activeTool);\n    if (!next.removedTool) return;\n    this.clearPersistedTool();\n    this.open = next.open;\n    this.activeTool = next.activeTool;\n    this.dsToolChange.emit({ id: next.removedTool, selected: false });\n  }\n\n  private startDrawerTransition(phase: 'opening' | 'closing') {\n    const drawer = this.el.querySelector('.panel-tools__drawer') as HTMLElement | null;\n    if (this.motion !== 'idle') {\n      this.finishDrawerTransition();\n      this.ignoreReplacementTerminal = true;\n    }\n    this.motion = phase;\n    this.dsChromeTransitionStart.emit({ source: 'panel-tools', phase });\n    const generation = ++this.transitionGeneration;\n\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        if (generation !== this.transitionGeneration || this.motion !== phase) return;\n        if (!drawer) {\n          this.finishDrawerTransition();\n          return;\n        }\n\n        if (this.drawerTransitionAtTerminal(drawer, phase)) {\n          this.finishDrawerTransition();\n          return;\n        }\n\n        const fallbackMs = panelToolsDrawerTransitionMs(getComputedStyle(drawer));\n        if (fallbackMs <= 0) {\n          this.finishDrawerTransition();\n          return;\n        }\n        this.transitionFallbackTimer = window.setTimeout(() => {\n          this.finishDrawerTransition();\n        }, fallbackMs);\n      });\n    });\n  }\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    const drawer = this.el.querySelector('.panel-tools__drawer') as HTMLElement | null;\n    if (event.target !== drawer) return;\n    if (event.propertyName !== 'max-width') return;\n    if (this.ignoreReplacementTerminal) {\n      this.ignoreReplacementTerminal = false;\n      return;\n    }\n    // Changing from the neutral transition recipe to the direction-specific\n    // easing can cancel the transition that the reflected `open` class began.\n    // The replacement transition and its watchdog still own completion; ending\n    // motion here would hide the fixed-width tool surface while it is visible.\n    if (event.type === 'transitioncancel') return;\n    if (drawer && !this.drawerTransitionAtTerminal(drawer, this.motion)) return;\n    this.finishDrawerTransition();\n  };\n\n  private drawerTransitionAtTerminal(\n    drawer: HTMLElement,\n    phase: 'opening' | 'closing' | 'idle'\n  ): boolean {\n    const width = drawer.getBoundingClientRect().width;\n    const surface = drawer.querySelector('.panel-tools__drawer-surface') as HTMLElement | null;\n    const targetWidth = surface?.getBoundingClientRect().width ?? 0;\n    return panelToolsDrawerAtTerminal(width, targetWidth, phase);\n  }\n\n  private finishDrawerTransition() {\n    const completedPhase = this.motion;\n    const wasTransitioning = completedPhase !== 'idle';\n    this.clearTransitionCompletion();\n    if (!wasTransitioning) return;\n    this.ignoreReplacementTerminal = false;\n    this.motion = 'idle';\n    if (completedPhase === 'closing' && !this.open) {\n      this.drawerSurfaceRetained = false;\n    }\n    this.dsChromeTransitionEnd.emit({ source: 'panel-tools' });\n  }\n\n  private clearTransitionCompletion() {\n    this.transitionGeneration += 1;\n    if (this.transitionFallbackTimer !== null) {\n      window.clearTimeout(this.transitionFallbackTimer);\n      this.transitionFallbackTimer = null;\n    }\n  }\n\n  /** Rail selection follows `open` immediately — independent of the slide animation. */\n  private isRailSelected(id: PanelToolsToolId): boolean {\n    return this.open && this.activeTool === id;\n  }\n\n  /** Drawer body stays mounted while the clip frame animates closed. */\n  private isDrawerPresent(): boolean {\n    return this.open || this.drawerSurfaceRetained;\n  }\n\n  private isViewActive(id: PanelToolsToolId): boolean {\n    return this.isDrawerPresent() && this.activeTool === id;\n  }\n\n  private hasFullView(id: PanelToolsToolId): boolean {\n    return this.fullViewToolIds.includes(id);\n  }\n\n  private syncFullViewTools() {\n    const ids: PanelToolsToolId[] = ['search', 'messages', 'stacks', 'activity', 'agents', 'help'];\n    const next = ids.filter(id => Boolean(this.el.querySelector(`[slot=\"${id}-view\"]`)));\n    if (next.join('|') !== this.fullViewToolIds.join('|')) this.fullViewToolIds = next;\n  }\n\n  private headerLabel(): string {\n    if (!this.isDrawerPresent() || !this.activeTool) return '';\n    return PANEL_TOOLS_LABELS[this.activeTool as PanelToolsToolId] ?? '';\n  }\n\n  private resolvedHeaders(): PanelToolsHeaders {\n    if (Object.keys(this.headers).length) return this.headers;\n    if (!this.headersJson.trim()) return {};\n    try {\n      const parsed = JSON.parse(this.headersJson);\n      return parsed && typeof parsed === 'object' && !Array.isArray(parsed)\n        ? (parsed as PanelToolsHeaders)\n        : {};\n    } catch {\n      return {};\n    }\n  }\n\n  private activeHeader(): PanelToolsHeaderConfig {\n    if (!this.activeTool) return {};\n    return this.resolvedHeaders()[this.activeTool] ?? {};\n  }\n\n  private handleToolChange = (id: PanelToolsToolId) => {\n    const next = resolvePanelToolActivation(this.open, this.activeTool, id);\n    this.open = next.open;\n    this.activeTool = next.activeTool;\n    this.dsToolChange.emit({ id, selected: next.selected });\n  };\n\n  /** Toggle any rail tool open/closed — shell shortcuts K/A/S/M/N call this. */\n  @Method()\n  async activateTool(id: PanelToolsToolId) {\n    const item = this.railItems.find(entry => entry.id === id);\n    if (!item || item.isInactive) return;\n    this.handleToolChange(id);\n  }\n\n  /** Close the tools drawer when open — used by shell keyboard shortcuts. */\n  @Method()\n  async closeDrawer() {\n    if (!this.open) return;\n    const id = this.activeTool;\n    this.open = false;\n    if (id) {\n      this.dsToolChange.emit({ id, selected: false });\n    }\n  }\n\n  /** Focus an active tool-header action by its application-owned id. */\n  @Method()\n  async focusHeaderAction(id: string) {\n    const action = this.el.querySelector(`[data-header-action-id=\"${CSS.escape(id)}\"]`) as\n      | (HTMLElement & { setFocus?: () => Promise<void> })\n      | null;\n    await action?.setFocus?.();\n  }\n\n  private focusRailAt(index: number) {\n    const items = this.orderedRailItems;\n    if (!items.length) return;\n    const bounded = Math.max(0, Math.min(index, items.length - 1));\n    if (bounded === this.rovingIndex) return;\n    this.rovingIndex = bounded;\n    const actions = Array.from(\n      this.el.querySelectorAll<HTMLElement>('.panel-tools__rail-action .button-icon')\n    );\n    actions[bounded]?.focus({ preventScroll: true });\n  }\n\n  private handleRailKeyDown = (e: KeyboardEvent, index: number) => {\n    const items = this.orderedRailItems;\n    if (!items.length) return;\n\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      this.handleToolChange(items[index].id);\n      return;\n    }\n\n    if (e.key === 'ArrowDown') {\n      if (index >= items.length - 1) return;\n      e.preventDefault();\n      this.focusRailAt(index + 1);\n      return;\n    }\n\n    if (e.key === 'ArrowUp') {\n      if (index <= 0) return;\n      e.preventDefault();\n      this.focusRailAt(index - 1);\n    }\n  };\n\n  private renderRailAction(item: PanelToolsItem, index: number) {\n    const label = item.ariaLabel ?? PANEL_TOOLS_LABELS[item.id];\n    return (\n      <ds-tooltip\n        key={item.id}\n        label={label}\n        shortcutKey={PANEL_TOOLS_SHORTCUTS[item.id]}\n        side=\"left\"\n        size=\"sm\"\n      >\n        <ds-button-unfilled\n          variant=\"icon\"\n          class=\"panel-tools__rail-action\"\n          icon={item.icon}\n          isActive={this.isRailSelected(item.id)}\n          activeFill={false}\n          hasBorder={false}\n          dot={item.dot ?? false}\n          isInactive={item.isInactive}\n          focusTabIndex={index === this.rovingIndex ? 0 : -1}\n          aria-label={label}\n          pressed={this.isRailSelected(item.id)}\n          onFocusin={() => {\n            this.rovingIndex = index;\n          }}\n          onKeyDown={(e: KeyboardEvent) => this.handleRailKeyDown(e, index)}\n          onDsClick={() => this.handleToolChange(item.id)}\n        />\n      </ds-tooltip>\n    );\n  }\n\n  render() {\n    const headerLabel = this.headerLabel();\n    const header = this.activeHeader();\n    const headerTitle = header.title?.trim() || headerLabel;\n    const headerActions = header.actions ?? [];\n    const orderedRailItems = this.orderedRailItems;\n    const headerItem = orderedRailItems.find(item => item.id === PANEL_TOOLS_PRIMARY_TOOL_ID);\n    const footerItem = orderedRailItems.find(item => item.id === PANEL_TOOLS_FOOTER_TOOL_ID);\n    const bodyItems = orderedRailItems.filter(\n      item => item.id !== PANEL_TOOLS_PRIMARY_TOOL_ID && item.id !== PANEL_TOOLS_FOOTER_TOOL_ID\n    );\n    const footerIndex = footerItem ? (headerItem ? 1 : 0) + bodyItems.length : -1;\n    const showDrawerChrome = this.isDrawerPresent();\n    const drawerResting = panelToolsDrawerResting(this.open, this.motion);\n    const activeFullView = Boolean(\n      showDrawerChrome && this.activeTool && this.hasFullView(this.activeTool)\n    );\n    const toolIds: PanelToolsToolId[] = [\n      'search',\n      'messages',\n      'stacks',\n      'activity',\n      'agents',\n      'help',\n    ];\n\n    return (\n      <Host\n        class={{\n          'panel-tools': true,\n          'panel-tools--open': this.open,\n          'panel-tools--ready': this.readyForMotion,\n          'panel-tools--motion-opening': this.motion === 'opening',\n          'panel-tools--motion-closing': this.motion === 'closing',\n          'panel-tools--drawer-resting': drawerResting,\n          'panel-tools--fullscreen': this.presentation === 'fullscreen',\n          'panel-tools--presentation-snap': this.presentationMotionSuppressed,\n        }}\n        role={this.presentation === 'fullscreen' ? 'dialog' : 'complementary'}\n        aria-modal={this.presentation === 'fullscreen' ? 'true' : undefined}\n        aria-label={this.toolsLabel}\n      >\n        <div class=\"panel-tools__layout\">\n          <nav class=\"panel-tools__rail\" aria-label={this.toolShortcutsLabel}>\n            {headerItem ? (\n              <div class=\"panel-tools__rail-header\">{this.renderRailAction(headerItem, 0)}</div>\n            ) : null}\n            <div class=\"panel-tools__rail-body\">\n              {bodyItems.map((item, bodyIdx) =>\n                this.renderRailAction(item, headerItem ? bodyIdx + 1 : bodyIdx)\n              )}\n            </div>\n            {footerItem ? (\n              <div class=\"panel-tools__rail-footer\">\n                {this.renderRailAction(footerItem, footerIndex)}\n              </div>\n            ) : null}\n          </nav>\n\n          <div\n            class={{\n              'panel-tools__drawer': true,\n              'panel-tools__drawer--visible': showDrawerChrome,\n            }}\n            aria-hidden={showDrawerChrome ? null : 'true'}\n            inert={showDrawerChrome ? undefined : true}\n          >\n            <div class=\"panel-tools__drawer-surface\">\n              {this.presentation !== 'fullscreen' || this.fullscreenHeaderMode === 'shared' ? (\n                <ds-panel-tool-header\n                  class=\"panel-tools__header\"\n                  heading={headerTitle}\n                  showBack={header.showBack ?? false}\n                  backIcon={header.backIcon || 'ChevronLeft'}\n                  backAriaLabel={header.backAriaLabel || 'Back'}\n                  showMenu={false}\n                  ref={element => {\n                    const toolHeader = element as\n                      | (HTMLDsPanelToolHeaderElement & {\n                          actions: PanelToolsHeaderAction[];\n                        })\n                      | undefined;\n                    if (toolHeader) toolHeader.actions = headerActions;\n                  }}\n                  onDsBack={() => {\n                    if (this.activeTool) this.dsHeaderBack.emit({ tool: this.activeTool });\n                  }}\n                />\n              ) : null}\n              <div class=\"panel-tools__body\" hidden={activeFullView}>\n                {toolIds.map(id => {\n                  const active = this.isViewActive(id);\n                  return (\n                    <div\n                      class={{\n                        'panel-tools__view': true,\n                        'panel-tools__view--active': active,\n                      }}\n                      hidden={!active}\n                    >\n                      <slot name={id} />\n                    </div>\n                  );\n                })}\n              </div>\n              <div class=\"panel-tools__full-views\" hidden={!activeFullView}>\n                {toolIds.map(id => (\n                  <div\n                    class={{\n                      'panel-tools__full-view': true,\n                      'panel-tools__full-view--active':\n                        this.isViewActive(id) && this.hasFullView(id),\n                    }}\n                    hidden={!(this.isViewActive(id) && this.hasFullView(id))}\n                  >\n                    <slot name={`${id}-view`} />\n                  </div>\n                ))}\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}