@erpsquad/common 1.8.40 → 1.8.41

package/dist/components/tab-bar-ui/tab-bar-ui/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../src/components/tab-bar-ui/tab-bar-ui.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useState } from \"react\";\nimport { Box } from \"@mui/material\";\nimport Tab from \"@mui/material/Tab\";\n\nimport TabContext from \"@mui/lab/TabContext\";\nimport TabList from \"@mui/lab/TabList\";\nimport TabPanel from \"@mui/lab/TabPanel\";\nimport CloseIcon from \"@mui/icons-material/Close\";\n\nimport \"./tab-bar-ui.scss\";\nimport TextField from \"../text-field/text-field\";\nimport images from \"../../assets/images\";\n\ninterface TabItem {\n  tab_order: number;\n  title: string;\n  content?: string | ReactNode;\n  data?: any;\n  remove_tab?: boolean;\n  tabIcon?: string;\n}\ninterface TabProps {\n  tabs: TabItem[];\n  activeTabValue?: number;\n  setActiveTabValue?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  onEditTabTitle?: (tabId: number, newTitle: string) => void;\n  handleTabChange?: () => void;\n  handleRemoveTab?: (tabId: number) => void;\n}\n\nexport default function TabBarUi(props: TabProps) {\n  const {\n    tabs,\n    onEditTabTitle,\n    activeTabValue,\n    setActiveTabValue,\n    handleTabChange,\n    handleRemoveTab,\n  } = props;\n  const [value, setValue] = useState(0);\n  const [editableTabId, setEditableTabId] = useState<number | null>(null);\n  const handleChange = (event: React.SyntheticEvent, newValue: number) => {\n    setValue(newValue);\n    setActiveTabValue && setActiveTabValue(newValue);\n    handleTabChange && handleTabChange();\n  };\n\n  const handleTabDoubleClick = (tabId: number) => {\n    setEditableTabId(tabId);\n  };\n\n  const handleEditTabTitle = (\n    event: React.ChangeEvent<HTMLInputElement>,\n    tabId: number,\n  ) => {\n    onEditTabTitle && onEditTabTitle(tabId, event.target.value);\n  };\n\n  useEffect(() => {\n    if (setActiveTabValue && Boolean(tabs?.length)) setActiveTabValue(value);\n    // eslint-disable-next-line\n  }, [tabs]);\n\n  return (\n    <Box>\n      <TabContext value={activeTabValue ?? value}>\n        <Box>\n          <TabList\n            className=\"account-payble-tabsui-wrap\"\n            onChange={handleChange}\n          >\n            {tabs.map((tab: TabItem) => (\n              <Tab\n                className=\"account-payble-tab-items\"\n                key={tab.tab_order}\n                label={\n                  onEditTabTitle && editableTabId === tab.tab_order ? (\n                    <TextField\n                      value={tab.title}\n                      autoFocus\n                      onBlur={() => setEditableTabId(null)}\n                      onChange={(e: any) =>\n                        handleEditTabTitle(e, tab.tab_order)\n                      }\n                    />\n                  ) : handleRemoveTab ? (\n                    <div className=\"Tabs--Title\">\n                      <div>{tab.title}</div>\n                      {!tab.remove_tab && (\n                        <CloseIcon\n                          style={{ fontSize: \"15px\", cursor: \"pointer\" }}\n                          onClick={() => {\n                            handleRemoveTab(tab.tab_order);\n                          }}\n                        />\n                      )}\n                    </div>\n                  ) : (\n                    <div className=\"text-display\">\n                      <img src={images.common[tab.tabIcon]} />\n                      {tab.title}\n                    </div>\n                  )\n                }\n                wrapped\n                onDoubleClick={() => handleTabDoubleClick(tab.tab_order)}\n              />\n            ))}\n          </TabList>\n        </Box>\n        {tabs.map(\n          (tab: TabItem, index: number) =>\n            tab.content && (\n              <TabPanel value={index} key={tab.tab_order}>\n                {value === index && tab.content}\n              </TabPanel>\n            ),\n        )}\n      </TabContext>\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AA8BA,SAAwB,SAAS,OAAiB;AAChD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACE;AACJ,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,CAAC;AACpC,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAwB,IAAI;AACtE,QAAM,eAAe,CAAC,OAA6B,aAAqB;AACtE,aAAS,QAAQ;AACjB,yBAAqB,kBAAkB,QAAQ;AAC/C,uBAAmB,gBAAA;AAAA,EACrB;AAEA,QAAM,uBAAuB,CAAC,UAAkB;AAC9C,qBAAiB,KAAK;AAAA,EACxB;AAEA,QAAM,qBAAqB,CACzB,OACA,UACG;AACH,sBAAkB,eAAe,OAAO,MAAM,OAAO,KAAK;AAAA,EAC5D;AAEA,YAAU,MAAM;AACd,QAAI,qBAAqB,QAAQ,6BAAM,MAAM,qBAAqB,KAAK;AAAA,EAEzE,GAAG,CAAC,IAAI,CAAC;AAET,6BACG,KAAA,EACC,UAAA,qBAAC,YAAA,EAAW,OAAO,kBAAkB,OACnC,UAAA;AAAA,IAAA,oBAAC,KAAA,EACC,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,UAAU;AAAA,QAET,UAAA,KAAK,IAAI,CAAC,QACT;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YAEV,OACE,kBAAkB,kBAAkB,IAAI,YACtC;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,OAAO,IAAI;AAAA,gBACX,WAAS;AAAA,gBACT,QAAQ,MAAM,iBAAiB,IAAI;AAAA,gBACnC,UAAU,CAAC,MACT,mBAAmB,GAAG,IAAI,SAAS;AAAA,cAAA;AAAA,YAAA,IAGrC,kBACF,qBAAC,OAAA,EAAI,WAAU,eACb,UAAA;AAAA,cAAA,oBAAC,OAAA,EAAK,cAAI,MAAA,CAAM;AAAA,cACf,CAAC,IAAI,cACJ;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,OAAO,EAAE,UAAU,QAAQ,QAAQ,UAAA;AAAA,kBACnC,SAAS,MAAM;AACb,oCAAgB,IAAI,SAAS;AAAA,kBAC/B;AAAA,gBAAA;AAAA,cAAA;AAAA,YACF,EAAA,CAEJ,IAEA,qBAAC,OAAA,EAAI,WAAU,gBACb,UAAA;AAAA,cAAA,oBAAC,SAAI,KAAK,OAAO,OAAO,IAAI,OAAO,GAAG;AAAA,cACrC,IAAI;AAAA,YAAA,GACP;AAAA,YAGJ,SAAO;AAAA,YACP,eAAe,MAAM,qBAAqB,IAAI,SAAS;AAAA,UAAA;AAAA,UA/BlD,IAAI;AAAA,QAAA,CAiCZ;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,IACC,KAAK;AAAA,MACJ,CAAC,KAAc,UACb,IAAI,WACF,oBAAC,UAAA,EAAS,OAAO,OACd,UAAA,UAAU,SAAS,IAAI,QAAA,GADG,IAAI,SAEjC;AAAA,IAAA;AAAA,EAEN,EAAA,CACF,EAAA,CACF;AAEJ;"}
+{"version":3,"file":"index.esm.js","sources":["../../../../src/components/tab-bar-ui/tab-bar-ui.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useState } from \"react\";\nimport { Box } from \"@mui/material\";\nimport Tab from \"@mui/material/Tab\";\n\nimport TabContext from \"@mui/lab/TabContext\";\nimport TabList from \"@mui/lab/TabList\";\nimport TabPanel from \"@mui/lab/TabPanel\";\nimport CloseIcon from \"@mui/icons-material/Close\";\n\nimport \"./tab-bar-ui.scss\";\nimport TextField from \"../text-field/text-field\";\nimport images from \"../../assets/images\";\n\ninterface TabItem {\n  tab_order: number;\n  title: string;\n  content?: string | ReactNode;\n  data?: any;\n  remove_tab?: boolean;\n  tabIcon?: string;\n}\ninterface TabProps {\n  tabs: TabItem[];\n  activeTabValue?: number;\n  setActiveTabValue?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  onEditTabTitle?: (tabId: number, newTitle: string) => void;\n  handleTabChange?: () => void;\n  handleRemoveTab?: (tabId: number) => void;\n}\n\nexport default function TabBarUi(props: TabProps) {\n  const {\n    tabs,\n    onEditTabTitle,\n    activeTabValue,\n    setActiveTabValue,\n    handleTabChange,\n    handleRemoveTab,\n  } = props;\n  const [value, setValue] = useState(0);\n  const [editableTabId, setEditableTabId] = useState<number | null>(null);\n  const handleChange = (event: React.SyntheticEvent, newValue: number) => {\n    setValue(newValue);\n    setActiveTabValue && setActiveTabValue(newValue);\n    handleTabChange && handleTabChange();\n  };\n\n  const handleTabDoubleClick = (tabId: number) => {\n    setEditableTabId(tabId);\n  };\n\n  const handleEditTabTitle = (\n    event: React.ChangeEvent<HTMLInputElement>,\n    tabId: number,\n  ) => {\n    onEditTabTitle && onEditTabTitle(tabId, event.target.value);\n  };\n\n  useEffect(() => {\n    if (setActiveTabValue && Boolean(tabs?.length)) setActiveTabValue(value);\n    // eslint-disable-next-line\n  }, [tabs]);\n\n  return (\n    <Box>\n      <TabContext value={activeTabValue ?? value}>\n        <Box>\n          <TabList\n            className=\"account-payble-tabsui-wrap\"\n            onChange={handleChange}\n          >\n            {tabs.map((tab: TabItem) => (\n              <Tab\n                className=\"account-payble-tab-items\"\n                key={tab.tab_order}\n                label={\n                  onEditTabTitle && editableTabId === tab.tab_order ? (\n                    <TextField\n                      value={tab.title}\n                      autoFocus\n                      onBlur={() => setEditableTabId(null)}\n                      onChange={(e: any) =>\n                        handleEditTabTitle(e, tab.tab_order)\n                      }\n                    />\n                  ) : handleRemoveTab ? (\n                    <div className=\"Tabs--Title\">\n                      <div>{tab.title}</div>\n                      {!tab.remove_tab && (\n                        <CloseIcon\n                          style={{ fontSize: \"15px\", cursor: \"pointer\" }}\n                          onClick={() => {\n                            handleRemoveTab(tab.tab_order);\n                          }}\n                        />\n                      )}\n                    </div>\n                  ) : (\n                    <div className=\"text-display\">\n                      <img src={images.common[tab.tabIcon]} />\n                      {tab.title}\n                    </div>\n                  )\n                }\n                wrapped\n                onDoubleClick={() => handleTabDoubleClick(tab.tab_order)}\n              />\n            ))}\n          </TabList>\n        </Box>\n        {tabs.map(\n          (tab: TabItem, index: number) =>\n            tab.content && (\n              <TabPanel value={index} key={tab.tab_order}>\n                {value === index && tab.content}\n              </TabPanel>\n            ),\n        )}\n      </TabContext>\n    </Box>\n  );\n}\n"],"names":["CloseIcon"],"mappings":";;;;;;;;;;;AA8BA,SAAwB,SAAS,OAAiB;AAChD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACE;AACJ,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,CAAC;AACpC,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAwB,IAAI;AACtE,QAAM,eAAe,CAAC,OAA6B,aAAqB;AACtE,aAAS,QAAQ;AACjB,yBAAqB,kBAAkB,QAAQ;AAC/C,uBAAmB,gBAAA;AAAA,EACrB;AAEA,QAAM,uBAAuB,CAAC,UAAkB;AAC9C,qBAAiB,KAAK;AAAA,EACxB;AAEA,QAAM,qBAAqB,CACzB,OACA,UACG;AACH,sBAAkB,eAAe,OAAO,MAAM,OAAO,KAAK;AAAA,EAC5D;AAEA,YAAU,MAAM;AACd,QAAI,qBAAqB,QAAQ,6BAAM,MAAM,qBAAqB,KAAK;AAAA,EAEzE,GAAG,CAAC,IAAI,CAAC;AAET,6BACG,KAAA,EACC,UAAA,qBAAC,YAAA,EAAW,OAAO,kBAAkB,OACnC,UAAA;AAAA,IAAA,oBAAC,KAAA,EACC,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,UAAU;AAAA,QAET,UAAA,KAAK,IAAI,CAAC,QACT;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YAEV,OACE,kBAAkB,kBAAkB,IAAI,YACtC;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,OAAO,IAAI;AAAA,gBACX,WAAS;AAAA,gBACT,QAAQ,MAAM,iBAAiB,IAAI;AAAA,gBACnC,UAAU,CAAC,MACT,mBAAmB,GAAG,IAAI,SAAS;AAAA,cAAA;AAAA,YAAA,IAGrC,kBACF,qBAAC,OAAA,EAAI,WAAU,eACb,UAAA;AAAA,cAAA,oBAAC,OAAA,EAAK,cAAI,MAAA,CAAM;AAAA,cACf,CAAC,IAAI,cACJ;AAAA,gBAACA;AAAAA,gBAAA;AAAA,kBACC,OAAO,EAAE,UAAU,QAAQ,QAAQ,UAAA;AAAA,kBACnC,SAAS,MAAM;AACb,oCAAgB,IAAI,SAAS;AAAA,kBAC/B;AAAA,gBAAA;AAAA,cAAA;AAAA,YACF,EAAA,CAEJ,IAEA,qBAAC,OAAA,EAAI,WAAU,gBACb,UAAA;AAAA,cAAA,oBAAC,SAAI,KAAK,OAAO,OAAO,IAAI,OAAO,GAAG;AAAA,cACrC,IAAI;AAAA,YAAA,GACP;AAAA,YAGJ,SAAO;AAAA,YACP,eAAe,MAAM,qBAAqB,IAAI,SAAS;AAAA,UAAA;AAAA,UA/BlD,IAAI;AAAA,QAAA,CAiCZ;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,IACC,KAAK;AAAA,MACJ,CAAC,KAAc,UACb,IAAI,WACF,oBAAC,UAAA,EAAS,OAAO,OACd,UAAA,UAAU,SAAS,IAAI,QAAA,GADG,IAAI,SAEjC;AAAA,IAAA;AAAA,EAEN,EAAA,CACF,EAAA,CACF;AAEJ;"}

