@veracity/vui 0.6.2 → 0.7.0-beta.0

package/cjs/tag/context.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { Dict } from '../utils';
+declare const TagProvider: import("react").Provider<Dict<any>>, useTag: () => Dict<any>;
+export { TagProvider, useTag };

package/cjs/tag/context.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTag = exports.TagProvider = void 0;
+const utils_1 = require("../utils");
+const [TagProvider, useTag] = (0, utils_1.createContext)({ isOptional: true });
+exports.TagProvider = TagProvider;
+exports.useTag = useTag;

package/cjs/tag/index.js

@@ -0,0 +1,28 @@
+"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.default = void 0;
+__exportStar(require("./context"), exports);
+__exportStar(require("./tag"), exports);
+var tag_1 = require("./tag");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(tag_1).default; } });
+__exportStar(require("./tag.types"), exports);
+__exportStar(require("./tagButton"), exports);
+__exportStar(require("./tagIcon"), exports);
+__exportStar(require("./tagText"), exports);

package/cjs/tag/tag.js

@@ -0,0 +1,113 @@
+"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 });
+exports.Tag = exports.TagBase = void 0;
+const react_1 = __importStar(require("react"));
+const core_1 = require("../core");
+const utils_1 = require("../utils");
+const context_1 = require("./context");
+const tagButton_1 = __importDefault(require("./tagButton"));
+const tagIcon_1 = __importDefault(require("./tagIcon"));
+const tagText_1 = __importDefault(require("./tagText"));
+exports.TagBase = core_1.styled.spanBox `
+	align-items: center;
+	border-radius: md;
+	display: inline-flex;
+	font-weight: medium;
+	justify-content: center;
+	line-height: normal;
+	position: relative;
+	transition-duration: fast;
+	width: fit-content;
+
+	&:focus {
+		border-color: transparent;
+		outline: none;
+	}
+
+	&[aria-disabled='true'] {
+		background-color: disabled.bg;
+		color: disabled.color;
+		cursor: not-allowed;
+		user-select: none;
+	}
+`;
+/**
+ * Displays text, icons or custom content. Can be made interactive or a link.
+ * Exposes some props to the children via context.
+ */
+exports.Tag = (0, core_1.vui)((props, ref) => {
+    const { casing, children, className, colorScheme = 'blue', disabled, icon, iconLeft, iconRight, isFullWidth, isInteractive = props.onClick !== undefined, isRound, isTruncated = true, itemLeft, itemRight, onClick, onDelete, size = 'md', text, variant = 'subtle', weight } = props, rest = __rest(props, ["casing", "children", "className", "colorScheme", "disabled", "icon", "iconLeft", "iconRight", "isFullWidth", "isInteractive", "isRound", "isTruncated", "itemLeft", "itemRight", "onClick", "onDelete", "size", "text", "variant", "weight"]);
+    const styles = (0, core_1.useStyleConfig)('Tag', props);
+    const _a = styles.container, { activeBg, h, hoverBg, spaceX: spaceXBase = 0 } = _a, tagStyles = __rest(_a, ["activeBg", "h", "hoverBg", "spaceX"]);
+    const context = (0, react_1.useMemo)(() => (0, utils_1.filterUndefined)({ colorScheme, disabled, size, variant }), [colorScheme, disabled, size, variant]);
+    const spaceX = spaceXBase / 8;
+    const spaceXText = (spaceXBase + 4) / 8;
+    const pl = icon || itemLeft || iconLeft ? spaceX : spaceXText;
+    const pr = icon || itemRight || iconRight ? spaceX : spaceXText;
+    const interactiveProps = !disabled && isInteractive
+        ? {
+            cursor: 'pointer',
+            hoverBg,
+            activeBg,
+            tabIndex: 0,
+            userSelect: 'none'
+        }
+        : {};
+    const aliasedProps = (0, utils_1.filterUndefined)({
+        borderRadius: isRound ? h / 2 : undefined,
+        'aria-disabled': disabled,
+        fontWeight: weight,
+        textTransform: casing,
+        w: isFullWidth ? '100%' : undefined
+    });
+    return (react_1.default.createElement(context_1.TagProvider, { value: context },
+        react_1.default.createElement(exports.TagBase, Object.assign({ className: (0, utils_1.cs)('vui-tag', className), focusRing: 2, h: h, onClick: !disabled ? onClick : undefined, pl: pl, pr: pr, ref: ref }, tagStyles, interactiveProps, aliasedProps, rest),
+            (0, utils_1.isString)(icon) ? react_1.default.createElement(tagIcon_1.default, { name: icon }) : icon,
+            !icon && (react_1.default.createElement(react_1.default.Fragment, null,
+                itemLeft,
+                (0, utils_1.isString)(iconLeft) ? react_1.default.createElement(tagIcon_1.default, { mr: spaceX, name: iconLeft }) : iconLeft, children !== null && children !== void 0 ? children : ((0, utils_1.isReactText)(text) ? react_1.default.createElement(tagText_1.default, Object.assign({}, { isTruncated, text })) : text),
+                (0, utils_1.isString)(iconRight) ? react_1.default.createElement(tagIcon_1.default, { ml: spaceX, name: iconRight }) : iconRight,
+                onDelete ? react_1.default.createElement(tagButton_1.default, { ml: spaceX, onClick: onDelete }) : itemRight)))));
+});
+exports.Tag.displayName = 'Tag';
+exports.Tag.Button = tagButton_1.default;
+exports.Tag.Icon = tagIcon_1.default;
+exports.Tag.Text = tagText_1.default;
+exports.default = exports.Tag;

