From 0aaf8e525e6103d6cac177e170c4ca075f0317ac Mon Sep 17 00:00:00 2001 From: Suraj Date: Tue, 5 Mar 2024 15:25:20 +0530 Subject: [PATCH] fix: stories --- .../components/Actionsheet/index.nw.storiesold.mdx | 6 +++++- .../components/Actionsheet/index.themed.stories.mdx | 6 +++++- .../src/components/Alert/index.nw.stories.mdx | 6 +++++- .../src/components/Alert/index.themed.stories.mdx | 6 +++++- .../components/AlertDialog/index.nw.storiesold.mdx | 6 +++++- .../components/AlertDialog/index.themed.stories.mdx | 4 +++- .../src/components/Avatar/index.nw.stories.mdx | 6 +++++- .../src/components/Avatar/index.stories.mdx | 12 ++++++++++-- .../src/components/Avatar/index.themed.stories.mdx | 6 +++++- .../src/components/Badge/index.nw.stories.mdx | 6 +++++- .../src/components/Badge/index.themed.stories.mdx | 6 +++++- .../src/components/Box/index.nw.stories.mdx | 4 +++- .../src/components/Box/index.themed.stories.mdx | 4 +++- .../src/components/Button/index.nw.stories.mdx | 6 +++++- .../src/components/Button/index.stories.mdx | 10 ++++++++-- .../src/components/Button/index.themed.stories.mdx | 4 +++- .../src/components/Card/index.nw.stories.mdx | 6 +++++- .../src/components/Card/index.stories.mdx | 12 ++++++++++-- .../src/components/Card/index.themed.stories.mdx | 6 +++++- .../src/components/Center/index.nw.stories.mdx | 4 +++- .../src/components/Center/index.themed.stories.mdx | 4 +++- .../src/components/Checkbox/index.nw.stories.mdx | 6 +++++- .../src/components/Checkbox/index.themed.stories.mdx | 6 +++++- .../src/components/Divider/index.nw.stories.mdx | 6 +++++- .../src/components/Divider/index.themed.stories.mdx | 6 +++++- .../src/components/Fab/index.nw.stories.mdx | 6 +++++- .../src/components/Fab/index.themed.stories.mdx | 6 +++++- .../src/components/FormControl/index.nw.stories.mdx | 6 +++++- .../components/FormControl/index.nw.storiesold.mdx | 5 ++++- .../components/FormControl/index.themed.stories.mdx | 6 +++++- .../src/components/HStack/index.nw.stories.mdx | 6 +++++- .../src/components/HStack/index.themed.stories.mdx | 6 +++++- .../src/components/Heading/index.nw.stories.mdx | 6 +++++- .../src/components/Heading/index.themed.stories.mdx | 6 +++++- .../src/components/Icon/index.nw.stories.mdx | 6 +++++- .../src/components/Icon/index.themed.stories.mdx | 6 +++++- .../src/components/Image/index.nw.stories.mdx | 6 +++++- .../src/components/Image/index.themed.stories.mdx | 6 +++++- .../src/components/Input/index.nw.stories.mdx | 6 +++++- .../src/components/Input/index.themed.stories.mdx | 6 +++++- .../src/components/Link/index.nw.stories.mdx | 6 +++++- .../src/components/Link/index.themed.stories.mdx | 6 +++++- .../src/components/Modal/index.nw.storiesold.mdx | 6 +++++- .../src/components/Modal/index.themed.stories.mdx | 6 +++++- .../src/components/Popover/index.nw.storiesold.mdx | 6 +++++- .../src/components/Popover/index.themed.stories.mdx | 6 +++++- .../src/components/Pressable/index.nw.stories.mdx | 6 +++++- .../components/Pressable/index.themed.stories.mdx | 6 +++++- .../src/components/Progress/index.nw.stories.mdx | 6 +++++- .../src/components/Progress/index.themed.stories.mdx | 6 +++++- .../src/components/Radio/index.nw.stories.mdx | 5 ++++- .../src/components/Radio/index.themed.stories.mdx | 6 +++++- .../src/components/Slider/index.nw.stories.mdx | 6 +++++- .../src/components/Slider/index.themed.stories.mdx | 6 +++++- .../src/components/Spinner/index.nw.stories.mdx | 6 +++++- .../src/components/Spinner/index.themed.stories.mdx | 6 +++++- .../src/components/Switch/index.nw.stories.mdx | 6 +++++- .../src/components/Switch/index.themed.stories.mdx | 6 +++++- .../src/components/Text/index.nw.stories.mdx | 6 +++++- .../src/components/Text/index.themed.stories.mdx | 6 +++++- .../src/components/Toast/index.nw.storiesold.mdx | 6 +++++- .../src/components/Toast/index.themed.stories.mdx | 6 +++++- .../src/components/Tooltip/index.nw.storiesold.mdx | 6 +++++- .../src/components/Tooltip/index.themed.stories.mdx | 6 +++++- .../src/components/VStack/index.nw.stories.mdx | 6 +++++- .../src/components/VStack/index.themed.stories.mdx | 6 +++++- .../Installation/index.nw.stories.mdx | 1 + .../Installation/index.themed.stories.mdx | 8 ++++++-- 68 files changed, 336 insertions(+), 71 deletions(-) diff --git a/example/storybook-nativewind/src/components/Actionsheet/index.nw.storiesold.mdx b/example/storybook-nativewind/src/components/Actionsheet/index.nw.storiesold.mdx index 119325b85f..6a711baf6a 100644 --- a/example/storybook-nativewind/src/components/Actionsheet/index.nw.storiesold.mdx +++ b/example/storybook-nativewind/src/components/Actionsheet/index.nw.storiesold.mdx @@ -148,7 +148,11 @@ npm i @gluestack-ui/actionsheet ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/Actionsheet/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/Actionsheet/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Actionsheet/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Actionsheet/index.themed.stories.mdx index 37b658284f..04f7b06ac3 100644 --- a/example/storybook-nativewind/src/components/Actionsheet/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Actionsheet/index.themed.stories.mdx @@ -152,7 +152,11 @@ npm i @gluestack-ui/actionsheet ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/actionsheet/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/actionsheet/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Alert/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Alert/index.nw.stories.mdx index a60bcadcc8..8fe83011b7 100644 --- a/example/storybook-nativewind/src/components/Alert/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Alert/index.nw.stories.mdx @@ -98,7 +98,11 @@ npm i @gluestack-ui/alert ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/Alert/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/Alert/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Alert/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Alert/index.themed.stories.mdx index 8501f16cc6..2990fbab5a 100644 --- a/example/storybook-nativewind/src/components/Alert/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Alert/index.themed.stories.mdx @@ -96,7 +96,11 @@ npm i @gluestack-ui/alert ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/alert/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/alert/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/AlertDialog/index.nw.storiesold.mdx b/example/storybook-nativewind/src/components/AlertDialog/index.nw.storiesold.mdx index ac213a3a09..9e8d306d28 100644 --- a/example/storybook-nativewind/src/components/AlertDialog/index.nw.storiesold.mdx +++ b/example/storybook-nativewind/src/components/AlertDialog/index.nw.storiesold.mdx @@ -151,7 +151,11 @@ npm i @gluestack-ui/alert-dialog ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/AlertDialog/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/AlertDialog/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/AlertDialog/index.themed.stories.mdx b/example/storybook-nativewind/src/components/AlertDialog/index.themed.stories.mdx index 15c6be17da..83d4d68fad 100644 --- a/example/storybook-nativewind/src/components/AlertDialog/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/AlertDialog/index.themed.stories.mdx @@ -152,7 +152,9 @@ npm i @gluestack-ui/alert-dialog -```jsx %%-- File: core-components/themed/alert-dialog/index.tsx --%% ``` +```jsx +%%-- File: core-components/themed/alert-dialog/index.tsx --%% +``` diff --git a/example/storybook-nativewind/src/components/Avatar/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Avatar/index.nw.stories.mdx index 980159aac2..3caccf79e4 100644 --- a/example/storybook-nativewind/src/components/Avatar/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Avatar/index.nw.stories.mdx @@ -89,7 +89,11 @@ npm i @gluestack-ui/avatar ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/Avatar/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/Avatar/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Avatar/index.stories.mdx b/example/storybook-nativewind/src/components/Avatar/index.stories.mdx index 9087f4decf..0d8d489195 100644 --- a/example/storybook-nativewind/src/components/Avatar/index.stories.mdx +++ b/example/storybook-nativewind/src/components/Avatar/index.stories.mdx @@ -120,7 +120,11 @@ npm install @gluestack-ui/nativewind-utils Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/Avatar/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/Avatar/index.tsx --%% +``` + Step 3: Update the import paths to match your project setup. @@ -139,7 +143,11 @@ npm install @gluestack-style/react Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/avatar/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/avatar/index.tsx --%% +``` + Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Avatar/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Avatar/index.themed.stories.mdx index 0aaf7f1412..5508e0f728 100644 --- a/example/storybook-nativewind/src/components/Avatar/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Avatar/index.themed.stories.mdx @@ -90,7 +90,11 @@ npm i @gluestack-ui/avatar ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/avatar/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/avatar/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Badge/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Badge/index.nw.stories.mdx index 99c2a24fc4..ddd18914bb 100644 --- a/example/storybook-nativewind/src/components/Badge/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Badge/index.nw.stories.mdx @@ -114,7 +114,11 @@ npm i @gluestack-ui/badge ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/Badge/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/Badge/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Badge/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Badge/index.themed.stories.mdx index fd29d2743a..be9612f2cb 100644 --- a/example/storybook-nativewind/src/components/Badge/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Badge/index.themed.stories.mdx @@ -112,7 +112,11 @@ npm i @gluestack-ui/badge ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/badge/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/badge/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Box/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Box/index.nw.stories.mdx index c491de905d..789c901046 100644 --- a/example/storybook-nativewind/src/components/Box/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Box/index.nw.stories.mdx @@ -62,7 +62,9 @@ This is an illustration of **Box** component. -```jsx %%-- File: core-components/nativewind/Box/index.tsx --%% ``` +```jsx +%%-- File: core-components/nativewind/Box/index.tsx --%% +``` diff --git a/example/storybook-nativewind/src/components/Box/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Box/index.themed.stories.mdx index 1085844ed5..e41a24799c 100644 --- a/example/storybook-nativewind/src/components/Box/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Box/index.themed.stories.mdx @@ -63,7 +63,9 @@ This is an illustration of **Box** component. -```jsx %%-- File: core-components/themed/box/index.tsx --%% ``` +```jsx +%%-- File: core-components/themed/box/index.tsx --%% +``` diff --git a/example/storybook-nativewind/src/components/Button/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Button/index.nw.stories.mdx index e25a74dee5..b6a6d6701a 100644 --- a/example/storybook-nativewind/src/components/Button/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Button/index.nw.stories.mdx @@ -96,7 +96,11 @@ npm i @gluestack-ui/button ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/Button/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/Button/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Button/index.stories.mdx b/example/storybook-nativewind/src/components/Button/index.stories.mdx index bf74cdf6d7..5363b989cc 100644 --- a/example/storybook-nativewind/src/components/Button/index.stories.mdx +++ b/example/storybook-nativewind/src/components/Button/index.stories.mdx @@ -74,7 +74,11 @@ npm install @gluestack-ui/button ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/Button/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/Button/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. @@ -668,9 +672,11 @@ npm install @gluestack-style/react Step 2: Copy and paste the following code into your project. - ```jsx + +```jsx %%-- File: core-components/themed/button/index.tsx --%% ``` + Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Button/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Button/index.themed.stories.mdx index b85cb9f0e3..93914eb623 100644 --- a/example/storybook-nativewind/src/components/Button/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Button/index.themed.stories.mdx @@ -94,7 +94,9 @@ npm install @gluestack-ui/button -```jsx %%-- File: core-components/themed/button/index.tsx --%% ``` +```jsx +%%-- File: core-components/themed/button/index.tsx --%% +``` diff --git a/example/storybook-nativewind/src/components/Card/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Card/index.nw.stories.mdx index 6f83f768ab..f5d6f87888 100644 --- a/example/storybook-nativewind/src/components/Card/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Card/index.nw.stories.mdx @@ -101,7 +101,11 @@ npm i @gluestack-ui/card ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/Card/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/Card/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Card/index.stories.mdx b/example/storybook-nativewind/src/components/Card/index.stories.mdx index 02c195f1cd..ec8878fc85 100644 --- a/example/storybook-nativewind/src/components/Card/index.stories.mdx +++ b/example/storybook-nativewind/src/components/Card/index.stories.mdx @@ -101,7 +101,11 @@ npm install @gluestack-ui/card ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/button/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/button/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. @@ -684,7 +688,11 @@ npm install @gluestack-style/react Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/card/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/card/index.tsx --%% +``` + Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Card/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Card/index.themed.stories.mdx index 297de8200f..e484337d62 100644 --- a/example/storybook-nativewind/src/components/Card/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Card/index.themed.stories.mdx @@ -101,7 +101,11 @@ npm i @gluestack-ui/card ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/card/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/card/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Center/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Center/index.nw.stories.mdx index 9a0af11cec..0d0bbcdd31 100644 --- a/example/storybook-nativewind/src/components/Center/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Center/index.nw.stories.mdx @@ -60,7 +60,9 @@ This is an illustration of **Center** component. -```jsx %%-- File: core-components/nativewind/center/index.tsx --%% ``` +```jsx +%%-- File: core-components/nativewind/center/index.tsx --%% +``` diff --git a/example/storybook-nativewind/src/components/Center/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Center/index.themed.stories.mdx index cdc22712ca..ab5ab27951 100644 --- a/example/storybook-nativewind/src/components/Center/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Center/index.themed.stories.mdx @@ -60,7 +60,9 @@ This is an illustration of **Center** component. -```jsx %%-- File: core-components/themed/center/index.tsx --%% ``` +```jsx +%%-- File: core-components/themed/center/index.tsx --%% +``` diff --git a/example/storybook-nativewind/src/components/Checkbox/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Checkbox/index.nw.stories.mdx index f1ffe4102d..893439e22b 100644 --- a/example/storybook-nativewind/src/components/Checkbox/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Checkbox/index.nw.stories.mdx @@ -105,7 +105,11 @@ npm i @gluestack-ui/checkbox ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/checkbox/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/checkbox/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Checkbox/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Checkbox/index.themed.stories.mdx index e963709a34..5d02e583ce 100644 --- a/example/storybook-nativewind/src/components/Checkbox/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Checkbox/index.themed.stories.mdx @@ -105,7 +105,11 @@ npm i @gluestack-ui/checkbox ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/checkbox/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/checkbox/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Divider/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Divider/index.nw.stories.mdx index 9407a097ad..f60172e36a 100644 --- a/example/storybook-nativewind/src/components/Divider/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Divider/index.nw.stories.mdx @@ -83,7 +83,11 @@ npm i @gluestack-ui/divider ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/divider/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/divider/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Divider/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Divider/index.themed.stories.mdx index 6c73850073..ae5670aea7 100644 --- a/example/storybook-nativewind/src/components/Divider/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Divider/index.themed.stories.mdx @@ -83,7 +83,11 @@ npm i @gluestack-ui/divider ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/divider/index.tsx --%% ```` + +```jsx +%%-- File: core-components/themed/divider/index.tsx --%% +```` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Fab/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Fab/index.nw.stories.mdx index ea42683277..4e643b0c71 100644 --- a/example/storybook-nativewind/src/components/Fab/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Fab/index.nw.stories.mdx @@ -125,7 +125,11 @@ npm i @gluestack-ui/fab ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/fab/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/fab/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Fab/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Fab/index.themed.stories.mdx index def1c75dc7..6f5a2b1c74 100644 --- a/example/storybook-nativewind/src/components/Fab/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Fab/index.themed.stories.mdx @@ -120,7 +120,11 @@ npm i @gluestack-ui/fab ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/fab/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/fab/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/FormControl/index.nw.stories.mdx b/example/storybook-nativewind/src/components/FormControl/index.nw.stories.mdx index f3a9dfd04e..bafb924717 100644 --- a/example/storybook-nativewind/src/components/FormControl/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/FormControl/index.nw.stories.mdx @@ -248,7 +248,11 @@ npm i @gluestack-ui/form-control ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/form-control/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/form-control/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/FormControl/index.nw.storiesold.mdx b/example/storybook-nativewind/src/components/FormControl/index.nw.storiesold.mdx index 62f8c1209b..4787295fc9 100644 --- a/example/storybook-nativewind/src/components/FormControl/index.nw.storiesold.mdx +++ b/example/storybook-nativewind/src/components/FormControl/index.nw.storiesold.mdx @@ -191,7 +191,10 @@ npm i @gluestack-ui/form-control ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/form-control/index.tsx --%% ``` + +```jsx %%-- File: core-components/nativewind/form-control/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/FormControl/index.themed.stories.mdx b/example/storybook-nativewind/src/components/FormControl/index.themed.stories.mdx index aa7699ff98..c7a77ac500 100644 --- a/example/storybook-nativewind/src/components/FormControl/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/FormControl/index.themed.stories.mdx @@ -183,7 +183,11 @@ npm i @gluestack-ui/form-control ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/form-control/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/form-control/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/HStack/index.nw.stories.mdx b/example/storybook-nativewind/src/components/HStack/index.nw.stories.mdx index a16f7423bb..6c663710bd 100644 --- a/example/storybook-nativewind/src/components/HStack/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/HStack/index.nw.stories.mdx @@ -70,7 +70,11 @@ This is an illustration of **HStack** component. ### Step 1: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/hstack/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/hstack/index.tsx --%% +``` + ### Step 2: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/HStack/index.themed.stories.mdx b/example/storybook-nativewind/src/components/HStack/index.themed.stories.mdx index 75d3f64438..07b79ce754 100644 --- a/example/storybook-nativewind/src/components/HStack/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/HStack/index.themed.stories.mdx @@ -70,7 +70,11 @@ This is an illustration of **HStack** component. ### Step 1: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/hstack/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/hstack/index.tsx --%% +``` + ### Step 2: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Heading/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Heading/index.nw.stories.mdx index 2cbbce1dda..81a32933a7 100644 --- a/example/storybook-nativewind/src/components/Heading/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Heading/index.nw.stories.mdx @@ -66,7 +66,11 @@ npm i @expo/html-elements ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/heading/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/heading/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Heading/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Heading/index.themed.stories.mdx index c823d17bcb..cd9187d4eb 100644 --- a/example/storybook-nativewind/src/components/Heading/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Heading/index.themed.stories.mdx @@ -64,7 +64,11 @@ npm i @expo/html-elements ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/heading/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/heading/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Icon/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Icon/index.nw.stories.mdx index e584398f71..3e61748b5a 100644 --- a/example/storybook-nativewind/src/components/Icon/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Icon/index.nw.stories.mdx @@ -137,7 +137,11 @@ npm i @gluestack-ui/icon ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/icon/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/icon/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Icon/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Icon/index.themed.stories.mdx index d5c1ede3b4..973ac160c1 100644 --- a/example/storybook-nativewind/src/components/Icon/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Icon/index.themed.stories.mdx @@ -137,7 +137,11 @@ npm i @gluestack-ui/icon ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/icon/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/icon/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Image/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Image/index.nw.stories.mdx index 76b29514fd..8a7c0448b7 100644 --- a/example/storybook-nativewind/src/components/Image/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Image/index.nw.stories.mdx @@ -80,7 +80,11 @@ npm i @gluestack-ui/image ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/image/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/image/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Image/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Image/index.themed.stories.mdx index 6582433ef6..747041d4c4 100644 --- a/example/storybook-nativewind/src/components/Image/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Image/index.themed.stories.mdx @@ -80,7 +80,11 @@ npm i @gluestack-ui/image ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/image/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/image/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Input/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Input/index.nw.stories.mdx index c3426a1fca..53a957d6f1 100644 --- a/example/storybook-nativewind/src/components/Input/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Input/index.nw.stories.mdx @@ -109,7 +109,11 @@ npm i @gluestack-ui/input ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/input/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/input/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Input/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Input/index.themed.stories.mdx index 52a11f7194..377e193625 100644 --- a/example/storybook-nativewind/src/components/Input/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Input/index.themed.stories.mdx @@ -111,7 +111,11 @@ npm i @gluestack-ui/input ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/input/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/input/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Link/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Link/index.nw.stories.mdx index 6ac5da25a8..50d6082740 100644 --- a/example/storybook-nativewind/src/components/Link/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Link/index.nw.stories.mdx @@ -67,7 +67,11 @@ npm i @gluestack-ui/link ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/link/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/link/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Link/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Link/index.themed.stories.mdx index e3b5190275..32935907ab 100644 --- a/example/storybook-nativewind/src/components/Link/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Link/index.themed.stories.mdx @@ -73,7 +73,11 @@ npm i @gluestack-ui/link ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/link/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/link/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Modal/index.nw.storiesold.mdx b/example/storybook-nativewind/src/components/Modal/index.nw.storiesold.mdx index 2671bfda0e..756ec455bd 100644 --- a/example/storybook-nativewind/src/components/Modal/index.nw.storiesold.mdx +++ b/example/storybook-nativewind/src/components/Modal/index.nw.storiesold.mdx @@ -163,7 +163,11 @@ npm i @gluestack-ui/modal ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/modal/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/modal/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Modal/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Modal/index.themed.stories.mdx index ee069f0a7d..9303430914 100644 --- a/example/storybook-nativewind/src/components/Modal/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Modal/index.themed.stories.mdx @@ -164,7 +164,11 @@ npm i @gluestack-ui/modal ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/modal/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/modal/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Popover/index.nw.storiesold.mdx b/example/storybook-nativewind/src/components/Popover/index.nw.storiesold.mdx index 3a801538b9..208332c8e8 100644 --- a/example/storybook-nativewind/src/components/Popover/index.nw.storiesold.mdx +++ b/example/storybook-nativewind/src/components/Popover/index.nw.storiesold.mdx @@ -306,7 +306,11 @@ npm i @gluestack-ui/popover ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/popover/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/popover/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Popover/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Popover/index.themed.stories.mdx index b3b2008100..5cf5e5cf0e 100644 --- a/example/storybook-nativewind/src/components/Popover/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Popover/index.themed.stories.mdx @@ -303,7 +303,11 @@ npm i @gluestack-ui/popover ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/popover/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/popover/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Pressable/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Pressable/index.nw.stories.mdx index b69f714d3a..f7ba26e685 100644 --- a/example/storybook-nativewind/src/components/Pressable/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Pressable/index.nw.stories.mdx @@ -63,7 +63,11 @@ npm i @gluestack-ui/pressable ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/pressable/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/pressable/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Pressable/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Pressable/index.themed.stories.mdx index 60ea651b39..47005e2548 100644 --- a/example/storybook-nativewind/src/components/Pressable/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Pressable/index.themed.stories.mdx @@ -64,7 +64,11 @@ npm i @gluestack-ui/pressable ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/pressable/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/pressable/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Progress/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Progress/index.nw.stories.mdx index 3f6b3baeb3..b381a6df3f 100644 --- a/example/storybook-nativewind/src/components/Progress/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Progress/index.nw.stories.mdx @@ -71,7 +71,11 @@ npm i @gluestack-ui/progress ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/progress/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/progress/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Progress/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Progress/index.themed.stories.mdx index 5fbf7352e3..940d6e5747 100644 --- a/example/storybook-nativewind/src/components/Progress/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Progress/index.themed.stories.mdx @@ -75,7 +75,11 @@ npm i @gluestack-ui/progress ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/progress/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/progress/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Radio/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Radio/index.nw.stories.mdx index cd232e139e..f6965b8195 100644 --- a/example/storybook-nativewind/src/components/Radio/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Radio/index.nw.stories.mdx @@ -97,7 +97,10 @@ npm i @gluestack-ui/radio ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/radio/index.tsx --%% ``` + +```jsx %%-- File: core-components/nativewind/radio/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Radio/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Radio/index.themed.stories.mdx index 3a838227a7..e86b8ff52a 100644 --- a/example/storybook-nativewind/src/components/Radio/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Radio/index.themed.stories.mdx @@ -102,7 +102,11 @@ npm i @gluestack-ui/radio ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/radio/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/radio/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Slider/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Slider/index.nw.stories.mdx index 8d10520b41..e38fb52c02 100644 --- a/example/storybook-nativewind/src/components/Slider/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Slider/index.nw.stories.mdx @@ -110,7 +110,11 @@ npm i @gluestack-ui/slider ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/slider/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/slider/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Slider/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Slider/index.themed.stories.mdx index 5dc6240fc1..5cb379e261 100644 --- a/example/storybook-nativewind/src/components/Slider/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Slider/index.themed.stories.mdx @@ -110,7 +110,11 @@ npm i @gluestack-ui/slider ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/slider/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/slider/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Spinner/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Spinner/index.nw.stories.mdx index faf463a89e..796220bcb9 100644 --- a/example/storybook-nativewind/src/components/Spinner/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Spinner/index.nw.stories.mdx @@ -62,7 +62,11 @@ npm i @gluestack-ui/spinner ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/spinner/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/spinner/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Spinner/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Spinner/index.themed.stories.mdx index 12b9a74033..2c9953dcc2 100644 --- a/example/storybook-nativewind/src/components/Spinner/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Spinner/index.themed.stories.mdx @@ -62,7 +62,11 @@ npm i @gluestack-ui/spinner ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/spinner/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/spinner/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Switch/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Switch/index.nw.stories.mdx index 362893ab3b..a8330f79d5 100644 --- a/example/storybook-nativewind/src/components/Switch/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Switch/index.nw.stories.mdx @@ -74,7 +74,11 @@ npm i @gluestack-ui/switch ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/switch/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/switch/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Switch/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Switch/index.themed.stories.mdx index e19568a461..64fedab797 100644 --- a/example/storybook-nativewind/src/components/Switch/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Switch/index.themed.stories.mdx @@ -71,7 +71,11 @@ npm i @gluestack-ui/switch ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/switch/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/switch/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Text/index.nw.stories.mdx b/example/storybook-nativewind/src/components/Text/index.nw.stories.mdx index 96bb97ca83..58ace6d8e6 100644 --- a/example/storybook-nativewind/src/components/Text/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/Text/index.nw.stories.mdx @@ -59,7 +59,11 @@ This is an illustration of **Text** component. ### Step 1: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/text/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/text/index.tsx --%% +``` + ### Step 2: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Text/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Text/index.themed.stories.mdx index 4ecaa4d87a..08b1aaf15a 100644 --- a/example/storybook-nativewind/src/components/Text/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Text/index.themed.stories.mdx @@ -57,7 +57,11 @@ This is an illustration of **Text** component. ### Step 1: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/text/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/text/index.tsx --%% +``` + ### Step 2: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Toast/index.nw.storiesold.mdx b/example/storybook-nativewind/src/components/Toast/index.nw.storiesold.mdx index 64729e7fd6..b61eba94ee 100644 --- a/example/storybook-nativewind/src/components/Toast/index.nw.storiesold.mdx +++ b/example/storybook-nativewind/src/components/Toast/index.nw.storiesold.mdx @@ -129,7 +129,11 @@ npm i @gluestack-ui/toast ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/toast/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/toast/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Toast/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Toast/index.themed.stories.mdx index de50edab02..7cba185d3a 100644 --- a/example/storybook-nativewind/src/components/Toast/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Toast/index.themed.stories.mdx @@ -129,7 +129,11 @@ npm i @gluestack-ui/toast ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/toast/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/toast/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Tooltip/index.nw.storiesold.mdx b/example/storybook-nativewind/src/components/Tooltip/index.nw.storiesold.mdx index 72e0a31000..45b1a675d6 100644 --- a/example/storybook-nativewind/src/components/Tooltip/index.nw.storiesold.mdx +++ b/example/storybook-nativewind/src/components/Tooltip/index.nw.storiesold.mdx @@ -117,7 +117,11 @@ npm i @gluestack-ui/tooltip ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/tooltip/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/tooltip/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/Tooltip/index.themed.stories.mdx b/example/storybook-nativewind/src/components/Tooltip/index.themed.stories.mdx index 699720641f..83887ff071 100644 --- a/example/storybook-nativewind/src/components/Tooltip/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/Tooltip/index.themed.stories.mdx @@ -116,7 +116,11 @@ npm i @gluestack-ui/tooltip ### Step 2: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/tooltip/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/tooltip/index.tsx --%% +``` + ### Step 3: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/VStack/index.nw.stories.mdx b/example/storybook-nativewind/src/components/VStack/index.nw.stories.mdx index 14049241a6..a5ddfdaa53 100644 --- a/example/storybook-nativewind/src/components/VStack/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/components/VStack/index.nw.stories.mdx @@ -75,7 +75,11 @@ This is an illustration of **VStack** component. ### Step 1: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/nativewind/vstack/index.tsx --%% ``` + +```jsx +%%-- File: core-components/nativewind/vstack/index.tsx --%% +``` + ### Step 2: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/components/VStack/index.themed.stories.mdx b/example/storybook-nativewind/src/components/VStack/index.themed.stories.mdx index b04caa844a..5b4afbe5fd 100644 --- a/example/storybook-nativewind/src/components/VStack/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/components/VStack/index.themed.stories.mdx @@ -74,7 +74,11 @@ This is an illustration of **VStack** component. ### Step 1: Copy and paste the following code into your project. - ```jsx %%-- File: core-components/themed/vstack/index.tsx --%% ``` + +```jsx +%%-- File: core-components/themed/vstack/index.tsx --%% +``` + ### Step 2: Update the import paths to match your project setup. diff --git a/example/storybook-nativewind/src/getting-started/Installation/index.nw.stories.mdx b/example/storybook-nativewind/src/getting-started/Installation/index.nw.stories.mdx index 42957952de..3772a1924a 100644 --- a/example/storybook-nativewind/src/getting-started/Installation/index.nw.stories.mdx +++ b/example/storybook-nativewind/src/getting-started/Installation/index.nw.stories.mdx @@ -229,6 +229,7 @@ module.exports = { }, }; ``` + ### Step 4: Configure components path diff --git a/example/storybook-nativewind/src/getting-started/Installation/index.themed.stories.mdx b/example/storybook-nativewind/src/getting-started/Installation/index.themed.stories.mdx index 9d0ccd5109..918d372e6f 100644 --- a/example/storybook-nativewind/src/getting-started/Installation/index.themed.stories.mdx +++ b/example/storybook-nativewind/src/getting-started/Installation/index.themed.stories.mdx @@ -61,17 +61,21 @@ Create a `components/` folder inside `src` folder and add path in `tsconfig.json To add config, create a `GluestackUIProvider/config.ts` file in your `components/` folder and paste the following code. - ```jsx + +```jsx %%-- File: core-components/themed/gluestack-ui-provider/config.ts --%% ``` + To add `GluestackUIProvider`, create a `GluestackUIProvider/index.tsx` file inside `components/` folder and paste the following code. - ```jsx + +```jsx %%-- File: core-components/themed/gluestack-ui-provider/index.tsx --%% ``` + ### Step 4: Usage