decentraland-ui
Version:
Decentraland's UI components and styles
89 lines (88 loc) • 6.21 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Actions = exports.Sizes = exports.IconStory = exports.Link = exports.Inverted = exports.Basic = exports.Secondary = exports.Primary = void 0;
var react_1 = __importDefault(require("react"));
var Icon_1 = __importDefault(require("semantic-ui-react/dist/commonjs/elements/Icon/Icon"));
var Button_1 = require("./Button");
require("./Button.stories.css");
var Row_1 = require("../Row/Row");
var meta = {
title: 'Button',
component: Button_1.Button
};
exports.default = meta;
exports.Primary = {
render: function () { return (react_1.default.createElement(Row_1.Row, null,
react_1.default.createElement(Button_1.Button, { primary: true }, "Vote Now"),
react_1.default.createElement(Button_1.Button, { primary: true, disabled: true }, "Vote Now"))); }
};
exports.Secondary = {
render: function () { return (react_1.default.createElement(Row_1.Row, null,
react_1.default.createElement(Button_1.Button, null, "Cancel"),
react_1.default.createElement(Button_1.Button, { disabled: true }, "Cancel"))); }
};
exports.Basic = {
render: function () { return (react_1.default.createElement(Row_1.Row, null,
react_1.default.createElement(Button_1.Button, { basic: true }, "Download"),
react_1.default.createElement(Button_1.Button, { basic: true, disabled: true }, "Download"))); }
};
exports.Inverted = {
render: function () { return (react_1.default.createElement(Row_1.Row, null,
react_1.default.createElement(Button_1.Button, { inverted: true }, "Download"),
react_1.default.createElement(Button_1.Button, { inverted: true, disabled: true }, "Download"),
react_1.default.createElement(Button_1.Button, { inverted: true, primary: true }, "Download"),
react_1.default.createElement(Button_1.Button, { inverted: true, primary: true, disabled: true }, "Download"))); }
};
exports.Link = {
render: function () { return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(Button_1.Button, { href: "https://google.com", primary: true }, "google.com"))); }
};
exports.IconStory = {
render: function () { return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(Button_1.Button, { basic: true },
react_1.default.createElement(Icon_1.default, { name: "edit" }),
"Edit"))); }
};
exports.Sizes = {
render: function () { return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(Row_1.Row, { className: "button-story-row" },
react_1.default.createElement(Button_1.Button, { primary: true, size: "large" }, "Really Long Label"),
react_1.default.createElement(Button_1.Button, { primary: true, size: "large" }, "Min Width"),
react_1.default.createElement(Button_1.Button, { primary: true, disabled: true, size: "large" }, "Disabled")),
react_1.default.createElement(Row_1.Row, { className: "button-story-row" },
react_1.default.createElement(Button_1.Button, { size: "large" }, "Really Long Label"),
react_1.default.createElement(Button_1.Button, { size: "large" }, "Min Width"),
react_1.default.createElement(Button_1.Button, { disabled: true, size: "large" }, "Disabled")),
react_1.default.createElement(Row_1.Row, { className: "button-story-row" },
react_1.default.createElement(Button_1.Button, { primary: true }, "Really Long Label"),
react_1.default.createElement(Button_1.Button, { primary: true }, "Min Width"),
react_1.default.createElement(Button_1.Button, { primary: true, disabled: true }, "Disabled")),
react_1.default.createElement(Row_1.Row, { className: "button-story-row" },
react_1.default.createElement(Button_1.Button, null, "Really Long Label"),
react_1.default.createElement(Button_1.Button, null, "Min Width"),
react_1.default.createElement(Button_1.Button, { disabled: true }, "Disabled")),
react_1.default.createElement(Row_1.Row, { className: "button-story-row" },
react_1.default.createElement(Button_1.Button, { primary: true, size: "small" }, "Really Long Label"),
react_1.default.createElement(Button_1.Button, { primary: true, size: "small" }, "Min Width"),
react_1.default.createElement(Button_1.Button, { primary: true, disabled: true, size: "small" }, "Disabled")),
react_1.default.createElement(Row_1.Row, { className: "button-story-row" },
react_1.default.createElement(Button_1.Button, { size: "small" }, "Really Long Label"),
react_1.default.createElement(Button_1.Button, { size: "small" }, "Min Width"),
react_1.default.createElement(Button_1.Button, { disabled: true, size: "small" }, "Disabled")),
react_1.default.createElement(Row_1.Row, { className: "button-story-row" },
react_1.default.createElement(Button_1.Button, { primary: true, size: "tiny" }, "Really Long Label"),
react_1.default.createElement(Button_1.Button, { primary: true, size: "tiny" }, "Min Width"),
react_1.default.createElement(Button_1.Button, { primary: true, disabled: true, size: "tiny" }, "Disabled")),
react_1.default.createElement(Row_1.Row, { className: "button-story-row" },
react_1.default.createElement(Button_1.Button, { size: "tiny" }, "Really Long Label"),
react_1.default.createElement(Button_1.Button, { size: "tiny" }, "Min Width"),
react_1.default.createElement(Button_1.Button, { disabled: true, size: "tiny" }, "Disabled")))); }
};
exports.Actions = {
render: function () { return (react_1.default.createElement(Row_1.Row, null,
react_1.default.createElement(Button_1.Button, { primary: true, style: { minWidth: 190 } }, "Vote Now"),
react_1.default.createElement(Button_1.Button, { style: { minWidth: 190 } }, "Cancel"))); }
};