@aurodesignsystem-dev/auro-formkit 0.0.0-pr1379.0 → 0.0.0-pr1379.10

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 (226) hide show
  1. package/CHANGELOG.md +2 -2
  2. package/README.md +87 -113
  3. package/components/combobox/demo/keyboardBehavior.html +81 -0
  4. package/components/counter/demo/keyboardBehavior.html +81 -0
  5. package/components/datepicker/demo/keyboard-behavior.html +81 -0
  6. package/components/dropdown/demo/keyboardBehavior.html +81 -0
  7. package/components/select/demo/keyboardBehavior.html +81 -0
  8. package/package.json +64 -53
  9. package/components/bibtemplate/dist/auro-bibtemplate.d.ts +0 -66
  10. package/components/bibtemplate/dist/buttonVersion.d.ts +0 -2
  11. package/components/bibtemplate/dist/headerVersion.d.ts +0 -2
  12. package/components/bibtemplate/dist/iconVersion.d.ts +0 -2
  13. package/components/bibtemplate/dist/index.d.ts +0 -2
  14. package/components/bibtemplate/dist/index.js +0 -395
  15. package/components/bibtemplate/dist/registered.js +0 -395
  16. package/components/bibtemplate/dist/styles/color-css.d.ts +0 -2
  17. package/components/bibtemplate/dist/styles/style-css.d.ts +0 -2
  18. package/components/bibtemplate/dist/styles/tokens-css.d.ts +0 -2
  19. package/components/checkbox/demo/api.md +0 -489
  20. package/components/checkbox/demo/api.min.js +0 -2133
  21. package/components/checkbox/demo/index.md +0 -55
  22. package/components/checkbox/demo/index.min.js +0 -2108
  23. package/components/checkbox/demo/readme.md +0 -142
  24. package/components/checkbox/dist/auro-checkbox-group.d.ts +0 -176
  25. package/components/checkbox/dist/auro-checkbox.d.ts +0 -209
  26. package/components/checkbox/dist/index.d.ts +0 -3
  27. package/components/checkbox/dist/index.js +0 -2057
  28. package/components/checkbox/dist/registered.js +0 -2058
  29. package/components/checkbox/dist/styles/auro-checkbox-css.d.ts +0 -2
  30. package/components/checkbox/dist/styles/auro-checkbox-group-css.d.ts +0 -2
  31. package/components/checkbox/dist/styles/color-css.d.ts +0 -2
  32. package/components/checkbox/dist/styles/colorGroup-css.d.ts +0 -2
  33. package/components/checkbox/dist/styles/tokens-css.d.ts +0 -2
  34. package/components/combobox/demo/api.md +0 -2287
  35. package/components/combobox/demo/api.min.js +0 -17549
  36. package/components/combobox/demo/index.md +0 -196
  37. package/components/combobox/demo/index.min.js +0 -17454
  38. package/components/combobox/demo/readme.md +0 -158
  39. package/components/combobox/dist/auro-combobox.d.ts +0 -552
  40. package/components/combobox/dist/comboboxKeyboardStrategy.d.ts +0 -6
  41. package/components/combobox/dist/index.d.ts +0 -2
  42. package/components/combobox/dist/index.js +0 -15474
  43. package/components/combobox/dist/registered.js +0 -15476
  44. package/components/combobox/dist/styles/emphasized/style-css.d.ts +0 -2
  45. package/components/combobox/dist/styles/snowflake/style-css.d.ts +0 -2
  46. package/components/combobox/dist/styles/style-css.d.ts +0 -2
  47. package/components/counter/demo/api.md +0 -1285
  48. package/components/counter/demo/api.min.js +0 -7993
  49. package/components/counter/demo/index.md +0 -92
  50. package/components/counter/demo/index.min.js +0 -7974
  51. package/components/counter/demo/readme.md +0 -161
  52. package/components/counter/dist/auro-counter-button.d.ts +0 -14
  53. package/components/counter/dist/auro-counter-group.d.ts +0 -390
  54. package/components/counter/dist/auro-counter-wrapper.d.ts +0 -17
  55. package/components/counter/dist/auro-counter.d.ts +0 -126
  56. package/components/counter/dist/buttonVersion.d.ts +0 -2
  57. package/components/counter/dist/iconVersion.d.ts +0 -2
  58. package/components/counter/dist/index.d.ts +0 -3
  59. package/components/counter/dist/index.js +0 -7896
  60. package/components/counter/dist/registered.js +0 -7897
  61. package/components/counter/dist/styles/color-css.d.ts +0 -2
  62. package/components/counter/dist/styles/counter-button-color-css.d.ts +0 -2
  63. package/components/counter/dist/styles/counter-button-css.d.ts +0 -2
  64. package/components/counter/dist/styles/counter-group-css.d.ts +0 -2
  65. package/components/counter/dist/styles/counter-wrapper-color-css.d.ts +0 -2
  66. package/components/counter/dist/styles/counter-wrapper-css.d.ts +0 -2
  67. package/components/counter/dist/styles/shapeSize-css.d.ts +0 -2
  68. package/components/counter/dist/styles/style-css.d.ts +0 -2
  69. package/components/counter/dist/styles/tokens-css.d.ts +0 -2
  70. package/components/datepicker/demo/api.md +0 -1824
  71. package/components/datepicker/demo/api.min.js +0 -24530
  72. package/components/datepicker/demo/index.md +0 -158
  73. package/components/datepicker/demo/index.min.js +0 -24251
  74. package/components/datepicker/demo/readme.md +0 -137
  75. package/components/datepicker/dist/auro-calendar-cell.d.ts +0 -169
  76. package/components/datepicker/dist/auro-calendar-month.d.ts +0 -20
  77. package/components/datepicker/dist/auro-calendar.d.ts +0 -173
  78. package/components/datepicker/dist/auro-datepicker.d.ts +0 -722
  79. package/components/datepicker/dist/buttonVersion.d.ts +0 -2
  80. package/components/datepicker/dist/iconVersion.d.ts +0 -2
  81. package/components/datepicker/dist/index.d.ts +0 -2
  82. package/components/datepicker/dist/index.js +0 -24166
  83. package/components/datepicker/dist/popoverVersion.d.ts +0 -2
  84. package/components/datepicker/dist/registered.js +0 -24166
  85. package/components/datepicker/dist/styles/classic/color-css.d.ts +0 -2
  86. package/components/datepicker/dist/styles/classic/style-css.d.ts +0 -2
  87. package/components/datepicker/dist/styles/color-calendar-css.d.ts +0 -2
  88. package/components/datepicker/dist/styles/color-cell-css.d.ts +0 -2
  89. package/components/datepicker/dist/styles/color-css.d.ts +0 -2
  90. package/components/datepicker/dist/styles/color-month-css.d.ts +0 -2
  91. package/components/datepicker/dist/styles/shapeSize-css.d.ts +0 -2
  92. package/components/datepicker/dist/styles/snowflake/color-css.d.ts +0 -2
  93. package/components/datepicker/dist/styles/snowflake/style-css.d.ts +0 -2
  94. package/components/datepicker/dist/styles/style-auro-calendar-cell-css.d.ts +0 -2
  95. package/components/datepicker/dist/styles/style-auro-calendar-css.d.ts +0 -2
  96. package/components/datepicker/dist/styles/style-auro-calendar-month-css.d.ts +0 -2
  97. package/components/datepicker/dist/styles/style-css.d.ts +0 -2
  98. package/components/datepicker/dist/styles/tokens-css.d.ts +0 -2
  99. package/components/datepicker/dist/utilities.d.ts +0 -78
  100. package/components/datepicker/dist/utilitiesCalendar.d.ts +0 -38
  101. package/components/datepicker/dist/utilitiesCalendarRender.d.ts +0 -50
  102. package/components/datepicker/dist/vendor/wc-range-datepicker/day.d.ts +0 -5
  103. package/components/datepicker/dist/vendor/wc-range-datepicker/range-datepicker-calendar.d.ts +0 -60
  104. package/components/datepicker/dist/vendor/wc-range-datepicker/range-datepicker-cell.d.ts +0 -1
  105. package/components/datepicker/dist/vendor/wc-range-datepicker/range-datepicker.d.ts +0 -57
  106. package/components/dropdown/demo/api.md +0 -1358
  107. package/components/dropdown/demo/api.min.js +0 -4853
  108. package/components/dropdown/demo/index.md +0 -283
  109. package/components/dropdown/demo/index.min.js +0 -4788
  110. package/components/dropdown/demo/readme.md +0 -160
  111. package/components/dropdown/dist/auro-dropdown.d.ts +0 -482
  112. package/components/dropdown/dist/auro-dropdownBib.d.ts +0 -155
  113. package/components/dropdown/dist/iconVersion.d.ts +0 -2
  114. package/components/dropdown/dist/index.d.ts +0 -2
  115. package/components/dropdown/dist/index.js +0 -4685
  116. package/components/dropdown/dist/keyboardUtils.d.ts +0 -18
  117. package/components/dropdown/dist/registered.js +0 -4685
  118. package/components/dropdown/dist/styles/classic/bibColors-css.d.ts +0 -2
  119. package/components/dropdown/dist/styles/classic/bibStyles-css.d.ts +0 -2
  120. package/components/dropdown/dist/styles/classic/color-css.d.ts +0 -2
  121. package/components/dropdown/dist/styles/classic/style-css.d.ts +0 -2
  122. package/components/dropdown/dist/styles/color-css.d.ts +0 -2
  123. package/components/dropdown/dist/styles/emphasized/style-css.d.ts +0 -2
  124. package/components/dropdown/dist/styles/shapeSize-css.d.ts +0 -2
  125. package/components/dropdown/dist/styles/snowflake/style-css.d.ts +0 -2
  126. package/components/dropdown/dist/styles/style-css.d.ts +0 -2
  127. package/components/dropdown/dist/styles/tokens-css.d.ts +0 -2
  128. package/components/form/demo/api.md +0 -319
  129. package/components/form/demo/api.min.js +0 -69996
  130. package/components/form/demo/index.md +0 -128
  131. package/components/form/demo/index.min.js +0 -69996
  132. package/components/form/demo/readme.md +0 -145
  133. package/components/form/dist/auro-form.d.ts +0 -280
  134. package/components/form/dist/index.d.ts +0 -2
  135. package/components/form/dist/index.js +0 -718
  136. package/components/form/dist/registered.d.ts +0 -1
  137. package/components/form/dist/registered.js +0 -718
  138. package/components/form/dist/styles/style-css.d.ts +0 -2
  139. package/components/helptext/dist/auro-helptext.d.ts +0 -69
  140. package/components/helptext/dist/index.d.ts +0 -2
  141. package/components/helptext/dist/index.js +0 -231
  142. package/components/helptext/dist/registered.js +0 -231
  143. package/components/helptext/dist/styles/color-css.d.ts +0 -2
  144. package/components/helptext/dist/styles/style-css.d.ts +0 -2
  145. package/components/helptext/dist/styles/tokens-css.d.ts +0 -2
  146. package/components/input/demo/api.md +0 -1397
  147. package/components/input/demo/api.min.js +0 -7435
  148. package/components/input/demo/index.md +0 -161
  149. package/components/input/demo/index.min.js +0 -7355
  150. package/components/input/demo/readme.md +0 -134
  151. package/components/input/dist/auro-input.d.ts +0 -195
  152. package/components/input/dist/base-input.d.ts +0 -628
  153. package/components/input/dist/buttonVersion.d.ts +0 -2
  154. package/components/input/dist/i18n.d.ts +0 -18
  155. package/components/input/dist/iconVersion.d.ts +0 -2
  156. package/components/input/dist/index.d.ts +0 -2
  157. package/components/input/dist/index.js +0 -7278
  158. package/components/input/dist/registered.js +0 -7278
  159. package/components/input/dist/styles/classic/color-css.d.ts +0 -2
  160. package/components/input/dist/styles/classic/style-css.d.ts +0 -2
  161. package/components/input/dist/styles/color-css.d.ts +0 -2
  162. package/components/input/dist/styles/default/borders-css.d.ts +0 -2
  163. package/components/input/dist/styles/default/color-css.d.ts +0 -2
  164. package/components/input/dist/styles/default/mixins-css.d.ts +0 -2
  165. package/components/input/dist/styles/default/notificationIcons-css.d.ts +0 -2
  166. package/components/input/dist/styles/default/style-css.d.ts +0 -2
  167. package/components/input/dist/styles/emphasized/color-css.d.ts +0 -2
  168. package/components/input/dist/styles/emphasized/style-css.d.ts +0 -2
  169. package/components/input/dist/styles/mixins-css.d.ts +0 -2
  170. package/components/input/dist/styles/shapeSize-css.d.ts +0 -2
  171. package/components/input/dist/styles/snowflake/style-css.d.ts +0 -2
  172. package/components/input/dist/styles/style-css.d.ts +0 -2
  173. package/components/input/dist/styles/tokens-css.d.ts +0 -2
  174. package/components/input/dist/utilities.d.ts +0 -25
  175. package/components/layoutElement/dist/auroElement.d.ts +0 -40
  176. package/components/layoutElement/dist/index.d.ts +0 -2
  177. package/components/layoutElement/dist/index.js +0 -107
  178. package/components/layoutElement/dist/registered.js +0 -107
  179. package/components/menu/demo/api.md +0 -1200
  180. package/components/menu/demo/api.min.js +0 -2292
  181. package/components/menu/demo/index.md +0 -72
  182. package/components/menu/demo/index.min.js +0 -2185
  183. package/components/menu/demo/readme.md +0 -145
  184. package/components/menu/dist/auro-menu-utils.d.ts +0 -34
  185. package/components/menu/dist/auro-menu.context.d.ts +0 -227
  186. package/components/menu/dist/auro-menu.d.ts +0 -324
  187. package/components/menu/dist/auro-menuoption.d.ts +0 -210
  188. package/components/menu/dist/iconVersion.d.ts +0 -2
  189. package/components/menu/dist/index.d.ts +0 -4
  190. package/components/menu/dist/index.js +0 -2148
  191. package/components/menu/dist/registered.js +0 -2096
  192. package/components/menu/dist/styles/default/color-menu-css.d.ts +0 -2
  193. package/components/menu/dist/styles/default/color-menuoption-css.d.ts +0 -2
  194. package/components/menu/dist/styles/default/style-menu-css.d.ts +0 -2
  195. package/components/menu/dist/styles/default/style-menuoption-css.d.ts +0 -2
  196. package/components/menu/dist/styles/default/tokens-css.d.ts +0 -2
  197. package/components/radio/demo/api.md +0 -675
  198. package/components/radio/demo/api.min.js +0 -2210
  199. package/components/radio/demo/index.md +0 -73
  200. package/components/radio/demo/index.min.js +0 -2167
  201. package/components/radio/demo/readme.md +0 -141
  202. package/components/radio/dist/auro-radio-group.d.ts +0 -250
  203. package/components/radio/dist/auro-radio.d.ts +0 -180
  204. package/components/radio/dist/index.d.ts +0 -3
  205. package/components/radio/dist/index.js +0 -2116
  206. package/components/radio/dist/registered.js +0 -2117
  207. package/components/radio/dist/styles/auro-radio-group-css.d.ts +0 -2
  208. package/components/radio/dist/styles/color-css.d.ts +0 -2
  209. package/components/radio/dist/styles/groupColor-css.d.ts +0 -2
  210. package/components/radio/dist/styles/style-css.d.ts +0 -2
  211. package/components/radio/dist/styles/tokens-css.d.ts +0 -2
  212. package/components/select/demo/api.md +0 -2378
  213. package/components/select/demo/api.min.js +0 -10133
  214. package/components/select/demo/index.md +0 -355
  215. package/components/select/demo/index.min.js +0 -10040
  216. package/components/select/demo/readme.md +0 -148
  217. package/components/select/dist/auro-select.d.ts +0 -545
  218. package/components/select/dist/index.d.ts +0 -2
  219. package/components/select/dist/index.js +0 -8072
  220. package/components/select/dist/registered.js +0 -8072
  221. package/components/select/dist/selectKeyboardStrategy.d.ts +0 -8
  222. package/components/select/dist/styles/emphasized/color-css.d.ts +0 -2
  223. package/components/select/dist/styles/shapeSize-css.d.ts +0 -2
  224. package/components/select/dist/styles/style-css.d.ts +0 -2
  225. package/components/select/dist/styles/tokens-css.d.ts +0 -2
  226. package/custom-elements.json +0 -18656
