@acusti/styling 0.5.2-alpha → 0.5.3

package/dist/Style.d.ts

@@ -2,5 +2,5 @@
 declare type Props = {
     children: string;
 };
-declare const Style: ({ children: styles }: Props) => JSX.Element | null;
+declare const Style: ({ children }: Props) => JSX.Element | null;
 export default Style;

package/dist/Style.js

@@ -1,21 +1,10 @@
 import * as React from 'react';
 import { unregisterStyles, updateStyles } from './style-registry.js';
-const { useCallback, useEffect, useRef, useState } = React;
-const makeMinifyStyles = () => {
-    let lastStyles = '';
-    let lastMinified = '';
-    return (styles) => {
-        if (styles === lastStyles)
-            return lastMinified;
-        lastStyles = styles;
-        lastMinified = styles.replace(/\s+/gm, ' ');
-        return lastMinified;
-    };
-};
-const Style = ({ children: styles }) => {
+const { useCallback, useEffect, useMemo, useRef, useState } = React;
+const Style = ({ children }) => {
+    // Minify CSS styles by replacing consecutive whitespace (including \n) with ' '
+    const styles = useMemo(() => children.replace(/\s+/gm, ' '), [children]);
     const [ownerDocument, setOwnerDocument] = useState(null);
-    const minifyStylesRef = useRef(makeMinifyStyles());
-    styles = minifyStylesRef.current(styles);
     useEffect(() => () => {
         if (!ownerDocument)
             return;

package/dist/Style.js.map

@@ -1 +1 @@
-{"version":3,"file":"Style.js","sourceRoot":"","sources":["../src/Style.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAErE,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;AAM3D,MAAM,gBAAgB,GAAG,GAAG,EAAE;IAC1B,IAAI,UAAU,GAAG,EAAE,CAAC;IACpB,IAAI,YAAY,GAAG,EAAE,CAAC;IACtB,OAAO,CAAC,MAAc,EAAE,EAAE;QACtB,IAAI,MAAM,KAAK,UAAU;YAAE,OAAO,YAAY,CAAC;QAC/C,UAAU,GAAG,MAAM,CAAC;QACpB,YAAY,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;QAC5C,OAAO,YAAY,CAAC;IACxB,CAAC,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAS,EAAE,EAAE;IAC1C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAkB,IAAI,CAAC,CAAC;IAC1E,MAAM,eAAe,GAAG,MAAM,CAAC,gBAAgB,EAAE,CAAC,CAAC;IACnD,MAAM,GAAG,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IAEzC,SAAS,CACL,GAAG,EAAE,CAAC,GAAG,EAAE;QACP,IAAI,CAAC,aAAa;YAAE,OAAO;QAC3B,gBAAgB,CAAC,EAAE,aAAa,EAAE,MAAM,EAAE,CAAC,CAAC;IAChD,CAAC,EACD,CAAC,aAAa,CAAC,CAClB,CAAC;IAEF,MAAM,iBAAiB,GAAG,MAAM,CAAS,EAAE,CAAC,CAAC;IAE7C,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,CAAC,aAAa;YAAE,OAAO;QAE3B,YAAY,CAAC;YACT,aAAa;YACb,cAAc,EAAE,iBAAiB,CAAC,OAAO;YACzC,MAAM;SACT,CAAC,CAAC;QAEH,iBAAiB,CAAC,OAAO,GAAG,MAAM,CAAC;IACvC,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC;IAE5B,MAAM,SAAS,GAAG,WAAW,CAAC,CAAC,OAA2B,EAAE,EAAE;QAC1D,IAAI,CAAC,OAAO;YAAE,OAAO;QACrB,gBAAgB,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IAC5C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,aAAa;QAAE,OAAO,IAAI,CAAC;IAE/B,OAAO,CACH,+BACI,uBAAuB,EAAE;YACrB,MAAM,EAAE,MAAM;SACjB,EACD,GAAG,EAAE,SAAS,GAChB,CACL,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Style.js","sourceRoot":"","sources":["../src/Style.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAErE,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;AAMpE,MAAM,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAS,EAAE,EAAE;IAClC,gFAAgF;IAChF,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IACzE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAkB,IAAI,CAAC,CAAC;IAE1E,SAAS,CACL,GAAG,EAAE,CAAC,GAAG,EAAE;QACP,IAAI,CAAC,aAAa;YAAE,OAAO;QAC3B,gBAAgB,CAAC,EAAE,aAAa,EAAE,MAAM,EAAE,CAAC,CAAC;IAChD,CAAC,EACD,CAAC,aAAa,CAAC,CAClB,CAAC;IAEF,MAAM,iBAAiB,GAAG,MAAM,CAAS,EAAE,CAAC,CAAC;IAE7C,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,CAAC,aAAa;YAAE,OAAO;QAE3B,YAAY,CAAC;YACT,aAAa;YACb,cAAc,EAAE,iBAAiB,CAAC,OAAO;YACzC,MAAM;SACT,CAAC,CAAC;QAEH,iBAAiB,CAAC,OAAO,GAAG,MAAM,CAAC;IACvC,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC;IAE5B,MAAM,SAAS,GAAG,WAAW,CAAC,CAAC,OAA2B,EAAE,EAAE;QAC1D,IAAI,CAAC,OAAO;YAAE,OAAO;QACrB,gBAAgB,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IAC5C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,aAAa;QAAE,OAAO,IAAI,CAAC;IAE/B,OAAO,CACH,+BACI,uBAAuB,EAAE;YACrB,MAAM,EAAE,MAAM;SACjB,EACD,GAAG,EAAE,SAAS,GAChB,CACL,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@acusti/styling",
-    "version": "0.5.2-alpha",
+    "version": "0.5.3",
     "type": "module",
     "sideEffects": false,
     "exports": "./dist/index.js",

package/src/Style.tsx

@@ -2,27 +2,16 @@ import * as React from 'react';
 
 import { unregisterStyles, updateStyles } from './style-registry.js';
 
-const { useCallback, useEffect, useRef, useState } = React;
+const { useCallback, useEffect, useMemo, useRef, useState } = React;
 
 type Props = {
     children: string;
 };
 
-const makeMinifyStyles = () => {
-    let lastStyles = '';
-    let lastMinified = '';
-    return (styles: string) => {
-        if (styles === lastStyles) return lastMinified;
-        lastStyles = styles;
-        lastMinified = styles.replace(/\s+/gm, ' ');
-        return lastMinified;
-    };
-};
-
-const Style = ({ children: styles }: Props) => {
+const Style = ({ children }: Props) => {
+    // Minify CSS styles by replacing consecutive whitespace (including \n) with ' '
+    const styles = useMemo(() => children.replace(/\s+/gm, ' '), [children]);
     const [ownerDocument, setOwnerDocument] = useState<Document | null>(null);
-    const minifyStylesRef = useRef(makeMinifyStyles());
-    styles = minifyStylesRef.current(styles);
 
     useEffect(
         () => () => {