@commercetools-uikit/multiline-text-input 15.14.3 → 15.15.1
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.
- package/dist/commercetools-uikit-multiline-text-input.cjs.d.ts +1 -0
- package/dist/commercetools-uikit-multiline-text-input.cjs.d.ts.map +1 -0
- package/dist/commercetools-uikit-multiline-text-input.cjs.dev.js +18 -22
- package/dist/commercetools-uikit-multiline-text-input.cjs.prod.js +18 -22
- package/dist/commercetools-uikit-multiline-text-input.esm.js +18 -22
- package/package.json +11 -11
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"commercetools-uikit-multiline-text-input.cjs.d.ts","sourceRoot":"","sources":["./declarations/src/index.d.ts"],"names":[],"mappings":"AAAA"}
|
|
@@ -47,7 +47,7 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["def
|
|
|
47
47
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
|
|
48
48
|
|
|
49
49
|
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
|
50
|
-
|
|
50
|
+
const defaultProps = {
|
|
51
51
|
defaultExpandMultilineText: false
|
|
52
52
|
};
|
|
53
53
|
|
|
@@ -61,30 +61,30 @@ var _ref = process.env.NODE_ENV === "production" ? {
|
|
|
61
61
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
62
62
|
};
|
|
63
63
|
|
|
64
|
-
|
|
65
|
-
|
|
64
|
+
const MultilineTextInput = props => {
|
|
65
|
+
const intl = reactIntl.useIntl();
|
|
66
66
|
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
67
|
+
const _useState = react.useState(MultilineTextInput.MIN_ROW_COUNT),
|
|
68
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
69
|
+
contentRowCount = _useState2[0],
|
|
70
|
+
setContentRowCount = _useState2[1];
|
|
71
71
|
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
72
|
+
const _useToggleState = hooks.useToggleState(props.defaultExpandMultilineText),
|
|
73
|
+
_useToggleState2 = _slicedToArray(_useToggleState, 2),
|
|
74
|
+
isOpen = _useToggleState2[0],
|
|
75
|
+
toggle = _useToggleState2[1];
|
|
76
76
|
|
|
77
|
-
|
|
78
|
-
|
|
77
|
+
const onFocus = props.onFocus;
|
|
78
|
+
const handleFocus = react.useCallback(event => {
|
|
79
79
|
if (!isOpen) toggle(true);
|
|
80
80
|
if (onFocus) onFocus(event);
|
|
81
81
|
}, [isOpen, onFocus, toggle]);
|
|
82
|
-
|
|
82
|
+
const handleHeightChange = react.useCallback((_, rowCount) => {
|
|
83
83
|
setContentRowCount(rowCount);
|
|
84
84
|
}, [setContentRowCount]); // This checks if the content in the textarea overflows the minimum
|
|
85
85
|
// amount of lines it should have when collapsed
|
|
86
86
|
|
|
87
|
-
|
|
87
|
+
const shouldRenderToggleButton = contentRowCount > MultilineTextInput.MIN_ROW_COUNT;
|
|
88
88
|
return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
|
|
89
89
|
max: props.horizontalConstraint,
|
|
90
90
|
children: jsxRuntime.jsxs(Stack__default["default"], {
|
|
@@ -112,9 +112,7 @@ var MultilineTextInput = function MultilineTextInput(props) {
|
|
|
112
112
|
})), shouldRenderToggleButton && jsxRuntime.jsx("div", {
|
|
113
113
|
css: _ref,
|
|
114
114
|
children: jsxRuntime.jsx(FlatButton__default["default"], {
|
|
115
|
-
onClick:
|
|
116
|
-
return toggle();
|
|
117
|
-
},
|
|
115
|
+
onClick: () => toggle(),
|
|
118
116
|
isDisabled: props.isDisabled,
|
|
119
117
|
label: intl.formatMessage(isOpen ? inputUtils.messagesMultilineInput.collapse : inputUtils.messagesMultilineInput.expand),
|
|
120
118
|
icon: isOpen ? jsxRuntime.jsx(icons.AngleUpIcon, {
|
|
@@ -153,15 +151,13 @@ MultilineTextInput.displayName = 'MultilineTextInput'; // The minimum ammount of
|
|
|
153
151
|
|
|
154
152
|
MultilineTextInput.MIN_ROW_COUNT = 1;
|
|
155
153
|
|
|
156
|
-
MultilineTextInput.isEmpty =
|
|
157
|
-
return !value || _trimInstanceProperty__default["default"](value).call(value).length === 0;
|
|
158
|
-
};
|
|
154
|
+
MultilineTextInput.isEmpty = value => !value || _trimInstanceProperty__default["default"](value).call(value).length === 0;
|
|
159
155
|
|
|
160
156
|
MultilineTextInput.defaultProps = defaultProps;
|
|
161
157
|
var MultilineTextInput$1 = MultilineTextInput;
|
|
162
158
|
|
|
163
159
|
// NOTE: This string will be replaced on build time with the package version.
|
|
164
|
-
var version = "15.
|
|
160
|
+
var version = "15.15.1";
|
|
165
161
|
|
|
166
162
|
exports["default"] = MultilineTextInput$1;
|
|
167
163
|
exports.version = version;
|
|
@@ -44,7 +44,7 @@ var Constraints__default = /*#__PURE__*/_interopDefault(Constraints);
|
|
|
44
44
|
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
45
45
|
|
|
46
46
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
|
|
47
|
-
|
|
47
|
+
const defaultProps = {
|
|
48
48
|
defaultExpandMultilineText: false
|
|
49
49
|
};
|
|
50
50
|
|
|
@@ -53,30 +53,30 @@ var _ref = {
|
|
|
53
53
|
styles: "display:flex;justify-content:flex-end"
|
|
54
54
|
} ;
|
|
55
55
|
|
|
56
|
-
|
|
57
|
-
|
|
56
|
+
const MultilineTextInput = props => {
|
|
57
|
+
const intl = reactIntl.useIntl();
|
|
58
58
|
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
59
|
+
const _useState = react.useState(MultilineTextInput.MIN_ROW_COUNT),
|
|
60
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
61
|
+
contentRowCount = _useState2[0],
|
|
62
|
+
setContentRowCount = _useState2[1];
|
|
63
63
|
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
64
|
+
const _useToggleState = hooks.useToggleState(props.defaultExpandMultilineText),
|
|
65
|
+
_useToggleState2 = _slicedToArray(_useToggleState, 2),
|
|
66
|
+
isOpen = _useToggleState2[0],
|
|
67
|
+
toggle = _useToggleState2[1];
|
|
68
68
|
|
|
69
|
-
|
|
70
|
-
|
|
69
|
+
const onFocus = props.onFocus;
|
|
70
|
+
const handleFocus = react.useCallback(event => {
|
|
71
71
|
if (!isOpen) toggle(true);
|
|
72
72
|
if (onFocus) onFocus(event);
|
|
73
73
|
}, [isOpen, onFocus, toggle]);
|
|
74
|
-
|
|
74
|
+
const handleHeightChange = react.useCallback((_, rowCount) => {
|
|
75
75
|
setContentRowCount(rowCount);
|
|
76
76
|
}, [setContentRowCount]); // This checks if the content in the textarea overflows the minimum
|
|
77
77
|
// amount of lines it should have when collapsed
|
|
78
78
|
|
|
79
|
-
|
|
79
|
+
const shouldRenderToggleButton = contentRowCount > MultilineTextInput.MIN_ROW_COUNT;
|
|
80
80
|
return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
|
|
81
81
|
max: props.horizontalConstraint,
|
|
82
82
|
children: jsxRuntime.jsxs(Stack__default["default"], {
|
|
@@ -104,9 +104,7 @@ var MultilineTextInput = function MultilineTextInput(props) {
|
|
|
104
104
|
})), shouldRenderToggleButton && jsxRuntime.jsx("div", {
|
|
105
105
|
css: _ref,
|
|
106
106
|
children: jsxRuntime.jsx(FlatButton__default["default"], {
|
|
107
|
-
onClick:
|
|
108
|
-
return toggle();
|
|
109
|
-
},
|
|
107
|
+
onClick: () => toggle(),
|
|
110
108
|
isDisabled: props.isDisabled,
|
|
111
109
|
label: intl.formatMessage(isOpen ? inputUtils.messagesMultilineInput.collapse : inputUtils.messagesMultilineInput.expand),
|
|
112
110
|
icon: isOpen ? jsxRuntime.jsx(icons.AngleUpIcon, {
|
|
@@ -127,15 +125,13 @@ MultilineTextInput.displayName = 'MultilineTextInput'; // The minimum ammount of
|
|
|
127
125
|
|
|
128
126
|
MultilineTextInput.MIN_ROW_COUNT = 1;
|
|
129
127
|
|
|
130
|
-
MultilineTextInput.isEmpty =
|
|
131
|
-
return !value || _trimInstanceProperty__default["default"](value).call(value).length === 0;
|
|
132
|
-
};
|
|
128
|
+
MultilineTextInput.isEmpty = value => !value || _trimInstanceProperty__default["default"](value).call(value).length === 0;
|
|
133
129
|
|
|
134
130
|
MultilineTextInput.defaultProps = defaultProps;
|
|
135
131
|
var MultilineTextInput$1 = MultilineTextInput;
|
|
136
132
|
|
|
137
133
|
// NOTE: This string will be replaced on build time with the package version.
|
|
138
|
-
var version = "15.
|
|
134
|
+
var version = "15.15.1";
|
|
139
135
|
|
|
140
136
|
exports["default"] = MultilineTextInput$1;
|
|
141
137
|
exports.version = version;
|
|
@@ -27,7 +27,7 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (
|
|
|
27
27
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
28
28
|
|
|
29
29
|
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
|
30
|
-
|
|
30
|
+
const defaultProps = {
|
|
31
31
|
defaultExpandMultilineText: false
|
|
32
32
|
};
|
|
33
33
|
|
|
@@ -41,30 +41,30 @@ var _ref = process.env.NODE_ENV === "production" ? {
|
|
|
41
41
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
42
42
|
};
|
|
43
43
|
|
|
44
|
-
|
|
45
|
-
|
|
44
|
+
const MultilineTextInput = props => {
|
|
45
|
+
const intl = useIntl();
|
|
46
46
|
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
47
|
+
const _useState = useState(MultilineTextInput.MIN_ROW_COUNT),
|
|
48
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
49
|
+
contentRowCount = _useState2[0],
|
|
50
|
+
setContentRowCount = _useState2[1];
|
|
51
51
|
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
52
|
+
const _useToggleState = useToggleState(props.defaultExpandMultilineText),
|
|
53
|
+
_useToggleState2 = _slicedToArray(_useToggleState, 2),
|
|
54
|
+
isOpen = _useToggleState2[0],
|
|
55
|
+
toggle = _useToggleState2[1];
|
|
56
56
|
|
|
57
|
-
|
|
58
|
-
|
|
57
|
+
const onFocus = props.onFocus;
|
|
58
|
+
const handleFocus = useCallback(event => {
|
|
59
59
|
if (!isOpen) toggle(true);
|
|
60
60
|
if (onFocus) onFocus(event);
|
|
61
61
|
}, [isOpen, onFocus, toggle]);
|
|
62
|
-
|
|
62
|
+
const handleHeightChange = useCallback((_, rowCount) => {
|
|
63
63
|
setContentRowCount(rowCount);
|
|
64
64
|
}, [setContentRowCount]); // This checks if the content in the textarea overflows the minimum
|
|
65
65
|
// amount of lines it should have when collapsed
|
|
66
66
|
|
|
67
|
-
|
|
67
|
+
const shouldRenderToggleButton = contentRowCount > MultilineTextInput.MIN_ROW_COUNT;
|
|
68
68
|
return jsx(Constraints.Horizontal, {
|
|
69
69
|
max: props.horizontalConstraint,
|
|
70
70
|
children: jsxs(Stack, {
|
|
@@ -92,9 +92,7 @@ var MultilineTextInput = function MultilineTextInput(props) {
|
|
|
92
92
|
})), shouldRenderToggleButton && jsx("div", {
|
|
93
93
|
css: _ref,
|
|
94
94
|
children: jsx(FlatButton, {
|
|
95
|
-
onClick:
|
|
96
|
-
return toggle();
|
|
97
|
-
},
|
|
95
|
+
onClick: () => toggle(),
|
|
98
96
|
isDisabled: props.isDisabled,
|
|
99
97
|
label: intl.formatMessage(isOpen ? messagesMultilineInput.collapse : messagesMultilineInput.expand),
|
|
100
98
|
icon: isOpen ? jsx(AngleUpIcon, {
|
|
@@ -133,14 +131,12 @@ MultilineTextInput.displayName = 'MultilineTextInput'; // The minimum ammount of
|
|
|
133
131
|
|
|
134
132
|
MultilineTextInput.MIN_ROW_COUNT = 1;
|
|
135
133
|
|
|
136
|
-
MultilineTextInput.isEmpty =
|
|
137
|
-
return !value || _trimInstanceProperty(value).call(value).length === 0;
|
|
138
|
-
};
|
|
134
|
+
MultilineTextInput.isEmpty = value => !value || _trimInstanceProperty(value).call(value).length === 0;
|
|
139
135
|
|
|
140
136
|
MultilineTextInput.defaultProps = defaultProps;
|
|
141
137
|
var MultilineTextInput$1 = MultilineTextInput;
|
|
142
138
|
|
|
143
139
|
// NOTE: This string will be replaced on build time with the package version.
|
|
144
|
-
var version = "15.
|
|
140
|
+
var version = "15.15.1";
|
|
145
141
|
|
|
146
142
|
export { MultilineTextInput$1 as default, version };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@commercetools-uikit/multiline-text-input",
|
|
3
3
|
"description": "A controlled text input component for multi-line strings with validation states.",
|
|
4
|
-
"version": "15.
|
|
4
|
+
"version": "15.15.1",
|
|
5
5
|
"bugs": "https://github.com/commercetools/ui-kit/issues",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -21,16 +21,16 @@
|
|
|
21
21
|
"dependencies": {
|
|
22
22
|
"@babel/runtime": "^7.20.13",
|
|
23
23
|
"@babel/runtime-corejs3": "^7.20.13",
|
|
24
|
-
"@commercetools-uikit/constraints": "15.
|
|
25
|
-
"@commercetools-uikit/design-system": "15.
|
|
26
|
-
"@commercetools-uikit/flat-button": "15.
|
|
27
|
-
"@commercetools-uikit/hooks": "15.
|
|
28
|
-
"@commercetools-uikit/icons": "15.
|
|
29
|
-
"@commercetools-uikit/input-utils": "15.
|
|
30
|
-
"@commercetools-uikit/spacings-inline": "15.
|
|
31
|
-
"@commercetools-uikit/spacings-stack": "15.
|
|
32
|
-
"@commercetools-uikit/tooltip": "15.
|
|
33
|
-
"@commercetools-uikit/utils": "15.
|
|
24
|
+
"@commercetools-uikit/constraints": "15.15.1",
|
|
25
|
+
"@commercetools-uikit/design-system": "15.15.1",
|
|
26
|
+
"@commercetools-uikit/flat-button": "15.15.1",
|
|
27
|
+
"@commercetools-uikit/hooks": "15.15.1",
|
|
28
|
+
"@commercetools-uikit/icons": "15.15.1",
|
|
29
|
+
"@commercetools-uikit/input-utils": "15.15.1",
|
|
30
|
+
"@commercetools-uikit/spacings-inline": "15.15.1",
|
|
31
|
+
"@commercetools-uikit/spacings-stack": "15.15.1",
|
|
32
|
+
"@commercetools-uikit/tooltip": "15.15.1",
|
|
33
|
+
"@commercetools-uikit/utils": "15.15.1",
|
|
34
34
|
"@emotion/react": "^11.10.5",
|
|
35
35
|
"@emotion/styled": "^11.10.5",
|
|
36
36
|
"downshift": "6.1.12",
|