import { AllRules } from '@tamagui/helpers' ; import type { StyleObject } from '@tamagui/helpers' ; import { ViewStyle } from 'react-native' ; import { pseudos } from '../constants/pseudos' ; import { rnw } from '../constants/rnw' ; const generateStyle = ( style ) => { const { atomic , createCompileableStyle , createReactDOMStyle , i18Style } = rnw ; return { ... atomic ( createCompileableStyle ( createReactDOMStyle ( i18Style ( style ) ) ) ) , } ; } ; const borderDefaults = { borderWidth : 'borderStyle' , borderBottomWidth : 'borderBottomStyle' , borderTopWidth : 'borderTopStyle' , borderLeftWidth : 'borderLeftStyle' , borderRightWidth : 'borderRightStyle' , } ; export function getStylesAtomic ( style , avoidCollection = false ) { const styles = { base : { } , } ; for ( const key in style ) { if ( ! ! pseudos [ key ] ) { styles [ key ] = style [ key ] ; } else { styles . base [ key ] = style [ key ] ; } } return Object . keys ( styles ) . map ( ( key ) => { return getAtomicStyle ( styles [ key ] , pseudos [ key ] , avoidCollection ) ; } ) . flat ( ) ; } const importantRegex = /\!important*/g ; function getAtomicStyle ( style , pseudo ? , avoidCollection ? ) { if ( style == null || typeof style !== 'object' ) { throw new Error ( `Wrong style type: "${ typeof style }": ${ style }` ) ; } for ( const key in borderDefaults ) { if ( key in style ) { style [ borderDefaults [ key ] ] = style [ borderDefaults [ key ] ] ?? 'solid' ; } } const all = generateStyle ( style ) ; return Object . keys ( all ) . map ( ( key ) => { const val = all [ key ] ; const hash = val . identifier . slice ( `${ val . identifier }` . lastIndexOf ( '-' ) + 1 ) ; const psuedoPrefix = pseudo ? `-${ pseudo . name }-` : '' ; const identifier = `_${ val . property }-${ psuedoPrefix }${ hash }` ; const className = `.${ identifier }` ; const rules = val . rules . map ( ( rule ) => { if ( pseudo ) { const psuedoPrefixSelect = [ ... Array ( pseudo . priority ) ] . map ( ( ) => ':root' ) . join ( '' ) + ' ' ; let res = rule . replace ( `.${ val . identifier }` , `${ psuedoPrefixSelect } ${ className }` ) . replace ( '{' , `:${ pseudo . name }{` ) ; if ( pseudo . name === 'hover' ) { res = `@media not all and (hover: none) { ${ res } }` ; } return res ; } return rule . replace ( `.${ val . identifier }` , className ) . replace ( importantRegex , '' ) ; } ) ; if ( ! avoidCollection ) { if ( rules . length > 1 ) { console . warn ( 'have never seen more than one, verifying' ) ; } AllRules . add ( rules [ 0 ] ) ; } const result = { property : val . property , value : val . value , identifier , className , rules , } ; return result ; } ) ; }