@startdownnotez404/ui 1.0.0 → 1.3.5

package/dist/chunk-4RPFRNXG.mjs

@@ -0,0 +1,62 @@
+// src/components/elemental/Typography/src/Typography.ts
+import { default as default2 } from "@mui/material/Typography";
+
+// src/components/elemental/Typography/src/Variants.tsx
+import Typography from "@mui/material/Typography";
+import { jsx } from "react/jsx-runtime";
+function Header(props) {
+  return /* @__PURE__ */ jsx(Typography, { variant: "h5", ...props });
+}
+function SubHeader(props) {
+  return /* @__PURE__ */ jsx(Typography, { variant: "h6", ...props });
+}
+function SubTitle(props) {
+  return /* @__PURE__ */ jsx(Typography, { variant: "subtitle1", ...props });
+}
+function Subscript(props) {
+  return /* @__PURE__ */ jsx(
+    Typography,
+    {
+      variant: "caption",
+      ...props,
+      sx: {
+        ...props.sx,
+        color: props.color ?? "var(--mui-palette-text-subscript)"
+      }
+    }
+  );
+}
+function Body(props) {
+  return /* @__PURE__ */ jsx(Typography, { variant: "body1", ...props });
+}
+
+// src/components/elemental/Typography/src/theme.ts
+var typographyTheme = {
+  styleOverrides: {
+    root: () => ({
+      textOverflow: "ellipsis",
+      overflow: "hidden",
+      "&:has(svg)": {
+        display: "inline-flex",
+        alignItems: "center",
+        "&>svg": {
+          fontSize: "1em"
+        }
+      }
+    }),
+    caption: {
+      lineHeight: 1
+    }
+  }
+};
+
+export {
+  default2 as default,
+  Header,
+  SubHeader,
+  SubTitle,
+  Subscript,
+  Body,
+  typographyTheme
+};
+//# sourceMappingURL=chunk-4RPFRNXG.mjs.map

package/dist/chunk-4RPFRNXG.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/elemental/Typography/src/Typography.ts","../src/components/elemental/Typography/src/Variants.tsx","../src/components/elemental/Typography/src/theme.ts"],"sourcesContent":["export { default } from '@mui/material/Typography'","import React from 'react'\nimport Typography, {type TypographyProps}  from '@mui/material/Typography'\n\n/**\n * Mui Typography with variant h5\n * \n * [Doc](https://material-ui.com/api/typography/)\n */\nexport function Header(props: { children?: React.ReactNode } & TypographyProps) {\n\treturn <Typography variant=\"h5\" {...props} />\n}\n\n\n/**\n * Mui Typography with variant h6\n * \n * [Doc](https://material-ui.com/api/typography/)\n */\nexport function SubHeader(props: TypographyProps) {\n\treturn <Typography variant=\"h6\" {...props} />\n}\n\n/**\n * Mui Typography with variant subtitle1\n * \n * [Doc](https://material-ui.com/api/typography/)\n */\nexport function SubTitle(props: TypographyProps) {\n\treturn <Typography variant=\"subtitle1\" {...props} />\n}\n\n/**\n * Mui Typography with variant caption\n * \n * [Doc](https://material-ui.com/api/typography/)\n */\nexport function Subscript(props: TypographyProps) {\n\treturn (\n\t\t<Typography\n\t\t\tvariant=\"caption\"\n\t\t\t{...props}\n\t\t\tsx={{\n\t\t\t\t...props.sx,\n\t\t\t\tcolor: props.color ?? 'var(--mui-palette-text-subscript)',\n\t\t\t}}\n\t\t/>\n\t)\n}\n\n/**\n * Mui Typography with variant body\n * \n * [Doc](https://material-ui.com/api/typography/)\n */\nexport function Body(props: TypographyProps) {\n\treturn <Typography variant=\"body1\" {...props} />\n}","import type { MuiComponentTheme } from '@/_utils/_types'\n\nexport const typographyTheme = {\n  styleOverrides: {\n    root: ()=>({\n      textOverflow: 'ellipsis',\n      overflow: 'hidden',\n     \n      \"&:has(svg)\":{\n        display: 'inline-flex',\n        alignItems: 'center',\n        \"&>svg\":{\n          fontSize: '1em',\n          \n        },\n      },\n      \n    }),\n    caption: {\n      lineHeight: 1,\n    },\n    \n  }\n\n} as const satisfies MuiComponentTheme<\"MuiTypography\">"],"mappings":";AAAA,SAAS,WAAAA,gBAAe;;;ACCxB,OAAO,gBAAyC;AAQxC;AADD,SAAS,OAAO,OAAyD;AAC/E,SAAO,oBAAC,cAAW,SAAQ,MAAM,GAAG,OAAO;AAC5C;AAQO,SAAS,UAAU,OAAwB;AACjD,SAAO,oBAAC,cAAW,SAAQ,MAAM,GAAG,OAAO;AAC5C;AAOO,SAAS,SAAS,OAAwB;AAChD,SAAO,oBAAC,cAAW,SAAQ,aAAa,GAAG,OAAO;AACnD;AAOO,SAAS,UAAU,OAAwB;AACjD,SACC;AAAA,IAAC;AAAA;AAAA,MACA,SAAQ;AAAA,MACP,GAAG;AAAA,MACJ,IAAI;AAAA,QACH,GAAG,MAAM;AAAA,QACT,OAAO,MAAM,SAAS;AAAA,MACvB;AAAA;AAAA,EACD;AAEF;AAOO,SAAS,KAAK,OAAwB;AAC5C,SAAO,oBAAC,cAAW,SAAQ,SAAS,GAAG,OAAO;AAC/C;;;ACtDO,IAAM,kBAAkB;AAAA,EAC7B,gBAAgB;AAAA,IACd,MAAM,OAAK;AAAA,MACT,cAAc;AAAA,MACd,UAAU;AAAA,MAEV,cAAa;AAAA,QACX,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,SAAQ;AAAA,UACN,UAAU;AAAA,QAEZ;AAAA,MACF;AAAA,IAEF;AAAA,IACA,SAAS;AAAA,MACP,YAAY;AAAA,IACd;AAAA,EAEF;AAEF;","names":["default"]}

package/dist/chunk-56TI2ZBT.mjs

