123456789101112131415161718192021222324252627282930313233343536373839404142434445464748 |
- // @ts-check
- import '../src/pages/globals.css';
- import * as NextImage from 'next/image';
- const BREAKPOINTS_INT = {
- xs: 375,
- sm: 600,
- md: 900,
- lg: 1200,
- xl: 1536,
- };
- const customViewports = Object.fromEntries(
- Object.entries(BREAKPOINTS_INT).map(([key, val], idx) => {
- console.log(val);
- return [
- key,
- {
- name: key,
- styles: {
- width: `${val}px`,
- height: `${(idx + 5) * 10}vh`,
- },
- },
- ];
- })
- );
- // Allow Storybook to handle Next's <Image> component
- const OriginalNextImage = NextImage.default;
- Object.defineProperty(NextImage, 'default', {
- configurable: true,
- value: (props) => <OriginalNextImage {...props} unoptimized />,
- });
- export const parameters = {
- actions: { argTypesRegex: '^on[A-Z].*' },
- controls: {
- matchers: {
- color: /(background|color)$/i,
- date: /Date$/,
- },
- },
- viewport: { viewports: customViewports },
- }
|