react-inlinesvg - npm Package Compare versions

Comparing version 4.0.3 to 4.0.4

dist/index.d.ts

@@ -74,1 +74,2 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 export { ErrorCallback, FetchError, LoadCallback, PlainObject, PreProcessorCallback, Props, State, Status, StorageItem, cacheStore, InlineSVG as default };
+export = InlineSVG

dist/index.js

@@ -67,3 +67,3 @@ "use strict";
   const contentType = response.headers.get("content-type");
-  const [fileType] = (contentType || "").split(/ ?; ?/);
+  const [fileType] = (contentType ?? "").split(/ ?; ?/);
   if (response.status > 299) {
@@ -282,3 +282,3 @@ throw new Error("Not found");
     };
-    this.hash = props.uniqueHash || randomString(8);
+    this.hash = props.uniqueHash ?? randomString(8);
   }
@@ -355,3 +355,3 @@ componentDidMount() {
         const originalDesc = svg.querySelector("desc");
-        if (originalDesc && originalDesc.parentNode) {
+        if (originalDesc?.parentNode) {
           originalDesc.parentNode.removeChild(originalDesc);
@@ -365,3 +365,3 @@ }
         const originalTitle = svg.querySelector("title");
-        if (originalTitle && originalTitle.parentNode) {
+        if (originalTitle?.parentNode) {
           originalTitle.parentNode.removeChild(originalTitle);
@@ -391,3 +391,3 @@ }
           const { cacheRequests, fetchOptions, src } = this.props;
-          const dataURI = src.match(/^data:image\/svg[^,]*?(;base64)?,(.*)/u);
+          const dataURI = /^data:image\/svg[^,]*?(;base64)?,(.*)/u.exec(src);
           let inlineSrc;
@@ -434,7 +434,7 @@ if (dataURI) {
     [...node.children].forEach((d) => {
-      if (d.attributes && d.attributes.length) {
+      if (d.attributes?.length) {
         const attributes = Object.values(d.attributes).map((a) => {
           const attribute = a;
-          const match = a.value.match(/url\((.*?)\)/);
-          if (match && match[1]) {
+          const match = /url\((.*?)\)/.exec(a.value);
+          if (match?.[1]) {
             attribute.value = a.value.replace(match[0], `url(${baseURL}${match[1]}__${this.hash})`);
@@ -518,2 +518,8 @@ }
 });
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map
+// fix-cjs-exports
+if (module.exports.default) {
+  Object.assign(module.exports.default, module.exports);
+  module.exports = module.exports.default;
+  delete module.exports.default;
+}

dist/provider.d.ts

@@ -10,1 +10,2 @@ import { JSX } from 'react';
 export { CacheProvider as default };
+export = CacheProvider

dist/provider.js

@@ -40,2 +40,8 @@ "use strict";
 }
-//# sourceMappingURL=provider.js.map
+//# sourceMappingURL=provider.js.map
+// fix-cjs-exports
+if (module.exports.default) {
+  Object.assign(module.exports.default, module.exports);
+  module.exports = module.exports.default;
+  delete module.exports.default;
+}

package.json

 {
   "name": "react-inlinesvg",
-  "version": "4.0.3",
+  "version": "4.0.4",
   "description": "An SVG loader for React",
@@ -57,23 +57,24 @@ "author": "Gil Barbara <[e-mail]>",
   "devDependencies": {
-    "@gilbarbara/eslint-config": "^0.5.3",
-    "@gilbarbara/helpers": "^0.8.4",
+    "@gilbarbara/eslint-config": "^0.5.4",
+    "@gilbarbara/helpers": "^0.8.6",
     "@gilbarbara/prettier-config": "^1.0.0",
     "@gilbarbara/tsconfig": "^0.2.3",
     "@size-limit/preset-small-lib": "^8.2.6",
-    "@testing-library/jest-dom": "^6.1.2",
+    "@testing-library/jest-dom": "^6.1.3",
     "@testing-library/react": "^14.0.0",
     "@types/exenv": "^1.2.0",
-    "@types/fetch-mock": "^7.3.5",
-    "@types/jest": "^29.5.4",
-    "@types/node": "^20.5.6",
-    "@types/node-fetch": "^2.6.4",
-    "@types/react": "^18.2.21",
+    "@types/fetch-mock": "^7.3.6",
+    "@types/jest": "^29.5.5",
+    "@types/node": "^20.6.2",
+    "@types/node-fetch": "^2.6.5",
+    "@types/react": "^18.2.22",
     "@types/react-dom": "^18.2.7",
     "browser-cache-mock": "^0.1.7",
     "cross-fetch": "^4.0.0",
-    "del-cli": "^5.0.0",
+    "del-cli": "^5.1.0",
+    "fix-tsup-cjs": "^1.2.0",
     "http-server": "^14.1.1",
     "husky": "^8.0.3",
-    "jest": "^29.6.4",
-    "jest-environment-jsdom": "^29.6.4",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
     "jest-extended": "^4.0.1",
@@ -94,3 +95,3 @@ "jest-fetch-mock": "^3.0.3",
   "scripts": {
-    "build": "pnpm run clean && tsup",
+    "build": "pnpm run clean && tsup && fix-tsup-cjs",
     "watch": "tsup --watch",
@@ -97,0 +98,0 @@ "clean": "del dist/*",

README.md

@@ -72,4 +72,7 @@ # react-inlinesvg
 **innerRef** {React.Ref}  
-Set a ref in SVGElement.
+Set a ref in SVGElement.  
 
+>The SVG is processed and parsed so the ref won't be set on the initial render.
+You can use the `onLoad` callback to get and use the ref instead.
+
 **loader** {node}  
@@ -76,0 +79,0 @@ A component to be shown while the SVG is loading.

src/helpers.ts

@@ -14,3 +14,3 @@ import type { PlainObject } from './types';
   const contentType = response.headers.get('content-type');
-  const [fileType] = (contentType || '').split(/ ?; ?/);
+  const [fileType] = (contentType ?? '').split(/ ?; ?/);
 
@@ -17,0 +17,0 @@ if (response.status > 299) {

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

Improved metrics

Total package byte prevSize

124413

increased by0.22%

Lines of code

1667

increased by0.85%

Number of lines in readme file

201

increased by1.52%

Worsened metrics

Dev dependency count

35

increased by2.94%

No dependency changes