@datarobot/design-system 28.3.1 → 28.3.3

package/cjs/chat/chat-message-body.js

@@ -146,7 +146,18 @@ function ChatMessageBodyBase({
           ,
           renderElement: _renderers.renderElement,
           onBlur: onBlur,
-          "aria-label": readOnly ? undefined : textBoxAriaLabel
+          "aria-label": readOnly ? undefined : textBoxAriaLabel,
+          onDOMBeforeInput: event => {
+            // we have logic to prevent entering text longer than maxLength in hocs.ts
+            // but there we prevent it only from updating slate inner state, html input still
+            // adds entered text to the DOM input field causing buggy behavior: https://datarobot.atlassian.net/browse/TESTLIO-2963
+            // preventing default from the onDOMBeforeInput won't add new character to the DOM input field.
+            // we still won't to leave logic in hocs.ts as a fallback + it also covers copy+paste logic which doesn't trigger onDOMBeforeInput
+            const existingMentionsCount = (0, _utils.getMentionsCount)(editor.children);
+            if (_slate.Editor.string(editor, []).length + existingMentionsCount + (event?.data?.length ?? 0) > maxLength) {
+              event.preventDefault();
+            }
+          }
         })
       }), hasMentionsSupport && isFocused && /*#__PURE__*/(0, _jsxRuntime.jsx)(_dropdown.PopperDropdownWrapper, {
         closeDropdown: closeMenu,

package/cjs/chat/hocs.js

@@ -11,6 +11,10 @@ const withMaxLength = maxLength => function Plugin(editor) {
     insertText,
     insertData
   } = editor;
+
+  // we are preventing inserting text if it exceeds maxLength in onDOMBeforeInput event handler in Editor component
+  // but I'd leave it here as well for safety in case onDOMBeforeInput stops working for some reason + we still need
+  // insertData to handle copy+paste logic which doesn't trigger onDOMBeforeInput
   editor.insertText = text => {
     const existingMentionsCount = (0, _utils.getMentionsCount)(editor.children);
     if (_slate.Editor.string(editor, []).length + existingMentionsCount < maxLength) {

package/esm/chat/chat-message-body.js

@@ -138,7 +138,18 @@ function ChatMessageBodyBase({
           ,
           renderElement: renderElement,
           onBlur: onBlur,
-          "aria-label": readOnly ? undefined : textBoxAriaLabel
+          "aria-label": readOnly ? undefined : textBoxAriaLabel,
+          onDOMBeforeInput: event => {
+            // we have logic to prevent entering text longer than maxLength in hocs.ts
+            // but there we prevent it only from updating slate inner state, html input still
+            // adds entered text to the DOM input field causing buggy behavior: https://datarobot.atlassian.net/browse/TESTLIO-2963
+            // preventing default from the onDOMBeforeInput won't add new character to the DOM input field.
+            // we still won't to leave logic in hocs.ts as a fallback + it also covers copy+paste logic which doesn't trigger onDOMBeforeInput
+            const existingMentionsCount = getMentionsCount(editor.children);
+            if (Editor.string(editor, []).length + existingMentionsCount + (event?.data?.length ?? 0) > maxLength) {
+              event.preventDefault();
+            }
+          }
         })
       }), hasMentionsSupport && isFocused && /*#__PURE__*/_jsx(PopperDropdownWrapper, {
         closeDropdown: closeMenu,

package/esm/chat/hocs.js

@@ -5,6 +5,10 @@ export const withMaxLength = maxLength => function Plugin(editor) {
     insertText,
     insertData
   } = editor;
+
+  // we are preventing inserting text if it exceeds maxLength in onDOMBeforeInput event handler in Editor component
+  // but I'd leave it here as well for safety in case onDOMBeforeInput stops working for some reason + we still need
+  // insertData to handle copy+paste logic which doesn't trigger onDOMBeforeInput
   editor.insertText = text => {
     const existingMentionsCount = getMentionsCount(editor.children);
     if (Editor.string(editor, []).length + existingMentionsCount < maxLength) {

package/js/bundle/bundle.js

@@ -44134,7 +44134,19 @@ function ChatMessageBodyBase(_ref) {
     ,
     renderElement: _renderers__WEBPACK_IMPORTED_MODULE_10__.renderElement,
     onBlur: onBlur,
-    "aria-label": readOnly ? undefined : textBoxAriaLabel
+    "aria-label": readOnly ? undefined : textBoxAriaLabel,
+    onDOMBeforeInput: function onDOMBeforeInput(event) {
+      var _event$data$length, _event$data;
+      // we have logic to prevent entering text longer than maxLength in hocs.ts
+      // but there we prevent it only from updating slate inner state, html input still
+      // adds entered text to the DOM input field causing buggy behavior: https://datarobot.atlassian.net/browse/TESTLIO-2963
+      // preventing default from the onDOMBeforeInput won't add new character to the DOM input field.
+      // we still won't to leave logic in hocs.ts as a fallback + it also covers copy+paste logic which doesn't trigger onDOMBeforeInput
+      var existingMentionsCount = (0,_utils__WEBPACK_IMPORTED_MODULE_11__.getMentionsCount)(editor.children);
+      if (slate__WEBPACK_IMPORTED_MODULE_2__.Editor.string(editor, []).length + existingMentionsCount + ((_event$data$length = event === null || event === void 0 || (_event$data = event.data) === null || _event$data === void 0 ? void 0 : _event$data.length) !== null && _event$data$length !== void 0 ? _event$data$length : 0) > maxLength) {
+        event.preventDefault();
+      }
+    }
   })), hasMentionsSupport && isFocused && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dropdown__WEBPACK_IMPORTED_MODULE_5__.PopperDropdownWrapper, {
     closeDropdown: closeMenu,
     anchorRef: anchorRef.current,
@@ -44552,6 +44564,10 @@ var withMaxLength = function withMaxLength(maxLength) {
   return function Plugin(editor) {
     var insertText = editor.insertText,
       insertData = editor.insertData;
+
+    // we are preventing inserting text if it exceeds maxLength in onDOMBeforeInput event handler in Editor component
+    // but I'd leave it here as well for safety in case onDOMBeforeInput stops working for some reason + we still need
+    // insertData to handle copy+paste logic which doesn't trigger onDOMBeforeInput
     editor.insertText = function (text) {
       var existingMentionsCount = (0,_utils__WEBPACK_IMPORTED_MODULE_1__.getMentionsCount)(editor.children);
       if (slate__WEBPACK_IMPORTED_MODULE_0__.Editor.string(editor, []).length + existingMentionsCount < maxLength) {