@ds-mo/ui 13.12.0 → 13.13.0

package/dist/components/{p-BFXN4ioL.js.map → p-Br0fwWUG.js.map}

@@ -1 +1 @@
-{"version":3,"names":["isBarTitleDivider","item","type","barTitleCss","nextBarTitleId","BarTitle","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","description","showBack","backAriaLabel","backLabel","breadcrumbs","breadcrumbAriaLabel","sections","value","sectionsAriaLabel","primaryAction","actions","actionsAriaLabel","variant","sectionMenuOpen","actionMenuOpen","sectionMenuInitialFocusVisible","actionMenuInitialFocusVisible","instanceId","sectionMenuTriggerId","sectionMenuId","actionMenuTriggerId","actionMenuId","sectionTriggerEl","actionTriggerEl","toggleSectionMenu","event","detail","closeSectionMenu","handleSectionSelect","id","String","selected","selectableSections","find","section","isInactive","dsSectionChange","emit","requestAnimationFrame","focus","toggleActionMenu","closeActionMenu","handleActionSelect","primaryMatches","primaryCollapsed","action","selectableActions","candidate","isLoading","dsAction","setFocus","handleBreadcrumbSelect","length","dsBack","originalEvent","forwarded","dsBreadcrumbSelect","defaultPrevented","preventDefault","componentWillLoad","el","closest","setAttribute","handleSectionsChange","hasSectionSelector","handleActionsChange","showActionMenuTrigger","compact","expandedBreadcrumbItems","label","ariaLabel","backTooltipLabel","collapse","filter","effectiveValue","some","selectedSectionLabel","sectionTriggerAriaLabel","groupsFromItems","source","map","groups","items","commit","push","sectionMenuSections","isSelected","actionMenuItem","primary","isDestructive","intent","actionMenuSections","renderSectionSelector","h","class","ref","onClick","as","emphasis","color","lineTruncation","name","size","renderActions","icon","contrast","onDsClick","side","activeFill","hasBorder","haspopup","controls","expanded","renderBreadcrumb","onDsSelect","renderBack","render","Host","key","heading","wrap","anchorId","menuLabel","open","initialFocusVisible","onDsClose","align"],"sources":["src/wc/components/BarTitle/bar-title-types.ts","src/wc/components/BarTitle/BarTitle.css?tag=ds-bar-title&encapsulation=scoped","src/wc/components/BarTitle/BarTitle.tsx"],"sourcesContent":["import type { ButtonFilledContrast, ButtonFilledIntent } from '../ButtonFilled/ButtonFilled';\n\nexport interface BarTitleSection {\n  id: string;\n  label: string;\n  isInactive?: boolean;\n}\n\nexport interface BarTitleDivider {\n  type: 'divider';\n}\n\nexport type BarTitleSectionItem = BarTitleSection | BarTitleDivider;\n\nexport interface BarTitleAction {\n  id: string;\n  label: string;\n  isInactive?: boolean;\n  isDestructive?: boolean;\n}\n\nexport interface BarTitlePrimaryAction extends BarTitleAction {\n  icon?: string;\n  intent?: ButtonFilledIntent;\n  contrast?: ButtonFilledContrast;\n  isLoading?: boolean;\n  type?: 'button' | 'submit' | 'reset';\n  collapse?: BarTitlePrimaryActionCollapse;\n}\n\nexport type BarTitleActionItem = BarTitleAction | BarTitleDivider;\n\nexport type BarTitleVariant = 'expanded' | 'compact' | 'constrained';\n\nexport type BarTitlePrimaryActionCollapse = 'auto' | 'never';\n\nexport function isBarTitleDivider(\n  item: BarTitleSectionItem | BarTitleActionItem\n): item is BarTitleDivider {\n  return 'type' in item && item.type === 'divider';\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/chrome-header.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n\n:host {\n  display: block;\n  min-width: 0;\n  box-sizing: border-box;\n  background: var(--_shell-page-header-background, var(--color-background-primary));\n}\n\n:host([data-shell-page-syncing]) {\n  visibility: hidden;\n}\n\n.bar-title {\n  position: relative;\n  min-width: 0;\n  box-sizing: border-box;\n  background: var(--_shell-page-header-background, var(--color-background-primary));\n}\n\n.bar-title::after {\n  content: '';\n  position: absolute;\n  inset: auto var(--ds-bar-title-divider-inset, var(--dimension-space-400)) 0;\n  height: var(--dimension-stroke-width-012);\n  background: var(--color-border-tertiary);\n  pointer-events: none;\n}\n\n.bar-title__inner {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  gap: var(--dimension-space-100);\n  padding: var(--dimension-space-400);\n  box-sizing: border-box;\n}\n\n.bar-title__row {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: var(--dimension-space-100);\n  min-height: var(--dimension-size-400);\n  min-width: 0;\n}\n\n:host(.bar-title-host--expanded) .bar-title__row {\n  gap: var(--dimension-space-400);\n}\n\n.bar-title__leading {\n  display: flex;\n  flex: 1 1 auto;\n  flex-direction: column;\n  gap: var(--dimension-space-100);\n  min-width: 0;\n}\n\n.bar-title__title-row {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-100);\n  min-width: 0;\n  min-height: var(--dimension-size-400);\n}\n\n.bar-title__identity {\n  display: flex;\n  flex: 0 1 auto;\n  align-items: center;\n  gap: var(--dimension-space-050);\n  min-width: 0;\n}\n\n.bar-title__back,\n.bar-title__section-chevron {\n  flex: 0 0 auto;\n}\n\n.bar-title__breadcrumb {\n  display: block;\n  width: 100%;\n  min-width: 0;\n}\n\n.bar-title__heading {\n  display: block;\n  width: auto;\n  min-width: 0;\n  user-select: none;\n}\n\n.bar-title__divider {\n  width: var(--dimension-stroke-width-012);\n  height: var(--dimension-size-250);\n  margin-inline-start: var(--dimension-space-100);\n  flex: 0 0 var(--dimension-stroke-width-012);\n  background: var(--color-border-tertiary);\n}\n\n.bar-title__section-selector {\n  display: flex;\n  flex: 0 1 auto;\n  min-width: 0;\n  max-width: var(--dimension-panel-width-sm);\n}\n\n.bar-title__section-trigger {\n  --ds-control-radius: var(--dimension-radius-half);\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--ds-control-gap);\n  height: var(--ds-control-height);\n  min-width: 0;\n  max-width: 100%;\n  padding-inline: var(--ds-control-padding-inline);\n  border: none;\n  border-radius: var(--ds-control-radius);\n  box-sizing: border-box;\n  background: transparent;\n  color: var(--color-foreground-secondary);\n  cursor: default;\n  font-family: inherit;\n  user-select: none;\n}\n\n.bar-title__section-trigger--expanded {\n  color: var(--color-foreground-primary);\n}\n\n.bar-title__section-trigger--expanded::after,\n.bar-title__section-trigger--expanded:hover::after {\n  background: var(--ds-interaction-pressed);\n}\n\n.bar-title__section-label {\n  min-width: 0;\n  padding-inline: var(--ds-control-label-inset);\n}\n\n.bar-title__actions {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-100);\n  flex: 0 0 auto;\n}\n\n.bar-title__description {\n  display: block;\n  min-width: 0;\n  max-width: 100%;\n}\n\n:host(.bar-title-host--compact) .bar-title {\n  height: var(--dimension-size-600);\n}\n\n:host(.bar-title-host--compact) .bar-title::after {\n  inset-inline: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__inner {\n  flex: 1 1 auto;\n  height: 100%;\n  min-width: 0;\n  padding: 0;\n  gap: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__row {\n  height: 100%;\n  align-items: center;\n}\n\n:host(.bar-title-host--compact) .bar-title__identity {\n  height: var(--dimension-size-400);\n}\n\n:host(.bar-title-host--compact) .bar-title__divider {\n  margin-inline-start: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__heading {\n  display: inline-flex;\n  flex: 1 1 auto;\n  align-items: center;\n  height: var(--dimension-size-400);\n  padding-inline: calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));\n  box-sizing: border-box;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport type { BreadcrumbItem, BreadcrumbSelectDetail } from '../Breadcrumb/breadcrumb-types';\nimport type { MenuItemData, MenuSection } from '../Menu/menu-types';\nimport {\n  isBarTitleDivider,\n  type BarTitleAction,\n  type BarTitleActionItem,\n  type BarTitlePrimaryAction,\n  type BarTitleSection,\n  type BarTitleSectionItem,\n  type BarTitleVariant,\n} from './bar-title-types';\n\nlet nextBarTitleId = 0;\n\ntype FocusableButton = HTMLElement & { setFocus?: () => Promise<void> };\n\n@Component({\n  tag: 'ds-bar-title',\n  styleUrl: 'BarTitle.css',\n  scoped: true,\n})\nexport class BarTitle {\n  @Element() el!: HTMLElement;\n\n  /** The page's single visible h1. */\n  @Prop() heading!: string;\n\n  /** Optional supporting copy shown in the expanded presentation. */\n  @Prop() description: string = '';\n\n  /** Show the leading page-level Back action. */\n  @Prop({ attribute: 'show-back' }) showBack: boolean = false;\n\n  /** Accessible name for the leading Back action. */\n  @Prop() backAriaLabel: string = 'Back';\n\n  /** Visible parent-page label used by the expanded breadcrumb when breadcrumbs is empty. */\n  @Prop() backLabel: string = 'Back';\n\n  /** Optional expanded ancestor path. Compact variants continue to use the Back action. */\n  @Prop() breadcrumbs: BreadcrumbItem[] = [];\n\n  /** Accessible name for the expanded breadcrumb navigation landmark. */\n  @Prop() breadcrumbAriaLabel: string = 'Breadcrumb';\n\n  /** Optional page sections exposed through the active-section menu. */\n  @Prop() sections: BarTitleSectionItem[] = [];\n\n  /** Id of the active page section. */\n  @Prop() value: string = '';\n\n  /** Accessible name for the page-section menu. */\n  @Prop() sectionsAriaLabel: string = 'Change page section';\n\n  /** The one highest-emphasis page action. */\n  @Prop() primaryAction: BarTitlePrimaryAction | null = null;\n\n  /** Secondary page actions shown in the overflow menu. Dividers create groups. */\n  @Prop() actions: BarTitleActionItem[] = [];\n\n  /** Accessible name for the page-actions menu. */\n  @Prop() actionsAriaLabel: string = 'More page actions';\n\n  /** Explicit visual/capacity variant. ShellPage owns automatic selection. */\n  @Prop() variant: BarTitleVariant = 'expanded';\n\n  /** Emitted when the leading Back action is activated. */\n  @Event() dsBack!: EventEmitter<MouseEvent>;\n\n  /** Emitted when an authored expanded breadcrumb item is activated. */\n  @Event({ cancelable: true }) dsBreadcrumbSelect!: EventEmitter<BreadcrumbSelectDetail>;\n\n  /** Emitted with the newly selected page-section id. */\n  @Event() dsSectionChange!: EventEmitter<string>;\n\n  /** Emitted with the activated primary or overflow action id. */\n  @Event() dsAction!: EventEmitter<string>;\n\n  @State() private sectionMenuOpen = false;\n  @State() private actionMenuOpen = false;\n  @State() private sectionMenuInitialFocusVisible = false;\n  @State() private actionMenuInitialFocusVisible = false;\n\n  private readonly instanceId = nextBarTitleId++;\n  private readonly sectionMenuTriggerId = `bar-title-section-trigger-${this.instanceId}`;\n  private readonly sectionMenuId = `bar-title-section-menu-${this.instanceId}`;\n  private readonly actionMenuTriggerId = `bar-title-action-trigger-${this.instanceId}`;\n  private readonly actionMenuId = `bar-title-action-menu-${this.instanceId}`;\n  private sectionTriggerEl: HTMLButtonElement | null = null;\n  private actionTriggerEl: FocusableButton | null = null;\n\n  componentWillLoad() {\n    if (this.el.closest('ds-shell-page')) {\n      this.el.setAttribute('data-shell-page-syncing', '');\n    }\n  }\n\n  @Watch('sections')\n  handleSectionsChange() {\n    if (!this.hasSectionSelector) this.closeSectionMenu();\n  }\n\n  @Watch('actions')\n  @Watch('primaryAction')\n  handleActionsChange() {\n    if (!this.showActionMenuTrigger) this.closeActionMenu();\n  }\n\n  private get compact(): boolean {\n    return this.variant !== 'expanded';\n  }\n\n  private get expandedBreadcrumbItems(): BreadcrumbItem[] {\n    if (this.breadcrumbs.length > 0) return this.breadcrumbs;\n    if (!this.showBack) return [];\n    return [\n      {\n        id: 'back',\n        label: this.backLabel,\n        ariaLabel: this.backAriaLabel,\n      },\n    ];\n  }\n\n  /** Tooltip copy is fixed and generic; backAriaLabel/actionsAriaLabel stay page-specific. */\n  private get backTooltipLabel(): string {\n    return 'Go back';\n  }\n\n  private get primaryCollapsed(): boolean {\n    return (\n      this.variant === 'constrained' &&\n      this.primaryAction !== null &&\n      (this.primaryAction.collapse ?? 'auto') === 'auto'\n    );\n  }\n\n  private get selectableSections(): BarTitleSection[] {\n    return this.sections.filter((item): item is BarTitleSection => !isBarTitleDivider(item));\n  }\n\n  private get hasSectionSelector(): boolean {\n    return this.selectableSections.length > 1;\n  }\n\n  private get effectiveValue(): string {\n    return this.selectableSections.some(section => section.id === this.value)\n      ? this.value\n      : (this.selectableSections[0]?.id ?? '');\n  }\n\n  private get selectedSectionLabel(): string {\n    return this.selectableSections.find(section => section.id === this.effectiveValue)?.label ?? '';\n  }\n\n  private get sectionTriggerAriaLabel(): string {\n    return `${this.sectionsAriaLabel}. Current section: ${this.selectedSectionLabel}`;\n  }\n\n  private groupsFromItems<T extends BarTitleSection | BarTitleAction>(\n    source: Array<T | { type: 'divider' }>,\n    map: (item: T) => MenuItemData\n  ): MenuSection[] {\n    const groups: MenuSection[] = [];\n    let items: MenuItemData[] = [];\n    const commit = () => {\n      if (items.length > 0) groups.push({ items });\n      items = [];\n    };\n\n    for (const item of source) {\n      if (isBarTitleDivider(item)) {\n        commit();\n      } else {\n        items.push(map(item));\n      }\n    }\n    commit();\n    return groups;\n  }\n\n  private get sectionMenuSections(): MenuSection[] {\n    return this.groupsFromItems(this.sections, section => ({\n      label: section.label,\n      value: section.id,\n      isSelected: section.id === this.effectiveValue,\n      isInactive: section.isInactive,\n    }));\n  }\n\n  private get selectableActions(): BarTitleAction[] {\n    return this.actions.filter((item): item is BarTitleAction => !isBarTitleDivider(item));\n  }\n\n  private get showActionMenuTrigger(): boolean {\n    return (\n      this.selectableActions.length > 0 || (this.primaryCollapsed && this.primaryAction !== null)\n    );\n  }\n\n  private actionMenuItem(action: BarTitleAction | BarTitlePrimaryAction): MenuItemData {\n    const primary = action as BarTitlePrimaryAction;\n    return {\n      label: action.label,\n      value: action.id,\n      isInactive: action.isInactive || primary.isLoading,\n      isDestructive: action.isDestructive || primary.intent === 'negative',\n    };\n  }\n\n  private get actionMenuSections(): MenuSection[] {\n    const groups = this.groupsFromItems(this.actions, action => this.actionMenuItem(action));\n    if (!this.primaryCollapsed || !this.primaryAction) return groups;\n    return [{ items: [this.actionMenuItem(this.primaryAction)] }, ...groups];\n  }\n\n  private toggleSectionMenu = (event: MouseEvent) => {\n    this.sectionMenuInitialFocusVisible = event.detail === 0;\n    this.actionMenuOpen = false;\n    this.sectionMenuOpen = !this.sectionMenuOpen;\n  };\n\n  private closeSectionMenu = () => {\n    this.sectionMenuOpen = false;\n  };\n\n  private handleSectionSelect = (event: CustomEvent<MenuItemData>) => {\n    const id = String(event.detail?.value ?? '');\n    const selected = this.selectableSections.find(section => section.id === id);\n    if (!selected || selected.isInactive) return;\n    this.closeSectionMenu();\n    this.dsSectionChange.emit(id);\n    requestAnimationFrame(() => this.sectionTriggerEl?.focus());\n  };\n\n  private toggleActionMenu = (event: MouseEvent) => {\n    this.actionMenuInitialFocusVisible = event.detail === 0;\n    this.sectionMenuOpen = false;\n    this.actionMenuOpen = !this.actionMenuOpen;\n  };\n\n  private closeActionMenu = () => {\n    this.actionMenuOpen = false;\n  };\n\n  private handleActionSelect = (event: CustomEvent<MenuItemData>) => {\n    const id = String(event.detail?.value ?? '');\n    const primaryMatches = this.primaryCollapsed && this.primaryAction?.id === id;\n    const action = this.selectableActions.find(candidate => candidate.id === id);\n    if (!primaryMatches && !action) return;\n    if (\n      (primaryMatches && (this.primaryAction?.isInactive || this.primaryAction?.isLoading)) ||\n      action?.isInactive\n    ) {\n      return;\n    }\n    this.closeActionMenu();\n    this.dsAction.emit(id);\n    requestAnimationFrame(() => void this.actionTriggerEl?.setFocus?.());\n  };\n\n  private renderSectionSelector() {\n    if (!this.hasSectionSelector) return null;\n    return [\n      <div class=\"bar-title__divider\" aria-hidden=\"true\" />,\n      <div class=\"bar-title__section-selector\">\n        <button\n          ref={el => {\n            this.sectionTriggerEl = el ?? null;\n          }}\n          id={this.sectionMenuTriggerId}\n          class={{\n            'bar-title__section-trigger': true,\n            'bar-title__section-trigger--expanded': this.sectionMenuOpen,\n            'ds-control--md': true,\n            'ds-focus-ring-inset': true,\n            'ds-interaction-fill': true,\n          }}\n          type=\"button\"\n          aria-haspopup=\"menu\"\n          aria-controls={this.sectionMenuId}\n          aria-expanded={String(this.sectionMenuOpen)}\n          aria-label={this.sectionTriggerAriaLabel}\n          onClick={this.toggleSectionMenu}\n        >\n          <ds-text\n            class=\"bar-title__section-label ds-interaction-fill__content\"\n            as=\"span\"\n            variant=\"text-body-medium\"\n            emphasis\n            color=\"primary\"\n            lineTruncation={1}\n          >\n            {this.selectedSectionLabel}\n          </ds-text>\n          <ds-icon\n            class=\"bar-title__section-chevron ds-interaction-fill__content\"\n            name=\"ChevronUpDown\"\n            size=\"md\"\n            color=\"inherit\"\n            aria-hidden=\"true\"\n          />\n        </button>\n      </div>,\n    ];\n  }\n\n  private renderActions() {\n    const primary = this.primaryAction;\n    if (!primary && !this.showActionMenuTrigger) return null;\n\n    return (\n      <div class=\"bar-title__actions\">\n        {primary && !this.primaryCollapsed ? (\n          <ds-button-filled\n            class=\"bar-title__primary-action\"\n            variant={primary.icon ? 'icon-label' : 'label'}\n            icon={primary.icon ?? ''}\n            label={primary.label}\n            intent={primary.intent ?? 'brand'}\n            contrast={primary.contrast ?? 'bold'}\n            size=\"md\"\n            type={primary.type ?? 'button'}\n            isInactive={primary.isInactive}\n            isLoading={primary.isLoading}\n            onDsClick={() => this.dsAction.emit(primary.id)}\n          />\n        ) : null}\n        {this.showActionMenuTrigger ? (\n          <ds-tooltip label=\"Page options\" side=\"bottom\" size=\"sm\">\n            <ds-button-unfilled\n              ref={el => {\n                this.actionTriggerEl = el ?? null;\n              }}\n              id={this.actionMenuTriggerId}\n              class=\"bar-title__more-actions\"\n              variant=\"icon\"\n              icon=\"Ellipses\"\n              aria-label={this.actionsAriaLabel}\n              size=\"md\"\n              activeFill={!this.compact}\n              hasBorder={primary !== null && !this.primaryCollapsed}\n              haspopup=\"menu\"\n              controls={this.actionMenuId}\n              expanded={this.actionMenuOpen}\n              onDsClick={(event: CustomEvent<MouseEvent>) => this.toggleActionMenu(event.detail)}\n            />\n          </ds-tooltip>\n        ) : null}\n      </div>\n    );\n  }\n\n  private handleBreadcrumbSelect = (event: CustomEvent<BreadcrumbSelectDetail>) => {\n    if (this.breadcrumbs.length === 0) {\n      this.dsBack.emit(event.detail.originalEvent);\n      return;\n    }\n    const forwarded = this.dsBreadcrumbSelect.emit(event.detail);\n    if (forwarded.defaultPrevented) event.preventDefault();\n  };\n\n  private renderBreadcrumb() {\n    const items = this.expandedBreadcrumbItems;\n    if (items.length === 0) return null;\n    return (\n      <ds-breadcrumb\n        class=\"bar-title__breadcrumb\"\n        items={items}\n        ariaLabel={this.breadcrumbAriaLabel}\n        onDsSelect={this.handleBreadcrumbSelect}\n      />\n    );\n  }\n\n  private renderBack() {\n    if (!this.showBack) return null;\n    return (\n      <ds-tooltip label={this.backTooltipLabel} side=\"bottom\" size=\"sm\">\n        <ds-button-unfilled\n          class=\"bar-title__back\"\n          variant=\"icon\"\n          icon=\"ChevronLeft\"\n          aria-label={this.backAriaLabel}\n          size=\"md\"\n          activeFill={false}\n          hasBorder={false}\n          onDsClick={(event: CustomEvent<MouseEvent>) => this.dsBack.emit(event.detail)}\n        />\n      </ds-tooltip>\n    );\n  }\n\n  render() {\n    const compact = this.compact;\n    return (\n      <Host\n        class={{\n          'bar-title-host--compact': compact,\n          'bar-title-host--expanded': this.variant === 'expanded',\n          'bar-title-host--constrained': this.variant === 'constrained',\n          'bar-title-host--has-description': !!this.description,\n          'bar-title-host--has-back': this.showBack,\n          'bar-title-host--has-breadcrumb': !compact && this.expandedBreadcrumbItems.length > 0,\n        }}\n      >\n        <div\n          class={{\n            'bar-title': true,\n            'ds-chrome-header': compact,\n          }}\n        >\n          <div class=\"bar-title__inner\">\n            {!compact ? this.renderBreadcrumb() : null}\n            <div class=\"bar-title__row\">\n              <div class=\"bar-title__leading\">\n                <div class=\"bar-title__title-row\" data-shell-page-header-anchor>\n                  <div class=\"bar-title__identity\">\n                    {compact ? this.renderBack() : null}\n                    <ds-text\n                      class=\"bar-title__heading ds-control--md\"\n                      variant={compact ? 'text-title-small' : 'text-title-medium'}\n                      emphasis\n                      color=\"primary\"\n                      as=\"h1\"\n                      lineTruncation={1}\n                    >\n                      {this.heading}\n                    </ds-text>\n                  </div>\n                  {this.renderSectionSelector()}\n                </div>\n                {this.description && !compact ? (\n                  <ds-text\n                    class=\"bar-title__description\"\n                    variant=\"text-body-small\"\n                    color=\"secondary\"\n                    lineTruncation={2}\n                    wrap=\"wrap\"\n                    as=\"p\"\n                  >\n                    {this.description}\n                  </ds-text>\n                ) : null}\n              </div>\n              {this.renderActions()}\n            </div>\n          </div>\n        </div>\n\n        {this.hasSectionSelector ? (\n          <ds-menu\n            id={this.sectionMenuId}\n            class=\"bar-title__section-menu\"\n            anchorId={this.sectionMenuTriggerId}\n            menuLabel={this.sectionsAriaLabel}\n            open={this.sectionMenuOpen}\n            initialFocusVisible={this.sectionMenuInitialFocusVisible}\n            sections={this.sectionMenuSections}\n            onDsClose={this.closeSectionMenu}\n            onDsSelect={this.handleSectionSelect}\n          />\n        ) : null}\n\n        {this.showActionMenuTrigger ? (\n          <ds-menu\n            id={this.actionMenuId}\n            class=\"bar-title__action-menu\"\n            anchorId={this.actionMenuTriggerId}\n            align=\"end\"\n            menuLabel={this.actionsAriaLabel}\n            open={this.actionMenuOpen}\n            initialFocusVisible={this.actionMenuInitialFocusVisible}\n            sections={this.actionMenuSections}\n            onDsClose={this.closeActionMenu}\n            onDsSelect={this.handleActionSelect}\n          />\n        ) : null}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["isBarTitleDivider","item","type","barTitleCss","nextBarTitleId","BarTitle","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","description","showBack","backAriaLabel","backLabel","breadcrumbs","breadcrumbAriaLabel","sections","value","sectionsAriaLabel","primaryAction","actions","actionsAriaLabel","variant","sectionMenuOpen","actionMenuOpen","sectionMenuInitialFocusVisible","actionMenuInitialFocusVisible","instanceId","sectionMenuTriggerId","sectionMenuId","actionMenuTriggerId","actionMenuId","sectionTriggerEl","actionTriggerEl","toggleSectionMenu","event","detail","closeSectionMenu","handleSectionSelect","id","String","selected","selectableSections","find","section","isInactive","dsSectionChange","emit","requestAnimationFrame","focus","toggleActionMenu","closeActionMenu","handleActionSelect","primaryMatches","primaryCollapsed","action","selectableActions","candidate","isLoading","dsAction","setFocus","handleBreadcrumbSelect","length","dsBack","originalEvent","forwarded","dsBreadcrumbSelect","defaultPrevented","preventDefault","componentWillLoad","el","closest","setAttribute","handleSectionsChange","hasSectionSelector","handleActionsChange","showActionMenuTrigger","compact","expandedBreadcrumbItems","label","ariaLabel","backTooltipLabel","collapse","filter","effectiveValue","some","selectedSectionLabel","sectionTriggerAriaLabel","groupsFromItems","source","map","groups","items","commit","push","sectionMenuSections","isSelected","actionMenuItem","primary","isDestructive","intent","actionMenuSections","renderSectionSelector","h","class","ref","onClick","as","emphasis","color","lineTruncation","name","size","renderActions","icon","contrast","onDsClick","side","activeFill","hasBorder","haspopup","controls","expanded","renderBreadcrumb","onDsSelect","renderBack","render","Host","key","heading","wrap","anchorId","menuLabel","open","initialFocusVisible","onDsClose","align"],"sources":["src/wc/components/BarTitle/bar-title-types.ts","src/wc/components/BarTitle/BarTitle.css?tag=ds-bar-title&encapsulation=scoped","src/wc/components/BarTitle/BarTitle.tsx"],"sourcesContent":["import type { ButtonFilledContrast, ButtonFilledIntent } from '../ButtonFilled/ButtonFilled';\n\nexport interface BarTitleSection {\n  id: string;\n  label: string;\n  isInactive?: boolean;\n}\n\nexport interface BarTitleDivider {\n  type: 'divider';\n}\n\nexport type BarTitleSectionItem = BarTitleSection | BarTitleDivider;\n\nexport interface BarTitleAction {\n  id: string;\n  label: string;\n  isInactive?: boolean;\n  isDestructive?: boolean;\n}\n\nexport interface BarTitlePrimaryAction extends BarTitleAction {\n  icon?: string;\n  intent?: ButtonFilledIntent;\n  contrast?: ButtonFilledContrast;\n  isLoading?: boolean;\n  type?: 'button' | 'submit' | 'reset';\n  collapse?: BarTitlePrimaryActionCollapse;\n}\n\nexport type BarTitleActionItem = BarTitleAction | BarTitleDivider;\n\nexport type BarTitleVariant = 'expanded' | 'compact' | 'constrained';\n\nexport type BarTitlePrimaryActionCollapse = 'auto' | 'never';\n\nexport function isBarTitleDivider(\n  item: BarTitleSectionItem | BarTitleActionItem\n): item is BarTitleDivider {\n  return 'type' in item && item.type === 'divider';\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/chrome-header.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n\n:host {\n  display: block;\n  min-width: 0;\n  box-sizing: border-box;\n  background: var(--_shell-page-header-background, var(--color-background-primary));\n}\n\n:host([data-shell-page-syncing]) {\n  visibility: hidden;\n}\n\n.bar-title {\n  position: relative;\n  min-width: 0;\n  box-sizing: border-box;\n  background: var(--_shell-page-header-background, var(--color-background-primary));\n}\n\n.bar-title::after {\n  content: '';\n  position: absolute;\n  inset: auto var(--ds-bar-title-divider-inset, var(--dimension-space-400)) 0;\n  height: var(--dimension-stroke-width-012);\n  background: var(--color-border-tertiary);\n  pointer-events: none;\n}\n\n.bar-title__inner {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  gap: var(--dimension-space-100);\n  padding: var(--dimension-space-400);\n  box-sizing: border-box;\n}\n\n.bar-title__row {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: var(--dimension-space-100);\n  min-height: var(--dimension-size-400);\n  min-width: 0;\n}\n\n:host(.bar-title-host--expanded) .bar-title__row {\n  gap: var(--dimension-space-400);\n}\n\n.bar-title__leading {\n  display: flex;\n  flex: 1 1 auto;\n  flex-direction: column;\n  gap: var(--dimension-space-100);\n  min-width: 0;\n}\n\n.bar-title__title-row {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-100);\n  min-width: 0;\n  min-height: var(--dimension-size-400);\n}\n\n.bar-title__identity {\n  display: flex;\n  flex: 0 1 auto;\n  align-items: center;\n  gap: var(--dimension-space-050);\n  min-width: 0;\n}\n\n.bar-title__back,\n.bar-title__section-chevron {\n  flex: 0 0 auto;\n}\n\n.bar-title__breadcrumb {\n  display: block;\n  width: 100%;\n  min-width: 0;\n}\n\n.bar-title__heading {\n  display: block;\n  width: auto;\n  min-width: 0;\n  user-select: none;\n}\n\n.bar-title__divider {\n  width: var(--dimension-stroke-width-012);\n  height: var(--dimension-size-250);\n  margin-inline-start: var(--dimension-space-100);\n  flex: 0 0 var(--dimension-stroke-width-012);\n  background: var(--color-border-tertiary);\n}\n\n.bar-title__section-selector {\n  display: flex;\n  flex: 0 1 auto;\n  min-width: 0;\n  max-width: var(--dimension-panel-width-sm);\n}\n\n.bar-title__section-trigger {\n  --ds-control-radius: var(--dimension-radius-half);\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--ds-control-gap);\n  height: var(--ds-control-height);\n  min-width: 0;\n  max-width: 100%;\n  padding-inline: var(--ds-control-padding-inline);\n  border: none;\n  border-radius: var(--ds-control-radius);\n  box-sizing: border-box;\n  background: transparent;\n  color: var(--color-foreground-secondary);\n  cursor: default;\n  font-family: inherit;\n  user-select: none;\n}\n\n.bar-title__section-trigger--expanded {\n  color: var(--color-foreground-primary);\n}\n\n.bar-title__section-trigger--expanded::after,\n.bar-title__section-trigger--expanded:hover::after {\n  background: var(--ds-interaction-pressed);\n}\n\n.bar-title__section-label {\n  min-width: 0;\n  padding-inline: var(--ds-control-label-inset);\n}\n\n.bar-title__actions {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-100);\n  flex: 0 0 auto;\n}\n\n.bar-title__description {\n  display: block;\n  min-width: 0;\n  max-width: 100%;\n}\n\n:host(.bar-title-host--compact) .bar-title {\n  height: var(--dimension-size-600);\n}\n\n:host(.bar-title-host--compact) .bar-title::after {\n  inset-inline: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__inner {\n  flex: 1 1 auto;\n  height: 100%;\n  min-width: 0;\n  padding: 0;\n  gap: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__row {\n  height: 100%;\n  align-items: center;\n}\n\n:host(.bar-title-host--compact) .bar-title__identity {\n  height: var(--dimension-size-400);\n}\n\n:host(.bar-title-host--compact) .bar-title__divider {\n  margin-inline-start: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__heading {\n  display: inline-flex;\n  flex: 1 1 auto;\n  align-items: center;\n  height: var(--dimension-size-400);\n  padding-inline: calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));\n  box-sizing: border-box;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport type { BreadcrumbItem, BreadcrumbSelectDetail } from '../Breadcrumb/breadcrumb-types';\nimport type { MenuItemData, MenuSection } from '../Menu/menu-types';\nimport {\n  isBarTitleDivider,\n  type BarTitleAction,\n  type BarTitleActionItem,\n  type BarTitlePrimaryAction,\n  type BarTitleSection,\n  type BarTitleSectionItem,\n  type BarTitleVariant,\n} from './bar-title-types';\n\nlet nextBarTitleId = 0;\n\ntype FocusableButton = HTMLElement & { setFocus?: () => Promise<void> };\n\n@Component({\n  tag: 'ds-bar-title',\n  styleUrl: 'BarTitle.css',\n  scoped: true,\n})\nexport class BarTitle {\n  @Element() el!: HTMLElement;\n\n  /** The page's single visible h1. */\n  @Prop() heading!: string;\n\n  /** Optional supporting copy shown in the expanded presentation. */\n  @Prop() description: string = '';\n\n  /** Show the leading page-level Back action. */\n  @Prop({ attribute: 'show-back' }) showBack: boolean = false;\n\n  /** Accessible name for the leading Back action. */\n  @Prop() backAriaLabel: string = 'Back';\n\n  /** Visible parent-page label used by the expanded breadcrumb when breadcrumbs is empty. */\n  @Prop() backLabel: string = 'Back';\n\n  /** Optional expanded ancestor path. Compact variants continue to use the Back action. */\n  @Prop() breadcrumbs: BreadcrumbItem[] = [];\n\n  /** Accessible name for the expanded breadcrumb navigation landmark. */\n  @Prop() breadcrumbAriaLabel: string = 'Breadcrumb';\n\n  /** Optional page sections exposed through the active-section menu. */\n  @Prop() sections: BarTitleSectionItem[] = [];\n\n  /** Id of the active page section. */\n  @Prop() value: string = '';\n\n  /** Accessible name for the page-section menu. */\n  @Prop() sectionsAriaLabel: string = 'Change page section';\n\n  /** The one highest-emphasis page action. */\n  @Prop() primaryAction: BarTitlePrimaryAction | null = null;\n\n  /** Secondary page actions shown in the overflow menu. Dividers create groups. */\n  @Prop() actions: BarTitleActionItem[] = [];\n\n  /** Accessible name for the page-actions menu. */\n  @Prop() actionsAriaLabel: string = 'More page actions';\n\n  /** Explicit visual/capacity variant. ShellPage owns automatic selection. */\n  @Prop() variant: BarTitleVariant = 'expanded';\n\n  /** Emitted when the leading Back action is activated. */\n  @Event() dsBack!: EventEmitter<MouseEvent>;\n\n  /** Emitted when an authored expanded breadcrumb item is activated. */\n  @Event({ cancelable: true }) dsBreadcrumbSelect!: EventEmitter<BreadcrumbSelectDetail>;\n\n  /** Emitted with the newly selected page-section id. */\n  @Event() dsSectionChange!: EventEmitter<string>;\n\n  /** Emitted with the activated primary or overflow action id. */\n  @Event() dsAction!: EventEmitter<string>;\n\n  @State() private sectionMenuOpen = false;\n  @State() private actionMenuOpen = false;\n  @State() private sectionMenuInitialFocusVisible = false;\n  @State() private actionMenuInitialFocusVisible = false;\n\n  private readonly instanceId = nextBarTitleId++;\n  private readonly sectionMenuTriggerId = `bar-title-section-trigger-${this.instanceId}`;\n  private readonly sectionMenuId = `bar-title-section-menu-${this.instanceId}`;\n  private readonly actionMenuTriggerId = `bar-title-action-trigger-${this.instanceId}`;\n  private readonly actionMenuId = `bar-title-action-menu-${this.instanceId}`;\n  private sectionTriggerEl: HTMLButtonElement | null = null;\n  private actionTriggerEl: FocusableButton | null = null;\n\n  componentWillLoad() {\n    if (this.el.closest('ds-shell-page')) {\n      this.el.setAttribute('data-shell-page-syncing', '');\n    }\n  }\n\n  @Watch('sections')\n  handleSectionsChange() {\n    if (!this.hasSectionSelector) this.closeSectionMenu();\n  }\n\n  @Watch('actions')\n  @Watch('primaryAction')\n  handleActionsChange() {\n    if (!this.showActionMenuTrigger) this.closeActionMenu();\n  }\n\n  private get compact(): boolean {\n    return this.variant !== 'expanded';\n  }\n\n  private get expandedBreadcrumbItems(): BreadcrumbItem[] {\n    if (this.breadcrumbs.length > 0) return this.breadcrumbs;\n    if (!this.showBack) return [];\n    return [\n      {\n        id: 'back',\n        label: this.backLabel,\n        ariaLabel: this.backAriaLabel,\n      },\n    ];\n  }\n\n  /** Tooltip copy is fixed and generic; backAriaLabel/actionsAriaLabel stay page-specific. */\n  private get backTooltipLabel(): string {\n    return 'Go back';\n  }\n\n  private get primaryCollapsed(): boolean {\n    return (\n      this.variant === 'constrained' &&\n      this.primaryAction !== null &&\n      (this.primaryAction.collapse ?? 'auto') === 'auto'\n    );\n  }\n\n  private get selectableSections(): BarTitleSection[] {\n    return this.sections.filter((item): item is BarTitleSection => !isBarTitleDivider(item));\n  }\n\n  private get hasSectionSelector(): boolean {\n    return this.selectableSections.length > 1;\n  }\n\n  private get effectiveValue(): string {\n    return this.selectableSections.some(section => section.id === this.value)\n      ? this.value\n      : (this.selectableSections[0]?.id ?? '');\n  }\n\n  private get selectedSectionLabel(): string {\n    return this.selectableSections.find(section => section.id === this.effectiveValue)?.label ?? '';\n  }\n\n  private get sectionTriggerAriaLabel(): string {\n    return `${this.sectionsAriaLabel}. Current section: ${this.selectedSectionLabel}`;\n  }\n\n  private groupsFromItems<T extends BarTitleSection | BarTitleAction>(\n    source: Array<T | { type: 'divider' }>,\n    map: (item: T) => MenuItemData\n  ): MenuSection[] {\n    const groups: MenuSection[] = [];\n    let items: MenuItemData[] = [];\n    const commit = () => {\n      if (items.length > 0) groups.push({ items });\n      items = [];\n    };\n\n    for (const item of source) {\n      if (isBarTitleDivider(item)) {\n        commit();\n      } else {\n        items.push(map(item));\n      }\n    }\n    commit();\n    return groups;\n  }\n\n  private get sectionMenuSections(): MenuSection[] {\n    return this.groupsFromItems(this.sections, section => ({\n      label: section.label,\n      value: section.id,\n      isSelected: section.id === this.effectiveValue,\n      isInactive: section.isInactive,\n    }));\n  }\n\n  private get selectableActions(): BarTitleAction[] {\n    return this.actions.filter((item): item is BarTitleAction => !isBarTitleDivider(item));\n  }\n\n  private get showActionMenuTrigger(): boolean {\n    return (\n      this.selectableActions.length > 0 || (this.primaryCollapsed && this.primaryAction !== null)\n    );\n  }\n\n  private actionMenuItem(action: BarTitleAction | BarTitlePrimaryAction): MenuItemData {\n    const primary = action as BarTitlePrimaryAction;\n    return {\n      label: action.label,\n      value: action.id,\n      isInactive: action.isInactive || primary.isLoading,\n      isDestructive: action.isDestructive || primary.intent === 'negative',\n    };\n  }\n\n  private get actionMenuSections(): MenuSection[] {\n    const groups = this.groupsFromItems(this.actions, action => this.actionMenuItem(action));\n    if (!this.primaryCollapsed || !this.primaryAction) return groups;\n    return [{ items: [this.actionMenuItem(this.primaryAction)] }, ...groups];\n  }\n\n  private toggleSectionMenu = (event: MouseEvent) => {\n    this.sectionMenuInitialFocusVisible = event.detail === 0;\n    this.actionMenuOpen = false;\n    this.sectionMenuOpen = !this.sectionMenuOpen;\n  };\n\n  private closeSectionMenu = () => {\n    this.sectionMenuOpen = false;\n  };\n\n  private handleSectionSelect = (event: CustomEvent<MenuItemData>) => {\n    const id = String(event.detail?.value ?? '');\n    const selected = this.selectableSections.find(section => section.id === id);\n    if (!selected || selected.isInactive) return;\n    this.closeSectionMenu();\n    this.dsSectionChange.emit(id);\n    requestAnimationFrame(() => this.sectionTriggerEl?.focus());\n  };\n\n  private toggleActionMenu = (event: MouseEvent) => {\n    this.actionMenuInitialFocusVisible = event.detail === 0;\n    this.sectionMenuOpen = false;\n    this.actionMenuOpen = !this.actionMenuOpen;\n  };\n\n  private closeActionMenu = () => {\n    this.actionMenuOpen = false;\n  };\n\n  private handleActionSelect = (event: CustomEvent<MenuItemData>) => {\n    const id = String(event.detail?.value ?? '');\n    const primaryMatches = this.primaryCollapsed && this.primaryAction?.id === id;\n    const action = this.selectableActions.find(candidate => candidate.id === id);\n    if (!primaryMatches && !action) return;\n    if (\n      (primaryMatches && (this.primaryAction?.isInactive || this.primaryAction?.isLoading)) ||\n      action?.isInactive\n    ) {\n      return;\n    }\n    this.closeActionMenu();\n    this.dsAction.emit(id);\n    requestAnimationFrame(() => void this.actionTriggerEl?.setFocus?.());\n  };\n\n  private renderSectionSelector() {\n    if (!this.hasSectionSelector) return null;\n    return [\n      <div class=\"bar-title__divider\" aria-hidden=\"true\" />,\n      <div class=\"bar-title__section-selector\">\n        <button\n          ref={el => {\n            this.sectionTriggerEl = el ?? null;\n          }}\n          id={this.sectionMenuTriggerId}\n          class={{\n            'bar-title__section-trigger': true,\n            'bar-title__section-trigger--expanded': this.sectionMenuOpen,\n            'ds-control--md': true,\n            'ds-focus-ring-inset': true,\n            'ds-interaction-fill': true,\n          }}\n          type=\"button\"\n          aria-haspopup=\"menu\"\n          aria-controls={this.sectionMenuId}\n          aria-expanded={String(this.sectionMenuOpen)}\n          aria-label={this.sectionTriggerAriaLabel}\n          onClick={this.toggleSectionMenu}\n        >\n          <ds-text\n            class=\"bar-title__section-label ds-interaction-fill__content\"\n            as=\"span\"\n            variant=\"text-body-medium\"\n            emphasis\n            color=\"primary\"\n            lineTruncation={1}\n          >\n            {this.selectedSectionLabel}\n          </ds-text>\n          <ds-icon\n            class=\"bar-title__section-chevron ds-interaction-fill__content\"\n            name=\"ChevronUpDown\"\n            size=\"md\"\n            color=\"inherit\"\n            aria-hidden=\"true\"\n          />\n        </button>\n      </div>,\n    ];\n  }\n\n  private renderActions() {\n    const primary = this.primaryAction;\n    if (!primary && !this.showActionMenuTrigger) return null;\n\n    return (\n      <div class=\"bar-title__actions\">\n        {primary && !this.primaryCollapsed ? (\n          <ds-button-filled\n            class=\"bar-title__primary-action\"\n            variant={primary.icon ? 'icon-label' : 'label'}\n            icon={primary.icon ?? ''}\n            label={primary.label}\n            intent={primary.intent ?? 'brand'}\n            contrast={primary.contrast ?? 'bold'}\n            size=\"md\"\n            type={primary.type ?? 'button'}\n            isInactive={primary.isInactive}\n            isLoading={primary.isLoading}\n            onDsClick={() => this.dsAction.emit(primary.id)}\n          />\n        ) : null}\n        {this.showActionMenuTrigger ? (\n          <ds-tooltip label=\"Page options\" side=\"bottom\" size=\"sm\">\n            <ds-button-unfilled\n              ref={el => {\n                this.actionTriggerEl = el ?? null;\n              }}\n              id={this.actionMenuTriggerId}\n              class=\"bar-title__more-actions\"\n              variant=\"icon\"\n              icon=\"Ellipses\"\n              aria-label={this.actionsAriaLabel}\n              size=\"md\"\n              activeFill={!this.compact}\n              hasBorder={primary !== null && !this.primaryCollapsed}\n              haspopup=\"menu\"\n              controls={this.actionMenuId}\n              expanded={this.actionMenuOpen}\n              onDsClick={(event: CustomEvent<MouseEvent>) => this.toggleActionMenu(event.detail)}\n            />\n          </ds-tooltip>\n        ) : null}\n      </div>\n    );\n  }\n\n  private handleBreadcrumbSelect = (event: CustomEvent<BreadcrumbSelectDetail>) => {\n    if (this.breadcrumbs.length === 0) {\n      this.dsBack.emit(event.detail.originalEvent);\n      return;\n    }\n    const forwarded = this.dsBreadcrumbSelect.emit(event.detail);\n    if (forwarded.defaultPrevented) event.preventDefault();\n  };\n\n  private renderBreadcrumb() {\n    const items = this.expandedBreadcrumbItems;\n    if (items.length === 0) return null;\n    return (\n      <ds-breadcrumb\n        class=\"bar-title__breadcrumb\"\n        items={items}\n        ariaLabel={this.breadcrumbAriaLabel}\n        onDsSelect={this.handleBreadcrumbSelect}\n      />\n    );\n  }\n\n  private renderBack() {\n    if (!this.showBack) return null;\n    return (\n      <ds-tooltip label={this.backTooltipLabel} side=\"bottom\" size=\"sm\">\n        <ds-button-unfilled\n          class=\"bar-title__back\"\n          variant=\"icon\"\n          icon=\"ChevronLeft\"\n          aria-label={this.backAriaLabel}\n          size=\"md\"\n          activeFill={false}\n          hasBorder={false}\n          onDsClick={(event: CustomEvent<MouseEvent>) => this.dsBack.emit(event.detail)}\n        />\n      </ds-tooltip>\n    );\n  }\n\n  render() {\n    const compact = this.compact;\n    return (\n      <Host\n        class={{\n          'bar-title-host--compact': compact,\n          'bar-title-host--expanded': this.variant === 'expanded',\n          'bar-title-host--constrained': this.variant === 'constrained',\n          'bar-title-host--has-description': !!this.description,\n          'bar-title-host--has-back': this.showBack,\n          'bar-title-host--has-breadcrumb': !compact && this.expandedBreadcrumbItems.length > 0,\n        }}\n      >\n        <div\n          class={{\n            'bar-title': true,\n            'ds-chrome-header': compact,\n          }}\n        >\n          <div class=\"bar-title__inner\">\n            {!compact ? this.renderBreadcrumb() : null}\n            <div class=\"bar-title__row\">\n              <div class=\"bar-title__leading\">\n                <div class=\"bar-title__title-row\" data-shell-page-header-anchor>\n                  <div class=\"bar-title__identity\">\n                    {compact ? this.renderBack() : null}\n                    <ds-text\n                      class=\"bar-title__heading ds-control--md\"\n                      variant={compact ? 'text-title-small' : 'text-title-medium'}\n                      emphasis\n                      color=\"primary\"\n                      as=\"h1\"\n                      lineTruncation={1}\n                    >\n                      {this.heading}\n                    </ds-text>\n                  </div>\n                  {this.renderSectionSelector()}\n                </div>\n                {this.description && !compact ? (\n                  <ds-text\n                    class=\"bar-title__description\"\n                    variant=\"text-body-small\"\n                    color=\"secondary\"\n                    lineTruncation={2}\n                    wrap=\"wrap\"\n                    as=\"p\"\n                  >\n                    {this.description}\n                  </ds-text>\n                ) : null}\n              </div>\n              {this.renderActions()}\n            </div>\n          </div>\n        </div>\n\n        {this.hasSectionSelector ? (\n          <ds-menu\n            id={this.sectionMenuId}\n            class=\"bar-title__section-menu\"\n            anchorId={this.sectionMenuTriggerId}\n            menuLabel={this.sectionsAriaLabel}\n            open={this.sectionMenuOpen}\n            initialFocusVisible={this.sectionMenuInitialFocusVisible}\n            sections={this.sectionMenuSections}\n            onDsClose={this.closeSectionMenu}\n            onDsSelect={this.handleSectionSelect}\n          />\n        ) : null}\n\n        {this.showActionMenuTrigger ? (\n          <ds-menu\n            id={this.actionMenuId}\n            class=\"bar-title__action-menu\"\n            anchorId={this.actionMenuTriggerId}\n            align=\"end\"\n            menuLabel={this.actionsAriaLabel}\n            open={this.actionMenuOpen}\n            initialFocusVisible={this.actionMenuInitialFocusVisible}\n            sections={this.actionMenuSections}\n            onDsClose={this.closeActionMenu}\n            onDsSelect={this.handleActionSelect}\n          />\n        ) : null}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/{p-DcmqsAMP.js → p-BydCwx7x.js}

@@ -1,2 +1,2 @@
-import{p as e,H as s,h as o,a,t}from"./index.js";import{C as i}from"./p-BnhGV__o.js";import{d}from"./p-DwKC_9u2.js";import{d as c}from"./p-c1pY-Mqq.js";import{d as n}from"./p-DumWT7NN.js";import{d as r}from"./p-Ca-I2UnB.js";import{d as l}from"./p-BNiIyZCn.js";import{d as f}from"./p-CCYgBUUS.js";const b=()=>`.sc-ds-code-block-h{display:block;width:100%;min-width:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}.code-block.sc-ds-code-block{width:100%;min-width:0;margin:0;overflow:hidden;border-radius:var(--dimension-radius-050);background:var(--color-background-strong-neutral);color:var(--color-foreground-faint-neutral);box-sizing:border-box}.code-block__header.sc-ds-code-block{display:flex;align-items:center;justify-content:space-between;gap:var(--dimension-space-100);min-height:var(--dimension-size-400);padding:var(--dimension-space-050) var(--dimension-space-100);background:var(--color-background-strong-neutral);box-sizing:border-box}pre.sc-ds-code-block{margin:0;padding:var(--dimension-space-150);overflow:auto;font-family:var(--typography-fontfamily-mono);font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);tab-size:2;-webkit-user-select:text;user-select:text}code.sc-ds-code-block{font:inherit;white-space:pre}`;const m=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.code="";this.language="";this.filename="";this.copied=false;this.copyFeedback=new i((e=>{this.copied=e}));this.copy=async()=>{await this.copyFeedback.copy(this.code)}}connectedCallback(){this.copyFeedback.connect()}handleCodeChange(){this.copyFeedback.reset()}disconnectedCallback(){this.copyFeedback.disconnect()}render(){const e=this.filename||this.language||"Code";return o(a,{key:"e310cc824969366958b67548bb04f35e2e9113fe"},o("figure",{key:"b32e4d96cd3594f76bece4318e65ae7d08edfeea",class:"code-block"},o("figcaption",{key:"628a5191587aef94fefa46183a80b5a73a2bc2a4",class:"code-block__header"},o("ds-text",{key:"0cd29234edfcbb3ddeffb9fafab599677ef2a509",as:"span",variant:"text-caption",emphasis:true,color:"on-strong"},e),o("ds-tooltip",{key:"0ff5f6aa899ef18ce760abb4f71efe7017ce2285",label:this.copied?"Copied":"Copy code",side:"bottom",size:"sm"},o("ds-button-unfilled",{key:"7793ded14c85aaa8cdba079334efb8c886f65b8f",variant:"icon",icon:this.copied?"Check":"Copy",size:"xs","aria-label":this.copied?"Copied":"Copy code",hasBorder:false,onDsClick:this.copy}))),o("pre",{key:"0a5eb53fe4c79ae67dd096dede49a893468b36fe"},o("code",{key:"0f6ab3a280d292fe8a46b7a30b5c9cbd0e21af8f"},this.code))))}static get watchers(){return{code:[{handleCodeChange:0}]}}static get style(){return b()}},[2,"ds-code-block",{code:[1],language:[1],filename:[1],copied:[32]},undefined,{code:[{handleCodeChange:0}]}]);function p(){if(typeof customElements==="undefined"){return}const e=["ds-code-block","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-code-block":if(!customElements.get(t(e))){customElements.define(t(e),m)}break;case"ds-badge":if(!customElements.get(t(e))){d()}break;case"ds-button-unfilled":if(!customElements.get(t(e))){c()}break;case"ds-icon":if(!customElements.get(t(e))){n()}break;case"ds-loader":if(!customElements.get(t(e))){r()}break;case"ds-text":if(!customElements.get(t(e))){l()}break;case"ds-tooltip":if(!customElements.get(t(e))){f()}break}}))}p();export{m as C,p as d};
-//# sourceMappingURL=p-DcmqsAMP.js.map
+import{p as e,H as s,h as o,a,t}from"./index.js";import{C as i}from"./p-BnhGV__o.js";import{d}from"./p-DwKC_9u2.js";import{d as c}from"./p-C3Z01Glr.js";import{d as n}from"./p-DumWT7NN.js";import{d as r}from"./p-Ca-I2UnB.js";import{d as l}from"./p-BNiIyZCn.js";import{d as f}from"./p-CCYgBUUS.js";const b=()=>`.sc-ds-code-block-h{display:block;width:100%;min-width:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}.code-block.sc-ds-code-block{width:100%;min-width:0;margin:0;overflow:hidden;border-radius:var(--dimension-radius-050);background:var(--color-background-strong-neutral);color:var(--color-foreground-faint-neutral);box-sizing:border-box}.code-block__header.sc-ds-code-block{display:flex;align-items:center;justify-content:space-between;gap:var(--dimension-space-100);min-height:var(--dimension-size-400);padding:var(--dimension-space-050) var(--dimension-space-100);background:var(--color-background-strong-neutral);box-sizing:border-box}pre.sc-ds-code-block{margin:0;padding:var(--dimension-space-150);overflow:auto;font-family:var(--typography-fontfamily-mono);font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);tab-size:2;-webkit-user-select:text;user-select:text}code.sc-ds-code-block{font:inherit;white-space:pre}`;const m=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.code="";this.language="";this.filename="";this.copied=false;this.copyFeedback=new i((e=>{this.copied=e}));this.copy=async()=>{await this.copyFeedback.copy(this.code)}}connectedCallback(){this.copyFeedback.connect()}handleCodeChange(){this.copyFeedback.reset()}disconnectedCallback(){this.copyFeedback.disconnect()}render(){const e=this.filename||this.language||"Code";return o(a,{key:"e310cc824969366958b67548bb04f35e2e9113fe"},o("figure",{key:"b32e4d96cd3594f76bece4318e65ae7d08edfeea",class:"code-block"},o("figcaption",{key:"628a5191587aef94fefa46183a80b5a73a2bc2a4",class:"code-block__header"},o("ds-text",{key:"0cd29234edfcbb3ddeffb9fafab599677ef2a509",as:"span",variant:"text-caption",emphasis:true,color:"on-strong"},e),o("ds-tooltip",{key:"0ff5f6aa899ef18ce760abb4f71efe7017ce2285",label:this.copied?"Copied":"Copy code",side:"bottom",size:"sm"},o("ds-button-unfilled",{key:"7793ded14c85aaa8cdba079334efb8c886f65b8f",variant:"icon",icon:this.copied?"Check":"Copy",size:"xs","aria-label":this.copied?"Copied":"Copy code",hasBorder:false,onDsClick:this.copy}))),o("pre",{key:"0a5eb53fe4c79ae67dd096dede49a893468b36fe"},o("code",{key:"0f6ab3a280d292fe8a46b7a30b5c9cbd0e21af8f"},this.code))))}static get watchers(){return{code:[{handleCodeChange:0}]}}static get style(){return b()}},[2,"ds-code-block",{code:[1],language:[1],filename:[1],copied:[32]},undefined,{code:[{handleCodeChange:0}]}]);function p(){if(typeof customElements==="undefined"){return}const e=["ds-code-block","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-code-block":if(!customElements.get(t(e))){customElements.define(t(e),m)}break;case"ds-badge":if(!customElements.get(t(e))){d()}break;case"ds-button-unfilled":if(!customElements.get(t(e))){c()}break;case"ds-icon":if(!customElements.get(t(e))){n()}break;case"ds-loader":if(!customElements.get(t(e))){r()}break;case"ds-text":if(!customElements.get(t(e))){l()}break;case"ds-tooltip":if(!customElements.get(t(e))){f()}break}}))}p();export{m as C,p as d};
+//# sourceMappingURL=p-BydCwx7x.js.map

