@hashicorp/design-system-components 4.15.0 → 4.17.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);\nexport interface 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 private _tabNodes: HTMLButtonElement[] = [];\n  @tracked private _tabIds: HdsTabsTabIds = [];\n  @tracked private _panelNodes: HTMLElement[] = [];\n  @tracked private _panelIds: HdsTabsPanelIds = [];\n  @tracked private _selectedTabIndex;\n  @tracked private _selectedTabId?: string;\n  @tracked private _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    this._selectedTabIndex = this.args.selectedTabIndex ?? 0;\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(\n      (tabId): boolean => tabId !== element.id\n    );\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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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/hds/tabs/index.ts"],"sourcesContent":["/**\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';\nimport type Owner from '@ember/owner';\n\nexport const DEFAULT_SIZE: HdsTabsSizes = 'medium' as const;\nexport const SIZES: HdsTabsSizes[] = Object.values(HdsTabsSizeValues);\nexport interface 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 private _tabNodes: HTMLButtonElement[] = [];\n  @tracked private _tabIds: HdsTabsTabIds = [];\n  @tracked private _panelNodes: HTMLElement[] = [];\n  @tracked private _panelIds: HdsTabsPanelIds = [];\n  @tracked private _selectedTabIndex;\n  @tracked private _selectedTabId?: string;\n  @tracked private _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: Owner, 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    this._selectedTabIndex = this.args.selectedTabIndex ?? 0;\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(\n      (tabId): boolean => tabId !== element.id\n    );\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","Component","g","prototype","tracked","i","void 0","size","args","assert","join","includes","constructor","owner","_isControlled","selectedTabIndex","undefined","_selectedTabIndex","value","classNames","classes","push","didInsert","_tabNodes","length","_panelNodes","_selectedTabId","_tabIds","indexOf","schedule","setTabIndicator","n","action","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","setComponentTemplate","TEMPLATE"],"mappings":"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"}

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

@@ -1,24 +1,25 @@
-import { _ as _applyDecoratedDescriptor, a as _defineProperty } from '../../../_rollupPluginBabelHelpers-81503waH.js';
 import Component from '@glimmer/component';
 import { guidFor } from '@ember/object/internals';
 import { action } from '@ember/object';
 import { precompileTemplate } from '@ember/template-compilation';
+import { n } from 'decorator-transforms/runtime';
 import { setComponentTemplate } from '@ember/component';
 
 var TEMPLATE = 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>");
 
-var _class;
-let HdsTabsPanel = (_class = class HdsTabsPanel extends Component {
-  constructor(...args) {
-    super(...args);
-    /**
-     * Generate a unique ID for the Panel
-     * @return {string}
-     * @param _panelId
-     */
-    _defineProperty(this, "_panelId", 'panel-' + guidFor(this));
-    _defineProperty(this, "_elementId", void 0);
-  }
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+class HdsTabsPanel extends Component {
+  /**
+   * Generate a unique ID for the Panel
+   * @return {string}
+   * @param _panelId
+   */
+  _panelId = 'panel-' + guidFor(this);
+  _elementId;
   get nodeIndex() {
     return this.args.panelIds ? this.args.panelIds.indexOf(this._panelId) : undefined;
   }
@@ -47,6 +48,9 @@ let HdsTabsPanel = (_class = class HdsTabsPanel extends Component {
       didInsertNode(element, this._elementId);
     }
   }
+  static {
+    n(this.prototype, "didInsertNode", [action]);
+  }
   willDestroyNode(element) {
     const {
       willDestroyNode
@@ -55,7 +59,10 @@ let HdsTabsPanel = (_class = class HdsTabsPanel extends Component {
       willDestroyNode(element);
     }
   }
-}, _applyDecoratedDescriptor(_class.prototype, "didInsertNode", [action], Object.getOwnPropertyDescriptor(_class.prototype, "didInsertNode"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "willDestroyNode", [action], Object.getOwnPropertyDescriptor(_class.prototype, "willDestroyNode"), _class.prototype), _class);
+  static {
+    n(this.prototype, "willDestroyNode", [action]);
+  }
+}
 setComponentTemplate(TEMPLATE, HdsTabsPanel);
 
 export { HdsTabsPanel as default };

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   * @param _panelId\n   */\n  private _panelId = 'panel-' + guidFor(this);\n\n  private _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,uYAAuY;;;AC4BpZA,IAAAA,YAAY,IAAAC,MAAA,GAAlB,MAAMD,YAAY,SAASE,SAAS,CAAwB;AAAAC,EAAAA,WAAAA,CAAA,GAAAC,IAAA,EAAA;AAAA,IAAA,KAAA,CAAA,GAAAA,IAAA,CAAA;AACzE;AACF;AACA;AACA;AACA;AAJEC,IAAAA,eAAA,mBAKmB,QAAQ,GAAGC,OAAO,CAAC,IAAI,CAAC,CAAA;IAAAD,eAAA,CAAA,IAAA,EAAA,YAAA,EAAA,KAAA,CAAA,CAAA;AAAA;EAI3C,IAAIE,SAASA,GAAuB;AAClC,IAAA,OAAO,IAAI,CAACH,IAAI,CAACI,QAAQ,GACrB,IAAI,CAACJ,IAAI,CAACI,QAAQ,CAACC,OAAO,CAAC,IAAI,CAACC,QAAQ,CAAC,GACzCC,SAAS;AACf;;AAEA;AACF;AACA;AACA;EACE,IAAIC,SAASA,GAAY;IACvB,OAAO,IAAI,CAACL,SAAS,KAAK,IAAI,CAACH,IAAI,CAACS,gBAAgB;AACtD;;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;AACf;EAGAK,aAAaA,CAACC,OAAoB,EAAQ;IACxC,MAAM;AAAED,MAAAA;KAAe,GAAG,IAAI,CAACZ,IAAI;AAEnC,IAAA,IAAI,OAAOY,aAAa,KAAK,UAAU,EAAE;AACvC,MAAA,IAAI,CAACE,UAAU,GAAGD,OAAO,CAACE,EAAE;AAC5BH,MAAAA,aAAa,CAACC,OAAO,EAAE,IAAI,CAACC,UAAU,CAAC;AACzC;AACF;EAGAE,eAAeA,CAACH,OAAoB,EAAQ;IAC1C,MAAM;AAAEG,MAAAA;KAAiB,GAAG,IAAI,CAAChB,IAAI;AAErC,IAAA,IAAI,OAAOgB,eAAe,KAAK,UAAU,EAAE;MACzCA,eAAe,CAACH,OAAO,CAAC;AAC1B;AACF;AACF,CAAC,EAAAI,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,GAAArB,MAAA;AA5CwByB,oBAAA,CAAAC,QAAA,EAAZ3B,YAAY,CAAA;;;;"}
+{"version":3,"file":"panel.js","sources":["../../../../src/components/hds/tabs/panel.ts"],"sourcesContent":["/**\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   * @param _panelId\n   */\n  private _panelId = 'panel-' + guidFor(this);\n\n  private _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","Component","_panelId","guidFor","_elementId","nodeIndex","args","panelIds","indexOf","undefined","isVisible","selectedTabIndex","coupledTabId","tabIds","didInsertNode","element","id","n","prototype","action","willDestroyNode","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AACA;;AA0Be,MAAMA,YAAY,SAASC,SAAS,CAAwB;AACzE;AACF;AACA;AACA;AACA;AACUC,EAAAA,QAAQ,GAAG,QAAQ,GAAGC,OAAO,CAAC,IAAI,CAAC;EAEnCC,UAAU;EAElB,IAAIC,SAASA,GAAuB;AAClC,IAAA,OAAO,IAAI,CAACC,IAAI,CAACC,QAAQ,GACrB,IAAI,CAACD,IAAI,CAACC,QAAQ,CAACC,OAAO,CAAC,IAAI,CAACN,QAAQ,CAAC,GACzCO,SAAS;AACf;;AAEA;AACF;AACA;AACA;EACE,IAAIC,SAASA,GAAY;IACvB,OAAO,IAAI,CAACL,SAAS,KAAK,IAAI,CAACC,IAAI,CAACK,gBAAgB;AACtD;;AAEA;AACF;AACA;AACA;EACE,IAAIC,YAAYA,GAAuB;AACrC,IAAA,OAAO,IAAI,CAACP,SAAS,KAAKI,SAAS,GAC/B,IAAI,CAACH,IAAI,CAACO,MAAM,GAAG,IAAI,CAACR,SAAS,CAAC,GAClCI,SAAS;AACf;EAGAK,aAAaA,CAACC,OAAoB,EAAQ;IACxC,MAAM;AAAED,MAAAA;KAAe,GAAG,IAAI,CAACR,IAAI;AAEnC,IAAA,IAAI,OAAOQ,aAAa,KAAK,UAAU,EAAE;AACvC,MAAA,IAAI,CAACV,UAAU,GAAGW,OAAO,CAACC,EAAE;AAC5BF,MAAAA,aAAa,CAACC,OAAO,EAAE,IAAI,CAACX,UAAU,CAAC;AACzC;AACF;AAAC,EAAA;IAAAa,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,eAAA,EAAA,CARAC,MAAM,CAAA,CAAA;AAAA;EAWPC,eAAeA,CAACL,OAAoB,EAAQ;IAC1C,MAAM;AAAEK,MAAAA;KAAiB,GAAG,IAAI,CAACd,IAAI;AAErC,IAAA,IAAI,OAAOc,eAAe,KAAK,UAAU,EAAE;MACzCA,eAAe,CAACL,OAAO,CAAC;AAC1B;AACF;AAAC,EAAA;IAAAE,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,iBAAA,EAAA,CAPAC,MAAM,CAAA,CAAA;AAAA;AAQT;AAACE,oBAAA,CAAAC,QAAA,EApDoBtB,YAAY,CAAA;;;;"}

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

@@ -1,23 +1,24 @@
-import { _ as _applyDecoratedDescriptor, a as _defineProperty } from '../../../_rollupPluginBabelHelpers-81503waH.js';
 import Component from '@glimmer/component';
 import { guidFor } from '@ember/object/internals';
 import { action } from '@ember/object';
 import { precompileTemplate } from '@ember/template-compilation';
+import { n } from 'decorator-transforms/runtime';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = 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 }}");
+var TEMPLATE = 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-controls={{this.coupledPanelId}}\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 }}");
 
