@salutejs/plasma-new-hope 0.239.0-canary.1696.12710467472.0 → 0.239.0-canary.1699.12742131493.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 (136) hide show
  1. package/cjs/components/Avatar/Avatar.js +3 -39
  2. package/cjs/components/Avatar/Avatar.js.map +1 -1
  3. package/cjs/components/Avatar/Avatar.styles.js +1 -32
  4. package/cjs/components/Avatar/Avatar.styles.js.map +1 -1
  5. package/cjs/components/Avatar/Avatar.styles_1gd252x.css +5 -0
  6. package/cjs/components/Avatar/Avatar.tokens.js +2 -41
  7. package/cjs/components/Avatar/Avatar.tokens.js.map +1 -1
  8. package/cjs/components/NumberInput/NumberInput.js +9 -3
  9. package/cjs/components/NumberInput/NumberInput.js.map +1 -1
  10. package/cjs/components/NumberInput/ui/Input/Input.js +12 -6
  11. package/cjs/components/NumberInput/ui/Input/Input.js.map +1 -1
  12. package/cjs/components/NumberInput/utils/index.js +8 -0
  13. package/cjs/components/NumberInput/utils/index.js.map +1 -1
  14. package/cjs/index.css +5 -8
  15. package/emotion/cjs/components/Avatar/Avatar.js +4 -39
  16. package/emotion/cjs/components/Avatar/Avatar.styles.js +10 -29
  17. package/emotion/cjs/components/Avatar/Avatar.template-doc.mdx +0 -54
  18. package/emotion/cjs/components/Avatar/Avatar.tokens.js +2 -41
  19. package/emotion/cjs/components/Avatar/utils/index.js +1 -15
  20. package/emotion/cjs/components/NumberInput/NumberInput.js +9 -3
  21. package/emotion/cjs/components/NumberInput/ui/Input/Input.js +12 -6
  22. package/emotion/cjs/components/NumberInput/utils/index.js +9 -2
  23. package/emotion/cjs/examples/plasma_b2c/components/Avatar/Avatar.config.js +7 -25
  24. package/emotion/cjs/examples/plasma_b2c/components/Avatar/Avatar.stories.tsx +1 -134
  25. package/emotion/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +1 -0
  26. package/emotion/cjs/examples/plasma_web/components/Avatar/Avatar.config.js +7 -25
  27. package/emotion/cjs/examples/plasma_web/components/Avatar/Avatar.stories.tsx +1 -134
  28. package/emotion/cjs/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +1 -0
  29. package/emotion/es/components/Avatar/Avatar.js +6 -41
  30. package/emotion/es/components/Avatar/Avatar.styles.js +10 -29
  31. package/emotion/es/components/Avatar/Avatar.template-doc.mdx +0 -54
  32. package/emotion/es/components/Avatar/Avatar.tokens.js +2 -41
  33. package/emotion/es/components/Avatar/utils/index.js +1 -14
  34. package/emotion/es/components/NumberInput/NumberInput.js +9 -3
  35. package/emotion/es/components/NumberInput/ui/Input/Input.js +13 -7
  36. package/emotion/es/components/NumberInput/utils/index.js +8 -1
  37. package/emotion/es/examples/plasma_b2c/components/Avatar/Avatar.config.js +7 -25
  38. package/emotion/es/examples/plasma_b2c/components/Avatar/Avatar.stories.tsx +1 -134
  39. package/emotion/es/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +1 -0
  40. package/emotion/es/examples/plasma_web/components/Avatar/Avatar.config.js +7 -25
  41. package/emotion/es/examples/plasma_web/components/Avatar/Avatar.stories.tsx +1 -134
  42. package/emotion/es/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +1 -0
  43. package/es/components/Avatar/Avatar.js +4 -40
  44. package/es/components/Avatar/Avatar.js.map +1 -1
  45. package/es/components/Avatar/Avatar.styles.js +2 -30
  46. package/es/components/Avatar/Avatar.styles.js.map +1 -1
  47. package/es/components/Avatar/Avatar.styles_1gd252x.css +5 -0
  48. package/es/components/Avatar/Avatar.tokens.js +2 -41
  49. package/es/components/Avatar/Avatar.tokens.js.map +1 -1
  50. package/es/components/NumberInput/NumberInput.js +9 -3
  51. package/es/components/NumberInput/NumberInput.js.map +1 -1
  52. package/es/components/NumberInput/ui/Input/Input.js +13 -7
  53. package/es/components/NumberInput/ui/Input/Input.js.map +1 -1
  54. package/es/components/NumberInput/utils/index.js +8 -1
  55. package/es/components/NumberInput/utils/index.js.map +1 -1
  56. package/es/index.css +5 -8
  57. package/package.json +2 -2
  58. package/styled-components/cjs/components/Avatar/Avatar.js +3 -38
  59. package/styled-components/cjs/components/Avatar/Avatar.styles.js +2 -18
  60. package/styled-components/cjs/components/Avatar/Avatar.template-doc.mdx +0 -54
  61. package/styled-components/cjs/components/Avatar/Avatar.tokens.js +2 -41
  62. package/styled-components/cjs/components/Avatar/utils/index.js +1 -15
  63. package/styled-components/cjs/components/NumberInput/NumberInput.js +9 -3
  64. package/styled-components/cjs/components/NumberInput/ui/Input/Input.js +12 -6
  65. package/styled-components/cjs/components/NumberInput/utils/index.js +9 -2
  66. package/styled-components/cjs/examples/plasma_b2c/components/Avatar/Avatar.config.js +4 -22
  67. package/styled-components/cjs/examples/plasma_b2c/components/Avatar/Avatar.stories.tsx +1 -134
  68. package/styled-components/cjs/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +1 -0
  69. package/styled-components/cjs/examples/plasma_web/components/Avatar/Avatar.config.js +4 -22
  70. package/styled-components/cjs/examples/plasma_web/components/Avatar/Avatar.stories.tsx +1 -134
  71. package/styled-components/cjs/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +1 -0
  72. package/styled-components/es/components/Avatar/Avatar.js +5 -40
  73. package/styled-components/es/components/Avatar/Avatar.styles.js +2 -18
  74. package/styled-components/es/components/Avatar/Avatar.template-doc.mdx +0 -54
  75. package/styled-components/es/components/Avatar/Avatar.tokens.js +2 -41
  76. package/styled-components/es/components/Avatar/utils/index.js +1 -14
  77. package/styled-components/es/components/NumberInput/NumberInput.js +9 -3
  78. package/styled-components/es/components/NumberInput/ui/Input/Input.js +13 -7
  79. package/styled-components/es/components/NumberInput/utils/index.js +8 -1
  80. package/styled-components/es/examples/plasma_b2c/components/Avatar/Avatar.config.js +4 -22
  81. package/styled-components/es/examples/plasma_b2c/components/Avatar/Avatar.stories.tsx +1 -134
  82. package/styled-components/es/examples/plasma_b2c/components/NumberInput/NumberInput.stories.tsx +1 -0
  83. package/styled-components/es/examples/plasma_web/components/Avatar/Avatar.config.js +4 -22
  84. package/styled-components/es/examples/plasma_web/components/Avatar/Avatar.stories.tsx +1 -134
  85. package/styled-components/es/examples/plasma_web/components/NumberInput/NumberInput.stories.tsx +1 -0
  86. package/types/components/Avatar/Avatar.d.ts +21 -3
  87. package/types/components/Avatar/Avatar.d.ts.map +1 -1
  88. package/types/components/Avatar/Avatar.styles.d.ts +0 -59
  89. package/types/components/Avatar/Avatar.styles.d.ts.map +1 -1
  90. package/types/components/Avatar/Avatar.tokens.d.ts +0 -37
  91. package/types/components/Avatar/Avatar.tokens.d.ts.map +1 -1
  92. package/types/components/Avatar/Avatar.types.d.ts +2 -47
  93. package/types/components/Avatar/Avatar.types.d.ts.map +1 -1
  94. package/types/components/Avatar/utils/index.d.ts +0 -1
  95. package/types/components/Avatar/utils/index.d.ts.map +1 -1
  96. package/types/components/Badge/Badge.types.d.ts +21 -8
  97. package/types/components/Badge/Badge.types.d.ts.map +1 -1
  98. package/types/components/Counter/Counter.d.ts +12 -2
  99. package/types/components/Counter/Counter.d.ts.map +1 -1
  100. package/types/components/Counter/Counter.types.d.ts +2 -1
  101. package/types/components/Counter/Counter.types.d.ts.map +1 -1
  102. package/types/components/NumberInput/NumberInput.d.ts.map +1 -1
  103. package/types/components/NumberInput/NumberInput.types.d.ts +5 -0
  104. package/types/components/NumberInput/NumberInput.types.d.ts.map +1 -1
  105. package/types/components/NumberInput/ui/Input/Input.d.ts +1 -0
  106. package/types/components/NumberInput/ui/Input/Input.d.ts.map +1 -1
  107. package/types/components/NumberInput/ui/Input/Input.types.d.ts +1 -0
  108. package/types/components/NumberInput/ui/Input/Input.types.d.ts.map +1 -1
  109. package/types/components/NumberInput/utils/index.d.ts +1 -0
  110. package/types/components/NumberInput/utils/index.d.ts.map +1 -1
  111. package/types/examples/plasma_b2c/components/Avatar/Avatar.config.d.ts +0 -18
  112. package/types/examples/plasma_b2c/components/Avatar/Avatar.config.d.ts.map +1 -1
  113. package/types/examples/plasma_b2c/components/Avatar/Avatar.d.ts +6 -138
  114. package/types/examples/plasma_b2c/components/Avatar/Avatar.d.ts.map +1 -1
  115. package/types/examples/plasma_b2c/components/Badge/Badge.d.ts +48 -8
  116. package/types/examples/plasma_b2c/components/Badge/Badge.d.ts.map +1 -1
  117. package/types/examples/plasma_b2c/components/Counter/Counter.d.ts +6 -1
  118. package/types/examples/plasma_b2c/components/Counter/Counter.d.ts.map +1 -1
  119. package/types/examples/plasma_b2c/components/NumberInput/NumberInput.d.ts +2 -0
  120. package/types/examples/plasma_b2c/components/NumberInput/NumberInput.d.ts.map +1 -1
  121. package/types/examples/plasma_web/components/Avatar/Avatar.config.d.ts +0 -18
  122. package/types/examples/plasma_web/components/Avatar/Avatar.config.d.ts.map +1 -1
  123. package/types/examples/plasma_web/components/Avatar/Avatar.d.ts +6 -138
  124. package/types/examples/plasma_web/components/Avatar/Avatar.d.ts.map +1 -1
  125. package/types/examples/plasma_web/components/Badge/Badge.d.ts +48 -8
  126. package/types/examples/plasma_web/components/Badge/Badge.d.ts.map +1 -1
  127. package/types/examples/plasma_web/components/Counter/Counter.d.ts +6 -1
  128. package/types/examples/plasma_web/components/Counter/Counter.d.ts.map +1 -1
  129. package/types/examples/plasma_web/components/NumberInput/NumberInput.d.ts +2 -0
  130. package/types/examples/plasma_web/components/NumberInput/NumberInput.d.ts.map +1 -1
  131. package/cjs/components/Avatar/Avatar.styles_131qvfx.css +0 -8
  132. package/cjs/components/Avatar/utils/index.js +0 -21
  133. package/cjs/components/Avatar/utils/index.js.map +0 -1
  134. package/es/components/Avatar/Avatar.styles_131qvfx.css +0 -8
  135. package/es/components/Avatar/utils/index.js +0 -17
  136. package/es/components/Avatar/utils/index.js.map +0 -1
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import type { ComponentProps } from 'react';
3
2
  import type { StoryObj, Meta } from '@storybook/react';
