@arco-design/mobile-react 2.24.1 → 2.25.0

package/cjs/ellipsis/components/js-ellipsis.js

@@ -1,35 +1,28 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _resizeObserverPolyfill = _interopRequireDefault(require("resize-observer-polyfill"));
-
 var _dom = require("../utils/dom");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 var JsEllipsis = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var prefixCls = props.prefixCls,
-      text = props.text,
-      ellipsis = props.ellipsis,
-      dangerouslyUseInnerHTML = props.dangerouslyUseInnerHTML,
-      _props$maxLine = props.maxLine,
-      maxLine = _props$maxLine === void 0 ? 1 : _props$maxLine,
-      maxHeight = props.maxHeight,
-      ellipsisNode = props.ellipsisNode,
-      collapseNode = props.collapseNode,
-      endExcludes = props.endExcludes,
-      reflowOnResize = props.reflowOnResize,
-      onReflow = props.onReflow,
-      onEllipsisNodeClick = props.onEllipsisNodeClick,
-      onCollapseNodeClick = props.onCollapseNodeClick;
+    text = props.text,
+    ellipsis = props.ellipsis,
+    dangerouslyUseInnerHTML = props.dangerouslyUseInnerHTML,
+    _props$maxLine = props.maxLine,
+    maxLine = _props$maxLine === void 0 ? 1 : _props$maxLine,
+    maxHeight = props.maxHeight,
+    ellipsisNode = props.ellipsisNode,
+    collapseNode = props.collapseNode,
+    endExcludes = props.endExcludes,
+    reflowOnResize = props.reflowOnResize,
+    onReflow = props.onReflow,
+    onEllipsisNodeClick = props.onEllipsisNodeClick,
+    onCollapseNodeClick = props.onCollapseNodeClick;
   var truncating = (0, _react.useRef)(false);
   var domRef = (0, _react.useRef)(null);
   var textRef = (0, _react.useRef)(null);
@@ -43,89 +36,73 @@ var JsEllipsis = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   (0, _react.useEffect)(function () {
     setCurLineHeight();
   }, []);
-
   function handleOnReflow(isEllipsis, result) {
     if (onReflow && typeof onReflow === 'function') {
       onReflow(isEllipsis, result);
     }
   }
-
   function truncateText(container, textContainer, max) {
     var content = textContainer.textContent || '';
     var currentText = '';
     var l = 0;
-    var r = content.length - 1; // Binary truncate text until get the max limit fragment of text.
-
+    var r = content.length - 1;
+    // Binary truncate text until get the max limit fragment of text.
     while (l < r) {
       var m = Math.floor((l + r) / 2);
-
       if (l === m) {
         break;
       }
-
       var temp = content.slice(l, m);
       textContainer.innerText = currentText + temp;
-
       var _container$getBoundin = container.getBoundingClientRect(),
-          height = _container$getBoundin.height;
-
+        height = _container$getBoundin.height;
       if (height > max) {
         r = m;
       } else {
         currentText += temp;
         l = m;
       }
-    } // Remove the exclude char at the end of the content.
-
-
+    }
+    // Remove the exclude char at the end of the content.
     while (endExcludes && endExcludes.includes(currentText[currentText.length - 1])) {
       currentText = currentText.slice(0, -1);
-    } // Callback after reflow.
-
-
+    }
+    // Callback after reflow.
     handleOnReflow(true, currentText);
     textContainer.innerText = currentText;
   }
