White(aegis4206)

# storybook需建立在專案上
npm create vite@latest projectName # 使用vite快速建立
npx sb init --builder @storybook/builder-vite

import Box from "./Box";
export default {
    title: "Box",
    component: Box
};

export const LargeBox = {
    args: {
        // 輸入傳入的props key:初始值
        // 設定項的輸入模式
        size: {
            // 常用type 預設text
            // boolean(switch)、range、radio
            // check、select、color、date
            control: 'type', 
            options?: [...options]
        }
    },
};

const Box = ({ backgroundColor }) => {
    const style = {
        backgroundColor
    }
    return (
        <div style={style}> Box</div >
    )
};

export default Box;

import type { Preview } from "@storybook/react";
import React from 'react'; // 需引入React

const preview: Preview = {
    ...otherParameters,
    decorators: [
        (Story) => (
            <div style={{ ...style }}>
                <Story />
            </div>
        )
    ]
};

export default preview;