nve-designsystem 4.4.2 → 4.6.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/components/nve-aspect-rose/nve-aspect-rose.component.d.ts +40 -0
- package/components/nve-aspect-rose/nve-aspect-rose.component.js +90 -0
- package/components/nve-aspect-rose/nve-aspect-rose.styles.d.ts +2 -0
- package/components/nve-aspect-rose/nve-aspect-rose.styles.js +27 -0
- package/components/nve-exposed-height/nve-exposed-height.component.d.ts +53 -0
- package/components/nve-exposed-height/nve-exposed-height.component.js +183 -0
- package/components/nve-exposed-height/nve-exposed-height.styles.d.ts +2 -0
- package/components/nve-exposed-height/nve-exposed-height.styles.js +39 -0
- package/custom-elements.json +208 -0
- package/nve-designsystem.d.ts +2 -0
- package/nve-designsystem.js +44 -42
- package/package.json +1 -4
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { LitElement } from 'lit';
|
|
2
|
+
import { INveComponent } from '../../interfaces/NveComponent.interface';
|
|
3
|
+
/**
|
|
4
|
+
* Viser utsatte himmelretninger som en kompassrose.
|
|
5
|
+
* Rosen er delt opp i 8 sektorer. Utsatte sektorer vises i rødt.
|
|
6
|
+
* Er laget for å vise hvilke himmelretninger et skredproblem gjelder for, men kan selvfølgelig også brukes til andre ting.
|
|
7
|
+
* @cssproperty --aspect-rose-size - Høyde og bredde på komponenten. 90px er standard.
|
|
8
|
+
* @cssproperty --aspect-rose-outline-color - Farge på sirkelens omriss. Standard er #c6c6c5.
|
|
9
|
+
* @cssproperty --aspect-rose-affected-color - Farge på utsatte sektorer. Standard er #d21523.
|
|
10
|
+
* @cssproperty --aspect-rose-unaffected-color - Farge på ikke-utsatte sektorer. Standard er #e3e3e3.
|
|
11
|
+
*/
|
|
12
|
+
export default class NveAspectRose extends LitElement implements INveComponent {
|
|
13
|
+
testId: string | undefined;
|
|
14
|
+
/**
|
|
15
|
+
* 8-tegns binærtekst som representerer utsatte sektorer.
|
|
16
|
+
* Starter med nordlig sektor og går deretter med klokka.
|
|
17
|
+
* Eksempel: "00111110"
|
|
18
|
+
*/
|
|
19
|
+
value: string;
|
|
20
|
+
/** Språk for himmelretningene. Blir satt til engelsk om lang starter på 'en'. Standard er norsk. */
|
|
21
|
+
lang: string;
|
|
22
|
+
/**
|
|
23
|
+
* Tilgjengelig tittel.
|
|
24
|
+
* Vises som aria-label på SVG-elementet og som <title> i SVG.
|
|
25
|
+
* Standardverdi avhenger av språket: 'Utsatte sektorer' for norsk, 'Affected aspects' for engelsk.
|
|
26
|
+
* Du kan overstyre denne teksten.
|
|
27
|
+
*/
|
|
28
|
+
label: string | undefined;
|
|
29
|
+
static styles: import('lit').CSSResult[];
|
|
30
|
+
private isEnglish;
|
|
31
|
+
private get effectiveLabel();
|
|
32
|
+
private get directions();
|
|
33
|
+
private readonly rotations;
|
|
34
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
35
|
+
}
|
|
36
|
+
declare global {
|
|
37
|
+
interface HTMLElementTagNameMap {
|
|
38
|
+
'nve-aspect-rose': NveAspectRose;
|
|
39
|
+
}
|
|
40
|
+
}
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
import { a as e, s as t, t as n } from "../../chunks/lit.js";
|
|
2
|
+
import { o as r, s as i, t as a } from "../../chunks/decorate.js";
|
|
3
|
+
import { t as o } from "../../chunks/if-defined.js";
|
|
4
|
+
import s from "./nve-aspect-rose.styles.js";
|
|
5
|
+
//#region src/components/nve-aspect-rose/nve-aspect-rose.component.ts
|
|
6
|
+
var c = class extends n {
|
|
7
|
+
constructor(...e) {
|
|
8
|
+
super(...e), this.testId = void 0, this.value = "00000000", this.lang = "no", this.label = void 0, this.rotations = [
|
|
9
|
+
-22.5,
|
|
10
|
+
22.5,
|
|
11
|
+
67.5,
|
|
12
|
+
112.5,
|
|
13
|
+
157.5,
|
|
14
|
+
202.5,
|
|
15
|
+
247.5,
|
|
16
|
+
292.5
|
|
17
|
+
];
|
|
18
|
+
}
|
|
19
|
+
static {
|
|
20
|
+
this.styles = [s];
|
|
21
|
+
}
|
|
22
|
+
isEnglish() {
|
|
23
|
+
return this.lang.toLowerCase().startsWith("en");
|
|
24
|
+
}
|
|
25
|
+
get effectiveLabel() {
|
|
26
|
+
return this.label ?? (this.isEnglish() ? "Affected aspects" : "Utsatte sektorer");
|
|
27
|
+
}
|
|
28
|
+
get directions() {
|
|
29
|
+
return [
|
|
30
|
+
{
|
|
31
|
+
cx: 45,
|
|
32
|
+
cy: 9,
|
|
33
|
+
label: "N"
|
|
34
|
+
},
|
|
35
|
+
{
|
|
36
|
+
cx: 81,
|
|
37
|
+
cy: 45,
|
|
38
|
+
label: this.isEnglish() ? "E" : "Ø"
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
cx: 45,
|
|
42
|
+
cy: 81,
|
|
43
|
+
label: "S"
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
cx: 9,
|
|
47
|
+
cy: 45,
|
|
48
|
+
label: this.isEnglish() ? "W" : "V"
|
|
49
|
+
}
|
|
50
|
+
];
|
|
51
|
+
}
|
|
52
|
+
render() {
|
|
53
|
+
let n = /^[01]{8}$/.test(this.value) ? this.value : "00000000";
|
|
54
|
+
return e`
|
|
55
|
+
<svg
|
|
56
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
57
|
+
viewBox="0 0 90 90"
|
|
58
|
+
width="100%"
|
|
59
|
+
height="100%"
|
|
60
|
+
role="img"
|
|
61
|
+
aria-label=${this.effectiveLabel}
|
|
62
|
+
testid=${o(this.testId)}
|
|
63
|
+
>
|
|
64
|
+
${t`<title>${this.effectiveLabel}</title>`}
|
|
65
|
+
<g>
|
|
66
|
+
${this.rotations.map((e, r) => t`
|
|
67
|
+
<path
|
|
68
|
+
d="M 45 9 A 36 36 0 0 1 70.45584412271572 19.54415587728429 L 45 45 Z"
|
|
69
|
+
transform="rotate(${e} 45 45)"
|
|
70
|
+
stroke-width="1"
|
|
71
|
+
stroke="var(--aspect-rose-outline-color, #c6c6c5)"
|
|
72
|
+
class=${n[r] === "1" ? "sector-affected" : "sector-unaffected"}
|
|
73
|
+
></path>
|
|
74
|
+
`)}
|
|
75
|
+
<circle cx="45" cy="45" r="36" fill="none" stroke-width="1" class="circle-outline"></circle>
|
|
76
|
+
</g>
|
|
77
|
+
${this.directions.map(({ cx: e, cy: n, label: r }) => t`
|
|
78
|
+
<g>
|
|
79
|
+
<circle cx=${e} cy=${n} r="7.2" stroke-width="1" stroke="var(--aspect-rose-outline-color, #c6c6c5)" fill="#fff"></circle>
|
|
80
|
+
<text x=${e} y=${n} dy="3.168" text-anchor="middle" fill="#6a7a7b">${r}</text>
|
|
81
|
+
</g>
|
|
82
|
+
`)}
|
|
83
|
+
</svg>
|
|
84
|
+
`;
|
|
85
|
+
}
|
|
86
|
+
};
|
|
87
|
+
a([r({ type: String })], c.prototype, "testId", void 0), a([r({ type: String })], c.prototype, "value", void 0), a([r({ type: String })], c.prototype, "lang", void 0), a([r({ type: String })], c.prototype, "label", void 0), c = a([i("nve-aspect-rose")], c);
|
|
88
|
+
var l = c;
|
|
89
|
+
//#endregion
|
|
90
|
+
export { l as default };
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { u as e } from "../../chunks/lit.js";
|
|
2
|
+
//#region src/components/nve-aspect-rose/nve-aspect-rose.styles.ts
|
|
3
|
+
var t = e`
|
|
4
|
+
:host {
|
|
5
|
+
display: inline-block;
|
|
6
|
+
width: var(--aspect-rose-size, 90px);
|
|
7
|
+
height: var(--aspect-rose-size, 90px);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
text {
|
|
11
|
+
font-family: 'Source Sans 3', sans-serif;
|
|
12
|
+
font-weight: var(--font-weight-regular);
|
|
13
|
+
font-size: 0.67rem;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.circle-outline {
|
|
17
|
+
stroke: var(--aspect-rose-outline-color, #c6c6c5);
|
|
18
|
+
}
|
|
19
|
+
.sector-affected {
|
|
20
|
+
fill: var(--aspect-rose-affected-color, #d21523);
|
|
21
|
+
}
|
|
22
|
+
.sector-unaffected {
|
|
23
|
+
fill: var(--aspect-rose-unaffected-color, #e3e3e3);
|
|
24
|
+
}
|
|
25
|
+
`;
|
|
26
|
+
//#endregion
|
|
27
|
+
export { t as default };
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { LitElement } from 'lit';
|
|
2
|
+
import { INveComponent } from '../../interfaces/NveComponent.interface';
|
|
3
|
+
/**
|
|
4
|
+
* Visualisering av utsatt høyde for et skredproblem.
|
|
5
|
+
* Viser et fjell med fargelegging av utsatt høyde i tillegg til piler og høydegrenser.
|
|
6
|
+
* @cssproperty --exposed-height-affected-color - Farge på utsatte høyde. Standard er #d21523.
|
|
7
|
+
* @cssproperty --exposed-height-unaffected-color - Farge på ikke-utsatt høyde. Standard er #e3e3e3.
|
|
8
|
+
* @cssproperty --exposed-height-width - Bredde på hele komponenten. Standard er 150px.
|
|
9
|
+
*/
|
|
10
|
+
export default class NveExposedHeight extends LitElement implements INveComponent {
|
|
11
|
+
/** Type fyll: 1=over, 2=under, 3=over og under, 4=mellom */
|
|
12
|
+
variant: 1 | 2 | 3 | 4;
|
|
13
|
+
/** Første høydeverdi i meter */
|
|
14
|
+
height1: number;
|
|
15
|
+
/** Andre høydeverdi i meter (for variant 3 og 4) */
|
|
16
|
+
height2: number;
|
|
17
|
+
/** Språk for aria-label. Blir satt til engelsk om lang starter på 'en'. Standard er norsk. */
|
|
18
|
+
lang: string;
|
|
19
|
+
testId: string | undefined;
|
|
20
|
+
static styles: import('lit').CSSResult[];
|
|
21
|
+
private isEnglish;
|
|
22
|
+
/** Tegne-instruksjoner for enten to- eller tre-delt fjell, avhengig av variant */
|
|
23
|
+
private createMountainGeometry;
|
|
24
|
+
/**
|
|
25
|
+
* Lager geometri og fargeklasser for tegning av fjellet
|
|
26
|
+
* @param variant hver variant har forskjellig geometri og fargelegging
|
|
27
|
+
* @returns Et objekt som inneholder SVG-paths og tilhørende fargeklasser for aktuell variant
|
|
28
|
+
*/
|
|
29
|
+
private createMountainPath;
|
|
30
|
+
/** Lager geometri for pil */
|
|
31
|
+
private createArrowPath;
|
|
32
|
+
/** Lager SVG-elementer for fjellet */
|
|
33
|
+
private renderMountain;
|
|
34
|
+
/** Lager SVG-elementer for piler og etiketter */
|
|
35
|
+
private renderArrowsAndLabels;
|
|
36
|
+
/** Lager SVG-element for pil. Hvis rotation er angitt, snus pila på hodet */
|
|
37
|
+
private renderArrow;
|
|
38
|
+
/** Lager SVG-element for tekst */
|
|
39
|
+
private renderText;
|
|
40
|
+
/** Lager ARIA-label for SVG-elementet */
|
|
41
|
+
private getAriaLabel;
|
|
42
|
+
/** Returnerer den høyeste av de to høydene */
|
|
43
|
+
private get maxHeight();
|
|
44
|
+
/** Returnerer den laveste av de to høydene */
|
|
45
|
+
private get minHeight();
|
|
46
|
+
/** Tegn komponenten */
|
|
47
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
48
|
+
}
|
|
49
|
+
declare global {
|
|
50
|
+
interface HTMLElementTagNameMap {
|
|
51
|
+
'nve-exposed-height': NveExposedHeight;
|
|
52
|
+
}
|
|
53
|
+
}
|
|
@@ -0,0 +1,183 @@
|
|
|
1
|
+
import { a as e, s as t, t as n } from "../../chunks/lit.js";
|
|
2
|
+
import { o as r, s as i, t as a } from "../../chunks/decorate.js";
|
|
3
|
+
import o from "./nve-exposed-height.styles.js";
|
|
4
|
+
//#region src/components/nve-exposed-height/nve-exposed-height.component.ts
|
|
5
|
+
var s = class extends n {
|
|
6
|
+
constructor(...e) {
|
|
7
|
+
super(...e), this.variant = 1, this.height1 = 0, this.height2 = 0, this.lang = "no", this.testId = void 0;
|
|
8
|
+
}
|
|
9
|
+
static {
|
|
10
|
+
this.styles = [o];
|
|
11
|
+
}
|
|
12
|
+
isEnglish() {
|
|
13
|
+
return this.lang.toLowerCase().startsWith("en");
|
|
14
|
+
}
|
|
15
|
+
createMountainGeometry(e) {
|
|
16
|
+
return e === 1 || e === 2 ? {
|
|
17
|
+
top: "M34.1299,22.8691 L20.1809,1.0741 C19.7079,0.3711 19.1749,0.0461 18.5749,0.0961 C17.9749,0.1461 17.4999,0.5581 17.1459,1.3301 L8.5139,18.9511 C10.8769,18.8161 12.7759,20.6831 12.7759,20.6831 C13.8629,21.6761 14.2179,22.0151 16.1509,22.0291 C19.1399,22.0511 20.0179,20.7691 22.0269,21.4881 C24.3919,22.3371 25.3159,23.3921 27.1709,24.5401 C29.9429,26.2481 31.3449,26.2291 33.0259,25.1611 C33.0259,25.1611 34.6099,24.2071 34.1299,22.8691",
|
|
18
|
+
bottom: "M6.4121,23.752 L1.0791,34.822 C0.6321,35.565 0.5661,36.549 0.8771,37.084 C1.1851,37.623 1.7671,38.58 2.6191,38.58 L39.6821,38.58 C40.5341,38.58 41.1151,37.623 41.4251,37.084 C41.7341,36.549 41.6681,35.219 41.2231,34.479 L36.2291,26.217 C36.4201,27.445 34.3141,28.854 34.3141,28.854 C32.6091,29.992 30.3481,29.959 27.8371,28.975 C25.7441,28.152 24.4491,26.895 22.4571,25.955 C20.4671,25.012 19.3401,26.041 16.5901,26.281 C14.9531,26.424 13.9711,26.166 12.6221,25.324 C12.6221,25.324 9.9561,23.752 6.4601,23.752 L6.4121,23.752 Z"
|
|
19
|
+
} : {
|
|
20
|
+
top: "M23.917,10.0605 L19.813,2.6985 C19.387,2.0665 18.906,1.7735 18.367,1.8185 C17.826,1.8645 17.4,2.2345 17.08,2.9285 L14.471,8.8895 L14.384,9.0545 C14.384,9.0545 16.84,8.2885 18.863,9.4345 C20.521,10.3725 21.144,11.3805 23.917,10.0605",
|
|
21
|
+
middle: "M34.2402,27.625 C34.2402,28.483 33.0472,29.218 33.0472,29.218 C31.3652,30.286 29.3092,30.762 26.6252,28.92 C24.6822,27.587 23.7362,26.562 21.4802,25.868 C19.4402,25.241 18.5942,26.431 15.6052,26.409 C13.6722,26.396 13.2832,25.827 12.2282,25.063 C12.2282,25.063 10.6742,23.747 8.6982,23.268 L8.0602,23.169 L12.9712,12.208 C12.9712,12.208 16.3302,11.472 18.5802,12.745 C20.4222,13.788 23.3102,15.342 25.7672,13.209 L34.2402,27.625",
|
|
22
|
+
bottom: "M5.9922,27.7842 L0.8322,39.2022 C0.3852,39.9442 0.3202,40.9292 0.6312,41.4642 C0.9392,42.0032 1.5212,42.9602 2.3732,42.9602 L39.4352,42.9602 C40.2872,42.9602 40.8692,42.0032 41.1782,41.4642 C41.4882,40.9292 41.4222,39.5982 40.9762,38.8582 L36.0102,30.6382 C35.9552,31.7022 34.0682,33.2332 34.0682,33.2332 C32.3632,34.3722 30.1012,34.3392 27.5902,33.3542 C25.4982,32.5322 24.2032,31.2742 22.2112,30.3352 C20.2212,29.3912 19.0942,30.4212 16.3442,30.6612 C14.7072,30.8042 13.7242,30.5462 12.3752,29.7042 C12.3752,29.7042 9.9982,27.7842 6.5022,27.7842 L5.9922,27.7842 Z"
|
|
23
|
+
};
|
|
24
|
+
}
|
|
25
|
+
createMountainPath(e) {
|
|
26
|
+
let t = {
|
|
27
|
+
1: {
|
|
28
|
+
topClass: "mountain-danger",
|
|
29
|
+
bottomClass: "mountain-safe"
|
|
30
|
+
},
|
|
31
|
+
2: {
|
|
32
|
+
topClass: "mountain-safe",
|
|
33
|
+
bottomClass: "mountain-danger"
|
|
34
|
+
},
|
|
35
|
+
3: {
|
|
36
|
+
topClass: "mountain-danger",
|
|
37
|
+
middleClass: "mountain-safe",
|
|
38
|
+
bottomClass: "mountain-danger"
|
|
39
|
+
},
|
|
40
|
+
4: {
|
|
41
|
+
topClass: "mountain-safe",
|
|
42
|
+
middleClass: "mountain-danger",
|
|
43
|
+
bottomClass: "mountain-safe"
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
return {
|
|
47
|
+
...this.createMountainGeometry(e),
|
|
48
|
+
...t[e]
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
createArrowPath() {
|
|
52
|
+
return "M11.92,8 L7.96,8 L7.96,16 L3.98,16 L3.98,8 L0,8 L5.96,0 Z";
|
|
53
|
+
}
|
|
54
|
+
renderMountain(e) {
|
|
55
|
+
return this.variant === 3 || this.variant === 4 ? t`
|
|
56
|
+
<path d="${e.top}" class="${e.topClass}" stroke-width="0.5" />
|
|
57
|
+
<path d="${e.middle}" class="${e.middleClass}" stroke-width="0.5" />
|
|
58
|
+
<path d="${e.bottom}" class="${e.bottomClass}" stroke-width="0.5" />
|
|
59
|
+
` : t`
|
|
60
|
+
<path d="${e.top}" class="${e.topClass}" stroke-width="0.5" />
|
|
61
|
+
<path d="${e.bottom}" class="${e.bottomClass}" stroke-width="0.5" />
|
|
62
|
+
`;
|
|
63
|
+
}
|
|
64
|
+
renderArrowsAndLabels() {
|
|
65
|
+
let e = this.variant === 3 || this.variant === 4 ? -6 : 0, n = (this.variant === 3 || this.variant === 4 ? 47 : 39) / 2 + e, { groupHeight: r, arrows: i, texts: a } = {
|
|
66
|
+
1: {
|
|
67
|
+
groupHeight: 28,
|
|
68
|
+
arrows: [{
|
|
69
|
+
y: 0,
|
|
70
|
+
rotation: 0
|
|
71
|
+
}],
|
|
72
|
+
texts: [{
|
|
73
|
+
y: 30,
|
|
74
|
+
text: `${this.height1}m`,
|
|
75
|
+
xOffset: 5.96,
|
|
76
|
+
centered: !0
|
|
77
|
+
}]
|
|
78
|
+
},
|
|
79
|
+
2: {
|
|
80
|
+
groupHeight: 28,
|
|
81
|
+
arrows: [{
|
|
82
|
+
y: 12,
|
|
83
|
+
rotation: 180
|
|
84
|
+
}],
|
|
85
|
+
texts: [{
|
|
86
|
+
y: 8,
|
|
87
|
+
text: `${this.height1}m`,
|
|
88
|
+
xOffset: 5.96,
|
|
89
|
+
centered: !0
|
|
90
|
+
}]
|
|
91
|
+
},
|
|
92
|
+
3: {
|
|
93
|
+
groupHeight: 38,
|
|
94
|
+
arrows: [{
|
|
95
|
+
y: 0,
|
|
96
|
+
rotation: 0
|
|
97
|
+
}, {
|
|
98
|
+
y: 22,
|
|
99
|
+
rotation: 180
|
|
100
|
+
}],
|
|
101
|
+
texts: [{
|
|
102
|
+
y: 16,
|
|
103
|
+
text: `${this.maxHeight}m`,
|
|
104
|
+
xOffset: 16,
|
|
105
|
+
centered: !1
|
|
106
|
+
}, {
|
|
107
|
+
y: 30,
|
|
108
|
+
text: `${this.minHeight}m`,
|
|
109
|
+
xOffset: 16,
|
|
110
|
+
centered: !1
|
|
111
|
+
}]
|
|
112
|
+
},
|
|
113
|
+
4: {
|
|
114
|
+
groupHeight: 40,
|
|
115
|
+
arrows: [{
|
|
116
|
+
y: 0,
|
|
117
|
+
rotation: 180
|
|
118
|
+
}, {
|
|
119
|
+
y: 24,
|
|
120
|
+
rotation: 0
|
|
121
|
+
}],
|
|
122
|
+
texts: [{
|
|
123
|
+
y: 22,
|
|
124
|
+
text: `${this.minHeight}-${this.maxHeight}m`,
|
|
125
|
+
xOffset: 12,
|
|
126
|
+
centered: !1
|
|
127
|
+
}]
|
|
128
|
+
}
|
|
129
|
+
}[this.variant];
|
|
130
|
+
return t`
|
|
131
|
+
<g transform="translate(55, ${n - r / 2})">
|
|
132
|
+
${i.map((e) => this.renderArrow(e.y, e.rotation))}
|
|
133
|
+
${a.map((e) => this.renderText(e.y, e.text, e.xOffset, e.centered))}
|
|
134
|
+
</g>
|
|
135
|
+
`;
|
|
136
|
+
}
|
|
137
|
+
renderArrow(e, n) {
|
|
138
|
+
return t`
|
|
139
|
+
<g transform="translate(0, ${e})${n === 0 ? "" : " rotate(180 5.96 8)"}">
|
|
140
|
+
<path d="${this.createArrowPath()}" class="arrow" />
|
|
141
|
+
</g>
|
|
142
|
+
`;
|
|
143
|
+
}
|
|
144
|
+
renderText(e, n, r, i) {
|
|
145
|
+
return t`<text x="${r}" y="${e}" class="${i ? "height-label centered" : "height-label"}">${n}</text>`;
|
|
146
|
+
}
|
|
147
|
+
getAriaLabel() {
|
|
148
|
+
let e = this.isEnglish() ? "Exposed height" : "Utsatt høyde", t = this.isEnglish() ? "Between" : "Mellom", n = this.isEnglish() ? "and" : "og", r = this.isEnglish() ? "meters" : "meter";
|
|
149
|
+
switch (this.variant) {
|
|
150
|
+
case 1: return `${e}: Over ${this.height1} ${r}`;
|
|
151
|
+
case 2: return `${e}: Under ${this.height1} ${r}`;
|
|
152
|
+
case 3: return `${e}: Under ${this.minHeight} ${r} ${n} over ${this.maxHeight} ${r}`;
|
|
153
|
+
case 4: return `${e}: ${t} ${this.minHeight} ${n} ${this.maxHeight} ${r}`;
|
|
154
|
+
default: return "";
|
|
155
|
+
}
|
|
156
|
+
}
|
|
157
|
+
get maxHeight() {
|
|
158
|
+
return Math.max(this.height1, this.height2);
|
|
159
|
+
}
|
|
160
|
+
get minHeight() {
|
|
161
|
+
return Math.min(this.height1, this.height2);
|
|
162
|
+
}
|
|
163
|
+
render() {
|
|
164
|
+
let t = this.createMountainPath(this.variant), n = this.variant === 3 || this.variant === 4 ? -6 : 0, r = this.variant === 3 || this.variant === 4;
|
|
165
|
+
return e`
|
|
166
|
+
<svg
|
|
167
|
+
class="exposed-height"
|
|
168
|
+
viewBox="-2 ${r ? -6 : -2} 120 ${r ? 48 : 46}"
|
|
169
|
+
preserveAspectRatio="xMidYMid meet"
|
|
170
|
+
role="img"
|
|
171
|
+
aria-label="${this.getAriaLabel()}"
|
|
172
|
+
testid=${this.testId}
|
|
173
|
+
>
|
|
174
|
+
<g transform="translate(0, ${n})">${this.renderMountain(t)}</g>
|
|
175
|
+
${this.renderArrowsAndLabels()}
|
|
176
|
+
</svg>
|
|
177
|
+
`;
|
|
178
|
+
}
|
|
179
|
+
};
|
|
180
|
+
a([r({ type: Number })], s.prototype, "variant", void 0), a([r({ type: Number })], s.prototype, "height1", void 0), a([r({ type: Number })], s.prototype, "height2", void 0), a([r({ type: String })], s.prototype, "lang", void 0), a([r({ type: String })], s.prototype, "testId", void 0), s = a([i("nve-exposed-height")], s);
|
|
181
|
+
var c = s;
|
|
182
|
+
//#endregion
|
|
183
|
+
export { c as default };
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { u as e } from "../../chunks/lit.js";
|
|
2
|
+
//#region src/components/nve-exposed-height/nve-exposed-height.styles.ts
|
|
3
|
+
var t = e`
|
|
4
|
+
:host {
|
|
5
|
+
display: inline-block;
|
|
6
|
+
width: var(--exposed-height-width, 150px);
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.exposed-height {
|
|
10
|
+
width: 100%;
|
|
11
|
+
height: auto; /* auto = maintains aspect ratio from intrinsic width/height */
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.mountain-danger {
|
|
15
|
+
fill: var(--exposed-height-affected-color, #d21523);
|
|
16
|
+
stroke: var(--exposed-height-affected-color, #d21523);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.mountain-safe {
|
|
20
|
+
fill: var(--exposed-height-unaffected-color, #e3e3e3);
|
|
21
|
+
stroke: var(--exposed-height-unaffected-color, #e3e3e3);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.arrow {
|
|
25
|
+
fill: var(--exposed-height-affected-color, #d21523);
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.height-label {
|
|
29
|
+
font-family: 'Source Sans 3', sans-serif;
|
|
30
|
+
font-weight: var(--font-weight-regular);
|
|
31
|
+
font-size: 0.67rem;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.height-label.centered {
|
|
35
|
+
text-anchor: middle;
|
|
36
|
+
}
|
|
37
|
+
`;
|
|
38
|
+
//#endregion
|
|
39
|
+
export { t as default };
|
package/custom-elements.json
CHANGED
|
@@ -441,6 +441,102 @@
|
|
|
441
441
|
}
|
|
442
442
|
]
|
|
443
443
|
},
|
|
444
|
+
{
|
|
445
|
+
"kind": "javascript-module",
|
|
446
|
+
"path": "components/nve-aspect-rose/nve-aspect-rose.js",
|
|
447
|
+
"declarations": [
|
|
448
|
+
{
|
|
449
|
+
"kind": "class",
|
|
450
|
+
"description": "Viser utsatte himmelretninger som en kompassrose. Rosen er delt opp i 8 sektorer. Utsatte sektorer vises i rødt. Er laget for å vise hvilke himmelretninger et skredproblem gjelder for, men kan selvfølgelig også brukes til andre ting.",
|
|
451
|
+
"name": "NveAspectRose",
|
|
452
|
+
"members": [
|
|
453
|
+
{
|
|
454
|
+
"kind": "field",
|
|
455
|
+
"name": "testId",
|
|
456
|
+
"type": {
|
|
457
|
+
"text": "string | undefined"
|
|
458
|
+
},
|
|
459
|
+
"default": "undefined"
|
|
460
|
+
},
|
|
461
|
+
{
|
|
462
|
+
"kind": "field",
|
|
463
|
+
"name": "value",
|
|
464
|
+
"type": {
|
|
465
|
+
"text": "string"
|
|
466
|
+
},
|
|
467
|
+
"default": "'00000000'",
|
|
468
|
+
"description": "8-tegns binærtekst som representerer utsatte sektorer. Starter med nordlig sektor og går deretter med klokka. Eksempel: \"00111110\""
|
|
469
|
+
},
|
|
470
|
+
{
|
|
471
|
+
"kind": "field",
|
|
472
|
+
"name": "lang",
|
|
473
|
+
"type": {
|
|
474
|
+
"text": "string"
|
|
475
|
+
},
|
|
476
|
+
"default": "'no'",
|
|
477
|
+
"description": "Språk for himmelretningene. Blir satt til engelsk om lang starter på 'en'. Standard er norsk."
|
|
478
|
+
},
|
|
479
|
+
{
|
|
480
|
+
"kind": "field",
|
|
481
|
+
"name": "label",
|
|
482
|
+
"type": {
|
|
483
|
+
"text": "string | undefined"
|
|
484
|
+
},
|
|
485
|
+
"default": "undefined",
|
|
486
|
+
"description": "Tilgjengelig tittel. Vises som aria-label på SVG-elementet og som <title> i SVG. Standardverdi avhenger av språket: 'Utsatte sektorer' for norsk, 'Affected aspects' for engelsk. Du kan overstyre denne teksten."
|
|
487
|
+
}
|
|
488
|
+
],
|
|
489
|
+
"attributes": [
|
|
490
|
+
{
|
|
491
|
+
"name": "testId",
|
|
492
|
+
"type": {
|
|
493
|
+
"text": "string | undefined"
|
|
494
|
+
}
|
|
495
|
+
},
|
|
496
|
+
{
|
|
497
|
+
"name": "value",
|
|
498
|
+
"type": {
|
|
499
|
+
"text": "string"
|
|
500
|
+
},
|
|
501
|
+
"description": "8-tegns binærtekst som representerer utsatte sektorer. Starter med nordlig sektor og går deretter med klokka. Eksempel: \"00111110\""
|
|
502
|
+
},
|
|
503
|
+
{
|
|
504
|
+
"name": "lang",
|
|
505
|
+
"type": {
|
|
506
|
+
"text": "string"
|
|
507
|
+
},
|
|
508
|
+
"description": "Språk for himmelretningene. Blir satt til engelsk om lang starter på 'en'. Standard er norsk."
|
|
509
|
+
},
|
|
510
|
+
{
|
|
511
|
+
"name": "label",
|
|
512
|
+
"type": {
|
|
513
|
+
"text": "string | undefined"
|
|
514
|
+
},
|
|
515
|
+
"description": "Tilgjengelig tittel. Vises som aria-label på SVG-elementet og som <title> i SVG. Standardverdi avhenger av språket: 'Utsatte sektorer' for norsk, 'Affected aspects' for engelsk. Du kan overstyre denne teksten."
|
|
516
|
+
}
|
|
517
|
+
],
|
|
518
|
+
"superclass": {
|
|
519
|
+
"name": "LitElement",
|
|
520
|
+
"package": "lit"
|
|
521
|
+
},
|
|
522
|
+
"tagNameWithoutPrefix": "aspect-rose",
|
|
523
|
+
"tagName": "nve-aspect-rose",
|
|
524
|
+
"customElement": true,
|
|
525
|
+
"jsDoc": "/**\n * Viser utsatte himmelretninger som en kompassrose.\n * Rosen er delt opp i 8 sektorer. Utsatte sektorer vises i rødt.\n * Er laget for å vise hvilke himmelretninger et skredproblem gjelder for, men kan selvfølgelig også brukes til andre ting.\n * @cssproperty --aspect-rose-size - Høyde og bredde på komponenten. 90px er standard.\n * @cssproperty --aspect-rose-outline-color - Farge på sirkelens omriss. Standard er #c6c6c5.\n * @cssproperty --aspect-rose-affected-color - Farge på utsatte sektorer. Standard er #d21523.\n * @cssproperty --aspect-rose-unaffected-color - Farge på ikke-utsatte sektorer. Standard er #e3e3e3.\n */",
|
|
526
|
+
"modulePath": "src/components/nve-aspect-rose/nve-aspect-rose.component.ts"
|
|
527
|
+
}
|
|
528
|
+
],
|
|
529
|
+
"exports": [
|
|
530
|
+
{
|
|
531
|
+
"kind": "js",
|
|
532
|
+
"name": "default",
|
|
533
|
+
"declaration": {
|
|
534
|
+
"name": "NveAspectRose",
|
|
535
|
+
"module": "components/nve-aspect-rose/nve-aspect-rose.js"
|
|
536
|
+
}
|
|
537
|
+
}
|
|
538
|
+
]
|
|
539
|
+
},
|
|
444
540
|
{
|
|
445
541
|
"kind": "javascript-module",
|
|
446
542
|
"path": "components/nve-badge/nve-badge.js",
|
|
@@ -2133,6 +2229,118 @@
|
|
|
2133
2229
|
}
|
|
2134
2230
|
]
|
|
2135
2231
|
},
|
|
2232
|
+
{
|
|
2233
|
+
"kind": "javascript-module",
|
|
2234
|
+
"path": "components/nve-exposed-height/nve-exposed-height.js",
|
|
2235
|
+
"declarations": [
|
|
2236
|
+
{
|
|
2237
|
+
"kind": "class",
|
|
2238
|
+
"description": "Visualisering av utsatt høyde for et skredproblem. Viser et fjell med fargelegging av utsatt høyde i tillegg til piler og høydegrenser.",
|
|
2239
|
+
"name": "NveExposedHeight",
|
|
2240
|
+
"members": [
|
|
2241
|
+
{
|
|
2242
|
+
"kind": "field",
|
|
2243
|
+
"name": "variant",
|
|
2244
|
+
"type": {
|
|
2245
|
+
"text": "1 | 2 | 3 | 4"
|
|
2246
|
+
},
|
|
2247
|
+
"default": "1",
|
|
2248
|
+
"description": "Type fyll: 1=over, 2=under, 3=over og under, 4=mellom"
|
|
2249
|
+
},
|
|
2250
|
+
{
|
|
2251
|
+
"kind": "field",
|
|
2252
|
+
"name": "height1",
|
|
2253
|
+
"type": {
|
|
2254
|
+
"text": "number"
|
|
2255
|
+
},
|
|
2256
|
+
"default": "0",
|
|
2257
|
+
"description": "Første høydeverdi i meter"
|
|
2258
|
+
},
|
|
2259
|
+
{
|
|
2260
|
+
"kind": "field",
|
|
2261
|
+
"name": "height2",
|
|
2262
|
+
"type": {
|
|
2263
|
+
"text": "number"
|
|
2264
|
+
},
|
|
2265
|
+
"default": "0",
|
|
2266
|
+
"description": "Andre høydeverdi i meter (for variant 3 og 4)"
|
|
2267
|
+
},
|
|
2268
|
+
{
|
|
2269
|
+
"kind": "field",
|
|
2270
|
+
"name": "lang",
|
|
2271
|
+
"type": {
|
|
2272
|
+
"text": "string"
|
|
2273
|
+
},
|
|
2274
|
+
"default": "'no'",
|
|
2275
|
+
"description": "Språk for aria-label. Blir satt til engelsk om lang starter på 'en'. Standard er norsk."
|
|
2276
|
+
},
|
|
2277
|
+
{
|
|
2278
|
+
"kind": "field",
|
|
2279
|
+
"name": "testId",
|
|
2280
|
+
"type": {
|
|
2281
|
+
"text": "string | undefined"
|
|
2282
|
+
},
|
|
2283
|
+
"default": "undefined"
|
|
2284
|
+
}
|
|
2285
|
+
],
|
|
2286
|
+
"attributes": [
|
|
2287
|
+
{
|
|
2288
|
+
"name": "variant",
|
|
2289
|
+
"type": {
|
|
2290
|
+
"text": "1 | 2 | 3 | 4"
|
|
2291
|
+
},
|
|
2292
|
+
"description": "Type fyll: 1=over, 2=under, 3=over og under, 4=mellom"
|
|
2293
|
+
},
|
|
2294
|
+
{
|
|
2295
|
+
"name": "height1",
|
|
2296
|
+
"type": {
|
|
2297
|
+
"text": "number"
|
|
2298
|
+
},
|
|
2299
|
+
"description": "Første høydeverdi i meter"
|
|
2300
|
+
},
|
|
2301
|
+
{
|
|
2302
|
+
"name": "height2",
|
|
2303
|
+
"type": {
|
|
2304
|
+
"text": "number"
|
|
2305
|
+
},
|
|
2306
|
+
"description": "Andre høydeverdi i meter (for variant 3 og 4)"
|
|
2307
|
+
},
|
|
2308
|
+
{
|
|
2309
|
+
"name": "lang",
|
|
2310
|
+
"type": {
|
|
2311
|
+
"text": "string"
|
|
2312
|
+
},
|
|
2313
|
+
"description": "Språk for aria-label. Blir satt til engelsk om lang starter på 'en'. Standard er norsk."
|
|
2314
|
+
},
|
|
2315
|
+
{
|
|
2316
|
+
"name": "testId",
|
|
2317
|
+
"type": {
|
|
2318
|
+
"text": "string | undefined"
|
|
2319
|
+
}
|
|
2320
|
+
}
|
|
2321
|
+
],
|
|
2322
|
+
"superclass": {
|
|
2323
|
+
"name": "LitElement",
|
|
2324
|
+
"package": "lit"
|
|
2325
|
+
},
|
|
2326
|
+
"tagNameWithoutPrefix": "exposed-height",
|
|
2327
|
+
"tagName": "nve-exposed-height",
|
|
2328
|
+
"customElement": true,
|
|
2329
|
+
"jsDoc": "/**\n * Visualisering av utsatt høyde for et skredproblem.\n * Viser et fjell med fargelegging av utsatt høyde i tillegg til piler og høydegrenser.\n * @cssproperty --exposed-height-affected-color - Farge på utsatte høyde. Standard er #d21523.\n * @cssproperty --exposed-height-unaffected-color - Farge på ikke-utsatt høyde. Standard er #e3e3e3.\n * @cssproperty --exposed-height-width - Bredde på hele komponenten. Standard er 150px.\n */",
|
|
2330
|
+
"modulePath": "src/components/nve-exposed-height/nve-exposed-height.component.ts"
|
|
2331
|
+
}
|
|
2332
|
+
],
|
|
2333
|
+
"exports": [
|
|
2334
|
+
{
|
|
2335
|
+
"kind": "js",
|
|
2336
|
+
"name": "default",
|
|
2337
|
+
"declaration": {
|
|
2338
|
+
"name": "NveExposedHeight",
|
|
2339
|
+
"module": "components/nve-exposed-height/nve-exposed-height.js"
|
|
2340
|
+
}
|
|
2341
|
+
}
|
|
2342
|
+
]
|
|
2343
|
+
},
|
|
2136
2344
|
{
|
|
2137
2345
|
"kind": "javascript-module",
|
|
2138
2346
|
"path": "components/nve-heading/nve-heading.js",
|
package/nve-designsystem.d.ts
CHANGED
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
export { default as NveAccordion } from './components/nve-accordion/nve-accordion.component';
|
|
4
4
|
export { default as NveAccordionItem } from './components/nve-accordion-item/nve-accordion-item.component';
|
|
5
5
|
export { default as NveAlert } from './components/nve-alert/nve-alert.component';
|
|
6
|
+
export { default as NveAspectRose } from './components/nve-aspect-rose/nve-aspect-rose.component';
|
|
6
7
|
export { default as NveBadge } from './components/nve-badge/nve-badge.component';
|
|
7
8
|
export { default as NveButton } from './components/nve-button/nve-button.component';
|
|
8
9
|
export { default as NveCarousel } from './components/nve-carousel/nve-carousel.component';
|
|
@@ -16,6 +17,7 @@ export { default as NveDialog } from './components/nve-dialog/nve-dialog.compone
|
|
|
16
17
|
export { default as NveDivider } from './components/nve-divider/nve-divider.component';
|
|
17
18
|
export { default as NveDrawer } from './components/nve-drawer/nve-drawer.component';
|
|
18
19
|
export { default as NveDropdown } from './components/nve-dropdown/nve-dropdown.component';
|
|
20
|
+
export { default as NveExposedHeight } from './components/nve-exposed-height/nve-exposed-height.component';
|
|
19
21
|
export { default as NveHeading } from './components/nve-heading/nve-heading.component';
|
|
20
22
|
export { default as NveIcon } from './components/nve-icon/nve-icon.component';
|
|
21
23
|
export { default as NveInput } from './components/nve-input/nve-input.component';
|
package/nve-designsystem.js
CHANGED
|
@@ -2,45 +2,47 @@ import e from "./components/nve-accordion/nve-accordion.component.js";
|
|
|
2
2
|
import t from "./components/nve-accordion-item/nve-accordion-item.component.js";
|
|
3
3
|
import { t as n } from "./chunks/nve-alert.component.js";
|
|
4
4
|
import r from "./components/nve-icon/nve-icon.component.js";
|
|
5
|
-
import i from "./components/nve-
|
|
6
|
-
import a from "./components/nve-
|
|
7
|
-
import
|
|
8
|
-
import { t as s } from "./chunks/nve-carousel
|
|
9
|
-
import c from "./
|
|
10
|
-
import
|
|
11
|
-
import { t as u } from "./chunks/nve-
|
|
12
|
-
import { t as d } from "./chunks/nve-
|
|
13
|
-
import { t as f } from "./chunks/nve-
|
|
14
|
-
import { t as p } from "./chunks/nve-
|
|
15
|
-
import { t as m } from "./chunks/nve-
|
|
16
|
-
import { t as h } from "./chunks/nve-
|
|
17
|
-
import { t as g } from "./chunks/nve-
|
|
18
|
-
import _ from "./
|
|
19
|
-
import v from "./components/nve-
|
|
20
|
-
import
|
|
21
|
-
import { t as b } from "./chunks/nve-
|
|
22
|
-
import { t as x } from "./chunks/nve-
|
|
23
|
-
import { t as S } from "./chunks/nve-
|
|
24
|
-
import C from "./
|
|
25
|
-
import w from "./components/nve-
|
|
26
|
-
import
|
|
27
|
-
import E from "./components/nve-
|
|
28
|
-
import D from "./
|
|
29
|
-
import O from "./components/nve-
|
|
30
|
-
import
|
|
31
|
-
import
|
|
32
|
-
import { t as j } from "./chunks/nve-radio
|
|
33
|
-
import M from "./
|
|
34
|
-
import { t as N } from "./chunks/nve-
|
|
35
|
-
import
|
|
36
|
-
import { t as F } from "./chunks/nve-
|
|
37
|
-
import I from "./
|
|
38
|
-
import L from "./
|
|
39
|
-
import R from "./components/nve-
|
|
40
|
-
import z from "./components/nve-
|
|
41
|
-
import B from "./components/nve-
|
|
42
|
-
import V from "./components/nve-tab
|
|
43
|
-
import H from "./components/nve-
|
|
44
|
-
import U from "./components/nve-
|
|
45
|
-
import
|
|
46
|
-
|
|
5
|
+
import i from "./components/nve-aspect-rose/nve-aspect-rose.component.js";
|
|
6
|
+
import a from "./components/nve-badge/nve-badge.component.js";
|
|
7
|
+
import o from "./components/nve-button/nve-button.component.js";
|
|
8
|
+
import { t as s } from "./chunks/nve-carousel.component.js";
|
|
9
|
+
import { t as c } from "./chunks/nve-carousel-item.component.js";
|
|
10
|
+
import l from "./components/nve-carousel-thumbnail/nve-carousel-thumbnail.component.js";
|
|
11
|
+
import { t as u } from "./chunks/nve-checkbox.component.js";
|
|
12
|
+
import { t as d } from "./chunks/nve-label.component.js";
|
|
13
|
+
import { t as f } from "./chunks/nve-tooltip.component.js";
|
|
14
|
+
import { t as p } from "./chunks/nve-checkbox-group.component.js";
|
|
15
|
+
import { t as m } from "./chunks/nve-popup.component.js";
|
|
16
|
+
import { t as h } from "./chunks/nve-input.component.js";
|
|
17
|
+
import { t as g } from "./chunks/nve-menu.component.js";
|
|
18
|
+
import { t as _ } from "./chunks/nve-option.component.js";
|
|
19
|
+
import v from "./components/nve-combobox/nve-combobox.component.js";
|
|
20
|
+
import y from "./components/nve-darkmode-switch/nve-darkmode-switch.component.js";
|
|
21
|
+
import { t as b } from "./chunks/nve-dialog.component.js";
|
|
22
|
+
import { t as x } from "./chunks/nve-divider.component.js";
|
|
23
|
+
import { t as S } from "./chunks/nve-drawer.component.js";
|
|
24
|
+
import { t as C } from "./chunks/nve-dropdown.component.js";
|
|
25
|
+
import w from "./components/nve-exposed-height/nve-exposed-height.component.js";
|
|
26
|
+
import T from "./components/nve-heading/nve-heading.component.js";
|
|
27
|
+
import E from "./components/nve-link-card/nve-link-card.component.js";
|
|
28
|
+
import { t as D } from "./chunks/nve-menu-item.component.js";
|
|
29
|
+
import O from "./components/nve-message-card/nve-message-card.component.js";
|
|
30
|
+
import k from "./components/nve-navigation-card/nve-navigation-card.component.js";
|
|
31
|
+
import A from "./components/nve-paragraph/nve-paragraph.component.js";
|
|
32
|
+
import { t as j } from "./chunks/nve-radio.component.js";
|
|
33
|
+
import { t as M } from "./chunks/nve-radio-button.component.js";
|
|
34
|
+
import { t as N } from "./chunks/nve-radio-group.component.js";
|
|
35
|
+
import P from "./components/nve-relative-time/nve-relative-time.component.js";
|
|
36
|
+
import { t as F } from "./chunks/nve-select.component.js";
|
|
37
|
+
import { t as I } from "./chunks/nve-skeleton.component.js";
|
|
38
|
+
import { t as L } from "./chunks/nve-spinner.component.js";
|
|
39
|
+
import R from "./components/nve-stepper/nve-step/nve-step.component.js";
|
|
40
|
+
import z from "./components/nve-stepper/nve-stepper.component.js";
|
|
41
|
+
import B from "./components/nve-switch/nve-switch.component.js";
|
|
42
|
+
import V from "./components/nve-tab/nve-tab.component.js";
|
|
43
|
+
import H from "./components/nve-tab-group/nve-tab-group.component.js";
|
|
44
|
+
import U from "./components/nve-tab-panel/nve-tab-panel.component.js";
|
|
45
|
+
import W from "./components/nve-tag/nve-tag.component.js";
|
|
46
|
+
import G from "./components/nve-textarea/nve-textarea.component.js";
|
|
47
|
+
import { t as K } from "./chunks/nve-warning-level.component.js";
|
|
48
|
+
export { e as NveAccordion, t as NveAccordionItem, n as NveAlert, i as NveAspectRose, a as NveBadge, o as NveButton, s as NveCarousel, c as NveCarouselItem, l as NveCarouselThumbnail, u as NveCheckbox, p as NveCheckboxGroup, v as NveCombobox, y as NveDarkmodeSwitch, b as NveDialog, x as NveDivider, S as NveDrawer, C as NveDropdown, w as NveExposedHeight, T as NveHeading, r as NveIcon, h as NveInput, d as NveLabel, E as NveLinkCard, g as NveMenu, D as NveMenuItem, O as NveMessageCard, k as NveNavigationCard, _ as NveOption, A as NveParagraph, m as NvePopup, j as NveRadio, M as NveRadioButton, N as NveRadioGroup, P as NveRelativeTime, F as NveSelect, I as NveSkeleton, L as NveSpinner, R as NveStep, z as NveStepper, B as NveSwitch, V as NveTab, H as NveTabGroup, U as NveTabPanel, W as NveTag, G as NveTextarea, f as NveTooltip, K as NveWarningLevel };
|
package/package.json
CHANGED
|
@@ -11,11 +11,8 @@
|
|
|
11
11
|
},
|
|
12
12
|
"license": "MIT",
|
|
13
13
|
"homepage": "https://github.com/NVE/Designsystem/",
|
|
14
|
-
"version": "4.
|
|
14
|
+
"version": "4.6.0",
|
|
15
15
|
"customElements": "dist/custom-elements.json",
|
|
16
|
-
"engines": {
|
|
17
|
-
"node": "^24.16.0"
|
|
18
|
-
},
|
|
19
16
|
"exports": {
|
|
20
17
|
".": {
|
|
21
18
|
"import": "./nve-designsystem.js",
|