@nanoporetech-digital/components 8.0.0-alpha.0 → 8.0.0-alpha.2
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-JweofGji.js → algolia-data-CSD3I9WJ.js} +1 -1
- package/dist/cjs/{component-store-DKMzj8Ei.js → component-store-DS6c_IIg.js} +1 -1
- package/dist/cjs/{dom-a3wgHxbn.js → dom-3kyE_RMm.js} +1 -1
- package/dist/cjs/{fade-run1oYFS.js → fade-C3xL9ihU.js} +3 -3
- package/dist/cjs/{form-control-zW-pmQ5Y.js → form-control-BVH0tPGy.js} +2 -2
- package/dist/cjs/{fullscreen-DGiusO_n.js → fullscreen-pHBD1-3e.js} +3 -3
- package/dist/cjs/{index-DYD4xvxr.js → index-IR1lkhwT.js} +170 -178
- package/dist/cjs/{index-BV7Y7Zvi.js → index-yq5hsIxW.js} +1 -1
- package/dist/cjs/index.cjs.js +3 -3
- package/dist/cjs/{lazyload-CavfHrQV.js → lazyload-D2pj9J7r.js} +3 -3
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/{modal-lJ_KdrUQ.js → modal-DZVjwBg8.js} +1 -1
- package/dist/cjs/nano-accordion.cjs.entry.js +3 -3
- package/dist/cjs/nano-alert.cjs.entry.js +7 -7
- 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 +4 -4
- package/dist/cjs/nano-avatar_5.cjs.entry.js +9 -9
- 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 +2 -2
- package/dist/cjs/nano-checkbox.cjs.entry.js +6 -6
- package/dist/cjs/nano-collapsible-comparison.cjs.entry.js +2 -2
- package/dist/cjs/nano-components.cjs.js +3 -3
- package/dist/cjs/nano-content-links.cjs.entry.js +1 -1
- package/dist/cjs/nano-cta.cjs.entry.js +9 -8
- package/dist/cjs/{nano-data-table-DlJaR4KG.js → nano-data-table-BkyqQiTG.js} +5 -5
- package/dist/cjs/nano-data-table.cjs.entry.js +6 -6
- package/dist/cjs/nano-datalist_3.cjs.entry.js +11 -10
- package/dist/cjs/nano-date-input.cjs.entry.js +2 -2
- package/dist/cjs/nano-date-picker_2.cjs.entry.js +4 -4
- package/dist/cjs/nano-details.cjs.entry.js +9 -6
- package/dist/cjs/nano-dialog.cjs.entry.js +8 -8
- package/dist/cjs/nano-dropdown_2.cjs.entry.js +7 -7
- package/dist/cjs/nano-field-validator.cjs.entry.js +3 -3
- package/dist/cjs/nano-file-upload.cjs.entry.js +2 -2
- package/dist/cjs/nano-footer.cjs.entry.js +1 -1
- package/dist/cjs/nano-global-nav.cjs.entry.js +19 -15
- 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-item.cjs.entry.js +1 -1
- package/dist/cjs/nano-icon_3.cjs.entry.js +2 -2
- package/dist/cjs/nano-in-page-nav.cjs.entry.js +4 -4
- package/dist/cjs/nano-intersection-observe.cjs.entry.js +9 -12
- package/dist/cjs/nano-masked-overflow.cjs.entry.js +9 -9
- package/dist/cjs/nano-menu-drawer.cjs.entry.js +3 -3
- package/dist/cjs/nano-more-less.cjs.entry.js +4 -4
- package/dist/cjs/nano-nav-item.cjs.entry.js +5 -5
- package/dist/cjs/nano-progress-bar.cjs.entry.js +2 -2
- package/dist/cjs/nano-range.cjs.entry.js +2 -2
- package/dist/cjs/nano-rating.cjs.entry.js +2 -2
- package/dist/cjs/nano-resize-observe_2.cjs.entry.js +2 -2
- package/dist/cjs/nano-slide.cjs.entry.js +2 -2
- package/dist/cjs/{nano-slides-D5q9vQ4P.js → nano-slides-B3-XISfn.js} +6 -6
- 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 +2 -2
- package/dist/cjs/nano-sticker.cjs.entry.js +6 -9
- 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 +2 -2
- package/dist/cjs/nano-table.cjs.entry.js +5 -5
- package/dist/cjs/{page-dots-D-QQnR4W.js → page-dots-DHz-mQDL.js} +3 -3
- package/dist/cjs/{renderer-SkVn69pT.js → renderer-h0yo23iy.js} +1 -1
- package/dist/cjs/{scroll-DXjC771e.js → scroll-_aiH0KkA.js} +1 -1
- package/dist/cjs/{slot-CBvkJee9.js → slot-Hlplqf1Z.js} +1 -1
- package/dist/cjs/{tabbable-M9OUrhLE.js → tabbable-CkzmpQhq.js} +1 -1
- package/dist/cjs/{table.worker-FkRsUwRY.js → table.worker-NnDnfSFs.js} +6 -6
- package/dist/collection/collection-manifest.json +1 -1
- package/dist/collection/components/animation/animation.js +6 -3
- package/dist/collection/components/breadcrumb/breadcrumb.css +6 -5
- package/dist/collection/components/card-carousel/card-carousel.css +4 -4
- package/dist/collection/components/checkbox/checkbox.js +4 -4
- package/dist/collection/components/cta/cta.js +8 -11
- package/dist/collection/components/datalist/datalist.js +9 -8
- package/dist/collection/components/details/details.js +6 -3
- package/dist/collection/components/dropdown/dropdown.js +1 -1
- package/dist/collection/components/field-validator/field-validator.js +1 -1
- package/dist/collection/components/form-control/form-control.js +1 -1
- package/dist/collection/components/global-nav/global-nav.css +4 -4
- package/dist/collection/components/global-nav/global-nav.js +35 -14
- package/dist/collection/components/grid/grid.css +3 -0
- package/dist/collection/components/in-page-nav/in-page-nav.css +5 -5
- package/dist/collection/components/intersection-observe/intersection-observe.js +6 -9
- package/dist/collection/components/masked-overflow/masked-overflow.css +3 -4
- package/dist/collection/components/masked-overflow/masked-overflow.js +8 -6
- package/dist/collection/components/menu/menu.js +3 -5
- package/dist/collection/components/more-less/more-less.js +6 -3
- package/dist/collection/components/slides/slides.js +1 -1
- package/dist/collection/components/sortable/sortable.js +5 -5
- package/dist/collection/components/sticker/sticker.js +2 -5
- package/dist/collection/components/table/table.js +3 -2
- package/dist/collection/components/tabs/tab-group.css +3 -3
- package/dist/collection/global/script/global.js +1 -30
- package/dist/components/cta.js +10 -9
- package/dist/components/datalist.js +9 -8
- package/dist/components/details.js +6 -3
- package/dist/components/form-control.js +1 -1
- package/dist/components/grid.js +1 -1
- package/dist/components/index.js +1 -30
- package/dist/components/masked-overflow.js +5 -5
- package/dist/components/menu.js +3 -5
- package/dist/components/nano-animation.js +3 -3
- package/dist/components/nano-breadcrumb.js +1 -1
- package/dist/components/nano-card-carousel.js +1 -1
- package/dist/components/nano-checkbox.js +4 -4
- package/dist/components/nano-global-nav.js +19 -14
- package/dist/components/nano-in-page-nav.js +1 -1
- package/dist/components/nano-intersection-observe.js +6 -9
- package/dist/components/nano-more-less.js +2 -2
- package/dist/components/nano-tab-group.js +1 -1
- package/dist/components/nano-table.js +4 -4
- package/dist/components/sticker.js +2 -5
- package/dist/esm/{algolia-data-BNDipgId.js → algolia-data-D6wnbV__.js} +1 -1
- package/dist/esm/{component-store-DqCSKpAK.js → component-store-CH5BI3Tg.js} +1 -1
- package/dist/esm/{dom-CF0Ycs9M.js → dom-Cb7FUtXp.js} +1 -1
- package/dist/esm/{fade-CdIyPeai.js → fade-BTgTGh6q.js} +3 -3
- package/dist/esm/{form-control-DXPQniNX.js → form-control-BOVGZF9R.js} +2 -2
- package/dist/esm/{fullscreen-C4GllGer.js → fullscreen-BTpZyXkc.js} +3 -3
- package/dist/esm/{index-CFYZ-ZOT.js → index-DXvE-U_j.js} +156 -164
- package/dist/esm/{index-DxKBolVo.js → index-Dw3NZx59.js} +1 -1
- package/dist/esm/index.js +4 -4
- package/dist/esm/{lazyload-pTbJ7q2S.js → lazyload-BYoZ43fz.js} +3 -3
- package/dist/esm/loader.js +3 -3
- package/dist/esm/{modal-B50PWCuY.js → modal-B_AxJQQp.js} +1 -1
- package/dist/esm/nano-accordion.entry.js +3 -3
- package/dist/esm/nano-alert.entry.js +7 -7
- 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 +4 -4
- package/dist/esm/nano-avatar_5.entry.js +9 -9
- 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 +2 -2
- package/dist/esm/nano-checkbox.entry.js +6 -6
- package/dist/esm/nano-collapsible-comparison.entry.js +2 -2
- package/dist/esm/nano-components.js +4 -4
- package/dist/esm/nano-content-links.entry.js +1 -1
- package/dist/esm/nano-cta.entry.js +9 -8
- package/dist/esm/{nano-data-table-DsTG4mqR.js → nano-data-table-DDBCyBmN.js} +5 -5
- package/dist/esm/nano-data-table.entry.js +6 -6
- package/dist/esm/nano-datalist_3.entry.js +11 -10
- package/dist/esm/nano-date-input.entry.js +2 -2
- package/dist/esm/nano-date-picker_2.entry.js +4 -4
- package/dist/esm/nano-details.entry.js +9 -6
- package/dist/esm/nano-dialog.entry.js +8 -8
- package/dist/esm/nano-dropdown_2.entry.js +7 -7
- package/dist/esm/nano-field-validator.entry.js +3 -3
- package/dist/esm/nano-file-upload.entry.js +2 -2
- package/dist/esm/nano-footer.entry.js +1 -1
- package/dist/esm/nano-global-nav.entry.js +19 -15
- 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-item.entry.js +1 -1
- package/dist/esm/nano-icon_3.entry.js +2 -2
- package/dist/esm/nano-in-page-nav.entry.js +4 -4
- package/dist/esm/nano-intersection-observe.entry.js +9 -12
- package/dist/esm/nano-masked-overflow.entry.js +9 -9
- package/dist/esm/nano-menu-drawer.entry.js +3 -3
- package/dist/esm/nano-more-less.entry.js +4 -4
- package/dist/esm/nano-nav-item.entry.js +5 -5
- package/dist/esm/nano-progress-bar.entry.js +2 -2
- package/dist/esm/nano-range.entry.js +2 -2
- package/dist/esm/nano-rating.entry.js +2 -2
- package/dist/esm/nano-resize-observe_2.entry.js +2 -2
- package/dist/esm/nano-slide.entry.js +2 -2
- package/dist/esm/{nano-slides-BcyK9Szs.js → nano-slides-CvZxKg4X.js} +6 -6
- 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 +2 -2
- package/dist/esm/nano-sticker.entry.js +6 -9
- 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 +2 -2
- package/dist/esm/nano-table.entry.js +5 -5
- package/dist/esm/{page-dots-Cq8hjoql.js → page-dots-_tkpExQM.js} +3 -3
- package/dist/esm/{renderer-LJzCFyMt.js → renderer-BUaAsDso.js} +1 -1
- package/dist/esm/{scroll-BRRzrkAi.js → scroll-iCYjzh9N.js} +1 -1
- package/dist/esm/{slot-DBzVpliZ.js → slot-DYFgWo5f.js} +1 -1
- package/dist/esm/{tabbable-BpHwrUYt.js → tabbable-C4l-rYq9.js} +1 -1
- package/dist/esm/{table.worker-BoX4CUXT.js → table.worker-webIEBZt.js} +6 -6
- package/dist/nano-components/{algolia-data-BNDipgId.js → algolia-data-D6wnbV__.js} +1 -1
- package/dist/nano-components/{component-store-DqCSKpAK.js → component-store-CH5BI3Tg.js} +1 -1
- package/dist/nano-components/{dom-CF0Ycs9M.js → dom-Cb7FUtXp.js} +1 -1
- package/dist/nano-components/{fade-CdIyPeai.js → fade-BTgTGh6q.js} +1 -1
- package/dist/nano-components/form-control-BOVGZF9R.js +4 -0
- package/dist/nano-components/{fullscreen-C4GllGer.js → fullscreen-BTpZyXkc.js} +1 -1
- package/dist/nano-components/index-DXvE-U_j.js +5 -0
- package/dist/nano-components/{index-DxKBolVo.js → index-Dw3NZx59.js} +1 -1
- package/dist/nano-components/index.esm.js +1 -1
- package/dist/nano-components/{lazyload-pTbJ7q2S.js → lazyload-BYoZ43fz.js} +1 -1
- package/dist/nano-components/{modal-B50PWCuY.js → modal-B_AxJQQp.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 +65 -40
- 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-DsTG4mqR.js → nano-data-table-DDBCyBmN.js} +1 -1
- 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-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-item.entry.js +1 -1
- package/dist/nano-components/nano-icon_3.entry.js +1 -1
- package/dist/nano-components/nano-in-page-nav.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-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_2.entry.js +1 -1
- package/dist/nano-components/nano-slide.entry.js +1 -1
- package/dist/nano-components/{nano-slides-BcyK9Szs.js → nano-slides-CvZxKg4X.js} +4 -4
- 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-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/{page-dots-Cq8hjoql.js → page-dots-_tkpExQM.js} +1 -1
- package/dist/nano-components/{renderer-LJzCFyMt.js → renderer-BUaAsDso.js} +1 -1
- package/dist/nano-components/{scroll-BRRzrkAi.js → scroll-iCYjzh9N.js} +1 -1
- package/dist/nano-components/{slot-DBzVpliZ.js → slot-DYFgWo5f.js} +1 -1
- package/dist/nano-components/{tabbable-BpHwrUYt.js → tabbable-C4l-rYq9.js} +1 -1
- package/dist/nano-components/{table.worker-BoX4CUXT.js → table.worker-webIEBZt.js} +1 -1
- package/dist/stencil.config.js +1 -2
- 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/nano.css +1 -1
- package/dist/style/nano.css.map +1 -1
- package/dist/types/components/animation/animation.d.ts +3 -0
- package/dist/types/components/cta/cta.d.ts +0 -2
- package/dist/types/components/global-nav/global-nav.d.ts +4 -2
- package/dist/types/components/masked-overflow/masked-overflow.d.ts +4 -2
- package/dist/types/components/more-less/more-less.d.ts +4 -1
- package/dist/types/components/slides/slides-interface.d.ts +1 -1
- package/dist/types/components.d.ts +40 -16
- package/docs-json.json +79 -28
- package/docs-vscode.json +2 -2
- package/hydrate/index.js +300 -1355
- package/hydrate/index.mjs +300 -1355
- package/package.json +3 -3
- package/dist/nano-components/form-control-DXPQniNX.js +0 -4
- package/dist/nano-components/index-CFYZ-ZOT.js +0 -5
- package/dist/plugins/postcss/scoped-part.js +0 -26
- package/dist/types/Users/John.Jenkins/projects/nano-components/packages/components/.stencil/plugins/postcss/scoped-part.d.ts +0 -8
- package/dist/types/utils/testing/index.d.ts +0 -50
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as o,c as e,a as s,B as i,d as n}from"./index-
|
|
4
|
+
import{r as o,c as e,a as s,B as i,d as n}from"./index-DXvE-U_j.js";import{g as t}from"./theme-aiuyr36I.js";import{d as a}from"./throttle-C93FMm2Z.js";import{t as r,h as c}from"./renderer-BUaAsDso.js";const h=class{constructor(s){o(this,s),this.nanoChange=e(this,"nanoChange",7),this.nanoValidate=e(this,"nanoValidate",7)}mo;checkboxTypes;grpId="nano-checkbox-group-"+l++;ignoreValueSet=!1;get host(){return s(this)}checkboxes;nativeCbs;errorMessage="";showErrorMsg=!1;hasHelperSlot=!1;validateOn="submitThenDirty";showInlineError=!0;min=0;max=null;disabled=null;_legend="";get legend(){return!this._legend.endsWith("*")&&this.nativeCbs?.find((o=>!!o.required))?this._legend+" *":this._legend}set legend(o){this._legend=o}hideLegend=!1;get invalid(){return this._invalid}_invalid=!1;get validityMessage(){return this.errorMessage}value;handleValuePropChange(){this.nanoChange.emit(this.value),this.ignoreValueSet||this.setCbValue()}async reportValidity(o){return new Promise((e=>{o&&(this.customValidate(),this.showInlineValidation()),setTimeout((()=>{e({isValid:!this.invalid,errorMessage:this.errorMessage})}),50)}))}async showError(o,e){let s;this.checkboxes&&(e&&(s=this.checkboxes.find((o=>o.value===e))),s||(s=this.checkboxes[0]),s&&(this.errorMessage=o,await s.setError(o),this.showInlineValidation()))}nanoChange;nanoValidate;handleValueChange(o){o.target!==this.host&&(this.setInternalValue(),this.handleCbChange())}handleCbChange(){this.invalid&&(this.showErrorMsg=this._invalid=!1),this.customValidate(),"dirty"===this.validateOn&&this.showInlineValidation()}customValidate(){if(!this.nativeCbs||!this.nativeCbs.length||!this.checkboxes)return;this.checkboxes.forEach(((o,e)=>{const s=this.nativeCbs[e];o.setError(""),s.setCustomValidity("")}));const o=this.nativeCbs.filter((o=>"radio"===o?.type));if(o&&o.length){const e=o.find((o=>o.required)),s=o.find((o=>o.checked));if(e&&s)return!1;if(e&&!s)return!0}const e=this.nativeCbs.filter((o=>"checkbox"===o?.type));if(!e||!e.length)return;const s=e.filter((o=>o.checked)),i=e.find((o=>o.required));let n=!1;return!(!i||s.find((o=>o===i)))||(this.checkboxes.forEach(((o,e)=>{const i=this.nativeCbs[e];let t="";this.min&&s.length<this.min&&(t=`You must select a minimum of ${this.min} values.`,n=!0),this.max&&s.length>this.max&&(t=`Only up to ${this.max} values are allowed.`,n=!0),n&&(o.setError(t,this.showErrorMsg),i.setCustomValidity(t))})),n)}handleComponentChange(){this.checkboxes?.length&&(this.checkboxTypes=t(this.checkboxes.map((o=>"types-"+(o.type||"checkbox")))),this.checkboxTypes["nano-checkbox-group"]=!0)}handleDisabledChange(){null!==this.disabled&&this.checkboxes?.length&&this.checkboxes.map((o=>o.disabled=this.disabled))}setInternalValue(){if(!this.nativeCbs?.length)return;this.ignoreValueSet=!0;const o=this.nativeCbs.filter((o=>"radio"===o?.type));o?.length?this.value=o.find((o=>o.checked))?.value||null:(this.value=this.checkboxes.flatMap((o=>o.checked?[o.value]:[])),requestAnimationFrame((()=>this.ignoreValueSet=!1)))}setCbValue(){this.checkboxes?.forEach((o=>{let e=this.value;"string"==typeof this.value&&this.value.includes(",")&&(e=this.value.split(",")),(o.value===e||o.value===this.value||Array.isArray(e)&&e.includes(o.value))&&(o.checked=!0)}))}attachSlotObserver(){this.mo||i.isServer||(this.mo=new MutationObserver((()=>this.handleSlotChange()))).observe(this.host,{childList:!0})}async handleSlotChange(){this.checkboxes=Array.from(this.host.querySelectorAll(r("nano-checkbox"))),this.hasHelperSlot=!!this.host.querySelector('[slot="helper"]'),this.nativeCbs=await Promise.all(this.checkboxes.reduce(((o,e)=>(o.push(e.getInputElement()),o)),[])),this.nativeCbs.forEach((o=>{o&&o.addEventListener("invalid",this.handleInvalid)}))}handleInvalid=o=>{this._invalid=!0,this.showInlineError&&o.preventDefault(),"submit"===this.validateOn&&this.customValidate(),this.showInlineValidation(o)};showInlineValidation=o=>{this.nativeCbs&&this.nativeCbs.length&&this.showInlineError&&("submitThenDirty"===this.validateOn&&(this.validateOn="dirty"),this.showErrorMsg=!1,this._invalid=!1,this.errorMessage="",this.checkboxes.forEach(((o,e)=>{const s=this.nativeCbs[e];s.validity.valid||(s.validationMessage&&(this.errorMessage=s.validationMessage,this.showErrorMsg=!0,o.reportValidity(!1)),this._invalid=!0)})),this.nanoValidate.emit({isValid:!this.invalid,errorMessage:this.errorMessage,originalEvent:o}))};componentWillLoad(){this.handleValueChange=this.handleValueChange.bind(this),this.handleValueChange=a(this.handleValueChange,1),this.showInlineValidation=a(this.showInlineValidation,10),this.handleDisabledChange(),this.handleSlotChange(),this.setCbValue(),this.handleComponentChange()}connectedCallback(){this.attachSlotObserver()}disconnectedCallback(){this.mo&&this.mo.disconnect(),this.nativeCbs?.length&&this.nativeCbs.forEach((o=>{o&&o.removeEventListener("invalid",this.handleInvalid)}))}render(){const o=this.grpId+"-lbl",e=this.showInlineError||this.hasHelperSlot?this.grpId+"-more":"";return c(n,{key:"b6d81d374260c8cb97dfc1557238c20945b44632",class:this.checkboxTypes},c("fieldset",{key:"fa058ccca23a91b369c659ff442585de43a4333d",disabled:this.disabled,class:{cbgroup:!0,"has-error":this.showErrorMsg&&!!this.errorMessage,"has-helper":this.hasHelperSlot}},c("legend",{key:"429737fad96eef6af343c5e978a4642a599ea4a6",id:o,class:{cbgroup__legend:!0,"visually-hide":this.hideLegend}},c("slot",{key:"d592da5791f7e830c57aec7c62c01b32326b5a34",name:"legend"},this.legend)),c("div",{key:"0bb0a2206a13bb9f773857b4ac897bfffb75a741",class:"cbgroup__cbs",role:"group","aria-labelledby":o+" "+e},c("slot",{key:"23f668b5fa4a1d23f39ea49998ae75767df15624"})),(this.showInlineError||this.hasHelperSlot)&&c("div",{key:"1e15d0bb57352fb8cd7a3a746dd5adb8bb979819",class:"cbgroup__more",id:e},this.showInlineError?c("div",{class:"cbgroup__error"},this.errorMessage):"",c("div",{key:"e23596644945fafd2802bf1ac8958a314a076bc8",class:"cbgroup__help"},c("slot",{key:"d6df38d9ceaa915364a20dc29d8a1457b071c6ef",name:"helper"})))))}static get watchers(){return{value:["handleValuePropChange"],min:["handleCbChange"],max:["handleCbChange"],nativeCbs:["customValidate"],checkboxes:["handleComponentChange","handleDisabledChange"],disabled:["handleDisabledChange"]}}};let l=0;h.style=".sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{box-sizing:border-box}[hidden].sc-nano-checkbox-group{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{box-sizing:border-box}[hidden].sc-nano-checkbox-group{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-group-h,*.sc-nano-checkbox-group,*.sc-nano-checkbox-group::before,*.sc-nano-checkbox-group::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-group-h{--label-color:var(--nano-color-base-1000);--label-font-size:var(--nano-font-size-xs);--invalid-msg-color:var(--nano-color-danger-1100);--help-msg-color:var(--nano-color-base-1000);--more-font-size:var(--nano-font-size-2xs);display:block;inline-size:100%}.sc-nano-checkbox-group-h *.sc-nano-checkbox-group{box-sizing:inherit}.cbgroup.sc-nano-checkbox-group{margin:0;padding:0;border:0}.cbgroup__error.sc-nano-checkbox-group,.cbgroup__help.sc-nano-checkbox-group,.cbgroup__more.sc-nano-checkbox-group{display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.cbgroup__error.sc-nano-checkbox-group,.cbgroup__help.sc-nano-checkbox-group{inset-block-start:0;inset-inline-start:0;position:absolute;font-size:var(--more-font-size);line-height:1.2;transition:0.3s ease-out opacity;font-style:italic}.show-error.sc-nano-checkbox-group .cbgroup__error.sc-nano-checkbox-group,.show-error.sc-nano-checkbox-group .cbgroup__help.sc-nano-checkbox-group{opacity:1}.cbgroup__error.sc-nano-checkbox-group{color:var(--invalid-msg-color);opacity:0}.has-error.sc-nano-checkbox-group .cbgroup__error.sc-nano-checkbox-group{opacity:1}.cbgroup__help.sc-nano-checkbox-group{opacity:1;color:var(--help-msg-color)}.has-error.sc-nano-checkbox-group .cbgroup__help.sc-nano-checkbox-group{opacity:0}.cbgroup__more.sc-nano-checkbox-group{block-size:1em;margin-block:var(--nano-spacing-sm) 0;position:relative;opacity:0;display:none;transition:all var(--nano-transition-fast) ease;transition-behavior:allow-discrete}.has-helper.sc-nano-checkbox-group .cbgroup__more.sc-nano-checkbox-group,.has-error.sc-nano-checkbox-group .cbgroup__more.sc-nano-checkbox-group{display:block;opacity:1}.cbgroup__legend.sc-nano-checkbox-group{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);padding:0 0 0.9375rem;margin:0;display:block;inline-size:100%}.cbgroup__legend.visually-hide.sc-nano-checkbox-group{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.cbgroup__cbs.sc-nano-checkbox-group{margin:0;padding:0;display:flex;flex-direction:column;gap:var(--nano-spacing-md)}.types-segment.sc-nano-checkbox-group-h .cbgroup__cbs.sc-nano-checkbox-group{flex-direction:row;gap:0}.types-tag.sc-nano-checkbox-group-h .cbgroup__cbs.sc-nano-checkbox-group{flex-direction:row;gap:var(--nano-spacing-sm)}";export{h as nano_checkbox_group}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as n,c as o,a as c,d as a}from"./index-CFYZ-ZOT.js";import{t as e,h as i}from"./renderer-LJzCFyMt.js";let s=0;const t=class{constructor(c){n(this,c),this.nanoChange=o(this,"nanoChange",7),this.nanoFocus=o(this,"nanoFocus",7),this.nanoBlur=o(this,"nanoBlur",7)}inputId="nano-cb-"+s++;input;_slotWrapper;get slotWrapper(){return this._slotWrapper}set slotWrapper(n){this._slotWrapper=n,this.hasLabel=!!n.querySelectorAll("*").length||!!this.label}get host(){return c(this)}inputType="checkbox";hasLabel=!1;hasFocus=!1;checked=!1;async handleCheckedChange(){if(this.input){if(this.input.checked=this.checked,"radio"===this.inputType&&this.name&&this.checked&&this.host.isConnected){const n=this.host.closest("form"),o=this.host.getRootNode();let c;c=n?Array.from(n.querySelectorAll(`${e("nano-checkbox")}[name="${this.name}"]`)):Array.from(o.querySelectorAll(`${e("nano-checkbox")}[name="${this.name}"]`))?.filter((n=>!n.closest("form"))),c.map((n=>{n!==this.host&&(n.checked=!1)}))}this.nanoChange.emit({value:this.value,checked:this.checked})}}disabled=!1;value="on";name;required=!1;type="checkbox";typeChange(){this.inputType=["checkbox","switch","tag"].includes(this.type)?"checkbox":"radio"}label;hideLabel=!1;indeterminate=!1;handleIndeterminateChange(){this.checked=!1,this.input.indeterminate=this.indeterminate}get invalid(){return this._invalid}_invalid=!1;get validityMessage(){return this.input?this.input.validationMessage:""}form;nanoChange;nanoFocus;nanoBlur;async getInputElement(){if(this.input)return this.input}async reportValidity(n=!1){return n&&this.input.reportValidity(),this._invalid=!this.input.validity.valid,{isValid:!this.invalid,errorMessage:this.input.validationMessage}}async setError(n,o=!0){this.input&&(o&&(this._invalid=!!n.length),this.input.setCustomValidity(n))}async setFocus(){this.input&&this.input.focus()}async removeFocus(){this.input&&this.input.blur()}onHostClick(n){this.host!==n.target&&this.host.contains(n.target)||(this.checked=!this.checked)}onReset(n){(this.form?document.querySelector("#"+this.form):this.host.closest("form"))&&n.target===this.host.closest("form")&&(this.checked=!1)}handleInvalid=n=>{this._invalid=!n.target.validity.valid};handleChange=n=>{this.checked=n.target.checked,this.indeterminate=!1};handleFocus=()=>{this.hasFocus=!0,this.nanoFocus.emit()};handleBlur=()=>{this.hasFocus=!1,this.nanoBlur.emit()};isRadioChecked(){requestAnimationFrame((()=>this.checked=this.input.checked))}componentWillLoad(){this.typeChange(),this.hasLabel=!!this.host.querySelectorAll("*").length||!!this.label}componentDidLoad(){this.input.indeterminate=this.indeterminate,this.isRadioChecked()}render(){const n=this.inputId+"-lbl";return i(a,{key:"ca41f256a304b8ec19dba81fbe0dcd30eefd63fe"},i("label",{key:"31254b867b036d7703939e7b19f4f483f00af844",class:{nanocb:!0,"nanocb--checked":this.checked,"nanocb--invalid":this.invalid,"nanocb--disabled":this.disabled,"nanocb--focused":this.hasFocus,"nanocb--indeterminate":this.indeterminate,["nanocb__"+this.type]:!0},htmlFor:this.inputId},i("input",{key:"d46202d25ee15a0274766d845510608ed5af88f4",type:this.inputType,name:this.name,form:this.form,required:this.required,checked:this.checked,disabled:this.disabled,value:this.value,"aria-labelledby":this.hasLabel?n:void 0,onBlur:this.handleBlur,onFocus:this.handleFocus,onChange:this.handleChange,ref:n=>this.input=n,id:this.inputId,onInvalid:this.handleInvalid}),i("span",{key:"0f3c9134ab08ce653a58d71d681495349536e211",class:"nanocb__input"}),this.hasLabel&&i("div",{key:"e4315662f387dc17f3406f22931535061756cca6",id:n,class:{nanocb__label:!0,[`nanocb__label--${this.type}`]:!0,"nanocb__label--hidden":this.hideLabel}},this.label&&!!this.label.length&&i("span",{key:"05716b3189e0a489c530c2539944eaaae74e0e08"},this.label),i("span",{key:"026a9bbb2f50332d184a29a03a58e6cb287d7f8c",hidden:this.label&&!!this.label.length,ref:n=>this.slotWrapper=n},i("slot",{key:"62b0ab184d32167780d52aa90dddcdc25977548c"})))))}static get watchers(){return{checked:["handleCheckedChange"],type:["typeChange"],indeterminate:["handleIndeterminateChange"]}}};t.style='.sc-nano-checkbox-h,*.sc-nano-checkbox,*.sc-nano-checkbox::before,*.sc-nano-checkbox::after{box-sizing:border-box}[hidden].sc-nano-checkbox{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-h,*.sc-nano-checkbox,*.sc-nano-checkbox::before,*.sc-nano-checkbox::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-h,*.sc-nano-checkbox,*.sc-nano-checkbox::before,*.sc-nano-checkbox::after{box-sizing:border-box}[hidden].sc-nano-checkbox{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-h,*.sc-nano-checkbox,*.sc-nano-checkbox::before,*.sc-nano-checkbox::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-h{--border-color:var(--nano-color-primary-1000);--label-color:var(--nano-color-base-1000);--spacing:var(--nano-spacing-sm);--active-background:var(--nano-color-primary-1000);--active-foreground:var(--nano-color-basic-white);--error-color:var(--nano-color-danger-1100);--disabled-label-color:var(--nano-color-neutral-1000);--disabled-background:var(--nano-color-neutral-300);--disabled-foreground:var(--nano-color-neutral-700);--disabled-border-color:var(--nano-color-neutral-1000);display:inline-block;max-inline-size:100%}.nanocb.sc-nano-checkbox{cursor:pointer;display:flex;align-items:center;line-height:1.2;position:relative;font-size:1rem}.nanocb.sc-nano-checkbox input.sc-nano-checkbox{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.nanocb.sc-nano-checkbox input.sc-nano-checkbox:focus-visible~.nanocb__input.sc-nano-checkbox{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.nanocb.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox,.nanocb.sc-nano-checkbox input.sc-nano-checkbox:indeterminate~.nanocb__input.sc-nano-checkbox{background-color:var(--active-background)}.nanocb.nanocb--disabled.sc-nano-checkbox{cursor:not-allowed}.sc-nano-checkbox-h:not([hide-label]) .nanocb.sc-nano-checkbox{gap:var(--spacing)}.sc-nano-checkbox-h:not([type=tag]) .nanocb__label--hidden.sc-nano-checkbox,.sc-nano-checkbox-h:not([type=segment]) .nanocb__label--hidden.sc-nano-checkbox{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.nanocb__radio.sc-nano-checkbox .nanocb__input.sc-nano-checkbox,.nanocb__checkbox.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{display:grid;place-content:center center;block-size:1.125em;inline-size:1.125em;border-radius:1px;border:1px solid var(--border-color)}.nanocb__radio.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after,.nanocb__checkbox.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{content:"";grid-column:1;grid-row:1;border:solid var(--active-foreground);border-width:0 0.125em 0.125em 0;opacity:1;transition:scale var(--nano-transition-x-fast) ease-out;transform-origin:center;rotate:45deg;scale:0;inline-size:0.325em;block-size:0.5625em;margin-block-start:-0.1875em}.nanocb--indeterminate.sc-nano-checkbox .nanocb__radio.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after,.nanocb--indeterminate.sc-nano-checkbox .nanocb__checkbox.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{border-width:0 0 0.1875em}.nanocb__radio.sc-nano-checkbox .nanocb__label.sc-nano-checkbox,.nanocb__checkbox.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);color:var(--label-color)}.nanocb__radio.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox::after,.nanocb__checkbox.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox::after{scale:1}.nanocb__radio.sc-nano-checkbox input.sc-nano-checkbox:indeterminate~.nanocb__input.sc-nano-checkbox::after,.nanocb__checkbox.sc-nano-checkbox input.sc-nano-checkbox:indeterminate~.nanocb__input.sc-nano-checkbox::after{scale:1;rotate:0deg;block-size:1px;inline-size:0.625em;border-width:0 0 0.125em;margin-block-start:0}.nanocb__radio.nanocb--invalid.sc-nano-checkbox .nanocb__input.sc-nano-checkbox,.nanocb__checkbox.nanocb--invalid.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{outline:1px solid var(--error-color);outline-offset:1px}.nanocb__radio.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox,.nanocb__checkbox.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{border:1px solid var(--disabled-border-color);background:var(--disabled-background)}.nanocb__radio.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after,.nanocb__checkbox.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{display:none}.nanocb__radio.nanocb--disabled.sc-nano-checkbox .nanocb__label.sc-nano-checkbox,.nanocb__checkbox.nanocb--disabled.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{color:var(--disabled-label-color)}.nanocb__radio.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{border-radius:50%}.nanocb__radio.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{border-radius:50%;background:var(--active-foreground);border:none;margin:0 !important}.nanocb__radio.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox::after{scale:1;opacity:1;block-size:0.5em;inline-size:0.5em}.nanocb__radio.sc-nano-checkbox input.sc-nano-checkbox:indeterminate~.nanocb__input.sc-nano-checkbox{background-color:transparent}.nanocb__radio.sc-nano-checkbox input.sc-nano-checkbox:indeterminate~.nanocb__input.sc-nano-checkbox::after{display:none}.nanocb__switch.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{inline-size:2.1875em;block-size:1.125em;border:1px solid var(--border-color)}.nanocb__switch.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{content:"";position:relative;display:block;border-radius:inherit;block-size:0.75em;inline-size:0.75em;background-color:var(--active-background);transform-origin:left;inset-inline-start:0.125em;inset-block-start:50%;transform:translateY(-50%);transition:0.1s ease scale, 0.1s ease background-color, 0.15s ease left}.nanocb__switch.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox::after{inset-inline-start:1.1875em;transform-origin:right;background-color:var(--active-foreground)}.nanocb__switch.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);color:var(--label-color)}.nanocb__switch.nanocb--invalid.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{outline:1px solid var(--error-color);outline-offset:1px}.nanocb__switch.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{border:1px solid var(--disabled-background);background:var(--disabled-background)}.nanocb__switch.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{background:var(--disabled-foreground)}.nanocb__switch.nanocb--disabled.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{color:var(--disabled-label-color)}[type=segment].sc-nano-checkbox-h{display:inline-block}.nanocb__segment.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{display:none}.nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);color:var(--label-color);padding:0.4375em 0.9375em;border:1px solid var(--active-background)}.sc-nano-checkbox-h:first-of-type .nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{border-inline-end:1px solid var(--nano-color-neutral-300)}.sc-nano-checkbox-h:not(:last-of-type .nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox,.sc-nano-checkbox-h:first-of-type) .nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{border-inline-start:none;border-inline-end:1px solid var(--nano-color-neutral-300)}.sc-nano-checkbox-h:last-of-type .nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{border-inline-start:none;border-inline-end:1px solid var(--active-background) !important}.sc-nano-checkbox-h:first-of-type:last-of-type .nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{border:1px solid var(--active-background)}.nanocb__segment.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__label.sc-nano-checkbox{color:var(--active-foreground);background-color:var(--active-background);box-shadow:2px 2px 3px 0 rgba(0, 0, 0, 0.2) inset}.nanocb__segment.sc-nano-checkbox input.sc-nano-checkbox:focus-visible:focus~.nanocb__label.sc-nano-checkbox{outline:var(--nano-focus-ring);outline-offset:1px;z-index:1}.nanocb__segment.nanocb--invalid.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{outline:1px solid var(--error-color);outline-offset:1px}.nanocb__segment.nanocb--disabled.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{background-color:var(--disabled-background);color:var(--disabled-label-color)}[type=tag].sc-nano-checkbox-h{display:inline-block}.nanocb__tag.sc-nano-checkbox{display:inline-flex;align-items:center;gap:6px;padding:8px;border:1px solid var(--active-background);color:var(--nano-color-primary-1100);font-size:var(--nano-font-size-2xs);font-weight:bold;transition:background-color var(--nano-transition-x-fast) ease-out}.nanocb__tag.sc-nano-checkbox:hover{background-color:var(--nano-color-primary-100)}.nanocb__tag.sc-nano-checkbox:has(input:checked){background-color:var(--nano-color-primary-300)}.nanocb__tag.sc-nano-checkbox:has(input:focus-visible:focus){outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset);z-index:1}.nanocb__tag.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{order:0;-webkit-user-select:none;user-select:none}.nanocb__tag.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{order:1;display:grid;place-content:center center;block-size:1.125em;inline-size:1.125em;border-radius:1px;border:1px solid var(--border-color);outline:none !important}.nanocb__tag.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{content:"";grid-column:1;grid-row:1;block-size:0;inline-size:0;border:solid var(--active-foreground);border-width:0 0.125em 0.125em 0;opacity:1;transition:scale var(--nano-transition-x-fast) ease-out;transform-origin:center;rotate:45deg;scale:0}.nanocb--indeterminate.sc-nano-checkbox .nanocb__tag.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{border-width:0 0 0.1875em}.nanocb__tag.nanocb--invalid.sc-nano-checkbox{outline:1px solid var(--error-color);outline-offset:1px}.nanocb__tag.nanocb--disabled.sc-nano-checkbox{background:var(--disabled-background);border:1px solid var(--disabled-border-color)}.nanocb__tag.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{border:1px solid var(--disabled-border-color);background:var(--disabled-background)}.nanocb__tag.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{display:none}.nanocb__tag.nanocb--disabled.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{color:var(--disabled-label-color)}.nanocb__tag.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox::after{scale:1;inline-size:0.325em;block-size:0.5625em;margin-block-start:-0.1875em}';export{t as nano_checkbox}
|
|
4
|
+
import{r as n,c as o,a as c,d as a}from"./index-DXvE-U_j.js";import{t as e,h as i}from"./renderer-BUaAsDso.js";let s=0;const t=class{constructor(c){n(this,c),this.nanoChange=o(this,"nanoChange",7),this.nanoFocus=o(this,"nanoFocus",7),this.nanoBlur=o(this,"nanoBlur",7)}inputId="nano-cb-"+s++;input;_slotWrapper;get slotWrapper(){return this._slotWrapper}set slotWrapper(n){this._slotWrapper=n,this.hasLabel=!!n?.querySelectorAll("*").length||!!this.label}get host(){return c(this)}inputType="checkbox";hasLabel=!1;hasFocus=!1;checked=!1;async handleCheckedChange(){if(this.input){if(this.input.checked=this.checked,"radio"===this.inputType&&this.name&&this.checked&&this.host.isConnected){const n=this.host.closest("form"),o=this.host.getRootNode();let c;c=n?Array.from(n.querySelectorAll(`${e("nano-checkbox")}[name="${this.name}"]`)):Array.from(o.querySelectorAll(`${e("nano-checkbox")}[name="${this.name}"]`))?.filter((n=>!n.closest("form"))),c.map((n=>{n!==this.host&&(n.checked=!1)}))}this.nanoChange.emit({value:this.value,checked:this.checked})}}disabled=!1;value="on";name;required=!1;type="checkbox";typeChange(){this.inputType=["checkbox","switch","tag"].includes(this.type)?"checkbox":"radio"}label;hideLabel=!1;indeterminate=!1;handleIndeterminateChange(){this.checked=!1,this.input.indeterminate=this.indeterminate}get invalid(){return this._invalid}_invalid=!1;get validityMessage(){return this.input?this.input.validationMessage:""}form;nanoChange;nanoFocus;nanoBlur;async getInputElement(){if(this.input)return this.input}async reportValidity(n=!1){return n&&this.input.reportValidity(),this._invalid=!this.input.validity.valid,{isValid:!this.invalid,errorMessage:this.input.validationMessage}}async setError(n,o=!0){this.input&&(o&&(this._invalid=!!n.length),this.input.setCustomValidity(n))}async setFocus(){this.input&&this.input.focus()}async removeFocus(){this.input&&this.input.blur()}onHostClick(n){this.host!==n.target&&this.host.contains(n.target)||(this.checked=!this.checked)}onReset(n){(this.form?document.querySelector("#"+this.form):this.host.closest("form"))&&n.target===this.host.closest("form")&&(this.checked=!1)}handleInvalid=n=>{this._invalid=!n.target.validity.valid};handleChange=n=>{this.checked=n.target.checked,this.indeterminate=!1};handleFocus=()=>{this.hasFocus=!0,this.nanoFocus.emit()};handleBlur=()=>{this.hasFocus=!1,this.nanoBlur.emit()};isRadioChecked(){requestAnimationFrame((()=>this.checked=this.input.checked))}componentWillLoad(){this.typeChange(),this.hasLabel=!!this.host.querySelectorAll("*").length||!!this.label}componentDidLoad(){this.input.indeterminate=this.indeterminate,this.isRadioChecked()}render(){const n=this.inputId+"-lbl";return i(a,{key:"d1c462c6850bad6dd37696c1edc61d1413613908"},i("label",{key:"e45bce2bffd58378e79606d848b8dc4b2a023fb2",class:{nanocb:!0,"nanocb--checked":this.checked,"nanocb--invalid":this.invalid,"nanocb--disabled":this.disabled,"nanocb--focused":this.hasFocus,"nanocb--indeterminate":this.indeterminate,["nanocb__"+this.type]:!0},htmlFor:this.inputId},i("input",{key:"732c982c1613eed2075857fff33a869378ce2356",type:this.inputType,name:this.name,form:this.form,required:this.required,checked:this.checked,disabled:this.disabled,value:this.value,"aria-labelledby":this.hasLabel?n:void 0,onBlur:this.handleBlur,onFocus:this.handleFocus,onChange:this.handleChange,ref:n=>this.input=n,id:this.inputId,onInvalid:this.handleInvalid}),i("span",{key:"7299bc0cca8ea4230d4317ad1a5e9ec5c72fd58d",class:"nanocb__input"}),this.hasLabel&&i("div",{key:"daa0fd8b2b63796e96ea40e843390ca62c41c968",id:n,class:{nanocb__label:!0,[`nanocb__label--${this.type}`]:!0,"nanocb__label--hidden":this.hideLabel}},this.label&&!!this.label.length&&i("span",{key:"cdcdf9528ee8f39f22ddd9f61c490d4c02f910e4"},this.label),i("span",{key:"021ecfc889a1bc89df711343cad337d847d93191",hidden:this.label&&!!this.label.length,ref:n=>this.slotWrapper=n},i("slot",{key:"da6bb8cfd800f4f423aaa7be538b1e33af73f5bc"})))))}static get watchers(){return{checked:["handleCheckedChange"],type:["typeChange"],indeterminate:["handleIndeterminateChange"]}}};t.style='.sc-nano-checkbox-h,*.sc-nano-checkbox,*.sc-nano-checkbox::before,*.sc-nano-checkbox::after{box-sizing:border-box}[hidden].sc-nano-checkbox{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-h,*.sc-nano-checkbox,*.sc-nano-checkbox::before,*.sc-nano-checkbox::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-h,*.sc-nano-checkbox,*.sc-nano-checkbox::before,*.sc-nano-checkbox::after{box-sizing:border-box}[hidden].sc-nano-checkbox{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-checkbox-h,*.sc-nano-checkbox,*.sc-nano-checkbox::before,*.sc-nano-checkbox::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-checkbox-h{--border-color:var(--nano-color-primary-1000);--label-color:var(--nano-color-base-1000);--spacing:var(--nano-spacing-sm);--active-background:var(--nano-color-primary-1000);--active-foreground:var(--nano-color-basic-white);--error-color:var(--nano-color-danger-1100);--disabled-label-color:var(--nano-color-neutral-1000);--disabled-background:var(--nano-color-neutral-300);--disabled-foreground:var(--nano-color-neutral-700);--disabled-border-color:var(--nano-color-neutral-1000);display:inline-block;max-inline-size:100%}.nanocb.sc-nano-checkbox{cursor:pointer;display:flex;align-items:center;line-height:1.2;position:relative;font-size:1rem}.nanocb.sc-nano-checkbox input.sc-nano-checkbox{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.nanocb.sc-nano-checkbox input.sc-nano-checkbox:focus-visible~.nanocb__input.sc-nano-checkbox{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.nanocb.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox,.nanocb.sc-nano-checkbox input.sc-nano-checkbox:indeterminate~.nanocb__input.sc-nano-checkbox{background-color:var(--active-background)}.nanocb.nanocb--disabled.sc-nano-checkbox{cursor:not-allowed}.sc-nano-checkbox-h:not([hide-label]) .nanocb.sc-nano-checkbox{gap:var(--spacing)}.sc-nano-checkbox-h:not([type=tag]) .nanocb__label--hidden.sc-nano-checkbox,.sc-nano-checkbox-h:not([type=segment]) .nanocb__label--hidden.sc-nano-checkbox{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.nanocb__radio.sc-nano-checkbox .nanocb__input.sc-nano-checkbox,.nanocb__checkbox.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{display:grid;place-content:center center;block-size:1.125em;inline-size:1.125em;border-radius:1px;border:1px solid var(--border-color)}.nanocb__radio.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after,.nanocb__checkbox.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{content:"";grid-column:1;grid-row:1;border:solid var(--active-foreground);border-width:0 0.125em 0.125em 0;opacity:1;transition:scale var(--nano-transition-x-fast) ease-out;transform-origin:center;rotate:45deg;scale:0;inline-size:0.325em;block-size:0.5625em;margin-block-start:-0.1875em}.nanocb--indeterminate.sc-nano-checkbox .nanocb__radio.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after,.nanocb--indeterminate.sc-nano-checkbox .nanocb__checkbox.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{border-width:0 0 0.1875em}.nanocb__radio.sc-nano-checkbox .nanocb__label.sc-nano-checkbox,.nanocb__checkbox.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);color:var(--label-color)}.nanocb__radio.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox::after,.nanocb__checkbox.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox::after{scale:1}.nanocb__radio.sc-nano-checkbox input.sc-nano-checkbox:indeterminate~.nanocb__input.sc-nano-checkbox::after,.nanocb__checkbox.sc-nano-checkbox input.sc-nano-checkbox:indeterminate~.nanocb__input.sc-nano-checkbox::after{scale:1;rotate:0deg;block-size:1px;inline-size:0.625em;border-width:0 0 0.125em;margin-block-start:0}.nanocb__radio.nanocb--invalid.sc-nano-checkbox .nanocb__input.sc-nano-checkbox,.nanocb__checkbox.nanocb--invalid.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{outline:1px solid var(--error-color);outline-offset:1px}.nanocb__radio.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox,.nanocb__checkbox.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{border:1px solid var(--disabled-border-color);background:var(--disabled-background)}.nanocb__radio.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after,.nanocb__checkbox.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{display:none}.nanocb__radio.nanocb--disabled.sc-nano-checkbox .nanocb__label.sc-nano-checkbox,.nanocb__checkbox.nanocb--disabled.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{color:var(--disabled-label-color)}.nanocb__radio.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{border-radius:50%}.nanocb__radio.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{border-radius:50%;background:var(--active-foreground);border:none;margin:0 !important}.nanocb__radio.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox::after{scale:1;opacity:1;block-size:0.5em;inline-size:0.5em}.nanocb__radio.sc-nano-checkbox input.sc-nano-checkbox:indeterminate~.nanocb__input.sc-nano-checkbox{background-color:transparent}.nanocb__radio.sc-nano-checkbox input.sc-nano-checkbox:indeterminate~.nanocb__input.sc-nano-checkbox::after{display:none}.nanocb__switch.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{inline-size:2.1875em;block-size:1.125em;border:1px solid var(--border-color)}.nanocb__switch.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{content:"";position:relative;display:block;border-radius:inherit;block-size:0.75em;inline-size:0.75em;background-color:var(--active-background);transform-origin:left;inset-inline-start:0.125em;inset-block-start:50%;transform:translateY(-50%);transition:0.1s ease scale, 0.1s ease background-color, 0.15s ease left}.nanocb__switch.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox::after{inset-inline-start:1.1875em;transform-origin:right;background-color:var(--active-foreground)}.nanocb__switch.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);color:var(--label-color)}.nanocb__switch.nanocb--invalid.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{outline:1px solid var(--error-color);outline-offset:1px}.nanocb__switch.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{border:1px solid var(--disabled-background);background:var(--disabled-background)}.nanocb__switch.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{background:var(--disabled-foreground)}.nanocb__switch.nanocb--disabled.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{color:var(--disabled-label-color)}[type=segment].sc-nano-checkbox-h{display:inline-block}.nanocb__segment.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{display:none}.nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);color:var(--label-color);padding:0.4375em 0.9375em;border:1px solid var(--active-background)}.sc-nano-checkbox-h:first-of-type .nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{border-inline-end:1px solid var(--nano-color-neutral-300)}.sc-nano-checkbox-h:not(:last-of-type .nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox,.sc-nano-checkbox-h:first-of-type) .nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{border-inline-start:none;border-inline-end:1px solid var(--nano-color-neutral-300)}.sc-nano-checkbox-h:last-of-type .nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{border-inline-start:none;border-inline-end:1px solid var(--active-background) !important}.sc-nano-checkbox-h:first-of-type:last-of-type .nanocb__segment.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{border:1px solid var(--active-background)}.nanocb__segment.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__label.sc-nano-checkbox{color:var(--active-foreground);background-color:var(--active-background);box-shadow:2px 2px 3px 0 rgba(0, 0, 0, 0.2) inset}.nanocb__segment.sc-nano-checkbox input.sc-nano-checkbox:focus-visible:focus~.nanocb__label.sc-nano-checkbox{outline:var(--nano-focus-ring);outline-offset:1px;z-index:1}.nanocb__segment.nanocb--invalid.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{outline:1px solid var(--error-color);outline-offset:1px}.nanocb__segment.nanocb--disabled.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{background-color:var(--disabled-background);color:var(--disabled-label-color)}[type=tag].sc-nano-checkbox-h{display:inline-block}.nanocb__tag.sc-nano-checkbox{display:inline-flex;align-items:center;gap:6px;padding:8px;border:1px solid var(--active-background);color:var(--nano-color-primary-1100);font-size:var(--nano-font-size-2xs);font-weight:bold;transition:background-color var(--nano-transition-x-fast) ease-out}.nanocb__tag.sc-nano-checkbox:hover{background-color:var(--nano-color-primary-100)}.nanocb__tag.sc-nano-checkbox:has(input:checked){background-color:var(--nano-color-primary-300)}.nanocb__tag.sc-nano-checkbox:has(input:focus-visible:focus){outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset);z-index:1}.nanocb__tag.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{order:0;-webkit-user-select:none;user-select:none}.nanocb__tag.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{order:1;display:grid;place-content:center center;block-size:1.125em;inline-size:1.125em;border-radius:1px;border:1px solid var(--border-color);outline:none !important}.nanocb__tag.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{content:"";grid-column:1;grid-row:1;block-size:0;inline-size:0;border:solid var(--active-foreground);border-width:0 0.125em 0.125em 0;opacity:1;transition:scale var(--nano-transition-x-fast) ease-out;transform-origin:center;rotate:45deg;scale:0}.nanocb--indeterminate.sc-nano-checkbox .nanocb__tag.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{border-width:0 0 0.1875em}.nanocb__tag.nanocb--invalid.sc-nano-checkbox{outline:1px solid var(--error-color);outline-offset:1px}.nanocb__tag.nanocb--disabled.sc-nano-checkbox{background:var(--disabled-background);border:1px solid var(--disabled-border-color)}.nanocb__tag.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox{border:1px solid var(--disabled-border-color);background:var(--disabled-background)}.nanocb__tag.nanocb--disabled.sc-nano-checkbox .nanocb__input.sc-nano-checkbox::after{display:none}.nanocb__tag.nanocb--disabled.sc-nano-checkbox .nanocb__label.sc-nano-checkbox{color:var(--disabled-label-color)}.nanocb__tag.sc-nano-checkbox input.sc-nano-checkbox:checked~.nanocb__input.sc-nano-checkbox::after{scale:1;inline-size:0.325em;block-size:0.5625em;margin-block-start:-0.1875em}';export{t as nano_checkbox}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as n,c as o,a,d as e}from"./index-
|
|
4
|
+
import{r as n,c as o,a,d as e}from"./index-DXvE-U_j.js";import{h as t}from"./renderer-BUaAsDso.js";import{a as i}from"./style-BrRDhFfF.js";const r=class{constructor(a){n(this,a),this.nanoToggle=o(this,"nanoToggle",7)}get details(){return this.el.querySelectorAll("nano-details")}get el(){return a(this)}open=!1;nanoToggle;handleOpenChange(){this.details?.forEach((n=>{n.open=!!this.open})),this.nanoToggle.emit(this.open)}handleClick=()=>{this.open=!this.open};componentWillLoad(){i(this.el.shadowRoot)}componentDidLoad(){this.open&&this.details?.forEach((n=>{n.open=!0}))}render(){return t(e,{key:"b522b71cd7f9b9e793f1d1345563ee60b2fd76ed",class:"nano-collapsible-comparison"},t("div",{key:"7a37b4880f5791455f03fb2b0a8b6f5ac1a79a56",class:"collapsible-comparison"},t("div",{key:"2c90c230cd3b2b3417e642a6d31eff6f6920cb04",part:"header"},t("div",{key:"36db63362337181821a7e58cba8fb346909228e7",class:"header"},t("slot",{key:"29b0ca97e9dea363b4b41a5df393051db364f53c",name:"heading"}),t("nano-cta",{key:"33f265d889e154b943d68c7f42eae8056d6f7386",size:"large",icon:this.open?"up":"down",secondary:!0},t("button",{key:"07e6a40182306df742e947ecfbc35ab4f9fe353b",onClick:this.handleClick},this.open?"Hide":"Show"," details")),t("nano-icon-button",{key:"116c3b24bb71628d1a64852699d988cfad57d287",label:(this.open?"Hide":"Show")+" details",onClick:this.handleClick,iconName:"light/chevron-down",class:this.open?"open":""})),t("div",{key:"492b3281c61c49be475483564e9e080d0512fa56",class:"headings"},t("slot",{key:"bb8d6afcb544ea4c9652bf94798c517e2062a2ed",name:"comparison-headings"}))),t("div",{key:"d68d1a90c62bfe70d0e9074e3262c176f066e992",class:"content"},t("slot",{key:"d30b86a902b62d56d56adc92b88f246fe019a3fe",name:"content"}))))}static get watchers(){return{open:["handleOpenChange"]}}};r.style=":host,\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n[hidden] {\n display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n :host,\n *,\n *::before,\n *::after {\n animation-duration: 0.01ms !important;\n animation-iteration-count: 1 !important;\n transition-duration: 0.01ms !important;\n scroll-behavior: auto !important;\n }\n }:host,\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n[hidden] {\n display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n :host,\n *,\n *::before,\n *::after {\n animation-duration: 0.01ms !important;\n animation-iteration-count: 1 !important;\n transition-duration: 0.01ms !important;\n scroll-behavior: auto !important;\n }\n }:host {\n /**\n * @prop --color-bg - Background color of the component. Defaults to var(--nano-color-base-0).\n * @prop --color-border - Border color of the component. Defaults to var(--nano-color-neutral-200).\n * @prop --outer-spacing - Horizontal padding of the component. Defaults to var(--nano-spacing-l1-default).\n */\n}\n:host .collapsible-comparison {\n background-color: var(--color-bg);\n color: var(--nano-color-neutral-1400);\n padding: var(--outer-spacing) 0;\n container-type: inline-size;\n}\n:host .header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-block-end: var(--nano-spacing-xl);\n}\n:host .headings {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: var(--nano-spacing-xl);\n}\n:host nano-icon-button {\n display: none;\n}\n@container (max-width: 400px) {\n :host nano-cta {\n display: none;\n }\n :host nano-icon-button {\n --color: var(--nano-color-primary-1100);\n display: block;\n margin-inline-start: auto;\n font-size: var(--nano-font-size-xl);\n transition: 0.3s ease transform;\n }\n :host nano-icon-button.open {\n transform: rotate(180deg);\n }\n}";export{r as nano_collapsible_comparison}
|
|
@@ -968,10 +968,15 @@
|
|
|
968
968
|
}
|
|
969
969
|
}
|
|
970
970
|
@layer components {
|
|
971
|
-
.nano-theme-dark :where(nano-global-nav, .nano-global-nav)::part(logo),
|
|
971
|
+
.nano-theme-dark :where(nano-global-nav, .nano-global-nav)::part(logo),
|
|
972
|
+
.nano-theme-dark :where(nano-global-nav, .nano-global-nav) [part~=logo],
|
|
973
|
+
:where(nano-global-nav, .nano-global-nav).nano-theme-dark::part(logo),
|
|
974
|
+
:where(nano-global-nav, .nano-global-nav).nano-theme-dark [part~=logo] {
|
|
972
975
|
filter: invert(100%);
|
|
973
976
|
}
|
|
974
|
-
:where(nano-global-nav, .nano-global-nav)
|
|
977
|
+
:where(nano-global-nav, .nano-global-nav) > a,
|
|
978
|
+
:where(nano-global-nav, .nano-global-nav) :where(nano-nav-item, .nano-nav-item)::part(label),
|
|
979
|
+
:where(nano-global-nav, .nano-global-nav) :where(nano-nav-item, .nano-nav-item) [part~=label] {
|
|
975
980
|
white-space: nowrap;
|
|
976
981
|
}
|
|
977
982
|
:where(nano-global-nav, .nano-global-nav).bar-menu nano-nav-item, :where(nano-global-nav, .nano-global-nav).bar-menu > a {
|
|
@@ -983,10 +988,12 @@
|
|
|
983
988
|
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item):active, :where(nano-global-nav, .nano-global-nav).bar-menu > a:active {
|
|
984
989
|
color: var(--main-menu-active-text-color);
|
|
985
990
|
}
|
|
986
|
-
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(trigger),
|
|
991
|
+
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(trigger),
|
|
992
|
+
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item) [part~=trigger] {
|
|
987
993
|
position: relative;
|
|
988
994
|
}
|
|
989
|
-
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(trigger)::before,
|
|
995
|
+
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(trigger)::before,
|
|
996
|
+
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item) [part~=trigger]::before {
|
|
990
997
|
content: "";
|
|
991
998
|
position: absolute;
|
|
992
999
|
background-color: var(--main-menu-active-border-color);
|
|
@@ -1000,7 +1007,7 @@
|
|
|
1000
1007
|
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)[open] {
|
|
1001
1008
|
color: var(--main-menu-active-border-color) !important;
|
|
1002
1009
|
}
|
|
1003
|
-
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)[open]::part(trigger)::before, :where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)[open] [part~=
|
|
1010
|
+
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)[open]::part(trigger)::before, :where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)[open] [part~=trigger]::before {
|
|
1004
1011
|
transform: translateZ(0) scaleX(1);
|
|
1005
1012
|
}
|
|
1006
1013
|
:where(nano-global-nav, .nano-global-nav).bar-menu a.active,
|
|
@@ -1008,7 +1015,7 @@
|
|
|
1008
1015
|
:where(nano-global-nav, .nano-global-nav).bar-menu nano-nav-item[selected] {
|
|
1009
1016
|
color: var(--main-menu-active-text-color) !important;
|
|
1010
1017
|
}
|
|
1011
|
-
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(modal)
|
|
1018
|
+
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(modal) {
|
|
1012
1019
|
inset-block-start: -500%;
|
|
1013
1020
|
inline-size: 100%;
|
|
1014
1021
|
position: absolute;
|
|
@@ -1016,10 +1023,10 @@
|
|
|
1016
1023
|
inset-inline: 0;
|
|
1017
1024
|
transition: inset-block-start var(--nano-transition-fast) ease-in-out, opacity var(--nano-transition-x-fast) ease;
|
|
1018
1025
|
}
|
|
1019
|
-
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(modal modal--open)
|
|
1026
|
+
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(modal modal--open) {
|
|
1020
1027
|
inset-block-start: 100%;
|
|
1021
1028
|
}
|
|
1022
|
-
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(modal-content)
|
|
1029
|
+
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(modal-content) {
|
|
1023
1030
|
background: var(--nano-color-base-0);
|
|
1024
1031
|
color: var(--nano-color-base-1000);
|
|
1025
1032
|
padding: var(--nano-spacing-xl);
|
|
@@ -1028,7 +1035,8 @@
|
|
|
1028
1035
|
margin: auto;
|
|
1029
1036
|
box-shadow: var(--nano-shadow-l2);
|
|
1030
1037
|
}
|
|
1031
|
-
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(modal-mask),
|
|
1038
|
+
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item)::part(modal-mask),
|
|
1039
|
+
:where(nano-global-nav, .nano-global-nav).bar-menu :where(nano-nav-item, .nano-nav-item) [part~=modal-mask] {
|
|
1032
1040
|
background: var(--nano-overlay-background-color);
|
|
1033
1041
|
position: fixed;
|
|
1034
1042
|
inset: 0;
|
|
@@ -1124,7 +1132,7 @@
|
|
|
1124
1132
|
:where(nano-global-nav, .nano-global-nav).overflow-menu :where(nano-nav-item, .nano-nav-item)[selected] {
|
|
1125
1133
|
color: var(--overflow-active-text-color) !important;
|
|
1126
1134
|
}
|
|
1127
|
-
:where(nano-global-nav, .nano-global-nav).overflow-menu :where(nano-nav-item, .nano-nav-item)::part(modal)
|
|
1135
|
+
:where(nano-global-nav, .nano-global-nav).overflow-menu :where(nano-nav-item, .nano-nav-item)::part(modal) {
|
|
1128
1136
|
background-color: var(--overflow-bg-color);
|
|
1129
1137
|
inline-size: 100%;
|
|
1130
1138
|
block-size: 100%;
|
|
@@ -1307,7 +1315,10 @@
|
|
|
1307
1315
|
:where(nano-in-page-nav, .nano-in-page-nav) ul > li > nano-details > ul:has(nano-details) {
|
|
1308
1316
|
padding-inline-start: 1.1rem;
|
|
1309
1317
|
}
|
|
1310
|
-
:where(nano-in-page-nav, .nano-in-page-nav) ul > li > ul nano-details::part(header),
|
|
1318
|
+
:where(nano-in-page-nav, .nano-in-page-nav) ul > li > ul nano-details::part(header),
|
|
1319
|
+
:where(nano-in-page-nav, .nano-in-page-nav) ul > li > ul nano-details [part~=header],
|
|
1320
|
+
:where(nano-in-page-nav, .nano-in-page-nav) ul > li > nano-details > ul nano-details::part(header),
|
|
1321
|
+
:where(nano-in-page-nav, .nano-in-page-nav) ul > li > nano-details > ul nano-details [part~=header] {
|
|
1311
1322
|
padding: 0;
|
|
1312
1323
|
}
|
|
1313
1324
|
:where(nano-in-page-nav, .nano-in-page-nav) ul > li > ul > li > nano-details > ul,
|
|
@@ -1324,7 +1335,8 @@
|
|
|
1324
1335
|
--btn-bg-color--hover: transparent;
|
|
1325
1336
|
border: none;
|
|
1326
1337
|
}
|
|
1327
|
-
:where(nano-in-page-nav, .nano-in-page-nav) nano-details .active::part(header),
|
|
1338
|
+
:where(nano-in-page-nav, .nano-in-page-nav) nano-details .active::part(header),
|
|
1339
|
+
:where(nano-in-page-nav, .nano-in-page-nav) nano-details .active [part~=header] {
|
|
1328
1340
|
border-inline-start: var(--border-active);
|
|
1329
1341
|
padding-inline-start: 1rem;
|
|
1330
1342
|
color: var(--color-primary);
|
|
@@ -1332,31 +1344,32 @@
|
|
|
1332
1344
|
:where(nano-in-page-nav, .nano-in-page-nav) nano-details[open] > [slot=icon-start] {
|
|
1333
1345
|
rotate: 90deg;
|
|
1334
1346
|
}
|
|
1335
|
-
:where(nano-in-page-nav, .nano-in-page-nav) nano-details::part(content), :where(nano-in-page-nav, .nano-in-page-nav) nano-details [part~=
|
|
1347
|
+
:where(nano-in-page-nav, .nano-in-page-nav) nano-details::part(content), :where(nano-in-page-nav, .nano-in-page-nav) nano-details [part~=content] {
|
|
1336
1348
|
padding: 0;
|
|
1337
1349
|
}
|
|
1338
|
-
:where(nano-in-page-nav, .nano-in-page-nav) nano-details::part(icon--start), :where(nano-in-page-nav, .nano-in-page-nav) nano-details [part~=
|
|
1350
|
+
:where(nano-in-page-nav, .nano-in-page-nav) nano-details::part(icon--start), :where(nano-in-page-nav, .nano-in-page-nav) nano-details [part~=icon--start] {
|
|
1339
1351
|
margin-inline-end: var(--spacing-l3);
|
|
1340
1352
|
}
|
|
1341
|
-
:where(nano-in-page-nav, .nano-in-page-nav) nano-details::part(header), :where(nano-in-page-nav, .nano-in-page-nav) nano-details [part~=
|
|
1353
|
+
:where(nano-in-page-nav, .nano-in-page-nav) nano-details::part(header), :where(nano-in-page-nav, .nano-in-page-nav) nano-details [part~=header] {
|
|
1342
1354
|
font-size: var(--font-size);
|
|
1343
1355
|
line-height: var(--line-height);
|
|
1344
1356
|
font-weight: var(--font-weight);
|
|
1345
1357
|
letter-spacing: var(--letter-spacing);
|
|
1346
1358
|
}
|
|
1347
|
-
:where(nano-in-page-nav, .nano-in-page-nav) nano-details::part(header):hover, :where(nano-in-page-nav, .nano-in-page-nav) nano-details [part~=
|
|
1359
|
+
:where(nano-in-page-nav, .nano-in-page-nav) nano-details::part(header):hover, :where(nano-in-page-nav, .nano-in-page-nav) nano-details [part~=header]:hover {
|
|
1348
1360
|
text-decoration: underline;
|
|
1349
1361
|
}
|
|
1350
1362
|
:where(nano-in-page-nav, .nano-in-page-nav) .details-wrapper {
|
|
1351
1363
|
--btn-text-color: var(--color-text);
|
|
1352
1364
|
}
|
|
1353
|
-
:where(nano-in-page-nav, .nano-in-page-nav) .details-wrapper::part(header), :where(nano-in-page-nav, .nano-in-page-nav) .details-wrapper [part~=
|
|
1365
|
+
:where(nano-in-page-nav, .nano-in-page-nav) .details-wrapper::part(header), :where(nano-in-page-nav, .nano-in-page-nav) .details-wrapper [part~=header] {
|
|
1354
1366
|
padding: var(--spacing-l2);
|
|
1355
1367
|
}
|
|
1356
|
-
:where(nano-in-page-nav, .nano-in-page-nav):has(.details-wrapper[open])::part(root), :where(nano-in-page-nav, .nano-in-page-nav):has(.details-wrapper[open]) [part~=
|
|
1368
|
+
:where(nano-in-page-nav, .nano-in-page-nav):has(.details-wrapper[open])::part(root), :where(nano-in-page-nav, .nano-in-page-nav):has(.details-wrapper[open]) [part~=root] {
|
|
1357
1369
|
box-shadow: var(--nano-shadow-l1);
|
|
1358
1370
|
}
|
|
1359
|
-
:where(nano-in-page-nav, .nano-in-page-nav) .details-wrapper.sticky.stuck[open]::part(header),
|
|
1371
|
+
:where(nano-in-page-nav, .nano-in-page-nav) .details-wrapper.sticky.stuck[open]::part(header),
|
|
1372
|
+
:where(nano-in-page-nav, .nano-in-page-nav) .details-wrapper.sticky.stuck [part~=header] {
|
|
1360
1373
|
z-index: var(--nano-z-index-menubar);
|
|
1361
1374
|
inset-block-start: 0;
|
|
1362
1375
|
position: sticky;
|
|
@@ -1415,21 +1428,21 @@
|
|
|
1415
1428
|
--padding: 0;
|
|
1416
1429
|
border: none;
|
|
1417
1430
|
}
|
|
1418
|
-
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(header), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=
|
|
1431
|
+
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(header), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=header] {
|
|
1419
1432
|
color: var(--color-primary);
|
|
1420
1433
|
}
|
|
1421
|
-
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(label), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=
|
|
1434
|
+
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(label), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=label], :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(content), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=content] {
|
|
1422
1435
|
display: grid;
|
|
1423
1436
|
grid-template-columns: 1fr 1fr;
|
|
1424
1437
|
gap: var(--nano-spacing-l1-default);
|
|
1425
1438
|
}
|
|
1426
|
-
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(icon--end), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=
|
|
1439
|
+
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(icon--end), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=icon--end] {
|
|
1427
1440
|
display: none;
|
|
1428
1441
|
}
|
|
1429
|
-
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(content), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=
|
|
1442
|
+
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(content), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=content] {
|
|
1430
1443
|
padding: var(--nano-spacing-md) 0;
|
|
1431
1444
|
}
|
|
1432
|
-
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(body), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=
|
|
1445
|
+
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(body), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=body] {
|
|
1433
1446
|
border-block-end: 1px solid var(--color-border);
|
|
1434
1447
|
}
|
|
1435
1448
|
:where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details ul {
|
|
@@ -1449,12 +1462,12 @@
|
|
|
1449
1462
|
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item):not(:has(+ nano-nav-item), :has(+ nano-dropdown), :has(+ nano-content-links)) {
|
|
1450
1463
|
border-block-end: 1px solid var(--nano-color-neutral-200);
|
|
1451
1464
|
}
|
|
1452
|
-
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger)
|
|
1465
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger) {
|
|
1453
1466
|
font-size: var(--nano-font-size-small);
|
|
1454
1467
|
line-height: var(--nano-line-height-normal);
|
|
1455
1468
|
letter-spacing: var(--nano-letter-spacing-loose);
|
|
1456
1469
|
}
|
|
1457
|
-
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)[checkbox]::part(label)::before
|
|
1470
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)[checkbox]::part(label)::before {
|
|
1458
1471
|
content: "";
|
|
1459
1472
|
display: inline-block;
|
|
1460
1473
|
vertical-align: middle;
|
|
@@ -1472,7 +1485,7 @@
|
|
|
1472
1485
|
margin-inline-end: var(--nano-spacing-sm);
|
|
1473
1486
|
align-content: center;
|
|
1474
1487
|
}
|
|
1475
|
-
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)[checkbox][selected]::part(label)::before
|
|
1488
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)[checkbox][selected]::part(label)::before {
|
|
1476
1489
|
opacity: 1;
|
|
1477
1490
|
}
|
|
1478
1491
|
:where(nano-menu, .nano-menu) a {
|
|
@@ -1482,28 +1495,38 @@
|
|
|
1482
1495
|
:where(nano-menu, .nano-menu) :where(nano-icon, .nano-icon) {
|
|
1483
1496
|
color: var(--icon-color);
|
|
1484
1497
|
}
|
|
1485
|
-
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger),
|
|
1498
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger),
|
|
1499
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item) [slot=close-button],
|
|
1500
|
+
:where(nano-menu, .nano-menu) nano-content-links a {
|
|
1486
1501
|
--icon-color: var(--nano-color-primary-1000);
|
|
1487
1502
|
color: var(--nano-color-neutral-1400);
|
|
1488
1503
|
font-size: var(--font-size);
|
|
1489
1504
|
}
|
|
1490
|
-
:where(nano-menu, .nano-menu) :
|
|
1505
|
+
:where(nano-menu, .nano-menu) a:hover:not(:focus-visible),
|
|
1506
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item):not([disabled]) [slot=close-button]:hover:not(:focus-visible),
|
|
1507
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item):not([disabled])::part(trigger):hover:not(:focus-visible) {
|
|
1491
1508
|
--icon-color: var(--nano-color-primary-1100);
|
|
1492
1509
|
color: var(--nano-color-base-1000);
|
|
1493
1510
|
background-color: var(--nano-color-neutral-100);
|
|
1494
1511
|
}
|
|
1495
|
-
:where(nano-menu, .nano-menu) :
|
|
1512
|
+
:where(nano-menu, .nano-menu) a:active:not(:focus-visible),
|
|
1513
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item):not([disabled]) [slot=close-button]:active:not(:focus-visible),
|
|
1514
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item):not([disabled])::part(trigger):active:not(:focus-visible) {
|
|
1496
1515
|
--icon-color: var(--nano-color-primary-800);
|
|
1497
1516
|
color: var(--nano-color-base-1000);
|
|
1498
1517
|
background-color: var(--nano-color-neutral-200);
|
|
1499
1518
|
}
|
|
1500
|
-
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)
|
|
1519
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item) [slot=close-button]:focus-visible,
|
|
1520
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger):focus-visible,
|
|
1521
|
+
:where(nano-menu, .nano-menu) a:focus-visible {
|
|
1501
1522
|
--icon-color: var(--nano-color-base-0);
|
|
1502
1523
|
outline: none;
|
|
1503
1524
|
background-color: var(--nano-color-primary-1000);
|
|
1504
1525
|
color: var(--nano-color-base-0);
|
|
1505
1526
|
}
|
|
1506
|
-
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)
|
|
1527
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item) [slot=close-button]:focus-visible:active,
|
|
1528
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger):focus-visible:active,
|
|
1529
|
+
:where(nano-menu, .nano-menu) a:focus-visible:active {
|
|
1507
1530
|
background-color: var(--nano-color-primary-1200);
|
|
1508
1531
|
}
|
|
1509
1532
|
:where(nano-menu, .nano-menu) nano-content-links a::after {
|
|
@@ -1515,7 +1538,7 @@
|
|
|
1515
1538
|
:where(nano-menu, .nano-menu) :where(nano-dropdown, .nano-dropdown) :where(nano-nav-item, .nano-nav-item) {
|
|
1516
1539
|
--padding: var(--nav-item-padding);
|
|
1517
1540
|
}
|
|
1518
|
-
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(modal)
|
|
1541
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(modal) {
|
|
1519
1542
|
position: absolute;
|
|
1520
1543
|
min-block-size: 100%;
|
|
1521
1544
|
inset-block-start: 0;
|
|
@@ -1527,7 +1550,7 @@
|
|
|
1527
1550
|
transform: translate3d(100%, 0, 0);
|
|
1528
1551
|
background: var(--background);
|
|
1529
1552
|
}
|
|
1530
|
-
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(modal modal--open)
|
|
1553
|
+
:where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(modal modal--open) {
|
|
1531
1554
|
opacity: 1;
|
|
1532
1555
|
transform: translate3d(0, 0, 0);
|
|
1533
1556
|
transition: opacity var(--nano-transition-x-fast) ease, transform var(--nano-transition-fast) ease;
|
|
@@ -1576,8 +1599,8 @@
|
|
|
1576
1599
|
nano-icon-item:has([slot=icon]):has([slot=heading]):has([slot=content]) {
|
|
1577
1600
|
grid-template-rows: repeat(3, min-content);
|
|
1578
1601
|
}
|
|
1579
|
-
nano-icon-item nano-icon {
|
|
1580
|
-
--icon-size: var(--icon-dims);
|
|
1602
|
+
nano-icon-item nano-icon, nano-icon-item .nano-icon {
|
|
1603
|
+
--icon-size: var(--icon-dims) !important;
|
|
1581
1604
|
}
|
|
1582
1605
|
nano-icon-item a:not(p > a),
|
|
1583
1606
|
nano-icon-item [slot=heading] {
|
|
@@ -1670,10 +1693,12 @@
|
|
|
1670
1693
|
border-block-end: none;
|
|
1671
1694
|
border-inline-end: var(--border);
|
|
1672
1695
|
}
|
|
1673
|
-
:where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab::part(base),
|
|
1696
|
+
:where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab::part(base),
|
|
1697
|
+
:where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab [part~=base] {
|
|
1674
1698
|
justify-content: end;
|
|
1675
1699
|
}
|
|
1676
|
-
:where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab::part(label),
|
|
1700
|
+
:where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab::part(label),
|
|
1701
|
+
:where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab [part~=label] {
|
|
1677
1702
|
align-items: flex-end;
|
|
1678
1703
|
}
|
|
1679
1704
|
:where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab:not([disabled]):hover {
|
|
@@ -1682,7 +1707,7 @@
|
|
|
1682
1707
|
:where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab:not([disabled])[active] {
|
|
1683
1708
|
border-color: inherit;
|
|
1684
1709
|
}
|
|
1685
|
-
:where(nano-tab-group, .nano-tab-group)[placement=top][size=large]::part(tabs__wrapper), :where(nano-tab-group, .nano-tab-group)[placement=top][size=large] [part~=
|
|
1710
|
+
:where(nano-tab-group, .nano-tab-group)[placement=top][size=large]::part(tabs__wrapper), :where(nano-tab-group, .nano-tab-group)[placement=top][size=large] [part~=tabs__wrapper] {
|
|
1686
1711
|
--scroll-btn-size: 2rem;
|
|
1687
1712
|
}
|
|
1688
1713
|
:where(nano-tab-group, .nano-tab-group)[placement=top][size=large] .nano-tab {
|
|
@@ -1928,7 +1953,6 @@
|
|
|
1928
1953
|
nano-badge,
|
|
1929
1954
|
nano-avatar,
|
|
1930
1955
|
nano-icon-item,
|
|
1931
|
-
nano-masked-overflow,
|
|
1932
1956
|
nano-table {
|
|
1933
1957
|
visibility: visible !important;
|
|
1934
1958
|
}
|
|
@@ -1940,6 +1964,7 @@
|
|
|
1940
1964
|
body:not(.nano-eager) nano-accordion,
|
|
1941
1965
|
body:not(.nano-eager) nano-grid-item,
|
|
1942
1966
|
body:not(.nano-eager) nano-menu,
|
|
1967
|
+
body:not(.nano-eager) nano-masked-overflow,
|
|
1943
1968
|
body:not(.nano-eager) nano-range,
|
|
1944
1969
|
body:not(.nano-eager) nano-rating,
|
|
1945
1970
|
body:not(.nano-eager) nano-slide,
|