package/dist/components/p-C3Z01Glr.js

@@ -0,0 +1,2 @@
+import{p as n,H as t,c as o,h as i,a as e,t as d}from"./index.js";import{b as s,r,c as l}from"./p-DAW6G8Sl.js";import{d as c}from"./p-DwKC_9u2.js";import{d as a}from"./p-DumWT7NN.js";import{d as u}from"./p-Ca-I2UnB.js";import{d as f}from"./p-BNiIyZCn.js";const b=()=>`@media (forced-colors: active){.sc-ds-button-unfilled:root,.sc-ds-button-unfilled-h,.ds-forced-colors-scope.sc-ds-button-unfilled{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-button-unfilled-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-button-unfilled-h,.ds-focus-ring.sc-ds-button-unfilled,.ds-focus-ring-inset.sc-ds-button-unfilled-h,.ds-focus-ring-inset.sc-ds-button-unfilled{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-button-unfilled-h:focus-visible,.ds-focus-ring.sc-ds-button-unfilled:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-button-unfilled-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-button-unfilled{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-button-unfilled-h:focus-visible,.ds-focus-ring-inset.sc-ds-button-unfilled:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-button-unfilled-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-button-unfilled:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-button-unfilled-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-button-unfilled{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-button-unfilled-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-button-unfilled::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-button-unfilled-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-button-unfilled:root,.sc-ds-button-unfilled-h,.ds-forced-colors-scope.sc-ds-button-unfilled{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}@media (forced-colors: active){.sc-ds-button-unfilled:root,.sc-ds-button-unfilled-h,.ds-forced-colors-scope.sc-ds-button-unfilled{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-button-unfilled-h,.ds-interaction-fill.sc-ds-button-unfilled{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-button-unfilled-h::before,.ds-interaction-fill.sc-ds-button-unfilled::before,.ds-interaction-fill.sc-ds-button-unfilled-h::after,.ds-interaction-fill.sc-ds-button-unfilled::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-button-unfilled-h::before,.ds-interaction-fill.sc-ds-button-unfilled::before{z-index:1}.ds-interaction-fill.sc-ds-button-unfilled-h::after,.ds-interaction-fill.sc-ds-button-unfilled::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-button-unfilled-h,.ds-interaction-fill--bordered.sc-ds-button-unfilled{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-button-unfilled-h::before,.ds-interaction-fill--selected.sc-ds-button-unfilled::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-button-unfilled-h,.ds-interaction-fill--selected.sc-ds-button-unfilled{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-button-unfilled-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-button-unfilled:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-button-unfilled-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-button-unfilled:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-button-unfilled-h::after,.ds-interaction-fill--grouped.sc-ds-button-unfilled::after,.ds-interaction-fill--grouped.sc-ds-button-unfilled-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-button-unfilled:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-button-unfilled-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-button-unfilled:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}.ds-interaction-fill--grouped.sc-ds-button-unfilled-h,.ds-interaction-fill--grouped.sc-ds-button-unfilled{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-button-unfilled-h>.ds-interaction-fill__content.sc-ds-button-unfilled,.ds-interaction-fill.sc-ds-button-unfilled>.ds-interaction-fill__content.sc-ds-button-unfilled,.ds-interaction-fill__content.sc-ds-button-unfilled{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-button-unfilled-h,.ds-interaction-fill--on-faint.sc-ds-button-unfilled{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-button-unfilled-h,.ds-interaction-fill--on-medium.sc-ds-button-unfilled{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-button-unfilled-h,.ds-interaction-fill--on-bold.sc-ds-button-unfilled{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-button-unfilled-h,.ds-interaction-fill--on-strong.sc-ds-button-unfilled{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-button-unfilled-h,.ds-interaction-fill--on-translucent.sc-ds-button-unfilled{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-button-unfilled-h,.ds-interaction-fill--on-inverted.sc-ds-button-unfilled{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-button-unfilled-h,.ds-interaction-fill--on-media.sc-ds-button-unfilled{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-button-unfilled-h,.ds-interaction-fill--on-always-dark.sc-ds-button-unfilled{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-button-unfilled-h,.ds-interaction-fill--on-navigation.sc-ds-button-unfilled{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-button-unfilled-h::after,.ds-interaction-fill.sc-ds-button-unfilled::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid       var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-button-unfilled-h::before,.ds-interaction-fill--selected.sc-ds-button-unfilled::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-button-unfilled-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-button-unfilled:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}.ds-control-press-scale.sc-ds-button-unfilled{transition:scale var(--effect-motion-short-2)}.ds-control-press-scale.sc-ds-button-unfilled:active:not(:disabled):not(.ds-control-inactive):not([aria-busy='true']){scale:var(--ds-control-press-active-scale, var(--dimension-scale-subtle))}@media (prefers-reduced-motion: reduce){.ds-control-press-scale.sc-ds-button-unfilled,.ds-control-press-scale.sc-ds-button-unfilled:active:not(:disabled):not(.ds-control-inactive):not([aria-busy='true']){scale:none;transition:none}}@media (forced-colors: active){.sc-ds-button-unfilled:root,.sc-ds-button-unfilled-h,.ds-forced-colors-scope.sc-ds-button-unfilled{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-button-unfilled-h,.ds-control-inactive.sc-ds-button-unfilled{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-button-unfilled-h,.ds-control-inactive.sc-ds-button-unfilled{color:var(--ds-forced-color-disabled);opacity:1}}.ds-control--lg.sc-ds-button-unfilled,.ds-control--lg.sc-ds-button-unfilled-h,.ds-control--md.sc-ds-button-unfilled-h,.ds-control--md.sc-ds-button-unfilled,.ds-control--sm.sc-ds-button-unfilled-h,.ds-control--sm.sc-ds-button-unfilled,.ds-control--xs.sc-ds-button-unfilled-h,.ds-control--xs.sc-ds-button-unfilled{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-button-unfilled-h,.ds-control--lg.sc-ds-button-unfilled{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-button-unfilled-h,.ds-control--md.sc-ds-button-unfilled{--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-button-unfilled-h,.ds-control--sm.sc-ds-button-unfilled{--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-button-unfilled-h,.ds-control--xs.sc-ds-button-unfilled{--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--lg.ds-control--inset.sc-ds-button-unfilled-h,.ds-control--lg.ds-control--inset.sc-ds-button-unfilled{--ds-control-height:calc(var(--dimension-size-500) - var(--dimension-space-050));--ds-control-padding-inline:calc(     var(--dimension-space-100) - var(--dimension-space-025)   )}.ds-control--md.ds-control--inset.sc-ds-button-unfilled-h,.ds-control--md.ds-control--inset.sc-ds-button-unfilled{--ds-control-height:calc(var(--dimension-size-400) - var(--dimension-space-050));--ds-control-padding-inline:calc(     var(--dimension-space-075) - var(--dimension-space-025)   )}.ds-control--sm.ds-control--inset.sc-ds-button-unfilled-h,.ds-control--sm.ds-control--inset.sc-ds-button-unfilled{--ds-control-height:calc(var(--dimension-size-300) - var(--dimension-space-050));--ds-control-padding-inline:calc(     var(--dimension-space-050) - var(--dimension-space-025)   )}.ds-control--xs.ds-control--inset.sc-ds-button-unfilled-h,.ds-control--xs.ds-control--inset.sc-ds-button-unfilled{--ds-control-height:calc(var(--dimension-size-200) - var(--dimension-space-050));--ds-control-padding-inline:calc(     var(--dimension-space-025) - var(--dimension-space-025)   )}.ds-control-frame.sc-ds-button-unfilled{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-icon-box.sc-ds-button-unfilled{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-button-unfilled{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-width--hug.sc-ds-button-unfilled-h,.ds-control-width--hug.sc-ds-button-unfilled{width:fit-content;max-width:100%;flex:0 0 auto;align-self:flex-start}.ds-control-width--fill.sc-ds-button-unfilled-h,.ds-control-width--fill.sc-ds-button-unfilled{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}.sc-ds-button-unfilled-h{display:inline-flex;outline:none}.ds-button-host--icon.ds-control-width--hug.sc-ds-button-unfilled-h{width:var(--ds-control-height, var(--dimension-size-400));height:var(--ds-control-height, var(--dimension-size-400));min-width:var(--ds-control-height, var(--dimension-size-400));min-height:var(--ds-control-height, var(--dimension-size-400))}.ds-button-host--icon.ds-control-width--fill.sc-ds-button-unfilled-h{height:var(--ds-control-height, var(--dimension-size-400));min-height:var(--ds-control-height, var(--dimension-size-400))}.ds-control-width--fill.sc-ds-button-unfilled-h .ds-button.sc-ds-button-unfilled{width:100%}.ds-button.sc-ds-button-unfilled{justify-content:center;overflow:hidden;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));cursor:default;-webkit-user-select:none;user-select:none}.ds-button--icon.sc-ds-button-unfilled{width:100%;height:100%;padding:0}.ds-button--rounded.sc-ds-button-unfilled{--ds-control-radius:var(--dimension-radius-half)}.ds-button--expanded.sc-ds-button-unfilled::after,.ds-button--expanded.sc-ds-button-unfilled:hover:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-button--bordered.sc-ds-button-unfilled{--ds-interaction-border-width:var(--dimension-stroke-width-012)}.ds-button--bordered.sc-ds-button-unfilled:not(.ds-interaction-fill){box-shadow:inset 0 0 0 var(--ds-interaction-border-width)     var(--ds-interaction-border-color)}.ds-button__icon-wrap.sc-ds-button-unfilled,.ds-button__label.sc-ds-button-unfilled,.ds-button__chevron.sc-ds-button-unfilled{position:relative;z-index:2}.ds-button__label.sc-ds-button-unfilled{flex-shrink:0;min-width:0;white-space:nowrap}.ds-button__label--loading.sc-ds-button-unfilled,.ds-button__chevron--loading.sc-ds-button-unfilled{visibility:hidden}.ds-button.sc-ds-button-unfilled>.ds-button__loader-overlay.sc-ds-button-unfilled{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;pointer-events:none}.ds-button__dot.sc-ds-button-unfilled{position:absolute;top:0;right:0;z-index:2;pointer-events:none}@media (forced-colors: active){.ds-button.sc-ds-button-unfilled{outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}}.sc-ds-button-unfilled-h{--ds-button-unfilled-fg:var(--color-foreground-secondary);--ds-button-unfilled-fg-active:var(--color-foreground-primary);--ds-button-unfilled-dot-ring:var(--color-background-secondary);--ds-button-unfilled-border:var(--color-border-secondary)}.button-unfilled.sc-ds-button-unfilled{background:transparent;color:var(--ds-button-unfilled-fg)}.button-unfilled--active.sc-ds-button-unfilled{color:var(--ds-button-unfilled-fg-active)}.button-unfilled--bordered.sc-ds-button-unfilled{--ds-interaction-border-color:var(--ds-button-unfilled-border)}.button-unfilled--background-medium.sc-ds-button-unfilled{--ds-button-unfilled-fg:var(--color-foreground-on-medium-background-secondary);--ds-button-unfilled-fg-active:var(--color-foreground-on-medium-background-primary);--ds-button-unfilled-dot-ring:var(--color-background-medium-neutral);--ds-button-unfilled-border:var(--color-border-on-medium-background-secondary)}.button-unfilled--background-bold.sc-ds-button-unfilled{--ds-button-unfilled-fg:var(--color-foreground-on-bold-background-secondary);--ds-button-unfilled-fg-active:var(--color-foreground-on-bold-background-primary);--ds-button-unfilled-dot-ring:var(--color-background-bold-neutral);--ds-button-unfilled-border:var(--color-border-on-bold-background-secondary)}.button-unfilled--background-strong.sc-ds-button-unfilled{--ds-button-unfilled-fg:var(--color-foreground-on-strong-background-secondary);--ds-button-unfilled-fg-active:var(--color-foreground-on-strong-background-primary);--ds-button-unfilled-dot-ring:var(--color-background-strong-neutral);--ds-button-unfilled-border:var(--color-border-on-strong-background-secondary)}.button-unfilled--background-translucent.sc-ds-button-unfilled{--ds-button-unfilled-fg:var(--color-translucent-foreground-secondary);--ds-button-unfilled-fg-active:var(--color-translucent-foreground-primary);--ds-button-unfilled-dot-ring:var(--color-translucent-translucent);--ds-button-unfilled-border:var(--color-translucent-border-secondary)}.button-unfilled--background-inverted.sc-ds-button-unfilled{--ds-button-unfilled-fg:var(--color-inverted-foreground-secondary);--ds-button-unfilled-fg-active:var(--color-inverted-foreground-primary);--ds-button-unfilled-dot-ring:var(--color-inverted-background);--ds-button-unfilled-border:var(--color-inverted-border-secondary)}.button-unfilled--background-media.sc-ds-button-unfilled{--ds-button-unfilled-fg:var(--color-media-foreground-secondary);--ds-button-unfilled-fg-active:var(--color-media-foreground-primary);--ds-button-unfilled-dot-ring:var(--color-media-background);--ds-button-unfilled-border:var(--color-media-border-secondary)}.button-unfilled--on-always-dark.sc-ds-button-unfilled{--ds-button-unfilled-fg:var(--color-always-dark-foreground-secondary);--ds-button-unfilled-fg-active:var(--color-always-dark-foreground-primary);--ds-button-unfilled-dot-ring:var(--color-always-dark-background);--ds-button-unfilled-border:var(--color-always-dark-border-secondary)}.button-unfilled.ds-interaction-fill--selected.sc-ds-button-unfilled{--ds-button-unfilled-dot-ring:var(--ds-interaction-active)}`;const v=n(class n extends t{constructor(n){super();if(n!==false){this.__registerHost()}this.dsClick=o(this,"dsClick");this.dsChange=o(this,"dsChange");this.variant="label";this.size="md";this.isInset=false;this.width="hug";this.label="";this.icon="";this.isActive=false;this.activeFill=true;this.hasBorder=true;this.rounded=false;this.pressScale=true;this.dot=false;this.isInactive=false;this.isLoading=false;this.type="button";this.ariaLabel=null;this.hasMenu=false;this.buttonEl=null;this.handleClick=n=>{if(this.isInactive||this.isLoading){n.preventDefault();n.stopPropagation();return}this.dsClick.emit(n);if(this.pressed!==undefined)this.dsChange.emit(!this.pressed)}}async setFocus(){this.buttonEl?.focus()}get showDot(){return this.variant==="icon"&&this.dot&&!this.isLoading}get resolvedHaspopup(){return this.haspopup??(this.hasMenu?"menu":undefined)}get visuallyActive(){return this.isActive||this.pressed===true||this.expanded===true}get dotRing(){if((this.isActive||this.pressed===true)&&this.activeFill){return"var(--ds-interaction-active)"}return"var(--ds-button-unfilled-dot-ring)"}get accessibleName(){if(this.ariaLabel)return this.ariaLabel;if(this.isLoading&&this.variant==="label"&&this.label)return this.label;return undefined}render(){const n=this.background;const t={"button-unfilled":true,"ds-button":true,"ds-focus-ring-inset":true,"ds-control-press-scale":this.pressScale,"ds-interaction-fill":true,"ds-interaction-fill--selected":(this.isActive||this.pressed===true)&&this.activeFill&&!this.isInactive,"ds-interaction-fill--on-faint":n==="faint","ds-interaction-fill--on-medium":n==="medium","ds-interaction-fill--on-bold":n==="bold","ds-interaction-fill--on-strong":n==="strong","ds-interaction-fill--on-translucent":n==="translucent","ds-interaction-fill--on-inverted":n==="inverted","ds-interaction-fill--on-media":n==="media","ds-interaction-fill--on-always-dark":n==="always-dark","button-unfilled--active":this.visuallyActive,"button-unfilled--expanded":this.expanded===true&&!this.isInactive,"ds-button--expanded":this.expanded===true&&!this.isInactive,"button-unfilled--bordered":this.hasBorder,"ds-button--bordered":this.hasBorder,"button-unfilled--rounded":this.rounded,"ds-button--rounded":this.rounded,"ds-control-inactive":this.isInactive,"ds-control--lg":this.size==="lg","ds-control--md":this.size==="md","ds-control--sm":this.size==="sm","ds-control--xs":this.size==="xs","ds-control--inset":this.isInset,"ds-control-frame":true,"button-unfilled--icon":this.variant==="icon","ds-button--icon":this.variant==="icon","button-unfilled--label":this.variant==="label","button-unfilled--icon-label":this.variant==="icon-label","button-unfilled--background-faint":n==="faint","button-unfilled--background-medium":n==="medium","button-unfilled--background-bold":n==="bold","button-unfilled--background-strong":n==="strong","button-unfilled--background-translucent":n==="translucent","button-unfilled--background-inverted":n==="inverted","button-unfilled--background-media":n==="media","button-unfilled--on-always-dark":n==="always-dark"};return i(e,{key:"d329f0ff9f5cdc48156e08b2a821e312883f6e67",class:{"button-unfilled-host":true,"button-unfilled-host--icon":this.variant==="icon","ds-button-host--icon":this.variant==="icon","ds-control--lg":this.size==="lg","ds-control--md":this.size==="md","ds-control--sm":this.size==="sm","ds-control--xs":this.size==="xs","ds-control--inset":this.isInset,...l(this.width)},tabIndex:-1},i("button",{key:"d735e2057c114a0356c87b7b7cf1dc10daa851d7",ref:n=>{this.buttonEl=n??null},type:this.type,class:t,disabled:this.isInactive,tabIndex:this.focusTabIndex??0,"aria-label":this.accessibleName,"aria-busy":this.isLoading?"true":undefined,"aria-disabled":this.isLoading?"true":undefined,"aria-controls":this.controls,"aria-expanded":this.expanded===undefined?undefined:String(this.expanded),"aria-haspopup":this.resolvedHaspopup,"aria-pressed":this.pressed===undefined?undefined:String(this.pressed),onPointerDown:n=>s(n,this.pressScale&&!this.isInactive&&!this.isLoading),onClick:this.handleClick},r({namespace:"button-unfilled",variant:this.variant,size:this.size,label:this.label,icon:this.icon,hasMenu:this.hasMenu,isLoading:this.isLoading,dot:{visible:this.showDot,background:this.dotRing}})))}get el(){return this}static get style(){return b()}},[2,"ds-button-unfilled",{variant:[1],size:[1],isInset:[4,"is-inset"],width:[1],label:[1],icon:[1],isActive:[4,"is-active"],activeFill:[4,"active-fill"],hasBorder:[4,"has-border"],rounded:[4],pressScale:[4,"press-scale"],dot:[4],isInactive:[4,"is-inactive"],isLoading:[4,"is-loading"],type:[1],background:[1],ariaLabel:[1,"aria-label"],controls:[1],expanded:[4],haspopup:[1],pressed:[4],hasMenu:[4,"has-menu"],focusTabIndex:[2,"tab-index"],setFocus:[64]}]);function h(){if(typeof customElements==="undefined"){return}const n=["ds-button-unfilled","ds-badge","ds-icon","ds-loader","ds-text"];n.forEach((n=>{switch(n){case"ds-button-unfilled":if(!customElements.get(d(n))){customElements.define(d(n),v)}break;case"ds-badge":if(!customElements.get(d(n))){c()}break;case"ds-icon":if(!customElements.get(d(n))){a()}break;case"ds-loader":if(!customElements.get(d(n))){u()}break;case"ds-text":if(!customElements.get(d(n))){f()}break}}))}h();export{v as B,h as d};
+//# sourceMappingURL=p-C3Z01Glr.js.map

