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

package/ThemeProvider/createTheme.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 });
+exports.createTheme = void 0;
+const Color_1 = __importDefault(require("../Color"));
+const createTheme = overrides => {
+    const _a = overrides || {}, { isDark, fontSize, zIndex, color, shape } = _a, rest = __rest(_a, ["isDark", "fontSize", "zIndex", "color", "shape"]);
+    const theme = Object.assign(Object.assign({}, rest), { isDark: typeof isDark === 'boolean' ? isDark : false, fontSize: Object.assign({ small: 14, normal: 16, medium: 18, large: 20 }, fontSize), zIndex: Object.assign({ header: 8, mainDrawer: 9, modal: 10 }, zIndex), color: {}, shape: Object.assign({ radiusFactor: 0.5 }, shape) });
+    const defaultColors = {
+        backgroundPrimary: '#FFFFFF',
+        backgroundSecondary: '#F9F9F9',
+        textPrimary: '#212121',
+        surface: '#FFFFFF',
+        textSecondary: '#343434',
+        accentPrimary: '#FFA800',
+        accentPrimaryContrast: '#FFFFFF',
+        accentSecondary: '#bd00ff',
+        accentSecondaryContrast: '#FFFFFF',
+        error: '#ff2b2b',
+        errorContrast: '#ffffff',
+        warning: '#fcbf03',
+        warningContrast: '#ffffff',
+        success: '#0ca400',
+        successContrast: '#ffffff',
+    };
+    Object.entries(Object.assign(Object.assign({}, defaultColors), color)).forEach(([colorName, colorValue]) => {
+        theme.color[colorName] = new Color_1.default(colorValue);
+    });
+    theme.color.test = new Color_1.default('red');
+    return theme;
+};
+exports.createTheme = createTheme;
+exports.default = exports.createTheme;

package/ThemeProvider/index.d.ts

@@ -0,0 +1,57 @@
+import React from 'react';
+import { useTheme } from '@emotion/react';
+import type Color from '../Color';
+export { useTheme };
+export * from './createTheme';
+export type UITheme = Required<Omit<UIThemeOverrides, 'isDark' | 'fontSize' | 'zIndex' | 'shape' | 'color'>> & {
+    readonly isDark: boolean;
+    readonly fontSize: Record<keyof UIThemeOverrideFontSize, number>;
+    readonly zIndex: Required<UIThemeOverrideZIndex>;
+    readonly color: Record<keyof UIThemeOverrideColor, Color>;
+    readonly shape: Required<UIThemeOverrideShape>;
+};
+export interface UIThemeOverrideColor {
+    readonly backgroundPrimary?: string;
+    readonly backgroundSecondary?: string;
+    readonly surface?: string;
+    readonly textPrimary?: string;
+    readonly textSecondary?: string;
+    readonly accentPrimary?: string;
+    readonly accentPrimaryContrast?: string;
+    readonly accentSecondary?: string;
+    readonly accentSecondaryContrast?: string;
+    readonly error?: string;
+    readonly errorContrast?: string;
+    readonly warning?: string;
+    readonly warningContrast?: string;
+    readonly success?: string;
+    readonly successContrast?: string;
+}
+export interface UIThemeOverrideZIndex {
+    readonly header?: number;
+    readonly mainDrawer?: number;
+    readonly modal?: number;
+}
+export interface UIThemeOverrideShape {
+    readonly radiusFactor?: 0 | 0.1 | 0.2 | 0.3 | 0.4 | 0.5 | 0.6 | 0.7 | 0.8 | 0.9 | 1;
+}
+export interface UIThemeOverrideFontSize {
+    readonly small?: number;
+    readonly normal?: number;
+    readonly medium?: number;
+    readonly large?: number;
+}
+export interface UIThemeOverrides {
+    readonly isDark: boolean;
+    readonly fontSize?: UIThemeOverrideFontSize;
+    readonly zIndex?: UIThemeOverrideZIndex;
+    readonly shape?: UIThemeOverrideShape;
+    readonly color?: UIThemeOverrideColor;
+}
+declare const ThemeProvider: React.FC<ThemeProviderProps>;
+export type CreateTheme = (overrides?: UIThemeOverrides) => UITheme;
+export interface ThemeProviderProps {
+    readonly children: React.ReactNode | readonly React.ReactNode[];
+    readonly theme: UITheme;
+}
+export default ThemeProvider;

package/ThemeProvider/index.js

@@ -0,0 +1,29 @@
+"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.useTheme = void 0;
+const react_1 = __importDefault(require("react"));
+const react_2 = require("@emotion/react");
+Object.defineProperty(exports, "useTheme", { enumerable: true, get: function () { return react_2.useTheme; } });
+__exportStar(require("./createTheme"), exports);
+const ThemeProvider = props => {
+    const { children, theme } = props;
+    return react_1.default.createElement(react_2.ThemeProvider, { theme: theme }, children);
+};
+exports.default = ThemeProvider;

package/Typography/Base.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const Base: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export default Base;

package/Typography/Base.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const Base = styled_1.default.span `
+  font-size: 1rem;
+  font-weight: 300;
+  color: currentColor;
+`;
+exports.default = Base;

package/Typography/Blockquote.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const Blockquote: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").BlockquoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>, {}>;
+export default Blockquote;

package/Typography/Blockquote.js

@@ -0,0 +1,23 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const Blockquote = styled_1.default.blockquote `
+  font-size: 1rem;
+  font-weight: 400;
+  font-style: italic;
+  position: relative;
+  border-left: 4px solid ${({ theme }) => theme.color.textSecondary.lighten(20).toString()};
+  color: currentColor;
+  margin: 0;
+  padding: 1em 0 1em 2em;
+  & > p:first-of-type {
+    margin-top: 0;
+  }
+  & > p:last-child {
+    margin-bottom: 0;
+  }
+`;
+exports.default = Blockquote;

package/Typography/Del.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const Del: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").DelHTMLAttributes<HTMLModElement>, HTMLModElement>, {}>;
+export default Del;

package/Typography/Del.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const Del = styled_1.default.del `
+  font-size: 1em;
+  color: currentColor;
+`;
+exports.default = Del;

package/Typography/Em.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const Em: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export default Em;

package/Typography/Em.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const Em = styled_1.default.em `
+  font-size: 1em;
+  color: currentColor;
+`;
+exports.default = Em;

package/Typography/H1.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const H1: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
+export default H1;

package/Typography/H1.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const H1 = styled_1.default.h1 `
+  font-size: 2rem;
+  font-weight: 700;
+  color: currentColor;
+`;
+exports.default = H1;

package/Typography/H2.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const H2: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
+export default H2;

package/Typography/H2.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const H2 = styled_1.default.h2 `
+  font-size: 1.5rem;
+  font-weight: 500;
+  color: currentColor;
+`;
+exports.default = H2;

package/Typography/H3.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const H3: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
+export default H3;

package/Typography/H3.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const H3 = styled_1.default.h3 `
+  font-size: 1.25rem;
+  font-weight: 500;
+  color: currentColor;
+`;
+exports.default = H3;

package/Typography/H4.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const H4: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
+export default H4;

package/Typography/H4.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const H4 = styled_1.default.h4 `
+  font-size: 1.2rem;
+  font-weight: 500;
+  color: currentColor;
+`;
+exports.default = H4;

package/Typography/H5.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const H5: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
+export default H5;

package/Typography/H5.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const H5 = styled_1.default.h5 `
+  font-size: 1.2rem;
+  font-weight: 300;
+  color: currentColor;
+`;
+exports.default = H5;

package/Typography/List.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+export declare const Ul: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, {}>;
+export declare const Ol: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, {}>;
+export declare const Li: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, {}>;
+export default Ul;

package/Typography/List.js

@@ -0,0 +1,32 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Li = exports.Ol = exports.Ul = void 0;
+const styled_1 = __importDefault(require("@emotion/styled"));
+exports.Ul = styled_1.default.ul `
+  color: currentColor;
+  font-size: 1em;
+  margin: 0.8em 0;
+  padding-left: 1.2em;
+`;
+exports.Ol = styled_1.default.ol `
+  color: currentColor;
+  font-size: 1em;
+  margin: 0.8em 0;
+  padding-left: 1.2em;
+`;
+exports.Li = styled_1.default.li `
+  color: currentColor;
+  font-size: 1em;
+  margin: 0.2em 0;
+  &::marker {
+    font-size: 0.9em;
+    font-weight: 600;
+    color: ${({ theme }) => theme.isDark
+    ? theme.color.accentPrimary.lighten(20).toString()
+    : theme.color.accentPrimary.darken(20).toString()};
+  }
+`;
+exports.default = exports.Ul;

