@salutejs/plasma-new-hope 0.90.0-canary.1260.9580678742.0 → 0.91.0-canary.1261.9609334871.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (56) hide show
  1. package/cjs/components/Dropdown/Dropdown.js +15 -16
  2. package/cjs/components/Dropdown/Dropdown.js.map +1 -1
  3. package/cjs/components/Popover/Popover.js +4 -5
  4. package/cjs/components/Popover/Popover.js.map +1 -1
  5. package/cjs/components/TextArea/TextArea.js +6 -4
  6. package/cjs/components/TextArea/TextArea.js.map +1 -1
  7. package/cjs/components/TextArea/hooks/useAutoResize.js +10 -4
  8. package/cjs/components/TextArea/hooks/useAutoResize.js.map +1 -1
  9. package/cjs/components/_Icon/IconRoot.js +1 -1
  10. package/cjs/components/_Icon/IconRoot.js.map +1 -1
  11. package/es/components/Dropdown/Dropdown.js +11 -12
  12. package/es/components/Dropdown/Dropdown.js.map +1 -1
  13. package/es/components/Popover/Popover.js +4 -5
  14. package/es/components/Popover/Popover.js.map +1 -1
  15. package/es/components/TextArea/TextArea.js +7 -5
  16. package/es/components/TextArea/TextArea.js.map +1 -1
  17. package/es/components/TextArea/hooks/useAutoResize.js +10 -4
  18. package/es/components/TextArea/hooks/useAutoResize.js.map +1 -1
  19. package/es/components/_Icon/IconRoot.js +1 -1
  20. package/es/components/_Icon/IconRoot.js.map +1 -1
  21. package/package.json +2 -2
  22. package/styled-components/cjs/components/Button/Button.template-doc.mdx +3 -3
  23. package/styled-components/cjs/components/Dropdown/Dropdown.js +11 -12
  24. package/styled-components/cjs/components/Popover/Popover.js +4 -5
  25. package/styled-components/cjs/components/Radiobox/Radiobox.template-doc.mdx +7 -5
  26. package/styled-components/cjs/components/Segment/Segment.template-doc.mdx +1 -1
  27. package/styled-components/cjs/components/TextArea/TextArea.js +11 -4
  28. package/styled-components/cjs/components/TextArea/TextArea.template-doc.mdx +45 -6
  29. package/styled-components/cjs/components/TextArea/hooks/useAutoResize.js +10 -4
  30. package/styled-components/cjs/components/_Icon/IconRoot.js +1 -1
  31. package/styled-components/es/components/Button/Button.template-doc.mdx +3 -3
  32. package/styled-components/es/components/Dropdown/Dropdown.js +11 -12
  33. package/styled-components/es/components/Popover/Popover.js +4 -5
  34. package/styled-components/es/components/Radiobox/Radiobox.template-doc.mdx +7 -5
  35. package/styled-components/es/components/Segment/Segment.template-doc.mdx +1 -1
  36. package/styled-components/es/components/TextArea/TextArea.js +12 -4
  37. package/styled-components/es/components/TextArea/TextArea.template-doc.mdx +45 -6
  38. package/styled-components/es/components/TextArea/hooks/useAutoResize.js +10 -4
  39. package/styled-components/es/components/_Icon/IconRoot.js +1 -1
  40. package/types/components/Dropdown/Dropdown.d.ts +2 -2
  41. package/types/components/Dropdown/Dropdown.d.ts.map +1 -1
  42. package/types/components/Dropdown/Dropdown.types.d.ts +0 -4
  43. package/types/components/Dropdown/Dropdown.types.d.ts.map +1 -1
  44. package/types/components/Popover/Popover.d.ts.map +1 -1
  45. package/types/components/TextArea/TextArea.d.ts +2 -2
  46. package/types/components/TextArea/TextArea.d.ts.map +1 -1
  47. package/types/components/TextArea/TextArea.types.d.ts +49 -23
  48. package/types/components/TextArea/TextArea.types.d.ts.map +1 -1
  49. package/types/components/TextArea/hooks/useAutoResize.d.ts +1 -1
  50. package/types/components/TextArea/hooks/useAutoResize.d.ts.map +1 -1
  51. package/types/examples/plasma_b2c/components/TextArea/TextArea.d.ts +31 -1
  52. package/types/examples/plasma_b2c/components/TextArea/TextArea.d.ts.map +1 -1
  53. package/types/examples/plasma_web/components/TextArea/TextArea.d.ts +31 -1
  54. package/types/examples/plasma_web/components/TextArea/TextArea.d.ts.map +1 -1
  55. package/types/examples/sds_engineer/components/TextArea/TextArea.d.ts +31 -1
  56. package/types/examples/sds_engineer/components/TextArea/TextArea.d.ts.map +1 -1
@@ -24,6 +24,11 @@ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableTo
24
24
  function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
25
25
  function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
26
26
  function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
27
+ 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; }
28
+ 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; }
29
+ 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; }
30
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
31
+ 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); }
27
32
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
28
33
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
29
34
  function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -144,15 +149,17 @@ var textAreaRoot = exports.textAreaRoot = function textAreaRoot(Root) {
144
149
  }
