@umodeapporg/ui 0.1.0

package/dist/components/UI/Toast.js

@@ -0,0 +1,81 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect } from "react";
+import classNames from "classnames";
+import { useTranslation } from "react-i18next";
+import { toast, Slide, ToastContainer } from "react-toastify";
+import ControlledButton from "../Form/ControlledButton.js";
+import { MaterialSymbol } from "./MaterialSymbol/index.js";
+/* empty css                     */
+const TOAST_ICONS = {
+  success: "check_circle",
+  error: "error",
+  warning: "warning",
+  info: "info",
+  default: "check_circle"
+};
+const ToastIcon = ({ type }) => /* @__PURE__ */ jsx("div", { className: "toast-custom-icon", children: /* @__PURE__ */ jsx(MaterialSymbol, { icon: TOAST_ICONS[type], size: 20, className: "text-inherit" }) });
+const Toast = ({
+  message,
+  type,
+  onClose,
+  onAction,
+  useAction = false,
+  actionLabel,
+  timeout = 5e3,
+  position = "bottom-center",
+  theme = "light",
+  label
+}) => {
+  const { t } = useTranslation("ui");
+  const Msg = ({ message: message2 }) => {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: classNames("msg-container zIndexMax flex w-full items-center justify-between gap-3", {
+          "text-sm": message2.length > 100,
+          "text-base": message2.length <= 100
+        }),
+        children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: classNames("msg-title flex-1", {
+                "max-w-[70%]": useAction || label
+              }),
+              children: message2
+            }
+          ),
+          label && /* @__PURE__ */ jsx("span", { className: "font-semibold", children: label }),
+          useAction && onAction && /* @__PURE__ */ jsx(
+            ControlledButton,
+            {
+              defaultHtmlButton: true,
+              onClick: () => onAction(true),
+              className: "shrink-0 font-semibold underline",
+              children: actionLabel || t("toast.learnMore")
+            }
+          )
+        ]
+      }
+    );
+  };
+  useEffect(() => {
+    toast(/* @__PURE__ */ jsx(Msg, { message }), {
+      type,
+      position,
+      theme,
+      autoClose: timeout,
+      onClose: () => onClose(),
+      hideProgressBar: false,
+      closeOnClick: false,
+      pauseOnHover: true,
+      transition: Slide,
+      icon: /* @__PURE__ */ jsx(ToastIcon, { type })
+    });
+  }, []);
+  return /* @__PURE__ */ jsx(ToastContainer, {});
+};
+export {
+  Toast as default
+};
+//# sourceMappingURL=Toast.js.map

package/dist/components/UI/Toast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.js","sources":["../../../src/components/UI/Toast.tsx"],"sourcesContent":["import { useEffect } from 'react';\nimport classNames from 'classnames';\nimport { useTranslation } from 'react-i18next';\nimport { Slide, Theme, toast, ToastContainer, ToastPosition, TypeOptions } from 'react-toastify';\n\nimport ControlledButton from '../Form/ControlledButton';\n\nimport { MaterialSymbol } from './MaterialSymbol';\n\nimport '../../styles/toast.css';\n\ninterface IToastProps {\n  message: string;\n  type: TypeOptions;\n  onClose: () => void;\n  onAction?: (value: boolean) => void;\n  useAction?: boolean;\n  /** Rótulo do botão de ação. Sem ele o botão usa \"Saiba mais\". */\n  actionLabel?: string;\n  timeout?: number;\n  position?: ToastPosition;\n  theme?: Theme;\n  label?: string;\n}\n\nconst TOAST_ICONS: Record<TypeOptions, 'check_circle' | 'error' | 'warning' | 'info'> = {\n  success: 'check_circle',\n  error: 'error',\n  warning: 'warning',\n  info: 'info',\n  default: 'check_circle',\n};\n\nconst ToastIcon: React.FC<{ type: TypeOptions }> = ({ type }) => (\n  <div className=\"toast-custom-icon\">\n    <MaterialSymbol icon={TOAST_ICONS[type]} size={20} className=\"text-inherit\" />\n  </div>\n);\n\nconst Toast: React.FC<IToastProps> = ({\n  message,\n  type,\n  onClose,\n  onAction,\n  useAction = false,\n  actionLabel,\n  timeout = 5000,\n  position = 'bottom-center',\n  theme = 'light',\n  label,\n}) => {\n  const { t } = useTranslation('ui');\n  const Msg = ({ message }: { message: string }) => {\n    return (\n      <div\n        className={classNames('msg-container zIndexMax flex w-full items-center justify-between gap-3', {\n          'text-sm': message.length > 100,\n          'text-base': message.length <= 100,\n        })}\n      >\n        <span\n          className={classNames('msg-title flex-1', {\n            'max-w-[70%]': useAction || label,\n          })}\n        >\n          {message}\n        </span>\n        {label && <span className=\"font-semibold\">{label}</span>}\n        {useAction && onAction && (\n          <ControlledButton\n            defaultHtmlButton\n            onClick={() => onAction(true)}\n            className=\"shrink-0 font-semibold underline\"\n          >\n            {actionLabel || t('toast.learnMore')}\n          </ControlledButton>\n        )}\n      </div>\n    );\n  };\n\n  // const dimiss = () => {\n  //   toast.dismiss();\n  // };\n\n  useEffect(() => {\n    toast(<Msg message={message} />, {\n      type,\n      position,\n      theme,\n      autoClose: timeout,\n      onClose: () => onClose(),\n      hideProgressBar: false,\n      closeOnClick: false,\n      pauseOnHover: true,\n      transition: Slide,\n      icon: <ToastIcon type={type} />,\n    });\n  }, []);\n\n  return <ToastContainer />;\n};\n\nexport default Toast;\n"],"names":["message"],"mappings":";;;;;;;;AAyBA,MAAM,cAAkF;AAAA,EACtF,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,MAAM;AAAA,EACN,SAAS;AACX;AAEA,MAAM,YAA6C,CAAC,EAAE,WACpD,oBAAC,SAAI,WAAU,qBACb,8BAAC,gBAAA,EAAe,MAAM,YAAY,IAAI,GAAG,MAAM,IAAI,WAAU,gBAAe,GAC9E;AAGF,MAAM,QAA+B,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA,UAAU;AAAA,EACV,WAAW;AAAA,EACX,QAAQ;AAAA,EACR;AACF,MAAM;AACJ,QAAM,EAAE,EAAA,IAAM,eAAe,IAAI;AACjC,QAAM,MAAM,CAAC,EAAE,SAAAA,eAAmC;AAChD,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,WAAW,0EAA0E;AAAA,UAC9F,WAAWA,SAAQ,SAAS;AAAA,UAC5B,aAAaA,SAAQ,UAAU;AAAA,QAAA,CAChC;AAAA,QAED,UAAA;AAAA,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,WAAW,oBAAoB;AAAA,gBACxC,eAAe,aAAa;AAAA,cAAA,CAC7B;AAAA,cAEA,UAAAA;AAAAA,YAAA;AAAA,UAAA;AAAA,UAEF,SAAS,oBAAC,QAAA,EAAK,WAAU,iBAAiB,UAAA,OAAM;AAAA,UAChD,aAAa,YACZ;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,mBAAiB;AAAA,cACjB,SAAS,MAAM,SAAS,IAAI;AAAA,cAC5B,WAAU;AAAA,cAET,UAAA,eAAe,EAAE,iBAAiB;AAAA,YAAA;AAAA,UAAA;AAAA,QACrC;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AAMA,YAAU,MAAM;AACd,UAAM,oBAAC,KAAA,EAAI,QAAA,CAAkB,GAAI;AAAA,MAC/B;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX,SAAS,MAAM,QAAA;AAAA,MACf,iBAAiB;AAAA,MACjB,cAAc;AAAA,MACd,cAAc;AAAA,MACd,YAAY;AAAA,MACZ,MAAM,oBAAC,WAAA,EAAU,KAAA,CAAY;AAAA,IAAA,CAC9B;AAAA,EACH,GAAG,CAAA,CAAE;AAEL,6BAAQ,gBAAA,EAAe;AACzB;"}

