@thecb/components 7.1.2-beta.1 → 7.1.3-beta.0

package/dist/src/components/atoms/add-obligation/AddObligation.stories.js

@@ -1,10 +0,0 @@
-import React from "react";
-import { text } from "@storybook/addon-knobs";
-import AddObligation from "./AddObligation";
-import page from "../../../../.storybook/page";
-export var addObligation = function () { return (React.createElement(AddObligation, { text: text("text", "Lorem", "props"), extraStyles: text("extraStyles", "", "props"), textExtraStyles: text("textExtraStyles", "", "props") })); };
-var story = page({
-    title: "Components|Atoms/AddObligation",
-    Component: AddObligation
-});
-export default story;

package/dist/src/components/atoms/add-obligation/AddObligation.theme.d.ts

@@ -1,9 +0,0 @@
-export namespace fallbackValues {
-    export { color };
-    export { hoverColor };
-    export { activeColor };
-}
-declare const color: "#15749D";
-declare const hoverColor: "#116285";
-declare const activeColor: "#0E506D";
-export {};

package/dist/src/components/atoms/add-obligation/AddObligation.theme.js

@@ -1,8 +0,0 @@
-var color = "#15749D";
-var hoverColor = "#116285";
-var activeColor = "#0E506D";
-export var fallbackValues = {
-    color: color,
-    hoverColor: hoverColor,
-    activeColor: activeColor
-};

package/dist/src/components/atoms/add-obligation/index.d.ts

@@ -1,2 +0,0 @@
-export default AddObligation;
-import AddObligation from "./AddObligation";

package/dist/src/components/atoms/add-obligation/index.js

@@ -1,2 +0,0 @@
-import AddObligation from "./AddObligation";
-export default AddObligation;

package/dist/src/components/atoms/alert/Alert.d.ts

@@ -1,5 +0,0 @@
-declare const _default: ({ variant, ...props }: {
-    [x: string]: any;
-    variant?: any;
-}) => any;
-export default _default;

package/dist/src/components/atoms/alert/Alert.js

@@ -1,26 +0,0 @@
-import React from "react";
-import { AlertIcons, IconQuit } from "../../../deprecated/icons";
-import { Box, Center, Cluster, Stack, Cover, Sidebar } from "../layouts";
-import Text from "../text";
-import { fallbackValues } from "./Alert.theme";
-import { themeComponent } from "../../../util/themeUtils";
-var Alert = function (_a) {
-    var heading = _a.heading, text = _a.text, textOverride = _a.textOverride, variant = _a.variant, children = _a.children, height = _a.height, onLinkClick = _a.onLinkClick, _b = _a.padding, padding = _b === void 0 ? "0.5rem" : _b, _c = _a.showQuitLink, showQuitLink = _c === void 0 ? true : _c, themeValues = _a.themeValues, extraStyles = _a.extraStyles, maxContentWidth = _a.maxContentWidth;
-    var Icon = AlertIcons[variant];
-    var content = (React.createElement(Sidebar, { width: "24px", childGap: "0rem" },
-        React.createElement(Box, { padding: "0 0 0 1rem", minHeight: "100%" },
-            React.createElement(Cover, { minHeight: "100%", singleChild: true },
-                React.createElement(Box, { padding: "0", width: "1.5rem", minHeight: "1.5rem" },
-                    React.createElement(Icon, null)))),
-        React.createElement(Box, { padding: "0" },
-            React.createElement(Sidebar, { sidebarOnRight: true, width: "24px", childGap: "0rem" },
-                React.createElement(Box, { padding: maxContentWidth ? "".concat(padding, " 1rem") : "1rem" },
-                    React.createElement(Cluster, { justify: "flex-start", align: "center" }, textOverride ? (textOverride) : (React.createElement(Stack, { fullHeight: true, childGap: "0.25rem" },
-                        React.createElement(Text, { variant: "p", color: themeValues.text, weight: "600" }, heading),
-                        React.createElement(Text, { variant: "pS", color: themeValues.text }, text),
-                        children)))),
-                React.createElement(Cluster, { justify: "flex-end", align: "flex-start" }, showQuitLink && (React.createElement(Box, { padding: "0", minHeight: "100%", onClick: onLinkClick },
-                    React.createElement(IconQuit, null))))))));
-    return (React.createElement(Box, { padding: padding, width: "100%", minHeight: height && parseInt(height) < 100 ? height : "100px", height: height ? height : "auto", background: themeValues.background, borderRadius: "4px", borderColor: themeValues.border, borderSize: "1px", extraStyles: extraStyles }, maxContentWidth ? (React.createElement(Center, { maxWidth: maxContentWidth }, content)) : (content)));
-};
-export default themeComponent(Alert, "Alert", fallbackValues, "info");