@@ -0,0 +1,114 @@
+// src/components/elemental/Badge/src/Badge/Badge.tsx
+import MuiBadge from "@mui/material/Badge";
+import { jsx } from "react/jsx-runtime";
+function Badge(p) {
+  const { style_variant, variant, className, ...rest } = p;
+  const badge_var_class = style_variant === "outlined" ? "badge-outlined" : style_variant === "filled" ? "badge-filled" : "badge-outlined";
+  return /* @__PURE__ */ jsx(MuiBadge, { ...rest, variant, className: badge_var_class + (className ? ` ${className}` : "") });
+}
+
+// src/components/elemental/Badge/src/Badge/theme.ts
+var badgeTheme = {
+  defaultProps: {},
+  styleOverrides: {
+    root: {
+      "& .MuiBadge-badge": {
+        background: "var(--badge-bg-color)",
+        color: "var(--badge-text-color)",
+        border: "1px solid var(--badge-br-color)",
+        backdropFilter: "blur(2px)",
+        maxWidth: "50px",
+        overflow: "hidden",
+        textOverflow: "ellipsis",
+        justifyContent: "flex-start"
+      },
+      "&.badge-outlined,&": {
+        "--badge-bg-color": "transparent"
+      },
+      "&.badge-filled": {
+        "--badge-bg-color": "var(--mui-palette-secondary-main)",
+        "--badge-text-color": "var(--mui-palette-background-default)"
+      },
+      "--badge-text-color": "var(--mui-palette-secondary-main)",
+      "--badge-br-color": "var(--mui-palette-secondary-main)",
+      /** primary */
+      "& .MuiBadge-colorPrimary": {
+        "--badge-br-color": "var(--mui-palette-primary-emphasis)",
+        "--badge-text-color": "var(--mui-palette-primary-emphasis)"
+      },
+      "&.badge-filled .MuiBadge-colorPrimary": {
+        "--badge-bg-color": "var(--mui-palette-primary-emphasis)",
+        "--badge-text-color": "var(--mui-palette-primary-contrast)"
+      },
+      /** secondary */
+      "&.badge-filled .MuiBadge-colorSecondary": {
+        "--badge-bg-color": "var(--mui-palette-secondary-main)",
+        "--badge-text-color": "var(--mui-palette-background-default)"
+      },
+      "& .MuiBadge-colorSecondary": {
+        "--badge-br-color": "var(--mui-palette-secondary-main)",
+        "--badge-text-color": "var(--mui-palette-secondary-main)"
+      },
+      /** error */
+      "&.badge-filled .MuiBadge-colorError": {
+        "--badge-bg-color": "var(--mui-palette-error-main)",
+        "--badge-text-color": "var(--mui-palette-background-default)"
+      },
+      "& .MuiBadge-colorError": {
+        "--badge-br-color": "var(--mui-palette-error-main)",
+        "--badge-text-color": "var(--mui-palette-error-main)"
+      },
+      /** info */
+      "&.badge-filled .MuiBadge-colorInfo": {
+        "--badge-bg-color": "var(--mui-palette-info-main)",
+        "--badge-text-color": "var(--mui-palette-info-contrastText)"
+      },
+      "& .MuiBadge-colorInfo": {
+        "--badge-br-color": "var(--mui-palette-info-main)",
+        "--badge-text-color": "var(--mui-palette-info-main)"
+      },
+      /** success */
+      "&.badge-filled .MuiBadge-colorSuccess": {
+        "--badge-bg-color": "var(--mui-palette-success-main)",
+        "--badge-text-color": "var(--mui-palette-success-contrastText)"
+      },
+      "& .MuiBadge-colorSuccess": {
+        "--badge-br-color": "var(--mui-palette-success-main)",
+        "--badge-text-color": "var(--mui-palette-success-main)"
+      },
+      /** warning */
+      "&.badge-filled .MuiBadge-colorWarning": {
+        "--badge-bg-color": "var(--mui-palette-warning-main)",
+        "--badge-text-color": "var(--mui-palette-warning-contrastText)"
+      },
+      "& .MuiBadge-colorWarning": {
+        "--badge-br-color": "var(--mui-palette-warning-main)",
+        "--badge-text-color": "var(--mui-palette-warning-main)"
+      },
+      /** system */
+      "&.badge-filled .MuiBadge-colorSystem": {
+        "--badge-bg-color": "var(--mui-palette-system-main)",
+        "--badge-text-color": "var(--mui-palette-system-contrastText)"
+      },
+      "& .MuiBadge-colorSystem": {
+        "--badge-br-color": "var(--mui-palette-system-main)",
+        "--badge-text-color": "var(--mui-palette-system-main)"
+      },
+      /** insight */
+      "&.badge-filled .MuiBadge-colorInsight": {
+        "--badge-bg-color": "var(--mui-palette-insight-main)",
+        "--badge-text-color": "var(--mui-palette-insight-contrastText)"
+      },
+      "& .MuiBadge-colorInsight": {
+        "--badge-br-color": "var(--mui-palette-insight-main)",
+        "--badge-text-color": "var(--mui-palette-insight-main)"
+      }
+    }
+  }
+};
+
+export {
+  Badge,
+  badgeTheme
+};
+//# sourceMappingURL=chunk-56TI2ZBT.mjs.map