package/dist/components/tab-bar-ui/tab-bar-ui/index.js

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("react"),t=require("@mui/material"),r=require("@mui/material/Tab"),i=require("@mui/lab/TabContext"),l=require("@mui/lab/TabList"),u=require("@mui/lab/TabPanel"),s=require("@mui/icons-material/Close");;/* empty css                        */var n=,/* empty css                                 */o=;/* empty css                     */function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=/* @__PURE__ */d(r),b=/* @__PURE__ */d(i),x=/* @__PURE__ */d(l),m=/* @__PURE__ */d(u),v=/* @__PURE__ */d(s);exports.default=function(r){const{tabs:i,onEditTabTitle:l,activeTabValue:u,setActiveTabValue:s,handleTabChange:d,handleRemoveTab:f}=r,[j,h]=a.useState(0),[p,T]=a.useState(null);return a.useEffect(()=>{s&&Boolean(null==i?void 0:i.length)&&s(j)},[i]),/* @__PURE__ */e.jsx(t.Box,{children:/* @__PURE__ */e.jsxs(b.default,{value:u??j,children:[
-/* @__PURE__ */e.jsx(t.Box,{children:/* @__PURE__ */e.jsx(x.default,{className:"account-payble-tabsui-wrap",onChange:(e,a)=>{h(a),s&&s(a),d&&d()},children:i.map(a=>/* @__PURE__ */e.jsx(c.default,{className:"account-payble-tab-items",label:l&&p===a.tab_order?/* @__PURE__ */e.jsx(n.default,{value:a.title,autoFocus:!0,onBlur:()=>T(null),onChange:e=>{return t=e,r=a.tab_order,void(l&&l(r,t.target.value));var t,r}}):f?/* @__PURE__ */e.jsxs("div",{className:"Tabs--Title",children:[
-/* @__PURE__ */e.jsx("div",{children:a.title}),!a.remove_tab&&/* @__PURE__ */e.jsx(v.default,{style:{fontSize:"15px",cursor:"pointer"},onClick:()=>{f(a.tab_order)}})]}):/* @__PURE__ */e.jsxs("div",{className:"text-display",children:[
-/* @__PURE__ */e.jsx("img",{src:o.images.common[a.tabIcon]}),a.title]}),wrapped:!0,onDoubleClick:()=>{return e=a.tab_order,void T(e);var e}},a.tab_order))})}),i.map((a,t)=>a.content&&/* @__PURE__ */e.jsx(m.default,{value:t,children:j===t&&a.content},a.tab_order))]})})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("react"),t=;/* empty css                                                     */;/* empty css                        */var r=,/* empty css                                 */i=,/* empty css                     */l=,/* empty css                                                 */s=,/* empty css                                                          */n=,/* empty css                                                    */u=,/* empty css                                                 */d=;/* empty css                                                      */exports.default=function(o){const{tabs:c,onEditTabTitle:b,activeTabValue:x,setActiveTabValue:m,handleTabChange:j,handleRemoveTab:v}=o,[f,T]=a.useState(0),[_,h]=a.useState(null);return a.useEffect(()=>{m&&Boolean(null==c?void 0:c.length)&&m(f)},[c]),/* @__PURE__ */e.jsx(l.default,{children:/* @__PURE__ */e.jsxs(s.default,{value:x??f,children:[
+/* @__PURE__ */e.jsx(l.default,{children:/* @__PURE__ */e.jsx(n.default,{className:"account-payble-tabsui-wrap",onChange:(e,a)=>{T(a),m&&m(a),j&&j()},children:c.map(a=>/* @__PURE__ */e.jsx(u.default,{className:"account-payble-tab-items",label:b&&_===a.tab_order?/* @__PURE__ */e.jsx(r.default,{value:a.title,autoFocus:!0,onBlur:()=>h(null),onChange:e=>{return t=e,r=a.tab_order,void(b&&b(r,t.target.value));var t,r}}):v?/* @__PURE__ */e.jsxs("div",{className:"Tabs--Title",children:[
+/* @__PURE__ */e.jsx("div",{children:a.title}),!a.remove_tab&&/* @__PURE__ */e.jsx(t.default,{style:{fontSize:"15px",cursor:"pointer"},onClick:()=>{v(a.tab_order)}})]}):/* @__PURE__ */e.jsxs("div",{className:"text-display",children:[
+/* @__PURE__ */e.jsx("img",{src:i.images.common[a.tabIcon]}),a.title]}),wrapped:!0,onDoubleClick:()=>{return e=a.tab_order,void h(e);var e}},a.tab_order))})}),c.map((a,t)=>a.content&&/* @__PURE__ */e.jsx(d.default,{value:t,children:f===t&&a.content},a.tab_order))]})})};
 //# sourceMappingURL=index.js.map

package/dist/components/tab-bar-ui/tab-bar-ui/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/tab-bar-ui/tab-bar-ui.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useState } from \"react\";\nimport { Box } from \"@mui/material\";\nimport Tab from \"@mui/material/Tab\";\n\nimport TabContext from \"@mui/lab/TabContext\";\nimport TabList from \"@mui/lab/TabList\";\nimport TabPanel from \"@mui/lab/TabPanel\";\nimport CloseIcon from \"@mui/icons-material/Close\";\n\nimport \"./tab-bar-ui.scss\";\nimport TextField from \"../text-field/text-field\";\nimport images from \"../../assets/images\";\n\ninterface TabItem {\n  tab_order: number;\n  title: string;\n  content?: string | ReactNode;\n  data?: any;\n  remove_tab?: boolean;\n  tabIcon?: string;\n}\ninterface TabProps {\n  tabs: TabItem[];\n  activeTabValue?: number;\n  setActiveTabValue?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  onEditTabTitle?: (tabId: number, newTitle: string) => void;\n  handleTabChange?: () => void;\n  handleRemoveTab?: (tabId: number) => void;\n}\n\nexport default function TabBarUi(props: TabProps) {\n  const {\n    tabs,\n    onEditTabTitle,\n    activeTabValue,\n    setActiveTabValue,\n    handleTabChange,\n    handleRemoveTab,\n  } = props;\n  const [value, setValue] = useState(0);\n  const [editableTabId, setEditableTabId] = useState<number | null>(null);\n  const handleChange = (event: React.SyntheticEvent, newValue: number) => {\n    setValue(newValue);\n    setActiveTabValue && setActiveTabValue(newValue);\n    handleTabChange && handleTabChange();\n  };\n\n  const handleTabDoubleClick = (tabId: number) => {\n    setEditableTabId(tabId);\n  };\n\n  const handleEditTabTitle = (\n    event: React.ChangeEvent<HTMLInputElement>,\n    tabId: number,\n  ) => {\n    onEditTabTitle && onEditTabTitle(tabId, event.target.value);\n  };\n\n  useEffect(() => {\n    if (setActiveTabValue && Boolean(tabs?.length)) setActiveTabValue(value);\n    // eslint-disable-next-line\n  }, [tabs]);\n\n  return (\n    <Box>\n      <TabContext value={activeTabValue ?? value}>\n        <Box>\n          <TabList\n            className=\"account-payble-tabsui-wrap\"\n            onChange={handleChange}\n          >\n            {tabs.map((tab: TabItem) => (\n              <Tab\n                className=\"account-payble-tab-items\"\n                key={tab.tab_order}\n                label={\n                  onEditTabTitle && editableTabId === tab.tab_order ? (\n                    <TextField\n                      value={tab.title}\n                      autoFocus\n                      onBlur={() => setEditableTabId(null)}\n                      onChange={(e: any) =>\n                        handleEditTabTitle(e, tab.tab_order)\n                      }\n                    />\n                  ) : handleRemoveTab ? (\n                    <div className=\"Tabs--Title\">\n                      <div>{tab.title}</div>\n                      {!tab.remove_tab && (\n                        <CloseIcon\n                          style={{ fontSize: \"15px\", cursor: \"pointer\" }}\n                          onClick={() => {\n                            handleRemoveTab(tab.tab_order);\n                          }}\n                        />\n                      )}\n                    </div>\n                  ) : (\n                    <div className=\"text-display\">\n                      <img src={images.common[tab.tabIcon]} />\n                      {tab.title}\n                    </div>\n                  )\n                }\n                wrapped\n                onDoubleClick={() => handleTabDoubleClick(tab.tab_order)}\n              />\n            ))}\n          </TabList>\n        </Box>\n        {tabs.map(\n          (tab: TabItem, index: number) =>\n            tab.content && (\n              <TabPanel value={index} key={tab.tab_order}>\n                {value === index && tab.content}\n              </TabPanel>\n            ),\n        )}\n      </TabContext>\n    </Box>\n  );\n}\n"],"names":["props","tabs","onEditTabTitle","activeTabValue","setActiveTabValue","handleTabChange","handleRemoveTab","value","setValue","useState","editableTabId","setEditableTabId","useEffect","Boolean","length","Box","children","jsxs","TabContext","jsx","TabList","className","onChange","event","newValue","map","tab","Tab","label","tab_order","TextField","title","autoFocus","onBlur","e","handleEditTabTitle","tabId","target","remove_tab","CloseIcon","style","fontSize","cursor","onClick","src","images","common","tabIcon","wrapped","onDoubleClick","handleTabDoubleClick","index","content","TabPanel"],"mappings":"soBA8BA,SAAiCA,GAC/B,MAAMC,KACJA,EAAAC,eACAA,EAAAC,eACAA,EAAAC,kBACAA,EAAAC,gBACAA,EAAAC,gBACAA,GACEN,GACGO,EAAOC,GAAYC,EAAAA,SAAS,IAC5BC,EAAeC,GAAoBF,EAAAA,SAAwB,MAuBlE,OALAG,EAAAA,UAAU,KACJR,GAAqBS,QAAQ,MAAAZ,OAAA,EAAAA,EAAMa,WAA2BP,IAEjE,CAACN,yBAGDc,EAAAA,IAAA,CACCC,wBAAAC,EAAAA,KAACC,UAAA,CAAWX,MAAOJ,GAAkBI,EACnCS,SAAA;qBAACD,EAAAA,IAAA,CACCC,wBAAAG,EAAAA,IAACC,EAAAA,QAAA,CACCC,UAAU,6BACVC,SA5BW,CAACC,EAA6BC,KACjDhB,EAASgB,GACTpB,GAAqBA,EAAkBoB,GACvCnB,GAAmBA,KA2BVW,SAAAf,EAAKwB,IAAKC,kBACTP,EAAAA,IAACQ,EAAAA,QAAA,CACCN,UAAU,2BAEVO,MACE1B,GAAkBQ,IAAkBgB,EAAIG,yBACtCV,EAAAA,IAACW,EAAAA,QAAA,CACCvB,MAAOmB,EAAIK,MACXC,WAAS,EACTC,OAAQ,IAAMtB,EAAiB,MAC/BW,SAAWY,IACTC,OA9BpBZ,EA8BuCW,EA7BvCE,EA6B0CV,EAAIG,eA3B9C3B,GAAkBA,EAAekC,EAAOb,EAAMc,OAAO9B,QAJ5B,IACzBgB,EACAa,KAgCkB9B,iBACFW,EAAAA,KAAC,MAAA,CAAII,UAAU,cACbL,SAAA;iBAAAG,IAAC,MAAA,CAAKH,WAAIe,SACRL,EAAIY,2BACJnB,EAAAA,IAACoB,EAAAA,QAAA,CACCC,MAAO,CAAEC,SAAU,OAAQC,OAAQ,WACnCC,QAAS,KACPrC,EAAgBoB,EAAIG,gCAM5BZ,EAAAA,KAAC,MAAA,CAAII,UAAU,eACbL,SAAA;eAAAG,MAAC,OAAIyB,IAAKC,EAAAA,OAAOC,OAAOpB,EAAIqB,WAC3BrB,EAAIK,SAIXiB,SAAO,EACPC,cAAe,KAAMC,OA1DLd,EA0D0BV,EAAIG,eAzD1DlB,EAAiByB,GADU,IAACA,IA2BXV,EAAIG,gBAoChB5B,EAAKwB,IACJ,CAACC,EAAcyB,IACbzB,EAAI0B,wBACFjC,EAAAA,IAACkC,EAAAA,QAAA,CAAS9C,MAAO4C,EACdnC,SAAAT,IAAU4C,GAASzB,EAAI0B,SADG1B,EAAIG,gBAQ/C"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/tab-bar-ui/tab-bar-ui.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useState } from \"react\";\nimport { Box } from \"@mui/material\";\nimport Tab from \"@mui/material/Tab\";\n\nimport TabContext from \"@mui/lab/TabContext\";\nimport TabList from \"@mui/lab/TabList\";\nimport TabPanel from \"@mui/lab/TabPanel\";\nimport CloseIcon from \"@mui/icons-material/Close\";\n\nimport \"./tab-bar-ui.scss\";\nimport TextField from \"../text-field/text-field\";\nimport images from \"../../assets/images\";\n\ninterface TabItem {\n  tab_order: number;\n  title: string;\n  content?: string | ReactNode;\n  data?: any;\n  remove_tab?: boolean;\n  tabIcon?: string;\n}\ninterface TabProps {\n  tabs: TabItem[];\n  activeTabValue?: number;\n  setActiveTabValue?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  onEditTabTitle?: (tabId: number, newTitle: string) => void;\n  handleTabChange?: () => void;\n  handleRemoveTab?: (tabId: number) => void;\n}\n\nexport default function TabBarUi(props: TabProps) {\n  const {\n    tabs,\n    onEditTabTitle,\n    activeTabValue,\n    setActiveTabValue,\n    handleTabChange,\n    handleRemoveTab,\n  } = props;\n  const [value, setValue] = useState(0);\n  const [editableTabId, setEditableTabId] = useState<number | null>(null);\n  const handleChange = (event: React.SyntheticEvent, newValue: number) => {\n    setValue(newValue);\n    setActiveTabValue && setActiveTabValue(newValue);\n    handleTabChange && handleTabChange();\n  };\n\n  const handleTabDoubleClick = (tabId: number) => {\n    setEditableTabId(tabId);\n  };\n\n  const handleEditTabTitle = (\n    event: React.ChangeEvent<HTMLInputElement>,\n    tabId: number,\n  ) => {\n    onEditTabTitle && onEditTabTitle(tabId, event.target.value);\n  };\n\n  useEffect(() => {\n    if (setActiveTabValue && Boolean(tabs?.length)) setActiveTabValue(value);\n    // eslint-disable-next-line\n  }, [tabs]);\n\n  return (\n    <Box>\n      <TabContext value={activeTabValue ?? value}>\n        <Box>\n          <TabList\n            className=\"account-payble-tabsui-wrap\"\n            onChange={handleChange}\n          >\n            {tabs.map((tab: TabItem) => (\n              <Tab\n                className=\"account-payble-tab-items\"\n                key={tab.tab_order}\n                label={\n                  onEditTabTitle && editableTabId === tab.tab_order ? (\n                    <TextField\n                      value={tab.title}\n                      autoFocus\n                      onBlur={() => setEditableTabId(null)}\n                      onChange={(e: any) =>\n                        handleEditTabTitle(e, tab.tab_order)\n                      }\n                    />\n                  ) : handleRemoveTab ? (\n                    <div className=\"Tabs--Title\">\n                      <div>{tab.title}</div>\n                      {!tab.remove_tab && (\n                        <CloseIcon\n                          style={{ fontSize: \"15px\", cursor: \"pointer\" }}\n                          onClick={() => {\n                            handleRemoveTab(tab.tab_order);\n                          }}\n                        />\n                      )}\n                    </div>\n                  ) : (\n                    <div className=\"text-display\">\n                      <img src={images.common[tab.tabIcon]} />\n                      {tab.title}\n                    </div>\n                  )\n                }\n                wrapped\n                onDoubleClick={() => handleTabDoubleClick(tab.tab_order)}\n              />\n            ))}\n          </TabList>\n        </Box>\n        {tabs.map(\n          (tab: TabItem, index: number) =>\n            tab.content && (\n              <TabPanel value={index} key={tab.tab_order}>\n                {value === index && tab.content}\n              </TabPanel>\n            ),\n        )}\n      </TabContext>\n    </Box>\n  );\n}\n"],"names":["props","tabs","onEditTabTitle","activeTabValue","setActiveTabValue","handleTabChange","handleRemoveTab","value","setValue","useState","editableTabId","setEditableTabId","useEffect","Boolean","length","Box","children","jsxs","TabContext","jsx","TabList","className","onChange","event","newValue","map","tab","Tab","label","tab_order","TextField","title","autoFocus","onBlur","e","handleEditTabTitle","tabId","target","remove_tab","CloseIcon","style","fontSize","cursor","onClick","src","images","common","tabIcon","wrapped","onDoubleClick","handleTabDoubleClick","index","content","TabPanel"],"mappings":"8qBA8BA,SAAiCA,GAC/B,MAAMC,KACJA,EAAAC,eACAA,EAAAC,eACAA,EAAAC,kBACAA,EAAAC,gBACAA,EAAAC,gBACAA,GACEN,GACGO,EAAOC,GAAYC,EAAAA,SAAS,IAC5BC,EAAeC,GAAoBF,EAAAA,SAAwB,MAuBlE,OALAG,EAAAA,UAAU,KACJR,GAAqBS,QAAQ,MAAAZ,OAAA,EAAAA,EAAMa,WAA2BP,IAEjE,CAACN,yBAGDc,EAAAA,QAAA,CACCC,wBAAAC,EAAAA,KAACC,UAAA,CAAWX,MAAOJ,GAAkBI,EACnCS,SAAA;qBAACD,EAAAA,QAAA,CACCC,wBAAAG,EAAAA,IAACC,EAAAA,QAAA,CACCC,UAAU,6BACVC,SA5BW,CAACC,EAA6BC,KACjDhB,EAASgB,GACTpB,GAAqBA,EAAkBoB,GACvCnB,GAAmBA,KA2BVW,SAAAf,EAAKwB,IAAKC,kBACTP,EAAAA,IAACQ,EAAAA,QAAA,CACCN,UAAU,2BAEVO,MACE1B,GAAkBQ,IAAkBgB,EAAIG,yBACtCV,EAAAA,IAACW,EAAAA,QAAA,CACCvB,MAAOmB,EAAIK,MACXC,WAAS,EACTC,OAAQ,IAAMtB,EAAiB,MAC/BW,SAAWY,IACTC,OA9BpBZ,EA8BuCW,EA7BvCE,EA6B0CV,EAAIG,eA3B9C3B,GAAkBA,EAAekC,EAAOb,EAAMc,OAAO9B,QAJ5B,IACzBgB,EACAa,KAgCkB9B,iBACFW,EAAAA,KAAC,MAAA,CAAII,UAAU,cACbL,SAAA;iBAAAG,IAAC,MAAA,CAAKH,WAAIe,SACRL,EAAIY,2BACJnB,EAAAA,IAACoB,EAAAA,QAAA,CACCC,MAAO,CAAEC,SAAU,OAAQC,OAAQ,WACnCC,QAAS,KACPrC,EAAgBoB,EAAIG,gCAM5BZ,EAAAA,KAAC,MAAA,CAAII,UAAU,eACbL,SAAA;eAAAG,MAAC,OAAIyB,IAAKC,EAAAA,OAAOC,OAAOpB,EAAIqB,WAC3BrB,EAAIK,SAIXiB,SAAO,EACPC,cAAe,KAAMC,OA1DLd,EA0D0BV,EAAIG,eAzD1DlB,EAAiByB,GADU,IAACA,IA2BXV,EAAIG,gBAoChB5B,EAAKwB,IACJ,CAACC,EAAcyB,IACbzB,EAAI0B,wBACFjC,EAAAA,IAACkC,EAAAA,QAAA,CAAS9C,MAAO4C,EACdnC,SAAAT,IAAU4C,GAASzB,EAAI0B,SADG1B,EAAIG,gBAQ/C"}

package/dist/components/tabs/tabs/index.esm.js

@@ -1,15 +1,16 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
-import { Box, IconButton } from "@mui/material";
-import Tab from "@mui/material/Tab";
-import TabContext from "@mui/lab/TabContext";
-import TabList from "@mui/lab/TabList";
-import TabPanel from "@mui/lab/TabPanel";
-import CloseIcon from "@mui/icons-material/Close";
+import default_1 from "../../../node_modules/@mui/icons-material/Close/index.esm.js";
 /* empty css                     */
 import TextField from "../../text-field/text-field/index.esm.js";
 import { useTranslation } from "react-i18next";
 import { Typography } from "../../typography/typography/index.esm.js";
+import Box from "../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import TabContext from "../../../node_modules/@mui/lab/TabContext/TabContext/index.esm.js";
+import TabList from "../../../node_modules/@mui/lab/TabList/TabList/index.esm.js";
+import Tab from "../../../node_modules/@mui/material/Tab/Tab/index.esm.js";
+import IconButton from "../../../node_modules/@mui/material/IconButton/IconButton/index.esm.js";
+import TabPanel from "../../../node_modules/@mui/lab/TabPanel/TabPanel/index.esm.js";
 function TabBar(props) {
   const { t } = useTranslation();
   const {
@@ -56,7 +57,7 @@ function TabBar(props) {
             e.preventDefault();
             e.stopPropagation();
             handleRemoveTab(tab.tab_order);
-          }, children: /* @__PURE__ */ jsx(CloseIcon, { style: { fontSize: "15px", cursor: "pointer" } }) })
+          }, children: /* @__PURE__ */ jsx(default_1, { style: { fontSize: "15px", cursor: "pointer" } }) })
         ] }) : /* @__PURE__ */ jsx(Typography, { color: "theme.secondary.1000", type: "s3", children: t(tab.title) }) }),
         wrapped: true,
         onDoubleClick: () => handleTabDoubleClick(tab.tab_order)

