@snack-uikit/icons 0.22.0 → 0.22.1

package/CHANGELOG.md

@@ -3,6 +3,19 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.22.1 (2024-09-23)
+
+
+### Bug Fixes
+
+* **FF-3788:** updated typescript to v5 ([89e3338](https://github.com/cloud-ru-tech/snack-uikit/commit/89e3338a3ef4df24e4c20d9a9c8cd16e7934ba63))
+* **PDS-480:** remove direct usage of browser api elements ([1231ff7](https://github.com/cloud-ru-tech/snack-uikit/commit/1231ff7ab7a1b210b579a7b694633ef23bffcf44))
+* **PDS-480:** replace useLayoutEffect -> useIsomorphicLayoutEffect for ssr ([21aa9ad](https://github.com/cloud-ru-tech/snack-uikit/commit/21aa9ad9f113e465766339d396924357ccb1d432))
+
+
+
+
+
 # 0.22.0 (2024-07-19)
 
 
@@ -261,7 +274,8 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
 
 ## 0.6.1 (2023-06-23)
 
-**Note:** Version bump only for package @snack-uikit/icons
+### Only dependencies have been changed
+* [@snack-uikit/utils@3.4.0](https://github.com/cloud-ru-tech/snack-uikit/blob/master/packages/utils/CHANGELOG.md)
 
 
 

package/dist/Sprite.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare function SpriteInner({ content }: {
     content: string;
 }): null;

package/dist/Sprite.js

@@ -1,16 +1,24 @@
-import { useLayoutEffect, useState, memo } from 'react';
+import { memo, useState } from 'react';
+import { useLayoutEffect } from '@snack-uikit/utils';
 function SpriteInner({ content }) {
-    const [div] = useState(() => document.createElement('div'));
+    const [div, setDiv] = useState();
     useLayoutEffect(() => {
-        div.style.display = 'none';
-        document.body.prepend(div);
-        return () => {
-            document.body.removeChild(div);
-        };
+        setDiv(document.createElement('div'));
     }, []);
     useLayoutEffect(() => {
-        div.innerHTML = content;
-    }, [content]);
+        if (div) {
+            div.style.display = 'none';
+            document.body.prepend(div);
+            return () => {
+                document.body.removeChild(div);
+            };
+        }
+    }, [div]);
+    useLayoutEffect(() => {
+        if (div) {
+            div.innerHTML = content;
+        }
+    }, [content, div]);
     return null;
 }
 export const Sprite = memo(SpriteInner);

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Icons",
-  "version": "0.22.0",
+  "version": "0.22.1",
   "sideEffects": [
     "*.svg",
     "*.css",
@@ -40,6 +40,9 @@
     "build:interface-icons": "npm run fix:icons --directory=interface-icons && npm run build:icons --directory=interface-icons",
     "compile": "npm run validate:icons && npm run build:interface-icons && npm run create-export-index-file && npm run create-sprite"
   },
+  "dependencies": {
+    "@snack-uikit/utils": "3.4.0"
+  },
   "devDependencies": {
     "@svgr/cli": "8.1.0",
     "@svgr/plugin-jsx": "8.1.0",
@@ -49,5 +52,5 @@
     "svg-sprite": "2.0.2",
     "svgo": "3.1.0"
   },
-  "gitHead": "4c153b54a2902cf20883d85b4dc753344313c6cb"
+  "gitHead": "f9212fe04b0dbba9bedea1bb3a034ab612287841"
 }

package/src/Sprite.tsx

@@ -1,20 +1,30 @@
-import { useLayoutEffect, useState, memo } from 'react';
+import { memo, useState } from 'react';
+
+import { useLayoutEffect } from '@snack-uikit/utils';
 
 function SpriteInner({ content }: { content: string }) {
-  const [div] = useState(() => document.createElement('div'));
+  const [div, setDiv] = useState<HTMLDivElement>();
 
   useLayoutEffect(() => {
-    div.style.display = 'none';
-    document.body.prepend(div);
-
-    return () => {
-      document.body.removeChild(div);
-    };
+    setDiv(document.createElement('div'));
   }, []);
 
   useLayoutEffect(() => {
-    div.innerHTML = content;
-  }, [content]);
+    if (div) {
+      div.style.display = 'none';
+      document.body.prepend(div);
+
+      return () => {
+        document.body.removeChild(div);
+      };
+    }
+  }, [div]);
+
+  useLayoutEffect(() => {
+    if (div) {
+      div.innerHTML = content;
+    }
+  }, [content, div]);
 
   return null;
 }