package/dist/chunk-56TI2ZBT.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/elemental/Badge/src/Badge/Badge.tsx","../src/components/elemental/Badge/src/Badge/theme.ts"],"sourcesContent":["import React from 'react'\nimport MuiBadge from '@mui/material/Badge'\n\ntype BadgeProps = {\n  style_variant?: 'filled' | 'outlined';\n}\n/**\n * A styled Mui Badge component\n * \n * [Doc](https://mui.com/material-ui/api/badge/)\n * \n * @example\n * ```tsx\n *  <MuiBadge badgeContent={4}>\n *      <IconButton>\n *          <MailIcon/>\n *      </IconButton>\n *  </MuiBadge>\n * ```\n */\nexport default function Badge(p: \n  React.ComponentProps<typeof MuiBadge> \n  & BadgeProps\n) {\n  const {style_variant, variant, className, ...rest} = p;\n  const badge_var_class = \n    style_variant === 'outlined' ? 'badge-outlined'\n    : style_variant === 'filled' ? 'badge-filled'\n    : 'badge-outlined';\n\n  return <MuiBadge {...rest} variant={variant} className={badge_var_class + (className ? ` ${className}` : '')} />\n}\n","import type { MuiComponentTheme } from '@/_utils/_types'\n\nexport const badgeTheme = {\n  defaultProps: {\n  },\n  styleOverrides: {\n    root: {\n      \"& .MuiBadge-badge\": {\n        background: 'var(--badge-bg-color)',\n        color: 'var(--badge-text-color)',\n        border: '1px solid var(--badge-br-color)',\n        backdropFilter: 'blur(2px)',\n        maxWidth: '50px',\n        overflow: 'hidden',\n        textOverflow: 'ellipsis',\n        justifyContent: 'flex-start',\n      },\n      \"&.badge-outlined,&\":{\n        '--badge-bg-color': 'transparent',\n      },\n      \"&.badge-filled\":{\n        '--badge-bg-color': 'var(--mui-palette-secondary-main)',\n        '--badge-text-color': 'var(--mui-palette-background-default)',\n      },\n\n      '--badge-text-color': 'var(--mui-palette-secondary-main)',\n      '--badge-br-color': 'var(--mui-palette-secondary-main)',\n\n      /** primary */\n      \"& .MuiBadge-colorPrimary\":{\n        '--badge-br-color': 'var(--mui-palette-primary-emphasis)',\n        '--badge-text-color': 'var(--mui-palette-primary-emphasis)',\n      },\n      \"&.badge-filled .MuiBadge-colorPrimary\":{\n        '--badge-bg-color': 'var(--mui-palette-primary-emphasis)',\n        '--badge-text-color': 'var(--mui-palette-primary-contrast)',\n      },\n\n      /** secondary */\n      \"&.badge-filled .MuiBadge-colorSecondary\":{\n        '--badge-bg-color': 'var(--mui-palette-secondary-main)',\n        '--badge-text-color': 'var(--mui-palette-background-default)',\n      },\n      \"& .MuiBadge-colorSecondary\":{\n        '--badge-br-color': 'var(--mui-palette-secondary-main)',\n        '--badge-text-color': 'var(--mui-palette-secondary-main)',\n      },\n\n      /** error */\n      \"&.badge-filled .MuiBadge-colorError\":{\n        '--badge-bg-color': 'var(--mui-palette-error-main)',\n        '--badge-text-color': 'var(--mui-palette-background-default)',\n      },\n      \"& .MuiBadge-colorError\":{\n        '--badge-br-color': 'var(--mui-palette-error-main)',\n        '--badge-text-color': 'var(--mui-palette-error-main)',\n      },\n      /** info */\n      \"&.badge-filled .MuiBadge-colorInfo\":{\n        '--badge-bg-color': 'var(--mui-palette-info-main)',\n        '--badge-text-color': 'var(--mui-palette-info-contrastText)',\n      },\n      \"& .MuiBadge-colorInfo\":{\n        '--badge-br-color': 'var(--mui-palette-info-main)',\n        '--badge-text-color': 'var(--mui-palette-info-main)',\n      },\n      /** success */\n      \"&.badge-filled .MuiBadge-colorSuccess\":{\n        '--badge-bg-color': 'var(--mui-palette-success-main)',\n        '--badge-text-color': 'var(--mui-palette-success-contrastText)',\n      },\n      \"& .MuiBadge-colorSuccess\":{\n        '--badge-br-color': 'var(--mui-palette-success-main)',\n        '--badge-text-color': 'var(--mui-palette-success-main)',\n      },\n      /** warning */\n      \"&.badge-filled .MuiBadge-colorWarning\":{\n        '--badge-bg-color': 'var(--mui-palette-warning-main)',\n        '--badge-text-color': 'var(--mui-palette-warning-contrastText)',\n      },\n      \"& .MuiBadge-colorWarning\":{\n        '--badge-br-color': 'var(--mui-palette-warning-main)',\n        '--badge-text-color': 'var(--mui-palette-warning-main)',\n      },\n      /** system */\n      \"&.badge-filled .MuiBadge-colorSystem\":{\n        '--badge-bg-color': 'var(--mui-palette-system-main)',\n        '--badge-text-color': 'var(--mui-palette-system-contrastText)',\n      },\n      \"& .MuiBadge-colorSystem\":{\n        '--badge-br-color': 'var(--mui-palette-system-main)',\n        '--badge-text-color': 'var(--mui-palette-system-main)',\n      },\n      /** insight */\n      \"&.badge-filled .MuiBadge-colorInsight\":{\n        '--badge-bg-color': 'var(--mui-palette-insight-main)',\n        '--badge-text-color': 'var(--mui-palette-insight-contrastText)',\n      },\n      \"& .MuiBadge-colorInsight\":{\n        '--badge-br-color': 'var(--mui-palette-insight-main)',\n        '--badge-text-color': 'var(--mui-palette-insight-main)',\n      },\n    },\n  }\n\n} as const satisfies MuiComponentTheme<\"MuiBadge\">"],"mappings":";AACA,OAAO,cAAc;AA6BZ;AAVM,SAAR,MAAuB,GAG5B;AACA,QAAM,EAAC,eAAe,SAAS,WAAW,GAAG,KAAI,IAAI;AACrD,QAAM,kBACJ,kBAAkB,aAAa,mBAC7B,kBAAkB,WAAW,iBAC7B;AAEJ,SAAO,oBAAC,YAAU,GAAG,MAAM,SAAkB,WAAW,mBAAmB,YAAY,IAAI,SAAS,KAAK,KAAK;AAChH;;;AC7BO,IAAM,aAAa;AAAA,EACxB,cAAc,CACd;AAAA,EACA,gBAAgB;AAAA,IACd,MAAM;AAAA,MACJ,qBAAqB;AAAA,QACnB,YAAY;AAAA,QACZ,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,gBAAgB;AAAA,QAChB,UAAU;AAAA,QACV,UAAU;AAAA,QACV,cAAc;AAAA,QACd,gBAAgB;AAAA,MAClB;AAAA,MACA,sBAAqB;AAAA,QACnB,oBAAoB;AAAA,MACtB;AAAA,MACA,kBAAiB;AAAA,QACf,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA,MAEA,sBAAsB;AAAA,MACtB,oBAAoB;AAAA;AAAA,MAGpB,4BAA2B;AAAA,QACzB,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA,MACA,yCAAwC;AAAA,QACtC,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA;AAAA,MAGA,2CAA0C;AAAA,QACxC,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA,MACA,8BAA6B;AAAA,QAC3B,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA;AAAA,MAGA,uCAAsC;AAAA,QACpC,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA,MACA,0BAAyB;AAAA,QACvB,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA;AAAA,MAEA,sCAAqC;AAAA,QACnC,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA,MACA,yBAAwB;AAAA,QACtB,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA;AAAA,MAEA,yCAAwC;AAAA,QACtC,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA,MACA,4BAA2B;AAAA,QACzB,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA;AAAA,MAEA,yCAAwC;AAAA,QACtC,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA,MACA,4BAA2B;AAAA,QACzB,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA;AAAA,MAEA,wCAAuC;AAAA,QACrC,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA,MACA,2BAA0B;AAAA,QACxB,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA;AAAA,MAEA,yCAAwC;AAAA,QACtC,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA,MACA,4BAA2B;AAAA,QACzB,oBAAoB;AAAA,QACpB,sBAAsB;AAAA,MACxB;AAAA,IACF;AAAA,EACF;AAEF;","names":[]}

package/dist/chunk-6REEQBJI.mjs

@@ -0,0 +1,62 @@
+// src/components/Icons/AnimatedIcon/AnimatedDone/Icon.tsx
+import SvgIcon from "@mui/material/SvgIcon";
+
+// src/components/Icons/AnimatedIcon/AnimatedDone/check-all.svg?react
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var SvgCheckAll = (props) => /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 24 24", ...props, children: [
+  /* @__PURE__ */ jsx("mask", { id: "lineMdCheckAll0", children: /* @__PURE__ */ jsxs("g", { fill: "none", stroke: "#fff", strokeDasharray: 24, strokeDashoffset: 24, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, children: [
+    /* @__PURE__ */ jsx("path", { d: "M2 13.5l4 4l10.75 -10.75", children: /* @__PURE__ */ jsx("animate", { fill: "freeze", attributeName: "stroke-dashoffset", dur: "0.4s", values: "24;0" }) }),
+    /* @__PURE__ */ jsx("path", { stroke: "#000", strokeWidth: 6, d: "M7.5 13.5l4 4l10.75 -10.75", children: /* @__PURE__ */ jsx("animate", { fill: "freeze", attributeName: "stroke-dashoffset", begin: "0.4s", dur: "0.4s", values: "24;0" }) }),
+    /* @__PURE__ */ jsx("path", { d: "M7.5 13.5l4 4l10.75 -10.75", children: /* @__PURE__ */ jsx("animate", { fill: "freeze", attributeName: "stroke-dashoffset", begin: "0.4s", dur: "0.4s", values: "24;0" }) })
+  ] }) }),
+  /* @__PURE__ */ jsx("rect", { width: 24, height: 24, fill: "currentColor", mask: "url(#lineMdCheckAll0)" })
+] });
+var check_all_default = SvgCheckAll;
+
+// src/components/Icons/AnimatedIcon/AnimatedDone/Icon.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var Icon = (props) => {
+  return /* @__PURE__ */ jsx2(SvgIcon, { ...props, component: check_all_default, inheritViewBox: true });
+};
+var Icon_default = Icon;
+
+// src/components/Icons/AnimatedIcon/AnimatedLoading/Icon.tsx
+import SvgIcon2 from "@mui/material/SvgIcon";
+
+// src/components/Icons/AnimatedIcon/AnimatedLoading/loading.svg?react
+import * as React2 from "react";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var SvgLoading = (props) => /* @__PURE__ */ jsx3("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsxs2("g", { fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeWidth: 2, children: [
+  /* @__PURE__ */ jsx3("path", { strokeDasharray: 60, strokeDashoffset: 60, strokeOpacity: 0.3, d: "M12 3C16.9706 3 21 7.02944 21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3Z", children: /* @__PURE__ */ jsx3("animate", { fill: "freeze", attributeName: "stroke-dashoffset", dur: "1.3s", values: "60;0" }) }),
+  /* @__PURE__ */ jsxs2("path", { strokeDasharray: 15, strokeDashoffset: 15, d: "M12 3C16.9706 3 21 7.02944 21 12", children: [
+    /* @__PURE__ */ jsx3("animate", { fill: "freeze", attributeName: "stroke-dashoffset", dur: "0.3s", values: "15;0" }),
+    /* @__PURE__ */ jsx3("animateTransform", { attributeName: "transform", dur: "1.5s", repeatCount: "indefinite", type: "rotate", values: "0 12 12;360 12 12" })
+  ] })
+] }) });
+var loading_default = SvgLoading;
+
+// src/components/Icons/AnimatedIcon/AnimatedLoading/Icon.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Icon2 = (props) => {
+  return /* @__PURE__ */ jsx4(SvgIcon2, { ...props, component: loading_default, inheritViewBox: true });
+};
+var Icon_default2 = Icon2;
+
+// src/components/Icons/AnimatedIcon/AnimatedPending/Icon.tsx
+import { HashLoader } from "react-spinners";
+import { jsx as jsx5 } from "react/jsx-runtime";
+function AnimatedPending({
+  color = "#ff2f7a",
+  size = 20,
+  loading = true
+}) {
+  return /* @__PURE__ */ jsx5(HashLoader, { color, loading, size });
+}
+
+export {
+  Icon_default,
+  Icon_default2,
+  AnimatedPending
+};
+//# sourceMappingURL=chunk-6REEQBJI.mjs.map