package/dist/components/UI/ToastHost.d.ts

@@ -0,0 +1,2 @@
+declare const ToastHost: () => import("react").JSX.Element | null;
+export default ToastHost;

package/dist/components/UI/ToastHost.js

@@ -0,0 +1,25 @@
+import { jsx } from "react/jsx-runtime";
+import { useNotificationStore } from "../../hooks/useNotification.js";
+import Toast from "./Toast.js";
+const ToastHost = () => {
+  const notification = useNotificationStore((s) => s.notification);
+  const closeNotify = useNotificationStore((s) => s.closeNotify);
+  if (!notification) return null;
+  return /* @__PURE__ */ jsx(
+    Toast,
+    {
+      timeout: notification.timeout,
+      message: notification.message,
+      type: notification.type,
+      onClose: closeNotify,
+      useAction: notification.useAction,
+      onAction: notification.onAction,
+      actionLabel: notification.actionLabel
+    },
+    notification.message
+  );
+};
+export {
+  ToastHost as default
+};
+//# sourceMappingURL=ToastHost.js.map

package/dist/components/UI/ToastHost.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastHost.js","sources":["../../../src/components/UI/ToastHost.tsx"],"sourcesContent":["import { useNotificationStore } from '@/hooks/useNotification';\n\nimport Toast from './Toast';\n\nconst ToastHost = () => {\n  const notification = useNotificationStore((s) => s.notification);\n  const closeNotify = useNotificationStore((s) => s.closeNotify);\n\n  if (!notification) return null;\n\n  return (\n    <Toast\n      key={notification.message}\n      timeout={notification.timeout}\n      message={notification.message}\n      type={notification.type}\n      onClose={closeNotify}\n      useAction={notification.useAction}\n      onAction={notification.onAction}\n      actionLabel={notification.actionLabel}\n    />\n  );\n};\n\nexport default ToastHost;\n"],"names":[],"mappings":";;;AAIA,MAAM,YAAY,MAAM;AACtB,QAAM,eAAe,qBAAqB,CAAC,MAAM,EAAE,YAAY;AAC/D,QAAM,cAAc,qBAAqB,CAAC,MAAM,EAAE,WAAW;AAE7D,MAAI,CAAC,aAAc,QAAO;AAE1B,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MAEC,SAAS,aAAa;AAAA,MACtB,SAAS,aAAa;AAAA,MACtB,MAAM,aAAa;AAAA,MACnB,SAAS;AAAA,MACT,WAAW,aAAa;AAAA,MACxB,UAAU,aAAa;AAAA,MACvB,aAAa,aAAa;AAAA,IAAA;AAAA,IAPrB,aAAa;AAAA,EAAA;AAUxB;"}

package/dist/components/UI/TypingEffect.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+interface ITypingEffectProps {
+    text: string;
+    useHtml?: boolean;
+    useMarkdown?: boolean;
+    className?: string;
+    typingSpeed?: number;
+}
+declare const TypingEffect: FC<ITypingEffectProps>;
+export default TypingEffect;

package/dist/components/UI/TypingEffect.js

@@ -0,0 +1,31 @@
+import { jsx } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import remarkGfm from "remark-gfm";
+import LazyMarkdown from "./LazyMarkdown.js";
+const TypingEffect = ({ text, useHtml, useMarkdown, className, typingSpeed = 10 }) => {
+  const [displayedContent, setDisplayedContent] = useState("");
+  useEffect(() => {
+    const content = useMarkdown ? text : text.trim();
+    setDisplayedContent("");
+    let index = 0;
+    const timer = setInterval(() => {
+      if (index < content.length) {
+        setDisplayedContent(content.slice(0, index + 1));
+        index++;
+      } else {
+        clearInterval(timer);
+      }
+    }, typingSpeed);
+    return () => {
+      clearInterval(timer);
+    };
+  }, [text, typingSpeed, useMarkdown]);
+  if (useMarkdown) {
+    return /* @__PURE__ */ jsx(LazyMarkdown, { remarkPlugins: [remarkGfm], children: displayedContent });
+  }
+  return useHtml ? /* @__PURE__ */ jsx("div", { className, dangerouslySetInnerHTML: { __html: displayedContent } }) : /* @__PURE__ */ jsx("p", { className, children: displayedContent });
+};
+export {
+  TypingEffect as default
+};
+//# sourceMappingURL=TypingEffect.js.map

package/dist/components/UI/TypingEffect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TypingEffect.js","sources":["../../../src/components/UI/TypingEffect.tsx"],"sourcesContent":["import { FC, useEffect, useState } from 'react';\nimport remarkGfm from 'remark-gfm';\n\nimport LazyMarkdown from './LazyMarkdown';\n\ninterface ITypingEffectProps {\n  text: string;\n  useHtml?: boolean;\n  useMarkdown?: boolean;\n  className?: string;\n  typingSpeed?: number;\n}\n\nconst TypingEffect: FC<ITypingEffectProps> = ({ text, useHtml, useMarkdown, className, typingSpeed = 10 }) => {\n  const [displayedContent, setDisplayedContent] = useState<string>('');\n\n  useEffect(() => {\n    const content = useMarkdown ? text : text.trim();\n\n    setDisplayedContent('');\n\n    let index = 0;\n    const timer = setInterval(() => {\n      if (index < content.length) {\n        setDisplayedContent(content.slice(0, index + 1));\n        index++;\n      } else {\n        clearInterval(timer);\n      }\n    }, typingSpeed);\n\n    return () => {\n      clearInterval(timer);\n    };\n  }, [text, typingSpeed, useMarkdown]);\n\n  if (useMarkdown) {\n    return <LazyMarkdown remarkPlugins={[remarkGfm]}>{displayedContent}</LazyMarkdown>;\n  }\n\n  return useHtml ? (\n    <div className={className} dangerouslySetInnerHTML={{ __html: displayedContent }} />\n  ) : (\n    <p className={className}>{displayedContent}</p>\n  );\n};\n\nexport default TypingEffect;\n"],"names":[],"mappings":";;;;AAaA,MAAM,eAAuC,CAAC,EAAE,MAAM,SAAS,aAAa,WAAW,cAAc,SAAS;AAC5G,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAiB,EAAE;AAEnE,YAAU,MAAM;AACd,UAAM,UAAU,cAAc,OAAO,KAAK,KAAA;AAE1C,wBAAoB,EAAE;AAEtB,QAAI,QAAQ;AACZ,UAAM,QAAQ,YAAY,MAAM;AAC9B,UAAI,QAAQ,QAAQ,QAAQ;AAC1B,4BAAoB,QAAQ,MAAM,GAAG,QAAQ,CAAC,CAAC;AAC/C;AAAA,MACF,OAAO;AACL,sBAAc,KAAK;AAAA,MACrB;AAAA,IACF,GAAG,WAAW;AAEd,WAAO,MAAM;AACX,oBAAc,KAAK;AAAA,IACrB;AAAA,EACF,GAAG,CAAC,MAAM,aAAa,WAAW,CAAC;AAEnC,MAAI,aAAa;AACf,+BAAQ,cAAA,EAAa,eAAe,CAAC,SAAS,GAAI,UAAA,kBAAiB;AAAA,EACrE;AAEA,SAAO,UACL,oBAAC,OAAA,EAAI,WAAsB,yBAAyB,EAAE,QAAQ,iBAAA,EAAiB,CAAG,IAElF,oBAAC,KAAA,EAAE,WAAuB,UAAA,kBAAiB;AAE/C;"}