@@ -1,69 +0,0 @@
1
- /**
2
- * Displays help text or error messages within form elements - Internal Use Only.
3
- */
4
- export class AuroHelpText extends LitElement {
5
- static get styles(): import("lit").CSSResult[];
6
- static get properties(): {
7
- /**
8
- * Defines whether the component will be on lighter or darker backgrounds.
9
- * @property {'default', 'inverse'}
10
- * @default 'default'
11
- */
12
- appearance: {
13
- type: StringConstructor;
14
- reflect: boolean;
15
- };
16
- /**
17
- * @private
18
- */
19
- slotNodes: {
20
- type: BooleanConstructor;
21
- };
22
- /**
23
- * @private
24
- */
25
- hasTextContent: {
26
- type: BooleanConstructor;
27
- };
28
- /**
29
- * If declared, make font color red.
30
- */
31
- error: {
32
- type: BooleanConstructor;
33
- reflect: boolean;
34
- };
35
- /**
36
- * DEPRECATED - use `appearance` instead.
37
- */
38
- onDark: {
39
- type: BooleanConstructor;
40
- reflect: boolean;
41
- };
42
- };
43
- /**
44
- * This will register this element with the browser.
45
- * @param {string} [name="auro-helptext"] - The name of element that you want to register to.
46
- *
47
- * @example
48
- * AuroCheckbox.register("custom-helptext") // this will register this element to <custom-helptext/>
49
- *
50
- */
51
- static register(name?: string): void;
52
- error: boolean;
53
- appearance: string;
54
- onDark: boolean;
55
- hasTextContent: boolean;
56
- updated(): void;
57
- handleSlotChange(event: any): void;
58
- slotNodes: any;
59
- /**
60
- * Checks if any of the provided nodes or their nested slot nodes contain non-empty text content.
61
- *
62
- * @param {NodeList|Array} nodes - The list of nodes to check for content.
63
- * @returns {boolean} - Returns true if any node or nested slot node contains non-empty text content, otherwise false.
64
- * @private
65
- */
66
- private checkSlotsForContent;
67
- render(): import("lit-html").TemplateResult<1>;
68
- }
69
- import { LitElement } from "lit";
@@ -1,2 +0,0 @@
1
- export { AuroHelpText };
2
- import { AuroHelpText } from './auro-helptext.js';
@@ -1,231 +0,0 @@
1
- import { css, LitElement, html } from 'lit';
2
-
3
- var colorCss = css`:host([error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]),:host([appearance=inverse]){--ds-auro-helptext-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][error]),:host([appearance=inverse][error]){--ds-auro-helptext-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
4
-
5
- var styleCss = css`.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host{position:relative;display:block}.helptext-wrapper{display:none}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
6
-
7
- var tokensCss = css`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
8
-
9
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
10
- // See LICENSE in the project root for license information.
11
-
12
- // ---------------------------------------------------------------------
13
-
14
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
15
-
16
- class AuroLibraryRuntimeUtils {
17
-
18
- /* eslint-disable jsdoc/require-param */
19
-
20
- /**
21
- * This will register a new custom element with the browser.
22
- * @param {String} name - The name of the custom element.
23
- * @param {Object} componentClass - The class to register as a custom element.
24
- * @returns {void}
25
- */
26
- registerComponent(name, componentClass) {
27
- if (!customElements.get(name)) {
28
- customElements.define(name, class extends componentClass {});
29
- }
30
- }
31
-
32
- /**
33
- * Finds and returns the closest HTML Element based on a selector.
34
- * @returns {void}
35
- */
36
- closestElement(
37
- selector, // selector like in .closest()
38
- base = this, // extra functionality to skip a parent
39
- __Closest = (el, found = el && el.closest(selector)) =>
40
- !el || el === document || el === window
41
- ? null // standard .closest() returns null for non-found selectors also
42
- : found
43
- ? found // found a selector INside this element
44
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
45
- ) {
46
- return __Closest(base);
47
- }
48
- /* eslint-enable jsdoc/require-param */
49
-
50
- /**
51
- * If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
52
- * @param {Object} elem - The element to check.
53
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
54
- * @returns {void}
55
- */
56
- handleComponentTagRename(elem, tagName) {
57
- const tag = tagName.toLowerCase();
58
- const elemTag = elem.tagName.toLowerCase();
59
-
60
- if (elemTag !== tag) {
61
- elem.setAttribute(tag, true);
62
- }
63
- }
64
-
65
- /**
66
- * Validates if an element is a specific Auro component.
67
- * @param {Object} elem - The element to validate.
68
- * @param {String} tagName - The name of the Auro component to check against.
69
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
70
- */
71
- elementMatch(elem, tagName) {
72
- const tag = tagName.toLowerCase();
73
- const elemTag = elem.tagName.toLowerCase();
74
-
75
- return elemTag === tag || elem.hasAttribute(tag);
76
- }
77
-
78
- /**
79
- * Gets the text content of a named slot.
80
- * @returns {String}
81
- * @private
82
- */
83
- getSlotText(elem, name) {
84
- const slot = elem.shadowRoot?.querySelector(`slot[name="${name}"]`);
85
- const nodes = slot?.assignedNodes({ flatten: true }) || [];
86
- const text = nodes.map(n => n.textContent?.trim()).join(' ').trim();
87
-
88
- return text || null;
89
- }
90
- }
91
-
92
- // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
93
- // See LICENSE in the project root for license information.
94
-
95
-
96
- /**
97
- * Displays help text or error messages within form elements - Internal Use Only.
98
- */
99
- class AuroHelpText extends LitElement {
100
-
101
- constructor() {
102
- super();
103
-
104
- this.error = false;
105
- this.appearance = "default";
106
- this.onDark = false;
107
- this.hasTextContent = false;
108
-
109
- AuroLibraryRuntimeUtils.prototype.handleComponentTagRename(this, 'auro-helptext');
110
- }
111
-
112
- static get styles() {
113
- return [
114
- colorCss,
115
- styleCss,
116
- tokensCss
117
- ];
118
- }
119
-
120
- // function to define props used within the scope of this component
121
- static get properties() {
122
- return {
123
-
124
- /**
125
- * Defines whether the component will be on lighter or darker backgrounds.
126
- * @property {'default', 'inverse'}
127
- * @default 'default'
128
- */
129
- appearance: {
130
- type: String,
131
- reflect: true
132
- },
133
-
134
- /**
135
- * @private
136
- */
137
- slotNodes: {
138
- type: Boolean,
139
- },
140
-
141
- /**
142
- * @private
143
- */
144
- hasTextContent: {
145
- type: Boolean,
146
- },
147
-
148
- /**
149
- * If declared, make font color red.
150
- */
151
- error: {
152
- type: Boolean,
153
- reflect: true,
154
- },
155
-
156
- /**
157
- * DEPRECATED - use `appearance` instead.
158
- */
159
- onDark: {
160
- type: Boolean,
161
- reflect: true
162
- }
163
- };
164
- }
165
-
166
- /**
167
- * This will register this element with the browser.
168
- * @param {string} [name="auro-helptext"] - The name of element that you want to register to.
169
- *
170
- * @example
171
- * AuroCheckbox.register("custom-helptext") // this will register this element to <custom-helptext/>
172
- *
173
- */
174
- static register(name = "auro-helptext") {
175
- AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroHelpText);
176
- }
177
-
178
- updated() {
179
- this.handleSlotChange();
180
- }
181
-
182
- handleSlotChange(event) {
183
- if (event) {
184
- this.slotNodes = event.target.assignedNodes();
185
- }
186
-
187
- this.hasTextContent = this.checkSlotsForContent(this.slotNodes);
188
- }
189
-
190
- /**
191
- * Checks if any of the provided nodes or their nested slot nodes contain non-empty text content.
192
- *
193
- * @param {NodeList|Array} nodes - The list of nodes to check for content.
194
- * @returns {boolean} - Returns true if any node or nested slot node contains non-empty text content, otherwise false.
195
- * @private
196
- */
197
- checkSlotsForContent(nodes) {
198
- if (!nodes) {
199
- return false;
200
- }
201
-
202
- return nodes.some((node) => {
203
- if (node.textContent.trim()) {
204
- return true;
205
- }
206
-
207
- if (!node.querySelector) {
208
- return false;
209
- }
210
-
211
- const nestedSlot = node.tagName === 'SLOT' ? node : node.querySelector('slot');
212
- if (!nestedSlot) {
213
- return false;
214
- }
215
-
216
- const nestedSlotNodes = nestedSlot.assignedNodes();
217
- return this.checkSlotsForContent(nestedSlotNodes);
218
- });
219
- }
220
-
221
- // function that renders the HTML and CSS into the scope of the component
222
- render() {
223
- return html`
224
- <div class="helptext-wrapper body-xs" ?visible="${this.hasTextContent}">
225
- <slot @slotchange=${this.handleSlotChange}></slot>
226
- </div>
227
- `;
228
- }
229
- }
230
-
231
- export { AuroHelpText };
@@ -1,231 +0,0 @@
1
- import { css, LitElement, html } from 'lit';
2
-
3
- var colorCss = css`:host([error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]),:host([appearance=inverse]){--ds-auro-helptext-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][error]),:host([appearance=inverse][error]){--ds-auro-helptext-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
4
-
5
- var styleCss = css`.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host{position:relative;display:block}.helptext-wrapper{display:none}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
6
-
7
- var tokensCss = css`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
8
-
9
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
10
- // See LICENSE in the project root for license information.
11
-
12
- // ---------------------------------------------------------------------
13
-
14
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
15
-
16
- class AuroLibraryRuntimeUtils {
17
-
18
- /* eslint-disable jsdoc/require-param */
19
-
20
- /**
21
- * This will register a new custom element with the browser.
22
- * @param {String} name - The name of the custom element.
23
- * @param {Object} componentClass - The class to register as a custom element.
24
- * @returns {void}
25
- */
26
- registerComponent(name, componentClass) {
27
- if (!customElements.get(name)) {
28
- customElements.define(name, class extends componentClass {});
29
- }
30
- }
31
-
32
- /**
33
- * Finds and returns the closest HTML Element based on a selector.
34
- * @returns {void}
35
- */
36
- closestElement(
37
- selector, // selector like in .closest()
38
- base = this, // extra functionality to skip a parent
39
- __Closest = (el, found = el && el.closest(selector)) =>
40
- !el || el === document || el === window
41
- ? null // standard .closest() returns null for non-found selectors also
42
- : found
43
- ? found // found a selector INside this element
44
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
45
- ) {
46
- return __Closest(base);
47
- }
48
- /* eslint-enable jsdoc/require-param */
49
-
50
- /**
51
- * If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
52
- * @param {Object} elem - The element to check.
53
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
54
- * @returns {void}
55
- */
56
- handleComponentTagRename(elem, tagName) {
57
- const tag = tagName.toLowerCase();
58
- const elemTag = elem.tagName.toLowerCase();
59
-
60
- if (elemTag !== tag) {
61
- elem.setAttribute(tag, true);
62
- }
63
- }
64
-
65
- /**
66
- * Validates if an element is a specific Auro component.
67
- * @param {Object} elem - The element to validate.
68
- * @param {String} tagName - The name of the Auro component to check against.
69
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
70
- */
71
- elementMatch(elem, tagName) {
72
- const tag = tagName.toLowerCase();
73
- const elemTag = elem.tagName.toLowerCase();
74
-
75
- return elemTag === tag || elem.hasAttribute(tag);
76
- }
77
-
78
- /**
79
- * Gets the text content of a named slot.
80
- * @returns {String}
81
- * @private
82
- */
83
- getSlotText(elem, name) {
84
- const slot = elem.shadowRoot?.querySelector(`slot[name="${name}"]`);
85
- const nodes = slot?.assignedNodes({ flatten: true }) || [];
86
- const text = nodes.map(n => n.textContent?.trim()).join(' ').trim();
87
-
88
- return text || null;
89
- }
90
- }
91
-
92
- // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
93
- // See LICENSE in the project root for license information.
94
-
95
-
96
- /**
97
- * Displays help text or error messages within form elements - Internal Use Only.
98
- */
99
- class AuroHelpText extends LitElement {
100
-
101
- constructor() {
102
- super();
103
-
104
- this.error = false;
105
- this.appearance = "default";
106
- this.onDark = false;
107
- this.hasTextContent = false;
108
-
109
- AuroLibraryRuntimeUtils.prototype.handleComponentTagRename(this, 'auro-helptext');
110
- }
111
-
112
- static get styles() {
113
- return [
114
- colorCss,
115
- styleCss,
116
- tokensCss
117
- ];
118
- }
119
-
120
- // function to define props used within the scope of this component
121
- static get properties() {
122
- return {
123
-
124
- /**
125
- * Defines whether the component will be on lighter or darker backgrounds.
126
- * @property {'default', 'inverse'}
127
- * @default 'default'
128
- */
129
- appearance: {
130
- type: String,
131
- reflect: true
132
- },
133
-
134
- /**
135
- * @private
136
- */
137
- slotNodes: {
138
- type: Boolean,
139
- },
140
-
141
- /**
142
- * @private
143
- */
144
- hasTextContent: {
145
- type: Boolean,
146
- },
147
-
148
- /**
149
- * If declared, make font color red.
150
- */
151
- error: {
152
- type: Boolean,
153
- reflect: true,
154
- },
155
-
156
- /**
157
- * DEPRECATED - use `appearance` instead.
158
- */
159
- onDark: {
160
- type: Boolean,
161
- reflect: true
162
- }
163
- };
164
- }
165
-
166
- /**
167
- * This will register this element with the browser.
168
- * @param {string} [name="auro-helptext"] - The name of element that you want to register to.
169
- *
170
- * @example
171
- * AuroCheckbox.register("custom-helptext") // this will register this element to <custom-helptext/>
172
- *
173
- */
174
- static register(name = "auro-helptext") {
175
- AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroHelpText);
176
- }
177
-
178
- updated() {
179
- this.handleSlotChange();
180
- }
181
-
182
- handleSlotChange(event) {
183
- if (event) {
184
- this.slotNodes = event.target.assignedNodes();
185
- }
186
-
187
- this.hasTextContent = this.checkSlotsForContent(this.slotNodes);
188
- }
189
-
190
- /**
191
- * Checks if any of the provided nodes or their nested slot nodes contain non-empty text content.
192
- *
193
- * @param {NodeList|Array} nodes - The list of nodes to check for content.
194
- * @returns {boolean} - Returns true if any node or nested slot node contains non-empty text content, otherwise false.
195
- * @private
196
- */
197
- checkSlotsForContent(nodes) {
198
- if (!nodes) {
199
- return false;
200
- }
201
-
202
- return nodes.some((node) => {
203
- if (node.textContent.trim()) {
204
- return true;
205
- }
206
-
207
- if (!node.querySelector) {
208
- return false;
209
- }
210
-
211
- const nestedSlot = node.tagName === 'SLOT' ? node : node.querySelector('slot');
212
- if (!nestedSlot) {
213
- return false;
214
- }
215
-
216
- const nestedSlotNodes = nestedSlot.assignedNodes();
217
- return this.checkSlotsForContent(nestedSlotNodes);
218
- });
219
- }
220
-
221
- // function that renders the HTML and CSS into the scope of the component
222
- render() {
223
- return html`
224
- <div class="helptext-wrapper body-xs" ?visible="${this.hasTextContent}">
225
- <slot @slotchange=${this.handleSlotChange}></slot>
226
- </div>
227
- `;
228
- }
229
- }
230
-
231
- AuroHelpText.register();
@@ -1,2 +0,0 @@
1
- declare const _default: import("lit").CSSResult;
2
- export default _default;
@@ -1,2 +0,0 @@
1
- declare const _default: import("lit").CSSResult;
2
- export default _default;
@@ -1,2 +0,0 @@
1
- declare const _default: import("lit").CSSResult;
2
- export default _default;