@salutejs/sdds-dfa 0.368.0-next-sbcom.0 → 0.368.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 (48) hide show
  1. package/README.md +115 -32
  2. package/README.mdx +3 -67
  3. package/dist/styled-components/cjs/components/Autocomplete/Autocomplete.config.js +5 -5
  4. package/dist/styled-components/cjs/components/Breadcrumbs/Breadcrumbs.config.js +4 -4
  5. package/dist/styled-components/cjs/components/Button/Button.js +1 -2
  6. package/dist/styled-components/cjs/components/Calendar/Calendar.config.js +2 -7
  7. package/dist/styled-components/cjs/components/Calendar/CalendarDouble.config.js +2 -7
  8. package/dist/styled-components/cjs/components/Combobox/Combobox.config.js +5 -5
  9. package/dist/styled-components/cjs/components/DatePicker/DatePicker.clear.config.js +2 -2
  10. package/dist/styled-components/cjs/components/DatePicker/DatePicker.config.js +2 -7
  11. package/dist/styled-components/cjs/components/DateTimePicker/DateTimePicker.config.js +2 -7
  12. package/dist/styled-components/cjs/components/Notification/Notification.js +3 -2
  13. package/dist/styled-components/cjs/components/Select/Select.config.js +5 -5
  14. package/dist/styled-components/cjs/components/Spinner/Spinner.config.js +0 -23
  15. package/dist/styled-components/cjs/components/Spinner/Spinner.js +15 -4
  16. package/dist/styled-components/cjs/components/TextField/TextField.clear.config.js +5 -5
  17. package/dist/styled-components/cjs/components/TextField/TextField.config.js +5 -5
  18. package/dist/styled-components/cjs/components/TextFieldGroup/TextFieldGroup.config.js +4 -4
  19. package/dist/styled-components/cjs/components/Tokens/Colors/Colors.styles.js +15 -15
  20. package/dist/styled-components/cjs/components/Tokens/Typography/Typography.styles.js +23 -23
  21. package/dist/styled-components/es/components/Autocomplete/Autocomplete.config.js +5 -5
  22. package/dist/styled-components/es/components/Breadcrumbs/Breadcrumbs.config.js +5 -5
  23. package/dist/styled-components/es/components/Button/Button.js +1 -2
  24. package/dist/styled-components/es/components/Calendar/Calendar.config.js +2 -7
  25. package/dist/styled-components/es/components/Calendar/CalendarDouble.config.js +2 -7
  26. package/dist/styled-components/es/components/Combobox/Combobox.config.js +5 -5
  27. package/dist/styled-components/es/components/DatePicker/DatePicker.clear.config.js +2 -2
  28. package/dist/styled-components/es/components/DatePicker/DatePicker.config.js +2 -7
  29. package/dist/styled-components/es/components/DateTimePicker/DateTimePicker.config.js +2 -7
  30. package/dist/styled-components/es/components/Notification/Notification.js +3 -2
  31. package/dist/styled-components/es/components/Select/Select.config.js +5 -5
  32. package/dist/styled-components/es/components/Spinner/Spinner.config.js +0 -23
  33. package/dist/styled-components/es/components/Spinner/Spinner.js +7 -1
  34. package/dist/styled-components/es/components/TextField/TextField.clear.config.js +5 -5
  35. package/dist/styled-components/es/components/TextField/TextField.config.js +5 -5
  36. package/dist/styled-components/es/components/TextFieldGroup/TextFieldGroup.config.js +4 -4
  37. package/dist/styled-components/es/components/Tokens/Colors/Colors.styles.js +14 -14
  38. package/dist/styled-components/es/components/Tokens/Typography/Typography.styles.js +18 -18
  39. package/package.json +9 -9
  40. package/types/components/Avatar/Avatar.d.ts +4 -4
  41. package/types/components/Combobox/Combobox.d.ts +8 -0
  42. package/types/components/Note/Note.d.ts +1 -0
  43. package/types/components/Notification/Notification.d.ts +2 -1
  44. package/types/components/Spinner/Spinner.config.d.ts +0 -9
  45. package/types/components/Spinner/Spinner.d.ts +38 -26
  46. package/types/components/Spinner/index.d.ts +1 -1
  47. package/types/components/Tokens/Colors/Colors.styles.d.ts +2 -2
  48. package/types/components/Tokens/Typography/Typography.styles.d.ts +2 -2
