npm - @bjsdistribution/dms-client-return - Versions diffs - 0.2.2-prod → 0.2.3-prod - Mend

@bjsdistribution/dms-client-return 0.2.2-prod → 0.2.3-prod

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.

Files changed (151) hide show

package/dist/components/order-view/general-information/Status.js CHANGED Viewed

@@ -1,64 +1,64 @@
-import { jsx as e, Fragment as p, jsxs as s } from "react/jsx-runtime";
+import { jsx as e, Fragment as p, jsxs as l } from "react/jsx-runtime";
 import x from "react";
 import r from "styled-components";
-import { StatusOptions as u } from "../helper.js";
+import { StatusOptions as m } from "../helper.js";
 import f from "../../../assets/icons/RoutedIcon.js";
-import a from "../../../assets/icons/SuccessIcon.js";
+import o from "../../../assets/icons/SuccessIcon.js";
 import g from "../../../assets/icons/DeliveredIcon.js";
-import d from "../../../assets/icons/ConfirmedIcon.js";
+import s from "../../../assets/icons/ConfirmedIcon.js";
 import { useStatusDetails as h } from "../store.js";
-import { Skeleton as m } from "antd";
+import { Skeleton as u } from "antd";
 import v from "../../../assets/icons/Divider.js";
-function E({ statusDataLoading: o }) {
+function E({ statusDataLoading: d }) {
   const [n] = h();
-  return /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(k, { children: o ? /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(b, {}) }) : u?.map((t, c) => /* @__PURE__ */ s(x.Fragment, { children: [
-    /* @__PURE__ */ s(R, { children: [
+  return /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(j, { children: /* @__PURE__ */ e(k, { children: d ? /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(w, {}) }) : m?.map((t, c) => /* @__PURE__ */ l(x.Fragment, { children: [
+    /* @__PURE__ */ l(C, { children: [
       y(t.value, n),
       /* @__PURE__ */ e(I, { children: t.label })
     ] }),
-    c < u.length - 1 && /* @__PURE__ */ e(v, {})
+    c < m.length - 1 && /* @__PURE__ */ e(v, {})
   ] }, c)) }) }) });
 }
-const i = () => /* @__PURE__ */ s(w, { children: [
-  /* @__PURE__ */ e(m.Avatar, { size: "small", style: { marginRight: 12 } }),
+const i = () => /* @__PURE__ */ l(S, { children: [
+  /* @__PURE__ */ e(u.Avatar, { size: "small", style: { marginRight: 12 } }),
   /* @__PURE__ */ e(
-    m.Input,
+    u.Input,
     {
       active: !0,
       size: "small",
       style: { width: 150, borderRadius: 8 }
     }
   )
-] }), b = () => /* @__PURE__ */ s(S, { children: [
+] }), w = () => /* @__PURE__ */ l(b, { children: [
   /* @__PURE__ */ e(i, {}),
-  /* @__PURE__ */ e(l, {}),
+  /* @__PURE__ */ e(a, {}),
   /* @__PURE__ */ e(i, {}),
-  /* @__PURE__ */ e(l, {}),
+  /* @__PURE__ */ e(a, {}),
   /* @__PURE__ */ e(i, {}),
-  /* @__PURE__ */ e(l, {}),
+  /* @__PURE__ */ e(a, {}),
   /* @__PURE__ */ e(i, {}),
-  /* @__PURE__ */ e(l, {}),
+  /* @__PURE__ */ e(a, {}),
   /* @__PURE__ */ e(i, {}),
-  /* @__PURE__ */ e(l, {}),
+  /* @__PURE__ */ e(a, {}),
   /* @__PURE__ */ e(i, {})
-] }), y = (o, n) => {
+] }), y = (d, n) => {
   const t = n && n.length > 0 ? n[0] : null;
   if (!t || !t)
     return null;
-  switch (o) {
+  switch (d) {
     case "released":
     case "scheduled":
     case "routed":
     case "confirmed":
-      return t[o] ? /* @__PURE__ */ e(a, {}) : /* @__PURE__ */ e(d, {});
+      return t[d] ? /* @__PURE__ */ e(o, {}) : /* @__PURE__ */ e(s, {});
     case "received":
-      return t.received === "True" ? /* @__PURE__ */ e(a, {}) : t.received === "Partial" ? /* @__PURE__ */ e(f, {}) : /* @__PURE__ */ e(d, {});
+      return t.received === "True" ? /* @__PURE__ */ e(o, {}) : t.received === "Partial" ? /* @__PURE__ */ e(f, {}) : /* @__PURE__ */ e(s, {});
     case "delivered":
-      return t.delivered && (t.completed === !1 || t.completed === null) ? /* @__PURE__ */ e(g, {}) : t.delivered === !0 && t.completed === !0 ? /* @__PURE__ */ e(a, {}) : t.delivered === !0 && t.completed === !1 ? /* @__PURE__ */ e(f, {}) : /* @__PURE__ */ e(d, {});
+      return t.delivered && (t.completed === !1 || t.completed === null) ? /* @__PURE__ */ e(g, {}) : t.delivered === !0 && t.completed === !0 ? /* @__PURE__ */ e(o, {}) : t.delivered === !0 && t.completed === !1 ? /* @__PURE__ */ e(f, {}) : /* @__PURE__ */ e(s, {});
     default:
       return null;
   }
-}, S = r.div`
+}, b = r.div`
   display: flex;
   align-items: center;
   background: #fcfcfc;
@@ -68,11 +68,11 @@ const i = () => /* @__PURE__ */ s(w, { children: [
   flex-wrap: wrap;
   padding: 5px;
   width: -webkit-fill-available;
-`, w = r.div`
+`, S = r.div`
   display: flex;
   align-items: center;
   gap: 8px;
-`, l = r.div`
+`, a = r.div`
   width: 12px;
   height: 2px;
   background-color: #e0e0e0;
@@ -86,6 +86,22 @@ const i = () => /* @__PURE__ */ s(w, { children: [
   background: #f8fafc;
   align-items: center;
   height: 5%;
+  @media screen and (max-width: 992px) {
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    justify-content: stretch;
+    gap: 10px 16px;
+    padding: 15px 14px;
+    overflow: visible;
+    > svg {
+      display: none;
+    }
+    @media screen and (max-width: 576px) {
+      grid-template-columns: repeat(2, minmax(0, 1fr));
+    }
+  }
 `, I = r.div`
   font-family: 'lato', sans-serif;
   font-size: 14px;
@@ -93,13 +109,27 @@ const i = () => /* @__PURE__ */ s(w, { children: [
   font-weight: 500;
   line-height: 18px;
   text-transform: uppercase;
-`, C = r.div`
+  @media screen and (max-width: 992px) {
+    white-space: normal;
+    font-size: 12px;
+    line-height: 16px;
+  }
+`, j = r.div`
   padding: 15px;
   margin-top: 25px;
-`, R = r.div`
+  @media screen and (max-width: 992px) {
+    padding: 8px 12px;
+    margin-top: 0;
+  }
+`, C = r.div`
   gap: 10px;
   display: flex;
   align-items: center;
+  @media screen and (max-width: 992px) {
+    gap: 6px;
+  }
 `;
 export {
   E as default

package/dist/components/order-view/general-information/Status.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Status.js","sources":["../../../../src/components/order-view/general-information/Status.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { StatusOptions } from '../helper';\n// Import icon\nimport RouteIcon from '../../../assets/icons/RoutedIcon';\nimport SuccessIcon from '../../../assets/icons/SuccessIcon';\nimport DeliveredIcon from '../../../assets/icons/DeliveredIcon';\nimport ConfirmedIcon from '../../../assets/icons/ConfirmedIcon';\nimport { useStatusDetails } from '../store';\nimport { Skeleton } from 'antd';\nimport Divider from '../../../assets/icons/Divider';\n\nfunction Status({ statusDataLoading }: any) {\n const [orderStatus] = useStatusDetails();\n return (\n <>\n <Container>\n <BoxContainer>\n {statusDataLoading ? (\n <>\n <StatusSkeletonRow />\n </>\n ) : (\n StatusOptions?.map((option, index) => (\n <React.Fragment key={index}>\n <TextContainer>\n {renderIcon(option.value, orderStatus)}\n <Heading>{option.label}</Heading>\n </TextContainer>\n {index < StatusOptions.length - 1 && <Divider />}\n </React.Fragment>\n ))\n )}\n </BoxContainer>\n </Container>\n </>\n );\n}\nconst StatusSkeletonItem = () => (\n <SkeletonItemContainer>\n <Skeleton.Avatar size=\"small\" style={{ marginRight: 12 }} />\n <Skeleton.Input\n active\n size=\"small\"\n style={{ width: 150, borderRadius: 8 }}\n />\n </SkeletonItemContainer>\n);\nconst StatusSkeletonRow = () => (\n <StatusBox>\n <StatusSkeletonItem />\n <SkeletonDivider />\n <StatusSkeletonItem />\n <SkeletonDivider />\n <StatusSkeletonItem />\n <SkeletonDivider />\n <StatusSkeletonItem />\n <SkeletonDivider />\n <StatusSkeletonItem />\n <SkeletonDivider />\n <StatusSkeletonItem />\n </StatusBox>\n);\nconst renderIcon = (value: any, orderStatus: any) => {\n const status = orderStatus && orderStatus.length > 0 ? orderStatus[0] : null;\n\n if (!status) {\n return null;\n }\n\n if (!status) {\n return null;\n }\n\n switch (value) {\n case 'released':\n case 'scheduled':\n case 'routed':\n case 'confirmed':\n return status[value] ? <SuccessIcon /> : <ConfirmedIcon />;\n case 'received':\n if (status.received === 'True') {\n return <SuccessIcon />;\n } else if (status.received === 'Partial') {\n return <RouteIcon />;\n } else {\n return <ConfirmedIcon />;\n }\n case 'delivered':\n if (\n status.delivered &&\n (status.completed === false \|\| status.completed === null)\n ) {\n return <DeliveredIcon />; //grey\n } else if (status.delivered === true && status.completed === true) {\n return <SuccessIcon />;\n } else if (status.delivered === true && status.completed === false) {\n return <RouteIcon />; //orange\n } else {\n return <ConfirmedIcon />;\n }\n default:\n return null;\n }\n};\n\n// const RowWrapper = styled.div`\n// display: flex;\n// flex-direction: column;\n// background: #fff;\n// border-radius: 12px;\n// box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);\n// padding: 16px;\n// `;\n\n// const HeaderPlaceholder = styled.div`\n// display: flex;\n// align-items: center;\n// padding: 8px 0;\n// gap: 12px;\n// `;\n\nconst StatusBox = styled.div`\n display: flex;\n align-items: center;\n background: #fcfcfc;\n border: 1px solid #eee;\n border-radius: 20px;\n justify-content: space-between;\n flex-wrap: wrap;\n padding: 5px;\n width: -webkit-fill-available;\n`;\n\nconst SkeletonItemContainer = styled.div`\n display: flex;\n align-items: center;\n gap: 8px;\n`;\n\nconst SkeletonDivider = styled.div`\n width: 12px;\n height: 2px;\n background-color: #e0e0e0;\n margin: 0 4px;\n border-radius: 2px;\n`;\n\nconst BoxContainer = styled.div`\n border: 1px solid #e3e3e3;\n display: flex;\n justify-content: space-evenly;\n border-radius: 20px;\n background: #f8fafc;\n align-items: center;\n height: 5%;\n`;\n\nconst Heading = styled.div`\n font-family: 'lato', sans-serif;\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 18px;\n text-transform: uppercase;\n`;\n\nconst Container = styled.div`\n padding: 15px;\n margin-top: 25px;\n`;\n\nconst TextContainer = styled.div`\n gap: 10px;\n display: flex;\n align-items: center;\n`;\nexport default Status;\n"],"names":["Status","statusDataLoading","orderStatus","useStatusDetails","jsx","Container","BoxContainer","StatusSkeletonRow","StatusOptions","option","index","jsxs","React","TextContainer","renderIcon","Heading","Divider","StatusSkeletonItem","SkeletonItemContainer","Skeleton","StatusBox","SkeletonDivider","value","status","SuccessIcon","ConfirmedIcon","RouteIcon","DeliveredIcon","styled"],"mappings":";;;;;;;;;;;AAYA,SAASA,EAAO,EAAE,mBAAAC,KAA0B;AAC1C,QAAM,CAACC,CAAW,IAAIC,EAAA;AACtB,gCAEI,UAAA,gBAAAC,EAACC,GAAA,EACC,4BAACC,GAAA,EACE,UAAAL,2BAEG,UAAA,gBAAAG,EAACG,GAAA,CAAA,CAAkB,GACrB,IAEAC,GAAe,IAAI,CAACC,GAAQC,MAC1B,gBAAAC,EAACC,EAAM,UAAN,EACC,UAAA;AAAA,IAAA,gBAAAD,EAACE,GAAA,EACE,UAAA;AAAA,MAAAC,EAAWL,EAAO,OAAOP,CAAW;AAAA,MACrC,gBAAAE,EAACW,GAAA,EAAS,UAAAN,EAAO,MAAA,CAAM;AAAA,IAAA,GACzB;AAAA,IACCC,IAAQF,EAAc,SAAS,uBAAMQ,GAAA,CAAA,CAAQ;AAAA,EAAA,EAAA,GAL3BN,CAMrB,CACD,GAEL,EAAA,CACF,EAAA,CACF;AAEJ;AACA,MAAMO,IAAqB,MACzB,gBAAAN,EAACO,GAAA,EACC,UAAA;AAAA,EAAA,gBAAAd,EAACe,EAAS,QAAT,EAAgB,MAAK,SAAQ,OAAO,EAAE,aAAa,GAAA,GAAM;AAAA,EAC1D,gBAAAf;AAAA,IAACe,EAAS;AAAA,IAAT;AAAA,MACC,QAAM;AAAA,MACN,MAAK;AAAA,MACL,OAAO,EAAE,OAAO,KAAK,cAAc,EAAA;AAAA,IAAE;AAAA,EAAA;AACvC,GACF,GAEIZ,IAAoB,MACxB,gBAAAI,EAACS,GAAA,EACC,UAAA;AAAA,EAAA,gBAAAhB,EAACa,GAAA,EAAmB;AAAA,oBACnBI,GAAA,EAAgB;AAAA,oBAChBJ,GAAA,EAAmB;AAAA,oBACnBI,GAAA,EAAgB;AAAA,oBAChBJ,GAAA,EAAmB;AAAA,oBACnBI,GAAA,EAAgB;AAAA,oBAChBJ,GAAA,EAAmB;AAAA,oBACnBI,GAAA,EAAgB;AAAA,oBAChBJ,GAAA,EAAmB;AAAA,oBACnBI,GAAA,EAAgB;AAAA,oBAChBJ,GAAA,CAAA,CAAmB;AAAA,GACtB,GAEIH,IAAa,CAACQ,GAAYpB,MAAqB;AACnD,QAAMqB,IAASrB,KAAeA,EAAY,SAAS,IAAIA,EAAY,CAAC,IAAI;AAMxE,MAJI,CAACqB,KAID,CAACA;AACH,WAAO;AAGT,UAAQD,GAAA;AAAA,IACN,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAOC,EAAOD,CAAK,sBAAKE,GAAA,CAAA,CAAY,sBAAMC,GAAA,EAAc;AAAA,IAC1D,KAAK;AACH,aAAIF,EAAO,aAAa,2BACdC,GAAA,EAAY,IACXD,EAAO,aAAa,8BACrBG,GAAA,EAAU,sBAEVD,GAAA,EAAc;AAAA,IAE1B,KAAK;AACH,aACEF,EAAO,cACNA,EAAO,cAAc,MAASA,EAAO,cAAc,0BAE5CI,GAAA,EAAc,IACbJ,EAAO,cAAc,MAAQA,EAAO,cAAc,uBACnDC,GAAA,EAAY,IACXD,EAAO,cAAc,MAAQA,EAAO,cAAc,uBACnDG,GAAA,EAAU,sBAEVD,GAAA,EAAc;AAAA,IAE1B;AACE,aAAO;AAAA,EAAA;AAEb,GAkBML,IAAYQ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAYnBV,IAAwBU,EAAO;AAAA;AAAA;AAAA;AAAA,GAM/BP,IAAkBO,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQzBtB,IAAesB,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~GAUtBb~~,IAAUa,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~GASjBvB~~,IAAYuB,EAAO;AAAA;AAAA;AAAA,~~GAKnBf~~,IAAgBe,EAAO;AAAA;AAAA;AAAA;AAAA;"}
1	+ {"version":3,"file":"Status.js","sources":["../../../../src/components/order-view/general-information/Status.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { StatusOptions } from '../helper';\n// Import icon\nimport RouteIcon from '../../../assets/icons/RoutedIcon';\nimport SuccessIcon from '../../../assets/icons/SuccessIcon';\nimport DeliveredIcon from '../../../assets/icons/DeliveredIcon';\nimport ConfirmedIcon from '../../../assets/icons/ConfirmedIcon';\nimport { useStatusDetails } from '../store';\nimport { Skeleton } from 'antd';\nimport Divider from '../../../assets/icons/Divider';\n\nfunction Status({ statusDataLoading }: any) {\n const [orderStatus] = useStatusDetails();\n return (\n <>\n <Container>\n <BoxContainer>\n {statusDataLoading ? (\n <>\n <StatusSkeletonRow />\n </>\n ) : (\n StatusOptions?.map((option, index) => (\n <React.Fragment key={index}>\n <TextContainer>\n {renderIcon(option.value, orderStatus)}\n <Heading>{option.label}</Heading>\n </TextContainer>\n {index < StatusOptions.length - 1 && <Divider />}\n </React.Fragment>\n ))\n )}\n </BoxContainer>\n </Container>\n </>\n );\n}\nconst StatusSkeletonItem = () => (\n <SkeletonItemContainer>\n <Skeleton.Avatar size=\"small\" style={{ marginRight: 12 }} />\n <Skeleton.Input\n active\n size=\"small\"\n style={{ width: 150, borderRadius: 8 }}\n />\n </SkeletonItemContainer>\n);\nconst StatusSkeletonRow = () => (\n <StatusBox>\n <StatusSkeletonItem />\n <SkeletonDivider />\n <StatusSkeletonItem />\n <SkeletonDivider />\n <StatusSkeletonItem />\n <SkeletonDivider />\n <StatusSkeletonItem />\n <SkeletonDivider />\n <StatusSkeletonItem />\n <SkeletonDivider />\n <StatusSkeletonItem />\n </StatusBox>\n);\nconst renderIcon = (value: any, orderStatus: any) => {\n const status = orderStatus && orderStatus.length > 0 ? orderStatus[0] : null;\n\n if (!status) {\n return null;\n }\n\n if (!status) {\n return null;\n }\n\n switch (value) {\n case 'released':\n case 'scheduled':\n case 'routed':\n case 'confirmed':\n return status[value] ? <SuccessIcon /> : <ConfirmedIcon />;\n case 'received':\n if (status.received === 'True') {\n return <SuccessIcon />;\n } else if (status.received === 'Partial') {\n return <RouteIcon />;\n } else {\n return <ConfirmedIcon />;\n }\n case 'delivered':\n if (\n status.delivered &&\n (status.completed === false \|\| status.completed === null)\n ) {\n return <DeliveredIcon />; //grey\n } else if (status.delivered === true && status.completed === true) {\n return <SuccessIcon />;\n } else if (status.delivered === true && status.completed === false) {\n return <RouteIcon />; //orange\n } else {\n return <ConfirmedIcon />;\n }\n default:\n return null;\n }\n};\n\n// const RowWrapper = styled.div`\n// display: flex;\n// flex-direction: column;\n// background: #fff;\n// border-radius: 12px;\n// box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);\n// padding: 16px;\n// `;\n\n// const HeaderPlaceholder = styled.div`\n// display: flex;\n// align-items: center;\n// padding: 8px 0;\n// gap: 12px;\n// `;\n\nconst StatusBox = styled.div`\n display: flex;\n align-items: center;\n background: #fcfcfc;\n border: 1px solid #eee;\n border-radius: 20px;\n justify-content: space-between;\n flex-wrap: wrap;\n padding: 5px;\n width: -webkit-fill-available;\n`;\n\nconst SkeletonItemContainer = styled.div`\n display: flex;\n align-items: center;\n gap: 8px;\n`;\n\nconst SkeletonDivider = styled.div`\n width: 12px;\n height: 2px;\n background-color: #e0e0e0;\n margin: 0 4px;\n border-radius: 2px;\n`;\n\nconst BoxContainer = styled.div`\n border: 1px solid #e3e3e3;\n display: flex;\n justify-content: space-evenly;\n border-radius: 20px;\n background: #f8fafc;\n align-items: center;\n height: 5%;\n\n\n @media screen and (max-width: 992px) {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 1fr));\n justify-content: stretch;\n gap: 10px 16px;\n padding: 15px 14px;\n overflow: visible;\n > svg {\n display: none;\n }\n @media screen and (max-width: 576px) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n }\n`;\n\nconst Heading = styled.div`\n font-family: 'lato', sans-serif;\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 18px;\n text-transform: uppercase;\n @media screen and (max-width: 992px) {\n white-space: normal;\n font-size: 12px;\n line-height: 16px;\n }\n`;\n\nconst Container = styled.div`\n padding: 15px;\n margin-top: 25px;\n\n @media screen and (max-width: 992px) {\n padding: 8px 12px;\n margin-top: 0;\n }\n`;\n\nconst TextContainer = styled.div`\n gap: 10px;\n display: flex;\n align-items: center;\n\n @media screen and (max-width: 992px) {\n gap: 6px;\n }\n`;\nexport default Status;\n"],"names":["Status","statusDataLoading","orderStatus","useStatusDetails","jsx","Container","BoxContainer","StatusSkeletonRow","StatusOptions","option","index","jsxs","React","TextContainer","renderIcon","Heading","Divider","StatusSkeletonItem","SkeletonItemContainer","Skeleton","StatusBox","SkeletonDivider","value","status","SuccessIcon","ConfirmedIcon","RouteIcon","DeliveredIcon","styled"],"mappings":"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"}

package/dist/components/order-view/generic-table/AuditLogs.js CHANGED Viewed

@@ -1,32 +1,40 @@
-import { jsx as e, jsxs as a, Fragment as n } from "react/jsx-runtime";
-import o from "styled-components";
+import { jsx as t, jsxs as d, Fragment as n } from "react/jsx-runtime";
+import r from "styled-components";
 import { Skeleton as c } from "antd";
-import { PrivateIcon as s, formatUtcToLocal as d } from "@bjsdistribution/dms-component-library";
-import { NotesTableData as h } from "../notes/logs/fakeData.js";
-import { usegetNotes as p, useAuditLogLoadingState as m } from "../store.js";
-const v = () => {
-  const i = h[0]?.tableHead, [r] = p(), [l] = m();
-  return /* @__PURE__ */ e(g, { children: /* @__PURE__ */ e(b, { children: /* @__PURE__ */ a("table", { children: [
-    /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { children: i?.map((t) => /* @__PURE__ */ e("th", { children: t.label }, t.key)) }) }),
-    /* @__PURE__ */ e("tbody", { children: l ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e("td", { className: "noBoder", colSpan: i?.length, children: /* @__PURE__ */ e(c, {}) }) }) : r && r?.length > 0 ? r?.map((t) => /* @__PURE__ */ a("tr", { children: [
-      /* @__PURE__ */ a("td", { children: [
-        /* @__PURE__ */ e("div", { className: "bold", title: t?.created_by, children: t?.created_by }),
-        /* @__PURE__ */ e("div", { className: "notesIcon", children: t?.is_private ? /* @__PURE__ */ a(n, { children: [
-          /* @__PURE__ */ e(s, {}),
+import { PrivateIcon as s, formatUtcToLocal as l } from "@bjsdistribution/dms-component-library";
+import { NotesTableData as b } from "../notes/logs/fakeData.js";
+import { usegetNotes as p, useAuditLogLoadingState as h } from "../store.js";
+const N = () => {
+  const a = b[0]?.tableHead, [o] = p(), [i] = h();
+  return /* @__PURE__ */ t(x, { children: /* @__PURE__ */ t(m, { children: /* @__PURE__ */ d("table", { children: [
+    /* @__PURE__ */ t("thead", { children: /* @__PURE__ */ t("tr", { children: a?.map((e) => /* @__PURE__ */ t("th", { children: e.label }, e.key)) }) }),
+    /* @__PURE__ */ t("tbody", { children: i ? /* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t("td", { className: "noBoder", colSpan: a?.length, children: /* @__PURE__ */ t(c, {}) }) }) : o && o?.length > 0 ? o?.map((e) => /* @__PURE__ */ d("tr", { children: [
+      /* @__PURE__ */ t("td", { "data-label": a?.[0]?.label, children: /* @__PURE__ */ d("div", { className: "cell-value", children: [
+        /* @__PURE__ */ t("div", { className: "bold", title: e?.created_by, children: e?.created_by }),
+        /* @__PURE__ */ t("div", { className: "notesIcon", children: e?.is_private ? /* @__PURE__ */ d(n, { children: [
+          /* @__PURE__ */ t(s, {}),
           " ",
-          /* @__PURE__ */ e("span", { className: "datetime", children: `${d(t?.created_at).date} @ ${d(t?.created_at).time}` })
-        ] }) : /* @__PURE__ */ e("span", { className: "datetime", children: `${d(t?.created_at).date} @ ${d(t?.created_at).time}` }) }),
-        /* @__PURE__ */ e("div", { children: t?.note_type || "N/A" })
-      ] }),
-      /* @__PURE__ */ e(
+          /* @__PURE__ */ t("span", { className: "datetime", children: `${l(e?.created_at).date} @ ${l(e?.created_at).time}` })
+        ] }) : /* @__PURE__ */ t("span", { className: "datetime", children: `${l(e?.created_at).date} @ ${l(e?.created_at).time}` }) }),
+        /* @__PURE__ */ t("div", { children: e?.note_type || "N/A" })
+      ] }) }),
+      /* @__PURE__ */ t(
         "td",
         {
-          dangerouslySetInnerHTML: { __html: t?.description }
+          className: "notes-cell",
+          "data-label": a?.[1]?.label,
+          children: /* @__PURE__ */ t(
+            "div",
+            {
+              className: "cell-value",
+              dangerouslySetInnerHTML: { __html: e?.description }
+            }
+          )
         }
       )
-    ] }, t?.id)) : /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e("td", { colSpan: i?.length, children: "No data found" }) }) })
+    ] }, e?.id)) : /* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t("td", { colSpan: a?.length, children: "No data found" }) }) })
   ] }) }) });
-}, g = o.div``, b = o.div`
+}, x = r.div``, m = r.div`
   height: 250px;
   min-height: 200px;
   /* overflow: auto; */
@@ -75,9 +83,106 @@ const v = () => {
       }
     }
   }
+  @media screen and (max-width: 768px) {
+    height: auto;
+    min-height: 0;
+    max-width: 100%;
+    table,
+    thead,
+    tbody {
+      display: block;
+      width: 100%;
+      min-width: 0;
+    }
+    thead {
+      position: absolute;
+      width: 1px;
+      height: 1px;
+      margin: -1px;
+      padding: 0;
+      overflow: hidden;
+      clip: rect(0, 0, 0, 0);
+      white-space: nowrap;
+      border: 0;
+    }
+    tbody tr {
+      display: block;
+      margin-bottom: 12px;
+      padding: 10px 12px;
+      border: 1px solid #e3e3e3;
+      border-radius: 12px;
+      background: #fff;
+      box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
+    }
+    tbody tr td {
+      display: flex;
+      align-items: flex-start;
+      justify-content: space-between;
+      gap: 12px;
+      width: 100%;
+      box-sizing: border-box;
+      padding: 8px 0;
+      border: 0;
+      border-bottom: 1px solid #f0f2f2;
+      text-align: right;
+      word-break: break-word;
+    }
+    tbody tr td:last-child {
+      border-bottom: 0;
+    }
+    tbody tr td[data-label]::before {
+      content: attr(data-label);
+      flex: 0 0 38%;
+      text-align: left;
+      font-size: 12px;
+      font-weight: 600;
+      text-transform: uppercase;
+      color: #6a7378;
+    }
+    tbody tr td .cell-value {
+      flex: 1;
+      min-width: 0;
+    }
+    tbody tr td .notesIcon {
+      justify-content: flex-end;
+      flex-wrap: wrap;
+      .datetime {
+        min-width: 0;
+      }
+    }
+    /* long rich-text notes read better with the label above */
+    tbody tr td.notes-cell {
+      flex-direction: column;
+      gap: 4px;
+      text-align: left;
+    }
+    tbody tr td.notes-cell[data-label]::before {
+      flex: none;
+    }
+    tbody tr td.notes-cell .cell-value img,
+    tbody tr td.notes-cell .cell-value table {
+      max-width: 100%;
+    }
+    /* loading / empty rows */
+    tbody tr:not(:has(td[data-label])) {
+      padding: 0;
+      border: 0;
+      box-shadow: none;
+      background: transparent;
+    }
+    tbody tr td:not([data-label]) {
+      text-align: left;
+    }
+  }
 `;
 export {
-  b as AuditTableWrapper,
-  v as default
+  m as AuditTableWrapper,
+  N as default
 };
 //# sourceMappingURL=AuditLogs.js.map

package/dist/components/order-view/generic-table/AuditLogs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AuditLogs.js","sources":["../../../../src/components/order-view/generic-table/AuditLogs.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport React from 'react';\n\nimport { Skeleton } from 'antd';\nimport {\n PrivateIcon,\n formatUtcToLocal,\n} from '@bjsdistribution/dms-component-library';\nimport { NotesTableData } from '../notes/logs/fakeData';\nimport { useAuditLogLoadingState, usegetNotes } from '../store';\n\nconst GenericAuditLogsTable = () => {\n const tableHeadData = NotesTableData[0]?.tableHead; // Assuming NotesTableData contains table header information\n const [getNotes] = usegetNotes();\n const [auditLogLoadingStatus] = useAuditLogLoadingState();\n\n return (\n <ScrollableTableWrapper>\n <AuditTableWrapper>\n <table>\n <thead>\n <tr>\n {tableHeadData?.map(column => (\n <th key={column.key}>{column.label}</th>\n ))}\n </tr>\n </thead>\n <tbody>\n {auditLogLoadingStatus ? (\n <tr>\n <td className=\"noBoder\" colSpan={tableHeadData?.length}>\n <Skeleton />\n </td>\n </tr>\n ) : getNotes && getNotes?.length > 0 ? (\n getNotes?.map((note: any) => (\n <tr key={note?.id}>\n <td>\n <div className=\"bold\" title={note?.created_by}>\n {note?.created_by}\n </div>\n <div className=\"notesIcon\">\n {note?.is_private ? (\n <>\n <PrivateIcon />{' '}\n <span className=\"datetime\">{`${\n formatUtcToLocal(note?.created_at).date\n } @ ${\n formatUtcToLocal(note?.created_at).time\n }`}</span>\n </>\n ) : (\n <span className=\"datetime\">{`${\n formatUtcToLocal(note?.created_at).date\n } @ ${formatUtcToLocal(note?.created_at).time}`}</span>\n )}\n </div>\n <div>{note?.note_type \|\| 'N/A'}</div>\n </td>\n <td\n dangerouslySetInnerHTML={{ __html: note?.description }}\n ~~></~~td>\n </tr>\n ))\n ) : (\n <tr>\n <td colSpan={tableHeadData?.length}>No data found</td>\n </tr>\n )}\n </tbody>\n </table>\n </AuditTableWrapper>\n </ScrollableTableWrapper>\n );\n};\n\nconst ScrollableTableWrapper = styled.div``;\n\nexport const AuditTableWrapper = styled.div`\n height: 250px;\n min-height: 200px;\n /* overflow: auto; */\n\n table {\n border-spacing: 0;\n width: 100%;\n text-align: left;\n\n thead {\n th {\n border-bottom: 1px solid rgba(58, 54, 48, 0.25);\n background: #faf9f9;\n padding: 14px 12px;\n color: #3a3630;\n font-size: 14px;\n font-weight: 600;\n line-height: 24px;\n }\n }\n tbody {\n td {\n color: #667085;\n font-family: Lato;\n font-size: 13px;\n font-weight: 400;\n line-height: 16px;\n padding: 10px;\n border-bottom: 1px solid #efe8e8;\n word-break: break-word;\n vertical-align: top;\n\n .bold {\n font-weight: 500;\n font-size: 14px;\n }\n .notesIcon {\n display: flex;\n align-items: center;\n gap: 5px;\n\n .datetime {\n min-width: 155px;\n }\n }\n }\n }\n }\n`;\n\nexport default GenericAuditLogsTable;\n"],"names":["GenericAuditLogsTable","tableHeadData","NotesTableData","getNotes","usegetNotes","auditLogLoadingStatus","useAuditLogLoadingState","jsx","ScrollableTableWrapper","AuditTableWrapper","column","Skeleton","note","jsxs","Fragment","PrivateIcon","formatUtcToLocal","styled"],"mappings":";;;;;;AAWA,MAAMA,IAAwB,MAAM;AAClC,QAAMC,IAAgBC,EAAe,CAAC,GAAG,WACnC,CAACC,CAAQ,IAAIC,EAAA,GACb,CAACC,CAAqB,IAAIC,EAAA;AAEhC,SACE,gBAAAC,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,EACC,4BAAC,SAAA,EACC,UAAA;AAAA,IAAA,gBAAAF,EAAC,SAAA,EACC,UAAA,gBAAAA,EAAC,MAAA,EACE,UAAAN,GAAe,IAAI,CAAAS,MAClB,gBAAAH,EAAC,MAAA,EAAqB,UAAAG,EAAO,SAApBA,EAAO,GAAmB,CACpC,GACH,GACF;AAAA,IACA,gBAAAH,EAAC,SAAA,EACE,UAAAF,IACC,gBAAAE,EAAC,MAAA,EACC,UAAA,gBAAAA,EAAC,MAAA,EAAG,WAAU,WAAU,SAASN,GAAe,QAC9C,UAAA,gBAAAM,EAACI,KAAS,EAAA,CACZ,EAAA,CACF,IACER,KAAYA,GAAU,SAAS,IACjCA,GAAU,IAAI,CAACS,MACb,gBAAAC,EAAC,MAAA,EACC,UAAA;AAAA,MAAA,~~gBAAAA~~,EAAC,MAAA,~~EACC~~,UAAA;AAAA,QAAA,gBAAAN,EAAC,SAAI,WAAU,QAAO,OAAOK,GAAM,YAChC,aAAM,WAAA,CACT;AAAA,0BACC,OAAA,EAAI,WAAU,aACZ,UAAAA,GAAM,aACL,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,UAAA,gBAAAP,EAACQ,GAAA,EAAY;AAAA,UAAG;AAAA,4BACf,QAAA,EAAK,WAAU,YAAY,UAAA,GAC1BC,EAAiBJ,GAAM,UAAU,EAAE,IACrC,MACEI,EAAiBJ,GAAM,UAAU,EAAE,IACrC,GAAA,CAAG;AAAA,QAAA,GACL,IAEA,gBAAAL,EAAC,QAAA,EAAK,WAAU,YAAY,UAAA,GAC1BS,EAAiBJ,GAAM,UAAU,EAAE,IACrC,~~MAAMI~~,EAAiBJ,GAAM,UAAU,EAAE,~~IAAI~~,IAAG,~~GAEpD~~;AAAA,QACA,gBAAAL,EAAC,OAAA,EAAK,UAAAK,GAAM,aAAa,MAAA,CAAM;AAAA,MAAA,~~GACjC~~;AAAA,MACA,gBAAAL;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,yBAAyB,EAAE,QAAQK,GAAM,YAAA;AAAA,~~QAAY~~;AAAA,MAAA;AAAA,~~IACtD~~,EAAA,~~GAzBMA~~,GAAM,~~EA0Bf~~,CACD,IAED,gBAAAL,EAAC,MAAA,EACC,UAAA,gBAAAA,EAAC,MAAA,EAAG,SAASN,GAAe,QAAQ,UAAA,gBAAA,CAAa,GACnD,EAAA,CAEJ;AAAA,EAAA,EAAA,CACF,GACF,GACF;AAEJ,GAEMO,IAAyBS,EAAO,OAEzBR,IAAoBQ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
1	+ {"version":3,"file":"AuditLogs.js","sources":["../../../../src/components/order-view/generic-table/AuditLogs.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport React from 'react';\n\nimport { Skeleton } from 'antd';\nimport {\n PrivateIcon,\n formatUtcToLocal,\n} from '@bjsdistribution/dms-component-library';\nimport { NotesTableData } from '../notes/logs/fakeData';\nimport { useAuditLogLoadingState, usegetNotes } from '../store';\n\nconst GenericAuditLogsTable = () => {\n const tableHeadData = NotesTableData[0]?.tableHead; // Assuming NotesTableData contains table header information\n const [getNotes] = usegetNotes();\n const [auditLogLoadingStatus] = useAuditLogLoadingState();\n\n return (\n <ScrollableTableWrapper>\n <AuditTableWrapper>\n <table>\n <thead>\n <tr>\n {tableHeadData?.map(column => (\n <th key={column.key}>{column.label}</th>\n ))}\n </tr>\n </thead>\n <tbody>\n {auditLogLoadingStatus ? (\n <tr>\n <td className=\"noBoder\" colSpan={tableHeadData?.length}>\n <Skeleton />\n </td>\n </tr>\n ) : getNotes && getNotes?.length > 0 ? (\n getNotes?.map((note: any) => (\n <tr key={note?.id}>\n <td data-label={tableHeadData?.[0]?.label}>\n <div className=\"cell-value\">\n <div className=\"bold\" title={note?.created_by}>\n {note?.created_by}\n </div>\n <div className=\"notesIcon\">\n {note?.is_private ? (\n <>\n <PrivateIcon />{' '}\n <span className=\"datetime\">{`${\n formatUtcToLocal(note?.created_at).date\n } @ ${\n formatUtcToLocal(note?.created_at).time\n }`}</span>\n </>\n ) : (\n <span className=\"datetime\">{`${\n formatUtcToLocal(note?.created_at).date\n } @ ${\n formatUtcToLocal(note?.created_at).time\n }`}</span>\n )}\n </div>\n <div>{note?.note_type \|\| 'N/A'}</div>\n </div>\n </td>\n <td\n className=\"notes-cell\"\n data-label={tableHeadData?.[1]?.label}\n >\n <div\n className=\"cell-value\"\n dangerouslySetInnerHTML={{ __html: note?.description }}\n ></div>\n </td>\n </tr>\n ))\n ) : (\n <tr>\n <td colSpan={tableHeadData?.length}>No data found</td>\n </tr>\n )}\n </tbody>\n </table>\n </AuditTableWrapper>\n </ScrollableTableWrapper>\n );\n};\n\nconst ScrollableTableWrapper = styled.div``;\n\nexport const AuditTableWrapper = styled.div`\n height: 250px;\n min-height: 200px;\n /* overflow: auto; /\n\n table {\n border-spacing: 0;\n width: 100%;\n text-align: left;\n\n thead {\n th {\n border-bottom: 1px solid rgba(58, 54, 48, 0.25);\n background: #faf9f9;\n padding: 14px 12px;\n color: #3a3630;\n font-size: 14px;\n font-weight: 600;\n line-height: 24px;\n }\n }\n tbody {\n td {\n color: #667085;\n font-family: Lato;\n font-size: 13px;\n font-weight: 400;\n line-height: 16px;\n padding: 10px;\n border-bottom: 1px solid #efe8e8;\n word-break: break-word;\n vertical-align: top;\n\n .bold {\n font-weight: 500;\n font-size: 14px;\n }\n .notesIcon {\n display: flex;\n align-items: center;\n gap: 5px;\n\n .datetime {\n min-width: 155px;\n }\n }\n }\n }\n }\n\n @media screen and (max-width: 768px) {\n height: auto;\n min-height: 0;\n max-width: 100%;\n\n table,\n thead,\n tbody {\n display: block;\n width: 100%;\n min-width: 0;\n }\n\n thead {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n }\n\n tbody tr {\n display: block;\n margin-bottom: 12px;\n padding: 10px 12px;\n border: 1px solid #e3e3e3;\n border-radius: 12px;\n background: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n tbody tr td {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 12px;\n width: 100%;\n box-sizing: border-box;\n padding: 8px 0;\n border: 0;\n border-bottom: 1px solid #f0f2f2;\n text-align: right;\n word-break: break-word;\n }\n tbody tr td:last-child {\n border-bottom: 0;\n }\n tbody tr td[data-label]::before {\n content: attr(data-label);\n flex: 0 0 38%;\n text-align: left;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n color: #6a7378;\n }\n tbody tr td .cell-value {\n flex: 1;\n min-width: 0;\n }\n tbody tr td .notesIcon {\n justify-content: flex-end;\n flex-wrap: wrap;\n .datetime {\n min-width: 0;\n }\n }\n / long rich-text notes read better with the label above /\n tbody tr td.notes-cell {\n flex-direction: column;\n gap: 4px;\n text-align: left;\n }\n tbody tr td.notes-cell[data-label]::before {\n flex: none;\n }\n tbody tr td.notes-cell .cell-value img,\n tbody tr td.notes-cell .cell-value table {\n max-width: 100%;\n }\n\n / loading / empty rows */\n tbody tr:not(:has(td[data-label])) {\n padding: 0;\n border: 0;\n box-shadow: none;\n background: transparent;\n }\n tbody tr td:not([data-label]) {\n text-align: left;\n }\n }\n`;\n\nexport default GenericAuditLogsTable;\n"],"names":["GenericAuditLogsTable","tableHeadData","NotesTableData","getNotes","usegetNotes","auditLogLoadingStatus","useAuditLogLoadingState","jsx","ScrollableTableWrapper","AuditTableWrapper","column","Skeleton","note","jsxs","Fragment","PrivateIcon","formatUtcToLocal","styled"],"mappings":"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"}

package/dist/components/order-view/notes/logs/index.js CHANGED Viewed

@@ -1,17 +1,25 @@
-import { jsx as t } from "react/jsx-runtime";
-import i from "styled-components";
-import o from "../../generic-table/AuditLogs.js";
-function h() {
-  return /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(o, {}) });
+import { jsx as i } from "react/jsx-runtime";
+import t from "styled-components";
+import e from "../../generic-table/AuditLogs.js";
+function a() {
+  return /* @__PURE__ */ i(o, { children: /* @__PURE__ */ i(e, {}) });
 }
-const r = i.div`
+const o = t.div`
   height: 500px;
   min-height: 200px;
   max-height: 500px;
   overflow: auto; /* Enable scrolling */
   scrollbar-width: thin;
+  @media screen and (max-width: 768px) {
+    height: auto;
+    min-height: 0;
+    max-height: 70vh;
+    overflow-x: hidden;
+    overflow-y: auto;
+  }
 `;
 export {
-  h as default
+  a as default
 };
 //# sourceMappingURL=index.js.map

package/dist/components/order-view/notes/logs/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../../src/components/order-view/notes/logs/index.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport GenericAuditLogsTable from '../../generic-table/AuditLogs';\n\nfunction AuditLogs() {\n return (\n <Container>\n <GenericAuditLogsTable />\n </Container>\n );\n}\n\nconst Container = styled.div`\n height: 500px;\n min-height: 200px;\n max-height: 500px;\n overflow: auto; /* Enable scrolling */\n scrollbar-width: thin;\n`;\n\nexport default AuditLogs;\n"],"names":["AuditLogs","jsx","Container","GenericAuditLogsTable","styled"],"mappings":";;;AAIA,SAASA,IAAY;AACnB,SACE,gBAAAC,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,CAAA,CAAsB,GACzB;AAEJ;AAEA,MAAMD,IAAYE,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
1	+ {"version":3,"file":"index.js","sources":["../../../../../src/components/order-view/notes/logs/index.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport GenericAuditLogsTable from '../../generic-table/AuditLogs';\n\nfunction AuditLogs() {\n return (\n <Container>\n <GenericAuditLogsTable />\n </Container>\n );\n}\n\nconst Container = styled.div`\n height: 500px;\n min-height: 200px;\n max-height: 500px;\n overflow: auto; /* Enable scrolling */\n scrollbar-width: thin;\n\n @media screen and (max-width: 768px) {\n height: auto;\n min-height: 0;\n max-height: 70vh;\n overflow-x: hidden;\n overflow-y: auto;\n }\n`;\n\nexport default AuditLogs;\n"],"names":["AuditLogs","jsx","Container","GenericAuditLogsTable","styled"],"mappings":";;;AAIA,SAASA,IAAY;AACnB,SACE,gBAAAC,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,CAAA,CAAsB,GACzB;AAEJ;AAEA,MAAMD,IAAYE,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/components/order-view/notes/order-dropdown/NewReturnDropdown.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { jsxs as I, jsx as f } from "react/jsx-runtime";
 import { useState as A, useEffect as d } from "react";
 import l from "styled-components";
 import { useApiHook as C } from "@bjsdistribution/dms-component-library";
-import { useOrderDetails as N, useReturnProductDetails as R, useOrderId as b } from "../../store.js";
+import { useOrderDetails as N, useProductDetails as R, useOrderId as b } from "../../store.js";
 import { Select as j } from "antd";
 import { useNewReturnOrderData as z, useSelectedProducts as E } from "../../../store.js";
 import { atom as h, useAtom as m } from "jotai";
@@ -23,7 +23,7 @@ const T = h(null), $ = h(null), U = () => {
     op: "=",
     value: t[0]
   });
-  const { data: s, setShouldPerformAction: u } = C({
+  const { data: s, setShouldPerformAction: p } = C({
     endpoint: "/v1/return/orders/",
     method: "GET",
     filters: n && n?.length > 0 ? n : void 0,
@@ -32,8 +32,8 @@ const T = h(null), $ = h(null), U = () => {
     performAction: !1
   });
   d(() => {
-    r && t?.length > 0 && t[0] && u(!0);
-  }, [r, t, u]), d(() => {
+    r && t?.length > 0 && t[0] && p(!0);
+  }, [r, t, p]), d(() => {
     s && s?.data && r !== null && v(s?.data);
   }, [s, r]), d(() => {
     o && a?.length > 0 && i({
@@ -43,7 +43,7 @@ const T = h(null), $ = h(null), U = () => {
   }, [o, a, i]);
   const O = (e) => {
     y(e);
-  }, p = S?.map((e) => ({
+  }, u = S?.map((e) => ({
     label: `${e?.recipient_name} - ${e?.postcode}`,
     value: e?.id
   }));
@@ -52,7 +52,7 @@ const T = h(null), $ = h(null), U = () => {
     /* @__PURE__ */ f(
       k,
       {
-        options: p,
+        options: u,
         value: o,
         placeholder: "Select",
         onChange: O,
@@ -60,7 +60,7 @@ const T = h(null), $ = h(null), U = () => {
         showSearch: !0,
         dropdownStyle: { width: "250px" },
         popupClassName: g,
-        status: p.length === 0 || o ? "" : "error",
+        status: u.length === 0 || o ? "" : "error",
         notFoundContent: "No orders found with a similar postcode"
       }
     )

package/dist/components/order-view/notes/order-dropdown/NewReturnDropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NewReturnDropdown.js","sources":["../../../../../src/components/order-view/notes/order-dropdown/NewReturnDropdown.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { useApiHook } from '@bjsdistribution/dms-component-library';\nimport { ApiResponse } from '../../types';\nimport {\n useOrderDetails~~,\n~~ useOrderId~~,\n useReturnProductDetails,\n~~} from '../../store';\nimport { Select } from 'antd';\nimport { useNewReturnOrderData, useSelectedProducts } from '../../../store';\nimport { atom, useAtom } from 'jotai';\n\nexport const payloadAtom = atom<any>(null);\nexport const selectedOrderId = atom<any>(null);\n\nconst NewReturnDropdown = () => {\n const defaultSelectStyle = { width: '100%' };\n const defaultPopupClassName = 'dropDownStyle';\n const [returnOrderData, setReturnOrderData] = useNewReturnOrderData();\n const [selectedId, setSelectedOrderId] = useAtom(selectedOrderId);\n const [selectedProducts] = useSelectedProducts();\n const [orderData] = useOrderDetails();\n const [, setPayload] = useAtom(payloadAtom);\n const [productData] = ~~useReturnProductDetails~~();\n const [idProduct, setId] = useState<any>();\n const [orderId] = useOrderId();\n\n const id = orderData?.customer_id;\n useEffect(() => {\n const allProductIds =\n productData?.map((product: any) => product?.return_location) \|\| [];\n setId(allProductIds);\n }, [productData]);\n\n const filters = [\n { field: 'customer_id', op: '=', value: id },\n { field: 'is_deleted', op: '=', value: 0 },\n { field: 'status', op: '!=', value: 'SD' },\n { field: 'id', op: '!=', value: orderId },\n ];\n\n if (idProduct?.length > 0 && idProduct[0]) {\n filters.push({\n field: 'return_order_products.return_location',\n op: '=',\n value: idProduct[0],\n });\n }\n\n const { data: fetchedReturnOrderData, setShouldPerformAction } = useApiHook<\n ApiResponse\n >({\n endpoint: '/v1/return/orders/',\n method: 'GET',\n filters: filters && filters?.length > 0 ? filters : undefined,\n //@ts-ignore\n pagination: { is_pagination: false },\n performAction: false,\n });\n\n useEffect(() => {\n if (id && idProduct?.length > 0 && idProduct[0]) {\n setShouldPerformAction(true);\n }\n }, [id, idProduct, setShouldPerformAction]);\n\n useEffect(() => {\n if (fetchedReturnOrderData && fetchedReturnOrderData?.data && id !== null) {\n setReturnOrderData(fetchedReturnOrderData?.data);\n }\n }, [fetchedReturnOrderData, id]);\n\n useEffect(() => {\n if (selectedId && selectedProducts?.length > 0) {\n const newPayload = {\n new_return_order: selectedId,\n products: selectedProducts,\n };\n setPayload(newPayload);\n }\n }, [selectedId, selectedProducts, setPayload]);\n\n const handleDropdownChange = (value: string) => {\n setSelectedOrderId(value);\n };\n const dropdownOptions = returnOrderData?.map((order: any) => ({\n label: `${order?.recipient_name} - ${order?.postcode}`,\n value: order?.id,\n }));\n return (\n <Container>\n <Text>New Return Order:</Text>\n <StyledAntSelect\n options={dropdownOptions}\n value={selectedId}\n placeholder=\"Select\"\n // @ts-ignore\n onChange={handleDropdownChange}\n style={defaultSelectStyle}\n showSearch\n dropdownStyle={{ width: '250px' }}\n popupClassName={defaultPopupClassName}\n status={dropdownOptions.length === 0 ? '' : selectedId ? '' : 'error'}\n notFoundContent=\"No orders found with a similar postcode\"\n />\n </Container>\n );\n};\n\nconst StyledAntSelect = styled(Select)`\n .ant-select-selector {\n /* width: 22vw; */\n border-radius: 22px;\n }\n .ant-select-clear {\n top: 40% !important;\n font-size: 18px !important;\n }\n`;\n\nconst Container = styled.div`\n display: flex;\n align-items: center;\n gap: 10px;\n align-self: stretch;\n white-space: nowrap;\n`;\n\nconst Text = styled.div`\n color: #000;\n font-family: 'Lato';\n font-size: 13px;\n font-weight: 400;\n line-height: 16px;\n`;\n\nexport default NewReturnDropdown;\n"],"names":["payloadAtom","atom","selectedOrderId","NewReturnDropdown","defaultSelectStyle","defaultPopupClassName","returnOrderData","setReturnOrderData","useNewReturnOrderData","selectedId","setSelectedOrderId","useAtom","selectedProducts","useSelectedProducts","orderData","useOrderDetails","setPayload","productData","~~useReturnProductDetails~~","idProduct","setId","useState","orderId","useOrderId","id","useEffect","allProductIds","product","filters","fetchedReturnOrderData","setShouldPerformAction","useApiHook","handleDropdownChange","value","dropdownOptions","order","Container","jsx","Text","StyledAntSelect","styled","Select"],"mappings":";;;;;;;;~~AAaO~~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"}
1	+ {"version":3,"file":"NewReturnDropdown.js","sources":["../../../../../src/components/order-view/notes/order-dropdown/NewReturnDropdown.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { useApiHook } from '@bjsdistribution/dms-component-library';\nimport { ApiResponse } from '../../types';\nimport { useOrderDetails, useOrderId, useProductDetails } from '../../store';\nimport { Select } from 'antd';\nimport { useNewReturnOrderData, useSelectedProducts } from '../../../store';\nimport { atom, useAtom } from 'jotai';\n\nexport const payloadAtom = atom<any>(null);\nexport const selectedOrderId = atom<any>(null);\n\nconst NewReturnDropdown = () => {\n const defaultSelectStyle = { width: '100%' };\n const defaultPopupClassName = 'dropDownStyle';\n const [returnOrderData, setReturnOrderData] = useNewReturnOrderData();\n const [selectedId, setSelectedOrderId] = useAtom(selectedOrderId);\n const [selectedProducts] = useSelectedProducts();\n const [orderData] = useOrderDetails();\n const [, setPayload] = useAtom(payloadAtom);\n const [productData] = useProductDetails();\n const [idProduct, setId] = useState<any>();\n const [orderId] = useOrderId();\n\n const id = orderData?.customer_id;\n useEffect(() => {\n const allProductIds =\n productData?.map((product: any) => product?.return_location) \|\| [];\n setId(allProductIds);\n }, [productData]);\n\n const filters = [\n { field: 'customer_id', op: '=', value: id },\n { field: 'is_deleted', op: '=', value: 0 },\n { field: 'status', op: '!=', value: 'SD' },\n { field: 'id', op: '!=', value: orderId },\n ];\n\n if (idProduct?.length > 0 && idProduct[0]) {\n filters.push({\n field: 'return_order_products.return_location',\n op: '=',\n value: idProduct[0],\n });\n }\n\n const { data: fetchedReturnOrderData, setShouldPerformAction } = useApiHook<\n ApiResponse\n >({\n endpoint: '/v1/return/orders/',\n method: 'GET',\n filters: filters && filters?.length > 0 ? filters : undefined,\n //@ts-ignore\n pagination: { is_pagination: false },\n performAction: false,\n });\n\n useEffect(() => {\n if (id && idProduct?.length > 0 && idProduct[0]) {\n setShouldPerformAction(true);\n }\n }, [id, idProduct, setShouldPerformAction]);\n\n useEffect(() => {\n if (fetchedReturnOrderData && fetchedReturnOrderData?.data && id !== null) {\n setReturnOrderData(fetchedReturnOrderData?.data);\n }\n }, [fetchedReturnOrderData, id]);\n\n useEffect(() => {\n if (selectedId && selectedProducts?.length > 0) {\n const newPayload = {\n new_return_order: selectedId,\n products: selectedProducts,\n };\n setPayload(newPayload);\n }\n }, [selectedId, selectedProducts, setPayload]);\n\n const handleDropdownChange = (value: string) => {\n setSelectedOrderId(value);\n };\n const dropdownOptions = returnOrderData?.map((order: any) => ({\n label: `${order?.recipient_name} - ${order?.postcode}`,\n value: order?.id,\n }));\n return (\n <Container>\n <Text>New Return Order:</Text>\n <StyledAntSelect\n options={dropdownOptions}\n value={selectedId}\n placeholder=\"Select\"\n // @ts-ignore\n onChange={handleDropdownChange}\n style={defaultSelectStyle}\n showSearch\n dropdownStyle={{ width: '250px' }}\n popupClassName={defaultPopupClassName}\n status={dropdownOptions.length === 0 ? '' : selectedId ? '' : 'error'}\n notFoundContent=\"No orders found with a similar postcode\"\n />\n </Container>\n );\n};\n\nconst StyledAntSelect = styled(Select)`\n .ant-select-selector {\n /* width: 22vw; */\n border-radius: 22px;\n }\n .ant-select-clear {\n top: 40% !important;\n font-size: 18px !important;\n }\n`;\n\nconst Container = styled.div`\n display: flex;\n align-items: center;\n gap: 10px;\n align-self: stretch;\n white-space: nowrap;\n`;\n\nconst Text = styled.div`\n color: #000;\n font-family: 'Lato';\n font-size: 13px;\n font-weight: 400;\n line-height: 16px;\n`;\n\nexport default NewReturnDropdown;\n"],"names":["payloadAtom","atom","selectedOrderId","NewReturnDropdown","defaultSelectStyle","defaultPopupClassName","returnOrderData","setReturnOrderData","useNewReturnOrderData","selectedId","setSelectedOrderId","useAtom","selectedProducts","useSelectedProducts","orderData","useOrderDetails","setPayload","productData","useProductDetails","idProduct","setId","useState","orderId","useOrderId","id","useEffect","allProductIds","product","filters","fetchedReturnOrderData","setShouldPerformAction","useApiHook","handleDropdownChange","value","dropdownOptions","order","Container","jsx","Text","StyledAntSelect","styled","Select"],"mappings":"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"}