@nanoporetech-digital/components 8.5.5 → 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 +20 -16
- 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 +13 -12
- package/dist/collection/components/in-page-nav/in-page-nav.js +19 -17
- package/dist/collection/components/tabs/tab.css +1 -1
- package/dist/components/nano-in-page-nav.js +20 -18
- package/dist/components/nano-tab.js +1 -1
- package/dist/esm/nano-in-page-nav.entry.js +20 -16
- package/dist/esm/nano-tab.entry.js +1 -1
- package/dist/nano-components/nano-components.css +7 -21
- 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/dist/types/components/in-page-nav/in-page-nav.d.ts +1 -1
- package/docs-json.json +2 -2
- package/hydrate/index.js +18 -17
- package/hydrate/index.mjs +18 -17
- package/package.json +2 -2
- /package/dist/types/builds/{sHPJkByK → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/generate-vue-component.d.ts +0 -0
- /package/dist/types/builds/{sHPJkByK → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/index.d.ts +0 -0
- /package/dist/types/builds/{sHPJkByK → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/output-vue.d.ts +0 -0
- /package/dist/types/builds/{sHPJkByK → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/plugin.d.ts +0 -0
- /package/dist/types/builds/{sHPJkByK → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/types.d.ts +0 -0
- /package/dist/types/builds/{sHPJkByK → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/utils.d.ts +0 -0
- /package/dist/types/builds/{sHPJkByK → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/stencil.config.d.ts +0 -0
- /package/dist/types/builds/{sHPJkByK → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/stencil.config.prod.d.ts +0 -0
- /package/dist/types/builds/{sHPJkByK → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/testing/mocks/intersection-observer.d.ts +0 -0
- /package/dist/types/builds/{sHPJkByK → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/wdio.conf.d.ts +0 -0
|
@@ -12,7 +12,6 @@ import { ComponentInterface } from '../../stencil-public-runtime';
|
|
|
12
12
|
* @part root - The root element of the navigation.
|
|
13
13
|
*/
|
|
14
14
|
export declare class NanoInPageNav implements ComponentInterface {
|
|
15
|
-
private scrollElement;
|
|
16
15
|
host: HTMLElement;
|
|
17
16
|
autoExternalLinks: boolean;
|
|
18
17
|
private io;
|
|
@@ -29,6 +28,7 @@ export declare class NanoInPageNav implements ComponentInterface {
|
|
|
29
28
|
*/
|
|
30
29
|
private createDetails;
|
|
31
30
|
private assessLinks;
|
|
31
|
+
private setupIntersectionObserver;
|
|
32
32
|
private handleSlotChange;
|
|
33
33
|
componentDidLoad(): void;
|
|
34
34
|
connectedCallback(): void;
|
package/docs-json.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"timestamp": "2025-09-
|
|
2
|
+
"timestamp": "2025-09-10T13:11:19",
|
|
3
3
|
"compiler": {
|
|
4
4
|
"name": "@stencil/core",
|
|
5
5
|
"version": "4.36.1",
|
|
@@ -3358,7 +3358,7 @@
|
|
|
3358
3358
|
"references": {
|
|
3359
3359
|
"Breadcrumb": {
|
|
3360
3360
|
"location": "local",
|
|
3361
|
-
"path": "/builds/
|
|
3361
|
+
"path": "/builds/uSGJX_GU/0/Digital/nano-components/packages/components/src/components/breadcrumb/breadcrumb.tsx",
|
|
3362
3362
|
"id": "src/components/breadcrumb/breadcrumb.tsx::Breadcrumb"
|
|
3363
3363
|
}
|
|
3364
3364
|
}
|
package/hydrate/index.js
CHANGED
|
@@ -22627,7 +22627,7 @@ class NanoIconItem {
|
|
|
22627
22627
|
}; }
|
|
22628
22628
|
}
|
|
22629
22629
|
|
|
22630
|
-
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 <=
|
|
22630
|
+
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)}";
|
|
22631
22631
|
|
|
22632
22632
|
/**
|
|
22633
22633
|
* In-page navigation allows users to quickly find different sections on a page.
|
|
@@ -22645,7 +22645,6 @@ class NanoInPageNav {
|
|
|
22645
22645
|
constructor(hostRef) {
|
|
22646
22646
|
registerInstance(this, hostRef);
|
|
22647
22647
|
}
|
|
22648
|
-
scrollElement;
|
|
22649
22648
|
get host() { return getElement(this); }
|
|
22650
22649
|
autoExternalLinks = false;
|
|
22651
22650
|
io;
|
|
@@ -22683,19 +22682,23 @@ class NanoInPageNav {
|
|
|
22683
22682
|
return node;
|
|
22684
22683
|
}
|
|
22685
22684
|
assessLinks() {
|
|
22685
|
+
if (this.externalLinks !== 'auto')
|
|
22686
|
+
return;
|
|
22686
22687
|
const anchors = this.host.querySelectorAll('a[href^="#"]');
|
|
22687
|
-
|
|
22688
|
-
|
|
22689
|
-
|
|
22690
|
-
this.autoExternalLinks = false;
|
|
22691
|
-
}
|
|
22692
|
-
else {
|
|
22693
|
-
this.autoExternalLinks = true;
|
|
22694
|
-
}
|
|
22688
|
+
const allLinks = this.host.querySelectorAll('a[href]');
|
|
22689
|
+
if (anchors.length > allLinks.length / 2) {
|
|
22690
|
+
this.autoExternalLinks = false;
|
|
22695
22691
|
}
|
|
22692
|
+
else {
|
|
22693
|
+
this.autoExternalLinks = true;
|
|
22694
|
+
}
|
|
22695
|
+
}
|
|
22696
|
+
setupIntersectionObserver() {
|
|
22696
22697
|
if (!this.autoActive)
|
|
22697
22698
|
return;
|
|
22699
|
+
const anchors = this.host.querySelectorAll('a[href^="#"]');
|
|
22698
22700
|
const sections = [];
|
|
22701
|
+
const scrollElement = findScrollParent(this.host);
|
|
22699
22702
|
anchors.forEach((link) => {
|
|
22700
22703
|
const id = link.getAttribute('href')?.substring(1);
|
|
22701
22704
|
if (!id)
|
|
@@ -22732,9 +22735,7 @@ class NanoInPageNav {
|
|
|
22732
22735
|
activeLink?.classList.add('is-active');
|
|
22733
22736
|
}
|
|
22734
22737
|
}, {
|
|
22735
|
-
root:
|
|
22736
|
-
? null
|
|
22737
|
-
: this.scrollElement,
|
|
22738
|
+
root: scrollElement === document.documentElement ? null : scrollElement,
|
|
22738
22739
|
rootMargin: '0px 0px -60% 0px',
|
|
22739
22740
|
threshold: 0,
|
|
22740
22741
|
});
|
|
@@ -22747,7 +22748,7 @@ class NanoInPageNav {
|
|
|
22747
22748
|
this.createMobileMenu();
|
|
22748
22749
|
}
|
|
22749
22750
|
connectedCallback() {
|
|
22750
|
-
|
|
22751
|
+
this.assessLinks();
|
|
22751
22752
|
}
|
|
22752
22753
|
disconnectedCallback() {
|
|
22753
22754
|
if (this.io) {
|
|
@@ -22756,11 +22757,11 @@ class NanoInPageNav {
|
|
|
22756
22757
|
}
|
|
22757
22758
|
}
|
|
22758
22759
|
render() {
|
|
22759
|
-
return (h(Host, { key: '
|
|
22760
|
+
return (h(Host, { key: 'a975c3e0b58fe39d504281784dd2f16e086eb0a1', class: {
|
|
22760
22761
|
'nano-in-page-nav': true,
|
|
22761
22762
|
'external-links': this.externalLinks === true ||
|
|
22762
22763
|
(this.externalLinks === 'auto' && this.autoExternalLinks),
|
|
22763
|
-
} }, h("nav", { key: '
|
|
22764
|
+
} }, h("nav", { key: '26a999b2b5282f8e39f8e07e6e4190374e3c68c9', part: "root" }, (this.slotCtrl.has('back') || this.slotCtrl.has('accessory')) && (h("div", { key: '507955a2092b3c1c5bfcaefe4debb97ba8ce1063', class: "header" }, h("slot", { key: '5e3cd2413baf55b8905912316a1a17358e8597b5', name: "back" }), h("slot", { key: 'ea39a03ba015a9bd2d031e839ae379699ba96d1a', name: "accessory" }))), h("div", { key: 'e6db628b6f4d1dc036a945554cfd8c90e8308307', class: "desktop-nav" }, h("slot", { key: '1adc8091b920e22b54d8b83e0b60200f2ff1d45d', onSlotchange: () => this.handleSlotChange })), h("nano-details", { key: '61fe2ef173d090faed09515c16df421cda50c11c', label: "Menu", class: "details-wrapper mobile-nav", ref: (el) => (this.mobileNavWrapper = el) }))));
|
|
22764
22765
|
}
|
|
22765
22766
|
static get style() { return inPageNavCss; }
|
|
22766
22767
|
static get cmpMeta() { return {
|
|
@@ -23144,7 +23145,7 @@ __decorate([
|
|
|
23144
23145
|
__metadata("design:type", Object)
|
|
23145
23146
|
], NanoStepBreadcrumb.prototype, "styles", void 0);
|
|
23146
23147
|
|
|
23147
|
-
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-
|
|
23148
|
+
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)}";
|
|
23148
23149
|
|
|
23149
23150
|
let id$2 = 0;
|
|
23150
23151
|
/**
|
package/hydrate/index.mjs
CHANGED
|
@@ -22625,7 +22625,7 @@ class NanoIconItem {
|
|
|
22625
22625
|
}; }
|
|
22626
22626
|
}
|
|
22627
22627
|
|
|
22628
|
-
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 <=
|
|
22628
|
+
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)}";
|
|
22629
22629
|
|
|
22630
22630
|
/**
|
|
22631
22631
|
* In-page navigation allows users to quickly find different sections on a page.
|
|
@@ -22643,7 +22643,6 @@ class NanoInPageNav {
|
|
|
22643
22643
|
constructor(hostRef) {
|
|
22644
22644
|
registerInstance(this, hostRef);
|
|
22645
22645
|
}
|
|
22646
|
-
scrollElement;
|
|
22647
22646
|
get host() { return getElement(this); }
|
|
22648
22647
|
autoExternalLinks = false;
|
|
22649
22648
|
io;
|
|
@@ -22681,19 +22680,23 @@ class NanoInPageNav {
|
|
|
22681
22680
|
return node;
|
|
22682
22681
|
}
|
|
22683
22682
|
assessLinks() {
|
|
22683
|
+
if (this.externalLinks !== 'auto')
|
|
22684
|
+
return;
|
|
22684
22685
|
const anchors = this.host.querySelectorAll('a[href^="#"]');
|
|
22685
|
-
|
|
22686
|
-
|
|
22687
|
-
|
|
22688
|
-
this.autoExternalLinks = false;
|
|
22689
|
-
}
|
|
22690
|
-
else {
|
|
22691
|
-
this.autoExternalLinks = true;
|
|
22692
|
-
}
|
|
22686
|
+
const allLinks = this.host.querySelectorAll('a[href]');
|
|
22687
|
+
if (anchors.length > allLinks.length / 2) {
|
|
22688
|
+
this.autoExternalLinks = false;
|
|
22693
22689
|
}
|
|
22690
|
+
else {
|
|
22691
|
+
this.autoExternalLinks = true;
|
|
22692
|
+
}
|
|
22693
|
+
}
|
|
22694
|
+
setupIntersectionObserver() {
|
|
22694
22695
|
if (!this.autoActive)
|
|
22695
22696
|
return;
|
|
22697
|
+
const anchors = this.host.querySelectorAll('a[href^="#"]');
|
|
22696
22698
|
const sections = [];
|
|
22699
|
+
const scrollElement = findScrollParent(this.host);
|
|
22697
22700
|
anchors.forEach((link) => {
|
|
22698
22701
|
const id = link.getAttribute('href')?.substring(1);
|
|
22699
22702
|
if (!id)
|
|
@@ -22730,9 +22733,7 @@ class NanoInPageNav {
|
|
|
22730
22733
|
activeLink?.classList.add('is-active');
|
|
22731
22734
|
}
|
|
22732
22735
|
}, {
|
|
22733
|
-
root:
|
|
22734
|
-
? null
|
|
22735
|
-
: this.scrollElement,
|
|
22736
|
+
root: scrollElement === document.documentElement ? null : scrollElement,
|
|
22736
22737
|
rootMargin: '0px 0px -60% 0px',
|
|
22737
22738
|
threshold: 0,
|
|
22738
22739
|
});
|
|
@@ -22745,7 +22746,7 @@ class NanoInPageNav {
|
|
|
22745
22746
|
this.createMobileMenu();
|
|
22746
22747
|
}
|
|
22747
22748
|
connectedCallback() {
|
|
22748
|
-
|
|
22749
|
+
this.assessLinks();
|
|
22749
22750
|
}
|
|
22750
22751
|
disconnectedCallback() {
|
|
22751
22752
|
if (this.io) {
|
|
@@ -22754,11 +22755,11 @@ class NanoInPageNav {
|
|
|
22754
22755
|
}
|
|
22755
22756
|
}
|
|
22756
22757
|
render() {
|
|
22757
|
-
return (h(Host, { key: '
|
|
22758
|
+
return (h(Host, { key: 'a975c3e0b58fe39d504281784dd2f16e086eb0a1', class: {
|
|
22758
22759
|
'nano-in-page-nav': true,
|
|
22759
22760
|
'external-links': this.externalLinks === true ||
|
|
22760
22761
|
(this.externalLinks === 'auto' && this.autoExternalLinks),
|
|
22761
|
-
} }, h("nav", { key: '
|
|
22762
|
+
} }, h("nav", { key: '26a999b2b5282f8e39f8e07e6e4190374e3c68c9', part: "root" }, (this.slotCtrl.has('back') || this.slotCtrl.has('accessory')) && (h("div", { key: '507955a2092b3c1c5bfcaefe4debb97ba8ce1063', class: "header" }, h("slot", { key: '5e3cd2413baf55b8905912316a1a17358e8597b5', name: "back" }), h("slot", { key: 'ea39a03ba015a9bd2d031e839ae379699ba96d1a', name: "accessory" }))), h("div", { key: 'e6db628b6f4d1dc036a945554cfd8c90e8308307', class: "desktop-nav" }, h("slot", { key: '1adc8091b920e22b54d8b83e0b60200f2ff1d45d', onSlotchange: () => this.handleSlotChange })), h("nano-details", { key: '61fe2ef173d090faed09515c16df421cda50c11c', label: "Menu", class: "details-wrapper mobile-nav", ref: (el) => (this.mobileNavWrapper = el) }))));
|
|
22762
22763
|
}
|
|
22763
22764
|
static get style() { return inPageNavCss; }
|
|
22764
22765
|
static get cmpMeta() { return {
|
|
@@ -23142,7 +23143,7 @@ __decorate([
|
|
|
23142
23143
|
__metadata("design:type", Object)
|
|
23143
23144
|
], NanoStepBreadcrumb.prototype, "styles", void 0);
|
|
23144
23145
|
|
|
23145
|
-
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-
|
|
23146
|
+
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)}";
|
|
23146
23147
|
|
|
23147
23148
|
let id$2 = 0;
|
|
23148
23149
|
/**
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nanoporetech-digital/components",
|
|
3
|
-
"version": "8.5.
|
|
3
|
+
"version": "8.5.7",
|
|
4
4
|
"sideEffects": false,
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
"smart-array-filter": "^4.0.2",
|
|
61
61
|
"stencil-wormhole": "3.2.1",
|
|
62
62
|
"tyqs": "^0.1.3",
|
|
63
|
-
"@nanoporetech-digital/style": "8.5.
|
|
63
|
+
"@nanoporetech-digital/style": "8.5.7"
|
|
64
64
|
},
|
|
65
65
|
"devDependencies": {
|
|
66
66
|
"@algolia/client-search": "^4.22.1",
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|