@salutejs/sdds-dfa 0.322.0-canary.2238.17818313113.0 → 0.322.0-dev.0

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.
Files changed (5) hide show
  1. package/components/Avatar/Avatar.config.d.ts +4 -2
  2. package/components/Avatar/Avatar.config.js +80 -55
  3. package/components/Avatar/Avatar.d.ts +13 -6
  4. package/es/components/Avatar/Avatar.config.js +80 -55
  5. package/package.json +7 -7
package/components/Avatar/Avatar.config.d.ts CHANGED
@@ -2,6 +2,7 @@ export declare const config: {
2
2
  defaults: {
3
3
  view: string;
4
4
  size: string;
5
+ shape: string;
5
6
  };
6
7
  variations: {
7
8
  view: {
@@ -14,8 +15,9 @@ export declare const config: {
14
15
  s: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
15
16
  fit: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
16
17
  };
17
- focused: {
18
- true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
18
+ shape: {
19
+ circled: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
20
+ rounded: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
19
21
  };
20
22
  badgeView: {
21
23
  default: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
package/components/Avatar/Avatar.config.js CHANGED
@@ -41,7 +41,8 @@ function _templateObject1() {
41
41
  ": 2rem;\n ",
42
42
  ": 600;\n ",
43
43
  ": 2rem;\n ",
44
- ": 0.75rem;\n\n ",
44
+ ": 0.75rem;\n ",
45
+ ": 1.125rem;\n\n ",
45
46
  ": 0.5rem;\n ",
46
47
  ": 1.75rem;\n ",
47
48
  ": 0 0.688rem;\n ",
@@ -79,7 +80,8 @@ function _templateObject2() {
79
80
  ": 1.25rem;\n ",
80
81
  ": 600;\n ",
81
82
  ": 1.25rem;\n ",
82
- ": 0.5rem;\n\n ",
83
+ ": 0.5rem;\n ",
84
+ ": 0.75rem;\n\n ",
83
85
  ": 2;\n\n ",
84
86
  ": 0.375rem;\n ",
85
87
  ": 1.25rem;\n ",
@@ -118,7 +120,8 @@ function _templateObject3() {
118
120
  ": 0.875rem;\n ",
119
121
  ": 600;\n ",
120
122
  ": 0.875rem;\n ",
121
- ": 0.5rem;\n\n ",
123
+ ": 0.5rem;\n ",
124
+ ": 0.625rem;\n\n ",
122
125
  ": 2;\n\n ",
123
126
  ": 0.25rem;\n ",
124
127
  ": 1rem;\n ",
@@ -157,7 +160,8 @@ function _templateObject4() {
157
160
  ": 0.5rem;\n ",
158
161
  ": 600;\n ",
159
162
  ": 0.5rem;\n ",
160
- ": 0.375rem;\n\n ",
163
+ ": 0.375rem;\n ",
164
+ ": 0.5rem;\n\n ",
161
165
  ": 1;\n\n ",
162
166
  ": 1rem;\n ",
163
167
  ": 0.75rem;\n ",
@@ -191,9 +195,13 @@ function _templateObject5() {
191
195
  function _templateObject6() {
192
196
  var data = _tagged_template_literal([
193
197
  "\n ",
194
- ": 0.1rem;\n ",
195
- ": -0.2rem;\n ",
196
- ": var(--surface-accent);\n "
198
+ ": 50%;\n ",
199
+ ": calc(0.867 * var(",
200
+ ") - var(",
201
+ ") / 2);\n ",
202
+ ": calc(0.867 * var(",
203
+ ") - var(",
204
+ ") / 2);\n "
197
205
  ]);
198
206
  _templateObject6 = function _templateObject() {
199
207
  return data;
@@ -201,6 +209,21 @@ function _templateObject6() {
201
209
  return data;
202
210
  }
203
211
  function _templateObject7() {
212
+ var data = _tagged_template_literal([
213
+ "\n ",
214
+ ": calc(var(",
215
+ ") - var(",
216
+ "));\n ",
217
+ ": calc(var(",
218
+ ") - var(",
219
+ "));\n "
220
+ ]);
221
+ _templateObject7 = function _templateObject() {
222
+ return data;
223
+ };
224
+ return data;
225
+ }
226
+ function _templateObject8() {
204
227
  var data = _tagged_template_literal([
205
228
  "\n ",
206
229
  ": var(--inverse-text-primary);\n ",
@@ -210,12 +233,12 @@ function _templateObject7() {
210
233
  ": var(--text-primary);\n ",
211
234
  ": var(--surface-clear);\n "
212
235
  ]);
213
- _templateObject7 = function _templateObject() {
236
+ _templateObject8 = function _templateObject() {
214
237
  return data;
215
238
  };
216
239
  return data;
217
240
  }
218
- function _templateObject8() {
241
+ function _templateObject9() {
219
242
  var data = _tagged_template_literal([
220
243
  "\n ",
221
244
  ": var(--on-dark-text-primary);\n ",
@@ -225,12 +248,12 @@ function _templateObject8() {
225
248
  ": var(--text-accent);\n ",
226
249
  ": var(--surface-clear);\n "
227
250
  ]);
228
- _templateObject8 = function _templateObject() {
251
+ _templateObject9 = function _templateObject() {
229
252
  return data;
230
253
  };
231
254
  return data;
232
255
  }
233
- function _templateObject9() {
256
+ function _templateObject10() {
234
257
  var data = _tagged_template_literal([
235
258
  "\n ",
236
259
  ": var(--on-dark-text-primary);\n ",
@@ -240,12 +263,12 @@ function _templateObject9() {
240
263
  ": var(--text-positive);\n ",
241
264
  ": var(--surface-clear);\n "
242
265
  ]);
243
- _templateObject9 = function _templateObject() {
266
+ _templateObject10 = function _templateObject() {
244
267
  return data;
245
268
  };
246
269
  return data;
247
270
  }
248
- function _templateObject10() {
271
+ function _templateObject11() {
249
272
  var data = _tagged_template_literal([
250
273
  "\n ",
251
274
  ": var(--on-dark-text-primary);\n ",
@@ -255,12 +278,12 @@ function _templateObject10() {
255
278
  ": var(--text-warning);\n ",
256
279
  ": var(--surface-clear);\n "
257
280
  ]);
258
- _templateObject10 = function _templateObject() {
281
+ _templateObject11 = function _templateObject() {
259
282
  return data;
260
283
  };
261
284
  return data;
262
285
  }
263
- function _templateObject11() {
286
+ function _templateObject12() {
264
287
  var data = _tagged_template_literal([
265
288
  "\n ",
266
289
  ": var(--on-dark-text-primary);\n ",
@@ -270,12 +293,12 @@ function _templateObject11() {
270
293
  ": var(--text-negative);\n ",
271
294
  ": var(--surface-clear);\n "
272
295
  ]);
273
- _templateObject11 = function _templateObject() {
296
+ _templateObject12 = function _templateObject() {
274
297
  return data;
275
298
  };
276
299
  return data;
277
300
  }
278
- function _templateObject12() {
301
+ function _templateObject13() {
279
302
  var data = _tagged_template_literal([
280
303
  "\n ",
281
304
  ": var(--on-dark-text-primary);\n ",
@@ -285,12 +308,12 @@ function _templateObject12() {
285
308
  ": var(--on-light-text-primary);\n ",
286
309
  ": var(--surface-clear);\n "
287
310
  ]);
288
- _templateObject12 = function _templateObject() {
311
+ _templateObject13 = function _templateObject() {
289
312
  return data;
290
313
  };
291
314
  return data;
292
315
  }
293
- function _templateObject13() {
316
+ function _templateObject14() {
294
317
  var data = _tagged_template_literal([
295
318
  "\n ",
296
319
  ": var(--on-light-text-primary);\n ",
@@ -300,84 +323,84 @@ function _templateObject13() {
300
323
  ": var(--on-dark-text-primary);\n ",
301
324
  ": var(--surface-clear);\n "
302
325
  ]);
303
- _templateObject13 = function _templateObject() {
326
+ _templateObject14 = function _templateObject() {
304
327
  return data;
305
328
  };
306
329
  return data;
307
330
  }
308
- function _templateObject14() {
331
+ function _templateObject15() {
309
332
  var data = _tagged_template_literal([
310
333
  "\n ",
311
334
  ": var(--inverse-text-primary);\n ",
312
335
  ": var(--surface-solid-default);\n "
313
336
  ]);
314
- _templateObject14 = function _templateObject() {
337
+ _templateObject15 = function _templateObject() {
315
338
  return data;
316
339
  };
317
340
  return data;
318
341
  }
319
- function _templateObject15() {
342
+ function _templateObject16() {
320
343
  var data = _tagged_template_literal([
321
344
  "\n ",
322
345
  ": var(--on-dark-text-primary);\n ",
323
346
  ": var(--surface-accent);\n "
324
347
  ]);
325
- _templateObject15 = function _templateObject() {
348
+ _templateObject16 = function _templateObject() {
326
349
  return data;
327
350
  };
328
351
  return data;
329
352
  }
330
- function _templateObject16() {
353
+ function _templateObject17() {
331
354
  var data = _tagged_template_literal([
332
355
  "\n ",
333
356
  ": var(--on-dark-text-primary);\n ",
334
357
  ": var(--surface-positive);\n "
335
358
  ]);
336
- _templateObject16 = function _templateObject() {
359
+ _templateObject17 = function _templateObject() {
337
360
  return data;
338
361
  };
339
362
  return data;
340
363
  }
341
- function _templateObject17() {
364
+ function _templateObject18() {
342
365
  var data = _tagged_template_literal([
343
366
  "\n ",
344
367
  ": var(--on-dark-text-primary);\n ",
345
368
  ": var(--surface-warning);\n "
346
369
  ]);
347
- _templateObject17 = function _templateObject() {
370
+ _templateObject18 = function _templateObject() {
348
371
  return data;
349
372
  };
350
373
  return data;
351
374
  }
352
- function _templateObject18() {
375
+ function _templateObject19() {
353
376
  var data = _tagged_template_literal([
354
377
  "\n ",
355
378
  ": var(--on-dark-text-primary);\n ",
356
379
  ": var(--surface-negative);\n "
357
380
  ]);
358
- _templateObject18 = function _templateObject() {
381
+ _templateObject19 = function _templateObject() {
359
382
  return data;
360
383
  };
361
384
  return data;
362
385
  }
363
- function _templateObject19() {
386
+ function _templateObject20() {
364
387
  var data = _tagged_template_literal([
365
388
  "\n ",
366
389
  ": var(--on-dark-text-primary);\n ",
367
390
  ": var(--on-light-surface-solid-default);\n "
368
391
  ]);
369
- _templateObject19 = function _templateObject() {
392
+ _templateObject20 = function _templateObject() {
370
393
  return data;
371
394
  };
372
395
  return data;
373
396
  }
374
- function _templateObject20() {
397
+ function _templateObject21() {
375
398
  var data = _tagged_template_literal([
376
399
  "\n ",
377
400
  ": var(--on-light-text-primary);\n ",
378
401
  ": var(--on-dark-surface-solid-default);\n "
379
402
  ]);
380
- _templateObject20 = function _templateObject() {
403
+ _templateObject21 = function _templateObject() {
381
404
  return data;
382
405
  };
383
406
  return data;
@@ -385,7 +408,8 @@ function _templateObject20() {
385
408
  var config = {
386
409
  defaults: {
387
410
  view: 'default',
388
- size: 'xxl'
411
+ size: 'xxl',
412
+ shape: 'circled'
389
413
  },
390
414
  variations: {
391
415
  view: {
@@ -393,32 +417,33 @@ var config = {
393
417
  },
394
418
  size: {
395
419
  // TODO: #1044 токены типографики в Avatar
396
- xxl: (0, _styledcomponents.css)(_templateObject1(), _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.fontSize, _styledcomponents.avatarTokens.fontWeight, _styledcomponents.avatarTokens.lineHeight, _styledcomponents.avatarTokens.statusIconSize, _styledcomponents.avatarTokens.badgeBorderRadius, _styledcomponents.avatarTokens.badgeHeight, _styledcomponents.avatarTokens.badgePadding, _styledcomponents.avatarTokens.badgePaddingIconOnly, _styledcomponents.avatarTokens.badgeFontFamily, _styledcomponents.avatarTokens.badgeFontSize, _styledcomponents.avatarTokens.badgeFontStyle, _styledcomponents.avatarTokens.badgeFontWeight, _styledcomponents.avatarTokens.badgeLetterSpacing, _styledcomponents.avatarTokens.badgeLineHeight, _styledcomponents.avatarTokens.badgeLeftContentMarginLeft, _styledcomponents.avatarTokens.badgeLeftContentMarginRight, _styledcomponents.avatarTokens.badgeRightContentMarginLeft, _styledcomponents.avatarTokens.badgeRightContentMarginRight, _styledcomponents.avatarTokens.badgePilledBorderRadius, _styledcomponents.avatarTokens.counterBorderRadius, _styledcomponents.avatarTokens.counterHeight, _styledcomponents.avatarTokens.counterPadding, _styledcomponents.avatarTokens.counterFontFamily, _styledcomponents.avatarTokens.counterFontSize, _styledcomponents.avatarTokens.counterFontStyle, _styledcomponents.avatarTokens.counterFontWeight, _styledcomponents.avatarTokens.counterLetterSpacing, _styledcomponents.avatarTokens.counterLineHeight),
397
- l: (0, _styledcomponents.css)(_templateObject2(), _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.fontSize, _styledcomponents.avatarTokens.fontWeight, _styledcomponents.avatarTokens.lineHeight, _styledcomponents.avatarTokens.statusIconSize, _styledcomponents.avatarTokens.extraPlacementFactor, _styledcomponents.avatarTokens.badgeBorderRadius, _styledcomponents.avatarTokens.badgeHeight, _styledcomponents.avatarTokens.badgePadding, _styledcomponents.avatarTokens.badgePaddingIconOnly, _styledcomponents.avatarTokens.badgeFontFamily, _styledcomponents.avatarTokens.badgeFontSize, _styledcomponents.avatarTokens.badgeFontStyle, _styledcomponents.avatarTokens.badgeFontWeight, _styledcomponents.avatarTokens.badgeLetterSpacing, _styledcomponents.avatarTokens.badgeLineHeight, _styledcomponents.avatarTokens.badgeLeftContentMarginLeft, _styledcomponents.avatarTokens.badgeLeftContentMarginRight, _styledcomponents.avatarTokens.badgeRightContentMarginLeft, _styledcomponents.avatarTokens.badgeRightContentMarginRight, _styledcomponents.avatarTokens.badgePilledBorderRadius, _styledcomponents.avatarTokens.counterBorderRadius, _styledcomponents.avatarTokens.counterHeight, _styledcomponents.avatarTokens.counterPadding, _styledcomponents.avatarTokens.counterFontFamily, _styledcomponents.avatarTokens.counterFontSize, _styledcomponents.avatarTokens.counterFontStyle, _styledcomponents.avatarTokens.counterFontWeight, _styledcomponents.avatarTokens.counterLetterSpacing, _styledcomponents.avatarTokens.counterLineHeight),
398
- m: (0, _styledcomponents.css)(_templateObject3(), _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.fontSize, _styledcomponents.avatarTokens.fontWeight, _styledcomponents.avatarTokens.lineHeight, _styledcomponents.avatarTokens.statusIconSize, _styledcomponents.avatarTokens.extraPlacementFactor, _styledcomponents.avatarTokens.badgeBorderRadius, _styledcomponents.avatarTokens.badgeHeight, _styledcomponents.avatarTokens.badgePadding, _styledcomponents.avatarTokens.badgePaddingIconOnly, _styledcomponents.avatarTokens.badgeFontFamily, _styledcomponents.avatarTokens.badgeFontSize, _styledcomponents.avatarTokens.badgeFontStyle, _styledcomponents.avatarTokens.badgeFontWeight, _styledcomponents.avatarTokens.badgeLetterSpacing, _styledcomponents.avatarTokens.badgeLineHeight, _styledcomponents.avatarTokens.badgeLeftContentMarginLeft, _styledcomponents.avatarTokens.badgeLeftContentMarginRight, _styledcomponents.avatarTokens.badgeRightContentMarginLeft, _styledcomponents.avatarTokens.badgeRightContentMarginRight, _styledcomponents.avatarTokens.badgePilledBorderRadius, _styledcomponents.avatarTokens.counterBorderRadius, _styledcomponents.avatarTokens.counterHeight, _styledcomponents.avatarTokens.counterPadding, _styledcomponents.avatarTokens.counterFontFamily, _styledcomponents.avatarTokens.counterFontSize, _styledcomponents.avatarTokens.counterFontStyle, _styledcomponents.avatarTokens.counterFontWeight, _styledcomponents.avatarTokens.counterLetterSpacing, _styledcomponents.avatarTokens.counterLineHeight),
399
- s: (0, _styledcomponents.css)(_templateObject4(), _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.fontSize, _styledcomponents.avatarTokens.fontWeight, _styledcomponents.avatarTokens.lineHeight, _styledcomponents.avatarTokens.statusIconSize, _styledcomponents.avatarTokens.extraPlacementFactor, _styledcomponents.avatarTokens.counterBorderRadius, _styledcomponents.avatarTokens.counterHeight, _styledcomponents.avatarTokens.counterPadding, _styledcomponents.avatarTokens.counterFontFamily, _styledcomponents.avatarTokens.counterFontSize, _styledcomponents.avatarTokens.counterFontStyle, _styledcomponents.avatarTokens.counterFontWeight, _styledcomponents.avatarTokens.counterLetterSpacing, _styledcomponents.avatarTokens.counterLineHeight),
420
+ xxl: (0, _styledcomponents.css)(_templateObject1(), _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.fontSize, _styledcomponents.avatarTokens.fontWeight, _styledcomponents.avatarTokens.lineHeight, _styledcomponents.avatarTokens.statusIconSize, _styledcomponents.avatarTokens.borderRadius, _styledcomponents.avatarTokens.badgeBorderRadius, _styledcomponents.avatarTokens.badgeHeight, _styledcomponents.avatarTokens.badgePadding, _styledcomponents.avatarTokens.badgePaddingIconOnly, _styledcomponents.avatarTokens.badgeFontFamily, _styledcomponents.avatarTokens.badgeFontSize, _styledcomponents.avatarTokens.badgeFontStyle, _styledcomponents.avatarTokens.badgeFontWeight, _styledcomponents.avatarTokens.badgeLetterSpacing, _styledcomponents.avatarTokens.badgeLineHeight, _styledcomponents.avatarTokens.badgeLeftContentMarginLeft, _styledcomponents.avatarTokens.badgeLeftContentMarginRight, _styledcomponents.avatarTokens.badgeRightContentMarginLeft, _styledcomponents.avatarTokens.badgeRightContentMarginRight, _styledcomponents.avatarTokens.badgePilledBorderRadius, _styledcomponents.avatarTokens.counterBorderRadius, _styledcomponents.avatarTokens.counterHeight, _styledcomponents.avatarTokens.counterPadding, _styledcomponents.avatarTokens.counterFontFamily, _styledcomponents.avatarTokens.counterFontSize, _styledcomponents.avatarTokens.counterFontStyle, _styledcomponents.avatarTokens.counterFontWeight, _styledcomponents.avatarTokens.counterLetterSpacing, _styledcomponents.avatarTokens.counterLineHeight),
421
+ l: (0, _styledcomponents.css)(_templateObject2(), _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.fontSize, _styledcomponents.avatarTokens.fontWeight, _styledcomponents.avatarTokens.lineHeight, _styledcomponents.avatarTokens.statusIconSize, _styledcomponents.avatarTokens.borderRadius, _styledcomponents.avatarTokens.extraPlacementFactor, _styledcomponents.avatarTokens.badgeBorderRadius, _styledcomponents.avatarTokens.badgeHeight, _styledcomponents.avatarTokens.badgePadding, _styledcomponents.avatarTokens.badgePaddingIconOnly, _styledcomponents.avatarTokens.badgeFontFamily, _styledcomponents.avatarTokens.badgeFontSize, _styledcomponents.avatarTokens.badgeFontStyle, _styledcomponents.avatarTokens.badgeFontWeight, _styledcomponents.avatarTokens.badgeLetterSpacing, _styledcomponents.avatarTokens.badgeLineHeight, _styledcomponents.avatarTokens.badgeLeftContentMarginLeft, _styledcomponents.avatarTokens.badgeLeftContentMarginRight, _styledcomponents.avatarTokens.badgeRightContentMarginLeft, _styledcomponents.avatarTokens.badgeRightContentMarginRight, _styledcomponents.avatarTokens.badgePilledBorderRadius, _styledcomponents.avatarTokens.counterBorderRadius, _styledcomponents.avatarTokens.counterHeight, _styledcomponents.avatarTokens.counterPadding, _styledcomponents.avatarTokens.counterFontFamily, _styledcomponents.avatarTokens.counterFontSize, _styledcomponents.avatarTokens.counterFontStyle, _styledcomponents.avatarTokens.counterFontWeight, _styledcomponents.avatarTokens.counterLetterSpacing, _styledcomponents.avatarTokens.counterLineHeight),
422
+ m: (0, _styledcomponents.css)(_templateObject3(), _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.fontSize, _styledcomponents.avatarTokens.fontWeight, _styledcomponents.avatarTokens.lineHeight, _styledcomponents.avatarTokens.statusIconSize, _styledcomponents.avatarTokens.borderRadius, _styledcomponents.avatarTokens.extraPlacementFactor, _styledcomponents.avatarTokens.badgeBorderRadius, _styledcomponents.avatarTokens.badgeHeight, _styledcomponents.avatarTokens.badgePadding, _styledcomponents.avatarTokens.badgePaddingIconOnly, _styledcomponents.avatarTokens.badgeFontFamily, _styledcomponents.avatarTokens.badgeFontSize, _styledcomponents.avatarTokens.badgeFontStyle, _styledcomponents.avatarTokens.badgeFontWeight, _styledcomponents.avatarTokens.badgeLetterSpacing, _styledcomponents.avatarTokens.badgeLineHeight, _styledcomponents.avatarTokens.badgeLeftContentMarginLeft, _styledcomponents.avatarTokens.badgeLeftContentMarginRight, _styledcomponents.avatarTokens.badgeRightContentMarginLeft, _styledcomponents.avatarTokens.badgeRightContentMarginRight, _styledcomponents.avatarTokens.badgePilledBorderRadius, _styledcomponents.avatarTokens.counterBorderRadius, _styledcomponents.avatarTokens.counterHeight, _styledcomponents.avatarTokens.counterPadding, _styledcomponents.avatarTokens.counterFontFamily, _styledcomponents.avatarTokens.counterFontSize, _styledcomponents.avatarTokens.counterFontStyle, _styledcomponents.avatarTokens.counterFontWeight, _styledcomponents.avatarTokens.counterLetterSpacing, _styledcomponents.avatarTokens.counterLineHeight),
423
+ s: (0, _styledcomponents.css)(_templateObject4(), _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.fontSize, _styledcomponents.avatarTokens.fontWeight, _styledcomponents.avatarTokens.lineHeight, _styledcomponents.avatarTokens.statusIconSize, _styledcomponents.avatarTokens.borderRadius, _styledcomponents.avatarTokens.extraPlacementFactor, _styledcomponents.avatarTokens.counterBorderRadius, _styledcomponents.avatarTokens.counterHeight, _styledcomponents.avatarTokens.counterPadding, _styledcomponents.avatarTokens.counterFontFamily, _styledcomponents.avatarTokens.counterFontSize, _styledcomponents.avatarTokens.counterFontStyle, _styledcomponents.avatarTokens.counterFontWeight, _styledcomponents.avatarTokens.counterLetterSpacing, _styledcomponents.avatarTokens.counterLineHeight),
400
424
  fit: (0, _styledcomponents.css)(_templateObject5(), _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.fontSize, _styledcomponents.avatarTokens.fontWeight, _styledcomponents.avatarTokens.lineHeight, _styledcomponents.avatarTokens.statusIconSize)
401
425
  },
402
- focused: {
403
- true: (0, _styledcomponents.css)(_templateObject6(), _styledcomponents.avatarTokens.outlineSize, _styledcomponents.avatarTokens.outlineOffset, _styledcomponents.avatarTokens.outlineColor)
426
+ shape: {
427
+ circled: (0, _styledcomponents.css)(_templateObject6(), _styledcomponents.avatarTokens.borderRadius, _styledcomponents.avatarTokens.statusLeft, _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.statusIconSize, _styledcomponents.avatarTokens.statusTop, _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.statusIconSize),
428
+ rounded: (0, _styledcomponents.css)(_templateObject7(), _styledcomponents.avatarTokens.statusLeft, _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.statusIconSize, _styledcomponents.avatarTokens.statusTop, _styledcomponents.avatarTokens.avatarSize, _styledcomponents.avatarTokens.statusIconSize)
404
429
  },
405
430
  badgeView: {
406
- default: (0, _styledcomponents.css)(_templateObject7(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
407
- accent: (0, _styledcomponents.css)(_templateObject8(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
408
- positive: (0, _styledcomponents.css)(_templateObject9(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
409
- warning: (0, _styledcomponents.css)(_templateObject10(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
410
- negative: (0, _styledcomponents.css)(_templateObject11(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
411
- dark: (0, _styledcomponents.css)(_templateObject12(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
412
- light: (0, _styledcomponents.css)(_templateObject13(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear)
431
+ default: (0, _styledcomponents.css)(_templateObject8(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
432
+ accent: (0, _styledcomponents.css)(_templateObject9(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
433
+ positive: (0, _styledcomponents.css)(_templateObject10(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
434
+ warning: (0, _styledcomponents.css)(_templateObject11(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
435
+ negative: (0, _styledcomponents.css)(_templateObject12(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
436
+ dark: (0, _styledcomponents.css)(_templateObject13(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear),
437
+ light: (0, _styledcomponents.css)(_templateObject14(), _styledcomponents.avatarTokens.badgeColor, _styledcomponents.avatarTokens.badgeBackground, _styledcomponents.avatarTokens.badgeColorTransparent, _styledcomponents.avatarTokens.badgeBackgroundTransparent, _styledcomponents.avatarTokens.badgeColorClear, _styledcomponents.avatarTokens.badgeBackgroundClear)
413
438
  },
414
439
  counterView: {
415
- default: (0, _styledcomponents.css)(_templateObject14(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
416
- accent: (0, _styledcomponents.css)(_templateObject15(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
417
- positive: (0, _styledcomponents.css)(_templateObject16(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
418
- warning: (0, _styledcomponents.css)(_templateObject17(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
419
- negative: (0, _styledcomponents.css)(_templateObject18(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
420
- dark: (0, _styledcomponents.css)(_templateObject19(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
421
- light: (0, _styledcomponents.css)(_templateObject20(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground)
440
+ default: (0, _styledcomponents.css)(_templateObject15(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
441
+ accent: (0, _styledcomponents.css)(_templateObject16(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
442
+ positive: (0, _styledcomponents.css)(_templateObject17(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
443
+ warning: (0, _styledcomponents.css)(_templateObject18(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
444
+ negative: (0, _styledcomponents.css)(_templateObject19(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
445
+ dark: (0, _styledcomponents.css)(_templateObject20(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground),
446
+ light: (0, _styledcomponents.css)(_templateObject21(), _styledcomponents.avatarTokens.counterColor, _styledcomponents.avatarTokens.counterBackground)
422
447
  }
423
448
  }
424
449
  };
package/components/Avatar/Avatar.d.ts CHANGED
@@ -9,8 +9,9 @@ declare const mergedConfig: import("@salutejs/plasma-new-hope/styled-components"
9
9
  s: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
10
10
  fit: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
11
11
  };
12
- focused: {
13
- true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
12
+ shape: {
13
+ circled: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
14
+ rounded: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
14
15
  };
15
16
  badgeView: {
16
17
  default: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
@@ -41,8 +42,9 @@ declare const mergedConfig: import("@salutejs/plasma-new-hope/styled-components"
41
42
  s: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
42
43
  fit: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
43
44
  };
44
- focused: {
45
- true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
45
+ shape: {
46
+ circled: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
47
+ rounded: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
46
48
  };
47
49
  badgeView: {
48
50
  default: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
@@ -63,6 +65,7 @@ declare const mergedConfig: import("@salutejs/plasma-new-hope/styled-components"
63
65
  light: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
64
66
  };
65
67
  }>, (import("react").HTMLAttributes<HTMLDivElement> & {
68
+ shape?: "string";
66
69
  size?: string;
67
70
  name?: string;
68
71
  url?: string;
@@ -87,6 +90,7 @@ declare const mergedConfig: import("@salutejs/plasma-new-hope/styled-components"
87
90
  count?: undefined;
88
91
  maxCount?: undefined;
89
92
  } & import("react").RefAttributes<HTMLDivElement>) | (import("react").HTMLAttributes<HTMLDivElement> & {
93
+ shape?: "string";
90
94
  size?: string;
91
95
  name?: string;
92
96
  url?: string;
@@ -122,8 +126,9 @@ declare const Avatar: import("react").FunctionComponent<import("@salutejs/plasma
122
126
  s: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
123
127
  fit: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
124
128
  };
125
- focused: {
126
- true: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
129
+ shape: {
130
+ circled: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
131
+ rounded: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
127
132
  };
128
133
  badgeView: {
129
134
  default: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
@@ -144,6 +149,7 @@ declare const Avatar: import("react").FunctionComponent<import("@salutejs/plasma
144
149
  light: import("@salutejs/plasma-new-hope/types/engines/types").PolymorphicClassName;
145
150
  };
146
151
  }> & ((import("react").HTMLAttributes<HTMLDivElement> & {
152
+ shape?: "string";
147
153
  size?: string;
148
154
  name?: string;
149
155
  url?: string;
@@ -168,6 +174,7 @@ declare const Avatar: import("react").FunctionComponent<import("@salutejs/plasma
168
174
  count?: undefined;
169
175
  maxCount?: undefined;
170
176
  } & import("react").RefAttributes<HTMLDivElement>) | (import("react").HTMLAttributes<HTMLDivElement> & {
177
+ shape?: "string";
171
178
  size?: string;
172
179
  name?: string;
173
180
  url?: string;
package/es/components/Avatar/Avatar.config.js CHANGED
@@ -30,7 +30,8 @@ function _templateObject1() {
30
30
  ": 2rem;\n ",
31
31
  ": 600;\n ",
32
32
  ": 2rem;\n ",
33
- ": 0.75rem;\n\n ",
33
+ ": 0.75rem;\n ",
34
+ ": 1.125rem;\n\n ",
34
35
  ": 0.5rem;\n ",
35
36
  ": 1.75rem;\n ",
36
37
  ": 0 0.688rem;\n ",
@@ -68,7 +69,8 @@ function _templateObject2() {
68
69
  ": 1.25rem;\n ",
69
70
  ": 600;\n ",
70
71
  ": 1.25rem;\n ",
71
- ": 0.5rem;\n\n ",
72
+ ": 0.5rem;\n ",
73
+ ": 0.75rem;\n\n ",
72
74
  ": 2;\n\n ",
73
75
  ": 0.375rem;\n ",
74
76
  ": 1.25rem;\n ",
@@ -107,7 +109,8 @@ function _templateObject3() {
107
109
  ": 0.875rem;\n ",
108
110
  ": 600;\n ",
109
111
  ": 0.875rem;\n ",
110
- ": 0.5rem;\n\n ",
112
+ ": 0.5rem;\n ",
113
+ ": 0.625rem;\n\n ",
111
114
  ": 2;\n\n ",
112
115
  ": 0.25rem;\n ",
113
116
  ": 1rem;\n ",
@@ -146,7 +149,8 @@ function _templateObject4() {
146
149
  ": 0.5rem;\n ",
147
150
  ": 600;\n ",
148
151
  ": 0.5rem;\n ",
149
- ": 0.375rem;\n\n ",
152
+ ": 0.375rem;\n ",
153
+ ": 0.5rem;\n\n ",
150
154
  ": 1;\n\n ",
151
155
  ": 1rem;\n ",
152
156
  ": 0.75rem;\n ",
@@ -180,9 +184,13 @@ function _templateObject5() {
180
184
  function _templateObject6() {
181
185
  var data = _tagged_template_literal([
182
186
  "\n ",
183
- ": 0.1rem;\n ",
184
- ": -0.2rem;\n ",
185
- ": var(--surface-accent);\n "
187
+ ": 50%;\n ",
188
+ ": calc(0.867 * var(",
189
+ ") - var(",
190
+ ") / 2);\n ",
191
+ ": calc(0.867 * var(",
192
+ ") - var(",
193
+ ") / 2);\n "
186
194
  ]);
187
195
  _templateObject6 = function _templateObject() {
188
196
  return data;
@@ -190,6 +198,21 @@ function _templateObject6() {
190
198
  return data;
191
199
  }
192
200
  function _templateObject7() {
201
+ var data = _tagged_template_literal([
202
+ "\n ",
203
+ ": calc(var(",
204
+ ") - var(",
205
+ "));\n ",
206
+ ": calc(var(",
207
+ ") - var(",
208
+ "));\n "
209
+ ]);
210
+ _templateObject7 = function _templateObject() {
211
+ return data;
212
+ };
213
+ return data;
214
+ }
215
+ function _templateObject8() {
193
216
  var data = _tagged_template_literal([
194
217
  "\n ",
195
218
  ": var(--inverse-text-primary);\n ",
@@ -199,12 +222,12 @@ function _templateObject7() {
199
222
  ": var(--text-primary);\n ",
200
223
  ": var(--surface-clear);\n "
201
224
  ]);
202
- _templateObject7 = function _templateObject() {
225
+ _templateObject8 = function _templateObject() {
203
226
  return data;
204
227
  };
205
228
  return data;
206
229
  }
207
- function _templateObject8() {
230
+ function _templateObject9() {
208
231
  var data = _tagged_template_literal([
209
232
  "\n ",
210
233
  ": var(--on-dark-text-primary);\n ",
@@ -214,12 +237,12 @@ function _templateObject8() {
214
237
  ": var(--text-accent);\n ",
215
238
  ": var(--surface-clear);\n "
216
239
  ]);
217
- _templateObject8 = function _templateObject() {
240
+ _templateObject9 = function _templateObject() {
218
241
  return data;
219
242
  };
220
243
  return data;
221
244
  }
222
- function _templateObject9() {
245
+ function _templateObject10() {
223
246
  var data = _tagged_template_literal([
224
247
  "\n ",
225
248
  ": var(--on-dark-text-primary);\n ",
@@ -229,12 +252,12 @@ function _templateObject9() {
229
252
  ": var(--text-positive);\n ",
230
253
  ": var(--surface-clear);\n "
231
254
  ]);
232
- _templateObject9 = function _templateObject() {
255
+ _templateObject10 = function _templateObject() {
233
256
  return data;
234
257
  };
235
258
  return data;
236
259
  }
237
- function _templateObject10() {
260
+ function _templateObject11() {
238
261
  var data = _tagged_template_literal([
239
262
  "\n ",
240
263
  ": var(--on-dark-text-primary);\n ",
@@ -244,12 +267,12 @@ function _templateObject10() {
244
267
  ": var(--text-warning);\n ",
245
268
  ": var(--surface-clear);\n "
246
269
  ]);
247
- _templateObject10 = function _templateObject() {
270
+ _templateObject11 = function _templateObject() {
248
271
  return data;
249
272
  };
250
273
  return data;
251
274
  }
252
- function _templateObject11() {
275
+ function _templateObject12() {
253
276
  var data = _tagged_template_literal([
254
277
  "\n ",
255
278
  ": var(--on-dark-text-primary);\n ",
@@ -259,12 +282,12 @@ function _templateObject11() {
259
282
  ": var(--text-negative);\n ",
260
283
  ": var(--surface-clear);\n "
261
284
  ]);
262
- _templateObject11 = function _templateObject() {
285
+ _templateObject12 = function _templateObject() {
263
286
  return data;
264
287
  };
265
288
  return data;
266
289
  }
267
- function _templateObject12() {
290
+ function _templateObject13() {
268
291
  var data = _tagged_template_literal([
269
292
  "\n ",
270
293
  ": var(--on-dark-text-primary);\n ",
@@ -274,12 +297,12 @@ function _templateObject12() {
274
297
  ": var(--on-light-text-primary);\n ",
275
298
  ": var(--surface-clear);\n "
276
299
  ]);
277
- _templateObject12 = function _templateObject() {
300
+ _templateObject13 = function _templateObject() {
278
301
  return data;
279
302
  };
280
303
  return data;
281
304
  }
282
- function _templateObject13() {
305
+ function _templateObject14() {
283
306
  var data = _tagged_template_literal([
284
307
  "\n ",
285
308
  ": var(--on-light-text-primary);\n ",
@@ -289,84 +312,84 @@ function _templateObject13() {
289
312
  ": var(--on-dark-text-primary);\n ",
290
313
  ": var(--surface-clear);\n "
291
314
  ]);
292
- _templateObject13 = function _templateObject() {
315
+ _templateObject14 = function _templateObject() {
293
316
  return data;
294
317
  };
295
318
  return data;
296
319
  }
297
- function _templateObject14() {
320
+ function _templateObject15() {
298
321
  var data = _tagged_template_literal([
299
322
  "\n ",
300
323
  ": var(--inverse-text-primary);\n ",
301
324
  ": var(--surface-solid-default);\n "
302
325
  ]);
303
- _templateObject14 = function _templateObject() {
326
+ _templateObject15 = function _templateObject() {
304
327
  return data;
305
328
  };
306
329
  return data;
307
330
  }
308
- function _templateObject15() {
331
+ function _templateObject16() {
309
332
  var data = _tagged_template_literal([
310
333
  "\n ",
311
334
  ": var(--on-dark-text-primary);\n ",
312
335
  ": var(--surface-accent);\n "
313
336
  ]);
314
- _templateObject15 = function _templateObject() {
337
+ _templateObject16 = function _templateObject() {
315
338
  return data;
316
339
  };
317
340
  return data;
318
341
  }
319
- function _templateObject16() {
342
+ function _templateObject17() {
320
343
  var data = _tagged_template_literal([
321
344
  "\n ",
322
345
  ": var(--on-dark-text-primary);\n ",
323
346
  ": var(--surface-positive);\n "
324
347
  ]);
325
- _templateObject16 = function _templateObject() {
348
+ _templateObject17 = function _templateObject() {
326
349
  return data;
327
350
  };
328
351
  return data;
329
352
  }
330
- function _templateObject17() {
353
+ function _templateObject18() {
331
354
  var data = _tagged_template_literal([
332
355
  "\n ",
333
356
  ": var(--on-dark-text-primary);\n ",
334
357
  ": var(--surface-warning);\n "
335
358
  ]);
336
- _templateObject17 = function _templateObject() {
359
+ _templateObject18 = function _templateObject() {
337
360
  return data;
338
361
  };
339
362
  return data;
340
363
  }
341
- function _templateObject18() {
364
+ function _templateObject19() {
342
365
  var data = _tagged_template_literal([
343
366
  "\n ",
344
367
  ": var(--on-dark-text-primary);\n ",
345
368
  ": var(--surface-negative);\n "
346
369
  ]);
347
- _templateObject18 = function _templateObject() {
370
+ _templateObject19 = function _templateObject() {
348
371
  return data;
349
372
  };
350
373
  return data;
351
374
  }
352
- function _templateObject19() {
375
+ function _templateObject20() {
353
376
  var data = _tagged_template_literal([
354
377
  "\n ",
355
378
  ": var(--on-dark-text-primary);\n ",
356
379
  ": var(--on-light-surface-solid-default);\n "
357
380
  ]);
358
- _templateObject19 = function _templateObject() {
381
+ _templateObject20 = function _templateObject() {
359
382
  return data;
360
383
  };
361
384
  return data;
362
385
  }
363
- function _templateObject20() {
386
+ function _templateObject21() {
364
387
  var data = _tagged_template_literal([
365
388
  "\n ",
366
389
  ": var(--on-light-text-primary);\n ",
367
390
  ": var(--on-dark-surface-solid-default);\n "
368
391
  ]);
369
- _templateObject20 = function _templateObject() {
392
+ _templateObject21 = function _templateObject() {
370
393
  return data;
371
394
  };
372
395
  return data;
@@ -375,7 +398,8 @@ import { css, avatarTokens as tokens } from '@salutejs/plasma-new-hope/styled-co
375
398
  export var config = {
376
399
  defaults: {
377
400
  view: 'default',
378
- size: 'xxl'
401
+ size: 'xxl',
402
+ shape: 'circled'
379
403
  },
380
404
  variations: {
381
405
  view: {
@@ -383,32 +407,33 @@ export var config = {
383
407
  },
384
408
  size: {
385
409
  // TODO: #1044 токены типографики в Avatar
386
- xxl: css(_templateObject1(), tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.badgeBorderRadius, tokens.badgeHeight, tokens.badgePadding, tokens.badgePaddingIconOnly, tokens.badgeFontFamily, tokens.badgeFontSize, tokens.badgeFontStyle, tokens.badgeFontWeight, tokens.badgeLetterSpacing, tokens.badgeLineHeight, tokens.badgeLeftContentMarginLeft, tokens.badgeLeftContentMarginRight, tokens.badgeRightContentMarginLeft, tokens.badgeRightContentMarginRight, tokens.badgePilledBorderRadius, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
387
- l: css(_templateObject2(), tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.extraPlacementFactor, tokens.badgeBorderRadius, tokens.badgeHeight, tokens.badgePadding, tokens.badgePaddingIconOnly, tokens.badgeFontFamily, tokens.badgeFontSize, tokens.badgeFontStyle, tokens.badgeFontWeight, tokens.badgeLetterSpacing, tokens.badgeLineHeight, tokens.badgeLeftContentMarginLeft, tokens.badgeLeftContentMarginRight, tokens.badgeRightContentMarginLeft, tokens.badgeRightContentMarginRight, tokens.badgePilledBorderRadius, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
388
- m: css(_templateObject3(), tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.extraPlacementFactor, tokens.badgeBorderRadius, tokens.badgeHeight, tokens.badgePadding, tokens.badgePaddingIconOnly, tokens.badgeFontFamily, tokens.badgeFontSize, tokens.badgeFontStyle, tokens.badgeFontWeight, tokens.badgeLetterSpacing, tokens.badgeLineHeight, tokens.badgeLeftContentMarginLeft, tokens.badgeLeftContentMarginRight, tokens.badgeRightContentMarginLeft, tokens.badgeRightContentMarginRight, tokens.badgePilledBorderRadius, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
389
- s: css(_templateObject4(), tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.extraPlacementFactor, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
410
+ xxl: css(_templateObject1(), tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.borderRadius, tokens.badgeBorderRadius, tokens.badgeHeight, tokens.badgePadding, tokens.badgePaddingIconOnly, tokens.badgeFontFamily, tokens.badgeFontSize, tokens.badgeFontStyle, tokens.badgeFontWeight, tokens.badgeLetterSpacing, tokens.badgeLineHeight, tokens.badgeLeftContentMarginLeft, tokens.badgeLeftContentMarginRight, tokens.badgeRightContentMarginLeft, tokens.badgeRightContentMarginRight, tokens.badgePilledBorderRadius, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
411
+ l: css(_templateObject2(), tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.borderRadius, tokens.extraPlacementFactor, tokens.badgeBorderRadius, tokens.badgeHeight, tokens.badgePadding, tokens.badgePaddingIconOnly, tokens.badgeFontFamily, tokens.badgeFontSize, tokens.badgeFontStyle, tokens.badgeFontWeight, tokens.badgeLetterSpacing, tokens.badgeLineHeight, tokens.badgeLeftContentMarginLeft, tokens.badgeLeftContentMarginRight, tokens.badgeRightContentMarginLeft, tokens.badgeRightContentMarginRight, tokens.badgePilledBorderRadius, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
412
+ m: css(_templateObject3(), tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.borderRadius, tokens.extraPlacementFactor, tokens.badgeBorderRadius, tokens.badgeHeight, tokens.badgePadding, tokens.badgePaddingIconOnly, tokens.badgeFontFamily, tokens.badgeFontSize, tokens.badgeFontStyle, tokens.badgeFontWeight, tokens.badgeLetterSpacing, tokens.badgeLineHeight, tokens.badgeLeftContentMarginLeft, tokens.badgeLeftContentMarginRight, tokens.badgeRightContentMarginLeft, tokens.badgeRightContentMarginRight, tokens.badgePilledBorderRadius, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
413
+ s: css(_templateObject4(), tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize, tokens.borderRadius, tokens.extraPlacementFactor, tokens.counterBorderRadius, tokens.counterHeight, tokens.counterPadding, tokens.counterFontFamily, tokens.counterFontSize, tokens.counterFontStyle, tokens.counterFontWeight, tokens.counterLetterSpacing, tokens.counterLineHeight),
390
414
  fit: css(_templateObject5(), tokens.avatarSize, tokens.fontSize, tokens.fontWeight, tokens.lineHeight, tokens.statusIconSize)
391
415
  },
392
- focused: {
393
- true: css(_templateObject6(), tokens.outlineSize, tokens.outlineOffset, tokens.outlineColor)
416
+ shape: {
417
+ circled: css(_templateObject6(), tokens.borderRadius, tokens.statusLeft, tokens.avatarSize, tokens.statusIconSize, tokens.statusTop, tokens.avatarSize, tokens.statusIconSize),
418
+ rounded: css(_templateObject7(), tokens.statusLeft, tokens.avatarSize, tokens.statusIconSize, tokens.statusTop, tokens.avatarSize, tokens.statusIconSize)
394
419
  },
395
420
  badgeView: {
396
- default: css(_templateObject7(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
397
- accent: css(_templateObject8(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
398
- positive: css(_templateObject9(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
399
- warning: css(_templateObject10(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
400
- negative: css(_templateObject11(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
401
- dark: css(_templateObject12(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
402
- light: css(_templateObject13(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear)
421
+ default: css(_templateObject8(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
422
+ accent: css(_templateObject9(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
423
+ positive: css(_templateObject10(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
424
+ warning: css(_templateObject11(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
425
+ negative: css(_templateObject12(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
426
+ dark: css(_templateObject13(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear),
427
+ light: css(_templateObject14(), tokens.badgeColor, tokens.badgeBackground, tokens.badgeColorTransparent, tokens.badgeBackgroundTransparent, tokens.badgeColorClear, tokens.badgeBackgroundClear)
403
428
  },
404
429
  counterView: {
405
- default: css(_templateObject14(), tokens.counterColor, tokens.counterBackground),
406
- accent: css(_templateObject15(), tokens.counterColor, tokens.counterBackground),
407
- positive: css(_templateObject16(), tokens.counterColor, tokens.counterBackground),
408
- warning: css(_templateObject17(), tokens.counterColor, tokens.counterBackground),
409
- negative: css(_templateObject18(), tokens.counterColor, tokens.counterBackground),
410
- dark: css(_templateObject19(), tokens.counterColor, tokens.counterBackground),
411
- light: css(_templateObject20(), tokens.counterColor, tokens.counterBackground)
430
+ default: css(_templateObject15(), tokens.counterColor, tokens.counterBackground),
431
+ accent: css(_templateObject16(), tokens.counterColor, tokens.counterBackground),
432
+ positive: css(_templateObject17(), tokens.counterColor, tokens.counterBackground),
433
+ warning: css(_templateObject18(), tokens.counterColor, tokens.counterBackground),
434
+ negative: css(_templateObject19(), tokens.counterColor, tokens.counterBackground),
435
+ dark: css(_templateObject20(), tokens.counterColor, tokens.counterBackground),
436
+ light: css(_templateObject21(), tokens.counterColor, tokens.counterBackground)
412
437
  }
413
438
  }
414
439
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salutejs/sdds-dfa",
3
- "version": "0.322.0-canary.2238.17818313113.0",
3
+ "version": "0.322.0-dev.0",
4
4
  "description": "Salute Design System / React UI kit for SDDS DFA web applications",
5
5
  "author": "Salute Frontend Team <salute.developers@gmail.com>",
6
6
  "license": "MIT",
@@ -19,7 +19,7 @@
19
19
  "directory": "packages/sdds-dfa"
20
20
  },
21
21
  "dependencies": {
22
- "@salutejs/plasma-new-hope": "0.336.0-canary.2238.17818313113.0",
22
+ "@salutejs/plasma-new-hope": "0.336.0-dev.0",
23
23
  "@salutejs/sdds-themes": "0.47.0"
24
24
  },
25
25
  "peerDependencies": {
@@ -37,10 +37,10 @@
37
37
  "@babel/preset-typescript": "7.24.1",
38
38
  "@microsoft/api-extractor": "7.38.3",
39
39
  "@salutejs/plasma-colors": "0.16.0",
40
- "@salutejs/plasma-core": "1.208.0-canary.2238.17818313113.0",
41
- "@salutejs/plasma-cy-utils": "0.138.0-canary.2238.17818313113.0",
42
- "@salutejs/plasma-icons": "1.224.0-canary.2238.17818313113.0",
43
- "@salutejs/plasma-sb-utils": "0.208.0-canary.2238.17818313113.0",
40
+ "@salutejs/plasma-core": "1.208.0-dev.0",
41
+ "@salutejs/plasma-cy-utils": "0.138.0-dev.0",
42
+ "@salutejs/plasma-icons": "1.224.0-dev.0",
43
+ "@salutejs/plasma-sb-utils": "0.208.0-dev.0",
44
44
  "@storybook/addon-docs": "8.6.14",
45
45
  "@storybook/addon-essentials": "8.6.14",
46
46
  "@storybook/manager-api": "8.6.14",
@@ -94,5 +94,5 @@
94
94
  "Anton Vinogradov"
95
95
  ],
96
96
  "sideEffects": false,
97
- "gitHead": "f4fda681a00ca61546075c6031157f9077c9c438"
97
+ "gitHead": "0970b1354a662c44c6ba728d7d5a7c34b4a1f00a"
98
98
  }