@commercetools-uikit/rich-text-input 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.
|
@@ -3,7 +3,15 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var _Reflect$construct = require('@babel/runtime-corejs3/core-js-stable/reflect/construct');
|
|
6
|
-
var
|
|
6
|
+
var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
|
|
7
|
+
var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
|
|
8
|
+
var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
|
|
9
|
+
var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
|
|
10
|
+
var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
|
|
11
|
+
var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
|
|
12
|
+
var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
|
|
13
|
+
var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
|
|
14
|
+
var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
|
|
7
15
|
var _classCallCheck = require('@babel/runtime-corejs3/helpers/classCallCheck');
|
|
8
16
|
var _createClass = require('@babel/runtime-corejs3/helpers/createClass');
|
|
9
17
|
var _inherits = require('@babel/runtime-corejs3/helpers/inherits');
|
|
@@ -11,22 +19,13 @@ var _possibleConstructorReturn = require('@babel/runtime-corejs3/helpers/possibl
|
|
|
11
19
|
var _getPrototypeOf = require('@babel/runtime-corejs3/helpers/getPrototypeOf');
|
|
12
20
|
var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
|
|
13
21
|
var _setTimeout = require('@babel/runtime-corejs3/core-js-stable/set-timeout');
|
|
14
|
-
var
|
|
22
|
+
var react = require('react');
|
|
15
23
|
var PropTypes = require('prop-types');
|
|
16
24
|
var requiredIf = require('react-required-if');
|
|
17
25
|
var slateReact = require('slate-react');
|
|
18
26
|
var pick = require('lodash/pick');
|
|
19
27
|
var utils = require('@commercetools-uikit/utils');
|
|
20
28
|
var richTextUtils = require('@commercetools-uikit/rich-text-utils');
|
|
21
|
-
var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
|
|
22
|
-
var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
|
|
23
|
-
var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
|
|
24
|
-
var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
|
|
25
|
-
var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
|
|
26
|
-
var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
|
|
27
|
-
var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
|
|
28
|
-
var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
|
|
29
|
-
var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
|
|
30
29
|
var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
|
|
31
30
|
var reactIntl = require('react-intl');
|
|
32
31
|
var CollapsibleMotion = require('@commercetools-uikit/collapsible-motion');
|
|
@@ -37,17 +36,11 @@ var Constraints = require('@commercetools-uikit/constraints');
|
|
|
37
36
|
var FlatButton = require('@commercetools-uikit/flat-button');
|
|
38
37
|
var inputUtils = require('@commercetools-uikit/input-utils');
|
|
39
38
|
var _styled = require('@emotion/styled/base');
|
|
40
|
-
var
|
|
39
|
+
var jsxRuntime = require('@emotion/react/jsx-runtime');
|
|
41
40
|
|
|
42
41
|
function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
|
|
43
42
|
|
|
44
43
|
var _Reflect$construct__default = /*#__PURE__*/_interopDefault(_Reflect$construct);
|
|
45
|
-
var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
|
|
46
|
-
var _setTimeout__default = /*#__PURE__*/_interopDefault(_setTimeout);
|
|
47
|
-
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
48
|
-
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
|
|
49
|
-
var requiredIf__default = /*#__PURE__*/_interopDefault(requiredIf);
|
|
50
|
-
var pick__default = /*#__PURE__*/_interopDefault(pick);
|
|
51
44
|
var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
|
|
52
45
|
var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
|
|
53
46
|
var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
|
|
@@ -56,6 +49,11 @@ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachIns
|
|
|
56
49
|
var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
|
|
57
50
|
var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
|
|
58
51
|
var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
|
|
52
|
+
var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
|
|
53
|
+
var _setTimeout__default = /*#__PURE__*/_interopDefault(_setTimeout);
|
|
54
|
+
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
|
|
55
|
+
var requiredIf__default = /*#__PURE__*/_interopDefault(requiredIf);
|
|
56
|
+
var pick__default = /*#__PURE__*/_interopDefault(pick);
|
|
59
57
|
var CollapsibleMotion__default = /*#__PURE__*/_interopDefault(CollapsibleMotion);
|
|
60
58
|
var Stack__default = /*#__PURE__*/_interopDefault(Stack);
|
|
61
59
|
var Constraints__default = /*#__PURE__*/_interopDefault(Constraints);
|
|
@@ -63,31 +61,31 @@ var FlatButton__default = /*#__PURE__*/_interopDefault(FlatButton);
|
|
|
63
61
|
var _styled__default = /*#__PURE__*/_interopDefault(_styled);
|
|
64
62
|
|
|
65
63
|
/* eslint-disable import/prefer-default-export */
|
|
66
|
-
var EditorWrapper = _styled__default[
|
|
64
|
+
var EditorWrapper = _styled__default["default"]("div", process.env.NODE_ENV === "production" ? {
|
|
67
65
|
target: "e125ents0"
|
|
68
66
|
} : {
|
|
69
67
|
target: "e125ents0",
|
|
70
68
|
label: "EditorWrapper"
|
|
71
69
|
})("align-self:stretch;cursor:", function (props) {
|
|
72
70
|
return props.isDisabled ? 'not-allowed' : 'inherit';
|
|
73
|
-
}, ";");
|
|
71
|
+
}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImVkaXRvci5zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBR2dDIiwiZmlsZSI6ImVkaXRvci5zdHlsZXMuanMiLCJzb3VyY2VzQ29udGVudCI6WyIvKiBlc2xpbnQtZGlzYWJsZSBpbXBvcnQvcHJlZmVyLWRlZmF1bHQtZXhwb3J0ICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmNvbnN0IEVkaXRvcldyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBhbGlnbi1zZWxmOiBzdHJldGNoO1xuICBjdXJzb3I6ICR7KHByb3BzKSA9PiAocHJvcHMuaXNEaXNhYmxlZCA/ICdub3QtYWxsb3dlZCcgOiAnaW5oZXJpdCcpfTtcbmA7XG5cbmV4cG9ydCB7IEVkaXRvcldyYXBwZXIgfTtcbiJdfQ== */"));
|
|
74
72
|
|
|
75
|
-
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default[
|
|
73
|
+
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; }
|
|
76
74
|
|
|
77
|
-
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[
|
|
75
|
+
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; }
|
|
78
76
|
var COLLAPSED_HEIGHT = 32;
|
|
79
77
|
|
|
80
78
|
var Editor = function Editor(props) {
|
|
81
79
|
var intl = reactIntl.useIntl();
|
|
82
|
-
var ref =
|
|
80
|
+
var ref = react.useRef();
|
|
83
81
|
var prevIsFocused = hooks.usePrevious(props.editor.value.selection.isFocused);
|
|
84
82
|
|
|
85
|
-
var
|
|
86
|
-
|
|
87
|
-
renderToggleButton =
|
|
88
|
-
setRenderToggleButton =
|
|
83
|
+
var _useState = react.useState(false),
|
|
84
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
85
|
+
renderToggleButton = _useState2[0],
|
|
86
|
+
setRenderToggleButton = _useState2[1];
|
|
89
87
|
|
|
90
|
-
var updateRenderToggleButton =
|
|
88
|
+
var updateRenderToggleButton = react.useCallback(function () {
|
|
91
89
|
var doesExceedCollapsedHeightLimit = ref.current.clientHeight > COLLAPSED_HEIGHT;
|
|
92
90
|
|
|
93
91
|
if (doesExceedCollapsedHeightLimit && !renderToggleButton) {
|
|
@@ -98,110 +96,121 @@ var Editor = function Editor(props) {
|
|
|
98
96
|
setRenderToggleButton(false);
|
|
99
97
|
}
|
|
100
98
|
}, [setRenderToggleButton, renderToggleButton]);
|
|
101
|
-
|
|
99
|
+
react.useEffect(function () {
|
|
102
100
|
updateRenderToggleButton();
|
|
103
101
|
}, [props.editor.value.document, updateRenderToggleButton]);
|
|
104
|
-
return
|
|
102
|
+
return jsxRuntime.jsx(CollapsibleMotion__default["default"], {
|
|
105
103
|
minHeight: COLLAPSED_HEIGHT,
|
|
106
|
-
isDefaultClosed: !props.defaultExpandMultilineText
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
104
|
+
isDefaultClosed: !props.defaultExpandMultilineText,
|
|
105
|
+
children: function children(_ref) {
|
|
106
|
+
var isOpen = _ref.isOpen,
|
|
107
|
+
toggle = _ref.toggle,
|
|
108
|
+
containerStyles = _ref.containerStyles,
|
|
109
|
+
registerContentNode = _ref.registerContentNode;
|
|
110
|
+
|
|
111
|
+
// opens the input if it regains focus and it's closed
|
|
112
|
+
if (prevIsFocused !== props.editor.value.selection.isFocused && props.editor.value.selection.isFocused && !isOpen) {
|
|
113
|
+
toggle();
|
|
114
|
+
}
|
|
117
115
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
116
|
+
return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
|
|
117
|
+
max: props.horizontalConstraint,
|
|
118
|
+
children: jsxRuntime.jsxs(Stack__default["default"], {
|
|
119
|
+
scale: "xs",
|
|
120
|
+
alignItems: "flex-end",
|
|
121
|
+
children: [jsxRuntime.jsx(EditorWrapper, {
|
|
122
|
+
isDisabled: props.isDisabled,
|
|
123
|
+
isReadOnly: props.isReadOnly,
|
|
124
|
+
children: jsxRuntime.jsx(richTextUtils.RichTextBody, {
|
|
125
|
+
ref: {
|
|
126
|
+
containerRef: ref,
|
|
127
|
+
registerContentNode: registerContentNode
|
|
128
|
+
},
|
|
129
|
+
hasError: props.hasError,
|
|
130
|
+
isDisabled: props.isDisabled,
|
|
131
|
+
hasWarning: props.hasWarning,
|
|
132
|
+
isReadOnly: props.isReadOnly,
|
|
133
|
+
showExpandIcon: props.showExpandIcon,
|
|
134
|
+
onClickExpand: props.onClickExpand,
|
|
135
|
+
editor: props.editor,
|
|
136
|
+
containerStyles: containerStyles,
|
|
137
|
+
children: props.children
|
|
138
|
+
})
|
|
139
|
+
}), renderToggleButton && // <div>
|
|
140
|
+
jsxRuntime.jsx(FlatButton__default["default"], {
|
|
141
|
+
onClick: toggle,
|
|
142
|
+
label: isOpen ? intl.formatMessage(inputUtils.messagesMultilineInput.collapse) : intl.formatMessage(inputUtils.messagesMultilineInput.expand),
|
|
143
|
+
icon: isOpen ? jsxRuntime.jsx(icons.AngleUpIcon, {
|
|
144
|
+
size: "small"
|
|
145
|
+
}) : jsxRuntime.jsx(icons.AngleDownIcon, {
|
|
146
|
+
size: "small"
|
|
147
|
+
})
|
|
148
|
+
}) // </div>
|
|
149
|
+
]
|
|
150
|
+
})
|
|
151
|
+
});
|
|
152
|
+
}
|
|
150
153
|
});
|
|
151
154
|
}; // eslint-disable-next-line react/display-name
|
|
152
155
|
|
|
153
156
|
|
|
154
157
|
var renderEditor = function renderEditor(props, editor, next) {
|
|
155
158
|
var internalId = "".concat(props.id, "__internal__id");
|
|
156
|
-
var children = /*#__PURE__*/
|
|
159
|
+
var children = /*#__PURE__*/react.cloneElement(next(), {
|
|
157
160
|
id: internalId
|
|
158
161
|
});
|
|
159
162
|
var isFocused = props.editor.value.selection.isFocused;
|
|
160
163
|
|
|
161
|
-
var passedProps = _objectSpread(_objectSpread({
|
|
164
|
+
var passedProps = _objectSpread$1(_objectSpread$1({
|
|
162
165
|
name: props.name,
|
|
163
166
|
id: props.id,
|
|
164
167
|
isReadOnly: props.readOnly,
|
|
165
168
|
isDisabled: props.disabled
|
|
166
|
-
}, pick__default[
|
|
169
|
+
}, pick__default["default"](props.options, ['horizontalConstraint', 'defaultExpandMultilineText', 'showExpandIcon', 'onClickExpand', 'hasError', 'hasWarning'])), utils.filterDataAttributes(props));
|
|
167
170
|
|
|
168
|
-
return
|
|
171
|
+
return jsxRuntime.jsxs(Editor, _objectSpread$1(_objectSpread$1({
|
|
169
172
|
editor: editor
|
|
170
|
-
}, passedProps),
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
173
|
+
}, passedProps), {}, {
|
|
174
|
+
children: [children, jsxRuntime.jsx(richTextUtils.HiddenInput, {
|
|
175
|
+
isFocused: isFocused,
|
|
176
|
+
handleFocus: editor.focus,
|
|
177
|
+
id: props.id,
|
|
178
|
+
disabled: props.disabled,
|
|
179
|
+
readOnly: props.readOnly
|
|
180
|
+
})]
|
|
176
181
|
}));
|
|
177
182
|
};
|
|
178
183
|
|
|
179
184
|
var sharedProps = process.env.NODE_ENV !== "production" ? {
|
|
180
|
-
id: PropTypes__default[
|
|
181
|
-
name: PropTypes__default[
|
|
182
|
-
placeholder: PropTypes__default[
|
|
183
|
-
disabled: PropTypes__default[
|
|
184
|
-
readOnly: PropTypes__default[
|
|
185
|
-
horizontalConstraint: PropTypes__default[
|
|
185
|
+
id: PropTypes__default["default"].string,
|
|
186
|
+
name: PropTypes__default["default"].string,
|
|
187
|
+
placeholder: PropTypes__default["default"].string,
|
|
188
|
+
disabled: PropTypes__default["default"].bool,
|
|
189
|
+
readOnly: PropTypes__default["default"].bool,
|
|
190
|
+
horizontalConstraint: PropTypes__default["default"].oneOf([7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 'scale', 'auto'])
|
|
186
191
|
} : {};
|
|
187
192
|
Editor.displayName = 'Editor';
|
|
188
|
-
Editor.propTypes = process.env.NODE_ENV !== "production" ? _objectSpread(_objectSpread({}, sharedProps), {}, {
|
|
189
|
-
editor: PropTypes__default[
|
|
193
|
+
Editor.propTypes = process.env.NODE_ENV !== "production" ? _objectSpread$1(_objectSpread$1({}, sharedProps), {}, {
|
|
194
|
+
editor: PropTypes__default["default"].any
|
|
190
195
|
}) : {};
|
|
191
|
-
renderEditor.propTypes = process.env.NODE_ENV !== "production" ? _objectSpread(_objectSpread({}, sharedProps), {}, {
|
|
192
|
-
options: PropTypes__default[
|
|
193
|
-
hasWarning: PropTypes__default[
|
|
194
|
-
hasError: PropTypes__default[
|
|
196
|
+
renderEditor.propTypes = process.env.NODE_ENV !== "production" ? _objectSpread$1(_objectSpread$1({}, sharedProps), {}, {
|
|
197
|
+
options: PropTypes__default["default"].shape({
|
|
198
|
+
hasWarning: PropTypes__default["default"].bool,
|
|
199
|
+
hasError: PropTypes__default["default"].bool
|
|
195
200
|
})
|
|
196
201
|
}) : {};
|
|
197
202
|
var renderEditor$1 = renderEditor;
|
|
198
203
|
|
|
199
|
-
function
|
|
204
|
+
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; }
|
|
205
|
+
|
|
206
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(source), true)).call(_context2, 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 _context3; _forEachInstanceProperty__default["default"](_context3 = ownKeys(Object(source))).call(_context3, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
|
|
207
|
+
|
|
208
|
+
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default["default"](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
200
209
|
|
|
201
|
-
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct__default[
|
|
210
|
+
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct__default["default"]) return false; if (_Reflect$construct__default["default"].sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
202
211
|
|
|
203
|
-
var RichTextInput = /*#__PURE__*/function (
|
|
204
|
-
_inherits(RichTextInput,
|
|
212
|
+
var RichTextInput = /*#__PURE__*/function (_PureComponent) {
|
|
213
|
+
_inherits(RichTextInput, _PureComponent);
|
|
205
214
|
|
|
206
215
|
var _super = _createSuper(RichTextInput);
|
|
207
216
|
|
|
@@ -216,7 +225,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
216
225
|
args[_key] = arguments[_key];
|
|
217
226
|
}
|
|
218
227
|
|
|
219
|
-
_this = _super.call.apply(_super, _concatInstanceProperty__default[
|
|
228
|
+
_this = _super.call.apply(_super, _concatInstanceProperty__default["default"](_context = [this]).call(_context, args));
|
|
220
229
|
_this.serializedValue = _this.props.value || '';
|
|
221
230
|
_this.internalSlateValue = richTextUtils.html.deserialize(_this.props.value || '');
|
|
222
231
|
|
|
@@ -262,7 +271,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
262
271
|
}
|
|
263
272
|
};
|
|
264
273
|
|
|
265
|
-
_setTimeout__default[
|
|
274
|
+
_setTimeout__default["default"](function () {
|
|
266
275
|
return _this.props.onBlur(fakeEvent);
|
|
267
276
|
}, 0);
|
|
268
277
|
}
|
|
@@ -279,7 +288,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
279
288
|
}
|
|
280
289
|
};
|
|
281
290
|
|
|
282
|
-
_setTimeout__default[
|
|
291
|
+
_setTimeout__default["default"](function () {
|
|
283
292
|
return _this.props.onFocus(fakeEvent);
|
|
284
293
|
}, 0);
|
|
285
294
|
}
|
|
@@ -308,7 +317,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
308
317
|
}, {
|
|
309
318
|
key: "render",
|
|
310
319
|
value: function render() {
|
|
311
|
-
return
|
|
320
|
+
return jsxRuntime.jsx(slateReact.Editor, _objectSpread(_objectSpread({}, utils.filterDataAttributes(this.props)), {}, {
|
|
312
321
|
autoFocus: this.props.isAutofocussed,
|
|
313
322
|
id: this.props.id,
|
|
314
323
|
name: this.props.name,
|
|
@@ -320,7 +329,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
320
329
|
// warning in the console,
|
|
321
330
|
// so instead we pass our extra this.props through this `options` prop.
|
|
322
331
|
,
|
|
323
|
-
options: pick__default[
|
|
332
|
+
options: pick__default["default"](this.props, ['horizontalConstraint', 'defaultExpandMultilineText', 'hasWarning', 'hasError', 'placeholder', 'showExpandIcon', 'onClickExpand']),
|
|
324
333
|
onChange: this.onValueChange,
|
|
325
334
|
plugins: richTextUtils.richTextPlugins,
|
|
326
335
|
renderEditor: renderEditor$1
|
|
@@ -329,7 +338,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
329
338
|
}]);
|
|
330
339
|
|
|
331
340
|
return RichTextInput;
|
|
332
|
-
}(
|
|
341
|
+
}(react.PureComponent);
|
|
333
342
|
|
|
334
343
|
RichTextInput.defaultProps = {
|
|
335
344
|
defaultExpandMultilineText: false,
|
|
@@ -345,31 +354,31 @@ RichTextInput.isTouched = function (touched) {
|
|
|
345
354
|
};
|
|
346
355
|
|
|
347
356
|
RichTextInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
348
|
-
isAutofocussed: PropTypes__default[
|
|
349
|
-
defaultExpandMultilineText: PropTypes__default[
|
|
350
|
-
hasError: PropTypes__default[
|
|
351
|
-
hasWarning: PropTypes__default[
|
|
352
|
-
id: PropTypes__default[
|
|
353
|
-
name: PropTypes__default[
|
|
354
|
-
placeholder: PropTypes__default[
|
|
355
|
-
isDisabled: PropTypes__default[
|
|
356
|
-
isReadOnly: PropTypes__default[
|
|
357
|
-
horizontalConstraint: PropTypes__default[
|
|
358
|
-
onChange: requiredIf__default[
|
|
357
|
+
isAutofocussed: PropTypes__default["default"].bool,
|
|
358
|
+
defaultExpandMultilineText: PropTypes__default["default"].bool,
|
|
359
|
+
hasError: PropTypes__default["default"].bool,
|
|
360
|
+
hasWarning: PropTypes__default["default"].bool,
|
|
361
|
+
id: PropTypes__default["default"].string,
|
|
362
|
+
name: PropTypes__default["default"].string,
|
|
363
|
+
placeholder: PropTypes__default["default"].string.isRequired,
|
|
364
|
+
isDisabled: PropTypes__default["default"].bool,
|
|
365
|
+
isReadOnly: PropTypes__default["default"].bool,
|
|
366
|
+
horizontalConstraint: PropTypes__default["default"].oneOf([7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 'scale', 'auto']),
|
|
367
|
+
onChange: requiredIf__default["default"](PropTypes__default["default"].func, function (props) {
|
|
359
368
|
return !props.isReadOnly;
|
|
360
369
|
}),
|
|
361
|
-
onFocus: PropTypes__default[
|
|
362
|
-
onBlur: PropTypes__default[
|
|
363
|
-
value: PropTypes__default[
|
|
364
|
-
showExpandIcon: PropTypes__default[
|
|
365
|
-
onClickExpand: requiredIf__default[
|
|
370
|
+
onFocus: PropTypes__default["default"].func,
|
|
371
|
+
onBlur: PropTypes__default["default"].func,
|
|
372
|
+
value: PropTypes__default["default"].string,
|
|
373
|
+
showExpandIcon: PropTypes__default["default"].bool.isRequired,
|
|
374
|
+
onClickExpand: requiredIf__default["default"](PropTypes__default["default"].func, function (props) {
|
|
366
375
|
return props.showExpandIcon;
|
|
367
376
|
})
|
|
368
377
|
} : {};
|
|
369
378
|
var RichTextInput$1 = RichTextInput;
|
|
370
379
|
|
|
371
|
-
// NOTE: This string will be replaced
|
|
372
|
-
var version =
|
|
380
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
381
|
+
var version = "12.2.6";
|
|
373
382
|
|
|
374
|
-
exports[
|
|
383
|
+
exports["default"] = RichTextInput$1;
|
|
375
384
|
exports.version = version;
|
|
@@ -3,7 +3,15 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var _Reflect$construct = require('@babel/runtime-corejs3/core-js-stable/reflect/construct');
|
|
6
|
-
var
|
|
6
|
+
var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
|
|
7
|
+
var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
|
|
8
|
+
var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
|
|
9
|
+
var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
|
|
10
|
+
var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
|
|
11
|
+
var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
|
|
12
|
+
var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
|
|
13
|
+
var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
|
|
14
|
+
var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
|
|
7
15
|
var _classCallCheck = require('@babel/runtime-corejs3/helpers/classCallCheck');
|
|
8
16
|
var _createClass = require('@babel/runtime-corejs3/helpers/createClass');
|
|
9
17
|
var _inherits = require('@babel/runtime-corejs3/helpers/inherits');
|
|
@@ -11,22 +19,13 @@ var _possibleConstructorReturn = require('@babel/runtime-corejs3/helpers/possibl
|
|
|
11
19
|
var _getPrototypeOf = require('@babel/runtime-corejs3/helpers/getPrototypeOf');
|
|
12
20
|
var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
|
|
13
21
|
var _setTimeout = require('@babel/runtime-corejs3/core-js-stable/set-timeout');
|
|
14
|
-
var
|
|
22
|
+
var react = require('react');
|
|
15
23
|
require('prop-types');
|
|
16
24
|
require('react-required-if');
|
|
17
25
|
var slateReact = require('slate-react');
|
|
18
26
|
var pick = require('lodash/pick');
|
|
19
27
|
var utils = require('@commercetools-uikit/utils');
|
|
20
28
|
var richTextUtils = require('@commercetools-uikit/rich-text-utils');
|
|
21
|
-
var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
|
|
22
|
-
var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
|
|
23
|
-
var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
|
|
24
|
-
var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
|
|
25
|
-
var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
|
|
26
|
-
var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
|
|
27
|
-
var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
|
|
28
|
-
var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
|
|
29
|
-
var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
|
|
30
29
|
var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
|
|
31
30
|
var reactIntl = require('react-intl');
|
|
32
31
|
var CollapsibleMotion = require('@commercetools-uikit/collapsible-motion');
|
|
@@ -37,15 +36,11 @@ var Constraints = require('@commercetools-uikit/constraints');
|
|
|
37
36
|
var FlatButton = require('@commercetools-uikit/flat-button');
|
|
38
37
|
var inputUtils = require('@commercetools-uikit/input-utils');
|
|
39
38
|
var _styled = require('@emotion/styled/base');
|
|
40
|
-
var
|
|
39
|
+
var jsxRuntime = require('@emotion/react/jsx-runtime');
|
|
41
40
|
|
|
42
41
|
function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
|
|
43
42
|
|
|
44
43
|
var _Reflect$construct__default = /*#__PURE__*/_interopDefault(_Reflect$construct);
|
|
45
|
-
var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
|
|
46
|
-
var _setTimeout__default = /*#__PURE__*/_interopDefault(_setTimeout);
|
|
47
|
-
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
48
|
-
var pick__default = /*#__PURE__*/_interopDefault(pick);
|
|
49
44
|
var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
|
|
50
45
|
var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
|
|
51
46
|
var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
|
|
@@ -54,6 +49,9 @@ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachIns
|
|
|
54
49
|
var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
|
|
55
50
|
var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
|
|
56
51
|
var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
|
|
52
|
+
var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
|
|
53
|
+
var _setTimeout__default = /*#__PURE__*/_interopDefault(_setTimeout);
|
|
54
|
+
var pick__default = /*#__PURE__*/_interopDefault(pick);
|
|
57
55
|
var CollapsibleMotion__default = /*#__PURE__*/_interopDefault(CollapsibleMotion);
|
|
58
56
|
var Stack__default = /*#__PURE__*/_interopDefault(Stack);
|
|
59
57
|
var Constraints__default = /*#__PURE__*/_interopDefault(Constraints);
|
|
@@ -61,28 +59,28 @@ var FlatButton__default = /*#__PURE__*/_interopDefault(FlatButton);
|
|
|
61
59
|
var _styled__default = /*#__PURE__*/_interopDefault(_styled);
|
|
62
60
|
|
|
63
61
|
/* eslint-disable import/prefer-default-export */
|
|
64
|
-
var EditorWrapper = _styled__default[
|
|
62
|
+
var EditorWrapper = _styled__default["default"]("div", {
|
|
65
63
|
target: "e125ents0"
|
|
66
64
|
} )("align-self:stretch;cursor:", function (props) {
|
|
67
65
|
return props.isDisabled ? 'not-allowed' : 'inherit';
|
|
68
|
-
}, ";");
|
|
66
|
+
}, ";" + ("" ));
|
|
69
67
|
|
|
70
|
-
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default[
|
|
68
|
+
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; }
|
|
71
69
|
|
|
72
|
-
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[
|
|
70
|
+
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; }
|
|
73
71
|
var COLLAPSED_HEIGHT = 32;
|
|
74
72
|
|
|
75
73
|
var Editor = function Editor(props) {
|
|
76
74
|
var intl = reactIntl.useIntl();
|
|
77
|
-
var ref =
|
|
75
|
+
var ref = react.useRef();
|
|
78
76
|
var prevIsFocused = hooks.usePrevious(props.editor.value.selection.isFocused);
|
|
79
77
|
|
|
80
|
-
var
|
|
81
|
-
|
|
82
|
-
renderToggleButton =
|
|
83
|
-
setRenderToggleButton =
|
|
78
|
+
var _useState = react.useState(false),
|
|
79
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
80
|
+
renderToggleButton = _useState2[0],
|
|
81
|
+
setRenderToggleButton = _useState2[1];
|
|
84
82
|
|
|
85
|
-
var updateRenderToggleButton =
|
|
83
|
+
var updateRenderToggleButton = react.useCallback(function () {
|
|
86
84
|
var doesExceedCollapsedHeightLimit = ref.current.clientHeight > COLLAPSED_HEIGHT;
|
|
87
85
|
|
|
88
86
|
if (doesExceedCollapsedHeightLimit && !renderToggleButton) {
|
|
@@ -93,81 +91,88 @@ var Editor = function Editor(props) {
|
|
|
93
91
|
setRenderToggleButton(false);
|
|
94
92
|
}
|
|
95
93
|
}, [setRenderToggleButton, renderToggleButton]);
|
|
96
|
-
|
|
94
|
+
react.useEffect(function () {
|
|
97
95
|
updateRenderToggleButton();
|
|
98
96
|
}, [props.editor.value.document, updateRenderToggleButton]);
|
|
99
|
-
return
|
|
97
|
+
return jsxRuntime.jsx(CollapsibleMotion__default["default"], {
|
|
100
98
|
minHeight: COLLAPSED_HEIGHT,
|
|
101
|
-
isDefaultClosed: !props.defaultExpandMultilineText
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
99
|
+
isDefaultClosed: !props.defaultExpandMultilineText,
|
|
100
|
+
children: function children(_ref) {
|
|
101
|
+
var isOpen = _ref.isOpen,
|
|
102
|
+
toggle = _ref.toggle,
|
|
103
|
+
containerStyles = _ref.containerStyles,
|
|
104
|
+
registerContentNode = _ref.registerContentNode;
|
|
105
|
+
|
|
106
|
+
// opens the input if it regains focus and it's closed
|
|
107
|
+
if (prevIsFocused !== props.editor.value.selection.isFocused && props.editor.value.selection.isFocused && !isOpen) {
|
|
108
|
+
toggle();
|
|
109
|
+
}
|
|
112
110
|
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
111
|
+
return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
|
|
112
|
+
max: props.horizontalConstraint,
|
|
113
|
+
children: jsxRuntime.jsxs(Stack__default["default"], {
|
|
114
|
+
scale: "xs",
|
|
115
|
+
alignItems: "flex-end",
|
|
116
|
+
children: [jsxRuntime.jsx(EditorWrapper, {
|
|
117
|
+
isDisabled: props.isDisabled,
|
|
118
|
+
isReadOnly: props.isReadOnly,
|
|
119
|
+
children: jsxRuntime.jsx(richTextUtils.RichTextBody, {
|
|
120
|
+
ref: {
|
|
121
|
+
containerRef: ref,
|
|
122
|
+
registerContentNode: registerContentNode
|
|
123
|
+
},
|
|
124
|
+
hasError: props.hasError,
|
|
125
|
+
isDisabled: props.isDisabled,
|
|
126
|
+
hasWarning: props.hasWarning,
|
|
127
|
+
isReadOnly: props.isReadOnly,
|
|
128
|
+
showExpandIcon: props.showExpandIcon,
|
|
129
|
+
onClickExpand: props.onClickExpand,
|
|
130
|
+
editor: props.editor,
|
|
131
|
+
containerStyles: containerStyles,
|
|
132
|
+
children: props.children
|
|
133
|
+
})
|
|
134
|
+
}), renderToggleButton && // <div>
|
|
135
|
+
jsxRuntime.jsx(FlatButton__default["default"], {
|
|
136
|
+
onClick: toggle,
|
|
137
|
+
label: isOpen ? intl.formatMessage(inputUtils.messagesMultilineInput.collapse) : intl.formatMessage(inputUtils.messagesMultilineInput.expand),
|
|
138
|
+
icon: isOpen ? jsxRuntime.jsx(icons.AngleUpIcon, {
|
|
139
|
+
size: "small"
|
|
140
|
+
}) : jsxRuntime.jsx(icons.AngleDownIcon, {
|
|
141
|
+
size: "small"
|
|
142
|
+
})
|
|
143
|
+
}) // </div>
|
|
144
|
+
]
|
|
145
|
+
})
|
|
146
|
+
});
|
|
147
|
+
}
|
|
145
148
|
});
|
|
146
149
|
}; // eslint-disable-next-line react/display-name
|
|
147
150
|
|
|
148
151
|
|
|
149
152
|
var renderEditor = function renderEditor(props, editor, next) {
|
|
150
153
|
var internalId = "".concat(props.id, "__internal__id");
|
|
151
|
-
var children = /*#__PURE__*/
|
|
154
|
+
var children = /*#__PURE__*/react.cloneElement(next(), {
|
|
152
155
|
id: internalId
|
|
153
156
|
});
|
|
154
157
|
var isFocused = props.editor.value.selection.isFocused;
|
|
155
158
|
|
|
156
|
-
var passedProps = _objectSpread(_objectSpread({
|
|
159
|
+
var passedProps = _objectSpread$1(_objectSpread$1({
|
|
157
160
|
name: props.name,
|
|
158
161
|
id: props.id,
|
|
159
162
|
isReadOnly: props.readOnly,
|
|
160
163
|
isDisabled: props.disabled
|
|
161
|
-
}, pick__default[
|
|
164
|
+
}, pick__default["default"](props.options, ['horizontalConstraint', 'defaultExpandMultilineText', 'showExpandIcon', 'onClickExpand', 'hasError', 'hasWarning'])), utils.filterDataAttributes(props));
|
|
162
165
|
|
|
163
|
-
return
|
|
166
|
+
return jsxRuntime.jsxs(Editor, _objectSpread$1(_objectSpread$1({
|
|
164
167
|
editor: editor
|
|
165
|
-
}, passedProps),
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
168
|
+
}, passedProps), {}, {
|
|
169
|
+
children: [children, jsxRuntime.jsx(richTextUtils.HiddenInput, {
|
|
170
|
+
isFocused: isFocused,
|
|
171
|
+
handleFocus: editor.focus,
|
|
172
|
+
id: props.id,
|
|
173
|
+
disabled: props.disabled,
|
|
174
|
+
readOnly: props.readOnly
|
|
175
|
+
})]
|
|
171
176
|
}));
|
|
172
177
|
};
|
|
173
178
|
Editor.displayName = 'Editor';
|
|
@@ -175,12 +180,16 @@ Editor.propTypes = {};
|
|
|
175
180
|
renderEditor.propTypes = {};
|
|
176
181
|
var renderEditor$1 = renderEditor;
|
|
177
182
|
|
|
178
|
-
function
|
|
183
|
+
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; }
|
|
184
|
+
|
|
185
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(source), true)).call(_context2, 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 _context3; _forEachInstanceProperty__default["default"](_context3 = ownKeys(Object(source))).call(_context3, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
|
|
186
|
+
|
|
187
|
+
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default["default"](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
179
188
|
|
|
180
|
-
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct__default[
|
|
189
|
+
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct__default["default"]) return false; if (_Reflect$construct__default["default"].sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
181
190
|
|
|
182
|
-
var RichTextInput = /*#__PURE__*/function (
|
|
183
|
-
_inherits(RichTextInput,
|
|
191
|
+
var RichTextInput = /*#__PURE__*/function (_PureComponent) {
|
|
192
|
+
_inherits(RichTextInput, _PureComponent);
|
|
184
193
|
|
|
185
194
|
var _super = _createSuper(RichTextInput);
|
|
186
195
|
|
|
@@ -195,7 +204,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
195
204
|
args[_key] = arguments[_key];
|
|
196
205
|
}
|
|
197
206
|
|
|
198
|
-
_this = _super.call.apply(_super, _concatInstanceProperty__default[
|
|
207
|
+
_this = _super.call.apply(_super, _concatInstanceProperty__default["default"](_context = [this]).call(_context, args));
|
|
199
208
|
_this.serializedValue = _this.props.value || '';
|
|
200
209
|
_this.internalSlateValue = richTextUtils.html.deserialize(_this.props.value || '');
|
|
201
210
|
|
|
@@ -241,7 +250,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
241
250
|
}
|
|
242
251
|
};
|
|
243
252
|
|
|
244
|
-
_setTimeout__default[
|
|
253
|
+
_setTimeout__default["default"](function () {
|
|
245
254
|
return _this.props.onBlur(fakeEvent);
|
|
246
255
|
}, 0);
|
|
247
256
|
}
|
|
@@ -258,7 +267,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
258
267
|
}
|
|
259
268
|
};
|
|
260
269
|
|
|
261
|
-
_setTimeout__default[
|
|
270
|
+
_setTimeout__default["default"](function () {
|
|
262
271
|
return _this.props.onFocus(fakeEvent);
|
|
263
272
|
}, 0);
|
|
264
273
|
}
|
|
@@ -287,7 +296,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
287
296
|
}, {
|
|
288
297
|
key: "render",
|
|
289
298
|
value: function render() {
|
|
290
|
-
return
|
|
299
|
+
return jsxRuntime.jsx(slateReact.Editor, _objectSpread(_objectSpread({}, utils.filterDataAttributes(this.props)), {}, {
|
|
291
300
|
autoFocus: this.props.isAutofocussed,
|
|
292
301
|
id: this.props.id,
|
|
293
302
|
name: this.props.name,
|
|
@@ -299,7 +308,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
299
308
|
// warning in the console,
|
|
300
309
|
// so instead we pass our extra this.props through this `options` prop.
|
|
301
310
|
,
|
|
302
|
-
options: pick__default[
|
|
311
|
+
options: pick__default["default"](this.props, ['horizontalConstraint', 'defaultExpandMultilineText', 'hasWarning', 'hasError', 'placeholder', 'showExpandIcon', 'onClickExpand']),
|
|
303
312
|
onChange: this.onValueChange,
|
|
304
313
|
plugins: richTextUtils.richTextPlugins,
|
|
305
314
|
renderEditor: renderEditor$1
|
|
@@ -308,7 +317,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
308
317
|
}]);
|
|
309
318
|
|
|
310
319
|
return RichTextInput;
|
|
311
|
-
}(
|
|
320
|
+
}(react.PureComponent);
|
|
312
321
|
|
|
313
322
|
RichTextInput.defaultProps = {
|
|
314
323
|
defaultExpandMultilineText: false,
|
|
@@ -326,8 +335,8 @@ RichTextInput.isTouched = function (touched) {
|
|
|
326
335
|
RichTextInput.propTypes = {};
|
|
327
336
|
var RichTextInput$1 = RichTextInput;
|
|
328
337
|
|
|
329
|
-
// NOTE: This string will be replaced
|
|
330
|
-
var version =
|
|
338
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
339
|
+
var version = "12.2.6";
|
|
331
340
|
|
|
332
|
-
exports[
|
|
341
|
+
exports["default"] = RichTextInput$1;
|
|
333
342
|
exports.version = version;
|
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
import _Reflect$construct from '@babel/runtime-corejs3/core-js-stable/reflect/construct';
|
|
2
|
-
import
|
|
2
|
+
import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
|
|
3
|
+
import _Object$getOwnPropertySymbols from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
|
|
4
|
+
import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
|
|
5
|
+
import _Object$getOwnPropertyDescriptor from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor';
|
|
6
|
+
import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/for-each';
|
|
7
|
+
import _Object$getOwnPropertyDescriptors from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors';
|
|
8
|
+
import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/object/define-properties';
|
|
9
|
+
import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
|
|
10
|
+
import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
|
|
3
11
|
import _classCallCheck from '@babel/runtime-corejs3/helpers/esm/classCallCheck';
|
|
4
12
|
import _createClass from '@babel/runtime-corejs3/helpers/esm/createClass';
|
|
5
13
|
import _inherits from '@babel/runtime-corejs3/helpers/esm/inherits';
|
|
@@ -7,22 +15,13 @@ import _possibleConstructorReturn from '@babel/runtime-corejs3/helpers/esm/possi
|
|
|
7
15
|
import _getPrototypeOf from '@babel/runtime-corejs3/helpers/esm/getPrototypeOf';
|
|
8
16
|
import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
|
|
9
17
|
import _setTimeout from '@babel/runtime-corejs3/core-js-stable/set-timeout';
|
|
10
|
-
import
|
|
18
|
+
import { cloneElement, useRef, useState, useCallback, useEffect, PureComponent } from 'react';
|
|
11
19
|
import PropTypes from 'prop-types';
|
|
12
20
|
import requiredIf from 'react-required-if';
|
|
13
21
|
import { Editor as Editor$1 } from 'slate-react';
|
|
14
22
|
import pick from 'lodash/pick';
|
|
15
23
|
import { filterDataAttributes } from '@commercetools-uikit/utils';
|
|
16
24
|
import { HiddenInput, RichTextBody, html, richTextPlugins, isEmpty } from '@commercetools-uikit/rich-text-utils';
|
|
17
|
-
import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
|
|
18
|
-
import _Object$getOwnPropertySymbols from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
|
|
19
|
-
import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
|
|
20
|
-
import _Object$getOwnPropertyDescriptor from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor';
|
|
21
|
-
import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/for-each';
|
|
22
|
-
import _Object$getOwnPropertyDescriptors from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors';
|
|
23
|
-
import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/object/define-properties';
|
|
24
|
-
import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
|
|
25
|
-
import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
|
|
26
25
|
import _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
|
|
27
26
|
import { useIntl } from 'react-intl';
|
|
28
27
|
import CollapsibleMotion from '@commercetools-uikit/collapsible-motion';
|
|
@@ -33,7 +32,7 @@ import Constraints from '@commercetools-uikit/constraints';
|
|
|
33
32
|
import FlatButton from '@commercetools-uikit/flat-button';
|
|
34
33
|
import { messagesMultilineInput } from '@commercetools-uikit/input-utils';
|
|
35
34
|
import _styled from '@emotion/styled/base';
|
|
36
|
-
import { jsx } from '@emotion/react';
|
|
35
|
+
import { jsxs, jsx } from '@emotion/react/jsx-runtime';
|
|
37
36
|
|
|
38
37
|
/* eslint-disable import/prefer-default-export */
|
|
39
38
|
var EditorWrapper = _styled("div", process.env.NODE_ENV === "production" ? {
|
|
@@ -43,24 +42,24 @@ var EditorWrapper = _styled("div", process.env.NODE_ENV === "production" ? {
|
|
|
43
42
|
label: "EditorWrapper"
|
|
44
43
|
})("align-self:stretch;cursor:", function (props) {
|
|
45
44
|
return props.isDisabled ? 'not-allowed' : 'inherit';
|
|
46
|
-
}, ";");
|
|
45
|
+
}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImVkaXRvci5zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBR2dDIiwiZmlsZSI6ImVkaXRvci5zdHlsZXMuanMiLCJzb3VyY2VzQ29udGVudCI6WyIvKiBlc2xpbnQtZGlzYWJsZSBpbXBvcnQvcHJlZmVyLWRlZmF1bHQtZXhwb3J0ICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmNvbnN0IEVkaXRvcldyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBhbGlnbi1zZWxmOiBzdHJldGNoO1xuICBjdXJzb3I6ICR7KHByb3BzKSA9PiAocHJvcHMuaXNEaXNhYmxlZCA/ICdub3QtYWxsb3dlZCcgOiAnaW5oZXJpdCcpfTtcbmA7XG5cbmV4cG9ydCB7IEVkaXRvcldyYXBwZXIgfTtcbiJdfQ== */"));
|
|
47
46
|
|
|
48
|
-
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; }
|
|
47
|
+
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; }
|
|
49
48
|
|
|
50
|
-
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; }
|
|
49
|
+
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; }
|
|
51
50
|
var COLLAPSED_HEIGHT = 32;
|
|
52
51
|
|
|
53
52
|
var Editor = function Editor(props) {
|
|
54
53
|
var intl = useIntl();
|
|
55
|
-
var ref =
|
|
54
|
+
var ref = useRef();
|
|
56
55
|
var prevIsFocused = usePrevious(props.editor.value.selection.isFocused);
|
|
57
56
|
|
|
58
|
-
var
|
|
59
|
-
|
|
60
|
-
renderToggleButton =
|
|
61
|
-
setRenderToggleButton =
|
|
57
|
+
var _useState = useState(false),
|
|
58
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
59
|
+
renderToggleButton = _useState2[0],
|
|
60
|
+
setRenderToggleButton = _useState2[1];
|
|
62
61
|
|
|
63
|
-
var updateRenderToggleButton =
|
|
62
|
+
var updateRenderToggleButton = useCallback(function () {
|
|
64
63
|
var doesExceedCollapsedHeightLimit = ref.current.clientHeight > COLLAPSED_HEIGHT;
|
|
65
64
|
|
|
66
65
|
if (doesExceedCollapsedHeightLimit && !renderToggleButton) {
|
|
@@ -71,81 +70,88 @@ var Editor = function Editor(props) {
|
|
|
71
70
|
setRenderToggleButton(false);
|
|
72
71
|
}
|
|
73
72
|
}, [setRenderToggleButton, renderToggleButton]);
|
|
74
|
-
|
|
73
|
+
useEffect(function () {
|
|
75
74
|
updateRenderToggleButton();
|
|
76
75
|
}, [props.editor.value.document, updateRenderToggleButton]);
|
|
77
76
|
return jsx(CollapsibleMotion, {
|
|
78
77
|
minHeight: COLLAPSED_HEIGHT,
|
|
79
|
-
isDefaultClosed: !props.defaultExpandMultilineText
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
78
|
+
isDefaultClosed: !props.defaultExpandMultilineText,
|
|
79
|
+
children: function children(_ref) {
|
|
80
|
+
var isOpen = _ref.isOpen,
|
|
81
|
+
toggle = _ref.toggle,
|
|
82
|
+
containerStyles = _ref.containerStyles,
|
|
83
|
+
registerContentNode = _ref.registerContentNode;
|
|
84
|
+
|
|
85
|
+
// opens the input if it regains focus and it's closed
|
|
86
|
+
if (prevIsFocused !== props.editor.value.selection.isFocused && props.editor.value.selection.isFocused && !isOpen) {
|
|
87
|
+
toggle();
|
|
88
|
+
}
|
|
90
89
|
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
90
|
+
return jsx(Constraints.Horizontal, {
|
|
91
|
+
max: props.horizontalConstraint,
|
|
92
|
+
children: jsxs(Stack, {
|
|
93
|
+
scale: "xs",
|
|
94
|
+
alignItems: "flex-end",
|
|
95
|
+
children: [jsx(EditorWrapper, {
|
|
96
|
+
isDisabled: props.isDisabled,
|
|
97
|
+
isReadOnly: props.isReadOnly,
|
|
98
|
+
children: jsx(RichTextBody, {
|
|
99
|
+
ref: {
|
|
100
|
+
containerRef: ref,
|
|
101
|
+
registerContentNode: registerContentNode
|
|
102
|
+
},
|
|
103
|
+
hasError: props.hasError,
|
|
104
|
+
isDisabled: props.isDisabled,
|
|
105
|
+
hasWarning: props.hasWarning,
|
|
106
|
+
isReadOnly: props.isReadOnly,
|
|
107
|
+
showExpandIcon: props.showExpandIcon,
|
|
108
|
+
onClickExpand: props.onClickExpand,
|
|
109
|
+
editor: props.editor,
|
|
110
|
+
containerStyles: containerStyles,
|
|
111
|
+
children: props.children
|
|
112
|
+
})
|
|
113
|
+
}), renderToggleButton && // <div>
|
|
114
|
+
jsx(FlatButton, {
|
|
115
|
+
onClick: toggle,
|
|
116
|
+
label: isOpen ? intl.formatMessage(messagesMultilineInput.collapse) : intl.formatMessage(messagesMultilineInput.expand),
|
|
117
|
+
icon: isOpen ? jsx(AngleUpIcon, {
|
|
118
|
+
size: "small"
|
|
119
|
+
}) : jsx(AngleDownIcon, {
|
|
120
|
+
size: "small"
|
|
121
|
+
})
|
|
122
|
+
}) // </div>
|
|
123
|
+
]
|
|
124
|
+
})
|
|
125
|
+
});
|
|
126
|
+
}
|
|
123
127
|
});
|
|
124
128
|
}; // eslint-disable-next-line react/display-name
|
|
125
129
|
|
|
126
130
|
|
|
127
131
|
var renderEditor = function renderEditor(props, editor, next) {
|
|
128
132
|
var internalId = "".concat(props.id, "__internal__id");
|
|
129
|
-
var children = /*#__PURE__*/
|
|
133
|
+
var children = /*#__PURE__*/cloneElement(next(), {
|
|
130
134
|
id: internalId
|
|
131
135
|
});
|
|
132
136
|
var isFocused = props.editor.value.selection.isFocused;
|
|
133
137
|
|
|
134
|
-
var passedProps = _objectSpread(_objectSpread({
|
|
138
|
+
var passedProps = _objectSpread$1(_objectSpread$1({
|
|
135
139
|
name: props.name,
|
|
136
140
|
id: props.id,
|
|
137
141
|
isReadOnly: props.readOnly,
|
|
138
142
|
isDisabled: props.disabled
|
|
139
143
|
}, pick(props.options, ['horizontalConstraint', 'defaultExpandMultilineText', 'showExpandIcon', 'onClickExpand', 'hasError', 'hasWarning'])), filterDataAttributes(props));
|
|
140
144
|
|
|
141
|
-
return
|
|
145
|
+
return jsxs(Editor, _objectSpread$1(_objectSpread$1({
|
|
142
146
|
editor: editor
|
|
143
|
-
}, passedProps),
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
147
|
+
}, passedProps), {}, {
|
|
148
|
+
children: [children, jsx(HiddenInput, {
|
|
149
|
+
isFocused: isFocused,
|
|
150
|
+
handleFocus: editor.focus,
|
|
151
|
+
id: props.id,
|
|
152
|
+
disabled: props.disabled,
|
|
153
|
+
readOnly: props.readOnly
|
|
154
|
+
})]
|
|
149
155
|
}));
|
|
150
156
|
};
|
|
151
157
|
|
|
@@ -158,10 +164,10 @@ var sharedProps = process.env.NODE_ENV !== "production" ? {
|
|
|
158
164
|
horizontalConstraint: PropTypes.oneOf([7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 'scale', 'auto'])
|
|
159
165
|
} : {};
|
|
160
166
|
Editor.displayName = 'Editor';
|
|
161
|
-
Editor.propTypes = process.env.NODE_ENV !== "production" ? _objectSpread(_objectSpread({}, sharedProps), {}, {
|
|
167
|
+
Editor.propTypes = process.env.NODE_ENV !== "production" ? _objectSpread$1(_objectSpread$1({}, sharedProps), {}, {
|
|
162
168
|
editor: PropTypes.any
|
|
163
169
|
}) : {};
|
|
164
|
-
renderEditor.propTypes = process.env.NODE_ENV !== "production" ? _objectSpread(_objectSpread({}, sharedProps), {}, {
|
|
170
|
+
renderEditor.propTypes = process.env.NODE_ENV !== "production" ? _objectSpread$1(_objectSpread$1({}, sharedProps), {}, {
|
|
165
171
|
options: PropTypes.shape({
|
|
166
172
|
hasWarning: PropTypes.bool,
|
|
167
173
|
hasError: PropTypes.bool
|
|
@@ -169,12 +175,16 @@ renderEditor.propTypes = process.env.NODE_ENV !== "production" ? _objectSpread(_
|
|
|
169
175
|
}) : {};
|
|
170
176
|
var renderEditor$1 = renderEditor;
|
|
171
177
|
|
|
178
|
+
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; }
|
|
179
|
+
|
|
180
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context2; _forEachInstanceProperty(_context2 = ownKeys(Object(source), true)).call(_context2, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors) { _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)); } else { var _context3; _forEachInstanceProperty(_context3 = ownKeys(Object(source))).call(_context3, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
181
|
+
|
|
172
182
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
173
183
|
|
|
174
184
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct) return false; if (_Reflect$construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
175
185
|
|
|
176
|
-
var RichTextInput = /*#__PURE__*/function (
|
|
177
|
-
_inherits(RichTextInput,
|
|
186
|
+
var RichTextInput = /*#__PURE__*/function (_PureComponent) {
|
|
187
|
+
_inherits(RichTextInput, _PureComponent);
|
|
178
188
|
|
|
179
189
|
var _super = _createSuper(RichTextInput);
|
|
180
190
|
|
|
@@ -281,7 +291,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
281
291
|
}, {
|
|
282
292
|
key: "render",
|
|
283
293
|
value: function render() {
|
|
284
|
-
return jsx(Editor$1,
|
|
294
|
+
return jsx(Editor$1, _objectSpread(_objectSpread({}, filterDataAttributes(this.props)), {}, {
|
|
285
295
|
autoFocus: this.props.isAutofocussed,
|
|
286
296
|
id: this.props.id,
|
|
287
297
|
name: this.props.name,
|
|
@@ -302,7 +312,7 @@ var RichTextInput = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
302
312
|
}]);
|
|
303
313
|
|
|
304
314
|
return RichTextInput;
|
|
305
|
-
}(
|
|
315
|
+
}(PureComponent);
|
|
306
316
|
|
|
307
317
|
RichTextInput.defaultProps = {
|
|
308
318
|
defaultExpandMultilineText: false,
|
|
@@ -341,7 +351,7 @@ RichTextInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
341
351
|
} : {};
|
|
342
352
|
var RichTextInput$1 = RichTextInput;
|
|
343
353
|
|
|
344
|
-
// NOTE: This string will be replaced
|
|
345
|
-
var version =
|
|
354
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
355
|
+
var version = "12.2.6";
|
|
346
356
|
|
|
347
357
|
export { RichTextInput$1 as default, version };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@commercetools-uikit/rich-text-input",
|
|
3
3
|
"description": "A controlled rich text input component for rich text with validation states.",
|
|
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,28 +18,25 @@
|
|
|
19
18
|
"main": "dist/commercetools-uikit-rich-text-input.cjs.js",
|
|
20
19
|
"module": "dist/commercetools-uikit-rich-text-input.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/collapsible-motion": "12.2.
|
|
29
|
-
"@commercetools-uikit/constraints": "12.2.
|
|
30
|
-
"@commercetools-uikit/design-system": "12.2.
|
|
31
|
-
"@commercetools-uikit/flat-button": "12.2.
|
|
32
|
-
"@commercetools-uikit/hooks": "12.2.
|
|
33
|
-
"@commercetools-uikit/icons": "12.2.
|
|
34
|
-
"@commercetools-uikit/input-utils": "12.2.
|
|
35
|
-
"@commercetools-uikit/rich-text-utils": "12.2.
|
|
36
|
-
"@commercetools-uikit/spacings-inline": "12.2.
|
|
37
|
-
"@commercetools-uikit/spacings-stack": "12.2.
|
|
38
|
-
"@commercetools-uikit/tooltip": "12.2.
|
|
39
|
-
"@commercetools-uikit/utils": "12.2.
|
|
22
|
+
"@babel/runtime": "7.16.3",
|
|
23
|
+
"@babel/runtime-corejs3": "7.16.3",
|
|
24
|
+
"@commercetools-uikit/collapsible-motion": "12.2.5",
|
|
25
|
+
"@commercetools-uikit/constraints": "12.2.5",
|
|
26
|
+
"@commercetools-uikit/design-system": "12.2.5",
|
|
27
|
+
"@commercetools-uikit/flat-button": "12.2.5",
|
|
28
|
+
"@commercetools-uikit/hooks": "12.2.5",
|
|
29
|
+
"@commercetools-uikit/icons": "12.2.6",
|
|
30
|
+
"@commercetools-uikit/input-utils": "12.2.6",
|
|
31
|
+
"@commercetools-uikit/rich-text-utils": "12.2.6",
|
|
32
|
+
"@commercetools-uikit/spacings-inline": "12.2.5",
|
|
33
|
+
"@commercetools-uikit/spacings-stack": "12.2.5",
|
|
34
|
+
"@commercetools-uikit/tooltip": "12.2.5",
|
|
35
|
+
"@commercetools-uikit/utils": "12.2.5",
|
|
40
36
|
"@emotion/react": "^11.4.0",
|
|
41
37
|
"@emotion/styled": "^11.3.0",
|
|
42
|
-
"downshift": "6.1.
|
|
43
|
-
"immutable": "4.0.0
|
|
38
|
+
"downshift": "6.1.7",
|
|
39
|
+
"immutable": "4.0.0",
|
|
44
40
|
"is-hotkey": "0.2.0",
|
|
45
41
|
"lodash": "4.17.21",
|
|
46
42
|
"prop-types": "15.7.2",
|
|
@@ -51,7 +47,7 @@
|
|
|
51
47
|
},
|
|
52
48
|
"devDependencies": {
|
|
53
49
|
"react": "17.0.2",
|
|
54
|
-
"react-intl": "5.
|
|
50
|
+
"react-intl": "5.21.2"
|
|
55
51
|
},
|
|
56
52
|
"peerDependencies": {
|
|
57
53
|
"react": "17.x",
|