From a72a9a17ac2fbb6341c828bf9b2f935171a069a7 Mon Sep 17 00:00:00 2001 From: Alex Cernik <57844660+AlexCernik@users.noreply.github.com> Date: Sun, 13 Jul 2025 20:27:42 -0300 Subject: [PATCH 1/5] add description to SelectItem --- .../components/Select/index.nw.stories.mdx | 37 ++++++++++++++++++- 1 file changed, 35 insertions(+), 2 deletions(-) diff --git a/example/storybook-nativewind/src/components/Select/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Select/index.nw.stories.mdx index 3bb16a9a15..79772d2780 100644 --- a/example/storybook-nativewind/src/components/Select/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Select/index.nw.stories.mdx @@ -535,7 +535,23 @@ It internally uses gluestack-ui's [ActionsheetItem](https://ui.gluestack.io/docs - - {`setting label that displays to the user.`} + {`Setting label that displays to the user.`} + + + + + + description + + + + string + + + - + + + {`Setting description that displays to the user. This prop only works on native.`} @@ -557,7 +573,23 @@ It internally uses gluestack-ui's [ActionsheetItem](https://ui.gluestack.io/docs - textStyle + labelTextStyle + + + + inherits all the properties of react native text + + + - + + + {`This prop only works on native.`} + + + + + + descriptionTextStyle @@ -570,6 +602,7 @@ It internally uses gluestack-ui's [ActionsheetItem](https://ui.gluestack.io/docs {`This prop only works on native.`} + From 95b4c7e9c1737993928424ac5d211b1b86af684b Mon Sep 17 00:00:00 2001 From: Alex Cernik <57844660+AlexCernik@users.noreply.github.com> Date: Sun, 13 Jul 2025 20:28:33 -0300 Subject: [PATCH 2/5] add description type to SelectItem --- packages/unstyled/select/src/types.ts | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/unstyled/select/src/types.ts b/packages/unstyled/select/src/types.ts index bcc17237e7..decad05b8c 100644 --- a/packages/unstyled/select/src/types.ts +++ b/packages/unstyled/select/src/types.ts @@ -21,6 +21,7 @@ export interface ISelectProps { export interface ISelectItemProps { label: string; + description: string; value: string; isDisabled?: boolean; } @@ -83,8 +84,11 @@ export type ISelectComponentType< ISelectItemProps & React.PropsWithoutRef & React.RefAttributes & { - textStyle?: { - [K in keyof SelectItemTextProps]?: SelectItemTextProps[K]; + labelTextStyle?: { + [K in keyof SelectItemTextProps]?: SelectItemTextProps[K]; + }; + descriptionTextStyle?: { + [K in keyof SelectItemTextProps]?: SelectItemTextProps[K]; }; } >; From b6c9a0029ff076b7c22a34472bb38429da820606 Mon Sep 17 00:00:00 2001 From: Alex Cernik <57844660+AlexCernik@users.noreply.github.com> Date: Sun, 13 Jul 2025 20:32:57 -0300 Subject: [PATCH 3/5] add description to SelectItem --- packages/unstyled/select/src/SelectItem.tsx | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/packages/unstyled/select/src/SelectItem.tsx b/packages/unstyled/select/src/SelectItem.tsx index 2041125928..9338881e03 100644 --- a/packages/unstyled/select/src/SelectItem.tsx +++ b/packages/unstyled/select/src/SelectItem.tsx @@ -13,8 +13,10 @@ export const SelectItem = (StyledSelectItem: any, StyledSelectItemText: any) => // isHovered, // isInvalid, label, + description, value, - textStyle, + labelTextStyle, + descriptionTextStyle, ...props }: any, ref?: any @@ -44,8 +46,13 @@ export const SelectItem = (StyledSelectItem: any, StyledSelectItemText: any) => dataSet={{ checked: activeValue == value ? 'true' : 'false', }} + style={{ + flexDirection: 'column', + alignItems: 'flex-start' + }} > - {label} + {label} + {!!description && {description}} ); } From 97f438ea8d536e688a3c306c46f77f27e7adf125 Mon Sep 17 00:00:00 2001 From: Alex Cernik <57844660+AlexCernik@users.noreply.github.com> Date: Sun, 13 Jul 2025 20:35:02 -0300 Subject: [PATCH 4/5] add fill currentColor --- packages/unstyled/icon/src/primitiveIcon/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/unstyled/icon/src/primitiveIcon/index.tsx b/packages/unstyled/icon/src/primitiveIcon/index.tsx index 5940b498e2..12a70ee9b2 100644 --- a/packages/unstyled/icon/src/primitiveIcon/index.tsx +++ b/packages/unstyled/icon/src/primitiveIcon/index.tsx @@ -46,7 +46,7 @@ export const PrimitiveIcon = React.forwardRef< let colorProps = {}; if (fill) { - colorProps = { ...colorProps, fill: fill }; + colorProps = { ...colorProps, fill: fill === 'currentColor' ? color : fill }; } if (stroke !== 'currentColor') { colorProps = { ...colorProps, stroke: stroke }; From df2a20d6a983755466773d984caed1a76604b0fb Mon Sep 17 00:00:00 2001 From: Alex Cernik <57844660+AlexCernik@users.noreply.github.com> Date: Sun, 13 Jul 2025 20:45:32 -0300 Subject: [PATCH 5/5] fix ButtonIcon fill color if size is a number --- .../src/core-components/nativewind/button/index.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/example/storybook-nativewind/src/core-components/nativewind/button/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/button/index.tsx index e8a8ac5230..7426195d7a 100644 --- a/example/storybook-nativewind/src/core-components/nativewind/button/index.tsx +++ b/example/storybook-nativewind/src/core-components/nativewind/button/index.tsx @@ -352,13 +352,14 @@ const ButtonIcon = React.forwardRef< size: parentSize, action: parentAction, } = useStyleContext(SCOPE); + const parentVariants = { variant: parentVariant, action: parentAction }; if (typeof size === 'number') { return ( ); @@ -370,7 +371,7 @@ const ButtonIcon = React.forwardRef< ); } @@ -380,8 +381,7 @@ const ButtonIcon = React.forwardRef< className={buttonIconStyle({ parentVariants: { size: parentSize, - variant: parentVariant, - action: parentAction, + ...parentVariants }, size, class: className,