oolib 2.89.1 → 2.90.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -7,6 +7,8 @@ exports.genColor = void 0;
7
7
  var react_1 = __importDefault(require("react"));
8
8
  var genColor = function (_a) {
9
9
  var color = _a.color;
10
+ if (!color)
11
+ return null;
10
12
  return (react_1.default.createElement("div", { style: { flex: "0 0 auto" } },
11
13
  react_1.default.createElement("div", { style: { width: '2rem', height: '2rem', background: color, borderRadius: '10%' } })));
12
14
  };
@@ -5,7 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.ConfirmDeleteModal = void 0;
7
7
  var react_1 = __importDefault(require("react"));
8
- var ModalConfirm_1 = require("../../../../../Modals/derivedComps/ModalConfirm");
8
+ var ModalConfirm_1 = require("../../../../../Modals/ModalConfirm");
9
9
  var ConfirmDeleteModal = function (_a) {
10
10
  var showDeleteImageModal = _a.showDeleteImageModal, setShowDeleteImageModal = _a.setShowDeleteImageModal, handleDeleteSingleImage = _a.handleDeleteSingleImage;
11
11
  return (react_1.default.createElement(ModalConfirm_1.ModalConfirm, { title: "Are you sure you want to delete this image?", subTitle: "Once you delete an image it cannot be undone", onClose: function () {
@@ -46,7 +46,9 @@ var styled_1 = require("./styled");
46
46
  var Buttons_1 = require("../../Buttons");
47
47
  var Divider_1 = require("../../Divider");
48
48
  var Modal = function (_a) {
49
- var title = _a.title, onClose = _a.onClose, children = _a.children, linkTo = _a.linkTo, _b = _a.desktopWidth, desktopWidth = _b === void 0 ? "80%" : _b, _c = _a.headerStyle, headerStyle = _c === void 0 ? "style1" : _c, subtitle = _a.subtitle, _d = _a.fitToContentHeight, fitToContentHeight = _d === void 0 ? false : _d, invert = _a.invert, overflowVisible = _a.overflowVisible, _e = _a.showActionPanel, showActionPanel = _e === void 0 ? false : _e, _f = _a.onCloseText, onCloseText = _f === void 0 ? "Close" : _f, onConfirm = _a.onConfirm, _g = _a.onConfirmText, onConfirmText = _g === void 0 ? "Confirm" : _g, _h = _a.alignActions, alignActions = _h === void 0 ? "right" : _h;
49
+ var title = _a.title, onClose = _a.onClose, children = _a.children, linkTo = _a.linkTo, _b = _a.desktopWidth, desktopWidth = _b === void 0 ? "80%" : _b, _c = _a.headerStyle, headerStyle = _c === void 0 ? "style1" : _c, subtitle = _a.subtitle, // used only in header style 2
50
+ _d = _a.fitToContentHeight, // used only in header style 2
51
+ fitToContentHeight = _d === void 0 ? false : _d, invert = _a.invert, overflowVisible = _a.overflowVisible, _e = _a.showActionPanel, showActionPanel = _e === void 0 ? false : _e, _f = _a.onCloseText, onCloseText = _f === void 0 ? "Close" : _f, onConfirm = _a.onConfirm, _g = _a.onConfirmText, onConfirmText = _g === void 0 ? "Confirm" : _g, _h = _a.alignActions, alignActions = _h === void 0 ? "right" : _h;
50
52
  var screenWidth = (0, useScreenWidth_1.useScreenWidth)();
51
53
  var handleClose = function () { return onClose(); };
52
54
  var initAnimPos = { marginTop: "100vh", opacity: 0 };
@@ -0,0 +1,10 @@
1
+ export function ModalConfirm({ title, subTitle, children, onClose, onCloseText, onConfirm, onConfirmText, alignActions }: {
2
+ title: any;
3
+ subTitle: any;
4
+ children: any;
5
+ onClose: any;
6
+ onCloseText?: string;
7
+ onConfirm: any;
8
+ onConfirmText?: string;
9
+ alignActions?: string;
10
+ }): any;
@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
23
23
  return result;
24
24
  };
25
25
  Object.defineProperty(exports, "__esModule", { value: true });
26
- exports.ModalSmall = void 0;
26
+ exports.ModalConfirm = void 0;
27
27
  var react_1 = __importStar(require("react"));
28
28
  var react_dom_1 = require("react-dom");
29
29
  var mixins_1 = require("../../../themes/mixins");
@@ -31,33 +31,36 @@ var useScreenWidth_1 = require("../../../utils/customHooks/useScreenWidth");
31
31
  var Buttons_1 = require("../../Buttons");
32
32
  var Typo_1 = require("../../Typo");
33
33
  var styled_1 = require("./styled");
34
- var ModalSmall = function (_a) {
35
- var title = _a.title, subTitle = _a.subTitle, onClose = _a.onClose, children = _a.children;
34
+ var ModalConfirm = function (_a) {
35
+ var title = _a.title, subTitle = _a.subTitle, children = _a.children, onClose = _a.onClose, _b = _a.onCloseText, onCloseText = _b === void 0 ? "Cancel" : _b, onConfirm = _a.onConfirm, _c = _a.onConfirmText, onConfirmText = _c === void 0 ? "Delete" : _c, _d = _a.alignActions, alignActions = _d === void 0 ? "left" : _d;
36
36
  var screenWidth = (0, useScreenWidth_1.useScreenWidth)();
37
37
  var initAnimPos = { marginTop: "100vh", opacity: 0, translateY: "100%" };
38
38
  var endAnimPos = { marginTop: 0, opacity: 1, translateY: 0 };
39
- var _b = (0, react_1.useState)(endAnimPos), animPos = _b[0], setAnimPos = _b[1];
39
+ var _e = (0, react_1.useState)(endAnimPos), animPos = _e[0], setAnimPos = _e[1];
40
40
  (0, react_1.useEffect)(function () {
41
41
  document.body.style.overflow = "hidden";
42
42
  return function () { return (document.body.style.overflow = "unset"); };
43
43
  }, []);
44
44
  var SubTitleText = screenWidth >= (0, mixins_1.getBreakPoint)('sm') ? Typo_1.SANS_4 : Typo_1.SANS_3;
45
45
  var genModalContents = function () { return (react_1.default.createElement(react_1.Fragment, null,
46
- onClose && (react_1.default.createElement(styled_1.StyledModalSmallClose, null,
46
+ onClose && (react_1.default.createElement(styled_1.StyledModalConfirmClose, null,
47
47
  react_1.default.createElement(Buttons_1.ButtonPrimary, { S: true, icon: "X", onClick: function () { return setAnimPos(initAnimPos); } }))),
48
- react_1.default.createElement(styled_1.StyledModalSmallContent, null,
48
+ react_1.default.createElement(styled_1.StyledModalConfirmContent, null,
49
49
  title && (react_1.default.createElement("div", null,
50
50
  react_1.default.createElement(Typo_1.SERIF_5_6, null, title))),
51
- subTitle && (react_1.default.createElement(styled_1.StyledModalSmallContentSubtitle, null,
51
+ subTitle && (react_1.default.createElement(styled_1.StyledModalConfirmContentSubtitle, null,
52
52
  react_1.default.createElement(SubTitleText, null, subTitle))),
53
- react_1.default.createElement("div", { style: { marginTop: (title || subTitle) && "2rem" } }, children ? children : null)))); };
54
- return ((0, react_dom_1.createPortal)(react_1.default.createElement(styled_1.StyledModalSmall, { initial: { opacity: initAnimPos.opacity }, animate: { opacity: animPos.opacity }, transition: { type: "tween", ease: "easeOut" }, onClick: function () { return onClose(); } }, screenWidth < (0, mixins_1.getBreakPoint)("sm") ? (react_1.default.createElement(styled_1.StyledModalSmallContentWrapper, { initial: initAnimPos, animate: animPos, transition: {
53
+ react_1.default.createElement("div", { style: { marginTop: (title || subTitle) && "2rem" } }, children ? children : null),
54
+ react_1.default.createElement(styled_1.StyledFlexWrapper, { style: { marginTop: (children) && "2rem" }, alignActions: alignActions },
55
+ react_1.default.createElement(Buttons_1.ButtonPrimary, { onClick: onConfirm }, onConfirmText),
56
+ react_1.default.createElement(Buttons_1.ButtonSecondary, { onClick: onClose }, onCloseText))))); };
57
+ return ((0, react_dom_1.createPortal)(react_1.default.createElement(styled_1.StyledModalConfirm, { initial: { opacity: initAnimPos.opacity }, animate: { opacity: animPos.opacity }, transition: { type: "tween", ease: "easeOut" }, onClick: function () { return onClose(); } }, screenWidth < (0, mixins_1.getBreakPoint)("sm") ? (react_1.default.createElement(styled_1.StyledModalConfirmContentWrapper, { initial: initAnimPos, animate: animPos, transition: {
55
58
  type: "tween",
56
59
  ease: "easeOut",
57
60
  }, onAnimationComplete: function () {
58
61
  if (animPos.marginTop === initAnimPos.marginTop)
59
62
  onClose();
60
- }, onClick: function (e) { return e.stopPropagation(); } }, genModalContents())) : (react_1.default.createElement(styled_1.StyledModalSmallContentWrapper
63
+ }, onClick: function (e) { return e.stopPropagation(); } }, genModalContents())) : (react_1.default.createElement(styled_1.StyledModalConfirmContentWrapper
61
64
  // style={{ width: "100%" }}
62
65
  , {
63
66
  // style={{ width: "100%" }}
@@ -75,4 +78,4 @@ var ModalSmall = function (_a) {
75
78
  onClose();
76
79
  }, onClick: function (e) { return e.stopPropagation(); } }, genModalContents()))), document.getElementById("modal-root")));
77
80
  };
78
- exports.ModalSmall = ModalSmall;
81
+ exports.ModalConfirm = ModalConfirm;
@@ -0,0 +1,6 @@
1
+ export const StyledModalConfirm: import("styled-components").StyledComponent<any, any, object, string | number | symbol>;
2
+ export const StyledModalConfirmContentWrapper: import("styled-components").StyledComponent<any, any, object, string | number | symbol>;
3
+ export const StyledModalConfirmContent: import("styled-components").StyledComponent<"div", any, {}, never>;
4
+ export const StyledModalConfirmClose: import("styled-components").StyledComponent<"div", any, {}, never>;
5
+ export const StyledModalConfirmContentSubtitle: import("styled-components").StyledComponent<"div", any, {}, never>;
6
+ export const StyledFlexWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -0,0 +1,46 @@
1
+ "use strict";
2
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
+ return cooked;
5
+ };
6
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
+ if (k2 === undefined) k2 = k;
8
+ var desc = Object.getOwnPropertyDescriptor(m, k);
9
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
10
+ desc = { enumerable: true, get: function() { return m[k]; } };
11
+ }
12
+ Object.defineProperty(o, k2, desc);
13
+ }) : (function(o, m, k, k2) {
14
+ if (k2 === undefined) k2 = k;
15
+ o[k2] = m[k];
16
+ }));
17
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
18
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
19
+ }) : function(o, v) {
20
+ o["default"] = v;
21
+ });
22
+ var __importStar = (this && this.__importStar) || function (mod) {
23
+ if (mod && mod.__esModule) return mod;
24
+ var result = {};
25
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
26
+ __setModuleDefault(result, mod);
27
+ return result;
28
+ };
29
+ Object.defineProperty(exports, "__esModule", { value: true });
30
+ exports.StyledFlexWrapper = exports.StyledModalConfirmContentSubtitle = exports.StyledModalConfirmClose = exports.StyledModalConfirmContent = exports.StyledModalConfirmContentWrapper = exports.StyledModalConfirm = void 0;
31
+ var mixins_1 = require("../../../themes/mixins");
32
+ var themes_1 = require("../../../themes");
33
+ var framer_motion_1 = require("framer-motion");
34
+ var styled_components_1 = __importStar(require("styled-components"));
35
+ var white = themes_1.colors.white, greyColor100_opacity70 = themes_1.colors.greyColor100_opacity70;
36
+ var ModalStyles = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n position: fixed;\n top: 0;\n left: 0;\n background: ", ";\n z-index: 999999999;\n"], ["\n width: 100%;\n height: 100%;\n position: fixed;\n top: 0;\n left: 0;\n background: ", ";\n z-index: 999999999;\n"])), greyColor100_opacity70);
37
+ exports.StyledModalConfirm = (0, styled_components_1.default)(framer_motion_1.motion.div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n\n ", " {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"], ["\n ", "\n\n ", " {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])), ModalStyles, (0, mixins_1.mediaQuery)("sm"));
38
+ exports.StyledModalConfirmContentWrapper = (0, styled_components_1.default)(framer_motion_1.motion.div)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width: 100%;\n position: absolute;\n bottom: 0;\n background-color: ", ";\n\n ", " {\n border: 2px solid ", ";\n width: 50vw;\n position: relative;\n border-radius: 0.2rem;\n }\n"], ["\n width: 100%;\n position: absolute;\n bottom: 0;\n background-color: ", ";\n\n ", " {\n border: 2px solid ", ";\n width: 50vw;\n position: relative;\n border-radius: 0.2rem;\n }\n"])), white, (0, mixins_1.mediaQuery)("sm"), white);
39
+ exports.StyledModalConfirmContent = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n padding: 0 2rem 2rem 2rem;\n\n ", " {\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n padding: 0 3rem 3rem 3rem;\n }\n"], ["\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n padding: 0 2rem 2rem 2rem;\n\n ", " {\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n padding: 0 3rem 3rem 3rem;\n }\n"])), (0, mixins_1.mediaQuery)("sm"));
40
+ exports.StyledModalConfirmClose = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n width: 100%;\n display: flex;\n justify-content: flex-end;\n"], ["\n width: 100%;\n display: flex;\n justify-content: flex-end;\n"])));
41
+ exports.StyledModalConfirmContentSubtitle = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n margin-top: 0.5rem;\n"], ["\n margin-top: 0.5rem;\n"])));
42
+ exports.StyledFlexWrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n display: flex;\n justify-content: ", ";\n gap: 1rem;\n align-items: center;\n"], ["\n display: flex;\n justify-content: ", ";\n gap: 1rem;\n align-items: center;\n"])), function (_a) {
43
+ var alignActions = _a.alignActions;
44
+ return alignActions === "right" ? 'flex-end' : '';
45
+ });
46
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
@@ -25,7 +25,17 @@ var __importStar = (this && this.__importStar) || function (mod) {
25
25
  Object.defineProperty(exports, "__esModule", { value: true });
26
26
  exports.ModalConfirmAction = void 0;
27
27
  var react_1 = __importStar(require("react"));
28
- var ModalConfirm_1 = require("../ModalConfirm");
28
+ var ModalConfirm_1 = require("../../ModalConfirm");
29
+ /*
30
+ @description :
31
+ it is a wrapper comp for comps which have a onClick prop ex- button comps. When you click the button,
32
+ it shows a ModalConfirm comp asking for confirmation. If you say "yes" in the ModalConfirm, it does what the button was supposed to do in the first place.
33
+
34
+ VERY IMPORTANT : Wrapping a comp is not enough, the prop enable should be passed as true, which is by default false
35
+
36
+ Check the ModalConfirmAction.stories.js for component usage
37
+
38
+ */
29
39
  function ModalConfirmAction(_a) {
30
40
  var children = _a.children, _b = _a.enabled, enabled = _b === void 0 ? false : _b, _c = _a.title, title = _c === void 0 ? "Are you sure you want to do this action" : _c, subtitle = _a.subtitle, onConfirmText = _a.onConfirmText, onCloseText = _a.onCloseText;
31
41
  var _d = (0, react_1.useState)(false), modal = _d[0], setModal = _d[1];
@@ -0,0 +1,15 @@
1
+ export function ModalSmall({ title, onClose, invert, showActionPanel, onCloseText, onConfirm, onConfirmText, overflowVisible, fitToContentHeight, alignActions, desktopWidth, children }: {
2
+ title: any;
3
+ onClose: any;
4
+ invert: any;
5
+ showActionPanel: any;
6
+ onCloseText?: string;
7
+ onConfirm: any;
8
+ onConfirmText?: string;
9
+ overflowVisible?: boolean;
10
+ fitToContentHeight?: boolean;
11
+ alignActions?: string;
12
+ desktopWidth?: string;
13
+ children: any;
14
+ }): React.JSX.Element;
15
+ import React from "react";
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.ModalSmall = void 0;
7
+ var react_1 = __importDefault(require("react"));
8
+ var Modal_1 = require("../../Modal");
9
+ var ModalSmall = function (_a) {
10
+ var title = _a.title, onClose = _a.onClose, invert = _a.invert, showActionPanel = _a.showActionPanel, _b = _a.onCloseText, onCloseText = _b === void 0 ? "Close" : _b, onConfirm = _a.onConfirm, _c = _a.onConfirmText, onConfirmText = _c === void 0 ? "Confirm" : _c, _d = _a.overflowVisible, overflowVisible = _d === void 0 ? true : _d, _e = _a.fitToContentHeight, fitToContentHeight = _e === void 0 ? true : _e, _f = _a.alignActions, alignActions = _f === void 0 ? "right" : _f, _g = _a.desktopWidth, desktopWidth = _g === void 0 ? "50vw" : _g, children = _a.children;
11
+ return (react_1.default.createElement(Modal_1.Modal, { title: title, onClose: onClose, onCloseText: onCloseText, onConfirm: onConfirm, onConfirmText: onConfirmText, desktopWidth: desktopWidth, overflowVisible: overflowVisible, fitToContentHeight: fitToContentHeight, invert: invert, showActionPanel: showActionPanel, alignActions: alignActions, children: react_1.default.createElement("div", { style: { padding: "2rem" } }, children) }));
12
+ };
13
+ exports.ModalSmall = ModalSmall;
@@ -55,7 +55,7 @@ var RowActionsMenu = function (_a) {
55
55
  // cuz if an actionmenu is open we want it to continue showing
56
56
  // on screen irrespective of other factors such as hover and such
57
57
  return (conditionsToRender || actionMenuIsOpen) && (react_1.default.createElement("div", { style: {
58
- zIndex: 1,
58
+ zIndex: 2,
59
59
  position: "absolute",
60
60
  top: "50%",
61
61
  left: 0,
@@ -33,28 +33,38 @@ var transitions_1 = require("../../themes/mixins/transitions");
33
33
  var styled_components_1 = __importStar(require("styled-components"));
34
34
  var utilsOolib_1 = require("../../utilsOolib");
35
35
  var globalVariables_1 = require("../../globalStyles/globalVariables");
36
- exports.StyledSimpleTable = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-top: 1px solid ", ";\n \n border-left: 1px solid ", ";\n"], ["\n border-top: 1px solid ", ";\n \n border-left: 1px solid ", ";\n"])), themes_1.colors.greyColor10, themes_1.colors.greyColor10);
36
+ exports.StyledSimpleTable = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-top: 1px solid ", ";\n\n border-left: 1px solid ", ";\n"], ["\n border-top: 1px solid ", ";\n\n border-left: 1px solid ", ";\n"])), themes_1.colors.greyColor10, themes_1.colors.greyColor10);
37
37
  exports.StyledSimpleTableRow = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n min-height: 4rem;\n position: relative;\n display: flex;\n ", ";\n /* background-color: ", "; */\n ", "\n"], ["\n min-height: 4rem;\n position: relative;\n display: flex;\n ", ";\n /* background-color: ", "; */\n ", "\n"])), (0, transitions_1.transition)("background-color"), function (_a) {
38
38
  var rowIdx = _a.rowIdx;
39
39
  return rowIdx % 2 === 1 ? themes_1.colors.white : themes_1.colors.greyColor3;
40
40
  }, function (_a) {
41
41
  var actionsActiveOnRow = _a.actionsActiveOnRow, rowIdx = _a.rowIdx, theme = _a.theme;
42
- return actionsActiveOnRow === rowIdx && (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n &::before{\n content: '';\n position: absolute;\n width: calc(100% - 1px);\n height: calc(100% - 1px);\n outline: 1px solid ", ";\n border: 1px solid ", ";\n z-index: 1;\n }\n "], ["\n &::before{\n content: '';\n position: absolute;\n width: calc(100% - 1px);\n height: calc(100% - 1px);\n outline: 1px solid ", ";\n border: 1px solid ", ";\n z-index: 1;\n }\n "])), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors));
42
+ return actionsActiveOnRow === rowIdx && (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n &::before {\n content: \"\";\n position: absolute;\n width: calc(100% - 1px);\n height: calc(100% - 1px);\n outline: 1px solid ", ";\n border: 1px solid ", ";\n z-index: 1;\n }\n "], ["\n &::before {\n content: \"\";\n position: absolute;\n width: calc(100% - 1px);\n height: calc(100% - 1px);\n outline: 1px solid ", ";\n border: 1px solid ", ";\n z-index: 1;\n }\n "])), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors));
43
43
  });
44
44
  var genActiveColBorder = function (_a) {
45
45
  var actionsActiveOnCol = _a.actionsActiveOnCol, colIdx = _a.colIdx, rowIdx = _a.rowIdx, totRows = _a.totRows, theme = _a.theme;
46
46
  var isActiveCol = actionsActiveOnCol === colIdx;
47
47
  var isFirstRow = rowIdx === 0;
48
48
  var isLastRow = rowIdx === totRows - 1;
49
- return isActiveCol && (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n &::before{\n content: '';\n position: absolute;\n left: -1px;\n top: -1px;\n width: calc(100% + 2px);\n height: calc(100% + 2px);\n border: 2px solid ", ";\n z-index: 1;\n ", "\n }\n "], ["\n &::before{\n content: '';\n position: absolute;\n left: -1px;\n top: -1px;\n width: calc(100% + 2px);\n height: calc(100% + 2px);\n border: 2px solid ", ";\n z-index: 1;\n ", "\n }\n "])), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors), isFirstRow
50
- ? (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["border-bottom: none;"], ["border-bottom: none;"]))) : !isFirstRow && !isLastRow
51
- ? (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n border-bottom: none;\n border-top: none;\n "], ["\n border-bottom: none;\n border-top: none;\n "]))) : isLastRow && (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["border-top:none;"], ["border-top:none;"]))));
49
+ return (isActiveCol && (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n &::before {\n content: \"\";\n position: absolute;\n left: -1px;\n top: -1px;\n width: calc(100% + 2px);\n height: calc(100% + 2px);\n border: 2px solid ", ";\n z-index: 1;\n ", "\n }\n "], ["\n &::before {\n content: \"\";\n position: absolute;\n left: -1px;\n top: -1px;\n width: calc(100% + 2px);\n height: calc(100% + 2px);\n border: 2px solid ", ";\n z-index: 1;\n ", "\n }\n "])), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors), isFirstRow
50
+ ? (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n border-bottom: none;\n "], ["\n border-bottom: none;\n "]))) : !isFirstRow && !isLastRow
51
+ ? (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n border-bottom: none;\n border-top: none;\n "], ["\n border-bottom: none;\n border-top: none;\n "]))) : isLastRow && (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n border-top: none;\n "], ["\n border-top: none;\n "])))));
52
52
  };
