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 0840440396..0643004e2f 100644
--- a/example/storybook-nativewind/src/components/Icon/index.nw.stories.mdx
+++ b/example/storybook-nativewind/src/components/Icon/index.nw.stories.mdx
@@ -443,7 +443,7 @@ After :
           ),
         });
       function App () {
-        return <Icon as={GluestackIcon} size='xl' className="bg-black"/>;
+        return <Icon as={GluestackIcon} size='xl' className="text-typography-black"/>;
       }
       `,
       transformCode: (code) => {
diff --git a/example/storybook-nativewind/src/core-components/nativewind/checkbox/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/checkbox/index.tsx
index 25052a3292..d7d460b0c6 100644
--- a/example/storybook-nativewind/src/core-components/nativewind/checkbox/index.tsx
+++ b/example/storybook-nativewind/src/core-components/nativewind/checkbox/index.tsx
@@ -13,7 +13,6 @@ import type { VariantProps } from '@gluestack-ui/nativewind-utils';
 
 import { Platform } from 'react-native';
 import { Check } from 'lucide-react-native';
-import { withStates } from '@gluestack-ui/nativewind-utils/withStates';
 const UICheckbox = createCheckbox({
   // @ts-ignore
   Root:
diff --git a/example/storybook-nativewind/src/core-components/nativewind/input/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/input/index.tsx
index d6d086f1f0..e84b4653e4 100644
--- a/example/storybook-nativewind/src/core-components/nativewind/input/index.tsx
+++ b/example/storybook-nativewind/src/core-components/nativewind/input/index.tsx
@@ -10,7 +10,6 @@ import { withStyleContextAndStates } from '@gluestack-ui/nativewind-utils/withSt
 import { cssInterop } from '@gluestack-ui/nativewind-utils/cssInterop';
 import { withStates } from '@gluestack-ui/nativewind-utils/withStates';
 import type { VariantProps } from '@gluestack-ui/nativewind-utils';
-import { withStates } from '@gluestack-ui/nativewind-utils/withStates';
 
 const UIInput = createInput({
   // @ts-ignore
diff --git a/example/storybook-nativewind/src/core-components/nativewind/link/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/link/index.tsx
index 0d3ee498dd..b55b725417 100644
--- a/example/storybook-nativewind/src/core-components/nativewind/link/index.tsx
+++ b/example/storybook-nativewind/src/core-components/nativewind/link/index.tsx
@@ -8,7 +8,6 @@ import { withStyleContextAndStates } from '@gluestack-ui/nativewind-utils/withSt
 import { cssInterop } from '@gluestack-ui/nativewind-utils/cssInterop';
 import { withStates } from '@gluestack-ui/nativewind-utils/withStates';
 import type { VariantProps } from '@gluestack-ui/nativewind-utils';
-import { withStates } from '@gluestack-ui/nativewind-utils/withStates';
 
 import React from 'react';
 export const UILink = createLink({
diff --git a/example/storybook-nativewind/src/core-components/nativewind/textarea/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/textarea/index.tsx
index 57f51975b4..ac79396883 100644
--- a/example/storybook-nativewind/src/core-components/nativewind/textarea/index.tsx
+++ b/example/storybook-nativewind/src/core-components/nativewind/textarea/index.tsx
@@ -10,7 +10,6 @@ import { withStyleContextAndStates } from '@gluestack-ui/nativewind-utils/withSt
 import { cssInterop } from '@gluestack-ui/nativewind-utils/cssInterop';
 import { withStates } from '@gluestack-ui/nativewind-utils/withStates';
 import type { VariantProps } from '@gluestack-ui/nativewind-utils';
-import { withStates } from '@gluestack-ui/nativewind-utils/withStates';
 
 const UITextarea = createTextarea({
   // @ts-ignore