@hashicorp/design-system-components 4.16.0 → 4.17.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -8
- package/declarations/components/hds/advanced-table/expandable-tr-group.d.ts +2 -1
- package/declarations/components/hds/advanced-table/expandable-tr-group.d.ts.map +1 -1
- package/declarations/components/hds/advanced-table/index.d.ts +1 -2
- package/declarations/components/hds/advanced-table/index.d.ts.map +1 -1
- package/declarations/components/hds/advanced-table/td.d.ts +1 -3
- package/declarations/components/hds/advanced-table/td.d.ts.map +1 -1
- package/declarations/components/hds/advanced-table/th-sort.d.ts +1 -3
- package/declarations/components/hds/advanced-table/th-sort.d.ts.map +1 -1
- package/declarations/components/hds/advanced-table/th.d.ts +1 -3
- package/declarations/components/hds/advanced-table/th.d.ts.map +1 -1
- package/declarations/components/hds/alert/index.d.ts +2 -1
- package/declarations/components/hds/alert/index.d.ts.map +1 -1
- package/declarations/components/hds/app-footer/status-link.d.ts +3 -2
- package/declarations/components/hds/app-footer/status-link.d.ts.map +1 -1
- package/declarations/components/hds/app-header/index.d.ts +2 -1
- package/declarations/components/hds/app-header/index.d.ts.map +1 -1
- package/declarations/components/hds/app-side-nav/index.d.ts +2 -1
- package/declarations/components/hds/app-side-nav/index.d.ts.map +1 -1
- package/declarations/components/hds/app-side-nav/portal/target.d.ts.map +1 -1
- package/declarations/components/hds/breadcrumb/item.d.ts +1 -1
- package/declarations/components/hds/breadcrumb/item.d.ts.map +1 -1
- package/declarations/components/hds/code-block/copy-button.d.ts +5 -2
- package/declarations/components/hds/code-block/copy-button.d.ts.map +1 -1
- package/declarations/components/hds/code-block/index.d.ts +3 -0
- package/declarations/components/hds/code-block/index.d.ts.map +1 -1
- package/declarations/components/hds/code-editor/index.d.ts +6 -2
- package/declarations/components/hds/code-editor/index.d.ts.map +1 -1
- package/declarations/components/hds/code-editor/title.d.ts +1 -1
- package/declarations/components/hds/code-editor/title.d.ts.map +1 -1
- package/declarations/components/hds/dropdown/list-item/interactive.d.ts +2 -1
- package/declarations/components/hds/dropdown/list-item/interactive.d.ts.map +1 -1
- package/declarations/components/hds/dropdown/toggle/icon.d.ts +2 -1
- package/declarations/components/hds/dropdown/toggle/icon.d.ts.map +1 -1
- package/declarations/components/hds/flyout/body.d.ts +2 -1
- package/declarations/components/hds/flyout/body.d.ts.map +1 -1
- package/declarations/components/hds/flyout/description.d.ts +2 -1
- package/declarations/components/hds/flyout/description.d.ts.map +1 -1
- package/declarations/components/hds/flyout/footer.d.ts +2 -1
- package/declarations/components/hds/flyout/footer.d.ts.map +1 -1
- package/declarations/components/hds/flyout/header.d.ts +2 -1
- package/declarations/components/hds/flyout/header.d.ts.map +1 -1
- package/declarations/components/hds/form/masked-input/base.d.ts +5 -2
- package/declarations/components/hds/form/masked-input/base.d.ts.map +1 -1
- package/declarations/components/hds/form/super-select/multiple/base.d.ts +1 -1
- package/declarations/components/hds/form/super-select/multiple/base.d.ts.map +1 -1
- package/declarations/components/hds/form/super-select/single/base.d.ts +1 -1
- package/declarations/components/hds/form/super-select/single/base.d.ts.map +1 -1
- package/declarations/components/hds/form/text-input/field.d.ts +3 -2
- package/declarations/components/hds/form/text-input/field.d.ts.map +1 -1
- package/declarations/components/hds/icon/index.d.ts +2 -1
- package/declarations/components/hds/icon/index.d.ts.map +1 -1
- package/declarations/components/hds/interactive/index.d.ts +1 -1
- package/declarations/components/hds/interactive/index.d.ts.map +1 -1
- package/declarations/components/hds/link/inline.d.ts +2 -1
- package/declarations/components/hds/link/inline.d.ts.map +1 -1
- package/declarations/components/hds/link/standalone.d.ts +2 -1
- package/declarations/components/hds/link/standalone.d.ts.map +1 -1
- package/declarations/components/hds/menu-primitive/index.d.ts +2 -1
- package/declarations/components/hds/menu-primitive/index.d.ts.map +1 -1
- package/declarations/components/hds/modal/body.d.ts +2 -1
- package/declarations/components/hds/modal/body.d.ts.map +1 -1
- package/declarations/components/hds/modal/footer.d.ts +2 -1
- package/declarations/components/hds/modal/footer.d.ts.map +1 -1
- package/declarations/components/hds/modal/header.d.ts +2 -1
- package/declarations/components/hds/modal/header.d.ts.map +1 -1
- package/declarations/components/hds/pagination/compact/index.d.ts +2 -1
- package/declarations/components/hds/pagination/compact/index.d.ts.map +1 -1
- package/declarations/components/hds/pagination/numbered/index.d.ts +3 -2
- package/declarations/components/hds/pagination/numbered/index.d.ts.map +1 -1
- package/declarations/components/hds/popover-primitive/index.d.ts +2 -1
- package/declarations/components/hds/popover-primitive/index.d.ts.map +1 -1
- package/declarations/components/hds/side-nav/header/icon-button.d.ts +2 -1
- package/declarations/components/hds/side-nav/header/icon-button.d.ts.map +1 -1
- package/declarations/components/hds/side-nav/index.d.ts +2 -1
- package/declarations/components/hds/side-nav/index.d.ts.map +1 -1
- package/declarations/components/hds/side-nav/portal/target.d.ts.map +1 -1
- package/declarations/components/hds/stepper/task/indicator.d.ts +1 -1
- package/declarations/components/hds/table/index.d.ts +2 -1
- package/declarations/components/hds/table/index.d.ts.map +1 -1
- package/declarations/components/hds/table/th-selectable.d.ts +3 -3
- package/declarations/components/hds/table/th-selectable.d.ts.map +1 -1
- package/declarations/components/hds/tabs/index.d.ts +2 -1
- package/declarations/components/hds/tabs/index.d.ts.map +1 -1
- package/declarations/components/hds/tag/index.d.ts +16 -0
- package/declarations/components/hds/tag/index.d.ts.map +1 -1
- package/declarations/components/hds/tag/types.d.ts +15 -0
- package/declarations/components/hds/tag/types.d.ts.map +1 -1
- package/declarations/components/hds/time/index.d.ts.map +1 -1
- package/declarations/helpers/hds-format-date.d.ts +16 -3
- package/declarations/helpers/hds-format-date.d.ts.map +1 -1
- package/declarations/helpers/hds-format-relative.d.ts +9 -3
- package/declarations/helpers/hds-format-relative.d.ts.map +1 -1
- package/declarations/helpers/hds-link-to-models.d.ts +7 -1
- package/declarations/helpers/hds-link-to-models.d.ts.map +1 -1
- package/declarations/helpers/hds-link-to-query.d.ts +7 -1
- package/declarations/helpers/hds-link-to-query.d.ts.map +1 -1
- package/declarations/instance-initializers/load-sprite.d.ts.map +1 -1
- package/declarations/{components/hds/advanced-table/helpers.d.ts → modifiers/hds-advanced-table-cell/dom-management.d.ts} +3 -4
- package/declarations/modifiers/hds-advanced-table-cell/dom-management.d.ts.map +1 -0
- package/declarations/modifiers/hds-advanced-table-cell/keyboard-navigation.d.ts +6 -0
- package/declarations/modifiers/hds-advanced-table-cell/keyboard-navigation.d.ts.map +1 -0
- package/declarations/modifiers/hds-advanced-table-cell.d.ts +26 -0
- package/declarations/modifiers/hds-advanced-table-cell.d.ts.map +1 -0
- package/declarations/modifiers/hds-clipboard.d.ts.map +1 -1
- package/declarations/modifiers/hds-code-editor/languages/rego.d.ts +48 -0
- package/declarations/modifiers/hds-code-editor/languages/rego.d.ts.map +1 -0
- package/declarations/modifiers/hds-code-editor/languages/sentinel.d.ts +4 -0
- package/declarations/modifiers/hds-code-editor/languages/sentinel.d.ts.map +1 -1
- package/declarations/modifiers/hds-code-editor/types.d.ts +2 -0
- package/declarations/modifiers/hds-code-editor/types.d.ts.map +1 -1
- package/declarations/modifiers/hds-code-editor.d.ts +9 -5
- package/declarations/modifiers/hds-code-editor.d.ts.map +1 -1
- package/declarations/modifiers/hds-tooltip.d.ts +4 -2
- package/declarations/modifiers/hds-tooltip.d.ts.map +1 -1
- package/declarations/services/hds-time-types.d.ts +7 -7
- package/declarations/services/hds-time-types.d.ts.map +1 -1
- package/declarations/services/hds-time.d.ts +3 -3
- package/declarations/services/hds-time.d.ts.map +1 -1
- package/declarations/template-registry.d.ts +2 -0
- package/declarations/template-registry.d.ts.map +1 -1
- package/dist/README.md +4 -8
- package/dist/_app_/modifiers/hds-advanced-table-cell/dom-management.js +1 -0
- package/dist/_app_/modifiers/hds-advanced-table-cell/keyboard-navigation.js +1 -0
- package/dist/_app_/modifiers/hds-advanced-table-cell.js +1 -0
- package/dist/_app_/modifiers/hds-code-editor/languages/rego.js +1 -0
- package/dist/components/hds/accordion/index.js.map +1 -1
- package/dist/components/hds/accordion/item/button.js +11 -4
- package/dist/components/hds/accordion/item/button.js.map +1 -1
- package/dist/components/hds/accordion/item/index.js +12 -11
- package/dist/components/hds/accordion/item/index.js.map +1 -1
- package/dist/components/hds/advanced-table/expandable-tr-group.js +16 -12
- package/dist/components/hds/advanced-table/expandable-tr-group.js.map +1 -1
- package/dist/components/hds/advanced-table/index.js +69 -53
- package/dist/components/hds/advanced-table/index.js.map +1 -1
- package/dist/components/hds/advanced-table/td.js +30 -36
- package/dist/components/hds/advanced-table/td.js.map +1 -1
- package/dist/components/hds/advanced-table/th-button-expand.js +13 -9
- package/dist/components/hds/advanced-table/th-button-expand.js.map +1 -1
- package/dist/components/hds/advanced-table/th-button-sort.js +8 -7
- package/dist/components/hds/advanced-table/th-button-sort.js.map +1 -1
- package/dist/components/hds/advanced-table/th-button-tooltip.js +7 -6
- package/dist/components/hds/advanced-table/th-button-tooltip.js.map +1 -1
- package/dist/components/hds/advanced-table/th-selectable.js +25 -17
- package/dist/components/hds/advanced-table/th-selectable.js.map +1 -1
- package/dist/components/hds/advanced-table/th-sort.js +30 -37
- package/dist/components/hds/advanced-table/th-sort.js.map +1 -1
- package/dist/components/hds/advanced-table/th.js +29 -36
- package/dist/components/hds/advanced-table/th.js.map +1 -1
- package/dist/components/hds/advanced-table/tr.js.map +1 -1
- package/dist/components/hds/alert/description.js.map +1 -1
- package/dist/components/hds/alert/index.js +19 -16
- package/dist/components/hds/alert/index.js.map +1 -1
- package/dist/components/hds/alert/title.js.map +1 -1
- package/dist/components/hds/app-footer/copyright.js.map +1 -1
- package/dist/components/hds/app-footer/index.js.map +1 -1
- package/dist/components/hds/app-footer/item.js.map +1 -1
- package/dist/components/hds/app-footer/legal-links.js.map +1 -1
- package/dist/components/hds/app-footer/link.js.map +1 -1
- package/dist/components/hds/app-footer/status-link.js.map +1 -1
- package/dist/components/hds/app-frame/index.js.map +1 -1
- package/dist/components/hds/app-frame/parts/footer.js.map +1 -1
- package/dist/components/hds/app-frame/parts/header.js.map +1 -1
- package/dist/components/hds/app-frame/parts/main.js.map +1 -1
- package/dist/components/hds/app-frame/parts/modals.js.map +1 -1
- package/dist/components/hds/app-frame/parts/sidebar.js.map +1 -1
- package/dist/components/hds/app-header/home-link.js.map +1 -1
- package/dist/components/hds/app-header/index.js +42 -34
- package/dist/components/hds/app-header/index.js.map +1 -1
- package/dist/components/hds/app-header/menu-button.js +11 -4
- package/dist/components/hds/app-header/menu-button.js.map +1 -1
- package/dist/components/hds/app-side-nav/index.js +44 -31
- package/dist/components/hds/app-side-nav/index.js.map +1 -1
- package/dist/components/hds/app-side-nav/list/back-link.js.map +1 -1
- package/dist/components/hds/app-side-nav/list/index.js +15 -13
- package/dist/components/hds/app-side-nav/list/index.js.map +1 -1
- package/dist/components/hds/app-side-nav/list/item.js.map +1 -1
- package/dist/components/hds/app-side-nav/list/link.js.map +1 -1
- package/dist/components/hds/app-side-nav/list/title.js +13 -9
- package/dist/components/hds/app-side-nav/list/title.js.map +1 -1
- package/dist/components/hds/app-side-nav/portal/index.js.map +1 -1
- package/dist/components/hds/app-side-nav/portal/target.js +31 -28
- package/dist/components/hds/app-side-nav/portal/target.js.map +1 -1
- package/dist/components/hds/app-side-nav/toggle-button.js.map +1 -1
- package/dist/components/hds/application-state/body.js.map +1 -1
- package/dist/components/hds/application-state/footer.js.map +1 -1
- package/dist/components/hds/application-state/header.js.map +1 -1
- package/dist/components/hds/application-state/index.js.map +1 -1
- package/dist/components/hds/application-state/media.js.map +1 -1
- package/dist/components/hds/badge/index.js.map +1 -1
- package/dist/components/hds/badge-count/index.js.map +1 -1
- package/dist/components/hds/breadcrumb/index.js.map +1 -1
- package/dist/components/hds/breadcrumb/item.js +1 -1
- package/dist/components/hds/breadcrumb/item.js.map +1 -1
- package/dist/components/hds/breadcrumb/truncation.js.map +1 -1
- package/dist/components/hds/button/index.js.map +1 -1
- package/dist/components/hds/button-set/index.js.map +1 -1
- package/dist/components/hds/card/container.js.map +1 -1
- package/dist/components/hds/code-block/copy-button.js +9 -5
- package/dist/components/hds/code-block/copy-button.js.map +1 -1
- package/dist/components/hds/code-block/description.js.map +1 -1
- package/dist/components/hds/code-block/index.js +27 -21
- package/dist/components/hds/code-block/index.js.map +1 -1
- package/dist/components/hds/code-block/title.js.map +1 -1
- package/dist/components/hds/code-editor/description.js +6 -5
- package/dist/components/hds/code-editor/description.js.map +1 -1
- package/dist/components/hds/code-editor/full-screen-button.js.map +1 -1
- package/dist/components/hds/code-editor/generic.js.map +1 -1
- package/dist/components/hds/code-editor/index.js +67 -52
- package/dist/components/hds/code-editor/index.js.map +1 -1
- package/dist/components/hds/code-editor/title.js +6 -5
- package/dist/components/hds/code-editor/title.js.map +1 -1
- package/dist/components/hds/copy/button/index.js +23 -20
- package/dist/components/hds/copy/button/index.js.map +1 -1
- package/dist/components/hds/copy/snippet/index.js +23 -20
- package/dist/components/hds/copy/snippet/index.js.map +1 -1
- package/dist/components/hds/dialog-primitive/body.js.map +1 -1
- package/dist/components/hds/dialog-primitive/description.js.map +1 -1
- package/dist/components/hds/dialog-primitive/footer.js.map +1 -1
- package/dist/components/hds/dialog-primitive/header.js.map +1 -1
- package/dist/components/hds/dialog-primitive/overlay.js.map +1 -1
- package/dist/components/hds/dialog-primitive/wrapper.js.map +1 -1
- package/dist/components/hds/disclosure-primitive/index.js +27 -21
- package/dist/components/hds/disclosure-primitive/index.js.map +1 -1
- package/dist/components/hds/dismiss-button/index.js.map +1 -1
- package/dist/components/hds/dropdown/footer.js.map +1 -1
- package/dist/components/hds/dropdown/header.js.map +1 -1
- package/dist/components/hds/dropdown/index.js +12 -5
- package/dist/components/hds/dropdown/index.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/checkbox.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/checkmark.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/copy-item.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/description.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/generic.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/interactive.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/radio.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/separator.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/title.js.map +1 -1
- package/dist/components/hds/dropdown/toggle/button.js +12 -10
- package/dist/components/hds/dropdown/toggle/button.js.map +1 -1
- package/dist/components/hds/dropdown/toggle/chevron.js.map +1 -1
- package/dist/components/hds/dropdown/toggle/icon.js +20 -12
- package/dist/components/hds/dropdown/toggle/icon.js.map +1 -1
- package/dist/components/hds/flyout/body.js +2 -1
- package/dist/components/hds/flyout/body.js.map +1 -1
- package/dist/components/hds/flyout/description.js +1 -0
- package/dist/components/hds/flyout/description.js.map +1 -1
- package/dist/components/hds/flyout/footer.js +2 -1
- package/dist/components/hds/flyout/footer.js.map +1 -1
- package/dist/components/hds/flyout/header.js +2 -1
- package/dist/components/hds/flyout/header.js.map +1 -1
- package/dist/components/hds/flyout/index.js +33 -18
- package/dist/components/hds/flyout/index.js.map +1 -1
- package/dist/components/hds/form/character-count/index.js.map +1 -1
- package/dist/components/hds/form/checkbox/base.js.map +1 -1
- package/dist/components/hds/form/checkbox/field.js.map +1 -1
- package/dist/components/hds/form/checkbox/group.js.map +1 -1
- package/dist/components/hds/form/error/index.js.map +1 -1
- package/dist/components/hds/form/error/message.js.map +1 -1
- package/dist/components/hds/form/field/index.js +15 -7
- package/dist/components/hds/form/field/index.js.map +1 -1
- package/dist/components/hds/form/fieldset/index.js +15 -7
- package/dist/components/hds/form/fieldset/index.js.map +1 -1
- package/dist/components/hds/form/file-input/base.js.map +1 -1
- package/dist/components/hds/form/file-input/field.js.map +1 -1
- package/dist/components/hds/form/helper-text/index.js.map +1 -1
- package/dist/components/hds/form/indicator/index.js.map +1 -1
- package/dist/components/hds/form/label/index.js.map +1 -1
- package/dist/components/hds/form/legend/index.js.map +1 -1
- package/dist/components/hds/form/masked-input/base.js +45 -15
- package/dist/components/hds/form/masked-input/base.js.map +1 -1
- package/dist/components/hds/form/masked-input/field.js.map +1 -1
- package/dist/components/hds/form/radio/base.js.map +1 -1
- package/dist/components/hds/form/radio/field.js.map +1 -1
- package/dist/components/hds/form/radio/group.js.map +1 -1
- package/dist/components/hds/form/radio-card/description.js.map +1 -1
- package/dist/components/hds/form/radio-card/group.js.map +1 -1
- package/dist/components/hds/form/radio-card/index.js.map +1 -1
- package/dist/components/hds/form/radio-card/label.js.map +1 -1
- package/dist/components/hds/form/select/base.js.map +1 -1
- package/dist/components/hds/form/select/field.js.map +1 -1
- package/dist/components/hds/form/super-select/after-options.js.map +1 -1
- package/dist/components/hds/form/super-select/multiple/base.js +38 -28
- package/dist/components/hds/form/super-select/multiple/base.js.map +1 -1
- package/dist/components/hds/form/super-select/multiple/field.js.map +1 -1
- package/dist/components/hds/form/super-select/option-group.js +11 -10
- package/dist/components/hds/form/super-select/option-group.js.map +1 -1
- package/dist/components/hds/form/super-select/placeholder.js.map +1 -1
- package/dist/components/hds/form/super-select/single/base.js +17 -12
- package/dist/components/hds/form/super-select/single/base.js.map +1 -1
- package/dist/components/hds/form/super-select/single/field.js.map +1 -1
- package/dist/components/hds/form/text-input/base.js.map +1 -1
- package/dist/components/hds/form/text-input/field.js +21 -18
- package/dist/components/hds/form/text-input/field.js.map +1 -1
- package/dist/components/hds/form/textarea/base.js.map +1 -1
- package/dist/components/hds/form/textarea/field.js.map +1 -1
- package/dist/components/hds/form/toggle/base.js.map +1 -1
- package/dist/components/hds/form/toggle/field.js.map +1 -1
- package/dist/components/hds/form/toggle/group.js.map +1 -1
- package/dist/components/hds/form/visibility-toggle/index.js.map +1 -1
- package/dist/components/hds/icon/index.js +7 -3
- package/dist/components/hds/icon/index.js.map +1 -1
- package/dist/components/hds/icon-tile/index.js.map +1 -1
- package/dist/components/hds/interactive/index.js +12 -5
- package/dist/components/hds/interactive/index.js.map +1 -1
- package/dist/components/hds/link/inline.js.map +1 -1
- package/dist/components/hds/link/standalone.js.map +1 -1
- package/dist/components/hds/menu-primitive/index.js +37 -24
- package/dist/components/hds/menu-primitive/index.js.map +1 -1
- package/dist/components/hds/modal/body.js +1 -0
- package/dist/components/hds/modal/body.js.map +1 -1
- package/dist/components/hds/modal/footer.js +2 -1
- package/dist/components/hds/modal/footer.js.map +1 -1
- package/dist/components/hds/modal/header.js +1 -0
- package/dist/components/hds/modal/header.js.map +1 -1
- package/dist/components/hds/modal/index.js +30 -16
- package/dist/components/hds/modal/index.js.map +1 -1
- package/dist/components/hds/page-header/actions.js.map +1 -1
- package/dist/components/hds/page-header/badges.js.map +1 -1
- package/dist/components/hds/page-header/description.js.map +1 -1
- package/dist/components/hds/page-header/index.js.map +1 -1
- package/dist/components/hds/page-header/subtitle.js.map +1 -1
- package/dist/components/hds/page-header/title.js.map +1 -1
- package/dist/components/hds/pagination/compact/index.js +31 -28
- package/dist/components/hds/pagination/compact/index.js.map +1 -1
- package/dist/components/hds/pagination/info/index.js.map +1 -1
- package/dist/components/hds/pagination/nav/arrow.js +10 -4
- package/dist/components/hds/pagination/nav/arrow.js.map +1 -1
- package/dist/components/hds/pagination/nav/ellipsis.js.map +1 -1
- package/dist/components/hds/pagination/nav/number.js +10 -4
- package/dist/components/hds/pagination/nav/number.js.map +1 -1
- package/dist/components/hds/pagination/numbered/index.js +44 -47
- package/dist/components/hds/pagination/numbered/index.js.map +1 -1
- package/dist/components/hds/pagination/size-selector/index.js +12 -8
- package/dist/components/hds/pagination/size-selector/index.js.map +1 -1
- package/dist/components/hds/popover-primitive/index.js +130 -103
- package/dist/components/hds/popover-primitive/index.js.map +1 -1
- package/dist/components/hds/reveal/index.js +26 -24
- package/dist/components/hds/reveal/index.js.map +1 -1
- package/dist/components/hds/reveal/toggle/button.js.map +1 -1
- package/dist/components/hds/rich-tooltip/bubble.js.map +1 -1
- package/dist/components/hds/rich-tooltip/index.js +8 -7
- package/dist/components/hds/rich-tooltip/index.js.map +1 -1
- package/dist/components/hds/rich-tooltip/toggle.js.map +1 -1
- package/dist/components/hds/segmented-group/index.js.map +1 -1
- package/dist/components/hds/separator/index.js.map +1 -1
- package/dist/components/hds/side-nav/base.js.map +1 -1
- package/dist/components/hds/side-nav/header/home-link.js.map +1 -1
- package/dist/components/hds/side-nav/header/icon-button.js +1 -0
- package/dist/components/hds/side-nav/header/icon-button.js.map +1 -1
- package/dist/components/hds/side-nav/header/index.js.map +1 -1
- package/dist/components/hds/side-nav/index.js +47 -34
- package/dist/components/hds/side-nav/index.js.map +1 -1
- package/dist/components/hds/side-nav/list/back-link.js.map +1 -1
- package/dist/components/hds/side-nav/list/index.js +15 -13
- package/dist/components/hds/side-nav/list/index.js.map +1 -1
- package/dist/components/hds/side-nav/list/item.js.map +1 -1
- package/dist/components/hds/side-nav/list/link.js.map +1 -1
- package/dist/components/hds/side-nav/list/title.js +13 -9
- package/dist/components/hds/side-nav/list/title.js.map +1 -1
- package/dist/components/hds/side-nav/portal/index.js.map +1 -1
- package/dist/components/hds/side-nav/portal/target.js +31 -28
- package/dist/components/hds/side-nav/portal/target.js.map +1 -1
- package/dist/components/hds/side-nav/toggle-button.js.map +1 -1
- package/dist/components/hds/stepper/step/indicator.js.map +1 -1
- package/dist/components/hds/stepper/task/indicator.js.map +1 -1
- package/dist/components/hds/table/index.js +54 -40
- package/dist/components/hds/table/index.js.map +1 -1
- package/dist/components/hds/table/td.js.map +1 -1
- package/dist/components/hds/table/th-button-sort.js +8 -7
- package/dist/components/hds/table/th-button-sort.js.map +1 -1
- package/dist/components/hds/table/th-button-tooltip.js +7 -6
- package/dist/components/hds/table/th-button-tooltip.js.map +1 -1
- package/dist/components/hds/table/th-selectable.js +24 -25
- package/dist/components/hds/table/th-selectable.js.map +1 -1
- package/dist/components/hds/table/th-sort.js +12 -10
- package/dist/components/hds/table/th-sort.js.map +1 -1
- package/dist/components/hds/table/th.js +12 -10
- package/dist/components/hds/table/th.js.map +1 -1
- package/dist/components/hds/table/tr.js.map +1 -1
- package/dist/components/hds/tabs/index.js +77 -54
- package/dist/components/hds/tabs/index.js.map +1 -1
- package/dist/components/hds/tabs/panel.js +21 -14
- package/dist/components/hds/tabs/panel.js.map +1 -1
- package/dist/components/hds/tabs/tab.js +29 -13
- package/dist/components/hds/tabs/tab.js.map +1 -1
- package/dist/components/hds/tag/index.js +43 -3
- package/dist/components/hds/tag/index.js.map +1 -1
- package/dist/components/hds/tag/types.js +16 -1
- package/dist/components/hds/tag/types.js.map +1 -1
- package/dist/components/hds/text/body.js.map +1 -1
- package/dist/components/hds/text/code.js.map +1 -1
- package/dist/components/hds/text/display.js.map +1 -1
- package/dist/components/hds/text/index.js.map +1 -1
- package/dist/components/hds/time/index.js +19 -14
- package/dist/components/hds/time/index.js.map +1 -1
- package/dist/components/hds/time/range.js +11 -12
- package/dist/components/hds/time/range.js.map +1 -1
- package/dist/components/hds/time/single.js.map +1 -1
- package/dist/components/hds/toast/index.js.map +1 -1
- package/dist/components/hds/tooltip-button/index.js.map +1 -1
- package/dist/components/hds/yield/index.js.map +1 -1
- package/dist/components.js +1 -1
- package/dist/helpers/hds-format-date.js.map +1 -1
- package/dist/helpers/hds-format-relative.js.map +1 -1
- package/dist/instance-initializers/load-sprite.js +3 -1
- package/dist/instance-initializers/load-sprite.js.map +1 -1
- package/dist/modifiers/hds-advanced-table-cell/dom-management.js +51 -0
- package/dist/modifiers/hds-advanced-table-cell/dom-management.js.map +1 -0
- package/dist/{components/hds/advanced-table/helpers.js → modifiers/hds-advanced-table-cell/keyboard-navigation.js} +5 -44
- package/dist/modifiers/hds-advanced-table-cell/keyboard-navigation.js.map +1 -0
- package/dist/modifiers/hds-advanced-table-cell.js +55 -0
- package/dist/modifiers/hds-advanced-table-cell.js.map +1 -0
- package/dist/modifiers/hds-clipboard.js +29 -35
- package/dist/modifiers/hds-clipboard.js.map +1 -1
- package/dist/modifiers/hds-code-editor/languages/rego.js +191 -0
- package/dist/modifiers/hds-code-editor/languages/rego.js.map +1 -0
- package/dist/modifiers/hds-code-editor/languages/sentinel.js +5 -0
- package/dist/modifiers/hds-code-editor/languages/sentinel.js.map +1 -1
- package/dist/modifiers/hds-code-editor/types.js +2 -0
- package/dist/modifiers/hds-code-editor/types.js.map +1 -1
- package/dist/modifiers/hds-code-editor.js +182 -155
- package/dist/modifiers/hds-code-editor.js.map +1 -1
- package/dist/modifiers/hds-tooltip.js +128 -108
- package/dist/modifiers/hds-tooltip.js.map +1 -1
- package/dist/services/hds-time.js +29 -23
- package/dist/services/hds-time.js.map +1 -1
- package/dist/styles/@hashicorp/design-system-components.css +94 -3
- package/dist/styles/components/advanced-table.scss +4 -0
- package/dist/styles/components/badge-count.scss +1 -1
- package/dist/styles/components/badge.scss +11 -1
- package/dist/styles/components/rich-tooltip.scss +3 -1
- package/dist/styles/components/tag.scss +28 -0
- package/dist/styles/components/time.scss +7 -0
- package/dist/styles/components/tooltip.scss +49 -0
- package/dist/utils/hds-aria-described-by.js +14 -17
- package/dist/utils/hds-aria-described-by.js.map +1 -1
- package/package.json +30 -31
- package/declarations/components/hds/advanced-table/helpers.d.ts.map +0 -1
- package/dist/_app_/components/hds/advanced-table/helpers.js +0 -1
- package/dist/_rollupPluginBabelHelpers-C_TsMG3M.js +0 -57
- package/dist/_rollupPluginBabelHelpers-C_TsMG3M.js.map +0 -1
- package/dist/components/hds/advanced-table/helpers.js.map +0 -1
|
@@ -1 +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 panelIds=this._panelIds\\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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"}
|
|
1
|
+
{"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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"}
|
|
@@ -1,24 +1,25 @@
|
|
|
1
|
-
import { _ as _applyDecoratedDescriptor, a as _defineProperty } from '../../../_rollupPluginBabelHelpers-C_TsMG3M.js';
|
|
2
1
|
import Component from '@glimmer/component';
|
|
3
2
|
import { guidFor } from '@ember/object/internals';
|
|
4
3
|
import { action } from '@ember/object';
|
|
5
4
|
import { precompileTemplate } from '@ember/template-compilation';
|
|
5
|
+
import { n } from 'decorator-transforms/runtime';
|
|
6
6
|
import { setComponentTemplate } from '@ember/component';
|
|
7
7
|
|
|
8
8
|
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>");
|
|
9
9
|
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
10
|
+
/**
|
|
11
|
+
* Copyright (c) HashiCorp, Inc.
|
|
12
|
+
* SPDX-License-Identifier: MPL-2.0
|
|
13
|
+
*/
|
|
14
|
+
|
|
15
|
+
class HdsTabsPanel extends Component {
|
|
16
|
+
/**
|
|
17
|
+
* Generate a unique ID for the Panel
|
|
18
|
+
* @return {string}
|
|
19
|
+
* @param _panelId
|
|
20
|
+
*/
|
|
21
|
+
_panelId = 'panel-' + guidFor(this);
|
|
22
|
+
_elementId;
|
|
22
23
|
get nodeIndex() {
|
|
23
24
|
return this.args.panelIds ? this.args.panelIds.indexOf(this._panelId) : undefined;
|
|
24
25
|
}
|
|
@@ -47,6 +48,9 @@ let HdsTabsPanel = (_class = class HdsTabsPanel extends Component {
|
|
|
47
48
|
didInsertNode(element, this._elementId);
|
|
48
49
|
}
|
|
49
50
|
}
|
|
51
|
+
static {
|
|
52
|
+
n(this.prototype, "didInsertNode", [action]);
|
|
53
|
+
}
|
|
50
54
|
willDestroyNode(element) {
|
|
51
55
|
const {
|
|
52
56
|
willDestroyNode
|
|
@@ -55,7 +59,10 @@ let HdsTabsPanel = (_class = class HdsTabsPanel extends Component {
|
|
|
55
59
|
willDestroyNode(element);
|
|
56
60
|
}
|
|
57
61
|
}
|
|
58
|
-
|
|
62
|
+
static {
|
|
63
|
+
n(this.prototype, "willDestroyNode", [action]);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
59
66
|
setComponentTemplate(TEMPLATE, HdsTabsPanel);
|
|
60
67
|
|
|
61
68
|
export { HdsTabsPanel as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"panel.js","sources":["../../../../src/components/hds/tabs/panel.
|
|
1
|
+
{"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;;;;"}
|
|
@@ -1,23 +1,24 @@
|
|
|
1
|
-
import { _ as _applyDecoratedDescriptor, a as _defineProperty } from '../../../_rollupPluginBabelHelpers-C_TsMG3M.js';
|
|
2
1
|
import Component from '@glimmer/component';
|
|
3
2
|
import { guidFor } from '@ember/object/internals';
|
|
4
3
|
import { action } from '@ember/object';
|
|
5
4
|
import { precompileTemplate } from '@ember/template-compilation';
|
|
5
|
+
import { n } from 'decorator-transforms/runtime';
|
|
6
6
|
import { setComponentTemplate } from '@ember/component';
|
|
7
7
|
|
|
8
8
|
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 }}");
|
|
9
9
|
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
10
|
+
/**
|
|
11
|
+
* Copyright (c) HashiCorp, Inc.
|
|
12
|
+
* SPDX-License-Identifier: MPL-2.0
|
|
13
|
+
*/
|
|
14
|
+
|
|
15
|
+
class HdsTabsTab extends Component {
|
|
16
|
+
/**
|
|
17
|
+
* Generate a unique ID for the Tab
|
|
18
|
+
* @return {string}
|
|
19
|
+
* @param _tabId
|
|
20
|
+
*/
|
|
21
|
+
_tabId = 'tab-' + guidFor(this);
|
|
21
22
|
get nodeIndex() {
|
|
22
23
|
return this.args.tabIds?.indexOf(this._tabId);
|
|
23
24
|
}
|
|
@@ -47,6 +48,9 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
|
|
|
47
48
|
didInsertNode(element, isSelected);
|
|
48
49
|
}
|
|
49
50
|
}
|
|
51
|
+
static {
|
|
52
|
+
n(this.prototype, "didInsertNode", [action]);
|
|
53
|
+
}
|
|
50
54
|
didUpdateNode() {
|
|
51
55
|
const {
|
|
52
56
|
didUpdateNode
|
|
@@ -55,6 +59,9 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
|
|
|
55
59
|
didUpdateNode(this.nodeIndex, this.args.isSelected);
|
|
56
60
|
}
|
|
57
61
|
}
|
|
62
|
+
static {
|
|
63
|
+
n(this.prototype, "didUpdateNode", [action]);
|
|
64
|
+
}
|
|
58
65
|
willDestroyNode(element) {
|
|
59
66
|
const {
|
|
60
67
|
willDestroyNode
|
|
@@ -63,6 +70,9 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
|
|
|
63
70
|
willDestroyNode(element);
|
|
64
71
|
}
|
|
65
72
|
}
|
|
73
|
+
static {
|
|
74
|
+
n(this.prototype, "willDestroyNode", [action]);
|
|
75
|
+
}
|
|
66
76
|
onClick(event) {
|
|
67
77
|
const {
|
|
68
78
|
onClick
|
|
@@ -73,6 +83,9 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
|
|
|
73
83
|
return false;
|
|
74
84
|
}
|
|
75
85
|
}
|
|
86
|
+
static {
|
|
87
|
+
n(this.prototype, "onClick", [action]);
|
|
88
|
+
}
|
|
76
89
|
onKeyUp(event) {
|
|
77
90
|
const {
|
|
78
91
|
onKeyUp
|
|
@@ -87,6 +100,9 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
|
|
|
87
100
|
* @method classNames
|
|
88
101
|
* @return {string} The "class" attribute to apply to the component.
|
|
89
102
|
*/
|
|
103
|
+
static {
|
|
104
|
+
n(this.prototype, "onKeyUp", [action]);
|
|
105
|
+
}
|
|
90
106
|
get classNames() {
|
|
91
107
|
const classes = ['hds-tabs__tab'];
|
|
92
108
|
if (this.isSelected) {
|
|
@@ -94,7 +110,7 @@ let HdsTabsTab = (_class = class HdsTabsTab extends Component {
|
|
|
94
110
|
}
|
|
95
111
|
return classes.join(' ');
|
|
96
112
|
}
|
|
97
|
-
}
|
|
113
|
+
}
|
|
98
114
|
setComponentTemplate(TEMPLATE, HdsTabsTab);
|
|
99
115
|
|
|
100
116
|
export { HdsTabsTab as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tab.js","sources":["../../../../src/components/hds/tabs/tab.
|
|
1
|
+
{"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":"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"}
|
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
import Component from '@glimmer/component';
|
|
2
|
+
import { tracked } from '@glimmer/tracking';
|
|
2
3
|
import { assert } from '@ember/debug';
|
|
3
|
-
import {
|
|
4
|
+
import { modifier } from 'ember-modifier';
|
|
5
|
+
import { HdsTagColorValues, HdsTagTooltipPlacementValues } from './types.js';
|
|
4
6
|
import { precompileTemplate } from '@ember/template-compilation';
|
|
7
|
+
import { g, i } from 'decorator-transforms/runtime';
|
|
5
8
|
import { setComponentTemplate } from '@ember/component';
|
|
6
9
|
|
|
7
|
-
var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n<Hds::Text::Body
|
|
10
|
+
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>");
|
|
8
11
|
|
|
9
12
|
/**
|
|
10
13
|
* Copyright (c) HashiCorp, Inc.
|
|
@@ -13,7 +16,41 @@ var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-
|
|
|
13
16
|
|
|
14
17
|
const COLORS = Object.values(HdsTagColorValues);
|
|
15
18
|
const DEFAULT_COLOR = HdsTagColorValues.Primary;
|
|
19
|
+
const TOOLTIP_PLACEMENTS = Object.values(HdsTagTooltipPlacementValues);
|
|
20
|
+
const DEFAULT_TOOLTIP_PLACEMENT = HdsTagTooltipPlacementValues.Top;
|
|
16
21
|
class HdsTag extends Component {
|
|
22
|
+
static {
|
|
23
|
+
g(this.prototype, "_isTextOverflow", [tracked]);
|
|
24
|
+
}
|
|
25
|
+
#_isTextOverflow = (i(this, "_isTextOverflow"), undefined);
|
|
26
|
+
_observer;
|
|
27
|
+
_setUpObserver = modifier(element => {
|
|
28
|
+
// Used to detect when text is clipped to one line, and tooltip should be added
|
|
29
|
+
this._observer = new ResizeObserver(entries => {
|
|
30
|
+
entries.forEach(entry => {
|
|
31
|
+
this._isTextOverflow = this._isOverflow(entry.target.querySelector('.hds-tag__text-container'));
|
|
32
|
+
});
|
|
33
|
+
});
|
|
34
|
+
this._observer.observe(element);
|
|
35
|
+
return () => {
|
|
36
|
+
this._observer.disconnect();
|
|
37
|
+
};
|
|
38
|
+
});
|
|
39
|
+
|
|
40
|
+
/**
|
|
41
|
+
* @param tooltioPlacement
|
|
42
|
+
* @type {string}
|
|
43
|
+
* @default top
|
|
44
|
+
* @description The placement property of the tooltip attached to the tag text.
|
|
45
|
+
*/
|
|
46
|
+
get tooltipPlacement() {
|
|
47
|
+
const {
|
|
48
|
+
tooltipPlacement = DEFAULT_TOOLTIP_PLACEMENT
|
|
49
|
+
} = this.args;
|
|
50
|
+
assert('@tooltipPlacement for "Hds::Tag" must have a valid value', tooltipPlacement == undefined || TOOLTIP_PLACEMENTS.includes(tooltipPlacement));
|
|
51
|
+
return tooltipPlacement;
|
|
52
|
+
}
|
|
53
|
+
|
|
17
54
|
/**
|
|
18
55
|
* @param onDismiss
|
|
19
56
|
* @type {function}
|
|
@@ -87,8 +124,11 @@ class HdsTag extends Component {
|
|
|
87
124
|
}
|
|
88
125
|
return classes.join(' ');
|
|
89
126
|
}
|
|
127
|
+
_isOverflow(el) {
|
|
128
|
+
return el.scrollHeight > el.clientHeight;
|
|
129
|
+
}
|
|
90
130
|
}
|
|
91
131
|
setComponentTemplate(TEMPLATE, HdsTag);
|
|
92
132
|
|
|
93
|
-
export { COLORS, DEFAULT_COLOR, HdsTag as default };
|
|
133
|
+
export { COLORS, DEFAULT_COLOR, DEFAULT_TOOLTIP_PLACEMENT, TOOLTIP_PLACEMENTS, HdsTag as default };
|
|
94
134
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/hds/tag/index.
|
|
1
|
+
{"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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"}
|
|
@@ -8,6 +8,21 @@ let HdsTagColorValues = /*#__PURE__*/function (HdsTagColorValues) {
|
|
|
8
8
|
HdsTagColorValues["Secondary"] = "secondary";
|
|
9
9
|
return HdsTagColorValues;
|
|
10
10
|
}({});
|
|
11
|
+
let HdsTagTooltipPlacementValues = /*#__PURE__*/function (HdsTagTooltipPlacementValues) {
|
|
12
|
+
HdsTagTooltipPlacementValues["Top"] = "top";
|
|
13
|
+
HdsTagTooltipPlacementValues["TopStart"] = "top-start";
|
|
14
|
+
HdsTagTooltipPlacementValues["TopEnd"] = "top-end";
|
|
15
|
+
HdsTagTooltipPlacementValues["Right"] = "right";
|
|
16
|
+
HdsTagTooltipPlacementValues["RightStart"] = "right-start";
|
|
17
|
+
HdsTagTooltipPlacementValues["RightEnd"] = "right-end";
|
|
18
|
+
HdsTagTooltipPlacementValues["Bottom"] = "bottom";
|
|
19
|
+
HdsTagTooltipPlacementValues["BottomStart"] = "bottom-start";
|
|
20
|
+
HdsTagTooltipPlacementValues["BottomEnd"] = "bottom-end";
|
|
21
|
+
HdsTagTooltipPlacementValues["Left"] = "left";
|
|
22
|
+
HdsTagTooltipPlacementValues["LeftStart"] = "left-start";
|
|
23
|
+
HdsTagTooltipPlacementValues["LeftEnd"] = "left-end";
|
|
24
|
+
return HdsTagTooltipPlacementValues;
|
|
25
|
+
}({});
|
|
11
26
|
|
|
12
|
-
export { HdsTagColorValues };
|
|
27
|
+
export { HdsTagColorValues, HdsTagTooltipPlacementValues };
|
|
13
28
|
//# sourceMappingURL=types.js.map
|
|
@@ -1 +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;;;;"}
|
|
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\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;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"body.js","sources":["../../../../src/components/hds/text/body.
|
|
1
|
+
{"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;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"code.js","sources":["../../../../src/components/hds/text/code.
|
|
1
|
+
{"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;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"display.js","sources":["../../../../src/components/hds/text/display.
|
|
1
|
+
{"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;;;;"}
|