@folkehelseinstituttet/designsystem 0.38.1 → 0.38.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/fhi-body.js +32 -49
  2. package/fhi-body.js.map +1 -1
  3. package/fhi-display.js +29 -52
  4. package/fhi-display.js.map +1 -1
  5. package/fhi-headline.js +25 -48
  6. package/fhi-headline.js.map +1 -1
  7. package/fhi-label.js +23 -42
  8. package/fhi-label.js.map +1 -1
  9. package/fhi-title.js +35 -54
  10. package/fhi-title.js.map +1 -1
  11. package/package.json +1 -1
  12. package/web-types.json +1 -1
package/fhi-body.js CHANGED
@@ -1,43 +1,26 @@
1
- import { i as g, n, a as f, b as p, t as y } from "./property-B2Ico5CW.js";
2
- var m = Object.defineProperty, d = Object.getOwnPropertyDescriptor, s = (t, r, o, a) => {
3
- for (var e = a > 1 ? void 0 : a ? d(r, o) : r, l = t.length - 1, h; l >= 0; l--)
4
- (h = t[l]) && (e = (a ? h(r, o, e) : h(e)) || e);
5
- return a && e && m(r, o, e), e;
1
+ import { i as p, n as y, a as n, b as f, t as g } from "./property-B2Ico5CW.js";
2
+ var d = Object.defineProperty, c = Object.getOwnPropertyDescriptor, s = (e, i, a, r) => {
3
+ for (var t = r > 1 ? void 0 : r ? c(i, a) : i, h = e.length - 1, l; h >= 0; h--)
4
+ (l = e[h]) && (t = (r ? l(i, a, t) : l(t)) || t);
5
+ return r && t && d(i, a, t), t;
6
6
  };
7
- const v = "fhi-body";
8
- let i = class extends f {
7
+ const m = "fhi-body";
8
+ let o = class extends n {
9
9
  constructor() {
10
10
  super(...arguments), this.size = "medium";
11
11
  }
12
- updated(t) {
13
- super.updated(t), t.has("color") && (this.style.color = typeof this.color == "string" ? this.color : "var(--fhi-color-neutral-text-default)");
12
+ updated(e) {
13
+ super.updated(e), e.has("color") && (this.style.color = typeof this.color == "string" ? this.color : "var(--fhi-color-neutral-text-default)");
14
14
  }
15
15
  render() {
16
- return p`
16
+ return f`
17
17
  <span class="body">
18
18
  <slot></slot>
19
19
  </span>
20
20
  `;
21
21
  }
22
22
  };
23
- i.styles = g`
24
- :host {
25
- --font-size-large: var(--fhi-typography-body-large-font-size);
26
- --font-weight-large: var(--fhi-typography-body-large-font-weight);
27
- --line-height-large: var(--fhi-typography-body-large-line-height);
28
- --letter-spacing-large: var(--fhi-typography-body-large-letter-spacing);
29
-
30
- --font-size-medium: var(--fhi-typography-body-medium-font-size);
31
- --font-weight-medium: var(--fhi-typography-body-medium-font-weight);
32
- --line-height-medium: var(--fhi-typography-body-medium-line-height);
33
- --letter-spacing-medium: var(--fhi-typography-body-medium-letter-spacing);
34
-
35
- --font-size-small: var(--fhi-typography-body-small-font-size);
36
- --font-weight-small: var(--fhi-typography-body-small-font-weight);
37
- --line-height-small: var(--fhi-typography-body-small-line-height);
38
- --letter-spacing-small: var(--fhi-typography-body-small-letter-spacing);
39
- }
40
-
23
+ o.styles = p`
41
24
  :host {
42
25
  display: block;
43
26
  contain: layout;
@@ -51,42 +34,42 @@ i.styles = g`
51
34
 
52
35
  :host([size='large']) {
53
36
  .body {
54
- font-size: var(--font-size-large);
55
- font-weight: var(--font-weight-large);
56
- line-height: var(--line-height-large);
57
- letter-spacing: var(--letter-spacing-large);
37
+ font-size: var(--fhi-typography-body-large-font-size);
38
+ font-weight: var(--fhi-typography-body-large-font-weight);
39
+ line-height: var(--fhi-typography-body-large-line-height);
40
+ letter-spacing: var(--fhi-typography-body-large-letter-spacing);
58
41
  }
59
42
  }
60
43
 
61
44
  :host([size='medium']) {
62
45
  .body {
63
- font-size: var(--font-size-medium);
64
- font-weight: var(--font-weight-medium);
65
- line-height: var(--line-height-medium);
66
- letter-spacing: var(--letter-spacing-medium);
46
+ font-size: var(--fhi-typography-body-medium-font-size);
47
+ font-weight: var(--fhi-typography-body-medium-font-weight);
48
+ line-height: var(--fhi-typography-body-medium-line-height);
49
+ letter-spacing: var(--fhi-typography-body-medium-letter-spacing);
67
50
  }
68
51
  }
69
52
 
70
53
  :host([size='small']) {
71
54
  .body {
72
- font-size: var(--font-size-small);
73
- font-weight: var(--font-weight-small);
74
- line-height: var(--line-height-small);
75
- letter-spacing: var(--letter-spacing-small);
55
+ font-size: var(--fhi-typography-body-small-font-size);
56
+ font-weight: var(--fhi-typography-body-small-font-weight);
57
+ line-height: var(--fhi-typography-body-small-line-height);
58
+ letter-spacing: var(--fhi-typography-body-small-letter-spacing);
76
59
  }
77
60
  }
78
61
  `;
79
62
  s([
80
- n({ type: String, reflect: !0 })
81
- ], i.prototype, "size", 2);
63
+ y({ type: String, reflect: !0 })
64
+ ], o.prototype, "size", 2);
82
65
  s([
83
- n({ type: String })
84
- ], i.prototype, "color", 2);
85
- i = s([
86
- y(v)
87
- ], i);
66
+ y({ type: String })
67
+ ], o.prototype, "color", 2);
68
+ o = s([
69
+ g(m)
70
+ ], o);
88
71
  export {
89
- i as FhiBody,
90
- v as FhiBodySelector
72
+ o as FhiBody,
73
+ m as FhiBodySelector
91
74
  };
92
75
  //# sourceMappingURL=fhi-body.js.map
package/fhi-body.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"fhi-body.js","sources":["../../src/components/typography/fhi-body/fhi-body.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nexport const FhiBodySelector = 'fhi-body';\n\n/**\n * ## FHI Body\n *\n * {@link https://designsystem.fhi.no/?path=/story/komponenter-typography-body--preview}\n *\n * The `<fhi-body>` component is used to display body text in accordance with the FHI Design System guidelines.\n * Use this component instead of the standard HTML paragraph element, `<p>`, to ensure consistent styling across your application.\n *\n * @tag fhi-body\n * @element fhi-body\n *\n * @slot - The content of the fhi-body component. This should be pure text.\n */\n@customElement(FhiBodySelector)\nexport class FhiBody extends LitElement {\n /**\n * Sets the font size of the given text.\n * @reflect\n * @type {'large' | 'medium' | 'small'}\n */\n @property({ type: String, reflect: true }) size:\n | 'large'\n | 'medium'\n | 'small' = 'medium';\n\n /**\n * Sets color of the given text. It supports any valid CSS color value (e.g. hex, rgb, rgba, hsl, hsla, color names).\n *\n * It is recommended to use Design Tokens for colors defined in the FHI Design System.\n * See: {@link https://designsystem.fhi.no/?path=/docs/design-tokens-farger--docs}\n *\n * Example:\n * ```html\n * <fhi-body color=\"var(--fhi-color-primary-text-default)\">\n * This text will be in the primary text color.\n * </fhi-body>\n * ```\n *\n * @type {string}\n */\n @property({ type: String }) color?: string;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('color')) {\n this.style.color =\n typeof this.color === 'string'\n ? this.color\n : 'var(--fhi-color-neutral-text-default)';\n }\n }\n\n render() {\n return html`\n <span class=\"body\">\n <slot></slot>\n </span>\n `;\n }\n\n static styles = css`\n :host {\n --font-size-large: var(--fhi-typography-body-large-font-size);\n --font-weight-large: var(--fhi-typography-body-large-font-weight);\n --line-height-large: var(--fhi-typography-body-large-line-height);\n --letter-spacing-large: var(--fhi-typography-body-large-letter-spacing);\n\n --font-size-medium: var(--fhi-typography-body-medium-font-size);\n --font-weight-medium: var(--fhi-typography-body-medium-font-weight);\n --line-height-medium: var(--fhi-typography-body-medium-line-height);\n --letter-spacing-medium: var(--fhi-typography-body-medium-letter-spacing);\n\n --font-size-small: var(--fhi-typography-body-small-font-size);\n --font-weight-small: var(--fhi-typography-body-small-font-weight);\n --line-height-small: var(--fhi-typography-body-small-line-height);\n --letter-spacing-small: var(--fhi-typography-body-small-letter-spacing);\n }\n\n :host {\n display: block;\n contain: layout;\n color: var(--fhi-color-neutral-text-default);\n .body {\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n margin: 0;\n }\n }\n\n :host([size='large']) {\n .body {\n font-size: var(--font-size-large);\n font-weight: var(--font-weight-large);\n line-height: var(--line-height-large);\n letter-spacing: var(--letter-spacing-large);\n }\n }\n\n :host([size='medium']) {\n .body {\n font-size: var(--font-size-medium);\n font-weight: var(--font-weight-medium);\n line-height: var(--line-height-medium);\n letter-spacing: var(--letter-spacing-medium);\n }\n }\n\n :host([size='small']) {\n .body {\n font-size: var(--font-size-small);\n font-weight: var(--font-weight-small);\n line-height: var(--line-height-small);\n letter-spacing: var(--letter-spacing-small);\n }\n }\n `;\n}\n"],"names":["FhiBodySelector","FhiBody","LitElement","changedProperties","html","css","__decorateClass","property","customElement"],"mappings":";;;;;;AAGO,MAAMA,IAAkB;AAgBxB,IAAMC,IAAN,cAAsBC,EAAW;AAAA,EAAjC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMsC,KAAA,OAG7B;AAAA,EAAA;AAAA,EAmBd,QAAQC,GAAyC;AAC/C,UAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,OAAO,MAC/B,KAAK,MAAM,QACT,OAAO,KAAK,SAAU,WAClB,KAAK,QACL;AAAA,EAEV;AAAA,EAEA,SAAS;AACP,WAAOC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAKT;AA0DF;AAvGaH,EA+CJ,SAASI;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAzC2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BN,EAMgC,WAAA,QAAA,CAAA;AAoBfK,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfN,EA0BiB,WAAA,SAAA,CAAA;AA1BjBA,IAANK,EAAA;AAAA,EADNE,EAAcR,CAAe;AAAA,GACjBC,CAAA;"}
1
+ {"version":3,"file":"fhi-body.js","sources":["../../src/components/typography/fhi-body/fhi-body.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nexport const FhiBodySelector = 'fhi-body';\n\n/**\n * ## FHI Body\n *\n * {@link https://designsystem.fhi.no/?path=/story/komponenter-typography-body--preview}\n *\n * The `<fhi-body>` component is used to display body text in accordance with the FHI Design System guidelines.\n * Use this component instead of the standard HTML paragraph element, `<p>`, to ensure consistent styling across your application.\n *\n * @tag fhi-body\n * @element fhi-body\n *\n * @slot - The content of the fhi-body component. This should be pure text.\n */\n@customElement(FhiBodySelector)\nexport class FhiBody extends LitElement {\n /**\n * Sets the font size of the given text.\n * @reflect\n * @type {'large' | 'medium' | 'small'}\n */\n @property({ type: String, reflect: true }) size:\n | 'large'\n | 'medium'\n | 'small' = 'medium';\n\n /**\n * Sets color of the given text. It supports any valid CSS color value (e.g. hex, rgb, rgba, hsl, hsla, color names).\n *\n * It is recommended to use Design Tokens for colors defined in the FHI Design System.\n * See: {@link https://designsystem.fhi.no/?path=/docs/design-tokens-farger--docs}\n *\n * Example:\n * ```html\n * <fhi-body color=\"var(--fhi-color-primary-text-default)\">\n * This text will be in the primary text color.\n * </fhi-body>\n * ```\n *\n * @type {string}\n */\n @property({ type: String }) color?: string;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('color')) {\n this.style.color =\n typeof this.color === 'string'\n ? this.color\n : 'var(--fhi-color-neutral-text-default)';\n }\n }\n\n render() {\n return html`\n <span class=\"body\">\n <slot></slot>\n </span>\n `;\n }\n\n static styles = css`\n :host {\n display: block;\n contain: layout;\n color: var(--fhi-color-neutral-text-default);\n .body {\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n margin: 0;\n }\n }\n\n :host([size='large']) {\n .body {\n font-size: var(--fhi-typography-body-large-font-size);\n font-weight: var(--fhi-typography-body-large-font-weight);\n line-height: var(--fhi-typography-body-large-line-height);\n letter-spacing: var(--fhi-typography-body-large-letter-spacing);\n }\n }\n\n :host([size='medium']) {\n .body {\n font-size: var(--fhi-typography-body-medium-font-size);\n font-weight: var(--fhi-typography-body-medium-font-weight);\n line-height: var(--fhi-typography-body-medium-line-height);\n letter-spacing: var(--fhi-typography-body-medium-letter-spacing);\n }\n }\n\n :host([size='small']) {\n .body {\n font-size: var(--fhi-typography-body-small-font-size);\n font-weight: var(--fhi-typography-body-small-font-weight);\n line-height: var(--fhi-typography-body-small-line-height);\n letter-spacing: var(--fhi-typography-body-small-letter-spacing);\n }\n }\n `;\n}\n"],"names":["FhiBodySelector","FhiBody","LitElement","changedProperties","html","css","__decorateClass","property","customElement"],"mappings":";;;;;;AAGO,MAAMA,IAAkB;AAgBxB,IAAMC,IAAN,cAAsBC,EAAW;AAAA,EAAjC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMsC,KAAA,OAG7B;AAAA,EAAA;AAAA,EAmBd,QAAQC,GAAyC;AAC/C,UAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,OAAO,MAC/B,KAAK,MAAM,QACT,OAAO,KAAK,SAAU,WAClB,KAAK,QACL;AAAA,EAEV;AAAA,EAEA,SAAS;AACP,WAAOC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAKT;AAyCF;AAtFaH,EA+CJ,SAASI;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAzC2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BN,EAMgC,WAAA,QAAA,CAAA;AAoBfK,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfN,EA0BiB,WAAA,SAAA,CAAA;AA1BjBA,IAANK,EAAA;AAAA,EADNE,EAAcR,CAAe;AAAA,GACjBC,CAAA;"}
package/fhi-display.js CHANGED
@@ -1,12 +1,12 @@
1
- import { i as n, n as p, a as g, b as f, t as y } from "./property-B2Ico5CW.js";
2
- import { o as m } from "./unsafe-html-DfuTUjUu.js";
3
- var v = Object.defineProperty, d = Object.getOwnPropertyDescriptor, r = (e, t, s, a) => {
4
- for (var i = a > 1 ? void 0 : a ? d(t, s) : t, o = e.length - 1, h; o >= 0; o--)
5
- (h = e[o]) && (i = (a ? h(t, s, i) : h(i)) || i);
6
- return a && i && v(t, s, i), i;
1
+ import { i as y, n as h, a as n, b as f, t as g } from "./property-B2Ico5CW.js";
2
+ import { o as d } from "./unsafe-html-DfuTUjUu.js";
3
+ var m = Object.defineProperty, v = Object.getOwnPropertyDescriptor, a = (e, t, s, r) => {
4
+ for (var i = r > 1 ? void 0 : r ? v(t, s) : t, o = e.length - 1, p; o >= 0; o--)
5
+ (p = e[o]) && (i = (r ? p(t, s, i) : p(i)) || i);
6
+ return r && i && m(t, s, i), i;
7
7
  };
8
8
  const u = "fhi-display";
9
- let l = class extends g {
9
+ let l = class extends n {
10
10
  constructor() {
11
11
  super(...arguments), this.size = "medium";
12
12
  }
@@ -27,33 +27,10 @@ let l = class extends g {
27
27
  <slot></slot>
28
28
  </h${this.level}>
29
29
  `;
30
- return f`${m(e)}`;
30
+ return f`${d(e)}`;
31
31
  }
32
32
  };
33
- l.styles = n`
34
- :host {
35
- --font-size-large: var(--fhi-typography-display-large-font-size);
36
- --font-weight-large: var(--fhi-typography-display-large-font-weight);
37
- --line-height-large: var(--fhi-typography-display-large-line-height);
38
- --letter-spacing-large: var(
39
- --fhi-typography-display-large-letter-spacing
40
- );
41
-
42
- --font-size-medium: var(--fhi-typography-display-medium-font-size);
43
- --font-weight-medium: var(--fhi-typography-display-medium-font-weight);
44
- --line-height-medium: var(--fhi-typography-display-medium-line-height);
45
- --letter-spacing-medium: var(
46
- --fhi-typography-display-medium-letter-spacing
47
- );
48
-
49
- --font-size-small: var(--fhi-typography-display-small-font-size);
50
- --font-weight-small: var(--fhi-typography-display-small-font-weight);
51
- --line-height-small: var(--fhi-typography-display-small-line-height);
52
- --letter-spacing-small: var(
53
- --fhi-typography-display-small-letter-spacing
54
- );
55
- }
56
-
33
+ l.styles = y`
57
34
  :host {
58
35
  display: block;
59
36
  contain: layout;
@@ -67,42 +44,42 @@ l.styles = n`
67
44
 
68
45
  :host([size='large']) {
69
46
  .display {
70
- font-size: var(--font-size-large);
71
- font-weight: var(--font-weight-large);
72
- line-height: var(--line-height-large);
73
- letter-spacing: var(--letter-spacing-large);
47
+ font-size: var(--fhi-typography-display-large-font-size);
48
+ font-weight: var(--fhi-typography-display-large-font-weight);
49
+ line-height: var(--fhi-typography-display-large-line-height);
50
+ letter-spacing: var(--fhi-typography-display-large-letter-spacing);
74
51
  }
75
52
  }
76
53
 
77
54
  :host([size='medium']) {
78
55
  .display {
79
- font-size: var(--font-size-medium);
80
- font-weight: var(--font-weight-medium);
81
- line-height: var(--line-height-medium);
82
- letter-spacing: var(--letter-spacing-medium);
56
+ font-size: var(--fhi-typography-display-medium-font-size);
57
+ font-weight: var(--fhi-typography-display-medium-font-weight);
58
+ line-height: var(--fhi-typography-display-medium-line-height);
59
+ letter-spacing: var(--fhi-typography-display-medium-letter-spacing);
83
60
  }
84
61
  }
85
62
 
86
63
  :host([size='small']) {
87
64
  .display {
88
- font-size: var(--font-size-small);
89
- font-weight: var(--font-weight-small);
90
- line-height: var(--line-height-small);
91
- letter-spacing: var(--letter-spacing-small);
65
+ font-size: var(--fhi-typography-display-small-font-size);
66
+ font-weight: var(--fhi-typography-display-small-font-weight);
67
+ line-height: var(--fhi-typography-display-small-line-height);
68
+ letter-spacing: var(--fhi-typography-display-small-letter-spacing);
92
69
  }
93
70
  }
94
71
  `;
95
- r([
96
- p({ type: String, reflect: !0 })
72
+ a([
73
+ h({ type: String, reflect: !0 })
97
74
  ], l.prototype, "size", 2);
98
- r([
99
- p({ type: String })
75
+ a([
76
+ h({ type: String })
100
77
  ], l.prototype, "color", 2);
101
- r([
102
- p({ type: Number })
78
+ a([
79
+ h({ type: Number })
103
80
  ], l.prototype, "level", 2);
104
- l = r([
105
- y(u)
81
+ l = a([
82
+ g(u)
106
83
  ], l);
107
84
  export {
108
85
  l as FhiDisplay,
package/fhi-display.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"fhi-display.js","sources":["../../src/components/typography/fhi-display/fhi-display.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\n\nexport const FhiDisplaySelector = 'fhi-display';\n\nexport type DisplayLevel = 1 | 2 | 3 | 4 | 5 | 6;\n\n/**\n * ## FHI Display\n *\n * {@link https://designsystem.fhi.no/?path=/story/komponenter-typography-display--preview}\n *\n * The `<fhi-display>` component is used to display large, eye-catching headline text in accordance with the FHI Design System guidelines.\n *\n * For smaller, less prominent title text, use the `<fhi-title>` component instead.\n *\n * For standard headline text, use the `<fhi-headline>` component instead.\n *\n * Use this component instead of the standard HTML heading elements, `<h1>` - `<h6>`, to ensure consistent styling across your application.\n *\n * @tag fhi-display\n * @element fhi-display\n *\n * @slot - The content of the fhi-display component. This should be pure text.\n */\n@customElement(FhiDisplaySelector)\nexport class FhiDisplay extends LitElement {\n /**\n * Sets the font size of the given text.\n * @reflect\n * @type {'large' | 'medium' | 'small'}\n */\n @property({ type: String, reflect: true }) size:\n | 'large'\n | 'medium'\n | 'small' = 'medium';\n\n /**\n * Sets color of the given text. It supports any valid CSS color value (e.g. hex, rgb, rgba, hsl, hsla, color names).\n *\n * It is recommended to use Design Tokens for colors defined in the FHI Design System.\n * See: {@link https://designsystem.fhi.no/?path=/docs/design-tokens-farger--docs}\n *\n * Example:\n * ```html\n * <fhi-display color=\"var(--fhi-color-primary-text-default)\">\n * This text will be in the primary text color.\n * </fhi-display>\n * ```\n *\n * @type {string}\n */\n @property({ type: String }) color?: string;\n\n /**\n * Sets the heading level for the text, corresponding to HTML heading elements `<h1>` to `<h6>`.\n * @type {1 | 2 | 3 | 4 | 5 | 6}\n */\n @property({ type: Number }) level!: DisplayLevel;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('level')) {\n const levelAsNumber = Number(this.level);\n if (isNaN(levelAsNumber) || levelAsNumber < 1 || levelAsNumber > 6) {\n console.error(\n new TypeError(\n `The level property must be set to a number between 1 and 6. Current value: ${this.level}`,\n ),\n );\n }\n }\n\n if (changedProperties.has('color')) {\n this.style.color =\n typeof this.color === 'string'\n ? this.color\n : 'var(--fhi-color-neutral-text-default)';\n }\n }\n\n render() {\n const template = `\n <h${this.level} class=\"display\">\n <slot></slot>\n </h${this.level}>\n `;\n return html`${unsafeHTML(template)}`;\n }\n\n static styles = css`\n :host {\n --font-size-large: var(--fhi-typography-display-large-font-size);\n --font-weight-large: var(--fhi-typography-display-large-font-weight);\n --line-height-large: var(--fhi-typography-display-large-line-height);\n --letter-spacing-large: var(\n --fhi-typography-display-large-letter-spacing\n );\n\n --font-size-medium: var(--fhi-typography-display-medium-font-size);\n --font-weight-medium: var(--fhi-typography-display-medium-font-weight);\n --line-height-medium: var(--fhi-typography-display-medium-line-height);\n --letter-spacing-medium: var(\n --fhi-typography-display-medium-letter-spacing\n );\n\n --font-size-small: var(--fhi-typography-display-small-font-size);\n --font-weight-small: var(--fhi-typography-display-small-font-weight);\n --line-height-small: var(--fhi-typography-display-small-line-height);\n --letter-spacing-small: var(\n --fhi-typography-display-small-letter-spacing\n );\n }\n\n :host {\n display: block;\n contain: layout;\n color: var(--fhi-color-neutral-text-default);\n .display {\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n margin: 0;\n }\n }\n\n :host([size='large']) {\n .display {\n font-size: var(--font-size-large);\n font-weight: var(--font-weight-large);\n line-height: var(--line-height-large);\n letter-spacing: var(--letter-spacing-large);\n }\n }\n\n :host([size='medium']) {\n .display {\n font-size: var(--font-size-medium);\n font-weight: var(--font-weight-medium);\n line-height: var(--line-height-medium);\n letter-spacing: var(--letter-spacing-medium);\n }\n }\n\n :host([size='small']) {\n .display {\n font-size: var(--font-size-small);\n font-weight: var(--font-weight-small);\n line-height: var(--line-height-small);\n letter-spacing: var(--letter-spacing-small);\n }\n }\n `;\n}\n"],"names":["FhiDisplaySelector","FhiDisplay","LitElement","changedProperties","levelAsNumber","template","html","unsafeHTML","css","__decorateClass","property","customElement"],"mappings":";;;;;;;AAIO,MAAMA,IAAqB;AAuB3B,IAAMC,IAAN,cAAyBC,EAAW;AAAA,EAApC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMsC,KAAA,OAG7B;AAAA,EAAA;AAAA,EAyBd,QAAQC,GAAyC;AAG/C,QAFA,MAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,OAAO,GAAG;AAClC,YAAMC,IAAgB,OAAO,KAAK,KAAK;AACvC,OAAI,MAAMA,CAAa,KAAKA,IAAgB,KAAKA,IAAgB,MAC/D,QAAQ;AAAA,QACN,IAAI;AAAA,UACF,8EAA8E,KAAK,KAAK;AAAA,QAAA;AAAA,MAC1F;AAAA,IAGN;AAEA,IAAID,EAAkB,IAAI,OAAO,MAC/B,KAAK,MAAM,QACT,OAAO,KAAK,SAAU,WAClB,KAAK,QACL;AAAA,EAEV;AAAA,EAEA,SAAS;AACP,UAAME,IAAW;AAAA,UACX,KAAK,KAAK;AAAA;AAAA,WAET,KAAK,KAAK;AAAA;AAEjB,WAAOC,IAAOC,EAAWF,CAAQ,CAAC;AAAA,EACpC;AAgEF;AA/HaJ,EAiEJ,SAASO;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AA3D2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BT,EAMgC,WAAA,QAAA,CAAA;AAoBfQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfT,EA0BiB,WAAA,SAAA,CAAA;AAMAQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAhCfT,EAgCiB,WAAA,SAAA,CAAA;AAhCjBA,IAANQ,EAAA;AAAA,EADNE,EAAcX,CAAkB;AAAA,GACpBC,CAAA;"}
1
+ {"version":3,"file":"fhi-display.js","sources":["../../src/components/typography/fhi-display/fhi-display.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\n\nexport const FhiDisplaySelector = 'fhi-display';\n\nexport type DisplayLevel = 1 | 2 | 3 | 4 | 5 | 6;\n\n/**\n * ## FHI Display\n *\n * {@link https://designsystem.fhi.no/?path=/story/komponenter-typography-display--preview}\n *\n * The `<fhi-display>` component is used to display large, eye-catching headline text in accordance with the FHI Design System guidelines.\n *\n * For smaller, less prominent title text, use the `<fhi-title>` component instead.\n *\n * For standard headline text, use the `<fhi-headline>` component instead.\n *\n * Use this component instead of the standard HTML heading elements, `<h1>` - `<h6>`, to ensure consistent styling across your application.\n *\n * @tag fhi-display\n * @element fhi-display\n *\n * @slot - The content of the fhi-display component. This should be pure text.\n */\n@customElement(FhiDisplaySelector)\nexport class FhiDisplay extends LitElement {\n /**\n * Sets the font size of the given text.\n * @reflect\n * @type {'large' | 'medium' | 'small'}\n */\n @property({ type: String, reflect: true }) size:\n | 'large'\n | 'medium'\n | 'small' = 'medium';\n\n /**\n * Sets color of the given text. It supports any valid CSS color value (e.g. hex, rgb, rgba, hsl, hsla, color names).\n *\n * It is recommended to use Design Tokens for colors defined in the FHI Design System.\n * See: {@link https://designsystem.fhi.no/?path=/docs/design-tokens-farger--docs}\n *\n * Example:\n * ```html\n * <fhi-display color=\"var(--fhi-color-primary-text-default)\">\n * This text will be in the primary text color.\n * </fhi-display>\n * ```\n *\n * @type {string}\n */\n @property({ type: String }) color?: string;\n\n /**\n * Sets the heading level for the text, corresponding to HTML heading elements `<h1>` to `<h6>`.\n * @type {1 | 2 | 3 | 4 | 5 | 6}\n */\n @property({ type: Number }) level!: DisplayLevel;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('level')) {\n const levelAsNumber = Number(this.level);\n if (isNaN(levelAsNumber) || levelAsNumber < 1 || levelAsNumber > 6) {\n console.error(\n new TypeError(\n `The level property must be set to a number between 1 and 6. Current value: ${this.level}`,\n ),\n );\n }\n }\n\n if (changedProperties.has('color')) {\n this.style.color =\n typeof this.color === 'string'\n ? this.color\n : 'var(--fhi-color-neutral-text-default)';\n }\n }\n\n render() {\n const template = `\n <h${this.level} class=\"display\">\n <slot></slot>\n </h${this.level}>\n `;\n return html`${unsafeHTML(template)}`;\n }\n\n static styles = css`\n :host {\n display: block;\n contain: layout;\n color: var(--fhi-color-neutral-text-default);\n .display {\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n margin: 0;\n }\n }\n\n :host([size='large']) {\n .display {\n font-size: var(--fhi-typography-display-large-font-size);\n font-weight: var(--fhi-typography-display-large-font-weight);\n line-height: var(--fhi-typography-display-large-line-height);\n letter-spacing: var(--fhi-typography-display-large-letter-spacing);\n }\n }\n\n :host([size='medium']) {\n .display {\n font-size: var(--fhi-typography-display-medium-font-size);\n font-weight: var(--fhi-typography-display-medium-font-weight);\n line-height: var(--fhi-typography-display-medium-line-height);\n letter-spacing: var(--fhi-typography-display-medium-letter-spacing);\n }\n }\n\n :host([size='small']) {\n .display {\n font-size: var(--fhi-typography-display-small-font-size);\n font-weight: var(--fhi-typography-display-small-font-weight);\n line-height: var(--fhi-typography-display-small-line-height);\n letter-spacing: var(--fhi-typography-display-small-letter-spacing);\n }\n }\n `;\n}\n"],"names":["FhiDisplaySelector","FhiDisplay","LitElement","changedProperties","levelAsNumber","template","html","unsafeHTML","css","__decorateClass","property","customElement"],"mappings":";;;;;;;AAIO,MAAMA,IAAqB;AAuB3B,IAAMC,IAAN,cAAyBC,EAAW;AAAA,EAApC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMsC,KAAA,OAG7B;AAAA,EAAA;AAAA,EAyBd,QAAQC,GAAyC;AAG/C,QAFA,MAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,OAAO,GAAG;AAClC,YAAMC,IAAgB,OAAO,KAAK,KAAK;AACvC,OAAI,MAAMA,CAAa,KAAKA,IAAgB,KAAKA,IAAgB,MAC/D,QAAQ;AAAA,QACN,IAAI;AAAA,UACF,8EAA8E,KAAK,KAAK;AAAA,QAAA;AAAA,MAC1F;AAAA,IAGN;AAEA,IAAID,EAAkB,IAAI,OAAO,MAC/B,KAAK,MAAM,QACT,OAAO,KAAK,SAAU,WAClB,KAAK,QACL;AAAA,EAEV;AAAA,EAEA,SAAS;AACP,UAAME,IAAW;AAAA,UACX,KAAK,KAAK;AAAA;AAAA,WAET,KAAK,KAAK;AAAA;AAEjB,WAAOC,IAAOC,EAAWF,CAAQ,CAAC;AAAA,EACpC;AAyCF;AAxGaJ,EAiEJ,SAASO;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AA3D2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BT,EAMgC,WAAA,QAAA,CAAA;AAoBfQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfT,EA0BiB,WAAA,SAAA,CAAA;AAMAQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAhCfT,EAgCiB,WAAA,SAAA,CAAA;AAhCjBA,IAANQ,EAAA;AAAA,EADNE,EAAcX,CAAkB;AAAA,GACpBC,CAAA;"}
package/fhi-headline.js CHANGED
@@ -1,12 +1,12 @@
1
- import { i as g, n as s, a as p, b as f, t as m } from "./property-B2Ico5CW.js";
1
+ import { i as p, n as s, a as f, b as g, t as y } from "./property-B2Ico5CW.js";
2
2
  import { o as d } from "./unsafe-html-DfuTUjUu.js";
3
- var v = Object.defineProperty, y = Object.getOwnPropertyDescriptor, r = (e, t, h, a) => {
4
- for (var i = a > 1 ? void 0 : a ? y(t, h) : t, n = e.length - 1, o; n >= 0; n--)
5
- (o = e[n]) && (i = (a ? o(t, h, i) : o(i)) || i);
6
- return a && i && v(t, h, i), i;
3
+ var m = Object.defineProperty, v = Object.getOwnPropertyDescriptor, a = (e, t, h, r) => {
4
+ for (var i = r > 1 ? void 0 : r ? v(t, h) : t, o = e.length - 1, n; o >= 0; o--)
5
+ (n = e[o]) && (i = (r ? n(t, h, i) : n(i)) || i);
6
+ return r && i && m(t, h, i), i;
7
7
  };
8
8
  const u = "fhi-headline";
9
- let l = class extends p {
9
+ let l = class extends f {
10
10
  constructor() {
11
11
  super(...arguments), this.size = "medium";
12
12
  }
@@ -27,33 +27,10 @@ let l = class extends p {
27
27
  <slot></slot>
28
28
  </h${this.level}>
29
29
  `;
30
- return f`${d(e)}`;
30
+ return g`${d(e)}`;
31
31
  }
32
32
  };
33
- l.styles = g`
34
- :host {
35
- --font-size-large: var(--fhi-typography-headline-large-font-size);
36
- --font-weight-large: var(--fhi-typography-headline-large-font-weight);
37
- --line-height-large: var(--fhi-typography-headline-large-line-height);
38
- --letter-spacing-large: var(
39
- --fhi-typography-headline-large-letter-spacing
40
- );
41
-
42
- --font-size-medium: var(--fhi-typography-headline-medium-font-size);
43
- --font-weight-medium: var(--fhi-typography-headline-medium-font-weight);
44
- --line-height-medium: var(--fhi-typography-headline-medium-line-height);
45
- --letter-spacing-medium: var(
46
- --fhi-typography-headline-medium-letter-spacing
47
- );
48
-
49
- --font-size-small: var(--fhi-typography-headline-small-font-size);
50
- --font-weight-small: var(--fhi-typography-headline-small-font-weight);
51
- --line-height-small: var(--fhi-typography-headline-small-line-height);
52
- --letter-spacing-small: var(
53
- --fhi-typography-headline-small-letter-spacing
54
- );
55
- }
56
-
33
+ l.styles = p`
57
34
  :host {
58
35
  display: block;
59
36
  contain: layout;
@@ -67,42 +44,42 @@ l.styles = g`
67
44
 
68
45
  :host([size='large']) {
69
46
  .headline {
70
- font-size: var(--font-size-large);
71
- font-weight: var(--font-weight-large);
72
- line-height: var(--line-height-large);
73
- letter-spacing: var(--letter-spacing-large);
47
+ font-size: var(--fhi-typography-headline-large-font-size);
48
+ font-weight: var(--fhi-typography-headline-large-font-weight);
49
+ line-height: var(--fhi-typography-headline-large-line-height);
50
+ letter-spacing: var(--fhi-typography-headline-large-letter-spacing);
74
51
  }
75
52
  }
76
53
 
77
54
  :host([size='medium']) {
78
55
  .headline {
79
- font-size: var(--font-size-medium);
80
- font-weight: var(--font-weight-medium);
81
- line-height: var(--line-height-medium);
82
- letter-spacing: var(--letter-spacing-medium);
56
+ font-size: var(--fhi-typography-headline-medium-font-size);
57
+ font-weight: var(--fhi-typography-headline-medium-font-weight);
58
+ line-height: var(--fhi-typography-headline-medium-line-height);
59
+ letter-spacing: var(--fhi-typography-headline-medium-letter-spacing);
83
60
  }
84
61
  }
85
62
 
86
63
  :host([size='small']) {
87
64
  .headline {
88
- font-size: var(--font-size-small);
89
- font-weight: var(--font-weight-small);
90
- line-height: var(--line-height-small);
91
- letter-spacing: var(--letter-spacing-small);
65
+ font-size: var(--fhi-typography-headline-small-font-size);
66
+ font-weight: var(--fhi-typography-headline-small-font-weight);
67
+ line-height: var(--fhi-typography-headline-small-line-height);
68
+ letter-spacing: var(--fhi-typography-headline-small-letter-spacing);
92
69
  }
93
70
  }
94
71
  `;
95
- r([
72
+ a([
96
73
  s({ type: String, reflect: !0 })
97
74
  ], l.prototype, "size", 2);
98
- r([
75
+ a([
99
76
  s({ type: String })
100
77
  ], l.prototype, "color", 2);
101
- r([
78
+ a([
102
79
  s({ type: Number })
103
80
  ], l.prototype, "level", 2);
104
- l = r([
105
- m(u)
81
+ l = a([
82
+ y(u)
106
83
  ], l);
107
84
  export {
108
85
  l as FhiHeadline,
package/fhi-headline.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"fhi-headline.js","sources":["../../src/components/typography/fhi-headline/fhi-headline.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\n\nexport const FhiHeadlineSelector = 'fhi-headline';\n\nexport type HeadlineLevel = 1 | 2 | 3 | 4 | 5 | 6;\n\n/**\n * ## FHI Headline\n *\n * {@link https://designsystem.fhi.no/?path=/story/komponenter-typography-headline--preview}\n *\n * The `<fhi-headline>` component is used to display standard headline text in accordance with the FHI Design System guidelines.\n *\n * For smaller, less prominent title text, use the `<fhi-title>` component instead.\n *\n * For larger, more prominent headline text, use the `<fhi-display>` component instead.\n *\n * Use this component instead of the standard HTML heading elements, `<h1>` - `<h6>`, to ensure consistent styling across your application.\n *\n * @tag fhi-headline\n * @element fhi-headline\n *\n * @slot - The content of the fhi-headline component. This should be pure text.\n */\n@customElement(FhiHeadlineSelector)\nexport class FhiHeadline extends LitElement {\n /**\n * Sets the size of the text styles.\n * @reflect\n * @type {'large' | 'medium' | 'small'}\n */\n @property({ type: String, reflect: true }) size:\n | 'large'\n | 'medium'\n | 'small' = 'medium';\n\n /**\n * Sets color of the given text. It supports any valid CSS color value (e.g. hex, rgb, rgba, hsl, hsla, color names).\n *\n * It is recommended to use Design Tokens for colors defined in the FHI Design System.\n * See: {@link https://designsystem.fhi.no/?path=/docs/design-tokens-farger--docs}\n *\n * Example:\n * ```html\n * <fhi-headline color=\"var(--fhi-color-primary-text-default)\">\n * This text will be in the primary text color.\n * </fhi-headline>\n * ```\n *\n * @type {string}\n */\n @property({ type: String }) color?: string;\n\n /**\n * Sets the heading level for the text, corresponding to HTML heading elements `<h1>` to `<h6>`.\n * @type {1 | 2 | 3 | 4 | 5 | 6}\n */\n @property({ type: Number }) level!: HeadlineLevel;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('level')) {\n const levelAsNumber = Number(this.level);\n if (isNaN(levelAsNumber) || levelAsNumber < 1 || levelAsNumber > 6) {\n console.error(\n new TypeError(\n `The level property must be set to a number between 1 and 6. Current value: ${this.level}`,\n ),\n );\n }\n }\n\n if (changedProperties.has('color')) {\n this.style.color =\n typeof this.color === 'string'\n ? this.color\n : 'var(--fhi-color-neutral-text-default)';\n }\n }\n\n render() {\n const template = `\n <h${this.level} class=\"headline\">\n <slot></slot>\n </h${this.level}>\n `;\n return html`${unsafeHTML(template)}`;\n }\n\n static styles = css`\n :host {\n --font-size-large: var(--fhi-typography-headline-large-font-size);\n --font-weight-large: var(--fhi-typography-headline-large-font-weight);\n --line-height-large: var(--fhi-typography-headline-large-line-height);\n --letter-spacing-large: var(\n --fhi-typography-headline-large-letter-spacing\n );\n\n --font-size-medium: var(--fhi-typography-headline-medium-font-size);\n --font-weight-medium: var(--fhi-typography-headline-medium-font-weight);\n --line-height-medium: var(--fhi-typography-headline-medium-line-height);\n --letter-spacing-medium: var(\n --fhi-typography-headline-medium-letter-spacing\n );\n\n --font-size-small: var(--fhi-typography-headline-small-font-size);\n --font-weight-small: var(--fhi-typography-headline-small-font-weight);\n --line-height-small: var(--fhi-typography-headline-small-line-height);\n --letter-spacing-small: var(\n --fhi-typography-headline-small-letter-spacing\n );\n }\n\n :host {\n display: block;\n contain: layout;\n color: var(--fhi-color-neutral-text-default);\n .headline {\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n margin: 0;\n }\n }\n\n :host([size='large']) {\n .headline {\n font-size: var(--font-size-large);\n font-weight: var(--font-weight-large);\n line-height: var(--line-height-large);\n letter-spacing: var(--letter-spacing-large);\n }\n }\n\n :host([size='medium']) {\n .headline {\n font-size: var(--font-size-medium);\n font-weight: var(--font-weight-medium);\n line-height: var(--line-height-medium);\n letter-spacing: var(--letter-spacing-medium);\n }\n }\n\n :host([size='small']) {\n .headline {\n font-size: var(--font-size-small);\n font-weight: var(--font-weight-small);\n line-height: var(--line-height-small);\n letter-spacing: var(--letter-spacing-small);\n }\n }\n `;\n}\n"],"names":["FhiHeadlineSelector","FhiHeadline","LitElement","changedProperties","levelAsNumber","template","html","unsafeHTML","css","__decorateClass","property","customElement"],"mappings":";;;;;;;AAIO,MAAMA,IAAsB;AAuB5B,IAAMC,IAAN,cAA0BC,EAAW;AAAA,EAArC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMsC,KAAA,OAG7B;AAAA,EAAA;AAAA,EAyBd,QAAQC,GAAyC;AAG/C,QAFA,MAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,OAAO,GAAG;AAClC,YAAMC,IAAgB,OAAO,KAAK,KAAK;AACvC,OAAI,MAAMA,CAAa,KAAKA,IAAgB,KAAKA,IAAgB,MAC/D,QAAQ;AAAA,QACN,IAAI;AAAA,UACF,8EAA8E,KAAK,KAAK;AAAA,QAAA;AAAA,MAC1F;AAAA,IAGN;AAEA,IAAID,EAAkB,IAAI,OAAO,MAC/B,KAAK,MAAM,QACT,OAAO,KAAK,SAAU,WAClB,KAAK,QACL;AAAA,EAEV;AAAA,EAEA,SAAS;AACP,UAAME,IAAW;AAAA,UACX,KAAK,KAAK;AAAA;AAAA,WAET,KAAK,KAAK;AAAA;AAEjB,WAAOC,IAAOC,EAAWF,CAAQ,CAAC;AAAA,EACpC;AAgEF;AA/HaJ,EAiEJ,SAASO;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AA3D2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BT,EAMgC,WAAA,QAAA,CAAA;AAoBfQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfT,EA0BiB,WAAA,SAAA,CAAA;AAMAQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAhCfT,EAgCiB,WAAA,SAAA,CAAA;AAhCjBA,IAANQ,EAAA;AAAA,EADNE,EAAcX,CAAmB;AAAA,GACrBC,CAAA;"}
1
+ {"version":3,"file":"fhi-headline.js","sources":["../../src/components/typography/fhi-headline/fhi-headline.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\n\nexport const FhiHeadlineSelector = 'fhi-headline';\n\nexport type HeadlineLevel = 1 | 2 | 3 | 4 | 5 | 6;\n\n/**\n * ## FHI Headline\n *\n * {@link https://designsystem.fhi.no/?path=/story/komponenter-typography-headline--preview}\n *\n * The `<fhi-headline>` component is used to display standard headline text in accordance with the FHI Design System guidelines.\n *\n * For smaller, less prominent title text, use the `<fhi-title>` component instead.\n *\n * For larger, more prominent headline text, use the `<fhi-display>` component instead.\n *\n * Use this component instead of the standard HTML heading elements, `<h1>` - `<h6>`, to ensure consistent styling across your application.\n *\n * @tag fhi-headline\n * @element fhi-headline\n *\n * @slot - The content of the fhi-headline component. This should be pure text.\n */\n@customElement(FhiHeadlineSelector)\nexport class FhiHeadline extends LitElement {\n /**\n * Sets the size of the text styles.\n * @reflect\n * @type {'large' | 'medium' | 'small'}\n */\n @property({ type: String, reflect: true }) size:\n | 'large'\n | 'medium'\n | 'small' = 'medium';\n\n /**\n * Sets color of the given text. It supports any valid CSS color value (e.g. hex, rgb, rgba, hsl, hsla, color names).\n *\n * It is recommended to use Design Tokens for colors defined in the FHI Design System.\n * See: {@link https://designsystem.fhi.no/?path=/docs/design-tokens-farger--docs}\n *\n * Example:\n * ```html\n * <fhi-headline color=\"var(--fhi-color-primary-text-default)\">\n * This text will be in the primary text color.\n * </fhi-headline>\n * ```\n *\n * @type {string}\n */\n @property({ type: String }) color?: string;\n\n /**\n * Sets the heading level for the text, corresponding to HTML heading elements `<h1>` to `<h6>`.\n * @type {1 | 2 | 3 | 4 | 5 | 6}\n */\n @property({ type: Number }) level!: HeadlineLevel;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('level')) {\n const levelAsNumber = Number(this.level);\n if (isNaN(levelAsNumber) || levelAsNumber < 1 || levelAsNumber > 6) {\n console.error(\n new TypeError(\n `The level property must be set to a number between 1 and 6. Current value: ${this.level}`,\n ),\n );\n }\n }\n\n if (changedProperties.has('color')) {\n this.style.color =\n typeof this.color === 'string'\n ? this.color\n : 'var(--fhi-color-neutral-text-default)';\n }\n }\n\n render() {\n const template = `\n <h${this.level} class=\"headline\">\n <slot></slot>\n </h${this.level}>\n `;\n return html`${unsafeHTML(template)}`;\n }\n\n static styles = css`\n :host {\n display: block;\n contain: layout;\n color: var(--fhi-color-neutral-text-default);\n .headline {\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n margin: 0;\n }\n }\n\n :host([size='large']) {\n .headline {\n font-size: var(--fhi-typography-headline-large-font-size);\n font-weight: var(--fhi-typography-headline-large-font-weight);\n line-height: var(--fhi-typography-headline-large-line-height);\n letter-spacing: var(--fhi-typography-headline-large-letter-spacing);\n }\n }\n\n :host([size='medium']) {\n .headline {\n font-size: var(--fhi-typography-headline-medium-font-size);\n font-weight: var(--fhi-typography-headline-medium-font-weight);\n line-height: var(--fhi-typography-headline-medium-line-height);\n letter-spacing: var(--fhi-typography-headline-medium-letter-spacing);\n }\n }\n\n :host([size='small']) {\n .headline {\n font-size: var(--fhi-typography-headline-small-font-size);\n font-weight: var(--fhi-typography-headline-small-font-weight);\n line-height: var(--fhi-typography-headline-small-line-height);\n letter-spacing: var(--fhi-typography-headline-small-letter-spacing);\n }\n }\n `;\n}\n"],"names":["FhiHeadlineSelector","FhiHeadline","LitElement","changedProperties","levelAsNumber","template","html","unsafeHTML","css","__decorateClass","property","customElement"],"mappings":";;;;;;;AAIO,MAAMA,IAAsB;AAuB5B,IAAMC,IAAN,cAA0BC,EAAW;AAAA,EAArC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMsC,KAAA,OAG7B;AAAA,EAAA;AAAA,EAyBd,QAAQC,GAAyC;AAG/C,QAFA,MAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,OAAO,GAAG;AAClC,YAAMC,IAAgB,OAAO,KAAK,KAAK;AACvC,OAAI,MAAMA,CAAa,KAAKA,IAAgB,KAAKA,IAAgB,MAC/D,QAAQ;AAAA,QACN,IAAI;AAAA,UACF,8EAA8E,KAAK,KAAK;AAAA,QAAA;AAAA,MAC1F;AAAA,IAGN;AAEA,IAAID,EAAkB,IAAI,OAAO,MAC/B,KAAK,MAAM,QACT,OAAO,KAAK,SAAU,WAClB,KAAK,QACL;AAAA,EAEV;AAAA,EAEA,SAAS;AACP,UAAME,IAAW;AAAA,UACX,KAAK,KAAK;AAAA;AAAA,WAET,KAAK,KAAK;AAAA;AAEjB,WAAOC,IAAOC,EAAWF,CAAQ,CAAC;AAAA,EACpC;AAyCF;AAxGaJ,EAiEJ,SAASO;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AA3D2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BT,EAMgC,WAAA,QAAA,CAAA;AAoBfQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfT,EA0BiB,WAAA,SAAA,CAAA;AAMAQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAhCfT,EAgCiB,WAAA,SAAA,CAAA;AAhCjBA,IAANQ,EAAA;AAAA,EADNE,EAAcX,CAAmB;AAAA,GACrBC,CAAA;"}
package/fhi-label.js CHANGED
@@ -1,10 +1,10 @@
1
- import { i as g, n, a as f, b as p, t as m } from "./property-B2Ico5CW.js";
2
- var y = Object.defineProperty, v = Object.getOwnPropertyDescriptor, s = (t, a, r, i) => {
3
- for (var e = i > 1 ? void 0 : i ? v(a, r) : a, o = t.length - 1, h; o >= 0; o--)
1
+ import { i as n, n as p, a as f, b as g, t as y } from "./property-B2Ico5CW.js";
2
+ var b = Object.defineProperty, c = Object.getOwnPropertyDescriptor, s = (t, a, r, i) => {
3
+ for (var e = i > 1 ? void 0 : i ? c(a, r) : a, o = t.length - 1, h; o >= 0; o--)
4
4
  (h = t[o]) && (e = (i ? h(a, r, e) : h(e)) || e);
5
- return i && e && y(a, r, e), e;
5
+ return i && e && b(a, r, e), e;
6
6
  };
7
- const c = "fhi-label";
7
+ const m = "fhi-label";
8
8
  let l = class extends f {
9
9
  constructor() {
10
10
  super(...arguments), this.size = "medium";
@@ -13,33 +13,14 @@ let l = class extends f {
13
13
  super.updated(t), t.has("color") && (this.style.color = typeof this.color == "string" ? this.color : "var(--fhi-color-neutral-text-default)");
14
14
  }
15
15
  render() {
16
- return p`
16
+ return g`
17
17
  <span class="label">
18
18
  <slot></slot>
19
19
  </span>
20
20
  `;
21
21
  }
22
22
  };
23
- l.styles = g`
24
- :host {
25
- --font-size-large: var(--fhi-typography-label-large-font-size);
26
- --font-weight-large: var(--fhi-typography-label-large-font-weight);
27
- --line-height-large: var(--fhi-typography-label-large-line-height);
28
- --letter-spacing-large: var(--fhi-typography-label-large-letter-spacing);
29
-
30
- --font-size-medium: var(--fhi-typography-label-medium-font-size);
31
- --font-weight-medium: var(--fhi-typography-label-medium-font-weight);
32
- --line-height-medium: var(--fhi-typography-label-medium-line-height);
33
- --letter-spacing-medium: var(
34
- --fhi-typography-label-medium-letter-spacing
35
- );
36
-
37
- --font-size-small: var(--fhi-typography-label-small-font-size);
38
- --font-weight-small: var(--fhi-typography-label-small-font-weight);
39
- --line-height-small: var(--fhi-typography-label-small-line-height);
40
- --letter-spacing-small: var(--fhi-typography-label-small-letter-spacing);
41
- }
42
-
23
+ l.styles = n`
43
24
  :host {
44
25
  display: block;
45
26
  contain: layout;
@@ -53,42 +34,42 @@ l.styles = g`
53
34
 
54
35
  :host([size='large']) {
55
36
  .label {
56
- font-size: var(--font-size-large);
57
- font-weight: var(--font-weight-large);
58
- line-height: var(--line-height-large);
59
- letter-spacing: var(--letter-spacing-large);
37
+ font-size: var(--fhi-typography-label-large-font-size);
38
+ font-weight: var(--fhi-typography-label-large-font-weight);
39
+ line-height: var(--fhi-typography-label-large-line-height);
40
+ letter-spacing: var(--fhi-typography-label-large-letter-spacing);
60
41
  }
61
42
  }
62
43
 
63
44
  :host([size='medium']) {
64
45
  .label {
65
- font-size: var(--font-size-medium);
66
- font-weight: var(--font-weight-medium);
67
- line-height: var(--line-height-medium);
68
- letter-spacing: var(--letter-spacing-medium);
46
+ font-size: var(--fhi-typography-label-medium-font-size);
47
+ font-weight: var(--fhi-typography-label-medium-font-weight);
48
+ line-height: var(--fhi-typography-label-medium-line-height);
49
+ letter-spacing: var(--fhi-typography-label-medium-letter-spacing);
69
50
  }
70
51
  }
71
52
 
72
53
  :host([size='small']) {
73
54
  .label {
74
- font-size: var(--font-size-small);
75
- font-weight: var(--font-weight-small);
76
- line-height: var(--line-height-small);
77
- letter-spacing: var(--letter-spacing-small);
55
+ font-size: var(--fhi-typography-label-small-font-size);
56
+ font-weight: var(--fhi-typography-label-small-font-weight);
57
+ line-height: var(--fhi-typography-label-small-line-height);
58
+ letter-spacing: var(--fhi-typography-label-small-letter-spacing);
78
59
  }
79
60
  }
80
61
  `;
81
62
  s([
82
- n({ type: String, reflect: !0 })
63
+ p({ type: String, reflect: !0 })
83
64
  ], l.prototype, "size", 2);
84
65
  s([
85
- n({ type: String })
66
+ p({ type: String })
86
67
  ], l.prototype, "color", 2);
87
68
  l = s([
88
- m(c)
69
+ y(m)
89
70
  ], l);
90
71
  export {
91
72
  l as FhiLabel,
92
- c as FhiLabelSelector
73
+ m as FhiLabelSelector
93
74
  };
94
75
  //# sourceMappingURL=fhi-label.js.map
package/fhi-label.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"fhi-label.js","sources":["../../src/components/typography/fhi-label/fhi-label.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nexport const FhiLabelSelector = 'fhi-label';\n\n/**\n * ## FHI Label\n *\n * {@link https://designsystem.fhi.no/?path=/story/komponenter-typography-label--preview}\n *\n * The `<fhi-label>` component is used to display label text in accordance with the FHI Design System guidelines.\n * Use this component instead of the standard HTML `<label>` element to ensure consistent styling across your application.\n *\n * @tag fhi-label\n * @element fhi-label\n *\n * @slot - The content of the fhi-label component. This should be pure text.\n */\n@customElement(FhiLabelSelector)\nexport class FhiLabel extends LitElement {\n /**\n * Sets the font size of the given text.\n * @reflect\n * @type {'large' | 'medium' | 'small'}\n */\n @property({ type: String, reflect: true }) size:\n | 'large'\n | 'medium'\n | 'small' = 'medium';\n\n /**\n * Sets color of the given text. It supports any valid CSS color value (e.g. hex, rgb, rgba, hsl, hsla, color names).\n *\n * It is recommended to use Design Tokens for colors defined in the FHI Design System.\n * See: {@link https://designsystem.fhi.no/?path=/docs/design-tokens-farger--docs}\n *\n * Example:\n * ```html\n * <fhi-label color=\"var(--fhi-color-primary-text-default)\">\n * This text will be in the primary text color.\n * </fhi-label>\n * ```\n *\n * @type {string}\n */\n @property({ type: String }) color?: string;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('color')) {\n this.style.color =\n typeof this.color === 'string'\n ? this.color\n : 'var(--fhi-color-neutral-text-default)';\n }\n }\n\n render() {\n return html`\n <span class=\"label\">\n <slot></slot>\n </span>\n `;\n }\n\n static styles = css`\n :host {\n --font-size-large: var(--fhi-typography-label-large-font-size);\n --font-weight-large: var(--fhi-typography-label-large-font-weight);\n --line-height-large: var(--fhi-typography-label-large-line-height);\n --letter-spacing-large: var(--fhi-typography-label-large-letter-spacing);\n\n --font-size-medium: var(--fhi-typography-label-medium-font-size);\n --font-weight-medium: var(--fhi-typography-label-medium-font-weight);\n --line-height-medium: var(--fhi-typography-label-medium-line-height);\n --letter-spacing-medium: var(\n --fhi-typography-label-medium-letter-spacing\n );\n\n --font-size-small: var(--fhi-typography-label-small-font-size);\n --font-weight-small: var(--fhi-typography-label-small-font-weight);\n --line-height-small: var(--fhi-typography-label-small-line-height);\n --letter-spacing-small: var(--fhi-typography-label-small-letter-spacing);\n }\n\n :host {\n display: block;\n contain: layout;\n color: var(--fhi-color-neutral-text-default);\n .label {\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n margin: 0;\n }\n }\n\n :host([size='large']) {\n .label {\n font-size: var(--font-size-large);\n font-weight: var(--font-weight-large);\n line-height: var(--line-height-large);\n letter-spacing: var(--letter-spacing-large);\n }\n }\n\n :host([size='medium']) {\n .label {\n font-size: var(--font-size-medium);\n font-weight: var(--font-weight-medium);\n line-height: var(--line-height-medium);\n letter-spacing: var(--letter-spacing-medium);\n }\n }\n\n :host([size='small']) {\n .label {\n font-size: var(--font-size-small);\n font-weight: var(--font-weight-small);\n line-height: var(--line-height-small);\n letter-spacing: var(--letter-spacing-small);\n }\n }\n `;\n}\n"],"names":["FhiLabelSelector","FhiLabel","LitElement","changedProperties","html","css","__decorateClass","property","customElement"],"mappings":";;;;;;AAGO,MAAMA,IAAmB;AAgBzB,IAAMC,IAAN,cAAuBC,EAAW;AAAA,EAAlC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMsC,KAAA,OAG7B;AAAA,EAAA;AAAA,EAmBd,QAAQC,GAAyC;AAC/C,UAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,OAAO,MAC/B,KAAK,MAAM,QACT,OAAO,KAAK,SAAU,WAClB,KAAK,QACL;AAAA,EAEV;AAAA,EAEA,SAAS;AACP,WAAOC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAKT;AA4DF;AAzGaH,EA+CJ,SAASI;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAzC2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BN,EAMgC,WAAA,QAAA,CAAA;AAoBfK,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfN,EA0BiB,WAAA,SAAA,CAAA;AA1BjBA,IAANK,EAAA;AAAA,EADNE,EAAcR,CAAgB;AAAA,GAClBC,CAAA;"}
1
+ {"version":3,"file":"fhi-label.js","sources":["../../src/components/typography/fhi-label/fhi-label.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nexport const FhiLabelSelector = 'fhi-label';\n\n/**\n * ## FHI Label\n *\n * {@link https://designsystem.fhi.no/?path=/story/komponenter-typography-label--preview}\n *\n * The `<fhi-label>` component is used to display label text in accordance with the FHI Design System guidelines.\n * Use this component instead of the standard HTML `<label>` element to ensure consistent styling across your application.\n *\n * @tag fhi-label\n * @element fhi-label\n *\n * @slot - The content of the fhi-label component. This should be pure text.\n */\n@customElement(FhiLabelSelector)\nexport class FhiLabel extends LitElement {\n /**\n * Sets the font size of the given text.\n * @reflect\n * @type {'large' | 'medium' | 'small'}\n */\n @property({ type: String, reflect: true }) size:\n | 'large'\n | 'medium'\n | 'small' = 'medium';\n\n /**\n * Sets color of the given text. It supports any valid CSS color value (e.g. hex, rgb, rgba, hsl, hsla, color names).\n *\n * It is recommended to use Design Tokens for colors defined in the FHI Design System.\n * See: {@link https://designsystem.fhi.no/?path=/docs/design-tokens-farger--docs}\n *\n * Example:\n * ```html\n * <fhi-label color=\"var(--fhi-color-primary-text-default)\">\n * This text will be in the primary text color.\n * </fhi-label>\n * ```\n *\n * @type {string}\n */\n @property({ type: String }) color?: string;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('color')) {\n this.style.color =\n typeof this.color === 'string'\n ? this.color\n : 'var(--fhi-color-neutral-text-default)';\n }\n }\n\n render() {\n return html`\n <span class=\"label\">\n <slot></slot>\n </span>\n `;\n }\n\n static styles = css`\n :host {\n display: block;\n contain: layout;\n color: var(--fhi-color-neutral-text-default);\n .label {\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n margin: 0;\n }\n }\n\n :host([size='large']) {\n .label {\n font-size: var(--fhi-typography-label-large-font-size);\n font-weight: var(--fhi-typography-label-large-font-weight);\n line-height: var(--fhi-typography-label-large-line-height);\n letter-spacing: var(--fhi-typography-label-large-letter-spacing);\n }\n }\n\n :host([size='medium']) {\n .label {\n font-size: var(--fhi-typography-label-medium-font-size);\n font-weight: var(--fhi-typography-label-medium-font-weight);\n line-height: var(--fhi-typography-label-medium-line-height);\n letter-spacing: var(--fhi-typography-label-medium-letter-spacing);\n }\n }\n\n :host([size='small']) {\n .label {\n font-size: var(--fhi-typography-label-small-font-size);\n font-weight: var(--fhi-typography-label-small-font-weight);\n line-height: var(--fhi-typography-label-small-line-height);\n letter-spacing: var(--fhi-typography-label-small-letter-spacing);\n }\n }\n `;\n}\n"],"names":["FhiLabelSelector","FhiLabel","LitElement","changedProperties","html","css","__decorateClass","property","customElement"],"mappings":";;;;;;AAGO,MAAMA,IAAmB;AAgBzB,IAAMC,IAAN,cAAuBC,EAAW;AAAA,EAAlC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMsC,KAAA,OAG7B;AAAA,EAAA;AAAA,EAmBd,QAAQC,GAAyC;AAC/C,UAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,OAAO,MAC/B,KAAK,MAAM,QACT,OAAO,KAAK,SAAU,WAClB,KAAK,QACL;AAAA,EAEV;AAAA,EAEA,SAAS;AACP,WAAOC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAKT;AAyCF;AAtFaH,EA+CJ,SAASI;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAzC2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BN,EAMgC,WAAA,QAAA,CAAA;AAoBfK,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfN,EA0BiB,WAAA,SAAA,CAAA;AA1BjBA,IAANK,EAAA;AAAA,EADNE,EAAcR,CAAgB;AAAA,GAClBC,CAAA;"}
package/fhi-title.js CHANGED
@@ -1,55 +1,36 @@
1
- import { i as g, n, a as p, b as f, t as m } from "./property-B2Ico5CW.js";
2
- import { o as v } from "./unsafe-html-DfuTUjUu.js";
3
- var y = Object.defineProperty, u = Object.getOwnPropertyDescriptor, a = (e, t, o, r) => {
4
- for (var i = r > 1 ? void 0 : r ? u(t, o) : t, s = e.length - 1, h; s >= 0; s--)
5
- (h = e[s]) && (i = (r ? h(t, o, i) : h(i)) || i);
6
- return r && i && y(t, o, i), i;
1
+ import { i as n, n as p, a as f, b as g, t as y } from "./property-B2Ico5CW.js";
2
+ import { o as m } from "./unsafe-html-DfuTUjUu.js";
3
+ var v = Object.defineProperty, u = Object.getOwnPropertyDescriptor, o = (t, e, a, r) => {
4
+ for (var i = r > 1 ? void 0 : r ? u(e, a) : e, h = t.length - 1, s; h >= 0; h--)
5
+ (s = t[h]) && (i = (r ? s(e, a, i) : s(i)) || i);
6
+ return r && i && v(e, a, i), i;
7
7
  };
8
8
  const c = "fhi-title";
9
- let l = class extends p {
9
+ let l = class extends f {
10
10
  constructor() {
11
11
  super(...arguments), this.size = "medium";
12
12
  }
13
- updated(e) {
14
- if (super.updated(e), e.has("level")) {
15
- const t = Number(this.level);
16
- (isNaN(t) || t < 1 || t > 6) && console.error(
13
+ updated(t) {
14
+ if (super.updated(t), t.has("level")) {
15
+ const e = Number(this.level);
16
+ (isNaN(e) || e < 1 || e > 6) && console.error(
17
17
  new TypeError(
18
18
  `The level property must be set to a number between 1 and 6. Current value: ${this.level}`
19
19
  )
20
20
  );
21
21
  }
22
- e.has("color") && (this.style.color = typeof this.color == "string" ? this.color : "var(--fhi-color-neutral-text-default)");
22
+ t.has("color") && (this.style.color = typeof this.color == "string" ? this.color : "var(--fhi-color-neutral-text-default)");
23
23
  }
24
24
  render() {
25
- const e = `
25
+ const t = `
26
26
  <h${this.level} class="title">
27
27
  <slot></slot>
28
28
  </h${this.level}>
29
29
  `;
30
- return f`${v(e)}`;
30
+ return g`${m(t)}`;
31
31
  }
32
32
  };
33
- l.styles = g`
34
- :host {
35
- --font-size-large: var(--fhi-typography-title-large-font-size);
36
- --font-weight-large: var(--fhi-typography-title-large-font-weight);
37
- --line-height-large: var(--fhi-typography-title-large-line-height);
38
- --letter-spacing-large: var(--fhi-typography-title-large-letter-spacing);
39
-
40
- --font-size-medium: var(--fhi-typography-title-medium-font-size);
41
- --font-weight-medium: var(--fhi-typography-title-medium-font-weight);
42
- --line-height-medium: var(--fhi-typography-title-medium-line-height);
43
- --letter-spacing-medium: var(
44
- --fhi-typography-title-medium-letter-spacing
45
- );
46
-
47
- --font-size-small: var(--fhi-typography-title-small-font-size);
48
- --font-weight-small: var(--fhi-typography-title-small-font-weight);
49
- --line-height-small: var(--fhi-typography-title-small-line-height);
50
- --letter-spacing-small: var(--fhi-typography-title-small-letter-spacing);
51
- }
52
-
33
+ l.styles = n`
53
34
  :host {
54
35
  display: block;
55
36
  contain: layout;
@@ -63,42 +44,42 @@ l.styles = g`
63
44
 
64
45
  :host([size='large']) {
65
46
  .title {
66
- font-size: var(--font-size-large);
67
- font-weight: var(--font-weight-large);
68
- line-height: var(--line-height-large);
69
- letter-spacing: var(--letter-spacing-large);
47
+ font-size: var(--fhi-typography-title-large-font-size);
48
+ font-weight: var(--fhi-typography-title-large-font-weight);
49
+ line-height: var(--fhi-typography-title-large-line-height);
50
+ letter-spacing: var(--fhi-typography-title-large-letter-spacing);
70
51
  }
71
52
  }
72
53
 
73
54
  :host([size='medium']) {
74
55
  .title {
75
- font-size: var(--font-size-medium);
76
- font-weight: var(--font-weight-medium);
77
- line-height: var(--line-height-medium);
78
- letter-spacing: var(--letter-spacing-medium);
56
+ font-size: var(--fhi-typography-title-medium-font-size);
57
+ font-weight: var(--fhi-typography-title-medium-font-weight);
58
+ line-height: var(--fhi-typography-title-medium-line-height);
59
+ letter-spacing: var(--fhi-typography-title-medium-letter-spacing);
79
60
  }
80
61
  }
81
62
 
82
63
  :host([size='small']) {
83
64
  .title {
84
- font-size: var(--font-size-small);
85
- font-weight: var(--font-weight-small);
86
- line-height: var(--line-height-small);
87
- letter-spacing: var(--letter-spacing-small);
65
+ font-size: var(--fhi-typography-title-small-font-size);
66
+ font-weight: var(--fhi-typography-title-small-font-weight);
67
+ line-height: var(--fhi-typography-title-small-line-height);
68
+ letter-spacing: var(--fhi-typography-title-small-letter-spacing);
88
69
  }
89
70
  }
90
71
  `;
91
- a([
92
- n({ type: String, reflect: !0 })
72
+ o([
73
+ p({ type: String, reflect: !0 })
93
74
  ], l.prototype, "size", 2);
94
- a([
95
- n({ type: String })
75
+ o([
76
+ p({ type: String })
96
77
  ], l.prototype, "color", 2);
97
- a([
98
- n({ type: Number })
78
+ o([
79
+ p({ type: Number })
99
80
  ], l.prototype, "level", 2);
100
- l = a([
101
- m(c)
81
+ l = o([
82
+ y(c)
102
83
  ], l);
103
84
  export {
104
85
  l as FhiTitle,
package/fhi-title.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"fhi-title.js","sources":["../../src/components/typography/fhi-title/fhi-title.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\n\nexport const FhiTitleSelector = 'fhi-title';\n\nexport type TitleLevel = 1 | 2 | 3 | 4 | 5 | 6;\n\n/**\n * ## FHI Title\n *\n * {@link https://designsystem.fhi.no/?path=/story/komponenter-typography-title--preview}\n *\n * The `<fhi-title>` component is used to display smaller, less prominent title text in accordance with the FHI Design System guidelines.\n *\n * For standard headline text, use the `<fhi-headline>` component instead.\n *\n * For larger, more prominent headline text, use the `<fhi-display>` component instead.\n *\n * Use this component instead of the standard HTML heading elements, `<h1>` - `<h6>`, to ensure consistent styling across your application.\n *\n * @tag fhi-title\n * @element fhi-title\n *\n * @slot - The content of the fhi-title component. This should be pure text.\n */\n@customElement(FhiTitleSelector)\nexport class FhiTitle extends LitElement {\n /**\n * Sets the size of the text styles.\n * @reflect\n * @type {'large' | 'medium' | 'small'}\n */\n @property({ type: String, reflect: true }) size:\n | 'large'\n | 'medium'\n | 'small' = 'medium';\n\n /**\n * Sets color of the given text. It supports any valid CSS color value (e.g. hex, rgb, rgba, hsl, hsla, color names).\n *\n * It is recommended to use Design Tokens for colors defined in the FHI Design System.\n * See: {@link https://designsystem.fhi.no/?path=/docs/design-tokens-farger--docs}\n *\n * Example:\n * ```html\n * <fhi-title color=\"var(--fhi-color-primary-text-default)\">\n * This text will be in the primary text color.\n * </fhi-title>\n * ```\n *\n * @type {string}\n */\n @property({ type: String }) color?: string;\n\n /**\n * Sets the heading level for the text, corresponding to HTML heading elements `<h1>` to `<h6>`.\n * @type {1 | 2 | 3 | 4 | 5 | 6}\n */\n @property({ type: Number }) level!: TitleLevel;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('level')) {\n const levelAsNumber = Number(this.level);\n if (isNaN(levelAsNumber) || levelAsNumber < 1 || levelAsNumber > 6) {\n console.error(\n new TypeError(\n `The level property must be set to a number between 1 and 6. Current value: ${this.level}`,\n ),\n );\n }\n }\n\n if (changedProperties.has('color')) {\n this.style.color =\n typeof this.color === 'string'\n ? this.color\n : 'var(--fhi-color-neutral-text-default)';\n }\n }\n\n render() {\n const template = `\n <h${this.level} class=\"title\">\n <slot></slot>\n </h${this.level}>\n `;\n return html`${unsafeHTML(template)}`;\n }\n\n static styles = css`\n :host {\n --font-size-large: var(--fhi-typography-title-large-font-size);\n --font-weight-large: var(--fhi-typography-title-large-font-weight);\n --line-height-large: var(--fhi-typography-title-large-line-height);\n --letter-spacing-large: var(--fhi-typography-title-large-letter-spacing);\n\n --font-size-medium: var(--fhi-typography-title-medium-font-size);\n --font-weight-medium: var(--fhi-typography-title-medium-font-weight);\n --line-height-medium: var(--fhi-typography-title-medium-line-height);\n --letter-spacing-medium: var(\n --fhi-typography-title-medium-letter-spacing\n );\n\n --font-size-small: var(--fhi-typography-title-small-font-size);\n --font-weight-small: var(--fhi-typography-title-small-font-weight);\n --line-height-small: var(--fhi-typography-title-small-line-height);\n --letter-spacing-small: var(--fhi-typography-title-small-letter-spacing);\n }\n\n :host {\n display: block;\n contain: layout;\n color: var(--fhi-color-neutral-text-default);\n .title {\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n margin: 0;\n }\n }\n\n :host([size='large']) {\n .title {\n font-size: var(--font-size-large);\n font-weight: var(--font-weight-large);\n line-height: var(--line-height-large);\n letter-spacing: var(--letter-spacing-large);\n }\n }\n\n :host([size='medium']) {\n .title {\n font-size: var(--font-size-medium);\n font-weight: var(--font-weight-medium);\n line-height: var(--line-height-medium);\n letter-spacing: var(--letter-spacing-medium);\n }\n }\n\n :host([size='small']) {\n .title {\n font-size: var(--font-size-small);\n font-weight: var(--font-weight-small);\n line-height: var(--line-height-small);\n letter-spacing: var(--letter-spacing-small);\n }\n }\n `;\n}\n"],"names":["FhiTitleSelector","FhiTitle","LitElement","changedProperties","levelAsNumber","template","html","unsafeHTML","css","__decorateClass","property","customElement"],"mappings":";;;;;;;AAIO,MAAMA,IAAmB;AAuBzB,IAAMC,IAAN,cAAuBC,EAAW;AAAA,EAAlC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMsC,KAAA,OAG7B;AAAA,EAAA;AAAA,EAyBd,QAAQC,GAAyC;AAG/C,QAFA,MAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,OAAO,GAAG;AAClC,YAAMC,IAAgB,OAAO,KAAK,KAAK;AACvC,OAAI,MAAMA,CAAa,KAAKA,IAAgB,KAAKA,IAAgB,MAC/D,QAAQ;AAAA,QACN,IAAI;AAAA,UACF,8EAA8E,KAAK,KAAK;AAAA,QAAA;AAAA,MAC1F;AAAA,IAGN;AAEA,IAAID,EAAkB,IAAI,OAAO,MAC/B,KAAK,MAAM,QACT,OAAO,KAAK,SAAU,WAClB,KAAK,QACL;AAAA,EAEV;AAAA,EAEA,SAAS;AACP,UAAME,IAAW;AAAA,UACX,KAAK,KAAK;AAAA;AAAA,WAET,KAAK,KAAK;AAAA;AAEjB,WAAOC,IAAOC,EAAWF,CAAQ,CAAC;AAAA,EACpC;AA4DF;AA3HaJ,EAiEJ,SAASO;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AA3D2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BT,EAMgC,WAAA,QAAA,CAAA;AAoBfQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfT,EA0BiB,WAAA,SAAA,CAAA;AAMAQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAhCfT,EAgCiB,WAAA,SAAA,CAAA;AAhCjBA,IAANQ,EAAA;AAAA,EADNE,EAAcX,CAAgB;AAAA,GAClBC,CAAA;"}
1
+ {"version":3,"file":"fhi-title.js","sources":["../../src/components/typography/fhi-title/fhi-title.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\n\nexport const FhiTitleSelector = 'fhi-title';\n\nexport type TitleLevel = 1 | 2 | 3 | 4 | 5 | 6;\n\n/**\n * ## FHI Title\n *\n * {@link https://designsystem.fhi.no/?path=/story/komponenter-typography-title--preview}\n *\n * The `<fhi-title>` component is used to display smaller, less prominent title text in accordance with the FHI Design System guidelines.\n *\n * For standard headline text, use the `<fhi-headline>` component instead.\n *\n * For larger, more prominent headline text, use the `<fhi-display>` component instead.\n *\n * Use this component instead of the standard HTML heading elements, `<h1>` - `<h6>`, to ensure consistent styling across your application.\n *\n * @tag fhi-title\n * @element fhi-title\n *\n * @slot - The content of the fhi-title component. This should be pure text.\n */\n@customElement(FhiTitleSelector)\nexport class FhiTitle extends LitElement {\n /**\n * Sets the size of the text styles.\n * @reflect\n * @type {'large' | 'medium' | 'small'}\n */\n @property({ type: String, reflect: true }) size:\n | 'large'\n | 'medium'\n | 'small' = 'medium';\n\n /**\n * Sets color of the given text. It supports any valid CSS color value (e.g. hex, rgb, rgba, hsl, hsla, color names).\n *\n * It is recommended to use Design Tokens for colors defined in the FHI Design System.\n * See: {@link https://designsystem.fhi.no/?path=/docs/design-tokens-farger--docs}\n *\n * Example:\n * ```html\n * <fhi-title color=\"var(--fhi-color-primary-text-default)\">\n * This text will be in the primary text color.\n * </fhi-title>\n * ```\n *\n * @type {string}\n */\n @property({ type: String }) color?: string;\n\n /**\n * Sets the heading level for the text, corresponding to HTML heading elements `<h1>` to `<h6>`.\n * @type {1 | 2 | 3 | 4 | 5 | 6}\n */\n @property({ type: Number }) level!: TitleLevel;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('level')) {\n const levelAsNumber = Number(this.level);\n if (isNaN(levelAsNumber) || levelAsNumber < 1 || levelAsNumber > 6) {\n console.error(\n new TypeError(\n `The level property must be set to a number between 1 and 6. Current value: ${this.level}`,\n ),\n );\n }\n }\n\n if (changedProperties.has('color')) {\n this.style.color =\n typeof this.color === 'string'\n ? this.color\n : 'var(--fhi-color-neutral-text-default)';\n }\n }\n\n render() {\n const template = `\n <h${this.level} class=\"title\">\n <slot></slot>\n </h${this.level}>\n `;\n return html`${unsafeHTML(template)}`;\n }\n\n static styles = css`\n :host {\n display: block;\n contain: layout;\n color: var(--fhi-color-neutral-text-default);\n .title {\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n margin: 0;\n }\n }\n\n :host([size='large']) {\n .title {\n font-size: var(--fhi-typography-title-large-font-size);\n font-weight: var(--fhi-typography-title-large-font-weight);\n line-height: var(--fhi-typography-title-large-line-height);\n letter-spacing: var(--fhi-typography-title-large-letter-spacing);\n }\n }\n\n :host([size='medium']) {\n .title {\n font-size: var(--fhi-typography-title-medium-font-size);\n font-weight: var(--fhi-typography-title-medium-font-weight);\n line-height: var(--fhi-typography-title-medium-line-height);\n letter-spacing: var(--fhi-typography-title-medium-letter-spacing);\n }\n }\n\n :host([size='small']) {\n .title {\n font-size: var(--fhi-typography-title-small-font-size);\n font-weight: var(--fhi-typography-title-small-font-weight);\n line-height: var(--fhi-typography-title-small-line-height);\n letter-spacing: var(--fhi-typography-title-small-letter-spacing);\n }\n }\n `;\n}\n"],"names":["FhiTitleSelector","FhiTitle","LitElement","changedProperties","levelAsNumber","template","html","unsafeHTML","css","__decorateClass","property","customElement"],"mappings":";;;;;;;AAIO,MAAMA,IAAmB;AAuBzB,IAAMC,IAAN,cAAuBC,EAAW;AAAA,EAAlC,cAAA;AAAA,UAAA,GAAA,SAAA,GAMsC,KAAA,OAG7B;AAAA,EAAA;AAAA,EAyBd,QAAQC,GAAyC;AAG/C,QAFA,MAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,OAAO,GAAG;AAClC,YAAMC,IAAgB,OAAO,KAAK,KAAK;AACvC,OAAI,MAAMA,CAAa,KAAKA,IAAgB,KAAKA,IAAgB,MAC/D,QAAQ;AAAA,QACN,IAAI;AAAA,UACF,8EAA8E,KAAK,KAAK;AAAA,QAAA;AAAA,MAC1F;AAAA,IAGN;AAEA,IAAID,EAAkB,IAAI,OAAO,MAC/B,KAAK,MAAM,QACT,OAAO,KAAK,SAAU,WAClB,KAAK,QACL;AAAA,EAEV;AAAA,EAEA,SAAS;AACP,UAAME,IAAW;AAAA,UACX,KAAK,KAAK;AAAA;AAAA,WAET,KAAK,KAAK;AAAA;AAEjB,WAAOC,IAAOC,EAAWF,CAAQ,CAAC;AAAA,EACpC;AAyCF;AAxGaJ,EAiEJ,SAASO;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AA3D2BC,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BT,EAMgC,WAAA,QAAA,CAAA;AAoBfQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA1BfT,EA0BiB,WAAA,SAAA,CAAA;AAMAQ,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAhCfT,EAgCiB,WAAA,SAAA,CAAA;AAhCjBA,IAANQ,EAAA;AAAA,EADNE,EAAcX,CAAgB;AAAA,GAClBC,CAAA;"}
package/package.json CHANGED
@@ -1 +1 @@
1
- {"title":"FHI Designsystem","author":"FHI Designsystem team","name":"@folkehelseinstituttet/designsystem","version":"0.38.1","description":"The official design system for the Norwegian Institute of Public Health implemented as web components","keywords":["fhi","folkehelseinstituttet","components","design","system","framework","frontend","web-component","web component","ui"],"customElements":".temp/custom-elements.json","web-types":"./web-types.json","homepage":"https://github.com/FHIDev/Fhi.Designsystem","bugs":{"url":"https://github.com/FHIDev/Fhi.Designsystem/issues"},"repository":{"type":"git","url":"git+https://github.com/FHIDev/Fhi.Designsystem.git"},"license":"MIT","browserslist":["> 0.5%","last 2 versions"],"main":"index.js","type":"module","scripts":{"dev":"vite","build":"pnpm analyze && pnpm build:cdn && pnpm build:npm && pnpm build:github && pnpm clean","build:cdn":"tsc && cross-env DEPLOY_TARGET=cdn vite build","build:npm":"tsc && cross-env DEPLOY_TARGET=npm vite build","build:github":"tsc && cross-env DEPLOY_TARGET=github vite build","storybook":"storybook dev -p 6006","storybook:build":"pnpm analyze && storybook build","generate:icons":"node ./scripts/generate-icon-components.js --input ./src/assets/icons/ --output ./src/components/icons --clean-output-folder","test":"wtr ./**/*.test.ts --node-resolve --playwright --browsers chromium webkit","lint":"pnpm lint:eslint && pnpm lint:prettier","lint:eslint":"eslint \"**/*.{js,ts}\"","lint:prettier":"prettier \"**/*.js\" --check --ignore-path .gitignore","format":"pnpm format:eslint && pnpm format:prettier","format:eslint":"eslint \"**/*.{js,ts}\" --fix","format:prettier":"prettier \"**/*.js\" --write --ignore-path .gitignore","publish:npm":"pnpm build && cd dist/npm && npm publish","changelog:ci":"release-it --ci","analyze":"cem analyze --litelement","clean":"rimraf .temp","build-storybook":"storybook build"},"peerDependencies":{"lit":"~3.2.0"},"devDependencies":{"@custom-elements-manifest/analyzer":"^0.10.10","@esm-bundle/chai":"4.3.4-fix.0","@open-wc/testing":"~4.0.0","@playwright/test":"^1.57.0","@release-it/conventional-changelog":"~11.0.0","@storybook/addon-docs":"^10.2.8","@storybook/web-components-vite":"^10.2.8","@types/mocha":"~10.0.10","@types/node":"~22.5.5","@types/react":"^19.2.14","@wc-toolkit/cem-sorter":"^1.0.1","@wc-toolkit/type-parser":"^1.2.0","@web/dev-server":"~0.4.6","@web/dev-server-esbuild":"~1.0.4","@web/test-runner":"~0.18.3","@web/test-runner-playwright":"~0.11.1","cross-env":"7.0.3","custom-element-jet-brains-integration":"^1.7.0","lit":"~3.2.1","mocha":"~10.7.3","playwright":"^1.58.2","release-it":"~20.0.1","rimraf":"^6.1.2","storybook":"^10.2.8","storybook-design-token":"^5.0.0","svgo":"^3.3.2","vite":"~6.4.1","vite-plugin-static-copy":"~3.1.4"},"dependencies":{"@floating-ui/dom":"^1.7.4"},"pnpm":{"overrides":{"undici@<6.23.0":">=6.23.0","diff@>=5.0.0 <5.2.2":">=5.2.2","qs@>=6.7.0 <=6.14.1":">=6.14.2"}},"exports":{"./fhi-button":{"default":"./fhi-button.js","types":"./fhi-button.d.ts"},"./fhi-checkbox":{"default":"./fhi-checkbox.js","types":"./fhi-checkbox.d.ts"},"./fhi-date-input":{"default":"./fhi-date-input.js","types":"./fhi-date-input.d.ts"},"./fhi-flex":{"default":"./fhi-flex.js","types":"./fhi-flex.d.ts"},"./fhi-grid":{"default":"./fhi-grid.js","types":"./fhi-grid.d.ts"},"./fhi-modal-dialog":{"default":"./fhi-modal-dialog.js","types":"./fhi-modal-dialog.d.ts"},"./fhi-radio":{"default":"./fhi-radio.js","types":"./fhi-radio.d.ts"},"./fhi-tag":{"default":"./fhi-tag.js","types":"./fhi-tag.d.ts"},"./fhi-text-input":{"default":"./fhi-text-input.js","types":"./fhi-text-input.d.ts"},"./fhi-tooltip":{"default":"./fhi-tooltip.js","types":"./fhi-tooltip.d.ts"},"./fhi-icon-arrow-down-left":{"default":"./fhi-icon-arrow-down-left.js","types":"./fhi-icon-arrow-down-left.d.ts"},"./fhi-icon-arrow-down-right":{"default":"./fhi-icon-arrow-down-right.js","types":"./fhi-icon-arrow-down-right.d.ts"},"./fhi-icon-arrow-down":{"default":"./fhi-icon-arrow-down.js","types":"./fhi-icon-arrow-down.d.ts"},"./fhi-icon-arrow-left":{"default":"./fhi-icon-arrow-left.js","types":"./fhi-icon-arrow-left.d.ts"},"./fhi-icon-arrow-right-left":{"default":"./fhi-icon-arrow-right-left.js","types":"./fhi-icon-arrow-right-left.d.ts"},"./fhi-icon-arrow-right":{"default":"./fhi-icon-arrow-right.js","types":"./fhi-icon-arrow-right.d.ts"},"./fhi-icon-arrow-up-down":{"default":"./fhi-icon-arrow-up-down.js","types":"./fhi-icon-arrow-up-down.d.ts"},"./fhi-icon-arrow-up-left":{"default":"./fhi-icon-arrow-up-left.js","types":"./fhi-icon-arrow-up-left.d.ts"},"./fhi-icon-arrow-up-right":{"default":"./fhi-icon-arrow-up-right.js","types":"./fhi-icon-arrow-up-right.d.ts"},"./fhi-icon-arrow-up":{"default":"./fhi-icon-arrow-up.js","types":"./fhi-icon-arrow-up.d.ts"},"./fhi-icon-bell":{"default":"./fhi-icon-bell.js","types":"./fhi-icon-bell.d.ts"},"./fhi-icon-calendar-clock":{"default":"./fhi-icon-calendar-clock.js","types":"./fhi-icon-calendar-clock.d.ts"},"./fhi-icon-calendar":{"default":"./fhi-icon-calendar.js","types":"./fhi-icon-calendar.d.ts"},"./fhi-icon-chart-bar-stacked":{"default":"./fhi-icon-chart-bar-stacked.js","types":"./fhi-icon-chart-bar-stacked.d.ts"},"./fhi-icon-chart-bar":{"default":"./fhi-icon-chart-bar.js","types":"./fhi-icon-chart-bar.d.ts"},"./fhi-icon-chart-column-stacked":{"default":"./fhi-icon-chart-column-stacked.js","types":"./fhi-icon-chart-column-stacked.d.ts"},"./fhi-icon-chart-column":{"default":"./fhi-icon-chart-column.js","types":"./fhi-icon-chart-column.d.ts"},"./fhi-icon-chart-line":{"default":"./fhi-icon-chart-line.js","types":"./fhi-icon-chart-line.d.ts"},"./fhi-icon-chart-no-axes-combined":{"default":"./fhi-icon-chart-no-axes-combined.js","types":"./fhi-icon-chart-no-axes-combined.d.ts"},"./fhi-icon-chart-pie":{"default":"./fhi-icon-chart-pie.js","types":"./fhi-icon-chart-pie.d.ts"},"./fhi-icon-check":{"default":"./fhi-icon-check.js","types":"./fhi-icon-check.d.ts"},"./fhi-icon-chevron-down":{"default":"./fhi-icon-chevron-down.js","types":"./fhi-icon-chevron-down.d.ts"},"./fhi-icon-chevron-left":{"default":"./fhi-icon-chevron-left.js","types":"./fhi-icon-chevron-left.d.ts"},"./fhi-icon-chevron-right":{"default":"./fhi-icon-chevron-right.js","types":"./fhi-icon-chevron-right.d.ts"},"./fhi-icon-chevron-up":{"default":"./fhi-icon-chevron-up.js","types":"./fhi-icon-chevron-up.d.ts"},"./fhi-icon-chevrons-down":{"default":"./fhi-icon-chevrons-down.js","types":"./fhi-icon-chevrons-down.d.ts"},"./fhi-icon-chevrons-left":{"default":"./fhi-icon-chevrons-left.js","types":"./fhi-icon-chevrons-left.d.ts"},"./fhi-icon-chevrons-right":{"default":"./fhi-icon-chevrons-right.js","types":"./fhi-icon-chevrons-right.d.ts"},"./fhi-icon-chevrons-up":{"default":"./fhi-icon-chevrons-up.js","types":"./fhi-icon-chevrons-up.d.ts"},"./fhi-icon-circle-arrow-down":{"default":"./fhi-icon-circle-arrow-down.js","types":"./fhi-icon-circle-arrow-down.d.ts"},"./fhi-icon-circle-arrow-left":{"default":"./fhi-icon-circle-arrow-left.js","types":"./fhi-icon-circle-arrow-left.d.ts"},"./fhi-icon-circle-arrow-right":{"default":"./fhi-icon-circle-arrow-right.js","types":"./fhi-icon-circle-arrow-right.d.ts"},"./fhi-icon-circle-arrow-up":{"default":"./fhi-icon-circle-arrow-up.js","types":"./fhi-icon-circle-arrow-up.d.ts"},"./fhi-icon-circle-check-big":{"default":"./fhi-icon-circle-check-big.js","types":"./fhi-icon-circle-check-big.d.ts"},"./fhi-icon-circle-check":{"default":"./fhi-icon-circle-check.js","types":"./fhi-icon-circle-check.d.ts"},"./fhi-icon-circle-chevron-down":{"default":"./fhi-icon-circle-chevron-down.js","types":"./fhi-icon-circle-chevron-down.d.ts"},"./fhi-icon-circle-chevron-left":{"default":"./fhi-icon-circle-chevron-left.js","types":"./fhi-icon-circle-chevron-left.d.ts"},"./fhi-icon-circle-chevron-right":{"default":"./fhi-icon-circle-chevron-right.js","types":"./fhi-icon-circle-chevron-right.d.ts"},"./fhi-icon-circle-chevron-up":{"default":"./fhi-icon-circle-chevron-up.js","types":"./fhi-icon-circle-chevron-up.d.ts"},"./fhi-icon-circle-exclamation":{"default":"./fhi-icon-circle-exclamation.js","types":"./fhi-icon-circle-exclamation.d.ts"},"./fhi-icon-circle-info":{"default":"./fhi-icon-circle-info.js","types":"./fhi-icon-circle-info.d.ts"},"./fhi-icon-circle-minus":{"default":"./fhi-icon-circle-minus.js","types":"./fhi-icon-circle-minus.d.ts"},"./fhi-icon-circle-plus":{"default":"./fhi-icon-circle-plus.js","types":"./fhi-icon-circle-plus.d.ts"},"./fhi-icon-circle-question":{"default":"./fhi-icon-circle-question.js","types":"./fhi-icon-circle-question.d.ts"},"./fhi-icon-circle-x":{"default":"./fhi-icon-circle-x.js","types":"./fhi-icon-circle-x.d.ts"},"./fhi-icon-circle":{"default":"./fhi-icon-circle.js","types":"./fhi-icon-circle.d.ts"},"./fhi-icon-clock":{"default":"./fhi-icon-clock.js","types":"./fhi-icon-clock.d.ts"},"./fhi-icon-copy":{"default":"./fhi-icon-copy.js","types":"./fhi-icon-copy.d.ts"},"./fhi-icon-download":{"default":"./fhi-icon-download.js","types":"./fhi-icon-download.d.ts"},"./fhi-icon-ellipsis-vertical":{"default":"./fhi-icon-ellipsis-vertical.js","types":"./fhi-icon-ellipsis-vertical.d.ts"},"./fhi-icon-ellipsis":{"default":"./fhi-icon-ellipsis.js","types":"./fhi-icon-ellipsis.d.ts"},"./fhi-icon-exclamation":{"default":"./fhi-icon-exclamation.js","types":"./fhi-icon-exclamation.d.ts"},"./fhi-icon-expand":{"default":"./fhi-icon-expand.js","types":"./fhi-icon-expand.d.ts"},"./fhi-icon-external-link":{"default":"./fhi-icon-external-link.js","types":"./fhi-icon-external-link.d.ts"},"./fhi-icon-eye-off":{"default":"./fhi-icon-eye-off.js","types":"./fhi-icon-eye-off.d.ts"},"./fhi-icon-eye":{"default":"./fhi-icon-eye.js","types":"./fhi-icon-eye.d.ts"},"./fhi-icon-file-text":{"default":"./fhi-icon-file-text.js","types":"./fhi-icon-file-text.d.ts"},"./fhi-icon-file":{"default":"./fhi-icon-file.js","types":"./fhi-icon-file.d.ts"},"./fhi-icon-filter":{"default":"./fhi-icon-filter.js","types":"./fhi-icon-filter.d.ts"},"./fhi-icon-folder":{"default":"./fhi-icon-folder.js","types":"./fhi-icon-folder.d.ts"},"./fhi-icon-gear":{"default":"./fhi-icon-gear.js","types":"./fhi-icon-gear.d.ts"},"./fhi-icon-grid-9-dots":{"default":"./fhi-icon-grid-9-dots.js","types":"./fhi-icon-grid-9-dots.d.ts"},"./fhi-icon-grip-horizontal":{"default":"./fhi-icon-grip-horizontal.js","types":"./fhi-icon-grip-horizontal.d.ts"},"./fhi-icon-grip-vertical":{"default":"./fhi-icon-grip-vertical.js","types":"./fhi-icon-grip-vertical.d.ts"},"./fhi-icon-history":{"default":"./fhi-icon-history.js","types":"./fhi-icon-history.d.ts"},"./fhi-icon-info":{"default":"./fhi-icon-info.js","types":"./fhi-icon-info.d.ts"},"./fhi-icon-link-2-off":{"default":"./fhi-icon-link-2-off.js","types":"./fhi-icon-link-2-off.d.ts"},"./fhi-icon-link-2":{"default":"./fhi-icon-link-2.js","types":"./fhi-icon-link-2.d.ts"},"./fhi-icon-link":{"default":"./fhi-icon-link.js","types":"./fhi-icon-link.d.ts"},"./fhi-icon-lock-open":{"default":"./fhi-icon-lock-open.js","types":"./fhi-icon-lock-open.d.ts"},"./fhi-icon-lock":{"default":"./fhi-icon-lock.js","types":"./fhi-icon-lock.d.ts"},"./fhi-icon-log-in":{"default":"./fhi-icon-log-in.js","types":"./fhi-icon-log-in.d.ts"},"./fhi-icon-log-out":{"default":"./fhi-icon-log-out.js","types":"./fhi-icon-log-out.d.ts"},"./fhi-icon-mail":{"default":"./fhi-icon-mail.js","types":"./fhi-icon-mail.d.ts"},"./fhi-icon-map-pin":{"default":"./fhi-icon-map-pin.js","types":"./fhi-icon-map-pin.d.ts"},"./fhi-icon-menu":{"default":"./fhi-icon-menu.js","types":"./fhi-icon-menu.d.ts"},"./fhi-icon-message":{"default":"./fhi-icon-message.js","types":"./fhi-icon-message.d.ts"},"./fhi-icon-minus":{"default":"./fhi-icon-minus.js","types":"./fhi-icon-minus.d.ts"},"./fhi-icon-octagon-alert":{"default":"./fhi-icon-octagon-alert.js","types":"./fhi-icon-octagon-alert.d.ts"},"./fhi-icon-paperclip":{"default":"./fhi-icon-paperclip.js","types":"./fhi-icon-paperclip.d.ts"},"./fhi-icon-pencil":{"default":"./fhi-icon-pencil.js","types":"./fhi-icon-pencil.d.ts"},"./fhi-icon-phone":{"default":"./fhi-icon-phone.js","types":"./fhi-icon-phone.d.ts"},"./fhi-icon-pin-off":{"default":"./fhi-icon-pin-off.js","types":"./fhi-icon-pin-off.d.ts"},"./fhi-icon-pin":{"default":"./fhi-icon-pin.js","types":"./fhi-icon-pin.d.ts"},"./fhi-icon-plus":{"default":"./fhi-icon-plus.js","types":"./fhi-icon-plus.d.ts"},"./fhi-icon-printer":{"default":"./fhi-icon-printer.js","types":"./fhi-icon-printer.d.ts"},"./fhi-icon-question":{"default":"./fhi-icon-question.js","types":"./fhi-icon-question.d.ts"},"./fhi-icon-refresh":{"default":"./fhi-icon-refresh.js","types":"./fhi-icon-refresh.d.ts"},"./fhi-icon-rotate-left":{"default":"./fhi-icon-rotate-left.js","types":"./fhi-icon-rotate-left.d.ts"},"./fhi-icon-rotate-right":{"default":"./fhi-icon-rotate-right.js","types":"./fhi-icon-rotate-right.d.ts"},"./fhi-icon-search":{"default":"./fhi-icon-search.js","types":"./fhi-icon-search.d.ts"},"./fhi-icon-send":{"default":"./fhi-icon-send.js","types":"./fhi-icon-send.d.ts"},"./fhi-icon-share":{"default":"./fhi-icon-share.js","types":"./fhi-icon-share.d.ts"},"./fhi-icon-sheet":{"default":"./fhi-icon-sheet.js","types":"./fhi-icon-sheet.d.ts"},"./fhi-icon-square-check-big":{"default":"./fhi-icon-square-check-big.js","types":"./fhi-icon-square-check-big.d.ts"},"./fhi-icon-square-check":{"default":"./fhi-icon-square-check.js","types":"./fhi-icon-square-check.d.ts"},"./fhi-icon-square-pen":{"default":"./fhi-icon-square-pen.js","types":"./fhi-icon-square-pen.d.ts"},"./fhi-icon-square-x":{"default":"./fhi-icon-square-x.js","types":"./fhi-icon-square-x.d.ts"},"./fhi-icon-square":{"default":"./fhi-icon-square.js","types":"./fhi-icon-square.d.ts"},"./fhi-icon-trash":{"default":"./fhi-icon-trash.js","types":"./fhi-icon-trash.d.ts"},"./fhi-icon-triangle-alert":{"default":"./fhi-icon-triangle-alert.js","types":"./fhi-icon-triangle-alert.d.ts"},"./fhi-icon-upload":{"default":"./fhi-icon-upload.js","types":"./fhi-icon-upload.d.ts"},"./fhi-icon-user":{"default":"./fhi-icon-user.js","types":"./fhi-icon-user.d.ts"},"./fhi-icon-x":{"default":"./fhi-icon-x.js","types":"./fhi-icon-x.d.ts"},"./fhi-data-table":{"default":"./fhi-data-table.js","types":"./fhi-data-table.d.ts"},"./fhi-data-table-cell":{"default":"./fhi-data-table-cell.js","types":"./fhi-data-table-cell.d.ts"},"./fhi-data-table-row":{"default":"./fhi-data-table-row.js","types":"./fhi-data-table-row.d.ts"},"./fhi-body":{"default":"./fhi-body.js","types":"./fhi-body.d.ts"},"./fhi-display":{"default":"./fhi-display.js","types":"./fhi-display.d.ts"},"./fhi-headline":{"default":"./fhi-headline.js","types":"./fhi-headline.d.ts"},"./fhi-label":{"default":"./fhi-label.js","types":"./fhi-label.d.ts"},"./fhi-title":{"default":"./fhi-title.js","types":"./fhi-title.d.ts"},".":{"default":"./index.js"},"./theme/default.css":{"style":"./theme/default.css"},"./custom-elements.json":{"default":"./custom-elements.json"}}}
1
+ {"title":"FHI Designsystem","author":"FHI Designsystem team","name":"@folkehelseinstituttet/designsystem","version":"0.38.2","description":"The official design system for the Norwegian Institute of Public Health implemented as web components","keywords":["fhi","folkehelseinstituttet","components","design","system","framework","frontend","web-component","web component","ui"],"customElements":".temp/custom-elements.json","web-types":"./web-types.json","homepage":"https://github.com/FHIDev/Fhi.Designsystem","bugs":{"url":"https://github.com/FHIDev/Fhi.Designsystem/issues"},"repository":{"type":"git","url":"git+https://github.com/FHIDev/Fhi.Designsystem.git"},"license":"MIT","browserslist":["> 0.5%","last 2 versions"],"main":"index.js","type":"module","scripts":{"dev":"vite","build":"pnpm analyze && pnpm build:cdn && pnpm build:npm && pnpm build:github && pnpm clean","build:cdn":"tsc && cross-env DEPLOY_TARGET=cdn vite build","build:npm":"tsc && cross-env DEPLOY_TARGET=npm vite build","build:github":"tsc && cross-env DEPLOY_TARGET=github vite build","storybook":"storybook dev -p 6006","storybook:build":"pnpm analyze && storybook build","generate:icons":"node ./scripts/generate-icon-components.js --input ./src/assets/icons/ --output ./src/components/icons --clean-output-folder","test":"wtr ./**/*.test.ts --node-resolve --playwright --browsers chromium webkit","lint":"pnpm lint:eslint && pnpm lint:prettier","lint:eslint":"eslint \"**/*.{js,ts}\"","lint:prettier":"prettier \"**/*.js\" --check --ignore-path .gitignore","format":"pnpm format:eslint && pnpm format:prettier","format:eslint":"eslint \"**/*.{js,ts}\" --fix","format:prettier":"prettier \"**/*.js\" --write --ignore-path .gitignore","publish:npm":"pnpm build && cd dist/npm && npm publish","changelog:ci":"release-it --ci","analyze":"cem analyze --litelement","clean":"rimraf .temp","build-storybook":"storybook build"},"peerDependencies":{"lit":"~3.2.0"},"devDependencies":{"@custom-elements-manifest/analyzer":"^0.10.10","@esm-bundle/chai":"4.3.4-fix.0","@open-wc/testing":"~4.0.0","@playwright/test":"^1.57.0","@release-it/conventional-changelog":"~11.0.0","@storybook/addon-docs":"^10.2.8","@storybook/web-components-vite":"^10.2.8","@types/mocha":"~10.0.10","@types/node":"~22.5.5","@types/react":"^19.2.14","@wc-toolkit/cem-sorter":"^1.0.1","@wc-toolkit/type-parser":"^1.2.0","@web/dev-server":"~0.4.6","@web/dev-server-esbuild":"~1.0.4","@web/test-runner":"~0.18.3","@web/test-runner-playwright":"~0.11.1","cross-env":"7.0.3","custom-element-jet-brains-integration":"^1.7.0","lit":"~3.2.1","mocha":"~10.7.3","playwright":"^1.58.2","release-it":"~20.0.1","rimraf":"^6.1.2","storybook":"^10.2.8","storybook-design-token":"^5.0.0","svgo":"^3.3.2","vite":"~6.4.1","vite-plugin-static-copy":"~3.1.4"},"dependencies":{"@floating-ui/dom":"^1.7.4"},"pnpm":{"overrides":{"undici@<6.23.0":">=6.23.0","diff@>=5.0.0 <5.2.2":">=5.2.2","qs@>=6.7.0 <=6.14.1":">=6.14.2"}},"exports":{"./fhi-button":{"default":"./fhi-button.js","types":"./fhi-button.d.ts"},"./fhi-checkbox":{"default":"./fhi-checkbox.js","types":"./fhi-checkbox.d.ts"},"./fhi-date-input":{"default":"./fhi-date-input.js","types":"./fhi-date-input.d.ts"},"./fhi-flex":{"default":"./fhi-flex.js","types":"./fhi-flex.d.ts"},"./fhi-grid":{"default":"./fhi-grid.js","types":"./fhi-grid.d.ts"},"./fhi-modal-dialog":{"default":"./fhi-modal-dialog.js","types":"./fhi-modal-dialog.d.ts"},"./fhi-radio":{"default":"./fhi-radio.js","types":"./fhi-radio.d.ts"},"./fhi-tag":{"default":"./fhi-tag.js","types":"./fhi-tag.d.ts"},"./fhi-text-input":{"default":"./fhi-text-input.js","types":"./fhi-text-input.d.ts"},"./fhi-tooltip":{"default":"./fhi-tooltip.js","types":"./fhi-tooltip.d.ts"},"./fhi-icon-arrow-down-left":{"default":"./fhi-icon-arrow-down-left.js","types":"./fhi-icon-arrow-down-left.d.ts"},"./fhi-icon-arrow-down-right":{"default":"./fhi-icon-arrow-down-right.js","types":"./fhi-icon-arrow-down-right.d.ts"},"./fhi-icon-arrow-down":{"default":"./fhi-icon-arrow-down.js","types":"./fhi-icon-arrow-down.d.ts"},"./fhi-icon-arrow-left":{"default":"./fhi-icon-arrow-left.js","types":"./fhi-icon-arrow-left.d.ts"},"./fhi-icon-arrow-right-left":{"default":"./fhi-icon-arrow-right-left.js","types":"./fhi-icon-arrow-right-left.d.ts"},"./fhi-icon-arrow-right":{"default":"./fhi-icon-arrow-right.js","types":"./fhi-icon-arrow-right.d.ts"},"./fhi-icon-arrow-up-down":{"default":"./fhi-icon-arrow-up-down.js","types":"./fhi-icon-arrow-up-down.d.ts"},"./fhi-icon-arrow-up-left":{"default":"./fhi-icon-arrow-up-left.js","types":"./fhi-icon-arrow-up-left.d.ts"},"./fhi-icon-arrow-up-right":{"default":"./fhi-icon-arrow-up-right.js","types":"./fhi-icon-arrow-up-right.d.ts"},"./fhi-icon-arrow-up":{"default":"./fhi-icon-arrow-up.js","types":"./fhi-icon-arrow-up.d.ts"},"./fhi-icon-bell":{"default":"./fhi-icon-bell.js","types":"./fhi-icon-bell.d.ts"},"./fhi-icon-calendar-clock":{"default":"./fhi-icon-calendar-clock.js","types":"./fhi-icon-calendar-clock.d.ts"},"./fhi-icon-calendar":{"default":"./fhi-icon-calendar.js","types":"./fhi-icon-calendar.d.ts"},"./fhi-icon-chart-bar-stacked":{"default":"./fhi-icon-chart-bar-stacked.js","types":"./fhi-icon-chart-bar-stacked.d.ts"},"./fhi-icon-chart-bar":{"default":"./fhi-icon-chart-bar.js","types":"./fhi-icon-chart-bar.d.ts"},"./fhi-icon-chart-column-stacked":{"default":"./fhi-icon-chart-column-stacked.js","types":"./fhi-icon-chart-column-stacked.d.ts"},"./fhi-icon-chart-column":{"default":"./fhi-icon-chart-column.js","types":"./fhi-icon-chart-column.d.ts"},"./fhi-icon-chart-line":{"default":"./fhi-icon-chart-line.js","types":"./fhi-icon-chart-line.d.ts"},"./fhi-icon-chart-no-axes-combined":{"default":"./fhi-icon-chart-no-axes-combined.js","types":"./fhi-icon-chart-no-axes-combined.d.ts"},"./fhi-icon-chart-pie":{"default":"./fhi-icon-chart-pie.js","types":"./fhi-icon-chart-pie.d.ts"},"./fhi-icon-check":{"default":"./fhi-icon-check.js","types":"./fhi-icon-check.d.ts"},"./fhi-icon-chevron-down":{"default":"./fhi-icon-chevron-down.js","types":"./fhi-icon-chevron-down.d.ts"},"./fhi-icon-chevron-left":{"default":"./fhi-icon-chevron-left.js","types":"./fhi-icon-chevron-left.d.ts"},"./fhi-icon-chevron-right":{"default":"./fhi-icon-chevron-right.js","types":"./fhi-icon-chevron-right.d.ts"},"./fhi-icon-chevron-up":{"default":"./fhi-icon-chevron-up.js","types":"./fhi-icon-chevron-up.d.ts"},"./fhi-icon-chevrons-down":{"default":"./fhi-icon-chevrons-down.js","types":"./fhi-icon-chevrons-down.d.ts"},"./fhi-icon-chevrons-left":{"default":"./fhi-icon-chevrons-left.js","types":"./fhi-icon-chevrons-left.d.ts"},"./fhi-icon-chevrons-right":{"default":"./fhi-icon-chevrons-right.js","types":"./fhi-icon-chevrons-right.d.ts"},"./fhi-icon-chevrons-up":{"default":"./fhi-icon-chevrons-up.js","types":"./fhi-icon-chevrons-up.d.ts"},"./fhi-icon-circle-arrow-down":{"default":"./fhi-icon-circle-arrow-down.js","types":"./fhi-icon-circle-arrow-down.d.ts"},"./fhi-icon-circle-arrow-left":{"default":"./fhi-icon-circle-arrow-left.js","types":"./fhi-icon-circle-arrow-left.d.ts"},"./fhi-icon-circle-arrow-right":{"default":"./fhi-icon-circle-arrow-right.js","types":"./fhi-icon-circle-arrow-right.d.ts"},"./fhi-icon-circle-arrow-up":{"default":"./fhi-icon-circle-arrow-up.js","types":"./fhi-icon-circle-arrow-up.d.ts"},"./fhi-icon-circle-check-big":{"default":"./fhi-icon-circle-check-big.js","types":"./fhi-icon-circle-check-big.d.ts"},"./fhi-icon-circle-check":{"default":"./fhi-icon-circle-check.js","types":"./fhi-icon-circle-check.d.ts"},"./fhi-icon-circle-chevron-down":{"default":"./fhi-icon-circle-chevron-down.js","types":"./fhi-icon-circle-chevron-down.d.ts"},"./fhi-icon-circle-chevron-left":{"default":"./fhi-icon-circle-chevron-left.js","types":"./fhi-icon-circle-chevron-left.d.ts"},"./fhi-icon-circle-chevron-right":{"default":"./fhi-icon-circle-chevron-right.js","types":"./fhi-icon-circle-chevron-right.d.ts"},"./fhi-icon-circle-chevron-up":{"default":"./fhi-icon-circle-chevron-up.js","types":"./fhi-icon-circle-chevron-up.d.ts"},"./fhi-icon-circle-exclamation":{"default":"./fhi-icon-circle-exclamation.js","types":"./fhi-icon-circle-exclamation.d.ts"},"./fhi-icon-circle-info":{"default":"./fhi-icon-circle-info.js","types":"./fhi-icon-circle-info.d.ts"},"./fhi-icon-circle-minus":{"default":"./fhi-icon-circle-minus.js","types":"./fhi-icon-circle-minus.d.ts"},"./fhi-icon-circle-plus":{"default":"./fhi-icon-circle-plus.js","types":"./fhi-icon-circle-plus.d.ts"},"./fhi-icon-circle-question":{"default":"./fhi-icon-circle-question.js","types":"./fhi-icon-circle-question.d.ts"},"./fhi-icon-circle-x":{"default":"./fhi-icon-circle-x.js","types":"./fhi-icon-circle-x.d.ts"},"./fhi-icon-circle":{"default":"./fhi-icon-circle.js","types":"./fhi-icon-circle.d.ts"},"./fhi-icon-clock":{"default":"./fhi-icon-clock.js","types":"./fhi-icon-clock.d.ts"},"./fhi-icon-copy":{"default":"./fhi-icon-copy.js","types":"./fhi-icon-copy.d.ts"},"./fhi-icon-download":{"default":"./fhi-icon-download.js","types":"./fhi-icon-download.d.ts"},"./fhi-icon-ellipsis-vertical":{"default":"./fhi-icon-ellipsis-vertical.js","types":"./fhi-icon-ellipsis-vertical.d.ts"},"./fhi-icon-ellipsis":{"default":"./fhi-icon-ellipsis.js","types":"./fhi-icon-ellipsis.d.ts"},"./fhi-icon-exclamation":{"default":"./fhi-icon-exclamation.js","types":"./fhi-icon-exclamation.d.ts"},"./fhi-icon-expand":{"default":"./fhi-icon-expand.js","types":"./fhi-icon-expand.d.ts"},"./fhi-icon-external-link":{"default":"./fhi-icon-external-link.js","types":"./fhi-icon-external-link.d.ts"},"./fhi-icon-eye-off":{"default":"./fhi-icon-eye-off.js","types":"./fhi-icon-eye-off.d.ts"},"./fhi-icon-eye":{"default":"./fhi-icon-eye.js","types":"./fhi-icon-eye.d.ts"},"./fhi-icon-file-text":{"default":"./fhi-icon-file-text.js","types":"./fhi-icon-file-text.d.ts"},"./fhi-icon-file":{"default":"./fhi-icon-file.js","types":"./fhi-icon-file.d.ts"},"./fhi-icon-filter":{"default":"./fhi-icon-filter.js","types":"./fhi-icon-filter.d.ts"},"./fhi-icon-folder":{"default":"./fhi-icon-folder.js","types":"./fhi-icon-folder.d.ts"},"./fhi-icon-gear":{"default":"./fhi-icon-gear.js","types":"./fhi-icon-gear.d.ts"},"./fhi-icon-grid-9-dots":{"default":"./fhi-icon-grid-9-dots.js","types":"./fhi-icon-grid-9-dots.d.ts"},"./fhi-icon-grip-horizontal":{"default":"./fhi-icon-grip-horizontal.js","types":"./fhi-icon-grip-horizontal.d.ts"},"./fhi-icon-grip-vertical":{"default":"./fhi-icon-grip-vertical.js","types":"./fhi-icon-grip-vertical.d.ts"},"./fhi-icon-history":{"default":"./fhi-icon-history.js","types":"./fhi-icon-history.d.ts"},"./fhi-icon-info":{"default":"./fhi-icon-info.js","types":"./fhi-icon-info.d.ts"},"./fhi-icon-link-2-off":{"default":"./fhi-icon-link-2-off.js","types":"./fhi-icon-link-2-off.d.ts"},"./fhi-icon-link-2":{"default":"./fhi-icon-link-2.js","types":"./fhi-icon-link-2.d.ts"},"./fhi-icon-link":{"default":"./fhi-icon-link.js","types":"./fhi-icon-link.d.ts"},"./fhi-icon-lock-open":{"default":"./fhi-icon-lock-open.js","types":"./fhi-icon-lock-open.d.ts"},"./fhi-icon-lock":{"default":"./fhi-icon-lock.js","types":"./fhi-icon-lock.d.ts"},"./fhi-icon-log-in":{"default":"./fhi-icon-log-in.js","types":"./fhi-icon-log-in.d.ts"},"./fhi-icon-log-out":{"default":"./fhi-icon-log-out.js","types":"./fhi-icon-log-out.d.ts"},"./fhi-icon-mail":{"default":"./fhi-icon-mail.js","types":"./fhi-icon-mail.d.ts"},"./fhi-icon-map-pin":{"default":"./fhi-icon-map-pin.js","types":"./fhi-icon-map-pin.d.ts"},"./fhi-icon-menu":{"default":"./fhi-icon-menu.js","types":"./fhi-icon-menu.d.ts"},"./fhi-icon-message":{"default":"./fhi-icon-message.js","types":"./fhi-icon-message.d.ts"},"./fhi-icon-minus":{"default":"./fhi-icon-minus.js","types":"./fhi-icon-minus.d.ts"},"./fhi-icon-octagon-alert":{"default":"./fhi-icon-octagon-alert.js","types":"./fhi-icon-octagon-alert.d.ts"},"./fhi-icon-paperclip":{"default":"./fhi-icon-paperclip.js","types":"./fhi-icon-paperclip.d.ts"},"./fhi-icon-pencil":{"default":"./fhi-icon-pencil.js","types":"./fhi-icon-pencil.d.ts"},"./fhi-icon-phone":{"default":"./fhi-icon-phone.js","types":"./fhi-icon-phone.d.ts"},"./fhi-icon-pin-off":{"default":"./fhi-icon-pin-off.js","types":"./fhi-icon-pin-off.d.ts"},"./fhi-icon-pin":{"default":"./fhi-icon-pin.js","types":"./fhi-icon-pin.d.ts"},"./fhi-icon-plus":{"default":"./fhi-icon-plus.js","types":"./fhi-icon-plus.d.ts"},"./fhi-icon-printer":{"default":"./fhi-icon-printer.js","types":"./fhi-icon-printer.d.ts"},"./fhi-icon-question":{"default":"./fhi-icon-question.js","types":"./fhi-icon-question.d.ts"},"./fhi-icon-refresh":{"default":"./fhi-icon-refresh.js","types":"./fhi-icon-refresh.d.ts"},"./fhi-icon-rotate-left":{"default":"./fhi-icon-rotate-left.js","types":"./fhi-icon-rotate-left.d.ts"},"./fhi-icon-rotate-right":{"default":"./fhi-icon-rotate-right.js","types":"./fhi-icon-rotate-right.d.ts"},"./fhi-icon-search":{"default":"./fhi-icon-search.js","types":"./fhi-icon-search.d.ts"},"./fhi-icon-send":{"default":"./fhi-icon-send.js","types":"./fhi-icon-send.d.ts"},"./fhi-icon-share":{"default":"./fhi-icon-share.js","types":"./fhi-icon-share.d.ts"},"./fhi-icon-sheet":{"default":"./fhi-icon-sheet.js","types":"./fhi-icon-sheet.d.ts"},"./fhi-icon-square-check-big":{"default":"./fhi-icon-square-check-big.js","types":"./fhi-icon-square-check-big.d.ts"},"./fhi-icon-square-check":{"default":"./fhi-icon-square-check.js","types":"./fhi-icon-square-check.d.ts"},"./fhi-icon-square-pen":{"default":"./fhi-icon-square-pen.js","types":"./fhi-icon-square-pen.d.ts"},"./fhi-icon-square-x":{"default":"./fhi-icon-square-x.js","types":"./fhi-icon-square-x.d.ts"},"./fhi-icon-square":{"default":"./fhi-icon-square.js","types":"./fhi-icon-square.d.ts"},"./fhi-icon-trash":{"default":"./fhi-icon-trash.js","types":"./fhi-icon-trash.d.ts"},"./fhi-icon-triangle-alert":{"default":"./fhi-icon-triangle-alert.js","types":"./fhi-icon-triangle-alert.d.ts"},"./fhi-icon-upload":{"default":"./fhi-icon-upload.js","types":"./fhi-icon-upload.d.ts"},"./fhi-icon-user":{"default":"./fhi-icon-user.js","types":"./fhi-icon-user.d.ts"},"./fhi-icon-x":{"default":"./fhi-icon-x.js","types":"./fhi-icon-x.d.ts"},"./fhi-data-table":{"default":"./fhi-data-table.js","types":"./fhi-data-table.d.ts"},"./fhi-data-table-cell":{"default":"./fhi-data-table-cell.js","types":"./fhi-data-table-cell.d.ts"},"./fhi-data-table-row":{"default":"./fhi-data-table-row.js","types":"./fhi-data-table-row.d.ts"},"./fhi-body":{"default":"./fhi-body.js","types":"./fhi-body.d.ts"},"./fhi-display":{"default":"./fhi-display.js","types":"./fhi-display.d.ts"},"./fhi-headline":{"default":"./fhi-headline.js","types":"./fhi-headline.d.ts"},"./fhi-label":{"default":"./fhi-label.js","types":"./fhi-label.d.ts"},"./fhi-title":{"default":"./fhi-title.js","types":"./fhi-title.d.ts"},".":{"default":"./index.js"},"./theme/default.css":{"style":"./theme/default.css"},"./custom-elements.json":{"default":"./custom-elements.json"}}}
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
3
3
  "name": "@folkehelseinstituttet/designsystem",
4
- "version": "0.38.1",
4
+ "version": "0.38.2",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {