@via-profit/ui-kit 0.1.0-rc.2 → 0.1.0-rc.21

package/Surface/SurfaceHeader.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export type SurfaceHeaderProps = React.HTMLAttributes<HTMLDivElement>;
+declare const _default: React.ForwardRefExoticComponent<SurfaceHeaderProps & React.RefAttributes<HTMLDivElement>>;
+export default _default;

package/Surface/SurfaceHeader.js

@@ -0,0 +1,30 @@
+"use strict";
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const StyledHeader = styled_1.default.div `
+  padding: 1rem 1rem 0 1rem;
+  font-size: 1.3rem;
+  font-weight: 600;
+  border-top-left-radius: inherit;
+  border-top-right-radius: inherit;
+`;
+const SurfaceHeader = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(StyledHeader, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(SurfaceHeader);

package/Surface/SurfaceSubheader.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export type SurfaceSubheaderProps = React.HTMLAttributes<HTMLDivElement>;
+declare const _default: React.ForwardRefExoticComponent<SurfaceSubheaderProps & React.RefAttributes<HTMLDivElement>>;
+export default _default;

package/Surface/SurfaceSubheader.js

@@ -0,0 +1,29 @@
+"use strict";
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const StyledHeader = styled_1.default.div `
+  padding: 1rem 1rem 0 1rem;
+  font-size: 0.9rem;
+  font-weight: 200;
+  color: ${({ theme }) => theme.color.textSecondary.toString()};
+`;
+const SurfaceSubheader = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(StyledHeader, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(SurfaceSubheader);

package/Surface/index.d.ts

@@ -0,0 +1,62 @@
+import * as React from 'react';
+import { SurfaceContainerProps } from './SurfaceContainer';
+import { SurfaceHeaderProps } from './SurfaceHeader';
+import { SurfaceSubheaderProps } from './SurfaceSubheader';
+import { SurfaceContentProps } from './SurfaceContent';
+export type SurfaceProps = React.HTMLAttributes<HTMLDivElement> & {
+    readonly children: React.ReactNode | React.ReactNode[];
+    /**
+     * Header content
+     */
+    readonly header?: React.ReactNode;
+    /**
+     * Subheader content
+     */
+    readonly subheader?: React.ReactNode;
+    /**
+     * Disable bottom margin
+     */
+    readonly noMargin?: boolean;
+    /**
+     * Overridable components map
+     */
+    readonly overrides?: SurfaceOverrides;
+};
+export interface SurfaceOverrides {
+    /**
+     * Surface container component
+     */
+    readonly Container?: React.ForwardRefExoticComponent<SurfaceContainerProps & React.RefAttributes<HTMLDivElement>>;
+    /**
+     * Surface header component
+     */
+    readonly Header?: React.ForwardRefExoticComponent<SurfaceHeaderProps & React.RefAttributes<HTMLDivElement>>;
+    /**
+     * Surface subheader component
+     */
+    readonly Subheader?: React.ForwardRefExoticComponent<SurfaceSubheaderProps & React.RefAttributes<HTMLDivElement>>;
+    /**
+     * Surface content component
+     */
+    readonly Content?: React.ForwardRefExoticComponent<SurfaceContentProps & React.RefAttributes<HTMLDivElement>>;
+}
+declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    readonly children: React.ReactNode | React.ReactNode[];
+    /**
+     * Header content
+     */
+    readonly header?: React.ReactNode;
+    /**
+     * Subheader content
+     */
+    readonly subheader?: React.ReactNode;
+    /**
+     * Disable bottom margin
+     */
+    readonly noMargin?: boolean | undefined;
+    /**
+     * Overridable components map
+     */
+    readonly overrides?: SurfaceOverrides | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export default _default;

package/Surface/index.js

@@ -0,0 +1,61 @@
+"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];
+}));
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const SurfaceContainer_1 = __importDefault(require("./SurfaceContainer"));
+const SurfaceHeader_1 = __importDefault(require("./SurfaceHeader"));
+const SurfaceSubheader_1 = __importDefault(require("./SurfaceSubheader"));
+const SurfaceContent_1 = __importDefault(require("./SurfaceContent"));
+const Surface = (props, ref) => {
+    const { children, header, subheader, noMargin, overrides } = props, nativeProps = __rest(props, ["children", "header", "subheader", "noMargin", "overrides"]);
+    const hasHeader = typeof header !== 'undefined' && header !== null;
+    const hasSubheader = typeof subheader !== 'undefined' && subheader !== null;
+    const overridesMap = React.useMemo(() => (Object.assign({ Container: SurfaceContainer_1.default,
+        Header: SurfaceHeader_1.default,
+        Subheader: SurfaceSubheader_1.default,
+        Content: SurfaceContent_1.default }, overrides)), [overrides]);
+    if (!hasHeader && hasSubheader) {
+        console.warn(`[@via-profit/ui-kit] Surface component. If you use a subheader, then you should add a header`);
+    }
+    return (React.createElement(overridesMap.Container, Object.assign({}, nativeProps, { noMargin: noMargin, ref: ref }),
+        hasHeader && React.createElement(overridesMap.Header, null, header),
+        hasSubheader && React.createElement(overridesMap.Subheader, null, subheader),
+        React.createElement(overridesMap.Content, null, children)));
+};
+exports.default = React.forwardRef(Surface);

