@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.
Files changed (221) hide show
  1. package/dist/_app_/components/hds/form/super-select/after-options.js +1 -0
  2. package/dist/_app_/components/hds/form/super-select/multiple/base.js +1 -0
  3. package/dist/_app_/components/hds/form/super-select/multiple/field.js +1 -0
  4. package/dist/_app_/components/hds/form/super-select/option-group.js +1 -0
  5. package/dist/_app_/components/hds/form/super-select/placeholder.js +1 -0
  6. package/dist/_app_/components/hds/form/super-select/single/base.js +1 -0
  7. package/dist/_app_/components/hds/form/super-select/single/field.js +1 -0
  8. package/dist/_app_/components/hds/{link/types.js → popover-primitive/index.js} +1 -1
  9. package/dist/_app_/components/hds/{card/types.js → rich-tooltip/bubble.js} +1 -1
  10. package/dist/_app_/components/hds/{alert/types.js → rich-tooltip/index.js} +1 -1
  11. package/dist/_app_/components/hds/{interactive/types.js → rich-tooltip/toggle.js} +1 -1
  12. package/dist/_app_/modifiers/hds-anchored-position.js +1 -0
  13. package/dist/_app_/modifiers/hds-register-event.js +1 -0
  14. package/dist/{_rollupPluginBabelHelpers-lqPQKyNs.js → _rollupPluginBabelHelpers-NoJJJNhk.js} +7 -9
  15. package/dist/{_rollupPluginBabelHelpers-lqPQKyNs.js.map → _rollupPluginBabelHelpers-NoJJJNhk.js.map} +1 -1
  16. package/dist/components/hds/accordion/index.js +8 -2
  17. package/dist/components/hds/accordion/index.js.map +1 -1
  18. package/dist/components/hds/accordion/item/button.js +12 -8
  19. package/dist/components/hds/accordion/item/button.js.map +1 -1
  20. package/dist/components/hds/accordion/item/index.js +6 -6
  21. package/dist/components/hds/accordion/item/index.js.map +1 -1
  22. package/dist/components/hds/alert/description.js +9 -4
  23. package/dist/components/hds/alert/description.js.map +1 -1
  24. package/dist/components/hds/alert/index.js +4 -6
  25. package/dist/components/hds/alert/index.js.map +1 -1
  26. package/dist/components/hds/alert/title.js +9 -4
  27. package/dist/components/hds/alert/title.js.map +1 -1
  28. package/dist/components/hds/alert/types.js +5 -0
  29. package/dist/components/hds/alert/types.js.map +1 -1
  30. package/dist/components/hds/app-footer/copyright.js +1 -1
  31. package/dist/components/hds/app-footer/copyright.js.map +1 -1
  32. package/dist/components/hds/app-footer/index.js +6 -6
  33. package/dist/components/hds/app-footer/index.js.map +1 -1
  34. package/dist/components/hds/app-footer/item.js +10 -4
  35. package/dist/components/hds/app-footer/item.js.map +1 -1
  36. package/dist/components/hds/app-footer/legal-links.js +1 -1
  37. package/dist/components/hds/app-footer/legal-links.js.map +1 -1
  38. package/dist/components/hds/app-footer/link.js +10 -4
  39. package/dist/components/hds/app-footer/link.js.map +1 -1
  40. package/dist/components/hds/app-footer/status-link.js +12 -27
  41. package/dist/components/hds/app-footer/status-link.js.map +1 -1
  42. package/dist/components/hds/app-footer/types.js +38 -0
  43. package/dist/components/hds/app-footer/types.js.map +1 -0
  44. package/dist/components/hds/app-frame/index.js +4 -4
  45. package/dist/components/hds/app-frame/index.js.map +1 -1
  46. package/dist/components/hds/app-frame/parts/footer.js +10 -4
  47. package/dist/components/hds/app-frame/parts/footer.js.map +1 -1
  48. package/dist/components/hds/app-frame/parts/header.js +10 -4
  49. package/dist/components/hds/app-frame/parts/header.js.map +1 -1
  50. package/dist/components/hds/app-frame/parts/main.js +10 -4
  51. package/dist/components/hds/app-frame/parts/main.js.map +1 -1
  52. package/dist/components/hds/app-frame/parts/modals.js +10 -4
  53. package/dist/components/hds/app-frame/parts/modals.js.map +1 -1
  54. package/dist/components/hds/app-frame/parts/sidebar.js +10 -4
  55. package/dist/components/hds/app-frame/parts/sidebar.js.map +1 -1
  56. package/dist/components/hds/badge/index.js +19 -18
  57. package/dist/components/hds/badge/index.js.map +1 -1
  58. package/dist/components/hds/badge/types.js +29 -0
  59. package/dist/components/hds/badge/types.js.map +1 -0
  60. package/dist/components/hds/badge-count/index.js +15 -14
  61. package/dist/components/hds/badge-count/index.js.map +1 -1
  62. package/dist/components/hds/badge-count/types.js +25 -0
  63. package/dist/components/hds/badge-count/types.js.map +1 -0
  64. package/dist/components/hds/button/index.js +3 -3
  65. package/dist/components/hds/button/index.js.map +1 -1
  66. package/dist/components/hds/button-set/index.js +8 -2
  67. package/dist/components/hds/button-set/index.js.map +1 -1
  68. package/dist/components/hds/card/container.js.map +1 -1
  69. package/dist/components/hds/card/types.js +5 -0
  70. package/dist/components/hds/card/types.js.map +1 -1
  71. package/dist/components/hds/code-block/index.js +1 -1
  72. package/dist/components/hds/code-block/index.js.map +1 -1
  73. package/dist/components/hds/copy/button/index.js +1 -1
  74. package/dist/components/hds/copy/button/index.js.map +1 -1
  75. package/dist/components/hds/copy/snippet/index.js +1 -1
  76. package/dist/components/hds/copy/snippet/index.js.map +1 -1
  77. package/dist/components/hds/disclosure-primitive/index.js +2 -2
  78. package/dist/components/hds/disclosure-primitive/index.js.map +1 -1
  79. package/dist/components/hds/dismiss-button/index.js +3 -3
  80. package/dist/components/hds/dismiss-button/index.js.map +1 -1
  81. package/dist/components/hds/dropdown/index.js +1 -1
  82. package/dist/components/hds/dropdown/index.js.map +1 -1
  83. package/dist/components/hds/dropdown/list-item/checkmark.js +1 -1
  84. package/dist/components/hds/dropdown/list-item/checkmark.js.map +1 -1
  85. package/dist/components/hds/dropdown/list-item/interactive.js +1 -1
  86. package/dist/components/hds/dropdown/list-item/interactive.js.map +1 -1
  87. package/dist/components/hds/dropdown/toggle/button.js +1 -1
  88. package/dist/components/hds/dropdown/toggle/icon.js +1 -1
  89. package/dist/components/hds/dropdown/toggle/icon.js.map +1 -1
  90. package/dist/components/hds/flyout/index.js +1 -1
  91. package/dist/components/hds/flyout/index.js.map +1 -1
  92. package/dist/components/hds/form/field/index.js +1 -1
  93. package/dist/components/hds/form/field/index.js.map +1 -1
  94. package/dist/components/hds/form/fieldset/index.js +1 -1
  95. package/dist/components/hds/form/fieldset/index.js.map +1 -1
  96. package/dist/components/hds/form/label/index.js +18 -2
  97. package/dist/components/hds/form/label/index.js.map +1 -1
  98. package/dist/components/hds/form/masked-input/base.js +1 -1
  99. package/dist/components/hds/form/masked-input/base.js.map +1 -1
  100. package/dist/components/hds/form/radio-card/index.js +1 -1
  101. package/dist/components/hds/form/radio-card/index.js.map +1 -1
  102. package/dist/components/hds/form/super-select/after-options.js +10 -0
  103. package/dist/components/hds/form/super-select/after-options.js.map +1 -0
  104. package/dist/components/hds/form/super-select/multiple/base.js +159 -0
  105. package/dist/components/hds/form/super-select/multiple/base.js.map +1 -0
  106. package/dist/components/hds/form/super-select/multiple/field.js +21 -0
  107. package/dist/components/hds/form/super-select/multiple/field.js.map +1 -0
  108. package/dist/components/hds/form/super-select/option-group.js +22 -0
  109. package/dist/components/hds/form/super-select/option-group.js.map +1 -0
  110. package/dist/components/hds/form/super-select/placeholder.js +10 -0
  111. package/dist/components/hds/form/super-select/placeholder.js.map +1 -0
  112. package/dist/components/hds/form/super-select/single/base.js +86 -0
  113. package/dist/components/hds/form/super-select/single/base.js.map +1 -0
  114. package/dist/components/hds/form/super-select/single/field.js +21 -0
  115. package/dist/components/hds/form/super-select/single/field.js.map +1 -0
  116. package/dist/components/hds/form/text-input/field.js +1 -1
  117. package/dist/components/hds/form/text-input/field.js.map +1 -1
  118. package/dist/components/hds/icon-tile/index.js +15 -11
  119. package/dist/components/hds/icon-tile/index.js.map +1 -1
  120. package/dist/components/hds/icon-tile/types.js +32 -0
  121. package/dist/components/hds/icon-tile/types.js.map +1 -0
  122. package/dist/components/hds/interactive/index.js +4 -4
  123. package/dist/components/hds/interactive/index.js.map +1 -1
  124. package/dist/components/hds/link/inline.js.map +1 -1
  125. package/dist/components/hds/link/standalone.js.map +1 -1
  126. package/dist/components/hds/link/types.js +5 -0
  127. package/dist/components/hds/link/types.js.map +1 -1
  128. package/dist/components/hds/menu-primitive/index.js +1 -1
  129. package/dist/components/hds/menu-primitive/index.js.map +1 -1
  130. package/dist/components/hds/modal/index.js +1 -1
  131. package/dist/components/hds/modal/index.js.map +1 -1
  132. package/dist/components/hds/pagination/compact/index.js +1 -1
  133. package/dist/components/hds/pagination/compact/index.js.map +1 -1
  134. package/dist/components/hds/pagination/nav/arrow.js +1 -1
  135. package/dist/components/hds/pagination/nav/arrow.js.map +1 -1
  136. package/dist/components/hds/pagination/nav/number.js +1 -1
  137. package/dist/components/hds/pagination/nav/number.js.map +1 -1
  138. package/dist/components/hds/pagination/numbered/index.js +1 -1
  139. package/dist/components/hds/pagination/numbered/index.js.map +1 -1
  140. package/dist/components/hds/pagination/size-selector/index.js +1 -1
  141. package/dist/components/hds/pagination/size-selector/index.js.map +1 -1
  142. package/dist/components/hds/popover-primitive/index.js +238 -0
  143. package/dist/components/hds/popover-primitive/index.js.map +1 -0
  144. package/dist/components/hds/reveal/index.js +21 -17
  145. package/dist/components/hds/reveal/index.js.map +1 -1
  146. package/dist/components/hds/reveal/toggle/button.js +5 -5
  147. package/dist/components/hds/reveal/toggle/button.js.map +1 -1
  148. package/dist/components/hds/rich-tooltip/bubble.js +60 -0
  149. package/dist/components/hds/rich-tooltip/bubble.js.map +1 -0
  150. package/dist/components/hds/rich-tooltip/index.js +26 -0
  151. package/dist/components/hds/rich-tooltip/index.js.map +1 -0
  152. package/dist/components/hds/rich-tooltip/toggle.js +85 -0
  153. package/dist/components/hds/rich-tooltip/toggle.js.map +1 -0
  154. package/dist/components/hds/separator/index.js +9 -8
  155. package/dist/components/hds/separator/index.js.map +1 -1
  156. package/dist/components/hds/separator/types.js +13 -0
  157. package/dist/components/hds/separator/types.js.map +1 -0
  158. package/dist/components/hds/side-nav/index.js +1 -1
  159. package/dist/components/hds/side-nav/index.js.map +1 -1
  160. package/dist/components/hds/side-nav/portal/target.js +1 -1
  161. package/dist/components/hds/side-nav/portal/target.js.map +1 -1
  162. package/dist/components/hds/stepper/step/indicator.js +9 -8
  163. package/dist/components/hds/stepper/step/indicator.js.map +1 -1
  164. package/dist/components/hds/stepper/task/indicator.js +10 -14
  165. package/dist/components/hds/stepper/task/indicator.js.map +1 -1
  166. package/dist/components/hds/stepper/types.js +21 -0
  167. package/dist/components/hds/stepper/types.js.map +1 -0
  168. package/dist/components/hds/table/index.js +1 -1
  169. package/dist/components/hds/table/index.js.map +1 -1
  170. package/dist/components/hds/table/th-button-sort.js +1 -1
  171. package/dist/components/hds/table/th-button-tooltip.js +1 -1
  172. package/dist/components/hds/table/th-selectable.js +1 -1
  173. package/dist/components/hds/table/th-selectable.js.map +1 -1
  174. package/dist/components/hds/table/th-sort.js +1 -1
  175. package/dist/components/hds/table/th.js +1 -1
  176. package/dist/components/hds/tabs/index.js +1 -1
  177. package/dist/components/hds/tabs/index.js.map +1 -1
  178. package/dist/components/hds/tabs/panel.js +1 -1
  179. package/dist/components/hds/tabs/panel.js.map +1 -1
  180. package/dist/components/hds/tabs/tab.js +1 -1
  181. package/dist/components/hds/tabs/tab.js.map +1 -1
  182. package/dist/components/hds/tag/index.js +11 -10
  183. package/dist/components/hds/tag/index.js.map +1 -1
  184. package/dist/components/hds/tag/types.js +13 -0
  185. package/dist/components/hds/tag/types.js.map +1 -0
  186. package/dist/components/hds/text/body.js.map +1 -1
  187. package/dist/components/hds/text/code.js.map +1 -1
  188. package/dist/components/hds/text/display.js.map +1 -1
  189. package/dist/components/hds/text/index.js +3 -3
  190. package/dist/components/hds/text/index.js.map +1 -1
  191. package/dist/components/hds/toast/index.js +8 -2
  192. package/dist/components/hds/toast/index.js.map +1 -1
  193. package/dist/components/hds/yield/index.js +4 -4
  194. package/dist/components/hds/yield/index.js.map +1 -1
  195. package/dist/modifiers/hds-anchored-position.js +175 -0
  196. package/dist/modifiers/hds-anchored-position.js.map +1 -0
  197. package/dist/modifiers/hds-register-event.js +40 -0
  198. package/dist/modifiers/hds-register-event.js.map +1 -0
  199. package/dist/modifiers/hds-tooltip.js +10 -14
  200. package/dist/modifiers/hds-tooltip.js.map +1 -1
  201. package/dist/styles/@hashicorp/design-system-components.css +565 -3
  202. package/dist/styles/@hashicorp/design-system-components.scss +1 -0
  203. package/dist/styles/@hashicorp/design-system-power-select-overrides.scss +0 -1
  204. package/dist/styles/components/code-block/theme.scss +1 -1
  205. package/dist/styles/components/dropdown.scss +7 -0
  206. package/dist/styles/components/form/index.scss +1 -0
  207. package/dist/styles/components/form/select.scss +0 -1
  208. package/dist/styles/components/form/super-select.scss +515 -0
  209. package/dist/styles/components/form/text-input.scss +0 -1
  210. package/dist/styles/components/form/textarea.scss +0 -1
  211. package/dist/styles/components/page-header.scss +1 -0
  212. package/dist/styles/components/rich-tooltip.scss +247 -0
  213. package/dist/styles/components/tabs.scss +2 -1
  214. package/dist/styles/components/tooltip.scss +1 -1
  215. package/package.json +54 -28
  216. package/dist/_app_/components/hds/text/types.js +0 -1
  217. package/dist/_app_/components/hds/yield/types.js +0 -1
  218. package/dist/components/hds/interactive/types.js +0 -2
  219. package/dist/components/hds/interactive/types.js.map +0 -1
  220. package/dist/components/hds/yield/types.js +0 -2
  221. 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":"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"}
