feat: add collapse splitButton toggleButton storybook

Signed-off-by: Teacatkk <307519856@qq.com>

stories/Collapse.stories.tsx

@@ -0,0 +1,18 @@
+import React, { useState } from 'react';
+import { storiesOf } from '@storybook/react';
+import { Collapse } from 'react-bootstrap';
+import { Button } from '../src';
+
+storiesOf('Transitions | Collapse', module).add('default', () =>
+  React.createElement(() => {
+    const [open, setOpen] = useState(false);
+    return (
+      <>
+        <Button onClick={() => setOpen(!open)}>click</Button>
+        <Collapse in={open}>
+          <div style={{ marginTop: 10, width: 300, height: 1000, backgroundColor: 'grey' }}>Collapse</div>
+        </Collapse>
+      </>
+    );
+  }),
+);

stories/SplitButton.stories.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { Dropdown, SplitButton } from 'react-bootstrap';
+
+storiesOf('SplitButton', module).add('default', () => (
+  <>
+    {['Primary', 'Secondary', 'Success', 'Info', 'Warning', 'Danger'].map(variant => (
+      <SplitButton
+        key={variant}
+        id={`dropdown-split-variants-${variant}`}
+        variant={variant.toLowerCase()}
+        title={variant}
+      >
+        <Dropdown.Item eventKey="1">Action</Dropdown.Item>
+        <Dropdown.Item eventKey="2">Another action</Dropdown.Item>
+        <Dropdown.Item eventKey="3" active>
+          Active Item
+        </Dropdown.Item>
+        <Dropdown.Divider />
+        <Dropdown.Item eventKey="4">Separated link</Dropdown.Item>
+      </SplitButton>
+    ))}
+  </>
+));

stories/ToggleButtonGroup.stories.tsx

@@ -0,0 +1,49 @@
+import React, { useState } from 'react';
+import { storiesOf } from '@storybook/react';
+import { ToggleButton, ToggleButtonGroup } from 'react-bootstrap';
+
+storiesOf('ToggleButtonGroup', module)
+  .add('checkout', () => {
+    const [value, setValue] = useState([1]);
+    return (
+      <ToggleButtonGroup type="checkbox" value={value} onChange={val => setValue(val)}>
+        <ToggleButton
+          id="tbg-checkbox-1"
+          value={1}
+          variant={value.includes(1) ? 'primary' : 'default'}
+        >
+          checkbox 1
+        </ToggleButton>
+        <ToggleButton
+          id="tbg-checkbox-2"
+          value={2}
+          variant={value.includes(2) ? 'primary' : 'default'}
+        >
+          checkbox 2
+        </ToggleButton>
+        <ToggleButton
+          id="tbg-checkbox-3"
+          value={3}
+          variant={value.includes(3) ? 'primary' : 'default'}
+        >
+          checkbox 3
+        </ToggleButton>
+      </ToggleButtonGroup>
+    );
+  })
+  .add('radio', () => {
+    const [value, setValue] = useState(1);
+    return (
+      <ToggleButtonGroup type="radio" name="option" value={value} onChange={val => setValue(val)}>
+        <ToggleButton id="tbg-radio-1" value={1} variant={value === 1 ? 'primary' : 'default'}>
+          radio 1
+        </ToggleButton>
+        <ToggleButton id="tbg-radio-2" value={2} variant={value === 2 ? 'primary' : 'default'}>
+          radio 2
+        </ToggleButton>
+        <ToggleButton id="tbg-radio-3" value={3} variant={value === 3 ? 'primary' : 'default'}>
+          radio 3
+        </ToggleButton>
+      </ToggleButtonGroup>
+    );
+  });