4
3
  import { disableProps } from '@salutejs/plasma-sb-utils';
@@ -7,11 +6,6 @@ import { argTypesFromConfig, WithTheme } from '../../../_helpers';
7
6
 
8
7
  import { Avatar, mergedConfig } from './Avatar';
9
8
 
10
- const extraPlacements = ['top-left', 'top-right', 'bottom-left', 'bottom-right'];
11
- const extraType = ['', 'badge', 'counter'];
12
- const counterViews = ['default', 'accent', 'positive', 'warning', 'negative', 'dark', 'light'];
13
- const badgeViews = ['default', 'accent', 'positive', 'warning', 'negative', 'dark', 'light'];
14
-
15
9
  const meta: Meta<typeof Avatar> = {
16
10
  title: 'web/Data Display/Avatar',
17
11
  decorators: [WithTheme],
@@ -19,69 +13,12 @@ const meta: Meta<typeof Avatar> = {
19
13
  argTypes: {
20
14
  ...argTypesFromConfig(mergedConfig),
21
15
  status: { control: 'select', options: ['active', 'inactive'] },
22
- type: {
23
- control: 'select',
24
- options: extraType,
25
- if: { arg: 'hasExtra', truthy: true },
26
- },
27
- extraPlacement: {
28
- control: 'select',
29
- options: extraPlacements,
30
- if: { arg: 'hasExtra', truthy: true },
31
- },
32
- counterView: {
33
- control: 'select',
34
- options: counterViews,
35
- if: { arg: 'type', eq: 'counter' },
36
- },
37
- count: {
38
- control: 'number',
39
- if: { arg: 'type', eq: 'counter' },
40
- },
41
- maxCount: {
42
- control: 'number',
43
- if: { arg: 'type', eq: 'counter' },
44
- },
45
- badgeView: {
46
- control: 'select',
47
- options: badgeViews,
48
- if: { arg: 'type', eq: 'badge' },
49
- },
50
- text: {
51
- control: 'text',
52
- if: { arg: 'type', eq: 'badge' },
53
- },
54
- customColor: {
55
- control: 'color',
56
- if: { arg: 'type', eq: 'badge' },
57
- },
58
- customBackgroundColor: {
59
- control: 'color',
60
- if: { arg: 'type', eq: 'badge' },
61
- },
62
- pilled: {
63
- control: 'boolean',
64
- if: { arg: 'type', eq: 'badge' },
65
- },
66
16
  },
67
17
  };
68
18
 
69
19
  export default meta;
70
20
 
71
- type StoryProps = ComponentProps<typeof Avatar> & {
72
- enableContentLeft: boolean;
73
- enableContentRight: boolean;
74
- };
75
- type Story = StoryObj<StoryProps>;
76
-
77
- const BellIcon = (props) => (
78
- <svg width="100%" viewBox="0 0 24 24" fill="none" {...props}>
79
- <path
80
- d="M11.501 21.28c1.088 0 1.978-.889 1.978-1.977H9.524c0 1.088.88 1.978 1.977 1.978zm5.933-5.932v-4.944c0-3.035-1.622-5.576-4.45-6.248v-.673c0-.82-.662-1.483-1.483-1.483-.82 0-1.483.662-1.483 1.483v.672c-2.838.673-4.45 3.204-4.45 6.25v4.943l-1.275 1.276c-.623.623-.188 1.69.692 1.69h13.022c.88 0 1.325-1.067.702-1.69l-1.275-1.276z"
81
- fill="currentColor"
82
- />
83
- </svg>
84
- );
21
+ type Story = StoryObj<ComponentProps<typeof Avatar>>;
85
22
 
86
23
  export const Default: Story = {
87
24
  args: {
@@ -90,56 +27,10 @@ export const Default: Story = {
90
27
  name: 'Иван Фадеев',
91
28
  url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
92
29
  isScalable: false,
93
- hasExtra: false,
94
- extraPlacement: 'top-right',
95
- type: undefined,
96
- counterView: 'accent',
97
- count: 3,
98
- maxCount: 10,
99
- badgeView: 'accent',
100
- text: '31',
101
- pilled: true,
102
- enableContentLeft: false,
103
- enableContentRight: false,
104
30
  },
105
31
  argTypes: {
106
- enableContentLeft: {
107
- control: { type: 'boolean' },
108
- if: { arg: 'type', eq: 'badge' },
109
- },
110
- enableContentRight: {
111
- control: { type: 'boolean' },
112
- if: { arg: 'type', eq: 'badge' },
113
- },
114
32
  ...disableProps(['focused']),
115
33
  },
116
- render: ({ enableContentLeft, enableContentRight, size, ...rest }: StoryProps) => {
117
- const iconSize = () => {
118
- switch (size) {
119
- case 'xxl':
120
- return '1rem';
121
- case 'm':
122
- return '0.625rem';
123
- default:
124
- return '0.75rem';
125
- }
126
- };
127
-
128
- return (
129
- <>
130
- <Avatar
131
- contentLeft={enableContentLeft ? <BellIcon width={iconSize()} height={iconSize()} /> : undefined}
132
- contentRight={
133
- !enableContentLeft && enableContentRight ? (
134
- <BellIcon width={iconSize()} height={iconSize()} />
135
- ) : undefined
136
- }
137
- size={size}
138
- {...rest}
139
- />
140
- </>
141
- );
142
- },
143
34
  };
144
35
 
145
36
  export const Accessibility: Story = {
@@ -151,14 +42,6 @@ export const Accessibility: Story = {
151
42
  size: 'xxl',
152
43
  status: 'active',
153
44
  focused: true,
154
- hasExtra: false,
155
- extraPlacement: 'top-right',
156
- type: undefined,
157
- counterView: 'accent',
158
- count: 3,
159
- maxCount: 10,
160
- badgeView: 'accent',
161
- text: '31',
162
45
  },
163
46
  };
164
47
 
@@ -172,14 +55,6 @@ export const AccessibilityWithURL: Story = {
172
55
  focused: true,
173
56
  name: 'Микула Селянинович',
174
57
  url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
175
- hasExtra: false,
176
- extraPlacement: 'top-right',
177
- type: undefined,
178
- counterView: 'accent',
179
- count: 3,
180
- maxCount: 10,
181
- badgeView: 'accent',
182
- text: '31',
183
58
  },
184
59
  };
185
60
 
@@ -192,13 +67,5 @@ export const AccessibilityWithCustomText: Story = {
192
67
  status: 'inactive',
193
68
  focused: true,
194
69
  customText: 'ФИО',
195
- hasExtra: false,
196
- extraPlacement: 'top-right',
197
- type: undefined,
198
- counterView: 'accent',
199
- count: 3,
200
- maxCount: 10,
201
- badgeView: 'accent',
202
- text: '31',
203
70
  },
204
71
  };
