@m3e/menu 1.1.11 → 1.2.1
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/README.md +138 -83
- package/dist/css-custom-data.json +282 -12
- package/dist/custom-elements.json +307 -12
- package/dist/html-custom-data.json +9 -4
- package/dist/index.js +129 -17
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +7 -7
- package/dist/index.min.js.map +1 -1
- package/dist/src/MenuElement.d.ts +12 -0
- package/dist/src/MenuElement.d.ts.map +1 -1
- package/dist/src/MenuItemCheckboxElement.d.ts +19 -2
- package/dist/src/MenuItemCheckboxElement.d.ts.map +1 -1
- package/dist/src/MenuItemElement.d.ts +18 -2
- package/dist/src/MenuItemElement.d.ts.map +1 -1
- package/dist/src/MenuItemElementBase.d.ts.map +1 -1
- package/dist/src/MenuItemRadioElement.d.ts +19 -2
- package/dist/src/MenuItemRadioElement.d.ts.map +1 -1
- package/dist/src/MenuVariant.d.ts +3 -0
- package/dist/src/MenuVariant.d.ts.map +1 -0
- package/dist/src/index.d.ts +1 -0
- package/dist/src/index.d.ts.map +1 -1
- package/package.json +2 -2
|
@@ -7,6 +7,11 @@
|
|
|
7
7
|
"description": "Controls the corner radius of the menu container.",
|
|
8
8
|
"values": []
|
|
9
9
|
},
|
|
10
|
+
{
|
|
11
|
+
"name": "--m3e-menu-active-container-shape",
|
|
12
|
+
"description": "Controls the corner radius of the menu container when active.",
|
|
13
|
+
"values": []
|
|
14
|
+
},
|
|
10
15
|
{
|
|
11
16
|
"name": "--m3e-menu-container-min-width",
|
|
12
17
|
"description": "Minimum width of the menu container.",
|
|
@@ -27,6 +32,11 @@
|
|
|
27
32
|
"description": "Vertical padding inside the menu container.",
|
|
28
33
|
"values": []
|
|
29
34
|
},
|
|
35
|
+
{
|
|
36
|
+
"name": "--m3e-menu-container-padding-inline",
|
|
37
|
+
"description": "Horizontal padding inside the menu container.",
|
|
38
|
+
"values": []
|
|
39
|
+
},
|
|
30
40
|
{
|
|
31
41
|
"name": "--m3e-menu-container-color",
|
|
32
42
|
"description": "Background color of the menu container.",
|
|
@@ -37,11 +47,21 @@
|
|
|
37
47
|
"description": "Box shadow elevation of the menu container.",
|
|
38
48
|
"values": []
|
|
39
49
|
},
|
|
50
|
+
{
|
|
51
|
+
"name": "--m3e-vibrant-menu-container-color",
|
|
52
|
+
"description": "Background color of the menu container for vibrant variant.",
|
|
53
|
+
"values": []
|
|
54
|
+
},
|
|
40
55
|
{
|
|
41
56
|
"name": "--m3e-menu-divider-spacing",
|
|
42
57
|
"description": "Vertical spacing around slotted `m3e-divider` elements.",
|
|
43
58
|
"values": []
|
|
44
59
|
},
|
|
60
|
+
{
|
|
61
|
+
"name": "--m3e-menu-gap",
|
|
62
|
+
"description": "Gap between content in the menu.",
|
|
63
|
+
"values": []
|
|
64
|
+
},
|
|
45
65
|
{
|
|
46
66
|
"name": "--m3e-menu-item-container-height",
|
|
47
67
|
"description": "Height of the menu item container.",
|
|
@@ -68,13 +88,13 @@
|
|
|
68
88
|
"values": []
|
|
69
89
|
},
|
|
70
90
|
{
|
|
71
|
-
"name": "--m3e-menu-selected-color",
|
|
72
|
-
"description": "Text color for selected
|
|
91
|
+
"name": "--m3e-menu-item-selected-color",
|
|
92
|
+
"description": "Text color for selected items.",
|
|
73
93
|
"values": []
|
|
74
94
|
},
|
|
75
95
|
{
|
|
76
|
-
"name": "--m3e-menu-selected-container-color",
|
|
77
|
-
"description": "Background color for selected
|
|
96
|
+
"name": "--m3e-menu-item-selected-container-color",
|
|
97
|
+
"description": "Background color for selected items.",
|
|
78
98
|
"values": []
|
|
79
99
|
},
|
|
80
100
|
{
|
|
@@ -92,6 +112,16 @@
|
|
|
92
112
|
"description": "Ripple color for selected items.",
|
|
93
113
|
"values": []
|
|
94
114
|
},
|
|
115
|
+
{
|
|
116
|
+
"name": "--m3e-menu-item-active-state-layer-color",
|
|
117
|
+
"description": "State layer color for expanded items.",
|
|
118
|
+
"values": []
|
|
119
|
+
},
|
|
120
|
+
{
|
|
121
|
+
"name": "--m3e-menu-item-active-state-layer-opacity",
|
|
122
|
+
"description": "State layer opacity for expanded items.",
|
|
123
|
+
"values": []
|
|
124
|
+
},
|
|
95
125
|
{
|
|
96
126
|
"name": "--m3e-menu-item-disabled-color",
|
|
97
127
|
"description": "Base color for disabled items.",
|
|
@@ -102,6 +132,61 @@
|
|
|
102
132
|
"description": "Opacity percentage for disabled item color mix.",
|
|
103
133
|
"values": []
|
|
104
134
|
},
|
|
135
|
+
{
|
|
136
|
+
"name": "--m3e-vibrant-menu-item-color",
|
|
137
|
+
"description": "Text color for unselected, enabled menu items for vibrant variant.",
|
|
138
|
+
"values": []
|
|
139
|
+
},
|
|
140
|
+
{
|
|
141
|
+
"name": "--m3e-vibrant-menu-item-container-hover-color",
|
|
142
|
+
"description": "State layer hover color for unselected items for vibrant variant.",
|
|
143
|
+
"values": []
|
|
144
|
+
},
|
|
145
|
+
{
|
|
146
|
+
"name": "--m3e-vibrant-menu-item-container-focus-color",
|
|
147
|
+
"description": "State layer focus color for unselected items for vibrant variant.",
|
|
148
|
+
"values": []
|
|
149
|
+
},
|
|
150
|
+
{
|
|
151
|
+
"name": "--m3e-vibrant-menu-item-ripple-color",
|
|
152
|
+
"description": "Ripple color for unselected items for vibrant variant.",
|
|
153
|
+
"values": []
|
|
154
|
+
},
|
|
155
|
+
{
|
|
156
|
+
"name": "--m3e-vibrant-menu-item-selected-color",
|
|
157
|
+
"description": "Text color for selected items for vibrant variant.",
|
|
158
|
+
"values": []
|
|
159
|
+
},
|
|
160
|
+
{
|
|
161
|
+
"name": "--m3e-vibrant-menu-item-selected-container-color",
|
|
162
|
+
"description": "Background color for selected items for vibrant variant.",
|
|
163
|
+
"values": []
|
|
164
|
+
},
|
|
165
|
+
{
|
|
166
|
+
"name": "--m3e-vibrant-menu-item-selected-container-hover-color",
|
|
167
|
+
"description": "State layer hover color for selected items for vibrant variant.",
|
|
168
|
+
"values": []
|
|
169
|
+
},
|
|
170
|
+
{
|
|
171
|
+
"name": "--m3e-vibrant-menu-item-selected-container-focus-color",
|
|
172
|
+
"description": "State layer focus color for selected items for vibrant variant.",
|
|
173
|
+
"values": []
|
|
174
|
+
},
|
|
175
|
+
{
|
|
176
|
+
"name": "--m3e-vibrant-menu-item-selected-ripple-color",
|
|
177
|
+
"description": "Ripple color for selected items for vibrant variant.",
|
|
178
|
+
"values": []
|
|
179
|
+
},
|
|
180
|
+
{
|
|
181
|
+
"name": "--m3e-vibrant-menu-item-active-state-layer-color",
|
|
182
|
+
"description": "State layer color for expanded items for vibrant variant.",
|
|
183
|
+
"values": []
|
|
184
|
+
},
|
|
185
|
+
{
|
|
186
|
+
"name": "--m3e-vibrant-menu-item-disabled-color",
|
|
187
|
+
"description": "Base color for disabled items for vibrant variant",
|
|
188
|
+
"values": []
|
|
189
|
+
},
|
|
105
190
|
{
|
|
106
191
|
"name": "--m3e-menu-item-icon-label-space",
|
|
107
192
|
"description": "Horizontal gap between icon and content.",
|
|
@@ -147,6 +232,26 @@
|
|
|
147
232
|
"description": "Font size for leading and trailing icons.",
|
|
148
233
|
"values": []
|
|
149
234
|
},
|
|
235
|
+
{
|
|
236
|
+
"name": "--m3e-menu-item-shape",
|
|
237
|
+
"description": "Base shape of the menu item.",
|
|
238
|
+
"values": []
|
|
239
|
+
},
|
|
240
|
+
{
|
|
241
|
+
"name": "--m3e-menu-item-selected-shape",
|
|
242
|
+
"description": "Shape used for a selected menu item.",
|
|
243
|
+
"values": []
|
|
244
|
+
},
|
|
245
|
+
{
|
|
246
|
+
"name": "--m3e-menu-item-first-child-shape",
|
|
247
|
+
"description": "Shape for the first menu item in a menu.",
|
|
248
|
+
"values": []
|
|
249
|
+
},
|
|
250
|
+
{
|
|
251
|
+
"name": "--m3e-menu-item-last-child-shape",
|
|
252
|
+
"description": "Shape for the last menu item in a menu.",
|
|
253
|
+
"values": []
|
|
254
|
+
},
|
|
150
255
|
{
|
|
151
256
|
"name": "--m3e-menu-item-container-height",
|
|
152
257
|
"description": "Height of the menu item container.",
|
|
@@ -173,13 +278,13 @@
|
|
|
173
278
|
"values": []
|
|
174
279
|
},
|
|
175
280
|
{
|
|
176
|
-
"name": "--m3e-menu-selected-color",
|
|
177
|
-
"description": "Text color for selected
|
|
281
|
+
"name": "--m3e-menu-item-selected-color",
|
|
282
|
+
"description": "Text color for selected items.",
|
|
178
283
|
"values": []
|
|
179
284
|
},
|
|
180
285
|
{
|
|
181
|
-
"name": "--m3e-menu-selected-container-color",
|
|
182
|
-
"description": "Background color for selected
|
|
286
|
+
"name": "--m3e-menu-item-selected-container-color",
|
|
287
|
+
"description": "Background color for selected items.",
|
|
183
288
|
"values": []
|
|
184
289
|
},
|
|
185
290
|
{
|
|
@@ -197,6 +302,16 @@
|
|
|
197
302
|
"description": "Ripple color for selected items.",
|
|
198
303
|
"values": []
|
|
199
304
|
},
|
|
305
|
+
{
|
|
306
|
+
"name": "--m3e-menu-item-active-state-layer-color",
|
|
307
|
+
"description": "State layer color for expanded items.",
|
|
308
|
+
"values": []
|
|
309
|
+
},
|
|
310
|
+
{
|
|
311
|
+
"name": "--m3e-menu-item-active-state-layer-opacity",
|
|
312
|
+
"description": "State layer opacity for expanded items.",
|
|
313
|
+
"values": []
|
|
314
|
+
},
|
|
200
315
|
{
|
|
201
316
|
"name": "--m3e-menu-item-disabled-color",
|
|
202
317
|
"description": "Base color for disabled items.",
|
|
@@ -207,6 +322,61 @@
|
|
|
207
322
|
"description": "Opacity percentage for disabled item color mix.",
|
|
208
323
|
"values": []
|
|
209
324
|
},
|
|
325
|
+
{
|
|
326
|
+
"name": "--m3e-vibrant-menu-item-color",
|
|
327
|
+
"description": "Text color for unselected, enabled menu items for vibrant variant.",
|
|
328
|
+
"values": []
|
|
329
|
+
},
|
|
330
|
+
{
|
|
331
|
+
"name": "--m3e-vibrant-menu-item-container-hover-color",
|
|
332
|
+
"description": "State layer hover color for unselected items for vibrant variant.",
|
|
333
|
+
"values": []
|
|
334
|
+
},
|
|
335
|
+
{
|
|
336
|
+
"name": "--m3e-vibrant-menu-item-container-focus-color",
|
|
337
|
+
"description": "State layer focus color for unselected items for vibrant variant.",
|
|
338
|
+
"values": []
|
|
339
|
+
},
|
|
340
|
+
{
|
|
341
|
+
"name": "--m3e-vibrant-menu-item-ripple-color",
|
|
342
|
+
"description": "Ripple color for unselected items for vibrant variant.",
|
|
343
|
+
"values": []
|
|
344
|
+
},
|
|
345
|
+
{
|
|
346
|
+
"name": "--m3e-vibrant-menu-item-selected-color",
|
|
347
|
+
"description": "Text color for selected items for vibrant variant.",
|
|
348
|
+
"values": []
|
|
349
|
+
},
|
|
350
|
+
{
|
|
351
|
+
"name": "--m3e-vibrant-menu-item-selected-container-color",
|
|
352
|
+
"description": "Background color for selected items for vibrant variant.",
|
|
353
|
+
"values": []
|
|
354
|
+
},
|
|
355
|
+
{
|
|
356
|
+
"name": "--m3e-vibrant-menu-item-selected-container-hover-color",
|
|
357
|
+
"description": "State layer hover color for selected items for vibrant variant.",
|
|
358
|
+
"values": []
|
|
359
|
+
},
|
|
360
|
+
{
|
|
361
|
+
"name": "--m3e-vibrant-menu-item-selected-container-focus-color",
|
|
362
|
+
"description": "State layer focus color for selected items for vibrant variant.",
|
|
363
|
+
"values": []
|
|
364
|
+
},
|
|
365
|
+
{
|
|
366
|
+
"name": "--m3e-vibrant-menu-item-selected-ripple-color",
|
|
367
|
+
"description": "Ripple color for selected items for vibrant variant.",
|
|
368
|
+
"values": []
|
|
369
|
+
},
|
|
370
|
+
{
|
|
371
|
+
"name": "--m3e-vibrant-menu-item-active-state-layer-color",
|
|
372
|
+
"description": "State layer color for expanded items for vibrant variant.",
|
|
373
|
+
"values": []
|
|
374
|
+
},
|
|
375
|
+
{
|
|
376
|
+
"name": "--m3e-vibrant-menu-item-disabled-color",
|
|
377
|
+
"description": "Base color for disabled items for vibrant variant.",
|
|
378
|
+
"values": []
|
|
379
|
+
},
|
|
210
380
|
{
|
|
211
381
|
"name": "--m3e-menu-item-icon-label-space",
|
|
212
382
|
"description": "Horizontal gap between icon and content.",
|
|
@@ -252,6 +422,21 @@
|
|
|
252
422
|
"description": "Font size for leading and trailing icons.",
|
|
253
423
|
"values": []
|
|
254
424
|
},
|
|
425
|
+
{
|
|
426
|
+
"name": "--m3e-menu-item-shape",
|
|
427
|
+
"description": "Base shape of the menu item.",
|
|
428
|
+
"values": []
|
|
429
|
+
},
|
|
430
|
+
{
|
|
431
|
+
"name": "--m3e-menu-item-first-child-shape",
|
|
432
|
+
"description": "Shape for the first menu item in a menu.",
|
|
433
|
+
"values": []
|
|
434
|
+
},
|
|
435
|
+
{
|
|
436
|
+
"name": "--m3e-menu-item-last-child-shape",
|
|
437
|
+
"description": "Shape for the last menu item in a menu.",
|
|
438
|
+
"values": []
|
|
439
|
+
},
|
|
255
440
|
{
|
|
256
441
|
"name": "--m3e-menu-item-container-height",
|
|
257
442
|
"description": "Height of the menu item container.",
|
|
@@ -278,13 +463,13 @@
|
|
|
278
463
|
"values": []
|
|
279
464
|
},
|
|
280
465
|
{
|
|
281
|
-
"name": "--m3e-menu-selected-color",
|
|
282
|
-
"description": "Text color for selected
|
|
466
|
+
"name": "--m3e-menu-item-selected-color",
|
|
467
|
+
"description": "Text color for selected items.",
|
|
283
468
|
"values": []
|
|
284
469
|
},
|
|
285
470
|
{
|
|
286
|
-
"name": "--m3e-menu-selected-container-color",
|
|
287
|
-
"description": "Background color for selected
|
|
471
|
+
"name": "--m3e-menu-item-selected-container-color",
|
|
472
|
+
"description": "Background color for selected items.",
|
|
288
473
|
"values": []
|
|
289
474
|
},
|
|
290
475
|
{
|
|
@@ -302,6 +487,16 @@
|
|
|
302
487
|
"description": "Ripple color for selected items.",
|
|
303
488
|
"values": []
|
|
304
489
|
},
|
|
490
|
+
{
|
|
491
|
+
"name": "--m3e-menu-item-active-state-layer-color",
|
|
492
|
+
"description": "State layer color for expanded items.",
|
|
493
|
+
"values": []
|
|
494
|
+
},
|
|
495
|
+
{
|
|
496
|
+
"name": "--m3e-menu-item-active-state-layer-opacity",
|
|
497
|
+
"description": "State layer opacity for expanded items.",
|
|
498
|
+
"values": []
|
|
499
|
+
},
|
|
305
500
|
{
|
|
306
501
|
"name": "--m3e-menu-item-disabled-color",
|
|
307
502
|
"description": "Base color for disabled items.",
|
|
@@ -312,6 +507,61 @@
|
|
|
312
507
|
"description": "Opacity percentage for disabled item color mix.",
|
|
313
508
|
"values": []
|
|
314
509
|
},
|
|
510
|
+
{
|
|
511
|
+
"name": "--m3e-vibrant-menu-item-color",
|
|
512
|
+
"description": "Text color for unselected, enabled menu items for vibrant variant.",
|
|
513
|
+
"values": []
|
|
514
|
+
},
|
|
515
|
+
{
|
|
516
|
+
"name": "--m3e-vibrant-menu-item-container-hover-color",
|
|
517
|
+
"description": "State layer hover color for unselected items for vibrant variant.",
|
|
518
|
+
"values": []
|
|
519
|
+
},
|
|
520
|
+
{
|
|
521
|
+
"name": "--m3e-vibrant-menu-item-container-focus-color",
|
|
522
|
+
"description": "State layer focus color for unselected items for vibrant variant.",
|
|
523
|
+
"values": []
|
|
524
|
+
},
|
|
525
|
+
{
|
|
526
|
+
"name": "--m3e-vibrant-menu-item-ripple-color",
|
|
527
|
+
"description": "Ripple color for unselected items for vibrant variant.",
|
|
528
|
+
"values": []
|
|
529
|
+
},
|
|
530
|
+
{
|
|
531
|
+
"name": "--m3e-vibrant-menu-item-selected-color",
|
|
532
|
+
"description": "Text color for selected items for vibrant variant.",
|
|
533
|
+
"values": []
|
|
534
|
+
},
|
|
535
|
+
{
|
|
536
|
+
"name": "--m3e-vibrant-menu-item-selected-container-color",
|
|
537
|
+
"description": "Background color for selected items for vibrant variant.",
|
|
538
|
+
"values": []
|
|
539
|
+
},
|
|
540
|
+
{
|
|
541
|
+
"name": "--m3e-vibrant-menu-item-selected-container-hover-color",
|
|
542
|
+
"description": "State layer hover color for selected items for vibrant variant.",
|
|
543
|
+
"values": []
|
|
544
|
+
},
|
|
545
|
+
{
|
|
546
|
+
"name": "--m3e-vibrant-menu-item-selected-container-focus-color",
|
|
547
|
+
"description": "State layer focus color for selected items for vibrant variant.",
|
|
548
|
+
"values": []
|
|
549
|
+
},
|
|
550
|
+
{
|
|
551
|
+
"name": "--m3e-vibrant-menu-item-selected-ripple-color",
|
|
552
|
+
"description": "Ripple color for selected items for vibrant variant.",
|
|
553
|
+
"values": []
|
|
554
|
+
},
|
|
555
|
+
{
|
|
556
|
+
"name": "--m3e-vibrant-menu-item-active-state-layer-color",
|
|
557
|
+
"description": "State layer color for expanded items for vibrant variant.",
|
|
558
|
+
"values": []
|
|
559
|
+
},
|
|
560
|
+
{
|
|
561
|
+
"name": "--m3e-vibrant-menu-item-disabled-color",
|
|
562
|
+
"description": "Base color for disabled items for vibrant variant",
|
|
563
|
+
"values": []
|
|
564
|
+
},
|
|
315
565
|
{
|
|
316
566
|
"name": "--m3e-menu-item-icon-label-space",
|
|
317
567
|
"description": "Horizontal gap between icon and content.",
|
|
@@ -356,6 +606,26 @@
|
|
|
356
606
|
"name": "--m3e-menu-item-icon-size",
|
|
357
607
|
"description": "Font size for leading and trailing icons.",
|
|
358
608
|
"values": []
|
|
609
|
+
},
|
|
610
|
+
{
|
|
611
|
+
"name": "--m3e-menu-item-shape",
|
|
612
|
+
"description": "Base shape of the menu item.",
|
|
613
|
+
"values": []
|
|
614
|
+
},
|
|
615
|
+
{
|
|
616
|
+
"name": "--m3e-menu-item-selected-shape",
|
|
617
|
+
"description": "Shape used for a selected menu item.",
|
|
618
|
+
"values": []
|
|
619
|
+
},
|
|
620
|
+
{
|
|
621
|
+
"name": "--m3e-menu-item-first-child-shape",
|
|
622
|
+
"description": "Shape for the first menu item in a menu.",
|
|
623
|
+
"values": []
|
|
624
|
+
},
|
|
625
|
+
{
|
|
626
|
+
"name": "--m3e-menu-item-last-child-shape",
|
|
627
|
+
"description": "Shape for the last menu item in a menu.",
|
|
628
|
+
"values": []
|
|
359
629
|
}
|
|
360
630
|
],
|
|
361
631
|
"pseudoElements": []
|