@ludo.ninja/components 2.3.82 → 2.3.84

package/build/modules/opportunity/OpportunityDropDown.js

@@ -34,7 +34,7 @@ const OpportunityDropDown = ({ opportunity }) => {
     // };
     const onShareClick = (event) => {
         event.preventDefault();
-        openModalSidebarPortal((0, jsx_runtime_1.jsx)(OpportunityMenu_1.OpportunityMenu, { opportunity: opportunity, onClose: closeModalSidebarPortal }));
+        openModalSidebarPortal((0, jsx_runtime_1.jsx)(OpportunityMenu_1.OpportunityMenu, { opportunity: opportunity, onClose: closeModalSidebarPortal }), true);
     };
     const onReportClick = () => {
         const opportunityId = opportunity.opportunityId ? `ID: ${opportunity.opportunityId}` : "";

package/build/store/ui/index.js

@@ -101,6 +101,7 @@ exports.useUiStore = (0, traditional_1.createWithEqualityFn)()((setState) => ({
     //modals
     contentModals: null,
     stylesModals: null,
+    modalWithoutCloseIcon: false,
     addStylesModals: (styles) => {
         setState({ stylesModals: styles });
     },

package/build/store/ui/types.d.ts

@@ -24,12 +24,13 @@ export interface IUiStore {
     stylesModals: null | CSSProperties;
     addStylesModals: (styles: CSSProperties) => void;
     isModalOpen: boolean;
-    openModal: (component: JSX.Element) => void;
+    openModal: (component: JSX.Element, withoutCloseIcon?: boolean) => void;
     closeModal: () => void;
     isModalSidebarOpen: boolean;
-    openModalSidebar: (component: JSX.Element) => void;
+    openModalSidebar: (component: JSX.Element, withoutCloseIcon?: boolean) => void;
     closeModalSidebar: () => void;
     isOpenModalSidebarPortal: boolean;
-    openModalSidebarPortal: (component: JSX.Element) => void;
+    modalWithoutCloseIcon: boolean;
+    openModalSidebarPortal: (component: JSX.Element, withoutCloseIcon?: boolean) => void;
     closeModalSidebarPortal: () => void;
 }

package/build/store/ui/utils.js

@@ -4,12 +4,13 @@ exports.builderModal = void 0;
 const utils_1 = require("@ludo.ninja/utils");
 const builderModal = (fields, setState) => ({
     [fields.trigger]: false,
-    [fields.opener]: (component) => {
+    [fields.opener]: (component, withoutCloseIcon) => {
         (0, utils_1.rootAddOverflow)();
         setState({
             contentModals: component,
             isOverlayActive: true,
             [fields.trigger]: true,
+            modalWithoutCloseIcon: Boolean(withoutCloseIcon)
         });
     },
     [fields.closer]: () => {

package/build/system/Cards/CardContent/CardShowMore/index.js

@@ -18,8 +18,11 @@ const moreBtnVertical_svg_1 = __importDefault(require("../../../../public/creati
 const colors_2 = require("@ludo.ninja/ui/build/styles/colors");
 // Styles
 exports.StyledCardShowMore = styled_components_1.default.div `
+  flex-grow: 1;
+  text-align: end;
   .cardShowMore {
     position: relative;
+    display: inline-block;
     cursor: pointer;
     z-index: 100;
     svg {

package/build/system/Modals/Modal/index.js

@@ -36,10 +36,15 @@ const StyledModal = styled_components_1.default.div `
     .modalContent {
       max-height: calc(var(--app-height) - 20px - 16px - 16px - 24px);
       overflow-y: auto;
+      margin-top: 14px !important
+    }
+    .modalCloseIcon {
+      display: inline-block !important;
     }
   }
 
   .modalCloseIcon {
+    display: ${({ withoutCloseIcon }) => withoutCloseIcon ? 'none' : 'inline-block'};
     position: absolute;
     top: 16px;
     right: 16px;
@@ -47,7 +52,7 @@ const StyledModal = styled_components_1.default.div `
   }
 
   .modalContent {
-    margin-top: 24px;
+    margin-top: ${({ withoutCloseIcon }) => withoutCloseIcon ? 'unset' : '24px'};
   }
 
   ${ScreenWidth_1.mediaQuery.minWidthFourK} {
@@ -69,14 +74,15 @@ const StyledModal = styled_components_1.default.div `
   }
 `;
 const Modal = () => {
-    const { contentModals, isModalOpen, closeModal, stylesModals } = (0, ui_1.useUiStore)((state) => ({
+    const { contentModals, isModalOpen, closeModal, stylesModals, withoutCloseIcon } = (0, ui_1.useUiStore)((state) => ({
         contentModals: state.contentModals,
         stylesModals: state.stylesModals,
         isModalOpen: state.isModalOpen,
         closeModal: state.closeModal,
+        withoutCloseIcon: state.modalWithoutCloseIcon,
     }));
     if (!isModalOpen)
         return null;
-    return ((0, jsx_runtime_1.jsxs)(StyledModal, { style: stylesModals ? stylesModals : undefined, children: [(0, jsx_runtime_1.jsx)("img", { src: `${constants_1.staticLink}/public/modal/close.svg`, alt: "close", width: 24, height: 24, className: "modalCloseIcon", onClick: closeModal }), (0, jsx_runtime_1.jsx)("div", { className: "modalContent", children: contentModals })] }));
+    return ((0, jsx_runtime_1.jsxs)(StyledModal, { style: stylesModals ? stylesModals : undefined, withoutCloseIcon: withoutCloseIcon, children: [(0, jsx_runtime_1.jsx)("img", { src: `${constants_1.staticLink}/public/modal/close.svg`, alt: "close", width: 24, height: 24, className: "modalCloseIcon", onClick: closeModal }), (0, jsx_runtime_1.jsx)("div", { className: "modalContent", children: contentModals })] }));
 };
 exports.default = Modal;

package/build/system/Modals/ModalSidebar/CreatorModalSidebarPortal.js

@@ -34,14 +34,15 @@ const ui_1 = require("../../../store/ui");
 const ModalSidebarPortal = (0, dynamic_1.default)(() => Promise.resolve().then(() => __importStar(require('./ModalSidebarPortal'))).then((_) => _.ModalSidebarPortal));
 // minimize dom tree for optimize virtualization
 const CreatorModalSidebarPortal = () => {
-    const { isOpenModalSidebarPortal, closeModalSidebarPortal, contentModals } = (0, ui_1.useUiStore)((state) => ({
+    const { isOpenModalSidebarPortal, closeModalSidebarPortal, contentModals, withoutCloseIcon } = (0, ui_1.useUiStore)((state) => ({
         isOpenModalSidebarPortal: state.isOpenModalSidebarPortal,
         closeModalSidebarPortal: state.closeModalSidebarPortal,
         contentModals: state.contentModals,
+        withoutCloseIcon: state.modalWithoutCloseIcon,
     }));
     if (!isOpenModalSidebarPortal) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsx)(ModalSidebarPortal, { closeModal: closeModalSidebarPortal, component: contentModals }));
+    return ((0, jsx_runtime_1.jsx)(ModalSidebarPortal, { closeModal: closeModalSidebarPortal, component: contentModals, withoutCloseIcon: withoutCloseIcon }));
 };
 exports.CreatorModalSidebarPortal = CreatorModalSidebarPortal;

package/build/system/Modals/ModalSidebar/ModalSidebarPortal.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode } from "react";
-export declare const ModalSidebarPortal: ({ component, closeModal }: {
+export declare const ModalSidebarPortal: ({ component, closeModal, withoutCloseIcon, }: {
     component: ReactNode;
     closeModal: () => void;
+    withoutCloseIcon?: boolean;
 }) => import("react/jsx-runtime").JSX.Element;

package/build/system/Modals/ModalSidebar/ModalSidebarPortal.js

@@ -6,5 +6,5 @@ const index_1 = require("./index");
 const constants_1 = require("@ludo.ninja/core/build/constants");
 const utils_1 = require("@ludo.ninja/utils");
 // minimize dom tree for optimize virtualization
-const ModalSidebarPortal = ({ component, closeModal }) => ((0, jsx_runtime_1.jsx)(utils_1.PortalCreator, { children: (0, jsx_runtime_1.jsxs)(index_1.StyledModalSidebar, { children: [(0, jsx_runtime_1.jsx)("img", { src: `${constants_1.staticLink}/public/modal/close.svg`, alt: "close", width: 24, height: 24, className: "modalCloseIcon", onClick: closeModal }), (0, jsx_runtime_1.jsx)("div", { className: "modalContent", children: component })] }) }));
+const ModalSidebarPortal = ({ component, closeModal, withoutCloseIcon, }) => ((0, jsx_runtime_1.jsx)(utils_1.PortalCreator, { children: (0, jsx_runtime_1.jsxs)(index_1.StyledModalSidebar, { withoutCloseIcon: withoutCloseIcon, children: [(0, jsx_runtime_1.jsx)("img", { src: `${constants_1.staticLink}/public/modal/close.svg`, alt: "close", width: 24, height: 24, className: "modalCloseIcon", onClick: closeModal }), (0, jsx_runtime_1.jsx)("div", { className: "modalContent", children: component })] }) }));
 exports.ModalSidebarPortal = ModalSidebarPortal;

package/build/system/Modals/ModalSidebar/index.d.ts

@@ -1,3 +1,5 @@
-export declare const StyledModalSidebar: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledModalSidebar: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    withoutCloseIcon?: boolean;
+}, never>;
 declare const ModalSidebar: () => import("react/jsx-runtime").JSX.Element | null;
 export default ModalSidebar;

package/build/system/Modals/ModalSidebar/index.js

@@ -33,9 +33,16 @@ exports.StyledModalSidebar = styled_components_1.default.div `
     right: 0;
     bottom: 0;
     transform: none;
+    .modalCloseIcon {
+      display: inline-block !important;
+    }
+    .modalContent {
+        margin-top: 14px !important;};
+    }
   }
 
   .modalCloseIcon {
+    display: ${({ withoutCloseIcon }) => withoutCloseIcon ? 'none' : 'inline-block'};
     position: absolute;
     top: 16px;
     right: 16px;
@@ -43,7 +50,7 @@ exports.StyledModalSidebar = styled_components_1.default.div `
   }
 
   .modalContent {
-    margin-top: 24px;
+    margin-top: ${({ withoutCloseIcon }) => withoutCloseIcon ? 'unset' : '24px'};
   }
 
   ${ScreenWidth_1.mediaQuery.minWidthFourK} {
@@ -63,13 +70,14 @@ exports.StyledModalSidebar = styled_components_1.default.div `
   }
 `;
 const ModalSidebar = () => {
-    const { contentModals, isModalSidebarOpen, closeModalSidebar } = (0, ui_1.useUiStore)((state) => ({
+    const { contentModals, isModalSidebarOpen, closeModalSidebar, withoutCloseIcon } = (0, ui_1.useUiStore)((state) => ({
         contentModals: state.contentModals,
         isModalSidebarOpen: state.isModalSidebarOpen,
         closeModalSidebar: state.closeModalSidebar,
+        withoutCloseIcon: state.modalWithoutCloseIcon,
     }));
     if (!isModalSidebarOpen)
         return null;
-    return ((0, jsx_runtime_1.jsxs)(exports.StyledModalSidebar, { children: [(0, jsx_runtime_1.jsx)("img", { src: `${constants_1.staticLink}/public/modal/close.svg`, alt: "close", width: 24, height: 24, className: "modalCloseIcon", onClick: closeModalSidebar }), (0, jsx_runtime_1.jsx)("div", { className: "modalContent", children: contentModals })] }));
+    return ((0, jsx_runtime_1.jsxs)(exports.StyledModalSidebar, { withoutCloseIcon: withoutCloseIcon, children: [(0, jsx_runtime_1.jsx)("img", { src: `${constants_1.staticLink}/public/modal/close.svg`, alt: "close", width: 24, height: 24, className: "modalCloseIcon", onClick: closeModalSidebar }), (0, jsx_runtime_1.jsx)("div", { className: "modalContent", children: contentModals })] }));
 };
 exports.default = ModalSidebar;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ludo.ninja/components",
-  "version": "2.3.82",
+  "version": "2.3.84",
   "private": false,
   "main": "build/index.js",
   "types": "build/index.d.ts",