package/dist/styled-components/es/components/Calendar/CalendarDouble.config.js CHANGED
@@ -24,8 +24,8 @@ export const config = {
24
24
  ${calendarDoubleTokens.calendarHoveredItemColor}: ${textPrimary};
25
25
  ${calendarDoubleTokens.calendarRangeBackground}: ${surfaceTransparentSecondary};
26
26
  ${calendarDoubleTokens.calendarOutlineFocusColor}: ${surfaceAccent};
27
- ${calendarDoubleTokens.calendarContentPrimaryColor}: ${surfaceSolidDefault};
28
- ${calendarDoubleTokens.calendarContentPrimaryDisabledColor}: ${surfaceSolidDefault};
27
+ ${calendarDoubleTokens.calendarContentPrimaryColor}: ${textPrimary};
28
+ ${calendarDoubleTokens.calendarContentPrimaryDisabledColor}: ${textPrimary};
29
29
  ${calendarDoubleTokens.calendarHeaderArrowColor}: ${calendarDoubleTokens.calendarContentPrimaryColor};
30
30
  ${calendarDoubleTokens.calendarContentSecondaryColor}: ${textSecondary};
31
31
  ${calendarDoubleTokens.calendarContentSecondaryDisabledColor}: ${textSecondary};
@@ -97,7 +97,6 @@ export const config = {
97
97
 
98
98
  ${calendarDoubleTokens.calendarHeaderArrowGap}: 0;
99
99
  ${calendarDoubleTokens.calendarArrowHeaderCustomSize}: 1.5rem;
100
- ${calendarDoubleTokens.calendarHeaderArrowSize}: 1.5rem;
101
100
 
102
101
  ${calendarDoubleTokens.calendarHeaderPadding}: 0 0 0 1rem;
103
102
  ${calendarDoubleTokens.calendarHeaderDateGap}: 0.25rem;
@@ -167,7 +166,6 @@ export const config = {
167
166
 
168
167
  ${calendarDoubleTokens.calendarHeaderArrowGap}: 0;
169
168
  ${calendarDoubleTokens.calendarArrowHeaderCustomSize}: 1.5rem;
170
- ${calendarDoubleTokens.calendarHeaderArrowSize}: 1.5rem;
171
169
 
172
170
  ${calendarDoubleTokens.calendarHeaderPadding}: 0 0 0 1rem;
173
171
  ${calendarDoubleTokens.calendarHeaderDateGap}: 0.25rem;
@@ -237,7 +235,6 @@ export const config = {
237
235
 
238
236
  ${calendarDoubleTokens.calendarHeaderArrowGap}: 0;
239
237
  ${calendarDoubleTokens.calendarArrowHeaderCustomSize}: 1.5rem;
240
- ${calendarDoubleTokens.calendarHeaderArrowSize}: 1.5rem;
241
238
 
242
239
  ${calendarDoubleTokens.calendarHeaderPadding}: 0 0 0 0.75rem;
243
240
  ${calendarDoubleTokens.calendarHeaderDateGap}: 0.25rem;
@@ -307,7 +304,6 @@ export const config = {
307
304
 
308
305
  ${calendarDoubleTokens.calendarHeaderArrowGap}: 0;
309
306
  ${calendarDoubleTokens.calendarArrowHeaderCustomSize}: 1.5rem;
310
- ${calendarDoubleTokens.calendarHeaderArrowSize}: 1.5rem;
311
307
 
312
308
  ${calendarDoubleTokens.calendarHeaderPadding}: 0 0 0 0.5rem;
313
309
  ${calendarDoubleTokens.calendarHeaderDateGap}: 0.25rem;
@@ -377,7 +373,6 @@ export const config = {
377
373
 
378
374
  ${calendarDoubleTokens.calendarHeaderArrowGap}: 0;
379
375
  ${calendarDoubleTokens.calendarArrowHeaderCustomSize}: 1rem;
380
- ${calendarDoubleTokens.calendarHeaderArrowSize}: 1rem;
381
376
 
382
377
  ${calendarDoubleTokens.calendarHeaderPadding}: 0 0 0 0.5rem;
383
378
  ${calendarDoubleTokens.calendarHeaderDateGap}: 0.25rem;
package/dist/styled-components/es/components/Combobox/Combobox.config.js CHANGED
@@ -266,7 +266,7 @@ export const config = {
266
266
  ${tokens.textFieldHintInnerLabelPlacementOffset}: 0.82rem -2.938rem auto auto;
267
267
  ${tokens.textFieldClearHintInnerLabelPlacementOffset}: 0.82rem -2.188rem auto auto;
268
268
 
269
- ${tokens.textFieldLeftHelperPadding}: 0.25rem 0 0 0;
269
+ ${tokens.textFieldLeftHelperOffset}: 0.25rem 0 0 0;
270
270
  ${tokens.textFieldLeftHelperFontFamily}: ${bodyXS.fontFamily};
271
271
  ${tokens.textFieldLeftHelperFontSize}: ${bodyXS.fontSize};
272
272
  ${tokens.textFieldLeftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -387,7 +387,7 @@ export const config = {
387
387
  ${tokens.textFieldHintInnerLabelPlacementOffset}: 0.563rem -2.938rem auto auto;
388
388
  ${tokens.textFieldClearHintInnerLabelPlacementOffset}: 0.563rem -2.188rem auto auto;
389
389
 
390
- ${tokens.textFieldLeftHelperPadding}: 0.25rem 0 0 0;
390
+ ${tokens.textFieldLeftHelperOffset}: 0.25rem 0 0 0;
391
391
  ${tokens.textFieldLeftHelperFontFamily}: ${bodyXS.fontFamily};
392
392
  ${tokens.textFieldLeftHelperFontSize}: ${bodyXS.fontSize};
393
393
  ${tokens.textFieldLeftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -508,7 +508,7 @@ export const config = {
508
508
  ${tokens.textFieldHintInnerLabelPlacementOffset}: 0.312rem -2.813rem auto auto;
509
509
  ${tokens.textFieldClearHintInnerLabelPlacementOffset}: 0.312rem -2.188rem auto auto;
510
510
 
511
- ${tokens.textFieldLeftHelperPadding}: 0.25rem 0 0 0;
511
+ ${tokens.textFieldLeftHelperOffset}: 0.25rem 0 0 0;
512
512
  ${tokens.textFieldLeftHelperFontFamily}: ${bodyXS.fontFamily};
513
513
  ${tokens.textFieldLeftHelperFontSize}: ${bodyXS.fontSize};
514
514
  ${tokens.textFieldLeftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -629,7 +629,7 @@ export const config = {
629
629
  ${tokens.textFieldHintInnerLabelPlacementOffset}: 0.062rem -2.688rem auto auto;
630
630
  ${tokens.textFieldClearHintInnerLabelPlacementOffset}: 0.062rem -2.188rem auto auto;
631
631
 
632
- ${tokens.textFieldLeftHelperPadding}: 0.25rem 0 0 0;
632
+ ${tokens.textFieldLeftHelperOffset}: 0.25rem 0 0 0;
633
633
  ${tokens.textFieldLeftHelperFontFamily}: ${bodyXS.fontFamily};
634
634
  ${tokens.textFieldLeftHelperFontSize}: ${bodyXS.fontSize};
635
635
  ${tokens.textFieldLeftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -750,7 +750,7 @@ export const config = {
750
750
  ${tokens.textFieldHintInnerLabelPlacementOffset}: -0.188rem -2.1875rem auto auto;
751
751
  ${tokens.textFieldClearHintInnerLabelPlacementOffset}: -0.188rem -1.938rem auto auto;
752
752
 
753
- ${tokens.textFieldLeftHelperPadding}: 0.25rem 0 0 0;
753
+ ${tokens.textFieldLeftHelperOffset}: 0.25rem 0 0 0;
754
754
  ${tokens.textFieldLeftHelperFontFamily}: ${bodyXS.fontFamily};
755
755
  ${tokens.textFieldLeftHelperFontSize}: ${bodyXS.fontSize};
756
756
  ${tokens.textFieldLeftHelperFontStyle}: ${bodyXS.fontStyle};
package/dist/styled-components/es/components/DatePicker/DatePicker.clear.config.js CHANGED
@@ -123,8 +123,8 @@ export const config = {
123
123
  ${tokens.calendarHoveredItemColor}: ${textPrimary};
124
124
  ${tokens.calendarRangeBackground}: ${surfaceTransparentSecondary};
125
125
  ${tokens.calendarOutlineFocusColor}: ${surfaceAccent};
126
- ${tokens.calendarContentPrimaryColor}: ${surfaceSolidDefault};
127
- ${tokens.calendarContentPrimaryDisabledColor}: ${surfaceSolidDefault};
126
+ ${tokens.calendarContentPrimaryColor}: ${textPrimary};
127
+ ${tokens.calendarContentPrimaryDisabledColor}: ${textPrimary};
128
128
  ${tokens.calendarHeaderArrowColor}: ${tokens.calendarContentPrimaryColor};
129
129
  ${tokens.calendarContentSecondaryColor}: ${textSecondary};
130
130
  ${tokens.calendarContentSecondaryDisabledColor}: ${textSecondary};
package/dist/styled-components/es/components/DatePicker/DatePicker.config.js CHANGED
@@ -92,8 +92,8 @@ export const config = {
92
92
  ${tokens.calendarHoveredItemColor}: ${textPrimary};
93
93
  ${tokens.calendarRangeBackground}: ${surfaceTransparentSecondary};
94
94
  ${tokens.calendarOutlineFocusColor}: ${surfaceAccent};
95
- ${tokens.calendarContentPrimaryColor}: ${surfaceSolidDefault};
96
- ${tokens.calendarContentPrimaryDisabledColor}: ${surfaceSolidDefault};
95
+ ${tokens.calendarContentPrimaryColor}: ${textPrimary};
96
+ ${tokens.calendarContentPrimaryDisabledColor}: ${textPrimary};
97
97
  ${tokens.calendarHeaderArrowColor}: ${tokens.calendarContentPrimaryColor};
98
98
  ${tokens.calendarContentSecondaryColor}: ${textSecondary};
99
99
  ${tokens.calendarContentSecondaryDisabledColor}: ${textSecondary};
@@ -252,7 +252,6 @@ export const config = {
252
252
  ${tokens.calendarHeaderWrapperPadding}: 0;
253
253
  ${tokens.calendarHeaderArrowGap}: 0.5rem;
254
254
  ${tokens.calendarHeaderArrowCustomSize}: 1.5rem;
255
- ${tokens.calendarHeaderArrowSize}: 1.5rem;
256
255
 
257
256
  ${tokens.calendarHeaderPadding}: 0 0 0 1rem;
258
257
  ${tokens.calendarHeaderDateGap}: 0.5rem;
@@ -423,7 +422,6 @@ export const config = {
423
422
  ${tokens.calendarHeaderWrapperPadding}: 0;
424
423
  ${tokens.calendarHeaderArrowGap}: 0.5rem;
425
424
  ${tokens.calendarHeaderArrowCustomSize}: 1.5rem;
426
- ${tokens.calendarHeaderArrowSize}: 1.5rem;
427
425
 
428
426
  ${tokens.calendarHeaderPadding}: 0 0 0 1rem;
429
427
  ${tokens.calendarHeaderDateGap}: 0.5rem;
@@ -594,7 +592,6 @@ export const config = {
594
592
  ${tokens.calendarHeaderWrapperPadding}: 0;
595
593
  ${tokens.calendarHeaderArrowGap}: 0;
596
594
  ${tokens.calendarHeaderArrowCustomSize}: 1.5rem;
597
- ${tokens.calendarHeaderArrowSize}: 1.5rem;
598
595
 
599
596
  ${tokens.calendarHeaderPadding}: 0 0 0 0.75rem;
600
597
  ${tokens.calendarHeaderDateGap}: 0.25rem;
@@ -765,7 +762,6 @@ export const config = {
765
762
  ${tokens.calendarHeaderWrapperPadding}: 0;
766
763
  ${tokens.calendarHeaderArrowGap}: 0;
767
764
  ${tokens.calendarHeaderArrowCustomSize}: 1.5rem;
768
- ${tokens.calendarHeaderArrowSize}: 1.5rem;
769
765
 
770
766
  ${tokens.calendarHeaderPadding}: 0 0 0 0.5rem;
771
767
  ${tokens.calendarHeaderDateGap}: 0.25rem;
@@ -936,7 +932,6 @@ export const config = {
936
932
  ${tokens.calendarHeaderWrapperPadding}: 0;
937
933
  ${tokens.calendarHeaderArrowGap}: 0;
938
934
  ${tokens.calendarHeaderArrowCustomSize}: 1rem;
939
- ${tokens.calendarHeaderArrowSize}: 1rem;
940
935
 
941
936
  ${tokens.calendarHeaderPadding}: 0 0 0 0.5rem;
942
937
  ${tokens.calendarHeaderDateGap}: 0.25rem;
package/dist/styled-components/es/components/DateTimePicker/DateTimePicker.config.js CHANGED
@@ -69,8 +69,8 @@ export const config = {
69
69
  ${tokens.calendarHoveredItemColor}: ${textPrimary};
70
70
  ${tokens.calendarRangeBackground}: ${surfaceTransparentSecondary};
71
71
  ${tokens.calendarOutlineFocusColor}: ${surfaceAccent};
72
- ${tokens.calendarContentPrimaryColor}: ${surfaceSolidDefault};
73
- ${tokens.calendarContentPrimaryDisabledColor}: ${surfaceSolidDefault};
72
+ ${tokens.calendarContentPrimaryColor}: ${textPrimary};
73
+ ${tokens.calendarContentPrimaryDisabledColor}: ${textPrimary};
74
74
  ${tokens.calendarHeaderArrowColor}: ${tokens.calendarContentPrimaryColor};
75
75
  ${tokens.calendarContentSecondaryColor}: ${textSecondary};
76
76
  ${tokens.calendarContentSecondaryDisabledColor}: ${textSecondary};
@@ -225,7 +225,6 @@ export const config = {
225
225
  ${tokens.calendarHeaderWrapperPadding}: 0;
226
226
  ${tokens.calendarHeaderArrowGap}: 0;
227
227
  ${tokens.calendarHeaderArrowCustomSize}: 1.5rem;
228
- ${tokens.calendarHeaderArrowSize}: 1.5rem;
229
228
 
230
229
  ${tokens.calendarHeaderPadding}: 0 0 0 1rem;
231
230
  ${tokens.calendarHeaderDateGap}: 0.25rem;
@@ -393,7 +392,6 @@ export const config = {
393
392
  ${tokens.calendarHeaderWrapperPadding}: 0;
394
393
  ${tokens.calendarHeaderArrowGap}: 0.5rem;
395
394
  ${tokens.calendarHeaderArrowCustomSize}: 1.5rem;
396
- ${tokens.calendarHeaderArrowSize}: 1.5rem;
397
395
 
398
396
  ${tokens.calendarHeaderPadding}: 0 0 0 1rem;
399
397
  ${tokens.calendarHeaderDateGap}: 0.5rem;
@@ -561,7 +559,6 @@ export const config = {
561
559
  ${tokens.calendarHeaderWrapperPadding}: 0;
562
560
  ${tokens.calendarHeaderArrowGap}: 0;
563
561
  ${tokens.calendarHeaderArrowCustomSize}: 1.5rem;
564
- ${tokens.calendarHeaderArrowSize}: 1.5rem;
565
562
 
566
563
  ${tokens.calendarHeaderPadding}: 0 0 0 0.75rem;
567
564
  ${tokens.calendarHeaderDateGap}: 0.25rem;
@@ -729,7 +726,6 @@ export const config = {
729
726
  ${tokens.calendarHeaderWrapperPadding}: 0;
730
727
  ${tokens.calendarHeaderArrowGap}: 0;
731
728
  ${tokens.calendarHeaderArrowCustomSize}: 1.5rem;
732
- ${tokens.calendarHeaderArrowSize}: 1.5rem;
733
729
 
734
730
  ${tokens.calendarHeaderPadding}: 0 0 0 0.5rem;
735
731
  ${tokens.calendarHeaderDateGap}: 0.25rem;
@@ -897,7 +893,6 @@ export const config = {
897
893
  ${tokens.calendarHeaderWrapperPadding}: 0;
898
894
  ${tokens.calendarHeaderArrowGap}: 0;
899
895
  ${tokens.calendarHeaderArrowCustomSize}: 1rem;
900
- ${tokens.calendarHeaderArrowSize}: 1rem;
901
896
 
902
897
  ${tokens.calendarHeaderPadding}: 0 0 0 0.5rem;
903
898
  ${tokens.calendarHeaderDateGap}: 0.25rem;
package/dist/styled-components/es/components/Notification/Notification.js CHANGED
@@ -4,11 +4,12 @@ import { config } from './Notification.config';
4
4
  const mergedConfig = mergeConfig(notificationConfig, config);
5
5
  export const NotificationNewHope = component(mergedConfig);
6
6
  export const Notification = NotificationNewHope;
7
- export const NotificationsProvider = ({ children, frame = 'document', placement, UNSAFE_SSR_ENABLED })=>{
7
+ export const NotificationsProvider = ({ children, frame = 'document', placement, UNSAFE_SSR_ENABLED, defaultNotificationArgs })=>{
8
8
  return /*#__PURE__*/ React.createElement(Provider, {
9
9
  config: mergedConfig,
10
10
  frame: frame,
11
11
  placement: placement,
12
- UNSAFE_SSR_ENABLED: UNSAFE_SSR_ENABLED
12
+ UNSAFE_SSR_ENABLED: UNSAFE_SSR_ENABLED,
13
+ defaultNotificationArgs: defaultNotificationArgs
13
14
  }, children);
14
15
  };
package/dist/styled-components/es/components/Select/Select.config.js CHANGED
@@ -393,7 +393,7 @@ export const config = {
393
393
  ${tokens.textFieldHintInnerLabelPlacementOffset}: 0.82rem -2.938rem auto auto;
394
394
  ${tokens.textFieldClearHintInnerLabelPlacementOffset}: 0.82rem -2.188rem auto auto;
395
395
 
396
- ${tokens.textFieldLeftHelperPadding}: 0.25rem 0 0 0;
396
+ ${tokens.textFieldLeftHelperOffset}: 0.25rem 0 0 0;
397
397
  ${tokens.textFieldLeftHelperFontFamily}: ${bodyXS.fontFamily};
398
398
  ${tokens.textFieldLeftHelperFontSize}: ${bodyXS.fontSize};
399
399
  ${tokens.textFieldLeftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -518,7 +518,7 @@ export const config = {
518
518
  ${tokens.textFieldHintInnerLabelPlacementOffset}: 0.563rem -2.938rem auto auto;
519
519
  ${tokens.textFieldClearHintInnerLabelPlacementOffset}: 0.563rem -2.188rem auto auto;
520
520
 
521
- ${tokens.textFieldLeftHelperPadding}: 0.25rem 0 0 0;
521
+ ${tokens.textFieldLeftHelperOffset}: 0.25rem 0 0 0;
522
522
  ${tokens.textFieldLeftHelperFontFamily}: ${bodyXS.fontFamily};
523
523
  ${tokens.textFieldLeftHelperFontSize}: ${bodyXS.fontSize};
524
524
  ${tokens.textFieldLeftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -643,7 +643,7 @@ export const config = {
643
643
  ${tokens.textFieldHintInnerLabelPlacementOffset}: 0.312rem -2.813rem auto auto;
644
644
  ${tokens.textFieldClearHintInnerLabelPlacementOffset}: 0.312rem -2.188rem auto auto;
645
645
 
646
- ${tokens.textFieldLeftHelperPadding}: 0.25rem 0 0 0;
646
+ ${tokens.textFieldLeftHelperOffset}: 0.25rem 0 0 0;
647
647
  ${tokens.textFieldLeftHelperFontFamily}: ${bodyXS.fontFamily};
648
648
  ${tokens.textFieldLeftHelperFontSize}: ${bodyXS.fontSize};
649
649
  ${tokens.textFieldLeftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -768,7 +768,7 @@ export const config = {
768
768
  ${tokens.textFieldHintInnerLabelPlacementOffset}: 0.062rem -2.688rem auto auto;
769
769
  ${tokens.textFieldClearHintInnerLabelPlacementOffset}: 0.062rem -2.188rem auto auto;
770
770
 
771
- ${tokens.textFieldLeftHelperPadding}: 0.25rem 0 0 0;
771
+ ${tokens.textFieldLeftHelperOffset}: 0.25rem 0 0 0;
772
772
  ${tokens.textFieldLeftHelperFontFamily}: ${bodyXS.fontFamily};
773
773
  ${tokens.textFieldLeftHelperFontSize}: ${bodyXS.fontSize};
774
774
  ${tokens.textFieldLeftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -893,7 +893,7 @@ export const config = {
893
893
  ${tokens.textFieldHintInnerLabelPlacementOffset}: -0.188rem -2.1875rem auto auto;
894
894
  ${tokens.textFieldClearHintInnerLabelPlacementOffset}: -0.188rem -1.938rem auto auto;
895
895
 
896
- ${tokens.textFieldLeftHelperPadding}: 0.25rem 0 0 0;
896
+ ${tokens.textFieldLeftHelperOffset}: 0.25rem 0 0 0;
897
897
  ${tokens.textFieldLeftHelperFontFamily}: ${bodyXS.fontFamily};
898
898
  ${tokens.textFieldLeftHelperFontSize}: ${bodyXS.fontSize};
899
899
  ${tokens.textFieldLeftHelperFontStyle}: ${bodyXS.fontStyle};
package/dist/styled-components/es/components/Spinner/Spinner.config.js CHANGED
@@ -6,29 +6,6 @@ export const config = {
6
6
  size: 'm'
7
7
  },
8
8
  variations: {
9
- size: {
10
- xxs: css`
11
- ${tokens.size}: 1rem;
12
- `,
13
- xs: css`
14
- ${tokens.size}: 1.5rem;
15
- `,
16
- s: css`
17
- ${tokens.size}: 2.25rem;
18
- `,
19
- m: css`
20
- ${tokens.size}: 3rem;
21
- `,
22
- l: css`
23
- ${tokens.size}: 3.5rem;
24
- `,
25
- xl: css`
26
- ${tokens.size}: 5.5rem;
27
- `,
28
- xxl: css`
29
- ${tokens.size}: 8rem;
30
- `
31
- },
32
9
  view: {
33
10
  default: css`
34
11
  ${tokens.color}: ${textPrimary};
package/dist/styled-components/es/components/Spinner/Spinner.js CHANGED
@@ -1,7 +1,13 @@
1
+ import styled from 'styled-components';
1
2
  import { spinnerConfig, component, mergeConfig } from '@salutejs/plasma-new-hope/styled-components';
2
3
  import { config } from './Spinner.config';
3
4
  const mergedConfig = mergeConfig(spinnerConfig, config);
4
5
  const SpinnerComponent = component(mergedConfig);
5
6
  /**
6
7
  * Компонент для отображения индикатора загрузки.
7
- */ export const Spinner = SpinnerComponent;
8
+ */ export const Spinner = styled(SpinnerComponent).withConfig({
9
+ displayName: "Spinner",
10
+ componentId: "sc-d47c168-0"
11
+ })([
12
+ ``
13
+ ]);
package/dist/styled-components/es/components/TextField/TextField.clear.config.js CHANGED
@@ -182,7 +182,7 @@ export const config = {
182
182
  ${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
183
183
  ${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
184
184
 
185
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
185
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
186
186
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
187
187
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
188
188
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -274,7 +274,7 @@ export const config = {
274
274
  ${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
275
275
  ${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
276
276
 
277
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
277
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
278
278
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
279
279
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
280
280
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -358,7 +358,7 @@ export const config = {
358
358
  ${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
359
359
  ${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
360
360
 
361
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
361
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
362
362
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
363
363
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
364
364
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -442,7 +442,7 @@ export const config = {
442
442
  ${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
443
443
  ${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
444
444
 
445
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
445
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
446
446
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
447
447
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
448
448
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -526,7 +526,7 @@ export const config = {
526
526
  ${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
527
527
  ${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
528
528
 
529
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
529
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
530
530
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
531
531
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
532
532
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
package/dist/styled-components/es/components/TextField/TextField.config.js CHANGED
@@ -166,7 +166,7 @@ export const config = {
166
166
  ${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
167
167
  ${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
168
168
 
169
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
169
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
170
170
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
171
171
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
172
172
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -259,7 +259,7 @@ export const config = {
259
259
  ${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
260
260
  ${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
261
261
 
262
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
262
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
263
263
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
264
264
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
265
265
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -345,7 +345,7 @@ export const config = {
345
345
  ${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
346
346
  ${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
347
347
 
348
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
348
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
349
349
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
350
350
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
351
351
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -431,7 +431,7 @@ export const config = {
431
431
  ${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
432
432
  ${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
433
433
 
434
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
434
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
435
435
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
436
436
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
437
437
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -517,7 +517,7 @@ export const config = {
517
517
  ${tokens.titleCaptionLetterSpacing}: ${bodyXS.letterSpacing};
518
518
  ${tokens.titleCaptionLineHeight}: ${bodyXS.lineHeight};
519
519
 
520
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
520
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
521
521
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
522
522
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
523
523
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
package/dist/styled-components/es/components/TextFieldGroup/TextFieldGroup.config.js CHANGED
@@ -36,7 +36,7 @@ export const config = {
36
36
  ${tokens.labelLetterSpacing}: ${bodyL.letterSpacing};
37
37
  ${tokens.labelLineHeight}: ${bodyL.lineHeight};
38
38
 
39
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
39
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
40
40
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
41
41
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
42
42
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -92,7 +92,7 @@ export const config = {
92
92
  ${tokens.labelLetterSpacing}: ${bodyM.letterSpacing};
93
93
  ${tokens.labelLineHeight}: ${bodyM.lineHeight};
94
94
 
95
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
95
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
96
96
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
97
97
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
98
98
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -148,7 +148,7 @@ export const config = {
148
148
  ${tokens.labelLetterSpacing}: ${bodyS.letterSpacing};
149
149
  ${tokens.labelLineHeight}: ${bodyS.lineHeight};
150
150
 
151
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
151
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
152
152
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
153
153
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
154
154
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
@@ -204,7 +204,7 @@ export const config = {
204
204
  ${tokens.labelLetterSpacing}: ${bodyXS.letterSpacing};
205
205
  ${tokens.labelLineHeight}: ${bodyXS.lineHeight};
206
206
 
207
- ${tokens.leftHelperPadding}: 0.25rem 0 0 0;
207
+ ${tokens.leftHelperOffset}: 0.25rem 0 0 0;
208
208
  ${tokens.leftHelperFontFamily}: ${bodyXS.fontFamily};
209
209
  ${tokens.leftHelperFontSize}: ${bodyXS.fontSize};
210
210
  ${tokens.leftHelperFontStyle}: ${bodyXS.fontStyle};
package/dist/styled-components/es/components/Tokens/Colors/Colors.styles.js CHANGED
@@ -1,22 +1,22 @@
1
1
  import styled from 'styled-components';
2
- import { segmentTokens } from '@salutejs/plasma-new-hope';
2
+ import { segmentTokens } from '@salutejs/plasma-new-hope/styled-components';
3
3
  import { AccordionItem } from '../../Accordion';
4
4
  import { SegmentItem } from '../../Segment/Segment';
5
5
  export const ColorTokensWrapper = styled.div.withConfig({
6
6
  displayName: "Colors.styles__ColorTokensWrapper",
7
- componentId: "sc-998f2ec3-0"
7
+ componentId: "sc-e9243388-0"
8
8
  })([
9
9
  `padding-top:1.5rem;width:100%;`
10
10
  ]);
11
11
  export const SubthemeSwitcher = styled.div.withConfig({
12
12
  displayName: "Colors.styles__SubthemeSwitcher",
13
- componentId: "sc-998f2ec3-1"
13
+ componentId: "sc-e9243388-1"
14
14
  })([
15
15
  `margin:-0.5rem auto 2.5rem auto;width:fit-content;position:relative;&:before{content:'Подтема';position:absolute;top:50%;transform:translate(-100%,-50%);left:-0.75rem;color:var(--text-tertiary);font-family:var(--plasma-typo-body-xs-font-family);font-size:var(--plasma-typo-body-xs-font-size);font-style:var(--plasma-typo-body-xs-font-style);font-weight:var(--plasma-typo-body-xs-font-weight);bold-font-weight:var(--plasma-typo-body-xs-bold-font-weight);letter-spacing:var(--plasma-typo-body-xs-letter-spacing);line-height:var(--plasma-typo-body-xs-line-height);}`
16
16
  ]);
17
17
  export const StyledSegmentItem = styled(SegmentItem).withConfig({
18
18
  displayName: "Colors.styles__StyledSegmentItem",
19
- componentId: "sc-998f2ec3-2"
19
+ componentId: "sc-e9243388-2"
20
20
  })([
21
21
  ``,
22
22
  `:1.75rem;`,
@@ -24,25 +24,25 @@ export const StyledSegmentItem = styled(SegmentItem).withConfig({
24
24
  ], segmentTokens.itemHeight, segmentTokens.itemPilledPadding);
25
25
  export const AccordionInfo = styled.div.withConfig({
26
26
  displayName: "Colors.styles__AccordionInfo",
27
- componentId: "sc-998f2ec3-3"
27
+ componentId: "sc-e9243388-3"
28
28
  })([
29
29
  `display:grid;grid-template-columns:16.75rem 9.938rem 2.375rem 3.813rem 9.313rem;grid-column-gap:1.5rem;font-family:var(--plasma-typo-body-m-font-family);font-size:var(--plasma-typo-body-m-font-size);font-style:var(--plasma-typo-body-m-font-style);font-weight:var(--plasma-typo-body-m-font-weight);letter-spacing:var(--plasma-typo-body-m-letter-spacing);line-height:var(--plasma-typo-body-m-line-height);`
30
30
  ]);
31
31
  export const Subcategory = styled.div.withConfig({
32
32
  displayName: "Colors.styles__Subcategory",
33
- componentId: "sc-998f2ec3-4"
33
+ componentId: "sc-e9243388-4"
34
34
  })([
35
35
  `color:var(--text-secondary);`
36
36
  ]);
37
37
  export const ColumnTitle = styled.div.withConfig({
38
38
  displayName: "Colors.styles__ColumnTitle",
39
- componentId: "sc-998f2ec3-5"
39
+ componentId: "sc-e9243388-5"
40
40
  })([
41
41
  `color:var(--text-tertiary);transition:opacity 0.2s;&.color{display:flex;align-items:center;gap:2.5rem;}&.hex{padding-left:3.75rem;}`
42
42
  ]);
43
43
  export const StyledAccordionItem = styled(AccordionItem).withConfig({
44
44
  displayName: "Colors.styles__StyledAccordionItem",
45
- componentId: "sc-998f2ec3-6"
45
+ componentId: "sc-e9243388-6"
46
46
  })([
47
47
  `--plasma-accordion-item-padding:0;--plasma-accordion-item-padding-vertical:0;border-bottom:unset;width:50.375rem;div > div > div > svg{color:var(--text-secondary);}.accordion-item-body{margin-bottom:2.375rem;padding-top:0.125rem;transition:margin-bottom 0.2s,padding-top 0.2s;}[aria-expanded]{margin-bottom:1rem;}[aria-expanded='false']{margin-bottom:1.125rem;`,
48
48
  ` `,
@@ -50,31 +50,31 @@ export const StyledAccordionItem = styled(AccordionItem).withConfig({
50
50
  ], AccordionInfo, ColumnTitle);
51
51
  export const TokenInfoWrapper = styled.div.withConfig({
52
52
  displayName: "Colors.styles__TokenInfoWrapper",
53
- componentId: "sc-998f2ec3-7"
53
+ componentId: "sc-e9243388-7"
54
54
  })([
55
55
  `display:flex;flex-direction:column;gap:0.75rem;margin-top:-0.125rem;`
56
56
  ]);
57
57
  export const ColorTokenDataWrapper = styled.div.withConfig({
58
58
  displayName: "Colors.styles__ColorTokenDataWrapper",
59
- componentId: "sc-998f2ec3-8"
59
+ componentId: "sc-e9243388-8"
60
60
  })([
61
61
  `display:flex;flex-direction:column;gap:0.5rem;`
62
62
  ]);
63
63
  export const StateDataWrapper = styled.div.withConfig({
64
64
  displayName: "Colors.styles__StateDataWrapper",
65
- componentId: "sc-998f2ec3-9"
65
+ componentId: "sc-e9243388-9"
66
66
  })([
67
67
  `display:flex;flex-direction:column;gap:0.5rem;margin-bottom:0.75rem;`
68
68
  ]);
69
69
  export const OpacityPart = styled.span.withConfig({
70
70
  displayName: "Colors.styles__OpacityPart",
71
- componentId: "sc-998f2ec3-10"
71
+ componentId: "sc-e9243388-10"
72
72
  })([
73
73
  `color:var(--text-secondary);padding-left:0.125rem;`
74
74
  ]);
75
75
  export const TokenInfo = styled.div.withConfig({
76
76
  displayName: "Colors.styles__TokenInfo",
77
- componentId: "sc-998f2ec3-11"
77
+ componentId: "sc-e9243388-11"
78
78
  })([
79
79
  `color:var(--text-paragraph);cursor:default;&.copy{cursor:copy;}&.color{display:flex;align-items:center;gap:2.5rem;}&.no-interaction{text-align:right;}&.hex{padding-left:3.75rem;}&:not(.no-interaction):hover{color:var(--text-paragraph-hover);`,
80
80
  `{color:var(--text-paragraph-hover);}}&:not(.no-interaction):active{color:var(--text-paragraph-active);`,
@@ -82,7 +82,7 @@ export const TokenInfo = styled.div.withConfig({
82
82
  ], OpacityPart, OpacityPart);
83
83
  export const ColorCircle = styled.div.withConfig({
84
84
  displayName: "Colors.styles__ColorCircle",
85
- componentId: "sc-998f2ec3-12"
85
+ componentId: "sc-e9243388-12"
86
86
  })([
87
87
  `width:1.25rem;height:1.25rem;border-radius:50%;background:`,
88
88
  `;box-shadow:`,