react-native-unistyles 3.0.0-alpha.43 → 3.0.0-alpha.45

package/src/web/shadowRegistry.ts

@@ -21,18 +21,18 @@ class UnistylesShadowRegistryBuilder {
     private hashMap = new Map<HTMLElement, string>()
     private classNamesMap = new Map<HTMLElement, Array<string>>()
 
-    add = (ref: any, _style: Array<Style>, _variants: Record<string, any> | undefined, _args: Array<Array<any>>) => {
-        // Style is not provided
-        if (!_style) {
+    add = (ref: any, styles: Array<Style>, _variants: Record<string, any> | undefined, _args: Array<Array<any>>) => {
+        // Styles are not provided
+        if (!styles) {
             return
         }
 
         // Ref is unmounted, remove style tags from the document
         if (ref === null) {
-            const secrets = extractSecrets(_style)
+            const secrets = extractSecrets(styles)
 
-            secrets.forEach(({ __uni__refs }) => {
-                __uni__refs.forEach(ref => {
+            if (secrets) {
+                secrets.__uni__refs.forEach(ref => {
                     if (isInDocument(ref)) {
                         return
                     }
@@ -45,7 +45,7 @@ class UnistylesShadowRegistryBuilder {
                         UnistylesRegistry.remove(oldResult)
                     }
                 })
-            })
+            }
 
             return
         }
@@ -55,56 +55,60 @@ class UnistylesShadowRegistryBuilder {
             return
         }
 
-        const styles = _style.filter(style => Object.keys(style ?? {}).some(key => key.startsWith('__uni__')))
+        const parsedStyles = styles.flat().flatMap((unistyleStyle, styleIndex) => {
+            if (!unistyleStyle) {
+                return []
+            }
 
-        // No unistyles
-        if (styles.length === 0) {
-            return
-        }
+            const secrets = extractSecrets(unistyleStyle)
 
-        const parsedStyles = styles.flatMap((style, styleIndex) => extractSecrets(style).map(secret => {
-            const { __uni__key, __uni__stylesheet, __uni__variants, __uni__args = [], __uni__refs } = secret
-            const newComputedStylesheet = UnistylesRegistry.getComputedStylesheet(__uni__stylesheet)
-            const style = newComputedStylesheet[__uni__key] as (UnistylesValues | ((...args: any) => UnistylesValues))
-            const variants = _variants && Object.keys(_variants).length > 0 ? _variants : __uni__variants
-            const args = _args[styleIndex] && _args[styleIndex].length > 0 ? _args[styleIndex] : __uni__args
-            const result = typeof style === 'function'
-                ? style(...args)
-                : style
-            const { variantsResult } = Object.fromEntries(getVariants({ variantsResult: result }, variants))
-            const resultWithVariants = deepMergeObjects(result, variantsResult ?? {})
-            const dependencies = extractUnistyleDependencies(resultWithVariants)
-
-            if (typeof __uni__stylesheet === 'function') {
-                // Add dependencies from dynamic styles to stylesheet
-                UnistylesRegistry.addDependenciesToStylesheet(__uni__stylesheet, dependencies)
+            // Regular style
+            if (!secrets) {
+                return unistyleStyle as UnistylesValues
             }
 
-            __uni__refs.add(ref)
+            const { __uni__key, __uni__stylesheet, __uni__variants, __uni__args = [], __uni__refs } = secrets
+                const newComputedStylesheet = UnistylesRegistry.getComputedStylesheet(__uni__stylesheet)
+                const style = newComputedStylesheet[__uni__key] as (UnistylesValues | ((...args: any) => UnistylesValues))
+                const variants = _variants && Object.keys(_variants).length > 0 ? _variants : __uni__variants
+                const args = _args[styleIndex] && _args[styleIndex].length > 0 ? _args[styleIndex] : __uni__args
+                const result = typeof style === 'function'
+                    ? style(...args)
+                    : style
+                const { variantsResult } = Object.fromEntries(getVariants({ variantsResult: result }, variants))
+                const resultWithVariants = deepMergeObjects(result, variantsResult ?? {})
+                const dependencies = extractUnistyleDependencies(resultWithVariants)
 
-            const dispose = UnistylesListener.addListeners(extractUnistyleDependencies(resultWithVariants), () => {
-                const hash = this.hashMap.get(ref)
+                if (typeof __uni__stylesheet === 'function') {
+                    // Add dependencies from dynamic styles to stylesheet
+                    UnistylesRegistry.addDependenciesToStylesheet(__uni__stylesheet, dependencies)
+                }
 
-                // Dispose listener if there is no hash
-                if (!hash) {
-                    dispose()
+                __uni__refs.add(ref)
 
-                    return
-                }
+                const dispose = UnistylesListener.addListeners(extractUnistyleDependencies(resultWithVariants), () => {
+                    const hash = this.hashMap.get(ref)
 
-                const newComputedStyleSheet = UnistylesRegistry.getComputedStylesheet(__uni__stylesheet)
-                const newValue = newComputedStyleSheet[__uni__key] as (UnistylesValues | ((...args: any) => UnistylesValues))
-                const result = typeof newValue === 'function'
-                    ? newValue(...args)
-                    : newValue
-                const { variantsResult } = Object.fromEntries(getVariants({ variantsResult: result }, variants))
-                const resultWithVariants = deepMergeObjects(result, variantsResult ?? {})
+                    // Dispose listener if there is no hash
+                    if (!hash) {
+                        dispose()
 
-                UnistylesRegistry.applyStyles(hash, convertUnistyles(resultWithVariants))
-            })
+                        return
+                    }
+
+                    const newComputedStyleSheet = UnistylesRegistry.getComputedStylesheet(__uni__stylesheet)
+                    const newValue = newComputedStyleSheet[__uni__key] as (UnistylesValues | ((...args: any) => UnistylesValues))
+                    const result = typeof newValue === 'function'
+                        ? newValue(...args)
+                        : newValue
+                    const { variantsResult } = Object.fromEntries(getVariants({ variantsResult: result }, variants))
+                    const resultWithVariants = deepMergeObjects(result, variantsResult ?? {})
+
+                    UnistylesRegistry.applyStyles(hash, convertUnistyles(resultWithVariants))
+                })
 
-            return resultWithVariants as UnistylesValues
-        }))
+                return resultWithVariants as UnistylesValues
+        })
         const combinedStyles = deepMergeObjects(...parsedStyles)
         const oldStyles = this.resultsMap.get(ref)
 

package/src/web/utils/unistyle.ts

@@ -25,21 +25,13 @@ export type UnistyleSecrets = {
 
 export const assignSecrets = <T>(object: T, secrets: UnistyleSecrets) => {
     // @ts-expect-error - assign secrets to object
-    object[`__uni__secrets__${Math.random().toString(16).slice(2)}`] = secrets
+    object.__uni__secrets__ = secrets
 
     return object
 }
 
 export const extractSecrets = (object: any) => {
-    const secrets = Object.entries(object).reduce((acc, [key, value]) => {
-        if (key.startsWith('__uni__secrets__')) {
-            acc.push(value as UnistyleSecrets)
-        }
-
-        return acc
-    }, [] as Array<UnistyleSecrets>)
-
-    return secrets
+    return keyInObject(object, '__uni__secrets__') ? object.__uni__secrets__ as UnistyleSecrets : undefined
 }
 
 export const getStyles = (values: UnistylesValues) => {