package/dist/components/p-C3Z01Glr.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["buttonUnfilledCss","ButtonUnfilled","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","variant","size","isInset","width","label","icon","isActive","activeFill","hasBorder","rounded","pressScale","dot","isInactive","isLoading","type","ariaLabel","hasMenu","buttonEl","handleClick","event","preventDefault","stopPropagation","dsClick","emit","pressed","undefined","dsChange","setFocus","focus","showDot","resolvedHaspopup","haspopup","visuallyActive","expanded","dotRing","accessibleName","render","bg","background","cls","h","Host","key","class","controlWidthClass","tabIndex","ref","el","disabled","focusTabIndex","controls","String","onPointerDown","beginElevatedControlPress","onClick","renderButtonContent","namespace","visible"],"sources":["src/wc/components/ButtonUnfilled/ButtonUnfilled.css?tag=ds-button-unfilled&encapsulation=scoped","src/wc/components/ButtonUnfilled/ButtonUnfilled.tsx"],"sourcesContent":["@import '../../utils/button-base.css';\n\n:host {\n  --ds-button-unfilled-fg: var(--color-foreground-secondary);\n  --ds-button-unfilled-fg-active: var(--color-foreground-primary);\n  --ds-button-unfilled-dot-ring: var(--color-background-secondary);\n  --ds-button-unfilled-border: var(--color-border-secondary);\n}\n\n.button-unfilled {\n  background: transparent;\n  color: var(--ds-button-unfilled-fg);\n  /* Hover/press/selected fill: `.ds-interaction-fill` (+ `--selected` / `--on-*`).\n     Active and popup-open foreground changes resolve atomically with the fill. */\n}\n\n.button-unfilled--active {\n  color: var(--ds-button-unfilled-fg-active);\n}\n\n/*\n * An open popup is a transient pressed state, not a selected state. Keep the\n * pressed wash visible for the popup's complete rendered lifecycle even when\n * shell chrome opts out of selected fills with `activeFill=false`.\n */\n/* Inset stroke via interaction-fill ::after (above selected / hover washes). */\n.button-unfilled--bordered {\n  --ds-interaction-border-color: var(--ds-button-unfilled-border);\n}\n\n/* Inactive: `.ds-control-inactive` (50% opacity). */\n\n/* Foreground / chrome tokens per surface — interaction tokens come from util `--on-*`. */\n.button-unfilled--background-medium {\n  --ds-button-unfilled-fg: var(--color-foreground-on-medium-background-secondary);\n  --ds-button-unfilled-fg-active: var(--color-foreground-on-medium-background-primary);\n  --ds-button-unfilled-dot-ring: var(--color-background-medium-neutral);\n  --ds-button-unfilled-border: var(--color-border-on-medium-background-secondary);\n}\n\n.button-unfilled--background-bold {\n  --ds-button-unfilled-fg: var(--color-foreground-on-bold-background-secondary);\n  --ds-button-unfilled-fg-active: var(--color-foreground-on-bold-background-primary);\n  --ds-button-unfilled-dot-ring: var(--color-background-bold-neutral);\n  --ds-button-unfilled-border: var(--color-border-on-bold-background-secondary);\n}\n\n.button-unfilled--background-strong {\n  --ds-button-unfilled-fg: var(--color-foreground-on-strong-background-secondary);\n  --ds-button-unfilled-fg-active: var(--color-foreground-on-strong-background-primary);\n  --ds-button-unfilled-dot-ring: var(--color-background-strong-neutral);\n  --ds-button-unfilled-border: var(--color-border-on-strong-background-secondary);\n}\n\n.button-unfilled--background-translucent {\n  --ds-button-unfilled-fg: var(--color-translucent-foreground-secondary);\n  --ds-button-unfilled-fg-active: var(--color-translucent-foreground-primary);\n  --ds-button-unfilled-dot-ring: var(--color-translucent-translucent);\n  --ds-button-unfilled-border: var(--color-translucent-border-secondary);\n}\n\n.button-unfilled--background-inverted {\n  --ds-button-unfilled-fg: var(--color-inverted-foreground-secondary);\n  --ds-button-unfilled-fg-active: var(--color-inverted-foreground-primary);\n  --ds-button-unfilled-dot-ring: var(--color-inverted-background);\n  --ds-button-unfilled-border: var(--color-inverted-border-secondary);\n}\n\n.button-unfilled--background-media {\n  --ds-button-unfilled-fg: var(--color-media-foreground-secondary);\n  --ds-button-unfilled-fg-active: var(--color-media-foreground-primary);\n  --ds-button-unfilled-dot-ring: var(--color-media-background);\n  --ds-button-unfilled-border: var(--color-media-border-secondary);\n}\n\n.button-unfilled--on-always-dark {\n  --ds-button-unfilled-fg: var(--color-always-dark-foreground-secondary);\n  --ds-button-unfilled-fg-active: var(--color-always-dark-foreground-primary);\n  --ds-button-unfilled-dot-ring: var(--color-always-dark-background);\n  --ds-button-unfilled-border: var(--color-always-dark-border-secondary);\n}\n\n/*\n * After surface ring defaults: selected fill remaps the knock-out to the active\n * wash so the badge halo matches the selected background.\n */\n.button-unfilled.ds-interaction-fill--selected {\n  --ds-button-unfilled-dot-ring: var(--ds-interaction-active);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport { controlWidthClass } from '../../utils';\nimport { beginElevatedControlPress } from '../../utils/control-press';\nimport { renderButtonContent } from '../../utils/button-render';\nimport type {\n  ButtonPopup,\n  ButtonSize,\n  ButtonVariant,\n  ButtonWidth,\n} from '../../utils/button-types';\n\nexport type ButtonUnfilledBackground =\n  | 'faint'\n  | 'medium'\n  | 'bold'\n  | 'strong'\n  | 'translucent'\n  | 'inverted'\n  | 'media'\n  | 'always-dark';\n\nexport type ButtonUnfilledVariant = ButtonVariant;\nexport type ButtonUnfilledSize = ButtonSize;\nexport type ButtonUnfilledWidth = ButtonWidth;\nexport type ButtonUnfilledPopup = ButtonPopup;\n\n@Component({\n  tag: 'ds-button-unfilled',\n  styleUrl: 'ButtonUnfilled.css',\n  scoped: true,\n})\nexport class ButtonUnfilled {\n  @Element() el!: HTMLElement;\n\n  /**\n   * Content layout. Default is label-only; pass `icon` for icon-only chrome\n   * (nav / tool rails) or `icon-label` for leading icon + text.\n   */\n  @Prop() variant: ButtonUnfilledVariant = 'label';\n\n  /** Control density (height, padding, icon, type). */\n  @Prop() size: ButtonUnfilledSize = 'md';\n\n  /** Use reduced outer geometry when nested inside a control of the same size. */\n  @Prop() isInset: boolean = false;\n\n  /** Width fit — hug content (default) or fill the parent. */\n  @Prop() width: ButtonUnfilledWidth = 'hug';\n\n  /** Visible text for `label` / `icon-label` variants. */\n  @Prop() label: string = '';\n\n  /** Icon name passed to <ds-icon> for `icon` / `icon-label` variants. */\n  @Prop() icon: string = '';\n\n  /**\n   * Owner-controlled visual emphasis inside a composite. This does not add\n   * toggle semantics and does not emit dsChange.\n   */\n  @Prop() isActive: boolean = false;\n\n  /**\n   * When active, render the selected interaction fill.\n   * Default `true` for general UI. Shell chrome (nav / tool rails) should pass\n   * `false` so selection is foreground-only (primary color, no fill).\n   */\n  @Prop() activeFill: boolean = true;\n\n  /** Show a 1px secondary inset border. Default on; shell chrome can pass `false`. */\n  @Prop() hasBorder: boolean = true;\n\n  /** Use the half-radius treatment instead of the default control radius. */\n  @Prop() rounded: boolean = false;\n\n  /**\n   * Scale down during a physical pointer press.\n   * Disable when an owning composite requires fixed child or background geometry.\n   */\n  @Prop() pressScale: boolean = true;\n\n  /** Show a notification dot at the top-right of the icon zone (icon variant only). */\n  @Prop() dot: boolean = false;\n\n  /** Disables interaction. */\n  @Prop() isInactive: boolean = false;\n\n  /** Shows an inline loader and prevents interaction without applying inactive opacity. */\n  @Prop() isLoading: boolean = false;\n\n  /** Native button type. */\n  @Prop() type: 'button' | 'submit' | 'reset' = 'button';\n\n  /** Actual parent surface context. Omit on primary and secondary surfaces. */\n  @Prop() background: ButtonUnfilledBackground | undefined;\n\n  /** Accessible name override. Required for icon-only buttons. */\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n  @Prop() controls: string | undefined;\n  @Prop() expanded: boolean | undefined;\n  @Prop() haspopup: ButtonUnfilledPopup | undefined;\n  /**\n   * Controlled state for a genuine toggle button. Adds aria-pressed, promotes\n   * active styling, and makes activation emit dsChange with the requested state.\n   */\n  @Prop() pressed: boolean | undefined;\n\n  /**\n   * Mark the button as a Menu trigger. Implies `aria-haspopup=\"menu\"` and covers\n   * both menu-button shapes:\n   *\n   * - `label` / `icon-label` — the action *has* a menu; a trailing chevron carries\n   *   the affordance.\n   * - `icon` — the button *is* a menu, i.e. the overflow / more-options control.\n   *   No chevron is added, so the glyph must convey it on its own; use `Ellipses`.\n   *\n   * Use `haspopup` directly for non-menu popups.\n   */\n  @Prop() hasMenu: boolean = false;\n\n  /**\n   * Native `tabindex` for roving keyboard groups in shell chrome.\n   * Omit for the default button tab stop (`0`).\n   */\n  @Prop({ attribute: 'tab-index' }) focusTabIndex?: number;\n\n  @Event() dsClick!: EventEmitter<MouseEvent>;\n  @Event() dsChange!: EventEmitter<boolean>;\n\n  private buttonEl: HTMLButtonElement | null = null;\n\n  @Method()\n  async setFocus() {\n    this.buttonEl?.focus();\n  }\n\n  private handleClick = (event: MouseEvent) => {\n    if (this.isInactive || this.isLoading) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n    this.dsClick.emit(event);\n    if (this.pressed !== undefined) this.dsChange.emit(!this.pressed);\n  };\n\n  private get showDot(): boolean {\n    return this.variant === 'icon' && this.dot && !this.isLoading;\n  }\n\n  private get resolvedHaspopup(): ButtonUnfilledPopup | undefined {\n    return this.haspopup ?? (this.hasMenu ? 'menu' : undefined);\n  }\n\n  /** An expanded popup trigger is visually active even when selection is controlled separately. */\n  private get visuallyActive(): boolean {\n    return this.isActive || this.pressed === true || this.expanded === true;\n  }\n\n  /** Knock-out ring: selected fill → active wash; otherwise surface token. */\n  private get dotRing(): string {\n    if ((this.isActive || this.pressed === true) && this.activeFill) {\n      return 'var(--ds-interaction-active)';\n    }\n    return 'var(--ds-button-unfilled-dot-ring)';\n  }\n\n  private get accessibleName(): string | undefined {\n    if (this.ariaLabel) return this.ariaLabel;\n    if (this.isLoading && this.variant === 'label' && this.label) return this.label;\n    return undefined;\n  }\n\n  render() {\n    const bg = this.background;\n    const cls: Record<string, boolean> = {\n      'button-unfilled': true,\n      'ds-button': true,\n      'ds-focus-ring-inset': true,\n      'ds-control-press-scale': this.pressScale,\n      'ds-interaction-fill': true,\n      'ds-interaction-fill--selected':\n        (this.isActive || this.pressed === true) &&\n        this.activeFill &&\n        !this.isInactive,\n      'ds-interaction-fill--on-faint': bg === 'faint',\n      'ds-interaction-fill--on-medium': bg === 'medium',\n      'ds-interaction-fill--on-bold': bg === 'bold',\n      'ds-interaction-fill--on-strong': bg === 'strong',\n      'ds-interaction-fill--on-translucent': bg === 'translucent',\n      'ds-interaction-fill--on-inverted': bg === 'inverted',\n      'ds-interaction-fill--on-media': bg === 'media',\n      'ds-interaction-fill--on-always-dark': bg === 'always-dark',\n      'button-unfilled--active': this.visuallyActive,\n      'button-unfilled--expanded': this.expanded === true && !this.isInactive,\n      'ds-button--expanded': this.expanded === true && !this.isInactive,\n      'button-unfilled--bordered': this.hasBorder,\n      'ds-button--bordered': this.hasBorder,\n      'button-unfilled--rounded': this.rounded,\n      'ds-button--rounded': this.rounded,\n      'ds-control-inactive': this.isInactive,\n      'ds-control--lg': this.size === 'lg',\n      'ds-control--md': this.size === 'md',\n      'ds-control--sm': this.size === 'sm',\n      'ds-control--xs': this.size === 'xs',\n      'ds-control--inset': this.isInset,\n      'ds-control-frame': true,\n      'button-unfilled--icon': this.variant === 'icon',\n      'ds-button--icon': this.variant === 'icon',\n      'button-unfilled--label': this.variant === 'label',\n      'button-unfilled--icon-label': this.variant === 'icon-label',\n      'button-unfilled--background-faint': bg === 'faint',\n      'button-unfilled--background-medium': bg === 'medium',\n      'button-unfilled--background-bold': bg === 'bold',\n      'button-unfilled--background-strong': bg === 'strong',\n      'button-unfilled--background-translucent': bg === 'translucent',\n      'button-unfilled--background-inverted': bg === 'inverted',\n      'button-unfilled--background-media': bg === 'media',\n      'button-unfilled--on-always-dark': bg === 'always-dark',\n    };\n\n    return (\n      <Host\n        class={{\n          'button-unfilled-host': true,\n          'button-unfilled-host--icon': this.variant === 'icon',\n          'ds-button-host--icon': this.variant === 'icon',\n          'ds-control--lg': this.size === 'lg',\n          'ds-control--md': this.size === 'md',\n          'ds-control--sm': this.size === 'sm',\n          'ds-control--xs': this.size === 'xs',\n          'ds-control--inset': this.isInset,\n          ...controlWidthClass(this.width),\n        }}\n        tabIndex={-1}\n      >\n        <button\n          ref={el => {\n            this.buttonEl = el ?? null;\n          }}\n          type={this.type}\n          class={cls}\n          disabled={this.isInactive}\n          tabIndex={this.focusTabIndex ?? 0}\n          aria-label={this.accessibleName}\n          aria-busy={this.isLoading ? 'true' : undefined}\n          aria-disabled={this.isLoading ? 'true' : undefined}\n          aria-controls={this.controls}\n          aria-expanded={this.expanded === undefined ? undefined : String(this.expanded)}\n          aria-haspopup={this.resolvedHaspopup}\n          aria-pressed={this.pressed === undefined ? undefined : String(this.pressed)}\n          onPointerDown={event =>\n            beginElevatedControlPress(\n              event,\n              this.pressScale && !this.isInactive && !this.isLoading,\n            )\n          }\n          onClick={this.handleClick}\n        >\n          {renderButtonContent({\n            namespace: 'button-unfilled',\n            variant: this.variant,\n            size: this.size,\n            label: this.label,\n            icon: this.icon,\n            hasMenu: this.hasMenu,\n            isLoading: this.isLoading,\n            dot: {\n              visible: this.showDot,\n              background: this.dotRing,\n            },\n          })}\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/{p-BX57q1Lo.js → p-CSlTJWFG.js}

@@ -1,2 +1,2 @@
-import{p as e,H as s,h as r,a as o,t as a}from"./index.js";import{d}from"./p-DwKC_9u2.js";import{d as t}from"./p-c1pY-Mqq.js";import{d as n}from"./p-DcmqsAMP.js";import{d as i}from"./p-DumWT7NN.js";import{d as c}from"./p-Ca-I2UnB.js";import{d as m}from"./p-BNiIyZCn.js";import{d as h}from"./p-CCYgBUUS.js";import{r as l}from"./p-C-vRkDyn.js";const p=()=>`.sc-ds-markdown:where(.ds-prose){display:block;box-sizing:border-box;max-inline-size:100%;min-inline-size:0;color:inherit;overflow-wrap:anywhere}.sc-ds-markdown:where(.ds-prose) :where(p,ul.sc-ds-markdown,ol.sc-ds-markdown,dl.sc-ds-markdown,blockquote.sc-ds-markdown,figure.sc-ds-markdown,figcaption.sc-ds-markdown,table).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin:0;color:inherit;font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);font-weight:var(--typography-weight-regular);line-height:var(--typography-lineheight-md);letter-spacing:var(--typography-letterspacing-negative-half)}.sc-ds-markdown:where(.ds-prose) :where(h1,h2.sc-ds-markdown,h3.sc-ds-markdown,h4.sc-ds-markdown,h5.sc-ds-markdown,h6).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin:0;color:var(--color-foreground-primary);font-family:var(--typography-font-family);font-weight:var(--typography-weight-semibold)}.sc-ds-markdown:where(.ds-prose) :where(h1,h2).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl);letter-spacing:var(--typography-letterspacing-negative-double)}.sc-ds-markdown:where(.ds-prose) :where(h3,h4).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg);letter-spacing:var(--typography-letterspacing-negative)}.sc-ds-markdown:where(.ds-prose) :where(h5,h6).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);letter-spacing:var(--typography-letterspacing-negative)}.sc-ds-markdown:where(.ds-prose)>.sc-ds-markdown:where(*+*){margin-block-start:var(--dimension-space-150)}.sc-ds-markdown:where(.ds-prose)>:where(*)+:where(h1,h2.sc-ds-markdown,h3.sc-ds-markdown,h4.sc-ds-markdown,h5.sc-ds-markdown,h6).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-block-start:var(--dimension-space-200)}.sc-ds-markdown:where(.ds-prose)>:where(h1,h2.sc-ds-markdown,h3.sc-ds-markdown,h4.sc-ds-markdown,h5.sc-ds-markdown,h6).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown+.sc-ds-markdown:where(*){margin-block-start:var(--dimension-space-100)}.sc-ds-markdown:where(.ds-prose) :where(blockquote,li.sc-ds-markdown,dd)>.sc-ds-markdown:where(*+*):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-block-start:var(--dimension-space-050)}.sc-ds-markdown:where(.ds-prose) :where(li+li.sc-ds-markdown,dt+dd).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-block-start:var(--dimension-space-050)}.sc-ds-markdown:where(.ds-prose) :where(ul,ol).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{padding-inline-start:var(--dimension-space-300)}.sc-ds-markdown:where(.ds-prose) :where(li>ul.sc-ds-markdown,li>ol).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-block-start:var(--dimension-space-050)}.sc-ds-markdown:where(.ds-prose) :where(li>input[type='checkbox']):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-inline-end:var(--dimension-space-050)}.sc-ds-markdown:where(.ds-prose) :where(blockquote):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{padding-inline-start:var(--dimension-space-150);border-inline-start:var(--dimension-stroke-width-025) solid var(--color-border-secondary);color:var(--color-foreground-secondary)}.sc-ds-markdown:where(.ds-prose) :where(strong,b).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{font-weight:var(--typography-weight-medium)}.sc-ds-markdown:where(.ds-prose) :where(h1,h2.sc-ds-markdown,h3.sc-ds-markdown,h4.sc-ds-markdown,h5.sc-ds-markdown,h6) .sc-ds-markdown:where(strong,b).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{font-weight:inherit}.sc-ds-markdown:where(.ds-prose) :where(a):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{color:var(--color-foreground-brand);text-decoration:underline;text-decoration-color:var(--color-foreground-tertiary)}.sc-ds-markdown:where(.ds-prose) :where(code):not(:where(pre code.sc-ds-markdown,[data-ds-prose='off'].sc-ds-markdown,[data-ds-prose='off'] *)).sc-ds-markdown{padding:var(--dimension-space-012) var(--dimension-space-025);border-radius:var(--dimension-radius-025);background:var(--color-background-secondary);font-family:var(--typography-fontfamily-mono);font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);letter-spacing:var(--typography-letterspacing-none)}.sc-ds-markdown:where(.ds-prose) :where(pre):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{box-sizing:border-box;max-inline-size:100%;min-inline-size:0;margin:0;padding:var(--dimension-space-150);overflow:auto;border-radius:var(--dimension-radius-050);background:var(--color-background-strong-neutral);color:var(--color-foreground-faint-neutral);font-family:var(--typography-fontfamily-mono);font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);letter-spacing:var(--typography-letterspacing-none);tab-size:2}.sc-ds-markdown:where(.ds-prose) :where(pre code):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{padding:0;background:transparent;color:inherit;font:inherit;letter-spacing:inherit;white-space:pre}.sc-ds-markdown:where(.ds-prose) :where(hr):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin:0;border:0;border-block-start:var(--dimension-stroke-width-012) solid var(--color-border-tertiary)}.sc-ds-markdown:where(.ds-prose__table-scroll){box-sizing:border-box;max-inline-size:100%;min-inline-size:0;overflow-x:auto}.sc-ds-markdown:where(.ds-prose) :where(table):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{inline-size:100%;border-collapse:collapse}.sc-ds-markdown:where(.ds-prose) :where(th,td).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{padding:var(--dimension-space-075);border:var(--dimension-stroke-width-012) solid var(--color-border-tertiary);text-align:start;vertical-align:top;overflow-wrap:anywhere}.sc-ds-markdown:where(.ds-prose) :where(th):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{color:var(--color-foreground-primary);font-weight:var(--typography-weight-medium)}.sc-ds-markdown:where(.ds-prose) :where(img,video.sc-ds-markdown,svg).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{max-inline-size:100%;block-size:auto}.sc-ds-markdown:where(.ds-prose) :where(figcaption):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-block-start:var(--dimension-space-050);color:var(--color-foreground-secondary);font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);letter-spacing:var(--typography-letterspacing-none)}.sc-ds-markdown-h{display:block;min-width:0;color:inherit;box-sizing:border-box;-webkit-user-select:text;user-select:text}`;let w;function f(){w??(w=Promise.all([import("./p-BjtXYFhw.js"),import("./p-DVsje4AY.js"),import("./p-gidVv1FX.js")]).then((([e,s,r])=>({fromMarkdown:e.fromMarkdown,gfmFromMarkdown:s.gfmFromMarkdown,gfm:r.gfm}))));return w}const k=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.content="";this.streaming=false;this.tree=null;this.parseRevision=0}componentWillLoad(){if(typeof document!=="undefined")return this.parse()}disconnectedCallback(){this.parseRevision+=1;if(this.parseFrame&&typeof cancelAnimationFrame==="function"){cancelAnimationFrame(this.parseFrame)}}scheduleParse(){if(typeof requestAnimationFrame!=="function")return;if(this.parseFrame)cancelAnimationFrame(this.parseFrame);this.parseFrame=requestAnimationFrame((()=>{this.parseFrame=undefined;void this.parse()}))}async parse(){const e=++this.parseRevision;try{const{fromMarkdown:s,gfmFromMarkdown:r,gfm:o}=await f();const a=s(this.content,{extensions:[o()],mdastExtensions:[r()]});if(e===this.parseRevision)this.tree=a}catch{if(e===this.parseRevision)this.tree=null}}children(e){if(!("children"in e))return[];return e.children.map((e=>this.renderNode(e)))}renderNode(e){switch(e.type){case"root":return this.children(e);case"text":return r("span",{class:"markdown__text"},e.value);case"paragraph":return r("p",{class:"markdown__paragraph"},this.children(e));case"heading":{const s=`h${e.depth}`;return r(s,{class:"markdown__heading"},this.children(e))}case"strong":return r("strong",{class:"markdown__strong"},this.children(e));case"emphasis":return r("em",{class:"markdown__emphasis"},this.children(e));case"delete":return r("del",{class:"markdown__delete"},this.children(e));case"blockquote":return r("blockquote",{class:"markdown__blockquote"},this.children(e));case"break":return r("br",{class:"markdown__break"});case"thematicBreak":return r("hr",{class:"markdown__thematic-break"});case"inlineCode":return r("code",{class:"markdown__inline-code"},e.value);case"code":return r("ds-code-block",{class:"markdown__code-block","data-ds-prose":"off",code:e.value,language:e.lang??"",filename:e.meta??""});case"link":{const s=l(e.url,{protocols:["http:","https:","mailto:"]});return s?r("a",{class:"markdown__link",href:s,target:"_blank",rel:"noopener noreferrer"},this.children(e)):this.children(e)}case"list":{const s=e.ordered?"ol":"ul";return r(s,{class:"markdown__list",start:e.ordered&&e.start?e.start:undefined},this.children(e))}case"listItem":return r("li",{class:"markdown__list-item"},typeof e.checked==="boolean"?r("input",{class:"markdown__task-indicator",type:"checkbox",checked:e.checked,disabled:true,"aria-hidden":"true",tabIndex:-1}):null,this.children(e));case"table":{const[s,...o]=e.children;return r("div",{class:"markdown__table-wrap ds-prose__table-scroll",tabIndex:0},r("table",{class:"markdown__table"},s?r("thead",{class:"markdown__table-head"},r("tr",{class:"markdown__table-row"},s.children.map((e=>r("th",{class:"markdown__table-heading",scope:"col"},this.children(e)))))):null,r("tbody",{class:"markdown__table-body"},o.map((e=>this.renderNode(e))))))}case"tableRow":return r("tr",{class:"markdown__table-row"},this.children(e));case"tableCell":return r("td",{class:"markdown__table-cell"},this.children(e));case"image":{const s=l(e.url,{protocols:["http:","https:","mailto:"]});return s?r("a",{class:"markdown__image-link",href:s,target:"_blank",rel:"noopener noreferrer"},e.alt||"View image"):e.alt||null}case"html":case"definition":case"footnoteDefinition":return null;case"footnoteReference":return r("sup",{class:"markdown__footnote"},e.label);default:return this.children(e)}}render(){return r(o,{key:"0f678f68ac5dc6c429e8069e106ff540ef1f526b","aria-busy":this.streaming?"true":undefined},r("div",{key:"66369e1db84c906d27582f19df6a3acdc2d3c11a",class:"markdown ds-prose"},this.tree?this.renderNode(this.tree):r("p",{class:"markdown__paragraph"},r("span",{class:"markdown__text"},this.content))))}static get watchers(){return{content:[{scheduleParse:0}]}}static get style(){return p()}},[2,"ds-markdown",{content:[1],streaming:[4],tree:[32]},undefined,{content:[{scheduleParse:0}]}]);function g(){if(typeof customElements==="undefined"){return}const e=["ds-markdown","ds-badge","ds-button-unfilled","ds-code-block","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-markdown":if(!customElements.get(a(e))){customElements.define(a(e),k)}break;case"ds-badge":if(!customElements.get(a(e))){d()}break;case"ds-button-unfilled":if(!customElements.get(a(e))){t()}break;case"ds-code-block":if(!customElements.get(a(e))){n()}break;case"ds-icon":if(!customElements.get(a(e))){i()}break;case"ds-loader":if(!customElements.get(a(e))){c()}break;case"ds-text":if(!customElements.get(a(e))){m()}break;case"ds-tooltip":if(!customElements.get(a(e))){h()}break}}))}g();export{k as M,g as d};
-//# sourceMappingURL=p-BX57q1Lo.js.map
+import{p as e,H as s,h as r,a as o,t as a}from"./index.js";import{d}from"./p-DwKC_9u2.js";import{d as t}from"./p-C3Z01Glr.js";import{d as n}from"./p-BydCwx7x.js";import{d as i}from"./p-DumWT7NN.js";import{d as c}from"./p-Ca-I2UnB.js";import{d as m}from"./p-BNiIyZCn.js";import{d as h}from"./p-CCYgBUUS.js";import{r as l}from"./p-C-vRkDyn.js";const p=()=>`.sc-ds-markdown:where(.ds-prose){display:block;box-sizing:border-box;max-inline-size:100%;min-inline-size:0;color:inherit;overflow-wrap:anywhere}.sc-ds-markdown:where(.ds-prose) :where(p,ul.sc-ds-markdown,ol.sc-ds-markdown,dl.sc-ds-markdown,blockquote.sc-ds-markdown,figure.sc-ds-markdown,figcaption.sc-ds-markdown,table).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin:0;color:inherit;font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);font-weight:var(--typography-weight-regular);line-height:var(--typography-lineheight-md);letter-spacing:var(--typography-letterspacing-negative-half)}.sc-ds-markdown:where(.ds-prose) :where(h1,h2.sc-ds-markdown,h3.sc-ds-markdown,h4.sc-ds-markdown,h5.sc-ds-markdown,h6).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin:0;color:var(--color-foreground-primary);font-family:var(--typography-font-family);font-weight:var(--typography-weight-semibold)}.sc-ds-markdown:where(.ds-prose) :where(h1,h2).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl);letter-spacing:var(--typography-letterspacing-negative-double)}.sc-ds-markdown:where(.ds-prose) :where(h3,h4).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg);letter-spacing:var(--typography-letterspacing-negative)}.sc-ds-markdown:where(.ds-prose) :where(h5,h6).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);letter-spacing:var(--typography-letterspacing-negative)}.sc-ds-markdown:where(.ds-prose)>.sc-ds-markdown:where(*+*){margin-block-start:var(--dimension-space-150)}.sc-ds-markdown:where(.ds-prose)>:where(*)+:where(h1,h2.sc-ds-markdown,h3.sc-ds-markdown,h4.sc-ds-markdown,h5.sc-ds-markdown,h6).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-block-start:var(--dimension-space-200)}.sc-ds-markdown:where(.ds-prose)>:where(h1,h2.sc-ds-markdown,h3.sc-ds-markdown,h4.sc-ds-markdown,h5.sc-ds-markdown,h6).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown+.sc-ds-markdown:where(*){margin-block-start:var(--dimension-space-100)}.sc-ds-markdown:where(.ds-prose) :where(blockquote,li.sc-ds-markdown,dd)>.sc-ds-markdown:where(*+*):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-block-start:var(--dimension-space-050)}.sc-ds-markdown:where(.ds-prose) :where(li+li.sc-ds-markdown,dt+dd).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-block-start:var(--dimension-space-050)}.sc-ds-markdown:where(.ds-prose) :where(ul,ol).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{padding-inline-start:var(--dimension-space-300)}.sc-ds-markdown:where(.ds-prose) :where(li>ul.sc-ds-markdown,li>ol).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-block-start:var(--dimension-space-050)}.sc-ds-markdown:where(.ds-prose) :where(li>input[type='checkbox']):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-inline-end:var(--dimension-space-050)}.sc-ds-markdown:where(.ds-prose) :where(blockquote):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{padding-inline-start:var(--dimension-space-150);border-inline-start:var(--dimension-stroke-width-025) solid var(--color-border-secondary);color:var(--color-foreground-secondary)}.sc-ds-markdown:where(.ds-prose) :where(strong,b).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{font-weight:var(--typography-weight-medium)}.sc-ds-markdown:where(.ds-prose) :where(h1,h2.sc-ds-markdown,h3.sc-ds-markdown,h4.sc-ds-markdown,h5.sc-ds-markdown,h6) .sc-ds-markdown:where(strong,b).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{font-weight:inherit}.sc-ds-markdown:where(.ds-prose) :where(a):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{color:var(--color-foreground-brand);text-decoration:underline;text-decoration-color:var(--color-foreground-tertiary)}.sc-ds-markdown:where(.ds-prose) :where(code):not(:where(pre code.sc-ds-markdown,[data-ds-prose='off'].sc-ds-markdown,[data-ds-prose='off'] *)).sc-ds-markdown{padding:var(--dimension-space-012) var(--dimension-space-025);border-radius:var(--dimension-radius-025);background:var(--color-background-secondary);font-family:var(--typography-fontfamily-mono);font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);letter-spacing:var(--typography-letterspacing-none)}.sc-ds-markdown:where(.ds-prose) :where(pre):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{box-sizing:border-box;max-inline-size:100%;min-inline-size:0;margin:0;padding:var(--dimension-space-150);overflow:auto;border-radius:var(--dimension-radius-050);background:var(--color-background-strong-neutral);color:var(--color-foreground-faint-neutral);font-family:var(--typography-fontfamily-mono);font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);letter-spacing:var(--typography-letterspacing-none);tab-size:2}.sc-ds-markdown:where(.ds-prose) :where(pre code):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{padding:0;background:transparent;color:inherit;font:inherit;letter-spacing:inherit;white-space:pre}.sc-ds-markdown:where(.ds-prose) :where(hr):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin:0;border:0;border-block-start:var(--dimension-stroke-width-012) solid var(--color-border-tertiary)}.sc-ds-markdown:where(.ds-prose__table-scroll){box-sizing:border-box;max-inline-size:100%;min-inline-size:0;overflow-x:auto}.sc-ds-markdown:where(.ds-prose) :where(table):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{inline-size:100%;border-collapse:collapse}.sc-ds-markdown:where(.ds-prose) :where(th,td).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{padding:var(--dimension-space-075);border:var(--dimension-stroke-width-012) solid var(--color-border-tertiary);text-align:start;vertical-align:top;overflow-wrap:anywhere}.sc-ds-markdown:where(.ds-prose) :where(th):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{color:var(--color-foreground-primary);font-weight:var(--typography-weight-medium)}.sc-ds-markdown:where(.ds-prose) :where(img,video.sc-ds-markdown,svg).sc-ds-markdown:not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{max-inline-size:100%;block-size:auto}.sc-ds-markdown:where(.ds-prose) :where(figcaption):not(:where([data-ds-prose='off'],[data-ds-prose='off'] *)).sc-ds-markdown{margin-block-start:var(--dimension-space-050);color:var(--color-foreground-secondary);font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);letter-spacing:var(--typography-letterspacing-none)}.sc-ds-markdown-h{display:block;min-width:0;color:inherit;box-sizing:border-box;-webkit-user-select:text;user-select:text}`;let w;function f(){w??(w=Promise.all([import("./p-BjtXYFhw.js"),import("./p-DVsje4AY.js"),import("./p-gidVv1FX.js")]).then((([e,s,r])=>({fromMarkdown:e.fromMarkdown,gfmFromMarkdown:s.gfmFromMarkdown,gfm:r.gfm}))));return w}const k=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.content="";this.streaming=false;this.tree=null;this.parseRevision=0}componentWillLoad(){if(typeof document!=="undefined")return this.parse()}disconnectedCallback(){this.parseRevision+=1;if(this.parseFrame&&typeof cancelAnimationFrame==="function"){cancelAnimationFrame(this.parseFrame)}}scheduleParse(){if(typeof requestAnimationFrame!=="function")return;if(this.parseFrame)cancelAnimationFrame(this.parseFrame);this.parseFrame=requestAnimationFrame((()=>{this.parseFrame=undefined;void this.parse()}))}async parse(){const e=++this.parseRevision;try{const{fromMarkdown:s,gfmFromMarkdown:r,gfm:o}=await f();const a=s(this.content,{extensions:[o()],mdastExtensions:[r()]});if(e===this.parseRevision)this.tree=a}catch{if(e===this.parseRevision)this.tree=null}}children(e){if(!("children"in e))return[];return e.children.map((e=>this.renderNode(e)))}renderNode(e){switch(e.type){case"root":return this.children(e);case"text":return r("span",{class:"markdown__text"},e.value);case"paragraph":return r("p",{class:"markdown__paragraph"},this.children(e));case"heading":{const s=`h${e.depth}`;return r(s,{class:"markdown__heading"},this.children(e))}case"strong":return r("strong",{class:"markdown__strong"},this.children(e));case"emphasis":return r("em",{class:"markdown__emphasis"},this.children(e));case"delete":return r("del",{class:"markdown__delete"},this.children(e));case"blockquote":return r("blockquote",{class:"markdown__blockquote"},this.children(e));case"break":return r("br",{class:"markdown__break"});case"thematicBreak":return r("hr",{class:"markdown__thematic-break"});case"inlineCode":return r("code",{class:"markdown__inline-code"},e.value);case"code":return r("ds-code-block",{class:"markdown__code-block","data-ds-prose":"off",code:e.value,language:e.lang??"",filename:e.meta??""});case"link":{const s=l(e.url,{protocols:["http:","https:","mailto:"]});return s?r("a",{class:"markdown__link",href:s,target:"_blank",rel:"noopener noreferrer"},this.children(e)):this.children(e)}case"list":{const s=e.ordered?"ol":"ul";return r(s,{class:"markdown__list",start:e.ordered&&e.start?e.start:undefined},this.children(e))}case"listItem":return r("li",{class:"markdown__list-item"},typeof e.checked==="boolean"?r("input",{class:"markdown__task-indicator",type:"checkbox",checked:e.checked,disabled:true,"aria-hidden":"true",tabIndex:-1}):null,this.children(e));case"table":{const[s,...o]=e.children;return r("div",{class:"markdown__table-wrap ds-prose__table-scroll",tabIndex:0},r("table",{class:"markdown__table"},s?r("thead",{class:"markdown__table-head"},r("tr",{class:"markdown__table-row"},s.children.map((e=>r("th",{class:"markdown__table-heading",scope:"col"},this.children(e)))))):null,r("tbody",{class:"markdown__table-body"},o.map((e=>this.renderNode(e))))))}case"tableRow":return r("tr",{class:"markdown__table-row"},this.children(e));case"tableCell":return r("td",{class:"markdown__table-cell"},this.children(e));case"image":{const s=l(e.url,{protocols:["http:","https:","mailto:"]});return s?r("a",{class:"markdown__image-link",href:s,target:"_blank",rel:"noopener noreferrer"},e.alt||"View image"):e.alt||null}case"html":case"definition":case"footnoteDefinition":return null;case"footnoteReference":return r("sup",{class:"markdown__footnote"},e.label);default:return this.children(e)}}render(){return r(o,{key:"0f678f68ac5dc6c429e8069e106ff540ef1f526b","aria-busy":this.streaming?"true":undefined},r("div",{key:"66369e1db84c906d27582f19df6a3acdc2d3c11a",class:"markdown ds-prose"},this.tree?this.renderNode(this.tree):r("p",{class:"markdown__paragraph"},r("span",{class:"markdown__text"},this.content))))}static get watchers(){return{content:[{scheduleParse:0}]}}static get style(){return p()}},[2,"ds-markdown",{content:[1],streaming:[4],tree:[32]},undefined,{content:[{scheduleParse:0}]}]);function g(){if(typeof customElements==="undefined"){return}const e=["ds-markdown","ds-badge","ds-button-unfilled","ds-code-block","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-markdown":if(!customElements.get(a(e))){customElements.define(a(e),k)}break;case"ds-badge":if(!customElements.get(a(e))){d()}break;case"ds-button-unfilled":if(!customElements.get(a(e))){t()}break;case"ds-code-block":if(!customElements.get(a(e))){n()}break;case"ds-icon":if(!customElements.get(a(e))){i()}break;case"ds-loader":if(!customElements.get(a(e))){c()}break;case"ds-text":if(!customElements.get(a(e))){m()}break;case"ds-tooltip":if(!customElements.get(a(e))){h()}break}}))}g();export{k as M,g as d};
+//# sourceMappingURL=p-CSlTJWFG.js.map