-var _class;
-let HdsTabsTab = (_class = class HdsTabsTab extends Component {
-  constructor(...args) {
-    super(...args);
-    /**
-     * Generate a unique ID for the Tab
-     * @return {string}
-     * @param _tabId
-     */
-    _defineProperty(this, "_tabId", 'tab-' + guidFor(this));
-  }
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+class HdsTabsTab extends Component {
+  /**
+   * Generate a unique ID for the Tab
+   * @return {string}
+   * @param _tabId
+   */
+  _tabId = 'tab-' + guidFor(this);
   get nodeIndex() {
     return this.args.tabIds?.indexOf(this._tabId);
   }
@@ -30,6 +31,14 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
   get isSelected() {
     return this.nodeIndex !== undefined && this.nodeIndex === this.args.selectedTabIndex;
   }
+
+  /**
+   * Get the ID of the panel coupled/associated with the tab (it's used by the `aria-controls` attribute)
+   * @returns string}
+   */
+  get coupledPanelId() {
+    return this.nodeIndex !== undefined ? this.args.panelIds?.[this.nodeIndex] : undefined;
+  }
   didInsertNode(element, positional) {
     const {
       didInsertNode
@@ -39,6 +48,9 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
       didInsertNode(element, isSelected);
     }
   }
+  static {
+    n(this.prototype, "didInsertNode", [action]);
+  }
   didUpdateNode() {
     const {
       didUpdateNode
@@ -47,6 +59,9 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
       didUpdateNode(this.nodeIndex, this.args.isSelected);
     }
   }
+  static {
+    n(this.prototype, "didUpdateNode", [action]);
+  }
   willDestroyNode(element) {
     const {
       willDestroyNode
@@ -55,6 +70,9 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
       willDestroyNode(element);
     }
   }
+  static {
+    n(this.prototype, "willDestroyNode", [action]);
+  }
   onClick(event) {
     const {
       onClick
@@ -65,6 +83,9 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
       return false;
     }
   }
+  static {
+    n(this.prototype, "onClick", [action]);
+  }
   onKeyUp(event) {
     const {
       onKeyUp
@@ -79,6 +100,9 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
    * @method classNames
    * @return {string} The "class" attribute to apply to the component.
    */
+  static {
+    n(this.prototype, "onKeyUp", [action]);
+  }
   get classNames() {
     const classes = ['hds-tabs__tab'];
     if (this.isSelected) {
@@ -86,7 +110,7 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
     }
     return classes.join(' ');
   }
-}, _applyDecoratedDescriptor(_class.prototype, "didInsertNode", [action], Object.getOwnPropertyDescriptor(_class.prototype, "didInsertNode"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "didUpdateNode", [action], Object.getOwnPropertyDescriptor(_class.prototype, "didUpdateNode"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "willDestroyNode", [action], Object.getOwnPropertyDescriptor(_class.prototype, "willDestroyNode"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "onClick", [action], Object.getOwnPropertyDescriptor(_class.prototype, "onClick"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "onKeyUp", [action], Object.getOwnPropertyDescriptor(_class.prototype, "onKeyUp"), _class.prototype), _class);
+}
 setComponentTemplate(TEMPLATE, HdsTabsTab);
 
 export { HdsTabsTab as default };

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   * @param _tabId\n   */\n  private _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.ts"],"sourcesContent":["/**\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, HdsTabsPanelIds } from './types';\n\nexport interface HdsTabsTabSignature {\n  Args: {\n    tabIds?: HdsTabsTabIds;\n    panelIds?: HdsTabsPanelIds;\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   * @param _tabId\n   */\n  private _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  /**\n   * Get the ID of the panel coupled/associated with the tab (it's used by the `aria-controls` attribute)\n   * @returns string}\n   */\n  get coupledPanelId(): string | undefined {\n    return this.nodeIndex !== undefined\n      ? this.args.panelIds?.[this.nodeIndex]\n      : undefined;\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","Component","_tabId","guidFor","nodeIndex","args","tabIds","indexOf","isSelected","undefined","selectedTabIndex","coupledPanelId","panelIds","didInsertNode","element","positional","n","prototype","action","didUpdateNode","willDestroyNode","onClick","event","onKeyUp","classNames","classes","push","join","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AACA;;AA4Be,MAAMA,UAAU,SAASC,SAAS,CAAsB;AACrE;AACF;AACA;AACA;AACA;AACUC,EAAAA,MAAM,GAAG,MAAM,GAAGC,OAAO,CAAC,IAAI,CAAC;EAEvC,IAAIC,SAASA,GAAuB;IAClC,OAAO,IAAI,CAACC,IAAI,CAACC,MAAM,EAAEC,OAAO,CAAC,IAAI,CAACL,MAAM,CAAC;AAC/C;;AAEA;AACF;AACA;AACA;AACA;EACE,IAAIM,UAAUA,GAAY;AACxB,IAAA,OACE,IAAI,CAACJ,SAAS,KAAKK,SAAS,IAC5B,IAAI,CAACL,SAAS,KAAK,IAAI,CAACC,IAAI,CAACK,gBAAgB;AAEjD;;AAEA;AACF;AACA;AACA;EACE,IAAIC,cAAcA,GAAuB;AACvC,IAAA,OAAO,IAAI,CAACP,SAAS,KAAKK,SAAS,GAC/B,IAAI,CAACJ,IAAI,CAACO,QAAQ,GAAG,IAAI,CAACR,SAAS,CAAC,GACpCK,SAAS;AACf;AAGAI,EAAAA,aAAaA,CAACC,OAA0B,EAAEC,UAAsB,EAAQ;IACtE,MAAM;AAAEF,MAAAA;KAAe,GAAG,IAAI,CAACR,IAAI;AAEnC,IAAA,MAAMG,UAAU,GAAGO,UAAU,CAAC,CAAC,CAAC;AAEhC,IAAA,IAAI,OAAOF,aAAa,KAAK,UAAU,EAAE;AACvCA,MAAAA,aAAa,CAACC,OAAO,EAAEN,UAAU,CAAC;AACpC;AACF;AAAC,EAAA;IAAAQ,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,eAAA,EAAA,CATAC,MAAM,CAAA,CAAA;AAAA;AAYPC,EAAAA,aAAaA,GAAS;IACpB,MAAM;AAAEA,MAAAA;KAAe,GAAG,IAAI,CAACd,IAAI;IAEnC,IAAI,OAAOc,aAAa,KAAK,UAAU,IAAI,IAAI,CAACf,SAAS,KAAKK,SAAS,EAAE;MACvEU,aAAa,CAAC,IAAI,CAACf,SAAS,EAAE,IAAI,CAACC,IAAI,CAACG,UAAU,CAAC;AACrD;AACF;AAAC,EAAA;IAAAQ,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,eAAA,EAAA,CAPAC,MAAM,CAAA,CAAA;AAAA;EAUPE,eAAeA,CAACN,OAA0B,EAAQ;IAChD,MAAM;AAAEM,MAAAA;KAAiB,GAAG,IAAI,CAACf,IAAI;AAErC,IAAA,IAAI,OAAOe,eAAe,KAAK,UAAU,EAAE;MACzCA,eAAe,CAACN,OAAO,CAAC;AAC1B;AACF;AAAC,EAAA;IAAAE,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,iBAAA,EAAA,CAPAC,MAAM,CAAA,CAAA;AAAA;EAUPG,OAAOA,CAACC,KAAiB,EAAqB;IAC5C,MAAM;AAAED,MAAAA;KAAS,GAAG,IAAI,CAAChB,IAAI;IAE7B,IAAI,OAAOgB,OAAO,KAAK,UAAU,IAAI,IAAI,CAACjB,SAAS,KAAKK,SAAS,EAAE;AACjEY,MAAAA,OAAO,CAACC,KAAK,EAAE,IAAI,CAAClB,SAAS,CAAC;AAChC,KAAC,MAAM;AACL,MAAA,OAAO,KAAK;AACd;AACF;AAAC,EAAA;IAAAY,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,SAAA,EAAA,CATAC,MAAM,CAAA,CAAA;AAAA;EAYPK,OAAOA,CAACD,KAAoB,EAAQ;IAClC,MAAM;AAAEC,MAAAA;KAAS,GAAG,IAAI,CAAClB,IAAI;IAE7B,IAAI,OAAOkB,OAAO,KAAK,UAAU,IAAI,IAAI,CAACnB,SAAS,KAAKK,SAAS,EAAE;AACjEc,MAAAA,OAAO,CAAC,IAAI,CAACnB,SAAS,EAAEkB,KAAK,CAAC;AAChC;AACF;;AAEA;AACF;AACA;AACA;AACA;AAJE,EAAA;IAAAN,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,SAAA,EAAA,CATCC,MAAM,CAAA,CAAA;AAAA;EAcP,IAAIM,UAAUA,GAAW;AACvB,IAAA,MAAMC,OAAO,GAAG,CAAC,eAAe,CAAC;IAEjC,IAAI,IAAI,CAACjB,UAAU,EAAE;AACnBiB,MAAAA,OAAO,CAACC,IAAI,CAAC,CAAA,0BAAA,CAA4B,CAAC;AAC5C;AAEA,IAAA,OAAOD,OAAO,CAACE,IAAI,CAAC,GAAG,CAAC;AAC1B;AACF;AAACC,oBAAA,CAAAC,QAAA,EAjGoB7B,UAAU,CAAA;;;;"}

package/dist/components/hds/tag/index.js

@@ -1,10 +1,13 @@
 import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
 import { assert } from '@ember/debug';
-import { HdsTagColorValues } from './types.js';
+import { modifier } from 'ember-modifier';
+import { HdsTagColorValues, HdsTagTooltipPlacementValues } from './types.js';
 import { precompileTemplate } from '@ember/template-compilation';
+import { g, i } from 'decorator-transforms/runtime';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n<Hds::Text::Body class={{this.classNames}} @tag=\"span\" @size=\"100\" @weight=\"medium\" @color=\"primary\" ...attributes>\n  {{#if this.onDismiss}}\n    <button class=\"hds-tag__dismiss\" type=\"button\" aria-label={{this.ariaLabel}} {{on \"click\" this.onDismiss}}>\n      <Hds::Icon class=\"hds-tag__dismiss-icon\" @name=\"x\" @size=\"16\" />\n    </button>\n  {{/if}}\n  {{#if (or @href @route)}}\n    <Hds::Interactive\n      class=\"hds-tag__link\"\n      @current-when={{@current-when}}\n      @models={{hds-link-to-models @model @models}}\n      @query={{hds-link-to-query @query}}\n      @replace={{@replace}}\n      @route={{@route}}\n      @isRouteExternal={{@isRouteExternal}}\n      @href={{@href}}\n      @isHrefExternal={{@isHrefExternal}}\n    >\n      {{this.text}}\n    </Hds::Interactive>\n  {{else}}\n    <span class=\"hds-tag__text\">\n      {{this.text}}\n    </span>\n  {{/if}}\n</Hds::Text::Body>");
+var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n<Hds::Text::Body\n  class={{this.classNames}}\n  @tag=\"span\"\n  @size=\"100\"\n  @weight=\"medium\"\n  @color=\"primary\"\n  {{this._setUpObserver}}\n  ...attributes\n>\n  {{#if this.onDismiss}}\n    <button class=\"hds-tag__dismiss\" type=\"button\" aria-label={{this.ariaLabel}} {{on \"click\" this.onDismiss}}>\n      <Hds::Icon class=\"hds-tag__dismiss-icon\" @name=\"x\" @size=\"16\" />\n    </button>\n  {{/if}}\n  {{#if (or @href @route)}}\n    {{#if this._isTextOverflow}}\n      <Hds::Interactive\n        class=\"hds-tag__link\"\n        @current-when={{@current-when}}\n        @models={{hds-link-to-models @model @models}}\n        @query={{hds-link-to-query @query}}\n        @replace={{@replace}}\n        @route={{@route}}\n        @isRouteExternal={{@isRouteExternal}}\n        @href={{@href}}\n        @isHrefExternal={{@isHrefExternal}}\n        {{hds-tooltip this.text options=(hash placement=this.tooltipPlacement)}}\n      >\n        <div class=\"hds-tag__text-container\">\n          {{this.text}}\n        </div>\n      </Hds::Interactive>\n    {{else}}\n      <Hds::Interactive\n        class=\"hds-tag__link\"\n        @current-when={{@current-when}}\n        @models={{hds-link-to-models @model @models}}\n        @query={{hds-link-to-query @query}}\n        @replace={{@replace}}\n        @route={{@route}}\n        @isRouteExternal={{@isRouteExternal}}\n        @href={{@href}}\n        @isHrefExternal={{@isHrefExternal}}\n      >\n        <div class=\"hds-tag__text-container\">\n          {{this.text}}\n        </div>\n      </Hds::Interactive>\n    {{/if}}\n  {{else}}\n    {{#if this._isTextOverflow}}\n      <Hds::TooltipButton class=\"hds-tag__text\" @text={{this.text}} @placement={{this.tooltipPlacement}}>\n        <div class=\"hds-tag__text-container\">\n          {{this.text}}\n        </div>\n      </Hds::TooltipButton>\n    {{else}}\n      <span class=\"hds-tag__text\">\n        <div class=\"hds-tag__text-container\">\n          {{this.text}}\n        </div>\n      </span>\n    {{/if}}\n  {{/if}}\n</Hds::Text::Body>");
 
 /**
  * Copyright (c) HashiCorp, Inc.
@@ -13,7 +16,41 @@ var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-
 
 const COLORS = Object.values(HdsTagColorValues);
 const DEFAULT_COLOR = HdsTagColorValues.Primary;
+const TOOLTIP_PLACEMENTS = Object.values(HdsTagTooltipPlacementValues);
+const DEFAULT_TOOLTIP_PLACEMENT = HdsTagTooltipPlacementValues.Top;
 class HdsTag extends Component {
+  static {
+    g(this.prototype, "_isTextOverflow", [tracked]);
+  }
+  #_isTextOverflow = (i(this, "_isTextOverflow"), undefined);
+  _observer;
+  _setUpObserver = modifier(element => {
+    // Used to detect when text is clipped to one line, and tooltip should be added
+    this._observer = new ResizeObserver(entries => {
+      entries.forEach(entry => {
+        this._isTextOverflow = this._isOverflow(entry.target.querySelector('.hds-tag__text-container'));
+      });
+    });
+    this._observer.observe(element);
+    return () => {
+      this._observer.disconnect();
+    };
+  });
+
+  /**
+   * @param tooltioPlacement
+   * @type {string}
+   * @default top
+   * @description The placement property of the tooltip attached to the tag text.
+   */
+  get tooltipPlacement() {
+    const {
+      tooltipPlacement = DEFAULT_TOOLTIP_PLACEMENT
+    } = this.args;
+    assert('@tooltipPlacement for "Hds::Tag" must have a valid value', tooltipPlacement == undefined || TOOLTIP_PLACEMENTS.includes(tooltipPlacement));
+    return tooltipPlacement;
+  }
+
   /**
    * @param onDismiss
    * @type {function}
@@ -87,8 +124,11 @@ class HdsTag extends Component {
     }
     return classes.join(' ');
   }
+  _isOverflow(el) {
+    return el.scrollHeight > el.clientHeight;
+  }
 }
 setComponentTemplate(TEMPLATE, HdsTag);
 
-export { COLORS, DEFAULT_COLOR, HdsTag as default };
+export { COLORS, DEFAULT_COLOR, DEFAULT_TOOLTIP_PLACEMENT, TOOLTIP_PLACEMENTS, HdsTag as default };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/hds/tag/index.hbs","../../../../src/components/hds/tag/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<Hds::Text::Body class={{this.classNames}} @tag=\\\"span\\\" @size=\\\"100\\\" @weight=\\\"medium\\\" @color=\\\"primary\\\" ...attributes>\\n  {{#if this.onDismiss}}\\n    <button class=\\\"hds-tag__dismiss\\\" type=\\\"button\\\" aria-label={{this.ariaLabel}} {{on \\\"click\\\" this.onDismiss}}>\\n      <Hds::Icon class=\\\"hds-tag__dismiss-icon\\\" @name=\\\"x\\\" @size=\\\"16\\\" />\\n    </button>\\n  {{/if}}\\n  {{#if (or @href @route)}}\\n    <Hds::Interactive\\n      class=\\\"hds-tag__link\\\"\\n      @current-when={{@current-when}}\\n      @models={{hds-link-to-models @model @models}}\\n      @query={{hds-link-to-query @query}}\\n      @replace={{@replace}}\\n      @route={{@route}}\\n      @isRouteExternal={{@isRouteExternal}}\\n      @href={{@href}}\\n      @isHrefExternal={{@isHrefExternal}}\\n    >\\n      {{this.text}}\\n    </Hds::Interactive>\\n  {{else}}\\n    <span class=\\\"hds-tag__text\\\">\\n      {{this.text}}\\n    </span>\\n  {{/if}}\\n</Hds::Text::Body>\")","/**\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 { HdsTagColorValues } from './types.ts';\nimport type { HdsTagColors } from './types.ts';\nimport type { HdsInteractiveSignature } from '../interactive/';\n\nexport const COLORS: string[] = Object.values(HdsTagColorValues);\nexport const DEFAULT_COLOR = HdsTagColorValues.Primary;\n\nexport interface HdsTagSignature {\n  Args: HdsInteractiveSignature['Args'] & {\n    color?: HdsTagColors;\n    text: string;\n    ariaLabel?: string;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    onDismiss?: (event: MouseEvent, ...args: any[]) => void;\n  };\n  Element: HTMLSpanElement;\n}\n\nexport default class HdsTag extends Component<HdsTagSignature> {\n  /**\n   * @param onDismiss\n   * @type {function}\n   * @default () => {}\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  get onDismiss(): ((event: MouseEvent, ...args: any[]) => void) | false {\n    const { onDismiss } = this.args;\n\n    if (typeof onDismiss === 'function') {\n      return onDismiss;\n    } else {\n      return false;\n    }\n  }\n\n  /**\n   * @param text\n   * @type {string}\n   * @description The text of the tag. If no text value is defined, an error will be thrown.\n   */\n  get text(): string {\n    const { text } = this.args;\n\n    assert('@text for \"Hds::Tag\" must have a valid value', text !== undefined);\n\n    return text;\n  }\n\n  /**\n   * @param ariaLabel\n   * @type {string}\n   * @default 'Dismiss'\n   */\n  get ariaLabel(): string {\n    const tagAriaLabel = this.args.ariaLabel ?? 'Dismiss';\n    return tagAriaLabel + ' ' + this.args.text;\n  }\n\n  /**\n   * @param color\n   * @type {string}\n   * @default primary\n   * @description Determines the color of link to be used; acceptable values are `primary` and `secondary`\n   */\n  get color(): HdsTagColors | false {\n    if (this.args.href || this.args.route) {\n      const { color = DEFAULT_COLOR } = this.args;\n      assert(\n        `@color for \"Hds::Tag\" must be one of the following: ${COLORS.join(\n          ', '\n        )}; received: ${color}`,\n        COLORS.includes(color)\n      );\n      return color;\n    } else if (this.args.color) {\n      assert(\n        '@color can only be applied to \"Hds::Tag\" along with either @href or @route',\n        this.args.href || this.args.route\n      );\n    }\n    return false;\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-tag'];\n\n    // add a class based on the @color argument\n    if (this.color) {\n      classes.push(`hds-tag--color-${this.color}`);\n    }\n\n    return classes.join(' ');\n  }\n}\n"],"names":["COLORS","Object","values","HdsTagColorValues","DEFAULT_COLOR","Primary","HdsTag","Component","onDismiss","args","text","assert","undefined","ariaLabel","tagAriaLabel","color","href","route","join","includes","classNames","classes","push","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;AACA,eAAe,kBAAkB,CAAC,y+BAAy+B;;ACD3gC;AACA;AACA;AACA;;AASO,MAAMA,MAAgB,GAAGC,MAAM,CAACC,MAAM,CAACC,iBAAiB;AAClDC,MAAAA,aAAa,GAAGD,iBAAiB,CAACE;AAahC,MAAMC,MAAM,SAASC,SAAS,CAAkB;AAC7D;AACF;AACA;AACA;AACA;AACE;EACA,IAAIC,SAASA,GAA0D;IACrE,MAAM;AAAEA,MAAAA;KAAW,GAAG,IAAI,CAACC,IAAI;AAE/B,IAAA,IAAI,OAAOD,SAAS,KAAK,UAAU,EAAE;AACnC,MAAA,OAAOA,SAAS;AAClB,KAAC,MAAM;AACL,MAAA,OAAO,KAAK;AACd;AACF;;AAEA;AACF;AACA;AACA;AACA;EACE,IAAIE,IAAIA,GAAW;IACjB,MAAM;AAAEA,MAAAA;KAAM,GAAG,IAAI,CAACD,IAAI;AAE1BE,IAAAA,MAAM,CAAC,8CAA8C,EAAED,IAAI,KAAKE,SAAS,CAAC;AAE1E,IAAA,OAAOF,IAAI;AACb;;AAEA;AACF;AACA;AACA;AACA;EACE,IAAIG,SAASA,GAAW;IACtB,MAAMC,YAAY,GAAG,IAAI,CAACL,IAAI,CAACI,SAAS,IAAI,SAAS;IACrD,OAAOC,YAAY,GAAG,GAAG,GAAG,IAAI,CAACL,IAAI,CAACC,IAAI;AAC5C;;AAEA;AACF;AACA;AACA;AACA;AACA;EACE,IAAIK,KAAKA,GAAyB;IAChC,IAAI,IAAI,CAACN,IAAI,CAACO,IAAI,IAAI,IAAI,CAACP,IAAI,CAACQ,KAAK,EAAE;MACrC,MAAM;AAAEF,QAAAA,KAAK,GAAGX;OAAe,GAAG,IAAI,CAACK,IAAI;AAC3CE,MAAAA,MAAM,CACJ,CAAuDX,oDAAAA,EAAAA,MAAM,CAACkB,IAAI,CAChE,IACF,CAAC,CAAA,YAAA,EAAeH,KAAK,CAAA,CAAE,EACvBf,MAAM,CAACmB,QAAQ,CAACJ,KAAK,CACvB,CAAC;AACD,MAAA,OAAOA,KAAK;AACd,KAAC,MAAM,IAAI,IAAI,CAACN,IAAI,CAACM,KAAK,EAAE;AAC1BJ,MAAAA,MAAM,CACJ,4EAA4E,EAC5E,IAAI,CAACF,IAAI,CAACO,IAAI,IAAI,IAAI,CAACP,IAAI,CAACQ,KAC9B,CAAC;AACH;AACA,IAAA,OAAO,KAAK;AACd;;AAEA;AACF;AACA;AACA;AACA;EACE,IAAIG,UAAUA,GAAW;AACvB,IAAA,MAAMC,OAAO,GAAG,CAAC,SAAS,CAAC;;AAE3B;IACA,IAAI,IAAI,CAACN,KAAK,EAAE;MACdM,OAAO,CAACC,IAAI,CAAC,CAAA,eAAA,EAAkB,IAAI,CAACP,KAAK,EAAE,CAAC;AAC9C;AAEA,IAAA,OAAOM,OAAO,CAACH,IAAI,CAAC,GAAG,CAAC;AAC1B;AACF;AAACK,oBAAA,CAAAC,QAAA,EAhFoBlB,MAAM,CAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/hds/tag/index.ts"],"sourcesContent":["/**\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 { assert } from '@ember/debug';\nimport { modifier } from 'ember-modifier';\n\nimport { HdsTagColorValues } from './types.ts';\nimport type { HdsTagColors } from './types.ts';\nimport { HdsTagTooltipPlacementValues } from './types.ts';\nimport type { HdsTagTooltipPlacements } from './types.ts';\nimport type { HdsInteractiveSignature } from '../interactive/';\n\nexport const COLORS: string[] = Object.values(HdsTagColorValues);\nexport const DEFAULT_COLOR = HdsTagColorValues.Primary;\nexport const TOOLTIP_PLACEMENTS: string[] = Object.values(\n  HdsTagTooltipPlacementValues\n);\nexport const DEFAULT_TOOLTIP_PLACEMENT = HdsTagTooltipPlacementValues.Top;\n\nexport interface HdsTagSignature {\n  Args: HdsInteractiveSignature['Args'] & {\n    color?: HdsTagColors;\n    text: string;\n    ariaLabel?: string;\n    tooltipPlacement: HdsTagTooltipPlacements;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    onDismiss?: (event: MouseEvent, ...args: any[]) => void;\n  };\n  Element: HTMLSpanElement;\n}\n\nexport default class HdsTag extends Component<HdsTagSignature> {\n  @tracked private _isTextOverflow!: boolean;\n  private _observer!: ResizeObserver;\n\n  private _setUpObserver = modifier((element: HTMLElement) => {\n    // Used to detect when text is clipped to one line, and tooltip should be added\n    this._observer = new ResizeObserver((entries) => {\n      entries.forEach((entry) => {\n        this._isTextOverflow = this._isOverflow(\n          entry.target.querySelector('.hds-tag__text-container')!\n        );\n      });\n    });\n    this._observer.observe(element);\n\n    return () => {\n      this._observer.disconnect();\n    };\n  });\n\n  /**\n   * @param tooltioPlacement\n   * @type {string}\n   * @default top\n   * @description The placement property of the tooltip attached to the tag text.\n   */\n  get tooltipPlacement(): HdsTagTooltipPlacements {\n    const { tooltipPlacement = DEFAULT_TOOLTIP_PLACEMENT } = this.args;\n\n    assert(\n      '@tooltipPlacement for \"Hds::Tag\" must have a valid value',\n      tooltipPlacement == undefined ||\n        TOOLTIP_PLACEMENTS.includes(tooltipPlacement)\n    );\n\n    return tooltipPlacement;\n  }\n\n  /**\n   * @param onDismiss\n   * @type {function}\n   * @default () => {}\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  get onDismiss(): ((event: MouseEvent, ...args: any[]) => void) | false {\n    const { onDismiss } = this.args;\n\n    if (typeof onDismiss === 'function') {\n      return onDismiss;\n    } else {\n      return false;\n    }\n  }\n\n  /**\n   * @param text\n   * @type {string}\n   * @description The text of the tag. If no text value is defined, an error will be thrown.\n   */\n  get text(): string {\n    const { text } = this.args;\n\n    assert('@text for \"Hds::Tag\" must have a valid value', text !== undefined);\n\n    return text;\n  }\n\n  /**\n   * @param ariaLabel\n   * @type {string}\n   * @default 'Dismiss'\n   */\n  get ariaLabel(): string {\n    const tagAriaLabel = this.args.ariaLabel ?? 'Dismiss';\n    return tagAriaLabel + ' ' + this.args.text;\n  }\n\n  /**\n   * @param color\n   * @type {string}\n   * @default primary\n   * @description Determines the color of link to be used; acceptable values are `primary` and `secondary`\n   */\n  get color(): HdsTagColors | false {\n    if (this.args.href || this.args.route) {\n      const { color = DEFAULT_COLOR } = this.args;\n      assert(\n        `@color for \"Hds::Tag\" must be one of the following: ${COLORS.join(\n          ', '\n        )}; received: ${color}`,\n        COLORS.includes(color)\n      );\n      return color;\n    } else if (this.args.color) {\n      assert(\n        '@color can only be applied to \"Hds::Tag\" along with either @href or @route',\n        this.args.href || this.args.route\n      );\n    }\n    return false;\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-tag'];\n\n    // add a class based on the @color argument\n    if (this.color) {\n      classes.push(`hds-tag--color-${this.color}`);\n    }\n\n    return classes.join(' ');\n  }\n\n  private _isOverflow(el: Element): boolean {\n    return el.scrollHeight > el.clientHeight;\n  }\n}\n"],"names":["COLORS","Object","values","HdsTagColorValues","DEFAULT_COLOR","Primary","TOOLTIP_PLACEMENTS","HdsTagTooltipPlacementValues","DEFAULT_TOOLTIP_PLACEMENT","Top","HdsTag","Component","g","prototype","tracked","i","void 0","_observer","_setUpObserver","modifier","element","ResizeObserver","entries","forEach","entry","_isTextOverflow","_isOverflow","target","querySelector","observe","disconnect","tooltipPlacement","args","assert","undefined","includes","onDismiss","text","ariaLabel","tagAriaLabel","color","href","route","join","classNames","classes","push","el","scrollHeight","clientHeight","setComponentTemplate","TEMPLATE"],"mappings":"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"}

package/dist/components/hds/tag/types.js

@@ -8,6 +8,21 @@ let HdsTagColorValues = /*#__PURE__*/function (HdsTagColorValues) {
   HdsTagColorValues["Secondary"] = "secondary";
   return HdsTagColorValues;
 }({});
+let HdsTagTooltipPlacementValues = /*#__PURE__*/function (HdsTagTooltipPlacementValues) {
+  HdsTagTooltipPlacementValues["Top"] = "top";
+  HdsTagTooltipPlacementValues["TopStart"] = "top-start";
+  HdsTagTooltipPlacementValues["TopEnd"] = "top-end";
+  HdsTagTooltipPlacementValues["Right"] = "right";
+  HdsTagTooltipPlacementValues["RightStart"] = "right-start";
+  HdsTagTooltipPlacementValues["RightEnd"] = "right-end";
+  HdsTagTooltipPlacementValues["Bottom"] = "bottom";
+  HdsTagTooltipPlacementValues["BottomStart"] = "bottom-start";
+  HdsTagTooltipPlacementValues["BottomEnd"] = "bottom-end";
+  HdsTagTooltipPlacementValues["Left"] = "left";
+  HdsTagTooltipPlacementValues["LeftStart"] = "left-start";
+  HdsTagTooltipPlacementValues["LeftEnd"] = "left-end";
+  return HdsTagTooltipPlacementValues;
+}({});
 
-export { HdsTagColorValues };
+export { HdsTagColorValues, HdsTagTooltipPlacementValues };
 //# sourceMappingURL=types.js.map

package/dist/components/hds/tag/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sources":["../../../../src/components/hds/tag/types.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nexport enum HdsTagColorValues {\n  Primary = 'primary',\n  Secondary = 'secondary',\n}\nexport type HdsTagColors = `${HdsTagColorValues}`;\n"],"names":["HdsTagColorValues"],"mappings":"AAAA;AACA;AACA;AACA;;AAEYA,IAAAA,iBAAiB,0BAAjBA,iBAAiB,EAAA;EAAjBA,iBAAiB,CAAA,SAAA,CAAA,GAAA,SAAA;EAAjBA,iBAAiB,CAAA,WAAA,CAAA,GAAA,WAAA;AAAA,EAAA,OAAjBA,iBAAiB;AAAA,CAAA,CAAA,EAAA;;;;"}
+{"version":3,"file":"types.js","sources":["../../../../src/components/hds/tag/types.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nexport enum HdsTagColorValues {\n  Primary = 'primary',\n  Secondary = 'secondary',\n}\nexport type HdsTagColors = `${HdsTagColorValues}`;\n\nexport enum HdsTagTooltipPlacementValues {\n  Top = 'top',\n  TopStart = 'top-start',\n  TopEnd = 'top-end',\n  Right = 'right',\n  RightStart = 'right-start',\n  RightEnd = 'right-end',\n  Bottom = 'bottom',\n  BottomStart = 'bottom-start',\n  BottomEnd = 'bottom-end',\n  Left = 'left',\n  LeftStart = 'left-start',\n  LeftEnd = 'left-end',\n}\n\nexport type HdsTagTooltipPlacements = `${HdsTagTooltipPlacementValues}`;\n"],"names":["HdsTagColorValues","HdsTagTooltipPlacementValues"],"mappings":"AAAA;AACA;AACA;AACA;;AAEYA,IAAAA,iBAAiB,0BAAjBA,iBAAiB,EAAA;EAAjBA,iBAAiB,CAAA,SAAA,CAAA,GAAA,SAAA;EAAjBA,iBAAiB,CAAA,WAAA,CAAA,GAAA,WAAA;AAAA,EAAA,OAAjBA,iBAAiB;AAAA,CAAA,CAAA,EAAA;AAMjBC,IAAAA,4BAA4B,0BAA5BA,4BAA4B,EAAA;EAA5BA,4BAA4B,CAAA,KAAA,CAAA,GAAA,KAAA;EAA5BA,4BAA4B,CAAA,UAAA,CAAA,GAAA,WAAA;EAA5BA,4BAA4B,CAAA,QAAA,CAAA,GAAA,SAAA;EAA5BA,4BAA4B,CAAA,OAAA,CAAA,GAAA,OAAA;EAA5BA,4BAA4B,CAAA,YAAA,CAAA,GAAA,aAAA;EAA5BA,4BAA4B,CAAA,UAAA,CAAA,GAAA,WAAA;EAA5BA,4BAA4B,CAAA,QAAA,CAAA,GAAA,QAAA;EAA5BA,4BAA4B,CAAA,aAAA,CAAA,GAAA,cAAA;EAA5BA,4BAA4B,CAAA,WAAA,CAAA,GAAA,YAAA;EAA5BA,4BAA4B,CAAA,MAAA,CAAA,GAAA,MAAA;EAA5BA,4BAA4B,CAAA,WAAA,CAAA,GAAA,YAAA;EAA5BA,4BAA4B,CAAA,SAAA,CAAA,GAAA,UAAA;AAAA,EAAA,OAA5BA,4BAA4B;AAAA,CAAA,CAAA,EAAA;;;;"}

package/dist/components/hds/text/body.js.map

@@ -1 +1 @@
-{"version":3,"file":"body.js","sources":["../../../../src/components/hds/text/body.hbs","../../../../src/components/hds/text/body.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<Hds::Text\\n  @group=\\\"body\\\"\\n  @size={{this.size}}\\n  @weight={{this.weight}}\\n  @align={{@align}}\\n  @color={{@color}}\\n  @tag={{@tag}}\\n  ...attributes\\n>{{yield}}</Hds::Text>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\nimport { HdsTextSizeValues, HdsTextWeightValues } from './types.ts';\nimport type {\n  HdsTextAligns,\n  HdsTextColors,\n  HdsTextTags,\n  HdsTextWeights,\n} from './types.ts';\n\n// notice: only some combinations of size + font-weight are allowed (per design specs)\n// see: https://www.figma.com/file/oQsMzMMnynfPWpMEt91OpH/HDS-Product---Foundations?node-id=1262%3A9192\n\n// Allow consumers to provide either string or number representation of size\ntype HdsTextBodySizeNumber = Extract<\n  HdsTextSizeValues,\n  | HdsTextSizeValues.OneHundred\n  | HdsTextSizeValues.TwoHundred\n  | HdsTextSizeValues.ThreeHundred\n>;\ntype HdsTextBodySizeString = `${HdsTextBodySizeNumber}`;\nexport type HdsTextBodySizes = HdsTextBodySizeNumber | HdsTextBodySizeString;\nexport const AVAILABLE_SIZES = [\n  HdsTextSizeValues.ThreeHundred,\n  HdsTextSizeValues.TwoHundred,\n  HdsTextSizeValues.OneHundred,\n];\nexport const DEFAULT_SIZE = HdsTextSizeValues.TwoHundred;\n\nexport const DEFAULT_WEIGHT = HdsTextWeightValues.Regular;\nexport type HdsTextBodyWeight = Extract<\n  HdsTextWeights,\n  'regular' | 'medium' | 'semibold'\n>;\nexport const AVAILABLE_WEIGHTS_PER_SIZE: Record<\n  HdsTextBodySizes,\n  HdsTextBodyWeight[]\n> = {\n  300: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Medium,\n    HdsTextWeightValues.Semibold,\n  ],\n  200: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Medium,\n    HdsTextWeightValues.Semibold,\n  ],\n  100: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Medium,\n    HdsTextWeightValues.Semibold,\n  ],\n};\n\nexport interface HdsTextBodySignature {\n  Args: {\n    size?: HdsTextBodySizes;\n    tag?: HdsTextTags;\n    weight?: HdsTextBodyWeight;\n    align?: HdsTextAligns;\n    color?: string | HdsTextColors;\n  };\n  Element:\n    | HTMLSpanElement\n    | HTMLHeadingElement\n    | HTMLParagraphElement\n    | HTMLDivElement;\n  Blocks: {\n    default: [];\n  };\n}\n\nexport default class HdsTextBody extends Component<HdsTextBodySignature> {\n  /**\n   * Sets the \"size\" for the text\n   * Accepted values: see AVAILABLE_SIZES\n   *\n   * @param size\n   * @type {HdsTextBodySizes}\n   *\n   */\n  get size(): HdsTextBodySizes {\n    let { size = DEFAULT_SIZE } = this.args;\n\n    // let's be a bit forgiving with the consumers\n    if (typeof size === 'string') {\n      size = parseInt(size, 10);\n    }\n\n    assert(\n      `@size for \"Hds::Text::Body\" must be one of the following: ${AVAILABLE_SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      AVAILABLE_SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  /**\n   * Sets the \"weight\" for the text\n   * Accepted values: see AVAILABLE_WEIGHTS_PER_SIZE\n   *\n   * @param weight\n   * @type {HdsTextWeights}\n   *\n   */\n  get weight(): HdsTextWeights {\n    const { weight = DEFAULT_WEIGHT } = this.args;\n\n    const availableWeights = AVAILABLE_WEIGHTS_PER_SIZE[this.size];\n\n    assert(\n      `@weight for \"Hds::Text::Body\" with @size=${\n        this.size\n      } must be one of the following: ${availableWeights.join(\n        ', '\n      )}; received: ${weight}`,\n      availableWeights.includes(weight)\n    );\n\n    return weight;\n  }\n}\n"],"names":["AVAILABLE_SIZES","HdsTextSizeValues","ThreeHundred","TwoHundred","OneHundred","DEFAULT_SIZE","DEFAULT_WEIGHT","HdsTextWeightValues","Regular","AVAILABLE_WEIGHTS_PER_SIZE","Medium","Semibold","HdsTextBody","Component","size","args","parseInt","assert","join","includes","weight","availableWeights","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;AACA,eAAe,kBAAkB,CAAC,mQAAmQ;;ACDrS;AACA;AACA;AACA;;AAwBaA,MAAAA,eAAe,GAAG,CAC7BC,iBAAiB,CAACC,YAAY,EAC9BD,iBAAiB,CAACE,UAAU,EAC5BF,iBAAiB,CAACG,UAAU;AAEjBC,MAAAA,YAAY,GAAGJ,iBAAiB,CAACE;AAEjCG,MAAAA,cAAc,GAAGC,mBAAmB,CAACC;AAK3C,MAAMC,0BAGZ,GAAG;AACF,EAAA,GAAG,EAAE,CACHF,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,MAAM,EAC1BH,mBAAmB,CAACI,QAAQ,CAC7B;AACD,EAAA,GAAG,EAAE,CACHJ,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,MAAM,EAC1BH,mBAAmB,CAACI,QAAQ,CAC7B;AACD,EAAA,GAAG,EAAE,CACHJ,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,MAAM,EAC1BH,mBAAmB,CAACI,QAAQ;AAEhC;AAoBe,MAAMC,WAAW,SAASC,SAAS,CAAuB;AACvE;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIC,IAAIA,GAAqB;IAC3B,IAAI;AAAEA,MAAAA,IAAI,GAAGT;KAAc,GAAG,IAAI,CAACU,IAAI;;AAEvC;AACA,IAAA,IAAI,OAAOD,IAAI,KAAK,QAAQ,EAAE;AAC5BA,MAAAA,IAAI,GAAGE,QAAQ,CAACF,IAAI,EAAE,EAAE,CAAC;AAC3B;AAEAG,IAAAA,MAAM,CACJ,CAA6DjB,0DAAAA,EAAAA,eAAe,CAACkB,IAAI,CAC/E,IACF,CAAC,CAAA,YAAA,EAAeJ,IAAI,CAAA,CAAE,EACtBd,eAAe,CAACmB,QAAQ,CAACL,IAAI,CAC/B,CAAC;AAED,IAAA,OAAOA,IAAI;AACb;;AAEA;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIM,MAAMA,GAAmB;IAC3B,MAAM;AAAEA,MAAAA,MAAM,GAAGd;KAAgB,GAAG,IAAI,CAACS,IAAI;AAE7C,IAAA,MAAMM,gBAAgB,GAAGZ,0BAA0B,CAAC,IAAI,CAACK,IAAI,CAAC;IAE9DG,MAAM,CACJ,4CACE,IAAI,CAACH,IAAI,CACuBO,+BAAAA,EAAAA,gBAAgB,CAACH,IAAI,CACrD,IACF,CAAC,CAAeE,YAAAA,EAAAA,MAAM,EAAE,EACxBC,gBAAgB,CAACF,QAAQ,CAACC,MAAM,CAClC,CAAC;AAED,IAAA,OAAOA,MAAM;AACf;AACF;AAACE,oBAAA,CAAAC,QAAA,EAnDoBX,WAAW,CAAA;;;;"}
+{"version":3,"file":"body.js","sources":["../../../../src/components/hds/text/body.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\nimport { HdsTextSizeValues, HdsTextWeightValues } from './types.ts';\nimport type {\n  HdsTextAligns,\n  HdsTextColors,\n  HdsTextTags,\n  HdsTextWeights,\n} from './types.ts';\n\n// notice: only some combinations of size + font-weight are allowed (per design specs)\n// see: https://www.figma.com/file/oQsMzMMnynfPWpMEt91OpH/HDS-Product---Foundations?node-id=1262%3A9192\n\n// Allow consumers to provide either string or number representation of size\ntype HdsTextBodySizeNumber = Extract<\n  HdsTextSizeValues,\n  | HdsTextSizeValues.OneHundred\n  | HdsTextSizeValues.TwoHundred\n  | HdsTextSizeValues.ThreeHundred\n>;\ntype HdsTextBodySizeString = `${HdsTextBodySizeNumber}`;\nexport type HdsTextBodySizes = HdsTextBodySizeNumber | HdsTextBodySizeString;\nexport const AVAILABLE_SIZES = [\n  HdsTextSizeValues.ThreeHundred,\n  HdsTextSizeValues.TwoHundred,\n  HdsTextSizeValues.OneHundred,\n];\nexport const DEFAULT_SIZE = HdsTextSizeValues.TwoHundred;\n\nexport const DEFAULT_WEIGHT = HdsTextWeightValues.Regular;\nexport type HdsTextBodyWeight = Extract<\n  HdsTextWeights,\n  'regular' | 'medium' | 'semibold'\n>;\nexport const AVAILABLE_WEIGHTS_PER_SIZE: Record<\n  HdsTextBodySizes,\n  HdsTextBodyWeight[]\n> = {\n  300: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Medium,\n    HdsTextWeightValues.Semibold,\n  ],\n  200: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Medium,\n    HdsTextWeightValues.Semibold,\n  ],\n  100: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Medium,\n    HdsTextWeightValues.Semibold,\n  ],\n};\n\nexport interface HdsTextBodySignature {\n  Args: {\n    size?: HdsTextBodySizes;\n    tag?: HdsTextTags;\n    weight?: HdsTextBodyWeight;\n    align?: HdsTextAligns;\n    color?: string | HdsTextColors;\n  };\n  Element:\n    | HTMLSpanElement\n    | HTMLHeadingElement\n    | HTMLParagraphElement\n    | HTMLDivElement;\n  Blocks: {\n    default: [];\n  };\n}\n\nexport default class HdsTextBody extends Component<HdsTextBodySignature> {\n  /**\n   * Sets the \"size\" for the text\n   * Accepted values: see AVAILABLE_SIZES\n   *\n   * @param size\n   * @type {HdsTextBodySizes}\n   *\n   */\n  get size(): HdsTextBodySizes {\n    let { size = DEFAULT_SIZE } = this.args;\n\n    // let's be a bit forgiving with the consumers\n    if (typeof size === 'string') {\n      size = parseInt(size, 10);\n    }\n\n    assert(\n      `@size for \"Hds::Text::Body\" must be one of the following: ${AVAILABLE_SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      AVAILABLE_SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  /**\n   * Sets the \"weight\" for the text\n   * Accepted values: see AVAILABLE_WEIGHTS_PER_SIZE\n   *\n   * @param weight\n   * @type {HdsTextWeights}\n   *\n   */\n  get weight(): HdsTextWeights {\n    const { weight = DEFAULT_WEIGHT } = this.args;\n\n    const availableWeights = AVAILABLE_WEIGHTS_PER_SIZE[this.size];\n\n    assert(\n      `@weight for \"Hds::Text::Body\" with @size=${\n        this.size\n      } must be one of the following: ${availableWeights.join(\n        ', '\n      )}; received: ${weight}`,\n      availableWeights.includes(weight)\n    );\n\n    return weight;\n  }\n}\n"],"names":["AVAILABLE_SIZES","HdsTextSizeValues","ThreeHundred","TwoHundred","OneHundred","DEFAULT_SIZE","DEFAULT_WEIGHT","HdsTextWeightValues","Regular","AVAILABLE_WEIGHTS_PER_SIZE","Medium","Semibold","HdsTextBody","Component","size","args","parseInt","assert","join","includes","weight","availableWeights","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;;AAwBaA,MAAAA,eAAe,GAAG,CAC7BC,iBAAiB,CAACC,YAAY,EAC9BD,iBAAiB,CAACE,UAAU,EAC5BF,iBAAiB,CAACG,UAAU;AAEjBC,MAAAA,YAAY,GAAGJ,iBAAiB,CAACE;AAEjCG,MAAAA,cAAc,GAAGC,mBAAmB,CAACC;AAK3C,MAAMC,0BAGZ,GAAG;AACF,EAAA,GAAG,EAAE,CACHF,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,MAAM,EAC1BH,mBAAmB,CAACI,QAAQ,CAC7B;AACD,EAAA,GAAG,EAAE,CACHJ,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,MAAM,EAC1BH,mBAAmB,CAACI,QAAQ,CAC7B;AACD,EAAA,GAAG,EAAE,CACHJ,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,MAAM,EAC1BH,mBAAmB,CAACI,QAAQ;AAEhC;AAoBe,MAAMC,WAAW,SAASC,SAAS,CAAuB;AACvE;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIC,IAAIA,GAAqB;IAC3B,IAAI;AAAEA,MAAAA,IAAI,GAAGT;KAAc,GAAG,IAAI,CAACU,IAAI;;AAEvC;AACA,IAAA,IAAI,OAAOD,IAAI,KAAK,QAAQ,EAAE;AAC5BA,MAAAA,IAAI,GAAGE,QAAQ,CAACF,IAAI,EAAE,EAAE,CAAC;AAC3B;AAEAG,IAAAA,MAAM,CACJ,CAA6DjB,0DAAAA,EAAAA,eAAe,CAACkB,IAAI,CAC/E,IACF,CAAC,CAAA,YAAA,EAAeJ,IAAI,CAAA,CAAE,EACtBd,eAAe,CAACmB,QAAQ,CAACL,IAAI,CAC/B,CAAC;AAED,IAAA,OAAOA,IAAI;AACb;;AAEA;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIM,MAAMA,GAAmB;IAC3B,MAAM;AAAEA,MAAAA,MAAM,GAAGd;KAAgB,GAAG,IAAI,CAACS,IAAI;AAE7C,IAAA,MAAMM,gBAAgB,GAAGZ,0BAA0B,CAAC,IAAI,CAACK,IAAI,CAAC;IAE9DG,MAAM,CACJ,4CACE,IAAI,CAACH,IAAI,CACuBO,+BAAAA,EAAAA,gBAAgB,CAACH,IAAI,CACrD,IACF,CAAC,CAAeE,YAAAA,EAAAA,MAAM,EAAE,EACxBC,gBAAgB,CAACF,QAAQ,CAACC,MAAM,CAClC,CAAC;AAED,IAAA,OAAOA,MAAM;AACf;AACF;AAACE,oBAAA,CAAAC,QAAA,EAnDoBX,WAAW,CAAA;;;;"}

package/dist/components/hds/text/code.js.map

@@ -1 +1 @@
-{"version":3,"file":"code.js","sources":["../../../../src/components/hds/text/code.hbs","../../../../src/components/hds/text/code.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<Hds::Text\\n  @group=\\\"code\\\"\\n  @size={{this.size}}\\n  @weight={{this.weight}}\\n  @align={{@align}}\\n  @color={{@color}}\\n  @tag={{@tag}}\\n  ...attributes\\n>{{yield}}</Hds::Text>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\nimport { HdsTextSizeValues, HdsTextWeightValues } from './types.ts';\nimport type {\n  HdsTextAligns,\n  HdsTextColors,\n  HdsTextTags,\n  HdsTextWeights,\n} from './types.ts';\n\n// notice: only some combinations of size + font-weight are allowed (per design specs)\n// see: https://www.figma.com/file/oQsMzMMnynfPWpMEt91OpH/HDS-Product---Foundations?node-id=1262%3A9192\n\n// Allow consumers to provide either string or number representation of size\ntype HdsTextCodeSizeNumber = Extract<\n  HdsTextSizeValues,\n  | HdsTextSizeValues.OneHundred\n  | HdsTextSizeValues.TwoHundred\n  | HdsTextSizeValues.ThreeHundred\n>;\ntype HdsTextCodeSizeString = `${HdsTextCodeSizeNumber}`;\nexport type HdsTextCodeSizes = HdsTextCodeSizeNumber | HdsTextCodeSizeString;\nexport const AVAILABLE_SIZES = [\n  HdsTextSizeValues.ThreeHundred,\n  HdsTextSizeValues.TwoHundred,\n  HdsTextSizeValues.OneHundred,\n];\nexport const DEFAULT_SIZE = HdsTextSizeValues.TwoHundred;\n\nexport const DEFAULT_WEIGHT = HdsTextWeightValues.Regular;\nexport type HdsTextCodeWeight = Extract<HdsTextWeights, 'regular' | 'bold'>;\nexport const AVAILABLE_WEIGHTS_PER_SIZE: Record<\n  HdsTextCodeSizes,\n  HdsTextCodeWeight[]\n> = {\n  [HdsTextSizeValues.ThreeHundred]: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Bold,\n  ],\n  [HdsTextSizeValues.TwoHundred]: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Bold,\n  ],\n  [HdsTextSizeValues.OneHundred]: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Bold,\n  ],\n};\n\nexport interface HdsTextCodeSignature {\n  Args: {\n    size?: HdsTextCodeSizes;\n    tag?: HdsTextTags;\n    weight?: HdsTextCodeWeight;\n    align?: HdsTextAligns;\n    color?: string | HdsTextColors;\n  };\n  Element:\n    | HTMLSpanElement\n    | HTMLHeadingElement\n    | HTMLParagraphElement\n    | HTMLDivElement;\n  Blocks: {\n    default: [];\n  };\n}\n\nexport default class HdsTextCode extends Component<HdsTextCodeSignature> {\n  /**\n   * Sets the \"size\" for the text\n   * Accepted values: see AVAILABLE_SIZES\n   *\n   * @type {HdsTextCodeSizes}\n   *\n   * @param size\n   */\n  get size(): HdsTextCodeSizes {\n    let { size = DEFAULT_SIZE } = this.args;\n\n    // let's be a bit forgiving with the consumers\n    if (typeof size === 'string') {\n      size = parseInt(size, 10);\n    }\n\n    assert(\n      `@size for \"Hds::Text::Code\" must be one of the following: ${AVAILABLE_SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      AVAILABLE_SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  /**\n   * Sets the \"weight\" for the text\n   * Accepted values: see AVAILABLE_WEIGHTS_PER_SIZE\n   *\n   * @type {string}\n   *\n   * @param variant\n   */\n  get weight(): HdsTextCodeWeight {\n    const { weight = DEFAULT_WEIGHT } = this.args;\n\n    const availableWeights = AVAILABLE_WEIGHTS_PER_SIZE[this.size];\n\n    assert(\n      `@weight for \"Hds::Text::Code\" with @size=${\n        this.size\n      } must be one of the following: ${availableWeights.join(\n        ', '\n      )}; received: ${weight}`,\n      availableWeights.includes(weight)\n    );\n\n    return weight;\n  }\n}\n"],"names":["AVAILABLE_SIZES","HdsTextSizeValues","ThreeHundred","TwoHundred","OneHundred","DEFAULT_SIZE","DEFAULT_WEIGHT","HdsTextWeightValues","Regular","AVAILABLE_WEIGHTS_PER_SIZE","Bold","HdsTextCode","Component","size","args","parseInt","assert","join","includes","weight","availableWeights","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;AACA,eAAe,kBAAkB,CAAC,mQAAmQ;;ACDrS;AACA;AACA;AACA;;AAwBaA,MAAAA,eAAe,GAAG,CAC7BC,iBAAiB,CAACC,YAAY,EAC9BD,iBAAiB,CAACE,UAAU,EAC5BF,iBAAiB,CAACG,UAAU;AAEjBC,MAAAA,YAAY,GAAGJ,iBAAiB,CAACE;AAEjCG,MAAAA,cAAc,GAAGC,mBAAmB,CAACC;AAE3C,MAAMC,0BAGZ,GAAG;AACF,EAAA,CAACR,iBAAiB,CAACC,YAAY,GAAG,CAChCK,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,IAAI,CACzB;AACD,EAAA,CAACT,iBAAiB,CAACE,UAAU,GAAG,CAC9BI,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,IAAI,CACzB;EACD,CAACT,iBAAiB,CAACG,UAAU,GAAG,CAC9BG,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,IAAI;AAE5B;AAoBe,MAAMC,WAAW,SAASC,SAAS,CAAuB;AACvE;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIC,IAAIA,GAAqB;IAC3B,IAAI;AAAEA,MAAAA,IAAI,GAAGR;KAAc,GAAG,IAAI,CAACS,IAAI;;AAEvC;AACA,IAAA,IAAI,OAAOD,IAAI,KAAK,QAAQ,EAAE;AAC5BA,MAAAA,IAAI,GAAGE,QAAQ,CAACF,IAAI,EAAE,EAAE,CAAC;AAC3B;AAEAG,IAAAA,MAAM,CACJ,CAA6DhB,0DAAAA,EAAAA,eAAe,CAACiB,IAAI,CAC/E,IACF,CAAC,CAAA,YAAA,EAAeJ,IAAI,CAAA,CAAE,EACtBb,eAAe,CAACkB,QAAQ,CAACL,IAAI,CAC/B,CAAC;AAED,IAAA,OAAOA,IAAI;AACb;;AAEA;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIM,MAAMA,GAAsB;IAC9B,MAAM;AAAEA,MAAAA,MAAM,GAAGb;KAAgB,GAAG,IAAI,CAACQ,IAAI;AAE7C,IAAA,MAAMM,gBAAgB,GAAGX,0BAA0B,CAAC,IAAI,CAACI,IAAI,CAAC;IAE9DG,MAAM,CACJ,4CACE,IAAI,CAACH,IAAI,CACuBO,+BAAAA,EAAAA,gBAAgB,CAACH,IAAI,CACrD,IACF,CAAC,CAAeE,YAAAA,EAAAA,MAAM,EAAE,EACxBC,gBAAgB,CAACF,QAAQ,CAACC,MAAM,CAClC,CAAC;AAED,IAAA,OAAOA,MAAM;AACf;AACF;AAACE,oBAAA,CAAAC,QAAA,EAnDoBX,WAAW,CAAA;;;;"}
+{"version":3,"file":"code.js","sources":["../../../../src/components/hds/text/code.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\nimport { HdsTextSizeValues, HdsTextWeightValues } from './types.ts';\nimport type {\n  HdsTextAligns,\n  HdsTextColors,\n  HdsTextTags,\n  HdsTextWeights,\n} from './types.ts';\n\n// notice: only some combinations of size + font-weight are allowed (per design specs)\n// see: https://www.figma.com/file/oQsMzMMnynfPWpMEt91OpH/HDS-Product---Foundations?node-id=1262%3A9192\n\n// Allow consumers to provide either string or number representation of size\ntype HdsTextCodeSizeNumber = Extract<\n  HdsTextSizeValues,\n  | HdsTextSizeValues.OneHundred\n  | HdsTextSizeValues.TwoHundred\n  | HdsTextSizeValues.ThreeHundred\n>;\ntype HdsTextCodeSizeString = `${HdsTextCodeSizeNumber}`;\nexport type HdsTextCodeSizes = HdsTextCodeSizeNumber | HdsTextCodeSizeString;\nexport const AVAILABLE_SIZES = [\n  HdsTextSizeValues.ThreeHundred,\n  HdsTextSizeValues.TwoHundred,\n  HdsTextSizeValues.OneHundred,\n];\nexport const DEFAULT_SIZE = HdsTextSizeValues.TwoHundred;\n\nexport const DEFAULT_WEIGHT = HdsTextWeightValues.Regular;\nexport type HdsTextCodeWeight = Extract<HdsTextWeights, 'regular' | 'bold'>;\nexport const AVAILABLE_WEIGHTS_PER_SIZE: Record<\n  HdsTextCodeSizes,\n  HdsTextCodeWeight[]\n> = {\n  [HdsTextSizeValues.ThreeHundred]: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Bold,\n  ],\n  [HdsTextSizeValues.TwoHundred]: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Bold,\n  ],\n  [HdsTextSizeValues.OneHundred]: [\n    HdsTextWeightValues.Regular,\n    HdsTextWeightValues.Bold,\n  ],\n};\n\nexport interface HdsTextCodeSignature {\n  Args: {\n    size?: HdsTextCodeSizes;\n    tag?: HdsTextTags;\n    weight?: HdsTextCodeWeight;\n    align?: HdsTextAligns;\n    color?: string | HdsTextColors;\n  };\n  Element:\n    | HTMLSpanElement\n    | HTMLHeadingElement\n    | HTMLParagraphElement\n    | HTMLDivElement;\n  Blocks: {\n    default: [];\n  };\n}\n\nexport default class HdsTextCode extends Component<HdsTextCodeSignature> {\n  /**\n   * Sets the \"size\" for the text\n   * Accepted values: see AVAILABLE_SIZES\n   *\n   * @type {HdsTextCodeSizes}\n   *\n   * @param size\n   */\n  get size(): HdsTextCodeSizes {\n    let { size = DEFAULT_SIZE } = this.args;\n\n    // let's be a bit forgiving with the consumers\n    if (typeof size === 'string') {\n      size = parseInt(size, 10);\n    }\n\n    assert(\n      `@size for \"Hds::Text::Code\" must be one of the following: ${AVAILABLE_SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      AVAILABLE_SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  /**\n   * Sets the \"weight\" for the text\n   * Accepted values: see AVAILABLE_WEIGHTS_PER_SIZE\n   *\n   * @type {string}\n   *\n   * @param variant\n   */\n  get weight(): HdsTextCodeWeight {\n    const { weight = DEFAULT_WEIGHT } = this.args;\n\n    const availableWeights = AVAILABLE_WEIGHTS_PER_SIZE[this.size];\n\n    assert(\n      `@weight for \"Hds::Text::Code\" with @size=${\n        this.size\n      } must be one of the following: ${availableWeights.join(\n        ', '\n      )}; received: ${weight}`,\n      availableWeights.includes(weight)\n    );\n\n    return weight;\n  }\n}\n"],"names":["AVAILABLE_SIZES","HdsTextSizeValues","ThreeHundred","TwoHundred","OneHundred","DEFAULT_SIZE","DEFAULT_WEIGHT","HdsTextWeightValues","Regular","AVAILABLE_WEIGHTS_PER_SIZE","Bold","HdsTextCode","Component","size","args","parseInt","assert","join","includes","weight","availableWeights","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;;AAwBaA,MAAAA,eAAe,GAAG,CAC7BC,iBAAiB,CAACC,YAAY,EAC9BD,iBAAiB,CAACE,UAAU,EAC5BF,iBAAiB,CAACG,UAAU;AAEjBC,MAAAA,YAAY,GAAGJ,iBAAiB,CAACE;AAEjCG,MAAAA,cAAc,GAAGC,mBAAmB,CAACC;AAE3C,MAAMC,0BAGZ,GAAG;AACF,EAAA,CAACR,iBAAiB,CAACC,YAAY,GAAG,CAChCK,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,IAAI,CACzB;AACD,EAAA,CAACT,iBAAiB,CAACE,UAAU,GAAG,CAC9BI,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,IAAI,CACzB;EACD,CAACT,iBAAiB,CAACG,UAAU,GAAG,CAC9BG,mBAAmB,CAACC,OAAO,EAC3BD,mBAAmB,CAACG,IAAI;AAE5B;AAoBe,MAAMC,WAAW,SAASC,SAAS,CAAuB;AACvE;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIC,IAAIA,GAAqB;IAC3B,IAAI;AAAEA,MAAAA,IAAI,GAAGR;KAAc,GAAG,IAAI,CAACS,IAAI;;AAEvC;AACA,IAAA,IAAI,OAAOD,IAAI,KAAK,QAAQ,EAAE;AAC5BA,MAAAA,IAAI,GAAGE,QAAQ,CAACF,IAAI,EAAE,EAAE,CAAC;AAC3B;AAEAG,IAAAA,MAAM,CACJ,CAA6DhB,0DAAAA,EAAAA,eAAe,CAACiB,IAAI,CAC/E,IACF,CAAC,CAAA,YAAA,EAAeJ,IAAI,CAAA,CAAE,EACtBb,eAAe,CAACkB,QAAQ,CAACL,IAAI,CAC/B,CAAC;AAED,IAAA,OAAOA,IAAI;AACb;;AAEA;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIM,MAAMA,GAAsB;IAC9B,MAAM;AAAEA,MAAAA,MAAM,GAAGb;KAAgB,GAAG,IAAI,CAACQ,IAAI;AAE7C,IAAA,MAAMM,gBAAgB,GAAGX,0BAA0B,CAAC,IAAI,CAACI,IAAI,CAAC;IAE9DG,MAAM,CACJ,4CACE,IAAI,CAACH,IAAI,CACuBO,+BAAAA,EAAAA,gBAAgB,CAACH,IAAI,CACrD,IACF,CAAC,CAAeE,YAAAA,EAAAA,MAAM,EAAE,EACxBC,gBAAgB,CAACF,QAAQ,CAACC,MAAM,CAClC,CAAC;AAED,IAAA,OAAOA,MAAM;AACf;AACF;AAACE,oBAAA,CAAAC,QAAA,EAnDoBX,WAAW,CAAA;;;;"}

package/dist/components/hds/text/display.js.map

@@ -1 +1 @@
-{"version":3,"file":"display.js","sources":["../../../../src/components/hds/text/display.hbs","../../../../src/components/hds/text/display.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<Hds::Text\\n  @group=\\\"display\\\"\\n  @size={{this.size}}\\n  @weight={{this.weight}}\\n  @align={{@align}}\\n  @color={{@color}}\\n  @tag={{@tag}}\\n  ...attributes\\n>{{yield}}</Hds::Text>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\nimport { HdsTextSizeValues, HdsTextWeightValues } from './types.ts';\nimport type {\n  HdsTextAligns,\n  HdsTextColors,\n  HdsTextSizes,\n  HdsTextTags,\n  HdsTextWeights,\n} from './types.ts';\n\n// notice: only some combinations of size + font-weight are allowed (per design specs)\n// see: https://www.figma.com/file/oQsMzMMnynfPWpMEt91OpH/HDS-Product---Foundations?node-id=1262%3A9192\n\nexport const DEFAULT_SIZE = HdsTextSizeValues.TwoHundred;\n\n// Filter out reverse mappings from enum\n// https://www.typescriptlang.org/docs/handbook/enums.html#reverse-mappings\nexport const AVAILABLE_SIZES = Object.values(HdsTextSizeValues).filter(\n  (v): boolean => typeof v === 'number'\n);\n\nexport type HdsTextDisplayWeight = Extract<\n  HdsTextWeights,\n  'medium' | 'semibold' | 'bold'\n>;\nexport const DEFAULT_WEIGHTS_PER_SIZE: Record<\n  HdsTextSizeValues,\n  HdsTextDisplayWeight\n> = {\n  [HdsTextSizeValues.FiveHundred]: HdsTextWeightValues.Bold,\n  [HdsTextSizeValues.FourHundred]: HdsTextWeightValues.Semibold,\n  [HdsTextSizeValues.ThreeHundred]: HdsTextWeightValues.Semibold,\n  [HdsTextSizeValues.TwoHundred]: HdsTextWeightValues.Semibold,\n  [HdsTextSizeValues.OneHundred]: HdsTextWeightValues.Medium,\n};\nexport const AVAILABLE_WEIGHTS_PER_SIZE: Record<\n  HdsTextSizes,\n  HdsTextDisplayWeight[]\n> = {\n  [HdsTextSizeValues.FiveHundred]: [HdsTextWeightValues.Bold],\n  [HdsTextSizeValues.FourHundred]: [\n    HdsTextWeightValues.Medium,\n    HdsTextWeightValues.Semibold,\n    HdsTextWeightValues.Bold,\n  ],\n  [HdsTextSizeValues.ThreeHundred]: [\n    HdsTextWeightValues.Medium,\n    HdsTextWeightValues.Semibold,\n    HdsTextWeightValues.Bold,\n  ],\n  [HdsTextSizeValues.TwoHundred]: [HdsTextWeightValues.Semibold],\n  [HdsTextSizeValues.OneHundred]: [HdsTextWeightValues.Medium],\n};\n\nexport interface HdsTextDisplaySignature {\n  Args: {\n    size?: HdsTextSizes;\n    tag?: HdsTextTags;\n    weight?: HdsTextDisplayWeight;\n    align?: HdsTextAligns;\n    color?: string | HdsTextColors;\n  };\n  Element:\n    | HTMLSpanElement\n    | HTMLHeadingElement\n    | HTMLParagraphElement\n    | HTMLDivElement;\n  Blocks: {\n    default: [];\n  };\n}\n\nexport default class HdsTextDisplay extends Component<HdsTextDisplaySignature> {\n  /**\n   * Sets the \"size\" for the text\n   * Accepted values: see AVAILABLE_SIZES\n   *\n   * @type {HdsTextSizes}\n   *\n   * @param size\n   */\n  get size(): HdsTextSizes {\n    let { size = DEFAULT_SIZE } = this.args;\n\n    // let's be a bit forgiving with the consumers\n    if (typeof size === 'string') {\n      size = parseInt(size, 10);\n    }\n\n    assert(\n      `@size for \"Hds::Text::Display\" must be one of the following: ${AVAILABLE_SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      AVAILABLE_SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  /**\n   * Sets the \"weight\" for the text\n   * Accepted values: see AVAILABLE_WEIGHTS_PER_SIZE\n   *\n   * @type {HdsTextDisplayWeight}\n   *\n   * @param variant\n   */\n  get weight(): HdsTextDisplayWeight {\n    let { weight } = this.args;\n\n    if (weight) {\n      const availableWeights = AVAILABLE_WEIGHTS_PER_SIZE[this.size];\n      assert(\n        `@weight for \"Hds::Text::Display\" with @size=${\n          this.size\n        } must be one of the following: ${availableWeights.join(\n          ', '\n        )}; received: ${weight}`,\n        availableWeights.includes(weight)\n      );\n    } else {\n      // use the default (first item in the array)\n      weight = DEFAULT_WEIGHTS_PER_SIZE[this.size];\n    }\n\n    return weight;\n  }\n}\n"],"names":["DEFAULT_SIZE","HdsTextSizeValues","TwoHundred","AVAILABLE_SIZES","Object","values","filter","v","DEFAULT_WEIGHTS_PER_SIZE","FiveHundred","HdsTextWeightValues","Bold","FourHundred","Semibold","ThreeHundred","OneHundred","Medium","AVAILABLE_WEIGHTS_PER_SIZE","HdsTextDisplay","Component","size","args","parseInt","assert","join","includes","weight","availableWeights","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;AACA,eAAe,kBAAkB,CAAC,sQAAsQ;;ACDxS;AACA;AACA;AACA;;AAaA;AACA;;AAEaA,MAAAA,YAAY,GAAGC,iBAAiB,CAACC;;AAE9C;AACA;MACaC,eAAe,GAAGC,MAAM,CAACC,MAAM,CAACJ,iBAAiB,CAAC,CAACK,MAAM,CACnEC,CAAC,IAAc,OAAOA,CAAC,KAAK,QAC/B;AAMO,MAAMC,wBAGZ,GAAG;AACF,EAAA,CAACP,iBAAiB,CAACQ,WAAW,GAAGC,mBAAmB,CAACC,IAAI;AACzD,EAAA,CAACV,iBAAiB,CAACW,WAAW,GAAGF,mBAAmB,CAACG,QAAQ;AAC7D,EAAA,CAACZ,iBAAiB,CAACa,YAAY,GAAGJ,mBAAmB,CAACG,QAAQ;AAC9D,EAAA,CAACZ,iBAAiB,CAACC,UAAU,GAAGQ,mBAAmB,CAACG,QAAQ;AAC5D,EAAA,CAACZ,iBAAiB,CAACc,UAAU,GAAGL,mBAAmB,CAACM;AACtD;AACO,MAAMC,0BAGZ,GAAG;EACF,CAAChB,iBAAiB,CAACQ,WAAW,GAAG,CAACC,mBAAmB,CAACC,IAAI,CAAC;AAC3D,EAAA,CAACV,iBAAiB,CAACW,WAAW,GAAG,CAC/BF,mBAAmB,CAACM,MAAM,EAC1BN,mBAAmB,CAACG,QAAQ,EAC5BH,mBAAmB,CAACC,IAAI,CACzB;AACD,EAAA,CAACV,iBAAiB,CAACa,YAAY,GAAG,CAChCJ,mBAAmB,CAACM,MAAM,EAC1BN,mBAAmB,CAACG,QAAQ,EAC5BH,mBAAmB,CAACC,IAAI,CACzB;EACD,CAACV,iBAAiB,CAACC,UAAU,GAAG,CAACQ,mBAAmB,CAACG,QAAQ,CAAC;AAC9D,EAAA,CAACZ,iBAAiB,CAACc,UAAU,GAAG,CAACL,mBAAmB,CAACM,MAAM;AAC7D;AAoBe,MAAME,cAAc,SAASC,SAAS,CAA0B;AAC7E;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIC,IAAIA,GAAiB;IACvB,IAAI;AAAEA,MAAAA,IAAI,GAAGpB;KAAc,GAAG,IAAI,CAACqB,IAAI;;AAEvC;AACA,IAAA,IAAI,OAAOD,IAAI,KAAK,QAAQ,EAAE;AAC5BA,MAAAA,IAAI,GAAGE,QAAQ,CAACF,IAAI,EAAE,EAAE,CAAC;AAC3B;AAEAG,IAAAA,MAAM,CACJ,CAAgEpB,6DAAAA,EAAAA,eAAe,CAACqB,IAAI,CAClF,IACF,CAAC,CAAA,YAAA,EAAeJ,IAAI,CAAA,CAAE,EACtBjB,eAAe,CAACsB,QAAQ,CAACL,IAAI,CAC/B,CAAC;AAED,IAAA,OAAOA,IAAI;AACb;;AAEA;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIM,MAAMA,GAAyB;IACjC,IAAI;AAAEA,MAAAA;KAAQ,GAAG,IAAI,CAACL,IAAI;AAE1B,IAAA,IAAIK,MAAM,EAAE;AACV,MAAA,MAAMC,gBAAgB,GAAGV,0BAA0B,CAAC,IAAI,CAACG,IAAI,CAAC;MAC9DG,MAAM,CACJ,+CACE,IAAI,CAACH,IAAI,CACuBO,+BAAAA,EAAAA,gBAAgB,CAACH,IAAI,CACrD,IACF,CAAC,CAAeE,YAAAA,EAAAA,MAAM,EAAE,EACxBC,gBAAgB,CAACF,QAAQ,CAACC,MAAM,CAClC,CAAC;AACH,KAAC,MAAM;AACL;AACAA,MAAAA,MAAM,GAAGlB,wBAAwB,CAAC,IAAI,CAACY,IAAI,CAAC;AAC9C;AAEA,IAAA,OAAOM,MAAM;AACf;AACF;AAACE,oBAAA,CAAAC,QAAA,EAvDoBX,cAAc,CAAA;;;;"}
+{"version":3,"file":"display.js","sources":["../../../../src/components/hds/text/display.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\nimport { HdsTextSizeValues, HdsTextWeightValues } from './types.ts';\nimport type {\n  HdsTextAligns,\n  HdsTextColors,\n  HdsTextSizes,\n  HdsTextTags,\n  HdsTextWeights,\n} from './types.ts';\n\n// notice: only some combinations of size + font-weight are allowed (per design specs)\n// see: https://www.figma.com/file/oQsMzMMnynfPWpMEt91OpH/HDS-Product---Foundations?node-id=1262%3A9192\n\nexport const DEFAULT_SIZE = HdsTextSizeValues.TwoHundred;\n\n// Filter out reverse mappings from enum\n// https://www.typescriptlang.org/docs/handbook/enums.html#reverse-mappings\nexport const AVAILABLE_SIZES = Object.values(HdsTextSizeValues).filter(\n  (v): boolean => typeof v === 'number'\n);\n\nexport type HdsTextDisplayWeight = Extract<\n  HdsTextWeights,\n  'medium' | 'semibold' | 'bold'\n>;\nexport const DEFAULT_WEIGHTS_PER_SIZE: Record<\n  HdsTextSizeValues,\n  HdsTextDisplayWeight\n> = {\n  [HdsTextSizeValues.FiveHundred]: HdsTextWeightValues.Bold,\n  [HdsTextSizeValues.FourHundred]: HdsTextWeightValues.Semibold,\n  [HdsTextSizeValues.ThreeHundred]: HdsTextWeightValues.Semibold,\n  [HdsTextSizeValues.TwoHundred]: HdsTextWeightValues.Semibold,\n  [HdsTextSizeValues.OneHundred]: HdsTextWeightValues.Medium,\n};\nexport const AVAILABLE_WEIGHTS_PER_SIZE: Record<\n  HdsTextSizes,\n  HdsTextDisplayWeight[]\n> = {\n  [HdsTextSizeValues.FiveHundred]: [HdsTextWeightValues.Bold],\n  [HdsTextSizeValues.FourHundred]: [\n    HdsTextWeightValues.Medium,\n    HdsTextWeightValues.Semibold,\n    HdsTextWeightValues.Bold,\n  ],\n  [HdsTextSizeValues.ThreeHundred]: [\n    HdsTextWeightValues.Medium,\n    HdsTextWeightValues.Semibold,\n    HdsTextWeightValues.Bold,\n  ],\n  [HdsTextSizeValues.TwoHundred]: [HdsTextWeightValues.Semibold],\n  [HdsTextSizeValues.OneHundred]: [HdsTextWeightValues.Medium],\n};\n\nexport interface HdsTextDisplaySignature {\n  Args: {\n    size?: HdsTextSizes;\n    tag?: HdsTextTags;\n    weight?: HdsTextDisplayWeight;\n    align?: HdsTextAligns;\n    color?: string | HdsTextColors;\n  };\n  Element:\n    | HTMLSpanElement\n    | HTMLHeadingElement\n    | HTMLParagraphElement\n    | HTMLDivElement;\n  Blocks: {\n    default: [];\n  };\n}\n\nexport default class HdsTextDisplay extends Component<HdsTextDisplaySignature> {\n  /**\n   * Sets the \"size\" for the text\n   * Accepted values: see AVAILABLE_SIZES\n   *\n   * @type {HdsTextSizes}\n   *\n   * @param size\n   */\n  get size(): HdsTextSizes {\n    let { size = DEFAULT_SIZE } = this.args;\n\n    // let's be a bit forgiving with the consumers\n    if (typeof size === 'string') {\n      size = parseInt(size, 10);\n    }\n\n    assert(\n      `@size for \"Hds::Text::Display\" must be one of the following: ${AVAILABLE_SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      AVAILABLE_SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  /**\n   * Sets the \"weight\" for the text\n   * Accepted values: see AVAILABLE_WEIGHTS_PER_SIZE\n   *\n   * @type {HdsTextDisplayWeight}\n   *\n   * @param variant\n   */\n  get weight(): HdsTextDisplayWeight {\n    let { weight } = this.args;\n\n    if (weight) {\n      const availableWeights = AVAILABLE_WEIGHTS_PER_SIZE[this.size];\n      assert(\n        `@weight for \"Hds::Text::Display\" with @size=${\n          this.size\n        } must be one of the following: ${availableWeights.join(\n          ', '\n        )}; received: ${weight}`,\n        availableWeights.includes(weight)\n      );\n    } else {\n      // use the default (first item in the array)\n      weight = DEFAULT_WEIGHTS_PER_SIZE[this.size];\n    }\n\n    return weight;\n  }\n}\n"],"names":["DEFAULT_SIZE","HdsTextSizeValues","TwoHundred","AVAILABLE_SIZES","Object","values","filter","v","DEFAULT_WEIGHTS_PER_SIZE","FiveHundred","HdsTextWeightValues","Bold","FourHundred","Semibold","ThreeHundred","OneHundred","Medium","AVAILABLE_WEIGHTS_PER_SIZE","HdsTextDisplay","Component","size","args","parseInt","assert","join","includes","weight","availableWeights","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;;AAaA;AACA;;AAEaA,MAAAA,YAAY,GAAGC,iBAAiB,CAACC;;AAE9C;AACA;MACaC,eAAe,GAAGC,MAAM,CAACC,MAAM,CAACJ,iBAAiB,CAAC,CAACK,MAAM,CACnEC,CAAC,IAAc,OAAOA,CAAC,KAAK,QAC/B;AAMO,MAAMC,wBAGZ,GAAG;AACF,EAAA,CAACP,iBAAiB,CAACQ,WAAW,GAAGC,mBAAmB,CAACC,IAAI;AACzD,EAAA,CAACV,iBAAiB,CAACW,WAAW,GAAGF,mBAAmB,CAACG,QAAQ;AAC7D,EAAA,CAACZ,iBAAiB,CAACa,YAAY,GAAGJ,mBAAmB,CAACG,QAAQ;AAC9D,EAAA,CAACZ,iBAAiB,CAACC,UAAU,GAAGQ,mBAAmB,CAACG,QAAQ;AAC5D,EAAA,CAACZ,iBAAiB,CAACc,UAAU,GAAGL,mBAAmB,CAACM;AACtD;AACO,MAAMC,0BAGZ,GAAG;EACF,CAAChB,iBAAiB,CAACQ,WAAW,GAAG,CAACC,mBAAmB,CAACC,IAAI,CAAC;AAC3D,EAAA,CAACV,iBAAiB,CAACW,WAAW,GAAG,CAC/BF,mBAAmB,CAACM,MAAM,EAC1BN,mBAAmB,CAACG,QAAQ,EAC5BH,mBAAmB,CAACC,IAAI,CACzB;AACD,EAAA,CAACV,iBAAiB,CAACa,YAAY,GAAG,CAChCJ,mBAAmB,CAACM,MAAM,EAC1BN,mBAAmB,CAACG,QAAQ,EAC5BH,mBAAmB,CAACC,IAAI,CACzB;EACD,CAACV,iBAAiB,CAACC,UAAU,GAAG,CAACQ,mBAAmB,CAACG,QAAQ,CAAC;AAC9D,EAAA,CAACZ,iBAAiB,CAACc,UAAU,GAAG,CAACL,mBAAmB,CAACM,MAAM;AAC7D;AAoBe,MAAME,cAAc,SAASC,SAAS,CAA0B;AAC7E;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIC,IAAIA,GAAiB;IACvB,IAAI;AAAEA,MAAAA,IAAI,GAAGpB;KAAc,GAAG,IAAI,CAACqB,IAAI;;AAEvC;AACA,IAAA,IAAI,OAAOD,IAAI,KAAK,QAAQ,EAAE;AAC5BA,MAAAA,IAAI,GAAGE,QAAQ,CAACF,IAAI,EAAE,EAAE,CAAC;AAC3B;AAEAG,IAAAA,MAAM,CACJ,CAAgEpB,6DAAAA,EAAAA,eAAe,CAACqB,IAAI,CAClF,IACF,CAAC,CAAA,YAAA,EAAeJ,IAAI,CAAA,CAAE,EACtBjB,eAAe,CAACsB,QAAQ,CAACL,IAAI,CAC/B,CAAC;AAED,IAAA,OAAOA,IAAI;AACb;;AAEA;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,IAAIM,MAAMA,GAAyB;IACjC,IAAI;AAAEA,MAAAA;KAAQ,GAAG,IAAI,CAACL,IAAI;AAE1B,IAAA,IAAIK,MAAM,EAAE;AACV,MAAA,MAAMC,gBAAgB,GAAGV,0BAA0B,CAAC,IAAI,CAACG,IAAI,CAAC;MAC9DG,MAAM,CACJ,+CACE,IAAI,CAACH,IAAI,CACuBO,+BAAAA,EAAAA,gBAAgB,CAACH,IAAI,CACrD,IACF,CAAC,CAAeE,YAAAA,EAAAA,MAAM,EAAE,EACxBC,gBAAgB,CAACF,QAAQ,CAACC,MAAM,CAClC,CAAC;AACH,KAAC,MAAM;AACL;AACAA,MAAAA,MAAM,GAAGlB,wBAAwB,CAAC,IAAI,CAACY,IAAI,CAAC;AAC9C;AAEA,IAAA,OAAOM,MAAM;AACf;AACF;AAACE,oBAAA,CAAAC,QAAA,EAvDoBX,cAAc,CAAA;;;;"}