package/dist/components/UI/UmodeLogo.d.ts

@@ -0,0 +1,10 @@
+interface IUmodeLogoProps {
+    className?: string;
+}
+/**
+ * Inline instead of an <img> so the mark inherits `currentColor`: the host names a text token
+ * and the logo follows the theme by itself, with no second asset and no swap on toggle. The
+ * fade in the symbol is the same colour going to zero opacity, so it survives any ink.
+ */
+declare const UmodeLogo: React.FC<IUmodeLogoProps>;
+export default UmodeLogo;

package/dist/components/UI/UmodeLogo.js

@@ -0,0 +1,128 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useId } from "react";
+import classNames from "classnames";
+const UmodeLogo = ({ className }) => {
+  const instanceId = useId().replace(/[^a-zA-Z0-9]/g, "");
+  const fadeId = (index) => `umode-logo-fade-${index}-${instanceId}`;
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      viewBox: "0 0 624.4 116.2",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": true,
+      focusable: "false",
+      className: classNames("h-5 w-auto", className),
+      children: [
+        /* @__PURE__ */ jsxs("defs", { children: [
+          /* @__PURE__ */ jsxs(
+            "linearGradient",
+            {
+              id: fadeId(1),
+              gradientUnits: "userSpaceOnUse",
+              x1: "57.5777",
+              y1: "112.6504",
+              x2: "57.5777",
+              y2: "7.5835",
+              children: [
+                /* @__PURE__ */ jsx("stop", { offset: "0", stopColor: "currentColor" }),
+                /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "currentColor", stopOpacity: "0" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "linearGradient",
+            {
+              id: fadeId(2),
+              gradientUnits: "userSpaceOnUse",
+              x1: "1144.3041",
+              y1: "-492.217",
+              x2: "1144.3041",
+              y2: "-597.7056",
+              gradientTransform: "matrix(-1 0 0 -1 1248.4246 -485.0552)",
+              children: [
+                /* @__PURE__ */ jsx("stop", { offset: "0", stopColor: "currentColor" }),
+                /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "currentColor", stopOpacity: "0" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "linearGradient",
+            {
+              id: fadeId(3),
+              gradientUnits: "userSpaceOnUse",
+              x1: "1096.2793",
+              y1: "-492.217",
+              x2: "1096.2793",
+              y2: "-597.7056",
+              gradientTransform: "matrix(-1 0 0 -1 1248.4246 -485.0552)",
+              children: [
+                /* @__PURE__ */ jsx("stop", { offset: "0", stopColor: "currentColor" }),
+                /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "currentColor", stopOpacity: "0" })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: `url(#${fadeId(1)})`,
+            d: "M58.4,112.7h-1.6C28.2,112.7,5,89.5,5,60.9V7.6h105.1v53.3C110.1,89.5,86.9,112.7,58.4,112.7z"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: `url(#${fadeId(2)})`,
+            d: "M103.4,7.2h1.4 c28.6,0,51.9,23.2,51.9,51.9v53.6H51.6V59C51.6,30.4,74.8,7.2,103.4,7.2z"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: `url(#${fadeId(3)})`,
+            d: "M151.5,7.2h1.4 c28.6,0,51.9,23.2,51.9,51.9v53.6H99.6V59C99.6,30.4,122.8,7.2,151.5,7.2z"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M293.5,95l-0.1-12.5h-0.3c-4.4,8.9-12.7,13.8-24.2,13.8c-16.3,0-26.3-10.5-26.3-27.7V33.2h6.8v34.8 c0,13.9,7.8,22.3,20.7,22.3c13.8,0,22.6-9.8,22.6-25.5V33.2h6.8V95H293.5z"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M409.6,59v36h-6.8V59.6c0-14.1-6.2-21.6-18.3-21.6c-12.9,0-20,8.8-20,24.8V95h-6.8V59.6 c0-14.1-6.4-21.6-18.3-21.6c-12.9,0-19.9,8.8-19.9,24.6V95h-6.8V33.2h6l0.1,10.9h0.3c3.8-7.8,11.3-12.2,21.6-12.2 c10.8,0,18.2,5.2,21.5,14.6h0.3c3.7-9.6,11.3-14.6,23.2-14.6C401.2,31.8,409.6,41.5,409.6,59z"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M482.1,64.1c0,19-13.5,32.3-32.7,32.3c-19,0-32.5-13.3-32.5-32.3c0-18.8,13.5-32.3,32.5-32.3 C468.5,31.8,482.1,45.2,482.1,64.1z M423.8,64.1c0,15.4,10.8,26.1,25.6,26.1c15,0,25.8-10.8,25.8-26.1s-10.8-26.2-25.8-26.2 C434.6,37.9,423.8,48.7,423.8,64.1z"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M545.7,95l-0.1-12.7h-0.3c-4.9,8.8-14.3,14.1-26.7,14.1c-18.5,0-31.7-13.4-31.7-32.3s13.3-32.3,31.7-32.3 c11.9,0,21.1,5,26,13.1h0.3V2.1h6.8V95H545.7z M545.3,64.1c0-15.4-10.8-26.2-25.9-26.2c-14.9,0-25.6,10.8-25.6,26.2 s10.8,26.1,25.6,26.1C534.5,90.2,545.3,79.5,545.3,64.1z"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: "currentColor",
+            d: "M567.6,65.8c0.8,15,11.7,24.4,28.5,24.4c9.6,0,17.4-3.1,23.8-9.2h0.4v7.2c-5.7,5.2-14.5,8.1-24.2,8.1 c-21.6,0-35.4-12.6-35.4-32.3c0-18.8,13.4-32.3,32.3-32.3c19.1,0,31.5,11.8,31.5,29.9v4.1H567.6z M567.6,60h50.6 c-0.8-13.3-10.6-22-25.1-22C579.2,37.9,569.3,47,567.6,60z"
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  UmodeLogo as default
+};
+//# sourceMappingURL=UmodeLogo.js.map

package/dist/components/UI/UmodeLogo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UmodeLogo.js","sources":["../../../src/components/UI/UmodeLogo.tsx"],"sourcesContent":["import { useId } from 'react';\nimport classNames from 'classnames';\n\ninterface IUmodeLogoProps {\n  className?: string;\n}\n\n/**\n * Inline instead of an <img> so the mark inherits `currentColor`: the host names a text token\n * and the logo follows the theme by itself, with no second asset and no swap on toggle. The\n * fade in the symbol is the same colour going to zero opacity, so it survives any ink.\n */\nconst UmodeLogo: React.FC<IUmodeLogoProps> = ({ className }) => {\n  const instanceId = useId().replace(/[^a-zA-Z0-9]/g, '');\n  const fadeId = (index: number) => `umode-logo-fade-${index}-${instanceId}`;\n\n  return (\n    <svg\n      viewBox=\"0 0 624.4 116.2\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      aria-hidden\n      focusable=\"false\"\n      className={classNames('h-5 w-auto', className)}\n    >\n      <defs>\n        <linearGradient\n          id={fadeId(1)}\n          gradientUnits=\"userSpaceOnUse\"\n          x1=\"57.5777\"\n          y1=\"112.6504\"\n          x2=\"57.5777\"\n          y2=\"7.5835\"\n        >\n          <stop offset=\"0\" stopColor=\"currentColor\" />\n          <stop offset=\"1\" stopColor=\"currentColor\" stopOpacity=\"0\" />\n        </linearGradient>\n        <linearGradient\n          id={fadeId(2)}\n          gradientUnits=\"userSpaceOnUse\"\n          x1=\"1144.3041\"\n          y1=\"-492.217\"\n          x2=\"1144.3041\"\n          y2=\"-597.7056\"\n          gradientTransform=\"matrix(-1 0 0 -1 1248.4246 -485.0552)\"\n        >\n          <stop offset=\"0\" stopColor=\"currentColor\" />\n          <stop offset=\"1\" stopColor=\"currentColor\" stopOpacity=\"0\" />\n        </linearGradient>\n        <linearGradient\n          id={fadeId(3)}\n          gradientUnits=\"userSpaceOnUse\"\n          x1=\"1096.2793\"\n          y1=\"-492.217\"\n          x2=\"1096.2793\"\n          y2=\"-597.7056\"\n          gradientTransform=\"matrix(-1 0 0 -1 1248.4246 -485.0552)\"\n        >\n          <stop offset=\"0\" stopColor=\"currentColor\" />\n          <stop offset=\"1\" stopColor=\"currentColor\" stopOpacity=\"0\" />\n        </linearGradient>\n      </defs>\n\n      <path\n        fill={`url(#${fadeId(1)})`}\n        d=\"M58.4,112.7h-1.6C28.2,112.7,5,89.5,5,60.9V7.6h105.1v53.3C110.1,89.5,86.9,112.7,58.4,112.7z\"\n      />\n      <path\n        fill={`url(#${fadeId(2)})`}\n        d=\"M103.4,7.2h1.4 c28.6,0,51.9,23.2,51.9,51.9v53.6H51.6V59C51.6,30.4,74.8,7.2,103.4,7.2z\"\n      />\n      <path\n        fill={`url(#${fadeId(3)})`}\n        d=\"M151.5,7.2h1.4 c28.6,0,51.9,23.2,51.9,51.9v53.6H99.6V59C99.6,30.4,122.8,7.2,151.5,7.2z\"\n      />\n      <path\n        fill=\"currentColor\"\n        d=\"M293.5,95l-0.1-12.5h-0.3c-4.4,8.9-12.7,13.8-24.2,13.8c-16.3,0-26.3-10.5-26.3-27.7V33.2h6.8v34.8 c0,13.9,7.8,22.3,20.7,22.3c13.8,0,22.6-9.8,22.6-25.5V33.2h6.8V95H293.5z\"\n      />\n      <path\n        fill=\"currentColor\"\n        d=\"M409.6,59v36h-6.8V59.6c0-14.1-6.2-21.6-18.3-21.6c-12.9,0-20,8.8-20,24.8V95h-6.8V59.6 c0-14.1-6.4-21.6-18.3-21.6c-12.9,0-19.9,8.8-19.9,24.6V95h-6.8V33.2h6l0.1,10.9h0.3c3.8-7.8,11.3-12.2,21.6-12.2 c10.8,0,18.2,5.2,21.5,14.6h0.3c3.7-9.6,11.3-14.6,23.2-14.6C401.2,31.8,409.6,41.5,409.6,59z\"\n      />\n      <path\n        fill=\"currentColor\"\n        d=\"M482.1,64.1c0,19-13.5,32.3-32.7,32.3c-19,0-32.5-13.3-32.5-32.3c0-18.8,13.5-32.3,32.5-32.3 C468.5,31.8,482.1,45.2,482.1,64.1z M423.8,64.1c0,15.4,10.8,26.1,25.6,26.1c15,0,25.8-10.8,25.8-26.1s-10.8-26.2-25.8-26.2 C434.6,37.9,423.8,48.7,423.8,64.1z\"\n      />\n      <path\n        fill=\"currentColor\"\n        d=\"M545.7,95l-0.1-12.7h-0.3c-4.9,8.8-14.3,14.1-26.7,14.1c-18.5,0-31.7-13.4-31.7-32.3s13.3-32.3,31.7-32.3 c11.9,0,21.1,5,26,13.1h0.3V2.1h6.8V95H545.7z M545.3,64.1c0-15.4-10.8-26.2-25.9-26.2c-14.9,0-25.6,10.8-25.6,26.2 s10.8,26.1,25.6,26.1C534.5,90.2,545.3,79.5,545.3,64.1z\"\n      />\n      <path\n        fill=\"currentColor\"\n        d=\"M567.6,65.8c0.8,15,11.7,24.4,28.5,24.4c9.6,0,17.4-3.1,23.8-9.2h0.4v7.2c-5.7,5.2-14.5,8.1-24.2,8.1 c-21.6,0-35.4-12.6-35.4-32.3c0-18.8,13.4-32.3,32.3-32.3c19.1,0,31.5,11.8,31.5,29.9v4.1H567.6z M567.6,60h50.6 c-0.8-13.3-10.6-22-25.1-22C579.2,37.9,569.3,47,567.6,60z\"\n      />\n    </svg>\n  );\n};\n\nexport default UmodeLogo;\n"],"names":[],"mappings":";;;AAYA,MAAM,YAAuC,CAAC,EAAE,gBAAgB;AAC9D,QAAM,aAAa,MAAA,EAAQ,QAAQ,iBAAiB,EAAE;AACtD,QAAM,SAAS,CAAC,UAAkB,mBAAmB,KAAK,IAAI,UAAU;AAExE,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,eAAW;AAAA,MACX,WAAU;AAAA,MACV,WAAW,WAAW,cAAc,SAAS;AAAA,MAE7C,UAAA;AAAA,QAAA,qBAAC,QAAA,EACC,UAAA;AAAA,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAI,OAAO,CAAC;AAAA,cACZ,eAAc;AAAA,cACd,IAAG;AAAA,cACH,IAAG;AAAA,cACH,IAAG;AAAA,cACH,IAAG;AAAA,cAEH,UAAA;AAAA,gBAAA,oBAAC,QAAA,EAAK,QAAO,KAAI,WAAU,gBAAe;AAAA,oCACzC,QAAA,EAAK,QAAO,KAAI,WAAU,gBAAe,aAAY,IAAA,CAAI;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,UAE5D;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAI,OAAO,CAAC;AAAA,cACZ,eAAc;AAAA,cACd,IAAG;AAAA,cACH,IAAG;AAAA,cACH,IAAG;AAAA,cACH,IAAG;AAAA,cACH,mBAAkB;AAAA,cAElB,UAAA;AAAA,gBAAA,oBAAC,QAAA,EAAK,QAAO,KAAI,WAAU,gBAAe;AAAA,oCACzC,QAAA,EAAK,QAAO,KAAI,WAAU,gBAAe,aAAY,IAAA,CAAI;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,UAE5D;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAI,OAAO,CAAC;AAAA,cACZ,eAAc;AAAA,cACd,IAAG;AAAA,cACH,IAAG;AAAA,cACH,IAAG;AAAA,cACH,IAAG;AAAA,cACH,mBAAkB;AAAA,cAElB,UAAA;AAAA,gBAAA,oBAAC,QAAA,EAAK,QAAO,KAAI,WAAU,gBAAe;AAAA,oCACzC,QAAA,EAAK,QAAO,KAAI,WAAU,gBAAe,aAAY,IAAA,CAAI;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QAC5D,GACF;AAAA,QAEA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAM,QAAQ,OAAO,CAAC,CAAC;AAAA,YACvB,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,QAEJ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAM,QAAQ,OAAO,CAAC,CAAC;AAAA,YACvB,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,QAEJ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAM,QAAQ,OAAO,CAAC,CAAC;AAAA,YACvB,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,QAEJ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,QAEJ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,QAEJ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,QAEJ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,QAEJ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/UI/UsersAvatar.d.ts

@@ -0,0 +1,7 @@
+interface IUsersAvatarProps {
+    className?: string;
+    size?: 'xsmall' | 'small' | 'medium' | 'large';
+    users: Array<string>;
+}
+declare const UsersAvatar: React.FC<IUsersAvatarProps>;
+export default UsersAvatar;

package/dist/components/UI/UsersAvatar.js

@@ -0,0 +1,29 @@
+import { jsx } from "react/jsx-runtime";
+import classNames from "classnames";
+import ControlledTooltip from "./ControlledTooltip.js";
+import { getUserAvatarLetters } from "../../helpers/stringHelpers.js";
+const UsersAvatar = ({ className, size = "small", users }) => {
+  const sizeClass = {
+    xsmall: "size-6",
+    small: "size-8",
+    medium: "size-10",
+    large: "size-full"
+  }[size];
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center -space-x-4", children: users.map((responsible, index) => /* @__PURE__ */ jsx(ControlledTooltip, { content: responsible, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: classNames(
+        `flex size-8 cursor-default items-center justify-center rounded-full bg-brand-soft text-base font-normal uppercase text-brand-emphasis ring-2 ring-surface`,
+        className,
+        {
+          sizeClass
+        }
+      ),
+      children: getUserAvatarLetters(String(responsible))
+    }
+  ) }, `${responsible}-${index}`)) });
+};
+export {
+  UsersAvatar as default
+};
+//# sourceMappingURL=UsersAvatar.js.map

package/dist/components/UI/UsersAvatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UsersAvatar.js","sources":["../../../src/components/UI/UsersAvatar.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport ControlledTooltip from '@/components/UI/ControlledTooltip';\nimport { getUserAvatarLetters } from '@/helpers/stringHelpers';\n\ninterface IUsersAvatarProps {\n  className?: string;\n  size?: 'xsmall' | 'small' | 'medium' | 'large';\n  users: Array<string>;\n}\n\nconst UsersAvatar: React.FC<IUsersAvatarProps> = ({ className, size = 'small', users }) => {\n  const sizeClass = {\n    xsmall: 'size-6',\n    small: 'size-8',\n    medium: 'size-10',\n    large: 'size-full',\n  }[size];\n\n  return (\n    <div className=\"flex items-center -space-x-4\">\n      {users.map((responsible, index) => (\n        <ControlledTooltip key={`${responsible}-${index}`} content={responsible}>\n          <div\n            className={classNames(\n              `flex size-8 cursor-default items-center justify-center rounded-full bg-brand-soft text-base font-normal uppercase text-brand-emphasis ring-2 ring-surface`,\n              className,\n              {\n                sizeClass,\n              },\n            )}\n          >\n            {getUserAvatarLetters(String(responsible))}\n          </div>\n        </ControlledTooltip>\n      ))}\n    </div>\n  );\n};\n\nexport default UsersAvatar;\n"],"names":[],"mappings":";;;;AAWA,MAAM,cAA2C,CAAC,EAAE,WAAW,OAAO,SAAS,YAAY;AACzF,QAAM,YAAY;AAAA,IAChB,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,OAAO;AAAA,EAAA,EACP,IAAI;AAEN,SACE,oBAAC,OAAA,EAAI,WAAU,gCACZ,UAAA,MAAM,IAAI,CAAC,aAAa,UACvB,oBAAC,mBAAA,EAAkD,SAAS,aAC1D,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,UACE;AAAA,QAAA;AAAA,MACF;AAAA,MAGD,UAAA,qBAAqB,OAAO,WAAW,CAAC;AAAA,IAAA;AAAA,EAAA,KAVrB,GAAG,WAAW,IAAI,KAAK,EAY/C,CACD,GACH;AAEJ;"}

package/dist/components/UI/access/UiAccessContext.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+/**
+ * Augment this from the host to type capabilities as its own union, without the UI layer
+ * importing the host's catalog:
+ * `declare module '<this module>' { interface IUiCapabilityRegistry extends Record<TCapability, true> {} }`
+ */
+export interface IUiCapabilityRegistry {
+}
+export type TUiCapability = keyof IUiCapabilityRegistry extends never ? string : keyof IUiCapabilityRegistry;
+export type TUiCapabilityRequirement = 'any' | 'all';
+export type TUiAccessCheck = (capabilities: TUiCapability | Array<TUiCapability>, requirement?: TUiCapabilityRequirement) => boolean;
+interface IUiAccessContextValue {
+    check: TUiAccessCheck;
+}
+interface IUiAccessProviderProps {
+    check: TUiAccessCheck;
+    children: ReactNode;
+}
+export declare const UiAccessProvider: React.FC<IUiAccessProviderProps>;
+export declare const useUiAccess: () => IUiAccessContextValue;
+export {};

package/dist/components/UI/access/UiAccessContext.js

@@ -0,0 +1,14 @@
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo } from "react";
+const allowEverything = () => true;
+const UiAccessContext = createContext({ check: allowEverything });
+const UiAccessProvider = ({ check, children }) => {
+  const value = useMemo(() => ({ check }), [check]);
+  return /* @__PURE__ */ jsx(UiAccessContext.Provider, { value, children });
+};
+const useUiAccess = () => useContext(UiAccessContext);
+export {
+  UiAccessProvider,
+  useUiAccess
+};
+//# sourceMappingURL=UiAccessContext.js.map

package/dist/components/UI/access/UiAccessContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UiAccessContext.js","sources":["../../../../src/components/UI/access/UiAccessContext.tsx"],"sourcesContent":["import { createContext, ReactNode, useContext, useMemo } from 'react';\n\n/**\n * Augment this from the host to type capabilities as its own union, without the UI layer\n * importing the host's catalog:\n * `declare module '<this module>' { interface IUiCapabilityRegistry extends Record<TCapability, true> {} }`\n */\nexport interface IUiCapabilityRegistry {}\n\nexport type TUiCapability = keyof IUiCapabilityRegistry extends never ? string : keyof IUiCapabilityRegistry;\n\nexport type TUiCapabilityRequirement = 'any' | 'all';\n\nexport type TUiAccessCheck = (\n  capabilities: TUiCapability | Array<TUiCapability>,\n  requirement?: TUiCapabilityRequirement,\n) => boolean;\n\ninterface IUiAccessContextValue {\n  check: TUiAccessCheck;\n}\n\nconst allowEverything: TUiAccessCheck = () => true;\n\nconst UiAccessContext = createContext<IUiAccessContextValue>({ check: allowEverything });\n\ninterface IUiAccessProviderProps {\n  check: TUiAccessCheck;\n  children: ReactNode;\n}\n\nexport const UiAccessProvider: React.FC<IUiAccessProviderProps> = ({ check, children }) => {\n  const value = useMemo(() => ({ check }), [check]);\n  return <UiAccessContext.Provider value={value}>{children}</UiAccessContext.Provider>;\n};\n\nexport const useUiAccess = (): IUiAccessContextValue => useContext(UiAccessContext);\n"],"names":[],"mappings":";;AAsBA,MAAM,kBAAkC,MAAM;AAE9C,MAAM,kBAAkB,cAAqC,EAAE,OAAO,iBAAiB;AAOhF,MAAM,mBAAqD,CAAC,EAAE,OAAO,eAAe;AACzF,QAAM,QAAQ,QAAQ,OAAO,EAAE,UAAU,CAAC,KAAK,CAAC;AAChD,SAAO,oBAAC,gBAAgB,UAAhB,EAAyB,OAAe,SAAA,CAAS;AAC3D;AAEO,MAAM,cAAc,MAA6B,WAAW,eAAe;"}

package/dist/components/UI/cells/ArrayCell.d.ts

@@ -0,0 +1,5 @@
+type TArrayCellProps = {
+    values: Array<string>;
+};
+declare const ArrayCell: React.FC<TArrayCellProps>;
+export default ArrayCell;

package/dist/components/UI/cells/ArrayCell.js

@@ -0,0 +1,25 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import ControlledTooltip from "../ControlledTooltip.js";
+import { capitalize } from "../../../helpers/stringHelpers.js";
+const ArrayCell = ({ values }) => {
+  const uniqueValues = Array.from(new Set(values.filter(Boolean)));
+  const totalItems = uniqueValues.length;
+  if (!totalItems) {
+    return /* @__PURE__ */ jsx("span", { children: "-" });
+  }
+  if (totalItems > 1) {
+    return /* @__PURE__ */ jsx(ControlledTooltip, { content: uniqueValues.join(", "), className: "max-w-60", children: /* @__PURE__ */ jsxs("p", { children: [
+      capitalize(uniqueValues[0]),
+      " ",
+      /* @__PURE__ */ jsxs("span", { className: "rounded-lg border-2 p-1 text-xs font-semibold", children: [
+        "+",
+        totalItems - 1
+      ] })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsx("span", { children: uniqueValues.map((value) => capitalize(value)).join(", ") });
+};
+export {
+  ArrayCell as default
+};
+//# sourceMappingURL=ArrayCell.js.map

package/dist/components/UI/cells/ArrayCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrayCell.js","sources":["../../../../src/components/UI/cells/ArrayCell.tsx"],"sourcesContent":["import ControlledTooltip from '@/components/UI/ControlledTooltip';\nimport { capitalize } from '@/helpers/stringHelpers';\n\ntype TArrayCellProps = {\n  values: Array<string>;\n};\n\nconst ArrayCell: React.FC<TArrayCellProps> = ({ values }) => {\n  const uniqueValues = Array.from(new Set(values.filter(Boolean)));\n  const totalItems = uniqueValues.length;\n\n  if (!totalItems) {\n    return <span>-</span>;\n  }\n\n  if (totalItems > 1) {\n    return (\n      <ControlledTooltip content={uniqueValues.join(', ')} className=\"max-w-60\">\n        <p>\n          {capitalize(uniqueValues[0])}{' '}\n          <span className=\"rounded-lg border-2 p-1 text-xs font-semibold\">+{totalItems - 1}</span>\n        </p>\n      </ControlledTooltip>\n    );\n  }\n\n  return <span>{uniqueValues.map((value: string) => capitalize(value)).join(', ')}</span>;\n};\n\nexport default ArrayCell;\n"],"names":[],"mappings":";;;AAOA,MAAM,YAAuC,CAAC,EAAE,aAAa;AAC3D,QAAM,eAAe,MAAM,KAAK,IAAI,IAAI,OAAO,OAAO,OAAO,CAAC,CAAC;AAC/D,QAAM,aAAa,aAAa;AAEhC,MAAI,CAAC,YAAY;AACf,WAAO,oBAAC,UAAK,UAAA,IAAA,CAAC;AAAA,EAChB;AAEA,MAAI,aAAa,GAAG;AAClB,WACE,oBAAC,mBAAA,EAAkB,SAAS,aAAa,KAAK,IAAI,GAAG,WAAU,YAC7D,UAAA,qBAAC,KAAA,EACE,UAAA;AAAA,MAAA,WAAW,aAAa,CAAC,CAAC;AAAA,MAAG;AAAA,MAC9B,qBAAC,QAAA,EAAK,WAAU,iDAAgD,UAAA;AAAA,QAAA;AAAA,QAAE,aAAa;AAAA,MAAA,EAAA,CAAE;AAAA,IAAA,EAAA,CACnF,EAAA,CACF;AAAA,EAEJ;AAEA,SAAO,oBAAC,QAAA,EAAM,UAAA,aAAa,IAAI,CAAC,UAAkB,WAAW,KAAK,CAAC,EAAE,KAAK,IAAI,EAAA,CAAE;AAClF;"}

package/dist/components/UI/cells/BooleanCell.d.ts

@@ -0,0 +1,5 @@
+interface IBooleanCellProps {
+    value: boolean;
+}
+declare const BooleanCell: React.FC<IBooleanCellProps>;
+export default BooleanCell;

package/dist/components/UI/cells/BooleanCell.js

@@ -0,0 +1,22 @@
+import { jsx } from "react/jsx-runtime";
+import classNames from "classnames";
+import { useTranslation } from "react-i18next";
+import OutlinedChip from "../Chips/OutlinedChip.js";
+const BooleanCell = ({ value }) => {
+  const { t } = useTranslation("ui");
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center gap-x-2", children: /* @__PURE__ */ jsx(
+    OutlinedChip,
+    {
+      label: value ? t("actions.yes") : t("actions.no"),
+      chipIcon: value ? "check" : "close",
+      className: classNames("text-white", {
+        "bg-success": value,
+        "bg-danger": !value
+      })
+    }
+  ) });
+};
+export {
+  BooleanCell as default
+};
+//# sourceMappingURL=BooleanCell.js.map

package/dist/components/UI/cells/BooleanCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BooleanCell.js","sources":["../../../../src/components/UI/cells/BooleanCell.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useTranslation } from 'react-i18next';\n\nimport OutlinedChip from '@/components/UI/Chips/OutlinedChip';\n\ninterface IBooleanCellProps {\n  value: boolean;\n}\n\nconst BooleanCell: React.FC<IBooleanCellProps> = ({ value }) => {\n  const { t } = useTranslation('ui');\n  return (\n    <div className=\"flex items-center gap-x-2\">\n      <OutlinedChip\n        label={value ? t('actions.yes') : t('actions.no')}\n        chipIcon={value ? 'check' : 'close'}\n        className={classNames('text-white', {\n          'bg-success': value,\n          'bg-danger': !value,\n        })}\n      />\n    </div>\n  );\n};\n\nexport default BooleanCell;\n"],"names":[],"mappings":";;;;AASA,MAAM,cAA2C,CAAC,EAAE,YAAY;AAC9D,QAAM,EAAE,EAAA,IAAM,eAAe,IAAI;AACjC,SACE,oBAAC,OAAA,EAAI,WAAU,6BACb,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO,QAAQ,EAAE,aAAa,IAAI,EAAE,YAAY;AAAA,MAChD,UAAU,QAAQ,UAAU;AAAA,MAC5B,WAAW,WAAW,cAAc;AAAA,QAClC,cAAc;AAAA,QACd,aAAa,CAAC;AAAA,MAAA,CACf;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;"}

package/dist/components/UI/cells/DetailsTableCell.d.ts

@@ -0,0 +1,7 @@
+interface IDetailsTableCellProps {
+    value: Array<{
+        [size: string | number]: number;
+    }>;
+}
+declare const DetailsTableCell: React.FC<IDetailsTableCellProps>;
+export default DetailsTableCell;

package/dist/components/UI/cells/DetailsTableCell.js

@@ -0,0 +1,30 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { isEmptyObject } from "../../../helpers/utilityHelpers.js";
+const DetailsTableCell = ({ value }) => {
+  const { t } = useTranslation("ui");
+  if (!value) return /* @__PURE__ */ jsx("span", { children: "-" });
+  const filteredArray = value.filter(
+    (item) => item !== null && item !== void 0 && !(Array.isArray(item) && item.length === 0) && !isEmptyObject(item)
+  );
+  if (!filteredArray || !filteredArray.length) return /* @__PURE__ */ jsx("span", { children: "-" });
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-row gap-6 px-4 text-xs", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
+      /* @__PURE__ */ jsx("span", { className: "opacity-70", children: t("detailsTable.size") }),
+      /* @__PURE__ */ jsx("span", { className: "opacity-70", children: t("detailsTable.quantity") })
+    ] }),
+    filteredArray.map((grade) => {
+      const gradeKey = Object.keys(grade);
+      return gradeKey.map((key) => {
+        return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
+          /* @__PURE__ */ jsx("span", { className: "border-b-2", children: key }),
+          /* @__PURE__ */ jsx("span", { className: "font-semibold", children: grade[key] })
+        ] }, key);
+      });
+    })
+  ] });
+};
+export {
+  DetailsTableCell as default
+};
+//# sourceMappingURL=DetailsTableCell.js.map

package/dist/components/UI/cells/DetailsTableCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DetailsTableCell.js","sources":["../../../../src/components/UI/cells/DetailsTableCell.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next';\n\nimport { isEmptyObject } from '@/helpers/utilityHelpers';\n\ninterface IDetailsTableCellProps {\n  value: Array<{ [size: string | number]: number }>;\n}\n\nconst DetailsTableCell: React.FC<IDetailsTableCellProps> = ({ value }) => {\n  const { t } = useTranslation('ui');\n  if (!value) return <span>-</span>;\n\n  const filteredArray = value.filter(\n    (item) =>\n      item !== null && item !== undefined && !(Array.isArray(item) && item.length === 0) && !isEmptyObject(item),\n  );\n\n  if (!filteredArray || !filteredArray.length) return <span>-</span>;\n\n  return (\n    <div className=\"flex flex-row gap-6 px-4 text-xs\">\n      <div className=\"flex flex-col items-center\">\n        <span className=\"opacity-70\">{t('detailsTable.size')}</span>\n        <span className=\"opacity-70\">{t('detailsTable.quantity')}</span>\n      </div>\n\n      {filteredArray.map((grade) => {\n        const gradeKey = Object.keys(grade);\n        return gradeKey.map((key) => {\n          return (\n            <div className=\"flex flex-col items-center\" key={key}>\n              <span className=\"border-b-2\">{key}</span>\n              <span className=\"font-semibold\">{grade[key]}</span>\n            </div>\n          );\n        });\n      })}\n    </div>\n  );\n};\n\nexport default DetailsTableCell;\n"],"names":[],"mappings":";;;AAQA,MAAM,mBAAqD,CAAC,EAAE,YAAY;AACxE,QAAM,EAAE,EAAA,IAAM,eAAe,IAAI;AACjC,MAAI,CAAC,MAAO,QAAO,oBAAC,UAAK,UAAA,KAAC;AAE1B,QAAM,gBAAgB,MAAM;AAAA,IAC1B,CAAC,SACC,SAAS,QAAQ,SAAS,UAAa,EAAE,MAAM,QAAQ,IAAI,KAAK,KAAK,WAAW,MAAM,CAAC,cAAc,IAAI;AAAA,EAAA;AAG7G,MAAI,CAAC,iBAAiB,CAAC,cAAc,OAAQ,QAAO,oBAAC,UAAK,UAAA,KAAC;AAE3D,SACE,qBAAC,OAAA,EAAI,WAAU,oCACb,UAAA;AAAA,IAAA,qBAAC,OAAA,EAAI,WAAU,8BACb,UAAA;AAAA,MAAA,oBAAC,QAAA,EAAK,WAAU,cAAc,UAAA,EAAE,mBAAmB,GAAE;AAAA,0BACpD,QAAA,EAAK,WAAU,cAAc,UAAA,EAAE,uBAAuB,EAAA,CAAE;AAAA,IAAA,GAC3D;AAAA,IAEC,cAAc,IAAI,CAAC,UAAU;AAC5B,YAAM,WAAW,OAAO,KAAK,KAAK;AAClC,aAAO,SAAS,IAAI,CAAC,QAAQ;AAC3B,eACE,qBAAC,OAAA,EAAI,WAAU,8BACb,UAAA;AAAA,UAAA,oBAAC,QAAA,EAAK,WAAU,cAAc,UAAA,KAAI;AAAA,8BACjC,QAAA,EAAK,WAAU,iBAAiB,UAAA,MAAM,GAAG,EAAA,CAAE;AAAA,QAAA,EAAA,GAFG,GAGjD;AAAA,MAEJ,CAAC;AAAA,IACH,CAAC;AAAA,EAAA,GACH;AAEJ;"}

