@nanoporetech-digital/components 8.5.6 → 8.5.7
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/nano-in-page-nav.cjs.entry.js +1 -1
- package/dist/cjs/nano-tab.cjs.entry.js +1 -1
- package/dist/collection/components/breadcrumb/breadcrumb.js +1 -1
- package/dist/collection/components/in-page-nav/in-page-nav.css +11 -14
- package/dist/collection/components/tabs/tab.css +1 -1
- package/dist/components/nano-in-page-nav.js +1 -1
- package/dist/components/nano-tab.js +1 -1
- package/dist/esm/nano-in-page-nav.entry.js +1 -1
- package/dist/esm/nano-tab.entry.js +1 -1
- package/dist/nano-components/nano-components.css +6 -27
- package/dist/nano-components/nano-in-page-nav.entry.js +1 -1
- package/dist/nano-components/nano-tab.entry.js +1 -1
- package/dist/style/components.css +1 -1
- package/dist/style/components.css.map +1 -1
- package/dist/style/nano.css +1 -1
- package/dist/style/nano.css.map +1 -1
- package/docs-json.json +2 -2
- package/hydrate/index.js +2 -2
- package/hydrate/index.mjs +2 -2
- package/package.json +2 -2
- /package/dist/types/builds/{sN_eAsgS → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/generate-vue-component.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/index.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/output-vue.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/plugin.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/types.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/utils.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/stencil.config.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/stencil.config.prod.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/testing/mocks/intersection-observer.d.ts +0 -0
- /package/dist/types/builds/{sN_eAsgS → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/wdio.conf.d.ts +0 -0
|
@@ -9,7 +9,7 @@ var slot = require('./slot-CJgcluNw.js');
|
|
|
9
9
|
var dom = require('./dom-Dxk5vXYq.js');
|
|
10
10
|
var scroll = require('./scroll-C6pO9RvO.js');
|
|
11
11
|
|
|
12
|
-
const inPageNavCss = ":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:block}:host(.external-links){--color-bg:var(--nano-color-base-0) !important}.desktop-nav{display:block}@media (width <= 730px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 730px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:\"\";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper
|
|
12
|
+
const inPageNavCss = ":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:block}:host(.external-links){--color-bg:var(--nano-color-base-0) !important}:host(.external-links) .nano-details{--border-active:3px solid var(--nano-color-neutral-1200) !important}:host(.external-links) nav{border-block:1px solid var(--nano-color-neutral-200)}.desktop-nav{display:block}@media (width <= 730px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 730px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}@media (width <= 730px){nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:\"\";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper a,.details-wrapper ul,.details-wrapper li{all:unset}.details-wrapper ul{display:flex;flex-direction:column;list-style:none}.details-wrapper ul:not(ul ul){padding:0 var(--spacing-l2) 0 var(--spacing-l2)}.details-wrapper a{cursor:pointer}.details-wrapper a:hover{text-decoration:underline}.details-wrapper a:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.details-wrapper ul>li:not(ul>li li){margin:0;padding:var(--spacing-l2) 0;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;inline-size:100%}.details-wrapper ul>li:not(ul>li li):not(:last-of-type){border-block-end:1px solid var(--color-bottom-border)}.details-wrapper ul>li:not(ul>li li) a{color:var(--color-text)}.details-wrapper ul>li:not(ul>li li) a.is-active{border-inline-start:var(--border-active);padding-inline-start:1rem;display:block}.details-wrapper ul>li:not(ul>li li) a:hover{color:var(--color-text-hover)}.details-wrapper ul>li>ul,.details-wrapper ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--spacing-l2);gap:var(--list-gap)}.details-wrapper ul>li>ul a,.details-wrapper ul>li>.nano-details>ul a{color:var(--color-primary) !important}.details-wrapper ul>li>ul>li>.nano-details>ul,.details-wrapper ul>li>.nano-details>ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--nano-spacing-xl)}.details-wrapper .nano-details .nano-details:not(.nano-details .nano-details .nano-details){color:var(--color-text)}.details-wrapper .nano-details{--padding:0;--btn-bg-color:transparent;--btn-bg-color--open:var(--nano-color-primary-75);--btn-bg-color--hover:transparent;border:none;color:var(--color-primary)}.details-wrapper .nano-details .is-active::part(header){border-inline-start:var(--border-active);padding-inline-start:1rem !important;color:var(--color-primary)}.details-wrapper .nano-details[open]>[slot=icon-start]{rotate:90deg}.details-wrapper .nano-details::part(icon--start){margin-inline-end:var(--spacing-l3)}.details-wrapper .nano-details::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing)}.details-wrapper .nano-details::part(header):hover{text-decoration:underline}.details-wrapper .nano-details:not(.nav-details){color:var(--color-primary)}";
|
|
13
13
|
|
|
14
14
|
const NanoInPageNav = class {
|
|
15
15
|
constructor(hostRef) {
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
var index = require('./index-DGttnXif.js');
|
|
7
7
|
var renderer = require('./renderer-B9M1kXq8.js');
|
|
8
8
|
|
|
9
|
-
const tabCss = ":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{--border:2px solid var(--nano-color-neutral-300);--border-hover-color:var(--nano-color-primary-700);--border-active-color:var(--nano-color-primary-1000);--text-hover-color:var(--nano-color-primary-1000);--text-active-color:var(--nano-color-primary-
|
|
9
|
+
const tabCss = ":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{--border:2px solid var(--nano-color-neutral-300);--border-hover-color:var(--nano-color-primary-700);--border-active-color:var(--nano-color-primary-1000);--text-hover-color:var(--nano-color-primary-1000);--text-active-color:var(--nano-color-primary-1100);--padding:var(--nano-spacing-md);font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);display:inline-block;cursor:pointer;color:var(--nano-color-neutral-1400);border:var(--border);border-inline-end-width:0;border-inline-start-width:0;border-block-start-width:0;border-block-end:var(--border)}:host(:not([disabled]):hover){border-color:var(--border-hover-color);color:var(--text-hover-color)}:host(:not([disabled]):active),:host([active]){border-color:var(--border-active-color);color:var(--text-active-color)}:host(.nano-sortable__dragged){background:var(--nano-color-base-0);opacity:0.9 !important;box-shadow:var(--nano-shadow-l0) !important}.tab{padding:var(--padding);display:flex;white-space:nowrap;align-items:center;position:relative;gap:var(--nano-spacing-sm);justify-content:center}.tab.tab--disabled{opacity:0.5;cursor:not-allowed}.tab.tab--closable{padding-inline-end:calc(var(--padding) - var(--nano-spacing-sm))}.tab ::slotted(*),.tab::slotted(*){display:flex;align-items:center}.tab ::slotted(.nano-sortable__keyboard-handle){position:absolute;inset-inline-end:-1em;z-index:1}.tab:not(.tab--disabled):has(.tab__label:focus-visible){outline:var(--nano-focus-ring);outline-offset:-3px}.tab__label{display:flex;flex-direction:column;gap:var(--nano-spacing-sm);align-items:center}.tab__label:focus{outline:none}.tab__close-button{color:var(--nano-color-primary-1200);--hover-color:var(--nano-color-primary-700)}";
|
|
10
10
|
|
|
11
11
|
let id = 0;
|
|
12
12
|
const NanoTab = class {
|
|
@@ -89,7 +89,7 @@ export class NanoBreadcrumb {
|
|
|
89
89
|
"references": {
|
|
90
90
|
"Breadcrumb": {
|
|
91
91
|
"location": "local",
|
|
92
|
-
"path": "/builds/
|
|
92
|
+
"path": "/builds/uSGJX_GU/0/Digital/nano-components/packages/components/src/components/breadcrumb/breadcrumb.tsx",
|
|
93
93
|
"id": "src/components/breadcrumb/breadcrumb.tsx::Breadcrumb"
|
|
94
94
|
}
|
|
95
95
|
}
|
|
@@ -56,6 +56,12 @@
|
|
|
56
56
|
:host(.external-links) {
|
|
57
57
|
--color-bg: var(--nano-color-base-0) !important;
|
|
58
58
|
}
|
|
59
|
+
:host(.external-links) .nano-details {
|
|
60
|
+
--border-active: 3px solid var(--nano-color-neutral-1200) !important;
|
|
61
|
+
}
|
|
62
|
+
:host(.external-links) nav {
|
|
63
|
+
border-block: 1px solid var(--nano-color-neutral-200);
|
|
64
|
+
}
|
|
59
65
|
|
|
60
66
|
.desktop-nav {
|
|
61
67
|
display: block;
|
|
@@ -79,8 +85,10 @@ nav {
|
|
|
79
85
|
background-color: var(--color-bg);
|
|
80
86
|
padding: 0;
|
|
81
87
|
}
|
|
82
|
-
|
|
83
|
-
|
|
88
|
+
@media (width <= 730px) {
|
|
89
|
+
nav:has(.details-wrapper[open]) {
|
|
90
|
+
box-shadow: var(--nano-shadow-l1);
|
|
91
|
+
}
|
|
84
92
|
}
|
|
85
93
|
|
|
86
94
|
.header {
|
|
@@ -145,18 +153,6 @@ nav:has(.details-wrapper[open]) {
|
|
|
145
153
|
box-shadow: var(--nano-shadow-l1);
|
|
146
154
|
padding: var(--spacing-l2);
|
|
147
155
|
}
|
|
148
|
-
.details-wrapper :host(.external-links),
|
|
149
|
-
.details-wrapper .external-links {
|
|
150
|
-
--color-bg: var(--nano-color-base-0) !important;
|
|
151
|
-
}
|
|
152
|
-
.details-wrapper :host(.external-links) nav,
|
|
153
|
-
.details-wrapper .external-links nav {
|
|
154
|
-
border-block: 1px solid var(--nano-color-neutral-200);
|
|
155
|
-
}
|
|
156
|
-
.details-wrapper :host(.external-links) ul ul,
|
|
157
|
-
.details-wrapper .external-links ul ul {
|
|
158
|
-
--color-border-active: var(--nano-color-neutral-1200) !important;
|
|
159
|
-
}
|
|
160
156
|
.details-wrapper a,
|
|
161
157
|
.details-wrapper ul,
|
|
162
158
|
.details-wrapper li {
|
|
@@ -198,6 +194,7 @@ nav:has(.details-wrapper[open]) {
|
|
|
198
194
|
.details-wrapper ul > li:not(ul > li li) a.is-active {
|
|
199
195
|
border-inline-start: var(--border-active);
|
|
200
196
|
padding-inline-start: 1rem;
|
|
197
|
+
display: block;
|
|
201
198
|
}
|
|
202
199
|
.details-wrapper ul > li:not(ul > li li) a:hover {
|
|
203
200
|
color: var(--color-text-hover);
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
--border-hover-color: var(--nano-color-primary-700);
|
|
51
51
|
--border-active-color: var(--nano-color-primary-1000);
|
|
52
52
|
--text-hover-color: var(--nano-color-primary-1000);
|
|
53
|
-
--text-active-color: var(--nano-color-primary-
|
|
53
|
+
--text-active-color: var(--nano-color-primary-1100);
|
|
54
54
|
--padding: var(--nano-spacing-md);
|
|
55
55
|
font-size: var(--nano-font-size-sm);
|
|
56
56
|
line-height: var(--nano-line-height-normal);
|
|
@@ -9,7 +9,7 @@ import { f as findScrollParent } from './scroll.js';
|
|
|
9
9
|
import { d as defineCustomElement$3 } from './details.js';
|
|
10
10
|
import { d as defineCustomElement$2 } from './icon.js';
|
|
11
11
|
|
|
12
|
-
const inPageNavCss = ":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:block}:host(.external-links){--color-bg:var(--nano-color-base-0) !important}.desktop-nav{display:block}@media (width <= 730px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 730px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:\"\";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper
|
|
12
|
+
const inPageNavCss = ":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:block}:host(.external-links){--color-bg:var(--nano-color-base-0) !important}:host(.external-links) .nano-details{--border-active:3px solid var(--nano-color-neutral-1200) !important}:host(.external-links) nav{border-block:1px solid var(--nano-color-neutral-200)}.desktop-nav{display:block}@media (width <= 730px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 730px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}@media (width <= 730px){nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:\"\";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper a,.details-wrapper ul,.details-wrapper li{all:unset}.details-wrapper ul{display:flex;flex-direction:column;list-style:none}.details-wrapper ul:not(ul ul){padding:0 var(--spacing-l2) 0 var(--spacing-l2)}.details-wrapper a{cursor:pointer}.details-wrapper a:hover{text-decoration:underline}.details-wrapper a:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.details-wrapper ul>li:not(ul>li li){margin:0;padding:var(--spacing-l2) 0;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;inline-size:100%}.details-wrapper ul>li:not(ul>li li):not(:last-of-type){border-block-end:1px solid var(--color-bottom-border)}.details-wrapper ul>li:not(ul>li li) a{color:var(--color-text)}.details-wrapper ul>li:not(ul>li li) a.is-active{border-inline-start:var(--border-active);padding-inline-start:1rem;display:block}.details-wrapper ul>li:not(ul>li li) a:hover{color:var(--color-text-hover)}.details-wrapper ul>li>ul,.details-wrapper ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--spacing-l2);gap:var(--list-gap)}.details-wrapper ul>li>ul a,.details-wrapper ul>li>.nano-details>ul a{color:var(--color-primary) !important}.details-wrapper ul>li>ul>li>.nano-details>ul,.details-wrapper ul>li>.nano-details>ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--nano-spacing-xl)}.details-wrapper .nano-details .nano-details:not(.nano-details .nano-details .nano-details){color:var(--color-text)}.details-wrapper .nano-details{--padding:0;--btn-bg-color:transparent;--btn-bg-color--open:var(--nano-color-primary-75);--btn-bg-color--hover:transparent;border:none;color:var(--color-primary)}.details-wrapper .nano-details .is-active::part(header){border-inline-start:var(--border-active);padding-inline-start:1rem !important;color:var(--color-primary)}.details-wrapper .nano-details[open]>[slot=icon-start]{rotate:90deg}.details-wrapper .nano-details::part(icon--start){margin-inline-end:var(--spacing-l3)}.details-wrapper .nano-details::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing)}.details-wrapper .nano-details::part(header):hover{text-decoration:underline}.details-wrapper .nano-details:not(.nav-details){color:var(--color-primary)}";
|
|
13
13
|
|
|
14
14
|
const NanoInPageNav$1 = /*@__PURE__*/ proxyCustomElement(class NanoInPageNav extends HTMLElement {
|
|
15
15
|
constructor() {
|
|
@@ -7,7 +7,7 @@ import { d as defineCustomElement$4 } from './icon.js';
|
|
|
7
7
|
import { d as defineCustomElement$3 } from './icon-button.js';
|
|
8
8
|
import { d as defineCustomElement$2 } from './tooltip.js';
|
|
9
9
|
|
|
10
|
-
const tabCss = ":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{--border:2px solid var(--nano-color-neutral-300);--border-hover-color:var(--nano-color-primary-700);--border-active-color:var(--nano-color-primary-1000);--text-hover-color:var(--nano-color-primary-1000);--text-active-color:var(--nano-color-primary-
|
|
10
|
+
const tabCss = ":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{--border:2px solid var(--nano-color-neutral-300);--border-hover-color:var(--nano-color-primary-700);--border-active-color:var(--nano-color-primary-1000);--text-hover-color:var(--nano-color-primary-1000);--text-active-color:var(--nano-color-primary-1100);--padding:var(--nano-spacing-md);font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);display:inline-block;cursor:pointer;color:var(--nano-color-neutral-1400);border:var(--border);border-inline-end-width:0;border-inline-start-width:0;border-block-start-width:0;border-block-end:var(--border)}:host(:not([disabled]):hover){border-color:var(--border-hover-color);color:var(--text-hover-color)}:host(:not([disabled]):active),:host([active]){border-color:var(--border-active-color);color:var(--text-active-color)}:host(.nano-sortable__dragged){background:var(--nano-color-base-0);opacity:0.9 !important;box-shadow:var(--nano-shadow-l0) !important}.tab{padding:var(--padding);display:flex;white-space:nowrap;align-items:center;position:relative;gap:var(--nano-spacing-sm);justify-content:center}.tab.tab--disabled{opacity:0.5;cursor:not-allowed}.tab.tab--closable{padding-inline-end:calc(var(--padding) - var(--nano-spacing-sm))}.tab ::slotted(*),.tab::slotted(*){display:flex;align-items:center}.tab ::slotted(.nano-sortable__keyboard-handle){position:absolute;inset-inline-end:-1em;z-index:1}.tab:not(.tab--disabled):has(.tab__label:focus-visible){outline:var(--nano-focus-ring);outline-offset:-3px}.tab__label{display:flex;flex-direction:column;gap:var(--nano-spacing-sm);align-items:center}.tab__label:focus{outline:none}.tab__close-button{color:var(--nano-color-primary-1200);--hover-color:var(--nano-color-primary-700)}";
|
|
11
11
|
|
|
12
12
|
let id = 0;
|
|
13
13
|
const NanoTab$1 = /*@__PURE__*/ proxyCustomElement(class NanoTab extends HTMLElement {
|
|
@@ -7,7 +7,7 @@ import { H as HasSlotController } from './slot-CFTP7C_Z.js';
|
|
|
7
7
|
import { g as getDirectChildren } from './dom-dlicJTEJ.js';
|
|
8
8
|
import { f as findScrollParent } from './scroll-1nFw8CNk.js';
|
|
9
9
|
|
|
10
|
-
const inPageNavCss = ":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:block}:host(.external-links){--color-bg:var(--nano-color-base-0) !important}.desktop-nav{display:block}@media (width <= 730px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 730px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:\"\";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper
|
|
10
|
+
const inPageNavCss = ":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:block}:host(.external-links){--color-bg:var(--nano-color-base-0) !important}:host(.external-links) .nano-details{--border-active:3px solid var(--nano-color-neutral-1200) !important}:host(.external-links) nav{border-block:1px solid var(--nano-color-neutral-200)}.desktop-nav{display:block}@media (width <= 730px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 730px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}@media (width <= 730px){nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:\"\";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper a,.details-wrapper ul,.details-wrapper li{all:unset}.details-wrapper ul{display:flex;flex-direction:column;list-style:none}.details-wrapper ul:not(ul ul){padding:0 var(--spacing-l2) 0 var(--spacing-l2)}.details-wrapper a{cursor:pointer}.details-wrapper a:hover{text-decoration:underline}.details-wrapper a:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.details-wrapper ul>li:not(ul>li li){margin:0;padding:var(--spacing-l2) 0;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;inline-size:100%}.details-wrapper ul>li:not(ul>li li):not(:last-of-type){border-block-end:1px solid var(--color-bottom-border)}.details-wrapper ul>li:not(ul>li li) a{color:var(--color-text)}.details-wrapper ul>li:not(ul>li li) a.is-active{border-inline-start:var(--border-active);padding-inline-start:1rem;display:block}.details-wrapper ul>li:not(ul>li li) a:hover{color:var(--color-text-hover)}.details-wrapper ul>li>ul,.details-wrapper ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--spacing-l2);gap:var(--list-gap)}.details-wrapper ul>li>ul a,.details-wrapper ul>li>.nano-details>ul a{color:var(--color-primary) !important}.details-wrapper ul>li>ul>li>.nano-details>ul,.details-wrapper ul>li>.nano-details>ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--nano-spacing-xl)}.details-wrapper .nano-details .nano-details:not(.nano-details .nano-details .nano-details){color:var(--color-text)}.details-wrapper .nano-details{--padding:0;--btn-bg-color:transparent;--btn-bg-color--open:var(--nano-color-primary-75);--btn-bg-color--hover:transparent;border:none;color:var(--color-primary)}.details-wrapper .nano-details .is-active::part(header){border-inline-start:var(--border-active);padding-inline-start:1rem !important;color:var(--color-primary)}.details-wrapper .nano-details[open]>[slot=icon-start]{rotate:90deg}.details-wrapper .nano-details::part(icon--start){margin-inline-end:var(--spacing-l3)}.details-wrapper .nano-details::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing)}.details-wrapper .nano-details::part(header):hover{text-decoration:underline}.details-wrapper .nano-details:not(.nav-details){color:var(--color-primary)}";
|
|
11
11
|
|
|
12
12
|
const NanoInPageNav = class {
|
|
13
13
|
constructor(hostRef) {
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import { r as registerInstance, c as createEvent, g as getElement, a as Host } from './index-BM3Om9WE.js';
|
|
5
5
|
import { h } from './renderer-BaP2L8CT.js';
|
|
6
6
|
|
|
7
|
-
const tabCss = ":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{--border:2px solid var(--nano-color-neutral-300);--border-hover-color:var(--nano-color-primary-700);--border-active-color:var(--nano-color-primary-1000);--text-hover-color:var(--nano-color-primary-1000);--text-active-color:var(--nano-color-primary-
|
|
7
|
+
const tabCss = ":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{--border:2px solid var(--nano-color-neutral-300);--border-hover-color:var(--nano-color-primary-700);--border-active-color:var(--nano-color-primary-1000);--text-hover-color:var(--nano-color-primary-1000);--text-active-color:var(--nano-color-primary-1100);--padding:var(--nano-spacing-md);font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);display:inline-block;cursor:pointer;color:var(--nano-color-neutral-1400);border:var(--border);border-inline-end-width:0;border-inline-start-width:0;border-block-start-width:0;border-block-end:var(--border)}:host(:not([disabled]):hover){border-color:var(--border-hover-color);color:var(--text-hover-color)}:host(:not([disabled]):active),:host([active]){border-color:var(--border-active-color);color:var(--text-active-color)}:host(.nano-sortable__dragged){background:var(--nano-color-base-0);opacity:0.9 !important;box-shadow:var(--nano-shadow-l0) !important}.tab{padding:var(--padding);display:flex;white-space:nowrap;align-items:center;position:relative;gap:var(--nano-spacing-sm);justify-content:center}.tab.tab--disabled{opacity:0.5;cursor:not-allowed}.tab.tab--closable{padding-inline-end:calc(var(--padding) - var(--nano-spacing-sm))}.tab ::slotted(*),.tab::slotted(*){display:flex;align-items:center}.tab ::slotted(.nano-sortable__keyboard-handle){position:absolute;inset-inline-end:-1em;z-index:1}.tab:not(.tab--disabled):has(.tab__label:focus-visible){outline:var(--nano-focus-ring);outline-offset:-3px}.tab__label{display:flex;flex-direction:column;gap:var(--nano-spacing-sm);align-items:center}.tab__label:focus{outline:none}.tab__close-button{color:var(--nano-color-primary-1200);--hover-color:var(--nano-color-primary-700)}";
|
|
8
8
|
|
|
9
9
|
let id = 0;
|
|
10
10
|
const NanoTab = class {
|
|
@@ -437,7 +437,7 @@
|
|
|
437
437
|
container-type: inline-size;
|
|
438
438
|
position: relative;
|
|
439
439
|
display: grid;
|
|
440
|
-
grid-template-columns: minmax(197px, 31%) auto;
|
|
440
|
+
grid-template-columns: minmax(calc(197px - var(--gap)), 31%) auto;
|
|
441
441
|
grid-template-rows: repeat(calc(var(--row-count) - 1), auto);
|
|
442
442
|
gap: var(--gap);
|
|
443
443
|
background-color: var(--bg);
|
|
@@ -608,11 +608,9 @@
|
|
|
608
608
|
@container (width < 417px) {
|
|
609
609
|
nano-card[layout=landscape] [slot] {
|
|
610
610
|
grid-column: 1/-1 !important;
|
|
611
|
-
inline-size: calc(100% - var(--gap)) !important;
|
|
612
611
|
}
|
|
613
612
|
nano-card[layout=landscape] [slot=img] {
|
|
614
613
|
grid-column: 1/-1 !important;
|
|
615
|
-
inline-size: calc(100% - var(--gap)) !important;
|
|
616
614
|
}
|
|
617
615
|
}
|
|
618
616
|
nano-card[variant=product] [slot=title] {
|
|
@@ -1343,18 +1341,6 @@
|
|
|
1343
1341
|
.nano-in-page-nav:dir(rtl) {
|
|
1344
1342
|
--flip-icon-ltr: 0;
|
|
1345
1343
|
}
|
|
1346
|
-
.nano-in-page-nav :host(.external-links),
|
|
1347
|
-
.nano-in-page-nav .external-links {
|
|
1348
|
-
--color-bg: var(--nano-color-base-0) !important;
|
|
1349
|
-
}
|
|
1350
|
-
.nano-in-page-nav :host(.external-links) nav,
|
|
1351
|
-
.nano-in-page-nav .external-links nav {
|
|
1352
|
-
border-block: 1px solid var(--nano-color-neutral-200);
|
|
1353
|
-
}
|
|
1354
|
-
.nano-in-page-nav :host(.external-links) ul ul,
|
|
1355
|
-
.nano-in-page-nav .external-links ul ul {
|
|
1356
|
-
--color-border-active: var(--nano-color-neutral-1200) !important;
|
|
1357
|
-
}
|
|
1358
1344
|
.nano-in-page-nav a,
|
|
1359
1345
|
.nano-in-page-nav ul,
|
|
1360
1346
|
.nano-in-page-nav li {
|
|
@@ -1396,6 +1382,7 @@
|
|
|
1396
1382
|
.nano-in-page-nav ul > li:not(ul > li li) a.is-active {
|
|
1397
1383
|
border-inline-start: var(--border-active);
|
|
1398
1384
|
padding-inline-start: 1rem;
|
|
1385
|
+
display: block;
|
|
1399
1386
|
}
|
|
1400
1387
|
.nano-in-page-nav ul > li:not(ul > li li) a:hover {
|
|
1401
1388
|
color: var(--color-text-hover);
|
|
@@ -1447,6 +1434,10 @@
|
|
|
1447
1434
|
.nano-in-page-nav .nano-details:not(.nav-details) {
|
|
1448
1435
|
color: var(--color-primary);
|
|
1449
1436
|
}
|
|
1437
|
+
.nano-in-page-nav.external-links {
|
|
1438
|
+
--color-bg: var(--nano-color-base-0) !important;
|
|
1439
|
+
--color-border-active: var(--nano-color-primary-1000);
|
|
1440
|
+
}
|
|
1450
1441
|
.nano-in-page-nav.external-links ul ul {
|
|
1451
1442
|
--border-active: 3px solid var(--nano-color-neutral-1200);
|
|
1452
1443
|
}
|
|
@@ -1671,12 +1662,6 @@
|
|
|
1671
1662
|
nano-icon-item[size=large] {
|
|
1672
1663
|
--icon-dims: var(--nano-pictogram-size-x-large);
|
|
1673
1664
|
}
|
|
1674
|
-
nano-icon-item:has([slot=icon]):has([slot=heading]), nano-icon-item:has([slot=icon]):has([slot=content]) {
|
|
1675
|
-
grid-template-rows: repeat(2, min-content);
|
|
1676
|
-
}
|
|
1677
|
-
nano-icon-item:has([slot=icon]):has([slot=heading]):has([slot=content]) {
|
|
1678
|
-
grid-template-rows: repeat(3, min-content);
|
|
1679
|
-
}
|
|
1680
1665
|
nano-icon-item nano-icon, nano-icon-item .nano-icon {
|
|
1681
1666
|
--icon-size: var(--icon-dims) !important;
|
|
1682
1667
|
}
|
|
@@ -1705,18 +1690,12 @@
|
|
|
1705
1690
|
grid-template-columns: min-content 1fr !important;
|
|
1706
1691
|
row-gap: var(--nano-spacing-sm);
|
|
1707
1692
|
}
|
|
1708
|
-
nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]), nano-icon-item[landscape]:has([slot=icon]):has([slot=content]) {
|
|
1709
|
-
grid-template-rows: min-content;
|
|
1710
|
-
}
|
|
1711
1693
|
nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]) [slot=heading],
|
|
1712
1694
|
nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]) p[slot=content], nano-icon-item[landscape]:has([slot=icon]):has([slot=content]) [slot=heading],
|
|
1713
1695
|
nano-icon-item[landscape]:has([slot=icon]):has([slot=content]) p[slot=content] {
|
|
1714
1696
|
grid-row: 1;
|
|
1715
1697
|
align-self: center;
|
|
1716
1698
|
}
|
|
1717
|
-
nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]):has([slot=content]) {
|
|
1718
|
-
grid-template-rows: min-content 1fr;
|
|
1719
|
-
}
|
|
1720
1699
|
nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]):has([slot=content]) a,
|
|
1721
1700
|
nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]):has([slot=content]) [slot=heading] {
|
|
1722
1701
|
grid-row: 1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as a,g as e,a as
|
|
4
|
+
import{r as a,g as e,a as t}from"./index-BM3Om9WE.js";import{h as r}from"./renderer-BaP2L8CT.js";import{H as i}from"./slot-CFTP7C_Z.js";import{g as n}from"./dom-dlicJTEJ.js";import{f as o}from"./scroll-1nFw8CNk.js";const l=class{constructor(e){a(this,e)}get host(){return e(this)}autoExternalLinks=!1;io;mobileNavWrapper;slotCtrl=new i(this,"[default]","back","accessory");autoActive=!0;externalLinks="auto";createMobileMenu(){const a=n(this.host,"ul")[0];if(!a)return;const e=a.cloneNode(!0);n(e,"li",!0).forEach((a=>{const e=n(a,"a",!0)[0],t=n(a,"ul",!0)[0];if(e&&t){const r=this.createDetails(e.textContent?.trim()||"",t);e.remove(),a.prepend(r)}})),this.mobileNavWrapper.appendChild(e)}createDetails(a,e){const t=document.createElement("nano-details");return t.setAttribute("label",a),t.classList.add("nav-details"),t.appendChild(e),t}assessLinks(){if("auto"!==this.externalLinks)return;const a=this.host.querySelectorAll('a[href^="#"]'),e=this.host.querySelectorAll("a[href]");this.autoExternalLinks=!(a.length>e.length/2)}setupIntersectionObserver(){if(!this.autoActive)return;const a=this.host.querySelectorAll('a[href^="#"]'),e=[],t=o(this.host);a.forEach((a=>{const t=a.getAttribute("href")?.substring(1);if(!t)return;const r=document.getElementById(t);r&&e.push(r)})),this.io&&this.io.disconnect(),this.io=new IntersectionObserver((t=>{t.forEach((a=>{const e=a.target.getAttribute("id");e&&this.host.querySelector(`a[href="#${e}"]`)&&(a.isIntersecting?a.target.classList.add("in-view"):a.target.classList.remove("in-view"))}));const r=e.filter((a=>a.classList.contains("in-view")));if(r.length){r.sort(((a,e)=>e.getBoundingClientRect().top-a.getBoundingClientRect().top)),a.forEach((a=>a.classList.remove("is-active")));const e=r[0].getAttribute("id"),t=this.host.querySelector(`a[href="#${e}"]`);t?.classList.add("is-active")}}),{root:t===document.documentElement?null:t,rootMargin:"0px 0px -60% 0px",threshold:0}),e.forEach((a=>this.io.observe(a)))}handleSlotChange=()=>{this.assessLinks(),this.createMobileMenu(),this.setupIntersectionObserver()};componentDidLoad(){this.createMobileMenu()}connectedCallback(){this.assessLinks(),this.setupIntersectionObserver()}disconnectedCallback(){this.io&&(this.io.disconnect(),this.io=null)}render(){return r(t,{key:"a975c3e0b58fe39d504281784dd2f16e086eb0a1",class:{"nano-in-page-nav":!0,"external-links":!0===this.externalLinks||"auto"===this.externalLinks&&this.autoExternalLinks}},r("nav",{key:"26a999b2b5282f8e39f8e07e6e4190374e3c68c9",part:"root"},(this.slotCtrl.has("back")||this.slotCtrl.has("accessory"))&&r("div",{key:"507955a2092b3c1c5bfcaefe4debb97ba8ce1063",class:"header"},r("slot",{key:"5e3cd2413baf55b8905912316a1a17358e8597b5",name:"back"}),r("slot",{key:"ea39a03ba015a9bd2d031e839ae379699ba96d1a",name:"accessory"})),r("div",{key:"e6db628b6f4d1dc036a945554cfd8c90e8308307",class:"desktop-nav"},r("slot",{key:"1adc8091b920e22b54d8b83e0b60200f2ff1d45d",onSlotchange:()=>this.handleSlotChange})),r("nano-details",{key:"61fe2ef173d090faed09515c16df421cda50c11c",label:"Menu",class:"details-wrapper mobile-nav",ref:a=>this.mobileNavWrapper=a})))}};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:block}:host(.external-links){--color-bg:var(--nano-color-base-0) !important}:host(.external-links) .nano-details{--border-active:3px solid var(--nano-color-neutral-1200) !important}:host(.external-links) nav{border-block:1px solid var(--nano-color-neutral-200)}.desktop-nav{display:block}@media (width <= 730px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 730px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}@media (width <= 730px){nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:"";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper a,.details-wrapper ul,.details-wrapper li{all:unset}.details-wrapper ul{display:flex;flex-direction:column;list-style:none}.details-wrapper ul:not(ul ul){padding:0 var(--spacing-l2) 0 var(--spacing-l2)}.details-wrapper a{cursor:pointer}.details-wrapper a:hover{text-decoration:underline}.details-wrapper a:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.details-wrapper ul>li:not(ul>li li){margin:0;padding:var(--spacing-l2) 0;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;inline-size:100%}.details-wrapper ul>li:not(ul>li li):not(:last-of-type){border-block-end:1px solid var(--color-bottom-border)}.details-wrapper ul>li:not(ul>li li) a{color:var(--color-text)}.details-wrapper ul>li:not(ul>li li) a.is-active{border-inline-start:var(--border-active);padding-inline-start:1rem;display:block}.details-wrapper ul>li:not(ul>li li) a:hover{color:var(--color-text-hover)}.details-wrapper ul>li>ul,.details-wrapper ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--spacing-l2);gap:var(--list-gap)}.details-wrapper ul>li>ul a,.details-wrapper ul>li>.nano-details>ul a{color:var(--color-primary) !important}.details-wrapper ul>li>ul>li>.nano-details>ul,.details-wrapper ul>li>.nano-details>ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--nano-spacing-xl)}.details-wrapper .nano-details .nano-details:not(.nano-details .nano-details .nano-details){color:var(--color-text)}.details-wrapper .nano-details{--padding:0;--btn-bg-color:transparent;--btn-bg-color--open:var(--nano-color-primary-75);--btn-bg-color--hover:transparent;border:none;color:var(--color-primary)}.details-wrapper .nano-details .is-active::part(header){border-inline-start:var(--border-active);padding-inline-start:1rem !important;color:var(--color-primary)}.details-wrapper .nano-details[open]>[slot=icon-start]{rotate:90deg}.details-wrapper .nano-details::part(icon--start){margin-inline-end:var(--spacing-l3)}.details-wrapper .nano-details::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing)}.details-wrapper .nano-details::part(header):hover{text-decoration:underline}.details-wrapper .nano-details:not(.nav-details){color:var(--color-primary)}';export{l as nano_in_page_nav}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import{r as a,c as o,g as e,a as t}from"./index-BM3Om9WE.js";import{h as r}from"./renderer-BaP2L8CT.js";let n=0;const i=class{constructor(e){a(this,e),this.nanoTabClose=o(this,"nanoTabClose",7)}tabId="nano-tab-"+ ++n;tab;get host(){return e(this)}panel="";active=!1;disabled=!1;closable=!1;nanoTabClose;async setFocus(){this.tab.focus({preventScroll:!0})}async removeFocus(){this.tab.blur()}handleCloseClick=()=>{this.nanoTabClose.emit()};handleCloseKeydown=a=>{" "===a.key&&(a.preventDefault(),this.handleCloseClick())};render(){return r(t,{key:"67fe232bda16bf41bf1268a1891cfeb6483ebd02",id:this.host.id||this.tabId,role:"tab","aria-disabled":this.disabled?"true":"false","aria-selected":this.active?"true":"false",class:"nano-tab"},r("div",{key:"6f07d7d5a89071e094fe3deb19e88ec66a524f3d",part:`base${this.active?" base--active":""}${this.disabled?" base--disabled":""}${this.closable?" base--closable":""}`,class:{tab:!0,"tab--active":this.active,"tab--disabled":this.disabled,"tab--closable":this.closable}},r("slot",{key:"4c8dce458c8ae3ed526d4aed7332650be891510c",name:"start"}),r("div",{key:"e71cced02347ffaa432b5711af54666ac0a6cfd6",part:"label",ref:a=>this.tab=a,tabindex:this.disabled||!this.active?"-1":"0",class:"tab__label"},r("slot",{key:"382f7f77b009e3a5cf3af3d3b94b02e639bf2934"})),r("slot",{key:"82a2c81ab573d3c78b7d913f4b7ab146e7c6d5b2",name:"end"}),this.closable&&!this.disabled&&r("nano-icon-button",{key:"14e812f9acd5e081a1eba5014f6d4fe4b79371e2",label:"Close this tab",iconName:"light/xmark",class:"tab__close-button",onClick:this.handleCloseClick,onKeyDown:this.handleCloseKeydown,part:"close-button"})))}};i.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{--border:2px solid var(--nano-color-neutral-300);--border-hover-color:var(--nano-color-primary-700);--border-active-color:var(--nano-color-primary-1000);--text-hover-color:var(--nano-color-primary-1000);--text-active-color:var(--nano-color-primary-
|
|
4
|
+
import{r as a,c as o,g as e,a as t}from"./index-BM3Om9WE.js";import{h as r}from"./renderer-BaP2L8CT.js";let n=0;const i=class{constructor(e){a(this,e),this.nanoTabClose=o(this,"nanoTabClose",7)}tabId="nano-tab-"+ ++n;tab;get host(){return e(this)}panel="";active=!1;disabled=!1;closable=!1;nanoTabClose;async setFocus(){this.tab.focus({preventScroll:!0})}async removeFocus(){this.tab.blur()}handleCloseClick=()=>{this.nanoTabClose.emit()};handleCloseKeydown=a=>{" "===a.key&&(a.preventDefault(),this.handleCloseClick())};render(){return r(t,{key:"67fe232bda16bf41bf1268a1891cfeb6483ebd02",id:this.host.id||this.tabId,role:"tab","aria-disabled":this.disabled?"true":"false","aria-selected":this.active?"true":"false",class:"nano-tab"},r("div",{key:"6f07d7d5a89071e094fe3deb19e88ec66a524f3d",part:`base${this.active?" base--active":""}${this.disabled?" base--disabled":""}${this.closable?" base--closable":""}`,class:{tab:!0,"tab--active":this.active,"tab--disabled":this.disabled,"tab--closable":this.closable}},r("slot",{key:"4c8dce458c8ae3ed526d4aed7332650be891510c",name:"start"}),r("div",{key:"e71cced02347ffaa432b5711af54666ac0a6cfd6",part:"label",ref:a=>this.tab=a,tabindex:this.disabled||!this.active?"-1":"0",class:"tab__label"},r("slot",{key:"382f7f77b009e3a5cf3af3d3b94b02e639bf2934"})),r("slot",{key:"82a2c81ab573d3c78b7d913f4b7ab146e7c6d5b2",name:"end"}),this.closable&&!this.disabled&&r("nano-icon-button",{key:"14e812f9acd5e081a1eba5014f6d4fe4b79371e2",label:"Close this tab",iconName:"light/xmark",class:"tab__close-button",onClick:this.handleCloseClick,onKeyDown:this.handleCloseKeydown,part:"close-button"})))}};i.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{--border:2px solid var(--nano-color-neutral-300);--border-hover-color:var(--nano-color-primary-700);--border-active-color:var(--nano-color-primary-1000);--text-hover-color:var(--nano-color-primary-1000);--text-active-color:var(--nano-color-primary-1100);--padding:var(--nano-spacing-md);font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);display:inline-block;cursor:pointer;color:var(--nano-color-neutral-1400);border:var(--border);border-inline-end-width:0;border-inline-start-width:0;border-block-start-width:0;border-block-end:var(--border)}:host(:not([disabled]):hover){border-color:var(--border-hover-color);color:var(--text-hover-color)}:host(:not([disabled]):active),:host([active]){border-color:var(--border-active-color);color:var(--text-active-color)}:host(.nano-sortable__dragged){background:var(--nano-color-base-0);opacity:0.9 !important;box-shadow:var(--nano-shadow-l0) !important}.tab{padding:var(--padding);display:flex;white-space:nowrap;align-items:center;position:relative;gap:var(--nano-spacing-sm);justify-content:center}.tab.tab--disabled{opacity:0.5;cursor:not-allowed}.tab.tab--closable{padding-inline-end:calc(var(--padding) - var(--nano-spacing-sm))}.tab ::slotted(*),.tab::slotted(*){display:flex;align-items:center}.tab ::slotted(.nano-sortable__keyboard-handle){position:absolute;inset-inline-end:-1em;z-index:1}.tab:not(.tab--disabled):has(.tab__label:focus-visible){outline:var(--nano-focus-ring);outline-offset:-3px}.tab__label{display:flex;flex-direction:column;gap:var(--nano-spacing-sm);align-items:center}.tab__label:focus{outline:none}.tab__close-button{color:var(--nano-color-primary-1200);--hover-color:var(--nano-color-primary-700)}";export{i as nano_tab}
|