import { cssSupports } from '@rocket.chat/css-supports' ; import { Element , Middleware , node , RULESET , serialize } from 'stylis' ; import { attachDeclaration , isDeclaration , isRuleSet , RuleSet , } from './elements' ; import { compileOperations } from './operations' ; export const createLogicalPropertiesMiddleware = ( { isPropertySupported = ( property ) : boolean => cssSupports ( `${ property }:inherit` ) , isPropertyValueSupported = ( property , value ) : boolean => cssSupports ( `${ property }:${ value }` ) , } = { } ) : Middleware => { const ops = compileOperations ( { isPropertySupported , isPropertyValueSupported , } ) ; return ( ruleSet , _ , __ , callback ) : undefined | string => { if ( ! isRuleSet ( ruleSet ) || ruleSet . root !== null ) { return undefined ; } const ltrRuleSet = node ( ruleSet . props . map ( ( selector ) => `html:not([dir=rtl]) ${ selector }` ) . join ( ',' ) , undefined as unknown as Element , undefined as unknown as Element , RULESET , ruleSet . props . map ( ( selector ) => `html:not([dir=rtl]) ${ selector }` ) , [ ] , 0 ) as RuleSet ; const rtlRuleSet = node ( ruleSet . props . map ( ( selector ) => `[dir=rtl] ${ selector }` ) . join ( ',' ) , undefined as unknown as Element , undefined as unknown as Element , RULESET , ruleSet . props . map ( ( selector ) => `[dir=rtl] ${ selector }` ) , [ ] , 0 ) as RuleSet ; const rules = ruleSet . children ; ruleSet . children = [ ] ; ruleSet . return = '' ; for ( const rule of rules as Element [ ] ) { if ( ! isDeclaration ( rule ) ) { ruleSet . children . push ( rule ) ; continue ; } const op = ops . get ( rule . props ) ; if ( op ) { op ( rule . children , ruleSet , ltrRuleSet , rtlRuleSet ) ; continue ; } attachDeclaration ( rule . props , rule . children , ruleSet ) ; } return serialize ( [ ltrRuleSet , rtlRuleSet ] , callback ) ; } ; } ;