package/dist/components/UI/cells/ProductImageCell.d.ts

@@ -0,0 +1,5 @@
+interface IProductImageCellProps {
+    src: string | undefined | null;
+}
+declare const ProductImageCell: React.FC<IProductImageCellProps>;
+export default ProductImageCell;

package/dist/components/UI/cells/ProductImageCell.js

@@ -0,0 +1,21 @@
+import { jsx } from "react/jsx-runtime";
+import ControlledImage from "../../Form/ControlledImage/index.js";
+import ControlledTooltip from "../ControlledTooltip.js";
+import ImagePlaceholder from "../ImagePlaceholder.js";
+const ProductImageCell = ({ src }) => {
+  return /* @__PURE__ */ jsx("div", { className: "flex aspect-square size-10 rounded-md border border-border", children: /* @__PURE__ */ jsx(
+    ControlledTooltip,
+    {
+      placement: "top",
+      className: "border-none bg-transparent shadow-none",
+      content: /* @__PURE__ */ jsx("div", { className: "max-h-72 min-w-9", children: src ? /* @__PURE__ */ jsx("img", { src, className: "size-full h-72 rounded-md object-cover shadow-xl" }) : /* @__PURE__ */ jsx(ImagePlaceholder, { className: "size-72 rounded-md" }) }),
+      interactive: !!src,
+      open: src ? void 0 : false,
+      children: /* @__PURE__ */ jsx(ControlledImage, { src, className: "size-full object-cover" })
+    }
+  ) });
+};
+export {
+  ProductImageCell as default
+};
+//# sourceMappingURL=ProductImageCell.js.map

