@alixpartners/ui-components 1.22.0 → 1.22.1

package/dist/esm/components/ApTooltip/ApTooltip.js

@@ -1,112 +1,112 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ApTooltipReference = exports.ApTooltipManager = exports.ApTooltip = void 0;
-/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
-/* tslint:disable */
-var React = require("react");
-var react_1 = require("react");
-/* tslint:enable */
-var react_popper_1 = require("react-popper");
-Object.defineProperty(exports, "ApTooltipManager", { enumerable: true, get: function () { return react_popper_1.Manager; } });
-Object.defineProperty(exports, "ApTooltipReference", { enumerable: true, get: function () { return react_popper_1.Reference; } });
-var setReactRef_1 = require("../../utils/setReactRef");
-var ApTooltip_styles_1 = require("./ApTooltip.styles");
-/**
- * Robust and composable tooltip.
- * This component is similar to ApPopover component
- *
- * It builds upon [Popper.js](https://popper.js.org) and all of its positioning logic,
- * e.g.:
- *
- * - it never hides behind window boundaries (or boundaries of the parent scroll element)
- * - it repositions itself as the user scrolls
- * - its position always follows the button (tooltip reference)
- *
- * See the story, https://popper.js.org and https://github.com/FezVrasta/react-popper
- * for documentation and examples of usage.
- */
-var Tooltip = function (_a) {
-    var children = _a.children, onClose = _a.onClose, className = _a.className, _b = _a.hideArrow, hideArrow = _b === void 0 ? false : _b, _c = _a.disableOutsideClick, disableOutsideClick = _c === void 0 ? false : _c, _d = _a.enterDelay, enterDelay = _d === void 0 ? 500 : _d, _e = _a.initialOpen, initialOpen = _e === void 0 ? false : _e, modifiers = _a.modifiers, _f = _a.stopPropagation, stopPropagation = _f === void 0 ? true : _f, _g = _a.containerProps, containerProps = _g === void 0 ? {} : _g, message = _a.message, rest = __rest(_a, ["children", "onClose", "className", "hideArrow", "disableOutsideClick", "enterDelay", "initialOpen", "modifiers", "stopPropagation", "containerProps", "message"]);
-    var _h = __read(react_1.useState(initialOpen), 2), isOpen = _h[0], setOpen = _h[1];
-    var enterTimer = react_1.useRef();
-    var childRef = children.ref;
-    react_1.useLayoutEffect(function () {
-        if (initialOpen) {
-            setOpen(initialOpen);
-        }
-    }, [initialOpen]);
-    // Clear timeout on unmount
-    react_1.useEffect(function () { return function () {
-        clearTimeout(enterTimer.current);
-    }; }, []);
-    var showTooltip = react_1.useCallback(function () {
-        clearTimeout(enterTimer.current);
-        if (enterDelay) {
-            enterTimer.current = window.setTimeout(function () {
-                setOpen(true);
-            }, enterDelay);
-        }
-        else {
-            setOpen(true);
-        }
-    }, [enterDelay]);
-    var hideTooltip = react_1.useCallback(function () {
-        setOpen(false);
-        clearTimeout(enterTimer.current);
-    }, []);
-    var ownRef = react_1.useRef();
-    var handleRef = react_1.useCallback(function (value) {
-        // If child has a `ref` already we must not override it
-        setReactRef_1.setReactRef(childRef, value);
-        ownRef.current = value;
-    }, [childRef, ownRef]);
-    return (React.createElement(React.Fragment, null,
-        React.cloneElement(children, {
-            onMouseEnter: showTooltip,
-            onMouseLeave: hideTooltip,
-            ref: handleRef,
-        }),
-        isOpen && message && (React.createElement(ApTooltip_styles_1.TooltipContainer, __assign({ disableOutsideClick: true, onClose: hideTooltip, hideArrow: hideArrow, className: className, referenceElement: ownRef.current, modifiers: {
-                offset: { offset: '0, 4' }
-            } }, rest), message))));
-};
-exports.ApTooltip = react_1.memo(Tooltip);
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ApTooltipReference = exports.ApTooltipManager = exports.ApTooltip = void 0;
+/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
+/* tslint:disable */
+var React = require("react");
+var react_1 = require("react");
+/* tslint:enable */
+var react_popper_1 = require("react-popper");
+Object.defineProperty(exports, "ApTooltipManager", { enumerable: true, get: function () { return react_popper_1.Manager; } });
+Object.defineProperty(exports, "ApTooltipReference", { enumerable: true, get: function () { return react_popper_1.Reference; } });
+var setReactRef_1 = require("../../utils/setReactRef");
+var ApTooltip_styles_1 = require("./ApTooltip.styles");
+/**
+ * Robust and composable tooltip.
+ * This component is similar to ApPopover component
+ *
+ * It builds upon [Popper.js](https://popper.js.org) and all of its positioning logic,
+ * e.g.:
+ *
+ * - it never hides behind window boundaries (or boundaries of the parent scroll element)
+ * - it repositions itself as the user scrolls
+ * - its position always follows the button (tooltip reference)
+ *
+ * See the story, https://popper.js.org and https://github.com/FezVrasta/react-popper
+ * for documentation and examples of usage.
+ */
+var Tooltip = function (_a) {
+    var children = _a.children, onClose = _a.onClose, className = _a.className, _b = _a.hideArrow, hideArrow = _b === void 0 ? false : _b, _c = _a.disableOutsideClick, disableOutsideClick = _c === void 0 ? false : _c, _d = _a.enterDelay, enterDelay = _d === void 0 ? 500 : _d, _e = _a.initialOpen, initialOpen = _e === void 0 ? false : _e, modifiers = _a.modifiers, _f = _a.stopPropagation, stopPropagation = _f === void 0 ? true : _f, _g = _a.containerProps, containerProps = _g === void 0 ? {} : _g, message = _a.message, rest = __rest(_a, ["children", "onClose", "className", "hideArrow", "disableOutsideClick", "enterDelay", "initialOpen", "modifiers", "stopPropagation", "containerProps", "message"]);
+    var _h = __read(react_1.useState(initialOpen), 2), isOpen = _h[0], setOpen = _h[1];
+    var enterTimer = react_1.useRef();
+    var childRef = children.ref;
+    react_1.useLayoutEffect(function () {
+        if (initialOpen) {
+            setOpen(initialOpen);
+        }
+    }, [initialOpen]);
+    // Clear timeout on unmount
+    react_1.useEffect(function () { return function () {
+        clearTimeout(enterTimer.current);
+    }; }, []);
+    var showTooltip = react_1.useCallback(function () {
+        clearTimeout(enterTimer.current);
+        if (enterDelay) {
+            enterTimer.current = window.setTimeout(function () {
+                setOpen(true);
+            }, enterDelay);
+        }
+        else {
+            setOpen(true);
+        }
+    }, [enterDelay]);
+    var hideTooltip = react_1.useCallback(function () {
+        setOpen(false);
+        clearTimeout(enterTimer.current);
+    }, []);
+    var ownRef = react_1.useRef();
+    var handleRef = react_1.useCallback(function (value) {
+        // If child has a `ref` already we must not override it
+        setReactRef_1.setReactRef(childRef, value);
+        ownRef.current = value;
+    }, [childRef, ownRef]);
+    return (React.createElement(React.Fragment, null,
+        React.cloneElement(children, {
+            onMouseEnter: showTooltip,
+            onMouseLeave: hideTooltip,
+            ref: handleRef,
+        }),
+        isOpen && message && (React.createElement(ApTooltip_styles_1.TooltipContainer, __assign({ disableOutsideClick: true, onClose: hideTooltip, hideArrow: hideArrow, className: className, referenceElement: ownRef.current, modifiers: {
+                offset: { offset: '0, 4' }
+            } }, rest), message))));
+};
+exports.ApTooltip = react_1.memo(Tooltip);
 //# sourceMappingURL=ApTooltip.js.map

