@instructure/ui-truncate-text 8.33.1 → 8.33.2-snapshot-5

package/lib/TruncateText/utils/cleanData.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _cloneArray = require("@instructure/ui-utils/lib/cloneArray.js");
-
 /*
  * The MIT License (MIT)
  *
@@ -49,91 +47,73 @@ var _cloneArray = require("@instructure/ui-utils/lib/cloneArray.js");
 function cleanData(stringData, options) {
   let repeat = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : false;
   const truncate = options.truncate,
-        ignore = options.ignore,
-        ellipsis = options.ellipsis;
+    ignore = options.ignore,
+    ellipsis = options.ellipsis;
   let newData = (0, _cloneArray.cloneArray)(stringData);
   let ellipsisNode = -1;
   let ellipsisIndex = -1;
-
   const findEllipsis = () => {
     for (let i = 0; i < newData.length; i++) {
       const nodeData = newData[i];
-
       if (nodeData.indexOf(ellipsis) !== -1) {
         ellipsisNode = i;
         ellipsisIndex = nodeData.indexOf(ellipsis);
       }
     }
   };
-
   if (truncate === 'character') {
     findEllipsis();
     let node = newData[ellipsisNode];
-
     if (node) {
       const before = node[ellipsisIndex - 1];
-
       if (before && ignore.indexOf(before) !== -1) {
         // remove character immediately BEFORE the ellipsis in the same node
         newData[ellipsisNode].splice(ellipsisIndex - 1, 1);
       }
-
       if (!before) {
         // character before the ellipsis is part of a different node
         // find the next node with data and remove last datum
         let prevNode = null;
         let prevNodeIndex = ellipsisNode - 1;
-
         while (prevNodeIndex >= 0) {
           prevNode = newData[prevNodeIndex];
-
           if (prevNode.length > 0) {
             break;
           } else {
             prevNodeIndex--;
           }
         }
-
         if (prevNode) {
           const lastChar = String(prevNode.slice(-1));
-
           if (ignore.indexOf(lastChar) !== -1) {
             newData[prevNodeIndex].length -= 1;
           }
         }
       }
     }
-
     findEllipsis();
     node = newData[ellipsisNode];
-
     if (node) {
       const after = node[ellipsisIndex + 1];
-
       if (after && ignore.indexOf(after) !== -1) {
         // remove character immediately AFTER the ellipsis in the same node
         newData[ellipsisNode].splice(ellipsisIndex + 1, 1);
       }
-
       if (!after) {
         // character after the ellipsis is part of a different node
         // find the next node with data and remove first datum
         let nextNode = null;
         let nextNodeIndex = ellipsisNode + 1;
-
         while (nextNodeIndex < newData.length) {
           nextNode = newData[nextNodeIndex];
-
           if (nextNode.length > 0) {
             break;
           } else {
             nextNodeIndex++;
           }
         }
-
         if (nextNode) {
           const firstChar = String(nextNode[0]);
-
           if (ignore.indexOf(firstChar) !== -1) {
             newData[nextNodeIndex].shift();
           }
@@ -143,10 +123,8 @@ function cleanData(stringData, options) {
   } else {
     findEllipsis();
     const node = newData[ellipsisNode];
-
     if (node) {
       const before = node[ellipsisIndex - 1];
-
       if (before && ignore.indexOf(before.slice(-1)) !== -1) {
         if (before.length === 1) {
           // remove entire word datum
@@ -156,26 +134,21 @@ function cleanData(stringData, options) {
           newData[ellipsisNode][ellipsisIndex - 1] = before.slice(0, -1);
         }
       }
-
       if (!before) {
         // word before the ellipsis is part of a different node
         // find the next node with data and remove last datum
         let prevNode = null;
         let prevNodeIndex = ellipsisNode - 1;
-
         while (prevNodeIndex >= 0) {
           prevNode = newData[prevNodeIndex];
-
           if (prevNode.length > 0) {
             break;
           } else {
             prevNodeIndex--;
           }
         }
-
         if (prevNode) {
           const lastChar = String(prevNode.slice(-1)).slice(-1);
-
           if (ignore.indexOf(lastChar) !== -1) {
             const lastItem = prevNode.length - 1;
             newData[prevNodeIndex][lastItem] = prevNode[lastItem].slice(0, -1);
@@ -184,13 +157,10 @@ function cleanData(stringData, options) {
       }
     }
   }
-
   if (repeat) {
     newData = cleanData(newData, options, false);
   }
-
   return newData;
 }
-
 var _default = cleanData;
 exports.default = _default;

package/lib/TruncateText/utils/cleanString.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 /*
  * The MIT License (MIT)
  *
@@ -49,21 +48,16 @@ function cleanString(string, ignore) {
   let text = string;
   const firstChar = text.charAt(0);
   const lastChar = text.slice(-1);
-
   if (start && ignore.indexOf(firstChar) !== -1) {
     text = text.slice(1);
   }
-
   if (end && ignore.indexOf(lastChar) !== -1) {
     text = text.slice(0, -1);
   }
-
   if (repeat) {
     text = cleanString(text, ignore, start, end, false);
   }
-
   return text;
 }
-
 var _default = cleanString;
 exports.default = _default;

package/lib/TruncateText/utils/measureText.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _getComputedStyle = require("@instructure/ui-dom-utils/lib/getComputedStyle.js");
-
 /*
  * The MIT License (MIT)
  *
@@ -43,33 +41,27 @@ var _getComputedStyle = require("@instructure/ui-dom-utils/lib/getComputedStyle.
  */
 function measureText(nodes, parentNode) {
   let width = 0;
-
   for (let i = 0; i < nodes.length; i++) {
     const node = nodes[i];
     width += measure(node.textContent, node.nodeType === 1 ? node : parentNode);
   }
-
   return width;
 }
