@erpsquad/common 1.8.7 → 1.8.9

package/dist/_virtual/ArrowDropDown/index.esm.js

@@ -0,0 +1,5 @@
+var ArrowDropDown = {};
+export {
+  ArrowDropDown as __exports
+};
+//# sourceMappingURL=index.esm.js.map

package/dist/_virtual/ArrowDropDown/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/_virtual/ArrowDropDown/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.__exports={};
+//# sourceMappingURL=index.js.map

package/dist/_virtual/ArrowDropDown/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/_virtual/ArrowDropUp/index.esm.js

@@ -0,0 +1,5 @@
+var ArrowDropUp = {};
+export {
+  ArrowDropUp as __exports
+};
+//# sourceMappingURL=index.esm.js.map

package/dist/_virtual/ArrowDropUp/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/_virtual/ArrowDropUp/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.__exports={};
+//# sourceMappingURL=index.js.map

package/dist/_virtual/ArrowDropUp/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/Dashboard/dashboard-card/index.esm.js

@@ -0,0 +1,17 @@
+import { jsx, Fragment, jsxs } from "react/jsx-runtime";
+/* empty css                          */
+import { Typography } from "../../typography/typography/index.esm.js";
+import { images } from "../../../images/index.esm.js";
+import Box from "../../../node_modules/@mui/material/Box/Box/index.esm.js";
+function DashBoardCard(props) {
+  const { title, value } = props;
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Box, { className: "card-class", children: /* @__PURE__ */ jsxs(Box, { p: 2, sx: { display: "flex", flexDirection: "column", border: "1px solid", borderRadius: "8px", gap: 1, borderColor: "#EEEFF1" }, children: [
+    /* @__PURE__ */ jsx(Box, { className: "dashboard-card-icon", children: /* @__PURE__ */ jsx("img", { src: images.ArrowCircleUpIcon }) }),
+    /* @__PURE__ */ jsx(Typography, { type: "s5", weight: "normal", color: "theme.neutral.800", children: title }),
+    /* @__PURE__ */ jsx(Typography, { type: "h2", weight: "bold", color: "theme.neutral.1000", children: value })
+  ] }) }) });
+}
+export {
+  DashBoardCard as default
+};
+//# sourceMappingURL=index.esm.js.map

package/dist/components/Dashboard/dashboard-card/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../../../src/components/Dashboard/dashboard-card.tsx"],"sourcesContent":["import { Box } from \"@mui/material\"\nimport './dashboard.scss'\nimport Typography from \"../typography/typography\"\nimport logo from '../../assets/images'\ninterface Iprops {\n    title?: string,\n    value?: string | number\n}\nfunction DashBoardCard(props: Iprops) {\n    const { title, value } = props\n    return (\n        <>\n            <Box className='card-class'>\n                <Box p={2} sx={{ display: 'flex', flexDirection: 'column', border: '1px solid', borderRadius: '8px', gap: 1, borderColor: '#EEEFF1' }}>\n                    <Box className='dashboard-card-icon'>\n                        <img src={logo.ArrowCircleUpIcon} />\n\n                    </Box>\n                    <Typography type=\"s5\" weight=\"normal\" color=\"theme.neutral.800\">{title}</Typography>\n                    <Typography type=\"h2\" weight=\"bold\" color=\"theme.neutral.1000\">{value}</Typography>\n                </Box>\n            </Box>\n        </>\n    )\n}\n\n\nexport default DashBoardCard"],"names":["logo"],"mappings":";;;;;AAQA,SAAS,cAAc,OAAe;AAClC,QAAM,EAAE,OAAO,MAAA,IAAU;AACzB,SACI,oBAAA,UAAA,EACI,8BAAC,KAAA,EAAI,WAAU,cACX,UAAA,qBAAC,KAAA,EAAI,GAAG,GAAG,IAAI,EAAE,SAAS,QAAQ,eAAe,UAAU,QAAQ,aAAa,cAAc,OAAO,KAAK,GAAG,aAAa,UAAA,GACtH,UAAA;AAAA,IAAA,oBAAC,KAAA,EAAI,WAAU,uBACX,UAAA,oBAAC,SAAI,KAAKA,OAAK,mBAAmB,EAAA,CAEtC;AAAA,IACA,oBAAC,cAAW,MAAK,MAAK,QAAO,UAAS,OAAM,qBAAqB,UAAA,MAAA,CAAM;AAAA,IACvE,oBAAC,cAAW,MAAK,MAAK,QAAO,QAAO,OAAM,sBAAsB,UAAA,MAAA,CAAM;AAAA,EAAA,EAAA,CAC1E,GACJ,GACJ;AAER;"}

package/dist/components/Dashboard/dashboard-card/index.js

@@ -0,0 +1,6 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");;/* empty css                       */var r=,/* empty css                                 */s=,/* empty css                     */a=;/* empty css                                                 */exports.default=function(i){const{title:o,value:l}=i;/* @__PURE__ */
+return e.jsx(e.Fragment,{children:/* @__PURE__ */e.jsx(a.default,{className:"card-class",children:/* @__PURE__ */e.jsxs(a.default,{p:2,sx:{display:"flex",flexDirection:"column",border:"1px solid",borderRadius:"8px",gap:1,borderColor:"#EEEFF1"},children:[
+/* @__PURE__ */e.jsx(a.default,{className:"dashboard-card-icon",children:/* @__PURE__ */e.jsx("img",{src:s.images.ArrowCircleUpIcon})}),
+/* @__PURE__ */e.jsx(r.Typography,{type:"s5",weight:"normal",color:"theme.neutral.800",children:o}),
+/* @__PURE__ */e.jsx(r.Typography,{type:"h2",weight:"bold",color:"theme.neutral.1000",children:l})]})})})};
+//# sourceMappingURL=index.js.map

package/dist/components/Dashboard/dashboard-card/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/Dashboard/dashboard-card.tsx"],"sourcesContent":["import { Box } from \"@mui/material\"\nimport './dashboard.scss'\nimport Typography from \"../typography/typography\"\nimport logo from '../../assets/images'\ninterface Iprops {\n    title?: string,\n    value?: string | number\n}\nfunction DashBoardCard(props: Iprops) {\n    const { title, value } = props\n    return (\n        <>\n            <Box className='card-class'>\n                <Box p={2} sx={{ display: 'flex', flexDirection: 'column', border: '1px solid', borderRadius: '8px', gap: 1, borderColor: '#EEEFF1' }}>\n                    <Box className='dashboard-card-icon'>\n                        <img src={logo.ArrowCircleUpIcon} />\n\n                    </Box>\n                    <Typography type=\"s5\" weight=\"normal\" color=\"theme.neutral.800\">{title}</Typography>\n                    <Typography type=\"h2\" weight=\"bold\" color=\"theme.neutral.1000\">{value}</Typography>\n                </Box>\n            </Box>\n        </>\n    )\n}\n\n\nexport default DashBoardCard"],"names":["props","title","value","jsx","Fragment","children","Box","className","jsxs","p","sx","display","flexDirection","border","borderRadius","gap","borderColor","src","logo","ArrowCircleUpIcon","Typography","type","weight","color"],"mappings":"2TAQA,SAAuBA,GACnB,MAAMC,MAAEA,EAAAC,MAAOA,GAAUF;AACzB,SACIG,IAAAC,EAAAA,SAAA,CACIC,8BAACC,EAAAA,QAAA,CAAIC,UAAU,aACXF,wBAAAG,EAAAA,KAACF,EAAAA,QAAA,CAAIG,EAAG,EAAGC,GAAI,CAAEC,QAAS,OAAQC,cAAe,SAAUC,OAAQ,YAAaC,aAAc,MAAOC,IAAK,EAAGC,YAAa,WACtHX,SAAA;iBAAAF,IAACG,EAAAA,QAAA,CAAIC,UAAU,sBACXF,wBAAAF,EAAAA,IAAC,OAAIc,IAAKC,EAAAA,OAAKC;eAGnBhB,EAAAA,IAACiB,EAAAA,YAAWC,KAAK,KAAKC,OAAO,SAASC,MAAM,oBAAqBlB,SAAAJ;eACjEE,EAAAA,IAACiB,EAAAA,YAAWC,KAAK,KAAKC,OAAO,OAAOC,MAAM,qBAAsBlB,SAAAH,UAKpF"}

package/dist/components/Dashboard/dashboard-header/index.esm.js

@@ -0,0 +1,68 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Typography } from "../../typography/typography/index.esm.js";
+import Chip from "../../chip/chip/index.esm.js";
+import { images } from "../../../images/index.esm.js";
+import { useState } from "react";
+import Menu from "../../menu/menu/index.esm.js";
+import { useTranslation } from "react-i18next";
+import IconButton from "../../../node_modules/@mui/material/IconButton/IconButton/index.esm.js";
+import MenuItem from "../../../node_modules/@mui/material/MenuItem/MenuItem/index.esm.js";
+const DashBoardHeader = ({ title, customElement, showEdit = true, showDropDowan = true }) => {
+  const { t } = useTranslation();
+  const [isEditingMode, setIsEditingMode] = useState(false);
+  const [anchorMoreEl, setAnchorMoreEl] = useState(null);
+  const handleMoreIconClick = (event) => {
+    setAnchorMoreEl(event.currentTarget);
+  };
+  const handleMoreIconClose = () => {
+    setAnchorMoreEl(null);
+  };
+  return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("div", { className: "header-title", children: [
+    /* @__PURE__ */ jsx(Typography, { type: "h3", weight: "medium", color: "theme.secondary.1000", children: title }),
+    /* @__PURE__ */ jsxs("div", { className: "header-right-wrap", children: [
+      customElement,
+      showEdit && /* @__PURE__ */ jsx(
+        Chip,
+        {
+          type: "normal",
+          label: isEditingMode ? t("manufacturing.dashboard.editing_dashboard_mode_label") : t("manufacturing.dashboard.edit_layout_mode_label"),
+          className: `${isEditingMode ? "edit-box" : "edit-box edit-box--InActive"}`,
+          icon: /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: isEditingMode ? images.common.editIcon : images.edit,
+              alt: t("common.edit")
+            }
+          ),
+          onClick: () => setIsEditingMode(true),
+          active: isEditingMode
+        }
+      ),
+      showDropDowan && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            color: "inherit",
+            size: "small",
+            onClick: handleMoreIconClick,
+            children: /* @__PURE__ */ jsx("img", { src: images.more, alt: t("manufacturing.dashboard.more_icon_label") })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Menu,
+          {
+            anchorEl: anchorMoreEl,
+            open: Boolean(anchorMoreEl),
+            onClose: handleMoreIconClose,
+            className: "dropdown-inner calender-drp",
+            children: /* @__PURE__ */ jsx(MenuItem, { onClick: handleMoreIconClose, children: t("common.export") })
+          }
+        )
+      ] })
+    ] })
+  ] }) });
+};
+export {
+  DashBoardHeader as default
+};
+//# sourceMappingURL=index.esm.js.map

