lucid-ui
Version:
A UI component library from AppNexus.
31 lines (30 loc) • 1.4 kB
JavaScript
import _ from 'lodash';
import React from 'react';
import { Button, CheckIcon } from '../../../index';
const kinds = [undefined, 'primary', 'link', 'danger', 'invisible'];
const sizes = [undefined, 'small', 'short', 'large'];
export default () => (React.createElement("div", { style: {
display: 'grid',
gridGap: '10px',
gridTemplateColumns: `repeat(${kinds.length}, auto)`,
justifyItems: 'start',
alignItems: 'center',
gridAutoFlow: 'column',
} }, _.map(sizes, (size, sizeIndex) => _.map(kinds, kind => (React.createElement(React.Fragment, { key: `${size}-${kind}` },
React.createElement(Button, { style: { gridColumn: sizeIndex + 1 }, size: size, kind: kind },
size ? size : 'standard',
" ",
kind),
React.createElement(Button, { style: { gridColumn: sizeIndex + 1 }, size: size, kind: kind },
React.createElement(CheckIcon, null),
size ? size : 'standard',
" ",
kind),
React.createElement(Button, { isDisabled: true, style: { gridColumn: sizeIndex + 1 }, size: size, kind: kind },
React.createElement(CheckIcon, null),
"disabled ",
size ? size : 'standard',
" ",
kind),
React.createElement(Button, { style: { gridColumn: sizeIndex + 1 }, size: size, kind: kind, hasOnlyIcon: true },
React.createElement(CheckIcon, null))))))));