package/cjs/tag/tagButton.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TagButton = void 0;
+const react_1 = __importDefault(require("react"));
+const button_1 = __importDefault(require("../button"));
+const core_1 = require("../core");
+const context_1 = require("./context");
+/** Displays a button within the Tag. */
+exports.TagButton = (0, core_1.vui)((props, ref) => {
+    const mergedProps = Object.assign(Object.assign({}, (0, context_1.useTag)()), props);
+    const styles = (0, core_1.useStyleConfig)('Tag', mergedProps);
+    return (react_1.default.createElement(button_1.default, Object.assign({ borderColor: "transparent", className: "vui-tagButton", colorScheme: mergedProps.colorScheme, disabled: mergedProps.disabled, hoverBorderColor: "transparent", icon: "falTimes", mr: -0.5, ref: ref, variant: "text" }, styles.button, props)));
+});
+exports.TagButton.displayName = 'TagButton';
+exports.default = exports.TagButton;

package/cjs/tag/tagIcon.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 });
+exports.TagIcon = void 0;
+const react_1 = __importDefault(require("react"));
+const core_1 = require("../core");
+const icon_1 = __importDefault(require("../icon"));
+const context_1 = require("./context");
+/** Displays an icon within the Tag. */
+exports.TagIcon = (0, core_1.vui)((props, ref) => {
+    const styles = (0, core_1.useStyleConfig)('Tag', Object.assign(Object.assign({}, (0, context_1.useTag)()), props));
+    return react_1.default.createElement(icon_1.default, Object.assign({ className: "vui-tagIcon", ref: ref }, styles.icon, props));
+});
+exports.TagIcon.displayName = 'TagIcon';
+exports.default = exports.TagIcon;

package/cjs/tag/tagText.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 });
+exports.TagText = void 0;
+const react_1 = __importDefault(require("react"));
+const core_1 = require("../core");
+const t_1 = __importDefault(require("../t"));
+const context_1 = require("./context");
+/** Displays text within the Tag. */
+exports.TagText = (0, core_1.vui)((props, ref) => {
+    const styles = (0, core_1.useStyleConfig)('Tag', Object.assign(Object.assign({}, (0, context_1.useTag)()), props));
+    return react_1.default.createElement(t_1.default, Object.assign({ className: "vui-tagText", fontSize: "inherit", ref: ref }, styles.text, props));
+});
+exports.TagText.displayName = 'TagText';
+exports.default = exports.TagText;

package/cjs/tag/theme.js