@@ -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 { a as _applyDecoratedDescriptor, b as _initializerDefineProperty } from '../../../../_rollupPluginBabelHelpers-lqPQKyNs.js';
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":"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"}
@@ -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("{{! @glint-nocheck: not typesafe yet }}\n{{!\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
+ 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 = ['small', 'medium', 'large'];
16
- const PRODUCTS = ['boundary', 'consul', 'hcp', 'nomad', 'packer', 'terraform', 'vagrant', 'vault', 'vault-secrets', 'vault-radar', 'waypoint'];
17
- const COLORS = ['neutral', ...PRODUCTS];
18
- class HdsIconTileIndexComponent extends Component {
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
- let {
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 null;
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
- let {
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
- let classes = ['hds-icon-tile'];
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, HdsIconTileIndexComponent);
159
+ setComponentTemplate(TEMPLATE, HdsIconTileComponent);
156
160
 
157
- export { COLORS, DEFAULT_COLOR, DEFAULT_SIZE, PRODUCTS, SIZES, HdsIconTileIndexComponent as default };
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.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<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\nexport const DEFAULT_SIZE = 'medium';\nexport const DEFAULT_COLOR = 'neutral';\nexport const SIZES = ['small', 'medium', 'large'];\nexport const PRODUCTS = [\n 'boundary',\n 'consul',\n 'hcp',\n 'nomad',\n 'packer',\n 'terraform',\n 'vagrant',\n 'vault',\n 'vault-secrets',\n 'vault-radar',\n 'waypoint',\n];\nexport const COLORS = ['neutral', ...PRODUCTS];\n\nexport default class HdsIconTileIndexComponent extends Component {\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 let { 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 null;\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 let { 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 let 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","PRODUCTS","COLORS","HdsIconTileIndexComponent","Component","size","args","assert","join","includes","color","logo","icon","iconSize","entity","undefined","iconSecondary","classNames","classes","push","setComponentTemplate","TEMPLATE"],"mappings":"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"}
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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"}