package/dist/components/p-Cw1bbiCG.js

@@ -0,0 +1,2 @@
+import{p as s,H as e,c as t,h as o,a as i,t as l}from"./index.js";import{o as a,a as n,r,b as d,d as h}from"./p-bLCbOPYa.js";import{i as c,r as m}from"./p-DNpE0RBz.js";import{d as u}from"./p-DwKC_9u2.js";import{d as b}from"./p-C3Z01Glr.js";import{d as p}from"./p-DumWT7NN.js";import{d as f}from"./p-Ca-I2UnB.js";import{d as g}from"./p-cPh32CFB.js";import{d as v}from"./p-BAGTb6cZ.js";import{d as w}from"./p-B1JB0Zn-.js";import{d as k}from"./p-BFMV9TJO.js";import{d as _}from"./p-DLwM1RNL.js";import{d as C}from"./p-Ch5yT3UA.js";import{d as y}from"./p-CzV4gIxd.js";import{d as E}from"./p-BNiIyZCn.js";import{d as x}from"./p-CCYgBUUS.js";const j=()=>`.sc-ds-shell-tools-h{display:block;min-width:0;min-height:0;height:100%;background:transparent}[responsive-mode='mobile'].sc-ds-shell-tools-h{width:100%;background:var(--color-background-primary)}.shell-tools__desktop.sc-ds-shell-tools,.shell-tools__desktop.sc-ds-shell-tools ds-panel-tools.sc-ds-shell-tools,.shell-tools__mobile.sc-ds-shell-tools{display:block;min-width:0;min-height:0;height:100%}.shell-tools__mobile.sc-ds-shell-tools{display:grid;grid-template-rows:auto minmax(0, 1fr);background:var(--color-background-primary)}.shell-tools__mobile-header.sc-ds-shell-tools{grid-row:1}.shell-tools__mobile-body.sc-ds-shell-tools,.shell-tools__view.sc-ds-shell-tools{min-width:0;min-height:0;height:100%}.shell-tools__mobile-body.sc-ds-shell-tools{grid-row:2;overflow:hidden}.shell-tools__view.sc-ds-shell-tools{overflow:auto;overscroll-behavior:contain}.shell-tools__view[hidden].sc-ds-shell-tools{display:none}.shell-tools__view.sc-ds-shell-tools-s>*,.shell-tools__view .sc-ds-shell-tools-s>*{min-height:0}`;const T=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.responsiveMode="desktop";this.open=false;this.activeTool="";this.presentation="drawer";this.fullscreenHeaderMode="shared";this.items=[];this.headers={};this.storageKey="";this.toolsLabel="Tools";this.toolShortcutsLabel="Tool shortcuts";this.inboxLabel="Inbox";this.inboxNavigationLabel="Inbox sections";this.panelToolsEl=null;this.selectInboxTool=s=>{const e=s.detail;if(!this.availableInboxTools.includes(e)||e===this.mobileActiveTool)return;this.open=true;this.activeTool=e;this.dsToolChange.emit({id:e,selected:true})};this.handlePanelToolChange=s=>{this.activeTool=s.detail.id;this.open=s.detail.selected};this.handlePanelPresentationChange=s=>{this.presentation=s.detail.presentation};this.handleMobileHeaderAction=(s,e,t)=>{t.stopPropagation();this.dsHeaderAction.emit({tool:s,id:e})}}presentationChanged(s,e){if(s===e)return;if(this.panelToolsEl&&this.panelToolsEl.getAttribute("presentation")!==s){this.panelToolsEl.setAttribute("presentation",s)}}get resolvedItems(){return this.items??[]}get availableInboxTools(){return this.resolvedItems.filter((s=>!s.isInactive&&(s.mobileDestination==="inbox"||c(s.id)))).map((s=>s.id))}get mobileViewOrder(){return a(this.resolvedItems).map((s=>s.id))}toolLabel(s){const e=this.resolvedItems.find((e=>e.id===s));return e?.label??e?.ariaLabel??n[s]??s}get mobileActiveTool(){const s=this.resolvedItems.find((s=>s.id===this.activeTool));const e=s?.mobileDestination==="inbox"||c(this.activeTool);if(!e)return this.activeTool;return m(this.activeTool,this.availableInboxTools)}componentWillLoad(){this.reconcileAvailability()}handleItemsChange(){this.reconcileAvailability()}reconcileAvailability(){const s=r(this.resolvedItems,this.open,this.activeTool);this.open=s.open;this.activeTool=s.activeTool}resolvedHeaders(){return this.headers??{}}activeHeader(s){return this.resolvedHeaders()[s]??{}}activateMobileTool(s){const e=this.resolvedItems.find((e=>e.id===s));if(!e||e.isInactive)return;const t=d(this.open,this.activeTool,s);this.open=t.open;this.activeTool=t.activeTool;this.dsToolChange.emit({id:s,selected:t.selected})}async activateTool(s){if(this.responsiveMode!=="mobile"){await(this.panelToolsEl?.activateTool(s));return}this.activateMobileTool(s)}async closeDrawer(){if(this.responsiveMode!=="mobile"){await(this.panelToolsEl?.closeDrawer());return}if(!this.open)return;const s=this.activeTool;this.open=false;if(s)this.dsToolChange.emit({id:s,selected:false})}async focusHeaderAction(s){if(this.responsiveMode!=="mobile"){await(this.panelToolsEl?.focusHeaderAction(s));return}const e=this.el.querySelector(`[data-header-action-id="${CSS.escape(s)}"]`);await(e?.setFocus?.())}renderForwardedSlots(){return this.mobileViewOrder.flatMap((s=>[o("slot",{name:s,slot:s}),o("slot",{name:`${s}-view`,slot:`${s}-view`})]))}renderDesktop(){return o("div",{class:"shell-tools__desktop"},o("ds-panel-tools",{open:this.open,activeTool:this.activeTool,presentation:this.presentation,fullscreenHeaderMode:this.fullscreenHeaderMode,items:this.resolvedItems,headers:this.resolvedHeaders(),storageKey:this.storageKey,toolsLabel:this.toolsLabel,toolShortcutsLabel:this.toolShortcutsLabel,ref:s=>{this.panelToolsEl=s},onDsToolChange:this.handlePanelToolChange,onDsPresentationChange:this.handlePanelPresentationChange},this.renderForwardedSlots()))}renderMobileHeader(s){const e=this.activeHeader(s);const t=e.title?.trim();const i=t||this.toolLabel(s);const l=(e.actions??[]).filter((s=>s.id!=="fullscreen"));const a=c(s)&&!e.showBack;const n=a?this.availableInboxTools.map((s=>{const e=this.resolvedItems.find((e=>e.id===s));return{id:s,label:this.toolLabel(s),variant:"label",dot:e?.dot}})):[];return o("ds-mobile-header",{class:"shell-tools__mobile-header",heading:i,headingLevel:"h2",sections:n,value:s,sectionsAriaLabel:this.inboxNavigationLabel,sectionsPresentation:a?"segmented":"switcher",sectionsSize:"lg",onDsSectionChange:this.selectInboxTool},e.showBack?o("ds-tooltip",{slot:"leading",label:e.backAriaLabel||"Back",side:"bottom",size:"sm"},o("ds-button-unfilled",{variant:"icon",icon:e.backIcon||"ChevronLeft",size:"md","aria-label":e.backAriaLabel||"Back",activeFill:false,hasBorder:false,onDsClick:()=>this.dsHeaderBack.emit({tool:s})})):null,l.map((e=>o("ds-tooltip",{slot:"trailing",key:e.id,label:e.ariaLabel,side:"bottom",size:"sm"},o("ds-button-unfilled",{id:e.triggerId||undefined,"data-header-action-id":e.id,variant:"icon",icon:e.icon,size:"md","aria-label":e.ariaLabel,haspopup:e.haspopup,controls:e.controls,expanded:e.expanded,pressed:e.pressed,isActive:!!e.expanded,isInactive:e.isInactive,activeFill:false,hasBorder:false,onDsClick:t=>this.handleMobileHeaderAction(s,e.id,t)})))))}renderMobile(){const s=this.mobileActiveTool;return o("div",{class:"shell-tools__mobile","aria-hidden":this.open&&s?undefined:"true",inert:this.open&&s?undefined:true},s?this.renderMobileHeader(s):null,o("div",{class:"shell-tools__mobile-body"},this.mobileViewOrder.map((e=>{const t=this.open&&e===s;return o("div",{class:{"shell-tools__view":true,"shell-tools__view--active":t},hidden:!t,"aria-hidden":t?undefined:"true",inert:t?undefined:true},o("slot",{name:`${e}-view`},o("slot",{name:e})))}))))}render(){const s=this.responsiveMode==="mobile";return o(i,{key:"9d3e22aa61e6e84f7939009e1dc676ddaddfb35b",role:s?this.presentation==="fullscreen"?"dialog":"complementary":undefined,"aria-modal":s&&this.presentation==="fullscreen"?"true":undefined,"aria-label":s?this.toolsLabel:undefined},s?this.renderMobile():this.renderDesktop())}get el(){return this}static get watchers(){return{presentation:[{presentationChanged:0}],items:[{handleItemsChange:0}]}}static get style(){return j()}},[262,"ds-shell-tools",{responsiveMode:[513,"responsive-mode"],open:[1540],activeTool:[1537,"active-tool"],presentation:[1537],fullscreenHeaderMode:[513,"fullscreen-header-mode"],items:[16],headers:[16],storageKey:[1,"storage-key"],toolsLabel:[1,"tools-label"],toolShortcutsLabel:[1,"tool-shortcuts-label"],inboxLabel:[1,"inbox-label"],inboxNavigationLabel:[1,"inbox-navigation-label"],activateTool:[64],closeDrawer:[64],focusHeaderAction:[64]},undefined,{presentation:[{presentationChanged:0}],items:[{handleItemsChange:0}]}]);function B(){if(typeof customElements==="undefined"){return}const s=["ds-shell-tools","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-mobile-header","ds-mobile-section-switcher","ds-panel-tool-header","ds-panel-tools","ds-swatch-picker","ds-switch","ds-tab-group","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-shell-tools":if(!customElements.get(l(s))){customElements.define(l(s),T)}break;case"ds-badge":if(!customElements.get(l(s))){u()}break;case"ds-button-unfilled":if(!customElements.get(l(s))){b()}break;case"ds-icon":if(!customElements.get(l(s))){p()}break;case"ds-loader":if(!customElements.get(l(s))){f()}break;case"ds-menu":if(!customElements.get(l(s))){g()}break;case"ds-mobile-header":if(!customElements.get(l(s))){v()}break;case"ds-mobile-section-switcher":if(!customElements.get(l(s))){w()}break;case"ds-panel-tool-header":if(!customElements.get(l(s))){k()}break;case"ds-panel-tools":if(!customElements.get(l(s))){h()}break;case"ds-swatch-picker":if(!customElements.get(l(s))){_()}break;case"ds-switch":if(!customElements.get(l(s))){C()}break;case"ds-tab-group":if(!customElements.get(l(s))){y()}break;case"ds-text":if(!customElements.get(l(s))){E()}break;case"ds-tooltip":if(!customElements.get(l(s))){x()}break}}))}B();export{T as S,B as d};
+//# sourceMappingURL=p-Cw1bbiCG.js.map