@@ -0,0 +1,119 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function variantSolid(props) {
+    const { colorScheme: c } = props;
+    const container = {
+        hoverBg: `${c}.90`,
+        activeBg: `${c}.100`,
+        bg: `${c}.80`,
+        color: 'white',
+        focusRing: 3
+    };
+    const button = {
+        hoverBg: `${c}.70`,
+        activeBg: `${c}.60`,
+        bg: `${c}.80`,
+        color: 'white'
+    };
+    if (c === 'prussian') {
+        container.hoverBg = 'prussian.60';
+        container.activeBg = 'prussian.50';
+        button.hoverBg = 'prussian.60';
+        button.activeBg = 'prussian.50';
+    }
+    if (c === 'yellow') {
+        container.hoverBg = 'yellow.80';
+        container.activeBg = 'yellow.90';
+        container.bg = 'yellow.70';
+        button.hoverBg = 'yellow.60';
+        button.activeBg = 'yellow.50';
+        button.bg = 'yellow.70';
+    }
+    return { container, button };
+}
+function variantSubtle(props) {
+    const { colorScheme: c } = props;
+    const container = {
+        hoverBg: `${c}.30`,
+        activeBg: `${c}.40`,
+        bg: `${c}.20`,
+        color: `${c}.90`
+    };
+    const button = {
+        hoverBg: `${c}.30`,
+        activeBg: `${c}.40`,
+        color: `${c}.90`
+    };
+    if (c === 'blue') {
+        container.color = 'blue.80';
+        button.color = 'blue.80';
+    }
+    if (c === 'grey') {
+        container.color = 'prussian.80';
+        button.color = 'prussian.80';
+    }
+    if (c === 'yellow') {
+        container.color = 'yellow.100';
+        button.color = 'yellow.100';
+    }
+    return { container, button };
+}
+const baseStyle = {};
+const defaultProps = {
+    colorScheme: 'blue',
+    size: 'md',
+    variant: 'subtle'
+};
+const parts = ['container', 'button', 'icon', 'text'];
+const sizes = {
+    sm: {
+        container: {
+            fontSize: 'sm',
+            h: 24,
+            spaceX: 4
+        },
+        button: {
+            size: 'xs'
+        },
+        icon: {
+            size: 'xs'
+        }
+    },
+    md: {
+        container: {
+            fontSize: 'sm',
+            h: 32,
+            spaceX: 6
+        },
+        button: {
+            size: 'xs'
+        },
+        icon: {
+            size: 'sm'
+        }
+    },
+    lg: {
+        container: {
+            fontSize: 'md',
+            h: 40,
+            spaceX: 8
+        },
+        button: {
+            size: 'sm'
+        },
+        icon: {
+            size: 'md'
+        }
+    }
+};
+const variants = {
+    solid: variantSolid,
+    subtle: variantSubtle
+};
+exports.default = {
+    baseStyle,
+    defaultProps,
+    parts,
+    sizes,
+    variants
+};

package/cjs/textarea/helpers.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getInitialCount = void 0;
+/** Returns length of the initial textarea's value. */
+function getInitialCount(props) {
+    var _a, _b;
+    const { defaultValue, value } = props;
+    return (_b = (_a = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.toString().length) !== null && _a !== void 0 ? _a : value === null || value === void 0 ? void 0 : value.toString().length) !== null && _b !== void 0 ? _b : 0;
+}
+exports.getInitialCount = getInitialCount;

package/cjs/textarea/index.js

@@ -0,0 +1,24 @@
+"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.default = void 0;
+__exportStar(require("./textarea"), exports);
+var textarea_1 = require("./textarea");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(textarea_1).default; } });
+__exportStar(require("./textarea.types"), exports);

package/cjs/textarea/textarea.js