package/Typography/Paragraph.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+export type ParagraphProps = React.HTMLAttributes<HTMLParagraphElement> & {
+    /**
+     * if `true` is passed, the margins will be removed
+     */
+    readonly noMargin?: boolean;
+};
+declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & {
+    /**
+     * if `true` is passed, the margins will be removed
+     */
+    readonly noMargin?: boolean | undefined;
+} & React.RefAttributes<HTMLParagraphElement>>;
+export default _default;

package/Typography/Paragraph.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 StyledParagraph = styled_1.default.p `
+  font-size: 1rem;
+  font-weight: 300;
+  margin: ${({ $noMargin }) => ($noMargin ? 0 : '0 0 0.8em 0')};
+  color: currentColor;
+`;
+const Paragraph = (props, ref) => {
+    const { noMargin, children } = props, restProps = __rest(props, ["noMargin", "children"]);
+    return (React.createElement(StyledParagraph, Object.assign({}, restProps, { ref: ref }), children));
+};
+exports.default = React.forwardRef(Paragraph);

package/Typography/SectionDescription.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+declare const SectionDescription: import("@emotion/styled").StyledComponent<import("react").HTMLAttributes<HTMLParagraphElement> & {
+    readonly noMargin?: boolean | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export default SectionDescription;

package/Typography/SectionDescription.js

@@ -0,0 +1,17 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const Paragraph_1 = __importDefault(require("./Paragraph"));
+const SectionDescription = (0, styled_1.default)(Paragraph_1.default) `
+  display: flex;
+  justify-content: center;
+  text-align: center;
+  padding: 0 20%;
+  margin-top: 2.4em;
+  margin-bottom: 1em;
+  text-align: center;
+`;
+exports.default = SectionDescription;

package/Typography/SectionTitle.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type Props = {
+    style?: any;
+    className?: string;
+    children: React.ReactNode | React.ReactNode[];
+};
+declare const SectionTitle: React.FC<Props>;
+export default SectionTitle;

package/Typography/SectionTitle.js

@@ -0,0 +1,31 @@
+"use strict";
+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 H2_1 = __importDefault(require("./H2"));
+const Title = (0, styled_1.default)(H2_1.default) `
+  justify-content: center;
+  display: flex;
+  text-align: center;
+`;
+const Inner = styled_1.default.span `
+  position: relative;
+  & :before {
+    content: '';
+    position: absolute;
+    left: 50%;
+    bottom: -15px;
+    height: 3px;
+    width: 40px;
+    transform: translate(-50%, 0);
+  }
+`;
+const SectionTitle = props => {
+    const { style, className, children } = props;
+    return (react_1.default.createElement(Title, { style: style, className: className },
+        react_1.default.createElement(Inner, null, children)));
+};
+exports.default = SectionTitle;

package/Typography/Span.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const Span: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export default Span;

package/Typography/Span.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const Span = styled_1.default.span `
+  font-size: 1em;
+  color: currentColor;
+`;
+exports.default = Span;

package/Typography/Strong.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const Strong: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export default Strong;

package/Typography/Strong.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const Strong = styled_1.default.strong `
+  font-size: 1em;
+  color: currentColor;
+`;
+exports.default = Strong;

package/Typography/U.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const U: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export default U;

package/Typography/U.js

@@ -0,0 +1,10 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_1 = __importDefault(require("@emotion/styled"));
+const U = styled_1.default.u `
+  font-size: 1em;
+`;
+exports.default = U;

package/Typography/index.d.ts

@@ -0,0 +1,3 @@
+import Paragraph from './Paragraph';
+export * from './Paragraph';
+export default Paragraph;

package/Typography/index.js

@@ -0,0 +1,22 @@
+"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 });
+const Paragraph_1 = __importDefault(require("./Paragraph"));
+__exportStar(require("./Paragraph"), exports);
+exports.default = Paragraph_1.default;

package/index.d.ts

@@ -0,0 +1 @@
+export * from './ThemeProvider';

package/index.js

@@ -13,11 +13,5 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
 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.Button = void 0;
-const Button_1 = __importDefault(require("./Button"));
-exports.Button = Button_1.default;
-__exportStar(require("./Button"), exports);
+__exportStar(require("./ThemeProvider"), exports);