How to use the grommet-icons.Add function in grommet-icons

To help you get started, we’ve selected a few grommet-icons examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github grommet / grommet / components / Button / button.stories.js View on Github external
var IconButton = function IconButton() {
  return _react2.default.createElement(
    _Grommet2.default,
    { theme: _themes.grommet },
    _react2.default.createElement(_Button2.default, { icon: _react2.default.createElement(_grommetIcons.Add, null), hoverIndicator: true, onClick: function onClick() {} })
  );
};
github grommet / grommet / components / Button / stories / Multiple.js View on Github external
theme: _themes.grommet
  }, _react["default"].createElement(_grommet.Box, {
    align: "center",
    pad: "large"
  }, _react["default"].createElement(_grommet.Box, {
    direction: "row",
    align: "center",
    gap: "small",
    pad: "xsmall"
  }, _react["default"].createElement(_grommet.Button, {
    label: "Cancel",
    onClick: function onClick() {}
  }), _react["default"].createElement(_grommet.Button, {
    color: "dark-1",
    primary: true,
    icon: _react["default"].createElement(_grommetIcons.Add, {
      color: "accent-1"
    }),
    label: "Add",
    onClick: function onClick() {}
  })), _react["default"].createElement(_grommet.Box, {
    direction: "row",
    align: "center",
    gap: "small",
    pad: "xsmall"
  }, _react["default"].createElement(_grommet.Button, {
    label: "Cancel",
    onClick: function onClick() {}
  }), _react["default"].createElement(_grommet.Button, {
    color: "dark-1",
    primary: true,
    icon: _react["default"].createElement(_grommetIcons.Add, null),
github grommet / grommet / components / Button / stories / Plain.js View on Github external
var PlainButton = function PlainButton(props) {
  return _react["default"].createElement(_grommet.Grommet, {
    theme: _themes.grommet
  }, _react["default"].createElement(_grommet.Box, {
    align: "center",
    pad: "large"
  }, _react["default"].createElement(_grommet.Button, _extends({
    hoverIndicator: "light-1",
    onClick: function onClick() {}
  }, props), _react["default"].createElement(_grommet.Box, {
    pad: "small",
    direction: "row",
    align: "center",
    gap: "small"
  }, _react["default"].createElement(_grommetIcons.Add, null), _react["default"].createElement(_grommet.Text, null, "Add")))));
};
github grommet / grommet / components / Grommet / grommet.stories.js View on Github external
var Themed = function Themed() {
  return _react["default"].createElement(_grommet.Grommet, {
    theme: customTheme
  }, _react["default"].createElement(_grommet.Box, {
    pad: "medium"
  }, _react["default"].createElement(_grommet.Anchor, {
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    label: "Add",
    color: "custom"
  })));
};
github grommet / grommet / components / Button / stories / Multiple.js View on Github external
color: "dark-1",
    primary: true,
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    label: "Add",
    onClick: function onClick() {}
  })), _react["default"].createElement(_grommet.Box, {
    direction: "row",
    align: "center",
    gap: "small",
    pad: "xsmall"
  }, _react["default"].createElement(_grommet.Button, {
    label: "Cancel",
    onClick: function onClick() {}
  }), _react["default"].createElement(_grommet.Button, {
    primary: true,
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    label: "Add",
    onClick: function onClick() {}
  })), _react["default"].createElement(_grommet.Box, {
    direction: "row",
    align: "center",
    gap: "small",
    pad: "xsmall"
  }, _react["default"].createElement(_grommet.Button, {
    label: "Cancel",
    onClick: function onClick() {}
  }), _react["default"].createElement(_grommet.Button, {
    color: "light-2",
    primary: true,
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    label: "Add",
    onClick: function onClick() {}
github grommet / grommet / components / Button / stories / IconLabel.js View on Github external
align: "center",
    pad: "large"
  }, _react["default"].createElement(_grommet.Box, {
    round: "full",
    overflow: "hidden",
    background: "neutral-1"
  }, _react["default"].createElement(_grommet.Button, {
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    hoverIndicator: true,
    onClick: function onClick() {}
  })), _react["default"].createElement(_grommet.Box, {
    align: "center",
    pad: "large",
    gap: "small"
  }, _react["default"].createElement(_grommet.Button, {
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    label: "Add",
    onClick: function onClick() {},
    primary: true
  }), _react["default"].createElement(_grommet.Button, {
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    label: "Add",
    onClick: function onClick() {}
  }), _react["default"].createElement(_grommet.Button, {
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    label: "Add",
    gap: "xlarge",
    onClick: function onClick() {}
  }), _react["default"].createElement(_grommet.Button, {
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    label: "500px gap",
    gap: "500px",
github grommet / grommet / components / Anchor / anchor.stories.js View on Github external
}).add('Icon', function () {
  return _react2.default.createElement(
    _.Grommet,
    { theme: _themes.grommet },
    _react2.default.createElement(_.Anchor, { icon: _react2.default.createElement(_grommetIcons.Add, null), label: 'Add', href: '#' })
  );
}).add('With Text', function () {
  return _react2.default.createElement(
github grommet / grommet / components / Button / stories / IconLabel.js View on Github external
var IconLabel = function IconLabel() {
  return _react["default"].createElement(_grommet.Grommet, {
    theme: _themes.grommet
  }, _react["default"].createElement(_grommet.Box, {
    align: "center",
    pad: "large"
  }, _react["default"].createElement(_grommet.Box, {
    round: "full",
    overflow: "hidden",
    background: "neutral-1"
  }, _react["default"].createElement(_grommet.Button, {
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    hoverIndicator: true,
    onClick: function onClick() {}
  })), _react["default"].createElement(_grommet.Box, {
    align: "center",
    pad: "large",
    gap: "small"
  }, _react["default"].createElement(_grommet.Button, {
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    label: "Add",
    onClick: function onClick() {},
    primary: true
  }), _react["default"].createElement(_grommet.Button, {
    icon: _react["default"].createElement(_grommetIcons.Add, null),
    label: "Add",
    onClick: function onClick() {}
  }), _react["default"].createElement(_grommet.Button, {
github grommet / grommet / components / Layer / layer.stories.js View on Github external
NotificationLayer.prototype.render = function render() {
    var open = this.state.open;

    return _react2.default.createElement(
      _.Grommet,
      { theme: _themes.grommet },
      _react2.default.createElement(_.Button, {
        icon: _react2.default.createElement(_grommetIcons.Add, { color: 'brand' }),
        label: _react2.default.createElement(
          _.Text,
          null,
          _react2.default.createElement(
            'strong',
            null,
            'Add'
          )
        ),
        onClick: this.onOpen,
        plain: true
      }),
      open && _react2.default.createElement(
        _.Layer,
        {
          position: 'bottom',