-
   function truncateHTML(container, textContainer, max) {
     // only enter this function when container overflow.
     var children = textContainer.childNodes;
-
     if (children.length === 1) {
       var node = children[0];
-
       if (node.nodeType === Node.TEXT_NODE) {
         truncateText(container, textContainer, max);
       } else {
-        var html = node.innerHTML; // clear content to determine whether the empty node can be placed.
-
+        var html = node.innerHTML;
+        // clear content to determine whether the empty node can be placed.
         node.innerHTML = '';
-
         var _container$getBoundin2 = container.getBoundingClientRect(),
-            height = _container$getBoundin2.height;
-
+          height = _container$getBoundin2.height;
         if (height > max) {
           // return after remove the node, if overflow with empty node.
           textContainer.removeChild(node);
           handleOnReflow(true, textContainer.innerHTML);
           return;
         }
-
-        node.innerHTML = html; // recursive truncate node
-
+        node.innerHTML = html;
+        // recursive truncate node
         truncateHTML(container, node, max);
       }
     } else {
       var nodes = [].slice.call(children);
       textContainer.innerHTML = '';
-      var i = 0; // find the critical node
-
+      var i = 0;
+      // find the critical node
       while (i < nodes.length) {
         textContainer.appendChild(nodes[i]);
-
         var _container$getBoundin3 = container.getBoundingClientRect(),
-            _height = _container$getBoundin3.height;
-
+          _height = _container$getBoundin3.height;
         if (_height > max) {
           if (nodes[i].childNodes && nodes[i].childNodes.length) {
             break;
@@ -135,48 +112,39 @@ var JsEllipsis = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
             return;
           }
         }
-
         i++;
       }
-
       if (textContainer.childNodes[i]) {
         // truncate the critical node
         truncateHTML(container, textContainer.childNodes[i], max);
       }
     }
-  } // reflow when the main props change.
-
-
+  }
+  // reflow when the main props change.
   var reflow = (0, _react.useCallback)(function () {
     if (!domRef.current || !textRef.current || !ellipsisRef.current || truncating.current) {
       return;
     }
-
     ellipsisRef.current.style.display = 'none';
-
     if (dangerouslyUseInnerHTML) {
       textRef.current.innerHTML = text;
+      textRef.current.classList.add(prefixCls + "-js-content-text-pre");
     } else {
       textRef.current.innerText = text;
     }
-
     if (!ellipsis) {
       return;
     }
-
+    textRef.current.classList.remove(prefixCls + "-js-content-text-pre");
     var _domRef$current$getBo = domRef.current.getBoundingClientRect(),
-        height = _domRef$current$getBo.height;
-
+      height = _domRef$current$getBo.height;
     var max = isNaN(Number(maxHeight)) ? lineHeightRef.current * maxLine : Number(maxHeight);
-
     if (height <= max) {
       handleOnReflow(false, text);
       return;
     }
-
     truncating.current = true;
     ellipsisRef.current.style.display = 'inline';
-
     if (dangerouslyUseInnerHTML) {
       // wrap the text children node with span element.
       (0, _dom.wrapTextChildNodesWithSpan)(textRef.current, prefixCls + "-js-content-text");
@@ -184,14 +152,13 @@ var JsEllipsis = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     } else {
       truncateText(domRef.current, textRef.current, max);
     }
-
     truncating.current = false;
   }, [text, ellipsis, dangerouslyUseInnerHTML, maxLine, maxHeight, ellipsisNode, endExcludes]);
   (0, _react.useEffect)(function () {
     reflow();
   }, [reflow]);
-  var observerRef = (0, _react.useRef)(null); // Observe resize event of container if reflowOnResize is true.
-
+  var observerRef = (0, _react.useRef)(null);
+  // Observe resize event of container if reflowOnResize is true.
   (0, _react.useEffect)(function () {
     if (domRef.current && reflowOnResize) {
       if (!observerRef.current && ellipsis) {
@@ -199,7 +166,6 @@ var JsEllipsis = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
         observerRef.current.observe(domRef.current);
       }
     }
-
     return function () {
       // Remove observer when component unmounted.
       if (observerRef.current && domRef.current) {
@@ -242,7 +208,5 @@ var JsEllipsis = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     onClick: onCollapseNodeClick
   }, collapseNode));
 });
-
 var _default = /*#__PURE__*/_react.default.memo(JsEllipsis);
-
 exports.default = _default;

package/cjs/ellipsis/components/native-ellipsis.js

@@ -1,25 +1,21 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _mobileUtils = require("@arco-design/mobile-utils");
-
 function NativeEllipsis(_ref) {
   var prefixCls = _ref.prefixCls,
-      ellipsis = _ref.ellipsis,
-      dangerouslyUseInnerHTML = _ref.dangerouslyUseInnerHTML,
-      text = _ref.text,
-      maxLine = _ref.maxLine,
-      ellipsisNode = _ref.ellipsisNode,
-      _ref$collapseNode = _ref.collapseNode,
-      collapseNode = _ref$collapseNode === void 0 ? '' : _ref$collapseNode,
-      onEllipsisNodeClick = _ref.onEllipsisNodeClick,
-      onCollapseNodeClick = _ref.onCollapseNodeClick;
+    ellipsis = _ref.ellipsis,
+    dangerouslyUseInnerHTML = _ref.dangerouslyUseInnerHTML,
+    text = _ref.text,
+    maxLine = _ref.maxLine,
+    ellipsisNode = _ref.ellipsisNode,
+    _ref$collapseNode = _ref.collapseNode,
+    collapseNode = _ref$collapseNode === void 0 ? '' : _ref$collapseNode,
+    onEllipsisNodeClick = _ref.onEllipsisNodeClick,
+    onCollapseNodeClick = _ref.onCollapseNodeClick;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _mobileUtils.cls)(prefixCls + "-native", {
       ellipsis: ellipsis
@@ -42,7 +38,5 @@ function NativeEllipsis(_ref) {
     className: (0, _mobileUtils.cls)(prefixCls + "-native-ellipsis-node")
   }, ellipsisNode) : null);
 }
