@votercircle/clay-v2-card 1.0.0

package/card.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+export declare type CardProps = {
+    children?: any;
+    style?: React.CSSProperties;
+};
+export declare type CardHeaderProps = {
+    children?: any;
+    style?: React.CSSProperties;
+};
+export declare type CardBodyProps = {
+    children?: any;
+    style?: React.CSSProperties;
+};
+export declare const Card: {
+    ({ children, ...rest }: CardProps): JSX.Element;
+    Header({ children, ...rest }: CardHeaderProps): JSX.Element;
+    Body({ children, ...rest }: CardBodyProps): JSX.Element;
+    Footer({ children, ...rest }: CardBodyProps): JSX.Element;
+    Divider(): JSX.Element;
+};

package/card.js

@@ -0,0 +1,60 @@
+"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 __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 };
+};
+exports.__esModule = true;
+exports.Card = void 0;
+var react_1 = __importDefault(require("react"));
+var styled_components_1 = __importDefault(require("styled-components"));
+var CardWrapper = styled_components_1["default"].div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border: 1px solid #e2e2e2;\n  border-radius: 8px;\n  padding: 16px 24px;\n  overflow: hidden;\n"], ["\n  border: 1px solid #e2e2e2;\n  border-radius: 8px;\n  padding: 16px 24px;\n  overflow: hidden;\n"])));
+var Card = function (_a) {
+    var children = _a.children, rest = __rest(_a, ["children"]);
+    return react_1["default"].createElement(CardWrapper, __assign({}, rest), children);
+};
+exports.Card = Card;
+var CardHeaderWrapper = styled_components_1["default"].div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  border-bottom: 1px solid #e2e2e2;\n  margin: -16px -24px 16px;\n  padding: 14px 24px;\n"], ["\n  border-bottom: 1px solid #e2e2e2;\n  margin: -16px -24px 16px;\n  padding: 14px 24px;\n"])));
+exports.Card.Header = function (_a) {
+    var children = _a.children, rest = __rest(_a, ["children"]);
+    return react_1["default"].createElement(CardHeaderWrapper, __assign({}, rest), children);
+};
+var CardBodyWrapper = styled_components_1["default"].div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  margin: -16px -24px;\n  padding: 16px 24px;\n"], ["\n  margin: -16px -24px;\n  padding: 16px 24px;\n"])));
+exports.Card.Body = function (_a) {
+    var children = _a.children, rest = __rest(_a, ["children"]);
+    return react_1["default"].createElement(CardBodyWrapper, __assign({}, rest), children);
+};
+var CardFooterWrapper = styled_components_1["default"].div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  border-top: 1px solid #e2e2e2;\n  margin: 16px -24px -16px -24px;\n  padding: 18px 24px;\n"], ["\n  border-top: 1px solid #e2e2e2;\n  margin: 16px -24px -16px -24px;\n  padding: 18px 24px;\n"])));
+exports.Card.Footer = function (_a) {
+    var children = _a.children, rest = __rest(_a, ["children"]);
+    return react_1["default"].createElement(CardFooterWrapper, __assign({}, rest), children);
+};
+var CardDividerWrapper = styled_components_1["default"].div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  border-top: 1px solid #e2e2e2;\n  margin: 16px -24px 16px -24px;\n"], ["\n  border-top: 1px solid #e2e2e2;\n  margin: 16px -24px 16px -24px;\n"])));
+exports.Card.Divider = function () {
+    return react_1["default"].createElement(CardDividerWrapper, null);
+};
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/index.d.ts

@@ -0,0 +1,2 @@
+export { Card } from './card';
+export { CardProps } from './card';

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.Card = void 0;
+var card_1 = require("./card");
+__createBinding(exports, card_1, "Card");

package/package.json

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