package/dist/esm/components/ApTooltip/ApTooltip.styles.js

@@ -1,25 +1,25 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TooltipContainer = exports.Arrow = void 0;
-var styled_components_1 = require("styled-components");
-var theme_1 = require("../../utils/theme");
-var ApPopover_1 = require("../ApPopover/ApPopover");
-var arrowSize = '16px';
-var fadeIn = styled_components_1.keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n"], ["\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n"])));
-exports.Arrow = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  /* 1px to account for arrow border */\n  width: calc(", " + 1px);\n  height: ", ";\n  &:before,\n  &:after {\n    content: ' ';\n    display: block;\n    width: 0;\n    height: 0;\n    position: absolute;\n  }\n"], ["\n  position: absolute;\n  /* 1px to account for arrow border */\n  width: calc(", " + 1px);\n  height: ", ";\n  &:before,\n  &:after {\n    content: ' ';\n    display: block;\n    width: 0;\n    height: 0;\n    position: absolute;\n  }\n"])), arrowSize, arrowSize);
-exports.TooltipContainer = styled_components_1.default(ApPopover_1.ApPopover)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  box-shadow: ", ";\n  background: ", ";\n  color: ", ";\n  max-width: 120px;\n  z-index: 10;\n  opacity: 0;\n  animation: ", " ease 0.1s forwards;\n  padding: 6px 12px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  font-size: 11px;\n  font-weight: normal;\n  border-radius: 1px;\n  &[data-placement='top'] {\n    margin-bottom: ", ";\n  }\n  &[data-placement='bottom'] {\n    margin-top: ", ";\n  }\n  &[data-placement='left'] {\n    margin-right: ", ";\n  }\n  &[data-placement='right'] {\n    margin-left: ", ";\n  }\n  &[data-placement*='top'] {\n    .ap-popover-arrow {\n      bottom: calc(", " / -2);\n      transform: scaleY(-1);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        border-bottom-color: ", ";\n        transform: translate(0, -55%);\n      }\n      &:after {\n        border-bottom-color: ", ";\n        transform: translate(0, -48%);\n      }\n    }\n  }\n  &[data-placement*='bottom'] {\n    .ap-popover-arrow {\n      top: calc((", " / -2) + 2px);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        border-bottom-color: ", ";\n        transform: translate(5%, -55%);\n      }\n      &:after {\n        border-bottom-color: ", ";\n        transform: translate(5%, -48%);\n      }\n    }\n  }\n  &[data-placement*='left'] {\n    .ap-popover-arrow {\n      right: calc(", " * -1 + 2px);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        top: ", ";\n        transform: translate(15%, -100%);\n      }\n      &:before {\n        border-left-color: ", ";\n      }\n      &:after {\n        border-left-color: ", ";\n      }\n    }\n  }\n  &[data-placement*='right'] {\n    .ap-popover-arrow {\n      left: calc(", " * -1 + 2px);\n      transform: scaleX(-1);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        top: ", ";\n        transform: translate(15%, -100%);\n      }\n      &:before {\n        border-left-color: rgba(0, 0, 0, 0.05);\n      }\n      &:after {\n        border-left-color: ", ";\n      }\n    }\n  }\n"], ["\n  box-shadow: ", ";\n  background: ", ";\n  color: ", ";\n  max-width: 120px;\n  z-index: 10;\n  opacity: 0;\n  animation: ", " ease 0.1s forwards;\n  padding: 6px 12px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  font-size: 11px;\n  font-weight: normal;\n  border-radius: 1px;\n  &[data-placement='top'] {\n    margin-bottom: ",
-    ";\n  }\n  &[data-placement='bottom'] {\n    margin-top: ", ";\n  }\n  &[data-placement='left'] {\n    margin-right: ",
-    ";\n  }\n  &[data-placement='right'] {\n    margin-left: ",
-    ";\n  }\n  &[data-placement*='top'] {\n    .ap-popover-arrow {\n      bottom: calc(", " / -2);\n      transform: scaleY(-1);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        border-bottom-color: ", ";\n        transform: translate(0, -55%);\n      }\n      &:after {\n        border-bottom-color: ", ";\n        transform: translate(0, -48%);\n      }\n    }\n  }\n  &[data-placement*='bottom'] {\n    .ap-popover-arrow {\n      top: calc((", " / -2) + 2px);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        border-bottom-color: ", ";\n        transform: translate(5%, -55%);\n      }\n      &:after {\n        border-bottom-color: ", ";\n        transform: translate(5%, -48%);\n      }\n    }\n  }\n  &[data-placement*='left'] {\n    .ap-popover-arrow {\n      right: calc(", " * -1 + 2px);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        top: ", ";\n        transform: translate(15%, -100%);\n      }\n      &:before {\n        border-left-color: ", ";\n      }\n      &:after {\n        border-left-color: ", ";\n      }\n    }\n  }\n  &[data-placement*='right'] {\n    .ap-popover-arrow {\n      left: calc(", " * -1 + 2px);\n      transform: scaleX(-1);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        top: ", ";\n        transform: translate(15%, -100%);\n      }\n      &:before {\n        border-left-color: rgba(0, 0, 0, 0.05);\n      }\n      &:after {\n        border-left-color: ", ";\n      }\n    }\n  }\n"])), theme_1.boxShadows[3], theme_1.colors.grey6, theme_1.colors.white, fadeIn, function (props) {
-    return props.hideArrow ? '' : "calc(" + arrowSize + " - 7px)";
-}, function (props) { return (props.hideArrow ? '' : "calc(" + arrowSize + " - 7px)"); }, function (props) {
-    return props.hideArrow ? '' : "calc(" + arrowSize + " - 7px)";
-}, function (props) {
-    return props.hideArrow ? '' : "calc(" + arrowSize + " - 7px)";
-}, arrowSize, theme_1.colors.grey6, theme_1.colors.grey6, arrowSize, theme_1.colors.grey6, theme_1.colors.grey6, arrowSize, arrowSize, theme_1.colors.grey6, theme_1.colors.grey6, arrowSize, arrowSize, theme_1.colors.grey6);
-var templateObject_1, templateObject_2, templateObject_3;
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TooltipContainer = exports.Arrow = void 0;
+var styled_components_1 = require("styled-components");
+var theme_1 = require("../../utils/theme");
+var ApPopover_1 = require("../ApPopover/ApPopover");
+var arrowSize = '16px';
+var fadeIn = styled_components_1.keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n"], ["\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n"])));
+exports.Arrow = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  /* 1px to account for arrow border */\n  width: calc(", " + 1px);\n  height: ", ";\n  &:before,\n  &:after {\n    content: ' ';\n    display: block;\n    width: 0;\n    height: 0;\n    position: absolute;\n  }\n"], ["\n  position: absolute;\n  /* 1px to account for arrow border */\n  width: calc(", " + 1px);\n  height: ", ";\n  &:before,\n  &:after {\n    content: ' ';\n    display: block;\n    width: 0;\n    height: 0;\n    position: absolute;\n  }\n"])), arrowSize, arrowSize);
+exports.TooltipContainer = styled_components_1.default(ApPopover_1.ApPopover)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  box-shadow: ", ";\n  background: ", ";\n  color: ", ";\n  max-width: 120px;\n  z-index: 10;\n  opacity: 0;\n  animation: ", " ease 0.1s forwards;\n  padding: 6px 12px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  font-size: 11px;\n  font-weight: normal;\n  border-radius: 1px;\n  &[data-placement='top'] {\n    margin-bottom: ", ";\n  }\n  &[data-placement='bottom'] {\n    margin-top: ", ";\n  }\n  &[data-placement='left'] {\n    margin-right: ", ";\n  }\n  &[data-placement='right'] {\n    margin-left: ", ";\n  }\n  &[data-placement*='top'] {\n    .ap-popover-arrow {\n      bottom: calc(", " / -2);\n      transform: scaleY(-1);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        border-bottom-color: ", ";\n        transform: translate(0, -55%);\n      }\n      &:after {\n        border-bottom-color: ", ";\n        transform: translate(0, -48%);\n      }\n    }\n  }\n  &[data-placement*='bottom'] {\n    .ap-popover-arrow {\n      top: calc((", " / -2) + 2px);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        border-bottom-color: ", ";\n        transform: translate(5%, -55%);\n      }\n      &:after {\n        border-bottom-color: ", ";\n        transform: translate(5%, -48%);\n      }\n    }\n  }\n  &[data-placement*='left'] {\n    .ap-popover-arrow {\n      right: calc(", " * -1 + 2px);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        top: ", ";\n        transform: translate(15%, -100%);\n      }\n      &:before {\n        border-left-color: ", ";\n      }\n      &:after {\n        border-left-color: ", ";\n      }\n    }\n  }\n  &[data-placement*='right'] {\n    .ap-popover-arrow {\n      left: calc(", " * -1 + 2px);\n      transform: scaleX(-1);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        top: ", ";\n        transform: translate(15%, -100%);\n      }\n      &:before {\n        border-left-color: rgba(0, 0, 0, 0.05);\n      }\n      &:after {\n        border-left-color: ", ";\n      }\n    }\n  }\n"], ["\n  box-shadow: ", ";\n  background: ", ";\n  color: ", ";\n  max-width: 120px;\n  z-index: 10;\n  opacity: 0;\n  animation: ", " ease 0.1s forwards;\n  padding: 6px 12px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  font-size: 11px;\n  font-weight: normal;\n  border-radius: 1px;\n  &[data-placement='top'] {\n    margin-bottom: ",
+    ";\n  }\n  &[data-placement='bottom'] {\n    margin-top: ", ";\n  }\n  &[data-placement='left'] {\n    margin-right: ",
+    ";\n  }\n  &[data-placement='right'] {\n    margin-left: ",
+    ";\n  }\n  &[data-placement*='top'] {\n    .ap-popover-arrow {\n      bottom: calc(", " / -2);\n      transform: scaleY(-1);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        border-bottom-color: ", ";\n        transform: translate(0, -55%);\n      }\n      &:after {\n        border-bottom-color: ", ";\n        transform: translate(0, -48%);\n      }\n    }\n  }\n  &[data-placement*='bottom'] {\n    .ap-popover-arrow {\n      top: calc((", " / -2) + 2px);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        border-bottom-color: ", ";\n        transform: translate(5%, -55%);\n      }\n      &:after {\n        border-bottom-color: ", ";\n        transform: translate(5%, -48%);\n      }\n    }\n  }\n  &[data-placement*='left'] {\n    .ap-popover-arrow {\n      right: calc(", " * -1 + 2px);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        top: ", ";\n        transform: translate(15%, -100%);\n      }\n      &:before {\n        border-left-color: ", ";\n      }\n      &:after {\n        border-left-color: ", ";\n      }\n    }\n  }\n  &[data-placement*='right'] {\n    .ap-popover-arrow {\n      left: calc(", " * -1 + 2px);\n      transform: scaleX(-1);\n      &:before,\n      &:after {\n        border: 8px solid rgba(0, 0, 0, 0);\n        top: ", ";\n        transform: translate(15%, -100%);\n      }\n      &:before {\n        border-left-color: rgba(0, 0, 0, 0.05);\n      }\n      &:after {\n        border-left-color: ", ";\n      }\n    }\n  }\n"])), theme_1.boxShadows[3], theme_1.colors.grey6, theme_1.colors.white, fadeIn, function (props) {
+    return props.hideArrow ? '' : "calc(" + arrowSize + " - 7px)";
+}, function (props) { return (props.hideArrow ? '' : "calc(" + arrowSize + " - 7px)"); }, function (props) {
+    return props.hideArrow ? '' : "calc(" + arrowSize + " - 7px)";
+}, function (props) {
+    return props.hideArrow ? '' : "calc(" + arrowSize + " - 7px)";
+}, arrowSize, theme_1.colors.grey6, theme_1.colors.grey6, arrowSize, theme_1.colors.grey6, theme_1.colors.grey6, arrowSize, arrowSize, theme_1.colors.grey6, theme_1.colors.grey6, arrowSize, arrowSize, theme_1.colors.grey6);
+var templateObject_1, templateObject_2, templateObject_3;
 //# sourceMappingURL=ApTooltip.styles.js.map

