Skip to content

Commit 3e8aa92

Browse files
committed
Update README.md
1 parent ba58f6d commit 3e8aa92

File tree

1 file changed

+1
-101
lines changed

1 file changed

+1
-101
lines changed

README.md

Lines changed: 1 addition & 101 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ Demo: https://trendmicro-frontend.github.io/react-buttons
1717
2. At this point you can import `@trendmicro/react-buttons` and its styles in your application as follows:
1818

1919
```js
20-
import { Button, ButtonGroup, ButtonToolbar, ButtonDropdown } from '@trendmicro/react-buttons';
20+
import { Button, ButtonGroup, ButtonToolbar } from '@trendmicro/react-buttons';
2121

2222
// Be sure to include styles at some point, probably during your bootstraping
2323
import '@trendmicro/react-buttons/dist/react-buttons.css';
@@ -184,106 +184,6 @@ Demo: https://trendmicro-frontend.github.io/react-buttons
184184
</Button>
185185
```
186186

187-
### Dropdown Buttons
188-
189-
#### Single
190-
191-
```js
192-
<Button
193-
dropdown
194-
placeholder="Select..."
195-
options={[
196-
{ label: 'Action', value: 'v1' },
197-
{ label: 'Another action', value: 'v2' },
198-
{ label: 'Something else here', value: 'v3' }
199-
]}
200-
onChange={(selectedOption) => {
201-
if (selectedOption) {
202-
console.log('label =' + selectedOption.label + ', value = ' + selectedOption.value);
203-
}
204-
}}
205-
/>
206-
```
207-
208-
#### Split
209-
210-
```js
211-
<Button
212-
dropdown
213-
dropdownStyle="split"
214-
placeholder="Select..."
215-
options={[
216-
{ label: 'Action', value: 'v1' },
217-
{ label: 'Another action', value: 'v2' },
218-
{ label: 'Something else here', value: 'v3' }
219-
]}
220-
/>
221-
```
222-
223-
#### Fixed width
224-
```js
225-
<Button
226-
dropdown
227-
placeholder="Select..."
228-
options={[
229-
{ label: 'Action', value: 'v1' },
230-
{ label: 'Another action', value: 'v2' },
231-
{ label: 'Something else here', value: 'v3' }
232-
]}
233-
value="v1"
234-
fixedWidth={true}
235-
/>
236-
```
237-
238-
#### Text
239-
240-
```js
241-
<Button
242-
dropdown
243-
dropdownStyle="text"
244-
options={[
245-
{ label: 'Action', value: 'v1' },
246-
{ label: 'Another action', value: 'v2' },
247-
{ label: 'Something else here', value: 'v3' }
248-
]}
249-
>
250-
All Devices
251-
</Button>
252-
```
253-
254-
#### Icon
255-
256-
```js
257-
<Button
258-
dropdown
259-
dropdownStyle="text"
260-
options={[
261-
{ label: 'Action', value: 'v1' },
262-
{ label: 'Another action', value: 'v2' },
263-
{ label: 'Something else here', value: 'v3' }
264-
]}
265-
customValueRenderer={(option) => {
266-
return (
267-
<div>
268-
<i className="fa fa-database" />
269-
<span>{option.label}</span>
270-
</div>
271-
);
272-
}}
273-
>
274-
All Devices
275-
</Button>
276-
```
277-
278-
#### Dropdown Sizes
279-
280-
```js
281-
<Button btnSize="large" dropdown>Large</Button>
282-
<Button btnSize="medium" dropdown>Default</Button>
283-
<Button btnSize="small" dropdown>Small</Button>
284-
<Button btnSize="extra-small" dropdown>Extra Small</Button>
285-
```
286-
287187
## License
288188

289189
MIT

0 commit comments

Comments
 (0)