@aurodesignsystem/auro-formkit 2.0.0-beta.27 → 2.0.0-beta.29
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/cache/019608f754b4fd0c-meta.json +1 -0
- package/.turbo/cache/019608f754b4fd0c.tar.zst +0 -0
- package/.turbo/cache/06322ed0d04880b4-meta.json +1 -0
- package/.turbo/cache/06322ed0d04880b4.tar.zst +0 -0
- package/.turbo/cache/0b25a5384daf4b43-meta.json +1 -0
- package/.turbo/cache/0b25a5384daf4b43.tar.zst +0 -0
- package/.turbo/cache/18ce0cc67c14e0c9-meta.json +1 -0
- package/.turbo/cache/18ce0cc67c14e0c9.tar.zst +0 -0
- package/.turbo/cache/1d4280429ff4222f-meta.json +1 -0
- package/.turbo/cache/1d4280429ff4222f.tar.zst +0 -0
- package/.turbo/cache/1e42bb6f66cd5516-meta.json +1 -0
- package/.turbo/cache/1e42bb6f66cd5516.tar.zst +0 -0
- package/.turbo/cache/202a84630d73699f-meta.json +1 -0
- package/.turbo/cache/202a84630d73699f.tar.zst +0 -0
- package/.turbo/cache/251ba344c6338ba3-meta.json +1 -0
- package/.turbo/cache/251ba344c6338ba3.tar.zst +0 -0
- package/.turbo/cache/298b6ff0272e6226-meta.json +1 -0
- package/.turbo/cache/298b6ff0272e6226.tar.zst +0 -0
- package/.turbo/cache/2abb5400a01a1694-meta.json +1 -0
- package/.turbo/cache/2abb5400a01a1694.tar.zst +0 -0
- package/.turbo/cache/30fda91ef83677e4-meta.json +1 -0
- package/.turbo/cache/3221d91a94756c26-meta.json +1 -0
- package/.turbo/cache/3221d91a94756c26.tar.zst +0 -0
- package/.turbo/cache/3ab09fe7cf32b3bf-meta.json +1 -0
- package/.turbo/cache/3ab09fe7cf32b3bf.tar.zst +0 -0
- package/.turbo/cache/3b758f5ca6cedcac-meta.json +1 -0
- package/.turbo/cache/3b758f5ca6cedcac.tar.zst +0 -0
- package/.turbo/cache/3f1b3db13386acdc-meta.json +1 -0
- package/.turbo/cache/{67c3255b202e500b.tar.zst → 3f1b3db13386acdc.tar.zst} +0 -0
- package/.turbo/cache/430c124614841675-meta.json +1 -0
- package/.turbo/cache/430c124614841675.tar.zst +0 -0
- package/.turbo/cache/4472ff3b156042a3-meta.json +1 -0
- package/.turbo/cache/4472ff3b156042a3.tar.zst +0 -0
- package/.turbo/cache/448b2ae2221bf660-meta.json +1 -0
- package/.turbo/cache/448b2ae2221bf660.tar.zst +0 -0
- package/.turbo/cache/45bdeb0396723b25-meta.json +1 -0
- package/.turbo/cache/45bdeb0396723b25.tar.zst +0 -0
- package/.turbo/cache/4655a084a08732a7-meta.json +1 -0
- package/.turbo/cache/4655a084a08732a7.tar.zst +0 -0
- package/.turbo/cache/46f08b3f239b6b3c-meta.json +1 -0
- package/.turbo/cache/46f08b3f239b6b3c.tar.zst +0 -0
- package/.turbo/cache/4e9c9a5dd62c50a4-meta.json +1 -0
- package/.turbo/cache/4f06a06e4f458e75-meta.json +1 -0
- package/.turbo/cache/4f06a06e4f458e75.tar.zst +0 -0
- package/.turbo/cache/4f0d7e7df611108b-meta.json +1 -0
- package/.turbo/cache/4f0d7e7df611108b.tar.zst +0 -0
- package/.turbo/cache/533b2c6c9fb1166a-meta.json +1 -0
- package/.turbo/cache/533b2c6c9fb1166a.tar.zst +0 -0
- package/.turbo/cache/560d172ca96e1544-meta.json +1 -0
- package/.turbo/cache/560d172ca96e1544.tar.zst +0 -0
- package/.turbo/cache/59481fd7f6f355ed-meta.json +1 -0
- package/.turbo/cache/59481fd7f6f355ed.tar.zst +0 -0
- package/.turbo/cache/5fc9a7a072827b7b-meta.json +1 -0
- package/.turbo/cache/5fc9a7a072827b7b.tar.zst +0 -0
- package/.turbo/cache/753b119a389426be-meta.json +1 -0
- package/.turbo/cache/753b119a389426be.tar.zst +0 -0
- package/.turbo/cache/8ac38d70a60381cb-meta.json +1 -0
- package/.turbo/cache/8ac38d70a60381cb.tar.zst +0 -0
- package/.turbo/cache/8c637a8d4c2166c5-meta.json +1 -0
- package/.turbo/cache/8c637a8d4c2166c5.tar.zst +0 -0
- package/.turbo/cache/9dc293081f28a24d-meta.json +1 -0
- package/.turbo/cache/{a78d125599f040ae.tar.zst → 9dc293081f28a24d.tar.zst} +0 -0
- package/.turbo/cache/a7dea1f1ae1fdc27-meta.json +1 -0
- package/.turbo/cache/a7dea1f1ae1fdc27.tar.zst +0 -0
- package/.turbo/cache/a9db8818bc92a60e-meta.json +1 -0
- package/.turbo/cache/{b49dd5629527427d.tar.zst → a9db8818bc92a60e.tar.zst} +0 -0
- package/.turbo/cache/bae62d7b71b88997-meta.json +1 -0
- package/.turbo/cache/bb3131b31c8adc36-meta.json +1 -0
- package/.turbo/cache/bb3131b31c8adc36.tar.zst +0 -0
- package/.turbo/cache/bf3d1eace5e676f9-meta.json +1 -0
- package/.turbo/cache/bf3d1eace5e676f9.tar.zst +0 -0
- package/.turbo/cache/c45962e00a15f78b-meta.json +1 -0
- package/.turbo/cache/c49eaa579b60f045-meta.json +1 -0
- package/.turbo/cache/cbc12d12ec0e13ca-meta.json +1 -0
- package/.turbo/cache/{8e3c73cbb92b3ac8.tar.zst → cbc12d12ec0e13ca.tar.zst} +0 -0
- package/.turbo/cache/cbcd9db8ac9a2d52-meta.json +1 -0
- package/.turbo/cache/d3afdb9a7db9eacc-meta.json +1 -0
- package/.turbo/cache/d3afdb9a7db9eacc.tar.zst +0 -0
- package/.turbo/cache/d7d47541c105641f-meta.json +1 -0
- package/.turbo/cache/d8ecdff9c663c38e-meta.json +1 -0
- package/.turbo/cache/de494df6a3006101-meta.json +1 -0
- package/.turbo/cache/de494df6a3006101.tar.zst +0 -0
- package/.turbo/cache/e56a9865641ec3e8-meta.json +1 -0
- package/.turbo/cache/e56a9865641ec3e8.tar.zst +0 -0
- package/.turbo/cache/e7ed9e7056d80938-meta.json +1 -0
- package/.turbo/cache/e837827cd24834c4-meta.json +1 -0
- package/.turbo/cache/e837827cd24834c4.tar.zst +0 -0
- package/.turbo/cache/e95a7d076e700003-meta.json +1 -0
- package/.turbo/cache/{abfe0e87025ae648.tar.zst → e95a7d076e700003.tar.zst} +0 -0
- package/.turbo/cache/e9ff93179777aa26-meta.json +1 -0
- package/.turbo/cache/{2e1456ec1a7873f7.tar.zst → e9ff93179777aa26.tar.zst} +0 -0
- package/.turbo/cache/f571abacf9ec4e84-meta.json +1 -0
- package/.turbo/cache/f571abacf9ec4e84.tar.zst +0 -0
- package/.turbo/cache/f7ab9a13f9acc0ab-meta.json +1 -0
- package/.turbo/cache/f7ab9a13f9acc0ab.tar.zst +0 -0
- package/.turbo/cache/fa0bc0a1d41397e8-meta.json +1 -0
- package/.turbo/cache/fa0bc0a1d41397e8.tar.zst +0 -0
- package/.turbo/cache/fce6b6ea288791bf-meta.json +1 -0
- package/.turbo/cache/ff3c8a3042cab66e-meta.json +1 -0
- package/.turbo/cache/ff3c8a3042cab66e.tar.zst +0 -0
- package/CHANGELOG.md +31 -0
- package/components/checkbox/.turbo/turbo-build.log +3 -3
- package/components/checkbox/README.md +1 -1
- package/components/checkbox/demo/api.md +0 -1
- package/components/checkbox/demo/api.min.js +252 -41
- package/components/checkbox/demo/index.min.js +252 -41
- package/components/checkbox/dist/auro-checkbox-group.d.ts.map +1 -1
- package/components/checkbox/dist/index.js +252 -41
- package/components/checkbox/package.json +1 -0
- package/components/checkbox/src/auro-checkbox-group.js +6 -4
- package/components/checkbox/src/styles/colorGroup-css.js +1 -1
- package/components/checkbox/src/styles/colorGroup.css +0 -8
- package/components/checkbox/src/styles/colorGroup.scss +0 -8
- package/components/checkbox/src/styles/tokens-css.js +1 -1
- package/components/checkbox/src/styles/tokens.css +0 -1
- package/components/checkbox/src/styles/tokens.scss +0 -1
- package/components/combobox/.turbo/turbo-build.log +2 -2
- package/components/combobox/README.md +4 -4
- package/components/combobox/demo/api.min.js +611 -185
- package/components/combobox/demo/index.min.js +611 -185
- package/components/combobox/dist/index.js +582 -156
- package/components/combobox/src/auro-combobox.js +4 -4
- package/components/counter/.turbo/turbo-build.log +12 -3
- package/components/counter/.turbo/turbo-bundler.log +9 -3
- package/components/counter/README.md +1 -1
- package/components/counter/demo/api.min.js +163 -3126
- package/components/counter/demo/index.min.js +163 -3126
- package/components/counter/dist/index.js +163 -3126
- package/components/counter/src/styles/counter-button.css +1 -1
- package/components/datepicker/.turbo/turbo-build.log +2 -2
- package/components/datepicker/README.md +4 -4
- package/components/datepicker/demo/api.min.js +712 -286
- package/components/datepicker/demo/index.min.js +712 -286
- package/components/datepicker/dist/index.js +712 -286
- package/components/datepicker/src/auro-datepicker.js +4 -4
- package/components/datepicker/src/styles/style-css.js +1 -1
- package/components/datepicker/src/styles/style.css +0 -6
- package/components/datepicker/src/styles/style.scss +0 -6
- package/components/dropdown/.turbo/turbo-build.log +3 -3
- package/components/dropdown/README.md +1 -1
- package/components/dropdown/demo/api.md +0 -1
- package/components/dropdown/demo/api.min.js +259 -50
- package/components/dropdown/demo/index.min.js +259 -50
- package/components/dropdown/dist/auro-dropdown.d.ts.map +1 -1
- package/components/dropdown/dist/index.js +259 -50
- package/components/dropdown/package.json +1 -0
- package/components/dropdown/src/auro-dropdown.js +4 -5
- package/components/dropdown/src/styles/color-css.js +1 -1
- package/components/dropdown/src/styles/color.css +0 -5
- package/components/dropdown/src/styles/color.scss +0 -5
- package/components/dropdown/src/styles/style-css.js +1 -1
- package/components/dropdown/src/styles/style.css +0 -6
- package/components/dropdown/src/styles/style.scss +0 -6
- package/components/dropdown/src/styles/tokens-css.js +1 -1
- package/components/dropdown/src/styles/tokens.css +0 -1
- package/components/dropdown/src/styles/tokens.scss +0 -1
- package/components/form/.turbo/turbo-build.log +3 -3
- package/components/form/.turbo/turbo-bundler.log +3 -3
- package/components/form/README.md +1 -1
- package/components/form/demo/api.min.js +62 -14
- package/components/form/demo/index.min.js +62 -14
- package/components/form/dist/auro-form.d.ts +19 -4
- package/components/form/dist/auro-form.d.ts.map +1 -1
- package/components/form/dist/index.js +62 -14
- package/components/form/src/auro-form.js +62 -14
- package/components/form/src/styles/style.css +1 -1
- package/components/helptext/.stylelintrc.json +3 -0
- package/components/helptext/.turbo/turbo-build$colon$sass.log +34 -0
- package/components/helptext/.turbo/turbo-build.log +49 -0
- package/components/helptext/.turbo/turbo-bundler.log +7 -0
- package/components/helptext/.turbo/turbo-postCss$colon$component.log +4 -0
- package/components/helptext/.turbo/turbo-sass$colon$render.log +22 -0
- package/components/helptext/.turbo/turbo-types.log +4 -0
- package/components/helptext/dist/auro-helptext.d.ts +46 -0
- package/components/helptext/dist/auro-helptext.d.ts.map +1 -0
- package/components/helptext/dist/index.d.ts +3 -0
- package/components/helptext/dist/index.d.ts.map +1 -0
- package/components/helptext/dist/index.js +212 -0
- package/components/{input/dist/styles/helpText-css.d.ts → helptext/dist/styles/color-css.d.ts} +1 -1
- package/components/helptext/dist/styles/color-css.d.ts.map +1 -0
- package/components/helptext/dist/styles/style-css.d.ts +3 -0
- package/components/helptext/dist/styles/style-css.d.ts.map +1 -0
- package/components/helptext/dist/styles/tokens-css.d.ts +3 -0
- package/components/helptext/dist/styles/tokens-css.d.ts.map +1 -0
- package/components/helptext/node_modules/chalk/package.json +83 -0
- package/components/helptext/node_modules/chalk/readme.md +297 -0
- package/components/helptext/node_modules/chalk/source/index.d.ts +325 -0
- package/components/helptext/node_modules/chalk/source/index.js +225 -0
- package/components/helptext/node_modules/chalk/source/utilities.js +33 -0
- package/components/helptext/node_modules/chalk/source/vendor/ansi-styles/index.d.ts +236 -0
- package/components/helptext/node_modules/chalk/source/vendor/ansi-styles/index.js +223 -0
- package/components/helptext/node_modules/chalk/source/vendor/supports-color/browser.d.ts +1 -0
- package/components/helptext/node_modules/chalk/source/vendor/supports-color/browser.js +34 -0
- package/components/helptext/node_modules/chalk/source/vendor/supports-color/index.d.ts +55 -0
- package/components/helptext/node_modules/chalk/source/vendor/supports-color/index.js +182 -0
- package/components/helptext/package.json +57 -0
- package/components/helptext/src/auro-helptext.js +115 -0
- package/components/helptext/src/index.js +6 -0
- package/components/helptext/src/styles/color-css.js +2 -0
- package/components/helptext/src/styles/color.css +8 -0
- package/components/helptext/src/styles/color.scss +11 -0
- package/components/helptext/src/styles/style-css.js +2 -0
- package/components/helptext/src/styles/style.css +20 -0
- package/components/helptext/src/styles/style.scss +30 -0
- package/components/helptext/src/styles/tokens-css.js +2 -0
- package/components/helptext/src/styles/tokens.css +3 -0
- package/components/helptext/src/styles/tokens.scss +5 -0
- package/components/input/.turbo/turbo-build$colon$sass.log +3 -13
- package/components/input/.turbo/turbo-build.log +6 -16
- package/components/input/.turbo/turbo-sass$colon$render.log +0 -6
- package/components/input/README.md +1 -1
- package/components/input/demo/api.md +0 -1
- package/components/input/demo/api.min.js +317 -100
- package/components/input/demo/index.min.js +317 -100
- package/components/input/dist/auro-input.d.ts.map +1 -1
- package/components/input/dist/index.js +317 -100
- package/components/input/package.json +1 -0
- package/components/input/src/auro-input.js +18 -10
- package/components/input/src/styles/color-css.js +1 -1
- package/components/input/src/styles/color.css +0 -5
- package/components/input/src/styles/color.scss +0 -5
- package/components/input/src/styles/style-css.js +1 -1
- package/components/input/src/styles/style.css +0 -7
- package/components/input/src/styles/style.scss +0 -1
- package/components/input/src/styles/tokens-css.js +1 -1
- package/components/input/src/styles/tokens.css +0 -1
- package/components/input/src/styles/tokens.scss +0 -1
- package/components/menu/.turbo/turbo-build.log +3 -3
- package/components/menu/.turbo/turbo-bundler.log +3 -3
- package/components/menu/README.md +1 -1
- package/components/menu/src/styles/style-menu.css +1 -1
- package/components/radio/.turbo/turbo-build.log +3 -3
- package/components/radio/README.md +1 -1
- package/components/radio/demo/api.md +0 -1
- package/components/radio/demo/api.min.js +249 -39
- package/components/radio/demo/index.min.js +249 -39
- package/components/radio/dist/auro-radio-group.d.ts.map +1 -1
- package/components/radio/dist/index.js +249 -39
- package/components/radio/package.json +1 -0
- package/components/radio/src/auro-radio-group.js +5 -4
- package/components/radio/src/styles/groupColor-css.js +1 -1
- package/components/radio/src/styles/groupColor.css +0 -8
- package/components/radio/src/styles/groupColor.scss +0 -8
- package/components/radio/src/styles/tokens-css.js +1 -1
- package/components/radio/src/styles/tokens.css +0 -1
- package/components/radio/src/styles/tokens.scss +0 -1
- package/components/select/.turbo/turbo-build.log +3 -3
- package/components/select/README.md +3 -3
- package/components/select/demo/api.min.js +306 -97
- package/components/select/demo/index.min.js +306 -97
- package/components/select/dist/index.js +275 -66
- package/components/select/src/auro-select.js +6 -6
- package/components/select/src/styles/style-css.js +1 -1
- package/components/select/src/styles/style.css +0 -6
- package/components/select/src/styles/style.scss +0 -6
- package/package.json +4 -1
- package/turbo.json +29 -1
- package/.turbo/cache/0c0a0bc31b8aab59-meta.json +0 -1
- package/.turbo/cache/0c0a0bc31b8aab59.tar.zst +0 -0
- package/.turbo/cache/0cbb56c99e650fa0-meta.json +0 -1
- package/.turbo/cache/0cbb56c99e650fa0.tar.zst +0 -0
- package/.turbo/cache/0fba2ec59e2dfd8b-meta.json +0 -1
- package/.turbo/cache/0fba2ec59e2dfd8b.tar.zst +0 -0
- package/.turbo/cache/163b3258a0fedac8-meta.json +0 -1
- package/.turbo/cache/163b3258a0fedac8.tar.zst +0 -0
- package/.turbo/cache/17d8b8bd7a2d45c8-meta.json +0 -1
- package/.turbo/cache/17d8b8bd7a2d45c8.tar.zst +0 -0
- package/.turbo/cache/23e204ed502c21fe-meta.json +0 -1
- package/.turbo/cache/24d7d9090145a626-meta.json +0 -1
- package/.turbo/cache/24d7d9090145a626.tar.zst +0 -0
- package/.turbo/cache/267a4d6654311f2b-meta.json +0 -1
- package/.turbo/cache/285fe2c074654eb2-meta.json +0 -1
- package/.turbo/cache/2e1456ec1a7873f7-meta.json +0 -1
- package/.turbo/cache/2e4e2a1831bef749-meta.json +0 -1
- package/.turbo/cache/2e4e2a1831bef749.tar.zst +0 -0
- package/.turbo/cache/351f58d5c3cae34e-meta.json +0 -1
- package/.turbo/cache/39dc2793eb573623-meta.json +0 -1
- package/.turbo/cache/39dc2793eb573623.tar.zst +0 -0
- package/.turbo/cache/3b1f37014160e895-meta.json +0 -1
- package/.turbo/cache/3b1f37014160e895.tar.zst +0 -0
- package/.turbo/cache/3c1cb8d2e8bec5d5-meta.json +0 -1
- package/.turbo/cache/3c1cb8d2e8bec5d5.tar.zst +0 -0
- package/.turbo/cache/411cfda2c367c29c-meta.json +0 -1
- package/.turbo/cache/411cfda2c367c29c.tar.zst +0 -0
- package/.turbo/cache/4225d94a40fc6659-meta.json +0 -1
- package/.turbo/cache/4225d94a40fc6659.tar.zst +0 -0
- package/.turbo/cache/4359c29d1655eec0-meta.json +0 -1
- package/.turbo/cache/4359c29d1655eec0.tar.zst +0 -0
- package/.turbo/cache/4e34f0f0a9d02732-meta.json +0 -1
- package/.turbo/cache/4e34f0f0a9d02732.tar.zst +0 -0
- package/.turbo/cache/4e4992ed3be45c2f-meta.json +0 -1
- package/.turbo/cache/4e4992ed3be45c2f.tar.zst +0 -0
- package/.turbo/cache/4fb77e22ffd90112-meta.json +0 -1
- package/.turbo/cache/4fb77e22ffd90112.tar.zst +0 -0
- package/.turbo/cache/52dce5349ebee512-meta.json +0 -1
- package/.turbo/cache/52dce5349ebee512.tar.zst +0 -0
- package/.turbo/cache/558b31cc05ccc960-meta.json +0 -1
- package/.turbo/cache/64424afa661a9d52-meta.json +0 -1
- package/.turbo/cache/64424afa661a9d52.tar.zst +0 -0
- package/.turbo/cache/67c3255b202e500b-meta.json +0 -1
- package/.turbo/cache/6c9f48c7e69a2ec0-meta.json +0 -1
- package/.turbo/cache/6c9f48c7e69a2ec0.tar.zst +0 -0
- package/.turbo/cache/6f7bdd4097644495-meta.json +0 -1
- package/.turbo/cache/6f7bdd4097644495.tar.zst +0 -0
- package/.turbo/cache/704a22f3a6a32426-meta.json +0 -1
- package/.turbo/cache/704a22f3a6a32426.tar.zst +0 -0
- package/.turbo/cache/766995ed5805f011-meta.json +0 -1
- package/.turbo/cache/766995ed5805f011.tar.zst +0 -0
- package/.turbo/cache/782ea8bf6bfd8203-meta.json +0 -1
- package/.turbo/cache/782ea8bf6bfd8203.tar.zst +0 -0
- package/.turbo/cache/78968f685c031ba1-meta.json +0 -1
- package/.turbo/cache/78968f685c031ba1.tar.zst +0 -0
- package/.turbo/cache/78e014dddc2d6125-meta.json +0 -1
- package/.turbo/cache/78e014dddc2d6125.tar.zst +0 -0
- package/.turbo/cache/7a92232f5b7d1032-meta.json +0 -1
- package/.turbo/cache/7a92232f5b7d1032.tar.zst +0 -0
- package/.turbo/cache/87987f08153b356f-meta.json +0 -1
- package/.turbo/cache/87987f08153b356f.tar.zst +0 -0
- package/.turbo/cache/8c6d632132b58f2a-meta.json +0 -1
- package/.turbo/cache/8c6d632132b58f2a.tar.zst +0 -0
- package/.turbo/cache/8e3c73cbb92b3ac8-meta.json +0 -1
- package/.turbo/cache/939b09d0d5a44a8e-meta.json +0 -1
- package/.turbo/cache/939b09d0d5a44a8e.tar.zst +0 -0
- package/.turbo/cache/951037a4bb464cc3-meta.json +0 -1
- package/.turbo/cache/951037a4bb464cc3.tar.zst +0 -0
- package/.turbo/cache/9584055bc0f88083-meta.json +0 -1
- package/.turbo/cache/9584055bc0f88083.tar.zst +0 -0
- package/.turbo/cache/972125b3b011cd6f-meta.json +0 -1
- package/.turbo/cache/a07fca2bec5e088a-meta.json +0 -1
- package/.turbo/cache/a07fca2bec5e088a.tar.zst +0 -0
- package/.turbo/cache/a1f17a427205f758-meta.json +0 -1
- package/.turbo/cache/a78d125599f040ae-meta.json +0 -1
- package/.turbo/cache/abfe0e87025ae648-meta.json +0 -1
- package/.turbo/cache/ad140cc079669a3d-meta.json +0 -1
- package/.turbo/cache/ad140cc079669a3d.tar.zst +0 -0
- package/.turbo/cache/af78f67fd46864cf-meta.json +0 -1
- package/.turbo/cache/af78f67fd46864cf.tar.zst +0 -0
- package/.turbo/cache/b49dd5629527427d-meta.json +0 -1
- package/.turbo/cache/b6d9b63450b2be32-meta.json +0 -1
- package/.turbo/cache/b6d9b63450b2be32.tar.zst +0 -0
- package/.turbo/cache/b9b3700e26eea28f-meta.json +0 -1
- package/.turbo/cache/b9b3700e26eea28f.tar.zst +0 -0
- package/.turbo/cache/be2163f79158c78f-meta.json +0 -1
- package/.turbo/cache/be2163f79158c78f.tar.zst +0 -0
- package/.turbo/cache/c3d8dc6e45d0331b-meta.json +0 -1
- package/.turbo/cache/c3d8dc6e45d0331b.tar.zst +0 -0
- package/.turbo/cache/c688990b9f5a9adc-meta.json +0 -1
- package/.turbo/cache/c688990b9f5a9adc.tar.zst +0 -0
- package/.turbo/cache/c77c96d6a2d1be7d-meta.json +0 -1
- package/.turbo/cache/c77c96d6a2d1be7d.tar.zst +0 -0
- package/.turbo/cache/ccaf1a2accea911b-meta.json +0 -1
- package/.turbo/cache/d40c3723f98d81cd-meta.json +0 -1
- package/.turbo/cache/d40c3723f98d81cd.tar.zst +0 -0
- package/.turbo/cache/e118c1013f86c6e8-meta.json +0 -1
- package/.turbo/cache/e16b24ee6e7c1e50-meta.json +0 -1
- package/.turbo/cache/e16b24ee6e7c1e50.tar.zst +0 -0
- package/.turbo/cache/f77e5f0c843f7f08-meta.json +0 -1
- package/.turbo/cache/f77e5f0c843f7f08.tar.zst +0 -0
- package/.turbo/cache/f90d7f40233634c8-meta.json +0 -1
- package/components/checkbox/.turbo/turbo-bundler.log +0 -13
- package/components/checkbox/.turbo/turbo-types.log +0 -4
- package/components/dropdown/.turbo/turbo-build$colon$version.log +0 -7
- package/components/dropdown/.turbo/turbo-bundler.log +0 -13
- package/components/dropdown/.turbo/turbo-types.log +0 -4
- package/components/input/.turbo/turbo-build$colon$version.log +0 -10
- package/components/input/.turbo/turbo-bundler.log +0 -13
- package/components/input/.turbo/turbo-types.log +0 -4
- package/components/input/dist/styles/helpText-css.d.ts.map +0 -1
- package/components/input/src/styles/helpText-css.js +0 -2
- package/components/input/src/styles/helpText.css +0 -6
- package/components/input/src/styles/helpText.scss +0 -9
- package/components/radio/.turbo/turbo-bundler.log +0 -13
- package/components/radio/.turbo/turbo-types.log +0 -4
- /package/.turbo/cache/{351f58d5c3cae34e.tar.zst → 30fda91ef83677e4.tar.zst} +0 -0
- /package/.turbo/cache/{ccaf1a2accea911b.tar.zst → 4e9c9a5dd62c50a4.tar.zst} +0 -0
- /package/.turbo/cache/{23e204ed502c21fe.tar.zst → bae62d7b71b88997.tar.zst} +0 -0
- /package/.turbo/cache/{e118c1013f86c6e8.tar.zst → c45962e00a15f78b.tar.zst} +0 -0
- /package/.turbo/cache/{267a4d6654311f2b.tar.zst → c49eaa579b60f045.tar.zst} +0 -0
- /package/.turbo/cache/{f90d7f40233634c8.tar.zst → cbcd9db8ac9a2d52.tar.zst} +0 -0
- /package/.turbo/cache/{285fe2c074654eb2.tar.zst → d7d47541c105641f.tar.zst} +0 -0
- /package/.turbo/cache/{972125b3b011cd6f.tar.zst → d8ecdff9c663c38e.tar.zst} +0 -0
- /package/.turbo/cache/{558b31cc05ccc960.tar.zst → e7ed9e7056d80938.tar.zst} +0 -0
- /package/.turbo/cache/{a1f17a427205f758.tar.zst → fce6b6ea288791bf.tar.zst} +0 -0
|
@@ -1,66 +1,68 @@
|
|
|
1
|
+
import { AuroDropdown } from '@aurodesignsystem/auro-dropdown';
|
|
2
|
+
|
|
1
3
|
/**
|
|
2
4
|
* @license
|
|
3
5
|
* Copyright 2019 Google LLC
|
|
4
6
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
5
7
|
*/
|
|
6
|
-
const t$
|
|
8
|
+
const t$2=globalThis,e$4=t$2.ShadowRoot&&(undefined===t$2.ShadyCSS||t$2.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$2=Symbol(),o$4=new WeakMap;let n$3 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$2)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$4&&undefined===t){const e=undefined!==s&&1===s.length;e&&(t=o$4.get(s)),undefined===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$4.set(s,t));}return t}toString(){return this.cssText}};const r$3=t=>new n$3("string"==typeof t?t:t+"",undefined,s$2),i$5=(t,...e)=>{const o=1===t.length?t[0]:e.reduce(((e,s,o)=>e+(t=>{if(true===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1]),t[0]);return new n$3(o,t,s$2)},S$1=(s,o)=>{if(e$4)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t$2.litNonce;undefined!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$2=e$4?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$3(e)})(t):t;
|
|
7
9
|
|
|
8
10
|
/**
|
|
9
11
|
* @license
|
|
10
12
|
* Copyright 2017 Google LLC
|
|
11
13
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
12
|
-
*/const{is:i$
|
|
14
|
+
*/const{is:i$4,defineProperty:e$3,getOwnPropertyDescriptor:r$2,getOwnPropertyNames:h$1,getOwnPropertySymbols:o$3,getPrototypeOf:n$2}=Object,a$2=globalThis,c$1=a$2.trustedTypes,l$2=c$1?c$1.emptyScript:"",p$1=a$2.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$2={toAttribute(t,s){switch(s){case Boolean:t=t?l$2:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$1=(t,s)=>!i$4(t,s),y$1={attribute:true,type:String,converter:u$2,reflect:false,hasChanged:f$1};Symbol.metadata??=Symbol("metadata"),a$2.litPropertyMetadata??=new WeakMap;class b extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=y$1){if(s.state&&(s.attribute=false),this._$Ei(),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),r=this.getPropertyDescriptor(t,i,s);undefined!==r&&e$3(this.prototype,t,r);}}static getPropertyDescriptor(t,s,i){const{get:e,set:h}=r$2(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get(){return e?.call(this)},set(s){const r=e?.call(this);h.call(this,s),this.requestUpdate(t,r,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??y$1}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$2(this);t.finalize(),undefined!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...h$1(t),...o$3(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(undefined!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);undefined!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$2(s));}else undefined!==s&&i.push(c$2(s));return i}static _$Eu(t,s){const i=s.attribute;return false===i?undefined:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():undefined}constructor(){super(),this._$Ep=undefined,this.isUpdatePending=false,this.hasUpdated=false,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)));}addController(t){(this._$EO??=new Set).add(t),undefined!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach((t=>t.hostConnected?.()));}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()));}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$EC(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(undefined!==e&&true===i.reflect){const r=(undefined!==i.converter?.toAttribute?i.converter:u$2).toAttribute(s,i.type);this._$Em=t,null==r?this.removeAttribute(e):this.setAttribute(e,r),this._$Em=null;}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(undefined!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),r="function"==typeof t.converter?{fromAttribute:t.converter}:undefined!==t.converter?.fromAttribute?t.converter:u$2;this._$Em=e,this[e]=r.fromAttribute(s,t.type),this._$Em=null;}}requestUpdate(t,s,i){if(undefined!==t){if(i??=this.constructor.getPropertyOptions(t),!(i.hasChanged??f$1)(this[t],s))return;this.P(t,s,i);} false===this.isUpdatePending&&(this._$ES=this._$ET());}P(t,s,i){this._$AL.has(t)||this._$AL.set(t,s),true===i.reflect&&this._$Em!==t&&(this._$Ej??=new Set).add(t);}async _$ET(){this.isUpdatePending=true;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=undefined;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t) true!==i.wrapped||this._$AL.has(s)||undefined===this[s]||this.P(s,this[s],i);}let t=false;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(s)):this._$EU();}catch(s){throw t=false,this._$EU(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=true,this.firstUpdated(t)),this.updated(t);}_$EU(){this._$AL=new Map,this.isUpdatePending=false;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return true}update(t){this._$Ej&&=this._$Ej.forEach((t=>this._$EC(t,this[t]))),this._$EU();}updated(t){}firstUpdated(t){}}b.elementStyles=[],b.shadowRootOptions={mode:"open"},b[d$1("elementProperties")]=new Map,b[d$1("finalized")]=new Map,p$1?.({ReactiveElement:b}),(a$2.reactiveElementVersions??=[]).push("2.0.4");
|
|
13
15
|
|
|
14
16
|
/**
|
|
15
17
|
* @license
|
|
16
18
|
* Copyright 2017 Google LLC
|
|
17
19
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
18
20
|
*/
|
|
19
|
-
const t$
|
|
21
|
+
const t$1=globalThis,i$3=t$1.trustedTypes,s$1=i$3?i$3.createPolicy("lit-html",{createHTML:t=>t}):undefined,e$2="$lit$",h=`lit$${Math.random().toFixed(9).slice(2)}$`,o$2="?"+h,n$1=`<${o$2}>`,r$1=document,l$1=()=>r$1.createComment(""),c=t=>null===t||"object"!=typeof t&&"function"!=typeof t,a$1=Array.isArray,u$1=t=>a$1(t)||"function"==typeof t?.[Symbol.iterator],d="[ \t\n\f\r]",f=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,v=/-->/g,_=/>/g,m=RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),p=/'/g,g=/"/g,$=/^(?:script|style|textarea|title)$/i,y=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),x=y(1),T=Symbol.for("lit-noChange"),E=Symbol.for("lit-nothing"),A=new WeakMap,C=r$1.createTreeWalker(r$1,129);function P(t,i){if(!a$1(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return undefined!==s$1?s$1.createHTML(i):i}const V=(t,i)=>{const s=t.length-1,o=[];let r,l=2===i?"<svg>":3===i?"<math>":"",c=f;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,y=0;for(;y<s.length&&(c.lastIndex=y,u=c.exec(s),null!==u);)y=c.lastIndex,c===f?"!--"===u[1]?c=v:undefined!==u[1]?c=_:undefined!==u[2]?($.test(u[2])&&(r=RegExp("</"+u[2],"g")),c=m):undefined!==u[3]&&(c=m):c===m?">"===u[0]?(c=r??f,d=-1):undefined===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=undefined===u[3]?m:'"'===u[3]?g:p):c===g||c===p?c=m:c===v||c===_?c=f:(c=m,r=undefined);const x=c===m&&t[i+1].startsWith("/>")?" ":"";l+=c===f?s+n$1:d>=0?(o.push(a),s.slice(0,d)+e$2+s.slice(d)+h+x):s+h+(-2===d?i:x);}return [P(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),o]};class N{constructor({strings:t,_$litType$:s},n){let r;this.parts=[];let c=0,a=0;const u=t.length-1,d=this.parts,[f,v]=V(t,s);if(this.el=N.createElement(f,n),C.currentNode=this.el.content,2===s||3===s){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=C.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(e$2)){const i=v[a++],s=r.getAttribute(t).split(h),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:c,name:e[2],strings:s,ctor:"."===e[1]?H:"?"===e[1]?I:"@"===e[1]?L:k}),r.removeAttribute(t);}else t.startsWith(h)&&(d.push({type:6,index:c}),r.removeAttribute(t));if($.test(r.tagName)){const t=r.textContent.split(h),s=t.length-1;if(s>0){r.textContent=i$3?i$3.emptyScript:"";for(let i=0;i<s;i++)r.append(t[i],l$1()),C.nextNode(),d.push({type:2,index:++c});r.append(t[s],l$1());}}}else if(8===r.nodeType)if(r.data===o$2)d.push({type:2,index:c});else {let t=-1;for(;-1!==(t=r.data.indexOf(h,t+1));)d.push({type:7,index:c}),t+=h.length-1;}c++;}}static createElement(t,i){const s=r$1.createElement("template");return s.innerHTML=t,s}}function S(t,i,s=t,e){if(i===T)return i;let h=undefined!==e?s._$Co?.[e]:s._$Cl;const o=c(i)?undefined:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(false),undefined===o?h=undefined:(h=new o(t),h._$AT(t,s,e)),undefined!==e?(s._$Co??=[])[e]=h:s._$Cl=h),undefined!==h&&(i=S(t,h._$AS(t,i.values),h,e)),i}class M{constructor(t,i){this._$AV=[],this._$AN=undefined,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??r$1).importNode(i,true);C.currentNode=e;let h=C.nextNode(),o=0,n=0,l=s[0];for(;undefined!==l;){if(o===l.index){let i;2===l.type?i=new R(h,h.nextSibling,this,t):1===l.type?i=new l.ctor(h,l.name,l.strings,this,t):6===l.type&&(i=new z(h,this,t)),this._$AV.push(i),l=s[++n];}o!==l?.index&&(h=C.nextNode(),o++);}return C.currentNode=r$1,e}p(t){let i=0;for(const s of this._$AV) undefined!==s&&(undefined!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class R{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=E,this._$AN=undefined,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??true;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return undefined!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=S(this,t,i),c(t)?t===E||null==t||""===t?(this._$AH!==E&&this._$AR(),this._$AH=E):t!==this._$AH&&t!==T&&this._(t):undefined!==t._$litType$?this.$(t):undefined!==t.nodeType?this.T(t):u$1(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==E&&c(this._$AH)?this._$AA.nextSibling.data=t:this.T(r$1.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(undefined===s.el&&(s.el=N.createElement(P(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new M(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=A.get(t.strings);return undefined===i&&A.set(t.strings,i=new N(t)),i}k(t){a$1(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const h of t)e===i.length?i.push(s=new R(this.O(l$1()),this.O(l$1()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,i){for(this._$AP?.(false,true,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i;}}setConnected(t){ undefined===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class k{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=E,this._$AN=undefined,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=E;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(undefined===h)t=S(this,t,i,0),o=!c(t)||t!==this._$AH&&t!==T,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=S(this,e[s+n],i,n),r===T&&(r=this._$AH[n]),o||=!c(r)||r!==this._$AH[n],r===E?t=E:t!==E&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===E?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class H extends k{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===E?undefined:t;}}class I extends k{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==E);}}class L extends k{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=S(this,t,i,0)??E)===T)return;const s=this._$AH,e=t===E&&s!==E||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==E&&(s===E||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}}class z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=undefined,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){S(this,t);}}const j=t$1.litHtmlPolyfillSupport;j?.(N,R),(t$1.litHtmlVersions??=[]).push("3.2.1");const B=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(undefined===h){const t=s?.renderBefore??null;e._$litPart$=h=new R(i.insertBefore(l$1(),t),t,undefined,s??{});}return h._$AI(t),h};
|
|
20
22
|
|
|
21
23
|
/**
|
|
22
24
|
* @license
|
|
23
25
|
* Copyright 2017 Google LLC
|
|
24
26
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
25
|
-
*/
|
|
27
|
+
*/class r extends b{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=undefined;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const s=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=B(s,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return T}}r._$litElement$=true,r["finalized"]=true,globalThis.litElementHydrateSupport?.({LitElement:r});const i$2=globalThis.litElementPolyfillSupport;i$2?.({LitElement:r});(globalThis.litElementVersions??=[]).push("4.1.1");
|
|
26
28
|
|
|
27
29
|
/**
|
|
28
30
|
* @license
|
|
29
31
|
* Copyright 2020 Google LLC
|
|
30
32
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
31
33
|
*/
|
|
32
|
-
const a
|
|
34
|
+
const a=Symbol.for(""),o$1=t=>{if(t?.r===a)return t?._$litStatic$},s=t=>({_$litStatic$:t,r:a}),i$1=(t,...r)=>({_$litStatic$:r.reduce(((r,e,a)=>r+(t=>{if(undefined!==t._$litStatic$)return t._$litStatic$;throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t}. Use 'unsafeStatic' to pass non-literal values, but\n take care to ensure page security.`)})(e)+t[a+1]),t[0]),r:a}),l=new Map,n=t=>(r,...e)=>{const a=e.length;let s,i;const n=[],u=[];let c,$=0,f=false;for(;$<a;){for(c=r[$];$<a&&undefined!==(i=e[$],s=o$1(i));)c+=s+r[++$],f=true;$!==a&&u.push(i),n.push(c),$++;}if($===a&&n.push(r[a]),f){const t=n.join("$$lit$$");undefined===(r=l.get(t))&&(n.raw=n,l.set(t,r=n)),e=u;}return t(r,...e)},u=n(x);
|
|
33
35
|
|
|
34
|
-
var styleButtonTokenCss = i$
|
|
36
|
+
var styleButtonTokenCss = i$5`:host{--ds-auro-counter-control-ui-hover: var(--ds-color-ui-bkg-hover-default, rgba(0, 0, 0, 0.06));--ds-auro-counter-control-ui-active: var(--ds-color-ui-active-default, #054687);--ds-auro-counter-control-border-active: var(--ds-color-border-active-default, #0074c8);--ds-auro-counter-control-border-hover: var(--ds-color-ui-bkg-hover-default, rgba(0, 0, 0, 0.06));--ds-auro-counter-control-ui-bkg: var(--ds-color-ui-bkg-default-default, rgba(0, 0, 0, 0.03))}`;
|
|
35
37
|
|
|
36
|
-
var styleButtonColorCss = i$
|
|
38
|
+
var styleButtonColorCss = i$5`.auroButton{border-color:unset;background-color:var(--ds-auro-counter-control-ui-bkg);color:var(--ds-auro-button-text-color);-webkit-tap-highlight-color:var(--ds-auro-button-tap-color)}.auroButton:focus-visible:not(.auroButton:focus-visible:disabled){outline-color:var(--ds-auro-counter-control-border-active)}@media(hover: hover){.auroButton:active:not(:disabled),.auroButton:hover:not(:disabled){background-color:var(--ds-auro-counter-control-ui-hover)}}`;
|
|
37
39
|
|
|
38
|
-
var styleButtonCss = i$
|
|
40
|
+
var styleButtonCss = i$5`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.contentWrapper{display:flex;align-items:center}.contentWrapper span{display:block;height:var(--ds-size-300, 1.5rem)}.auroButton{position:relative;display:inline-flex;overflow:visible;width:calc(var(--ds-size-50, 0.25rem) + var(--ds-size-400, 2rem));height:calc(var(--ds-size-25, 0.125rem) + var(--ds-size-400, 2rem));flex-direction:row;align-items:center;justify-content:center;padding:var(--ds-auro-counter-control-padding);border:none;border-radius:var(--ds-auro-counter-control-border-radius);margin:0;cursor:pointer;gap:var(--ds-size-100, 0.5rem);line-height:unset;-webkit-touch-callout:none;user-select:none;white-space:nowrap}.auroButton:active .contentWrapper{transform:scale(0.95)}.auroButton:disabled{cursor:not-allowed;transform:unset}.auroButton:focus-visible:not(.auroButton:focus-visible:disabled){outline-offset:0;outline-style:solid;outline-width:var(--ds-size-25, 0.125rem);transform:unset}`;
|
|
39
41
|
|
|
40
42
|
/**
|
|
41
43
|
* @license
|
|
42
44
|
* Copyright 2017 Google LLC
|
|
43
45
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
44
46
|
*/
|
|
45
|
-
const t
|
|
47
|
+
const t={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},e$1=t=>(...e)=>({_$litDirective$:t,values:e});class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}
|
|
46
48
|
|
|
47
49
|
/**
|
|
48
50
|
* @license
|
|
49
51
|
* Copyright 2018 Google LLC
|
|
50
52
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
51
|
-
*/const e
|
|
53
|
+
*/const e=e$1(class extends i{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||t$1.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(s,[i]){if(undefined===this.st){this.st=new Set,undefined!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return T}});
|
|
52
54
|
|
|
53
55
|
/**
|
|
54
56
|
* @license
|
|
55
57
|
* Copyright 2018 Google LLC
|
|
56
58
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
57
|
-
*/const o
|
|
59
|
+
*/const o=o=>o??E;
|
|
58
60
|
|
|
59
61
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
60
62
|
// See LICENSE in the project root for license information.
|
|
61
63
|
|
|
62
64
|
|
|
63
|
-
|
|
65
|
+
class AuroDependencyVersioning {
|
|
64
66
|
|
|
65
67
|
/**
|
|
66
68
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -86,7 +88,7 @@ let AuroDependencyVersioning$1 = class AuroDependencyVersioning {
|
|
|
86
88
|
*/
|
|
87
89
|
generateTag(baseName, version, tagClass) {
|
|
88
90
|
const elementName = this.generateElementName(baseName, version);
|
|
89
|
-
const tag = i$
|
|
91
|
+
const tag = i$1`${s(elementName)}`;
|
|
90
92
|
|
|
91
93
|
if (!customElements.get(elementName)) {
|
|
92
94
|
customElements.define(elementName, class extends tagClass {});
|
|
@@ -94,7 +96,7 @@ let AuroDependencyVersioning$1 = class AuroDependencyVersioning {
|
|
|
94
96
|
|
|
95
97
|
return tag;
|
|
96
98
|
}
|
|
97
|
-
}
|
|
99
|
+
}
|
|
98
100
|
|
|
99
101
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
100
102
|
// See LICENSE in the project root for license information.
|
|
@@ -103,7 +105,7 @@ let AuroDependencyVersioning$1 = class AuroDependencyVersioning {
|
|
|
103
105
|
|
|
104
106
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
105
107
|
|
|
106
|
-
|
|
108
|
+
class AuroLibraryRuntimeUtils {
|
|
107
109
|
|
|
108
110
|
/* eslint-disable jsdoc/require-param */
|
|
109
111
|
|
|
@@ -164,19 +166,19 @@ let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
|
|
|
164
166
|
|
|
165
167
|
return elemTag === tag || elem.hasAttribute(tag);
|
|
166
168
|
}
|
|
167
|
-
}
|
|
169
|
+
}
|
|
168
170
|
|
|
169
|
-
var styleCss$
|
|
171
|
+
var styleCss$5 = i$5`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);font-weight:var(--ds-text-body-default-weight, 500);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]):after{display:block;content:"";height:calc(100% - 2px);width:calc(100% - 2px);position:absolute;top:1px;left:1px;border-radius:4px;border-style:solid;border-width:2px}.auro-button:focus-visible[variant=secondary]:after,.auro-button:focus-visible[variant=tertiary]:after{display:block;content:"";height:100%;width:100%;position:absolute;top:0;left:0;border-radius:var(--ds-border-radius, 0.375rem);border-style:solid;border-width:2px}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-text-body-size-sm, 0.875rem);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, $ds-size-300)}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size: calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, $ds-size-300)}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
|
|
170
172
|
|
|
171
|
-
var colorCss$7 = i$b`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible:after{border-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active{--ds-auro-button-container-color: var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-active-default, #225296)}.auro-button:not([ondark])[disabled]{--ds-auro-button-container-color: var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-disabled-default, #a0c9f1)}@media(hover: hover){.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color: var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-border-color: var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-text-color: var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color: var(--ds-color-border-ui-hover-default, #193d73);--ds-auro-button-text-color: var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color: var(--ds-color-border-ui-focus-default, #2c67b5)}.auro-button:not([ondark])[variant=secondary]:active{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-border-color: var(--ds-color-border-ui-active-default, #225296);--ds-auro-button-text-color: var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-border-color: var(--ds-color-border-ui-disabled-default, #adadad);--ds-auro-button-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color: var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-border-inset-color: var(--ds-color-border-ui-default-default, #2c67b5)}.auro-button:not([ondark])[variant=tertiary]:active{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-color-icon-ui-secondary-default-default);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-default);background-color:transparent;background-image:none;border-color:transparent}}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-color-icon-ui-secondary-disabled-default);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-container-color: var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-text-color: var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-button-loader-color: var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-container-color: var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7)}}.auro-button[ondark]:active{--ds-auro-button-container-color: var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-active-inverse, #6ad5ef)}.auro-button[ondark][disabled]{--ds-auro-button-container-color: var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-text-color: var(--ds-color-text-ui-disabled-inverse, #7e7e7e);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-disabled-inverse, #275b72)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-border-color: var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-text-color: var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=secondary]:hover{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color: var(--ds-color-border-ui-hover-inverse, #a8e9f7);--ds-auro-button-text-color: var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color: var(--ds-color-border-ui-focus-inverse, #56bbde)}.auro-button[ondark][variant=secondary]:active{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color: var(--ds-color-border-ui-active-inverse, #6ad5ef);--ds-auro-button-text-color: var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color: var(--ds-color-border-ui-disabled-inverse, #7e7e7e);--ds-auro-button-text-color: var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color: var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-border-inset-color: var(--ds-color-border-ui-default-inverse, #56bbde)}.auro-button[ondark][variant=tertiary]:active{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=flat]{color:var(--ds-color-icon-ui-secondary-default-inverse);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-inverse);background-color:transparent;background-image:none;border-color:transparent}}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-color-icon-ui-disabled-default);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
173
|
+
var colorCss$4 = i$5`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible:after{border-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active{--ds-auro-button-container-color: var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-active-default, #225296)}.auro-button:not([ondark])[disabled]{--ds-auro-button-container-color: var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-disabled-default, #a0c9f1)}@media(hover: hover){.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color: var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-border-color: var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-text-color: var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color: var(--ds-color-border-ui-hover-default, #193d73);--ds-auro-button-text-color: var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color: var(--ds-color-border-ui-focus-default, #2c67b5)}.auro-button:not([ondark])[variant=secondary]:active{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-border-color: var(--ds-color-border-ui-active-default, #225296);--ds-auro-button-text-color: var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-border-color: var(--ds-color-border-ui-disabled-default, #adadad);--ds-auro-button-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color: var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-border-inset-color: var(--ds-color-border-ui-default-default, #2c67b5)}.auro-button:not([ondark])[variant=tertiary]:active{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-color-icon-ui-secondary-default-default);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-default);background-color:transparent;background-image:none;border-color:transparent}}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-color-icon-ui-secondary-disabled-default);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-container-color: var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-text-color: var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-button-loader-color: var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-container-color: var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7)}}.auro-button[ondark]:active{--ds-auro-button-container-color: var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-active-inverse, #6ad5ef)}.auro-button[ondark][disabled]{--ds-auro-button-container-color: var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-text-color: var(--ds-color-text-ui-disabled-inverse, #7e7e7e);--ds-auro-button-border-color: var(--ds-color-container-ui-primary-disabled-inverse, #275b72)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-border-color: var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-text-color: var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=secondary]:hover{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color: var(--ds-color-border-ui-hover-inverse, #a8e9f7);--ds-auro-button-text-color: var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color: var(--ds-color-border-ui-focus-inverse, #56bbde)}.auro-button[ondark][variant=secondary]:active{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color: var(--ds-color-border-ui-active-inverse, #6ad5ef);--ds-auro-button-text-color: var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-container-color: var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image: var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color: var(--ds-color-border-ui-disabled-inverse, #7e7e7e);--ds-auro-button-text-color: var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color: var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-border-inset-color: var(--ds-color-border-ui-default-inverse, #56bbde)}.auro-button[ondark][variant=tertiary]:active{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-container-color: var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image: var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=flat]{color:var(--ds-color-icon-ui-secondary-default-inverse);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-inverse);background-color:transparent;background-image:none;border-color:transparent}}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-color-icon-ui-disabled-default);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
172
174
|
|
|
173
|
-
var tokensCss$
|
|
175
|
+
var tokensCss$3 = i$5`:host{--ds-auro-button-border-color: var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-border-inset-color: var(--ds-color-border-emphasis-inverse, #f2f7fb);--ds-auro-button-container-color: var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-container-image: var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-loader-color: var(--ds-color-utility-navy-default, #265688);--ds-auro-button-text-color: var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-tap-color: transparent}`;
|
|
174
176
|
|
|
175
|
-
var styleCss$
|
|
177
|
+
var styleCss$4 = i$5`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}:host,:host>span{position:relative}:host{width:2rem;height:2rem;display:inline-block;font-size:0}:host>span{position:absolute;display:inline-block;float:none;top:0;left:0;width:2rem;height:2rem;border-radius:100%;border-style:solid;border-width:0}:host([xs]),:host([xs])>span{width:1.2rem;height:1.2rem}:host([sm]),:host([sm])>span{width:3rem;height:3rem}:host([md]),:host([md])>span{width:5rem;height:5rem}:host([lg]),:host([lg])>span{width:8rem;height:8rem}:host{--margin: 0.375rem;--margin-xs: 0.2rem;--margin-sm: 0.5rem;--margin-md: 0.75rem;--margin-lg: 1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin)*6);height:1.5rem}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(2.55rem + var(--margin-xs)*6);height:1.55rem}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm)*6);height:2.5rem}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md)*6);height:3.5rem}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg)*6);height:5.5rem}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-400ms}:host([pulse])>span:nth-child(2){animation-delay:-200ms}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,100%{opacity:.1;transform:scale(0.9)}50%{opacity:1;transform:scale(1.1)}}:host([orbit]),:host([orbit])>span{opacity:1}:host([orbit])>span{border-width:5px}:host([orbit])>span:nth-child(2){animation:orbit 2s linear infinite}:host([orbit][sm])>span{border-width:8px}:host([orbit][md])>span{border-width:13px}:host([orbit][lg])>span{border-width:21px}@keyframes orbit{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host([ringworm])>svg{animation:rotate 2s linear infinite;height:100%;width:100%;stroke:currentcolor;stroke-width:8}:host([ringworm]) .path{stroke-dashoffset:0;animation:ringworm 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px}}:host([laser]){position:static;width:100%;display:block;height:0;overflow:hidden;font-size:unset}:host([laser])>span{position:fixed;width:100%;height:.25rem;border-radius:0;z-index:100}:host([laser])>span:nth-child(1){border-color:currentcolor;opacity:.25}:host([laser])>span:nth-child(2){border-color:currentcolor;animation:laser 2s linear infinite;opacity:1;width:50%}:host([laser][sm])>span:nth-child(2){width:20%}:host([laser][md])>span:nth-child(2){width:30%}:host([laser][lg])>span:nth-child(2){width:50%;animation-duration:1.5s}:host([laser][xl])>span:nth-child(2){width:80%;animation-duration:1.5s}@keyframes laser{0%{left:-100%}100%{left:110%}}:host>.no-animation{display:none}@media(prefers-reduced-motion: reduce){:host{display:flex;align-items:center;justify-content:center;font-size:1rem}:host>span{opacity:1}:host>.loader{display:none}:host>.no-animation{display:block}}`;
|
|
176
178
|
|
|
177
|
-
var colorCss$
|
|
179
|
+
var colorCss$3 = i$5`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color: var(--ds-color-utility-navy-default, #265688)}:host([ondark]){--ds-auro-loader-color: var(--ds-color-utility-cyan-inverse, #a8e9f7)}:host([white]){--ds-auro-loader-color: var(--ds-color-utility-neutral-inverse, #ccd2db)}:host([orbit])>span{--ds-auro-loader-background-color: transparent}:host([orbit])>span:nth-child(1){--ds-auro-loader-border-color: currentcolor;opacity:.25}:host([orbit])>span:nth-child(2){--ds-auro-loader-border-color: currentcolor;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}`;
|
|
178
180
|
|
|
179
|
-
var tokensCss$
|
|
181
|
+
var tokensCss$2 = i$5`:host{--ds-auro-loader-background-color: currentcolor;--ds-auro-loader-border-color: currentcolor;--ds-auro-loader-color: currentcolor}`;
|
|
180
182
|
|
|
181
183
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
182
184
|
// See LICENSE in the project root for license information.
|
|
@@ -201,7 +203,7 @@ var tokensCss$4 = i$b`:host{--ds-auro-loader-background-color: currentcolor;--ds
|
|
|
201
203
|
*/
|
|
202
204
|
|
|
203
205
|
// build the component class
|
|
204
|
-
class AuroLoader extends r
|
|
206
|
+
class AuroLoader extends r {
|
|
205
207
|
constructor() {
|
|
206
208
|
super();
|
|
207
209
|
|
|
@@ -223,7 +225,7 @@ class AuroLoader extends r$4 {
|
|
|
223
225
|
/**
|
|
224
226
|
* @private
|
|
225
227
|
*/
|
|
226
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils
|
|
228
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils();
|
|
227
229
|
|
|
228
230
|
this.orbit = false;
|
|
229
231
|
this.ringworm = false;
|
|
@@ -255,9 +257,9 @@ class AuroLoader extends r$4 {
|
|
|
255
257
|
|
|
256
258
|
static get styles() {
|
|
257
259
|
return [
|
|
258
|
-
i$
|
|
259
|
-
i$
|
|
260
|
-
i$
|
|
260
|
+
i$5`${styleCss$4}`,
|
|
261
|
+
i$5`${colorCss$3}`,
|
|
262
|
+
i$5`${tokensCss$2}`
|
|
261
263
|
];
|
|
262
264
|
}
|
|
263
265
|
|
|
@@ -270,7 +272,7 @@ class AuroLoader extends r$4 {
|
|
|
270
272
|
*
|
|
271
273
|
*/
|
|
272
274
|
static register(name = "auro-loader") {
|
|
273
|
-
AuroLibraryRuntimeUtils
|
|
275
|
+
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroLoader);
|
|
274
276
|
}
|
|
275
277
|
|
|
276
278
|
firstUpdated() {
|
|
@@ -303,14 +305,14 @@ class AuroLoader extends r$4 {
|
|
|
303
305
|
|
|
304
306
|
// function that renders the HTML and CSS into the scope of the component
|
|
305
307
|
render() {
|
|
306
|
-
return x
|
|
307
|
-
${this.defineTemplate().map((idx) => x
|
|
308
|
+
return x`
|
|
309
|
+
${this.defineTemplate().map((idx) => x`
|
|
308
310
|
<span part="element" class="loader node-${idx}"></span>
|
|
309
311
|
`)}
|
|
310
312
|
|
|
311
313
|
<div class="no-animation">Loading...</div>
|
|
312
314
|
|
|
313
|
-
${this.ringworm ? x
|
|
315
|
+
${this.ringworm ? x`
|
|
314
316
|
<svg part="element" class="circular" viewBox="25 25 50 50">
|
|
315
317
|
<circle class="path" cx="50" cy="50" r="20" fill="none"/>
|
|
316
318
|
</svg>`
|
|
@@ -356,7 +358,7 @@ var loaderVersion = '3.1.1';
|
|
|
356
358
|
|
|
357
359
|
/* eslint-disable lit/no-invalid-html, lit/binding-positions */
|
|
358
360
|
|
|
359
|
-
class AuroButton extends r
|
|
361
|
+
class AuroButton extends r {
|
|
360
362
|
|
|
361
363
|
constructor() {
|
|
362
364
|
super();
|
|
@@ -375,7 +377,7 @@ class AuroButton extends r$4 {
|
|
|
375
377
|
/**
|
|
376
378
|
* Generate unique names for dependency components.
|
|
377
379
|
*/
|
|
378
|
-
const versioning = new AuroDependencyVersioning
|
|
380
|
+
const versioning = new AuroDependencyVersioning();
|
|
379
381
|
|
|
380
382
|
/**
|
|
381
383
|
* @private
|
|
@@ -385,9 +387,9 @@ class AuroButton extends r$4 {
|
|
|
385
387
|
|
|
386
388
|
static get styles() {
|
|
387
389
|
return [
|
|
388
|
-
tokensCss$
|
|
389
|
-
styleCss$
|
|
390
|
-
colorCss$
|
|
390
|
+
tokensCss$3,
|
|
391
|
+
styleCss$5,
|
|
392
|
+
colorCss$4
|
|
391
393
|
];
|
|
392
394
|
}
|
|
393
395
|
|
|
@@ -470,7 +472,7 @@ class AuroButton extends r$4 {
|
|
|
470
472
|
*
|
|
471
473
|
*/
|
|
472
474
|
static register(name = "auro-button") {
|
|
473
|
-
AuroLibraryRuntimeUtils
|
|
475
|
+
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroButton);
|
|
474
476
|
}
|
|
475
477
|
|
|
476
478
|
/**
|
|
@@ -524,27 +526,27 @@ class AuroButton extends r$4 {
|
|
|
524
526
|
'loading': this.loading
|
|
525
527
|
};
|
|
526
528
|
|
|
527
|
-
return u
|
|
529
|
+
return u`
|
|
528
530
|
<button
|
|
529
531
|
part="button"
|
|
530
|
-
aria-label="${o
|
|
531
|
-
aria-labelledby="${o
|
|
532
|
+
aria-label="${o(this.arialabel ? this.arialabel : undefined)}"
|
|
533
|
+
aria-labelledby="${o(this.arialabelledby ? this.arialabelledby : undefined)}"
|
|
532
534
|
?autofocus="${this.autofocus}"
|
|
533
|
-
class="${e
|
|
535
|
+
class="${e(classes)}"
|
|
534
536
|
?disabled="${this.disabled || this.loading}"
|
|
535
537
|
?onDark="${this.onDark}"
|
|
536
|
-
title="${o
|
|
537
|
-
name="${o
|
|
538
|
-
type="${o
|
|
539
|
-
variant="${o
|
|
540
|
-
.value="${o
|
|
538
|
+
title="${o(this.title ? this.title : undefined)}"
|
|
539
|
+
name="${o(this.name ? this.name : undefined)}"
|
|
540
|
+
type="${o(this.type ? this.type : undefined)}"
|
|
541
|
+
variant="${o(this.variant ? this.variant : undefined)}"
|
|
542
|
+
.value="${o(this.value ? this.value : undefined)}"
|
|
541
543
|
@click="${() => {}}"
|
|
542
544
|
>
|
|
543
|
-
${o
|
|
545
|
+
${o(this.loading ? u`<${this.loaderTag} pulse part="loader"></${this.loaderTag}>` : undefined)}
|
|
544
546
|
|
|
545
547
|
<span class="contentWrapper">
|
|
546
548
|
<span class="textSlot" part="text">
|
|
547
|
-
${this.iconOnly ? undefined : u
|
|
549
|
+
${this.iconOnly ? undefined : u`<slot></slot>`}
|
|
548
550
|
</span>
|
|
549
551
|
|
|
550
552
|
<span part="icon">
|
|
@@ -580,7 +582,7 @@ class AuroCounterButton extends AuroButton {
|
|
|
580
582
|
*
|
|
581
583
|
*/
|
|
582
584
|
static register(name = "auro-counter-button") {
|
|
583
|
-
AuroLibraryRuntimeUtils
|
|
585
|
+
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroCounterButton);
|
|
584
586
|
}
|
|
585
587
|
}
|
|
586
588
|
|
|
@@ -600,7 +602,7 @@ if (!customElements.get("auro-counter-button")) {
|
|
|
600
602
|
* @attr {Boolean} hiddenAudible - If present, the component will be hidden from screen readers, but seen visually
|
|
601
603
|
*/
|
|
602
604
|
|
|
603
|
-
|
|
605
|
+
class AuroElement extends r {
|
|
604
606
|
|
|
605
607
|
// function to define props used within the scope of this component
|
|
606
608
|
static get properties() {
|
|
@@ -624,13 +626,13 @@ let AuroElement$1 = class AuroElement extends r$4 {
|
|
|
624
626
|
|
|
625
627
|
return 'false'
|
|
626
628
|
}
|
|
627
|
-
}
|
|
629
|
+
}
|
|
628
630
|
|
|
629
|
-
var error
|
|
631
|
+
var error = {"role":"img","color":"currentColor","title":"","desc":"Error alert indicator.","width":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","height":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","xmlns":"http://www.w3.org/2000/svg","xmlns_xlink":"http://www.w3.org/1999/xlink","viewBox":"0 0 24 24","path":"/icons","style":"ico_squareLarge","type":"icon","name":"error","category":"alert","deprecated":true,"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"error__desc\" class=\"ico_squareLarge\" data-deprecated=\"true\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><desc id=\"error__desc\">Error alert indicator.</desc><path d=\"m13.047 5.599 6.786 11.586A1.207 1.207 0 0 1 18.786 19H5.214a1.207 1.207 0 0 1-1.047-1.815l6.786-11.586a1.214 1.214 0 0 1 2.094 0m-1.165.87a.23.23 0 0 0-.085.085L5.419 17.442a.232.232 0 0 0 .203.35h12.756a.234.234 0 0 0 .203-.35L12.203 6.554a.236.236 0 0 0-.321-.084M12 15.5a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5m-.024-6.22c.325 0 .589.261.589.583v4.434a.586.586 0 0 1-.589.583.586.586 0 0 1-.588-.583V9.863c0-.322.264-.583.588-.583\"/></svg>"};
|
|
630
632
|
|
|
631
633
|
/* eslint-disable no-underscore-dangle, jsdoc/no-undefined-types, jsdoc/require-param-description */
|
|
632
634
|
|
|
633
|
-
const _fetchMap
|
|
635
|
+
const _fetchMap = new Map();
|
|
634
636
|
|
|
635
637
|
/**
|
|
636
638
|
* A callback to parse Response body.
|
|
@@ -648,15 +650,15 @@ const _fetchMap$1 = new Map();
|
|
|
648
650
|
* @param {ResponseParser} [options.responseParser=(response) => response.text()]
|
|
649
651
|
* @returns {Promise}
|
|
650
652
|
*/
|
|
651
|
-
const cacheFetch
|
|
653
|
+
const cacheFetch = (uri, options = {}) => {
|
|
652
654
|
const responseParser = options.responseParser || ((response) => response.text());
|
|
653
|
-
if (!_fetchMap
|
|
654
|
-
_fetchMap
|
|
655
|
+
if (!_fetchMap.has(uri)) {
|
|
656
|
+
_fetchMap.set(uri, fetch(uri).then(responseParser));
|
|
655
657
|
}
|
|
656
|
-
return _fetchMap
|
|
658
|
+
return _fetchMap.get(uri);
|
|
657
659
|
};
|
|
658
660
|
|
|
659
|
-
var styleCss$
|
|
661
|
+
var styleCss$3 = i$5`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}:host .logo{color:var(--ds-color-brand-midnight-400, #01426a)}svg{min-width:var(--ds-auro-icon-size, 1.5rem) !important;width:var(--ds-auro-icon-size, 1.5rem) !important;height:var(--ds-auro-icon-size, 1.5rem) !important}.label{display:flex;align-items:flex-start}.label svg{margin:0 var(--ds-size-50, 0.25rem)}.wrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelContainer{line-height:1.8}`;
|
|
660
662
|
|
|
661
663
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
662
664
|
// See LICENSE in the project root for license information.
|
|
@@ -669,7 +671,7 @@ var styleCss$6 = i$b`*,*:before,*:after{box-sizing:border-box}@media(prefers-red
|
|
|
669
671
|
*/
|
|
670
672
|
|
|
671
673
|
// build the component class
|
|
672
|
-
|
|
674
|
+
class BaseIcon extends AuroElement {
|
|
673
675
|
constructor() {
|
|
674
676
|
super();
|
|
675
677
|
this.onDark = false;
|
|
@@ -695,8 +697,8 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
695
697
|
}
|
|
696
698
|
|
|
697
699
|
static get styles() {
|
|
698
|
-
return i$
|
|
699
|
-
${styleCss$
|
|
700
|
+
return i$5`
|
|
701
|
+
${styleCss$3}
|
|
700
702
|
`;
|
|
701
703
|
}
|
|
702
704
|
|
|
@@ -711,9 +713,9 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
711
713
|
let iconHTML = '';
|
|
712
714
|
|
|
713
715
|
if (category === 'logos') {
|
|
714
|
-
iconHTML = await cacheFetch
|
|
716
|
+
iconHTML = await cacheFetch(`${this.uri}/${category}/${name}.svg`);
|
|
715
717
|
} else {
|
|
716
|
-
iconHTML = await cacheFetch
|
|
718
|
+
iconHTML = await cacheFetch(`${this.uri}/icons/${category}/${name}.svg`);
|
|
717
719
|
}
|
|
718
720
|
|
|
719
721
|
const dom = new DOMParser().parseFromString(iconHTML, 'text/html');
|
|
@@ -729,17 +731,17 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
729
731
|
if (svg) {
|
|
730
732
|
this.svg = svg;
|
|
731
733
|
} else if (!svg) {
|
|
732
|
-
const penDOM = new DOMParser().parseFromString(error
|
|
734
|
+
const penDOM = new DOMParser().parseFromString(error.svg, 'text/html');
|
|
733
735
|
|
|
734
736
|
this.svg = penDOM.body.firstChild;
|
|
735
737
|
}
|
|
736
738
|
}
|
|
737
739
|
}
|
|
738
|
-
}
|
|
740
|
+
}
|
|
739
741
|
|
|
740
|
-
var tokensCss$
|
|
742
|
+
var tokensCss$1 = i$5`:host{--ds-auro-icon-color: var(--ds-color-icon-primary-default, $ds-color-icon-primary-default);--ds-auro-icon-size: var(--ds-size-300, $ds-size-300)}`;
|
|
741
743
|
|
|
742
|
-
var colorCss$
|
|
744
|
+
var colorCss$2 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[accent]){--ds-auro-icon-color: var(--ds-color-icon-accent-default, #a2c270)}:host(:not([onDark])[disabled]){--ds-auro-icon-color: var(--ds-color-icon-ui-primary-disabled-default, #adadad)}:host(:not([onDark])[emphasis]){--ds-auro-icon-color: var(--ds-color-icon-emphasis-default, #2a2a2a)}:host(:not([onDark])[error]){--ds-auro-icon-color: var(--ds-color-icon-error-default, #cc1816)}:host(:not([onDark])[info]){--ds-auro-icon-color: var(--ds-color-icon-info-default, #326aa5)}:host(:not([onDark])[secondary]){--ds-auro-icon-color: var(--ds-color-icon-secondary-default, #7e8894)}:host(:not([onDark])[subtle]){--ds-auro-icon-color: var(--ds-color-icon-subtle-default, #a0c9f1)}:host(:not([onDark])[success]){--ds-auro-icon-color: var(--ds-color-icon-success-default, #40a080)}:host(:not([onDark])[tertiary]){--ds-auro-icon-color: var(--ds-color-icon-tertiary-default, #afb9c6)}:host(:not([onDark])[warning]){--ds-auro-icon-color: var(--ds-color-icon-warning-default, #c49432)}:host([onDark]){--ds-auro-icon-color: var(--ds-color-icon-primary-inverse, #f7f7f7)}:host([onDark][accent]){--ds-auro-icon-color: var(--ds-color-icon-accent-inverse, #badd81)}:host([onDark][disabled]){--ds-auro-icon-color: var(--ds-color-icon-ui-primary-disabled-inverse, #7e7e7e)}:host([onDark][emphasis]){--ds-auro-icon-color: var(--ds-color-icon-emphasis-inverse, #ffffff)}:host([onDark][error]){--ds-auro-icon-color: var(--ds-color-icon-error-inverse, #f9aca6)}:host([onDark][info]){--ds-auro-icon-color: var(--ds-color-icon-info-inverse, #89b2d4)}:host([onDark][secondary]){--ds-auro-icon-color: var(--ds-color-icon-secondary-inverse, #ccd2db)}:host([onDark][subtle]){--ds-auro-icon-color: var(--ds-color-icon-subtle-inverse, #326aa5)}:host([onDark][success]){--ds-auro-icon-color: var(--ds-color-icon-success-inverse, #8eceb9)}:host([onDark][tertiary]){--ds-auro-icon-color: var(--ds-color-icon-tertiary-inverse, #939fad)}:host([onDark][warning]){--ds-auro-icon-color: var(--ds-color-icon-warning-inverse, #f2c153)}`;
|
|
743
745
|
|
|
744
746
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
745
747
|
// See LICENSE in the project root for license information.
|
|
@@ -772,7 +774,7 @@ var colorCss$5 = i$b`:host{color:var(--ds-auro-icon-color)}:host([customColor]){
|
|
|
772
774
|
*/
|
|
773
775
|
|
|
774
776
|
// build the component class
|
|
775
|
-
|
|
777
|
+
class AuroIcon extends BaseIcon {
|
|
776
778
|
constructor() {
|
|
777
779
|
super();
|
|
778
780
|
|
|
@@ -801,7 +803,7 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
801
803
|
this.success = false;
|
|
802
804
|
this.tertiary = false;
|
|
803
805
|
this.warning = false;
|
|
804
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils
|
|
806
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils();
|
|
805
807
|
}
|
|
806
808
|
|
|
807
809
|
// function to define props used within the scope of this component
|
|
@@ -883,9 +885,9 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
883
885
|
static get styles() {
|
|
884
886
|
return [
|
|
885
887
|
super.styles,
|
|
886
|
-
i$
|
|
887
|
-
i$
|
|
888
|
-
i$
|
|
888
|
+
i$5`${tokensCss$1}`,
|
|
889
|
+
i$5`${styleCss$3}`,
|
|
890
|
+
i$5`${colorCss$2}`
|
|
889
891
|
];
|
|
890
892
|
}
|
|
891
893
|
|
|
@@ -898,7 +900,7 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
898
900
|
*
|
|
899
901
|
*/
|
|
900
902
|
static register(name = "auro-icon") {
|
|
901
|
-
AuroLibraryRuntimeUtils
|
|
903
|
+
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroIcon);
|
|
902
904
|
}
|
|
903
905
|
|
|
904
906
|
connectedCallback() {
|
|
@@ -927,28 +929,28 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
927
929
|
'wrapper': true,
|
|
928
930
|
};
|
|
929
931
|
|
|
930
|
-
return x
|
|
932
|
+
return x`
|
|
931
933
|
<div
|
|
932
|
-
class="${e
|
|
933
|
-
title="${o
|
|
934
|
-
<span aria-hidden="${o
|
|
935
|
-
${this.customSvg ? x
|
|
934
|
+
class="${e(classes)}"
|
|
935
|
+
title="${o(this.title || undefined)}">
|
|
936
|
+
<span aria-hidden="${o(this.ariaHidden ? this.ariaHidden : true)}" part="svg">
|
|
937
|
+
${this.customSvg ? x`
|
|
936
938
|
<slot name="svg"></slot>
|
|
937
|
-
` : x
|
|
939
|
+
` : x`
|
|
938
940
|
${this.svg}
|
|
939
941
|
`
|
|
940
942
|
}
|
|
941
943
|
</span>
|
|
942
944
|
|
|
943
|
-
<div class="${e
|
|
945
|
+
<div class="${e(a11y)}">
|
|
944
946
|
<slot></slot>
|
|
945
947
|
</div>
|
|
946
948
|
</div>
|
|
947
949
|
`;
|
|
948
950
|
}
|
|
949
|
-
}
|
|
951
|
+
}
|
|
950
952
|
|
|
951
|
-
var iconVersion
|
|
953
|
+
var iconVersion = '6.1.2';
|
|
952
954
|
|
|
953
955
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
954
956
|
// See LICENSE in the project root for license information.
|
|
@@ -956,7 +958,7 @@ var iconVersion$1 = '6.1.2';
|
|
|
956
958
|
|
|
957
959
|
class AuroFormValidation {
|
|
958
960
|
constructor() {
|
|
959
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils
|
|
961
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils();
|
|
960
962
|
}
|
|
961
963
|
|
|
962
964
|
/**
|
|
@@ -1283,7 +1285,7 @@ class IconUtil {
|
|
|
1283
1285
|
|
|
1284
1286
|
svg.setAttribute('slot', 'svg');
|
|
1285
1287
|
|
|
1286
|
-
return u
|
|
1288
|
+
return u`${svg}`;
|
|
1287
1289
|
}
|
|
1288
1290
|
}
|
|
1289
1291
|
|
|
@@ -1291,11 +1293,11 @@ var plusIcon = {"role":"img","color":"currentColor","title":"","desc":"","width"
|
|
|
1291
1293
|
|
|
1292
1294
|
var minusIcon = {"role":"img","color":"currentColor","title":"","desc":"","width":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","height":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","xmlns":"http://www.w3.org/2000/svg","xmlns_xlink":"http://www.w3.org/1999/xlink","viewBox":"0 0 24 24","path":"/icons","style":"ico_squareLarge","type":"icon","name":"minus-lg","category":"interface","deprecated":true,"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-hidden=\"true\" class=\"ico_squareLarge\" data-deprecated=\"true\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><path d=\"M5.75 12.75h12.5a.75.75 0 1 0 0-1.5H5.75a.75.75 0 1 0 0 1.5\"/></svg>"};
|
|
1293
1295
|
|
|
1294
|
-
var tokensCss
|
|
1296
|
+
var tokensCss = i$5`:host{--ds-auro-counter-text-default: var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-counter-text-secondary: var(--ds-color-text-secondary-default, #525252);--ds-auro-counter-text-disabled: var(--ds-color-text-ui-disabled-default, #adadad);--ds-auro-counter-control-ui-active: var(--ds-color-ui-active-default, #054687);--ds-auro-counter-control-ui-hover: var(--ds-color-ui-hover-default, #054687);--ds-auro-counter-control-ui-disabled: var(--ds-color-ui-disabled-default, rgba(0, 116, 200, 0.2));--ds-auro-counter-control-ui-bkg: var(--ds-color-ui-bkg-default-default, rgba(0, 0, 0, 0.03));--ds-auro-counter-control-line-height: var(--ds-text-body-size-sm, 0.875rem);--ds-auro-counter-icon-color-default: var(--ds-color-ui-default-default, #0074c8)}`;
|
|
1295
1297
|
|
|
1296
|
-
var colorCss$
|
|
1298
|
+
var colorCss$1 = i$5`.counter{color:var(--ds-auro-counter-text-default)}[name=description]::slotted(*){color:var(--ds-auro-counter-text-secondary)}.controlIcon{color:var(--ds-auro-counter-icon-color-default)}.quantityWrapper{background-color:var(--ds-auro-counter-control-ui-bkg)}[disabled] .controlIcon,:host([disabled]) .controlIcon{color:var(--ds-auro-counter-control-ui-disabled)}[disabled] label,[disabled] [name=description]::slotted(*),[disabled]::part(counterControl),:host([disabled]) label,:host([disabled]) [name=description]::slotted(*),:host([disabled])::part(counterControl){color:var(--ds-auro-counter-text-disabled)}`;
|
|
1297
1299
|
|
|
1298
|
-
var styleCss$
|
|
1300
|
+
var styleCss$2 = i$5`.counter{display:flex;align-items:center;justify-content:space-between;column-gap:var(--ds-size-150, 0.75rem)}.content{display:flex;flex-flow:column}[name=description]::slotted(*){display:block;font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-size-200, 1rem)}.quantityWrapper{width:var(--ds-size-400, 2rem);height:calc(var(--ds-size-25, 0.125rem) + var(--ds-size-400, 2rem));align-content:center;cursor:default;font-size:var(--ds-size-250, 1.25rem);text-align:center}:host{position:relative}:host::part(counterControl){display:flex;line-height:0}:host::part(controlMinus){--ds-auro-counter-control-border-radius: var(--ds-size-500, 2.5rem) 0 0 var(--ds-size-500, 2.5rem);--ds-auro-counter-control-padding: var(--ds-size-50, 0.25rem) var(--ds-size-50, 0.25rem) var(--ds-size-50, 0.25rem) var(--ds-size-100, 0.5rem)}:host::part(controlPlus){--ds-auro-counter-control-border-radius: 0 var(--ds-size-500, 2.5rem) var(--ds-size-500, 2.5rem) 0;--ds-auro-counter-control-padding: var(--ds-size-50, 0.25rem) var(--ds-size-100, 0.5rem) var(--ds-size-50, 0.25rem) var(--ds-size-50, 0.25rem)}auro-counter-button{display:flex}`;
|
|
1299
1301
|
|
|
1300
1302
|
/* eslint-disable lit/binding-positions, lit/no-invalid-html, max-lines */
|
|
1301
1303
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
@@ -1313,7 +1315,7 @@ var styleCss$5 = i$b`.counter{display:flex;align-items:center;justify-content:sp
|
|
|
1313
1315
|
* @slot Default - Main label content for the counter.
|
|
1314
1316
|
* @slot description - Descriptive content for the counter.
|
|
1315
1317
|
*/
|
|
1316
|
-
class AuroCounter extends r
|
|
1318
|
+
class AuroCounter extends r {
|
|
1317
1319
|
constructor() {
|
|
1318
1320
|
super();
|
|
1319
1321
|
|
|
@@ -1334,14 +1336,14 @@ class AuroCounter extends r$4 {
|
|
|
1334
1336
|
* Generate unique names for dependency components.
|
|
1335
1337
|
* @private
|
|
1336
1338
|
*/
|
|
1337
|
-
const versioning = new AuroDependencyVersioning
|
|
1339
|
+
const versioning = new AuroDependencyVersioning();
|
|
1338
1340
|
|
|
1339
1341
|
/**
|
|
1340
1342
|
* Dynamically generated icon tag for counter buttons.
|
|
1341
1343
|
* @private
|
|
1342
1344
|
* @type {string}
|
|
1343
1345
|
*/
|
|
1344
|
-
this.iconTag = versioning.generateTag("auro-icon", iconVersion
|
|
1346
|
+
this.iconTag = versioning.generateTag("auro-icon", iconVersion, AuroIcon);
|
|
1345
1347
|
}
|
|
1346
1348
|
|
|
1347
1349
|
/**
|
|
@@ -1415,14 +1417,14 @@ class AuroCounter extends r$4 {
|
|
|
1415
1417
|
* AuroCounter.register("custom-counter") // registers <custom-counter/>
|
|
1416
1418
|
*/
|
|
1417
1419
|
static register(name = "auro-counter") {
|
|
1418
|
-
AuroLibraryRuntimeUtils
|
|
1420
|
+
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroCounter);
|
|
1419
1421
|
}
|
|
1420
1422
|
|
|
1421
1423
|
static get styles() {
|
|
1422
1424
|
return [
|
|
1423
|
-
tokensCss
|
|
1424
|
-
colorCss$
|
|
1425
|
-
styleCss$
|
|
1425
|
+
tokensCss,
|
|
1426
|
+
colorCss$1,
|
|
1427
|
+
styleCss$2
|
|
1426
1428
|
];
|
|
1427
1429
|
}
|
|
1428
1430
|
|
|
@@ -1548,7 +1550,7 @@ class AuroCounter extends r$4 {
|
|
|
1548
1550
|
}
|
|
1549
1551
|
|
|
1550
1552
|
render() {
|
|
1551
|
-
return u
|
|
1553
|
+
return u`
|
|
1552
1554
|
<div class="counter">
|
|
1553
1555
|
<div class="content" >
|
|
1554
1556
|
<label class="label"><slot></slot></label>
|
|
@@ -1581,3064 +1583,99 @@ class AuroCounter extends r$4 {
|
|
|
1581
1583
|
}
|
|
1582
1584
|
}
|
|
1583
1585
|
|
|
1584
|
-
var styleCss$
|
|
1585
|
-
|
|
1586
|
-
/**
|
|
1587
|
-
* @license
|
|
1588
|
-
* Copyright 2017 Google LLC
|
|
1589
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
1590
|
-
*/
|
|
1591
|
-
const t$2=globalThis,i$5=t$2.trustedTypes,s$2=i$5?i$5.createPolicy("lit-html",{createHTML:t=>t}):undefined,e$4="$lit$",h$1=`lit$${Math.random().toFixed(9).slice(2)}$`,o$4="?"+h$1,n$3=`<${o$4}>`,r$3=document,l$2=()=>r$3.createComment(""),c$2=t=>null===t||"object"!=typeof t&&"function"!=typeof t,a$2=Array.isArray,u$2=t=>a$2(t)||"function"==typeof t?.[Symbol.iterator],d$1="[ \t\n\f\r]",f$1=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,v=/-->/g,_=/>/g,m=RegExp(`>|${d$1}(?:([^\\s"'>=/]+)(${d$1}*=${d$1}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),p$1=/'/g,g=/"/g,$=/^(?:script|style|textarea|title)$/i,y$1=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),x=y$1(1),T=Symbol.for("lit-noChange"),E=Symbol.for("lit-nothing"),A=new WeakMap,C=r$3.createTreeWalker(r$3,129);function P(t,i){if(!a$2(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return undefined!==s$2?s$2.createHTML(i):i}const V=(t,i)=>{const s=t.length-1,o=[];let r,l=2===i?"<svg>":3===i?"<math>":"",c=f$1;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,y=0;for(;y<s.length&&(c.lastIndex=y,u=c.exec(s),null!==u);)y=c.lastIndex,c===f$1?"!--"===u[1]?c=v:undefined!==u[1]?c=_:undefined!==u[2]?($.test(u[2])&&(r=RegExp("</"+u[2],"g")),c=m):undefined!==u[3]&&(c=m):c===m?">"===u[0]?(c=r??f$1,d=-1):undefined===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=undefined===u[3]?m:'"'===u[3]?g:p$1):c===g||c===p$1?c=m:c===v||c===_?c=f$1:(c=m,r=undefined);const x=c===m&&t[i+1].startsWith("/>")?" ":"";l+=c===f$1?s+n$3:d>=0?(o.push(a),s.slice(0,d)+e$4+s.slice(d)+h$1+x):s+h$1+(-2===d?i:x);}return [P(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),o]};class N{constructor({strings:t,_$litType$:s},n){let r;this.parts=[];let c=0,a=0;const u=t.length-1,d=this.parts,[f,v]=V(t,s);if(this.el=N.createElement(f,n),C.currentNode=this.el.content,2===s||3===s){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=C.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(e$4)){const i=v[a++],s=r.getAttribute(t).split(h$1),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:c,name:e[2],strings:s,ctor:"."===e[1]?H:"?"===e[1]?I:"@"===e[1]?L:k}),r.removeAttribute(t);}else t.startsWith(h$1)&&(d.push({type:6,index:c}),r.removeAttribute(t));if($.test(r.tagName)){const t=r.textContent.split(h$1),s=t.length-1;if(s>0){r.textContent=i$5?i$5.emptyScript:"";for(let i=0;i<s;i++)r.append(t[i],l$2()),C.nextNode(),d.push({type:2,index:++c});r.append(t[s],l$2());}}}else if(8===r.nodeType)if(r.data===o$4)d.push({type:2,index:c});else {let t=-1;for(;-1!==(t=r.data.indexOf(h$1,t+1));)d.push({type:7,index:c}),t+=h$1.length-1;}c++;}}static createElement(t,i){const s=r$3.createElement("template");return s.innerHTML=t,s}}function S$1(t,i,s=t,e){if(i===T)return i;let h=undefined!==e?s._$Co?.[e]:s._$Cl;const o=c$2(i)?undefined:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(false),undefined===o?h=undefined:(h=new o(t),h._$AT(t,s,e)),undefined!==e?(s._$Co??=[])[e]=h:s._$Cl=h),undefined!==h&&(i=S$1(t,h._$AS(t,i.values),h,e)),i}class M{constructor(t,i){this._$AV=[],this._$AN=undefined,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??r$3).importNode(i,true);C.currentNode=e;let h=C.nextNode(),o=0,n=0,l=s[0];for(;undefined!==l;){if(o===l.index){let i;2===l.type?i=new R(h,h.nextSibling,this,t):1===l.type?i=new l.ctor(h,l.name,l.strings,this,t):6===l.type&&(i=new z(h,this,t)),this._$AV.push(i),l=s[++n];}o!==l?.index&&(h=C.nextNode(),o++);}return C.currentNode=r$3,e}p(t){let i=0;for(const s of this._$AV) undefined!==s&&(undefined!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class R{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=E,this._$AN=undefined,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??true;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return undefined!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=S$1(this,t,i),c$2(t)?t===E||null==t||""===t?(this._$AH!==E&&this._$AR(),this._$AH=E):t!==this._$AH&&t!==T&&this._(t):undefined!==t._$litType$?this.$(t):undefined!==t.nodeType?this.T(t):u$2(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==E&&c$2(this._$AH)?this._$AA.nextSibling.data=t:this.T(r$3.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(undefined===s.el&&(s.el=N.createElement(P(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new M(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=A.get(t.strings);return undefined===i&&A.set(t.strings,i=new N(t)),i}k(t){a$2(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const h of t)e===i.length?i.push(s=new R(this.O(l$2()),this.O(l$2()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,i){for(this._$AP?.(false,true,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i;}}setConnected(t){ undefined===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class k{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=E,this._$AN=undefined,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=E;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(undefined===h)t=S$1(this,t,i,0),o=!c$2(t)||t!==this._$AH&&t!==T,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=S$1(this,e[s+n],i,n),r===T&&(r=this._$AH[n]),o||=!c$2(r)||r!==this._$AH[n],r===E?t=E:t!==E&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===E?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class H extends k{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===E?undefined:t;}}class I extends k{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==E);}}class L extends k{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=S$1(this,t,i,0)??E)===T)return;const s=this._$AH,e=t===E&&s!==E||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==E&&(s===E||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}}class z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=undefined,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){S$1(this,t);}}const j=t$2.litHtmlPolyfillSupport;j?.(N,R),(t$2.litHtmlVersions??=[]).push("3.2.1");const B=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(undefined===h){const t=s?.renderBefore??null;e._$litPart$=h=new R(i.insertBefore(l$2(),t),t,undefined,s??{});}return h._$AI(t),h};
|
|
1592
|
-
|
|
1593
|
-
/**
|
|
1594
|
-
* @license
|
|
1595
|
-
* Copyright 2020 Google LLC
|
|
1596
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
1597
|
-
*/
|
|
1598
|
-
const a$1=Symbol.for(""),o$3=t=>{if(t?.r===a$1)return t?._$litStatic$},s$1=t=>({_$litStatic$:t,r:a$1}),i$4=(t,...r)=>({_$litStatic$:r.reduce(((r,e,a)=>r+(t=>{if(undefined!==t._$litStatic$)return t._$litStatic$;throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t}. Use 'unsafeStatic' to pass non-literal values, but\n take care to ensure page security.`)})(e)+t[a+1]),t[0]),r:a$1}),l$1=new Map,n$2=t=>(r,...e)=>{const a=e.length;let s,i;const n=[],u=[];let c,$=0,f=false;for(;$<a;){for(c=r[$];$<a&&undefined!==(i=e[$],s=o$3(i));)c+=s+r[++$],f=true;$!==a&&u.push(i),n.push(c),$++;}if($===a&&n.push(r[a]),f){const t=n.join("$$lit$$");undefined===(r=l$1.get(t))&&(n.raw=n,l$1.set(t,r=n)),e=u;}return t(r,...e)},u$1=n$2(x);
|
|
1586
|
+
var styleCss$1 = i$5`:host{position:relative;display:block}[slot=trigger]{display:flex;align-items:center;justify-content:space-between;gap:var(--ds-size-100, 0.5rem)}[auro-dropdown]{display:block}`;
|
|
1599
1587
|
|
|
1600
|
-
|
|
1601
|
-
* @license
|
|
1602
|
-
* Copyright 2019 Google LLC
|
|
1603
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
1604
|
-
*/
|
|
1605
|
-
const t$1=globalThis,e$3=t$1.ShadowRoot&&(undefined===t$1.ShadyCSS||t$1.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s=Symbol(),o$2=new WeakMap;let n$1 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$3&&undefined===t){const e=undefined!==s&&1===s.length;e&&(t=o$2.get(s)),undefined===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$2.set(s,t));}return t}toString(){return this.cssText}};const r$2=t=>new n$1("string"==typeof t?t:t+"",undefined,s),i$3=(t,...e)=>{const o=1===t.length?t[0]:e.reduce(((e,s,o)=>e+(t=>{if(true===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1]),t[0]);return new n$1(o,t,s)},S=(s,o)=>{if(e$3)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t$1.litNonce;undefined!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$1=e$3?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$2(e)})(t):t;
|
|
1588
|
+
var dropdownVersion = '3.0.0';
|
|
1606
1589
|
|
|
1607
|
-
|
|
1608
|
-
* @license
|
|
1609
|
-
* Copyright 2017 Google LLC
|
|
1610
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
1611
|
-
*/const{is:i$2,defineProperty:e$2,getOwnPropertyDescriptor:r$1,getOwnPropertyNames:h,getOwnPropertySymbols:o$1,getPrototypeOf:n}=Object,a=globalThis,c=a.trustedTypes,l=c?c.emptyScript:"",p=a.reactiveElementPolyfillSupport,d=(t,s)=>t,u={toAttribute(t,s){switch(s){case Boolean:t=t?l:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f=(t,s)=>!i$2(t,s),y={attribute:true,type:String,converter:u,reflect:false,hasChanged:f};Symbol.metadata??=Symbol("metadata"),a.litPropertyMetadata??=new WeakMap;class b extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=y){if(s.state&&(s.attribute=false),this._$Ei(),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),r=this.getPropertyDescriptor(t,i,s);undefined!==r&&e$2(this.prototype,t,r);}}static getPropertyDescriptor(t,s,i){const{get:e,set:h}=r$1(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get(){return e?.call(this)},set(s){const r=e?.call(this);h.call(this,s),this.requestUpdate(t,r,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??y}static _$Ei(){if(this.hasOwnProperty(d("elementProperties")))return;const t=n(this);t.finalize(),undefined!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d("properties"))){const t=this.properties,s=[...h(t),...o$1(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(undefined!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);undefined!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$1(s));}else undefined!==s&&i.push(c$1(s));return i}static _$Eu(t,s){const i=s.attribute;return false===i?undefined:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():undefined}constructor(){super(),this._$Ep=undefined,this.isUpdatePending=false,this.hasUpdated=false,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)));}addController(t){(this._$EO??=new Set).add(t),undefined!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach((t=>t.hostConnected?.()));}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()));}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$EC(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(undefined!==e&&true===i.reflect){const r=(undefined!==i.converter?.toAttribute?i.converter:u).toAttribute(s,i.type);this._$Em=t,null==r?this.removeAttribute(e):this.setAttribute(e,r),this._$Em=null;}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(undefined!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),r="function"==typeof t.converter?{fromAttribute:t.converter}:undefined!==t.converter?.fromAttribute?t.converter:u;this._$Em=e,this[e]=r.fromAttribute(s,t.type),this._$Em=null;}}requestUpdate(t,s,i){if(undefined!==t){if(i??=this.constructor.getPropertyOptions(t),!(i.hasChanged??f)(this[t],s))return;this.P(t,s,i);} false===this.isUpdatePending&&(this._$ES=this._$ET());}P(t,s,i){this._$AL.has(t)||this._$AL.set(t,s),true===i.reflect&&this._$Em!==t&&(this._$Ej??=new Set).add(t);}async _$ET(){this.isUpdatePending=true;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=undefined;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t) true!==i.wrapped||this._$AL.has(s)||undefined===this[s]||this.P(s,this[s],i);}let t=false;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(s)):this._$EU();}catch(s){throw t=false,this._$EU(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=true,this.firstUpdated(t)),this.updated(t);}_$EU(){this._$AL=new Map,this.isUpdatePending=false;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return true}update(t){this._$Ej&&=this._$Ej.forEach((t=>this._$EC(t,this[t]))),this._$EU();}updated(t){}firstUpdated(t){}}b.elementStyles=[],b.shadowRootOptions={mode:"open"},b[d("elementProperties")]=new Map,b[d("finalized")]=new Map,p?.({ReactiveElement:b}),(a.reactiveElementVersions??=[]).push("2.0.4");
|
|
1590
|
+
var styleCss = i$5`:host{display:flex;flex-direction:column;gap:var(--ds-size-300, 1.5rem)}:host ::slotted(*:not(:first-child)){padding-top:var(--ds-size-300, 1.5rem);border-top-width:1px;border-top-style:solid}:host([isindropdown]){padding:var(--ds-size-300, 1.5rem)}`;
|
|
1612
1591
|
|
|
1613
|
-
|
|
1614
|
-
* @license
|
|
1615
|
-
* Copyright 2017 Google LLC
|
|
1616
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
1617
|
-
*/class r extends b{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=undefined;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const s=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=B(s,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return T}}r._$litElement$=true,r["finalized"]=true,globalThis.litElementHydrateSupport?.({LitElement:r});const i$1=globalThis.litElementPolyfillSupport;i$1?.({LitElement:r});(globalThis.litElementVersions??=[]).push("4.1.1");
|
|
1592
|
+
var colorCss = i$5`:host ::slotted(*:not(:first-child)){border-color:var(--ds-color-border-divider-default, rgba(0, 0, 0, 0.12))}`;
|
|
1618
1593
|
|
|
1619
|
-
// Copyright (c) Alaska
|
|
1594
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
1620
1595
|
// See LICENSE in the project root for license information.
|
|
1621
1596
|
|
|
1622
|
-
// ---------------------------------------------------------------------
|
|
1623
|
-
|
|
1624
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
1625
|
-
|
|
1626
|
-
class AuroLibraryRuntimeUtils {
|
|
1627
|
-
|
|
1628
|
-
/* eslint-disable jsdoc/require-param */
|
|
1629
1597
|
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1637
|
-
|
|
1638
|
-
|
|
1639
|
-
|
|
1640
|
-
|
|
1598
|
+
/**
|
|
1599
|
+
* Auro Counter Wrapper is a group of counter components.
|
|
1600
|
+
*
|
|
1601
|
+
* This web component provides a flexible interface for grouping multiple counters, supporting
|
|
1602
|
+
* validation, custom validity messages, and disabled states based on the group's value.
|
|
1603
|
+
*
|
|
1604
|
+
* @element auro-counter-group
|
|
1605
|
+
* @extends LitElement
|
|
1606
|
+
* @slot Default - Slot for counter elements.
|
|
1607
|
+
*/
|
|
1608
|
+
class AuroCounterWrapper extends r {
|
|
1641
1609
|
|
|
1642
|
-
|
|
1643
|
-
|
|
1644
|
-
|
|
1645
|
-
|
|
1646
|
-
|
|
1647
|
-
selector, // selector like in .closest()
|
|
1648
|
-
base = this, // extra functionality to skip a parent
|
|
1649
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
1650
|
-
!el || el === document || el === window
|
|
1651
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
1652
|
-
: found
|
|
1653
|
-
? found // found a selector INside this element
|
|
1654
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
1655
|
-
) {
|
|
1656
|
-
return __Closest(base);
|
|
1610
|
+
static get styles() {
|
|
1611
|
+
return [
|
|
1612
|
+
colorCss,
|
|
1613
|
+
styleCss
|
|
1614
|
+
];
|
|
1657
1615
|
}
|
|
1658
|
-
/* eslint-enable jsdoc/require-param */
|
|
1659
1616
|
|
|
1660
1617
|
/**
|
|
1661
|
-
*
|
|
1662
|
-
* @param {
|
|
1663
|
-
* @
|
|
1664
|
-
*
|
|
1618
|
+
* Registers the custom element with the browser.
|
|
1619
|
+
* @param {string} [name="auro-counter-wrapper"] - Custom element name to register.
|
|
1620
|
+
* @example
|
|
1621
|
+
* AuroCounterWrapper.register("custom-counter-wrapper") // registers <custom-counter-wrapper/>
|
|
1665
1622
|
*/
|
|
1666
|
-
|
|
1667
|
-
|
|
1668
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
1669
|
-
|
|
1670
|
-
if (elemTag !== tag) {
|
|
1671
|
-
elem.setAttribute(tag, true);
|
|
1672
|
-
}
|
|
1623
|
+
static register(name = "auro-counter-wrapper") {
|
|
1624
|
+
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroCounterWrapper);
|
|
1673
1625
|
}
|
|
1674
1626
|
|
|
1675
|
-
|
|
1676
|
-
|
|
1677
|
-
|
|
1678
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
1679
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
1680
|
-
*/
|
|
1681
|
-
elementMatch(elem, tagName) {
|
|
1682
|
-
const tag = tagName.toLowerCase();
|
|
1683
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
1684
|
-
|
|
1685
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
1627
|
+
// function that renders the HTML and CSS into the scope of the component
|
|
1628
|
+
render() {
|
|
1629
|
+
return u`<slot></slot>`;
|
|
1686
1630
|
}
|
|
1687
1631
|
}
|
|
1688
1632
|
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
const sides = ['top', 'right', 'bottom', 'left'];
|
|
1695
|
-
const alignments = ['start', 'end'];
|
|
1696
|
-
const placements = /*#__PURE__*/sides.reduce((acc, side) => acc.concat(side, side + "-" + alignments[0], side + "-" + alignments[1]), []);
|
|
1697
|
-
const min = Math.min;
|
|
1698
|
-
const max = Math.max;
|
|
1699
|
-
const round = Math.round;
|
|
1700
|
-
const floor = Math.floor;
|
|
1701
|
-
const createCoords = v => ({
|
|
1702
|
-
x: v,
|
|
1703
|
-
y: v
|
|
1704
|
-
});
|
|
1705
|
-
const oppositeSideMap = {
|
|
1706
|
-
left: 'right',
|
|
1707
|
-
right: 'left',
|
|
1708
|
-
bottom: 'top',
|
|
1709
|
-
top: 'bottom'
|
|
1710
|
-
};
|
|
1711
|
-
const oppositeAlignmentMap = {
|
|
1712
|
-
start: 'end',
|
|
1713
|
-
end: 'start'
|
|
1714
|
-
};
|
|
1715
|
-
function evaluate(value, param) {
|
|
1716
|
-
return typeof value === 'function' ? value(param) : value;
|
|
1717
|
-
}
|
|
1718
|
-
function getSide(placement) {
|
|
1719
|
-
return placement.split('-')[0];
|
|
1720
|
-
}
|
|
1721
|
-
function getAlignment(placement) {
|
|
1722
|
-
return placement.split('-')[1];
|
|
1723
|
-
}
|
|
1724
|
-
function getOppositeAxis(axis) {
|
|
1725
|
-
return axis === 'x' ? 'y' : 'x';
|
|
1726
|
-
}
|
|
1727
|
-
function getAxisLength(axis) {
|
|
1728
|
-
return axis === 'y' ? 'height' : 'width';
|
|
1729
|
-
}
|
|
1730
|
-
function getSideAxis(placement) {
|
|
1731
|
-
return ['top', 'bottom'].includes(getSide(placement)) ? 'y' : 'x';
|
|
1732
|
-
}
|
|
1733
|
-
function getAlignmentAxis(placement) {
|
|
1734
|
-
return getOppositeAxis(getSideAxis(placement));
|
|
1735
|
-
}
|
|
1736
|
-
function getAlignmentSides(placement, rects, rtl) {
|
|
1737
|
-
if (rtl === undefined) {
|
|
1738
|
-
rtl = false;
|
|
1739
|
-
}
|
|
1740
|
-
const alignment = getAlignment(placement);
|
|
1741
|
-
const alignmentAxis = getAlignmentAxis(placement);
|
|
1742
|
-
const length = getAxisLength(alignmentAxis);
|
|
1743
|
-
let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
|
|
1744
|
-
if (rects.reference[length] > rects.floating[length]) {
|
|
1745
|
-
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
|
1746
|
-
}
|
|
1747
|
-
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
|
|
1748
|
-
}
|
|
1749
|
-
function getExpandedPlacements(placement) {
|
|
1750
|
-
const oppositePlacement = getOppositePlacement(placement);
|
|
1751
|
-
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
|
|
1752
|
-
}
|
|
1753
|
-
function getOppositeAlignmentPlacement(placement) {
|
|
1754
|
-
return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
|
|
1755
|
-
}
|
|
1756
|
-
function getSideList(side, isStart, rtl) {
|
|
1757
|
-
const lr = ['left', 'right'];
|
|
1758
|
-
const rl = ['right', 'left'];
|
|
1759
|
-
const tb = ['top', 'bottom'];
|
|
1760
|
-
const bt = ['bottom', 'top'];
|
|
1761
|
-
switch (side) {
|
|
1762
|
-
case 'top':
|
|
1763
|
-
case 'bottom':
|
|
1764
|
-
if (rtl) return isStart ? rl : lr;
|
|
1765
|
-
return isStart ? lr : rl;
|
|
1766
|
-
case 'left':
|
|
1767
|
-
case 'right':
|
|
1768
|
-
return isStart ? tb : bt;
|
|
1769
|
-
default:
|
|
1770
|
-
return [];
|
|
1771
|
-
}
|
|
1772
|
-
}
|
|
1773
|
-
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
|
1774
|
-
const alignment = getAlignment(placement);
|
|
1775
|
-
let list = getSideList(getSide(placement), direction === 'start', rtl);
|
|
1776
|
-
if (alignment) {
|
|
1777
|
-
list = list.map(side => side + "-" + alignment);
|
|
1778
|
-
if (flipAlignment) {
|
|
1779
|
-
list = list.concat(list.map(getOppositeAlignmentPlacement));
|
|
1780
|
-
}
|
|
1781
|
-
}
|
|
1782
|
-
return list;
|
|
1783
|
-
}
|
|
1784
|
-
function getOppositePlacement(placement) {
|
|
1785
|
-
return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
|
|
1786
|
-
}
|
|
1787
|
-
function expandPaddingObject(padding) {
|
|
1788
|
-
return {
|
|
1789
|
-
top: 0,
|
|
1790
|
-
right: 0,
|
|
1791
|
-
bottom: 0,
|
|
1792
|
-
left: 0,
|
|
1793
|
-
...padding
|
|
1794
|
-
};
|
|
1795
|
-
}
|
|
1796
|
-
function getPaddingObject(padding) {
|
|
1797
|
-
return typeof padding !== 'number' ? expandPaddingObject(padding) : {
|
|
1798
|
-
top: padding,
|
|
1799
|
-
right: padding,
|
|
1800
|
-
bottom: padding,
|
|
1801
|
-
left: padding
|
|
1802
|
-
};
|
|
1803
|
-
}
|
|
1804
|
-
function rectToClientRect(rect) {
|
|
1805
|
-
const {
|
|
1806
|
-
x,
|
|
1807
|
-
y,
|
|
1808
|
-
width,
|
|
1809
|
-
height
|
|
1810
|
-
} = rect;
|
|
1811
|
-
return {
|
|
1812
|
-
width,
|
|
1813
|
-
height,
|
|
1814
|
-
top: y,
|
|
1815
|
-
left: x,
|
|
1816
|
-
right: x + width,
|
|
1817
|
-
bottom: y + height,
|
|
1818
|
-
x,
|
|
1819
|
-
y
|
|
1820
|
-
};
|
|
1633
|
+
/* istanbul ignore else */
|
|
1634
|
+
// define the name of the custom component
|
|
1635
|
+
if (!customElements.get("auro-counter-wrapper")) {
|
|
1636
|
+
customElements.define("auro-counter-wrapper", AuroCounterWrapper);
|
|
1821
1637
|
}
|
|
1822
1638
|
|
|
1823
|
-
|
|
1824
|
-
let {
|
|
1825
|
-
reference,
|
|
1826
|
-
floating
|
|
1827
|
-
} = _ref;
|
|
1828
|
-
const sideAxis = getSideAxis(placement);
|
|
1829
|
-
const alignmentAxis = getAlignmentAxis(placement);
|
|
1830
|
-
const alignLength = getAxisLength(alignmentAxis);
|
|
1831
|
-
const side = getSide(placement);
|
|
1832
|
-
const isVertical = sideAxis === 'y';
|
|
1833
|
-
const commonX = reference.x + reference.width / 2 - floating.width / 2;
|
|
1834
|
-
const commonY = reference.y + reference.height / 2 - floating.height / 2;
|
|
1835
|
-
const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
|
|
1836
|
-
let coords;
|
|
1837
|
-
switch (side) {
|
|
1838
|
-
case 'top':
|
|
1839
|
-
coords = {
|
|
1840
|
-
x: commonX,
|
|
1841
|
-
y: reference.y - floating.height
|
|
1842
|
-
};
|
|
1843
|
-
break;
|
|
1844
|
-
case 'bottom':
|
|
1845
|
-
coords = {
|
|
1846
|
-
x: commonX,
|
|
1847
|
-
y: reference.y + reference.height
|
|
1848
|
-
};
|
|
1849
|
-
break;
|
|
1850
|
-
case 'right':
|
|
1851
|
-
coords = {
|
|
1852
|
-
x: reference.x + reference.width,
|
|
1853
|
-
y: commonY
|
|
1854
|
-
};
|
|
1855
|
-
break;
|
|
1856
|
-
case 'left':
|
|
1857
|
-
coords = {
|
|
1858
|
-
x: reference.x - floating.width,
|
|
1859
|
-
y: commonY
|
|
1860
|
-
};
|
|
1861
|
-
break;
|
|
1862
|
-
default:
|
|
1863
|
-
coords = {
|
|
1864
|
-
x: reference.x,
|
|
1865
|
-
y: reference.y
|
|
1866
|
-
};
|
|
1867
|
-
}
|
|
1868
|
-
switch (getAlignment(placement)) {
|
|
1869
|
-
case 'start':
|
|
1870
|
-
coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
|
|
1871
|
-
break;
|
|
1872
|
-
case 'end':
|
|
1873
|
-
coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
|
|
1874
|
-
break;
|
|
1875
|
-
}
|
|
1876
|
-
return coords;
|
|
1877
|
-
}
|
|
1639
|
+
/* eslint-disable lit/no-invalid-html, lit/binding-positions */
|
|
1878
1640
|
|
|
1879
|
-
/**
|
|
1880
|
-
* Computes the `x` and `y` coordinates that will place the floating element
|
|
1881
|
-
* next to a given reference element.
|
|
1882
|
-
*
|
|
1883
|
-
* This export does not have any `platform` interface logic. You will need to
|
|
1884
|
-
* write one for the platform you are using Floating UI with.
|
|
1885
|
-
*/
|
|
1886
|
-
const computePosition$1 = async (reference, floating, config) => {
|
|
1887
|
-
const {
|
|
1888
|
-
placement = 'bottom',
|
|
1889
|
-
strategy = 'absolute',
|
|
1890
|
-
middleware = [],
|
|
1891
|
-
platform
|
|
1892
|
-
} = config;
|
|
1893
|
-
const validMiddleware = middleware.filter(Boolean);
|
|
1894
|
-
const rtl = await (platform.isRTL == null ? undefined : platform.isRTL(floating));
|
|
1895
|
-
let rects = await platform.getElementRects({
|
|
1896
|
-
reference,
|
|
1897
|
-
floating,
|
|
1898
|
-
strategy
|
|
1899
|
-
});
|
|
1900
|
-
let {
|
|
1901
|
-
x,
|
|
1902
|
-
y
|
|
1903
|
-
} = computeCoordsFromPlacement(rects, placement, rtl);
|
|
1904
|
-
let statefulPlacement = placement;
|
|
1905
|
-
let middlewareData = {};
|
|
1906
|
-
let resetCount = 0;
|
|
1907
|
-
for (let i = 0; i < validMiddleware.length; i++) {
|
|
1908
|
-
const {
|
|
1909
|
-
name,
|
|
1910
|
-
fn
|
|
1911
|
-
} = validMiddleware[i];
|
|
1912
|
-
const {
|
|
1913
|
-
x: nextX,
|
|
1914
|
-
y: nextY,
|
|
1915
|
-
data,
|
|
1916
|
-
reset
|
|
1917
|
-
} = await fn({
|
|
1918
|
-
x,
|
|
1919
|
-
y,
|
|
1920
|
-
initialPlacement: placement,
|
|
1921
|
-
placement: statefulPlacement,
|
|
1922
|
-
strategy,
|
|
1923
|
-
middlewareData,
|
|
1924
|
-
rects,
|
|
1925
|
-
platform,
|
|
1926
|
-
elements: {
|
|
1927
|
-
reference,
|
|
1928
|
-
floating
|
|
1929
|
-
}
|
|
1930
|
-
});
|
|
1931
|
-
x = nextX != null ? nextX : x;
|
|
1932
|
-
y = nextY != null ? nextY : y;
|
|
1933
|
-
middlewareData = {
|
|
1934
|
-
...middlewareData,
|
|
1935
|
-
[name]: {
|
|
1936
|
-
...middlewareData[name],
|
|
1937
|
-
...data
|
|
1938
|
-
}
|
|
1939
|
-
};
|
|
1940
|
-
if (reset && resetCount <= 50) {
|
|
1941
|
-
resetCount++;
|
|
1942
|
-
if (typeof reset === 'object') {
|
|
1943
|
-
if (reset.placement) {
|
|
1944
|
-
statefulPlacement = reset.placement;
|
|
1945
|
-
}
|
|
1946
|
-
if (reset.rects) {
|
|
1947
|
-
rects = reset.rects === true ? await platform.getElementRects({
|
|
1948
|
-
reference,
|
|
1949
|
-
floating,
|
|
1950
|
-
strategy
|
|
1951
|
-
}) : reset.rects;
|
|
1952
|
-
}
|
|
1953
|
-
({
|
|
1954
|
-
x,
|
|
1955
|
-
y
|
|
1956
|
-
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
|
|
1957
|
-
}
|
|
1958
|
-
i = -1;
|
|
1959
|
-
}
|
|
1960
|
-
}
|
|
1961
|
-
return {
|
|
1962
|
-
x,
|
|
1963
|
-
y,
|
|
1964
|
-
placement: statefulPlacement,
|
|
1965
|
-
strategy,
|
|
1966
|
-
middlewareData
|
|
1967
|
-
};
|
|
1968
|
-
};
|
|
1969
1641
|
|
|
1970
1642
|
/**
|
|
1971
|
-
*
|
|
1972
|
-
*
|
|
1973
|
-
*
|
|
1974
|
-
*
|
|
1975
|
-
*
|
|
1976
|
-
* @
|
|
1643
|
+
* Auro Counter Group is a group of counter components.
|
|
1644
|
+
*
|
|
1645
|
+
* This web component provides a flexible interface for grouping multiple counters, supporting
|
|
1646
|
+
* validation, custom validity messages, and disabled states based on the group's value.
|
|
1647
|
+
*
|
|
1648
|
+
* @element auro-counter-group
|
|
1649
|
+
* @extends LitElement
|
|
1650
|
+
* @slot Default - Slot for counter elements.
|
|
1977
1651
|
*/
|
|
1978
|
-
|
|
1979
|
-
|
|
1980
|
-
|
|
1981
|
-
options = {};
|
|
1982
|
-
}
|
|
1983
|
-
const {
|
|
1984
|
-
x,
|
|
1985
|
-
y,
|
|
1986
|
-
platform,
|
|
1987
|
-
rects,
|
|
1988
|
-
elements,
|
|
1989
|
-
strategy
|
|
1990
|
-
} = state;
|
|
1991
|
-
const {
|
|
1992
|
-
boundary = 'clippingAncestors',
|
|
1993
|
-
rootBoundary = 'viewport',
|
|
1994
|
-
elementContext = 'floating',
|
|
1995
|
-
altBoundary = false,
|
|
1996
|
-
padding = 0
|
|
1997
|
-
} = evaluate(options, state);
|
|
1998
|
-
const paddingObject = getPaddingObject(padding);
|
|
1999
|
-
const altContext = elementContext === 'floating' ? 'reference' : 'floating';
|
|
2000
|
-
const element = elements[altBoundary ? altContext : elementContext];
|
|
2001
|
-
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
2002
|
-
element: ((_await$platform$isEle = await (platform.isElement == null ? undefined : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? undefined : platform.getDocumentElement(elements.floating))),
|
|
2003
|
-
boundary,
|
|
2004
|
-
rootBoundary,
|
|
2005
|
-
strategy
|
|
2006
|
-
}));
|
|
2007
|
-
const rect = elementContext === 'floating' ? {
|
|
2008
|
-
x,
|
|
2009
|
-
y,
|
|
2010
|
-
width: rects.floating.width,
|
|
2011
|
-
height: rects.floating.height
|
|
2012
|
-
} : rects.reference;
|
|
2013
|
-
const offsetParent = await (platform.getOffsetParent == null ? undefined : platform.getOffsetParent(elements.floating));
|
|
2014
|
-
const offsetScale = (await (platform.isElement == null ? undefined : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? undefined : platform.getScale(offsetParent))) || {
|
|
2015
|
-
x: 1,
|
|
2016
|
-
y: 1
|
|
2017
|
-
} : {
|
|
2018
|
-
x: 1,
|
|
2019
|
-
y: 1
|
|
2020
|
-
};
|
|
2021
|
-
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
2022
|
-
elements,
|
|
2023
|
-
rect,
|
|
2024
|
-
offsetParent,
|
|
2025
|
-
strategy
|
|
2026
|
-
}) : rect);
|
|
2027
|
-
return {
|
|
2028
|
-
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
2029
|
-
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
2030
|
-
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
2031
|
-
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
2032
|
-
};
|
|
2033
|
-
}
|
|
1652
|
+
class AuroCounterGroup extends r {
|
|
1653
|
+
constructor() {
|
|
1654
|
+
super();
|
|
2034
1655
|
|
|
2035
|
-
|
|
2036
|
-
const allowedPlacementsSortedByAlignment = alignment ? [...allowedPlacements.filter(placement => getAlignment(placement) === alignment), ...allowedPlacements.filter(placement => getAlignment(placement) !== alignment)] : allowedPlacements.filter(placement => getSide(placement) === placement);
|
|
2037
|
-
return allowedPlacementsSortedByAlignment.filter(placement => {
|
|
2038
|
-
if (alignment) {
|
|
2039
|
-
return getAlignment(placement) === alignment || (autoAlignment ? getOppositeAlignmentPlacement(placement) !== placement : false);
|
|
2040
|
-
}
|
|
2041
|
-
return true;
|
|
2042
|
-
});
|
|
2043
|
-
}
|
|
2044
|
-
/**
|
|
2045
|
-
* Optimizes the visibility of the floating element by choosing the placement
|
|
2046
|
-
* that has the most space available automatically, without needing to specify a
|
|
2047
|
-
* preferred placement. Alternative to `flip`.
|
|
2048
|
-
* @see https://floating-ui.com/docs/autoPlacement
|
|
2049
|
-
*/
|
|
2050
|
-
const autoPlacement$1 = function (options) {
|
|
2051
|
-
if (options === undefined) {
|
|
2052
|
-
options = {};
|
|
2053
|
-
}
|
|
2054
|
-
return {
|
|
2055
|
-
name: 'autoPlacement',
|
|
2056
|
-
options,
|
|
2057
|
-
async fn(state) {
|
|
2058
|
-
var _middlewareData$autoP, _middlewareData$autoP2, _placementsThatFitOnE;
|
|
2059
|
-
const {
|
|
2060
|
-
rects,
|
|
2061
|
-
middlewareData,
|
|
2062
|
-
placement,
|
|
2063
|
-
platform,
|
|
2064
|
-
elements
|
|
2065
|
-
} = state;
|
|
2066
|
-
const {
|
|
2067
|
-
crossAxis = false,
|
|
2068
|
-
alignment,
|
|
2069
|
-
allowedPlacements = placements,
|
|
2070
|
-
autoAlignment = true,
|
|
2071
|
-
...detectOverflowOptions
|
|
2072
|
-
} = evaluate(options, state);
|
|
2073
|
-
const placements$1 = alignment !== undefined || allowedPlacements === placements ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
|
|
2074
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
2075
|
-
const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? undefined : _middlewareData$autoP.index) || 0;
|
|
2076
|
-
const currentPlacement = placements$1[currentIndex];
|
|
2077
|
-
if (currentPlacement == null) {
|
|
2078
|
-
return {};
|
|
2079
|
-
}
|
|
2080
|
-
const alignmentSides = getAlignmentSides(currentPlacement, rects, await (platform.isRTL == null ? undefined : platform.isRTL(elements.floating)));
|
|
1656
|
+
this.isDropdown = false;
|
|
2081
1657
|
|
|
2082
|
-
|
|
2083
|
-
|
|
2084
|
-
|
|
2085
|
-
|
|
2086
|
-
|
|
2087
|
-
}
|
|
2088
|
-
};
|
|
2089
|
-
}
|
|
2090
|
-
const currentOverflows = [overflow[getSide(currentPlacement)], overflow[alignmentSides[0]], overflow[alignmentSides[1]]];
|
|
2091
|
-
const allOverflows = [...(((_middlewareData$autoP2 = middlewareData.autoPlacement) == null ? undefined : _middlewareData$autoP2.overflows) || []), {
|
|
2092
|
-
placement: currentPlacement,
|
|
2093
|
-
overflows: currentOverflows
|
|
2094
|
-
}];
|
|
2095
|
-
const nextPlacement = placements$1[currentIndex + 1];
|
|
2096
|
-
|
|
2097
|
-
// There are more placements to check.
|
|
2098
|
-
if (nextPlacement) {
|
|
2099
|
-
return {
|
|
2100
|
-
data: {
|
|
2101
|
-
index: currentIndex + 1,
|
|
2102
|
-
overflows: allOverflows
|
|
2103
|
-
},
|
|
2104
|
-
reset: {
|
|
2105
|
-
placement: nextPlacement
|
|
2106
|
-
}
|
|
2107
|
-
};
|
|
2108
|
-
}
|
|
2109
|
-
const placementsSortedByMostSpace = allOverflows.map(d => {
|
|
2110
|
-
const alignment = getAlignment(d.placement);
|
|
2111
|
-
return [d.placement, alignment && crossAxis ?
|
|
2112
|
-
// Check along the mainAxis and main crossAxis side.
|
|
2113
|
-
d.overflows.slice(0, 2).reduce((acc, v) => acc + v, 0) :
|
|
2114
|
-
// Check only the mainAxis.
|
|
2115
|
-
d.overflows[0], d.overflows];
|
|
2116
|
-
}).sort((a, b) => a[1] - b[1]);
|
|
2117
|
-
const placementsThatFitOnEachSide = placementsSortedByMostSpace.filter(d => d[2].slice(0,
|
|
2118
|
-
// Aligned placements should not check their opposite crossAxis
|
|
2119
|
-
// side.
|
|
2120
|
-
getAlignment(d[0]) ? 2 : 3).every(v => v <= 0));
|
|
2121
|
-
const resetPlacement = ((_placementsThatFitOnE = placementsThatFitOnEachSide[0]) == null ? undefined : _placementsThatFitOnE[0]) || placementsSortedByMostSpace[0][0];
|
|
2122
|
-
if (resetPlacement !== placement) {
|
|
2123
|
-
return {
|
|
2124
|
-
data: {
|
|
2125
|
-
index: currentIndex + 1,
|
|
2126
|
-
overflows: allOverflows
|
|
2127
|
-
},
|
|
2128
|
-
reset: {
|
|
2129
|
-
placement: resetPlacement
|
|
2130
|
-
}
|
|
2131
|
-
};
|
|
2132
|
-
}
|
|
2133
|
-
return {};
|
|
2134
|
-
}
|
|
2135
|
-
};
|
|
2136
|
-
};
|
|
1658
|
+
this.max = undefined;
|
|
1659
|
+
this.min = undefined;
|
|
1660
|
+
this.total = undefined;
|
|
1661
|
+
this.validity = undefined;
|
|
1662
|
+
this.value = undefined;
|
|
2137
1663
|
|
|
2138
|
-
/**
|
|
2139
|
-
|
|
2140
|
-
|
|
2141
|
-
|
|
2142
|
-
* @see https://floating-ui.com/docs/flip
|
|
2143
|
-
*/
|
|
2144
|
-
const flip$1 = function (options) {
|
|
2145
|
-
if (options === undefined) {
|
|
2146
|
-
options = {};
|
|
2147
|
-
}
|
|
2148
|
-
return {
|
|
2149
|
-
name: 'flip',
|
|
2150
|
-
options,
|
|
2151
|
-
async fn(state) {
|
|
2152
|
-
var _middlewareData$arrow, _middlewareData$flip;
|
|
2153
|
-
const {
|
|
2154
|
-
placement,
|
|
2155
|
-
middlewareData,
|
|
2156
|
-
rects,
|
|
2157
|
-
initialPlacement,
|
|
2158
|
-
platform,
|
|
2159
|
-
elements
|
|
2160
|
-
} = state;
|
|
2161
|
-
const {
|
|
2162
|
-
mainAxis: checkMainAxis = true,
|
|
2163
|
-
crossAxis: checkCrossAxis = true,
|
|
2164
|
-
fallbackPlacements: specifiedFallbackPlacements,
|
|
2165
|
-
fallbackStrategy = 'bestFit',
|
|
2166
|
-
fallbackAxisSideDirection = 'none',
|
|
2167
|
-
flipAlignment = true,
|
|
2168
|
-
...detectOverflowOptions
|
|
2169
|
-
} = evaluate(options, state);
|
|
2170
|
-
|
|
2171
|
-
// If a reset by the arrow was caused due to an alignment offset being
|
|
2172
|
-
// added, we should skip any logic now since `flip()` has already done its
|
|
2173
|
-
// work.
|
|
2174
|
-
// https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
|
|
2175
|
-
if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
2176
|
-
return {};
|
|
2177
|
-
}
|
|
2178
|
-
const side = getSide(placement);
|
|
2179
|
-
const initialSideAxis = getSideAxis(initialPlacement);
|
|
2180
|
-
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
|
|
2181
|
-
const rtl = await (platform.isRTL == null ? undefined : platform.isRTL(elements.floating));
|
|
2182
|
-
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
|
|
2183
|
-
const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== 'none';
|
|
2184
|
-
if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
|
|
2185
|
-
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
2186
|
-
}
|
|
2187
|
-
const placements = [initialPlacement, ...fallbackPlacements];
|
|
2188
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
2189
|
-
const overflows = [];
|
|
2190
|
-
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? undefined : _middlewareData$flip.overflows) || [];
|
|
2191
|
-
if (checkMainAxis) {
|
|
2192
|
-
overflows.push(overflow[side]);
|
|
2193
|
-
}
|
|
2194
|
-
if (checkCrossAxis) {
|
|
2195
|
-
const sides = getAlignmentSides(placement, rects, rtl);
|
|
2196
|
-
overflows.push(overflow[sides[0]], overflow[sides[1]]);
|
|
2197
|
-
}
|
|
2198
|
-
overflowsData = [...overflowsData, {
|
|
2199
|
-
placement,
|
|
2200
|
-
overflows
|
|
2201
|
-
}];
|
|
2202
|
-
|
|
2203
|
-
// One or more sides is overflowing.
|
|
2204
|
-
if (!overflows.every(side => side <= 0)) {
|
|
2205
|
-
var _middlewareData$flip2, _overflowsData$filter;
|
|
2206
|
-
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? undefined : _middlewareData$flip2.index) || 0) + 1;
|
|
2207
|
-
const nextPlacement = placements[nextIndex];
|
|
2208
|
-
if (nextPlacement) {
|
|
2209
|
-
// Try next placement and re-run the lifecycle.
|
|
2210
|
-
return {
|
|
2211
|
-
data: {
|
|
2212
|
-
index: nextIndex,
|
|
2213
|
-
overflows: overflowsData
|
|
2214
|
-
},
|
|
2215
|
-
reset: {
|
|
2216
|
-
placement: nextPlacement
|
|
2217
|
-
}
|
|
2218
|
-
};
|
|
2219
|
-
}
|
|
1664
|
+
/**
|
|
1665
|
+
* @private
|
|
1666
|
+
*/
|
|
1667
|
+
this.counters = undefined;
|
|
2220
1668
|
|
|
2221
|
-
|
|
2222
|
-
|
|
2223
|
-
|
|
2224
|
-
|
|
2225
|
-
// Otherwise fallback.
|
|
2226
|
-
if (!resetPlacement) {
|
|
2227
|
-
switch (fallbackStrategy) {
|
|
2228
|
-
case 'bestFit':
|
|
2229
|
-
{
|
|
2230
|
-
var _overflowsData$filter2;
|
|
2231
|
-
const placement = (_overflowsData$filter2 = overflowsData.filter(d => {
|
|
2232
|
-
if (hasFallbackAxisSideDirection) {
|
|
2233
|
-
const currentSideAxis = getSideAxis(d.placement);
|
|
2234
|
-
return currentSideAxis === initialSideAxis ||
|
|
2235
|
-
// Create a bias to the `y` side axis due to horizontal
|
|
2236
|
-
// reading directions favoring greater width.
|
|
2237
|
-
currentSideAxis === 'y';
|
|
2238
|
-
}
|
|
2239
|
-
return true;
|
|
2240
|
-
}).map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? undefined : _overflowsData$filter2[0];
|
|
2241
|
-
if (placement) {
|
|
2242
|
-
resetPlacement = placement;
|
|
2243
|
-
}
|
|
2244
|
-
break;
|
|
2245
|
-
}
|
|
2246
|
-
case 'initialPlacement':
|
|
2247
|
-
resetPlacement = initialPlacement;
|
|
2248
|
-
break;
|
|
2249
|
-
}
|
|
2250
|
-
}
|
|
2251
|
-
if (placement !== resetPlacement) {
|
|
2252
|
-
return {
|
|
2253
|
-
reset: {
|
|
2254
|
-
placement: resetPlacement
|
|
2255
|
-
}
|
|
2256
|
-
};
|
|
2257
|
-
}
|
|
2258
|
-
}
|
|
2259
|
-
return {};
|
|
2260
|
-
}
|
|
2261
|
-
};
|
|
2262
|
-
};
|
|
2263
|
-
|
|
2264
|
-
// For type backwards-compatibility, the `OffsetOptions` type was also
|
|
2265
|
-
// Derivable.
|
|
2266
|
-
|
|
2267
|
-
async function convertValueToCoords(state, options) {
|
|
2268
|
-
const {
|
|
2269
|
-
placement,
|
|
2270
|
-
platform,
|
|
2271
|
-
elements
|
|
2272
|
-
} = state;
|
|
2273
|
-
const rtl = await (platform.isRTL == null ? undefined : platform.isRTL(elements.floating));
|
|
2274
|
-
const side = getSide(placement);
|
|
2275
|
-
const alignment = getAlignment(placement);
|
|
2276
|
-
const isVertical = getSideAxis(placement) === 'y';
|
|
2277
|
-
const mainAxisMulti = ['left', 'top'].includes(side) ? -1 : 1;
|
|
2278
|
-
const crossAxisMulti = rtl && isVertical ? -1 : 1;
|
|
2279
|
-
const rawValue = evaluate(options, state);
|
|
2280
|
-
|
|
2281
|
-
// eslint-disable-next-line prefer-const
|
|
2282
|
-
let {
|
|
2283
|
-
mainAxis,
|
|
2284
|
-
crossAxis,
|
|
2285
|
-
alignmentAxis
|
|
2286
|
-
} = typeof rawValue === 'number' ? {
|
|
2287
|
-
mainAxis: rawValue,
|
|
2288
|
-
crossAxis: 0,
|
|
2289
|
-
alignmentAxis: null
|
|
2290
|
-
} : {
|
|
2291
|
-
mainAxis: rawValue.mainAxis || 0,
|
|
2292
|
-
crossAxis: rawValue.crossAxis || 0,
|
|
2293
|
-
alignmentAxis: rawValue.alignmentAxis
|
|
2294
|
-
};
|
|
2295
|
-
if (alignment && typeof alignmentAxis === 'number') {
|
|
2296
|
-
crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
|
|
2297
|
-
}
|
|
2298
|
-
return isVertical ? {
|
|
2299
|
-
x: crossAxis * crossAxisMulti,
|
|
2300
|
-
y: mainAxis * mainAxisMulti
|
|
2301
|
-
} : {
|
|
2302
|
-
x: mainAxis * mainAxisMulti,
|
|
2303
|
-
y: crossAxis * crossAxisMulti
|
|
2304
|
-
};
|
|
2305
|
-
}
|
|
2306
|
-
|
|
2307
|
-
/**
|
|
2308
|
-
* Modifies the placement by translating the floating element along the
|
|
2309
|
-
* specified axes.
|
|
2310
|
-
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
2311
|
-
* object may be passed.
|
|
2312
|
-
* @see https://floating-ui.com/docs/offset
|
|
2313
|
-
*/
|
|
2314
|
-
const offset$1 = function (options) {
|
|
2315
|
-
if (options === undefined) {
|
|
2316
|
-
options = 0;
|
|
2317
|
-
}
|
|
2318
|
-
return {
|
|
2319
|
-
name: 'offset',
|
|
2320
|
-
options,
|
|
2321
|
-
async fn(state) {
|
|
2322
|
-
var _middlewareData$offse, _middlewareData$arrow;
|
|
2323
|
-
const {
|
|
2324
|
-
x,
|
|
2325
|
-
y,
|
|
2326
|
-
placement,
|
|
2327
|
-
middlewareData
|
|
2328
|
-
} = state;
|
|
2329
|
-
const diffCoords = await convertValueToCoords(state, options);
|
|
2330
|
-
|
|
2331
|
-
// If the placement is the same and the arrow caused an alignment offset
|
|
2332
|
-
// then we don't need to change the positioning coordinates.
|
|
2333
|
-
if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? undefined : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
2334
|
-
return {};
|
|
2335
|
-
}
|
|
2336
|
-
return {
|
|
2337
|
-
x: x + diffCoords.x,
|
|
2338
|
-
y: y + diffCoords.y,
|
|
2339
|
-
data: {
|
|
2340
|
-
...diffCoords,
|
|
2341
|
-
placement
|
|
2342
|
-
}
|
|
2343
|
-
};
|
|
2344
|
-
}
|
|
2345
|
-
};
|
|
2346
|
-
};
|
|
2347
|
-
|
|
2348
|
-
function hasWindow() {
|
|
2349
|
-
return typeof window !== 'undefined';
|
|
2350
|
-
}
|
|
2351
|
-
function getNodeName(node) {
|
|
2352
|
-
if (isNode(node)) {
|
|
2353
|
-
return (node.nodeName || '').toLowerCase();
|
|
2354
|
-
}
|
|
2355
|
-
// Mocked nodes in testing environments may not be instances of Node. By
|
|
2356
|
-
// returning `#document` an infinite loop won't occur.
|
|
2357
|
-
// https://github.com/floating-ui/floating-ui/issues/2317
|
|
2358
|
-
return '#document';
|
|
2359
|
-
}
|
|
2360
|
-
function getWindow(node) {
|
|
2361
|
-
var _node$ownerDocument;
|
|
2362
|
-
return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? undefined : _node$ownerDocument.defaultView) || window;
|
|
2363
|
-
}
|
|
2364
|
-
function getDocumentElement(node) {
|
|
2365
|
-
var _ref;
|
|
2366
|
-
return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? undefined : _ref.documentElement;
|
|
2367
|
-
}
|
|
2368
|
-
function isNode(value) {
|
|
2369
|
-
if (!hasWindow()) {
|
|
2370
|
-
return false;
|
|
2371
|
-
}
|
|
2372
|
-
return value instanceof Node || value instanceof getWindow(value).Node;
|
|
2373
|
-
}
|
|
2374
|
-
function isElement(value) {
|
|
2375
|
-
if (!hasWindow()) {
|
|
2376
|
-
return false;
|
|
2377
|
-
}
|
|
2378
|
-
return value instanceof Element || value instanceof getWindow(value).Element;
|
|
2379
|
-
}
|
|
2380
|
-
function isHTMLElement(value) {
|
|
2381
|
-
if (!hasWindow()) {
|
|
2382
|
-
return false;
|
|
2383
|
-
}
|
|
2384
|
-
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
|
|
2385
|
-
}
|
|
2386
|
-
function isShadowRoot(value) {
|
|
2387
|
-
if (!hasWindow() || typeof ShadowRoot === 'undefined') {
|
|
2388
|
-
return false;
|
|
2389
|
-
}
|
|
2390
|
-
return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
|
|
2391
|
-
}
|
|
2392
|
-
function isOverflowElement(element) {
|
|
2393
|
-
const {
|
|
2394
|
-
overflow,
|
|
2395
|
-
overflowX,
|
|
2396
|
-
overflowY,
|
|
2397
|
-
display
|
|
2398
|
-
} = getComputedStyle$1(element);
|
|
2399
|
-
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
|
|
2400
|
-
}
|
|
2401
|
-
function isTableElement(element) {
|
|
2402
|
-
return ['table', 'td', 'th'].includes(getNodeName(element));
|
|
2403
|
-
}
|
|
2404
|
-
function isTopLayer(element) {
|
|
2405
|
-
return [':popover-open', ':modal'].some(selector => {
|
|
2406
|
-
try {
|
|
2407
|
-
return element.matches(selector);
|
|
2408
|
-
} catch (e) {
|
|
2409
|
-
return false;
|
|
2410
|
-
}
|
|
2411
|
-
});
|
|
2412
|
-
}
|
|
2413
|
-
function isContainingBlock(elementOrCss) {
|
|
2414
|
-
const webkit = isWebKit();
|
|
2415
|
-
const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
|
|
2416
|
-
|
|
2417
|
-
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
2418
|
-
return css.transform !== 'none' || css.perspective !== 'none' || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
|
|
2419
|
-
}
|
|
2420
|
-
function getContainingBlock(element) {
|
|
2421
|
-
let currentNode = getParentNode(element);
|
|
2422
|
-
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
2423
|
-
if (isContainingBlock(currentNode)) {
|
|
2424
|
-
return currentNode;
|
|
2425
|
-
} else if (isTopLayer(currentNode)) {
|
|
2426
|
-
return null;
|
|
2427
|
-
}
|
|
2428
|
-
currentNode = getParentNode(currentNode);
|
|
2429
|
-
}
|
|
2430
|
-
return null;
|
|
2431
|
-
}
|
|
2432
|
-
function isWebKit() {
|
|
2433
|
-
if (typeof CSS === 'undefined' || !CSS.supports) return false;
|
|
2434
|
-
return CSS.supports('-webkit-backdrop-filter', 'none');
|
|
2435
|
-
}
|
|
2436
|
-
function isLastTraversableNode(node) {
|
|
2437
|
-
return ['html', 'body', '#document'].includes(getNodeName(node));
|
|
2438
|
-
}
|
|
2439
|
-
function getComputedStyle$1(element) {
|
|
2440
|
-
return getWindow(element).getComputedStyle(element);
|
|
2441
|
-
}
|
|
2442
|
-
function getNodeScroll(element) {
|
|
2443
|
-
if (isElement(element)) {
|
|
2444
|
-
return {
|
|
2445
|
-
scrollLeft: element.scrollLeft,
|
|
2446
|
-
scrollTop: element.scrollTop
|
|
2447
|
-
};
|
|
2448
|
-
}
|
|
2449
|
-
return {
|
|
2450
|
-
scrollLeft: element.scrollX,
|
|
2451
|
-
scrollTop: element.scrollY
|
|
2452
|
-
};
|
|
2453
|
-
}
|
|
2454
|
-
function getParentNode(node) {
|
|
2455
|
-
if (getNodeName(node) === 'html') {
|
|
2456
|
-
return node;
|
|
2457
|
-
}
|
|
2458
|
-
const result =
|
|
2459
|
-
// Step into the shadow DOM of the parent of a slotted node.
|
|
2460
|
-
node.assignedSlot ||
|
|
2461
|
-
// DOM Element detected.
|
|
2462
|
-
node.parentNode ||
|
|
2463
|
-
// ShadowRoot detected.
|
|
2464
|
-
isShadowRoot(node) && node.host ||
|
|
2465
|
-
// Fallback.
|
|
2466
|
-
getDocumentElement(node);
|
|
2467
|
-
return isShadowRoot(result) ? result.host : result;
|
|
2468
|
-
}
|
|
2469
|
-
function getNearestOverflowAncestor(node) {
|
|
2470
|
-
const parentNode = getParentNode(node);
|
|
2471
|
-
if (isLastTraversableNode(parentNode)) {
|
|
2472
|
-
return node.ownerDocument ? node.ownerDocument.body : node.body;
|
|
2473
|
-
}
|
|
2474
|
-
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
|
|
2475
|
-
return parentNode;
|
|
2476
|
-
}
|
|
2477
|
-
return getNearestOverflowAncestor(parentNode);
|
|
2478
|
-
}
|
|
2479
|
-
function getOverflowAncestors(node, list, traverseIframes) {
|
|
2480
|
-
var _node$ownerDocument2;
|
|
2481
|
-
if (list === undefined) {
|
|
2482
|
-
list = [];
|
|
2483
|
-
}
|
|
2484
|
-
if (traverseIframes === undefined) {
|
|
2485
|
-
traverseIframes = true;
|
|
2486
|
-
}
|
|
2487
|
-
const scrollableAncestor = getNearestOverflowAncestor(node);
|
|
2488
|
-
const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? undefined : _node$ownerDocument2.body);
|
|
2489
|
-
const win = getWindow(scrollableAncestor);
|
|
2490
|
-
if (isBody) {
|
|
2491
|
-
const frameElement = getFrameElement(win);
|
|
2492
|
-
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
|
|
2493
|
-
}
|
|
2494
|
-
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
|
|
2495
|
-
}
|
|
2496
|
-
function getFrameElement(win) {
|
|
2497
|
-
return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
|
|
2498
|
-
}
|
|
2499
|
-
|
|
2500
|
-
function getCssDimensions(element) {
|
|
2501
|
-
const css = getComputedStyle$1(element);
|
|
2502
|
-
// In testing environments, the `width` and `height` properties are empty
|
|
2503
|
-
// strings for SVG elements, returning NaN. Fallback to `0` in this case.
|
|
2504
|
-
let width = parseFloat(css.width) || 0;
|
|
2505
|
-
let height = parseFloat(css.height) || 0;
|
|
2506
|
-
const hasOffset = isHTMLElement(element);
|
|
2507
|
-
const offsetWidth = hasOffset ? element.offsetWidth : width;
|
|
2508
|
-
const offsetHeight = hasOffset ? element.offsetHeight : height;
|
|
2509
|
-
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
|
|
2510
|
-
if (shouldFallback) {
|
|
2511
|
-
width = offsetWidth;
|
|
2512
|
-
height = offsetHeight;
|
|
2513
|
-
}
|
|
2514
|
-
return {
|
|
2515
|
-
width,
|
|
2516
|
-
height,
|
|
2517
|
-
$: shouldFallback
|
|
2518
|
-
};
|
|
2519
|
-
}
|
|
2520
|
-
|
|
2521
|
-
function unwrapElement(element) {
|
|
2522
|
-
return !isElement(element) ? element.contextElement : element;
|
|
2523
|
-
}
|
|
2524
|
-
|
|
2525
|
-
function getScale(element) {
|
|
2526
|
-
const domElement = unwrapElement(element);
|
|
2527
|
-
if (!isHTMLElement(domElement)) {
|
|
2528
|
-
return createCoords(1);
|
|
2529
|
-
}
|
|
2530
|
-
const rect = domElement.getBoundingClientRect();
|
|
2531
|
-
const {
|
|
2532
|
-
width,
|
|
2533
|
-
height,
|
|
2534
|
-
$
|
|
2535
|
-
} = getCssDimensions(domElement);
|
|
2536
|
-
let x = ($ ? round(rect.width) : rect.width) / width;
|
|
2537
|
-
let y = ($ ? round(rect.height) : rect.height) / height;
|
|
2538
|
-
|
|
2539
|
-
// 0, NaN, or Infinity should always fallback to 1.
|
|
2540
|
-
|
|
2541
|
-
if (!x || !Number.isFinite(x)) {
|
|
2542
|
-
x = 1;
|
|
2543
|
-
}
|
|
2544
|
-
if (!y || !Number.isFinite(y)) {
|
|
2545
|
-
y = 1;
|
|
2546
|
-
}
|
|
2547
|
-
return {
|
|
2548
|
-
x,
|
|
2549
|
-
y
|
|
2550
|
-
};
|
|
2551
|
-
}
|
|
2552
|
-
|
|
2553
|
-
const noOffsets = /*#__PURE__*/createCoords(0);
|
|
2554
|
-
function getVisualOffsets(element) {
|
|
2555
|
-
const win = getWindow(element);
|
|
2556
|
-
if (!isWebKit() || !win.visualViewport) {
|
|
2557
|
-
return noOffsets;
|
|
2558
|
-
}
|
|
2559
|
-
return {
|
|
2560
|
-
x: win.visualViewport.offsetLeft,
|
|
2561
|
-
y: win.visualViewport.offsetTop
|
|
2562
|
-
};
|
|
2563
|
-
}
|
|
2564
|
-
function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
|
|
2565
|
-
if (isFixed === undefined) {
|
|
2566
|
-
isFixed = false;
|
|
2567
|
-
}
|
|
2568
|
-
if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
|
|
2569
|
-
return false;
|
|
2570
|
-
}
|
|
2571
|
-
return isFixed;
|
|
2572
|
-
}
|
|
2573
|
-
|
|
2574
|
-
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
|
|
2575
|
-
if (includeScale === undefined) {
|
|
2576
|
-
includeScale = false;
|
|
2577
|
-
}
|
|
2578
|
-
if (isFixedStrategy === undefined) {
|
|
2579
|
-
isFixedStrategy = false;
|
|
2580
|
-
}
|
|
2581
|
-
const clientRect = element.getBoundingClientRect();
|
|
2582
|
-
const domElement = unwrapElement(element);
|
|
2583
|
-
let scale = createCoords(1);
|
|
2584
|
-
if (includeScale) {
|
|
2585
|
-
if (offsetParent) {
|
|
2586
|
-
if (isElement(offsetParent)) {
|
|
2587
|
-
scale = getScale(offsetParent);
|
|
2588
|
-
}
|
|
2589
|
-
} else {
|
|
2590
|
-
scale = getScale(element);
|
|
2591
|
-
}
|
|
2592
|
-
}
|
|
2593
|
-
const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
|
|
2594
|
-
let x = (clientRect.left + visualOffsets.x) / scale.x;
|
|
2595
|
-
let y = (clientRect.top + visualOffsets.y) / scale.y;
|
|
2596
|
-
let width = clientRect.width / scale.x;
|
|
2597
|
-
let height = clientRect.height / scale.y;
|
|
2598
|
-
if (domElement) {
|
|
2599
|
-
const win = getWindow(domElement);
|
|
2600
|
-
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
2601
|
-
let currentWin = win;
|
|
2602
|
-
let currentIFrame = getFrameElement(currentWin);
|
|
2603
|
-
while (currentIFrame && offsetParent && offsetWin !== currentWin) {
|
|
2604
|
-
const iframeScale = getScale(currentIFrame);
|
|
2605
|
-
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
2606
|
-
const css = getComputedStyle$1(currentIFrame);
|
|
2607
|
-
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
|
2608
|
-
const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
|
2609
|
-
x *= iframeScale.x;
|
|
2610
|
-
y *= iframeScale.y;
|
|
2611
|
-
width *= iframeScale.x;
|
|
2612
|
-
height *= iframeScale.y;
|
|
2613
|
-
x += left;
|
|
2614
|
-
y += top;
|
|
2615
|
-
currentWin = getWindow(currentIFrame);
|
|
2616
|
-
currentIFrame = getFrameElement(currentWin);
|
|
2617
|
-
}
|
|
2618
|
-
}
|
|
2619
|
-
return rectToClientRect({
|
|
2620
|
-
width,
|
|
2621
|
-
height,
|
|
2622
|
-
x,
|
|
2623
|
-
y
|
|
2624
|
-
});
|
|
2625
|
-
}
|
|
2626
|
-
|
|
2627
|
-
// If <html> has a CSS width greater than the viewport, then this will be
|
|
2628
|
-
// incorrect for RTL.
|
|
2629
|
-
function getWindowScrollBarX(element, rect) {
|
|
2630
|
-
const leftScroll = getNodeScroll(element).scrollLeft;
|
|
2631
|
-
if (!rect) {
|
|
2632
|
-
return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
|
|
2633
|
-
}
|
|
2634
|
-
return rect.left + leftScroll;
|
|
2635
|
-
}
|
|
2636
|
-
|
|
2637
|
-
function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
|
|
2638
|
-
if (ignoreScrollbarX === undefined) {
|
|
2639
|
-
ignoreScrollbarX = false;
|
|
2640
|
-
}
|
|
2641
|
-
const htmlRect = documentElement.getBoundingClientRect();
|
|
2642
|
-
const x = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 :
|
|
2643
|
-
// RTL <body> scrollbar.
|
|
2644
|
-
getWindowScrollBarX(documentElement, htmlRect));
|
|
2645
|
-
const y = htmlRect.top + scroll.scrollTop;
|
|
2646
|
-
return {
|
|
2647
|
-
x,
|
|
2648
|
-
y
|
|
2649
|
-
};
|
|
2650
|
-
}
|
|
2651
|
-
|
|
2652
|
-
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
2653
|
-
let {
|
|
2654
|
-
elements,
|
|
2655
|
-
rect,
|
|
2656
|
-
offsetParent,
|
|
2657
|
-
strategy
|
|
2658
|
-
} = _ref;
|
|
2659
|
-
const isFixed = strategy === 'fixed';
|
|
2660
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
2661
|
-
const topLayer = elements ? isTopLayer(elements.floating) : false;
|
|
2662
|
-
if (offsetParent === documentElement || topLayer && isFixed) {
|
|
2663
|
-
return rect;
|
|
2664
|
-
}
|
|
2665
|
-
let scroll = {
|
|
2666
|
-
scrollLeft: 0,
|
|
2667
|
-
scrollTop: 0
|
|
2668
|
-
};
|
|
2669
|
-
let scale = createCoords(1);
|
|
2670
|
-
const offsets = createCoords(0);
|
|
2671
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2672
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
2673
|
-
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
2674
|
-
scroll = getNodeScroll(offsetParent);
|
|
2675
|
-
}
|
|
2676
|
-
if (isHTMLElement(offsetParent)) {
|
|
2677
|
-
const offsetRect = getBoundingClientRect(offsetParent);
|
|
2678
|
-
scale = getScale(offsetParent);
|
|
2679
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
2680
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
2681
|
-
}
|
|
2682
|
-
}
|
|
2683
|
-
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, true) : createCoords(0);
|
|
2684
|
-
return {
|
|
2685
|
-
width: rect.width * scale.x,
|
|
2686
|
-
height: rect.height * scale.y,
|
|
2687
|
-
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
|
|
2688
|
-
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
|
|
2689
|
-
};
|
|
2690
|
-
}
|
|
2691
|
-
|
|
2692
|
-
function getClientRects(element) {
|
|
2693
|
-
return Array.from(element.getClientRects());
|
|
2694
|
-
}
|
|
2695
|
-
|
|
2696
|
-
// Gets the entire size of the scrollable document area, even extending outside
|
|
2697
|
-
// of the `<html>` and `<body>` rect bounds if horizontally scrollable.
|
|
2698
|
-
function getDocumentRect(element) {
|
|
2699
|
-
const html = getDocumentElement(element);
|
|
2700
|
-
const scroll = getNodeScroll(element);
|
|
2701
|
-
const body = element.ownerDocument.body;
|
|
2702
|
-
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
|
|
2703
|
-
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
|
|
2704
|
-
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
|
|
2705
|
-
const y = -scroll.scrollTop;
|
|
2706
|
-
if (getComputedStyle$1(body).direction === 'rtl') {
|
|
2707
|
-
x += max(html.clientWidth, body.clientWidth) - width;
|
|
2708
|
-
}
|
|
2709
|
-
return {
|
|
2710
|
-
width,
|
|
2711
|
-
height,
|
|
2712
|
-
x,
|
|
2713
|
-
y
|
|
2714
|
-
};
|
|
2715
|
-
}
|
|
2716
|
-
|
|
2717
|
-
function getViewportRect(element, strategy) {
|
|
2718
|
-
const win = getWindow(element);
|
|
2719
|
-
const html = getDocumentElement(element);
|
|
2720
|
-
const visualViewport = win.visualViewport;
|
|
2721
|
-
let width = html.clientWidth;
|
|
2722
|
-
let height = html.clientHeight;
|
|
2723
|
-
let x = 0;
|
|
2724
|
-
let y = 0;
|
|
2725
|
-
if (visualViewport) {
|
|
2726
|
-
width = visualViewport.width;
|
|
2727
|
-
height = visualViewport.height;
|
|
2728
|
-
const visualViewportBased = isWebKit();
|
|
2729
|
-
if (!visualViewportBased || visualViewportBased && strategy === 'fixed') {
|
|
2730
|
-
x = visualViewport.offsetLeft;
|
|
2731
|
-
y = visualViewport.offsetTop;
|
|
2732
|
-
}
|
|
2733
|
-
}
|
|
2734
|
-
return {
|
|
2735
|
-
width,
|
|
2736
|
-
height,
|
|
2737
|
-
x,
|
|
2738
|
-
y
|
|
2739
|
-
};
|
|
2740
|
-
}
|
|
2741
|
-
|
|
2742
|
-
// Returns the inner client rect, subtracting scrollbars if present.
|
|
2743
|
-
function getInnerBoundingClientRect(element, strategy) {
|
|
2744
|
-
const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
|
|
2745
|
-
const top = clientRect.top + element.clientTop;
|
|
2746
|
-
const left = clientRect.left + element.clientLeft;
|
|
2747
|
-
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
|
|
2748
|
-
const width = element.clientWidth * scale.x;
|
|
2749
|
-
const height = element.clientHeight * scale.y;
|
|
2750
|
-
const x = left * scale.x;
|
|
2751
|
-
const y = top * scale.y;
|
|
2752
|
-
return {
|
|
2753
|
-
width,
|
|
2754
|
-
height,
|
|
2755
|
-
x,
|
|
2756
|
-
y
|
|
2757
|
-
};
|
|
2758
|
-
}
|
|
2759
|
-
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
|
|
2760
|
-
let rect;
|
|
2761
|
-
if (clippingAncestor === 'viewport') {
|
|
2762
|
-
rect = getViewportRect(element, strategy);
|
|
2763
|
-
} else if (clippingAncestor === 'document') {
|
|
2764
|
-
rect = getDocumentRect(getDocumentElement(element));
|
|
2765
|
-
} else if (isElement(clippingAncestor)) {
|
|
2766
|
-
rect = getInnerBoundingClientRect(clippingAncestor, strategy);
|
|
2767
|
-
} else {
|
|
2768
|
-
const visualOffsets = getVisualOffsets(element);
|
|
2769
|
-
rect = {
|
|
2770
|
-
x: clippingAncestor.x - visualOffsets.x,
|
|
2771
|
-
y: clippingAncestor.y - visualOffsets.y,
|
|
2772
|
-
width: clippingAncestor.width,
|
|
2773
|
-
height: clippingAncestor.height
|
|
2774
|
-
};
|
|
2775
|
-
}
|
|
2776
|
-
return rectToClientRect(rect);
|
|
2777
|
-
}
|
|
2778
|
-
function hasFixedPositionAncestor(element, stopNode) {
|
|
2779
|
-
const parentNode = getParentNode(element);
|
|
2780
|
-
if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
|
|
2781
|
-
return false;
|
|
2782
|
-
}
|
|
2783
|
-
return getComputedStyle$1(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
|
|
2784
|
-
}
|
|
2785
|
-
|
|
2786
|
-
// A "clipping ancestor" is an `overflow` element with the characteristic of
|
|
2787
|
-
// clipping (or hiding) child elements. This returns all clipping ancestors
|
|
2788
|
-
// of the given element up the tree.
|
|
2789
|
-
function getClippingElementAncestors(element, cache) {
|
|
2790
|
-
const cachedResult = cache.get(element);
|
|
2791
|
-
if (cachedResult) {
|
|
2792
|
-
return cachedResult;
|
|
2793
|
-
}
|
|
2794
|
-
let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
|
|
2795
|
-
let currentContainingBlockComputedStyle = null;
|
|
2796
|
-
const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
|
|
2797
|
-
let currentNode = elementIsFixed ? getParentNode(element) : element;
|
|
2798
|
-
|
|
2799
|
-
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
2800
|
-
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
2801
|
-
const computedStyle = getComputedStyle$1(currentNode);
|
|
2802
|
-
const currentNodeIsContaining = isContainingBlock(currentNode);
|
|
2803
|
-
if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
|
|
2804
|
-
currentContainingBlockComputedStyle = null;
|
|
2805
|
-
}
|
|
2806
|
-
const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
|
|
2807
|
-
if (shouldDropCurrentNode) {
|
|
2808
|
-
// Drop non-containing blocks.
|
|
2809
|
-
result = result.filter(ancestor => ancestor !== currentNode);
|
|
2810
|
-
} else {
|
|
2811
|
-
// Record last containing block for next iteration.
|
|
2812
|
-
currentContainingBlockComputedStyle = computedStyle;
|
|
2813
|
-
}
|
|
2814
|
-
currentNode = getParentNode(currentNode);
|
|
2815
|
-
}
|
|
2816
|
-
cache.set(element, result);
|
|
2817
|
-
return result;
|
|
2818
|
-
}
|
|
2819
|
-
|
|
2820
|
-
// Gets the maximum area that the element is visible in due to any number of
|
|
2821
|
-
// clipping ancestors.
|
|
2822
|
-
function getClippingRect(_ref) {
|
|
2823
|
-
let {
|
|
2824
|
-
element,
|
|
2825
|
-
boundary,
|
|
2826
|
-
rootBoundary,
|
|
2827
|
-
strategy
|
|
2828
|
-
} = _ref;
|
|
2829
|
-
const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
|
|
2830
|
-
const clippingAncestors = [...elementClippingAncestors, rootBoundary];
|
|
2831
|
-
const firstClippingAncestor = clippingAncestors[0];
|
|
2832
|
-
const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
|
|
2833
|
-
const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
|
|
2834
|
-
accRect.top = max(rect.top, accRect.top);
|
|
2835
|
-
accRect.right = min(rect.right, accRect.right);
|
|
2836
|
-
accRect.bottom = min(rect.bottom, accRect.bottom);
|
|
2837
|
-
accRect.left = max(rect.left, accRect.left);
|
|
2838
|
-
return accRect;
|
|
2839
|
-
}, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
|
|
2840
|
-
return {
|
|
2841
|
-
width: clippingRect.right - clippingRect.left,
|
|
2842
|
-
height: clippingRect.bottom - clippingRect.top,
|
|
2843
|
-
x: clippingRect.left,
|
|
2844
|
-
y: clippingRect.top
|
|
2845
|
-
};
|
|
2846
|
-
}
|
|
2847
|
-
|
|
2848
|
-
function getDimensions(element) {
|
|
2849
|
-
const {
|
|
2850
|
-
width,
|
|
2851
|
-
height
|
|
2852
|
-
} = getCssDimensions(element);
|
|
2853
|
-
return {
|
|
2854
|
-
width,
|
|
2855
|
-
height
|
|
2856
|
-
};
|
|
2857
|
-
}
|
|
2858
|
-
|
|
2859
|
-
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
2860
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2861
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
2862
|
-
const isFixed = strategy === 'fixed';
|
|
2863
|
-
const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
|
|
2864
|
-
let scroll = {
|
|
2865
|
-
scrollLeft: 0,
|
|
2866
|
-
scrollTop: 0
|
|
2867
|
-
};
|
|
2868
|
-
const offsets = createCoords(0);
|
|
2869
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
2870
|
-
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
2871
|
-
scroll = getNodeScroll(offsetParent);
|
|
2872
|
-
}
|
|
2873
|
-
if (isOffsetParentAnElement) {
|
|
2874
|
-
const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
|
|
2875
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
2876
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
2877
|
-
} else if (documentElement) {
|
|
2878
|
-
// If the <body> scrollbar appears on the left (e.g. RTL systems). Use
|
|
2879
|
-
// Firefox with layout.scrollbar.side = 3 in about:config to test this.
|
|
2880
|
-
offsets.x = getWindowScrollBarX(documentElement);
|
|
2881
|
-
}
|
|
2882
|
-
}
|
|
2883
|
-
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
2884
|
-
const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
|
|
2885
|
-
const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
|
|
2886
|
-
return {
|
|
2887
|
-
x,
|
|
2888
|
-
y,
|
|
2889
|
-
width: rect.width,
|
|
2890
|
-
height: rect.height
|
|
2891
|
-
};
|
|
2892
|
-
}
|
|
2893
|
-
|
|
2894
|
-
function isStaticPositioned(element) {
|
|
2895
|
-
return getComputedStyle$1(element).position === 'static';
|
|
2896
|
-
}
|
|
2897
|
-
|
|
2898
|
-
function getTrueOffsetParent(element, polyfill) {
|
|
2899
|
-
if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
|
|
2900
|
-
return null;
|
|
2901
|
-
}
|
|
2902
|
-
if (polyfill) {
|
|
2903
|
-
return polyfill(element);
|
|
2904
|
-
}
|
|
2905
|
-
let rawOffsetParent = element.offsetParent;
|
|
2906
|
-
|
|
2907
|
-
// Firefox returns the <html> element as the offsetParent if it's non-static,
|
|
2908
|
-
// while Chrome and Safari return the <body> element. The <body> element must
|
|
2909
|
-
// be used to perform the correct calculations even if the <html> element is
|
|
2910
|
-
// non-static.
|
|
2911
|
-
if (getDocumentElement(element) === rawOffsetParent) {
|
|
2912
|
-
rawOffsetParent = rawOffsetParent.ownerDocument.body;
|
|
2913
|
-
}
|
|
2914
|
-
return rawOffsetParent;
|
|
2915
|
-
}
|
|
2916
|
-
|
|
2917
|
-
// Gets the closest ancestor positioned element. Handles some edge cases,
|
|
2918
|
-
// such as table ancestors and cross browser bugs.
|
|
2919
|
-
function getOffsetParent(element, polyfill) {
|
|
2920
|
-
const win = getWindow(element);
|
|
2921
|
-
if (isTopLayer(element)) {
|
|
2922
|
-
return win;
|
|
2923
|
-
}
|
|
2924
|
-
if (!isHTMLElement(element)) {
|
|
2925
|
-
let svgOffsetParent = getParentNode(element);
|
|
2926
|
-
while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
|
|
2927
|
-
if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
|
|
2928
|
-
return svgOffsetParent;
|
|
2929
|
-
}
|
|
2930
|
-
svgOffsetParent = getParentNode(svgOffsetParent);
|
|
2931
|
-
}
|
|
2932
|
-
return win;
|
|
2933
|
-
}
|
|
2934
|
-
let offsetParent = getTrueOffsetParent(element, polyfill);
|
|
2935
|
-
while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
|
|
2936
|
-
offsetParent = getTrueOffsetParent(offsetParent, polyfill);
|
|
2937
|
-
}
|
|
2938
|
-
if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
|
|
2939
|
-
return win;
|
|
2940
|
-
}
|
|
2941
|
-
return offsetParent || getContainingBlock(element) || win;
|
|
2942
|
-
}
|
|
2943
|
-
|
|
2944
|
-
const getElementRects = async function (data) {
|
|
2945
|
-
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
2946
|
-
const getDimensionsFn = this.getDimensions;
|
|
2947
|
-
const floatingDimensions = await getDimensionsFn(data.floating);
|
|
2948
|
-
return {
|
|
2949
|
-
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
|
|
2950
|
-
floating: {
|
|
2951
|
-
x: 0,
|
|
2952
|
-
y: 0,
|
|
2953
|
-
width: floatingDimensions.width,
|
|
2954
|
-
height: floatingDimensions.height
|
|
2955
|
-
}
|
|
2956
|
-
};
|
|
2957
|
-
};
|
|
2958
|
-
|
|
2959
|
-
function isRTL(element) {
|
|
2960
|
-
return getComputedStyle$1(element).direction === 'rtl';
|
|
2961
|
-
}
|
|
2962
|
-
|
|
2963
|
-
const platform = {
|
|
2964
|
-
convertOffsetParentRelativeRectToViewportRelativeRect,
|
|
2965
|
-
getDocumentElement,
|
|
2966
|
-
getClippingRect,
|
|
2967
|
-
getOffsetParent,
|
|
2968
|
-
getElementRects,
|
|
2969
|
-
getClientRects,
|
|
2970
|
-
getDimensions,
|
|
2971
|
-
getScale,
|
|
2972
|
-
isElement,
|
|
2973
|
-
isRTL
|
|
2974
|
-
};
|
|
2975
|
-
|
|
2976
|
-
// https://samthor.au/2021/observing-dom/
|
|
2977
|
-
function observeMove(element, onMove) {
|
|
2978
|
-
let io = null;
|
|
2979
|
-
let timeoutId;
|
|
2980
|
-
const root = getDocumentElement(element);
|
|
2981
|
-
function cleanup() {
|
|
2982
|
-
var _io;
|
|
2983
|
-
clearTimeout(timeoutId);
|
|
2984
|
-
(_io = io) == null || _io.disconnect();
|
|
2985
|
-
io = null;
|
|
2986
|
-
}
|
|
2987
|
-
function refresh(skip, threshold) {
|
|
2988
|
-
if (skip === undefined) {
|
|
2989
|
-
skip = false;
|
|
2990
|
-
}
|
|
2991
|
-
if (threshold === undefined) {
|
|
2992
|
-
threshold = 1;
|
|
2993
|
-
}
|
|
2994
|
-
cleanup();
|
|
2995
|
-
const {
|
|
2996
|
-
left,
|
|
2997
|
-
top,
|
|
2998
|
-
width,
|
|
2999
|
-
height
|
|
3000
|
-
} = element.getBoundingClientRect();
|
|
3001
|
-
if (!skip) {
|
|
3002
|
-
onMove();
|
|
3003
|
-
}
|
|
3004
|
-
if (!width || !height) {
|
|
3005
|
-
return;
|
|
3006
|
-
}
|
|
3007
|
-
const insetTop = floor(top);
|
|
3008
|
-
const insetRight = floor(root.clientWidth - (left + width));
|
|
3009
|
-
const insetBottom = floor(root.clientHeight - (top + height));
|
|
3010
|
-
const insetLeft = floor(left);
|
|
3011
|
-
const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
|
|
3012
|
-
const options = {
|
|
3013
|
-
rootMargin,
|
|
3014
|
-
threshold: max(0, min(1, threshold)) || 1
|
|
3015
|
-
};
|
|
3016
|
-
let isFirstUpdate = true;
|
|
3017
|
-
function handleObserve(entries) {
|
|
3018
|
-
const ratio = entries[0].intersectionRatio;
|
|
3019
|
-
if (ratio !== threshold) {
|
|
3020
|
-
if (!isFirstUpdate) {
|
|
3021
|
-
return refresh();
|
|
3022
|
-
}
|
|
3023
|
-
if (!ratio) {
|
|
3024
|
-
// If the reference is clipped, the ratio is 0. Throttle the refresh
|
|
3025
|
-
// to prevent an infinite loop of updates.
|
|
3026
|
-
timeoutId = setTimeout(() => {
|
|
3027
|
-
refresh(false, 1e-7);
|
|
3028
|
-
}, 1000);
|
|
3029
|
-
} else {
|
|
3030
|
-
refresh(false, ratio);
|
|
3031
|
-
}
|
|
3032
|
-
}
|
|
3033
|
-
isFirstUpdate = false;
|
|
3034
|
-
}
|
|
3035
|
-
|
|
3036
|
-
// Older browsers don't support a `document` as the root and will throw an
|
|
3037
|
-
// error.
|
|
3038
|
-
try {
|
|
3039
|
-
io = new IntersectionObserver(handleObserve, {
|
|
3040
|
-
...options,
|
|
3041
|
-
// Handle <iframe>s
|
|
3042
|
-
root: root.ownerDocument
|
|
3043
|
-
});
|
|
3044
|
-
} catch (e) {
|
|
3045
|
-
io = new IntersectionObserver(handleObserve, options);
|
|
3046
|
-
}
|
|
3047
|
-
io.observe(element);
|
|
3048
|
-
}
|
|
3049
|
-
refresh(true);
|
|
3050
|
-
return cleanup;
|
|
3051
|
-
}
|
|
3052
|
-
|
|
3053
|
-
/**
|
|
3054
|
-
* Automatically updates the position of the floating element when necessary.
|
|
3055
|
-
* Should only be called when the floating element is mounted on the DOM or
|
|
3056
|
-
* visible on the screen.
|
|
3057
|
-
* @returns cleanup function that should be invoked when the floating element is
|
|
3058
|
-
* removed from the DOM or hidden from the screen.
|
|
3059
|
-
* @see https://floating-ui.com/docs/autoUpdate
|
|
3060
|
-
*/
|
|
3061
|
-
function autoUpdate(reference, floating, update, options) {
|
|
3062
|
-
if (options === undefined) {
|
|
3063
|
-
options = {};
|
|
3064
|
-
}
|
|
3065
|
-
const {
|
|
3066
|
-
ancestorScroll = true,
|
|
3067
|
-
ancestorResize = true,
|
|
3068
|
-
elementResize = typeof ResizeObserver === 'function',
|
|
3069
|
-
layoutShift = typeof IntersectionObserver === 'function',
|
|
3070
|
-
animationFrame = false
|
|
3071
|
-
} = options;
|
|
3072
|
-
const referenceEl = unwrapElement(reference);
|
|
3073
|
-
const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...getOverflowAncestors(floating)] : [];
|
|
3074
|
-
ancestors.forEach(ancestor => {
|
|
3075
|
-
ancestorScroll && ancestor.addEventListener('scroll', update, {
|
|
3076
|
-
passive: true
|
|
3077
|
-
});
|
|
3078
|
-
ancestorResize && ancestor.addEventListener('resize', update);
|
|
3079
|
-
});
|
|
3080
|
-
const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
|
|
3081
|
-
let reobserveFrame = -1;
|
|
3082
|
-
let resizeObserver = null;
|
|
3083
|
-
if (elementResize) {
|
|
3084
|
-
resizeObserver = new ResizeObserver(_ref => {
|
|
3085
|
-
let [firstEntry] = _ref;
|
|
3086
|
-
if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
|
|
3087
|
-
// Prevent update loops when using the `size` middleware.
|
|
3088
|
-
// https://github.com/floating-ui/floating-ui/issues/1740
|
|
3089
|
-
resizeObserver.unobserve(floating);
|
|
3090
|
-
cancelAnimationFrame(reobserveFrame);
|
|
3091
|
-
reobserveFrame = requestAnimationFrame(() => {
|
|
3092
|
-
var _resizeObserver;
|
|
3093
|
-
(_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
|
|
3094
|
-
});
|
|
3095
|
-
}
|
|
3096
|
-
update();
|
|
3097
|
-
});
|
|
3098
|
-
if (referenceEl && !animationFrame) {
|
|
3099
|
-
resizeObserver.observe(referenceEl);
|
|
3100
|
-
}
|
|
3101
|
-
resizeObserver.observe(floating);
|
|
3102
|
-
}
|
|
3103
|
-
let frameId;
|
|
3104
|
-
let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
|
|
3105
|
-
if (animationFrame) {
|
|
3106
|
-
frameLoop();
|
|
3107
|
-
}
|
|
3108
|
-
function frameLoop() {
|
|
3109
|
-
const nextRefRect = getBoundingClientRect(reference);
|
|
3110
|
-
if (prevRefRect && (nextRefRect.x !== prevRefRect.x || nextRefRect.y !== prevRefRect.y || nextRefRect.width !== prevRefRect.width || nextRefRect.height !== prevRefRect.height)) {
|
|
3111
|
-
update();
|
|
3112
|
-
}
|
|
3113
|
-
prevRefRect = nextRefRect;
|
|
3114
|
-
frameId = requestAnimationFrame(frameLoop);
|
|
3115
|
-
}
|
|
3116
|
-
update();
|
|
3117
|
-
return () => {
|
|
3118
|
-
var _resizeObserver2;
|
|
3119
|
-
ancestors.forEach(ancestor => {
|
|
3120
|
-
ancestorScroll && ancestor.removeEventListener('scroll', update);
|
|
3121
|
-
ancestorResize && ancestor.removeEventListener('resize', update);
|
|
3122
|
-
});
|
|
3123
|
-
cleanupIo == null || cleanupIo();
|
|
3124
|
-
(_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
|
|
3125
|
-
resizeObserver = null;
|
|
3126
|
-
if (animationFrame) {
|
|
3127
|
-
cancelAnimationFrame(frameId);
|
|
3128
|
-
}
|
|
3129
|
-
};
|
|
3130
|
-
}
|
|
3131
|
-
|
|
3132
|
-
/**
|
|
3133
|
-
* Modifies the placement by translating the floating element along the
|
|
3134
|
-
* specified axes.
|
|
3135
|
-
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
3136
|
-
* object may be passed.
|
|
3137
|
-
* @see https://floating-ui.com/docs/offset
|
|
3138
|
-
*/
|
|
3139
|
-
const offset = offset$1;
|
|
3140
|
-
|
|
3141
|
-
/**
|
|
3142
|
-
* Optimizes the visibility of the floating element by choosing the placement
|
|
3143
|
-
* that has the most space available automatically, without needing to specify a
|
|
3144
|
-
* preferred placement. Alternative to `flip`.
|
|
3145
|
-
* @see https://floating-ui.com/docs/autoPlacement
|
|
3146
|
-
*/
|
|
3147
|
-
const autoPlacement = autoPlacement$1;
|
|
3148
|
-
|
|
3149
|
-
/**
|
|
3150
|
-
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
3151
|
-
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
3152
|
-
* clipping boundary. Alternative to `autoPlacement`.
|
|
3153
|
-
* @see https://floating-ui.com/docs/flip
|
|
3154
|
-
*/
|
|
3155
|
-
const flip = flip$1;
|
|
3156
|
-
|
|
3157
|
-
/**
|
|
3158
|
-
* Computes the `x` and `y` coordinates that will place the floating element
|
|
3159
|
-
* next to a given reference element.
|
|
3160
|
-
*/
|
|
3161
|
-
const computePosition = (reference, floating, options) => {
|
|
3162
|
-
// This caches the expensive `getClippingElementAncestors` function so that
|
|
3163
|
-
// multiple lifecycle resets re-use the same result. It only lives for a
|
|
3164
|
-
// single call. If other functions become expensive, we can add them as well.
|
|
3165
|
-
const cache = new Map();
|
|
3166
|
-
const mergedOptions = {
|
|
3167
|
-
platform,
|
|
3168
|
-
...options
|
|
3169
|
-
};
|
|
3170
|
-
const platformWithCache = {
|
|
3171
|
-
...mergedOptions.platform,
|
|
3172
|
-
_c: cache
|
|
3173
|
-
};
|
|
3174
|
-
return computePosition$1(reference, floating, {
|
|
3175
|
-
...mergedOptions,
|
|
3176
|
-
platform: platformWithCache
|
|
3177
|
-
});
|
|
3178
|
-
};
|
|
3179
|
-
|
|
3180
|
-
/* eslint-disable line-comment-position, no-inline-comments */
|
|
3181
|
-
|
|
3182
|
-
|
|
3183
|
-
class AuroFloatingUI {
|
|
3184
|
-
constructor() {
|
|
3185
|
-
// Store event listener references for cleanup
|
|
3186
|
-
this.focusHandler = null;
|
|
3187
|
-
this.clickHandler = null;
|
|
3188
|
-
this.keyDownHandler = null;
|
|
3189
|
-
|
|
3190
|
-
/**
|
|
3191
|
-
* @private
|
|
3192
|
-
*/
|
|
3193
|
-
this.eventPrefix = undefined;
|
|
3194
|
-
}
|
|
3195
|
-
|
|
3196
|
-
/**
|
|
3197
|
-
* @private
|
|
3198
|
-
* Adjusts the size of the bib content based on the bibSizer dimensions.
|
|
3199
|
-
*
|
|
3200
|
-
* This method retrieves the computed styles of the bibSizer element and applies them to the bib content.
|
|
3201
|
-
* If the fullscreen parameter is true, it resets the dimensions to their default values. Otherwise, it
|
|
3202
|
-
* mirrors the width and height from the bibSizer, ensuring that they are not set to zero.
|
|
3203
|
-
*
|
|
3204
|
-
* @param {boolean} fullscreen - A flag indicating whether to reset the dimensions for fullscreen mode.
|
|
3205
|
-
* If true, the bib content dimensions are cleared; if false, they are set
|
|
3206
|
-
* based on the bibSizer's computed styles.
|
|
3207
|
-
*/
|
|
3208
|
-
mirrorSize(fullscreen) {
|
|
3209
|
-
// mirror the boxsize from bibSizer
|
|
3210
|
-
if (this.element.bibSizer) {
|
|
3211
|
-
const sizerStyle = window.getComputedStyle(this.element.bibSizer);
|
|
3212
|
-
const bibContent = this.element.bib.shadowRoot.querySelector(".container");
|
|
3213
|
-
if (fullscreen) {
|
|
3214
|
-
bibContent.style.width = '';
|
|
3215
|
-
bibContent.style.height = '';
|
|
3216
|
-
bibContent.style.maxWidth = '';
|
|
3217
|
-
bibContent.style.maxHeight = '';
|
|
3218
|
-
} else {
|
|
3219
|
-
if (sizerStyle.width !== '0px') {
|
|
3220
|
-
bibContent.style.width = sizerStyle.width;
|
|
3221
|
-
}
|
|
3222
|
-
if (sizerStyle.height !== '0px') {
|
|
3223
|
-
bibContent.style.height = sizerStyle.height;
|
|
3224
|
-
}
|
|
3225
|
-
bibContent.style.maxWidth = sizerStyle.maxWidth;
|
|
3226
|
-
bibContent.style.maxHeight = sizerStyle.maxHeight;
|
|
3227
|
-
}
|
|
3228
|
-
}
|
|
3229
|
-
}
|
|
3230
|
-
|
|
3231
|
-
/**
|
|
3232
|
-
* @private
|
|
3233
|
-
* Determines the positioning strategy based on the current viewport size and mobile breakpoint.
|
|
3234
|
-
*
|
|
3235
|
-
* This method checks if the current viewport width is less than or equal to the specified mobile fullscreen breakpoint
|
|
3236
|
-
* defined in the bib element. If it is, the strategy is set to 'fullscreen'; otherwise, it defaults to 'floating'.
|
|
3237
|
-
*
|
|
3238
|
-
* @returns {String} The positioning strategy, either 'fullscreen' or 'floating'.
|
|
3239
|
-
*/
|
|
3240
|
-
getPositioningStrategy() {
|
|
3241
|
-
let strategy = 'floating';
|
|
3242
|
-
if (this.element.bib.mobileFullscreenBreakpoint) {
|
|
3243
|
-
const isMobile = window.matchMedia(`(max-width: ${this.element.bib.mobileFullscreenBreakpoint})`).matches;
|
|
3244
|
-
if (isMobile) {
|
|
3245
|
-
strategy = 'fullscreen';
|
|
3246
|
-
}
|
|
3247
|
-
}
|
|
3248
|
-
return strategy;
|
|
3249
|
-
}
|
|
3250
|
-
|
|
3251
|
-
/**
|
|
3252
|
-
* @private
|
|
3253
|
-
* Positions the bib element based on the current configuration and positioning strategy.
|
|
3254
|
-
*
|
|
3255
|
-
* This method determines the appropriate positioning strategy (fullscreen or not) and configures the bib accordingly.
|
|
3256
|
-
* It also sets up middleware for the floater configuration, computes the position of the bib relative to the trigger element,
|
|
3257
|
-
* and applies the calculated position to the bib's style.
|
|
3258
|
-
*/
|
|
3259
|
-
position() {
|
|
3260
|
-
const strategy = this.getPositioningStrategy();
|
|
3261
|
-
if (strategy === 'fullscreen') {
|
|
3262
|
-
this.configureBibFullscreen(true);
|
|
3263
|
-
this.mirrorSize(true);
|
|
3264
|
-
} else {
|
|
3265
|
-
this.configureBibFullscreen(false);
|
|
3266
|
-
this.mirrorSize(false);
|
|
3267
|
-
|
|
3268
|
-
// Define the middlware for the floater configuration
|
|
3269
|
-
const middleware = [
|
|
3270
|
-
offset(this.element.floaterConfig.offset || 0),
|
|
3271
|
-
...(this.element.floaterConfig.flip ? [flip()] : []), // Add flip middleware if flip is enabled
|
|
3272
|
-
...(this.element.floaterConfig.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled
|
|
3273
|
-
];
|
|
3274
|
-
|
|
3275
|
-
// Compute the position of the bib
|
|
3276
|
-
computePosition(this.element.trigger, this.element.bib, {
|
|
3277
|
-
placement: this.element.floaterConfig.placement || 'bottom',
|
|
3278
|
-
middleware: middleware
|
|
3279
|
-
}).then(({x, y}) => { // eslint-disable-line id-length
|
|
3280
|
-
Object.assign(this.element.bib.style, {
|
|
3281
|
-
left: `${x}px`,
|
|
3282
|
-
top: `${y}px`,
|
|
3283
|
-
});
|
|
3284
|
-
});
|
|
3285
|
-
}
|
|
3286
|
-
}
|
|
3287
|
-
|
|
3288
|
-
/**
|
|
3289
|
-
* @private
|
|
3290
|
-
* Configures the bib element for fullscreen mode based on the mobile status.
|
|
3291
|
-
*
|
|
3292
|
-
* This method sets the 'isFullscreen' attribute on the bib element to "true" if the `isMobile` parameter is true,
|
|
3293
|
-
* and resets its position to the top-left corner of the viewport. If `isMobile` is false, it removes the
|
|
3294
|
-
* 'isFullscreen' attribute, indicating that the bib is not in fullscreen mode.
|
|
3295
|
-
*
|
|
3296
|
-
* @param {boolean} isMobile - A flag indicating whether the current device is mobile.
|
|
3297
|
-
*/
|
|
3298
|
-
configureBibFullscreen(isMobile) {
|
|
3299
|
-
if (isMobile) {
|
|
3300
|
-
this.element.bib.setAttribute('isFullscreen', "true");
|
|
3301
|
-
// reset the prev position
|
|
3302
|
-
this.element.bib.style.top = "0px";
|
|
3303
|
-
this.element.bib.style.left = "0px";
|
|
3304
|
-
} else {
|
|
3305
|
-
this.element.bib.removeAttribute('isFullscreen');
|
|
3306
|
-
}
|
|
3307
|
-
}
|
|
3308
|
-
|
|
3309
|
-
updateState() {
|
|
3310
|
-
const isVisible = this.element.isPopoverVisible;
|
|
3311
|
-
this.element.trigger.setAttribute('aria-expanded', isVisible);
|
|
3312
|
-
|
|
3313
|
-
if (isVisible) {
|
|
3314
|
-
this.element.bib.setAttribute('data-show', true);
|
|
3315
|
-
} else {
|
|
3316
|
-
this.element.bib.removeAttribute('data-show');
|
|
3317
|
-
}
|
|
3318
|
-
|
|
3319
|
-
if (!isVisible) {
|
|
3320
|
-
this.cleanupHideHandlers();
|
|
3321
|
-
try {
|
|
3322
|
-
this.element.cleanup?.();
|
|
3323
|
-
} catch (error) {
|
|
3324
|
-
// Do nothing
|
|
3325
|
-
}
|
|
3326
|
-
}
|
|
3327
|
-
}
|
|
3328
|
-
|
|
3329
|
-
handleFocusLoss() {
|
|
3330
|
-
if (this.element.noHideOnThisFocusLoss ||
|
|
3331
|
-
this.element.hasAttribute('noHideOnThisFocusLoss')) {
|
|
3332
|
-
return;
|
|
3333
|
-
}
|
|
3334
|
-
|
|
3335
|
-
const {activeElement} = document;
|
|
3336
|
-
if (activeElement === document.querySelector('body') ||
|
|
3337
|
-
this.element.contains(activeElement) ||
|
|
3338
|
-
this.element.bibContent?.contains(activeElement)) {
|
|
3339
|
-
return;
|
|
3340
|
-
}
|
|
3341
|
-
|
|
3342
|
-
this.hideBib();
|
|
3343
|
-
}
|
|
3344
|
-
|
|
3345
|
-
setupHideHandlers() {
|
|
3346
|
-
// Define handlers & store references
|
|
3347
|
-
this.focusHandler = () => this.handleFocusLoss();
|
|
3348
|
-
|
|
3349
|
-
this.clickHandler = (evt) => {
|
|
3350
|
-
if (!evt.composedPath().includes(this.element.trigger) &&
|
|
3351
|
-
!evt.composedPath().includes(this.element.bibContent)) {
|
|
3352
|
-
this.hideBib();
|
|
3353
|
-
}
|
|
3354
|
-
};
|
|
3355
|
-
|
|
3356
|
-
// ESC key handler
|
|
3357
|
-
this.keyDownHandler = (evt) => {
|
|
3358
|
-
if (evt.key === 'Escape' && this.element.isPopoverVisible) {
|
|
3359
|
-
this.hideBib();
|
|
3360
|
-
}
|
|
3361
|
-
};
|
|
3362
|
-
|
|
3363
|
-
// Add event listeners using the stored references
|
|
3364
|
-
document.addEventListener('focusin', this.focusHandler);
|
|
3365
|
-
window.addEventListener('click', this.clickHandler);
|
|
3366
|
-
document.addEventListener('keydown', this.keyDownHandler);
|
|
3367
|
-
}
|
|
3368
|
-
|
|
3369
|
-
cleanupHideHandlers() {
|
|
3370
|
-
// Remove event listeners if they exist
|
|
3371
|
-
if (this.focusHandler) {
|
|
3372
|
-
document.removeEventListener('focusin', this.focusHandler);
|
|
3373
|
-
this.focusHandler = null;
|
|
3374
|
-
}
|
|
3375
|
-
|
|
3376
|
-
if (this.clickHandler) {
|
|
3377
|
-
window.removeEventListener('click', this.clickHandler);
|
|
3378
|
-
this.clickHandler = null;
|
|
3379
|
-
}
|
|
3380
|
-
|
|
3381
|
-
if (this.keyDownHandler) {
|
|
3382
|
-
document.removeEventListener('keydown', this.keyDownHandler);
|
|
3383
|
-
this.keyDownHandler = null;
|
|
3384
|
-
}
|
|
3385
|
-
}
|
|
3386
|
-
|
|
3387
|
-
handleUpdate(changedProperties) {
|
|
3388
|
-
if (changedProperties.has('isPopoverVisible')) {
|
|
3389
|
-
this.updateState();
|
|
3390
|
-
}
|
|
3391
|
-
}
|
|
3392
|
-
|
|
3393
|
-
updateCurrentExpandedDropdown() {
|
|
3394
|
-
// Close any other dropdown that is already open
|
|
3395
|
-
if (document.expandedAuroDropdown) {
|
|
3396
|
-
this.hideBib(document.expandedAuroDropdown);
|
|
3397
|
-
}
|
|
3398
|
-
|
|
3399
|
-
document.expandedAuroDropdown = this;
|
|
3400
|
-
}
|
|
3401
|
-
|
|
3402
|
-
showBib() {
|
|
3403
|
-
if (!this.element.disabled && !this.element.isPopoverVisible) {
|
|
3404
|
-
this.updateCurrentExpandedDropdown();
|
|
3405
|
-
this.element.isPopoverVisible = true;
|
|
3406
|
-
this.element.triggerChevron?.setAttribute('data-expanded', true);
|
|
3407
|
-
this.dispatchEventDropdownToggle();
|
|
3408
|
-
this.position();
|
|
3409
|
-
|
|
3410
|
-
// Clean up any existing handlers before setting up new ones
|
|
3411
|
-
this.cleanupHideHandlers();
|
|
3412
|
-
this.setupHideHandlers();
|
|
3413
|
-
|
|
3414
|
-
// Setup auto update to handle resize and scroll
|
|
3415
|
-
this.element.cleanup = autoUpdate(this.element.trigger, this.element.bib, () => {
|
|
3416
|
-
this.position();
|
|
3417
|
-
});
|
|
3418
|
-
}
|
|
3419
|
-
}
|
|
3420
|
-
|
|
3421
|
-
hideBib() {
|
|
3422
|
-
if (this.element.isPopoverVisible && !this.element.disabled && !this.element.noToggle) {
|
|
3423
|
-
this.element.isPopoverVisible = false;
|
|
3424
|
-
this.element.triggerChevron?.removeAttribute('data-expanded');
|
|
3425
|
-
this.dispatchEventDropdownToggle();
|
|
3426
|
-
}
|
|
3427
|
-
}
|
|
3428
|
-
|
|
3429
|
-
/**
|
|
3430
|
-
* @private
|
|
3431
|
-
* @returns {void} Dispatches event with an object showing the state of the dropdown.
|
|
3432
|
-
*/
|
|
3433
|
-
dispatchEventDropdownToggle() {
|
|
3434
|
-
const event = new CustomEvent(this.eventPrefix ? `${this.eventPrefix}-toggled` : 'toggled', {
|
|
3435
|
-
detail: {
|
|
3436
|
-
expanded: this.isPopoverVisible,
|
|
3437
|
-
},
|
|
3438
|
-
composed: true
|
|
3439
|
-
});
|
|
3440
|
-
|
|
3441
|
-
this.element.dispatchEvent(event);
|
|
3442
|
-
}
|
|
3443
|
-
|
|
3444
|
-
handleClick() {
|
|
3445
|
-
if (this.element.isPopoverVisible) {
|
|
3446
|
-
this.hideBib();
|
|
3447
|
-
} else {
|
|
3448
|
-
this.showBib();
|
|
3449
|
-
}
|
|
3450
|
-
|
|
3451
|
-
const event = new CustomEvent(this.eventPrefix ? `${this.eventPrefix}-triggerClick` : "triggerClick", {
|
|
3452
|
-
composed: true,
|
|
3453
|
-
details: {
|
|
3454
|
-
expanded: this.element.isPopoverVisible
|
|
3455
|
-
}
|
|
3456
|
-
});
|
|
3457
|
-
|
|
3458
|
-
this.element.dispatchEvent(event);
|
|
3459
|
-
}
|
|
3460
|
-
|
|
3461
|
-
handleEvent(event) {
|
|
3462
|
-
if (!this.element.disableEventShow) {
|
|
3463
|
-
switch (event.type) {
|
|
3464
|
-
case 'keydown':
|
|
3465
|
-
// Support both Enter and Space keys for accessibility
|
|
3466
|
-
// Space is included as it's expected behavior for interactive elements
|
|
3467
|
-
if (event.key === 'Enter' || event.key === ' ') {
|
|
3468
|
-
event.preventDefault(); // Prevent page scroll on space
|
|
3469
|
-
this.handleClick();
|
|
3470
|
-
}
|
|
3471
|
-
break;
|
|
3472
|
-
case 'mouseenter':
|
|
3473
|
-
if (this.element.hoverToggle) {
|
|
3474
|
-
this.showBib();
|
|
3475
|
-
}
|
|
3476
|
-
break;
|
|
3477
|
-
case 'mouseleave':
|
|
3478
|
-
if (this.element.hoverToggle) {
|
|
3479
|
-
this.hideBib();
|
|
3480
|
-
}
|
|
3481
|
-
break;
|
|
3482
|
-
case 'focus':
|
|
3483
|
-
if (this.element.focusShow) {
|
|
3484
|
-
/*
|
|
3485
|
-
This needs to better handle clicking that gives focus -
|
|
3486
|
-
currently it shows and then immediately hides the bib
|
|
3487
|
-
*/
|
|
3488
|
-
this.showBib();
|
|
3489
|
-
}
|
|
3490
|
-
break;
|
|
3491
|
-
case 'blur':
|
|
3492
|
-
this.handleFocusLoss();
|
|
3493
|
-
break;
|
|
3494
|
-
case 'click':
|
|
3495
|
-
if (document.activeElement === document.body) {
|
|
3496
|
-
event.currentTarget.focus();
|
|
3497
|
-
}
|
|
3498
|
-
this.handleClick();
|
|
3499
|
-
break;
|
|
3500
|
-
// Do nothing
|
|
3501
|
-
}
|
|
3502
|
-
}
|
|
3503
|
-
}
|
|
3504
|
-
|
|
3505
|
-
handleTriggerTabIndex() {
|
|
3506
|
-
const focusableElementSelectors = [
|
|
3507
|
-
'a',
|
|
3508
|
-
'button',
|
|
3509
|
-
'input:not([type="hidden"])',
|
|
3510
|
-
'select',
|
|
3511
|
-
'textarea',
|
|
3512
|
-
'[tabindex]:not([tabindex="-1"])',
|
|
3513
|
-
'auro-button',
|
|
3514
|
-
'auro-input',
|
|
3515
|
-
'auro-hyperlink'
|
|
3516
|
-
];
|
|
3517
|
-
|
|
3518
|
-
const triggerNode = this.element.querySelectorAll('[slot="trigger"]')[0];
|
|
3519
|
-
const triggerNodeTagName = triggerNode.tagName.toLowerCase();
|
|
3520
|
-
|
|
3521
|
-
focusableElementSelectors.forEach((selector) => {
|
|
3522
|
-
// Check if the trigger node element is focusable
|
|
3523
|
-
if (triggerNodeTagName === selector) {
|
|
3524
|
-
this.element.tabIndex = -1;
|
|
3525
|
-
return;
|
|
3526
|
-
}
|
|
3527
|
-
|
|
3528
|
-
// Check if any child is focusable
|
|
3529
|
-
if (triggerNode.querySelector(selector)) {
|
|
3530
|
-
this.element.tabIndex = -1;
|
|
3531
|
-
}
|
|
3532
|
-
});
|
|
3533
|
-
}
|
|
3534
|
-
|
|
3535
|
-
configure(elem, eventPrefix) {
|
|
3536
|
-
this.eventPrefix = eventPrefix;
|
|
3537
|
-
this.element = elem;
|
|
3538
|
-
this.element.trigger = this.element.shadowRoot.querySelector('#trigger');
|
|
3539
|
-
this.element.bib = this.element.shadowRoot.querySelector('#bib');
|
|
3540
|
-
this.element.bibSizer = this.element.shadowRoot.querySelector('#bibSizer');
|
|
3541
|
-
this.element.triggerChevron = this.element.shadowRoot.querySelector('#showStateIcon');
|
|
3542
|
-
|
|
3543
|
-
document.body.append(this.element.bib);
|
|
3544
|
-
|
|
3545
|
-
this.handleTriggerTabIndex();
|
|
3546
|
-
|
|
3547
|
-
this.element.trigger.addEventListener('keydown', (event) => this.handleEvent(event));
|
|
3548
|
-
this.element.trigger.addEventListener('click', (event) => this.handleEvent(event));
|
|
3549
|
-
this.element.trigger.addEventListener('mouseenter', (event) => this.handleEvent(event));
|
|
3550
|
-
this.element.trigger.addEventListener('mouseleave', (event) => this.handleEvent(event));
|
|
3551
|
-
this.element.trigger.addEventListener('focus', (event) => this.handleEvent(event));
|
|
3552
|
-
this.element.trigger.addEventListener('blur', (event) => this.handleEvent(event));
|
|
3553
|
-
}
|
|
3554
|
-
|
|
3555
|
-
disconnect() {
|
|
3556
|
-
this.cleanupHideHandlers();
|
|
3557
|
-
this.element.cleanup?.();
|
|
3558
|
-
|
|
3559
|
-
// Remove event & keyboard listeners
|
|
3560
|
-
if (this.element?.trigger) {
|
|
3561
|
-
this.element.trigger.removeEventListener('keydown', (event) => this.handleEvent(event));
|
|
3562
|
-
this.element.trigger.removeEventListener('click', (event) => this.handleEvent(event));
|
|
3563
|
-
this.element.trigger.removeEventListener('mouseenter', (event) => this.handleEvent(event));
|
|
3564
|
-
this.element.trigger.removeEventListener('mouseleave', (event) => this.handleEvent(event));
|
|
3565
|
-
this.element.trigger.removeEventListener('focus', (event) => this.handleEvent(event));
|
|
3566
|
-
this.element.trigger.removeEventListener('blur', (event) => this.handleEvent(event));
|
|
3567
|
-
}
|
|
3568
|
-
}
|
|
3569
|
-
}
|
|
3570
|
-
|
|
3571
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
3572
|
-
// See LICENSE in the project root for license information.
|
|
3573
|
-
|
|
3574
|
-
|
|
3575
|
-
class AuroDependencyVersioning {
|
|
3576
|
-
|
|
3577
|
-
/**
|
|
3578
|
-
* Generates a unique string to be used for child auro element naming.
|
|
3579
|
-
* @private
|
|
3580
|
-
* @param {string} baseName - Defines the first part of the unique element name.
|
|
3581
|
-
* @param {string} version - Version of the component that will be appended to the baseName.
|
|
3582
|
-
* @returns {string} - Unique string to be used for naming.
|
|
3583
|
-
*/
|
|
3584
|
-
generateElementName(baseName, version) {
|
|
3585
|
-
let result = baseName;
|
|
3586
|
-
|
|
3587
|
-
result += '-';
|
|
3588
|
-
result += version.replace(/[.]/g, '_');
|
|
3589
|
-
|
|
3590
|
-
return result;
|
|
3591
|
-
}
|
|
3592
|
-
|
|
3593
|
-
/**
|
|
3594
|
-
* Generates a unique string to be used for child auro element naming.
|
|
3595
|
-
* @param {string} baseName - Defines the first part of the unique element name.
|
|
3596
|
-
* @param {string} version - Version of the component that will be appended to the baseName.
|
|
3597
|
-
* @returns {string} - Unique string to be used for naming.
|
|
3598
|
-
*/
|
|
3599
|
-
generateTag(baseName, version, tagClass) {
|
|
3600
|
-
const elementName = this.generateElementName(baseName, version);
|
|
3601
|
-
const tag = i$4`${s$1(elementName)}`;
|
|
3602
|
-
|
|
3603
|
-
if (!customElements.get(elementName)) {
|
|
3604
|
-
customElements.define(elementName, class extends tagClass {});
|
|
3605
|
-
}
|
|
3606
|
-
|
|
3607
|
-
return tag;
|
|
3608
|
-
}
|
|
3609
|
-
}
|
|
3610
|
-
|
|
3611
|
-
/**
|
|
3612
|
-
* @license
|
|
3613
|
-
* Copyright 2017 Google LLC
|
|
3614
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
3615
|
-
*/
|
|
3616
|
-
const t={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},e$1=t=>(...e)=>({_$litDirective$:t,values:e});class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}
|
|
3617
|
-
|
|
3618
|
-
/**
|
|
3619
|
-
* @license
|
|
3620
|
-
* Copyright 2018 Google LLC
|
|
3621
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
3622
|
-
*/const e=e$1(class extends i{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||t$1.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(s,[i]){if(undefined===this.st){this.st=new Set,undefined!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return T}});
|
|
3623
|
-
|
|
3624
|
-
/**
|
|
3625
|
-
* @license
|
|
3626
|
-
* Copyright 2018 Google LLC
|
|
3627
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
3628
|
-
*/const o=o=>o??E;
|
|
3629
|
-
|
|
3630
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
3631
|
-
// See LICENSE in the project root for license information.
|
|
3632
|
-
|
|
3633
|
-
|
|
3634
|
-
/**
|
|
3635
|
-
* @attr {Boolean} hidden - If present, the component will be hidden both visually and from screen readers
|
|
3636
|
-
* @attr {Boolean} hiddenVisually - If present, the component will be hidden visually, but still read by screen readers
|
|
3637
|
-
* @attr {Boolean} hiddenAudible - If present, the component will be hidden from screen readers, but seen visually
|
|
3638
|
-
*/
|
|
3639
|
-
|
|
3640
|
-
class AuroElement extends r {
|
|
3641
|
-
|
|
3642
|
-
// function to define props used within the scope of this component
|
|
3643
|
-
static get properties() {
|
|
3644
|
-
return {
|
|
3645
|
-
hidden: { type: Boolean,
|
|
3646
|
-
reflect: true },
|
|
3647
|
-
hiddenVisually: { type: Boolean,
|
|
3648
|
-
reflect: true },
|
|
3649
|
-
hiddenAudible: { type: Boolean,
|
|
3650
|
-
reflect: true },
|
|
3651
|
-
};
|
|
3652
|
-
}
|
|
3653
|
-
|
|
3654
|
-
/**
|
|
3655
|
-
* @private Function that determines state of aria-hidden
|
|
3656
|
-
*/
|
|
3657
|
-
hideAudible(value) {
|
|
3658
|
-
if (value) {
|
|
3659
|
-
return 'true'
|
|
3660
|
-
}
|
|
3661
|
-
|
|
3662
|
-
return 'false'
|
|
3663
|
-
}
|
|
3664
|
-
}
|
|
3665
|
-
|
|
3666
|
-
var error = {"role":"img","color":"currentColor","title":"","desc":"Error alert indicator.","width":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","height":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","xmlns":"http://www.w3.org/2000/svg","xmlns_xlink":"http://www.w3.org/1999/xlink","viewBox":"0 0 24 24","path":"/icons","style":"ico_squareLarge","type":"icon","name":"error","category":"alert","deprecated":true,"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"error__desc\" class=\"ico_squareLarge\" data-deprecated=\"true\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><desc id=\"error__desc\">Error alert indicator.</desc><path d=\"m13.047 5.599 6.786 11.586A1.207 1.207 0 0 1 18.786 19H5.214a1.207 1.207 0 0 1-1.047-1.815l6.786-11.586a1.214 1.214 0 0 1 2.094 0m-1.165.87a.23.23 0 0 0-.085.085L5.419 17.442a.232.232 0 0 0 .203.35h12.756a.234.234 0 0 0 .203-.35L12.203 6.554a.236.236 0 0 0-.321-.084M12 15.5a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5m-.024-6.22c.325 0 .589.261.589.583v4.434a.586.586 0 0 1-.589.583.586.586 0 0 1-.588-.583V9.863c0-.322.264-.583.588-.583\"/></svg>"};
|
|
3667
|
-
|
|
3668
|
-
/* eslint-disable no-underscore-dangle, jsdoc/no-undefined-types, jsdoc/require-param-description */
|
|
3669
|
-
|
|
3670
|
-
const _fetchMap = new Map();
|
|
3671
|
-
|
|
3672
|
-
/**
|
|
3673
|
-
* A callback to parse Response body.
|
|
3674
|
-
*
|
|
3675
|
-
* @callback ResponseParser
|
|
3676
|
-
* @param {Fetch.Response} response
|
|
3677
|
-
* @returns {Promise}
|
|
3678
|
-
*/
|
|
3679
|
-
|
|
3680
|
-
/**
|
|
3681
|
-
* A minimal in-memory map to de-duplicate Fetch API media requests.
|
|
3682
|
-
*
|
|
3683
|
-
* @param {String} uri
|
|
3684
|
-
* @param {Object} [options={}]
|
|
3685
|
-
* @param {ResponseParser} [options.responseParser=(response) => response.text()]
|
|
3686
|
-
* @returns {Promise}
|
|
3687
|
-
*/
|
|
3688
|
-
const cacheFetch = (uri, options = {}) => {
|
|
3689
|
-
const responseParser = options.responseParser || ((response) => response.text());
|
|
3690
|
-
if (!_fetchMap.has(uri)) {
|
|
3691
|
-
_fetchMap.set(uri, fetch(uri).then(responseParser));
|
|
3692
|
-
}
|
|
3693
|
-
return _fetchMap.get(uri);
|
|
3694
|
-
};
|
|
3695
|
-
|
|
3696
|
-
var styleCss$2 = i$3`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}:host .logo{color:var(--ds-color-brand-midnight-400, #01426a)}svg{min-width:var(--ds-auro-icon-size, 1.5rem) !important;width:var(--ds-auro-icon-size, 1.5rem) !important;height:var(--ds-auro-icon-size, 1.5rem) !important}.label{display:flex;align-items:flex-start}.label svg{margin:0 var(--ds-size-50, 0.25rem)}.wrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelContainer{line-height:1.8}`;
|
|
3697
|
-
|
|
3698
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
3699
|
-
// See LICENSE in the project root for license information.
|
|
3700
|
-
|
|
3701
|
-
|
|
3702
|
-
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
3703
|
-
/**
|
|
3704
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
3705
|
-
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
3706
|
-
*/
|
|
3707
|
-
|
|
3708
|
-
// build the component class
|
|
3709
|
-
class BaseIcon extends AuroElement {
|
|
3710
|
-
constructor() {
|
|
3711
|
-
super();
|
|
3712
|
-
this.onDark = false;
|
|
3713
|
-
}
|
|
3714
|
-
|
|
3715
|
-
// function to define props used within the scope of this component
|
|
3716
|
-
static get properties() {
|
|
3717
|
-
return {
|
|
3718
|
-
...super.properties,
|
|
3719
|
-
onDark: {
|
|
3720
|
-
type: Boolean,
|
|
3721
|
-
reflect: true
|
|
3722
|
-
},
|
|
3723
|
-
|
|
3724
|
-
/**
|
|
3725
|
-
* @private
|
|
3726
|
-
*/
|
|
3727
|
-
svg: {
|
|
3728
|
-
attribute: false,
|
|
3729
|
-
reflect: true
|
|
3730
|
-
}
|
|
3731
|
-
};
|
|
3732
|
-
}
|
|
3733
|
-
|
|
3734
|
-
static get styles() {
|
|
3735
|
-
return i$3`
|
|
3736
|
-
${styleCss$2}
|
|
3737
|
-
`;
|
|
3738
|
-
}
|
|
3739
|
-
|
|
3740
|
-
/**
|
|
3741
|
-
* Async function to fetch requested icon from npm CDN.
|
|
3742
|
-
* @private
|
|
3743
|
-
* @param {string} category - Icon category.
|
|
3744
|
-
* @param {string} name - Icon name.
|
|
3745
|
-
* @returns {SVGElement} DOM - Ready HTML to be appended.
|
|
3746
|
-
*/
|
|
3747
|
-
async fetchIcon(category, name) {
|
|
3748
|
-
let iconHTML = '';
|
|
3749
|
-
|
|
3750
|
-
if (category === 'logos') {
|
|
3751
|
-
iconHTML = await cacheFetch(`${this.uri}/${category}/${name}.svg`);
|
|
3752
|
-
} else {
|
|
3753
|
-
iconHTML = await cacheFetch(`${this.uri}/icons/${category}/${name}.svg`);
|
|
3754
|
-
}
|
|
3755
|
-
|
|
3756
|
-
const dom = new DOMParser().parseFromString(iconHTML, 'text/html');
|
|
3757
|
-
|
|
3758
|
-
return dom.body.querySelector('svg');
|
|
3759
|
-
}
|
|
3760
|
-
|
|
3761
|
-
// lifecycle function
|
|
3762
|
-
async firstUpdated() {
|
|
3763
|
-
if (!this.customSvg) {
|
|
3764
|
-
const svg = await this.fetchIcon(this.category, this.name);
|
|
3765
|
-
|
|
3766
|
-
if (svg) {
|
|
3767
|
-
this.svg = svg;
|
|
3768
|
-
} else if (!svg) {
|
|
3769
|
-
const penDOM = new DOMParser().parseFromString(error.svg, 'text/html');
|
|
3770
|
-
|
|
3771
|
-
this.svg = penDOM.body.firstChild;
|
|
3772
|
-
}
|
|
3773
|
-
}
|
|
3774
|
-
}
|
|
3775
|
-
}
|
|
3776
|
-
|
|
3777
|
-
var tokensCss$1 = i$3`:host{--ds-auro-icon-color: var(--ds-color-icon-primary-default, $ds-color-icon-primary-default);--ds-auro-icon-size: var(--ds-size-300, $ds-size-300)}`;
|
|
3778
|
-
|
|
3779
|
-
var colorCss$2 = i$3`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[accent]){--ds-auro-icon-color: var(--ds-color-icon-accent-default, #a2c270)}:host(:not([onDark])[disabled]){--ds-auro-icon-color: var(--ds-color-icon-ui-primary-disabled-default, #adadad)}:host(:not([onDark])[emphasis]){--ds-auro-icon-color: var(--ds-color-icon-emphasis-default, #2a2a2a)}:host(:not([onDark])[error]){--ds-auro-icon-color: var(--ds-color-icon-error-default, #cc1816)}:host(:not([onDark])[info]){--ds-auro-icon-color: var(--ds-color-icon-info-default, #326aa5)}:host(:not([onDark])[secondary]){--ds-auro-icon-color: var(--ds-color-icon-secondary-default, #7e8894)}:host(:not([onDark])[subtle]){--ds-auro-icon-color: var(--ds-color-icon-subtle-default, #a0c9f1)}:host(:not([onDark])[success]){--ds-auro-icon-color: var(--ds-color-icon-success-default, #40a080)}:host(:not([onDark])[tertiary]){--ds-auro-icon-color: var(--ds-color-icon-tertiary-default, #afb9c6)}:host(:not([onDark])[warning]){--ds-auro-icon-color: var(--ds-color-icon-warning-default, #c49432)}:host([onDark]){--ds-auro-icon-color: var(--ds-color-icon-primary-inverse, #f7f7f7)}:host([onDark][accent]){--ds-auro-icon-color: var(--ds-color-icon-accent-inverse, #badd81)}:host([onDark][disabled]){--ds-auro-icon-color: var(--ds-color-icon-ui-primary-disabled-inverse, #7e7e7e)}:host([onDark][emphasis]){--ds-auro-icon-color: var(--ds-color-icon-emphasis-inverse, #ffffff)}:host([onDark][error]){--ds-auro-icon-color: var(--ds-color-icon-error-inverse, #f9aca6)}:host([onDark][info]){--ds-auro-icon-color: var(--ds-color-icon-info-inverse, #89b2d4)}:host([onDark][secondary]){--ds-auro-icon-color: var(--ds-color-icon-secondary-inverse, #ccd2db)}:host([onDark][subtle]){--ds-auro-icon-color: var(--ds-color-icon-subtle-inverse, #326aa5)}:host([onDark][success]){--ds-auro-icon-color: var(--ds-color-icon-success-inverse, #8eceb9)}:host([onDark][tertiary]){--ds-auro-icon-color: var(--ds-color-icon-tertiary-inverse, #939fad)}:host([onDark][warning]){--ds-auro-icon-color: var(--ds-color-icon-warning-inverse, #f2c153)}`;
|
|
3780
|
-
|
|
3781
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
3782
|
-
// See LICENSE in the project root for license information.
|
|
3783
|
-
|
|
3784
|
-
|
|
3785
|
-
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
3786
|
-
/**
|
|
3787
|
-
* auro-icon provides users a way to use the Auro Icons by simply passing in the category and name.
|
|
3788
|
-
*
|
|
3789
|
-
* @attr {String} category - The category of the icon you are looking for. See https://auro.alaskaair.com/icons/usage.
|
|
3790
|
-
* @attr {String} name - The name of the icon you are looking for without the file extension. See https://auro.alaskaair.com/icons/usage
|
|
3791
|
-
* @attr {Boolean} customColor - Removes primary selector.
|
|
3792
|
-
* @attr {Boolean} customSvg - When true, auro-icon will render a custom SVG inside the default slot.
|
|
3793
|
-
* @attr {Boolean} label - Exposes content in slot as icon label.
|
|
3794
|
-
* @attr {Boolean} primary - DEPRECATED: Sets the icon to use the baseline primary icon style.
|
|
3795
|
-
* @attr {Boolean} accent - Sets the icon to use the accent style.
|
|
3796
|
-
* @attr {Boolean} emphasis - Sets the icon to use the emphasis style.
|
|
3797
|
-
* @attr {Boolean} disabled - Sets the icon to use the disabled style.
|
|
3798
|
-
* @attr {Boolean} error - Sets the icon to use the error style.
|
|
3799
|
-
* @attr {Boolean} info - Sets the icon to use the info style.
|
|
3800
|
-
* @attr {Boolean} secondary - Sets the icon to use the secondary style.
|
|
3801
|
-
* @attr {Boolean} tertiary - Sets the icon to use the tertiary style.
|
|
3802
|
-
* @attr {Boolean} subtle - Sets the icon to use the subtle style.
|
|
3803
|
-
* @attr {Boolean} success - Sets the icon to use the success style.
|
|
3804
|
-
* @attr {Boolean} warning - Sets the icon to use the warning style.
|
|
3805
|
-
* @attr {String} ariaHidden - Set aria-hidden value. Default is `true`. Option is `false`.
|
|
3806
|
-
* @attr {String} uri - Set the uri for CDN used when fetching icons
|
|
3807
|
-
* @slot - Hidden from visibility, used for a11y if icon description is needed.
|
|
3808
|
-
* @slot svg - Used for custom SVG content.
|
|
3809
|
-
*/
|
|
3810
|
-
|
|
3811
|
-
// build the component class
|
|
3812
|
-
class AuroIcon extends BaseIcon {
|
|
3813
|
-
constructor() {
|
|
3814
|
-
super();
|
|
3815
|
-
|
|
3816
|
-
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
3817
|
-
|
|
3818
|
-
this.privateDefaults();
|
|
3819
|
-
}
|
|
3820
|
-
|
|
3821
|
-
/**
|
|
3822
|
-
* Internal Defaults.
|
|
3823
|
-
* @private
|
|
3824
|
-
* @returns {void}
|
|
3825
|
-
*/
|
|
3826
|
-
privateDefaults() {
|
|
3827
|
-
this.accent = false;
|
|
3828
|
-
this.customColor = false;
|
|
3829
|
-
this.customSvg = false;
|
|
3830
|
-
this.disabled = false;
|
|
3831
|
-
this.emphasis = false;
|
|
3832
|
-
this.error = false;
|
|
3833
|
-
this.info = false;
|
|
3834
|
-
this.label = false;
|
|
3835
|
-
this.primary = false;
|
|
3836
|
-
this.secondary = false;
|
|
3837
|
-
this.subtle = false;
|
|
3838
|
-
this.success = false;
|
|
3839
|
-
this.tertiary = false;
|
|
3840
|
-
this.warning = false;
|
|
3841
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils();
|
|
3842
|
-
}
|
|
3843
|
-
|
|
3844
|
-
// function to define props used within the scope of this component
|
|
3845
|
-
static get properties() {
|
|
3846
|
-
return {
|
|
3847
|
-
...super.properties,
|
|
3848
|
-
accent: {
|
|
3849
|
-
type: Boolean,
|
|
3850
|
-
reflect: true
|
|
3851
|
-
},
|
|
3852
|
-
ariaHidden: {
|
|
3853
|
-
type: String,
|
|
3854
|
-
reflect: true
|
|
3855
|
-
},
|
|
3856
|
-
category: {
|
|
3857
|
-
type: String,
|
|
3858
|
-
reflect: true
|
|
3859
|
-
},
|
|
3860
|
-
customColor: {
|
|
3861
|
-
type: Boolean
|
|
3862
|
-
},
|
|
3863
|
-
customSvg: {
|
|
3864
|
-
type: Boolean
|
|
3865
|
-
},
|
|
3866
|
-
disabled: {
|
|
3867
|
-
type: Boolean,
|
|
3868
|
-
reflect: true
|
|
3869
|
-
},
|
|
3870
|
-
emphasis: {
|
|
3871
|
-
type: Boolean,
|
|
3872
|
-
reflect: true
|
|
3873
|
-
},
|
|
3874
|
-
error: {
|
|
3875
|
-
type: Boolean,
|
|
3876
|
-
reflect: true
|
|
3877
|
-
},
|
|
3878
|
-
info: {
|
|
3879
|
-
type: Boolean,
|
|
3880
|
-
reflect: true
|
|
3881
|
-
},
|
|
3882
|
-
label: {
|
|
3883
|
-
type: Boolean,
|
|
3884
|
-
reflect: true
|
|
3885
|
-
},
|
|
3886
|
-
name: {
|
|
3887
|
-
type: String,
|
|
3888
|
-
reflect: true
|
|
3889
|
-
},
|
|
3890
|
-
primary: {
|
|
3891
|
-
type: Boolean,
|
|
3892
|
-
reflect: true
|
|
3893
|
-
},
|
|
3894
|
-
secondary: {
|
|
3895
|
-
type: Boolean,
|
|
3896
|
-
reflect: true
|
|
3897
|
-
},
|
|
3898
|
-
subtle: {
|
|
3899
|
-
type: Boolean,
|
|
3900
|
-
reflect: true
|
|
3901
|
-
},
|
|
3902
|
-
success: {
|
|
3903
|
-
type: Boolean,
|
|
3904
|
-
reflect: true
|
|
3905
|
-
},
|
|
3906
|
-
tertiary: {
|
|
3907
|
-
type: Boolean,
|
|
3908
|
-
reflect: true
|
|
3909
|
-
},
|
|
3910
|
-
uri: {
|
|
3911
|
-
type: String
|
|
3912
|
-
},
|
|
3913
|
-
warning: {
|
|
3914
|
-
type: Boolean,
|
|
3915
|
-
reflect: true
|
|
3916
|
-
}
|
|
3917
|
-
};
|
|
3918
|
-
}
|
|
3919
|
-
|
|
3920
|
-
static get styles() {
|
|
3921
|
-
return [
|
|
3922
|
-
super.styles,
|
|
3923
|
-
i$3`${tokensCss$1}`,
|
|
3924
|
-
i$3`${styleCss$2}`,
|
|
3925
|
-
i$3`${colorCss$2}`
|
|
3926
|
-
];
|
|
3927
|
-
}
|
|
3928
|
-
|
|
3929
|
-
/**
|
|
3930
|
-
* This will register this element with the browser.
|
|
3931
|
-
* @param {string} [name="auro-icon"] - The name of element that you want to register to.
|
|
3932
|
-
*
|
|
3933
|
-
* @example
|
|
3934
|
-
* AuroIcon.register("custom-icon") // this will register this element to <custom-icon/>
|
|
3935
|
-
*
|
|
3936
|
-
*/
|
|
3937
|
-
static register(name = "auro-icon") {
|
|
3938
|
-
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroIcon);
|
|
3939
|
-
}
|
|
3940
|
-
|
|
3941
|
-
connectedCallback() {
|
|
3942
|
-
super.connectedCallback();
|
|
3943
|
-
|
|
3944
|
-
// Add the tag name as an attribute if it is different than the component name
|
|
3945
|
-
this.runtimeUtils.handleComponentTagRename(this, 'auro-icon');
|
|
3946
|
-
}
|
|
3947
|
-
|
|
3948
|
-
/**
|
|
3949
|
-
* @returns {void} Exposes CSS parts for styling from parent components.
|
|
3950
|
-
*/
|
|
3951
|
-
exposeCssParts() {
|
|
3952
|
-
this.setAttribute('exportparts', 'svg:iconSvg');
|
|
3953
|
-
}
|
|
3954
|
-
|
|
3955
|
-
// function that renders the HTML and CSS into the scope of the component
|
|
3956
|
-
render() {
|
|
3957
|
-
const a11y = {
|
|
3958
|
-
'labelContainer': true,
|
|
3959
|
-
'util_displayHiddenVisually': !this.label
|
|
3960
|
-
};
|
|
3961
|
-
|
|
3962
|
-
const classes = {
|
|
3963
|
-
'label': this.label,
|
|
3964
|
-
'wrapper': true,
|
|
3965
|
-
};
|
|
3966
|
-
|
|
3967
|
-
return x`
|
|
3968
|
-
<div
|
|
3969
|
-
class="${e(classes)}"
|
|
3970
|
-
title="${o(this.title || undefined)}">
|
|
3971
|
-
<span aria-hidden="${o(this.ariaHidden ? this.ariaHidden : true)}" part="svg">
|
|
3972
|
-
${this.customSvg ? x`
|
|
3973
|
-
<slot name="svg"></slot>
|
|
3974
|
-
` : x`
|
|
3975
|
-
${this.svg}
|
|
3976
|
-
`
|
|
3977
|
-
}
|
|
3978
|
-
</span>
|
|
3979
|
-
|
|
3980
|
-
<div class="${e(a11y)}">
|
|
3981
|
-
<slot></slot>
|
|
3982
|
-
</div>
|
|
3983
|
-
</div>
|
|
3984
|
-
`;
|
|
3985
|
-
}
|
|
3986
|
-
}
|
|
3987
|
-
|
|
3988
|
-
var iconVersion = '6.1.2';
|
|
3989
|
-
|
|
3990
|
-
var styleCss$1 = i$3`:host{position:relative;display:inline-block;max-width:100%}:host([fluid]){display:block}#bibSizer{position:absolute;z-index:-1;opacity:0;pointer-events:none}.label{font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-text-body-size-default, 1rem);transition:font-size .3s cubic-bezier(0.215, 0.61, 0.355, 1);white-space:normal}.label[hasTrigger=false]{font-size:var(--ds-text-body-size-default, 1rem)}.trigger{position:relative;display:flex;align-items:center;border-width:1px;border-style:solid}@media(hover: hover){.trigger:hover{cursor:pointer}}.triggerContentWrapper{overflow:hidden;flex:1;text-overflow:ellipsis;white-space:nowrap}#showStateIcon{display:flex;overflow:hidden;height:100%;align-items:center;margin-left:var(--ds-size-100, 0.5rem)}#showStateIcon [auro-icon]{height:var(--ds-size-300, 1.5rem);line-height:var(--ds-size-300, 1.5rem)}#showStateIcon[data-expanded=true] [auro-icon]{transform:rotate(-180deg)}.helpText{margin-top:var(--ds-size-50, 0.25rem);font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-text-body-size-default, 1rem)}:host([matchwidth]) #bibSizer{width:100%}:host([disabled]){pointer-events:none}:host([inset]) .trigger{padding:var(--ds-size-150, 0.75rem) var(--ds-size-200, 1rem)}:host([common]) .trigger,:host([inset][bordered]) .trigger{padding:var(--ds-size-200, 1rem) var(--ds-size-150, 0.75rem)}:host([common]) .trigger,:host([rounded]) .trigger{border-radius:var(--ds-border-radius, 0.375rem)}`;
|
|
3991
|
-
|
|
3992
|
-
var colorCss$1 = i$3`.label{color:var(--ds-auro-dropdown-label-text-color)}.trigger{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-container-color);color:var(--ds-auro-dropdown-trigger-text-color)}.trigger:focus-within,.trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-active-default, #0074c8)}.trigger:focus-within:not(:active){--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-ui-focus-default, #2c67b5);outline:1px solid var(--ds-color-border-ui-focus-default, #2c67b5)}.trigger:hover{--ds-auro-dropdown-trigger-container-color: var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03))}.helpText{color:var(--ds-auro-dropdown-help-text-color)}:host([disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-color-text-ui-disabled-default, #adadad);--ds-auro-dropdown-label-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}:host([common]),:host([bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-primary-default, #585e67)}:host([common]) .trigger:active,:host([common]) .trigger:focus-within,:host([bordered]) .trigger:active,:host([bordered]) .trigger:focus-within{--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-ui-focus-default, #2c67b5)}:host([error]){--ds-auro-dropdown-help-text-color: var(--ds-color-text-error-default, #cc1816);--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-error-default, #cc1816)}:host([error]) .trigger{outline:solid 1px var(--ds-auro-dropdown-trigger-border-color)}:host([error]) .trigger:focus-within,:host([error]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-active-default, #0074c8)}:host([error]) .trigger:active{box-shadow:none;outline:none}:host([disabled][common]),:host([disabled][bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-ui-disabled-default, #adadad)}`;
|
|
3993
|
-
|
|
3994
|
-
var tokensCss = i$3`:host{--ds-auro-dropdown-help-text-color: var(--ds-color-text-secondary-default, #525252);--ds-auro-dropdown-label-text-color: var(--ds-color-text-secondary-default, #525252);--ds-auro-dropdown-popover-container-color: var(--ds-color-container-primary-default, #ffffff);--ds-auro-dropdown-popover-border-color: transparent;--ds-auro-dropdown-popover-text-color: var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-dropdown-trigger-container-color: var(--ds-color-container-primary-default, #ffffff);--ds-auro-dropdown-trigger-border-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-color-container-primary-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-color-text-primary-default, #2a2a2a)}`;
|
|
3995
|
-
|
|
3996
|
-
var styleCss$3 = i$3`:host{position:absolute;z-index:var(--depth-tooltip, 400);display:none}.container{display:inline-block;overflow:auto;box-sizing:border-box;margin:var(--ds-size-50, 0.25rem) 0}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}`;
|
|
3997
|
-
|
|
3998
|
-
var colorCss$3 = i$3`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
3999
|
-
|
|
4000
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
4001
|
-
// See LICENSE in the project root for license information.
|
|
4002
|
-
|
|
4003
|
-
|
|
4004
|
-
|
|
4005
|
-
const DESIGN_TOKEN_BREAKPOINT_PREFIX = '--ds-grid-breakpoint-';
|
|
4006
|
-
const DESIGN_TOKEN_BREAKPOINT_OPTIONS = [
|
|
4007
|
-
'lg',
|
|
4008
|
-
'md',
|
|
4009
|
-
'sm',
|
|
4010
|
-
'xs',
|
|
4011
|
-
];
|
|
4012
|
-
|
|
4013
|
-
/**
|
|
4014
|
-
* @prop { String } mobileFullscreenBreakpoint - Defines the screen size breakpoint (`lg`, `md`, `sm`, or `xs`) at which the dropdown switches to fullscreen mode on mobile. When expanded, the dropdown will automatically display in fullscreen mode if the screen size is equal to or smaller than the selected breakpoint.
|
|
4015
|
-
* @csspart bibContainer - Apply css to the bib container.
|
|
4016
|
-
*/
|
|
4017
|
-
|
|
4018
|
-
class AuroDropdownBib extends r {
|
|
4019
|
-
|
|
4020
|
-
constructor() {
|
|
4021
|
-
super();
|
|
4022
|
-
|
|
4023
|
-
/**
|
|
4024
|
-
* @private
|
|
4025
|
-
*/
|
|
4026
|
-
this._mobileBreakpointValue = undefined;
|
|
4027
|
-
}
|
|
4028
|
-
|
|
4029
|
-
static get styles() {
|
|
4030
|
-
return [
|
|
4031
|
-
styleCss$3,
|
|
4032
|
-
colorCss$3,
|
|
4033
|
-
tokensCss
|
|
4034
|
-
];
|
|
4035
|
-
}
|
|
4036
|
-
|
|
4037
|
-
static get properties() {
|
|
4038
|
-
return {
|
|
4039
|
-
|
|
4040
|
-
/**
|
|
4041
|
-
* If declared, will apply all styles for the common theme.
|
|
4042
|
-
*/
|
|
4043
|
-
common: {
|
|
4044
|
-
type: Boolean,
|
|
4045
|
-
reflect: true
|
|
4046
|
-
},
|
|
4047
|
-
|
|
4048
|
-
/**
|
|
4049
|
-
* If declared, will apply extra padding to bib content.
|
|
4050
|
-
*/
|
|
4051
|
-
inset: {
|
|
4052
|
-
type: Boolean,
|
|
4053
|
-
reflect: true
|
|
4054
|
-
},
|
|
4055
|
-
|
|
4056
|
-
/**
|
|
4057
|
-
* If declared, will apply border-radius to the bib.
|
|
4058
|
-
*/
|
|
4059
|
-
rounded: {
|
|
4060
|
-
type: Boolean,
|
|
4061
|
-
reflect: true
|
|
4062
|
-
},
|
|
4063
|
-
};
|
|
4064
|
-
}
|
|
4065
|
-
|
|
4066
|
-
set mobileFullscreenBreakpoint(value) {
|
|
4067
|
-
// verify the defined breakpoint is valid and exit out if not
|
|
4068
|
-
const validatedValue = DESIGN_TOKEN_BREAKPOINT_OPTIONS.includes(value) ? value : undefined;
|
|
4069
|
-
if (!validatedValue) {
|
|
4070
|
-
this._mobileBreakpointValue = undefined;
|
|
4071
|
-
} else {
|
|
4072
|
-
// get the pixel value for the defined breakpoint
|
|
4073
|
-
const docStyle = getComputedStyle(document.documentElement);
|
|
4074
|
-
this._mobileBreakpointValue = docStyle.getPropertyValue(DESIGN_TOKEN_BREAKPOINT_PREFIX + value);
|
|
4075
|
-
}
|
|
4076
|
-
}
|
|
4077
|
-
|
|
4078
|
-
get mobileFullscreenBreakpoint() {
|
|
4079
|
-
return this._mobileBreakpointValue;
|
|
4080
|
-
}
|
|
4081
|
-
|
|
4082
|
-
// function that renders the HTML and CSS into the scope of the component
|
|
4083
|
-
render() {
|
|
4084
|
-
return u$1`
|
|
4085
|
-
<div class="container" part="bibContainer">
|
|
4086
|
-
<slot></slot>
|
|
4087
|
-
</div>
|
|
4088
|
-
`;
|
|
4089
|
-
}
|
|
4090
|
-
}
|
|
4091
|
-
|
|
4092
|
-
// default internal definition
|
|
4093
|
-
if (!customElements.get("auro-dropdownbib")) {
|
|
4094
|
-
customElements.define("auro-dropdownbib", AuroDropdownBib);
|
|
4095
|
-
}
|
|
4096
|
-
|
|
4097
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
4098
|
-
// See LICENSE in the project root for license information.
|
|
4099
|
-
|
|
4100
|
-
|
|
4101
|
-
/**
|
|
4102
|
-
* @attr { Boolean } disableEventShow - If declared, the dropdown will only show by calling the API .show() public method.
|
|
4103
|
-
* @slot - Default slot for the popover content.
|
|
4104
|
-
* @slot label - Defines the content of the label.
|
|
4105
|
-
* @slot helpText - Defines the content of the helpText.
|
|
4106
|
-
* @slot trigger - Defines the content of the trigger.
|
|
4107
|
-
* @csspart trigger - The trigger content container.
|
|
4108
|
-
* @csspart chevron - The collapsed/expanded state icon container.
|
|
4109
|
-
* @csspart helpText - The helpText content container.
|
|
4110
|
-
* @csspart popover - The bib content container.
|
|
4111
|
-
* @event auroDropdown-triggerClick - Notifies that the trigger has been clicked.
|
|
4112
|
-
* @event auroDropdown-toggled - Notifies that the visibility of the dropdown bib has changed.
|
|
4113
|
-
*/
|
|
4114
|
-
class AuroDropdown extends r {
|
|
4115
|
-
constructor() {
|
|
4116
|
-
super();
|
|
4117
|
-
|
|
4118
|
-
this.isPopoverVisible = false;
|
|
4119
|
-
this.matchWidth = false;
|
|
4120
|
-
this.noHideOnThisFocusLoss = false;
|
|
4121
|
-
|
|
4122
|
-
this.privateDefaults();
|
|
4123
|
-
}
|
|
4124
|
-
|
|
4125
|
-
/**
|
|
4126
|
-
* @private
|
|
4127
|
-
* @returns {void} Internal defaults.
|
|
4128
|
-
*/
|
|
4129
|
-
privateDefaults() {
|
|
4130
|
-
this.bordered = false;
|
|
4131
|
-
this.chevron = false;
|
|
4132
|
-
this.disabled = false;
|
|
4133
|
-
this.error = false;
|
|
4134
|
-
this.inset = false;
|
|
4135
|
-
this.placement = 'bottom-start';
|
|
4136
|
-
this.rounded = false;
|
|
4137
|
-
this.tabIndex = 0;
|
|
4138
|
-
this.noToggle = false;
|
|
4139
|
-
|
|
4140
|
-
/**
|
|
4141
|
-
* @private
|
|
4142
|
-
*/
|
|
4143
|
-
this.hasTriggerContent = false;
|
|
4144
|
-
|
|
4145
|
-
/**
|
|
4146
|
-
* @private
|
|
4147
|
-
*/
|
|
4148
|
-
this.triggerContentSlot = undefined;
|
|
4149
|
-
|
|
4150
|
-
/**
|
|
4151
|
-
* @private
|
|
4152
|
-
*/
|
|
4153
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils();
|
|
4154
|
-
|
|
4155
|
-
/**
|
|
4156
|
-
* @private
|
|
4157
|
-
*/
|
|
4158
|
-
this.floater = new AuroFloatingUI();
|
|
4159
|
-
|
|
4160
|
-
/**
|
|
4161
|
-
* @private
|
|
4162
|
-
*/
|
|
4163
|
-
this.floaterConfig = {
|
|
4164
|
-
placement: 'bottom-start',
|
|
4165
|
-
flip: true,
|
|
4166
|
-
autoPlacement: false,
|
|
4167
|
-
offset: 0,
|
|
4168
|
-
};
|
|
4169
|
-
|
|
4170
|
-
/**
|
|
4171
|
-
* Generate unique names for dependency components.
|
|
4172
|
-
*/
|
|
4173
|
-
const versioning = new AuroDependencyVersioning();
|
|
4174
|
-
this.iconTag = versioning.generateTag('auro-icon', iconVersion, AuroIcon);
|
|
4175
|
-
}
|
|
4176
|
-
|
|
4177
|
-
/**
|
|
4178
|
-
* Public method to hide the dropdown.
|
|
4179
|
-
* @returns {void}
|
|
4180
|
-
*/
|
|
4181
|
-
hide() {
|
|
4182
|
-
this.floater.hideBib();
|
|
4183
|
-
}
|
|
4184
|
-
|
|
4185
|
-
/**
|
|
4186
|
-
* Public method to show the dropdown.
|
|
4187
|
-
* @returns {void}
|
|
4188
|
-
*/
|
|
4189
|
-
show() {
|
|
4190
|
-
this.floater.showBib();
|
|
4191
|
-
}
|
|
4192
|
-
|
|
4193
|
-
// function to define props used within the scope of this component
|
|
4194
|
-
static get properties() {
|
|
4195
|
-
return {
|
|
4196
|
-
|
|
4197
|
-
/**
|
|
4198
|
-
* If declared, applies a border around the trigger slot.
|
|
4199
|
-
*/
|
|
4200
|
-
bordered: {
|
|
4201
|
-
type: Boolean,
|
|
4202
|
-
reflect: true
|
|
4203
|
-
},
|
|
4204
|
-
|
|
4205
|
-
/**
|
|
4206
|
-
* If declared, the dropdown displays a chevron on the right.
|
|
4207
|
-
* @attr {Boolean} chevron
|
|
4208
|
-
*/
|
|
4209
|
-
chevron: {
|
|
4210
|
-
type: Boolean,
|
|
4211
|
-
reflect: true
|
|
4212
|
-
},
|
|
4213
|
-
|
|
4214
|
-
/**
|
|
4215
|
-
* If declared, the dropdown will be styled with the common theme.
|
|
4216
|
-
*/
|
|
4217
|
-
common: {
|
|
4218
|
-
type: Boolean,
|
|
4219
|
-
reflect: true
|
|
4220
|
-
},
|
|
4221
|
-
|
|
4222
|
-
/**
|
|
4223
|
-
* If declared, the dropdown is not interactive.
|
|
4224
|
-
*/
|
|
4225
|
-
disabled: {
|
|
4226
|
-
type: Boolean,
|
|
4227
|
-
reflect: true
|
|
4228
|
-
},
|
|
4229
|
-
|
|
4230
|
-
/**
|
|
4231
|
-
* @private
|
|
4232
|
-
*/
|
|
4233
|
-
dropdownWidth: {
|
|
4234
|
-
type: Number
|
|
4235
|
-
},
|
|
4236
|
-
|
|
4237
|
-
/**
|
|
4238
|
-
* If declared in combination with `bordered` property or `helpText` slot content, will apply red color to both.
|
|
4239
|
-
*/
|
|
4240
|
-
error: {
|
|
4241
|
-
type: Boolean,
|
|
4242
|
-
reflect: true
|
|
4243
|
-
},
|
|
4244
|
-
|
|
4245
|
-
/**
|
|
4246
|
-
* If declared, the bib will display when focus is applied to the trigger.
|
|
4247
|
-
*/
|
|
4248
|
-
focusShow: {
|
|
4249
|
-
type: Boolean,
|
|
4250
|
-
reflect: true
|
|
4251
|
-
},
|
|
4252
|
-
|
|
4253
|
-
/**
|
|
4254
|
-
* Makes the trigger to be full width of its parent container.
|
|
4255
|
-
*/
|
|
4256
|
-
fluid: {
|
|
4257
|
-
type: Boolean,
|
|
4258
|
-
reflect: true
|
|
4259
|
-
},
|
|
4260
|
-
|
|
4261
|
-
/**
|
|
4262
|
-
* If declared, will apply padding around trigger slot content.
|
|
4263
|
-
*/
|
|
4264
|
-
inset: {
|
|
4265
|
-
type: Boolean,
|
|
4266
|
-
reflect: true
|
|
4267
|
-
},
|
|
4268
|
-
|
|
4269
|
-
/**
|
|
4270
|
-
* If true, the dropdown bib is displayed.
|
|
4271
|
-
*/
|
|
4272
|
-
isPopoverVisible: {
|
|
4273
|
-
type: Boolean
|
|
4274
|
-
},
|
|
4275
|
-
|
|
4276
|
-
/**
|
|
4277
|
-
* If declared, the trigger will toggle the dropdown on mouseover/mouseout.
|
|
4278
|
-
*/
|
|
4279
|
-
hoverToggle: {
|
|
4280
|
-
type: Boolean,
|
|
4281
|
-
reflect: true
|
|
4282
|
-
},
|
|
4283
|
-
|
|
4284
|
-
/**
|
|
4285
|
-
* @private
|
|
4286
|
-
*/
|
|
4287
|
-
hasTriggerContent: {
|
|
4288
|
-
type: Boolean
|
|
4289
|
-
},
|
|
4290
|
-
|
|
4291
|
-
/**
|
|
4292
|
-
* Defines the screen size breakpoint (`lg`, `md`, `sm`, or `xs`) at which the dropdown switches to fullscreen mode on mobile. When expanded, the dropdown will automatically display in fullscreen mode if the screen size is equal to or smaller than the selected breakpoint.
|
|
4293
|
-
*/
|
|
4294
|
-
mobileFullscreenBreakpoint: {
|
|
4295
|
-
type: String,
|
|
4296
|
-
reflect: true
|
|
4297
|
-
},
|
|
4298
|
-
|
|
4299
|
-
/**
|
|
4300
|
-
* If declared, the popover and trigger will be set to the same width.
|
|
4301
|
-
*/
|
|
4302
|
-
matchWidth: {
|
|
4303
|
-
type: Boolean,
|
|
4304
|
-
reflect: true
|
|
4305
|
-
},
|
|
4306
|
-
|
|
4307
|
-
/**
|
|
4308
|
-
* If declared, the dropdown will not hide when moving focus outside the element.
|
|
4309
|
-
*/
|
|
4310
|
-
noHideOnThisFocusLoss: {
|
|
4311
|
-
type: Boolean,
|
|
4312
|
-
reflect: true
|
|
4313
|
-
},
|
|
4314
|
-
|
|
4315
|
-
/**
|
|
4316
|
-
* If declared, the trigger will only show the dropdown bib.
|
|
4317
|
-
*/
|
|
4318
|
-
noToggle: {
|
|
4319
|
-
type: Boolean,
|
|
4320
|
-
reflect: true
|
|
4321
|
-
},
|
|
4322
|
-
|
|
4323
|
-
onSlotChange: {
|
|
4324
|
-
type: Function,
|
|
4325
|
-
reflect: false
|
|
4326
|
-
},
|
|
4327
|
-
|
|
4328
|
-
/**
|
|
4329
|
-
* @private
|
|
4330
|
-
*/
|
|
4331
|
-
placement: {
|
|
4332
|
-
type: String
|
|
4333
|
-
},
|
|
4334
|
-
|
|
4335
|
-
/**
|
|
4336
|
-
* If declared, will apply border-radius to trigger and default slots.
|
|
4337
|
-
*/
|
|
4338
|
-
rounded: {
|
|
4339
|
-
type: Boolean,
|
|
4340
|
-
reflect: true
|
|
4341
|
-
},
|
|
4342
|
-
|
|
4343
|
-
/**
|
|
4344
|
-
* @private
|
|
4345
|
-
*/
|
|
4346
|
-
tabIndex: {
|
|
4347
|
-
type: Number
|
|
4348
|
-
}
|
|
4349
|
-
};
|
|
4350
|
-
}
|
|
4351
|
-
|
|
4352
|
-
static get styles() {
|
|
4353
|
-
return [
|
|
4354
|
-
colorCss$1,
|
|
4355
|
-
styleCss$1,
|
|
4356
|
-
tokensCss
|
|
4357
|
-
];
|
|
4358
|
-
}
|
|
4359
|
-
|
|
4360
|
-
/**
|
|
4361
|
-
* This will register this element with the browser.
|
|
4362
|
-
* @param {string} [name="auro-dropdown"] - The name of element that you want to register to.
|
|
4363
|
-
*
|
|
4364
|
-
* @example
|
|
4365
|
-
* AuroDropdown.register("custom-dropdown") // this will register this element to <custom-dropdown/>
|
|
4366
|
-
*
|
|
4367
|
-
*/
|
|
4368
|
-
static register(name = "auro-dropdown") {
|
|
4369
|
-
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroDropdown);
|
|
4370
|
-
}
|
|
4371
|
-
|
|
4372
|
-
connectedCallback() {
|
|
4373
|
-
super.connectedCallback();
|
|
4374
|
-
}
|
|
4375
|
-
|
|
4376
|
-
disconnectedCallback() {
|
|
4377
|
-
super.disconnectedCallback();
|
|
4378
|
-
}
|
|
4379
|
-
|
|
4380
|
-
updated(changedProperties) {
|
|
4381
|
-
this.floater.handleUpdate(changedProperties);
|
|
4382
|
-
|
|
4383
|
-
if (changedProperties.has('mobileFullscreenBreakpoint')) {
|
|
4384
|
-
this.bibContent.mobileFullscreenBreakpoint = this.mobileFullscreenBreakpoint;
|
|
4385
|
-
}
|
|
4386
|
-
|
|
4387
|
-
// when trigger's content is changed without any attribute or node change,
|
|
4388
|
-
// `requestUpdate` needs to be called to update hasTriggerContnet
|
|
4389
|
-
if (changedProperties.size === 0 || changedProperties.has('isPopoverVisible')) {
|
|
4390
|
-
this.handleTriggerContentSlotChange();
|
|
4391
|
-
}
|
|
4392
|
-
}
|
|
4393
|
-
|
|
4394
|
-
firstUpdated() {
|
|
4395
|
-
this.floater.configure(this, 'auroDropdown');
|
|
4396
|
-
this.bibContent = this.floater.element.bib;
|
|
4397
|
-
|
|
4398
|
-
// Add the tag name as an attribute if it is different than the component name
|
|
4399
|
-
this.runtimeUtils.handleComponentTagRename(this, 'auro-dropdown');
|
|
4400
|
-
}
|
|
4401
|
-
|
|
4402
|
-
/**
|
|
4403
|
-
* Exposes CSS parts for styling from parent components.
|
|
4404
|
-
* @private
|
|
4405
|
-
* @returns {void}
|
|
4406
|
-
*/
|
|
4407
|
-
exposeCssParts() {
|
|
4408
|
-
this.setAttribute('exportparts', 'trigger:dropdownTrigger, chevron:dropdownChevron, helpText:dropdownHelpText, size:dropdownSize');
|
|
4409
|
-
}
|
|
4410
|
-
|
|
4411
|
-
/**
|
|
4412
|
-
* Determines if content is within a custom slot.
|
|
4413
|
-
* @private
|
|
4414
|
-
* @param {HTMLElement} element - The element to check.
|
|
4415
|
-
* @returns {Boolean}
|
|
4416
|
-
*/
|
|
4417
|
-
isCustomSlotContent(element) {
|
|
4418
|
-
let currentElement = element;
|
|
4419
|
-
|
|
4420
|
-
let inCustomSlot = false;
|
|
4421
|
-
|
|
4422
|
-
while (currentElement) {
|
|
4423
|
-
currentElement = currentElement.parentElement;
|
|
4424
|
-
|
|
4425
|
-
if (currentElement && currentElement.hasAttribute('slot')) {
|
|
4426
|
-
inCustomSlot = true;
|
|
4427
|
-
break;
|
|
4428
|
-
}
|
|
4429
|
-
}
|
|
4430
|
-
|
|
4431
|
-
return inCustomSlot;
|
|
4432
|
-
}
|
|
4433
|
-
|
|
4434
|
-
/**
|
|
4435
|
-
* Handles changes to the trigger content slot and updates related properties.
|
|
4436
|
-
*
|
|
4437
|
-
* It first updates the floater settings
|
|
4438
|
-
* Then, it retrieves the assigned nodes from the event target and checks if any of
|
|
4439
|
-
* the nodes contain non-empty text content, updating the `hasTriggerContent` property accordingly.
|
|
4440
|
-
*
|
|
4441
|
-
* @private
|
|
4442
|
-
* @method handleTriggerContentSlotChange
|
|
4443
|
-
* @param {Event} event - native slotchange event
|
|
4444
|
-
* @returns {void}
|
|
4445
|
-
*/
|
|
4446
|
-
handleTriggerContentSlotChange(event) {
|
|
4447
|
-
this.floater.handleTriggerTabIndex();
|
|
4448
|
-
|
|
4449
|
-
if (event) {
|
|
4450
|
-
this.triggerNode = event.target;
|
|
4451
|
-
this.triggerContentSlot = event.target.assignedNodes();
|
|
4452
|
-
}
|
|
4453
|
-
|
|
4454
|
-
if (this.triggerContentSlot) {
|
|
4455
|
-
this.hasTriggerContent = this.triggerContentSlot.some((slot) => {
|
|
4456
|
-
if (slot.textContent.trim()) {
|
|
4457
|
-
return true;
|
|
4458
|
-
}
|
|
4459
|
-
const slotInSlot = slot.querySelector('slot');
|
|
4460
|
-
if (!slotInSlot) {
|
|
4461
|
-
return false;
|
|
4462
|
-
}
|
|
4463
|
-
const slotsInSlotNodes = slotInSlot.assignedNodes();
|
|
4464
|
-
return slotsInSlotNodes.some((ss) => Boolean(ss.textContent.trim()));
|
|
4465
|
-
});
|
|
4466
|
-
} else {
|
|
4467
|
-
this.hasTriggerContent = false;
|
|
4468
|
-
}
|
|
4469
|
-
}
|
|
4470
|
-
|
|
4471
|
-
/**
|
|
4472
|
-
* Handles the default slot change event and updates the content.
|
|
4473
|
-
*
|
|
4474
|
-
* This method retrieves all nodes assigned to the default slot of the event target and appends them
|
|
4475
|
-
* to the `bibContent` element. If a callback function `onSlotChange` is defined, it is invoked to
|
|
4476
|
-
* notify about the slot change.
|
|
4477
|
-
*
|
|
4478
|
-
* @private
|
|
4479
|
-
* @method handleDefaultSlot
|
|
4480
|
-
* @param {Event} event - The event object representing the slot change.
|
|
4481
|
-
* @fires Function#onSlotChange - Optional callback invoked when the slot content changes.
|
|
4482
|
-
*/
|
|
4483
|
-
handleDefaultSlot(event) {
|
|
4484
|
-
[...event.target.assignedNodes()].forEach((node) => this.bibContent.append(node));
|
|
4485
|
-
|
|
4486
|
-
if (this.onSlotChange) {
|
|
4487
|
-
this.onSlotChange();
|
|
4488
|
-
}
|
|
4489
|
-
}
|
|
4490
|
-
|
|
4491
|
-
// function that renders the HTML and CSS into the scope of the component
|
|
4492
|
-
render() {
|
|
4493
|
-
return u$1`
|
|
4494
|
-
<div>
|
|
4495
|
-
<div
|
|
4496
|
-
id="trigger"
|
|
4497
|
-
class="trigger"
|
|
4498
|
-
part="trigger"
|
|
4499
|
-
role="button"
|
|
4500
|
-
aria-labelledby="triggerLabel"
|
|
4501
|
-
aria-controls="popover"
|
|
4502
|
-
tabindex="${this.tabIndex}"
|
|
4503
|
-
>
|
|
4504
|
-
<div class="triggerContentWrapper">
|
|
4505
|
-
<label class="label" id="triggerLabel" hasTrigger=${this.hasTriggerContent}>
|
|
4506
|
-
<slot name="label"></slot>
|
|
4507
|
-
</label>
|
|
4508
|
-
<div class="triggerContent">
|
|
4509
|
-
<slot
|
|
4510
|
-
name="trigger"
|
|
4511
|
-
@slotchange="${(event) => this.handleTriggerContentSlotChange(event)}"></slot>
|
|
4512
|
-
</div>
|
|
4513
|
-
</div>
|
|
4514
|
-
${this.chevron || this.common ? u$1`
|
|
4515
|
-
<div
|
|
4516
|
-
id="showStateIcon"
|
|
4517
|
-
part="chevron">
|
|
4518
|
-
<${this.iconTag}
|
|
4519
|
-
category="interface"
|
|
4520
|
-
name="chevron-down"
|
|
4521
|
-
customColor
|
|
4522
|
-
?disabled=${this.disabled}
|
|
4523
|
-
>
|
|
4524
|
-
</${this.iconTag}>
|
|
4525
|
-
</div>
|
|
4526
|
-
` : undefined }
|
|
4527
|
-
</div>
|
|
4528
|
-
<div
|
|
4529
|
-
class="helpText"
|
|
4530
|
-
part="helpText">
|
|
4531
|
-
<slot name="helpText"></slot>
|
|
4532
|
-
</div>
|
|
4533
|
-
<div class="slotContent">
|
|
4534
|
-
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
4535
|
-
</div>
|
|
4536
|
-
<div id="bibSizer" part="size"></div>
|
|
4537
|
-
<auro-dropdownbib
|
|
4538
|
-
id="bib"
|
|
4539
|
-
role="tooltip"
|
|
4540
|
-
?common="${this.common}"
|
|
4541
|
-
?rounded="${this.common || this.rounded}"
|
|
4542
|
-
?inset="${this.common || this.inset}">
|
|
4543
|
-
</auro-dropdownbib>
|
|
4544
|
-
</div>
|
|
4545
|
-
`;
|
|
4546
|
-
}
|
|
4547
|
-
}
|
|
4548
|
-
|
|
4549
|
-
AuroDropdown.register();
|
|
4550
|
-
|
|
4551
|
-
var dropdownVersion = '3.0.0';
|
|
4552
|
-
|
|
4553
|
-
var styleCss = i$b`:host{display:flex;flex-direction:column;gap:var(--ds-size-300, 1.5rem)}:host ::slotted(*:not(:first-child)){padding-top:var(--ds-size-300, 1.5rem);border-top-width:1px;border-top-style:solid}:host([isindropdown]){padding:var(--ds-size-300, 1.5rem)}`;
|
|
4554
|
-
|
|
4555
|
-
var colorCss = i$b`:host ::slotted(*:not(:first-child)){border-color:var(--ds-color-border-divider-default, rgba(0, 0, 0, 0.12))}`;
|
|
4556
|
-
|
|
4557
|
-
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
4558
|
-
// See LICENSE in the project root for license information.
|
|
4559
|
-
|
|
4560
|
-
|
|
4561
|
-
/**
|
|
4562
|
-
* Auro Counter Wrapper is a group of counter components.
|
|
4563
|
-
*
|
|
4564
|
-
* This web component provides a flexible interface for grouping multiple counters, supporting
|
|
4565
|
-
* validation, custom validity messages, and disabled states based on the group's value.
|
|
4566
|
-
*
|
|
4567
|
-
* @element auro-counter-group
|
|
4568
|
-
* @extends LitElement
|
|
4569
|
-
* @slot Default - Slot for counter elements.
|
|
4570
|
-
*/
|
|
4571
|
-
class AuroCounterWrapper extends r$4 {
|
|
4572
|
-
|
|
4573
|
-
static get styles() {
|
|
4574
|
-
return [
|
|
4575
|
-
colorCss,
|
|
4576
|
-
styleCss
|
|
4577
|
-
];
|
|
4578
|
-
}
|
|
4579
|
-
|
|
4580
|
-
/**
|
|
4581
|
-
* Registers the custom element with the browser.
|
|
4582
|
-
* @param {string} [name="auro-counter-wrapper"] - Custom element name to register.
|
|
4583
|
-
* @example
|
|
4584
|
-
* AuroCounterWrapper.register("custom-counter-wrapper") // registers <custom-counter-wrapper/>
|
|
4585
|
-
*/
|
|
4586
|
-
static register(name = "auro-counter-wrapper") {
|
|
4587
|
-
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroCounterWrapper);
|
|
4588
|
-
}
|
|
4589
|
-
|
|
4590
|
-
// function that renders the HTML and CSS into the scope of the component
|
|
4591
|
-
render() {
|
|
4592
|
-
return u$3`<slot></slot>`;
|
|
4593
|
-
}
|
|
4594
|
-
}
|
|
4595
|
-
|
|
4596
|
-
/* istanbul ignore else */
|
|
4597
|
-
// define the name of the custom component
|
|
4598
|
-
if (!customElements.get("auro-counter-wrapper")) {
|
|
4599
|
-
customElements.define("auro-counter-wrapper", AuroCounterWrapper);
|
|
4600
|
-
}
|
|
4601
|
-
|
|
4602
|
-
/* eslint-disable lit/no-invalid-html, lit/binding-positions */
|
|
4603
|
-
|
|
4604
|
-
|
|
4605
|
-
/**
|
|
4606
|
-
* Auro Counter Group is a group of counter components.
|
|
4607
|
-
*
|
|
4608
|
-
* This web component provides a flexible interface for grouping multiple counters, supporting
|
|
4609
|
-
* validation, custom validity messages, and disabled states based on the group's value.
|
|
4610
|
-
*
|
|
4611
|
-
* @element auro-counter-group
|
|
4612
|
-
* @extends LitElement
|
|
4613
|
-
* @slot Default - Slot for counter elements.
|
|
4614
|
-
*/
|
|
4615
|
-
class AuroCounterGroup extends r$4 {
|
|
4616
|
-
constructor() {
|
|
4617
|
-
super();
|
|
4618
|
-
|
|
4619
|
-
this.isDropdown = false;
|
|
4620
|
-
|
|
4621
|
-
this.max = undefined;
|
|
4622
|
-
this.min = undefined;
|
|
4623
|
-
this.total = undefined;
|
|
4624
|
-
this.validity = undefined;
|
|
4625
|
-
this.value = undefined;
|
|
4626
|
-
|
|
4627
|
-
/**
|
|
4628
|
-
* @private
|
|
4629
|
-
*/
|
|
4630
|
-
this.counters = undefined;
|
|
4631
|
-
|
|
4632
|
-
/**
|
|
4633
|
-
* @private
|
|
4634
|
-
*/
|
|
4635
|
-
this.validation = new AuroFormValidation();
|
|
1669
|
+
/**
|
|
1670
|
+
* @private
|
|
1671
|
+
*/
|
|
1672
|
+
this.validation = new AuroFormValidation();
|
|
4636
1673
|
|
|
4637
1674
|
/**
|
|
4638
1675
|
* Generate unique names for dependency components.
|
|
4639
1676
|
* @private
|
|
4640
1677
|
*/
|
|
4641
|
-
const versioning = new AuroDependencyVersioning
|
|
1678
|
+
const versioning = new AuroDependencyVersioning();
|
|
4642
1679
|
|
|
4643
1680
|
/**
|
|
4644
1681
|
* Dynamically generated dropdown tag.
|
|
@@ -4649,7 +1686,7 @@ class AuroCounterGroup extends r$4 {
|
|
|
4649
1686
|
}
|
|
4650
1687
|
|
|
4651
1688
|
static get styles() {
|
|
4652
|
-
return [styleCss$
|
|
1689
|
+
return [styleCss$1];
|
|
4653
1690
|
}
|
|
4654
1691
|
|
|
4655
1692
|
static get properties() {
|
|
@@ -4821,20 +1858,20 @@ class AuroCounterGroup extends r$4 {
|
|
|
4821
1858
|
* AuroCounterGroup.register("custom-counter-group") // registers <custom-counter-group/>
|
|
4822
1859
|
*/
|
|
4823
1860
|
static register(name = "auro-counter-group") {
|
|
4824
|
-
AuroLibraryRuntimeUtils
|
|
1861
|
+
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroCounterGroup);
|
|
4825
1862
|
}
|
|
4826
1863
|
|
|
4827
1864
|
// function that renders the HTML and CSS into the scope of the component
|
|
4828
1865
|
render() {
|
|
4829
|
-
return u
|
|
1866
|
+
return u`
|
|
4830
1867
|
${this.isDropdown
|
|
4831
|
-
? u
|
|
1868
|
+
? u`<${this.dropdownTag} common chevron>
|
|
4832
1869
|
<div slot="trigger">${this.total}<slot name="placeholder"></slot></div>
|
|
4833
1870
|
<auro-counter-wrapper isInDropdown>
|
|
4834
1871
|
</auro-counter-wrapper>
|
|
4835
1872
|
</${this.dropdownTag}>
|
|
4836
1873
|
<slot @slotchange=${() => this.configureDropdownCounters()}></slot>`
|
|
4837
|
-
: u
|
|
1874
|
+
: u`<auro-counter-wrapper><slot @slotchange=${() => this.configureCounters()}></slot></auro-counter-wrapper>`
|
|
4838
1875
|
}`;
|
|
4839
1876
|
}
|
|
4840
1877
|
}
|