@salutejs/plasma-new-hope 0.76.5-canary.1180.8748298731.0 → 0.76.5-canary.1188.8748029637.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (29) hide show
  1. package/cjs/components/Avatar/Avatar.js +3 -28
  2. package/cjs/components/Avatar/Avatar.js.map +1 -1
  3. package/es/components/Avatar/Avatar.js +4 -29
  4. package/es/components/Avatar/Avatar.js.map +1 -1
  5. package/package.json +2 -2
  6. package/styled-components/cjs/components/Avatar/Avatar.js +3 -33
  7. package/styled-components/cjs/components/Avatar/Avatar.template-doc.mdx +2 -52
  8. package/styled-components/cjs/examples/plasma_b2c/components/Avatar/Avatar.stories.tsx +1 -26
  9. package/styled-components/cjs/examples/plasma_b2c/components/AvatarGroup/AvatarGroup.stories.tsx +18 -36
  10. package/styled-components/cjs/examples/plasma_b2c/components/Radiobox/Radiobox.stories.tsx +37 -42
  11. package/styled-components/cjs/examples/plasma_web/components/Avatar/Avatar.stories.tsx +1 -26
  12. package/styled-components/cjs/examples/sds_engineer/components/Avatar/Avatar.stories.tsx +1 -27
  13. package/styled-components/es/components/Avatar/Avatar.js +3 -34
  14. package/styled-components/es/components/Avatar/Avatar.template-doc.mdx +2 -52
  15. package/styled-components/es/examples/plasma_b2c/components/Avatar/Avatar.stories.tsx +1 -26
  16. package/styled-components/es/examples/plasma_b2c/components/AvatarGroup/AvatarGroup.stories.tsx +18 -36
  17. package/styled-components/es/examples/plasma_b2c/components/Radiobox/Radiobox.stories.tsx +37 -42
  18. package/styled-components/es/examples/plasma_web/components/Avatar/Avatar.stories.tsx +1 -26
  19. package/styled-components/es/examples/sds_engineer/components/Avatar/Avatar.stories.tsx +1 -27
  20. package/types/components/Avatar/Avatar.d.ts +1 -3
  21. package/types/components/Avatar/Avatar.d.ts.map +1 -1
  22. package/types/components/Avatar/Avatar.types.d.ts +0 -7
  23. package/types/components/Avatar/Avatar.types.d.ts.map +1 -1
  24. package/types/examples/plasma_b2c/components/Avatar/Avatar.d.ts +0 -2
  25. package/types/examples/plasma_b2c/components/Avatar/Avatar.d.ts.map +1 -1
  26. package/types/examples/plasma_web/components/Avatar/Avatar.d.ts +0 -2
  27. package/types/examples/plasma_web/components/Avatar/Avatar.d.ts.map +1 -1
  28. package/types/examples/sds_engineer/components/Avatar/Avatar.d.ts +0 -1
  29. package/types/examples/sds_engineer/components/Avatar/Avatar.d.ts.map +1 -1
@@ -34,38 +34,13 @@ export const Default: Story = {
34
34
  };
35
35
 
36
36
  export const Accessibility: Story = {
37
- args: {
38
- role: 'button',
39
- name: 'Геннадий Силуянович',
40
- tabIndex: 0,
41
- view: 'default',
42
- size: 'xxl',
43
- status: 'active',
44
- focused: true,
45
- },
46
- };
47
-
48
- export const AccessibilityWithURL: Story = {
49
37
  args: {
50
38
  role: 'button',
51
39
  tabIndex: 0,
52
40
  view: 'default',
53
41
  size: 'xxl',
42
+ name: 'Иван Фадеев',
54
43
  status: 'active',
55
44
  focused: true,
56
- name: 'Микула Селянинович',
57
- url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
58
- },
59
- };
60
-
61
- export const AccessibilityWithCustomText: Story = {
62
- args: {
63
- role: 'button',
64
- tabIndex: 0,
65
- view: 'default',
66
- size: 'xxl',
67
- status: 'inactive',
68
- focused: true,
69
- customText: 'ФИО',
70
45
  },
71
46
  };