package/dist/components/tabs/tabs/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../src/components/tabs/tabs.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\n/* eslint-disable unused-imports/no-unused-vars */\nimport React, { ReactNode, useEffect, useState } from \"react\";\nimport { Box, IconButton } from \"@mui/material\";\nimport Tab from \"@mui/material/Tab\";\nimport TabContext from \"@mui/lab/TabContext\";\nimport TabList from \"@mui/lab/TabList\";\nimport TabPanel from \"@mui/lab/TabPanel\";\nimport CloseIcon from \"@mui/icons-material/Close\";\n\nimport \"./tabs.scss\";\nimport TextField from \"../text-field/text-field\";\nimport { useTranslation } from \"react-i18next\";\nimport Typography from \"../typography/typography\";\n\ninterface TabItem {\n  tab_order: number;\n  title: string;\n  content?: string | ReactNode;\n  data?: any;\n  remove_tab?: boolean;\n}\nexport interface TabProps {\n  tabs: TabItem[];\n  activeValue?: number;\n  setActiveValue?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  onEditTabTitle?: (tabId: number, newTitle: string) => void;\n  handleTabChange?: () => void;\n  handleRemoveTab?: (tabId: number) => void;\n  isFormTabValid?: boolean ;\n  isTabViewOnly?: boolean;\n  activeTabs?: any[] ;\n  setActiveTabs?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  containerProps?: any;\n}\n\nexport default function TabBar(props: TabProps) {\n  const { t } = useTranslation();\n  const {\n    tabs,\n    onEditTabTitle,\n    activeValue,\n    setActiveValue,\n    handleTabChange,\n    handleRemoveTab,\n    // isFormTabValid ,  \n    isTabViewOnly,\n    activeTabs, \n    containerProps\n  } = props; \n  \n  const [value, setValue] = useState<number>(activeValue || 0);\n  const [editableTabId, setEditableTabId] = useState<number | null>(null);\n  useEffect(()=>{\n    activeValue && setValue(activeValue);\n\t} , [activeValue])\n\n  const handleChange = (_event: React.SyntheticEvent, newValue: number) => {\n    setValue(newValue);\n    setActiveValue && setActiveValue(newValue);\n    handleTabChange && handleTabChange();\n  };\n\n  const handleTabDoubleClick = (tabId: number) => {\n    setEditableTabId(tabId);\n  };\n\n  const handleEditTabTitle = (\n    event: React.ChangeEvent<HTMLInputElement>,\n    tabId: number,\n  ) => {\n    onEditTabTitle && onEditTabTitle(tabId, event.target.value);\n  };\n\n  // useEffect(() => {\n  //   if (setActiveValue && Boolean(tabs?.length)) setActiveValue(value);\n  //   // eslint-disable-next-line\n  // }, [tabs]);\n\n  return (\n    <Box mb={2} {...containerProps}>\n      <TabContext value={activeValue ?? value }>\n        <Box>\n          <TabList className=\"account-payble-tabs-wrap\" onChange={handleChange} variant=\"scrollable\" scrollButtons=\"auto\" aria-label=\"scrollable tabs\" sx={{ overflowX: 'auto', maxWidth: '100%' }}>\n            {tabs.map((tab: TabItem, index: any) => (\n              <Tab\n                className=\"account-payble-tab-items\"\n                key={tab.tab_order}\n              \n                label={\n                  <Box display='flex' alignItems='center'>\n                    {\n                        onEditTabTitle && editableTabId === tab.tab_order ? (\n                          <TextField\n                            value={tab.title}\n                            autoFocus\n                            onBlur={() => setEditableTabId(null)}\n                            onChange={(e: any) =>\n                              handleEditTabTitle(e, tab.tab_order)\n                            }\n                          />\n                        ) : handleRemoveTab ? (\n                          <div className=\"Tabs--Title\">\n                            <Typography color='theme.secondary.1000' type='s3'>{t(tab.title)}</Typography>\n                            {!tab.remove_tab && (\n                              <IconButton size=\"small\" onClick={(e) => {\n                                e.preventDefault();\n                                e.stopPropagation();\n                                handleRemoveTab(tab.tab_order);\n                              }}>\n                                <CloseIcon style={{ fontSize: \"15px\", cursor: \"pointer\" }}/>\n                              </IconButton>\n                            )}\n                          </div>\n                        ) : (\n                          <Typography color='theme.secondary.1000' type='s3'>{t(tab.title)}</Typography>\n                        )\n                    }\n                  </Box>\n                }\n                wrapped\n                onDoubleClick={() => handleTabDoubleClick(tab.tab_order)}\n              />\n            ))}\n          </TabList>\n        </Box>\n        {tabs.map(\n          (tab: TabItem, index: number) =>\n            tab.content && (\n              <TabPanel value={index.toString()} key={tab.tab_order}>\n                {value === index && tab.content}\n              </TabPanel>\n            ),\n        )}\n      </TabContext>\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;AAoCA,SAAwB,OAAO,OAAiB;AAC9C,QAAM,EAAE,EAAA,IAAM,eAAA;AACd,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IAIA;AAAA,EAAA,IACE;AAEJ,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAiB,eAAe,CAAC;AAC3D,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAwB,IAAI;AACtE,YAAU,MAAI;AACZ,mBAAe,SAAS,WAAW;AAAA,EACtC,GAAI,CAAC,WAAW,CAAC;AAEhB,QAAM,eAAe,CAAC,QAA8B,aAAqB;AACvE,aAAS,QAAQ;AACjB,sBAAkB,eAAe,QAAQ;AACzC,uBAAmB,gBAAA;AAAA,EACrB;AAEA,QAAM,uBAAuB,CAAC,UAAkB;AAC9C,qBAAiB,KAAK;AAAA,EACxB;AAEA,QAAM,qBAAqB,CACzB,OACA,UACG;AACH,sBAAkB,eAAe,OAAO,MAAM,OAAO,KAAK;AAAA,EAC5D;AAOA,SACE,oBAAC,KAAA,EAAI,IAAI,GAAI,GAAG,gBACd,UAAA,qBAAC,YAAA,EAAW,OAAO,eAAe,OAChC,UAAA;AAAA,IAAA,oBAAC,KAAA,EACC,UAAA,oBAAC,SAAA,EAAQ,WAAU,4BAA2B,UAAU,cAAc,SAAQ,cAAa,eAAc,QAAO,cAAW,mBAAkB,IAAI,EAAE,WAAW,QAAQ,UAAU,UAC7K,UAAA,KAAK,IAAI,CAAC,KAAc,UACvB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QAGV,OACE,oBAAC,KAAA,EAAI,SAAQ,QAAO,YAAW,UAEzB,UAAA,kBAAkB,kBAAkB,IAAI,YACtC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAO,IAAI;AAAA,YACX,WAAS;AAAA,YACT,QAAQ,MAAM,iBAAiB,IAAI;AAAA,YACnC,UAAU,CAAC,MACT,mBAAmB,GAAG,IAAI,SAAS;AAAA,UAAA;AAAA,QAAA,IAGrC,kBACF,qBAAC,OAAA,EAAI,WAAU,eACb,UAAA;AAAA,UAAA,oBAAC,YAAA,EAAW,OAAM,wBAAuB,MAAK,MAAM,UAAA,EAAE,IAAI,KAAK,EAAA,CAAE;AAAA,UAChE,CAAC,IAAI,cACJ,oBAAC,cAAW,MAAK,SAAQ,SAAS,CAAC,MAAM;AACvC,cAAE,eAAA;AACF,cAAE,gBAAA;AACF,4BAAgB,IAAI,SAAS;AAAA,UAC/B,GACE,UAAA,oBAAC,WAAA,EAAU,OAAO,EAAE,UAAU,QAAQ,QAAQ,UAAA,EAAU,CAAE,EAAA,CAC5D;AAAA,QAAA,EAAA,CAEJ,IAEA,oBAAC,YAAA,EAAW,OAAM,wBAAuB,MAAK,MAAM,UAAA,EAAE,IAAI,KAAK,EAAA,CAAE,EAAA,CAGzE;AAAA,QAEF,SAAO;AAAA,QACP,eAAe,MAAM,qBAAqB,IAAI,SAAS;AAAA,MAAA;AAAA,MAlClD,IAAI;AAAA,IAAA,CAoCZ,GACH,EAAA,CACF;AAAA,IACC,KAAK;AAAA,MACJ,CAAC,KAAc,UACb,IAAI,+BACD,UAAA,EAAS,OAAO,MAAM,SAAA,GACpB,UAAA,UAAU,SAAS,IAAI,QAAA,GADc,IAAI,SAE5C;AAAA,IAAA;AAAA,EAEN,EAAA,CACF,EAAA,CACF;AAEJ;"}
+{"version":3,"file":"index.esm.js","sources":["../../../../src/components/tabs/tabs.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\n/* eslint-disable unused-imports/no-unused-vars */\nimport React, { ReactNode, useEffect, useState } from \"react\";\nimport { Box, IconButton } from \"@mui/material\";\nimport Tab from \"@mui/material/Tab\";\nimport TabContext from \"@mui/lab/TabContext\";\nimport TabList from \"@mui/lab/TabList\";\nimport TabPanel from \"@mui/lab/TabPanel\";\nimport CloseIcon from \"@mui/icons-material/Close\";\n\nimport \"./tabs.scss\";\nimport TextField from \"../text-field/text-field\";\nimport { useTranslation } from \"react-i18next\";\nimport Typography from \"../typography/typography\";\n\ninterface TabItem {\n  tab_order: number;\n  title: string;\n  content?: string | ReactNode;\n  data?: any;\n  remove_tab?: boolean;\n}\nexport interface TabProps {\n  tabs: TabItem[];\n  activeValue?: number;\n  setActiveValue?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  onEditTabTitle?: (tabId: number, newTitle: string) => void;\n  handleTabChange?: () => void;\n  handleRemoveTab?: (tabId: number) => void;\n  isFormTabValid?: boolean ;\n  isTabViewOnly?: boolean;\n  activeTabs?: any[] ;\n  setActiveTabs?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  containerProps?: any;\n}\n\nexport default function TabBar(props: TabProps) {\n  const { t } = useTranslation();\n  const {\n    tabs,\n    onEditTabTitle,\n    activeValue,\n    setActiveValue,\n    handleTabChange,\n    handleRemoveTab,\n    // isFormTabValid ,  \n    isTabViewOnly,\n    activeTabs, \n    containerProps\n  } = props; \n  \n  const [value, setValue] = useState<number>(activeValue || 0);\n  const [editableTabId, setEditableTabId] = useState<number | null>(null);\n  useEffect(()=>{\n    activeValue && setValue(activeValue);\n\t} , [activeValue])\n\n  const handleChange = (_event: React.SyntheticEvent, newValue: number) => {\n    setValue(newValue);\n    setActiveValue && setActiveValue(newValue);\n    handleTabChange && handleTabChange();\n  };\n\n  const handleTabDoubleClick = (tabId: number) => {\n    setEditableTabId(tabId);\n  };\n\n  const handleEditTabTitle = (\n    event: React.ChangeEvent<HTMLInputElement>,\n    tabId: number,\n  ) => {\n    onEditTabTitle && onEditTabTitle(tabId, event.target.value);\n  };\n\n  // useEffect(() => {\n  //   if (setActiveValue && Boolean(tabs?.length)) setActiveValue(value);\n  //   // eslint-disable-next-line\n  // }, [tabs]);\n\n  return (\n    <Box mb={2} {...containerProps}>\n      <TabContext value={activeValue ?? value }>\n        <Box>\n          <TabList className=\"account-payble-tabs-wrap\" onChange={handleChange} variant=\"scrollable\" scrollButtons=\"auto\" aria-label=\"scrollable tabs\" sx={{ overflowX: 'auto', maxWidth: '100%' }}>\n            {tabs.map((tab: TabItem, index: any) => (\n              <Tab\n                className=\"account-payble-tab-items\"\n                key={tab.tab_order}\n              \n                label={\n                  <Box display='flex' alignItems='center'>\n                    {\n                        onEditTabTitle && editableTabId === tab.tab_order ? (\n                          <TextField\n                            value={tab.title}\n                            autoFocus\n                            onBlur={() => setEditableTabId(null)}\n                            onChange={(e: any) =>\n                              handleEditTabTitle(e, tab.tab_order)\n                            }\n                          />\n                        ) : handleRemoveTab ? (\n                          <div className=\"Tabs--Title\">\n                            <Typography color='theme.secondary.1000' type='s3'>{t(tab.title)}</Typography>\n                            {!tab.remove_tab && (\n                              <IconButton size=\"small\" onClick={(e) => {\n                                e.preventDefault();\n                                e.stopPropagation();\n                                handleRemoveTab(tab.tab_order);\n                              }}>\n                                <CloseIcon style={{ fontSize: \"15px\", cursor: \"pointer\" }}/>\n                              </IconButton>\n                            )}\n                          </div>\n                        ) : (\n                          <Typography color='theme.secondary.1000' type='s3'>{t(tab.title)}</Typography>\n                        )\n                    }\n                  </Box>\n                }\n                wrapped\n                onDoubleClick={() => handleTabDoubleClick(tab.tab_order)}\n              />\n            ))}\n          </TabList>\n        </Box>\n        {tabs.map(\n          (tab: TabItem, index: number) =>\n            tab.content && (\n              <TabPanel value={index.toString()} key={tab.tab_order}>\n                {value === index && tab.content}\n              </TabPanel>\n            ),\n        )}\n      </TabContext>\n    </Box>\n  );\n}\n"],"names":["CloseIcon"],"mappings":";;;;;;;;;;;;;AAoCA,SAAwB,OAAO,OAAiB;AAC9C,QAAM,EAAE,EAAA,IAAM,eAAA;AACd,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IAIA;AAAA,EAAA,IACE;AAEJ,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAiB,eAAe,CAAC;AAC3D,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAwB,IAAI;AACtE,YAAU,MAAI;AACZ,mBAAe,SAAS,WAAW;AAAA,EACtC,GAAI,CAAC,WAAW,CAAC;AAEhB,QAAM,eAAe,CAAC,QAA8B,aAAqB;AACvE,aAAS,QAAQ;AACjB,sBAAkB,eAAe,QAAQ;AACzC,uBAAmB,gBAAA;AAAA,EACrB;AAEA,QAAM,uBAAuB,CAAC,UAAkB;AAC9C,qBAAiB,KAAK;AAAA,EACxB;AAEA,QAAM,qBAAqB,CACzB,OACA,UACG;AACH,sBAAkB,eAAe,OAAO,MAAM,OAAO,KAAK;AAAA,EAC5D;AAOA,SACE,oBAAC,KAAA,EAAI,IAAI,GAAI,GAAG,gBACd,UAAA,qBAAC,YAAA,EAAW,OAAO,eAAe,OAChC,UAAA;AAAA,IAAA,oBAAC,KAAA,EACC,UAAA,oBAAC,SAAA,EAAQ,WAAU,4BAA2B,UAAU,cAAc,SAAQ,cAAa,eAAc,QAAO,cAAW,mBAAkB,IAAI,EAAE,WAAW,QAAQ,UAAU,UAC7K,UAAA,KAAK,IAAI,CAAC,KAAc,UACvB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QAGV,OACE,oBAAC,KAAA,EAAI,SAAQ,QAAO,YAAW,UAEzB,UAAA,kBAAkB,kBAAkB,IAAI,YACtC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAO,IAAI;AAAA,YACX,WAAS;AAAA,YACT,QAAQ,MAAM,iBAAiB,IAAI;AAAA,YACnC,UAAU,CAAC,MACT,mBAAmB,GAAG,IAAI,SAAS;AAAA,UAAA;AAAA,QAAA,IAGrC,kBACF,qBAAC,OAAA,EAAI,WAAU,eACb,UAAA;AAAA,UAAA,oBAAC,YAAA,EAAW,OAAM,wBAAuB,MAAK,MAAM,UAAA,EAAE,IAAI,KAAK,EAAA,CAAE;AAAA,UAChE,CAAC,IAAI,cACJ,oBAAC,cAAW,MAAK,SAAQ,SAAS,CAAC,MAAM;AACvC,cAAE,eAAA;AACF,cAAE,gBAAA;AACF,4BAAgB,IAAI,SAAS;AAAA,UAC/B,GACE,UAAA,oBAACA,WAAA,EAAU,OAAO,EAAE,UAAU,QAAQ,QAAQ,UAAA,EAAU,CAAE,EAAA,CAC5D;AAAA,QAAA,EAAA,CAEJ,IAEA,oBAAC,YAAA,EAAW,OAAM,wBAAuB,MAAK,MAAM,UAAA,EAAE,IAAI,KAAK,EAAA,CAAE,EAAA,CAGzE;AAAA,QAEF,SAAO;AAAA,QACP,eAAe,MAAM,qBAAqB,IAAI,SAAS;AAAA,MAAA;AAAA,MAlClD,IAAI;AAAA,IAAA,CAoCZ,GACH,EAAA,CACF;AAAA,IACC,KAAK;AAAA,MACJ,CAAC,KAAc,UACb,IAAI,+BACD,UAAA,EAAS,OAAO,MAAM,SAAA,GACpB,UAAA,UAAU,SAAS,IAAI,QAAA,GADc,IAAI,SAE5C;AAAA,IAAA;AAAA,EAEN,EAAA,CACF,EAAA,CACF;AAEJ;"}