@@ -0,0 +1,122 @@
+"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 });
+exports.Textarea = exports.TextareaBase = void 0;
+const react_1 = __importStar(require("react"));
+const core_1 = require("../core");
+const t_1 = __importDefault(require("../t"));
+const utils_1 = require("../utils");
+const helpers_1 = require("./helpers");
+const TextareaTextarea = core_1.styled.textareaBox `
+	border-radius: md;
+	border-width: 1px;
+	outline: none;
+	padding: 1;
+	resize: none;
+	transition-duration: fast;
+	width: 100%;
+
+	&::placeholder {
+		color: grey.60;
+	}
+
+	&[aria-disabled='true'],
+	&[aria-disabled='true']::placeholder {
+		background-color: disabled.bg;
+		border-color: disabled.border;
+		color: disabled.color;
+		cursor: not-allowed;
+	}
+`;
+exports.TextareaBase = core_1.styled.divBox `
+	display: flex;
+	min-height: 80px;
+	position: relative;
+	width: 100%;
+`;
+/**
+ * Displays a textarea element wrapped in a div to allow extra content, like counter.
+ * Forwards many relevant props to the inner textarea. Exposes some props to the children via context.
+ */
+exports.Textarea = (0, core_1.vui)((props, ref) => {
+    const [count, setCount] = (0, react_1.useState)((0, helpers_1.getInitialCount)(props));
+    const _a = (0, core_1.omitThemingProps)(props), { autoFocus, className, colorScheme: colorSchemeProp, cols, defaultValue, disabled, id, isInvalid, maxLength, name, onBlur, onChange: onChangeProp, onFocus, placeholder, readOnly, required, resize = 'none', rows, showCount, textareaProps = {}, textareaRef, value } = _a, rest = __rest(_a, ["autoFocus", "className", "colorScheme", "cols", "defaultValue", "disabled", "id", "isInvalid", "maxLength", "name", "onBlur", "onChange", "onFocus", "placeholder", "readOnly", "required", "resize", "rows", "showCount", "textareaProps", "textareaRef", "value"]);
+    const colorProps = (0, utils_1.filterUndefined)({
+        colorScheme: colorSchemeProp !== null && colorSchemeProp !== void 0 ? colorSchemeProp : (isInvalid ? 'red' : undefined)
+    });
+    const styles = (0, core_1.useStyleConfig)('Textarea', Object.assign(Object.assign({}, colorProps), props));
+    function onChange(e) {
+        setCount(e.target.value.length);
+        onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(e);
+    }
+    const aliasedProps = (0, utils_1.filterUndefined)({
+        'aria-disabled': disabled
+    });
+    const textareaAliasedProps = (0, utils_1.filterUndefined)({
+        'aria-disabled': disabled,
+        bg: readOnly ? 'grey.20' : undefined,
+        focusBorderColor: !readOnly ? 'transparent' : undefined,
+        focusRing: readOnly ? 0 : undefined
+    });
+    return (react_1.default.createElement(exports.TextareaBase, Object.assign({ className: (0, utils_1.cs)('vui-textarea', className), ref: ref }, styles.container, aliasedProps, rest),
+        react_1.default.createElement(TextareaTextarea, Object.assign({ className: "vui-textareaTextarea", ref: textareaRef }, {
+            autoFocus,
+            cols,
+            defaultValue,
+            disabled,
+            id,
+            maxLength,
+            name,
+            onBlur,
+            onChange,
+            onFocus,
+            placeholder,
+            readOnly,
+            required,
+            resize,
+            rows,
+            value
+        }, styles.textarea, textareaAliasedProps, textareaProps)),
+        showCount && (react_1.default.createElement(t_1.default, { color: "grey.80", position: "absolute", right: 0, size: "sm", top: "calc(100% + 1px)" },
+            count,
+            " / ",
+            maxLength))));
+});
+exports.Textarea.displayName = 'Textarea';
+exports.default = exports.Textarea;

package/cjs/textarea/theme.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function variantDefault(props) {
+    const { colorScheme: c } = props;
+    const container = {};
+    const textarea = {
+        borderColor: `${c}.80`,
+        focusRing: 2,
+        focusRingColor: `${c}.80`
+    };
+    if (c === 'grey') {
+        textarea.borderColor = `${c}.60`;
+        textarea.focusRingColor = 'blue.50';
+    }
+    return { container, textarea };
+}
+const baseStyle = {};
+const defaultProps = {
+    colorScheme: 'grey',
+    variant: 'default'
+};
+const parts = ['container', 'textarea'];
+const sizes = {};
+const variants = {
+    default: variantDefault
+};
+exports.default = {
+    baseStyle,
+    defaultProps,
+    parts,
+    sizes,
+    variants
+};

package/cjs/theme/components.js