-
 function measure(string, domNode) {
-  const style = (0, _getComputedStyle.getComputedStyle)(domNode); // we use a canvas in a doc fragment to prevent having to render the string full width in the DOM
-
+  const style = (0, _getComputedStyle.getComputedStyle)(domNode);
+  // we use a canvas in a doc fragment to prevent having to render the string full width in the DOM
   const canvas = document.createElement('canvas');
   document.createDocumentFragment().appendChild(canvas);
   const context = canvas.getContext('2d');
-
   if (!context || !string) {
     return 0;
   }
-
   let text = string;
   let letterOffset = 0;
-  let width = 0; // grab individual font styles
+  let width = 0;
+  // grab individual font styles
   // some browsers don't report a value for style['font']
-
   context.font = [style.fontWeight, style.fontStyle, style.fontSize, style.fontFamily].join(' ');
-
   if (style.textTransform === 'uppercase') {
     text = string.toUpperCase();
   } else if (style.textTransform === 'lowercase') {
@@ -77,15 +69,12 @@ function measure(string, domNode) {
   } else if (style.textTransform === 'capitalize') {
     text = string.replace(/\b\w/g, str => str.toUpperCase());
   }
-
   if (style.letterSpacing !== 'normal') {
     letterOffset = text.length * parseInt(style.letterSpacing);
   }
-
-  width = context.measureText(text).width + letterOffset; // returns the max potential width of the text, assuming the text was on a single line
-
+  width = context.measureText(text).width + letterOffset;
+  // returns the max potential width of the text, assuming the text was on a single line
   return width;
 }
-
 var _default = measureText;
 exports.default = _default;

package/lib/TruncateText/utils/truncate.js

@@ -1,30 +1,19 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _escapeHtml = _interopRequireDefault(require("escape-html"));
-
 var _cloneArray = require("@instructure/ui-utils/lib/cloneArray.js");
-
 var _console = require("@instructure/console");
-
 var _getComputedStyle = require("@instructure/ui-dom-utils/lib/getComputedStyle.js");
-
 var _getBoundingClientRect = require("@instructure/ui-dom-utils/lib/getBoundingClientRect.js");
-
 var _isVisible = require("@instructure/ui-dom-utils/lib/isVisible.js");
-
 var _measureText = _interopRequireDefault(require("./measureText"));
-
 var _cleanString = _interopRequireDefault(require("./cleanString"));
-
 var _cleanData = _interopRequireDefault(require("./cleanData"));
-
 /*
  * The MIT License (MIT)
  *
@@ -69,14 +58,11 @@ var _cleanData = _interopRequireDefault(require("./cleanData"));
  */
 function truncate(element, options) {
   const truncator = new Truncator(element, options);
-
   if (truncator) {
     return truncator.truncate();
   }
-
   return;
 }
-
 class Truncator {
   constructor(element) {
     let options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
@@ -100,161 +86,133 @@ class Truncator {
       lineHeight: options.lineHeight || 1.2,
       shouldTruncateWhenInvisible: !!options.shouldTruncateWhenInvisible
     };
-
     if (!element) {
       (0, _console.logError)(false, '[Truncator] No element to truncate.');
       return;
     }
-
     this._stage = element;
-
     if (options.parent) {
       this._parent = this._options.parent;
     } else {
       const parentEl = this._stage.parentElement ? this._stage.parentElement : void 0;
       this._parent = this._options.maxLines === 'auto' ? parentEl : this._stage;
     }
-
     this.setup();
   }
-
   setup() {
     if (!this._stage) {
       return;
     }
-
     const _this$_options = this._options,
-          maxLines = _this$_options.maxLines,
-          truncate = _this$_options.truncate,
-          lineHeight = _this$_options.lineHeight;
-    const style = (0, _getComputedStyle.getComputedStyle)(this._parent); // if no explicit lineHeight is inherited, use lineHeight multiplier for calculations
-
+      maxLines = _this$_options.maxLines,
+      truncate = _this$_options.truncate,
+      lineHeight = _this$_options.lineHeight;
+    const style = (0, _getComputedStyle.getComputedStyle)(this._parent);
+    // if no explicit lineHeight is inherited, use lineHeight multiplier for calculations
     const actualLineHeight = style.lineHeight === 'normal' ? lineHeight * parseFloat(style.fontSize) : parseFloat(style.lineHeight);
     const node = this._stage.firstChild.children ? this._stage.firstChild : this._stage;
     const nodeDataIndexes = [];
     const stringData = [];
     this._nodeMap = this.getNodeMap(node);
-
     for (let i = 0; i < this._nodeMap.length; i++) {
       const item = this._nodeMap[i];
-
       if (truncate === 'word' && item.data[item.data.length - 1] === ' ') {
         // remove random whitespace data between nodes
         item.data.length -= 1;
       }
-
       stringData[i] = item.data;
-
       for (let j = 0; j < item.data.length; j++) {
         // map each word or character datum index to its corresponding node
         nodeDataIndexes.push(i);
       }
     }
-
     this._defaultStringData = (0, _cloneArray.cloneArray)(stringData);
     this._nodeDataIndexes = (0, _cloneArray.cloneArray)(nodeDataIndexes);
     this._maxHeight = maxLines === 'auto' ? (0, _getBoundingClientRect.getBoundingClientRect)(this._parent).height : maxLines * actualLineHeight;
     this._maxWidth = (0, _measureText.default)(this._nodeMap.map(item => item.node), this._parent);
     this._maxLines = maxLines === 'auto' ? Math.round(this._maxHeight / actualLineHeight) : maxLines;
   }
-
   getNodeMap(rootNode) {
     const _this$_options2 = this._options,
-          shouldTruncateWhenInvisible = _this$_options2.shouldTruncateWhenInvisible,
-          truncate = _this$_options2.truncate;
+      shouldTruncateWhenInvisible = _this$_options2.shouldTruncateWhenInvisible,
+      truncate = _this$_options2.truncate;
     const nodes = Array.from(rootNode.childNodes);
-    const map = []; // parse child nodes and build a data map to associate each node with its data
-
+    const map = [];
+    // parse child nodes and build a data map to associate each node with its data
     nodes.forEach(node => {
       if (node.nodeType === 1 || node.nodeType === 3) {
         const shouldTruncate = shouldTruncateWhenInvisible ? true : (0, _isVisible.isVisible)(node, false);
         const textContent = node.textContent + ' ';
         map.push({
           node,
-          data: truncate === 'word' ? shouldTruncate ? // eslint-disable-next-line no-useless-escape
+          data: truncate === 'word' ? shouldTruncate ?
+          // eslint-disable-next-line no-useless-escape
           textContent.match(/.*?[\.\s\/]+?/g) : [''] : shouldTruncate ? node.textContent.split('') : []
         });
       }
     });
     return map;
   }
-
   getNodeIndexes(data) {
     const nodeDataIndexes = [];
-
     for (let i = 0; i < data.length; i++) {
       for (let j = 0; j < data[i].length; j++) {
         nodeDataIndexes.push([i, j]);
       }
     }
-
     return nodeDataIndexes;
   }
-
   domString(data) {
     let html = '';
-
     for (let i = 0; i < data.length; i++) {
       const mapItem = this._nodeMap[i];
       const text = data[i].join('');
       const safeText = (0, _escapeHtml.default)(text);
-
       if (mapItem.node.nodeType === Node.ELEMENT_NODE) {
         const name = mapItem.node.nodeName;
         const attr = mapItem.node.attributes;
         let attributes = '';
-
         for (let j = 0; j < attr.length; j++) {
           const att = attr[j];
           attributes += ` ${att.nodeName}="${att.nodeValue}"`;
         }
-
         html += `<${name}${attributes}>${safeText}</${name}>`;
       } else if (mapItem.node.nodeType === 3) {
         html += safeText;
       }
     }
-
     return html;
   }
-
   checkFit(data) {
     const html = this.domString(data);
     const node = this._options.maxLines === 'auto' ? this._stage : this._parent;
     let fits = true;
-    this._stage.innerHTML = html; // allow a 0.5 px margin of error for browser calculation discrepancies
-
+    this._stage.innerHTML = html;
+    // allow a 0.5 px margin of error for browser calculation discrepancies
     if ((0, _getBoundingClientRect.getBoundingClientRect)(node).height - this._maxHeight > 0.5) {
       fits = false;
     }
-
     return fits;
   }
-
   truncate() {
     const _this$_options3 = this._options,
-          ellipsis = _this$_options3.ellipsis,
-          ignore = _this$_options3.ignore,
-          position = _this$_options3.position;
+      ellipsis = _this$_options3.ellipsis,
+      ignore = _this$_options3.ignore,
+      position = _this$_options3.position;
     const middle = position === 'middle';
     let truncated = false;
     let truncatedText = '';
     let stringData = null;
-
     if (!this._stage) {
       return;
     }
-
     const binarySearch = function (_low, _high, ev, middle) {
       let _default = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : null;
-
       let low = _low;
       let high = _high;
       let bestResult = _default;
-
       while (low <= high) {
         const tryNumber = Math.floor((low + high) / 2);
-
         if (ev(tryNumber, middle)) {
           high = tryNumber - 1;
           bestResult = tryNumber;
@@ -262,72 +220,65 @@ class Truncator {
           low = tryNumber + 1;
         }
       }
-
       return bestResult;
     };
-
     const truncateArray = (truncatedLength, originalArray, indexArray, middle) => {
       let truncated = false;
       const truncatedArray = (0, _cloneArray.cloneArray)(originalArray);
-
       switch (truncatedLength) {
         // truncate nothing
         case 0:
           break;
-        // truncate all
 
+        // truncate all
         case indexArray.length:
           truncated = true;
-
           for (let i = 0; i < truncatedArray.length; i++) {
             truncatedArray[i] = [];
           }
-
           truncatedArray[0].push(ellipsis);
           break;
-        // truncate a positive amount of elements
 
+        // truncate a positive amount of elements
         default:
           truncated = true;
-
           if (middle) {
-            const dataHalves = Array(2); // calculate the indexes for two parts
-
+            const dataHalves = Array(2);
+            // calculate the indexes for two parts
             dataHalves[0] = Math.floor((indexArray.length - truncatedLength - 1) / 2);
             dataHalves[1] = dataHalves[0] + truncatedLength + 1;
             const nodeHalves = dataHalves.map(index => indexArray[index]);
             const sliceAmounts = Array(2);
             sliceAmounts[0] = dataHalves[0] + 1;
-            sliceAmounts[1] = indexArray.length - truncatedLength - sliceAmounts[0]; // keep the first part
+            sliceAmounts[1] = indexArray.length - truncatedLength - sliceAmounts[0];
 
+            // keep the first part
             for (let i = 0; i <= nodeHalves[0]; i++) {
               switch (true) {
                 case i < nodeHalves[0]:
                   sliceAmounts[0] -= truncatedArray[i].length;
                   break;
-
                 case i === nodeHalves[0]:
                   truncatedArray[i] = originalArray[i].slice(0, sliceAmounts[0]);
                   truncatedArray[i].push(ellipsis);
                   break;
               }
-            } // and the second part
-
+            }
 
+            // and the second part
             for (let i = originalArray.length - 1; i >= nodeHalves[1]; i--) {
               switch (true) {
                 case i > nodeHalves[1]:
                   sliceAmounts[1] -= originalArray[i].length;
                   break;
-
                 case i === nodeHalves[1]:
                   if (nodeHalves[1] > nodeHalves[0]) truncatedArray[i] = originalArray[i].slice(-sliceAmounts[1]);
                   if (nodeHalves[1] === nodeHalves[0]) truncatedArray[i] = truncatedArray[i].concat(originalArray[i].slice(-sliceAmounts[1]));
                   break;
               }
-            } // delete the middle
-
+            }
 
+            // delete the middle
             for (let i = nodeHalves[0] + 1; i < nodeHalves[1]; i++) {
               truncatedArray[i] = [];
             }
@@ -336,55 +287,44 @@ class Truncator {
             const indexToTry = indexArray.length - truncatedLength - 1;
             const nodeIndex = indexArray[indexToTry];
             let sliceAmount = indexToTry + 1;
-
             for (let i = 0; i < originalArray.length; i++) {
               switch (true) {
                 case i < nodeIndex:
                   sliceAmount -= truncatedArray[i].length;
                   break;
-
                 case i === nodeIndex:
                   truncatedArray[i] = truncatedArray[i].slice(0, sliceAmount);
                   truncatedArray[i].push(ellipsis);
                   break;
-
                 case i > nodeIndex:
                   truncatedArray[i] = [];
                   break;
               }
             }
           }
-
           break;
       }
-
       return {
         truncated,
         truncatedArray
       };
     };
-
     const truncateEvaluate = (truncatedLength, middle) => {
       const _truncateArray = truncateArray(truncatedLength, this._defaultStringData, this._nodeDataIndexes, middle),
-            truncatedArray = _truncateArray.truncatedArray;
-
+        truncatedArray = _truncateArray.truncatedArray;
       return this.checkFit(truncatedArray);
-    }; // find the best number of element to truncate
-
+    };
 
+    // find the best number of element to truncate
     const finestMatch = binarySearch(0, this._nodeDataIndexes.length, truncateEvaluate, middle, this._nodeDataIndexes.length);
-
     var _truncateArray2 = truncateArray(finestMatch, this._defaultStringData, this._nodeDataIndexes, middle);
-
     truncated = _truncateArray2.truncated;
     stringData = _truncateArray2.truncatedArray;
     stringData = (0, _cleanData.default)(stringData, this._options, true);
-
     for (let i = 0; i < stringData.length; i++) {
       const data = stringData[i];
       truncatedText += data.join('');
     }
-
     if (truncated && !middle) {
       truncatedText = (0, _cleanString.default)(truncatedText.split(ellipsis)[0], ignore, false, true, true);
       truncatedText += ellipsis;
@@ -392,7 +332,6 @@ class Truncator {
       const halves = truncatedText.split(ellipsis);
       truncatedText = (0, _cleanString.default)(halves[0], ignore, false, true, true) + ellipsis + (0, _cleanString.default)(halves[1], ignore, true, false, true);
     }
-
     return {
       isTruncated: truncated,
       text: truncatedText,
@@ -404,8 +343,6 @@ class Truncator {
       }
     };
   }
-
 }
-
 var _default2 = truncate;
 exports.default = _default2;

package/lib/index.js

@@ -9,5 +9,4 @@ Object.defineProperty(exports, "TruncateText", {
     return _TruncateText.TruncateText;
   }
 });