package/dist/components/tabs/tabs/index.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("@mui/material"),r=require("@mui/material/Tab"),l=require("@mui/lab/TabContext"),i=require("@mui/lab/TabList"),o=require("@mui/lab/TabPanel"),s=require("@mui/icons-material/Close");;/* empty css                  */var n=,/* empty css                                 */u=require("react-i18next"),c=;/* empty css                                 */function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var b=/* @__PURE__ */d(r),x=/* @__PURE__ */d(l),p=/* @__PURE__ */d(i),m=/* @__PURE__ */d(o),h=/* @__PURE__ */d(s);exports.default=function(r){const{t:l}=u.useTranslation(),{tabs:i,onEditTabTitle:o,activeValue:s,setActiveValue:d,handleTabChange:f,handleRemoveTab:v,containerProps:j}=r,[y,T]=t.useState(s||0),[q,g]=t.useState(null);return t.useEffect(()=>{s&&T(s)},[s]),/* @__PURE__ */e.jsx(a.Box,{mb:2,...j,children:/* @__PURE__ */e.jsxs(x.default,{value:s??y,children:[
-/* @__PURE__ */e.jsx(a.Box,{children:/* @__PURE__ */e.jsx(p.default,{className:"account-payble-tabs-wrap",onChange:(e,t)=>{T(t),d&&d(t),f&&f()},variant:"scrollable",scrollButtons:"auto","aria-label":"scrollable tabs",sx:{overflowX:"auto",maxWidth:"100%"},children:i.map((t,r)=>/* @__PURE__ */e.jsx(b.default,{className:"account-payble-tab-items",label:/* @__PURE__ */e.jsx(a.Box,{display:"flex",alignItems:"center",children:o&&q===t.tab_order?/* @__PURE__ */e.jsx(n.default,{value:t.title,autoFocus:!0,onBlur:()=>g(null),onChange:e=>{return a=e,r=t.tab_order,void(o&&o(r,a.target.value));var a,r}}):v?/* @__PURE__ */e.jsxs("div",{className:"Tabs--Title",children:[
-/* @__PURE__ */e.jsx(c.Typography,{color:"theme.secondary.1000",type:"s3",children:l(t.title)}),!t.remove_tab&&/* @__PURE__ */e.jsx(a.IconButton,{size:"small",onClick:e=>{e.preventDefault(),e.stopPropagation(),v(t.tab_order)},children:/* @__PURE__ */e.jsx(h.default,{style:{fontSize:"15px",cursor:"pointer"}})})]}):/* @__PURE__ */e.jsx(c.Typography,{color:"theme.secondary.1000",type:"s3",children:l(t.title)})}),wrapped:!0,onDoubleClick:()=>{return e=t.tab_order,void g(e);var e}},t.tab_order))})}),i.map((t,a)=>t.content&&/* @__PURE__ */e.jsx(m.default,{value:a.toString(),children:y===a&&t.content},t.tab_order))]})})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("react"),t=;/* empty css                                                     */;/* empty css                  */var r=,/* empty css                                 */l=require("react-i18next"),s=,/* empty css                                 */o=,/* empty css                                                 */i=,/* empty css                                                          */n=,/* empty css                                                    */u=,/* empty css                                                 */d=,/* empty css                                                               */c=;/* empty css                                                      */exports.default=function(x){const{t:b}=l.useTranslation(),{tabs:m,onEditTabTitle:p,activeValue:j,setActiveValue:h,handleTabChange:f,handleRemoveTab:v,containerProps:y}=x,[T,_]=a.useState(j||0),[q,g]=a.useState(null);return a.useEffect(()=>{j&&_(j)},[j]),/* @__PURE__ */e.jsx(o.default,{mb:2,...y,children:/* @__PURE__ */e.jsxs(i.default,{value:j??T,children:[
+/* @__PURE__ */e.jsx(o.default,{children:/* @__PURE__ */e.jsx(n.default,{className:"account-payble-tabs-wrap",onChange:(e,a)=>{_(a),h&&h(a),f&&f()},variant:"scrollable",scrollButtons:"auto","aria-label":"scrollable tabs",sx:{overflowX:"auto",maxWidth:"100%"},children:m.map((a,l)=>/* @__PURE__ */e.jsx(u.default,{className:"account-payble-tab-items",label:/* @__PURE__ */e.jsx(o.default,{display:"flex",alignItems:"center",children:p&&q===a.tab_order?/* @__PURE__ */e.jsx(r.default,{value:a.title,autoFocus:!0,onBlur:()=>g(null),onChange:e=>{return t=e,r=a.tab_order,void(p&&p(r,t.target.value));var t,r}}):v?/* @__PURE__ */e.jsxs("div",{className:"Tabs--Title",children:[
+/* @__PURE__ */e.jsx(s.Typography,{color:"theme.secondary.1000",type:"s3",children:b(a.title)}),!a.remove_tab&&/* @__PURE__ */e.jsx(d.default,{size:"small",onClick:e=>{e.preventDefault(),e.stopPropagation(),v(a.tab_order)},children:/* @__PURE__ */e.jsx(t.default,{style:{fontSize:"15px",cursor:"pointer"}})})]}):/* @__PURE__ */e.jsx(s.Typography,{color:"theme.secondary.1000",type:"s3",children:b(a.title)})}),wrapped:!0,onDoubleClick:()=>{return e=a.tab_order,void g(e);var e}},a.tab_order))})}),m.map((a,t)=>a.content&&/* @__PURE__ */e.jsx(c.default,{value:t.toString(),children:T===t&&a.content},a.tab_order))]})})};
 //# sourceMappingURL=index.js.map

package/dist/components/tabs/tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/tabs/tabs.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\n/* eslint-disable unused-imports/no-unused-vars */\nimport React, { ReactNode, useEffect, useState } from \"react\";\nimport { Box, IconButton } from \"@mui/material\";\nimport Tab from \"@mui/material/Tab\";\nimport TabContext from \"@mui/lab/TabContext\";\nimport TabList from \"@mui/lab/TabList\";\nimport TabPanel from \"@mui/lab/TabPanel\";\nimport CloseIcon from \"@mui/icons-material/Close\";\n\nimport \"./tabs.scss\";\nimport TextField from \"../text-field/text-field\";\nimport { useTranslation } from \"react-i18next\";\nimport Typography from \"../typography/typography\";\n\ninterface TabItem {\n  tab_order: number;\n  title: string;\n  content?: string | ReactNode;\n  data?: any;\n  remove_tab?: boolean;\n}\nexport interface TabProps {\n  tabs: TabItem[];\n  activeValue?: number;\n  setActiveValue?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  onEditTabTitle?: (tabId: number, newTitle: string) => void;\n  handleTabChange?: () => void;\n  handleRemoveTab?: (tabId: number) => void;\n  isFormTabValid?: boolean ;\n  isTabViewOnly?: boolean;\n  activeTabs?: any[] ;\n  setActiveTabs?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  containerProps?: any;\n}\n\nexport default function TabBar(props: TabProps) {\n  const { t } = useTranslation();\n  const {\n    tabs,\n    onEditTabTitle,\n    activeValue,\n    setActiveValue,\n    handleTabChange,\n    handleRemoveTab,\n    // isFormTabValid ,  \n    isTabViewOnly,\n    activeTabs, \n    containerProps\n  } = props; \n  \n  const [value, setValue] = useState<number>(activeValue || 0);\n  const [editableTabId, setEditableTabId] = useState<number | null>(null);\n  useEffect(()=>{\n    activeValue && setValue(activeValue);\n\t} , [activeValue])\n\n  const handleChange = (_event: React.SyntheticEvent, newValue: number) => {\n    setValue(newValue);\n    setActiveValue && setActiveValue(newValue);\n    handleTabChange && handleTabChange();\n  };\n\n  const handleTabDoubleClick = (tabId: number) => {\n    setEditableTabId(tabId);\n  };\n\n  const handleEditTabTitle = (\n    event: React.ChangeEvent<HTMLInputElement>,\n    tabId: number,\n  ) => {\n    onEditTabTitle && onEditTabTitle(tabId, event.target.value);\n  };\n\n  // useEffect(() => {\n  //   if (setActiveValue && Boolean(tabs?.length)) setActiveValue(value);\n  //   // eslint-disable-next-line\n  // }, [tabs]);\n\n  return (\n    <Box mb={2} {...containerProps}>\n      <TabContext value={activeValue ?? value }>\n        <Box>\n          <TabList className=\"account-payble-tabs-wrap\" onChange={handleChange} variant=\"scrollable\" scrollButtons=\"auto\" aria-label=\"scrollable tabs\" sx={{ overflowX: 'auto', maxWidth: '100%' }}>\n            {tabs.map((tab: TabItem, index: any) => (\n              <Tab\n                className=\"account-payble-tab-items\"\n                key={tab.tab_order}\n              \n                label={\n                  <Box display='flex' alignItems='center'>\n                    {\n                        onEditTabTitle && editableTabId === tab.tab_order ? (\n                          <TextField\n                            value={tab.title}\n                            autoFocus\n                            onBlur={() => setEditableTabId(null)}\n                            onChange={(e: any) =>\n                              handleEditTabTitle(e, tab.tab_order)\n                            }\n                          />\n                        ) : handleRemoveTab ? (\n                          <div className=\"Tabs--Title\">\n                            <Typography color='theme.secondary.1000' type='s3'>{t(tab.title)}</Typography>\n                            {!tab.remove_tab && (\n                              <IconButton size=\"small\" onClick={(e) => {\n                                e.preventDefault();\n                                e.stopPropagation();\n                                handleRemoveTab(tab.tab_order);\n                              }}>\n                                <CloseIcon style={{ fontSize: \"15px\", cursor: \"pointer\" }}/>\n                              </IconButton>\n                            )}\n                          </div>\n                        ) : (\n                          <Typography color='theme.secondary.1000' type='s3'>{t(tab.title)}</Typography>\n                        )\n                    }\n                  </Box>\n                }\n                wrapped\n                onDoubleClick={() => handleTabDoubleClick(tab.tab_order)}\n              />\n            ))}\n          </TabList>\n        </Box>\n        {tabs.map(\n          (tab: TabItem, index: number) =>\n            tab.content && (\n              <TabPanel value={index.toString()} key={tab.tab_order}>\n                {value === index && tab.content}\n              </TabPanel>\n            ),\n        )}\n      </TabContext>\n    </Box>\n  );\n}\n"],"names":["props","t","useTranslation","tabs","onEditTabTitle","activeValue","setActiveValue","handleTabChange","handleRemoveTab","containerProps","value","setValue","useState","editableTabId","setEditableTabId","useEffect","jsx","Box","mb","children","jsxs","TabContext","TabList","className","onChange","_event","newValue","variant","scrollButtons","sx","overflowX","maxWidth","map","tab","index","Tab","label","display","alignItems","tab_order","TextField","title","autoFocus","onBlur","e","handleEditTabTitle","event","tabId","target","Typography","color","type","remove_tab","IconButton","size","onClick","preventDefault","stopPropagation","CloseIcon","style","fontSize","cursor","wrapped","onDoubleClick","handleTabDoubleClick","content","TabPanel","toString"],"mappings":"uqBAoCA,SAA+BA,GAC7B,MAAMC,EAAEA,GAAMC,oBACRC,KACJA,EAAAC,eACAA,EAAAC,YACAA,EAAAC,eACAA,EAAAC,gBACAA,EAAAC,gBACAA,EAAAC,eAIAA,GACET,GAEGU,EAAOC,GAAYC,EAAAA,SAAiBP,GAAe,IACnDQ,EAAeC,GAAoBF,EAAAA,SAAwB,MA2BlE,OA1BAG,EAAAA,UAAU,KACRV,GAAeM,EAASN,IACvB,CAACA,qBAyBFW,IAACC,EAAAA,IAAA,CAAIC,GAAI,KAAOT,EACdU,wBAAAC,EAAAA,KAACC,EAAAA,QAAA,CAAWX,MAAOL,GAAeK,EAChCS,SAAA;eAAAH,EAAAA,IAACC,EAAAA,IAAA,CACCE,wBAAAH,EAAAA,IAACM,EAAAA,QAAA,CAAQC,UAAU,2BAA2BC,SA1BjC,CAACC,EAA8BC,KAClDf,EAASe,GACTpB,GAAkBA,EAAeoB,GACjCnB,GAAmBA,KAuByDoB,QAAQ,aAAaC,cAAc,OAAO,aAAW,kBAAkBC,GAAI,CAAEC,UAAW,OAAQC,SAAU,QAC7KZ,SAAAhB,EAAK6B,IAAI,CAACC,EAAcC,mBACvBlB,EAAAA,IAACmB,EAAAA,QAAA,CACCZ,UAAU,2BAGVa,qBACEpB,EAAAA,IAACC,EAAAA,IAAA,CAAIoB,QAAQ,OAAOC,WAAW,SAEzBnB,SAAAf,GAAkBS,IAAkBoB,EAAIM,yBACtCvB,EAAAA,IAACwB,EAAAA,QAAA,CACC9B,MAAOuB,EAAIQ,MACXC,WAAS,EACTC,OAAQ,IAAM7B,EAAiB,MAC/BU,SAAWoB,IACTC,OA9B1BC,EA8B6CF,EA7B7CG,EA6BgDd,EAAIM,eA3BpDnC,GAAkBA,EAAe2C,EAAOD,EAAME,OAAOtC,QAJ5B,IACzBoC,EACAC,KAgCwBvC,iBACFY,EAAAA,KAAC,MAAA,CAAIG,UAAU,cACbJ,SAAA;eAAAH,EAAAA,IAACiC,EAAAA,WAAA,CAAWC,MAAM,uBAAuBC,KAAK,KAAMhC,SAAAlB,EAAEgC,EAAIQ,UACxDR,EAAImB,2BACJpC,EAAAA,IAACqC,EAAAA,YAAWC,KAAK,QAAQC,QAAUX,IACjCA,EAAEY,iBACFZ,EAAEa,kBACFjD,EAAgByB,EAAIM,YAEpBpB,wBAAAH,MAAC0C,EAAAA,QAAA,CAAUC,MAAO,CAAEC,SAAU,OAAQC,OAAQ,mCAKpD7C,IAACiC,EAAAA,WAAA,CAAWC,MAAM,uBAAuBC,KAAK,KAAMhC,SAAAlB,EAAEgC,EAAIQ,WAKpEqB,SAAO,EACPC,cAAe,KAAMC,OA1DLjB,EA0D0Bd,EAAIM,eAzD1DzB,EAAiBiC,GADU,IAACA,IAwBXd,EAAIM,gBAuChBpC,EAAK6B,IACJ,CAACC,EAAcC,IACbD,EAAIgC,8BACDC,EAAAA,QAAA,CAASxD,MAAOwB,EAAMiC,WACpBhD,SAAAT,IAAUwB,GAASD,EAAIgC,SADchC,EAAIM,gBAQ1D"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/tabs/tabs.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\n/* eslint-disable unused-imports/no-unused-vars */\nimport React, { ReactNode, useEffect, useState } from \"react\";\nimport { Box, IconButton } from \"@mui/material\";\nimport Tab from \"@mui/material/Tab\";\nimport TabContext from \"@mui/lab/TabContext\";\nimport TabList from \"@mui/lab/TabList\";\nimport TabPanel from \"@mui/lab/TabPanel\";\nimport CloseIcon from \"@mui/icons-material/Close\";\n\nimport \"./tabs.scss\";\nimport TextField from \"../text-field/text-field\";\nimport { useTranslation } from \"react-i18next\";\nimport Typography from \"../typography/typography\";\n\ninterface TabItem {\n  tab_order: number;\n  title: string;\n  content?: string | ReactNode;\n  data?: any;\n  remove_tab?: boolean;\n}\nexport interface TabProps {\n  tabs: TabItem[];\n  activeValue?: number;\n  setActiveValue?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  onEditTabTitle?: (tabId: number, newTitle: string) => void;\n  handleTabChange?: () => void;\n  handleRemoveTab?: (tabId: number) => void;\n  isFormTabValid?: boolean ;\n  isTabViewOnly?: boolean;\n  activeTabs?: any[] ;\n  setActiveTabs?: React.Dispatch<React.SetStateAction<number | undefined>>;\n  containerProps?: any;\n}\n\nexport default function TabBar(props: TabProps) {\n  const { t } = useTranslation();\n  const {\n    tabs,\n    onEditTabTitle,\n    activeValue,\n    setActiveValue,\n    handleTabChange,\n    handleRemoveTab,\n    // isFormTabValid ,  \n    isTabViewOnly,\n    activeTabs, \n    containerProps\n  } = props; \n  \n  const [value, setValue] = useState<number>(activeValue || 0);\n  const [editableTabId, setEditableTabId] = useState<number | null>(null);\n  useEffect(()=>{\n    activeValue && setValue(activeValue);\n\t} , [activeValue])\n\n  const handleChange = (_event: React.SyntheticEvent, newValue: number) => {\n    setValue(newValue);\n    setActiveValue && setActiveValue(newValue);\n    handleTabChange && handleTabChange();\n  };\n\n  const handleTabDoubleClick = (tabId: number) => {\n    setEditableTabId(tabId);\n  };\n\n  const handleEditTabTitle = (\n    event: React.ChangeEvent<HTMLInputElement>,\n    tabId: number,\n  ) => {\n    onEditTabTitle && onEditTabTitle(tabId, event.target.value);\n  };\n\n  // useEffect(() => {\n  //   if (setActiveValue && Boolean(tabs?.length)) setActiveValue(value);\n  //   // eslint-disable-next-line\n  // }, [tabs]);\n\n  return (\n    <Box mb={2} {...containerProps}>\n      <TabContext value={activeValue ?? value }>\n        <Box>\n          <TabList className=\"account-payble-tabs-wrap\" onChange={handleChange} variant=\"scrollable\" scrollButtons=\"auto\" aria-label=\"scrollable tabs\" sx={{ overflowX: 'auto', maxWidth: '100%' }}>\n            {tabs.map((tab: TabItem, index: any) => (\n              <Tab\n                className=\"account-payble-tab-items\"\n                key={tab.tab_order}\n              \n                label={\n                  <Box display='flex' alignItems='center'>\n                    {\n                        onEditTabTitle && editableTabId === tab.tab_order ? (\n                          <TextField\n                            value={tab.title}\n                            autoFocus\n                            onBlur={() => setEditableTabId(null)}\n                            onChange={(e: any) =>\n                              handleEditTabTitle(e, tab.tab_order)\n                            }\n                          />\n                        ) : handleRemoveTab ? (\n                          <div className=\"Tabs--Title\">\n                            <Typography color='theme.secondary.1000' type='s3'>{t(tab.title)}</Typography>\n                            {!tab.remove_tab && (\n                              <IconButton size=\"small\" onClick={(e) => {\n                                e.preventDefault();\n                                e.stopPropagation();\n                                handleRemoveTab(tab.tab_order);\n                              }}>\n                                <CloseIcon style={{ fontSize: \"15px\", cursor: \"pointer\" }}/>\n                              </IconButton>\n                            )}\n                          </div>\n                        ) : (\n                          <Typography color='theme.secondary.1000' type='s3'>{t(tab.title)}</Typography>\n                        )\n                    }\n                  </Box>\n                }\n                wrapped\n                onDoubleClick={() => handleTabDoubleClick(tab.tab_order)}\n              />\n            ))}\n          </TabList>\n        </Box>\n        {tabs.map(\n          (tab: TabItem, index: number) =>\n            tab.content && (\n              <TabPanel value={index.toString()} key={tab.tab_order}>\n                {value === index && tab.content}\n              </TabPanel>\n            ),\n        )}\n      </TabContext>\n    </Box>\n  );\n}\n"],"names":["props","t","useTranslation","tabs","onEditTabTitle","activeValue","setActiveValue","handleTabChange","handleRemoveTab","containerProps","value","setValue","useState","editableTabId","setEditableTabId","useEffect","jsx","Box","mb","children","jsxs","TabContext","TabList","className","onChange","_event","newValue","variant","scrollButtons","sx","overflowX","maxWidth","map","tab","index","Tab","label","display","alignItems","tab_order","TextField","title","autoFocus","onBlur","e","handleEditTabTitle","event","tabId","target","Typography","color","type","remove_tab","IconButton","size","onClick","preventDefault","stopPropagation","CloseIcon","style","fontSize","cursor","wrapped","onDoubleClick","handleTabDoubleClick","content","TabPanel","toString"],"mappings":"+xBAoCA,SAA+BA,GAC7B,MAAMC,EAAEA,GAAMC,oBACRC,KACJA,EAAAC,eACAA,EAAAC,YACAA,EAAAC,eACAA,EAAAC,gBACAA,EAAAC,gBACAA,EAAAC,eAIAA,GACET,GAEGU,EAAOC,GAAYC,EAAAA,SAAiBP,GAAe,IACnDQ,EAAeC,GAAoBF,EAAAA,SAAwB,MA2BlE,OA1BAG,EAAAA,UAAU,KACRV,GAAeM,EAASN,IACvB,CAACA,qBAyBFW,IAACC,EAAAA,QAAA,CAAIC,GAAI,KAAOT,EACdU,wBAAAC,EAAAA,KAACC,EAAAA,QAAA,CAAWX,MAAOL,GAAeK,EAChCS,SAAA;eAAAH,EAAAA,IAACC,EAAAA,QAAA,CACCE,wBAAAH,EAAAA,IAACM,EAAAA,QAAA,CAAQC,UAAU,2BAA2BC,SA1BjC,CAACC,EAA8BC,KAClDf,EAASe,GACTpB,GAAkBA,EAAeoB,GACjCnB,GAAmBA,KAuByDoB,QAAQ,aAAaC,cAAc,OAAO,aAAW,kBAAkBC,GAAI,CAAEC,UAAW,OAAQC,SAAU,QAC7KZ,SAAAhB,EAAK6B,IAAI,CAACC,EAAcC,mBACvBlB,EAAAA,IAACmB,EAAAA,QAAA,CACCZ,UAAU,2BAGVa,qBACEpB,EAAAA,IAACC,EAAAA,QAAA,CAAIoB,QAAQ,OAAOC,WAAW,SAEzBnB,SAAAf,GAAkBS,IAAkBoB,EAAIM,yBACtCvB,EAAAA,IAACwB,EAAAA,QAAA,CACC9B,MAAOuB,EAAIQ,MACXC,WAAS,EACTC,OAAQ,IAAM7B,EAAiB,MAC/BU,SAAWoB,IACTC,OA9B1BC,EA8B6CF,EA7B7CG,EA6BgDd,EAAIM,eA3BpDnC,GAAkBA,EAAe2C,EAAOD,EAAME,OAAOtC,QAJ5B,IACzBoC,EACAC,KAgCwBvC,iBACFY,EAAAA,KAAC,MAAA,CAAIG,UAAU,cACbJ,SAAA;eAAAH,EAAAA,IAACiC,EAAAA,WAAA,CAAWC,MAAM,uBAAuBC,KAAK,KAAMhC,SAAAlB,EAAEgC,EAAIQ,UACxDR,EAAImB,2BACJpC,EAAAA,IAACqC,EAAAA,SAAWC,KAAK,QAAQC,QAAUX,IACjCA,EAAEY,iBACFZ,EAAEa,kBACFjD,EAAgByB,EAAIM,YAEpBpB,wBAAAH,MAAC0C,EAAAA,QAAA,CAAUC,MAAO,CAAEC,SAAU,OAAQC,OAAQ,mCAKpD7C,IAACiC,EAAAA,WAAA,CAAWC,MAAM,uBAAuBC,KAAK,KAAMhC,SAAAlB,EAAEgC,EAAIQ,WAKpEqB,SAAO,EACPC,cAAe,KAAMC,OA1DLjB,EA0D0Bd,EAAIM,eAzD1DzB,EAAiBiC,GADU,IAACA,IAwBXd,EAAIM,gBAuChBpC,EAAK6B,IACJ,CAACC,EAAcC,IACbD,EAAIgC,8BACDC,EAAAA,QAAA,CAASxD,MAAOwB,EAAMiC,WACpBhD,SAAAT,IAAUwB,GAASD,EAAIgC,SADchC,EAAIM,gBAQ1D"}

package/dist/components/text-area/text-area/index.esm.js

@@ -1,7 +1,7 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { TextareaAutosize } from "@mui/base";
-import { styled } from "@mui/material";
 import { Typography } from "../../typography/typography/index.esm.js";
+import styled from "../../../node_modules/@mui/material/styles/styled/index.esm.js";
+import { TextareaAutosize } from "../../../node_modules/@mui/base/TextareaAutosize/TextareaAutosize/index.esm.js";
 const TextArea = (props) => {
   const { placeholder, minRows = 3, label, helperText, error, ...rest } = props;
   const StyledTextArea = styled(TextareaAutosize)(({ theme: { palette } }) => {

package/dist/components/text-area/text-area/index.js

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@mui/base"),o=require("@mui/material"),t=require("../../typography/typography/index.js");exports.default=l=>{const{placeholder:i,minRows:d=3,label:a,helperText:m,error:n,...s}=l,h=o.styled(r.TextareaAutosize)(({theme:{palette:e}})=>{var r,o,t,l,i,d,a,m;return{"&":{padding:"0.4375rem 0.5rem",borderRadius:"0.25rem",borderColor:n?null==(r=e.theme)?void 0:r.error[600]:null==(o=e.theme)?void 0:o.secondary[400],outline:"none",color:null==(t=e.theme)?void 0:t.secondary[800],fontSize:"0.875rem","&::placeholder":{opacity:1},"&:hover":{borderColor:n?null==(l=e.theme)?void 0:l.error[600]:null==(i=e.theme)?void 0:i.secondary[500]},"&:focus-visible":{borderWidth:"0.0625rem",borderStyle:"solid",borderColor:n?null==(d=e.theme)?void 0:d.error[600]:null==(a=e.theme)?void 0:a.primary[700]},"&:disabled":{background:null==(m=e.theme)?void 0:m.secondary[200]}}}});/* @__PURE__ */
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../typography/typography/index.js"),o=require("../../../node_modules/@mui/material/styles/styled/index.js"),t=require("../../../node_modules/@mui/base/TextareaAutosize/TextareaAutosize/index.js");exports.default=l=>{const{placeholder:d,minRows:i=3,label:a,helperText:n,error:s,...m}=l,u=o.default(t.TextareaAutosize)(({theme:{palette:e}})=>{var r,o,t,l,d,i,a,n;return{"&":{padding:"0.4375rem 0.5rem",borderRadius:"0.25rem",borderColor:s?null==(r=e.theme)?void 0:r.error[600]:null==(o=e.theme)?void 0:o.secondary[400],outline:"none",color:null==(t=e.theme)?void 0:t.secondary[800],fontSize:"0.875rem","&::placeholder":{opacity:1},"&:hover":{borderColor:s?null==(l=e.theme)?void 0:l.error[600]:null==(d=e.theme)?void 0:d.secondary[500]},"&:focus-visible":{borderWidth:"0.0625rem",borderStyle:"solid",borderColor:s?null==(i=e.theme)?void 0:i.error[600]:null==(a=e.theme)?void 0:a.primary[700]},"&:disabled":{background:null==(n=e.theme)?void 0:n.secondary[200]}}}});/* @__PURE__ */
 return e.jsxs(e.Fragment,{children:[
-/* @__PURE__ */e.jsx(t.Typography,{type:"s4",fontWeight:"medium",mb:.5,color:n?"theme.error.600":"theme.secondary.800",children:a}),
-/* @__PURE__ */e.jsx(h,{"aria-label":"minimum height",minRows:d,placeholder:i,...s}),
-/* @__PURE__ */e.jsx(t.Typography,{type:"s4",fontWeight:"medium",mt:-.25,color:n?"theme.error.600":"theme.secondary.800",children:m})]})};
+/* @__PURE__ */e.jsx(r.Typography,{type:"s4",fontWeight:"medium",mb:.5,color:s?"theme.error.600":"theme.secondary.800",children:a}),
+/* @__PURE__ */e.jsx(u,{"aria-label":"minimum height",minRows:i,placeholder:d,...m}),
+/* @__PURE__ */e.jsx(r.Typography,{type:"s4",fontWeight:"medium",mt:-.25,color:s?"theme.error.600":"theme.secondary.800",children:n})]})};
 //# sourceMappingURL=index.js.map

