@votercircle/clay-v2-button 1.0.0

package/button-container.d.ts

@@ -0,0 +1,11 @@
+declare type ButtonContainerProps = {
+    children?: any;
+    className?: string;
+    fill?: boolean;
+    busy?: boolean;
+    success?: boolean;
+    bgColor?: string | number;
+    borderRadius?: string;
+};
+export declare function ButtonContainer({ className, bgColor, borderRadius, children, fill, busy, success, }: ButtonContainerProps): JSX.Element;
+export {};

package/button-container.js

@@ -0,0 +1,54 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+var _a, _b, _c, _d, _e, _f, _g, _h;
+exports.__esModule = true;
+exports.ButtonContainer = void 0;
+var react_1 = __importDefault(require("react"));
+var styled_components_1 = __importStar(require("styled-components"));
+var cui_theme_provider_1 = require("@clay/cui.theme-provider");
+var rotate = (0, styled_components_1.keyframes)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  from {\n    transform: rotate(0deg);\n  }\n  30% {\n    transform: rotate(-60deg);\n  }\n  50%{\n    transform: rotate(-160deg);\n  }\n  60% {\n    transform: rotate(-200deg);\n  }\n  70% {\n    transform: rotate(-260deg);\n  }\n  80% {\n    transform: rotate(-300deg);\n  }\n  to {\n    transform: rotate(-360deg);\n  }\n"], ["\n  from {\n    transform: rotate(0deg);\n  }\n  30% {\n    transform: rotate(-60deg);\n  }\n  50%{\n    transform: rotate(-160deg);\n  }\n  60% {\n    transform: rotate(-200deg);\n  }\n  70% {\n    transform: rotate(-260deg);\n  }\n  80% {\n    transform: rotate(-300deg);\n  }\n  to {\n    transform: rotate(-360deg);\n  }\n"])));
+var ButtonContainerStyled = styled_components_1["default"].div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  --pdi-clay-ui-button-color-main: var(\n    --pdi-clay-theme-primary-main,\n    ", "\n  );\n  --pdi-clay-ui-button-color-dark: var(\n    --pdi-clay-theme-primary-dark,\n    ", "\n  );\n\n  &._color-success {\n    --pdi-clay-ui-button-color-main: var(\n      --pdi-clay-theme-success-main,\n      ", "\n    );\n    --pdi-clay-ui-button-color-dark: var(\n      --pdi-clay-theme-success-dark,\n      ", "\n    );\n  }\n  &._color-danger {\n    --pdi-clay-ui-button-color-main: var(\n      --pdi-clay-theme-danger-main,\n      ", "\n    );\n    --pdi-clay-ui-button-color-dark: var(\n      --pdi-clay-theme-danger-dark,\n      ", "\n    );\n  }\n  &._color-warning {\n    --pdi-clay-ui-button-color-main: var(\n      --pdi-clay-theme-warning-main,\n      ", "\n    );\n    --pdi-clay-ui-button-color-dark: var(\n      --pdi-clay-theme-warning-dark,\n      ", "\n    );\n  }\n\n  display: inline-block;\n  position: relative;\n  border-radius: ", ";\n  overflow: hidden;\n\n  &._fill {\n    width: 100%;\n  }\n  &._success {\n    .clay-ui-button-label_text,\n    .clay-ui-button-label-icon {\n      visibility: hidden;\n    }\n\n    .clay-ui-button-label_success {\n      display: inherit;\n    }\n  }\n  &._busy._fill:not(._success) {\n    width: calc(100% - 4px);\n  }\n\n  &._busy:not(._success) {\n    background: var(--pdi-clay-theme-grey-main, ", ");\n    padding: 2px;\n  }\n\n  &._busy:not(._success) .clay-ui-button-label {\n    background: var(--pdi-clay-theme-grey-main, ", ");\n    color: white;\n    cursor: default;\n    border: 0;\n    padding: 8px 13px;\n    min-height: 36px;\n  }\n\n  &._busy:not(._success) .clay-ui-button-spinner {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 120%;\n    height: 100%;\n    animation: ", " 2.5s linear infinite;\n\n    .clay-ui-button-spinner-stroke {\n      position: absolute;\n      top: 5px;\n      left: -3px;\n      width: 50%;\n      height: 30px;\n      background: var(--pdi-clay-ui-button-color-dark);\n    }\n  }\n"], ["\n  --pdi-clay-ui-button-color-main: var(\n    --pdi-clay-theme-primary-main,\n    ", "\n  );\n  --pdi-clay-ui-button-color-dark: var(\n    --pdi-clay-theme-primary-dark,\n    ", "\n  );\n\n  &._color-success {\n    --pdi-clay-ui-button-color-main: var(\n      --pdi-clay-theme-success-main,\n      ", "\n    );\n    --pdi-clay-ui-button-color-dark: var(\n      --pdi-clay-theme-success-dark,\n      ", "\n    );\n  }\n  &._color-danger {\n    --pdi-clay-ui-button-color-main: var(\n      --pdi-clay-theme-danger-main,\n      ", "\n    );\n    --pdi-clay-ui-button-color-dark: var(\n      --pdi-clay-theme-danger-dark,\n      ", "\n    );\n  }\n  &._color-warning {\n    --pdi-clay-ui-button-color-main: var(\n      --pdi-clay-theme-warning-main,\n      ", "\n    );\n    --pdi-clay-ui-button-color-dark: var(\n      --pdi-clay-theme-warning-dark,\n      ", "\n    );\n  }\n\n  display: inline-block;\n  position: relative;\n  border-radius: ", ";\n  overflow: hidden;\n\n  &._fill {\n    width: 100%;\n  }\n  &._success {\n    .clay-ui-button-label_text,\n    .clay-ui-button-label-icon {\n      visibility: hidden;\n    }\n\n    .clay-ui-button-label_success {\n      display: inherit;\n    }\n  }\n  &._busy._fill:not(._success) {\n    width: calc(100% - 4px);\n  }\n\n  &._busy:not(._success) {\n    background: var(--pdi-clay-theme-grey-main, ", ");\n    padding: 2px;\n  }\n\n  &._busy:not(._success) .clay-ui-button-label {\n    background: var(--pdi-clay-theme-grey-main, ", ");\n    color: white;\n    cursor: default;\n    border: 0;\n    padding: 8px 13px;\n    min-height: 36px;\n  }\n\n  &._busy:not(._success) .clay-ui-button-spinner {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 120%;\n    height: 100%;\n    animation: ", " 2.5s linear infinite;\n\n    .clay-ui-button-spinner-stroke {\n      position: absolute;\n      top: 5px;\n      left: -3px;\n      width: 50%;\n      height: 30px;\n      background: var(--pdi-clay-ui-button-color-dark);\n    }\n  }\n"])), function (props) { var _a; return props.bgColor || ((_a = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.primary) === null || _a === void 0 ? void 0 : _a.main); }, function (props) { var _a; return props.bgColor || ((_a = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.primary) === null || _a === void 0 ? void 0 : _a.dark); }, (_a = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.success) === null || _a === void 0 ? void 0 : _a.main, (_b = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.success) === null || _b === void 0 ? void 0 : _b.dark, (_c = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.danger) === null || _c === void 0 ? void 0 : _c.main, (_d = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.danger) === null || _d === void 0 ? void 0 : _d.dark, (_e = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.warning) === null || _e === void 0 ? void 0 : _e.main, (_f = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.warning) === null || _f === void 0 ? void 0 : _f.dark, function (props) { return props.borderRadius; }, (_g = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.grey) === null || _g === void 0 ? void 0 : _g.main, (_h = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.grey) === null || _h === void 0 ? void 0 : _h.main, rotate);
+function ButtonContainer(_a) {
+    var className = _a.className, bgColor = _a.bgColor, borderRadius = _a.borderRadius, children = _a.children, fill = _a.fill, busy = _a.busy, success = _a.success;
+    return (react_1["default"].createElement(ButtonContainerStyled, { className: [
+            className,
+            'clay-ui-button',
+            busy && '_busy',
+            success && '_success',
+            fill && '_fill',
+        ].join(' '), borderRadius: borderRadius, bgColor: bgColor },
+        react_1["default"].createElement("div", { className: 'clay-ui-button-spinner' },
+            react_1["default"].createElement("div", { className: 'clay-ui-button-spinner-stroke' })),
+        children));
+}
+exports.ButtonContainer = ButtonContainer;
+var templateObject_1, templateObject_2;