package/dist/chunk-6REEQBJI.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Icons/AnimatedIcon/AnimatedDone/Icon.tsx","../src/components/Icons/AnimatedIcon/AnimatedDone/check-all.svg","../src/components/Icons/AnimatedIcon/AnimatedLoading/Icon.tsx","../src/components/Icons/AnimatedIcon/AnimatedLoading/loading.svg","../src/components/Icons/AnimatedIcon/AnimatedPending/Icon.tsx"],"sourcesContent":["import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'\nimport ReactComponent from './check-all.svg?react'\n\nconst Icon = (props:SvgIconProps) => {\n    return <SvgIcon {...props} component={ReactComponent} inheritViewBox/>\n}\n \nexport default Icon","import * as React from \"react\";\nconst SvgCheckAll = props => <svg xmlns=\"http://www.w3.org/2000/svg\" width={24} height={24} viewBox=\"0 0 24 24\" {...props}><mask id=\"lineMdCheckAll0\"><g fill=\"none\" stroke=\"#fff\" strokeDasharray={24} strokeDashoffset={24} strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2}><path d=\"M2 13.5l4 4l10.75 -10.75\"><animate fill=\"freeze\" attributeName=\"stroke-dashoffset\" dur=\"0.4s\" values=\"24;0\" /></path><path stroke=\"#000\" strokeWidth={6} d=\"M7.5 13.5l4 4l10.75 -10.75\"><animate fill=\"freeze\" attributeName=\"stroke-dashoffset\" begin=\"0.4s\" dur=\"0.4s\" values=\"24;0\" /></path><path d=\"M7.5 13.5l4 4l10.75 -10.75\"><animate fill=\"freeze\" attributeName=\"stroke-dashoffset\" begin=\"0.4s\" dur=\"0.4s\" values=\"24;0\" /></path></g></mask><rect width={24} height={24} fill=\"currentColor\" mask=\"url(#lineMdCheckAll0)\" /></svg>;\nexport default SvgCheckAll;","import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'\nimport ReactComponent from './loading.svg?react'\n\n\nconst Icon = (props:SvgIconProps) => {\n    return <SvgIcon {...props} component={ReactComponent} inheritViewBox/>\n}\n \nexport default Icon","import * as React from \"react\";\nconst SvgLoading = props => <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}><g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeWidth={2}><path strokeDasharray={60} strokeDashoffset={60} strokeOpacity={0.3} d=\"M12 3C16.9706 3 21 7.02944 21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3Z\"><animate fill=\"freeze\" attributeName=\"stroke-dashoffset\" dur=\"1.3s\" values=\"60;0\" /></path><path strokeDasharray={15} strokeDashoffset={15} d=\"M12 3C16.9706 3 21 7.02944 21 12\"><animate fill=\"freeze\" attributeName=\"stroke-dashoffset\" dur=\"0.3s\" values=\"15;0\" /><animateTransform attributeName=\"transform\" dur=\"1.5s\" repeatCount=\"indefinite\" type=\"rotate\" values=\"0 12 12;360 12 12\" /></path></g></svg>;\nexport default SvgLoading;","import { HashLoader } from 'react-spinners'\n\n/**\n * HashLoader expects a concrete color value (hex/rgb/named color).\n * Do not pass CSS variable tokens like `var(--palette-primary-main)` directly.\n */\nexport default function AnimatedPending({\n    color = '#ff2f7a',\n    size = 20,\n    loading = true,\n}: {\n    // Must be a resolved color string; CSS variable tokens are not supported by HashLoader.\n    color?: React.ComponentProps<typeof HashLoader>['color']\n    size?: React.ComponentProps<typeof HashLoader>['size']\n    loading?: React.ComponentProps<typeof HashLoader>['loading']\n}) {\n    return <HashLoader color={color} loading={loading} size={size} />\n}"],"mappings":";AAAA,OAAO,aAA+B;;;ACAtC,YAAY,WAAW;AAC+H,SAAwK,KAAxK;AAAtJ,IAAM,cAAc,WAAS,qBAAC,SAAI,OAAM,8BAA6B,OAAO,IAAI,QAAQ,IAAI,SAAQ,aAAa,GAAG,OAAO;AAAA,sBAAC,UAAK,IAAG,mBAAkB,+BAAC,OAAE,MAAK,QAAO,QAAO,QAAO,iBAAiB,IAAI,kBAAkB,IAAI,eAAc,SAAQ,gBAAe,SAAQ,aAAa,GAAG;AAAA,wBAAC,UAAK,GAAE,4BAA2B,8BAAC,aAAQ,MAAK,UAAS,eAAc,qBAAoB,KAAI,QAAO,QAAO,QAAO,GAAE;AAAA,IAAO,oBAAC,UAAK,QAAO,QAAO,aAAa,GAAG,GAAE,8BAA6B,8BAAC,aAAQ,MAAK,UAAS,eAAc,qBAAoB,OAAM,QAAO,KAAI,QAAO,QAAO,QAAO,GAAE;AAAA,IAAO,oBAAC,UAAK,GAAE,8BAA6B,8BAAC,aAAQ,MAAK,UAAS,eAAc,qBAAoB,OAAM,QAAO,KAAI,QAAO,QAAO,QAAO,GAAE;AAAA,KAAO,GAAI;AAAA,EAAO,oBAAC,UAAK,OAAO,IAAI,QAAQ,IAAI,MAAK,gBAAe,MAAK,yBAAwB;AAAA,GAAE;AAC5yB,IAAO,oBAAQ;;;ADEJ,gBAAAA,YAAA;AADX,IAAM,OAAO,CAAC,UAAuB;AACjC,SAAO,gBAAAA,KAAC,WAAS,GAAG,OAAO,WAAW,mBAAgB,gBAAc;AACxE;AAEA,IAAO,eAAQ;;;AEPf,OAAOC,cAA+B;;;ACAtC,YAAYC,YAAW;AAC0W,gBAAAC,MAA2F,QAAAC,aAA3F;AAAjY,IAAM,aAAa,WAAS,gBAAAD,KAAC,SAAI,OAAM,8BAA6B,OAAM,OAAM,QAAO,OAAM,SAAQ,aAAa,GAAG,OAAO,0BAAAC,MAAC,OAAE,MAAK,QAAO,QAAO,gBAAe,eAAc,SAAQ,aAAa,GAAG;AAAA,kBAAAD,KAAC,UAAK,iBAAiB,IAAI,kBAAkB,IAAI,eAAe,KAAK,GAAE,oHAAmH,0BAAAA,KAAC,aAAQ,MAAK,UAAS,eAAc,qBAAoB,KAAI,QAAO,QAAO,QAAO,GAAE;AAAA,EAAO,gBAAAC,MAAC,UAAK,iBAAiB,IAAI,kBAAkB,IAAI,GAAE,oCAAmC;AAAA,oBAAAD,KAAC,aAAQ,MAAK,UAAS,eAAc,qBAAoB,KAAI,QAAO,QAAO,QAAO;AAAA,IAAE,gBAAAA,KAAC,sBAAiB,eAAc,aAAY,KAAI,QAAO,aAAY,cAAa,MAAK,UAAS,QAAO,qBAAoB;AAAA,KAAE;AAAA,GAAO,GAAI;AAC5wB,IAAO,kBAAQ;;;ADGJ,gBAAAE,YAAA;AADX,IAAMC,QAAO,CAAC,UAAuB;AACjC,SAAO,gBAAAD,KAACE,UAAA,EAAS,GAAG,OAAO,WAAW,iBAAgB,gBAAc;AACxE;AAEA,IAAOC,gBAAQF;;;AERf,SAAS,kBAAkB;AAgBhB,gBAAAG,YAAA;AAVI,SAAR,gBAAiC;AAAA,EACpC,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,UAAU;AACd,GAKG;AACC,SAAO,gBAAAA,KAAC,cAAW,OAAc,SAAkB,MAAY;AACnE;","names":["jsx","SvgIcon","React","jsx","jsxs","jsx","Icon","SvgIcon","Icon_default","jsx"]}