package/dist/components/text-area/text-area/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/text-area/text-area.tsx"],"sourcesContent":["import {\n  TextareaAutosize as MUITextArea,\n  TextareaAutosizeProps,\n} from \"@mui/base\";\nimport { styled } from \"@mui/material\";\nimport Typography from \"../typography/typography\";\n\ninterface TextAreaProps extends TextareaAutosizeProps {\n  label?: string;\n  error?: boolean;\n  helperText?: string;\n}\n\nconst TextArea = (props: TextAreaProps) => {\n  const { placeholder, minRows = 3, label, helperText, error, ...rest } = props;\n\n  const StyledTextArea = styled(MUITextArea)(({ theme: { palette } }) => ({\n    \"&\": {\n      padding: \"0.4375rem 0.5rem\",\n      borderRadius: \"0.25rem\",\n      borderColor: error\n        ? palette.theme?.error[600]\n        : palette.theme?.secondary[400],\n      outline: \"none\",\n      color: palette.theme?.secondary[800],\n      fontSize: \"0.875rem\",\n      \"&::placeholder\": {\n        opacity: 1,\n      },\n      \"&:hover\": {\n        borderColor: error\n          ? palette.theme?.error[600]\n          : palette.theme?.secondary[500],\n      },\n      \"&:focus-visible\": {\n        borderWidth: \"0.0625rem\",\n        borderStyle: \"solid\",\n        borderColor: error\n          ? palette.theme?.error[600]\n          : palette.theme?.primary[700],\n      },\n      \"&:disabled\": {\n        background: palette.theme?.secondary[200],\n      },\n    },\n  }));\n\n  return (\n    <>\n      <Typography\n        type=\"s4\"\n        fontWeight={\"medium\"}\n        mb={0.5}\n        color={error ? \"theme.error.600\" : \"theme.secondary.800\"}\n      >\n        {label}\n      </Typography>\n      <StyledTextArea\n        aria-label=\"minimum height\"\n        minRows={minRows}\n        placeholder={placeholder}\n        {...rest}\n      />\n\n      <Typography\n        type=\"s4\"\n        fontWeight={\"medium\"}\n        mt={-0.25}\n        color={error ? \"theme.error.600\" : \"theme.secondary.800\"}\n      >\n        {helperText}\n      </Typography>\n    </>\n  );\n};\nexport default TextArea;\n"],"names":["props","placeholder","minRows","label","helperText","error","rest","StyledTextArea","styled","MUITextArea","theme","palette","padding","borderRadius","borderColor","_a","_b","secondary","outline","color","_c","fontSize","opacity","_d","_e","borderWidth","borderStyle","_f","_g","primary","background","_h","jsxs","Fragment","children","jsx","Typography","type","fontWeight","mb","mt"],"mappings":"2NAakBA,IAChB,MAAMC,YAAEA,UAAaC,EAAU,EAAAC,MAAGA,aAAOC,EAAAC,MAAYA,KAAUC,GAASN,EAElEO,EAAiBC,EAAAA,OAAOC,mBAAPD,CAAoB,EAAGE,OAASC,mCAAiB,MAAA,CACtE,IAAK,CACHC,QAAS,mBACTC,aAAc,UACdC,YAAaT,EACT,OAAAU,EAAAJ,EAAQD,YAAR,EAAAK,EAAeV,MAAM,KACrB,OAAAW,EAAAL,EAAQD,YAAR,EAAAM,EAAeC,UAAU,KAC7BC,QAAS,OACTC,MAAO,OAAAC,EAAAT,EAAQD,YAAR,EAAAU,EAAeH,UAAU,KAChCI,SAAU,WACV,iBAAkB,CAChBC,QAAS,GAEX,UAAW,CACTR,YAAaT,EACT,OAAAkB,EAAAZ,EAAQD,YAAR,EAAAa,EAAelB,MAAM,KACrB,OAAAmB,EAAAb,EAAQD,YAAR,EAAAc,EAAeP,UAAU,MAE/B,kBAAmB,CACjBQ,YAAa,YACbC,YAAa,QACbZ,YAAaT,EACT,OAAAsB,EAAAhB,EAAQD,YAAR,EAAAiB,EAAetB,MAAM,KACrB,OAAAuB,EAAAjB,EAAQD,YAAR,EAAAkB,EAAeC,QAAQ,MAE7B,aAAc,CACZC,WAAY,OAAAC,EAAApB,EAAQD,YAAR,EAAAqB,EAAed,UAAU;AAK3C,OACEe,EAAAA,KAAAC,WAAA,CACEC,SAAA;eAAAC,EAAAA,IAACC,EAAAA,WAAA,CACCC,KAAK,KACLC,WAAY,SACZC,GAAI,GACJpB,MAAOd,EAAQ,kBAAoB,sBAElC6B,SAAA/B;eAEHgC,EAAAA,IAAC5B,EAAA,CACC,aAAW,iBACXL,UACAD,iBACIK;eAGN6B,EAAAA,IAACC,EAAAA,WAAA,CACCC,KAAK,KACLC,WAAY,SACZE,IAAI,IACJrB,MAAOd,EAAQ,kBAAoB,sBAElC6B,SAAA9B"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/text-area/text-area.tsx"],"sourcesContent":["import {\n  TextareaAutosize as MUITextArea,\n  TextareaAutosizeProps,\n} from \"@mui/base\";\nimport { styled } from \"@mui/material\";\nimport Typography from \"../typography/typography\";\n\ninterface TextAreaProps extends TextareaAutosizeProps {\n  label?: string;\n  error?: boolean;\n  helperText?: string;\n}\n\nconst TextArea = (props: TextAreaProps) => {\n  const { placeholder, minRows = 3, label, helperText, error, ...rest } = props;\n\n  const StyledTextArea = styled(MUITextArea)(({ theme: { palette } }) => ({\n    \"&\": {\n      padding: \"0.4375rem 0.5rem\",\n      borderRadius: \"0.25rem\",\n      borderColor: error\n        ? palette.theme?.error[600]\n        : palette.theme?.secondary[400],\n      outline: \"none\",\n      color: palette.theme?.secondary[800],\n      fontSize: \"0.875rem\",\n      \"&::placeholder\": {\n        opacity: 1,\n      },\n      \"&:hover\": {\n        borderColor: error\n          ? palette.theme?.error[600]\n          : palette.theme?.secondary[500],\n      },\n      \"&:focus-visible\": {\n        borderWidth: \"0.0625rem\",\n        borderStyle: \"solid\",\n        borderColor: error\n          ? palette.theme?.error[600]\n          : palette.theme?.primary[700],\n      },\n      \"&:disabled\": {\n        background: palette.theme?.secondary[200],\n      },\n    },\n  }));\n\n  return (\n    <>\n      <Typography\n        type=\"s4\"\n        fontWeight={\"medium\"}\n        mb={0.5}\n        color={error ? \"theme.error.600\" : \"theme.secondary.800\"}\n      >\n        {label}\n      </Typography>\n      <StyledTextArea\n        aria-label=\"minimum height\"\n        minRows={minRows}\n        placeholder={placeholder}\n        {...rest}\n      />\n\n      <Typography\n        type=\"s4\"\n        fontWeight={\"medium\"}\n        mt={-0.25}\n        color={error ? \"theme.error.600\" : \"theme.secondary.800\"}\n      >\n        {helperText}\n      </Typography>\n    </>\n  );\n};\nexport default TextArea;\n"],"names":["props","placeholder","minRows","label","helperText","error","rest","StyledTextArea","styled","MUITextArea","theme","palette","padding","borderRadius","borderColor","_a","_b","secondary","outline","color","_c","fontSize","opacity","_d","_e","borderWidth","borderStyle","_f","_g","primary","background","_h","jsxs","Fragment","children","jsx","Typography","type","fontWeight","mb","mt"],"mappings":"yUAakBA,IAChB,MAAMC,YAAEA,UAAaC,EAAU,EAAAC,MAAGA,aAAOC,EAAAC,MAAYA,KAAUC,GAASN,EAElEO,EAAiBC,EAAAA,QAAOC,mBAAPD,CAAoB,EAAGE,OAASC,mCAAiB,MAAA,CACtE,IAAK,CACHC,QAAS,mBACTC,aAAc,UACdC,YAAaT,EACT,OAAAU,EAAAJ,EAAQD,YAAR,EAAAK,EAAeV,MAAM,KACrB,OAAAW,EAAAL,EAAQD,YAAR,EAAAM,EAAeC,UAAU,KAC7BC,QAAS,OACTC,MAAO,OAAAC,EAAAT,EAAQD,YAAR,EAAAU,EAAeH,UAAU,KAChCI,SAAU,WACV,iBAAkB,CAChBC,QAAS,GAEX,UAAW,CACTR,YAAaT,EACT,OAAAkB,EAAAZ,EAAQD,YAAR,EAAAa,EAAelB,MAAM,KACrB,OAAAmB,EAAAb,EAAQD,YAAR,EAAAc,EAAeP,UAAU,MAE/B,kBAAmB,CACjBQ,YAAa,YACbC,YAAa,QACbZ,YAAaT,EACT,OAAAsB,EAAAhB,EAAQD,YAAR,EAAAiB,EAAetB,MAAM,KACrB,OAAAuB,EAAAjB,EAAQD,YAAR,EAAAkB,EAAeC,QAAQ,MAE7B,aAAc,CACZC,WAAY,OAAAC,EAAApB,EAAQD,YAAR,EAAAqB,EAAed,UAAU;AAK3C,OACEe,EAAAA,KAAAC,WAAA,CACEC,SAAA;eAAAC,EAAAA,IAACC,EAAAA,WAAA,CACCC,KAAK,KACLC,WAAY,SACZC,GAAI,GACJpB,MAAOd,EAAQ,kBAAoB,sBAElC6B,SAAA/B;eAEHgC,EAAAA,IAAC5B,EAAA,CACC,aAAW,iBACXL,UACAD,iBACIK;eAGN6B,EAAAA,IAACC,EAAAA,WAAA,CACCC,KAAK,KACLC,WAAY,SACZE,IAAI,IACJrB,MAAOd,EAAQ,kBAAoB,sBAElC6B,SAAA9B"}

package/dist/components/text-field/text-field/index.esm.js

@@ -1,8 +1,9 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { styled, TextField as TextField$1 } from "@mui/material";
 /* empty css                           */
 import { Typography } from "../../typography/typography/index.esm.js";
 import { memo } from "react";
+import styled from "../../../node_modules/@mui/material/styles/styled/index.esm.js";
+import TextField$1 from "../../../node_modules/@mui/material/TextField/TextField/index.esm.js";
 const StyledTextField = styled(TextField$1)(({ theme: { palette } }) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
   return {

package/dist/components/text-field/text-field/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../src/components/text-field/text-field.tsx"],"sourcesContent":["import {\n  TextField as MUITextField,\n  // TextFieldProps,\n  styled,\n} from \"@mui/material\";\nimport \"./text-field.scss\";\nimport Typography from \"../typography/typography\";\nimport { memo } from \"react\";\n\nconst StyledTextField = styled(MUITextField)(({ theme: { palette } }) => ({\n  \"& .MuiOutlinedInput-root\": {\n    padding: \"0\",\n    color: palette.theme?.secondary[800],\n    \"& fieldset\": {\n      borderColor: palette.theme?.secondary[400],\n    },\n    \"&:hover fieldset\": {\n      borderColor: palette.theme?.secondary[500],\n    },\n    \"&.Mui-focused fieldset\": {\n      borderWidth: \"0.0625rem\",\n      borderStyle: \"solid\",\n      borderColor: palette.theme?.primary[700],\n    },\n    \"&.Mui-error fieldset\": {\n      borderColor: palette.theme?.error[600],\n    },\n    \"&.Mui-error .MuiInputBase-input::placeholder\": {\n      color: palette.theme?.error[600],\n    },\n    \"&.Mui-disabled\": {\n      background: palette.theme?.secondary[200],\n      color: palette.theme?.secondary[800],\n    },\n    \"& .MuiInputBase-input::placeholder\": {\n      color: palette.theme?.secondary[800],\n      opacity: 1,\n    },\n  },\n  \"& .MuiFormHelperText-root\": {\n    marginLeft: 0,\n    color: palette.theme?.secondary[800],\n    \"&.Mui-error\": {\n      color: palette.theme?.error[600],\n    },\n  },\n  \"& .MuiIconButton-root\": {\n    marginRight: 0,\n  },\n}));\n\nconst TextField = memo((props: any) => {\n  const {\n    required,\n    placeholder,\n    label,\n    error = false,\n    dataPosition,\n    dataName,\n    hidden,\n    ...rest\n  } = props;\n  return (\n    <>\n      {label && !hidden && (\n        <Typography\n          type=\"s5\"\n          weight={\"medium\"}\n          mb={0.5}\n          color={error ? \"theme.error.600\" : \"theme.secondary.800\"}\n          data-position={dataPosition}\n          data-name={dataName}\n        >\n          {label} {required && <span className=\"requiredStar\">*</span>}\n        </Typography>\n      )}\n      <StyledTextField\n        error={error}\n        placeholder={placeholder}\n        className=\"textfield\"\n        hidden={hidden}\n        {...rest}\n      />\n    </>\n  );\n});\n\nexport default TextField;\n"],"names":["MUITextField"],"mappings":";;;;;AASA,MAAM,kBAAkB,OAAOA,WAAY,EAAE,CAAC,EAAE,OAAO,EAAE,QAAA,QAAU;;AAAO;AAAA,IACxE,4BAA4B;AAAA,MAC1B,SAAS;AAAA,MACT,QAAO,aAAQ,UAAR,mBAAe,UAAU;AAAA,MAChC,cAAc;AAAA,QACZ,cAAa,aAAQ,UAAR,mBAAe,UAAU;AAAA,MAAG;AAAA,MAE3C,oBAAoB;AAAA,QAClB,cAAa,aAAQ,UAAR,mBAAe,UAAU;AAAA,MAAG;AAAA,MAE3C,0BAA0B;AAAA,QACxB,aAAa;AAAA,QACb,aAAa;AAAA,QACb,cAAa,aAAQ,UAAR,mBAAe,QAAQ;AAAA,MAAG;AAAA,MAEzC,wBAAwB;AAAA,QACtB,cAAa,aAAQ,UAAR,mBAAe,MAAM;AAAA,MAAG;AAAA,MAEvC,gDAAgD;AAAA,QAC9C,QAAO,aAAQ,UAAR,mBAAe,MAAM;AAAA,MAAG;AAAA,MAEjC,kBAAkB;AAAA,QAChB,aAAY,aAAQ,UAAR,mBAAe,UAAU;AAAA,QACrC,QAAO,aAAQ,UAAR,mBAAe,UAAU;AAAA,MAAG;AAAA,MAErC,sCAAsC;AAAA,QACpC,QAAO,aAAQ,UAAR,mBAAe,UAAU;AAAA,QAChC,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,IAEF,6BAA6B;AAAA,MAC3B,YAAY;AAAA,MACZ,QAAO,aAAQ,UAAR,mBAAe,UAAU;AAAA,MAChC,eAAe;AAAA,QACb,QAAO,aAAQ,UAAR,mBAAe,MAAM;AAAA,MAAG;AAAA,IACjC;AAAA,IAEF,yBAAyB;AAAA,MACvB,aAAa;AAAA,IAAA;AAAA,EAEjB;AAAA,CAAE;AAEF,MAAM,YAAY,KAAK,CAAC,UAAe;AACrC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AACJ,SACE,qBAAA,UAAA,EACG,UAAA;AAAA,IAAA,SAAS,CAAC,UACT;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,QAAQ;AAAA,QACR,IAAI;AAAA,QACJ,OAAO,QAAQ,oBAAoB;AAAA,QACnC,iBAAe;AAAA,QACf,aAAW;AAAA,QAEV,UAAA;AAAA,UAAA;AAAA,UAAM;AAAA,UAAE,YAAY,oBAAC,QAAA,EAAK,WAAU,gBAAe,UAAA,IAAA,CAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAGzD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAU;AAAA,QACV;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EACN,GACF;AAEJ,CAAC;"}
+{"version":3,"file":"index.esm.js","sources":["../../../../src/components/text-field/text-field.tsx"],"sourcesContent":["import {\n  TextField as MUITextField,\n  // TextFieldProps,\n  styled,\n} from \"@mui/material\";\nimport \"./text-field.scss\";\nimport Typography from \"../typography/typography\";\nimport { memo } from \"react\";\n\nconst StyledTextField = styled(MUITextField)(({ theme: { palette } }) => ({\n  \"& .MuiOutlinedInput-root\": {\n    padding: \"0\",\n    color: palette.theme?.secondary[800],\n    \"& fieldset\": {\n      borderColor: palette.theme?.secondary[400],\n    },\n    \"&:hover fieldset\": {\n      borderColor: palette.theme?.secondary[500],\n    },\n    \"&.Mui-focused fieldset\": {\n      borderWidth: \"0.0625rem\",\n      borderStyle: \"solid\",\n      borderColor: palette.theme?.primary[700],\n    },\n    \"&.Mui-error fieldset\": {\n      borderColor: palette.theme?.error[600],\n    },\n    \"&.Mui-error .MuiInputBase-input::placeholder\": {\n      color: palette.theme?.error[600],\n    },\n    \"&.Mui-disabled\": {\n      background: palette.theme?.secondary[200],\n      color: palette.theme?.secondary[800],\n    },\n    \"& .MuiInputBase-input::placeholder\": {\n      color: palette.theme?.secondary[800],\n      opacity: 1,\n    },\n  },\n  \"& .MuiFormHelperText-root\": {\n    marginLeft: 0,\n    color: palette.theme?.secondary[800],\n    \"&.Mui-error\": {\n      color: palette.theme?.error[600],\n    },\n  },\n  \"& .MuiIconButton-root\": {\n    marginRight: 0,\n  },\n}));\n\nconst TextField = memo((props: any) => {\n  const {\n    required,\n    placeholder,\n    label,\n    error = false,\n    dataPosition,\n    dataName,\n    hidden,\n    ...rest\n  } = props;\n  return (\n    <>\n      {label && !hidden && (\n        <Typography\n          type=\"s5\"\n          weight={\"medium\"}\n          mb={0.5}\n          color={error ? \"theme.error.600\" : \"theme.secondary.800\"}\n          data-position={dataPosition}\n          data-name={dataName}\n        >\n          {label} {required && <span className=\"requiredStar\">*</span>}\n        </Typography>\n      )}\n      <StyledTextField\n        error={error}\n        placeholder={placeholder}\n        className=\"textfield\"\n        hidden={hidden}\n        {...rest}\n      />\n    </>\n  );\n});\n\nexport default TextField;\n"],"names":["MUITextField"],"mappings":";;;;;;AASA,MAAM,kBAAkB,OAAOA,WAAY,EAAE,CAAC,EAAE,OAAO,EAAE,QAAA,QAAU;;AAAO;AAAA,IACxE,4BAA4B;AAAA,MAC1B,SAAS;AAAA,MACT,QAAO,aAAQ,UAAR,mBAAe,UAAU;AAAA,MAChC,cAAc;AAAA,QACZ,cAAa,aAAQ,UAAR,mBAAe,UAAU;AAAA,MAAG;AAAA,MAE3C,oBAAoB;AAAA,QAClB,cAAa,aAAQ,UAAR,mBAAe,UAAU;AAAA,MAAG;AAAA,MAE3C,0BAA0B;AAAA,QACxB,aAAa;AAAA,QACb,aAAa;AAAA,QACb,cAAa,aAAQ,UAAR,mBAAe,QAAQ;AAAA,MAAG;AAAA,MAEzC,wBAAwB;AAAA,QACtB,cAAa,aAAQ,UAAR,mBAAe,MAAM;AAAA,MAAG;AAAA,MAEvC,gDAAgD;AAAA,QAC9C,QAAO,aAAQ,UAAR,mBAAe,MAAM;AAAA,MAAG;AAAA,MAEjC,kBAAkB;AAAA,QAChB,aAAY,aAAQ,UAAR,mBAAe,UAAU;AAAA,QACrC,QAAO,aAAQ,UAAR,mBAAe,UAAU;AAAA,MAAG;AAAA,MAErC,sCAAsC;AAAA,QACpC,QAAO,aAAQ,UAAR,mBAAe,UAAU;AAAA,QAChC,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,IAEF,6BAA6B;AAAA,MAC3B,YAAY;AAAA,MACZ,QAAO,aAAQ,UAAR,mBAAe,UAAU;AAAA,MAChC,eAAe;AAAA,QACb,QAAO,aAAQ,UAAR,mBAAe,MAAM;AAAA,MAAG;AAAA,IACjC;AAAA,IAEF,yBAAyB;AAAA,MACvB,aAAa;AAAA,IAAA;AAAA,EAEjB;AAAA,CAAE;AAEF,MAAM,YAAY,KAAK,CAAC,UAAe;AACrC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AACJ,SACE,qBAAA,UAAA,EACG,UAAA;AAAA,IAAA,SAAS,CAAC,UACT;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,QAAQ;AAAA,QACR,IAAI;AAAA,QACJ,OAAO,QAAQ,oBAAoB;AAAA,QACnC,iBAAe;AAAA,QACf,aAAW;AAAA,QAEV,UAAA;AAAA,UAAA;AAAA,UAAM;AAAA,UAAE,YAAY,oBAAC,QAAA,EAAK,WAAU,gBAAe,UAAA,IAAA,CAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAGzD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAU;AAAA,QACV;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EACN,GACF;AAEJ,CAAC;"}

package/dist/components/text-field/text-field/index.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@mui/material");;/* empty css                        */var o=,/* empty css                                 */t=require("react");const l=r.styled(r.TextField)(({theme:{palette:e}})=>{var r,o,t,l,d,i,a,n,u,s,c;return{"& .MuiOutlinedInput-root":{padding:"0",color:null==(r=e.theme)?void 0:r.secondary[800],"& fieldset":{borderColor:null==(o=e.theme)?void 0:o.secondary[400]},"&:hover fieldset":{borderColor:null==(t=e.theme)?void 0:t.secondary[500]},"&.Mui-focused fieldset":{borderWidth:"0.0625rem",borderStyle:"solid",borderColor:null==(l=e.theme)?void 0:l.primary[700]},"&.Mui-error fieldset":{borderColor:null==(d=e.theme)?void 0:d.error[600]},"&.Mui-error .MuiInputBase-input::placeholder":{color:null==(i=e.theme)?void 0:i.error[600]},"&.Mui-disabled":{background:null==(a=e.theme)?void 0:a.secondary[200],color:null==(n=e.theme)?void 0:n.secondary[800]},"& .MuiInputBase-input::placeholder":{color:null==(u=e.theme)?void 0:u.secondary[800],opacity:1}},"& .MuiFormHelperText-root":{marginLeft:0,color:null==(s=e.theme)?void 0:s.secondary[800],"&.Mui-error":{color:null==(c=e.theme)?void 0:c.error[600]}},"& .MuiIconButton-root":{marginRight:0}}}),d=t.memo(r=>{const{required:t,placeholder:d,label:i,error:a=!1,dataPosition:n,dataName:u,hidden:s,...c}=r;/* @__PURE__ */
-return e.jsxs(e.Fragment,{children:[i&&!s&&/* @__PURE__ */e.jsxs(o.Typography,{type:"s5",weight:"medium",mb:.5,color:a?"theme.error.600":"theme.secondary.800","data-position":n,"data-name":u,children:[i," ",t&&/* @__PURE__ */e.jsx("span",{className:"requiredStar",children:"*"})]}),
-/* @__PURE__ */e.jsx(l,{error:a,placeholder:d,className:"textfield",hidden:s,...c})]})});exports.default=d;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");;/* empty css                        */var r=,/* empty css                                 */o=require("react"),t=,/* empty css                                                       */d=;/* empty css                                                             */const l=t.default(d.default)(({theme:{palette:e}})=>{var r,o,t,d,l,i,a,n,u,s,m;return{"& .MuiOutlinedInput-root":{padding:"0",color:null==(r=e.theme)?void 0:r.secondary[800],"& fieldset":{borderColor:null==(o=e.theme)?void 0:o.secondary[400]},"&:hover fieldset":{borderColor:null==(t=e.theme)?void 0:t.secondary[500]},"&.Mui-focused fieldset":{borderWidth:"0.0625rem",borderStyle:"solid",borderColor:null==(d=e.theme)?void 0:d.primary[700]},"&.Mui-error fieldset":{borderColor:null==(l=e.theme)?void 0:l.error[600]},"&.Mui-error .MuiInputBase-input::placeholder":{color:null==(i=e.theme)?void 0:i.error[600]},"&.Mui-disabled":{background:null==(a=e.theme)?void 0:a.secondary[200],color:null==(n=e.theme)?void 0:n.secondary[800]},"& .MuiInputBase-input::placeholder":{color:null==(u=e.theme)?void 0:u.secondary[800],opacity:1}},"& .MuiFormHelperText-root":{marginLeft:0,color:null==(s=e.theme)?void 0:s.secondary[800],"&.Mui-error":{color:null==(m=e.theme)?void 0:m.error[600]}},"& .MuiIconButton-root":{marginRight:0}}}),i=o.memo(o=>{const{required:t,placeholder:d,label:i,error:a=!1,dataPosition:n,dataName:u,hidden:s,...m}=o;/* @__PURE__ */
+return e.jsxs(e.Fragment,{children:[i&&!s&&/* @__PURE__ */e.jsxs(r.Typography,{type:"s5",weight:"medium",mb:.5,color:a?"theme.error.600":"theme.secondary.800","data-position":n,"data-name":u,children:[i," ",t&&/* @__PURE__ */e.jsx("span",{className:"requiredStar",children:"*"})]}),
+/* @__PURE__ */e.jsx(l,{error:a,placeholder:d,className:"textfield",hidden:s,...m})]})});exports.default=i;
 //# sourceMappingURL=index.js.map

