@folkehelseinstituttet/designsystem 0.40.4 → 0.40.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fhi-radio.js +37 -96
- package/fhi-radio.js.map +1 -1
- package/package.json +1 -1
- package/web-types.json +1 -1
package/fhi-radio.js
CHANGED
|
@@ -97,69 +97,7 @@ var c = "fhi-radio", l = class extends i {
|
|
|
97
97
|
static {
|
|
98
98
|
this.styles = t`
|
|
99
99
|
:host {
|
|
100
|
-
--
|
|
101
|
-
var(--fhi-motion-duration-quick);
|
|
102
|
-
|
|
103
|
-
--color-radio-label: var(--fhi-color-neutral-text-default);
|
|
104
|
-
--color-radio-border: var(--fhi-color-neutral-border-default);
|
|
105
|
-
--color-radio-background: var(--fhi-color-neutral-background-default);
|
|
106
|
-
|
|
107
|
-
--color-radio-border-hover: var(--fhi-color-accent-border-strong);
|
|
108
|
-
--color-radio-background-hover: var(--fhi-color-accent-background-subtle);
|
|
109
|
-
|
|
110
|
-
--color-radio-background-active: var(--fhi-color-accent-surface-default);
|
|
111
|
-
|
|
112
|
-
--color-radio-outline: var(--fhi-color-accent-surface-hover);
|
|
113
|
-
|
|
114
|
-
--typography-radio-label-font-family: var(--fhi-font-family-default);
|
|
115
|
-
-webkit-font-smoothing: antialiased;
|
|
116
|
-
--typography-radio-label-font-size: var(
|
|
117
|
-
--fhi-typography-body-medium-font-size
|
|
118
|
-
);
|
|
119
|
-
|
|
120
|
-
--typography-radio-label-font-weight: var(
|
|
121
|
-
--fhi-typography-body-medium-font-weight
|
|
122
|
-
);
|
|
123
|
-
|
|
124
|
-
--typography-radio-label-line-height: var(
|
|
125
|
-
--fhi-typography-body-medium-line-height
|
|
126
|
-
);
|
|
127
|
-
--typography-radio-label-letter-spacing: var(
|
|
128
|
-
--fhi-typography-body-medium-letter-spacing
|
|
129
|
-
);
|
|
130
|
-
|
|
131
|
-
--dimension-radio-label-gap: var(--fhi-spacing-050);
|
|
132
|
-
--dimension-radio-width: var(--fhi-spacing-250);
|
|
133
|
-
--dimension-radio-height: var(--fhi-spacing-250);
|
|
134
|
-
--dimension-radio-margin: 0.125rem;
|
|
135
|
-
--dimension-radio-border-width: var(--fhi-dimension-border-width);
|
|
136
|
-
|
|
137
|
-
--dimension-radio-dot-size: 1.125rem;
|
|
138
|
-
|
|
139
|
-
/* Checked state */
|
|
140
|
-
--dimension-radio-border-width-checked: var(
|
|
141
|
-
--fhi-dimension-border-width-active
|
|
142
|
-
);
|
|
143
|
-
|
|
144
|
-
/* Error state */
|
|
145
|
-
--color-radio-border-error: var(--fhi-color-danger-border-default);
|
|
146
|
-
--color-radio-background-error: var(
|
|
147
|
-
--fhi-color-danger-background-default
|
|
148
|
-
);
|
|
149
|
-
|
|
150
|
-
--color-radio-border-error-hover: var(--fhi-color-danger-border-strong);
|
|
151
|
-
--color-radio-background-error-hover: var(
|
|
152
|
-
--fhi-color-danger-background-subtle
|
|
153
|
-
);
|
|
154
|
-
|
|
155
|
-
--color-radio-background-error-active: var(
|
|
156
|
-
--fhi-color-danger-surface-default
|
|
157
|
-
);
|
|
158
|
-
|
|
159
|
-
--color-radio-outline-error: var(--fhi-color-danger-surface-hover);
|
|
160
|
-
|
|
161
|
-
/* Disabled state */
|
|
162
|
-
--opacity-disabled: var(--fhi-opacity-disabled);
|
|
100
|
+
--fhi-radio-color: currentcolor;
|
|
163
101
|
}
|
|
164
102
|
|
|
165
103
|
:host {
|
|
@@ -170,13 +108,14 @@ var c = "fhi-radio", l = class extends i {
|
|
|
170
108
|
label {
|
|
171
109
|
display: flex;
|
|
172
110
|
position: relative;
|
|
173
|
-
gap: var(--
|
|
174
|
-
color: var(--
|
|
175
|
-
font-family: var(--
|
|
176
|
-
font-
|
|
177
|
-
font-
|
|
178
|
-
|
|
179
|
-
|
|
111
|
+
gap: var(--fhi-spacing-050);
|
|
112
|
+
color: var(--fhi-radio-color);
|
|
113
|
+
font-family: var(--fhi-font-family-default);
|
|
114
|
+
-webkit-font-smoothing: antialiased;
|
|
115
|
+
font-size: var(--fhi-typography-body-medium-font-size);
|
|
116
|
+
font-weight: var(--fhi-typography-body-medium-font-weight);
|
|
117
|
+
line-height: var(--fhi-typography-body-medium-line-height);
|
|
118
|
+
letter-spacing: var(--fhi-typography-body-medium-letter-spacing);
|
|
180
119
|
}
|
|
181
120
|
|
|
182
121
|
.radio-container {
|
|
@@ -186,33 +125,35 @@ var c = "fhi-radio", l = class extends i {
|
|
|
186
125
|
|
|
187
126
|
input {
|
|
188
127
|
appearance: none;
|
|
189
|
-
margin:
|
|
190
|
-
width: var(--
|
|
191
|
-
height: var(--
|
|
192
|
-
background-color: var(--color-
|
|
193
|
-
border: var(--dimension-
|
|
194
|
-
var(--color-
|
|
128
|
+
margin: 0.125rem;
|
|
129
|
+
width: var(--fhi-spacing-250);
|
|
130
|
+
height: var(--fhi-spacing-250);
|
|
131
|
+
background-color: var(--fhi-color-neutral-background-default);
|
|
132
|
+
border: var(--fhi-dimension-border-width) solid
|
|
133
|
+
var(--fhi-color-neutral-border-default);
|
|
195
134
|
border-radius: var(--fhi-border-radius-full);
|
|
196
|
-
transition: all var(--motion-
|
|
135
|
+
transition: all var(--fhi-motion-ease-default)
|
|
136
|
+
var(--fhi-motion-duration-quick);
|
|
197
137
|
}
|
|
198
138
|
|
|
199
139
|
.radio-dot {
|
|
200
140
|
visibility: hidden;
|
|
201
141
|
opacity: 0;
|
|
202
|
-
transition: opacity var(--motion-
|
|
142
|
+
transition: opacity var(--fhi-motion-ease-default)
|
|
143
|
+
var(--fhi-motion-duration-quick);
|
|
203
144
|
position: absolute;
|
|
204
145
|
top: 50%;
|
|
205
146
|
left: 50%;
|
|
206
147
|
transform: translate(-50%, -50%);
|
|
207
|
-
height:
|
|
208
|
-
width:
|
|
148
|
+
height: 1.125rem;
|
|
149
|
+
width: 1.125rem;
|
|
209
150
|
}
|
|
210
151
|
|
|
211
152
|
input:checked {
|
|
212
|
-
border-width: var(--dimension-
|
|
153
|
+
border-width: var(--fhi-dimension-border-width-active);
|
|
213
154
|
~ .radio-dot {
|
|
214
155
|
circle {
|
|
215
|
-
fill: var(--color-
|
|
156
|
+
fill: var(--fhi-color-neutral-border-default);
|
|
216
157
|
}
|
|
217
158
|
visibility: visible;
|
|
218
159
|
opacity: 1;
|
|
@@ -221,7 +162,7 @@ var c = "fhi-radio", l = class extends i {
|
|
|
221
162
|
}
|
|
222
163
|
|
|
223
164
|
:host([disabled]) {
|
|
224
|
-
opacity: var(--opacity-disabled);
|
|
165
|
+
opacity: var(--fhi-opacity-disabled);
|
|
225
166
|
label,
|
|
226
167
|
input {
|
|
227
168
|
cursor: not-allowed;
|
|
@@ -230,28 +171,28 @@ var c = "fhi-radio", l = class extends i {
|
|
|
230
171
|
|
|
231
172
|
:host(:not(:disabled)) {
|
|
232
173
|
input:hover:not(:checked) {
|
|
233
|
-
border-color: var(--color-
|
|
234
|
-
background-color: var(--color-
|
|
174
|
+
border-color: var(--fhi-color-accent-border-strong);
|
|
175
|
+
background-color: var(--fhi-color-accent-background-subtle);
|
|
235
176
|
}
|
|
236
177
|
|
|
237
178
|
input:active:not(:checked) {
|
|
238
|
-
border-color: var(--color-
|
|
239
|
-
background-color: var(--color-
|
|
179
|
+
border-color: var(--fhi-color-accent-border-strong);
|
|
180
|
+
background-color: var(--fhi-color-accent-surface-default);
|
|
240
181
|
outline: var(--fhi-dimension-border-width-focus) solid
|
|
241
|
-
var(--color-
|
|
182
|
+
var(--fhi-color-accent-surface-hover);
|
|
242
183
|
}
|
|
243
184
|
}
|
|
244
185
|
|
|
245
186
|
:host([status='error']) {
|
|
246
187
|
input {
|
|
247
|
-
border-color: var(--color-
|
|
248
|
-
background-color: var(--color-
|
|
188
|
+
border-color: var(--fhi-color-danger-border-default);
|
|
189
|
+
background-color: var(--fhi-color-danger-background-default);
|
|
249
190
|
}
|
|
250
191
|
|
|
251
192
|
input:checked {
|
|
252
193
|
~ .radio-dot {
|
|
253
194
|
circle {
|
|
254
|
-
fill: var(--color-
|
|
195
|
+
fill: var(--fhi-color-danger-border-default);
|
|
255
196
|
}
|
|
256
197
|
}
|
|
257
198
|
}
|
|
@@ -259,14 +200,14 @@ var c = "fhi-radio", l = class extends i {
|
|
|
259
200
|
|
|
260
201
|
:host([status='error']:not(:disabled)) {
|
|
261
202
|
input:hover:not(:checked) {
|
|
262
|
-
border-color: var(--color-
|
|
263
|
-
background-color: var(--color-
|
|
203
|
+
border-color: var(--fhi-color-danger-border-strong);
|
|
204
|
+
background-color: var(--fhi-color-danger-background-subtle);
|
|
264
205
|
}
|
|
265
206
|
|
|
266
207
|
input:active:not(:checked) {
|
|
267
|
-
border-color: var(--color-
|
|
268
|
-
background-color: var(--color-
|
|
269
|
-
outline-color: var(--color-
|
|
208
|
+
border-color: var(--fhi-color-danger-border-strong);
|
|
209
|
+
background-color: var(--fhi-color-danger-surface-default);
|
|
210
|
+
outline-color: var(--fhi-color-danger-surface-hover);
|
|
270
211
|
}
|
|
271
212
|
}
|
|
272
213
|
`;
|
package/fhi-radio.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fhi-radio.js","names":[],"sources":["../../src/components/fhi-radio/fhi-radio.component.ts"],"sourcesContent":["import { html, css, LitElement } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nexport const FhiRadioSelector = 'fhi-radio';\n\n/**\n * ## FHI Radio\n *\n * {@link https://designsystem.fhi.no/?path=/docs/komponenter-radio--docs}\n *\n * The `<fhi-radio>` component represents a single radio button.\n * It should be used within a group of options, allowing users to select one option from a set.\n *\n * @tag fhi-radio\n * @element fhi-radio\n */\n@customElement(FhiRadioSelector)\nexport class FhiRadio extends LitElement {\n static readonly formAssociated = true;\n\n /**\n * The text label assigned to and displayed next to the radio.\n * You should always provide a label.\n * @type {string}\n */\n @property({ type: String }) label?: string = undefined;\n\n /**\n * The name of the radio. This is submitted with the form data as a `key` when the checkbox is checked.\n * All `<fhi-radio>` components with the same name belong to the same group.\n * @reflect\n * @type {string}\n */\n @property({ type: String, reflect: true }) name?: string = undefined;\n\n /**\n * Sets the visual status of the radio. There is currently only one status available: `error`.\n * The `error` status is used to indicate that there is an issue with the radio, such as a required radio not being checked.\n * @reflect\n * @type {'error' | undefined}\n */\n @property({ type: String, reflect: true }) status?: 'error' = undefined;\n\n /**\n * Disables the radio. This changes its appearance and makes it non-interactive.\n * @reflect\n * @type {boolean}\n */\n @property({ type: Boolean, reflect: true }) disabled? = false;\n\n /**\n * Whether the radio button is checked or not.\n * @type {boolean}\n */\n @property({ type: Boolean }) checked? = false;\n\n /**\n * The value of the radio. This is submitted with the form data as a `value` when the radio is checked.\n * @type {string}\n */\n @property({ type: String }) value: string = 'on';\n\n @query('#input-element')\n private _input!: HTMLInputElement;\n\n private _groupRoot: Document | HTMLFormElement;\n private _internals: ElementInternals;\n\n /**\n * Indicates if the radio button is part of a form.\n * @internal\n */\n public isFormElement = false;\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n this._groupRoot = document;\n }\n\n public connectedCallback(): void {\n super.connectedCallback();\n\n this.addEventListener('focus', this._setFocusOnInput);\n\n this.isFormElement = !!this._internals.form;\n\n if (this.isFormElement) {\n this._updateFormValue();\n this._groupRoot = this._internals.form!;\n }\n\n // If the radio has a name then it is part of a group and needs keyboard navigation\n if (this.name) {\n this.addEventListener('keydown', this._handleKeyDown);\n this._SetTabbableRadios();\n }\n }\n\n public disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('keydown', this._handleKeyDown);\n this.removeEventListener('focus', this._setFocusOnInput);\n }\n\n private _setFocusOnInput() {\n this._input.focus();\n }\n\n private _getRadioGroup() {\n return Array.from(\n this._groupRoot.querySelectorAll<FhiRadio>(\n `${FhiRadioSelector}[name=\"${this.name}\"]`,\n ),\n );\n }\n\n private _SetTabbableRadios() {\n const radios = this._getRadioGroup();\n\n radios.forEach(radio => {\n // Only the checked radio should be tabbable\n radio.tabIndex = radio.checked ? 0 : -1;\n });\n\n // If none of the radios are checked, make the first one tabbable\n if (!radios.some(radio => radio.checked) && radios.length > 0) {\n radios[0].tabIndex = 0;\n }\n }\n\n public updated(changedProperties: Map<string, unknown>) {\n super.updated(changedProperties);\n\n // make sure the radio input can be programmatically toggeled. e.g by a form reset\n if (changedProperties.has('checked')) {\n this._input.checked = !!this.checked;\n this._updateFormValue();\n\n if (this.checked) {\n this.uncheckGroupMembers();\n }\n }\n\n // update the form value when the value or name input changes and the radio is already checked\n if (changedProperties.has('value') || changedProperties.has('name')) {\n if (this._input.checked) {\n this._updateFormValue();\n }\n }\n }\n\n public formResetCallback(): void {\n const radiosCheckedByDefault = this._getRadioGroup().filter(\n radio => typeof radio.getAttribute('checked') === 'string',\n );\n\n if (radiosCheckedByDefault.pop() === this) {\n this.checked = true;\n }\n\n this._updateFormValue();\n }\n\n private uncheckGroupMembers(): void {\n const radios = this._getRadioGroup();\n\n radios.forEach(radio => {\n if (radio === this) {\n return;\n }\n\n if (radio.isFormElement && this._groupRoot === document) {\n return;\n }\n\n radio.checked = false;\n });\n }\n\n private _updateFormValue(): void {\n if (!this.isFormElement) {\n return;\n }\n\n this._internals.setFormValue(this.checked ? this.value : null);\n }\n\n private _handleChange(event: Event): void {\n this.checked = (event.target as HTMLInputElement).checked;\n\n this.uncheckGroupMembers();\n\n this._updateFormValue();\n\n event.stopPropagation();\n this._dispatchChangeEvent();\n }\n private _handleInput(event: Event): void {\n event.stopPropagation();\n this._dispatchInputEvent();\n }\n\n private _dispatchChangeEvent(): void {\n /**\n * @type {Event} - Standard DOM event with the type `change`.\n * This event is dispatched when the radio is checked or unchecked.\n */\n this.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n private _dispatchInputEvent(): void {\n /**\n * @type {Event} - Standard DOM event with the type `input`.\n * This event is dispatched when the radio is checked or unchecked.\n */\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n }\n\n private _handleKeyDown(event: KeyboardEvent): void {\n const arrows = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];\n\n if (!arrows.includes(event.key)) {\n return;\n }\n\n event.preventDefault();\n\n const radios = this._getRadioGroup();\n\n if (radios.length < 2) {\n return;\n }\n\n const currentIndex = radios.indexOf(this);\n\n const nextIndex = currentIndex;\n let nextRadio: FhiRadio;\n\n if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n nextRadio = radios[nextIndex === 0 ? radios.length - 1 : nextIndex - 1];\n } else {\n nextRadio = radios[nextIndex === radios.length - 1 ? 0 : nextIndex + 1];\n }\n\n nextRadio.focus();\n this.checked = false;\n nextRadio.checked = true;\n this._SetTabbableRadios();\n }\n\n render() {\n return html`\n <label>\n <div class=\"radio-container\">\n <input\n type=\"radio\"\n id=\"input-element\"\n name=\"${ifDefined(this.name)}\"\n value=\"${this.value}\"\n ?checked=${this.checked}\n ?disabled=${this.disabled}\n @change=${this._handleChange}\n @input=${this._handleInput}\n />\n <svg\n class=\"radio-dot\"\n viewBox=\"0 0 18 18\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle r=\"6\" cx=\"9\" cy=\"9\" />\n </svg>\n </div>\n ${this.label}\n </label>\n `;\n }\n\n static styles = css`\n :host {\n --motion-radio-transition: var(--fhi-motion-ease-default)\n var(--fhi-motion-duration-quick);\n\n --color-radio-label: var(--fhi-color-neutral-text-default);\n --color-radio-border: var(--fhi-color-neutral-border-default);\n --color-radio-background: var(--fhi-color-neutral-background-default);\n\n --color-radio-border-hover: var(--fhi-color-accent-border-strong);\n --color-radio-background-hover: var(--fhi-color-accent-background-subtle);\n\n --color-radio-background-active: var(--fhi-color-accent-surface-default);\n\n --color-radio-outline: var(--fhi-color-accent-surface-hover);\n\n --typography-radio-label-font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\n --typography-radio-label-font-size: var(\n --fhi-typography-body-medium-font-size\n );\n\n --typography-radio-label-font-weight: var(\n --fhi-typography-body-medium-font-weight\n );\n\n --typography-radio-label-line-height: var(\n --fhi-typography-body-medium-line-height\n );\n --typography-radio-label-letter-spacing: var(\n --fhi-typography-body-medium-letter-spacing\n );\n\n --dimension-radio-label-gap: var(--fhi-spacing-050);\n --dimension-radio-width: var(--fhi-spacing-250);\n --dimension-radio-height: var(--fhi-spacing-250);\n --dimension-radio-margin: 0.125rem;\n --dimension-radio-border-width: var(--fhi-dimension-border-width);\n\n --dimension-radio-dot-size: 1.125rem;\n\n /* Checked state */\n --dimension-radio-border-width-checked: var(\n --fhi-dimension-border-width-active\n );\n\n /* Error state */\n --color-radio-border-error: var(--fhi-color-danger-border-default);\n --color-radio-background-error: var(\n --fhi-color-danger-background-default\n );\n\n --color-radio-border-error-hover: var(--fhi-color-danger-border-strong);\n --color-radio-background-error-hover: var(\n --fhi-color-danger-background-subtle\n );\n\n --color-radio-background-error-active: var(\n --fhi-color-danger-surface-default\n );\n\n --color-radio-outline-error: var(--fhi-color-danger-surface-hover);\n\n /* Disabled state */\n --opacity-disabled: var(--fhi-opacity-disabled);\n }\n\n :host {\n display: flex;\n align-items: center;\n width: max-content;\n\n label {\n display: flex;\n position: relative;\n gap: var(--dimension-radio-label-gap);\n color: var(--color-radio-label);\n font-family: var(--typography-radio-label-font-family);\n font-size: var(--typography-radio-label-font-size);\n font-weight: var(--typography-radio-label-font-weight);\n line-height: var(--typography-radio-label-line-height);\n letter-spacing: var(--typography-radio-label-letter-spacing);\n }\n\n .radio-container {\n display: flex;\n position: relative;\n }\n\n input {\n appearance: none;\n margin: var(--dimension-radio-margin);\n width: var(--dimension-radio-width);\n height: var(--dimension-radio-height);\n background-color: var(--color-radio-background);\n border: var(--dimension-radio-border-width) solid\n var(--color-radio-border);\n border-radius: var(--fhi-border-radius-full);\n transition: all var(--motion-radio-transition);\n }\n\n .radio-dot {\n visibility: hidden;\n opacity: 0;\n transition: opacity var(--motion-radio-transition);\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n height: var(--dimension-radio-dot-size);\n width: var(--dimension-radio-dot-size);\n }\n\n input:checked {\n border-width: var(--dimension-radio-border-width-checked);\n ~ .radio-dot {\n circle {\n fill: var(--color-radio-border);\n }\n visibility: visible;\n opacity: 1;\n }\n }\n }\n\n :host([disabled]) {\n opacity: var(--opacity-disabled);\n label,\n input {\n cursor: not-allowed;\n }\n }\n\n :host(:not(:disabled)) {\n input:hover:not(:checked) {\n border-color: var(--color-radio-border-hover);\n background-color: var(--color-radio-background-hover);\n }\n\n input:active:not(:checked) {\n border-color: var(--color-radio-border-hover);\n background-color: var(--color-radio-background-active);\n outline: var(--fhi-dimension-border-width-focus) solid\n var(--color-radio-outline);\n }\n }\n\n :host([status='error']) {\n input {\n border-color: var(--color-radio-border-error);\n background-color: var(--color-radio-background-error);\n }\n\n input:checked {\n ~ .radio-dot {\n circle {\n fill: var(--color-radio-border-error);\n }\n }\n }\n }\n\n :host([status='error']:not(:disabled)) {\n input:hover:not(:checked) {\n border-color: var(--color-radio-border-error-hover);\n background-color: var(--color-radio-background-error-hover);\n }\n\n input:active:not(:checked) {\n border-color: var(--color-radio-border-error-hover);\n background-color: var(--color-radio-background-error-active);\n outline-color: var(--color-radio-outline-error);\n }\n }\n `;\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"fhi-radio.js","names":[],"sources":["../../src/components/fhi-radio/fhi-radio.component.ts"],"sourcesContent":["import { html, css, LitElement } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nexport const FhiRadioSelector = 'fhi-radio';\n\n/**\n * ## FHI Radio\n *\n * {@link https://designsystem.fhi.no/?path=/docs/komponenter-radio--docs}\n *\n * The `<fhi-radio>` component represents a single radio button.\n * It should be used within a group of options, allowing users to select one option from a set.\n *\n * @tag fhi-radio\n * @element fhi-radio\n */\n@customElement(FhiRadioSelector)\nexport class FhiRadio extends LitElement {\n static readonly formAssociated = true;\n\n /**\n * The text label assigned to and displayed next to the radio.\n * You should always provide a label.\n * @type {string}\n */\n @property({ type: String }) label?: string = undefined;\n\n /**\n * The name of the radio. This is submitted with the form data as a `key` when the checkbox is checked.\n * All `<fhi-radio>` components with the same name belong to the same group.\n * @reflect\n * @type {string}\n */\n @property({ type: String, reflect: true }) name?: string = undefined;\n\n /**\n * Sets the visual status of the radio. There is currently only one status available: `error`.\n * The `error` status is used to indicate that there is an issue with the radio, such as a required radio not being checked.\n * @reflect\n * @type {'error' | undefined}\n */\n @property({ type: String, reflect: true }) status?: 'error' = undefined;\n\n /**\n * Disables the radio. This changes its appearance and makes it non-interactive.\n * @reflect\n * @type {boolean}\n */\n @property({ type: Boolean, reflect: true }) disabled? = false;\n\n /**\n * Whether the radio button is checked or not.\n * @type {boolean}\n */\n @property({ type: Boolean }) checked? = false;\n\n /**\n * The value of the radio. This is submitted with the form data as a `value` when the radio is checked.\n * @type {string}\n */\n @property({ type: String }) value: string = 'on';\n\n @query('#input-element')\n private _input!: HTMLInputElement;\n\n private _groupRoot: Document | HTMLFormElement;\n private _internals: ElementInternals;\n\n /**\n * Indicates if the radio button is part of a form.\n * @internal\n */\n public isFormElement = false;\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n this._groupRoot = document;\n }\n\n public connectedCallback(): void {\n super.connectedCallback();\n\n this.addEventListener('focus', this._setFocusOnInput);\n\n this.isFormElement = !!this._internals.form;\n\n if (this.isFormElement) {\n this._updateFormValue();\n this._groupRoot = this._internals.form!;\n }\n\n // If the radio has a name then it is part of a group and needs keyboard navigation\n if (this.name) {\n this.addEventListener('keydown', this._handleKeyDown);\n this._SetTabbableRadios();\n }\n }\n\n public disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('keydown', this._handleKeyDown);\n this.removeEventListener('focus', this._setFocusOnInput);\n }\n\n private _setFocusOnInput() {\n this._input.focus();\n }\n\n private _getRadioGroup() {\n return Array.from(\n this._groupRoot.querySelectorAll<FhiRadio>(\n `${FhiRadioSelector}[name=\"${this.name}\"]`,\n ),\n );\n }\n\n private _SetTabbableRadios() {\n const radios = this._getRadioGroup();\n\n radios.forEach(radio => {\n // Only the checked radio should be tabbable\n radio.tabIndex = radio.checked ? 0 : -1;\n });\n\n // If none of the radios are checked, make the first one tabbable\n if (!radios.some(radio => radio.checked) && radios.length > 0) {\n radios[0].tabIndex = 0;\n }\n }\n\n public updated(changedProperties: Map<string, unknown>) {\n super.updated(changedProperties);\n\n // make sure the radio input can be programmatically toggeled. e.g by a form reset\n if (changedProperties.has('checked')) {\n this._input.checked = !!this.checked;\n this._updateFormValue();\n\n if (this.checked) {\n this.uncheckGroupMembers();\n }\n }\n\n // update the form value when the value or name input changes and the radio is already checked\n if (changedProperties.has('value') || changedProperties.has('name')) {\n if (this._input.checked) {\n this._updateFormValue();\n }\n }\n }\n\n public formResetCallback(): void {\n const radiosCheckedByDefault = this._getRadioGroup().filter(\n radio => typeof radio.getAttribute('checked') === 'string',\n );\n\n if (radiosCheckedByDefault.pop() === this) {\n this.checked = true;\n }\n\n this._updateFormValue();\n }\n\n private uncheckGroupMembers(): void {\n const radios = this._getRadioGroup();\n\n radios.forEach(radio => {\n if (radio === this) {\n return;\n }\n\n if (radio.isFormElement && this._groupRoot === document) {\n return;\n }\n\n radio.checked = false;\n });\n }\n\n private _updateFormValue(): void {\n if (!this.isFormElement) {\n return;\n }\n\n this._internals.setFormValue(this.checked ? this.value : null);\n }\n\n private _handleChange(event: Event): void {\n this.checked = (event.target as HTMLInputElement).checked;\n\n this.uncheckGroupMembers();\n\n this._updateFormValue();\n\n event.stopPropagation();\n this._dispatchChangeEvent();\n }\n private _handleInput(event: Event): void {\n event.stopPropagation();\n this._dispatchInputEvent();\n }\n\n private _dispatchChangeEvent(): void {\n /**\n * @type {Event} - Standard DOM event with the type `change`.\n * This event is dispatched when the radio is checked or unchecked.\n */\n this.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n private _dispatchInputEvent(): void {\n /**\n * @type {Event} - Standard DOM event with the type `input`.\n * This event is dispatched when the radio is checked or unchecked.\n */\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }));\n }\n\n private _handleKeyDown(event: KeyboardEvent): void {\n const arrows = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];\n\n if (!arrows.includes(event.key)) {\n return;\n }\n\n event.preventDefault();\n\n const radios = this._getRadioGroup();\n\n if (radios.length < 2) {\n return;\n }\n\n const currentIndex = radios.indexOf(this);\n\n const nextIndex = currentIndex;\n let nextRadio: FhiRadio;\n\n if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n nextRadio = radios[nextIndex === 0 ? radios.length - 1 : nextIndex - 1];\n } else {\n nextRadio = radios[nextIndex === radios.length - 1 ? 0 : nextIndex + 1];\n }\n\n nextRadio.focus();\n this.checked = false;\n nextRadio.checked = true;\n this._SetTabbableRadios();\n }\n\n render() {\n return html`\n <label>\n <div class=\"radio-container\">\n <input\n type=\"radio\"\n id=\"input-element\"\n name=\"${ifDefined(this.name)}\"\n value=\"${this.value}\"\n ?checked=${this.checked}\n ?disabled=${this.disabled}\n @change=${this._handleChange}\n @input=${this._handleInput}\n />\n <svg\n class=\"radio-dot\"\n viewBox=\"0 0 18 18\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle r=\"6\" cx=\"9\" cy=\"9\" />\n </svg>\n </div>\n ${this.label}\n </label>\n `;\n }\n\n static styles = css`\n :host {\n --fhi-radio-color: currentcolor;\n }\n\n :host {\n display: flex;\n align-items: center;\n width: max-content;\n\n label {\n display: flex;\n position: relative;\n gap: var(--fhi-spacing-050);\n color: var(--fhi-radio-color);\n font-family: var(--fhi-font-family-default);\n -webkit-font-smoothing: antialiased;\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 .radio-container {\n display: flex;\n position: relative;\n }\n\n input {\n appearance: none;\n margin: 0.125rem;\n width: var(--fhi-spacing-250);\n height: var(--fhi-spacing-250);\n background-color: var(--fhi-color-neutral-background-default);\n border: var(--fhi-dimension-border-width) solid\n var(--fhi-color-neutral-border-default);\n border-radius: var(--fhi-border-radius-full);\n transition: all var(--fhi-motion-ease-default)\n var(--fhi-motion-duration-quick);\n }\n\n .radio-dot {\n visibility: hidden;\n opacity: 0;\n transition: opacity var(--fhi-motion-ease-default)\n var(--fhi-motion-duration-quick);\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n height: 1.125rem;\n width: 1.125rem;\n }\n\n input:checked {\n border-width: var(--fhi-dimension-border-width-active);\n ~ .radio-dot {\n circle {\n fill: var(--fhi-color-neutral-border-default);\n }\n visibility: visible;\n opacity: 1;\n }\n }\n }\n\n :host([disabled]) {\n opacity: var(--fhi-opacity-disabled);\n label,\n input {\n cursor: not-allowed;\n }\n }\n\n :host(:not(:disabled)) {\n input:hover:not(:checked) {\n border-color: var(--fhi-color-accent-border-strong);\n background-color: var(--fhi-color-accent-background-subtle);\n }\n\n input:active:not(:checked) {\n border-color: var(--fhi-color-accent-border-strong);\n background-color: var(--fhi-color-accent-surface-default);\n outline: var(--fhi-dimension-border-width-focus) solid\n var(--fhi-color-accent-surface-hover);\n }\n }\n\n :host([status='error']) {\n input {\n border-color: var(--fhi-color-danger-border-default);\n background-color: var(--fhi-color-danger-background-default);\n }\n\n input:checked {\n ~ .radio-dot {\n circle {\n fill: var(--fhi-color-danger-border-default);\n }\n }\n }\n }\n\n :host([status='error']:not(:disabled)) {\n input:hover:not(:checked) {\n border-color: var(--fhi-color-danger-border-strong);\n background-color: var(--fhi-color-danger-background-subtle);\n }\n\n input:active:not(:checked) {\n border-color: var(--fhi-color-danger-border-strong);\n background-color: var(--fhi-color-danger-surface-default);\n outline-color: var(--fhi-color-danger-surface-hover);\n }\n }\n `;\n}\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"title":"FHI Designsystem","author":"FHI Designsystem team","name":"@folkehelseinstituttet/designsystem","version":"0.40.4","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.11.0","@esm-bundle/chai":"4.3.4-fix.0","@open-wc/testing":"~4.0.0","@playwright/test":"^1.61.0","@release-it/conventional-changelog":"~11.0.1","@storybook/addon-docs":"^10.4.6","@storybook/web-components-vite":"^10.4.6","@types/mocha":"~10.0.10","@types/node":"~26.0.0","@types/react":"^19.2.17","@wc-toolkit/cem-sorter":"^1.0.1","@wc-toolkit/type-parser":"^1.2.1","@web/dev-server":"~0.4.6","@web/dev-server-esbuild":"~1.0.5","@web/test-runner":"~0.20.2","@web/test-runner-playwright":"~0.11.1","cross-env":"10.1.0","custom-element-jet-brains-integration":"^1.7.0","lit":"~3.3.3","mocha":"~11.7.6","playwright":"^1.61.0","release-it":"~20.2.0","rimraf":"^6.1.3","storybook":"^10.4.6","storybook-design-token":"^5.0.0","svgo":"^4.0.1","vite":"~8.0.16","vite-plugin-static-copy":"~4.1.1"},"dependencies":{"@floating-ui/dom":"^1.7.6"},"pnpm":{"overrides":{"diff@>=6.0.0 <8.0.3":">=8.0.3","serialize-javascript@<=7.0.2":">=7.0.3","yaml@>=2.0.0 <2.8.3":">=2.8.3","serialize-javascript@>=5.0.0 <7.0.5":">=7.0.5","esbuild@>=0.27.3 <0.28.1":">=0.28.1","undici@>=7.23.0 <7.28.0":">=7.28.0","undici@>=7.0.0 <7.28.0":">=7.28.0"}},"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":{"default":"./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.40.5","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.11.0","@esm-bundle/chai":"4.3.4-fix.0","@open-wc/testing":"~4.0.0","@playwright/test":"^1.61.0","@release-it/conventional-changelog":"~11.0.1","@storybook/addon-docs":"^10.4.6","@storybook/web-components-vite":"^10.4.6","@types/mocha":"~10.0.10","@types/node":"~26.0.0","@types/react":"^19.2.17","@wc-toolkit/cem-sorter":"^1.0.1","@wc-toolkit/type-parser":"^1.2.1","@web/dev-server":"~0.4.6","@web/dev-server-esbuild":"~1.0.5","@web/test-runner":"~0.20.2","@web/test-runner-playwright":"~0.11.1","cross-env":"10.1.0","custom-element-jet-brains-integration":"^1.7.0","lit":"~3.3.3","mocha":"~11.7.6","playwright":"^1.61.0","release-it":"~20.2.0","rimraf":"^6.1.3","storybook":"^10.4.6","storybook-design-token":"^5.0.0","svgo":"^4.0.1","vite":"~8.0.16","vite-plugin-static-copy":"~4.1.1"},"dependencies":{"@floating-ui/dom":"^1.7.6"},"pnpm":{"overrides":{"diff@>=6.0.0 <8.0.3":">=8.0.3","serialize-javascript@<=7.0.2":">=7.0.3","yaml@>=2.0.0 <2.8.3":">=2.8.3","serialize-javascript@>=5.0.0 <7.0.5":">=7.0.5","esbuild@>=0.27.3 <0.28.1":">=0.28.1","undici@>=7.23.0 <7.28.0":">=7.28.0","undici@>=7.0.0 <7.28.0":">=7.28.0"}},"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":{"default":"./theme/default.css","style":"./theme/default.css"},"./custom-elements.json":{"default":"./custom-elements.json"}}}
|
package/web-types.json
CHANGED