package/dist/esm/components/ApTooltip/index.js

@@ -1,14 +1,14 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./ApTooltip"), exports);
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./ApTooltip"), exports);
 //# sourceMappingURL=index.js.map

package/dist/esm/components/ApWidgets/AllWidgets/styles.js

@@ -1,20 +1,20 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ItemWrapper = exports.Wrapper = void 0;
-var styled_components_1 = require("styled-components");
-var DEFAULT_WIDTH = 256;
-var DEFAULT_HEIGHT = 256;
-var MARGIN = 12;
-var NON_STANDARD_GRAY = '#f2f2f2';
-exports.Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  background: ", ";\n  & > div:last-child {\n    clear: right;\n  }\n"], ["\n  width: 100%;\n  background: ", ";\n  & > div:last-child {\n    clear: right;\n  }\n"])), NON_STANDARD_GRAY);
-exports.ItemWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: ", "px;\n  height: ", "px;\n  margin: ", "px;\n  display: inline-block;\n"], ["\n  width: ",
-    "px;\n  height: ", "px;\n  margin: ", "px;\n  display: inline-block;\n"])), function (_a) {
-    var ratio = _a.ratio;
-    return ratio === 2 ? (DEFAULT_WIDTH + MARGIN) * 2 : DEFAULT_WIDTH;
-}, DEFAULT_HEIGHT, MARGIN);
-var templateObject_1, templateObject_2;
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ItemWrapper = exports.Wrapper = void 0;
+var styled_components_1 = require("styled-components");
+var DEFAULT_WIDTH = 256;
+var DEFAULT_HEIGHT = 256;
+var MARGIN = 12;
+var NON_STANDARD_GRAY = '#f2f2f2';
+exports.Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  background: ", ";\n  & > div:last-child {\n    clear: right;\n  }\n"], ["\n  width: 100%;\n  background: ", ";\n  & > div:last-child {\n    clear: right;\n  }\n"])), NON_STANDARD_GRAY);
+exports.ItemWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: ", "px;\n  height: ", "px;\n  margin: ", "px;\n  display: inline-block;\n"], ["\n  width: ",
+    "px;\n  height: ", "px;\n  margin: ", "px;\n  display: inline-block;\n"])), function (_a) {
+    var ratio = _a.ratio;
+    return ratio === 2 ? (DEFAULT_WIDTH + MARGIN) * 2 : DEFAULT_WIDTH;
+}, DEFAULT_HEIGHT, MARGIN);
+var templateObject_1, templateObject_2;
 //# sourceMappingURL=styles.js.map