package/dist/components/Dashboard/dashboard-header/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../../../src/components/Dashboard/dashboard-header.tsx"],"sourcesContent":["\nimport Typography from \"../typography/typography\";\nimport Chip from \"../chip/chip\";\nimport images from '../../assets/images';\nimport { useState } from \"react\";\nimport { IconButton, MenuItem } from '@mui/material';\nimport Menu from '../menu/menu';\nimport { useTranslation } from 'react-i18next';\nconst DashBoardHeader = ({ title, customElement, showEdit = true, showDropDowan = true }) => {\n    const { t } = useTranslation();\n    //Local State\n    const [isEditingMode, setIsEditingMode] = useState<boolean>(false);\n    const [anchorMoreEl, setAnchorMoreEl] = useState<\n        null | (EventTarget & HTMLButtonElement)\n    >(null);\n\n\n\n\n    const handleMoreIconClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        setAnchorMoreEl(event.currentTarget);\n    };\n\n    const handleMoreIconClose = () => {\n        setAnchorMoreEl(null);\n    };\n\n    //   const handleConfirm = () => {\n    //     setIsDiscardModalOpen(false);\n    //     setIsEditingMode(false);\n    //   };\n\n    //   const handleSaveChange = (event: SelectChangeEvent<unknown>) => {\n    //     setIsEditingMode(false);\n    //   };\n    return (\n        <div>\n            <div className='header-title'>\n                <Typography type='h3' weight={'medium'} color={'theme.secondary.1000'}>\n                    {title}\n                </Typography>\n                <div className='header-right-wrap'>\n\n                    {customElement}\n                    {showEdit && <Chip\n                        type='normal'\n                        label={isEditingMode ? t('manufacturing.dashboard.editing_dashboard_mode_label') : t('manufacturing.dashboard.edit_layout_mode_label')}\n                        className={`${isEditingMode ? 'edit-box' : 'edit-box edit-box--InActive'\n                            }`}\n                        icon={\n                            <img\n                                src={isEditingMode ? images.common.editIcon : images.edit}\n                                alt={t('common.edit')}\n                            />\n                        }\n                        onClick={() => setIsEditingMode(true)}\n                        active={isEditingMode}\n                    />\n                    }\n                    {\n                        showDropDowan && <div>\n                            <IconButton\n                                color='inherit'\n                                size='small'\n                                onClick={handleMoreIconClick}>\n                                <img src={images.more} alt={t('manufacturing.dashboard.more_icon_label')} />\n                            </IconButton>\n                            <Menu\n                                anchorEl={anchorMoreEl}\n                                open={Boolean(anchorMoreEl)}\n                                onClose={handleMoreIconClose}\n                                className='dropdown-inner calender-drp'>\n                                <MenuItem onClick={handleMoreIconClose}>{t('common.export')}</MenuItem>\n                            </Menu>\n                        </div>\n                    }\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default DashBoardHeader;\n"],"names":[],"mappings":";;;;;;;;;AAQA,MAAM,kBAAkB,CAAC,EAAE,OAAO,eAAe,WAAW,MAAM,gBAAgB,WAAW;AACzF,QAAM,EAAE,EAAA,IAAM,eAAA;AAEd,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAkB,KAAK;AACjE,QAAM,CAAC,cAAc,eAAe,IAAI,SAEtC,IAAI;AAKN,QAAM,sBAAsB,CAAC,UAA+C;AACxE,oBAAgB,MAAM,aAAa;AAAA,EACvC;AAEA,QAAM,sBAAsB,MAAM;AAC9B,oBAAgB,IAAI;AAAA,EACxB;AAUA,SACI,oBAAC,OAAA,EACG,UAAA,qBAAC,OAAA,EAAI,WAAU,gBACX,UAAA;AAAA,IAAA,oBAAC,cAAW,MAAK,MAAK,QAAQ,UAAU,OAAO,wBAC1C,UAAA,MAAA,CACL;AAAA,IACA,qBAAC,OAAA,EAAI,WAAU,qBAEV,UAAA;AAAA,MAAA;AAAA,MACA,YAAY;AAAA,QAAC;AAAA,QAAA;AAAA,UACV,MAAK;AAAA,UACL,OAAO,gBAAgB,EAAE,sDAAsD,IAAI,EAAE,gDAAgD;AAAA,UACrI,WAAW,GAAG,gBAAgB,aAAa,6BACvC;AAAA,UACJ,MACI;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,KAAK,gBAAgB,OAAO,OAAO,WAAW,OAAO;AAAA,cACrD,KAAK,EAAE,aAAa;AAAA,YAAA;AAAA,UAAA;AAAA,UAG5B,SAAS,MAAM,iBAAiB,IAAI;AAAA,UACpC,QAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,MAIR,sCAAkB,OAAA,EACd,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,OAAM;AAAA,YACN,MAAK;AAAA,YACL,SAAS;AAAA,YACT,UAAA,oBAAC,SAAI,KAAK,OAAO,MAAM,KAAK,EAAE,yCAAyC,EAAA,CAAG;AAAA,UAAA;AAAA,QAAA;AAAA,QAE9E;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,UAAU;AAAA,YACV,MAAM,QAAQ,YAAY;AAAA,YAC1B,SAAS;AAAA,YACT,WAAU;AAAA,YACV,8BAAC,UAAA,EAAS,SAAS,qBAAsB,UAAA,EAAE,eAAe,EAAA,CAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MAChE,EAAA,CACJ;AAAA,IAAA,EAAA,CAER;AAAA,EAAA,EAAA,CACJ,EAAA,CACJ;AAER;"}

package/dist/components/Dashboard/dashboard-header/index.js

@@ -0,0 +1,7 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../typography/typography/index.js"),i=require("../../chip/chip/index.js"),a=require("../../../images/index.js"),t=require("react"),n=require("../../menu/menu/index.js"),o=require("react-i18next"),s=require("../../../node_modules/@mui/material/IconButton/IconButton/index.js"),d=require("../../../node_modules/@mui/material/MenuItem/MenuItem/index.js");exports.default=({title:l,customElement:c,showEdit:u=!0,showDropDowan:m=!0})=>{const{t:h}=o.useTranslation(),[x,j]=t.useState(!1),[p,g]=t.useState(null),b=()=>{g(null)};/* @__PURE__ */
+return e.jsx("div",{children:/* @__PURE__ */e.jsxs("div",{className:"header-title",children:[
+/* @__PURE__ */e.jsx(r.Typography,{type:"h3",weight:"medium",color:"theme.secondary.1000",children:l}),
+/* @__PURE__ */e.jsxs("div",{className:"header-right-wrap",children:[c,u&&/* @__PURE__ */e.jsx(i.default,{type:"normal",label:h(x?"manufacturing.dashboard.editing_dashboard_mode_label":"manufacturing.dashboard.edit_layout_mode_label"),className:x?"edit-box":"edit-box edit-box--InActive",icon:/* @__PURE__ */e.jsx("img",{src:x?a.images.common.editIcon:a.images.edit,alt:h("common.edit")}),onClick:()=>j(!0),active:x}),m&&/* @__PURE__ */e.jsxs("div",{children:[
+/* @__PURE__ */e.jsx(s.default,{color:"inherit",size:"small",onClick:e=>{g(e.currentTarget)},children:/* @__PURE__ */e.jsx("img",{src:a.images.more,alt:h("manufacturing.dashboard.more_icon_label")})}),
+/* @__PURE__ */e.jsx(n.default,{anchorEl:p,open:Boolean(p),onClose:b,className:"dropdown-inner calender-drp",children:/* @__PURE__ */e.jsx(d.default,{onClick:b,children:h("common.export")})})]})]})]})})};
+//# sourceMappingURL=index.js.map

