nve-designsystem 1.4.4 → 1.4.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.
|
@@ -12,12 +12,16 @@ const o = r`
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
:host::part(title) {
|
|
15
|
-
|
|
15
|
+
display: flex;
|
|
16
|
+
align-items: center;
|
|
17
|
+
font-size: var(--font-size-small);
|
|
16
18
|
font-weight: var(--font-weight-semibold);
|
|
17
19
|
padding: 0;
|
|
18
20
|
}
|
|
19
21
|
|
|
20
22
|
:host::part(header-actions) {
|
|
23
|
+
display: flex;
|
|
24
|
+
align-items: center;
|
|
21
25
|
padding: 0;
|
|
22
26
|
}
|
|
23
27
|
|
package/custom-elements.json
CHANGED
|
@@ -63,48 +63,56 @@
|
|
|
63
63
|
},
|
|
64
64
|
{
|
|
65
65
|
"kind": "javascript-module",
|
|
66
|
-
"path": "components/nve-
|
|
66
|
+
"path": "components/nve-accordion-item/nve-accordion-item.js",
|
|
67
67
|
"declarations": [
|
|
68
68
|
{
|
|
69
69
|
"kind": "class",
|
|
70
|
-
"description": "
|
|
71
|
-
"name": "
|
|
70
|
+
"description": "Viser et kort sammendrag og utvides for å vise ekstra innhold.\nKan brukes som en selvstendig komponent eller som en del av nve-accordion.",
|
|
71
|
+
"name": "NveAccordionItem",
|
|
72
72
|
"members": [
|
|
73
73
|
{
|
|
74
74
|
"kind": "field",
|
|
75
|
-
"name": "
|
|
75
|
+
"name": "testId",
|
|
76
76
|
"type": {
|
|
77
|
-
"text": "string"
|
|
77
|
+
"text": "string | undefined"
|
|
78
78
|
},
|
|
79
|
-
"default": "
|
|
80
|
-
"description": "Tykk tekst, vises helt til venstre"
|
|
79
|
+
"default": "undefined"
|
|
81
80
|
},
|
|
82
81
|
{
|
|
83
82
|
"kind": "field",
|
|
84
|
-
"name": "
|
|
83
|
+
"name": "leftStroke",
|
|
85
84
|
"type": {
|
|
86
|
-
"text": "
|
|
85
|
+
"text": "boolean"
|
|
87
86
|
},
|
|
88
|
-
"default": "
|
|
89
|
-
"description": "
|
|
87
|
+
"default": "false",
|
|
88
|
+
"description": "tykk strek på venstre side"
|
|
90
89
|
},
|
|
91
90
|
{
|
|
92
91
|
"kind": "field",
|
|
93
|
-
"name": "
|
|
92
|
+
"name": "variant",
|
|
94
93
|
"type": {
|
|
95
|
-
"text": "'
|
|
94
|
+
"text": "'none' | 'neutral' | 'info' | 'success' | 'warning' | 'error'"
|
|
96
95
|
},
|
|
97
|
-
"default": "
|
|
98
|
-
"description": "
|
|
96
|
+
"default": "'none'",
|
|
97
|
+
"description": "Setter farge på bakgrunn og tekst"
|
|
99
98
|
},
|
|
100
99
|
{
|
|
101
100
|
"kind": "field",
|
|
102
|
-
"name": "
|
|
101
|
+
"name": "border",
|
|
103
102
|
"type": {
|
|
104
103
|
"text": "boolean"
|
|
105
104
|
},
|
|
106
105
|
"default": "false",
|
|
107
|
-
"description": "
|
|
106
|
+
"description": "Vis en ramme rundt hele komponenten"
|
|
107
|
+
},
|
|
108
|
+
{
|
|
109
|
+
"kind": "field",
|
|
110
|
+
"name": "compact",
|
|
111
|
+
"type": {
|
|
112
|
+
"text": "boolean"
|
|
113
|
+
},
|
|
114
|
+
"default": "false",
|
|
115
|
+
"description": "Kompakt visning uten luft på sidene. En strek vil vises under for å skille komponenter fra hverandre"
|
|
108
116
|
},
|
|
109
117
|
{
|
|
110
118
|
"kind": "field",
|
|
@@ -113,19 +121,7 @@
|
|
|
113
121
|
"text": "array"
|
|
114
122
|
},
|
|
115
123
|
"static": true,
|
|
116
|
-
"default": "[
|
|
117
|
-
},
|
|
118
|
-
{
|
|
119
|
-
"kind": "method",
|
|
120
|
-
"name": "updated",
|
|
121
|
-
"parameters": [
|
|
122
|
-
{
|
|
123
|
-
"name": "changedProperties",
|
|
124
|
-
"type": {
|
|
125
|
-
"text": "PropertyValues"
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
]
|
|
124
|
+
"default": "[SlDetails.styles, styles]"
|
|
129
125
|
},
|
|
130
126
|
{
|
|
131
127
|
"kind": "field",
|
|
@@ -134,177 +130,167 @@
|
|
|
134
130
|
"text": "object"
|
|
135
131
|
},
|
|
136
132
|
"static": true,
|
|
137
|
-
"default": "{ 'sl-icon
|
|
133
|
+
"default": "{ 'sl-icon': SlIcon }",
|
|
138
134
|
"inheritedFrom": {
|
|
139
|
-
"name": "
|
|
135
|
+
"name": "SlDetails"
|
|
140
136
|
}
|
|
141
137
|
},
|
|
142
138
|
{
|
|
143
139
|
"kind": "field",
|
|
144
|
-
"name": "
|
|
140
|
+
"name": "details",
|
|
145
141
|
"type": {
|
|
146
|
-
"text": "
|
|
142
|
+
"text": "HTMLDetailsElement"
|
|
147
143
|
},
|
|
148
144
|
"inheritedFrom": {
|
|
149
|
-
"name": "
|
|
145
|
+
"name": "SlDetails"
|
|
150
146
|
}
|
|
151
147
|
},
|
|
152
148
|
{
|
|
153
149
|
"kind": "field",
|
|
154
|
-
"name": "
|
|
150
|
+
"name": "header",
|
|
155
151
|
"type": {
|
|
156
152
|
"text": "HTMLElement"
|
|
157
153
|
},
|
|
158
154
|
"inheritedFrom": {
|
|
159
|
-
"name": "
|
|
155
|
+
"name": "SlDetails"
|
|
160
156
|
}
|
|
161
157
|
},
|
|
162
158
|
{
|
|
163
159
|
"kind": "field",
|
|
164
|
-
"name": "
|
|
160
|
+
"name": "body",
|
|
165
161
|
"type": {
|
|
166
|
-
"text": "
|
|
162
|
+
"text": "HTMLElement"
|
|
167
163
|
},
|
|
168
|
-
"default": "false",
|
|
169
|
-
"description": "Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the alert's open state.",
|
|
170
|
-
"attribute": "open",
|
|
171
|
-
"reflects": true,
|
|
172
164
|
"inheritedFrom": {
|
|
173
|
-
"name": "
|
|
165
|
+
"name": "SlDetails"
|
|
174
166
|
}
|
|
175
167
|
},
|
|
176
168
|
{
|
|
177
169
|
"kind": "field",
|
|
178
|
-
"name": "
|
|
170
|
+
"name": "expandIconSlot",
|
|
179
171
|
"type": {
|
|
180
|
-
"text": "
|
|
172
|
+
"text": "HTMLSlotElement"
|
|
181
173
|
},
|
|
182
|
-
"default": "false",
|
|
183
|
-
"description": "Enables a close button that allows the user to dismiss the alert.",
|
|
184
|
-
"attribute": "closable",
|
|
185
|
-
"reflects": true,
|
|
186
174
|
"inheritedFrom": {
|
|
187
|
-
"name": "
|
|
175
|
+
"name": "SlDetails"
|
|
188
176
|
}
|
|
189
177
|
},
|
|
190
178
|
{
|
|
191
179
|
"kind": "field",
|
|
192
|
-
"name": "
|
|
180
|
+
"name": "detailsObserver",
|
|
193
181
|
"type": {
|
|
194
|
-
"text": "
|
|
182
|
+
"text": "MutationObserver"
|
|
195
183
|
},
|
|
196
|
-
"default": "'primary'",
|
|
197
|
-
"description": "The alert's theme variant.",
|
|
198
|
-
"attribute": "variant",
|
|
199
|
-
"reflects": true,
|
|
200
184
|
"inheritedFrom": {
|
|
201
|
-
"name": "
|
|
185
|
+
"name": "SlDetails"
|
|
202
186
|
}
|
|
203
187
|
},
|
|
204
188
|
{
|
|
205
189
|
"kind": "field",
|
|
206
|
-
"name": "
|
|
207
|
-
"
|
|
208
|
-
|
|
209
|
-
|
|
190
|
+
"name": "open",
|
|
191
|
+
"type": {
|
|
192
|
+
"text": "boolean"
|
|
193
|
+
},
|
|
194
|
+
"default": "false",
|
|
195
|
+
"description": "Indicates whether or not the details is open. You can toggle this attribute to show and hide the details, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the details' open state.",
|
|
196
|
+
"attribute": "open",
|
|
197
|
+
"reflects": true,
|
|
210
198
|
"inheritedFrom": {
|
|
211
|
-
"name": "
|
|
199
|
+
"name": "SlDetails"
|
|
212
200
|
}
|
|
213
201
|
},
|
|
214
202
|
{
|
|
215
203
|
"kind": "field",
|
|
216
|
-
"name": "
|
|
204
|
+
"name": "summary",
|
|
217
205
|
"type": {
|
|
218
|
-
"text": "
|
|
206
|
+
"text": "string"
|
|
219
207
|
},
|
|
220
|
-
"description": "
|
|
221
|
-
"attribute": "
|
|
222
|
-
"reflects": true,
|
|
208
|
+
"description": "The summary to show in the header. If you need to display HTML, use the `summary` slot instead.",
|
|
209
|
+
"attribute": "summary",
|
|
223
210
|
"inheritedFrom": {
|
|
224
|
-
"name": "
|
|
211
|
+
"name": "SlDetails"
|
|
225
212
|
}
|
|
226
213
|
},
|
|
227
214
|
{
|
|
228
|
-
"kind": "
|
|
229
|
-
"name": "
|
|
215
|
+
"kind": "field",
|
|
216
|
+
"name": "disabled",
|
|
217
|
+
"type": {
|
|
218
|
+
"text": "boolean"
|
|
219
|
+
},
|
|
220
|
+
"default": "false",
|
|
221
|
+
"description": "Disables the details so it can't be toggled.",
|
|
222
|
+
"attribute": "disabled",
|
|
223
|
+
"reflects": true,
|
|
230
224
|
"inheritedFrom": {
|
|
231
|
-
"name": "
|
|
225
|
+
"name": "SlDetails"
|
|
232
226
|
}
|
|
233
227
|
},
|
|
234
228
|
{
|
|
235
229
|
"kind": "method",
|
|
236
|
-
"name": "
|
|
230
|
+
"name": "handleOpenChange",
|
|
237
231
|
"inheritedFrom": {
|
|
238
|
-
"name": "
|
|
232
|
+
"name": "SlDetails"
|
|
239
233
|
}
|
|
240
234
|
},
|
|
241
235
|
{
|
|
242
236
|
"kind": "method",
|
|
243
237
|
"name": "show",
|
|
244
|
-
"description": "Shows the
|
|
238
|
+
"description": "Shows the details.",
|
|
245
239
|
"inheritedFrom": {
|
|
246
|
-
"name": "
|
|
240
|
+
"name": "SlDetails"
|
|
247
241
|
}
|
|
248
242
|
},
|
|
249
243
|
{
|
|
250
244
|
"kind": "method",
|
|
251
245
|
"name": "hide",
|
|
252
|
-
"description": "Hides the
|
|
253
|
-
"inheritedFrom": {
|
|
254
|
-
"name": "SlAlert"
|
|
255
|
-
}
|
|
256
|
-
},
|
|
257
|
-
{
|
|
258
|
-
"kind": "method",
|
|
259
|
-
"name": "toast",
|
|
260
|
-
"description": "Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\ndismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\ncalling this method again. The returned promise will resolve after the alert is hidden.",
|
|
246
|
+
"description": "Hides the details",
|
|
261
247
|
"inheritedFrom": {
|
|
262
|
-
"name": "
|
|
248
|
+
"name": "SlDetails"
|
|
263
249
|
}
|
|
264
250
|
}
|
|
265
251
|
],
|
|
266
252
|
"superclass": {
|
|
267
|
-
"name": "
|
|
268
|
-
"package": "@shoelace-style/shoelace
|
|
253
|
+
"name": "SlDetails",
|
|
254
|
+
"package": "@shoelace-style/shoelace"
|
|
269
255
|
},
|
|
270
|
-
"tagNameWithoutPrefix": "
|
|
271
|
-
"tagName": "nve-
|
|
256
|
+
"tagNameWithoutPrefix": "accordion-item",
|
|
257
|
+
"tagName": "nve-accordion-item",
|
|
272
258
|
"customElement": true,
|
|
273
|
-
"jsDoc": "/**\n *
|
|
259
|
+
"jsDoc": "/**\n * Viser et kort sammendrag og utvides for å vise ekstra innhold.\n * Kan brukes som en selvstendig komponent eller som en del av nve-accordion.\n */",
|
|
274
260
|
"cssParts": [
|
|
275
261
|
{
|
|
276
262
|
"description": "The component's base wrapper.",
|
|
277
263
|
"name": "base",
|
|
278
264
|
"inheritedFrom": {
|
|
279
|
-
"name": "
|
|
265
|
+
"name": "SlDetails"
|
|
280
266
|
}
|
|
281
267
|
},
|
|
282
268
|
{
|
|
283
|
-
"description": "The
|
|
284
|
-
"name": "
|
|
269
|
+
"description": "The header that wraps both the summary and the expand/collapse icon.",
|
|
270
|
+
"name": "header",
|
|
285
271
|
"inheritedFrom": {
|
|
286
|
-
"name": "
|
|
272
|
+
"name": "SlDetails"
|
|
287
273
|
}
|
|
288
274
|
},
|
|
289
275
|
{
|
|
290
|
-
"description": "The container that wraps the
|
|
291
|
-
"name": "
|
|
276
|
+
"description": "The container that wraps the summary.",
|
|
277
|
+
"name": "summary",
|
|
292
278
|
"inheritedFrom": {
|
|
293
|
-
"name": "
|
|
279
|
+
"name": "SlDetails"
|
|
294
280
|
}
|
|
295
281
|
},
|
|
296
282
|
{
|
|
297
|
-
"description": "The
|
|
298
|
-
"name": "
|
|
283
|
+
"description": "The container that wraps the expand/collapse icons.",
|
|
284
|
+
"name": "summary-icon",
|
|
299
285
|
"inheritedFrom": {
|
|
300
|
-
"name": "
|
|
286
|
+
"name": "SlDetails"
|
|
301
287
|
}
|
|
302
288
|
},
|
|
303
289
|
{
|
|
304
|
-
"description": "The
|
|
305
|
-
"name": "
|
|
290
|
+
"description": "The details content.",
|
|
291
|
+
"name": "content",
|
|
306
292
|
"inheritedFrom": {
|
|
307
|
-
"name": "
|
|
293
|
+
"name": "SlDetails"
|
|
308
294
|
}
|
|
309
295
|
}
|
|
310
296
|
],
|
|
@@ -315,108 +301,101 @@
|
|
|
315
301
|
"text": "boolean"
|
|
316
302
|
},
|
|
317
303
|
"default": "false",
|
|
318
|
-
"description": "Indicates whether or not the
|
|
304
|
+
"description": "Indicates whether or not the details is open. You can toggle this attribute to show and hide the details, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the details' open state.",
|
|
319
305
|
"fieldName": "open",
|
|
320
306
|
"inheritedFrom": {
|
|
321
|
-
"name": "
|
|
322
|
-
}
|
|
323
|
-
},
|
|
324
|
-
{
|
|
325
|
-
"name": "closable",
|
|
326
|
-
"type": {
|
|
327
|
-
"text": "boolean"
|
|
328
|
-
},
|
|
329
|
-
"default": "false",
|
|
330
|
-
"description": "Enables a close button that allows the user to dismiss the alert.",
|
|
331
|
-
"fieldName": "closable",
|
|
332
|
-
"inheritedFrom": {
|
|
333
|
-
"name": "SlAlert"
|
|
307
|
+
"name": "SlDetails"
|
|
334
308
|
}
|
|
335
309
|
},
|
|
336
310
|
{
|
|
337
|
-
"name": "
|
|
311
|
+
"name": "summary",
|
|
338
312
|
"type": {
|
|
339
|
-
"text": "
|
|
313
|
+
"text": "string"
|
|
340
314
|
},
|
|
341
|
-
"
|
|
342
|
-
"
|
|
343
|
-
"fieldName": "variant",
|
|
344
|
-
"inheritedFrom": {
|
|
345
|
-
"name": "SlAlert"
|
|
346
|
-
}
|
|
347
|
-
},
|
|
348
|
-
{
|
|
349
|
-
"name": "duration",
|
|
350
|
-
"default": "Infinity",
|
|
351
|
-
"description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
|
|
352
|
-
"fieldName": "duration",
|
|
315
|
+
"description": "The summary to show in the header. If you need to display HTML, use the `summary` slot instead.",
|
|
316
|
+
"fieldName": "summary",
|
|
353
317
|
"inheritedFrom": {
|
|
354
|
-
"name": "
|
|
318
|
+
"name": "SlDetails"
|
|
355
319
|
}
|
|
356
320
|
},
|
|
357
321
|
{
|
|
358
|
-
"name": "
|
|
322
|
+
"name": "disabled",
|
|
359
323
|
"type": {
|
|
360
|
-
"text": "
|
|
324
|
+
"text": "boolean"
|
|
361
325
|
},
|
|
362
|
-
"
|
|
363
|
-
"
|
|
326
|
+
"default": "false",
|
|
327
|
+
"description": "Disables the details so it can't be toggled.",
|
|
328
|
+
"fieldName": "disabled",
|
|
364
329
|
"inheritedFrom": {
|
|
365
|
-
"name": "
|
|
330
|
+
"name": "SlDetails"
|
|
366
331
|
}
|
|
367
332
|
}
|
|
368
333
|
],
|
|
369
334
|
"events": [
|
|
370
335
|
{
|
|
371
|
-
"description": "Emitted when the
|
|
336
|
+
"description": "Emitted when the details opens.",
|
|
372
337
|
"name": "sl-show",
|
|
373
338
|
"reactName": "onSlShow",
|
|
374
339
|
"eventName": "SlShowEvent",
|
|
375
340
|
"inheritedFrom": {
|
|
376
|
-
"name": "
|
|
341
|
+
"name": "SlDetails"
|
|
377
342
|
}
|
|
378
343
|
},
|
|
379
344
|
{
|
|
380
|
-
"description": "Emitted after the
|
|
345
|
+
"description": "Emitted after the details opens and all animations are complete.",
|
|
381
346
|
"name": "sl-after-show",
|
|
382
347
|
"reactName": "onSlAfterShow",
|
|
383
348
|
"eventName": "SlAfterShowEvent",
|
|
384
349
|
"inheritedFrom": {
|
|
385
|
-
"name": "
|
|
350
|
+
"name": "SlDetails"
|
|
386
351
|
}
|
|
387
352
|
},
|
|
388
353
|
{
|
|
389
|
-
"description": "Emitted when the
|
|
354
|
+
"description": "Emitted when the details closes.",
|
|
390
355
|
"name": "sl-hide",
|
|
391
356
|
"reactName": "onSlHide",
|
|
392
357
|
"eventName": "SlHideEvent",
|
|
393
358
|
"inheritedFrom": {
|
|
394
|
-
"name": "
|
|
359
|
+
"name": "SlDetails"
|
|
395
360
|
}
|
|
396
361
|
},
|
|
397
362
|
{
|
|
398
|
-
"description": "Emitted after the
|
|
363
|
+
"description": "Emitted after the details closes and all animations are complete.",
|
|
399
364
|
"name": "sl-after-hide",
|
|
400
365
|
"reactName": "onSlAfterHide",
|
|
401
366
|
"eventName": "SlAfterHideEvent",
|
|
402
367
|
"inheritedFrom": {
|
|
403
|
-
"name": "
|
|
368
|
+
"name": "SlDetails"
|
|
404
369
|
}
|
|
405
370
|
}
|
|
406
371
|
],
|
|
407
372
|
"slots": [
|
|
408
373
|
{
|
|
409
|
-
"description": "The
|
|
374
|
+
"description": "The details' main content.",
|
|
410
375
|
"name": "",
|
|
411
376
|
"inheritedFrom": {
|
|
412
|
-
"name": "
|
|
377
|
+
"name": "SlDetails"
|
|
413
378
|
}
|
|
414
379
|
},
|
|
415
380
|
{
|
|
416
|
-
"description": "
|
|
417
|
-
"name": "
|
|
381
|
+
"description": "The details' summary. Alternatively, you can use the `summary` attribute.",
|
|
382
|
+
"name": "summary",
|
|
418
383
|
"inheritedFrom": {
|
|
419
|
-
"name": "
|
|
384
|
+
"name": "SlDetails"
|
|
385
|
+
}
|
|
386
|
+
},
|
|
387
|
+
{
|
|
388
|
+
"description": "Optional expand icon to use instead of the default. Works best with `<sl-icon>`.",
|
|
389
|
+
"name": "expand-icon",
|
|
390
|
+
"inheritedFrom": {
|
|
391
|
+
"name": "SlDetails"
|
|
392
|
+
}
|
|
393
|
+
},
|
|
394
|
+
{
|
|
395
|
+
"description": "Optional collapse icon to use instead of the default. Works best with `<sl-icon>`.",
|
|
396
|
+
"name": "collapse-icon",
|
|
397
|
+
"inheritedFrom": {
|
|
398
|
+
"name": "SlDetails"
|
|
420
399
|
}
|
|
421
400
|
}
|
|
422
401
|
]
|
|
@@ -427,64 +406,56 @@
|
|
|
427
406
|
"kind": "js",
|
|
428
407
|
"name": "default",
|
|
429
408
|
"declaration": {
|
|
430
|
-
"name": "
|
|
431
|
-
"module": "components/nve-
|
|
409
|
+
"name": "NveAccordionItem",
|
|
410
|
+
"module": "components/nve-accordion-item/nve-accordion-item.js"
|
|
432
411
|
}
|
|
433
412
|
}
|
|
434
413
|
]
|
|
435
414
|
},
|
|
436
415
|
{
|
|
437
416
|
"kind": "javascript-module",
|
|
438
|
-
"path": "components/nve-
|
|
417
|
+
"path": "components/nve-alert/nve-alert.js",
|
|
439
418
|
"declarations": [
|
|
440
419
|
{
|
|
441
420
|
"kind": "class",
|
|
442
|
-
"description": "
|
|
443
|
-
"name": "
|
|
421
|
+
"description": "Brukes til å vise viktige beskjeder enten på en side eller som en enkel popup.\nHvis du trenger å vise en statisk varsling med mer informasjon, kan det hende at\nnve-message-card er et bedre valg.",
|
|
422
|
+
"name": "NveAlert",
|
|
444
423
|
"members": [
|
|
445
424
|
{
|
|
446
425
|
"kind": "field",
|
|
447
|
-
"name": "
|
|
448
|
-
"type": {
|
|
449
|
-
"text": "string | undefined"
|
|
450
|
-
},
|
|
451
|
-
"default": "undefined"
|
|
452
|
-
},
|
|
453
|
-
{
|
|
454
|
-
"kind": "field",
|
|
455
|
-
"name": "leftStroke",
|
|
426
|
+
"name": "title",
|
|
456
427
|
"type": {
|
|
457
|
-
"text": "
|
|
428
|
+
"text": "string"
|
|
458
429
|
},
|
|
459
|
-
"default": "
|
|
460
|
-
"description": "
|
|
430
|
+
"default": "''",
|
|
431
|
+
"description": "Tykk tekst, vises helt til venstre"
|
|
461
432
|
},
|
|
462
433
|
{
|
|
463
434
|
"kind": "field",
|
|
464
|
-
"name": "
|
|
435
|
+
"name": "text",
|
|
465
436
|
"type": {
|
|
466
|
-
"text": "
|
|
437
|
+
"text": "string"
|
|
467
438
|
},
|
|
468
|
-
"default": "'
|
|
469
|
-
"description": "
|
|
439
|
+
"default": "''",
|
|
440
|
+
"description": "Tynnere beskrivelse tekst"
|
|
470
441
|
},
|
|
471
442
|
{
|
|
472
443
|
"kind": "field",
|
|
473
|
-
"name": "
|
|
444
|
+
"name": "saturation",
|
|
474
445
|
"type": {
|
|
475
|
-
"text": "
|
|
446
|
+
"text": "'emphasized' | null"
|
|
476
447
|
},
|
|
477
|
-
"default": "
|
|
478
|
-
"description": "
|
|
448
|
+
"default": "null",
|
|
449
|
+
"description": "Bestemmer sterkere bakgrunnsfarge"
|
|
479
450
|
},
|
|
480
451
|
{
|
|
481
452
|
"kind": "field",
|
|
482
|
-
"name": "
|
|
453
|
+
"name": "leftStroke",
|
|
483
454
|
"type": {
|
|
484
455
|
"text": "boolean"
|
|
485
456
|
},
|
|
486
457
|
"default": "false",
|
|
487
|
-
"description": "
|
|
458
|
+
"description": "Ramme linje til venstre"
|
|
488
459
|
},
|
|
489
460
|
{
|
|
490
461
|
"kind": "field",
|
|
@@ -493,7 +464,19 @@
|
|
|
493
464
|
"text": "array"
|
|
494
465
|
},
|
|
495
466
|
"static": true,
|
|
496
|
-
"default": "[
|
|
467
|
+
"default": "[ SlAlert.styles, // we have to have this otherwise closable is not working styles, ]"
|
|
468
|
+
},
|
|
469
|
+
{
|
|
470
|
+
"kind": "method",
|
|
471
|
+
"name": "updated",
|
|
472
|
+
"parameters": [
|
|
473
|
+
{
|
|
474
|
+
"name": "changedProperties",
|
|
475
|
+
"type": {
|
|
476
|
+
"text": "PropertyValues"
|
|
477
|
+
}
|
|
478
|
+
}
|
|
479
|
+
]
|
|
497
480
|
},
|
|
498
481
|
{
|
|
499
482
|
"kind": "field",
|
|
@@ -502,167 +485,177 @@
|
|
|
502
485
|
"text": "object"
|
|
503
486
|
},
|
|
504
487
|
"static": true,
|
|
505
|
-
"default": "{ 'sl-icon':
|
|
506
|
-
"inheritedFrom": {
|
|
507
|
-
"name": "SlDetails"
|
|
508
|
-
}
|
|
509
|
-
},
|
|
510
|
-
{
|
|
511
|
-
"kind": "field",
|
|
512
|
-
"name": "details",
|
|
513
|
-
"type": {
|
|
514
|
-
"text": "HTMLDetailsElement"
|
|
515
|
-
},
|
|
488
|
+
"default": "{ 'sl-icon-button': SlIconButton }",
|
|
516
489
|
"inheritedFrom": {
|
|
517
|
-
"name": "
|
|
490
|
+
"name": "SlAlert"
|
|
518
491
|
}
|
|
519
492
|
},
|
|
520
493
|
{
|
|
521
494
|
"kind": "field",
|
|
522
|
-
"name": "
|
|
495
|
+
"name": "base",
|
|
523
496
|
"type": {
|
|
524
497
|
"text": "HTMLElement"
|
|
525
498
|
},
|
|
526
499
|
"inheritedFrom": {
|
|
527
|
-
"name": "
|
|
500
|
+
"name": "SlAlert"
|
|
528
501
|
}
|
|
529
502
|
},
|
|
530
503
|
{
|
|
531
504
|
"kind": "field",
|
|
532
|
-
"name": "
|
|
505
|
+
"name": "countdownElement",
|
|
533
506
|
"type": {
|
|
534
507
|
"text": "HTMLElement"
|
|
535
508
|
},
|
|
536
509
|
"inheritedFrom": {
|
|
537
|
-
"name": "
|
|
510
|
+
"name": "SlAlert"
|
|
538
511
|
}
|
|
539
512
|
},
|
|
540
513
|
{
|
|
541
514
|
"kind": "field",
|
|
542
|
-
"name": "
|
|
515
|
+
"name": "open",
|
|
543
516
|
"type": {
|
|
544
|
-
"text": "
|
|
517
|
+
"text": "boolean"
|
|
545
518
|
},
|
|
519
|
+
"default": "false",
|
|
520
|
+
"description": "Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the alert's open state.",
|
|
521
|
+
"attribute": "open",
|
|
522
|
+
"reflects": true,
|
|
546
523
|
"inheritedFrom": {
|
|
547
|
-
"name": "
|
|
524
|
+
"name": "SlAlert"
|
|
548
525
|
}
|
|
549
526
|
},
|
|
550
527
|
{
|
|
551
528
|
"kind": "field",
|
|
552
|
-
"name": "
|
|
529
|
+
"name": "closable",
|
|
553
530
|
"type": {
|
|
554
|
-
"text": "
|
|
531
|
+
"text": "boolean"
|
|
555
532
|
},
|
|
533
|
+
"default": "false",
|
|
534
|
+
"description": "Enables a close button that allows the user to dismiss the alert.",
|
|
535
|
+
"attribute": "closable",
|
|
536
|
+
"reflects": true,
|
|
556
537
|
"inheritedFrom": {
|
|
557
|
-
"name": "
|
|
538
|
+
"name": "SlAlert"
|
|
558
539
|
}
|
|
559
540
|
},
|
|
560
541
|
{
|
|
561
542
|
"kind": "field",
|
|
562
|
-
"name": "
|
|
543
|
+
"name": "variant",
|
|
563
544
|
"type": {
|
|
564
|
-
"text": "
|
|
545
|
+
"text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
|
|
565
546
|
},
|
|
566
|
-
"default": "
|
|
567
|
-
"description": "
|
|
568
|
-
"attribute": "
|
|
547
|
+
"default": "'primary'",
|
|
548
|
+
"description": "The alert's theme variant.",
|
|
549
|
+
"attribute": "variant",
|
|
569
550
|
"reflects": true,
|
|
570
551
|
"inheritedFrom": {
|
|
571
|
-
"name": "
|
|
552
|
+
"name": "SlAlert"
|
|
572
553
|
}
|
|
573
554
|
},
|
|
574
555
|
{
|
|
575
556
|
"kind": "field",
|
|
576
|
-
"name": "
|
|
577
|
-
"
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
"description": "The summary to show in the header. If you need to display HTML, use the `summary` slot instead.",
|
|
581
|
-
"attribute": "summary",
|
|
557
|
+
"name": "duration",
|
|
558
|
+
"default": "Infinity",
|
|
559
|
+
"description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
|
|
560
|
+
"attribute": "duration",
|
|
582
561
|
"inheritedFrom": {
|
|
583
|
-
"name": "
|
|
562
|
+
"name": "SlAlert"
|
|
584
563
|
}
|
|
585
564
|
},
|
|
586
565
|
{
|
|
587
566
|
"kind": "field",
|
|
588
|
-
"name": "
|
|
567
|
+
"name": "countdown",
|
|
589
568
|
"type": {
|
|
590
|
-
"text": "
|
|
569
|
+
"text": "'rtl' | 'ltr' | undefined"
|
|
591
570
|
},
|
|
592
|
-
"
|
|
593
|
-
"
|
|
594
|
-
"attribute": "disabled",
|
|
571
|
+
"description": "Enables a countdown that indicates the remaining time the alert will be displayed.\nTypically used to indicate the remaining time before a whole app refresh.",
|
|
572
|
+
"attribute": "countdown",
|
|
595
573
|
"reflects": true,
|
|
596
574
|
"inheritedFrom": {
|
|
597
|
-
"name": "
|
|
575
|
+
"name": "SlAlert"
|
|
598
576
|
}
|
|
599
577
|
},
|
|
600
578
|
{
|
|
601
579
|
"kind": "method",
|
|
602
580
|
"name": "handleOpenChange",
|
|
603
581
|
"inheritedFrom": {
|
|
604
|
-
"name": "
|
|
582
|
+
"name": "SlAlert"
|
|
583
|
+
}
|
|
584
|
+
},
|
|
585
|
+
{
|
|
586
|
+
"kind": "method",
|
|
587
|
+
"name": "handleDurationChange",
|
|
588
|
+
"inheritedFrom": {
|
|
589
|
+
"name": "SlAlert"
|
|
605
590
|
}
|
|
606
591
|
},
|
|
607
592
|
{
|
|
608
593
|
"kind": "method",
|
|
609
594
|
"name": "show",
|
|
610
|
-
"description": "Shows the
|
|
595
|
+
"description": "Shows the alert.",
|
|
611
596
|
"inheritedFrom": {
|
|
612
|
-
"name": "
|
|
597
|
+
"name": "SlAlert"
|
|
613
598
|
}
|
|
614
599
|
},
|
|
615
600
|
{
|
|
616
601
|
"kind": "method",
|
|
617
602
|
"name": "hide",
|
|
618
|
-
"description": "Hides the
|
|
603
|
+
"description": "Hides the alert",
|
|
619
604
|
"inheritedFrom": {
|
|
620
|
-
"name": "
|
|
605
|
+
"name": "SlAlert"
|
|
606
|
+
}
|
|
607
|
+
},
|
|
608
|
+
{
|
|
609
|
+
"kind": "method",
|
|
610
|
+
"name": "toast",
|
|
611
|
+
"description": "Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\ndismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\ncalling this method again. The returned promise will resolve after the alert is hidden.",
|
|
612
|
+
"inheritedFrom": {
|
|
613
|
+
"name": "SlAlert"
|
|
621
614
|
}
|
|
622
615
|
}
|
|
623
616
|
],
|
|
624
617
|
"superclass": {
|
|
625
|
-
"name": "
|
|
626
|
-
"package": "@shoelace-style/shoelace"
|
|
618
|
+
"name": "SlAlert",
|
|
619
|
+
"package": "@shoelace-style/shoelace/dist/components/alert/alert.js"
|
|
627
620
|
},
|
|
628
|
-
"tagNameWithoutPrefix": "
|
|
629
|
-
"tagName": "nve-
|
|
621
|
+
"tagNameWithoutPrefix": "alert",
|
|
622
|
+
"tagName": "nve-alert",
|
|
630
623
|
"customElement": true,
|
|
631
|
-
"jsDoc": "/**\n *
|
|
624
|
+
"jsDoc": "/**\n * Brukes til å vise viktige beskjeder enten på en side eller som en enkel popup.\n * Hvis du trenger å vise en statisk varsling med mer informasjon, kan det hende at\n * nve-message-card er et bedre valg.\n */",
|
|
632
625
|
"cssParts": [
|
|
633
626
|
{
|
|
634
627
|
"description": "The component's base wrapper.",
|
|
635
628
|
"name": "base",
|
|
636
629
|
"inheritedFrom": {
|
|
637
|
-
"name": "
|
|
630
|
+
"name": "SlAlert"
|
|
638
631
|
}
|
|
639
632
|
},
|
|
640
633
|
{
|
|
641
|
-
"description": "The
|
|
642
|
-
"name": "
|
|
634
|
+
"description": "The container that wraps the optional icon.",
|
|
635
|
+
"name": "icon",
|
|
643
636
|
"inheritedFrom": {
|
|
644
|
-
"name": "
|
|
637
|
+
"name": "SlAlert"
|
|
645
638
|
}
|
|
646
639
|
},
|
|
647
640
|
{
|
|
648
|
-
"description": "The container that wraps the
|
|
649
|
-
"name": "
|
|
641
|
+
"description": "The container that wraps the alert's main content.",
|
|
642
|
+
"name": "message",
|
|
650
643
|
"inheritedFrom": {
|
|
651
|
-
"name": "
|
|
644
|
+
"name": "SlAlert"
|
|
652
645
|
}
|
|
653
646
|
},
|
|
654
647
|
{
|
|
655
|
-
"description": "The
|
|
656
|
-
"name": "
|
|
648
|
+
"description": "The close button, an `<sl-icon-button>`.",
|
|
649
|
+
"name": "close-button",
|
|
657
650
|
"inheritedFrom": {
|
|
658
|
-
"name": "
|
|
651
|
+
"name": "SlAlert"
|
|
659
652
|
}
|
|
660
653
|
},
|
|
661
654
|
{
|
|
662
|
-
"description": "The
|
|
663
|
-
"name": "
|
|
655
|
+
"description": "The close button's exported `base` part.",
|
|
656
|
+
"name": "close-button__base",
|
|
664
657
|
"inheritedFrom": {
|
|
665
|
-
"name": "
|
|
658
|
+
"name": "SlAlert"
|
|
666
659
|
}
|
|
667
660
|
}
|
|
668
661
|
],
|
|
@@ -673,101 +666,108 @@
|
|
|
673
666
|
"text": "boolean"
|
|
674
667
|
},
|
|
675
668
|
"default": "false",
|
|
676
|
-
"description": "Indicates whether or not the
|
|
669
|
+
"description": "Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the alert's open state.",
|
|
677
670
|
"fieldName": "open",
|
|
678
671
|
"inheritedFrom": {
|
|
679
|
-
"name": "
|
|
672
|
+
"name": "SlAlert"
|
|
680
673
|
}
|
|
681
674
|
},
|
|
682
675
|
{
|
|
683
|
-
"name": "
|
|
676
|
+
"name": "closable",
|
|
684
677
|
"type": {
|
|
685
|
-
"text": "
|
|
678
|
+
"text": "boolean"
|
|
686
679
|
},
|
|
687
|
-
"
|
|
688
|
-
"
|
|
680
|
+
"default": "false",
|
|
681
|
+
"description": "Enables a close button that allows the user to dismiss the alert.",
|
|
682
|
+
"fieldName": "closable",
|
|
689
683
|
"inheritedFrom": {
|
|
690
|
-
"name": "
|
|
684
|
+
"name": "SlAlert"
|
|
691
685
|
}
|
|
692
686
|
},
|
|
693
687
|
{
|
|
694
|
-
"name": "
|
|
688
|
+
"name": "variant",
|
|
695
689
|
"type": {
|
|
696
|
-
"text": "
|
|
690
|
+
"text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
|
|
697
691
|
},
|
|
698
|
-
"default": "
|
|
699
|
-
"description": "
|
|
700
|
-
"fieldName": "
|
|
692
|
+
"default": "'primary'",
|
|
693
|
+
"description": "The alert's theme variant.",
|
|
694
|
+
"fieldName": "variant",
|
|
701
695
|
"inheritedFrom": {
|
|
702
|
-
"name": "
|
|
696
|
+
"name": "SlAlert"
|
|
697
|
+
}
|
|
698
|
+
},
|
|
699
|
+
{
|
|
700
|
+
"name": "duration",
|
|
701
|
+
"default": "Infinity",
|
|
702
|
+
"description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
|
|
703
|
+
"fieldName": "duration",
|
|
704
|
+
"inheritedFrom": {
|
|
705
|
+
"name": "SlAlert"
|
|
706
|
+
}
|
|
707
|
+
},
|
|
708
|
+
{
|
|
709
|
+
"name": "countdown",
|
|
710
|
+
"type": {
|
|
711
|
+
"text": "'rtl' | 'ltr' | undefined"
|
|
712
|
+
},
|
|
713
|
+
"description": "Enables a countdown that indicates the remaining time the alert will be displayed.\nTypically used to indicate the remaining time before a whole app refresh.",
|
|
714
|
+
"fieldName": "countdown",
|
|
715
|
+
"inheritedFrom": {
|
|
716
|
+
"name": "SlAlert"
|
|
703
717
|
}
|
|
704
718
|
}
|
|
705
719
|
],
|
|
706
720
|
"events": [
|
|
707
721
|
{
|
|
708
|
-
"description": "Emitted when the
|
|
722
|
+
"description": "Emitted when the alert opens.",
|
|
709
723
|
"name": "sl-show",
|
|
710
724
|
"reactName": "onSlShow",
|
|
711
725
|
"eventName": "SlShowEvent",
|
|
712
726
|
"inheritedFrom": {
|
|
713
|
-
"name": "
|
|
727
|
+
"name": "SlAlert"
|
|
714
728
|
}
|
|
715
729
|
},
|
|
716
730
|
{
|
|
717
|
-
"description": "Emitted after the
|
|
731
|
+
"description": "Emitted after the alert opens and all animations are complete.",
|
|
718
732
|
"name": "sl-after-show",
|
|
719
733
|
"reactName": "onSlAfterShow",
|
|
720
734
|
"eventName": "SlAfterShowEvent",
|
|
721
735
|
"inheritedFrom": {
|
|
722
|
-
"name": "
|
|
736
|
+
"name": "SlAlert"
|
|
723
737
|
}
|
|
724
738
|
},
|
|
725
739
|
{
|
|
726
|
-
"description": "Emitted when the
|
|
740
|
+
"description": "Emitted when the alert closes.",
|
|
727
741
|
"name": "sl-hide",
|
|
728
742
|
"reactName": "onSlHide",
|
|
729
743
|
"eventName": "SlHideEvent",
|
|
730
744
|
"inheritedFrom": {
|
|
731
|
-
"name": "
|
|
745
|
+
"name": "SlAlert"
|
|
732
746
|
}
|
|
733
747
|
},
|
|
734
748
|
{
|
|
735
|
-
"description": "Emitted after the
|
|
749
|
+
"description": "Emitted after the alert closes and all animations are complete.",
|
|
736
750
|
"name": "sl-after-hide",
|
|
737
751
|
"reactName": "onSlAfterHide",
|
|
738
752
|
"eventName": "SlAfterHideEvent",
|
|
739
753
|
"inheritedFrom": {
|
|
740
|
-
"name": "
|
|
754
|
+
"name": "SlAlert"
|
|
741
755
|
}
|
|
742
756
|
}
|
|
743
757
|
],
|
|
744
758
|
"slots": [
|
|
745
759
|
{
|
|
746
|
-
"description": "The
|
|
760
|
+
"description": "The alert's main content.",
|
|
747
761
|
"name": "",
|
|
748
762
|
"inheritedFrom": {
|
|
749
|
-
"name": "
|
|
750
|
-
}
|
|
751
|
-
},
|
|
752
|
-
{
|
|
753
|
-
"description": "The details' summary. Alternatively, you can use the `summary` attribute.",
|
|
754
|
-
"name": "summary",
|
|
755
|
-
"inheritedFrom": {
|
|
756
|
-
"name": "SlDetails"
|
|
757
|
-
}
|
|
758
|
-
},
|
|
759
|
-
{
|
|
760
|
-
"description": "Optional expand icon to use instead of the default. Works best with `<sl-icon>`.",
|
|
761
|
-
"name": "expand-icon",
|
|
762
|
-
"inheritedFrom": {
|
|
763
|
-
"name": "SlDetails"
|
|
763
|
+
"name": "SlAlert"
|
|
764
764
|
}
|
|
765
765
|
},
|
|
766
766
|
{
|
|
767
|
-
"description": "
|
|
768
|
-
"name": "
|
|
767
|
+
"description": "An icon to show in the alert. Works best with `<sl-icon>`.",
|
|
768
|
+
"name": "icon",
|
|
769
769
|
"inheritedFrom": {
|
|
770
|
-
"name": "
|
|
770
|
+
"name": "SlAlert"
|
|
771
771
|
}
|
|
772
772
|
}
|
|
773
773
|
]
|
|
@@ -778,8 +778,8 @@
|
|
|
778
778
|
"kind": "js",
|
|
779
779
|
"name": "default",
|
|
780
780
|
"declaration": {
|
|
781
|
-
"name": "
|
|
782
|
-
"module": "components/nve-
|
|
781
|
+
"name": "NveAlert",
|
|
782
|
+
"module": "components/nve-alert/nve-alert.js"
|
|
783
783
|
}
|
|
784
784
|
}
|
|
785
785
|
]
|
|
@@ -12657,7 +12657,7 @@
|
|
|
12657
12657
|
"package": {
|
|
12658
12658
|
"name": "nve-designsystem",
|
|
12659
12659
|
"description": "Designsystem for NVE",
|
|
12660
|
-
"version": "1.4.
|
|
12660
|
+
"version": "1.4.4",
|
|
12661
12661
|
"author": {
|
|
12662
12662
|
"name": "NVE",
|
|
12663
12663
|
"email": "nve@nve.no"
|