@@ -30,36 +30,10 @@ export const Default: Story = {
30
30
  export const Accessibility: Story = {
31
31
  args: {
32
32
  role: 'button',
33
- name: 'Геннадий Силуянович',
34
33
  tabIndex: 0,
35
34
  view: 'default',
36
35
  size: 'xxl',
37
- status: 'active',
38
- focused: true,
39
- },
40
- };
41
-
42
- export const AccessibilityWithURL: Story = {
43
- args: {
44
- role: 'button',
45
- tabIndex: 0,
46
- view: 'default',
47
- size: 'xxl',
48
- status: 'active',
49
- focused: true,
50
- name: 'Микула Селянинович',
51
- url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
52
- },
53
- };
54
-
55
- export const AccessibilityWithCustomText: Story = {
56
- args: {
57
- role: 'button',
58
- tabIndex: 0,
59
- view: 'default',
60
- size: 'xxl',
61
- status: 'inactive',
36
+ name: 'Иван Фадеев',
62
37
  focused: true,
63
- customText: 'ФИО',
64
38
  },
65
39
  };
@@ -1,11 +1,5 @@
1
- function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
- var _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable", "statusLabels"];
1
+ var _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable"];
3
2
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
4
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
5
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
6
- function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
7
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
8
- function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
9
3
  function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
10
4
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
11
5
  import React, { forwardRef, useMemo } from 'react';
@@ -18,10 +12,6 @@ import { base, Wrapper, Image, StatusIcon, Text } from './Avatar.styles';
18
12
  import { base as viewCSS } from './variations/_size/base';
19
13
  import { base as focusedCSS } from './variations/_focused/base';
20
14
  import { getInitialsForName } from './utils';
21
- var StatusLabelsDefault = {
22
- active: 'Активен',
23
- inactive: 'Неактивен'
24
- };
25
15
  var getAvatarContent = function getAvatarContent(_ref) {
26
16
  var customText = _ref.customText,
27
17
  url = _ref.url,
@@ -38,26 +28,12 @@ var getAvatarContent = function getAvatarContent(_ref) {
38
28
  }
39
29
  return /*#__PURE__*/React.createElement(Text, null, initials);
40
30
  };
41
- var getAriaLabel = function getAriaLabel(_ref2) {
42
- var url = _ref2.url,
43
- name = _ref2.name,
44
- status = _ref2.status,
45
- ariaLabelProp = _ref2['aria-label'],
46
- statusLabels = _ref2.statusLabels;
47
- if (!url) {
48
- return;
49
- }
50
-
51
- // INFO: включаем aria-label чтобы озвучить что на изображении
52
- var ariaLabel = !ariaLabelProp || ariaLabelProp.trim() === '' ? name : ariaLabelProp;
53
- return status ? "".concat(ariaLabel, ". ").concat(statusLabels[status]) : ariaLabel;
54
- };
55
31
  var mergedConfig = /*#__PURE__*/mergeConfig(indicatorConfig);
56
32
  var Indicator = /*#__PURE__*/component(mergedConfig);
57
33
  var StyledIndicator = /*#__PURE__*/styled(Indicator).withConfig({
58
34
  componentId: "plasma-new-hope__sc-p4w0wq-0"
59
- })(["", ":var(", ");", ":", ""], indicatorTokens.size, tokens.statusIconSize, indicatorTokens.color, function (_ref3) {
60
- var status = _ref3.status;
35
+ })(["", ":var(", ");", ":", ""], indicatorTokens.size, tokens.statusIconSize, indicatorTokens.color, function (_ref2) {
36
+ var status = _ref2.status;
61
37
  return status === 'active' ? "var(".concat(tokens.statusOnlineColor, ")") : "var(".concat(tokens.statusOfflineColor, ")");
62
38
  });
63
39
  export var avatarRoot = function avatarRoot(Root) {
@@ -71,20 +47,14 @@ export var avatarRoot = function avatarRoot(Root) {
71
47
  _props$focused = props.focused,
72
48
  focused = _props$focused === void 0 ? true : _props$focused,
73
49
  isScalable = props.isScalable,
74
- _props$statusLabels = props.statusLabels,
75
- statusLabels = _props$statusLabels === void 0 ? StatusLabelsDefault : _props$statusLabels,
76
50
  rest = _objectWithoutProperties(props, _excluded);
77
51
  var initials = useMemo(function () {
78
52
  return getInitialsForName(name);
79
53
  }, [name]);
80
- var ariaLabel = getAriaLabel(_objectSpread(_objectSpread({}, props), {}, {
81
- statusLabels: statusLabels
82
- }));
83
54
  return /*#__PURE__*/React.createElement(Root, _extends({
84
55
  ref: ref,
85
56
  size: avatarSize,
86
57
  className: cx(classes.avatarItem, className),
87
- "aria-label": ariaLabel,
88
58
  focused: focused
89
59
  }, rest), /*#__PURE__*/React.createElement(Wrapper, {
90
60
  isScalable: isScalable
@@ -94,7 +64,6 @@ export var avatarRoot = function avatarRoot(Root) {
94
64
  initials: initials,
95
65
  name: name
96
66
  })), status && /*#__PURE__*/React.createElement(StatusIcon, null, /*#__PURE__*/React.createElement(StyledIndicator, {
97
- "aria-label": statusLabels[status],
98
67
  status: status
99
68
  })));
100
69
  });
@@ -81,32 +81,7 @@ export function App() {
81
81
  ```
82
82
 
83
83
  ### Доступность
84
-
85
- #### Avatar c использованием изображения
86
-
87
- В данном случае руководствуемся принципом универсального дизайна, т.е. незрячий должен получить ту же информацию, что и зрячий.
88
-
89
- Поэтому добавляем/используем свойства: `role`, `tabIndex` и `aria-label`.
90
-
91
- Примечание:
92
- - если указано свойство `name` то `aria-label` можно опустить;
93
-
94
- ```tsx live
95
- import React from 'react';
96
- import { Avatar } from '@salutejs/{{ package }}';
97
-
98
- export function App() {
99
- return (
100
- <>
101
- <Avatar role="button" tabIndex={0} name="Иван Фадеев" url="https://avatars.githubusercontent.com/u/1813468?v=4" />
102
- </>
103
- );
104
- }
105
- ```
106
-
107
- #### Avatar c текстом
108
-
109
- В этом случае достаточно указать свойство `name`.
84
+ Добавляем `"role"` и `"tabIndex"`.
110
85
 
111
86
  ```tsx live
112
87
  import React from 'react';
@@ -115,33 +90,8 @@ import { Avatar } from '@salutejs/{{ package }}';
115
90
  export function App() {
116
91
  return (
117
92
  <>
118
- <Avatar role="button" tabIndex={0} name="Иван Фадеев" />
93
+ <Avatar role="button" tabIndex="0" name="Иван Фадеев" />
119
94
  </>
120
95
  );
121
96
  }
122
97
  ```
123
-
124
- #### Avatar и статус
125
-
126
- Если указано свойство `status` его значение будет так же озвучено в комбинации со свойством `name` или `aria-label`.
127
-
128
- ```tsx live
129
- import React from 'react';
130
- import { Avatar } from '@salutejs/{{ package }}';
131
-
132
- export function App() {
133
- return (
134
- <>
135
- <Avatar role="button" tabIndex={0} name="Иван Фадеев" status="inactive" />
136
- </>
137
- );
138
- }
139
- ```
140
-
141
- Озвучит как `ИФ. Неактивен`. (В данном примере озвучиваются инициалы, производное от ФИО)
142
-
143
- #### Свойство statusLabels
144
-
145
- Опциональное свойство для корректной озвучки значений свойства `status`.
146
-
147
- По-умолчанию стоит значение для русскоговорящих `{ active: 'Активен', inactive: 'Неактивен' }`.
@@ -34,38 +34,13 @@ export const Default: Story = {
34
34
  };
35
35
 
36
36
  export const Accessibility: Story = {
37
- args: {
38
- role: 'button',
39
- name: 'Геннадий Силуянович',
40
- tabIndex: 0,
41
- view: 'default',
42
- size: 'xxl',
43
- status: 'active',
44
- focused: true,
45
- },
46
- };
47
-
48
- export const AccessibilityWithURL: Story = {
49
37
  args: {
50
38
  role: 'button',
51
39
  tabIndex: 0,
52
40
  view: 'default',
53
41
  size: 'xxl',
42
+ name: 'Иван Фадеев',
54
43
  status: 'active',
55
44
  focused: true,
56
- name: 'Микула Селянинович',
57
- url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
58
- },
59
- };
60
-
61
- export const AccessibilityWithCustomText: Story = {
62
- args: {
63
- role: 'button',
64
- tabIndex: 0,
65
- view: 'default',
66
- size: 'xxl',
67
- status: 'inactive',
68
- focused: true,
69
- customText: 'ФИО',
70
45
  },
71
46
  };
@@ -8,7 +8,6 @@ import { Avatar } from '../Avatar/Avatar';
8
8
  import { AvatarGroup } from './AvatarGroup';
9
9
 
10
10
  type Story = StoryObj<ComponentProps<typeof AvatarGroup>>;
11
- type Avatar = ComponentProps<typeof Avatar>;
12
11
 
13
12
  const meta: Meta<typeof AvatarGroup> = {
14
13
  title: 'plasma_b2c/AvatarGroup',
@@ -34,57 +33,40 @@ export const Default: Story = {
34
33
 
35
34
  export const DynamicSize: Story = {
36
35
  args: { totalCount: 10, visibleCount: 3 },
37
- render: ({ visibleCount, totalCount, ...args }: ComponentProps<typeof AvatarGroup>) => {
38
- const itemLength = totalCount;
36
+ render: (args: ComponentProps<typeof AvatarGroup>) => {
37
+ const itemLength = args.totalCount;
39
38
 
40
39
  return (
41
40
  <AvatarGroup {...args}>
42
- {Array(visibleCount)
41
+ {Array(args.visibleCount)
43
42
  .fill(true)
44
43
  .map((_, index) => (
45
- <Avatar size="xxl" key={index} customText={index + 1} />
44
+ <Avatar size="xxl" customText={index + 1} />
46
45
  ))}
47
46
 
48
- {itemLength > visibleCount && <Avatar size="xxl" customText={`+${itemLength - visibleCount}`} />}
47
+ {itemLength > args.visibleCount && (
48
+ <Avatar size="xxl" customText={`+${itemLength - args.visibleCount}`} />
49
+ )}
49
50
  </AvatarGroup>
50
51
  );
51
52
  },
52
53
  };
53
54
 
54
- const list: Array<Avatar> = [
55
- {
56
- name: 'Илья Муромец',
57
- status: 'active',
58
- url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
59
- },
60
- {
61
- name: 'Алеша Попович',
62
- status: 'active',
63
- url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
64
- },
65
- {
66
- name: 'Добрыня Никитич',
67
- status: 'active',
68
- url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
69
- },
70
- {
71
- name: 'Микула Селянинович',
72
- status: 'inactive',
73
- url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
74
- },
75
- {
76
- name: 'Ставр Годинович',
77
- status: 'inactive',
78
- },
79
- ];
80
-
81
55
  export const Accessibility: Story = {
82
56
  render: (args: ComponentProps<typeof AvatarGroup>) => {
83
57
  return (
84
58
  <AvatarGroup {...args}>
85
- {list.map((props) => (
86
- <Avatar role="button" tabIndex={0} focused key={props.name} size="xxl" {...props} />
87
- ))}
59
+ {Array(5)
60
+ .fill(true)
61
+ .map(() => (
62
+ <Avatar
63
+ role="button"
64
+ tabIndex={0}
65
+ focused
66
+ size="xxl"
67
+ url="https://avatars.githubusercontent.com/u/1813468?v=4"
68
+ />
69
+ ))}
88
70
  </AvatarGroup>
89
71
  );
90
72
  },
@@ -51,61 +51,56 @@ const items = [
51
51
  { langName, value: 'elixir', label: 'Elixir', disabled: true },
52
52
  ];
53
53
 
54
- const StoryDefault = (props: RadioboxProps) => {
54
+ const StoryDefault = ({ label, description, ...props }: RadioboxProps) => {
55
55
  const value = 0;
56
56
  const [checked, setChecked] = useState(true);
57
57
 
58
58
  return (
59
- <>
60
- <Radiobox
61
- name="item.name"
62
- value={value}
63
- singleLine
64
- label="Label"
65
- description="Description"
66
- checked={checked}
67
- onChange={(event) => {
68
- event.persist();
69
-
70
- setChecked(event.target.checked);
71
- onChange(event);
72
- }}
73
- onFocus={onFocus}
74
- onBlur={onBlur}
75
- {...props}
76
- />
77
- <Radiobox
78
- name="item.name"
79
- value={value}
80
- singleLine
81
- label="Label looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooonger"
82
- description="Description looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooonger"
83
- checked={checked}
84
- onChange={(event) => {
85
- event.persist();
86
-
87
- setChecked(event.target.checked);
88
- onChange(event);
89
- }}
90
- onFocus={onFocus}
91
- onBlur={onBlur}
92
- {...props}
93
- />
94
- </>
59
+ <Radiobox
60
+ name="item.name"
61
+ value={value}
62
+ singleLine
63
+ label={label}
64
+ description={description}
65
+ checked={checked}
66
+ onChange={(event) => {
67
+ event.persist();
68
+
69
+ setChecked(event.target.checked);
70
+ onChange(event);
71
+ }}
72
+ onFocus={onFocus}
73
+ onBlur={onBlur}
74
+ {...props}
75
+ />
95
76
  );
96
77
  };
97
78
 
98
79
  export const Default: StoryObj<RadioboxProps> = {
80
+ args: {
81
+ ...meta.args,
82
+ label: 'Это label',
83
+ description: 'Это описание',
84
+ },
85
+ render: (args) => <StoryDefault {...args} />,
86
+ };
87
+
88
+ export const LongText: StoryObj<RadioboxProps> = {
89
+ args: {
90
+ ...meta.args,
91
+ label: 'Ооооооооооооооооооооочень длинный label',
92
+ description: 'Ооооооооооооооооооооочень длинный description',
93
+ },
99
94
  render: (args) => <StoryDefault {...args} />,
100
95
  };
101
96
 
102
- const StoryComplex = (props: RadioboxProps) => {
97
+ const StoryRadioGroup = (props: RadioboxProps) => {
103
98
  const [value, setValue] = useState('c');
104
99
 
105
100
  return (
106
- <RadioGroup>
101
+ <RadioGroup aria-labelledby="radiogroup-title-id">
107
102
  <div id="radiogroup-title-id" style={{ margin: '1rem 0', fontWeight: '600' }}>
108
- Radiogroup Title
103
+ Выберите язык программирования для изучения.
109
104
  </div>
110
105
  {items.map((item) => (
111
106
  <Radiobox
@@ -129,6 +124,6 @@ const StoryComplex = (props: RadioboxProps) => {
129
124
  );
130
125
  };
131
126
 
132
- export const Complex: StoryObj<RadioboxProps> = {
133
- render: (args) => <StoryComplex {...args} />,
127
+ export const ExampleRadioGroup: StoryObj<RadioboxProps> = {
128
+ render: (args) => <StoryRadioGroup {...args} />,
134
129
  };
@@ -34,38 +34,13 @@ export const Default: Story = {
34
34
  };
35
35
 
36
36
  export const Accessibility: Story = {
37
- args: {
38
- role: 'button',
39
- name: 'Геннадий Силуянович',
40
- tabIndex: 0,
41
- view: 'default',
42
- size: 'xxl',
43
- status: 'active',
44
- focused: true,
45
- },
46
- };
47
-
48
- export const AccessibilityWithURL: Story = {
49
37
  args: {
50
38
  role: 'button',
51
39
  tabIndex: 0,
52
40
  view: 'default',
53
41
  size: 'xxl',
42
+ name: 'Иван Фадеев',
54
43
  status: 'active',
55
44
  focused: true,
56
- name: 'Микула Селянинович',
57
- url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
58
- },
59
- };
60
-
61
- export const AccessibilityWithCustomText: Story = {
62
- args: {
63
- role: 'button',
64
- tabIndex: 0,
65
- view: 'default',
66
- size: 'xxl',
67
- status: 'inactive',
68
- focused: true,
69
- customText: 'ФИО',
70
45
  },
71
46
  };
@@ -30,36 +30,10 @@ export const Default: Story = {
30
30
  export const Accessibility: Story = {
31
31
  args: {
32
32
  role: 'button',
33
- name: 'Геннадий Силуянович',
34
33
  tabIndex: 0,
35
34
  view: 'default',
36
35
  size: 'xxl',
37
- status: 'active',
38
- focused: true,
39
- },
40
- };
41
-
42
- export const AccessibilityWithURL: Story = {
43
- args: {
44
- role: 'button',
45
- tabIndex: 0,
46
- view: 'default',
47
- size: 'xxl',
48
- status: 'active',
49
- focused: true,
50
- name: 'Микула Селянинович',
51
- url: 'https://avatars.githubusercontent.com/u/1813468?v=4',
52
- },
53
- };
54
-
55
- export const AccessibilityWithCustomText: Story = {
56
- args: {
57
- role: 'button',
58
- tabIndex: 0,
59
- view: 'default',
60
- size: 'xxl',
61
- status: 'inactive',
36
+ name: 'Иван Фадеев',
62
37
  focused: true,
63
- customText: 'ФИО',
64
38
  },
65
39
  };
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import { RootProps } from '../../engines';
3
- import type { AvatarProps, StatusLabels } from './Avatar.types';
3
+ import { AvatarProps } from './Avatar.types';
4
4
  export declare const avatarRoot: (Root: RootProps<HTMLDivElement, AvatarProps>) => React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
5
5
  size: "m" | "s" | "l" | "xxl" | "fit";
6
6
  name?: string | undefined;
@@ -9,7 +9,6 @@ export declare const avatarRoot: (Root: RootProps<HTMLDivElement, AvatarProps>)
9
9
  status?: "active" | "inactive" | undefined;
10
10
  isScalable?: boolean | undefined;
11
11
  focused?: boolean | undefined;
12
- statusLabels?: StatusLabels | undefined;
13
12
  } & React.RefAttributes<HTMLDivElement>>;
14
13
  export declare const avatarConfig: {
15
14
  name: string;
@@ -22,7 +21,6 @@ export declare const avatarConfig: {
22
21
  status?: "active" | "inactive" | undefined;
23
22
  isScalable?: boolean | undefined;
24
23
  focused?: boolean | undefined;
25
- statusLabels?: StatusLabels | undefined;
26
24
  } & React.RefAttributes<HTMLDivElement>>;
27
25
  base: import("@linaria/core").LinariaClassName;
28
26
  variations: {
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAGjE,OAAO,EAAE,SAAS,EAA0B,MAAM,eAAe,CAAC;AASlE,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAuDhE,eAAO,MAAM,UAAU,SAAU,UAAU,cAAc,EAAE,WAAW,CAAC;;;;;;;;;wCAwCtE,CAAC;AAEF,eAAO,MAAM,YAAY;;;mBA1CQ,UAAU,cAAc,EAAE,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;CA0DtE,CAAC"}
1
+ {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAGjE,OAAO,EAAE,SAAS,EAA0B,MAAM,eAAe,CAAC;AAMlE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAiC7C,eAAO,MAAM,UAAU,SAAU,UAAU,cAAc,EAAE,WAAW,CAAC;;;;;;;;wCA4BtE,CAAC;AAEF,eAAO,MAAM,YAAY;;;mBA9BQ,UAAU,cAAc,EAAE,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;CA8CtE,CAAC"}
@@ -7,14 +7,7 @@ declare type CustomAvatarProps = {
7
7
  status?: 'active' | 'inactive';
8
8
  isScalable?: boolean;
9
9
  focused?: boolean;
10
- /**
11
- * Словарь для озвучивания значений свойства status [a11y]
12
- * @default
13
- * { active: 'Активен', inactive: 'Неактивен' }
14
- */
15
- statusLabels?: StatusLabels;
16
10
  };
17
- export declare type StatusLabels = Record<'active' | 'inactive', string>;
18
11
  export declare type AvatarProps = HTMLAttributes<HTMLDivElement> & CustomAvatarProps;
19
12
  export {};
20
13
  //# sourceMappingURL=Avatar.types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.types.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,aAAK,iBAAiB,GAAG;IAErB,IAAI,EAAE,KAAK,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,KAAK,CAAC;IAEtC,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,MAAM,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAE/B,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;CAC/B,CAAC;AAEF,oBAAY,YAAY,GAAG,MAAM,CAAC,QAAQ,GAAG,UAAU,EAAE,MAAM,CAAC,CAAC;AAEjE,oBAAY,WAAW,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG,iBAAiB,CAAC"}
1
+ {"version":3,"file":"Avatar.types.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,aAAK,iBAAiB,GAAG;IAErB,IAAI,EAAE,KAAK,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,KAAK,CAAC;IAEtC,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,MAAM,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAE/B,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,oBAAY,WAAW,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG,iBAAiB,CAAC"}
@@ -35,7 +35,6 @@ export declare const mergedConfig: import("../../../../engines").ComponentConfig
35
35
  status?: "active" | "inactive" | undefined;
36
36
  isScalable?: boolean | undefined;
37
37
  focused?: boolean | undefined;
38
- statusLabels?: import("../../../../components/Avatar/Avatar.types").StatusLabels | undefined;
39
38
  } & import("react").RefAttributes<HTMLDivElement>>;
40
39
  export declare const Avatar: import("react").FunctionComponent<import("../../../../engines/types").PropsType<{
41
40
  view: {
@@ -59,6 +58,5 @@ export declare const Avatar: import("react").FunctionComponent<import("../../../
59
58
  status?: "active" | "inactive" | undefined;
60
59
  isScalable?: boolean | undefined;
61
60
  focused?: boolean | undefined;
62
- statusLabels?: import("../../../../components/Avatar/Avatar.types").StatusLabels | undefined;
63
61
  } & import("react").RefAttributes<HTMLDivElement>>;
64
62
  //# sourceMappingURL=Avatar.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_b2c/components/Avatar/Avatar.ts"],"names":[],"mappings":";AAKA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kDAAoC,CAAC;AAE9D,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;kDAA0B,CAAC"}
1
+ {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_b2c/components/Avatar/Avatar.ts"],"names":[],"mappings":";AAKA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kDAAoC,CAAC;AAE9D,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;kDAA0B,CAAC"}
@@ -35,7 +35,6 @@ export declare const mergedConfig: import("../../../../engines").ComponentConfig
35
35
  status?: "active" | "inactive" | undefined;
36
36
  isScalable?: boolean | undefined;
37
37
  focused?: boolean | undefined;
38
- statusLabels?: import("../../../../components/Avatar/Avatar.types").StatusLabels | undefined;
39
38
  } & import("react").RefAttributes<HTMLDivElement>>;
40
39
  export declare const Avatar: import("react").FunctionComponent<import("../../../../engines/types").PropsType<{
41
40
  view: {
@@ -59,6 +58,5 @@ export declare const Avatar: import("react").FunctionComponent<import("../../../
59
58
  status?: "active" | "inactive" | undefined;
60
59
  isScalable?: boolean | undefined;
61
60
  focused?: boolean | undefined;
62
- statusLabels?: import("../../../../components/Avatar/Avatar.types").StatusLabels | undefined;
63
61
  } & import("react").RefAttributes<HTMLDivElement>>;
64
62
  //# sourceMappingURL=Avatar.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_web/components/Avatar/Avatar.ts"],"names":[],"mappings":";AAKA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kDAAoC,CAAC;AAE9D,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;kDAA0B,CAAC"}
1
+ {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_web/components/Avatar/Avatar.ts"],"names":[],"mappings":";AAKA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kDAAoC,CAAC;AAE9D,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;kDAA0B,CAAC"}
@@ -21,6 +21,5 @@ export declare const Avatar: import("react").FunctionComponent<import("../../../
21
21
  status?: "active" | "inactive" | undefined;
22
22
  isScalable?: boolean | undefined;
23
23
  focused?: boolean | undefined;
24
- statusLabels?: import("../../../../components/Avatar/Avatar.types").StatusLabels | undefined;
25
24
  } & import("react").RefAttributes<HTMLDivElement>>;
26
25
  //# sourceMappingURL=Avatar.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../../src/examples/sds_engineer/components/Avatar/Avatar.tsx"],"names":[],"mappings":";AAOA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;kDAA0B,CAAC"}
1
+ {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../../src/examples/sds_engineer/components/Avatar/Avatar.tsx"],"names":[],"mappings":";AAOA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;kDAA0B,CAAC"}