feat: copy variants to stylesheet

jpudysz · Dec 22, 2024 · b3b10c4 · b3b10c4
1 parent f8a137e
commit b3b10c4
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 24 deletions.
diff --git a/src/web/create.ts b/src/web/create.ts
@@ -2,17 +2,12 @@ import type { StyleSheetWithSuperPowers, StyleSheet } from '../types/stylesheet'
 import { UnistylesWeb } from './index'
 import { assignSecrets, error, removeInlineStyles } from './utils'
 
-const useVariants = ['useVariants', () => {}]
-
 export const create = (stylesheet: StyleSheetWithSuperPowers<StyleSheet>, id?: string) => {
     if (!id) {
         throw error('Unistyles is not initialized correctly. Please add babel plugin to your babel config.')
     }
 
-    const computedStylesheet = typeof stylesheet === 'function'
-    ? stylesheet(UnistylesWeb.runtime.theme, UnistylesWeb.runtime.miniRuntime)
-        : stylesheet
-
+    const computedStylesheet = UnistylesWeb.registry.getComputedStylesheet(stylesheet)
     const addSecrets = (value: any, key: string, args?: Array<any>) => assignSecrets(value, {
         __uni__key: key,
         __uni__stylesheet: stylesheet,
@@ -30,6 +25,11 @@ export const create = (stylesheet: StyleSheetWithSuperPowers<StyleSheet>, id?: s
 
         return [key, addSecrets(removeInlineStyles(value), key)]
     })
+    const emptyVariants = ['__stylesheetVariants', {}]
+
+    const useVariants = ['useVariants', (variants: Record<string, string | boolean | undefined>) => {
+        return Object.fromEntries(styleSheetStyles.concat([useVariants, ['__stylesheetVariants', variants]]))
+    }]
 
-    return Object.fromEntries(styleSheetStyles.concat([useVariants]))
+    return Object.fromEntries(styleSheetStyles.concat([useVariants, emptyVariants]))
 }
diff --git a/src/web/shadowRegistry.ts b/src/web/shadowRegistry.ts
@@ -1,6 +1,6 @@
 import type { UnistylesTheme, UnistylesValues } from '../types'
 import { deepMergeObjects } from '../utils'
-import { extractSecrets, extractUnistyleDependencies } from './utils'
+import { extractSecrets, extractUnistyleDependencies, keyInObject } from './utils'
 import { getVariants } from './variants'
 import type { UnistylesServices } from './types'
 
@@ -13,7 +13,6 @@ export class UnistylesShadowRegistry {
     dispose = () => {}
     // END MOCKS
 
-    private selectedVariants = new Map<string, string | boolean | undefined>()
     private scopedTheme: UnistylesTheme | undefined = undefined
     private disposeMap = new Map<string, VoidFunction>()
 
@@ -38,6 +37,7 @@ export class UnistylesShadowRegistry {
 
             const { __uni__key, __uni__stylesheet, __uni__args = [] } = secrets
             const newComputedStylesheet = this.services.registry.getComputedStylesheet(__uni__stylesheet, scopedTheme)
+            const variants = (keyInObject(newComputedStylesheet, '__stylesheetVariants') ? newComputedStylesheet.__stylesheetVariants : {}) as Record<string, any>
             const style = newComputedStylesheet[__uni__key] as (UnistylesValues | ((...args: any) => UnistylesValues))
             const result = typeof style === 'function'
                 ? style(...__uni__args)
@@ -55,7 +55,6 @@ export class UnistylesShadowRegistry {
         }
 
         // Copy scoped theme to not use referenced value
-        const variants = this.getVariants()
         const scopedTheme = this.scopedTheme
         const parsedStyles = getParsedStyles()
         const { hash, existingHash } = this.services.registry.add(parsedStyles)
@@ -72,26 +71,12 @@ export class UnistylesShadowRegistry {
         return { injectedClassName, hash }
     }
 
-    selectVariants = (variants?: Record<string, string | boolean | undefined>) => {
-        if (!variants) {
-            this.selectedVariants.clear()
-
-            return
-        }
-
-        Object.entries(variants).forEach(([key, value]) => {
-            this.selectedVariants.set(key, value)
-        })
-    }
-
     setScopedTheme = (theme?: UnistylesTheme) => {
         this.scopedTheme = theme
     }
 
     getScopedTheme = () => this.scopedTheme
 
-    getVariants = () => Object.fromEntries(this.selectedVariants.entries())
-
     remove = (ref: any, hash?: string) => {
         if (!(ref instanceof HTMLElement) || !hash) {
             return