@proximus/lavender-mega-dropdown 2.0.0-alpha.21 → 2.0.0-alpha.210

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.
@@ -1,4 +1,5 @@
1
1
  export declare class MDDCloser extends HTMLElement {
2
+ protected static readonly template: HTMLTemplateElement;
2
3
  constructor();
3
4
  connectedCallback(): void;
4
5
  }
@@ -1,7 +1,7 @@
1
1
  import '@proximus/lavender-heading';
2
2
  import '@proximus/lavender-layout';
3
3
  export declare class MddSection extends HTMLElement {
4
- template: string;
4
+ protected static readonly template: HTMLTemplateElement;
5
5
  constructor();
6
6
  connectedCallback(): void;
7
7
  static get observedAttributes(): string[];
@@ -10,11 +10,11 @@ export declare class MddSectionItem extends HTMLElement {
10
10
  private updateView;
11
11
  connectedCallback(): void;
12
12
  private handleClick;
13
- configureAfterIcon(icon: any): void;
14
- get href(): string;
15
- set href(value: string);
16
- get $link(): HTMLAnchorElement;
17
- get $button(): HTMLButtonElement;
13
+ configureAfterIcon(icon: HTMLElement): void;
14
+ get href(): string | null;
15
+ set href(value: string | null);
16
+ get $link(): HTMLAnchorElement | null;
17
+ get $button(): HTMLButtonElement | null;
18
18
  get $after(): HTMLSlotElement;
19
19
  get $arrowIcon(): HTMLElement;
20
20
  }
@@ -18,12 +18,12 @@ export declare class MegaDropDown extends HTMLElement {
18
18
  get $dialog(): HTMLDialogElement;
19
19
  get hidden(): boolean;
20
20
  set hidden(value: boolean);
21
- get name(): string;
22
- set name(value: string);
23
- get closeButtonAriaLabel(): string;
24
- set closeButtonAriaLabel(value: string);
25
- get backToMenuLabel(): string;
26
- set backToMenuLabel(value: string);
21
+ get name(): string | null;
22
+ set name(value: string | null);
23
+ get closeButtonAriaLabel(): string | null;
24
+ set closeButtonAriaLabel(value: string | null);
25
+ get backToMenuLabel(): string | null;
26
+ set backToMenuLabel(value: string | null);
27
27
  get $slotMddFooter(): HTMLSlotElement;
28
28
  set dialogOffsetTop(value: string);
29
29
  }
@@ -0,0 +1,466 @@
1
+ {
2
+ "schemaVersion": "1.0.0",
3
+ "readme": "",
4
+ "modules": [
5
+ {
6
+ "kind": "javascript-module",
7
+ "path": "src/MDDCloser.ts",
8
+ "declarations": [
9
+ {
10
+ "kind": "class",
11
+ "description": "",
12
+ "name": "MDDCloser",
13
+ "members": [
14
+ {
15
+ "kind": "field",
16
+ "name": "template",
17
+ "privacy": "protected",
18
+ "static": true,
19
+ "readonly": true
20
+ }
21
+ ],
22
+ "events": [
23
+ {
24
+ "name": "close-panel",
25
+ "type": {
26
+ "text": "CustomEvent"
27
+ }
28
+ }
29
+ ],
30
+ "superclass": {
31
+ "name": "HTMLElement"
32
+ },
33
+ "tagName": "px-mdd-closer",
34
+ "customElement": true
35
+ }
36
+ ],
37
+ "exports": [
38
+ {
39
+ "kind": "js",
40
+ "name": "MDDCloser",
41
+ "declaration": {
42
+ "name": "MDDCloser",
43
+ "module": "src/MDDCloser.ts"
44
+ }
45
+ },
46
+ {
47
+ "kind": "custom-element-definition",
48
+ "name": "px-mdd-closer",
49
+ "declaration": {
50
+ "name": "MDDCloser",
51
+ "module": "src/MDDCloser.ts"
52
+ }
53
+ }
54
+ ]
55
+ },
56
+ {
57
+ "kind": "javascript-module",
58
+ "path": "src/MddSection.ts",
59
+ "declarations": [
60
+ {
61
+ "kind": "class",
62
+ "description": "",
63
+ "name": "MddSection",
64
+ "members": [
65
+ {
66
+ "kind": "field",
67
+ "name": "template",
68
+ "privacy": "protected",
69
+ "static": true,
70
+ "readonly": true
71
+ },
72
+ {
73
+ "kind": "method",
74
+ "name": "setupForId"
75
+ },
76
+ {
77
+ "kind": "field",
78
+ "name": "$slotTitle",
79
+ "readonly": true
80
+ },
81
+ {
82
+ "kind": "field",
83
+ "name": "$title",
84
+ "privacy": "private",
85
+ "readonly": true
86
+ },
87
+ {
88
+ "kind": "field",
89
+ "name": "$sectionWrapper",
90
+ "privacy": "private",
91
+ "readonly": true
92
+ },
93
+ {
94
+ "kind": "field",
95
+ "name": "$sectionItems",
96
+ "privacy": "private",
97
+ "readonly": true
98
+ },
99
+ {
100
+ "kind": "field",
101
+ "name": "hiddenTitle"
102
+ },
103
+ {
104
+ "kind": "field",
105
+ "name": "adoptedStyleSheets",
106
+ "type": {
107
+ "text": "array"
108
+ },
109
+ "default": "[stylesheet]"
110
+ }
111
+ ],
112
+ "attributes": [
113
+ {
114
+ "name": "title-hidden"
115
+ }
116
+ ],
117
+ "superclass": {
118
+ "name": "HTMLElement"
119
+ },
120
+ "tagName": "px-mdd-section",
121
+ "customElement": true
122
+ }
123
+ ],
124
+ "exports": [
125
+ {
126
+ "kind": "js",
127
+ "name": "MddSection",
128
+ "declaration": {
129
+ "name": "MddSection",
130
+ "module": "src/MddSection.ts"
131
+ }
132
+ },
133
+ {
134
+ "kind": "custom-element-definition",
135
+ "name": "px-mdd-section",
136
+ "declaration": {
137
+ "name": "MddSection",
138
+ "module": "src/MddSection.ts"
139
+ }
140
+ }
141
+ ]
142
+ },
143
+ {
144
+ "kind": "javascript-module",
145
+ "path": "src/MddSectionItem.ts",
146
+ "declarations": [
147
+ {
148
+ "kind": "class",
149
+ "description": "",
150
+ "name": "MddSectionItem",
151
+ "members": [
152
+ {
153
+ "kind": "field",
154
+ "name": "internals",
155
+ "type": {
156
+ "text": "ElementInternals"
157
+ }
158
+ },
159
+ {
160
+ "kind": "field",
161
+ "name": "template",
162
+ "default": "` <px-hstack align-items=\"center\" gap=\"default\"> <span class=\"mdd-section-item-action-container\"> <slot></slot> <slot name=\"after\"></slot> </span> <px-spacer></px-spacer> <px-icon name=\"chevron_right\" from=\"lavender\" size=\"m\"></px-icon> </px-hstack>`"
163
+ },
164
+ {
165
+ "kind": "method",
166
+ "name": "updateView",
167
+ "privacy": "private",
168
+ "parameters": [
169
+ {
170
+ "name": "name",
171
+ "type": {
172
+ "text": "string"
173
+ }
174
+ },
175
+ {
176
+ "name": "newValue",
177
+ "type": {
178
+ "text": "string"
179
+ }
180
+ }
181
+ ]
182
+ },
183
+ {
184
+ "kind": "method",
185
+ "name": "handleClick",
186
+ "privacy": "private"
187
+ },
188
+ {
189
+ "kind": "method",
190
+ "name": "configureAfterIcon",
191
+ "parameters": [
192
+ {
193
+ "name": "icon",
194
+ "type": {
195
+ "text": "HTMLElement"
196
+ }
197
+ }
198
+ ]
199
+ },
200
+ {
201
+ "kind": "field",
202
+ "name": "href"
203
+ },
204
+ {
205
+ "kind": "field",
206
+ "name": "$link",
207
+ "readonly": true
208
+ },
209
+ {
210
+ "kind": "field",
211
+ "name": "$button",
212
+ "readonly": true
213
+ },
214
+ {
215
+ "kind": "field",
216
+ "name": "$after",
217
+ "readonly": true
218
+ },
219
+ {
220
+ "kind": "field",
221
+ "name": "$arrowIcon",
222
+ "readonly": true
223
+ },
224
+ {
225
+ "kind": "field",
226
+ "name": "adoptedStyleSheets",
227
+ "type": {
228
+ "text": "array"
229
+ },
230
+ "default": "[stylesheet]"
231
+ }
232
+ ],
233
+ "attributes": [
234
+ {
235
+ "name": "href"
236
+ },
237
+ {
238
+ "name": "for"
239
+ }
240
+ ],
241
+ "superclass": {
242
+ "name": "HTMLElement"
243
+ },
244
+ "tagName": "px-mdd-section-item",
245
+ "customElement": true
246
+ }
247
+ ],
248
+ "exports": [
249
+ {
250
+ "kind": "js",
251
+ "name": "MddSectionItem",
252
+ "declaration": {
253
+ "name": "MddSectionItem",
254
+ "module": "src/MddSectionItem.ts"
255
+ }
256
+ },
257
+ {
258
+ "kind": "custom-element-definition",
259
+ "name": "px-mdd-section-item",
260
+ "declaration": {
261
+ "name": "MddSectionItem",
262
+ "module": "src/MddSectionItem.ts"
263
+ }
264
+ }
265
+ ]
266
+ },
267
+ {
268
+ "kind": "javascript-module",
269
+ "path": "src/MegaDropDown.ts",
270
+ "declarations": [
271
+ {
272
+ "kind": "class",
273
+ "description": "",
274
+ "name": "MegaDropDown",
275
+ "members": [
276
+ {
277
+ "kind": "field",
278
+ "name": "template",
279
+ "default": "`<dialog> <px-section> <px-container padding-inline=\"none\" padding-block=\"l\" padding-block--mobile=\"m\" padding-block--tablet=\"m\" background-color=\"none\" > <px-vstack> <px-hstack id=\"mobile-header\" gap=\"default\" align-items=\"center\"> <!-- Back button is only visible if the name is __lavender_mobile_menu --> <px-button id=\"back-button\" variant=\"tertiary\"> <px-icon name=\"chevron_left\" from=\"lavender\"></px-icon> ${this.backToMenuLabel || 'Back to menu'} </px-button> <px-spacer></px-spacer> <px-button-icon size=\"small\" variant=\"secondary\" id=\"mobile-close-button\" > <px-icon name=\"cross\" from=\"lavender\" aria-label=\"${this.closeButtonAriaLabel || 'Close'}\" title=\"${this.closeButtonAriaLabel || 'Close'}\"></px-icon> </px-button-icon> </px-hstack> <px-p variant=\"title-2xl\" color=\"neutral\" > <slot name=\"title\"></slot> </px-p> <px-button-icon size=\"small\" variant=\"secondary\" > <px-icon name=\"cross\" from=\"lavender\" aria-label=\"${this.closeButtonAriaLabel || 'Close'}\" title=\"${this.closeButtonAriaLabel || 'Close'}\"></px-icon> </px-button-icon> <px-stack direction--mobile=\"column\" direction--tablet=\"column\" direction=\"row\" gap=\"default\" gap--mobile=\"page-layout-between-sections\" gap--tablet=\"page-layout-between-sections\" wrap=\"wrap\" wrap--mobile=\"nowrap\" wrap--tablet=\"nowrap\" grow=\"1\" id=\"sections-container\" > <slot></slot> </px-stack> <px-mdd-closer></px-mdd-closer> </px-vstack> </px-container> <px-hstack id=\"footer\" justify-content=\"space-between\" align-items=\"center\" gap=\"s\" > <slot name=\"mdd-footer\"></slot> </px-hstack> </px-section> </dialog>`"
280
+ },
281
+ {
282
+ "kind": "field",
283
+ "name": "internals",
284
+ "type": {
285
+ "text": "ElementInternals"
286
+ }
287
+ },
288
+ {
289
+ "kind": "field",
290
+ "name": "#mutationObserver",
291
+ "privacy": "private",
292
+ "default": "new MutationObserver(() => { if (this.$slotMddFooter) { this.#$footer.style.display = 'block'; } })"
293
+ },
294
+ {
295
+ "kind": "field",
296
+ "name": "#footerResizeObserver",
297
+ "privacy": "private"
298
+ },
299
+ {
300
+ "kind": "field",
301
+ "name": "$dialog",
302
+ "readonly": true
303
+ },
304
+ {
305
+ "kind": "field",
306
+ "name": "hidden"
307
+ },
308
+ {
309
+ "kind": "field",
310
+ "name": "name"
311
+ },
312
+ {
313
+ "kind": "field",
314
+ "name": "closeButtonAriaLabel"
315
+ },
316
+ {
317
+ "kind": "field",
318
+ "name": "backToMenuLabel"
319
+ },
320
+ {
321
+ "kind": "field",
322
+ "name": "$slotMddFooter",
323
+ "readonly": true
324
+ },
325
+ {
326
+ "kind": "field",
327
+ "name": "#$backButton",
328
+ "privacy": "private",
329
+ "readonly": true
330
+ },
331
+ {
332
+ "kind": "field",
333
+ "name": "#$title",
334
+ "privacy": "private",
335
+ "readonly": true
336
+ },
337
+ {
338
+ "kind": "field",
339
+ "name": "#$footer",
340
+ "privacy": "private",
341
+ "readonly": true
342
+ },
343
+ {
344
+ "kind": "field",
345
+ "name": "#$closeButtons",
346
+ "privacy": "private",
347
+ "readonly": true
348
+ },
349
+ {
350
+ "kind": "field",
351
+ "name": "dialogOffsetTop"
352
+ },
353
+ {
354
+ "kind": "field",
355
+ "name": "adoptedStyleSheets",
356
+ "type": {
357
+ "text": "array"
358
+ },
359
+ "default": "[stylesheet]"
360
+ }
361
+ ],
362
+ "events": [
363
+ {
364
+ "name": "close-panel",
365
+ "type": {
366
+ "text": "CustomEvent"
367
+ }
368
+ },
369
+ {
370
+ "name": "close-panel-from-dialog",
371
+ "type": {
372
+ "text": "CustomEvent"
373
+ }
374
+ }
375
+ ],
376
+ "attributes": [
377
+ {
378
+ "name": "hidden"
379
+ },
380
+ {
381
+ "name": "name"
382
+ },
383
+ {
384
+ "name": "close-button-aria-label"
385
+ },
386
+ {
387
+ "name": "back-to-menu-label"
388
+ }
389
+ ],
390
+ "superclass": {
391
+ "name": "HTMLElement"
392
+ },
393
+ "tagName": "px-mdd",
394
+ "customElement": true
395
+ }
396
+ ],
397
+ "exports": [
398
+ {
399
+ "kind": "js",
400
+ "name": "MegaDropDown",
401
+ "declaration": {
402
+ "name": "MegaDropDown",
403
+ "module": "src/MegaDropDown.ts"
404
+ }
405
+ },
406
+ {
407
+ "kind": "custom-element-definition",
408
+ "name": "px-mdd",
409
+ "declaration": {
410
+ "name": "MegaDropDown",
411
+ "module": "src/MegaDropDown.ts"
412
+ }
413
+ }
414
+ ]
415
+ },
416
+ {
417
+ "kind": "javascript-module",
418
+ "path": "src/index.ts",
419
+ "declarations": [],
420
+ "exports": [
421
+ {
422
+ "kind": "js",
423
+ "name": "*",
424
+ "declaration": {
425
+ "name": "*",
426
+ "module": "src/MegaDropDown"
427
+ }
428
+ },
429
+ {
430
+ "kind": "js",
431
+ "name": "*",
432
+ "declaration": {
433
+ "name": "*",
434
+ "module": "src/MddSection"
435
+ }
436
+ },
437
+ {
438
+ "kind": "js",
439
+ "name": "*",
440
+ "declaration": {
441
+ "name": "*",
442
+ "module": "src/MddSectionItem"
443
+ }
444
+ }
445
+ ]
446
+ },
447
+ {
448
+ "kind": "javascript-module",
449
+ "path": "src/mdd-section-item.css",
450
+ "declarations": [],
451
+ "exports": []
452
+ },
453
+ {
454
+ "kind": "javascript-module",
455
+ "path": "src/mdd-section.css",
456
+ "declarations": [],
457
+ "exports": []
458
+ },
459
+ {
460
+ "kind": "javascript-module",
461
+ "path": "src/mega-drop-down.css",
462
+ "declarations": [],
463
+ "exports": []
464
+ }
465
+ ]
466
+ }