@ds-mo/ui 14.4.2 → 14.6.0

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

@@ -1 +0,0 @@
-{"version":3,"names":["MODIFIER_GLYPHS","Set","MODIFIER_LABELS","alt","cmd","command","control","ctrl","option","shift","canonicalKeyLabel","label","toLowerCase","shortcutKeyLabels","shortcut","normalized","trim","includes","split","map","part","filter","Boolean","test","characters","Array","from","labels","length","has","push","join","tooltipCss","FALLBACK_HEIGHT","md","TOKEN_DEFAULTS","size400","sm","size300","xs","size200","lastDismissedAt","tooltipIdCounter","activeTooltip","createDsText","opts","el","document","createElement","as","variant","emphasis","color","wrap","textContent","text","styleTooltipLabel","style","flexShrink","minWidth","maxWidth","padding","Tooltip","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","size","side","align","sideOffset","TOKEN_CSS_LENGTHS","space050","alignOffset","delay","animationDelayMedium3","shortcutKeyPosition","tooltipId","delayTimer","closeTimer","anchor","popupEl","anchorObserver","didLoad","position","AnchoredPositionController","getAnchor","getPopup","measure","tip","anchorRect","getBoundingClientRect","popupWidth","offsetWidth","tooltipFallbackWidthPx","popupHeight","offsetHeight","tooltipFallbackHeightPx","sideOffsetPx","alignOffsetPx","viewportPadPx","viewportWidth","window","innerWidth","viewportHeight","innerHeight","apply","x","y","resolvedSide","dataset","transform","Math","round","liveUpdate","observeResize","skipEnterAnimation","isOpen","lastInteractionWasKeyboard","pointerEnterHandler","event","pointerType","show","pointerLeaveHandler","hide","pointerDownHandler","hideInstant","keyDownHandler","focusHandler","matches","blurHandler","e","next","relatedTarget","contains","escapeHandler","key","preventDefault","handleSlotChange","slot","querySelector","assignedElements","firstElementChild","unbindAnchor","bindAnchor","connectedCallback","connectAnchor","componentDidLoad","MutationObserver","observe","childList","disconnectedCallback","disconnect","clearTimers","destroyPopup","onContentOrPositionChange","renderPopupContent","schedulePosition","resolveCssLengthPx","hoverDelayMs","resolveCssTimeMs","instantReopenMs","animationDurationMedium1","fadeOutMs","resolveMotionTimeMs","motionShort3","animationDurationShort3","tooltipFallbackWidth","token","slotted","child","addEventListener","unlinkDescribedBy","removeEventListener","linkDescribedBy","ids","getAttribute","add","setAttribute","id","removeAttribute","clearTimeout","setupOpenListeners","teardownOpenListeners","unobserve","remove","reapplyLabelStyles","requestAnimationFrame","update","observeResizeTargets","Date","now","instant","mountPopup","setTimeout","classList","className","Object","assign","left","top","zIndex","pointerEvents","body","appendChild","toggle","textVariant","CONTROL_TEXT_VARIANT","density","sc","inner","appendShortcut","shortcutKey","group","hint","wide","replaceChildren","render","h","Host","display","onSlotchange"],"sources":["src/wc/utils/shortcut-key.ts","src/wc/components/Tooltip/Tooltip.css?tag=ds-tooltip&encapsulation=scoped","src/wc/components/Tooltip/Tooltip.tsx"],"sourcesContent":["const MODIFIER_GLYPHS = new Set(['⌘', '⇧', '⌥', '⌃']);\nconst MODIFIER_LABELS: Readonly<Record<string, string>> = {\n  alt: '⌥',\n  cmd: '⌘',\n  command: '⌘',\n  control: '⌃',\n  ctrl: '⌃',\n  option: '⌥',\n  shift: '⇧',\n};\n\nfunction canonicalKeyLabel(label: string): string {\n  return MODIFIER_LABELS[label.toLowerCase()] ?? label;\n}\n\n/** Split a shortcut chord into the labels rendered on individual keycaps. */\nexport function shortcutKeyLabels(shortcut: string): string[] {\n  const normalized = shortcut.trim();\n  if (!normalized) return [];\n\n  if (normalized.includes('+')) {\n    return normalized.split('+').map(part => part.trim()).filter(Boolean).map(canonicalKeyLabel);\n  }\n\n  if (/\\s/.test(normalized)) {\n    return normalized.split(/\\s+/).filter(Boolean).map(canonicalKeyLabel);\n  }\n\n  const characters = Array.from(normalized);\n  const labels: string[] = [];\n  while (characters.length > 1 && MODIFIER_GLYPHS.has(characters[0])) {\n    labels.push(characters.shift()!);\n  }\n  labels.push(characters.join(''));\n  return labels;\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/key-hint.css';\n@import '../../utils/forced-colors.css';\n\n.tooltip-popup {\n  box-sizing: border-box;\n  background-color: var(--color-background-primary);\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n  box-shadow: var(--effect-elevation-elevated-floating);\n  white-space: nowrap;\n  pointer-events: none;\n  animation: tooltipFadeIn var(--effect-motion-short-2) forwards;\n  will-change: transform;\n  backface-visibility: hidden;\n}\n\n/* Warm handoff between nearby triggers — no enter fade (avoids 20–100ms lag). */\n.tooltip-popup--instant {\n  animation: none;\n  opacity: 1;\n}\n\n.tooltip-popup--closing {\n  animation: tooltipFadeOut var(--effect-motion-short-3) forwards;\n}\n\n/* Density: md / sm / xs via `.ds-control--*` on `.tooltip-inner`. */\n.tooltip-inner {\n  box-sizing: border-box;\n  height: var(--ds-control-height, var(--dimension-size-400));\n  display: flex;\n  align-items: center;\n  gap: var(--ds-control-gap, var(--dimension-space-050));\n  padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n}\n\n/*\n * Label layout lives on ds-text (metric-box + control label-inset).\n * NOTE: Stencil scopes this to `ds-text.sc-ds-tooltip`, but portaled\n * createElement ds-text loses that class when Text's <Host class> renders.\n * `renderPopupContent` therefore also sets these as inline styles.\n */\n.tooltip-inner > ds-text {\n  flex-shrink: 0;\n  min-width: max-content;\n  max-width: none;\n  padding: 0 var(--ds-control-label-inset, var(--dimension-space-025));\n  color: var(--color-foreground-primary);\n}\n\n@keyframes tooltipFadeIn {\n  from { opacity: 0; }\n  to   { opacity: 1; }\n}\n\n@keyframes tooltipFadeOut {\n  from { opacity: 1; }\n  to   { opacity: 0; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .tooltip-popup,\n  .tooltip-popup--instant {\n    animation: none;\n    opacity: 1;\n  }\n\n  .tooltip-popup--closing {\n    animation: none;\n    opacity: 0;\n  }\n}\n\n@media (forced-colors: active) {\n  .tooltip-popup {\n    box-shadow: none;\n    outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n    outline-offset: calc(-1 * var(--dimension-stroke-width-012));\n  }\n}\n","import { Component, Prop, Element, Watch, h, Host } from '@stencil/core';\nimport {\n  CONTROL_TEXT_VARIANT,\n  resolveCssLengthPx,\n  resolveCssTimeMs,\n  resolveMotionTimeMs,\n  TOKEN_CSS_LENGTHS,\n  TOKEN_DEFAULTS,\n} from '../../utils';\nimport type { TextVariant } from '../Text/text-types';\nimport { shortcutKeyLabels } from '../../utils/shortcut-key';\nimport { AnchoredPositionController } from '../../utils/anchored-position-controller';\n// Side-effect: register `ds-text` — the portal builds it via createElement, not JSX.\nimport '../Text/Text';\n\nexport type TooltipSide = 'top' | 'right' | 'bottom' | 'left';\nexport type TooltipAlign = 'start' | 'center' | 'end';\nexport type TooltipSize = 'md' | 'sm' | 'xs';\n\nconst FALLBACK_HEIGHT: Record<TooltipSize, string> = {\n  md: TOKEN_DEFAULTS.size400,\n  sm: TOKEN_DEFAULTS.size300,\n  xs: TOKEN_DEFAULTS.size200,\n};\n\nlet lastDismissedAt = 0;\nlet tooltipIdCounter = 0;\n/** Currently open tooltip — force-cleared on warm handoff so tips don't cross-fade. */\nlet activeTooltip: Tooltip | null = null;\n\ntype DsTextEl = HTMLElement & {\n  as: string;\n  variant: TextVariant;\n  emphasis: boolean;\n  color: string;\n  wrap: string;\n};\n\nfunction createDsText(opts: {\n  variant: TextVariant;\n  emphasis?: boolean;\n  color?: string;\n  wrap?: 'wrap' | 'nowrap' | 'balance' | 'pretty';\n  text: string;\n}): DsTextEl {\n  const el = document.createElement('ds-text') as DsTextEl;\n  el.as = 'span';\n  el.variant = opts.variant;\n  el.emphasis = opts.emphasis ?? false;\n  el.color = opts.color ?? 'inherit';\n  if (opts.wrap) el.wrap = opts.wrap;\n  el.textContent = opts.text;\n  return el;\n}\n\n/**\n * Control-density label styles for portaled ds-text.\n * Scoped CSS requires `sc-ds-tooltip` on the host, but Text's `<Host class>`\n * overwrites imperative className — so these must be inline to stick.\n */\nfunction styleTooltipLabel(el: HTMLElement) {\n  el.style.flexShrink = '0';\n  el.style.minWidth = 'max-content';\n  el.style.maxWidth = 'none';\n  el.style.padding = '0 var(--ds-control-label-inset, var(--dimension-space-025))';\n  el.style.color = 'var(--color-foreground-primary)';\n}\n\n/**\n * Imperative body portal for the popup.\n * Stencil must not own the portaled node — moving a VDOM child to `document.body`\n * causes recreate → re-portal → @State loops that freeze the page.\n */\n@Component({\n  tag: 'ds-tooltip',\n  styleUrl: 'Tooltip.css',\n  scoped: true,\n})\nexport class Tooltip {\n  @Element() el!: HTMLElement;\n\n  /**\n   * Tooltip text. Empty/whitespace skips show — useful when the wrapper must stay\n   * mounted for layout/animation stability (e.g. PanelNav expand/collapse).\n   */\n  @Prop() label!: string;\n\n  /** Control density (height, padding, type). */\n  @Prop() size: TooltipSize = 'md';\n\n  @Prop() side: TooltipSide = 'top';\n  @Prop() align: TooltipAlign = 'center';\n  /** Gap between anchor and tooltip — number (px) or TokoMo length. */\n  @Prop() sideOffset: number | string = TOKEN_CSS_LENGTHS.space050;\n  /** Cross-axis offset — number (px) or TokoMo length. */\n  @Prop() alignOffset: number | string = 0;\n  /**\n   * Hover show delay before the tooltip appears.\n   * Default: `--effect-animation-delay-medium-3` (1000ms). Accepts a number (ms)\n   * or a TokoMo time token / `var(--effect-animation-delay-*)`. Applies to the\n   * initial hover/focus show only — after a recent dismiss, reopen is instant.\n   * Prefer the default; override only for denser chrome or rare/destructive actions.\n   */\n  @Prop() delay: number | string = TOKEN_DEFAULTS.animationDelayMedium3;\n  @Prop() shortcutKey: string | undefined;\n  @Prop() shortcutKeyPosition: 'start' | 'end' = 'end';\n\n  private tooltipId = `ds-tooltip-${++tooltipIdCounter}`;\n  private delayTimer: ReturnType<typeof setTimeout> | null = null;\n  private closeTimer: ReturnType<typeof setTimeout> | null = null;\n  private anchor: HTMLElement | null = null;\n  private popupEl: HTMLElement | null = null;\n  private anchorObserver: MutationObserver | null = null;\n  private didLoad = false;\n  private readonly position = new AnchoredPositionController({\n    getAnchor: () => this.anchor,\n    getPopup: () => this.popupEl,\n    measure: (anchor, tip) => ({\n      anchorRect: anchor.getBoundingClientRect(),\n      // Fall back to token metrics until `ds-text` upgrades and reports a width.\n      popupWidth: tip.offsetWidth || this.tooltipFallbackWidthPx,\n      popupHeight: tip.offsetHeight || this.tooltipFallbackHeightPx,\n      side: this.side,\n      align: this.align,\n      sideOffsetPx: this.sideOffsetPx,\n      alignOffsetPx: this.alignOffsetPx,\n      viewportPadPx: this.viewportPadPx,\n      viewportWidth: window.innerWidth,\n      viewportHeight: window.innerHeight,\n    }),\n    apply: ({ x, y, resolvedSide }) => {\n      if (!this.popupEl) return;\n      this.popupEl.dataset.side = resolvedSide;\n      this.popupEl.style.transform = `translate(${Math.round(x)}px, ${Math.round(y)}px)`;\n    },\n    liveUpdate: 'frame',\n    observeResize: true,\n  });\n  private skipEnterAnimation = false;\n  private isOpen = false;\n  private lastInteractionWasKeyboard = false;\n  private pointerEnterHandler = (event: PointerEvent) => {\n    if (event.pointerType === 'touch') return;\n    this.show();\n  };\n  private pointerLeaveHandler = (event: PointerEvent) => {\n    if (event.pointerType === 'touch') return;\n    this.hide();\n  };\n  private pointerDownHandler = (event: PointerEvent) => {\n    this.lastInteractionWasKeyboard = false;\n    if (event.pointerType === 'touch' && (this.isOpen || this.popupEl)) this.hideInstant();\n  };\n  private keyDownHandler = () => {\n    this.lastInteractionWasKeyboard = true;\n  };\n  /** focusin/focusout so nested focus targets (e.g. ds-button-* inner button) still open the tip. */\n  private focusHandler = () => {\n    if (this.lastInteractionWasKeyboard || this.anchor?.matches(':focus-visible')) this.show();\n  };\n  private blurHandler: (e: FocusEvent) => void = (e) => {\n    const next = e.relatedTarget as Node | null;\n    if (next && this.anchor?.contains(next)) return;\n    this.hide();\n  };\n  private escapeHandler = (event: KeyboardEvent) => {\n    if (event.key !== 'Escape' || !this.isOpen) return;\n    event.preventDefault();\n    this.hide();\n  };\n\n  connectedCallback() {\n    if (!this.didLoad) return;\n    this.connectAnchor();\n  }\n\n  componentDidLoad() {\n    this.didLoad = true;\n    this.connectAnchor();\n  }\n\n  private connectAnchor() {\n    this.bindAnchor();\n    if (this.anchorObserver) return;\n    this.anchorObserver = new MutationObserver(() => this.handleSlotChange());\n    this.anchorObserver.observe(this.el, { childList: true });\n  }\n\n  disconnectedCallback() {\n    if (activeTooltip === this) activeTooltip = null;\n    this.anchorObserver?.disconnect();\n    this.anchorObserver = null;\n    this.unbindAnchor();\n    this.clearTimers();\n    this.destroyPopup();\n  }\n\n  @Watch('label')\n  @Watch('size')\n  @Watch('side')\n  @Watch('align')\n  @Watch('sideOffset')\n  @Watch('alignOffset')\n  @Watch('shortcutKey')\n  @Watch('shortcutKeyPosition')\n  onContentOrPositionChange() {\n    if (!this.label?.trim()) {\n      if (this.isOpen || this.popupEl) this.hideInstant();\n      return;\n    }\n    if (!this.popupEl || !this.isOpen) return;\n    this.renderPopupContent();\n    this.schedulePosition();\n  }\n\n  private get viewportPadPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n  }\n\n  private get sideOffsetPx(): number {\n    return resolveCssLengthPx(this.sideOffset, TOKEN_DEFAULTS.space050);\n  }\n\n  private get alignOffsetPx(): number {\n    return resolveCssLengthPx(this.alignOffset, 0);\n  }\n\n  private get hoverDelayMs(): number {\n    return resolveCssTimeMs(this.delay, TOKEN_DEFAULTS.animationDelayMedium3);\n  }\n\n  private get instantReopenMs(): number {\n    return resolveCssTimeMs(\n      TOKEN_DEFAULTS.animationDurationMedium1,\n      TOKEN_DEFAULTS.animationDurationMedium1,\n    );\n  }\n\n  private get fadeOutMs(): number {\n    return resolveMotionTimeMs(TOKEN_DEFAULTS.motionShort3, TOKEN_DEFAULTS.animationDurationShort3);\n  }\n\n  private get tooltipFallbackWidthPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.tooltipFallbackWidth, TOKEN_DEFAULTS.tooltipFallbackWidth);\n  }\n\n  private get tooltipFallbackHeightPx(): number {\n    const token = FALLBACK_HEIGHT[this.size];\n    return resolveCssLengthPx(token, token);\n  }\n\n  private bindAnchor() {\n    const slot = this.el.querySelector('slot') as HTMLSlotElement | null;\n    const slotted = slot?.assignedElements?.() ?? [];\n    const child = (slotted[0] ?? this.el.firstElementChild) as HTMLElement | null;\n    if (!child || child === this.anchor) return;\n    this.anchor = child;\n    child.addEventListener('pointerenter', this.pointerEnterHandler);\n    child.addEventListener('pointerleave', this.pointerLeaveHandler);\n    child.addEventListener('pointerdown', this.pointerDownHandler);\n    child.addEventListener('keydown', this.keyDownHandler);\n    child.addEventListener('focusin', this.focusHandler);\n    child.addEventListener('focusout', this.blurHandler);\n  }\n\n  private unbindAnchor() {\n    if (!this.anchor) return;\n    this.unlinkDescribedBy();\n    this.anchor.removeEventListener('pointerenter', this.pointerEnterHandler);\n    this.anchor.removeEventListener('pointerleave', this.pointerLeaveHandler);\n    this.anchor.removeEventListener('pointerdown', this.pointerDownHandler);\n    this.anchor.removeEventListener('keydown', this.keyDownHandler);\n    this.anchor.removeEventListener('focusin', this.focusHandler);\n    this.anchor.removeEventListener('focusout', this.blurHandler);\n    this.anchor = null;\n  }\n\n  private linkDescribedBy() {\n    if (!this.anchor || !this.popupEl) return;\n    const ids = new Set((this.anchor.getAttribute('aria-describedby') ?? '').split(/\\s+/).filter(Boolean));\n    ids.add(this.tooltipId);\n    this.anchor.setAttribute('aria-describedby', Array.from(ids).join(' '));\n  }\n\n  private unlinkDescribedBy() {\n    if (!this.anchor) return;\n    const ids = (this.anchor.getAttribute('aria-describedby') ?? '')\n      .split(/\\s+/)\n      .filter(id => id && id !== this.tooltipId);\n    if (ids.length) this.anchor.setAttribute('aria-describedby', ids.join(' '));\n    else this.anchor.removeAttribute('aria-describedby');\n  }\n\n  private handleSlotChange = () => {\n    const slot = this.el.querySelector('slot') as HTMLSlotElement | null;\n    const next = (slot?.assignedElements?.()[0] ?? this.el.firstElementChild) as HTMLElement | null;\n    if (next === this.anchor) return;\n    if (this.isOpen || this.popupEl) this.hideInstant();\n    this.unbindAnchor();\n    this.bindAnchor();\n  };\n\n  private clearTimers() {\n    if (this.delayTimer) { clearTimeout(this.delayTimer); this.delayTimer = null; }\n    if (this.closeTimer) { clearTimeout(this.closeTimer); this.closeTimer = null; }\n  }\n\n  private setupOpenListeners() {\n    // Binds scroll/resize + the resize observer; placement itself is scheduled\n    // by schedulePosition() so the label restyle stays interleaved.\n    this.position.observe();\n    document.addEventListener('keydown', this.escapeHandler);\n  }\n\n  private teardownOpenListeners() {\n    this.position.unobserve();\n    document.removeEventListener('keydown', this.escapeHandler);\n  }\n\n  private destroyPopup() {\n    this.teardownOpenListeners();\n    this.unlinkDescribedBy();\n    if (!this.popupEl) return;\n    this.popupEl.remove();\n    this.popupEl = null;\n  }\n\n  /**\n   * Position after `ds-text` upgrades and lays out. Measuring synchronously in\n   * `mountPopup` reads a collapsed/fallback width and places left/right tips wrong.\n   */\n  private schedulePosition() {\n    if (!this.popupEl) return;\n\n    const reapplyLabelStyles = () => {\n      const label = this.popupEl?.querySelector(':scope > .tooltip-inner > ds-text');\n      if (label instanceof HTMLElement) styleTooltipLabel(label);\n    };\n\n    requestAnimationFrame(() => {\n      reapplyLabelStyles();\n      this.position.update();\n      requestAnimationFrame(() => {\n        reapplyLabelStyles();\n        this.position.update();\n      });\n    });\n\n    // The popup remounts on every show, so re-target the observer bound in start().\n    this.position.observeResizeTargets();\n  }\n\n  /** Drop the open tip immediately (warm handoff to another tooltip). */\n  private hideInstant() {\n    this.clearTimers();\n    lastDismissedAt = Date.now();\n    if (activeTooltip === this) activeTooltip = null;\n    this.destroyPopup();\n    this.isOpen = false;\n    this.skipEnterAnimation = false;\n  }\n\n  private show() {\n    // Empty label = wrapper present for DOM stability (e.g. PanelNav expand/collapse)\n    // but no tip should appear.\n    if (!this.label?.trim()) return;\n    this.clearTimers();\n    let instant = Date.now() - lastDismissedAt < this.instantReopenMs;\n    if (activeTooltip && activeTooltip !== this) {\n      activeTooltip.hideInstant();\n      instant = true;\n    }\n    // eslint-disable-next-line @typescript-eslint/no-this-alias -- module singleton tracks the active instance\n    activeTooltip = this;\n    this.skipEnterAnimation = instant;\n    if (instant) {\n      this.mountPopup();\n      return;\n    }\n    this.delayTimer = setTimeout(() => {\n      this.delayTimer = null;\n      if (!this.label?.trim()) return;\n      this.mountPopup();\n    }, this.hoverDelayMs);\n  }\n\n  private hide() {\n    this.clearTimers();\n    if (!this.popupEl && !this.isOpen) return;\n    lastDismissedAt = Date.now();\n    if (!this.popupEl) {\n      this.isOpen = false;\n      return;\n    }\n    this.popupEl.classList.remove('tooltip-popup--instant');\n    this.popupEl.classList.add('tooltip-popup--closing');\n    if (this.fadeOutMs === 0) {\n      if (activeTooltip === this) activeTooltip = null;\n      this.destroyPopup();\n      this.isOpen = false;\n      this.skipEnterAnimation = false;\n      return;\n    }\n    this.closeTimer = setTimeout(() => {\n      this.closeTimer = null;\n      if (activeTooltip === this) activeTooltip = null;\n      this.destroyPopup();\n      this.isOpen = false;\n      this.skipEnterAnimation = false;\n    }, this.fadeOutMs);\n  }\n\n  private mountPopup() {\n    if (!this.popupEl) {\n      const tip = document.createElement('div');\n      tip.id = this.tooltipId;\n      tip.setAttribute('role', 'tooltip');\n      // `sc-ds-tooltip` is required for Stencil scoped CSS to match outside the host.\n      tip.className = 'tooltip-popup ds-forced-colors-scope sc-ds-tooltip';\n      Object.assign(tip.style, {\n        position: 'fixed',\n        left: '0',\n        top: '0',\n        zIndex: 'var(--dimension-z-index-tooltip)',\n        pointerEvents: 'none',\n      });\n      document.body.appendChild(tip);\n      this.popupEl = tip;\n    }\n\n    this.setupOpenListeners();\n    this.linkDescribedBy();\n    this.popupEl.classList.toggle('tooltip-popup--instant', this.skipEnterAnimation);\n    this.popupEl.classList.remove('tooltip-popup--closing');\n    this.renderPopupContent();\n    this.schedulePosition();\n    this.isOpen = true;\n  }\n\n  private renderPopupContent() {\n    if (!this.popupEl) return;\n    const textVariant = CONTROL_TEXT_VARIANT[this.size];\n    const density =\n      this.size === 'md' ? 'ds-control--md' : this.size === 'sm' ? 'ds-control--sm' : 'ds-control--xs';\n    // Every layout node needs `sc-ds-tooltip` so scoped selectors (`.foo.sc-ds-tooltip`) match.\n    const sc = 'sc-ds-tooltip';\n\n    const inner = document.createElement('div');\n    inner.className = `tooltip-inner ${density} ${sc}`;\n\n    const appendShortcut = (position: 'start' | 'end') => {\n      if (!this.shortcutKey || this.shortcutKeyPosition !== position) return;\n      const group = document.createElement('span');\n      group.className = `key-hint-group ${sc}`;\n      group.setAttribute('aria-hidden', 'true');\n\n      for (const label of shortcutKeyLabels(this.shortcutKey)) {\n        const hint = document.createElement('span');\n        const wide = Array.from(label).length > 1 ? ' key-hint--wide' : '';\n        hint.className = `key-hint${wide} ${sc}`;\n        const text = document.createElement('span');\n        text.className = `key-hint__label ${sc}`;\n        text.textContent = label;\n        hint.appendChild(text);\n        group.appendChild(hint);\n      }\n      inner.appendChild(group);\n    };\n\n    appendShortcut('start');\n\n    // ds-text is the layout box (metric-box + 2px control label-inset).\n    // Inline styles required — see styleTooltipLabel.\n    const label = createDsText({ variant: textVariant, wrap: 'nowrap', text: this.label });\n    styleTooltipLabel(label);\n    inner.appendChild(label);\n\n    appendShortcut('end');\n\n    this.popupEl.replaceChildren(inner);\n  }\n\n  render() {\n    return (\n      <Host style={{ display: 'contents' }}>\n        <slot onSlotchange={this.handleSlotChange} />\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}