mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Adding story for ToggleButton (#12311)
This commit is contained in:
parent
72a3db7c0c
commit
b27b591df1
32
ui/components/ui/toggle-button/toggle-button.stories.js
Normal file
32
ui/components/ui/toggle-button/toggle-button.stories.js
Normal file
@ -0,0 +1,32 @@
|
||||
import React, { useState } from 'react';
|
||||
import { action } from '@storybook/addon-actions';
|
||||
import { boolean, text } from '@storybook/addon-knobs';
|
||||
|
||||
import ToggleButton from './toggle-button.component';
|
||||
|
||||
export default {
|
||||
title: 'ToggleButton',
|
||||
component: ToggleButton,
|
||||
id: __filename,
|
||||
};
|
||||
|
||||
export const DefaultStory = () => {
|
||||
const [checked, setChecked] = useState(false);
|
||||
const handleOnToggle = (e) => {
|
||||
action('onToggle')(e);
|
||||
setChecked(!checked);
|
||||
};
|
||||
return (
|
||||
<ToggleButton
|
||||
offLabel={text('offLabel', 'off')}
|
||||
onLabel={text('onLabel', 'on')}
|
||||
disabled={boolean('disabled', false)}
|
||||
value={checked}
|
||||
onToggle={handleOnToggle}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
DefaultStory.story = {
|
||||
name: 'Default',
|
||||
};
|
Loading…
Reference in New Issue
Block a user