From 93599d60d58189ba568a66350d2ba53868b50c79 Mon Sep 17 00:00:00 2001 From: ankit-tailor Date: Wed, 18 Oct 2023 18:05:24 +0530 Subject: [PATCH 1/4] fix: theme passing props --- packages/react/src/styled.tsx | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/packages/react/src/styled.tsx b/packages/react/src/styled.tsx index c475b74a..6488369a 100644 --- a/packages/react/src/styled.tsx +++ b/packages/react/src/styled.tsx @@ -1198,7 +1198,7 @@ export function verboseStyled( const { variantProps: defaultVariantProps, - restProps: defaultComponentPropsWithoutVariants, + restProps: defaultThemePropsWithoutVariants, } = getVariantProps(themeDefaultProps, theme); const { @@ -1384,7 +1384,7 @@ export function verboseStyled( const defaultResolvedInlineProps = resolveInlineProps( componentStyleConfig, componentExtendedConfig, - defaultComponentPropsWithoutVariants, + defaultThemePropsWithoutVariants, CONFIG ); @@ -1404,17 +1404,19 @@ export function verboseStyled( const { sx: filteredComponentSx, rest: filteredComponentRemainingProps } = convertUtiltiyToSXFromProps( - Object.assign( - defaultComponentPropsWithoutVariants, - inlineComponentPropsWithoutVariants - ), + // Object.assign( + // defaultThemePropsWithoutVariants, + inlineComponentPropsWithoutVariants, styledSystemProps, componentStyleConfig ); let { sx: filteredPassingSx, rest: filteredPassingRemainingProps } = convertUtiltiyToSXFromProps( - shallowMerge({ ...passingProps }, applyAncestorPassingProps), + shallowMerge( + { ...defaultThemePropsWithoutVariants, ...passingProps }, + applyAncestorPassingProps + ), styledSystemProps, componentStyleConfig ); From 8cf50d745539193f97452e846bbe2c8b6b926b91 Mon Sep 17 00:00:00 2001 From: Viraj-10 Date: Thu, 19 Oct 2023 13:44:42 +0530 Subject: [PATCH 2/4] fix: global style platform based style --- packages/react/src/StyledProvider.tsx | 2 +- packages/react/src/createGlobalStyles.ts | 4 +++- yarn.lock | 23 +---------------------- 3 files changed, 5 insertions(+), 24 deletions(-) diff --git a/packages/react/src/StyledProvider.tsx b/packages/react/src/StyledProvider.tsx index 3006403c..b8a50b7a 100644 --- a/packages/react/src/StyledProvider.tsx +++ b/packages/react/src/StyledProvider.tsx @@ -152,7 +152,7 @@ export const StyledProvider: React.FC<{ const [animationDriverData, setAnimationDriverData] = React.useState(); const globalStyleMap = - config?.globalStyle && createGlobalStyles(config.globalStyle); + config?.globalStyle && createGlobalStyles(config.globalStyle, Platform); const contextValue = React.useMemo(() => { const styledData = { diff --git a/packages/react/src/createGlobalStyles.ts b/packages/react/src/createGlobalStyles.ts index 30294efd..f072fd9e 100644 --- a/packages/react/src/createGlobalStyles.ts +++ b/packages/react/src/createGlobalStyles.ts @@ -1,9 +1,11 @@ import { convertStyledToStyledVerbosed } from './convertSxToSxVerbosed'; import { stableHash } from './stableHash'; +import { resolvePlatformTheme } from './styled'; import { updateOrderUnResolvedMap } from './updateOrderUnResolvedMap'; -export const createGlobalStyles = (globalStyle: object) => { +export const createGlobalStyles = (globalStyle: object, Platform) => { const versboseComponentTheme = convertStyledToStyledVerbosed(globalStyle); + resolvePlatformTheme(versboseComponentTheme, Platform.OS); const componentHash = stableHash({ ...globalStyle, }); diff --git a/yarn.lock b/yarn.lock index 5a435166..6344fb3d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2606,28 +2606,7 @@ "@babel/traverse" "^7.20.5" lodash.merge "^4.6.2" -"@gluestack-style/babel-plugin-styled-resolver@^0.1.6": - version "0.1.14" - resolved "https://registry.yarnpkg.com/@gluestack-style/babel-plugin-styled-resolver/-/babel-plugin-styled-resolver-0.1.14.tgz#1e3cd2dbdf91b5e9dcb8d34ab7df7aed1beea9bb" - integrity sha512-fgfuvCTngRZIbZf5prtoiZeOBaMtjEh4EJUIJygHY6iXscFuU6tnstnMnHqZdCd1dty+2E1DuwnG+JSKfYgYmA== - dependencies: - "@babel/core" "^7.20.5" - "@babel/generator" "^7.20.5" - "@babel/parser" "^7.20.5" - "@babel/plugin-transform-typescript" "^7.20.2" - "@babel/preset-typescript" "^7.18.6" - "@babel/traverse" "^7.20.5" - lodash.merge "^4.6.2" - -"@gluestack-style/react@^0.1.33": - version "0.1.33" - resolved "https://registry.yarnpkg.com/@gluestack-style/react/-/react-0.1.33.tgz#cd18f38bf359527e4f79d223bb07e9024f40ba4f" - integrity sha512-wBdoOA3i/cp0EcgJnwJgL1a8BATjbX/pCZgWm31N6sZOgCB4Phq7m0bDjfSpeJ8sKpOEDlUP5wYCo7Yww0mbqA== - dependencies: - inline-style-prefixer "^6.0.1" - normalize-css-color "^1.0.2" - -"@gluestack-style/react@^0.2.11-alpha.0", "@gluestack-style/react@^0.2.16", "@gluestack-style/react@^0.2.21", "@gluestack-style/react@^0.2.49": +"@gluestack-style/react@^0.2.16", "@gluestack-style/react@^0.2.21": version "0.2.51" resolved "https://registry.yarnpkg.com/@gluestack-style/react/-/react-0.2.51.tgz#0cfcca4f97f908ed3a352bd7e2336d436cc22415" integrity sha512-21TLr+e7KneP8N1d1iMKG6npMdYb/oPN/t5KZ/2kns2mg9NVCrfVmVuuMYKo+Xcej95BFOHuGuomskzLwdK1HQ== From 00535fed3f289c349d557c8b3780432cad5ec0e1 Mon Sep 17 00:00:00 2001 From: ankit-tailor Date: Thu, 19 Oct 2023 18:16:25 +0530 Subject: [PATCH 3/4] fix: return default value as fallback --- packages/react/src/hooks/useToken.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/hooks/useToken.ts b/packages/react/src/hooks/useToken.ts index 2bbd1b67..2ca7bce1 100644 --- a/packages/react/src/hooks/useToken.ts +++ b/packages/react/src/hooks/useToken.ts @@ -11,5 +11,5 @@ export const useToken = (tokenScale: string, token: string) => { const theme: ICustomConfig = useStyled(); // @ts-ignore const themeTokens = theme.config.tokens; - return themeTokens?.[`${tokenScale}`]?.[`${token}`]; + return themeTokens?.[`${tokenScale}`]?.[`${token}`] ?? token; }; From 1dabe5155a06f4c13f9a4c0614317a0e0c38a4aa Mon Sep 17 00:00:00 2001 From: ankit-tailor Date: Thu, 19 Oct 2023 18:22:18 +0530 Subject: [PATCH 4/4] chore: v1.0.8 --- example/storybook/package.json | 2 +- packages/benchmark-next/package.json | 2 +- packages/react/CHANGELOG.md | 8 ++++++++ packages/react/package.json | 2 +- 4 files changed, 11 insertions(+), 3 deletions(-) diff --git a/example/storybook/package.json b/example/storybook/package.json index 47daba70..56f78c94 100644 --- a/example/storybook/package.json +++ b/example/storybook/package.json @@ -23,7 +23,7 @@ }, "dependencies": { "@expo/html-elements": "^0.4.2", - "@gluestack-style/react": "1.0.7", + "@gluestack-style/react": "1.0.8", "@gluestack-ui/actionsheet": "^0.2.16", "@gluestack-ui/alert-dialog": "^0.1.14", "@gluestack-ui/button": "^0.1.23", diff --git a/packages/benchmark-next/package.json b/packages/benchmark-next/package.json index cf42e97a..0b158dd3 100644 --- a/packages/benchmark-next/package.json +++ b/packages/benchmark-next/package.json @@ -26,7 +26,7 @@ }, "devDependencies": { "@gluestack-style/babel-plugin-styled-resolver": "1.0.0", - "@gluestack-style/react": "1.0.7", + "@gluestack-style/react": "1.0.8", "@emotion/styled": "^11.3.0", "@expo/next-adapter": "^4.0.13", "@types/react": "17.0.1", diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 1a3b7221..a6ffdc91 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,13 @@ # @gluestack-style/react +## 1.0.8 + +### Patch Changes + +- - Fixed global style platform based resolution + - Fixed useToken to return default value as fallback + - Fixed theme passing props resolution + ## 1.0.7 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index b5ebc04d..d04887df 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,7 +1,7 @@ { "name": "@gluestack-style/react", "description": "A universal & performant styling library for React Native, Next.js & React", - "version": "1.0.7", + "version": "1.0.8", "keywords": [ "React Native", "Next.js",