@aurodesignsystem-dev/auro-formkit 0.0.0-pr593.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 (268) hide show
  1. package/CHANGELOG.md +5 -0
  2. package/LICENSE +201 -0
  3. package/NOTICE +2 -0
  4. package/README.md +314 -0
  5. package/components/bibtemplate/dist/auro-bibtemplate.d.ts +39 -0
  6. package/components/bibtemplate/dist/headerVersion.d.ts +2 -0
  7. package/components/bibtemplate/dist/iconVersion.d.ts +2 -0
  8. package/components/bibtemplate/dist/index.d.ts +2 -0
  9. package/components/bibtemplate/dist/index.js +709 -0
  10. package/components/bibtemplate/dist/registered.js +709 -0
  11. package/components/bibtemplate/dist/styles/color-css.d.ts +2 -0
  12. package/components/bibtemplate/dist/styles/style-css.d.ts +2 -0
  13. package/components/bibtemplate/dist/styles/tokens-css.d.ts +2 -0
  14. package/components/checkbox/README.md +142 -0
  15. package/components/checkbox/demo/api.html +55 -0
  16. package/components/checkbox/demo/api.js +17 -0
  17. package/components/checkbox/demo/api.md +401 -0
  18. package/components/checkbox/demo/api.min.js +1833 -0
  19. package/components/checkbox/demo/index.html +51 -0
  20. package/components/checkbox/demo/index.js +8 -0
  21. package/components/checkbox/demo/index.md +327 -0
  22. package/components/checkbox/demo/index.min.js +1808 -0
  23. package/components/checkbox/demo/readme.html +50 -0
  24. package/components/checkbox/demo/readme.md +142 -0
  25. package/components/checkbox/dist/auro-checkbox-group.d.ts +166 -0
  26. package/components/checkbox/dist/auro-checkbox.d.ts +129 -0
  27. package/components/checkbox/dist/helptextVersion.d.ts +2 -0
  28. package/components/checkbox/dist/index.d.ts +3 -0
  29. package/components/checkbox/dist/index.js +1757 -0
  30. package/components/checkbox/dist/registered.js +1758 -0
  31. package/components/checkbox/dist/styles/auro-checkbox-css.d.ts +2 -0
  32. package/components/checkbox/dist/styles/auro-checkbox-group-css.d.ts +2 -0
  33. package/components/checkbox/dist/styles/color-css.d.ts +2 -0
  34. package/components/checkbox/dist/styles/colorGroup-css.d.ts +2 -0
  35. package/components/checkbox/dist/styles/tokens-css.d.ts +2 -0
  36. package/components/combobox/README.md +152 -0
  37. package/components/combobox/demo/api.html +57 -0
  38. package/components/combobox/demo/api.js +36 -0
  39. package/components/combobox/demo/api.md +1209 -0
  40. package/components/combobox/demo/api.min.js +15117 -0
  41. package/components/combobox/demo/index.html +56 -0
  42. package/components/combobox/demo/index.js +26 -0
  43. package/components/combobox/demo/index.md +621 -0
  44. package/components/combobox/demo/index.min.js +14971 -0
  45. package/components/combobox/demo/readme.html +50 -0
  46. package/components/combobox/demo/readme.md +152 -0
  47. package/components/combobox/dist/auro-combobox.d.ts +384 -0
  48. package/components/combobox/dist/bibtemplateVersion.d.ts +2 -0
  49. package/components/combobox/dist/dropdownVersion.d.ts +2 -0
  50. package/components/combobox/dist/index.d.ts +2 -0
  51. package/components/combobox/dist/index.js +13554 -0
  52. package/components/combobox/dist/inputVersion.d.ts +2 -0
  53. package/components/combobox/dist/registered.js +13556 -0
  54. package/components/combobox/dist/styles/style-css.d.ts +2 -0
  55. package/components/counter/README.md +146 -0
  56. package/components/counter/demo/api.html +54 -0
  57. package/components/counter/demo/api.js +20 -0
  58. package/components/counter/demo/api.md +584 -0
  59. package/components/counter/demo/api.min.js +7111 -0
  60. package/components/counter/demo/index.html +54 -0
  61. package/components/counter/demo/index.js +21 -0
  62. package/components/counter/demo/index.md +244 -0
  63. package/components/counter/demo/index.min.js +7075 -0
  64. package/components/counter/demo/readme.html +50 -0
  65. package/components/counter/demo/readme.md +146 -0
  66. package/components/counter/dist/auro-counter-button.d.ts +12 -0
  67. package/components/counter/dist/auro-counter-group.d.ts +235 -0
  68. package/components/counter/dist/auro-counter-wrapper.d.ts +22 -0
  69. package/components/counter/dist/auro-counter.d.ts +97 -0
  70. package/components/counter/dist/bibtemplateVersion.d.ts +2 -0
  71. package/components/counter/dist/dropdownVersion.d.ts +2 -0
  72. package/components/counter/dist/iconVersion.d.ts +2 -0
  73. package/components/counter/dist/index.d.ts +3 -0
  74. package/components/counter/dist/index.js +7018 -0
  75. package/components/counter/dist/registered.js +7019 -0
  76. package/components/counter/dist/styles/color-css.d.ts +2 -0
  77. package/components/counter/dist/styles/counter-button-color-css.d.ts +2 -0
  78. package/components/counter/dist/styles/counter-button-css.d.ts +2 -0
  79. package/components/counter/dist/styles/counter-group-css.d.ts +2 -0
  80. package/components/counter/dist/styles/counter-wrapper-color-css.d.ts +2 -0
  81. package/components/counter/dist/styles/counter-wrapper-css.d.ts +2 -0
  82. package/components/counter/dist/styles/style-css.d.ts +2 -0
  83. package/components/counter/dist/styles/tokens-css.d.ts +2 -0
  84. package/components/datepicker/README.md +140 -0
  85. package/components/datepicker/demo/api.html +57 -0
  86. package/components/datepicker/demo/api.js +35 -0
  87. package/components/datepicker/demo/api.md +1479 -0
  88. package/components/datepicker/demo/api.min.js +24534 -0
  89. package/components/datepicker/demo/index.html +56 -0
  90. package/components/datepicker/demo/index.js +19 -0
  91. package/components/datepicker/demo/index.md +112 -0
  92. package/components/datepicker/demo/index.min.js +24255 -0
  93. package/components/datepicker/demo/readme.html +50 -0
  94. package/components/datepicker/demo/readme.md +140 -0
  95. package/components/datepicker/dist/auro-calendar-cell.d.ts +163 -0
  96. package/components/datepicker/dist/auro-calendar-month.d.ts +20 -0
  97. package/components/datepicker/dist/auro-calendar.d.ts +133 -0
  98. package/components/datepicker/dist/auro-datepicker.d.ts +466 -0
  99. package/components/datepicker/dist/bibtemplateVersion.d.ts +2 -0
  100. package/components/datepicker/dist/buttonVersion.d.ts +2 -0
  101. package/components/datepicker/dist/dropdownVersion.d.ts +2 -0
  102. package/components/datepicker/dist/index.d.ts +2 -0
  103. package/components/datepicker/dist/index.js +24185 -0
  104. package/components/datepicker/dist/inputVersion.d.ts +2 -0
  105. package/components/datepicker/dist/popoverVersion.d.ts +2 -0
  106. package/components/datepicker/dist/registered.js +24185 -0
  107. package/components/datepicker/dist/styles/color-calendar-css.d.ts +2 -0
  108. package/components/datepicker/dist/styles/color-cell-css.d.ts +2 -0
  109. package/components/datepicker/dist/styles/color-css.d.ts +2 -0
  110. package/components/datepicker/dist/styles/color-month-css.d.ts +2 -0
  111. package/components/datepicker/dist/styles/style-auro-calendar-cell-css.d.ts +2 -0
  112. package/components/datepicker/dist/styles/style-auro-calendar-css.d.ts +2 -0
  113. package/components/datepicker/dist/styles/style-auro-calendar-month-css.d.ts +2 -0
  114. package/components/datepicker/dist/styles/style-css.d.ts +2 -0
  115. package/components/datepicker/dist/styles/tokens-css.d.ts +2 -0
  116. package/components/datepicker/dist/utilities.d.ts +78 -0
  117. package/components/datepicker/dist/utilitiesCalendar.d.ts +38 -0
  118. package/components/datepicker/dist/utilitiesCalendarRender.d.ts +50 -0
  119. package/components/datepicker/dist/vendor/wc-range-datepicker/day.d.ts +5 -0
  120. package/components/datepicker/dist/vendor/wc-range-datepicker/range-datepicker-calendar.d.ts +60 -0
  121. package/components/datepicker/dist/vendor/wc-range-datepicker/range-datepicker-cell.d.ts +1 -0
  122. package/components/datepicker/dist/vendor/wc-range-datepicker/range-datepicker.d.ts +57 -0
  123. package/components/dropdown/README.md +144 -0
  124. package/components/dropdown/demo/api.html +57 -0
  125. package/components/dropdown/demo/api.js +21 -0
  126. package/components/dropdown/demo/api.md +1434 -0
  127. package/components/dropdown/demo/api.min.js +3826 -0
  128. package/components/dropdown/demo/index.html +55 -0
  129. package/components/dropdown/demo/index.js +19 -0
  130. package/components/dropdown/demo/index.md +510 -0
  131. package/components/dropdown/demo/index.min.js +3789 -0
  132. package/components/dropdown/demo/readme.html +50 -0
  133. package/components/dropdown/demo/readme.md +144 -0
  134. package/components/dropdown/dist/auro-dropdown.d.ts +406 -0
  135. package/components/dropdown/dist/auro-dropdownBib.d.ts +46 -0
  136. package/components/dropdown/dist/dropdownVersion.d.ts +2 -0
  137. package/components/dropdown/dist/helptextVersion.d.ts +2 -0
  138. package/components/dropdown/dist/iconVersion.d.ts +2 -0
  139. package/components/dropdown/dist/index.d.ts +2 -0
  140. package/components/dropdown/dist/index.js +3734 -0
  141. package/components/dropdown/dist/registered.js +3734 -0
  142. package/components/dropdown/dist/styles/bibColors-css.d.ts +2 -0
  143. package/components/dropdown/dist/styles/bibStyles-css.d.ts +2 -0
  144. package/components/dropdown/dist/styles/color-css.d.ts +2 -0
  145. package/components/dropdown/dist/styles/style-css.d.ts +2 -0
  146. package/components/dropdown/dist/styles/tokens-css.d.ts +2 -0
  147. package/components/form/README.md +142 -0
  148. package/components/form/demo/api.html +49 -0
  149. package/components/form/demo/api.js +3 -0
  150. package/components/form/demo/api.md +51 -0
  151. package/components/form/demo/api.min.js +638 -0
  152. package/components/form/demo/autocomplete.html +15 -0
  153. package/components/form/demo/index.html +50 -0
  154. package/components/form/demo/index.js +4 -0
  155. package/components/form/demo/index.md +403 -0
  156. package/components/form/demo/index.min.js +639 -0
  157. package/components/form/demo/readme.html +50 -0
  158. package/components/form/demo/readme.md +142 -0
  159. package/components/form/demo/registerDemoDeps.js +23 -0
  160. package/components/form/demo/working.html +118 -0
  161. package/components/form/dist/auro-form.d.ts +223 -0
  162. package/components/form/dist/index.d.ts +2 -0
  163. package/components/form/dist/index.js +614 -0
  164. package/components/form/dist/registered.d.ts +1 -0
  165. package/components/form/dist/registered.js +614 -0
  166. package/components/form/dist/styles/style-css.d.ts +2 -0
  167. package/components/helptext/dist/auro-helptext.d.ts +61 -0
  168. package/components/helptext/dist/index.d.ts +2 -0
  169. package/components/helptext/dist/index.js +209 -0
  170. package/components/helptext/dist/registered.js +209 -0
  171. package/components/helptext/dist/styles/color-css.d.ts +2 -0
  172. package/components/helptext/dist/styles/style-css.d.ts +2 -0
  173. package/components/helptext/dist/styles/tokens-css.d.ts +2 -0
  174. package/components/input/README.md +135 -0
  175. package/components/input/demo/api.html +42 -0
  176. package/components/input/demo/api.js +29 -0
  177. package/components/input/demo/api.md +1252 -0
  178. package/components/input/demo/api.min.js +7238 -0
  179. package/components/input/demo/index.html +43 -0
  180. package/components/input/demo/index.js +20 -0
  181. package/components/input/demo/index.md +202 -0
  182. package/components/input/demo/index.min.js +7157 -0
  183. package/components/input/demo/readme.html +50 -0
  184. package/components/input/demo/readme.md +135 -0
  185. package/components/input/dist/auro-input.d.ts +31 -0
  186. package/components/input/dist/base-input.d.ts +512 -0
  187. package/components/input/dist/buttonVersion.d.ts +2 -0
  188. package/components/input/dist/helptextVersion.d.ts +2 -0
  189. package/components/input/dist/i18n.d.ts +18 -0
  190. package/components/input/dist/iconVersion.d.ts +2 -0
  191. package/components/input/dist/index.d.ts +2 -0
  192. package/components/input/dist/index.js +7063 -0
  193. package/components/input/dist/registered.js +7063 -0
  194. package/components/input/dist/styles/borders-css.d.ts +2 -0
  195. package/components/input/dist/styles/color-css.d.ts +2 -0
  196. package/components/input/dist/styles/input-css.d.ts +2 -0
  197. package/components/input/dist/styles/label-css.d.ts +2 -0
  198. package/components/input/dist/styles/mixins-css.d.ts +2 -0
  199. package/components/input/dist/styles/notificationIcons-css.d.ts +2 -0
  200. package/components/input/dist/styles/style-css.d.ts +2 -0
  201. package/components/input/dist/styles/tokens-css.d.ts +2 -0
  202. package/components/input/dist/utilities.d.ts +25 -0
  203. package/components/menu/README.md +145 -0
  204. package/components/menu/demo/api.html +55 -0
  205. package/components/menu/demo/api.js +27 -0
  206. package/components/menu/demo/api.md +954 -0
  207. package/components/menu/demo/api.min.js +1538 -0
  208. package/components/menu/demo/index.html +52 -0
  209. package/components/menu/demo/index.js +28 -0
  210. package/components/menu/demo/index.md +61 -0
  211. package/components/menu/demo/index.min.js +1484 -0
  212. package/components/menu/demo/readme.html +50 -0
  213. package/components/menu/demo/readme.md +145 -0
  214. package/components/menu/dist/auro-menu-utils.d.ts +42 -0
  215. package/components/menu/dist/auro-menu.d.ts +205 -0
  216. package/components/menu/dist/auro-menuoption.d.ts +63 -0
  217. package/components/menu/dist/dropdownVersion.d.ts +2 -0
  218. package/components/menu/dist/iconVersion.d.ts +2 -0
  219. package/components/menu/dist/index.d.ts +4 -0
  220. package/components/menu/dist/index.js +1426 -0
  221. package/components/menu/dist/registered.js +1427 -0
  222. package/components/menu/dist/styles/color-menu-css.d.ts +2 -0
  223. package/components/menu/dist/styles/color-menuoption-css.d.ts +2 -0
  224. package/components/menu/dist/styles/style-menu-css.d.ts +2 -0
  225. package/components/menu/dist/styles/style-menuoption-css.d.ts +2 -0
  226. package/components/menu/dist/styles/tokens-css.d.ts +2 -0
  227. package/components/radio/README.md +137 -0
  228. package/components/radio/demo/api.html +53 -0
  229. package/components/radio/demo/api.js +19 -0
  230. package/components/radio/demo/api.md +562 -0
  231. package/components/radio/demo/api.min.js +1944 -0
  232. package/components/radio/demo/index.html +50 -0
  233. package/components/radio/demo/index.js +8 -0
  234. package/components/radio/demo/index.md +150 -0
  235. package/components/radio/demo/index.min.js +1901 -0
  236. package/components/radio/demo/readme.html +50 -0
  237. package/components/radio/demo/readme.md +137 -0
  238. package/components/radio/dist/auro-radio-group.d.ts +194 -0
  239. package/components/radio/dist/auro-radio.d.ts +144 -0
  240. package/components/radio/dist/helptextVersion.d.ts +2 -0
  241. package/components/radio/dist/index.d.ts +3 -0
  242. package/components/radio/dist/index.js +1850 -0
  243. package/components/radio/dist/registered.js +1851 -0
  244. package/components/radio/dist/styles/auro-radio-group-css.d.ts +2 -0
  245. package/components/radio/dist/styles/color-css.d.ts +2 -0
  246. package/components/radio/dist/styles/groupColor-css.d.ts +2 -0
  247. package/components/radio/dist/styles/style-css.d.ts +2 -0
  248. package/components/radio/dist/styles/tokens-css.d.ts +2 -0
  249. package/components/select/README.md +144 -0
  250. package/components/select/demo/api.html +71 -0
  251. package/components/select/demo/api.js +35 -0
  252. package/components/select/demo/api.md +1313 -0
  253. package/components/select/demo/api.min.js +7763 -0
  254. package/components/select/demo/index.html +66 -0
  255. package/components/select/demo/index.js +9 -0
  256. package/components/select/demo/index.md +815 -0
  257. package/components/select/demo/index.min.js +7651 -0
  258. package/components/select/demo/readme.html +50 -0
  259. package/components/select/demo/readme.md +144 -0
  260. package/components/select/dist/auro-select.d.ts +359 -0
  261. package/components/select/dist/bibtemplateVersion.d.ts +2 -0
  262. package/components/select/dist/dropdownVersion.d.ts +2 -0
  263. package/components/select/dist/index.d.ts +2 -0
  264. package/components/select/dist/index.js +6300 -0
  265. package/components/select/dist/registered.js +6300 -0
  266. package/components/select/dist/styles/style-css.d.ts +2 -0
  267. package/package.json +217 -0
  268. package/packages/build-tools/src/postinstall.mjs +12 -0