package/dist/components/text-field/text-field/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/text-field/text-field.tsx"],"sourcesContent":["import {\n  TextField as MUITextField,\n  // TextFieldProps,\n  styled,\n} from \"@mui/material\";\nimport \"./text-field.scss\";\nimport Typography from \"../typography/typography\";\nimport { memo } from \"react\";\n\nconst StyledTextField = styled(MUITextField)(({ theme: { palette } }) => ({\n  \"& .MuiOutlinedInput-root\": {\n    padding: \"0\",\n    color: palette.theme?.secondary[800],\n    \"& fieldset\": {\n      borderColor: palette.theme?.secondary[400],\n    },\n    \"&:hover fieldset\": {\n      borderColor: palette.theme?.secondary[500],\n    },\n    \"&.Mui-focused fieldset\": {\n      borderWidth: \"0.0625rem\",\n      borderStyle: \"solid\",\n      borderColor: palette.theme?.primary[700],\n    },\n    \"&.Mui-error fieldset\": {\n      borderColor: palette.theme?.error[600],\n    },\n    \"&.Mui-error .MuiInputBase-input::placeholder\": {\n      color: palette.theme?.error[600],\n    },\n    \"&.Mui-disabled\": {\n      background: palette.theme?.secondary[200],\n      color: palette.theme?.secondary[800],\n    },\n    \"& .MuiInputBase-input::placeholder\": {\n      color: palette.theme?.secondary[800],\n      opacity: 1,\n    },\n  },\n  \"& .MuiFormHelperText-root\": {\n    marginLeft: 0,\n    color: palette.theme?.secondary[800],\n    \"&.Mui-error\": {\n      color: palette.theme?.error[600],\n    },\n  },\n  \"& .MuiIconButton-root\": {\n    marginRight: 0,\n  },\n}));\n\nconst TextField = memo((props: any) => {\n  const {\n    required,\n    placeholder,\n    label,\n    error = false,\n    dataPosition,\n    dataName,\n    hidden,\n    ...rest\n  } = props;\n  return (\n    <>\n      {label && !hidden && (\n        <Typography\n          type=\"s5\"\n          weight={\"medium\"}\n          mb={0.5}\n          color={error ? \"theme.error.600\" : \"theme.secondary.800\"}\n          data-position={dataPosition}\n          data-name={dataName}\n        >\n          {label} {required && <span className=\"requiredStar\">*</span>}\n        </Typography>\n      )}\n      <StyledTextField\n        error={error}\n        placeholder={placeholder}\n        className=\"textfield\"\n        hidden={hidden}\n        {...rest}\n      />\n    </>\n  );\n});\n\nexport default TextField;\n"],"names":["StyledTextField","styled","MUITextField","theme","palette","padding","color","_a","secondary","borderColor","_b","_c","borderWidth","borderStyle","_d","primary","_e","error","_f","background","_g","_h","_i","opacity","marginLeft","_j","_k","marginRight","TextField","memo","props","required","placeholder","label","dataPosition","dataName","hidden","rest","jsxs","Fragment","children","Typography","type","weight","mb","jsx","className"],"mappings":"kPASA,MAAMA,EAAkBC,EAAAA,OAAOC,YAAPD,CAAqB,EAAGE,OAASC,yCAAiB,MAAA,CACxE,2BAA4B,CAC1BC,QAAS,IACTC,MAAO,OAAAC,EAAAH,EAAQD,YAAR,EAAAI,EAAeC,UAAU,KAChC,aAAc,CACZC,YAAa,OAAAC,EAAAN,EAAQD,YAAR,EAAAO,EAAeF,UAAU,MAExC,mBAAoB,CAClBC,YAAa,OAAAE,EAAAP,EAAQD,YAAR,EAAAQ,EAAeH,UAAU,MAExC,yBAA0B,CACxBI,YAAa,YACbC,YAAa,QACbJ,YAAa,OAAAK,EAAAV,EAAQD,YAAR,EAAAW,EAAeC,QAAQ,MAEtC,uBAAwB,CACtBN,YAAa,OAAAO,EAAAZ,EAAQD,YAAR,EAAAa,EAAeC,MAAM,MAEpC,+CAAgD,CAC9CX,MAAO,OAAAY,EAAAd,EAAQD,YAAR,EAAAe,EAAeD,MAAM,MAE9B,iBAAkB,CAChBE,WAAY,OAAAC,EAAAhB,EAAQD,YAAR,EAAAiB,EAAeZ,UAAU,KACrCF,MAAO,OAAAe,EAAAjB,EAAQD,YAAR,EAAAkB,EAAeb,UAAU,MAElC,qCAAsC,CACpCF,MAAO,OAAAgB,EAAAlB,EAAQD,YAAR,EAAAmB,EAAed,UAAU,KAChCe,QAAS,IAGb,4BAA6B,CAC3BC,WAAY,EACZlB,MAAO,OAAAmB,EAAArB,EAAQD,YAAR,EAAAsB,EAAejB,UAAU,KAChC,cAAe,CACbF,MAAO,OAAAoB,EAAAtB,EAAQD,YAAR,EAAAuB,EAAeT,MAAM,OAGhC,wBAAyB,CACvBU,YAAa,MAIXC,EAAYC,EAAAA,KAAMC,IACtB,MAAMC,SACJA,EAAAC,YACAA,EAAAC,MACAA,EAAAhB,MACAA,GAAQ,EAAAiB,aACRA,EAAAC,SACAA,EAAAC,OACAA,KACGC,GACDP;AACJ,OACEQ,EAAAA,KAAAC,WAAA,CACGC,SAAA,CAAAP,IAAUG,kBACTE,EAAAA,KAACG,EAAAA,WAAA,CACCC,KAAK,KACLC,OAAQ,SACRC,GAAI,GACJtC,MAAOW,EAAQ,kBAAoB,sBACnC,gBAAeiB,EACf,YAAWC,EAEVK,SAAA,CAAAP,EAAM,IAAEF,oBAAYc,IAAC,OAAA,CAAKC,UAAU,eAAeN,SAAA;eAGxDK,EAAAA,IAAC7C,EAAA,CACCiB,QACAe,cACAc,UAAU,YACVV,YACIC"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/text-field/text-field.tsx"],"sourcesContent":["import {\n  TextField as MUITextField,\n  // TextFieldProps,\n  styled,\n} from \"@mui/material\";\nimport \"./text-field.scss\";\nimport Typography from \"../typography/typography\";\nimport { memo } from \"react\";\n\nconst StyledTextField = styled(MUITextField)(({ theme: { palette } }) => ({\n  \"& .MuiOutlinedInput-root\": {\n    padding: \"0\",\n    color: palette.theme?.secondary[800],\n    \"& fieldset\": {\n      borderColor: palette.theme?.secondary[400],\n    },\n    \"&:hover fieldset\": {\n      borderColor: palette.theme?.secondary[500],\n    },\n    \"&.Mui-focused fieldset\": {\n      borderWidth: \"0.0625rem\",\n      borderStyle: \"solid\",\n      borderColor: palette.theme?.primary[700],\n    },\n    \"&.Mui-error fieldset\": {\n      borderColor: palette.theme?.error[600],\n    },\n    \"&.Mui-error .MuiInputBase-input::placeholder\": {\n      color: palette.theme?.error[600],\n    },\n    \"&.Mui-disabled\": {\n      background: palette.theme?.secondary[200],\n      color: palette.theme?.secondary[800],\n    },\n    \"& .MuiInputBase-input::placeholder\": {\n      color: palette.theme?.secondary[800],\n      opacity: 1,\n    },\n  },\n  \"& .MuiFormHelperText-root\": {\n    marginLeft: 0,\n    color: palette.theme?.secondary[800],\n    \"&.Mui-error\": {\n      color: palette.theme?.error[600],\n    },\n  },\n  \"& .MuiIconButton-root\": {\n    marginRight: 0,\n  },\n}));\n\nconst TextField = memo((props: any) => {\n  const {\n    required,\n    placeholder,\n    label,\n    error = false,\n    dataPosition,\n    dataName,\n    hidden,\n    ...rest\n  } = props;\n  return (\n    <>\n      {label && !hidden && (\n        <Typography\n          type=\"s5\"\n          weight={\"medium\"}\n          mb={0.5}\n          color={error ? \"theme.error.600\" : \"theme.secondary.800\"}\n          data-position={dataPosition}\n          data-name={dataName}\n        >\n          {label} {required && <span className=\"requiredStar\">*</span>}\n        </Typography>\n      )}\n      <StyledTextField\n        error={error}\n        placeholder={placeholder}\n        className=\"textfield\"\n        hidden={hidden}\n        {...rest}\n      />\n    </>\n  );\n});\n\nexport default TextField;\n"],"names":["StyledTextField","styled","MUITextField","theme","palette","padding","color","_a","secondary","borderColor","_b","_c","borderWidth","borderStyle","_d","primary","_e","error","_f","background","_g","_h","_i","opacity","marginLeft","_j","_k","marginRight","TextField","memo","props","required","placeholder","label","dataPosition","dataName","hidden","rest","jsxs","Fragment","children","Typography","type","weight","mb","jsx","className"],"mappings":"6WASA,MAAMA,EAAkBC,EAAAA,QAAOC,UAAPD,CAAqB,EAAGE,OAASC,yCAAiB,MAAA,CACxE,2BAA4B,CAC1BC,QAAS,IACTC,MAAO,OAAAC,EAAAH,EAAQD,YAAR,EAAAI,EAAeC,UAAU,KAChC,aAAc,CACZC,YAAa,OAAAC,EAAAN,EAAQD,YAAR,EAAAO,EAAeF,UAAU,MAExC,mBAAoB,CAClBC,YAAa,OAAAE,EAAAP,EAAQD,YAAR,EAAAQ,EAAeH,UAAU,MAExC,yBAA0B,CACxBI,YAAa,YACbC,YAAa,QACbJ,YAAa,OAAAK,EAAAV,EAAQD,YAAR,EAAAW,EAAeC,QAAQ,MAEtC,uBAAwB,CACtBN,YAAa,OAAAO,EAAAZ,EAAQD,YAAR,EAAAa,EAAeC,MAAM,MAEpC,+CAAgD,CAC9CX,MAAO,OAAAY,EAAAd,EAAQD,YAAR,EAAAe,EAAeD,MAAM,MAE9B,iBAAkB,CAChBE,WAAY,OAAAC,EAAAhB,EAAQD,YAAR,EAAAiB,EAAeZ,UAAU,KACrCF,MAAO,OAAAe,EAAAjB,EAAQD,YAAR,EAAAkB,EAAeb,UAAU,MAElC,qCAAsC,CACpCF,MAAO,OAAAgB,EAAAlB,EAAQD,YAAR,EAAAmB,EAAed,UAAU,KAChCe,QAAS,IAGb,4BAA6B,CAC3BC,WAAY,EACZlB,MAAO,OAAAmB,EAAArB,EAAQD,YAAR,EAAAsB,EAAejB,UAAU,KAChC,cAAe,CACbF,MAAO,OAAAoB,EAAAtB,EAAQD,YAAR,EAAAuB,EAAeT,MAAM,OAGhC,wBAAyB,CACvBU,YAAa,MAIXC,EAAYC,EAAAA,KAAMC,IACtB,MAAMC,SACJA,EAAAC,YACAA,EAAAC,MACAA,EAAAhB,MACAA,GAAQ,EAAAiB,aACRA,EAAAC,SACAA,EAAAC,OACAA,KACGC,GACDP;AACJ,OACEQ,EAAAA,KAAAC,WAAA,CACGC,SAAA,CAAAP,IAAUG,kBACTE,EAAAA,KAACG,EAAAA,WAAA,CACCC,KAAK,KACLC,OAAQ,SACRC,GAAI,GACJtC,MAAOW,EAAQ,kBAAoB,sBACnC,gBAAeiB,EACf,YAAWC,EAEVK,SAAA,CAAAP,EAAM,IAAEF,oBAAYc,IAAC,OAAA,CAAKC,UAAU,eAAeN,SAAA;eAGxDK,EAAAA,IAAC7C,EAAA,CACCiB,QACAe,cACAc,UAAU,YACVV,YACIC"}

package/dist/components/time-picker/time-picker/index.esm.js

@@ -1,11 +1,11 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { styled } from "@mui/material";
-import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
-import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
-import { TimePicker as TimePicker$1 } from "@mui/x-date-pickers/TimePicker";
 import { Typography } from "../../typography/typography/index.esm.js";
 /* empty css                            */
 import { memo } from "react";
+import { LocalizationProvider } from "../../../node_modules/@mui/x-date-pickers/LocalizationProvider/LocalizationProvider/index.esm.js";
+import { AdapterDayjs } from "../../../node_modules/@mui/x-date-pickers/AdapterDayjs/AdapterDayjs/index.esm.js";
+import styled from "../../../node_modules/@mui/material/styles/styled/index.esm.js";
+import { TimePicker as TimePicker$1 } from "../../../node_modules/@mui/x-date-pickers/TimePicker/TimePicker/index.esm.js";
 const StyledTimePicker = styled(TimePicker$1)(({ theme: { palette } }) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
   return {

package/dist/components/time-picker/time-picker/index.js

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@mui/material"),o=require("@mui/x-date-pickers/AdapterDayjs"),i=require("@mui/x-date-pickers/LocalizationProvider"),t=require("@mui/x-date-pickers/TimePicker"),d=;/* empty css                                 */;/* empty css                         */var a=require("react");const l=r.styled(t.TimePicker)(({theme:{palette:e}})=>{var r,o,i,t,d,a,l,s,n,u;return{"& .MuiOutlinedInput-root":{padding:"0",color:null==(r=e.theme)?void 0:r.secondary[800],"& fieldset":{borderColor:null==(o=e.theme)?void 0:o.secondary[400]},"&:hover fieldset":{borderColor:null==(i=e.theme)?void 0:i.secondary[500]},"&.Mui-focused fieldset":{borderWidth:"0.0625rem",borderStyle:"solid",borderColor:null==(t=e.theme)?void 0:t.primary[700]},"&.Mui-error fieldset":{borderColor:null==(d=e.theme)?void 0:d.error[600]},"&.Mui-disabled":{background:null==(a=e.theme)?void 0:a.secondary[200],color:null==(l=e.theme)?void 0:l.secondary[800]},"& .MuiInputBase-input::placeholder":{color:null==(s=e.theme)?void 0:s.secondary[800],opacity:1}},"& .MuiFormHelperText-root":{marginLeft:0,color:null==(n=e.theme)?void 0:n.secondary[800],"&.Mui-error":{color:null==(u=e.theme)?void 0:u.error[600]}},"& .MuiIconButton-root":{marginRight:0},"& .MuiPickersCalendarHeader-labelContainer":{fontWeight:600}}}),s=a.memo(r=>{const{label:t,disabled:a,error:s,helperText:n,dataName:u,dataPosition:c,is24hrFormat:m=!1,placeholder:h,required:p=!1,...y}=r;/* @__PURE__ */
-return e.jsx("div",{children:/* @__PURE__ */e.jsxs(i.LocalizationProvider,{dateAdapter:o.AdapterDayjs,children:[
-/* @__PURE__ */e.jsxs(d.Typography,{type:"s4",fontWeight:"medium",mb:.5,color:s?"theme.error.600":"theme.secondary.800","data-position":c,"data-name":u,children:[t," ",p&&/* @__PURE__ */e.jsx("span",{className:"requiredStar",children:"*"})]}),
-/* @__PURE__ */e.jsx(l,{...y,disabled:a,slotProps:{textField:{helperText:n,error:s,placeholder:h||"HH:mm A"}},format:m?"HH:MM":"hh:mm a",className:"timePicker"})]})})});exports.default=s;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=;/* empty css                                 */;/* empty css                         */var o=require("react"),i=,/* empty css                                                                                         */d=,/* empty css                                                                         */t=,/* empty css                                                       */a=;/* empty css                                                                     */const l=t.default(a.TimePicker)(({theme:{palette:e}})=>{var r,o,i,d,t,a,l,s,n,u;return{"& .MuiOutlinedInput-root":{padding:"0",color:null==(r=e.theme)?void 0:r.secondary[800],"& fieldset":{borderColor:null==(o=e.theme)?void 0:o.secondary[400]},"&:hover fieldset":{borderColor:null==(i=e.theme)?void 0:i.secondary[500]},"&.Mui-focused fieldset":{borderWidth:"0.0625rem",borderStyle:"solid",borderColor:null==(d=e.theme)?void 0:d.primary[700]},"&.Mui-error fieldset":{borderColor:null==(t=e.theme)?void 0:t.error[600]},"&.Mui-disabled":{background:null==(a=e.theme)?void 0:a.secondary[200],color:null==(l=e.theme)?void 0:l.secondary[800]},"& .MuiInputBase-input::placeholder":{color:null==(s=e.theme)?void 0:s.secondary[800],opacity:1}},"& .MuiFormHelperText-root":{marginLeft:0,color:null==(n=e.theme)?void 0:n.secondary[800],"&.Mui-error":{color:null==(u=e.theme)?void 0:u.error[600]}},"& .MuiIconButton-root":{marginRight:0},"& .MuiPickersCalendarHeader-labelContainer":{fontWeight:600}}}),s=o.memo(o=>{const{label:t,disabled:a,error:s,helperText:n,dataName:u,dataPosition:m,is24hrFormat:c=!1,placeholder:p,required:h=!1,...y}=o;/* @__PURE__ */
+return e.jsx("div",{children:/* @__PURE__ */e.jsxs(i.LocalizationProvider,{dateAdapter:d.AdapterDayjs,children:[
+/* @__PURE__ */e.jsxs(r.Typography,{type:"s4",fontWeight:"medium",mb:.5,color:s?"theme.error.600":"theme.secondary.800","data-position":m,"data-name":u,children:[t," ",h&&/* @__PURE__ */e.jsx("span",{className:"requiredStar",children:"*"})]}),
+/* @__PURE__ */e.jsx(l,{...y,disabled:a,slotProps:{textField:{helperText:n,error:s,placeholder:p||"HH:mm A"}},format:c?"HH:MM":"hh:mm a",className:"timePicker"})]})})});exports.default=s;
 //# sourceMappingURL=index.js.map

package/dist/components/time-picker/time-picker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/time-picker/time-picker.tsx"],"sourcesContent":["import { styled } from \"@mui/material\";\nimport { AdapterDayjs } from \"@mui/x-date-pickers/AdapterDayjs\";\nimport { LocalizationProvider } from \"@mui/x-date-pickers/LocalizationProvider\";\nimport { TimePicker as Time } from \"@mui/x-date-pickers/TimePicker\";\nimport Typography from \"../typography/typography\";\nimport \"./time-picker.scss\";\nimport { memo } from \"react\";\n\nexport interface TimePickerProps {\n  label: string;\n  disabled?: boolean;\n  error?: boolean;\n  name?: string;\n  value?: string | number | Date;\n  helperText?: string;\n  dataPosition?: number;\n  dataName?: string;\n  is24hrFormat?: boolean;\n  placeholder?: string;\n  required?: boolean;\n}\n\nconst StyledTimePicker = styled(Time)(({ theme: { palette } }) => ({\n  \"& .MuiOutlinedInput-root\": {\n    padding: \"0\",\n    color: palette.theme?.secondary[800],\n    \"& fieldset\": {\n      borderColor: palette.theme?.secondary[400],\n    },\n    \"&:hover fieldset\": {\n      borderColor: palette.theme?.secondary[500],\n    },\n    \"&.Mui-focused fieldset\": {\n      borderWidth: \"0.0625rem\",\n      borderStyle: \"solid\",\n      borderColor: palette.theme?.primary[700],\n    },\n    \"&.Mui-error fieldset\": {\n      borderColor: palette.theme?.error[600],\n    },\n    \"&.Mui-disabled\": {\n      background: palette.theme?.secondary[200],\n      color: palette.theme?.secondary[800],\n    },\n    \"& .MuiInputBase-input::placeholder\": {\n      color: palette.theme?.secondary[800],\n      opacity: 1,\n    },\n  },\n  \"& .MuiFormHelperText-root\": {\n    marginLeft: 0,\n    color: palette.theme?.secondary[800],\n    \"&.Mui-error\": {\n      color: palette.theme?.error[600],\n    },\n  },\n  \"& .MuiIconButton-root\": {\n    marginRight: 0,\n  },\n  \"& .MuiPickersCalendarHeader-labelContainer\": {\n    fontWeight: 600,\n  },\n}));\n\nconst TimePicker = memo((props: TimePickerProps) => {\n  const {\n    label,\n    disabled,\n    error,\n    helperText,\n    dataName,\n    dataPosition,\n    is24hrFormat = false,\n    placeholder,\n    required = false,\n    ...rest\n  } = props;\n  return (\n    <div>\n      <LocalizationProvider dateAdapter={AdapterDayjs}>\n        <Typography\n          type=\"s4\"\n          fontWeight={\"medium\"}\n          mb={0.5}\n          color={error ? \"theme.error.600\" : \"theme.secondary.800\"}\n          data-position={dataPosition}\n          data-name={dataName}\n        >\n          {label} {required && <span className=\"requiredStar\">*</span>}\n        </Typography>\n        <StyledTimePicker\n          {...rest}\n          disabled={disabled}\n          slotProps={{\n            textField: {\n              helperText: helperText,\n              error: error,\n              placeholder: placeholder || \"HH:mm A\",\n              // required: required,\n            },\n          }}\n          format={is24hrFormat ? \"HH:MM\" : \"hh:mm a\"}\n          className=\"timePicker\"\n        />\n      </LocalizationProvider>\n    </div>\n  );\n});\n\nexport default TimePicker;\n"],"names":["StyledTimePicker","styled","Time","theme","palette","padding","color","_a","secondary","borderColor","_b","_c","borderWidth","borderStyle","_d","primary","_e","error","background","_f","_g","_h","opacity","marginLeft","_i","_j","marginRight","fontWeight","TimePicker","memo","props","label","disabled","helperText","dataName","dataPosition","is24hrFormat","placeholder","required","rest","jsx","children","jsxs","LocalizationProvider","dateAdapter","AdapterDayjs","Typography","type","mb","className","slotProps","textField","format"],"mappings":"mYAsBA,MAAMA,EAAmBC,EAAAA,OAAOC,aAAPD,CAAa,EAAGE,OAASC,uCAAiB,MAAA,CACjE,2BAA4B,CAC1BC,QAAS,IACTC,MAAO,OAAAC,EAAAH,EAAQD,YAAR,EAAAI,EAAeC,UAAU,KAChC,aAAc,CACZC,YAAa,OAAAC,EAAAN,EAAQD,YAAR,EAAAO,EAAeF,UAAU,MAExC,mBAAoB,CAClBC,YAAa,OAAAE,EAAAP,EAAQD,YAAR,EAAAQ,EAAeH,UAAU,MAExC,yBAA0B,CACxBI,YAAa,YACbC,YAAa,QACbJ,YAAa,OAAAK,EAAAV,EAAQD,YAAR,EAAAW,EAAeC,QAAQ,MAEtC,uBAAwB,CACtBN,YAAa,OAAAO,EAAAZ,EAAQD,YAAR,EAAAa,EAAeC,MAAM,MAEpC,iBAAkB,CAChBC,WAAY,OAAAC,EAAAf,EAAQD,YAAR,EAAAgB,EAAeX,UAAU,KACrCF,MAAO,OAAAc,EAAAhB,EAAQD,YAAR,EAAAiB,EAAeZ,UAAU,MAElC,qCAAsC,CACpCF,MAAO,OAAAe,EAAAjB,EAAQD,YAAR,EAAAkB,EAAeb,UAAU,KAChCc,QAAS,IAGb,4BAA6B,CAC3BC,WAAY,EACZjB,MAAO,OAAAkB,EAAApB,EAAQD,YAAR,EAAAqB,EAAehB,UAAU,KAChC,cAAe,CACbF,MAAO,OAAAmB,EAAArB,EAAQD,YAAR,EAAAsB,EAAeR,MAAM,OAGhC,wBAAyB,CACvBS,YAAa,GAEf,6CAA8C,CAC5CC,WAAY,QAIVC,EAAaC,EAAAA,KAAMC,IACvB,MAAMC,MACJA,EAAAC,SACAA,EAAAf,MACAA,EAAAgB,WACAA,EAAAC,SACAA,EAAAC,aACAA,EAAAC,aACAA,GAAe,EAAAC,YACfA,EAAAC,SACAA,GAAW,KACRC,GACDT;AACJ,OACEU,EAAAA,IAAC,MAAA,CACCC,wBAAAC,EAAAA,KAACC,EAAAA,qBAAA,CAAqBC,YAAaC,EAAAA,aACjCJ,SAAA;eAAAC,EAAAA,KAACI,EAAAA,WAAA,CACCC,KAAK,KACLpB,WAAY,SACZqB,GAAI,GACJ1C,MAAOW,EAAQ,kBAAoB,sBACnC,gBAAekB,EACf,YAAWD,EAEVO,SAAA,CAAAV,EAAM,IAAEO,oBAAYE,IAAC,OAAA,CAAKS,UAAU,eAAeR,SAAA;eAEtDD,EAAAA,IAACxC,EAAA,IACKuC,EACJP,WACAkB,UAAW,CACTC,UAAW,CACTlB,aACAhB,QACAoB,YAAaA,GAAe,YAIhCe,OAAQhB,EAAe,QAAU,UACjCa,UAAU"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/time-picker/time-picker.tsx"],"sourcesContent":["import { styled } from \"@mui/material\";\nimport { AdapterDayjs } from \"@mui/x-date-pickers/AdapterDayjs\";\nimport { LocalizationProvider } from \"@mui/x-date-pickers/LocalizationProvider\";\nimport { TimePicker as Time } from \"@mui/x-date-pickers/TimePicker\";\nimport Typography from \"../typography/typography\";\nimport \"./time-picker.scss\";\nimport { memo } from \"react\";\n\nexport interface TimePickerProps {\n  label: string;\n  disabled?: boolean;\n  error?: boolean;\n  name?: string;\n  value?: string | number | Date;\n  helperText?: string;\n  dataPosition?: number;\n  dataName?: string;\n  is24hrFormat?: boolean;\n  placeholder?: string;\n  required?: boolean;\n}\n\nconst StyledTimePicker = styled(Time)(({ theme: { palette } }) => ({\n  \"& .MuiOutlinedInput-root\": {\n    padding: \"0\",\n    color: palette.theme?.secondary[800],\n    \"& fieldset\": {\n      borderColor: palette.theme?.secondary[400],\n    },\n    \"&:hover fieldset\": {\n      borderColor: palette.theme?.secondary[500],\n    },\n    \"&.Mui-focused fieldset\": {\n      borderWidth: \"0.0625rem\",\n      borderStyle: \"solid\",\n      borderColor: palette.theme?.primary[700],\n    },\n    \"&.Mui-error fieldset\": {\n      borderColor: palette.theme?.error[600],\n    },\n    \"&.Mui-disabled\": {\n      background: palette.theme?.secondary[200],\n      color: palette.theme?.secondary[800],\n    },\n    \"& .MuiInputBase-input::placeholder\": {\n      color: palette.theme?.secondary[800],\n      opacity: 1,\n    },\n  },\n  \"& .MuiFormHelperText-root\": {\n    marginLeft: 0,\n    color: palette.theme?.secondary[800],\n    \"&.Mui-error\": {\n      color: palette.theme?.error[600],\n    },\n  },\n  \"& .MuiIconButton-root\": {\n    marginRight: 0,\n  },\n  \"& .MuiPickersCalendarHeader-labelContainer\": {\n    fontWeight: 600,\n  },\n}));\n\nconst TimePicker = memo((props: TimePickerProps) => {\n  const {\n    label,\n    disabled,\n    error,\n    helperText,\n    dataName,\n    dataPosition,\n    is24hrFormat = false,\n    placeholder,\n    required = false,\n    ...rest\n  } = props;\n  return (\n    <div>\n      <LocalizationProvider dateAdapter={AdapterDayjs}>\n        <Typography\n          type=\"s4\"\n          fontWeight={\"medium\"}\n          mb={0.5}\n          color={error ? \"theme.error.600\" : \"theme.secondary.800\"}\n          data-position={dataPosition}\n          data-name={dataName}\n        >\n          {label} {required && <span className=\"requiredStar\">*</span>}\n        </Typography>\n        <StyledTimePicker\n          {...rest}\n          disabled={disabled}\n          slotProps={{\n            textField: {\n              helperText: helperText,\n              error: error,\n              placeholder: placeholder || \"HH:mm A\",\n              // required: required,\n            },\n          }}\n          format={is24hrFormat ? \"HH:MM\" : \"hh:mm a\"}\n          className=\"timePicker\"\n        />\n      </LocalizationProvider>\n    </div>\n  );\n});\n\nexport default TimePicker;\n"],"names":["StyledTimePicker","styled","Time","theme","palette","padding","color","_a","secondary","borderColor","_b","_c","borderWidth","borderStyle","_d","primary","_e","error","background","_f","_g","_h","opacity","marginLeft","_i","_j","marginRight","fontWeight","TimePicker","memo","props","label","disabled","helperText","dataName","dataPosition","is24hrFormat","placeholder","required","rest","jsx","children","jsxs","LocalizationProvider","dateAdapter","AdapterDayjs","Typography","type","mb","className","slotProps","textField","format"],"mappings":"0jBAsBA,MAAMA,EAAmBC,EAAAA,QAAOC,aAAPD,CAAa,EAAGE,OAASC,uCAAiB,MAAA,CACjE,2BAA4B,CAC1BC,QAAS,IACTC,MAAO,OAAAC,EAAAH,EAAQD,YAAR,EAAAI,EAAeC,UAAU,KAChC,aAAc,CACZC,YAAa,OAAAC,EAAAN,EAAQD,YAAR,EAAAO,EAAeF,UAAU,MAExC,mBAAoB,CAClBC,YAAa,OAAAE,EAAAP,EAAQD,YAAR,EAAAQ,EAAeH,UAAU,MAExC,yBAA0B,CACxBI,YAAa,YACbC,YAAa,QACbJ,YAAa,OAAAK,EAAAV,EAAQD,YAAR,EAAAW,EAAeC,QAAQ,MAEtC,uBAAwB,CACtBN,YAAa,OAAAO,EAAAZ,EAAQD,YAAR,EAAAa,EAAeC,MAAM,MAEpC,iBAAkB,CAChBC,WAAY,OAAAC,EAAAf,EAAQD,YAAR,EAAAgB,EAAeX,UAAU,KACrCF,MAAO,OAAAc,EAAAhB,EAAQD,YAAR,EAAAiB,EAAeZ,UAAU,MAElC,qCAAsC,CACpCF,MAAO,OAAAe,EAAAjB,EAAQD,YAAR,EAAAkB,EAAeb,UAAU,KAChCc,QAAS,IAGb,4BAA6B,CAC3BC,WAAY,EACZjB,MAAO,OAAAkB,EAAApB,EAAQD,YAAR,EAAAqB,EAAehB,UAAU,KAChC,cAAe,CACbF,MAAO,OAAAmB,EAAArB,EAAQD,YAAR,EAAAsB,EAAeR,MAAM,OAGhC,wBAAyB,CACvBS,YAAa,GAEf,6CAA8C,CAC5CC,WAAY,QAIVC,EAAaC,EAAAA,KAAMC,IACvB,MAAMC,MACJA,EAAAC,SACAA,EAAAf,MACAA,EAAAgB,WACAA,EAAAC,SACAA,EAAAC,aACAA,EAAAC,aACAA,GAAe,EAAAC,YACfA,EAAAC,SACAA,GAAW,KACRC,GACDT;AACJ,OACEU,EAAAA,IAAC,MAAA,CACCC,wBAAAC,EAAAA,KAACC,EAAAA,qBAAA,CAAqBC,YAAaC,EAAAA,aACjCJ,SAAA;eAAAC,EAAAA,KAACI,EAAAA,WAAA,CACCC,KAAK,KACLpB,WAAY,SACZqB,GAAI,GACJ1C,MAAOW,EAAQ,kBAAoB,sBACnC,gBAAekB,EACf,YAAWD,EAEVO,SAAA,CAAAV,EAAM,IAAEO,oBAAYE,IAAC,OAAA,CAAKS,UAAU,eAAeR,SAAA;eAEtDD,EAAAA,IAACxC,EAAA,IACKuC,EACJP,WACAkB,UAAW,CACTC,UAAW,CACTlB,aACAhB,QACAoB,YAAaA,GAAe,YAIhCe,OAAQhB,EAAe,QAAU,UACjCa,UAAU"}