@@ -96,6 +96,7 @@ export const Default: StoryObj<StoryPropsDefault> = {
96
96
  segmentation: 'default',
97
97
  min: 0,
98
98
  max: 9,
99
+ precision: 2,
99
100
  step: 1,
100
101
  width: 188,
101
102
  isManualInput: false,
@@ -4,15 +4,14 @@ import React, { forwardRef, useMemo } from 'react';
4
4
  import { styled } from '@linaria/react';
5
5
  import { cx } from '../../utils/index.js';
6
6
  import { classes, tokens } from './Avatar.tokens.js';
7
- import { Wrapper, StatusIcon, ExtraContent, ExtraCounter, ExtraBadge, base, Text, Image } from './Avatar.styles.js';
7
+ import { Wrapper, StatusIcon, base, Text, Image } from './Avatar.styles.js';
8
8
  import { base as base$1 } from './variations/_size/base.js';
9
9
  import { base as base$2 } from './variations/_focused/base.js';
10
- import { extraPlacementMap } from './utils/index.js';
11
10
  import { getInitialsForName } from './utils/getInitialsForName.js';
12
11
  import { component, mergeConfig } from '../../engines/common.js';
13
12
  import { indicatorConfig } from '../Indicator/Indicator.js';
14
13
 
15
- var _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable", "statusLabels", "hasExtra", "extraPlacement", "type", "counterView", "count", "maxCount", "badgeView", "text", "customColor", "customBackgroundColor", "contentLeft", "contentRight", "pilled"];
14
+ var _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable", "statusLabels"];
16
15
  var StatusLabelsDefault = {
17
16
  active: 'Активен',
18
17
  inactive: 'Неактивен'
@@ -79,19 +78,6 @@ var avatarRoot = function avatarRoot(Root) {
79
78
  isScalable = props.isScalable,
80
79
  _props$statusLabels = props.statusLabels,
81
80
  statusLabels = _props$statusLabels === void 0 ? StatusLabelsDefault : _props$statusLabels,
82
- hasExtra = props.hasExtra,
83
- extraPlacement = props.extraPlacement,
84
- type = props.type,
85
- counterView = props.counterView,
86
- count = props.count,
87
- maxCount = props.maxCount,
88
- badgeView = props.badgeView,
89
- text = props.text,
90
- customColor = props.customColor,
91
- customBackgroundColor = props.customBackgroundColor,
92
- contentLeft = props.contentLeft,
93
- contentRight = props.contentRight,
94
- pilled = props.pilled,
95
81
  rest = _objectWithoutProperties(props, _excluded);
96
82
  var initials = useMemo(function () {
97
83
  return getInitialsForName(name);
@@ -99,18 +85,13 @@ var avatarRoot = function avatarRoot(Root) {
99
85
  var ariaLabel = getAriaLabel(_objectSpread2(_objectSpread2({}, props), {}, {
100
86
  statusLabels: statusLabels
101
87
  }));
102
- var extraViewProp = type === 'badge' ? {
103
- badgeView: badgeView
104
- } : {
105
- counterView: counterView
106
- };
107
88
  return /*#__PURE__*/React.createElement(Root, _extends({
108
89
  ref: ref,
109
90
  size: avatarSize,
110
91
  className: cx(classes.avatarItem, className),
111
92
  "aria-label": ariaLabel,
112
93
  focused: focused
113
- }, extraViewProp, rest), /*#__PURE__*/React.createElement(Wrapper, {
94
+ }, rest), /*#__PURE__*/React.createElement(Wrapper, {
114
95
  isScalable: isScalable
115
96
  }, getAvatarContent({
116
97
  customText: customText,
@@ -120,24 +101,7 @@ var avatarRoot = function avatarRoot(Root) {
120
101
  })), status && /*#__PURE__*/React.createElement(StatusIcon, null, /*#__PURE__*/React.createElement(StyledIndicator, {
121
102
  "aria-label": statusLabels[status],
122
103
  status: status
123
- })), hasExtra && avatarSize !== 'fit' && /*#__PURE__*/React.createElement(ExtraContent, {
124
- className: extraPlacementMap(extraPlacement)
125
- }, type === 'counter' ? /*#__PURE__*/React.createElement(ExtraCounter, {
126
- view: counterView,
127
- count: count || 1,
128
- maxCount: maxCount
129
- }) : avatarSize !== 's' && /*#__PURE__*/React.createElement(ExtraBadge, _extends({
130
- view: badgeView,
131
- text: text,
132
- customColor: customColor,
133
- customBackgroundColor: customBackgroundColor,
134
- pilled: pilled,
135
- maxWidth: "100%"
136
- }, contentLeft ? {
137
- contentLeft: contentLeft
138
- } : {
139
- contentRight: contentRight
140
- }))));
104
+ })));
141
105
  });
142
106
  };
