Merge branch 'patch' of github.com:gluestack/gluestack-ui into patch

example/storybook-nativewind/.storybook/preview.js

@@ -14,7 +14,7 @@ import gstheme from './gstheme';
 import { themes } from '@storybook/theming';
 import { View } from 'react-native';
 import { useColorScheme } from 'nativewind';
-import { useDarkMode } from '../src/hooks/useDarkMode';
+import { useDarkMode } from '../src/components/hooks/useDarkMode';
 import { Platform } from 'react-native';
 import { useEffect, useState } from 'react';
 

example/storybook-nativewind/package.json

@@ -27,7 +27,7 @@
     "@expo/html-elements": "^0.4.2",
     "@expo/webpack-config": "^0.17.2",
     "@geometricpanda/storybook-addon-iframe": "^0.2.2",
-    "@gluestack-style/react": "^1.0.53",
+    "@gluestack-style/react": "^1.0.54",
     "@gluestack-ui/config": "^1.1.17",
     "@gluestack-ui/themed": "^1.1.22",
     "@gluestack/design-system": "^0.5.36",

example/storybook-nativewind/src/core-components/nativewind/button/index.tsx

@@ -221,6 +221,25 @@ const buttonIconStyle = tva({
   },
 });
 
+const buttonGroupStyle = tva({
+  base: '',
+  variants: {
+    space: {
+      'xs': 'gap-1',
+      'sm': 'gap-2',
+      'md': 'gap-3',
+      'lg': 'gap-4',
+      'xl': 'gap-5',
+      '2xl': 'gap-6',
+      '3xl': 'gap-7',
+      '4xl': 'gap-8',
+    },
+    isAttached: {
+      true: 'gap-0',
+    },
+  },
+});
+
 type IButtonProps = Omit<React.ComponentProps<typeof UIButton>, 'context'> &
   VariantProps<typeof buttonStyle>;
 const Button = React.forwardRef(
@@ -371,9 +390,32 @@ const ButtonIcon = React.forwardRef(
   }
 );
 
+type IButtonGroupProps = React.ComponentProps<typeof UIButton.Group> &
+  VariantProps<typeof buttonGroupStyle>;
+const ButtonGroup = React.forwardRef(
+  (
+    {
+      className,
+      space = 'md',
+      isAttached = false,
+      ...props
+    }: { className?: string } & IButtonGroupProps,
+    ref?: any
+  ) => {
+    return (
+      <UIButton.Group
+        className={buttonGroupStyle({ class: className, space, isAttached })}
+        {...props}
+        ref={ref}
+      />
+    );
+  }
+);
+
 Button.displayName = 'Button';
 ButtonText.displayName = 'ButtonText';
 ButtonSpinner.displayName = 'ButtonSpinner';
 ButtonIcon.displayName = 'ButtonIcon';
+ButtonGroup.displayName = 'ButtonGroup';
 
-export { Button, ButtonText, ButtonSpinner, ButtonIcon };
+export { Button, ButtonText, ButtonSpinner, ButtonIcon, ButtonGroup };

example/storybook-nativewind/src/core-components/nativewind/radio/index.tsx

@@ -162,7 +162,7 @@ const RadioGroup = React.forwardRef(
   }
 );
 