package/dist/src/components/atoms/alert/Alert.stories.d.ts

@@ -1,7 +0,0 @@
-export function alert(): JSX.Element;
-export default story;
-declare const story: {
-    title: any;
-    component: any;
-    decorators: ((storyFn: any) => JSX.Element)[];
-};

package/dist/src/components/atoms/alert/Alert.stories.js

@@ -1,19 +0,0 @@
-import React from "react";
-import { text, select, boolean } from "@storybook/addon-knobs";
-import Alert from "./Alert";
-import page from "../../../../.storybook/page";
-var variantsLabel = "variant";
-var variants = {
-    info: "info",
-    warn: "warn",
-    error: "error",
-    success: "success"
-};
-var defaultValue = "info";
-var groupId = "props";
-export var alert = function () { return (React.createElement(Alert, { variant: select(variantsLabel, variants, defaultValue, groupId), text: text("text", "Alert Bar", "props"), showQuitLink: boolean("showQuitLink", true, "props") })); };
-var story = page({
-    title: "Components|Atoms/Alert",
-    Component: Alert
-});
-export default story;

package/dist/src/components/atoms/alert/Alert.theme.d.ts

@@ -1,65 +0,0 @@
-export namespace fallbackValues {
-    export { background };
-    export { border };
-    export { iconBackground };
-    export { iconFill };
-    export { text };
-    export { link };
-}
-declare namespace background {
-    const info: string;
-    const warn: string;
-    const error: string;
-    const success: string;
-}
-declare namespace border {
-    const info_1: string;
-    export { info_1 as info };
-    const warn_1: string;
-    export { warn_1 as warn };
-    const error_1: string;
-    export { error_1 as error };
-    const success_1: string;
-    export { success_1 as success };
-}
-declare namespace iconBackground {
-    const info_2: string;
-    export { info_2 as info };
-    const warn_2: string;
-    export { warn_2 as warn };
-    const error_2: string;
-    export { error_2 as error };
-    const success_2: string;
-    export { success_2 as success };
-}
-declare namespace iconFill {
-    const info_3: string;
-    export { info_3 as info };
-    const warn_3: string;
-    export { warn_3 as warn };
-    const error_3: string;
-    export { error_3 as error };
-    const success_3: string;
-    export { success_3 as success };
-}
-declare namespace text {
-    const info_4: string;
-    export { info_4 as info };
-    const warn_4: string;
-    export { warn_4 as warn };
-    const error_4: string;
-    export { error_4 as error };
-    const success_4: string;
-    export { success_4 as success };
-}
-declare namespace link {
-    const info_5: string;
-    export { info_5 as info };
-    const warn_5: string;
-    export { warn_5 as warn };
-    const error_5: string;
-    export { error_5 as error };
-    const success_5: string;
-    export { success_5 as success };
-}
-export {};

package/dist/src/components/atoms/alert/Alert.theme.js

