react-native-unistyles 3.0.0-rc.4 → 3.0.0

package/src/utils.ts

@@ -35,10 +35,8 @@ export const copyComponentProperties = (Component: any, UnistylesComponent: any)
         UnistylesComponent[key] = value
     })
 
-    // Those are not enumerable, so we need to copy them manually
     UnistylesComponent.displayName = Component.displayName
-    UnistylesComponent.name = Component.name
-
+    
     return UnistylesComponent
 }
 

package/src/web/convert/object/boxShadow.ts

@@ -25,7 +25,7 @@ export const getBoxShadow = (boxShadow: Array<BoxShadowValue>) => {
         const boxShadowStyle = Object.fromEntries(boxShadow.map(shadow => {
             const [key] = Object.keys(shadow)
             return [key, shadow[key as keyof BoxShadowValue]]
-        }))
+        })) as BoxShadowValue
 
         return {
             boxShadow: createBoxShadowValue(boxShadowStyle)
@@ -42,7 +42,7 @@ export const getBoxShadow = (boxShadow: Array<BoxShadowValue>) => {
             }
 
             return [key, value]
-        }))
+        })) as BoxShadowValue
 
         return {
             [breakpoint]: {

package/src/web/convert/pseudo.ts

@@ -1,26 +1,12 @@
-export const pseudos = [
-    '_-moz-broken',
-    '_-moz-drag-over',
-    '_-moz-first-node',
-    '_-moz-handler-blocked',
-    '_-moz-handler-crashed',
-    '_-moz-handler-disabled',
-    '_-moz-last-node',
-    '_-moz-loading',
-    '_-moz-locale-dir(ltr)',
-    '_-moz-locale-dir(rtl)',
-    '_-moz-only-whitespace',
-    '_-moz-submit-invalid',
-    '_-moz-suppressed',
-    '_-moz-user-disabled',
-    '_-moz-window-inactive',
+// All non experimental pseudo clasess and elements
+
+// https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes
+const pseudoClasses = [
     '_active',
     '_any-link',
     '_autofill',
-    '_blank',
     '_buffering',
     '_checked',
-    '_current',
     '_default',
     '_defined',
     '_dir(',
@@ -33,8 +19,8 @@ export const pseudos = [
     '_focus',
     '_focus-visible',
     '_focus-within',
-    '_fullscreen',
     '_future',
+    '_has-slotted',
     '_has(',
     '_host',
     '_host-context(',
@@ -49,7 +35,6 @@ export const pseudos = [
     '_last-of-type',
     '_left',
     '_link',
-    '_local-link',
     '_modal',
     '_muted',
     '_not(',
@@ -59,6 +44,7 @@ export const pseudos = [
     '_nth-of-type(',
     '_only-child',
     '_only-of-type',
+    '_open',
     '_optional',
     '_out-of-range',
     '_past',
@@ -71,45 +57,27 @@ export const pseudos = [
     '_read-write',
     '_required',
     '_right',
+    '_root',
     '_scope',
     '_seeking',
     '_stalled',
     '_state(',
     '_target',
-    '_target-within',
     '_user-invalid',
     '_user-valid',
     '_valid',
     '_visited',
     '_volume-locked',
-    '_where(',
-    '_-moz-color-swatch',
-    '_-moz-focus-inner',
-    '_-moz-list-bullet',
-    '_-moz-list-number',
-    '_-moz-meter-bar',
-    '_-moz-progress-bar',
-    '_-moz-range-progress',
-    '_-moz-range-thumb',
-    '_-moz-range-track',
-    '_-webkit-inner-spin-button',
-    '_-webkit-meter-barDeprecated',
-    '_-webkit-meter-even-less-good-value',
-    '_-webkit-meter-inner-element',
-    '_-webkit-meter-optimum-value',
-    '_-webkit-meter-suboptimum-value',
-    '_-webkit-progress-bar',
-    '_-webkit-progress-inner-element',
-    '_-webkit-progress-value',
-    '_-webkit-scrollbar',
-    '_-webkit-search-cancel-button',
-    '_-webkit-search-results-button',
-    '_-webkit-slider-runnable-track',
-    '_-webkit-slider-thumb',
+    '_where',
+] as const
+
+// https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements
+const pseudoElements = [
     '_after',
     '_backdrop',
     '_before',
     '_cue',
+    '_details-content',
     '_file-selector-button',
     '_first-letter',
     '_first-line',
@@ -123,15 +91,18 @@ export const pseudos = [
     '_spelling-error',
     '_target-text',
     '_view-transition',
-    '_view-transition-group',
-    '_view-transition-image-pair',
-    '_view-transition-new',
-    '_view-transition-old',
+    '_view-transition-group(',
+    '_view-transition-image-pair(',
+    '_view-transition-new(',
+    '_view-transition-old(',
 ] as const
 
-export const isPseudo = (selector: string) => pseudos.some(pseudo => selector.startsWith(pseudo))
-
 type AddDynamicSelector<T extends string> = T extends `${infer U}(` ? `${U}(${string})` : T
 
-export type Pseudo = AddDynamicSelector<typeof pseudos[number]>
+export type Pseudo = AddDynamicSelector<(typeof pseudoClasses)[number] | (typeof pseudoElements)[number]>
+
+export const isPseudoClass = (selector: string) => pseudoClasses.some(pseudo => selector.startsWith(pseudo))
+
+export const isPseudoElement = (selector: string) => pseudoElements.some(pseudo => selector.startsWith(pseudo))
 
+export const isPseudo = (selector: string) => isPseudoClass(selector) || isPseudoElement(selector)

package/src/web/convert/utils.ts

@@ -1,5 +1,6 @@
 // based on react-native-web normalizer
 // https://github.com/necolas/react-native-web
+/// <reference path="module.d.ts" />
 import normalizeColors from '@react-native/normalize-colors'
 import type { BoxShadowValue } from 'react-native'
 import type { TransformStyles } from '../../types/core'
@@ -30,7 +31,7 @@ export const normalizeColor = (color: string, opacity = 1) => {
         return color
     }
 
-    const hex = integer.toString(16).padStart(8, '0')
+    const hex = integer.toString(16).padStart(8, '0') as string
 
     if (hex.length === 8) {
         const [r = 0, g = 0, b = 0, a = 1] = hex

package/src/web/create.ts

@@ -21,7 +21,7 @@ export const create = (stylesheet: StyleSheetWithSuperPowers<StyleSheet>, id?: s
         __uni__key: key,
         __uni__stylesheet: stylesheet,
         __uni__args: args,
-        __uni_variants: variants
+        __stylesheetVariants: variants
     })
 
     const createStyleSheetStyles = (variants?: Variants) => {

package/src/web/css/core.ts

@@ -1,10 +1,12 @@
+import { isPseudoClass } from '../convert/pseudo'
 import { getMediaQuery } from '../utils'
 import type { CSSState } from './state'
 
 export const convertToCSS = (hash: string, value: Record<string, any>, state: CSSState) => {
     Object.entries(value).forEach(([styleKey, styleValue]) => {
         if (styleKey[0] === '_') {
-            const pseudoClassName = styleKey.replace('_', `${hash}:`)
+            const isStylePseudoClass = isPseudoClass(styleKey)
+            const pseudoClassName = `${hash}${isStylePseudoClass ? ':' : '::'}${styleKey.slice(1)}`
 
             Object.entries(styleValue).forEach(([pseudoStyleKey, pseudoStyleValue]) => {
                 if (typeof pseudoStyleValue === 'object' && pseudoStyleValue !== null) {
@@ -34,8 +36,16 @@ export const convertToCSS = (hash: string, value: Record<string, any>, state: CS
         }
 
         if (typeof styleValue === 'object') {
-            const allBreakpoints = Object.keys(value)
             Object.entries(styleValue).forEach(([breakpointStyleKey, breakpointStyleValue]) => {
+                const allBreakpoints = Object.entries(value)
+                    .filter(([_, value]) => {
+                        if (typeof value !== 'object' || value === null) {
+                            return false
+                        }
+
+                        return breakpointStyleKey in value
+                    })
+                    .map(([key]) => key)
                 const mediaQuery = getMediaQuery(styleKey, allBreakpoints)
 
                 state.set({

package/src/web/css/state.ts

@@ -32,7 +32,7 @@ export class CSSState {
     mainMap: MapType = new Map()
     mqMap: MapType = new Map()
     private styleTag: HTMLStyleElement | null = null
-    private CSS = ''
+    private themesCSS = new Map<string, string>()
 
     constructor(private services: UnistylesServices) {
         if (isServer()) {
@@ -62,7 +62,10 @@ export class CSSState {
 
     add = (hash: string, values: UnistylesValues) => {
         convertToCSS(hash, convertUnistyles(values, this.services.runtime), this)
+        this.recreate()
+    }
 
+    recreate = () => {
         if (this.styleTag) {
             this.styleTag.innerText = this.getStyles()
         }
@@ -84,10 +87,10 @@ export class CSSState {
         Object.entries(values).forEach(([key, value]) => convertToCSS(key, value))
 
         if (theme === 'light' || theme === 'dark') {
-            this.CSS += `@media (prefers-color-scheme: ${theme}){:root{${themeVars}}}`
+            this.themesCSS.set(`media ${theme}`, `@media (prefers-color-scheme: ${theme}){:root{${themeVars}}}`)
         }
 
-        this.CSS += `:root.${theme}{${themeVars}}`
+        this.themesCSS.set(theme, `:root.${theme}{${themeVars}}`)
     }
 
     remove = (hash: string) => {
@@ -97,14 +100,13 @@ export class CSSState {
         this.mqMap.forEach(styles => {
             styles.delete(hash)
         })
-
-        if (this.styleTag) {
-            this.styleTag.innerText = this.getStyles()
-        }
+        this.recreate()
     }
 
     getStyles = () => {
-        let styles = this.CSS
+        let styles = Array.from(this.themesCSS.entries()).reduce((acc, [, themeCss]) => {
+            return acc + themeCss
+        }, '')
 
         const generate = (mediaQuery: string, secondLevelMap: Map<string, Map<string, string>>) => {
             if (mediaQuery) {

package/src/web/listener.ts

@@ -1,16 +1,18 @@
 import { UnistyleDependency } from '../specs/NativePlatform'
 import type { UnistylesServices } from './types'
 
+type Listener = (dependency: UnistyleDependency) => void
+
 export class UnistylesListener {
     private isInitialized = false
-    private listeners = Array.from({ length: Object.keys(UnistyleDependency).length / 2 }, () => new Set<VoidFunction>())
-    private stylesheetListeners = Array.from({ length: Object.keys(UnistyleDependency).length / 2 }, () => new Set<VoidFunction>())
+    private listeners = Array.from({ length: Object.keys(UnistyleDependency).length / 2 }, () => new Set<Listener>())
+    private stylesheetListeners = Array.from({ length: Object.keys(UnistyleDependency).length / 2 }, () => new Set<Listener>())
 
     constructor(private services: UnistylesServices) {}
 
     emitChange = (dependency: UnistyleDependency) => {
-        this.stylesheetListeners[dependency]?.forEach(listener => listener())
-        this.listeners[dependency]?.forEach(listener => listener())
+        this.stylesheetListeners[dependency]?.forEach(listener => listener(dependency))
+        this.listeners[dependency]?.forEach(listener => listener(dependency))
     }
 
     initListeners = () => {
@@ -29,6 +31,7 @@ export class UnistylesListener {
 
             if (this.services.runtime.hasAdaptiveThemes) {
                 this.emitChange(UnistyleDependency.Theme)
+                this.emitChange(UnistyleDependency.ThemeName)
             }
         })
         this.services.runtime.lightMedia?.addEventListener('change', event => {
@@ -40,6 +43,7 @@ export class UnistylesListener {
 
             if (this.services.runtime.hasAdaptiveThemes) {
                 this.emitChange(UnistyleDependency.Theme)
+                this.emitChange(UnistyleDependency.ThemeName)
             }
         })
 
@@ -47,7 +51,7 @@ export class UnistylesListener {
         window.addEventListener('resize', () => this.emitChange(UnistyleDependency.Dimensions))
     }
 
-    addListeners = (dependencies: Array<UnistyleDependency>, listener: VoidFunction) => {
+    addListeners = (dependencies: Array<UnistyleDependency>, listener: Listener) => {
         dependencies.forEach(dependency => this.listeners[dependency]?.add(listener))
 
         return () => {
@@ -55,7 +59,7 @@ export class UnistylesListener {
         }
     }
 
-    addStylesheetListeners = (dependencies: Array<UnistyleDependency>, listener: VoidFunction) => {
+    addStylesheetListeners = (dependencies: Array<UnistyleDependency>, listener: Listener) => {
         dependencies.forEach(dependency => this.stylesheetListeners[dependency]?.add(listener))
 
         return () => {

package/src/web/runtime.ts

@@ -4,7 +4,7 @@ import { type AppTheme, type AppThemeName, ColorScheme, Orientation } from '../s
 import { type UnistylesTheme, WebContentSizeCategory } from '../types'
 import { NavigationBar, StatusBar } from './mock'
 import type { UnistylesServices } from './types'
-import { error, isServer, schemeToTheme } from './utils'
+import { convertTheme, error, isServer, schemeToTheme } from './utils'
 
 export class UnistylesRuntime {
     lightMedia = this.getLightMedia()
@@ -49,6 +49,12 @@ export class UnistylesRuntime {
     }
 
     get themeName() {
+        const scopedTheme = this.services.shadowRegistry.getScopedTheme()
+
+        if (scopedTheme) {
+            return scopedTheme
+        }
+
         if (this.services.state.hasAdaptiveThemes) {
             return schemeToTheme(this.colorScheme) as AppThemeName
         }
@@ -76,6 +82,14 @@ export class UnistylesRuntime {
         return screen.orientation.type.includes('portrait') ? Orientation.Portrait : Orientation.Landscape
     }
 
+    get isLandscape() {
+        return this.orientation === Orientation.Landscape
+    }
+
+    get isPortrait() {
+        return this.orientation === Orientation.Portrait
+    }
+
     get theme() {
         return this.getTheme(this.themeName)
     }
@@ -175,9 +189,14 @@ export class UnistylesRuntime {
     }
 
     setAdaptiveThemes = (isEnabled: boolean) => {
-        this.services.state.hasAdaptiveThemes = isEnabled
+        if (this.services.state.hasAdaptiveThemes === isEnabled) {
+            return
+        }
+
+        this.services.listener.emitChange(UnistyleDependency.AdaptiveThemes)
 
         if (!isEnabled) {
+            this.services.state.hasAdaptiveThemes = isEnabled
             this.rootElement?.classList.add(this.themeName ?? '')
 
             return
@@ -185,6 +204,7 @@ export class UnistylesRuntime {
 
         this.rootElement?.classList.remove(this.themeName ?? '')
         this.setTheme(schemeToTheme(this.colorScheme) as AppThemeName)
+        this.services.state.hasAdaptiveThemes = isEnabled
     }
 
     setRootViewBackgroundColor = (color: string) => {
@@ -204,7 +224,21 @@ export class UnistylesRuntime {
             throw error(`Unistyles: You're trying to update theme "${themeName}" but it wasn't registered.`)
         }
 
-        this.services.state.themes.set(themeName, updater(oldTheme))
+        const newTheme = updater(oldTheme)
+
+        this.services.state.themes.set(themeName, newTheme)
+        this.services.listener.emitChange(UnistyleDependency.Theme)
+
+        if (this.services.state.CSSVars) {
+            this.services.state.cssThemes.set(
+                themeName,
+                Object.fromEntries(Object.entries(newTheme).map(([key, value]) => {
+                    return convertTheme(key, value)
+                })) as UnistylesTheme
+            )
+            this.services.registry.css.addTheme(themeName, newTheme)
+            this.services.registry.css.recreate()
+        }
     }
 
     getTheme = (themeName = this.themeName, CSSVars = false) => {

package/src/web/shadowRegistry.ts

@@ -20,7 +20,7 @@ export class UnistylesShadowRegistry {
     constructor(private services: UnistylesServices) {}
 
     add = (ref: any, hash?: string) => {
-        if (!(ref instanceof HTMLElement) || !hash) {
+        if (isServer() || !(ref instanceof HTMLElement) || !hash) {
             return
         }
 
@@ -49,7 +49,7 @@ export class UnistylesShadowRegistry {
                     return {}
                 }
 
-                const { __uni__key, __uni__stylesheet, __uni__args = [], __uni_variants: variants } = secrets
+                const { __uni__key, __uni__stylesheet, __uni__args = [], __stylesheetVariants: variants } = secrets
                 const newComputedStylesheet = this.services.registry.getComputedStylesheet(__uni__stylesheet, scopedTheme)
                 const style = newComputedStylesheet[__uni__key] as (UnistylesValues | ((...args: any) => UnistylesValues))
                 const result = typeof style === 'function'
@@ -94,7 +94,7 @@ export class UnistylesShadowRegistry {
             ? hash.replace(' > *', '')
             : hash
 
-        return { injectedClassName, hash: hashClassname }
+        return { injectedClassName, hash: hashClassname, parsedStyles }
     }
 
     setScopedTheme = (theme?: UnistylesTheme) => {
@@ -118,4 +118,6 @@ export class UnistylesShadowRegistry {
                 this.disposeMap.delete(hash)
             })
     }
+
+    flush = () => {}
 }

package/src/web/state.ts

@@ -5,7 +5,7 @@ import type { AppBreakpoint, AppTheme, AppThemeName } from '../specs/types'
 import type { UnistylesTheme } from '../types'
 import type { UnionToIntersection } from '../types'
 import type { UnistylesServices } from './types'
-import { error, hyphenate, isServer, schemeToTheme } from './utils'
+import { convertTheme, error, isServer, schemeToTheme } from './utils'
 
 type UnistylesSettings = Partial<UnionToIntersection<Required<UnistylesConfig>['settings']>>
 
@@ -72,22 +72,12 @@ export class UnistylesState {
 
             if (CSSVars) {
                 this.services.registry.css.addTheme(themeName, theme)
-
-                const convertTheme = (key: string, value: any, prev = '-'): [string, any] => {
-                    if (typeof value === 'object' && value !== null) {
-                        return [key, Object.fromEntries(Object.entries(value).map(([nestedKey, nestedValue]) => convertTheme(nestedKey, nestedValue, `${prev}-${key}`)))]
-                    }
-
-                    if (typeof value === 'string') {
-                        return [key, `var(${prev}-${hyphenate(key)})`]
-                    }
-
-                    return [key, value]
-                }
-
-                this.cssThemes.set(themeName, Object.fromEntries(Object.entries(theme).map(([key, value]) => {
-                    return convertTheme(key, value)
-                })) as UnistylesTheme)
+                this.cssThemes.set(
+                    themeName,
+                    Object.fromEntries(Object.entries(theme).map(([key, value]) => {
+                        return convertTheme(key, value)
+                    })) as UnistylesTheme
+                )
             }
         })
     }

package/src/web/types.ts

@@ -1,3 +1,4 @@
+import type { UnistylesValues } from '../types'
 import type { UnistylesListener } from './listener'
 import type { UnistylesRegistry } from './registry'
 import type { UnistylesRuntime } from './runtime'
@@ -15,4 +16,6 @@ export type UnistylesServices = {
 export const UNI_GENERATED_KEYS = ['$$css', 'hash', 'injectedClassName'] as const
 export type UniGeneratedKey = typeof UNI_GENERATED_KEYS[number]
 
-export type UniGeneratedStyle = Record<UniGeneratedKey, string>
+export type UniGeneratedStyle = Record<UniGeneratedKey, string> & {
+    parsedStyles?: UnistylesValues
+}

package/src/web/utils/unistyle.ts

@@ -3,10 +3,11 @@ import type { UnistylesBreakpoints } from '../../global'
 import type { UnistyleDependency } from '../../specs/NativePlatform/NativePlatform.nitro'
 import { ColorScheme, Orientation } from '../../specs/types'
 import type { StyleSheet, StyleSheetWithSuperPowers, UnistylesValues } from '../../types/stylesheet'
-import { isUnistylesMq, parseMq } from '../../utils'
+import { isDefined, isUnistylesMq, parseMq } from '../../utils'
+import type { UnistylesRuntime } from '../runtime'
 import * as unistyles from '../services'
 import { UNI_GENERATED_KEYS, type UniGeneratedKey, type UniGeneratedStyle } from '../types'
-import { keyInObject, reduceObject } from './common'
+import { hyphenate, keyInObject, reduceObject } from './common'
 
 export const schemeToTheme = (scheme: ColorScheme) => {
     switch (scheme) {
@@ -22,7 +23,7 @@ export type UnistyleSecrets = {
     __uni__stylesheet: StyleSheetWithSuperPowers<StyleSheet>,
     __uni__key: string,
     __uni__args?: Array<any>,
-    __uni_variants: Record<string, string | boolean | undefined>
+    __stylesheetVariants: Record<string, string | boolean | undefined>
 }
 
 export const assignSecrets = <T>(object: T, secrets: UnistyleSecrets) => {
@@ -142,5 +143,34 @@ export const checkForAnimated = (value: any): boolean => {
 }
 
 export const isGeneratedUnistyle = (value: Record<string, any>): value is UniGeneratedStyle => {
-    return Object.keys(value).every(key => UNI_GENERATED_KEYS.includes(key as UniGeneratedKey))
+    const keys = Object.keys(value)
+
+    return keys.length > 0 && keys.every(key => UNI_GENERATED_KEYS.includes(key as UniGeneratedKey))
+}
+
+export const convertTheme = (key: string, value: any, prev = '-'): [string, any] => {
+    if (typeof value === 'object' && value !== null) {
+        return [key, Object.fromEntries(Object.entries(value).map(([nestedKey, nestedValue]) => convertTheme(nestedKey, nestedValue, `${prev}-${key}`)))]
+    }
+
+    if (typeof value === 'string') {
+        return [key, `var(${prev}-${hyphenate(key)})`]
+    }
+
+    return [key, value]
+}
+
+export const getClosestBreakpointValue = <T>(runtime: UnistylesRuntime, values: Partial<Record<keyof UnistylesBreakpoints, T>>) => {
+    const breakpoints = runtime.breakpoints
+    const breakpointValues = Object.entries(values)
+        // Filter out non-breakpoint values
+        .filter((pair): pair is [keyof UnistylesBreakpoints, T] => pair[0] in breakpoints)
+        // Sort in descending order
+        .sort(([a], [b]) => (breakpoints[b] ?? 0) - (breakpoints[a] ?? 0))
+    // Get breakpoint value with highest priority
+    const [_, currentBreakpointValue] = breakpointValues.find(
+        ([key]) => isDefined(runtime.breakpoint) && (breakpoints[key] ?? 0) <= (breakpoints[runtime.breakpoint] ?? 0)
+    ) ?? []
+
+    return currentBreakpointValue
 }

package/cxx/core/UnistylesCommitHook.cpp

@@ -1,59 +0,0 @@
-#include "UnistylesCommitHook.h"
-
-using namespace margelo::nitro::unistyles;
-using namespace facebook::react;
-
-core::UnistylesCommitHook::~UnistylesCommitHook() noexcept {
-    _uiManager->unregisterCommitHook(*this);
-}
-
-void core::UnistylesCommitHook::commitHookWasRegistered(const UIManager &uiManager) noexcept {}
-void core::UnistylesCommitHook::commitHookWasUnregistered(const UIManager &uiManager) noexcept {}
-
-RootShadowNode::Unshared core::UnistylesCommitHook::shadowTreeWillCommit(
-    const ShadowTree &shadowTree,
-    const RootShadowNode::Shared &oldRootShadowNode,
-    const RootShadowNode::Unshared &newRootShadowNode
-) noexcept {
-    RootShadowNode::Unshared rootNode = newRootShadowNode;
-    auto unistylesRootNode = std::reinterpret_pointer_cast<core::UnistylesCommitShadowNode>(newRootShadowNode);
-
-    // this is Unistyles commit, we don't need to override it
-    if (unistylesRootNode->hasUnistylesCommitTrait()) {
-        unistylesRootNode->removeUnistylesCommitTrait();
-        unistylesRootNode->addUnistylesMountTrait();
-
-        return newRootShadowNode;
-    }
-
-    auto& registry = core::UnistylesRegistry::get();
-
-    if (registry.trafficController.shouldStop()) {
-        registry.trafficController.resumeUnistylesTraffic();
-
-        return newRootShadowNode;
-    }
-
-    // this is React Native / Reanimated commit
-    // merge Unistyles updates before it completes
-
-    return registry.trafficController.withLock([&](){
-        auto& shadowLeafUpdates = registry.trafficController.getUpdates();
-
-        // oops, no updates from Unistyles yet, skip it!
-        if (shadowLeafUpdates.size() == 0) {
-            return newRootShadowNode;
-        }
-
-        auto affectedNodes = shadow::ShadowTreeManager::findAffectedNodes(*rootNode, shadowLeafUpdates);
-
-        registry.trafficController.stopUnistylesTraffic();
-
-        // we have few updates, so merge it
-        return std::static_pointer_cast<RootShadowNode>(shadow::ShadowTreeManager::cloneShadowTree(
-            *rootNode,
-            shadowLeafUpdates,
-            affectedNodes
-        ));
-    });
-}

package/cxx/core/UnistylesCommitHook.h

@@ -1,27 +0,0 @@
-#pragma once
-
-#include <react/renderer/uimanager/UIManager.h>
-#include <react/renderer/uimanager/UIManagerCommitHook.h>
-#include "ShadowTreeManager.h"
-#include "ShadowTrafficController.h"
-
-namespace margelo::nitro::unistyles::core {
-
-using namespace facebook::react;
-
-struct UnistylesCommitHook : public UIManagerCommitHook {
-    UnistylesCommitHook(std::shared_ptr<UIManager> uiManager) : _uiManager{uiManager} {
-        _uiManager->registerCommitHook(*this);
-    }
-
-    ~UnistylesCommitHook() noexcept override;
-
-    void commitHookWasRegistered(const UIManager &uiManager) noexcept override;
-    void commitHookWasUnregistered(const UIManager &uiManager) noexcept override;
-    RootShadowNode::Unshared shadowTreeWillCommit(const ShadowTree &shadowTree, const RootShadowNode::Shared &oldRootShadowNode, const RootShadowNode::Unshared &newRootShadowNode) noexcept override;
-
-private:
-    std::shared_ptr<UIManager> _uiManager;
-};
-
-}