package/dist/components/Dashboard/dashboard-header/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/Dashboard/dashboard-header.tsx"],"sourcesContent":["\nimport Typography from \"../typography/typography\";\nimport Chip from \"../chip/chip\";\nimport images from '../../assets/images';\nimport { useState } from \"react\";\nimport { IconButton, MenuItem } from '@mui/material';\nimport Menu from '../menu/menu';\nimport { useTranslation } from 'react-i18next';\nconst DashBoardHeader = ({ title, customElement, showEdit = true, showDropDowan = true }) => {\n    const { t } = useTranslation();\n    //Local State\n    const [isEditingMode, setIsEditingMode] = useState<boolean>(false);\n    const [anchorMoreEl, setAnchorMoreEl] = useState<\n        null | (EventTarget & HTMLButtonElement)\n    >(null);\n\n\n\n\n    const handleMoreIconClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        setAnchorMoreEl(event.currentTarget);\n    };\n\n    const handleMoreIconClose = () => {\n        setAnchorMoreEl(null);\n    };\n\n    //   const handleConfirm = () => {\n    //     setIsDiscardModalOpen(false);\n    //     setIsEditingMode(false);\n    //   };\n\n    //   const handleSaveChange = (event: SelectChangeEvent<unknown>) => {\n    //     setIsEditingMode(false);\n    //   };\n    return (\n        <div>\n            <div className='header-title'>\n                <Typography type='h3' weight={'medium'} color={'theme.secondary.1000'}>\n                    {title}\n                </Typography>\n                <div className='header-right-wrap'>\n\n                    {customElement}\n                    {showEdit && <Chip\n                        type='normal'\n                        label={isEditingMode ? t('manufacturing.dashboard.editing_dashboard_mode_label') : t('manufacturing.dashboard.edit_layout_mode_label')}\n                        className={`${isEditingMode ? 'edit-box' : 'edit-box edit-box--InActive'\n                            }`}\n                        icon={\n                            <img\n                                src={isEditingMode ? images.common.editIcon : images.edit}\n                                alt={t('common.edit')}\n                            />\n                        }\n                        onClick={() => setIsEditingMode(true)}\n                        active={isEditingMode}\n                    />\n                    }\n                    {\n                        showDropDowan && <div>\n                            <IconButton\n                                color='inherit'\n                                size='small'\n                                onClick={handleMoreIconClick}>\n                                <img src={images.more} alt={t('manufacturing.dashboard.more_icon_label')} />\n                            </IconButton>\n                            <Menu\n                                anchorEl={anchorMoreEl}\n                                open={Boolean(anchorMoreEl)}\n                                onClose={handleMoreIconClose}\n                                className='dropdown-inner calender-drp'>\n                                <MenuItem onClick={handleMoreIconClose}>{t('common.export')}</MenuItem>\n                            </Menu>\n                        </div>\n                    }\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default DashBoardHeader;\n"],"names":["title","customElement","showEdit","showDropDowan","t","useTranslation","isEditingMode","setIsEditingMode","useState","anchorMoreEl","setAnchorMoreEl","handleMoreIconClose","jsx","children","jsxs","className","Typography","type","weight","color","Chip","label","icon","src","images","common","editIcon","edit","alt","onClick","active","IconButton","size","event","currentTarget","more","Menu","anchorEl","open","Boolean","onClose","MenuItem"],"mappings":"qeAQwB,EAAGA,QAAOC,gBAAeC,YAAW,EAAMC,iBAAgB,MAC9E,MAAMC,EAAEA,GAAMC,oBAEPC,EAAeC,GAAoBC,EAAAA,UAAkB,IACrDC,EAAcC,GAAmBF,EAAAA,SAEtC,MASIG,EAAsB,KACxBD,EAAgB;AAWpB,OACIE,EAAAA,IAAC,MAAA,CACGC,wBAAAC,EAAAA,KAAC,MAAA,CAAIC,UAAU,eACXF,SAAA;eAAAD,EAAAA,IAACI,EAAAA,YAAWC,KAAK,KAAKC,OAAQ,SAAUC,MAAO,uBAC1CN,SAAAb;iBAELc,KAAC,MAAA,CAAIC,UAAU,oBAEVF,SAAA,CAAAZ,EACAC,kBAAYU,EAAAA,IAACQ,EAAAA,QAAA,CACVH,KAAK,SACLI,MAAuBjB,EAAhBE,EAAkB,uDAA4D,kDACrFS,UAAcT,EAAgB,WAAa,8BAE3CgB,oBACIV,EAAAA,IAAC,MAAA,CACGW,IAAKjB,EAAgBkB,EAAAA,OAAOC,OAAOC,SAAWF,EAAAA,OAAOG,KACrDC,IAAKxB,EAAE,iBAGfyB,QAAS,IAAMtB,GAAiB,GAChCuB,OAAQxB,IAIRH,yBAAkB,MAAA,CACdU,SAAA;eAAAD,EAAAA,IAACmB,EAAAA,QAAA,CACGZ,MAAM,UACNa,KAAK,QACLH,QA7CCI,IACzBvB,EAAgBuB,EAAMC,gBA6CErB,wBAAAD,EAAAA,IAAC,OAAIW,IAAKC,SAAOW,KAAMP,IAAKxB,EAAE;eAElCQ,EAAAA,IAACwB,EAAAA,QAAA,CACGC,SAAU5B,EACV6B,KAAMC,QAAQ9B,GACd+B,QAAS7B,EACTI,UAAU,8BACVF,8BAAC4B,EAAAA,QAAA,CAASZ,QAASlB,EAAsBE,SAAAT,EAAE"}

package/dist/components/activityLog/activity-log/index.esm.js

@@ -0,0 +1,104 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+/* empty css                             */
+import { Typography } from "../../typography/typography/index.esm.js";
+import dayjs from "dayjs";
+import formatText from "../../../utils/format-text/index.esm.js";
+import { useTranslation } from "react-i18next";
+import Box from "../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import Timeline from "../../../node_modules/@mui/lab/Timeline/Timeline/index.esm.js";
+import TimelineItem from "../../../node_modules/@mui/lab/TimelineItem/TimelineItem/index.esm.js";
+import TimelineSeparator from "../../../node_modules/@mui/lab/TimelineSeparator/TimelineSeparator/index.esm.js";
+import TimelineDot from "../../../node_modules/@mui/lab/TimelineDot/TimelineDot/index.esm.js";
+import TimelineConnector from "../../../node_modules/@mui/lab/TimelineConnector/TimelineConnector/index.esm.js";
+import TimelineContent from "../../../node_modules/@mui/lab/TimelineContent/TimelineContent/index.esm.js";
+const ActivityTag = (props) => {
+  const { t } = useTranslation();
+  const { data } = props;
+  const formatDateTime = (date) => {
+    const formattedDate = dayjs(date).format("DD MMM, YYYY");
+    const formattedTime = dayjs(date).format("HH:mm");
+    return `${formattedDate} • ${formattedTime}`;
+  };
+  const actions = {
+    view: t("common.viewed_text"),
+    delete: t("common.deleted_text"),
+    create: t("common.created_text"),
+    update: t("common.updated_text")
+  };
+  return (
+    // <Box position='relative'>
+    /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Timeline, { className: "Timeline", children: /* @__PURE__ */ jsxs(
+      Box,
+      {
+        sx: {
+          display: "flex",
+          flexDirection: "column",
+          gap: 2,
+          padding: "16px"
+        },
+        className: "box-class",
+        children: [
+          /* @__PURE__ */ jsx(Typography, { type: "s3", weight: "medium", color: "theme.secondary.800", children: t("common.activities_label") }),
+          /* @__PURE__ */ jsx(
+            Box,
+            {
+              sx: {
+                height: 400,
+                overflowY: "auto",
+                gap: 1.5,
+                display: "flex",
+                flexDirection: "column"
+              },
+              children: data == null ? void 0 : data.map((item, index) => {
+                var _a;
+                return /* @__PURE__ */ jsx("div", { className: "Timeline--Activity", children: /* @__PURE__ */ jsxs(TimelineItem, { children: [
+                  /* @__PURE__ */ jsxs(TimelineSeparator, { children: [
+                    /* @__PURE__ */ jsx(
+                      TimelineDot,
+                      {
+                        color: "primary",
+                        sx: { backgroundColor: "#D3D3D4" }
+                      }
+                    ),
+                    data.length - 1 !== index && /* @__PURE__ */ jsx(TimelineConnector, {})
+                  ] }),
+                  /* @__PURE__ */ jsxs(TimelineContent, { className: "Timeline--Content", children: [
+                    /* @__PURE__ */ jsxs(
+                      Typography,
+                      {
+                        type: "s5",
+                        color: "theme.secondary.800",
+                        className: "Timeline--ActivityLogItem",
+                        children: [
+                          /* @__PURE__ */ jsx("b", { children: formatText(item.username) }),
+                          " ",
+                          actions[item.action],
+                          " ",
+                          /* @__PURE__ */ jsx("b", { children: formatText((_a = item.resource) == null ? void 0 : _a.replace("_", " ")) })
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      Typography,
+                      {
+                        type: "s5",
+                        color: "theme.secondary.800",
+                        className: "Timeline--ActivityLogItem",
+                        children: formatDateTime(item == null ? void 0 : item.created_at)
+                      }
+                    )
+                  ] })
+                ] }, index) });
+              })
+            }
+          )
+        ]
+      }
+    ) }) })
+  );
+};
+export {
+  ActivityTag,
+  ActivityTag as default
+};
+//# sourceMappingURL=index.esm.js.map

