@hashicorp/design-system-components 5.0.0 → 5.1.0-rc-20251125151324

package/dist/components/hds/filter-bar/tabs/index.js

@@ -0,0 +1,181 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+import { schedule } from '@ember/runloop';
+import { modifier } from 'ember-modifier';
+import './tab.js';
+import './panel.js';
+import { precompileTemplate } from '@ember/template-compilation';
+import { g, i, 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<div class=\"hds-filter-bar__tabs\" ...attributes {{this._setUpFilterBarTabs}}>\n  <ol class=\"hds-filter-bar__tabs__list\" aria-label={{@ariaLabel}} role=\"tablist\">\n    {{yield\n      (hash\n        Tab=(component\n          \"hds/filter-bar/tabs/tab\"\n          selectedTabIndex=this._selectedTabIndex\n          tabIds=this._tabIds\n          panelIds=this._panelIds\n          didInsertNode=this.didInsertTab\n          willDestroyNode=this.willDestroyTab\n          onClick=this.onClick\n          onKeyUp=this.onKeyUp\n        )\n      )\n    }}\n  </ol>\n  {{yield\n    (hash\n      Panel=(component\n        \"hds/filter-bar/tabs/panel\"\n        selectedTabIndex=this._selectedTabIndex\n        tabIds=this._tabIds\n        panelIds=this._panelIds\n        didInsertNode=this.didInsertPanel\n        willDestroyNode=this.willDestroyPanel\n      )\n    )\n  }}\n</div>");
+
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+const TAB_ELEMENT_SELECTOR = '.hds-filter-bar__tabs__tab__button';
+const PANEL_ELEMENT_SELECTOR = '.hds-filter-bar__tabs__panel';
+class HdsFilterBarTabs extends Component {
+  static {
+    g(this.prototype, "_tabIds", [tracked], function () {
+      return [];
+    });
+  }
+  #_tabIds = (i(this, "_tabIds"), void 0);
+  static {
+    g(this.prototype, "_tabNodes", [tracked], function () {
+      return [];
+    });
+  }
+  #_tabNodes = (i(this, "_tabNodes"), void 0);
+  static {
+    g(this.prototype, "_panelNodes", [tracked], function () {
+      return [];
+    });
+  }
+  #_panelNodes = (i(this, "_panelNodes"), void 0);
+  static {
+    g(this.prototype, "_panelIds", [tracked], function () {
+      return [];
+    });
+  }
+  #_panelIds = (i(this, "_panelIds"), void 0);
+  static {
+    g(this.prototype, "_selectedTabIndex", [tracked], function () {
+      return 0;
+    });
+  }
+  #_selectedTabIndex = (i(this, "_selectedTabIndex"), void 0);
+  static {
+    g(this.prototype, "_selectedTabId", [tracked]);
+  }
+  #_selectedTabId = (i(this, "_selectedTabId"), void 0);
+  _element;
+  _setUpFilterBarTabs = modifier(element => {
+    const {
+      selectedTabIndex
+    } = this.args;
+    if (selectedTabIndex) {
+      this._selectedTabIndex = selectedTabIndex;
+    }
+    this._element = element;
+    return () => {};
+  });
+  didInsertTab() {
+    // eslint-disable-next-line ember/no-runloop
+    schedule('afterRender', () => {
+      this.updateTabs();
+    });
+  }
+  static {
+    n(this.prototype, "didInsertTab", [action]);
+  }
+  willDestroyTab(element) {
+    // eslint-disable-next-line ember/no-runloop
+    schedule('afterRender', () => {
+      this._tabNodes = this._tabNodes.filter(node => node.id !== element.id);
+      this._tabIds = this._tabIds.filter(tabId => tabId !== element.id);
+    });
+  }
+  static {
+    n(this.prototype, "willDestroyTab", [action]);
+  }
+  didInsertPanel() {
+    // eslint-disable-next-line ember/no-runloop
+    schedule('afterRender', () => {
+      this.updatePanels();
+    });
+  }
+  static {
+    n(this.prototype, "didInsertPanel", [action]);
+  }
+  willDestroyPanel(element) {
+    // eslint-disable-next-line ember/no-runloop
+    schedule('afterRender', () => {
+      this._panelNodes = this._panelNodes.filter(node => node.id !== element.id);
+      this._panelIds = this._panelIds.filter(panelId => panelId !== element.id);
+    });
+  }
+  static {
+    n(this.prototype, "willDestroyPanel", [action]);
+  }
+  onClick(event, tabIndex) {
+    this._selectedTabIndex = tabIndex;
+
+    // invoke the callback function if it's provided as argument
+    if (typeof this.args.onClickTab === 'function') {
+      this.args.onClickTab(event, tabIndex);
+    }
+  }
+  static {
+    n(this.prototype, "onClick", [action]);
+  }
+  onKeyUp(event, tabIndex) {
+    const leftArrow = 'ArrowLeft';
+    const rightArrow = 'ArrowRight';
+    const upArrow = 'ArrowUp';
+    const downArrow = 'ArrowDown';
+    const enterKey = 'Enter';
+    const spaceKey = ' ';
+    if (event.key === rightArrow || event.key === downArrow) {
+      const nextTabIndex = (tabIndex + 1) % this._tabIds.length;
+      this.focusTab(nextTabIndex, event);
+    } else if (event.key === leftArrow || event.key === upArrow) {
+      const prevTabIndex = (tabIndex + this._tabIds.length - 1) % this._tabIds.length;
+      this.focusTab(prevTabIndex, event);
+    } else if (event.key === enterKey || event.key === spaceKey) {
+      this._selectedTabIndex = tabIndex;
+    }
+    // scroll selected tab into view (it may be out of view when activated using a keyboard with `prev/next`)
+    const parentNode = this._tabNodes[this._selectedTabIndex]?.parentNode;
+    if (parentNode instanceof HTMLElement) {
+      parentNode.scrollIntoView({
+        behavior: 'smooth',
+        block: 'nearest',
+        inline: 'nearest'
+      });
+    }
+  }
+
+  // Focus tab for keyboard & mouse navigation:
+  static {
+    n(this.prototype, "onKeyUp", [action]);
+  }
+  focusTab(tabIndex, event) {
+    event.preventDefault();
+    this._tabNodes[tabIndex]?.focus();
+  }
+
+  // Update the tab arrays based on how they are ordered in the DOM
+  updateTabs() {
+    const tabs = this._element.querySelectorAll(TAB_ELEMENT_SELECTOR);
+    let newTabIds = [];
+    let newTabNodes = [];
+    tabs.forEach(tab => {
+      newTabIds = [...newTabIds, tab.id];
+      newTabNodes = [...newTabNodes, tab];
+    });
+    this._tabIds = newTabIds;
+    this._tabNodes = newTabNodes;
+  }
+
+  // Update the panel arrays based on how they are ordered in the DOM
+  updatePanels() {
+    const panels = this._element.querySelectorAll(PANEL_ELEMENT_SELECTOR);
+    let newPanelIds = [];
+    let newPanelNodes = [];
+    panels.forEach(panel => {
+      newPanelIds = [...newPanelIds, panel.id];
+      newPanelNodes = [...newPanelNodes, panel];
+    });
+    this._panelIds = newPanelIds;
+    this._panelNodes = newPanelNodes;
+  }
+}
+setComponentTemplate(TEMPLATE, HdsFilterBarTabs);
+
+export { HdsFilterBarTabs as default };
+//# sourceMappingURL=index.js.map

