backmerge -> main

example/storybook/src/getting-started/install-expo/index.stories.mdx

@@ -12,6 +12,7 @@ import {
   Button,
   AppProvider,
   HStack,
+  Tabs,
 } from '@gluestack/design-system';
 
 # Install in Expo project
@@ -22,13 +23,15 @@ You can create a new Expo project with [Expo CLI](https://docs.expo.dev/get-star
 
 Install gluestack-style and it's peer dependencies using npm or yarn.
 
-```bash
-# using npm
+**Using npm**
 
+```bash
 npm i @gluestack-style/react react-native-svg
+```
 
-# using yarn
+**Using yarn**
 
+```bash
 yarn add @gluestack-style/react react-native-svg
 ```
 
@@ -145,13 +148,15 @@ You can also add the babel plugin to your project if you want to perform all sty
 
 Install it as development dependency.
 
-```bash
-# using npm
+**Using npm**
 
+```bash
 npm i --save-dev @gluestack-style/babel-plugin-styled-resolver
+```
 
-# using yarn
+**Using yarn**
 
+```bash
 yarn add --dev @gluestack-style/babel-plugin-styled-resolver
 ```
 

example/storybook/src/getting-started/install-nextjs/index.stories.mdx

@@ -22,13 +22,15 @@ You can create a new Next.js project with [create-next-app](https://nextjs.org/d
 
 Install gluestack-style and it's peer dependencies using npm or yarn.
 
-```bash
-# using npm
+**Using npm**
 
+```bash
 npm i @gluestack-style/react react-native-web react-native-svg
+```
 
-# using yarn
+**Using yarn**
 
+```bash
 yarn add @gluestack-style/react react-native-web react-native-svg
 ```
 
@@ -187,13 +189,15 @@ To use gluestack-style with server-side rendering, you need to configure your pr
 
 Install the adapter using npm or yarn:
 
-```bash
-# using npm
+**Using npm**
 
+```bash
 npm i @gluestack/ui-next-adapter
+```
 
-# using yarn
+**Using yarn**
 
+```bash
 yarn add @gluestack/ui-next-adapter
 ```
 
@@ -270,13 +274,15 @@ You can also add the babel plugin to your project if you want to perform all sty
 
 Install it as development dependency.
 
-```bash
-# using npm
+**Using npm**
 
+```bash
 npm i --save-dev @gluestack-style/babel-plugin-styled-resolver
+```
 
-# using yarn
+**Using yarn**
 
+```bash
 yarn add --dev @gluestack-style/babel-plugin-styled-resolver
 ```
 

example/storybook/src/plugins/AnimationPlugin/index.stories.mdx

@@ -25,13 +25,17 @@ gluestack-style offers a plugin that supports animation properties, utilizing an
 
 ## Installation:
 
-```bash
-# using npm
+<br />
+
+**Using npm**:
 
+```bash
 npm install @gluestack-style/animation-resolver
+```
 
-# using yarn
+**Using yarn**:
 
+```bash
 yarn add @gluestack-style/animation-resolver
 ```
 

packages/react/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @gluestack-style/react
 
+## 1.0.18
+
+### Patch Changes
+
+- Fixed style injection order incase of composed styled component [PR](https://github.com/gluestack/gluestack-style/pull/544)
+
 ## 1.0.17
 
 ### Patch Changes

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.18-alpha.18",
+  "version": "1.0.18",
   "keywords": [
     "React Native",
     "Next.js",

yarn.lock

@@ -2606,6 +2606,14 @@
     "@babel/traverse" "^7.20.5"
     lodash.merge "^4.6.2"
 
+"@gluestack-style/react@1.0.8":
+  version "1.0.8"
+  resolved "https://registry.yarnpkg.com/@gluestack-style/react/-/react-1.0.8.tgz#9f8b1d287e7403d7e1d5b6ffb6c51bd7254177b2"
+  integrity sha512-dmOOBnk+0UtIrYPOcLShF1QNk01VZGBXtQvgBMnDYBKJikf93tOfcAmObZxy2xSxN5BXDl9xvZgtRGbwkkfquQ==
+  dependencies:
+    inline-style-prefixer "^6.0.1"
+    normalize-css-color "^1.0.2"
+
 "@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"