package/dist/chunk-AAH2O24U.mjs

@@ -0,0 +1,325 @@
+import {
+  IconButton_default
+} from "./chunk-JIU5GVM7.mjs";
+import {
+  default10 as default11,
+  default3 as default4,
+  default34 as default12,
+  default4 as default5,
+  default5 as default6,
+  default54 as default13,
+  default6 as default7,
+  default7 as default8,
+  default8 as default9,
+  default9 as default10
+} from "./chunk-ZVFYOXDE.mjs";
+import {
+  default as default3
+} from "./chunk-4RPFRNXG.mjs";
+import {
+  default as default2
+} from "./chunk-S6EZVRZC.mjs";
+
+// src/_utils/_func/downloadFile.ts
+import { fileTypeFromBuffer } from "file-type";
+async function downloadFile(url, fetchOptions) {
+  const res = await fetch(url, fetchOptions);
+  const blob = await res.blob();
+  const buffer = await blob.arrayBuffer();
+  const fType = await fileTypeFromBuffer(buffer);
+  const data = {
+    blobUrl: URL.createObjectURL(blob),
+    size: blob.size,
+    mimeType: fType?.mime || blob.type
+    // use file-type to get the mime type
+  };
+  const nonImgRes = {
+    ...data,
+    dimensions: {
+      width: 0,
+      height: 0
+    }
+  };
+  try {
+    if (data.mimeType.includes("image/")) {
+      const dimensions = await handleImageDownload(data.blobUrl);
+      return {
+        ...data,
+        dimensions
+      };
+    } else {
+      return nonImgRes;
+    }
+  } catch (err) {
+    console.warn("Failed to handle image download:", err);
+    return nonImgRes;
+  }
+}
+async function handleImageDownload(blobUrl) {
+  const img = new Image();
+  img.src = blobUrl;
+  await new Promise((resolve, reject) => {
+    img.onload = resolve;
+    img.onerror = reject;
+  });
+  const metaData = {
+    width: img.width,
+    height: img.height
+  };
+  img.remove();
+  return metaData;
+}
+
+// src/_utils/_const/file.ts
+var FILE_STATUSs = {
+  // local status
+  uploadingToLocal: "local-uploading",
+  uploadedToLocal: "local-uploaded",
+  localError: "local-error",
+  pending: "pending",
+  // upload s3
+  uploadPending: "upload-pending",
+  gettingSignedURL: "upload-gettingSignedURL",
+  beginUploadToS3: "upload-beginUploadToS3",
+  uploadedToCloud: "upload-uploadedToCloud",
+  error: "upload-error",
+  // download
+  downloadPending: "download-pending",
+  downloading: "download-in-progress",
+  downloaded: "download-completed",
+  downloadError: "download-error"
+};
+var FILE_TYPEs = {
+  image: "image",
+  video: "video",
+  audio: "audio",
+  pdf: "pdf",
+  doc: "doc",
+  xls: "xls",
+  ppt: "ppt",
+  txt: "txt",
+  zip: "zip",
+  json: "json",
+  other: "other"
+};
+
+// src/_utils/classes/PreviewableFile.ts
+var PreviewableFile = class {
+  path;
+  blobUrl;
+  filename;
+  randomName;
+  fileType;
+  mimeType;
+  size;
+  displaySize;
+  url;
+  fetchOptions;
+  putUrl;
+  getUrl;
+  status;
+  revokeable;
+  imageProps;
+  constructor(props = {}) {
+    this.path = props.path ?? "";
+    this.blobUrl = props.blobUrl ?? "";
+    this.filename = props.filename ?? "";
+    this.randomName = props.randomName ?? "";
+    this.fileType = props.fileType ?? getFileType(props.mimeType ?? "");
+    this.mimeType = props.mimeType ?? "";
+    this.size = props.size ?? 0;
+    this.displaySize = props.displaySize ?? displayFileSize(props.size ?? 0);
+    this.url = props.url ?? "";
+    this.fetchOptions = props.fetchOptions ?? {};
+    this.putUrl = props.putUrl ?? "";
+    this.getUrl = props.getUrl ?? "";
+    this.status = props.status ?? FILE_STATUSs.pending;
+    this.revokeable = props.revokeable ?? true;
+    this.imageProps = props.imageProps ?? {
+      width: 0,
+      height: 0
+    };
+    Object.preventExtensions(this);
+  }
+  toPlainObj() {
+    return {
+      ...this
+    };
+  }
+  updateFile(file) {
+    if (!file) return;
+    this.path = file.path;
+    this.blobUrl = file.blobUrl;
+    this.filename = file.filename;
+    this.randomName = file.randomName;
+    this.fileType = file.fileType;
+    this.size = file.size;
+    this.displaySize = file.displaySize;
+    this.url = file.url;
+    this.fetchOptions = file.fetchOptions;
+    this.putUrl = file.putUrl;
+    this.getUrl = file.getUrl;
+    this.status = file.status;
+    this.revokeable = file.revokeable;
+    this.imageProps = file.imageProps;
+  }
+  updateStatus(status) {
+    this.status = status;
+  }
+  async downloadFile() {
+    if (!this.url) return this;
+    try {
+      const res = await downloadFile(this.url, this.fetchOptions);
+      this.url = res.blobUrl;
+      this.path = res.blobUrl;
+      this.status = FILE_STATUSs.downloaded;
+      this.blobUrl = res.blobUrl;
+      this.fileType = getFileType(res.mimeType);
+      this.mimeType = res.mimeType;
+      this.size = res.size;
+      this.displaySize = displayFileSize(res.size);
+      this.imageProps = res.dimensions;
+      return this;
+    } catch (err) {
+      console.log(err);
+      return this;
+    }
+  }
+  _displayFileSize() {
+    return displayFileSize(this.size);
+  }
+  getUploadFormat() {
+    return {
+      url: this.putUrl,
+      keyPath: this.putUrl,
+      filename: this.filename,
+      fileType: this.mimeType,
+      hostname: ""
+    };
+  }
+};
+function displayFileSize(size) {
+  const units = ["B", "KB", "MB", "GB", "TB"];
+  let unitIndex = 0;
+  while (size >= 1024 && unitIndex < units.length - 1) {
+    size /= 1024;
+    unitIndex++;
+  }
+  const sizeWithUnit = size.toFixed(2) + " " + units[unitIndex];
+  return `[${sizeWithUnit}]`;
+}
+function getFileType(mimeType) {
+  const types = Object.values(FILE_TYPEs);
+  const [type] = mimeType.split("/");
+  if (types.includes(type)) {
+    return type;
+  }
+  const found = types.find((t) => mimeType.includes(t) && t !== FILE_TYPEs.other);
+  if (found) {
+    return found;
+  }
+  return FILE_TYPEs.other;
+}
+
+// src/components/compound/DisplayFile/src/DisplayFile.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var getFileIcon = (fileType) => {
+  switch (fileType) {
+    case FILE_TYPEs.image:
+      return default11;
+    case FILE_TYPEs.pdf:
+      return default5;
+    case FILE_TYPEs.audio:
+      return default6;
+    case FILE_TYPEs.video:
+      return default7;
+    case FILE_TYPEs.xls:
+      return default8;
+    case FILE_TYPEs.zip:
+      return default9;
+    case FILE_TYPEs.json:
+      return default12;
+    case FILE_TYPEs.ppt:
+    case FILE_TYPEs.doc:
+    case FILE_TYPEs.txt:
+      return default4;
+    default:
+      return default10;
+  }
+};
+var FileThumbnail = ({ file, size = 60 }) => {
+  const isImage = file.fileType === FILE_TYPEs.image;
+  const FileIcon = getFileIcon(file.fileType || "");
+  return /* @__PURE__ */ jsx(
+    default2,
+    {
+      sx: {
+        width: size,
+        height: size,
+        minWidth: size,
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        bgcolor: "transparent",
+        borderRadius: 1,
+        overflow: "hidden"
+      },
+      children: isImage && file.blobUrl ? /* @__PURE__ */ jsx(
+        default2,
+        {
+          component: "img",
+          src: file.blobUrl,
+          alt: file.filename,
+          sx: { width: "100%", height: "100%", objectFit: "cover" }
+        }
+      ) : /* @__PURE__ */ jsx(FileIcon, { fontSize: size >= 60 ? "large" : "medium", color: "action" })
+    }
+  );
+};
+var DisplayFile = ({
+  file,
+  onDelete,
+  mode = "thumbnail"
+}) => {
+  return /* @__PURE__ */ jsxs(default2, { sx: {
+    display: "flex",
+    alignItems: "center",
+    gap: 1,
+    p: 1,
+    border: "1px solid",
+    borderColor: "divider",
+    borderRadius: 1,
+    width: mode === "thumbnail" ? "fit-content" : "100%",
+    maxWidth: "100%",
+    position: "relative"
+  }, children: [
+    /* @__PURE__ */ jsx(FileThumbnail, { file }),
+    /* @__PURE__ */ jsxs(default2, { sx: { flex: 1, overflow: "hidden" }, children: [
+      /* @__PURE__ */ jsx(default3, { variant: "body2", noWrap: true, sx: { maxWidth: 150 }, children: file.filename }),
+      /* @__PURE__ */ jsx(default3, { variant: "caption", color: "text.secondary", children: file.displaySize })
+    ] }),
+    onDelete && /* @__PURE__ */ jsx(
+      IconButton_default,
+      {
+        size: "small",
+        onClick: () => onDelete(file),
+        sx: { ml: "auto" },
+        children: /* @__PURE__ */ jsx(default13, { fontSize: "small" })
+      }
+    )
+  ] });
+};
+DisplayFile.DISPLAY_MODEs = {
+  thumbnail: "thumbnail",
+  name: "name"
+};
+var DisplayFile_default = DisplayFile;
+
+export {
+  PreviewableFile,
+  displayFileSize,
+  getFileIcon,
+  FileThumbnail,
+  DisplayFile_default
+};
+//# sourceMappingURL=chunk-AAH2O24U.mjs.map