package/dist/components/UI/cells/ProductImageCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProductImageCell.js","sources":["../../../../src/components/UI/cells/ProductImageCell.tsx"],"sourcesContent":["import ControlledImage from '@/components/Form/ControlledImage';\nimport ControlledTooltip from '@/components/UI/ControlledTooltip';\nimport ImagePlaceholder from '@/components/UI/ImagePlaceholder';\n\ninterface IProductImageCellProps {\n  src: string | undefined | null;\n}\n\nconst ProductImageCell: React.FC<IProductImageCellProps> = ({ src }) => {\n  return (\n    <div className=\"flex aspect-square size-10 rounded-md border border-border\">\n      <ControlledTooltip\n        placement=\"top\"\n        className=\"border-none bg-transparent shadow-none\"\n        content={\n          <div className=\"max-h-72 min-w-9\">\n            {src ? (\n              <img src={src} className=\"size-full h-72 rounded-md object-cover shadow-xl\" />\n            ) : (\n              <ImagePlaceholder className=\"size-72 rounded-md\" />\n            )}\n          </div>\n        }\n        interactive={!!src}\n        open={src ? undefined : false}\n      >\n        <ControlledImage src={src} className=\"size-full object-cover\" />\n      </ControlledTooltip>\n    </div>\n  );\n};\n\nexport default ProductImageCell;\n"],"names":[],"mappings":";;;;AAQA,MAAM,mBAAqD,CAAC,EAAE,UAAU;AACtE,SACE,oBAAC,OAAA,EAAI,WAAU,8DACb,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,WAAU;AAAA,MACV,SACE,oBAAC,OAAA,EAAI,WAAU,oBACZ,gBACC,oBAAC,OAAA,EAAI,KAAU,WAAU,oDAAmD,IAE5E,oBAAC,kBAAA,EAAiB,WAAU,sBAAqB,GAErD;AAAA,MAEF,aAAa,CAAC,CAAC;AAAA,MACf,MAAM,MAAM,SAAY;AAAA,MAExB,UAAA,oBAAC,iBAAA,EAAgB,KAAU,WAAU,yBAAA,CAAyB;AAAA,IAAA;AAAA,EAAA,GAElE;AAEJ;"}