53
- var tableCellStyling = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\nmin-height: 4rem;\n position: relative;\n border-right: 1px solid ", ";\n border-bottom: 1px solid ", ";\n ", ";\n \n ", "\n"], ["\nmin-height: 4rem;\n position: relative;\n border-right: 1px solid ", ";\n border-bottom: 1px solid ", ";\n ", ";\n \n ", "\n"])), themes_1.colors.greyColor10, themes_1.colors.greyColor10, (0, transitions_1.transition)("background-color"), function (_a) {
53
+ var tableCellStyling = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n min-height: 4rem;\n position: relative;\n border-right: 1px solid ", ";\n border-bottom: 1px solid ", ";\n ", ";\n\n ", ";\n\n ", "\n"], ["\n min-height: 4rem;\n position: relative;\n border-right: 1px solid ", ";\n border-bottom: 1px solid ", ";\n ", ";\n\n ", ";\n\n ", "\n"])), themes_1.colors.greyColor10, themes_1.colors.greyColor10, (0, transitions_1.transition)("background-color"), function (_a) {
54
+ var readOnly = _a.readOnly;
55
+ return readOnly && (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n cursor: default !important;\n "], ["\n cursor: default !important;\n "])));
56
+ }, function (_a) {
54
57
  var readOnly = _a.readOnly, theme = _a.theme, actionsActiveOnRow = _a.actionsActiveOnRow, actionsActiveOnCol = _a.actionsActiveOnCol, rowIdx = _a.rowIdx, totRows = _a.totRows, colIdx = _a.colIdx;
55
- return !readOnly && (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n ", ";\n \n ", "\n\n ", "\n "], ["\n ", ";\n \n ", "\n\n ", "\n "])), globalVariables_1.globalHoverOnWhiteBG, !actionsActiveOnRow && !actionsActiveOnCol && (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n :focus-within{\n &::before{\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n outline: 1px solid ", ";\n border: 1px solid ", ";\n }\n background-color: ", ";\n } \n "], ["\n :focus-within{\n &::before{\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n outline: 1px solid ", ";\n border: 1px solid ", ";\n }\n background-color: ", ";\n } \n "])), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors), themes_1.colors.none), genActiveColBorder({ theme: theme, actionsActiveOnCol: actionsActiveOnCol, rowIdx: rowIdx, totRows: totRows, colIdx: colIdx }));
58
+ return !readOnly && (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n ", ";\n\n ", "\n\n ", "\n "], ["\n ", ";\n\n ", "\n\n ", "\n "])), globalVariables_1.globalHoverOnWhiteBG, !actionsActiveOnRow &&
59
+ !actionsActiveOnCol && (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n :focus-within {\n &::before {\n content: \"\";\n position: absolute;\n width: 100%;\n height: 100%;\n outline: 1px solid ", ";\n border: 1px solid ", ";\n }\n background-color: ", ";\n }\n "], ["\n :focus-within {\n &::before {\n content: \"\";\n position: absolute;\n width: 100%;\n height: 100%;\n outline: 1px solid ", ";\n border: 1px solid ", ";\n }\n background-color: ", ";\n }\n "])), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors), themes_1.colors.none), genActiveColBorder({
60
+ theme: theme,
61
+ actionsActiveOnCol: actionsActiveOnCol,
62
+ rowIdx: rowIdx,
63
+ totRows: totRows,
64
+ colIdx: colIdx,
65
+ }));
56
66
  });
