#How to set controls individually for each story

4 messages · Page 1 of 1 (latest)

trim mica
#
import React from 'react'
import AreaChart from './AreaChart'
import { Meta } from '@storybook/react'
import { IDefaultChartProps } from '../types'

export default {
    title: 'Charts/Area Chart',
    component: AreaChart,
    argTypes: {
        title: {
            table: {
                disable: true
            }
        },
        yComplement: {
            table: {
                disable: true
            }
        },
        lineMakeName: {
            table: {
                disable: true
            }
        }
    }
} as Meta<typeof AreaChart>

export const areaChartWithTime = (
    args: React.JSX.IntrinsicAttributes & IDefaultChartProps
) => (
    <AreaChart
        {...args}
        color='#74007c'
        xType='time'
        yType='time'
        title='Area Chart With Time'
        tooltip={{ label: 'Data', result: 'MTBF' }}
        data={[
            { label: '2019-02-01', result: 4.5 },
            { label: '2019-03-01', result: 3 },
            { label: '2019-04-01', result: 2 },
            { label: '2019-05-01', result: 4 },
            { label: '2019-06-01', result: 5 },
            { label: '2019-07-01', result: 3 },
            { label: '2019-08-01', result: 4 },
            { label: '2019-09-01', result: 2 },
            { label: '2019-10-01', result: 6 }
        ]}
    />
)

export const areaChartWithDateAndTime = (
    args: React.JSX.IntrinsicAttributes & IDefaultChartProps
) => (
    <AreaChart
        {...args}
        xType='time'
        dateFormat='MMM/dd HH:mm'
        title='Area Chart With Date And Time'
        toolboxTooltip={{ saveAsImage: 'saving' }}
        tooltip={{ label: 'Data', result: 'O.S. em aberto' }}
        color='#E65100'
        data={[
            { label: '2019-09-01 08:40', result: 1 },
            { label: '2019-09-02 12:32', result: 4 },
            { label: '2019-09-03 14:20', result: 3 },
            { label: '2019-09-04 19:25', result: 2 }
        ]}
    />
)
#

I was able to disable the unwanted controls directly on the default export, but how can I manage the controls for each story?

gusty spruce
#

Most of all settings in storybook cascade. Meaning story overwrites meta, meta overrides preview