@nanoporetech-digital/components 8.23.11 → 8.24.1
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/dist/cjs/{algolia-data-BqpBVN89.js → algolia-data-YqTcrA7B.js} +1 -1
- package/dist/cjs/{component-store-C5eBOK0w.js → component-store-BsFgDzFM.js} +1 -1
- package/dist/cjs/{constructible-style-BsHBb9au.js → constructible-style-D0zEjr9J.js} +1 -1
- package/dist/cjs/{dom-Dxk5vXYq.js → dom-GglTcT7o.js} +1 -1
- package/dist/cjs/{fade-kpIGI6CJ.js → fade-CDGKmRbB.js} +3 -3
- package/dist/cjs/{form-control-Bq9Dlz-r.js → form-control-DKTdW_gr.js} +1 -1
- package/dist/cjs/{fullscreen-Cuh4s9g3.js → fullscreen-BmuHM8Mq.js} +3 -3
- package/dist/cjs/{index-CkLcAUj-.js → index-CeVPSufd.js} +1 -1
- package/dist/cjs/{index-DGttnXif.js → index-ap26V5bu.js} +11 -2
- package/dist/cjs/index.cjs.js +3 -3
- package/dist/cjs/{lazyload-tvpXnTYY.js → lazyload-CBgO3EAI.js} +3 -3
- package/dist/cjs/loader.cjs.js +3 -4
- package/dist/cjs/{modal-BlzeVZW4.js → modal-CjPWcL9B.js} +1 -1
- package/dist/cjs/nano-accordion.cjs.entry.js +3 -3
- package/dist/cjs/nano-alert.cjs.entry.js +8 -8
- package/dist/cjs/nano-algolia-filter.cjs.entry.js +4 -4
- package/dist/cjs/nano-algolia-pagination.cjs.entry.js +2 -2
- package/dist/cjs/nano-algolia-results.cjs.entry.js +3 -3
- package/dist/cjs/nano-algolia.cjs.entry.js +5 -5
- package/dist/cjs/nano-animation.cjs.entry.js +2 -2
- package/dist/cjs/nano-avatar_5.cjs.entry.js +12 -14
- package/dist/cjs/nano-breadcrumb.cjs.entry.js +2 -2
- package/dist/cjs/nano-card-carousel.cjs.entry.js +3 -3
- package/dist/cjs/nano-card.cjs.entry.js +1 -1
- package/dist/cjs/nano-checkbox-group.cjs.entry.js +3 -3
- package/dist/cjs/nano-checkbox.cjs.entry.js +3 -3
- package/dist/cjs/nano-collapsible-comparison.cjs.entry.js +3 -3
- package/dist/cjs/nano-components.cjs.js +3 -4
- package/dist/cjs/nano-content-links.cjs.entry.js +1 -1
- package/dist/cjs/nano-cta.cjs.entry.js +1 -1
- package/dist/cjs/{nano-data-table-BC1htsdm.js → nano-data-table-B3KUstGL.js} +6 -6
- package/dist/cjs/nano-data-table.cjs.entry.js +6 -6
- package/dist/cjs/nano-datalist_3.cjs.entry.js +5 -5
- package/dist/cjs/nano-date-input.cjs.entry.js +2 -2
- package/dist/cjs/nano-date-picker_2.cjs.entry.js +6 -6
- package/dist/cjs/nano-details.cjs.entry.js +4 -4
- package/dist/cjs/nano-dialog.cjs.entry.js +9 -9
- package/dist/cjs/nano-dropdown_2.cjs.entry.js +7 -7
- package/dist/cjs/nano-feature-box.cjs.entry.js +1 -1
- package/dist/cjs/nano-field-validator.cjs.entry.js +3 -3
- package/dist/cjs/nano-file-upload.cjs.entry.js +3 -3
- package/dist/cjs/nano-footer.cjs.entry.js +2 -2
- package/dist/cjs/nano-global-nav.cjs.entry.js +16 -16
- package/dist/cjs/nano-grid-item.cjs.entry.js +1 -1
- package/dist/cjs/nano-grid_2.cjs.entry.js +3 -3
- package/dist/cjs/nano-hero.cjs.entry.js +2 -2
- package/dist/cjs/nano-icon-button_2.cjs.entry.js +4 -4
- package/dist/cjs/nano-icon-item.cjs.entry.js +1 -1
- package/dist/cjs/nano-icon.cjs.entry.js +4 -8
- package/dist/cjs/nano-in-page-nav.cjs.entry.js +6 -6
- package/dist/cjs/nano-increment.cjs.entry.js +3 -3
- package/dist/cjs/nano-input-otp.cjs.entry.js +3 -3
- package/dist/cjs/nano-intersection-observe.cjs.entry.js +4 -4
- package/dist/cjs/nano-masked-overflow.cjs.entry.js +5 -5
- package/dist/cjs/nano-menu-drawer.cjs.entry.js +5 -5
- package/dist/cjs/nano-more-less.cjs.entry.js +2 -2
- package/dist/cjs/nano-nav-item.cjs.entry.js +5 -5
- package/dist/cjs/nano-option-box.cjs.entry.js +1 -1
- package/dist/cjs/nano-progress-bar.cjs.entry.js +2 -2
- package/dist/cjs/nano-range.cjs.entry.js +3 -3
- package/dist/cjs/nano-rating.cjs.entry.js +3 -3
- package/dist/cjs/nano-resize-observe.cjs.entry.js +2 -2
- package/dist/cjs/nano-search-result.cjs.entry.js +1 -1
- package/dist/cjs/nano-slide.cjs.entry.js +2 -2
- package/dist/cjs/{nano-slides-DcXrQQgs.js → nano-slides-BONrNv9H.js} +24 -11
- package/dist/cjs/nano-slides.cjs.entry.js +3 -3
- package/dist/cjs/nano-sortable.cjs.entry.js +2 -2
- package/dist/cjs/nano-spinner.cjs.entry.js +2 -2
- package/dist/cjs/nano-split-pane.cjs.entry.js +3 -3
- package/dist/cjs/nano-step-accordion.cjs.entry.js +3 -3
- package/dist/cjs/nano-step-breadcrumb.cjs.entry.js +4 -4
- package/dist/cjs/nano-sticker.cjs.entry.js +4 -4
- package/dist/cjs/nano-tab-content.cjs.entry.js +2 -2
- package/dist/cjs/nano-tab-group.cjs.entry.js +5 -5
- package/dist/cjs/nano-tab.cjs.entry.js +3 -3
- package/dist/cjs/nano-table.cjs.entry.js +2 -2
- package/dist/cjs/{renderer-jVpDRMfV.js → renderer-D1xFLJsH.js} +1 -1
- package/dist/cjs/{scroll-C6pO9RvO.js → scroll-C2cNPPnK.js} +1 -1
- package/dist/cjs/{slot-CfuOT0U4.js → slot-D0YPdT3s.js} +1 -1
- package/dist/cjs/{tabbable-C-YwPfjA.js → tabbable-D60VZB1O.js} +1 -1
- package/dist/cjs/{table.worker-BXs-g6xI.js → table.worker-ClLnKNqW.js} +6 -6
- package/dist/collection/components/alert/alert.css +15 -15
- package/dist/collection/components/badge/badge.js +0 -21
- package/dist/collection/components/breadcrumb/breadcrumb.css +12 -12
- package/dist/collection/components/breadcrumb/breadcrumb.js +1 -1
- package/dist/collection/components/card-carousel/card-carousel.css +5 -5
- package/dist/collection/components/checkbox/checkbox-group.css +6 -6
- package/dist/collection/components/checkbox/checkbox.css +21 -21
- package/dist/collection/components/collapsible-comparison/collapsible-comparison.css +4 -4
- package/dist/collection/components/content-links/content-links.css +4 -4
- package/dist/collection/components/cta/cta.js +8 -5
- package/dist/collection/components/data-table/table.css +12 -12
- package/dist/collection/components/datalist/datalist.css +2 -2
- package/dist/collection/components/date-picker/date-picker.css +7 -7
- package/dist/collection/components/details/details.css +7 -7
- package/dist/collection/components/dialog/dialog.css +11 -11
- package/dist/collection/components/drawer/drawer.css +13 -13
- package/dist/collection/components/dropdown/dropdown.css +2 -2
- package/dist/collection/components/file-upload/file-upload.css +18 -18
- package/dist/collection/components/footer/footer.css +3 -3
- package/dist/collection/components/global-nav/global-nav.css +26 -25
- package/dist/collection/components/global-nav/global-nav.js +13 -13
- package/dist/collection/components/global-search-results/global-search-results.css +24 -24
- package/dist/collection/components/icon/icon.css +1 -5
- package/dist/collection/components/icon/icon.js +1 -24
- package/dist/collection/components/icon-button/icon-button.css +4 -4
- package/dist/collection/components/in-page-nav/in-page-nav.css +9 -9
- package/dist/collection/components/increment/increment.css +5 -5
- package/dist/collection/components/input/input.css +20 -20
- package/dist/collection/components/input-otp/input-otp.css +7 -7
- package/dist/collection/components/masked-overflow/masked-overflow.css +5 -5
- package/dist/collection/components/menu/menu.css +3 -3
- package/dist/collection/components/menu-drawer/menu-drawer.css +6 -6
- package/dist/collection/components/option/option.css +12 -12
- package/dist/collection/components/progress-bar/progress-bar.css +5 -5
- package/dist/collection/components/range/range.css +15 -15
- package/dist/collection/components/rating/rating.css +5 -5
- package/dist/collection/components/select/select.css +20 -20
- package/dist/collection/components/slides/slides.css +11 -11
- package/dist/collection/components/slides/slides.js +20 -6
- package/dist/collection/components/spinner/spinner.css +5 -5
- package/dist/collection/components/split-pane/split-pane.css +4 -4
- package/dist/collection/components/step-accordion/step-accordion.css +10 -10
- package/dist/collection/components/step-breadcrumb/step-breadcrumb.css +17 -17
- package/dist/collection/components/table/table.css +3 -3
- package/dist/collection/components/tabs/tab-group.css +6 -6
- package/dist/collection/components/tabs/tab.css +15 -14
- package/dist/collection/components/tag/tag.css +4 -4
- package/dist/collection/components/tooltip/tooltip.css +4 -4
- package/dist/components/badge.js +0 -3
- package/dist/components/cta.js +1 -1
- package/dist/components/datalist.js +1 -1
- package/dist/components/date-picker.js +1 -1
- package/dist/components/details.js +1 -1
- package/dist/components/drawer.js +1 -1
- package/dist/components/dropdown.js +1 -1
- package/dist/components/global-search-results.js +1 -1
- package/dist/components/icon-button.js +1 -1
- package/dist/components/icon.js +2 -7
- package/dist/components/input.js +1 -1
- package/dist/components/masked-overflow.js +1 -1
- package/dist/components/menu.js +1 -1
- package/dist/components/nano-alert.js +1 -1
- package/dist/components/nano-breadcrumb.js +1 -1
- package/dist/components/nano-card-carousel.js +1 -1
- package/dist/components/nano-checkbox-group.js +1 -1
- package/dist/components/nano-checkbox.js +1 -1
- package/dist/components/nano-collapsible-comparison.js +1 -1
- package/dist/components/nano-data-table.js +1 -1
- package/dist/components/nano-dialog.js +1 -1
- package/dist/components/nano-file-upload.js +1 -1
- package/dist/components/nano-footer.js +1 -1
- package/dist/components/nano-global-nav.js +14 -14
- package/dist/components/nano-in-page-nav.js +1 -1
- package/dist/components/nano-increment.js +1 -1
- package/dist/components/nano-input-otp.js +1 -1
- package/dist/components/nano-menu-drawer.js +1 -1
- package/dist/components/nano-range.js +1 -1
- package/dist/components/nano-rating.js +1 -1
- package/dist/components/nano-split-pane.js +1 -1
- package/dist/components/nano-step-accordion.js +1 -1
- package/dist/components/nano-step-breadcrumb.js +1 -1
- package/dist/components/nano-tab-group.js +1 -1
- package/dist/components/nano-tab.js +1 -1
- package/dist/components/option.js +1 -1
- package/dist/components/progress-bar.js +1 -1
- package/dist/components/select.js +1 -1
- package/dist/components/slides.js +20 -6
- package/dist/components/spinner.js +1 -1
- package/dist/components/tooltip.js +1 -1
- package/dist/esm/{algolia-data-Kh0vPn3V.js → algolia-data-CrdfzSCx.js} +1 -1
- package/dist/esm/{component-store-JYVuxwvK.js → component-store-Dwo45Eol.js} +1 -1
- package/dist/esm/{constructible-style-B2_GfhhS.js → constructible-style-8ZZJwMaU.js} +1 -1
- package/dist/esm/{dom-dlicJTEJ.js → dom-QEz8hlsO.js} +1 -1
- package/dist/esm/{fade-Y5mYUwiO.js → fade-7nCfOc5y.js} +3 -3
- package/dist/esm/{form-control-BtblmnSm.js → form-control-8eh0RGNw.js} +1 -1
- package/dist/esm/{fullscreen-Ct2ACI6T.js → fullscreen-h77Lkspo.js} +3 -3
- package/dist/esm/{index-BlBZYxu4.js → index-CuC61-2g.js} +1 -1
- package/dist/esm/{index-BM3Om9WE.js → index-vpnVjPKQ.js} +11 -3
- package/dist/esm/index.js +4 -4
- package/dist/esm/{lazyload-ZYbHlu3K.js → lazyload-CGR82usu.js} +3 -3
- package/dist/esm/loader.js +3 -4
- package/dist/esm/{modal-CY_3_LJ7.js → modal-Dk_TZDiu.js} +1 -1
- package/dist/esm/nano-accordion.entry.js +3 -3
- package/dist/esm/nano-alert.entry.js +8 -8
- package/dist/esm/nano-algolia-filter.entry.js +4 -4
- package/dist/esm/nano-algolia-pagination.entry.js +2 -2
- package/dist/esm/nano-algolia-results.entry.js +3 -3
- package/dist/esm/nano-algolia.entry.js +5 -5
- package/dist/esm/nano-animation.entry.js +2 -2
- package/dist/esm/nano-avatar_5.entry.js +12 -14
- package/dist/esm/nano-breadcrumb.entry.js +2 -2
- package/dist/esm/nano-card-carousel.entry.js +3 -3
- package/dist/esm/nano-card.entry.js +1 -1
- package/dist/esm/nano-checkbox-group.entry.js +3 -3
- package/dist/esm/nano-checkbox.entry.js +3 -3
- package/dist/esm/nano-collapsible-comparison.entry.js +3 -3
- package/dist/esm/nano-components.js +3 -4
- package/dist/esm/nano-content-links.entry.js +1 -1
- package/dist/esm/nano-cta.entry.js +1 -1
- package/dist/esm/{nano-data-table-Bn4l0Q3q.js → nano-data-table-HQJQG0Sv.js} +6 -6
- package/dist/esm/nano-data-table.entry.js +6 -6
- package/dist/esm/nano-datalist_3.entry.js +5 -5
- package/dist/esm/nano-date-input.entry.js +2 -2
- package/dist/esm/nano-date-picker_2.entry.js +6 -6
- package/dist/esm/nano-details.entry.js +4 -4
- package/dist/esm/nano-dialog.entry.js +9 -9
- package/dist/esm/nano-dropdown_2.entry.js +7 -7
- package/dist/esm/nano-feature-box.entry.js +1 -1
- package/dist/esm/nano-field-validator.entry.js +3 -3
- package/dist/esm/nano-file-upload.entry.js +3 -3
- package/dist/esm/nano-footer.entry.js +2 -2
- package/dist/esm/nano-global-nav.entry.js +16 -16
- package/dist/esm/nano-grid-item.entry.js +1 -1
- package/dist/esm/nano-grid_2.entry.js +3 -3
- package/dist/esm/nano-hero.entry.js +2 -2
- package/dist/esm/nano-icon-button_2.entry.js +4 -4
- package/dist/esm/nano-icon-item.entry.js +1 -1
- package/dist/esm/nano-icon.entry.js +4 -8
- package/dist/esm/nano-in-page-nav.entry.js +6 -6
- package/dist/esm/nano-increment.entry.js +3 -3
- package/dist/esm/nano-input-otp.entry.js +3 -3
- package/dist/esm/nano-intersection-observe.entry.js +4 -4
- package/dist/esm/nano-masked-overflow.entry.js +5 -5
- package/dist/esm/nano-menu-drawer.entry.js +5 -5
- package/dist/esm/nano-more-less.entry.js +2 -2
- package/dist/esm/nano-nav-item.entry.js +5 -5
- package/dist/esm/nano-option-box.entry.js +1 -1
- package/dist/esm/nano-progress-bar.entry.js +2 -2
- package/dist/esm/nano-range.entry.js +3 -3
- package/dist/esm/nano-rating.entry.js +3 -3
- package/dist/esm/nano-resize-observe.entry.js +2 -2
- package/dist/esm/nano-search-result.entry.js +1 -1
- package/dist/esm/nano-slide.entry.js +2 -2
- package/dist/esm/{nano-slides-0qDi5Vv7.js → nano-slides-CMFKg_gU.js} +24 -11
- package/dist/esm/nano-slides.entry.js +3 -3
- package/dist/esm/nano-sortable.entry.js +2 -2
- package/dist/esm/nano-spinner.entry.js +2 -2
- package/dist/esm/nano-split-pane.entry.js +3 -3
- package/dist/esm/nano-step-accordion.entry.js +3 -3
- package/dist/esm/nano-step-breadcrumb.entry.js +4 -4
- package/dist/esm/nano-sticker.entry.js +4 -4
- package/dist/esm/nano-tab-content.entry.js +2 -2
- package/dist/esm/nano-tab-group.entry.js +5 -5
- package/dist/esm/nano-tab.entry.js +3 -3
- package/dist/esm/nano-table.entry.js +2 -2
- package/dist/esm/{renderer-DpNDfhNy.js → renderer-CTaemqrs.js} +1 -1
- package/dist/esm/{scroll-1nFw8CNk.js → scroll-Cpis33Lx.js} +1 -1
- package/dist/esm/{slot-Crs4khNK.js → slot-wHS7-PXA.js} +1 -1
- package/dist/esm/{tabbable-BgopY-vd.js → tabbable-CT4-pg7f.js} +1 -1
- package/dist/esm/{table.worker-BMDbprO8.js → table.worker--BAXV6ow.js} +6 -6
- package/dist/nano-components/{algolia-data-Kh0vPn3V.js → algolia-data-CrdfzSCx.js} +1 -1
- package/dist/nano-components/{component-store-JYVuxwvK.js → component-store-Dwo45Eol.js} +1 -1
- package/dist/nano-components/{constructible-style-B2_GfhhS.js → constructible-style-8ZZJwMaU.js} +1 -1
- package/dist/nano-components/dom-QEz8hlsO.js +4 -0
- package/dist/nano-components/{fade-Y5mYUwiO.js → fade-7nCfOc5y.js} +1 -1
- package/dist/nano-components/{form-control-BtblmnSm.js → form-control-8eh0RGNw.js} +1 -1
- package/dist/nano-components/{fullscreen-Ct2ACI6T.js → fullscreen-h77Lkspo.js} +1 -1
- package/dist/nano-components/index-CuC61-2g.js +4 -0
- package/dist/nano-components/index-vpnVjPKQ.js +5 -0
- package/dist/nano-components/index.esm.js +1 -1
- package/dist/nano-components/{lazyload-ZYbHlu3K.js → lazyload-CGR82usu.js} +1 -1
- package/dist/nano-components/{modal-CY_3_LJ7.js → modal-Dk_TZDiu.js} +1 -1
- package/dist/nano-components/nano-accordion.entry.js +1 -1
- package/dist/nano-components/nano-alert.entry.js +1 -1
- package/dist/nano-components/nano-algolia-filter.entry.js +1 -1
- package/dist/nano-components/nano-algolia-pagination.entry.js +1 -1
- package/dist/nano-components/nano-algolia-results.entry.js +1 -1
- package/dist/nano-components/nano-algolia.entry.js +1 -1
- package/dist/nano-components/nano-animation.entry.js +1 -1
- package/dist/nano-components/nano-avatar_5.entry.js +1 -1
- package/dist/nano-components/nano-breadcrumb.entry.js +1 -1
- package/dist/nano-components/nano-card-carousel.entry.js +1 -1
- package/dist/nano-components/nano-card.entry.js +1 -1
- package/dist/nano-components/nano-checkbox-group.entry.js +1 -1
- package/dist/nano-components/nano-checkbox.entry.js +1 -1
- package/dist/nano-components/nano-collapsible-comparison.entry.js +1 -1
- package/dist/nano-components/nano-components.css +121 -223
- package/dist/nano-components/nano-components.esm.js +1 -1
- package/dist/nano-components/nano-content-links.entry.js +1 -1
- package/dist/nano-components/nano-cta.entry.js +1 -1
- package/dist/nano-components/nano-data-table-HQJQG0Sv.js +4 -0
- package/dist/nano-components/nano-data-table.entry.js +1 -1
- package/dist/nano-components/nano-datalist_3.entry.js +1 -1
- package/dist/nano-components/nano-date-input.entry.js +1 -1
- package/dist/nano-components/nano-date-picker_2.entry.js +1 -1
- package/dist/nano-components/nano-details.entry.js +1 -1
- package/dist/nano-components/nano-dialog.entry.js +1 -1
- package/dist/nano-components/nano-dropdown_2.entry.js +1 -1
- package/dist/nano-components/nano-feature-box.entry.js +1 -1
- package/dist/nano-components/nano-field-validator.entry.js +1 -1
- package/dist/nano-components/nano-file-upload.entry.js +1 -1
- package/dist/nano-components/nano-footer.entry.js +1 -1
- package/dist/nano-components/nano-global-nav.entry.js +1 -1
- package/dist/nano-components/nano-grid-item.entry.js +1 -1
- package/dist/nano-components/nano-grid_2.entry.js +1 -1
- package/dist/nano-components/nano-hero.entry.js +1 -1
- package/dist/nano-components/nano-icon-button_2.entry.js +1 -1
- package/dist/nano-components/nano-icon-item.entry.js +1 -1
- package/dist/nano-components/nano-icon.entry.js +1 -1
- package/dist/nano-components/nano-in-page-nav.entry.js +1 -1
- package/dist/nano-components/nano-increment.entry.js +1 -1
- package/dist/nano-components/nano-input-otp.entry.js +1 -1
- package/dist/nano-components/nano-intersection-observe.entry.js +1 -1
- package/dist/nano-components/nano-masked-overflow.entry.js +1 -1
- package/dist/nano-components/nano-menu-drawer.entry.js +1 -1
- package/dist/nano-components/nano-more-less.entry.js +1 -1
- package/dist/nano-components/nano-nav-item.entry.js +1 -1
- package/dist/nano-components/nano-option-box.entry.js +1 -1
- package/dist/nano-components/nano-progress-bar.entry.js +1 -1
- package/dist/nano-components/nano-range.entry.js +1 -1
- package/dist/nano-components/nano-rating.entry.js +1 -1
- package/dist/nano-components/nano-resize-observe.entry.js +1 -1
- package/dist/nano-components/nano-search-result.entry.js +1 -1
- package/dist/nano-components/nano-slide.entry.js +1 -1
- package/dist/nano-components/nano-slides-CMFKg_gU.js +22 -0
- package/dist/nano-components/nano-slides.entry.js +1 -1
- package/dist/nano-components/nano-sortable.entry.js +1 -1
- package/dist/nano-components/nano-spinner.entry.js +1 -1
- package/dist/nano-components/nano-split-pane.entry.js +1 -1
- package/dist/nano-components/nano-step-accordion.entry.js +1 -1
- package/dist/nano-components/nano-step-breadcrumb.entry.js +1 -1
- package/dist/nano-components/nano-sticker.entry.js +1 -1
- package/dist/nano-components/nano-tab-content.entry.js +1 -1
- package/dist/nano-components/nano-tab-group.entry.js +1 -1
- package/dist/nano-components/nano-tab.entry.js +1 -1
- package/dist/nano-components/nano-table.entry.js +1 -1
- package/dist/nano-components/{renderer-DpNDfhNy.js → renderer-CTaemqrs.js} +1 -1
- package/dist/nano-components/{scroll-1nFw8CNk.js → scroll-Cpis33Lx.js} +1 -1
- package/dist/nano-components/{slot-Crs4khNK.js → slot-wHS7-PXA.js} +1 -1
- package/dist/nano-components/{tabbable-BgopY-vd.js → tabbable-CT4-pg7f.js} +1 -1
- package/dist/nano-components/{table.worker-BMDbprO8.js → table.worker--BAXV6ow.js} +1 -1
- package/dist/stencil.config.js +0 -1
- package/dist/style/components.css +1 -1
- package/dist/style/components.css.map +1 -1
- package/dist/style/core.css +1 -1
- package/dist/style/core.css.map +1 -1
- package/dist/style/dark.css +1 -1
- package/dist/style/dark.css.map +1 -1
- package/dist/style/light.css +1 -1
- package/dist/style/light.css.map +1 -1
- package/dist/style/nano.css +1 -1
- package/dist/style/nano.css.map +1 -1
- package/dist/types/builds/{sN_eAsgS/0/Digital → Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/generate-vue-component.d.ts +1 -1
- package/dist/types/builds/{sN_eAsgS/0/Digital → Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/output-vue.d.ts +1 -1
- package/dist/types/builds/{sN_eAsgS/0/Digital → Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/plugin.d.ts +1 -1
- package/dist/types/builds/Digital/nano-components/packages/components/.stencil/stencil.config.d.ts +2 -0
- package/dist/types/builds/Digital/nano-components/packages/components/.stencil/stencil.config.prod.d.ts +2 -0
- package/dist/types/components/badge/badge.d.ts +0 -2
- package/dist/types/components/cta/cta.d.ts +1 -1
- package/dist/types/components/icon/icon.d.ts +0 -4
- package/dist/types/components/slides/slides.d.ts +8 -0
- package/dist/types/components.d.ts +2 -18
- package/docs-json.json +151 -187
- package/docs-vscode.json +2 -41
- package/hydrate/index.js +75 -69
- package/hydrate/index.mjs +75 -69
- package/package.json +3 -3
- package/dist/cjs/app-globals-BRy5S0cS.js +0 -10
- package/dist/esm/app-globals-CWIH620u.js +0 -8
- package/dist/nano-components/app-globals-CWIH620u.js +0 -4
- package/dist/nano-components/dom-dlicJTEJ.js +0 -4
- package/dist/nano-components/index-BM3Om9WE.js +0 -5
- package/dist/nano-components/index-BlBZYxu4.js +0 -4
- package/dist/nano-components/nano-data-table-Bn4l0Q3q.js +0 -4
- package/dist/nano-components/nano-slides-0qDi5Vv7.js +0 -22
- package/dist/types/builds/sN_eAsgS/0/Digital/nano-components/packages/components/.stencil/stencil.config.d.ts +0 -2
- package/dist/types/builds/sN_eAsgS/0/Digital/nano-components/packages/components/.stencil/stencil.config.prod.d.ts +0 -2
- /package/dist/types/builds/{sN_eAsgS/0/Digital → Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/index.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS/0/Digital → Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/types.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS/0/Digital → Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/utils.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS/0/Digital → Digital}/nano-components/packages/components/.stencil/testing/mocks/intersection-observer.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS/0/Digital/nano-components/packages/components/.stencil/wdio.conf.d.ts → Digital/nano-components/packages/components/.stencil/wdio.config.d.ts} +0 -0
- /package/dist/{wdio.conf.js → wdio.config.js} +0 -0
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,c as i,g as n,h as o,F as s,a}from"./index-BM3Om9WE.js";import{H as e}from"./slot-Crs4khNK.js";const r=class{constructor(n){t(this,n),this.nanoInput=i(this,"nanoInput",7),this.nanoChange=i(this,"nanoChange",7),this.nanoComplete=i(this,"nanoComplete",7),this.nanoBlur=i(this,"nanoBlur",7),this.nanoClear=i(this,"nanoClear",7),this.nanoFocus=i(this,"nanoFocus",7)}inputRefs=[];inputId="nano-input-otp-"+h++;slotCtrl=new e(this,"[default]");focusedValue;isKeyboardNavigation=!1;get el(){return n(this)}inputValues=[];hasFocus=!1;previousInputValues=[];invalid=!1;valid=!1;disabled=!1;inputmode;length=6;pattern;readonly=!1;type="number";value="";allowInvalid=!1;showValidity=!1;nanoInput;nanoChange;nanoComplete;nanoBlur;nanoClear;nanoFocus;async setFocus(t){if("number"==typeof t){const i=Math.max(0,Math.min(t,this.length-1));this.inputRefs[i]?.focus()}else{const t=this.getTabbableIndex();this.inputRefs[t]?.focus()}}async clear(){this.value="",this.inputRefs.forEach(((t,i)=>{t.value=this.inputValues[i]||""})),this.nanoClear.emit()}valueChanged(){this.initializeValues(),this.updateTabIndexes(),this.computeValidity()}componentWillLoad(){this.initializeValues(),this.computeValidity(),this.valid&&this.nanoComplete.emit({valid:this.valid,value:this.value?.toString()})}componentDidLoad(){this.updateTabIndexes()}get validKeyPattern(){return new RegExp(`^${this.getPattern()}$`,"u")}get specialCharsPattern(){return new RegExp("^[\\p{S}\\p{P}]$","u")}getPattern(){const{pattern:t,type:i}=this;return t||("number"===i?"[\\p{N}]":"[\\p{L}\\p{N}]")}getInputmode(){const{inputmode:t}=this;return t||("number"==this.type?"numeric":"text")}initializeValues(){this.inputValues=Array(this.length).fill(""),null!=this.value&&0!==String(this.value).length&&(String(this.value).split("").slice(0,this.length).forEach(((t,i)=>{(this.allowInvalid&&!this.specialCharsPattern.test(t)||this.validKeyPattern.test(t))&&(this.inputValues[i]=t)})),this.value=this.inputValues.join(""),this.previousInputValues=[...this.inputValues])}isRTL=t=>t&&""!==t.dir?"rtl"===t.dir.toLowerCase():"rtl"===document?.dir.toLowerCase();updateValue(t){const{inputValues:i,length:n}=this,o=this.getValidChars(i.join("")).join("");this.value=o,this.computeValidity(),this.emitNanoInput(t),o.length===n&&this.nanoComplete.emit({value:o,valid:this.valid})}emitNanoChange(t){const{value:i}=this,n=null==i?i:i.toString();this.computeValidity(),this.nanoChange.emit({value:n?.toString(),event:t,valid:this.valid})}emitNanoInput(t){const{value:i}=this,n=null==i?i:i.toString();this.computeValidity(),this.nanoInput.emit({value:n?.toString(),event:t,valid:this.valid})}onFocus=t=>i=>{const{inputRefs:n}=this;this.hasFocus||(this.nanoFocus.emit(i),this.focusedValue=this.value),this.hasFocus=!0;let o=t;if(!this.isKeyboardNavigation){const i=this.inputValues[t]?t:this.getFirstEmptyIndex();o=-1===i?this.length-1:i,this.inputRefs[o]?.focus()}n.forEach(((t,i)=>{t.tabIndex=i===o?0:-1})),this.isKeyboardNavigation=!1};onBlur=t=>{const{inputRefs:i}=this,n=t.relatedTarget;null!=n&&i.includes(n)||(this.hasFocus=!1,this.updateTabIndexes(),this.nanoBlur.emit(t),this.focusedValue!==this.value&&this.emitNanoChange(t))};focusNext(t){const{inputRefs:i,length:n}=this;t<n-1&&i[t+1]?.focus()}focusPrevious(t){const{inputRefs:i}=this;t>0&&i[t-1]?.focus()}getFirstEmptyIndex(){const{inputValues:t,length:i}=this;return Array.from({length:i},((i,n)=>t[n]||"")).findIndex((t=>!t||""===t))??-1}getTabbableIndex(){const{length:t}=this,i=this.getFirstEmptyIndex();return-1===i?t-1:i}updateTabIndexes(){const{inputRefs:t,inputValues:i,length:n}=this;let o=-1;for(let t=0;t<n;t++)if(!i[t]||""===i[t]){o=t;break}t.forEach(((t,s)=>{const a=-1===o?s===n-1:o===s;t.tabIndex=a?0:-1,t.setAttribute("aria-hidden",i[s]&&""!==i[s]||a?"false":"true")}))}onKeyDown=t=>i=>{const{length:n}=this,o=this.isRTL(this.el),s=i.target;if(!(s.selectionStart!==s.selectionEnd||(i.metaKey||i.ctrlKey)&&["a","c","v","x","r","z","y"].includes(i.key.toLowerCase())))if("Backspace"===i.key)if(this.inputValues[t]){for(let i=t;i<n-1;i++)this.inputValues[i]=this.inputValues[i+1];this.inputValues[n-1]="";for(let t=0;t<n;t++)this.inputRefs[t].value=this.inputValues[t]||"";this.updateValue(i),i.preventDefault()}else!this.inputValues[t]&&t>0&&this.focusPrevious(t);else if("ArrowLeft"===i.key||"ArrowRight"===i.key){this.isKeyboardNavigation=!0,i.preventDefault();const s="ArrowLeft"===i.key;s&&o||!s&&!o?this.inputValues[t]&&t<n-1&&this.focusNext(t):this.focusPrevious(t)}else if("Tab"===i.key)return void(this.isKeyboardNavigation=!0)};onInput=t=>i=>{const{length:n,validKeyPattern:o,allowInvalid:s}=this,a=i.target,e=a.value,r=this.previousInputValues[t]||"";if(e.length-r.length>1){const t=this.getValidChars(e);0===t.length&&requestAnimationFrame((()=>{this.inputRefs.forEach((t=>{t.value=""}))}));for(let i=0;i<n;i++)this.inputValues[i]=t[i]||"",this.inputRefs[i].value=t[i]||"";return this.updateValue(i),setTimeout((()=>{const i=t.length<n?t.length:n-1;this.inputRefs[i]?.focus()}),20),void(this.previousInputValues=[...this.inputValues])}if(!s&&e.length>0&&!o.test(e[e.length-1])||s&&this.specialCharsPattern.test(e[e.length-1]))return a.value=this.inputValues[t]||"",void(this.previousInputValues=[...this.inputValues]);if(0===a.selectionStart&&a.selectionEnd===e.length||!this.inputValues[t])return this.inputValues[t]=e,a.value=e,this.updateValue(i),this.focusNext(t),void(this.previousInputValues=[...this.inputValues]);if(this.inputValues[t]&&""===this.inputValues[this.inputValues.length-1]&&2===e.length){let n=i.data;if(n||(n=e.split("").find(((t,i)=>t!==r[i]))||e[e.length-1]),!s&&!o.test(n))return a.value=this.inputValues[t]||"",void(this.previousInputValues=[...this.inputValues]);for(let i=this.inputValues.length-1;i>t;i--)this.inputValues[i]=this.inputValues[i-1],this.inputRefs[i].value=this.inputValues[i]||"";return this.inputValues[t]=n,this.inputRefs[t].value=n,this.updateValue(i),void(this.previousInputValues=[...this.inputValues])}const h=e[(a.selectionStart??e.length)-1]??e[0];if(!s&&!o.test(h))return a.value=this.inputValues[t]||"",void(this.previousInputValues=[...this.inputValues]);this.inputValues[t]=h,a.value=h,this.updateValue(i),this.previousInputValues=[...this.inputValues]};onPaste=t=>{const{inputRefs:i,length:n}=this;t.preventDefault();const o=t.clipboardData?.getData("text");if(!o)return void this.emitNanoInput(t);const s=this.getValidChars(o);s.forEach(((t,i)=>{i<n&&(this.inputRefs[i].value=t,this.inputValues[i]=t)})),this.value=s.join(""),this.updateValue(t);const a=s.length<n?s.length:n-1;i[a]?.focus()};showSeparator(t){const{length:i}=this;return!(i<3||i%2!=0)&&t===i/2-1}getValidChars(t){const{allowInvalid:i,validKeyPattern:n,length:o}=this;return t.split("").filter(i?t=>""!==t.trim()&&!this.specialCharsPattern.test(t):t=>""!==t.trim()&&n.test(t)).slice(0,o)}computeValidity(){this.invalid=this.allowInvalid&&this.inputValues.some((t=>""!==t&&!this.validKeyPattern.test(t))),this.valid=this.inputValues.length===this.length&&this.inputValues.every((t=>""!==t&&this.validKeyPattern.test(t)))}render(){const{disabled:t,hasFocus:i,inputId:n,inputRefs:e,inputValues:r,length:h,readonly:p,invalid:l,valid:c}=this,u=this.getInputmode(),d=this.getTabbableIndex(),v=this.getPattern();return o(a,{key:"69c1b3c4a4cae21665bb7e3646a27a89f8d0a73b",class:{"has-focus":i,"input-otp-disabled":t,"input-otp-readonly":p,"nano-invalid":l,"nano-valid":c}},o("div",{key:"9fcd9882d552cde88adfa7578e556155651bbb4d",class:"input-otp-container"},o("div",{key:"3e2c1a83282c08c1ccef81c4f13a895f1efeec13",class:"input-otp-group",role:"group","aria-label":"One-time password input"},Array.from({length:h}).map(((i,a)=>o(s,null,o("div",{class:"native-wrapper"},o("input",{class:"native-input",id:`${n}-${a}`,"aria-label":`Input ${a+1} of ${h}`,type:"text",inputmode:u,pattern:v,disabled:t,readOnly:p,tabIndex:a===d?0:-1,value:r[a]||"",autocomplete:"one-time-code",ref:t=>e[a]=t,onInput:this.onInput(a),onBlur:this.onBlur,onFocus:this.onFocus(a),onKeyDown:this.onKeyDown(a),onPaste:this.onPaste})),this.showSeparator(a)&&o("div",{class:"input-otp-separator"}))))),this.showValidity&&o("div",{key:"b5d9d9f3023cca6fcf9d8a394287de2333eeff54",class:{"input-otp-icon":!0,"input-otp-icon--valid":c,"input-otp-icon--invalid":l},part:"validity-icon"},o("slot",{key:"d4a3123b713487f579a503ea1158e73b97a35198",name:"validity-icon"},o("nano-icon",{key:"2d7886aadaaa786f3594ace3d4fa3d2ebbdc30c3",hidden:!c,name:"light/circle-check",class:"input-otp-valid-icon","aria-label":"Valid input"})))),this.slotCtrl.has("[default]")&&o("div",{key:"32b6883425e8f62bda344ad6f92ff63a5fef98f4",class:"input-otp-description"},o("slot",{key:"81b5c65f7c8bab2f8bf371c03bc5a2ae455b6c3f"})))}static get watchers(){return{value:["valueChanged"]}}};let h=0;r.style=".sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{box-sizing:border-box}[hidden].sc-nano-input-otp{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{box-sizing:border-box}[hidden].sc-nano-input-otp{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-input-otp-h{--color:initial;--min-width:40px;--width:40px;--height:50px;--gap:8px;--icon-size:var(--nano-pictogram-size-small);--inline-padding:calc(var(--icon-size) + var(--gap));--spacing:var(--nano-spacing-xl);--separator-width:7px;--separator-height:1px;--separator-border-radius:0;--separator-color:var(--nano-color-primary-1000);--highlight-color-valid:var(--nano-color-success-1100);--highlight-color-invalid:var(--nano-color-warning-1100);--border-radius:8px;--border-color:var(--nano-color-neutral-700);--border-width:1px;display:block;position:relative;margin-inline:var(--inline-padding)}.input-otp-container.sc-nano-input-otp{position:relative;inline-size:fit-content;block-size:fit-content;margin:0 auto}.input-otp-group.sc-nano-input-otp{display:flex;align-items:center;justify-content:center;gap:var(--gap)}.native-wrapper.sc-nano-input-otp{display:flex;align-items:center;justify-content:center;min-inline-size:var(--min-width)}.native-input.sc-nano-input-otp{border-radius:var(--border-radius);inline-size:var(--width);min-inline-size:inherit;block-size:var(--height);border-width:var(--border-width);border-style:solid;border-color:var(--border-color);background:var(--background);color:var(--color);font-size:inherit;text-align:center;appearance:none}.input-otp-description.sc-nano-input-otp{color:currentcolor;font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);text-align:center;position:relative;margin-block-start:var(--spacing)}.input-otp-description-hidden.sc-nano-input-otp{display:none}.input-otp-separator.sc-nano-input-otp{border-radius:var(--separator-border-radius);flex-shrink:0;inline-size:var(--separator-width);block-size:var(--separator-height);background:var(--separator-color)}.input-otp-disabled.sc-nano-input-otp-h .input-otp-description.sc-nano-input-otp,.input-otp-disabled.sc-nano-input-otp-h .input-otp-group.sc-nano-input-otp{--color:var(--nano-color-neutral-700);opacity:0.5}.input-otp-disabled.sc-nano-input-otp-h,.input-otp-disabled.sc-nano-input-otp-h .native-input.sc-nano-input-otp:disabled{cursor:not-allowed}.has-focus.sc-nano-input-otp-h .native-input.sc-nano-input-otp:focus{outline:var(--nano-focus-ring)}.nano-invalid.sc-nano-input-otp-h .native-input.sc-nano-input-otp{border-color:var(--highlight-color-invalid)}.nano-valid.sc-nano-input-otp-h .native-input.sc-nano-input-otp{border-color:var(--highlight-color-valid)}.input-otp-icon.sc-nano-input-otp{position:absolute;inset-block-start:50%;transform:translateY(-43%);inset-inline-end:calc((var(--gap) + var(--icon-size)) * -1);inline-size:var(--icon-size);block-size:var(--icon-size);display:flex;align-items:center}.input-otp-icon--valid.sc-nano-input-otp{color:var(--nano-color-success-1100)}.input-otp-icon--invalid.sc-nano-input-otp{color:var(--nano-color-warning-1100)}";export{r as nano_input_otp}
|
|
4
|
+
import{r as t,c as i,a as n,h as o,F as s,d as a}from"./index-vpnVjPKQ.js";import{H as e}from"./slot-wHS7-PXA.js";const r=class{constructor(n){t(this,n),this.nanoInput=i(this,"nanoInput",7),this.nanoChange=i(this,"nanoChange",7),this.nanoComplete=i(this,"nanoComplete",7),this.nanoBlur=i(this,"nanoBlur",7),this.nanoClear=i(this,"nanoClear",7),this.nanoFocus=i(this,"nanoFocus",7)}inputRefs=[];inputId="nano-input-otp-"+p++;slotCtrl=new e(this,"[default]");focusedValue;isKeyboardNavigation=!1;get el(){return n(this)}inputValues=[];hasFocus=!1;previousInputValues=[];invalid=!1;valid=!1;disabled=!1;inputmode;length=6;pattern;readonly=!1;type="number";value="";allowInvalid=!1;showValidity=!1;nanoInput;nanoChange;nanoComplete;nanoBlur;nanoClear;nanoFocus;async setFocus(t){if("number"==typeof t){const i=Math.max(0,Math.min(t,this.length-1));this.inputRefs[i]?.focus()}else{const t=this.getTabbableIndex();this.inputRefs[t]?.focus()}}async clear(){this.value="",this.inputRefs.forEach(((t,i)=>{t.value=this.inputValues[i]||""})),this.nanoClear.emit()}valueChanged(){this.initializeValues(),this.updateTabIndexes(),this.computeValidity()}componentWillLoad(){this.initializeValues(),this.computeValidity(),this.valid&&this.nanoComplete.emit({valid:this.valid,value:this.value?.toString()})}componentDidLoad(){this.updateTabIndexes()}get validKeyPattern(){return new RegExp(`^${this.getPattern()}$`,"u")}get specialCharsPattern(){return new RegExp("^[\\p{S}\\p{P}]$","u")}getPattern(){const{pattern:t,type:i}=this;return t||("number"===i?"[\\p{N}]":"[\\p{L}\\p{N}]")}getInputmode(){const{inputmode:t}=this;return t||("number"==this.type?"numeric":"text")}initializeValues(){this.inputValues=Array(this.length).fill(""),null!=this.value&&0!==String(this.value).length&&(String(this.value).split("").slice(0,this.length).forEach(((t,i)=>{(this.allowInvalid&&!this.specialCharsPattern.test(t)||this.validKeyPattern.test(t))&&(this.inputValues[i]=t)})),this.value=this.inputValues.join(""),this.previousInputValues=[...this.inputValues])}isRTL=t=>t&&""!==t.dir?"rtl"===t.dir.toLowerCase():"rtl"===document?.dir.toLowerCase();updateValue(t){const{inputValues:i,length:n}=this,o=this.getValidChars(i.join("")).join("");this.value=o,this.computeValidity(),this.emitNanoInput(t),o.length===n&&this.nanoComplete.emit({value:o,valid:this.valid})}emitNanoChange(t){const{value:i}=this,n=null==i?i:i.toString();this.computeValidity(),this.nanoChange.emit({value:n?.toString(),event:t,valid:this.valid})}emitNanoInput(t){const{value:i}=this,n=null==i?i:i.toString();this.computeValidity(),this.nanoInput.emit({value:n?.toString(),event:t,valid:this.valid})}onFocus=t=>i=>{const{inputRefs:n}=this;this.hasFocus||(this.nanoFocus.emit(i),this.focusedValue=this.value),this.hasFocus=!0;let o=t;if(!this.isKeyboardNavigation){const i=this.inputValues[t]?t:this.getFirstEmptyIndex();o=-1===i?this.length-1:i,this.inputRefs[o]?.focus()}n.forEach(((t,i)=>{t.tabIndex=i===o?0:-1})),this.isKeyboardNavigation=!1};onBlur=t=>{const{inputRefs:i}=this,n=t.relatedTarget;null!=n&&i.includes(n)||(this.hasFocus=!1,this.updateTabIndexes(),this.nanoBlur.emit(t),this.focusedValue!==this.value&&this.emitNanoChange(t))};focusNext(t){const{inputRefs:i,length:n}=this;t<n-1&&i[t+1]?.focus()}focusPrevious(t){const{inputRefs:i}=this;t>0&&i[t-1]?.focus()}getFirstEmptyIndex(){const{inputValues:t,length:i}=this;return Array.from({length:i},((i,n)=>t[n]||"")).findIndex((t=>!t||""===t))??-1}getTabbableIndex(){const{length:t}=this,i=this.getFirstEmptyIndex();return-1===i?t-1:i}updateTabIndexes(){const{inputRefs:t,inputValues:i,length:n}=this;let o=-1;for(let t=0;t<n;t++)if(!i[t]||""===i[t]){o=t;break}t.forEach(((t,s)=>{const a=-1===o?s===n-1:o===s;t.tabIndex=a?0:-1,t.setAttribute("aria-hidden",i[s]&&""!==i[s]||a?"false":"true")}))}onKeyDown=t=>i=>{const{length:n}=this,o=this.isRTL(this.el),s=i.target;if(!(s.selectionStart!==s.selectionEnd||(i.metaKey||i.ctrlKey)&&["a","c","v","x","r","z","y"].includes(i.key.toLowerCase())))if("Backspace"===i.key)if(this.inputValues[t]){for(let i=t;i<n-1;i++)this.inputValues[i]=this.inputValues[i+1];this.inputValues[n-1]="";for(let t=0;t<n;t++)this.inputRefs[t].value=this.inputValues[t]||"";this.updateValue(i),i.preventDefault()}else!this.inputValues[t]&&t>0&&this.focusPrevious(t);else if("ArrowLeft"===i.key||"ArrowRight"===i.key){this.isKeyboardNavigation=!0,i.preventDefault();const s="ArrowLeft"===i.key;s&&o||!s&&!o?this.inputValues[t]&&t<n-1&&this.focusNext(t):this.focusPrevious(t)}else if("Tab"===i.key)return void(this.isKeyboardNavigation=!0)};onInput=t=>i=>{const{length:n,validKeyPattern:o,allowInvalid:s}=this,a=i.target,e=a.value,r=this.previousInputValues[t]||"";if(e.length-r.length>1){const t=this.getValidChars(e);0===t.length&&requestAnimationFrame((()=>{this.inputRefs.forEach((t=>{t.value=""}))}));for(let i=0;i<n;i++)this.inputValues[i]=t[i]||"",this.inputRefs[i].value=t[i]||"";return this.updateValue(i),setTimeout((()=>{const i=t.length<n?t.length:n-1;this.inputRefs[i]?.focus()}),20),void(this.previousInputValues=[...this.inputValues])}if(!s&&e.length>0&&!o.test(e[e.length-1])||s&&this.specialCharsPattern.test(e[e.length-1]))return a.value=this.inputValues[t]||"",void(this.previousInputValues=[...this.inputValues]);if(0===a.selectionStart&&a.selectionEnd===e.length||!this.inputValues[t])return this.inputValues[t]=e,a.value=e,this.updateValue(i),this.focusNext(t),void(this.previousInputValues=[...this.inputValues]);if(this.inputValues[t]&&""===this.inputValues[this.inputValues.length-1]&&2===e.length){let n=i.data;if(n||(n=e.split("").find(((t,i)=>t!==r[i]))||e[e.length-1]),!s&&!o.test(n))return a.value=this.inputValues[t]||"",void(this.previousInputValues=[...this.inputValues]);for(let i=this.inputValues.length-1;i>t;i--)this.inputValues[i]=this.inputValues[i-1],this.inputRefs[i].value=this.inputValues[i]||"";return this.inputValues[t]=n,this.inputRefs[t].value=n,this.updateValue(i),void(this.previousInputValues=[...this.inputValues])}const p=e[(a.selectionStart??e.length)-1]??e[0];if(!s&&!o.test(p))return a.value=this.inputValues[t]||"",void(this.previousInputValues=[...this.inputValues]);this.inputValues[t]=p,a.value=p,this.updateValue(i),this.previousInputValues=[...this.inputValues]};onPaste=t=>{const{inputRefs:i,length:n}=this;t.preventDefault();const o=t.clipboardData?.getData("text");if(!o)return void this.emitNanoInput(t);const s=this.getValidChars(o);s.forEach(((t,i)=>{i<n&&(this.inputRefs[i].value=t,this.inputValues[i]=t)})),this.value=s.join(""),this.updateValue(t);const a=s.length<n?s.length:n-1;i[a]?.focus()};showSeparator(t){const{length:i}=this;return!(i<3||i%2!=0)&&t===i/2-1}getValidChars(t){const{allowInvalid:i,validKeyPattern:n,length:o}=this;return t.split("").filter(i?t=>""!==t.trim()&&!this.specialCharsPattern.test(t):t=>""!==t.trim()&&n.test(t)).slice(0,o)}computeValidity(){this.invalid=this.allowInvalid&&this.inputValues.some((t=>""!==t&&!this.validKeyPattern.test(t))),this.valid=this.inputValues.length===this.length&&this.inputValues.every((t=>""!==t&&this.validKeyPattern.test(t)))}render(){const{disabled:t,hasFocus:i,inputId:n,inputRefs:e,inputValues:r,length:p,readonly:h,invalid:l,valid:c}=this,u=this.getInputmode(),d=this.getTabbableIndex(),v=this.getPattern();return o(a,{key:"69c1b3c4a4cae21665bb7e3646a27a89f8d0a73b",class:{"has-focus":i,"input-otp-disabled":t,"input-otp-readonly":h,"nano-invalid":l,"nano-valid":c}},o("div",{key:"9fcd9882d552cde88adfa7578e556155651bbb4d",class:"input-otp-container"},o("div",{key:"3e2c1a83282c08c1ccef81c4f13a895f1efeec13",class:"input-otp-group",role:"group","aria-label":"One-time password input"},Array.from({length:p}).map(((i,a)=>o(s,null,o("div",{class:"native-wrapper"},o("input",{class:"native-input",id:`${n}-${a}`,"aria-label":`Input ${a+1} of ${p}`,type:"text",inputmode:u,pattern:v,disabled:t,readOnly:h,tabIndex:a===d?0:-1,value:r[a]||"",autocomplete:"one-time-code",ref:t=>e[a]=t,onInput:this.onInput(a),onBlur:this.onBlur,onFocus:this.onFocus(a),onKeyDown:this.onKeyDown(a),onPaste:this.onPaste})),this.showSeparator(a)&&o("div",{class:"input-otp-separator"}))))),this.showValidity&&o("div",{key:"b5d9d9f3023cca6fcf9d8a394287de2333eeff54",class:{"input-otp-icon":!0,"input-otp-icon--valid":c,"input-otp-icon--invalid":l},part:"validity-icon"},o("slot",{key:"d4a3123b713487f579a503ea1158e73b97a35198",name:"validity-icon"},o("nano-icon",{key:"2d7886aadaaa786f3594ace3d4fa3d2ebbdc30c3",hidden:!c,name:"light/circle-check",class:"input-otp-valid-icon","aria-label":"Valid input"})))),this.slotCtrl.has("[default]")&&o("div",{key:"32b6883425e8f62bda344ad6f92ff63a5fef98f4",class:"input-otp-description"},o("slot",{key:"81b5c65f7c8bab2f8bf371c03bc5a2ae455b6c3f"})))}static get watchers(){return{value:["valueChanged"]}}};let p=0;r.style=".sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{box-sizing:border-box}[hidden].sc-nano-input-otp{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{box-sizing:border-box}[hidden].sc-nano-input-otp{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-input-otp-h,*.sc-nano-input-otp,*.sc-nano-input-otp::before,*.sc-nano-input-otp::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-input-otp-h{--color:initial;--min-width:40px;--width:40px;--height:50px;--gap:8px;--icon-size:var(--nano-pictogram-size-small);--inline-padding:calc(var(--icon-size) + var(--gap));--spacing:var(--nano-spacing-xl);--separator-width:7px;--separator-height:1px;--separator-border-radius:0;--separator-color:var(--nano-color-fill-primary);--highlight-color-valid:var(--nano-color-fill-success);--highlight-color-invalid:var(--nano-color-fill-warning);--border-radius:8px;--border-color:var(--nano-color-fill-neutral);--border-width:1px;display:block;position:relative;margin-inline:var(--inline-padding)}.input-otp-container.sc-nano-input-otp{position:relative;inline-size:fit-content;block-size:fit-content;margin:0 auto}.input-otp-group.sc-nano-input-otp{display:flex;align-items:center;justify-content:center;gap:var(--gap)}.native-wrapper.sc-nano-input-otp{display:flex;align-items:center;justify-content:center;min-inline-size:var(--min-width)}.native-input.sc-nano-input-otp{border-radius:var(--border-radius);inline-size:var(--width);min-inline-size:inherit;block-size:var(--height);border-width:var(--border-width);border-style:solid;border-color:var(--border-color);background:var(--background);color:var(--color);font-size:inherit;text-align:center;appearance:none}.input-otp-description.sc-nano-input-otp{color:currentcolor;font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);text-align:center;position:relative;margin-block-start:var(--spacing)}.input-otp-description-hidden.sc-nano-input-otp{display:none}.input-otp-separator.sc-nano-input-otp{border-radius:var(--separator-border-radius);flex-shrink:0;inline-size:var(--separator-width);block-size:var(--separator-height);background:var(--separator-color)}.input-otp-disabled.sc-nano-input-otp-h .input-otp-description.sc-nano-input-otp,.input-otp-disabled.sc-nano-input-otp-h .input-otp-group.sc-nano-input-otp{--color:var(--nano-color-fill-neutral);opacity:0.5}.input-otp-disabled.sc-nano-input-otp-h,.input-otp-disabled.sc-nano-input-otp-h .native-input.sc-nano-input-otp:disabled{cursor:not-allowed}.has-focus.sc-nano-input-otp-h .native-input.sc-nano-input-otp:focus{outline:var(--nano-focus-ring)}.nano-invalid.sc-nano-input-otp-h .native-input.sc-nano-input-otp{border-color:var(--highlight-color-invalid)}.nano-valid.sc-nano-input-otp-h .native-input.sc-nano-input-otp{border-color:var(--highlight-color-valid)}.input-otp-icon.sc-nano-input-otp{position:absolute;inset-block-start:50%;transform:translateY(-43%);inset-inline-end:calc((var(--gap) + var(--icon-size)) * -1);inline-size:var(--icon-size);block-size:var(--icon-size);display:flex;align-items:center}.input-otp-icon--valid.sc-nano-input-otp{color:var(--nano-color-fill-success)}.input-otp-icon--invalid.sc-nano-input-otp{color:var(--nano-color-fill-warning)}";export{r as nano_input_otp}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,c as
|
|
4
|
+
import{r as t,c as s,a as e,d as i}from"./index-vpnVjPKQ.js";import{h as n}from"./renderer-CTaemqrs.js";import{f as o}from"./scroll-Cpis33Lx.js";import"./dom-QEz8hlsO.js";const h=class{constructor(e){t(this,e),this.nanoIntersectionChange=s(this,"nanoIntersectionChange",7),this.nanoIntersecting=s(this,"nanoIntersecting",7),this.nanoNotIntersecting=s(this,"nanoNotIntersecting",7)}io;_root;_threshold;defaultSlot;get observerOptions(){const t={};return this._root&&(t.root=this._root),this.rootMargin&&(t.rootMargin=this.rootMargin),this.threshold&&(t.threshold=this._threshold),t}get elements(){return(this.defaultSlot?.assignedElements()||[]).flatMap((t=>getComputedStyle(t).display.includes("contents")?Array.from(t.children):t))}get host(){return e(this)}root="auto";handleRootChange(){if(this.removeIO(),!this.root)return;let t;"auto"===this.root?t=o(this.host):"root"===this.root?t=void 0:"string"==typeof this.root?(t=this.host.closest(this.root),t||(console.warn(`nano-intersection-observe: root element "${this.root}" not found.`),t=void 0)):t=this.root,t===document.documentElement&&(t=void 0),t===this._root&&this.io||(this._root=t,this.addIO())}rootMargin;threshold;handleThresholdChange(){this._threshold=this.threshold?this.threshold.includes(",")?this.threshold.split(",").map((t=>Number(t))):Number(this.threshold):void 0}nanoIntersectionChange;nanoIntersecting;nanoNotIntersecting;ioCallback=t=>{t.forEach((t=>{this.nanoIntersectionChange.emit(t),t.isIntersecting&&this.nanoIntersecting.emit(t),t.isIntersecting||this.nanoNotIntersecting.emit(t)}))};handleSlotChange=()=>{this.addIO()};addIO(){if(!this.elements?.length)return;this.io&&this.removeIO();const t=this.io=new IntersectionObserver(this.ioCallback,this.observerOptions);this.elements?.forEach((s=>{t.observe(s)}))}removeIO(){this.io&&(this.io.disconnect(),this.io=void 0)}connectedCallback(){this.handleThresholdChange(),this.handleRootChange()}disconnectedCallback(){this.removeIO()}render(){return n(i,{key:"6ed0913499a9caede509c0394a2be337ddbcfc7c",class:"nano-intersection-observe"},n("slot",{key:"a55eeb8c1527dd62aba761b60b6a0764cbd5bfa4",ref:t=>this.defaultSlot=t,onSlotchange:this.handleSlotChange}))}static get watchers(){return{root:["handleRootChange"],threshold:["handleThresholdChange"],defaultSlot:["addIO"]}}};h.style="nano-intersection-observe { display: contents }";export{h as nano_intersection_observe}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,g as i,a}from"./index-BM3Om9WE.js";import{h as o}from"./renderer-DpNDfhNy.js";import{g as s,a as e}from"./dom-dlicJTEJ.js";import{d as n}from"./throttle-C93FMm2Z.js";import{s as r}from"./scroll-1nFw8CNk.js";const l=class{label;scrollControls=!0;orientation="horizontal";showIndicator=!1;hideScrollbars;watchHideScrollbars(){null==this.hideScrollbars&&(this.hideScrollbars="vertical"!==this.orientation)}activeHandler=t=>t.classList.add("active");inactiveHandler=t=>t.classList.remove("active");isActiveHandler=t=>t.classList.contains("active");watchIsActiveHandler(){this.instantReCalc=!0,this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i))),setTimeout((()=>this.instantReCalc=!1),300)}async syncActiveItem(){this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i)))}constructor(i){t(this,i),this.recalculatePositions=n(this.recalculatePositions.bind(this),80)}ro;nav;itemContainer;isRtl;endBtn;startBtn;activeIndicator;mutationObservers=new WeakMap;get scrollProp(){return"horizontal"===this.orientation?"scrollWidth":"scrollHeight"}get clientDimensionProp(){return"horizontal"===this.orientation?"clientWidth":"clientHeight"}get scrollOffset(){return"horizontal"===this.orientation?"scrollLeft":"scrollTop"}get host(){return i(this)}instantReCalc=!1;hasScrollControls=!1;watchScrollControls(){this.hasScrollControls?this.handleScroll():this.hideControlStart=this.hideControlEnd=!0}hideControlEnd=!0;hideEndBtn(){this.endBtn&&this.activateBtn(this.endBtn,!this.hideControlEnd)}hideControlStart=!0;hideStartBtn(){this.startBtn&&this.activateBtn(this.startBtn,!this.hideControlStart)}activateBtn(t,i=!0){if(!i)return t.tabIndex=-1,t.disabled=!0,void t.classList.remove("is-shown");t.removeAttribute("tabindex"),t.disabled=!1,t.classList.add("is-shown")}get allActiveItems(){return this.allItems.filter((t=>!t.disabled||t.classList.contains("disabled")))}get allItems(){return s(this.host,"*","slot")}get activeItem(){return this._activeItem}set activeItem(t){t&&t!==this.activeItem&&!t.disabled&&this.allActiveItems.includes(t)&&(this._activeItem=t,this.allActiveItems.forEach(((t,i)=>{t===this._activeItem?this.activeHandler(t,i):this.inactiveHandler(t,i)})),this.recalculatePositions())}_activeItem;get navDim(){if(!this.nav)return 0;const t=getComputedStyle(this.nav);let i=this.nav[this.clientDimensionProp];return"horizontal"===this.orientation?i-(parseFloat(t.paddingLeft)+parseFloat(t.paddingRight)):i-(parseFloat(t.paddingTop)+parseFloat(t.paddingBottom))}scrollToActiveItem(){this.nav&&this.activeItem&&this.hasScrollControls&&r(this.activeItem,this.nav,this.orientation,"center")}syncActiveItemIndicator(){if(!this.activeItem||!this.showIndicator)return;const t=this.activeItem,i=t.clientWidth||0,a=t.clientHeight+2||0,o=e(t,this.itemContainer);if(!this.activeIndicator)return;const s=o.top,n=o.left;switch(this.instantReCalc&&(this.activeIndicator.style.transition="none"),this.orientation){case"horizontal":this.activeIndicator.style.width=`${i}px`,this.activeIndicator.style.height=null,this.activeIndicator.style.transform=`translateX(${n}px)`;break;case"vertical":this.activeIndicator.style.width=null,this.activeIndicator.style.height=`${a}px`,this.activeIndicator.style.transform=`translateY(${s}px)`}setTimeout((()=>this.activeIndicator.style.transition=null),400)}updateScrollControls=()=>{this.nav&&(this.hasScrollControls=this.nav[this.scrollProp]>this.nav[this.clientDimensionProp]&&this.nav[this.scrollProp]>=this.itemContainer[this.clientDimensionProp],this.handleScroll())};handleScroll=()=>{if(!this.hasScrollControls)return void(this.hideControlStart=this.hideControlEnd=!0);const t=this.isRtl?0===this.nav[this.scrollOffset]:Math.abs(this.nav[this.clientDimensionProp]-(this.nav[this.scrollProp]-this.nav[this.scrollOffset]))<2;(this.isRtl?Math.abs(this.nav[this.scrollProp]+this.nav[this.scrollOffset]-this.nav[this.clientDimensionProp])<2:0===this.nav[this.scrollOffset])?(this.hideControlStart=!0,this.hideControlEnd=!1):t?(this.hideControlStart=!1,this.hideControlEnd=!0):(this.hideControlEnd=!1,this.hideControlStart=!1)};handleBtnClick=(t=!1)=>{const i=this.navDim;let a;a=t?this.nav[this.scrollOffset]+i-20:this.nav[this.scrollOffset]-i+20;try{this.nav.scroll({left:"horizontal"===this.orientation?a:0,top:"vertical"===this.orientation?a:0,behavior:"smooth"})}catch(t){this.nav[this.scrollOffset]=a}};slotChangeHandler=()=>{if(this.allActiveItems.length<2)return;const t=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i)));t&&(this.activeItem=t),this.recalculatePositions(),this.showIndicator&&this.allActiveItems.forEach((t=>{if(this.mutationObservers.get(t))return;const i=new MutationObserver((()=>this.syncActiveItemIndicator()));i.observe(t,{characterData:!0,childList:!0,subtree:!0}),this.mutationObservers.set(t,i)}))};handleClick=t=>{if(this.allActiveItems.length<2)return;const i=t.composedPath().find((t=>this.allActiveItems.includes(t)));i&&(this.activeItem=i)};handleKeyDown=t=>{if(["Enter"," "].includes(t.key)){const i=t.composedPath().find((t=>this.allActiveItems.includes(t)));i&&(this.activeItem=i)}};recalculatePositions=()=>{this.updateScrollControls(),this.syncActiveItemIndicator(),this.scrollToActiveItem()};connectedCallback(){this.instantReCalc=!0,this.isRtl="horizontal"===this.orientation&&!!this.host.closest('[dir="rtl"]'),window.MutationObserver&&this.slotChangeHandler(),window.ResizeObserver&&(this.ro&&(this.ro.disconnect(),this.ro=void 0),(this.ro=new ResizeObserver(this.recalculatePositions)).observe(this.host))}componentWillLoad(){this.watchHideScrollbars()}componentDidLoad(){this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i))),this.hideStartBtn(),this.hideEndBtn(),requestAnimationFrame((()=>this.instantReCalc=!1))}disconnectedCallback(){this.ro&&(this.ro.disconnect(),this.ro=void 0)}render(){return o(a,{key:"e5c6238730817f0c7036060faa8c344d514a3924",dir:this.isRtl?"rtl":null,class:"nano-masked-overflow","has-scroll-controls":this.hasScrollControls},o("div",{key:"4027acd51b80fd1bf2bb9d66a05ec051802732f3",part:"base",class:{onav:!0,[`onav--${this.orientation}`]:!0,"onav--has-scroll-controls":this.hasScrollControls,"onav--has-scroll-controls-start":!this.hideControlStart,"onav--has-scroll-controls-end":!this.hideControlEnd,"onav--no-transitions":this.instantReCalc,"onnav--has-indicator":this.showIndicator,"onnav--hide-scrollbars":this.hideScrollbars&&"false"!==this.hideScrollbars},onClick:this.handleClick,onKeyDown:this.handleKeyDown},o("div",{key:"a552b2e3cdf9f84249655b21ce6f2acb5c330a75",class:"onav__nav"},this.scrollControls&&o("nano-icon-button",{key:"5aca29990db29b3d0d00e6bca317cd3870d06d6b",part:"scroll-button scroll-button-prev",class:{"onav__scroll-button":!0,"onav__scroll-button--start":!0},ref:t=>this.startBtn=t,onClick:()=>this.handleBtnClick(!1),label:"Click to scroll",iconName:"horizontal"===this.orientation?"light/chevron-left":"light/chevron-up"}),o("div",{key:"9c2b4c91859b5c6c132ab2eecc01cf56eeec18b9",part:"scroller",ref:t=>this.nav=t,class:"onav__scroller",onScroll:this.handleScroll,tabindex:this.hasScrollControls?0:void 0,role:"region","aria-label":this.label||void 0},o("div",{key:"a77097f7b9a70e08f9a1eb980948c5c92dff760d",part:"items",ref:t=>this.itemContainer=t,class:"onav__items"},this.showIndicator&&o("div",{key:"b8661b042f9e195850a33ce3570b75c9bed25d7e",part:"indicator",ref:t=>this.activeIndicator=t,class:"onav__active-indicator"}),o("slot",{key:"54af572f6ef591d8d3cb34221e048ac0e32140bb",onSlotchange:this.slotChangeHandler}))),this.scrollControls&&o("nano-icon-button",{key:"e27a06cc2cec7ed373c527e3c6db5a0a56a90b71",part:"scroll-button scroll-button-next",class:{"onav__scroll-button":!0,"onav__scroll-button--end":!0},ref:t=>this.endBtn=t,onClick:()=>this.handleBtnClick(!0),label:"Click to scroll",iconName:"horizontal"===this.orientation?"light/chevron-right":"light/chevron-down"}))))}static get watchers(){return{hideScrollbars:["watchHideScrollbars"],isActiveHandler:["watchIsActiveHandler"],hasScrollControls:["watchScrollControls"],hideControlEnd:["hideEndBtn"],hideControlStart:["hideStartBtn"]}}};l.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--indicator-transition:var(--nano-transition-fast);--indicator-color:var(--nano-color-primary-1000);--indicator-size:3px;--indicator-track-color:var(--nano-color-neutral-300);--indicator-track-size:var(--indicator-size);--scroll-btn-color:var(--nano-color-primary-1200);--scroll-btn-size:1rem;--fade-size:100px;position:relative;z-index:var(--nano-z-index-raised)}:host([orientation=horizontal]){display:block}:host([orientation=vertical]){display:flex}.onav--no-transitions *{transition-duration:0s !important}.onav__nav:has(.onav__scroller:focus-visible){outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.onav__scroller{scrollbar-width:thin;overflow:auto;display:flex;transition:var(--nano-transition-fast) ease}.onav__scroller:focus{outline:none}.onnav--hide-scrollbars .onav__scroller{scrollbar-width:none;-ms-overflow-style:none}.onnav--hide-scrollbars .onav__scroller::-webkit-scrollbar{inline-size:0;block-size:0}.onav__items{flex:1 1 auto;position:relative;inline-size:auto;flex-wrap:nowrap;display:flex}.onnav--has-indicator .onav__items::before{content:"";background:var(--indicator-track-color);display:block;position:absolute;z-index:1}.onav__active-indicator{position:absolute;z-index:10;transition:var(--indicator-transition) transform ease, var(--indicator-transition) width ease, var(--indicator-transition) height ease}.nano-icon-button.onav__scroll-button{display:flex;align-items:center;justify-content:center;position:absolute;border:unset;z-index:2;transition:var(--nano-transition-fast) ease opacity;opacity:0;color:var(--scroll-btn-color);font-size:var(--scroll-btn-size);pointer-events:none}.nano-icon-button.onav__scroll-button.is-shown{opacity:1;pointer-events:all}.onav--horizontal.onav--has-scroll-controls .onav__scroller{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%);mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%)}.onav--horizontal.onav--has-scroll-controls-start .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:calc(100% + var(--fade-size) * 2);mask-size:calc(100% + var(--fade-size) * 2)}.onav--horizontal.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:calc(var(--fade-size) * -2) 0;mask-position:calc(var(--fade-size) * -2) 0;-webkit-mask-size:calc(100% + var(--fade-size) * 2);mask-size:calc(100% + var(--fade-size) * 2)}.onav--horizontal.onav--has-scroll-controls-start.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100%;mask-size:100%}.onav--horizontal .onav__items{flex-direction:row}.onav--horizontal .onav__items::before{inline-size:100%;block-size:var(--indicator-track-size);inset-block-end:0}.onav--horizontal .onav__active-indicator{inset-block-end:0;border-block-end:solid var(--indicator-size) var(--indicator-color)}.onav--horizontal .onav__scroll-button{inset-block:0}.onav--horizontal .onav__scroll-button--start{inset-inline-start:0}.onav--horizontal .onav__scroll-button--end{inset-inline-end:0}.onav--vertical{--fade-size:70px;inline-size:100%;display:flex}.onav--vertical .onav__nav{max-block-size:100%;min-inline-size:100%;display:flex}.onav--vertical .onav__scroller{inline-size:100%;flex-direction:column}.onav--vertical.onav--has-scroll-controls .onav__scroller{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-image:linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%);mask-image:linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%)}.onav--vertical.onav--has-scroll-controls-start .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100% calc(100% + var(--fade-size) * 2);mask-size:100% calc(100% + var(--fade-size) * 2)}.onav--vertical.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 calc(var(--fade-size) * -2);mask-position:0 calc(var(--fade-size) * -2);-webkit-mask-size:100% calc(100% + var(--fade-size) * 2);mask-size:100% calc(100% + var(--fade-size) * 2)}.onav--vertical.onav--has-scroll-controls-start.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100% 100%;mask-size:100% 100%}.onav--vertical .onav__items{flex-direction:column;inline-size:fit-content}.onav--vertical .onav__items::before{block-size:100%;inline-size:var(--indicator-track-size);inset-inline-start:0}.onav--vertical .onav__active-indicator{inset-inline-start:0;border-inline-start:solid var(--indicator-size) var(--indicator-color)}.onav--vertical .onav__scroll-button{inset-inline:0}.onav--vertical .onav__scroll-button--start{inset-block-start:0}.onav--vertical .onav__scroll-button--end{inset-block-end:0}';export{l as nano_masked_overflow}
|
|
4
|
+
import{r as t,a as i,d as a}from"./index-vpnVjPKQ.js";import{h as o}from"./renderer-CTaemqrs.js";import{g as s,a as e}from"./dom-QEz8hlsO.js";import{d as n}from"./throttle-C93FMm2Z.js";import{s as r}from"./scroll-Cpis33Lx.js";const l=class{label;scrollControls=!0;orientation="horizontal";showIndicator=!1;hideScrollbars;watchHideScrollbars(){null==this.hideScrollbars&&(this.hideScrollbars="vertical"!==this.orientation)}activeHandler=t=>t.classList.add("active");inactiveHandler=t=>t.classList.remove("active");isActiveHandler=t=>t.classList.contains("active");watchIsActiveHandler(){this.instantReCalc=!0,this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i))),setTimeout((()=>this.instantReCalc=!1),300)}async syncActiveItem(){this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i)))}constructor(i){t(this,i),this.recalculatePositions=n(this.recalculatePositions.bind(this),80)}ro;nav;itemContainer;isRtl;endBtn;startBtn;activeIndicator;mutationObservers=new WeakMap;get scrollProp(){return"horizontal"===this.orientation?"scrollWidth":"scrollHeight"}get clientDimensionProp(){return"horizontal"===this.orientation?"clientWidth":"clientHeight"}get scrollOffset(){return"horizontal"===this.orientation?"scrollLeft":"scrollTop"}get host(){return i(this)}instantReCalc=!1;hasScrollControls=!1;watchScrollControls(){this.hasScrollControls?this.handleScroll():this.hideControlStart=this.hideControlEnd=!0}hideControlEnd=!0;hideEndBtn(){this.endBtn&&this.activateBtn(this.endBtn,!this.hideControlEnd)}hideControlStart=!0;hideStartBtn(){this.startBtn&&this.activateBtn(this.startBtn,!this.hideControlStart)}activateBtn(t,i=!0){if(!i)return t.tabIndex=-1,t.disabled=!0,void t.classList.remove("is-shown");t.removeAttribute("tabindex"),t.disabled=!1,t.classList.add("is-shown")}get allActiveItems(){return this.allItems.filter((t=>!t.disabled||t.classList.contains("disabled")))}get allItems(){return s(this.host,"*","slot")}get activeItem(){return this._activeItem}set activeItem(t){t&&t!==this.activeItem&&!t.disabled&&this.allActiveItems.includes(t)&&(this._activeItem=t,this.allActiveItems.forEach(((t,i)=>{t===this._activeItem?this.activeHandler(t,i):this.inactiveHandler(t,i)})),this.recalculatePositions())}_activeItem;get navDim(){if(!this.nav)return 0;const t=getComputedStyle(this.nav);let i=this.nav[this.clientDimensionProp];return"horizontal"===this.orientation?i-(parseFloat(t.paddingLeft)+parseFloat(t.paddingRight)):i-(parseFloat(t.paddingTop)+parseFloat(t.paddingBottom))}scrollToActiveItem(){this.nav&&this.activeItem&&this.hasScrollControls&&r(this.activeItem,this.nav,this.orientation,"center")}syncActiveItemIndicator(){if(!this.activeItem||!this.showIndicator)return;const t=this.activeItem,i=t.clientWidth||0,a=t.clientHeight+2||0,o=e(t,this.itemContainer);if(!this.activeIndicator)return;const s=o.top,n=o.left;switch(this.instantReCalc&&(this.activeIndicator.style.transition="none"),this.orientation){case"horizontal":this.activeIndicator.style.width=`${i}px`,this.activeIndicator.style.height=null,this.activeIndicator.style.transform=`translateX(${n}px)`;break;case"vertical":this.activeIndicator.style.width=null,this.activeIndicator.style.height=`${a}px`,this.activeIndicator.style.transform=`translateY(${s}px)`}setTimeout((()=>this.activeIndicator.style.transition=null),400)}updateScrollControls=()=>{this.nav&&(this.hasScrollControls=this.nav[this.scrollProp]>this.nav[this.clientDimensionProp]&&this.nav[this.scrollProp]>=this.itemContainer[this.clientDimensionProp],this.handleScroll())};handleScroll=()=>{if(!this.hasScrollControls)return void(this.hideControlStart=this.hideControlEnd=!0);const t=this.isRtl?0===this.nav[this.scrollOffset]:Math.abs(this.nav[this.clientDimensionProp]-(this.nav[this.scrollProp]-this.nav[this.scrollOffset]))<2;(this.isRtl?Math.abs(this.nav[this.scrollProp]+this.nav[this.scrollOffset]-this.nav[this.clientDimensionProp])<2:0===this.nav[this.scrollOffset])?(this.hideControlStart=!0,this.hideControlEnd=!1):t?(this.hideControlStart=!1,this.hideControlEnd=!0):(this.hideControlEnd=!1,this.hideControlStart=!1)};handleBtnClick=(t=!1)=>{const i=this.navDim;let a;a=t?this.nav[this.scrollOffset]+i-20:this.nav[this.scrollOffset]-i+20;try{this.nav.scroll({left:"horizontal"===this.orientation?a:0,top:"vertical"===this.orientation?a:0,behavior:"smooth"})}catch(t){this.nav[this.scrollOffset]=a}};slotChangeHandler=()=>{if(this.allActiveItems.length<2)return;const t=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i)));t&&(this.activeItem=t),this.recalculatePositions(),this.showIndicator&&this.allActiveItems.forEach((t=>{if(this.mutationObservers.get(t))return;const i=new MutationObserver((()=>this.syncActiveItemIndicator()));i.observe(t,{characterData:!0,childList:!0,subtree:!0}),this.mutationObservers.set(t,i)}))};handleClick=t=>{if(this.allActiveItems.length<2)return;const i=t.composedPath().find((t=>this.allActiveItems.includes(t)));i&&(this.activeItem=i)};handleKeyDown=t=>{if(["Enter"," "].includes(t.key)){const i=t.composedPath().find((t=>this.allActiveItems.includes(t)));i&&(this.activeItem=i)}};recalculatePositions=()=>{this.updateScrollControls(),this.syncActiveItemIndicator(),this.scrollToActiveItem()};connectedCallback(){this.instantReCalc=!0,this.isRtl="horizontal"===this.orientation&&!!this.host.closest('[dir="rtl"]'),window.MutationObserver&&this.slotChangeHandler(),window.ResizeObserver&&(this.ro&&(this.ro.disconnect(),this.ro=void 0),(this.ro=new ResizeObserver(this.recalculatePositions)).observe(this.host))}componentWillLoad(){this.watchHideScrollbars()}componentDidLoad(){this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i))),this.hideStartBtn(),this.hideEndBtn(),requestAnimationFrame((()=>this.instantReCalc=!1))}disconnectedCallback(){this.ro&&(this.ro.disconnect(),this.ro=void 0)}render(){return o(a,{key:"e5c6238730817f0c7036060faa8c344d514a3924",dir:this.isRtl?"rtl":null,class:"nano-masked-overflow","has-scroll-controls":this.hasScrollControls},o("div",{key:"4027acd51b80fd1bf2bb9d66a05ec051802732f3",part:"base",class:{onav:!0,[`onav--${this.orientation}`]:!0,"onav--has-scroll-controls":this.hasScrollControls,"onav--has-scroll-controls-start":!this.hideControlStart,"onav--has-scroll-controls-end":!this.hideControlEnd,"onav--no-transitions":this.instantReCalc,"onnav--has-indicator":this.showIndicator,"onnav--hide-scrollbars":this.hideScrollbars&&"false"!==this.hideScrollbars},onClick:this.handleClick,onKeyDown:this.handleKeyDown},o("div",{key:"a552b2e3cdf9f84249655b21ce6f2acb5c330a75",class:"onav__nav"},this.scrollControls&&o("nano-icon-button",{key:"5aca29990db29b3d0d00e6bca317cd3870d06d6b",part:"scroll-button scroll-button-prev",class:{"onav__scroll-button":!0,"onav__scroll-button--start":!0},ref:t=>this.startBtn=t,onClick:()=>this.handleBtnClick(!1),label:"Click to scroll",iconName:"horizontal"===this.orientation?"light/chevron-left":"light/chevron-up"}),o("div",{key:"9c2b4c91859b5c6c132ab2eecc01cf56eeec18b9",part:"scroller",ref:t=>this.nav=t,class:"onav__scroller",onScroll:this.handleScroll,tabindex:this.hasScrollControls?0:void 0,role:"region","aria-label":this.label||void 0},o("div",{key:"a77097f7b9a70e08f9a1eb980948c5c92dff760d",part:"items",ref:t=>this.itemContainer=t,class:"onav__items"},this.showIndicator&&o("div",{key:"b8661b042f9e195850a33ce3570b75c9bed25d7e",part:"indicator",ref:t=>this.activeIndicator=t,class:"onav__active-indicator"}),o("slot",{key:"54af572f6ef591d8d3cb34221e048ac0e32140bb",onSlotchange:this.slotChangeHandler}))),this.scrollControls&&o("nano-icon-button",{key:"e27a06cc2cec7ed373c527e3c6db5a0a56a90b71",part:"scroll-button scroll-button-next",class:{"onav__scroll-button":!0,"onav__scroll-button--end":!0},ref:t=>this.endBtn=t,onClick:()=>this.handleBtnClick(!0),label:"Click to scroll",iconName:"horizontal"===this.orientation?"light/chevron-right":"light/chevron-down"}))))}static get watchers(){return{hideScrollbars:["watchHideScrollbars"],isActiveHandler:["watchIsActiveHandler"],hasScrollControls:["watchScrollControls"],hideControlEnd:["hideEndBtn"],hideControlStart:["hideStartBtn"]}}};l.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--indicator-transition:var(--nano-transition-fast);--indicator-color:var(--nano-color-fill-primary);--indicator-size:3px;--indicator-track-color:var(--nano-color-fill-neutral-weak);--indicator-track-size:var(--indicator-size);--scroll-btn-color:var(--nano-color-fill-primary-pressed);--scroll-btn-size:1rem;--fade-size:100px;position:relative;z-index:var(--nano-z-index-raised)}:host([orientation=horizontal]){display:block}:host([orientation=vertical]){display:flex}.onav--no-transitions *{transition-duration:0s !important}.onav__nav:has(.onav__scroller:focus-visible){outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.onav__scroller{scrollbar-width:thin;overflow:auto;display:flex;transition:var(--nano-transition-fast) ease}.onav__scroller:focus{outline:none}.onnav--hide-scrollbars .onav__scroller{scrollbar-width:none;-ms-overflow-style:none}.onnav--hide-scrollbars .onav__scroller::-webkit-scrollbar{inline-size:0;block-size:0}.onav__items{flex:1 1 auto;position:relative;inline-size:auto;flex-wrap:nowrap;display:flex}.onnav--has-indicator .onav__items::before{content:"";background:var(--indicator-track-color);display:block;position:absolute;z-index:1}.onav__active-indicator{position:absolute;z-index:10;transition:var(--indicator-transition) transform ease, var(--indicator-transition) width ease, var(--indicator-transition) height ease}.nano-icon-button.onav__scroll-button{display:flex;align-items:center;justify-content:center;position:absolute;border:unset;z-index:2;transition:var(--nano-transition-fast) ease opacity;opacity:0;color:var(--scroll-btn-color);font-size:var(--scroll-btn-size);pointer-events:none}.nano-icon-button.onav__scroll-button.is-shown{opacity:1;pointer-events:all}.onav--horizontal.onav--has-scroll-controls .onav__scroller{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%);mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%)}.onav--horizontal.onav--has-scroll-controls-start .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:calc(100% + var(--fade-size) * 2);mask-size:calc(100% + var(--fade-size) * 2)}.onav--horizontal.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:calc(var(--fade-size) * -2) 0;mask-position:calc(var(--fade-size) * -2) 0;-webkit-mask-size:calc(100% + var(--fade-size) * 2);mask-size:calc(100% + var(--fade-size) * 2)}.onav--horizontal.onav--has-scroll-controls-start.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100%;mask-size:100%}.onav--horizontal .onav__items{flex-direction:row}.onav--horizontal .onav__items::before{inline-size:100%;block-size:var(--indicator-track-size);inset-block-end:0}.onav--horizontal .onav__active-indicator{inset-block-end:0;border-block-end:solid var(--indicator-size) var(--indicator-color)}.onav--horizontal .onav__scroll-button{inset-block:0}.onav--horizontal .onav__scroll-button--start{inset-inline-start:0}.onav--horizontal .onav__scroll-button--end{inset-inline-end:0}.onav--vertical{--fade-size:70px;inline-size:100%;display:flex}.onav--vertical .onav__nav{max-block-size:100%;min-inline-size:100%;display:flex}.onav--vertical .onav__scroller{inline-size:100%;flex-direction:column}.onav--vertical.onav--has-scroll-controls .onav__scroller{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-image:linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%);mask-image:linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%)}.onav--vertical.onav--has-scroll-controls-start .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100% calc(100% + var(--fade-size) * 2);mask-size:100% calc(100% + var(--fade-size) * 2)}.onav--vertical.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 calc(var(--fade-size) * -2);mask-position:0 calc(var(--fade-size) * -2);-webkit-mask-size:100% calc(100% + var(--fade-size) * 2);mask-size:100% calc(100% + var(--fade-size) * 2)}.onav--vertical.onav--has-scroll-controls-start.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100% 100%;mask-size:100% 100%}.onav--vertical .onav__items{flex-direction:column;inline-size:fit-content}.onav--vertical .onav__items::before{block-size:100%;inline-size:var(--indicator-track-size);inset-inline-start:0}.onav--vertical .onav__active-indicator{inset-inline-start:0;border-inline-start:solid var(--indicator-size) var(--indicator-color)}.onav--vertical .onav__scroll-button{inset-inline:0}.onav--vertical .onav__scroll-button--start{inset-block-start:0}.onav--vertical .onav__scroll-button--end{inset-block-end:0}';export{l as nano_masked_overflow}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as o,
|
|
4
|
+
import{r as o,a as e,e as n,d as t}from"./index-vpnVjPKQ.js";import{c as a}from"./dom-QEz8hlsO.js";import{t as i,h as s}from"./renderer-CTaemqrs.js";import{H as r}from"./slot-wHS7-PXA.js";const l=class{constructor(e){o(this,e)}containerDiv;contentDiv;globalNav;children=[];ro;slotCtrl=new r(this,"foot");get el(){return e(this)}reset=!1;isLoading=!0;hide=!1;secondaryOpen=!1;open=!0;hideWidth=576;cancelNavItemEvents(o){o.detail.secondaryMenu&&(o.stopPropagation(),this.secondaryOpen="nanoOpen"===o.type)}openChange(){if(localStorage.setItem("nanoMenuDrawerOpen",this.open.toString()),this.containerDiv){const o=document.documentElement.clientWidth,e=Math.abs(window.innerWidth-o);if(this.open){const o=this.contentDiv.scrollWidth;n((()=>{this.containerDiv.style.width=o+"px",this.containerDiv.style.setProperty("--menu-width",o+"px"),this.containerDiv.style.setProperty("--scrollbar-width",e+"px")}))}else n((()=>{this.containerDiv.style.width=null,this.containerDiv.style.removeProperty("--menu-width"),this.containerDiv.style.setProperty("--scrollbar-width",e+"px")}))}}moveItemsToGlobalNav(){const o=this.el.querySelectorAll(i("nano-nav-item"));this.hide=!0,this.globalNav.triggerResize(),o.forEach((o=>{this.children.push({slot:o.getAttribute("slot"),element:o}),o.setAttribute("slot","menu"),o.classList.add("nano-global-nav-menu"),this.globalNav.appendChild(o)}))}moveItemsToDrawer(){this.children&&this.children.length&&(this.children.forEach((o=>{o.element.removeAttribute("slot"),o.element.classList.remove("nano-global-nav-menu"),o.slot&&o.slot.length&&o.element.setAttribute("slot",o.slot),this.el.appendChild(o.element)})),this.children=[],this.hide=!1)}onResize=()=>{if(!this.globalNav)return;const{width:o}=this.globalNav.getBoundingClientRect();o>this.hideWidth?this.moveItemsToDrawer():this.moveItemsToGlobalNav()};toggle=o=>{o.preventDefault(),this.open=!this.open};attachRO(){this.ro||(this.ro=new ResizeObserver((()=>{this.onResize()})),this.ro.observe(this.globalNav))}componentWillLoad(){this.globalNav=a(i("nano-global-nav"),this.el),this.globalNav||console.warn("nano-menu-drawer: no nano-global-nav found in the document. nano-global-nav is required to use nano-menu-drawer.");{const o=localStorage.getItem("nanoMenuDrawerOpen");this.open=o?"true"===o:this.open,this.globalNav.componentOnReady().then((()=>{this.openChange()}))}}connectedCallback(){this.onResize()}componentDidLoad(){this.attachRO()}disconnectedCallback(){this.ro?.disconnect(),this.ro=void 0}render(){return s(t,{key:"bed821db8e5a30f26c3c9bad45b01321bdf4ca77",class:{open:this.open,"secondary-open":this.secondaryOpen,hide:this.hide,loading:this.isLoading,"has-global-nav":!!this.globalNav,"nano-menu-drawer":!0},dir:"rtl"===this.el.ownerDocument.dir?"rtl":null},s("div",{key:"e80fe18a73873359fc1d86ca93a06b8c6d3173c1",ref:o=>this.containerDiv=o,class:"container"},s("div",{key:"fe83b1858bacd94f3e0540ee3933d1018f7bfb9d",class:"content-wrap "+(this.secondaryOpen?"secondary-open":"")},s("nav",{key:"bed3b6c253cf16f8a796393be71c2c1b9aebd266",ref:o=>this.contentDiv=o,class:"content"},s("div",{key:"a8ea363c51345c83fcbf8723a32627bd99c5a9cf",class:"head"},s("button",{key:"fa9765354704685582e64771ded73c30c88e0374",onClick:this.toggle,class:"collapse-btn"},s("nano-icon",{key:"0489c46c0c76a72720daf6656e26c2946433bccc",name:"light/arrow-right-to-line"}),s("span",{key:"81b00aaf09a528d6137351df20e23149a5325bf0",class:"visually-hidden"},"collapse / expand menu"))),s("slot",{key:"ab5f6ed3b81b2d5f741a1d102a12db5b0f68bae7"}),this.slotCtrl.has("foot")&&s("div",{key:"dbb8345173ee78b9685cc46c6dcde5c2d617a868",class:"foot"},s("slot",{key:"93bfeb1493a1d5e9a420803a09e64dced877591b",name:"foot"}))))))}static get watchers(){return{open:["openChange"]}}};l.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding-top:13px;--padding-end:13px;--padding-bottom:13px;--padding-start:13px;--icon-size:19px;--font-size:var(--nano-font-size-xs);--bg-color:var(--nano-color-surface-sunken);--bg-color-hover:var(--nano-color-surface-subtle);--bg-color-selected:var(--nano-color-fill-neutral-weak);--bg-color-open:var(--nano-color-fill-neutral-weak);--content-color:var(--nano-color-text-default);--divider-color:var(--nano-color-fill-neutral-weak);--global-nav-height:76px;--menu-width:calc((var(--padding-end) + var(--padding-start)) + var(--icon-size));color-scheme:dark;display:block;z-index:1;background:var(--bg-color);color:var(--content-color);min-block-size:100%}:host(.hide){display:none}.head{border-block-end:var(--divider-color) 1px solid}.container{inset-inline-end:auto;color:var(--content-color);inline-size:var(--menu-width);transition:inline-size 0.3s ease;inset-block-start:var(--global-nav-height);position:sticky;display:flex;flex-direction:column;block-size:100%;max-block-size:calc(100vh - var(--global-nav-height))}:host(.open) .container{inline-size:auto}.content-wrap{inset-inline-start:0;inset-block-start:0;inline-size:inherit;background:var(--bg-color);font-size:var(--font-size);line-height:1;display:flex;flex-direction:column;align-items:stretch;flex:1;box-shadow:var(--nano-shadow-ls)}.content-wrap.secondary-open{box-shadow:none}.content-wrap::after{content:"";position:absolute;inset:calc(var(--global-nav-height) * -1) 0 0;background-color:var(--bg-color);z-index:-1}.content{inline-size:auto;display:flex;flex-direction:column;overflow:hidden visible;flex:1}.collapse-btn{all:unset;padding-block:6px;margin-block-start:5px;padding-inline:var(--padding-start) var(--padding-end);inline-size:100%;display:flex;justify-items:flex-start;appearance:none;cursor:pointer;font-size:var(--icon-size)}.collapse-btn:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.collapse-btn:hover{background-color:var(--bg-color-hover)}.collapse-btn:active{background-color:var(--bg-color-selected)}.collapse-btn .nano-icon{transition:var(--nano-transition-x-fast) rotate ease-in-out;rotate:0deg}:host(.open) .collapse-btn .nano-icon{rotate:180deg}.visually-hidden{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.foot{margin-block:auto var(--padding-bottom)}';export{l as nano_menu_drawer}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,
|
|
4
|
+
import{r as t,a as e,d as s}from"./index-vpnVjPKQ.js";import{h as n}from"./renderer-CTaemqrs.js";const o=class{constructor(e){t(this,e)}get host(){return e(this)}show=!1;childrenSelector;maxToShow=3;noHideBtn=!1;get children(){let t;return t=this.childrenSelector?this.host.querySelectorAll(this.childrenSelector):this.host.children,Array.from(t).filter((t=>!t.hasAttribute("slot")))}handleShowHideElements(){this.children.forEach(((t,e)=>{this.show?"none"===t.style.display&&(t.style.display=""):t.style.display=e>=this.maxToShow?"none":""}))}handleClick(t){this.show=!this.show}connectedCallback(){this.handleShowHideElements()}render(){return n(s,{key:"b129148afdc959f912a16d1e2642c3e920a0a381",class:"nano-more-less"},n("slot",{key:"92aa96b6301d14f7b4d9aee9cc4cafbf0ff75431",onSlotchange:()=>this.handleShowHideElements()}),this.children?.length>this.maxToShow&&[n("div",{key:"73a5c457e8243cd8cf8e8ec1e681aa2c62244936",style:{display:this.show?"none":"contents"},class:"button-wrapper",part:"button-wrapper button-wrapper--less",onClick:t=>this.handleClick(t)},n("slot",{key:"48802275120ff78676a19b25f792806dd03db2c1",name:"less"},n("button",{key:"703d054e4560cf22d571a29838dfbd649062f7ca",part:"button button--less"},"Show more (+",this.children.length-this.maxToShow,")"))),this.noHideBtn?"":n("div",{style:{display:this.show?"contents":"none"},class:"button-wrapper",part:"button-wrapper button-wrapper--more",onClick:t=>this.handleClick(t)},n("slot",{name:"more"},n("button",{part:"button button--more"},"Show less (-",this.children.length-this.maxToShow,")")))])}static get watchers(){return{maxToShow:["handleShowHideElements"],show:["handleShowHideElements"],childrenSelector:["handleShowHideElements"]}}};o.style=":host { display: contents; }";export{o as nano_more_less}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,c as e,
|
|
4
|
+
import{r as t,c as e,a,d as n}from"./index-vpnVjPKQ.js";import{g as s}from"./dom-QEz8hlsO.js";import{g as i}from"./tabbable-CT4-pg7f.js";import{t as o,h as r}from"./renderer-CTaemqrs.js";import{H as c}from"./slot-wHS7-PXA.js";import{f as d}from"./active-element-CKJIkX0R.js";const h=(t,e)=>{const a={className:"",show:!0,showDisplay:"block",showProp:"classList",timeout:1e3,...e};return new Promise((e=>{const n=s=>{s.target!==t&&!s.composedPath().some((t=>t===s.target))||a.transitionProp&&!a.transitionProp.includes(s.propertyName)||(t.dataset.displayTransition="true",t.removeEventListener("transitionend",n),e("shown"))},s=n=>{n.target!==t&&!n.composedPath().some((t=>t===n.target))||a.transitionProp&&!a.transitionProp.includes(n.propertyName)||(t.style.display="none",t.dataset.displayTransition="false",t.removeEventListener("transitionend",s),e("hidden"))};a.show?(t.addEventListener("transitionend",n),t.style.display=a.showDisplay,setTimeout((()=>t[a.showProp].add(a.className)),50)):(t.addEventListener("transitionend",s),t[a.showProp].remove(a.className)),a.timeout&&setTimeout((()=>{a.show&&"true"!==t.dataset.displayTransition?(t.dataset.displayTransition="true",t.removeEventListener("transitionend",n),e("shown")):a.show||"false"===t.dataset.displayTransition||(t.style.display="none",t.dataset.displayTransition="false",t.removeEventListener("transitionend",s),e("hidden"))}),a.timeout)}))},l=class{constructor(a){t(this,a),this.nanoClose=e(this,"nanoClose",7),this.nanoOpen=e(this,"nanoOpen",7),this.nanoOpening=e(this,"nanoOpening",7),this.nanoClosing=e(this,"nanoClosing",7)}secondaryDiv;slotCtrl=new c(this,"secondary","close-button");controlElement;get host(){return a(this)}didOpen=!1;isInMenuDrawer=!1;href=null;target="_self";disabled=!1;open=!1;selected=!1;checkbox=!1;closeOnBlur=!0;nanoClose;nanoOpen;nanoOpening;nanoClosing;async setFocus(){this.controlElement&&this.controlElement.focus()}openChange(){this.slotCtrl.has("secondary")&&(this.open?this.openSecondary():this.closeSecondary())}didOpenChange(){if(!this.slotCtrl.has("secondary"))return;if(!this.didOpen)return d(this.host,this.controlElement)&&this.controlElement.focus({preventScroll:!0}),void this.nanoClose.emit({secondaryMenu:this.secondaryDiv});const t=new window.IntersectionObserver((e=>{e[0].boundingClientRect.top<0&&this.secondaryDiv.scrollIntoView({behavior:"smooth"}),t.disconnect()}),{threshold:1});t.observe(this.secondaryDiv),this.secondaryDiv.focus({preventScroll:!0});const e=i(this.secondaryDiv,!0);e[0]&&e[0].focus({preventScroll:!0}),this.nanoOpen.emit({secondaryMenu:this.secondaryDiv})}handleClose(t){this.didOpen&&this.slotCtrl.has("secondary")&&this.closeOnBlur&&(t.key&&"Escape"===t.key?this.closeSecondary():t.composedPath().some((t=>t===this.secondaryDiv))||this.closeSecondary())}closeSecondary=async()=>{this.slotCtrl.has("secondary")&&this.open&&(this.open=!1,await h(this.secondaryDiv,{className:"modal--open",showProp:"part",show:!1}),this.nanoClosing.emit({secondaryMenu:this.secondaryDiv}),this.didOpen=!1)};openSecondary=async()=>{this.slotCtrl.has("secondary")&&!this.open&&(this.open=!0,await h(this.secondaryDiv,{className:"modal--open",showProp:"part",show:!0}),this.nanoOpening.emit({secondaryMenu:this.secondaryDiv}),this.didOpen=!0)};toggleSecondary=()=>{this.slotCtrl.has("secondary")&&(this.didOpen?this.closeSecondary():this.openSecondary())};handleClick=()=>{this.disabled||(this.slotCtrl.has("secondary")?this.toggleSecondary():this.checkbox&&(this.selected=!this.selected))};handleDefaultSlotChange=()=>{const t=s(this.host,"a")[0];if(t){this.href=t.getAttribute("href");const e=document.createElement("span");t.childNodes.forEach((t=>{e.append(t)})),this.host.append(e),t.remove()}};async closeMenu(){this.closeSecondary()}async openMenu(){this.openSecondary()}connectedCallback(){this.handleDefaultSlotChange(),this.isInMenuDrawer=!!this.host.closest(o("nano-menu-drawer"))}componentDidLoad(){this.openChange()}render(){return r(n,{key:"b6ce27588c1ca2ac2a42d0aada06d7f554a1174a",class:{"nano-menu-drawer":this.isInMenuDrawer,"nano-nav-item":!0,disabled:this.disabled},role:this.host.closest('[role="menu"]')?"menuitem":void 0,"aria-disabled":this.disabled?"true":void 0},r("div",{key:"e8faa3568a13feb95ef131f0bd412577120fbf84",class:{navitem:!0,"navitem--open":this.open,"navitem--active":this.selected},part:"trigger-wrapper"},this.href&&!this.disabled&&r("a",{key:"4a4da7478db63015d0dcd81ed053146f8eeac5f3",part:"trigger trigger--anchor",target:this.target,ref:t=>this.controlElement=t,href:this.href,class:{navitem__trigger:!0}},r("slot",{key:"1eafb7864368850ad2539c402eb1b00877f3d55e",name:"icon-start"}),r("span",{key:"8953312d4dad64ced970d2f1120c07b6c36070f1",class:"navitem__label",part:"label"},r("slot",{key:"390f468f8d1f5d4f0669cae53ef140e452b16b07",onSlotchange:this.handleDefaultSlotChange})),r("slot",{key:"3ecd42c2ca6c1546f48a1a5fcf7742d90ad4e1c4",name:"icon-end"})),(!this.href||this.disabled)&&r("button",{key:"0694ce0708264ef1305e4b926a2f40f1875025a9",role:this.checkbox?"checkbox":void 0,"aria-checked":this.checkbox?this.selected.toString():void 0,part:"trigger trigger--button",ref:t=>this.controlElement=t,onClick:this.handleClick,disabled:this.disabled,class:{navitem__trigger:!0}},r("slot",{key:"c3cc4fcbb527f5f8ea2786243fe610d587e36190",name:"icon-start"}),r("span",{key:"385c92f1f2cc26b9c7e4f1a8601920c1f3bf2171",class:"navitem__label",part:"label"},r("slot",{key:"4e7a75c8903081856c20206aa309c2a9855991da",onSlotchange:this.handleDefaultSlotChange})),r("slot",{key:"668b95901ba0b914ccc193d4f3cc4433d908c014",name:"icon-end"})),this.slotCtrl.has("secondary")&&!this.disabled&&r("div",{key:"f81c9aeb6c903b25a662fd1fc615d6f95f6b8f4d",part:"modal",class:{navitem__modal:!0,"navitem__modal--open":this.didOpen},ref:t=>this.secondaryDiv=t,tabIndex:-1},r("div",{key:"70a4b002e989753c461c7dac4dd975200a92e3de",class:"navitem__modal-content",part:"modal-content "+(this.didOpen?"modal-content--open":"")},this.slotCtrl.has("close-button")&&r("div",{key:"7b0daad80ae03a29789c9d2bef74d2473f2f1f39",part:"close-button",onClick:this.closeSecondary},r("slot",{key:"858798062958ea0f4ee809cbf853bdb83dd4d184",name:"close-button"})),r("slot",{key:"41583a8cc59babbfb1a9a084a3de31c61a145fbc",name:"secondary"})),r("div",{key:"5c260dca9a8fdf7951349df64a037fc7415c3c4b",class:"navitem__modal-mask",onClick:this.closeSecondary,part:"modal-mask "+(this.didOpen?"modal-mask--open":"")}))))}static get watchers(){return{open:["openChange"],didOpen:["didOpenChange"]}}};l.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:contents}.navitem{background:inherit;color:inherit}a,button{all:unset;color:inherit;text-decoration:inherit;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:var(--padding);gap:var(--nano-spacing-md);inline-size:100%;box-sizing:border-box;background:inherit}a:hover,a:focus,a:active,button:hover,button:focus,button:active{color:inherit}a:focus-visible,button:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}a[disabled],button[disabled]{opacity:0.5;cursor:not-allowed}.navitem__label{margin-inline-end:auto}.navitem__modal{all:unset;display:none;position:absolute;color:initial;opacity:0;transition:var(--nano-transition-fast) ease}.navitem--open .navitem__modal{opacity:1}::slotted([slot=close-button]){all:unset}::slotted([slot=close-button]):focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}";export{l as nano_nav_item}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as o}from"./index-
|
|
4
|
+
import{r as o}from"./index-vpnVjPKQ.js";const t=class{constructor(t){o(this,t)}};t.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}";export{t as nano_option_box}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r}from"./index-
|
|
4
|
+
import{r}from"./index-vpnVjPKQ.js";const o=class{constructor(o){r(this,o)}showPercent=!1;size="medium"};o.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}nano-progress-bar{--indicator-color:var(--nano-color-fill-primary);--track-color:var(--nano-color-fill-neutral-weak);--border-radius:1.25rem;--height:0.625rem;display:grid;position:relative;overflow:clip;border-radius:var(--border-radius);block-size:var(--height);font-size:var(--height)}nano-progress-bar[size=small]{--height:0.3125rem}nano-progress-bar[size=large]{--height:0.9375rem}nano-progress-bar progress{appearance:none;inline-size:100%;block-size:inherit;border-radius:var(--border-radius);background-color:var(--track-color);grid-area:1/1}nano-progress-bar>label{grid-area:1/1;position:absolute;inset:0}nano-progress-bar>label progress{position:absolute;inset:0}nano-progress-bar:has(progress:not([value]))::after{content:"";inline-size:100%;inset:0;display:block;transform:translateZ(0);animation:indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1);background-color:var(--indicator-color);grid-area:1/1;border-radius:none}nano-progress-bar progress:not([value])::-webkit-progress-bar{border-radius:var(--border-radius);background-color:var(--track-color)}nano-progress-bar progress:not([value])::-moz-progress-bar{border-radius:var(--border-radius);background-color:var(--track-color)}@keyframes indeterminate{0%{scale:1 1;transform:translateX(-100%) translateZ(0)}75%,100%{scale:1 1;transform:translateX(100%) translateZ(0)}}nano-progress-bar progress[value]::-webkit-progress-bar{border-radius:var(--border-radius);background-color:var(--track-color)}nano-progress-bar progress[value]::-webkit-progress-value{background-color:var(--indicator-color);-webkit-transition:inline-size var(--nano-transition-fast);transition:inline-size var(--nano-transition-fast)}nano-progress-bar progress[value]::-moz-progress-bar{background-color:var(--indicator-color);-moz-transition:inline-size var(--nano-transition-fast);transition:inline-size var(--nano-transition-fast)}nano-progress-bar[show-percent] progress[value]::before{content:attr(value) "%";position:absolute;inline-size:attr(value %);min-inline-size:6%;inset-block-start:50%;translate:0 -50%;text-align:center;transition:inline-size var(--nano-transition-fast);font-size:0.75em;color:var(--nano-color-background-default)}';export{o as nano_progress_bar}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as n,c as a,g as e,a as t}from"./index-BM3Om9WE.js";import{h as i}from"./renderer-DpNDfhNy.js";import{a as r}from"./math-BEqsTfVK.js";import{a as s}from"./throttle-C93FMm2Z.js";const o=class{constructor(e){n(this,e),this.nanoChange=a(this,"nanoChange",7),this.nanoStyle=a(this,"nanoStyle",7),this.nanoFocus=a(this,"nanoFocus",7),this.nanoBlur=a(this,"nanoBlur",7)}noUpdate=!1;rect;hasFocus=!1;rangeSlider;gesture;get el(){return e(this)}ratioA=0;ratioB=0;pressedKnob;debounce=0;debounceChanged(){this.nanoChange=s(this.nanoChange,this.debounce)}name="";required=!1;hideLabel=!1;_label="";get label(){return this.required&&!this._label.endsWith("*")?this._label+" *":this._label}set label(n){this._label=n}dualKnobs=!1;min=0;minChanged(){this.noUpdate||this.updateRatio()}max=100;maxChanged(){this.noUpdate||this.updateRatio()}tooltip=!0;snaps=!1;step=1;ticks=!1;disabled=!1;disabledChanged(){this.gesture&&this.gesture.enable(!this.disabled),this.emitStyle()}value=0;valueChanged(n){this.noUpdate||this.updateRatio(),n=this.ensureValueInBounds(n),this.nanoChange.emit({value:n})}clampBounds=n=>r(this.min,n,this.max);ensureValueInBounds=n=>this.dualKnobs?{lower:this.clampBounds(n.lower),upper:this.clampBounds(n.upper)}:this.clampBounds(n);nanoChange;nanoStyle;nanoFocus;nanoBlur;connectedCallback(){this.updateRatio(),this.debounceChanged(),this.disabledChanged()}disconnectedCallback(){this.gesture&&(this.gesture.destroy(),this.gesture=void 0)}async componentDidLoad(){const n=this.rangeSlider;n&&(this.gesture=(await import("./index-BQSuCPXH.js")).createGesture({el:n,gestureName:"range",gesturePriority:100,threshold:0,onStart:n=>this.onStart(n),onMove:n=>this.onMove(n),onEnd:n=>this.onEnd(n)}),this.gesture.enable(!this.disabled))}handleKeyboard=(n,a)=>{let e=this.step;e=e>0?e:1,e/=this.max-this.min,a||(e*=-1),"A"===n?this.ratioA=r(0,this.ratioA+e,1):this.ratioB=r(0,this.ratioB+e,1),this.updateValue()};getValue(){const n=this.value||0;return this.dualKnobs?"object"==typeof n?n:{lower:0,upper:n}:"object"==typeof n?n.upper:n}emitStyle(){this.nanoStyle.emit({interactive:!0,"interactive-disabled":this.disabled})}onStart(n){const a=this.rect=this.rangeSlider.getBoundingClientRect(),e=n.currentX;let t=r(0,(e-a.left)/a.width,1);"rtl"===document.dir&&(t=1-t),this.pressedKnob=!this.dualKnobs||Math.abs(this.ratioA-t)<Math.abs(this.ratioB-t)?"A":"B",this.setFocus(this.pressedKnob),this.update(e)}onMove(n){this.update(n.currentX)}onEnd(n){this.update(n.currentX),this.pressedKnob=void 0}update(n){const a=this.rect;let e=r(0,(n-a.left)/a.width,1);"rtl"===document.dir&&(e=1-e),this.snaps&&(e=c(h(e,this.min,this.max,this.step),this.min,this.max)),"A"===this.pressedKnob?this.ratioA=e:this.ratioB=e,this.updateValue()}get valA(){return h(this.ratioA,this.min,this.max,this.step)}get valB(){return h(this.ratioB,this.min,this.max,this.step)}get ratioLower(){return this.dualKnobs?Math.min(this.ratioA,this.ratioB):0}get ratioUpper(){return this.dualKnobs?Math.max(this.ratioA,this.ratioB):this.ratioA}updateRatio(){const n=this.getValue(),{min:a,max:e}=this;this.dualKnobs?(this.ratioA=c(n.lower,a,e),this.ratioB=c(n.upper,a,e)):this.ratioA=c(n,a,e)}updateValue(){this.noUpdate=!0;const{valA:n,valB:a}=this;this.value=this.dualKnobs?{lower:Math.min(n,a),upper:Math.max(n,a)}:n,this.noUpdate=!1}setFocus(n){const a=this.el.querySelector("A"===n?".range-knob-a":".range-knob-b");a&&a.focus()}onBlur=()=>{this.hasFocus&&(this.hasFocus=!1,this.nanoBlur.emit(),this.emitStyle())};onFocus=()=>{this.hasFocus||(this.hasFocus=!0,this.nanoFocus.emit(),this.emitStyle())};render(){const{min:n,max:a,step:e,handleKeyboard:r,pressedKnob:s,disabled:o,tooltip:h,ratioLower:g,ratioUpper:d}=this,b=100*g+"%",p=100-100*d+"%",u="rtl"===document.dir,m=u?"right":"left",v=u?"left":"right",k=n=>({[m]:n[m]}),f={[m]:b,[v]:p},w=[];if(this.snaps&&this.ticks)for(let t=n;t<=a;t+=e){const e=c(t,n,a),i={ratio:e,active:e>=g&&e<=d};i[m]=100*e+"%",w.push(i)}return i(t,{onFocusin:this.onFocus,onFocusout:this.onBlur,class:{"range-disabled":o,"range-pressed":void 0!==s,"range-has-pin":h,"range-snaps":this.snaps,"nano-range":!0}},i("label",{class:"range-label"+(this.hideLabel?" visually-hidden":""),part:"label",htmlFor:this.name},i("slot",{name:"label"},this.label)),i("input",{class:"range-input visually-hidden",name:this.name,id:this.name,disabled:this.disabled,required:this.required,value:JSON.stringify(this.getValue()),onFocus:()=>{this.setFocus(this.pressedKnob||"A")}}),i("div",{class:"range-wrap"},i("slot",{name:"start"}),i("div",{class:"range-slider",ref:n=>this.rangeSlider=n},w.map((n=>i("span",{style:k(n),role:"presentation",class:{"range-tick":!0,"range-tick-active":n.active},part:n.active?"tick-active":"tick"}))),i("div",{class:"range-bar",role:"presentation",part:"bar"}),i("div",{class:"range-bar range-bar-active",role:"presentation",style:f,part:"bar-active"}),l(u,{knob:"A",pressed:"A"===s,value:this.valA,ratio:this.ratioA,tooltip:h,disabled:o,handleKeyboard:r,min:n,max:a}),this.dualKnobs&&l(u,{knob:"B",pressed:"B"===s,value:this.valB,ratio:this.ratioB,tooltip:h,disabled:o,handleKeyboard:r,min:n,max:a})),i("slot",{name:"end"})))}static get watchers(){return{debounce:["debounceChanged"],min:["minChanged"],max:["maxChanged"],disabled:["disabledChanged"],value:["valueChanged"]}}},l=(n,{knob:a,value:e,ratio:t,min:r,max:s,disabled:o,pressed:l,tooltip:h,handleKeyboard:c})=>{const g=n?"right":"left";return i("div",{onKeyDown:n=>{const e=n.key;"ArrowLeft"===e||"ArrowDown"===e?(c(a,!1),n.preventDefault(),n.stopPropagation()):"ArrowRight"!==e&&"ArrowUp"!==e||(c(a,!0),n.preventDefault(),n.stopPropagation())},class:{"range-knob-handle":!0,"range-knob-a":"A"===a,"range-knob-b":"B"===a,"range-knob-pressed":l,"range-knob-min":e===r,"range-knob-max":e===s},style:(()=>{const n={};return n[g]=100*t+"%",n})(),role:"slider",tabindex:o?-1:0,"aria-valuemin":r,"aria-valuemax":s,"aria-disabled":o?"true":null,"aria-valuenow":e},h&&i("div",{class:"range-pin",role:"presentation",part:"pin"},Math.round(e)),i("div",{class:"range-knob",role:"presentation",part:"knob"}))},h=(n,a,e,t)=>{let i=(e-a)*n;return t>0&&(i=Math.round(i/t)*t+a),r(a,i,e)},c=(n,a,e)=>r(0,(n-a)/(e-a),1);o.style=".sc-nano-range-h,*.sc-nano-range,*.sc-nano-range::before,*.sc-nano-range::after{box-sizing:border-box}[hidden].sc-nano-range{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-range-h,*.sc-nano-range,*.sc-nano-range::before,*.sc-nano-range::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-range-h,*.sc-nano-range,*.sc-nano-range::before,*.sc-nano-range::after{box-sizing:border-box}[hidden].sc-nano-range{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-range-h,*.sc-nano-range,*.sc-nano-range::before,*.sc-nano-range::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-range-h{--inactive-color:var(--nano-color-neutral-800);--knob-color:var(--nano-color-primary-1200);--knob-active-color:var(--nano-color-primary-1400);--knob-width:1.75rem;--knob-height:1.25rem;--bar-height:.5em;--bar-background:var(--nano-color-neutral-300);--bar-background-active:var(--nano-color-primary-1000);--tooltip-background:var(--nano-color-base-0);--tooltip-color:var(--nano-color-neutral-1400)}.range-wrap.sc-nano-range{display:flex;position:relative;flex:3;align-items:center;-webkit-user-select:none;user-select:none}.range-wrap.sc-nano-range-s>ion-icon[slot],.range-wrap .sc-nano-range-s>ion-icon[slot]{font-size:1.5em}.range-wrap.sc-nano-range-s>[slot=start],.range-wrap .sc-nano-range-s>[slot=start]{margin-inline:0 calc(var(--knob-width) * 0.66);margin-block:0;font-size:0.9em}.range-wrap.sc-nano-range-s>[slot=end],.range-wrap .sc-nano-range-s>[slot=end]{margin-inline:calc(var(--knob-width) * 0.66) 0;margin-block:0;font-size:0.9em}.range-slider.sc-nano-range{position:relative;flex:1;inline-size:100%;block-size:var(--knob-height);contain:size layout style;cursor:grab;touch-action:pan-y}.range-pressed.sc-nano-range-h .range-slider.sc-nano-range{cursor:grabbing}.range-label.sc-nano-range{inline-size:100%;overflow:clip;white-space:nowrap;text-overflow:ellipsis;color:var(--nano-color-base-1000);font-size:var(--nano-font-size-xs);padding-block-end:var(--nano-spacing-sm);line-height:1;display:flex;align-items:center}.visually-hidden.sc-nano-range{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.range-bar.sc-nano-range{inset-block-start:calc((var(--knob-height) - var(--bar-height)) / 2);inset-inline-start:0;position:absolute;inline-size:100%;block-size:var(--bar-height);background:var(--bar-background);pointer-events:none}.range-bar-active.sc-nano-range{inset-block-end:0;inline-size:auto;background:var(--bar-background-active)}.range-knob.sc-nano-range{border-radius:var(--nano-border-radius-pill);position:absolute;inline-size:var(--knob-width);block-size:var(--knob-height);background:var(--knob-color);z-index:2;pointer-events:none;inset-block-start:50%;inset-inline-start:50%;translate:-50% -50%}.sc-nano-range-h:not(.range-has-pin) .range-knob-pressed.sc-nano-range .range-knob.sc-nano-range{background:var(--knob-active-color)}.range-knob-handle.sc-nano-range{inset-block-start:50%;translate:0 -50%;inset-inline-start:0;margin-inline-start:calc(0px - var(--knob-width));position:absolute;inline-size:calc(var(--knob-width) * 2);block-size:calc(var(--knob-height) * 2);text-align:center}.range-knob-handle.sc-nano-range:focus{outline:none}.range-knob-handle.sc-nano-range:focus .range-knob.sc-nano-range{outline:var(--nano-focus-ring)}.range-tick.sc-nano-range{position:absolute;inset-block-start:calc((var(--knob-height) - var(--bar-height)) / 2);inline-size:var(--bar-height);block-size:var(--bar-height);background:var(--inactive-color);z-index:1;pointer-events:none}.range-tick-active.sc-nano-range{background:transparent}.range-pin.sc-nano-range{transform:translate3d(0, 0, 0) scale(0.01);transform-origin:center top;padding:0.66em 0;text-align:center;box-sizing:border-box;display:inline-block;position:relative;min-inline-size:2.33em;block-size:2.33em;transition:transform 120ms ease, background 120ms ease;background:var(--tooltip-background);color:var(--tooltip-color);font-size:0.75em;box-shadow:var(--nano-shadow-l1)}.range-knob-pressed.sc-nano-range .range-pin.sc-nano-range{transform:translate3d(0, -100%, 0) scale(1)}.range-disabled.sc-nano-range-h{pointer-events:none}.range-disabled.sc-nano-range-h .range-bar-active.sc-nano-range,.range-disabled.sc-nano-range-h .range-bar.sc-nano-range,.range-disabled.sc-nano-range-h .range-tick.sc-nano-range{background-color:var(--inactive-color)}.range-disabled.sc-nano-range-h .range-knob.sc-nano-range{transform:scale(0.55);outline:5px solid #fff;background-color:var(--inactive-color)}";export{o as nano_range}
|
|
4
|
+
import{r as n,c as a,a as e,d as t}from"./index-vpnVjPKQ.js";import{h as i}from"./renderer-CTaemqrs.js";import{a as r}from"./math-BEqsTfVK.js";import{a as s}from"./throttle-C93FMm2Z.js";const o=class{constructor(e){n(this,e),this.nanoChange=a(this,"nanoChange",7),this.nanoStyle=a(this,"nanoStyle",7),this.nanoFocus=a(this,"nanoFocus",7),this.nanoBlur=a(this,"nanoBlur",7)}noUpdate=!1;rect;hasFocus=!1;rangeSlider;gesture;get el(){return e(this)}ratioA=0;ratioB=0;pressedKnob;debounce=0;debounceChanged(){this.nanoChange=s(this.nanoChange,this.debounce)}name="";required=!1;hideLabel=!1;_label="";get label(){return this.required&&!this._label.endsWith("*")?this._label+" *":this._label}set label(n){this._label=n}dualKnobs=!1;min=0;minChanged(){this.noUpdate||this.updateRatio()}max=100;maxChanged(){this.noUpdate||this.updateRatio()}tooltip=!0;snaps=!1;step=1;ticks=!1;disabled=!1;disabledChanged(){this.gesture&&this.gesture.enable(!this.disabled),this.emitStyle()}value=0;valueChanged(n){this.noUpdate||this.updateRatio(),n=this.ensureValueInBounds(n),this.nanoChange.emit({value:n})}clampBounds=n=>r(this.min,n,this.max);ensureValueInBounds=n=>this.dualKnobs?{lower:this.clampBounds(n.lower),upper:this.clampBounds(n.upper)}:this.clampBounds(n);nanoChange;nanoStyle;nanoFocus;nanoBlur;connectedCallback(){this.updateRatio(),this.debounceChanged(),this.disabledChanged()}disconnectedCallback(){this.gesture&&(this.gesture.destroy(),this.gesture=void 0)}async componentDidLoad(){const n=this.rangeSlider;n&&(this.gesture=(await import("./index-BQSuCPXH.js")).createGesture({el:n,gestureName:"range",gesturePriority:100,threshold:0,onStart:n=>this.onStart(n),onMove:n=>this.onMove(n),onEnd:n=>this.onEnd(n)}),this.gesture.enable(!this.disabled))}handleKeyboard=(n,a)=>{let e=this.step;e=e>0?e:1,e/=this.max-this.min,a||(e*=-1),"A"===n?this.ratioA=r(0,this.ratioA+e,1):this.ratioB=r(0,this.ratioB+e,1),this.updateValue()};getValue(){const n=this.value||0;return this.dualKnobs?"object"==typeof n?n:{lower:0,upper:n}:"object"==typeof n?n.upper:n}emitStyle(){this.nanoStyle.emit({interactive:!0,"interactive-disabled":this.disabled})}onStart(n){const a=this.rect=this.rangeSlider.getBoundingClientRect(),e=n.currentX;let t=r(0,(e-a.left)/a.width,1);"rtl"===document.dir&&(t=1-t),this.pressedKnob=!this.dualKnobs||Math.abs(this.ratioA-t)<Math.abs(this.ratioB-t)?"A":"B",this.setFocus(this.pressedKnob),this.update(e)}onMove(n){this.update(n.currentX)}onEnd(n){this.update(n.currentX),this.pressedKnob=void 0}update(n){const a=this.rect;let e=r(0,(n-a.left)/a.width,1);"rtl"===document.dir&&(e=1-e),this.snaps&&(e=h(c(e,this.min,this.max,this.step),this.min,this.max)),"A"===this.pressedKnob?this.ratioA=e:this.ratioB=e,this.updateValue()}get valA(){return c(this.ratioA,this.min,this.max,this.step)}get valB(){return c(this.ratioB,this.min,this.max,this.step)}get ratioLower(){return this.dualKnobs?Math.min(this.ratioA,this.ratioB):0}get ratioUpper(){return this.dualKnobs?Math.max(this.ratioA,this.ratioB):this.ratioA}updateRatio(){const n=this.getValue(),{min:a,max:e}=this;this.dualKnobs?(this.ratioA=h(n.lower,a,e),this.ratioB=h(n.upper,a,e)):this.ratioA=h(n,a,e)}updateValue(){this.noUpdate=!0;const{valA:n,valB:a}=this;this.value=this.dualKnobs?{lower:Math.min(n,a),upper:Math.max(n,a)}:n,this.noUpdate=!1}setFocus(n){const a=this.el.querySelector("A"===n?".range-knob-a":".range-knob-b");a&&a.focus()}onBlur=()=>{this.hasFocus&&(this.hasFocus=!1,this.nanoBlur.emit(),this.emitStyle())};onFocus=()=>{this.hasFocus||(this.hasFocus=!0,this.nanoFocus.emit(),this.emitStyle())};render(){const{min:n,max:a,step:e,handleKeyboard:r,pressedKnob:s,disabled:o,tooltip:c,ratioLower:d,ratioUpper:g}=this,b=100*d+"%",p=100-100*g+"%",u="rtl"===document.dir,v=u?"right":"left",m=u?"left":"right",k=n=>({[v]:n[v]}),f={[v]:b,[m]:p},w=[];if(this.snaps&&this.ticks)for(let t=n;t<=a;t+=e){const e=h(t,n,a),i={ratio:e,active:e>=d&&e<=g};i[v]=100*e+"%",w.push(i)}return i(t,{onFocusin:this.onFocus,onFocusout:this.onBlur,class:{"range-disabled":o,"range-pressed":void 0!==s,"range-has-pin":c,"range-snaps":this.snaps,"nano-range":!0}},i("label",{class:"range-label"+(this.hideLabel?" visually-hidden":""),part:"label",htmlFor:this.name},i("slot",{name:"label"},this.label)),i("input",{class:"range-input visually-hidden",name:this.name,id:this.name,disabled:this.disabled,required:this.required,value:JSON.stringify(this.getValue()),onFocus:()=>{this.setFocus(this.pressedKnob||"A")}}),i("div",{class:"range-wrap"},i("slot",{name:"start"}),i("div",{class:"range-slider",ref:n=>this.rangeSlider=n},w.map((n=>i("span",{style:k(n),role:"presentation",class:{"range-tick":!0,"range-tick-active":n.active},part:n.active?"tick-active":"tick"}))),i("div",{class:"range-bar",role:"presentation",part:"bar"}),i("div",{class:"range-bar range-bar-active",role:"presentation",style:f,part:"bar-active"}),l(u,{knob:"A",pressed:"A"===s,value:this.valA,ratio:this.ratioA,tooltip:c,disabled:o,handleKeyboard:r,min:n,max:a}),this.dualKnobs&&l(u,{knob:"B",pressed:"B"===s,value:this.valB,ratio:this.ratioB,tooltip:c,disabled:o,handleKeyboard:r,min:n,max:a})),i("slot",{name:"end"})))}static get watchers(){return{debounce:["debounceChanged"],min:["minChanged"],max:["maxChanged"],disabled:["disabledChanged"],value:["valueChanged"]}}},l=(n,{knob:a,value:e,ratio:t,min:r,max:s,disabled:o,pressed:l,tooltip:c,handleKeyboard:h})=>{const d=n?"right":"left";return i("div",{onKeyDown:n=>{const e=n.key;"ArrowLeft"===e||"ArrowDown"===e?(h(a,!1),n.preventDefault(),n.stopPropagation()):"ArrowRight"!==e&&"ArrowUp"!==e||(h(a,!0),n.preventDefault(),n.stopPropagation())},class:{"range-knob-handle":!0,"range-knob-a":"A"===a,"range-knob-b":"B"===a,"range-knob-pressed":l,"range-knob-min":e===r,"range-knob-max":e===s},style:(()=>{const n={};return n[d]=100*t+"%",n})(),role:"slider",tabindex:o?-1:0,"aria-valuemin":r,"aria-valuemax":s,"aria-disabled":o?"true":null,"aria-valuenow":e},c&&i("div",{class:"range-pin",role:"presentation",part:"pin"},Math.round(e)),i("div",{class:"range-knob",role:"presentation",part:"knob"}))},c=(n,a,e,t)=>{let i=(e-a)*n;return t>0&&(i=Math.round(i/t)*t+a),r(a,i,e)},h=(n,a,e)=>r(0,(n-a)/(e-a),1);o.style=".sc-nano-range-h,*.sc-nano-range,*.sc-nano-range::before,*.sc-nano-range::after{box-sizing:border-box}[hidden].sc-nano-range{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-range-h,*.sc-nano-range,*.sc-nano-range::before,*.sc-nano-range::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-range-h,*.sc-nano-range,*.sc-nano-range::before,*.sc-nano-range::after{box-sizing:border-box}[hidden].sc-nano-range{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-range-h,*.sc-nano-range,*.sc-nano-range::before,*.sc-nano-range::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-range-h{--inactive-color:var(--nano-color-fill-neutral-weak);--knob-color:var(--nano-color-fill-primary-pressed);--knob-active-color:var(--nano-color-surface-heavy-feature-pressed);--knob-width:1.75rem;--knob-height:1.25rem;--bar-height:.5em;--bar-background:var(--nano-color-fill-neutral-weak);--bar-background-active:var(--nano-color-fill-primary);--tooltip-background:var(--nano-color-background-default);--tooltip-color:var(--nano-color-text-default)}.range-wrap.sc-nano-range{display:flex;position:relative;flex:3;align-items:center;-webkit-user-select:none;user-select:none}.range-wrap.sc-nano-range-s>ion-icon[slot],.range-wrap .sc-nano-range-s>ion-icon[slot]{font-size:1.5em}.range-wrap.sc-nano-range-s>[slot=start],.range-wrap .sc-nano-range-s>[slot=start]{margin-inline:0 calc(var(--knob-width) * 0.66);margin-block:0;font-size:0.9em}.range-wrap.sc-nano-range-s>[slot=end],.range-wrap .sc-nano-range-s>[slot=end]{margin-inline:calc(var(--knob-width) * 0.66) 0;margin-block:0;font-size:0.9em}.range-slider.sc-nano-range{position:relative;flex:1;inline-size:100%;block-size:var(--knob-height);contain:size layout style;cursor:grab;touch-action:pan-y}.range-pressed.sc-nano-range-h .range-slider.sc-nano-range{cursor:grabbing}.range-label.sc-nano-range{inline-size:100%;overflow:clip;white-space:nowrap;text-overflow:ellipsis;color:var(--nano-color-surface-contrast);font-size:var(--nano-font-size-xs);padding-block-end:var(--nano-spacing-sm);line-height:1;display:flex;align-items:center}.visually-hidden.sc-nano-range{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.range-bar.sc-nano-range{inset-block-start:calc((var(--knob-height) - var(--bar-height)) / 2);inset-inline-start:0;position:absolute;inline-size:100%;block-size:var(--bar-height);background:var(--bar-background);pointer-events:none}.range-bar-active.sc-nano-range{inset-block-end:0;inline-size:auto;background:var(--bar-background-active)}.range-knob.sc-nano-range{border-radius:var(--nano-border-radius-pill);position:absolute;inline-size:var(--knob-width);block-size:var(--knob-height);background:var(--knob-color);z-index:2;pointer-events:none;inset-block-start:50%;inset-inline-start:50%;translate:-50% -50%}.sc-nano-range-h:not(.range-has-pin) .range-knob-pressed.sc-nano-range .range-knob.sc-nano-range{background:var(--knob-active-color)}.range-knob-handle.sc-nano-range{inset-block-start:50%;translate:0 -50%;inset-inline-start:0;margin-inline-start:calc(0px - var(--knob-width));position:absolute;inline-size:calc(var(--knob-width) * 2);block-size:calc(var(--knob-height) * 2);text-align:center}.range-knob-handle.sc-nano-range:focus{outline:none}.range-knob-handle.sc-nano-range:focus .range-knob.sc-nano-range{outline:var(--nano-focus-ring)}.range-tick.sc-nano-range{position:absolute;inset-block-start:calc((var(--knob-height) - var(--bar-height)) / 2);inline-size:var(--bar-height);block-size:var(--bar-height);background:var(--inactive-color);z-index:1;pointer-events:none}.range-tick-active.sc-nano-range{background:transparent}.range-pin.sc-nano-range{transform:translate3d(0, 0, 0) scale(0.01);transform-origin:center top;padding:0.66em 0;text-align:center;box-sizing:border-box;display:inline-block;position:relative;min-inline-size:2.33em;block-size:2.33em;transition:transform 120ms ease, background 120ms ease;background:var(--tooltip-background);color:var(--tooltip-color);font-size:0.75em;box-shadow:var(--nano-shadow-l1)}.range-knob-pressed.sc-nano-range .range-pin.sc-nano-range{transform:translate3d(0, -100%, 0) scale(1)}.range-disabled.sc-nano-range-h{pointer-events:none}.range-disabled.sc-nano-range-h .range-bar-active.sc-nano-range,.range-disabled.sc-nano-range-h .range-bar.sc-nano-range,.range-disabled.sc-nano-range-h .range-tick.sc-nano-range{background-color:var(--inactive-color)}.range-disabled.sc-nano-range-h .range-knob.sc-nano-range{transform:scale(0.55);outline:5px solid #fff;background-color:var(--inactive-color)}";export{o as nano_range}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as n,c as a,
|
|
4
|
+
import{r as n,c as a,a as i,d as t}from"./index-vpnVjPKQ.js";import{h as s}from"./renderer-CTaemqrs.js";import{a as o}from"./math-BEqsTfVK.js";const r=class{constructor(i){n(this,i),this.nanoChange=a(this,"nanoChange",7),this.nanoBlur=a(this,"nanoBlur",7),this.nanoFocus=a(this,"nanoFocus",7)}rating;isRtl;indicator;get host(){return i(this)}hoverValue=0;isHovering=!1;value=0;max=5;precision=1;readonly=!1;disabled=!1;name="";required=!1;hideLabel=!0;_label="";get label(){return this.required&&!this._label.endsWith("*")?this._label+" *":this._label}set label(n){this._label=n}symbolName="solid/star-sharp";symbol=()=>'<nano-icon name="'+this.symbolName+'"></nano-icon>';handleValueChange(){this.nanoChange.emit()}handleSymbolChange(){this.symbol||(this.symbol=()=>'<nano-icon name="'+this.symbolName+'"></nano-icon>')}nanoChange;nanoBlur;nanoFocus;async setFocus(){this.rating.focus()}async removeFocus(){this.rating.blur()}getValueFromMousePosition(n){const a=this.rating.getBoundingClientRect().left,i=this.rating.getBoundingClientRect().width;let t;return t=this.roundToPrecision((n.clientX-a)/i*this.max,this.precision),this.isRtl&&(t=this.max+this.precision-t),o(t,0,this.max)}roundToPrecision(n,a=.5){const i=1/a;return Math.ceil(n*i)/i}handleClick=n=>{if(this.disabled||this.readonly)return;const a=this.getValueFromMousePosition(n);this.value=a===this.value?0:a,this.isHovering=!1};handleKeyDown=n=>{this.disabled||this.readonly||("ArrowLeft"===n.key&&(this.value=this.roundToPrecision(Math.max(0,this.value-(n.shiftKey?1:this.precision))),n.preventDefault()),"ArrowRight"===n.key&&(this.value=this.roundToPrecision(Math.min(this.max,this.value+(n.shiftKey?1:this.precision))),n.preventDefault()),"Home"===n.key&&(this.value=0,n.preventDefault()),"End"===n.key&&(this.value=this.max,n.preventDefault()))};handleMouseEnter=()=>{this.isHovering=!0};handleMouseLeave=()=>{this.isHovering=!1};handleFocus=()=>{this.nanoFocus.emit()};handleBlur=()=>{this.nanoBlur.emit()};handleMouseMove=n=>{this.hoverValue=this.getValueFromMousePosition(n)};clip(n){if(!this.rating)return;const a=this.rating.getBoundingClientRect().width;return this.isRtl?`rect(0, ${a}px, 2em, ${a-a/100*(n/this.max*100)}px)`:`rect(0, ${a/100*(n/this.max*100)}px, 2em, 0)`}componentDidLoad(){setTimeout((()=>this.indicator.style.clip=this.clip(this.value)),20)}connectedCallback(){this.isRtl="rtl"===this.host.dir||"rtl"===this.host.ownerDocument.dir}render(){this.isRtl="rtl"===this.host.dir||"rtl"===this.host.ownerDocument.dir;const n=Array.from(Array(this.max).keys());let a=0;return a=this.disabled||this.readonly?this.value:this.isHovering?this.hoverValue:this.value,s(t,{key:"3011ba88cafed0ec3c79d823a3abac433f68b5d1",class:"nano-rating"},s("label",{key:"ea6a01bc5a7f8e7fecbb16a905c472b5e1c62328",class:"rating-label"+(this.hideLabel?" visually-hidden":""),part:"label",htmlFor:this.name},s("slot",{key:"22e31eeaed0aca337a71c1bbb39c238413f1c00c",name:"label"},this.label)),s("input",{key:"265bd0055cbd05911611e0a5e45828d4dab7ac8c",class:"range-input visually-hidden",name:this.name,id:this.name,disabled:this.disabled||this.readonly,required:this.required,value:this.value,onFocus:()=>{this.setFocus()}}),s("div",{key:"4c0af619c68c230a5994871efdf5608870fb83e0",class:"rating-wrap"},s("div",{key:"e6f94c258bc04b6a4a6aad66c9364c1c811f859a",dir:this.isRtl?"rtl":null,ref:n=>this.rating=n,part:"base",class:{rating:!0,"rating--readonly":this.readonly,"rating--disabled":this.disabled},"aria-disabled":this.disabled?"true":"false","aria-readonly":this.readonly?"true":"false","aria-valuenow":this.value,"aria-valuemin":0,"aria-valuemax":this.max,tabIndex:this.disabled?-1:0,onClick:this.handleClick,onKeyDown:this.handleKeyDown,onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave,onMouseMove:this.handleMouseMove,onFocus:this.handleFocus,onBlur:this.handleBlur},s("span",{key:"d514ae0f85be4d59ab6a2ae4496357c5d6601ba9",class:"rating__symbols rating__symbols--inactive"},n.map((n=>s("span",{class:{rating__symbol:!0,"rating__symbol--hover":this.isHovering&&Math.ceil(a)===n+1},onMouseEnter:this.handleMouseEnter,innerHTML:this.symbol(n+1)})))),s("span",{key:"0caf2f0561d3b74e6891e6c2a4b970fef53298f3",ref:n=>this.indicator=n,class:"rating__symbols rating__symbols--indicator",style:{clip:this.clip(a)}},n.map((n=>s("span",{class:{rating__symbol:!0,"rating__symbol--hover":this.isHovering&&Math.ceil(a)===n+1},innerHTML:this.symbol(n+1)})))))))}static get watchers(){return{value:["handleValueChange"],symbolName:["handleSymbolChange"]}}};r.style=".sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{box-sizing:border-box}[hidden].sc-nano-rating{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{box-sizing:border-box}[hidden].sc-nano-rating{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-rating-h{--symbol-color:var(--nano-color-fill-neutral-weak);--symbol-color-active:var(--nano-color-fill-primary);--symbol-spacing:0.25rem;--symbol-size:1.3125rem;display:inline-block}.rating-wrap.sc-nano-rating{position:relative;margin-block:0;margin-inline:calc(var(--symbol-spacing) * -1)}.rating-label.sc-nano-rating{inline-size:100%;overflow:clip;white-space:nowrap;text-overflow:ellipsis;color:var(--nano-color-surface-contrast);font-size:var(--nano-font-size-xs);padding-block-end:var(--nano-spacing-sm);line-height:1;display:flex;align-items:center}.visually-hidden.sc-nano-rating{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.rating.sc-nano-rating{position:relative;vertical-align:middle;inline-size:100%}.rating.sc-nano-rating:focus{outline:none}.rating.sc-nano-rating:focus-visible:focus{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.rating__symbols.sc-nano-rating{display:flex;align-items:center;position:relative;font-size:var(--symbol-size);color:var(--symbol-color);white-space:nowrap;cursor:pointer;line-height:0;justify-content:space-between}.rating__symbols--inactive.sc-nano-rating .rating__symbol.sc-nano-rating>.sc-nano-rating:not(.nano-icon){background-color:currentcolor !important}.rating__symbols.sc-nano-rating>*.sc-nano-rating{margin:var(--symbol-spacing)}.rating__symbols--indicator.sc-nano-rating{position:absolute;inset-block-start:0;inset-inline-start:0;color:var(--symbol-color-active);pointer-events:none;inline-size:100%}.rating__symbol.sc-nano-rating{transition:0.2s transform;text-align:center}.rating__symbol--hover.sc-nano-rating{transform:scale(1.2)}.rating--disabled.sc-nano-rating .rating__symbols.sc-nano-rating,.rating--readonly.sc-nano-rating .rating__symbols.sc-nano-rating{cursor:default}.rating--disabled.sc-nano-rating .rating__symbol.sc-nano-rating,.rating--readonly.sc-nano-rating .rating__symbol.sc-nano-rating{transform:none !important}.rating--disabled.sc-nano-rating{opacity:0.5}.rating--disabled.sc-nano-rating .rating__symbols.sc-nano-rating{cursor:not-allowed}";export{r as nano_rating}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,c as s,
|
|
4
|
+
import{r as t,c as s,a as i,f as e,d as n}from"./index-vpnVjPKQ.js";import{h}from"./renderer-CTaemqrs.js";const a=class{constructor(i){t(this,i),this.nanoResizeStateChange=s(this,"nanoResizeStateChange",7),this.nanoResizeObserverReady=s(this,"nanoResizeObserverReady",7),this.nanoResizeContentFitChange=s(this,"nanoResizeContentFitChange",7),this.nanoResize=s(this,"nanoResize",7)}ro;appliedStates;isReady=!1;get host(){return i(this)}currentWidth;currentHeight;classNames=[];contentFitX=null;contentFitY=null;classNameChange(){this.host.className=this.classNames.join(" "),!this.isReady&&this.classNames.includes("is-ready")&&(this.isReady=!0,this.nanoResizeObserverReady.emit())}notifyContentFit;states;newStatesProp(){this.statesChanged()}nanoResizeStateChange;nanoResizeObserverReady;nanoResizeContentFitChange;nanoResize;dimensionChanged(){this.assessChanges()}statesChanged(){if(!this.states)return;const t=t=>{const s=t.split(/(\d+)/).filter((t=>t.length));return{bp:parseInt(s[0]),dir:s[1]}};this.appliedStates={h:new Map,w:new Map},this.states.split(",").map((s=>{if((s=s.trim()).includes(" ")){const[i,...e]=s.split(" "),{bp:n,dir:h}=t(i);this.appliedStates[h].set(n,{states:e,applied:!1})}else{const{bp:i,dir:e}=t(s);this.appliedStates[e].set(i,{applied:!1})}}))}assesContentFit(){if(!this.notifyContentFit)return;const t=(t=>{if("contents"!==window.getComputedStyle(t).display)return t;const s=t=>Array.from(t.children).find((t=>{if("contents"!==window.getComputedStyle(t).display)return t;s(t)}));return s(t)})(this.host.firstElementChild);if(!t)return;let s=!1;const{width:i,height:e}=this.host.getBoundingClientRect();this.notifyContentFit&&this.notifyContentFit.includes("x")&&(i<t.scrollWidth&&!1!==this.contentFitX?(s=!0,this.contentFitX=!1):i>=t.scrollWidth&&!0!==this.contentFitX&&(s=!0,this.contentFitX=!0)),this.notifyContentFit&&this.notifyContentFit.includes("y")&&(e<t.scrollHeight&&!1!==this.contentFitY?(s=!0,this.contentFitY=!1):e>=t.scrollHeight&&!0!==this.contentFitY&&(s=!0,this.contentFitY=!0)),s&&this.nanoResizeContentFitChange.emit({x:this.contentFitX,y:this.contentFitY})}assessChanges=()=>{if(!this.currentWidth&&!this.currentHeight)return;if(e((()=>this.assesContentFit())),!this.states||!this.appliedStates)return;const t={h:new Map,w:new Map};let s=!1;Object.keys(this.appliedStates).forEach((i=>{let e;e="h"===i?this.currentHeight:this.currentWidth,this.appliedStates[i].forEach(((n,h)=>{e>=h&&!1===n.applied?(n.applied=!0,t[i].set(h,n),s=!0):e<h&&!0===n.applied&&(n.applied=!1,t[i].set(h,n),s=!0)}))})),s?this.applyChanges(t):this.classNames.includes("is-ready")||(this.classNames=[...this.classNames,"is-ready"])};applyChanges(t){if(!this.states)return;let s=[...this.classNames];Object.keys(t).forEach((i=>{t[i].forEach((t=>{t.states&&t.states.map((i=>{t.applied?(s.push(i),s=s.filter((t=>t!=="not-"+i))):(s.push("not-"+i),s=s.filter((t=>t!==i)))}))}))})),this.classNames=[...new Set(["is-ready",...s])],this.nanoResizeStateChange.emit(this.toSimpleObj(t))}toSimpleObj(t){const s={};return Object.keys(t).forEach((i=>{t[i].forEach(((t,e)=>{s[e+i]=t.applied}))})),s}attachRO(){window.ResizeObserver&&(this.ro=new ResizeObserver((t=>{const{width:s,height:i}=this.host.getBoundingClientRect();this.currentWidth=Math.ceil(s),this.currentHeight=Math.ceil(i),this.nanoResize.emit(t)})),this.ro.observe(this.host))}componentWillLoad(){this.classNames=Array.from(this.host.classList),this.statesChanged(),this.applyChanges(this.appliedStates),this.currentWidth||this.currentHeight?this.assessChanges():e((()=>{const{width:t,height:s}=this.host.getBoundingClientRect();this.currentWidth=Math.ceil(t),this.currentHeight=Math.ceil(s)}))}connectedCallback(){this.ro||this.attachRO()}disconnectedCallback(){this.ro&&(this.ro.disconnect(),this.ro=void 0)}render(){return h(n,{key:"a2c57218f65a9af2297e6662c29d3a7c853092df",class:{"nano-resize-observe":!0,"content-fit-x":this.contentFitX,"content-fit-y":this.contentFitY,"content-nofit-x":!1===this.contentFitX,"content-nofit-y":!1===this.contentFitY}},h("slot",{key:"cf0faa31f7c1daa08238555a46699c1b731e13b8"}),!!this.notifyContentFit&&(null!==this.contentFitX||null!==this.contentFitY)&&[h("slot",this.contentFitX?{name:"content-fit-x"}:{name:"content-nofit-x"}),h("slot",this.contentFitY?{name:"content-fit-y"}:{name:"content-nofit-y"})])}static get watchers(){return{classNames:["classNameChange"],states:["newStatesProp","statesChanged"],currentHeight:["dimensionChanged"],currentWidth:["dimensionChanged"]}}};a.style=":host { display: block }";export{a as nano_resize_observe}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as o}from"./index-
|
|
4
|
+
import{r as o}from"./index-vpnVjPKQ.js";const t=class{constructor(t){o(this,t)}};t.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}";export{t as nano_search_result}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,c as e,
|
|
4
|
+
import{r as t,c as e,d as o}from"./index-vpnVjPKQ.js";import{h as i}from"./renderer-CTaemqrs.js";const n=class{constructor(o){t(this,o),this.nanoSlideReady=e(this,"nanoSlideReady",7)}nanoSlideReady;ready=null;readyChange(t,e){void 0!==e&&!1===e&&!0===t&&this.nanoSlideReady.emit()}componentDidLoad(){"boolean"!=typeof this.ready&&setTimeout((()=>{this.nanoSlideReady.emit(),this.ready=!0}))}render(){return i(o,{key:"3de94ff45cb6dddcca7f0097f3376361c2666f7e",class:"nano-slide"},i("slot",{key:"9998d9102bdc69eecd28752b4a2c130497b34d06"}))}static get watchers(){return{ready:["readyChange"]}}};n.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:flex;align-items:center;justify-content:center;inline-size:100%;min-block-size:100%;font-size:18px;text-align:center;box-sizing:border-box;overflow:hidden;transition:opacity 0.2s;opacity:0;flex-direction:column}:host([ready]){opacity:1}:host(:not([ready])){flex:1 0 auto}";export{n as nano_slide}
|