package/dist/esm/components/ApWidgets/ApCashflowWidget/ApCashflowWidget.js

@@ -1,60 +1,60 @@
-"use strict";
-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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ApCashflowWidget = void 0;
-var React = require("react");
-var ApLoaderDefault_1 = require("../../ApLoaderDefault");
-var ApLoaderText_1 = require("../../ApLoaderText");
-var ApWidgetBigValue_1 = require("../ApWidgetBigValue");
-var ApWidgetBullet_1 = require("../ApWidgetBullet");
-var ApWidgetCard_1 = require("../ApWidgetCard");
-var ApWidgetErrorMessage_1 = require("../ApWidgetErrorMessage");
-var ApWidgetName_1 = require("../ApWidgetName");
-var styles_1 = require("./styles");
-exports.ApCashflowWidget = function (_a) {
-    var _b = _a.config, config = _b === void 0 ? { name: '' } : _b, data = _a.data, dataError = _a.dataError, props = __rest(_a, ["config", "data", "dataError"]);
-    return (React.createElement(ApWidgetCard_1.ApWidgetCard, __assign({}, props),
-        React.createElement(styles_1.Container, null,
-            config && (React.createElement(ApWidgetName_1.ApWidgetName, { name: config.name, iconType: config.iconType })),
-            dataError ? (React.createElement(styles_1.StyledWidgetBody, null,
-                React.createElement(ApWidgetErrorMessage_1.ApWidgetErrorMessage, null))) : !data ? (React.createElement(styles_1.StyledWidgetBody, null,
-                React.createElement(ApLoaderDefault_1.ApLoaderDefault, { loaderText: function () { return React.createElement(ApLoaderText_1.ApLoaderText, null); } }))) : (React.createElement(styles_1.BodyWrapper, null,
-                React.createElement(styles_1.VarianceContainer, null,
-                    React.createElement(ApWidgetBigValue_1.ApWidgetBigValue, null, data.value)),
-                React.createElement(styles_1.CashflowContainer, { isHidden: !data.incoming && !data.outgoing },
-                    React.createElement(styles_1.IncomingColumn, null,
-                        React.createElement(styles_1.Label, null, "INCOMING"),
-                        React.createElement(styles_1.Value, null, data.incoming || '-')),
-                    React.createElement(styles_1.OutgoingColumn, null,
-                        React.createElement(styles_1.Label, null, "OUTGOING"),
-                        React.createElement(styles_1.Value, null, data.outgoing || '-'))),
-                React.createElement(ApWidgetBullet_1.ApWidgetBulletList, { list: [data.viewType, data.taxonomyType + " taxonomy"] }))))));
-};
-exports.ApCashflowWidget.defaultProps = {
-    config: {
-        name: '',
-    },
-    data: null,
-};
+"use strict";
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ApCashflowWidget = void 0;
+var React = require("react");
+var ApLoaderDefault_1 = require("../../ApLoaderDefault");
+var ApLoaderText_1 = require("../../ApLoaderText");
+var ApWidgetBigValue_1 = require("../ApWidgetBigValue");
+var ApWidgetBullet_1 = require("../ApWidgetBullet");
+var ApWidgetCard_1 = require("../ApWidgetCard");
+var ApWidgetErrorMessage_1 = require("../ApWidgetErrorMessage");
+var ApWidgetName_1 = require("../ApWidgetName");
+var styles_1 = require("./styles");
+exports.ApCashflowWidget = function (_a) {
+    var _b = _a.config, config = _b === void 0 ? { name: '' } : _b, data = _a.data, dataError = _a.dataError, props = __rest(_a, ["config", "data", "dataError"]);
+    return (React.createElement(ApWidgetCard_1.ApWidgetCard, __assign({}, props),
+        React.createElement(styles_1.Container, null,
+            config && (React.createElement(ApWidgetName_1.ApWidgetName, { name: config.name, iconType: config.iconType })),
+            dataError ? (React.createElement(styles_1.StyledWidgetBody, null,
+                React.createElement(ApWidgetErrorMessage_1.ApWidgetErrorMessage, null))) : !data ? (React.createElement(styles_1.StyledWidgetBody, null,
+                React.createElement(ApLoaderDefault_1.ApLoaderDefault, { loaderText: function () { return React.createElement(ApLoaderText_1.ApLoaderText, null); } }))) : (React.createElement(styles_1.BodyWrapper, null,
+                React.createElement(styles_1.VarianceContainer, null,
+                    React.createElement(ApWidgetBigValue_1.ApWidgetBigValue, null, data.value)),
+                React.createElement(styles_1.CashflowContainer, { isHidden: !data.incoming && !data.outgoing },
+                    React.createElement(styles_1.IncomingColumn, null,
+                        React.createElement(styles_1.Label, null, "INCOMING"),
+                        React.createElement(styles_1.Value, null, data.incoming || '-')),
+                    React.createElement(styles_1.OutgoingColumn, null,
+                        React.createElement(styles_1.Label, null, "OUTGOING"),
+                        React.createElement(styles_1.Value, null, data.outgoing || '-'))),
+                React.createElement(ApWidgetBullet_1.ApWidgetBulletList, { list: [data.viewType, data.taxonomyType + " taxonomy"] }))))));
+};
+exports.ApCashflowWidget.defaultProps = {
+    config: {
+        name: '',
+    },
+    data: null,
+};
 //# sourceMappingURL=ApCashflowWidget.js.map