@@ -1,45 +0,0 @@
-import { APRICOT_ORANGE, INFO_BLUE, BLUSH_RED, HINT_GREEN, ZEST_ORANGE, MATISSE_BLUE, RAZZMATAZZ_RED, EMERALD_GREEN, MUSTARD_YELLOW, ONAHAU_BLUE, COSMOS_RED, ICE_GREEN, CARROT_ORANGE, CONGRESS_BLUE, THUNDERBIRD_RED, HAZE_GREEN, ZODIAC_BLUE, SCIENCE_BLUE } from "../../../constants/colors";
-var background = {
-    info: "".concat(INFO_BLUE),
-    warn: "".concat(APRICOT_ORANGE),
-    error: "".concat(BLUSH_RED),
-    success: "".concat(HINT_GREEN)
-};
-var border = {
-    info: "".concat(MATISSE_BLUE),
-    warn: "".concat(ZEST_ORANGE),
-    error: "".concat(RAZZMATAZZ_RED),
-    success: "".concat(EMERALD_GREEN)
-};
-var iconBackground = {
-    info: "".concat(ONAHAU_BLUE),
-    warn: "".concat(MUSTARD_YELLOW),
-    error: "".concat(COSMOS_RED),
-    success: "".concat(ICE_GREEN)
-};
-var iconFill = {
-    info: "".concat(CONGRESS_BLUE),
-    warn: "".concat(CARROT_ORANGE),
-    error: "".concat(THUNDERBIRD_RED),
-    success: "".concat(HAZE_GREEN)
-};
-var text = {
-    info: "".concat(ZODIAC_BLUE),
-    warn: "".concat(ZODIAC_BLUE),
-    error: "".concat(ZODIAC_BLUE),
-    success: "".concat(ZODIAC_BLUE)
-};
-var link = {
-    info: "".concat(SCIENCE_BLUE),
-    warn: "".concat(SCIENCE_BLUE),
-    error: "".concat(SCIENCE_BLUE),
-    success: "".concat(SCIENCE_BLUE)
-};
-export var fallbackValues = {
-    background: background,
-    border: border,
-    iconBackground: iconBackground,
-    iconFill: iconFill,
-    text: text,
-    link: link
-};

package/dist/src/components/atoms/alert/index.d.ts

@@ -1,2 +0,0 @@
-export default Alert;
-import Alert from "./Alert";

package/dist/src/components/atoms/alert/index.js

@@ -1,2 +0,0 @@
-import Alert from "./Alert";
-export default Alert;

package/dist/src/components/atoms/amount-callout/AmountCallout.d.ts

@@ -1,5 +0,0 @@
-declare const _default: ({ variant, ...props }: {
-    [x: string]: any;
-    variant?: any;
-}) => any;
-export default _default;

package/dist/src/components/atoms/amount-callout/AmountCallout.js

@@ -1,12 +0,0 @@
-import React from "react";
-import Title from "../title";
-import { Box } from "../layouts";
-import { fallbackValues } from "./AmountCallout.theme";
-import { themeComponent } from "../../../util/themeUtils";
-import { FONT_WEIGHT_SEMIBOLD } from "../../../constants/style_constants";
-var AmountCallout = function (_a) {
-    var amount = _a.amount, textAlign = _a.textAlign, themeValues = _a.themeValues;
-    return (React.createElement(Box, { padding: "0", textAlign: textAlign },
-        React.createElement(Title, { variant: "small", weight: FONT_WEIGHT_SEMIBOLD, color: themeValues.color, as: "p" }, amount)));
-};
-export default themeComponent(AmountCallout, "AmountCallout", fallbackValues);

package/dist/src/components/atoms/amount-callout/AmountCallout.stories.d.ts

@@ -1,7 +0,0 @@
-export function amountCallout(): JSX.Element;
-export default story;
-declare const story: {
-    title: any;
-    component: any;
-    decorators: ((storyFn: any) => JSX.Element)[];
-};

package/dist/src/components/atoms/amount-callout/AmountCallout.stories.js

@@ -1,18 +0,0 @@
-import React from "react";
-import { text, select } from "@storybook/addon-knobs";
-import AmountCallout from "./AmountCallout";
-import page from "../../../../.storybook/page";
-var textAlignLabel = "textAlign";
-var textAlign = {
-    left: "left",
-    center: "center",
-    right: "right"
-};
-var defaultTextAlignValue = "left";
-var groupId = "props";
-export var amountCallout = function () { return (React.createElement(AmountCallout, { amount: text("text", "$1.23", "props"), textAlign: select(textAlignLabel, textAlign, defaultTextAlignValue, groupId) })); };
-var story = page({
-    title: "Components|Atoms/AmountCallout",
-    Component: AmountCallout
-});
-export default story;

package/dist/src/components/atoms/amount-callout/AmountCallout.theme.d.ts

@@ -1,5 +0,0 @@
-export namespace fallbackValues {
-    export { color };
-}
-declare const color: "#292A33";
-export {};

package/dist/src/components/atoms/amount-callout/AmountCallout.theme.js

@@ -1,4 +0,0 @@
-var color = "#292A33";
-export var fallbackValues = {
-    color: color
-};

package/dist/src/components/atoms/amount-callout/index.d.ts

@@ -1,2 +0,0 @@
-export default AmountCallout;
-import AmountCallout from "./AmountCallout";

package/dist/src/components/atoms/amount-callout/index.js

