@visx/text - npm Package Compare versions

Comparing version 3.0.0-alpha.0 to 3.0.0

esm/hooks/useText.js

@@ -0,66 +1,61 @@
+var _excluded = ["verticalAnchor", "scaleToFit", "angle", "width", "lineHeight", "capHeight", "children", "style"];
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-import React, { useMemo } from 'react';
+import { useMemo } from 'react';
 import reduceCSSCalc from 'reduce-css-calc';
 import getStringWidth from '../util/getStringWidth';
-
 function isNumber(val) {
   return typeof val === 'number';
 }
-
 function isXOrYInValid(xOrY) {
-  return (// number that is not NaN or Infinity
-    typeof xOrY === 'number' && Number.isFinite(xOrY) || // for percentage
+  return (
+    // number that is not NaN or Infinity
+    typeof xOrY === 'number' && Number.isFinite(xOrY) ||
+    // for percentage
     typeof xOrY === 'string'
   );
 }
-
 export default function useText(props) {
   var _props$verticalAnchor = props.verticalAnchor,
-      verticalAnchor = _props$verticalAnchor === void 0 ? 'end' : _props$verticalAnchor,
-      _props$scaleToFit = props.scaleToFit,
-      scaleToFit = _props$scaleToFit === void 0 ? false : _props$scaleToFit,
-      angle = props.angle,
-      width = props.width,
-      _props$lineHeight = props.lineHeight,
-      lineHeight = _props$lineHeight === void 0 ? '1em' : _props$lineHeight,
-      _props$capHeight = props.capHeight,
-      capHeight = _props$capHeight === void 0 ? '0.71em' : _props$capHeight,
-      children = props.children,
-      style = props.style,
-      textProps = _objectWithoutPropertiesLoose(props, ["verticalAnchor", "scaleToFit", "angle", "width", "lineHeight", "capHeight", "children", "style"]);
-
+    verticalAnchor = _props$verticalAnchor === void 0 ? 'end' : _props$verticalAnchor,
+    _props$scaleToFit = props.scaleToFit,
+    scaleToFit = _props$scaleToFit === void 0 ? false : _props$scaleToFit,
+    angle = props.angle,
+    width = props.width,
+    _props$lineHeight = props.lineHeight,
+    lineHeight = _props$lineHeight === void 0 ? '1em' : _props$lineHeight,
+    _props$capHeight = props.capHeight,
+    capHeight = _props$capHeight === void 0 ? '0.71em' : _props$capHeight,
+    children = props.children,
+    style = props.style,
+    textProps = _objectWithoutPropertiesLoose(props, _excluded);
   var _textProps$x = textProps.x,
-      x = _textProps$x === void 0 ? 0 : _textProps$x,
-      _textProps$y = textProps.y,
-      y = _textProps$y === void 0 ? 0 : _textProps$y;
+    x = _textProps$x === void 0 ? 0 : _textProps$x,
+    _textProps$y = textProps.y,
+    y = _textProps$y === void 0 ? 0 : _textProps$y;
   var isXOrYNotValid = !isXOrYInValid(x) || !isXOrYInValid(y);
-
   var _useMemo = useMemo(function () {
-    var words = children == null ? [] : children.toString().split(/(?:(?!\u00A0+)\s+)/);
-    return {
-      wordsWithWidth: words.map(function (word) {
-        return {
-          word: word,
-          wordWidth: getStringWidth(word, style) || 0
-        };
-      }),
-      spaceWidth: getStringWidth("\xA0", style) || 0
-    };
-  }, [children, style]),
-      wordsWithWidth = _useMemo.wordsWithWidth,
-      spaceWidth = _useMemo.spaceWidth;
-
+      var words = children == null ? [] : children.toString().split(/(?:(?!\u00A0+)\s+)/);
+      return {
+        wordsWithWidth: words.map(function (word) {
+          return {
+            word: word,
+            wordWidth: getStringWidth(word, style) || 0
+          };
+        }),
+        spaceWidth: getStringWidth("\xA0", style) || 0
+      };
+    }, [children, style]),
+    wordsWithWidth = _useMemo.wordsWithWidth,
+    spaceWidth = _useMemo.spaceWidth;
   var wordsByLines = useMemo(function () {
     if (isXOrYNotValid) {
       return [];
-    } // Only perform calculations if using features that require them (multiline, scaleToFit)
+    }
 
-
+    // Only perform calculations if using features that require them (multiline, scaleToFit)
     if (width || scaleToFit) {
       return wordsWithWidth.reduce(function (result, _ref) {
         var word = _ref.word,
-            wordWidth = _ref.wordWidth;
+          wordWidth = _ref.wordWidth;
         var currentLine = result[result.length - 1];
-
         if (currentLine && (width == null || scaleToFit || (currentLine.width || 0) + wordWidth + spaceWidth < width)) {
@@ -79,7 +74,5 @@ // Word can be added to an existing line
         }
-
         return result;
       }, []);
     }
-
     return [{
@@ -95,10 +88,8 @@ words: children == null ? [] : children.toString().split(/(?:(?!\u00A0+)\s+)/)
     var transforms = [];
-
     if (isXOrYNotValid) {
       return '';
     }
-
     if (isNumber(x) && isNumber(y) && isNumber(width) && scaleToFit && wordsByLines.length > 0) {
       var lineWidth = wordsByLines[0].width || 1;
-      var sx = width / lineWidth;
+      var sx = scaleToFit === 'shrink-only' ? Math.min(width / lineWidth, 1) : width / lineWidth;
       var sy = sx;
@@ -109,7 +100,5 @@ var originX = x - sx * x;
     }
-
     if (angle) {
       transforms.push("rotate(" + angle + ", " + x + ", " + y + ")");
     }
-
     return transforms.length > 0 ? transforms.join(' ') : '';
@@ -116,0 +105,0 @@ }, [isXOrYNotValid, x, y, width, scaleToFit, wordsByLines, angle]);

esm/Text.js

@@ -1,9 +0,6 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+var _excluded = ["dx", "dy", "textAnchor", "innerRef", "innerTextRef", "verticalAnchor", "angle", "lineHeight", "scaleToFit", "capHeight", "width"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 import React from 'react';
 import useText from './hooks/useText';
-import { TextProps } from './types';
-export { TextProps } from './types';
 var SVG_STYLE = {
@@ -14,28 +11,25 @@ overflow: 'visible'
   var _props$dx = props.dx,
-      dx = _props$dx === void 0 ? 0 : _props$dx,
-      _props$dy = props.dy,
-      dy = _props$dy === void 0 ? 0 : _props$dy,
-      _props$textAnchor = props.textAnchor,
-      textAnchor = _props$textAnchor === void 0 ? 'start' : _props$textAnchor,
-      innerRef = props.innerRef,
-      innerTextRef = props.innerTextRef,
-      verticalAnchor = props.verticalAnchor,
-      angle = props.angle,
-      _props$lineHeight = props.lineHeight,
-      lineHeight = _props$lineHeight === void 0 ? '1em' : _props$lineHeight,
-      _props$scaleToFit = props.scaleToFit,
-      scaleToFit = _props$scaleToFit === void 0 ? false : _props$scaleToFit,
-      capHeight = props.capHeight,
-      width = props.width,
-      textProps = _objectWithoutPropertiesLoose(props, ["dx", "dy", "textAnchor", "innerRef", "innerTextRef", "verticalAnchor", "angle", "lineHeight", "scaleToFit", "capHeight", "width"]);
-
+    dx = _props$dx === void 0 ? 0 : _props$dx,
+    _props$dy = props.dy,
+    dy = _props$dy === void 0 ? 0 : _props$dy,
+    _props$textAnchor = props.textAnchor,
+    textAnchor = _props$textAnchor === void 0 ? 'start' : _props$textAnchor,
+    innerRef = props.innerRef,
+    innerTextRef = props.innerTextRef,
+    verticalAnchor = props.verticalAnchor,
+    angle = props.angle,
+    _props$lineHeight = props.lineHeight,
+    lineHeight = _props$lineHeight === void 0 ? '1em' : _props$lineHeight,
+    _props$scaleToFit = props.scaleToFit,
+    scaleToFit = _props$scaleToFit === void 0 ? false : _props$scaleToFit,
+    capHeight = props.capHeight,
+    width = props.width,
+    textProps = _objectWithoutPropertiesLoose(props, _excluded);
   var _textProps$x = textProps.x,
-      x = _textProps$x === void 0 ? 0 : _textProps$x,
-      fontSize = textProps.fontSize;
-
+    x = _textProps$x === void 0 ? 0 : _textProps$x,
+    fontSize = textProps.fontSize;
   var _useText = useText(props),
-      wordsByLines = _useText.wordsByLines,
-      startDy = _useText.startDy,
-      transform = _useText.transform;
-
+    wordsByLines = _useText.wordsByLines,
+    startDy = _useText.startDy,
+    transform = _useText.transform;
   return /*#__PURE__*/React.createElement("svg", {
@@ -42,0 +36,0 @@ ref: innerRef,

esm/util/getStringWidth.js

 import memoize from 'lodash/memoize';
 var MEASUREMENT_ELEMENT_ID = '__react_svg_text_measurement_id';
-
 function getStringWidth(str, style) {
@@ -8,5 +7,5 @@ try {
     var textEl = document.getElementById(MEASUREMENT_ELEMENT_ID);
-
     if (!textEl) {
       var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+      svg.setAttribute('aria-hidden', 'true');
       svg.style.width = '0';
@@ -22,3 +21,2 @@ svg.style.height = '0';
     }
-
     Object.assign(textEl.style, style);
@@ -31,5 +29,4 @@ textEl.textContent = str;
 }
-
 export default memoize(getStringWidth, function (str, style) {
   return str + "_" + JSON.stringify(style);
 });

lib/hooks/useText.js

@@ -5,76 +5,63 @@ "use strict";
 exports.default = useText;
-
-var _react = _interopRequireWildcard(require("react"));
-
+var _react = require("react");
 var _reduceCssCalc = _interopRequireDefault(require("reduce-css-calc"));
-
 var _getStringWidth = _interopRequireDefault(require("../util/getStringWidth"));
-
+var _excluded = ["verticalAnchor", "scaleToFit", "angle", "width", "lineHeight", "capHeight", "children", "style"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 function isNumber(val) {
   return typeof val === 'number';
 }
-
 function isXOrYInValid(xOrY) {
-  return (// number that is not NaN or Infinity
-    typeof xOrY === 'number' && Number.isFinite(xOrY) || // for percentage
+  return (
+    // number that is not NaN or Infinity
+    typeof xOrY === 'number' && Number.isFinite(xOrY) ||
+    // for percentage
     typeof xOrY === 'string'
   );
 }
-
 function useText(props) {
   var _props$verticalAnchor = props.verticalAnchor,
-      verticalAnchor = _props$verticalAnchor === void 0 ? 'end' : _props$verticalAnchor,
-      _props$scaleToFit = props.scaleToFit,
-      scaleToFit = _props$scaleToFit === void 0 ? false : _props$scaleToFit,
-      angle = props.angle,
-      width = props.width,
-      _props$lineHeight = props.lineHeight,
-      lineHeight = _props$lineHeight === void 0 ? '1em' : _props$lineHeight,
-      _props$capHeight = props.capHeight,
-      capHeight = _props$capHeight === void 0 ? '0.71em' : _props$capHeight,
-      children = props.children,
-      style = props.style,
-      textProps = _objectWithoutPropertiesLoose(props, ["verticalAnchor", "scaleToFit", "angle", "width", "lineHeight", "capHeight", "children", "style"]);
-
+    verticalAnchor = _props$verticalAnchor === void 0 ? 'end' : _props$verticalAnchor,
+    _props$scaleToFit = props.scaleToFit,
+    scaleToFit = _props$scaleToFit === void 0 ? false : _props$scaleToFit,
+    angle = props.angle,
+    width = props.width,
+    _props$lineHeight = props.lineHeight,
+    lineHeight = _props$lineHeight === void 0 ? '1em' : _props$lineHeight,
+    _props$capHeight = props.capHeight,
+    capHeight = _props$capHeight === void 0 ? '0.71em' : _props$capHeight,
+    children = props.children,
+    style = props.style,
+    textProps = _objectWithoutPropertiesLoose(props, _excluded);
   var _textProps$x = textProps.x,
-      x = _textProps$x === void 0 ? 0 : _textProps$x,
-      _textProps$y = textProps.y,
-      y = _textProps$y === void 0 ? 0 : _textProps$y;
+    x = _textProps$x === void 0 ? 0 : _textProps$x,
+    _textProps$y = textProps.y,
+    y = _textProps$y === void 0 ? 0 : _textProps$y;
   var isXOrYNotValid = !isXOrYInValid(x) || !isXOrYInValid(y);
-
   var _useMemo = (0, _react.useMemo)(function () {
-    var words = children == null ? [] : children.toString().split(/(?:(?!\u00A0+)\s+)/);
-    return {
-      wordsWithWidth: words.map(function (word) {
-        return {
-          word: word,
-          wordWidth: (0, _getStringWidth.default)(word, style) || 0
-        };
-      }),
-      spaceWidth: (0, _getStringWidth.default)("\xA0", style) || 0
-    };
-  }, [children, style]),
-      wordsWithWidth = _useMemo.wordsWithWidth,
-      spaceWidth = _useMemo.spaceWidth;
-
+      var words = children == null ? [] : children.toString().split(/(?:(?!\u00A0+)\s+)/);
+      return {
+        wordsWithWidth: words.map(function (word) {
+          return {
+            word: word,
+            wordWidth: (0, _getStringWidth.default)(word, style) || 0
+          };
+        }),
+        spaceWidth: (0, _getStringWidth.default)("\xA0", style) || 0
+      };
+    }, [children, style]),
+    wordsWithWidth = _useMemo.wordsWithWidth,
+    spaceWidth = _useMemo.spaceWidth;
   var wordsByLines = (0, _react.useMemo)(function () {
     if (isXOrYNotValid) {
       return [];
-    } // Only perform calculations if using features that require them (multiline, scaleToFit)
+    }
 
-
+    // Only perform calculations if using features that require them (multiline, scaleToFit)
     if (width || scaleToFit) {
       return wordsWithWidth.reduce(function (result, _ref) {
         var word = _ref.word,
-            wordWidth = _ref.wordWidth;
+          wordWidth = _ref.wordWidth;
         var currentLine = result[result.length - 1];
-
         if (currentLine && (width == null || scaleToFit || (currentLine.width || 0) + wordWidth + spaceWidth < width)) {
@@ -93,7 +80,5 @@ // Word can be added to an existing line
         }
-
         return result;
       }, []);
     }
-
     return [{
@@ -109,10 +94,8 @@ words: children == null ? [] : children.toString().split(/(?:(?!\u00A0+)\s+)/)
     var transforms = [];
-
     if (isXOrYNotValid) {
       return '';
     }
-
     if (isNumber(x) && isNumber(y) && isNumber(width) && scaleToFit && wordsByLines.length > 0) {
       var lineWidth = wordsByLines[0].width || 1;
-      var sx = width / lineWidth;
+      var sx = scaleToFit === 'shrink-only' ? Math.min(width / lineWidth, 1) : width / lineWidth;
       var sy = sx;
@@ -123,7 +106,5 @@ var originX = x - sx * x;
     }
-
     if (angle) {
       transforms.push("rotate(" + angle + ", " + x + ", " + y + ")");
     }
-
     return transforms.length > 0 ? transforms.join(' ') : '';
@@ -130,0 +111,0 @@ }, [isXOrYNotValid, x, y, width, scaleToFit, wordsByLines, angle]);

lib/index.js

@@ -10,23 +10,15 @@ "use strict";
 exports.useText = exports.getStringWidth = exports.Text = void 0;
-
 var _Text = _interopRequireDefault(require("./Text"));
-
 exports.Text = _Text.default;
-
 var _getStringWidth = _interopRequireDefault(require("./util/getStringWidth"));
-
 exports.getStringWidth = _getStringWidth.default;
-
 var _useText = _interopRequireDefault(require("./hooks/useText"));
-
 exports.useText = _useText.default;
-
 var _types = require("./types");
-
 Object.keys(_types).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _types[key]) return;
   exports[key] = _types[key];
 });
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

lib/Text.d.ts

 /// <reference types="react" />
-import { TextProps } from './types';
-export { TextProps } from './types';
+import type { TextProps as TxtProps } from './types';
+export declare type TextProps = TxtProps;
 export default function Text(props: TextProps): JSX.Element;
 //# sourceMappingURL=Text.d.ts.map

lib/Text.js

@@ -5,49 +5,36 @@ "use strict";
 exports.default = Text;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _useText2 = _interopRequireDefault(require("./hooks/useText"));
-
-var _types = require("./types");
-
-exports.TextProps = _types.TextProps;
-
+var _excluded = ["dx", "dy", "textAnchor", "innerRef", "innerTextRef", "verticalAnchor", "angle", "lineHeight", "scaleToFit", "capHeight", "width"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 var SVG_STYLE = {
   overflow: 'visible'
 };
-
 function Text(props) {
   var _props$dx = props.dx,
-      dx = _props$dx === void 0 ? 0 : _props$dx,
-      _props$dy = props.dy,
-      dy = _props$dy === void 0 ? 0 : _props$dy,
-      _props$textAnchor = props.textAnchor,
-      textAnchor = _props$textAnchor === void 0 ? 'start' : _props$textAnchor,
-      innerRef = props.innerRef,
-      innerTextRef = props.innerTextRef,
-      verticalAnchor = props.verticalAnchor,
-      angle = props.angle,
-      _props$lineHeight = props.lineHeight,
-      lineHeight = _props$lineHeight === void 0 ? '1em' : _props$lineHeight,
-      _props$scaleToFit = props.scaleToFit,
-      scaleToFit = _props$scaleToFit === void 0 ? false : _props$scaleToFit,
-      capHeight = props.capHeight,
-      width = props.width,
-      textProps = _objectWithoutPropertiesLoose(props, ["dx", "dy", "textAnchor", "innerRef", "innerTextRef", "verticalAnchor", "angle", "lineHeight", "scaleToFit", "capHeight", "width"]);
-
+    dx = _props$dx === void 0 ? 0 : _props$dx,
+    _props$dy = props.dy,
+    dy = _props$dy === void 0 ? 0 : _props$dy,
+    _props$textAnchor = props.textAnchor,
+    textAnchor = _props$textAnchor === void 0 ? 'start' : _props$textAnchor,
+    innerRef = props.innerRef,
+    innerTextRef = props.innerTextRef,
+    verticalAnchor = props.verticalAnchor,
+    angle = props.angle,
+    _props$lineHeight = props.lineHeight,
+    lineHeight = _props$lineHeight === void 0 ? '1em' : _props$lineHeight,
+    _props$scaleToFit = props.scaleToFit,
+    scaleToFit = _props$scaleToFit === void 0 ? false : _props$scaleToFit,
+    capHeight = props.capHeight,
+    width = props.width,
+    textProps = _objectWithoutPropertiesLoose(props, _excluded);
   var _textProps$x = textProps.x,
-      x = _textProps$x === void 0 ? 0 : _textProps$x,
-      fontSize = textProps.fontSize;
-
+    x = _textProps$x === void 0 ? 0 : _textProps$x,
+    fontSize = textProps.fontSize;
   var _useText = (0, _useText2.default)(props),
-      wordsByLines = _useText.wordsByLines,
-      startDy = _useText.startDy,
-      transform = _useText.transform;
-
+    wordsByLines = _useText.wordsByLines,
+    startDy = _useText.startDy,
+    transform = _useText.transform;
   return /*#__PURE__*/_react.default.createElement("svg", {
@@ -54,0 +41,0 @@ ref: innerRef,

lib/types.d.ts

@@ -1,4 +0,4 @@
-/// <reference types="react" />
-declare type SVGTSpanProps = React.SVGAttributes<SVGTSpanElement>;
-declare type SVGTextProps = React.SVGAttributes<SVGTextElement>;
+import { CSSProperties, Ref, SVGAttributes } from 'react';
+declare type SVGTSpanProps = SVGAttributes<SVGTSpanElement>;
+declare type SVGTextProps = SVGAttributes<SVGTextElement>;
 declare type OwnProps = {
@@ -8,3 +8,3 @@ /** className to apply to the SVGText element. */
     /** Whether to scale the fontSize to accommodate the specified width.  */
-    scaleToFit?: boolean;
+    scaleToFit?: boolean | 'shrink-only';
     /** Rotational angle of the text. */
@@ -17,7 +17,7 @@ angle?: number;
     /** Styles to be applied to the text (and used in computation of its size). */
-    style?: React.CSSProperties;
+    style?: CSSProperties;
     /** Ref passed to the Text SVG element. */
-    innerRef?: React.Ref<SVGSVGElement>;
+    innerRef?: Ref<SVGSVGElement>;
     /** Ref passed to the Text text element */
-    innerTextRef?: React.Ref<SVGTextElement>;
+    innerTextRef?: Ref<SVGTextElement>;
     /** x position of the text. */
@@ -24,0 +24,0 @@ x?: string | number;

lib/types.js

@@ -1,1 +0,3 @@
-"use strict";
+"use strict";
+
+exports.__esModule = true;

lib/util/getStringWidth.js

@@ -5,9 +5,5 @@ "use strict";
 exports.default = void 0;
-
 var _memoize = _interopRequireDefault(require("lodash/memoize"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 var MEASUREMENT_ELEMENT_ID = '__react_svg_text_measurement_id';
-
 function getStringWidth(str, style) {
@@ -17,5 +13,5 @@ try {
     var textEl = document.getElementById(MEASUREMENT_ELEMENT_ID);
-
     if (!textEl) {
       var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+      svg.setAttribute('aria-hidden', 'true');
       svg.style.width = '0';
@@ -31,3 +27,2 @@ svg.style.height = '0';
     }
-
     Object.assign(textEl.style, style);
@@ -40,7 +35,5 @@ textEl.textContent = str;
 }
-
 var _default = (0, _memoize.default)(getStringWidth, function (str, style) {
   return str + "_" + JSON.stringify(style);
 });
-
 exports.default = _default;

package.json

 {
   "name": "@visx/text",
-  "version": "3.0.0-alpha.0",
+  "version": "3.0.0",
   "description": "visx text",
@@ -31,6 +31,6 @@ "sideEffects": false,
   "dependencies": {
-    "@types/lodash": "^4.14.160",
+    "@types/lodash": "^4.14.172",
     "@types/react": "*",
     "classnames": "^2.3.1",
-    "lodash": "^4.17.20",
+    "lodash": "^4.17.21",
     "prop-types": "^15.7.2",
@@ -40,3 +40,3 @@ "reduce-css-calc": "^1.3.0"
   "peerDependencies": {
-    "react": "^16.3.0-0 || ^17.0.0-0"
+    "react": "^16.3.0-0 || ^17.0.0-0 || ^18.0.0-0"
   },
@@ -47,5 +47,5 @@ "publishConfig": {
   "devDependencies": {
-    "@testing-library/react-hooks": "^3.4.2"
+    "@testing-library/react-hooks": "^8.0.0"
   },
-  "gitHead": "2f2fb26030b5f1328803b2bd7de171d66e088aff"
+  "gitHead": "2fbffbaee80b88302274266112f8ad9a241def33"
 }

Readme.md

@@ -23,3 +23,4 @@ # @visx/text
 import React from 'react';
-import { render } from 'react-dom';
+// note: react@18 syntax
+import { createRoot } from 'react-dom/client';
 import { Text } from '@visx/text';
@@ -33,3 +34,5 @@
 
-render(<App />, document.getElementById('root'));
+const root = createRoot(document.getElementById('root'));
+
+root.render(<App />);
 ```
@@ -36,0 +39,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Lines of code

484

increased by1.26%

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

43

increased by7.5%

Worsened metrics

Total package byte prevSize

27454

decreased by-2.43%

Dependency changes

• + Addedreact@18.3.1(transitive)

• - Removedreact@17.0.2(transitive)

• Updated@types/lodash@^4.14.172

• Updatedlodash@^4.17.21