@commercetools-uikit/input-utils 12.2.2 → 12.2.6
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-input-utils.cjs.dev.js +41 -38
- package/dist/commercetools-uikit-input-utils.cjs.prod.js +17 -15
- package/dist/commercetools-uikit-input-utils.esm.js +18 -14
- package/dist/declarations/src/accessible-hidden-input.styles.d.ts +2 -2
- package/dist/declarations/src/index.d.ts +7 -7
- package/dist/declarations/src/localized-input-toggle/index.d.ts +3 -3
- package/dist/declarations/src/localized-input-toggle/localized-input-toggle.d.ts +17 -17
- package/dist/declarations/src/messages/localized-input/index.d.ts +1 -1
- package/dist/declarations/src/messages/localized-input/messages.d.ts +18 -18
- package/dist/declarations/src/messages/multiline-input/index.d.ts +1 -1
- package/dist/declarations/src/messages/multiline-input/messages.d.ts +13 -13
- package/dist/declarations/src/multiline-input/index.d.ts +3 -3
- package/dist/declarations/src/multiline-input/multiline-input.d.ts +24 -24
- package/dist/declarations/src/multiline-input/multiline-input.styles.d.ts +4 -4
- package/dist/declarations/src/styles.d.ts +11 -11
- package/dist/declarations/src/version.d.ts +2 -2
- package/package.json +8 -12
|
@@ -14,11 +14,11 @@ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/obje
|
|
|
14
14
|
var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
|
|
15
15
|
var designSystem = require('@commercetools-uikit/design-system');
|
|
16
16
|
var _pt = require('prop-types');
|
|
17
|
-
var
|
|
17
|
+
var react$1 = require('react');
|
|
18
18
|
var reactIntl = require('react-intl');
|
|
19
19
|
var FlatButton = require('@commercetools-uikit/flat-button');
|
|
20
20
|
var icons = require('@commercetools-uikit/icons');
|
|
21
|
-
var
|
|
21
|
+
var jsxRuntime = require('@emotion/react/jsx-runtime');
|
|
22
22
|
var TextareaAutosize = require('react-textarea-autosize');
|
|
23
23
|
var utils = require('@commercetools-uikit/utils');
|
|
24
24
|
|
|
@@ -33,7 +33,6 @@ var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_O
|
|
|
33
33
|
var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
|
|
34
34
|
var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
|
|
35
35
|
var _pt__default = /*#__PURE__*/_interopDefault(_pt);
|
|
36
|
-
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
37
36
|
var FlatButton__default = /*#__PURE__*/_interopDefault(FlatButton);
|
|
38
37
|
var TextareaAutosize__default = /*#__PURE__*/_interopDefault(TextareaAutosize);
|
|
39
38
|
|
|
@@ -66,8 +65,8 @@ var LocalizedInputToggle = function LocalizedInputToggle(props) {
|
|
|
66
65
|
var label = typeof labelMessage === 'string' ? labelMessage : intl.formatMessage(labelMessage, {
|
|
67
66
|
remainingLanguages: props.remainingLocalizations
|
|
68
67
|
});
|
|
69
|
-
return
|
|
70
|
-
icon: props.icon ? props.icon :
|
|
68
|
+
return jsxRuntime.jsx(FlatButton__default["default"], {
|
|
69
|
+
icon: props.icon ? props.icon : jsxRuntime.jsx(icons.WorldIcon, {}),
|
|
71
70
|
label: label,
|
|
72
71
|
onClick: props.onClick,
|
|
73
72
|
isDisabled: props.isDisabled
|
|
@@ -75,21 +74,21 @@ var LocalizedInputToggle = function LocalizedInputToggle(props) {
|
|
|
75
74
|
};
|
|
76
75
|
|
|
77
76
|
LocalizedInputToggle.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
78
|
-
icon: _pt__default[
|
|
79
|
-
isOpen: _pt__default[
|
|
80
|
-
onClick: _pt__default[
|
|
81
|
-
isDisabled: _pt__default[
|
|
82
|
-
showMessage: _pt__default[
|
|
83
|
-
hideMessage: _pt__default[
|
|
84
|
-
remainingLocalizations: _pt__default[
|
|
77
|
+
icon: _pt__default["default"].element,
|
|
78
|
+
isOpen: _pt__default["default"].bool,
|
|
79
|
+
onClick: _pt__default["default"].func.isRequired,
|
|
80
|
+
isDisabled: _pt__default["default"].bool,
|
|
81
|
+
showMessage: _pt__default["default"].oneOfType([_pt__default["default"].string, _pt__default["default"].any]).isRequired,
|
|
82
|
+
hideMessage: _pt__default["default"].oneOfType([_pt__default["default"].string, _pt__default["default"].any]).isRequired,
|
|
83
|
+
remainingLocalizations: _pt__default["default"].number
|
|
85
84
|
} : {};
|
|
86
85
|
LocalizedInputToggle.defaultProps = defaultProps;
|
|
87
86
|
LocalizedInputToggle.displayName = 'LocalizedInputToggle';
|
|
88
87
|
var LocalizedInputToggle$1 = LocalizedInputToggle;
|
|
89
88
|
|
|
90
|
-
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default[
|
|
89
|
+
function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (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; }
|
|
91
90
|
|
|
92
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default[
|
|
91
|
+
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
|
|
93
92
|
|
|
94
93
|
var getInputBorderColor = function getInputBorderColor(vars, props) {
|
|
95
94
|
if (props.isDisabled || props.disabled) {
|
|
@@ -132,9 +131,9 @@ var getInputFontColor = function getInputFontColor(vars, props) {
|
|
|
132
131
|
};
|
|
133
132
|
|
|
134
133
|
var getInputStyles = function getInputStyles(props, theme) {
|
|
135
|
-
var vars = _objectSpread(_objectSpread({}, designSystem.customProperties), theme);
|
|
134
|
+
var vars = _objectSpread$1(_objectSpread$1({}, designSystem.customProperties), theme);
|
|
136
135
|
|
|
137
|
-
return /*#__PURE__*/react.css("appearance:none;background-color:", props.isDisabled || props.disabled ? vars[designSystem.designTokens.backgroundColorForInputWhenDisabled] : vars[designSystem.designTokens.backgroundColorForInput], ";border:1px solid ", getInputBorderColor(vars, props), ";border-radius:", vars[designSystem.designTokens.borderRadiusForInput], ";box-sizing:border-box;color:", getInputFontColor(vars, props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", vars[designSystem.designTokens.fontSizeForInput], ";height:", vars.sizeHeightInput, ";min-height:", vars.sizeHeightInput, ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:0 ", vars.spacingS, ";transition:border-color ", vars.transitionStandard, ",background-color ", vars.transitionStandard, ",color ", vars.transitionStandard, ",box-shadow ", vars.transitionStandard, ";width:100%;&::placeholder{color:", vars[designSystem.designTokens.placeholderFontColorForInput], ";}:active,:focus,:hover:not(:disabled):not(:read-only){border-color:", vars[designSystem.designTokens.borderColorForInputWhenFocused], ";}:focus{box-shadow:inset 0 0 0 2px ", vars[designSystem.designTokens.borderColorForInputWhenFocused], ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getInputStyles;"));
|
|
136
|
+
return /*#__PURE__*/react.css("appearance:none;background-color:", props.isDisabled || props.disabled ? vars[designSystem.designTokens.backgroundColorForInputWhenDisabled] : vars[designSystem.designTokens.backgroundColorForInput], ";border:1px solid ", getInputBorderColor(vars, props), ";border-radius:", vars[designSystem.designTokens.borderRadiusForInput], ";box-sizing:border-box;color:", getInputFontColor(vars, props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", vars[designSystem.designTokens.fontSizeForInput], ";height:", vars.sizeHeightInput, ";min-height:", vars.sizeHeightInput, ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:0 ", vars.spacingS, ";transition:border-color ", vars.transitionStandard, ",background-color ", vars.transitionStandard, ",color ", vars.transitionStandard, ",box-shadow ", vars.transitionStandard, ";width:100%;&::placeholder{color:", vars[designSystem.designTokens.placeholderFontColorForInput], ";}:active,:focus,:hover:not(:disabled):not(:read-only){border-color:", vars[designSystem.designTokens.borderColorForInputWhenFocused], ";}:focus{box-shadow:inset 0 0 0 2px ", vars[designSystem.designTokens.borderColorForInputWhenFocused], ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getInputStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwRFkiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUgeyBUaGVtZSB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7XG4gIGN1c3RvbVByb3BlcnRpZXMsXG4gIGRlc2lnblRva2Vucyxcbn0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5cbnR5cGUgVEV4dGVuZGVkVGhlbWUgPSB7XG4gIFtrZXk6IHN0cmluZ106IHN0cmluZztcbn0gJiBUaGVtZTtcblxudHlwZSBUSW5wdXRQcm9wcyA9IHtcbiAgaXNEaXNhYmxlZD86IGJvb2xlYW47XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgaGFzRXJyb3I/OiBib29sZWFuO1xuICBoYXNXYXJuaW5nPzogYm9vbGVhbjtcbiAgaXNSZWFkT25seT86IGJvb2xlYW47XG4gIHJlYWRPbmx5PzogYm9vbGVhbjtcbn07XG5cbmNvbnN0IGdldElucHV0Qm9yZGVyQ29sb3IgPSAodmFyczogVEV4dGVuZGVkVGhlbWUsIHByb3BzOiBUSW5wdXRQcm9wcykgPT4ge1xuICBpZiAocHJvcHMuaXNEaXNhYmxlZCB8fCBwcm9wcy5kaXNhYmxlZCkge1xuICAgIHJldHVybiB2YXJzW2Rlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlbkRpc2FibGVkXTtcbiAgfVxuICBpZiAocHJvcHMuaGFzRXJyb3IpIHtcbiAgICByZXR1cm4gdmFyc1tkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFdoZW5FcnJvcl07XG4gIH1cbiAgaWYgKHByb3BzLmhhc1dhcm5pbmcpIHtcbiAgICByZXR1cm4gdmFyc1tkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFdoZW5XYXJuaW5nXTtcbiAgfVxuICBpZiAocHJvcHMuaXNSZWFkT25seSB8fCBwcm9wcy5yZWFkT25seSkge1xuICAgIHJldHVybiB2YXJzW2Rlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlblJlYWRvbmx5XTtcbiAgfVxuICByZXR1cm4gdmFyc1tkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dF07XG59O1xuXG5jb25zdCBnZXRJbnB1dEZvbnRDb2xvciA9ICh2YXJzOiBURXh0ZW5kZWRUaGVtZSwgcHJvcHM6IFRJbnB1dFByb3BzKSA9PiB7XG4gIGlmIChwcm9wcy5pc0Rpc2FibGVkIHx8IHByb3BzLmRpc2FibGVkKSB7XG4gICAgcmV0dXJuIHZhcnNbZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlbkRpc2FibGVkXTtcbiAgfVxuICBpZiAocHJvcHMuaGFzRXJyb3IpIHtcbiAgICByZXR1cm4gdmFyc1tkZXNpZ25Ub2tlbnMuZm9udENvbG9yRm9ySW5wdXRXaGVuRXJyb3JdO1xuICB9XG4gIGlmIChwcm9wcy5oYXNXYXJuaW5nKSB7XG4gICAgcmV0dXJuIHZhcnNbZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlbldhcm5pbmddO1xuICB9XG4gIGlmIChwcm9wcy5pc1JlYWRPbmx5IHx8IHByb3BzLnJlYWRPbmx5KSB7XG4gICAgcmV0dXJuIHZhcnNbZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlblJlYWRvbmx5XTtcbiAgfVxuICByZXR1cm4gdmFyc1tkZXNpZ25Ub2tlbnMuZm9udENvbG9yRm9ySW5wdXRdO1xufTtcblxuY29uc3QgZ2V0SW5wdXRTdHlsZXMgPSAocHJvcHM6IFRJbnB1dFByb3BzLCB0aGVtZT86IFRoZW1lKSA9PiB7XG4gIGNvbnN0IHZhcnM6IFRFeHRlbmRlZFRoZW1lID0ge1xuICAgIC4uLmN1c3RvbVByb3BlcnRpZXMsXG4gICAgLi4udGhlbWUsXG4gIH07XG5cbiAgcmV0dXJuIGNzc2BcbiAgICBhcHBlYXJhbmNlOiBub25lO1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7cHJvcHMuaXNEaXNhYmxlZCB8fCBwcm9wcy5kaXNhYmxlZFxuICAgICAgPyB2YXJzW2Rlc2lnblRva2Vucy5iYWNrZ3JvdW5kQ29sb3JGb3JJbnB1dFdoZW5EaXNhYmxlZF1cbiAgICAgIDogdmFyc1tkZXNpZ25Ub2tlbnMuYmFja2dyb3VuZENvbG9yRm9ySW5wdXRdfTtcbiAgICBib3JkZXI6IDFweCBzb2xpZCAke2dldElucHV0Qm9yZGVyQ29sb3IodmFycywgcHJvcHMpfTtcbiAgICBib3JkZXItcmFkaXVzOiAke3ZhcnNbZGVzaWduVG9rZW5zLmJvcmRlclJhZGl1c0ZvcklucHV0XX07XG4gICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICBjb2xvcjogJHtnZXRJbnB1dEZvbnRDb2xvcih2YXJzLCBwcm9wcyl9O1xuICAgIGN1cnNvcjogJHtwcm9wcy5pc0Rpc2FibGVkID8gJ25vdC1hbGxvd2VkJyA6ICdkZWZhdWx0J307XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBmbGV4OiAxO1xuICAgIGZvbnQtZmFtaWx5OiBpbmhlcml0O1xuICAgIGZvbnQtc2l6ZTogJHt2YXJzW2Rlc2lnblRva2Vucy5mb250U2l6ZUZvcklucHV0XX07XG4gICAgaGVpZ2h0OiAke3ZhcnMuc2l6ZUhlaWdodElucHV0fTtcbiAgICBtaW4taGVpZ2h0OiAke3ZhcnMuc2l6ZUhlaWdodElucHV0fTtcbiAgICBvcGFjaXR5OiAke3Byb3BzLmlzRGlzYWJsZWQgfHwgcHJvcHMuZGlzYWJsZWRcbiAgICAgID8gJzEnXG4gICAgICA6ICd1bnNldCd9OyAvKiBmaXggZm9yIG1vYmlsZSBzYWZhcmkgKi9cbiAgICBvdXRsaW5lOiBub25lO1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgcGFkZGluZzogMCAke3ZhcnMuc3BhY2luZ1N9O1xuICAgIHRyYW5zaXRpb246IGJvcmRlci1jb2xvciAke3ZhcnMudHJhbnNpdGlvblN0YW5kYXJkfSxcbiAgICAgIGJhY2tncm91bmQtY29sb3IgJHt2YXJzLnRyYW5zaXRpb25TdGFuZGFyZH0sXG4gICAgICBjb2xvciAke3ZhcnMudHJhbnNpdGlvblN0YW5kYXJkfSwgYm94LXNoYWRvdyAke3ZhcnMudHJhbnNpdGlvblN0YW5kYXJkfTtcbiAgICB3aWR0aDogMTAwJTtcblxuICAgICY6OnBsYWNlaG9sZGVyIHtcbiAgICAgIGNvbG9yOiAke3ZhcnNbZGVzaWduVG9rZW5zLnBsYWNlaG9sZGVyRm9udENvbG9yRm9ySW5wdXRdfTtcbiAgICB9XG4gICAgOmFjdGl2ZSxcbiAgICA6Zm9jdXMsXG4gICAgOmhvdmVyOm5vdCg6ZGlzYWJsZWQpOm5vdCg6cmVhZC1vbmx5KSB7XG4gICAgICBib3JkZXItY29sb3I6ICR7dmFyc1tkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFdoZW5Gb2N1c2VkXX07XG4gICAgfVxuICAgIDpmb2N1cyB7XG4gICAgICBib3gtc2hhZG93OiBpbnNldCAwIDAgMCAycHhcbiAgICAgICAgJHt2YXJzW2Rlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlbkZvY3VzZWRdfTtcbiAgICB9XG4gIGA7XG59O1xuXG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgaW1wb3J0L3ByZWZlci1kZWZhdWx0LWV4cG9ydFxuZXhwb3J0IHsgZ2V0SW5wdXRTdHlsZXMgfTtcbiJdfQ== */");
|
|
138
137
|
}; // eslint-disable-next-line import/prefer-default-export
|
|
139
138
|
|
|
140
139
|
/* we need this line-height to achieve 32px height when the component has only one row */
|
|
@@ -144,17 +143,20 @@ var sizeInputLineHeight = '22px'; // NOTE: order is important here
|
|
|
144
143
|
// how you can interact with the field is controlled separately by the props, this only influences visuals
|
|
145
144
|
|
|
146
145
|
var getTextareaStyles = function getTextareaStyles(props, theme) {
|
|
147
|
-
var baseStyles = [getInputStyles(props, theme), /*#__PURE__*/react.css("padding:", designSystem.customProperties.spacingXs, " ", designSystem.customProperties.spacingS, ";line-height:", sizeInputLineHeight, ";flex:auto;word-break:break-all;white-space:pre-wrap;resize:vertical;" + (process.env.NODE_ENV === "production" ? "" : ";label:baseStyles;"))];
|
|
146
|
+
var baseStyles = [getInputStyles(props, theme), /*#__PURE__*/react.css("padding:", designSystem.customProperties.spacingXs, " ", designSystem.customProperties.spacingS, ";line-height:", sizeInputLineHeight, ";flex:auto;word-break:break-all;white-space:pre-wrap;resize:vertical;" + (process.env.NODE_ENV === "production" ? "" : ";label:baseStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm11bHRpbGluZS1pbnB1dC5zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0JPIiwiZmlsZSI6Im11bHRpbGluZS1pbnB1dC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IFRoZW1lIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyBhcyB2YXJzIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQgeyBnZXRJbnB1dFN0eWxlcyB9IGZyb20gJy4uL3N0eWxlcyc7XG5pbXBvcnQgdHlwZSB7IFRNdWx0aUxpbmVJbnB1dFByb3BzIH0gZnJvbSAnLi9tdWx0aWxpbmUtaW5wdXQnO1xuXG4vKiB3ZSBuZWVkIHRoaXMgbGluZS1oZWlnaHQgdG8gYWNoaWV2ZSAzMnB4IGhlaWdodCB3aGVuIHRoZSBjb21wb25lbnQgaGFzIG9ubHkgb25lIHJvdyAqL1xuY29uc3Qgc2l6ZUlucHV0TGluZUhlaWdodCA9ICcyMnB4JztcblxuLy8gTk9URTogb3JkZXIgaXMgaW1wb3J0YW50IGhlcmVcbi8vICogYSBkaXNhYmxlZC1maWVsZCBjdXJyZW50bHkgZG9lcyBub3QgZGlzcGxheSB3YXJuaW5nL2Vycm9yLXN0YXRlcyBzbyBpdCB0YWtlcyBwcmVjZWRlbmNlXG4vLyAqIGEgcmVhZG9ubHktZmllbGQgY2Fubm90IGJlIGNoYW5nZWQsIGJ1dCBpdCBtaWdodCBiZSByZWxldmFudCBmb3IgdmFsaWRhdGlvbiwgc28gZXJyb3IgYW5kIHdhcm5pbmcgYXJlIGNoZWNrZWQgZmlyc3Rcbi8vIGhvdyB5b3UgY2FuIGludGVyYWN0IHdpdGggdGhlIGZpZWxkIGlzIGNvbnRyb2xsZWQgc2VwYXJhdGVseSBieSB0aGUgcHJvcHMsIHRoaXMgb25seSBpbmZsdWVuY2VzIHZpc3VhbHNcbmNvbnN0IGdldFRleHRhcmVhU3R5bGVzID0gKHByb3BzOiBUTXVsdGlMaW5lSW5wdXRQcm9wcywgdGhlbWU6IFRoZW1lKSA9PiB7XG4gIGNvbnN0IGJhc2VTdHlsZXMgPSBbXG4gICAgZ2V0SW5wdXRTdHlsZXMocHJvcHMsIHRoZW1lKSxcbiAgICBjc3NgXG4gICAgICBwYWRkaW5nOiAke3ZhcnMuc3BhY2luZ1hzfSAke3ZhcnMuc3BhY2luZ1N9O1xuICAgICAgbGluZS1oZWlnaHQ6ICR7c2l6ZUlucHV0TGluZUhlaWdodH07XG4gICAgICBmbGV4OiBhdXRvO1xuICAgICAgd29yZC1icmVhazogYnJlYWstYWxsO1xuICAgICAgd2hpdGUtc3BhY2U6IHByZS13cmFwO1xuICAgICAgcmVzaXplOiB2ZXJ0aWNhbDtcbiAgICBgLFxuICBdO1xuICByZXR1cm4gYmFzZVN0eWxlcztcbn07XG5cbi8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBpbXBvcnQvcHJlZmVyLWRlZmF1bHQtZXhwb3J0XG5leHBvcnQgeyBnZXRUZXh0YXJlYVN0eWxlcyB9O1xuIl19 */")];
|
|
148
147
|
return baseStyles;
|
|
149
148
|
}; // eslint-disable-next-line import/prefer-default-export
|
|
150
149
|
|
|
150
|
+
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (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; }
|
|
151
|
+
|
|
152
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _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; }
|
|
151
153
|
var MIN_ROW_COUNT = 1;
|
|
152
154
|
|
|
153
155
|
var MultilineInput = function MultilineInput(props) {
|
|
154
156
|
var theme = react.useTheme();
|
|
155
157
|
var onHeightChange = props.onHeightChange;
|
|
156
|
-
var ref =
|
|
157
|
-
var handleHeightChange =
|
|
158
|
+
var ref = react$1.useRef(null);
|
|
159
|
+
var handleHeightChange = react$1.useCallback(function (height, meta) {
|
|
158
160
|
var _ref$current;
|
|
159
161
|
|
|
160
162
|
var rowCount = Math.floor(((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.scrollHeight) || 0 / meta.rowHeight);
|
|
@@ -168,7 +170,7 @@ var MultilineInput = function MultilineInput(props) {
|
|
|
168
170
|
process.env.NODE_ENV !== "production" ? utils.warning(typeof props.onChange === 'function', 'MultilineInput: "onChange" is required when is not read only.') : void 0;
|
|
169
171
|
}
|
|
170
172
|
|
|
171
|
-
return
|
|
173
|
+
return jsxRuntime.jsx(TextareaAutosize__default["default"], _objectSpread({
|
|
172
174
|
ref: ref,
|
|
173
175
|
name: props.name,
|
|
174
176
|
onHeightChange: handleHeightChange,
|
|
@@ -199,22 +201,22 @@ var MultilineInput = function MultilineInput(props) {
|
|
|
199
201
|
};
|
|
200
202
|
|
|
201
203
|
MultilineInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
202
|
-
autoComplete: _pt__default[
|
|
203
|
-
className: _pt__default[
|
|
204
|
-
hasError: _pt__default[
|
|
205
|
-
hasWarning: _pt__default[
|
|
206
|
-
id: _pt__default[
|
|
207
|
-
isAutofocussed: _pt__default[
|
|
208
|
-
isDisabled: _pt__default[
|
|
209
|
-
isReadOnly: _pt__default[
|
|
210
|
-
name: _pt__default[
|
|
211
|
-
onBlur: _pt__default[
|
|
212
|
-
onChange: _pt__default[
|
|
213
|
-
onFocus: _pt__default[
|
|
214
|
-
placeholder: _pt__default[
|
|
215
|
-
value: _pt__default[
|
|
216
|
-
isOpen: _pt__default[
|
|
217
|
-
onHeightChange: _pt__default[
|
|
204
|
+
autoComplete: _pt__default["default"].string,
|
|
205
|
+
className: _pt__default["default"].string,
|
|
206
|
+
hasError: _pt__default["default"].bool,
|
|
207
|
+
hasWarning: _pt__default["default"].bool,
|
|
208
|
+
id: _pt__default["default"].string,
|
|
209
|
+
isAutofocussed: _pt__default["default"].bool,
|
|
210
|
+
isDisabled: _pt__default["default"].bool,
|
|
211
|
+
isReadOnly: _pt__default["default"].bool,
|
|
212
|
+
name: _pt__default["default"].string,
|
|
213
|
+
onBlur: _pt__default["default"].func,
|
|
214
|
+
onChange: _pt__default["default"].func,
|
|
215
|
+
onFocus: _pt__default["default"].func,
|
|
216
|
+
placeholder: _pt__default["default"].string,
|
|
217
|
+
value: _pt__default["default"].string.isRequired,
|
|
218
|
+
isOpen: _pt__default["default"].bool.isRequired,
|
|
219
|
+
onHeightChange: _pt__default["default"].func
|
|
218
220
|
} : {};
|
|
219
221
|
MultilineInput.displayName = 'MultilineInput';
|
|
220
222
|
var MultilineInput$1 = MultilineInput;
|
|
@@ -239,12 +241,13 @@ var accessibleHiddenInputStyles = process.env.NODE_ENV === "production" ? {
|
|
|
239
241
|
} : {
|
|
240
242
|
name: "vekel6-accessibleHiddenInputStyles",
|
|
241
243
|
styles: "pointer-events:none;height:100%;left:0;opacity:0.0001;position:absolute;top:0;width:100%;label:accessibleHiddenInputStyles;",
|
|
244
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFjY2Vzc2libGUtaGlkZGVuLWlucHV0LnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFdUMiLCJmaWxlIjoiYWNjZXNzaWJsZS1oaWRkZW4taW5wdXQuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG5jb25zdCBhY2Nlc3NpYmxlSGlkZGVuSW5wdXRTdHlsZXMgPSBjc3NgXG4gIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICBoZWlnaHQ6IDEwMCU7XG4gIGxlZnQ6IDA7XG4gIG9wYWNpdHk6IDAuMDAwMTtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDA7XG4gIHdpZHRoOiAxMDAlO1xuYDtcblxuZXhwb3J0IGRlZmF1bHQgYWNjZXNzaWJsZUhpZGRlbklucHV0U3R5bGVzO1xuIl19 */",
|
|
242
245
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
243
246
|
};
|
|
244
247
|
var accessibleHiddenInputStyles$1 = accessibleHiddenInputStyles;
|
|
245
248
|
|
|
246
|
-
// NOTE: This string will be replaced
|
|
247
|
-
var version =
|
|
249
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
250
|
+
var version = "12.2.6";
|
|
248
251
|
|
|
249
252
|
exports.LocalizedInputToggle = LocalizedInputToggle$1;
|
|
250
253
|
exports.MultilineInput = MultilineInput$1;
|
|
@@ -14,11 +14,11 @@ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/obje
|
|
|
14
14
|
var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
|
|
15
15
|
var designSystem = require('@commercetools-uikit/design-system');
|
|
16
16
|
require('prop-types');
|
|
17
|
-
var
|
|
17
|
+
var react$1 = require('react');
|
|
18
18
|
var reactIntl = require('react-intl');
|
|
19
19
|
var FlatButton = require('@commercetools-uikit/flat-button');
|
|
20
20
|
var icons = require('@commercetools-uikit/icons');
|
|
21
|
-
var
|
|
21
|
+
var jsxRuntime = require('@emotion/react/jsx-runtime');
|
|
22
22
|
var TextareaAutosize = require('react-textarea-autosize');
|
|
23
23
|
var utils = require('@commercetools-uikit/utils');
|
|
24
24
|
|
|
@@ -32,7 +32,6 @@ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachIns
|
|
|
32
32
|
var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
|
|
33
33
|
var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
|
|
34
34
|
var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
|
|
35
|
-
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
36
35
|
var FlatButton__default = /*#__PURE__*/_interopDefault(FlatButton);
|
|
37
36
|
var TextareaAutosize__default = /*#__PURE__*/_interopDefault(TextareaAutosize);
|
|
38
37
|
|
|
@@ -65,8 +64,8 @@ var LocalizedInputToggle = function LocalizedInputToggle(props) {
|
|
|
65
64
|
var label = typeof labelMessage === 'string' ? labelMessage : intl.formatMessage(labelMessage, {
|
|
66
65
|
remainingLanguages: props.remainingLocalizations
|
|
67
66
|
});
|
|
68
|
-
return
|
|
69
|
-
icon: props.icon ? props.icon :
|
|
67
|
+
return jsxRuntime.jsx(FlatButton__default["default"], {
|
|
68
|
+
icon: props.icon ? props.icon : jsxRuntime.jsx(icons.WorldIcon, {}),
|
|
70
69
|
label: label,
|
|
71
70
|
onClick: props.onClick,
|
|
72
71
|
isDisabled: props.isDisabled
|
|
@@ -78,9 +77,9 @@ LocalizedInputToggle.defaultProps = defaultProps;
|
|
|
78
77
|
LocalizedInputToggle.displayName = 'LocalizedInputToggle';
|
|
79
78
|
var LocalizedInputToggle$1 = LocalizedInputToggle;
|
|
80
79
|
|
|
81
|
-
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default[
|
|
80
|
+
function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (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; }
|
|
82
81
|
|
|
83
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default[
|
|
82
|
+
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
|
|
84
83
|
|
|
85
84
|
var getInputBorderColor = function getInputBorderColor(vars, props) {
|
|
86
85
|
if (props.isDisabled || props.disabled) {
|
|
@@ -123,9 +122,9 @@ var getInputFontColor = function getInputFontColor(vars, props) {
|
|
|
123
122
|
};
|
|
124
123
|
|
|
125
124
|
var getInputStyles = function getInputStyles(props, theme) {
|
|
126
|
-
var vars = _objectSpread(_objectSpread({}, designSystem.customProperties), theme);
|
|
125
|
+
var vars = _objectSpread$1(_objectSpread$1({}, designSystem.customProperties), theme);
|
|
127
126
|
|
|
128
|
-
return /*#__PURE__*/react.css("appearance:none;background-color:", props.isDisabled || props.disabled ? vars[designSystem.designTokens.backgroundColorForInputWhenDisabled] : vars[designSystem.designTokens.backgroundColorForInput], ";border:1px solid ", getInputBorderColor(vars, props), ";border-radius:", vars[designSystem.designTokens.borderRadiusForInput], ";box-sizing:border-box;color:", getInputFontColor(vars, props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", vars[designSystem.designTokens.fontSizeForInput], ";height:", vars.sizeHeightInput, ";min-height:", vars.sizeHeightInput, ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:0 ", vars.spacingS, ";transition:border-color ", vars.transitionStandard, ",background-color ", vars.transitionStandard, ",color ", vars.transitionStandard, ",box-shadow ", vars.transitionStandard, ";width:100%;&::placeholder{color:", vars[designSystem.designTokens.placeholderFontColorForInput], ";}:active,:focus,:hover:not(:disabled):not(:read-only){border-color:", vars[designSystem.designTokens.borderColorForInputWhenFocused], ";}:focus{box-shadow:inset 0 0 0 2px ", vars[designSystem.designTokens.borderColorForInputWhenFocused], ";}" + ("" ));
|
|
127
|
+
return /*#__PURE__*/react.css("appearance:none;background-color:", props.isDisabled || props.disabled ? vars[designSystem.designTokens.backgroundColorForInputWhenDisabled] : vars[designSystem.designTokens.backgroundColorForInput], ";border:1px solid ", getInputBorderColor(vars, props), ";border-radius:", vars[designSystem.designTokens.borderRadiusForInput], ";box-sizing:border-box;color:", getInputFontColor(vars, props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", vars[designSystem.designTokens.fontSizeForInput], ";height:", vars.sizeHeightInput, ";min-height:", vars.sizeHeightInput, ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:0 ", vars.spacingS, ";transition:border-color ", vars.transitionStandard, ",background-color ", vars.transitionStandard, ",color ", vars.transitionStandard, ",box-shadow ", vars.transitionStandard, ";width:100%;&::placeholder{color:", vars[designSystem.designTokens.placeholderFontColorForInput], ";}:active,:focus,:hover:not(:disabled):not(:read-only){border-color:", vars[designSystem.designTokens.borderColorForInputWhenFocused], ";}:focus{box-shadow:inset 0 0 0 2px ", vars[designSystem.designTokens.borderColorForInputWhenFocused], ";}" + ("" ), "" );
|
|
129
128
|
}; // eslint-disable-next-line import/prefer-default-export
|
|
130
129
|
|
|
131
130
|
/* we need this line-height to achieve 32px height when the component has only one row */
|
|
@@ -135,17 +134,20 @@ var sizeInputLineHeight = '22px'; // NOTE: order is important here
|
|
|
135
134
|
// how you can interact with the field is controlled separately by the props, this only influences visuals
|
|
136
135
|
|
|
137
136
|
var getTextareaStyles = function getTextareaStyles(props, theme) {
|
|
138
|
-
var baseStyles = [getInputStyles(props, theme), /*#__PURE__*/react.css("padding:", designSystem.customProperties.spacingXs, " ", designSystem.customProperties.spacingS, ";line-height:", sizeInputLineHeight, ";flex:auto;word-break:break-all;white-space:pre-wrap;resize:vertical;" + ("" ))];
|
|
137
|
+
var baseStyles = [getInputStyles(props, theme), /*#__PURE__*/react.css("padding:", designSystem.customProperties.spacingXs, " ", designSystem.customProperties.spacingS, ";line-height:", sizeInputLineHeight, ";flex:auto;word-break:break-all;white-space:pre-wrap;resize:vertical;" + ("" ), "" )];
|
|
139
138
|
return baseStyles;
|
|
140
139
|
}; // eslint-disable-next-line import/prefer-default-export
|
|
141
140
|
|
|
141
|
+
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (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; }
|
|
142
|
+
|
|
143
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _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; }
|
|
142
144
|
var MIN_ROW_COUNT = 1;
|
|
143
145
|
|
|
144
146
|
var MultilineInput = function MultilineInput(props) {
|
|
145
147
|
var theme = react.useTheme();
|
|
146
148
|
var onHeightChange = props.onHeightChange;
|
|
147
|
-
var ref =
|
|
148
|
-
var handleHeightChange =
|
|
149
|
+
var ref = react$1.useRef(null);
|
|
150
|
+
var handleHeightChange = react$1.useCallback(function (height, meta) {
|
|
149
151
|
var _ref$current;
|
|
150
152
|
|
|
151
153
|
var rowCount = Math.floor(((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.scrollHeight) || 0 / meta.rowHeight);
|
|
@@ -157,7 +159,7 @@ var MultilineInput = function MultilineInput(props) {
|
|
|
157
159
|
|
|
158
160
|
if (!props.isReadOnly) ;
|
|
159
161
|
|
|
160
|
-
return
|
|
162
|
+
return jsxRuntime.jsx(TextareaAutosize__default["default"], _objectSpread({
|
|
161
163
|
ref: ref,
|
|
162
164
|
name: props.name,
|
|
163
165
|
onHeightChange: handleHeightChange,
|
|
@@ -210,8 +212,8 @@ var accessibleHiddenInputStyles = {
|
|
|
210
212
|
} ;
|
|
211
213
|
var accessibleHiddenInputStyles$1 = accessibleHiddenInputStyles;
|
|
212
214
|
|
|
213
|
-
// NOTE: This string will be replaced
|
|
214
|
-
var version =
|
|
215
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
216
|
+
var version = "12.2.6";
|
|
215
217
|
|
|
216
218
|
exports.LocalizedInputToggle = LocalizedInputToggle$1;
|
|
217
219
|
exports.MultilineInput = MultilineInput$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { css, useTheme } from '@emotion/react';
|
|
2
2
|
import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
|
|
3
3
|
import _Object$getOwnPropertySymbols from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
|
|
4
4
|
import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
|
|
@@ -10,11 +10,11 @@ import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object
|
|
|
10
10
|
import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
|
|
11
11
|
import { customProperties, designTokens } from '@commercetools-uikit/design-system';
|
|
12
12
|
import _pt from 'prop-types';
|
|
13
|
-
import
|
|
13
|
+
import { useRef, useCallback } from 'react';
|
|
14
14
|
import { defineMessages, useIntl } from 'react-intl';
|
|
15
15
|
import FlatButton from '@commercetools-uikit/flat-button';
|
|
16
16
|
import { WorldIcon } from '@commercetools-uikit/icons';
|
|
17
|
-
import
|
|
17
|
+
import { jsx } from '@emotion/react/jsx-runtime';
|
|
18
18
|
import TextareaAutosize from 'react-textarea-autosize';
|
|
19
19
|
import { warning, filterDataAttributes } from '@commercetools-uikit/utils';
|
|
20
20
|
|
|
@@ -48,7 +48,7 @@ var LocalizedInputToggle = function LocalizedInputToggle(props) {
|
|
|
48
48
|
remainingLanguages: props.remainingLocalizations
|
|
49
49
|
});
|
|
50
50
|
return jsx(FlatButton, {
|
|
51
|
-
icon: props.icon ? props.icon : jsx(WorldIcon,
|
|
51
|
+
icon: props.icon ? props.icon : jsx(WorldIcon, {}),
|
|
52
52
|
label: label,
|
|
53
53
|
onClick: props.onClick,
|
|
54
54
|
isDisabled: props.isDisabled
|
|
@@ -68,9 +68,9 @@ LocalizedInputToggle.defaultProps = defaultProps;
|
|
|
68
68
|
LocalizedInputToggle.displayName = 'LocalizedInputToggle';
|
|
69
69
|
var LocalizedInputToggle$1 = LocalizedInputToggle;
|
|
70
70
|
|
|
71
|
-
function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); if (enumerableOnly) { symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
71
|
+
function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); if (enumerableOnly) { symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
72
72
|
|
|
73
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty(_context = ownKeys(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors) { _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)); } else { var _context2; _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
73
|
+
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty(_context = ownKeys$1(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors) { _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)); } else { var _context2; _forEachInstanceProperty(_context2 = ownKeys$1(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
74
74
|
|
|
75
75
|
var getInputBorderColor = function getInputBorderColor(vars, props) {
|
|
76
76
|
if (props.isDisabled || props.disabled) {
|
|
@@ -113,9 +113,9 @@ var getInputFontColor = function getInputFontColor(vars, props) {
|
|
|
113
113
|
};
|
|
114
114
|
|
|
115
115
|
var getInputStyles = function getInputStyles(props, theme) {
|
|
116
|
-
var vars = _objectSpread(_objectSpread({}, customProperties), theme);
|
|
116
|
+
var vars = _objectSpread$1(_objectSpread$1({}, customProperties), theme);
|
|
117
117
|
|
|
118
|
-
return /*#__PURE__*/css("appearance:none;background-color:", props.isDisabled || props.disabled ? vars[designTokens.backgroundColorForInputWhenDisabled] : vars[designTokens.backgroundColorForInput], ";border:1px solid ", getInputBorderColor(vars, props), ";border-radius:", vars[designTokens.borderRadiusForInput], ";box-sizing:border-box;color:", getInputFontColor(vars, props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", vars[designTokens.fontSizeForInput], ";height:", vars.sizeHeightInput, ";min-height:", vars.sizeHeightInput, ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:0 ", vars.spacingS, ";transition:border-color ", vars.transitionStandard, ",background-color ", vars.transitionStandard, ",color ", vars.transitionStandard, ",box-shadow ", vars.transitionStandard, ";width:100%;&::placeholder{color:", vars[designTokens.placeholderFontColorForInput], ";}:active,:focus,:hover:not(:disabled):not(:read-only){border-color:", vars[designTokens.borderColorForInputWhenFocused], ";}:focus{box-shadow:inset 0 0 0 2px ", vars[designTokens.borderColorForInputWhenFocused], ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getInputStyles;"));
|
|
118
|
+
return /*#__PURE__*/css("appearance:none;background-color:", props.isDisabled || props.disabled ? vars[designTokens.backgroundColorForInputWhenDisabled] : vars[designTokens.backgroundColorForInput], ";border:1px solid ", getInputBorderColor(vars, props), ";border-radius:", vars[designTokens.borderRadiusForInput], ";box-sizing:border-box;color:", getInputFontColor(vars, props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", vars[designTokens.fontSizeForInput], ";height:", vars.sizeHeightInput, ";min-height:", vars.sizeHeightInput, ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:0 ", vars.spacingS, ";transition:border-color ", vars.transitionStandard, ",background-color ", vars.transitionStandard, ",color ", vars.transitionStandard, ",box-shadow ", vars.transitionStandard, ";width:100%;&::placeholder{color:", vars[designTokens.placeholderFontColorForInput], ";}:active,:focus,:hover:not(:disabled):not(:read-only){border-color:", vars[designTokens.borderColorForInputWhenFocused], ";}:focus{box-shadow:inset 0 0 0 2px ", vars[designTokens.borderColorForInputWhenFocused], ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getInputStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwRFkiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUgeyBUaGVtZSB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7XG4gIGN1c3RvbVByb3BlcnRpZXMsXG4gIGRlc2lnblRva2Vucyxcbn0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5cbnR5cGUgVEV4dGVuZGVkVGhlbWUgPSB7XG4gIFtrZXk6IHN0cmluZ106IHN0cmluZztcbn0gJiBUaGVtZTtcblxudHlwZSBUSW5wdXRQcm9wcyA9IHtcbiAgaXNEaXNhYmxlZD86IGJvb2xlYW47XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgaGFzRXJyb3I/OiBib29sZWFuO1xuICBoYXNXYXJuaW5nPzogYm9vbGVhbjtcbiAgaXNSZWFkT25seT86IGJvb2xlYW47XG4gIHJlYWRPbmx5PzogYm9vbGVhbjtcbn07XG5cbmNvbnN0IGdldElucHV0Qm9yZGVyQ29sb3IgPSAodmFyczogVEV4dGVuZGVkVGhlbWUsIHByb3BzOiBUSW5wdXRQcm9wcykgPT4ge1xuICBpZiAocHJvcHMuaXNEaXNhYmxlZCB8fCBwcm9wcy5kaXNhYmxlZCkge1xuICAgIHJldHVybiB2YXJzW2Rlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlbkRpc2FibGVkXTtcbiAgfVxuICBpZiAocHJvcHMuaGFzRXJyb3IpIHtcbiAgICByZXR1cm4gdmFyc1tkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFdoZW5FcnJvcl07XG4gIH1cbiAgaWYgKHByb3BzLmhhc1dhcm5pbmcpIHtcbiAgICByZXR1cm4gdmFyc1tkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFdoZW5XYXJuaW5nXTtcbiAgfVxuICBpZiAocHJvcHMuaXNSZWFkT25seSB8fCBwcm9wcy5yZWFkT25seSkge1xuICAgIHJldHVybiB2YXJzW2Rlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlblJlYWRvbmx5XTtcbiAgfVxuICByZXR1cm4gdmFyc1tkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dF07XG59O1xuXG5jb25zdCBnZXRJbnB1dEZvbnRDb2xvciA9ICh2YXJzOiBURXh0ZW5kZWRUaGVtZSwgcHJvcHM6IFRJbnB1dFByb3BzKSA9PiB7XG4gIGlmIChwcm9wcy5pc0Rpc2FibGVkIHx8IHByb3BzLmRpc2FibGVkKSB7XG4gICAgcmV0dXJuIHZhcnNbZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlbkRpc2FibGVkXTtcbiAgfVxuICBpZiAocHJvcHMuaGFzRXJyb3IpIHtcbiAgICByZXR1cm4gdmFyc1tkZXNpZ25Ub2tlbnMuZm9udENvbG9yRm9ySW5wdXRXaGVuRXJyb3JdO1xuICB9XG4gIGlmIChwcm9wcy5oYXNXYXJuaW5nKSB7XG4gICAgcmV0dXJuIHZhcnNbZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlbldhcm5pbmddO1xuICB9XG4gIGlmIChwcm9wcy5pc1JlYWRPbmx5IHx8IHByb3BzLnJlYWRPbmx5KSB7XG4gICAgcmV0dXJuIHZhcnNbZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlblJlYWRvbmx5XTtcbiAgfVxuICByZXR1cm4gdmFyc1tkZXNpZ25Ub2tlbnMuZm9udENvbG9yRm9ySW5wdXRdO1xufTtcblxuY29uc3QgZ2V0SW5wdXRTdHlsZXMgPSAocHJvcHM6IFRJbnB1dFByb3BzLCB0aGVtZT86IFRoZW1lKSA9PiB7XG4gIGNvbnN0IHZhcnM6IFRFeHRlbmRlZFRoZW1lID0ge1xuICAgIC4uLmN1c3RvbVByb3BlcnRpZXMsXG4gICAgLi4udGhlbWUsXG4gIH07XG5cbiAgcmV0dXJuIGNzc2BcbiAgICBhcHBlYXJhbmNlOiBub25lO1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7cHJvcHMuaXNEaXNhYmxlZCB8fCBwcm9wcy5kaXNhYmxlZFxuICAgICAgPyB2YXJzW2Rlc2lnblRva2Vucy5iYWNrZ3JvdW5kQ29sb3JGb3JJbnB1dFdoZW5EaXNhYmxlZF1cbiAgICAgIDogdmFyc1tkZXNpZ25Ub2tlbnMuYmFja2dyb3VuZENvbG9yRm9ySW5wdXRdfTtcbiAgICBib3JkZXI6IDFweCBzb2xpZCAke2dldElucHV0Qm9yZGVyQ29sb3IodmFycywgcHJvcHMpfTtcbiAgICBib3JkZXItcmFkaXVzOiAke3ZhcnNbZGVzaWduVG9rZW5zLmJvcmRlclJhZGl1c0ZvcklucHV0XX07XG4gICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICBjb2xvcjogJHtnZXRJbnB1dEZvbnRDb2xvcih2YXJzLCBwcm9wcyl9O1xuICAgIGN1cnNvcjogJHtwcm9wcy5pc0Rpc2FibGVkID8gJ25vdC1hbGxvd2VkJyA6ICdkZWZhdWx0J307XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBmbGV4OiAxO1xuICAgIGZvbnQtZmFtaWx5OiBpbmhlcml0O1xuICAgIGZvbnQtc2l6ZTogJHt2YXJzW2Rlc2lnblRva2Vucy5mb250U2l6ZUZvcklucHV0XX07XG4gICAgaGVpZ2h0OiAke3ZhcnMuc2l6ZUhlaWdodElucHV0fTtcbiAgICBtaW4taGVpZ2h0OiAke3ZhcnMuc2l6ZUhlaWdodElucHV0fTtcbiAgICBvcGFjaXR5OiAke3Byb3BzLmlzRGlzYWJsZWQgfHwgcHJvcHMuZGlzYWJsZWRcbiAgICAgID8gJzEnXG4gICAgICA6ICd1bnNldCd9OyAvKiBmaXggZm9yIG1vYmlsZSBzYWZhcmkgKi9cbiAgICBvdXRsaW5lOiBub25lO1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgcGFkZGluZzogMCAke3ZhcnMuc3BhY2luZ1N9O1xuICAgIHRyYW5zaXRpb246IGJvcmRlci1jb2xvciAke3ZhcnMudHJhbnNpdGlvblN0YW5kYXJkfSxcbiAgICAgIGJhY2tncm91bmQtY29sb3IgJHt2YXJzLnRyYW5zaXRpb25TdGFuZGFyZH0sXG4gICAgICBjb2xvciAke3ZhcnMudHJhbnNpdGlvblN0YW5kYXJkfSwgYm94LXNoYWRvdyAke3ZhcnMudHJhbnNpdGlvblN0YW5kYXJkfTtcbiAgICB3aWR0aDogMTAwJTtcblxuICAgICY6OnBsYWNlaG9sZGVyIHtcbiAgICAgIGNvbG9yOiAke3ZhcnNbZGVzaWduVG9rZW5zLnBsYWNlaG9sZGVyRm9udENvbG9yRm9ySW5wdXRdfTtcbiAgICB9XG4gICAgOmFjdGl2ZSxcbiAgICA6Zm9jdXMsXG4gICAgOmhvdmVyOm5vdCg6ZGlzYWJsZWQpOm5vdCg6cmVhZC1vbmx5KSB7XG4gICAgICBib3JkZXItY29sb3I6ICR7dmFyc1tkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFdoZW5Gb2N1c2VkXX07XG4gICAgfVxuICAgIDpmb2N1cyB7XG4gICAgICBib3gtc2hhZG93OiBpbnNldCAwIDAgMCAycHhcbiAgICAgICAgJHt2YXJzW2Rlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlbkZvY3VzZWRdfTtcbiAgICB9XG4gIGA7XG59O1xuXG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgaW1wb3J0L3ByZWZlci1kZWZhdWx0LWV4cG9ydFxuZXhwb3J0IHsgZ2V0SW5wdXRTdHlsZXMgfTtcbiJdfQ== */");
|
|
119
119
|
}; // eslint-disable-next-line import/prefer-default-export
|
|
120
120
|
|
|
121
121
|
/* we need this line-height to achieve 32px height when the component has only one row */
|
|
@@ -125,17 +125,20 @@ var sizeInputLineHeight = '22px'; // NOTE: order is important here
|
|
|
125
125
|
// how you can interact with the field is controlled separately by the props, this only influences visuals
|
|
126
126
|
|
|
127
127
|
var getTextareaStyles = function getTextareaStyles(props, theme) {
|
|
128
|
-
var baseStyles = [getInputStyles(props, theme), /*#__PURE__*/css("padding:", customProperties.spacingXs, " ", customProperties.spacingS, ";line-height:", sizeInputLineHeight, ";flex:auto;word-break:break-all;white-space:pre-wrap;resize:vertical;" + (process.env.NODE_ENV === "production" ? "" : ";label:baseStyles;"))];
|
|
128
|
+
var baseStyles = [getInputStyles(props, theme), /*#__PURE__*/css("padding:", customProperties.spacingXs, " ", customProperties.spacingS, ";line-height:", sizeInputLineHeight, ";flex:auto;word-break:break-all;white-space:pre-wrap;resize:vertical;" + (process.env.NODE_ENV === "production" ? "" : ";label:baseStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm11bHRpbGluZS1pbnB1dC5zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0JPIiwiZmlsZSI6Im11bHRpbGluZS1pbnB1dC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IFRoZW1lIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyBhcyB2YXJzIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQgeyBnZXRJbnB1dFN0eWxlcyB9IGZyb20gJy4uL3N0eWxlcyc7XG5pbXBvcnQgdHlwZSB7IFRNdWx0aUxpbmVJbnB1dFByb3BzIH0gZnJvbSAnLi9tdWx0aWxpbmUtaW5wdXQnO1xuXG4vKiB3ZSBuZWVkIHRoaXMgbGluZS1oZWlnaHQgdG8gYWNoaWV2ZSAzMnB4IGhlaWdodCB3aGVuIHRoZSBjb21wb25lbnQgaGFzIG9ubHkgb25lIHJvdyAqL1xuY29uc3Qgc2l6ZUlucHV0TGluZUhlaWdodCA9ICcyMnB4JztcblxuLy8gTk9URTogb3JkZXIgaXMgaW1wb3J0YW50IGhlcmVcbi8vICogYSBkaXNhYmxlZC1maWVsZCBjdXJyZW50bHkgZG9lcyBub3QgZGlzcGxheSB3YXJuaW5nL2Vycm9yLXN0YXRlcyBzbyBpdCB0YWtlcyBwcmVjZWRlbmNlXG4vLyAqIGEgcmVhZG9ubHktZmllbGQgY2Fubm90IGJlIGNoYW5nZWQsIGJ1dCBpdCBtaWdodCBiZSByZWxldmFudCBmb3IgdmFsaWRhdGlvbiwgc28gZXJyb3IgYW5kIHdhcm5pbmcgYXJlIGNoZWNrZWQgZmlyc3Rcbi8vIGhvdyB5b3UgY2FuIGludGVyYWN0IHdpdGggdGhlIGZpZWxkIGlzIGNvbnRyb2xsZWQgc2VwYXJhdGVseSBieSB0aGUgcHJvcHMsIHRoaXMgb25seSBpbmZsdWVuY2VzIHZpc3VhbHNcbmNvbnN0IGdldFRleHRhcmVhU3R5bGVzID0gKHByb3BzOiBUTXVsdGlMaW5lSW5wdXRQcm9wcywgdGhlbWU6IFRoZW1lKSA9PiB7XG4gIGNvbnN0IGJhc2VTdHlsZXMgPSBbXG4gICAgZ2V0SW5wdXRTdHlsZXMocHJvcHMsIHRoZW1lKSxcbiAgICBjc3NgXG4gICAgICBwYWRkaW5nOiAke3ZhcnMuc3BhY2luZ1hzfSAke3ZhcnMuc3BhY2luZ1N9O1xuICAgICAgbGluZS1oZWlnaHQ6ICR7c2l6ZUlucHV0TGluZUhlaWdodH07XG4gICAgICBmbGV4OiBhdXRvO1xuICAgICAgd29yZC1icmVhazogYnJlYWstYWxsO1xuICAgICAgd2hpdGUtc3BhY2U6IHByZS13cmFwO1xuICAgICAgcmVzaXplOiB2ZXJ0aWNhbDtcbiAgICBgLFxuICBdO1xuICByZXR1cm4gYmFzZVN0eWxlcztcbn07XG5cbi8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBpbXBvcnQvcHJlZmVyLWRlZmF1bHQtZXhwb3J0XG5leHBvcnQgeyBnZXRUZXh0YXJlYVN0eWxlcyB9O1xuIl19 */")];
|
|
129
129
|
return baseStyles;
|
|
130
130
|
}; // eslint-disable-next-line import/prefer-default-export
|
|
131
131
|
|
|
132
|
+
function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); if (enumerableOnly) { symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
133
|
+
|
|
134
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty(_context = ownKeys(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors) { _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)); } else { var _context2; _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
132
135
|
var MIN_ROW_COUNT = 1;
|
|
133
136
|
|
|
134
137
|
var MultilineInput = function MultilineInput(props) {
|
|
135
138
|
var theme = useTheme();
|
|
136
139
|
var onHeightChange = props.onHeightChange;
|
|
137
|
-
var ref =
|
|
138
|
-
var handleHeightChange =
|
|
140
|
+
var ref = useRef(null);
|
|
141
|
+
var handleHeightChange = useCallback(function (height, meta) {
|
|
139
142
|
var _ref$current;
|
|
140
143
|
|
|
141
144
|
var rowCount = Math.floor(((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.scrollHeight) || 0 / meta.rowHeight);
|
|
@@ -149,7 +152,7 @@ var MultilineInput = function MultilineInput(props) {
|
|
|
149
152
|
process.env.NODE_ENV !== "production" ? warning(typeof props.onChange === 'function', 'MultilineInput: "onChange" is required when is not read only.') : void 0;
|
|
150
153
|
}
|
|
151
154
|
|
|
152
|
-
return jsx(TextareaAutosize,
|
|
155
|
+
return jsx(TextareaAutosize, _objectSpread({
|
|
153
156
|
ref: ref,
|
|
154
157
|
name: props.name,
|
|
155
158
|
onHeightChange: handleHeightChange,
|
|
@@ -220,11 +223,12 @@ var accessibleHiddenInputStyles = process.env.NODE_ENV === "production" ? {
|
|
|
220
223
|
} : {
|
|
221
224
|
name: "vekel6-accessibleHiddenInputStyles",
|
|
222
225
|
styles: "pointer-events:none;height:100%;left:0;opacity:0.0001;position:absolute;top:0;width:100%;label:accessibleHiddenInputStyles;",
|
|
226
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImFjY2Vzc2libGUtaGlkZGVuLWlucHV0LnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFdUMiLCJmaWxlIjoiYWNjZXNzaWJsZS1oaWRkZW4taW5wdXQuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG5jb25zdCBhY2Nlc3NpYmxlSGlkZGVuSW5wdXRTdHlsZXMgPSBjc3NgXG4gIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICBoZWlnaHQ6IDEwMCU7XG4gIGxlZnQ6IDA7XG4gIG9wYWNpdHk6IDAuMDAwMTtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDA7XG4gIHdpZHRoOiAxMDAlO1xuYDtcblxuZXhwb3J0IGRlZmF1bHQgYWNjZXNzaWJsZUhpZGRlbklucHV0U3R5bGVzO1xuIl19 */",
|
|
223
227
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
224
228
|
};
|
|
225
229
|
var accessibleHiddenInputStyles$1 = accessibleHiddenInputStyles;
|
|
226
230
|
|
|
227
|
-
// NOTE: This string will be replaced
|
|
228
|
-
var version =
|
|
231
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
232
|
+
var version = "12.2.6";
|
|
229
233
|
|
|
230
234
|
export { LocalizedInputToggle$1 as LocalizedInputToggle, MultilineInput$1 as MultilineInput, accessibleHiddenInputStyles$1 as accessibleHiddenInputStyles, getInputStyles, messages$1 as messagesLocalizedInput, messages as messagesMultilineInput, version };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const accessibleHiddenInputStyles: import("@emotion/utils").SerializedStyles;
|
|
2
|
-
export default accessibleHiddenInputStyles;
|
|
1
|
+
declare const accessibleHiddenInputStyles: import("@emotion/utils").SerializedStyles;
|
|
2
|
+
export default accessibleHiddenInputStyles;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
export { default as LocalizedInputToggle } from './localized-input-toggle';
|
|
2
|
-
export { default as MultilineInput } from './multiline-input';
|
|
3
|
-
export { default as messagesLocalizedInput } from './messages/localized-input';
|
|
4
|
-
export { default as messagesMultilineInput } from './messages/multiline-input';
|
|
5
|
-
export { default as accessibleHiddenInputStyles } from './accessible-hidden-input.styles';
|
|
6
|
-
export * from './styles';
|
|
7
|
-
export { default as version } from './version';
|
|
1
|
+
export { default as LocalizedInputToggle } from './localized-input-toggle';
|
|
2
|
+
export { default as MultilineInput } from './multiline-input';
|
|
3
|
+
export { default as messagesLocalizedInput } from './messages/localized-input';
|
|
4
|
+
export { default as messagesMultilineInput } from './messages/multiline-input';
|
|
5
|
+
export { default as accessibleHiddenInputStyles } from './accessible-hidden-input.styles';
|
|
6
|
+
export * from './styles';
|
|
7
|
+
export { default as version } from './version';
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import type { TLocalizedInputToggleProps as LocalizedInputToggleProps } from './localized-input-toggle';
|
|
2
|
-
export { default } from './localized-input-toggle';
|
|
3
|
-
export declare type TLocalizedInputToggleProps = LocalizedInputToggleProps;
|
|
1
|
+
import type { TLocalizedInputToggleProps as LocalizedInputToggleProps } from './localized-input-toggle';
|
|
2
|
+
export { default } from './localized-input-toggle';
|
|
3
|
+
export declare type TLocalizedInputToggleProps = LocalizedInputToggleProps;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import type { MessageDescriptor } from 'react-intl';
|
|
2
|
-
import
|
|
3
|
-
export declare type TLocalizedInputToggleProps = {
|
|
4
|
-
icon?:
|
|
5
|
-
isOpen?: boolean;
|
|
6
|
-
onClick: (event: MouseEvent<HTMLButtonElement> | KeyboardEvent<HTMLButtonElement>) => void;
|
|
7
|
-
isDisabled?: boolean;
|
|
8
|
-
showMessage: string | MessageDescriptor;
|
|
9
|
-
hideMessage: string | MessageDescriptor;
|
|
10
|
-
remainingLocalizations?: number;
|
|
11
|
-
};
|
|
12
|
-
declare const LocalizedInputToggle: {
|
|
13
|
-
(props: TLocalizedInputToggleProps): JSX.Element;
|
|
14
|
-
defaultProps: Pick<TLocalizedInputToggleProps, "showMessage" | "hideMessage">;
|
|
15
|
-
displayName: string;
|
|
16
|
-
};
|
|
17
|
-
export default LocalizedInputToggle;
|
|
1
|
+
import type { MessageDescriptor } from 'react-intl';
|
|
2
|
+
import { MouseEvent, KeyboardEvent, ReactElement } from 'react';
|
|
3
|
+
export declare type TLocalizedInputToggleProps = {
|
|
4
|
+
icon?: ReactElement;
|
|
5
|
+
isOpen?: boolean;
|
|
6
|
+
onClick: (event: MouseEvent<HTMLButtonElement> | KeyboardEvent<HTMLButtonElement>) => void;
|
|
7
|
+
isDisabled?: boolean;
|
|
8
|
+
showMessage: string | MessageDescriptor;
|
|
9
|
+
hideMessage: string | MessageDescriptor;
|
|
10
|
+
remainingLocalizations?: number;
|
|
11
|
+
};
|
|
12
|
+
declare const LocalizedInputToggle: {
|
|
13
|
+
(props: TLocalizedInputToggleProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
14
|
+
defaultProps: Pick<TLocalizedInputToggleProps, "showMessage" | "hideMessage">;
|
|
15
|
+
displayName: string;
|
|
16
|
+
};
|
|
17
|
+
export default LocalizedInputToggle;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default } from './messages';
|
|
1
|
+
export { default } from './messages';
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
declare const _default: {
|
|
2
|
-
missingRequiredField: {
|
|
3
|
-
id: string;
|
|
4
|
-
description: string;
|
|
5
|
-
defaultMessage: string;
|
|
6
|
-
};
|
|
7
|
-
show: {
|
|
8
|
-
id: string;
|
|
9
|
-
description: string;
|
|
10
|
-
defaultMessage: string;
|
|
11
|
-
};
|
|
12
|
-
hide: {
|
|
13
|
-
id: string;
|
|
14
|
-
description: string;
|
|
15
|
-
defaultMessage: string;
|
|
16
|
-
};
|
|
17
|
-
};
|
|
18
|
-
export default _default;
|
|
1
|
+
declare const _default: {
|
|
2
|
+
missingRequiredField: {
|
|
3
|
+
id: string;
|
|
4
|
+
description: string;
|
|
5
|
+
defaultMessage: string;
|
|
6
|
+
};
|
|
7
|
+
show: {
|
|
8
|
+
id: string;
|
|
9
|
+
description: string;
|
|
10
|
+
defaultMessage: string;
|
|
11
|
+
};
|
|
12
|
+
hide: {
|
|
13
|
+
id: string;
|
|
14
|
+
description: string;
|
|
15
|
+
defaultMessage: string;
|
|
16
|
+
};
|
|
17
|
+
};
|
|
18
|
+
export default _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default } from './messages';
|
|
1
|
+
export { default } from './messages';
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
declare const _default: {
|
|
2
|
-
expand: {
|
|
3
|
-
id: string;
|
|
4
|
-
description: string;
|
|
5
|
-
defaultMessage: string;
|
|
6
|
-
};
|
|
7
|
-
collapse: {
|
|
8
|
-
id: string;
|
|
9
|
-
description: string;
|
|
10
|
-
defaultMessage: string;
|
|
11
|
-
};
|
|
12
|
-
};
|
|
13
|
-
export default _default;
|
|
1
|
+
declare const _default: {
|
|
2
|
+
expand: {
|
|
3
|
+
id: string;
|
|
4
|
+
description: string;
|
|
5
|
+
defaultMessage: string;
|
|
6
|
+
};
|
|
7
|
+
collapse: {
|
|
8
|
+
id: string;
|
|
9
|
+
description: string;
|
|
10
|
+
defaultMessage: string;
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
export default _default;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import type { TMultiLineInputProps as MultiLineInputProps } from './multiline-input';
|
|
2
|
-
export { default } from './multiline-input';
|
|
3
|
-
export declare type TMultiLineInputProps = MultiLineInputProps;
|
|
1
|
+
import type { TMultiLineInputProps as MultiLineInputProps } from './multiline-input';
|
|
2
|
+
export { default } from './multiline-input';
|
|
3
|
+
export declare type TMultiLineInputProps = MultiLineInputProps;
|
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
import { ChangeEventHandler } from 'react';
|
|
2
|
-
export declare type TMultiLineInputProps = {
|
|
3
|
-
autoComplete?: string;
|
|
4
|
-
className?: string;
|
|
5
|
-
hasError?: boolean;
|
|
6
|
-
hasWarning?: boolean;
|
|
7
|
-
id?: string;
|
|
8
|
-
isAutofocussed?: boolean;
|
|
9
|
-
isDisabled?: boolean;
|
|
10
|
-
isReadOnly?: boolean;
|
|
11
|
-
name?: string;
|
|
12
|
-
onBlur?: ChangeEventHandler;
|
|
13
|
-
onChange?: ChangeEventHandler;
|
|
14
|
-
onFocus?: ChangeEventHandler;
|
|
15
|
-
placeholder?: string;
|
|
16
|
-
value: string;
|
|
17
|
-
isOpen: boolean;
|
|
18
|
-
onHeightChange?: (height: number, rowCount: number) => void;
|
|
19
|
-
};
|
|
20
|
-
declare const MultilineInput: {
|
|
21
|
-
(props: TMultiLineInputProps): JSX.Element;
|
|
22
|
-
displayName: string;
|
|
23
|
-
};
|
|
24
|
-
export default MultilineInput;
|
|
1
|
+
import { ChangeEventHandler } from 'react';
|
|
2
|
+
export declare type TMultiLineInputProps = {
|
|
3
|
+
autoComplete?: string;
|
|
4
|
+
className?: string;
|
|
5
|
+
hasError?: boolean;
|
|
6
|
+
hasWarning?: boolean;
|
|
7
|
+
id?: string;
|
|
8
|
+
isAutofocussed?: boolean;
|
|
9
|
+
isDisabled?: boolean;
|
|
10
|
+
isReadOnly?: boolean;
|
|
11
|
+
name?: string;
|
|
12
|
+
onBlur?: ChangeEventHandler;
|
|
13
|
+
onChange?: ChangeEventHandler;
|
|
14
|
+
onFocus?: ChangeEventHandler;
|
|
15
|
+
placeholder?: string;
|
|
16
|
+
value: string;
|
|
17
|
+
isOpen: boolean;
|
|
18
|
+
onHeightChange?: (height: number, rowCount: number) => void;
|
|
19
|
+
};
|
|
20
|
+
declare const MultilineInput: {
|
|
21
|
+
(props: TMultiLineInputProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
22
|
+
displayName: string;
|
|
23
|
+
};
|
|
24
|
+
export default MultilineInput;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { Theme } from '@emotion/react';
|
|
2
|
-
import type { TMultiLineInputProps } from './multiline-input';
|
|
3
|
-
declare const getTextareaStyles: (props: TMultiLineInputProps, theme: Theme) => import("@emotion/utils").SerializedStyles[];
|
|
4
|
-
export { getTextareaStyles };
|
|
1
|
+
import type { Theme } from '@emotion/react';
|
|
2
|
+
import type { TMultiLineInputProps } from './multiline-input';
|
|
3
|
+
declare const getTextareaStyles: (props: TMultiLineInputProps, theme: Theme) => import("@emotion/utils").SerializedStyles[];
|
|
4
|
+
export { getTextareaStyles };
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import type { Theme } from '@emotion/react';
|
|
2
|
-
declare type TInputProps = {
|
|
3
|
-
isDisabled?: boolean;
|
|
4
|
-
disabled?: boolean;
|
|
5
|
-
hasError?: boolean;
|
|
6
|
-
hasWarning?: boolean;
|
|
7
|
-
isReadOnly?: boolean;
|
|
8
|
-
readOnly?: boolean;
|
|
9
|
-
};
|
|
10
|
-
declare const getInputStyles: (props: TInputProps, theme
|
|
11
|
-
export { getInputStyles };
|
|
1
|
+
import type { Theme } from '@emotion/react';
|
|
2
|
+
declare type TInputProps = {
|
|
3
|
+
isDisabled?: boolean;
|
|
4
|
+
disabled?: boolean;
|
|
5
|
+
hasError?: boolean;
|
|
6
|
+
hasWarning?: boolean;
|
|
7
|
+
isReadOnly?: boolean;
|
|
8
|
+
readOnly?: boolean;
|
|
9
|
+
};
|
|
10
|
+
declare const getInputStyles: (props: TInputProps, theme?: Theme | undefined) => import("@emotion/utils").SerializedStyles;
|
|
11
|
+
export { getInputStyles };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: "
|
|
2
|
-
export default _default;
|
|
1
|
+
declare const _default: "__@UI_KIT_PACKAGE/VERSION_OF_RELEASE__";
|
|
2
|
+
export default _default;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@commercetools-uikit/input-utils",
|
|
3
3
|
"description": "Utilities for working with input components.",
|
|
4
|
-
"version": "12.2.
|
|
4
|
+
"version": "12.2.6",
|
|
5
5
|
"bugs": "https://github.com/commercetools/ui-kit/issues",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -11,7 +11,6 @@
|
|
|
11
11
|
"homepage": "https://uikit.commercetools.com",
|
|
12
12
|
"keywords": ["javascript", "design system", "react", "uikit"],
|
|
13
13
|
"license": "MIT",
|
|
14
|
-
"private": false,
|
|
15
14
|
"publishConfig": {
|
|
16
15
|
"access": "public"
|
|
17
16
|
},
|
|
@@ -19,16 +18,13 @@
|
|
|
19
18
|
"main": "dist/commercetools-uikit-input-utils.cjs.js",
|
|
20
19
|
"module": "dist/commercetools-uikit-input-utils.esm.js",
|
|
21
20
|
"files": ["dist"],
|
|
22
|
-
"scripts": {
|
|
23
|
-
"prepare": "../../../../scripts/version.js replace"
|
|
24
|
-
},
|
|
25
21
|
"dependencies": {
|
|
26
|
-
"@babel/runtime": "7.
|
|
27
|
-
"@babel/runtime-corejs3": "7.
|
|
28
|
-
"@commercetools-uikit/design-system": "12.2.
|
|
29
|
-
"@commercetools-uikit/flat-button": "12.2.
|
|
30
|
-
"@commercetools-uikit/icons": "12.2.
|
|
31
|
-
"@commercetools-uikit/utils": "12.2.
|
|
22
|
+
"@babel/runtime": "7.16.3",
|
|
23
|
+
"@babel/runtime-corejs3": "7.16.3",
|
|
24
|
+
"@commercetools-uikit/design-system": "12.2.5",
|
|
25
|
+
"@commercetools-uikit/flat-button": "12.2.5",
|
|
26
|
+
"@commercetools-uikit/icons": "12.2.6",
|
|
27
|
+
"@commercetools-uikit/utils": "12.2.5",
|
|
32
28
|
"@emotion/react": "^11.4.0",
|
|
33
29
|
"prop-types": "15.7.2",
|
|
34
30
|
"react-required-if": "1.0.3",
|
|
@@ -36,7 +32,7 @@
|
|
|
36
32
|
},
|
|
37
33
|
"devDependencies": {
|
|
38
34
|
"react": "17.0.2",
|
|
39
|
-
"react-intl": "5.
|
|
35
|
+
"react-intl": "5.21.2"
|
|
40
36
|
},
|
|
41
37
|
"peerDependencies": {
|
|
42
38
|
"react": "17.x",
|