143
107
  var avatarConfig = {
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React, { forwardRef, useMemo, ReactElement } from 'react';\nimport { styled } from '@linaria/react';\n\nimport { RootProps, component, mergeConfig } from '../../engines';\nimport { cx } from '../../utils';\nimport { indicatorConfig, indicatorTokens } from '../Indicator';\n\nimport { classes, tokens } from './Avatar.tokens';\nimport { base, Wrapper, Image, StatusIcon, Text, ExtraContent, ExtraCounter, ExtraBadge } from './Avatar.styles';\nimport { base as viewCSS } from './variations/_size/base';\nimport { base as focusedCSS } from './variations/_focused/base';\nimport { extraPlacementMap, getInitialsForName } from './utils';\nimport type { AvatarProps, StatusLabels } from './Avatar.types';\n\nconst StatusLabelsDefault: StatusLabels = {\n active: 'Активен',\n inactive: 'Неактивен',\n};\n\nconst getAvatarContent = ({\n customText,\n url,\n initials,\n name,\n}: Omit<AvatarProps, 'size'> & { initials?: string }): ReactElement => {\n if (customText) {\n return <Text>{customText}</Text>;\n }\n\n if (url) {\n return <Image src={url} alt={name} />;\n }\n\n return <Text>{initials}</Text>;\n};\n\nconst getAriaLabel = ({\n url,\n name,\n status,\n 'aria-label': ariaLabelProp,\n statusLabels,\n}: Pick<AvatarProps, 'url' | 'status' | 'name' | 'aria-label'> & {\n statusLabels: StatusLabels;\n}) => {\n if (!url) {\n return;\n }\n\n // INFO: включаем aria-label чтобы озвучить что на изображении\n const ariaLabel = !ariaLabelProp || ariaLabelProp.trim() === '' ? name : ariaLabelProp;\n\n return status ? `${ariaLabel}. ${statusLabels[status]}` : ariaLabel;\n};\n\nconst mergedConfig = mergeConfig(indicatorConfig);\n\nconst Indicator: React.FunctionComponent<\n React.HTMLAttributes<HTMLDivElement> & { status: AvatarProps['status'] }\n> = component(mergedConfig) as never;\n\nconst StyledIndicator = styled(Indicator)`\n ${indicatorTokens.size}: var(${tokens.statusIconSize});\n ${indicatorTokens.color}: ${({ status }) =>\n status === 'active' ? `var(${tokens.statusOnlineColor})` : `var(${tokens.statusOfflineColor})`}\n`;\n\nexport const avatarRoot = (Root: RootProps<HTMLDivElement, AvatarProps>) => {\n return forwardRef<HTMLDivElement, AvatarProps>((props, ref) => {\n const {\n size: avatarSize,\n name,\n url,\n customText,\n status,\n className,\n focused = true,\n isScalable,\n statusLabels = StatusLabelsDefault,\n hasExtra,\n extraPlacement,\n\n type,\n\n counterView,\n count,\n maxCount,\n\n badgeView,\n text,\n customColor,\n customBackgroundColor,\n contentLeft,\n contentRight,\n pilled,\n\n ...rest\n } = props;\n\n const initials = useMemo(() => getInitialsForName(name), [name]);\n const ariaLabel = getAriaLabel({\n ...props,\n statusLabels,\n });\n\n const extraViewProp = type === 'badge' ? { badgeView } : { counterView };\n\n return (\n <Root\n ref={ref}\n size={avatarSize}\n className={cx(classes.avatarItem, className)}\n aria-label={ariaLabel}\n focused={focused}\n {...extraViewProp}\n {...rest}\n >\n <Wrapper isScalable={isScalable}>{getAvatarContent({ customText, url, initials, name })}</Wrapper>\n\n {status && (\n <StatusIcon>\n <StyledIndicator aria-label={statusLabels[status]} status={status} />\n </StatusIcon>\n )}\n\n {hasExtra && avatarSize !== 'fit' && (\n <ExtraContent className={extraPlacementMap(extraPlacement)}>\n {type === 'counter' ? (\n <ExtraCounter view={counterView} count={count || 1} maxCount={maxCount} />\n ) : (\n avatarSize !== 's' && (\n <ExtraBadge\n view={badgeView}\n text={text}\n customColor={customColor}\n customBackgroundColor={customBackgroundColor}\n pilled={pilled}\n maxWidth=\"100%\"\n {...(contentLeft ? { contentLeft } : { contentRight })}\n />\n )\n )}\n </ExtraContent>\n )}\n </Root>\n );\n });\n};\n\nexport const avatarConfig = {\n name: 'Avatar',\n tag: 'div',\n layout: avatarRoot,\n base,\n variations: {\n size: {\n css: viewCSS,\n },\n focused: {\n css: focusedCSS,\n },\n },\n defaults: {\n size: 'm',\n },\n};\n"],"names":["StatusLabelsDefault","active","inactive","getAvatarContent","_ref","customText","url","initials","name","React","createElement","Text","Image","src","alt","getAriaLabel","_ref2","status","ariaLabelProp","statusLabels","ariaLabel","trim","concat","mergedConfig","mergeConfig","indicatorConfig","Indicator","component","_exp","_exp5","_ref3","tokens","statusOnlineColor","statusOfflineColor","StyledIndicator","styled","class","propsAsIs","vars","avatarRoot","Root","forwardRef","props","ref","avatarSize","size","className","_props$focused","focused","isScalable","_props$statusLabels","hasExtra","extraPlacement","type","counterView","count","maxCount","badgeView","text","customColor","customBackgroundColor","contentLeft","contentRight","pilled","rest","_excluded","useMemo","getInitialsForName","_objectSpread","extraViewProp","_extends","cx","classes","avatarItem","Wrapper","StatusIcon","ExtraContent","extraPlacementMap","ExtraCounter","view","ExtraBadge","maxWidth","avatarConfig","tag","layout","base","variations","css","viewCSS","focusedCSS","defaults"],"mappings":"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"}
1
+ {"version":3,"file":"Avatar.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React, { forwardRef, useMemo, ReactElement } from 'react';\nimport { styled } from '@linaria/react';\n\nimport { RootProps, component, mergeConfig } from '../../engines';\nimport { cx } from '../../utils';\nimport { indicatorConfig, indicatorTokens } from '../Indicator';\n\nimport { classes, tokens } from './Avatar.tokens';\nimport { base, Wrapper, Image, StatusIcon, Text } from './Avatar.styles';\nimport { base as viewCSS } from './variations/_size/base';\nimport { base as focusedCSS } from './variations/_focused/base';\nimport { getInitialsForName } from './utils';\nimport type { AvatarProps, StatusLabels } from './Avatar.types';\n\nconst StatusLabelsDefault: StatusLabels = {\n active: 'Активен',\n inactive: 'Неактивен',\n};\n\nconst getAvatarContent = ({\n customText,\n url,\n initials,\n name,\n}: Omit<AvatarProps, 'size'> & { initials?: string }): ReactElement => {\n if (customText) {\n return <Text>{customText}</Text>;\n }\n\n if (url) {\n return <Image src={url} alt={name} />;\n }\n\n return <Text>{initials}</Text>;\n};\n\nconst getAriaLabel = ({\n url,\n name,\n status,\n 'aria-label': ariaLabelProp,\n statusLabels,\n}: Pick<AvatarProps, 'url' | 'status' | 'name' | 'aria-label'> & {\n statusLabels: StatusLabels;\n}) => {\n if (!url) {\n return;\n }\n\n // INFO: включаем aria-label чтобы озвучить что на изображении\n const ariaLabel = !ariaLabelProp || ariaLabelProp.trim() === '' ? name : ariaLabelProp;\n\n return status ? `${ariaLabel}. ${statusLabels[status]}` : ariaLabel;\n};\n\nconst mergedConfig = mergeConfig(indicatorConfig);\n\nconst Indicator: React.FunctionComponent<\n React.HTMLAttributes<HTMLDivElement> & { status: AvatarProps['status'] }\n> = component(mergedConfig) as never;\n\nconst StyledIndicator = styled(Indicator)`\n ${indicatorTokens.size}: var(${tokens.statusIconSize});\n ${indicatorTokens.color}: ${({ status }) =>\n status === 'active' ? `var(${tokens.statusOnlineColor})` : `var(${tokens.statusOfflineColor})`}\n`;\n\nexport const avatarRoot = (Root: RootProps<HTMLDivElement, AvatarProps>) => {\n return forwardRef<HTMLDivElement, AvatarProps>((props, ref) => {\n const {\n size: avatarSize,\n name,\n url,\n customText,\n status,\n className,\n focused = true,\n isScalable,\n statusLabels = StatusLabelsDefault,\n ...rest\n } = props;\n\n const initials = useMemo(() => getInitialsForName(name), [name]);\n const ariaLabel = getAriaLabel({\n ...props,\n statusLabels,\n });\n\n return (\n <Root\n ref={ref}\n size={avatarSize}\n className={cx(classes.avatarItem, className)}\n aria-label={ariaLabel}\n focused={focused}\n {...rest}\n >\n <Wrapper isScalable={isScalable}>{getAvatarContent({ customText, url, initials, name })}</Wrapper>\n\n {status && (\n <StatusIcon>\n <StyledIndicator aria-label={statusLabels[status]} status={status} />\n </StatusIcon>\n )}\n </Root>\n );\n });\n};\n\nexport const avatarConfig = {\n name: 'Avatar',\n tag: 'div',\n layout: avatarRoot,\n base,\n variations: {\n size: {\n css: viewCSS,\n },\n focused: {\n css: focusedCSS,\n },\n },\n defaults: {\n size: 'm',\n },\n};\n"],"names":["StatusLabelsDefault","active","inactive","getAvatarContent","_ref","customText","url","initials","name","React","createElement","Text","Image","src","alt","getAriaLabel","_ref2","status","ariaLabelProp","statusLabels","ariaLabel","trim","concat","mergedConfig","mergeConfig","indicatorConfig","Indicator","component","_exp","_exp5","_ref3","tokens","statusOnlineColor","statusOfflineColor","StyledIndicator","styled","class","propsAsIs","vars","avatarRoot","Root","forwardRef","props","ref","avatarSize","size","className","_props$focused","focused","isScalable","_props$statusLabels","rest","_excluded","useMemo","getInitialsForName","_objectSpread","_extends","cx","classes","avatarItem","Wrapper","StatusIcon","avatarConfig","tag","layout","base","variations","css","viewCSS","focusedCSS","defaults"],"mappings":"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"}
@@ -1,14 +1,7 @@
1
- import './Avatar.styles_131qvfx.css';
1
+ import './Avatar.styles_1gd252x.css';
2
2
  import { styled } from '@linaria/react';
3
3
  import { tokens } from './Avatar.tokens.js';
4
- import { component, mergeConfig } from '../../engines/common.js';
5
- import { badgeConfig } from '../Badge/Badge.js';
6
- import { counterConfig } from '../Counter/Counter.js';
7
4
 
8
- var mergedBadgeConfig = /*#__PURE__*/mergeConfig(badgeConfig);
9
- var Badge = /*#__PURE__*/component(mergedBadgeConfig);
10
- var mergedCounterConfig = /*#__PURE__*/mergeConfig(counterConfig);
11
- var Counter = /*#__PURE__*/component(mergedCounterConfig);
12
5
  var base = "b1d1rtx8";
13
6
  var _exp2 = function _exp2() {
14
7
  return function (_ref) {
@@ -46,27 +39,6 @@ var Text = /*#__PURE__*/styled('span')({
46
39
  "class": "t1kfsxcq",
47
40
  propsAsIs: false
48
41
  });
49
- var ExtraContent = /*#__PURE__*/styled('div')({
50
- name: "ExtraContent",
51
- "class": "e1i3umn2",
52
- propsAsIs: false
53
- });
54
- var _exp26 = function _exp26() {
55
- return Badge;
56
- };
57
- var ExtraBadge = /*#__PURE__*/styled(_exp26())({
58
- name: "ExtraBadge",
59
- "class": "eqy70yy",
60
- propsAsIs: true
61
- });
62
- var _exp69 = function _exp69() {
63
- return Counter;
64
- };
65
- var ExtraCounter = /*#__PURE__*/styled(_exp69())({
66
- name: "ExtraCounter",
67
- "class": "e4nvvok",
68
- propsAsIs: true
69
- });
70
42
 
71
- export { ExtraBadge, ExtraContent, ExtraCounter, Image, StatusIcon, Text, Wrapper, base };
43
+ export { Image, StatusIcon, Text, Wrapper, base };
72
44
  //# sourceMappingURL=Avatar.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.styles.js","sources":["../../../src/components/Avatar/Avatar.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\nimport { styled } from '@linaria/react';\n\nimport { component, mergeConfig } from '../../engines';\nimport { badgeConfig, badgeTokens } from '../Badge';\nimport { counterConfig, counterTokens } from '../Counter';\n\nimport { classes, tokens } from './Avatar.tokens';\nimport { AvatarProps } from './Avatar.types';\n\nconst mergedBadgeConfig = mergeConfig(badgeConfig);\nconst Badge = component(mergedBadgeConfig);\n\nconst mergedCounterConfig = mergeConfig(counterConfig);\nconst Counter = component(mergedCounterConfig);\n\nexport const base = css`\n position: relative;\n`;\n\nexport const Wrapper = styled.div<{ isScalable?: AvatarProps['isScalable'] }>`\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n border-radius: 50%;\n background: var(${tokens.backgroundColor});\n overflow: hidden;\n\n &:hover {\n scale: ${({ isScalable }) => (isScalable ? `var(${tokens.scaleHover})` : '1')};\n cursor: ${({ isScalable }) => (isScalable ? 'pointer' : 'inherit')};\n }\n`;\n\nexport const StatusIcon = styled.div`\n position: absolute;\n top: calc(1.02 * 0.85 * var(${tokens.avatarSize}) - var(${tokens.statusIconSize}) / 2);\n left: calc(1.02 * 0.85 * var(${tokens.avatarSize}) - var(${tokens.statusIconSize}) / 2);\n`;\n\nexport const Image = styled.img`\n width: 100%;\n height: 100%;\n border-radius: 50%;\n`;\n\nexport const Text = styled.span`\n font-size: var(${tokens.fontSize});\n font-family: var(${tokens.fontFamily});\n font-weight: var(${tokens.fontWeight});\n line-height: var(${tokens.lineHeight});\n background-image: var(${tokens.color});\n background-color: var(${tokens.color});\n background-size: 100%;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n`;\n\nexport const ExtraContent = styled.div`\n max-width: 100%;\n display: flex;\n\n position: absolute;\n z-index: 2;\n\n &.${classes.extraPlacementTopLeft} {\n top: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n left: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n }\n\n &.${classes.extraPlacementTopRight} {\n top: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n right: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n }\n\n &.${classes.extraPlacementBottomRight} {\n bottom: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n right: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n }\n\n &.${classes.extraPlacementBottomLeft} {\n bottom: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n left: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n }\n`;\n\nexport const ExtraBadge = styled(Badge)`\n ${badgeTokens.background}: var(${tokens.badgeBackground});\n ${badgeTokens.color}: var(${tokens.badgeColor});\n ${badgeTokens.backgroundTransparent}: var(${tokens.badgeBackgroundTransparent});\n ${badgeTokens.colorTransparent}: var(${tokens.badgeColorTransparent});\n ${badgeTokens.colorClear}: var(${tokens.badgeColorClear});\n ${badgeTokens.backgroundClear}: var(${tokens.badgeBackgroundClear});\n ${badgeTokens.borderRadius}: var(${tokens.badgeBorderRadius});\n ${badgeTokens.pilledBorderRadius}: var(${tokens.badgePilledBorderRadius});\n ${badgeTokens.height}: var(${tokens.badgeHeight});\n ${badgeTokens.padding}: var(${tokens.badgePadding});\n ${badgeTokens.paddingIconOnly}: var(${tokens.badgePaddingIconOnly});\n ${badgeTokens.fontFamily}: var(${tokens.badgeFontFamily});\n ${badgeTokens.fontSize}: var(${tokens.badgeFontSize});\n ${badgeTokens.fontStyle}: var(${tokens.badgeFontStyle});\n ${badgeTokens.fontWeight}: var(${tokens.badgeFontWeight});\n ${badgeTokens.letterSpacing}: var(${tokens.badgeLetterSpacing});\n ${badgeTokens.lineHeight}: var(${tokens.badgeLineHeight});\n ${badgeTokens.leftContentMarginLeft}: var(${tokens.badgeLeftContentMarginLeft});\n ${badgeTokens.leftContentMarginRight}: var(${tokens.badgeLeftContentMarginRight});\n ${badgeTokens.rightContentMarginLeft}: var(${tokens.badgeRightContentMarginLeft});\n ${badgeTokens.rightContentMarginRight}: var(${tokens.badgeRightContentMarginRight});\n`;\n\nexport const ExtraCounter = styled(Counter)`\n ${counterTokens.background}: var(${tokens.counterBackground});\n ${counterTokens.color}: var(${tokens.counterColor});\n ${counterTokens.borderRadius}: var(${tokens.counterBorderRadius});\n ${counterTokens.height}: var(${tokens.counterHeight});\n ${counterTokens.padding}: var(${tokens.counterPadding});\n ${counterTokens.fontFamily}: var(${tokens.counterFontFamily});\n ${counterTokens.fontSize}: var(${tokens.counterFontSize});\n ${counterTokens.fontStyle}: var(${tokens.counterFontStyle});\n ${counterTokens.fontWeight}: var(${tokens.counterFontWeight});\n ${counterTokens.letterSpacing}: var(${tokens.counterLetterSpacing});\n ${counterTokens.lineHeight}: var(${tokens.counterLineHeight});\n`;\n"],"names":["mergedBadgeConfig","mergeConfig","badgeConfig","Badge","component","mergedCounterConfig","counterConfig","Counter","base","_exp2","_ref","isScalable","concat","tokens","scaleHover","_exp3","_ref2","Wrapper","styled","name","class","propsAsIs","vars","StatusIcon","Image","Text","ExtraContent","_exp26","ExtraBadge","_exp69","ExtraCounter"],"mappings":";;;;;;AAUA,IAAMA,iBAAiB,gBAAGC,WAAW,CAACC,WAAW,CAAC,CAAA;AAClD,IAAMC,KAAK,gBAAGC,SAAS,CAACJ,iBAAiB,CAAC,CAAA;AAE1C,IAAMK,mBAAmB,gBAAGJ,WAAW,CAACK,aAAa,CAAC,CAAA;AACtD,IAAMC,OAAO,gBAAGH,SAAS,CAACC,mBAAmB,CAAC,CAAA;AAEvC,IAAMG,IAAI,GAEhB,WAAA;AAAC,IAAAC,KAAA,GAjBgBA,SAiBhBA,KAAAA,GAAA;AAAA,EAAA,OAae,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAGC,UAAAA,GAAAA,IAAAA,CAAAA,UAAAA,CAAAA;IAAAA,OAAkBA,UAAU,UAAAC,MAAA,CAAUC,MAAM,CAACC,UAAW,SAAK,GAAI,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAC,KAAA,GA9BnEA,SA8BmEA,KAAAA,GAAA;AAAA,EAAA,OACnE,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGL,UAAAA,GAAAA,KAAAA,CAAAA,UAAAA,CAAAA;AAAAA,IAAAA,OAAkBA,UAAU,GAAG,SAAS,GAAG,SAAU,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAZnE,IAAMM,OAAO,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,SAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAAC,EAAAA,IAAA,EAAA;AAAA,IAAA,WAAA,EAAA,cAWZb,KAAoE,EAAA,CAAA;AAAA,IAAA,WAAA,EAAA,cACnEM,KAAwD,EAAA,CAAA;AAAA,GAAA;AAAA,CAEzE,EAAA;AAEM,IAAMQ,UAAU,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAI/B,EAAA;AAEM,IAAMG,KAAK,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,OAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAI1B,EAAA;AAEM,IAAMI,IAAI,gBAAGP,MAAM,CAAA,MAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,MAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAUzB,EAAA;AAEM,IAAMK,YAAY,gBAAGR,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CA0BjC,EAAA;AAAC,IAAAM,MAAA,GArFgBA,SAqFhBA,MAAAA,GAAA;AAAA,EAAA,OAE+BxB,KAAK,CAAA;AAAA,CAAA,CAAA;AAA/B,IAAMyB,UAAU,gBAAGV,MAAM,CAAAS,MAAA,EAAA,CAAA,CAAA;AAAAR,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAsB/B,EAAA;AAAC,IAAAQ,MAAA,GA7GgBA,SA6GhBA,MAAAA,GAAA;AAAA,EAAA,OAEiCtB,OAAO,CAAA;AAAA,CAAA,CAAA;AAAnC,IAAMuB,YAAY,gBAAGZ,MAAM,CAAAW,MAAA,EAAA,CAAA,CAAA;AAAAV,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAYjC;;;;"}
1
+ {"version":3,"file":"Avatar.styles.js","sources":["../../../src/components/Avatar/Avatar.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\nimport { styled } from '@linaria/react';\n\nimport { tokens } from './Avatar.tokens';\nimport { AvatarProps } from './Avatar.types';\n\nexport const base = css`\n position: relative;\n`;\n\nexport const Wrapper = styled.div<{ isScalable?: AvatarProps['isScalable'] }>`\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n border-radius: 50%;\n background: var(${tokens.backgroundColor});\n overflow: hidden;\n\n &:hover {\n scale: ${({ isScalable }) => (isScalable ? `var(${tokens.scaleHover})` : '1')};\n cursor: ${({ isScalable }) => (isScalable ? 'pointer' : 'inherit')};\n }\n`;\n\nexport const StatusIcon = styled.div`\n position: absolute;\n top: calc(1.02 * 0.85 * var(${tokens.avatarSize}) - var(${tokens.statusIconSize}) / 2);\n left: calc(1.02 * 0.85 * var(${tokens.avatarSize}) - var(${tokens.statusIconSize}) / 2);\n`;\n\nexport const Image = styled.img`\n width: 100%;\n height: 100%;\n border-radius: 50%;\n`;\n\nexport const Text = styled.span`\n font-size: var(${tokens.fontSize});\n font-family: var(${tokens.fontFamily});\n font-weight: var(${tokens.fontWeight});\n line-height: var(${tokens.lineHeight});\n background-image: var(${tokens.color});\n background-color: var(${tokens.color});\n background-size: 100%;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n`;\n"],"names":["base","_exp2","_ref","isScalable","concat","tokens","scaleHover","_exp3","_ref2","Wrapper","styled","name","class","propsAsIs","vars","StatusIcon","Image","Text"],"mappings":";;;AAMO,IAAMA,IAAI,GAEhB,WAAA;AAAC,IAAAC,KAAA,GAPgBA,SAOhBA,KAAAA,GAAA;AAAA,EAAA,OAae,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAGC,UAAAA,GAAAA,IAAAA,CAAAA,UAAAA,CAAAA;IAAAA,OAAkBA,UAAU,UAAAC,MAAA,CAAUC,MAAM,CAACC,UAAW,SAAK,GAAI,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAC,KAAA,GApBnEA,SAoBmEA,KAAAA,GAAA;AAAA,EAAA,OACnE,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGL,UAAAA,GAAAA,KAAAA,CAAAA,UAAAA,CAAAA;AAAAA,IAAAA,OAAkBA,UAAU,GAAG,SAAS,GAAG,SAAU,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAZnE,IAAMM,OAAO,gBAAGC,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,SAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAAC,EAAAA,IAAA,EAAA;AAAA,IAAA,WAAA,EAAA,cAWZb,KAAoE,EAAA,CAAA;AAAA,IAAA,WAAA,EAAA,cACnEM,KAAwD,EAAA,CAAA;AAAA,GAAA;AAAA,CAEzE,EAAA;AAEM,IAAMQ,UAAU,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAI/B,EAAA;AAEM,IAAMG,KAAK,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,OAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAI1B,EAAA;AAEM,IAAMI,IAAI,gBAAGP,MAAM,CAAA,MAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,MAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAUzB;;;;"}
@@ -0,0 +1,5 @@
1
+ .b1d1rtx8{position:relative;}
2
+ .wxwn3we{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;height:100%;border-radius:50%;background:var(--plasma-avatar-background);overflow:hidden;}.wxwn3we:hover{scale:var(--wxwn3we-0);cursor:var(--wxwn3we-1);}
3
+ .sf2jhi1{position:absolute;top:calc(1.02 * 0.85 * var(--plasma-avatar-size) - var(--plasma-status-icon-size) / 2);left:calc(1.02 * 0.85 * var(--plasma-avatar-size) - var(--plasma-status-icon-size) / 2);}
4
+ .igq6ihg{width:100%;height:100%;border-radius:50%;}
5
+ .t1kfsxcq{font-size:var(--plasma-avatar-font-size);font-family:var(--plasma-avatar-font-family);font-weight:var(--plasma-avatar-font-weight);line-height:var(--plasma-avatar-line-height);background-image:var(--plasma-avatar-color);background-color:var(--plasma-avatar-color);background-size:100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
@@ -1,9 +1,5 @@
1
1
  var classes = {
2
- avatarItem: 'avatar-item',
3
- extraPlacementTopRight: 'avatar-extra-placement-top-right',
4
- extraPlacementTopLeft: 'avatar-extra-placement-top-left',
5
- extraPlacementBottomLeft: 'avatar-extra-placement-bottom-left',
6
- extraPlacementBottomRight: 'avatar-extra-placement-bottom-right'
2
+ avatarItem: 'avatar-item'
7
3
  };
8
4
  var tokens = {
9
5
  avatarSize: '--plasma-avatar-size',
@@ -19,42 +15,7 @@ var tokens = {
19
15
  outlineColor: '--plasma-avatar-outline-color',
20
16
  outlineSize: '--plasma-avatar-outline-size',
21
17
  outlineOffset: '--plasma-avatar-outline-offset',
22
- scaleHover: '--plasma-avatar-scale-hover',
23
- extraPlacementFactor: '--plasma-avatar-extra-placement-factor',
24
- // extra badge tokens
25
- badgeBackground: '--plasma-avatar-extra-badge-background',
26
- badgeColor: '--plasma-avatar-extra-badge-color',
27
- badgeBackgroundTransparent: '--plasma-avatar-extra-badge-background-transparent',
28
- badgeColorTransparent: '--plasma-avatar-extra-badge-color-transparent',
29
- badgeColorClear: '--plasma-avatar-extra-badge-color-clear',
30
- badgeBackgroundClear: '--plasma-avatar-extra-badge-background-clear',
31
- badgeBorderRadius: '--plasma-avatar-extra-badge-border-radius',
32
- badgePilledBorderRadius: '--plasma-avatar-extra-badge-pilled-border-radius',
33
- badgeHeight: '--plasma-avatar-extra-badge-height',
34
- badgePadding: '--plasma-avatar-extra-badge-padding',
35
- badgePaddingIconOnly: '--plasma-avatar-extra-badge-padding-icon-only',
36
- badgeFontFamily: '--plasma-avatar-extra-badge-font-family',
37
- badgeFontSize: '--plasma-avatar-extra-badge-font-size',
38
- badgeFontStyle: '--plasma-avatar-extra-badge-font-style',
39
- badgeFontWeight: '--plasma-avatar-extra-badge-font-weight',
40
- badgeLetterSpacing: '--plasma-avatar-extra-badge-letter-spacing',
41
- badgeLineHeight: '--plasma-avatar-extra-badge-lineheight',
42
- badgeLeftContentMarginLeft: '--plasma-avatar-extra-badge-left-content-margin-left',
43
- badgeLeftContentMarginRight: '--plasma-avatar-extra-badge-left-content-margin-right',
44
- badgeRightContentMarginLeft: '--plasma-avatar-extra-badge-right-content-margin-left',
45
- badgeRightContentMarginRight: '--plasma-avatar-extra-badge-right-content-margin-right',
46
- // extra counter tokens
47
- counterBackground: '--plasma-avatar-extra-counter-background',
48
- counterColor: '--plasma-avatar-extra-counter-color',
49
- counterBorderRadius: '--plasma-avatar-extra-counter-border-radius',
50
- counterHeight: '--plasma-avatar-extra-counter-height',
51
- counterPadding: '--plasma-avatar-extra-counter-padding',
52
- counterFontFamily: '--plasma-avatar-extra-counter-font-family',
53
- counterFontSize: '--plasma-avatar-extra-counter-font-size',
54
- counterFontStyle: '--plasma-avatar-extra-counter-font-style',
55
- counterFontWeight: '--plasma-avatar-extra-counter-font-weight',
56
- counterLetterSpacing: '--plasma-avatar-extra-counter-letter-spacing',
57
- counterLineHeight: '--plasma-avatar-extra-counter-lineheight'
18
+ scaleHover: '--plasma-avatar-scale-hover'
58
19
  };
59
20
 
60
21
  export { classes, tokens };
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.tokens.js","sources":["../../../src/components/Avatar/Avatar.tokens.ts"],"sourcesContent":["export const classes = {\n avatarItem: 'avatar-item',\n extraPlacementTopRight: 'avatar-extra-placement-top-right',\n extraPlacementTopLeft: 'avatar-extra-placement-top-left',\n extraPlacementBottomLeft: 'avatar-extra-placement-bottom-left',\n extraPlacementBottomRight: 'avatar-extra-placement-bottom-right',\n};\n\nexport const tokens = {\n avatarSize: '--plasma-avatar-size',\n fontFamily: '--plasma-avatar-font-family',\n fontSize: '--plasma-avatar-font-size',\n color: '--plasma-avatar-color',\n fontWeight: '--plasma-avatar-font-weight',\n lineHeight: '--plasma-avatar-line-height',\n backgroundColor: '--plasma-avatar-background',\n statusIconSize: '--plasma-status-icon-size',\n statusOnlineColor: '--plasma-avatar-status-online-background',\n statusOfflineColor: '--plasma-avatar-status-offline-background',\n outlineColor: '--plasma-avatar-outline-color',\n outlineSize: '--plasma-avatar-outline-size',\n outlineOffset: '--plasma-avatar-outline-offset',\n scaleHover: '--plasma-avatar-scale-hover',\n extraPlacementFactor: '--plasma-avatar-extra-placement-factor',\n\n // extra badge tokens\n badgeBackground: '--plasma-avatar-extra-badge-background',\n badgeColor: '--plasma-avatar-extra-badge-color',\n badgeBackgroundTransparent: '--plasma-avatar-extra-badge-background-transparent',\n badgeColorTransparent: '--plasma-avatar-extra-badge-color-transparent',\n badgeColorClear: '--plasma-avatar-extra-badge-color-clear',\n badgeBackgroundClear: '--plasma-avatar-extra-badge-background-clear',\n\n badgeBorderRadius: '--plasma-avatar-extra-badge-border-radius',\n badgePilledBorderRadius: '--plasma-avatar-extra-badge-pilled-border-radius',\n badgeHeight: '--plasma-avatar-extra-badge-height',\n badgePadding: '--plasma-avatar-extra-badge-padding',\n badgePaddingIconOnly: '--plasma-avatar-extra-badge-padding-icon-only',\n\n badgeFontFamily: '--plasma-avatar-extra-badge-font-family',\n badgeFontSize: '--plasma-avatar-extra-badge-font-size',\n badgeFontStyle: '--plasma-avatar-extra-badge-font-style',\n badgeFontWeight: '--plasma-avatar-extra-badge-font-weight',\n badgeLetterSpacing: '--plasma-avatar-extra-badge-letter-spacing',\n badgeLineHeight: '--plasma-avatar-extra-badge-lineheight',\n\n badgeLeftContentMarginLeft: '--plasma-avatar-extra-badge-left-content-margin-left',\n badgeLeftContentMarginRight: '--plasma-avatar-extra-badge-left-content-margin-right',\n badgeRightContentMarginLeft: '--plasma-avatar-extra-badge-right-content-margin-left',\n badgeRightContentMarginRight: '--plasma-avatar-extra-badge-right-content-margin-right',\n\n // extra counter tokens\n counterBackground: '--plasma-avatar-extra-counter-background',\n counterColor: '--plasma-avatar-extra-counter-color',\n\n counterBorderRadius: '--plasma-avatar-extra-counter-border-radius',\n counterHeight: '--plasma-avatar-extra-counter-height',\n counterPadding: '--plasma-avatar-extra-counter-padding',\n\n counterFontFamily: '--plasma-avatar-extra-counter-font-family',\n counterFontSize: '--plasma-avatar-extra-counter-font-size',\n counterFontStyle: '--plasma-avatar-extra-counter-font-style',\n counterFontWeight: '--plasma-avatar-extra-counter-font-weight',\n counterLetterSpacing: '--plasma-avatar-extra-counter-letter-spacing',\n counterLineHeight: '--plasma-avatar-extra-counter-lineheight',\n};\n"],"names":["classes","avatarItem","extraPlacementTopRight","extraPlacementTopLeft","extraPlacementBottomLeft","extraPlacementBottomRight","tokens","avatarSize","fontFamily","fontSize","color","fontWeight","lineHeight","backgroundColor","statusIconSize","statusOnlineColor","statusOfflineColor","outlineColor","outlineSize","outlineOffset","scaleHover","extraPlacementFactor","badgeBackground","badgeColor","badgeBackgroundTransparent","badgeColorTransparent","badgeColorClear","badgeBackgroundClear","badgeBorderRadius","badgePilledBorderRadius","badgeHeight","badgePadding","badgePaddingIconOnly","badgeFontFamily","badgeFontSize","badgeFontStyle","badgeFontWeight","badgeLetterSpacing","badgeLineHeight","badgeLeftContentMarginLeft","badgeLeftContentMarginRight","badgeRightContentMarginLeft","badgeRightContentMarginRight","counterBackground","counterColor","counterBorderRadius","counterHeight","counterPadding","counterFontFamily","counterFontSize","counterFontStyle","counterFontWeight","counterLetterSpacing","counterLineHeight"],"mappings":"AAAO,IAAMA,OAAO,GAAG;AACnBC,EAAAA,UAAU,EAAE,aAAa;AACzBC,EAAAA,sBAAsB,EAAE,kCAAkC;AAC1DC,EAAAA,qBAAqB,EAAE,iCAAiC;AACxDC,EAAAA,wBAAwB,EAAE,oCAAoC;AAC9DC,EAAAA,yBAAyB,EAAE,qCAAA;AAC/B,EAAC;AAEM,IAAMC,MAAM,GAAG;AAClBC,EAAAA,UAAU,EAAE,sBAAsB;AAClCC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,QAAQ,EAAE,2BAA2B;AACrCC,EAAAA,KAAK,EAAE,uBAAuB;AAC9BC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,eAAe,EAAE,4BAA4B;AAC7CC,EAAAA,cAAc,EAAE,2BAA2B;AAC3CC,EAAAA,iBAAiB,EAAE,0CAA0C;AAC7DC,EAAAA,kBAAkB,EAAE,2CAA2C;AAC/DC,EAAAA,YAAY,EAAE,+BAA+B;AAC7CC,EAAAA,WAAW,EAAE,8BAA8B;AAC3CC,EAAAA,aAAa,EAAE,gCAAgC;AAC/CC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,oBAAoB,EAAE,wCAAwC;AAE9D;AACAC,EAAAA,eAAe,EAAE,wCAAwC;AACzDC,EAAAA,UAAU,EAAE,mCAAmC;AAC/CC,EAAAA,0BAA0B,EAAE,oDAAoD;AAChFC,EAAAA,qBAAqB,EAAE,+CAA+C;AACtEC,EAAAA,eAAe,EAAE,yCAAyC;AAC1DC,EAAAA,oBAAoB,EAAE,8CAA8C;AAEpEC,EAAAA,iBAAiB,EAAE,2CAA2C;AAC9DC,EAAAA,uBAAuB,EAAE,kDAAkD;AAC3EC,EAAAA,WAAW,EAAE,oCAAoC;AACjDC,EAAAA,YAAY,EAAE,qCAAqC;AACnDC,EAAAA,oBAAoB,EAAE,+CAA+C;AAErEC,EAAAA,eAAe,EAAE,yCAAyC;AAC1DC,EAAAA,aAAa,EAAE,uCAAuC;AACtDC,EAAAA,cAAc,EAAE,wCAAwC;AACxDC,EAAAA,eAAe,EAAE,yCAAyC;AAC1DC,EAAAA,kBAAkB,EAAE,4CAA4C;AAChEC,EAAAA,eAAe,EAAE,wCAAwC;AAEzDC,EAAAA,0BAA0B,EAAE,sDAAsD;AAClFC,EAAAA,2BAA2B,EAAE,uDAAuD;AACpFC,EAAAA,2BAA2B,EAAE,uDAAuD;AACpFC,EAAAA,4BAA4B,EAAE,wDAAwD;AAEtF;AACAC,EAAAA,iBAAiB,EAAE,0CAA0C;AAC7DC,EAAAA,YAAY,EAAE,qCAAqC;AAEnDC,EAAAA,mBAAmB,EAAE,6CAA6C;AAClEC,EAAAA,aAAa,EAAE,sCAAsC;AACrDC,EAAAA,cAAc,EAAE,uCAAuC;AAEvDC,EAAAA,iBAAiB,EAAE,2CAA2C;AAC9DC,EAAAA,eAAe,EAAE,yCAAyC;AAC1DC,EAAAA,gBAAgB,EAAE,0CAA0C;AAC5DC,EAAAA,iBAAiB,EAAE,2CAA2C;AAC9DC,EAAAA,oBAAoB,EAAE,8CAA8C;AACpEC,EAAAA,iBAAiB,EAAE,0CAAA;AACvB;;;;"}
1
+ {"version":3,"file":"Avatar.tokens.js","sources":["../../../src/components/Avatar/Avatar.tokens.ts"],"sourcesContent":["export const classes = {\n avatarItem: 'avatar-item',\n};\n\nexport const tokens = {\n avatarSize: '--plasma-avatar-size',\n fontFamily: '--plasma-avatar-font-family',\n fontSize: '--plasma-avatar-font-size',\n color: '--plasma-avatar-color',\n fontWeight: '--plasma-avatar-font-weight',\n lineHeight: '--plasma-avatar-line-height',\n backgroundColor: '--plasma-avatar-background',\n statusIconSize: '--plasma-status-icon-size',\n statusOnlineColor: '--plasma-avatar-status-online-background',\n statusOfflineColor: '--plasma-avatar-status-offline-background',\n outlineColor: '--plasma-avatar-outline-color',\n outlineSize: '--plasma-avatar-outline-size',\n outlineOffset: '--plasma-avatar-outline-offset',\n scaleHover: '--plasma-avatar-scale-hover',\n};\n"],"names":["classes","avatarItem","tokens","avatarSize","fontFamily","fontSize","color","fontWeight","lineHeight","backgroundColor","statusIconSize","statusOnlineColor","statusOfflineColor","outlineColor","outlineSize","outlineOffset","scaleHover"],"mappings":"AAAO,IAAMA,OAAO,GAAG;AACnBC,EAAAA,UAAU,EAAE,aAAA;AAChB,EAAC;AAEM,IAAMC,MAAM,GAAG;AAClBC,EAAAA,UAAU,EAAE,sBAAsB;AAClCC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,QAAQ,EAAE,2BAA2B;AACrCC,EAAAA,KAAK,EAAE,uBAAuB;AAC9BC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,eAAe,EAAE,4BAA4B;AAC7CC,EAAAA,cAAc,EAAE,2BAA2B;AAC3CC,EAAAA,iBAAiB,EAAE,0CAA0C;AAC7DC,EAAAA,kBAAkB,EAAE,2CAA2C;AAC/DC,EAAAA,YAAY,EAAE,+BAA+B;AAC7CC,EAAAA,WAAW,EAAE,8BAA8B;AAC3CC,EAAAA,aAAa,EAAE,gCAAgC;AAC/CC,EAAAA,UAAU,EAAE,6BAAA;AAChB;;;;"}
@@ -9,6 +9,7 @@ import { base as base$3 } from './variations/_shape/base.js';
9
9
  import { base as base$4 } from './variations/_background-type/base.js';
10
10
  import { base as base$5 } from './variations/_segmentation/base.js';
11
11
  import { base as base$6 } from './variations/_disabled/base.js';
12
+ import { getPreciseValue } from './utils/index.js';
12
13
  import { isNumber } from '../../utils/isNumber.js';
13
14
  import { ActionButton } from './ui/ActionButton/ActionButton.js';
14
15
  import { IconMinus } from '../_Icon/Icons/IconMinus.js';
@@ -16,7 +17,7 @@ import { NumberInput } from './ui/Input/Input.js';
16
17
  import { IconPlus } from '../_Icon/Icons/IconPlus.js';
17
18
  import { getSizeValueFromProp } from '../../utils/getSizeValueFromProp.js';
18
19
 
19
- var _excluded = ["className", "style", "width", "value", "min", "max", "step", "isLoading", "loader", "size", "view", "clear", "shape", "segmentation", "inputBackgroundType", "disabled", "textBefore", "textAfter", "customIncrementButton", "incrementIcon", "customDecrementButton", "decrementIcon", "isManualInput", "onChange", "onIncrement", "onDecrement"];
20
+ var _excluded = ["className", "style", "width", "value", "min", "max", "step", "precision", "isLoading", "loader", "size", "view", "clear", "shape", "segmentation", "inputBackgroundType", "disabled", "textBefore", "textAfter", "customIncrementButton", "incrementIcon", "customDecrementButton", "decrementIcon", "isManualInput", "onChange", "onIncrement", "onDecrement"];
20
21
  var numberInputRoot = function numberInputRoot(Root) {
21
22
  return /*#__PURE__*/forwardRef(function (_ref, ref) {
22
23
  var _ref2;
@@ -28,6 +29,8 @@ var numberInputRoot = function numberInputRoot(Root) {
28
29
  max = _ref.max,
29
30
  _ref$step = _ref.step,
30
31
  step = _ref$step === void 0 ? 1 : _ref$step,
32
+ _ref$precision = _ref.precision,
33
+ precision = _ref$precision === void 0 ? 2 : _ref$precision,
31
34
  isLoading = _ref.isLoading,
32
35
  loader = _ref.loader,
33
36
  size = _ref.size,
@@ -81,7 +84,8 @@ var numberInputRoot = function numberInputRoot(Root) {
81
84
  if (isLoading || disabled || isAnimationRun) {
82
85
  return;
83
86
  }
84
- var diffValue = Number(innerValue) - step;
87
+ var preciseDiff = getPreciseValue(Number(innerValue) - step, precision);
88
+ var diffValue = Number(preciseDiff);
85
89
  var resValue = min !== undefined && diffValue <= min ? min : diffValue;
86
90
  setInnerValue(resValue);
87
91
  if (onDecrement) {
@@ -95,7 +99,8 @@ var numberInputRoot = function numberInputRoot(Root) {
95
99
  if (isLoading || disabled || isAnimationRun) {
96
100
  return;
97
101
  }
98
- var diffValue = Number(innerValue) + step;
102
+ var preciseDiff = getPreciseValue(Number(innerValue) + step, precision);
103
+ var diffValue = Number(preciseDiff);
99
104
  var resValue = max !== undefined && diffValue >= max ? max : diffValue;
100
105
  setInnerValue(resValue);
101
106
  if (onIncrement) {
@@ -139,6 +144,7 @@ var numberInputRoot = function numberInputRoot(Root) {
139
144
  ref: ref,
140
145
  segmentation: segmentation,
141
146
  value: innerValue,
147
+ precision: precision,
142
148
  min: min,
143
149
  max: max,
144
150
  isManualInput: isManualInput,