@@ -1,2 +0,0 @@
-import AmountCallout from "./AmountCallout";
-export default AmountCallout;

package/dist/src/components/atoms/box-with-shadow/BoxWithShadow.d.ts

@@ -1,5 +0,0 @@
-declare const _default: ({ variant, ...props }: {
-    [x: string]: any;
-    variant?: any;
-}) => any;
-export default _default;

package/dist/src/components/atoms/box-with-shadow/BoxWithShadow.js

@@ -1,43 +0,0 @@
-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;
-};
-import React from "react";
-import { rgba } from "polished";
-import { fallbackValues } from "./BoxWithShadow.theme";
-import Box from "../layouts/Box";
-import { themeComponent } from "../../../util/themeUtils";
-import { BLACK } from "../../../constants/colors";
-var BoxWithShadow = function (_a) {
-    var variant = _a.variant, themeValues = _a.themeValues, children = _a.children, props = __rest(_a, ["variant", "themeValues", "children"]);
-    var shadowRegistry = {
-        baseStandard: "0px 3px 7px 2px ".concat(rgba(BLACK, 0.1), ", 0px 1px 2px 1px ").concat(rgba(BLACK, 0.1), ";"),
-        baseHover: "0px 1px 7px 0px ".concat(rgba(BLACK, 0.3), ", 0px 1px 4px 0px ").concat(rgba(BLACK, 0.2), ", 0px 7px 12px 0px ").concat(rgba(BLACK, 0.2), ";"),
-        baseClick: "0px 4px 7px 0px ".concat(rgba(BLACK, 0.3), ", 0px 1px 4px 0px ").concat(rgba(BLACK, 0.2), ", 0px 7px 12px 0px ").concat(rgba(BLACK, 0.2), ";"),
-        insetStandard: "0px 1px 4px 2px ".concat(rgba(BLACK, 0.1), ", 0px 2px 1px 0px ").concat(rgba(BLACK, 0.15), ";"),
-        insetHover: "0px 1px 4px 0px ".concat(rgba(BLACK, 0.3), ", 0px 1px 2px 2px ").concat(rgba(BLACK, 0.2), ", 0px 4px 8px 0px ").concat(rgba(BLACK, 0.2), ";"),
-        insetClick: "0px 4px 4px 0px ".concat(rgba(BLACK, 0.3), ", 0px 1px 2px 2px ").concat(rgba(BLACK, 0.2), ", 0px 4px 8px 0px ").concat(rgba(BLACK, 0.2), ";"),
-        linkShadowFocus: "0px 0px 5px 2px ".concat(rgba(themeValues.linkColor, 0.3), ", 0px 1px 2px 0px ").concat(rgba(themeValues.linkColor, 0.3), ", 0px 4px 8px 0px ").concat(rgba(themeValues.linkColor, 0.2), ";"),
-        overlayShadow: "0px 1px 8px -1px ".concat(rgba(BLACK, 0.3), ", 0px 1px 4px 0px ").concat(rgba(BLACK, 0.2), ", 0px 7px 32px 0px ").concat(rgba(BLACK, 0.2), ";")
-    };
-    return (React.createElement(Box, __assign({ boxShadow: shadowRegistry[variant] }, props), children));
-};
-export default themeComponent(BoxWithShadow, "BoxWithShadow", fallbackValues);

package/dist/src/components/atoms/box-with-shadow/BoxWithShadow.theme.d.ts

@@ -1,5 +0,0 @@
-export namespace fallbackValues {
-    export { linkColor };
-}
-declare const linkColor: "#15749D";
-export {};

package/dist/src/components/atoms/box-with-shadow/BoxWithShadow.theme.js

@@ -1,5 +0,0 @@
-import { MATISSE_BLUE } from "../../../constants/colors";
-var linkColor = MATISSE_BLUE;
-export var fallbackValues = {
-    linkColor: linkColor
-};

package/dist/src/components/atoms/box-with-shadow/index.d.ts

@@ -1,2 +0,0 @@
-export default BoxWithShadow;
-import BoxWithShadow from "./BoxWithShadow";

package/dist/src/components/atoms/box-with-shadow/index.js

@@ -1,2 +0,0 @@
-import BoxWithShadow from "./BoxWithShadow";
-export default BoxWithShadow;

package/dist/src/components/atoms/breadcrumb/Breadcrumb.d.ts