package/dist/components/time-range-picker/time-range-picker/index.esm.js

@@ -2,9 +2,12 @@ import { jsx, Fragment, jsxs } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
 import DatePicker from "react-datepicker";
 /* empty css                                  */
-import { Close, AccessTimeRounded } from "@mui/icons-material";
-import { Box, InputAdornment, IconButton } from "@mui/material";
 import TextField from "../../text-field/text-field/index.esm.js";
+import Box from "../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import Close from "../../../node_modules/@mui/icons-material/esm/Close/index.esm.js";
+import InputAdornment from "../../../node_modules/@mui/material/InputAdornment/InputAdornment/index.esm.js";
+import IconButton from "../../../node_modules/@mui/material/IconButton/IconButton/index.esm.js";
+import AccessTimeRounded from "../../../node_modules/@mui/icons-material/esm/AccessTimeRounded/index.esm.js";
 const TimeRangePicker = (props) => {
   const [timeRange, setTimeRange] = useState([]);
   const [differenceInMinutes, setDifferenceInMinutes] = useState(0);

package/dist/components/time-range-picker/time-range-picker/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../src/components/time-range-picker/time-range-picker.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport DatePicker from \"react-datepicker\";\nimport \"react-datepicker/dist/react-datepicker.css\";\nimport \"./time-range-picker.scss\";\nimport { AccessTimeRounded, Close } from \"@mui/icons-material\";\nimport { Box, IconButton, InputAdornment } from \"@mui/material\";\nimport TextField from \"../text-field/text-field\";\n\ninterface TimeRangePickerProps {\n  hour12?: boolean;\n  startTime?: string;\n  endTime?: string;\n  onTimeRangeChange: (timeRanges: any[]) => void;\n}\nconst TimeRangePicker: React.FC<TimeRangePickerProps> = (props: any) => {\n  const [timeRange, setTimeRange] = useState<string[]>([]);\n  const [differenceInMinutes, setDifferenceInMinutes] = useState(0);\n  const [cnt, setCnt] = useState(0);\n  const [isOpenTimePicker, setIsOpenTimePicker] = useState(undefined);\n  const { hour12 = false, startTime, endTime, onTimeRangeChange } = props;\n\n  useEffect(() => {\n    setTimeRange([]);\n\n    const formatDate = (time: string) => {\n      if (!time) return null;\n\n      const [timePart, meridiem] = time.split(\" \");\n      const [hours, minutes] = timePart.split(\":\").map(Number);\n\n      let formattedHours = hours;\n\n      if (meridiem) {\n        if (meridiem === \"PM\") {\n          if (hours !== 12) {\n            formattedHours += 12;\n          }\n        } else if (meridiem === \"AM\" && hours === 12) {\n          formattedHours -= 12;\n        }\n      }\n\n      const date = new Date();\n      date.setHours(formattedHours, minutes, 0, 0);\n\n      const formattedTime = date.toLocaleTimeString([], {\n        hour: \"2-digit\",\n        minute: \"2-digit\",\n        hour12: hour12,\n      });\n      let finalFormattedTime = formattedTime;\n\n      if (date.getHours() === 0) {\n        finalFormattedTime = \"00\" + formattedTime.slice(2); // Replace hours with 00\n      } else if (date.getHours() === 12) {\n        finalFormattedTime = \"12\" + formattedTime.slice(2); // Replace hours with 12\n      }\n      return finalFormattedTime;\n    };\n\n    setTimeRange((prevTimeRange: any) => {\n      if (startTime && endTime) {\n        const formattedStartTime = formatDate(startTime);\n        const formattedEndTime = formatDate(endTime);\n        return [...prevTimeRange, formattedStartTime, formattedEndTime];\n      }\n      return prevTimeRange;\n    });\n  }, [hour12, startTime, endTime]);\n\n  const handleChange = (dates: any) => {\n    const formattedTime: any = dates.toLocaleTimeString([], {\n      hour: \"2-digit\",\n      minute: \"2-digit\",\n      hour12: hour12,\n    });\n\n    let finalFormattedTime = formattedTime;\n\n    if (dates.getHours() === 0) {\n      finalFormattedTime = \"00\" + formattedTime.slice(2); // Replace hours with 00\n    } else if (dates.getHours() === 12) {\n      finalFormattedTime = \"12\" + formattedTime.slice(2); // Replace hours with 12\n    }\n\n    if (timeRange.length < 2) {\n      setTimeRange([...timeRange, finalFormattedTime]);\n    } else if (cnt === 0) {\n      setTimeRange((prevTimeRange) => {\n        const updatedTimeRange: any = [...prevTimeRange];\n        updatedTimeRange[0] = finalFormattedTime;\n        return updatedTimeRange;\n      });\n    } else if (cnt === 1) {\n      setTimeRange((prevTimeRange) => {\n        const updatedTimeRange: any = [...prevTimeRange];\n        updatedTimeRange[1] = finalFormattedTime;\n        return updatedTimeRange;\n      });\n    }\n    setCnt(cnt + 1);\n  };\n\n  useEffect(() => {\n    if (cnt === 2) {\n      setCnt(0);\n    }\n\n    // Calculate the difference between two time ranges\n    if (timeRange.length === 2) {\n      const startTimeString = timeRange[0];\n      const endTimeString = timeRange[1];\n\n      // Parsing start time\n      const startTotalMinutes = parseTimeToMinutes(startTimeString);\n\n      // Parsing end time\n      const endTotalMinutes = parseTimeToMinutes(endTimeString);\n\n      // Calculating difference\n      let difference = endTotalMinutes - startTotalMinutes;\n      if (difference < 0) {\n        difference += 24 * 60; // Adding 24 hours if end time is smaller than start time\n      }\n      setDifferenceInMinutes(difference);\n    } else {\n      setDifferenceInMinutes(0);\n    }\n  }, [cnt, timeRange]);\n\n  const parseTimeToMinutes = (timeString: string) => {\n    const [hoursStr, minutesStr, meridiem] = timeString.split(/:| /);\n    let hours = parseInt(hoursStr);\n    const minutes = parseInt(minutesStr);\n\n    if (meridiem && meridiem.toLowerCase() === \"pm\" && hours !== 12) {\n      hours += 12;\n    } else if (meridiem && meridiem.toLowerCase() === \"am\" && hours === 12) {\n      hours = 0;\n    }\n\n    return hours * 60 + minutes;\n  };\n\n  useEffect(() => {\n    onTimeRangeChange({\n      timeRange: timeRange,\n      differenceInMinutes: differenceInMinutes,\n    });\n  }, [differenceInMinutes, onTimeRangeChange, timeRange]);\n\n  const handleClick = () => {\n    const isOpen: any = isOpenTimePicker === true ? undefined : true;\n    setIsOpenTimePicker(isOpen);\n  };\n\n  const handleCloseClick = (event: any) => {\n    setTimeRange([]);\n    setCnt(0);\n    event.stopPropagation();\n  };\n\n  const customInput = (\n    <TextField\n      className=\"time-input\"\n      type=\"text\"\n      value={\n        timeRange.length === 1\n          ? `${timeRange[0]} - `\n          : timeRange.length === 2\n            ? `${timeRange[0]} - ${timeRange[1]}`\n            : \"\"\n      }\n      InputProps={{\n        readOnly: true,\n        endAdornment: (\n          <InputAdornment position=\"end\">\n            {timeRange.length > 0 && (\n              <IconButton onClick={handleCloseClick}>\n                <Close />\n              </IconButton>\n            )}\n            <IconButton onClick={handleClick}>\n              <AccessTimeRounded />\n            </IconButton>\n          </InputAdornment>\n        ),\n      }}\n    />\n  );\n\n  return (\n    <>\n      <Box className=\"DateRangePicker\">\n        <DatePicker\n          className=\"DatePickerWrapper\"\n          onChange={(date: any) => {\n            handleChange(date), handleClick();\n          }}\n          showTimeSelect\n          showTimeSelectOnly\n          timeIntervals={15}\n          selectsRange\n          customInput={customInput}\n          open={isOpenTimePicker}\n          value={\n            timeRange && timeRange.length === 1\n              ? `${timeRange[0]}-`\n              : timeRange && timeRange.length === 2\n                ? `${timeRange[0]}-${timeRange[1]}`\n                : undefined\n          }\n        />\n        <Box\n          className=\"box-icon\"\n          style={\n            timeRange.length > 0 ? { right: \"2.5rem\" } : { right: \"1.563rem\" }\n          }\n        >\n          {timeRange.length > 0 && <Close onClick={handleCloseClick} />}\n        </Box>\n      </Box>\n    </>\n  );\n};\n\nexport default TimeRangePicker;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../../../../src/components/time-range-picker/time-range-picker.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport DatePicker from \"react-datepicker\";\nimport \"react-datepicker/dist/react-datepicker.css\";\nimport \"./time-range-picker.scss\";\nimport { AccessTimeRounded, Close } from \"@mui/icons-material\";\nimport { Box, IconButton, InputAdornment } from \"@mui/material\";\nimport TextField from \"../text-field/text-field\";\n\ninterface TimeRangePickerProps {\n  hour12?: boolean;\n  startTime?: string;\n  endTime?: string;\n  onTimeRangeChange: (timeRanges: any[]) => void;\n}\nconst TimeRangePicker: React.FC<TimeRangePickerProps> = (props: any) => {\n  const [timeRange, setTimeRange] = useState<string[]>([]);\n  const [differenceInMinutes, setDifferenceInMinutes] = useState(0);\n  const [cnt, setCnt] = useState(0);\n  const [isOpenTimePicker, setIsOpenTimePicker] = useState(undefined);\n  const { hour12 = false, startTime, endTime, onTimeRangeChange } = props;\n\n  useEffect(() => {\n    setTimeRange([]);\n\n    const formatDate = (time: string) => {\n      if (!time) return null;\n\n      const [timePart, meridiem] = time.split(\" \");\n      const [hours, minutes] = timePart.split(\":\").map(Number);\n\n      let formattedHours = hours;\n\n      if (meridiem) {\n        if (meridiem === \"PM\") {\n          if (hours !== 12) {\n            formattedHours += 12;\n          }\n        } else if (meridiem === \"AM\" && hours === 12) {\n          formattedHours -= 12;\n        }\n      }\n\n      const date = new Date();\n      date.setHours(formattedHours, minutes, 0, 0);\n\n      const formattedTime = date.toLocaleTimeString([], {\n        hour: \"2-digit\",\n        minute: \"2-digit\",\n        hour12: hour12,\n      });\n      let finalFormattedTime = formattedTime;\n\n      if (date.getHours() === 0) {\n        finalFormattedTime = \"00\" + formattedTime.slice(2); // Replace hours with 00\n      } else if (date.getHours() === 12) {\n        finalFormattedTime = \"12\" + formattedTime.slice(2); // Replace hours with 12\n      }\n      return finalFormattedTime;\n    };\n\n    setTimeRange((prevTimeRange: any) => {\n      if (startTime && endTime) {\n        const formattedStartTime = formatDate(startTime);\n        const formattedEndTime = formatDate(endTime);\n        return [...prevTimeRange, formattedStartTime, formattedEndTime];\n      }\n      return prevTimeRange;\n    });\n  }, [hour12, startTime, endTime]);\n\n  const handleChange = (dates: any) => {\n    const formattedTime: any = dates.toLocaleTimeString([], {\n      hour: \"2-digit\",\n      minute: \"2-digit\",\n      hour12: hour12,\n    });\n\n    let finalFormattedTime = formattedTime;\n\n    if (dates.getHours() === 0) {\n      finalFormattedTime = \"00\" + formattedTime.slice(2); // Replace hours with 00\n    } else if (dates.getHours() === 12) {\n      finalFormattedTime = \"12\" + formattedTime.slice(2); // Replace hours with 12\n    }\n\n    if (timeRange.length < 2) {\n      setTimeRange([...timeRange, finalFormattedTime]);\n    } else if (cnt === 0) {\n      setTimeRange((prevTimeRange) => {\n        const updatedTimeRange: any = [...prevTimeRange];\n        updatedTimeRange[0] = finalFormattedTime;\n        return updatedTimeRange;\n      });\n    } else if (cnt === 1) {\n      setTimeRange((prevTimeRange) => {\n        const updatedTimeRange: any = [...prevTimeRange];\n        updatedTimeRange[1] = finalFormattedTime;\n        return updatedTimeRange;\n      });\n    }\n    setCnt(cnt + 1);\n  };\n\n  useEffect(() => {\n    if (cnt === 2) {\n      setCnt(0);\n    }\n\n    // Calculate the difference between two time ranges\n    if (timeRange.length === 2) {\n      const startTimeString = timeRange[0];\n      const endTimeString = timeRange[1];\n\n      // Parsing start time\n      const startTotalMinutes = parseTimeToMinutes(startTimeString);\n\n      // Parsing end time\n      const endTotalMinutes = parseTimeToMinutes(endTimeString);\n\n      // Calculating difference\n      let difference = endTotalMinutes - startTotalMinutes;\n      if (difference < 0) {\n        difference += 24 * 60; // Adding 24 hours if end time is smaller than start time\n      }\n      setDifferenceInMinutes(difference);\n    } else {\n      setDifferenceInMinutes(0);\n    }\n  }, [cnt, timeRange]);\n\n  const parseTimeToMinutes = (timeString: string) => {\n    const [hoursStr, minutesStr, meridiem] = timeString.split(/:| /);\n    let hours = parseInt(hoursStr);\n    const minutes = parseInt(minutesStr);\n\n    if (meridiem && meridiem.toLowerCase() === \"pm\" && hours !== 12) {\n      hours += 12;\n    } else if (meridiem && meridiem.toLowerCase() === \"am\" && hours === 12) {\n      hours = 0;\n    }\n\n    return hours * 60 + minutes;\n  };\n\n  useEffect(() => {\n    onTimeRangeChange({\n      timeRange: timeRange,\n      differenceInMinutes: differenceInMinutes,\n    });\n  }, [differenceInMinutes, onTimeRangeChange, timeRange]);\n\n  const handleClick = () => {\n    const isOpen: any = isOpenTimePicker === true ? undefined : true;\n    setIsOpenTimePicker(isOpen);\n  };\n\n  const handleCloseClick = (event: any) => {\n    setTimeRange([]);\n    setCnt(0);\n    event.stopPropagation();\n  };\n\n  const customInput = (\n    <TextField\n      className=\"time-input\"\n      type=\"text\"\n      value={\n        timeRange.length === 1\n          ? `${timeRange[0]} - `\n          : timeRange.length === 2\n            ? `${timeRange[0]} - ${timeRange[1]}`\n            : \"\"\n      }\n      InputProps={{\n        readOnly: true,\n        endAdornment: (\n          <InputAdornment position=\"end\">\n            {timeRange.length > 0 && (\n              <IconButton onClick={handleCloseClick}>\n                <Close />\n              </IconButton>\n            )}\n            <IconButton onClick={handleClick}>\n              <AccessTimeRounded />\n            </IconButton>\n          </InputAdornment>\n        ),\n      }}\n    />\n  );\n\n  return (\n    <>\n      <Box className=\"DateRangePicker\">\n        <DatePicker\n          className=\"DatePickerWrapper\"\n          onChange={(date: any) => {\n            handleChange(date), handleClick();\n          }}\n          showTimeSelect\n          showTimeSelectOnly\n          timeIntervals={15}\n          selectsRange\n          customInput={customInput}\n          open={isOpenTimePicker}\n          value={\n            timeRange && timeRange.length === 1\n              ? `${timeRange[0]}-`\n              : timeRange && timeRange.length === 2\n                ? `${timeRange[0]}-${timeRange[1]}`\n                : undefined\n          }\n        />\n        <Box\n          className=\"box-icon\"\n          style={\n            timeRange.length > 0 ? { right: \"2.5rem\" } : { right: \"1.563rem\" }\n          }\n        >\n          {timeRange.length > 0 && <Close onClick={handleCloseClick} />}\n        </Box>\n      </Box>\n    </>\n  );\n};\n\nexport default TimeRangePicker;\n"],"names":[],"mappings":"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"}

