48 lines
1.1 KiB
TypeScript
48 lines
1.1 KiB
TypeScript
import React, { useState } from 'react';
|
|
import { ComponentStory, ComponentMeta } from '@storybook/react';
|
|
import { Modal, Button } from 'antd';
|
|
|
|
const Usage = () => {
|
|
const [isModalVisible, setIsModalVisible] = useState(false);
|
|
|
|
const showModal = () => {
|
|
setIsModalVisible(true);
|
|
};
|
|
|
|
const handleOk = () => {
|
|
setIsModalVisible(false);
|
|
};
|
|
|
|
const handleCancel = () => {
|
|
setIsModalVisible(false);
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<Button type="primary" onClick={showModal}>
|
|
Test Modal
|
|
</Button>
|
|
<Modal title="Basic Modal" visible={isModalVisible} onOk={handleOk} onCancel={handleCancel}>
|
|
<p>Some contents...</p>
|
|
<p>Some contents...</p>
|
|
<p>Some contents...</p>
|
|
</Modal>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default {
|
|
title: 'owncast/Modal',
|
|
component: Modal,
|
|
parameters: {},
|
|
} as ComponentMeta<typeof Modal>;
|
|
|
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
const Template: ComponentStory<typeof Modal> = args => <Usage />;
|
|
|
|
export const Basic = Template.bind({});
|
|
|
|
Usage.propTypes = {};
|
|
|
|
Usage.defaultProps = {};
|