-
 var _default = /*#__PURE__*/_react.default.memo(NativeEllipsis);
-
 exports.default = _default;

package/cjs/ellipsis/index.js

@@ -1,36 +1,24 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 var _exportNames = {};
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _mobileUtils = require("@arco-design/mobile-utils");
-
 var _contextProvider = require("../context-provider");
-
 var _is = require("./utils/is");
-
 var _jsEllipsis = _interopRequireDefault(require("./components/js-ellipsis"));
-
 var _nativeEllipsis = _interopRequireDefault(require("./components/native-ellipsis"));
-
 var _type = require("./type");
-
 Object.keys(_type).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _type[key]) return;
   exports[key] = _type[key];
 });
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 /**
  * 文本缩略组件，支持多行缩略、富文本、自定义缩略符、尾字符过滤等。
  * @en Text ellipsis component supports multi-line abbreviations, rich text, custom abbreviations, tail character filtering, etc.
@@ -41,31 +29,30 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
  */
 var Ellipsis = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var className = props.className,
-      text = props.text,
-      dangerouslyUseInnerHTML = props.dangerouslyUseInnerHTML,
-      _props$maxLine = props.maxLine,
-      maxLine = _props$maxLine === void 0 ? 1 : _props$maxLine,
-      maxHeight = props.maxHeight,
-      _props$ellipsis = props.ellipsis,
-      ellipsis = _props$ellipsis === void 0 ? true : _props$ellipsis,
-      _props$ellipsisNode = props.ellipsisNode,
-      ellipsisNode = _props$ellipsisNode === void 0 ? '...' : _props$ellipsisNode,
-      _props$collapseNode = props.collapseNode,
-      collapseNode = _props$collapseNode === void 0 ? '' : _props$collapseNode,
-      endExcludes = props.endExcludes,
-      _props$reflowOnResize = props.reflowOnResize,
-      reflowOnResize = _props$reflowOnResize === void 0 ? false : _props$reflowOnResize,
-      _props$floatEllipsisN = props.floatEllipsisNode,
-      floatEllipsisNode = _props$floatEllipsisN === void 0 ? false : _props$floatEllipsisN,
-      onReflow = props.onReflow,
-      onCollapseNodeClick = props.onCollapseNodeClick,
-      onEllipsisNodeClick = props.onEllipsisNodeClick;
+    text = props.text,
+    dangerouslyUseInnerHTML = props.dangerouslyUseInnerHTML,
+    _props$maxLine = props.maxLine,
+    maxLine = _props$maxLine === void 0 ? 1 : _props$maxLine,
+    maxHeight = props.maxHeight,
+    _props$ellipsis = props.ellipsis,
+    ellipsis = _props$ellipsis === void 0 ? true : _props$ellipsis,
+    _props$ellipsisNode = props.ellipsisNode,
+    ellipsisNode = _props$ellipsisNode === void 0 ? '...' : _props$ellipsisNode,
+    _props$collapseNode = props.collapseNode,
+    collapseNode = _props$collapseNode === void 0 ? '' : _props$collapseNode,
+    endExcludes = props.endExcludes,
+    _props$reflowOnResize = props.reflowOnResize,
+    reflowOnResize = _props$reflowOnResize === void 0 ? false : _props$reflowOnResize,
+    _props$floatEllipsisN = props.floatEllipsisNode,
+    floatEllipsisNode = _props$floatEllipsisN === void 0 ? false : _props$floatEllipsisN,
+    onReflow = props.onReflow,
+    onCollapseNodeClick = props.onCollapseNodeClick,
+    onEllipsisNodeClick = props.onEllipsisNodeClick;
   var domRef = (0, _react.useRef)(null);
   var jsEllipsisRef = (0, _react.useRef)(null);
   var useNativeEllipsis = (0, _is.isSupportWebkitLineClamp)() && maxHeight === void 0 && (!endExcludes || endExcludes.length === 0) && !onReflow && (floatEllipsisNode || ellipsisNode === '...' && !onEllipsisNodeClick);
   (0, _react.useImperativeHandle)(ref, function () {
     var _jsEllipsisRef$curren;
-
     return {
       dom: domRef.current,
       reflow: jsEllipsisRef == null ? void 0 : (_jsEllipsisRef$curren = jsEllipsisRef.current) == null ? void 0 : _jsEllipsisRef$curren.reflow

package/cjs/ellipsis/style/css/index.css

@@ -18,6 +18,9 @@
   background:  linear-gradient(90deg, rgba(255, 255, 255, 0), #ffffff 20PX, #ffffff) ;
   padding-left:  20PX ;
 }
+.arco-ellipsis-js-content-text-pre {
+  white-space: pre-line;
+}
 .arco-ellipsis-js-content-ellipsis {
   display: none;
 }

package/cjs/ellipsis/style/css/index.js

@@ -1,5 +1,4 @@
 "use strict";
 
 require("../../../../style/css/public.css");
-
 require("./index.css");

package/cjs/ellipsis/style/index.js

@@ -1,5 +1,4 @@
 "use strict";
 
 require("../../../style/public.less");
-
 require("./index.less");

package/cjs/ellipsis/style/index.less

@@ -21,6 +21,10 @@
         .use-var(padding-left, ellipsis-float-ellipsis-node-padding-left);
     }
 
+    &-js-content-text-pre {
+        white-space: pre-line;
+    }
+    
     &-js-content-ellipsis {
         display: none;
     }

package/cjs/ellipsis/utils/dom.js

@@ -3,11 +3,9 @@
 exports.__esModule = true;
 exports.getLineHeight = getLineHeight;
 exports.wrapTextChildNodesWithSpan = wrapTextChildNodesWithSpan;
-
 function getLineHeight(element) {
   var style = window.getComputedStyle(element, null);
   var lineHeight = style.getPropertyValue('line-height');
-
   if (lineHeight === 'normal') {
     // Create a temp element to get line-height
     var dom = document.createElement('span');
@@ -20,30 +18,24 @@ function getLineHeight(element) {
     element.removeChild(dom);
     return height;
   }
-
   return parseFloat(lineHeight);
 }
-
 function createSpan(text, className) {
   if (className === void 0) {
     className = '';
   }
-
   var span = document.createElement('span');
   span.className = className;
   span.textContent = text;
   return span;
 }
-
 function wrapTextChildNodesWithSpan(node, className) {
   if (className === void 0) {
     className = '';
   }
-
   if (node.nodeType === Node.TEXT_NODE) {
     if (node.textContent) {
       var _node$parentNode;
-
       (_node$parentNode = node.parentNode) == null ? void 0 : _node$parentNode.replaceChild(createSpan(node.textContent, className), node);
     }
   } else {

package/cjs/ellipsis/utils/is.js

@@ -2,17 +2,13 @@
 
 exports.__esModule = true;
 exports.isSupportWebkitLineClamp = exports.isBrowser = void 0;
-
 var isBrowser = function isBrowser() {
   return typeof window !== 'undefined' && typeof document !== 'undefined';
 };
-/** Whether the environment support -webkit-line-clamp. */
-
 
+/** Whether the environment support -webkit-line-clamp. */
 exports.isBrowser = isBrowser;
-
 var isSupportWebkitLineClamp = function isSupportWebkitLineClamp() {
   return isBrowser() && typeof document.body.style.webkitLineClamp !== 'undefined';
 };
-
 exports.isSupportWebkitLineClamp = isSupportWebkitLineClamp;

package/cjs/form/form-item-context.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IFormItemContext } from './type';
+export declare const FormItemContext: React.Context<IFormItemContext>;

package/cjs/form/form-item-context.js

@@ -0,0 +1,12 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.FormItemContext = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _useForm = require("./useForm");
+var FormItemContext = /*#__PURE__*/_react.default.createContext({
+  form: _useForm.defaultFormDataMethods,
+  layout: 'horizontal'
+});
+exports.FormItemContext = FormItemContext;

package/cjs/form/form-item.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { FormItemProps, FormItemRef } from './type';
+declare const _default: React.ForwardRefExoticComponent<FormItemProps & React.RefAttributes<FormItemRef>>;
+export default _default;