package/dist/esm/components/ApWidgets/ApCashflowWidget/index.js

@@ -1,14 +1,14 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./ApCashflowWidget"), exports);
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./ApCashflowWidget"), exports);
 //# sourceMappingURL=index.js.map

package/dist/esm/components/ApWidgets/ApCashflowWidget/mockData.js

@@ -1,15 +1,15 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.props = void 0;
-var ApWidgetIcon_1 = require("../ApWidgetIcon");
-exports.props = {
-    config: { name: 'Cashflow Widget', iconType: ApWidgetIcon_1.ApWidgetIconTypes.chc },
-    data: {
-        incoming: '58%',
-        outgoing: '13.36',
-        taxonomyType: 'Standard',
-        value: 'US$6M',
-        viewType: 'Consolidated',
-    },
-};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.props = void 0;
+var ApWidgetIcon_1 = require("../ApWidgetIcon");
+exports.props = {
+    config: { name: 'Cashflow Widget', iconType: ApWidgetIcon_1.ApWidgetIconTypes.chc },
+    data: {
+        incoming: '58%',
+        outgoing: '13.36',
+        taxonomyType: 'Standard',
+        value: 'US$6M',
+        viewType: 'Consolidated',
+    },
+};
 //# sourceMappingURL=mockData.js.map