package/Table/Table.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export type TableProps = React.TableHTMLAttributes<HTMLTableElement> & {
+    readonly fullWidth?: boolean;
+};
+declare const _default: React.ForwardRefExoticComponent<React.TableHTMLAttributes<HTMLTableElement> & {
+    readonly fullWidth?: boolean | undefined;
+} & React.RefAttributes<HTMLTableElement>>;
+export default _default;

package/Table/Table.js

@@ -0,0 +1,46 @@
+"use strict";
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const react_2 = require("@emotion/react");
+const StyledTable = styled_1.default.table `
+  display: table;
+  width: 100%;
+  box-sizing: border-box;
+  text-indent: initial;
+  border-spacing: 0;
+  border-collapse: collapse;
+  table-layout: fixed;
+  margin-bottom: 1.5em;
+  border: none;
+  text-align: left;
+  overflow: hidden;
+  background: ${({ theme }) => theme.color.surface.toString()};
+  color: ${({ theme }) => theme.color.textPrimary.toString()};
+  box-shadow: ${({ theme }) => `0 0.5em 2em -0.8em ${theme.color.surface.darken(100).alpha(0.4).toString()}`};
+  border-radius: ${({ theme }) => theme.shape.radiusFactor}em;
+  font-size: 1em;
+  ${({ $fullWidth }) => $fullWidth &&
+    (0, react_2.css) `
+      width: 100%;
+    `};
+`;
+const Table = (props, ref) => {
+    const { children, fullWidth } = props, nativeProps = __rest(props, ["children", "fullWidth"]);
+    return (react_1.default.createElement(StyledTable, Object.assign({ role: "table", "$fullWidth": fullWidth }, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(Table);

package/Table/TableBody.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export type TableBodyProps = React.TableHTMLAttributes<HTMLTableSectionElement>;
+declare const _default: React.ForwardRefExoticComponent<TableBodyProps & React.RefAttributes<HTMLTableSectionElement>>;
+export default _default;

package/Table/TableBody.js

@@ -0,0 +1,30 @@
+"use strict";
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const StyledTableBody = styled_1.default.tbody `
+  display: table-row-group;
+  vertical-align: middle;
+  & > [role='row']:last-of-type {
+    border-bottom: none;
+  }
+`;
+const TableBody = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(StyledTableBody, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(TableBody);

package/Table/TableCaption.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export type TableCaptionProps = React.HTMLAttributes<HTMLElement>;
+declare const _default: React.ForwardRefExoticComponent<TableCaptionProps & React.RefAttributes<HTMLElement>>;
+export default _default;

package/Table/TableCaption.js

@@ -0,0 +1,30 @@
+"use strict";
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const StyledTableCaption = styled_1.default.caption `
+  display: table-caption;
+  text-align: center;
+  padding: 0.26em;
+  font-size: 1.2em;
+  font-weight: 700;
+`;
+const TableCaption = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(StyledTableCaption, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(TableCaption);

package/Table/TableCell.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export type TableCellProps = React.TdHTMLAttributes<HTMLTableCellElement>;
+declare const _default: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLTableCellElement>>;
+export default _default;

package/Table/TableCell.js

@@ -0,0 +1,31 @@
+"use strict";
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const StyledTableCell = styled_1.default.td `
+  display: table-cell;
+  vertical-align: inherit;
+  padding: 0.8em;
+  @media all and (max-width: 1200px) {
+    padding: 0.4em;
+  }
+`;
+const TableCell = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(StyledTableCell, Object.assign({ role: "cell" }, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(TableCell);

package/Table/TableFooter.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export type TableFooterProps = React.HTMLAttributes<HTMLTableSectionElement>;
+declare const _default: React.ForwardRefExoticComponent<TableFooterProps & React.RefAttributes<HTMLTableSectionElement>>;
+export default _default;

package/Table/TableFooter.js

@@ -0,0 +1,36 @@
+"use strict";
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const StyledTableFooter = styled_1.default.tfoot `
+  display: table-footer-group;
+  vertical-align: middle;
+  border-top-width: 0.1em;
+  border-top-style: solid;
+  border-top-color: ${({ theme }) => theme.color.surface.darken(30).toString()};
+  & [role='cell'] {
+    font-weight: 600;
+  }
+  & [role='row'] {
+    border-bottom: none;
+  }
+`;
+const TableFooter = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(StyledTableFooter, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(TableFooter);

package/Table/TableHeader.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export type TableHeaderProps = React.HTMLAttributes<HTMLTableSectionElement>;
+declare const _default: React.ForwardRefExoticComponent<TableHeaderProps & React.RefAttributes<HTMLTableSectionElement>>;
+export default _default;

package/Table/TableHeader.js

@@ -0,0 +1,30 @@
+"use strict";
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const StyledTableHeader = styled_1.default.thead `
+  display: table-header-group;
+  vertical-align: middle;
+  & [role='row'] {
+    border-bottom: none;
+  }
+`;
+const TableHeader = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(StyledTableHeader, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(TableHeader);

package/Table/TableHeaderCell.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export type TableHeaderCellProps = React.ThHTMLAttributes<HTMLTableCellElement>;
+declare const _default: React.ForwardRefExoticComponent<TableHeaderCellProps & React.RefAttributes<HTMLTableCellElement>>;
+export default _default;

package/Table/TableHeaderCell.js

@@ -0,0 +1,35 @@
+"use strict";
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const StyledTableHeaderCell = styled_1.default.th `
+  display: table-cell;
+  vertical-align: inherit;
+  padding: 0.8em;
+  background-color: ${({ theme }) => theme.color.accentPrimary.darken(10).toString()};
+  color: ${({ theme }) => theme.color.accentPrimaryContrast.toString()};
+  word-break: break-all;
+  font-weight: 500;
+  @media all and (max-width: 1200px) {
+    padding: 0.4em;
+  }
+`;
+const TableHeaderCell = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(StyledTableHeaderCell, Object.assign({ role: "rowheader" }, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(TableHeaderCell);

package/Table/TableRow.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export type TableRowProps = React.HTMLAttributes<HTMLTableRowElement>;
+declare const _default: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLTableRowElement>>;
+export default _default;

package/Table/TableRow.js

@@ -0,0 +1,30 @@
+"use strict";
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const StyledTableRow = styled_1.default.tr `
+  display: table-row;
+  vertical-align: inherit;
+  border-bottom-width: 0.1em;
+  border-bottom-style: solid;
+  border-bottom-color: ${({ theme }) => theme.color.surface.darken(20).toString()};
+`;
+const TableRow = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(StyledTableRow, Object.assign({ role: "row" }, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(TableRow);

package/Table/index.d.ts

@@ -0,0 +1,18 @@
+import Table from './Table';
+import TableHeaderCell from './TableHeaderCell';
+import TableRow from './TableRow';
+import TableHeader from './TableHeader';
+import TableCell from './TableCell';
+import TableBody from './TableBody';
+import TableFooter from './TableFooter';
+import TableCaption from './TableCaption';
+export * from './Table';
+export * from './TableHeaderCell';
+export * from './TableRow';
+export * from './TableHeader';
+export * from './TableCell';
+export * from './TableBody';
+export * from './TableFooter';
+export * from './TableCaption';
+export { Table, TableHeaderCell, TableRow, TableHeader, TableCell, TableBody, TableFooter, TableCaption, };
+export default Table;

package/Table/index.js

@@ -0,0 +1,45 @@
+"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];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableCaption = exports.TableFooter = exports.TableBody = exports.TableCell = exports.TableHeader = exports.TableRow = exports.TableHeaderCell = exports.Table = void 0;
+const Table_1 = __importDefault(require("./Table"));
+exports.Table = Table_1.default;
+const TableHeaderCell_1 = __importDefault(require("./TableHeaderCell"));
+exports.TableHeaderCell = TableHeaderCell_1.default;
+const TableRow_1 = __importDefault(require("./TableRow"));
+exports.TableRow = TableRow_1.default;
+const TableHeader_1 = __importDefault(require("./TableHeader"));
+exports.TableHeader = TableHeader_1.default;
+const TableCell_1 = __importDefault(require("./TableCell"));
+exports.TableCell = TableCell_1.default;
+const TableBody_1 = __importDefault(require("./TableBody"));
+exports.TableBody = TableBody_1.default;
+const TableFooter_1 = __importDefault(require("./TableFooter"));
+exports.TableFooter = TableFooter_1.default;
+const TableCaption_1 = __importDefault(require("./TableCaption"));
+exports.TableCaption = TableCaption_1.default;
+__exportStar(require("./Table"), exports);
+__exportStar(require("./TableHeaderCell"), exports);
+__exportStar(require("./TableRow"), exports);
+__exportStar(require("./TableHeader"), exports);
+__exportStar(require("./TableCell"), exports);
+__exportStar(require("./TableBody"), exports);
+__exportStar(require("./TableFooter"), exports);
+__exportStar(require("./TableCaption"), exports);
+exports.default = Table_1.default;

package/TextField/TextFieldContainer.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+export interface TextFieldContainerProps extends React.InputHTMLAttributes<HTMLDivElement> {
+    readonly fullWidth?: boolean;
+    readonly focused?: boolean;
+    readonly error?: boolean;
+}
+declare const _default: React.ForwardRefExoticComponent<TextFieldContainerProps & React.RefAttributes<HTMLDivElement>>;
+export default _default;

package/TextField/TextFieldContainer.js

@@ -0,0 +1,52 @@
+"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];
+}));
+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 };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const StyledTextFieldContainer = styled_1.default.div `
+  display: inline-flex;
+  flex-flow: column;
+  width: 100%;
+  max-width: ${({ $fullWidth }) => ($fullWidth ? '100%' : '16em')};
+`;
+const TextFieldContainer = (props, ref) => {
+    const { children, fullWidth, focused, error } = props, nativeProps = __rest(props, ["children", "fullWidth", "focused", "error"]);
+    return (React.createElement(StyledTextFieldContainer, Object.assign({}, nativeProps, { "$fullWidth": fullWidth, "$focused": focused, "$error": error, ref: ref }), children));
+};
+exports.default = React.forwardRef(TextFieldContainer);