@momentum-design/components 0.0.27 → 0.0.29
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/dist/browser/index.js +18 -16
- package/dist/browser/index.js.map +3 -3
- package/dist/components/avatar/avatar.component.d.ts +1 -1
- package/dist/components/avatar/avatar.component.js +5 -5
- package/dist/components/avatar/avatar.constants.d.ts +1 -1
- package/dist/components/avatar/avatar.constants.js +1 -1
- package/dist/components/badge/badge.component.d.ts +1 -1
- package/dist/components/badge/badge.component.js +6 -5
- package/dist/components/badge/badge.constants.d.ts +2 -2
- package/dist/components/badge/badge.constants.js +1 -1
- package/dist/components/badge/badge.styles.js +2 -0
- package/dist/components/icon/icon.component.d.ts +8 -6
- package/dist/components/icon/icon.component.js +20 -11
- package/dist/components/icon/icon.constants.d.ts +1 -1
- package/dist/components/icon/icon.constants.js +1 -1
- package/dist/components/iconprovider/iconprovider.component.d.ts +6 -1
- package/dist/components/iconprovider/iconprovider.component.js +15 -2
- package/dist/components/iconprovider/iconprovider.constants.d.ts +3 -1
- package/dist/components/iconprovider/iconprovider.constants.js +8 -1
- package/dist/components/iconprovider/iconprovider.context.d.ts +2 -1
- package/dist/components/iconprovider/iconprovider.stories.utils.d.ts +1 -2
- package/dist/components/iconprovider/iconprovider.stories.utils.js +4 -3
- package/dist/components/text/text.utils.d.ts +1 -1
- package/dist/components/text/text.utils.js +1 -1
- package/dist/custom-elements.json +166 -131
- package/dist/react/icon/index.d.ts +2 -2
- package/dist/react/icon/index.js +2 -2
- package/dist/react/index.d.ts +1 -1
- package/dist/react/index.js +3 -3
- package/package.json +1 -1
|
@@ -44,12 +44,12 @@
|
|
|
44
44
|
},
|
|
45
45
|
{
|
|
46
46
|
"kind": "field",
|
|
47
|
-
"name": "
|
|
47
|
+
"name": "size",
|
|
48
48
|
"type": {
|
|
49
49
|
"text": "number | undefined"
|
|
50
50
|
},
|
|
51
51
|
"description": "Scale of the avatar",
|
|
52
|
-
"attribute": "
|
|
52
|
+
"attribute": "size"
|
|
53
53
|
},
|
|
54
54
|
{
|
|
55
55
|
"kind": "method",
|
|
@@ -85,12 +85,12 @@
|
|
|
85
85
|
"fieldName": "src"
|
|
86
86
|
},
|
|
87
87
|
{
|
|
88
|
-
"name": "
|
|
88
|
+
"name": "size",
|
|
89
89
|
"type": {
|
|
90
90
|
"text": "number | undefined"
|
|
91
91
|
},
|
|
92
92
|
"description": "Scale of the avatar",
|
|
93
|
-
"fieldName": "
|
|
93
|
+
"fieldName": "size"
|
|
94
94
|
}
|
|
95
95
|
],
|
|
96
96
|
"superclass": {
|
|
@@ -116,47 +116,37 @@
|
|
|
116
116
|
},
|
|
117
117
|
{
|
|
118
118
|
"kind": "javascript-module",
|
|
119
|
-
"path": "components/
|
|
119
|
+
"path": "components/badge/badge.component.js",
|
|
120
120
|
"declarations": [
|
|
121
121
|
{
|
|
122
122
|
"kind": "class",
|
|
123
|
-
"description": "
|
|
124
|
-
"name": "
|
|
125
|
-
"
|
|
126
|
-
{
|
|
127
|
-
"kind": "field",
|
|
128
|
-
"name": "iconData",
|
|
129
|
-
"type": {
|
|
130
|
-
"text": "HTMLElement | undefined"
|
|
131
|
-
},
|
|
132
|
-
"privacy": "private"
|
|
133
|
-
},
|
|
123
|
+
"description": "",
|
|
124
|
+
"name": "Badge",
|
|
125
|
+
"slots": [
|
|
134
126
|
{
|
|
135
|
-
"
|
|
136
|
-
"name": "
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
"privacy": "private"
|
|
141
|
-
},
|
|
127
|
+
"description": "This is a default/unnamed slot",
|
|
128
|
+
"name": ""
|
|
129
|
+
}
|
|
130
|
+
],
|
|
131
|
+
"members": [
|
|
142
132
|
{
|
|
143
133
|
"kind": "field",
|
|
144
|
-
"name": "
|
|
134
|
+
"name": "type",
|
|
145
135
|
"type": {
|
|
146
|
-
"text": "
|
|
136
|
+
"text": "BadgeType | undefined"
|
|
147
137
|
},
|
|
148
|
-
"description": "
|
|
149
|
-
"attribute": "
|
|
138
|
+
"description": "Type of the badge\nCan be `regular`, `icon`, `text` or `warning`\n\nDefault: `regular`",
|
|
139
|
+
"attribute": "type",
|
|
150
140
|
"reflects": true
|
|
151
141
|
},
|
|
152
142
|
{
|
|
153
143
|
"kind": "field",
|
|
154
|
-
"name": "
|
|
144
|
+
"name": "size",
|
|
155
145
|
"type": {
|
|
156
146
|
"text": "number | undefined"
|
|
157
147
|
},
|
|
158
|
-
"description": "Scale of the
|
|
159
|
-
"attribute": "
|
|
148
|
+
"description": "Scale of the badge (works in combination with length unit)\n\nDefault: `1`",
|
|
149
|
+
"attribute": "size"
|
|
160
150
|
},
|
|
161
151
|
{
|
|
162
152
|
"kind": "field",
|
|
@@ -164,107 +154,94 @@
|
|
|
164
154
|
"type": {
|
|
165
155
|
"text": "string | undefined"
|
|
166
156
|
},
|
|
167
|
-
"description": "Length unit attribute for
|
|
157
|
+
"description": "Length unit attribute for scale\n\nDefault: `rem`",
|
|
168
158
|
"attribute": "length-unit"
|
|
169
159
|
},
|
|
170
160
|
{
|
|
171
161
|
"kind": "field",
|
|
172
|
-
"name": "
|
|
162
|
+
"name": "iconName",
|
|
173
163
|
"type": {
|
|
174
|
-
"text": "string |
|
|
164
|
+
"text": "string | undefined"
|
|
175
165
|
},
|
|
176
|
-
"
|
|
177
|
-
"
|
|
178
|
-
"attribute": "role"
|
|
166
|
+
"description": "If `type` is set to `icon`, attribute `iconName` can\nbe used to choose which icon should be shown\n\nIf no `iconName` is provided, no icon will be rendered.",
|
|
167
|
+
"attribute": "icon-name"
|
|
179
168
|
},
|
|
180
169
|
{
|
|
181
170
|
"kind": "field",
|
|
182
|
-
"name": "
|
|
171
|
+
"name": "text",
|
|
183
172
|
"type": {
|
|
184
|
-
"text": "string |
|
|
173
|
+
"text": "string | undefined"
|
|
185
174
|
},
|
|
186
|
-
"
|
|
187
|
-
"
|
|
188
|
-
"attribute": "aria-label"
|
|
189
|
-
},
|
|
190
|
-
{
|
|
191
|
-
"kind": "field",
|
|
192
|
-
"name": "iconProviderContext",
|
|
193
|
-
"privacy": "private"
|
|
175
|
+
"description": "If `type` is set to `text`, attribute `text` can\nbe used to pass in any text to be displayed in the badge.",
|
|
176
|
+
"attribute": "text"
|
|
194
177
|
},
|
|
195
178
|
{
|
|
196
179
|
"kind": "method",
|
|
197
|
-
"name": "
|
|
198
|
-
"privacy": "private"
|
|
199
|
-
"description": "Get Icon Data function which will fetch the icon (currently only svg)\nand sets state and attributes once fetched successfully"
|
|
180
|
+
"name": "updateSize",
|
|
181
|
+
"privacy": "private"
|
|
200
182
|
},
|
|
201
183
|
{
|
|
202
184
|
"kind": "method",
|
|
203
|
-
"name": "
|
|
204
|
-
"privacy": "private",
|
|
205
|
-
"description": "Updates the size by setting the width and height"
|
|
185
|
+
"name": "iconTemplate"
|
|
206
186
|
},
|
|
207
187
|
{
|
|
208
188
|
"kind": "method",
|
|
209
|
-
"name": "
|
|
210
|
-
"privacy": "private"
|
|
189
|
+
"name": "textTemplate"
|
|
211
190
|
},
|
|
212
191
|
{
|
|
213
192
|
"kind": "method",
|
|
214
|
-
"name": "
|
|
215
|
-
"privacy": "private"
|
|
193
|
+
"name": "warningTemplate"
|
|
216
194
|
}
|
|
217
195
|
],
|
|
218
196
|
"attributes": [
|
|
219
197
|
{
|
|
220
|
-
"name": "
|
|
198
|
+
"name": "type",
|
|
221
199
|
"type": {
|
|
222
|
-
"text": "
|
|
200
|
+
"text": "BadgeType | undefined"
|
|
223
201
|
},
|
|
224
|
-
"description": "
|
|
225
|
-
"fieldName": "
|
|
202
|
+
"description": "Type of the badge\nCan be `regular`, `icon`, `text` or `warning`\n\nDefault: `regular`",
|
|
203
|
+
"fieldName": "type"
|
|
226
204
|
},
|
|
227
205
|
{
|
|
228
|
-
"name": "
|
|
206
|
+
"name": "size",
|
|
229
207
|
"type": {
|
|
230
208
|
"text": "number | undefined"
|
|
231
209
|
},
|
|
232
|
-
"description": "Scale of the
|
|
233
|
-
"fieldName": "
|
|
210
|
+
"description": "Scale of the badge (works in combination with length unit)\n\nDefault: `1`",
|
|
211
|
+
"fieldName": "size"
|
|
234
212
|
},
|
|
235
213
|
{
|
|
236
214
|
"name": "length-unit",
|
|
237
215
|
"type": {
|
|
238
216
|
"text": "string | undefined"
|
|
239
217
|
},
|
|
240
|
-
"description": "Length unit attribute for
|
|
218
|
+
"description": "Length unit attribute for scale\n\nDefault: `rem`",
|
|
241
219
|
"fieldName": "lengthUnit"
|
|
242
220
|
},
|
|
243
221
|
{
|
|
244
|
-
"name": "
|
|
222
|
+
"name": "icon-name",
|
|
245
223
|
"type": {
|
|
246
|
-
"text": "string |
|
|
224
|
+
"text": "string | undefined"
|
|
247
225
|
},
|
|
248
|
-
"
|
|
249
|
-
"
|
|
250
|
-
"fieldName": "role"
|
|
226
|
+
"description": "If `type` is set to `icon`, attribute `iconName` can\nbe used to choose which icon should be shown\n\nIf no `iconName` is provided, no icon will be rendered.",
|
|
227
|
+
"fieldName": "iconName"
|
|
251
228
|
},
|
|
252
229
|
{
|
|
253
|
-
"name": "
|
|
230
|
+
"name": "text",
|
|
254
231
|
"type": {
|
|
255
|
-
"text": "string |
|
|
232
|
+
"text": "string | undefined"
|
|
256
233
|
},
|
|
257
|
-
"
|
|
258
|
-
"
|
|
259
|
-
"fieldName": "ariaLabel"
|
|
234
|
+
"description": "If `type` is set to `text`, attribute `text` can\nbe used to pass in any text to be displayed in the badge.",
|
|
235
|
+
"fieldName": "text"
|
|
260
236
|
}
|
|
261
237
|
],
|
|
262
238
|
"superclass": {
|
|
263
239
|
"name": "Component",
|
|
264
240
|
"module": "/src/models"
|
|
265
241
|
},
|
|
266
|
-
"tagName": "mdc-
|
|
267
|
-
"
|
|
242
|
+
"tagName": "mdc-badge",
|
|
243
|
+
"summary": "This is MyElement",
|
|
244
|
+
"jsDoc": "/**\n * @slot - This is a default/unnamed slot\n *\n * @summary This is MyElement\n *\n * @tag mdc-badge\n * @tagname mdc-badge\n */",
|
|
268
245
|
"customElement": true
|
|
269
246
|
}
|
|
270
247
|
],
|
|
@@ -273,45 +250,63 @@
|
|
|
273
250
|
"kind": "js",
|
|
274
251
|
"name": "default",
|
|
275
252
|
"declaration": {
|
|
276
|
-
"name": "
|
|
277
|
-
"module": "components/
|
|
253
|
+
"name": "Badge",
|
|
254
|
+
"module": "components/badge/badge.component.js"
|
|
278
255
|
}
|
|
279
256
|
}
|
|
280
257
|
]
|
|
281
258
|
},
|
|
282
259
|
{
|
|
283
260
|
"kind": "javascript-module",
|
|
284
|
-
"path": "components/
|
|
261
|
+
"path": "components/icon/icon.component.js",
|
|
285
262
|
"declarations": [
|
|
286
263
|
{
|
|
287
264
|
"kind": "class",
|
|
288
|
-
"description": "",
|
|
289
|
-
"name": "
|
|
290
|
-
"slots": [
|
|
291
|
-
{
|
|
292
|
-
"description": "This is a default/unnamed slot",
|
|
293
|
-
"name": ""
|
|
294
|
-
}
|
|
295
|
-
],
|
|
265
|
+
"description": "Icon component, which has to be mounted inside of a `IconProvider`\ncomponent.\n\nThe `IconProvider` component defines where icons should be consumed from (`url`).\nThis `Icon` component accepts the `name` attribute, which will be\nthe file name of the icon to be loaded from the given `url`.\n\nOnce fetched, the icon will be mounted. If fetching wasn't successful,\nnothing will be shown.\n\nThe `size` attribute allows sizing the icon based on the provided\n`length-unit` attribute (which will either come from the IconProvider or\ncould be overridden per icon). For example:\nif `size = 1` and `length-unit = 'em'`, the size of the icon will be\n`width: 1em; height: 1em`.\n\nFor accessibility the `role` and `aria-label` of the icon can be set.",
|
|
266
|
+
"name": "Icon",
|
|
296
267
|
"members": [
|
|
297
268
|
{
|
|
298
269
|
"kind": "field",
|
|
299
|
-
"name": "
|
|
270
|
+
"name": "iconData",
|
|
300
271
|
"type": {
|
|
301
|
-
"text": "
|
|
272
|
+
"text": "HTMLElement | undefined"
|
|
302
273
|
},
|
|
303
|
-
"
|
|
304
|
-
|
|
274
|
+
"privacy": "private"
|
|
275
|
+
},
|
|
276
|
+
{
|
|
277
|
+
"kind": "field",
|
|
278
|
+
"name": "lengthUnitFromContext",
|
|
279
|
+
"type": {
|
|
280
|
+
"text": "string | undefined"
|
|
281
|
+
},
|
|
282
|
+
"privacy": "private"
|
|
283
|
+
},
|
|
284
|
+
{
|
|
285
|
+
"kind": "field",
|
|
286
|
+
"name": "sizeFromContext",
|
|
287
|
+
"type": {
|
|
288
|
+
"text": "number | undefined"
|
|
289
|
+
},
|
|
290
|
+
"privacy": "private"
|
|
291
|
+
},
|
|
292
|
+
{
|
|
293
|
+
"kind": "field",
|
|
294
|
+
"name": "name",
|
|
295
|
+
"type": {
|
|
296
|
+
"text": "string | undefined"
|
|
297
|
+
},
|
|
298
|
+
"description": "Name of the icon (= filename)",
|
|
299
|
+
"attribute": "name",
|
|
305
300
|
"reflects": true
|
|
306
301
|
},
|
|
307
302
|
{
|
|
308
303
|
"kind": "field",
|
|
309
|
-
"name": "
|
|
304
|
+
"name": "size",
|
|
310
305
|
"type": {
|
|
311
306
|
"text": "number | undefined"
|
|
312
307
|
},
|
|
313
|
-
"description": "
|
|
314
|
-
"attribute": "
|
|
308
|
+
"description": "Size of the icon (works in combination with length unit)",
|
|
309
|
+
"attribute": "size"
|
|
315
310
|
},
|
|
316
311
|
{
|
|
317
312
|
"kind": "field",
|
|
@@ -319,94 +314,114 @@
|
|
|
319
314
|
"type": {
|
|
320
315
|
"text": "string | undefined"
|
|
321
316
|
},
|
|
322
|
-
"description": "Length unit attribute for
|
|
317
|
+
"description": "Length unit attribute for overriding length-unit from `IconProvider`",
|
|
323
318
|
"attribute": "length-unit"
|
|
324
319
|
},
|
|
325
320
|
{
|
|
326
321
|
"kind": "field",
|
|
327
|
-
"name": "
|
|
322
|
+
"name": "role",
|
|
328
323
|
"type": {
|
|
329
|
-
"text": "string |
|
|
324
|
+
"text": "string | null"
|
|
330
325
|
},
|
|
331
|
-
"
|
|
332
|
-
"
|
|
326
|
+
"default": "null",
|
|
327
|
+
"description": "Role attribute to be set for accessibility",
|
|
328
|
+
"attribute": "role"
|
|
333
329
|
},
|
|
334
330
|
{
|
|
335
331
|
"kind": "field",
|
|
336
|
-
"name": "
|
|
332
|
+
"name": "ariaLabel",
|
|
337
333
|
"type": {
|
|
338
|
-
"text": "string |
|
|
334
|
+
"text": "string | null"
|
|
339
335
|
},
|
|
340
|
-
"
|
|
341
|
-
"
|
|
336
|
+
"default": "null",
|
|
337
|
+
"description": "Aria-label attribute to be set for accessibility",
|
|
338
|
+
"attribute": "aria-label"
|
|
339
|
+
},
|
|
340
|
+
{
|
|
341
|
+
"kind": "field",
|
|
342
|
+
"name": "iconProviderContext",
|
|
343
|
+
"privacy": "private",
|
|
344
|
+
"readonly": true
|
|
342
345
|
},
|
|
343
346
|
{
|
|
344
347
|
"kind": "method",
|
|
345
|
-
"name": "
|
|
346
|
-
"privacy": "private"
|
|
348
|
+
"name": "getIconData",
|
|
349
|
+
"privacy": "private",
|
|
350
|
+
"description": "Get Icon Data function which will fetch the icon (currently only svg)\nand sets state and attributes once fetched successfully"
|
|
347
351
|
},
|
|
348
352
|
{
|
|
349
353
|
"kind": "method",
|
|
350
|
-
"name": "
|
|
354
|
+
"name": "updateSize",
|
|
355
|
+
"privacy": "private",
|
|
356
|
+
"description": "Updates the size by setting the width and height"
|
|
351
357
|
},
|
|
352
358
|
{
|
|
353
359
|
"kind": "method",
|
|
354
|
-
"name": "
|
|
360
|
+
"name": "setRoleOnIcon",
|
|
361
|
+
"privacy": "private"
|
|
355
362
|
},
|
|
356
363
|
{
|
|
357
364
|
"kind": "method",
|
|
358
|
-
"name": "
|
|
365
|
+
"name": "setAriaLabelOnIcon",
|
|
366
|
+
"privacy": "private"
|
|
367
|
+
},
|
|
368
|
+
{
|
|
369
|
+
"kind": "field",
|
|
370
|
+
"name": "computedIconSize",
|
|
371
|
+
"privacy": "private",
|
|
372
|
+
"readonly": true
|
|
359
373
|
}
|
|
360
374
|
],
|
|
361
375
|
"attributes": [
|
|
362
376
|
{
|
|
363
|
-
"name": "
|
|
377
|
+
"name": "name",
|
|
364
378
|
"type": {
|
|
365
|
-
"text": "
|
|
379
|
+
"text": "string | undefined"
|
|
366
380
|
},
|
|
367
|
-
"description": "
|
|
368
|
-
"fieldName": "
|
|
381
|
+
"description": "Name of the icon (= filename)",
|
|
382
|
+
"fieldName": "name"
|
|
369
383
|
},
|
|
370
384
|
{
|
|
371
|
-
"name": "
|
|
385
|
+
"name": "size",
|
|
372
386
|
"type": {
|
|
373
387
|
"text": "number | undefined"
|
|
374
388
|
},
|
|
375
|
-
"description": "
|
|
376
|
-
"fieldName": "
|
|
389
|
+
"description": "Size of the icon (works in combination with length unit)",
|
|
390
|
+
"fieldName": "size"
|
|
377
391
|
},
|
|
378
392
|
{
|
|
379
393
|
"name": "length-unit",
|
|
380
394
|
"type": {
|
|
381
395
|
"text": "string | undefined"
|
|
382
396
|
},
|
|
383
|
-
"description": "Length unit attribute for
|
|
397
|
+
"description": "Length unit attribute for overriding length-unit from `IconProvider`",
|
|
384
398
|
"fieldName": "lengthUnit"
|
|
385
399
|
},
|
|
386
400
|
{
|
|
387
|
-
"name": "
|
|
401
|
+
"name": "role",
|
|
388
402
|
"type": {
|
|
389
|
-
"text": "string |
|
|
403
|
+
"text": "string | null"
|
|
390
404
|
},
|
|
391
|
-
"
|
|
392
|
-
"
|
|
405
|
+
"default": "null",
|
|
406
|
+
"description": "Role attribute to be set for accessibility",
|
|
407
|
+
"fieldName": "role"
|
|
393
408
|
},
|
|
394
409
|
{
|
|
395
|
-
"name": "
|
|
410
|
+
"name": "aria-label",
|
|
396
411
|
"type": {
|
|
397
|
-
"text": "string |
|
|
412
|
+
"text": "string | null"
|
|
398
413
|
},
|
|
399
|
-
"
|
|
400
|
-
"
|
|
414
|
+
"default": "null",
|
|
415
|
+
"description": "Aria-label attribute to be set for accessibility",
|
|
416
|
+
"fieldName": "ariaLabel"
|
|
401
417
|
}
|
|
402
418
|
],
|
|
403
419
|
"superclass": {
|
|
404
420
|
"name": "Component",
|
|
405
421
|
"module": "/src/models"
|
|
406
422
|
},
|
|
407
|
-
"tagName": "mdc-
|
|
408
|
-
"
|
|
409
|
-
"jsDoc": "/**\n * @slot - This is a default/unnamed slot\n *\n * @summary This is MyElement\n *\n * @tag mdc-badge\n * @tagname mdc-badge\n */",
|
|
423
|
+
"tagName": "mdc-icon",
|
|
424
|
+
"jsDoc": "/**\n * Icon component, which has to be mounted inside of a `IconProvider`\n * component.\n *\n * The `IconProvider` component defines where icons should be consumed from (`url`).\n * This `Icon` component accepts the `name` attribute, which will be\n * the file name of the icon to be loaded from the given `url`.\n *\n * Once fetched, the icon will be mounted. If fetching wasn't successful,\n * nothing will be shown.\n *\n * The `size` attribute allows sizing the icon based on the provided\n * `length-unit` attribute (which will either come from the IconProvider or\n * could be overridden per icon). For example:\n * if `size = 1` and `length-unit = 'em'`, the size of the icon will be\n * `width: 1em; height: 1em`.\n *\n * For accessibility the `role` and `aria-label` of the icon can be set.\n *\n * @tag mdc-icon\n * @tagname mdc-icon\n */",
|
|
410
425
|
"customElement": true
|
|
411
426
|
}
|
|
412
427
|
],
|
|
@@ -415,8 +430,8 @@
|
|
|
415
430
|
"kind": "js",
|
|
416
431
|
"name": "default",
|
|
417
432
|
"declaration": {
|
|
418
|
-
"name": "
|
|
419
|
-
"module": "components/
|
|
433
|
+
"name": "Icon",
|
|
434
|
+
"module": "components/icon/icon.component.js"
|
|
420
435
|
}
|
|
421
436
|
}
|
|
422
437
|
]
|
|
@@ -460,12 +475,23 @@
|
|
|
460
475
|
"kind": "field",
|
|
461
476
|
"name": "lengthUnit",
|
|
462
477
|
"type": {
|
|
463
|
-
"text": "string
|
|
478
|
+
"text": "string"
|
|
464
479
|
},
|
|
465
480
|
"description": "Length unit used for sizing of icons, default: 'em'",
|
|
466
481
|
"attribute": "length-unit",
|
|
467
482
|
"reflects": true
|
|
468
483
|
},
|
|
484
|
+
{
|
|
485
|
+
"kind": "field",
|
|
486
|
+
"name": "size",
|
|
487
|
+
"type": {
|
|
488
|
+
"text": "number | undefined"
|
|
489
|
+
},
|
|
490
|
+
"default": "DEFAULTS.LENGTH_UNIT_SIZE[DEFAULTS.LENGTH_UNIT]",
|
|
491
|
+
"description": "The default size of the icon.\nIf not set, it falls back to the size defined by the length unit.",
|
|
492
|
+
"attribute": "size",
|
|
493
|
+
"reflects": true
|
|
494
|
+
},
|
|
469
495
|
{
|
|
470
496
|
"kind": "method",
|
|
471
497
|
"name": "updateValuesInContext",
|
|
@@ -502,10 +528,19 @@
|
|
|
502
528
|
{
|
|
503
529
|
"name": "length-unit",
|
|
504
530
|
"type": {
|
|
505
|
-
"text": "string
|
|
531
|
+
"text": "string"
|
|
506
532
|
},
|
|
507
533
|
"description": "Length unit used for sizing of icons, default: 'em'",
|
|
508
534
|
"fieldName": "lengthUnit"
|
|
535
|
+
},
|
|
536
|
+
{
|
|
537
|
+
"name": "size",
|
|
538
|
+
"type": {
|
|
539
|
+
"text": "number | undefined"
|
|
540
|
+
},
|
|
541
|
+
"default": "DEFAULTS.LENGTH_UNIT_SIZE[DEFAULTS.LENGTH_UNIT]",
|
|
542
|
+
"description": "The default size of the icon.\nIf not set, it falls back to the size defined by the length unit.",
|
|
543
|
+
"fieldName": "size"
|
|
509
544
|
}
|
|
510
545
|
],
|
|
511
546
|
"superclass": {
|
|
@@ -10,10 +10,10 @@ import Component from '../../components/icon';
|
|
|
10
10
|
* Once fetched, the icon will be mounted. If fetching wasn't successful,
|
|
11
11
|
* nothing will be shown.
|
|
12
12
|
*
|
|
13
|
-
* The `
|
|
13
|
+
* The `size` attribute allows sizing the icon based on the provided
|
|
14
14
|
* `length-unit` attribute (which will either come from the IconProvider or
|
|
15
15
|
* could be overridden per icon). For example:
|
|
16
|
-
* if `
|
|
16
|
+
* if `size = 1` and `length-unit = 'em'`, the size of the icon will be
|
|
17
17
|
* `width: 1em; height: 1em`.
|
|
18
18
|
*
|
|
19
19
|
* For accessibility the `role` and `aria-label` of the icon can be set.
|
package/dist/react/icon/index.js
CHANGED
|
@@ -16,10 +16,10 @@ const icon_constants_1 = require("../../components/icon/icon.constants");
|
|
|
16
16
|
* Once fetched, the icon will be mounted. If fetching wasn't successful,
|
|
17
17
|
* nothing will be shown.
|
|
18
18
|
*
|
|
19
|
-
* The `
|
|
19
|
+
* The `size` attribute allows sizing the icon based on the provided
|
|
20
20
|
* `length-unit` attribute (which will either come from the IconProvider or
|
|
21
21
|
* could be overridden per icon). For example:
|
|
22
|
-
* if `
|
|
22
|
+
* if `size = 1` and `length-unit = 'em'`, the size of the icon will be
|
|
23
23
|
* `width: 1em; height: 1em`.
|
|
24
24
|
*
|
|
25
25
|
* For accessibility the `role` and `aria-label` of the icon can be set.
|
package/dist/react/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export { default as Avatar } from './avatar';
|
|
2
|
-
export { default as Icon } from './icon';
|
|
3
2
|
export { default as Badge } from './badge';
|
|
3
|
+
export { default as Icon } from './icon';
|
|
4
4
|
export { default as IconProvider } from './iconprovider';
|
|
5
5
|
export { default as Text } from './text';
|
|
6
6
|
export { default as ThemeProvider } from './themeprovider';
|
package/dist/react/index.js
CHANGED
|
@@ -3,13 +3,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.ThemeProvider = exports.Text = exports.IconProvider = exports.
|
|
6
|
+
exports.ThemeProvider = exports.Text = exports.IconProvider = exports.Icon = exports.Badge = exports.Avatar = void 0;
|
|
7
7
|
var avatar_1 = require("./avatar");
|
|
8
8
|
Object.defineProperty(exports, "Avatar", { enumerable: true, get: function () { return __importDefault(avatar_1).default; } });
|
|
9
|
-
var icon_1 = require("./icon");
|
|
10
|
-
Object.defineProperty(exports, "Icon", { enumerable: true, get: function () { return __importDefault(icon_1).default; } });
|
|
11
9
|
var badge_1 = require("./badge");
|
|
12
10
|
Object.defineProperty(exports, "Badge", { enumerable: true, get: function () { return __importDefault(badge_1).default; } });
|
|
11
|
+
var icon_1 = require("./icon");
|
|
12
|
+
Object.defineProperty(exports, "Icon", { enumerable: true, get: function () { return __importDefault(icon_1).default; } });
|
|
13
13
|
var iconprovider_1 = require("./iconprovider");
|
|
14
14
|
Object.defineProperty(exports, "IconProvider", { enumerable: true, get: function () { return __importDefault(iconprovider_1).default; } });
|
|
15
15
|
var text_1 = require("./text");
|
package/package.json
CHANGED