package/dist/chunk-AAH2O24U.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/_utils/_func/downloadFile.ts","../src/_utils/_const/file.ts","../src/_utils/classes/PreviewableFile.ts","../src/components/compound/DisplayFile/src/DisplayFile.tsx"],"sourcesContent":["import { fileTypeFromBuffer } from 'file-type';\n\n/**\n * download file from url and return blob url\n * @param url\n * @param fetchOptions\n */\nexport async function downloadFile(url: string, fetchOptions?: RequestInit) {\n  const res = await fetch(url, fetchOptions);\n  const blob = await res.blob();\n  const buffer = await blob.arrayBuffer();\n\n  // application/octet-stream make it hard to detect\n  // so we use buffer to detect the mime type\n  const fType = await fileTypeFromBuffer(buffer);\n\n  const data = {\n    blobUrl: URL.createObjectURL(blob),\n    size: blob.size,\n    mimeType: fType?.mime || blob.type, // use file-type to get the mime type\n  };\n\n  const nonImgRes = {\n    ...data,\n    dimensions: {\n      width: 0,\n      height: 0,\n    },\n  };\n  // if file is an image\n  try {\n    if (data.mimeType.includes('image/')) {\n      const dimensions = await handleImageDownload(data.blobUrl);\n      // check the mime type\n      return {\n        ...data,\n        dimensions: dimensions,\n      };\n    } else {\n      return nonImgRes;\n    }\n\n  } catch (err) {\n    // if there is an error, it might not be an image or the image failed to load\n    console.warn('Failed to handle image download:', err);\n    return nonImgRes;\n  }\n}\n\n/**\n * handle image download\n * @param blobUrl \n * @returns \n */\nasync function handleImageDownload(blobUrl: string) {\n  // Create an Image object to load the image\n  const img = new Image();\n  img.src = blobUrl;\n\n  // Wait for the image to load to access its dimensions\n  await new Promise((resolve, reject) => {\n    img.onload = resolve;\n    img.onerror = reject;\n  });\n  const metaData = {\n    width: img.width,\n    height: img.height,\n  };\n\n  // clear the img from memory\n  img.remove();\n\n  return metaData;\n}\n","import { ValueOf } from '../_types';\n\nexport const FILE_STATUSs = {\n  // local status\n  uploadingToLocal:\"local-uploading\",\n  uploadedToLocal:\"local-uploaded\",\n  localError:\"local-error\",\n\n  \n  pending:\"pending\",\n  // upload s3\n  uploadPending:'upload-pending',\n  gettingSignedURL:'upload-gettingSignedURL',\n  beginUploadToS3:'upload-beginUploadToS3',\n  uploadedToCloud:'upload-uploadedToCloud',\n  error:'upload-error',\n  // download\n  downloadPending:'download-pending',\n  downloading:'download-in-progress',\n  downloaded:'download-completed',\n  downloadError:'download-error',\n} as const\n\nexport const FILE_TYPEs = {\n  image:\"image\",\n  video:\"video\",\n  audio:\"audio\",\n  pdf:\"pdf\",\n  doc:\"doc\",\n  xls:\"xls\",\n  ppt:\"ppt\",\n  txt:\"txt\",\n  zip:\"zip\",\n  json:\"json\",\n  other:\"other\",\n} as const\n\nexport const MAX_FILE_NAME_LENGTH = 100\n\nexport type FileStatusType = ValueOf<typeof FILE_STATUSs>;\nexport type FileType = ValueOf<typeof FILE_TYPEs>;\n\nexport type Attachment = {\n  url: string;\n  keyPath: string;\n  filename: string;\n  fileType: string;\n  hostname: string;\n}\n","import { downloadFile } from \"../_func/downloadFile\";\nimport { type FileStatusType, type FileType, FILE_STATUSs, FILE_TYPEs, type Attachment } from \"../_const/file\";\n\nexport { FILE_TYPEs, FILE_STATUSs };\n\ninterface PreviewableFileProps {\n  path?: string;\n  blobUrl?: string;\n  filename?: string;\n  randomName?: string;\n  fileType?: string;\n  mimeType?: Blob[\"type\"];\n  size?: number;\n  displaySize?: string;\n  url?: string;\n  fetchOptions?: object;\n  putUrl?: string;\n  getUrl?: string;\n  status?: FileStatusType;\n  revokeable?: boolean;\n  imageProps?:{\n    width: number;\n    height: number;\n  };\n}\n\nexport default class PreviewableFile {\n  path: NonNullable<PreviewableFileProps[\"path\"]>;\n  blobUrl: NonNullable<PreviewableFileProps[\"blobUrl\"]>;\n  filename: NonNullable<PreviewableFileProps[\"filename\"]>;\n  randomName: NonNullable<PreviewableFileProps[\"randomName\"]>;\n  fileType: NonNullable<PreviewableFileProps[\"fileType\"]>;\n  mimeType: NonNullable<PreviewableFileProps[\"mimeType\"]>;\n  size: NonNullable<PreviewableFileProps[\"size\"]>;\n  displaySize: NonNullable<PreviewableFileProps[\"displaySize\"]>;\n  url: NonNullable<PreviewableFileProps[\"url\"]>;\n  fetchOptions: NonNullable<PreviewableFileProps[\"fetchOptions\"]>;\n  putUrl: NonNullable<PreviewableFileProps[\"putUrl\"]>;\n  getUrl: NonNullable<PreviewableFileProps[\"getUrl\"]>;\n  status: NonNullable<PreviewableFileProps[\"status\"]>;\n  revokeable: NonNullable<PreviewableFileProps[\"revokeable\"]>;\n  imageProps: NonNullable<PreviewableFileProps[\"imageProps\"]>;\n\n  constructor(props: PreviewableFileProps = {}) {    \n    this.path = props.path ?? \"\"\n    this.blobUrl = props.blobUrl ?? \"\"\n    this.filename = props.filename ?? \"\"\n    this.randomName = props.randomName ?? \"\"\n    this.fileType = (props.fileType ?? getFileType(props.mimeType ?? \"\")) as FileType\n    this.mimeType = props.mimeType ?? \"\"\n    this.size = props.size ?? 0\n    this.displaySize = props.displaySize ?? displayFileSize(props.size ?? 0)\n\n    this.url = props.url ?? \"\"\n    this.fetchOptions = props.fetchOptions ?? {}\n    this.putUrl = props.putUrl ?? \"\"\n    this.getUrl = props.getUrl ?? \"\"\n\n    this.status = props.status ?? FILE_STATUSs.pending\n    this.revokeable = props.revokeable ?? true\n    this.imageProps = props.imageProps ?? {\n      width: 0,\n      height: 0,\n    }\n\n    Object.preventExtensions(this)\n  }\n\n  toPlainObj(){\n    return {\n      ...this\n    }\n  }\n\n  updateFile(file: PreviewableFile | undefined){\n    if(!file) return\n\n    this.path = file.path\n    this.blobUrl = file.blobUrl\n    this.filename = file.filename\n    this.randomName = file.randomName\n    this.fileType = file.fileType\n    this.size = file.size\n    this.displaySize = file.displaySize\n\n    this.url = file.url\n    this.fetchOptions = file.fetchOptions\n    this.putUrl = file.putUrl\n    this.getUrl = file.getUrl\n\n    this.status = file.status\n    this.revokeable = file.revokeable\n\n    this.imageProps = file.imageProps\n  }\n  updateStatus(status: FileStatusType){\n    this.status = status\n  }\n  async downloadFile(){\n    // if dont have url, return\n    if(!this.url) return this\n    // use the current url to download the file\n    try{\n      const res = await downloadFile(this.url, this.fetchOptions)\n      // update the file\n\n      // ensure `url` points to the usable blob URL returned from the download\n      // (fixes cases where `this.url` was an ephemeral/revoked object URL)\n      this.url = res.blobUrl\n      this.path = res.blobUrl\n      this.status = FILE_STATUSs.downloaded\n      this.blobUrl = res.blobUrl\n      this.fileType = getFileType(res.mimeType)\n      this.mimeType = res.mimeType\n      this.size = res.size\n      this.displaySize = displayFileSize(res.size)\n      this.imageProps = res.dimensions\n\n      return this\n    }catch(err){\n      console.log(err)\n      return this\n    }\n  }\n\n  _displayFileSize(){\n    return displayFileSize(this.size)\n  }\n\n  getUploadFormat():Attachment{\n    return {\n      url: this.putUrl,\n      keyPath: this.putUrl,\n      filename: this.filename,\n      fileType: this.mimeType,\n      hostname: \"\",\n    }\n  }\n}\n\nexport function displayFileSize(size: number): string {\n  const units = ['B', 'KB', 'MB', 'GB', 'TB'];\n\n  // Determine the appropriate unit index\n  let unitIndex = 0;\n  while (size >= 1024 && unitIndex < units.length - 1) {\n    size /= 1024;\n    unitIndex++;\n  }\n\n  // Format the file size with the unit\n  // 2 decimal places\n  const sizeWithUnit = size.toFixed(2) + ' ' + units[unitIndex];\n\n  return `[${sizeWithUnit}]`;\n}\n\n/**\n * get the file type based on the mime type\n */\nfunction getFileType(mimeType:Blob[\"type\"]): FileType {\n  const types = Object.values(FILE_TYPEs) as FileType[];\n  \n  // 1. Check if the type is explicitly defined in the start (e.g. image/jpeg -> image)\n  const [type] = mimeType.split('/');\n  if(types.includes(type as FileType)){\n    return type as FileType;\n  }\n\n  // 2. Check if the type is included in the mime type (e.g. application/pdf -> pdf)\n  const found = types.find((t) => mimeType.includes(t) && t !== FILE_TYPEs.other);\n  if(found){\n    return found;\n  }\n\n  return FILE_TYPEs.other;\n}\n","// src/components/compound/DisplayFile/src/DisplayFile.tsx\nimport React from 'react';\nimport { Box } from '@/ele/Box';\nimport { Typography } from '@/ele/Typography';\nimport { IconButton } from '@/ele/Button';\nimport {\n  CloseIcon,\n  DescriptionIcon,\n  PictureAsPdfIcon,\n  ImageIcon,\n  AudioFileIcon,\n  VideoFileIcon,\n  TableChartIcon,\n  FolderZipIcon,\n  DataObjectIcon,\n  InsertDriveFileIcon,\n} from '@/icons/MuiIcon';\n\nimport PreviewableFile, { FILE_TYPEs } from '@/_utils/classes/PreviewableFile';\n\nexport interface DisplayFileProps {\n    file: PreviewableFile;\n    onDelete?: (file: PreviewableFile) => void;\n    mode?: 'thumbnail' | 'name';\n}\n\nexport const getFileIcon = (fileType: string) => {\n    switch (fileType) {\n        case FILE_TYPEs.image: return ImageIcon;\n        case FILE_TYPEs.pdf: return PictureAsPdfIcon;\n        case FILE_TYPEs.audio: return AudioFileIcon;\n        case FILE_TYPEs.video: return VideoFileIcon;\n        case FILE_TYPEs.xls: return TableChartIcon;\n        case FILE_TYPEs.zip: return FolderZipIcon;\n        case FILE_TYPEs.json: return DataObjectIcon;\n\n        case FILE_TYPEs.ppt:\n        case FILE_TYPEs.doc: \n        case FILE_TYPEs.txt: \n            return DescriptionIcon;\n        default: return InsertDriveFileIcon;\n    }\n};\n\nexport const FileThumbnail: React.FC<{ file: PreviewableFile; size?: number }> = ({ file, size = 60 }) => {\n    const isImage = file.fileType === FILE_TYPEs.image;\n    const FileIcon = getFileIcon(file.fileType || '');\n\n    return (\n        <Box\n            sx={{\n                width: size,\n                height: size,\n                minWidth: size,\n                display: 'flex',\n                alignItems: 'center',\n                justifyContent: 'center',\n                bgcolor: 'transparent',\n                borderRadius: 1,\n                overflow: 'hidden'\n            }}\n        >\n            {isImage && file.blobUrl ? (\n                <Box\n                    component=\"img\"\n                    src={file.blobUrl}\n                    alt={file.filename}\n                    sx={{ width: '100%', height: '100%', objectFit: 'cover' }}\n                />\n            ) : (\n                <FileIcon fontSize={size >= 60 ? \"large\" : \"medium\"} color=\"action\" />\n            )}\n        </Box>\n    );\n};\n\nconst DisplayFile: React.FC<DisplayFileProps> & { DISPLAY_MODEs: { thumbnail: 'thumbnail'; name: 'name' } } = ({\n    file,\n    onDelete,\n    mode = 'thumbnail'\n}) => {\n    return (\n        <Box sx={{\n            display: 'flex',\n            alignItems: 'center',\n            gap: 1,\n            p: 1,\n            border: '1px solid',\n            borderColor: 'divider',\n            borderRadius: 1,\n            width: mode === 'thumbnail' ? 'fit-content' : '100%',\n            maxWidth: '100%',\n            position: 'relative',\n        }}>\n            <FileThumbnail file={file} />\n            \n            <Box sx={{ flex: 1, overflow: 'hidden' }}>\n                <Typography variant=\"body2\" noWrap sx={{ maxWidth: 150 }}>\n                    {file.filename}\n                </Typography>\n                <Typography variant=\"caption\" color=\"text.secondary\">\n                    {file.displaySize}\n                </Typography>\n            </Box>\n\n            {onDelete && (\n                <IconButton \n                    size=\"small\" \n                    onClick={() => onDelete(file)}\n                    sx={{ ml: 'auto' }}\n                >\n                    <CloseIcon fontSize=\"small\" />\n                </IconButton>\n            )}\n        </Box>\n    );\n};\n\nDisplayFile.DISPLAY_MODEs = {\n    thumbnail: 'thumbnail',\n    name: 'name'\n};\n\nexport default DisplayFile;\n"],"mappings":"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","names":["default"]}

package/dist/chunk-B7DAB22K.mjs

@@ -0,0 +1,16 @@
+// src/components/elemental/Collapse/src/Collapse/index.ts
+import { default as default2 } from "@mui/material/Collapse";
+
+// src/components/elemental/Collapse/src/Collapse/theme.tsx
+var collapseTheme = {
+  defaultProps: {},
+  styleOverrides: {
+    root: {}
+  }
+};
+
+export {
+  collapseTheme,
+  default2 as default
+};
+//# sourceMappingURL=chunk-B7DAB22K.mjs.map