diff --git a/example/src/Example/demos/CustomSize.tsx b/example/src/Example/demos/CustomSize.tsx
index 2ecd6b5..3ff9d7c 100644
--- a/example/src/Example/demos/CustomSize.tsx
+++ b/example/src/Example/demos/CustomSize.tsx
@@ -1,4 +1,4 @@
-import { ActionIcon, ActionIconProps, StroyBook, useControls, useCreateStore } from '@lobehub/ui';
+import { ActionIcon, ActionIconProps, StoryBook, useControls, useCreateStore } from '@lobehub/ui';
 import { Settings } from 'lucide-react';
 
 export default () => {
@@ -34,8 +34,8 @@ export default () => {
   );
 
   return (
-    <StroyBook levaStore={store}>
+    <StoryBook levaStore={store}>
       <ActionIcon active icon={Settings} size={size} />
-    </StroyBook>
+    </StoryBook>
   );
 };
diff --git a/example/src/Example/demos/index.tsx b/example/src/Example/demos/index.tsx
index e437ed0..810a4dc 100644
--- a/example/src/Example/demos/index.tsx
+++ b/example/src/Example/demos/index.tsx
@@ -1,4 +1,4 @@
-import { ActionIcon, ActionIconProps, StroyBook, useControls, useCreateStore } from '@lobehub/ui';
+import { ActionIcon, ActionIconProps, StoryBook, useControls, useCreateStore } from '@lobehub/ui';
 import { folder } from 'leva';
 import * as LucideIcon from 'lucide-react';
 
@@ -44,8 +44,8 @@ export default () => {
   );
 
   return (
-    <StroyBook levaStore={store}>
+    <StoryBook levaStore={store}>
       <ActionIcon {...control} />
-    </StroyBook>
+    </StoryBook>
   );
 };