@nanoporetech-digital/components 8.1.1 → 8.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{fade-DiBAr_-0.js → fade-Cvsqaxtn.js} +1 -1
- package/dist/cjs/{fullscreen-DiSrws4D.js → fullscreen-BtSF9KqT.js} +1 -1
- package/dist/cjs/index-Bp8uD6Gl.js +8 -0
- package/dist/cjs/{lazyload-CilBX2zO.js → lazyload-DxM1Zo3E.js} +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{local-logged-in-CX0THX6r.js → local-logged-in-CLtc2TZa.js} +1 -1
- package/dist/cjs/{local-logged-out-C-cPz-8v.js → local-logged-out-Ao69_vQl.js} +1 -1
- package/dist/cjs/nano-avatar_5.cjs.entry.js +7 -7
- package/dist/cjs/nano-components.cjs.js +1 -1
- package/dist/cjs/nano-date-picker_2.cjs.entry.js +29 -26
- package/dist/cjs/nano-global-nav.cjs.entry.js +3 -3
- package/dist/cjs/nano-icon_3.cjs.entry.js +3 -3
- package/dist/cjs/nano-in-page-nav.cjs.entry.js +1 -1
- package/dist/cjs/nano-increment.cjs.entry.js +81 -0
- package/dist/cjs/nano-intersection-observe.cjs.entry.js +1 -1
- package/dist/cjs/nano-masked-overflow.cjs.entry.js +3 -3
- package/dist/cjs/nano-menu-drawer.cjs.entry.js +6 -3
- package/dist/cjs/nano-more-less.cjs.entry.js +2 -2
- package/dist/cjs/nano-option-box.cjs.entry.js +17 -0
- package/dist/cjs/nano-rating.cjs.entry.js +4 -4
- package/dist/cjs/nano-resize-observe.cjs.entry.js +2 -2
- package/dist/cjs/nano-slide.cjs.entry.js +1 -1
- package/dist/cjs/{nano-slides-CFlLOF1V.js → nano-slides-DLbZhf2H.js} +7 -7
- package/dist/cjs/nano-slides.cjs.entry.js +1 -1
- package/dist/cjs/nano-sortable.cjs.entry.js +1 -1
- package/dist/cjs/nano-sticker.cjs.entry.js +2 -2
- package/dist/cjs/nano-tab-content.cjs.entry.js +2 -2
- package/dist/cjs/nano-tab.cjs.entry.js +2 -2
- package/dist/cjs/nano-table.cjs.entry.js +2 -2
- package/dist/cjs/{page-dots-B69b5Pqb.js → page-dots-DpnNe0bi.js} +1 -1
- package/dist/collection/collection-manifest.json +2 -0
- package/dist/collection/components/breadcrumb/breadcrumb.js +1 -1
- package/dist/collection/components/global-nav/assets/local-logged-in.json +1 -1
- package/dist/collection/components/global-nav/assets/local-logged-out.json +1 -1
- package/dist/collection/components/global-nav/global-nav.css +1 -0
- package/dist/collection/components/icon-button/icon-button.css +1 -1
- package/dist/collection/components/in-page-nav/in-page-nav.js +2 -2
- package/dist/collection/components/increment/increment.css +102 -0
- package/dist/collection/components/increment/increment.js +97 -0
- package/dist/collection/components/input/input.js +30 -27
- package/dist/collection/components/intersection-observe/intersection-observe.js +1 -1
- package/dist/collection/components/masked-overflow/masked-overflow.js +3 -3
- package/dist/collection/components/menu-drawer/menu-drawer.css +11 -7
- package/dist/collection/components/menu-drawer/menu-drawer.js +7 -3
- package/dist/collection/components/more-less/more-less.js +2 -2
- package/dist/collection/components/option-box/option-box.css +41 -0
- package/dist/collection/components/option-box/option-box.js +25 -0
- package/dist/collection/components/rating/rating.js +4 -4
- package/dist/collection/components/resize-observe/resize-observe.js +2 -2
- package/dist/collection/components/select/select.js +7 -7
- package/dist/collection/components/slides/slide.js +1 -1
- package/dist/collection/components/slides/slides.js +3 -3
- package/dist/collection/components/sortable/sortable.js +1 -1
- package/dist/collection/components/sticker/sticker.js +2 -2
- package/dist/collection/components/table/table.js +2 -2
- package/dist/collection/components/tabs/tab-content.js +2 -2
- package/dist/collection/components/tabs/tab.js +2 -2
- package/dist/collection/components/tooltip/tooltip.js +2 -2
- package/dist/components/icon-button.js +1 -1
- package/dist/components/input.js +39 -36
- package/dist/components/local-logged-in.js +1 -1
- package/dist/components/local-logged-out.js +1 -1
- package/dist/components/masked-overflow.js +3 -3
- package/dist/components/nano-global-nav.js +1 -1
- package/dist/components/nano-in-page-nav.js +1 -1
- package/dist/components/nano-increment.d.ts +11 -0
- package/dist/components/nano-increment.js +119 -0
- package/dist/components/nano-intersection-observe.js +1 -1
- package/dist/components/nano-menu-drawer.js +8 -4
- package/dist/components/nano-more-less.js +2 -2
- package/dist/components/nano-option-box.d.ts +11 -0
- package/dist/components/nano-option-box.js +32 -0
- package/dist/components/nano-rating.js +4 -4
- package/dist/components/nano-slide.js +1 -1
- package/dist/components/nano-sortable.js +1 -1
- package/dist/components/nano-tab-content.js +2 -2
- package/dist/components/nano-tab.js +2 -2
- package/dist/components/nano-table.js +2 -2
- package/dist/components/resize-observe.js +2 -2
- package/dist/components/select.js +7 -7
- package/dist/components/slides.js +3 -3
- package/dist/components/sticker.js +2 -2
- package/dist/components/tooltip.js +2 -2
- package/dist/esm/{fade-CJJNY8cW.js → fade-M1mjf4zm.js} +1 -1
- package/dist/esm/{fullscreen-kmgJDkI-.js → fullscreen-BJlrN4_5.js} +1 -1
- package/dist/esm/index-DgO0qeQ9.js +8 -0
- package/dist/esm/{lazyload-DqTFDE4y.js → lazyload-B6FI3nbb.js} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{local-logged-in-Bycp-mPl.js → local-logged-in-Bh5fOkeO.js} +1 -1
- package/dist/esm/{local-logged-out-BhOAka-2.js → local-logged-out-BQyUtSml.js} +1 -1
- package/dist/esm/nano-avatar_5.entry.js +7 -7
- package/dist/esm/nano-components.js +1 -1
- package/dist/esm/nano-date-picker_2.entry.js +29 -26
- package/dist/esm/nano-global-nav.entry.js +3 -3
- package/dist/esm/nano-icon_3.entry.js +3 -3
- package/dist/esm/nano-in-page-nav.entry.js +1 -1
- package/dist/esm/nano-increment.entry.js +79 -0
- package/dist/esm/nano-intersection-observe.entry.js +1 -1
- package/dist/esm/nano-masked-overflow.entry.js +3 -3
- package/dist/esm/nano-menu-drawer.entry.js +6 -3
- package/dist/esm/nano-more-less.entry.js +2 -2
- package/dist/esm/nano-option-box.entry.js +15 -0
- package/dist/esm/nano-rating.entry.js +4 -4
- package/dist/esm/nano-resize-observe.entry.js +2 -2
- package/dist/esm/nano-slide.entry.js +1 -1
- package/dist/esm/{nano-slides-Bdq8L4lE.js → nano-slides-CI0F1FDY.js} +7 -7
- package/dist/esm/nano-slides.entry.js +1 -1
- package/dist/esm/nano-sortable.entry.js +1 -1
- package/dist/esm/nano-sticker.entry.js +2 -2
- package/dist/esm/nano-tab-content.entry.js +2 -2
- package/dist/esm/nano-tab.entry.js +2 -2
- package/dist/esm/nano-table.entry.js +2 -2
- package/dist/esm/{page-dots-BBtKwJtf.js → page-dots-BsFo0sLb.js} +1 -1
- package/dist/nano-assets/hash.txt +1 -1
- package/dist/nano-assets/local-logged-in.json +1 -1
- package/dist/nano-assets/local-logged-out.json +1 -1
- package/dist/nano-components/assets/local-logged-in.json +1 -1
- package/dist/nano-components/assets/local-logged-out.json +1 -1
- package/dist/nano-components/{fade-CJJNY8cW.js → fade-M1mjf4zm.js} +1 -1
- package/dist/nano-components/{fullscreen-kmgJDkI-.js → fullscreen-BJlrN4_5.js} +1 -1
- package/dist/nano-components/{lazyload-DqTFDE4y.js → lazyload-B6FI3nbb.js} +1 -1
- package/dist/nano-components/{local-logged-in-Bycp-mPl.js → local-logged-in-Bh5fOkeO.js} +1 -1
- package/dist/nano-components/{local-logged-out-BhOAka-2.js → local-logged-out-BQyUtSml.js} +1 -1
- package/dist/nano-components/nano-avatar_5.entry.js +1 -1
- package/dist/nano-components/nano-components.css +203 -10
- package/dist/nano-components/nano-components.esm.js +1 -1
- package/dist/nano-components/nano-date-picker_2.entry.js +1 -1
- package/dist/nano-components/nano-global-nav.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-increment.entry.js +4 -0
- 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-option-box.entry.js +4 -0
- package/dist/nano-components/nano-rating.entry.js +1 -1
- package/dist/nano-components/nano-resize-observe.entry.js +1 -1
- package/dist/nano-components/nano-slide.entry.js +1 -1
- package/dist/nano-components/{nano-slides-Bdq8L4lE.js → nano-slides-CI0F1FDY.js} +2 -2
- 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-sticker.entry.js +1 -1
- package/dist/nano-components/nano-tab-content.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-BBtKwJtf.js → page-dots-BsFo0sLb.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/dist/types/components/increment/increment.d.ts +19 -0
- package/dist/types/components/input/input.d.ts +6 -2
- package/dist/types/components/menu-drawer/menu-drawer.d.ts +1 -0
- package/dist/types/components/option-box/option-box.d.ts +14 -0
- package/dist/types/components.d.ts +70 -4
- package/dist/wdio.conf.js +2 -2
- package/docs-json.json +117 -4
- package/docs-vscode.json +18 -2
- package/hydrate/index.js +196 -70
- package/hydrate/index.mjs +196 -70
- package/package.json +2 -2
- /package/dist/types/builds/{W1hp42tj → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/generate-vue-component.d.ts +0 -0
- /package/dist/types/builds/{W1hp42tj → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/index.d.ts +0 -0
- /package/dist/types/builds/{W1hp42tj → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/output-vue.d.ts +0 -0
- /package/dist/types/builds/{W1hp42tj → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/plugin.d.ts +0 -0
- /package/dist/types/builds/{W1hp42tj → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/types.d.ts +0 -0
- /package/dist/types/builds/{W1hp42tj → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/plugins/stencil/vue-output/utils.d.ts +0 -0
- /package/dist/types/builds/{W1hp42tj → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/stencil.config.d.ts +0 -0
- /package/dist/types/builds/{W1hp42tj → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/stencil.config.prod.d.ts +0 -0
- /package/dist/types/builds/{W1hp42tj → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/testing/mocks/intersection-observer.d.ts +0 -0
- /package/dist/types/builds/{W1hp42tj → uSGJX_GU}/0/Digital/nano-components/packages/components/.stencil/wdio.conf.d.ts +0 -0
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../types/components";
|
|
2
|
+
|
|
3
|
+
interface NanoIncrement extends Components.NanoIncrement, HTMLElement {}
|
|
4
|
+
export const NanoIncrement: {
|
|
5
|
+
prototype: NanoIncrement;
|
|
6
|
+
new (): NanoIncrement;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* Custom elements for Nanopore-Digital Web applications
|
|
3
|
+
*/
|
|
4
|
+
import { proxyCustomElement, HTMLElement, Host } from '@stencil/core/internal/client';
|
|
5
|
+
import { h } from './renderer.js';
|
|
6
|
+
import { d as defineCustomElement$4 } from './icon.js';
|
|
7
|
+
import { d as defineCustomElement$3 } from './icon-button.js';
|
|
8
|
+
import { d as defineCustomElement$2 } from './tooltip.js';
|
|
9
|
+
|
|
10
|
+
const incrementCss = ":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:inline-block}.root{display:grid;grid-template-columns:min-content auto 1fr;grid-template-rows:max-content max-content;align-items:stretch}::slotted(*){text-align:center}nano-icon-button{background:var(--nano-color-base-0);color:var(--nano-color-primary-1000);display:flex;border-radius:var(--nano-border-radius-pill);position:relative;z-index:1;inline-size:fit-content;block-size:100%}nano-icon-button:hover{background:var(--nano-color-primary-100)}nano-icon-button:active{background:var(--nano-color-primary-300)}nano-icon-button::part(base){border:1px solid var(--nano-color-neutral-300)}nano-icon-button::part(base):focus-visible{outline:var(--nano-focus-ring-color) solid 3px;outline-offset:-2px}.minus{grid-column:1;grid-row:1}.minus nano-icon-button{--padding:0.4375em 0.625em 0.4375em 1.125em;border-start-end-radius:0;border-end-end-radius:0}.minus nano-icon-button::part(base){border-inline-end:none}.plus{grid-column:3;grid-row:1}.plus nano-icon-button{--padding:0.4375em 1.125em 0.4375em 0.625em;border-start-start-radius:0;border-end-start-radius:0}.plus nano-icon-button::part(base){border-inline-start:none}";
|
|
11
|
+
|
|
12
|
+
const NanoIncrement$1 = /*@__PURE__*/ proxyCustomElement(class NanoIncrement extends HTMLElement {
|
|
13
|
+
constructor() {
|
|
14
|
+
super();
|
|
15
|
+
this.__registerHost();
|
|
16
|
+
this.__attachShadow();
|
|
17
|
+
}
|
|
18
|
+
get host() { return this; }
|
|
19
|
+
inputElement;
|
|
20
|
+
ignoreInputChange = false;
|
|
21
|
+
inputElementChanged(_newValue, oldValue) {
|
|
22
|
+
if (oldValue) {
|
|
23
|
+
oldValue.removeEventListener('nanoChange', this.inputChangeHandler);
|
|
24
|
+
}
|
|
25
|
+
if (this.inputElement) {
|
|
26
|
+
this.inputElement.label = this.inputElement.label || 'Increment value';
|
|
27
|
+
this.inputElement.hideLabel = true;
|
|
28
|
+
this.inputElement.type = 'number';
|
|
29
|
+
this.inputElement.max = this.inputElement.max || '10';
|
|
30
|
+
this.inputElement.min = this.inputElement.min || '0';
|
|
31
|
+
this.inputElement.step = this.inputElement.step || '1';
|
|
32
|
+
this.inputElement.value = this.inputElement.value || '0';
|
|
33
|
+
this.inputElement.addEventListener('nanoChange', this.inputChangeHandler);
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
inputChangeHandler = () => {
|
|
37
|
+
if (!this.ignoreInputChange) {
|
|
38
|
+
this.ignoreInputChange = true;
|
|
39
|
+
let value = Number(this.inputElement.value);
|
|
40
|
+
value = isNaN(value) ? 0 : value;
|
|
41
|
+
value = Math.max(value, parseFloat(this.inputElement.min) || 0);
|
|
42
|
+
value = Math.min(value, parseFloat(this.inputElement.max) || Infinity);
|
|
43
|
+
this.inputElement.value = value.toString();
|
|
44
|
+
requestAnimationFrame(() => {
|
|
45
|
+
this.ignoreInputChange = false;
|
|
46
|
+
});
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
handleSlotChange = () => {
|
|
50
|
+
this.inputElement = this.host.querySelector('nano-input');
|
|
51
|
+
};
|
|
52
|
+
handleMinus = () => {
|
|
53
|
+
if (this.inputElement) {
|
|
54
|
+
const currentValue = parseFloat(this.inputElement.value) || 0;
|
|
55
|
+
const step = parseFloat(this.inputElement.step) || 1;
|
|
56
|
+
const newValue = Math.max(currentValue - step, parseFloat(this.inputElement.min) || 0);
|
|
57
|
+
this.ignoreInputChange = true;
|
|
58
|
+
this.inputElement.value = newValue.toString();
|
|
59
|
+
this.ignoreInputChange = false;
|
|
60
|
+
}
|
|
61
|
+
};
|
|
62
|
+
handlePlus = () => {
|
|
63
|
+
if (this.inputElement) {
|
|
64
|
+
const currentValue = parseFloat(this.inputElement.value) || 0;
|
|
65
|
+
const step = parseFloat(this.inputElement.step) || 1;
|
|
66
|
+
const newValue = Math.min(currentValue + step, parseFloat(this.inputElement.max) || Infinity);
|
|
67
|
+
this.ignoreInputChange = true;
|
|
68
|
+
this.inputElement.value = newValue.toString();
|
|
69
|
+
this.ignoreInputChange = false;
|
|
70
|
+
}
|
|
71
|
+
};
|
|
72
|
+
componentWillLoad() {
|
|
73
|
+
this.handleSlotChange();
|
|
74
|
+
}
|
|
75
|
+
render() {
|
|
76
|
+
return (h(Host, { key: 'fab6b5bdecb8ccd3661d7054e08d66a46c2dd0a8', class: "nano-increment" }, h("div", { key: 'c064903981622ce66ac3a19efce6d595d59b7ed0', class: "root" }, h("div", { key: '447735cf16956d0ae172cc2bb1b3a7ffffd7fa0c', class: "minus" }, h("nano-icon-button", { key: '24e73eee061669ea0dd5423bae53886bed60478a', iconName: "light/minus", label: "Decrement", onClick: this.handleMinus })), h("slot", { key: '855358fe5a99004f52432dd42cf8c986f67afe69', onSlotchange: this.handleSlotChange }), h("div", { key: '17b1a5d9988023f4869489beffd697f4329a1d61', class: "plus" }, h("nano-icon-button", { key: '8b2e763e3f871355085e13b20a26f751c153a329', iconName: "light/plus", label: "Increment", onClick: this.handlePlus })))));
|
|
77
|
+
}
|
|
78
|
+
static get watchers() { return {
|
|
79
|
+
"inputElement": ["inputElementChanged"]
|
|
80
|
+
}; }
|
|
81
|
+
static get style() { return incrementCss; }
|
|
82
|
+
}, [257, "nano-increment", {
|
|
83
|
+
"inputElement": [32]
|
|
84
|
+
}, undefined, {
|
|
85
|
+
"inputElement": ["inputElementChanged"]
|
|
86
|
+
}]);
|
|
87
|
+
function defineCustomElement$1() {
|
|
88
|
+
if (typeof customElements === "undefined") {
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
const components = ["nano-increment", "nano-icon", "nano-icon-button", "nano-tooltip"];
|
|
92
|
+
components.forEach(tagName => { switch (tagName) {
|
|
93
|
+
case "nano-increment":
|
|
94
|
+
if (!customElements.get(tagName)) {
|
|
95
|
+
customElements.define(tagName, NanoIncrement$1);
|
|
96
|
+
}
|
|
97
|
+
break;
|
|
98
|
+
case "nano-icon":
|
|
99
|
+
if (!customElements.get(tagName)) {
|
|
100
|
+
defineCustomElement$4();
|
|
101
|
+
}
|
|
102
|
+
break;
|
|
103
|
+
case "nano-icon-button":
|
|
104
|
+
if (!customElements.get(tagName)) {
|
|
105
|
+
defineCustomElement$3();
|
|
106
|
+
}
|
|
107
|
+
break;
|
|
108
|
+
case "nano-tooltip":
|
|
109
|
+
if (!customElements.get(tagName)) {
|
|
110
|
+
defineCustomElement$2();
|
|
111
|
+
}
|
|
112
|
+
break;
|
|
113
|
+
} });
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
const NanoIncrement = NanoIncrement$1;
|
|
117
|
+
const defineCustomElement = defineCustomElement$1;
|
|
118
|
+
|
|
119
|
+
export { NanoIncrement, defineCustomElement };
|
|
@@ -144,7 +144,7 @@ const IntersectionObserve = /*@__PURE__*/ proxyCustomElement(class IntersectionO
|
|
|
144
144
|
this.removeIO();
|
|
145
145
|
}
|
|
146
146
|
render() {
|
|
147
|
-
return (h(Host, { key: '
|
|
147
|
+
return (h(Host, { key: 'be24c77cb033ff3fdb33b37cd8414edd99785795', class: "nano-intersection-observe" }, h("slot", { key: 'e1cf1e9175a9249c6f6f5b202d27a3f9bf937bac', ref: (slot) => (this.defaultSlot = slot), onSlotchange: this.handleSlotChange })));
|
|
148
148
|
}
|
|
149
149
|
static get watchers() { return {
|
|
150
150
|
"root": ["handleRootChange"],
|
|
@@ -7,7 +7,7 @@ import { t as transformTag, h } from './renderer.js';
|
|
|
7
7
|
import { H as HasSlotController } from './slot.js';
|
|
8
8
|
import { d as defineCustomElement$2 } from './icon.js';
|
|
9
9
|
|
|
10
|
-
const menuDrawerCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding-top:13px;--padding-end:13px;--padding-bottom:13px;--padding-start:13px;--icon-size:19px;--font-size:var(--nano-font-size-xs);--bg-color:var(--nano-color-
|
|
10
|
+
const menuDrawerCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding-top:13px;--padding-end:13px;--padding-bottom:13px;--padding-start:13px;--icon-size:19px;--font-size:var(--nano-font-size-xs);--bg-color:var(--nano-color-surface-50);--bg-color-hover:var(--nano-color-neutral-75);--bg-color-selected:var(--nano-color-neutral-300);--bg-color-open:var(--nano-color-neutral-300);--content-color:var(--nano-color-neutral-1400);--divider-color:var(--nano-color-neutral-300);--global-nav-height:76px;--menu-width:calc((var(--padding-end) + var(--padding-start)) + var(--icon-size));color-scheme:dark;display:block;z-index:1;background:var(--bg-color);color:var(--content-color);min-block-size:100%}:host(.hide){display:none}.head{border-block-end:var(--divider-color) 1px solid}.container{inset-inline-end:auto;color:var(--content-color);inline-size:var(--menu-width);transition:inline-size 0.3s ease;inset-block-start:var(--global-nav-height);position:sticky;display:flex;flex-direction:column;block-size:100%;max-block-size:calc(100vh - var(--global-nav-height))}:host(.open) .container{inline-size:auto}.content-wrap{inset-inline-start:0;inset-block-start:0;inline-size:inherit;background:var(--bg-color);font-size:var(--font-size);line-height:1;display:flex;flex-direction:column;align-items:stretch;flex:1;box-shadow:var(--nano-shadow-ls)}.content-wrap.secondary-open{box-shadow:none}.content-wrap::after{content:\"\";position:absolute;inset:calc(var(--global-nav-height) * -1) 0 0;background-color:var(--bg-color);z-index:-1}.content{inline-size:auto;display:flex;flex-direction:column;overflow:hidden visible;flex:1}.collapse-btn{all:unset;padding-block:6px;margin-block-start:5px;padding-inline:var(--padding-start) var(--padding-end);inline-size:100%;display:flex;justify-items:flex-start;appearance:none;cursor:pointer;font-size:var(--icon-size)}.collapse-btn:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.collapse-btn:hover{background-color:var(--bg-color-hover)}.collapse-btn:active{background-color:var(--bg-color-selected)}.collapse-btn .nano-icon{transition:var(--nano-transition-x-fast) rotate ease-in-out;rotate:0deg}:host(.open) .collapse-btn .nano-icon{rotate:180deg}.visually-hidden{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.foot{margin-block:auto var(--padding-bottom)}";
|
|
11
11
|
|
|
12
12
|
const MenuDrawer = /*@__PURE__*/ proxyCustomElement(class MenuDrawer extends HTMLElement {
|
|
13
13
|
constructor() {
|
|
@@ -25,6 +25,7 @@ const MenuDrawer = /*@__PURE__*/ proxyCustomElement(class MenuDrawer extends HTM
|
|
|
25
25
|
reset = false;
|
|
26
26
|
isLoading = true;
|
|
27
27
|
hide = false;
|
|
28
|
+
secondaryOpen = false;
|
|
28
29
|
/**
|
|
29
30
|
* Set the initial menu drawer open or closed
|
|
30
31
|
*/
|
|
@@ -37,6 +38,7 @@ const MenuDrawer = /*@__PURE__*/ proxyCustomElement(class MenuDrawer extends HTM
|
|
|
37
38
|
if (!ev.detail.secondaryMenu)
|
|
38
39
|
return;
|
|
39
40
|
ev.stopPropagation();
|
|
41
|
+
this.secondaryOpen = ev.type === 'nanoOpen';
|
|
40
42
|
}
|
|
41
43
|
openChange() {
|
|
42
44
|
if (Build.isBrowser) {
|
|
@@ -144,13 +146,14 @@ const MenuDrawer = /*@__PURE__*/ proxyCustomElement(class MenuDrawer extends HTM
|
|
|
144
146
|
}
|
|
145
147
|
}
|
|
146
148
|
render() {
|
|
147
|
-
return (h(Host, { key: '
|
|
149
|
+
return (h(Host, { key: '39da1804ff710702cacbbadf0d8bb1d47c2d732b', class: {
|
|
148
150
|
open: this.open,
|
|
151
|
+
'secondary-open': this.secondaryOpen,
|
|
149
152
|
hide: this.hide,
|
|
150
153
|
loading: this.isLoading,
|
|
151
154
|
'has-global-nav': !!this.globalNav,
|
|
152
155
|
'nano-menu-drawer': true,
|
|
153
|
-
}, dir: this.el.ownerDocument.dir === 'rtl' ? 'rtl' : null }, h("div", { key: '
|
|
156
|
+
}, dir: this.el.ownerDocument.dir === 'rtl' ? 'rtl' : null }, h("div", { key: '90b0e1a831d49af7d81fe5ca2da977a697c08ee7', ref: (div) => (this.containerDiv = div), class: "container" }, h("div", { key: '37d6443befe1a93169e15a8becbefe974c8a8d1c', class: `content-wrap ${this.secondaryOpen ? 'secondary-open' : ''}` }, h("nav", { key: '7373abf5ec1ef567407abedc4b786ae3d51c9e93', ref: (div) => (this.contentDiv = div), class: "content" }, h("div", { key: '6f243a3de7b59072d43fac86c1d9c8acd62ec9d4', class: "head" }, h("button", { key: '6bf443330190314bf84583fc540cd2cb821f4f53', onClick: this.toggle, class: "collapse-btn" }, h("nano-icon", { key: '87025c0165c2e61bd51724ef15e8e1b110ded3e4', name: "light/arrow-right-to-line" }), h("span", { key: '6bfd0162936fc4ce0546194a227960ce9dd718a1', class: "visually-hidden" }, "collapse / expand menu"))), h("slot", { key: '07039af321133321dedceaaff462472bd22b4f12' }), this.slotCtrl.has('foot') && (h("div", { key: '252fe22caae99dc7ba850207a92f9390665bf3c0', class: "foot" }, h("slot", { key: 'f142bd0852c6fa01fcc3fba2de5528d1d96d03b7', name: "foot" }))))))));
|
|
154
157
|
}
|
|
155
158
|
static get watchers() { return {
|
|
156
159
|
"open": ["openChange"]
|
|
@@ -161,7 +164,8 @@ const MenuDrawer = /*@__PURE__*/ proxyCustomElement(class MenuDrawer extends HTM
|
|
|
161
164
|
"hideWidth": [2, "hide-width"],
|
|
162
165
|
"reset": [32],
|
|
163
166
|
"isLoading": [32],
|
|
164
|
-
"hide": [32]
|
|
167
|
+
"hide": [32],
|
|
168
|
+
"secondaryOpen": [32]
|
|
165
169
|
}, [[0, "nanoOpen", "cancelNavItemEvents"], [0, "nanoClose", "cancelNavItemEvents"]], {
|
|
166
170
|
"open": ["openChange"]
|
|
167
171
|
}]);
|
|
@@ -54,8 +54,8 @@ const Rating = /*@__PURE__*/ proxyCustomElement(class Rating extends HTMLElement
|
|
|
54
54
|
this.handleShowHideElements();
|
|
55
55
|
}
|
|
56
56
|
render() {
|
|
57
|
-
return (h(Host, { key: '
|
|
58
|
-
h("div", { key: '
|
|
57
|
+
return (h(Host, { key: 'fbb60961810fe863ebebc729cbe4ecb955608c82', class: "nano-more-less" }, h("slot", { key: '6823f661e722640622d421c96244cd4a0eee1953', onSlotchange: () => this.handleShowHideElements() }), this.children?.length > this.maxToShow && [
|
|
58
|
+
h("div", { key: '134fadd869470a34cbd21b06d9cc2c85fc4e614c', style: { display: this.show ? 'none' : 'contents' }, class: "button-wrapper", part: "button-wrapper button-wrapper--less", onClick: (e) => this.handleClick(e) }, h("slot", { key: '62544d207ac12171da4905e3006e26113b1b0189', name: "less" }, h("button", { key: '54badba3d736faf5b2b686ec989998a4319c5001', part: "button button--less" }, "Show more (+", this.children.length - this.maxToShow, ")"))),
|
|
59
59
|
!this.noHideBtn ? (h("div", { style: { display: this.show ? 'contents' : 'none' }, class: "button-wrapper", part: "button-wrapper button-wrapper--more", onClick: (e) => this.handleClick(e) }, h("slot", { name: "more" }, h("button", { part: "button button--more" }, "Show less (-", this.children.length - this.maxToShow, ")")))) : (''),
|
|
60
60
|
]));
|
|
61
61
|
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../types/components";
|
|
2
|
+
|
|
3
|
+
interface NanoOptionBox extends Components.NanoOptionBox, HTMLElement {}
|
|
4
|
+
export const NanoOptionBox: {
|
|
5
|
+
prototype: NanoOptionBox;
|
|
6
|
+
new (): NanoOptionBox;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* Custom elements for Nanopore-Digital Web applications
|
|
3
|
+
*/
|
|
4
|
+
import { proxyCustomElement, HTMLElement } from '@stencil/core/internal/client';
|
|
5
|
+
|
|
6
|
+
const optionBoxCss = ":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}}";
|
|
7
|
+
|
|
8
|
+
const NanoOptionBox$1 = /*@__PURE__*/ proxyCustomElement(class NanoOptionBox extends HTMLElement {
|
|
9
|
+
constructor() {
|
|
10
|
+
super();
|
|
11
|
+
this.__registerHost();
|
|
12
|
+
}
|
|
13
|
+
static get style() { return optionBoxCss; }
|
|
14
|
+
}, [0, "nano-option-box"]);
|
|
15
|
+
function defineCustomElement$1() {
|
|
16
|
+
if (typeof customElements === "undefined") {
|
|
17
|
+
return;
|
|
18
|
+
}
|
|
19
|
+
const components = ["nano-option-box"];
|
|
20
|
+
components.forEach(tagName => { switch (tagName) {
|
|
21
|
+
case "nano-option-box":
|
|
22
|
+
if (!customElements.get(tagName)) {
|
|
23
|
+
customElements.define(tagName, NanoOptionBox$1);
|
|
24
|
+
}
|
|
25
|
+
break;
|
|
26
|
+
} });
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
const NanoOptionBox = NanoOptionBox$1;
|
|
30
|
+
const defineCustomElement = defineCustomElement$1;
|
|
31
|
+
|
|
32
|
+
export { NanoOptionBox, defineCustomElement };
|
|
@@ -194,20 +194,20 @@ const Rating = /*@__PURE__*/ proxyCustomElement(class Rating extends HTMLElement
|
|
|
194
194
|
else {
|
|
195
195
|
displayValue = this.isHovering ? this.hoverValue : this.value;
|
|
196
196
|
}
|
|
197
|
-
return (h(Host, { key: '
|
|
197
|
+
return (h(Host, { key: 'df7dc8a018d6d786e47134a2b9896a4cf2e87074', class: "nano-rating" }, h("label", { key: '7d9861c77bd39e075b1d9f75b24a5390efcbb42e', class: `rating-label${this.hideLabel ? ' visually-hidden' : ''}`, part: "label", htmlFor: this.name }, h("slot", { key: 'f2406ae04779c885c9968513d4e33d1b00ca8bde', name: "label" }, this.label)), h("input", { key: '50b8e5c1ef6b55ae88b48e4cf3d3ef83bb6a33f6', class: "range-input visually-hidden", name: this.name, id: this.name, disabled: this.disabled || this.readonly, required: this.required, value: this.value, onFocus: () => {
|
|
198
198
|
this.setFocus();
|
|
199
|
-
} }), h("div", { key: '
|
|
199
|
+
} }), h("div", { key: '1089a70fecbf338efbf3b2f5a8624c2c3c5ce56c', class: "rating-wrap" }, h("div", { key: '6552b5f9466c1ec0df3e69d9543d693fa90829d4', dir: this.isRtl ? 'rtl' : null, ref: (el) => (this.rating = el), part: "base", class: {
|
|
200
200
|
rating: true,
|
|
201
201
|
'rating--readonly': this.readonly,
|
|
202
202
|
'rating--disabled': this.disabled,
|
|
203
|
-
}, "aria-disabled": this.disabled ? 'true' : 'false', "aria-readonly": this.readonly ? 'true' : 'false', "aria-valuenow": this.value, "aria-valuemin": 0, "aria-valuemax": this.max, tabIndex: this.disabled ? -1 : 0, onClick: this.handleClick, onKeyDown: this.handleKeyDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onMouseMove: this.handleMouseMove, onFocus: this.handleFocus, onBlur: this.handleBlur }, h("span", { key: '
|
|
203
|
+
}, "aria-disabled": this.disabled ? 'true' : 'false', "aria-readonly": this.readonly ? 'true' : 'false', "aria-valuenow": this.value, "aria-valuemin": 0, "aria-valuemax": this.max, tabIndex: this.disabled ? -1 : 0, onClick: this.handleClick, onKeyDown: this.handleKeyDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onMouseMove: this.handleMouseMove, onFocus: this.handleFocus, onBlur: this.handleBlur }, h("span", { key: '1a741e52552009d9fe705aac22abbfa63b49e196', class: "rating__symbols rating__symbols--inactive" }, counter.map((index) => (h("span", { class: {
|
|
204
204
|
rating__symbol: true,
|
|
205
205
|
'rating__symbol--hover': this.isHovering && Math.ceil(displayValue) === index + 1,
|
|
206
206
|
},
|
|
207
207
|
// Users can click the current value to clear the rating. When this happens, we set this.isHovering to
|
|
208
208
|
// false to prevent the hover state from confusing them as they move the mouse out of the control. This
|
|
209
209
|
// extra mouseenter will reinstate it if they happen to mouse over an adjacent symbol.
|
|
210
|
-
onMouseEnter: this.handleMouseEnter, innerHTML: this.symbol(index + 1) })))), h("span", { key: '
|
|
210
|
+
onMouseEnter: this.handleMouseEnter, innerHTML: this.symbol(index + 1) })))), h("span", { key: 'd6368fb64cac9837f38bc00a06b63f2ef3ad3a74', ref: (span) => (this.indicator = span), class: "rating__symbols rating__symbols--indicator", style: {
|
|
211
211
|
clip: this.clip(displayValue),
|
|
212
212
|
} }, counter.map((index) => (h("span", { class: {
|
|
213
213
|
rating__symbol: true,
|
|
@@ -39,7 +39,7 @@ const Slide = /*@__PURE__*/ proxyCustomElement(class Slide extends HTMLElement {
|
|
|
39
39
|
});
|
|
40
40
|
}
|
|
41
41
|
render() {
|
|
42
|
-
return (h(Host, { key: '
|
|
42
|
+
return (h(Host, { key: 'a426e75ad5b607ac12e53db8183e08f89a10057a', class: "nano-slide" }, h("slot", { key: '792f06fe463ae49d981d7beceb68e4b7b49beff3' })));
|
|
43
43
|
}
|
|
44
44
|
static get watchers() { return {
|
|
45
45
|
"ready": ["readyChange"]
|
|
@@ -730,7 +730,7 @@ const Sortable = /*@__PURE__*/ proxyCustomElement(class Sortable extends HTMLEle
|
|
|
730
730
|
}
|
|
731
731
|
}
|
|
732
732
|
render() {
|
|
733
|
-
return (h(Host, { key: '
|
|
733
|
+
return (h(Host, { key: 'd6d4f0ad6adf2a3f5e1d36b757e116b58e5b55b4', class: "nano-sortable" }, h("div", { key: 'd2cfcad28acfb052acbc6093dddfc247f5369bcf', class: "sortable__live-region", "aria-live": "polite", "aria-relevant": "additions", "aria-atomic": "true", role: "log", part: "announcements" }, this.ariaTextList.map((str) => (h("div", null, str)))), h("slot", { key: '079bc29ba8c2f26163b7e3a23f0107f78db7b3fb' })));
|
|
734
734
|
}
|
|
735
735
|
static get watchers() { return {
|
|
736
736
|
"itemSelector": ["handleItemSelectorChange"],
|
|
@@ -24,10 +24,10 @@ const NanoTabContent$1 = /*@__PURE__*/ proxyCustomElement(class NanoTabContent e
|
|
|
24
24
|
requestAnimationFrame(() => (this.ready = true));
|
|
25
25
|
}
|
|
26
26
|
render() {
|
|
27
|
-
return (h(Host, { key: '
|
|
27
|
+
return (h(Host, { key: 'f182a99dab031220a40b2c5125d3229b8bacca1c', id: this.host.id || this.tabContentId, style: { display: this.active ? 'block' : 'none' }, role: "tabpanel", "aria-hidden": this.active ? 'false' : 'true', class: {
|
|
28
28
|
ready: this.ready,
|
|
29
29
|
'nano-tab-content': true,
|
|
30
|
-
} }, h("div", { key: '
|
|
30
|
+
} }, h("div", { key: '47b383859162b6a64518273a9057464de1d37479', part: "base", class: "nano-tab-content" }, h("slot", { key: '3f908fec081c956f9ffd8d7de5e0f45b5e193a8c' }))));
|
|
31
31
|
}
|
|
32
32
|
static get style() { return tabContentCss; }
|
|
33
33
|
}, [257, "nano-tab-content", {
|
|
@@ -49,12 +49,12 @@ const NanoTab$1 = /*@__PURE__*/ proxyCustomElement(class NanoTab extends HTMLEle
|
|
|
49
49
|
}
|
|
50
50
|
};
|
|
51
51
|
render() {
|
|
52
|
-
return (h(Host, { key: '
|
|
52
|
+
return (h(Host, { key: '7eca94a330509cbd3c6d232444fbcde422b755a6', id: this.host.id || this.tabId, role: "tab", "aria-disabled": this.disabled ? 'true' : 'false', "aria-selected": this.active ? 'true' : 'false', class: "nano-tab" }, h("div", { key: 'fca6ace8b5fc9c0142fcd04d70cb475323d8ef9d', part: `base${this.active ? ' base--active' : ''}${this.disabled ? ' base--disabled' : ''}${this.closable ? ' base--closable' : ''}`, class: {
|
|
53
53
|
tab: true,
|
|
54
54
|
'tab--active': this.active,
|
|
55
55
|
'tab--disabled': this.disabled,
|
|
56
56
|
'tab--closable': this.closable,
|
|
57
|
-
} }, h("slot", { key: '
|
|
57
|
+
} }, h("slot", { key: '3693ff8719b24c34db9018941daab7c840434502', name: "start" }), h("div", { key: 'c792fce22a28175e32f7e0b23a1a62f799016c76', part: "label", ref: (el) => (this.tab = el), tabindex: this.disabled || !this.active ? '-1' : '0', class: "tab__label" }, h("slot", { key: '76b725cd050993d377bf5c7208ce5b7fdf224136' })), h("slot", { key: 'f7bd50a43bb64b67b2ce181bf9215ada4c0ccd12', name: "end" }), this.closable && !this.disabled && (h("nano-icon-button", { key: '96f6bddd3dee12d2e8adeb7a59f98d0cfe8b9c82', label: "Close this tab", iconName: "light/xmark", class: "tab__close-button", onClick: this.handleCloseClick, onKeyDown: this.handleCloseKeydown, part: "close-button" })))));
|
|
58
58
|
}
|
|
59
59
|
static get style() { return tabCss; }
|
|
60
60
|
}, [257, "nano-tab", {
|
|
@@ -229,10 +229,10 @@ const NanoTable$1 = /*@__PURE__*/ proxyCustomElement(class NanoTable extends HTM
|
|
|
229
229
|
this.cleanUpObservers();
|
|
230
230
|
}
|
|
231
231
|
render() {
|
|
232
|
-
return (h(Host, { key: '
|
|
232
|
+
return (h(Host, { key: '61967ae8d9228be1374d9a4ee4e08b286cd4dd57', class: {
|
|
233
233
|
'nano-table': true,
|
|
234
234
|
'nano-table--props-ready': this.propsReady,
|
|
235
|
-
} }, this.scrollable && (h("nano-masked-overflow", { key: '
|
|
235
|
+
} }, this.scrollable && (h("nano-masked-overflow", { key: 'eca1991383ebca49f6032066078f02b62c839d6c', hideScrollbars: false, scrollControls: false, label: this.caption?.textContent || undefined, class: "nano-table__overflow-container" }, h("div", { key: 'f3bcb6830439858393c1eda96d68c2c5ccadd15a', class: "nano-table__overflow" }))), h("slot", { key: '7662741dcb672f75bae03c16b5745ff4946f12f7' })));
|
|
236
236
|
}
|
|
237
237
|
static get watchers() { return {
|
|
238
238
|
"compact": ["handleCompactChange"],
|
|
@@ -228,13 +228,13 @@ const ResizeObserve = /*@__PURE__*/ proxyCustomElement(class ResizeObserve exten
|
|
|
228
228
|
}
|
|
229
229
|
}
|
|
230
230
|
render() {
|
|
231
|
-
return (h(Host, { key: '
|
|
231
|
+
return (h(Host, { key: 'e5019ccd47c55fddcffd4fa5ff151b0d1db5465f', class: {
|
|
232
232
|
'nano-resize-observe': true,
|
|
233
233
|
'content-fit-x': this.contentFitX,
|
|
234
234
|
'content-fit-y': this.contentFitY,
|
|
235
235
|
'content-nofit-x': this.contentFitX === false,
|
|
236
236
|
'content-nofit-y': this.contentFitY === false,
|
|
237
|
-
} }, h("slot", { key: '
|
|
237
|
+
} }, h("slot", { key: '6117c97943bf1ca7368946dd17e356e2d866bbf3' }), !!this.notifyContentFit &&
|
|
238
238
|
(this.contentFitX !== null || this.contentFitY !== null) && [
|
|
239
239
|
this.contentFitX ? (h("slot", { name: "content-fit-x" })) : (h("slot", { name: "content-nofit-x" })),
|
|
240
240
|
this.contentFitY ? (h("slot", { name: "content-fit-y" })) : (h("slot", { name: "content-nofit-y" })),
|
|
@@ -711,30 +711,30 @@ const Select = /*@__PURE__*/ proxyCustomElement(class Select extends HTMLElement
|
|
|
711
711
|
disabled,
|
|
712
712
|
clearControl: this.clearable,
|
|
713
713
|
}))(this);
|
|
714
|
-
return (h(Host, { key: '
|
|
714
|
+
return (h(Host, { key: '83841b192717e301d098e3886cb3d44f7c517232', type: this.multiple ? 'select-multiple' : 'select-one', "aria-disabled": this.disabled ? 'true' : null, class: {
|
|
715
715
|
'has-value': !!this.value.length || !!this.inputSearchVal.length,
|
|
716
716
|
'has-focus': this.hasFocus,
|
|
717
717
|
'is-invalid': this._invalid === true,
|
|
718
718
|
'is-valid': this._invalid === false,
|
|
719
719
|
'nano-select': true,
|
|
720
|
-
} }, h(FormControlWrap, { key: '
|
|
720
|
+
} }, h(FormControlWrap, { key: 'c0a938ef46d167bbe5351913b1a73fcc39659b1d', ...wrapOptions, class: {
|
|
721
721
|
'has-error': !!this.errorMessage &&
|
|
722
722
|
this.showInlineError &&
|
|
723
723
|
this._invalid === true,
|
|
724
724
|
'has-helper': this.hasHelperSlot,
|
|
725
725
|
'is-open': this.hasOpened,
|
|
726
726
|
masked: this.mask,
|
|
727
|
-
} }, h(FormControl, { key: '
|
|
728
|
-
this.mask && (h("div", { key: '
|
|
729
|
-
h("input", { key: '
|
|
730
|
-
])), !this.readonly && !this.disabled && (h("nano-datalist", { key: '
|
|
727
|
+
} }, h(FormControl, { key: '704c73a69c5a3f661ed8926fc8980b952b9169be', ...controlOptions, ref: (el) => (this.selectWrap = el), onClearText: this.clearSelectValue, control: this.el, endValueSlot: h("slot", { name: "down-arrow" }, h("nano-icon", { class: "select__down-arrow", name: "light/chevron-down" })), showInlineError: this.showInlineError }, this.multiple && (h("div", { key: 'ef05cb7727be6b7c0ab67c7e9ebb8d1387903eb3', class: "select__multi-wrap select" }, this.multipleValues(labelId, moreId, helperEndId))), !this.multiple && [
|
|
728
|
+
this.mask && (h("div", { key: '3a58835bf8f059658238a717a8f71b896fe0b599', class: "select__mask" }, this.getLabel(this.value))),
|
|
729
|
+
h("input", { key: 'b74a7cedd698e6739ff3c81b4ef12710726b1a4d', ref: (input) => (this.inputCtrl = input), id: this.selectId, class: "select__native-input", "aria-labelledby": labelId + ' ' + moreId + ' ' + helperEndId, disabled: this.disabled, form: this.form, placeholder: this.placeholder, readonly: true, required: this.required, value: this.getLabel(this.value), onFocus: this.onFocus }),
|
|
730
|
+
])), !this.readonly && !this.disabled && (h("nano-datalist", { key: 'e7469592db6a1248d8cf32f2c8fd36364045ac49', ref: (el) => (this.datalist = el), selected: this.valArray, type: this.multiple ? 'selectMulti' : 'select', options: this._options.length ? this._options : undefined, onNanoDeselect: (e) => {
|
|
731
731
|
e.preventDefault();
|
|
732
732
|
this.removeValue(e.detail.value);
|
|
733
733
|
}, onNanoOptionsUpdated: this.setOptions, onNanoSelect: this.setValue,
|
|
734
734
|
// @ts-expect-error - this bubbles from the nano-dropdown
|
|
735
735
|
onNanoShow: () => (this.hasOpened = true), onNanoHide: () => (this.hasOpened = false) }, this.allowCustomValues &&
|
|
736
736
|
this.multiple &&
|
|
737
|
-
!!this.inputSearchVal && (h("nano-option", { key: '
|
|
737
|
+
!!this.inputSearchVal && (h("nano-option", { key: '50c0203767871b9a1dcf87d9b6e51a98cf62c72f', slot: "list-top", value: this.inputSearchVal, selected: false, label: this.inputSearchVal, onNanoSelect: () => this.inputCtrl.focus() }, h("span", { key: 'bfd78ea1f905f6d512e36f43c0e7bf417769d7ba', slot: "check-icon" }), "Add '", this.inputSearchVal, "'")), h("slot", { key: '67b82a4e86e472fb9bcf5c4173a9b202ea9402c5' }))), h("select", { key: 'e9a9ab79d35f38e1a20e98594ee1c0d11945eb1f', id: this.selectId + '-hidden', class: "select__native-ctrl", ref: (select) => (this.nativeSelect = select), "aria-labelledby": labelId + ' ' + moreId + ' ' + helperEndId, disabled: this.disabled, form: this.form, multiple: this.multiple, name: this.name, required: this.required, onInvalid: this.handleInvalid }, this.allowCustomValues &&
|
|
738
738
|
this.valArray.map((val) => {
|
|
739
739
|
return (h("option", { value: val, selected: true }, val));
|
|
740
740
|
}), !this.allowCustomValues &&
|
|
@@ -2961,15 +2961,15 @@ const Slides = /*@__PURE__*/ proxyCustomElement(class Slides extends HTMLElement
|
|
|
2961
2961
|
this.destroyflickity();
|
|
2962
2962
|
}
|
|
2963
2963
|
render() {
|
|
2964
|
-
return (h(Host, { key: '
|
|
2964
|
+
return (h(Host, { key: '25fe656149129885383046b7f2cb81ecc965db13', class: "nano-slides" }, h("div", { key: '84d9f878b91454a12311ffc5203d49a243fb9c66', class: {
|
|
2965
2965
|
slideshow: true,
|
|
2966
2966
|
ready: this.ready,
|
|
2967
2967
|
'not-ready': !this.ready,
|
|
2968
|
-
}, part: "base" }, h("div", { key: '
|
|
2968
|
+
}, part: "base" }, h("div", { key: 'b975dcadc6d7b7b5b7e915980527eba3bf740165', ref: (div) => (this.flickityEl = div), class: {
|
|
2969
2969
|
'flickity-container': true,
|
|
2970
2970
|
'slides-ready': this.slidesReady,
|
|
2971
2971
|
'slides-not-ready': !this.slidesReady,
|
|
2972
|
-
}, part: "slide-container" }, h("slot", { key: '
|
|
2972
|
+
}, part: "slide-container" }, h("slot", { key: 'a9b13e8e0c8808617c694953e3fef74a57d719a8' })), h("div", { key: '9caacd27973cc67740145365ab7a10c75ab44219', class: "ui-extras" }, h("slot", { key: 'ad80afb5ddbcc54b10310a4e115403fee8dda215', name: "ui" })))));
|
|
2973
2973
|
}
|
|
2974
2974
|
static get watchers() { return {
|
|
2975
2975
|
"options": ["optionsChanged"],
|
|
@@ -607,12 +607,12 @@ const Sticker = /*@__PURE__*/ proxyCustomElement(class Sticker extends HTMLEleme
|
|
|
607
607
|
this.hasBootstrapped = false;
|
|
608
608
|
}
|
|
609
609
|
render() {
|
|
610
|
-
return (h(Host, { key: '
|
|
610
|
+
return (h(Host, { key: 'f087d54cf3135fa7ba3d089f112157797efedaf2', sticky: !this.isRootSticker && !this.stickToEle && this.isSticky, hide: this.hide && this.isStuck, siblings: this.stuckCounter, index: this.stickerIndex, stuck: this.isStuck && this.isSticky, "placed-bottom": this.positions.includes('bottom'), "placed-top": this.positions.includes('top'), "placed-end": this.positions.includes('end'), "placed-start": this.positions.includes('start'), class: "nano-sticker" }, h("div", { key: 'db32b41390349cec6975dfad25b6b99ddadf5758', class: {
|
|
611
611
|
sticker: true,
|
|
612
612
|
sticky: this.isRootSticker && this.isSticky,
|
|
613
613
|
stuck: this.isStuck && this.isRootSticker && this.isSticky,
|
|
614
614
|
hide: this.isRootSticker && this.hide && this.isStuck,
|
|
615
|
-
}, ref: (div) => (this.sticker = div) }, h("div", { key: '
|
|
615
|
+
}, ref: (div) => (this.sticker = div) }, h("div", { key: 'b1e54c375552b7460fb6991f1c476bf9f73c997f', class: "sticker-content", ref: (div) => (this.content = div) }, h("slot", { key: 'a2ee69ba9e39d796d832340777f61deb21c2f5d1' })))));
|
|
616
616
|
}
|
|
617
617
|
static get watchers() { return {
|
|
618
618
|
"trigger": ["updateTriggerOffset"],
|
|
@@ -230,10 +230,10 @@ const Tooltip = /*@__PURE__*/ proxyCustomElement(class Tooltip extends HTMLEleme
|
|
|
230
230
|
this.popover.destroy();
|
|
231
231
|
}
|
|
232
232
|
render() {
|
|
233
|
-
return (h(Host, { key: '
|
|
233
|
+
return (h(Host, { key: '88500e56b7cc79e344604bfb9ffc54f2c7884c16', onKeyDown: this.handleKeyDown, onMouseOver: this.handleMouseOver, onMouseOut: this.handleMouseOut, onBlur: this.handleBlur, onFocus: this.handleFocus, onClick: this.handleClick, class: "nano-tooltip" }, h("slot", { key: '6ff00a2034648eb7cde6bb7e7ba1bc0dcf611238', onSlotchange: this.handleSlotChange }), h("div", { key: 'e278b67db89953ef0a174b50f5aa28e101e8e83d', ref: (el) => (this.tooltipPositioner = el), class: "tooltip-positioner", popover: "manual" }, h("div", { key: '226bc518e38502e1a864c26a265abb01cfdb918e', part: "base", ref: (el) => (this.tooltip = el), class: {
|
|
234
234
|
tooltip: true,
|
|
235
235
|
'tooltip--open': this.open,
|
|
236
|
-
}, role: "tooltip", "aria-hidden": this.open ? 'false' : 'true' }, h("slot", { key: '
|
|
236
|
+
}, role: "tooltip", "aria-hidden": this.open ? 'false' : 'true' }, h("slot", { key: '6245d2904946b690c9c3ea4e902fa5d789473110', name: "content", onSlotchange: () => this.setLabel() }, this.content), h("div", { key: '8ddc4c34d70107ade21b7b53827d3c37e6744d2e', class: "tooltip-arrow", "data-popper-arrow": true })))));
|
|
237
237
|
}
|
|
238
238
|
static get watchers() { return {
|
|
239
239
|
"content": ["setLabel"],
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import { F as Flickity, u as utils } from './nano-slides-
|
|
4
|
+
import { F as Flickity, u as utils } from './nano-slides-CI0F1FDY.js';
|
|
5
5
|
import './index-DgO0qeQ9.js';
|
|
6
6
|
import './renderer-T8etwwhk.js';
|
|
7
7
|
|
|
@@ -215,6 +215,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
|
|
|
215
215
|
return import(
|
|
216
216
|
/* webpackMode: "lazy" */
|
|
217
217
|
'./nano-in-page-nav.entry.js').then(processMod, consoleError);
|
|
218
|
+
case 'nano-increment':
|
|
219
|
+
return import(
|
|
220
|
+
/* webpackMode: "lazy" */
|
|
221
|
+
'./nano-increment.entry.js').then(processMod, consoleError);
|
|
218
222
|
case 'nano-intersection-observe':
|
|
219
223
|
return import(
|
|
220
224
|
/* webpackMode: "lazy" */
|
|
@@ -227,6 +231,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
|
|
|
227
231
|
return import(
|
|
228
232
|
/* webpackMode: "lazy" */
|
|
229
233
|
'./nano-more-less.entry.js').then(processMod, consoleError);
|
|
234
|
+
case 'nano-option-box':
|
|
235
|
+
return import(
|
|
236
|
+
/* webpackMode: "lazy" */
|
|
237
|
+
'./nano-option-box.entry.js').then(processMod, consoleError);
|
|
230
238
|
case 'nano-range':
|
|
231
239
|
return import(
|
|
232
240
|
/* webpackMode: "lazy" */
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Custom elements for Nanopore-Digital Web applications
|
|
3
3
|
*/
|
|
4
|
-
import { F as Flickity, u as utils } from './nano-slides-
|
|
4
|
+
import { F as Flickity, u as utils } from './nano-slides-CI0F1FDY.js';
|
|
5
5
|
import './index-DgO0qeQ9.js';
|
|
6
6
|
import './renderer-T8etwwhk.js';
|
|
7
7
|
|