@readme/markdown 9.0.1 → 9.0.2

package/components/TailwindStyle/index.tsx

@@ -14,7 +14,7 @@ const traverse = (node: Node, callback: (element: Node) => void) => {
 const TailwindStyle = ({ children }: React.PropsWithChildren<unknown>) => {
   const [stylesheet, setStylesheet] = useState('');
   const classes = useRef(new Set<string>());
-  const ref = useRef<HTMLDivElement>(null);
+  const ref = useRef<HTMLStyleElement>(null);
 
   const addClasses = useCallback((element: Node) => {
     if (!(element instanceof HTMLElement)) return;
@@ -41,7 +41,7 @@ const TailwindStyle = ({ children }: React.PropsWithChildren<unknown>) => {
   useEffect(() => {
     if (!ref.current) return;
 
-    ref.current.querySelectorAll(`.${tailwindPrefix}`).forEach(child => traverse(child, addClasses));
+    ref.current.parentElement.querySelectorAll(`.${tailwindPrefix}`).forEach(child => traverse(child, addClasses));
     updateStylesheet();
   });
 
@@ -75,7 +75,7 @@ const TailwindStyle = ({ children }: React.PropsWithChildren<unknown>) => {
       });
     });
 
-    observer.observe(ref.current, {
+    observer.observe(ref.current.parentElement, {
       subtree: true,
       childList: true,
       attributes: true,
@@ -87,10 +87,12 @@ const TailwindStyle = ({ children }: React.PropsWithChildren<unknown>) => {
   }, [addClasses, updateStylesheet]);
 
   return (
-    <div ref={ref} style={{ display: 'contents' }}>
-      <style data-tailwind-stylesheet>{stylesheet}</style>
+    <>
+      <style ref={ref} data-tailwind-stylesheet>
+        {stylesheet}
+      </style>
       {children}
-    </div>
+    </>
   );
 };
 

package/dist/main.js

@@ -18776,7 +18776,7 @@ const TailwindStyle = ({ children }) => {
     (0,external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_.useEffect)(() => {
         if (!ref.current)
             return;
-        ref.current.querySelectorAll(`.${tailwindPrefix}`).forEach(child => traverse(child, addClasses));
+        ref.current.parentElement.querySelectorAll(`.${tailwindPrefix}`).forEach(child => traverse(child, addClasses));
         updateStylesheet();
     });
     /*
@@ -18807,7 +18807,7 @@ const TailwindStyle = ({ children }) => {
                 }
             });
         });
-        observer.observe(ref.current, {
+        observer.observe(ref.current.parentElement, {
             subtree: true,
             childList: true,
             attributes: true,
@@ -18816,8 +18816,8 @@ const TailwindStyle = ({ children }) => {
         // eslint-disable-next-line consistent-return
         return () => observer.disconnect();
     }, [addClasses, updateStylesheet]);
-    return (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("div", { ref: ref, style: { display: 'contents' } },
-        external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("style", { "data-tailwind-stylesheet": true }, stylesheet),
+    return (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement((external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default()).Fragment, null,
+        external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("style", { ref: ref, "data-tailwind-stylesheet": true }, stylesheet),
         children));
 };
 /* harmony default export */ const components_TailwindStyle = (TailwindStyle);

package/dist/main.node.js

@@ -21805,7 +21805,7 @@ const TailwindStyle = ({ children }) => {
     (0,external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_.useEffect)(() => {
         if (!ref.current)
             return;
-        ref.current.querySelectorAll(`.${tailwindPrefix}`).forEach(child => traverse(child, addClasses));
+        ref.current.parentElement.querySelectorAll(`.${tailwindPrefix}`).forEach(child => traverse(child, addClasses));
         updateStylesheet();
     });
     /*
@@ -21836,7 +21836,7 @@ const TailwindStyle = ({ children }) => {
                 }
             });
         });
-        observer.observe(ref.current, {
+        observer.observe(ref.current.parentElement, {
             subtree: true,
             childList: true,
             attributes: true,
@@ -21845,8 +21845,8 @@ const TailwindStyle = ({ children }) => {
         // eslint-disable-next-line consistent-return
         return () => observer.disconnect();
     }, [addClasses, updateStylesheet]);
-    return (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("div", { ref: ref, style: { display: 'contents' } },
-        external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("style", { "data-tailwind-stylesheet": true }, stylesheet),
+    return (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement((external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default()).Fragment, null,
+        external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("style", { ref: ref, "data-tailwind-stylesheet": true }, stylesheet),
         children));
 };
 /* harmony default export */ const components_TailwindStyle = (TailwindStyle);