From 99d65b067f2309e3252ec2e94fc73b35dfdcaf05 Mon Sep 17 00:00:00 2001 From: Viraj-10 Date: Fri, 25 Aug 2023 15:00:46 +0530 Subject: [PATCH] fix: release inline props --- .../react/src/resolver/getComponentStyle.ts | 16 +++---- .../injectComponentAndDescendantStyles.ts | 44 ++++++++++++++----- 2 files changed, 40 insertions(+), 20 deletions(-) diff --git a/packages/react/src/resolver/getComponentStyle.ts b/packages/react/src/resolver/getComponentStyle.ts index 031af8cbf..33fe8e3b2 100644 --- a/packages/react/src/resolver/getComponentStyle.ts +++ b/packages/react/src/resolver/getComponentStyle.ts @@ -3,8 +3,8 @@ import type { OrderedSXResolved } from '../types'; export function getComponentResolvedBaseStyle( orderedResolved: OrderedSXResolved ) { - const componentOrderResolvedBaseStyle: Array = []; - const componentOrderResolvedBaseStateStyle: Array = []; + const componentOrderResolvedBaseStyle: OrderedSXResolved = []; + const componentOrderResolvedBaseStateStyle: OrderedSXResolved = []; orderedResolved && orderedResolved.forEach((item: any) => { @@ -31,8 +31,8 @@ export function getComponentResolvedBaseStyle( export function getComponentResolvedVariantStyle( orderedResolved: OrderedSXResolved ) { - const componentOrderResolvedVariantStyle: Array = []; - const componentOrderResolvedVariantStateStyle: Array = []; + const componentOrderResolvedVariantStyle: OrderedSXResolved = []; + const componentOrderResolvedVariantStateStyle: OrderedSXResolved = []; orderedResolved && orderedResolved.forEach((item: any) => { @@ -57,8 +57,8 @@ export function getComponentResolvedVariantStyle( export function getDescendantResolvedBaseStyle( orderedResolved: OrderedSXResolved ) { - const descendantOrderResolvedBaseStyle: Array = []; - const descendantOrderResolvedBaseStateStyle: Array = []; + const descendantOrderResolvedBaseStyle: OrderedSXResolved = []; + const descendantOrderResolvedBaseStateStyle: OrderedSXResolved = []; orderedResolved && orderedResolved.forEach((item: any) => { @@ -85,8 +85,8 @@ export function getDescendantResolvedBaseStyle( export function getDescendantResolvedVariantStyle( orderedResolved: OrderedSXResolved ) { - const descendantOrderResolvedVariantStyle: Array = []; - const descendantOrderResolvedVariantStateStyle: Array = []; + const descendantOrderResolvedVariantStyle: OrderedSXResolved = []; + const descendantOrderResolvedVariantStateStyle: OrderedSXResolved = []; orderedResolved && orderedResolved.forEach((item: any) => { diff --git a/packages/react/src/resolver/injectComponentAndDescendantStyles.ts b/packages/react/src/resolver/injectComponentAndDescendantStyles.ts index 1edba3792..c51bc5db9 100644 --- a/packages/react/src/resolver/injectComponentAndDescendantStyles.ts +++ b/packages/react/src/resolver/injectComponentAndDescendantStyles.ts @@ -12,36 +12,56 @@ export function injectComponentAndDescendantStyles( styleTagId?: string, type: 'boot' | 'inline' = 'boot' ) { - const componentOrderResolvedBaseStyle = - getComponentResolvedBaseStyle(orderedResolved); - const componentOrderResolvedVariantStyle = - getComponentResolvedVariantStyle(orderedResolved); + const [ + componentOrderResolvedBaseStyle, + componentOrderResolvedBaseStateStyle, + ] = getComponentResolvedBaseStyle(orderedResolved); + const [ + componentOrderResolvedVariantStyle, + componentOrderResolvedVariantStateStyle, + ] = getComponentResolvedVariantStyle(orderedResolved); - const descendantOrderResolvedBaseStyle = - getDescendantResolvedBaseStyle(orderedResolved); - const descendantOrderResolvedVariantStyle = - getDescendantResolvedVariantStyle(orderedResolved); + const [ + descendantOrderResolvedBaseStyle, + descendantOrderResolvedBaseStateStyle, + ] = getDescendantResolvedBaseStyle(orderedResolved); + const [ + descendantOrderResolvedVariantStyle, + descendantOrderResolvedVariantStateStyle, + ] = getDescendantResolvedVariantStyle(orderedResolved); const componentOrderResolvedBaseStyleIds = GluestackStyleSheet.declare( - componentOrderResolvedBaseStyle, + [ + ...componentOrderResolvedBaseStyle, + ...componentOrderResolvedBaseStateStyle, + ], type + '-base', styleTagId ? styleTagId : 'css-injected-boot-time', false ); const descendantOrderResolvedBaseStyleIds = GluestackStyleSheet.declare( - descendantOrderResolvedBaseStyle, + [ + ...descendantOrderResolvedBaseStyle, + ...descendantOrderResolvedBaseStateStyle, + ], type + '-descendant-base', styleTagId ? styleTagId : 'css-injected-boot-time-descendant', {} ); const componentOrderResolvedVariantStyleIds = GluestackStyleSheet.declare( - componentOrderResolvedVariantStyle, + [ + ...componentOrderResolvedVariantStyle, + ...componentOrderResolvedVariantStateStyle, + ], type + '-variant', styleTagId ? styleTagId : 'css-injected-boot-time', {} ); const descendantOrderResolvedVariantStyleIds = GluestackStyleSheet.declare( - descendantOrderResolvedVariantStyle, + [ + ...descendantOrderResolvedVariantStyle, + ...descendantOrderResolvedVariantStateStyle, + ], type + '-descendant-variant', styleTagId ? styleTagId : 'css-injected-boot-time-descendant', {}