57
- exports.StyledSimpleTableCell = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), tableCellStyling);
58
- exports.StyledSimpleTableHeaderCell = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n .public-DraftEditor-content {\n font-weight: 600;\n }\n border-right: 2px solid ", ";\n"], ["\n ", "\n .public-DraftEditor-content {\n font-weight: 600;\n }\n border-right: 2px solid ", ";\n"])), tableCellStyling, themes_1.colors.greyColor10);
59
- exports.StyledSimpleTableHeader = styled_components_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n .public-DraftEditor-content {\n font-weight: 600;\n }\n border-bottom: 2px solid ", ";\n"], ["\n .public-DraftEditor-content {\n font-weight: 600;\n }\n border-bottom: 2px solid ", ";\n"])), themes_1.colors.greyColor10);
60
- 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, templateObject_13;
67
+ exports.StyledSimpleTableCell = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), tableCellStyling);
68
+ exports.StyledSimpleTableHeaderCell = styled_components_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n .public-DraftEditor-content {\n font-weight: 600;\n }\n background-color: ", ";\n border-right: 2px solid ", ";\n"], ["\n ", "\n .public-DraftEditor-content {\n font-weight: 600;\n }\n background-color: ", ";\n border-right: 2px solid ", ";\n"])), tableCellStyling, themes_1.colors.greyColor3, themes_1.colors.greyColor10);
69
+ exports.StyledSimpleTableHeader = styled_components_1.default.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n .public-DraftEditor-content {\n font-weight: 600;\n }\n background-color: ", ";\n border-bottom: 2px solid ", ";\n"], ["\n .public-DraftEditor-content {\n font-weight: 600;\n }\n background-color: ", ";\n border-bottom: 2px solid ", ";\n"])), themes_1.colors.greyColor3, themes_1.colors.greyColor10);
70
+ 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, templateObject_13, templateObject_14;
@@ -171,8 +171,8 @@ var TextInput = function (props) {
171
171
  : onBlur, onFocus: onFocus, size: size, autoComplete: "off" }),
