All files / Checkbox Checkbox.stories.tsx

92.85% Statements 13/14
100% Branches 2/2
50% Functions 1/2
92.85% Lines 13/14

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61                                  1x 5x 5x                 1x 1x       1x 1x           1x 1x           1x 1x           1x 1x          
import React, { useState } from 'react';
import { Meta, Story } from '@storybook/react';
 
import Checkbox, { ICheckboxProps } from './Checkbox';
 
export default {
	title: 'Controls/Checkbox',
	component: Checkbox,
	parameters: {
		docs: {
			description: {
				component: Checkbox.peek.description,
			},
		},
	},
} as Meta;
 
const Template: Story<ICheckboxProps> = (args) => {
	const [selected, setSelected] = useState(args.isSelected || false);
	return (
		<Checkbox
			{...args}
			isSelected={selected}
			onSelect={() => setSelected(!selected)}
		/>
	);
};
 
export const Basic: Story<ICheckboxProps> = Template.bind({});
Basic.args = {
	title: 'Default',
};
 
export const Plain: Story<ICheckboxProps> = Template.bind({});
Plain.args = {
	title: 'Plain',
	isDisabled: false,
	isSelected: true,
};
 
export const DisabledUnselected: Story<ICheckboxProps> = Template.bind({});
DisabledUnselected.args = {
	title: 'Disabled Unselected',
	isDisabled: true,
	isSelected: false,
};
 
export const DisabledSelected: Story<ICheckboxProps> = Template.bind({});
DisabledSelected.args = {
	title: 'Disabled Selected',
	isDisabled: true,
	isSelected: true,
};
 
export const DisabledIndeterminate: Story<ICheckboxProps> = Template.bind({});
DisabledIndeterminate.args = {
	title: 'Disabled Selected',
	isIndeterminate: true,
	isDisabled: true,
};