@hashicorp/design-system-components 4.10.0 → 4.12.0

package/dist/components/hds/tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/hds/tabs/index.hbs","../../../../src/components/hds/tabs/index.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n{{! template-lint-disable no-invalid-role }}\\n<div\\n  class={{this.classNames}}\\n  {{did-insert this.didInsert}}\\n  {{did-update this.didUpdateSelectedTabIndex this.selectedTabIndex}}\\n  {{did-update this.didUpdateSelectedTabId this.selectedTabId}}\\n  {{did-update this.didUpdateParentVisibility @isParentVisible}}\\n  ...attributes\\n>\\n  <div class=\\\"hds-tabs__tablist-wrapper\\\">\\n    <ul class=\\\"hds-tabs__tablist\\\" role=\\\"tablist\\\">\\n      {{yield\\n        (hash\\n          Tab=(component\\n            \\\"hds/tabs/tab\\\"\\n            didInsertNode=this.didInsertTab\\n            didUpdateNode=this.didUpdateTab\\n            willDestroyNode=this.willDestroyTab\\n            tabIds=this.tabIds\\n            selectedTabIndex=this.selectedTabIndex\\n            onClick=this.onClick\\n            onKeyUp=this.onKeyUp\\n          )\\n        )\\n      }}\\n      <li class=\\\"hds-tabs__tab-indicator\\\" role=\\\"presentation\\\"></li>\\n    </ul>\\n  </div>\\n\\n  {{yield\\n    (hash\\n      Panel=(component\\n        \\\"hds/tabs/panel\\\"\\n        didInsertNode=this.didInsertPanel\\n        willDestroyNode=this.willDestroyPanel\\n        tabIds=this.tabIds\\n        panelIds=this.panelIds\\n        selectedTabIndex=this.selectedTabIndex\\n      )\\n    )\\n  }}\\n</div>\\n{{! template-lint-enable no-invalid-role }}\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { assert, warn } from '@ember/debug';\nimport { next, schedule } from '@ember/runloop';\nimport { HdsTabsSizeValues } from './types.ts';\nimport type { ComponentLike } from '@glint/template';\nimport type { HdsTabsTabSignature } from './tab';\nimport type { HdsTabsPanelSignature } from './panel';\nimport type { HdsTabsTabIds, HdsTabsPanelIds, HdsTabsSizes } from './types.ts';\n\nexport const DEFAULT_SIZE: HdsTabsSizes = 'medium' as const;\nexport const SIZES: HdsTabsSizes[] = Object.values(HdsTabsSizeValues);\ninterface HdsTabsSignature {\n  Args: {\n    size?: HdsTabsSizes;\n    onClickTab?: (event: MouseEvent, tabIndex: number) => void;\n    selectedTabIndex?: HdsTabsTabSignature['Args']['selectedTabIndex'];\n    isParentVisible?: boolean;\n  };\n  Blocks: {\n    default: [\n      {\n        Tab?: ComponentLike<HdsTabsTabSignature>;\n        Panel?: ComponentLike<HdsTabsPanelSignature>;\n      },\n    ];\n  };\n  Element: HTMLDivElement;\n}\n\nexport default class HdsTabs extends Component<HdsTabsSignature> {\n  @tracked tabNodes: HTMLButtonElement[] = [];\n  @tracked tabIds: HdsTabsTabIds = [];\n  @tracked panelNodes: HTMLElement[] = [];\n  @tracked panelIds: HdsTabsPanelIds = [];\n  @tracked _selectedTabIndex = this.args.selectedTabIndex ?? 0;\n  @tracked selectedTabId?: string;\n  @tracked isControlled: boolean;\n\n  /**\n   * Sets the size of Tabs\n   * Accepted values: medium, large\n   *\n   * @param size\n   * @type {string}\n   * @default 'medium'\n   */\n  get size(): HdsTabsSizes {\n    const { size = DEFAULT_SIZE } = this.args;\n\n    assert(\n      `@size for \"Hds::Tabs\" must be one of the following: ${SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  constructor(owner: unknown, args: HdsTabsSignature['Args']) {\n    super(owner, args);\n\n    // this is to determine if the \"selected\" tab logic is controlled in the consumers' code or is maintained as an internal state\n    this.isControlled = this.args.selectedTabIndex !== undefined;\n  }\n\n  get selectedTabIndex(): number {\n    if (this.isControlled) {\n      return this.args.selectedTabIndex!;\n    } else {\n      return this._selectedTabIndex;\n    }\n  }\n\n  set selectedTabIndex(value) {\n    if (this.isControlled) {\n      // noop\n    } else {\n      this._selectedTabIndex = value;\n    }\n  }\n\n  /**\n   * Get the class names to apply to the component.\n   * @method classNames\n   * @return {string} The \"class\" attribute to apply to the component.\n   */\n  get classNames(): string {\n    const classes = ['hds-tabs'];\n\n    // add a class based on the @size argument\n    classes.push(`hds-tabs--size-${this.size}`);\n\n    return classes.join(' ');\n  }\n\n  @action\n  didInsert(): void {\n    assert(\n      'The number of Tabs must be equal to the number of Panels',\n      this.tabNodes.length === this.panelNodes.length\n    );\n\n    if (this.selectedTabId) {\n      this.selectedTabIndex = this.tabIds.indexOf(this.selectedTabId);\n    }\n\n    schedule('afterRender', (): void => {\n      this.setTabIndicator();\n    });\n  }\n\n  @action\n  didUpdateSelectedTabIndex(): void {\n    schedule('afterRender', (): void => {\n      this.setTabIndicator();\n    });\n  }\n\n  @action\n  didUpdateSelectedTabId(): void {\n    // if the selected tab is set dynamically (eg. in a `each` loop)\n    // the `Tab` nodes will be re-inserted/rendered, which means the `this.selectedTabId` variable changes\n    // but the parent `Tabs` component has already been rendered/inserted but doesn't re-render\n    // so the value of the `selectedTabIndex` is not updated, unless we trigger a recalculation\n    // using the `did-update` modifier that checks for changes in the `this.selectedTabId` variable\n    if (this.selectedTabId) {\n      this.selectedTabIndex = this.tabIds.indexOf(this.selectedTabId);\n    }\n  }\n\n  @action\n  didUpdateParentVisibility(): void {\n    schedule('afterRender', (): void => {\n      this.setTabIndicator();\n    });\n  }\n\n  @action\n  didInsertTab(element: HTMLButtonElement, isSelected?: boolean): void {\n    this.tabNodes = [...this.tabNodes, element];\n    this.tabIds = [...this.tabIds, element.id];\n    if (isSelected) {\n      this.selectedTabId = element.id;\n    }\n  }\n\n  @action\n  didUpdateTab(tabIndex: number, isSelected?: boolean): void {\n    if (isSelected) {\n      this.selectedTabIndex = tabIndex;\n    }\n    this.setTabIndicator();\n  }\n\n  @action\n  willDestroyTab(element: HTMLButtonElement): void {\n    this.tabNodes = this.tabNodes.filter(\n      (node): boolean => node.id !== element.id\n    );\n    this.tabIds = this.tabIds.filter((tabId): boolean => tabId !== element.id);\n  }\n\n  @action\n  didInsertPanel(element: HTMLElement, panelId: string): void {\n    this.panelNodes = [...this.panelNodes, element];\n    this.panelIds = [...this.panelIds, panelId];\n  }\n\n  @action\n  willDestroyPanel(element: HTMLElement): void {\n    this.panelNodes = this.panelNodes.filter(\n      (node): boolean => node.id !== element.id\n    );\n    this.panelIds = this.panelIds.filter(\n      (panelId): boolean => panelId !== element.id\n    );\n  }\n\n  @action\n  onClick(event: MouseEvent, tabIndex: number): void {\n    this.selectedTabIndex = tabIndex;\n    this.setTabIndicator();\n\n    // invoke the callback function if it's provided as argument\n    if (typeof this.args.onClickTab === 'function') {\n      this.args.onClickTab(event, tabIndex);\n    }\n  }\n\n  @action\n  onKeyUp(tabIndex: number, event: KeyboardEvent): void {\n    const leftArrow = 'ArrowLeft';\n    const rightArrow = 'ArrowRight';\n    const enterKey = 'Enter';\n    const spaceKey = ' ';\n\n    if (event.key === rightArrow) {\n      const nextTabIndex = (tabIndex + 1) % this.tabIds.length;\n      this.focusTab(nextTabIndex, event);\n    } else if (event.key === leftArrow) {\n      const prevTabIndex =\n        (tabIndex + this.tabIds.length - 1) % this.tabIds.length;\n      this.focusTab(prevTabIndex, event);\n    } else if (event.key === enterKey || event.key === spaceKey) {\n      this.selectedTabIndex = tabIndex;\n    }\n    // scroll selected tab into view (it may be out of view when activated using a keyboard with `prev/next`)\n    const parentNode = this.tabNodes[this.selectedTabIndex]?.parentNode;\n    if (parentNode instanceof HTMLElement) {\n      parentNode.scrollIntoView({\n        behavior: 'smooth',\n        block: 'nearest',\n        inline: 'nearest',\n      });\n    }\n  }\n\n  // Focus tab for keyboard & mouse navigation:\n  focusTab(tabIndex: number, event: KeyboardEvent): void {\n    event.preventDefault();\n    this.tabNodes[tabIndex]?.focus();\n  }\n\n  setTabIndicator(): void {\n    next((): void => {\n      const tabElem = this.tabNodes[this.selectedTabIndex];\n\n      if (tabElem != null) {\n        const tabElemParentNode = tabElem.parentNode as HTMLElement;\n        const tabsElemClosestList = tabElem.closest(\n          '.hds-tabs__tablist'\n        ) as HTMLElement;\n\n        // this condition is `null` if any of the parents has `display: none`\n        if (tabElemParentNode.offsetParent) {\n          const tabLeftPos = tabElemParentNode.offsetLeft;\n          const tabWidth = tabElemParentNode.offsetWidth;\n\n          // Set CSS custom properties for indicator\n          tabsElemClosestList.style.setProperty(\n            '--indicator-left-pos',\n            tabLeftPos + 'px'\n          );\n          tabsElemClosestList.style.setProperty(\n            '--indicator-width',\n            tabWidth + 'px'\n          );\n        }\n      } else {\n        let message = '';\n        message +=\n          '\"Hds::Tabs\" has tried to set the indicator for an element that doesn\\'t exist';\n        if (this.tabNodes.length === 0) {\n          message +=\n            ' (the array `this.tabNodes` is empty, there are no tabs, probably already destroyed)';\n        } else {\n          message += ` (the value ${\n            this.selectedTabIndex\n          } of \\`this.selectedTabIndex\\` is out of bound for the array \\`this.tabNodes\\`, whose index range is [0 - ${\n            this.tabNodes.length - 1\n          }])`;\n        }\n        // https://api.emberjs.com/ember/5.3/classes/@ember%2Fdebug/methods/warn?anchor=warn\n        warn(message, true, {\n          id: 'hds-debug.tabs.setTabIndicator-tabElem-not-available',\n        });\n      }\n    });\n  }\n}\n"],"names":["DEFAULT_SIZE","SIZES","Object","values","HdsTabsSizeValues","HdsTabs","_class","Component","size","args","assert","join","includes","constructor","owner","_initializerDefineProperty","_descriptor","_descriptor2","_descriptor3","_descriptor4","_descriptor5","_descriptor6","_descriptor7","isControlled","selectedTabIndex","undefined","_selectedTabIndex","value","classNames","classes","push","didInsert","tabNodes","length","panelNodes","selectedTabId","tabIds","indexOf","schedule","setTabIndicator","didUpdateSelectedTabIndex","didUpdateSelectedTabId","didUpdateParentVisibility","didInsertTab","element","isSelected","id","didUpdateTab","tabIndex","willDestroyTab","filter","node","tabId","didInsertPanel","panelId","panelIds","willDestroyPanel","onClick","event","onClickTab","onKeyUp","leftArrow","rightArrow","enterKey","spaceKey","key","nextTabIndex","focusTab","prevTabIndex","parentNode","HTMLElement","scrollIntoView","behavior","block","inline","preventDefault","focus","next","tabElem","tabElemParentNode","tabsElemClosestList","closest","offsetParent","tabLeftPos","offsetLeft","tabWidth","offsetWidth","style","setProperty","message","warn","_applyDecoratedDescriptor","prototype","tracked","configurable","enumerable","writable","initializer","action","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/hds/tabs/index.hbs","../../../../src/components/hds/tabs/index.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n{{! template-lint-disable no-invalid-role }}\\n<div\\n  class={{this.classNames}}\\n  {{did-insert this.didInsert}}\\n  {{did-update this.didUpdateSelectedTabIndex this.selectedTabIndex}}\\n  {{did-update this.didUpdateSelectedTabId this.selectedTabId}}\\n  {{did-update this.didUpdateParentVisibility @isParentVisible}}\\n  ...attributes\\n>\\n  <div class=\\\"hds-tabs__tablist-wrapper\\\">\\n    <ul class=\\\"hds-tabs__tablist\\\" role=\\\"tablist\\\">\\n      {{yield\\n        (hash\\n          Tab=(component\\n            \\\"hds/tabs/tab\\\"\\n            didInsertNode=this.didInsertTab\\n            didUpdateNode=this.didUpdateTab\\n            willDestroyNode=this.willDestroyTab\\n            tabIds=this.tabIds\\n            selectedTabIndex=this.selectedTabIndex\\n            onClick=this.onClick\\n            onKeyUp=this.onKeyUp\\n          )\\n        )\\n      }}\\n      <li class=\\\"hds-tabs__tab-indicator\\\" role=\\\"presentation\\\"></li>\\n    </ul>\\n  </div>\\n\\n  {{yield\\n    (hash\\n      Panel=(component\\n        \\\"hds/tabs/panel\\\"\\n        didInsertNode=this.didInsertPanel\\n        willDestroyNode=this.willDestroyPanel\\n        tabIds=this.tabIds\\n        panelIds=this.panelIds\\n        selectedTabIndex=this.selectedTabIndex\\n      )\\n    )\\n  }}\\n</div>\\n{{! template-lint-enable no-invalid-role }}\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { assert, warn } from '@ember/debug';\nimport { next, schedule } from '@ember/runloop';\nimport { HdsTabsSizeValues } from './types.ts';\nimport type { ComponentLike } from '@glint/template';\nimport type { HdsTabsTabSignature } from './tab';\nimport type { HdsTabsPanelSignature } from './panel';\nimport type { HdsTabsTabIds, HdsTabsPanelIds, HdsTabsSizes } from './types.ts';\n\nexport const DEFAULT_SIZE: HdsTabsSizes = 'medium' as const;\nexport const SIZES: HdsTabsSizes[] = Object.values(HdsTabsSizeValues);\ninterface HdsTabsSignature {\n  Args: {\n    size?: HdsTabsSizes;\n    onClickTab?: (event: MouseEvent, tabIndex: number) => void;\n    selectedTabIndex?: HdsTabsTabSignature['Args']['selectedTabIndex'];\n    isParentVisible?: boolean;\n  };\n  Blocks: {\n    default: [\n      {\n        Tab?: ComponentLike<HdsTabsTabSignature>;\n        Panel?: ComponentLike<HdsTabsPanelSignature>;\n      },\n    ];\n  };\n  Element: HTMLDivElement;\n}\n\nexport default class HdsTabs extends Component<HdsTabsSignature> {\n  @tracked tabNodes: HTMLButtonElement[] = [];\n  @tracked tabIds: HdsTabsTabIds = [];\n  @tracked panelNodes: HTMLElement[] = [];\n  @tracked panelIds: HdsTabsPanelIds = [];\n  @tracked _selectedTabIndex = this.args.selectedTabIndex ?? 0;\n  @tracked selectedTabId?: string;\n  @tracked isControlled: boolean;\n\n  /**\n   * Sets the size of Tabs\n   * Accepted values: medium, large\n   *\n   * @param size\n   * @type {string}\n   * @default 'medium'\n   */\n  get size(): HdsTabsSizes {\n    const { size = DEFAULT_SIZE } = this.args;\n\n    assert(\n      `@size for \"Hds::Tabs\" must be one of the following: ${SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  constructor(owner: unknown, args: HdsTabsSignature['Args']) {\n    super(owner, args);\n\n    // this is to determine if the \"selected\" tab logic is controlled in the consumers' code or is maintained as an internal state\n    this.isControlled = this.args.selectedTabIndex !== undefined;\n  }\n\n  get selectedTabIndex(): number {\n    if (this.isControlled) {\n      return this.args.selectedTabIndex!;\n    } else {\n      return this._selectedTabIndex;\n    }\n  }\n\n  set selectedTabIndex(value) {\n    if (this.isControlled) {\n      // noop\n    } else {\n      this._selectedTabIndex = value;\n    }\n  }\n\n  /**\n   * Get the class names to apply to the component.\n   * @method classNames\n   * @return {string} The \"class\" attribute to apply to the component.\n   */\n  get classNames(): string {\n    const classes = ['hds-tabs'];\n\n    // add a class based on the @size argument\n    classes.push(`hds-tabs--size-${this.size}`);\n\n    return classes.join(' ');\n  }\n\n  @action\n  didInsert(): void {\n    assert(\n      'The number of Tabs must be equal to the number of Panels',\n      this.tabNodes.length === this.panelNodes.length\n    );\n\n    if (this.selectedTabId) {\n      this.selectedTabIndex = this.tabIds.indexOf(this.selectedTabId);\n    }\n\n    // eslint-disable-next-line ember/no-runloop\n    schedule('afterRender', (): void => {\n      this.setTabIndicator();\n    });\n  }\n\n  @action\n  didUpdateSelectedTabIndex(): void {\n    // eslint-disable-next-line ember/no-runloop\n    schedule('afterRender', (): void => {\n      this.setTabIndicator();\n    });\n  }\n\n  @action\n  didUpdateSelectedTabId(): void {\n    // if the selected tab is set dynamically (eg. in a `each` loop)\n    // the `Tab` nodes will be re-inserted/rendered, which means the `this.selectedTabId` variable changes\n    // but the parent `Tabs` component has already been rendered/inserted but doesn't re-render\n    // so the value of the `selectedTabIndex` is not updated, unless we trigger a recalculation\n    // using the `did-update` modifier that checks for changes in the `this.selectedTabId` variable\n    if (this.selectedTabId) {\n      this.selectedTabIndex = this.tabIds.indexOf(this.selectedTabId);\n    }\n  }\n\n  @action\n  didUpdateParentVisibility(): void {\n    // eslint-disable-next-line ember/no-runloop\n    schedule('afterRender', (): void => {\n      this.setTabIndicator();\n    });\n  }\n\n  @action\n  didInsertTab(element: HTMLButtonElement, isSelected?: boolean): void {\n    this.tabNodes = [...this.tabNodes, element];\n    this.tabIds = [...this.tabIds, element.id];\n    if (isSelected) {\n      this.selectedTabId = element.id;\n    }\n  }\n\n  @action\n  didUpdateTab(tabIndex: number, isSelected?: boolean): void {\n    if (isSelected) {\n      this.selectedTabIndex = tabIndex;\n    }\n    this.setTabIndicator();\n  }\n\n  @action\n  willDestroyTab(element: HTMLButtonElement): void {\n    this.tabNodes = this.tabNodes.filter(\n      (node): boolean => node.id !== element.id\n    );\n    this.tabIds = this.tabIds.filter((tabId): boolean => tabId !== element.id);\n  }\n\n  @action\n  didInsertPanel(element: HTMLElement, panelId: string): void {\n    this.panelNodes = [...this.panelNodes, element];\n    this.panelIds = [...this.panelIds, panelId];\n  }\n\n  @action\n  willDestroyPanel(element: HTMLElement): void {\n    this.panelNodes = this.panelNodes.filter(\n      (node): boolean => node.id !== element.id\n    );\n    this.panelIds = this.panelIds.filter(\n      (panelId): boolean => panelId !== element.id\n    );\n  }\n\n  @action\n  onClick(event: MouseEvent, tabIndex: number): void {\n    this.selectedTabIndex = tabIndex;\n    this.setTabIndicator();\n\n    // invoke the callback function if it's provided as argument\n    if (typeof this.args.onClickTab === 'function') {\n      this.args.onClickTab(event, tabIndex);\n    }\n  }\n\n  @action\n  onKeyUp(tabIndex: number, event: KeyboardEvent): void {\n    const leftArrow = 'ArrowLeft';\n    const rightArrow = 'ArrowRight';\n    const enterKey = 'Enter';\n    const spaceKey = ' ';\n\n    if (event.key === rightArrow) {\n      const nextTabIndex = (tabIndex + 1) % this.tabIds.length;\n      this.focusTab(nextTabIndex, event);\n    } else if (event.key === leftArrow) {\n      const prevTabIndex =\n        (tabIndex + this.tabIds.length - 1) % this.tabIds.length;\n      this.focusTab(prevTabIndex, event);\n    } else if (event.key === enterKey || event.key === spaceKey) {\n      this.selectedTabIndex = tabIndex;\n    }\n    // scroll selected tab into view (it may be out of view when activated using a keyboard with `prev/next`)\n    const parentNode = this.tabNodes[this.selectedTabIndex]?.parentNode;\n    if (parentNode instanceof HTMLElement) {\n      parentNode.scrollIntoView({\n        behavior: 'smooth',\n        block: 'nearest',\n        inline: 'nearest',\n      });\n    }\n  }\n\n  // Focus tab for keyboard & mouse navigation:\n  focusTab(tabIndex: number, event: KeyboardEvent): void {\n    event.preventDefault();\n    this.tabNodes[tabIndex]?.focus();\n  }\n\n  setTabIndicator(): void {\n    // eslint-disable-next-line ember/no-runloop\n    next((): void => {\n      const tabElem = this.tabNodes[this.selectedTabIndex];\n\n      if (tabElem != null) {\n        const tabElemParentNode = tabElem.parentNode as HTMLElement;\n        const tabsElemClosestList = tabElem.closest(\n          '.hds-tabs__tablist'\n        ) as HTMLElement;\n\n        // this condition is `null` if any of the parents has `display: none`\n        if (tabElemParentNode.offsetParent) {\n          const tabLeftPos = tabElemParentNode.offsetLeft;\n          const tabWidth = tabElemParentNode.offsetWidth;\n\n          // Set CSS custom properties for indicator\n          tabsElemClosestList.style.setProperty(\n            '--indicator-left-pos',\n            tabLeftPos + 'px'\n          );\n          tabsElemClosestList.style.setProperty(\n            '--indicator-width',\n            tabWidth + 'px'\n          );\n        }\n      } else {\n        let message = '';\n        message +=\n          '\"Hds::Tabs\" has tried to set the indicator for an element that doesn\\'t exist';\n        if (this.tabNodes.length === 0) {\n          message +=\n            ' (the array `this.tabNodes` is empty, there are no tabs, probably already destroyed)';\n        } else {\n          message += ` (the value ${\n            this.selectedTabIndex\n          } of \\`this.selectedTabIndex\\` is out of bound for the array \\`this.tabNodes\\`, whose index range is [0 - ${\n            this.tabNodes.length - 1\n          }])`;\n        }\n        // https://api.emberjs.com/ember/5.3/classes/@ember%2Fdebug/methods/warn?anchor=warn\n        warn(message, true, {\n          id: 'hds-debug.tabs.setTabIndicator-tabElem-not-available',\n        });\n      }\n    });\n  }\n}\n"],"names":["DEFAULT_SIZE","SIZES","Object","values","HdsTabsSizeValues","HdsTabs","_class","Component","size","args","assert","join","includes","constructor","owner","_initializerDefineProperty","_descriptor","_descriptor2","_descriptor3","_descriptor4","_descriptor5","_descriptor6","_descriptor7","isControlled","selectedTabIndex","undefined","_selectedTabIndex","value","classNames","classes","push","didInsert","tabNodes","length","panelNodes","selectedTabId","tabIds","indexOf","schedule","setTabIndicator","didUpdateSelectedTabIndex","didUpdateSelectedTabId","didUpdateParentVisibility","didInsertTab","element","isSelected","id","didUpdateTab","tabIndex","willDestroyTab","filter","node","tabId","didInsertPanel","panelId","panelIds","willDestroyPanel","onClick","event","onClickTab","onKeyUp","leftArrow","rightArrow","enterKey","spaceKey","key","nextTabIndex","focusTab","prevTabIndex","parentNode","HTMLElement","scrollIntoView","behavior","block","inline","preventDefault","focus","next","tabElem","tabElemParentNode","tabsElemClosestList","closest","offsetParent","tabLeftPos","offsetLeft","tabWidth","offsetWidth","style","setProperty","message","warn","_applyDecoratedDescriptor","prototype","tracked","configurable","enumerable","writable","initializer","action","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":"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"}

