lucid-ui/lib/components/Button/examples/all-types.js

A UI component library from AppNexus.

import _map from "lodash/map";
import React from 'react';
import { Button, CheckIcon } from '../../../index';
var kinds = [undefined, 'primary', 'link', 'danger', 'invisible'];
var sizes = [undefined, 'small', 'short', 'large'];
export default (function () {
  return /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'grid',
      gridGap: '10px',
      gridTemplateColumns: "repeat(".concat(kinds.length, ", auto)"),
      justifyItems: 'start',
      alignItems: 'center',
      gridAutoFlow: 'column'
    }
  }, _map(sizes, function (size, sizeIndex) {
    return _map(kinds, function (kind) {
      return /*#__PURE__*/React.createElement(React.Fragment, {
        key: "".concat(size, "-").concat(kind)
      }, /*#__PURE__*/React.createElement(Button, {
        style: {
          gridColumn: sizeIndex + 1
        },
        size: size,
        kind: kind
      }, size ? size : 'standard', " ", kind), /*#__PURE__*/React.createElement(Button, {
        style: {
          gridColumn: sizeIndex + 1
        },
        size: size,
        kind: kind
      }, /*#__PURE__*/React.createElement(CheckIcon, null), size ? size : 'standard', " ", kind), /*#__PURE__*/React.createElement(Button, {
        isDisabled: true,
        style: {
          gridColumn: sizeIndex + 1
        },
        size: size,
        kind: kind
      }, /*#__PURE__*/React.createElement(CheckIcon, null), "disabled ", size ? size : 'standard', " ", kind), /*#__PURE__*/React.createElement(Button, {
        style: {
          gridColumn: sizeIndex + 1
        },
        size: size,
        kind: kind,
        hasOnlyIcon: true
      }, /*#__PURE__*/React.createElement(CheckIcon, null)));
    });
  }));
});