@m3e/card 1.0.0-rc.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/LICENSE +22 -0
- package/README.md +268 -0
- package/cem.config.mjs +16 -0
- package/demo/index.html +126 -0
- package/dist/css-custom-data.json +367 -0
- package/dist/custom-elements.json +629 -0
- package/dist/html-custom-data.json +33 -0
- package/dist/index.js +689 -0
- package/dist/index.js.map +1 -0
- package/dist/index.min.js +272 -0
- package/dist/index.min.js.map +1 -0
- package/dist/src/CardElement.d.ts +168 -0
- package/dist/src/CardElement.d.ts.map +1 -0
- package/dist/src/CardOrientation.d.ts +3 -0
- package/dist/src/CardOrientation.d.ts.map +1 -0
- package/dist/src/CardVariant.d.ts +3 -0
- package/dist/src/CardVariant.d.ts.map +1 -0
- package/dist/src/index.d.ts +4 -0
- package/dist/src/index.d.ts.map +1 -0
- package/dist/src/styles/CardStyle.d.ts +7 -0
- package/dist/src/styles/CardStyle.d.ts.map +1 -0
- package/dist/src/styles/CardToken.d.ts +9 -0
- package/dist/src/styles/CardToken.d.ts.map +1 -0
- package/dist/src/styles/CardVariantStyle.d.ts +7 -0
- package/dist/src/styles/CardVariantStyle.d.ts.map +1 -0
- package/dist/src/styles/CardVariantToken.d.ts +50 -0
- package/dist/src/styles/CardVariantToken.d.ts.map +1 -0
- package/dist/src/styles/index.d.ts +3 -0
- package/dist/src/styles/index.d.ts.map +1 -0
- package/eslint.config.mjs +13 -0
- package/package.json +48 -0
- package/rollup.config.js +32 -0
- package/src/CardElement.ts +258 -0
- package/src/CardOrientation.ts +2 -0
- package/src/CardVariant.ts +2 -0
- package/src/index.ts +3 -0
- package/src/styles/CardStyle.ts +163 -0
- package/src/styles/CardToken.ts +12 -0
- package/src/styles/CardVariantStyle.ts +99 -0
- package/src/styles/CardVariantToken.ts +205 -0
- package/src/styles/index.ts +2 -0
- package/tsconfig.json +9 -0
|
@@ -0,0 +1,629 @@
|
|
|
1
|
+
{
|
|
2
|
+
"schemaVersion": "1.0.0",
|
|
3
|
+
"readme": "",
|
|
4
|
+
"modules": [
|
|
5
|
+
{
|
|
6
|
+
"kind": "javascript-module",
|
|
7
|
+
"path": "src/CardElement.ts",
|
|
8
|
+
"declarations": [
|
|
9
|
+
{
|
|
10
|
+
"kind": "class",
|
|
11
|
+
"description": "",
|
|
12
|
+
"name": "M3eCardElement",
|
|
13
|
+
"cssProperties": [
|
|
14
|
+
{
|
|
15
|
+
"description": "Internal spacing for all slotted regions",
|
|
16
|
+
"name": "--m3e-card-padding"
|
|
17
|
+
},
|
|
18
|
+
{
|
|
19
|
+
"description": "Corner radius of the card container.",
|
|
20
|
+
"name": "--m3e-card-shape"
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"description": "Foreground color for text content in filled cards.",
|
|
24
|
+
"name": "--m3e-filled-card-text-color"
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
"description": "Background color of the filled card container.",
|
|
28
|
+
"name": "--m3e-filled-card-container-color"
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
"description": "Elevation level for filled card container.",
|
|
32
|
+
"name": "--m3e-filled-card-container-elevation"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"description": "Text color when filled card is disabled.",
|
|
36
|
+
"name": "--m3e-filled-card-disabled-text-color"
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
"description": "Opacity applied to text when disabled.",
|
|
40
|
+
"name": "--m3e-filled-card-disabled-text-opacity"
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
"description": "Background color when disabled.",
|
|
44
|
+
"name": "--m3e-filled-card-disabled-container-color"
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
"description": "Elevation level when disabled.",
|
|
48
|
+
"name": "--m3e-filled-card-disabled-container-elevation"
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
"description": "Shadow color when disabled.",
|
|
52
|
+
"name": "--m3e-filled-card-disabled-container-elevation-color"
|
|
53
|
+
},
|
|
54
|
+
{
|
|
55
|
+
"description": "Shadow opacity when disabled.",
|
|
56
|
+
"name": "--m3e-filled-card-disabled-container-elevation-opacity"
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
"description": "Overall container opacity when disabled.",
|
|
60
|
+
"name": "--m3e-filled-card-disabled-container-opacity"
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
"description": "Text color on hover.",
|
|
64
|
+
"name": "--m3e-filled-card-hover-text-color"
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
"description": "State layer color on hover.",
|
|
68
|
+
"name": "--m3e-filled-card-hover-state-layer-color"
|
|
69
|
+
},
|
|
70
|
+
{
|
|
71
|
+
"description": "State layer opacity on hover.",
|
|
72
|
+
"name": "--m3e-filled-card-hover-state-layer-opacity"
|
|
73
|
+
},
|
|
74
|
+
{
|
|
75
|
+
"description": "Elevation level on hover.",
|
|
76
|
+
"name": "--m3e-filled-card-hover-container-elevation"
|
|
77
|
+
},
|
|
78
|
+
{
|
|
79
|
+
"description": "Text color on focus.",
|
|
80
|
+
"name": "--m3e-filled-card-focus-text-color"
|
|
81
|
+
},
|
|
82
|
+
{
|
|
83
|
+
"description": "State layer color on focus.",
|
|
84
|
+
"name": "--m3e-filled-card-focus-state-layer-color"
|
|
85
|
+
},
|
|
86
|
+
{
|
|
87
|
+
"description": "State layer opacity on focus.",
|
|
88
|
+
"name": "--m3e-filled-card-focus-state-layer-opacity"
|
|
89
|
+
},
|
|
90
|
+
{
|
|
91
|
+
"description": "Elevation level on focus.",
|
|
92
|
+
"name": "--m3e-filled-card-focus-container-elevation"
|
|
93
|
+
},
|
|
94
|
+
{
|
|
95
|
+
"description": "Text color on press.",
|
|
96
|
+
"name": "--m3e-filled-card-pressed-text-color"
|
|
97
|
+
},
|
|
98
|
+
{
|
|
99
|
+
"description": "State layer color on press.",
|
|
100
|
+
"name": "--m3e-filled-card-pressed-state-layer-color"
|
|
101
|
+
},
|
|
102
|
+
{
|
|
103
|
+
"description": "State layer opacity on press.",
|
|
104
|
+
"name": "--m3e-filled-card-pressed-state-layer-opacity"
|
|
105
|
+
},
|
|
106
|
+
{
|
|
107
|
+
"description": "Elevation level on press.",
|
|
108
|
+
"name": "--m3e-filled-card-pressed-container-elevation"
|
|
109
|
+
},
|
|
110
|
+
{
|
|
111
|
+
"description": "Foreground color for text content in elevated cards.",
|
|
112
|
+
"name": "--m3e-elevated-card-text-color"
|
|
113
|
+
},
|
|
114
|
+
{
|
|
115
|
+
"description": "Background color of the elevated card container.",
|
|
116
|
+
"name": "--m3e-elevated-card-container-color"
|
|
117
|
+
},
|
|
118
|
+
{
|
|
119
|
+
"description": "Elevation level for elevated card container.",
|
|
120
|
+
"name": "--m3e-elevated-card-container-elevation"
|
|
121
|
+
},
|
|
122
|
+
{
|
|
123
|
+
"description": "Text color when elevated card is disabled.",
|
|
124
|
+
"name": "--m3e-elevated-card-disabled-text-color"
|
|
125
|
+
},
|
|
126
|
+
{
|
|
127
|
+
"description": "Opacity applied to text when disabled.",
|
|
128
|
+
"name": "--m3e-elevated-card-disabled-text-opacity"
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
"description": "Background color when disabled.",
|
|
132
|
+
"name": "--m3e-elevated-card-disabled-container-color"
|
|
133
|
+
},
|
|
134
|
+
{
|
|
135
|
+
"description": "Elevation level when disabled.",
|
|
136
|
+
"name": "--m3e-elevated-card-disabled-container-elevation"
|
|
137
|
+
},
|
|
138
|
+
{
|
|
139
|
+
"description": "Shadow color when disabled.",
|
|
140
|
+
"name": "--m3e-elevated-card-disabled-container-elevation-color"
|
|
141
|
+
},
|
|
142
|
+
{
|
|
143
|
+
"description": "Shadow opacity when disabled.",
|
|
144
|
+
"name": "--m3e-elevated-card-disabled-container-elevation-opacity"
|
|
145
|
+
},
|
|
146
|
+
{
|
|
147
|
+
"description": "Overall container opacity when disabled.",
|
|
148
|
+
"name": "--m3e-elevated-card-disabled-container-opacity"
|
|
149
|
+
},
|
|
150
|
+
{
|
|
151
|
+
"description": "Text color on hover.",
|
|
152
|
+
"name": "--m3e-elevated-card-hover-text-color"
|
|
153
|
+
},
|
|
154
|
+
{
|
|
155
|
+
"description": "State layer color on hover.",
|
|
156
|
+
"name": "--m3e-elevated-card-hover-state-layer-color"
|
|
157
|
+
},
|
|
158
|
+
{
|
|
159
|
+
"description": "State layer opacity on hover.",
|
|
160
|
+
"name": "--m3e-elevated-card-hover-state-layer-opacity"
|
|
161
|
+
},
|
|
162
|
+
{
|
|
163
|
+
"description": "Elevation level on hover.",
|
|
164
|
+
"name": "--m3e-elevated-card-hover-container-elevation"
|
|
165
|
+
},
|
|
166
|
+
{
|
|
167
|
+
"description": "Text color on focus.",
|
|
168
|
+
"name": "--m3e-elevated-card-focus-text-color"
|
|
169
|
+
},
|
|
170
|
+
{
|
|
171
|
+
"description": "State layer color on focus.",
|
|
172
|
+
"name": "--m3e-elevated-card-focus-state-layer-color"
|
|
173
|
+
},
|
|
174
|
+
{
|
|
175
|
+
"description": "State layer opacity on focus.",
|
|
176
|
+
"name": "--m3e-elevated-card-focus-state-layer-opacity"
|
|
177
|
+
},
|
|
178
|
+
{
|
|
179
|
+
"description": "Elevation level on focus.",
|
|
180
|
+
"name": "--m3e-elevated-card-focus-container-elevation"
|
|
181
|
+
},
|
|
182
|
+
{
|
|
183
|
+
"description": "Text color on press.",
|
|
184
|
+
"name": "--m3e-elevated-card-pressed-text-color"
|
|
185
|
+
},
|
|
186
|
+
{
|
|
187
|
+
"description": "State layer color on press.",
|
|
188
|
+
"name": "--m3e-elevated-card-pressed-state-layer-color"
|
|
189
|
+
},
|
|
190
|
+
{
|
|
191
|
+
"description": "State layer opacity on press.",
|
|
192
|
+
"name": "--m3e-elevated-card-pressed-state-layer-opacity"
|
|
193
|
+
},
|
|
194
|
+
{
|
|
195
|
+
"description": "Elevation level on press.",
|
|
196
|
+
"name": "--m3e-elevated-card-pressed-container-elevation"
|
|
197
|
+
},
|
|
198
|
+
{
|
|
199
|
+
"description": "Foreground color for text content in outlined cards.",
|
|
200
|
+
"name": "--m3e-outlined-card-text-color"
|
|
201
|
+
},
|
|
202
|
+
{
|
|
203
|
+
"description": "Elevation level for outlined card container.",
|
|
204
|
+
"name": "--m3e-outlined-card-container-elevation"
|
|
205
|
+
},
|
|
206
|
+
{
|
|
207
|
+
"description": "Border color for outlined cards.",
|
|
208
|
+
"name": "--m3e-outlined-card-outline-color"
|
|
209
|
+
},
|
|
210
|
+
{
|
|
211
|
+
"description": "Border thickness for outlined cards.",
|
|
212
|
+
"name": "--m3e-outlined-card-outline-thickness"
|
|
213
|
+
},
|
|
214
|
+
{
|
|
215
|
+
"description": "Text color when outlined card is disabled.",
|
|
216
|
+
"name": "--m3e-outlined-card-disabled-text-color"
|
|
217
|
+
},
|
|
218
|
+
{
|
|
219
|
+
"description": "Opacity applied to text when disabled.",
|
|
220
|
+
"name": "--m3e-outlined-card-disabled-text-opacity"
|
|
221
|
+
},
|
|
222
|
+
{
|
|
223
|
+
"description": "Elevation level when disabled.",
|
|
224
|
+
"name": "--m3e-outlined-card-disabled-container-elevation"
|
|
225
|
+
},
|
|
226
|
+
{
|
|
227
|
+
"description": "Shadow color when disabled.",
|
|
228
|
+
"name": "--m3e-outlined-card-disabled-container-elevation-color"
|
|
229
|
+
},
|
|
230
|
+
{
|
|
231
|
+
"description": "Shadow opacity when disabled.",
|
|
232
|
+
"name": "--m3e-outlined-card-disabled-container-elevation-opacity"
|
|
233
|
+
},
|
|
234
|
+
{
|
|
235
|
+
"description": "Border color when disabled.",
|
|
236
|
+
"name": "--m3e-outlined-card-disabled-outline-color"
|
|
237
|
+
},
|
|
238
|
+
{
|
|
239
|
+
"description": "Border opacity when disabled.",
|
|
240
|
+
"name": "--m3e-outlined-card-disabled-outline-opacity"
|
|
241
|
+
},
|
|
242
|
+
{
|
|
243
|
+
"description": "Text color on hover.",
|
|
244
|
+
"name": "--m3e-outlined-card-hover-text-color"
|
|
245
|
+
},
|
|
246
|
+
{
|
|
247
|
+
"description": "State layer color on hover.",
|
|
248
|
+
"name": "--m3e-outlined-card-hover-state-layer-color"
|
|
249
|
+
},
|
|
250
|
+
{
|
|
251
|
+
"description": "State layer opacity on hover.",
|
|
252
|
+
"name": "--m3e-outlined-card-hover-state-layer-opacity"
|
|
253
|
+
},
|
|
254
|
+
{
|
|
255
|
+
"description": "Elevation level on hover.",
|
|
256
|
+
"name": "--m3e-outlined-card-hover-container-elevation"
|
|
257
|
+
},
|
|
258
|
+
{
|
|
259
|
+
"description": "Border color on hover.",
|
|
260
|
+
"name": "--m3e-outlined-card-hover-outline-color"
|
|
261
|
+
},
|
|
262
|
+
{
|
|
263
|
+
"description": "Text color on focus.",
|
|
264
|
+
"name": "--m3e-outlined-card-focus-text-color"
|
|
265
|
+
},
|
|
266
|
+
{
|
|
267
|
+
"description": "State layer color on focus.",
|
|
268
|
+
"name": "--m3e-outlined-card-focus-state-layer-color"
|
|
269
|
+
},
|
|
270
|
+
{
|
|
271
|
+
"description": "State layer opacity on focus.",
|
|
272
|
+
"name": "--m3e-outlined-card-focus-state-layer-opacity"
|
|
273
|
+
},
|
|
274
|
+
{
|
|
275
|
+
"description": "Elevation level on focus.",
|
|
276
|
+
"name": "--m3e-outlined-card-focus-container-elevation"
|
|
277
|
+
},
|
|
278
|
+
{
|
|
279
|
+
"description": "Border color on focus.",
|
|
280
|
+
"name": "--m3e-outlined-card-focus-outline-color"
|
|
281
|
+
},
|
|
282
|
+
{
|
|
283
|
+
"description": "Text color on press.",
|
|
284
|
+
"name": "--m3e-outlined-card-pressed-text-color"
|
|
285
|
+
},
|
|
286
|
+
{
|
|
287
|
+
"description": "State layer color on press.",
|
|
288
|
+
"name": "--m3e-outlined-card-pressed-state-layer-color"
|
|
289
|
+
},
|
|
290
|
+
{
|
|
291
|
+
"description": "State layer opacity on press.",
|
|
292
|
+
"name": "--m3e-outlined-card-pressed-state-layer-opacity"
|
|
293
|
+
},
|
|
294
|
+
{
|
|
295
|
+
"description": "Elevation level on press.",
|
|
296
|
+
"name": "--m3e-outlined-card-pressed-container-elevation"
|
|
297
|
+
},
|
|
298
|
+
{
|
|
299
|
+
"description": "Border color on press.",
|
|
300
|
+
"name": "--m3e-outlined-card-pressed-outline-color"
|
|
301
|
+
}
|
|
302
|
+
],
|
|
303
|
+
"slots": [
|
|
304
|
+
{
|
|
305
|
+
"description": "Renders the content of the card without padding.",
|
|
306
|
+
"name": ""
|
|
307
|
+
},
|
|
308
|
+
{
|
|
309
|
+
"description": "Renders the header of the card.",
|
|
310
|
+
"name": "header"
|
|
311
|
+
},
|
|
312
|
+
{
|
|
313
|
+
"description": "Renders the content of the card with padding.",
|
|
314
|
+
"name": "content"
|
|
315
|
+
},
|
|
316
|
+
{
|
|
317
|
+
"description": "Renders the actions of the card.",
|
|
318
|
+
"name": "actions"
|
|
319
|
+
},
|
|
320
|
+
{
|
|
321
|
+
"description": "Renders the footer of the card.",
|
|
322
|
+
"name": "footer"
|
|
323
|
+
}
|
|
324
|
+
],
|
|
325
|
+
"members": [
|
|
326
|
+
{
|
|
327
|
+
"kind": "field",
|
|
328
|
+
"name": "_base",
|
|
329
|
+
"type": {
|
|
330
|
+
"text": "HTMLElement | undefined"
|
|
331
|
+
},
|
|
332
|
+
"privacy": "private",
|
|
333
|
+
"readonly": true
|
|
334
|
+
},
|
|
335
|
+
{
|
|
336
|
+
"kind": "field",
|
|
337
|
+
"name": "_elevation",
|
|
338
|
+
"type": {
|
|
339
|
+
"text": "M3eElevationElement | undefined"
|
|
340
|
+
},
|
|
341
|
+
"privacy": "private",
|
|
342
|
+
"readonly": true
|
|
343
|
+
},
|
|
344
|
+
{
|
|
345
|
+
"kind": "field",
|
|
346
|
+
"name": "_focusRing",
|
|
347
|
+
"type": {
|
|
348
|
+
"text": "M3eFocusRingElement | undefined"
|
|
349
|
+
},
|
|
350
|
+
"privacy": "private",
|
|
351
|
+
"readonly": true
|
|
352
|
+
},
|
|
353
|
+
{
|
|
354
|
+
"kind": "field",
|
|
355
|
+
"name": "_stateLayer",
|
|
356
|
+
"type": {
|
|
357
|
+
"text": "M3eStateLayerElement | undefined"
|
|
358
|
+
},
|
|
359
|
+
"privacy": "private",
|
|
360
|
+
"readonly": true
|
|
361
|
+
},
|
|
362
|
+
{
|
|
363
|
+
"kind": "field",
|
|
364
|
+
"name": "_ripple",
|
|
365
|
+
"type": {
|
|
366
|
+
"text": "M3eRippleElement | undefined"
|
|
367
|
+
},
|
|
368
|
+
"privacy": "private",
|
|
369
|
+
"readonly": true
|
|
370
|
+
},
|
|
371
|
+
{
|
|
372
|
+
"kind": "field",
|
|
373
|
+
"name": "#clickHandler",
|
|
374
|
+
"privacy": "private",
|
|
375
|
+
"readonly": true
|
|
376
|
+
},
|
|
377
|
+
{
|
|
378
|
+
"kind": "field",
|
|
379
|
+
"name": "inline",
|
|
380
|
+
"type": {
|
|
381
|
+
"text": "boolean"
|
|
382
|
+
},
|
|
383
|
+
"default": "false",
|
|
384
|
+
"description": "Whether to present the card inline with surrounding content.",
|
|
385
|
+
"attribute": "inline"
|
|
386
|
+
},
|
|
387
|
+
{
|
|
388
|
+
"kind": "field",
|
|
389
|
+
"name": "actionable",
|
|
390
|
+
"type": {
|
|
391
|
+
"text": "boolean"
|
|
392
|
+
},
|
|
393
|
+
"default": "false",
|
|
394
|
+
"description": "Whether the card is \"actionable\" and will respond to use interaction.",
|
|
395
|
+
"attribute": "actionable"
|
|
396
|
+
},
|
|
397
|
+
{
|
|
398
|
+
"kind": "field",
|
|
399
|
+
"name": "variant",
|
|
400
|
+
"type": {
|
|
401
|
+
"text": "CardVariant"
|
|
402
|
+
},
|
|
403
|
+
"default": "\"filled\"",
|
|
404
|
+
"description": "The appearance variant of the card.",
|
|
405
|
+
"attribute": "variant",
|
|
406
|
+
"reflects": true
|
|
407
|
+
},
|
|
408
|
+
{
|
|
409
|
+
"kind": "field",
|
|
410
|
+
"name": "orientation",
|
|
411
|
+
"type": {
|
|
412
|
+
"text": "CardOrientation"
|
|
413
|
+
},
|
|
414
|
+
"default": "\"vertical\"",
|
|
415
|
+
"description": "The orientation of the card.",
|
|
416
|
+
"attribute": "orientation",
|
|
417
|
+
"reflects": true
|
|
418
|
+
},
|
|
419
|
+
{
|
|
420
|
+
"kind": "method",
|
|
421
|
+
"name": "#handleClick",
|
|
422
|
+
"privacy": "private",
|
|
423
|
+
"return": {
|
|
424
|
+
"type": {
|
|
425
|
+
"text": "void"
|
|
426
|
+
}
|
|
427
|
+
},
|
|
428
|
+
"parameters": [
|
|
429
|
+
{
|
|
430
|
+
"name": "e",
|
|
431
|
+
"type": {
|
|
432
|
+
"text": "Event"
|
|
433
|
+
}
|
|
434
|
+
}
|
|
435
|
+
]
|
|
436
|
+
}
|
|
437
|
+
],
|
|
438
|
+
"attributes": [
|
|
439
|
+
{
|
|
440
|
+
"description": "Whether the card is \"actionable\" and will respond to use interaction.",
|
|
441
|
+
"name": "actionable",
|
|
442
|
+
"type": {
|
|
443
|
+
"text": "boolean"
|
|
444
|
+
},
|
|
445
|
+
"default": "false",
|
|
446
|
+
"fieldName": "actionable"
|
|
447
|
+
},
|
|
448
|
+
{
|
|
449
|
+
"description": "Whether to present the card inline with surrounding content.",
|
|
450
|
+
"name": "inline",
|
|
451
|
+
"type": {
|
|
452
|
+
"text": "boolean"
|
|
453
|
+
},
|
|
454
|
+
"default": "false",
|
|
455
|
+
"fieldName": "inline"
|
|
456
|
+
},
|
|
457
|
+
{
|
|
458
|
+
"description": "The orientation of the card.",
|
|
459
|
+
"name": "orientation",
|
|
460
|
+
"type": {
|
|
461
|
+
"text": "CardOrientation"
|
|
462
|
+
},
|
|
463
|
+
"default": "\"vertical\"",
|
|
464
|
+
"fieldName": "orientation"
|
|
465
|
+
},
|
|
466
|
+
{
|
|
467
|
+
"description": "The appearance variant of the card.",
|
|
468
|
+
"name": "variant",
|
|
469
|
+
"type": {
|
|
470
|
+
"text": "CardVariant"
|
|
471
|
+
},
|
|
472
|
+
"default": "\"filled\"",
|
|
473
|
+
"fieldName": "variant"
|
|
474
|
+
}
|
|
475
|
+
],
|
|
476
|
+
"mixins": [
|
|
477
|
+
{
|
|
478
|
+
"name": "KeyboardClick",
|
|
479
|
+
"package": "@m3e/core"
|
|
480
|
+
},
|
|
481
|
+
{
|
|
482
|
+
"name": "LinkButton",
|
|
483
|
+
"package": "@m3e/core"
|
|
484
|
+
},
|
|
485
|
+
{
|
|
486
|
+
"name": "FormSubmitter",
|
|
487
|
+
"package": "@m3e/core"
|
|
488
|
+
},
|
|
489
|
+
{
|
|
490
|
+
"name": "Focusable",
|
|
491
|
+
"package": "@m3e/core"
|
|
492
|
+
},
|
|
493
|
+
{
|
|
494
|
+
"name": "DisabledInteractive",
|
|
495
|
+
"package": "@m3e/core"
|
|
496
|
+
},
|
|
497
|
+
{
|
|
498
|
+
"name": "Disabled",
|
|
499
|
+
"package": "@m3e/core"
|
|
500
|
+
},
|
|
501
|
+
{
|
|
502
|
+
"name": "AttachInternals",
|
|
503
|
+
"package": "@m3e/core"
|
|
504
|
+
},
|
|
505
|
+
{
|
|
506
|
+
"name": "Role",
|
|
507
|
+
"package": "@m3e/core"
|
|
508
|
+
}
|
|
509
|
+
],
|
|
510
|
+
"superclass": {
|
|
511
|
+
"name": "LitElement",
|
|
512
|
+
"package": "lit"
|
|
513
|
+
},
|
|
514
|
+
"tagName": "m3e-card",
|
|
515
|
+
"customElement": true,
|
|
516
|
+
"summary": "A content container for text, images (or other media), and actions in the context of a single subject."
|
|
517
|
+
}
|
|
518
|
+
],
|
|
519
|
+
"exports": [
|
|
520
|
+
{
|
|
521
|
+
"kind": "js",
|
|
522
|
+
"name": "M3eCardElement",
|
|
523
|
+
"declaration": {
|
|
524
|
+
"name": "M3eCardElement",
|
|
525
|
+
"module": "src/CardElement.ts"
|
|
526
|
+
}
|
|
527
|
+
},
|
|
528
|
+
{
|
|
529
|
+
"kind": "custom-element-definition",
|
|
530
|
+
"name": "m3e-card",
|
|
531
|
+
"declaration": {
|
|
532
|
+
"name": "M3eCardElement",
|
|
533
|
+
"module": "src/CardElement.ts"
|
|
534
|
+
}
|
|
535
|
+
}
|
|
536
|
+
]
|
|
537
|
+
},
|
|
538
|
+
{
|
|
539
|
+
"kind": "javascript-module",
|
|
540
|
+
"path": "src/CardOrientation.ts",
|
|
541
|
+
"declarations": [],
|
|
542
|
+
"exports": []
|
|
543
|
+
},
|
|
544
|
+
{
|
|
545
|
+
"kind": "javascript-module",
|
|
546
|
+
"path": "src/CardVariant.ts",
|
|
547
|
+
"declarations": [],
|
|
548
|
+
"exports": []
|
|
549
|
+
},
|
|
550
|
+
{
|
|
551
|
+
"kind": "javascript-module",
|
|
552
|
+
"path": "src/index.ts",
|
|
553
|
+
"declarations": [],
|
|
554
|
+
"exports": [
|
|
555
|
+
{
|
|
556
|
+
"kind": "js",
|
|
557
|
+
"name": "*",
|
|
558
|
+
"declaration": {
|
|
559
|
+
"name": "*",
|
|
560
|
+
"package": "\"./CardElement\""
|
|
561
|
+
}
|
|
562
|
+
},
|
|
563
|
+
{
|
|
564
|
+
"kind": "js",
|
|
565
|
+
"name": "*",
|
|
566
|
+
"declaration": {
|
|
567
|
+
"name": "*",
|
|
568
|
+
"package": "\"./CardOrientation\""
|
|
569
|
+
}
|
|
570
|
+
},
|
|
571
|
+
{
|
|
572
|
+
"kind": "js",
|
|
573
|
+
"name": "*",
|
|
574
|
+
"declaration": {
|
|
575
|
+
"name": "*",
|
|
576
|
+
"package": "\"./CardVariant\""
|
|
577
|
+
}
|
|
578
|
+
}
|
|
579
|
+
]
|
|
580
|
+
},
|
|
581
|
+
{
|
|
582
|
+
"kind": "javascript-module",
|
|
583
|
+
"path": "src/styles/CardStyle.ts",
|
|
584
|
+
"declarations": [],
|
|
585
|
+
"exports": []
|
|
586
|
+
},
|
|
587
|
+
{
|
|
588
|
+
"kind": "javascript-module",
|
|
589
|
+
"path": "src/styles/CardToken.ts",
|
|
590
|
+
"declarations": [],
|
|
591
|
+
"exports": []
|
|
592
|
+
},
|
|
593
|
+
{
|
|
594
|
+
"kind": "javascript-module",
|
|
595
|
+
"path": "src/styles/CardVariantStyle.ts",
|
|
596
|
+
"declarations": [],
|
|
597
|
+
"exports": []
|
|
598
|
+
},
|
|
599
|
+
{
|
|
600
|
+
"kind": "javascript-module",
|
|
601
|
+
"path": "src/styles/CardVariantToken.ts",
|
|
602
|
+
"declarations": [],
|
|
603
|
+
"exports": []
|
|
604
|
+
},
|
|
605
|
+
{
|
|
606
|
+
"kind": "javascript-module",
|
|
607
|
+
"path": "src/styles/index.ts",
|
|
608
|
+
"declarations": [],
|
|
609
|
+
"exports": [
|
|
610
|
+
{
|
|
611
|
+
"kind": "js",
|
|
612
|
+
"name": "*",
|
|
613
|
+
"declaration": {
|
|
614
|
+
"name": "*",
|
|
615
|
+
"package": "\"./CardStyle\""
|
|
616
|
+
}
|
|
617
|
+
},
|
|
618
|
+
{
|
|
619
|
+
"kind": "js",
|
|
620
|
+
"name": "*",
|
|
621
|
+
"declaration": {
|
|
622
|
+
"name": "*",
|
|
623
|
+
"package": "\"./CardVariantStyle\""
|
|
624
|
+
}
|
|
625
|
+
}
|
|
626
|
+
]
|
|
627
|
+
}
|
|
628
|
+
]
|
|
629
|
+
}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
{
|
|
2
|
+
"$schema": "https://raw.githubusercontent.com/microsoft/vscode-html-languageservice/main/docs/customData.schema.json",
|
|
3
|
+
"version": 1.1,
|
|
4
|
+
"tags": [
|
|
5
|
+
{
|
|
6
|
+
"name": "m3e-card",
|
|
7
|
+
"description": "A content container for text, images (or other media), and actions in the context of a single subject.\n---\n\n\n### **Slots:**\n - _default_ - Renders the content of the card without padding.\n- **header** - Renders the header of the card.\n- **content** - Renders the content of the card with padding.\n- **actions** - Renders the actions of the card.\n- **footer** - Renders the footer of the card.\n\n### **CSS Properties:**\n - **--m3e-card-padding** - Internal spacing for all slotted regions _(default: undefined)_\n- **--m3e-card-shape** - Corner radius of the card container. _(default: undefined)_\n- **--m3e-filled-card-text-color** - Foreground color for text content in filled cards. _(default: undefined)_\n- **--m3e-filled-card-container-color** - Background color of the filled card container. _(default: undefined)_\n- **--m3e-filled-card-container-elevation** - Elevation level for filled card container. _(default: undefined)_\n- **--m3e-filled-card-disabled-text-color** - Text color when filled card is disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-text-opacity** - Opacity applied to text when disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-container-color** - Background color when disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-container-elevation** - Elevation level when disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-container-elevation-color** - Shadow color when disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-container-elevation-opacity** - Shadow opacity when disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-container-opacity** - Overall container opacity when disabled. _(default: undefined)_\n- **--m3e-filled-card-hover-text-color** - Text color on hover. _(default: undefined)_\n- **--m3e-filled-card-hover-state-layer-color** - State layer color on hover. _(default: undefined)_\n- **--m3e-filled-card-hover-state-layer-opacity** - State layer opacity on hover. _(default: undefined)_\n- **--m3e-filled-card-hover-container-elevation** - Elevation level on hover. _(default: undefined)_\n- **--m3e-filled-card-focus-text-color** - Text color on focus. _(default: undefined)_\n- **--m3e-filled-card-focus-state-layer-color** - State layer color on focus. _(default: undefined)_\n- **--m3e-filled-card-focus-state-layer-opacity** - State layer opacity on focus. _(default: undefined)_\n- **--m3e-filled-card-focus-container-elevation** - Elevation level on focus. _(default: undefined)_\n- **--m3e-filled-card-pressed-text-color** - Text color on press. _(default: undefined)_\n- **--m3e-filled-card-pressed-state-layer-color** - State layer color on press. _(default: undefined)_\n- **--m3e-filled-card-pressed-state-layer-opacity** - State layer opacity on press. _(default: undefined)_\n- **--m3e-filled-card-pressed-container-elevation** - Elevation level on press. _(default: undefined)_\n- **--m3e-elevated-card-text-color** - Foreground color for text content in elevated cards. _(default: undefined)_\n- **--m3e-elevated-card-container-color** - Background color of the elevated card container. _(default: undefined)_\n- **--m3e-elevated-card-container-elevation** - Elevation level for elevated card container. _(default: undefined)_\n- **--m3e-elevated-card-disabled-text-color** - Text color when elevated card is disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-text-opacity** - Opacity applied to text when disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-container-color** - Background color when disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-container-elevation** - Elevation level when disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-container-elevation-color** - Shadow color when disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-container-elevation-opacity** - Shadow opacity when disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-container-opacity** - Overall container opacity when disabled. _(default: undefined)_\n- **--m3e-elevated-card-hover-text-color** - Text color on hover. _(default: undefined)_\n- **--m3e-elevated-card-hover-state-layer-color** - State layer color on hover. _(default: undefined)_\n- **--m3e-elevated-card-hover-state-layer-opacity** - State layer opacity on hover. _(default: undefined)_\n- **--m3e-elevated-card-hover-container-elevation** - Elevation level on hover. _(default: undefined)_\n- **--m3e-elevated-card-focus-text-color** - Text color on focus. _(default: undefined)_\n- **--m3e-elevated-card-focus-state-layer-color** - State layer color on focus. _(default: undefined)_\n- **--m3e-elevated-card-focus-state-layer-opacity** - State layer opacity on focus. _(default: undefined)_\n- **--m3e-elevated-card-focus-container-elevation** - Elevation level on focus. _(default: undefined)_\n- **--m3e-elevated-card-pressed-text-color** - Text color on press. _(default: undefined)_\n- **--m3e-elevated-card-pressed-state-layer-color** - State layer color on press. _(default: undefined)_\n- **--m3e-elevated-card-pressed-state-layer-opacity** - State layer opacity on press. _(default: undefined)_\n- **--m3e-elevated-card-pressed-container-elevation** - Elevation level on press. _(default: undefined)_\n- **--m3e-outlined-card-text-color** - Foreground color for text content in outlined cards. _(default: undefined)_\n- **--m3e-outlined-card-container-elevation** - Elevation level for outlined card container. _(default: undefined)_\n- **--m3e-outlined-card-outline-color** - Border color for outlined cards. _(default: undefined)_\n- **--m3e-outlined-card-outline-thickness** - Border thickness for outlined cards. _(default: undefined)_\n- **--m3e-outlined-card-disabled-text-color** - Text color when outlined card is disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-text-opacity** - Opacity applied to text when disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-container-elevation** - Elevation level when disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-container-elevation-color** - Shadow color when disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-container-elevation-opacity** - Shadow opacity when disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-outline-color** - Border color when disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-outline-opacity** - Border opacity when disabled. _(default: undefined)_\n- **--m3e-outlined-card-hover-text-color** - Text color on hover. _(default: undefined)_\n- **--m3e-outlined-card-hover-state-layer-color** - State layer color on hover. _(default: undefined)_\n- **--m3e-outlined-card-hover-state-layer-opacity** - State layer opacity on hover. _(default: undefined)_\n- **--m3e-outlined-card-hover-container-elevation** - Elevation level on hover. _(default: undefined)_\n- **--m3e-outlined-card-hover-outline-color** - Border color on hover. _(default: undefined)_\n- **--m3e-outlined-card-focus-text-color** - Text color on focus. _(default: undefined)_\n- **--m3e-outlined-card-focus-state-layer-color** - State layer color on focus. _(default: undefined)_\n- **--m3e-outlined-card-focus-state-layer-opacity** - State layer opacity on focus. _(default: undefined)_\n- **--m3e-outlined-card-focus-container-elevation** - Elevation level on focus. _(default: undefined)_\n- **--m3e-outlined-card-focus-outline-color** - Border color on focus. _(default: undefined)_\n- **--m3e-outlined-card-pressed-text-color** - Text color on press. _(default: undefined)_\n- **--m3e-outlined-card-pressed-state-layer-color** - State layer color on press. _(default: undefined)_\n- **--m3e-outlined-card-pressed-state-layer-opacity** - State layer opacity on press. _(default: undefined)_\n- **--m3e-outlined-card-pressed-container-elevation** - Elevation level on press. _(default: undefined)_\n- **--m3e-outlined-card-pressed-outline-color** - Border color on press. _(default: undefined)_",
|
|
8
|
+
"attributes": [
|
|
9
|
+
{
|
|
10
|
+
"name": "actionable",
|
|
11
|
+
"description": "Whether the card is \"actionable\" and will respond to use interaction.",
|
|
12
|
+
"values": []
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
"name": "inline",
|
|
16
|
+
"description": "Whether to present the card inline with surrounding content.",
|
|
17
|
+
"values": []
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"name": "orientation",
|
|
21
|
+
"description": "The orientation of the card.",
|
|
22
|
+
"values": [{ "name": "CardOrientation" }]
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
"name": "variant",
|
|
26
|
+
"description": "The appearance variant of the card.",
|
|
27
|
+
"values": [{ "name": "CardVariant" }]
|
|
28
|
+
}
|
|
29
|
+
],
|
|
30
|
+
"references": []
|
|
31
|
+
}
|
|
32
|
+
]
|
|
33
|
+
}
|