summaryrefslogtreecommitdiff
path: root/src/components/StyleGuide.js
diff options
context:
space:
mode:
authorHaishan <[email protected]>2020-10-31 18:18:04 +0800
committerHaishan <[email protected]>2020-11-01 17:42:52 +0800
commitff1a39d04e53b428e34d46c55ecd6689189b5443 (patch)
tree94a60abe3d28a1d729b877356bdd38d75ce655a5 /src/components/StyleGuide.js
parente62c9165481ef12ee2310dee1c32f890b3fe4b78 (diff)
chore: run ts-migrate
Diffstat (limited to 'src/components/StyleGuide.js')
-rw-r--r--src/components/StyleGuide.js82
1 files changed, 0 insertions, 82 deletions
diff --git a/src/components/StyleGuide.js b/src/components/StyleGuide.js
deleted file mode 100644
index 5979ee5..0000000
--- a/src/components/StyleGuide.js
+++ /dev/null
@@ -1,82 +0,0 @@
-import React, { PureComponent } from 'react';
-import { Zap } from 'react-feather';
-
-import Button from './Button';
-import Input from './Input';
-import { LoadingDot } from './shared/Basic';
-import SwitchThemed from './SwitchThemed';
-import ToggleSwitch from './ToggleSwitch';
-
-const noop = () => {
- /* empty */
-};
-
-const paneStyle = {
- padding: '20px 0',
-};
-
-const optionsRule = [
- {
- label: 'Global',
- value: 'Global',
- },
- {
- label: 'Rule',
- value: 'Rule',
- },
- {
- label: 'Direct',
- value: 'Direct',
- },
-];
-
-const Pane = ({ children, style }) => (
- <div style={{ ...paneStyle, ...style }}>{children}</div>
-);
-
-function useToggle(initialState = false) {
- const [onoff, setonoff] = React.useState(initialState);
- const handleChange = React.useCallback(() => {
- setonoff((x) => !x);
- }, []);
- return [onoff, handleChange];
-}
-
-function SwitchExample() {
- const [checked, handleChange] = useToggle(false);
- return <SwitchThemed checked={checked} onChange={handleChange} />;
-}
-
-class StyleGuide extends PureComponent {
- render() {
- return (
- <div>
- <Pane>
- <SwitchExample />
- </Pane>
- <Pane>
- <Input />
- </Pane>
- <Pane>
- <ToggleSwitch
- name="test"
- options={optionsRule}
- value="Rule"
- onChange={noop}
- />
- </Pane>
- <Pane>
- <Button text="Test Lxatency" start={<Zap size={16} />} />
- <Button text="Test Lxatency" start={<Zap size={16} />} isLoading />
- <Button label="Test Lxatency" />
- <Button label="Button Plain" kind="minimal" />
- </Pane>
- <Pane style={{ paddingLeft: 20 }}>
- <LoadingDot />
- </Pane>
- </div>
- );
- }
-}
-
-export default StyleGuide;