-type IRadioIndicatorProps = React.ComponentProps<typeof UIRadio.Group> &
+type IRadioIndicatorProps = React.ComponentProps<typeof UIRadio.Indicator> &
   VariantProps<typeof radioIndicatorStyle>;
 const RadioIndicator = React.forwardRef(
   (
@@ -183,7 +183,7 @@ const RadioIndicator = React.forwardRef(
   }
 );
 
-type IRadioLabelProps = React.ComponentProps<typeof UIRadio.Group> &
+type IRadioLabelProps = React.ComponentProps<typeof UIRadio.Label> &
   VariantProps<typeof radioIndicatorStyle>;
 const RadioLabel = React.forwardRef(
   (

example/storybook-nativewind/src/home/overview/AllComponents/index.nw.stories.mdx

@@ -16,8 +16,8 @@ import { Canvas, Meta, Story } from '@storybook/addon-docs';
 
 import { AppProvider } from '@gluestack/design-system';
 import { config } from '@gluestack-ui/config';
-import { Grid } from '../../extra-components/nativewind/Grid';
-import Wrapper from '../../core-components/nativewind/Wrapper';
+import { Grid } from '../../../extra-components/nativewind/Grid';
+import Wrapper from '../../../core-components/nativewind/Wrapper';
 
 
 # All Components

example/storybook-nativewind/src/home/overview/AllComponents/index.themed.stories.mdx

@@ -16,8 +16,8 @@ import { Canvas, Meta, Story } from '@storybook/addon-docs';
 
 import { AppProvider } from '@gluestack/design-system';
 import { config } from '@gluestack-ui/config';
-import { Grid } from '../../extra-components/themed/Grid';
-import Wrapper from '../../core-components/themed/Wrapper';
+import { Grid } from '../../../extra-components/themed/Grid';
+import Wrapper from '../../../core-components/themed/Wrapper';
 
 # All Components
 

example/storybook-nativewind/src/home/theme-configuration/default-tokens/index.nw.stories.mdx

@@ -11,7 +11,9 @@ showHeader: true
 ---
 
 import { Canvas, Meta, Story } from '@storybook/addon-docs';
-import { ColorPaletteComponent } from "../../components/docs-components/DefaultComponent.tsx"
+import {ColorPaletteComponent} from '../../../components/docs-components/DefaultComponent.tsx';
+
+
 
 <Meta title="with-nativewind/Home/Theme Configuration/Default Tokens" />
 

example/storybook-nativewind/src/home/theme-configuration/default-tokens/index.themed.stories.mdx

@@ -17,7 +17,7 @@ import {
   ShadowsComponent,
   BorderWidthComponent,
   RadiiComponent,
-} from '../../components/docs-components/DefaultComponentThemed.tsx';
+} from '../../../components/docs-components/DefaultComponentThemed.tsx';
 
 <Meta title="with-gluestack/Guides/Theme Configuration/Default Tokens" />
 

packages/config/package.json

@@ -37,7 +37,7 @@
     "@expo/html-elements": "latest",
     "@gluestack-style/animation-resolver": "1.0.4",
     "@gluestack-style/legend-motion-animation-driver": "1.0.3",
-    "@gluestack-style/react": "1.0.53",
+    "@gluestack-style/react": "1.0.54",
     "@gluestack-ui/accordion": "1.0.4",
     "@gluestack-ui/actionsheet": "0.2.41",
     "@gluestack-ui/alert": "0.1.13",
@@ -72,7 +72,7 @@
     "@legendapp/motion": "latest"
   },
   "peerDependencies": {
-    "@gluestack-style/react": ">=1.0",
+    "@gluestack-style/react": ">=1.0.54",
     "@gluestack-ui/themed": ">=1.1.22"
   },
   "release-it": {

packages/styled/react/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @gluestack-style/react
 
+## 1.0.54
+
+### Patch Changes
+
+- - Fixed plugins utility props resolution
+
 ## 1.0.53
 
 ### Patch Changes

packages/styled/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.53",
+  "version": "1.0.54",
   "keywords": [
     "React Native",
     "Next.js",

yarn.lock

@@ -18791,7 +18791,7 @@ password-prompt@^1.0.4:
     ansi-escapes "^4.3.2"
     cross-spawn "^7.0.3"
 
-patch-package@^8.0.0:
+[email protected]:
   version "8.0.0"
   resolved "https://registry.yarnpkg.com/patch-package/-/patch-package-8.0.0.tgz#d191e2f1b6e06a4624a0116bcb88edd6714ede61"
   integrity sha512-da8BVIhzjtgScwDJ2TtKsfT5JFWz1hYoBl9rUQ1f38MC2HwnEIkK8VN3dKMKcP7P7bvvgzNDbfNHtx3MsQb5vA==
@@ -22345,7 +22345,7 @@ tailwind-merge@^1.14.0:
   resolved "https://registry.yarnpkg.com/tailwind-merge/-/tailwind-merge-1.14.0.tgz#e677f55d864edc6794562c63f5001f45093cdb8b"
   integrity sha512-3mFKyCo/MBcgyOTlrY8T7odzZFx+w+qKSMAmdFzRvqBfLlSigU6TZnlFHK0lkMwj9Bj8OYU+9yW9lmGuS0QEnQ==
 
-tailwind-variants@^0.1.20:
+tailwind-variants@0.1.20, tailwind-variants@^0.1.20:
   version "0.1.20"
   resolved "https://registry.yarnpkg.com/tailwind-variants/-/tailwind-variants-0.1.20.tgz#8aaed9094be0379a438641a42d588943e44c5fcd"
   integrity sha512-AMh7x313t/V+eTySKB0Dal08RHY7ggYK0MSn/ad8wKWOrDUIzyiWNayRUm2PIJ4VRkvRnfNuyRuKbLV3EN+ewQ==