package/dist/components/hds/tabs/panel.js

@@ -35,7 +35,7 @@ let HdsTabsPanel = (_class = class HdsTabsPanel extends Component {
    * @returns string}
    */
   get coupledTabId() {
-    return this.nodeIndex !== undefined ? this.args.tabIds[this.nodeIndex] : undefined;
+    return this.nodeIndex !== undefined ? this.args.tabIds?.[this.nodeIndex] : undefined;
   }
   didInsertNode(element) {
     const {

package/dist/components/hds/tabs/panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"panel.js","sources":["../../../../src/components/hds/tabs/panel.hbs","../../../../src/components/hds/tabs/panel.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n<section\\n  class=\\\"hds-tabs__panel\\\"\\n  ...attributes\\n  role=\\\"tabpanel\\\"\\n  id={{this.panelId}}\\n  hidden={{not this.isVisible}}\\n  aria-labelledby={{this.coupledTabId}}\\n  {{did-insert this.didInsertNode}}\\n  {{will-destroy this.willDestroyNode}}\\n>\\n  {{yield (hash isVisible=this.isVisible)}}\\n</section>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { guidFor } from '@ember/object/internals';\nimport { action } from '@ember/object';\nimport type { HdsTabsTabSignature } from './tab';\nimport type { HdsTabsPanelIds, HdsTabsTabIds } from './types';\n\nexport interface HdsTabsPanelSignature {\n  Args: {\n    tabIds: HdsTabsTabIds;\n    panelIds: HdsTabsPanelIds;\n    selectedTabIndex: HdsTabsTabSignature['Args']['selectedTabIndex'];\n    didInsertNode: (element: HTMLElement, elementId: string) => void;\n    willDestroyNode: (element: HTMLElement) => void;\n  };\n  Blocks: {\n    default: [\n      {\n        isVisible: boolean;\n      },\n    ];\n  };\n  Element: HTMLElement;\n}\n\nexport default class HdsTabsPanel extends Component<HdsTabsPanelSignature> {\n  /**\n   * Generate a unique ID for the Panel\n   * @return {string}\n   */\n  panelId = 'panel-' + guidFor(this);\n\n  elementId?: string;\n\n  get nodeIndex(): number | undefined {\n    return this.args.panelIds\n      ? this.args.panelIds.indexOf(this.panelId)\n      : undefined;\n  }\n\n  /**\n   * Check the condition if the panel is visible (because the coupled/associated tab is selected) or not\n   * @returns {boolean}\n   */\n  get isVisible(): boolean {\n    return this.nodeIndex === this.args.selectedTabIndex;\n  }\n\n  /**\n   * Get the ID of the tab coupled/associated with the panel (it's used by the `aria-labelledby` attribute)\n   * @returns string}\n   */\n  get coupledTabId(): string | undefined {\n    return this.nodeIndex !== undefined\n      ? this.args.tabIds[this.nodeIndex]\n      : undefined;\n  }\n\n  @action\n  didInsertNode(element: HTMLElement): void {\n    const { didInsertNode } = this.args;\n\n    if (typeof didInsertNode === 'function') {\n      this.elementId = element.id;\n      didInsertNode(element, this.elementId);\n    }\n  }\n\n  @action\n  willDestroyNode(element: HTMLElement): void {\n    const { willDestroyNode } = this.args;\n\n    if (typeof willDestroyNode === 'function') {\n      willDestroyNode(element);\n    }\n  }\n}\n"],"names":["HdsTabsPanel","_class","Component","constructor","args","_defineProperty","guidFor","nodeIndex","panelIds","indexOf","panelId","undefined","isVisible","selectedTabIndex","coupledTabId","tabIds","didInsertNode","element","elementId","id","willDestroyNode","_applyDecoratedDescriptor","prototype","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;AACA,eAAe,kBAAkB,CAAC,sYAAsY;;;AC4BnZA,IAAAA,YAAY,IAAAC,MAAA,GAAlB,MAAMD,YAAY,SAASE,SAAS,CAAwB;AAAAC,EAAAA,WAAAA,CAAA,GAAAC,IAAA,EAAA;AAAA,IAAA,KAAA,CAAA,GAAAA,IAAA,CAAA,CAAA;AACzE;AACF;AACA;AACA;AAHEC,IAAAA,eAAA,kBAIU,QAAQ,GAAGC,OAAO,CAAC,IAAI,CAAC,CAAA,CAAA;IAAAD,eAAA,CAAA,IAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAAA,GAAA;EAIlC,IAAIE,SAASA,GAAuB;AAClC,IAAA,OAAO,IAAI,CAACH,IAAI,CAACI,QAAQ,GACrB,IAAI,CAACJ,IAAI,CAACI,QAAQ,CAACC,OAAO,CAAC,IAAI,CAACC,OAAO,CAAC,GACxCC,SAAS,CAAA;AACf,GAAA;;AAEA;AACF;AACA;AACA;EACE,IAAIC,SAASA,GAAY;IACvB,OAAO,IAAI,CAACL,SAAS,KAAK,IAAI,CAACH,IAAI,CAACS,gBAAgB,CAAA;AACtD,GAAA;;AAEA;AACF;AACA;AACA;EACE,IAAIC,YAAYA,GAAuB;AACrC,IAAA,OAAO,IAAI,CAACP,SAAS,KAAKI,SAAS,GAC/B,IAAI,CAACP,IAAI,CAACW,MAAM,CAAC,IAAI,CAACR,SAAS,CAAC,GAChCI,SAAS,CAAA;AACf,GAAA;EAGAK,aAAaA,CAACC,OAAoB,EAAQ;IACxC,MAAM;AAAED,MAAAA,aAAAA;KAAe,GAAG,IAAI,CAACZ,IAAI,CAAA;AAEnC,IAAA,IAAI,OAAOY,aAAa,KAAK,UAAU,EAAE;AACvC,MAAA,IAAI,CAACE,SAAS,GAAGD,OAAO,CAACE,EAAE,CAAA;AAC3BH,MAAAA,aAAa,CAACC,OAAO,EAAE,IAAI,CAACC,SAAS,CAAC,CAAA;AACxC,KAAA;AACF,GAAA;EAGAE,eAAeA,CAACH,OAAoB,EAAQ;IAC1C,MAAM;AAAEG,MAAAA,eAAAA;KAAiB,GAAG,IAAI,CAAChB,IAAI,CAAA;AAErC,IAAA,IAAI,OAAOgB,eAAe,KAAK,UAAU,EAAE;MACzCA,eAAe,CAACH,OAAO,CAAC,CAAA;AAC1B,KAAA;AACF,GAAA;AACF,CAAC,GAAAI,yBAAA,CAAApB,MAAA,CAAAqB,SAAA,oBAlBEC,MAAM,CAAA,EAAAC,MAAA,CAAAC,wBAAA,CAAAxB,MAAA,CAAAqB,SAAA,EAAA,eAAA,CAAA,EAAArB,MAAA,CAAAqB,SAAA,CAAAD,EAAAA,yBAAA,CAAApB,MAAA,CAAAqB,SAAA,EAUNC,iBAAAA,EAAAA,CAAAA,MAAM,GAAAC,MAAA,CAAAC,wBAAA,CAAAxB,MAAA,CAAAqB,SAAA,EAAA,iBAAA,CAAA,EAAArB,MAAA,CAAAqB,SAAA,IAAArB,MAAA,EAAA;AA3CwByB,oBAAA,CAAAC,QAAA,EAAZ3B,YAAY,CAAA;;;;"}
+{"version":3,"file":"panel.js","sources":["../../../../src/components/hds/tabs/panel.hbs","../../../../src/components/hds/tabs/panel.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n<section\\n  class=\\\"hds-tabs__panel\\\"\\n  ...attributes\\n  role=\\\"tabpanel\\\"\\n  id={{this.panelId}}\\n  hidden={{not this.isVisible}}\\n  aria-labelledby={{this.coupledTabId}}\\n  {{did-insert this.didInsertNode}}\\n  {{will-destroy this.willDestroyNode}}\\n>\\n  {{yield (hash isVisible=this.isVisible)}}\\n</section>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { guidFor } from '@ember/object/internals';\nimport { action } from '@ember/object';\nimport type { HdsTabsTabSignature } from './tab';\nimport type { HdsTabsPanelIds, HdsTabsTabIds } from './types';\n\nexport interface HdsTabsPanelSignature {\n  Args: {\n    tabIds?: HdsTabsTabIds;\n    panelIds?: HdsTabsPanelIds;\n    selectedTabIndex?: HdsTabsTabSignature['Args']['selectedTabIndex'];\n    didInsertNode?: (element: HTMLElement, elementId: string) => void;\n    willDestroyNode?: (element: HTMLElement) => void;\n  };\n  Blocks: {\n    default: [\n      {\n        isVisible?: boolean;\n      },\n    ];\n  };\n  Element: HTMLElement;\n}\n\nexport default class HdsTabsPanel extends Component<HdsTabsPanelSignature> {\n  /**\n   * Generate a unique ID for the Panel\n   * @return {string}\n   */\n  panelId = 'panel-' + guidFor(this);\n\n  elementId?: string;\n\n  get nodeIndex(): number | undefined {\n    return this.args.panelIds\n      ? this.args.panelIds.indexOf(this.panelId)\n      : undefined;\n  }\n\n  /**\n   * Check the condition if the panel is visible (because the coupled/associated tab is selected) or not\n   * @returns {boolean}\n   */\n  get isVisible(): boolean {\n    return this.nodeIndex === this.args.selectedTabIndex;\n  }\n\n  /**\n   * Get the ID of the tab coupled/associated with the panel (it's used by the `aria-labelledby` attribute)\n   * @returns string}\n   */\n  get coupledTabId(): string | undefined {\n    return this.nodeIndex !== undefined\n      ? this.args.tabIds?.[this.nodeIndex]\n      : undefined;\n  }\n\n  @action\n  didInsertNode(element: HTMLElement): void {\n    const { didInsertNode } = this.args;\n\n    if (typeof didInsertNode === 'function') {\n      this.elementId = element.id;\n      didInsertNode(element, this.elementId);\n    }\n  }\n\n  @action\n  willDestroyNode(element: HTMLElement): void {\n    const { willDestroyNode } = this.args;\n\n    if (typeof willDestroyNode === 'function') {\n      willDestroyNode(element);\n    }\n  }\n}\n"],"names":["HdsTabsPanel","_class","Component","constructor","args","_defineProperty","guidFor","nodeIndex","panelIds","indexOf","panelId","undefined","isVisible","selectedTabIndex","coupledTabId","tabIds","didInsertNode","element","elementId","id","willDestroyNode","_applyDecoratedDescriptor","prototype","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;AACA,eAAe,kBAAkB,CAAC,sYAAsY;;;AC4BnZA,IAAAA,YAAY,IAAAC,MAAA,GAAlB,MAAMD,YAAY,SAASE,SAAS,CAAwB;AAAAC,EAAAA,WAAAA,CAAA,GAAAC,IAAA,EAAA;AAAA,IAAA,KAAA,CAAA,GAAAA,IAAA,CAAA,CAAA;AACzE;AACF;AACA;AACA;AAHEC,IAAAA,eAAA,kBAIU,QAAQ,GAAGC,OAAO,CAAC,IAAI,CAAC,CAAA,CAAA;IAAAD,eAAA,CAAA,IAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAAA,GAAA;EAIlC,IAAIE,SAASA,GAAuB;AAClC,IAAA,OAAO,IAAI,CAACH,IAAI,CAACI,QAAQ,GACrB,IAAI,CAACJ,IAAI,CAACI,QAAQ,CAACC,OAAO,CAAC,IAAI,CAACC,OAAO,CAAC,GACxCC,SAAS,CAAA;AACf,GAAA;;AAEA;AACF;AACA;AACA;EACE,IAAIC,SAASA,GAAY;IACvB,OAAO,IAAI,CAACL,SAAS,KAAK,IAAI,CAACH,IAAI,CAACS,gBAAgB,CAAA;AACtD,GAAA;;AAEA;AACF;AACA;AACA;EACE,IAAIC,YAAYA,GAAuB;AACrC,IAAA,OAAO,IAAI,CAACP,SAAS,KAAKI,SAAS,GAC/B,IAAI,CAACP,IAAI,CAACW,MAAM,GAAG,IAAI,CAACR,SAAS,CAAC,GAClCI,SAAS,CAAA;AACf,GAAA;EAGAK,aAAaA,CAACC,OAAoB,EAAQ;IACxC,MAAM;AAAED,MAAAA,aAAAA;KAAe,GAAG,IAAI,CAACZ,IAAI,CAAA;AAEnC,IAAA,IAAI,OAAOY,aAAa,KAAK,UAAU,EAAE;AACvC,MAAA,IAAI,CAACE,SAAS,GAAGD,OAAO,CAACE,EAAE,CAAA;AAC3BH,MAAAA,aAAa,CAACC,OAAO,EAAE,IAAI,CAACC,SAAS,CAAC,CAAA;AACxC,KAAA;AACF,GAAA;EAGAE,eAAeA,CAACH,OAAoB,EAAQ;IAC1C,MAAM;AAAEG,MAAAA,eAAAA;KAAiB,GAAG,IAAI,CAAChB,IAAI,CAAA;AAErC,IAAA,IAAI,OAAOgB,eAAe,KAAK,UAAU,EAAE;MACzCA,eAAe,CAACH,OAAO,CAAC,CAAA;AAC1B,KAAA;AACF,GAAA;AACF,CAAC,GAAAI,yBAAA,CAAApB,MAAA,CAAAqB,SAAA,oBAlBEC,MAAM,CAAA,EAAAC,MAAA,CAAAC,wBAAA,CAAAxB,MAAA,CAAAqB,SAAA,EAAA,eAAA,CAAA,EAAArB,MAAA,CAAAqB,SAAA,CAAAD,EAAAA,yBAAA,CAAApB,MAAA,CAAAqB,SAAA,EAUNC,iBAAAA,EAAAA,CAAAA,MAAM,GAAAC,MAAA,CAAAC,wBAAA,CAAAxB,MAAA,CAAAqB,SAAA,EAAA,iBAAA,CAAA,EAAArB,MAAA,CAAAqB,SAAA,IAAArB,MAAA,EAAA;AA3CwByB,oBAAA,CAAAC,QAAA,EAAZ3B,YAAY,CAAA;;;;"}

package/dist/components/hds/tabs/tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.js","sources":["../../../../src/components/hds/tabs/tab.hbs","../../../../src/components/hds/tabs/tab.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n{{! template-lint-disable require-context-role no-invalid-role }}\\n<li class={{this.classNames}} ...attributes role=\\\"presentation\\\">\\n  <button\\n    class=\\\"hds-tabs__tab-button\\\"\\n    role=\\\"tab\\\"\\n    type=\\\"button\\\"\\n    id={{this.tabId}}\\n    aria-selected={{if this.isSelected \\\"true\\\" \\\"false\\\"}}\\n    tabindex={{unless this.isSelected \\\"-1\\\"}}\\n    {{did-insert this.didInsertNode @isSelected}}\\n    {{did-update this.didUpdateNode @count @isSelected}}\\n    {{will-destroy this.willDestroyNode}}\\n    {{on \\\"click\\\" this.onClick}}\\n    {{on \\\"keyup\\\" this.onKeyUp}}\\n  >\\n    {{#if @icon}}\\n      <Hds::Icon @name={{@icon}} class=\\\"hds-tabs__tab-icon\\\" role=\\\"presentation\\\" />\\n    {{/if}}\\n\\n    {{yield}}\\n\\n    {{#if @count}}\\n      <Hds::BadgeCount @text={{@count}} @size=\\\"small\\\" class=\\\"hds-tabs__tab-count\\\" role=\\\"presentation\\\" />\\n    {{/if}}\\n  </button>\\n</li>\\n{{! template-lint-enable require-context-role no-invalid-role }}\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { guidFor } from '@ember/object/internals';\nimport { action } from '@ember/object';\nimport type { IconName } from '@hashicorp/flight-icons/svg';\nimport type { HdsTabsTabIds } from './types';\n\nexport interface HdsTabsTabSignature {\n  Args: {\n    tabIds: HdsTabsTabIds;\n    selectedTabIndex: number;\n    icon?: IconName;\n    count?: string;\n    isSelected?: boolean;\n    didInsertNode: (element: HTMLButtonElement, isSelected?: boolean) => void;\n    didUpdateNode: (nodeIndex: number, isSelected?: boolean) => void;\n    willDestroyNode: (element: HTMLButtonElement) => void;\n    onClick: (event: MouseEvent, tabIndex: number) => void;\n    onKeyUp: (nodeIndex: number, event: KeyboardEvent) => void;\n  };\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLLIElement;\n}\n\nexport default class HdsTabsTab extends Component<HdsTabsTabSignature> {\n  /**\n   * Generate a unique ID for the Tab\n   * @return {string}\n   */\n  tabId = 'tab-' + guidFor(this);\n\n  get nodeIndex(): number | undefined {\n    return this.args.tabIds?.indexOf(this.tabId);\n  }\n\n  /**\n   * Determine if the tab is the selected tab\n   * @return {boolean}\n   * @default false (1st tab is selected by default)\n   */\n  get isSelected(): boolean {\n    return (\n      this.nodeIndex !== undefined &&\n      this.nodeIndex === this.args.selectedTabIndex\n    );\n  }\n\n  @action\n  didInsertNode(element: HTMLButtonElement, positional: [boolean?]): void {\n    const { didInsertNode } = this.args;\n\n    const isSelected = positional[0];\n\n    if (typeof didInsertNode === 'function') {\n      didInsertNode(element, isSelected);\n    }\n  }\n\n  @action\n  didUpdateNode(): void {\n    const { didUpdateNode } = this.args;\n\n    if (typeof didUpdateNode === 'function' && this.nodeIndex !== undefined) {\n      didUpdateNode(this.nodeIndex, this.args.isSelected);\n    }\n  }\n\n  @action\n  willDestroyNode(element: HTMLButtonElement): void {\n    const { willDestroyNode } = this.args;\n\n    if (typeof willDestroyNode === 'function') {\n      willDestroyNode(element);\n    }\n  }\n\n  @action\n  onClick(event: MouseEvent): false | undefined {\n    const { onClick } = this.args;\n\n    if (typeof onClick === 'function' && this.nodeIndex !== undefined) {\n      onClick(event, this.nodeIndex);\n    } else {\n      return false;\n    }\n  }\n\n  @action\n  onKeyUp(event: KeyboardEvent): void {\n    const { onKeyUp } = this.args;\n\n    if (typeof onKeyUp === 'function' && this.nodeIndex !== undefined) {\n      onKeyUp(this.nodeIndex, event);\n    }\n  }\n\n  /**\n   * Get the class names to apply to the component.\n   * @method classNames\n   * @return {string} The \"class\" attribute to apply to the component.\n   */\n  get classNames(): string {\n    const classes = ['hds-tabs__tab'];\n\n    if (this.isSelected) {\n      classes.push(`hds-tabs__tab--is-selected`);\n    }\n\n    return classes.join(' ');\n  }\n}\n"],"names":["HdsTabsTab","_class","Component","constructor","args","_defineProperty","guidFor","nodeIndex","tabIds","indexOf","tabId","isSelected","undefined","selectedTabIndex","didInsertNode","element","positional","didUpdateNode","willDestroyNode","onClick","event","onKeyUp","classNames","classes","push","join","_applyDecoratedDescriptor","prototype","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":"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"}
+{"version":3,"file":"tab.js","sources":["../../../../src/components/hds/tabs/tab.hbs","../../../../src/components/hds/tabs/tab.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n{{! template-lint-disable require-context-role no-invalid-role }}\\n<li class={{this.classNames}} ...attributes role=\\\"presentation\\\">\\n  <button\\n    class=\\\"hds-tabs__tab-button\\\"\\n    role=\\\"tab\\\"\\n    type=\\\"button\\\"\\n    id={{this.tabId}}\\n    aria-selected={{if this.isSelected \\\"true\\\" \\\"false\\\"}}\\n    tabindex={{unless this.isSelected \\\"-1\\\"}}\\n    {{did-insert this.didInsertNode @isSelected}}\\n    {{did-update this.didUpdateNode @count @isSelected}}\\n    {{will-destroy this.willDestroyNode}}\\n    {{on \\\"click\\\" this.onClick}}\\n    {{on \\\"keyup\\\" this.onKeyUp}}\\n  >\\n    {{#if @icon}}\\n      <Hds::Icon @name={{@icon}} class=\\\"hds-tabs__tab-icon\\\" role=\\\"presentation\\\" />\\n    {{/if}}\\n\\n    {{yield}}\\n\\n    {{#if @count}}\\n      <Hds::BadgeCount @text={{@count}} @size=\\\"small\\\" class=\\\"hds-tabs__tab-count\\\" role=\\\"presentation\\\" />\\n    {{/if}}\\n  </button>\\n</li>\\n{{! template-lint-enable require-context-role no-invalid-role }}\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { guidFor } from '@ember/object/internals';\nimport { action } from '@ember/object';\nimport type { IconName } from '@hashicorp/flight-icons/svg';\nimport type { HdsTabsTabIds } from './types';\n\nexport interface HdsTabsTabSignature {\n  Args: {\n    tabIds?: HdsTabsTabIds;\n    selectedTabIndex?: number;\n    icon?: IconName;\n    count?: string;\n    isSelected?: boolean;\n    didInsertNode?: (element: HTMLButtonElement, isSelected?: boolean) => void;\n    didUpdateNode?: (nodeIndex: number, isSelected?: boolean) => void;\n    willDestroyNode?: (element: HTMLButtonElement) => void;\n    onClick?: (event: MouseEvent, tabIndex: number) => void;\n    onKeyUp?: (nodeIndex: number, event: KeyboardEvent) => void;\n  };\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLLIElement;\n}\n\nexport default class HdsTabsTab extends Component<HdsTabsTabSignature> {\n  /**\n   * Generate a unique ID for the Tab\n   * @return {string}\n   */\n  tabId = 'tab-' + guidFor(this);\n\n  get nodeIndex(): number | undefined {\n    return this.args.tabIds?.indexOf(this.tabId);\n  }\n\n  /**\n   * Determine if the tab is the selected tab\n   * @return {boolean}\n   * @default false (1st tab is selected by default)\n   */\n  get isSelected(): boolean {\n    return (\n      this.nodeIndex !== undefined &&\n      this.nodeIndex === this.args.selectedTabIndex\n    );\n  }\n\n  @action\n  didInsertNode(element: HTMLButtonElement, positional: [boolean?]): void {\n    const { didInsertNode } = this.args;\n\n    const isSelected = positional[0];\n\n    if (typeof didInsertNode === 'function') {\n      didInsertNode(element, isSelected);\n    }\n  }\n\n  @action\n  didUpdateNode(): void {\n    const { didUpdateNode } = this.args;\n\n    if (typeof didUpdateNode === 'function' && this.nodeIndex !== undefined) {\n      didUpdateNode(this.nodeIndex, this.args.isSelected);\n    }\n  }\n\n  @action\n  willDestroyNode(element: HTMLButtonElement): void {\n    const { willDestroyNode } = this.args;\n\n    if (typeof willDestroyNode === 'function') {\n      willDestroyNode(element);\n    }\n  }\n\n  @action\n  onClick(event: MouseEvent): false | undefined {\n    const { onClick } = this.args;\n\n    if (typeof onClick === 'function' && this.nodeIndex !== undefined) {\n      onClick(event, this.nodeIndex);\n    } else {\n      return false;\n    }\n  }\n\n  @action\n  onKeyUp(event: KeyboardEvent): void {\n    const { onKeyUp } = this.args;\n\n    if (typeof onKeyUp === 'function' && this.nodeIndex !== undefined) {\n      onKeyUp(this.nodeIndex, event);\n    }\n  }\n\n  /**\n   * Get the class names to apply to the component.\n   * @method classNames\n   * @return {string} The \"class\" attribute to apply to the component.\n   */\n  get classNames(): string {\n    const classes = ['hds-tabs__tab'];\n\n    if (this.isSelected) {\n      classes.push(`hds-tabs__tab--is-selected`);\n    }\n\n    return classes.join(' ');\n  }\n}\n"],"names":["HdsTabsTab","_class","Component","constructor","args","_defineProperty","guidFor","nodeIndex","tabIds","indexOf","tabId","isSelected","undefined","selectedTabIndex","didInsertNode","element","positional","didUpdateNode","willDestroyNode","onClick","event","onKeyUp","classNames","classes","push","join","_applyDecoratedDescriptor","prototype","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":"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"}

package/dist/components/hds/tooltip-button/index.js

@@ -27,11 +27,12 @@ class HdsTooltip extends Component {
   }
   get options() {
     const {
-      placement
+      placement = HdsTooltipPlacementValues.Top,
+      extraTippyOptions
     } = this.args;
     assert('@placement for "Hds::TooltipButton" must have a valid value', placement == undefined || PLACEMENTS.includes(placement));
     return {
-      ...this.args.extraTippyOptions,
+      ...(extraTippyOptions ? extraTippyOptions : {}),
       placement: placement,
       // takes array of 2 numbers (skidding, distance): array(0, 10)
       offset: this.args.offset ? this.args.offset : [0, 10]

package/dist/components/hds/tooltip-button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/hds/tooltip-button/index.hbs","../../../../src/components/hds/tooltip-button/index.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<button\\n  type=\\\"button\\\"\\n  class={{this.classNames}}\\n  {{hds-tooltip this.text options=this.options}}\\n  ...attributes\\n>{{~yield~}}</button>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\n\nimport type { Props as TippyProps } from 'tippy.js';\nimport { HdsTooltipPlacementValues } from './types.ts';\n\nexport const PLACEMENTS: string[] = Object.values(HdsTooltipPlacementValues);\n\nexport interface HdsTooltipSignature {\n  Args: {\n    extraTippyOptions: Omit<TippyProps, 'placement' | 'offset'>;\n    isInline?: boolean;\n    offset?: [number, number];\n    placement: HdsTooltipPlacementValues;\n    text: string;\n  };\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLButtonElement;\n}\n\nexport default class HdsTooltip extends Component<HdsTooltipSignature> {\n  /**\n   * @param text\n   * @type {string}\n   * @description text content for tooltip\n   */\n  get text(): string {\n    const { text } = this.args;\n\n    assert(\n      '@text for \"Hds::TooltipButton\" must have a valid value',\n      text !== undefined\n    );\n\n    return text;\n  }\n\n  get options(): TippyProps {\n    const { placement } = this.args;\n\n    assert(\n      '@placement for \"Hds::TooltipButton\" must have a valid value',\n      placement == undefined || PLACEMENTS.includes(placement)\n    );\n\n    return {\n      ...this.args.extraTippyOptions,\n      placement: placement,\n      // takes array of 2 numbers (skidding, distance): array(0, 10)\n      offset: this.args.offset ? this.args.offset : [0, 10],\n    };\n  }\n\n  /**\n   * @param isInline\n   * @type {boolean}\n   * @default true\n   * @description sets display for the button\n   */\n  get isInline(): boolean {\n    const { isInline = true } = this.args;\n    return isInline;\n  }\n\n  /**\n   * Get the class names to apply to the component.\n   * @method classNames\n   * @return {string} The \"class\" attribute to apply to the component.\n   */\n  get classNames(): string {\n    const classes = ['hds-tooltip-button'];\n\n    // add a class based on the @isInline argument\n    if (this.isInline) {\n      classes.push('hds-tooltip-button--is-inline');\n    } else {\n      classes.push('hds-tooltip-button--is-block');\n    }\n\n    return classes.join(' ');\n  }\n}\n"],"names":["PLACEMENTS","Object","values","HdsTooltipPlacementValues","HdsTooltip","Component","text","args","assert","undefined","options","placement","includes","extraTippyOptions","offset","isInline","classNames","classes","push","join","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;AACA,eAAe,kBAAkB,CAAC,mOAAmO;;ACDrQ;AACA;AACA;AACA;;AAQO,MAAMA,UAAoB,GAAGC,MAAM,CAACC,MAAM,CAACC,yBAAyB,EAAC;AAgB7D,MAAMC,UAAU,SAASC,SAAS,CAAsB;AACrE;AACF;AACA;AACA;AACA;EACE,IAAIC,IAAIA,GAAW;IACjB,MAAM;AAAEA,MAAAA,IAAAA;KAAM,GAAG,IAAI,CAACC,IAAI,CAAA;AAE1BC,IAAAA,MAAM,CACJ,wDAAwD,EACxDF,IAAI,KAAKG,SACX,CAAC,CAAA;AAED,IAAA,OAAOH,IAAI,CAAA;AACb,GAAA;EAEA,IAAII,OAAOA,GAAe;IACxB,MAAM;AAAEC,MAAAA,SAAAA;KAAW,GAAG,IAAI,CAACJ,IAAI,CAAA;AAE/BC,IAAAA,MAAM,CACJ,6DAA6D,EAC7DG,SAAS,IAAIF,SAAS,IAAIT,UAAU,CAACY,QAAQ,CAACD,SAAS,CACzD,CAAC,CAAA;IAED,OAAO;AACL,MAAA,GAAG,IAAI,CAACJ,IAAI,CAACM,iBAAiB;AAC9BF,MAAAA,SAAS,EAAEA,SAAS;AACpB;AACAG,MAAAA,MAAM,EAAE,IAAI,CAACP,IAAI,CAACO,MAAM,GAAG,IAAI,CAACP,IAAI,CAACO,MAAM,GAAG,CAAC,CAAC,EAAE,EAAE,CAAA;KACrD,CAAA;AACH,GAAA;;AAEA;AACF;AACA;AACA;AACA;AACA;EACE,IAAIC,QAAQA,GAAY;IACtB,MAAM;AAAEA,MAAAA,QAAQ,GAAG,IAAA;KAAM,GAAG,IAAI,CAACR,IAAI,CAAA;AACrC,IAAA,OAAOQ,QAAQ,CAAA;AACjB,GAAA;;AAEA;AACF;AACA;AACA;AACA;EACE,IAAIC,UAAUA,GAAW;AACvB,IAAA,MAAMC,OAAO,GAAG,CAAC,oBAAoB,CAAC,CAAA;;AAEtC;IACA,IAAI,IAAI,CAACF,QAAQ,EAAE;AACjBE,MAAAA,OAAO,CAACC,IAAI,CAAC,+BAA+B,CAAC,CAAA;AAC/C,KAAC,MAAM;AACLD,MAAAA,OAAO,CAACC,IAAI,CAAC,8BAA8B,CAAC,CAAA;AAC9C,KAAA;AAEA,IAAA,OAAOD,OAAO,CAACE,IAAI,CAAC,GAAG,CAAC,CAAA;AAC1B,GAAA;AACF,CAAA;AAACC,oBAAA,CAAAC,QAAA,EA7DoBjB,UAAU,CAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/hds/tooltip-button/index.hbs","../../../../src/components/hds/tooltip-button/index.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<button\\n  type=\\\"button\\\"\\n  class={{this.classNames}}\\n  {{hds-tooltip this.text options=this.options}}\\n  ...attributes\\n>{{~yield~}}</button>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\n\nimport type { Props as TippyProps } from 'tippy.js';\n\nimport { HdsTooltipPlacementValues } from './types.ts';\nimport type { HdsTooltipPlacements } from './types.ts';\n\nexport const PLACEMENTS: string[] = Object.values(HdsTooltipPlacementValues);\n\nexport interface HdsTooltipSignature {\n  Args: {\n    extraTippyOptions?: Partial<Omit<TippyProps, 'placement' | 'offset'>>;\n    isInline?: boolean;\n    offset?: [number, number];\n    placement?: HdsTooltipPlacements;\n    text: string;\n  };\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLButtonElement;\n}\n\nexport default class HdsTooltip extends Component<HdsTooltipSignature> {\n  /**\n   * @param text\n   * @type {string}\n   * @description text content for tooltip\n   */\n  get text(): string {\n    const { text } = this.args;\n\n    assert(\n      '@text for \"Hds::TooltipButton\" must have a valid value',\n      text !== undefined\n    );\n\n    return text;\n  }\n\n  get options(): Partial<TippyProps> {\n    const { placement = HdsTooltipPlacementValues.Top, extraTippyOptions } =\n      this.args;\n\n    assert(\n      '@placement for \"Hds::TooltipButton\" must have a valid value',\n      placement == undefined || PLACEMENTS.includes(placement)\n    );\n\n    return {\n      ...(extraTippyOptions ? extraTippyOptions : {}),\n      placement: placement,\n      // takes array of 2 numbers (skidding, distance): array(0, 10)\n      offset: this.args.offset ? this.args.offset : [0, 10],\n    };\n  }\n\n  /**\n   * @param isInline\n   * @type {boolean}\n   * @default true\n   * @description sets display for the button\n   */\n  get isInline(): boolean {\n    const { isInline = true } = this.args;\n    return isInline;\n  }\n\n  /**\n   * Get the class names to apply to the component.\n   * @method classNames\n   * @return {string} The \"class\" attribute to apply to the component.\n   */\n  get classNames(): string {\n    const classes = ['hds-tooltip-button'];\n\n    // add a class based on the @isInline argument\n    if (this.isInline) {\n      classes.push('hds-tooltip-button--is-inline');\n    } else {\n      classes.push('hds-tooltip-button--is-block');\n    }\n\n    return classes.join(' ');\n  }\n}\n"],"names":["PLACEMENTS","Object","values","HdsTooltipPlacementValues","HdsTooltip","Component","text","args","assert","undefined","options","placement","Top","extraTippyOptions","includes","offset","isInline","classNames","classes","push","join","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;AACA,eAAe,kBAAkB,CAAC,mOAAmO;;ACDrQ;AACA;AACA;AACA;;AAUO,MAAMA,UAAoB,GAAGC,MAAM,CAACC,MAAM,CAACC,yBAAyB,EAAC;AAgB7D,MAAMC,UAAU,SAASC,SAAS,CAAsB;AACrE;AACF;AACA;AACA;AACA;EACE,IAAIC,IAAIA,GAAW;IACjB,MAAM;AAAEA,MAAAA,IAAAA;KAAM,GAAG,IAAI,CAACC,IAAI,CAAA;AAE1BC,IAAAA,MAAM,CACJ,wDAAwD,EACxDF,IAAI,KAAKG,SACX,CAAC,CAAA;AAED,IAAA,OAAOH,IAAI,CAAA;AACb,GAAA;EAEA,IAAII,OAAOA,GAAwB;IACjC,MAAM;MAAEC,SAAS,GAAGR,yBAAyB,CAACS,GAAG;AAAEC,MAAAA,iBAAAA;KAAmB,GACpE,IAAI,CAACN,IAAI,CAAA;AAEXC,IAAAA,MAAM,CACJ,6DAA6D,EAC7DG,SAAS,IAAIF,SAAS,IAAIT,UAAU,CAACc,QAAQ,CAACH,SAAS,CACzD,CAAC,CAAA;IAED,OAAO;AACL,MAAA,IAAIE,iBAAiB,GAAGA,iBAAiB,GAAG,EAAE;AAC9CF,MAAAA,SAAS,EAAEA,SAAS;AACpB;AACAI,MAAAA,MAAM,EAAE,IAAI,CAACR,IAAI,CAACQ,MAAM,GAAG,IAAI,CAACR,IAAI,CAACQ,MAAM,GAAG,CAAC,CAAC,EAAE,EAAE,CAAA;KACrD,CAAA;AACH,GAAA;;AAEA;AACF;AACA;AACA;AACA;AACA;EACE,IAAIC,QAAQA,GAAY;IACtB,MAAM;AAAEA,MAAAA,QAAQ,GAAG,IAAA;KAAM,GAAG,IAAI,CAACT,IAAI,CAAA;AACrC,IAAA,OAAOS,QAAQ,CAAA;AACjB,GAAA;;AAEA;AACF;AACA;AACA;AACA;EACE,IAAIC,UAAUA,GAAW;AACvB,IAAA,MAAMC,OAAO,GAAG,CAAC,oBAAoB,CAAC,CAAA;;AAEtC;IACA,IAAI,IAAI,CAACF,QAAQ,EAAE;AACjBE,MAAAA,OAAO,CAACC,IAAI,CAAC,+BAA+B,CAAC,CAAA;AAC/C,KAAC,MAAM;AACLD,MAAAA,OAAO,CAACC,IAAI,CAAC,8BAA8B,CAAC,CAAA;AAC9C,KAAA;AAEA,IAAA,OAAOD,OAAO,CAACE,IAAI,CAAC,GAAG,CAAC,CAAA;AAC1B,GAAA;AACF,CAAA;AAACC,oBAAA,CAAAC,QAAA,EA9DoBlB,UAAU,CAAA;;;;"}

package/dist/modifiers/hds-clipboard.js

@@ -80,7 +80,7 @@ const writeTextToClipboard = async textToCopy => {
     } catch (error) {
       // clipboard write failed
       // this probably never happens (see comment above) or happens only for very old browsers that don't for which `navigator.clipboard` is undefined
-      warn('copy action failed, please check your browser‘s permissions', {
+      warn(`copy action failed, please check your browser‘s permissions: ${JSON.stringify(error)}`, {
         id: 'hds-clipboard.write-text-to-clipboard.catch-error'
       });
       return false;

package/dist/modifiers/hds-clipboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"hds-clipboard.js","sources":["../../src/modifiers/hds-clipboard.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport { modifier } from 'ember-modifier';\nimport { assert, warn } from '@ember/debug';\n\ntype TextToCopy = string | number | bigint;\ntype TargetToCopy = HTMLElement | string;\n\nexport interface HdsClipboardModifierSignature {\n  Element: HTMLElement;\n  Args: {\n    Named: {\n      text?: TextToCopy;\n      target?: TargetToCopy;\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      onSuccess?: (...args: any[]) => void;\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      onError?: (...args: any[]) => void;\n    };\n  };\n}\n\nexport const getTextToCopy = (text: TextToCopy): string => {\n  let textToCopy: string = '';\n\n  if (text) {\n    if (typeof text === 'string') {\n      textToCopy = text;\n    } else if (\n      // context: https://github.com/hashicorp/design-system/pull/1564\n      typeof text === 'number' ||\n      typeof text === 'bigint'\n    ) {\n      textToCopy = text.toString();\n    } else {\n      assert(\n        `\\`hds-clipboard\\` modifier - \\`text\\` argument must be a string - provided: ${typeof text}`\n      );\n    }\n  }\n  return textToCopy;\n};\n\nexport const getTargetElement = (\n  target: string | Node\n): HTMLElement | undefined => {\n  let targetElement: HTMLElement | null;\n\n  if (typeof target === 'string') {\n    targetElement = document.querySelector(target);\n\n    if (!targetElement) {\n      console.error(\n        '`hds-clipboard` modifier - `target` selector provided does not point to an existing DOM node, check your selector string',\n        targetElement\n      );\n      return;\n    }\n  } else if (target instanceof HTMLElement) {\n    targetElement = target;\n  } else {\n    if (target instanceof NodeList) {\n      assert(\n        '`hds-clipboard` modifier - `target` argument must be a string or a DOM node - provided: a list of DOM nodes'\n      );\n    } else {\n      assert(\n        `\\`hds-clipboard\\` modifier - \\`target\\` argument must be a string or a DOM node - provided: ${typeof target}`\n      );\n    }\n  }\n  return targetElement;\n};\n\nexport const getTextToCopyFromTargetElement = (\n  targetElement: TargetToCopy\n): string => {\n  let textToCopy: string = '';\n\n  if (targetElement instanceof HTMLElement) {\n    if (\n      targetElement instanceof HTMLInputElement || // targetElement.nodeName === 'INPUT' ||\n      targetElement instanceof HTMLTextAreaElement || // targetElement.nodeName === 'TEXTAREA' ||\n      targetElement instanceof HTMLSelectElement // targetElement.nodeName === 'SELECT'\n    ) {\n      textToCopy = targetElement.value;\n    } else {\n      // simplest approach\n      textToCopy = targetElement.innerText;\n\n      // approach based on text selection (left for backup just in case)\n      // var selection = window.getSelection();\n      // var range = document.createRange();\n      // selection.removeAllRanges();\n      // range.selectNodeContents(targetElement);\n      // selection.addRange(range);\n      // textToCopy = selection.toString();\n      // selection.removeAllRanges();\n    }\n  }\n  return textToCopy;\n};\n\nexport const writeTextToClipboard = async (\n  textToCopy: string\n): Promise<boolean> => {\n  // finally copy the text to the clipboard using the Clipboard API\n  // https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API\n  if (textToCopy) {\n    try {\n      // notice: the \"clipboard-write\" permission is granted automatically to pages when they are in the active tab\n      // https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/write\n      await navigator.clipboard.writeText(textToCopy);\n      // DEBUG uncomment this for easy debugging\n      // console.log('success', textToCopy);\n      return true;\n    } catch (error) {\n      // clipboard write failed\n      // this probably never happens (see comment above) or happens only for very old browsers that don't for which `navigator.clipboard` is undefined\n      warn('copy action failed, please check your browser‘s permissions', {\n        id: 'hds-clipboard.write-text-to-clipboard.catch-error',\n      });\n      return false;\n    }\n  } else {\n    return false;\n  }\n};\n\nexport const copyToClipboard = async (\n  text?: TextToCopy,\n  target?: TargetToCopy\n): Promise<boolean> => {\n  let textToCopy: string = '';\n\n  if (text) {\n    textToCopy = getTextToCopy(text);\n  } else if (target) {\n    const targetElement = getTargetElement(target);\n    if (targetElement) {\n      textToCopy = getTextToCopyFromTargetElement(targetElement);\n    }\n  } else {\n    assert(\n      '`hds-clipboard` modifier - either a `text` or a `target` argument is required'\n    );\n  }\n  const success = await writeTextToClipboard(textToCopy);\n  return success;\n};\n\n// Notice: we use a function-based modifier here instead of a class-based one\n// because it's quite simple in its logic, and doesn't require injecting services\n// see: https://github.com/ember-modifier/ember-modifier#function-based-modifiers\n\nexport default modifier<HdsClipboardModifierSignature>(\n  (element, _positional, named): (() => void) => {\n    assert(\n      '`hds-clipboard` modifier - the modifier must be applied to an element',\n      element\n    );\n\n    const { text, target, onSuccess, onError } = named;\n\n    const onClick = async (event: MouseEvent): Promise<void> => {\n      const trigger = event.currentTarget;\n      const success = await copyToClipboard(text, target);\n\n      // fire the `onSuccess/onError` callbacks (if provided)\n      if (success) {\n        if (typeof onSuccess === 'function') {\n          onSuccess({ trigger, text, target });\n        }\n      } else {\n        if (typeof onError === 'function') {\n          onError({ trigger, text, target });\n        }\n      }\n    };\n\n    // add the \"onClick\" event listener to the element\n    element.addEventListener('click', onClick);\n\n    // this (teardown) function is run when the element is removed\n    return (): void => {\n      element.removeEventListener('click', onClick);\n    };\n  }\n);\n"],"names":["getTextToCopy","text","textToCopy","toString","assert","getTargetElement","target","targetElement","document","querySelector","console","error","HTMLElement","NodeList","getTextToCopyFromTargetElement","HTMLInputElement","HTMLTextAreaElement","HTMLSelectElement","value","innerText","writeTextToClipboard","navigator","clipboard","writeText","warn","id","copyToClipboard","success","modifier","element","_positional","named","onSuccess","onError","onClick","event","trigger","currentTarget","addEventListener","removeEventListener"],"mappings":"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"}
+{"version":3,"file":"hds-clipboard.js","sources":["../../src/modifiers/hds-clipboard.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport { modifier } from 'ember-modifier';\nimport { assert, warn } from '@ember/debug';\n\ntype TextToCopy = string | number | bigint;\ntype TargetToCopy = HTMLElement | string;\n\nexport interface HdsClipboardModifierSignature {\n  Element: HTMLElement;\n  Args: {\n    Named: {\n      text?: TextToCopy;\n      target?: TargetToCopy;\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      onSuccess?: (...args: any[]) => void;\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      onError?: (...args: any[]) => void;\n    };\n  };\n}\n\nexport const getTextToCopy = (text: TextToCopy): string => {\n  let textToCopy: string = '';\n\n  if (text) {\n    if (typeof text === 'string') {\n      textToCopy = text;\n    } else if (\n      // context: https://github.com/hashicorp/design-system/pull/1564\n      typeof text === 'number' ||\n      typeof text === 'bigint'\n    ) {\n      textToCopy = text.toString();\n    } else {\n      assert(\n        `\\`hds-clipboard\\` modifier - \\`text\\` argument must be a string - provided: ${typeof text}`\n      );\n    }\n  }\n  return textToCopy;\n};\n\nexport const getTargetElement = (\n  target: string | Node\n): HTMLElement | undefined => {\n  let targetElement: HTMLElement | null;\n\n  if (typeof target === 'string') {\n    targetElement = document.querySelector(target);\n\n    if (!targetElement) {\n      console.error(\n        '`hds-clipboard` modifier - `target` selector provided does not point to an existing DOM node, check your selector string',\n        targetElement\n      );\n      return;\n    }\n  } else if (target instanceof HTMLElement) {\n    targetElement = target;\n  } else {\n    if (target instanceof NodeList) {\n      assert(\n        '`hds-clipboard` modifier - `target` argument must be a string or a DOM node - provided: a list of DOM nodes'\n      );\n    } else {\n      assert(\n        `\\`hds-clipboard\\` modifier - \\`target\\` argument must be a string or a DOM node - provided: ${typeof target}`\n      );\n    }\n  }\n  return targetElement;\n};\n\nexport const getTextToCopyFromTargetElement = (\n  targetElement: TargetToCopy\n): string => {\n  let textToCopy: string = '';\n\n  if (targetElement instanceof HTMLElement) {\n    if (\n      targetElement instanceof HTMLInputElement || // targetElement.nodeName === 'INPUT' ||\n      targetElement instanceof HTMLTextAreaElement || // targetElement.nodeName === 'TEXTAREA' ||\n      targetElement instanceof HTMLSelectElement // targetElement.nodeName === 'SELECT'\n    ) {\n      textToCopy = targetElement.value;\n    } else {\n      // simplest approach\n      textToCopy = targetElement.innerText;\n\n      // approach based on text selection (left for backup just in case)\n      // var selection = window.getSelection();\n      // var range = document.createRange();\n      // selection.removeAllRanges();\n      // range.selectNodeContents(targetElement);\n      // selection.addRange(range);\n      // textToCopy = selection.toString();\n      // selection.removeAllRanges();\n    }\n  }\n  return textToCopy;\n};\n\nexport const writeTextToClipboard = async (\n  textToCopy: string\n): Promise<boolean> => {\n  // finally copy the text to the clipboard using the Clipboard API\n  // https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API\n  if (textToCopy) {\n    try {\n      // notice: the \"clipboard-write\" permission is granted automatically to pages when they are in the active tab\n      // https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/write\n      await navigator.clipboard.writeText(textToCopy);\n      // DEBUG uncomment this for easy debugging\n      // console.log('success', textToCopy);\n      return true;\n    } catch (error) {\n      // clipboard write failed\n      // this probably never happens (see comment above) or happens only for very old browsers that don't for which `navigator.clipboard` is undefined\n      warn(\n        `copy action failed, please check your browser‘s permissions: ${JSON.stringify(\n          error\n        )}`,\n        {\n          id: 'hds-clipboard.write-text-to-clipboard.catch-error',\n        }\n      );\n      return false;\n    }\n  } else {\n    return false;\n  }\n};\n\nexport const copyToClipboard = async (\n  text?: TextToCopy,\n  target?: TargetToCopy\n): Promise<boolean> => {\n  let textToCopy: string = '';\n\n  if (text) {\n    textToCopy = getTextToCopy(text);\n  } else if (target) {\n    const targetElement = getTargetElement(target);\n    if (targetElement) {\n      textToCopy = getTextToCopyFromTargetElement(targetElement);\n    }\n  } else {\n    assert(\n      '`hds-clipboard` modifier - either a `text` or a `target` argument is required'\n    );\n  }\n  const success = await writeTextToClipboard(textToCopy);\n  return success;\n};\n\n// Notice: we use a function-based modifier here instead of a class-based one\n// because it's quite simple in its logic, and doesn't require injecting services\n// see: https://github.com/ember-modifier/ember-modifier#function-based-modifiers\n\nexport default modifier<HdsClipboardModifierSignature>(\n  (element, _positional, named): (() => void) => {\n    assert(\n      '`hds-clipboard` modifier - the modifier must be applied to an element',\n      element\n    );\n\n    const { text, target, onSuccess, onError } = named;\n\n    const onClick = async (event: MouseEvent): Promise<void> => {\n      const trigger = event.currentTarget;\n      const success = await copyToClipboard(text, target);\n\n      // fire the `onSuccess/onError` callbacks (if provided)\n      if (success) {\n        if (typeof onSuccess === 'function') {\n          onSuccess({ trigger, text, target });\n        }\n      } else {\n        if (typeof onError === 'function') {\n          onError({ trigger, text, target });\n        }\n      }\n    };\n\n    // add the \"onClick\" event listener to the element\n    element.addEventListener('click', onClick);\n\n    // this (teardown) function is run when the element is removed\n    return (): void => {\n      element.removeEventListener('click', onClick);\n    };\n  }\n);\n"],"names":["getTextToCopy","text","textToCopy","toString","assert","getTargetElement","target","targetElement","document","querySelector","console","error","HTMLElement","NodeList","getTextToCopyFromTargetElement","HTMLInputElement","HTMLTextAreaElement","HTMLSelectElement","value","innerText","writeTextToClipboard","navigator","clipboard","writeText","warn","JSON","stringify","id","copyToClipboard","success","modifier","element","_positional","named","onSuccess","onError","onClick","event","trigger","currentTarget","addEventListener","removeEventListener"],"mappings":"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"}

package/dist/modifiers/hds-tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"hds-tooltip.js","sources":["../../src/modifiers/hds-tooltip.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\n// Note: the majority of this code is a porting of the existing tooltip implementation in Cloud UI\n// (which was initially implemented in Structure)\n\nimport Modifier from 'ember-modifier';\nimport type { ArgsFor } from 'ember-modifier';\n\nimport { assert } from '@ember/debug';\nimport { registerDestructor } from '@ember/destroyable';\n\nimport tippy, { followCursor } from 'tippy.js';\nimport type {\n  HideAll as TippyHideAll,\n  Instance as TippyInstance,\n  Props as TippyProps,\n} from 'tippy.js';\n// used by custom SVG arrow:\nimport 'tippy.js/dist/svg-arrow.css';\n\nexport interface HdsTooltipModifierSignature {\n  Args: {\n    Positional: [string];\n    Named: {\n      options?: TippyProps;\n    };\n  };\n  Element: HTMLElement;\n}\n\nfunction cleanup(instance: HdsTooltipModifier): void {\n  const { interval, needsTabIndex, tooltip } = instance;\n  if (needsTabIndex) {\n    tooltip?.reference?.removeAttribute('tabindex');\n  }\n  clearInterval(interval);\n  tooltip?.destroy();\n}\n\n/**\n *\n * `Tooltip` implements a modifier that uses Tippy.js to display a tooltip.\n *\n * Sample usage:\n * ```\n * <div {{hds-tooltip 'Text' options=(hash )}}>Hover me!</div>\n * ```\n *\n * @see https://atomiks.github.io/tippyjs\n * @class TooltipModifier\n *\n */\nexport default class HdsTooltipModifier extends Modifier<HdsTooltipModifierSignature> {\n  didSetup = false;\n  interval: number | undefined = undefined;\n  needsTabIndex = false;\n  tooltip: TippyInstance | undefined = undefined;\n\n  constructor(owner: unknown, args: ArgsFor<HdsTooltipModifierSignature>) {\n    super(owner, args);\n    registerDestructor(this, cleanup);\n  }\n\n  hideOnEsc = {\n    name: 'hideOnEsc',\n    defaultValue: true,\n    fn({ hide }: { hide: TippyHideAll }) {\n      function onKeyDown(event: KeyboardEvent): void {\n        if (event.key === 'Escape') {\n          hide();\n        }\n      }\n\n      return {\n        onShow() {\n          document.addEventListener('keydown', onKeyDown);\n        },\n        onHide() {\n          document.removeEventListener('keydown', onKeyDown);\n        },\n      };\n    },\n  };\n\n  modify(\n    element: HdsTooltipModifierSignature['Element'],\n    positional: HdsTooltipModifierSignature['Args']['Positional'],\n    named: HdsTooltipModifierSignature['Args']['Named']\n  ): void {\n    assert('Tooltip must have an element', element);\n\n    if (!this.didSetup) {\n      this.#setup(element, positional, named);\n      this.didSetup = true;\n    }\n\n    this.#update(element, positional, named);\n  }\n\n  #setup(\n    element: HdsTooltipModifierSignature['Element'],\n    positional: HdsTooltipModifierSignature['Args']['Positional'],\n    named: HdsTooltipModifierSignature['Args']['Named']\n  ): void {\n    const tooltipProps = this.#getTooltipProps(element, positional, named);\n    this.tooltip = tippy(element, tooltipProps);\n  }\n\n  #update(\n    element: HdsTooltipModifierSignature['Element'],\n    positional: HdsTooltipModifierSignature['Args']['Positional'],\n    named: HdsTooltipModifierSignature['Args']['Named']\n  ): void {\n    const tooltipProps = this.#getTooltipProps(element, positional, named);\n    this.tooltip?.setProps(tooltipProps);\n  }\n\n  #getTooltipProps(\n    element: HdsTooltipModifierSignature['Element'],\n    positional: HdsTooltipModifierSignature['Args']['Positional'],\n    named: HdsTooltipModifierSignature['Args']['Named']\n  ): Partial<TippyProps> {\n    const { options } = named;\n    let [content] = positional;\n\n    let $anchor: HTMLElement | null = element; // Ensure $anchor can be null\n\n    if (typeof options?.triggerTarget === 'string') {\n      const $el = $anchor;\n      if (options.triggerTarget === 'parentNode') {\n        if ($anchor.parentNode instanceof HTMLElement) {\n          // Type guard\n          $anchor = $anchor.parentNode;\n        }\n      } else {\n        const queryResult: HTMLElement | null = $anchor.querySelector(\n          options.triggerTarget\n        );\n        if (queryResult) {\n          $anchor = queryResult;\n        }\n      }\n      if ($anchor instanceof HTMLElement) {\n        // Ensure $anchor is an HTMLElement before cloning\n        const clonedElement = $anchor.cloneNode(true) as HTMLElement; // Explicitly cast cloned node to HTMLElement\n        content = clonedElement.outerHTML; // Now safely access outerHTML\n      }\n      $el?.remove(); // Use optional chaining in case $el is null\n      options.triggerTarget = null;\n    }\n\n    // The {{hds-tooltip}} will just use the HTML content.\n    if (typeof content === 'undefined' && $anchor instanceof HTMLElement) {\n      // Ensure $anchor is an HTMLElement before accessing innerHTML\n      content = $anchor.innerHTML;\n      $anchor.innerHTML = '';\n    }\n\n    if (options?.trigger === 'manual') {\n      // If we are manually triggering, a out delay means only show for the\n      // amount of time specified by the delay.\n      const delay = options.delay || [];\n\n      if (Array.isArray(delay) && delay.length) {\n        if (typeof delay[1] !== 'undefined') {\n          options.onShown = (tooltip) => {\n            clearInterval(this.interval);\n            this.interval = setTimeout(() => {\n              tooltip.hide();\n            }, delay[1] ?? 0);\n          };\n        }\n      }\n    }\n\n    const $trigger = $anchor;\n\n    if (!$trigger.hasAttribute('tabindex')) {\n      this.needsTabIndex = true;\n      $trigger.setAttribute('tabindex', '0');\n    }\n\n    /*  Typescript does not like the previous approach of adding an undefined value\n     **  to the array and then filtering it out.\n     */\n    const plugins =\n      options?.followCursor !== undefined\n        ? [this.hideOnEsc, followCursor]\n        : [this.hideOnEsc];\n\n    return {\n      theme: 'hds',\n      triggerTarget: $trigger,\n      arrow: `\n        <svg class=\"hds-tooltip-pointer\" width=\"16\" height=\"7\" viewBox=\"0 0 16 7\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M0 7H16L9.11989 0.444571C8.49776 -0.148191 7.50224 -0.148191 6.88011 0.444572L0 7Z\" />\n        </svg>`,\n      // keeps tooltip itself open on hover:\n      interactive: true,\n      // fix accessibility features that get messed up with setting interactive: true\n      aria: {\n        content: 'describedby',\n        expanded: false,\n      },\n      content: () => content,\n      plugins,\n      ...options,\n    };\n  }\n}\n"],"names":["cleanup","instance","interval","needsTabIndex","tooltip","reference","removeAttribute","clearInterval","destroy","_HdsTooltipModifier_brand","WeakSet","HdsTooltipModifier","Modifier","constructor","owner","args","_classPrivateMethodInitSpec","_defineProperty","undefined","name","defaultValue","fn","hide","onKeyDown","event","key","onShow","document","addEventListener","onHide","removeEventListener","registerDestructor","modify","element","positional","named","assert","didSetup","_assertClassBrand","_setup","call","_update","tooltipProps","_getTooltipProps","tippy","setProps","options","content","$anchor","triggerTarget","$el","parentNode","HTMLElement","queryResult","querySelector","clonedElement","cloneNode","outerHTML","remove","innerHTML","trigger","delay","Array","isArray","length","onShown","setTimeout","$trigger","hasAttribute","setAttribute","plugins","followCursor","hideOnEsc","theme","arrow","interactive","aria","expanded"],"mappings":"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"}
+{"version":3,"file":"hds-tooltip.js","sources":["../../src/modifiers/hds-tooltip.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\n// Note: the majority of this code is a porting of the existing tooltip implementation in Cloud UI\n// (which was initially implemented in Structure)\n\nimport Modifier from 'ember-modifier';\nimport type { ArgsFor } from 'ember-modifier';\n\nimport { assert } from '@ember/debug';\nimport { registerDestructor } from '@ember/destroyable';\n\nimport tippy, { followCursor } from 'tippy.js';\nimport type {\n  HideAll as TippyHideAll,\n  Instance as TippyInstance,\n  Props as TippyProps,\n} from 'tippy.js';\n// used by custom SVG arrow:\nimport 'tippy.js/dist/svg-arrow.css';\n\nexport interface HdsTooltipModifierSignature {\n  Args: {\n    Positional: [string];\n    Named: {\n      options?: Partial<TippyProps>;\n    };\n  };\n  Element: HTMLElement;\n}\n\nfunction cleanup(instance: HdsTooltipModifier): void {\n  const { interval, needsTabIndex, tooltip } = instance;\n  if (needsTabIndex) {\n    tooltip?.reference?.removeAttribute('tabindex');\n  }\n  clearInterval(interval);\n  tooltip?.destroy();\n}\n\n/**\n *\n * `Tooltip` implements a modifier that uses Tippy.js to display a tooltip.\n *\n * Sample usage:\n * ```\n * <div {{hds-tooltip 'Text' options=(hash )}}>Hover me!</div>\n * ```\n *\n * @see https://atomiks.github.io/tippyjs\n * @class TooltipModifier\n *\n */\nexport default class HdsTooltipModifier extends Modifier<HdsTooltipModifierSignature> {\n  didSetup = false;\n  interval: number | undefined = undefined;\n  needsTabIndex = false;\n  tooltip: TippyInstance | undefined = undefined;\n\n  constructor(owner: unknown, args: ArgsFor<HdsTooltipModifierSignature>) {\n    super(owner, args);\n    registerDestructor(this, cleanup);\n  }\n\n  hideOnEsc = {\n    name: 'hideOnEsc',\n    defaultValue: true,\n    fn({ hide }: { hide: TippyHideAll }) {\n      function onKeyDown(event: KeyboardEvent): void {\n        if (event.key === 'Escape') {\n          hide();\n        }\n      }\n\n      return {\n        onShow() {\n          document.addEventListener('keydown', onKeyDown);\n        },\n        onHide() {\n          document.removeEventListener('keydown', onKeyDown);\n        },\n      };\n    },\n  };\n\n  modify(\n    element: HdsTooltipModifierSignature['Element'],\n    positional: HdsTooltipModifierSignature['Args']['Positional'],\n    named: HdsTooltipModifierSignature['Args']['Named']\n  ): void {\n    assert('Tooltip must have an element', element);\n\n    if (!this.didSetup) {\n      this.#setup(element, positional, named);\n      this.didSetup = true;\n    }\n\n    this.#update(element, positional, named);\n  }\n\n  #setup(\n    element: HdsTooltipModifierSignature['Element'],\n    positional: HdsTooltipModifierSignature['Args']['Positional'],\n    named: HdsTooltipModifierSignature['Args']['Named']\n  ): void {\n    const tooltipProps = this.#getTooltipProps(element, positional, named);\n    this.tooltip = tippy(element, tooltipProps);\n  }\n\n  #update(\n    element: HdsTooltipModifierSignature['Element'],\n    positional: HdsTooltipModifierSignature['Args']['Positional'],\n    named: HdsTooltipModifierSignature['Args']['Named']\n  ): void {\n    const tooltipProps = this.#getTooltipProps(element, positional, named);\n    this.tooltip?.setProps(tooltipProps);\n  }\n\n  #getTooltipProps(\n    element: HdsTooltipModifierSignature['Element'],\n    positional: HdsTooltipModifierSignature['Args']['Positional'],\n    named: HdsTooltipModifierSignature['Args']['Named']\n  ): Partial<TippyProps> {\n    const { options } = named;\n    let [content] = positional;\n\n    let $anchor: HTMLElement | null = element; // Ensure $anchor can be null\n\n    if (typeof options?.triggerTarget === 'string') {\n      const $el = $anchor;\n      if (options.triggerTarget === 'parentNode') {\n        if ($anchor.parentNode instanceof HTMLElement) {\n          // Type guard\n          $anchor = $anchor.parentNode;\n        }\n      } else {\n        const queryResult: HTMLElement | null = $anchor.querySelector(\n          options.triggerTarget\n        );\n        if (queryResult) {\n          $anchor = queryResult;\n        }\n      }\n      if ($anchor instanceof HTMLElement) {\n        // Ensure $anchor is an HTMLElement before cloning\n        const clonedElement = $anchor.cloneNode(true) as HTMLElement; // Explicitly cast cloned node to HTMLElement\n        content = clonedElement.outerHTML; // Now safely access outerHTML\n      }\n      $el?.remove(); // Use optional chaining in case $el is null\n      options.triggerTarget = null;\n    }\n\n    // The {{hds-tooltip}} will just use the HTML content.\n    if (typeof content === 'undefined' && $anchor instanceof HTMLElement) {\n      // Ensure $anchor is an HTMLElement before accessing innerHTML\n      content = $anchor.innerHTML;\n      $anchor.innerHTML = '';\n    }\n\n    if (options?.trigger === 'manual') {\n      // If we are manually triggering, a out delay means only show for the\n      // amount of time specified by the delay.\n      const delay = options.delay || [];\n\n      if (Array.isArray(delay) && delay.length) {\n        if (typeof delay[1] !== 'undefined') {\n          options.onShown = (tooltip) => {\n            clearInterval(this.interval);\n            this.interval = setTimeout(() => {\n              tooltip.hide();\n            }, delay[1] ?? 0);\n          };\n        }\n      }\n    }\n\n    const $trigger = $anchor;\n\n    if (!$trigger.hasAttribute('tabindex')) {\n      this.needsTabIndex = true;\n      $trigger.setAttribute('tabindex', '0');\n    }\n\n    /*  Typescript does not like the previous approach of adding an undefined value\n     **  to the array and then filtering it out.\n     */\n    const plugins =\n      options?.followCursor !== undefined\n        ? [this.hideOnEsc, followCursor]\n        : [this.hideOnEsc];\n\n    return {\n      theme: 'hds',\n      triggerTarget: $trigger,\n      arrow: `\n        <svg class=\"hds-tooltip-pointer\" width=\"16\" height=\"7\" viewBox=\"0 0 16 7\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M0 7H16L9.11989 0.444571C8.49776 -0.148191 7.50224 -0.148191 6.88011 0.444572L0 7Z\" />\n        </svg>`,\n      // keeps tooltip itself open on hover:\n      interactive: true,\n      // fix accessibility features that get messed up with setting interactive: true\n      aria: {\n        content: 'describedby',\n        expanded: false,\n      },\n      content: () => content,\n      plugins,\n      ...options,\n    };\n  }\n}\n"],"names":["cleanup","instance","interval","needsTabIndex","tooltip","reference","removeAttribute","clearInterval","destroy","_HdsTooltipModifier_brand","WeakSet","HdsTooltipModifier","Modifier","constructor","owner","args","_classPrivateMethodInitSpec","_defineProperty","undefined","name","defaultValue","fn","hide","onKeyDown","event","key","onShow","document","addEventListener","onHide","removeEventListener","registerDestructor","modify","element","positional","named","assert","didSetup","_assertClassBrand","_setup","call","_update","tooltipProps","_getTooltipProps","tippy","setProps","options","content","$anchor","triggerTarget","$el","parentNode","HTMLElement","queryResult","querySelector","clonedElement","cloneNode","outerHTML","remove","innerHTML","trigger","delay","Array","isArray","length","onShown","setTimeout","$trigger","hasAttribute","setAttribute","plugins","followCursor","hideOnEsc","theme","arrow","interactive","aria","expanded"],"mappings":"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"}

package/dist/styles/@hashicorp/design-system-components.css

@@ -2701,6 +2701,7 @@ button.hds-button[href]::after {
   word-spacing: normal;
   tab-size: 4;
   hyphens: none;
+  scrollbar-width: thin;
 }
 @media print {
   .hds-code-block pre,
@@ -2896,6 +2897,12 @@ button.hds-button[href]::after {
 .hds-copy-button .hds-button__icon {
   color: var(--token-color-foreground-action);
 }
+.hds-copy-button:hover .hds-button__icon, .hds-copy-button.mock-hover .hds-button__icon {
+  color: var(--token-color-foreground-action-hover);
+}
+.hds-copy-button:active .hds-button__icon, .hds-copy-button.mock-active .hds-button__icon {
+  color: var(--token-color-foreground-action-active);
+}
 .hds-copy-button.hds-copy-button--status-success .hds-button__icon {
   color: var(--token-color-foreground-success);
 }
@@ -2959,33 +2966,51 @@ button.hds-button[href]::after {
   background-color: var(--token-color-surface-interactive-active);
   border-color: var(--token-color-border-strong);
 }
-.hds-copy-snippet--color-primary:focus {
-  background-color: transparent;
+.hds-copy-snippet--color-primary.hds-copy-snippet--status-success {
+  background-color: var(--token-color-surface-interactive);
+}
+.hds-copy-snippet--color-primary.hds-copy-snippet--status-success .hds-copy-snippet__icon {
+  color: var(--token-color-foreground-success);
+}
+.hds-copy-snippet--color-primary.hds-copy-snippet--status-error {
+  background-color: var(--token-color-surface-interactive);
+}
+.hds-copy-snippet--color-primary.hds-copy-snippet--status-error .hds-copy-snippet__icon {
+  color: var(--token-color-foreground-critical);
 }
 
 .hds-copy-snippet--color-secondary {
   color: var(--token-color-foreground-primary);
   background-color: transparent;
 }
+.hds-copy-snippet--color-secondary .hds-copy-snippet__icon {
+  color: var(--token-color-foreground-action);
+}
 .hds-copy-snippet--color-secondary:hover, .hds-copy-snippet--color-secondary.mock-hover {
   background-color: var(--token-color-surface-interactive);
   border-color: var(--token-color-border-strong);
 }
+.hds-copy-snippet--color-secondary:hover .hds-copy-snippet__icon, .hds-copy-snippet--color-secondary.mock-hover .hds-copy-snippet__icon {
+  color: var(--token-color-foreground-action-hover);
+}
 .hds-copy-snippet--color-secondary:active, .hds-copy-snippet--color-secondary.mock-active {
   background-color: var(--token-color-surface-interactive-active);
   border-color: var(--token-color-border-strong);
 }
-.hds-copy-snippet--color-secondary .hds-copy-snippet__icon {
-  color: var(--token-color-foreground-action);
+.hds-copy-snippet--color-secondary:active .hds-copy-snippet__icon, .hds-copy-snippet--color-secondary.mock-active .hds-copy-snippet__icon {
+  color: var(--token-color-foreground-action-active);
 }
-.hds-copy-snippet--color-secondary .hds-copy-snippet__icon:hover {
-  color: var(--token-color-foreground-action-hover);
+.hds-copy-snippet--color-secondary.hds-copy-snippet--status-success {
+  background-color: var(--token-color-surface-interactive);
 }
-.hds-copy-snippet--color-secondary .hds-copy-snippet__icon:active {
-  color: var(--token-color-foreground-action-active);
+.hds-copy-snippet--color-secondary.hds-copy-snippet--status-success .hds-copy-snippet__icon {
+  color: var(--token-color-foreground-success);
 }
-.hds-copy-snippet--color-secondary .hds-copy-snippet__icon:focus {
-  color: var(--token-color-foreground-action);
+.hds-copy-snippet--color-secondary.hds-copy-snippet--status-error {
+  background-color: var(--token-color-surface-interactive);
+}
+.hds-copy-snippet--color-secondary.hds-copy-snippet--status-error .hds-copy-snippet__icon {
+  color: var(--token-color-foreground-critical);
 }
 
 .hds-copy-snippet--status-success {
@@ -3030,7 +3055,8 @@ button.hds-button[href]::after {
  * SPDX-License-Identifier: MPL-2.0
  */
 :where(.hds-dialog-primitive__wrapper) {
-  all: unset;
+  position: initial;
+  inset: initial;
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -3038,6 +3064,7 @@ button.hds-button[href]::after {
   margin: 0;
   padding: 0;
   background: var(--token-color-surface-primary);
+  border: none;
 }
 
 .hds-dialog-primitive__wrapper-header {
@@ -4257,6 +4284,7 @@ button.hds-button[href]::after {
 .hds-form-masked-input .hds-form-masked-input__control {
   grid-area: input;
   padding-right: calc(var(--token-form-control-padding) + 24px);
+  scrollbar-width: thin;
 }
 
 .hds-form-masked-input--is-masked .hds-form-masked-input__control {
@@ -4374,12 +4402,15 @@ button.hds-button[href]::after {
   box-shadow: 0 0 0 3px var(--token-color-focus-action-external);
 }
 .hds-form-radio-card--checked, .hds-form-radio-card.mock-checked {
-  border-color: var(--token-color-focus-action-internal);
+  border-color: var(--token-color-palette-blue-300);
 }
 .hds-form-radio-card--checked .hds-form-radio-card__control-wrapper, .hds-form-radio-card.mock-checked .hds-form-radio-card__control-wrapper {
   background-color: var(--token-color-surface-action);
   border-color: var(--token-color-border-action);
 }
+.hds-form-radio-card--checked:hover, .hds-form-radio-card--checked.mock-hover, .hds-form-radio-card.mock-checked:hover, .hds-form-radio-card.mock-checked.mock-hover {
+  border-color: var(--token-color-palette-blue-400);
+}
 .hds-form-radio-card--disabled, .hds-form-radio-card.mock-disabled {
   background-color: var(--token-color-surface-interactive-disabled);
   border-color: var(--token-color-border-primary);
@@ -4390,6 +4421,9 @@ button.hds-button[href]::after {
   background-color: var(--token-color-surface-interactive-disabled);
   border-color: var(--token-color-border-primary);
 }
+.hds-form-radio-card--disabled .hds-form-radio-card__content, .hds-form-radio-card.mock-disabled .hds-form-radio-card__content {
+  opacity: 0.5;
+}
 
 .hds-form-radio-card--align-left {
   text-align: left;
@@ -7204,7 +7238,7 @@ button.hds-button[href]::after {
   color: var(--token-color-palette-blue-200);
 }
 .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path {
-  fill: var(--token-color-palette-blue-50);
+  fill: var(--token-color-surface-action);
   stroke: var(--token-color-palette-blue-300);
 }
 .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete:hover .hds-stepper-indicator-step__status, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete.mock-hover .hds-stepper-indicator-step__status {

package/dist/styles/components/code-block/index.scss

@@ -36,6 +36,7 @@ $hds-code-block-code-padding: 16px;
     word-spacing: normal;
     tab-size: 4;
     hyphens: none;
+    scrollbar-width: thin;
 
     @media print { text-shadow: none; }
   }

package/dist/styles/components/copy/button.scss

@@ -16,6 +16,20 @@
     color: var(--token-color-foreground-action);
   }
 
+  &:hover,
+  &.mock-hover {
+    .hds-button__icon {
+      color: var(--token-color-foreground-action-hover);
+    }
+  }
+
+  &:active,
+  &.mock-active {
+    .hds-button__icon {
+      color: var(--token-color-foreground-action-active);
+    }
+  }
+
   &.hds-copy-button--status-success {
     .hds-button__icon {
       color: var(--token-color-foreground-success);
@@ -28,4 +42,3 @@
     }
   }
 }
-

package/dist/styles/components/copy/snippet.scss

@@ -8,6 +8,24 @@
 //
 @use "../../mixins/focus-ring" as *;
 
+@mixin hds-copy-snippet-success-error() {
+  &.hds-copy-snippet--status-success {
+    background-color: var(--token-color-surface-interactive);
+
+    .hds-copy-snippet__icon {
+      color: var(--token-color-foreground-success);
+    }
+  }
+
+  &.hds-copy-snippet--status-error {
+    background-color: var(--token-color-surface-interactive);
+
+    .hds-copy-snippet__icon {
+      color: var(--token-color-foreground-critical);
+    }
+  }
+}
+
 .hds-copy-snippet {
   @include hds-focus-ring-with-pseudo-element();
 
@@ -40,42 +58,38 @@
     border-color: var(--token-color-border-strong);
   }
 
-  &:focus {
-    background-color: transparent;
-  }
+  @include hds-copy-snippet-success-error();
 }
 
 .hds-copy-snippet--color-secondary {
   color: var(--token-color-foreground-primary);
   background-color: transparent;
 
+  .hds-copy-snippet__icon {
+    color: var(--token-color-foreground-action);
+  }
+
   &:hover,
   &.mock-hover {
     background-color: var(--token-color-surface-interactive);
     border-color: var(--token-color-border-strong);
+
+    .hds-copy-snippet__icon {
+      color: var(--token-color-foreground-action-hover);
+    }
   }
 
   &:active,
   &.mock-active {
     background-color: var(--token-color-surface-interactive-active);
     border-color: var(--token-color-border-strong);
-  }
-
-  .hds-copy-snippet__icon {
-    color: var(--token-color-foreground-action);
-
-    &:hover {
-      color: var(--token-color-foreground-action-hover);
-    }
 
-    &:active {
+    .hds-copy-snippet__icon {
       color: var(--token-color-foreground-action-active);
     }
-
-    &:focus {
-      color: var(--token-color-foreground-action);
-    }
   }
+
+  @include hds-copy-snippet-success-error();
 }
 
 .hds-copy-snippet--status-success {