package/dist/components/UI/cells/UrlLinkCell.d.ts

@@ -0,0 +1,6 @@
+interface IUrlLinkCellProps {
+    baseUrl: string;
+    content?: string;
+}
+declare const UrlLinkCell: ({ baseUrl, content }: IUrlLinkCellProps) => import("react").JSX.Element;
+export default UrlLinkCell;

package/dist/components/UI/cells/UrlLinkCell.js

@@ -0,0 +1,19 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import ControlledTooltip from "../ControlledTooltip.js";
+import { MaterialSymbol } from "../MaterialSymbol/index.js";
+const UrlLinkCell = ({ baseUrl, content }) => {
+  const { t } = useTranslation("ui");
+  const redirectToUrl = () => {
+    const urlToRedirect = content ? `${baseUrl}/${content}` : baseUrl;
+    window.open(urlToRedirect, "_blank");
+  };
+  return /* @__PURE__ */ jsx(ControlledTooltip, { content: t("urlLinkCell.clickToAccess"), children: /* @__PURE__ */ jsxs("div", { className: "flex cursor-pointer flex-row items-center gap-x-1", onClick: redirectToUrl, children: [
+    /* @__PURE__ */ jsx(MaterialSymbol, { icon: "open_in_new", color: "rgb(var(--color-foreground))", size: 20 }),
+    content && /* @__PURE__ */ jsx("span", { children: content })
+  ] }) });
+};
+export {
+  UrlLinkCell as default
+};
+//# sourceMappingURL=UrlLinkCell.js.map