145
150
  onChange === null || onChange === void 0 || onChange(event);
146
151
  }, [value, onChange]);
147
- var dynamicLabelClasses = getDynamicLabelClasses({
152
+ var dynamicLabelClasses = getDynamicLabelClasses(_objectSpread({
148
153
  size: size,
149
154
  readOnly: readOnly,
150
155
  label: label,
151
156
  labelPlacement: labelPlacement,
152
- autoResize: autoResize,
153
- rows: rows,
154
157
  value: value || uncontrolledValue || defaultValue
155
- }, focused);
158
+ }, rows ? {
159
+ rows: rows
160
+ } : {
161
+ autoResize: autoResize
162
+ }), focused);
156
163
  return /*#__PURE__*/_react["default"].createElement(Root, {
157
164
  view: overriddenView,
158
165
  size: size,
@@ -11,7 +11,7 @@ import { PropsTable, Description } from '@site/src/components';
11
11
 
12
12
  ## Использование
13
13
  Компонент `TextArea` может содержать иконку (или кнопку) справа.
14
- Для этого используйте свойство и `contentRight`:
14
+ Для этого используйте свойство `contentRight`:
15
15
 
16
16
  ```tsx live
17
17
  import React from 'react';
@@ -31,16 +31,55 @@ export function App() {
31
31
  }
32
32
  ```
33
33
 
34
- Также можно регулировать высоту и ширину, используя свойства `height` и `width`,
34
+ ### Размеры компонента
35
+ Высоту и ширину можно регулировать с помощью свойств `height` и `width`,
35
36
  указав значения в `rem` или соответствующие свойствам css значения.
37
+ `height` и `width` отвечают за **всю** высоту и ширину компонента.
36
38
 
37
- ## Autoresize
39
+ ```tsx live
40
+ import React from 'react';
41
+ import { TextArea } from '@salutejs/{{ package }}';
42
+
43
+ export function App() {
44
+ return (
45
+ <div>
46
+ <TextArea
47
+ placeholder="Введите значение"
48
+ defaultValue="Значение"
49
+ height={10}
50
+ width={20}
51
+ />
52
+ </div>
53
+ );
54
+ }
55
+ ```
56
+
57
+ Свойства `rows` и `cols` указываются в абсолютных единицах, отвечают за фиксированное количество строк и столбцов.
58
+
59
+ ```tsx live
60
+ import React from 'react';
61
+ import { TextArea } from '@salutejs/{{ package }}';
62
+
63
+ export function App() {
64
+ return (
65
+ <div>
66
+ <TextArea
67
+ placeholder="Введите значение"
68
+ defaultValue="Значение"
69
+ rows={5}
70
+ cols={20}
71
+ />
72
+ </div>
73
+ );
74
+ }
75
+ ```
76
+
77
+ ### Autoresize
38
78
  Также можно включить автоматическое регулирование высоты поля ввода по длине контента внутри (параметра `value`).
39
79
  Для этого необходимо использовать свойство `autoResize`.
40
80
  При этом, если пользователь вручную регулирует высоту(`resize`), то она так и остается пользовательской.
41
81
 
42
- В этом режиме можно указать крайние значения высоты поля ввода, используя свойства `autoMin`, `autoMax`,
43
- указав их в `rem`.
82
+ Свойства `minAuto`, `maxAuto` указываются в абсолютных единицах и отвечают за минимальное и максимальное количество строк.
44
83
 
45
84
  ```tsx live
46
85
  import React from 'react';
@@ -85,4 +124,4 @@ export function App() {
85
124
  </div>
86
125
  );
87
126
  }
88
- ```
127
+ ```
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.useAutoResize = exports.ROOT_FONT_SIZE = void 0;
7
7
  var _react = /*#__PURE__*/require("react");
8
8
  var ROOT_FONT_SIZE = exports.ROOT_FONT_SIZE = 16;
9
- var useAutoResize = exports.useAutoResize = function useAutoResize(active, ref, value, minHeight, maxHeight) {
9
+ var useAutoResize = exports.useAutoResize = function useAutoResize(active, ref, value, minAuto, maxAuto) {
10
10
  var isManualResize = (0, _react.useRef)(false);
11
11
  var previousHeight = (0, _react.useRef)();
12
12
  (0, _react.useEffect)(function () {
@@ -17,9 +17,15 @@ var useAutoResize = exports.useAutoResize = function useAutoResize(active, ref,
17
17
  isManualResize.current = true;
18
18
  return;
19
19
  }
20
- ref.current.style.height = "".concat(minHeight ? minHeight + 1 : '0', "rem");
21
- var scrollHeight = ref.current.scrollHeight / ROOT_FONT_SIZE;
22
- var newHeight = Math.min(scrollHeight, maxHeight ? maxHeight + 1 : scrollHeight);
20
+ var style = getComputedStyle(ref.current);
21
+ var lineHeight = parseInt(style.lineHeight, 10);
22
+ var lineHeightInRem = lineHeight / ROOT_FONT_SIZE;
23
+ var minAutoHeight = minAuto ? minAuto * lineHeightInRem : 0;
24
+ ref.current.style.height = "".concat(minAutoHeight, "rem");
25
+ var lines = Math.floor(ref.current.scrollHeight / lineHeight);
26
+ var newScrollHeight = lines * lineHeightInRem;
27
+ var maxAutoHeight = maxAuto ? maxAuto * lineHeightInRem : newScrollHeight;
28
+ var newHeight = Math.min(newScrollHeight, maxAutoHeight);
23
29
  ref.current.style.height = "".concat(newHeight, "rem");
24
30
  previousHeight.current = newHeight;
25
31
  }
@@ -40,7 +40,7 @@ var IconRoot = exports.IconRoot = function IconRoot(_ref4) {
40
40
  color = _ref4.color,
41
41
  className = _ref4.className,
42
42
  sizeCustomProperty = _ref4.sizeCustomProperty;
43
- var c = color || 'var(--plasma-colors-primary)';
43
+ var c = color || 'var(--text-primary)';
44
44
  var w = sizeCustomProperty ? "var(".concat(sizeCustomProperty, ")") : "".concat(sizeMap[size], "rem");
45
45
  return /*#__PURE__*/_react["default"].createElement(StyledRoot, {
46
46
  "aria-hidden": true,
@@ -86,7 +86,7 @@ import { Button } from '@salutejs/{{package}}';
86
86
 
87
87
  export function App() {
88
88
  return (
89
- <div style={{ display: "flex", flexDirection: "column", gap: "1rem" }}>
89
+ <div style=\{{ display: "flex", flexDirection: "column", gap: "1rem" }}>
90
90
  <Button text="Button" stretching="fixed" />
91
91
  <Button text="Button" stretching="auto" />
92
92
  <Button text="Button" stretching="filled" />
@@ -99,7 +99,7 @@ export function App() {
99
99
  Позиционирование контента внутри кнопки регулируется с помощью свойства `contentPlacing`.
100
100
  Возможные значения свойства `contentPlacing`:
101
101
  + `default` – контент центрируется;
102
- + `relaxed` – контент распологается по краям.
102
+ + `relaxed` – контент располагается по краям.
103
103
 
104
104
  ```tsx live
105
105
  import React from 'react';
@@ -107,7 +107,7 @@ import { Button } from '@salutejs/{{package}}';
107
107
 
108
108
  export function App() {
109
109
  return (
110
- <div style={{ display: "flex", flexDirection: "column", gap: "1rem" }}>
110
+ <div style=\{{ display: "flex", flexDirection: "column", gap: "1rem" }}>
111
111
  <Button text="Hello" value="Plasma" stretching="filled" contentPlacing="default" />
112
112
  <Button text="Hello" value="Plasma" stretching="filled" contentPlacing="relaxed" />
113
113
  </div>
@@ -1,4 +1,4 @@
1
- var _excluded = ["items", "children", "placement", "offset", "closeOnOverlayClick", "onToggle", "size", "view", "itemRole", "className", "listWidth", "listHeight", "listOverflow", "closeOnSelect", "onHover", "onItemSelect", "onItemClick", "trigger", "variant", "hasArrow", "portal"];
1
+ var _excluded = ["items", "children", "placement", "offset", "closeOnOverlayClick", "onToggle", "size", "view", "itemRole", "className", "listWidth", "listHeight", "listOverflow", "closeOnSelect", "onHover", "onItemSelect", "onItemClick", "trigger", "variant", "hasArrow"];
2
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); }
3
3
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4
4
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -54,7 +54,6 @@ export var dropdownRoot = function dropdownRoot(Root) {
54
54
  variant = _ref$variant === void 0 ? 'normal' : _ref$variant,
55
55
  _ref$hasArrow = _ref.hasArrow,
56
56
  hasArrow = _ref$hasArrow === void 0 ? true : _ref$hasArrow,
57
- portal = _ref.portal,
58
57
  rest = _objectWithoutProperties(_ref, _excluded);
59
58
  var _useReducer = useReducer(pathReducer, []),
60
59
  _useReducer2 = _slicedToArray(_useReducer, 2),
@@ -106,8 +105,15 @@ export var dropdownRoot = function dropdownRoot(Root) {
106
105
  }, '').replace(/^(\/)/, '');
107
106
  return focusedToValueMap === null || focusedToValueMap === void 0 || (_focusedToValueMap$ge = focusedToValueMap.get(focusedPathAsString)) === null || _focusedToValueMap$ge === void 0 ? void 0 : _focusedToValueMap$ge.value.toString();
108
107
  };
109
- return /*#__PURE__*/React.createElement(StyledPopover, {
108
+ return /*#__PURE__*/React.createElement(Root, _extends({
109
+ className: cx(className, classes.dropdownRoot),
110
+ ref: ref,
111
+ view: view,
112
+ size: size,
113
+ items: items
114
+ }, rest), /*#__PURE__*/React.createElement(StyledPopover, {
110
115
  isOpen: isCurrentListOpen,
116
+ usePortal: false,
111
117
  onToggle: handleGlobalToggle,
112
118
  offset: offset,
113
119
  placement: getPlacements(placement),
@@ -121,15 +127,8 @@ export var dropdownRoot = function dropdownRoot(Root) {
121
127
  'aria-activedescendant': getActiveDescendant(),
122
128
  onKeyDown: onKeyDown
123
129
  }),
124
- preventOverflow: false,
125
- usePortal: Boolean(portal),
126
- frame: portal
127
- }, /*#__PURE__*/React.createElement(Root, _extends({
128
- className: cx(className, classes.dropdownRoot),
129
- ref: ref,
130
- view: view,
131
- size: size
132
- }, rest), /*#__PURE__*/React.createElement(Ul, {
130
+ preventOverflow: false
131
+ }, /*#__PURE__*/React.createElement(Ul, {
133
132
  listHeight: listHeight,
134
133
  listOverflow: listOverflow,
135
134
  role: "tree",
@@ -114,20 +114,19 @@ export var popoverRoot = function popoverRoot(Root) {
114
114
  }, [closeOnEsc, isOpen, onToggle]);
115
115
  var onDocumentClick = useCallback(function (event) {
116
116
  if (isOpen && closeOnOverlayClick && onToggle) {
117
- var _rootRef$current, _popoverRef$current;
117
+ var _rootRef$current;
118
118
  var targetIsRoot = event.target === rootRef.current;
119
119
  var rootHasTarget = (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.contains(event.target);
120
- var popoverRootHasTarget = (_popoverRef$current = popoverRef.current) === null || _popoverRef$current === void 0 ? void 0 : _popoverRef$current.contains(event.target);
121
- if (!targetIsRoot && !rootHasTarget && !popoverRootHasTarget) {
120
+ if (!targetIsRoot && !rootHasTarget) {
122
121
  onToggle(false, event);
123
122
  }
124
123
  }
125
124
  }, [closeOnOverlayClick, isOpen, onToggle]);
126
125
  var onClick = useCallback(function (event) {
127
126
  if (trigger === 'click') {
128
- var _popoverRef$current2;
127
+ var _popoverRef$current;
129
128
  var targetIsPopover = event.target === popoverRef.current;
130
- var rootHasTarget = (_popoverRef$current2 = popoverRef.current) === null || _popoverRef$current2 === void 0 ? void 0 : _popoverRef$current2.contains(event.target);
129
+ var rootHasTarget = (_popoverRef$current = popoverRef.current) === null || _popoverRef$current === void 0 ? void 0 : _popoverRef$current.contains(event.target);
131
130
  if (!targetIsPopover && !rootHasTarget) {
132
131
  onToggle === null || onToggle === void 0 || onToggle(!isOpen, event);
133
132
  }
@@ -31,9 +31,11 @@ export function App() {
31
31
  Компоненты `Radiobox` следует объединять в `RadioGroup`
32
32
 
33
33
  ```tsx live
34
- <RadioGroup aria-labelledby="radiogroup-title-id">
35
- <H3 id="radiogroup-title-id">Заголовок</H3>
36
- <Radiobox name="radio-1" label="Радиокнопка 1" description="Описание 1" defaultChecked />
37
- <Radiobox name="radio-1" label="Радиокнопка 2" description="Описание 2" />
38
- </RadioGroup>
34
+ <div>
35
+ <RadioGroup aria-labelledby="radiogroup-title-id">
36
+ <H3 id="radiogroup-title-id" style=\{{"margin-bottom": "12px"}}>Заголовок</H3>
37
+ <Radiobox name="radio-1" label="Радиокнопка 1" description="Описание 1" defaultChecked />
38
+ <Radiobox name="radio-1" label="Радиокнопка 2" description="Описание 2" />
39
+ </RadioGroup>
40
+ </div>
39
41
  ```
@@ -53,7 +53,7 @@ export function App() {
53
53
  }
54
54
 
55
55
  return (
56
- <div style={{ display: "block" }} >
56
+ <div style=\{{ display: "block" }} >
57
57
  <SegmentProvider>
58
58
  <SegmentTemplate/>
59
59
  </SegmentProvider>
@@ -1,9 +1,15 @@
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); }
1
2
  var _excluded = ["helperText", "status", "resize", "rightHelper", "leftHelper", "contentRight", "autoResize", "minAuto", "maxAuto", "label", "labelPlacement", "placeholder", "defaultValue", "height", "width", "value", "disabled", "size", "view", "id", "style", "className", "readOnly", "rows", "cols", "onChange"];
2
3
  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); }
3
4
  function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
4
5
  function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
5
6
  function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
6
7
  function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
8
+ 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; }
9
+ 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; }
10
+ 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; }
11
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
12
+ 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); }
7
13
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
8
14
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
9
15
  function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -135,15 +141,17 @@ export var textAreaRoot = function textAreaRoot(Root) {
135
141
  }
136
142
  onChange === null || onChange === void 0 || onChange(event);
137
143
  }, [value, onChange]);
138
- var dynamicLabelClasses = getDynamicLabelClasses({
144
+ var dynamicLabelClasses = getDynamicLabelClasses(_objectSpread({
139
145
  size: size,
140
146
  readOnly: readOnly,
141
147
  label: label,
142
148
  labelPlacement: labelPlacement,
143
- autoResize: autoResize,
144
- rows: rows,
145
149
  value: value || uncontrolledValue || defaultValue
146
- }, focused);
150
+ }, rows ? {
151
+ rows: rows
152
+ } : {
153
+ autoResize: autoResize
154
+ }), focused);
147
155
  return /*#__PURE__*/React.createElement(Root, {
148
156
  view: overriddenView,
149
157
  size: size,
@@ -11,7 +11,7 @@ import { PropsTable, Description } from '@site/src/components';
11
11
 
12
12
  ## Использование
13
13
  Компонент `TextArea` может содержать иконку (или кнопку) справа.
14
- Для этого используйте свойство и `contentRight`:
14
+ Для этого используйте свойство `contentRight`:
15
15
 
16
16
  ```tsx live
17
17
  import React from 'react';
@@ -31,16 +31,55 @@ export function App() {
31
31
  }
32
32
  ```
33
33
 
34
- Также можно регулировать высоту и ширину, используя свойства `height` и `width`,
34
+ ### Размеры компонента
35
+ Высоту и ширину можно регулировать с помощью свойств `height` и `width`,
35
36
  указав значения в `rem` или соответствующие свойствам css значения.
37
+ `height` и `width` отвечают за **всю** высоту и ширину компонента.
36
38
 
37
- ## Autoresize
39
+ ```tsx live
40
+ import React from 'react';
41
+ import { TextArea } from '@salutejs/{{ package }}';
42
+
43
+ export function App() {
44
+ return (
45
+ <div>
46
+ <TextArea
47
+ placeholder="Введите значение"
48
+ defaultValue="Значение"
49
+ height={10}
50
+ width={20}
51
+ />
52
+ </div>
53
+ );
54
+ }
55
+ ```
56
+
57
+ Свойства `rows` и `cols` указываются в абсолютных единицах, отвечают за фиксированное количество строк и столбцов.
58
+
59
+ ```tsx live
60
+ import React from 'react';
61
+ import { TextArea } from '@salutejs/{{ package }}';
62
+
63
+ export function App() {
64
+ return (
65
+ <div>
66
+ <TextArea
67
+ placeholder="Введите значение"
68
+ defaultValue="Значение"
69
+ rows={5}
70
+ cols={20}
71
+ />
72
+ </div>
73
+ );
74
+ }
75
+ ```
76
+
77
+ ### Autoresize
38
78
  Также можно включить автоматическое регулирование высоты поля ввода по длине контента внутри (параметра `value`).
39
79
  Для этого необходимо использовать свойство `autoResize`.
40
80
  При этом, если пользователь вручную регулирует высоту(`resize`), то она так и остается пользовательской.
41
81
 
42
- В этом режиме можно указать крайние значения высоты поля ввода, используя свойства `autoMin`, `autoMax`,
43
- указав их в `rem`.
82
+ Свойства `minAuto`, `maxAuto` указываются в абсолютных единицах и отвечают за минимальное и максимальное количество строк.
44
83
 
45
84
  ```tsx live
46
85
  import React from 'react';
@@ -85,4 +124,4 @@ export function App() {
85
124
  </div>
86
125
  );
87
126
  }
88
- ```
127
+ ```
@@ -1,6 +1,6 @@
1
1
  import { useEffect, useRef } from 'react';
2
2
  export var ROOT_FONT_SIZE = 16;
3
- export var useAutoResize = function useAutoResize(active, ref, value, minHeight, maxHeight) {
3
+ export var useAutoResize = function useAutoResize(active, ref, value, minAuto, maxAuto) {
4
4
  var isManualResize = useRef(false);
5
5
  var previousHeight = useRef();
6
6
  useEffect(function () {
@@ -11,9 +11,15 @@ export var useAutoResize = function useAutoResize(active, ref, value, minHeight,
11
11
  isManualResize.current = true;
12
12
  return;
13
13
  }
14
- ref.current.style.height = "".concat(minHeight ? minHeight + 1 : '0', "rem");
15
- var scrollHeight = ref.current.scrollHeight / ROOT_FONT_SIZE;
16
- var newHeight = Math.min(scrollHeight, maxHeight ? maxHeight + 1 : scrollHeight);
14
+ var style = getComputedStyle(ref.current);
15
+ var lineHeight = parseInt(style.lineHeight, 10);
16
+ var lineHeightInRem = lineHeight / ROOT_FONT_SIZE;
17
+ var minAutoHeight = minAuto ? minAuto * lineHeightInRem : 0;
18
+ ref.current.style.height = "".concat(minAutoHeight, "rem");
19
+ var lines = Math.floor(ref.current.scrollHeight / lineHeight);
20
+ var newScrollHeight = lines * lineHeightInRem;
21
+ var maxAutoHeight = maxAuto ? maxAuto * lineHeightInRem : newScrollHeight;
22
+ var newHeight = Math.min(newScrollHeight, maxAutoHeight);
17
23
  ref.current.style.height = "".concat(newHeight, "rem");
18
24
  previousHeight.current = newHeight;
19
25
  }
@@ -33,7 +33,7 @@ export var IconRoot = function IconRoot(_ref4) {
33
33
  color = _ref4.color,
34
34
  className = _ref4.className,
35
35
  sizeCustomProperty = _ref4.sizeCustomProperty;
36
- var c = color || 'var(--plasma-colors-primary)';
36
+ var c = color || 'var(--text-primary)';
37
37
  var w = sizeCustomProperty ? "var(".concat(sizeCustomProperty, ")") : "".concat(sizeMap[size], "rem");
38
38
  return /*#__PURE__*/React.createElement(StyledRoot, {
39
39
  "aria-hidden": true,
@@ -4,11 +4,11 @@ import type { DropdownProps } from './Dropdown.types';
4
4
  /**
5
5
  * Выпадающий список.
6
6
  */
7
- export declare const dropdownRoot: (Root: RootProps<HTMLDivElement, Omit<DropdownProps, 'items'>>) => React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLDivElement>>;
7
+ export declare const dropdownRoot: (Root: RootProps<HTMLDivElement, DropdownProps>) => React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLDivElement>>;
8
8
  export declare const dropdownConfig: {
9
9
  name: string;
10
10
  tag: string;
11
- layout: (Root: RootProps<HTMLDivElement, Omit<DropdownProps, 'items'>>) => React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLDivElement>>;
11
+ layout: (Root: RootProps<HTMLDivElement, DropdownProps>) => React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLDivElement>>;
12
12
  base: import("@linaria/core").LinariaClassName;
13
13
  variations: {
14
14
  view: {
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAC;AAEtD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAU1C,OAAO,KAAK,EAAE,aAAa,EAA0B,MAAM,kBAAkB,CAAC;AAK9E;;GAEG;AACH,eAAO,MAAM,YAAY,SAAU,UAAU,cAAc,EAAE,KAAK,aAAa,EAAE,OAAO,CAAC,CAAC,yFA2HrF,CAAC;AAEN,eAAO,MAAM,cAAc;;;mBA7HQ,UAAU,cAAc,EAAE,KAAK,aAAa,EAAE,OAAO,CAAC,CAAC;;;;;;;;;;;;;;CA8IzF,CAAC"}
1
+ {"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAC;AAEtD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAU1C,OAAO,KAAK,EAAE,aAAa,EAA0B,MAAM,kBAAkB,CAAC;AAK9E;;GAEG;AACH,eAAO,MAAM,YAAY,SAAU,UAAU,cAAc,EAAE,aAAa,CAAC,yFAgItE,CAAC;AAEN,eAAO,MAAM,cAAc;;;mBAlIQ,UAAU,cAAc,EAAE,aAAa,CAAC;;;;;;;;;;;;;;CAmJ1E,CAAC"}
@@ -71,10 +71,6 @@ export interface DropdownProps extends HTMLAttributes<HTMLDivElement> {
71
71
  * @default normal
72
72
  */
73
73
  variant?: 'normal' | 'tight';
74
- /**
75
- * Портал для выпадающего списка. Принимает id контейнера или ref.
76
- */
77
- portal?: string | React.RefObject<HTMLElement>;
78
74
  /**
79
75
  * Обработчик клика по item.
80
76
  * @deprecated использовать onItemSelect.
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.types.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/Dropdown.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEtF,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAEzE,oBAAY,sBAAsB,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;AACzE,oBAAY,iBAAiB,GAAG,sBAAsB,GAAG,MAAM,CAAC;AAEhE,oBAAY,eAAe,GAAG,OAAO,GAAG,OAAO,CAAC;AAEhD,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,cAAc,CAAC;IACjE;;OAEG;IACH,KAAK,EAAE,KAAK,CAAC,kBAAkB,CAAC,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IACzE;;;OAGG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,iBAAiB,GAAG,KAAK,CAAC,sBAAsB,CAAC,CAAC;IAC9D;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,cAAc,GAAG,KAAK,KAAK,IAAI,CAAC;IACpE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC7B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAE/C;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IACxE;;;;;OAKG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IACzC;;;;;OAKG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC;IAC9C;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,oBAAY,sBAAsB,GAAG,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG,cAAc,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,IAAI,CAAC"}
1
+ {"version":3,"file":"Dropdown.types.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/Dropdown.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEtF,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAEzE,oBAAY,sBAAsB,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;AACzE,oBAAY,iBAAiB,GAAG,sBAAsB,GAAG,MAAM,CAAC;AAEhE,oBAAY,eAAe,GAAG,OAAO,GAAG,OAAO,CAAC;AAEhD,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,cAAc,CAAC;IACjE;;OAEG;IACH,KAAK,EAAE,KAAK,CAAC,kBAAkB,CAAC,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IACzE;;;OAGG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,iBAAiB,GAAG,KAAK,CAAC,sBAAsB,CAAC,CAAC;IAC9D;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,cAAc,GAAG,KAAK,KAAK,IAAI,CAAC;IACpE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IACxE;;;;;OAKG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IACzC;;;;;OAKG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC;IAC9C;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,oBAAY,sBAAsB,GAAG,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG,cAAc,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,IAAI,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/Popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAMpF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAIrD,OAAO,KAAK,EAAoB,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAItE,eAAO,MAAM,cAAc,KAAK,CAAC;AACjC,eAAO,MAAM,iBAAiB,wBAAwB,CAAC;AAEvD;;;GAGG;AACH,eAAO,MAAM,WAAW,SAAU,UAAU,cAAc,EAAE,YAAY,CAAC,+JAyPpE,CAAC;AAEN,eAAO,MAAM,aAAa;;;mBA3PQ,UAAU,cAAc,EAAE,YAAY,CAAC;;;;;;;;;;CAwQxE,CAAC"}
1
+ {"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/Popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAMpF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAIrD,OAAO,KAAK,EAAoB,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAItE,eAAO,MAAM,cAAc,KAAK,CAAC;AACjC,eAAO,MAAM,iBAAiB,wBAAwB,CAAC;AAEvD;;;GAGG;AACH,eAAO,MAAM,WAAW,SAAU,UAAU,cAAc,EAAE,YAAY,CAAC,+JAwPpE,CAAC;AAEN,eAAO,MAAM,aAAa;;;mBA1PQ,UAAU,cAAc,EAAE,YAAY,CAAC;;;;;;;;;;CAuQxE,CAAC"}
@@ -2,11 +2,11 @@ import React from 'react';
2
2
  import type { RootProps } from '../../engines/types';
3
3
  import type { TextAreaProps } from './TextArea.types';
4
4
  export declare const getDynamicLabelClasses: (props: TextAreaProps, focused: boolean) => (string | undefined)[];
5
- export declare const textAreaRoot: (Root: RootProps<HTMLTextAreaElement, TextAreaProps>) => React.ForwardRefExoticComponent<import("@salutejs/plasma-core").TextareaHTMLAttributes<HTMLTextAreaElement> & import("./TextArea.types").TextAreaPropsExtends & React.RefAttributes<HTMLTextAreaElement>>;
5
+ export declare const textAreaRoot: (Root: RootProps<HTMLTextAreaElement, TextAreaProps>) => React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
6
6
  export declare const textAreaConfig: {
7
7
  name: string;
8
8
  tag: string;
9
- layout: (Root: RootProps<HTMLTextAreaElement, TextAreaProps>) => React.ForwardRefExoticComponent<import("@salutejs/plasma-core").TextareaHTMLAttributes<HTMLTextAreaElement> & import("./TextArea.types").TextAreaPropsExtends & React.RefAttributes<HTMLTextAreaElement>>;
9
+ layout: (Root: RootProps<HTMLTextAreaElement, TextAreaProps>) => React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
10
10
  base: import("@linaria/core").LinariaClassName;
11
11
  variations: {
12
12
  size: {
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAK5E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAmBrD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AA6BtD,eAAO,MAAM,sBAAsB,UAAW,aAAa,WAAW,OAAO,2BA4B5E,CAAC;AAEF,eAAO,MAAM,YAAY,SAAU,UAAU,mBAAmB,EAAE,aAAa,CAAC,8MAkJ1E,CAAC;AAEP,eAAO,MAAM,cAAc;;;mBApJQ,UAAU,mBAAmB,EAAE,aAAa,CAAC;;;;;;;;;;;;;;;;;;;;;CA4K/E,CAAC"}
1
+ {"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAK5E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAmBrD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AA6BtD,eAAO,MAAM,sBAAsB,UAAW,aAAa,WAAW,OAAO,2BA4B5E,CAAC;AAEF,eAAO,MAAM,YAAY,SAAU,UAAU,mBAAmB,EAAE,aAAa,CAAC,8FAiJ1E,CAAC;AAEP,eAAO,MAAM,cAAc;;;mBAnJQ,UAAU,mBAAmB,EAAE,aAAa,CAAC;;;;;;;;;;;;;;;;;;;;;CA2K/E,CAAC"}
@@ -1,5 +1,52 @@
1
1
  /// <reference types="react" />
2
2
  import { TextareaHTMLAttributes } from '@salutejs/plasma-core';
3
+ declare type Only<T, U, R> = {
4
+ [P in keyof T]: T[P];
5
+ } & {
6
+ [P in keyof U]?: never;
7
+ } & {
8
+ [P in keyof R]?: never;
9
+ };
10
+ declare type OneOf<T, U, R> = Only<T, U, R> | Only<U, T, R> | Only<R, T, U>;
11
+ export declare type TextAreaPropsAutoResize = {
12
+ /**
13
+ * Автоматическая высота поля ввода.
14
+ */
15
+ autoResize?: boolean;
16
+ /**
17
+ * Максимальная высота поля ввода в автоматическом режиме (в абсолютных единицах).
18
+ * @example maxAuto="5", maxAuto={5}
19
+ */
20
+ maxAuto?: number;
21
+ /**
22
+ * Минимальная высота поля ввода в автоматическом режиме (в абсолютных единицах).
23
+ * @example minAuto="5", minAuto={5}
24
+ */
25
+ minAuto?: number;
26
+ };
27
+ export declare type TextAreaPropsHeightWidth = {
28
+ /**
29
+ * Высота текстового поля, значения в rem. Отвечает за ВСЮ высоту компонента.
30
+ * @example height="10", height={10}
31
+ */
32
+ height?: number | string;
33
+ /**
34
+ * Ширина текстового поля, значения в rem. Отвечает за ВСЮ ширину компонента.
35
+ * @example width="10", width={10}
36
+ */
37
+ width?: number | string;
38
+ };
39
+ export declare type TextAreaPropsRowsCols = {
40
+ /**
41
+ * Высота текстового поля (в абсолютных единицах) – фиксированное число отображаемых строк без прокрутки.
42
+ */
43
+ rows?: number;
44
+ /**
45
+ * Ширина текстового поля (в абсолютных единицах) – фиксированное число столбцов.
46
+ */
47
+ cols?: number;
48
+ };
49
+ export declare type TextAreaDimensionsProps = OneOf<TextAreaPropsAutoResize, TextAreaPropsHeightWidth, TextAreaPropsRowsCols>;
3
50
  export interface TextAreaPropsBase {
4
51
  /**
5
52
  * Статус компонента: заполнен успешно / с предупреждением / с ошибкой.
@@ -23,16 +70,6 @@ export interface TextAreaPropsBase {
23
70
  * @deprecated устаревшее свойство
24
71
  */
25
72
  resize?: 'none' | 'both' | 'horizontal' | 'vertical';
26
- /**
27
- * Высота текстового поля, значения в rem
28
- * @example height="10", height={10}
29
- */
30
- height?: number | string;
31
- /**
32
- * Ширина текстового поля, значения в rem
33
- * @example width="10", width={10}
34
- */
35
- width?: number | string;
36
73
  /**
37
74
  * Вспомогательный текст снизу слева для поля ввода.
38
75
  * @deprecated свойство устарело, необходимо использовать `leftHelper`.
@@ -46,18 +83,6 @@ export interface TextAreaPropsBase {
46
83
  * Вспомогательный текст снизу справа для поля ввода.
47
84
  */
48
85
  rightHelper?: string;
49
- /**
50
- * Автоматическая высота поля ввода.
51
- */
52
- autoResize?: boolean;
53
- /**
54
- * Максимальная высота поля ввода в автоматическом режиме(в rem).
55
- */
56
- maxAuto?: number;
57
- /**
58
- * Минимальная высота поля ввода в автоматическом режиме(в rem).
59
- */
60
- minAuto?: number;
61
86
  }
62
87
  export interface TextAreaPropsExtends extends TextAreaPropsBase {
63
88
  /**
@@ -69,5 +94,6 @@ export interface TextAreaPropsExtends extends TextAreaPropsBase {
69
94
  */
70
95
  view?: string;
71
96
  }
72
- export declare type TextAreaProps = TextareaHTMLAttributes<HTMLTextAreaElement> & TextAreaPropsExtends;
97
+ export declare type TextAreaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'rows' | 'cols'> & TextAreaPropsExtends & TextAreaDimensionsProps;
98
+ export {};
73
99
  //# sourceMappingURL=TextArea.types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.types.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.types.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,MAAM,WAAW,iBAAiB;IAC9B;;;OAGG;IACH,MAAM,CAAC,EAAE,EAAE,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAC9C;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IACnC;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAClC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,YAAY,GAAG,UAAU,CAAC;IACrD;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,oBAAqB,SAAQ,iBAAiB;IAC3D;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,oBAAY,aAAa,GAAG,sBAAsB,CAAC,mBAAmB,CAAC,GAAG,oBAAoB,CAAC"}
1
+ {"version":3,"file":"TextArea.types.d.ts","sourceRoot":"","sources":["../../../src/components/TextArea/TextArea.types.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,aAAK,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI;KAChB,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACvB,GACG;KACK,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK;CACzB,GACD;KACK,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK;CACzB,CAAC;AAEN,aAAK,KAAK,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;AAEpE,oBAAY,uBAAuB,GAAG;IAClC;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,oBAAY,wBAAwB,GAAG;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC3B,CAAC;AAEF,oBAAY,qBAAqB,GAAG;IAChC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,oBAAY,uBAAuB,GAAG,KAAK,CAAC,uBAAuB,EAAE,wBAAwB,EAAE,qBAAqB,CAAC,CAAC;AAEtH,MAAM,WAAW,iBAAiB;IAC9B;;;OAGG;IACH,MAAM,CAAC,EAAE,EAAE,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAC9C;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IACnC;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAClC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,YAAY,GAAG,UAAU,CAAC;IACrD;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,oBAAqB,SAAQ,iBAAiB;IAC3D;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,oBAAY,aAAa,GAAG,IAAI,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,GAC1F,oBAAoB,GACpB,uBAAuB,CAAC"}
@@ -1,4 +1,4 @@
1
1
  import { MutableRefObject } from 'react';
2
2
  export declare const ROOT_FONT_SIZE = 16;
3
- export declare const useAutoResize: <T extends HTMLTextAreaElement>(active: boolean, ref: MutableRefObject<T | null>, value?: string | number | readonly string[] | undefined, minHeight?: number | undefined, maxHeight?: number | undefined) => void;
3
+ export declare const useAutoResize: <T extends HTMLTextAreaElement>(active: boolean, ref: MutableRefObject<T | null>, value?: string | number | readonly string[] | undefined, minAuto?: number | undefined, maxAuto?: number | undefined) => void;
4
4
  //# sourceMappingURL=useAutoResize.d.ts.map