@@ -0,0 +1,50 @@
1
+ <!--
2
+ Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
3
+ See LICENSE in the project root for license information.
4
+
5
+ HTML in this document is standardized and NOT to be edited.
6
+ All demo code should be added/edited in ./demo/index.md
7
+
8
+ With the exception of adding custom elements if needed for the demo.
9
+
10
+ ----------------------- DO NOT EDIT -----------------------------
11
+
12
+ -->
13
+
14
+ <!DOCTYPE html>
15
+ <html lang="en">
16
+ <head>
17
+ <meta charset="UTF-8" />
18
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
19
+ <title>Auro Web Component Generator | auro-datepicker custom element</title>
20
+ <link
21
+ rel="stylesheet"
22
+ type="text/css"
23
+ href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css"
24
+ />
25
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/auro-classic/CSSCustomProperties.css">
26
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/alaska/CSSCustomProperties--alaska.css">
27
+ <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/demoWrapper.css" />
28
+ <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/elementDemoStyles.css" />
29
+ </head>
30
+ <body class="auro-markdown">
31
+ <main></main>
32
+
33
+ <script type="module">
34
+ import 'https://cdn.jsdelivr.net/npm/marked@latest/marked.min.js';
35
+ import 'https://cdn.jsdelivr.net/npm/prismjs@latest/prism.js';
36
+ fetch('./readme.md')
37
+ .then((response) => response.text())
38
+ .then((text) => {
39
+ const rawHtml = marked.parse(text);
40
+ document.querySelector('main').innerHTML = rawHtml;
41
+ Prism.highlightAll();
42
+ })
43
+ </script>
44
+ <script type="module">
45
+ import { initExamples } from "./index.min.js";
46
+
47
+ initExamples();
48
+ </script>
49
+ </body>
50
+ </html>
@@ -0,0 +1,140 @@
1
+ <!--
2
+ The README.md file is a compiled document. No edits should be made directly to this file.
3
+
4
+ README.md is created by running `npm run build:docs`.
5
+
6
+ This file is generated based on a template fetched from
7
+ `../../docs/templates/componentReadmeTemplate.md`
8
+ and copied to `./componentDocs/README.md` each time the docs are compiled.
9
+
10
+ The following sections are editable by making changes to the following files:
11
+
12
+ | SECTION | DESCRIPTION | FILE LOCATION |
13
+ |------------------------|---------------------------------------------------|-------------------------------------|
14
+ | Description | Description of the component | `./docs/partials/description.md` |
15
+ | Use Cases | Examples for when to use this component | `./docs/partials/useCases.md` |
16
+ | Additional Information | For use to add any component specific information | `./docs/partials/readmeAddlInfo.md` |
17
+ | Component Example Code | HTML sample code of the components use | `./apiExamples/basic.html` |
18
+ -->
19
+
20
+ # Datepicker
21
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./docs/partials/description.md) -->
22
+ <!-- The below content is automatically added from ./docs/partials/description.md -->
23
+ The `<auro-datepicker>` element allows users to select a date, or a pair of dates identifying a range, either with text input or by making a section in a calendar. The `<auro-datepicker>` element is the combination of [auro-dropdown](http://auro.alaskaair.com/components/auro/dropdown), [auro-input](http://auro.alaskaair.com/components/auro/input), and Auro's extension of [wc-range-datepicker](https://www.npmjs.com/package/wc-range-datepicker).
24
+ <!-- AURO-GENERATED-CONTENT:END -->
25
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./docs/partials/readmeAddlInfo.md) -->
26
+ <!-- The below content is automatically added from ./docs/partials/readmeAddlInfo.md -->
27
+ <!-- AURO-GENERATED-CONTENT This file is to be used for any additional content that should be included in the README.md which is specific to this component. -->
28
+ <!-- AURO-GENERATED-CONTENT:END -->
29
+
30
+ ## Getting Started
31
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=../../docs/templates/componentInstall.md) -->
32
+ <!-- The below content is automatically added from ../../docs/templates/componentInstall.md -->
33
+
34
+ #### NPM Installation
35
+
36
+ ```shell
37
+ $ npm i @aurodesignsystem/auro-formkit
38
+ ```
39
+ <!-- AURO-GENERATED-CONTENT:END -->
40
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=../../docs/templates/gettingStarted.md) -->
41
+ <!-- The below content is automatically added from ../../docs/templates/gettingStarted.md -->
42
+
43
+ ### Import Options
44
+
45
+ #### Automatic Registration
46
+
47
+ For automatic registration, simply import the component:
48
+
49
+ ```javascript
50
+ // Registers <auro-datepicker> automatically
51
+ import '@aurodesignsystem/auro-formkit/auro-datepicker';
52
+ ```
53
+
54
+ #### Custom Registration
55
+
56
+ To protect from versioning conflicts with other instances of the component being loaded, it is recommended to use our static `AuroDatepicker.register('custom-datepicker')` method on the component class and pass in a unique name.
57
+
58
+ ```javascript
59
+ // Import the class only
60
+ import { AuroDatepicker } from '@aurodesignsystem/auro-formkit/auro-datepicker/class';
61
+
62
+ // Register with a custom name if desired
63
+ AuroDatepicker.register('custom-datepicker');
64
+ ```
65
+
66
+ #### TypeScript Module Resolution
67
+
68
+ When using TypeScript set `moduleResolution` to `bundler`, add the following to your `tsconfig.json`:
69
+
70
+ ```json
71
+ {
72
+ "compilerOptions": {
73
+ "moduleResolution": "bundler"
74
+ }
75
+ }
76
+ ```
77
+
78
+ This configuration enables proper module resolution for the component's TypeScript files.
79
+ <!-- AURO-GENERATED-CONTENT:END -->
80
+ **Reference component in HTML**
81
+
82
+ <!-- AURO-GENERATED-CONTENT:START (CODE:src=./apiExamples/basic.html) -->
83
+ <!-- The below code snippet is automatically added from ./apiExamples/basic.html -->
84
+
85
+ ```html
86
+ <auro-datepicker>
87
+ <span slot="bib.fullscreen.headline">Datepicker Headline</span>
88
+ <span slot="fromLabel">Choose a date</span>
89
+ <span slot="bib.fullscreen.dateLabel">Choose a date</span>
90
+ </auro-datepicker>
91
+ ```
92
+ <!-- AURO-GENERATED-CONTENT:END -->
93
+
94
+ ### Design Token CSS Custom Property dependency
95
+
96
+ <!-- AURO-GENERATED-CONTENT:START (REMOTE:url=https://raw.githubusercontent.com/AlaskaAirlines/WC-Generator/master/componentDocs/partials/development/designTokens.md) -->
97
+ The use of any Auro custom element has a dependency on the [Auro Design Tokens](https://auro.alaskaair.com/getting-started/developers/design-tokens).
98
+
99
+ <!-- AURO-GENERATED-CONTENT:END -->
100
+
101
+ ## Install from CDN
102
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=../../docs/templates/bundleInstallDescription.md) -->
103
+ <!-- The below content is automatically added from ../../docs/templates/bundleInstallDescription.md -->
104
+ In cases where the project is not able to process JS assets, there are pre-processed assets available for use. Legacy browsers such as IE11 are no longer supported.
105
+
106
+ ```html
107
+ <script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@0.0.0/auro-datepicker/+esm"></script>
108
+ ```
109
+ <!-- AURO-GENERATED-CONTENT:END -->
110
+
111
+ ## UI development browser support
112
+ <!-- AURO-GENERATED-CONTENT:START (REMOTE:url=https://raw.githubusercontent.com/AlaskaAirlines/WC-Generator/master/componentDocs/partials/browserSupport.md) -->
113
+ For the most up to date information on [UI development browser support](https://auro.alaskaair.com/support/browsersSupport)
114
+
115
+ <!-- AURO-GENERATED-CONTENT:END -->
116
+
117
+ ## auro-datepicker use cases
118
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./docs/partials/useCases.md) -->
119
+ <!-- The below content is automatically added from ./docs/partials/useCases.md -->
120
+ The `<auro-datepicker>` element should be used in situations where users may:
121
+
122
+ * select a single date
123
+ * select a pair of dates which identify a calendar range
124
+ <!-- AURO-GENERATED-CONTENT:END -->
125
+
126
+ ## Formkit development
127
+
128
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=../../docs/partials/developmentDescription.md) -->
129
+ <!-- The below content is automatically added from ../../docs/partials/developmentDescription.md -->
130
+
131
+ ### Filtering
132
+
133
+ Running the `dev` command will open a `localhost` development server for all components in the monorepo at once.
134
+
135
+ To only develop a single component, use the `--filter` flag:
136
+
137
+ ```shell
138
+ npx turbo dev --filter=@aurodesignsystem/auro-input
139
+ ```
140
+ <!-- AURO-GENERATED-CONTENT:END -->
@@ -0,0 +1,163 @@
1
+ export class AuroCalendarCell extends LitElement {
2
+ static get properties(): {
3
+ day: {
4
+ type: ObjectConstructor;
5
+ };
6
+ selected: {
7
+ type: BooleanConstructor;
8
+ };
9
+ hovered: {
10
+ type: BooleanConstructor;
11
+ };
12
+ dateTo: {
13
+ type: StringConstructor;
14
+ };
15
+ dateFrom: {
16
+ type: StringConstructor;
17
+ };
18
+ month: {
19
+ type: StringConstructor;
20
+ };
21
+ min: {
22
+ type: NumberConstructor;
23
+ };
24
+ max: {
25
+ type: NumberConstructor;
26
+ };
27
+ disabled: {
28
+ type: BooleanConstructor;
29
+ reflect: boolean;
30
+ };
31
+ disabledDays: {
32
+ type: ArrayConstructor;
33
+ };
34
+ hoveredDate: {
35
+ type: StringConstructor;
36
+ };
37
+ isCurrentDate: {
38
+ type: BooleanConstructor;
39
+ };
40
+ locale: {
41
+ type: ObjectConstructor;
42
+ };
43
+ dateStr: {
44
+ type: StringConstructor;
45
+ };
46
+ renderForDateSlot: {
47
+ type: BooleanConstructor;
48
+ };
49
+ };
50
+ static get styles(): import("lit").CSSResult[];
51
+ day: any;
52
+ selected: boolean;
53
+ hovered: boolean;
54
+ dateTo: any;
55
+ dateFrom: any;
56
+ month: any;
57
+ min: any;
58
+ max: any;
59
+ disabled: boolean;
60
+ disabledDays: any[];
61
+ hoveredDate: any;
62
+ isCurrentDate: boolean;
63
+ _locale: any;
64
+ dateStr: string;
65
+ renderForDateSlot: boolean;
66
+ runtimeUtils: any;
67
+ popoverTag: any;
68
+ set locale(value: any);
69
+ get locale(): any;
70
+ /**
71
+ * Handles selected and hovered states of the calendar cell when the date changes.
72
+ * @private
73
+ * @param {Number} dateFrom - Depart date.
74
+ * @param {Number} dateTo - Return date.
75
+ * @param {Number} hoveredDate - Hovered date.
76
+ * @param {Object} day - An object containing the dateFrom and day of month values.
77
+ * @returns {void}
78
+ */
79
+ private dateChanged;
80
+ /**
81
+ * Handles user click events and calls datepicker to update the value(s).
82
+ * @private
83
+ * @returns {void}
84
+ */
85
+ private handleTap;
86
+ /**
87
+ * Handles user hover events and dispatches a custom event.
88
+ * @private
89
+ * @returns {void}
90
+ */
91
+ private handleHover;
92
+ /**
93
+ * Checks if the current date is a valid date depending on the min and max values.
94
+ * @private
95
+ * @param {Object} day - An object containing the dateFrom and day of month values.
96
+ * @param {Number} min - The minimum date value.
97
+ * @param {Number} max - The maximum date value.
98
+ * @param {Array} disabledDays - An array of disabled dates.
99
+ * @returns {Boolean} - True if the date is disabled.
100
+ */
101
+ private isEnabled;
102
+ /**
103
+ * Checks if the current date is the depart date.
104
+ * @private
105
+ * @param {Object} day - An object containing the dateFrom and day of month values.
106
+ * @param {Number} dateFrom - Depart date.
107
+ * @returns {Boolean} True if the date is the depart date.
108
+ */
109
+ private isDepartDate;
110
+ /**
111
+ * Checks if the current date is the return date.
112
+ * @private
113
+ * @param {Object} day - An object containing the dateFrom and day of month values.
114
+ * @param {Number} dateFrom - Depart date.
115
+ * @param {Number} dateTo - Return date.
116
+ * @returns {Boolean} True if the date is the return date.
117
+ */
118
+ private isReturnDate;
119
+ /**
120
+ * Checks if the current date is between dateFrom and dateTo.
121
+ * @private
122
+ * @param {Object} day - An object containing the dateFrom and day of month values.
123
+ * @param {Number} dateFrom - Depart date.
124
+ * @param {Number} dateTo - Return date.
125
+ * @returns {Boolean} True if the current date is between dateFrom and dateTo.
126
+ */
127
+ private isInRange;
128
+ /**
129
+ * Determines the hovered date appearing latest in the calendar.
130
+ * @private
131
+ * @param {Object} day - An object containing the dateFrom and day of month values.
132
+ * @param {Number} dateFrom - Depart date.
133
+ * @param {Number} dateTo - Return date.
134
+ * @param {Number} hoveredDate - Hovered date.
135
+ * @returns {Boolean} True if the hovered date is the latest hovered date in the calendar.
136
+ */
137
+ private isLastHoveredDate;
138
+ /**
139
+ * Determines the title of the auro-calendar-cell.
140
+ * @private
141
+ * @param {Number} date - The date of the auro-calendar-cell.
142
+ * @returns {String} The title of the auro-calendar-cell in the user's locale.
143
+ */
144
+ private getTitle;
145
+ /**
146
+ * Gets the name of the date slot.
147
+ * @private
148
+ * @returns {void}
149
+ */
150
+ private setDateSlotName;
151
+ /**
152
+ * Remove existing cell slot content and clone any current slot content from the root `auro-datepicker` which matches this cells date.
153
+ * @private
154
+ * @returns {void}
155
+ */
156
+ private handleSlotContent;
157
+ firstUpdated(): void;
158
+ datepicker: any;
159
+ auroPopover: any;
160
+ updated(properties: any): void;
161
+ render(): import("lit-html").TemplateResult;
162
+ }
163
+ import { LitElement } from "lit";
@@ -0,0 +1,20 @@
1
+ export class AuroCalendarMonth extends RangeDatepickerCalendar {
2
+ static get styles(): import("lit").CSSResult[];
3
+ static get properties(): {
4
+ /**
5
+ * @private
6
+ */
7
+ monthFirst: {
8
+ type: BooleanConstructor;
9
+ reflect: boolean;
10
+ };
11
+ };
12
+ /**
13
+ * Returns month name to be rendered in the calendar header.
14
+ * @private
15
+ * @param {Number} month - The month number (1-12).
16
+ * @returns {String} The name of the month.
17
+ */
18
+ private computeCurrentMonthName;
19
+ }
20
+ import { RangeDatepickerCalendar } from './vendor/wc-range-datepicker/range-datepicker-calendar.js';
@@ -0,0 +1,133 @@
1
+ /**
2
+ * @prop {Object} firstDayOfWeek - Weekday that will be displayed in first column of month grid.
3
+ * 0: sunday, 1: monday, 2: tuesday, 3: wednesday , 4: thursday, 5: friday, 6: saturday
4
+ * Default is 0.
5
+ * @prop {Date | null} focusedDate - The currently focused date (if any).
6
+ * @prop {Date} maxDate - Maximum date. All dates after will be disabled.
7
+ * @prop {Date} minDate - Minimum date. All dates before will be disabled.
8
+ * @prop {Date | undefined} selectedDate - The selected date, usually synchronized with datepicker-input.
9
+ * Not to be confused with the focused date (therefore not necessarily in active month view).
10
+ * @prop {string} weekdayHeaderNotation - Weekday header notation, based on Intl DatetimeFormat:.
11
+ * @prop {Boolean} visible - Flag indicating if the calendar is visible.
12
+ * - 'short' (e.g., Thu)
13
+ * - 'narrow' (e.g., T).
14
+ * Default is 'short'.
15
+ * @event auroCalendar-dateSelected - Notifies that a date has been selected in the calendar.
16
+ * @event auroCalendar-monthChanged - Notifies that the visible calendar month(s) have changed.
17
+ */
18
+ export class AuroCalendar extends RangeDatepicker {
19
+ static get styles(): import("lit").CSSResult[];
20
+ static get properties(): {
21
+ numCalendars: {
22
+ type: NumberConstructor;
23
+ };
24
+ dateFrom: {
25
+ type: StringConstructor;
26
+ };
27
+ dateTo: {
28
+ type: StringConstructor;
29
+ };
30
+ maxDate: {
31
+ type: StringConstructor;
32
+ reflect: boolean;
33
+ };
34
+ minDate: {
35
+ type: StringConstructor;
36
+ reflect: boolean;
37
+ };
38
+ calendarStartMonth: {
39
+ type: StringConstructor;
40
+ reflect: boolean;
41
+ };
42
+ calendarEndMonth: {
43
+ type: StringConstructor;
44
+ reflect: boolean;
45
+ };
46
+ centralDate: {
47
+ type: StringConstructor;
48
+ reflect: boolean;
49
+ };
50
+ visible: {
51
+ type: BooleanConstructor;
52
+ reflect: boolean;
53
+ };
54
+ largeFullscreenHeadline: {
55
+ type: BooleanConstructor;
56
+ reflect: boolean;
57
+ };
58
+ isFullscreen: {
59
+ type: BooleanConstructor;
60
+ reflect: boolean;
61
+ };
62
+ dropdown: {
63
+ type: ObjectConstructor;
64
+ };
65
+ /**
66
+ * @private
67
+ */
68
+ monthFirst: {
69
+ type: BooleanConstructor;
70
+ };
71
+ };
72
+ /**
73
+ * @private
74
+ */
75
+ private util;
76
+ /**
77
+ * @private
78
+ */
79
+ private utilCal;
80
+ /**
81
+ * @private
82
+ */
83
+ private utilCalRender;
84
+ calendarStartDate: any;
85
+ calendarEndDate: any;
86
+ centralDate: any;
87
+ showPrevMonthBtn: boolean;
88
+ showNextMonthBtn: boolean;
89
+ visible: boolean;
90
+ largeFullscreenHeadline: boolean;
91
+ isFullscreen: boolean;
92
+ /**
93
+ * @private
94
+ */
95
+ private firstMonthRenderable;
96
+ /**
97
+ * @private
98
+ */
99
+ private calendarRangeMonths;
100
+ /**
101
+ * @private
102
+ */
103
+ private numCalendars;
104
+ /**
105
+ * @private
106
+ */
107
+ private slots;
108
+ /**
109
+ * @private
110
+ */
111
+ private bibtemplateTag;
112
+ /**
113
+ * @private
114
+ */
115
+ private buttonTag;
116
+ dropdown: any;
117
+ /**
118
+ * Renders all of the auro-calendar-months HTML.
119
+ * @private
120
+ * @returns {Object} Returns the auro-calendar-months HTML.
121
+ */
122
+ private renderAllCalendars;
123
+ firstRenderedMonth: any;
124
+ /**
125
+ * Request the calendar be scrolled to a given date.
126
+ * @param {String} date - The date to scroll into view.
127
+ * @returns {void}
128
+ */
129
+ scrollMonthIntoView(date: string): void;
130
+ injectSlot(slotName: any, nodes: any): void;
131
+ render(): import("lit-html").TemplateResult;
132
+ }
133
+ import { RangeDatepicker } from './vendor/wc-range-datepicker/range-datepicker.js';