@hashicorp/design-system-components 4.2.0 → 4.3.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/dist/_app_/components/hds/form/super-select/after-options.js +1 -0
- package/dist/_app_/components/hds/form/super-select/multiple/base.js +1 -0
- package/dist/_app_/components/hds/form/super-select/multiple/field.js +1 -0
- package/dist/_app_/components/hds/form/super-select/option-group.js +1 -0
- package/dist/_app_/components/hds/form/super-select/placeholder.js +1 -0
- package/dist/_app_/components/hds/form/super-select/single/base.js +1 -0
- package/dist/_app_/components/hds/form/super-select/single/field.js +1 -0
- package/dist/_app_/components/hds/{link/types.js → popover-primitive/index.js} +1 -1
- package/dist/_app_/components/hds/{card/types.js → rich-tooltip/bubble.js} +1 -1
- package/dist/_app_/components/hds/{alert/types.js → rich-tooltip/index.js} +1 -1
- package/dist/_app_/components/hds/{interactive/types.js → rich-tooltip/toggle.js} +1 -1
- package/dist/_app_/modifiers/hds-anchored-position.js +1 -0
- package/dist/_app_/modifiers/hds-register-event.js +1 -0
- package/dist/{_rollupPluginBabelHelpers-lqPQKyNs.js → _rollupPluginBabelHelpers-NoJJJNhk.js} +7 -9
- package/dist/{_rollupPluginBabelHelpers-lqPQKyNs.js.map → _rollupPluginBabelHelpers-NoJJJNhk.js.map} +1 -1
- package/dist/components/hds/accordion/index.js +8 -2
- package/dist/components/hds/accordion/index.js.map +1 -1
- package/dist/components/hds/accordion/item/button.js +12 -8
- package/dist/components/hds/accordion/item/button.js.map +1 -1
- package/dist/components/hds/accordion/item/index.js +6 -6
- package/dist/components/hds/accordion/item/index.js.map +1 -1
- package/dist/components/hds/alert/description.js +9 -4
- package/dist/components/hds/alert/description.js.map +1 -1
- package/dist/components/hds/alert/index.js +4 -6
- package/dist/components/hds/alert/index.js.map +1 -1
- package/dist/components/hds/alert/title.js +9 -4
- package/dist/components/hds/alert/title.js.map +1 -1
- package/dist/components/hds/alert/types.js +5 -0
- package/dist/components/hds/alert/types.js.map +1 -1
- package/dist/components/hds/app-footer/copyright.js +1 -1
- package/dist/components/hds/app-footer/copyright.js.map +1 -1
- package/dist/components/hds/app-footer/index.js +6 -6
- package/dist/components/hds/app-footer/index.js.map +1 -1
- package/dist/components/hds/app-footer/item.js +10 -4
- package/dist/components/hds/app-footer/item.js.map +1 -1
- package/dist/components/hds/app-footer/legal-links.js +1 -1
- package/dist/components/hds/app-footer/legal-links.js.map +1 -1
- package/dist/components/hds/app-footer/link.js +10 -4
- package/dist/components/hds/app-footer/link.js.map +1 -1
- package/dist/components/hds/app-footer/status-link.js +12 -27
- package/dist/components/hds/app-footer/status-link.js.map +1 -1
- package/dist/components/hds/app-footer/types.js +38 -0
- package/dist/components/hds/app-footer/types.js.map +1 -0
- package/dist/components/hds/app-frame/index.js +4 -4
- package/dist/components/hds/app-frame/index.js.map +1 -1
- package/dist/components/hds/app-frame/parts/footer.js +10 -4
- package/dist/components/hds/app-frame/parts/footer.js.map +1 -1
- package/dist/components/hds/app-frame/parts/header.js +10 -4
- package/dist/components/hds/app-frame/parts/header.js.map +1 -1
- package/dist/components/hds/app-frame/parts/main.js +10 -4
- package/dist/components/hds/app-frame/parts/main.js.map +1 -1
- package/dist/components/hds/app-frame/parts/modals.js +10 -4
- package/dist/components/hds/app-frame/parts/modals.js.map +1 -1
- package/dist/components/hds/app-frame/parts/sidebar.js +10 -4
- package/dist/components/hds/app-frame/parts/sidebar.js.map +1 -1
- package/dist/components/hds/badge/index.js +19 -18
- package/dist/components/hds/badge/index.js.map +1 -1
- package/dist/components/hds/badge/types.js +29 -0
- package/dist/components/hds/badge/types.js.map +1 -0
- package/dist/components/hds/badge-count/index.js +15 -14
- package/dist/components/hds/badge-count/index.js.map +1 -1
- package/dist/components/hds/badge-count/types.js +25 -0
- package/dist/components/hds/badge-count/types.js.map +1 -0
- package/dist/components/hds/button/index.js +3 -3
- package/dist/components/hds/button/index.js.map +1 -1
- package/dist/components/hds/button-set/index.js +8 -2
- 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/card/types.js +5 -0
- package/dist/components/hds/card/types.js.map +1 -1
- package/dist/components/hds/code-block/index.js +1 -1
- package/dist/components/hds/code-block/index.js.map +1 -1
- package/dist/components/hds/copy/button/index.js +1 -1
- package/dist/components/hds/copy/button/index.js.map +1 -1
- package/dist/components/hds/copy/snippet/index.js +1 -1
- package/dist/components/hds/copy/snippet/index.js.map +1 -1
- package/dist/components/hds/disclosure-primitive/index.js +2 -2
- package/dist/components/hds/disclosure-primitive/index.js.map +1 -1
- package/dist/components/hds/dismiss-button/index.js +3 -3
- package/dist/components/hds/dismiss-button/index.js.map +1 -1
- package/dist/components/hds/dropdown/index.js +1 -1
- package/dist/components/hds/dropdown/index.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/checkmark.js +1 -1
- package/dist/components/hds/dropdown/list-item/checkmark.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/interactive.js +1 -1
- package/dist/components/hds/dropdown/list-item/interactive.js.map +1 -1
- package/dist/components/hds/dropdown/toggle/button.js +1 -1
- package/dist/components/hds/dropdown/toggle/icon.js +1 -1
- package/dist/components/hds/dropdown/toggle/icon.js.map +1 -1
- package/dist/components/hds/flyout/index.js +1 -1
- package/dist/components/hds/flyout/index.js.map +1 -1
- package/dist/components/hds/form/field/index.js +1 -1
- package/dist/components/hds/form/field/index.js.map +1 -1
- package/dist/components/hds/form/fieldset/index.js +1 -1
- package/dist/components/hds/form/fieldset/index.js.map +1 -1
- package/dist/components/hds/form/label/index.js +18 -2
- package/dist/components/hds/form/label/index.js.map +1 -1
- package/dist/components/hds/form/masked-input/base.js +1 -1
- package/dist/components/hds/form/masked-input/base.js.map +1 -1
- package/dist/components/hds/form/radio-card/index.js +1 -1
- package/dist/components/hds/form/radio-card/index.js.map +1 -1
- package/dist/components/hds/form/super-select/after-options.js +10 -0
- package/dist/components/hds/form/super-select/after-options.js.map +1 -0
- package/dist/components/hds/form/super-select/multiple/base.js +159 -0
- package/dist/components/hds/form/super-select/multiple/base.js.map +1 -0
- package/dist/components/hds/form/super-select/multiple/field.js +21 -0
- package/dist/components/hds/form/super-select/multiple/field.js.map +1 -0
- package/dist/components/hds/form/super-select/option-group.js +22 -0
- package/dist/components/hds/form/super-select/option-group.js.map +1 -0
- package/dist/components/hds/form/super-select/placeholder.js +10 -0
- package/dist/components/hds/form/super-select/placeholder.js.map +1 -0
- package/dist/components/hds/form/super-select/single/base.js +86 -0
- package/dist/components/hds/form/super-select/single/base.js.map +1 -0
- package/dist/components/hds/form/super-select/single/field.js +21 -0
- package/dist/components/hds/form/super-select/single/field.js.map +1 -0
- package/dist/components/hds/form/text-input/field.js +1 -1
- package/dist/components/hds/form/text-input/field.js.map +1 -1
- package/dist/components/hds/icon-tile/index.js +15 -11
- package/dist/components/hds/icon-tile/index.js.map +1 -1
- package/dist/components/hds/icon-tile/types.js +32 -0
- package/dist/components/hds/icon-tile/types.js.map +1 -0
- package/dist/components/hds/interactive/index.js +4 -4
- 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/link/types.js +5 -0
- package/dist/components/hds/link/types.js.map +1 -1
- package/dist/components/hds/menu-primitive/index.js +1 -1
- package/dist/components/hds/menu-primitive/index.js.map +1 -1
- package/dist/components/hds/modal/index.js +1 -1
- package/dist/components/hds/modal/index.js.map +1 -1
- package/dist/components/hds/pagination/compact/index.js +1 -1
- package/dist/components/hds/pagination/compact/index.js.map +1 -1
- package/dist/components/hds/pagination/nav/arrow.js +1 -1
- package/dist/components/hds/pagination/nav/arrow.js.map +1 -1
- package/dist/components/hds/pagination/nav/number.js +1 -1
- package/dist/components/hds/pagination/nav/number.js.map +1 -1
- package/dist/components/hds/pagination/numbered/index.js +1 -1
- package/dist/components/hds/pagination/numbered/index.js.map +1 -1
- package/dist/components/hds/pagination/size-selector/index.js +1 -1
- package/dist/components/hds/pagination/size-selector/index.js.map +1 -1
- package/dist/components/hds/popover-primitive/index.js +238 -0
- package/dist/components/hds/popover-primitive/index.js.map +1 -0
- package/dist/components/hds/reveal/index.js +21 -17
- package/dist/components/hds/reveal/index.js.map +1 -1
- package/dist/components/hds/reveal/toggle/button.js +5 -5
- package/dist/components/hds/reveal/toggle/button.js.map +1 -1
- package/dist/components/hds/rich-tooltip/bubble.js +60 -0
- package/dist/components/hds/rich-tooltip/bubble.js.map +1 -0
- package/dist/components/hds/rich-tooltip/index.js +26 -0
- package/dist/components/hds/rich-tooltip/index.js.map +1 -0
- package/dist/components/hds/rich-tooltip/toggle.js +85 -0
- package/dist/components/hds/rich-tooltip/toggle.js.map +1 -0
- package/dist/components/hds/separator/index.js +9 -8
- package/dist/components/hds/separator/index.js.map +1 -1
- package/dist/components/hds/separator/types.js +13 -0
- package/dist/components/hds/separator/types.js.map +1 -0
- package/dist/components/hds/side-nav/index.js +1 -1
- package/dist/components/hds/side-nav/index.js.map +1 -1
- package/dist/components/hds/side-nav/portal/target.js +1 -1
- package/dist/components/hds/side-nav/portal/target.js.map +1 -1
- package/dist/components/hds/stepper/step/indicator.js +9 -8
- package/dist/components/hds/stepper/step/indicator.js.map +1 -1
- package/dist/components/hds/stepper/task/indicator.js +10 -14
- package/dist/components/hds/stepper/task/indicator.js.map +1 -1
- package/dist/components/hds/stepper/types.js +21 -0
- package/dist/components/hds/stepper/types.js.map +1 -0
- package/dist/components/hds/table/index.js +1 -1
- package/dist/components/hds/table/index.js.map +1 -1
- package/dist/components/hds/table/th-button-sort.js +1 -1
- package/dist/components/hds/table/th-button-tooltip.js +1 -1
- package/dist/components/hds/table/th-selectable.js +1 -1
- package/dist/components/hds/table/th-selectable.js.map +1 -1
- package/dist/components/hds/table/th-sort.js +1 -1
- package/dist/components/hds/table/th.js +1 -1
- package/dist/components/hds/tabs/index.js +1 -1
- package/dist/components/hds/tabs/index.js.map +1 -1
- package/dist/components/hds/tabs/panel.js +1 -1
- package/dist/components/hds/tabs/panel.js.map +1 -1
- package/dist/components/hds/tabs/tab.js +1 -1
- package/dist/components/hds/tabs/tab.js.map +1 -1
- package/dist/components/hds/tag/index.js +11 -10
- package/dist/components/hds/tag/index.js.map +1 -1
- package/dist/components/hds/tag/types.js +13 -0
- package/dist/components/hds/tag/types.js.map +1 -0
- 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 +3 -3
- package/dist/components/hds/text/index.js.map +1 -1
- package/dist/components/hds/toast/index.js +8 -2
- package/dist/components/hds/toast/index.js.map +1 -1
- package/dist/components/hds/yield/index.js +4 -4
- package/dist/components/hds/yield/index.js.map +1 -1
- package/dist/modifiers/hds-anchored-position.js +175 -0
- package/dist/modifiers/hds-anchored-position.js.map +1 -0
- package/dist/modifiers/hds-register-event.js +40 -0
- package/dist/modifiers/hds-register-event.js.map +1 -0
- package/dist/modifiers/hds-tooltip.js +10 -14
- package/dist/modifiers/hds-tooltip.js.map +1 -1
- package/dist/styles/@hashicorp/design-system-components.css +565 -3
- package/dist/styles/@hashicorp/design-system-components.scss +1 -0
- package/dist/styles/@hashicorp/design-system-power-select-overrides.scss +0 -1
- package/dist/styles/components/code-block/theme.scss +1 -1
- package/dist/styles/components/dropdown.scss +7 -0
- package/dist/styles/components/form/index.scss +1 -0
- package/dist/styles/components/form/select.scss +0 -1
- package/dist/styles/components/form/super-select.scss +515 -0
- package/dist/styles/components/form/text-input.scss +0 -1
- package/dist/styles/components/form/textarea.scss +0 -1
- package/dist/styles/components/page-header.scss +1 -0
- package/dist/styles/components/rich-tooltip.scss +247 -0
- package/dist/styles/components/tabs.scss +2 -1
- package/dist/styles/components/tooltip.scss +1 -1
- package/package.json +54 -28
- package/dist/_app_/components/hds/text/types.js +0 -1
- package/dist/_app_/components/hds/yield/types.js +0 -1
- package/dist/components/hds/interactive/types.js +0 -2
- package/dist/components/hds/interactive/types.js.map +0 -1
- package/dist/components/hds/yield/types.js +0 -2
- package/dist/components/hds/yield/types.js.map +0 -1
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
import { _ as _applyDecoratedDescriptor, b as _initializerDefineProperty } from '../../../../../_rollupPluginBabelHelpers-NoJJJNhk.js';
|
|
2
|
+
import PowerSelectComponent from 'ember-power-select/components/power-select';
|
|
3
|
+
import anchoredPositionModifier from '../../../../../modifiers/hds-anchored-position.js';
|
|
4
|
+
import { action } from '@ember/object';
|
|
5
|
+
import { tracked } from '@glimmer/tracking';
|
|
6
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
7
|
+
import { setComponentTemplate } from '@ember/component';
|
|
8
|
+
|
|
9
|
+
var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n{{! Important: if an argument is added in base.hbs, it must also be added/processed in the Base component used in field.hbs }}\n<div class={{this.classNames}} {{style this.dropdownMaxWidthStyle}}>\n <PowerSelectMultiple\n @afterOptionsComponent={{if\n this.showAfterOptions\n (or\n @afterOptionsComponent\n (component\n \"hds/form/super-select/after-options\"\n content=@afterOptionsContent\n resultCountMessage=this.resultCountMessage\n showNoSelectedMessage=this.showNoSelectedMessage\n showOnlySelected=this.showOnlySelected\n showSelected=this.showSelected\n showAll=this.showAll\n clearSelected=this.clearSelected\n selectedCount=this.selectedCount\n )\n )\n }}\n @ariaDescribedBy={{@ariaDescribedBy}}\n @ariaInvalid={{@ariaInvalid}}\n @ariaLabel={{@ariaLabel}}\n @ariaLabelledBy={{@ariaLabelledBy}}\n @beforeOptionsComponent={{@beforeOptionsComponent}}\n @calculatePosition={{if @verticalPosition undefined this.calculatePosition}}\n @closeOnSelect={{false}}\n @disabled={{@disabled}}\n @dropdownClass={{@dropdownClass}}\n @extra={{@extra}}\n @groupComponent={{component \"hds/form/super-select/option-group\"}}\n @horizontalPosition={{@horizontalPosition}}\n @initiallyOpened={{@initiallyOpened}}\n @labelText={{@labelText}}\n @loadingMessage={{@loadingMessage}}\n @matcher={{@matcher}}\n @matchTriggerWidth={{if @dropdownMaxWidth false @matchTriggerWidth}}\n @noMatchesMessage={{@noMatchesMessage}}\n @onBlur={{@onBlur}}\n @onChange={{@onChange}}\n @onClose={{@onClose}}\n @onFocus={{@onFocus}}\n @onInput={{@onInput}}\n @onKeydown={{@onKeydown}}\n @onOpen={{@onOpen}}\n @options={{@options}}\n @optionsComponent={{@optionsComponent}}\n @placeholder={{@placeholder}}\n @placeholderComponent={{@placeholderComponent}}\n @preventScroll={{@preventScroll}}\n @registerAPI={{this.setPowerSelectAPI}}\n @renderInPlace={{true}}\n @resultCountMessage={{@resultCountMessage}}\n @scrollTo={{@scrollTo}}\n @search={{@search}}\n @searchEnabled={{@searchEnabled}}\n @searchField={{@searchField}}\n @searchMessage={{@searchMessage}}\n @searchPlaceholder={{this.searchPlaceholder}}\n @selected={{@selected}}\n @selectedItemComponent={{@selectedItemComponent}}\n @tabindex={{@tabindex}}\n @triggerClass={{@triggerClass}}\n @triggerComponent={{@triggerComponent}}\n @triggerId={{@triggerId}}\n @triggerRole={{@triggerRole}}\n @typeAheadMatcher={{@typeAheadMatcher}}\n @verticalPosition={{@verticalPosition}}\n ...attributes\n as |option select|\n >\n {{! even if technically what is yielded here are _a list_ of options, we\'ve decided to keep the `option` name for consistency with the existing `PowerSelect` API }}\n {{yield option select}}\n </PowerSelectMultiple>\n</div>");
|
|
10
|
+
|
|
11
|
+
var _class, _descriptor, _descriptor2, _descriptor3;
|
|
12
|
+
const DEFAULT_HORIZONTAL_POSITION = 'bottom-start';
|
|
13
|
+
const HORIZONTAL_POSITION_MAPPING = {
|
|
14
|
+
left: 'bottom-start',
|
|
15
|
+
center: 'bottom',
|
|
16
|
+
right: 'bottom-end'
|
|
17
|
+
};
|
|
18
|
+
let HdsSuperSelectMultipleBaseComponent = (_class = class HdsSuperSelectMultipleBaseComponent extends PowerSelectComponent {
|
|
19
|
+
constructor(...args) {
|
|
20
|
+
super(...args);
|
|
21
|
+
_initializerDefineProperty(this, "powerSelectAPI", _descriptor, this);
|
|
22
|
+
_initializerDefineProperty(this, "showOnlySelected", _descriptor2, this);
|
|
23
|
+
_initializerDefineProperty(this, "showNoSelectedMessage", _descriptor3, this);
|
|
24
|
+
}
|
|
25
|
+
get selectedCount() {
|
|
26
|
+
return this.selected?.length || '0';
|
|
27
|
+
}
|
|
28
|
+
get optionsCount() {
|
|
29
|
+
return this.options?.length || '0';
|
|
30
|
+
}
|
|
31
|
+
get resultCountMessage() {
|
|
32
|
+
return `${this.selectedCount} selected of ${this.optionsCount} total`;
|
|
33
|
+
}
|
|
34
|
+
calculatePosition(trigger, content) {
|
|
35
|
+
// use `hds-anchored-position` to calculate and set position
|
|
36
|
+
anchoredPositionModifier(content, [trigger], {
|
|
37
|
+
placement: this.args.horizontalPosition ? HORIZONTAL_POSITION_MAPPING[this.args.horizontalPosition] : DEFAULT_HORIZONTAL_POSITION,
|
|
38
|
+
offsetOptions: 4,
|
|
39
|
+
enableCollisionDetection: true
|
|
40
|
+
});
|
|
41
|
+
// prevent PowerSelect from setting position
|
|
42
|
+
return {};
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
/**
|
|
46
|
+
* This action sets the powerSelectAPI property and optionally calls a registerAPI function.
|
|
47
|
+
*
|
|
48
|
+
* @param {Object} powerSelectAPI - The API object for the PowerSelect component.
|
|
49
|
+
*
|
|
50
|
+
* If a `registerAPI` function is passed in through the component's arguments,
|
|
51
|
+
* this function will be called with the `powerSelectAPI` as its argument.
|
|
52
|
+
* This allows parent components or controllers to have access to the PowerSelect API.
|
|
53
|
+
*
|
|
54
|
+
* The `powerSelectAPI` is also stored on the component instance and used in `clearSelected`
|
|
55
|
+
*/
|
|
56
|
+
setPowerSelectAPI(powerSelectAPI) {
|
|
57
|
+
if (typeof this.args.registerAPI === 'function') {
|
|
58
|
+
this.args.registerAPI(powerSelectAPI);
|
|
59
|
+
}
|
|
60
|
+
this.powerSelectAPI = powerSelectAPI;
|
|
61
|
+
}
|
|
62
|
+
showSelected() {
|
|
63
|
+
this.showNoSelectedMessage = this.selectedCount === '0';
|
|
64
|
+
this.showOnlySelected = true;
|
|
65
|
+
}
|
|
66
|
+
showAll() {
|
|
67
|
+
this.showNoSelectedMessage = false;
|
|
68
|
+
this.showOnlySelected = false;
|
|
69
|
+
}
|
|
70
|
+
clearSelected() {
|
|
71
|
+
this.powerSelectAPI.actions.select(null);
|
|
72
|
+
// show all options after clearing all selection
|
|
73
|
+
this.showNoSelectedMessage = false;
|
|
74
|
+
this.showOnlySelected = false;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
/**
|
|
78
|
+
* Determine if `@afterOptionsComponent` gets displayed
|
|
79
|
+
* @param showAfterOptions
|
|
80
|
+
* @type {boolean}
|
|
81
|
+
* @default true
|
|
82
|
+
*/
|
|
83
|
+
get showAfterOptions() {
|
|
84
|
+
return this.args.showAfterOptions ?? true;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
// NOTE: The searchPlaceholder doesn't currently work for the multiple select
|
|
88
|
+
/**
|
|
89
|
+
* Get the search placeholder text
|
|
90
|
+
* @param searchPlaceholder
|
|
91
|
+
* @type {string}
|
|
92
|
+
* @default 'Search'
|
|
93
|
+
*/
|
|
94
|
+
get searchPlaceholder() {
|
|
95
|
+
return this.args.searchPlaceholder ?? 'Search';
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
/**
|
|
99
|
+
* Get the maxWidth to apply to the dropdown
|
|
100
|
+
* @param dropdownMaxWidth
|
|
101
|
+
* @type {string}
|
|
102
|
+
* @default 'none'
|
|
103
|
+
*/
|
|
104
|
+
get dropdownMaxWidthStyle() {
|
|
105
|
+
const maxWidthStyle = {};
|
|
106
|
+
if (this.args.dropdownMaxWidth) {
|
|
107
|
+
maxWidthStyle['--hds-form-super-select-dropdown-max-width'] = this.args.dropdownMaxWidth;
|
|
108
|
+
}
|
|
109
|
+
return maxWidthStyle;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
/**
|
|
113
|
+
* Get the class names to apply to the component.
|
|
114
|
+
* @method classNames
|
|
115
|
+
* @return {string} The "class" attribute to apply to the component.
|
|
116
|
+
*/
|
|
117
|
+
get classNames() {
|
|
118
|
+
let classes = ['hds-form-super-select', 'hds-form-super-select-multiple'];
|
|
119
|
+
|
|
120
|
+
// add a class based on the @matchTriggerWidth argument or whether dropdownMaxWidth is set
|
|
121
|
+
if (this.args.matchTriggerWidth === false || this.args.dropdownMaxWidth) {
|
|
122
|
+
classes.push('hds-form-super-select--dropdown-content-auto-width');
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
// add a class based on the @isInvalid argument
|
|
126
|
+
if (this.args.isInvalid) {
|
|
127
|
+
classes.push(`hds-form-super-select--is-invalid`);
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
// add a class based on the showOnlySelected
|
|
131
|
+
if (this.showOnlySelected) {
|
|
132
|
+
classes.push(`hds-form-super-select--show-only-selected`);
|
|
133
|
+
}
|
|
134
|
+
return classes.join(' ');
|
|
135
|
+
}
|
|
136
|
+
}, (_descriptor = _applyDecoratedDescriptor(_class.prototype, "powerSelectAPI", [tracked], {
|
|
137
|
+
configurable: true,
|
|
138
|
+
enumerable: true,
|
|
139
|
+
writable: true,
|
|
140
|
+
initializer: null
|
|
141
|
+
}), _descriptor2 = _applyDecoratedDescriptor(_class.prototype, "showOnlySelected", [tracked], {
|
|
142
|
+
configurable: true,
|
|
143
|
+
enumerable: true,
|
|
144
|
+
writable: true,
|
|
145
|
+
initializer: function () {
|
|
146
|
+
return false;
|
|
147
|
+
}
|
|
148
|
+
}), _descriptor3 = _applyDecoratedDescriptor(_class.prototype, "showNoSelectedMessage", [tracked], {
|
|
149
|
+
configurable: true,
|
|
150
|
+
enumerable: true,
|
|
151
|
+
writable: true,
|
|
152
|
+
initializer: function () {
|
|
153
|
+
return false;
|
|
154
|
+
}
|
|
155
|
+
}), _applyDecoratedDescriptor(_class.prototype, "calculatePosition", [action], Object.getOwnPropertyDescriptor(_class.prototype, "calculatePosition"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "setPowerSelectAPI", [action], Object.getOwnPropertyDescriptor(_class.prototype, "setPowerSelectAPI"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "showSelected", [action], Object.getOwnPropertyDescriptor(_class.prototype, "showSelected"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "showAll", [action], Object.getOwnPropertyDescriptor(_class.prototype, "showAll"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "clearSelected", [action], Object.getOwnPropertyDescriptor(_class.prototype, "clearSelected"), _class.prototype)), _class);
|
|
156
|
+
setComponentTemplate(TEMPLATE, HdsSuperSelectMultipleBaseComponent);
|
|
157
|
+
|
|
158
|
+
export { HdsSuperSelectMultipleBaseComponent as default };
|
|
159
|
+
//# sourceMappingURL=base.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../../src/components/hds/form/super-select/multiple/base.hbs","../../../../../../src/components/hds/form/super-select/multiple/base.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n Copyright (c) HashiCorp, Inc.\\n SPDX-License-Identifier: MPL-2.0\\n}}\\n{{! Important: if an argument is added in base.hbs, it must also be added/processed in the Base component used in field.hbs }}\\n<div class={{this.classNames}} {{style this.dropdownMaxWidthStyle}}>\\n <PowerSelectMultiple\\n @afterOptionsComponent={{if\\n this.showAfterOptions\\n (or\\n @afterOptionsComponent\\n (component\\n \\\"hds/form/super-select/after-options\\\"\\n content=@afterOptionsContent\\n resultCountMessage=this.resultCountMessage\\n showNoSelectedMessage=this.showNoSelectedMessage\\n showOnlySelected=this.showOnlySelected\\n showSelected=this.showSelected\\n showAll=this.showAll\\n clearSelected=this.clearSelected\\n selectedCount=this.selectedCount\\n )\\n )\\n }}\\n @ariaDescribedBy={{@ariaDescribedBy}}\\n @ariaInvalid={{@ariaInvalid}}\\n @ariaLabel={{@ariaLabel}}\\n @ariaLabelledBy={{@ariaLabelledBy}}\\n @beforeOptionsComponent={{@beforeOptionsComponent}}\\n @calculatePosition={{if @verticalPosition undefined this.calculatePosition}}\\n @closeOnSelect={{false}}\\n @disabled={{@disabled}}\\n @dropdownClass={{@dropdownClass}}\\n @extra={{@extra}}\\n @groupComponent={{component \\\"hds/form/super-select/option-group\\\"}}\\n @horizontalPosition={{@horizontalPosition}}\\n @initiallyOpened={{@initiallyOpened}}\\n @labelText={{@labelText}}\\n @loadingMessage={{@loadingMessage}}\\n @matcher={{@matcher}}\\n @matchTriggerWidth={{if @dropdownMaxWidth false @matchTriggerWidth}}\\n @noMatchesMessage={{@noMatchesMessage}}\\n @onBlur={{@onBlur}}\\n @onChange={{@onChange}}\\n @onClose={{@onClose}}\\n @onFocus={{@onFocus}}\\n @onInput={{@onInput}}\\n @onKeydown={{@onKeydown}}\\n @onOpen={{@onOpen}}\\n @options={{@options}}\\n @optionsComponent={{@optionsComponent}}\\n @placeholder={{@placeholder}}\\n @placeholderComponent={{@placeholderComponent}}\\n @preventScroll={{@preventScroll}}\\n @registerAPI={{this.setPowerSelectAPI}}\\n @renderInPlace={{true}}\\n @resultCountMessage={{@resultCountMessage}}\\n @scrollTo={{@scrollTo}}\\n @search={{@search}}\\n @searchEnabled={{@searchEnabled}}\\n @searchField={{@searchField}}\\n @searchMessage={{@searchMessage}}\\n @searchPlaceholder={{this.searchPlaceholder}}\\n @selected={{@selected}}\\n @selectedItemComponent={{@selectedItemComponent}}\\n @tabindex={{@tabindex}}\\n @triggerClass={{@triggerClass}}\\n @triggerComponent={{@triggerComponent}}\\n @triggerId={{@triggerId}}\\n @triggerRole={{@triggerRole}}\\n @typeAheadMatcher={{@typeAheadMatcher}}\\n @verticalPosition={{@verticalPosition}}\\n ...attributes\\n as |option select|\\n >\\n {{! even if technically what is yielded here are _a list_ of options, we\\'ve decided to keep the `option` name for consistency with the existing `PowerSelect` API }}\\n {{yield option select}}\\n </PowerSelectMultiple>\\n</div>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport PowerSelectComponent from 'ember-power-select/components/power-select';\nimport anchoredPositionModifier from '../../../../../modifiers/hds-anchored-position';\nimport { action } from '@ember/object';\nimport { tracked } from '@glimmer/tracking';\n\nconst DEFAULT_HORIZONTAL_POSITION = 'bottom-start';\nconst HORIZONTAL_POSITION_MAPPING = {\n left: 'bottom-start',\n center: 'bottom',\n right: 'bottom-end',\n};\n\nexport default class HdsSuperSelectMultipleBaseComponent extends PowerSelectComponent {\n @tracked powerSelectAPI;\n @tracked showOnlySelected = false;\n @tracked showNoSelectedMessage = false;\n\n get selectedCount() {\n return this.selected?.length || '0';\n }\n\n get optionsCount() {\n return this.options?.length || '0';\n }\n\n get resultCountMessage() {\n return `${this.selectedCount} selected of ${this.optionsCount} total`;\n }\n\n @action calculatePosition(trigger, content) {\n // use `hds-anchored-position` to calculate and set position\n anchoredPositionModifier(content, [trigger], {\n placement: this.args.horizontalPosition\n ? HORIZONTAL_POSITION_MAPPING[this.args.horizontalPosition]\n : DEFAULT_HORIZONTAL_POSITION,\n offsetOptions: 4,\n enableCollisionDetection: true,\n });\n // prevent PowerSelect from setting position\n return {};\n }\n\n /**\n * This action sets the powerSelectAPI property and optionally calls a registerAPI function.\n *\n * @param {Object} powerSelectAPI - The API object for the PowerSelect component.\n *\n * If a `registerAPI` function is passed in through the component's arguments,\n * this function will be called with the `powerSelectAPI` as its argument.\n * This allows parent components or controllers to have access to the PowerSelect API.\n *\n * The `powerSelectAPI` is also stored on the component instance and used in `clearSelected`\n */\n @action\n setPowerSelectAPI(powerSelectAPI) {\n if (typeof this.args.registerAPI === 'function') {\n this.args.registerAPI(powerSelectAPI);\n }\n this.powerSelectAPI = powerSelectAPI;\n }\n\n @action showSelected() {\n this.showNoSelectedMessage = this.selectedCount === '0';\n this.showOnlySelected = true;\n }\n\n @action showAll() {\n this.showNoSelectedMessage = false;\n this.showOnlySelected = false;\n }\n\n @action clearSelected() {\n this.powerSelectAPI.actions.select(null);\n // show all options after clearing all selection\n this.showNoSelectedMessage = false;\n this.showOnlySelected = false;\n }\n\n /**\n * Determine if `@afterOptionsComponent` gets displayed\n * @param showAfterOptions\n * @type {boolean}\n * @default true\n */\n get showAfterOptions() {\n return this.args.showAfterOptions ?? true;\n }\n\n // NOTE: The searchPlaceholder doesn't currently work for the multiple select\n /**\n * Get the search placeholder text\n * @param searchPlaceholder\n * @type {string}\n * @default 'Search'\n */\n get searchPlaceholder() {\n return this.args.searchPlaceholder ?? 'Search';\n }\n\n /**\n * Get the maxWidth to apply to the dropdown\n * @param dropdownMaxWidth\n * @type {string}\n * @default 'none'\n */\n get dropdownMaxWidthStyle() {\n const maxWidthStyle = {};\n if (this.args.dropdownMaxWidth) {\n maxWidthStyle['--hds-form-super-select-dropdown-max-width'] =\n this.args.dropdownMaxWidth;\n }\n return maxWidthStyle;\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() {\n let classes = ['hds-form-super-select', 'hds-form-super-select-multiple'];\n\n // add a class based on the @matchTriggerWidth argument or whether dropdownMaxWidth is set\n if (this.args.matchTriggerWidth === false || this.args.dropdownMaxWidth) {\n classes.push('hds-form-super-select--dropdown-content-auto-width');\n }\n\n // add a class based on the @isInvalid argument\n if (this.args.isInvalid) {\n classes.push(`hds-form-super-select--is-invalid`);\n }\n\n // add a class based on the showOnlySelected\n if (this.showOnlySelected) {\n classes.push(`hds-form-super-select--show-only-selected`);\n }\n\n return classes.join(' ');\n }\n}\n"],"names":["DEFAULT_HORIZONTAL_POSITION","HORIZONTAL_POSITION_MAPPING","left","center","right","HdsSuperSelectMultipleBaseComponent","_class","PowerSelectComponent","constructor","args","_initializerDefineProperty","_descriptor","_descriptor2","_descriptor3","selectedCount","selected","length","optionsCount","options","resultCountMessage","calculatePosition","trigger","content","anchoredPositionModifier","placement","horizontalPosition","offsetOptions","enableCollisionDetection","setPowerSelectAPI","powerSelectAPI","registerAPI","showSelected","showNoSelectedMessage","showOnlySelected","showAll","clearSelected","actions","select","showAfterOptions","searchPlaceholder","dropdownMaxWidthStyle","maxWidthStyle","dropdownMaxWidth","classNames","classes","matchTriggerWidth","push","isInvalid","join","_applyDecoratedDescriptor","prototype","tracked","configurable","enumerable","writable","initializer","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;AACA,eAAe,kBAAkB,CAAC,o9FAAo9F;;;ACSt/F,MAAMA,2BAA2B,GAAG,cAAc,CAAA;AAClD,MAAMC,2BAA2B,GAAG;AAClCC,EAAAA,IAAI,EAAE,cAAc;AACpBC,EAAAA,MAAM,EAAE,QAAQ;AAChBC,EAAAA,KAAK,EAAE,YAAA;AACT,CAAC,CAAA;AAEoBC,IAAAA,mCAAmC,IAAAC,MAAA,GAAzC,MAAMD,mCAAmC,SAASE,oBAAoB,CAAC;AAAAC,EAAAA,WAAAA,CAAA,GAAAC,IAAA,EAAA;AAAA,IAAA,KAAA,CAAA,GAAAA,IAAA,CAAA,CAAA;AAAAC,IAAAA,0BAAA,yBAAAC,WAAA,EAAA,IAAA,CAAA,CAAA;AAAAD,IAAAA,0BAAA,2BAAAE,YAAA,EAAA,IAAA,CAAA,CAAA;AAAAF,IAAAA,0BAAA,gCAAAG,YAAA,EAAA,IAAA,CAAA,CAAA;AAAA,GAAA;EAKpF,IAAIC,aAAaA,GAAG;AAClB,IAAA,OAAO,IAAI,CAACC,QAAQ,EAAEC,MAAM,IAAI,GAAG,CAAA;AACrC,GAAA;EAEA,IAAIC,YAAYA,GAAG;AACjB,IAAA,OAAO,IAAI,CAACC,OAAO,EAAEF,MAAM,IAAI,GAAG,CAAA;AACpC,GAAA;EAEA,IAAIG,kBAAkBA,GAAG;IACvB,OAAQ,CAAA,EAAE,IAAI,CAACL,aAAc,gBAAe,IAAI,CAACG,YAAa,CAAO,MAAA,CAAA,CAAA;AACvE,GAAA;AAEQG,EAAAA,iBAAiBA,CAACC,OAAO,EAAEC,OAAO,EAAE;AAC1C;AACAC,IAAAA,wBAAwB,CAACD,OAAO,EAAE,CAACD,OAAO,CAAC,EAAE;AAC3CG,MAAAA,SAAS,EAAE,IAAI,CAACf,IAAI,CAACgB,kBAAkB,GACnCxB,2BAA2B,CAAC,IAAI,CAACQ,IAAI,CAACgB,kBAAkB,CAAC,GACzDzB,2BAA2B;AAC/B0B,MAAAA,aAAa,EAAE,CAAC;AAChBC,MAAAA,wBAAwB,EAAE,IAAA;AAC5B,KAAC,CAAC,CAAA;AACF;AACA,IAAA,OAAO,EAAE,CAAA;AACX,GAAA;;AAEA;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EAEEC,iBAAiBA,CAACC,cAAc,EAAE;IAChC,IAAI,OAAO,IAAI,CAACpB,IAAI,CAACqB,WAAW,KAAK,UAAU,EAAE;AAC/C,MAAA,IAAI,CAACrB,IAAI,CAACqB,WAAW,CAACD,cAAc,CAAC,CAAA;AACvC,KAAA;IACA,IAAI,CAACA,cAAc,GAAGA,cAAc,CAAA;AACtC,GAAA;AAEQE,EAAAA,YAAYA,GAAG;AACrB,IAAA,IAAI,CAACC,qBAAqB,GAAG,IAAI,CAAClB,aAAa,KAAK,GAAG,CAAA;IACvD,IAAI,CAACmB,gBAAgB,GAAG,IAAI,CAAA;AAC9B,GAAA;AAEQC,EAAAA,OAAOA,GAAG;IAChB,IAAI,CAACF,qBAAqB,GAAG,KAAK,CAAA;IAClC,IAAI,CAACC,gBAAgB,GAAG,KAAK,CAAA;AAC/B,GAAA;AAEQE,EAAAA,aAAaA,GAAG;IACtB,IAAI,CAACN,cAAc,CAACO,OAAO,CAACC,MAAM,CAAC,IAAI,CAAC,CAAA;AACxC;IACA,IAAI,CAACL,qBAAqB,GAAG,KAAK,CAAA;IAClC,IAAI,CAACC,gBAAgB,GAAG,KAAK,CAAA;AAC/B,GAAA;;AAEA;AACF;AACA;AACA;AACA;AACA;EACE,IAAIK,gBAAgBA,GAAG;AACrB,IAAA,OAAO,IAAI,CAAC7B,IAAI,CAAC6B,gBAAgB,IAAI,IAAI,CAAA;AAC3C,GAAA;;AAEA;AACA;AACF;AACA;AACA;AACA;AACA;EACE,IAAIC,iBAAiBA,GAAG;AACtB,IAAA,OAAO,IAAI,CAAC9B,IAAI,CAAC8B,iBAAiB,IAAI,QAAQ,CAAA;AAChD,GAAA;;AAEA;AACF;AACA;AACA;AACA;AACA;EACE,IAAIC,qBAAqBA,GAAG;IAC1B,MAAMC,aAAa,GAAG,EAAE,CAAA;AACxB,IAAA,IAAI,IAAI,CAAChC,IAAI,CAACiC,gBAAgB,EAAE;MAC9BD,aAAa,CAAC,4CAA4C,CAAC,GACzD,IAAI,CAAChC,IAAI,CAACiC,gBAAgB,CAAA;AAC9B,KAAA;AACA,IAAA,OAAOD,aAAa,CAAA;AACtB,GAAA;;AAEA;AACF;AACA;AACA;AACA;EACE,IAAIE,UAAUA,GAAG;AACf,IAAA,IAAIC,OAAO,GAAG,CAAC,uBAAuB,EAAE,gCAAgC,CAAC,CAAA;;AAEzE;AACA,IAAA,IAAI,IAAI,CAACnC,IAAI,CAACoC,iBAAiB,KAAK,KAAK,IAAI,IAAI,CAACpC,IAAI,CAACiC,gBAAgB,EAAE;AACvEE,MAAAA,OAAO,CAACE,IAAI,CAAC,oDAAoD,CAAC,CAAA;AACpE,KAAA;;AAEA;AACA,IAAA,IAAI,IAAI,CAACrC,IAAI,CAACsC,SAAS,EAAE;AACvBH,MAAAA,OAAO,CAACE,IAAI,CAAE,CAAA,iCAAA,CAAkC,CAAC,CAAA;AACnD,KAAA;;AAEA;IACA,IAAI,IAAI,CAACb,gBAAgB,EAAE;AACzBW,MAAAA,OAAO,CAACE,IAAI,CAAE,CAAA,yCAAA,CAA0C,CAAC,CAAA;AAC3D,KAAA;AAEA,IAAA,OAAOF,OAAO,CAACI,IAAI,CAAC,GAAG,CAAC,CAAA;AAC1B,GAAA;AACF,CAAC,GAAArC,WAAA,GAAAsC,yBAAA,CAAA3C,MAAA,CAAA4C,SAAA,EAAA,gBAAA,EAAA,CA9HEC,OAAO,CAAA,EAAA;EAAAC,YAAA,EAAA,IAAA;EAAAC,UAAA,EAAA,IAAA;EAAAC,QAAA,EAAA,IAAA;EAAAC,WAAA,EAAA,IAAA;AAAA,CAAA3C,CAAAA,EAAAA,YAAA,GAAAqC,yBAAA,CAAA3C,MAAA,CAAA4C,SAAA,uBACPC,OAAO,CAAA,EAAA;EAAAC,YAAA,EAAA,IAAA;EAAAC,UAAA,EAAA,IAAA;EAAAC,QAAA,EAAA,IAAA;AAAAC,EAAAA,WAAA,cAAA;AAAA,IAAA,OAAoB,KAAK,CAAA;AAAA,GAAA;AAAA,CAAA1C,CAAAA,EAAAA,YAAA,GAAAoC,yBAAA,CAAA3C,MAAA,CAAA4C,SAAA,4BAChCC,OAAO,CAAA,EAAA;EAAAC,YAAA,EAAA,IAAA;EAAAC,UAAA,EAAA,IAAA;EAAAC,QAAA,EAAA,IAAA;AAAAC,EAAAA,WAAA,cAAA;AAAA,IAAA,OAAyB,KAAK,CAAA;AAAA,GAAA;AAAA,CAAAN,CAAAA,EAAAA,yBAAA,CAAA3C,MAAA,CAAA4C,SAAA,EAcrCM,mBAAAA,EAAAA,CAAAA,MAAM,CAAAC,EAAAA,MAAA,CAAAC,wBAAA,CAAApD,MAAA,CAAA4C,SAAA,EAAA5C,mBAAAA,CAAAA,EAAAA,MAAA,CAAA4C,SAAA,CAAA,EAAAD,yBAAA,CAAA3C,MAAA,CAAA4C,SAAA,EAwBNM,mBAAAA,EAAAA,CAAAA,MAAM,GAAAC,MAAA,CAAAC,wBAAA,CAAApD,MAAA,CAAA4C,SAAA,EAAA5C,mBAAAA,CAAAA,EAAAA,MAAA,CAAA4C,SAAA,CAAA,EAAAD,yBAAA,CAAA3C,MAAA,CAAA4C,SAAA,EAAA,cAAA,EAAA,CAQNM,MAAM,CAAA,EAAAC,MAAA,CAAAC,wBAAA,CAAApD,MAAA,CAAA4C,SAAA,EAAA,cAAA,CAAA,EAAA5C,MAAA,CAAA4C,SAAA,CAAAD,EAAAA,yBAAA,CAAA3C,MAAA,CAAA4C,SAAA,EAAA,SAAA,EAAA,CAKNM,MAAM,CAAAC,EAAAA,MAAA,CAAAC,wBAAA,CAAApD,MAAA,CAAA4C,SAAA,EAAA,SAAA,CAAA,EAAA5C,MAAA,CAAA4C,SAAA,GAAAD,yBAAA,CAAA3C,MAAA,CAAA4C,SAAA,EAKNM,eAAAA,EAAAA,CAAAA,MAAM,CAAAC,EAAAA,MAAA,CAAAC,wBAAA,CAAApD,MAAA,CAAA4C,SAAA,oBAAA5C,MAAA,CAAA4C,SAAA,CAAA,GAAA5C,MAAA,EAAA;AA3D+CqD,oBAAA,CAAAC,QAAA,EAAnCvD,mCAAmC,CAAA;;;;"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import PowerSelectComponent from 'ember-power-select/components/power-select';
|
|
2
|
+
import { ID_PREFIX } from '../../label/index.js';
|
|
3
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
4
|
+
import { setComponentTemplate } from '@ember/component';
|
|
5
|
+
|
|
6
|
+
var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n<Hds::Form::Field\n @layout=\"vertical\"\n @extraAriaDescribedBy={{@extraAriaDescribedBy}}\n @isRequired={{@isRequired}}\n @isOptional={{@isOptional}}\n @id={{@id}}\n as |F|\n>\n {{! Notice: the order of the elements is not relevant here, because is controlled at \"Hds::Form::Field\" component level }}\n {{yield (hash Label=F.Label isRequired=F.isRequired isOptional=F.isOptional)}}\n {{yield (hash HelperText=F.HelperText Error=F.Error)}}\n <F.Control>\n {{! Important: if an argument is added in base.hbs, it must also be added/processed here }}\n <Hds::Form::SuperSelect::Multiple::Base\n @afterOptionsComponent={{@afterOptionsComponent}}\n @afterOptionsContent={{@afterOptionsContent}}\n @ariaDescribedBy={{F.ariaDescribedBy}}\n @ariaInvalid={{@ariaInvalid}}\n @ariaLabel={{@ariaLabel}}\n @ariaLabelledBy={{(concat this.idPrefix F.id)}}\n @beforeOptionsComponent={{@beforeOptionsComponent}}\n @disabled={{@disabled}}\n @dropdownClass={{@dropdownClass}}\n @dropdownMaxWidth={{@dropdownMaxWidth}}\n @extra={{@extra}}\n @groupComponent={{@groupComponent}}\n @horizontalPosition={{@horizontalPosition}}\n @initiallyOpened={{@initiallyOpened}}\n @labelText={{@labelText}}\n @loadingMessage={{@loadingMessage}}\n @matcher={{@matcher}}\n @matchTriggerWidth={{@matchTriggerWidth}}\n @noMatchesMessage={{@noMatchesMessage}}\n @onBlur={{@onBlur}}\n @onChange={{@onChange}}\n @onClose={{@onClose}}\n @onFocus={{@onFocus}}\n @onInput={{@onInput}}\n @onKeydown={{@onKeydown}}\n @onOpen={{@onOpen}}\n @options={{@options}}\n @optionsComponent={{@optionsComponent}}\n @placeholder={{@placeholder}}\n @placeholderComponent={{@placeholderComponent}}\n @preventScroll={{@preventScroll}}\n @registerAPI={{@registerAPI}}\n @renderInPlace={{true}}\n @resultCountMessage={{@resultCountMessage}}\n @scrollTo={{@scrollTo}}\n @search={{@search}}\n @searchEnabled={{@searchEnabled}}\n @searchField={{@searchField}}\n @searchMessage={{@searchMessage}}\n @searchPlaceholder={{@searchPlaceholder}}\n @selected={{@selected}}\n @selectedItemComponent={{@selectedItemComponent}}\n @showAfterOptions={{@showAfterOptions}}\n @tabindex={{@tabindex}}\n @triggerClass={{@triggerClass}}\n @triggerComponent={{@triggerComponent}}\n @triggerId={{F.id}}\n @triggerRole={{@triggerRole}}\n @typeAheadMatcher={{@typeAheadMatcher}}\n @verticalPosition={{@verticalPosition}}\n @isInvalid={{@isInvalid}}\n ...attributes\n as |options select|\n >\n {{yield (hash options=options select=select Options=(component \"hds/yield\" options=options select=select))}}\n </Hds::Form::SuperSelect::Multiple::Base>\n </F.Control>\n</Hds::Form::Field>");
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Copyright (c) HashiCorp, Inc.
|
|
10
|
+
* SPDX-License-Identifier: MPL-2.0
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
class HdsSuperSelectMultipleFieldComponent extends PowerSelectComponent {
|
|
14
|
+
get idPrefix() {
|
|
15
|
+
return ID_PREFIX;
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
setComponentTemplate(TEMPLATE, HdsSuperSelectMultipleFieldComponent);
|
|
19
|
+
|
|
20
|
+
export { HdsSuperSelectMultipleFieldComponent as default };
|
|
21
|
+
//# sourceMappingURL=field.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"field.js","sources":["../../../../../../src/components/hds/form/super-select/multiple/field.hbs","../../../../../../src/components/hds/form/super-select/multiple/field.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n Copyright (c) HashiCorp, Inc.\\n SPDX-License-Identifier: MPL-2.0\\n}}\\n<Hds::Form::Field\\n @layout=\\\"vertical\\\"\\n @extraAriaDescribedBy={{@extraAriaDescribedBy}}\\n @isRequired={{@isRequired}}\\n @isOptional={{@isOptional}}\\n @id={{@id}}\\n as |F|\\n>\\n {{! Notice: the order of the elements is not relevant here, because is controlled at \\\"Hds::Form::Field\\\" component level }}\\n {{yield (hash Label=F.Label isRequired=F.isRequired isOptional=F.isOptional)}}\\n {{yield (hash HelperText=F.HelperText Error=F.Error)}}\\n <F.Control>\\n {{! Important: if an argument is added in base.hbs, it must also be added/processed here }}\\n <Hds::Form::SuperSelect::Multiple::Base\\n @afterOptionsComponent={{@afterOptionsComponent}}\\n @afterOptionsContent={{@afterOptionsContent}}\\n @ariaDescribedBy={{F.ariaDescribedBy}}\\n @ariaInvalid={{@ariaInvalid}}\\n @ariaLabel={{@ariaLabel}}\\n @ariaLabelledBy={{(concat this.idPrefix F.id)}}\\n @beforeOptionsComponent={{@beforeOptionsComponent}}\\n @disabled={{@disabled}}\\n @dropdownClass={{@dropdownClass}}\\n @dropdownMaxWidth={{@dropdownMaxWidth}}\\n @extra={{@extra}}\\n @groupComponent={{@groupComponent}}\\n @horizontalPosition={{@horizontalPosition}}\\n @initiallyOpened={{@initiallyOpened}}\\n @labelText={{@labelText}}\\n @loadingMessage={{@loadingMessage}}\\n @matcher={{@matcher}}\\n @matchTriggerWidth={{@matchTriggerWidth}}\\n @noMatchesMessage={{@noMatchesMessage}}\\n @onBlur={{@onBlur}}\\n @onChange={{@onChange}}\\n @onClose={{@onClose}}\\n @onFocus={{@onFocus}}\\n @onInput={{@onInput}}\\n @onKeydown={{@onKeydown}}\\n @onOpen={{@onOpen}}\\n @options={{@options}}\\n @optionsComponent={{@optionsComponent}}\\n @placeholder={{@placeholder}}\\n @placeholderComponent={{@placeholderComponent}}\\n @preventScroll={{@preventScroll}}\\n @registerAPI={{@registerAPI}}\\n @renderInPlace={{true}}\\n @resultCountMessage={{@resultCountMessage}}\\n @scrollTo={{@scrollTo}}\\n @search={{@search}}\\n @searchEnabled={{@searchEnabled}}\\n @searchField={{@searchField}}\\n @searchMessage={{@searchMessage}}\\n @searchPlaceholder={{@searchPlaceholder}}\\n @selected={{@selected}}\\n @selectedItemComponent={{@selectedItemComponent}}\\n @showAfterOptions={{@showAfterOptions}}\\n @tabindex={{@tabindex}}\\n @triggerClass={{@triggerClass}}\\n @triggerComponent={{@triggerComponent}}\\n @triggerId={{F.id}}\\n @triggerRole={{@triggerRole}}\\n @typeAheadMatcher={{@typeAheadMatcher}}\\n @verticalPosition={{@verticalPosition}}\\n @isInvalid={{@isInvalid}}\\n ...attributes\\n as |options select|\\n >\\n {{yield (hash options=options select=select Options=(component \\\"hds/yield\\\" options=options select=select))}}\\n </Hds::Form::SuperSelect::Multiple::Base>\\n </F.Control>\\n</Hds::Form::Field>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport PowerSelectComponent from 'ember-power-select/components/power-select';\nimport { ID_PREFIX } from '../../label/index';\n\nexport default class HdsSuperSelectMultipleFieldComponent extends PowerSelectComponent {\n get idPrefix() {\n return ID_PREFIX;\n }\n}\n"],"names":["HdsSuperSelectMultipleFieldComponent","PowerSelectComponent","idPrefix","ID_PREFIX","setComponentTemplate","TEMPLATE"],"mappings":";;;;;AACA,eAAe,kBAAkB,CAAC,m8FAAm8F;;ACDr+F;AACA;AACA;AACA;;AAKe,MAAMA,oCAAoC,SAASC,oBAAoB,CAAC;EACrF,IAAIC,QAAQA,GAAG;AACb,IAAA,OAAOC,SAAS,CAAA;AAClB,GAAA;AACF,CAAA;AAACC,oBAAA,CAAAC,QAAA,EAJoBL,oCAAoC,CAAA;;;;"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { a as _defineProperty } from '../../../../_rollupPluginBabelHelpers-NoJJJNhk.js';
|
|
2
|
+
import Component from '@glimmer/component';
|
|
3
|
+
import { guidFor } from '@ember/object/internals';
|
|
4
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
5
|
+
import { setComponentTemplate } from '@ember/component';
|
|
6
|
+
|
|
7
|
+
var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n<li class=\"hds-form-super-select__option-group\" role=\"group\" aria-labelledby={{this.groupTitleId}}>\n <Hds::Text::Body\n @tag=\"div\"\n @size=\"100\"\n @weight=\"semibold\"\n class=\"hds-form-super-select__option-group-title\"\n id={{this.groupTitleId}}\n >\n {{@group.groupName}}\n </Hds::Text::Body>\n {{yield}}\n</li>");
|
|
8
|
+
|
|
9
|
+
class HdsSuperSelectOptionGroupComponent extends Component {
|
|
10
|
+
constructor(...args) {
|
|
11
|
+
super(...args);
|
|
12
|
+
/**
|
|
13
|
+
* Generates a unique ID for the group title
|
|
14
|
+
* @return {string}
|
|
15
|
+
*/
|
|
16
|
+
_defineProperty(this, "groupTitleId", 'group-title-' + guidFor(this));
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
setComponentTemplate(TEMPLATE, HdsSuperSelectOptionGroupComponent);
|
|
20
|
+
|
|
21
|
+
export { HdsSuperSelectOptionGroupComponent as default };
|
|
22
|
+
//# sourceMappingURL=option-group.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"option-group.js","sources":["../../../../../src/components/hds/form/super-select/option-group.hbs","../../../../../src/components/hds/form/super-select/option-group.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n Copyright (c) HashiCorp, Inc.\\n SPDX-License-Identifier: MPL-2.0\\n}}\\n<li class=\\\"hds-form-super-select__option-group\\\" role=\\\"group\\\" aria-labelledby={{this.groupTitleId}}>\\n <Hds::Text::Body\\n @tag=\\\"div\\\"\\n @size=\\\"100\\\"\\n @weight=\\\"semibold\\\"\\n class=\\\"hds-form-super-select__option-group-title\\\"\\n id={{this.groupTitleId}}\\n >\\n {{@group.groupName}}\\n </Hds::Text::Body>\\n {{yield}}\\n</li>\")","/**\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';\n\nexport default class HdsSuperSelectOptionGroupComponent extends Component {\n /**\n * Generates a unique ID for the group title\n * @return {string}\n */\n groupTitleId = 'group-title-' + guidFor(this);\n}\n"],"names":["HdsSuperSelectOptionGroupComponent","Component","constructor","args","_defineProperty","guidFor","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;AACA,eAAe,kBAAkB,CAAC,mdAAmd;;ACOte,MAAMA,kCAAkC,SAASC,SAAS,CAAC;AAAAC,EAAAA,WAAAA,CAAA,GAAAC,IAAA,EAAA;AAAA,IAAA,KAAA,CAAA,GAAAA,IAAA,CAAA,CAAA;AACxE;AACF;AACA;AACA;AAHEC,IAAAA,eAAA,uBAIe,cAAc,GAAGC,OAAO,CAAC,IAAI,CAAC,CAAA,CAAA;AAAA,GAAA;AAC/C,CAAA;AAACC,oBAAA,CAAAC,QAAA,EANoBP,kCAAkC,CAAA;;;;"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import templateOnly from '@ember/component/template-only';
|
|
2
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
3
|
+
import { setComponentTemplate } from '@ember/component';
|
|
4
|
+
|
|
5
|
+
var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n<Hds::Text::Body @tag=\"span\" @size=\"200\" class=\"ember-power-select-placeholder\">{{@placeholder}}</Hds::Text::Body>");
|
|
6
|
+
|
|
7
|
+
var placeholder = setComponentTemplate(TEMPLATE, templateOnly());
|
|
8
|
+
|
|
9
|
+
export { placeholder as default };
|
|
10
|
+
//# sourceMappingURL=placeholder.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"placeholder.js","sources":["../../../../../src/components/hds/form/super-select/placeholder.hbs","../../../../../src/components/hds/form/super-select/placeholder.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n Copyright (c) HashiCorp, Inc.\\n SPDX-License-Identifier: MPL-2.0\\n}}\\n<Hds::Text::Body @tag=\\\"span\\\" @size=\\\"200\\\" class=\\\"ember-power-select-placeholder\\\">{{@placeholder}}</Hds::Text::Body>\")","import templateOnly from '@ember/component/template-only';\nexport default templateOnly();\n"],"names":["setComponentTemplate","TEMPLATE","templateOnly"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,iPAAiP;;ACAnR,kBAAAA,oBAAA,CAAAC,QAAA,EAAeC,YAAY,EAAE,CAAA;;;;"}
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import { _ as _applyDecoratedDescriptor } from '../../../../../_rollupPluginBabelHelpers-NoJJJNhk.js';
|
|
2
|
+
import PowerSelectComponent from 'ember-power-select/components/power-select';
|
|
3
|
+
import anchoredPositionModifier from '../../../../../modifiers/hds-anchored-position.js';
|
|
4
|
+
import { action } from '@ember/object';
|
|
5
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
6
|
+
import { setComponentTemplate } from '@ember/component';
|
|
7
|
+
|
|
8
|
+
var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n{{! Important: if an argument is added in base.hbs, it must also be added/processed in the Base component used in field.hbs }}\n<div class={{this.classNames}} {{style this.dropdownMaxWidthStyle}}>\n <PowerSelect\n @afterOptionsComponent={{if\n this.showAfterOptions\n (or\n @afterOptionsComponent\n (component\n \"hds/form/super-select/after-options\" content=@afterOptionsContent resultCountMessage=this.resultCountMessage\n )\n )\n }}\n @ariaDescribedBy={{@ariaDescribedBy}}\n @ariaInvalid={{@ariaInvalid}}\n @ariaLabel={{@ariaLabel}}\n @ariaLabelledBy={{@ariaLabelledBy}}\n @beforeOptionsComponent={{@beforeOptionsComponent}}\n @calculatePosition={{if @verticalPosition undefined this.calculatePosition}}\n @closeOnSelect={{@closeOnSelect}}\n @disabled={{@disabled}}\n @dropdownClass={{@dropdownClass}}\n @extra={{@extra}}\n @groupComponent={{component \"hds/form/super-select/option-group\"}}\n @horizontalPosition={{@horizontalPosition}}\n @initiallyOpened={{@initiallyOpened}}\n @labelText={{@labelText}}\n @loadingMessage={{@loadingMessage}}\n @matcher={{@matcher}}\n @matchTriggerWidth={{if @dropdownMaxWidth false @matchTriggerWidth}}\n @noMatchesMessage={{@noMatchesMessage}}\n @onBlur={{@onBlur}}\n @onChange={{@onChange}}\n @onClose={{@onClose}}\n @onFocus={{@onFocus}}\n @onInput={{@onInput}}\n @onKeydown={{@onKeydown}}\n @onOpen={{@onOpen}}\n @options={{@options}}\n @optionsComponent={{@optionsComponent}}\n @placeholder={{@placeholder}}\n @placeholderComponent={{component \"hds/form/super-select/placeholder\"}}\n @preventScroll={{@preventScroll}}\n @registerAPI={{@registerAPI}}\n @renderInPlace={{true}}\n @resultCountMessage={{@resultCountMessage}}\n @scrollTo={{@scrollTo}}\n @search={{@search}}\n @searchEnabled={{@searchEnabled}}\n @searchField={{@searchField}}\n @searchMessage={{@searchMessage}}\n @searchPlaceholder={{this.searchPlaceholder}}\n @selected={{@selected}}\n @selectedItemComponent={{@selectedItemComponent}}\n @tabindex={{@tabindex}}\n @triggerClass={{@triggerClass}}\n @triggerComponent={{@triggerComponent}}\n @triggerId={{@triggerId}}\n @triggerRole={{@triggerRole}}\n @typeAheadMatcher={{@typeAheadMatcher}}\n @verticalPosition={{@verticalPosition}}\n ...attributes\n as |option select|\n >\n <Hds::Text::Body>{{yield option select}}</Hds::Text::Body>\n </PowerSelect>\n</div>");
|
|
9
|
+
|
|
10
|
+
var _class;
|
|
11
|
+
const DEFAULT_HORIZONTAL_POSITION = 'bottom-start';
|
|
12
|
+
const HORIZONTAL_POSITION_MAPPING = {
|
|
13
|
+
left: 'bottom-start',
|
|
14
|
+
center: 'bottom',
|
|
15
|
+
right: 'bottom-end'
|
|
16
|
+
};
|
|
17
|
+
let HdsSuperSelectSingleBaseComponent = (_class = class HdsSuperSelectSingleBaseComponent extends PowerSelectComponent {
|
|
18
|
+
calculatePosition(trigger, content) {
|
|
19
|
+
// use `hds-anchored-position` to calculate and set position
|
|
20
|
+
anchoredPositionModifier(content, [trigger], {
|
|
21
|
+
placement: this.args.horizontalPosition ? HORIZONTAL_POSITION_MAPPING[this.args.horizontalPosition] : DEFAULT_HORIZONTAL_POSITION,
|
|
22
|
+
offsetOptions: 4,
|
|
23
|
+
enableCollisionDetection: true
|
|
24
|
+
});
|
|
25
|
+
// prevent PowerSelect from setting position
|
|
26
|
+
return {};
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
/**
|
|
30
|
+
* Determine if `@afterOptionsComponent` gets displayed
|
|
31
|
+
* @param showAfterOptions
|
|
32
|
+
* @type {boolean}
|
|
33
|
+
* @default false
|
|
34
|
+
*/
|
|
35
|
+
get showAfterOptions() {
|
|
36
|
+
return this.args.showAfterOptions ?? this.args.afterOptionsContent ?? false;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
/**
|
|
40
|
+
* Get the search placeholder text
|
|
41
|
+
* @param searchPlaceholder
|
|
42
|
+
* @type {string}
|
|
43
|
+
* @default 'Search'
|
|
44
|
+
*/
|
|
45
|
+
get searchPlaceholder() {
|
|
46
|
+
return this.args.searchPlaceholder ?? 'Search';
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
/**
|
|
50
|
+
* Get the maxWidth to apply to the dropdown
|
|
51
|
+
* @param dropdownMaxWidth
|
|
52
|
+
* @type {string}
|
|
53
|
+
* @default 'none'
|
|
54
|
+
*/
|
|
55
|
+
get dropdownMaxWidthStyle() {
|
|
56
|
+
const maxWidthStyle = {};
|
|
57
|
+
if (this.args.dropdownMaxWidth) {
|
|
58
|
+
maxWidthStyle['--hds-form-super-select-dropdown-max-width'] = this.args.dropdownMaxWidth;
|
|
59
|
+
}
|
|
60
|
+
return maxWidthStyle;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
/**
|
|
64
|
+
* Get the class names to apply to the component.
|
|
65
|
+
* @method classNames
|
|
66
|
+
* @return {string} The "class" attribute to apply to the component.
|
|
67
|
+
*/
|
|
68
|
+
get classNames() {
|
|
69
|
+
let classes = ['hds-form-super-select', 'hds-form-super-select-single'];
|
|
70
|
+
|
|
71
|
+
// add a class based on the @matchTriggerWidth argument or whether dropdownMaxWidth is set
|
|
72
|
+
if (this.args.matchTriggerWidth === false || this.args.dropdownMaxWidth) {
|
|
73
|
+
classes.push('hds-form-super-select--dropdown-content-auto-width');
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
// add a class based on the @isInvalid argument
|
|
77
|
+
if (this.args.isInvalid) {
|
|
78
|
+
classes.push(`hds-form-super-select--is-invalid`);
|
|
79
|
+
}
|
|
80
|
+
return classes.join(' ');
|
|
81
|
+
}
|
|
82
|
+
}, (_applyDecoratedDescriptor(_class.prototype, "calculatePosition", [action], Object.getOwnPropertyDescriptor(_class.prototype, "calculatePosition"), _class.prototype)), _class);
|
|
83
|
+
setComponentTemplate(TEMPLATE, HdsSuperSelectSingleBaseComponent);
|
|
84
|
+
|
|
85
|
+
export { HdsSuperSelectSingleBaseComponent as default };
|
|
86
|
+
//# sourceMappingURL=base.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../../src/components/hds/form/super-select/single/base.hbs","../../../../../../src/components/hds/form/super-select/single/base.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n Copyright (c) HashiCorp, Inc.\\n SPDX-License-Identifier: MPL-2.0\\n}}\\n{{! Important: if an argument is added in base.hbs, it must also be added/processed in the Base component used in field.hbs }}\\n<div class={{this.classNames}} {{style this.dropdownMaxWidthStyle}}>\\n <PowerSelect\\n @afterOptionsComponent={{if\\n this.showAfterOptions\\n (or\\n @afterOptionsComponent\\n (component\\n \\\"hds/form/super-select/after-options\\\" content=@afterOptionsContent resultCountMessage=this.resultCountMessage\\n )\\n )\\n }}\\n @ariaDescribedBy={{@ariaDescribedBy}}\\n @ariaInvalid={{@ariaInvalid}}\\n @ariaLabel={{@ariaLabel}}\\n @ariaLabelledBy={{@ariaLabelledBy}}\\n @beforeOptionsComponent={{@beforeOptionsComponent}}\\n @calculatePosition={{if @verticalPosition undefined this.calculatePosition}}\\n @closeOnSelect={{@closeOnSelect}}\\n @disabled={{@disabled}}\\n @dropdownClass={{@dropdownClass}}\\n @extra={{@extra}}\\n @groupComponent={{component \\\"hds/form/super-select/option-group\\\"}}\\n @horizontalPosition={{@horizontalPosition}}\\n @initiallyOpened={{@initiallyOpened}}\\n @labelText={{@labelText}}\\n @loadingMessage={{@loadingMessage}}\\n @matcher={{@matcher}}\\n @matchTriggerWidth={{if @dropdownMaxWidth false @matchTriggerWidth}}\\n @noMatchesMessage={{@noMatchesMessage}}\\n @onBlur={{@onBlur}}\\n @onChange={{@onChange}}\\n @onClose={{@onClose}}\\n @onFocus={{@onFocus}}\\n @onInput={{@onInput}}\\n @onKeydown={{@onKeydown}}\\n @onOpen={{@onOpen}}\\n @options={{@options}}\\n @optionsComponent={{@optionsComponent}}\\n @placeholder={{@placeholder}}\\n @placeholderComponent={{component \\\"hds/form/super-select/placeholder\\\"}}\\n @preventScroll={{@preventScroll}}\\n @registerAPI={{@registerAPI}}\\n @renderInPlace={{true}}\\n @resultCountMessage={{@resultCountMessage}}\\n @scrollTo={{@scrollTo}}\\n @search={{@search}}\\n @searchEnabled={{@searchEnabled}}\\n @searchField={{@searchField}}\\n @searchMessage={{@searchMessage}}\\n @searchPlaceholder={{this.searchPlaceholder}}\\n @selected={{@selected}}\\n @selectedItemComponent={{@selectedItemComponent}}\\n @tabindex={{@tabindex}}\\n @triggerClass={{@triggerClass}}\\n @triggerComponent={{@triggerComponent}}\\n @triggerId={{@triggerId}}\\n @triggerRole={{@triggerRole}}\\n @typeAheadMatcher={{@typeAheadMatcher}}\\n @verticalPosition={{@verticalPosition}}\\n ...attributes\\n as |option select|\\n >\\n <Hds::Text::Body>{{yield option select}}</Hds::Text::Body>\\n </PowerSelect>\\n</div>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport PowerSelectComponent from 'ember-power-select/components/power-select';\nimport anchoredPositionModifier from '../../../../../modifiers/hds-anchored-position';\nimport { action } from '@ember/object';\n\nconst DEFAULT_HORIZONTAL_POSITION = 'bottom-start';\nconst HORIZONTAL_POSITION_MAPPING = {\n left: 'bottom-start',\n center: 'bottom',\n right: 'bottom-end',\n};\n\nexport default class HdsSuperSelectSingleBaseComponent extends PowerSelectComponent {\n @action calculatePosition(trigger, content) {\n // use `hds-anchored-position` to calculate and set position\n anchoredPositionModifier(content, [trigger], {\n placement: this.args.horizontalPosition\n ? HORIZONTAL_POSITION_MAPPING[this.args.horizontalPosition]\n : DEFAULT_HORIZONTAL_POSITION,\n offsetOptions: 4,\n enableCollisionDetection: true,\n });\n // prevent PowerSelect from setting position\n return {};\n }\n\n /**\n * Determine if `@afterOptionsComponent` gets displayed\n * @param showAfterOptions\n * @type {boolean}\n * @default false\n */\n get showAfterOptions() {\n return this.args.showAfterOptions ?? this.args.afterOptionsContent ?? false;\n }\n\n /**\n * Get the search placeholder text\n * @param searchPlaceholder\n * @type {string}\n * @default 'Search'\n */\n get searchPlaceholder() {\n return this.args.searchPlaceholder ?? 'Search';\n }\n\n /**\n * Get the maxWidth to apply to the dropdown\n * @param dropdownMaxWidth\n * @type {string}\n * @default 'none'\n */\n get dropdownMaxWidthStyle() {\n const maxWidthStyle = {};\n if (this.args.dropdownMaxWidth) {\n maxWidthStyle['--hds-form-super-select-dropdown-max-width'] =\n this.args.dropdownMaxWidth;\n }\n return maxWidthStyle;\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() {\n let classes = ['hds-form-super-select', 'hds-form-super-select-single'];\n\n // add a class based on the @matchTriggerWidth argument or whether dropdownMaxWidth is set\n if (this.args.matchTriggerWidth === false || this.args.dropdownMaxWidth) {\n classes.push('hds-form-super-select--dropdown-content-auto-width');\n }\n\n // add a class based on the @isInvalid argument\n if (this.args.isInvalid) {\n classes.push(`hds-form-super-select--is-invalid`);\n }\n\n return classes.join(' ');\n }\n}\n"],"names":["DEFAULT_HORIZONTAL_POSITION","HORIZONTAL_POSITION_MAPPING","left","center","right","HdsSuperSelectSingleBaseComponent","_class","PowerSelectComponent","calculatePosition","trigger","content","anchoredPositionModifier","placement","args","horizontalPosition","offsetOptions","enableCollisionDetection","showAfterOptions","afterOptionsContent","searchPlaceholder","dropdownMaxWidthStyle","maxWidthStyle","dropdownMaxWidth","classNames","classes","matchTriggerWidth","push","isInvalid","join","_applyDecoratedDescriptor","prototype","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;AACA,eAAe,kBAAkB,CAAC,+iFAA+iF;;;ACQjlF,MAAMA,2BAA2B,GAAG,cAAc,CAAA;AAClD,MAAMC,2BAA2B,GAAG;AAClCC,EAAAA,IAAI,EAAE,cAAc;AACpBC,EAAAA,MAAM,EAAE,QAAQ;AAChBC,EAAAA,KAAK,EAAE,YAAA;AACT,CAAC,CAAA;AAEoBC,IAAAA,iCAAiC,IAAAC,MAAA,GAAvC,MAAMD,iCAAiC,SAASE,oBAAoB,CAAC;AAC1EC,EAAAA,iBAAiBA,CAACC,OAAO,EAAEC,OAAO,EAAE;AAC1C;AACAC,IAAAA,wBAAwB,CAACD,OAAO,EAAE,CAACD,OAAO,CAAC,EAAE;AAC3CG,MAAAA,SAAS,EAAE,IAAI,CAACC,IAAI,CAACC,kBAAkB,GACnCb,2BAA2B,CAAC,IAAI,CAACY,IAAI,CAACC,kBAAkB,CAAC,GACzDd,2BAA2B;AAC/Be,MAAAA,aAAa,EAAE,CAAC;AAChBC,MAAAA,wBAAwB,EAAE,IAAA;AAC5B,KAAC,CAAC,CAAA;AACF;AACA,IAAA,OAAO,EAAE,CAAA;AACX,GAAA;;AAEA;AACF;AACA;AACA;AACA;AACA;EACE,IAAIC,gBAAgBA,GAAG;AACrB,IAAA,OAAO,IAAI,CAACJ,IAAI,CAACI,gBAAgB,IAAI,IAAI,CAACJ,IAAI,CAACK,mBAAmB,IAAI,KAAK,CAAA;AAC7E,GAAA;;AAEA;AACF;AACA;AACA;AACA;AACA;EACE,IAAIC,iBAAiBA,GAAG;AACtB,IAAA,OAAO,IAAI,CAACN,IAAI,CAACM,iBAAiB,IAAI,QAAQ,CAAA;AAChD,GAAA;;AAEA;AACF;AACA;AACA;AACA;AACA;EACE,IAAIC,qBAAqBA,GAAG;IAC1B,MAAMC,aAAa,GAAG,EAAE,CAAA;AACxB,IAAA,IAAI,IAAI,CAACR,IAAI,CAACS,gBAAgB,EAAE;MAC9BD,aAAa,CAAC,4CAA4C,CAAC,GACzD,IAAI,CAACR,IAAI,CAACS,gBAAgB,CAAA;AAC9B,KAAA;AACA,IAAA,OAAOD,aAAa,CAAA;AACtB,GAAA;;AAEA;AACF;AACA;AACA;AACA;EACE,IAAIE,UAAUA,GAAG;AACf,IAAA,IAAIC,OAAO,GAAG,CAAC,uBAAuB,EAAE,8BAA8B,CAAC,CAAA;;AAEvE;AACA,IAAA,IAAI,IAAI,CAACX,IAAI,CAACY,iBAAiB,KAAK,KAAK,IAAI,IAAI,CAACZ,IAAI,CAACS,gBAAgB,EAAE;AACvEE,MAAAA,OAAO,CAACE,IAAI,CAAC,oDAAoD,CAAC,CAAA;AACpE,KAAA;;AAEA;AACA,IAAA,IAAI,IAAI,CAACb,IAAI,CAACc,SAAS,EAAE;AACvBH,MAAAA,OAAO,CAACE,IAAI,CAAE,CAAA,iCAAA,CAAkC,CAAC,CAAA;AACnD,KAAA;AAEA,IAAA,OAAOF,OAAO,CAACI,IAAI,CAAC,GAAG,CAAC,CAAA;AAC1B,GAAA;AACF,CAAC,GAAAC,yBAAA,CAAAvB,MAAA,CAAAwB,SAAA,EAAA,mBAAA,EAAA,CApEEC,MAAM,CAAAC,EAAAA,MAAA,CAAAC,wBAAA,CAAA3B,MAAA,CAAAwB,SAAA,wBAAAxB,MAAA,CAAAwB,SAAA,CAAA,GAAAxB,MAAA,EAAA;AAD6C4B,oBAAA,CAAAC,QAAA,EAAjC9B,iCAAiC,CAAA;;;;"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import PowerSelectComponent from 'ember-power-select/components/power-select';
|
|
2
|
+
import { ID_PREFIX } from '../../label/index.js';
|
|
3
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
4
|
+
import { setComponentTemplate } from '@ember/component';
|
|
5
|
+
|
|
6
|
+
var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n<Hds::Form::Field\n @layout=\"vertical\"\n @extraAriaDescribedBy={{@extraAriaDescribedBy}}\n @isRequired={{@isRequired}}\n @isOptional={{@isOptional}}\n @id={{@id}}\n as |F|\n>\n {{! Notice: the order of the elements is not relevant here, because is controlled at \"Hds::Form::Field\" component level }}\n {{yield (hash Label=F.Label isRequired=F.isRequired isOptional=F.isOptional)}}\n {{yield (hash HelperText=F.HelperText Error=F.Error)}}\n <F.Control>\n {{! Important: if an argument is added in base.hbs, it must also be added/processed here }}\n <Hds::Form::SuperSelect::Single::Base\n @afterOptionsComponent={{@afterOptionsComponent}}\n @afterOptionsContent={{@afterOptionsContent}}\n @ariaDescribedBy={{F.ariaDescribedBy}}\n @ariaInvalid={{@ariaInvalid}}\n @ariaLabel={{@ariaLabel}}\n @ariaLabelledBy={{(concat this.idPrefix F.id)}}\n @beforeOptionsComponent={{@beforeOptionsComponent}}\n @closeOnSelect={{@closeOnSelect}}\n @disabled={{@disabled}}\n @dropdownClass={{@dropdownClass}}\n @dropdownMaxWidth={{@dropdownMaxWidth}}\n @extra={{@extra}}\n @groupComponent={{@groupComponent}}\n @horizontalPosition={{@horizontalPosition}}\n @initiallyOpened={{@initiallyOpened}}\n @labelText={{@labelText}}\n @loadingMessage={{@loadingMessage}}\n @matcher={{@matcher}}\n @matchTriggerWidth={{@matchTriggerWidth}}\n @noMatchesMessage={{@noMatchesMessage}}\n @onBlur={{@onBlur}}\n @onChange={{@onChange}}\n @onClose={{@onClose}}\n @onFocus={{@onFocus}}\n @onInput={{@onInput}}\n @onKeydown={{@onKeydown}}\n @onOpen={{@onOpen}}\n @options={{@options}}\n @optionsComponent={{@optionsComponent}}\n @placeholder={{@placeholder}}\n @placeholderComponent={{@placeholderComponent}}\n @preventScroll={{@preventScroll}}\n @registerAPI={{@registerAPI}}\n @renderInPlace={{true}}\n @resultCountMessage={{@resultCountMessage}}\n @scrollTo={{@scrollTo}}\n @search={{@search}}\n @searchEnabled={{@searchEnabled}}\n @searchField={{@searchField}}\n @searchMessage={{@searchMessage}}\n @searchPlaceholder={{@searchPlaceholder}}\n @selected={{@selected}}\n @selectedItemComponent={{@selectedItemComponent}}\n @showAfterOptions={{@showAfterOptions}}\n @tabindex={{@tabindex}}\n @triggerClass={{@triggerClass}}\n @triggerComponent={{@triggerComponent}}\n @triggerId={{F.id}}\n @triggerRole={{@triggerRole}}\n @typeAheadMatcher={{@typeAheadMatcher}}\n @verticalPosition={{@verticalPosition}}\n @isInvalid={{@isInvalid}}\n ...attributes\n as |options select|\n >\n {{yield (hash options=options select=select Options=(component \"hds/yield\" options=options select=select))}}\n </Hds::Form::SuperSelect::Single::Base>\n </F.Control>\n</Hds::Form::Field>");
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Copyright (c) HashiCorp, Inc.
|
|
10
|
+
* SPDX-License-Identifier: MPL-2.0
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
class HdsSuperSelectSingleFieldComponent extends PowerSelectComponent {
|
|
14
|
+
get idPrefix() {
|
|
15
|
+
return ID_PREFIX;
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
setComponentTemplate(TEMPLATE, HdsSuperSelectSingleFieldComponent);
|
|
19
|
+
|
|
20
|
+
export { HdsSuperSelectSingleFieldComponent as default };
|
|
21
|
+
//# sourceMappingURL=field.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"field.js","sources":["../../../../../../src/components/hds/form/super-select/single/field.hbs","../../../../../../src/components/hds/form/super-select/single/field.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n Copyright (c) HashiCorp, Inc.\\n SPDX-License-Identifier: MPL-2.0\\n}}\\n<Hds::Form::Field\\n @layout=\\\"vertical\\\"\\n @extraAriaDescribedBy={{@extraAriaDescribedBy}}\\n @isRequired={{@isRequired}}\\n @isOptional={{@isOptional}}\\n @id={{@id}}\\n as |F|\\n>\\n {{! Notice: the order of the elements is not relevant here, because is controlled at \\\"Hds::Form::Field\\\" component level }}\\n {{yield (hash Label=F.Label isRequired=F.isRequired isOptional=F.isOptional)}}\\n {{yield (hash HelperText=F.HelperText Error=F.Error)}}\\n <F.Control>\\n {{! Important: if an argument is added in base.hbs, it must also be added/processed here }}\\n <Hds::Form::SuperSelect::Single::Base\\n @afterOptionsComponent={{@afterOptionsComponent}}\\n @afterOptionsContent={{@afterOptionsContent}}\\n @ariaDescribedBy={{F.ariaDescribedBy}}\\n @ariaInvalid={{@ariaInvalid}}\\n @ariaLabel={{@ariaLabel}}\\n @ariaLabelledBy={{(concat this.idPrefix F.id)}}\\n @beforeOptionsComponent={{@beforeOptionsComponent}}\\n @closeOnSelect={{@closeOnSelect}}\\n @disabled={{@disabled}}\\n @dropdownClass={{@dropdownClass}}\\n @dropdownMaxWidth={{@dropdownMaxWidth}}\\n @extra={{@extra}}\\n @groupComponent={{@groupComponent}}\\n @horizontalPosition={{@horizontalPosition}}\\n @initiallyOpened={{@initiallyOpened}}\\n @labelText={{@labelText}}\\n @loadingMessage={{@loadingMessage}}\\n @matcher={{@matcher}}\\n @matchTriggerWidth={{@matchTriggerWidth}}\\n @noMatchesMessage={{@noMatchesMessage}}\\n @onBlur={{@onBlur}}\\n @onChange={{@onChange}}\\n @onClose={{@onClose}}\\n @onFocus={{@onFocus}}\\n @onInput={{@onInput}}\\n @onKeydown={{@onKeydown}}\\n @onOpen={{@onOpen}}\\n @options={{@options}}\\n @optionsComponent={{@optionsComponent}}\\n @placeholder={{@placeholder}}\\n @placeholderComponent={{@placeholderComponent}}\\n @preventScroll={{@preventScroll}}\\n @registerAPI={{@registerAPI}}\\n @renderInPlace={{true}}\\n @resultCountMessage={{@resultCountMessage}}\\n @scrollTo={{@scrollTo}}\\n @search={{@search}}\\n @searchEnabled={{@searchEnabled}}\\n @searchField={{@searchField}}\\n @searchMessage={{@searchMessage}}\\n @searchPlaceholder={{@searchPlaceholder}}\\n @selected={{@selected}}\\n @selectedItemComponent={{@selectedItemComponent}}\\n @showAfterOptions={{@showAfterOptions}}\\n @tabindex={{@tabindex}}\\n @triggerClass={{@triggerClass}}\\n @triggerComponent={{@triggerComponent}}\\n @triggerId={{F.id}}\\n @triggerRole={{@triggerRole}}\\n @typeAheadMatcher={{@typeAheadMatcher}}\\n @verticalPosition={{@verticalPosition}}\\n @isInvalid={{@isInvalid}}\\n ...attributes\\n as |options select|\\n >\\n {{yield (hash options=options select=select Options=(component \\\"hds/yield\\\" options=options select=select))}}\\n </Hds::Form::SuperSelect::Single::Base>\\n </F.Control>\\n</Hds::Form::Field>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport PowerSelectComponent from 'ember-power-select/components/power-select';\nimport { ID_PREFIX } from '../../label/index';\n\nexport default class HdsSuperSelectSingleFieldComponent extends PowerSelectComponent {\n get idPrefix() {\n return ID_PREFIX;\n }\n}\n"],"names":["HdsSuperSelectSingleFieldComponent","PowerSelectComponent","idPrefix","ID_PREFIX","setComponentTemplate","TEMPLATE"],"mappings":";;;;;AACA,eAAe,kBAAkB,CAAC,w+FAAw+F;;ACD1gG;AACA;AACA;AACA;;AAKe,MAAMA,kCAAkC,SAASC,oBAAoB,CAAC;EACnF,IAAIC,QAAQA,GAAG;AACb,IAAA,OAAOC,SAAS,CAAA;AAClB,GAAA;AACF,CAAA;AAACC,oBAAA,CAAAC,QAAA,EAJoBL,kCAAkC,CAAA;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { _ as _applyDecoratedDescriptor, b as _initializerDefineProperty } from '../../../../_rollupPluginBabelHelpers-NoJJJNhk.js';
|
|
2
2
|
import Component from '@glimmer/component';
|
|
3
3
|
import { tracked } from '@glimmer/tracking';
|
|
4
4
|
import { action } from '@ember/object';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field.js","sources":["../../../../../src/components/hds/form/text-input/field.hbs","../../../../../src/components/hds/form/text-input/field.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n Copyright (c) HashiCorp, Inc.\\n SPDX-License-Identifier: MPL-2.0\\n}}\\n<Hds::Form::Field\\n @layout=\\\"vertical\\\"\\n @extraAriaDescribedBy={{@extraAriaDescribedBy}}\\n @isRequired={{@isRequired}}\\n @isOptional={{@isOptional}}\\n @id={{@id}}\\n as |F|\\n>\\n {{! Notice: the order of the elements is not relevant here, because is controlled at \\\"Hds::Form::Field\\\" component level }}\\n {{yield\\n (hash\\n Label=F.Label\\n isRequired=F.isRequired\\n isOptional=F.isOptional\\n HelperText=F.HelperText\\n Error=F.Error\\n CharacterCount=(component F.CharacterCount value=@value)\\n )\\n }}\\n <F.Control>\\n <div class=\\\"hds-form-text-input__wrapper\\\" {{style width=@width}}>\\n <Hds::Form::TextInput::Base\\n @type={{this.type}}\\n @value={{@value}}\\n @isInvalid={{@isInvalid}}\\n @isLoading={{@isLoading}}\\n @hasVisibilityToggle={{this.showVisibilityToggle}}\\n required={{@isRequired}}\\n ...attributes\\n id={{F.id}}\\n aria-describedby={{F.ariaDescribedBy}}\\n />\\n {{#if this.showVisibilityToggle}}\\n <Hds::Form::VisibilityToggle\\n @isVisible={{this.isPasswordMasked}}\\n @ariaLabel={{this.visibilityToggleAriaLabel}}\\n @ariaMessageText={{this.visibilityToggleAriaMessageText}}\\n aria-controls={{F.id}}\\n class=\\\"hds-form-text-input__visibility-toggle\\\"\\n {{on \\\"click\\\" this.onClickTogglePasswordReadability}}\\n />\\n {{/if}}\\n </div>\\n </F.Control>\\n</Hds::Form::Field>\")","/**\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';\n\nexport default class HdsFormTextInputFieldComponent extends Component {\n @tracked isPasswordMasked = true;\n @tracked hasVisibilityToggle = this.args.hasVisibilityToggle ?? true;\n @tracked type = this.args.type ?? 'text';\n\n /**\n * @param showVisibilityToggle\n * @type {boolean}\n * @default false\n */\n get showVisibilityToggle() {\n return this.args.type === 'password' && this.hasVisibilityToggle;\n }\n\n /**\n * @param visibilityToggleAriaLabel\n * @type {string}\n * @default 'Show password'\n */\n get visibilityToggleAriaLabel() {\n if (this.args.visibilityToggleAriaLabel) {\n return this.args.visibilityToggleAriaLabel;\n } else if (this.isPasswordMasked) {\n return 'Show password';\n } else {\n return 'Hide password';\n }\n }\n\n /**\n * @param visibilityToggleAriaMessageText\n * @type {string}\n * @default 'Password is now hidden'\n */\n get visibilityToggleAriaMessageText() {\n if (this.args.visibilityToggleAriaMessageText) {\n return this.args.visibilityToggleAriaMessageText;\n } else if (this.isPasswordMasked) {\n return 'Password is hidden';\n } else {\n return 'Password is visible';\n }\n }\n\n @action\n onClickTogglePasswordReadability() {\n this.isPasswordMasked = !this.isPasswordMasked;\n this.type = this.isPasswordMasked ? 'password' : 'text';\n }\n}\n"],"names":["HdsFormTextInputFieldComponent","_class","Component","constructor","args","_initializerDefineProperty","_descriptor","_descriptor2","_descriptor3","showVisibilityToggle","type","hasVisibilityToggle","visibilityToggleAriaLabel","isPasswordMasked","visibilityToggleAriaMessageText","onClickTogglePasswordReadability","_applyDecoratedDescriptor","prototype","tracked","configurable","enumerable","writable","initializer","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"field.js","sources":["../../../../../src/components/hds/form/text-input/field.hbs","../../../../../src/components/hds/form/text-input/field.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n Copyright (c) HashiCorp, Inc.\\n SPDX-License-Identifier: MPL-2.0\\n}}\\n<Hds::Form::Field\\n @layout=\\\"vertical\\\"\\n @extraAriaDescribedBy={{@extraAriaDescribedBy}}\\n @isRequired={{@isRequired}}\\n @isOptional={{@isOptional}}\\n @id={{@id}}\\n as |F|\\n>\\n {{! Notice: the order of the elements is not relevant here, because is controlled at \\\"Hds::Form::Field\\\" component level }}\\n {{yield\\n (hash\\n Label=F.Label\\n isRequired=F.isRequired\\n isOptional=F.isOptional\\n HelperText=F.HelperText\\n Error=F.Error\\n CharacterCount=(component F.CharacterCount value=@value)\\n )\\n }}\\n <F.Control>\\n <div class=\\\"hds-form-text-input__wrapper\\\" {{style width=@width}}>\\n <Hds::Form::TextInput::Base\\n @type={{this.type}}\\n @value={{@value}}\\n @isInvalid={{@isInvalid}}\\n @isLoading={{@isLoading}}\\n @hasVisibilityToggle={{this.showVisibilityToggle}}\\n required={{@isRequired}}\\n ...attributes\\n id={{F.id}}\\n aria-describedby={{F.ariaDescribedBy}}\\n />\\n {{#if this.showVisibilityToggle}}\\n <Hds::Form::VisibilityToggle\\n @isVisible={{this.isPasswordMasked}}\\n @ariaLabel={{this.visibilityToggleAriaLabel}}\\n @ariaMessageText={{this.visibilityToggleAriaMessageText}}\\n aria-controls={{F.id}}\\n class=\\\"hds-form-text-input__visibility-toggle\\\"\\n {{on \\\"click\\\" this.onClickTogglePasswordReadability}}\\n />\\n {{/if}}\\n </div>\\n </F.Control>\\n</Hds::Form::Field>\")","/**\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';\n\nexport default class HdsFormTextInputFieldComponent extends Component {\n @tracked isPasswordMasked = true;\n @tracked hasVisibilityToggle = this.args.hasVisibilityToggle ?? true;\n @tracked type = this.args.type ?? 'text';\n\n /**\n * @param showVisibilityToggle\n * @type {boolean}\n * @default false\n */\n get showVisibilityToggle() {\n return this.args.type === 'password' && this.hasVisibilityToggle;\n }\n\n /**\n * @param visibilityToggleAriaLabel\n * @type {string}\n * @default 'Show password'\n */\n get visibilityToggleAriaLabel() {\n if (this.args.visibilityToggleAriaLabel) {\n return this.args.visibilityToggleAriaLabel;\n } else if (this.isPasswordMasked) {\n return 'Show password';\n } else {\n return 'Hide password';\n }\n }\n\n /**\n * @param visibilityToggleAriaMessageText\n * @type {string}\n * @default 'Password is now hidden'\n */\n get visibilityToggleAriaMessageText() {\n if (this.args.visibilityToggleAriaMessageText) {\n return this.args.visibilityToggleAriaMessageText;\n } else if (this.isPasswordMasked) {\n return 'Password is hidden';\n } else {\n return 'Password is visible';\n }\n }\n\n @action\n onClickTogglePasswordReadability() {\n this.isPasswordMasked = !this.isPasswordMasked;\n this.type = this.isPasswordMasked ? 'password' : 'text';\n }\n}\n"],"names":["HdsFormTextInputFieldComponent","_class","Component","constructor","args","_initializerDefineProperty","_descriptor","_descriptor2","_descriptor3","showVisibilityToggle","type","hasVisibilityToggle","visibilityToggleAriaLabel","isPasswordMasked","visibilityToggleAriaMessageText","onClickTogglePasswordReadability","_applyDecoratedDescriptor","prototype","tracked","configurable","enumerable","writable","initializer","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;AACA,eAAe,kBAAkB,CAAC,+jDAA+jD;;;ACQ5kDA,IAAAA,8BAA8B,IAAAC,MAAA,GAApC,MAAMD,8BAA8B,SAASE,SAAS,CAAC;AAAAC,EAAAA,WAAAA,CAAA,GAAAC,IAAA,EAAA;AAAA,IAAA,KAAA,CAAA,GAAAA,IAAA,CAAA,CAAA;AAAAC,IAAAA,0BAAA,2BAAAC,WAAA,EAAA,IAAA,CAAA,CAAA;AAAAD,IAAAA,0BAAA,8BAAAE,YAAA,EAAA,IAAA,CAAA,CAAA;AAAAF,IAAAA,0BAAA,eAAAG,YAAA,EAAA,IAAA,CAAA,CAAA;AAAA,GAAA;AAKpE;AACF;AACA;AACA;AACA;EACE,IAAIC,oBAAoBA,GAAG;IACzB,OAAO,IAAI,CAACL,IAAI,CAACM,IAAI,KAAK,UAAU,IAAI,IAAI,CAACC,mBAAmB,CAAA;AAClE,GAAA;;AAEA;AACF;AACA;AACA;AACA;EACE,IAAIC,yBAAyBA,GAAG;AAC9B,IAAA,IAAI,IAAI,CAACR,IAAI,CAACQ,yBAAyB,EAAE;AACvC,MAAA,OAAO,IAAI,CAACR,IAAI,CAACQ,yBAAyB,CAAA;AAC5C,KAAC,MAAM,IAAI,IAAI,CAACC,gBAAgB,EAAE;AAChC,MAAA,OAAO,eAAe,CAAA;AACxB,KAAC,MAAM;AACL,MAAA,OAAO,eAAe,CAAA;AACxB,KAAA;AACF,GAAA;;AAEA;AACF;AACA;AACA;AACA;EACE,IAAIC,+BAA+BA,GAAG;AACpC,IAAA,IAAI,IAAI,CAACV,IAAI,CAACU,+BAA+B,EAAE;AAC7C,MAAA,OAAO,IAAI,CAACV,IAAI,CAACU,+BAA+B,CAAA;AAClD,KAAC,MAAM,IAAI,IAAI,CAACD,gBAAgB,EAAE;AAChC,MAAA,OAAO,oBAAoB,CAAA;AAC7B,KAAC,MAAM;AACL,MAAA,OAAO,qBAAqB,CAAA;AAC9B,KAAA;AACF,GAAA;AAGAE,EAAAA,gCAAgCA,GAAG;AACjC,IAAA,IAAI,CAACF,gBAAgB,GAAG,CAAC,IAAI,CAACA,gBAAgB,CAAA;IAC9C,IAAI,CAACH,IAAI,GAAG,IAAI,CAACG,gBAAgB,GAAG,UAAU,GAAG,MAAM,CAAA;AACzD,GAAA;AACF,CAAC,GAAAP,WAAA,GAAAU,yBAAA,CAAAf,MAAA,CAAAgB,SAAA,EAAA,kBAAA,EAAA,CAhDEC,OAAO,CAAA,EAAA;EAAAC,YAAA,EAAA,IAAA;EAAAC,UAAA,EAAA,IAAA;EAAAC,QAAA,EAAA,IAAA;AAAAC,EAAAA,WAAA,cAAA;AAAA,IAAA,OAAoB,IAAI,CAAA;AAAA,GAAA;AAAA,CAAAf,CAAAA,EAAAA,YAAA,GAAAS,yBAAA,CAAAf,MAAA,CAAAgB,SAAA,0BAC/BC,OAAO,CAAA,EAAA;EAAAC,YAAA,EAAA,IAAA;EAAAC,UAAA,EAAA,IAAA;EAAAC,QAAA,EAAA,IAAA;AAAAC,EAAAA,WAAA,cAAA;AAAA,IAAA,OAAuB,IAAI,CAAClB,IAAI,CAACO,mBAAmB,IAAI,IAAI,CAAA;AAAA,GAAA;AAAA,CAAAH,CAAAA,EAAAA,YAAA,GAAAQ,yBAAA,CAAAf,MAAA,CAAAgB,SAAA,WACnEC,OAAO,CAAA,EAAA;EAAAC,YAAA,EAAA,IAAA;EAAAC,UAAA,EAAA,IAAA;EAAAC,QAAA,EAAA,IAAA;AAAAC,EAAAA,WAAA,cAAA;AAAA,IAAA,OAAQ,IAAI,CAAClB,IAAI,CAACM,IAAI,IAAI,MAAM,CAAA;AAAA,GAAA;AAAA,CAAAM,CAAAA,EAAAA,yBAAA,CAAAf,MAAA,CAAAgB,SAAA,EAyCvCM,kCAAAA,EAAAA,CAAAA,MAAM,GAAAC,MAAA,CAAAC,wBAAA,CAAAxB,MAAA,CAAAgB,SAAA,EAAA,kCAAA,CAAA,EAAAhB,MAAA,CAAAgB,SAAA,IAAAhB,MAAA,EAAA;AA5C0CyB,oBAAA,CAAAC,QAAA,EAA9B3B,8BAA8B,CAAA;;;;"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import Component from '@glimmer/component';
|
|
2
2
|
import { assert } from '@ember/debug';
|
|
3
|
+
import { HdsIconTileColorNeutral, HdsIconTileProductValues, HdsIconTileSizeValues } from './types.js';
|
|
3
4
|
import { precompileTemplate } from '@ember/template-compilation';
|
|
4
5
|
import { setComponentTemplate } from '@ember/component';
|
|
5
6
|
|
|
6
|
-
var TEMPLATE = precompileTemplate("{{
|
|
7
|
+
var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n<div class={{this.classNames}} aria-hidden=\"true\" ...attributes>\n {{#if @icon}}\n <div class=\"hds-icon-tile__icon\">\n <FlightIcon @name={{this.icon}} @size={{this.iconSize}} @stretched={{true}} />\n </div>\n {{/if}}\n {{#if @logo}}\n <div class=\"hds-icon-tile__logo\">\n <FlightIcon @name={{this.icon}} @size={{this.iconSize}} @stretched={{true}} />\n </div>\n {{/if}}\n {{#if this.iconSecondary}}\n <div class=\"hds-icon-tile__extra\">\n <div class=\"hds-icon-tile__extra-icon\">\n <FlightIcon @name={{this.iconSecondary}} @size=\"16\" @stretched={{true}} />\n </div>\n </div>\n {{/if}}\n</div>");
|
|
7
8
|
|
|
8
9
|
/**
|
|
9
10
|
* Copyright (c) HashiCorp, Inc.
|
|
@@ -12,10 +13,13 @@ var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\
|
|
|
12
13
|
|
|
13
14
|
const DEFAULT_SIZE = 'medium';
|
|
14
15
|
const DEFAULT_COLOR = 'neutral';
|
|
15
|
-
const SIZES =
|
|
16
|
-
const
|
|
17
|
-
|
|
18
|
-
|
|
16
|
+
const SIZES = Object.values(HdsIconTileSizeValues);
|
|
17
|
+
const COLORS = Object.values({
|
|
18
|
+
...HdsIconTileColorNeutral,
|
|
19
|
+
...HdsIconTileProductValues
|
|
20
|
+
});
|
|
21
|
+
const PRODUCTS = Object.values(HdsIconTileProductValues);
|
|
22
|
+
class HdsIconTileComponent extends Component {
|
|
19
23
|
/**
|
|
20
24
|
* Sets the size for the component
|
|
21
25
|
* Accepted values: small, medium, large
|
|
@@ -25,7 +29,7 @@ class HdsIconTileIndexComponent extends Component {
|
|
|
25
29
|
* @default 'medium'
|
|
26
30
|
*/
|
|
27
31
|
get size() {
|
|
28
|
-
|
|
32
|
+
const {
|
|
29
33
|
size = DEFAULT_SIZE
|
|
30
34
|
} = this.args;
|
|
31
35
|
assert(`@size for "Hds::IconTile" must be one of the following: ${SIZES.join(', ')}; received: ${size}`, SIZES.includes(size));
|
|
@@ -68,7 +72,7 @@ class HdsIconTileIndexComponent extends Component {
|
|
|
68
72
|
} else if (this.args.icon) {
|
|
69
73
|
return this.args.icon;
|
|
70
74
|
} else {
|
|
71
|
-
return
|
|
75
|
+
return undefined;
|
|
72
76
|
}
|
|
73
77
|
}
|
|
74
78
|
|
|
@@ -94,7 +98,7 @@ class HdsIconTileIndexComponent extends Component {
|
|
|
94
98
|
* @default null
|
|
95
99
|
*/
|
|
96
100
|
get logo() {
|
|
97
|
-
|
|
101
|
+
const {
|
|
98
102
|
logo
|
|
99
103
|
} = this.args;
|
|
100
104
|
if (logo) {
|
|
@@ -139,7 +143,7 @@ class HdsIconTileIndexComponent extends Component {
|
|
|
139
143
|
*/
|
|
140
144
|
// hds-icon-tile {{this.entityClass}} {{this.sizeClass}} {{this.colorClass}}"
|
|
141
145
|
get classNames() {
|
|
142
|
-
|
|
146
|
+
const classes = ['hds-icon-tile'];
|
|
143
147
|
|
|
144
148
|
// add a class based on its entity argument
|
|
145
149
|
classes.push(`hds-icon-tile--${this.entity}`);
|
|
@@ -152,7 +156,7 @@ class HdsIconTileIndexComponent extends Component {
|
|
|
152
156
|
return classes.join(' ');
|
|
153
157
|
}
|
|
154
158
|
}
|
|
155
|
-
setComponentTemplate(TEMPLATE,
|
|
159
|
+
setComponentTemplate(TEMPLATE, HdsIconTileComponent);
|
|
156
160
|
|
|
157
|
-
export { COLORS, DEFAULT_COLOR, DEFAULT_SIZE, PRODUCTS, SIZES,
|
|
161
|
+
export { COLORS, DEFAULT_COLOR, DEFAULT_SIZE, PRODUCTS, SIZES, HdsIconTileComponent as default };
|
|
158
162
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/hds/icon-tile/index.hbs","../../../../src/components/hds/icon-tile/index.
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/hds/icon-tile/index.hbs","../../../../src/components/hds/icon-tile/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<div class={{this.classNames}} aria-hidden=\\\"true\\\" ...attributes>\\n {{#if @icon}}\\n <div class=\\\"hds-icon-tile__icon\\\">\\n <FlightIcon @name={{this.icon}} @size={{this.iconSize}} @stretched={{true}} />\\n </div>\\n {{/if}}\\n {{#if @logo}}\\n <div class=\\\"hds-icon-tile__logo\\\">\\n <FlightIcon @name={{this.icon}} @size={{this.iconSize}} @stretched={{true}} />\\n </div>\\n {{/if}}\\n {{#if this.iconSecondary}}\\n <div class=\\\"hds-icon-tile__extra\\\">\\n <div class=\\\"hds-icon-tile__extra-icon\\\">\\n <FlightIcon @name={{this.iconSecondary}} @size=\\\"16\\\" @stretched={{true}} />\\n </div>\\n </div>\\n {{/if}}\\n</div>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\n\nimport {\n HdsIconTileColorNeutral,\n HdsIconTileProductValues,\n HdsIconTileSizeValues,\n} from './types.ts';\n\nimport type {\n HdsIconTileColors,\n HdsIconTileProducts,\n HdsIconTileSizes,\n} from './types.ts';\n\nexport const DEFAULT_SIZE = 'medium';\nexport const DEFAULT_COLOR = 'neutral';\nexport const SIZES: string[] = Object.values(HdsIconTileSizeValues);\nexport const COLORS: string[] = Object.values({\n ...HdsIconTileColorNeutral,\n ...HdsIconTileProductValues,\n});\nexport const PRODUCTS: string[] = Object.values(HdsIconTileProductValues);\n\nexport interface HdsIconTileSignature {\n Args: {\n size?: HdsIconTileSizes;\n color?: HdsIconTileColors;\n logo?: HdsIconTileProducts;\n icon?: string | null;\n iconSecondary?: string;\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsIconTileComponent extends Component<HdsIconTileSignature> {\n /**\n * Sets the size for the component\n * Accepted values: small, medium, large\n *\n * @param size\n * @type {string}\n * @default 'medium'\n */\n get size() {\n const { size = DEFAULT_SIZE } = this.args;\n\n assert(\n `@size for \"Hds::IconTile\" must be one of the following: ${SIZES.join(\n ', '\n )}; received: ${size}`,\n SIZES.includes(size)\n );\n\n return size;\n }\n\n /**\n * Sets the color scheme for the component\n * Accepted values: see THE COLORS LIST\n *\n * @param color\n * @type {string}\n * @default 'neutral'\n */\n get color() {\n let { color = DEFAULT_COLOR } = this.args;\n\n // if it's a \"logo\" then we overwrite any @color parameter passed\n // and just use the product \"brand\" color\n if (this.logo) {\n color = this.logo;\n }\n\n assert(\n `@color for \"Hds::IconTile\" must be one of the following: ${COLORS.join(\n ', '\n )}; received: ${color}`,\n COLORS.includes(color)\n );\n\n return color;\n }\n\n /**\n * Sets the icon name (one of the FlightIcons)\n *\n * @param icon\n * @type {string|null}\n * @default null\n */\n get icon() {\n if (this.args.logo) {\n // for the logo version we use the colored versions directly\n return `${this.args.logo}-color`;\n } else if (this.args.icon) {\n return this.args.icon;\n } else {\n return undefined;\n }\n }\n\n /**\n * @param iconSize\n * @type {string}\n * @default 16\n * @description ensures that the correct icon size is used. Automatically calculated.\n */\n get iconSize() {\n if (this.args.size === 'small') {\n return '16';\n } else {\n return '24';\n }\n }\n\n /**\n * Sets the logo name if there is one\n *\n * @param logo\n * @type {string|null}\n * @default null\n */\n get logo() {\n const { logo } = this.args;\n\n if (logo) {\n assert(\n `@logo for \"Hds::IconTile\" must be one of the following: ${PRODUCTS.join(\n ', '\n )}; received: ${logo}`,\n PRODUCTS.includes(logo)\n );\n }\n\n return logo ?? null;\n }\n\n /**\n * We need to differentiate between a logo and an icon\n * @method IconTile#entity\n * @return {string} The kind of entity we're dealing with (\"logo\" or \"icon\")\n */\n get entity() {\n let entity;\n\n assert(\n `you can't pass both @logo and @icon properties to the \"Hds::IconTile\" component`,\n !(this.args.logo && this.args.icon)\n );\n\n assert(\n `you need to pass @logo or @icon to the \"Hds::IconTile\" component`,\n !(this.args.logo === undefined && this.args.icon === undefined)\n );\n\n if (this.args.logo) {\n entity = 'logo';\n }\n if (this.args.icon) {\n entity = 'icon';\n }\n\n return entity;\n }\n\n /**\n * Sets the \"secondary\" icon name (one of the FlightIcons)\n *\n * @param iconSecondary\n * @type {string|null}\n * @default null\n */\n get iconSecondary() {\n return this.args.iconSecondary ?? null;\n }\n\n /**\n * Get the class names to apply to the component.\n * @method IconTile#classNames\n * @return {string} The \"class\" attribute to apply to the component.\n */\n // hds-icon-tile {{this.entityClass}} {{this.sizeClass}} {{this.colorClass}}\"\n get classNames() {\n const classes = ['hds-icon-tile'];\n\n // add a class based on its entity argument\n classes.push(`hds-icon-tile--${this.entity}`);\n\n // add a class based on the @size argument\n classes.push(`hds-icon-tile--size-${this.size}`);\n\n // add a class based on the @color argument\n classes.push(`hds-icon-tile--color-${this.color}`);\n\n return classes.join(' ');\n }\n}\n"],"names":["DEFAULT_SIZE","DEFAULT_COLOR","SIZES","Object","values","HdsIconTileSizeValues","COLORS","HdsIconTileColorNeutral","HdsIconTileProductValues","PRODUCTS","HdsIconTileComponent","Component","size","args","assert","join","includes","color","logo","icon","undefined","iconSize","entity","iconSecondary","classNames","classes","push","setComponentTemplate","TEMPLATE"],"mappings":"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"}
|