@@ -1,4 +0,0 @@
-export default Breadcrumbs;
-declare function Breadcrumbs({ breadcrumbsList }: {
-    breadcrumbsList?: any[] | undefined;
-}): JSX.Element;

package/dist/src/components/atoms/breadcrumb/Breadcrumb.js

@@ -1,22 +0,0 @@
-import React, { Fragment, useContext } from "react";
-import { ThemeContext } from "styled-components";
-import { IconChevron } from "../../../deprecated/icons";
-import { createThemeValues } from "../../../util/themeUtils";
-import { fallbackValues } from "./Breadcrumb.theme";
-import { InternalLink } from "../link";
-import Cluster from "../layouts/Cluster";
-import Box from "../layouts/Box";
-var Breadcrumbs = function (_a) {
-    var _b = _a.breadcrumbsList, breadcrumbsList = _b === void 0 ? [] : _b;
-    var themeContext = useContext(ThemeContext);
-    var themeValues = createThemeValues(themeContext, fallbackValues, "Breadcrumb");
-    return (React.createElement(Box, { padding: "0", as: "nav", "aria-label": "Breadcrumb navigation" },
-        React.createElement(Cluster, { justify: "flex-start", align: "center" }, breadcrumbsList.map(function (_a, index) {
-            var linkText = _a.linkText, linkDestination = _a.linkDestination, isActive = _a.isActive;
-            return (React.createElement(Fragment, { key: "breadcrumb-".concat(linkText) },
-                React.createElement(InternalLink, { "aria-current": index === breadcrumbsList.length - 1 ? "location" : "", to: linkDestination, active: isActive.toString(), color: themeValues.color, fontSize: themeValues.fontSize, lineheight: themeValues.lineHeight, fontWeight: themeValues.fontWeight, margin: themeValues.margin, extraStyles: "\n                          text-transform: uppercase;\n                          ".concat(isActive.toString() === "true" &&
-                        "pointer-events: none;\n                             color: ".concat(themeValues.activeBreadcrumbColor, ";\n                            "), "\n                          &:first-child {\n                            margin-left: 0;\n                          }\n                          &:active {\n                            color: ").concat(themeValues.activeColor, "; \n                          }") }, linkText),
-                index < breadcrumbsList.length - 1 ? (React.createElement(IconChevron, null)) : (React.createElement(Fragment, null))));
-        }))));
-};
-export default Breadcrumbs;

package/dist/src/components/atoms/breadcrumb/Breadcrumb.stories.d.ts

@@ -1,7 +0,0 @@
-export function breadcrumb(): JSX.Element;
-export default story;
-declare const story: {
-    title: any;
-    component: any;
-    decorators: ((storyFn: any) => JSX.Element)[];
-};

package/dist/src/components/atoms/breadcrumb/Breadcrumb.stories.js

@@ -1,37 +0,0 @@
-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);
-};
-import React from "react";
-import { object } from "@storybook/addon-knobs";
-import Breadcrumb from "./Breadcrumb";
-import page from "../../../../.storybook/page";
-var labelInactive = "Inactive Breadcrumb";
-var defaultInactiveValue = {
-    linkText: "Home",
-    linkDestination: location.pathname,
-    isActive: false
-};
-var labelActive = "Active Breadcrumb";
-var defaultActiveValue = {
-    linkText: "Page",
-    linkDestination: location.pathname,
-    isActive: true
-};
-var groupId = "props";
-export var breadcrumb = function () { return (React.createElement(Breadcrumb, { breadcrumbsList: [
-        __assign({}, object(labelInactive, defaultInactiveValue, groupId)),
-        __assign({}, object(labelActive, defaultActiveValue, groupId))
-    ] })); };
-var story = page({
-    title: "Components|Atoms/Breadcrumb",
-    Component: Breadcrumb
-});
-export default story;

package/dist/src/components/atoms/breadcrumb/Breadcrumb.theme.d.ts

@@ -1,19 +0,0 @@
-export namespace fallbackValues {
-    export { color };
-    export { activeColor };
-    export { activeBreadcrumbColor };
-    export { fontSize };
-    export { lineHeight };
-    export { fontWeight };
-    export { margin };
-    export { hover };
-}
-declare const color: string;
-declare const activeColor: string;
-declare const activeBreadcrumbColor: string;
-declare const fontSize: "0.875rem";
-declare const lineHeight: "1.25rem";
-declare const fontWeight: "400";
-declare const margin: "0.5rem";
-declare const hover: "text-decoration: none;";
-export {};