package/dist/components/activityLog/activity-log/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../../../src/components/activityLog/activity-log.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Box } from '@mui/material';\nimport Timeline from '@mui/lab/Timeline';\nimport TimelineItem from '@mui/lab/TimelineItem';\nimport TimelineSeparator from '@mui/lab/TimelineSeparator';\nimport TimelineConnector from '@mui/lab/TimelineConnector';\nimport TimelineContent from '@mui/lab/TimelineContent';\nimport TimelineDot from '@mui/lab/TimelineDot';\nimport './activity-log.scss';\nimport Typography from '../typography/typography';\nimport dayjs from 'dayjs';\nimport formatText from '../../utils/format-text';\nimport { useTranslation } from 'react-i18next';\n\nexport const ActivityTag = (props: any) => {\n\tconst { t } = useTranslation();\n\tconst { data } = props;\n\n\tconst formatDateTime = (date: Date): string => {\n\t\tconst formattedDate = dayjs(date).format('DD MMM, YYYY');\n\t\tconst formattedTime = dayjs(date).format('HH:mm');\n\t\treturn `${formattedDate} • ${formattedTime}`;\n\t};\n\n\tconst actions = {\n\t\tview: t('common.viewed_text'),\n\t\tdelete: t('common.deleted_text'),\n\t\tcreate: t('common.created_text'),\n\t\tupdate: t('common.updated_text')\n\t};\n\treturn (\n\t\t// <Box position='relative'>\n\t\t<Box>\n\t\t\t<Timeline className='Timeline'>\n\t\t\t\t<Box\n\t\t\t\t\tsx={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\tgap: 2,\n\t\t\t\t\t\tpadding: '16px'\n\t\t\t\t\t}}\n\t\t\t\t\tclassName='box-class'>\n\t\t\t\t\t<Typography type='s3' weight='medium' color='theme.secondary.800'>\n\t\t\t\t\t\t{t('common.activities_label')}\n\t\t\t\t\t</Typography>\n\t\t\t\t\t<Box\n\t\t\t\t\t\tsx={{\n\t\t\t\t\t\t\theight: 400,\n\t\t\t\t\t\t\toverflowY: 'auto',\n\t\t\t\t\t\t\tgap: 1.5,\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'column'\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\t{data?.map((item: any, index: number) => (\n\t\t\t\t\t\t\t<div className='Timeline--Activity'>\n\t\t\t\t\t\t\t\t<TimelineItem key={index}>\n\t\t\t\t\t\t\t\t\t<TimelineSeparator>\n\t\t\t\t\t\t\t\t\t\t<TimelineDot\n\t\t\t\t\t\t\t\t\t\t\tcolor='primary'\n\t\t\t\t\t\t\t\t\t\t\tsx={{ backgroundColor: '#D3D3D4' }}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t{data.length - 1 !== index && <TimelineConnector />}\n\t\t\t\t\t\t\t\t\t</TimelineSeparator>\n\t\t\t\t\t\t\t\t\t<TimelineContent className='Timeline--Content'>\n\t\t\t\t\t\t\t\t\t\t<Typography\n\t\t\t\t\t\t\t\t\t\t\ttype='s5'\n\t\t\t\t\t\t\t\t\t\t\tcolor='theme.secondary.800'\n\t\t\t\t\t\t\t\t\t\t\tclassName='Timeline--ActivityLogItem'>\n\t\t\t\t\t\t\t\t\t\t\t<b>{formatText(item.username)}</b> {actions[item.action]}{' '}\n\t\t\t\t\t\t\t\t\t\t\t<b>{formatText(item.resource?.replace('_', ' '))}</b>\n\t\t\t\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t\t\t\t\t<Typography\n\t\t\t\t\t\t\t\t\t\t\ttype='s5'\n\t\t\t\t\t\t\t\t\t\t\tcolor='theme.secondary.800'\n\t\t\t\t\t\t\t\t\t\t\tclassName='Timeline--ActivityLogItem'>\n\t\t\t\t\t\t\t\t\t\t\t{formatDateTime(item?.created_at)}\n\t\t\t\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t\t\t\t</TimelineContent>\n\t\t\t\t\t\t\t\t</TimelineItem>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</Box>\n\t\t\t\t</Box>\n\t\t\t</Timeline>\n\t\t</Box>\n\t\t// </Box>\n\t);\n};\n\nexport default ActivityTag;\n"],"names":[],"mappings":";;;;;;;;;;;;;AAeO,MAAM,cAAc,CAAC,UAAe;AAC1C,QAAM,EAAE,EAAA,IAAM,eAAA;AACd,QAAM,EAAE,SAAS;AAEjB,QAAM,iBAAiB,CAAC,SAAuB;AAC9C,UAAM,gBAAgB,MAAM,IAAI,EAAE,OAAO,cAAc;AACvD,UAAM,gBAAgB,MAAM,IAAI,EAAE,OAAO,OAAO;AAChD,WAAO,GAAG,aAAa,MAAM,aAAa;AAAA,EAC3C;AAEA,QAAM,UAAU;AAAA,IACf,MAAM,EAAE,oBAAoB;AAAA,IAC5B,QAAQ,EAAE,qBAAqB;AAAA,IAC/B,QAAQ,EAAE,qBAAqB;AAAA,IAC/B,QAAQ,EAAE,qBAAqB;AAAA,EAAA;AAEhC;AAAA;AAAA,IAEC,oBAAC,KAAA,EACA,UAAA,oBAAC,UAAA,EAAS,WAAU,YACnB,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACA,IAAI;AAAA,UACH,SAAS;AAAA,UACT,eAAe;AAAA,UACf,KAAK;AAAA,UACL,SAAS;AAAA,QAAA;AAAA,QAEV,WAAU;AAAA,QACV,UAAA;AAAA,UAAA,oBAAC,YAAA,EAAW,MAAK,MAAK,QAAO,UAAS,OAAM,uBAC1C,UAAA,EAAE,yBAAyB,EAAA,CAC7B;AAAA,UACA;AAAA,YAAC;AAAA,YAAA;AAAA,cACA,IAAI;AAAA,gBACH,QAAQ;AAAA,gBACR,WAAW;AAAA,gBACX,KAAK;AAAA,gBACL,SAAS;AAAA,gBACT,eAAe;AAAA,cAAA;AAAA,cAEf,UAAA,6BAAM,IAAI,CAAC,MAAW,UAAA;;2CACrB,OAAA,EAAI,WAAU,sBACd,UAAA,qBAAC,cAAA,EACA,UAAA;AAAA,kBAAA,qBAAC,mBAAA,EACA,UAAA;AAAA,oBAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACA,OAAM;AAAA,wBACN,IAAI,EAAE,iBAAiB,UAAA;AAAA,sBAAU;AAAA,oBAAA;AAAA,oBAEjC,KAAK,SAAS,MAAM,6BAAU,mBAAA,CAAA,CAAkB;AAAA,kBAAA,GAClD;AAAA,kBACA,qBAAC,iBAAA,EAAgB,WAAU,qBAC1B,UAAA;AAAA,oBAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACA,MAAK;AAAA,wBACL,OAAM;AAAA,wBACN,WAAU;AAAA,wBACV,UAAA;AAAA,0BAAA,oBAAC,KAAA,EAAG,UAAA,WAAW,KAAK,QAAQ,GAAE;AAAA,0BAAI;AAAA,0BAAE,QAAQ,KAAK,MAAM;AAAA,0BAAG;AAAA,0BAC1D,oBAAC,OAAG,UAAA,YAAW,UAAK,aAAL,mBAAe,QAAQ,KAAK,IAAI,EAAA,CAAE;AAAA,wBAAA;AAAA,sBAAA;AAAA,oBAAA;AAAA,oBAElD;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACA,MAAK;AAAA,wBACL,OAAM;AAAA,wBACN,WAAU;AAAA,wBACT,UAAA,eAAe,6BAAM,UAAU;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACjC,EAAA,CACD;AAAA,gBAAA,EAAA,GAtBkB,KAuBnB,GACD;AAAA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA,GAEF,EAAA,CACD;AAAA;AAGF;"}

package/dist/components/activityLog/activity-log/index.js

@@ -0,0 +1,14 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");;/* empty css                          */var i=,/* empty css                                 */t=require("dayjs"),l=,/* empty css                                */r=require("react-i18next"),n=,/* empty css                                                 */a=,/* empty css                                                      */o=,/* empty css                                                              */s=,/* empty css                                                                        */d=,/* empty css                                                            */m=,/* empty css                                                                        */u=;/* empty css                                                                    */function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=/* @__PURE__ */c(t);const p=t=>{const{t:c}=r.useTranslation(),{data:p}=t,j={view:c("common.viewed_text"),delete:c("common.deleted_text"),create:c("common.created_text"),update:c("common.updated_text")};
+/* @__PURE__ */
+return e.jsx(n.default,{children:/* @__PURE__ */e.jsx(a.default,{className:"Timeline",children:/* @__PURE__ */e.jsxs(n.default,{sx:{display:"flex",flexDirection:"column",gap:2,padding:"16px"},className:"box-class",children:[
+/* @__PURE__ */e.jsx(i.Typography,{type:"s3",weight:"medium",color:"theme.secondary.800",children:c("common.activities_label")}),
+/* @__PURE__ */e.jsx(n.default,{sx:{height:400,overflowY:"auto",gap:1.5,display:"flex",flexDirection:"column"},children:null==p?void 0:p.map((t,r)=>{var n,a;/* @__PURE__ */
+return e.jsx("div",{className:"Timeline--Activity",children:/* @__PURE__ */e.jsxs(o.default,{children:[
+/* @__PURE__ */e.jsxs(s.default,{children:[
+/* @__PURE__ */e.jsx(d.default,{color:"primary",sx:{backgroundColor:"#D3D3D4"}}),p.length-1!==r&&/* @__PURE__ */e.jsx(m.default,{})]}),
+/* @__PURE__ */e.jsxs(u.default,{className:"Timeline--Content",children:[
+/* @__PURE__ */e.jsxs(i.Typography,{type:"s5",color:"theme.secondary.800",className:"Timeline--ActivityLogItem",children:[
+/* @__PURE__ */e.jsx("b",{children:l.default(t.username)})," ",j[t.action]," ",
+/* @__PURE__ */e.jsx("b",{children:l.default(null==(n=t.resource)?void 0:n.replace("_"," "))})]}),
+/* @__PURE__ */e.jsx(i.Typography,{type:"s5",color:"theme.secondary.800",className:"Timeline--ActivityLogItem",children:(a=null==t?void 0:t.created_at,`${x.default(a).format("DD MMM, YYYY")} • ${x.default(a).format("HH:mm")}`)})]})]},r)})})})]})})})};exports.ActivityTag=p,exports.default=p;
+//# sourceMappingURL=index.js.map

package/dist/components/activityLog/activity-log/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/activityLog/activity-log.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Box } from '@mui/material';\nimport Timeline from '@mui/lab/Timeline';\nimport TimelineItem from '@mui/lab/TimelineItem';\nimport TimelineSeparator from '@mui/lab/TimelineSeparator';\nimport TimelineConnector from '@mui/lab/TimelineConnector';\nimport TimelineContent from '@mui/lab/TimelineContent';\nimport TimelineDot from '@mui/lab/TimelineDot';\nimport './activity-log.scss';\nimport Typography from '../typography/typography';\nimport dayjs from 'dayjs';\nimport formatText from '../../utils/format-text';\nimport { useTranslation } from 'react-i18next';\n\nexport const ActivityTag = (props: any) => {\n\tconst { t } = useTranslation();\n\tconst { data } = props;\n\n\tconst formatDateTime = (date: Date): string => {\n\t\tconst formattedDate = dayjs(date).format('DD MMM, YYYY');\n\t\tconst formattedTime = dayjs(date).format('HH:mm');\n\t\treturn `${formattedDate} • ${formattedTime}`;\n\t};\n\n\tconst actions = {\n\t\tview: t('common.viewed_text'),\n\t\tdelete: t('common.deleted_text'),\n\t\tcreate: t('common.created_text'),\n\t\tupdate: t('common.updated_text')\n\t};\n\treturn (\n\t\t// <Box position='relative'>\n\t\t<Box>\n\t\t\t<Timeline className='Timeline'>\n\t\t\t\t<Box\n\t\t\t\t\tsx={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\tgap: 2,\n\t\t\t\t\t\tpadding: '16px'\n\t\t\t\t\t}}\n\t\t\t\t\tclassName='box-class'>\n\t\t\t\t\t<Typography type='s3' weight='medium' color='theme.secondary.800'>\n\t\t\t\t\t\t{t('common.activities_label')}\n\t\t\t\t\t</Typography>\n\t\t\t\t\t<Box\n\t\t\t\t\t\tsx={{\n\t\t\t\t\t\t\theight: 400,\n\t\t\t\t\t\t\toverflowY: 'auto',\n\t\t\t\t\t\t\tgap: 1.5,\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'column'\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\t{data?.map((item: any, index: number) => (\n\t\t\t\t\t\t\t<div className='Timeline--Activity'>\n\t\t\t\t\t\t\t\t<TimelineItem key={index}>\n\t\t\t\t\t\t\t\t\t<TimelineSeparator>\n\t\t\t\t\t\t\t\t\t\t<TimelineDot\n\t\t\t\t\t\t\t\t\t\t\tcolor='primary'\n\t\t\t\t\t\t\t\t\t\t\tsx={{ backgroundColor: '#D3D3D4' }}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t{data.length - 1 !== index && <TimelineConnector />}\n\t\t\t\t\t\t\t\t\t</TimelineSeparator>\n\t\t\t\t\t\t\t\t\t<TimelineContent className='Timeline--Content'>\n\t\t\t\t\t\t\t\t\t\t<Typography\n\t\t\t\t\t\t\t\t\t\t\ttype='s5'\n\t\t\t\t\t\t\t\t\t\t\tcolor='theme.secondary.800'\n\t\t\t\t\t\t\t\t\t\t\tclassName='Timeline--ActivityLogItem'>\n\t\t\t\t\t\t\t\t\t\t\t<b>{formatText(item.username)}</b> {actions[item.action]}{' '}\n\t\t\t\t\t\t\t\t\t\t\t<b>{formatText(item.resource?.replace('_', ' '))}</b>\n\t\t\t\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t\t\t\t\t<Typography\n\t\t\t\t\t\t\t\t\t\t\ttype='s5'\n\t\t\t\t\t\t\t\t\t\t\tcolor='theme.secondary.800'\n\t\t\t\t\t\t\t\t\t\t\tclassName='Timeline--ActivityLogItem'>\n\t\t\t\t\t\t\t\t\t\t\t{formatDateTime(item?.created_at)}\n\t\t\t\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t\t\t\t</TimelineContent>\n\t\t\t\t\t\t\t\t</TimelineItem>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</Box>\n\t\t\t\t</Box>\n\t\t\t</Timeline>\n\t\t</Box>\n\t\t// </Box>\n\t);\n};\n\nexport default ActivityTag;\n"],"names":["ActivityTag","props","t","useTranslation","data","actions","view","delete","create","update","jsx","Box","children","Timeline","className","jsxs","sx","display","flexDirection","gap","padding","Typography","type","weight","color","height","overflowY","map","item","index","date","TimelineItem","TimelineSeparator","TimelineDot","backgroundColor","length","TimelineConnector","TimelineContent","formatText","username","action","_a","resource","replace","created_at","dayjs","format"],"mappings":"m7BAeO,MAAMA,EAAeC,IAC3B,MAAMC,EAAEA,GAAMC,oBACRC,KAAEA,GAASH,EAQXI,EAAU,CACfC,KAAMJ,EAAE,sBACRK,OAAQL,EAAE,uBACVM,OAAQN,EAAE,uBACVO,OAAQP,EAAE;;AAEX,OAECQ,MAACC,EAAAA,QAAA,CACAC,wBAAAF,EAAAA,IAACG,EAAAA,QAAA,CAASC,UAAU,WACnBF,wBAAAG,EAAAA,KAACJ,EAAAA,QAAA,CACAK,GAAI,CACHC,QAAS,OACTC,cAAe,SACfC,IAAK,EACLC,QAAS,QAEVN,UAAU,YACVF,SAAA;eAAAF,EAAAA,IAACW,EAAAA,WAAA,CAAWC,KAAK,KAAKC,OAAO,SAASC,MAAM,sBAC1CZ,SAAAV,EAAE;eAEJQ,EAAAA,IAACC,EAAAA,QAAA,CACAK,GAAI,CACHS,OAAQ,IACRC,UAAW,OACXP,IAAK,IACLF,QAAS,OACTC,cAAe,UAEfN,SAAA,MAAAR,OAAA,EAAAA,EAAMuB,IAAI,CAACC,EAAWC,WAnCJC;aAoCjB,MAAA,CAAIhB,UAAU,qBACdF,wBAAAG,EAAAA,KAACgB,EAAAA,QAAA,CACAnB,SAAA;eAAAG,OAACiB,EAAAA,QAAA,CACApB,SAAA;eAAAF,EAAAA,IAACuB,EAAAA,QAAA,CACAT,MAAM,UACNR,GAAI,CAAEkB,gBAAiB,aAEvB9B,EAAK+B,OAAS,IAAMN,wBAAUO,EAAAA,QAAA,CAAA;iBAEhCrB,KAACsB,EAAAA,QAAA,CAAgBvB,UAAU,oBAC1BF,SAAA;eAAAG,EAAAA,KAACM,EAAAA,WAAA,CACAC,KAAK,KACLE,MAAM,sBACNV,UAAU,4BACVF,SAAA;eAAAF,EAAAA,IAAC,IAAA,CAAGE,SAAA0B,EAAAA,QAAWV,EAAKW,YAAc,IAAElC,EAAQuB,EAAKY,QAAS;eAC1D9B,EAAAA,IAAC,KAAGE,SAAA0B,UAAW,OAAAG,EAAAb,EAAKc,eAAL,EAAAD,EAAeE,QAAQ,IAAK;eAE5CjC,EAAAA,IAACW,EAAAA,WAAA,CACAC,KAAK,KACLE,MAAM,sBACNV,UAAU,4BACTF,UAzDakB,EAyDE,MAAAF,OAAA,EAAAA,EAAMgB,WAtDxB,GAFeC,EAAAA,QAAMf,GAAMgB,OAAO,qBACnBD,EAAAA,QAAMf,GAAMgB,OAAO,mBAmChBjB"}

package/dist/components/charts/ChartLegends/index.esm.js

@@ -0,0 +1,31 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Typography } from "../../typography/typography/index.esm.js";
+/* empty css                            */
+import Box from "../../../node_modules/@mui/material/Box/Box/index.esm.js";
+function ChartLegends({ legends, colors }) {
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      sx: {
+        display: "flex",
+        justifyContent: "center",
+        alignContent: "space-between"
+      },
+      children: legends.map((legend, index) => /* @__PURE__ */ jsxs("div", { style: { marginLeft: "20px", display: "flex" }, children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "legends-circle",
+            style: { backgroundColor: colors[index] }
+          }
+        ),
+        /* @__PURE__ */ jsx(Typography, { type: "s5", sx: { color: "#656669" }, children: legend })
+      ] }))
+    }
+  );
+}
+export {
+  ChartLegends,
+  ChartLegends as default
+};
+//# sourceMappingURL=index.esm.js.map