-
 var _TruncateText = require("./TruncateText");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-truncate-text",
-  "version": "8.33.1",
+  "version": "8.33.2-snapshot-5",
   "description": "A TruncateText component made by Instructure Inc.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -24,23 +24,23 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/console": "8.33.1",
-    "@instructure/debounce": "8.33.1",
-    "@instructure/emotion": "8.33.1",
-    "@instructure/shared-types": "8.33.1",
-    "@instructure/ui-dom-utils": "8.33.1",
-    "@instructure/ui-react-utils": "8.33.1",
-    "@instructure/ui-testable": "8.33.1",
-    "@instructure/ui-utils": "8.33.1",
+    "@instructure/console": "8.33.2-snapshot-5",
+    "@instructure/debounce": "8.33.2-snapshot-5",
+    "@instructure/emotion": "8.33.2-snapshot-5",
+    "@instructure/shared-types": "8.33.2-snapshot-5",
+    "@instructure/ui-dom-utils": "8.33.2-snapshot-5",
+    "@instructure/ui-react-utils": "8.33.2-snapshot-5",
+    "@instructure/ui-testable": "8.33.2-snapshot-5",
+    "@instructure/ui-utils": "8.33.2-snapshot-5",
     "escape-html": "^1",
     "prop-types": "^15"
   },
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.33.1",
-    "@instructure/ui-color-utils": "8.33.1",
-    "@instructure/ui-test-utils": "8.33.1",
-    "@instructure/ui-text": "8.33.1",
-    "@instructure/ui-themes": "8.33.1",
+    "@instructure/ui-babel-preset": "8.33.2-snapshot-5",
+    "@instructure/ui-color-utils": "8.33.2-snapshot-5",
+    "@instructure/ui-test-utils": "8.33.2-snapshot-5",
+    "@instructure/ui-text": "8.33.2-snapshot-5",
+    "@instructure/ui-themes": "8.33.2-snapshot-5",
     "@types/escape-html": "^1"
   },
   "peerDependencies": {