@nanoporetech-digital/components 2.10.1 → 2.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +58 -0
- package/dist/cjs/{date-utils-0ae9a12d.js → date-utils-b3af910d.js} +2 -2
- package/dist/cjs/date-utils-b3af910d.js.map +1 -0
- package/dist/cjs/{global-0d4f3b77.js → global-989678ec.js} +1 -8
- package/dist/cjs/global-989678ec.js.map +1 -0
- package/dist/cjs/index.cjs.js +2 -0
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/nano-algolia.cjs.entry.js +5 -1
- package/dist/cjs/nano-algolia.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-components.cjs.js +2 -2
- package/dist/cjs/nano-datalist_3.cjs.entry.js +3 -1
- package/dist/cjs/nano-datalist_3.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-date-input.cjs.entry.js +16 -5
- package/dist/cjs/nano-date-input.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-date-picker.cjs.entry.js +2 -2
- package/dist/cjs/nano-date-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-details.cjs.entry.js +1 -2
- package/dist/cjs/nano-details.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-field-validator.cjs.entry.js +292 -96
- package/dist/cjs/nano-field-validator.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-file-upload.cjs.entry.js +5 -2
- package/dist/cjs/nano-file-upload.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-global-search-results.cjs.entry.js +21 -6
- package/dist/cjs/nano-global-search-results.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-grid_3.cjs.entry.js +1 -2
- package/dist/cjs/nano-grid_3.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-icon-button.cjs.entry.js +4 -0
- package/dist/cjs/nano-icon-button.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-input.cjs.entry.js +16 -3
- package/dist/cjs/nano-input.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-nav-item_2.cjs.entry.js +2 -0
- package/dist/cjs/nano-nav-item_2.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-resize-observe_2.cjs.entry.js +1 -2
- package/dist/cjs/nano-resize-observe_2.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-slides.cjs.entry.js +1 -2
- package/dist/cjs/nano-slides.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-sticker.cjs.entry.js +2 -3
- package/dist/cjs/nano-sticker.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-tab-group.cjs.entry.js +4 -2
- package/dist/cjs/nano-tab-group.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-tab.cjs.entry.js +5 -1
- package/dist/cjs/nano-tab.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/nano-tooltip.cjs.entry.js.map +1 -1
- package/dist/collection/components/accordion/accordion.js +1 -1
- package/dist/collection/components/alert/alert.js +1 -1
- package/dist/collection/components/algolia/algolia-filter.js +2 -2
- package/dist/collection/components/algolia/algolia-input.js +5 -5
- package/dist/collection/components/algolia/algolia-results.js +1 -1
- package/dist/collection/components/algolia/algolia.js +12 -6
- package/dist/collection/components/algolia/algolia.js.map +1 -1
- package/dist/collection/components/checkbox/checkbox-group.js +2 -2
- package/dist/collection/components/checkbox/checkbox.js +3 -3
- package/dist/collection/components/datalist/datalist.js +4 -2
- package/dist/collection/components/datalist/datalist.js.map +1 -1
- package/dist/collection/components/date-input/date-input.js +65 -11
- package/dist/collection/components/date-input/date-input.js.map +1 -1
- package/dist/collection/components/date-picker/date-picker.css +1 -1
- package/dist/collection/components/date-picker/date-picker.js +5 -5
- package/dist/collection/components/details/details.js +1 -2
- package/dist/collection/components/details/details.js.map +1 -1
- package/dist/collection/components/dialog/dialog.js +1 -1
- package/dist/collection/components/dropdown/dropdown.js +1 -1
- package/dist/collection/components/field-validator/field-validator-interface.js +5 -0
- package/dist/collection/components/field-validator/field-validator-interface.js.map +1 -0
- package/dist/collection/components/field-validator/field-validator.js +434 -113
- package/dist/collection/components/field-validator/field-validator.js.map +1 -1
- package/dist/collection/components/file-upload/file-upload.css +0 -1
- package/dist/collection/components/file-upload/file-upload.js +10 -7
- package/dist/collection/components/file-upload/file-upload.js.map +1 -1
- package/dist/collection/components/global-nav/global-nav.js +4 -4
- package/dist/collection/components/global-search-results/global-search-results.css +7 -0
- package/dist/collection/components/global-search-results/global-search-results.js +19 -4
- package/dist/collection/components/global-search-results/global-search-results.js.map +1 -1
- package/dist/collection/components/grid/grid-item.js +1 -1
- package/dist/collection/components/grid/grid.js +0 -1
- package/dist/collection/components/grid/grid.js.map +1 -1
- package/dist/collection/components/icon/icon.js +1 -1
- package/dist/collection/components/icon-button/icon-button.js +23 -1
- package/dist/collection/components/icon-button/icon-button.js.map +1 -1
- package/dist/collection/components/input/input.js +37 -8
- package/dist/collection/components/input/input.js.map +1 -1
- package/dist/collection/components/nav-item/nav-item.js +4 -4
- package/dist/collection/components/range/range.js +4 -4
- package/dist/collection/components/resize-observe/resize-observe.js +1 -2
- package/dist/collection/components/resize-observe/resize-observe.js.map +1 -1
- package/dist/collection/components/select/select.js +9 -7
- package/dist/collection/components/select/select.js.map +1 -1
- package/dist/collection/components/slides/slides.js +7 -8
- package/dist/collection/components/slides/slides.js.map +1 -1
- package/dist/collection/components/sticker/sticker.js +0 -1
- package/dist/collection/components/sticker/sticker.js.map +1 -1
- package/dist/collection/components/tabs/tab-group.js +5 -3
- package/dist/collection/components/tabs/tab-group.js.map +1 -1
- package/dist/collection/components/tabs/tab.js +5 -1
- package/dist/collection/components/tabs/tab.js.map +1 -1
- package/dist/collection/components/tooltip/tooltip.css +0 -1
- package/dist/collection/global/script/global.js +0 -7
- package/dist/collection/global/script/global.js.map +1 -1
- package/dist/collection/index.js +1 -0
- package/dist/collection/index.js.map +1 -1
- package/dist/collection/utils/date-utils.js +1 -1
- package/dist/collection/utils/date-utils.js.map +1 -1
- package/dist/components/algolia.js +5 -1
- package/dist/components/algolia.js.map +1 -1
- package/dist/components/datalist.js +3 -1
- package/dist/components/datalist.js.map +1 -1
- package/dist/components/date-picker.js +2 -2
- package/dist/components/date-picker.js.map +1 -1
- package/dist/components/grid.js +1 -2
- package/dist/components/grid.js.map +1 -1
- package/dist/components/icon-button.js +6 -1
- package/dist/components/icon-button.js.map +1 -1
- package/dist/components/index.js +1 -7
- package/dist/components/index.js.map +1 -1
- package/dist/components/input.js +17 -3
- package/dist/components/input.js.map +1 -1
- package/dist/components/nano-date-input.js +17 -4
- package/dist/components/nano-date-input.js.map +1 -1
- package/dist/components/nano-details.js +1 -2
- package/dist/components/nano-details.js.map +1 -1
- package/dist/components/nano-field-validator.js +300 -99
- package/dist/components/nano-field-validator.js.map +1 -1
- package/dist/components/nano-file-upload.js +6 -3
- package/dist/components/nano-file-upload.js.map +1 -1
- package/dist/components/nano-global-search-results.js +21 -6
- package/dist/components/nano-global-search-results.js.map +1 -1
- package/dist/components/nano-slides.js +1 -2
- package/dist/components/nano-slides.js.map +1 -1
- package/dist/components/nano-tab-group.js +4 -2
- package/dist/components/nano-tab-group.js.map +1 -1
- package/dist/components/nano-tab.js +5 -1
- package/dist/components/nano-tab.js.map +1 -1
- package/dist/components/resize-observe.js +1 -2
- package/dist/components/resize-observe.js.map +1 -1
- package/dist/components/select.js +2 -0
- package/dist/components/select.js.map +1 -1
- package/dist/components/sticker.js +2 -3
- package/dist/components/sticker.js.map +1 -1
- package/dist/components/tooltip.js +1 -1
- package/dist/components/tooltip.js.map +1 -1
- package/dist/custom-elements/index.js +386 -2046
- package/dist/custom-elements/index.js.map +1 -1
- package/dist/esm/{date-utils-e4b757ff.js → date-utils-839cb010.js} +2 -2
- package/dist/esm/date-utils-839cb010.js.map +1 -0
- package/dist/esm/{global-d5ec4d53.js → global-8047b4ff.js} +1 -8
- package/dist/esm/global-8047b4ff.js.map +1 -0
- package/dist/esm/index.js +1 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +2 -2
- package/dist/esm/nano-algolia.entry.js +5 -1
- package/dist/esm/nano-algolia.entry.js.map +1 -1
- package/dist/esm/nano-components.js +2 -2
- package/dist/esm/nano-datalist_3.entry.js +3 -1
- package/dist/esm/nano-datalist_3.entry.js.map +1 -1
- package/dist/esm/nano-date-input.entry.js +16 -5
- package/dist/esm/nano-date-input.entry.js.map +1 -1
- package/dist/esm/nano-date-picker.entry.js +2 -2
- package/dist/esm/nano-date-picker.entry.js.map +1 -1
- package/dist/esm/nano-details.entry.js +1 -2
- package/dist/esm/nano-details.entry.js.map +1 -1
- package/dist/esm/nano-field-validator.entry.js +292 -96
- package/dist/esm/nano-field-validator.entry.js.map +1 -1
- package/dist/esm/nano-file-upload.entry.js +5 -2
- package/dist/esm/nano-file-upload.entry.js.map +1 -1
- package/dist/esm/nano-global-search-results.entry.js +21 -6
- package/dist/esm/nano-global-search-results.entry.js.map +1 -1
- package/dist/esm/nano-grid_3.entry.js +1 -2
- package/dist/esm/nano-grid_3.entry.js.map +1 -1
- package/dist/esm/nano-icon-button.entry.js +4 -0
- package/dist/esm/nano-icon-button.entry.js.map +1 -1
- package/dist/esm/nano-input.entry.js +16 -3
- package/dist/esm/nano-input.entry.js.map +1 -1
- package/dist/esm/nano-nav-item_2.entry.js +2 -0
- package/dist/esm/nano-nav-item_2.entry.js.map +1 -1
- package/dist/esm/nano-resize-observe_2.entry.js +1 -2
- package/dist/esm/nano-resize-observe_2.entry.js.map +1 -1
- package/dist/esm/nano-slides.entry.js +1 -2
- package/dist/esm/nano-slides.entry.js.map +1 -1
- package/dist/esm/nano-sticker.entry.js +2 -3
- package/dist/esm/nano-sticker.entry.js.map +1 -1
- package/dist/esm/nano-tab-group.entry.js +4 -2
- package/dist/esm/nano-tab-group.entry.js.map +1 -1
- package/dist/esm/nano-tab.entry.js +5 -1
- package/dist/esm/nano-tab.entry.js.map +1 -1
- package/dist/esm/nano-tooltip.entry.js +1 -1
- package/dist/esm/nano-tooltip.entry.js.map +1 -1
- package/dist/esm-es5/date-utils-839cb010.js +5 -0
- package/dist/esm-es5/date-utils-839cb010.js.map +1 -0
- package/dist/esm-es5/{global-d5ec4d53.js → global-8047b4ff.js} +2 -2
- package/dist/esm-es5/global-8047b4ff.js.map +1 -0
- package/dist/esm-es5/index.js +2 -2
- package/dist/esm-es5/index.js.map +1 -1
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/loader.js.map +1 -1
- package/dist/esm-es5/nano-algolia.entry.js +1 -1
- package/dist/esm-es5/nano-algolia.entry.js.map +1 -1
- package/dist/esm-es5/nano-components.js +1 -1
- package/dist/esm-es5/nano-components.js.map +1 -1
- package/dist/esm-es5/nano-datalist_3.entry.js +1 -1
- package/dist/esm-es5/nano-datalist_3.entry.js.map +1 -1
- package/dist/esm-es5/nano-date-input.entry.js +1 -1
- package/dist/esm-es5/nano-date-input.entry.js.map +1 -1
- package/dist/esm-es5/nano-date-picker.entry.js +1 -1
- package/dist/esm-es5/nano-date-picker.entry.js.map +1 -1
- package/dist/esm-es5/nano-details.entry.js +1 -1
- package/dist/esm-es5/nano-details.entry.js.map +1 -1
- package/dist/esm-es5/nano-field-validator.entry.js +2 -2
- package/dist/esm-es5/nano-field-validator.entry.js.map +1 -1
- package/dist/esm-es5/nano-file-upload.entry.js +1 -1
- package/dist/esm-es5/nano-file-upload.entry.js.map +1 -1
- package/dist/esm-es5/nano-global-search-results.entry.js +1 -1
- package/dist/esm-es5/nano-global-search-results.entry.js.map +1 -1
- package/dist/esm-es5/nano-grid_3.entry.js +1 -1
- package/dist/esm-es5/nano-grid_3.entry.js.map +1 -1
- package/dist/esm-es5/nano-icon-button.entry.js +2 -2
- package/dist/esm-es5/nano-icon-button.entry.js.map +1 -1
- package/dist/esm-es5/nano-input.entry.js +1 -1
- package/dist/esm-es5/nano-input.entry.js.map +1 -1
- package/dist/esm-es5/nano-nav-item_2.entry.js +1 -1
- package/dist/esm-es5/nano-nav-item_2.entry.js.map +1 -1
- package/dist/esm-es5/nano-resize-observe_2.entry.js +1 -1
- package/dist/esm-es5/nano-resize-observe_2.entry.js.map +1 -1
- package/dist/esm-es5/nano-slides.entry.js +2 -2
- package/dist/esm-es5/nano-slides.entry.js.map +1 -1
- package/dist/esm-es5/nano-sticker.entry.js +1 -1
- package/dist/esm-es5/nano-sticker.entry.js.map +1 -1
- package/dist/esm-es5/nano-tab-group.entry.js +2 -2
- package/dist/esm-es5/nano-tab-group.entry.js.map +1 -1
- package/dist/esm-es5/nano-tab.entry.js +2 -2
- package/dist/esm-es5/nano-tab.entry.js.map +1 -1
- package/dist/esm-es5/nano-tooltip.entry.js +1 -1
- package/dist/esm-es5/nano-tooltip.entry.js.map +1 -1
- package/dist/nano-components/index.esm.js +1 -1
- package/dist/nano-components/index.esm.js.map +1 -1
- package/dist/nano-components/nano-components.esm.js +1 -1
- package/dist/nano-components/nano-components.esm.js.map +1 -1
- package/dist/nano-components/nano-components.js +1 -1
- package/dist/nano-components/p-018b7047.entry.js +5 -0
- package/dist/nano-components/p-018b7047.entry.js.map +1 -0
- package/dist/nano-components/p-0193a282.entry.js +5 -0
- package/dist/nano-components/p-0193a282.entry.js.map +1 -0
- package/dist/nano-components/p-0320410c.entry.js +5 -0
- package/dist/nano-components/p-0320410c.entry.js.map +1 -0
- package/dist/nano-components/p-0d699368.system.js +5 -0
- package/dist/nano-components/{p-3258c568.system.js.map → p-0d699368.system.js.map} +1 -1
- package/dist/nano-components/p-18863670.system.entry.js +5 -0
- package/dist/nano-components/p-18863670.system.entry.js.map +1 -0
- package/dist/nano-components/p-32900c91.entry.js +5 -0
- package/dist/nano-components/p-32900c91.entry.js.map +1 -0
- package/dist/nano-components/p-33fce1a6.js +5 -0
- package/dist/nano-components/p-33fce1a6.js.map +1 -0
- package/dist/nano-components/p-371aebe7.system.entry.js +23 -0
- package/dist/nano-components/p-371aebe7.system.entry.js.map +1 -0
- package/dist/nano-components/p-41899a31.system.entry.js +5 -0
- package/dist/nano-components/p-41899a31.system.entry.js.map +1 -0
- package/dist/nano-components/p-53957ec6.system.js +5 -0
- package/dist/nano-components/{p-e7140887.system.js.map → p-53957ec6.system.js.map} +1 -1
- package/dist/nano-components/p-561500f0.system.entry.js +5 -0
- package/dist/nano-components/p-561500f0.system.entry.js.map +1 -0
- package/dist/nano-components/p-596c1711.system.entry.js +5 -0
- package/dist/nano-components/p-596c1711.system.entry.js.map +1 -0
- package/dist/nano-components/{p-01667573.entry.js → p-634a58f7.entry.js} +2 -2
- package/dist/nano-components/p-634a58f7.entry.js.map +1 -0
- package/dist/nano-components/p-6a949280.system.entry.js +5 -0
- package/dist/nano-components/p-6a949280.system.entry.js.map +1 -0
- package/dist/nano-components/{p-bf9aa89d.system.entry.js → p-6af10533.system.entry.js} +3 -3
- package/dist/nano-components/p-6af10533.system.entry.js.map +1 -0
- package/dist/nano-components/p-70272eae.js +5 -0
- package/dist/nano-components/p-70272eae.js.map +1 -0
- package/dist/nano-components/p-755d9227.entry.js +5 -0
- package/dist/nano-components/p-755d9227.entry.js.map +1 -0
- package/dist/nano-components/p-7bd25494.entry.js +5 -0
- package/dist/nano-components/p-7bd25494.entry.js.map +1 -0
- package/dist/nano-components/p-7c837460.entry.js +5 -0
- package/dist/nano-components/p-7c837460.entry.js.map +1 -0
- package/dist/nano-components/p-7f051c20.entry.js +5 -0
- package/dist/nano-components/p-7f051c20.entry.js.map +1 -0
- package/dist/nano-components/{p-93880c28.system.js → p-82e28afd.system.js} +2 -2
- package/dist/nano-components/p-82e28afd.system.js.map +1 -0
- package/dist/nano-components/p-8378428e.system.js +5 -0
- package/dist/nano-components/p-8378428e.system.js.map +1 -0
- package/dist/nano-components/p-8df4f125.system.entry.js +5 -0
- package/dist/nano-components/p-8df4f125.system.entry.js.map +1 -0
- package/dist/nano-components/{p-d0385948.system.entry.js → p-93596c3d.system.entry.js} +2 -2
- package/dist/nano-components/p-93596c3d.system.entry.js.map +1 -0
- package/dist/nano-components/{p-3e930ac7.entry.js → p-9d9b0b66.entry.js} +2 -2
- package/dist/nano-components/p-9d9b0b66.entry.js.map +1 -0
- package/dist/nano-components/p-9ffdf6cc.entry.js +5 -0
- package/dist/nano-components/{p-222d8095.entry.js.map → p-9ffdf6cc.entry.js.map} +1 -1
- package/dist/nano-components/p-a07cf44c.system.entry.js +5 -0
- package/dist/nano-components/p-a07cf44c.system.entry.js.map +1 -0
- package/dist/nano-components/p-a1444980.entry.js +5 -0
- package/dist/nano-components/p-a1444980.entry.js.map +1 -0
- package/dist/nano-components/p-aa84c727.system.entry.js +5 -0
- package/dist/nano-components/p-aa84c727.system.entry.js.map +1 -0
- package/dist/nano-components/p-ac5e3775.system.entry.js +5 -0
- package/dist/nano-components/p-ac5e3775.system.entry.js.map +1 -0
- package/dist/nano-components/p-b85cf493.system.entry.js +5 -0
- package/dist/nano-components/{p-e817ab4a.system.entry.js.map → p-b85cf493.system.entry.js.map} +1 -1
- package/dist/nano-components/{p-96d9b8b9.system.entry.js → p-c2bbf0fb.system.entry.js} +2 -2
- package/dist/nano-components/p-c2bbf0fb.system.entry.js.map +1 -0
- package/dist/nano-components/{p-f780d2f6.system.entry.js → p-cb512cff.system.entry.js} +2 -2
- package/dist/nano-components/p-cb512cff.system.entry.js.map +1 -0
- package/dist/nano-components/{p-4e2c0abb.entry.js → p-ccd6c206.entry.js} +2 -2
- package/dist/nano-components/p-ccd6c206.entry.js.map +1 -0
- package/dist/nano-components/{p-1030797a.entry.js → p-d37e1489.entry.js} +2 -2
- package/dist/nano-components/p-d37e1489.entry.js.map +1 -0
- package/dist/nano-components/p-da88981f.entry.js +23 -0
- package/dist/nano-components/p-da88981f.entry.js.map +1 -0
- package/dist/nano-components/p-e8a913ac.system.entry.js +5 -0
- package/dist/nano-components/p-e8a913ac.system.entry.js.map +1 -0
- package/dist/nano-components/p-e9fddc1a.entry.js +5 -0
- package/dist/nano-components/p-e9fddc1a.entry.js.map +1 -0
- package/dist/nano-components/p-ea54ee12.entry.js +5 -0
- package/dist/nano-components/p-ea54ee12.entry.js.map +1 -0
- package/dist/nano-components/{p-86bd5194.entry.js → p-ed0bdea9.entry.js} +2 -2
- package/dist/nano-components/p-ed0bdea9.entry.js.map +1 -0
- package/dist/nano-components/p-faba2fc1.system.entry.js +5 -0
- package/dist/nano-components/p-faba2fc1.system.entry.js.map +1 -0
- package/dist/nano-components/p-ff026352.system.entry.js +5 -0
- package/dist/nano-components/p-ff026352.system.entry.js.map +1 -0
- package/dist/themes/nanopore.css +1 -1
- package/dist/themes/nanopore.css.map +1 -1
- package/dist/types/components/algolia/algolia.d.ts +1 -0
- package/dist/types/components/date-input/date-input.d.ts +6 -1
- package/dist/types/components/field-validator/field-validator-interface.d.ts +19 -0
- package/dist/types/components/field-validator/field-validator.d.ts +77 -31
- package/dist/types/components/file-upload/file-upload.d.ts +2 -1
- package/dist/types/components/global-search-results/global-search-results.d.ts +1 -0
- package/dist/types/components/icon-button/icon-button.d.ts +2 -0
- package/dist/types/components/input/input.d.ts +6 -1
- package/dist/types/components/tabs/tab.d.ts +1 -0
- package/dist/types/components.d.ts +67 -12
- package/dist/types/index.d.ts +1 -0
- package/dist/types/interface.d.ts +1 -0
- package/docs-json.json +161 -13
- package/docs-vscode.json +6 -2
- package/package.json +2 -4
- package/dist/cjs/ResizeObserver.es-09b81a1b.js +0 -935
- package/dist/cjs/ResizeObserver.es-09b81a1b.js.map +0 -1
- package/dist/cjs/date-utils-0ae9a12d.js.map +0 -1
- package/dist/cjs/global-0d4f3b77.js.map +0 -1
- package/dist/cjs/intersection-observer-1822c787.js +0 -987
- package/dist/cjs/intersection-observer-1822c787.js.map +0 -1
- package/dist/components/ResizeObserver.es.js +0 -933
- package/dist/components/ResizeObserver.es.js.map +0 -1
- package/dist/components/intersection-observer.js +0 -985
- package/dist/components/intersection-observer.js.map +0 -1
- package/dist/esm/ResizeObserver.es-724af9fd.js +0 -933
- package/dist/esm/ResizeObserver.es-724af9fd.js.map +0 -1
- package/dist/esm/date-utils-e4b757ff.js.map +0 -1
- package/dist/esm/global-d5ec4d53.js.map +0 -1
- package/dist/esm/intersection-observer-dff9fb5b.js +0 -985
- package/dist/esm/intersection-observer-dff9fb5b.js.map +0 -1
- package/dist/esm-es5/ResizeObserver.es-724af9fd.js +0 -5
- package/dist/esm-es5/ResizeObserver.es-724af9fd.js.map +0 -1
- package/dist/esm-es5/date-utils-e4b757ff.js +0 -5
- package/dist/esm-es5/date-utils-e4b757ff.js.map +0 -1
- package/dist/esm-es5/global-d5ec4d53.js.map +0 -1
- package/dist/esm-es5/intersection-observer-dff9fb5b.js +0 -5
- package/dist/esm-es5/intersection-observer-dff9fb5b.js.map +0 -1
- package/dist/nano-components/p-00eaa36a.entry.js +0 -5
- package/dist/nano-components/p-00eaa36a.entry.js.map +0 -1
- package/dist/nano-components/p-01667573.entry.js.map +0 -1
- package/dist/nano-components/p-1030797a.entry.js.map +0 -1
- package/dist/nano-components/p-11a2dcce.js +0 -5
- package/dist/nano-components/p-11a2dcce.js.map +0 -1
- package/dist/nano-components/p-1a30dfdd.system.entry.js +0 -5
- package/dist/nano-components/p-1a30dfdd.system.entry.js.map +0 -1
- package/dist/nano-components/p-1b120f53.entry.js +0 -5
- package/dist/nano-components/p-1b120f53.entry.js.map +0 -1
- package/dist/nano-components/p-21d6d31e.system.entry.js +0 -5
- package/dist/nano-components/p-21d6d31e.system.entry.js.map +0 -1
- package/dist/nano-components/p-222d8095.entry.js +0 -5
- package/dist/nano-components/p-241d90eb.system.entry.js +0 -5
- package/dist/nano-components/p-241d90eb.system.entry.js.map +0 -1
- package/dist/nano-components/p-2c8d7273.entry.js +0 -5
- package/dist/nano-components/p-2c8d7273.entry.js.map +0 -1
- package/dist/nano-components/p-3093915f.entry.js +0 -5
- package/dist/nano-components/p-3093915f.entry.js.map +0 -1
- package/dist/nano-components/p-3258c568.system.js +0 -5
- package/dist/nano-components/p-325c1cad.entry.js +0 -5
- package/dist/nano-components/p-325c1cad.entry.js.map +0 -1
- package/dist/nano-components/p-32f396c0.system.entry.js +0 -5
- package/dist/nano-components/p-32f396c0.system.entry.js.map +0 -1
- package/dist/nano-components/p-35108e08.entry.js +0 -5
- package/dist/nano-components/p-35108e08.entry.js.map +0 -1
- package/dist/nano-components/p-3ccb176c.system.entry.js +0 -5
- package/dist/nano-components/p-3ccb176c.system.entry.js.map +0 -1
- package/dist/nano-components/p-3e930ac7.entry.js.map +0 -1
- package/dist/nano-components/p-42cebbfe.system.entry.js +0 -5
- package/dist/nano-components/p-42cebbfe.system.entry.js.map +0 -1
- package/dist/nano-components/p-4e2c0abb.entry.js.map +0 -1
- package/dist/nano-components/p-5d17cfbb.system.entry.js +0 -23
- package/dist/nano-components/p-5d17cfbb.system.entry.js.map +0 -1
- package/dist/nano-components/p-5d5ea4ab.system.entry.js +0 -5
- package/dist/nano-components/p-5d5ea4ab.system.entry.js.map +0 -1
- package/dist/nano-components/p-6722447c.entry.js +0 -5
- package/dist/nano-components/p-6722447c.entry.js.map +0 -1
- package/dist/nano-components/p-6d138abf.entry.js +0 -5
- package/dist/nano-components/p-6d138abf.entry.js.map +0 -1
- package/dist/nano-components/p-76d9d1d4.entry.js +0 -5
- package/dist/nano-components/p-76d9d1d4.entry.js.map +0 -1
- package/dist/nano-components/p-866f083f.system.entry.js +0 -5
- package/dist/nano-components/p-866f083f.system.entry.js.map +0 -1
- package/dist/nano-components/p-86bd5194.entry.js.map +0 -1
- package/dist/nano-components/p-88779174.system.entry.js +0 -5
- package/dist/nano-components/p-88779174.system.entry.js.map +0 -1
- package/dist/nano-components/p-93880c28.system.js.map +0 -1
- package/dist/nano-components/p-96d9b8b9.system.entry.js.map +0 -1
- package/dist/nano-components/p-97b13ad2.entry.js +0 -5
- package/dist/nano-components/p-97b13ad2.entry.js.map +0 -1
- package/dist/nano-components/p-b430a9b6.system.js +0 -5
- package/dist/nano-components/p-b430a9b6.system.js.map +0 -1
- package/dist/nano-components/p-bc394857.system.entry.js +0 -5
- package/dist/nano-components/p-bc394857.system.entry.js.map +0 -1
- package/dist/nano-components/p-bf9aa89d.system.entry.js.map +0 -1
- package/dist/nano-components/p-c3830c43.entry.js +0 -5
- package/dist/nano-components/p-c3830c43.entry.js.map +0 -1
- package/dist/nano-components/p-d0385948.system.entry.js.map +0 -1
- package/dist/nano-components/p-debd9efc.js +0 -5
- package/dist/nano-components/p-debd9efc.js.map +0 -1
- package/dist/nano-components/p-e195ab77.system.js +0 -5
- package/dist/nano-components/p-e195ab77.system.js.map +0 -1
- package/dist/nano-components/p-e7140887.system.js +0 -5
- package/dist/nano-components/p-e817ab4a.system.entry.js +0 -5
- package/dist/nano-components/p-f5d4d13b.system.js +0 -5
- package/dist/nano-components/p-f5d4d13b.system.js.map +0 -1
- package/dist/nano-components/p-f66958c1.js +0 -5
- package/dist/nano-components/p-f66958c1.js.map +0 -1
- package/dist/nano-components/p-f710c763.system.entry.js +0 -5
- package/dist/nano-components/p-f710c763.system.entry.js.map +0 -1
- package/dist/nano-components/p-f780d2f6.system.entry.js.map +0 -1
- package/dist/nano-components/p-f9c7d961.js +0 -5
- package/dist/nano-components/p-f9c7d961.js.map +0 -1
- package/dist/nano-components/p-ffc2063a.entry.js +0 -23
- package/dist/nano-components/p-ffc2063a.entry.js.map +0 -1
- package/dist/nano-components/p-fff27907.system.entry.js +0 -5
- package/dist/nano-components/p-fff27907.system.entry.js.map +0 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"names":["getDynamicImportFunction","namespace","replace","patchBrowser","plt","$cssShim$","win","__cssshim","patchCloneNodeFix","H","prototype","scriptElm","Array","from","doc","querySelectorAll","find","s","RegExp","NAMESPACE","test","src","getAttribute","opts","history","scrollRestoration","then","resourcesUrl","URL","location","href","patchDynamicImport","customElements","import","promiseResolve","base","orgScriptElm","importFunctionName","Function","Math","random","e","moduleMap_1","Map","url","mod","get","script_1","createElement","type","crossOrigin","createObjectURL","Blob","Promise","resolve","onload","m","remove","set","head","appendChild","HTMLElementPrototype","nativeCloneNodeFn","cloneNode","deep","this","nodeName","call","clonedNode","srcChildNodes","childNodes","i","length","nodeType","options","bootstrapLazy","JSON","parse"],"mappings":";;;iJAKA,IAAMA,yBAA2B,SAACC,GAAc,MAAA,eAAeA,EAAUC,QAAQ,QAAS,MAC1F,IAAMC,aAAe,WAKK,CAElBC,IAAIC,UAAYC,IAAIC,UAEA,CAEpBC,kBAAkBC,EAAEC,WAUxB,IAAMC,EACAC,MAAMC,KAAKC,IAAIC,iBAAiB,WAAWC,MAAK,SAACC,GAAM,OAAA,IAAIC,OAAO,IAAKC,UAAS,2BAA2BC,KAAKH,EAAEI,MAChHJ,EAAEK,aAAa,4BAA8BH,aAGrD,IAAMI,EAA6D,GACnE,GAAsB,iBAAkBZ,IAAca,QAAQC,kBAAsC,CAQhG,MAAO,CACHC,KAAI,cAQwC,CAChDH,EAAKI,aAAe,IAAIC,IAAI,IAAK,IAAIA,IAAIjB,EAAUW,aAAa,uBAAyBX,EAAUU,IAAKf,IAAIuB,SAASC,OAAOA,KAC/F,CACzBC,mBAAmBR,EAAKI,aAAchB,GAE1C,IAAgCL,IAAI0B,eAAgB,CAGhD,OAAOC,OAA+C,qBAAYP,MAAK,WAAM,OAAAH,MAGrF,OAAOW,eAAeX,IAE1B,IAAMQ,mBAAqB,SAACI,EAAMC,GAC9B,IAAMC,EAAqBrC,yBAAyBmB,WACpD,IAKIb,IAAI+B,GAAsB,IAAIC,SAAS,IAAK,sBAAsBC,KAAKC,UAE3E,MAAOC,GAIH,IAAMC,EAAY,IAAIC,IACtBrC,IAAI+B,GAAsB,SAAChB,GACvB,IAAMuB,EAAM,IAAIhB,IAAIP,EAAKc,GAAML,KAC/B,IAAIe,EAAMH,EAAUI,IAAIF,GACxB,IAAKC,EAAK,CACN,IAAME,EAASjC,IAAIkC,cAAc,UACjCD,EAAOE,KAAO,SACdF,EAAOG,YAAcd,EAAac,YAClCH,EAAO1B,IAAMO,IAAIuB,gBAAgB,IAAIC,KAAK,CAAC,uBAAuBR,EAAG,aAAaP,EAAkB,WAAY,CAC5GY,KAAM,4BAEVJ,EAAM,IAAIQ,SAAQ,SAACC,GACfP,EAAOQ,OAAS,WACZD,EAAQhD,IAAI+B,GAAoBmB,GAChCT,EAAOU,aAGff,EAAUgB,IAAId,EAAKC,GACnB/B,IAAI6C,KAAKC,YAAYb,GAEzB,OAAOF,KAInB,IAAMrC,kBAAoB,SAACqD,GACvB,IAAMC,EAAoBD,EAAqBE,UAC/CF,EAAqBE,UAAY,SAAUC,GACvC,GAAIC,KAAKC,WAAa,WAAY,CAC9B,OAAOJ,EAAkBK,KAAKF,KAAMD,GAExC,IAAMI,EAAaN,EAAkBK,KAAKF,KAAM,OAChD,IAAMI,EAAgBJ,KAAKK,WAC3B,GAAIN,EAAM,CACN,IAAK,IAAIO,EAAI,EAAGA,EAAIF,EAAcG,OAAQD,IAAK,CAE3C,GAAIF,EAAcE,GAAGE,WAAa,EAAG,CACjCL,EAAWR,YAAYS,EAAcE,GAAGR,UAAU,SAI9D,OAAOK,ICjHfjE,eAAeuB,MAAK,SAAAgD,GAElB,OAAOC,cAAcC,KAAAC,MAAA,
|
1
|
+
{"version":3,"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"names":["getDynamicImportFunction","namespace","replace","patchBrowser","plt","$cssShim$","win","__cssshim","patchCloneNodeFix","H","prototype","scriptElm","Array","from","doc","querySelectorAll","find","s","RegExp","NAMESPACE","test","src","getAttribute","opts","history","scrollRestoration","then","resourcesUrl","URL","location","href","patchDynamicImport","customElements","import","promiseResolve","base","orgScriptElm","importFunctionName","Function","Math","random","e","moduleMap_1","Map","url","mod","get","script_1","createElement","type","crossOrigin","createObjectURL","Blob","Promise","resolve","onload","m","remove","set","head","appendChild","HTMLElementPrototype","nativeCloneNodeFn","cloneNode","deep","this","nodeName","call","clonedNode","srcChildNodes","childNodes","i","length","nodeType","options","bootstrapLazy","JSON","parse"],"mappings":";;;iJAKA,IAAMA,yBAA2B,SAACC,GAAc,MAAA,eAAeA,EAAUC,QAAQ,QAAS,MAC1F,IAAMC,aAAe,WAKK,CAElBC,IAAIC,UAAYC,IAAIC,UAEA,CAEpBC,kBAAkBC,EAAEC,WAUxB,IAAMC,EACAC,MAAMC,KAAKC,IAAIC,iBAAiB,WAAWC,MAAK,SAACC,GAAM,OAAA,IAAIC,OAAO,IAAKC,UAAS,2BAA2BC,KAAKH,EAAEI,MAChHJ,EAAEK,aAAa,4BAA8BH,aAGrD,IAAMI,EAA6D,GACnE,GAAsB,iBAAkBZ,IAAca,QAAQC,kBAAsC,CAQhG,MAAO,CACHC,KAAI,cAQwC,CAChDH,EAAKI,aAAe,IAAIC,IAAI,IAAK,IAAIA,IAAIjB,EAAUW,aAAa,uBAAyBX,EAAUU,IAAKf,IAAIuB,SAASC,OAAOA,KAC/F,CACzBC,mBAAmBR,EAAKI,aAAchB,GAE1C,IAAgCL,IAAI0B,eAAgB,CAGhD,OAAOC,OAA+C,qBAAYP,MAAK,WAAM,OAAAH,MAGrF,OAAOW,eAAeX,IAE1B,IAAMQ,mBAAqB,SAACI,EAAMC,GAC9B,IAAMC,EAAqBrC,yBAAyBmB,WACpD,IAKIb,IAAI+B,GAAsB,IAAIC,SAAS,IAAK,sBAAsBC,KAAKC,UAE3E,MAAOC,GAIH,IAAMC,EAAY,IAAIC,IACtBrC,IAAI+B,GAAsB,SAAChB,GACvB,IAAMuB,EAAM,IAAIhB,IAAIP,EAAKc,GAAML,KAC/B,IAAIe,EAAMH,EAAUI,IAAIF,GACxB,IAAKC,EAAK,CACN,IAAME,EAASjC,IAAIkC,cAAc,UACjCD,EAAOE,KAAO,SACdF,EAAOG,YAAcd,EAAac,YAClCH,EAAO1B,IAAMO,IAAIuB,gBAAgB,IAAIC,KAAK,CAAC,uBAAuBR,EAAG,aAAaP,EAAkB,WAAY,CAC5GY,KAAM,4BAEVJ,EAAM,IAAIQ,SAAQ,SAACC,GACfP,EAAOQ,OAAS,WACZD,EAAQhD,IAAI+B,GAAoBmB,GAChCT,EAAOU,aAGff,EAAUgB,IAAId,EAAKC,GACnB/B,IAAI6C,KAAKC,YAAYb,GAEzB,OAAOF,KAInB,IAAMrC,kBAAoB,SAACqD,GACvB,IAAMC,EAAoBD,EAAqBE,UAC/CF,EAAqBE,UAAY,SAAUC,GACvC,GAAIC,KAAKC,WAAa,WAAY,CAC9B,OAAOJ,EAAkBK,KAAKF,KAAMD,GAExC,IAAMI,EAAaN,EAAkBK,KAAKF,KAAM,OAChD,IAAMI,EAAgBJ,KAAKK,WAC3B,GAAIN,EAAM,CACN,IAAK,IAAIO,EAAI,EAAGA,EAAIF,EAAcG,OAAQD,IAAK,CAE3C,GAAIF,EAAcE,GAAGE,WAAa,EAAG,CACjCL,EAAWR,YAAYS,EAAcE,GAAGR,UAAU,SAI9D,OAAOK,ICjHfjE,eAAeuB,MAAK,SAAAgD,GAElB,OAAOC,cAAcC,KAAAC,MAAA,ungBAAuCH","sourcesContent":["/*\n Stencil Client Patch Browser v2.12.2 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, plt, win, doc, promiseResolve, H } from '@stencil/core';\nconst getDynamicImportFunction = (namespace) => `__sc_import_${namespace.replace(/\\s|-/g, '_')}`;\nconst patchBrowser = () => {\n // NOTE!! This fn cannot use async/await!\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo('Running in development mode.');\n }\n if (BUILD.cssVarShim) {\n // shim css vars\n plt.$cssShim$ = win.__cssshim;\n }\n if (BUILD.cloneNodeFix) {\n // opted-in to polyfill cloneNode() for slot polyfilled components\n patchCloneNodeFix(H.prototype);\n }\n if (BUILD.profile && !performance.mark) {\n // not all browsers support performance.mark/measure (Safari 10)\n performance.mark = performance.measure = () => {\n /*noop*/\n };\n performance.getEntriesByName = () => [];\n }\n // @ts-ignore\n const scriptElm = BUILD.scriptDataOpts || BUILD.safari10 || BUILD.dynamicImportShim\n ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n s.getAttribute('data-stencil-namespace') === NAMESPACE)\n : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? scriptElm['data-opts'] || {} : {};\n if (BUILD.safari10 && 'onbeforeload' in scriptElm && !history.scrollRestoration /* IS_ESM_BUILD */) {\n // Safari < v11 support: This IF is true if it's Safari below v11.\n // This fn cannot use async/await since Safari didn't support it until v11,\n // however, Safari 10 did support modules. Safari 10 also didn't support \"nomodule\",\n // so both the ESM file and nomodule file would get downloaded. Only Safari\n // has 'onbeforeload' in the script, and \"history.scrollRestoration\" was added\n // to Safari in v11. Return a noop then() so the async/await ESM code doesn't continue.\n // IS_ESM_BUILD is replaced at build time so this check doesn't happen in systemjs builds.\n return {\n then() {\n /* promise noop */\n },\n };\n }\n if (!BUILD.safari10 && importMeta !== '') {\n opts.resourcesUrl = new URL('.', importMeta).href;\n }\n else if (BUILD.dynamicImportShim || BUILD.safari10) {\n opts.resourcesUrl = new URL('.', new URL(scriptElm.getAttribute('data-resources-url') || scriptElm.src, win.location.href)).href;\n if (BUILD.dynamicImportShim) {\n patchDynamicImport(opts.resourcesUrl, scriptElm);\n }\n if (BUILD.dynamicImportShim && !win.customElements) {\n // module support, but no custom elements support (Old Edge)\n // @ts-ignore\n return import(/* webpackChunkName: \"polyfills-dom\" */ './dom.js').then(() => opts);\n }\n }\n return promiseResolve(opts);\n};\nconst patchDynamicImport = (base, orgScriptElm) => {\n const importFunctionName = getDynamicImportFunction(NAMESPACE);\n try {\n // test if this browser supports dynamic imports\n // There is a caching issue in V8, that breaks using import() in Function\n // By generating a random string, we can workaround it\n // Check https://bugs.chromium.org/p/chromium/issues/detail?id=990810 for more info\n win[importFunctionName] = new Function('w', `return import(w);//${Math.random()}`);\n }\n catch (e) {\n // this shim is specifically for browsers that do support \"esm\" imports\n // however, they do NOT support \"dynamic\" imports\n // basically this code is for old Edge, v18 and below\n const moduleMap = new Map();\n win[importFunctionName] = (src) => {\n const url = new URL(src, base).href;\n let mod = moduleMap.get(url);\n if (!mod) {\n const script = doc.createElement('script');\n script.type = 'module';\n script.crossOrigin = orgScriptElm.crossOrigin;\n script.src = URL.createObjectURL(new Blob([`import * as m from '${url}'; window.${importFunctionName}.m = m;`], {\n type: 'application/javascript',\n }));\n mod = new Promise((resolve) => {\n script.onload = () => {\n resolve(win[importFunctionName].m);\n script.remove();\n };\n });\n moduleMap.set(url, mod);\n doc.head.appendChild(script);\n }\n return mod;\n };\n }\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function (deep) {\n if (this.nodeName === 'TEMPLATE') {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport { patchBrowser };\n","import { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"]}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
var __awaiter=this&&this.__awaiter||function(t,e,n,i){function o(t){return t instanceof n?t:new n((function(e){e(t)}))}return new(n||(n=Promise))((function(n,s){function a(t){try{l(i.next(t))}catch(e){s(e)}}function r(t){try{l(i["throw"](t))}catch(e){s(e)}}function l(t){t.done?n(t.value):o(t.value).then(a,r)}l((i=i.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var n={label:0,sent:function(){if(s[0]&1)throw s[1];return s[1]},trys:[],ops:[]},i,o,s,a;return a={next:r(0),throw:r(1),return:r(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function r(t){return function(e){return l([t,e])}}function l(a){if(i)throw new TypeError("Generator is already executing.");while(n)try{if(i=1,o&&(s=a[0]&2?o["return"]:a[0]?o["throw"]||((s=o["return"])&&s.call(o),0):o.next)&&!(s=s.call(o,a[1])).done)return s;if(o=0,s)a=[a[0]&2,s.value];switch(a[0]){case 0:case 1:s=a;break;case 4:n.label++;return{value:a[1],done:false};case 5:n.label++;o=a[1];a=[0];continue;case 7:a=n.ops.pop();n.trys.pop();continue;default:if(!(s=n.trys,s=s.length>0&&s[s.length-1])&&(a[0]===6||a[0]===2)){n=0;continue}if(a[0]===3&&(!s||a[1]>s[0]&&a[1]<s[3])){n.label=a[1];break}if(a[0]===6&&n.label<s[1]){n.label=s[1];s=a;break}if(s&&n.label<s[2]){n.label=s[2];n.ops.push(a);break}if(s[2])n.ops.pop();n.trys.pop();continue}a=e.call(t,n)}catch(r){a=[6,r];o=0}finally{i=s=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};var __spreadArray=this&&this.__spreadArray||function(t,e){for(var n=0,i=e.length,o=t.length;n<i;n++,o++)t[o]=e[n];return t};
|
2
2
|
/*!
|
3
3
|
* Web Components for Nanopore digital Web Apps
|
4
|
-
*/import{r as registerInstance,c as createEvent,f as writeTask,h,e as Host,g as getElement}from"./index-c42becad.js";import{r as raf}from"./index-bf53664b.js";import{d as debounce}from"./throttle-d3d933cd.js";import{g as getDirectChildren}from"./dom-faa69d29.js";import{g as getTextContent}from"./slot-cff5ef4f.js";import{g as getActiveElement}from"./active-element-75b7c8a0.js";var datalistCss=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--padding-top:var(--nano-spacing-small, 8px);--padding-bottom:var(--nano-spacing-small, 8px);--padding-start:var(--nano-spacing-xlarge, 24px);--padding-end:var(--nano-spacing-xlarge, 24px);--font-size:0.8em;--color:#b5aea7;color:var(--color)}.dlist--isfiltered ::slotted(*:not(nano-option):not([slot=no-result]):not([slot=list-top]):not([slot=list-bottom])){display:none !important}.dlist__dropdown{--min-width:100%;--overflow:auto}.dlist__status{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.dlist__menu{--padding-top:inherit;--padding-bottom:inherit;--padding-start:inherit;--padding-end:inherit;--font-size:inherit}";function findLabel(t){var e;if(t.id){e=document.querySelector("label[for='"+t.id+"']")}if(!e){e=t.closest("label")}return e}var listIds=0;var DataList=function(){function t(t){var e=this;registerInstance(this,t);this.nanoSelect=createEvent(this,"nanoSelect",7);this.nanoDeselect=createEvent(this,"nanoDeselect",7);this.nanoOptionsUpdated=createEvent(this,"nanoOptionsUpdated",7);this.isNanoInput=false;this.typeToSelect="";this.listId="nano-datalist-"+listIds++;this.isFiltered=false;this.shouldFocus=false;this._allOptEles=[];this.actvOptEles=[];this.canOpen=true;this.optionIds=[];this.selected=[];this._dropDownConfig={skidding:-1};this.options=[];this.type="input";this.open=false;this.disableFilter=false;this.disabled=false;this.optSelected=function(t){t.stopPropagation();e.changeInputValue(t.detail);raf((function(){return e.inputChange()}));if(e.type==="select")e.shouldOpen=false};this.handleShow=function(){return __awaiter(e,void 0,void 0,(function(){return __generator(this,(function(t){if(this.shouldFocus){this.shouldFocus=false;this.listBox.setFocus()}else if(this.type==="select")this.listBox.showActiveElement();return[2]}))}))};this.inputClick=function(){e.shouldOpen=true;e.manageDropdownDisplay()};this.inputKeydown=function(t){var n=["Shift","ArrowRight","ArrowLeft","Escape","Enter","Tab"];if(n.includes(t.key)){if(t.key==="Tab")e.shouldOpen=false;return}if(e.type==="select"&&!["ArrowDown","ArrowUp"].includes(t.key)&&(t.key!==" "||e.typeToSelectTimeout)){if(t.key===" "||/^[a-z0-9]+$/i.test(t.key)){clearTimeout(e.typeToSelectTimeout);e.typeToSelectTimeout=window.setTimeout((function(){e.typeToSelect="";e.typeToSelectTimeout=0}),750);e.typeToSelect+=t.key;e.setOptStartsWith()}return}e.shouldOpen=true;e.manageDropdownDisplay();if(["ArrowDown","ArrowUp"].includes(t.key))e.shouldFocus=true};this.optionKeyDown=function(t){var n=["Shift","ArrowUp","ArrowDown","Escape","Enter","Tab","Space","PageUp","PageDown","Home","End"," "];if(n.includes(t.key)){if(t.key==="Escape")e.connectedInput.focus();return}var i=["Delete","Backspace"];if(e.type!=="select"&&(!e.exactMatch||i.includes(t.key))){e.connectedInput.focus()}};this.inputChange=debounce(this.inputChange.bind(this),50)}Object.defineProperty(t.prototype,"allOptEles",{get:function(){return this._allOptEles},set:function(t){var e=this;var n;this._allOptEles=t;if((n=this.connectedInput)===null||n===void 0?void 0:n.value)return;t.forEach((function(t){if(t.selected&&!e.selected.includes(t.value)){e.changeInputValue(t)}}))},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"dropDownConfig",{get:function(){return this._dropDownConfig},set:function(t){this._dropDownConfig=Object.assign(Object.assign({},this._dropDownConfig),t)},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"activeOptions",{get:function(){return this.allOptEles},enumerable:false,configurable:true});t.prototype.openWatcher=function(){var t=this;writeTask((function(){t.nanoDropdown.open=t.open;t.connectedInput.setAttribute("aria-expanded",t.open.toString())}))};t.prototype.watchInputChange=function(){return __awaiter(this,void 0,void 0,(function(){var t,e;return __generator(this,(function(n){switch(n.label){case 0:if(!(t=this.host.closest("nano-input")))return[3,2];this.isNanoInput=true;e=this;return[4,t.getInputElement()];case 1:e.connectedInput=n.sent();return[3,3];case 2:if(this.input&&typeof this.input==="string"&&(t=document.querySelector(this.input))){this.isNanoInput=false;this.connectedInput=t}else if(this.input instanceof HTMLElement){this.connectedInput=this.input}n.label=3;case 3:return[2]}}))}))};t.prototype.manageSlotChangeListener=function(){var t=this;var e;if(!this.host)return;if((!this.options||!this.options.length)&&!this.mo){{var n=this.mo=new MutationObserver((function(){return t.processSlottedContent()}));n.observe(this.host,{childList:true,subtree:true})}this.processSlottedContent();return}if((e=this.options)===null||e===void 0?void 0:e.length){if(!!this.mo){this.mo.disconnect();this.mo=undefined}writeTask((function(){var e;t.allOptEles=t.options.flatMap((function(e,n){if(e.value||e.label){var i=Object.assign(document.createElement("nano-option"),{label:e.label,value:e.value,ariaPosinset:n,ariaSetsize:t.options.length,selected:e.selected,id:t.listId+"-option-"+n,textContent:e.label?e.label:e.value,slot:"internal-opts"});t.host.append(i);return i}}));if(((e=t.connectedInput)===null||e===void 0?void 0:e.value.length)&&t.type!=="select"){t.inputChange()}else t.actvOptEles=__spreadArray([],t.allOptEles)}))}};t.prototype.watchTypeChange=function(){if(!this.connectedInput)return;var t={closeOnSelect:false};var e="both";var n=false;switch(this.type){case"selctMulti":break;case"select":e="list";n=true;t={closeOnSelect:true,placement:"center"};break}if(!this.isNanoInput){t.tetherTo=this.connectedInput}this.dropDownConfig=Object.assign(Object.assign({},this.dropDownConfig),t);this.connectedInput.setAttribute("aria-autocomplete",e);this.connectedInput.readOnly=n};t.prototype.manageInputEvents=function(t,e){var n=this;var i;if(!!e){var o=e.closest("nano-input");if(o){o.removeEventListener("nanoChange",this.inputChange)}e.removeEventListener("change",this.inputChange);e.removeEventListener("click",this.inputClick);e.removeEventListener("keydown",this.inputKeydown);e.removeEventListener("input",this.inputChange);this.inputLabel=null;writeTask((function(){e.removeAttribute("role");e.removeAttribute("aria-expanded");e.removeAttribute("aria-controls");e.removeAttribute("aria-owns");e.removeAttribute("aria-haspopup");e.removeAttribute("aria-autocomplete");e.removeAttribute("autocomplete")}))}if(!!t){var o=t.closest("nano-input");if(o){o.addEventListener("nanoChange",this.inputChange)}t.addEventListener("change",this.inputChange);t.addEventListener("click",this.inputClick);t.addEventListener("keydown",this.inputKeydown);t.addEventListener("input",this.inputChange);this.listId=this.host.id||this.listId;this.inputLabel=((i=t===null||t===void 0?void 0:t.labels)===null||i===void 0?void 0:i.item(0))||findLabel(t);writeTask((function(){n.host.id=n.listId;t.setAttribute("role","combobox");t.setAttribute("aria-expanded","false");t.setAttribute("aria-controls",n.listId);t.setAttribute("aria-owns",n.listId);t.setAttribute("aria-haspopup","listbox");t.setAttribute("autocomplete","off")}))}};t.prototype.watchActvOptChange=function(){var t=this;var e;var n=0;var i=((e=this.connectedInput)===null||e===void 0?void 0:e.value)||"";var o=[];writeTask((function(){t.allOptEles.forEach((function(e,s){if(t.actvOptEles.includes(e)){n++;e.setAttribute("aria-posinset",n+"");e.setAttribute("aria-setsize",t.actvOptEles.length+"");e.hidden=false;t.isSelected(e,i)}else{e.removeAttribute("aria-posinset");e.removeAttribute("aria-setsize");e.hidden=true;e.selected=false}e.id=t.listId+"-option-"+s;o.push(e.id)}));t.optionIds=o}))};t.prototype.manageCanOpen=function(){if(this.actvOptEles.length||this.hasNoResult)this.canOpen=true;else this.canOpen=false};t.prototype.manageDropdownDisplay=function(){if(this.shouldOpen&&this.canOpen&&!this.disabled)this.open=true;if(!this.shouldOpen||!this.canOpen)this.open=false;this.openWatcher()};t.prototype.fireActiveOptsEvent=function(){this.nanoOptionsUpdated.emit(this.actvOptEles)};t.prototype.isSelected=function(t,e){if(e===t.value||this.selected.includes(t.value)){t.selected=true}else t.selected=false};Object.defineProperty(t.prototype,"dropwdownOpen",{get:function(){if(!this.nanoDropdown||!this.open)return false;return true},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"exactMatch",{get:function(){var t=this;return this.allOptEles.find((function(e){return t.connectedInput.value===e.value}))},enumerable:false,configurable:true});t.prototype.changeInputValue=function(t){var e;var n;if(this.selected.includes(t.value)){this.selected=this.selected.filter((function(e){return e!==t.value}));n=this.nanoDeselect.emit(t)}else{this.selected=__spreadArray([],this.selected);n=this.nanoSelect.emit(t)}if(!n.defaultPrevented){if(this.connectedInput)this.connectedInput.value=t.value;var i=new window.Event("change");(e=this.connectedInput)===null||e===void 0?void 0:e.dispatchEvent(i)}};t.prototype.setOptStartsWith=function(){var t=this;var e=function(e){return e.toLowerCase().substring(0,t.typeToSelect.length)===t.typeToSelect};var n=this.allOptEles.find((function(t){return t.value.trim().length>0&&!t.disabled&&(e(t.textContent)||e(t.value)||e(t.label)||e(t.filterMeta))}));if(n)this.changeInputValue(n)};t.prototype.processSlottedContent=function(){var t=this;raf((function(){var e;t.allOptEles=Array.from(t.host.querySelectorAll("nano-option"));t.hasNoResult=!!t.host.querySelector('[slot="no-result"]');if(((e=t.connectedInput)===null||e===void 0?void 0:e.value.length)&&t.type!=="select"){t.inputChange()}else t.actvOptEles=t.allOptEles}))};t.prototype.inputChange=function(){var t=this;if(this.disableFilter){this.actvOptEles=this.allOptEles;return}var e=this.connectedInput.value;var n=e.trim().toLowerCase();var i=false;var o=[];var s=function(t){return t.toLowerCase().indexOf(n)>-1};this.allOptEles.forEach((function(n){if((e===n.value||e===n.label)&&t.type!=="selctMulti"){n.selected=true;i=true}else t.isSelected(n,e)}));this.allOptEles.forEach((function(t){if(!n.length||i){o.push(t)}else if(t.value.trim().length>0&&!t.disabled&&(s(t.textContent)||s(t.value)||s(t.label)||s(t.filterMeta))){o.push(t)}}));this.isFiltered=n.length&&!i;this.actvOptEles=o};t.prototype.connectedCallback=function(){this.watchInputChange()};t.prototype.componentDidLoad=function(){this.manageSlotChangeListener();this.openWatcher()};t.prototype.componentDidRender=function(){var t=this;setTimeout((function(){if(!t.connectedInput)console.warn("no `nano-input` found. `nano-datalist` should be nested within an `nano-input` or linked via `input` prop",t.host)}),500)};t.prototype.render=function(){var t=this;return h(Host,{role:"listbox","aria-owns":this.optionIds.join(" "),"aria-label":"Select options from the list below"},h("nano-dropdown",Object.assign({},this.dropDownConfig,{ref:function(e){return t.nanoDropdown=e},dialogTitle:"Select options from the list below",class:{dlist__dropdown:true,"dlist--isfiltered":this.isFiltered},onNanoAfterShow:this.handleShow,onNanoAfterHide:function(e){return t.open=false}}),h("nano-menu",{hidden:!this.actvOptEles.length,type:"listbox",label:this.inputLabel?this.inputLabel.textContent:undefined,class:{dlist__menu:true,"dlist__menu--open":this.dropwdownOpen},tabIndex:-1,onNanoSelect:this.optSelected,onKeyDown:this.optionKeyDown,ref:function(e){return t.listBox=e}},h("slot",{name:"list-top"}),!this.options.length&&h("slot",null),!!this.options.length&&h("slot",{name:"internal-opts"}),h("slot",{name:"list-bottom"})),h("nano-menu",{type:"listbox",label:"No results found",hidden:!!this.actvOptEles.length,class:{dlist__menu:true,"dlist__menu--open":this.dropwdownOpen}},h("slot",{name:"no-result"})),!!this.actvOptEles&&h("div",{"aria-live":"polite",role:"status",class:"dlist__status"},this.actvOptEles.length," result",this.actvOptEles.length>1?"s":""," available.")))};Object.defineProperty(t.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{open:["openWatcher"],input:["watchInputChange"],options:["manageSlotChangeListener"],type:["watchTypeChange"],connectedInput:["watchTypeChange","manageInputEvents"],selected:["watchActvOptChange"],actvOptEles:["watchActvOptChange","manageCanOpen","fireActiveOptsEvent"],hasNoResult:["manageCanOpen"],shouldOpen:["manageDropdownDisplay"],canOpen:["manageDropdownDisplay"]}},enumerable:false,configurable:true});return t}();DataList.style=datalistCss;var menuCss=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--padding-start:var(--nano-spacing-medium, 16px);--padding-end:var(--nano-spacing-medium, 16px);--padding-top:var(--nano-spacing-small, 8px);--padding-bottom:var(--nano-spacing-small, 8px);--secondary-padding-top:0;--secondary-padding-bottom:0;--bg-color-hover:#f2f7f9;--bg-color-focus:#f2f7f9;--bg-color-selected:#f2f7f9;--color-hover:#007495;--color-selected:#007495;--color-focus:#007495;--focus-outline:none;--font-size:0.9em;display:block}.menu{font-size:var(--font-size, 0.9em);-ms-scroll-chaining:none;overscroll-behavior:none;min-width:var(--width);position:relative}.menu:focus{outline:none}::slotted(*:not(nano-nav-item):not(nano-option):not(hr):not(slot)){padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:block}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){::slotted(*:not(nano-nav-item):not(nano-option):not(hr):not(slot)){padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}";var CANSHADOW=!!document.head.attachShadow;var Menu=function(){function t(t){var e=this;registerInstance(this,t);this.nanoFocus=createEvent(this,"nanoFocus",7);this.nanoBlur=createEvent(this,"nanoBlur",7);this.nanoSelect=createEvent(this,"nanoSelect",7);this.ignoreMouseEvents=false;this.typeToSelect="";this._hasFocus=false;this.type="menu";this.handleFocus=function(){e.setActiveFocusItem(e.selectedItem||e.getItems[0]);e._hasFocus=true;e.nanoFocus.emit()};this.handleClick=function(t){var n=t.target;var i=n.closest("nano-nav-item");if(i&&!i.disabled){e.nanoSelect.emit(i)}};this.handleKeyDown=function(t){clearTimeout(e.ignoreMouseTimeout);e.ignoreMouseTimeout=setTimeout((function(){return e.ignoreMouseEvents=false}),500);e.ignoreMouseEvents=true;switch(t.key){case" ":if(e.activeItem)e.activeItem.click();break;case"ArrowDown":case"ArrowUp":case"PageDown":case"PageUp":case"Home":case"End":var n=e.getItems;var i=e.activeItem;var o=n.indexOf(i);if(n.length){t.preventDefault();if(t.key==="ArrowDown"){o++}else if(t.key==="ArrowUp"){o--}else if(t.key==="Home"||t.key==="PageUp"){o=0}else if(t.key==="End"||t.key==="PageDown"){o=n.length-1}if(o<0)o=n.length-1;if(o>n.length-1)o=0;e.setActiveFocusItem(n[o]);if(n[o])n[o].scrollIntoView({block:"nearest"});return}break}if(t.key===" "||/^[a-z0-9]+$/i.test(t.key)){clearTimeout(e.typeToSelectTimeout);e.typeToSelectTimeout=setTimeout((function(){return e.typeToSelect=""}),750);e.typeToSelect+=t.key;var n=e.getItems;for(var s=0,a=n;s<a.length;s++){var r=a[s];var l=r.shadowRoot.querySelector("slot:not([name])");var c=getTextContent(l).toLowerCase().trim();if(c.substring(0,e.typeToSelect.length)===e.typeToSelect){e.setActiveFocusItem(r);break}}}};this.handleMouseOver=function(t){var n=t.target;var i=n.closest("nano-nav-item")||n.closest("nano-option");if(i&&!e.ignoreMouseEvents){e.setActiveFocusItem(i)}}}Object.defineProperty(t.prototype,"hasFocus",{get:function(){return this._hasFocus},enumerable:false,configurable:true});t.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){if((t=this.menu)===null||t===void 0?void 0:t.focus)this.menu.focus({preventScroll:true});return[2]}))}))};t.prototype.removeFocus=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){if((t=this.menu)===null||t===void 0?void 0:t.blur)this.menu.blur();return[2]}))}))};t.prototype.showActiveElement=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){if(this.selectedItem)this.selectedItem.scrollIntoView({block:"nearest"});return[2]}))}))};t.prototype.resetActiveItem=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.getItems.filter((function(t){return t.tagName.toLowerCase()==="nano-option"})).map((function(t){return t.setAttribute("tabindex","-1")}));return[2]}))}))};Object.defineProperty(t.prototype,"getItems",{get:function(){var t;var e=this.el.querySelectorAll("nano-nav-item.secondary-open");if(e.length){var n=e[e.length-1];t=Array.from(n.querySelectorAll("nano-nav-item, nano-option"))}else{t=getDirectChildren(this.el,"nano-nav-item, nano-option","slot")}return t.filter((function(t){return!t.disabled&&!t.hidden}))},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"activeItem",{get:function(){var t=getActiveElement();return this.getItems.find((function(e){return e.getAttribute("tabindex")==="0"||e===t||e.classList.contains("has-focus")}))},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"selectedItem",{get:function(){return this.getItems.find((function(t){return t.selected}))},enumerable:false,configurable:true});t.prototype.setActiveFocusItem=function(t,e){if(e===void 0){e=true}return __awaiter(this,void 0,void 0,(function(){var n,i;return __generator(this,(function(o){n=this.getItems;i=!t||t.disabled?n.find((function(t){return t.selected}))||n[0]:t;n.filter((function(t){return t.tagName.toLowerCase()==="nano-option"})).map((function(t){return t.setAttribute("tabindex",t===i?"0":"-1")}));if(!e)return[2];if(i){i.setFocus?i.setFocus():i.focus()}else this.menu.focus();return[2]}))}))};t.prototype.handleBlur=function(t){var e=this;if(!this.hasFocus)return;var n=t;var i;if(n.key){if(n.key!=="Tab")return;i=getActiveElement()&&getActiveElement().closest(this.el.tagName.toLowerCase())===this.el}else i=!!t.composedPath().find((function(t){return t===e.el}));if(!i){this.resetActiveItem();this._hasFocus=false;this.nanoBlur.emit()}};t.prototype.render=function(){var t;var e=this;return h(Host,{class:{legacy:!CANSHADOW}},h("div",{onClick:this.handleClick,onKeyDown:this.handleKeyDown,onMouseOver:this.handleMouseOver,onFocus:this.handleFocus,"aria-label":this.label?this.label:undefined,role:this.type,ref:function(t){return e.menu=t},part:"base",class:(t={menu:true},t["menu--"+this.type]=true,t["menu--has-focus"]=this.hasFocus,t),tabIndex:-1},h("slot",null)))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();Menu.style=menuCss;var optionCss=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--bg:none;--bg-selected:var(--nano-select-opt-bg, #f2f7f9);--bg-focus:var(--nano-color-base, var(--nano-color-primary-tint, #2689a5));--bg-disabled:none;--color:var(--input-text-color, var(--nano-input-text-color, #4a4a4a));--color-selected:var(--nano-color-base, var(--nano-color-primary, #007495));--color-focus:var(--nano-color-contrast, var(--nano-color-primary-contrast, #fff));--color-disabled:#b5aea7;--opt-icon-size:1.6em;display:block;color:var(--color);overflow:hidden;font-size:14px;font-size:clamp(12px, .9em, 16px)}:host(:focus){outline:none}.option{position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;width:100%;background:var(--bg);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.option{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}:host(:focus) .option:not(.option--disabled),:host .option.option--selected{outline:none;background:var(--bg-selected);color:var(--color-selected)}:host(:focus) .option:not(.option--disabled){background:var(--bg-focus);color:var(--color-focus)}.option.option--disabled{outline:none;color:var(--color-disabled);cursor:not-allowed;background:var(--bg-disabled)}.option.option--novalue{font-style:italic;opacity:0.7}.option__label{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.option__start{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.option__start ::slotted(nano-icon){font-size:var(--opt-icon-size)}.option__start ::slotted(:last-child){margin-right:0.5em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.option__start ::slotted(:last-child){margin-right:unset;-webkit-margin-end:0.5em;margin-inline-end:0.5em}}.option__end{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.option__end ::slotted(nano-icon){font-size:var(--opt-icon-size)}.option__end ::slotted(:first-child){margin-left:0.5em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.option__end ::slotted(:first-child){margin-left:unset;-webkit-margin-start:0.5em;margin-inline-start:0.5em;}}.option__check{visibility:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;left:0.6em;top:calc(50% - 0.6em);-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:0.9em}.option--selected:not(.option--novalue) .option__check{visibility:visible}";var optIds=0;var Option=function(){function t(t){registerInstance(this,t);this.nanoSelect=createEvent(this,"nanoSelect",7);this.optId="nano-option-"+optIds++;this.hasFocus=false;this.value="";this.label="";this.selected=false;this.disabled=false;this.filterMeta="";this.handleClick=debounce(this.handleClick.bind(this),5)}t.prototype.valueChanged=function(){if(!this.value||!this.value.length)this.value=this.labelContent};t.prototype.labelChanged=function(){if(!this.label||!this.label.length)this.label=this.labelContent.length?this.labelContent:this.value};t.prototype.handleKeyDown=function(t){if(t.key!==" "&&t.key!=="Enter")return;t.preventDefault();this.nanoSelect.emit(this.host)};t.prototype.handleClick=function(){if(this.disabled)return;this.nanoSelect.emit(this.host)};Object.defineProperty(t.prototype,"labelContent",{get:function(){return getDirectChildren(this.host,"*:not([slot])",false).map((function(t){return t.textContent})).join(" ").trim()},enumerable:false,configurable:true});t.prototype.componentWillLoad=function(){this.valueChanged();this.labelChanged()};t.prototype.render=function(){return h(Host,{role:"option","aria-selected":this.selected?"true":"false","aria-disabled":this.disabled?"true":"false"},h("div",{onMouseDown:this.handleClick,id:this.optId,class:{option:true,"option--selected":this.selected,"option--disabled":this.disabled,"option--novalue":!this.value}},h("div",{part:"check-icon",class:"option__check"},h("slot",{name:"check-icon"},h("nano-icon",{name:"light/check","aria-hidden":"true"}))),h("div",{part:"start",class:"option__start"},h("slot",{name:"start"})),h("div",{part:"label",class:"option__label"},h("slot",null,this.label||this.value)),h("div",{part:"end",class:"option__end"},h("slot",{name:"end"}))))};Object.defineProperty(t.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{value:["valueChanged"],label:["labelChanged"]}},enumerable:false,configurable:true});return t}();Option.style=optionCss;export{DataList as nano_datalist,Menu as nano_menu,Option as nano_option};
|
4
|
+
*/import{r as registerInstance,c as createEvent,f as writeTask,h,e as Host,g as getElement}from"./index-c42becad.js";import{r as raf}from"./index-bf53664b.js";import{d as debounce}from"./throttle-d3d933cd.js";import{g as getDirectChildren}from"./dom-faa69d29.js";import{g as getTextContent}from"./slot-cff5ef4f.js";import{g as getActiveElement}from"./active-element-75b7c8a0.js";var datalistCss=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--padding-top:var(--nano-spacing-small, 8px);--padding-bottom:var(--nano-spacing-small, 8px);--padding-start:var(--nano-spacing-xlarge, 24px);--padding-end:var(--nano-spacing-xlarge, 24px);--font-size:0.8em;--color:#b5aea7;color:var(--color)}.dlist--isfiltered ::slotted(*:not(nano-option):not([slot=no-result]):not([slot=list-top]):not([slot=list-bottom])){display:none !important}.dlist__dropdown{--min-width:100%;--overflow:auto}.dlist__status{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.dlist__menu{--padding-top:inherit;--padding-bottom:inherit;--padding-start:inherit;--padding-end:inherit;--font-size:inherit}";function findLabel(t){var e;if(t.id){e=document.querySelector("label[for='"+t.id+"']")}if(!e){e=t.closest("label")}return e}var listIds=0;var DataList=function(){function t(t){var e=this;registerInstance(this,t);this.nanoSelect=createEvent(this,"nanoSelect",7);this.nanoDeselect=createEvent(this,"nanoDeselect",7);this.nanoOptionsUpdated=createEvent(this,"nanoOptionsUpdated",7);this.isNanoInput=false;this.typeToSelect="";this.listId="nano-datalist-"+listIds++;this.isFiltered=false;this.shouldFocus=false;this._allOptEles=[];this.actvOptEles=[];this.canOpen=true;this.optionIds=[];this.selected=[];this._dropDownConfig={skidding:-1};this.options=[];this.type="input";this.open=false;this.disableFilter=false;this.disabled=false;this.optSelected=function(t){t.stopPropagation();e.changeInputValue(t.detail);raf((function(){return e.inputChange()}));if(e.type==="select")e.shouldOpen=false};this.handleShow=function(){return __awaiter(e,void 0,void 0,(function(){return __generator(this,(function(t){if(this.shouldFocus){this.shouldFocus=false;this.listBox.setFocus()}else if(this.type==="select")this.listBox.showActiveElement();return[2]}))}))};this.inputClick=function(){e.shouldOpen=true;e.manageDropdownDisplay()};this.inputKeydown=function(t){var n=["Shift","ArrowRight","ArrowLeft","Escape","Enter","Tab"];if(n.includes(t.key)){if(t.key==="Tab")e.shouldOpen=false;return}if(e.type==="select"&&!["ArrowDown","ArrowUp"].includes(t.key)&&(t.key!==" "||e.typeToSelectTimeout)){if(t.key===" "||/^[a-z0-9]+$/i.test(t.key)){clearTimeout(e.typeToSelectTimeout);e.typeToSelectTimeout=window.setTimeout((function(){e.typeToSelect="";e.typeToSelectTimeout=0}),750);e.typeToSelect+=t.key;e.setOptStartsWith()}return}e.shouldOpen=true;e.manageDropdownDisplay();if(["ArrowDown","ArrowUp"].includes(t.key)){t.preventDefault();e.shouldFocus=true}};this.optionKeyDown=function(t){var n=["Shift","ArrowUp","ArrowDown","Escape","Enter","Tab","Space","PageUp","PageDown","Home","End"," "];if(n.includes(t.key)){if(t.key==="Escape")e.connectedInput.focus();return}var i=["Delete","Backspace"];if(e.type!=="select"&&(!e.exactMatch||i.includes(t.key))){e.connectedInput.focus()}};this.inputChange=debounce(this.inputChange.bind(this),50)}Object.defineProperty(t.prototype,"allOptEles",{get:function(){return this._allOptEles},set:function(t){var e=this;var n;this._allOptEles=t;if((n=this.connectedInput)===null||n===void 0?void 0:n.value)return;t.forEach((function(t){if(t.selected&&!e.selected.includes(t.value)){e.changeInputValue(t)}}))},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"dropDownConfig",{get:function(){return this._dropDownConfig},set:function(t){this._dropDownConfig=Object.assign(Object.assign({},this._dropDownConfig),t)},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"activeOptions",{get:function(){return this.allOptEles},enumerable:false,configurable:true});t.prototype.openWatcher=function(){var t=this;writeTask((function(){t.nanoDropdown.open=t.open;t.connectedInput.setAttribute("aria-expanded",t.open.toString())}))};t.prototype.watchInputChange=function(){return __awaiter(this,void 0,void 0,(function(){var t,e;return __generator(this,(function(n){switch(n.label){case 0:if(!(t=this.host.closest("nano-input")))return[3,2];this.isNanoInput=true;e=this;return[4,t.getInputElement()];case 1:e.connectedInput=n.sent();return[3,3];case 2:if(this.input&&typeof this.input==="string"&&(t=document.querySelector(this.input))){this.isNanoInput=false;this.connectedInput=t}else if(this.input instanceof HTMLElement){this.connectedInput=this.input}n.label=3;case 3:return[2]}}))}))};t.prototype.manageSlotChangeListener=function(){var t=this;var e;if(!this.host)return;if((!this.options||!this.options.length)&&!this.mo){{var n=this.mo=new MutationObserver((function(){return t.processSlottedContent()}));n.observe(this.host,{childList:true,subtree:true})}this.processSlottedContent();return}if((e=this.options)===null||e===void 0?void 0:e.length){if(!!this.mo){this.mo.disconnect();this.mo=undefined}writeTask((function(){var e;t.allOptEles=t.options.flatMap((function(e,n){if(e.value||e.label){var i=Object.assign(document.createElement("nano-option"),{label:e.label,value:e.value,ariaPosinset:n,ariaSetsize:t.options.length,selected:e.selected,id:t.listId+"-option-"+n,textContent:e.label?e.label:e.value,slot:"internal-opts"});t.host.append(i);return i}}));if(((e=t.connectedInput)===null||e===void 0?void 0:e.value.length)&&t.type!=="select"){t.inputChange()}else t.actvOptEles=__spreadArray([],t.allOptEles)}))}};t.prototype.watchTypeChange=function(){if(!this.connectedInput)return;var t={closeOnSelect:false};var e="both";var n=false;switch(this.type){case"selctMulti":break;case"select":e="list";n=true;t={closeOnSelect:true,placement:"center"};break}if(!this.isNanoInput){t.tetherTo=this.connectedInput}this.dropDownConfig=Object.assign(Object.assign({},this.dropDownConfig),t);this.connectedInput.setAttribute("aria-autocomplete",e);this.connectedInput.readOnly=n};t.prototype.manageInputEvents=function(t,e){var n=this;var i;if(!!e){var o=e.closest("nano-input");if(o){o.removeEventListener("nanoChange",this.inputChange)}e.removeEventListener("change",this.inputChange);e.removeEventListener("click",this.inputClick);e.removeEventListener("keydown",this.inputKeydown);e.removeEventListener("input",this.inputChange);this.inputLabel=null;writeTask((function(){e.removeAttribute("role");e.removeAttribute("aria-expanded");e.removeAttribute("aria-controls");e.removeAttribute("aria-owns");e.removeAttribute("aria-haspopup");e.removeAttribute("aria-autocomplete");e.removeAttribute("autocomplete")}))}if(!!t){var o=t.closest("nano-input");if(o){o.addEventListener("nanoChange",this.inputChange)}t.addEventListener("change",this.inputChange);t.addEventListener("click",this.inputClick);t.addEventListener("keydown",this.inputKeydown);t.addEventListener("input",this.inputChange);this.listId=this.host.id||this.listId;this.inputLabel=((i=t===null||t===void 0?void 0:t.labels)===null||i===void 0?void 0:i.item(0))||findLabel(t);writeTask((function(){n.host.id=n.listId;t.setAttribute("role","combobox");t.setAttribute("aria-expanded","false");t.setAttribute("aria-controls",n.listId);t.setAttribute("aria-owns",n.listId);t.setAttribute("aria-haspopup","listbox");t.setAttribute("autocomplete","off")}))}};t.prototype.watchActvOptChange=function(){var t=this;var e;var n=0;var i=((e=this.connectedInput)===null||e===void 0?void 0:e.value)||"";var o=[];writeTask((function(){t.allOptEles.forEach((function(e,s){if(t.actvOptEles.includes(e)){n++;e.setAttribute("aria-posinset",n+"");e.setAttribute("aria-setsize",t.actvOptEles.length+"");e.hidden=false;t.isSelected(e,i)}else{e.removeAttribute("aria-posinset");e.removeAttribute("aria-setsize");e.hidden=true;e.selected=false}e.id=t.listId+"-option-"+s;o.push(e.id)}));t.optionIds=o}))};t.prototype.manageCanOpen=function(){if(this.actvOptEles.length||this.hasNoResult)this.canOpen=true;else this.canOpen=false};t.prototype.manageDropdownDisplay=function(){if(this.shouldOpen&&this.canOpen&&!this.disabled)this.open=true;if(!this.shouldOpen||!this.canOpen)this.open=false;this.openWatcher()};t.prototype.fireActiveOptsEvent=function(){this.nanoOptionsUpdated.emit(this.actvOptEles)};t.prototype.isSelected=function(t,e){if(e===t.value||this.selected.includes(t.value)){t.selected=true}else t.selected=false};Object.defineProperty(t.prototype,"dropwdownOpen",{get:function(){if(!this.nanoDropdown||!this.open)return false;return true},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"exactMatch",{get:function(){var t=this;return this.allOptEles.find((function(e){return t.connectedInput.value===e.value}))},enumerable:false,configurable:true});t.prototype.changeInputValue=function(t){var e;var n;if(this.selected.includes(t.value)){this.selected=this.selected.filter((function(e){return e!==t.value}));n=this.nanoDeselect.emit(t)}else{this.selected=__spreadArray([],this.selected);n=this.nanoSelect.emit(t)}if(!n.defaultPrevented){if(this.connectedInput)this.connectedInput.value=t.value;var i=new window.Event("change");(e=this.connectedInput)===null||e===void 0?void 0:e.dispatchEvent(i)}};t.prototype.setOptStartsWith=function(){var t=this;var e=function(e){return e.toLowerCase().substring(0,t.typeToSelect.length)===t.typeToSelect};var n=this.allOptEles.find((function(t){return t.value.trim().length>0&&!t.disabled&&(e(t.textContent)||e(t.value)||e(t.label)||e(t.filterMeta))}));if(n)this.changeInputValue(n)};t.prototype.processSlottedContent=function(){var t=this;raf((function(){var e;t.allOptEles=Array.from(t.host.querySelectorAll("nano-option"));t.hasNoResult=!!t.host.querySelector('[slot="no-result"]');if(((e=t.connectedInput)===null||e===void 0?void 0:e.value.length)&&t.type!=="select"){t.inputChange()}else t.actvOptEles=t.allOptEles}))};t.prototype.inputChange=function(){var t=this;if(this.disableFilter){this.actvOptEles=this.allOptEles;return}var e=this.connectedInput.value;var n=e.trim().toLowerCase();var i=false;var o=[];var s=function(t){return t.toLowerCase().indexOf(n)>-1};this.allOptEles.forEach((function(n){if((e===n.value||e===n.label)&&t.type!=="selctMulti"){n.selected=true;i=true}else t.isSelected(n,e)}));this.allOptEles.forEach((function(t){if(!n.length||i){o.push(t)}else if(t.value.trim().length>0&&!t.disabled&&(s(t.textContent)||s(t.value)||s(t.label)||s(t.filterMeta))){o.push(t)}}));this.isFiltered=n.length&&!i;this.actvOptEles=o};t.prototype.connectedCallback=function(){this.watchInputChange()};t.prototype.componentDidLoad=function(){this.manageSlotChangeListener();this.openWatcher()};t.prototype.componentDidRender=function(){var t=this;setTimeout((function(){if(!t.connectedInput)console.warn("no `nano-input` found. `nano-datalist` should be nested within an `nano-input` or linked via `input` prop",t.host)}),500)};t.prototype.render=function(){var t=this;return h(Host,{role:"listbox","aria-owns":this.optionIds.join(" "),"aria-label":"Select options from the list below"},h("nano-dropdown",Object.assign({},this.dropDownConfig,{ref:function(e){return t.nanoDropdown=e},dialogTitle:"Select options from the list below",class:{dlist__dropdown:true,"dlist--isfiltered":this.isFiltered},onNanoAfterShow:this.handleShow,onNanoAfterHide:function(e){return t.open=false}}),h("nano-menu",{hidden:!this.actvOptEles.length,type:"listbox",label:this.inputLabel?this.inputLabel.textContent:undefined,class:{dlist__menu:true,"dlist__menu--open":this.dropwdownOpen},tabIndex:-1,onNanoSelect:this.optSelected,onKeyDown:this.optionKeyDown,ref:function(e){return t.listBox=e}},h("slot",{name:"list-top"}),!this.options.length&&h("slot",null),!!this.options.length&&h("slot",{name:"internal-opts"}),h("slot",{name:"list-bottom"})),h("nano-menu",{type:"listbox",label:"No results found",hidden:!!this.actvOptEles.length,class:{dlist__menu:true,"dlist__menu--open":this.dropwdownOpen}},h("slot",{name:"no-result"})),!!this.actvOptEles&&h("div",{"aria-live":"polite",role:"status",class:"dlist__status"},this.actvOptEles.length," result",this.actvOptEles.length>1?"s":""," available.")))};Object.defineProperty(t.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{open:["openWatcher"],input:["watchInputChange"],options:["manageSlotChangeListener"],type:["watchTypeChange"],connectedInput:["watchTypeChange","manageInputEvents"],selected:["watchActvOptChange"],actvOptEles:["watchActvOptChange","manageCanOpen","fireActiveOptsEvent"],hasNoResult:["manageCanOpen"],shouldOpen:["manageDropdownDisplay"],canOpen:["manageDropdownDisplay"]}},enumerable:false,configurable:true});return t}();DataList.style=datalistCss;var menuCss=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--padding-start:var(--nano-spacing-medium, 16px);--padding-end:var(--nano-spacing-medium, 16px);--padding-top:var(--nano-spacing-small, 8px);--padding-bottom:var(--nano-spacing-small, 8px);--secondary-padding-top:0;--secondary-padding-bottom:0;--bg-color-hover:#f2f7f9;--bg-color-focus:#f2f7f9;--bg-color-selected:#f2f7f9;--color-hover:#007495;--color-selected:#007495;--color-focus:#007495;--focus-outline:none;--font-size:0.9em;display:block}.menu{font-size:var(--font-size, 0.9em);-ms-scroll-chaining:none;overscroll-behavior:none;min-width:var(--width);position:relative}.menu:focus{outline:none}::slotted(*:not(nano-nav-item):not(nano-option):not(hr):not(slot)){padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:block}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){::slotted(*:not(nano-nav-item):not(nano-option):not(hr):not(slot)){padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}";var CANSHADOW=!!document.head.attachShadow;var Menu=function(){function t(t){var e=this;registerInstance(this,t);this.nanoFocus=createEvent(this,"nanoFocus",7);this.nanoBlur=createEvent(this,"nanoBlur",7);this.nanoSelect=createEvent(this,"nanoSelect",7);this.ignoreMouseEvents=false;this.typeToSelect="";this._hasFocus=false;this.type="menu";this.handleFocus=function(){e.setActiveFocusItem(e.selectedItem||e.getItems[0]);e._hasFocus=true;e.nanoFocus.emit()};this.handleClick=function(t){var n=t.target;var i=n.closest("nano-nav-item");if(i&&!i.disabled){e.nanoSelect.emit(i)}};this.handleKeyDown=function(t){clearTimeout(e.ignoreMouseTimeout);e.ignoreMouseTimeout=setTimeout((function(){return e.ignoreMouseEvents=false}),500);e.ignoreMouseEvents=true;switch(t.key){case" ":if(e.activeItem)e.activeItem.click();break;case"ArrowDown":case"ArrowUp":case"PageDown":case"PageUp":case"Home":case"End":var n=e.getItems;var i=e.activeItem;var o=n.indexOf(i);if(n.length){t.preventDefault();if(t.key==="ArrowDown"){o++}else if(t.key==="ArrowUp"){o--}else if(t.key==="Home"||t.key==="PageUp"){o=0}else if(t.key==="End"||t.key==="PageDown"){o=n.length-1}if(o<0)o=n.length-1;if(o>n.length-1)o=0;e.setActiveFocusItem(n[o]);if(n[o])n[o].scrollIntoView({block:"nearest"});return}break}if(t.key===" "||/^[a-z0-9]+$/i.test(t.key)){clearTimeout(e.typeToSelectTimeout);e.typeToSelectTimeout=setTimeout((function(){return e.typeToSelect=""}),750);e.typeToSelect+=t.key;var n=e.getItems;for(var s=0,a=n;s<a.length;s++){var r=a[s];var l=r.shadowRoot.querySelector("slot:not([name])");var c=getTextContent(l).toLowerCase().trim();if(c.substring(0,e.typeToSelect.length)===e.typeToSelect){e.setActiveFocusItem(r);break}}}};this.handleMouseOver=function(t){var n=t.target;var i=n.closest("nano-nav-item")||n.closest("nano-option");if(i&&!e.ignoreMouseEvents){e.setActiveFocusItem(i)}}}Object.defineProperty(t.prototype,"hasFocus",{get:function(){return this._hasFocus},enumerable:false,configurable:true});t.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){if((t=this.menu)===null||t===void 0?void 0:t.focus)this.menu.focus({preventScroll:true});return[2]}))}))};t.prototype.removeFocus=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){if((t=this.menu)===null||t===void 0?void 0:t.blur)this.menu.blur();return[2]}))}))};t.prototype.showActiveElement=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){if(this.selectedItem)this.selectedItem.scrollIntoView({block:"nearest"});return[2]}))}))};t.prototype.resetActiveItem=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.getItems.filter((function(t){return t.tagName.toLowerCase()==="nano-option"})).map((function(t){return t.setAttribute("tabindex","-1")}));return[2]}))}))};Object.defineProperty(t.prototype,"getItems",{get:function(){var t;var e=this.el.querySelectorAll("nano-nav-item.secondary-open");if(e.length){var n=e[e.length-1];t=Array.from(n.querySelectorAll("nano-nav-item, nano-option"))}else{t=getDirectChildren(this.el,"nano-nav-item, nano-option","slot")}return t.filter((function(t){return!t.disabled&&!t.hidden}))},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"activeItem",{get:function(){var t=getActiveElement();return this.getItems.find((function(e){return e.getAttribute("tabindex")==="0"||e===t||e.classList.contains("has-focus")}))},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"selectedItem",{get:function(){return this.getItems.find((function(t){return t.selected}))},enumerable:false,configurable:true});t.prototype.setActiveFocusItem=function(t,e){if(e===void 0){e=true}return __awaiter(this,void 0,void 0,(function(){var n,i;return __generator(this,(function(o){n=this.getItems;i=!t||t.disabled?n.find((function(t){return t.selected}))||n[0]:t;n.filter((function(t){return t.tagName.toLowerCase()==="nano-option"})).map((function(t){return t.setAttribute("tabindex",t===i?"0":"-1")}));if(!e)return[2];if(i){i.setFocus?i.setFocus():i.focus()}else this.menu.focus();return[2]}))}))};t.prototype.handleBlur=function(t){var e=this;if(!this.hasFocus)return;var n=t;var i;if(n.key){if(n.key!=="Tab")return;i=getActiveElement()&&getActiveElement().closest(this.el.tagName.toLowerCase())===this.el}else i=!!t.composedPath().find((function(t){return t===e.el}));if(!i){this.resetActiveItem();this._hasFocus=false;this.nanoBlur.emit()}};t.prototype.render=function(){var t;var e=this;return h(Host,{class:{legacy:!CANSHADOW}},h("div",{onClick:this.handleClick,onKeyDown:this.handleKeyDown,onMouseOver:this.handleMouseOver,onFocus:this.handleFocus,"aria-label":this.label?this.label:undefined,role:this.type,ref:function(t){return e.menu=t},part:"base",class:(t={menu:true},t["menu--"+this.type]=true,t["menu--has-focus"]=this.hasFocus,t),tabIndex:-1},h("slot",null)))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();Menu.style=menuCss;var optionCss=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--bg:none;--bg-selected:var(--nano-select-opt-bg, #f2f7f9);--bg-focus:var(--nano-color-base, var(--nano-color-primary-tint, #2689a5));--bg-disabled:none;--color:var(--input-text-color, var(--nano-input-text-color, #4a4a4a));--color-selected:var(--nano-color-base, var(--nano-color-primary, #007495));--color-focus:var(--nano-color-contrast, var(--nano-color-primary-contrast, #fff));--color-disabled:#b5aea7;--opt-icon-size:1.6em;display:block;color:var(--color);overflow:hidden;font-size:14px;font-size:clamp(12px, .9em, 16px)}:host(:focus){outline:none}.option{position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;width:100%;background:var(--bg);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.option{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}:host(:focus) .option:not(.option--disabled),:host .option.option--selected{outline:none;background:var(--bg-selected);color:var(--color-selected)}:host(:focus) .option:not(.option--disabled){background:var(--bg-focus);color:var(--color-focus)}.option.option--disabled{outline:none;color:var(--color-disabled);cursor:not-allowed;background:var(--bg-disabled)}.option.option--novalue{font-style:italic;opacity:0.7}.option__label{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.option__start{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.option__start ::slotted(nano-icon){font-size:var(--opt-icon-size)}.option__start ::slotted(:last-child){margin-right:0.5em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.option__start ::slotted(:last-child){margin-right:unset;-webkit-margin-end:0.5em;margin-inline-end:0.5em}}.option__end{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.option__end ::slotted(nano-icon){font-size:var(--opt-icon-size)}.option__end ::slotted(:first-child){margin-left:0.5em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.option__end ::slotted(:first-child){margin-left:unset;-webkit-margin-start:0.5em;margin-inline-start:0.5em;}}.option__check{visibility:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;left:0.6em;top:calc(50% - 0.6em);-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:0.9em}.option--selected:not(.option--novalue) .option__check{visibility:visible}";var optIds=0;var Option=function(){function t(t){registerInstance(this,t);this.nanoSelect=createEvent(this,"nanoSelect",7);this.optId="nano-option-"+optIds++;this.hasFocus=false;this.value="";this.label="";this.selected=false;this.disabled=false;this.filterMeta="";this.handleClick=debounce(this.handleClick.bind(this),5)}t.prototype.valueChanged=function(){if(!this.value||!this.value.length)this.value=this.labelContent};t.prototype.labelChanged=function(){if(!this.label||!this.label.length)this.label=this.labelContent.length?this.labelContent:this.value};t.prototype.handleKeyDown=function(t){if(t.key!==" "&&t.key!=="Enter")return;t.preventDefault();this.nanoSelect.emit(this.host)};t.prototype.handleClick=function(){if(this.disabled)return;this.nanoSelect.emit(this.host)};Object.defineProperty(t.prototype,"labelContent",{get:function(){return getDirectChildren(this.host,"*:not([slot])",false).map((function(t){return t.textContent})).join(" ").trim()},enumerable:false,configurable:true});t.prototype.componentWillLoad=function(){this.valueChanged();this.labelChanged()};t.prototype.render=function(){return h(Host,{role:"option","aria-selected":this.selected?"true":"false","aria-disabled":this.disabled?"true":"false"},h("div",{onMouseDown:this.handleClick,id:this.optId,class:{option:true,"option--selected":this.selected,"option--disabled":this.disabled,"option--novalue":!this.value}},h("div",{part:"check-icon",class:"option__check"},h("slot",{name:"check-icon"},h("nano-icon",{name:"light/check","aria-hidden":"true"}))),h("div",{part:"start",class:"option__start"},h("slot",{name:"start"})),h("div",{part:"label",class:"option__label"},h("slot",null,this.label||this.value)),h("div",{part:"end",class:"option__end"},h("slot",{name:"end"}))))};Object.defineProperty(t.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{value:["valueChanged"],label:["labelChanged"]}},enumerable:false,configurable:true});return t}();Option.style=optionCss;export{DataList as nano_datalist,Menu as nano_menu,Option as nano_option};
|
5
5
|
//# sourceMappingURL=nano-datalist_3.entry.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["src/components/datalist/datalist.scss?tag=nano-datalist&encapsulation=shadow","src/components/datalist/datalist.tsx","src/components/menu/menu.scss?tag=nano-menu&encapsulation=shadow","src/components/menu/menu.tsx","src/components/option/option.scss?tag=nano-option&encapsulation=shadow","src/components/option/option.tsx"],"names":["datalistCss","findLabel","formCtrl","foundLabel","id","document","querySelector","closest","listIds","DataList","class_1","hostRef","_this","this","isNanoInput","typeToSelect","listId","isFiltered","shouldFocus","_allOptEles","actvOptEles","canOpen","optionIds","selected","_dropDownConfig","skidding","options","type","open","disableFilter","disabled","optSelected","e","stopPropagation","changeInputValue","detail","raf","inputChange","shouldOpen","handleShow","__awaiter","listBox","setFocus","showActiveElement","inputClick","manageDropdownDisplay","inputKeydown","ignoreKeys","includes","key","typeToSelectTimeout","test","clearTimeout","window","setTimeout","setOptStartsWith","optionKeyDown","connectedInput","focus","deleteKeys","exactMatch","debounce","bind","Object","defineProperty","prototype","opts","_a","value","forEach","opt","ddc","assign","allOptEles","openWatcher","writeTask","nanoDropdown","setAttribute","toString","watchInputChange","nanoInput","host","_b","getInputElement","_c","sent","input","HTMLElement","manageSlotChangeListener","length","mo","MutationObserver","processSlottedContent","observe","childList","subtree","disconnect","undefined","flatMap","option","i","label","createElement","ariaPosinset","ariaSetsize","textContent","slot","append","__spreadArray","watchTypeChange","dwConfig","closeOnSelect","autocompleteType","readonly","placement","tetherTo","dropDownConfig","readOnly","manageInputEvents","newInput","oldInput","removeEventListener","inputLabel","removeAttribute","addEventListener","labels","item","watchActvOptChange","c","val","optIds","hidden","isSelected","push","manageCanOpen","hasNoResult","fireActiveOptsEvent","nanoOptionsUpdated","emit","find","nanoSelected","filter","nanoDeselect","nanoSelect","defaultPrevented","event","Event","dispatchEvent","attrFind","toFind","toLowerCase","substring","foundEle","trim","filterMeta","Array","from","querySelectorAll","valStr","activeEles","indexOf","connectedCallback","componentDidLoad","componentDidRender","console","warn","render","h","Host","role","aria-owns","join","aria-label","ref","el","dialogTitle","class","dlist__dropdown","dlist--isfiltered","onNanoAfterShow","onNanoAfterHide","_","dlist__menu","dlist__menu--open","dropwdownOpen","tabIndex","onNanoSelect","onKeyDown","name","aria-live","menuCss","CANSHADOW","head","attachShadow","Menu","class_2","ignoreMouseEvents","_hasFocus","handleFocus","setActiveFocusItem","selectedItem","getItems","nanoFocus","handleClick","target","handleKeyDown","ignoreMouseTimeout","activeItem","click","items","index","preventDefault","scrollIntoView","block","_i","items_1","shadowRoot","getTextContent","handleMouseOver","menu","preventScroll","removeFocus","blur","resetActiveItem","tagName","map","opened","ctx","getDirectChildren","activeElement","getActiveElement","getAttribute","classList","contains","handleBlur","hasFocus","kev","found","composedPath","nanoBlur","legacy","onClick","onMouseOver","onFocus","part","optionCss","Option","optId","valueChanged","labelContent","labelChanged","componentWillLoad","aria-selected","aria-disabled","onMouseDown","option--selected","option--disabled","option--novalue","aria-hidden"],"mappings":"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","sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --padding-top: for all nested `nano-option` elements. Defaults to #{$spacing-small};\n * @prop --padding-bottom: for all nested `nano-option` elements. Defaults to #{$spacing-small};\n * @prop --padding-start: for all nested `nano-option` elements. Defaults to #{$spacing-xlarge};\n * @prop --padding-end: for all nested `nano-option` elements. Defaults to #{$spacing-xlarge};\n * @prop --font-size: for all nested `nano-option` elements. Defaults to .8em;\n * @prop --color: default text color of content other than `nano-option`. Defaults to #{map.get($colors, palegrey)};\n */\n\n --padding-top: #{$spacing-small};\n --padding-bottom: #{$spacing-small};\n --padding-start: #{$spacing-xlarge};\n --padding-end: #{$spacing-xlarge};\n --font-size: 0.8em;\n --color: #{map.get($colors, palegrey)};\n\n color: var(--color);\n}\n\n.dlist {\n &--isfiltered {\n ::slotted(*:not(nano-option):not([slot='no-result']):not([slot='list-top']):not([slot='list-bottom'])) {\n display: none !important;\n }\n }\n\n &__dropdown {\n --min-width: 100%;\n --overflow: auto;\n }\n\n &__status {\n @include visually-hide();\n }\n\n &__menu {\n --padding-top: inherit;\n --padding-bottom: inherit;\n --padding-start: inherit;\n --padding-end: inherit;\n --font-size: inherit;\n }\n}\n","import {\n Component,\n ComponentInterface,\n h,\n Host,\n Element,\n State,\n Watch,\n Prop,\n Event,\n EventEmitter,\n writeTask,\n Build,\n} from '@stencil/core';\nimport { debounce, raf } from '../../utils';\nimport type { Dropdown } from '../dropdown/dropdown';\nimport type { OptionInterface } from '../../interface';\n\nfunction findLabel(formCtrl: Element) {\n let foundLabel: HTMLLabelElement;\n\n if (formCtrl.id) {\n foundLabel = document.querySelector(`label[for='${formCtrl.id}']`);\n }\n if (!foundLabel) {\n foundLabel = formCtrl.closest('label');\n }\n return foundLabel;\n}\n\nlet listIds = 0;\n\n/**\n * `nano-datalist` a visually consistent and more flexible replacement for a native\n * [datalist](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist). Can be nested within a `nano-input`\n * or linked to any input control via the `input` prop. Is used internally within `nano-select`.\n * Options can be defined declaratively by nesting `<nano-option>` elements or imperatively using the `options` prop\n *\n * @slot - use `<nano-option>` elements for more complex html. Alternatively use the `options` prop\n * @slot list-top - shows at the top of the list when there are options present\n * @slot list-bottom - shows at the bottom of the list when there are options present\n * @slot no-result - shown when there are no results otherwise nothing will be shown\n */\n@Component({\n tag: 'nano-datalist',\n styleUrl: 'datalist.scss',\n shadow: true,\n})\nexport class DataList implements ComponentInterface {\n // Private State\n\n private isNanoInput = false;\n private typeToSelect = '';\n private typeToSelectTimeout: number;\n private nanoDropdown: HTMLNanoDropdownElement;\n private listBox: HTMLNanoMenuElement;\n private mo?: MutationObserver;\n private listId = `nano-datalist-${listIds++}`;\n private isFiltered = false;\n private shouldFocus = false;\n // all potential option eles. Set via slot or `options` prop.\n // Some may get hidden due to filtering\n private get allOptEles() {\n return this._allOptEles;\n }\n private set allOptEles(opts) {\n // when allOptEles are initially set (on slot change / options) -\n // add options to 'selected' and fire selected event *if*\n // value isn't set on the input\n this._allOptEles = opts;\n if (this.connectedInput?.value) return;\n\n opts.forEach((opt) => {\n if (opt.selected && !this.selected.includes(opt.value)) {\n this.changeInputValue(opt);\n }\n });\n }\n private _allOptEles: HTMLNanoOptionElement[] = [];\n\n @Element() host: HTMLNanoDatalistElement;\n\n // active option eles that are not hidden.\n @State() actvOptEles: HTMLNanoOptionElement[] = [];\n @State() connectedInput: HTMLInputElement | HTMLTextAreaElement;\n @State() inputLabel: HTMLLabelElement;\n @State() hasNoResult: boolean;\n @State() shouldOpen: boolean;\n @State() canOpen: boolean = true;\n @State() optionIds: string[] = [];\n\n constructor() {\n this.inputChange = debounce(this.inputChange.bind(this), 50);\n }\n\n // Public API\n\n /** By default, items in the list will appear 'selected' when the value in the linked input control matches.\n * However you can add other selected options via the the selected prop. */\n @Prop({ mutable: true }) selected: string[] = [];\n\n /** nano-dropdown config options you can pass to the nested dropdown component */\n @Prop()\n get dropDownConfig() {\n return this._dropDownConfig;\n }\n set dropDownConfig(ddc: Partial<Dropdown>) {\n this._dropDownConfig = { ...this._dropDownConfig, ...ddc };\n }\n private _dropDownConfig: Partial<Dropdown> = {\n skidding: -1,\n };\n\n /** Provide an option list.\n * Options can be defined declaratively by nesting `<nano-option>` elements or imperatively using this prop */\n @Prop() options?: OptionInterface[] = [];\n\n /** A selector to a HTMLInputElement */\n @Prop() input?: string | HTMLInputElement;\n\n /** Tweaks the datalist behaviour and linked control semantics and behaviour.\n * e.g. 'select' will make the linked input control `readonly`.\n */\n @Prop() type: 'select' | 'selctMulti' | 'input' = 'input';\n\n /** return all the active options currently within the datalist. Can be useful for validation */\n @Prop()\n get activeOptions() {\n return this.allOptEles;\n }\n\n /** Force datalist open */\n @Prop({ mutable: true }) open: boolean = false;\n\n @Watch('open')\n openWatcher() {\n writeTask(() => {\n this.nanoDropdown.open = this.open;\n this.connectedInput.setAttribute('aria-expanded', this.open.toString());\n });\n }\n\n /** Use this option to disable to default filtering. This is useful if filtering happens\n * externally via another method (e.g. via ajax)\n */\n @Prop() disableFilter = false;\n\n /** Activate / deactivate the datalist control */\n @Prop() disabled = false;\n\n // State change watchers\n\n @Watch('input')\n async watchInputChange() {\n let nanoInput;\n if ((nanoInput = this.host.closest('nano-input'))) {\n this.isNanoInput = true;\n this.connectedInput = await nanoInput.getInputElement();\n } else if (\n this.input &&\n typeof this.input === 'string' &&\n (nanoInput = document.querySelector(this.input))\n ) {\n this.isNanoInput = false;\n this.connectedInput = nanoInput;\n } else if (this.input instanceof HTMLElement) {\n this.connectedInput = this.input;\n }\n }\n\n @Watch('options')\n manageSlotChangeListener() {\n if (!this.host) return;\n\n // we're not using `options` - setup new MO\n if ((!this.options || !this.options.length) && !this.mo) {\n if (Build.isBrowser) {\n const mo = (this.mo = new MutationObserver(() =>\n this.processSlottedContent()\n ));\n mo.observe(this.host, { childList: true, subtree: true });\n }\n this.processSlottedContent();\n return;\n }\n\n // we're using `options` - trash current MO\n if (this.options?.length) {\n if (!!this.mo) {\n this.mo.disconnect();\n this.mo = undefined;\n }\n\n // add imperative `options`\n writeTask(() => {\n this.allOptEles = this.options.flatMap((option, i) => {\n if (option.value || option.label) {\n const opt = Object.assign(document.createElement('nano-option'), {\n label: option.label,\n value: option.value,\n ariaPosinset: i,\n ariaSetsize: this.options.length,\n selected: option.selected,\n id: this.listId + '-option-' + i,\n textContent: option.label ? option.label : option.value,\n slot: 'internal-opts',\n });\n this.host.append(opt);\n return opt;\n }\n });\n\n if (this.connectedInput?.value.length && this.type !== 'select') {\n this.inputChange();\n } else this.actvOptEles = [...this.allOptEles];\n });\n }\n // forceUpdate(this.host);\n }\n\n @Watch('type')\n @Watch('connectedInput')\n watchTypeChange() {\n if (!this.connectedInput) return;\n\n let dwConfig: Partial<Dropdown> = { closeOnSelect: false };\n let autocompleteType: 'list' | 'both' = 'both';\n let readonly = false;\n\n switch (this.type) {\n case 'selctMulti':\n // dwConfig.closeOnSelect = false;\n break;\n case 'select':\n autocompleteType = 'list';\n readonly = true;\n dwConfig = { closeOnSelect: true, placement: 'center' };\n break;\n }\n\n if (!this.isNanoInput) {\n dwConfig.tetherTo = this.connectedInput;\n }\n\n this.dropDownConfig = { ...this.dropDownConfig, ...dwConfig };\n this.connectedInput.setAttribute('aria-autocomplete', autocompleteType);\n this.connectedInput.readOnly = readonly;\n }\n\n @Watch('connectedInput')\n manageInputEvents(newInput?: HTMLInputElement, oldInput?: HTMLInputElement) {\n if (!!oldInput) {\n const nanoInput = oldInput.closest('nano-input');\n if (nanoInput) {\n nanoInput.removeEventListener('nanoChange', this.inputChange);\n }\n oldInput.removeEventListener('change', this.inputChange);\n oldInput.removeEventListener('click', this.inputClick);\n oldInput.removeEventListener('keydown', this.inputKeydown);\n oldInput.removeEventListener('input', this.inputChange);\n\n this.inputLabel = null;\n\n writeTask(() => {\n oldInput.removeAttribute('role');\n oldInput.removeAttribute('aria-expanded');\n oldInput.removeAttribute('aria-controls');\n oldInput.removeAttribute('aria-owns');\n oldInput.removeAttribute('aria-haspopup');\n oldInput.removeAttribute('aria-autocomplete');\n oldInput.removeAttribute('autocomplete');\n });\n }\n if (!!newInput) {\n const nanoInput = newInput.closest('nano-input');\n if (nanoInput) {\n nanoInput.addEventListener('nanoChange', this.inputChange);\n }\n newInput.addEventListener('change', this.inputChange);\n newInput.addEventListener('click', this.inputClick);\n newInput.addEventListener('keydown', this.inputKeydown);\n newInput.addEventListener('input', this.inputChange);\n this.listId = this.host.id || this.listId;\n\n this.inputLabel = newInput?.labels?.item(0) || findLabel(newInput);\n\n writeTask(() => {\n this.host.id = this.listId;\n newInput.setAttribute('role', 'combobox');\n newInput.setAttribute('aria-expanded', 'false');\n newInput.setAttribute('aria-controls', this.listId);\n newInput.setAttribute('aria-owns', this.listId);\n newInput.setAttribute('aria-haspopup', 'listbox');\n newInput.setAttribute('autocomplete', 'off');\n });\n }\n }\n\n @Watch('selected')\n @Watch('actvOptEles')\n watchActvOptChange() {\n let c = 0;\n const val = this.connectedInput?.value || '';\n const optIds = [];\n\n writeTask(() => {\n this.allOptEles.forEach((opt, i) => {\n if (this.actvOptEles.includes(opt)) {\n c++;\n opt.setAttribute('aria-posinset', c + '');\n opt.setAttribute('aria-setsize', this.actvOptEles.length + '');\n opt.hidden = false;\n this.isSelected(opt, val);\n } else {\n opt.removeAttribute('aria-posinset');\n opt.removeAttribute('aria-setsize');\n opt.hidden = true;\n opt.selected = false;\n }\n opt.id = this.listId + '-option-' + i;\n optIds.push(opt.id);\n });\n this.optionIds = optIds;\n });\n }\n\n @Watch('actvOptEles')\n @Watch('hasNoResult')\n manageCanOpen() {\n if (this.actvOptEles.length || this.hasNoResult) this.canOpen = true;\n else this.canOpen = false;\n }\n\n /**\n * Opens the dropdown if it can, it should and there are items to display.\n */\n @Watch('shouldOpen')\n @Watch('canOpen')\n manageDropdownDisplay() {\n if (this.shouldOpen && this.canOpen && !this.disabled) this.open = true;\n if (!this.shouldOpen || !this.canOpen) this.open = false;\n this.openWatcher();\n }\n\n @Watch('actvOptEles')\n fireActiveOptsEvent() {\n this.nanoOptionsUpdated.emit(this.actvOptEles);\n }\n\n // Events\n\n /** Fired when an item is selected. */\n @Event() nanoSelect: EventEmitter<HTMLNanoOptionElement>;\n\n /** Fired when a currently selected item is reselected. */\n @Event() nanoDeselect: EventEmitter<HTMLNanoOptionElement>;\n\n /** Fired when active options change */\n @Event() nanoOptionsUpdated: EventEmitter<HTMLNanoOptionElement[]>;\n\n // Private logic\n\n private isSelected(opt: HTMLNanoOptionElement, val: string) {\n if (val === opt.value || this.selected.includes(opt.value)) {\n opt.selected = true;\n } else opt.selected = false;\n }\n\n private get dropwdownOpen() {\n if (!this.nanoDropdown || !this.open) return false;\n return true;\n }\n\n private get exactMatch() {\n return this.allOptEles.find(\n (opt) => this.connectedInput.value === opt.value\n );\n }\n\n /** reflect value back to the connected input unless the event is cancelled */\n private changeInputValue(opt: HTMLNanoOptionElement) {\n let nanoSelected;\n\n if (this.selected.includes(opt.value)) {\n // deselect option\n this.selected = this.selected.filter((val) => val !== opt.value);\n nanoSelected = this.nanoDeselect.emit(opt);\n } else {\n // select new option\n this.selected = [...this.selected];\n nanoSelected = this.nanoSelect.emit(opt);\n }\n\n if (!nanoSelected.defaultPrevented) {\n if (this.connectedInput) this.connectedInput.value = opt.value;\n\n const event = new window.Event('change');\n this.connectedInput?.dispatchEvent(event);\n }\n }\n\n // a new option has been picked\n private optSelected = (e: CustomEvent<HTMLNanoOptionElement>) => {\n e.stopPropagation();\n this.changeInputValue(e.detail);\n raf(() => this.inputChange());\n\n if (this.type === 'select') this.shouldOpen = false;\n };\n\n // this is for type=\"select\" only.\n // Filter options that start with text - aggregates letters (as opposed to getting the value from input)\n private setOptStartsWith() {\n const attrFind = (toFind: string) =>\n toFind.toLowerCase().substring(0, this.typeToSelect.length) ===\n this.typeToSelect;\n\n const foundEle = this.allOptEles.find(\n (opt) =>\n opt.value.trim().length > 0 &&\n !opt.disabled &&\n (attrFind(opt.textContent) ||\n attrFind(opt.value) ||\n attrFind(opt.label) ||\n attrFind(opt.filterMeta))\n );\n if (foundEle) this.changeInputValue(foundEle);\n }\n\n // Event handlers\n\n private processSlottedContent() {\n raf(() => {\n this.allOptEles = Array.from(this.host.querySelectorAll('nano-option'));\n this.hasNoResult = !!this.host.querySelector('[slot=\"no-result\"]');\n\n if (this.connectedInput?.value.length && this.type !== 'select') {\n this.inputChange();\n } else this.actvOptEles = this.allOptEles;\n });\n }\n\n // sets focus immediately on open when 'select' - mirroring native behaviour\n private handleShow = async () => {\n if (this.shouldFocus) {\n this.shouldFocus = false;\n this.listBox.setFocus();\n } else if (this.type === 'select') this.listBox.showActiveElement();\n };\n\n // any changes to the connected input value will filter the list of active options\n private inputChange() {\n if (this.disableFilter) {\n this.actvOptEles = this.allOptEles;\n return;\n }\n\n const val = this.connectedInput.value;\n const valStr = val.trim().toLowerCase();\n\n let exactMatch = false;\n const activeEles = [];\n const attrFind = (toFind: string) =>\n toFind.toLowerCase().indexOf(valStr) > -1;\n\n this.allOptEles.forEach((opt) => {\n if (\n (val === opt.value || val === opt.label) &&\n this.type !== 'selctMulti'\n ) {\n opt.selected = true;\n exactMatch = true;\n } else this.isSelected(opt, val);\n });\n\n this.allOptEles.forEach((opt) => {\n if (!valStr.length || exactMatch) {\n activeEles.push(opt);\n } else if (\n opt.value.trim().length > 0 &&\n !opt.disabled &&\n (attrFind(opt.textContent) ||\n attrFind(opt.value) ||\n attrFind(opt.label) ||\n attrFind(opt.filterMeta))\n ) {\n activeEles.push(opt);\n }\n });\n\n this.isFiltered = valStr.length && !exactMatch;\n this.actvOptEles = activeEles;\n }\n\n private inputClick = () => {\n this.shouldOpen = true;\n // open dropdown if possible\n this.manageDropdownDisplay();\n };\n\n private inputKeydown = (e: KeyboardEvent) => {\n const ignoreKeys = [\n 'Shift',\n 'ArrowRight',\n 'ArrowLeft',\n 'Escape',\n 'Enter',\n 'Tab',\n ];\n if (ignoreKeys.includes(e.key)) {\n if (e.key === 'Tab') this.shouldOpen = false;\n return;\n }\n\n // When select, mirror native select behaviour. Search on closed list\n if (\n this.type === 'select' &&\n !['ArrowDown', 'ArrowUp'].includes(e.key) &&\n (e.key !== ' ' || this.typeToSelectTimeout)\n ) {\n if (e.key === ' ' || /^[a-z0-9]+$/i.test(e.key)) {\n clearTimeout(this.typeToSelectTimeout);\n this.typeToSelectTimeout = window.setTimeout(() => {\n this.typeToSelect = '';\n this.typeToSelectTimeout = 0;\n }, 750);\n this.typeToSelect += e.key;\n this.setOptStartsWith();\n }\n return;\n }\n\n this.shouldOpen = true;\n // open dropdown if possible\n this.manageDropdownDisplay();\n if (['ArrowDown', 'ArrowUp'].includes(e.key)) this.shouldFocus = true;\n };\n\n // handles key down on options. Either 'picks'\n // an option or passes event back to input for search / filter\n private optionKeyDown = (\n e: KeyboardEvent & { target: HTMLNanoOptionElement }\n ) => {\n const ignoreKeys = [\n 'Shift',\n 'ArrowUp',\n 'ArrowDown',\n 'Escape',\n 'Enter',\n 'Tab',\n 'Space',\n 'PageUp',\n 'PageDown',\n 'Home',\n 'End',\n ' ',\n ];\n if (ignoreKeys.includes(e.key)) {\n if (e.key === 'Escape') this.connectedInput.focus();\n return;\n }\n\n const deleteKeys = ['Delete', 'Backspace'];\n // this passes whatever's typed back to our input control\n if (\n this.type !== 'select' &&\n (!this.exactMatch || deleteKeys.includes(e.key))\n ) {\n this.connectedInput.focus();\n }\n };\n\n // Component lifecycle\n\n connectedCallback() {\n this.watchInputChange();\n }\n\n componentDidLoad() {\n this.manageSlotChangeListener();\n this.openWatcher();\n }\n\n componentDidRender(): void {\n setTimeout(() => {\n if (!this.connectedInput)\n console.warn(\n 'no `nano-input` found. `nano-datalist` should be nested within an `nano-input` or linked via `input` prop',\n this.host\n );\n }, 500);\n }\n\n render() {\n return (\n <Host\n role=\"listbox\"\n aria-owns={this.optionIds.join(' ')}\n aria-label=\"Select options from the list below\"\n >\n <nano-dropdown\n {...this.dropDownConfig}\n ref={(el) => (this.nanoDropdown = el)}\n dialogTitle=\"Select options from the list below\"\n class={{\n dlist__dropdown: true,\n 'dlist--isfiltered': this.isFiltered,\n }}\n onNanoAfterShow={this.handleShow}\n onNanoAfterHide={(_) => (this.open = false)}\n >\n <nano-menu\n hidden={!this.actvOptEles.length}\n type=\"listbox\"\n label={this.inputLabel ? this.inputLabel.textContent : undefined}\n class={{\n dlist__menu: true,\n 'dlist__menu--open': this.dropwdownOpen,\n }}\n tabIndex={-1}\n onNanoSelect={this.optSelected}\n onKeyDown={this.optionKeyDown}\n ref={(el) => (this.listBox = el)}\n >\n <slot name=\"list-top\" />\n {!this.options.length && <slot />}\n {!!this.options.length && <slot name=\"internal-opts\" />}\n <slot name=\"list-bottom\" />\n </nano-menu>\n <nano-menu\n type=\"listbox\"\n label=\"No results found\"\n hidden={!!this.actvOptEles.length}\n class={{\n dlist__menu: true,\n 'dlist__menu--open': this.dropwdownOpen,\n }}\n >\n <slot name=\"no-result\" />\n </nano-menu>\n {!!this.actvOptEles && (\n <div aria-live=\"polite\" role=\"status\" class=\"dlist__status\">\n {this.actvOptEles.length} result\n {this.actvOptEles.length > 1 ? 's' : ''} available.\n </div>\n )}\n </nano-dropdown>\n </Host>\n );\n }\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --padding-start: padding at the start of nav-items (left r2l / right l2r). Defaults to '10px'\n * @prop --padding-end: padding at the end of nav-items (right r2l / left l2r). Defaults to '10px'\n * @prop --padding-top: padding at the top of nav-items. Defaults to '10px'\n * @prop --padding-bottom: padding at the bottom of nav-items. Defaults to '10px'\n\n * @prop --secondary-padding-top: padding at the top of nested nav-items. Defaults to 0\n * @prop --secondary-padding-bottom: padding at the bottom of nested nav-items. Defaults to 0\n\n * @prop --bg-color-hover: bg hover color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n * @prop --bg-color-focus: bg focus color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n * @prop --bg-color-selected: bg selected color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n\n * @prop --color-hover: text hover color of nav-items. Defaults to #{map.get($colors, blue)}\n * @prop --color-selected: text selected color of nav-items. Defaults to #{map.get($colors, blue)}\n * @prop --color-focus: text focus color of nav-items. Defaults to #{map.get($colors, blue)}\n\n * @prop --focus-outline: the focus style of nav-items. Defaults to 'none'\n * @prop --font-size: default font-size for all items. Defaults .9em;\n */\n\n --padding-start: #{$spacing-medium};\n --padding-end: #{$spacing-medium};\n --padding-top: #{$spacing-small};\n --padding-bottom: #{$spacing-small};\n --secondary-padding-top: 0;\n --secondary-padding-bottom: 0;\n --bg-color-hover: #{map.get($colors, blue--faded)};\n --bg-color-focus: #{map.get($colors, blue--faded)};\n --bg-color-selected: #{map.get($colors, blue--faded)};\n --color-hover: #{map.get($colors, blue)};\n --color-selected: #{map.get($colors, blue)};\n --color-focus: #{map.get($colors, blue)};\n --focus-outline: none;\n --font-size: 0.9em;\n\n display: block;\n}\n\n.menu {\n font-size: var(--font-size, 0.9em);\n overscroll-behavior: none;\n min-width: var(--width);\n position: relative;\n\n &:focus {\n outline: none;\n }\n}\n\n::slotted(*:not(nano-nav-item):not(nano-option):not(hr):not(slot)) {\n @include padding(\n var(--padding-top),\n var(--padding-end),\n var(--padding-bottom),\n var(--padding-start)\n );\n\n display: block;\n}\n","import {\n Component,\n Event,\n EventEmitter,\n Method,\n h,\n Host,\n Element,\n Prop,\n Listen,\n} from '@stencil/core';\nimport {\n getTextContent,\n getDirectChildren,\n getActiveElement,\n} from '../../utils';\n\nconst CANSHADOW = !!document.head.attachShadow;\n\ntype ValidElement = HTMLNanoNavItemElement | HTMLNanoOptionElement;\ntype NNI = HTMLNanoNavItemElement;\n\n/**\n * Menu element. Commonly wrapped by `nano-dropdown` with `nano-option` and `nano-nav-item` elements nested.\n * Manages focus state / active.\n * @slot - The menu's content; `nano-option`, `nano-nav-item` elements as well as <hr> and more.\n */\n@Component({\n tag: 'nano-menu',\n styleUrl: 'menu.scss',\n shadow: true,\n})\nexport class Menu {\n private ignoreMouseEvents = false;\n private ignoreMouseTimeout: any;\n private menu: HTMLElement;\n private typeToSelect = '';\n private typeToSelectTimeout: any;\n\n @Element() private el: HTMLNanoMenuElement;\n\n // Public API\n\n /** get the focus state of the menu @readonly */\n @Prop()\n get hasFocus() {\n return this._hasFocus;\n }\n private _hasFocus = false;\n\n /** changes the role of the underlying control - sometimes required for semantics */\n @Prop() type: 'menu' | 'listbox' = 'menu';\n\n /** an accessible label */\n @Prop() label: string;\n\n // Events\n\n /** Emitted when the menu gains focus. */\n @Event() nanoFocus: EventEmitter;\n\n /** Emitted when the menu loses focus. */\n @Event() nanoBlur: EventEmitter;\n\n /** Emitted when a menu item is selected. */\n @Event() nanoSelect: EventEmitter<\n HTMLNanoOptionElement | HTMLNanoNavItemElement\n >;\n\n // Public Methods\n\n /** Sets focus on the menu. */\n @Method()\n async setFocus() {\n if (this.menu?.focus) this.menu.focus({ preventScroll: true });\n }\n\n /** Removes focus from the menu. */\n @Method()\n async removeFocus() {\n if (this.menu?.blur) this.menu.blur();\n }\n\n /** Sets the current active item */\n @Method()\n async showActiveElement() {\n if (this.selectedItem)\n this.selectedItem.scrollIntoView({ block: 'nearest' });\n }\n\n /** Removes any active item's state */\n @Method()\n async resetActiveItem() {\n this.getItems\n .filter((i) => i.tagName.toLowerCase() === 'nano-option')\n .map((i) => i.setAttribute('tabindex', '-1'));\n }\n\n // Private methods\n\n get getItems() {\n let items: ValidElement[];\n let opened = this.el.querySelectorAll('nano-nav-item.secondary-open');\n if (opened.length) {\n const ctx = opened[opened.length - 1] as HTMLNanoNavItemElement;\n items = Array.from(ctx.querySelectorAll('nano-nav-item, nano-option'));\n } else {\n items = getDirectChildren(\n this.el,\n 'nano-nav-item, nano-option',\n 'slot'\n ) as ValidElement[];\n }\n return items.filter((el) => !el.disabled && !el.hidden);\n }\n\n get activeItem() {\n const activeElement = getActiveElement();\n return this.getItems.find(\n (i) =>\n i.getAttribute('tabindex') === '0' ||\n i === activeElement ||\n i.classList.contains('has-focus')\n );\n }\n\n get selectedItem() {\n return this.getItems.find((i) => i.selected);\n }\n\n private async setActiveFocusItem(item?: ValidElement, focus = true) {\n const items = this.getItems;\n let activeItem =\n !item || item.disabled ? items.find((i) => i.selected) || items[0] : item;\n\n items\n .filter((i) => i.tagName.toLowerCase() === 'nano-option')\n .map((i: HTMLNanoOptionElement) =>\n i.setAttribute('tabindex', i === activeItem ? '0' : '-1')\n );\n\n if (!focus) return;\n\n if (activeItem) {\n (activeItem as NNI).setFocus\n ? (activeItem as NNI).setFocus()\n : activeItem.focus();\n } else this.menu.focus();\n }\n\n // Event Handlers\n\n @Listen('mousedown', { target: 'body' })\n @Listen('keydown')\n handleBlur(e: KeyboardEvent | MouseEvent) {\n if (!this.hasFocus) return;\n\n const kev = e as KeyboardEvent;\n let found: boolean;\n\n if (kev.key) {\n if (kev.key !== 'Tab') return;\n found =\n getActiveElement() &&\n getActiveElement().closest(this.el.tagName.toLowerCase()) === this.el;\n } else found = !!e.composedPath().find((el) => el === this.el);\n\n if (!found) {\n this.resetActiveItem();\n this._hasFocus = false;\n this.nanoBlur.emit();\n }\n }\n\n private handleFocus = () => {\n this.setActiveFocusItem(this.selectedItem || this.getItems[0]);\n\n this._hasFocus = true;\n this.nanoFocus.emit();\n };\n\n private handleClick = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n const item = target.closest('nano-nav-item');\n\n if (item && !item.disabled) {\n this.nanoSelect.emit(item);\n }\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n // When keying through the menu, if the mouse happens to be hovering over a menu item and the menu scrolls, the\n // mouseout/mouseover event will fire causing the selection to be different than what the user expects. This gives\n // us a way to temporarily ignore mouse events while the user is interacting with a keyboard.\n clearTimeout(this.ignoreMouseTimeout);\n this.ignoreMouseTimeout = setTimeout(\n () => (this.ignoreMouseEvents = false),\n 500\n );\n this.ignoreMouseEvents = true;\n\n // Make a selection when pressing enter\n switch (event.key) {\n case ' ':\n if (this.activeItem) this.activeItem.click();\n break;\n case 'ArrowDown':\n case 'ArrowUp':\n case 'PageDown':\n case 'PageUp':\n case 'Home':\n case 'End':\n const items = this.getItems;\n const selectedItem = this.activeItem;\n let index = items.indexOf(selectedItem);\n\n if (items.length) {\n event.preventDefault();\n\n if (event.key === 'ArrowDown') {\n index++;\n } else if (event.key === 'ArrowUp') {\n index--;\n } else if (event.key === 'Home' || event.key === 'PageUp') {\n index = 0;\n } else if (event.key === 'End' || event.key === 'PageDown') {\n index = items.length - 1;\n }\n\n if (index < 0) index = items.length - 1;\n if (index > items.length - 1) index = 0;\n\n this.setActiveFocusItem(items[index]);\n if (items[index]) items[index].scrollIntoView({ block: 'nearest' });\n return;\n }\n break;\n }\n\n // Handle type-to-search behavior when non-control characters are entered\n if (event.key === ' ' || /^[a-z0-9]+$/i.test(event.key)) {\n clearTimeout(this.typeToSelectTimeout);\n this.typeToSelectTimeout = setTimeout(\n () => (this.typeToSelect = ''),\n 750\n );\n this.typeToSelect += event.key;\n\n const items = this.getItems;\n for (const item of items) {\n const slot = item.shadowRoot.querySelector(\n 'slot:not([name])'\n ) as HTMLSlotElement;\n const label = getTextContent(slot).toLowerCase().trim();\n if (\n label.substring(0, this.typeToSelect.length) === this.typeToSelect\n ) {\n this.setActiveFocusItem(item);\n break;\n }\n }\n }\n };\n\n private handleMouseOver = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n const item =\n target.closest('nano-nav-item') || target.closest('nano-option');\n\n if (item && !this.ignoreMouseEvents) {\n this.setActiveFocusItem(item);\n }\n };\n\n // Component Lifecycle\n\n render() {\n return (\n <Host\n class={{\n legacy: !CANSHADOW,\n }}\n >\n <div\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n onMouseOver={this.handleMouseOver}\n onFocus={this.handleFocus}\n aria-label={this.label ? this.label : undefined}\n role={this.type}\n ref={(el) => (this.menu = el)}\n part=\"base\"\n class={{\n menu: true,\n ['menu--' + this.type]: true,\n 'menu--has-focus': this.hasFocus,\n }}\n tabIndex={-1}\n >\n <slot />\n </div>\n </Host>\n );\n }\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --padding-top: Defaults to #{$spacing-small};\n * @prop --padding-bottom: Defaults to #{$spacing-small};\n * @prop --padding-start: Defaults to #{$spacing-small};\n * @prop --padding-end: Defaults to #{$spacing-small};\n\n * @prop --bg: default background. Defaults to none;\n * @prop --bg-selected: background when selected. Defaults to #{$select-opt-selected};\n * @prop --bg-focus: background when focused. Defaults to var(--nano-color-base, #{nano-color(primary, tint)});\n * @prop --bg-disabled: background when disabled. Defaults to none;\n\n * @prop --color: default text color. Defaults to var(--input-text-color, #{$input-text-color});\n * @prop --color-selected: text color when selected. Defaults to var(--nano-color-base, #{nano-color(primary, base)});\n * @prop --color-focus: text color when focused. Defaults to var(--nano-color-base, #{nano-color(primary, contrast)});\n * @prop --color-disabled: text color when disabled. Defaults to #{map.get($colors, palegrey)};\n\n * @prop --opt-icon-size: Sizes all icons within the option. Defaults to 1.4em;\n */\n\n --bg: none;\n --bg-selected: #{$select-opt-selected};\n --bg-focus: var(--nano-color-base, #{nano-color(primary, tint)});\n --bg-disabled: none;\n --color: var(--input-text-color, #{$input-text-color});\n --color-selected: var(--nano-color-base, #{nano-color(primary, base)});\n --color-focus: var(--nano-color-contrast, #{nano-color(primary, contrast)});\n --color-disabled: #{map.get($colors, palegrey)};\n --opt-icon-size: 1.6em;\n\n display: block;\n color: var(--color);\n overflow: hidden;\n font-size: 14px;\n font-size: #{'clamp(12px, .9em, 16px)'};\n}\n\n:host(:focus) {\n outline: none;\n}\n\n.option {\n $self: &;\n\n position: relative;\n user-select: none;\n cursor: pointer;\n display: flex;\n align-items: stretch;\n width: 100%;\n background: var(--bg);\n\n @include padding(\n var(--padding-top),\n var(--padding-end),\n var(--padding-bottom),\n var(--padding-start)\n );\n\n // focus\n :host(:focus) &:not(.option--disabled),\n :host &.option--selected {\n outline: none;\n background: var(--bg-selected);\n color: var(--color-selected);\n }\n\n :host(:focus) &:not(.option--disabled) {\n background: var(--bg-focus);\n color: var(--color-focus);\n }\n\n // disabled\n &.option--disabled {\n outline: none;\n color: var(--color-disabled);\n cursor: not-allowed;\n background: var(--bg-disabled);\n }\n\n // no value\n &.option--novalue {\n font-style: italic;\n opacity: 0.7;\n }\n\n &__label {\n flex: 1 1 auto;\n display: flex;\n align-items: center;\n }\n\n &__start {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n\n ::slotted(nano-icon) {\n font-size: var(--opt-icon-size);\n }\n\n ::slotted(:last-child) {\n @include margin(null, 0.5em, null, null);\n }\n }\n\n &__end {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n\n ::slotted(nano-icon) {\n font-size: var(--opt-icon-size);\n }\n\n ::slotted(:first-child) {\n @include margin(null, null, null, 0.5em);\n }\n }\n\n &__check {\n visibility: hidden;\n display: flex;\n position: absolute;\n left: 0.6em;\n top: calc(50% - 0.6em);\n align-items: center;\n font-size: 0.9em;\n\n #{$self}--selected:not(#{$self}--novalue) & {\n visibility: visible;\n }\n }\n}\n","import {\n Component,\n Prop,\n h,\n Host,\n State,\n Watch,\n Element,\n Listen,\n Event,\n EventEmitter,\n} from '@stencil/core';\nimport { OptionInterface } from '../../interface';\nimport { debounce, getDirectChildren } from '../../utils';\n\nlet optIds = 0;\n\n/**\n * Select options to be used with [nano-select](/story/nano-components-select) or [nano-datalist](/story/nano-components-select)\n *\n * @slot - main label. Defaults to `label` or `value` prop\n * @slot checked-icon - icon to indicated checked / selected state. Defaults to fontawesome light/check\n * @slot start - suitable for an icon or content displayed at the start of the main label\n * @slot end - suitable for an icon or content displayed at the end of the main label\n */\n@Component({\n tag: 'nano-option',\n styleUrl: 'option.scss',\n shadow: true,\n})\nexport class Option implements OptionInterface {\n private optId = `nano-option-${optIds++}`;\n @Element() host: HTMLNanoOptionElement;\n @State() hasFocus = false;\n\n constructor() {\n this.handleClick = debounce(this.handleClick.bind(this), 5);\n }\n\n // Public API\n\n /**\n * Value of the option\n */\n @Prop({ mutable: true, reflect: true }) value: string = '';\n\n @Watch('value')\n valueChanged() {\n if (!this.value || !this.value.length) this.value = this.labelContent;\n }\n\n /**\n * Label of the option\n */\n @Prop({ mutable: true, reflect: true }) label: string = '';\n\n @Watch('label')\n labelChanged() {\n if (!this.label || !this.label.length)\n this.label = this.labelContent.length ? this.labelContent : this.value;\n }\n\n /**\n * Whether this option is selected\n */\n @Prop({ reflect: true }) selected: boolean = false;\n\n /**\n * Whether this option should be disabled\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** You can add extra meta for this option. When displayed in a list, users\n * search / filter via extra related terms. Another usecase is 'endonyms'\n */\n @Prop() filterMeta: string = '';\n\n /** Fired when an option is selected */\n @Event() nanoSelect!: EventEmitter<HTMLNanoOptionElement>;\n\n // Event handlers\n\n // stop scrolling on select\n @Listen('keydown')\n handleKeyDown(e: KeyboardEvent) {\n if (e.key !== ' ' && e.key !== 'Enter') return;\n e.preventDefault();\n this.nanoSelect.emit(this.host);\n }\n\n private handleClick() {\n if (this.disabled) return;\n this.nanoSelect.emit(this.host);\n }\n\n // Private logic\n\n private get labelContent() {\n return getDirectChildren(this.host, '*:not([slot])', false)\n .map((el) => el.textContent)\n .join(' ')\n .trim();\n }\n\n // Component lifecycle\n\n componentWillLoad() {\n this.valueChanged();\n this.labelChanged();\n }\n\n render() {\n return (\n <Host\n role=\"option\"\n aria-selected={this.selected ? 'true' : 'false'}\n aria-disabled={this.disabled ? 'true' : 'false'}\n >\n <div\n onMouseDown={this.handleClick}\n id={this.optId}\n class={{\n option: true,\n 'option--selected': this.selected,\n 'option--disabled': this.disabled,\n 'option--novalue': !this.value,\n }}\n >\n <div part=\"check-icon\" class=\"option__check\">\n <slot name=\"check-icon\">\n <nano-icon name=\"light/check\" aria-hidden=\"true\" />\n </slot>\n </div>\n <div part=\"start\" class=\"option__start\">\n <slot name=\"start\"></slot>\n </div>\n <div part=\"label\" class=\"option__label\">\n <slot>{this.label || this.value}</slot>\n </div>\n <div part=\"end\" class=\"option__end\">\n <slot name=\"end\"></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
|
1
|
+
{"version":3,"sources":["src/components/datalist/datalist.scss?tag=nano-datalist&encapsulation=shadow","src/components/datalist/datalist.tsx","src/components/menu/menu.scss?tag=nano-menu&encapsulation=shadow","src/components/menu/menu.tsx","src/components/option/option.scss?tag=nano-option&encapsulation=shadow","src/components/option/option.tsx"],"names":["datalistCss","findLabel","formCtrl","foundLabel","id","document","querySelector","closest","listIds","DataList","class_1","hostRef","_this","this","isNanoInput","typeToSelect","listId","isFiltered","shouldFocus","_allOptEles","actvOptEles","canOpen","optionIds","selected","_dropDownConfig","skidding","options","type","open","disableFilter","disabled","optSelected","e","stopPropagation","changeInputValue","detail","raf","inputChange","shouldOpen","handleShow","__awaiter","listBox","setFocus","showActiveElement","inputClick","manageDropdownDisplay","inputKeydown","ignoreKeys","includes","key","typeToSelectTimeout","test","clearTimeout","window","setTimeout","setOptStartsWith","preventDefault","optionKeyDown","connectedInput","focus","deleteKeys","exactMatch","debounce","bind","Object","defineProperty","prototype","opts","_a","value","forEach","opt","ddc","assign","allOptEles","openWatcher","writeTask","nanoDropdown","setAttribute","toString","watchInputChange","nanoInput","host","_b","getInputElement","_c","sent","input","HTMLElement","manageSlotChangeListener","length","mo","MutationObserver","processSlottedContent","observe","childList","subtree","disconnect","undefined","flatMap","option","i","label","createElement","ariaPosinset","ariaSetsize","textContent","slot","append","__spreadArray","watchTypeChange","dwConfig","closeOnSelect","autocompleteType","readonly","placement","tetherTo","dropDownConfig","readOnly","manageInputEvents","newInput","oldInput","removeEventListener","inputLabel","removeAttribute","addEventListener","labels","item","watchActvOptChange","c","val","optIds","hidden","isSelected","push","manageCanOpen","hasNoResult","fireActiveOptsEvent","nanoOptionsUpdated","emit","find","nanoSelected","filter","nanoDeselect","nanoSelect","defaultPrevented","event","Event","dispatchEvent","attrFind","toFind","toLowerCase","substring","foundEle","trim","filterMeta","Array","from","querySelectorAll","valStr","activeEles","indexOf","connectedCallback","componentDidLoad","componentDidRender","console","warn","render","h","Host","role","aria-owns","join","aria-label","ref","el","dialogTitle","class","dlist__dropdown","dlist--isfiltered","onNanoAfterShow","onNanoAfterHide","_","dlist__menu","dlist__menu--open","dropwdownOpen","tabIndex","onNanoSelect","onKeyDown","name","aria-live","menuCss","CANSHADOW","head","attachShadow","Menu","class_2","ignoreMouseEvents","_hasFocus","handleFocus","setActiveFocusItem","selectedItem","getItems","nanoFocus","handleClick","target","handleKeyDown","ignoreMouseTimeout","activeItem","click","items","index","scrollIntoView","block","_i","items_1","shadowRoot","getTextContent","handleMouseOver","menu","preventScroll","removeFocus","blur","resetActiveItem","tagName","map","opened","ctx","getDirectChildren","activeElement","getActiveElement","getAttribute","classList","contains","handleBlur","hasFocus","kev","found","composedPath","nanoBlur","legacy","onClick","onMouseOver","onFocus","part","optionCss","Option","optId","valueChanged","labelContent","labelChanged","componentWillLoad","aria-selected","aria-disabled","onMouseDown","option--selected","option--disabled","option--novalue","aria-hidden"],"mappings":"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","sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --padding-top: for all nested `nano-option` elements. Defaults to #{$spacing-small};\n * @prop --padding-bottom: for all nested `nano-option` elements. Defaults to #{$spacing-small};\n * @prop --padding-start: for all nested `nano-option` elements. Defaults to #{$spacing-xlarge};\n * @prop --padding-end: for all nested `nano-option` elements. Defaults to #{$spacing-xlarge};\n * @prop --font-size: for all nested `nano-option` elements. Defaults to .8em;\n * @prop --color: default text color of content other than `nano-option`. Defaults to #{map.get($colors, palegrey)};\n */\n\n --padding-top: #{$spacing-small};\n --padding-bottom: #{$spacing-small};\n --padding-start: #{$spacing-xlarge};\n --padding-end: #{$spacing-xlarge};\n --font-size: 0.8em;\n --color: #{map.get($colors, palegrey)};\n\n color: var(--color);\n}\n\n.dlist {\n &--isfiltered {\n ::slotted(*:not(nano-option):not([slot='no-result']):not([slot='list-top']):not([slot='list-bottom'])) {\n display: none !important;\n }\n }\n\n &__dropdown {\n --min-width: 100%;\n --overflow: auto;\n }\n\n &__status {\n @include visually-hide();\n }\n\n &__menu {\n --padding-top: inherit;\n --padding-bottom: inherit;\n --padding-start: inherit;\n --padding-end: inherit;\n --font-size: inherit;\n }\n}\n","import {\n Component,\n ComponentInterface,\n h,\n Host,\n Element,\n State,\n Watch,\n Prop,\n Event,\n EventEmitter,\n writeTask,\n Build,\n} from '@stencil/core';\nimport { debounce, raf } from '../../utils';\nimport type { Dropdown } from '../dropdown/dropdown';\nimport type { OptionInterface } from '../../interface';\n\nfunction findLabel(formCtrl: Element) {\n let foundLabel: HTMLLabelElement;\n\n if (formCtrl.id) {\n foundLabel = document.querySelector(`label[for='${formCtrl.id}']`);\n }\n if (!foundLabel) {\n foundLabel = formCtrl.closest('label');\n }\n return foundLabel;\n}\n\nlet listIds = 0;\n\n/**\n * `nano-datalist` a visually consistent and more flexible replacement for a native\n * [datalist](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist). Can be nested within a `nano-input`\n * or linked to any input control via the `input` prop. Is used internally within `nano-select`.\n * Options can be defined declaratively by nesting `<nano-option>` elements or imperatively using the `options` prop\n *\n * @slot - use `<nano-option>` elements for more complex html. Alternatively use the `options` prop\n * @slot list-top - shows at the top of the list when there are options present\n * @slot list-bottom - shows at the bottom of the list when there are options present\n * @slot no-result - shown when there are no results otherwise nothing will be shown\n */\n@Component({\n tag: 'nano-datalist',\n styleUrl: 'datalist.scss',\n shadow: true,\n})\nexport class DataList implements ComponentInterface {\n // Private State\n\n private isNanoInput = false;\n private typeToSelect = '';\n private typeToSelectTimeout: number;\n private nanoDropdown: HTMLNanoDropdownElement;\n private listBox: HTMLNanoMenuElement;\n private mo?: MutationObserver;\n private listId = `nano-datalist-${listIds++}`;\n private isFiltered = false;\n private shouldFocus = false;\n // all potential option eles. Set via slot or `options` prop.\n // Some may get hidden due to filtering\n private get allOptEles() {\n return this._allOptEles;\n }\n private set allOptEles(opts) {\n // when allOptEles are initially set (on slot change / options) -\n // add options to 'selected' and fire selected event *if*\n // value isn't set on the input\n this._allOptEles = opts;\n if (this.connectedInput?.value) return;\n\n opts.forEach((opt) => {\n if (opt.selected && !this.selected.includes(opt.value)) {\n this.changeInputValue(opt);\n }\n });\n }\n private _allOptEles: HTMLNanoOptionElement[] = [];\n\n @Element() host: HTMLNanoDatalistElement;\n\n // active option eles that are not hidden.\n @State() actvOptEles: HTMLNanoOptionElement[] = [];\n @State() connectedInput: HTMLInputElement | HTMLTextAreaElement;\n @State() inputLabel: HTMLLabelElement;\n @State() hasNoResult: boolean;\n @State() shouldOpen: boolean;\n @State() canOpen: boolean = true;\n @State() optionIds: string[] = [];\n\n constructor() {\n this.inputChange = debounce(this.inputChange.bind(this), 50);\n }\n\n // Public API\n\n /** By default, items in the list will appear 'selected' when the value in the linked input control matches.\n * However you can add other selected options via the the selected prop. */\n @Prop({ mutable: true }) selected: string[] = [];\n\n /** nano-dropdown config options you can pass to the nested dropdown component */\n @Prop()\n get dropDownConfig() {\n return this._dropDownConfig;\n }\n set dropDownConfig(ddc: Partial<Dropdown>) {\n this._dropDownConfig = { ...this._dropDownConfig, ...ddc };\n }\n private _dropDownConfig: Partial<Dropdown> = {\n skidding: -1,\n };\n\n /** Provide an option list.\n * Options can be defined declaratively by nesting `<nano-option>` elements or imperatively using this prop */\n @Prop() options?: OptionInterface[] = [];\n\n /** A selector to a HTMLInputElement */\n @Prop() input?: string | HTMLInputElement;\n\n /** Tweaks the datalist behaviour and linked control semantics and behaviour.\n * e.g. 'select' will make the linked input control `readonly`.\n */\n @Prop() type: 'select' | 'selctMulti' | 'input' = 'input';\n\n /** return all the active options currently within the datalist. Can be useful for validation */\n @Prop()\n get activeOptions() {\n return this.allOptEles;\n }\n\n /** Force datalist open */\n @Prop({ mutable: true }) open: boolean = false;\n\n @Watch('open')\n openWatcher() {\n writeTask(() => {\n this.nanoDropdown.open = this.open;\n this.connectedInput.setAttribute('aria-expanded', this.open.toString());\n });\n }\n\n /** Use this option to disable to default filtering. This is useful if filtering happens\n * externally via another method (e.g. via ajax)\n */\n @Prop() disableFilter = false;\n\n /** Activate / deactivate the datalist control */\n @Prop() disabled = false;\n\n // State change watchers\n\n @Watch('input')\n async watchInputChange() {\n let nanoInput;\n if ((nanoInput = this.host.closest('nano-input'))) {\n this.isNanoInput = true;\n this.connectedInput = await nanoInput.getInputElement();\n } else if (\n this.input &&\n typeof this.input === 'string' &&\n (nanoInput = document.querySelector(this.input))\n ) {\n this.isNanoInput = false;\n this.connectedInput = nanoInput;\n } else if (this.input instanceof HTMLElement) {\n this.connectedInput = this.input;\n }\n }\n\n @Watch('options')\n manageSlotChangeListener() {\n if (!this.host) return;\n\n // we're not using `options` - setup new MO\n if ((!this.options || !this.options.length) && !this.mo) {\n if (Build.isBrowser) {\n const mo = (this.mo = new MutationObserver(() =>\n this.processSlottedContent()\n ));\n mo.observe(this.host, { childList: true, subtree: true });\n }\n this.processSlottedContent();\n return;\n }\n\n // we're using `options` - trash current MO\n if (this.options?.length) {\n if (!!this.mo) {\n this.mo.disconnect();\n this.mo = undefined;\n }\n\n // add imperative `options`\n writeTask(() => {\n this.allOptEles = this.options.flatMap((option, i) => {\n if (option.value || option.label) {\n const opt = Object.assign(document.createElement('nano-option'), {\n label: option.label,\n value: option.value,\n ariaPosinset: i,\n ariaSetsize: this.options.length,\n selected: option.selected,\n id: this.listId + '-option-' + i,\n textContent: option.label ? option.label : option.value,\n slot: 'internal-opts',\n });\n this.host.append(opt);\n return opt;\n }\n });\n\n if (this.connectedInput?.value.length && this.type !== 'select') {\n this.inputChange();\n } else this.actvOptEles = [...this.allOptEles];\n });\n }\n // forceUpdate(this.host);\n }\n\n @Watch('type')\n @Watch('connectedInput')\n watchTypeChange() {\n if (!this.connectedInput) return;\n\n let dwConfig: Partial<Dropdown> = { closeOnSelect: false };\n let autocompleteType: 'list' | 'both' = 'both';\n let readonly = false;\n\n switch (this.type) {\n case 'selctMulti':\n // dwConfig.closeOnSelect = false;\n break;\n case 'select':\n autocompleteType = 'list';\n readonly = true;\n dwConfig = { closeOnSelect: true, placement: 'center' };\n break;\n }\n\n if (!this.isNanoInput) {\n dwConfig.tetherTo = this.connectedInput;\n }\n\n this.dropDownConfig = { ...this.dropDownConfig, ...dwConfig };\n this.connectedInput.setAttribute('aria-autocomplete', autocompleteType);\n this.connectedInput.readOnly = readonly;\n }\n\n @Watch('connectedInput')\n manageInputEvents(newInput?: HTMLInputElement, oldInput?: HTMLInputElement) {\n if (!!oldInput) {\n const nanoInput = oldInput.closest('nano-input');\n if (nanoInput) {\n nanoInput.removeEventListener('nanoChange', this.inputChange);\n }\n oldInput.removeEventListener('change', this.inputChange);\n oldInput.removeEventListener('click', this.inputClick);\n oldInput.removeEventListener('keydown', this.inputKeydown);\n oldInput.removeEventListener('input', this.inputChange);\n\n this.inputLabel = null;\n\n writeTask(() => {\n oldInput.removeAttribute('role');\n oldInput.removeAttribute('aria-expanded');\n oldInput.removeAttribute('aria-controls');\n oldInput.removeAttribute('aria-owns');\n oldInput.removeAttribute('aria-haspopup');\n oldInput.removeAttribute('aria-autocomplete');\n oldInput.removeAttribute('autocomplete');\n });\n }\n if (!!newInput) {\n const nanoInput = newInput.closest('nano-input');\n if (nanoInput) {\n nanoInput.addEventListener('nanoChange', this.inputChange);\n }\n newInput.addEventListener('change', this.inputChange);\n newInput.addEventListener('click', this.inputClick);\n newInput.addEventListener('keydown', this.inputKeydown);\n newInput.addEventListener('input', this.inputChange);\n this.listId = this.host.id || this.listId;\n\n this.inputLabel = newInput?.labels?.item(0) || findLabel(newInput);\n\n writeTask(() => {\n this.host.id = this.listId;\n newInput.setAttribute('role', 'combobox');\n newInput.setAttribute('aria-expanded', 'false');\n newInput.setAttribute('aria-controls', this.listId);\n newInput.setAttribute('aria-owns', this.listId);\n newInput.setAttribute('aria-haspopup', 'listbox');\n newInput.setAttribute('autocomplete', 'off');\n });\n }\n }\n\n @Watch('selected')\n @Watch('actvOptEles')\n watchActvOptChange() {\n let c = 0;\n const val = this.connectedInput?.value || '';\n const optIds = [];\n\n writeTask(() => {\n this.allOptEles.forEach((opt, i) => {\n if (this.actvOptEles.includes(opt)) {\n c++;\n opt.setAttribute('aria-posinset', c + '');\n opt.setAttribute('aria-setsize', this.actvOptEles.length + '');\n opt.hidden = false;\n this.isSelected(opt, val);\n } else {\n opt.removeAttribute('aria-posinset');\n opt.removeAttribute('aria-setsize');\n opt.hidden = true;\n opt.selected = false;\n }\n opt.id = this.listId + '-option-' + i;\n optIds.push(opt.id);\n });\n this.optionIds = optIds;\n });\n }\n\n @Watch('actvOptEles')\n @Watch('hasNoResult')\n manageCanOpen() {\n if (this.actvOptEles.length || this.hasNoResult) this.canOpen = true;\n else this.canOpen = false;\n }\n\n /**\n * Opens the dropdown if it can, it should and there are items to display.\n */\n @Watch('shouldOpen')\n @Watch('canOpen')\n manageDropdownDisplay() {\n if (this.shouldOpen && this.canOpen && !this.disabled) this.open = true;\n if (!this.shouldOpen || !this.canOpen) this.open = false;\n this.openWatcher();\n }\n\n @Watch('actvOptEles')\n fireActiveOptsEvent() {\n this.nanoOptionsUpdated.emit(this.actvOptEles);\n }\n\n // Events\n\n /** Fired when an item is selected. */\n @Event() nanoSelect: EventEmitter<HTMLNanoOptionElement>;\n\n /** Fired when a currently selected item is reselected. */\n @Event() nanoDeselect: EventEmitter<HTMLNanoOptionElement>;\n\n /** Fired when active options change */\n @Event() nanoOptionsUpdated: EventEmitter<HTMLNanoOptionElement[]>;\n\n // Private logic\n\n private isSelected(opt: HTMLNanoOptionElement, val: string) {\n if (val === opt.value || this.selected.includes(opt.value)) {\n opt.selected = true;\n } else opt.selected = false;\n }\n\n private get dropwdownOpen() {\n if (!this.nanoDropdown || !this.open) return false;\n return true;\n }\n\n private get exactMatch() {\n return this.allOptEles.find(\n (opt) => this.connectedInput.value === opt.value\n );\n }\n\n /** reflect value back to the connected input unless the event is cancelled */\n private changeInputValue(opt: HTMLNanoOptionElement) {\n let nanoSelected;\n\n if (this.selected.includes(opt.value)) {\n // deselect option\n this.selected = this.selected.filter((val) => val !== opt.value);\n nanoSelected = this.nanoDeselect.emit(opt);\n } else {\n // select new option\n this.selected = [...this.selected];\n nanoSelected = this.nanoSelect.emit(opt);\n }\n\n if (!nanoSelected.defaultPrevented) {\n if (this.connectedInput) this.connectedInput.value = opt.value;\n\n const event = new window.Event('change');\n this.connectedInput?.dispatchEvent(event);\n }\n }\n\n // a new option has been picked\n private optSelected = (e: CustomEvent<HTMLNanoOptionElement>) => {\n e.stopPropagation();\n this.changeInputValue(e.detail);\n raf(() => this.inputChange());\n\n if (this.type === 'select') this.shouldOpen = false;\n };\n\n // this is for type=\"select\" only.\n // Filter options that start with text - aggregates letters (as opposed to getting the value from input)\n private setOptStartsWith() {\n const attrFind = (toFind: string) =>\n toFind.toLowerCase().substring(0, this.typeToSelect.length) ===\n this.typeToSelect;\n\n const foundEle = this.allOptEles.find(\n (opt) =>\n opt.value.trim().length > 0 &&\n !opt.disabled &&\n (attrFind(opt.textContent) ||\n attrFind(opt.value) ||\n attrFind(opt.label) ||\n attrFind(opt.filterMeta))\n );\n if (foundEle) this.changeInputValue(foundEle);\n }\n\n // Event handlers\n\n private processSlottedContent() {\n raf(() => {\n this.allOptEles = Array.from(this.host.querySelectorAll('nano-option'));\n this.hasNoResult = !!this.host.querySelector('[slot=\"no-result\"]');\n\n if (this.connectedInput?.value.length && this.type !== 'select') {\n this.inputChange();\n } else this.actvOptEles = this.allOptEles;\n });\n }\n\n // sets focus immediately on open when 'select' - mirroring native behaviour\n private handleShow = async () => {\n if (this.shouldFocus) {\n this.shouldFocus = false;\n this.listBox.setFocus();\n } else if (this.type === 'select') this.listBox.showActiveElement();\n };\n\n // any changes to the connected input value will filter the list of active options\n private inputChange() {\n if (this.disableFilter) {\n this.actvOptEles = this.allOptEles;\n return;\n }\n\n const val = this.connectedInput.value;\n const valStr = val.trim().toLowerCase();\n\n let exactMatch = false;\n const activeEles = [];\n const attrFind = (toFind: string) =>\n toFind.toLowerCase().indexOf(valStr) > -1;\n\n this.allOptEles.forEach((opt) => {\n if (\n (val === opt.value || val === opt.label) &&\n this.type !== 'selctMulti'\n ) {\n opt.selected = true;\n exactMatch = true;\n } else this.isSelected(opt, val);\n });\n\n this.allOptEles.forEach((opt) => {\n if (!valStr.length || exactMatch) {\n activeEles.push(opt);\n } else if (\n opt.value.trim().length > 0 &&\n !opt.disabled &&\n (attrFind(opt.textContent) ||\n attrFind(opt.value) ||\n attrFind(opt.label) ||\n attrFind(opt.filterMeta))\n ) {\n activeEles.push(opt);\n }\n });\n\n this.isFiltered = valStr.length && !exactMatch;\n this.actvOptEles = activeEles;\n }\n\n private inputClick = () => {\n this.shouldOpen = true;\n // open dropdown if possible\n this.manageDropdownDisplay();\n };\n\n private inputKeydown = (e: KeyboardEvent) => {\n const ignoreKeys = [\n 'Shift',\n 'ArrowRight',\n 'ArrowLeft',\n 'Escape',\n 'Enter',\n 'Tab',\n ];\n if (ignoreKeys.includes(e.key)) {\n if (e.key === 'Tab') this.shouldOpen = false;\n return;\n }\n\n // When select, mirror native select behaviour. Search on closed list\n if (\n this.type === 'select' &&\n !['ArrowDown', 'ArrowUp'].includes(e.key) &&\n (e.key !== ' ' || this.typeToSelectTimeout)\n ) {\n if (e.key === ' ' || /^[a-z0-9]+$/i.test(e.key)) {\n clearTimeout(this.typeToSelectTimeout);\n this.typeToSelectTimeout = window.setTimeout(() => {\n this.typeToSelect = '';\n this.typeToSelectTimeout = 0;\n }, 750);\n this.typeToSelect += e.key;\n this.setOptStartsWith();\n }\n return;\n }\n\n this.shouldOpen = true;\n // open dropdown if possible\n this.manageDropdownDisplay();\n if (['ArrowDown', 'ArrowUp'].includes(e.key)) {\n e.preventDefault();\n this.shouldFocus = true;\n }\n };\n\n // handles key down on options. Either 'picks'\n // an option or passes event back to input for search / filter\n private optionKeyDown = (\n e: KeyboardEvent & { target: HTMLNanoOptionElement }\n ) => {\n const ignoreKeys = [\n 'Shift',\n 'ArrowUp',\n 'ArrowDown',\n 'Escape',\n 'Enter',\n 'Tab',\n 'Space',\n 'PageUp',\n 'PageDown',\n 'Home',\n 'End',\n ' ',\n ];\n if (ignoreKeys.includes(e.key)) {\n if (e.key === 'Escape') this.connectedInput.focus();\n return;\n }\n\n const deleteKeys = ['Delete', 'Backspace'];\n // this passes whatever's typed back to our input control\n if (\n this.type !== 'select' &&\n (!this.exactMatch || deleteKeys.includes(e.key))\n ) {\n this.connectedInput.focus();\n }\n };\n\n // Component lifecycle\n\n connectedCallback() {\n this.watchInputChange();\n }\n\n componentDidLoad() {\n this.manageSlotChangeListener();\n this.openWatcher();\n }\n\n componentDidRender(): void {\n setTimeout(() => {\n if (!this.connectedInput)\n console.warn(\n 'no `nano-input` found. `nano-datalist` should be nested within an `nano-input` or linked via `input` prop',\n this.host\n );\n }, 500);\n }\n\n render() {\n return (\n <Host\n role=\"listbox\"\n aria-owns={this.optionIds.join(' ')}\n aria-label=\"Select options from the list below\"\n >\n <nano-dropdown\n {...this.dropDownConfig}\n ref={(el) => (this.nanoDropdown = el)}\n dialogTitle=\"Select options from the list below\"\n class={{\n dlist__dropdown: true,\n 'dlist--isfiltered': this.isFiltered,\n }}\n onNanoAfterShow={this.handleShow}\n onNanoAfterHide={(_) => (this.open = false)}\n >\n <nano-menu\n hidden={!this.actvOptEles.length}\n type=\"listbox\"\n label={this.inputLabel ? this.inputLabel.textContent : undefined}\n class={{\n dlist__menu: true,\n 'dlist__menu--open': this.dropwdownOpen,\n }}\n tabIndex={-1}\n onNanoSelect={this.optSelected}\n onKeyDown={this.optionKeyDown}\n ref={(el) => (this.listBox = el)}\n >\n <slot name=\"list-top\" />\n {!this.options.length && <slot />}\n {!!this.options.length && <slot name=\"internal-opts\" />}\n <slot name=\"list-bottom\" />\n </nano-menu>\n <nano-menu\n type=\"listbox\"\n label=\"No results found\"\n hidden={!!this.actvOptEles.length}\n class={{\n dlist__menu: true,\n 'dlist__menu--open': this.dropwdownOpen,\n }}\n >\n <slot name=\"no-result\" />\n </nano-menu>\n {!!this.actvOptEles && (\n <div aria-live=\"polite\" role=\"status\" class=\"dlist__status\">\n {this.actvOptEles.length} result\n {this.actvOptEles.length > 1 ? 's' : ''} available.\n </div>\n )}\n </nano-dropdown>\n </Host>\n );\n }\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --padding-start: padding at the start of nav-items (left r2l / right l2r). Defaults to '10px'\n * @prop --padding-end: padding at the end of nav-items (right r2l / left l2r). Defaults to '10px'\n * @prop --padding-top: padding at the top of nav-items. Defaults to '10px'\n * @prop --padding-bottom: padding at the bottom of nav-items. Defaults to '10px'\n\n * @prop --secondary-padding-top: padding at the top of nested nav-items. Defaults to 0\n * @prop --secondary-padding-bottom: padding at the bottom of nested nav-items. Defaults to 0\n\n * @prop --bg-color-hover: bg hover color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n * @prop --bg-color-focus: bg focus color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n * @prop --bg-color-selected: bg selected color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n\n * @prop --color-hover: text hover color of nav-items. Defaults to #{map.get($colors, blue)}\n * @prop --color-selected: text selected color of nav-items. Defaults to #{map.get($colors, blue)}\n * @prop --color-focus: text focus color of nav-items. Defaults to #{map.get($colors, blue)}\n\n * @prop --focus-outline: the focus style of nav-items. Defaults to 'none'\n * @prop --font-size: default font-size for all items. Defaults .9em;\n */\n\n --padding-start: #{$spacing-medium};\n --padding-end: #{$spacing-medium};\n --padding-top: #{$spacing-small};\n --padding-bottom: #{$spacing-small};\n --secondary-padding-top: 0;\n --secondary-padding-bottom: 0;\n --bg-color-hover: #{map.get($colors, blue--faded)};\n --bg-color-focus: #{map.get($colors, blue--faded)};\n --bg-color-selected: #{map.get($colors, blue--faded)};\n --color-hover: #{map.get($colors, blue)};\n --color-selected: #{map.get($colors, blue)};\n --color-focus: #{map.get($colors, blue)};\n --focus-outline: none;\n --font-size: 0.9em;\n\n display: block;\n}\n\n.menu {\n font-size: var(--font-size, 0.9em);\n overscroll-behavior: none;\n min-width: var(--width);\n position: relative;\n\n &:focus {\n outline: none;\n }\n}\n\n::slotted(*:not(nano-nav-item):not(nano-option):not(hr):not(slot)) {\n @include padding(\n var(--padding-top),\n var(--padding-end),\n var(--padding-bottom),\n var(--padding-start)\n );\n\n display: block;\n}\n","import {\n Component,\n Event,\n EventEmitter,\n Method,\n h,\n Host,\n Element,\n Prop,\n Listen,\n} from '@stencil/core';\nimport {\n getTextContent,\n getDirectChildren,\n getActiveElement,\n} from '../../utils';\n\nconst CANSHADOW = !!document.head.attachShadow;\n\ntype ValidElement = HTMLNanoNavItemElement | HTMLNanoOptionElement;\ntype NNI = HTMLNanoNavItemElement;\n\n/**\n * Menu element. Commonly wrapped by `nano-dropdown` with `nano-option` and `nano-nav-item` elements nested.\n * Manages focus state / active.\n * @slot - The menu's content; `nano-option`, `nano-nav-item` elements as well as <hr> and more.\n */\n@Component({\n tag: 'nano-menu',\n styleUrl: 'menu.scss',\n shadow: true,\n})\nexport class Menu {\n private ignoreMouseEvents = false;\n private ignoreMouseTimeout: any;\n private menu: HTMLElement;\n private typeToSelect = '';\n private typeToSelectTimeout: any;\n\n @Element() private el: HTMLNanoMenuElement;\n\n // Public API\n\n /** get the focus state of the menu @readonly */\n @Prop()\n get hasFocus() {\n return this._hasFocus;\n }\n private _hasFocus = false;\n\n /** changes the role of the underlying control - sometimes required for semantics */\n @Prop() type: 'menu' | 'listbox' = 'menu';\n\n /** an accessible label */\n @Prop() label: string;\n\n // Events\n\n /** Emitted when the menu gains focus. */\n @Event() nanoFocus: EventEmitter;\n\n /** Emitted when the menu loses focus. */\n @Event() nanoBlur: EventEmitter;\n\n /** Emitted when a menu item is selected. */\n @Event() nanoSelect: EventEmitter<\n HTMLNanoOptionElement | HTMLNanoNavItemElement\n >;\n\n // Public Methods\n\n /** Sets focus on the menu. */\n @Method()\n async setFocus() {\n if (this.menu?.focus) this.menu.focus({ preventScroll: true });\n }\n\n /** Removes focus from the menu. */\n @Method()\n async removeFocus() {\n if (this.menu?.blur) this.menu.blur();\n }\n\n /** Sets the current active item */\n @Method()\n async showActiveElement() {\n if (this.selectedItem)\n this.selectedItem.scrollIntoView({ block: 'nearest' });\n }\n\n /** Removes any active item's state */\n @Method()\n async resetActiveItem() {\n this.getItems\n .filter((i) => i.tagName.toLowerCase() === 'nano-option')\n .map((i) => i.setAttribute('tabindex', '-1'));\n }\n\n // Private methods\n\n get getItems() {\n let items: ValidElement[];\n let opened = this.el.querySelectorAll('nano-nav-item.secondary-open');\n if (opened.length) {\n const ctx = opened[opened.length - 1] as HTMLNanoNavItemElement;\n items = Array.from(ctx.querySelectorAll('nano-nav-item, nano-option'));\n } else {\n items = getDirectChildren(\n this.el,\n 'nano-nav-item, nano-option',\n 'slot'\n ) as ValidElement[];\n }\n return items.filter((el) => !el.disabled && !el.hidden);\n }\n\n get activeItem() {\n const activeElement = getActiveElement();\n return this.getItems.find(\n (i) =>\n i.getAttribute('tabindex') === '0' ||\n i === activeElement ||\n i.classList.contains('has-focus')\n );\n }\n\n get selectedItem() {\n return this.getItems.find((i) => i.selected);\n }\n\n private async setActiveFocusItem(item?: ValidElement, focus = true) {\n const items = this.getItems;\n let activeItem =\n !item || item.disabled ? items.find((i) => i.selected) || items[0] : item;\n\n items\n .filter((i) => i.tagName.toLowerCase() === 'nano-option')\n .map((i: HTMLNanoOptionElement) =>\n i.setAttribute('tabindex', i === activeItem ? '0' : '-1')\n );\n\n if (!focus) return;\n\n if (activeItem) {\n (activeItem as NNI).setFocus\n ? (activeItem as NNI).setFocus()\n : activeItem.focus();\n } else this.menu.focus();\n }\n\n // Event Handlers\n\n @Listen('mousedown', { target: 'body' })\n @Listen('keydown')\n handleBlur(e: KeyboardEvent | MouseEvent) {\n if (!this.hasFocus) return;\n\n const kev = e as KeyboardEvent;\n let found: boolean;\n\n if (kev.key) {\n if (kev.key !== 'Tab') return;\n found =\n getActiveElement() &&\n getActiveElement().closest(this.el.tagName.toLowerCase()) === this.el;\n } else found = !!e.composedPath().find((el) => el === this.el);\n\n if (!found) {\n this.resetActiveItem();\n this._hasFocus = false;\n this.nanoBlur.emit();\n }\n }\n\n private handleFocus = () => {\n this.setActiveFocusItem(this.selectedItem || this.getItems[0]);\n\n this._hasFocus = true;\n this.nanoFocus.emit();\n };\n\n private handleClick = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n const item = target.closest('nano-nav-item');\n\n if (item && !item.disabled) {\n this.nanoSelect.emit(item);\n }\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n // When keying through the menu, if the mouse happens to be hovering over a menu item and the menu scrolls, the\n // mouseout/mouseover event will fire causing the selection to be different than what the user expects. This gives\n // us a way to temporarily ignore mouse events while the user is interacting with a keyboard.\n clearTimeout(this.ignoreMouseTimeout);\n this.ignoreMouseTimeout = setTimeout(\n () => (this.ignoreMouseEvents = false),\n 500\n );\n this.ignoreMouseEvents = true;\n\n // Make a selection when pressing enter\n switch (event.key) {\n case ' ':\n if (this.activeItem) this.activeItem.click();\n break;\n case 'ArrowDown':\n case 'ArrowUp':\n case 'PageDown':\n case 'PageUp':\n case 'Home':\n case 'End':\n const items = this.getItems;\n const selectedItem = this.activeItem;\n let index = items.indexOf(selectedItem);\n\n if (items.length) {\n event.preventDefault();\n\n if (event.key === 'ArrowDown') {\n index++;\n } else if (event.key === 'ArrowUp') {\n index--;\n } else if (event.key === 'Home' || event.key === 'PageUp') {\n index = 0;\n } else if (event.key === 'End' || event.key === 'PageDown') {\n index = items.length - 1;\n }\n\n if (index < 0) index = items.length - 1;\n if (index > items.length - 1) index = 0;\n\n this.setActiveFocusItem(items[index]);\n if (items[index]) items[index].scrollIntoView({ block: 'nearest' });\n return;\n }\n break;\n }\n\n // Handle type-to-search behavior when non-control characters are entered\n if (event.key === ' ' || /^[a-z0-9]+$/i.test(event.key)) {\n clearTimeout(this.typeToSelectTimeout);\n this.typeToSelectTimeout = setTimeout(\n () => (this.typeToSelect = ''),\n 750\n );\n this.typeToSelect += event.key;\n\n const items = this.getItems;\n for (const item of items) {\n const slot = item.shadowRoot.querySelector(\n 'slot:not([name])'\n ) as HTMLSlotElement;\n const label = getTextContent(slot).toLowerCase().trim();\n if (\n label.substring(0, this.typeToSelect.length) === this.typeToSelect\n ) {\n this.setActiveFocusItem(item);\n break;\n }\n }\n }\n };\n\n private handleMouseOver = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n const item =\n target.closest('nano-nav-item') || target.closest('nano-option');\n\n if (item && !this.ignoreMouseEvents) {\n this.setActiveFocusItem(item);\n }\n };\n\n // Component Lifecycle\n\n render() {\n return (\n <Host\n class={{\n legacy: !CANSHADOW,\n }}\n >\n <div\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n onMouseOver={this.handleMouseOver}\n onFocus={this.handleFocus}\n aria-label={this.label ? this.label : undefined}\n role={this.type}\n ref={(el) => (this.menu = el)}\n part=\"base\"\n class={{\n menu: true,\n ['menu--' + this.type]: true,\n 'menu--has-focus': this.hasFocus,\n }}\n tabIndex={-1}\n >\n <slot />\n </div>\n </Host>\n );\n }\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --padding-top: Defaults to #{$spacing-small};\n * @prop --padding-bottom: Defaults to #{$spacing-small};\n * @prop --padding-start: Defaults to #{$spacing-small};\n * @prop --padding-end: Defaults to #{$spacing-small};\n\n * @prop --bg: default background. Defaults to none;\n * @prop --bg-selected: background when selected. Defaults to #{$select-opt-selected};\n * @prop --bg-focus: background when focused. Defaults to var(--nano-color-base, #{nano-color(primary, tint)});\n * @prop --bg-disabled: background when disabled. Defaults to none;\n\n * @prop --color: default text color. Defaults to var(--input-text-color, #{$input-text-color});\n * @prop --color-selected: text color when selected. Defaults to var(--nano-color-base, #{nano-color(primary, base)});\n * @prop --color-focus: text color when focused. Defaults to var(--nano-color-base, #{nano-color(primary, contrast)});\n * @prop --color-disabled: text color when disabled. Defaults to #{map.get($colors, palegrey)};\n\n * @prop --opt-icon-size: Sizes all icons within the option. Defaults to 1.4em;\n */\n\n --bg: none;\n --bg-selected: #{$select-opt-selected};\n --bg-focus: var(--nano-color-base, #{nano-color(primary, tint)});\n --bg-disabled: none;\n --color: var(--input-text-color, #{$input-text-color});\n --color-selected: var(--nano-color-base, #{nano-color(primary, base)});\n --color-focus: var(--nano-color-contrast, #{nano-color(primary, contrast)});\n --color-disabled: #{map.get($colors, palegrey)};\n --opt-icon-size: 1.6em;\n\n display: block;\n color: var(--color);\n overflow: hidden;\n font-size: 14px;\n font-size: #{'clamp(12px, .9em, 16px)'};\n}\n\n:host(:focus) {\n outline: none;\n}\n\n.option {\n $self: &;\n\n position: relative;\n user-select: none;\n cursor: pointer;\n display: flex;\n align-items: stretch;\n width: 100%;\n background: var(--bg);\n\n @include padding(\n var(--padding-top),\n var(--padding-end),\n var(--padding-bottom),\n var(--padding-start)\n );\n\n // focus\n :host(:focus) &:not(.option--disabled),\n :host &.option--selected {\n outline: none;\n background: var(--bg-selected);\n color: var(--color-selected);\n }\n\n :host(:focus) &:not(.option--disabled) {\n background: var(--bg-focus);\n color: var(--color-focus);\n }\n\n // disabled\n &.option--disabled {\n outline: none;\n color: var(--color-disabled);\n cursor: not-allowed;\n background: var(--bg-disabled);\n }\n\n // no value\n &.option--novalue {\n font-style: italic;\n opacity: 0.7;\n }\n\n &__label {\n flex: 1 1 auto;\n display: flex;\n align-items: center;\n }\n\n &__start {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n\n ::slotted(nano-icon) {\n font-size: var(--opt-icon-size);\n }\n\n ::slotted(:last-child) {\n @include margin(null, 0.5em, null, null);\n }\n }\n\n &__end {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n\n ::slotted(nano-icon) {\n font-size: var(--opt-icon-size);\n }\n\n ::slotted(:first-child) {\n @include margin(null, null, null, 0.5em);\n }\n }\n\n &__check {\n visibility: hidden;\n display: flex;\n position: absolute;\n left: 0.6em;\n top: calc(50% - 0.6em);\n align-items: center;\n font-size: 0.9em;\n\n #{$self}--selected:not(#{$self}--novalue) & {\n visibility: visible;\n }\n }\n}\n","import {\n Component,\n Prop,\n h,\n Host,\n State,\n Watch,\n Element,\n Listen,\n Event,\n EventEmitter,\n} from '@stencil/core';\nimport { OptionInterface } from '../../interface';\nimport { debounce, getDirectChildren } from '../../utils';\n\nlet optIds = 0;\n\n/**\n * Select options to be used with [nano-select](/story/nano-components-select) or [nano-datalist](/story/nano-components-select)\n *\n * @slot - main label. Defaults to `label` or `value` prop\n * @slot checked-icon - icon to indicated checked / selected state. Defaults to fontawesome light/check\n * @slot start - suitable for an icon or content displayed at the start of the main label\n * @slot end - suitable for an icon or content displayed at the end of the main label\n */\n@Component({\n tag: 'nano-option',\n styleUrl: 'option.scss',\n shadow: true,\n})\nexport class Option implements OptionInterface {\n private optId = `nano-option-${optIds++}`;\n @Element() host: HTMLNanoOptionElement;\n @State() hasFocus = false;\n\n constructor() {\n this.handleClick = debounce(this.handleClick.bind(this), 5);\n }\n\n // Public API\n\n /**\n * Value of the option\n */\n @Prop({ mutable: true, reflect: true }) value: string = '';\n\n @Watch('value')\n valueChanged() {\n if (!this.value || !this.value.length) this.value = this.labelContent;\n }\n\n /**\n * Label of the option\n */\n @Prop({ mutable: true, reflect: true }) label: string = '';\n\n @Watch('label')\n labelChanged() {\n if (!this.label || !this.label.length)\n this.label = this.labelContent.length ? this.labelContent : this.value;\n }\n\n /**\n * Whether this option is selected\n */\n @Prop({ reflect: true }) selected: boolean = false;\n\n /**\n * Whether this option should be disabled\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** You can add extra meta for this option. When displayed in a list, users\n * search / filter via extra related terms. Another usecase is 'endonyms'\n */\n @Prop() filterMeta: string = '';\n\n /** Fired when an option is selected */\n @Event() nanoSelect!: EventEmitter<HTMLNanoOptionElement>;\n\n // Event handlers\n\n // stop scrolling on select\n @Listen('keydown')\n handleKeyDown(e: KeyboardEvent) {\n if (e.key !== ' ' && e.key !== 'Enter') return;\n e.preventDefault();\n this.nanoSelect.emit(this.host);\n }\n\n private handleClick() {\n if (this.disabled) return;\n this.nanoSelect.emit(this.host);\n }\n\n // Private logic\n\n private get labelContent() {\n return getDirectChildren(this.host, '*:not([slot])', false)\n .map((el) => el.textContent)\n .join(' ')\n .trim();\n }\n\n // Component lifecycle\n\n componentWillLoad() {\n this.valueChanged();\n this.labelChanged();\n }\n\n render() {\n return (\n <Host\n role=\"option\"\n aria-selected={this.selected ? 'true' : 'false'}\n aria-disabled={this.disabled ? 'true' : 'false'}\n >\n <div\n onMouseDown={this.handleClick}\n id={this.optId}\n class={{\n option: true,\n 'option--selected': this.selected,\n 'option--disabled': this.disabled,\n 'option--novalue': !this.value,\n }}\n >\n <div part=\"check-icon\" class=\"option__check\">\n <slot name=\"check-icon\">\n <nano-icon name=\"light/check\" aria-hidden=\"true\" />\n </slot>\n </div>\n <div part=\"start\" class=\"option__start\">\n <slot name=\"start\"></slot>\n </div>\n <div part=\"label\" class=\"option__label\">\n <slot>{this.label || this.value}</slot>\n </div>\n <div part=\"end\" class=\"option__end\">\n <slot name=\"end\"></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
var __awaiter=this&&this.__awaiter||function(e,t,n,i){function a(e){return e instanceof n?e:new n((function(t){t(e)}))}return new(n||(n=Promise))((function(n,o){function r(e){try{l(i.next(e))}catch(t){o(t)}}function s(e){try{l(i["throw"](e))}catch(t){o(t)}}function l(e){e.done?n(e.value):a(e.value).then(r,s)}l((i=i.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var n={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},i,a,o,r;return r={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(r[Symbol.iterator]=function(){return this}),r;function s(e){return function(t){return l([e,t])}}function l(r){if(i)throw new TypeError("Generator is already executing.");while(n)try{if(i=1,a&&(o=r[0]&2?a["return"]:r[0]?a["throw"]||((o=a["return"])&&o.call(a),0):a.next)&&!(o=o.call(a,r[1])).done)return o;if(a=0,o)r=[r[0]&2,o.value];switch(r[0]){case 0:case 1:o=r;break;case 4:n.label++;return{value:r[1],done:false};case 5:n.label++;a=r[1];r=[0];continue;case 7:r=n.ops.pop();n.trys.pop();continue;default:if(!(o=n.trys,o=o.length>0&&o[o.length-1])&&(r[0]===6||r[0]===2)){n=0;continue}if(r[0]===3&&(!o||r[1]>o[0]&&r[1]<o[3])){n.label=r[1];break}if(r[0]===6&&n.label<o[1]){n.label=o[1];o=r;break}if(o&&n.label<o[2]){n.label=o[2];n.ops.push(r);break}if(o[2])n.ops.pop();n.trys.pop();continue}r=t.call(e,n)}catch(s){r=[6,s];a=0}finally{i=o=0}if(r[0]&5)throw r[1];return{value:r[0]?r[1]:void 0,done:true}}};
|
2
2
|
/*!
|
3
3
|
* Web Components for Nanopore digital Web Apps
|
4
|
-
*/import{r as registerInstance,c as createEvent,h,e as Host,g as getElement}from"./index-c42becad.js";import{p as parseISODate,a as printISODate,c as createDate}from"./date-utils-e4b757ff.js";import{c as createColorClasses}from"./theme-1d4c8719.js";var dateInputCss=".sc-nano-date-input-h{-webkit-box-sizing:border-box;box-sizing:border-box}*.sc-nano-date-input,*.sc-nano-date-input::before,*.sc-nano-date-input::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden].sc-nano-date-input{display:none !important}.sc-nano-date-input-h{display:inline-block;width:100%;--focus-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));--open-btn-color:var(--nano-button-color, #f0efed);--open-btn-border:none;--close-btn-color:var(--nano-button-color, #f0efed);--picker-base-size:16px}.nano-color.sc-nano-date-input-h{--focus-shadow:0 0 0 0.1875rem rgba(var(--nano-color-tint-rgb), 0.56)}nano-icon.sc-nano-date-input{pointer-events:none}.date-field.sc-nano-date-input{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:relative}.date-field__dropdown.sc-nano-date-input{--padding:0;--overflow:visible;padding:0 !important;width:0 !important;width:100%;z-index:var(--nano-layer-index-dropdown, 300) !important}.date-field__close-bar.sc-nano-date-input{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;text-overflow:ellipsis;white-space:nowrap;border:0;margin:0;overflow:visible;padding:0;position:absolute;right:-8px;top:-8px;width:auto;z-index:1}.date-field__open.sc-nano-date-input{background:var(--open-btn-color);border:var(--open-btn-border);margin:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.date-field__open.sc-nano-date-input:focus{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);outline:none}.date-field__close.sc-nano-date-input{-webkit-appearance:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-moz-appearance:none;appearance:none;background:var(--close-btn-color);border:0;border-radius:50%;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;height:24px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:0;width:24px}@media (min-width: 36em){.date-field__close.sc-nano-date-input{opacity:0}}.date-field__close.sc-nano-date-input:focus{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);outline:none}@media (min-width: 36em){.date-field__close.sc-nano-date-input:focus{opacity:1}}.date-field__close.sc-nano-date-input nano-icon.sc-nano-date-input{margin:0 auto}.date-field.sc-nano-date-input nano-date-picker.sc-nano-date-input{font-size:var(--picker-base-size)}.vhidden.sc-nano-date-input{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}";var DateRegxps={d:"(\\d{1,2})",m:"(\\d{1,2})",y:"(\\d{4})"};var inputIds=0;var DateInput=function(){function e(e){var t=this;registerInstance(this,e);this.nanoChange=createEvent(this,"nanoChange",7);this.nanoValidate=createEvent(this,"nanoValidate",7);this.directInput=false;this.dateOrderIndeces={d:0,m:1,y:3};this.inputId="nano-input-"+inputIds++;this.locale=window.navigator.languages||window.navigator.language||undefined;this._invalid=false;this.helperText=true;this.helperTextFormat={year:"numeric",month:"long",day:"numeric"};this.floatLabel=false;this.name=this.inputId;this.readonly=false;this.disabled=false;this.autofocus=false;this.clearInput=false;this.value="";this.validateOn="submitThenDirty";this.showInlineError=true;this.dateOrder="dmy";this.required=false;this.hideLabel=false;this.picker=true;this.pickerOpen=false;this.closeAfterPicked=true;this._dropDownConfig={};this.onInputChange=function(e){e.stopPropagation();t.setValue(e.target.value)};this.onInputValidate=function(e){e.stopPropagation();t._invalid=!e.detail.isValid;t.nanoValidate.emit({isValid:e.detail.isValid,errorMessage:e.detail.errorMessage,originalEvent:e.detail.originalEvent})};this.onInputKey=function(){t.directInput=true};this.onDatePicked=function(e){t.directInput=false;t.value=e.detail.value;if(t.closeAfterPicked)t.pickerOpen=false};this.onDropdownHide=function(){setTimeout((function(e){return t.pickerOpen=false}),200);setTimeout((function(e){return t.trigger.focus()}),50)};this.onDropdownShow=function(){setTimeout((function(e){t.pickerEle.setFocus(false,t.pickerOpenSource==="key");t.pickerOpenSource=null}),200)};this.onTriggerClick=function(){if(!t.pickerOpen){t.pickerOpen=true;t.pickerOpenSource="mouse"}};this.onTriggerKey=function(e){if([" ","Enter"].includes(e.key)){if(!t.pickerOpen){t.pickerOpen=true;t.pickerOpenSource="key"}}};this.onCloseClick=function(){if(t.pickerOpen)t.pickerOpen=false};this.onCloseKeyDown=function(e){if(e.key==="Tab"&&e.shiftKey){t.pickerEle.setFocus(true);e.preventDefault()}if(e.key===" "||e.key==="Enter"){if(t.pickerOpen)t.pickerOpen=false}}}Object.defineProperty(e.prototype,"invalid",{get:function(){return this._invalid},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"validityMessage",{get:function(){if(!this.input)return"";return this.input.validityMessage},enumerable:false,configurable:true});e.prototype.handleValueChange=function(){var e=this;if(!this.directInput)this.inputValue=this.formatIsoDate(this.value);setTimeout((function(){e.nanoChange.emit({value:e.value,date:parseISODate(e.value)})}),20);this.directInput=false};e.prototype.handleDateOrderChange=function(){this.setDatePattern()};e.prototype.testDateValidity=function(){var e=this;var t=parseISODate(this.value);var n,i,a="";if(this.value&&t){if(this.min&&(n=parseISODate(this.min))&&t<n){a="Date below the minimum: "+n.toLocaleDateString(this.locale,this.helperTextFormat)}else if(this.max&&(i=parseISODate(this.max))&&t>i){a="Date above the maximum: "+i.toLocaleDateString(this.locale,this.helperTextFormat)}}requestAnimationFrame((function(n){return __awaiter(e,void 0,void 0,(function(){var e;return __generator(this,(function(n){switch(n.label){case 0:if(!this.input)return[2];return[4,this.input.getInputElement()];case 1:e=n.sent();if(this.value.length&&!t)a="Please enter a valid date";e.setCustomValidity(a);if(this.input.validateOn==="dirty"){this.input.showError(a)}return[2]}}))}))}))};e.prototype.handlePickerOpenChange=function(){this.dropdown.open=this.pickerOpen};Object.defineProperty(e.prototype,"dropDownConfig",{get:function(){return this._dropDownConfig},set:function(e){this._dropDownConfig=Object.assign(Object.assign({},this._dropDownConfig),e)},enumerable:false,configurable:true});e.prototype.reportValidity=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:return[4,this.input.reportValidity(e)];case 1:return[2,t.sent()]}}))}))};e.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){if(this.input)this.input.setFocus();return[2]}))}))};e.prototype.getInputElement=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){switch(e.label){case 0:return[4,this.input.getInputElement()];case 1:return[2,e.sent()]}}))}))};e.prototype.showError=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){if(!this.input)return[2];this.input.showError(e);return[2]}))}))};e.prototype.setDatePattern=function(){var e=this;var t=[];var n=[];Array.from(this.dateOrder).map((function(i,a){t.push(DateRegxps[i]);e.dateOrderIndeces[i]=a;n.push(i==="y"?"yyyy":i+i)}));this.pattern=t.join("\\W+");if(!this.placeholder&&this.placeholder!=="false")this.placeholder=n.join(" ")};e.prototype.formatIsoDate=function(e){var t=[];Array.from("ymd").map((function(e){return t.push(DateRegxps[e])}));var n=e.match(new RegExp(t.join("\\W+")));if(!n)return"";var i=[];i[this.dateOrderIndeces.d]=n[3];i[this.dateOrderIndeces.m]=n[2];i[this.dateOrderIndeces.y]=n[1];return i.join(" ")};e.prototype.setValue=function(e){var t=e.match(new RegExp(this.pattern));if(!t){this.value=e;return}var n=createDate(t[this.dateOrderIndeces.y+1],t[this.dateOrderIndeces.m+1],t[this.dateOrderIndeces.d+1]);if(!n){n=new Date(e);if(!n){this.value=e;return}}var i=printISODate(n);this.value=i;return i};e.prototype.connectedCallback=function(){this.setDatePattern();this.handleValueChange()};e.prototype.componentDidLoad=function(){var e=this;if(!this.pickerCloseBtn||!this.picker)return;this.pickerEle.firstFocusEle=this.pickerCloseBtn;this.dropdown.tetherTo=this.trigger;setTimeout((function(t){return e.handlePickerOpenChange()}),300)};e.prototype.render=function(){var e=this;this.locale=navigator.languages||navigator.language||undefined;this.dropDownConfig.placement=this.dropDownConfig.placement||"bottom-end";if(this.host.ownerDocument.dir==="rtl"){this.dropDownConfig.placement.replace("start","end")}if(this.trigger)this.dropDownConfig.tetherTo=this.trigger;var t=parseISODate(this.value);var n=!!this.host.querySelector('[slot="helper"]');return h(Host,{class:Object.assign({},createColorClasses(this.color))},h("div",{class:"date-field"},h("nano-input",{class:"date-field__input",slot:"trigger",required:this.required||undefined,showInlineError:this.showInlineError,validateOn:this.validateOn,placeholder:this.placeholder!=="false"?this.placeholder:undefined,pattern:this.pattern,label:this.label,disabled:this.disabled||undefined,color:this.color||undefined,autofocus:this.autofocus||undefined,clearInput:this.clearInput||undefined,onNanoChange:this.onInputChange,onNanoInput:this.onInputKey,onNanoValidate:this.onInputValidate,name:"",form:this.form||undefined,size:this.size||undefined,readonly:this.readonly,value:this.inputValue,ref:function(t){return e.input=t},floatLabel:this.floatLabel,hideLabel:this.hideLabel,inputmode:"numeric",part:"input"},h("slot",{name:"start",slot:"start"}),h("slot",{name:"label"}),h("slot",{name:"end",slot:"end"}),this.picker&&[h("button",{slot:"end",class:"date-field__open",type:"button",onKeyDown:this.onTriggerKey,onClick:this.onTriggerClick,ref:function(t){return e.trigger=t},disabled:this.disabled||this.readonly},h("nano-icon",{name:"light/calendar-alt"})),h("nano-dropdown",Object.assign({slot:"end",onNanoHide:this.onDropdownHide,onNanoShow:this.onDropdownShow,dialogTitle:"Choose a date",class:"date-field__dropdown",ref:function(t){return e.dropdown=t}},this.dropDownConfig,{part:"dropdown"}),h("div",null,h("div",{class:"date-field__close-bar"},h("button",{class:"date-field__close",type:"button",onMouseDown:this.onCloseClick,onKeyDown:this.onCloseKeyDown,ref:function(t){return e.pickerCloseBtn=t}},h("nano-icon",{name:"light/times"}),h("span",{class:"vhidden"},"Close window"))),h("nano-date-picker",{onNanoDatePicked:this.onDatePicked,min:this.min||undefined,max:this.max||undefined,"is-modal":true,ref:function(t){return e.pickerEle=t},localization:this.localization,selectedDate:this.value||this.initialPickerDate,firstDayOfWeek:this.firstDayOfWeek,color:this.color||undefined,part:"date-picker"})))],(n||this.helperText||this.showInlineError)&&h("span",{slot:"helper"},h("span",{class:{vhidden:!!this.value.length}},h("slot",{name:"helper"})),this.helperText&&!!t&&h("span",null,t.toLocaleDateString(this.locale,this.helperTextFormat)))),h("input",{type:"hidden",value:this.value,name:this.name})))};Object.defineProperty(e.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{value:["handleValueChange","testDateValidity"],dateOrder:["handleDateOrderChange"],min:["testDateValidity"],max:["testDateValidity"],pickerOpen:["handlePickerOpenChange"]}},enumerable:false,configurable:true});return e}();DateInput.style=dateInputCss;export{DateInput as nano_date_input};
|
4
|
+
*/import{r as registerInstance,c as createEvent,h,e as Host,g as getElement}from"./index-c42becad.js";import{p as parseISODate,a as printISODate,c as createDate}from"./date-utils-839cb010.js";import{c as createColorClasses}from"./theme-1d4c8719.js";var dateInputCss=".sc-nano-date-input-h{-webkit-box-sizing:border-box;box-sizing:border-box}*.sc-nano-date-input,*.sc-nano-date-input::before,*.sc-nano-date-input::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden].sc-nano-date-input{display:none !important}.sc-nano-date-input-h{display:inline-block;width:100%;--focus-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));--open-btn-color:var(--nano-button-color, #f0efed);--open-btn-border:none;--close-btn-color:var(--nano-button-color, #f0efed);--picker-base-size:16px}.nano-color.sc-nano-date-input-h{--focus-shadow:0 0 0 0.1875rem rgba(var(--nano-color-tint-rgb), 0.56)}nano-icon.sc-nano-date-input{pointer-events:none}.date-field.sc-nano-date-input{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:relative}.date-field__dropdown.sc-nano-date-input{--padding:0;--overflow:visible;padding:0 !important;width:0 !important;width:100%;z-index:var(--nano-layer-index-dropdown, 300) !important}.date-field__close-bar.sc-nano-date-input{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;text-overflow:ellipsis;white-space:nowrap;border:0;margin:0;overflow:visible;padding:0;position:absolute;right:-8px;top:-8px;width:auto;z-index:1}.date-field__open.sc-nano-date-input{background:var(--open-btn-color);border:var(--open-btn-border);margin:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.date-field__open.sc-nano-date-input:focus{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);outline:none}.date-field__close.sc-nano-date-input{-webkit-appearance:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-moz-appearance:none;appearance:none;background:var(--close-btn-color);border:0;border-radius:50%;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;height:24px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:0;width:24px}@media (min-width: 36em){.date-field__close.sc-nano-date-input{opacity:0}}.date-field__close.sc-nano-date-input:focus{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);outline:none}@media (min-width: 36em){.date-field__close.sc-nano-date-input:focus{opacity:1}}.date-field__close.sc-nano-date-input nano-icon.sc-nano-date-input{margin:0 auto}.date-field.sc-nano-date-input nano-date-picker.sc-nano-date-input{font-size:var(--picker-base-size)}.vhidden.sc-nano-date-input{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}";var DateRegxps={d:"(\\d{1,2})",m:"(\\d{1,2})",y:"(\\d{4})"};var inputIds=0;var DateInput=function(){function e(e){var t=this;registerInstance(this,e);this.nanoChange=createEvent(this,"nanoChange",7);this.nanoValidate=createEvent(this,"nanoValidate",7);this.directInput=false;this.dateOrderIndeces={d:0,m:1,y:3};this.inputId="nano-input-"+inputIds++;this.locale=window.navigator.languages||window.navigator.language||undefined;this._invalid=false;this.helperText=true;this.helperTextFormat={year:"numeric",month:"long",day:"numeric"};this.floatLabel=false;this.name=this.inputId;this.readonly=false;this.disabled=false;this.autofocus=false;this.clearInput=false;this.value="";this.validateOn="submitThenDirty";this.showInlineError=true;this.dateOrder="dmy";this.required=false;this.hideLabel=false;this.picker=true;this.pickerOpen=false;this.closeAfterPicked=true;this._dropDownConfig={};this.isDateDisabled=function(){return false};this.onInputChange=function(e){e.stopPropagation();t.setValue(e.target.value)};this.onInputValidate=function(e){e.stopPropagation();t._invalid=!e.detail.isValid;t.nanoValidate.emit({isValid:e.detail.isValid,errorMessage:e.detail.errorMessage,originalEvent:e.detail.originalEvent})};this.onInputKey=function(){t.directInput=true};this.onDatePicked=function(e){t.directInput=false;t.value=e.detail.value;if(t.closeAfterPicked)t.pickerOpen=false};this.onDropdownHide=function(){setTimeout((function(e){return t.pickerOpen=false}),200);setTimeout((function(e){return t.trigger.focus()}),50)};this.onDropdownShow=function(){setTimeout((function(e){t.pickerEle.setFocus(false,t.pickerOpenSource==="key");t.pickerOpenSource=null}),200)};this.onTriggerClick=function(){if(!t.pickerOpen){t.pickerOpen=true;t.pickerOpenSource="mouse"}};this.onTriggerKey=function(e){if([" ","Enter"].includes(e.key)){if(!t.pickerOpen){t.pickerOpen=true;t.pickerOpenSource="key"}}};this.onCloseClick=function(){if(t.pickerOpen)t.pickerOpen=false};this.onCloseKeyDown=function(e){if(e.key==="Tab"&&e.shiftKey){t.pickerEle.setFocus(true);e.preventDefault()}if(e.key===" "||e.key==="Enter"){if(t.pickerOpen)t.pickerOpen=false}}}Object.defineProperty(e.prototype,"invalid",{get:function(){return this._invalid},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"validityMessage",{get:function(){if(!this.input)return"";return this.input.validityMessage},enumerable:false,configurable:true});e.prototype.handleValueChange=function(){var e=this;if(!this.directInput)this.inputValue=this.formatIsoDate(this.value);setTimeout((function(){e.nanoChange.emit({value:e.value,date:parseISODate(e.value)})}),20);this.directInput=false};e.prototype.handleDateOrderChange=function(){this.setDatePattern()};e.prototype.testDateValidity=function(){var e=this;var t=parseISODate(this.value);var n,i,a="";if(this.value&&t){if(this.min&&(n=parseISODate(this.min))&&t<n){a="Date below the minimum: "+n.toLocaleDateString(this.locale,this.helperTextFormat)}if(this.max&&(i=parseISODate(this.max))&&t>i){a="Date above the maximum: "+i.toLocaleDateString(this.locale,this.helperTextFormat)}if(this.isDateDisabled(t)){a="Date selected is disabled."}}requestAnimationFrame((function(n){return __awaiter(e,void 0,void 0,(function(){var e;return __generator(this,(function(n){switch(n.label){case 0:if(!this.input)return[2];return[4,this.input.getInputElement()];case 1:e=n.sent();if(this.value.length&&!t)a="Please enter a valid date";e.setCustomValidity(a);if(this.input.validateOn==="dirty"){this.input.showError(a)}return[2]}}))}))}))};e.prototype.handlePickerOpenChange=function(){this.dropdown.open=this.pickerOpen};Object.defineProperty(e.prototype,"dropDownConfig",{get:function(){return this._dropDownConfig},set:function(e){this._dropDownConfig=Object.assign(Object.assign({},this._dropDownConfig),e)},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"dateValue",{get:function(){return parseISODate(this.value)},enumerable:false,configurable:true});e.prototype.reportValidity=function(e){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(n){switch(n.label){case 0:return[4,this.input.reportValidity(e)];case 1:t=n.sent();if(t.isValid&&e)this.testDateValidity();return[4,this.input.reportValidity(e)];case 2:return[2,n.sent()]}}))}))};e.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){if(this.input)this.input.setFocus();return[2]}))}))};e.prototype.getInputElement=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){switch(e.label){case 0:return[4,this.input.getInputElement()];case 1:return[2,e.sent()]}}))}))};e.prototype.showError=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){if(!this.input)return[2];this.input.showError(e);return[2]}))}))};e.prototype.setDatePattern=function(){var e=this;var t=[];var n=[];Array.from(this.dateOrder).map((function(i,a){t.push(DateRegxps[i]);e.dateOrderIndeces[i]=a;n.push(i==="y"?"yyyy":i+i)}));this.pattern=t.join("\\W+");if(!this.placeholder&&this.placeholder!=="false")this.placeholder=n.join(" ")};e.prototype.formatIsoDate=function(e){var t=[];Array.from("ymd").map((function(e){return t.push(DateRegxps[e])}));var n=e.match(new RegExp(t.join("\\W+")));if(!n)return"";var i=[];i[this.dateOrderIndeces.d]=n[3];i[this.dateOrderIndeces.m]=n[2];i[this.dateOrderIndeces.y]=n[1];return i.join(" ")};e.prototype.setValue=function(e){var t=e.match(new RegExp(this.pattern));if(!t){this.value=e;return}var n=createDate(t[this.dateOrderIndeces.y+1],t[this.dateOrderIndeces.m+1],t[this.dateOrderIndeces.d+1]);if(!n){n=new Date(e);if(!n){this.value=e;return}}var i=printISODate(n);this.value=i;return i};e.prototype.connectedCallback=function(){this.setDatePattern();this.handleValueChange()};e.prototype.componentDidLoad=function(){var e=this;if(!this.pickerCloseBtn||!this.picker)return;this.pickerEle.firstFocusEle=this.pickerCloseBtn;this.dropdown.tetherTo=this.trigger;setTimeout((function(t){return e.handlePickerOpenChange()}),300)};e.prototype.render=function(){var e=this;this.locale=navigator.languages||navigator.language||undefined;this.dropDownConfig.placement=this.dropDownConfig.placement||"bottom-end";if(this.host.ownerDocument.dir==="rtl"){this.dropDownConfig.placement.replace("start","end")}if(this.trigger)this.dropDownConfig.tetherTo=this.trigger;var t=parseISODate(this.value);var n=!!this.host.querySelector('[slot="helper"]');return h(Host,{class:Object.assign({},createColorClasses(this.color))},h("div",{class:"date-field"},h("nano-input",{class:"date-field__input",slot:"trigger",required:this.required||undefined,showInlineError:this.showInlineError,validateOn:this.validateOn,placeholder:this.placeholder!=="false"?this.placeholder:undefined,pattern:this.pattern,label:this.label,disabled:this.disabled||undefined,color:this.color||undefined,autofocus:this.autofocus||undefined,clearInput:this.clearInput||undefined,onNanoChange:this.onInputChange,onNanoInput:this.onInputKey,onNanoValidate:this.onInputValidate,name:"",form:this.form||undefined,size:this.size||undefined,readonly:this.readonly,value:this.inputValue,ref:function(t){return e.input=t},floatLabel:this.floatLabel,hideLabel:this.hideLabel,inputmode:"numeric",part:"input"},h("slot",{name:"start",slot:"start"}),h("slot",{name:"label"}),h("slot",{name:"end",slot:"end"}),this.picker&&[h("button",{slot:"end",class:"date-field__open",type:"button",onKeyDown:this.onTriggerKey,onClick:this.onTriggerClick,ref:function(t){return e.trigger=t},disabled:this.disabled||this.readonly},h("nano-icon",{name:"light/calendar-alt"})),h("nano-dropdown",Object.assign({slot:"end",onNanoHide:this.onDropdownHide,onNanoShow:this.onDropdownShow,dialogTitle:"Choose a date",class:"date-field__dropdown",ref:function(t){return e.dropdown=t}},this.dropDownConfig,{part:"dropdown"}),h("div",null,h("div",{class:"date-field__close-bar"},h("button",{class:"date-field__close",type:"button",onMouseDown:this.onCloseClick,onKeyDown:this.onCloseKeyDown,ref:function(t){return e.pickerCloseBtn=t}},h("nano-icon",{name:"light/times"}),h("span",{class:"vhidden"},"Close window"))),h("nano-date-picker",{isDateDisabled:this.isDateDisabled,onNanoDatePicked:this.onDatePicked,min:this.min||undefined,max:this.max||undefined,"is-modal":true,ref:function(t){return e.pickerEle=t},localization:this.localization,selectedDate:this.value||this.initialPickerDate,firstDayOfWeek:this.firstDayOfWeek,color:this.color||undefined,part:"date-picker"})))],(n||this.helperText||this.showInlineError)&&h("span",{slot:"helper"},h("span",{class:{vhidden:!!this.value.length}},h("slot",{name:"helper"})),this.helperText&&!!t&&h("span",null,t.toLocaleDateString(this.locale,this.helperTextFormat)))),h("input",{type:"hidden",value:this.value,name:this.name})))};Object.defineProperty(e.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{value:["handleValueChange","testDateValidity"],dateOrder:["handleDateOrderChange"],min:["testDateValidity"],max:["testDateValidity"],pickerOpen:["handlePickerOpenChange"]}},enumerable:false,configurable:true});return e}();DateInput.style=dateInputCss;export{DateInput as nano_date_input};
|
5
5
|
//# sourceMappingURL=nano-date-input.entry.js.map
|