package/button.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+export declare type ButtonProps = {
+    className?: string;
+    children?: any;
+    variant?: 'primary' | 'outline' | 'text';
+    iconBtn?: boolean;
+    background?: string;
+    borderRadius?: string;
+    width?: string;
+    height?: string;
+    fill?: boolean;
+    color?: 'warning' | 'success' | 'danger';
+    busy?: boolean;
+    success?: boolean;
+    disabled?: boolean;
+    iconLeft?: any;
+    iconRight?: any;
+    type?: 'button' | 'submit' | 'reset';
+    onClick?: () => void;
+};
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/button.js

@@ -0,0 +1,94 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+var _a, _b, _c, _d;
+exports.__esModule = true;
+exports.Button = void 0;
+var react_1 = __importDefault(require("react"));
+var styled_components_1 = __importStar(require("styled-components"));
+var cui_theme_provider_1 = require("@clay/cui.theme-provider");
+var cui_icon_1 = require("@clay/cui.icon");
+var cui_typography_text_1 = require("@clay/cui.typography.text");
+var button_container_1 = require("./button-container");
+var classnames_1 = __importDefault(require("classnames"));
+var successMarkAnim = (0, styled_components_1.keyframes)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  from {\n    width: 0;\n  }\n  to{\n    width:100%;\n  }\n  "], ["\n  from {\n    width: 0;\n  }\n  to{\n    width:100%;\n  }\n  "])));
+var ButtonWrapper = styled_components_1["default"].button(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  &.clay-ui-button-label {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    background: var(--pdi-clay-ui-button-color-main);\n    margin: 0;\n    padding: 10px 15px;\n    border: 0;\n    border-radius: ", ";\n    min-height: 40px;\n    color: #fff;\n    font-weight: bold;\n    cursor: pointer;\n    transition: 0.3s ease background;\n  }\n\n  .clay-ui-button-label_success {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    .clay-ui-button-label-success-icon {\n      overflow: hidden;\n      animation: ", " 0.8s ease;\n    }\n  }\n\n  .clay-ui-button-label-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n\n    &._left {\n      margin-right: 11px;\n    }\n\n    &._right {\n      margin-left: 11px;\n    }\n  }\n\n  .clay-ui-button-label_success {\n    display: none;\n  }\n\n  &._fill {\n    width: 100% !important;\n  }\n\n  &._fill .clay-ui-button-label-icon._left {\n    position: absolute;\n    left: 16px;\n    display: flex;\n  }\n\n  &._fill .clay-ui-button-label-icon._right {\n    position: absolute;\n    right: 16px;\n    display: flex;\n  }\n\n  &._outline {\n    background: white;\n    color: var(--pdi-clay-ui-button-color-main);\n    border: 1px solid currentColor;\n    padding: 10px 14px;\n  }\n\n  &._outline:hover {\n    background: var(--pdi-clay-theme-grey-light, ", ");\n    color: var(pdi-clay-ui-button-color-dark);\n  }\n\n  &._primary:hover {\n    background: var(--pdi-clay-ui-button-color-dark);\n  }\n\n  &._text {\n    background: white;\n    color: var(--pdi-clay-ui-button-color-main);\n    border: 0;\n    padding: 10px 14px;\n  }\n  &._text:hover {\n    background: var(--pdi-clay-theme-grey-light, ", ");\n    color: var(--pdi-clay-ui-button-color-dark);\n  }\n\n  &._disabled._outline,\n  &._disabled._outline:hover {\n    cursor: default;\n    color: var(--pdi-clay-theme-grey-main, ", ");\n  }\n\n  &._disabled._primary,\n  &._disabled._primary:hover {\n    cursor: default;\n    background: var(--pdi-clay-theme-grey-main, ", ");\n  }\n\n  &._icon-btn {\n    padding: 6px 8px 0;\n    font-size: 24px;\n  }\n"], ["\n  &.clay-ui-button-label {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    background: var(--pdi-clay-ui-button-color-main);\n    margin: 0;\n    padding: 10px 15px;\n    border: 0;\n    border-radius: ", ";\n    min-height: 40px;\n    color: #fff;\n    font-weight: bold;\n    cursor: pointer;\n    transition: 0.3s ease background;\n  }\n\n  .clay-ui-button-label_success {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    .clay-ui-button-label-success-icon {\n      overflow: hidden;\n      animation: ", " 0.8s ease;\n    }\n  }\n\n  .clay-ui-button-label-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n\n    &._left {\n      margin-right: 11px;\n    }\n\n    &._right {\n      margin-left: 11px;\n    }\n  }\n\n  .clay-ui-button-label_success {\n    display: none;\n  }\n\n  &._fill {\n    width: 100% !important;\n  }\n\n  &._fill .clay-ui-button-label-icon._left {\n    position: absolute;\n    left: 16px;\n    display: flex;\n  }\n\n  &._fill .clay-ui-button-label-icon._right {\n    position: absolute;\n    right: 16px;\n    display: flex;\n  }\n\n  &._outline {\n    background: white;\n    color: var(--pdi-clay-ui-button-color-main);\n    border: 1px solid currentColor;\n    padding: 10px 14px;\n  }\n\n  &._outline:hover {\n    background: var(--pdi-clay-theme-grey-light, ", ");\n    color: var(pdi-clay-ui-button-color-dark);\n  }\n\n  &._primary:hover {\n    background: var(--pdi-clay-ui-button-color-dark);\n  }\n\n  &._text {\n    background: white;\n    color: var(--pdi-clay-ui-button-color-main);\n    border: 0;\n    padding: 10px 14px;\n  }\n  &._text:hover {\n    background: var(--pdi-clay-theme-grey-light, ", ");\n    color: var(--pdi-clay-ui-button-color-dark);\n  }\n\n  &._disabled._outline,\n  &._disabled._outline:hover {\n    cursor: default;\n    color: var(--pdi-clay-theme-grey-main, ", ");\n  }\n\n  &._disabled._primary,\n  &._disabled._primary:hover {\n    cursor: default;\n    background: var(--pdi-clay-theme-grey-main, ", ");\n  }\n\n  &._icon-btn {\n    padding: 6px 8px 0;\n    font-size: 24px;\n  }\n"])), function (props) { return props.borderRadius; }, successMarkAnim, (_a = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.grey) === null || _a === void 0 ? void 0 : _a.light, (_b = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.grey) === null || _b === void 0 ? void 0 : _b.light, (_c = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.grey) === null || _c === void 0 ? void 0 : _c.main, (_d = cui_theme_provider_1.DefaultPalette === null || cui_theme_provider_1.DefaultPalette === void 0 ? void 0 : cui_theme_provider_1.DefaultPalette.grey) === null || _d === void 0 ? void 0 : _d.main);
+exports.Button = react_1["default"].forwardRef(function (_a, ref) {
+    var _b;
+    var background = _a.background, borderRadius = _a.borderRadius, width = _a.width, height = _a.height, variant = _a.variant, type = _a.type, children = _a.children, fill = _a.fill, color = _a.color, busy = _a.busy, success = _a.success, iconLeft = _a.iconLeft, iconRight = _a.iconRight, disabled = _a.disabled, iconBtn = _a.iconBtn, rest = __rest(_a, ["background", "borderRadius", "width", "height", "variant", "type", "children", "fill", "color", "busy", "success", "iconLeft", "iconRight", "disabled", "iconBtn"]);
+    return (react_1["default"].createElement(button_container_1.ButtonContainer, { busy: busy, success: success, fill: fill, className: color && '_color-' + color, bgColor: background, borderRadius: borderRadius },
+        react_1["default"].createElement(ButtonWrapper, __assign({ ref: ref, type: type, borderRadius: borderRadius, className: (0, classnames_1["default"])((_b = {
+                    'clay-ui-button-label': true,
+                    _fill: fill
+                },
+                _b['_' + variant] = variant,
+                _b._disabled = disabled,
+                _b['_' + color] = color,
+                _b['_has-icon-left'] = iconLeft,
+                _b['_has-icon-right'] = iconRight,
+                _b['_icon-btn'] = iconBtn,
+                _b)), style: { width: width, height: height } }, rest, { disabled: busy || disabled }),
+            iconLeft && !iconBtn ? (react_1["default"].createElement("span", { className: 'clay-ui-button-label-icon _left' }, (0, cui_icon_1.getIconByType)(iconLeft))) : (''),
+            react_1["default"].createElement("span", { className: 'clay-ui-button-label_text' }, iconBtn ? (0, cui_icon_1.getIconByType)(children) : react_1["default"].createElement(cui_typography_text_1.Text, { variant: 'b3' }, children)),
+            react_1["default"].createElement("span", { className: 'clay-ui-button-label_success' },
+                react_1["default"].createElement(cui_icon_1.Icon, { className: 'clay-ui-button-label-success-icon', name: 'check' })),
+            iconRight && !iconBtn ? (react_1["default"].createElement("span", { className: 'clay-ui-button-label-icon _right' }, (0, cui_icon_1.getIconByType)(iconRight))) : (''))));
+});
+exports.Button.defaultProps = {
+    variant: 'primary',
+    borderRadius: '4px',
+    width: 'auto',
+    height: 'auto',
+    type: 'submit'
+};
+var templateObject_1, templateObject_2;

package/index.d.ts

@@ -0,0 +1,2 @@
+export { Button } from './button';
+export { ButtonProps } from './button';

package/index.js

@@ -0,0 +1,16 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+exports.__esModule = true;
+exports.Button = void 0;
+var button_1 = require("./button");
+__createBinding(exports, button_1, "Button");

package/package.json

@@ -0,0 +1,11 @@
+{
+  "name": "@votercircle/clay-v2-button",
+  "version": "1.0.0",
+  "main": "index.js",
+  "types": "index.d.ts",
+  "peerDependencies": {
+    "react": ">=16",
+    "react-dom": ">=16",
+    "styled-components": ">=5"
+  }
+}