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

package/dist/styles/components/app-header.scss

@@ -106,16 +106,13 @@
   }
 
   // Dropdown & Button color theming overrides
+  // Note: We need to apply dark theme styles to .hds-dropdown-toggle-button & .hds-dropdown-toggle-icon
+  // so we use a partial classname selector to cover both cases
+
   .hds-button,
-  .hds-dropdown-toggle-button,
-  .hds-dropdown-toggle-icon {
-    // Apply dark theme to child interactive components not within a nested dropdown
-    &:not(
-      .hds-dropdown * *,
-      .ember-basic-dropdown-trigger * *,
-      .ember-basic-dropdown-content * *,
-      .hds-dialog-primitive__wrapper *
-    ) {
+  button[class*="hds-dropdown-toggle"] {
+    // Apply dark theme to child interactive components not within a nested content container
+    &:not(.hds-dropdown__content *, .ember-basic-dropdown-content *, .hds-dialog-primitive__wrapper *) {
       @include hds-interactive-dark-theme();
 
       // disabled state:

package/dist/styles/components/filter-bar.scss

@@ -14,84 +14,33 @@
   background-color: var(--token-color-surface-faint);
   border: 1px solid var(--token-color-border-primary);
   border-radius: var(--token-border-radius-medium);
+}
 
-  .hds-filter-bar__filters {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 8px 12px;
-    align-items: end;
-    padding-top: 8px;
-    border-top: 1px solid var(--token-color-border-primary);
-
-    .hds-dropdown__list .hds-form-text-input {
-      width: auto;
-    }
-  }
-
-  .hds-filter-bar__actions {
-    display: flex;
-    flex-direction: row;
-    gap: 8px;
-    align-items: end;
-  }
+.hds-filter-bar__filters {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px 12px;
+  align-items: end;
+  padding-top: 8px;
+  border-top: 1px solid var(--token-color-border-primary);
 }
 
 .hds-filter-bar__actions__right {
-  display: flex;
-  flex-direction: row;
-  gap: 8px;
   margin-left: auto;
 }
 
 .hds-filter-bar__search {
-  --token-form-control-padding: 4px;
-}
-
-// FILTERS DROPDOWN
-//
-
-.hds-filter-bar__filters-dropdown__filter-group .hds-form-field--layout-flag {
-  padding: 8px 12px;
+  --token-form-control-padding: 3px;
 }
 
-.hds-filter-bar__filters-dropdown .hds-dropdown__list,
-.hds-filter-bar__filters-dropdown .hds-dropdown-list-item {
-  padding: 0;
-}
-
-.hds-filter-bar__filters-dropdown .hds-layout-flex {
-  margin: 8px 0;
-}
-
-.hds-filter-bar__filters-dropdown .hds-button-set {
-  gap: 8px;
-}
+// FILTER BAR > DROPDOWN
 
-.hds-filter-bar__filters-dropdown__filter-group__list {
-  flex: 1 1 auto;
-  margin: 0;
+.hds-filter-bar__dropdown .hds-dropdown__list,
+.hds-filter-bar__dropdown .hds-dropdown-list-item {
   padding: 0;
-  overflow-y: auto;
-  list-style: none;
-  overscroll-behavior: contain;
-}
-
-.hds-filter-bar__filters-dropdown__filters-count,
-.hds-filter-bar__filters-dropdown__filter-group__filters-count {
-  margin-left: 8px;
-}
-
-.hds-filter-bar__filters-dropdown__filter-option {
-  display: block;
-  padding: 8px 0;
-
-  &--hidden {
-    display: none;
-  }
 }
 
-// TABS
-//
+// FILTER BAR > TABS
 
 .hds-filter-bar__tabs {
   display: flex;
@@ -109,21 +58,10 @@
   border-top-left-radius: var(--token-border-radius-medium);
 }
 
-.hds-filter-bar__tabs__panel:not([hidden]) {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-  width: 50%;
-  padding: 16px;
-  background-color: var(--token-color-surface-primary);
-  border-top-right-radius: var(--token-border-radius-medium);
-}
-
 .hds-filter-bar__tabs__tab__button {
   display: flex;
   gap: 16px;
   align-items: center;
-  justify-content: space-between;
   width: 100%;
   padding: 8px 12px;
   color: var(--token-color-foreground-primary);
@@ -132,24 +70,95 @@
   border: none;
   border-radius: var(--token-border-radius-small);
 
-  .hds-icon {
-    fill: var(--token-color-foreground-primary);
-  }
-
   &.mock-hover,
-  &:hover,
-  &.mock-focus,
-  &:focus {
+  &:hover {
     background-color: var(--token-color-surface-interactive-hover);
     cursor: pointer;
   }
+
+  &.mock-active,
+  &:active {
+    background-color: var(--token-color-surface-interactive-active);
+  }
+}
+
+.hds-filter-bar__tabs__tab__text {
+  width: 100%;
 }
 
 .hds-filter-bar__tabs__tab--is-selected .hds-filter-bar__tabs__tab__button {
-  color: var(--token-color-foreground-strong);
-  background-color: var(--token-color-surface-interactive-active);
+  color: var(--token-color-foreground-action);
+  background-color: var(--token-color-surface-strong);
+
+  &.mock-hover,
+  &:hover {
+    background-color: var(--token-color-palette-neutral-200);
+  }
 
-  .hds-icon {
-    fill: var(--token-color-foreground-strong);
+  &.mock-active,
+  &:active {
+    background-color: var(--token-color-palette-neutral-300);
   }
 }
+
+.hds-filter-bar__tabs__panel:not([hidden]) {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  width: 50%;
+  padding: 16px 0;
+  background-color: var(--token-color-surface-primary);
+  border-top-right-radius: var(--token-border-radius-medium);
+}
+
+// FILTER BAR > FILTER GROUP
+
+.hds-filter-bar__filter-group .hds-form-field--layout-flag {
+  padding: 8px 12px;
+}
+
+.hds-filter-bar__filter-group__search {
+  padding: 0 16px 16px 16px;
+  border-bottom: 1px solid var(--token-color-border-primary);
+}
+
+.hds-filter-bar__filter-group__list {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  margin: 0;
+  padding: 0;
+  overflow-y: auto;
+  list-style: none;
+  overscroll-behavior: contain;
+}
+
+.hds-filter-bar__filter-group__fields {
+  padding: 0 16px;
+
+  .hds-filter-bar__filter-group__field,
+  .hds-filter-bar__filter-group__field[type="date"],
+  .hds-filter-bar__filter-group__field[type="time"] {
+    width: 100%;
+  }
+}
+
+.hds-filter-bar__filter-group__numerical,
+.hds-filter-bar__filter-group__date {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.hds-filter-bar__filter-group__selection-option {
+  display: block;
+  padding: 8px 16px;
+
+  &--hidden {
+    display: none;
+  }
+}
+
+.hds-filter-bar__filter-group__clear {
+  padding: 4px;
+}

package/dist/styles/components/side-nav/header.scss

@@ -69,21 +69,13 @@
 }
 
 // Dropdown & Button color theming overrides
-.hds-side-nav__dropdown, // deprecated classname
-.hds-side-nav,
-.hds-side-nav-header {
+
+.hds-side-nav {
   .hds-button,
-  .hds-dropdown-toggle-button,
-  .hds-dropdown-toggle-icon {
+  button[class*="hds-dropdown-toggle"] {
     // Apply dark theme to child interactive components not within a nested dropdown
-    &:not(
-      .hds-dropdown * *,
-      .ember-basic-dropdown-trigger * *,
-      .ember-basic-dropdown-content * *,
-      .hds-dialog-primitive__wrapper *
-    ) {
+    &:not(.hds-dropdown__content *, .ember-basic-dropdown-content *, .hds-dialog-primitive__wrapper *) {
       @include hds-interactive-dark-theme();
-
       // disabled state:
       &:disabled,
       &[disabled],

package/dist/styles/mixins/_interactive-dark-theme.scss

@@ -61,11 +61,14 @@ $hds-interactive-dark-theme-focus-ring-action-box-shadow:
   &.mock-focus {
     @include hds-focus-ring-with-pseudo-element($top: -1px, $right: -1px, $bottom: -1px, $left: -1px);
 
-    color: var(--token-color-foreground-high-contrast);
-    background-color: var(--token-color-palette-neutral-700);
+    // See: https://sass-lang.com/d/mixed-decls
+    & {
+      color: var(--token-color-foreground-high-contrast);
+      background-color: var(--token-color-palette-neutral-700);
 
-    @if ($add-visible-border) {
-      border-color: $hds-interactive-dark-theme-color-focus-action-internal;
+      @if ($add-visible-border) {
+        border-color: $hds-interactive-dark-theme-color-focus-action-internal;
+      }
     }
 
     // focus ring:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hashicorp/design-system-components",
-  "version": "5.1.0-rc-20251106155636",
+  "version": "5.1.0-rc-20251125151324",
   "description": "Helios Design System Components",
   "keywords": [
     "hashicorp",
@@ -219,12 +219,14 @@
       "./components/hds/dropdown/toggle/button.js": "./dist/_app_/components/hds/dropdown/toggle/button.js",
       "./components/hds/dropdown/toggle/chevron.js": "./dist/_app_/components/hds/dropdown/toggle/chevron.js",
       "./components/hds/dropdown/toggle/icon.js": "./dist/_app_/components/hds/dropdown/toggle/icon.js",
-      "./components/hds/filter-bar/checkbox.js": "./dist/_app_/components/hds/filter-bar/checkbox.js",
+      "./components/hds/filter-bar/dropdown.js": "./dist/_app_/components/hds/filter-bar/dropdown.js",
+      "./components/hds/filter-bar/filter-group/checkbox.js": "./dist/_app_/components/hds/filter-bar/filter-group/checkbox.js",
+      "./components/hds/filter-bar/filter-group/date.js": "./dist/_app_/components/hds/filter-bar/filter-group/date.js",
+      "./components/hds/filter-bar/filter-group/generic.js": "./dist/_app_/components/hds/filter-bar/filter-group/generic.js",
       "./components/hds/filter-bar/filter-group.js": "./dist/_app_/components/hds/filter-bar/filter-group.js",
-      "./components/hds/filter-bar/filters-dropdown.js": "./dist/_app_/components/hds/filter-bar/filters-dropdown.js",
+      "./components/hds/filter-bar/filter-group/numerical.js": "./dist/_app_/components/hds/filter-bar/filter-group/numerical.js",
+      "./components/hds/filter-bar/filter-group/radio.js": "./dist/_app_/components/hds/filter-bar/filter-group/radio.js",
       "./components/hds/filter-bar.js": "./dist/_app_/components/hds/filter-bar.js",
-      "./components/hds/filter-bar/radio.js": "./dist/_app_/components/hds/filter-bar/radio.js",
-      "./components/hds/filter-bar/range.js": "./dist/_app_/components/hds/filter-bar/range.js",
       "./components/hds/filter-bar/tabs.js": "./dist/_app_/components/hds/filter-bar/tabs.js",
       "./components/hds/filter-bar/tabs/panel.js": "./dist/_app_/components/hds/filter-bar/tabs/panel.js",
       "./components/hds/filter-bar/tabs/tab.js": "./dist/_app_/components/hds/filter-bar/tabs/tab.js",

package/translations/hds/components/filter-bar/date/en-us.yaml

@@ -0,0 +1,18 @@
+date:
+  label: Date is
+datetime:
+  label: Datetime is
+time:
+  label: Time is
+selector-input:
+  default-value: Pick a selector
+  before: Before
+  exactly: Exactly
+  after: After
+  between: Between
+value-input:
+  placeholder: Enter a date
+between-value-inputs:
+  start-placeholder: Start
+  end-placeholder: End
+clear: Clear filter

package/translations/hds/components/filter-bar/en-us.yaml

@@ -1,3 +1,9 @@
 search:
   aria-label: Search filters
   placeholder: Search
+filter-text:
+  numerical-filter:
+    separator: and
+  date-filter:
+    separator: and
+no-filters-applied: No filters applied

package/translations/hds/components/filter-bar/filter-group/en-us.yaml

@@ -0,0 +1 @@
+clear: Clear selection

package/translations/hds/components/filter-bar/filter-group/numerical/en-us.yaml

@@ -0,0 +1,15 @@
+label: Number is
+selector-input:
+  default-value: Pick a selector
+  less-than: Less than (<)
+  less-than-or-equal-to: Less than or equal to (≤)
+  equal-to: Equal to (=)
+  greater-than-or-equal-to: Greater than or equal to (≥)
+  greater-than: Greater than (>)
+  between: Between
+value-input:
+  placeholder: Enter a value
+between-value-inputs:
+  start-placeholder: Start
+  end-placeholder: End
+clear: Clear filter

package/translations/hds/components/filter-bar/filters-dropdown/en-us.yaml

@@ -4,4 +4,4 @@ expand-collapse-button:
   expand: Expand filters
   collapse: Collapse filters
 selected-filters: Filters selected
-toggle-button: Add filter
+toggle-button: Filters

package/declarations/components/hds/filter-bar/range.d.ts

@@ -1,33 +0,0 @@
-/**
- * Copyright (c) HashiCorp, Inc.
- * SPDX-License-Identifier: MPL-2.0
- */
-import Component from '@glimmer/component';
-import type Owner from '@ember/owner';
-import type { HdsFilterBarData, HdsFilterBarRangeFilterSelector } from './types.ts';
-export declare const SELECTORS: HdsFilterBarRangeFilterSelector[];
-export declare const SELECTORS_DISPLAY_TEXT: Record<HdsFilterBarRangeFilterSelector, string>;
-export declare const SELECTORS_DISPLAY_SYMBOL: Record<HdsFilterBarRangeFilterSelector, string>;
-export interface HdsFilterBarRangeSignature {
-    Args: {
-        keyFilter: HdsFilterBarData | undefined;
-        onChange?: (selector?: HdsFilterBarRangeFilterSelector, value?: number) => void;
-    };
-    Blocks: {
-        default: [];
-    };
-    Element: HTMLDivElement;
-}
-export default class HdsFilterBarRange extends Component<HdsFilterBarRangeSignature> {
-    private _selector;
-    private _value;
-    private _selectorValues;
-    private _selectorInputId;
-    private _valueInputId;
-    constructor(owner: Owner, args: HdsFilterBarRangeSignature['Args']);
-    get stringValue(): string | undefined;
-    selectorText(selector: HdsFilterBarRangeFilterSelector): string;
-    onSelectorChange(event: Event): void;
-    onValueChange(event: Event): void;
-    private _onChange;
-}

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

@@ -1 +0,0 @@
-{"version":3,"file":"checkbox.js","sources":["../../../../src/components/hds/filter-bar/checkbox.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\n\nimport type { HdsFilterBarData } from './types.ts';\n\nexport interface HdsFilterBarCheckboxSignature {\n  Args: {\n    value?: string;\n    keyFilter: HdsFilterBarData | undefined;\n    onChange?: (event: Event) => void;\n  };\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLDivElement;\n}\n\nexport default class HdsFilterBarCheckbox extends Component<HdsFilterBarCheckboxSignature> {\n  @action\n  onChange(event: Event): void {\n    const { onChange } = this.args;\n    if (onChange && typeof onChange === 'function') {\n      onChange(event);\n    }\n  }\n\n  get isChecked(): boolean {\n    const { keyFilter, value } = this.args;\n    if (Array.isArray(keyFilter)) {\n      return keyFilter.some((filter) => filter.value === value);\n    }\n    return false;\n  }\n}\n"],"names":["HdsFilterBarCheckbox","Component","onChange","event","args","n","prototype","action","isChecked","keyFilter","value","Array","isArray","some","filter","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;;AAmBe,MAAMA,oBAAoB,SAASC,SAAS,CAAgC;EAEzFC,QAAQA,CAACC,KAAY,EAAQ;IAC3B,MAAM;AAAED,MAAAA;KAAU,GAAG,IAAI,CAACE,IAAI;AAC9B,IAAA,IAAIF,QAAQ,IAAI,OAAOA,QAAQ,KAAK,UAAU,EAAE;MAC9CA,QAAQ,CAACC,KAAK,CAAC;AACjB,IAAA;AACF,EAAA;AAAC,EAAA;IAAAE,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,UAAA,EAAA,CANAC,MAAM,CAAA,CAAA;AAAA;EAQP,IAAIC,SAASA,GAAY;IACvB,MAAM;MAAEC,SAAS;AAAEC,MAAAA;KAAO,GAAG,IAAI,CAACN,IAAI;AACtC,IAAA,IAAIO,KAAK,CAACC,OAAO,CAACH,SAAS,CAAC,EAAE;MAC5B,OAAOA,SAAS,CAACI,IAAI,CAAEC,MAAM,IAAKA,MAAM,CAACJ,KAAK,KAAKA,KAAK,CAAC;AAC3D,IAAA;AACA,IAAA,OAAO,KAAK;AACd,EAAA;AACF;AAACK,oBAAA,CAAAC,QAAA,EAhBoBhB,oBAAoB,CAAA;;;;"}

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

@@ -1 +0,0 @@
-{"version":3,"file":"filter-group.js","sources":["../../../../src/components/hds/filter-bar/filter-group.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\nimport { tracked } from '@glimmer/tracking';\nimport { modifier } from 'ember-modifier';\nimport type { WithBoundArgs } from '@glint/template';\n\nimport HdsFilterBarTabsTab from './tabs/tab.ts';\nimport HdsFilterBarTabsPanel from './tabs/panel.ts';\nimport type { HdsTabsPanelSignature } from '../tabs/panel.ts';\n\nimport HdsFilterBarCheckbox from './checkbox.ts';\nimport HdsFilterBarRadio from './radio.ts';\n\nimport type {\n  HdsFilterBarFilter,\n  HdsFilterBarFilters,\n  HdsFilterBarFilterType,\n  HdsFilterBarData,\n  HdsFilterBarGenericFilterData,\n  HdsFilterBarRangeFilterData,\n  HdsFilterBarRangeFilterSelector,\n} from './types.ts';\n\nexport interface HdsFilterBarFilterGroupSignature {\n  Args: {\n    tab?: WithBoundArgs<typeof HdsFilterBarTabsTab, never>;\n    panel?: WithBoundArgs<typeof HdsFilterBarTabsPanel, never>;\n    key: string;\n    text: string;\n    type?: HdsFilterBarFilterType;\n    filters: HdsFilterBarFilters;\n    searchEnabled?: boolean;\n    onChange: (key: string, keyFilter?: HdsFilterBarFilter) => void;\n  };\n  Blocks: {\n    default: [\n      {\n        Checkbox?: WithBoundArgs<\n          typeof HdsFilterBarCheckbox,\n          'keyFilter' | 'onChange'\n        >;\n        Radio?: WithBoundArgs<\n          typeof HdsFilterBarRadio,\n          'keyFilter' | 'onChange'\n        >;\n      },\n    ];\n  };\n  Element: HdsTabsPanelSignature['Element'];\n}\n\nexport default class HdsFilterBarFilterGroup extends Component<HdsFilterBarFilterGroupSignature> {\n  @tracked internalFilters: HdsFilterBarData | undefined = [];\n\n  private _panelElement!: HdsTabsPanelSignature['Element'];\n\n  private _setUpFilterPanel = modifier(\n    (element: HdsTabsPanelSignature['Element']) => {\n      this._panelElement = element;\n\n      if (this.keyFilter) {\n        this.internalFilters = JSON.parse(\n          JSON.stringify(this.keyFilter)\n        ) as HdsFilterBarData;\n      }\n    }\n  );\n\n  get type(): HdsFilterBarFilterType {\n    const { type } = this.args;\n\n    if (!type) {\n      return 'multi-select';\n    }\n    return type;\n  }\n\n  get keyFilter(): HdsFilterBarData | undefined {\n    const { filters, key } = this.args;\n\n    if (!filters) {\n      return undefined;\n    }\n    return filters[key]?.data;\n  }\n\n  get numFilters(): number {\n    const { filters, key } = this.args;\n    if (filters && key in filters) {\n      const keyFilters = filters[key]?.data;\n      if (Array.isArray(keyFilters)) {\n        return keyFilters.length;\n      } else if (keyFilters) {\n        return 1;\n      }\n    }\n    return 0;\n  }\n\n  @action\n  onSelectionChange(event: Event): void {\n    const addFilter = (value: unknown): void => {\n      const newFilter = {\n        value: value,\n      } as HdsFilterBarGenericFilterData;\n      if (this.type === 'single-select') {\n        this.internalFilters = newFilter;\n      } else {\n        if (Array.isArray(this.internalFilters)) {\n          this.internalFilters.push(newFilter);\n        } else {\n          this.internalFilters = [newFilter];\n        }\n      }\n    };\n\n    const removeFilter = (value: string): void => {\n      if (this.type === 'single-select') {\n        this.internalFilters = undefined;\n      } else {\n        if (Array.isArray(this.internalFilters)) {\n          const newFilter = [] as HdsFilterBarGenericFilterData[];\n          this.internalFilters.forEach((filter) => {\n            if (filter.value != value) {\n              newFilter.push(filter);\n            }\n          });\n          this.internalFilters = newFilter;\n        } else {\n          this.internalFilters = [];\n        }\n      }\n    };\n\n    const input = event.target as HTMLInputElement;\n\n    if (input.checked) {\n      addFilter(input.value);\n    } else {\n      removeFilter(input.value);\n    }\n\n    const { onChange } = this.args;\n    if (onChange && typeof onChange === 'function') {\n      onChange(this.args.key, this.formattedFilters);\n    }\n  }\n\n  @action\n  onRangeChange(\n    selector?: HdsFilterBarRangeFilterSelector,\n    value?: number\n  ): void {\n    const addFilter = (): HdsFilterBarData => {\n      const newFilter = {\n        selector: selector,\n        value: value,\n      } as HdsFilterBarRangeFilterData;\n      return newFilter;\n    };\n\n    if (selector && value) {\n      this.internalFilters = addFilter();\n    } else {\n      this.internalFilters = undefined;\n    }\n\n    const { onChange } = this.args;\n    if (onChange && typeof onChange === 'function') {\n      onChange(this.args.key, this.formattedFilters);\n    }\n  }\n\n  get formattedFilters(): HdsFilterBarFilter | undefined {\n    if (\n      this.internalFilters === undefined ||\n      (Array.isArray(this.internalFilters) && this.internalFilters.length === 0)\n    ) {\n      return undefined;\n    }\n    return {\n      type: this.type,\n      text: this.args.text,\n      data: this.internalFilters,\n    } as HdsFilterBarFilter;\n  }\n\n  get classNames(): string {\n    const classes = ['hds-filter-bar__filter-group'];\n\n    classes.push(`hds-filter-bar__dropdown--type-${this.type}`);\n\n    return classes.join(' ');\n  }\n\n  private onSearch = (event: Event) => {\n    const listItems = this._panelElement.querySelectorAll(\n      '.hds-filter-bar__filters-dropdown__filter-option'\n    );\n    const input = event.target as HTMLInputElement;\n    listItems.forEach((item) => {\n      if (item.textContent) {\n        const text = item.textContent.toLowerCase();\n        const searchText = input.value.toLowerCase();\n        if (text.includes(searchText)) {\n          item.classList.remove(\n            'hds-filter-bar__filters-dropdown__filter-option--hidden'\n          );\n        } else {\n          item.classList.add(\n            'hds-filter-bar__filters-dropdown__filter-option--hidden'\n          );\n        }\n      }\n    });\n  };\n}\n"],"names":["HdsFilterBarFilterGroup","Component","g","prototype","tracked","i","void 0","_panelElement","_setUpFilterPanel","modifier","element","keyFilter","internalFilters","JSON","parse","stringify","type","args","filters","key","undefined","data","numFilters","keyFilters","Array","isArray","length","onSelectionChange","event","addFilter","value","newFilter","push","removeFilter","forEach","filter","input","target","checked","onChange","formattedFilters","n","action","onRangeChange","selector","text","classNames","classes","join","onSearch","listItems","querySelectorAll","item","textContent","toLowerCase","searchText","includes","classList","remove","add","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;;AAqDe,MAAMA,uBAAuB,SAASC,SAAS,CAAmC;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,iBAAA,EAAA,CAC9FC,OAAO,CAAA,EAAA,YAAA;AAAA,MAAA,OAAiD,EAAE;AAAA,IAAA,CAAA,CAAA;AAAA;AAAA,EAAA,gBAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,iBAAA,CAAA,EAAAC,MAAA;EAEnDC,aAAa;AAEbC,EAAAA,iBAAiB,GAAGC,QAAQ,CACjCC,OAAyC,IAAK;IAC7C,IAAI,CAACH,aAAa,GAAGG,OAAO;IAE5B,IAAI,IAAI,CAACC,SAAS,EAAE;AAClB,MAAA,IAAI,CAACC,eAAe,GAAGC,IAAI,CAACC,KAAK,CAC/BD,IAAI,CAACE,SAAS,CAAC,IAAI,CAACJ,SAAS,CAC/B,CAAqB;AACvB,IAAA;AACF,EAAA,CACF,CAAC;EAED,IAAIK,IAAIA,GAA2B;IACjC,MAAM;AAAEA,MAAAA;KAAM,GAAG,IAAI,CAACC,IAAI;IAE1B,IAAI,CAACD,IAAI,EAAE;AACT,MAAA,OAAO,cAAc;AACvB,IAAA;AACA,IAAA,OAAOA,IAAI;AACb,EAAA;EAEA,IAAIL,SAASA,GAAiC;IAC5C,MAAM;MAAEO,OAAO;AAAEC,MAAAA;KAAK,GAAG,IAAI,CAACF,IAAI;IAElC,IAAI,CAACC,OAAO,EAAE;AACZ,MAAA,OAAOE,SAAS;AAClB,IAAA;AACA,IAAA,OAAOF,OAAO,CAACC,GAAG,CAAC,EAAEE,IAAI;AAC3B,EAAA;EAEA,IAAIC,UAAUA,GAAW;IACvB,MAAM;MAAEJ,OAAO;AAAEC,MAAAA;KAAK,GAAG,IAAI,CAACF,IAAI;AAClC,IAAA,IAAIC,OAAO,IAAIC,GAAG,IAAID,OAAO,EAAE;AAC7B,MAAA,MAAMK,UAAU,GAAGL,OAAO,CAACC,GAAG,CAAC,EAAEE,IAAI;AACrC,MAAA,IAAIG,KAAK,CAACC,OAAO,CAACF,UAAU,CAAC,EAAE;QAC7B,OAAOA,UAAU,CAACG,MAAM;MAC1B,CAAC,MAAM,IAAIH,UAAU,EAAE;AACrB,QAAA,OAAO,CAAC;AACV,MAAA;AACF,IAAA;AACA,IAAA,OAAO,CAAC;AACV,EAAA;EAGAI,iBAAiBA,CAACC,KAAY,EAAQ;IACpC,MAAMC,SAAS,GAAIC,KAAc,IAAW;AAC1C,MAAA,MAAMC,SAAS,GAAG;AAChBD,QAAAA,KAAK,EAAEA;OACyB;AAClC,MAAA,IAAI,IAAI,CAACd,IAAI,KAAK,eAAe,EAAE;QACjC,IAAI,CAACJ,eAAe,GAAGmB,SAAS;AAClC,MAAA,CAAC,MAAM;QACL,IAAIP,KAAK,CAACC,OAAO,CAAC,IAAI,CAACb,eAAe,CAAC,EAAE;AACvC,UAAA,IAAI,CAACA,eAAe,CAACoB,IAAI,CAACD,SAAS,CAAC;AACtC,QAAA,CAAC,MAAM;AACL,UAAA,IAAI,CAACnB,eAAe,GAAG,CAACmB,SAAS,CAAC;AACpC,QAAA;AACF,MAAA;IACF,CAAC;IAED,MAAME,YAAY,GAAIH,KAAa,IAAW;AAC5C,MAAA,IAAI,IAAI,CAACd,IAAI,KAAK,eAAe,EAAE;QACjC,IAAI,CAACJ,eAAe,GAAGQ,SAAS;AAClC,MAAA,CAAC,MAAM;QACL,IAAII,KAAK,CAACC,OAAO,CAAC,IAAI,CAACb,eAAe,CAAC,EAAE;UACvC,MAAMmB,SAAS,GAAG,EAAqC;AACvD,UAAA,IAAI,CAACnB,eAAe,CAACsB,OAAO,CAAEC,MAAM,IAAK;AACvC,YAAA,IAAIA,MAAM,CAACL,KAAK,IAAIA,KAAK,EAAE;AACzBC,cAAAA,SAAS,CAACC,IAAI,CAACG,MAAM,CAAC;AACxB,YAAA;AACF,UAAA,CAAC,CAAC;UACF,IAAI,CAACvB,eAAe,GAAGmB,SAAS;AAClC,QAAA,CAAC,MAAM;UACL,IAAI,CAACnB,eAAe,GAAG,EAAE;AAC3B,QAAA;AACF,MAAA;IACF,CAAC;AAED,IAAA,MAAMwB,KAAK,GAAGR,KAAK,CAACS,MAA0B;IAE9C,IAAID,KAAK,CAACE,OAAO,EAAE;AACjBT,MAAAA,SAAS,CAACO,KAAK,CAACN,KAAK,CAAC;AACxB,IAAA,CAAC,MAAM;AACLG,MAAAA,YAAY,CAACG,KAAK,CAACN,KAAK,CAAC;AAC3B,IAAA;IAEA,MAAM;AAAES,MAAAA;KAAU,GAAG,IAAI,CAACtB,IAAI;AAC9B,IAAA,IAAIsB,QAAQ,IAAI,OAAOA,QAAQ,KAAK,UAAU,EAAE;MAC9CA,QAAQ,CAAC,IAAI,CAACtB,IAAI,CAACE,GAAG,EAAE,IAAI,CAACqB,gBAAgB,CAAC;AAChD,IAAA;AACF,EAAA;AAAC,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAtC,SAAA,EAAA,mBAAA,EAAA,CA/CAuC,MAAM,CAAA,CAAA;AAAA;AAkDPC,EAAAA,aAAaA,CACXC,QAA0C,EAC1Cd,KAAc,EACR;IACN,MAAMD,SAAS,GAAGA,MAAwB;AACxC,MAAA,MAAME,SAAS,GAAG;AAChBa,QAAAA,QAAQ,EAAEA,QAAQ;AAClBd,QAAAA,KAAK,EAAEA;OACuB;AAChC,MAAA,OAAOC,SAAS;IAClB,CAAC;IAED,IAAIa,QAAQ,IAAId,KAAK,EAAE;AACrB,MAAA,IAAI,CAAClB,eAAe,GAAGiB,SAAS,EAAE;AACpC,IAAA,CAAC,MAAM;MACL,IAAI,CAACjB,eAAe,GAAGQ,SAAS;AAClC,IAAA;IAEA,MAAM;AAAEmB,MAAAA;KAAU,GAAG,IAAI,CAACtB,IAAI;AAC9B,IAAA,IAAIsB,QAAQ,IAAI,OAAOA,QAAQ,KAAK,UAAU,EAAE;MAC9CA,QAAQ,CAAC,IAAI,CAACtB,IAAI,CAACE,GAAG,EAAE,IAAI,CAACqB,gBAAgB,CAAC;AAChD,IAAA;AACF,EAAA;AAAC,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAtC,SAAA,EAAA,eAAA,EAAA,CAvBAuC,MAAM,CAAA,CAAA;AAAA;EAyBP,IAAIF,gBAAgBA,GAAmC;IACrD,IACE,IAAI,CAAC5B,eAAe,KAAKQ,SAAS,IACjCI,KAAK,CAACC,OAAO,CAAC,IAAI,CAACb,eAAe,CAAC,IAAI,IAAI,CAACA,eAAe,CAACc,MAAM,KAAK,CAAE,EAC1E;AACA,MAAA,OAAON,SAAS;AAClB,IAAA;IACA,OAAO;MACLJ,IAAI,EAAE,IAAI,CAACA,IAAI;AACf6B,MAAAA,IAAI,EAAE,IAAI,CAAC5B,IAAI,CAAC4B,IAAI;MACpBxB,IAAI,EAAE,IAAI,CAACT;KACZ;AACH,EAAA;EAEA,IAAIkC,UAAUA,GAAW;AACvB,IAAA,MAAMC,OAAO,GAAG,CAAC,8BAA8B,CAAC;IAEhDA,OAAO,CAACf,IAAI,CAAC,CAAA,+BAAA,EAAkC,IAAI,CAAChB,IAAI,EAAE,CAAC;AAE3D,IAAA,OAAO+B,OAAO,CAACC,IAAI,CAAC,GAAG,CAAC;AAC1B,EAAA;EAEQC,QAAQ,GAAIrB,KAAY,IAAK;IACnC,MAAMsB,SAAS,GAAG,IAAI,CAAC3C,aAAa,CAAC4C,gBAAgB,CACnD,kDACF,CAAC;AACD,IAAA,MAAMf,KAAK,GAAGR,KAAK,CAACS,MAA0B;AAC9Ca,IAAAA,SAAS,CAAChB,OAAO,CAAEkB,IAAI,IAAK;MAC1B,IAAIA,IAAI,CAACC,WAAW,EAAE;QACpB,MAAMR,IAAI,GAAGO,IAAI,CAACC,WAAW,CAACC,WAAW,EAAE;QAC3C,MAAMC,UAAU,GAAGnB,KAAK,CAACN,KAAK,CAACwB,WAAW,EAAE;AAC5C,QAAA,IAAIT,IAAI,CAACW,QAAQ,CAACD,UAAU,CAAC,EAAE;AAC7BH,UAAAA,IAAI,CAACK,SAAS,CAACC,MAAM,CACnB,yDACF,CAAC;AACH,QAAA,CAAC,MAAM;AACLN,UAAAA,IAAI,CAACK,SAAS,CAACE,GAAG,CAChB,yDACF,CAAC;AACH,QAAA;AACF,MAAA;AACF,IAAA,CAAC,CAAC;EACJ,CAAC;AACH;AAACC,oBAAA,CAAAC,QAAA,EArKoB7D,uBAAuB,CAAA;;;;"}

package/dist/components/hds/filter-bar/filters-dropdown.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"filters-dropdown.js","sources":["../../../../src/components/hds/filter-bar/filters-dropdown.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\nimport { tracked } from '@glimmer/tracking';\nimport { modifier } from 'ember-modifier';\nimport type Owner from '@ember/owner';\nimport type { WithBoundArgs } from '@glint/template';\n\nimport HdsFilterBarFilterGroup from './filter-group.ts';\nimport type { HdsFilterBarFilters, HdsFilterBarFilter } from './types.ts';\n\nimport type { HdsDropdownSignature } from '../dropdown/index.ts';\n\nexport interface HdsFilterBarFiltersDropdownSignature {\n  Args: HdsDropdownSignature['Args'] & {\n    filters: HdsFilterBarFilters;\n    onFilter?: (filters: HdsFilterBarFilters) => void;\n  };\n  Blocks: {\n    default: [\n      {\n        FilterGroup?: WithBoundArgs<\n          typeof HdsFilterBarFilterGroup,\n          'tab' | 'panel' | 'filters' | 'onChange'\n        >;\n      },\n    ];\n  };\n  Element: HTMLDivElement;\n}\n\nexport default class HdsFilterBarFiltersDropdown extends Component<\n  HdsDropdownSignature & HdsFilterBarFiltersDropdownSignature\n> {\n  @tracked internalFilters: HdsFilterBarFilters = {};\n\n  constructor(\n    owner: Owner,\n    args: HdsFilterBarFiltersDropdownSignature['Args']\n  ) {\n    super(owner, args);\n\n    const { filters } = this.args;\n\n    if (filters) {\n      this.internalFilters = { ...filters };\n    }\n  }\n\n  private _syncFilters = modifier(\n    (_element, [_filters]: [HdsFilterBarFilters | undefined]) => {\n      if (_filters) {\n        this.internalFilters = _filters;\n      }\n    }\n  );\n\n  @action\n  onFilter(key: string, keyFilter?: HdsFilterBarFilter): void {\n    this.internalFilters = this._updateFilter(key, keyFilter);\n  }\n\n  @action\n  onApply(closeDropdown?: () => void): void {\n    const { onFilter } = this.args;\n    if (onFilter && typeof onFilter === 'function') {\n      onFilter(this.internalFilters);\n    }\n\n    if (closeDropdown && typeof closeDropdown === 'function') {\n      closeDropdown();\n    }\n  }\n\n  @action\n  onClear(closeDropdown?: () => void): void {\n    const { onFilter } = this.args;\n    this.internalFilters = {};\n\n    if (onFilter && typeof onFilter === 'function') {\n      onFilter(this.internalFilters);\n    }\n\n    if (closeDropdown && typeof closeDropdown === 'function') {\n      closeDropdown();\n    }\n  }\n\n  get numFilters(): number {\n    let numFilters = 0;\n    Object.keys(this.internalFilters).forEach((key) => {\n      const filter = this.internalFilters[key];\n      if (filter) {\n        if (Array.isArray(filter.data)) {\n          numFilters += filter.data.length;\n        } else {\n          numFilters += 1;\n        }\n      }\n    });\n    return numFilters;\n  }\n\n  get classNames(): string {\n    const classes = ['hds-filter-bar__filters-dropdown'];\n\n    return classes.join(' ');\n  }\n\n  private _updateFilter(\n    key: string,\n    keyFilter?: HdsFilterBarFilter\n  ): HdsFilterBarFilters {\n    const newFilters = {} as HdsFilterBarFilters;\n\n    Object.keys(this.internalFilters).forEach((k) => {\n      newFilters[k] = JSON.parse(\n        JSON.stringify(this.internalFilters[k])\n      ) as HdsFilterBarFilter;\n    });\n    if (\n      keyFilter === undefined ||\n      (Array.isArray(keyFilter) && keyFilter.length === 0)\n    ) {\n      delete newFilters[key];\n    } else {\n      Object.assign(newFilters, { [key]: keyFilter });\n    }\n\n    return { ...newFilters };\n  }\n\n  private _onClose = (): void => {\n    const { filters } = this.args;\n    if (filters) {\n      this.internalFilters = { ...filters };\n    } else {\n      this.internalFilters = {};\n    }\n  };\n}\n"],"names":["HdsFilterBarFiltersDropdown","Component","g","prototype","tracked","i","void 0","constructor","owner","args","filters","internalFilters","_syncFilters","modifier","_element","_filters","onFilter","key","keyFilter","_updateFilter","n","action","onApply","closeDropdown","onClear","numFilters","Object","keys","forEach","filter","Array","isArray","data","length","classNames","classes","join","newFilters","k","JSON","parse","stringify","undefined","assign","_onClose","setComponentTemplate","TEMPLATE"],"mappings":"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"}

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

@@ -1 +0,0 @@
-{"version":3,"file":"radio.js","sources":["../../../../src/components/hds/filter-bar/radio.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\n\nimport type { HdsFilterBarData } from './types.ts';\n\nexport interface HdsFilterBarRadioSignature {\n  Args: {\n    value?: string;\n    keyFilter: HdsFilterBarData | undefined;\n    onChange?: (event: Event) => void;\n  };\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLDivElement;\n}\n\nexport default class HdsFilterBarRadio extends Component<HdsFilterBarRadioSignature> {\n  @action\n  onChange(event: Event): void {\n    const { onChange } = this.args;\n    if (onChange && typeof onChange === 'function') {\n      onChange(event);\n    }\n  }\n\n  get isChecked(): boolean {\n    const { keyFilter, value } = this.args;\n    if (keyFilter && value && 'value' in keyFilter) {\n      return keyFilter.value === value;\n    }\n    return false;\n  }\n}\n"],"names":["HdsFilterBarRadio","Component","onChange","event","args","n","prototype","action","isChecked","keyFilter","value","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;;AAmBe,MAAMA,iBAAiB,SAASC,SAAS,CAA6B;EAEnFC,QAAQA,CAACC,KAAY,EAAQ;IAC3B,MAAM;AAAED,MAAAA;KAAU,GAAG,IAAI,CAACE,IAAI;AAC9B,IAAA,IAAIF,QAAQ,IAAI,OAAOA,QAAQ,KAAK,UAAU,EAAE;MAC9CA,QAAQ,CAACC,KAAK,CAAC;AACjB,IAAA;AACF,EAAA;AAAC,EAAA;IAAAE,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,UAAA,EAAA,CANAC,MAAM,CAAA,CAAA;AAAA;EAQP,IAAIC,SAASA,GAAY;IACvB,MAAM;MAAEC,SAAS;AAAEC,MAAAA;KAAO,GAAG,IAAI,CAACN,IAAI;AACtC,IAAA,IAAIK,SAAS,IAAIC,KAAK,IAAI,OAAO,IAAID,SAAS,EAAE;AAC9C,MAAA,OAAOA,SAAS,CAACC,KAAK,KAAKA,KAAK;AAClC,IAAA;AACA,IAAA,OAAO,KAAK;AACd,EAAA;AACF;AAACC,oBAAA,CAAAC,QAAA,EAhBoBZ,iBAAiB,CAAA;;;;"}

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

@@ -1,88 +0,0 @@
-import Component from '@glimmer/component';
-import { action } from '@ember/object';
-import { tracked } from '@glimmer/tracking';
-import { guidFor } from '@ember/object/internals';
-import { HdsFilterBarRangeFilterSelectorValues } from './types.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__filters-dropdown__filter-range\">\n  <Hds::Form::Label>\n    {{hds-t \"hds.components.filter-bar.range.label\" default=\"Number is\"}}\n  </Hds::Form::Label>\n  <Hds::Layout::Flex @direction=\"column\" @gap=\"16\">\n    <Hds::Form::Select::Base @id={{this._selectorInputId}} {{on \"change\" this.onSelectorChange}} as |F|>\n      <F.Options>\n        <option value=\"\">{{hds-t\n            \"hds.components.filter-bar.range.selector-input.default-value\"\n            default=\"Pick a selector\"\n          }}</option>\n        {{#each this._selectorValues as |selectorValue|}}\n          <option value={{selectorValue}} selected={{eq selectorValue this._selector}}>{{this.selectorText\n              selectorValue\n            }}</option>\n        {{/each}}\n      </F.Options>\n    </Hds::Form::Select::Base>\n    <Hds::Form::TextInput::Base\n      @id={{this._valueInputId}}\n      @type=\"text\"\n      @value={{this.stringValue}}\n      placeholder=\"Enter a number\"\n      {{on \"change\" this.onValueChange}}\n    />\n  </Hds::Layout::Flex>\n</div>");
-
-/**
- * Copyright (c) HashiCorp, Inc.
- * SPDX-License-Identifier: MPL-2.0
- */
-
-const SELECTORS = Object.values(HdsFilterBarRangeFilterSelectorValues);
-const SELECTORS_DISPLAY_TEXT = {
-  [HdsFilterBarRangeFilterSelectorValues.lessThan]: 'Less than',
-  [HdsFilterBarRangeFilterSelectorValues.lessThanOrEqualTo]: 'Less than or equal to',
-  [HdsFilterBarRangeFilterSelectorValues.equalTo]: 'Equal to',
-  [HdsFilterBarRangeFilterSelectorValues.greaterThanOrEqualTo]: 'Greater than or equal to',
-  [HdsFilterBarRangeFilterSelectorValues.greaterThan]: 'Greater than'
-};
-const SELECTORS_DISPLAY_SYMBOL = {
-  [HdsFilterBarRangeFilterSelectorValues.lessThan]: '<',
-  [HdsFilterBarRangeFilterSelectorValues.lessThanOrEqualTo]: '<=',
-  [HdsFilterBarRangeFilterSelectorValues.equalTo]: '=',
-  [HdsFilterBarRangeFilterSelectorValues.greaterThanOrEqualTo]: '>=',
-  [HdsFilterBarRangeFilterSelectorValues.greaterThan]: '>'
-};
-class HdsFilterBarRange extends Component {
-  static {
-    g(this.prototype, "_selector", [tracked]);
-  }
-  #_selector = (i(this, "_selector"), void 0);
-  static {
-    g(this.prototype, "_value", [tracked]);
-  }
-  #_value = (i(this, "_value"), void 0);
-  _selectorValues = SELECTORS;
-  _selectorInputId = 'selector-input-' + guidFor(this);
-  _valueInputId = 'value-input-' + guidFor(this);
-  constructor(owner, args) {
-    super(owner, args);
-    const {
-      keyFilter
-    } = this.args;
-    if (keyFilter && 'selector' in keyFilter) {
-      this._selector = keyFilter.selector;
-      this._value = keyFilter.value;
-    }
-  }
-  get stringValue() {
-    return this._value !== undefined ? this._value.toString() : undefined;
-  }
-  selectorText(selector) {
-    return SELECTORS_DISPLAY_TEXT[selector];
-  }
-  onSelectorChange(event) {
-    const select = event.target;
-    this._selector = select.value;
-    this._onChange();
-  }
-  static {
-    n(this.prototype, "onSelectorChange", [action]);
-  }
-  onValueChange(event) {
-    const input = event.target;
-    this._value = parseFloat(input.value);
-    this._onChange();
-  }
-  static {
-    n(this.prototype, "onValueChange", [action]);
-  }
-  _onChange() {
-    const {
-      onChange
-    } = this.args;
-    if (onChange && typeof onChange === 'function') {
-      onChange(this._selector, this._value);
-    }
-  }
-}
-setComponentTemplate(TEMPLATE, HdsFilterBarRange);
-
-export { SELECTORS, SELECTORS_DISPLAY_SYMBOL, SELECTORS_DISPLAY_TEXT, HdsFilterBarRange as default };
-//# sourceMappingURL=range.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"range.js","sources":["../../../../src/components/hds/filter-bar/range.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\nimport { tracked } from '@glimmer/tracking';\nimport type Owner from '@ember/owner';\nimport { guidFor } from '@ember/object/internals';\n\nimport type {\n  HdsFilterBarData,\n  HdsFilterBarRangeFilterSelector,\n} from './types.ts';\nimport { HdsFilterBarRangeFilterSelectorValues } from './types.ts';\n\nexport const SELECTORS: HdsFilterBarRangeFilterSelector[] = Object.values(\n  HdsFilterBarRangeFilterSelectorValues\n);\n\nexport const SELECTORS_DISPLAY_TEXT: Record<\n  HdsFilterBarRangeFilterSelector,\n  string\n> = {\n  [HdsFilterBarRangeFilterSelectorValues.lessThan]: 'Less than',\n  [HdsFilterBarRangeFilterSelectorValues.lessThanOrEqualTo]:\n    'Less than or equal to',\n  [HdsFilterBarRangeFilterSelectorValues.equalTo]: 'Equal to',\n  [HdsFilterBarRangeFilterSelectorValues.greaterThanOrEqualTo]:\n    'Greater than or equal to',\n  [HdsFilterBarRangeFilterSelectorValues.greaterThan]: 'Greater than',\n};\n\nexport const SELECTORS_DISPLAY_SYMBOL: Record<\n  HdsFilterBarRangeFilterSelector,\n  string\n> = {\n  [HdsFilterBarRangeFilterSelectorValues.lessThan]: '<',\n  [HdsFilterBarRangeFilterSelectorValues.lessThanOrEqualTo]: '<=',\n  [HdsFilterBarRangeFilterSelectorValues.equalTo]: '=',\n  [HdsFilterBarRangeFilterSelectorValues.greaterThanOrEqualTo]: '>=',\n  [HdsFilterBarRangeFilterSelectorValues.greaterThan]: '>',\n};\n\nexport interface HdsFilterBarRangeSignature {\n  Args: {\n    keyFilter: HdsFilterBarData | undefined;\n    onChange?: (\n      selector?: HdsFilterBarRangeFilterSelector,\n      value?: number\n    ) => void;\n  };\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLDivElement;\n}\n\nexport default class HdsFilterBarRange extends Component<HdsFilterBarRangeSignature> {\n  @tracked private _selector: HdsFilterBarRangeFilterSelector | undefined;\n  @tracked private _value: number | undefined;\n\n  private _selectorValues = SELECTORS;\n  private _selectorInputId = 'selector-input-' + guidFor(this);\n  private _valueInputId = 'value-input-' + guidFor(this);\n\n  constructor(owner: Owner, args: HdsFilterBarRangeSignature['Args']) {\n    super(owner, args);\n\n    const { keyFilter } = this.args;\n    if (keyFilter && 'selector' in keyFilter) {\n      this._selector = keyFilter.selector;\n      this._value = keyFilter.value;\n    }\n  }\n\n  get stringValue(): string | undefined {\n    return this._value !== undefined ? this._value.toString() : undefined;\n  }\n\n  selectorText(selector: HdsFilterBarRangeFilterSelector): string {\n    return SELECTORS_DISPLAY_TEXT[selector];\n  }\n\n  @action\n  onSelectorChange(event: Event): void {\n    const select = event.target as HTMLSelectElement;\n    this._selector = select.value as HdsFilterBarRangeFilterSelector;\n    this._onChange();\n  }\n\n  @action\n  onValueChange(event: Event): void {\n    const input = event.target as HTMLInputElement;\n    this._value = parseFloat(input.value);\n    this._onChange();\n  }\n\n  private _onChange(): void {\n    const { onChange } = this.args;\n    if (onChange && typeof onChange === 'function') {\n      onChange(this._selector, this._value);\n    }\n  }\n}\n"],"names":["SELECTORS","Object","values","HdsFilterBarRangeFilterSelectorValues","SELECTORS_DISPLAY_TEXT","lessThan","lessThanOrEqualTo","equalTo","greaterThanOrEqualTo","greaterThan","SELECTORS_DISPLAY_SYMBOL","HdsFilterBarRange","Component","g","prototype","tracked","i","void 0","_selectorValues","_selectorInputId","guidFor","_valueInputId","constructor","owner","args","keyFilter","_selector","selector","_value","value","stringValue","undefined","toString","selectorText","onSelectorChange","event","select","target","_onChange","n","action","onValueChange","input","parseFloat","onChange","setComponentTemplate","TEMPLATE"],"mappings":"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"}

package/translations/hds/components/filter-bar/range/en-us.yaml

@@ -1,3 +0,0 @@
-label: Number is
-selector-input:
-  default-value: Pick a selector