@@ -0,0 +1,67 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const theme_1 = __importDefault(require("../avatar/theme"));
+const theme_2 = __importDefault(require("../box/theme"));
+const theme_3 = __importDefault(require("../button/theme"));
+const theme_4 = __importDefault(require("../card/theme"));
+const theme_5 = __importDefault(require("../checkbox/theme"));
+const theme_6 = __importDefault(require("../dialog/theme"));
+const theme_7 = __importDefault(require("../divider/theme"));
+const theme_8 = __importDefault(require("../footer/theme"));
+const theme_9 = __importDefault(require("../grid/theme"));
+const theme_10 = __importDefault(require("../header/theme"));
+const theme_11 = __importDefault(require("../heading/theme"));
+const theme_12 = __importDefault(require("../icon/theme"));
+const theme_13 = __importDefault(require("../image/theme"));
+const theme_14 = __importDefault(require("../input/theme"));
+const theme_15 = __importDefault(require("../link/theme"));
+const theme_16 = __importDefault(require("../list/theme"));
+const theme_17 = __importDefault(require("../menu/theme"));
+const theme_18 = __importDefault(require("../modal/theme"));
+const theme_19 = __importDefault(require("../notification/theme"));
+const theme_20 = __importDefault(require("../p/theme"));
+const theme_21 = __importDefault(require("../pagination/theme"));
+const theme_22 = __importDefault(require("../panel/theme"));
+const theme_23 = __importDefault(require("../popover/theme"));
+const theme_24 = __importDefault(require("../radio/theme"));
+const theme_25 = __importDefault(require("../skeleton/theme"));
+const theme_26 = __importDefault(require("../spinner/theme"));
+const theme_27 = __importDefault(require("../switch/theme"));
+const theme_28 = __importDefault(require("../t/theme"));
+const theme_29 = __importDefault(require("../tag/theme"));
+const theme_30 = __importDefault(require("../textarea/theme"));
+exports.default = {
+    Avatar: theme_1.default,
+    Box: theme_2.default,
+    Button: theme_3.default,
+    Card: theme_4.default,
+    Checkbox: theme_5.default,
+    Dialog: theme_6.default,
+    Divider: theme_7.default,
+    Footer: theme_8.default,
+    Grid: theme_9.default,
+    Header: theme_10.default,
+    Heading: theme_11.default,
+    Icon: theme_12.default,
+    Image: theme_13.default,
+    Input: theme_14.default,
+    Link: theme_15.default,
+    List: theme_16.default,
+    Menu: theme_17.default,
+    Modal: theme_18.default,
+    Notification: theme_19.default,
+    P: theme_20.default,
+    Pagination: theme_21.default,
+    Panel: theme_22.default,
+    Popover: theme_23.default,
+    Radio: theme_24.default,
+    Skeleton: theme_25.default,
+    Spinner: theme_26.default,
+    Switch: theme_27.default,
+    T: theme_28.default,
+    Tag: theme_29.default,
+    Textarea: theme_30.default
+};

package/cjs/theme/defaultTheme.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const components_1 = __importDefault(require("./components"));
+const foundations_1 = __importDefault(require("./foundations"));
+const defaultTheme = Object.assign({ components: components_1.default }, foundations_1.default);
+exports.default = defaultTheme;

package/cjs/theme/foundations/fonts.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    avenir: `'Avenir Next', Verdana, Geneva, Tahoma, sans-serif`
+};

package/cjs/theme/foundations/index.js

@@ -0,0 +1,47 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const animations_1 = __importDefault(require("./animations"));
+const borders_1 = __importDefault(require("./borders"));
+const colors_1 = __importDefault(require("./colors"));
+const durations_1 = __importDefault(require("./durations"));
+const fonts_1 = __importDefault(require("./fonts"));
+const fontSizes_1 = __importDefault(require("./fontSizes"));
+const fontWeights_1 = __importDefault(require("./fontWeights"));
+const gridTemplateColumns_1 = __importDefault(require("./gridTemplateColumns"));
+const gridTemplateRows_1 = __importDefault(require("./gridTemplateRows"));
+const radii_1 = __importDefault(require("./radii"));
+const ringWidths_1 = __importDefault(require("./ringWidths"));
+const screens_1 = __importDefault(require("./screens"));
+const shadows_1 = __importDefault(require("./shadows"));
+const sizes_1 = __importDefault(require("./sizes"));
+const spaces_1 = __importDefault(require("./spaces"));
+const timingFunctions_1 = __importDefault(require("./timingFunctions"));
+const transformers_1 = __importDefault(require("./transformers"));
+const transforms_1 = __importDefault(require("./transforms"));
+const transitions_1 = __importDefault(require("./transitions"));
+const zIndices_1 = __importDefault(require("./zIndices"));
+exports.default = {
+    animations: animations_1.default,
+    borders: borders_1.default,
+    colors: colors_1.default,
+    durations: durations_1.default,
+    fonts: fonts_1.default,
+    fontSizes: fontSizes_1.default,
+    fontWeights: fontWeights_1.default,
+    gridTemplateColumns: gridTemplateColumns_1.default,
+    gridTemplateRows: gridTemplateRows_1.default,
+    radii: radii_1.default,
+    ringWidths: ringWidths_1.default,
+    screens: screens_1.default,
+    shadows: shadows_1.default,
+    sizes: sizes_1.default,
+    spaces: spaces_1.default,
+    transformers: transformers_1.default,
+    transforms: transforms_1.default,
+    transitions: transitions_1.default,
+    timingFunctions: timingFunctions_1.default,
+    zIndices: zIndices_1.default
+};