package/dist/components/charts/ChartLegends/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../../../src/components/charts/ChartLegends.tsx"],"sourcesContent":["import { Box } from '@mui/material';\nimport Typography from '../typography/typography';\nimport './chartLegend.scss';\ninterface IProps {\n\tlegends: string[];\n\tcolors: string[];\n}\nexport function ChartLegends({ legends, colors }: IProps) {\n\treturn (\n\t\t<Box\n\t\t\tsx={{\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tjustifyContent: 'center',\n\t\t\t\talignContent: 'space-between'\n\t\t\t}}>\n\t\t\t{legends.map((legend, index) => (\n\t\t\t\t<div style={{ marginLeft: '20px', display: 'flex' }}>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName='legends-circle'\n\t\t\t\t\t\tstyle={{ backgroundColor: colors[index] }}></div>\n\t\t\t\t\t<Typography type='s5' sx={{ color: '#656669' }}>\n\t\t\t\t\t\t{legend}\n\t\t\t\t\t</Typography>\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</Box>\n\t);\n}\n\nexport default ChartLegends\n"],"names":[],"mappings":";;;;AAOO,SAAS,aAAa,EAAE,SAAS,UAAkB;AACzD,SACC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,IAAI;AAAA,QACH,SAAS;AAAA,QACT,gBAAgB;AAAA,QAChB,cAAc;AAAA,MAAA;AAAA,MAEd,UAAA,QAAQ,IAAI,CAAC,QAAQ,UACrB,qBAAC,OAAA,EAAI,OAAO,EAAE,YAAY,QAAQ,SAAS,UAC1C,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACA,WAAU;AAAA,YACV,OAAO,EAAE,iBAAiB,OAAO,KAAK,EAAA;AAAA,UAAE;AAAA,QAAA;AAAA,QACzC,oBAAC,cAAW,MAAK,MAAK,IAAI,EAAE,OAAO,UAAA,GACjC,UAAA,OAAA,CACF;AAAA,MAAA,GACD,CACA;AAAA,IAAA;AAAA,EAAA;AAGJ;"}

package/dist/components/charts/ChartLegends/index.js

@@ -0,0 +1,5 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=;/* empty css                                 */;/* empty css                         */var s=;/* empty css                                                 */function t({legends:t,colors:n}){/* @__PURE__ */
+return e.jsx(s.default,{sx:{display:"flex",justifyContent:"center",alignContent:"space-between"},children:t.map((s,t)=>/* @__PURE__ */e.jsxs("div",{style:{marginLeft:"20px",display:"flex"},children:[
+/* @__PURE__ */e.jsx("div",{className:"legends-circle",style:{backgroundColor:n[t]}}),
+/* @__PURE__ */e.jsx(r.Typography,{type:"s5",sx:{color:"#656669"},children:s})]}))})}exports.ChartLegends=t,exports.default=t;
+//# sourceMappingURL=index.js.map

package/dist/components/charts/ChartLegends/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/charts/ChartLegends.tsx"],"sourcesContent":["import { Box } from '@mui/material';\nimport Typography from '../typography/typography';\nimport './chartLegend.scss';\ninterface IProps {\n\tlegends: string[];\n\tcolors: string[];\n}\nexport function ChartLegends({ legends, colors }: IProps) {\n\treturn (\n\t\t<Box\n\t\t\tsx={{\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tjustifyContent: 'center',\n\t\t\t\talignContent: 'space-between'\n\t\t\t}}>\n\t\t\t{legends.map((legend, index) => (\n\t\t\t\t<div style={{ marginLeft: '20px', display: 'flex' }}>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName='legends-circle'\n\t\t\t\t\t\tstyle={{ backgroundColor: colors[index] }}></div>\n\t\t\t\t\t<Typography type='s5' sx={{ color: '#656669' }}>\n\t\t\t\t\t\t{legend}\n\t\t\t\t\t</Typography>\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</Box>\n\t);\n}\n\nexport default ChartLegends\n"],"names":["ChartLegends","legends","colors","jsx","Box","sx","display","justifyContent","alignContent","children","map","legend","index","jsxs","style","marginLeft","className","backgroundColor","Typography","type","color"],"mappings":"uQAOO,SAASA,GAAaC,QAAEA,EAAAC,OAASA;AACvC,OACCC,EAAAA,IAACC,EAAAA,QAAA,CACAC,GAAI,CACHC,QAAS,OACTC,eAAgB,SAChBC,aAAc,iBAEdC,SAAAR,EAAQS,IAAI,CAACC,EAAQC,mBACrBC,EAAAA,KAAC,MAAA,CAAIC,MAAO,CAAEC,WAAY,OAAQT,QAAS,QAC1CG,SAAA;eAAAN,EAAAA,IAAC,MAAA,CACAa,UAAU,iBACVF,MAAO,CAAEG,gBAAiBf,EAAOU;eAClCT,EAAAA,IAACe,EAAAA,YAAWC,KAAK,KAAKd,GAAI,CAAEe,MAAO,WACjCX,SAAAE,SAMP"}

package/dist/components/charts/areaLinerChart/index.esm.js

@@ -0,0 +1,110 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useRef, useState, useEffect } from "react";
+import linear from "../../../node_modules/d3-scale/src/linear/index.esm.js";
+import max from "../../../node_modules/d3-array/src/max/index.esm.js";
+import Box from "../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import select from "../../../node_modules/d3-selection/src/select/index.esm.js";
+import { point } from "../../../node_modules/d3-scale/src/band/index.esm.js";
+import { axisBottom, axisLeft } from "../../../node_modules/d3-axis/src/axis/index.esm.js";
+import area from "../../../node_modules/d3-shape/src/area/index.esm.js";
+import line from "../../../node_modules/d3-shape/src/line/index.esm.js";
+import { format } from "../../../node_modules/d3-format/src/defaultLocale/index.esm.js";
+import { monotoneX } from "../../../node_modules/d3-shape/src/curve/monotone/index.esm.js";
+import curveLinear from "../../../node_modules/d3-shape/src/curve/linear/index.esm.js";
+const formatNumber = (num, symbol, labelType) => {
+  if (labelType === "inPercent") {
+    return `${format(".0%")(num / 100)}`;
+  } else if (labelType === "inValue") {
+    return `${symbol || ""} ${format(".2s")(num).replace("k", "K")}`;
+  }
+  return num.toString();
+};
+const AreaLineChart = ({ data, height = 400, customLabelFormatter, yAxisLabelType = "inValue", currency, colors, customLegend }) => {
+  const svgRef = useRef(null);
+  const wrapperRef = useRef(null);
+  const [containerWidth, setContainerWidth] = useState(0);
+  const [tooltipData, setTooltipData] = useState(null);
+  useEffect(() => {
+    const wrapper = wrapperRef.current;
+    const resizeObserver = new ResizeObserver((entries) => {
+      if (entries[0]) {
+        const newWidth = entries[0].contentRect.width;
+        setContainerWidth(newWidth);
+      }
+    });
+    if (wrapper) {
+      resizeObserver.observe(wrapper);
+    }
+    return () => {
+      if (wrapper) {
+        resizeObserver.unobserve(wrapper);
+      }
+    };
+  }, []);
+  useEffect(() => {
+    if (containerWidth === 0) return;
+    const margin = { top: 20, right: 30, bottom: 30, left: 40 };
+    const width = containerWidth - margin.left - margin.right;
+    const chartHeight = height - margin.top - margin.bottom;
+    select(svgRef.current).selectAll("*").remove();
+    const svg = select(svgRef.current).attr("width", containerWidth).attr("height", height).append("g").attr("transform", `translate(${margin.left},${margin.top})`);
+    const x = point().domain(data[0].values.map((d) => d.month)).range([0, width]);
+    const y = linear().domain([0, max(data, (dataset) => max(dataset.values, (d) => d.value))]).range([chartHeight, 0]);
+    const numTicks = Math.floor(width / 80);
+    const xAxis = axisBottom(x).ticks(numTicks);
+    const xAxisGroup = svg.append("g").attr("transform", `translate(0,${chartHeight})`).call(xAxis);
+    xAxisGroup.selectAll("text").attr("transform", "translate(0, 10)").attr("color", "#8E8E93").style("text-anchor", "middle");
+    const yAxis = svg.append("g");
+    yAxis.append("g").attr("color", "#8E8E93").attr("transform", `translate(-10,0)`).call(axisLeft(y).tickSize(-width).tickFormat(
+      (d) => customLabelFormatter ? customLabelFormatter(d) : formatNumber(d, currency, yAxisLabelType)
+    ).tickSizeOuter(0)).selectAll("line").attr("stroke-dasharray", "3,3").attr("stroke", "#D3D3D4");
+    xAxisGroup.selectAll(".tick line").remove();
+    yAxis.select(".domain").attr("stroke", "none");
+    xAxisGroup.select(".domain").attr("stroke", "none");
+    const line$1 = (isSmooth) => line().x((d) => x(d.month)).y((d) => y(d.value)).curve(isSmooth ? monotoneX : curveLinear);
+    const area$1 = area().x((d) => x(d.month)).y0(chartHeight).y1((d) => y(d.value));
+    data.forEach((dataset, i) => {
+      const gradient = svg.append("defs").append("linearGradient").attr("id", `area-gradient-${i}`).attr("x1", "0%").attr("x2", "0%").attr("y1", "0%").attr("y2", "100%");
+      gradient.append("stop").attr("offset", "0%").attr("stop-color", colors[i]).attr("stop-opacity", 0.4);
+      gradient.append("stop").attr("offset", "100%").attr("stop-color", colors[i]).attr("stop-opacity", 0.1);
+      svg.append("path").datum(dataset.values).attr("fill", `url(#area-gradient-${i})`).attr("d", area$1);
+      svg.append("path").datum(dataset.values).attr("fill", "none").attr("stroke", colors[i]).attr("stroke-width", 2).attr("d", line$1(dataset.isSmooth || false));
+      {
+        (dataset == null ? void 0 : dataset.showCircle) && svg.selectAll(`circle-${i}`).data(dataset.values).enter().append("circle").attr("cx", (d) => x(d.month)).attr("cy", (d) => y(d.value)).attr("r", 5).attr("fill", colors[i]).attr("stroke", "#fff").style("cursor", "pointer").on("mouseover", function(event, d) {
+          setTooltipData({
+            x: `${event.pageX + 10}px`,
+            y: `${event.pageY - 30}px`,
+            content: `${dataset.name}: ${d.value}`
+          });
+          select(this).transition().attr("r", 7).attr("fill", "#ff4500");
+        }).on("mouseout", function() {
+          setTooltipData(null);
+          select(this).transition().attr("r", 5).attr("fill", colors[i]);
+        });
+      }
+    });
+  }, [data, containerWidth, height, customLabelFormatter, yAxisLabelType, currency, colors, customLegend]);
+  return /* @__PURE__ */ jsxs("div", { ref: wrapperRef, style: { width: "100%", height: "100%" }, children: [
+    /* @__PURE__ */ jsxs("div", { style: { position: "relative" }, children: [
+      /* @__PURE__ */ jsx("svg", { ref: svgRef, width: "100%", height }),
+      customLegend && customLegend
+    ] }),
+    tooltipData && /* @__PURE__ */ jsx(Box, { sx: {
+      position: "absolute",
+      left: tooltipData.x,
+      top: tooltipData.y,
+      pointerEvents: "none",
+      backgroundColor: "#2EB273",
+      zIndex: "99999",
+      border: "none",
+      borderRadius: "3px",
+      transform: "translate(-50%, -100%)",
+      padding: "2px 6px 2px 6px",
+      gap: "10px"
+    }, children: /* @__PURE__ */ jsx("span", { style: { fontSize: "16px", weight: "500", color: "#ffff" }, children: tooltipData.content }) })
+  ] });
+};
+export {
+  AreaLineChart as default
+};
+//# sourceMappingURL=index.esm.js.map

package/dist/components/charts/areaLinerChart/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../../../src/components/charts/areaLinerChart.tsx"],"sourcesContent":["import { Box } from '@mui/material';\nimport * as d3 from 'd3';\nimport { useEffect, useRef, useState } from 'react';\n\ninterface IChartProps {\n    data: { name: string, values: { month: string, value: number }[], isSmooth?: boolean }[],\n    height: number,\n    yAxisLabelType?: 'inPercent' | 'inValue' | 'custom';\n    customLabelFormatter?: (value: number) => string;\n    currency?: string;\n    colors?: string[];\n    customLegend: React.ReactNode\n}\n\nconst formatNumber = (num: number, symbol: string, labelType: string) => {\n    if (labelType === 'inPercent') {\n        return `${d3.format(\".0%\")(num / 100)}`;\n    } else if (labelType === 'inValue') {\n        return `${symbol || ''} ${d3.format(\".2s\")(num).replace('k', 'K')}`;\n    }\n    return num.toString();\n};\n\nconst AreaLineChart = ({ data, height = 400, customLabelFormatter, yAxisLabelType = 'inValue', currency, colors, customLegend }: IChartProps) => {\n    const svgRef = useRef<SVGSVGElement | null>(null);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const [containerWidth, setContainerWidth] = useState<number>(0);\n    const [tooltipData, setTooltipData] = useState<any>(null);\n    useEffect(() => {\n        const wrapper = wrapperRef.current;\n\n        const resizeObserver = new ResizeObserver((entries) => {\n            if (entries[0]) {\n                const newWidth = entries[0].contentRect.width;\n                setContainerWidth(newWidth);\n            }\n        });\n\n        if (wrapper) {\n            resizeObserver.observe(wrapper);\n        }\n\n        return () => {\n            if (wrapper) {\n                resizeObserver.unobserve(wrapper);\n            }\n        };\n    }, []);\n\n    useEffect(() => {\n        if (containerWidth === 0) return; // Wait for the container width\n\n        const margin = { top: 20, right: 30, bottom: 30, left: 40 };\n        const width = containerWidth - margin.left - margin.right;\n        const chartHeight = height - margin.top - margin.bottom;\n\n        // Clear the SVG\n        d3.select(svgRef.current).selectAll('*').remove();\n\n        const svg = d3\n            .select(svgRef.current)\n            .attr('width', containerWidth)\n            .attr('height', height)\n            .append('g')\n            .attr('transform', `translate(${margin.left},${margin.top})`);\n\n        // Define scales\n        const x = d3\n            .scalePoint()\n            .domain(data[0].values.map(d => d.month)) // Assuming all datasets share the same x-domain\n            .range([0, width]);\n\n        const y = d3\n            .scaleLinear()\n            .domain([0, d3.max(data, dataset => d3.max(dataset.values, d => d.value))!]) // Max value across all datasets\n            .range([chartHeight, 0]);\n\n        // Limit x-axis ticks dynamically based on width\n        const numTicks = Math.floor(width / 80); // Adjust the factor (80) based on chart width\n        const xAxis = d3.axisBottom(x).ticks(numTicks);\n\n        const xAxisGroup = svg.append('g')\n            .attr('transform', `translate(0,${chartHeight})`)\n            .call(xAxis);\n\n        xAxisGroup.selectAll(\"text\")\n            .attr(\"transform\", \"translate(0, 10)\")\n            .attr('color', '#8E8E93')\n            .style(\"text-anchor\", \"middle\");\n\n        // Y Axis\n        const yAxis = svg.append('g')\n        yAxis.append('g').attr('color', '#8E8E93').attr(\"transform\", `translate(-10,0)`)\n            .call(d3.axisLeft(y).tickSize(-width).tickFormat((d: any) =>\n                customLabelFormatter\n                    ? customLabelFormatter(d)\n                    : formatNumber(d, currency, yAxisLabelType)\n            ).tickSizeOuter(0) as any)\n            .selectAll('line')\n            .attr('stroke-dasharray', '3,3')\n            .attr('stroke', '#D3D3D4');\n\n        xAxisGroup.selectAll(\".tick line\").remove();\n        yAxis.select(\".domain\").attr(\"stroke\", \"none\");\n        xAxisGroup.select(\".domain\").attr(\"stroke\", \"none\");\n\n        // Define color scale for lines\n        // const color = d3.scaleOrdinal(d3.schemeCategory10);\n\n        // Line and area generators\n        const line = (isSmooth: boolean) => d3.line<any>()\n            .x(d => x(d.month)!)\n            .y(d => y(d.value))\n            .curve(isSmooth ? d3.curveMonotoneX : d3.curveLinear);  // Conditionally smooth the line\n\n        const area = d3.area<any>()\n            .x(d => x(d.month)!)\n            .y0(chartHeight)\n            .y1(d => y(d.value));\n\n        // Iterate over each dataset to create lines and areas\n        data.forEach((dataset, i) => {\n            // const datasetColor = color(i.toString());\n\n            // Create gradient for each area\n            const gradient = svg.append('defs')\n                .append('linearGradient')\n                .attr('id', `area-gradient-${i}`)\n                .attr('x1', '0%')\n                .attr('x2', '0%')\n                .attr('y1', '0%')\n                .attr('y2', '100%');\n\n            gradient.append('stop')\n                .attr('offset', '0%')\n                .attr('stop-color', colors[i])\n                .attr('stop-opacity', 0.4);\n\n            gradient.append('stop')\n                .attr('offset', '100%')\n                .attr('stop-color', colors[i])\n                .attr('stop-opacity', 0.1);\n\n            // Append the area with gradient\n            svg.append('path')\n                .datum(dataset.values)\n                .attr('fill', `url(#area-gradient-${i})`)\n                .attr('d', area);\n\n            // Append the line with smoothness condition\n            svg.append('path')\n                .datum(dataset.values)\n                .attr('fill', 'none')\n                .attr('stroke', colors[i])\n                .attr('stroke-width', 2)\n                .attr('d', line(dataset.isSmooth || false));  // Use smoothness from the dataset\n\n            // Append circles for hover effect\n            {\n                dataset?.showCircle &&\n                    svg.selectAll(`circle-${i}`)\n                        .data(dataset.values)\n                        .enter()\n                        .append('circle')\n                        .attr('cx', d => x(d.month)!)\n                        .attr('cy', d => y(d.value))\n                        .attr('r', 5)\n                        .attr('fill', colors[i])\n                        .attr('stroke', '#fff')\n                        .style('cursor', 'pointer')\n                        .on('mouseover', function (event, d) {\n                            setTooltipData({\n                                x: `${event.pageX + 10}px`,\n                                y: `${event.pageY - 30}px`,\n                                content: `${dataset.name}: ${d.value}`\n                            });\n                            d3.select(this).transition().attr('r', 7).attr('fill', '#ff4500');\n                        })\n                        .on('mouseout', function () {\n                            setTooltipData(null);\n                            d3.select(this).transition().attr('r', 5).attr('fill', colors[i]);\n                        });\n            }\n\n        });\n\n    }, [data, containerWidth, height, customLabelFormatter, yAxisLabelType, currency, colors, customLegend]);\n\n    return (\n        <div ref={wrapperRef} style={{ width: '100%', height: '100%' }}>\n            <div style={{ position: 'relative' }}>\n                <svg ref={svgRef} width=\"100%\" height={height} />\n                {\n                    customLegend &&\n                    customLegend\n\n                }\n            </div>\n            {tooltipData &&\n                <Box sx={{\n                    position: 'absolute',\n                    left: tooltipData.x,\n                    top: tooltipData.y,\n                    pointerEvents: 'none',\n                    backgroundColor: '#2EB273',\n                    zIndex: '99999',\n                    border: 'none',\n                    borderRadius: '3px',\n                    transform: 'translate(-50%, -100%)',\n                    padding: '2px 6px 2px 6px',\n                    gap: '10px'\n                }}>\n                    <span style={{ fontSize: '16px', weight: '500', color: '#ffff' }}>\n                        {tooltipData.content}\n                    </span>\n                </Box>\n            }\n        </div>\n    );\n};\n\nexport default AreaLineChart;\n"],"names":["d3.format","d3.select","d3.scalePoint","d3.scaleLinear","d3.max","d3.axisBottom","d3.axisLeft","line","d3.line","d3.curveMonotoneX","d3.curveLinear","area","d3.area"],"mappings":"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"}

package/dist/components/charts/areaLinerChart/index.js

@@ -0,0 +1,4 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../../../node_modules/d3-scale/src/linear/index.js"),a=require("../../../node_modules/d3-array/src/max/index.js"),n=require("../../../node_modules/@mui/material/Box/Box/index.js"),o=require("../../../node_modules/d3-selection/src/select/index.js"),s=require("../../../node_modules/d3-scale/src/band/index.js"),l=require("../../../node_modules/d3-axis/src/axis/index.js"),i=require("../../../node_modules/d3-shape/src/area/index.js"),d=require("../../../node_modules/d3-shape/src/line/index.js"),u=require("../../../node_modules/d3-format/src/defaultLocale/index.js"),c=require("../../../node_modules/d3-shape/src/curve/monotone/index.js"),p=require("../../../node_modules/d3-shape/src/curve/linear/index.js");exports.default=({data:f,height:m=400,customLabelFormatter:x,yAxisLabelType:h="inValue",currency:v,colors:g,customLegend:y})=>{const j=t.useRef(null),k=t.useRef(null),[q,_]=t.useState(0),[b,$]=t.useState(null);return t.useEffect(()=>{const e=k.current,t=new ResizeObserver(e=>{if(e[0]){const t=e[0].contentRect.width;_(t)}});return e&&t.observe(e),()=>{e&&t.unobserve(e)}},[]),t.useEffect(()=>{if(0===q)return;const e=q-40-30,t=m-20-30;o.default(j.current).selectAll("*").remove();const n=o.default(j.current).attr("width",q).attr("height",m).append("g").attr("transform","translate(40,20)"),y=s.point().domain(f[0].values.map(e=>e.month)).range([0,e]),k=r.default().domain([0,a.default(f,e=>a.default(e.values,e=>e.value))]).range([t,0]),_=Math.floor(e/80),b=l.axisBottom(y).ticks(_),E=n.append("g").attr("transform",`translate(0,${t})`).call(b);E.selectAll("text").attr("transform","translate(0, 10)").attr("color","#8E8E93").style("text-anchor","middle");const w=n.append("g");w.append("g").attr("color","#8E8E93").attr("transform","translate(-10,0)").call(l.axisLeft(k).tickSize(-e).tickFormat(e=>{return x?x(e):(t=e,r=v,"inPercent"===(a=h)?`${u.format(".0%")(t/100)}`:"inValue"===a?`${r||""} ${u.format(".2s")(t).replace("k","K")}`:t.toString());var t,r,a}).tickSizeOuter(0)).selectAll("line").attr("stroke-dasharray","3,3").attr("stroke","#D3D3D4"),E.selectAll(".tick line").remove(),w.select(".domain").attr("stroke","none"),E.select(".domain").attr("stroke","none");const S=i.default().x(e=>y(e.month)).y0(t).y1(e=>k(e.value));f.forEach((e,t)=>{const r=n.append("defs").append("linearGradient").attr("id",`area-gradient-${t}`).attr("x1","0%").attr("x2","0%").attr("y1","0%").attr("y2","100%");var a;r.append("stop").attr("offset","0%").attr("stop-color",g[t]).attr("stop-opacity",.4),r.append("stop").attr("offset","100%").attr("stop-color",g[t]).attr("stop-opacity",.1),n.append("path").datum(e.values).attr("fill",`url(#area-gradient-${t})`).attr("d",S),n.append("path").datum(e.values).attr("fill","none").attr("stroke",g[t]).attr("stroke-width",2).attr("d",(a=e.isSmooth||!1,d.default().x(e=>y(e.month)).y(e=>k(e.value)).curve(a?c.monotoneX:p.default))),(null==e?void 0:e.showCircle)&&n.selectAll(`circle-${t}`).data(e.values).enter().append("circle").attr("cx",e=>y(e.month)).attr("cy",e=>k(e.value)).attr("r",5).attr("fill",g[t]).attr("stroke","#fff").style("cursor","pointer").on("mouseover",function(t,r){$({x:`${t.pageX+10}px`,y:t.pageY-30+"px",content:`${e.name}: ${r.value}`}),o.default(this).transition().attr("r",7).attr("fill","#ff4500")}).on("mouseout",function(){$(null),o.default(this).transition().attr("r",5).attr("fill",g[t])})})},[f,q,m,x,h,v,g,y]),/* @__PURE__ */e.jsxs("div",{ref:k,style:{width:"100%",height:"100%"},children:[
+/* @__PURE__ */e.jsxs("div",{style:{position:"relative"},children:[
+/* @__PURE__ */e.jsx("svg",{ref:j,width:"100%",height:m}),y&&y]}),b&&/* @__PURE__ */e.jsx(n.default,{sx:{position:"absolute",left:b.x,top:b.y,pointerEvents:"none",backgroundColor:"#2EB273",zIndex:"99999",border:"none",borderRadius:"3px",transform:"translate(-50%, -100%)",padding:"2px 6px 2px 6px",gap:"10px"},children:/* @__PURE__ */e.jsx("span",{style:{fontSize:"16px",weight:"500",color:"#ffff"},children:b.content})})]})};
+//# sourceMappingURL=index.js.map

package/dist/components/charts/areaLinerChart/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/charts/areaLinerChart.tsx"],"sourcesContent":["import { Box } from '@mui/material';\nimport * as d3 from 'd3';\nimport { useEffect, useRef, useState } from 'react';\n\ninterface IChartProps {\n    data: { name: string, values: { month: string, value: number }[], isSmooth?: boolean }[],\n    height: number,\n    yAxisLabelType?: 'inPercent' | 'inValue' | 'custom';\n    customLabelFormatter?: (value: number) => string;\n    currency?: string;\n    colors?: string[];\n    customLegend: React.ReactNode\n}\n\nconst formatNumber = (num: number, symbol: string, labelType: string) => {\n    if (labelType === 'inPercent') {\n        return `${d3.format(\".0%\")(num / 100)}`;\n    } else if (labelType === 'inValue') {\n        return `${symbol || ''} ${d3.format(\".2s\")(num).replace('k', 'K')}`;\n    }\n    return num.toString();\n};\n\nconst AreaLineChart = ({ data, height = 400, customLabelFormatter, yAxisLabelType = 'inValue', currency, colors, customLegend }: IChartProps) => {\n    const svgRef = useRef<SVGSVGElement | null>(null);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const [containerWidth, setContainerWidth] = useState<number>(0);\n    const [tooltipData, setTooltipData] = useState<any>(null);\n    useEffect(() => {\n        const wrapper = wrapperRef.current;\n\n        const resizeObserver = new ResizeObserver((entries) => {\n            if (entries[0]) {\n                const newWidth = entries[0].contentRect.width;\n                setContainerWidth(newWidth);\n            }\n        });\n\n        if (wrapper) {\n            resizeObserver.observe(wrapper);\n        }\n\n        return () => {\n            if (wrapper) {\n                resizeObserver.unobserve(wrapper);\n            }\n        };\n    }, []);\n\n    useEffect(() => {\n        if (containerWidth === 0) return; // Wait for the container width\n\n        const margin = { top: 20, right: 30, bottom: 30, left: 40 };\n        const width = containerWidth - margin.left - margin.right;\n        const chartHeight = height - margin.top - margin.bottom;\n\n        // Clear the SVG\n        d3.select(svgRef.current).selectAll('*').remove();\n\n        const svg = d3\n            .select(svgRef.current)\n            .attr('width', containerWidth)\n            .attr('height', height)\n            .append('g')\n            .attr('transform', `translate(${margin.left},${margin.top})`);\n\n        // Define scales\n        const x = d3\n            .scalePoint()\n            .domain(data[0].values.map(d => d.month)) // Assuming all datasets share the same x-domain\n            .range([0, width]);\n\n        const y = d3\n            .scaleLinear()\n            .domain([0, d3.max(data, dataset => d3.max(dataset.values, d => d.value))!]) // Max value across all datasets\n            .range([chartHeight, 0]);\n\n        // Limit x-axis ticks dynamically based on width\n        const numTicks = Math.floor(width / 80); // Adjust the factor (80) based on chart width\n        const xAxis = d3.axisBottom(x).ticks(numTicks);\n\n        const xAxisGroup = svg.append('g')\n            .attr('transform', `translate(0,${chartHeight})`)\n            .call(xAxis);\n\n        xAxisGroup.selectAll(\"text\")\n            .attr(\"transform\", \"translate(0, 10)\")\n            .attr('color', '#8E8E93')\n            .style(\"text-anchor\", \"middle\");\n\n        // Y Axis\n        const yAxis = svg.append('g')\n        yAxis.append('g').attr('color', '#8E8E93').attr(\"transform\", `translate(-10,0)`)\n            .call(d3.axisLeft(y).tickSize(-width).tickFormat((d: any) =>\n                customLabelFormatter\n                    ? customLabelFormatter(d)\n                    : formatNumber(d, currency, yAxisLabelType)\n            ).tickSizeOuter(0) as any)\n            .selectAll('line')\n            .attr('stroke-dasharray', '3,3')\n            .attr('stroke', '#D3D3D4');\n\n        xAxisGroup.selectAll(\".tick line\").remove();\n        yAxis.select(\".domain\").attr(\"stroke\", \"none\");\n        xAxisGroup.select(\".domain\").attr(\"stroke\", \"none\");\n\n        // Define color scale for lines\n        // const color = d3.scaleOrdinal(d3.schemeCategory10);\n\n        // Line and area generators\n        const line = (isSmooth: boolean) => d3.line<any>()\n            .x(d => x(d.month)!)\n            .y(d => y(d.value))\n            .curve(isSmooth ? d3.curveMonotoneX : d3.curveLinear);  // Conditionally smooth the line\n\n        const area = d3.area<any>()\n            .x(d => x(d.month)!)\n            .y0(chartHeight)\n            .y1(d => y(d.value));\n\n        // Iterate over each dataset to create lines and areas\n        data.forEach((dataset, i) => {\n            // const datasetColor = color(i.toString());\n\n            // Create gradient for each area\n            const gradient = svg.append('defs')\n                .append('linearGradient')\n                .attr('id', `area-gradient-${i}`)\n                .attr('x1', '0%')\n                .attr('x2', '0%')\n                .attr('y1', '0%')\n                .attr('y2', '100%');\n\n            gradient.append('stop')\n                .attr('offset', '0%')\n                .attr('stop-color', colors[i])\n                .attr('stop-opacity', 0.4);\n\n            gradient.append('stop')\n                .attr('offset', '100%')\n                .attr('stop-color', colors[i])\n                .attr('stop-opacity', 0.1);\n\n            // Append the area with gradient\n            svg.append('path')\n                .datum(dataset.values)\n                .attr('fill', `url(#area-gradient-${i})`)\n                .attr('d', area);\n\n            // Append the line with smoothness condition\n            svg.append('path')\n                .datum(dataset.values)\n                .attr('fill', 'none')\n                .attr('stroke', colors[i])\n                .attr('stroke-width', 2)\n                .attr('d', line(dataset.isSmooth || false));  // Use smoothness from the dataset\n\n            // Append circles for hover effect\n            {\n                dataset?.showCircle &&\n                    svg.selectAll(`circle-${i}`)\n                        .data(dataset.values)\n                        .enter()\n                        .append('circle')\n                        .attr('cx', d => x(d.month)!)\n                        .attr('cy', d => y(d.value))\n                        .attr('r', 5)\n                        .attr('fill', colors[i])\n                        .attr('stroke', '#fff')\n                        .style('cursor', 'pointer')\n                        .on('mouseover', function (event, d) {\n                            setTooltipData({\n                                x: `${event.pageX + 10}px`,\n                                y: `${event.pageY - 30}px`,\n                                content: `${dataset.name}: ${d.value}`\n                            });\n                            d3.select(this).transition().attr('r', 7).attr('fill', '#ff4500');\n                        })\n                        .on('mouseout', function () {\n                            setTooltipData(null);\n                            d3.select(this).transition().attr('r', 5).attr('fill', colors[i]);\n                        });\n            }\n\n        });\n\n    }, [data, containerWidth, height, customLabelFormatter, yAxisLabelType, currency, colors, customLegend]);\n\n    return (\n        <div ref={wrapperRef} style={{ width: '100%', height: '100%' }}>\n            <div style={{ position: 'relative' }}>\n                <svg ref={svgRef} width=\"100%\" height={height} />\n                {\n                    customLegend &&\n                    customLegend\n\n                }\n            </div>\n            {tooltipData &&\n                <Box sx={{\n                    position: 'absolute',\n                    left: tooltipData.x,\n                    top: tooltipData.y,\n                    pointerEvents: 'none',\n                    backgroundColor: '#2EB273',\n                    zIndex: '99999',\n                    border: 'none',\n                    borderRadius: '3px',\n                    transform: 'translate(-50%, -100%)',\n                    padding: '2px 6px 2px 6px',\n                    gap: '10px'\n                }}>\n                    <span style={{ fontSize: '16px', weight: '500', color: '#ffff' }}>\n                        {tooltipData.content}\n                    </span>\n                </Box>\n            }\n        </div>\n    );\n};\n\nexport default AreaLineChart;\n"],"names":["data","height","customLabelFormatter","yAxisLabelType","currency","colors","customLegend","svgRef","useRef","wrapperRef","containerWidth","setContainerWidth","useState","tooltipData","setTooltipData","useEffect","wrapper","current","resizeObserver","ResizeObserver","entries","newWidth","contentRect","width","observe","unobserve","chartHeight","d3.select","selectAll","remove","svg","attr","append","x","d3.scalePoint","domain","values","map","d","month","range","y","d3.scaleLinear","d3.max","dataset","value","numTicks","Math","floor","xAxis","d3.axisBottom","ticks","xAxisGroup","call","style","yAxis","d3.axisLeft","tickSize","tickFormat","num","symbol","labelType","d3.format","replace","toString","tickSizeOuter","select","area","d3.area","y0","y1","forEach","i","gradient","isSmooth","datum","d3.line","curve","d3.curveMonotoneX","d3.curveLinear","showCircle","enter","on","event","pageX","pageY","content","name","this","transition","jsxs","ref","children","position","jsx","Box","sx","left","top","pointerEvents","backgroundColor","zIndex","border","borderRadius","transform","padding","gap","fontSize","weight","color"],"mappings":"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"}