@niibase/uniwind 1.6.1 → 1.6.3

package/src/core/config/config.ts

@@ -1,66 +1,98 @@
+import { arrayEquals } from '../../common/utils'
 import { StyleDependency } from '../../types'
 import { UniwindListener } from '../listener'
 import { Logger } from '../logger'
-import { CSSVariables, ThemeName } from '../types'
+import { CSSVariables, GenerateStyleSheetsCallback, ThemeName } from '../types'
+import { getWebVariable } from '../web'
 import { UniwindConfigBuilder as UniwindConfigBuilderBase } from './config.common'
 
+type UniwindCSSRule = {
+    style: CSSStyleDeclaration
+    theme: ThemeName
+}
+
 class UniwindConfigBuilder extends UniwindConfigBuilderBase {
-    private runtimeCSSVariables = new Map<ThemeName, CSSVariables>()
+    private cssRules?: Array<UniwindCSSRule>
 
     constructor() {
         super()
     }
 
     updateCSSVariables(theme: ThemeName, variables: CSSVariables) {
+        if (typeof document === 'undefined') {
+            return
+        }
+
+        const uniwindRules = this.getUniwindDynamicCSSRules()
+
         Object.entries(variables).forEach(([varName, varValue]) => {
             if (!varName.startsWith('--') && __DEV__) {
                 Logger.error(`CSS variable name must start with "--", instead got: ${varName}`)
-
-                return
             }
 
-            const runtimeCSSVariables = this.runtimeCSSVariables.get(theme) ?? {}
+            const existingRules: Record<ThemeName, string | undefined> = Object.fromEntries(
+                uniwindRules.map(rule => [rule.theme, getWebVariable(varName, { scopedTheme: rule.theme })]),
+            )
 
-            runtimeCSSVariables[varName] = varValue
-            this.runtimeCSSVariables.set(theme, runtimeCSSVariables)
+            uniwindRules.forEach(rule => {
+                if (rule.theme === theme) {
+                    rule.style.setProperty(
+                        varName,
+                        typeof varValue === 'number' ? `${varValue}px` : varValue,
+                    )
 
-            if (theme === this.currentTheme) {
-                this.applyCSSVariable(varName, varValue)
-            }
+                    return
+                }
+
+                rule.style.setProperty(varName, existingRules[rule.theme] ?? null)
+            })
         })
 
-        if (theme === this.currentTheme) {
-            UniwindListener.notify([StyleDependency.Variables])
-        }
+        UniwindListener.notify([StyleDependency.Variables])
     }
 
-    protected onThemeChange() {
-        if (typeof document === 'undefined') {
+    protected __reinit(generateStyleSheetCallback: GenerateStyleSheetsCallback, themes: Array<string>) {
+        const oldThemes = this.themes
+        super.__reinit(generateStyleSheetCallback, themes)
+
+        if (arrayEquals(themes, oldThemes)) {
             return
         }
 
-        document.documentElement.removeAttribute('style')
-
-        const runtimeCSSVariables = this.runtimeCSSVariables.get(this.currentTheme)
+        this.cssRules = undefined
 
-        if (!runtimeCSSVariables) {
-            return
+        if (typeof document !== 'undefined') {
+            document.querySelector('#uniwind-dynamic-styles')?.remove()
         }
-
-        Object.entries(runtimeCSSVariables).forEach(([varName, varValue]) => {
-            this.applyCSSVariable(varName, varValue)
-        })
     }
 
-    private applyCSSVariable(varName: keyof CSSVariables, varValue: CSSVariables[keyof CSSVariables]) {
+    private getUniwindDynamicCSSRules() {
+        if (this.cssRules) {
+            return this.cssRules
+        }
+
         if (typeof document === 'undefined') {
-            return
+            return []
         }
 
-        document.documentElement.style.setProperty(
-            varName,
-            typeof varValue === 'number' ? `${varValue}px` : varValue,
+        const styleElement = document.createElement('style')
+
+        styleElement.innerText = this.themes.reduce(
+            (acc, theme) => {
+                return `${acc}.${theme}{}`
+            },
+            '',
         )
+        styleElement.setAttribute('id', 'uniwind-dynamic-styles')
+        document.head.appendChild(styleElement)
+
+        const cssRules = Array.from(styleElement.sheet?.cssRules ?? [])
+            .filter((rule): rule is CSSStyleRule => 'selectorText' in rule && 'style' in rule)
+            .map((rule): UniwindCSSRule => ({ style: rule.style, theme: rule.selectorText.replace('.', '') }))
+
+        this.cssRules = cssRules
+
+        return cssRules
     }
 }
 

package/src/core/logger.ts

@@ -1,5 +1,3 @@
-/* eslint-disable no-console */
-
 export class Logger {
     static log(message: string) {
         console.log(`Uniwind - ${message}`)

package/src/core/native/parsers/transforms.ts

@@ -1,4 +1,3 @@
-/* eslint-disable max-depth */
 const transforms = [
     'translateX',
     'translateY',

package/src/core/native/store.ts

@@ -1,4 +1,3 @@
-/* eslint-disable max-depth */
 import { Dimensions, Platform } from 'react-native'
 import { CSSAnimationKeyframes } from 'react-native-reanimated'
 import { Platform as UniwindPlatform, UNIWIND_PLATFORM_VARIABLES, UNIWIND_THEME_VARIABLES } from '../../common/consts'

package/src/core/web/cssListener.ts

@@ -54,7 +54,6 @@ class CSSListenerBuilder {
             const mediaQuery = this.classNameMediaQueryListeners.get(className)
 
             if (!mediaQuery) {
-                // eslint-disable-next-line no-empty-function
                 return () => {}
             }
 
@@ -64,7 +63,7 @@ class CSSListenerBuilder {
             disposables.push(() => listeners?.delete(listener))
         })
 
-        const disposeThemeListener = UniwindListener.subscribe(listener, [StyleDependency.Theme])
+        const disposeThemeListener = UniwindListener.subscribe(listener, [StyleDependency.Theme, StyleDependency.Variables])
 
         return () => {
             disposables.forEach(disposable => disposable())
@@ -129,7 +128,7 @@ class CSSListenerBuilder {
                 continue
             }
 
-            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition, @typescript-eslint/strict-boolean-expressions
+            // oxlint-disable-next-line @typescript-eslint/strict-boolean-expressions
             if (!rules) {
                 continue
             }

package/src/hoc/withUniwind.native.tsx

@@ -1,11 +1,15 @@
 import { ComponentProps, useLayoutEffect, useReducer } from 'react'
+import { isDefined } from '../common/utils'
 import { useUniwindContext } from '../core/context'
 import { UniwindListener } from '../core/listener'
+import { Logger } from '../core/logger'
 import { UniwindStore } from '../core/native'
 import { StyleDependency } from '../types'
 import { AnyObject, Component, OptionMapping, WithUniwind } from './types'
 import { classToColor, classToStyle, isClassProperty, isColorClassProperty, isStyleProperty } from './withUniwindUtils'
 
+let warnedOnce = false
+
 export const withUniwind: WithUniwind = <
     TComponent extends Component,
     TOptions extends Record<keyof ComponentProps<TComponent>, OptionMapping>,
@@ -28,6 +32,13 @@ const withAutoUniwind = (Component: Component<AnyObject>) => (props: AnyObject)
 
             const { styles, dependencies } = UniwindStore.getStyles(propValue, props, undefined, uniwindContext)
 
+            if (__DEV__ && !warnedOnce && isDefined(propValue) && propValue.trim() !== '' && styles.accentColor === undefined) {
+                warnedOnce = true
+                Logger.warn(
+                    `className '${propValue}' was provided to extract accentColor but no color was found. Make sure the className includes a color utility (e.g., 'accent-red-500', 'accent-blue-600'). See https://docs.uniwind.dev/class-names#the-accent-prefix`,
+                )
+            }
+
             acc.dependencies.push(...dependencies)
             acc.generatedProps[colorProp] = styles.accentColor
 
@@ -109,7 +120,6 @@ const withManualUniwind = (Component: Component<AnyObject>, options: Record<Prop
 
         const existingStyle = props[propName]
 
-        // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
         if (existingStyle) {
             acc.generatedProps[propName] = [styles, existingStyle]
 

package/src/hoc/withUniwind.tsx

@@ -1,10 +1,14 @@
 import { ComponentProps, useLayoutEffect, useReducer } from 'react'
+import { isDefined } from '../common/utils'
 import { generateDataSet } from '../components/web/generateDataSet'
 import { useUniwindContext } from '../core/context'
+import { Logger } from '../core/logger'
 import { CSSListener, formatColor, getWebStyles } from '../core/web'
 import { AnyObject, Component, OptionMapping, WithUniwind } from './types'
 import { classToColor, classToStyle, isClassProperty, isColorClassProperty, isStyleProperty } from './withUniwindUtils'
 
+let warnedOnce = false
+
 export const withUniwind: WithUniwind = <
     TComponent extends Component,
     TOptions extends Record<keyof ComponentProps<TComponent>, OptionMapping>,
@@ -29,6 +33,13 @@ const withAutoUniwind = (Component: Component<AnyObject>) => (props: AnyObject)
             const className = propValue
             const color = getWebStyles(className, props, uniwindContext).accentColor
 
+            if (__DEV__ && !warnedOnce && isDefined(className) && className.trim() !== '' && color === undefined) {
+                warnedOnce = true
+                Logger.warn(
+                    `className '${className}' was provided to extract accentColor but no color was found. Make sure the className includes a color utility (e.g., 'accent-red-500', 'accent-blue-600'). See https://docs.uniwind.dev/class-names#the-accent-prefix`,
+                )
+            }
+
             acc.generatedProps[colorProp] = color !== undefined
                 ? formatColor(color)
                 : undefined

package/src/hooks/index.ts

@@ -1,4 +1,3 @@
 export * from './useCSSVariable'
 export * from './useResolveClassNames'
 export * from './useUniwind'
-export * from './useUniwindAccent'

package/src/hooks/useCSSVariable/useCSSVariable.ts

@@ -1,4 +1,5 @@
 import { useLayoutEffect, useRef, useState } from 'react'
+import { arrayEquals } from '../../common/utils'
 import { useUniwindContext } from '../../core/context'
 import { UniwindListener } from '../../core/listener'
 import { Logger } from '../../core/logger'
@@ -11,14 +12,6 @@ const getValue = (name: string | Array<string>, uniwindContext: UniwindContextTy
         ? name.map(name => getVariableValue(name, uniwindContext))
         : getVariableValue(name, uniwindContext)
 
-const arrayEquals = <T>(a: Array<T>, b: Array<T>) => {
-    if (a.length !== b.length) {
-        return false
-    }
-
-    return a.every((value, index) => value === b[index])
-}
-
 let warned = false
 
 const logDevError = (name: string) => {

package/src/metro/addMetaToStylesTemplate.ts

@@ -1,8 +1,9 @@
 import { Platform } from '../common/consts'
+import { isDefined } from '../common/utils'
 import { StyleDependency } from '../types'
 import { ProcessorBuilder } from './processor'
 import { StyleSheetTemplate } from './types'
-import { isDefined, serialize, toCamelCase } from './utils'
+import { serialize, toCamelCase } from './utils'
 
 const extractVarsFromString = (value: string) => {
     const thisIndexes = [...value.matchAll(/this\[/g)].map(m => m.index)
@@ -40,8 +41,7 @@ export const addMetaToStylesTemplate = (Processor: ProcessorBuilder, currentPlat
                     minWidth,
                     maxWidth,
                     colorScheme,
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    important,
+                    important: _,
                     importantProperties,
                     active,
                     focus,

package/src/metro/logger.ts

@@ -1,5 +1,3 @@
-/* eslint-disable no-console */
-
 const red = '\x1b[91m'
 const yellow = '\x1b[33m'
 const blue = '\x1b[36m'

package/src/metro/metro-css-patches.ts

@@ -6,7 +6,6 @@ import path from 'path'
 
 class FileStore<T> extends FileStoreBase<T> {
     async set(key: Buffer, value: any): Promise<void> {
-        // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
         if (value?.output?.[0]?.data?.css?.skipCache) {
             return
         }
@@ -27,7 +26,7 @@ interface TraverseDependencies {
 export const patchMetroGraphToSupportUncachedModules = () => {
     const { Graph } = require('metro/private/DeltaBundler/Graph') as typeof import('metro/private/DeltaBundler/Graph')
 
-    // eslint-disable-next-line @typescript-eslint/unbound-method
+    // oxlint-disable-next-line @typescript-eslint/unbound-method
     const original_traverseDependencies = Graph.prototype.traverseDependencies as unknown as TraverseDependencies
 
     if (original_traverseDependencies.__patched) {

package/src/metro/metro-transformer.ts

@@ -30,7 +30,7 @@ export const transform = async (
     data: Buffer,
     options: JsTransformOptions,
 ) => {
-    const isCss = options.type !== 'asset' && path.join(process.cwd(), config.uniwind.cssEntryFile) === path.join(process.cwd(), filePath)
+    const isCss = options.type !== 'asset' && path.join(process.cwd(), config.uniwind.cssEntryFile) === path.join(projectRoot, filePath)
 
     if (filePath.endsWith('/components/web/metro-injected.js')) {
         const cssPath = path.join(process.cwd(), config.uniwind.cssEntryFile)
@@ -75,7 +75,7 @@ export const transform = async (
         themes: config.uniwind.themes,
         dtsPath: config.uniwind.dtsFile,
     })
-    const css = fs.readFileSync(filePath, 'utf-8')
+    const css = fs.readFileSync(cssPath, 'utf-8')
     const platform = getPlatform()
     const virtualCode = await compileVirtual({
         css,
@@ -91,7 +91,7 @@ export const transform = async (
         isWeb
             ? virtualCode
             : [
-                `import { Uniwind } from '${name}';`,
+                `const { Uniwind } = require('${name}');`,
                 `Uniwind.__reinit(rt => ${virtualCode}, ${injectedThemesCode});`,
             ].join(''),
         'utf-8',

package/src/metro/processor/css.ts

@@ -1,9 +1,11 @@
 /* eslint-disable max-lines */
 
 import { Animation, Filter, OverflowKeyword, TokenOrValue } from 'lightningcss'
+
+import { isDefined } from '../../common/utils'
 import { Logger } from '../logger'
 import { DeclarationValues } from '../types'
-import { deepEqual, isDefined, pipe, roundToPrecision, shouldBeSerialized, toCamelCase } from '../utils'
+import { deepEqual, pipe, roundToPrecision, shouldBeSerialized, toCamelCase } from '../utils'
 import { getProcessedAnimation, getProcessedVarAnimation } from './animation'
 import type { ProcessorBuilder } from './processor'
 
@@ -588,7 +590,6 @@ export class CSS {
         return undefined
     }
 
-    // eslint-disable-next-line @typescript-eslint/member-ordering
     private static readonly TRANSFORM_TYPES = new Set([
         'translate',
         'translateX',

package/src/metro/processor/functions.ts

@@ -239,7 +239,6 @@ export class Functions {
                 .replace(/"/g, '')
                 .replace(new RegExp(unit, 'g'), '')
 
-            // eslint-disable-next-line @typescript-eslint/no-implied-eval, no-new-func
             return new Function(`return ${numericValue} + '${unit}'`)()
         } catch {
             this.logger.error(`Invalid calc ${value}`)

package/src/metro/processor/rn.ts

@@ -1,4 +1,5 @@
-import { addMissingSpaces, isDefined, pipe, removeKeys, toCamelCase } from '../utils'
+import { isDefined } from '../../common/utils'
+import { addMissingSpaces, pipe, removeKeys, toCamelCase } from '../utils'
 import type { ProcessorBuilder } from './processor'
 
 const transitions: Record<string, any> = { overlay: '"overlayColor"' }

package/src/metro/resolvers.ts

@@ -1,5 +1,5 @@
 import { CustomResolutionContext, CustomResolver } from 'metro-resolver'
-import { basename, dirname, join, sep } from 'node:path'
+import { basename, dirname, sep } from 'node:path'
 import { name } from '../../package.json'
 
 type ResolverConfig = {
@@ -47,12 +47,11 @@ export const nativeResolver = (extraComponents: Record<string, string>) =>
     const resolution = resolver(context, moduleName, platform)
 
     if (cachedInternalBasePath === null) {
-        const componentsResolution = resolver(context, `${name}/components`, platform)
-
-        cachedInternalBasePath = componentsResolution.type === 'sourceFile'
-            // Go from src/components to root
-            ? join(dirname(componentsResolution.filePath), '../..')
-            : ''
+        try {
+            cachedInternalBasePath = dirname(require.resolve(`${name}/package.json`))
+        } catch {
+            cachedInternalBasePath = ''
+        }
     }
 
     const isInternal = cachedInternalBasePath !== '' && context.originModulePath.startsWith(cachedInternalBasePath)
@@ -106,13 +105,13 @@ export const webResolver = (extraComponents: Record<string, string>) =>
     const resolution = resolver(context, moduleName, platform)
 
     if (cachedInternalBasePath === null) {
-        const componentsResolution = resolver(context, `${name}/components`, platform)
-
-        cachedInternalBasePath = componentsResolution.type === 'sourceFile'
-            // Go from dist/module/components/web to root
-            ? join(dirname(componentsResolution.filePath), '../../../..')
-            : ''
+        try {
+            cachedInternalBasePath = dirname(require.resolve(`${name}/package.json`))
+        } catch {
+            cachedInternalBasePath = ''
+        }
     }
+
     if (
         (cachedInternalBasePath !== '' && context.originModulePath.startsWith(cachedInternalBasePath))
         || resolution.type !== 'sourceFile'

package/src/metro/utils/common.ts

@@ -1,5 +1,3 @@
-export const isDefined = <T>(value: T): value is NonNullable<T> => value !== null && value !== undefined
-
 export const toCamelCase = (str: string) => str.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase())
 
 type P<I, O> = (data: I) => O
@@ -54,7 +52,6 @@ export const uniq = <T>(arr: Array<T>) => Array.from(new Set(arr))
 
 export const isValidJSValue = (jsValueString: string) => {
     try {
-        // eslint-disable-next-line @typescript-eslint/no-implied-eval, no-new-func
         new Function(`const test = ${jsValueString}`)
 
         return true

package/src/metro/utils/serialize.ts

@@ -103,7 +103,6 @@ export const serializeJSObject = (obj: Record<string, any>, serializer: (key: st
         serializedValues =>
             serializedValues.filter(serializedValue => {
                 try {
-                    // eslint-disable-next-line @typescript-eslint/no-implied-eval, no-new-func
                     new Function(`function validateJS() { const obj = ({ ${serializedValue} }) }`)
 
                     return true

package/src/types.ts

@@ -20,5 +20,4 @@ export const enum ColorScheme {
     Dark = 'dark',
 }
 
-// eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface UniwindConfig {}

package/dist/common/components/native/TextInput.android.js

@@ -1,52 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-module.exports = exports.TextInput = void 0;
-var _jsxRuntime = require("react/jsx-runtime");
-var _react = require("react");
-var _reactNative = require("react-native");
-var _utils = require("../utils");
-var _useStyle = require("./useStyle");
-const TextInput = exports.TextInput = (0, _utils.copyComponentProperties)(_reactNative.TextInput, props => {
-  const [isFocused, setIsFocused] = (0, _react.useState)(false);
-  const [isPressed, setIsPressed] = (0, _react.useState)(false);
-  const state = {
-    isDisabled: props.editable === false,
-    isFocused,
-    isPressed
-  };
-  const style = (0, _useStyle.useStyle)(props.className, props, state);
-  const cursorColor = (0, _useStyle.useStyle)(props.cursorColorClassName, props, state).accentColor;
-  const selectionColor = (0, _useStyle.useStyle)(props.selectionColorClassName, props, state).accentColor;
-  const placeholderTextColor = (0, _useStyle.useStyle)(props.placeholderTextColorClassName, props, state).accentColor;
-  const selectionHandleColor = (0, _useStyle.useStyle)(props.selectionHandleColorClassName, props, state).accentColor;
-  const underlineColorAndroid = (0, _useStyle.useStyle)(props.underlineColorAndroidClassName, props, state).accentColor;
-  return /* @__PURE__ */(0, _jsxRuntime.jsx)(_reactNative.TextInput, {
-    ...props,
-    style: [style, props.style],
-    cursorColor: props.cursorColor ?? cursorColor,
-    selectionColor: props.selectionColor ?? selectionColor,
-    placeholderTextColor: props.placeholderTextColor ?? placeholderTextColor,
-    selectionHandleColor: props.selectionHandleColor ?? selectionHandleColor,
-    underlineColorAndroid: props.underlineColorAndroid ?? underlineColorAndroid,
-    onFocus: event => {
-      setIsFocused(true);
-      props.onFocus?.(event);
-    },
-    onBlur: event => {
-      setIsFocused(false);
-      props.onBlur?.(event);
-    },
-    onPressIn: event => {
-      setIsPressed(true);
-      props.onPressIn?.(event);
-    },
-    onPressOut: event => {
-      setIsPressed(false);
-      props.onPressOut?.(event);
-    }
-  });
-});
-module.exports = TextInput;

package/dist/common/hooks/useUniwindAccent.js

@@ -1,13 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useUniwindAccent = void 0;
-var _formatColor = require("../core/web/formatColor");
-var _useResolveClassNames = require("./useResolveClassNames");
-const useUniwindAccent = className => {
-  const styles = (0, _useResolveClassNames.useResolveClassNames)(className ?? "");
-  return styles.accentColor !== void 0 ? (0, _formatColor.formatColor)(styles.accentColor) : void 0;
-};
-exports.useUniwindAccent = useUniwindAccent;

package/dist/module/components/native/TextInput.android.d.ts

@@ -1,3 +0,0 @@
-import { TextInput as RNTextInput } from 'react-native';
-export declare const TextInput: typeof RNTextInput;
-export default TextInput;

package/dist/module/components/native/TextInput.android.js

@@ -1,49 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { useState } from "react";
-import { TextInput as RNTextInput } from "react-native";
-import { copyComponentProperties } from "../utils.js";
-import { useStyle } from "./useStyle.js";
-export const TextInput = copyComponentProperties(RNTextInput, (props) => {
-  const [isFocused, setIsFocused] = useState(false);
-  const [isPressed, setIsPressed] = useState(false);
-  const state = {
-    isDisabled: props.editable === false,
-    isFocused,
-    isPressed
-  };
-  const style = useStyle(props.className, props, state);
-  const cursorColor = useStyle(props.cursorColorClassName, props, state).accentColor;
-  const selectionColor = useStyle(props.selectionColorClassName, props, state).accentColor;
-  const placeholderTextColor = useStyle(props.placeholderTextColorClassName, props, state).accentColor;
-  const selectionHandleColor = useStyle(props.selectionHandleColorClassName, props, state).accentColor;
-  const underlineColorAndroid = useStyle(props.underlineColorAndroidClassName, props, state).accentColor;
-  return /* @__PURE__ */ jsx(
-    RNTextInput,
-    {
-      ...props,
-      style: [style, props.style],
-      cursorColor: props.cursorColor ?? cursorColor,
-      selectionColor: props.selectionColor ?? selectionColor,
-      placeholderTextColor: props.placeholderTextColor ?? placeholderTextColor,
-      selectionHandleColor: props.selectionHandleColor ?? selectionHandleColor,
-      underlineColorAndroid: props.underlineColorAndroid ?? underlineColorAndroid,
-      onFocus: (event) => {
-        setIsFocused(true);
-        props.onFocus?.(event);
-      },
-      onBlur: (event) => {
-        setIsFocused(false);
-        props.onBlur?.(event);
-      },
-      onPressIn: (event) => {
-        setIsPressed(true);
-        props.onPressIn?.(event);
-      },
-      onPressOut: (event) => {
-        setIsPressed(false);
-        props.onPressOut?.(event);
-      }
-    }
-  );
-});
-export default TextInput;

package/dist/module/hooks/useUniwindAccent.js

@@ -1,6 +0,0 @@
-import { formatColor } from "../core/web/formatColor.js";
-import { useResolveClassNames } from "./useResolveClassNames.js";
-export const useUniwindAccent = (className) => {
-  const styles = useResolveClassNames(className ?? "");
-  return styles.accentColor !== void 0 ? formatColor(styles.accentColor) : void 0;
-};

package/src/components/native/TextInput.android.tsx

@@ -1,51 +0,0 @@
-import { useState } from 'react'
-import { TextInput as RNTextInput, TextInputProps } from 'react-native'
-import { ComponentState } from '../../core/types'
-import { copyComponentProperties } from '../utils'
-import { useStyle } from './useStyle'
-
-export const TextInput = copyComponentProperties(RNTextInput, (props: TextInputProps) => {
-    const [isFocused, setIsFocused] = useState(false)
-    const [isPressed, setIsPressed] = useState(false)
-    const state = {
-        isDisabled: props.editable === false,
-        isFocused,
-        isPressed,
-    } satisfies ComponentState
-    const style = useStyle(props.className, props, state)
-    const cursorColor = useStyle(props.cursorColorClassName, props, state).accentColor
-    const selectionColor = useStyle(props.selectionColorClassName, props, state).accentColor
-    const placeholderTextColor = useStyle(props.placeholderTextColorClassName, props, state).accentColor
-    const selectionHandleColor = useStyle(props.selectionHandleColorClassName, props, state).accentColor
-    const underlineColorAndroid = useStyle(props.underlineColorAndroidClassName, props, state).accentColor
-
-    return (
-        <RNTextInput
-            {...props}
-            style={[style, props.style]}
-            cursorColor={props.cursorColor ?? cursorColor}
-            selectionColor={props.selectionColor ?? selectionColor}
-            placeholderTextColor={props.placeholderTextColor ?? placeholderTextColor}
-            selectionHandleColor={props.selectionHandleColor ?? selectionHandleColor}
-            underlineColorAndroid={props.underlineColorAndroid ?? underlineColorAndroid}
-            onFocus={event => {
-                setIsFocused(true)
-                props.onFocus?.(event)
-            }}
-            onBlur={event => {
-                setIsFocused(false)
-                props.onBlur?.(event)
-            }}
-            onPressIn={event => {
-                setIsPressed(true)
-                props.onPressIn?.(event)
-            }}
-            onPressOut={event => {
-                setIsPressed(false)
-                props.onPressOut?.(event)
-            }}
-        />
-    )
-})
-
-export default TextInput

package/src/hooks/useUniwindAccent.ts

@@ -1,10 +0,0 @@
-import { formatColor } from '../core/web/formatColor'
-import { useResolveClassNames } from './useResolveClassNames'
-
-export const useUniwindAccent = (className: string | undefined) => {
-    const styles = useResolveClassNames(className ?? '')
-
-    return styles.accentColor !== undefined
-        ? formatColor(styles.accentColor)
-        : undefined
-}