@ornikar/bumper 2.5.0 → 2.5.1-canary.9789a78a274b9d336c93fc42d4a6561d0d61ff73.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ornikar/bumper",
-  "version": "2.5.0",
+  "version": "2.5.1-canary.9789a78a274b9d336c93fc42d4a6561d0d61ff73.0",
   "license": "MIT",
   "repository": {
     "directory": "@ornikar/bumper",
@@ -31,13 +31,13 @@
     "@tamagui/core": "1.135.6"
   },
   "peerDependencies": {
-    "@storybook/addons": ">=7.6.20",
+    "@storybook/preview-api": ">=8.6.15",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-native": ">=0.76.9"
   },
   "peerDependenciesMeta": {
-    "@storybook/addons": {
+    "@storybook/preview-api": {
       "optional": true
     },
     "react-dom": {

package/src/components/breakpoints/breakpoints.stories.tsx

@@ -1,4 +1,4 @@
-import type { ComponentStory, Meta } from '@storybook/react';
+import type { Meta, StoryFn } from '@storybook/react';
 import type { View } from '@tamagui/core';
 import type { ReactElement } from 'react';
 import { Typography } from '../typography/Typograhy';
@@ -30,7 +30,7 @@ const SwitchBreakpointsComponent = (): ReactElement => {
   );
 };
 
-export const BreakpointsStory: ComponentStory<typeof View> = () => {
+export const BreakpointsStory: StoryFn<typeof View> = () => {
   return (
     <>
       <CurrentBreakpointNameComponent />

package/src/components/primitives/Center.stories.tsx

@@ -1,4 +1,4 @@
-import type { ComponentStory, Meta } from '@storybook/react';
+import type { Meta, StoryFn } from '@storybook/react';
 import type { CenterProps } from './Center';
 import { Center } from './Center';
 import { View } from './View';
@@ -8,7 +8,7 @@ export default {
   component: Center,
 } satisfies Meta<CenterProps>;
 
-export const CenterStory: ComponentStory<typeof Center> = () => (
+export const CenterStory: StoryFn<typeof Center> = () => (
   <Center width="$size.120" height="$size.120" backgroundColor="$bg.accent.default">
     <View width="$size.16" height="$size.16" backgroundColor="$bg.base.mid.default" />
   </Center>

package/src/components/primitives/Stack.stories.tsx

@@ -1,4 +1,4 @@
-import type { ComponentStory, Meta } from '@storybook/react';
+import type { Meta, StoryFn } from '@storybook/react';
 import type { StackProps } from './Stack';
 import { HStack, Stack, VStack } from './Stack';
 import { View } from './View';
@@ -36,7 +36,7 @@ const items = (
   </>
 );
 
-export const StackStory: ComponentStory<typeof Stack> = () => (
+export const StackStory: StoryFn<typeof Stack> = () => (
   <>
     <HStack gap="$space.4">{items}</HStack>
 

package/src/components/primitives/View.stories.tsx

@@ -1,4 +1,4 @@
-import type { ComponentStory, Meta } from '@storybook/react';
+import type { Meta, StoryFn } from '@storybook/react';
 import type { ViewProps } from './View';
 import { View } from './View';
 
@@ -7,7 +7,7 @@ export default {
   component: View,
 } satisfies Meta<ViewProps>;
 
-export const ViewStory: ComponentStory<typeof View> = () => (
+export const ViewStory: StoryFn<typeof View> = () => (
   <View width="$size.120" height="$size.120" backgroundColor="$bg.accent.default" />
 );
 

package/src/components/typography/Typography.stories.tsx

@@ -1,4 +1,4 @@
-import type { ComponentStory, Meta } from '@storybook/react';
+import type { Meta, StoryFn } from '@storybook/react';
 import type { FC } from 'react';
 import { StorySection } from '../../story-components/StorySection';
 import type { BodyFontVariants, FontVariants, HeadingFontVariants, LabelFontVariants } from '../../tokens/fonts';
@@ -74,7 +74,7 @@ function TypographyVariants({ types }: TypographyTypesProps) {
   );
 }
 
-export const TypographyStory: ComponentStory<typeof Typography.Text> = (args) => (
+export const TypographyStory: StoryFn<typeof Typography.Text> = (args) => (
   <>
     <StorySection.Demo>
       <Typography.Text {...args} />

package/src/core/BumperDecorator.tsx

@@ -1,4 +1,4 @@
-import { makeDecorator } from '@storybook/addons';
+import { makeDecorator } from '@storybook/preview-api';
 import type { ReactNode } from 'react';
 import { BumperProvider } from './BumperProvider';
 

package/src/themes/light.stories.tsx

@@ -1,4 +1,4 @@
-import type { ComponentStory, Meta } from '@storybook/react';
+import type { Meta, StoryFn } from '@storybook/react';
 import type { GetThemeValueForKey } from '@tamagui/core';
 import { VStack } from '../components/primitives/Stack';
 import { View } from '../components/primitives/View';
@@ -27,7 +27,7 @@ const TokenView = ({ tokenName, tokenValue }: { tokenName: string; tokenValue: s
   );
 };
 
-export const TypographyHeadingStory: ComponentStory<typeof View> = () => (
+export const TypographyHeadingStory: StoryFn<typeof View> = () => (
   <StorySection title="Tokens">
     {Object.entries(light).map(([tokenName, tokenValue]) => (
       <TokenView key={tokenName} tokenName={tokenName} tokenValue={tokenValue} />

package/src/tokens/palettes/deepPurpleColorPalette.stories.tsx

@@ -1,4 +1,4 @@
-import type { ComponentStory, Meta } from '@storybook/react';
+import type { Meta, StoryFn } from '@storybook/react';
 import type { GetThemeValueForKey } from '@tamagui/core';
 import { View } from '../../components/primitives/View';
 import { Typography } from '../../components/typography/Typograhy';
@@ -26,7 +26,7 @@ const TokenView = ({ tokenName, tokenValue }: { tokenName: string; tokenValue: s
   );
 };
 
-export const TypographyHeadingStory: ComponentStory<typeof View> = () => (
+export const TypographyHeadingStory: StoryFn<typeof View> = () => (
   <StorySection title="Palette">
     {Object.entries(deepPurpleColorPalette).map(([tokenName, tokenValue]) => (
       <TokenView key={tokenName} tokenName={tokenName} tokenValue={tokenValue} />