package/dist/src/components/atoms/breadcrumb/Breadcrumb.theme.js

@@ -1,24 +0,0 @@
-// import theme from "styled-theming";
-import { MATISSE_BLUE, STORM_GREY } from "../../../constants/colors";
-/*
-  For now I'm using string values, eventually shared components library will have its own constants file
-  for colors/values that should be used here instead
-*/
-var color = "".concat(MATISSE_BLUE);
-var activeColor = "".concat(STORM_GREY);
-var activeBreadcrumbColor = "".concat(STORM_GREY);
-var fontSize = "0.875rem";
-var lineHeight = "1.25rem";
-var fontWeight = "400";
-var margin = "0.5rem";
-var hover = "text-decoration: none;";
-export var fallbackValues = {
-    color: color,
-    activeColor: activeColor,
-    activeBreadcrumbColor: activeBreadcrumbColor,
-    fontSize: fontSize,
-    lineHeight: lineHeight,
-    fontWeight: fontWeight,
-    margin: margin,
-    hover: hover
-};

package/dist/src/components/atoms/breadcrumb/index.d.ts

@@ -1,2 +0,0 @@
-export default Breadcrumb;
-import Breadcrumb from "./Breadcrumb";

package/dist/src/components/atoms/breadcrumb/index.js

@@ -1,2 +0,0 @@
-import Breadcrumb from "./Breadcrumb";
-export default Breadcrumb;

package/dist/src/components/atoms/button-with-action/ButtonWithAction.d.ts

@@ -1,15 +0,0 @@
-export default ButtonWithAction;
-declare function ButtonWithAction({ action, variant, text, textWrap, isLoading, dataQa, textExtraStyles, contentOverride, extraStyles, tabIndex, children, ...rest }: {
-    [x: string]: any;
-    action?: (() => void) | undefined;
-    variant?: string | undefined;
-    text: any;
-    textWrap?: boolean | undefined;
-    isLoading?: boolean | undefined;
-    dataQa?: null | undefined;
-    textExtraStyles: any;
-    contentOverride?: boolean | undefined;
-    extraStyles?: string | undefined;
-    tabIndex: any;
-    children: any;
-}): JSX.Element;

package/dist/src/components/atoms/button-with-action/ButtonWithAction.js