package/dist/components/{p-B_eqa09C.js.map → p-Cw1bbiCG.js.map}

@@ -1 +1 @@
-{"version":3,"names":["shellToolsCss","ShellTools","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","responsiveMode","open","activeTool","presentation","fullscreenHeaderMode","items","headers","storageKey","toolsLabel","toolShortcutsLabel","inboxLabel","inboxNavigationLabel","panelToolsEl","selectInboxTool","event","id","detail","availableInboxTools","includes","mobileActiveTool","dsToolChange","emit","selected","handlePanelToolChange","handlePanelPresentationChange","handleMobileHeaderAction","tool","stopPropagation","dsHeaderAction","presentationChanged","next","previous","getAttribute","setAttribute","resolvedItems","filter","item","isInactive","mobileDestination","isShellInboxTool","map","mobileViewOrder","orderPanelToolsItems","toolLabel","find","candidate","label","ariaLabel","PANEL_TOOLS_LABELS","inbox","resolveAvailableInboxTool","componentWillLoad","reconcileAvailability","handleItemsChange","reconcilePanelToolsAvailability","resolvedHeaders","activeHeader","activateMobileTool","entry","resolvePanelToolActivation","activateTool","closeDrawer","focusHeaderAction","action","el","querySelector","CSS","escape","setFocus","renderForwardedSlots","flatMap","h","name","slot","renderDesktop","class","ref","element","onDsToolChange","onDsPresentationChange","renderMobileHeader","header","configuredTitle","title","trim","actions","inboxRoot","showBack","sections","variant","dot","heading","headingLevel","value","sectionsAriaLabel","sectionsPresentation","sectionsSize","onDsSectionChange","backAriaLabel","side","size","icon","backIcon","activeFill","hasBorder","onDsClick","dsHeaderBack","key","triggerId","undefined","haspopup","controls","expanded","pressed","isActive","renderMobile","inert","active","hidden","render","mobile","Host","role"],"sources":["src/wc/components/ShellTools/ShellTools.css?tag=ds-shell-tools&encapsulation=scoped","src/wc/components/ShellTools/ShellTools.tsx"],"sourcesContent":[":host {\n  display: block;\n  min-width: 0;\n  min-height: 0;\n  height: 100%;\n  background: transparent;\n}\n\n:host([responsive-mode='mobile']) {\n  width: 100%;\n  background: var(--color-background-primary);\n}\n\n.shell-tools__desktop,\n.shell-tools__desktop ds-panel-tools,\n.shell-tools__mobile {\n  display: block;\n  min-width: 0;\n  min-height: 0;\n  height: 100%;\n}\n\n.shell-tools__mobile {\n  display: grid;\n  grid-template-rows: auto minmax(0, 1fr);\n  background: var(--color-background-primary);\n}\n\n.shell-tools__mobile-header {\n  grid-row: 1;\n}\n\n.shell-tools__mobile-body,\n.shell-tools__view {\n  min-width: 0;\n  min-height: 0;\n  height: 100%;\n}\n\n.shell-tools__mobile-body {\n  grid-row: 2;\n  overflow: hidden;\n}\n\n.shell-tools__view {\n  overflow: auto;\n  overscroll-behavior: contain;\n}\n\n.shell-tools__view[hidden] {\n  display: none;\n}\n\n.shell-tools__view ::slotted(*) {\n  min-height: 0;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport {\n  PANEL_TOOLS_LABELS,\n  type PanelToolsHeaderConfig,\n  type PanelToolsHeaders,\n  type PanelToolsItem,\n  type PanelToolsToolId,\n} from '../PanelTools/panel-tools-types';\nimport {\n  orderPanelToolsItems,\n  reconcilePanelToolsAvailability,\n  resolvePanelToolActivation,\n} from '../PanelTools/panel-tools-utils';\nimport {\n  isShellInboxTool,\n  resolveAvailableInboxTool,\n  type ShellInboxToolId,\n  type ShellResponsiveMode,\n} from '../../shell/shell-responsive';\n\n@Component({\n  tag: 'ds-shell-tools',\n  styleUrl: 'ShellTools.css',\n  scoped: true,\n})\nexport class ShellTools {\n  @Element() el!: HTMLElement;\n\n  /** Resolved by ShellApp; mobile uses a full-stage tool presentation. */\n  @Prop({ attribute: 'responsive-mode', reflect: true })\n  responsiveMode: ShellResponsiveMode = 'desktop';\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n  @Prop({ mutable: true, attribute: 'active-tool', reflect: true })\n  activeTool: PanelToolsToolId | '' = '';\n  @Prop({ mutable: true, reflect: true }) presentation: 'drawer' | 'fullscreen' = 'drawer';\n  @Prop({ attribute: 'fullscreen-header-mode', reflect: true })\n  fullscreenHeaderMode: 'shared' | 'split' = 'shared';\n  @Prop() items: PanelToolsItem[] = [];\n  @Prop() headers: PanelToolsHeaders = {};\n  @Prop({ attribute: 'storage-key' }) storageKey: string = '';\n  @Prop() toolsLabel: string = 'Tools';\n  @Prop() toolShortcutsLabel: string = 'Tool shortcuts';\n  @Prop() inboxLabel: string = 'Inbox';\n  @Prop() inboxNavigationLabel: string = 'Inbox sections';\n\n  @Watch('presentation')\n  presentationChanged(next: 'drawer' | 'fullscreen', previous: 'drawer' | 'fullscreen') {\n    if (next === previous) return;\n\n    /*\n     * Consumers update ShellTools and their slotted master/detail layout in the\n     * same render. Forward the request immediately so PanelTools can conceal\n     * its surface until its matching render class commits on the next frame.\n     */\n    if (this.panelToolsEl && this.panelToolsEl.getAttribute('presentation') !== next) {\n      this.panelToolsEl.setAttribute('presentation', next);\n    }\n  }\n\n  @Event({ bubbles: true, composed: true }) dsToolChange!: EventEmitter<{\n    id: PanelToolsToolId;\n    selected: boolean;\n  }>;\n  @Event({ bubbles: true, composed: true }) dsPresentationChange!: EventEmitter<{\n    presentation: 'drawer' | 'fullscreen';\n  }>;\n  @Event({ bubbles: true, composed: true }) dsHeaderBack!: EventEmitter<{\n    tool: PanelToolsToolId;\n  }>;\n  @Event({ bubbles: true, composed: true }) dsHeaderAction!: EventEmitter<{\n    tool: PanelToolsToolId;\n    id: string;\n  }>;\n\n  private panelToolsEl: HTMLDsPanelToolsElement | null = null;\n\n  private get resolvedItems(): PanelToolsItem[] {\n    return this.items ?? [];\n  }\n\n  private get availableInboxTools(): ShellInboxToolId[] {\n    return this.resolvedItems\n      .filter(\n        item =>\n          !item.isInactive &&\n          (item.mobileDestination === 'inbox' || isShellInboxTool(item.id))\n      )\n      .map(item => item.id as ShellInboxToolId);\n  }\n\n  private get mobileViewOrder(): PanelToolsToolId[] {\n    return orderPanelToolsItems(this.resolvedItems).map(item => item.id);\n  }\n\n  private toolLabel(id: PanelToolsToolId): string {\n    const item = this.resolvedItems.find(candidate => candidate.id === id);\n    return (\n      item?.label ??\n      item?.ariaLabel ??\n      PANEL_TOOLS_LABELS[id as keyof typeof PANEL_TOOLS_LABELS] ??\n      id\n    );\n  }\n\n  private get mobileActiveTool(): PanelToolsToolId | '' {\n    const item = this.resolvedItems.find(candidate => candidate.id === this.activeTool);\n    const inbox =\n      item?.mobileDestination === 'inbox' || isShellInboxTool(this.activeTool);\n    if (!inbox) return this.activeTool;\n    return resolveAvailableInboxTool(this.activeTool, this.availableInboxTools);\n  }\n\n  componentWillLoad() {\n    this.reconcileAvailability();\n  }\n\n  @Watch('items')\n  handleItemsChange() {\n    this.reconcileAvailability();\n  }\n\n  private reconcileAvailability() {\n    const next = reconcilePanelToolsAvailability(this.resolvedItems, this.open, this.activeTool);\n    this.open = next.open;\n    this.activeTool = next.activeTool;\n  }\n\n  private resolvedHeaders(): PanelToolsHeaders {\n    return this.headers ?? {};\n  }\n\n  private activeHeader(tool: PanelToolsToolId): PanelToolsHeaderConfig {\n    return this.resolvedHeaders()[tool] ?? {};\n  }\n\n  private activateMobileTool(id: PanelToolsToolId) {\n    const item = this.resolvedItems.find(entry => entry.id === id);\n    if (!item || item.isInactive) return;\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  private selectInboxTool = (event: CustomEvent<string>) => {\n    const id = event.detail;\n    if (!this.availableInboxTools.includes(id) || id === this.mobileActiveTool) return;\n    this.open = true;\n    this.activeTool = id;\n    this.dsToolChange.emit({ id, selected: true });\n  };\n\n  private handlePanelToolChange = (\n    event: CustomEvent<{ id: PanelToolsToolId; selected: boolean }>\n  ) => {\n    this.activeTool = event.detail.id;\n    this.open = event.detail.selected;\n  };\n\n  private handlePanelPresentationChange = (\n    event: CustomEvent<{ presentation: 'drawer' | 'fullscreen' }>\n  ) => {\n    this.presentation = event.detail.presentation;\n  };\n\n  private handleMobileHeaderAction = (\n    tool: PanelToolsToolId,\n    id: string,\n    event: CustomEvent<MouseEvent>\n  ) => {\n    event.stopPropagation();\n    this.dsHeaderAction.emit({ tool, id });\n  };\n\n  /** Match PanelTools' imperative activation contract in every responsive mode. */\n  @Method()\n  async activateTool(id: PanelToolsToolId) {\n    if (this.responsiveMode !== 'mobile') {\n      await this.panelToolsEl?.activateTool(id);\n      return;\n    }\n    this.activateMobileTool(id);\n  }\n\n  /** Close the active global tool surface. */\n  @Method()\n  async closeDrawer() {\n    if (this.responsiveMode !== 'mobile') {\n      await this.panelToolsEl?.closeDrawer();\n      return;\n    }\n    if (!this.open) return;\n    const id = this.activeTool;\n    this.open = false;\n    if (id) this.dsToolChange.emit({ id, selected: false });\n  }\n\n  /** Focus an application-owned action in the visible shared tool header. */\n  @Method()\n  async focusHeaderAction(id: string) {\n    if (this.responsiveMode !== 'mobile') {\n      await this.panelToolsEl?.focusHeaderAction(id);\n      return;\n    }\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 renderForwardedSlots() {\n    return this.mobileViewOrder.flatMap(id => [\n      <slot name={id} slot={id} />,\n      <slot name={`${id}-view`} slot={`${id}-view`} />,\n    ]);\n  }\n\n  private renderDesktop() {\n    return (\n      <div class=\"shell-tools__desktop\">\n        <ds-panel-tools\n          open={this.open}\n          activeTool={this.activeTool}\n          presentation={this.presentation}\n          fullscreenHeaderMode={this.fullscreenHeaderMode}\n          items={this.resolvedItems}\n          headers={this.resolvedHeaders()}\n          storageKey={this.storageKey}\n          toolsLabel={this.toolsLabel}\n          toolShortcutsLabel={this.toolShortcutsLabel}\n          ref={element => {\n            this.panelToolsEl = element as HTMLDsPanelToolsElement | null;\n          }}\n          onDsToolChange={this.handlePanelToolChange}\n          onDsPresentationChange={this.handlePanelPresentationChange}\n        >\n          {this.renderForwardedSlots()}\n        </ds-panel-tools>\n      </div>\n    );\n  }\n\n  private renderMobileHeader(tool: PanelToolsToolId) {\n    const header = this.activeHeader(tool);\n    const configuredTitle = header.title?.trim();\n    const title = configuredTitle || this.toolLabel(tool);\n    const actions = (header.actions ?? []).filter(action => action.id !== 'fullscreen');\n    const inboxRoot = isShellInboxTool(tool) && !header.showBack;\n    const sections =\n      inboxRoot\n        ? this.availableInboxTools.map(id => {\n            const item = this.resolvedItems.find(candidate => candidate.id === id);\n            return {\n              id,\n              label: this.toolLabel(id),\n              variant: 'label' as const,\n              dot: item?.dot,\n            };\n          })\n        : [];\n\n    return (\n      <ds-mobile-header\n        class=\"shell-tools__mobile-header\"\n        heading={title}\n        headingLevel=\"h2\"\n        sections={sections}\n        value={tool}\n        sectionsAriaLabel={this.inboxNavigationLabel}\n        sectionsPresentation={inboxRoot ? 'segmented' : 'switcher'}\n        sectionsSize=\"lg\"\n        onDsSectionChange={this.selectInboxTool}\n      >\n        {header.showBack ? (\n          <ds-tooltip\n            slot=\"leading\"\n            label={header.backAriaLabel || 'Back'}\n            side=\"bottom\"\n            size=\"sm\"\n          >\n            <ds-button-unfilled\n              variant=\"icon\"\n              icon={header.backIcon || 'ChevronLeft'}\n              size=\"md\"\n              aria-label={header.backAriaLabel || 'Back'}\n              activeFill={false}\n              hasBorder={false}\n              onDsClick={() => this.dsHeaderBack.emit({ tool })}\n            />\n          </ds-tooltip>\n        ) : null}\n        {actions.map(action => (\n          <ds-tooltip\n            slot=\"trailing\"\n            key={action.id}\n            label={action.ariaLabel}\n            side=\"bottom\"\n            size=\"sm\"\n          >\n            <ds-button-unfilled\n              id={action.triggerId || undefined}\n              data-header-action-id={action.id}\n              variant=\"icon\"\n              icon={action.icon}\n              size=\"md\"\n              aria-label={action.ariaLabel}\n              haspopup={action.haspopup}\n              controls={action.controls}\n              expanded={action.expanded}\n              pressed={action.pressed}\n              isActive={!!action.expanded}\n              isInactive={action.isInactive}\n              activeFill={false}\n              hasBorder={false}\n              onDsClick={(event: CustomEvent<MouseEvent>) =>\n                this.handleMobileHeaderAction(tool, action.id, event)}\n            />\n          </ds-tooltip>\n        ))}\n      </ds-mobile-header>\n    );\n  }\n\n  private renderMobile() {\n    const tool = this.mobileActiveTool;\n    return (\n      <div\n        class=\"shell-tools__mobile\"\n        aria-hidden={this.open && tool ? undefined : 'true'}\n        inert={this.open && tool ? undefined : true}\n      >\n        {tool ? this.renderMobileHeader(tool) : null}\n        <div class=\"shell-tools__mobile-body\">\n          {this.mobileViewOrder.map(id => {\n            const active = this.open && id === tool;\n            return (\n              <div\n                class={{\n                  'shell-tools__view': true,\n                  'shell-tools__view--active': active,\n                }}\n                hidden={!active}\n                aria-hidden={active ? undefined : 'true'}\n                inert={active ? undefined : true}\n              >\n                <slot name={`${id}-view`}>\n                  <slot name={id} />\n                </slot>\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    const mobile = this.responsiveMode === 'mobile';\n    return (\n      <Host\n        role={\n          mobile\n            ? this.presentation === 'fullscreen'\n              ? 'dialog'\n              : 'complementary'\n            : undefined\n        }\n        aria-modal={mobile && this.presentation === 'fullscreen' ? 'true' : undefined}\n        aria-label={mobile ? this.toolsLabel : undefined}\n      >\n        {mobile ? this.renderMobile() : this.renderDesktop()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["shellToolsCss","ShellTools","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","responsiveMode","open","activeTool","presentation","fullscreenHeaderMode","items","headers","storageKey","toolsLabel","toolShortcutsLabel","inboxLabel","inboxNavigationLabel","panelToolsEl","selectInboxTool","event","id","detail","availableInboxTools","includes","mobileActiveTool","dsToolChange","emit","selected","handlePanelToolChange","handlePanelPresentationChange","handleMobileHeaderAction","tool","stopPropagation","dsHeaderAction","presentationChanged","next","previous","getAttribute","setAttribute","resolvedItems","filter","item","isInactive","mobileDestination","isShellInboxTool","map","mobileViewOrder","orderPanelToolsItems","toolLabel","find","candidate","label","ariaLabel","PANEL_TOOLS_LABELS","inbox","resolveAvailableInboxTool","componentWillLoad","reconcileAvailability","handleItemsChange","reconcilePanelToolsAvailability","resolvedHeaders","activeHeader","activateMobileTool","entry","resolvePanelToolActivation","activateTool","closeDrawer","focusHeaderAction","action","el","querySelector","CSS","escape","setFocus","renderForwardedSlots","flatMap","h","name","slot","renderDesktop","class","ref","element","onDsToolChange","onDsPresentationChange","renderMobileHeader","header","configuredTitle","title","trim","actions","inboxRoot","showBack","sections","variant","dot","heading","headingLevel","value","sectionsAriaLabel","sectionsPresentation","sectionsSize","onDsSectionChange","backAriaLabel","side","size","icon","backIcon","activeFill","hasBorder","onDsClick","dsHeaderBack","key","triggerId","undefined","haspopup","controls","expanded","pressed","isActive","renderMobile","inert","active","hidden","render","mobile","Host","role"],"sources":["src/wc/components/ShellTools/ShellTools.css?tag=ds-shell-tools&encapsulation=scoped","src/wc/components/ShellTools/ShellTools.tsx"],"sourcesContent":[":host {\n  display: block;\n  min-width: 0;\n  min-height: 0;\n  height: 100%;\n  background: transparent;\n}\n\n:host([responsive-mode='mobile']) {\n  width: 100%;\n  background: var(--color-background-primary);\n}\n\n.shell-tools__desktop,\n.shell-tools__desktop ds-panel-tools,\n.shell-tools__mobile {\n  display: block;\n  min-width: 0;\n  min-height: 0;\n  height: 100%;\n}\n\n.shell-tools__mobile {\n  display: grid;\n  grid-template-rows: auto minmax(0, 1fr);\n  background: var(--color-background-primary);\n}\n\n.shell-tools__mobile-header {\n  grid-row: 1;\n}\n\n.shell-tools__mobile-body,\n.shell-tools__view {\n  min-width: 0;\n  min-height: 0;\n  height: 100%;\n}\n\n.shell-tools__mobile-body {\n  grid-row: 2;\n  overflow: hidden;\n}\n\n.shell-tools__view {\n  overflow: auto;\n  overscroll-behavior: contain;\n}\n\n.shell-tools__view[hidden] {\n  display: none;\n}\n\n.shell-tools__view ::slotted(*) {\n  min-height: 0;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport {\n  PANEL_TOOLS_LABELS,\n  type PanelToolsHeaderConfig,\n  type PanelToolsHeaders,\n  type PanelToolsItem,\n  type PanelToolsToolId,\n} from '../PanelTools/panel-tools-types';\nimport {\n  orderPanelToolsItems,\n  reconcilePanelToolsAvailability,\n  resolvePanelToolActivation,\n} from '../PanelTools/panel-tools-utils';\nimport {\n  isShellInboxTool,\n  resolveAvailableInboxTool,\n  type ShellInboxToolId,\n  type ShellResponsiveMode,\n} from '../../shell/shell-responsive';\n\n@Component({\n  tag: 'ds-shell-tools',\n  styleUrl: 'ShellTools.css',\n  scoped: true,\n})\nexport class ShellTools {\n  @Element() el!: HTMLElement;\n\n  /** Resolved by ShellApp; mobile uses a full-stage tool presentation. */\n  @Prop({ attribute: 'responsive-mode', reflect: true })\n  responsiveMode: ShellResponsiveMode = 'desktop';\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n  @Prop({ mutable: true, attribute: 'active-tool', reflect: true })\n  activeTool: PanelToolsToolId | '' = '';\n  @Prop({ mutable: true, reflect: true }) presentation: 'drawer' | 'fullscreen' = 'drawer';\n  @Prop({ attribute: 'fullscreen-header-mode', reflect: true })\n  fullscreenHeaderMode: 'shared' | 'split' = 'shared';\n  @Prop() items: PanelToolsItem[] = [];\n  @Prop() headers: PanelToolsHeaders = {};\n  @Prop({ attribute: 'storage-key' }) storageKey: string = '';\n  @Prop() toolsLabel: string = 'Tools';\n  @Prop() toolShortcutsLabel: string = 'Tool shortcuts';\n  @Prop() inboxLabel: string = 'Inbox';\n  @Prop() inboxNavigationLabel: string = 'Inbox sections';\n\n  @Watch('presentation')\n  presentationChanged(next: 'drawer' | 'fullscreen', previous: 'drawer' | 'fullscreen') {\n    if (next === previous) return;\n\n    /*\n     * Consumers update ShellTools and their slotted master/detail layout in the\n     * same render. Forward the request immediately so PanelTools can conceal\n     * its surface until its matching render class commits on the next frame.\n     */\n    if (this.panelToolsEl && this.panelToolsEl.getAttribute('presentation') !== next) {\n      this.panelToolsEl.setAttribute('presentation', next);\n    }\n  }\n\n  @Event({ bubbles: true, composed: true }) dsToolChange!: EventEmitter<{\n    id: PanelToolsToolId;\n    selected: boolean;\n  }>;\n  @Event({ bubbles: true, composed: true }) dsPresentationChange!: EventEmitter<{\n    presentation: 'drawer' | 'fullscreen';\n  }>;\n  @Event({ bubbles: true, composed: true }) dsHeaderBack!: EventEmitter<{\n    tool: PanelToolsToolId;\n  }>;\n  @Event({ bubbles: true, composed: true }) dsHeaderAction!: EventEmitter<{\n    tool: PanelToolsToolId;\n    id: string;\n  }>;\n\n  private panelToolsEl: HTMLDsPanelToolsElement | null = null;\n\n  private get resolvedItems(): PanelToolsItem[] {\n    return this.items ?? [];\n  }\n\n  private get availableInboxTools(): ShellInboxToolId[] {\n    return this.resolvedItems\n      .filter(\n        item =>\n          !item.isInactive &&\n          (item.mobileDestination === 'inbox' || isShellInboxTool(item.id))\n      )\n      .map(item => item.id as ShellInboxToolId);\n  }\n\n  private get mobileViewOrder(): PanelToolsToolId[] {\n    return orderPanelToolsItems(this.resolvedItems).map(item => item.id);\n  }\n\n  private toolLabel(id: PanelToolsToolId): string {\n    const item = this.resolvedItems.find(candidate => candidate.id === id);\n    return (\n      item?.label ??\n      item?.ariaLabel ??\n      PANEL_TOOLS_LABELS[id as keyof typeof PANEL_TOOLS_LABELS] ??\n      id\n    );\n  }\n\n  private get mobileActiveTool(): PanelToolsToolId | '' {\n    const item = this.resolvedItems.find(candidate => candidate.id === this.activeTool);\n    const inbox =\n      item?.mobileDestination === 'inbox' || isShellInboxTool(this.activeTool);\n    if (!inbox) return this.activeTool;\n    return resolveAvailableInboxTool(this.activeTool, this.availableInboxTools);\n  }\n\n  componentWillLoad() {\n    this.reconcileAvailability();\n  }\n\n  @Watch('items')\n  handleItemsChange() {\n    this.reconcileAvailability();\n  }\n\n  private reconcileAvailability() {\n    const next = reconcilePanelToolsAvailability(this.resolvedItems, this.open, this.activeTool);\n    this.open = next.open;\n    this.activeTool = next.activeTool;\n  }\n\n  private resolvedHeaders(): PanelToolsHeaders {\n    return this.headers ?? {};\n  }\n\n  private activeHeader(tool: PanelToolsToolId): PanelToolsHeaderConfig {\n    return this.resolvedHeaders()[tool] ?? {};\n  }\n\n  private activateMobileTool(id: PanelToolsToolId) {\n    const item = this.resolvedItems.find(entry => entry.id === id);\n    if (!item || item.isInactive) return;\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  private selectInboxTool = (event: CustomEvent<string>) => {\n    const id = event.detail;\n    if (!this.availableInboxTools.includes(id) || id === this.mobileActiveTool) return;\n    this.open = true;\n    this.activeTool = id;\n    this.dsToolChange.emit({ id, selected: true });\n  };\n\n  private handlePanelToolChange = (\n    event: CustomEvent<{ id: PanelToolsToolId; selected: boolean }>\n  ) => {\n    this.activeTool = event.detail.id;\n    this.open = event.detail.selected;\n  };\n\n  private handlePanelPresentationChange = (\n    event: CustomEvent<{ presentation: 'drawer' | 'fullscreen' }>\n  ) => {\n    this.presentation = event.detail.presentation;\n  };\n\n  private handleMobileHeaderAction = (\n    tool: PanelToolsToolId,\n    id: string,\n    event: CustomEvent<MouseEvent>\n  ) => {\n    event.stopPropagation();\n    this.dsHeaderAction.emit({ tool, id });\n  };\n\n  /** Match PanelTools' imperative activation contract in every responsive mode. */\n  @Method()\n  async activateTool(id: PanelToolsToolId) {\n    if (this.responsiveMode !== 'mobile') {\n      await this.panelToolsEl?.activateTool(id);\n      return;\n    }\n    this.activateMobileTool(id);\n  }\n\n  /** Close the active global tool surface. */\n  @Method()\n  async closeDrawer() {\n    if (this.responsiveMode !== 'mobile') {\n      await this.panelToolsEl?.closeDrawer();\n      return;\n    }\n    if (!this.open) return;\n    const id = this.activeTool;\n    this.open = false;\n    if (id) this.dsToolChange.emit({ id, selected: false });\n  }\n\n  /** Focus an application-owned action in the visible shared tool header. */\n  @Method()\n  async focusHeaderAction(id: string) {\n    if (this.responsiveMode !== 'mobile') {\n      await this.panelToolsEl?.focusHeaderAction(id);\n      return;\n    }\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 renderForwardedSlots() {\n    return this.mobileViewOrder.flatMap(id => [\n      <slot name={id} slot={id} />,\n      <slot name={`${id}-view`} slot={`${id}-view`} />,\n    ]);\n  }\n\n  private renderDesktop() {\n    return (\n      <div class=\"shell-tools__desktop\">\n        <ds-panel-tools\n          open={this.open}\n          activeTool={this.activeTool}\n          presentation={this.presentation}\n          fullscreenHeaderMode={this.fullscreenHeaderMode}\n          items={this.resolvedItems}\n          headers={this.resolvedHeaders()}\n          storageKey={this.storageKey}\n          toolsLabel={this.toolsLabel}\n          toolShortcutsLabel={this.toolShortcutsLabel}\n          ref={element => {\n            this.panelToolsEl = element as HTMLDsPanelToolsElement | null;\n          }}\n          onDsToolChange={this.handlePanelToolChange}\n          onDsPresentationChange={this.handlePanelPresentationChange}\n        >\n          {this.renderForwardedSlots()}\n        </ds-panel-tools>\n      </div>\n    );\n  }\n\n  private renderMobileHeader(tool: PanelToolsToolId) {\n    const header = this.activeHeader(tool);\n    const configuredTitle = header.title?.trim();\n    const title = configuredTitle || this.toolLabel(tool);\n    const actions = (header.actions ?? []).filter(action => action.id !== 'fullscreen');\n    const inboxRoot = isShellInboxTool(tool) && !header.showBack;\n    const sections =\n      inboxRoot\n        ? this.availableInboxTools.map(id => {\n            const item = this.resolvedItems.find(candidate => candidate.id === id);\n            return {\n              id,\n              label: this.toolLabel(id),\n              variant: 'label' as const,\n              dot: item?.dot,\n            };\n          })\n        : [];\n\n    return (\n      <ds-mobile-header\n        class=\"shell-tools__mobile-header\"\n        heading={title}\n        headingLevel=\"h2\"\n        sections={sections}\n        value={tool}\n        sectionsAriaLabel={this.inboxNavigationLabel}\n        sectionsPresentation={inboxRoot ? 'segmented' : 'switcher'}\n        sectionsSize=\"lg\"\n        onDsSectionChange={this.selectInboxTool}\n      >\n        {header.showBack ? (\n          <ds-tooltip\n            slot=\"leading\"\n            label={header.backAriaLabel || 'Back'}\n            side=\"bottom\"\n            size=\"sm\"\n          >\n            <ds-button-unfilled\n              variant=\"icon\"\n              icon={header.backIcon || 'ChevronLeft'}\n              size=\"md\"\n              aria-label={header.backAriaLabel || 'Back'}\n              activeFill={false}\n              hasBorder={false}\n              onDsClick={() => this.dsHeaderBack.emit({ tool })}\n            />\n          </ds-tooltip>\n        ) : null}\n        {actions.map(action => (\n          <ds-tooltip\n            slot=\"trailing\"\n            key={action.id}\n            label={action.ariaLabel}\n            side=\"bottom\"\n            size=\"sm\"\n          >\n            <ds-button-unfilled\n              id={action.triggerId || undefined}\n              data-header-action-id={action.id}\n              variant=\"icon\"\n              icon={action.icon}\n              size=\"md\"\n              aria-label={action.ariaLabel}\n              haspopup={action.haspopup}\n              controls={action.controls}\n              expanded={action.expanded}\n              pressed={action.pressed}\n              isActive={!!action.expanded}\n              isInactive={action.isInactive}\n              activeFill={false}\n              hasBorder={false}\n              onDsClick={(event: CustomEvent<MouseEvent>) =>\n                this.handleMobileHeaderAction(tool, action.id, event)}\n            />\n          </ds-tooltip>\n        ))}\n      </ds-mobile-header>\n    );\n  }\n\n  private renderMobile() {\n    const tool = this.mobileActiveTool;\n    return (\n      <div\n        class=\"shell-tools__mobile\"\n        aria-hidden={this.open && tool ? undefined : 'true'}\n        inert={this.open && tool ? undefined : true}\n      >\n        {tool ? this.renderMobileHeader(tool) : null}\n        <div class=\"shell-tools__mobile-body\">\n          {this.mobileViewOrder.map(id => {\n            const active = this.open && id === tool;\n            return (\n              <div\n                class={{\n                  'shell-tools__view': true,\n                  'shell-tools__view--active': active,\n                }}\n                hidden={!active}\n                aria-hidden={active ? undefined : 'true'}\n                inert={active ? undefined : true}\n              >\n                <slot name={`${id}-view`}>\n                  <slot name={id} />\n                </slot>\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    const mobile = this.responsiveMode === 'mobile';\n    return (\n      <Host\n        role={\n          mobile\n            ? this.presentation === 'fullscreen'\n              ? 'dialog'\n              : 'complementary'\n            : undefined\n        }\n        aria-modal={mobile && this.presentation === 'fullscreen' ? 'true' : undefined}\n        aria-label={mobile ? this.toolsLabel : undefined}\n      >\n        {mobile ? this.renderMobile() : this.renderDesktop()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/p-CzV4gIxd.js

@@ -0,0 +1,2 @@
+import{p as o,H as r,c as t,h as s,a as i,t as n}from"./index.js";import{g as e,i as a}from"./p-BQq26pt9.js";import{d}from"./p-DwKC_9u2.js";import{d as c}from"./p-DumWT7NN.js";import{d as l}from"./p-BNiIyZCn.js";import{C as u}from"./p-CuwopElg.js";const b=()=>`.ds-control--lg.sc-ds-tab-group,.ds-control--lg.sc-ds-tab-group-h,.ds-control--md.sc-ds-tab-group-h,.ds-control--md.sc-ds-tab-group,.ds-control--sm.sc-ds-tab-group-h,.ds-control--sm.sc-ds-tab-group,.ds-control--xs.sc-ds-tab-group-h,.ds-control--xs.sc-ds-tab-group{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-tab-group-h,.ds-control--lg.sc-ds-tab-group{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-tab-group-h,.ds-control--md.sc-ds-tab-group{--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-tab-group-h,.ds-control--sm.sc-ds-tab-group{--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-tab-group-h,.ds-control--xs.sc-ds-tab-group{--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--lg.ds-control--inset.sc-ds-tab-group-h,.ds-control--lg.ds-control--inset.sc-ds-tab-group{--ds-control-height:calc(var(--dimension-size-500) - var(--dimension-space-050));--ds-control-padding-inline:calc(     var(--dimension-space-100) - var(--dimension-space-025)   )}.ds-control--md.ds-control--inset.sc-ds-tab-group-h,.ds-control--md.ds-control--inset.sc-ds-tab-group{--ds-control-height:calc(var(--dimension-size-400) - var(--dimension-space-050));--ds-control-padding-inline:calc(     var(--dimension-space-075) - var(--dimension-space-025)   )}.ds-control--sm.ds-control--inset.sc-ds-tab-group-h,.ds-control--sm.ds-control--inset.sc-ds-tab-group{--ds-control-height:calc(var(--dimension-size-300) - var(--dimension-space-050));--ds-control-padding-inline:calc(     var(--dimension-space-050) - var(--dimension-space-025)   )}.ds-control--xs.ds-control--inset.sc-ds-tab-group-h,.ds-control--xs.ds-control--inset.sc-ds-tab-group{--ds-control-height:calc(var(--dimension-size-200) - var(--dimension-space-050));--ds-control-padding-inline:calc(     var(--dimension-space-025) - var(--dimension-space-025)   )}@media (forced-colors: active){.sc-ds-tab-group:root,.sc-ds-tab-group-h,.ds-forced-colors-scope.sc-ds-tab-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-tab-group-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-tab-group-h,.ds-focus-ring.sc-ds-tab-group,.ds-focus-ring-inset.sc-ds-tab-group-h,.ds-focus-ring-inset.sc-ds-tab-group{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-tab-group-h:focus-visible,.ds-focus-ring.sc-ds-tab-group:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-tab-group-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-tab-group{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-tab-group-h:focus-visible,.ds-focus-ring-inset.sc-ds-tab-group:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-tab-group-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-tab-group:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tab-group-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tab-group{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tab-group-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tab-group::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-tab-group-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-tab-group:root,.sc-ds-tab-group-h,.ds-forced-colors-scope.sc-ds-tab-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-tab-group-h,.ds-interaction-fill.sc-ds-tab-group{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-tab-group-h::before,.ds-interaction-fill.sc-ds-tab-group::before,.ds-interaction-fill.sc-ds-tab-group-h::after,.ds-interaction-fill.sc-ds-tab-group::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-tab-group-h::before,.ds-interaction-fill.sc-ds-tab-group::before{z-index:1}.ds-interaction-fill.sc-ds-tab-group-h::after,.ds-interaction-fill.sc-ds-tab-group::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-tab-group-h,.ds-interaction-fill--bordered.sc-ds-tab-group{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-tab-group-h::before,.ds-interaction-fill--selected.sc-ds-tab-group::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-tab-group-h,.ds-interaction-fill--selected.sc-ds-tab-group{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-tab-group-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-tab-group:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-tab-group-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-tab-group:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-tab-group-h::after,.ds-interaction-fill--grouped.sc-ds-tab-group::after,.ds-interaction-fill--grouped.sc-ds-tab-group-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-tab-group:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-tab-group-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-tab-group:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}.ds-interaction-fill--grouped.sc-ds-tab-group-h,.ds-interaction-fill--grouped.sc-ds-tab-group{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-tab-group-h>.ds-interaction-fill__content.sc-ds-tab-group,.ds-interaction-fill.sc-ds-tab-group>.ds-interaction-fill__content.sc-ds-tab-group,.ds-interaction-fill__content.sc-ds-tab-group{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-tab-group-h,.ds-interaction-fill--on-faint.sc-ds-tab-group{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-tab-group-h,.ds-interaction-fill--on-medium.sc-ds-tab-group{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-tab-group-h,.ds-interaction-fill--on-bold.sc-ds-tab-group{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-tab-group-h,.ds-interaction-fill--on-strong.sc-ds-tab-group{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-tab-group-h,.ds-interaction-fill--on-translucent.sc-ds-tab-group{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-tab-group-h,.ds-interaction-fill--on-inverted.sc-ds-tab-group{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-tab-group-h,.ds-interaction-fill--on-media.sc-ds-tab-group{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-tab-group-h,.ds-interaction-fill--on-always-dark.sc-ds-tab-group{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-tab-group-h,.ds-interaction-fill--on-navigation.sc-ds-tab-group{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-tab-group-h::after,.ds-interaction-fill.sc-ds-tab-group::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid       var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-tab-group-h::before,.ds-interaction-fill--selected.sc-ds-tab-group::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-tab-group-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-tab-group:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-tab-group:root,.sc-ds-tab-group-h,.ds-forced-colors-scope.sc-ds-tab-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-tab-group-h,.ds-control-inactive.sc-ds-tab-group{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-tab-group-h,.ds-control-inactive.sc-ds-tab-group{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-tab-group-h{display:block;--_tab-group-surface-border:var(--color-border-tertiary);--_tab-group-divider:var(--color-border-secondary)}.tab-group-host--on-medium.sc-ds-tab-group-h{--_tab-group-surface-border:var(--color-border-on-medium-background-tertiary);--_tab-group-divider:var(--color-border-on-medium-background-secondary)}.tab-group-host--on-bold.sc-ds-tab-group-h{--_tab-group-surface-border:var(--color-border-on-bold-background-tertiary);--_tab-group-divider:var(--color-border-on-bold-background-secondary)}.tab-group-host--on-strong.sc-ds-tab-group-h{--_tab-group-surface-border:var(--color-border-on-strong-background-tertiary);--_tab-group-divider:var(--color-border-on-strong-background-secondary)}.tab-group-host--on-translucent.sc-ds-tab-group-h{--_tab-group-surface-border:var(--color-translucent-border-tertiary);--_tab-group-divider:var(--color-translucent-border-secondary)}.tab-group-host--on-inverted.sc-ds-tab-group-h{--_tab-group-surface-border:var(--color-inverted-border-tertiary);--_tab-group-divider:var(--color-inverted-border-secondary)}.tab-group-host--on-media.sc-ds-tab-group-h{--_tab-group-surface-border:var(--color-media-border-tertiary);--_tab-group-divider:var(--color-media-border-secondary)}.tab-group-host--on-always-dark.sc-ds-tab-group-h{--_tab-group-surface-border:var(--color-always-dark-border-tertiary);--_tab-group-divider:var(--color-always-dark-border-secondary)}.tab-list.sc-ds-tab-group{display:flex;align-items:center;gap:var(--ds-control-gap);position:relative;width:max-content;max-width:100%;height:var(--ds-control-height);padding:calc(var(--dimension-space-025) - var(--dimension-stroke-width-012));background-color:var(--color-background-secondary);border:var(--dimension-stroke-width-012) solid var(--_tab-group-surface-border);border-radius:var(--dimension-radius-half);box-sizing:border-box}.tab-group-host--surface.sc-ds-tab-group-h .tab-list.sc-ds-tab-group{background-color:transparent}.tab.sc-ds-tab-group{display:flex;align-items:center;justify-content:center;gap:var(--ds-control-gap);padding:0 var(--ds-control-padding-inline);background-color:transparent;border:none;border-radius:var(--dimension-radius-half);cursor:default;-webkit-user-select:none;user-select:none;color:var(--color-foreground-secondary);transition:color var(--effect-motion-short-2);flex-shrink:0;height:var(--ds-control-height);min-width:var(--ds-control-height);box-sizing:border-box;--_dot:var(--color-foreground-bold-brand)}.tab--selected.sc-ds-tab-group{color:var(--color-foreground-primary);background-color:var(--color-background-primary);--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--_tab-group-surface-border)}.tab-group-host--surface.sc-ds-tab-group-h .tab--selected.sc-ds-tab-group{background-color:var(--ds-interaction-active)}.tab--selected.sc-ds-tab-group:not(.ds-interaction-fill){box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.tab__content.sc-ds-tab-group{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:var(--ds-control-gap);min-width:0}.tab__content--dot.sc-ds-tab-group{padding-right:var(--dimension-space-050)}.tab__label.sc-ds-tab-group{padding:0 var(--ds-control-label-inset);white-space:nowrap}.tab__icon.sc-ds-tab-group{flex-shrink:0}.tab__dot.sc-ds-tab-group{position:absolute;top:0;right:0;z-index:2;pointer-events:none}.on-medium.sc-ds-tab-group{color:var(--color-foreground-on-medium-background-secondary)}.on-medium.tab--selected.sc-ds-tab-group{color:var(--color-foreground-on-medium-background-primary)}.on-bold.sc-ds-tab-group{color:var(--color-foreground-on-bold-background-secondary)}.on-bold.tab--selected.sc-ds-tab-group{color:var(--color-foreground-on-bold-background-primary)}.on-strong.sc-ds-tab-group{color:var(--color-foreground-on-strong-background-secondary)}.on-strong.tab--selected.sc-ds-tab-group{color:var(--color-foreground-on-strong-background-primary)}.on-translucent.sc-ds-tab-group{color:var(--color-translucent-foreground-secondary)}.on-translucent.tab--selected.sc-ds-tab-group{color:var(--color-translucent-foreground-primary)}.on-inverted.sc-ds-tab-group{color:var(--color-inverted-foreground-secondary)}.on-inverted.tab--selected.sc-ds-tab-group{color:var(--color-inverted-foreground-primary)}.on-media.sc-ds-tab-group{color:var(--color-media-foreground-secondary)}.on-media.tab--selected.sc-ds-tab-group{color:var(--color-media-foreground-primary)}.on-always-dark.sc-ds-tab-group{color:var(--color-always-dark-foreground-secondary)}.on-always-dark.tab--selected.sc-ds-tab-group{color:var(--color-always-dark-foreground-primary)}.tab-divider.sc-ds-tab-group{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-stroke-width-012);align-self:center;padding:0;flex-shrink:0;pointer-events:none}.tab-divider__line.sc-ds-tab-group{width:var(--dimension-stroke-width-012);height:var(--typography-lineheight-sm);flex-shrink:0;background-color:var(--_tab-group-divider)}`;const g=o(class o extends r{constructor(o){super();if(o!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.value="";this.tabs=[];this.size="md";this.ariaLabel=null}get selectableTabs(){return e(this.tabs)}get focusableTabId(){return this.selectableTabs.some((o=>o.id===this.value&&!o.isInactive))?this.value:this.selectableTabs.find((o=>!o.isInactive))?.id??""}selectTab(o,r){this.value=o;this.dsChange.emit(o);if(r?.focus!==false){this.focusTab(o)}}focusTab(o){const r=this.el.querySelector(`[data-tab-id="${o}"]`);r?.focus({preventScroll:true})}onValueChange(o,r){if(r===undefined||o===r)return;requestAnimationFrame((()=>{const r=document.activeElement;if(!r||!this.el.contains(r))return;const t=r.getAttribute("data-tab-id");if(t===o)return;const s=this.selectableTabs.some((r=>r.id===o&&!r.isInactive))?o:this.focusableTabId;const i=this.el.querySelector(`[data-tab-id="${s}"]`);if(i){i.focus({preventScroll:true})}else{r.blur()}}))}findEnabled(o,r){const t=this.selectableTabs;const s=t.length;for(let i=0;i<s;i++){const n=(o+r*(i+1)+s*(i+1))%s;if(!t[n]?.isInactive)return n}return o}handleKeyDown(o){const r=this.selectableTabs;if(!r.length)return;const t=o.target?.closest("[data-tab-id]")?.dataset["tabId"];const s=r.findIndex((o=>o.id===(t??this.focusableTabId)));let i=null;if(o.key==="ArrowRight"){i=this.findEnabled(s,1)}else if(o.key==="ArrowLeft"){i=this.findEnabled(s,-1)}if(o.key==="Home"){const o=r.findIndex((o=>!o.isInactive));i=o===-1?null:o}else if(o.key==="End"){const o=[...r].reverse().findIndex((o=>!o.isInactive));i=o===-1?null:r.length-1-o}if(i!==null){o.preventDefault();const t=r[i];this.selectTab(t.id)}}getBgClass(){if(!this.background)return"";if(this.background==="always-dark")return"on-always-dark";return`on-${this.background}`}render(){const o=this.getBgClass();const r=this.focusableTabId;return s(i,{key:"1bcf5f90ae1a333dfa7b9954d74acd03f9247fa6",class:{"tab-group-host":true,[`tab-group-host--${this.size}`]:true,[`ds-control--${this.size}`]:true,"tab-group-host--surface":!!o,[`tab-group-host--${o}`]:!!o}},s("div",{key:"6d76c7d7d069fd682d774e3aee34732273f15644",role:"tablist",class:"tab-list","aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby},this.tabs.map(((t,i)=>{if(a(t)){return s("div",{key:`divider-${i}`,class:"tab-divider","aria-hidden":"true"},s("div",{class:"tab-divider__line"}))}const n=t.id===this.value;const e=t.variant??"label";const d=e==="icon"||e==="icon-label";const c=e==="label"||e==="icon-label";const l=n&&!o;return s("button",{key:t.id,type:"button",role:"tab","data-tab-id":t.id,class:{tab:true,"tab--selected":n,[`ds-control--${this.size}`]:true,"ds-control--inset":true,"ds-focus-ring-inset":true,"ds-interaction-fill":!t.isInactive,"ds-interaction-fill--on-faint":o==="on-faint","ds-interaction-fill--on-medium":o==="on-medium","ds-interaction-fill--on-bold":o==="on-bold","ds-interaction-fill--on-strong":o==="on-strong","ds-interaction-fill--on-translucent":o==="on-translucent","ds-interaction-fill--on-inverted":o==="on-inverted","ds-interaction-fill--on-media":o==="on-media","ds-interaction-fill--on-always-dark":o==="on-always-dark","ds-control-inactive":!!t.isInactive,[o]:!!o},"aria-label":e==="icon"?t.label:undefined,"aria-selected":n,"aria-disabled":t.isInactive?"true":undefined,"aria-controls":t.panelId??undefined,disabled:t.isInactive,tabIndex:t.id===r?0:-1,onClick:()=>!t.isInactive&&this.selectTab(t.id)},s("span",{class:{tab__content:true,[`tab__content--${e}`]:true,"tab__content--dot":!!t.dot}},d&&s("ds-icon",{class:"tab__icon",name:t.icon,size:this.size,color:"inherit"}),c&&s("ds-text",{class:"tab__label",as:"span",variant:u[this.size],emphasis:l,color:"inherit"},t.label),t.dot&&s("ds-badge",{class:"tab__dot",variant:"dot",hasRing:false,label:"","aria-hidden":"true"})))}))))}get el(){return this}static get watchers(){return{value:[{onValueChange:0}]}}static get style(){return b()}},[2,"ds-tab-group",{value:[1025],tabs:[16],size:[1],background:[1],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"]},[[0,"keydown","handleKeyDown"]],{value:[{onValueChange:0}]}]);function p(){if(typeof customElements==="undefined"){return}const o=["ds-tab-group","ds-badge","ds-icon","ds-text"];o.forEach((o=>{switch(o){case"ds-tab-group":if(!customElements.get(n(o))){customElements.define(n(o),g)}break;case"ds-badge":if(!customElements.get(n(o))){d()}break;case"ds-icon":if(!customElements.get(n(o))){c()}break;case"ds-text":if(!customElements.get(n(o))){l()}break}}))}p();export{g as T,p as d};
+//# sourceMappingURL=p-CzV4gIxd.js.map