package/dist/esm/components/ApWidgets/ApCashflowWidget/styles.js

@@ -1,29 +1,29 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TypeContainer = exports.OutgoingColumn = exports.IncomingColumn = exports.CashflowContainer = exports.BodyWrapper = exports.Column = exports.VarianceValue = exports.VarianceContainer = exports.Value = exports.Label = exports.Container = exports.StyledWidgetBody = void 0;
-var styled_components_1 = require("styled-components");
-var theme_1 = require("../../../utils/theme");
-exports.StyledWidgetBody = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  height: 100%;\n"], ["\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  height: 100%;\n"])));
-exports.Container = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n"], ["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n"])));
-exports.Label = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-size: 11px;\n  color: ", ";\n"], ["\n  font-size: 11px;\n  color: ", ";\n"])), theme_1.colors.grey5);
-exports.Value = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  font-size: 13px;\n  font-weight: bold;\n  color: ", ";\n  margin-top: 8px;\n"], ["\n  font-size: 13px;\n  font-weight: bold;\n  color: ", ";\n  margin-top: 8px;\n"])), theme_1.colors.grey7);
-exports.VarianceContainer = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"], ["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"])));
-exports.VarianceValue = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  font-size: ", ";\n  color: ", ";\n  flex: 50%;\n  margin: ", ";\n"], ["\n  display: flex;\n  font-size: ",
-    ";\n  color: ", ";\n  flex: 50%;\n  margin: ", ";\n"])), function (props) {
-    return props.isSmall ? '36px' : '44px';
-}, theme_1.colors.grey7, function (props) { return (props.isSmall ? '5px 0' : '0'); });
-exports.Column = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  flex: 50%;\n"], ["\n  flex: 50%;\n"])));
-exports.BodyWrapper = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  flex-grow: 1;\n  position: relative;\n"], ["\n  flex-grow: 1;\n  position: relative;\n"])));
-exports.CashflowContainer = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  margin: 20px 0;\n  visibility: ", ";\n"], ["\n  display: flex;\n  justify-content: space-between;\n  margin: 20px 0;\n  visibility: ",
-    ";\n"])), function (props) {
-    return props.isHidden ? 'hidden' : 'visible';
-});
-exports.IncomingColumn = styled_components_1.default(exports.Column)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  border-left: 10px solid ", ";\n  padding-left: 4px;\n"], ["\n  border-left: 10px solid ", ";\n  padding-left: 4px;\n"])), theme_1.colors.green1);
-exports.OutgoingColumn = styled_components_1.default(exports.Column)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  border-left: 10px solid ", ";\n  padding-left: 4px;\n"], ["\n  border-left: 10px solid ", ";\n  padding-left: 4px;\n"])), theme_1.colors.red1);
-exports.TypeContainer = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n"], ["\n  display: flex;\n  justify-content: space-between;\n"])));
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12;
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TypeContainer = exports.OutgoingColumn = exports.IncomingColumn = exports.CashflowContainer = exports.BodyWrapper = exports.Column = exports.VarianceValue = exports.VarianceContainer = exports.Value = exports.Label = exports.Container = exports.StyledWidgetBody = void 0;
+var styled_components_1 = require("styled-components");
+var theme_1 = require("../../../utils/theme");
+exports.StyledWidgetBody = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  height: 100%;\n"], ["\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  height: 100%;\n"])));
+exports.Container = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n"], ["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n"])));
+exports.Label = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-size: 11px;\n  color: ", ";\n"], ["\n  font-size: 11px;\n  color: ", ";\n"])), theme_1.colors.grey5);
+exports.Value = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  font-size: 13px;\n  font-weight: bold;\n  color: ", ";\n  margin-top: 8px;\n"], ["\n  font-size: 13px;\n  font-weight: bold;\n  color: ", ";\n  margin-top: 8px;\n"])), theme_1.colors.grey7);
+exports.VarianceContainer = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"], ["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"])));
+exports.VarianceValue = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  font-size: ", ";\n  color: ", ";\n  flex: 50%;\n  margin: ", ";\n"], ["\n  display: flex;\n  font-size: ",
+    ";\n  color: ", ";\n  flex: 50%;\n  margin: ", ";\n"])), function (props) {
+    return props.isSmall ? '36px' : '44px';
+}, theme_1.colors.grey7, function (props) { return (props.isSmall ? '5px 0' : '0'); });
+exports.Column = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  flex: 50%;\n"], ["\n  flex: 50%;\n"])));
+exports.BodyWrapper = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  flex-grow: 1;\n  position: relative;\n"], ["\n  flex-grow: 1;\n  position: relative;\n"])));
+exports.CashflowContainer = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  margin: 20px 0;\n  visibility: ", ";\n"], ["\n  display: flex;\n  justify-content: space-between;\n  margin: 20px 0;\n  visibility: ",
+    ";\n"])), function (props) {
+    return props.isHidden ? 'hidden' : 'visible';
+});
+exports.IncomingColumn = styled_components_1.default(exports.Column)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  border-left: 10px solid ", ";\n  padding-left: 4px;\n"], ["\n  border-left: 10px solid ", ";\n  padding-left: 4px;\n"])), theme_1.colors.green1);
+exports.OutgoingColumn = styled_components_1.default(exports.Column)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  border-left: 10px solid ", ";\n  padding-left: 4px;\n"], ["\n  border-left: 10px solid ", ";\n  padding-left: 4px;\n"])), theme_1.colors.red1);
+exports.TypeContainer = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n"], ["\n  display: flex;\n  justify-content: space-between;\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12;
 //# sourceMappingURL=styles.js.map