@@ -1,86 +0,0 @@
-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;
-};
-import React, { useContext } from "react";
-import styled, { ThemeContext } from "styled-components";
-import posed from "react-pose";
-import { linear } from "@popmotion/easing";
-import Text from "../text";
-import { Box, Center } from "../layouts";
-import { fallbackValues } from "./ButtonWithAction.theme";
-import SpinnerIcon from "../../../deprecated/spinner";
-import { noop } from "../../../util/general";
-import { createThemeValues } from "../../../util/themeUtils";
-var rotate = posed.div({
-    fixed: {
-        rotate: "0deg"
-    },
-    rotate: {
-        rotate: "360deg",
-        transition: {
-            rotate: {
-                ease: linear,
-                duration: 1000,
-                loop: Infinity
-            }
-        }
-    }
-});
-var SpinnerContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n"], ["\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n"])));
-var SpinnerIconWrapper = styled(rotate)(templateObject_2 || (templateObject_2 = __makeTemplateObject([""], [""])));
-var Spinner = function (_a) {
-    var isMobile = _a.isMobile;
-    return (React.createElement(SpinnerContainer, null,
-        React.createElement(SpinnerIconWrapper, { initialPose: "fixed", pose: "rotate" },
-            React.createElement(SpinnerIcon, { isMobile: isMobile }))));
-};
-/* Most of the time, to use this button you'll only need to specify:
-  - A variant (if different than primary)
-  - An action
-  - Text
-
-  Optionally, you can also pass:
-  - isLoading to show a spinner
-  - dataQa for use with test cafe
-  - contentOverride to use the button as a wrapper around arbitrary content
-  - extraStyles if you need an escape hatch. Extra styles should be used sparingly.
-
-  Note: the children prop is only used if contentOverride is set to true, in which case
-  the text prop is ignored.
-  
-*/
-var ButtonWithAction = function (_a) {
-    var _b = _a.action, action = _b === void 0 ? noop : _b, _c = _a.variant, variant = _c === void 0 ? "primary" : _c, text = _a.text, _d = _a.textWrap, textWrap = _d === void 0 ? false : _d, _e = _a.isLoading, isLoading = _e === void 0 ? false : _e, _f = _a.dataQa, dataQa = _f === void 0 ? null : _f, textExtraStyles = _a.textExtraStyles, _g = _a.contentOverride, contentOverride = _g === void 0 ? false : _g, _h = _a.extraStyles, extraStyles = _h === void 0 ? "" : _h, tabIndex = _a.tabIndex, children = _a.children, rest = __rest(_a, ["action", "variant", "text", "textWrap", "isLoading", "dataQa", "textExtraStyles", "contentOverride", "extraStyles", "tabIndex", "children"]);
-    var themeContext = useContext(ThemeContext);
-    var themeValues = createThemeValues(themeContext, fallbackValues, "Button", variant);
-    var isMobile = themeContext.isMobile;
-    var hoverStyles = "\n    outline: none;\n    background-color: ".concat(themeValues.hoverBackgroundColor, ";\n    border-color: ").concat(themeValues.hoverBorderColor, ";\n    color: ").concat(themeValues.hoverColor, ";\n    text-decoration: ").concat(variant === "ghost" || variant === "smallGhost" ? "underline" : "none", ";\n    cursor: pointer;\n  ");
-    var activeStyles = "\n    outline: none;\n    background-color: ".concat(themeValues.activeBackgroundColor, ";\n    border-color: ").concat(themeValues.activeBorderColor, ";\n    color: ").concat(themeValues.activeColor, ";\n    text-decoration: ").concat(variant === "ghost" || variant === "smallGhost" ? "underline" : "none", ";\n  ");
-    var disabledStyles = "\n    background-color: #6D717E;\n    border-color: #6D717E;\n    color: #FFFFFF;\n    cursor: default;\n    &:focus {\n      box-shadow: 0 0 10px #6D717E;\n      outline: none;\n    }\n  ";
-    return (React.createElement(Box, __assign({ variant: variant, padding: themeValues.padding, minHeight: themeValues.height, minWidth: themeValues.minWidth, background: themeValues.backgroundColor, border: themeValues.border, hoverStyles: hoverStyles, activeStyles: activeStyles, disabledStyles: disabledStyles, as: "button", onClick: isLoading ? undefined : action, borderRadius: "2px", theme: themeContext, extraStyles: "margin: 0.5rem; ".concat(extraStyles), dataQa: dataQa, tabIndex: tabIndex }, rest), contentOverride ? (children) : (React.createElement(Center, { intrinsic: true }, isLoading ? (React.createElement(Spinner, { isMobile: isMobile })) : (React.createElement(Text, { weight: themeValues.fontWeight, variant: themeValues.fontSizeVariant, color: themeValues.color, textWrap: textWrap, extraStyles: textExtraStyles }, text))))));
-};
-export default ButtonWithAction;
-var templateObject_1, templateObject_2;

package/dist/src/components/atoms/button-with-action/ButtonWithAction.stories.d.ts

@@ -1,7 +0,0 @@
-export function buttonWithAction(): JSX.Element;
-export default story;
-declare const story: {
-    title: any;
-    component: any;
-    decorators: ((storyFn: any) => JSX.Element)[];
-};

package/dist/src/components/atoms/button-with-action/ButtonWithAction.stories.js

@@ -1,24 +0,0 @@
-import React from "react";
-import { text, select, boolean } from "@storybook/addon-knobs";
-import ButtonWithAction from "./ButtonWithAction";
-import page from "../../../../.storybook/page";
-var variantsLabel = "variant";
-var variants = {
-    primary: "primary",
-    secondary: "secondary",
-    back: "back",
-    smallPrimary: "smallPrimary",
-    smallSecondary: "smallSecondary",
-    ghost: "ghost",
-    smallGhost: "smallGhost",
-    danger: "danger",
-    None: undefined
-};
-var defaultValue = "primary";
-var groupId = "props";
-export var buttonWithAction = function () { return (React.createElement(ButtonWithAction, { variant: select(variantsLabel, variants, defaultValue, groupId), text: text("text", "button", "props"), isLoading: boolean("isLoading", false, "props"), action: text("action", undefined, "props") })); };
-var story = page({
-    title: "Components|Atoms/ButtonWithAction",
-    Component: ButtonWithAction
-});
-export default story;