172
172
  validationStatus === "loading" && (react_1.default.createElement("div", null,
173
173
  react_1.default.createElement(LoadersAndProgress_1.LoaderCircle, { S: true, invert: invert }))),
174
- clearBtn && (react_1.default.createElement(Buttons_1.ButtonGhost, { M: true, value: clearBtn.text, invert: clearBtn.invert, onClick: function () { return onChange(props.id, ""); }, disabled: !clearBtnEnabled, style: { marginRight: actionBtn ? "-1rem" : "-2rem" }, icon: clearBtn.icon })),
175
- actionBtn && (react_1.default.createElement(Buttons_1.ButtonPrimary, { M: true, value: actionBtn.text, invert: actionBtn.invert, onClick: actionBtnEnabaled && actionBtn.onClick, disabled: !actionBtnEnabaled, style: { marginRight: "-2rem" }, icon: actionBtn.icon }))),
174
+ clearBtn && (react_1.default.createElement(Buttons_1.ButtonGhost, { M: true, value: clearBtn.text, invert: clearBtn.invert, onClick: function () { return onChange(props.id, ""); }, disabled: !clearBtnEnabled, style: { marginRight: actionBtn ? "-1rem" : "-2rem" } })),
175
+ actionBtn && (react_1.default.createElement(Buttons_1.ButtonPrimary, { M: true, value: actionBtn.text, invert: actionBtn.invert, onClick: actionBtnEnabaled && actionBtn.onClick, disabled: !actionBtnEnabaled, style: { marginRight: "-2rem" } }))),
176
176
  (validationStatus === null || validationStatus === void 0 ? void 0 : validationStatus.msg) && (react_1.default.createElement(index_styled_1.MsgContainer, { invert: invert, status: validationStatus === null || validationStatus === void 0 ? void 0 : validationStatus.type },
177
177
  react_1.default.createElement(Typo_1.SANS_3, null,
178
178
  validationStatus.msg,
@@ -25,7 +25,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
25
25
  Object.defineProperty(exports, "__esModule", { value: true });
26
26
  exports.EmbedLinkModal = void 0;
27
27
  var react_1 = __importStar(require("react"));
28
- var ModalSmall_1 = require("../../Modals/ModalSmall");
28
+ var Modal_1 = require("../../Modals/Modal");
29
29
  var TextInputs_1 = require("../../TextInputs");
30
30
  var Paddings_1 = require("../../Paddings");
31
31
  var Buttons_1 = require("../../Buttons");
@@ -34,25 +34,26 @@ var EmbedLinkModal = function (_a) {
34
34
  var _b;
35
35
  var id = _a.id, setShowEmbedLinkModal = _a.setShowEmbedLinkModal, value = _a.value, createVideoPreview = _a.createVideoPreview, canPlay = _a.canPlay, onChange = _a.onChange, invert = _a.invert;
36
36
  var _c = (0, react_1.useState)(value), localValue = _c[0], setLocalValue = _c[1];
37
- return (react_1.default.createElement(ModalSmall_1.ModalSmall, { title: "Add URL Embed", subTitle: "Paste the link of the video you want to share. ",
37
+ return (react_1.default.createElement(Modal_1.Modal, { title: "Add URL Embed", subTitle: "Paste the link of the video you want to share. ",
38
38
  // invert={invert}
39
- onClose: function () {
39
+ desktopWidth: "50vw", fitToContentHeight: true, onClose: function () {
40
40
  setShowEmbedLinkModal(false);
41
41
  } },
42
- react_1.default.createElement(TextInputs_1.TextInput, { icon: "LinkSimple", onChange: function (k, v) { return setLocalValue(v ? [{ publicUrl: v }] : undefined); }, value: localValue && ((_b = localValue[0]) === null || _b === void 0 ? void 0 : _b.publicUrl), placeholder: "Paste a url here", clearBtn: { icon: 'X' } }),
43
- localValue && react_1.default.createElement(Paddings_1.PaddingBottom20, null),
44
- createVideoPreview({ value: localValue }),
45
- react_1.default.createElement(styled_1.StyledModalActionButtons, null,
46
- react_1.default.createElement(Buttons_1.ButtonPrimary, { value: "Embed", disabled: !canPlay(localValue) || !localValue,
47
- // invert={invert}
48
- onClick: function () {
49
- onChange(id, localValue);
50
- setShowEmbedLinkModal(false);
51
- } }),
52
- react_1.default.createElement(Buttons_1.ButtonGhost, { value: "Cancel",
53
- // invert={invert}
54
- onClick: function () {
55
- setShowEmbedLinkModal(false);
56
- } }))));
42
+ react_1.default.createElement("div", { style: { padding: '2rem' } },
43
+ react_1.default.createElement(TextInputs_1.TextInput, { icon: "LinkSimple", onChange: function (k, v) { return setLocalValue(v ? [{ publicUrl: v }] : undefined); }, value: localValue && ((_b = localValue[0]) === null || _b === void 0 ? void 0 : _b.publicUrl), placeholder: "Paste a url here", clearBtn: { text: 'clear' } }),
44
+ localValue && react_1.default.createElement(Paddings_1.PaddingBottom20, null),
45
+ createVideoPreview({ value: localValue }),
46
+ react_1.default.createElement(styled_1.StyledModalActionButtons, null,
47
+ react_1.default.createElement(Buttons_1.ButtonPrimary, { value: "Embed", disabled: !canPlay(localValue) || !localValue,
48
+ // invert={invert}
49
+ onClick: function () {
50
+ onChange(id, localValue);
51
+ setShowEmbedLinkModal(false);
52
+ } }),
53
+ react_1.default.createElement(Buttons_1.ButtonGhost, { value: "Cancel",
54
+ // invert={invert}
55
+ onClick: function () {
56
+ setShowEmbedLinkModal(false);
57
+ } })))));
57
58
  };
58
59
  exports.EmbedLinkModal = EmbedLinkModal;
package/dist/index.d.ts CHANGED
@@ -27,10 +27,10 @@ export { Accordion } from "./components/Accordion";
27
27
  export { PercentCompletedPie } from "./components/PercentCompletedPie";
28
28
  export { Divider } from "./components/Divider";
29
29
  export { SkeletonLoader } from "./components/LoadersAndProgress/SkeletonLoader";
30
- export { ModalConfirm } from "./components/Modals/derivedComps/ModalConfirm";
30
+ export { ModalConfirm } from "./components/Modals/ModalConfirm";
31
31
  export { ModalForms } from "./components/Modals/derivedComps/ModalForms";
32
32
  export { Modal } from "./components/Modals/Modal";
33
- export { ModalSmall } from "./components/Modals/ModalSmall";
33
+ export { ModalSmall } from "./components/Modals/derivedComps/ModalSmall";
34
34
  export { EmptyStates } from "./components/EmptyStates";
35
35
  export { HomeCover } from "./components/HomeCover";
36
36
  export { PageScrollIndicator } from "./components/PageScrollIndicator";
package/dist/index.js CHANGED
@@ -68,13 +68,13 @@ var Divider_1 = require("./components/Divider");
68
68
  Object.defineProperty(exports, "Divider", { enumerable: true, get: function () { return Divider_1.Divider; } });
69
69
  var SkeletonLoader_1 = require("./components/LoadersAndProgress/SkeletonLoader");
70
70
  Object.defineProperty(exports, "SkeletonLoader", { enumerable: true, get: function () { return SkeletonLoader_1.SkeletonLoader; } });
71
- var ModalConfirm_1 = require("./components/Modals/derivedComps/ModalConfirm");
71
+ var ModalConfirm_1 = require("./components/Modals/ModalConfirm");
72
72
  Object.defineProperty(exports, "ModalConfirm", { enumerable: true, get: function () { return ModalConfirm_1.ModalConfirm; } });
73
73
  var ModalForms_1 = require("./components/Modals/derivedComps/ModalForms");
74
74
  Object.defineProperty(exports, "ModalForms", { enumerable: true, get: function () { return ModalForms_1.ModalForms; } });
75
75
  var Modal_1 = require("./components/Modals/Modal");
76
76
  Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return Modal_1.Modal; } });
77
- var ModalSmall_1 = require("./components/Modals/ModalSmall");
77
+ var ModalSmall_1 = require("./components/Modals/derivedComps/ModalSmall");
78
78
  Object.defineProperty(exports, "ModalSmall", { enumerable: true, get: function () { return ModalSmall_1.ModalSmall; } });
79
79
  var EmptyStates_1 = require("./components/EmptyStates");
80
80
  Object.defineProperty(exports, "EmptyStates", { enumerable: true, get: function () { return EmptyStates_1.EmptyStates; } });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oolib",
3
- "version": "2.89.1",
3
+ "version": "2.90.0",
4
4
  "description": " OKE Component Library",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -1,6 +0,0 @@
1
- export function ModalSmall({ title, subTitle, onClose, children }: {
2
- title: any;
3
- subTitle: any;
4
- onClose: any;
5
- children: any;
6
- }): any;
@@ -1,5 +0,0 @@
1
- export const StyledModalSmall: import("styled-components").StyledComponent<any, any, object, string | number | symbol>;
2
- export const StyledModalSmallContentWrapper: import("styled-components").StyledComponent<any, any, object, string | number | symbol>;
3
- export const StyledModalSmallContent: import("styled-components").StyledComponent<"div", any, {}, never>;
4
- export const StyledModalSmallClose: import("styled-components").StyledComponent<"div", any, {}, never>;
5
- export const StyledModalSmallContentSubtitle: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -1,42 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
- if (k2 === undefined) k2 = k;
8
- var desc = Object.getOwnPropertyDescriptor(m, k);
9
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
10
- desc = { enumerable: true, get: function() { return m[k]; } };
11
- }
12
- Object.defineProperty(o, k2, desc);
13
- }) : (function(o, m, k, k2) {
14
- if (k2 === undefined) k2 = k;
15
- o[k2] = m[k];
16
- }));
17
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
18
- Object.defineProperty(o, "default", { enumerable: true, value: v });
19
- }) : function(o, v) {
20
- o["default"] = v;
21
- });
22
- var __importStar = (this && this.__importStar) || function (mod) {
23
- if (mod && mod.__esModule) return mod;
24
- var result = {};
25
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
26
- __setModuleDefault(result, mod);
27
- return result;
28
- };
29
- Object.defineProperty(exports, "__esModule", { value: true });
30
- exports.StyledModalSmallContentSubtitle = exports.StyledModalSmallClose = exports.StyledModalSmallContent = exports.StyledModalSmallContentWrapper = exports.StyledModalSmall = void 0;
31
- var mixins_1 = require("../../../themes/mixins");
32
- var themes_1 = require("../../../themes");
33
- var framer_motion_1 = require("framer-motion");
34
- var styled_components_1 = __importStar(require("styled-components"));
35
- var white = themes_1.colors.white, greyColor100_opacity70 = themes_1.colors.greyColor100_opacity70;
36
- var ModalStyles = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n position: fixed;\n top: 0;\n left: 0;\n background: ", ";\n z-index: 999999999;\n"], ["\n width: 100%;\n height: 100%;\n position: fixed;\n top: 0;\n left: 0;\n background: ", ";\n z-index: 999999999;\n"])), greyColor100_opacity70);
37
- exports.StyledModalSmall = (0, styled_components_1.default)(framer_motion_1.motion.div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n\n ", " {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"], ["\n ", "\n\n ", " {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])), ModalStyles, (0, mixins_1.mediaQuery)("sm"));
38
- exports.StyledModalSmallContentWrapper = (0, styled_components_1.default)(framer_motion_1.motion.div)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width: 100%;\n position: absolute;\n bottom: 0;\n background-color: ", ";\n\n ", " {\n border: 2px solid ", ";\n width: 50vw;\n position: relative;\n border-radius: 0.2rem;\n }\n"], ["\n width: 100%;\n position: absolute;\n bottom: 0;\n background-color: ", ";\n\n ", " {\n border: 2px solid ", ";\n width: 50vw;\n position: relative;\n border-radius: 0.2rem;\n }\n"])), white, (0, mixins_1.mediaQuery)("sm"), white);
39
- exports.StyledModalSmallContent = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n padding: 0 2rem 2rem 2rem;\n\n ", " {\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n padding: 0 3rem 3rem 3rem;\n }\n"], ["\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n padding: 0 2rem 2rem 2rem;\n\n ", " {\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n padding: 0 3rem 3rem 3rem;\n }\n"])), (0, mixins_1.mediaQuery)("sm"));
40
- exports.StyledModalSmallClose = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n width: 100%;\n display: flex;\n justify-content: flex-end;\n"], ["\n width: 100%;\n display: flex;\n justify-content: flex-end;\n"])));
41
- exports.StyledModalSmallContentSubtitle = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n margin-top: 0.5rem;\n"], ["\n margin-top: 0.5rem;\n"])));
42
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
@@ -1,11 +0,0 @@
1
- export function ModalConfirm({ title, subTitle, onClose, onCloseText, children, onConfirm, onConfirmText, alignActions }: {
2
- title: any;
3
- subTitle: any;
4
- onClose: any;
5
- onCloseText?: string;
6
- children: any;
7
- onConfirm: any;
8
- onConfirmText?: string;
9
- alignActions?: string;
10
- }): React.JSX.Element;
11
- import React from "react";
@@ -1,38 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __assign = (this && this.__assign) || function () {
7
- __assign = Object.assign || function(t) {
8
- for (var s, i = 1, n = arguments.length; i < n; i++) {
9
- s = arguments[i];
10
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
- t[p] = s[p];
12
- }
13
- return t;
14
- };
15
- return __assign.apply(this, arguments);
16
- };
17
- var __importDefault = (this && this.__importDefault) || function (mod) {
18
- return (mod && mod.__esModule) ? mod : { "default": mod };
19
- };
20
- Object.defineProperty(exports, "__esModule", { value: true });
21
- exports.ModalConfirm = void 0;
22
- var react_1 = __importDefault(require("react"));
23
- var styled_components_1 = __importDefault(require("styled-components"));
24
- var Buttons_1 = require("../../../Buttons");
25
- var ModalSmall_1 = require("../../ModalSmall");
26
- var StyledFlexWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n justify-content: ", ";\n gap: 1rem;\n align-items: center;\n"], ["\n display: flex;\n justify-content: ", ";\n gap: 1rem;\n align-items: center;\n"])), function (_a) {
27
- var alignActions = _a.alignActions;
28
- return alignActions === "right" ? 'flex-end' : '';
29
- });
30
- var ModalConfirm = function (_a) {
31
- var title = _a.title, subTitle = _a.subTitle, onClose = _a.onClose, _b = _a.onCloseText, onCloseText = _b === void 0 ? "Cancel" : _b, children = _a.children, onConfirm = _a.onConfirm, _c = _a.onConfirmText, onConfirmText = _c === void 0 ? "Delete" : _c, _d = _a.alignActions, alignActions = _d === void 0 ? "left" : _d;
32
- return (react_1.default.createElement(ModalSmall_1.ModalSmall, __assign({}, { title: title, subTitle: subTitle, onClose: onClose, children: children }),
33
- react_1.default.createElement(StyledFlexWrapper, { alignActions: alignActions },
34
- react_1.default.createElement(Buttons_1.ButtonPrimary, { onClick: onConfirm }, onConfirmText),
35
- react_1.default.createElement(Buttons_1.ButtonSecondary, { onClick: onClose }, onCloseText))));
36
- };
37
- exports.ModalConfirm = ModalConfirm;
38
- var templateObject_1;