@omniumretail/component-library 1.2.41 → 1.2.43

package/dist/main.css

@@ -32,4 +32,4 @@
 .OJKeuXyOSPIeCCssVum2{display:flex;gap:32px}.jzxszvL7wzCV5nztJL0S{padding:12px}.OGA8oJw8RDyohcRftjmo{width:100%}.y2_7QVPOhjRZlAHCRWKf{display:grid;grid-template-columns:minmax(200px, 1fr) auto auto auto auto;gap:46px}.Smkcs3LGp1uPuQge2GxE{margin-top:16px}Label{margin-bottom:8px}.djarlYFkE9Kb7wUjUnrY{height:36px}
 :root{--color-grey: #e4e4e4;--color-grey-100: #E5E5E5}.SF5f_Q_Ggz_4JHUHS2Xa{display:flex;align-items:center;padding:13px 20px;box-sizing:border-box;height:72px}.SF5f_Q_Ggz_4JHUHS2Xa *{box-sizing:border-box}.gSVYvBn1sLbcMsGI32b9{display:flex;flex-grow:1;align-items:flex-end;justify-content:center;max-width:calc(100% - 60px)}.gSVYvBn1sLbcMsGI32b9 img{max-width:196px}.gSVYvBn1sLbcMsGI32b9 .fVSt3bSZBcJGsOdA5nIN{font-weight:var(--font-weight-semibold);text-transform:uppercase;color:var(--color-black)}.BIBQmS_NwoMw2Ncq5yuN{cursor:pointer;padding:4px 4px 4px 0;font-size:20px;width:30px;display:flex;align-items:center;justify-content:center}.ZinSgUtysxITkbGRKdux{position:fixed;top:0;left:-100%;bottom:0;width:100%;max-width:430px;background-color:var(--color-white);padding-inline:15px;z-index:999;box-shadow:0 3px 12px rgba(0,0,0,.45);transition:.6s ease-out}.ZinSgUtysxITkbGRKdux.FW1pOdad0uN5LO9h5PgQ{left:0;transition:.3s ease-in}.ZfA8OEmbRzRsNqLAmdtn{background-color:rgba(0,0,0,.3);backdrop-filter:blur(1px);position:absolute;left:0;top:0;right:0;bottom:0;z-index:998;pointer-events:none;opacity:0;transition:.3s}.ZfA8OEmbRzRsNqLAmdtn.FW1pOdad0uN5LO9h5PgQ{opacity:1;pointer-events:all}.YKSQJmdRP_7tKwvQpeuV{width:calc(100% + 30px);margin-left:-15px;background-color:var(--color-orange);display:flex;align-items:center;justify-content:center}.ISssYC5Uz452JVWP0xDc img{max-width:160px}.E6YZPpa60LxA7qqIW7jQ{position:absolute;top:23px;right:15px;font-size:25px;cursor:pointer;color:var(--color-white)}.YYp3pzktjEDEyW8knAZQ{overflow-y:auto;height:calc(100% - 51px);margin:0;padding:0}.u7k2VQ30AQDk6mKA22GX{height:60px;padding:10px;display:flex;align-items:center;border-bottom:1px solid var(--color-black);cursor:pointer;transition:.3s;text-transform:uppercase;width:100%}.u7k2VQ30AQDk6mKA22GX:hover{background-color:var(--color-grey);color:var(--color-black)}.QQoDB9XPcAK18l2DIym4{list-style:none}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN{height:auto;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding-bottom:0}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX{position:relative}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .NytmT59TmaWHc4FLM2wa{position:absolute;width:60px;height:100%;background:var(--color-black);right:0;display:flex;align-items:center;justify-content:center}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .NytmT59TmaWHc4FLM2wa:hover{background-color:var(--color-orange)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .zo7CFksIKx7Fahu4e4S_{color:var(--color-white)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E{background:var(--color-grey)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E .NytmT59TmaWHc4FLM2wa{background-color:var(--color-orange)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E .uLgjMU9sbvfaa0qKEguP{height:auto;opacity:1}.uLgjMU9sbvfaa0qKEguP{padding:0;width:100%;margin:0;background-color:var(--color-orange);color:var(--color-white);height:0;opacity:0;overflow:hidden;transition:height .3s ease,opacity .3s ease}.uLgjMU9sbvfaa0qKEguP .u7k2VQ30AQDk6mKA22GX{min-height:60px;height:auto;padding-inline:40px}.efnjUnudkE0UTVQ6wrgH{cursor:pointer}.u7k2VQ30AQDk6mKA22GX .fjNRYZMP1O0pTvBDBB3L span{margin-left:8px;transform:translateY(-2px);display:inline-block;font-size:var(--font-size-body-3);text-transform:capitalize}
 @media(max-width: 768px){.muC1BdCbIEMIs70EtJoA{position:unset}}.msELhnfhfo6un3c4Spoc{max-width:300px;max-height:400px;padding:0 !important}@media(max-width: 768px){.msELhnfhfo6un3c4Spoc{max-width:100vw}}@media(min-width: 1024px){.msELhnfhfo6un3c4Spoc{max-width:600px;max-height:700px}}@media(max-width: 768px){.oGsIq0O_Hzwg2mLR72la{position:absolute}}.KSVguXBQ_A1SUSR6e8Wq{overflow-y:auto;max-height:calc(100vh - 60px - 72px - 43px)}.GeNg2HVTmhQDmsLLTpWj{display:flex;flex-direction:column;align-items:unset !important;padding:10px;border-bottom:1px solid #f0f0f0;background-color:#fff !important;cursor:pointer}.GeNg2HVTmhQDmsLLTpWj:hover{background-color:#f9f9f9}@media(max-width: 768px){.GeNg2HVTmhQDmsLLTpWj{padding:8px}}.GBb48KXbGnQtAY8xqmUp{display:flex;justify-content:space-between;align-items:center;padding:10px;background-color:#f5f5f5;border-bottom:1px solid #e8e8e8}.LoCH7sYpmK3VgRASqTgz{font-size:20px;cursor:pointer;color:#595959}.Xjs10kZPSsD_BVFomnIe{color:#ff674c;margin-right:8px}.oibCayv_cOyhyWCKzHSr{display:flex;align-items:center;gap:10px}.oibCayv_cOyhyWCKzHSr span{font-size:14px;font-weight:500;color:#595959}.hhwYXSd0CR75D8ETnUML{display:flex;align-items:center;position:relative;padding-left:12px}@media(max-width: 768px){.hhwYXSd0CR75D8ETnUML{padding-left:8px}}.LkP1cqeAyAYI9rCurnE8{position:absolute;left:0;top:50%;transform:translateY(-50%);font-size:16px}@media(max-width: 768px){.LkP1cqeAyAYI9rCurnE8{font-size:12px}}.u_jT9kmq2kyThRlj8HT1{width:50px;height:50px;margin-left:10px;margin-right:10px}@media(max-width: 768px){.u_jT9kmq2kyThRlj8HT1{width:40px;height:40px;margin-left:8px;margin-right:8px}}.ieGdf5FTgLUPcfuZi7Xz{flex:1;overflow:hidden}.QgZ3oHW9IRTexL8xWVqP{font-weight:bold;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;max-width:100%}@media(max-width: 768px){.QgZ3oHW9IRTexL8xWVqP{font-size:12px}}.JwfbSOSIRAz5OO2hiSFc{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;max-width:100%;font-size:12px;color:#666;margin-top:2px}@media(max-width: 768px){.JwfbSOSIRAz5OO2hiSFc{font-size:10px}}.XfXQBYqMfZc4p8s2Mhla{width:6px;height:6px;background-color:#1890ff;border-radius:50%;margin-left:10px}@media(max-width: 768px){.XfXQBYqMfZc4p8s2Mhla{width:4px;height:4px;margin-left:8px}}.RGXTlVxCxbZpD6__J5_g{font-size:12px}.rWa5cnbZQLDtxFxJU6qA{font-size:20px;cursor:pointer}@media(max-width: 768px){.rWa5cnbZQLDtxFxJU6qA{font-size:18px}}.Pus_rAoqX05D4Qz2pYxo{animation:Pus_rAoqX05D4Qz2pYxo 1s ease-in-out infinite}@keyframes Pus_rAoqX05D4Qz2pYxo{0%{transform:rotate(0deg)}25%{transform:rotate(10deg)}50%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}100%{transform:rotate(0deg)}}
-.rUOcBpTPxrzfRw36v939{display:flex;align-items:center;width:100%;margin:16px 0;box-sizing:border-box}.rUOcBpTPxrzfRw36v939 .ant-descriptions{width:calc(100vw - 24px)}.rUOcBpTPxrzfRw36v939 .ant-descriptions-item-label{max-width:140px !important;padding:8px 16px !important;color:var(--color-blue) !important;font-weight:700 !important;font-size:12px !important}.rUOcBpTPxrzfRw36v939 .ant-descriptions-item-content{padding:8px 16px !important;font-size:12px !important}.cyz9pmVdkD7z1n7QUlfu{width:100vw !important;max-width:100vw !important}.PQ794lq3KZF_sigL5bbI{overflow:hidden !important}.PQ794lq3KZF_sigL5bbI .ant-modal .ant-modal-body{overflow-y:auto;overflow-x:hidden;max-height:80vh}.PQ794lq3KZF_sigL5bbI .ant-modal .ant-modal-content{padding:20px 12px !important}.PQ794lq3KZF_sigL5bbI .ant-modal-header{text-align:center !important}.PQ794lq3KZF_sigL5bbI .ant-modal-close{color:var(--button-default-background-hover-color)}.b23UIWngPXOEh5FC2mcC{display:flex;justify-content:center}.b23UIWngPXOEh5FC2mcC.DEfmwZ5CmWvodIcPVgfo{justify-content:space-between}.lIEwxxVD_vq2cGux3ehI{color:var(--button-default-background);font-size:26px}.ckRiBia09XQRtMVbNqvy{color:#c7cac9;pointer-events:none}
+.rUOcBpTPxrzfRw36v939{display:flex;align-items:center;width:100%;margin:16px 0;box-sizing:border-box}.rUOcBpTPxrzfRw36v939 .ant-descriptions{width:calc(100vw - 24px)}.rUOcBpTPxrzfRw36v939 .ant-descriptions-item-label{max-width:140px !important;padding:8px 16px !important;color:var(--color-blue) !important;font-weight:700 !important;font-size:12px !important}.rUOcBpTPxrzfRw36v939 .ant-descriptions-item-content{padding:8px 16px !important;font-size:12px !important}.cyz9pmVdkD7z1n7QUlfu{width:100vw !important;max-width:100vw !important;padding:0px 12px}.PQ794lq3KZF_sigL5bbI{overflow:hidden !important}.PQ794lq3KZF_sigL5bbI .ant-modal .ant-modal-body{overflow-y:auto;overflow-x:hidden;max-height:80vh}.PQ794lq3KZF_sigL5bbI .ant-modal .ant-modal-content{padding:20px 12px !important}.PQ794lq3KZF_sigL5bbI .ant-modal-header{text-align:center !important}.PQ794lq3KZF_sigL5bbI .ant-modal-close{color:var(--button-default-background-hover-color)}.b23UIWngPXOEh5FC2mcC{display:flex;justify-content:center}.b23UIWngPXOEh5FC2mcC.DEfmwZ5CmWvodIcPVgfo{justify-content:space-between}.lIEwxxVD_vq2cGux3ehI{color:var(--button-default-background);font-size:26px}.ckRiBia09XQRtMVbNqvy{color:#c7cac9;pointer-events:none}

package/dist/types/components/MobileTable/MobileTable.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, Story } from "@storybook/react";
+import { MobileTableProps } from '.';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Primary: Story<MobileTableProps>;

package/dist/types/components/MobileTable/index.d.ts

@@ -4,14 +4,14 @@ interface Action {
     label: string;
     onClick: () => void;
 }
-interface MobileTableProps {
+export interface MobileTableProps {
     data: Record<string, any>;
     translation: string;
     modalVisible: boolean;
     setModalVisible: Dispatch<SetStateAction<boolean>>;
-    actions: Action[];
     title: string;
     hasArrows?: boolean;
+    actions?: Action[];
     handlePrev?: () => void;
     handleNext?: () => void;
     hiddenColumns?: string[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omniumretail/component-library",
-  "version": "1.2.41",
+  "version": "1.2.43",
   "private": false,
   "main": "dist/bundle.js",
   "typings": "./dist/types/index",

package/src/components/MobileTable/MobileTable.stories.tsx

@@ -0,0 +1,27 @@
+import { Meta, Story } from "@storybook/react";
+import { useEffect, useState } from "react";
+import { MobileTable, MobileTableProps } from '.';
+
+export default {
+    title: 'MobileTable',
+    component: MobileTable,
+} as Meta;
+
+const Template: Story<MobileTableProps> = (args) => {
+    const [modalData, setModalData] = useState<any>({});
+    const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
+
+
+
+    
+    return (
+    <>
+        <MobileTable {...args}></MobileTable>
+    </>
+    )
+}
+
+export const Primary = Template.bind({});
+Primary.args = {
+
+};

package/src/components/MobileTable/index.tsx

@@ -15,14 +15,14 @@ interface Action {
     onClick: () => void;
 }
 
-interface MobileTableProps {
+export interface MobileTableProps {
     data: Record<string, any>;
     translation: string;
     modalVisible: boolean;
     setModalVisible: Dispatch<SetStateAction<boolean>>;
-    actions: Action[];
     title: string;
     hasArrows?: boolean;
+    actions?: Action[];
     handlePrev?: () => void;
     handleNext?: () => void;
     hiddenColumns?: string[];
@@ -39,7 +39,7 @@ export const MobileTable = (
 
     const menu = (
         <Menu>
-            {actions.map((action, index) => (
+            {actions?.map((action, index) => (
                 <React.Fragment key={action.key}>
                     <Menu.Item key={action.key} onClick={action.onClick}>
                         {action.label}
@@ -47,7 +47,7 @@ export const MobileTable = (
 
                     {index < actions.length - 1 && <Menu.Divider />}
                 </React.Fragment>
-            ))}
+            )) || []}
         </Menu>
     );
 
@@ -69,9 +69,12 @@ export const MobileTable = (
                         />
                     }
 
-                    <Dropdown overlay={menu}>
-                        <Button>{t("tableHeadings.action")}</Button>
-                    </Dropdown>
+                    {actions?.length > 0 &&
+                        <Dropdown overlay={menu}>
+                            <Button>{t("tableHeadings.action")}</Button>
+                        </Dropdown>
+                    }
+
 
                     {hasArrows &&
                         <RightCircleOutlined

package/src/components/MobileTable/styles.module.scss

@@ -28,6 +28,7 @@
 .fullScreenModal {
     width: 100vw !important;
     max-width: 100vw !important;
+    padding: 0px 12px;
 }
 
 .wrapModal {