package/dist/components/UI/cells/UrlLinkCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UrlLinkCell.js","sources":["../../../../src/components/UI/cells/UrlLinkCell.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next';\n\nimport ControlledTooltip from '@/components/UI/ControlledTooltip';\nimport { MaterialSymbol } from '@/components/UI/MaterialSymbol';\n\ninterface IUrlLinkCellProps {\n  baseUrl: string;\n  content?: string;\n}\n\nconst UrlLinkCell = ({ baseUrl, content }: IUrlLinkCellProps) => {\n  const { t } = useTranslation('ui');\n  const redirectToUrl = () => {\n    const urlToRedirect = content ? `${baseUrl}/${content}` : baseUrl;\n    window.open(urlToRedirect, '_blank');\n  };\n\n  return (\n    <ControlledTooltip content={t('urlLinkCell.clickToAccess')}>\n      <div className=\"flex cursor-pointer flex-row items-center gap-x-1\" onClick={redirectToUrl}>\n        <MaterialSymbol icon=\"open_in_new\" color=\"rgb(var(--color-foreground))\" size={20} />\n        {content && <span>{content}</span>}\n      </div>\n    </ControlledTooltip>\n  );\n};\n\nexport default UrlLinkCell;\n"],"names":[],"mappings":";;;;AAUA,MAAM,cAAc,CAAC,EAAE,SAAS,cAAiC;AAC/D,QAAM,EAAE,EAAA,IAAM,eAAe,IAAI;AACjC,QAAM,gBAAgB,MAAM;AAC1B,UAAM,gBAAgB,UAAU,GAAG,OAAO,IAAI,OAAO,KAAK;AAC1D,WAAO,KAAK,eAAe,QAAQ;AAAA,EACrC;AAEA,SACE,oBAAC,mBAAA,EAAkB,SAAS,EAAE,2BAA2B,GACvD,UAAA,qBAAC,OAAA,EAAI,WAAU,qDAAoD,SAAS,eAC1E,UAAA;AAAA,IAAA,oBAAC,kBAAe,MAAK,eAAc,OAAM,gCAA+B,MAAM,IAAI;AAAA,IACjF,WAAW,oBAAC,QAAA,EAAM,UAAA,QAAA,CAAQ;AAAA,EAAA,EAAA,CAC7B,EAAA,CACF;AAEJ;"}

package/dist/components/Upload/SimpleUploaderComponent.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+interface ISimpleUploaderComponentProps {
+    allowedTypes: Array<string>;
+    handleFilesSelected: (files: Array<File>) => void;
+    multiple?: boolean;
+    className?: string;
+}
+declare const SimpleUploaderComponent: React.FC<ISimpleUploaderComponentProps>;
+export default SimpleUploaderComponent;