package/dist/components/time-range-picker/time-range-picker/index.js

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("react-datepicker");;/* empty css                               */var r=require("@mui/icons-material"),s=require("@mui/material"),i=;/* empty css                                 */function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=/* @__PURE__ */o(n);exports.default=n=>{const[o,u]=t.useState([]),[c,a]=t.useState(0),[d,m]=t.useState(0),[g,h]=t.useState(void 0),{hour12:p=!1,startTime:x,endTime:f,onTimeRangeChange:j}=n;t.useEffect(()=>{u([]);const e=e=>{if(!e)return null;const[t,n]=e.split(" "),[r,s]=t.split(":").map(Number);let i=r;n&&("PM"===n?12!==r&&(i+=12):"AM"===n&&12===r&&(i-=12));const o=/* @__PURE__ */new Date;o.setHours(i,s,0,0);const l=o.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:p});let u=l;return 0===o.getHours()?u="00"+l.slice(2):12===o.getHours()&&(u="12"+l.slice(2)),u};u(t=>{if(x&&f){const n=e(x),r=e(f);return[...t,n,r]}return t})},[p,x,f]),t.useEffect(()=>{if(2===d&&m(0),2===o.length){const e=o[0],t=o[1],n=v(e);let r=v(t)-n;r<0&&(r+=1440),a(r)}else a(0)},[d,o]);const v=e=>{const[t,n,r]=e.split(/:| /);let s=parseInt(t);const i=parseInt(n);return r&&"pm"===r.toLowerCase()&&12!==s?s+=12:r&&"am"===r.toLowerCase()&&12===s&&(s=0),60*s+i};t.useEffect(()=>{j({timeRange:o,differenceInMinutes:c})},[c,j,o]);const C=()=>{h(!0!==g||void 0)},I=e=>{u([]),m(0),e.stopPropagation()},S=/* @__PURE__ */e.jsx(i.default,{className:"time-input",type:"text",value:1===o.length?`${o[0]} - `:2===o.length?`${o[0]} - ${o[1]}`:"",InputProps:{readOnly:!0,endAdornment:/* @__PURE__ */e.jsxs(s.InputAdornment,{position:"end",children:[o.length>0&&/* @__PURE__ */e.jsx(s.IconButton,{onClick:I,children:/* @__PURE__ */e.jsx(r.Close,{})}),
-/* @__PURE__ */e.jsx(s.IconButton,{onClick:C,children:/* @__PURE__ */e.jsx(r.AccessTimeRounded,{})})]})}});/* @__PURE__ */
-return e.jsx(e.Fragment,{children:/* @__PURE__ */e.jsxs(s.Box,{className:"DateRangePicker",children:[
-/* @__PURE__ */e.jsx(l.default,{className:"DatePickerWrapper",onChange:e=>{(e=>{const t=e.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:p});let n=t;0===e.getHours()?n="00"+t.slice(2):12===e.getHours()&&(n="12"+t.slice(2)),o.length<2?u([...o,n]):0===d?u(e=>{const t=[...e];return t[0]=n,t}):1===d&&u(e=>{const t=[...e];return t[1]=n,t}),m(d+1)})(e),C()},showTimeSelect:!0,showTimeSelectOnly:!0,timeIntervals:15,selectsRange:!0,customInput:S,open:g,value:o&&1===o.length?`${o[0]}-`:o&&2===o.length?`${o[0]}-${o[1]}`:void 0}),
-/* @__PURE__ */e.jsx(s.Box,{className:"box-icon",style:o.length>0?{right:"2.5rem"}:{right:"1.563rem"},children:o.length>0&&/* @__PURE__ */e.jsx(r.Close,{onClick:I})})]})})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("react-datepicker");;/* empty css                               */var s=,/* empty css                                 */r=,/* empty css                                                 */i=,/* empty css                                                         */o=,/* empty css                                                                       */u=,/* empty css                                                               */l=;/* empty css                                                                     */function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=/* @__PURE__ */a(n);exports.default=n=>{const[a,d]=t.useState([]),[m,g]=t.useState(0),[f,x]=t.useState(0),[h,p]=t.useState(void 0),{hour12:j=!1,startTime:q,endTime:v,onTimeRangeChange:I}=n;t.useEffect(()=>{d([]);const e=e=>{if(!e)return null;const[t,n]=e.split(" "),[s,r]=t.split(":").map(Number);let i=s;n&&("PM"===n?12!==s&&(i+=12):"AM"===n&&12===s&&(i-=12));const o=/* @__PURE__ */new Date;o.setHours(i,r,0,0);const u=o.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:j});let l=u;return 0===o.getHours()?l="00"+u.slice(2):12===o.getHours()&&(l="12"+u.slice(2)),l};d(t=>{if(q&&v){const n=e(q),s=e(v);return[...t,n,s]}return t})},[j,q,v]),t.useEffect(()=>{if(2===f&&x(0),2===a.length){const e=a[0],t=a[1],n=C(e);let s=C(t)-n;s<0&&(s+=1440),g(s)}else g(0)},[f,a]);const C=e=>{const[t,n,s]=e.split(/:| /);let r=parseInt(t);const i=parseInt(n);return s&&"pm"===s.toLowerCase()&&12!==r?r+=12:s&&"am"===s.toLowerCase()&&12===r&&(r=0),60*r+i};t.useEffect(()=>{I({timeRange:a,differenceInMinutes:m})},[m,I,a]);const S=()=>{p(!0!==h||void 0)},T=e=>{d([]),x(0),e.stopPropagation()},k=/* @__PURE__ */e.jsx(s.default,{className:"time-input",type:"text",value:1===a.length?`${a[0]} - `:2===a.length?`${a[0]} - ${a[1]}`:"",InputProps:{readOnly:!0,endAdornment:/* @__PURE__ */e.jsxs(o.default,{position:"end",children:[a.length>0&&/* @__PURE__ */e.jsx(u.default,{onClick:T,children:/* @__PURE__ */e.jsx(i.default,{})}),
+/* @__PURE__ */e.jsx(u.default,{onClick:S,children:/* @__PURE__ */e.jsx(l.default,{})})]})}});/* @__PURE__ */
+return e.jsx(e.Fragment,{children:/* @__PURE__ */e.jsxs(r.default,{className:"DateRangePicker",children:[
+/* @__PURE__ */e.jsx(c.default,{className:"DatePickerWrapper",onChange:e=>{(e=>{const t=e.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:j});let n=t;0===e.getHours()?n="00"+t.slice(2):12===e.getHours()&&(n="12"+t.slice(2)),a.length<2?d([...a,n]):0===f?d(e=>{const t=[...e];return t[0]=n,t}):1===f&&d(e=>{const t=[...e];return t[1]=n,t}),x(f+1)})(e),S()},showTimeSelect:!0,showTimeSelectOnly:!0,timeIntervals:15,selectsRange:!0,customInput:k,open:h,value:a&&1===a.length?`${a[0]}-`:a&&2===a.length?`${a[0]}-${a[1]}`:void 0}),
+/* @__PURE__ */e.jsx(r.default,{className:"box-icon",style:a.length>0?{right:"2.5rem"}:{right:"1.563rem"},children:a.length>0&&/* @__PURE__ */e.jsx(i.default,{onClick:T})})]})})};
 //# sourceMappingURL=index.js.map