package/dist/components/hds/filter-bar/tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../src/components/hds/filter-bar/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 { schedule } from '@ember/runloop';\nimport { modifier } from 'ember-modifier';\nimport type { WithBoundArgs } from '@glint/template';\nimport HdsFilterBarTabsTabComponent from './tab.ts';\nimport HdsFilterBarTabsPanelComponent from './panel.ts';\n\nconst TAB_ELEMENT_SELECTOR = '.hds-filter-bar__tabs__tab__button';\nconst PANEL_ELEMENT_SELECTOR = '.hds-filter-bar__tabs__panel';\n\nexport interface HdsFilterBarTabsSignature {\n  Args: {\n    selectedTabIndex?: number;\n    ariaLabel: string;\n    onClickTab?: (event: MouseEvent, tabIndex: number) => void;\n  };\n  Blocks: {\n    default: [\n      {\n        Tab?: WithBoundArgs<\n          typeof HdsFilterBarTabsTabComponent,\n          | 'selectedTabIndex'\n          | 'tabIds'\n          | 'panelIds'\n          | 'didInsertNode'\n          | 'willDestroyNode'\n          | 'onClick'\n          | 'onKeyUp'\n        >;\n        Panel?: WithBoundArgs<\n          typeof HdsFilterBarTabsPanelComponent,\n          | 'selectedTabIndex'\n          | 'tabIds'\n          | 'panelIds'\n          | 'didInsertNode'\n          | 'willDestroyNode'\n        >;\n      },\n    ];\n  };\n  Element: HTMLDivElement;\n}\n\nexport default class HdsFilterBarTabs extends Component<HdsFilterBarTabsSignature> {\n  @tracked private _tabIds: string[] = [];\n  @tracked private _tabNodes: HTMLElement[] = [];\n  @tracked private _panelNodes: HTMLElement[] = [];\n  @tracked private _panelIds: string[] = [];\n  @tracked private _selectedTabIndex: number = 0;\n  @tracked private _selectedTabId?: string;\n\n  private _element!: HTMLDivElement;\n\n  private _setUpFilterBarTabs = modifier((element: HTMLDivElement) => {\n    const { selectedTabIndex } = this.args;\n\n    if (selectedTabIndex) {\n      this._selectedTabIndex = selectedTabIndex;\n    }\n\n    this._element = element;\n\n    return () => {};\n  });\n\n  @action\n  didInsertTab(): void {\n    // eslint-disable-next-line ember/no-runloop\n    schedule('afterRender', (): void => {\n      this.updateTabs();\n    });\n  }\n\n  @action\n  willDestroyTab(element: HTMLElement): void {\n    // eslint-disable-next-line ember/no-runloop\n    schedule('afterRender', (): 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\n  @action\n  didInsertPanel(): void {\n    // eslint-disable-next-line ember/no-runloop\n    schedule('afterRender', (): void => {\n      this.updatePanels();\n    });\n  }\n\n  @action\n  willDestroyPanel(element: HTMLElement): void {\n    // eslint-disable-next-line ember/no-runloop\n    schedule('afterRender', (): 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\n  @action\n  onClick(event: MouseEvent, tabIndex: number): void {\n    this._selectedTabIndex = tabIndex;\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(event: KeyboardEvent, tabIndex: number): void {\n    const leftArrow = 'ArrowLeft';\n    const rightArrow = 'ArrowRight';\n    const upArrow = 'ArrowUp';\n    const downArrow = 'ArrowDown';\n    const enterKey = 'Enter';\n    const spaceKey = ' ';\n\n    if (event.key === rightArrow || event.key === downArrow) {\n      const nextTabIndex = (tabIndex + 1) % this._tabIds.length;\n      this.focusTab(nextTabIndex, event);\n    } else if (event.key === leftArrow || event.key === upArrow) {\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  // Update the tab arrays based on how they are ordered in the DOM\n  private updateTabs(): void {\n    const tabs = this._element.querySelectorAll(TAB_ELEMENT_SELECTOR);\n    let newTabIds: string[] = [];\n    let newTabNodes: HTMLElement[] = [];\n    tabs.forEach((tab) => {\n      newTabIds = [...newTabIds, tab.id];\n      newTabNodes = [...newTabNodes, tab as HTMLElement];\n    });\n    this._tabIds = newTabIds;\n    this._tabNodes = newTabNodes;\n  }\n\n  // Update the panel arrays based on how they are ordered in the DOM\n  private updatePanels(): void {\n    const panels = this._element.querySelectorAll(PANEL_ELEMENT_SELECTOR);\n    let newPanelIds: string[] = [];\n    let newPanelNodes: HTMLElement[] = [];\n    panels.forEach((panel) => {\n      newPanelIds = [...newPanelIds, panel.id];\n      newPanelNodes = [...newPanelNodes, panel as HTMLElement];\n    });\n    this._panelIds = newPanelIds;\n    this._panelNodes = newPanelNodes;\n  }\n}\n"],"names":["TAB_ELEMENT_SELECTOR","PANEL_ELEMENT_SELECTOR","HdsFilterBarTabs","Component","g","prototype","tracked","i","void 0","_element","_setUpFilterBarTabs","modifier","element","selectedTabIndex","args","_selectedTabIndex","didInsertTab","schedule","updateTabs","n","action","willDestroyTab","_tabNodes","filter","node","id","_tabIds","tabId","didInsertPanel","updatePanels","willDestroyPanel","_panelNodes","_panelIds","panelId","onClick","event","tabIndex","onClickTab","onKeyUp","leftArrow","rightArrow","upArrow","downArrow","enterKey","spaceKey","key","nextTabIndex","length","focusTab","prevTabIndex","parentNode","HTMLElement","scrollIntoView","behavior","block","inline","preventDefault","focus","tabs","querySelectorAll","newTabIds","newTabNodes","forEach","tab","panels","newPanelIds","newPanelNodes","panel","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;;;;;;AAAA;AACA;AACA;AACA;;AAWA,MAAMA,oBAAoB,GAAG,oCAAoC;AACjE,MAAMC,sBAAsB,GAAG,8BAA8B;AAmC9C,MAAMC,gBAAgB,SAASC,SAAS,CAA4B;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,SAAA,EAAA,CAChFC,OAAO,CAAA,EAAA,YAAA;AAAA,MAAA,OAA6B,EAAE;AAAA,IAAA,CAAA,CAAA;AAAA;AAAA,EAAA,QAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,SAAA,CAAA,EAAAC,MAAA;AAAA,EAAA;IAAAJ,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,WAAA,EAAA,CACtCC,OAAO,CAAA,EAAA,YAAA;AAAA,MAAA,OAAoC,EAAE;AAAA,IAAA,CAAA,CAAA;AAAA;AAAA,EAAA,UAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,WAAA,CAAA,EAAAC,MAAA;AAAA,EAAA;IAAAJ,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,aAAA,EAAA,CAC7CC,OAAO,CAAA,EAAA,YAAA;AAAA,MAAA,OAAsC,EAAE;AAAA,IAAA,CAAA,CAAA;AAAA;AAAA,EAAA,YAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,aAAA,CAAA,EAAAC,MAAA;AAAA,EAAA;IAAAJ,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,WAAA,EAAA,CAC/CC,OAAO,CAAA,EAAA,YAAA;AAAA,MAAA,OAA+B,EAAE;AAAA,IAAA,CAAA,CAAA;AAAA;AAAA,EAAA,UAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,WAAA,CAAA,EAAAC,MAAA;AAAA,EAAA;IAAAJ,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,mBAAA,EAAA,CACxCC,OAAO,CAAA,EAAA,YAAA;AAAA,MAAA,OAAqC,CAAC;AAAA,IAAA,CAAA,CAAA;AAAA;AAAA,EAAA,kBAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,mBAAA,CAAA,EAAAC,MAAA;AAAA,EAAA;IAAAJ,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,gBAAA,EAAA,CAC7CC,OAAO,CAAA,CAAA;AAAA;AAAA,EAAA,eAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,gBAAA,CAAA,EAAAC,MAAA;EAEAC,QAAQ;AAERC,EAAAA,mBAAmB,GAAGC,QAAQ,CAAEC,OAAuB,IAAK;IAClE,MAAM;AAAEC,MAAAA;KAAkB,GAAG,IAAI,CAACC,IAAI;AAEtC,IAAA,IAAID,gBAAgB,EAAE;MACpB,IAAI,CAACE,iBAAiB,GAAGF,gBAAgB;AAC3C,IAAA;IAEA,IAAI,CAACJ,QAAQ,GAAGG,OAAO;IAEvB,OAAO,MAAM,CAAC,CAAC;AACjB,EAAA,CAAC,CAAC;AAGFI,EAAAA,YAAYA,GAAS;AACnB;IACAC,QAAQ,CAAC,aAAa,EAAE,MAAY;MAClC,IAAI,CAACC,UAAU,EAAE;AACnB,IAAA,CAAC,CAAC;AACJ,EAAA;AAAC,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAd,SAAA,EAAA,cAAA,EAAA,CANAe,MAAM,CAAA,CAAA;AAAA;EASPC,cAAcA,CAACT,OAAoB,EAAQ;AACzC;IACAK,QAAQ,CAAC,aAAa,EAAE,MAAY;AAClC,MAAA,IAAI,CAACK,SAAS,GAAG,IAAI,CAACA,SAAS,CAACC,MAAM,CACnCC,IAAI,IAAcA,IAAI,CAACC,EAAE,KAAKb,OAAO,CAACa,EACzC,CAAC;AACD,MAAA,IAAI,CAACC,OAAO,GAAG,IAAI,CAACA,OAAO,CAACH,MAAM,CAC/BI,KAAK,IAAcA,KAAK,KAAKf,OAAO,CAACa,EACxC,CAAC;AACH,IAAA,CAAC,CAAC;AACJ,EAAA;AAAC,EAAA;IAAAN,CAAA,CAAA,IAAA,CAAAd,SAAA,EAAA,gBAAA,EAAA,CAXAe,MAAM,CAAA,CAAA;AAAA;AAcPQ,EAAAA,cAAcA,GAAS;AACrB;IACAX,QAAQ,CAAC,aAAa,EAAE,MAAY;MAClC,IAAI,CAACY,YAAY,EAAE;AACrB,IAAA,CAAC,CAAC;AACJ,EAAA;AAAC,EAAA;IAAAV,CAAA,CAAA,IAAA,CAAAd,SAAA,EAAA,gBAAA,EAAA,CANAe,MAAM,CAAA,CAAA;AAAA;EASPU,gBAAgBA,CAAClB,OAAoB,EAAQ;AAC3C;IACAK,QAAQ,CAAC,aAAa,EAAE,MAAY;AAClC,MAAA,IAAI,CAACc,WAAW,GAAG,IAAI,CAACA,WAAW,CAACR,MAAM,CACvCC,IAAI,IAAcA,IAAI,CAACC,EAAE,KAAKb,OAAO,CAACa,EACzC,CAAC;AACD,MAAA,IAAI,CAACO,SAAS,GAAG,IAAI,CAACA,SAAS,CAACT,MAAM,CACnCU,OAAO,IAAcA,OAAO,KAAKrB,OAAO,CAACa,EAC5C,CAAC;AACH,IAAA,CAAC,CAAC;AACJ,EAAA;AAAC,EAAA;IAAAN,CAAA,CAAA,IAAA,CAAAd,SAAA,EAAA,kBAAA,EAAA,CAXAe,MAAM,CAAA,CAAA;AAAA;AAcPc,EAAAA,OAAOA,CAACC,KAAiB,EAAEC,QAAgB,EAAQ;IACjD,IAAI,CAACrB,iBAAiB,GAAGqB,QAAQ;;AAEjC;IACA,IAAI,OAAO,IAAI,CAACtB,IAAI,CAACuB,UAAU,KAAK,UAAU,EAAE;MAC9C,IAAI,CAACvB,IAAI,CAACuB,UAAU,CAACF,KAAK,EAAEC,QAAQ,CAAC;AACvC,IAAA;AACF,EAAA;AAAC,EAAA;IAAAjB,CAAA,CAAA,IAAA,CAAAd,SAAA,EAAA,SAAA,EAAA,CARAe,MAAM,CAAA,CAAA;AAAA;AAWPkB,EAAAA,OAAOA,CAACH,KAAoB,EAAEC,QAAgB,EAAQ;IACpD,MAAMG,SAAS,GAAG,WAAW;IAC7B,MAAMC,UAAU,GAAG,YAAY;IAC/B,MAAMC,OAAO,GAAG,SAAS;IACzB,MAAMC,SAAS,GAAG,WAAW;IAC7B,MAAMC,QAAQ,GAAG,OAAO;IACxB,MAAMC,QAAQ,GAAG,GAAG;IAEpB,IAAIT,KAAK,CAACU,GAAG,KAAKL,UAAU,IAAIL,KAAK,CAACU,GAAG,KAAKH,SAAS,EAAE;MACvD,MAAMI,YAAY,GAAG,CAACV,QAAQ,GAAG,CAAC,IAAI,IAAI,CAACV,OAAO,CAACqB,MAAM;AACzD,MAAA,IAAI,CAACC,QAAQ,CAACF,YAAY,EAAEX,KAAK,CAAC;AACpC,IAAA,CAAC,MAAM,IAAIA,KAAK,CAACU,GAAG,KAAKN,SAAS,IAAIJ,KAAK,CAACU,GAAG,KAAKJ,OAAO,EAAE;AAC3D,MAAA,MAAMQ,YAAY,GAChB,CAACb,QAAQ,GAAG,IAAI,CAACV,OAAO,CAACqB,MAAM,GAAG,CAAC,IAAI,IAAI,CAACrB,OAAO,CAACqB,MAAM;AAC5D,MAAA,IAAI,CAACC,QAAQ,CAACC,YAAY,EAAEd,KAAK,CAAC;AACpC,IAAA,CAAC,MAAM,IAAIA,KAAK,CAACU,GAAG,KAAKF,QAAQ,IAAIR,KAAK,CAACU,GAAG,KAAKD,QAAQ,EAAE;MAC3D,IAAI,CAAC7B,iBAAiB,GAAGqB,QAAQ;AACnC,IAAA;AACA;IACA,MAAMc,UAAU,GAAG,IAAI,CAAC5B,SAAS,CAAC,IAAI,CAACP,iBAAiB,CAAC,EAAEmC,UAAU;IACrE,IAAIA,UAAU,YAAYC,WAAW,EAAE;MACrCD,UAAU,CAACE,cAAc,CAAC;AACxBC,QAAAA,QAAQ,EAAE,QAAQ;AAClBC,QAAAA,KAAK,EAAE,SAAS;AAChBC,QAAAA,MAAM,EAAE;AACV,OAAC,CAAC;AACJ,IAAA;AACF,EAAA;;AAEA;AAAA,EAAA;IAAApC,CAAA,CAAA,IAAA,CAAAd,SAAA,EAAA,SAAA,EAAA,CA9BCe,MAAM,CAAA,CAAA;AAAA;AA+BP4B,EAAAA,QAAQA,CAACZ,QAAgB,EAAED,KAAoB,EAAQ;IACrDA,KAAK,CAACqB,cAAc,EAAE;IACtB,IAAI,CAAClC,SAAS,CAACc,QAAQ,CAAC,EAAEqB,KAAK,EAAE;AACnC,EAAA;;AAEA;AACQvC,EAAAA,UAAUA,GAAS;IACzB,MAAMwC,IAAI,GAAG,IAAI,CAACjD,QAAQ,CAACkD,gBAAgB,CAAC3D,oBAAoB,CAAC;IACjE,IAAI4D,SAAmB,GAAG,EAAE;IAC5B,IAAIC,WAA0B,GAAG,EAAE;AACnCH,IAAAA,IAAI,CAACI,OAAO,CAAEC,GAAG,IAAK;MACpBH,SAAS,GAAG,CAAC,GAAGA,SAAS,EAAEG,GAAG,CAACtC,EAAE,CAAC;AAClCoC,MAAAA,WAAW,GAAG,CAAC,GAAGA,WAAW,EAAEE,GAAG,CAAgB;AACpD,IAAA,CAAC,CAAC;IACF,IAAI,CAACrC,OAAO,GAAGkC,SAAS;IACxB,IAAI,CAACtC,SAAS,GAAGuC,WAAW;AAC9B,EAAA;;AAEA;AACQhC,EAAAA,YAAYA,GAAS;IAC3B,MAAMmC,MAAM,GAAG,IAAI,CAACvD,QAAQ,CAACkD,gBAAgB,CAAC1D,sBAAsB,CAAC;IACrE,IAAIgE,WAAqB,GAAG,EAAE;IAC9B,IAAIC,aAA4B,GAAG,EAAE;AACrCF,IAAAA,MAAM,CAACF,OAAO,CAAEK,KAAK,IAAK;MACxBF,WAAW,GAAG,CAAC,GAAGA,WAAW,EAAEE,KAAK,CAAC1C,EAAE,CAAC;AACxCyC,MAAAA,aAAa,GAAG,CAAC,GAAGA,aAAa,EAAEC,KAAK,CAAgB;AAC1D,IAAA,CAAC,CAAC;IACF,IAAI,CAACnC,SAAS,GAAGiC,WAAW;IAC5B,IAAI,CAAClC,WAAW,GAAGmC,aAAa;AAClC,EAAA;AACF;AAACE,oBAAA,CAAAC,QAAA,EAvIoBnE,gBAAgB,CAAA;;;;"}

package/dist/components/hds/filter-bar/tabs/panel.js

@@ -0,0 +1,67 @@
+import Component from '@glimmer/component';
+import { guidFor } from '@ember/object/internals';
+import { action } from '@ember/object';
+import { modifier } from 'ember-modifier';
+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-filter-bar__tabs__panel\"\n  ...attributes\n  role=\"tabpanel\"\n  id={{this._panelId}}\n  hidden={{not this.isVisible}}\n  aria-labelledby={{this.coupledTabId}}\n  {{this._setUpPanel this.didInsertNode this.willDestroyNode}}\n>\n  {{#if this.isVisible}}\n    {{yield}}\n  {{/if}}\n</section>");
+
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+class HdsFilterBarTabsPanel extends Component {
+  _panelId = 'panel-' + guidFor(this);
+  _elementId;
+  _setUpPanel = modifier((element, [insertCallbackFunction, destroyCallbackFunction]) => {
+    if (typeof insertCallbackFunction === 'function') {
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-call
+      insertCallbackFunction(element);
+    }
+    return () => {
+      if (typeof destroyCallbackFunction === 'function') {
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-call
+        destroyCallbackFunction(element);
+      }
+    };
+  });
+  get nodeIndex() {
+    return this.args.panelIds?.indexOf(this._panelId);
+  }
+  get coupledTabId() {
+    return this.nodeIndex !== undefined ? this.args.tabIds?.[this.nodeIndex] : undefined;
+  }
+  get isVisible() {
+    return this.nodeIndex === this.args.selectedTabIndex;
+  }
+  didInsertNode(element) {
+    const {
+      didInsertNode
+    } = this.args;
+    if (typeof didInsertNode === 'function') {
+      this._elementId = element.id;
+      didInsertNode();
+    }
+  }
+  static {
+    n(this.prototype, "didInsertNode", [action]);
+  }
+  willDestroyNode(element) {
+    const {
+      willDestroyNode
+    } = this.args;
+    if (typeof willDestroyNode === 'function') {
+      willDestroyNode(element);
+    }
+  }
+  static {
+    n(this.prototype, "willDestroyNode", [action]);
+  }
+}
+setComponentTemplate(TEMPLATE, HdsFilterBarTabsPanel);
+
+export { HdsFilterBarTabsPanel as default };
+//# sourceMappingURL=panel.js.map

package/dist/components/hds/filter-bar/tabs/panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel.js","sources":["../../../../../src/components/hds/filter-bar/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 { modifier } from 'ember-modifier';\n\nexport interface HdsFilterBarTabsPanelSignature {\n  Args: {\n    selectedTabIndex?: number;\n    tabIds?: string[];\n    panelIds?: string[];\n    didInsertNode?: () => void;\n    willDestroyNode?: (element: HTMLElement) => void;\n  };\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLElement;\n}\n\nexport default class HdsFilterBarTabsPanel extends Component<HdsFilterBarTabsPanelSignature> {\n  private _panelId = 'panel-' + guidFor(this);\n  private _elementId?: string;\n\n  private _setUpPanel = modifier(\n    (\n      element: HTMLElement,\n      [insertCallbackFunction, destroyCallbackFunction]\n    ) => {\n      if (typeof insertCallbackFunction === 'function') {\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n        insertCallbackFunction(element);\n      }\n\n      return () => {\n        if (typeof destroyCallbackFunction === 'function') {\n          // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n          destroyCallbackFunction(element);\n        }\n      };\n    }\n  );\n\n  get nodeIndex(): number | undefined {\n    return this.args.panelIds?.indexOf(this._panelId);\n  }\n\n  get coupledTabId(): string | undefined {\n    return this.nodeIndex !== undefined\n      ? this.args.tabIds?.[this.nodeIndex]\n      : undefined;\n  }\n\n  get isVisible(): boolean {\n    return this.nodeIndex === this.args.selectedTabIndex;\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();\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":["HdsFilterBarTabsPanel","Component","_panelId","guidFor","_elementId","_setUpPanel","modifier","element","insertCallbackFunction","destroyCallbackFunction","nodeIndex","args","panelIds","indexOf","coupledTabId","undefined","tabIds","isVisible","selectedTabIndex","didInsertNode","id","n","prototype","action","willDestroyNode","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;;AAqBe,MAAMA,qBAAqB,SAASC,SAAS,CAAiC;AACnFC,EAAAA,QAAQ,GAAG,QAAQ,GAAGC,OAAO,CAAC,IAAI,CAAC;EACnCC,UAAU;EAEVC,WAAW,GAAGC,QAAQ,CAC5B,CACEC,OAAoB,EACpB,CAACC,sBAAsB,EAAEC,uBAAuB,CAAC,KAC9C;AACH,IAAA,IAAI,OAAOD,sBAAsB,KAAK,UAAU,EAAE;AAChD;MACAA,sBAAsB,CAACD,OAAO,CAAC;AACjC,IAAA;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,OAAOE,uBAAuB,KAAK,UAAU,EAAE;AACjD;QACAA,uBAAuB,CAACF,OAAO,CAAC;AAClC,MAAA;IACF,CAAC;AACH,EAAA,CACF,CAAC;EAED,IAAIG,SAASA,GAAuB;IAClC,OAAO,IAAI,CAACC,IAAI,CAACC,QAAQ,EAAEC,OAAO,CAAC,IAAI,CAACX,QAAQ,CAAC;AACnD,EAAA;EAEA,IAAIY,YAAYA,GAAuB;AACrC,IAAA,OAAO,IAAI,CAACJ,SAAS,KAAKK,SAAS,GAC/B,IAAI,CAACJ,IAAI,CAACK,MAAM,GAAG,IAAI,CAACN,SAAS,CAAC,GAClCK,SAAS;AACf,EAAA;EAEA,IAAIE,SAASA,GAAY;IACvB,OAAO,IAAI,CAACP,SAAS,KAAK,IAAI,CAACC,IAAI,CAACO,gBAAgB;AACtD,EAAA;EAGAC,aAAaA,CAACZ,OAAoB,EAAQ;IACxC,MAAM;AAAEY,MAAAA;KAAe,GAAG,IAAI,CAACR,IAAI;AAEnC,IAAA,IAAI,OAAOQ,aAAa,KAAK,UAAU,EAAE;AACvC,MAAA,IAAI,CAACf,UAAU,GAAGG,OAAO,CAACa,EAAE;AAC5BD,MAAAA,aAAa,EAAE;AACjB,IAAA;AACF,EAAA;AAAC,EAAA;IAAAE,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,eAAA,EAAA,CARAC,MAAM,CAAA,CAAA;AAAA;EAWPC,eAAeA,CAACjB,OAAoB,EAAQ;IAC1C,MAAM;AAAEiB,MAAAA;KAAiB,GAAG,IAAI,CAACb,IAAI;AAErC,IAAA,IAAI,OAAOa,eAAe,KAAK,UAAU,EAAE;MACzCA,eAAe,CAACjB,OAAO,CAAC;AAC1B,IAAA;AACF,EAAA;AAAC,EAAA;IAAAc,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,iBAAA,EAAA,CAPAC,MAAM,CAAA,CAAA;AAAA;AAQT;AAACE,oBAAA,CAAAC,QAAA,EAvDoB1B,qBAAqB,CAAA;;;;"}

package/dist/components/hds/filter-bar/tabs/tab.js

@@ -0,0 +1,98 @@
+import Component from '@glimmer/component';
+import { guidFor } from '@ember/object/internals';
+import { action } from '@ember/object';
+import { modifier } from 'ember-modifier';
+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{{! template-lint-disable require-presentational-children }}\n<li class={{this.classNames}} ...attributes role=\"presentation\">\n  <button\n    class=\"hds-filter-bar__tabs__tab__button\"\n    id={{this._tabId}}\n    type=\"button\"\n    role=\"tab\"\n    aria-controls={{this.coupledPanelId}}\n    aria-selected={{if this.isSelected \"true\" \"false\"}}\n    tabindex={{unless this.isSelected \"-1\"}}\n    {{on \"click\" this.onClick}}\n    {{on \"keyup\" this.onKeyUp}}\n    {{this._setUpTab this.didInsertNode this.willDestroyNode}}\n  >\n    <Hds::Text::Body @size=\"200\" @weight=\"medium\" class=\"hds-filter-bar__tabs__tab__text\">{{yield}}</Hds::Text::Body>\n    {{#if (gt @numFilters 0)}}\n      <Hds::Text::Body @size=\"200\" @color=\"primary\">\n        {{@numFilters}}\n      </Hds::Text::Body>\n    {{/if}}\n    <Hds::Icon @name=\"chevron-right\" @color=\"primary\" />\n  </button>\n</li>\n{{! template-lint-enable require-presentational-children }}\n{{! template-lint-enable require-context-role no-invalid-role }}");
+
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+class HdsFilterBarTabsTab extends Component {
+  _tabId = 'tab-' + guidFor(this);
+  _elementId;
+  _setUpTab = modifier((element, [insertCallbackFunction, destroyCallbackFunction]) => {
+    if (typeof insertCallbackFunction === 'function') {
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-call
+      insertCallbackFunction(element);
+    }
+    return () => {
+      if (typeof destroyCallbackFunction === 'function') {
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-call
+        destroyCallbackFunction(element);
+      }
+    };
+  });
+  get nodeIndex() {
+    return this.args.tabIds?.indexOf(this._tabId);
+  }
+  get coupledPanelId() {
+    return this.nodeIndex !== undefined ? this.args.panelIds?.[this.nodeIndex] : undefined;
+  }
+  get isSelected() {
+    return this.nodeIndex !== undefined && this.nodeIndex === this.args.selectedTabIndex;
+  }
+  didInsertNode(element) {
+    const {
+      didInsertNode
+    } = this.args;
+    if (typeof didInsertNode === 'function') {
+      this._elementId = element.id;
+      didInsertNode();
+    }
+  }
+  static {
+    n(this.prototype, "didInsertNode", [action]);
+  }
+  willDestroyNode(element) {
+    const {
+      willDestroyNode
+    } = this.args;
+    if (typeof willDestroyNode === 'function') {
+      willDestroyNode(element);
+    }
+  }
+  static {
+    n(this.prototype, "willDestroyNode", [action]);
+  }
+  onClick(event) {
+    const {
+      onClick
+    } = this.args;
+    if (this.nodeIndex !== undefined && typeof onClick === 'function') {
+      onClick(event, this.nodeIndex);
+    } else {
+      return false;
+    }
+  }
+  static {
+    n(this.prototype, "onClick", [action]);
+  }
+  onKeyUp(event) {
+    const {
+      onKeyUp
+    } = this.args;
+    if (this.nodeIndex !== undefined && typeof onKeyUp === 'function') {
+      onKeyUp(event, this.nodeIndex);
+    }
+  }
+  static {
+    n(this.prototype, "onKeyUp", [action]);
+  }
+  get classNames() {
+    const classes = ['hds-filter-bar__tabs__tab'];
+    if (this.isSelected) {
+      classes.push(`hds-filter-bar__tabs__tab--is-selected`);
+    }
+    return classes.join(' ');
+  }
+}
+setComponentTemplate(TEMPLATE, HdsFilterBarTabsTab);
+
+export { HdsFilterBarTabsTab as default };
+//# sourceMappingURL=tab.js.map

package/dist/components/hds/filter-bar/tabs/tab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab.js","sources":["../../../../../src/components/hds/filter-bar/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 { modifier } from 'ember-modifier';\n\nexport interface HdsFilterBarTabsTabSignature {\n  Args: {\n    selectedTabIndex?: number;\n    tabIds?: string[];\n    panelIds?: string[];\n    numFilters?: number;\n    didInsertNode?: () => void;\n    willDestroyNode?: (element: HTMLButtonElement) => void;\n    onClick?: (event: MouseEvent, nodeIndex: number) => void;\n    onKeyUp?: (event: KeyboardEvent, nodeIndex: number) => void;\n  };\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLElement;\n}\n\nexport default class HdsFilterBarTabsTab extends Component<HdsFilterBarTabsTabSignature> {\n  private _tabId = 'tab-' + guidFor(this);\n  private _elementId?: string;\n\n  private _setUpTab = modifier(\n    (\n      element: HTMLElement,\n      [insertCallbackFunction, destroyCallbackFunction]\n    ) => {\n      if (typeof insertCallbackFunction === 'function') {\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n        insertCallbackFunction(element);\n      }\n\n      return () => {\n        if (typeof destroyCallbackFunction === 'function') {\n          // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n          destroyCallbackFunction(element);\n        }\n      };\n    }\n  );\n\n  get nodeIndex(): number | undefined {\n    return this.args.tabIds?.indexOf(this._tabId);\n  }\n\n  get coupledPanelId(): string | undefined {\n    return this.nodeIndex !== undefined\n      ? this.args.panelIds?.[this.nodeIndex]\n      : undefined;\n  }\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): void {\n    const { didInsertNode } = this.args;\n\n    if (typeof didInsertNode === 'function') {\n      this._elementId = element.id;\n      didInsertNode();\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 (this.nodeIndex !== undefined && typeof onClick === 'function') {\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 (this.nodeIndex !== undefined && typeof onKeyUp === 'function') {\n      onKeyUp(event, this.nodeIndex);\n    }\n  }\n\n  get classNames(): string {\n    const classes = ['hds-filter-bar__tabs__tab'];\n\n    if (this.isSelected) {\n      classes.push(`hds-filter-bar__tabs__tab--is-selected`);\n    }\n\n    return classes.join(' ');\n  }\n}\n"],"names":["HdsFilterBarTabsTab","Component","_tabId","guidFor","_elementId","_setUpTab","modifier","element","insertCallbackFunction","destroyCallbackFunction","nodeIndex","args","tabIds","indexOf","coupledPanelId","undefined","panelIds","isSelected","selectedTabIndex","didInsertNode","id","n","prototype","action","willDestroyNode","onClick","event","onKeyUp","classNames","classes","push","join","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;;AAwBe,MAAMA,mBAAmB,SAASC,SAAS,CAA+B;AAC/EC,EAAAA,MAAM,GAAG,MAAM,GAAGC,OAAO,CAAC,IAAI,CAAC;EAC/BC,UAAU;EAEVC,SAAS,GAAGC,QAAQ,CAC1B,CACEC,OAAoB,EACpB,CAACC,sBAAsB,EAAEC,uBAAuB,CAAC,KAC9C;AACH,IAAA,IAAI,OAAOD,sBAAsB,KAAK,UAAU,EAAE;AAChD;MACAA,sBAAsB,CAACD,OAAO,CAAC;AACjC,IAAA;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,OAAOE,uBAAuB,KAAK,UAAU,EAAE;AACjD;QACAA,uBAAuB,CAACF,OAAO,CAAC;AAClC,MAAA;IACF,CAAC;AACH,EAAA,CACF,CAAC;EAED,IAAIG,SAASA,GAAuB;IAClC,OAAO,IAAI,CAACC,IAAI,CAACC,MAAM,EAAEC,OAAO,CAAC,IAAI,CAACX,MAAM,CAAC;AAC/C,EAAA;EAEA,IAAIY,cAAcA,GAAuB;AACvC,IAAA,OAAO,IAAI,CAACJ,SAAS,KAAKK,SAAS,GAC/B,IAAI,CAACJ,IAAI,CAACK,QAAQ,GAAG,IAAI,CAACN,SAAS,CAAC,GACpCK,SAAS;AACf,EAAA;EAEA,IAAIE,UAAUA,GAAY;AACxB,IAAA,OACE,IAAI,CAACP,SAAS,KAAKK,SAAS,IAC5B,IAAI,CAACL,SAAS,KAAK,IAAI,CAACC,IAAI,CAACO,gBAAgB;AAEjD,EAAA;EAGAC,aAAaA,CAACZ,OAA0B,EAAQ;IAC9C,MAAM;AAAEY,MAAAA;KAAe,GAAG,IAAI,CAACR,IAAI;AAEnC,IAAA,IAAI,OAAOQ,aAAa,KAAK,UAAU,EAAE;AACvC,MAAA,IAAI,CAACf,UAAU,GAAGG,OAAO,CAACa,EAAE;AAC5BD,MAAAA,aAAa,EAAE;AACjB,IAAA;AACF,EAAA;AAAC,EAAA;IAAAE,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,eAAA,EAAA,CARAC,MAAM,CAAA,CAAA;AAAA;EAWPC,eAAeA,CAACjB,OAA0B,EAAQ;IAChD,MAAM;AAAEiB,MAAAA;KAAiB,GAAG,IAAI,CAACb,IAAI;AAErC,IAAA,IAAI,OAAOa,eAAe,KAAK,UAAU,EAAE;MACzCA,eAAe,CAACjB,OAAO,CAAC;AAC1B,IAAA;AACF,EAAA;AAAC,EAAA;IAAAc,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,iBAAA,EAAA,CAPAC,MAAM,CAAA,CAAA;AAAA;EAUPE,OAAOA,CAACC,KAAiB,EAAqB;IAC5C,MAAM;AAAED,MAAAA;KAAS,GAAG,IAAI,CAACd,IAAI;IAE7B,IAAI,IAAI,CAACD,SAAS,KAAKK,SAAS,IAAI,OAAOU,OAAO,KAAK,UAAU,EAAE;AACjEA,MAAAA,OAAO,CAACC,KAAK,EAAE,IAAI,CAAChB,SAAS,CAAC;AAChC,IAAA,CAAC,MAAM;AACL,MAAA,OAAO,KAAK;AACd,IAAA;AACF,EAAA;AAAC,EAAA;IAAAW,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,SAAA,EAAA,CATAC,MAAM,CAAA,CAAA;AAAA;EAYPI,OAAOA,CAACD,KAAoB,EAAQ;IAClC,MAAM;AAAEC,MAAAA;KAAS,GAAG,IAAI,CAAChB,IAAI;IAE7B,IAAI,IAAI,CAACD,SAAS,KAAKK,SAAS,IAAI,OAAOY,OAAO,KAAK,UAAU,EAAE;AACjEA,MAAAA,OAAO,CAACD,KAAK,EAAE,IAAI,CAAChB,SAAS,CAAC;AAChC,IAAA;AACF,EAAA;AAAC,EAAA;IAAAW,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,SAAA,EAAA,CAPAC,MAAM,CAAA,CAAA;AAAA;EASP,IAAIK,UAAUA,GAAW;AACvB,IAAA,MAAMC,OAAO,GAAG,CAAC,2BAA2B,CAAC;IAE7C,IAAI,IAAI,CAACZ,UAAU,EAAE;AACnBY,MAAAA,OAAO,CAACC,IAAI,CAAC,CAAA,sCAAA,CAAwC,CAAC;AACxD,IAAA;AAEA,IAAA,OAAOD,OAAO,CAACE,IAAI,CAAC,GAAG,CAAC;AAC1B,EAAA;AACF;AAACC,oBAAA,CAAAC,QAAA,EAxFoBjC,mBAAmB,CAAA;;;;"}

package/dist/components/hds/filter-bar/types.js

@@ -0,0 +1,35 @@
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+let HdsFilterBarFilterTypeValues = /*#__PURE__*/function (HdsFilterBarFilterTypeValues) {
+  HdsFilterBarFilterTypeValues["multiSelect"] = "multi-select";
+  HdsFilterBarFilterTypeValues["singleSelect"] = "single-select";
+  HdsFilterBarFilterTypeValues["numerical"] = "numerical";
+  HdsFilterBarFilterTypeValues["date"] = "date";
+  HdsFilterBarFilterTypeValues["time"] = "time";
+  HdsFilterBarFilterTypeValues["datetime"] = "datetime";
+  HdsFilterBarFilterTypeValues["generic"] = "generic";
+  HdsFilterBarFilterTypeValues["search"] = "search";
+  return HdsFilterBarFilterTypeValues;
+}({});
+let HdsFilterBarNumericalFilterSelectorValues = /*#__PURE__*/function (HdsFilterBarNumericalFilterSelectorValues) {
+  HdsFilterBarNumericalFilterSelectorValues["lessThan"] = "less-than";
+  HdsFilterBarNumericalFilterSelectorValues["lessThanOrEqualTo"] = "less-than-or-equal-to";
+  HdsFilterBarNumericalFilterSelectorValues["equalTo"] = "equal-to";
+  HdsFilterBarNumericalFilterSelectorValues["greaterThanOrEqualTo"] = "greater-than-or-equal-to";
+  HdsFilterBarNumericalFilterSelectorValues["greaterThan"] = "greater-than";
+  HdsFilterBarNumericalFilterSelectorValues["between"] = "between";
+  return HdsFilterBarNumericalFilterSelectorValues;
+}({});
+let HdsFilterBarDateFilterSelectorValues = /*#__PURE__*/function (HdsFilterBarDateFilterSelectorValues) {
+  HdsFilterBarDateFilterSelectorValues["before"] = "before";
+  HdsFilterBarDateFilterSelectorValues["exactly"] = "exactly";
+  HdsFilterBarDateFilterSelectorValues["after"] = "after";
+  HdsFilterBarDateFilterSelectorValues["between"] = "between";
+  return HdsFilterBarDateFilterSelectorValues;
+}({});
+
+export { HdsFilterBarDateFilterSelectorValues, HdsFilterBarFilterTypeValues, HdsFilterBarNumericalFilterSelectorValues };
+//# sourceMappingURL=types.js.map

package/dist/components/hds/filter-bar/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":["../../../../src/components/hds/filter-bar/types.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nexport enum HdsFilterBarFilterTypeValues {\n  multiSelect = 'multi-select',\n  singleSelect = 'single-select',\n  numerical = 'numerical',\n  date = 'date',\n  time = 'time',\n  datetime = 'datetime',\n  generic = 'generic',\n  search = 'search',\n}\n\nexport type HdsFilterBarFilterType = `${HdsFilterBarFilterTypeValues}`;\n\nexport interface HdsFilterBarGenericFilterData {\n  value: unknown;\n}\n\nexport interface HdsFilterBarNumericalFilterData {\n  selector: HdsFilterBarNumericalFilterSelector;\n  value: HdsFilterBarNumericalFilterValue;\n}\n\nexport interface HdsFilterBarDateFilterData {\n  selector: HdsFilterBarDateFilterSelector;\n  value: HdsFilterBarDateFilterValue;\n}\n\nexport type HdsFilterBarData =\n  | HdsFilterBarGenericFilterData[]\n  | HdsFilterBarGenericFilterData\n  | HdsFilterBarNumericalFilterData\n  | HdsFilterBarDateFilterData;\n\nexport interface HdsFilterBarGenericFilter {\n  type: 'generic';\n  text?: string;\n  dismissTagText?: string;\n  data: HdsFilterBarGenericFilterData | HdsFilterBarGenericFilterData[];\n}\nexport interface HdsFilterBarSingleSelectFilter {\n  type: 'single-select';\n  text?: string;\n  data: HdsFilterBarGenericFilterData;\n}\n\nexport interface HdsFilterBarMultiSelectFilter {\n  type: 'multi-select';\n  text?: string;\n  data: HdsFilterBarGenericFilterData[];\n}\n\nexport interface HdsFilterBarNumericalFilter {\n  type: 'numerical';\n  text?: string;\n  data: HdsFilterBarNumericalFilterData;\n}\n\nexport interface HdsFilterBarDateFilter {\n  type: 'date' | 'time' | 'datetime';\n  text?: string;\n  data: HdsFilterBarDateFilterData;\n}\n\nexport interface HdsFilterBarSearchFilter {\n  type: 'search';\n  text?: string;\n  data: HdsFilterBarGenericFilterData;\n}\n\nexport type HdsFilterBarFilter =\n  | HdsFilterBarSingleSelectFilter\n  | HdsFilterBarMultiSelectFilter\n  | HdsFilterBarNumericalFilter\n  | HdsFilterBarDateFilter\n  | HdsFilterBarSearchFilter\n  | HdsFilterBarGenericFilter;\n\nexport interface HdsFilterBarFilters {\n  [name: string]: HdsFilterBarFilter;\n}\n\nexport enum HdsFilterBarNumericalFilterSelectorValues {\n  lessThan = 'less-than',\n  lessThanOrEqualTo = 'less-than-or-equal-to',\n  equalTo = 'equal-to',\n  greaterThanOrEqualTo = 'greater-than-or-equal-to',\n  greaterThan = 'greater-than',\n  between = 'between',\n}\n\nexport type HdsFilterBarNumericalFilterSelector =\n  `${HdsFilterBarNumericalFilterSelectorValues}`;\n\nexport enum HdsFilterBarDateFilterSelectorValues {\n  before = 'before',\n  exactly = 'exactly',\n  after = 'after',\n  between = 'between',\n}\n\nexport type HdsFilterBarDateFilterSelector =\n  `${HdsFilterBarDateFilterSelectorValues}`;\n\nexport type HdsFilterBarNumericalFilterValue =\n  | number\n  | { start?: number; end?: number };\n\nexport type HdsFilterBarDateFilterValue =\n  | string\n  | { start?: string; end?: string };\n"],"names":["HdsFilterBarFilterTypeValues","HdsFilterBarNumericalFilterSelectorValues","HdsFilterBarDateFilterSelectorValues"],"mappings":"AAAA;AACA;AACA;AACA;;AAEA,IAAYA,4BAA4B,0BAA5BA,4BAA4B,EAAA;EAA5BA,4BAA4B,CAAA,aAAA,CAAA,GAAA,cAAA;EAA5BA,4BAA4B,CAAA,cAAA,CAAA,GAAA,eAAA;EAA5BA,4BAA4B,CAAA,WAAA,CAAA,GAAA,WAAA;EAA5BA,4BAA4B,CAAA,MAAA,CAAA,GAAA,MAAA;EAA5BA,4BAA4B,CAAA,MAAA,CAAA,GAAA,MAAA;EAA5BA,4BAA4B,CAAA,UAAA,CAAA,GAAA,UAAA;EAA5BA,4BAA4B,CAAA,SAAA,CAAA,GAAA,SAAA;EAA5BA,4BAA4B,CAAA,QAAA,CAAA,GAAA,QAAA;AAAA,EAAA,OAA5BA,4BAA4B;AAAA,CAAA,CAAA,EAAA;AAiFxC,IAAYC,yCAAyC,0BAAzCA,yCAAyC,EAAA;EAAzCA,yCAAyC,CAAA,UAAA,CAAA,GAAA,WAAA;EAAzCA,yCAAyC,CAAA,mBAAA,CAAA,GAAA,uBAAA;EAAzCA,yCAAyC,CAAA,SAAA,CAAA,GAAA,UAAA;EAAzCA,yCAAyC,CAAA,sBAAA,CAAA,GAAA,0BAAA;EAAzCA,yCAAyC,CAAA,aAAA,CAAA,GAAA,cAAA;EAAzCA,yCAAyC,CAAA,SAAA,CAAA,GAAA,SAAA;AAAA,EAAA,OAAzCA,yCAAyC;AAAA,CAAA,CAAA,EAAA;AAYrD,IAAYC,oCAAoC,0BAApCA,oCAAoC,EAAA;EAApCA,oCAAoC,CAAA,QAAA,CAAA,GAAA,QAAA;EAApCA,oCAAoC,CAAA,SAAA,CAAA,GAAA,SAAA;EAApCA,oCAAoC,CAAA,OAAA,CAAA,GAAA,OAAA;EAApCA,oCAAoC,CAAA,SAAA,CAAA,GAAA,SAAA;AAAA,EAAA,OAApCA,oCAAoC;AAAA,CAAA,CAAA,EAAA;;;;"}

package/dist/components.js

@@ -83,6 +83,18 @@ export { default as HdsDropdownToggleIcon } from './components/hds/dropdown/togg
 export { HdsDropdownListItemInteractiveColorValues } from './components/hds/dropdown/list-item/types.js';
 export { HdsDropdownToggleButtonColorValues, HdsDropdownToggleButtonSizeValues, HdsDropdownToggleIconAllowedIconValues, HdsDropdownToggleIconSizeValues } from './components/hds/dropdown/toggle/types.js';
 export { HdsDropdownPositionToPlacementValues, HdsDropdownPositionValues } from './components/hds/dropdown/types.js';
+export { default as HdsFilterBar } from './components/hds/filter-bar/index.js';
+export { default as HdsFilterBarDropdown } from './components/hds/filter-bar/dropdown.js';
+export { default as HdsFilterBarFilterGroup } from './components/hds/filter-bar/filter-group/index.js';
+export { default as HdsFilterBarFilterGroupCheckbox } from './components/hds/filter-bar/filter-group/checkbox.js';
+export { default as HdsFilterBarFilterGroupDate } from './components/hds/filter-bar/filter-group/date.js';
+export { default as HdsFilterBarFilterGroupGeneric } from './components/hds/filter-bar/filter-group/generic.js';
+export { default as HdsFilterBarFilterGroupRadio } from './components/hds/filter-bar/filter-group/radio.js';
+export { default as HdsFilterBarFilterGroupNumerical } from './components/hds/filter-bar/filter-group/numerical.js';
+export { default as HdsFilterBarTabs } from './components/hds/filter-bar/tabs/index.js';
+export { default as HdsFilterBarTabsPanel } from './components/hds/filter-bar/tabs/panel.js';
+export { default as HdsFilterBarTabsTab } from './components/hds/filter-bar/tabs/tab.js';
+export { HdsFilterBarDateFilterSelectorValues, HdsFilterBarFilterTypeValues, HdsFilterBarNumericalFilterSelectorValues } from './components/hds/filter-bar/types.js';
 export { default as HdsFlyout } from './components/hds/flyout/index.js';
 export { HdsFlyoutSizesValues } from './components/hds/flyout/types.js';
 export { default as HdsForm } from './components/hds/form/index.js';

package/dist/components.js.map

@@ -1 +1 @@
-{"version":3,"file":"components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/helpers/hds-link-to-query.js

@@ -18,7 +18,6 @@ import { helper } from '@ember/component/helper';
  */
 
 // this is a workaround for https://github.com/emberjs/ember.js/issues/19693
-// don't remove until we drop support for ember 3.27 and 3.28
 
 function hdsLinkToQuery([query]) {
   return query ?? {};

package/dist/helpers/hds-link-to-query.js.map

@@ -1 +1 @@
-{"version":3,"file":"hds-link-to-query.js","sources":["../../src/helpers/hds-link-to-query.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport { helper } from '@ember/component/helper';\n\n/*\n * This helper can be used to safely pass a @query argument to the `<LinkTo>` component\n * without the risk of triggering an assertion if the argument is undefined\n *\n * The result of this helper should be passed into the `@query` argument of the `<LinkTo>` component:\n *\n * ```hbs\n * <LinkTo @query={{hds-link-to-query @query}} />\n * ```\n */\n\n// this is a workaround for https://github.com/emberjs/ember.js/issues/19693\n// don't remove until we drop support for ember 3.27 and 3.28\n\nexport function hdsLinkToQuery([query]: [\n  Record<string, unknown> | undefined,\n]): Record<string, unknown> {\n  return query ?? {};\n}\n\nconst hdsLinkToQueryHelper = helper(hdsLinkToQuery);\nexport default hdsLinkToQueryHelper;\n"],"names":["hdsLinkToQuery","query","hdsLinkToQueryHelper","helper"],"mappings":";;AAAA;AACA;AACA;AACA;;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEO,SAASA,cAAcA,CAAC,CAACC,KAAK,CAEpC,EAA2B;EAC1B,OAAOA,KAAK,IAAI,EAAE;AACpB;AAEA,MAAMC,oBAAoB,GAAGC,MAAM,CAACH,cAAc;;;;"}
+{"version":3,"file":"hds-link-to-query.js","sources":["../../src/helpers/hds-link-to-query.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport { helper } from '@ember/component/helper';\n\n/*\n * This helper can be used to safely pass a @query argument to the `<LinkTo>` component\n * without the risk of triggering an assertion if the argument is undefined\n *\n * The result of this helper should be passed into the `@query` argument of the `<LinkTo>` component:\n *\n * ```hbs\n * <LinkTo @query={{hds-link-to-query @query}} />\n * ```\n */\n\n// this is a workaround for https://github.com/emberjs/ember.js/issues/19693\n\nexport function hdsLinkToQuery([query]: [\n  Record<string, unknown> | undefined,\n]): Record<string, unknown> {\n  return query ?? {};\n}\n\nconst hdsLinkToQueryHelper = helper(hdsLinkToQuery);\nexport default hdsLinkToQueryHelper;\n"],"names":["hdsLinkToQuery","query","hdsLinkToQueryHelper","helper"],"mappings":";;AAAA;AACA;AACA;AACA;;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEO,SAASA,cAAcA,CAAC,CAACC,KAAK,CAEpC,EAA2B;EAC1B,OAAOA,KAAK,IAAI,EAAE;AACpB;AAEA,MAAMC,oBAAoB,GAAGC,MAAM,CAACH,cAAc;;;;"}