@sustaina/shared-ui 1.28.0 → 1.29.1

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
-import React__default, { CSSProperties, ReactNode, SVGProps } from 'react';
+import React__default, { CSSProperties, ReactNode, SVGProps, ComponentProps } from 'react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import { ClassValue } from 'clsx';
 import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
@@ -507,6 +507,7 @@ declare const getDialogAlertControls: () => {
     openDialogAlert: (payload?: {
         template?: TemplateKeys;
         props?: OpenDialogAlert;
+        isExclusive?: boolean;
     }) => void;
     closeDialogAlert: () => void;
     openErrorDialogAlert: (error: unknown) => void;
@@ -1282,8 +1283,10 @@ type TruncatedProps = {
     children: ReactNode;
     as?: keyof React__default.JSX.IntrinsicElements;
     style?: CSSProperties;
+    tooltipProps?: Omit<ComponentProps<typeof Tooltip$1>, "open" | "onOpenChange">;
+    tooltipContentProps?: Omit<ComponentProps<typeof TooltipContent$1>, "children">;
 };
-declare const Truncated: ({ children, className, ellipsis, as, style }: TruncatedProps) => react_jsx_runtime.JSX.Element;
+declare const Truncated: ({ children, className, ellipsis, as, style, tooltipProps, tooltipContentProps }: TruncatedProps) => react_jsx_runtime.JSX.Element;
 
 type InputPrimitiveProps = React$1.InputHTMLAttributes<HTMLInputElement>;
 declare const inputVariants: (props?: ({

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
-import React__default, { CSSProperties, ReactNode, SVGProps } from 'react';
+import React__default, { CSSProperties, ReactNode, SVGProps, ComponentProps } from 'react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import { ClassValue } from 'clsx';
 import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
@@ -507,6 +507,7 @@ declare const getDialogAlertControls: () => {
     openDialogAlert: (payload?: {
         template?: TemplateKeys;
         props?: OpenDialogAlert;
+        isExclusive?: boolean;
     }) => void;
     closeDialogAlert: () => void;
     openErrorDialogAlert: (error: unknown) => void;
@@ -1282,8 +1283,10 @@ type TruncatedProps = {
     children: ReactNode;
     as?: keyof React__default.JSX.IntrinsicElements;
     style?: CSSProperties;
+    tooltipProps?: Omit<ComponentProps<typeof Tooltip$1>, "open" | "onOpenChange">;
+    tooltipContentProps?: Omit<ComponentProps<typeof TooltipContent$1>, "children">;
 };
-declare const Truncated: ({ children, className, ellipsis, as, style }: TruncatedProps) => react_jsx_runtime.JSX.Element;
+declare const Truncated: ({ children, className, ellipsis, as, style, tooltipProps, tooltipContentProps }: TruncatedProps) => react_jsx_runtime.JSX.Element;
 
 type InputPrimitiveProps = React$1.InputHTMLAttributes<HTMLInputElement>;
 declare const inputVariants: (props?: ({

package/dist/index.js

@@ -5313,7 +5313,8 @@ var getDialogTemplates = ({ setOpen = () => {
     title: "error.session_expired.title",
     description: "error.session_expired.description",
     confirmText: "error.session_expired.confirm_text",
-    showCancel: false
+    showCancel: false,
+    persistent: true
   },
   "error.user_not_found": {
     variant: "error",
@@ -5440,9 +5441,17 @@ var getDialogTemplates = ({ setOpen = () => {
 var useDialogAlertStore = zustand.create((set, get) => ({
   open: false,
   dialogProps: {},
-  setOpen: (data) => set({ open: data }),
+  setOpen: (open) => {
+    if (!open && get().isExclusive) {
+      get().setIsExclusive(false);
+    }
+    set({ open });
+  },
   setDialogProps: (data) => set({ dialogProps: data }),
   openDialogAlert: (payload) => {
+    if (get().isExclusive) {
+      return;
+    }
     let templateVal;
     if (payload?.template) {
       templateVal = getDialogTemplates({ setOpen: get().setOpen })[payload.template];
@@ -5453,10 +5462,13 @@ var useDialogAlertStore = zustand.create((set, get) => ({
     }
     get().setDialogProps({ ...templateVal, ...payload?.props });
     get().setOpen(true);
+    get().setIsExclusive(payload?.isExclusive ?? false);
   },
   closeDialogAlert: () => {
     set({ open: false });
-  }
+  },
+  isExclusive: false,
+  setIsExclusive: (isExclusive) => set({ isExclusive })
 }));
 var DialogAlertProvider = ({ children, i18nResource, i18nLang }) => {
   const open = useDialogAlertStore((state) => state.open);
@@ -5486,16 +5498,16 @@ var DialogAlertProvider = ({ children, i18nResource, i18nLang }) => {
 var openDialogAlert = useDialogAlertStore.getState().openDialogAlert;
 var closeDialogAlert = useDialogAlertStore.getState().closeDialogAlert;
 var openErrorDialogAlert = (error) => {
-  if (error instanceof Error) {
-    openDialogAlert({ template: "error.something_went_wrong", props: { description: error.message } });
-  } else if (error.isAxiosError) {
+  if (error.isAxiosError) {
     let template = "error.something_went_wrong";
+    let props = void 0;
     switch (error.response?.status) {
       case 400:
         template = "error.invalid_incomplete_data";
         break;
       case 401:
         template = "error.session_expired";
+        props = { confirmText: void 0 };
         break;
       case 403:
         template = "error.permission_denied";
@@ -5510,7 +5522,9 @@ var openErrorDialogAlert = (error) => {
         template = "error.api_db_error";
         break;
     }
-    openDialogAlert({ template });
+    openDialogAlert({ template, props });
+  } else if (error instanceof Error) {
+    openDialogAlert({ template: "error.something_went_wrong", props: { description: error.message } });
   } else {
     openDialogAlert({ template: "error.something_went_wrong" });
   }
@@ -9810,27 +9824,51 @@ var CropperModal = ({
     }
   );
 };
-var Truncated = ({ children, className, ellipsis = true, as = "p", style }) => {
+var Truncated = ({
+  children,
+  className,
+  ellipsis = true,
+  as = "p",
+  style,
+  tooltipProps,
+  tooltipContentProps
+}) => {
   const elementRef = React4.useRef(null);
   const [open, setOpen] = React4.useState(false);
   const [isTruncated, setIsTruncated] = React4.useState(false);
   const Comp = as;
   const normalizedChildren = typeof children === "string" ? children.replace(/>/g, ">\u200B") : children;
+  const lineClampLines = typeof ellipsis === "number" ? ellipsis : typeof ellipsis === "object" ? ellipsis?.lineClamp ?? 3 : null;
   React4.useEffect(() => {
     const el = elementRef.current;
     if (!el) return;
-    const checkTruncate = debounce(() => {
-      const overflowX = el.scrollWidth > el.clientWidth;
-      const overflowY = el.scrollHeight > el.clientHeight;
-      setIsTruncated(overflowX || overflowY);
-    }, 300);
-    const resizeObserver = new ResizeObserver(checkTruncate);
+    const measure = () => {
+      if (!ellipsis) {
+        setIsTruncated(false);
+        return;
+      }
+      const rect = el.getBoundingClientRect();
+      const width = el.clientWidth || el.offsetWidth || rect.width;
+      const height = el.clientHeight || el.offsetHeight || rect.height;
+      if (!width || !height) {
+        setIsTruncated(false);
+        return;
+      }
+      const epsilon = 1;
+      const overflowWidth = el.scrollWidth - width > epsilon;
+      const overflowHeight = el.scrollHeight - height > epsilon;
+      setIsTruncated(overflowWidth || overflowHeight);
+    };
+    const resizeObserver = new ResizeObserver(() => requestAnimationFrame(measure));
     resizeObserver.observe(el);
+    const mutationObserver = new MutationObserver(() => measure());
+    mutationObserver.observe(el, { childList: true, subtree: true, characterData: true });
+    requestAnimationFrame(measure);
     return () => {
       resizeObserver.disconnect();
+      mutationObserver.disconnect();
     };
-  }, []);
-  const lineClampLines = typeof ellipsis === "number" ? ellipsis : typeof ellipsis === "object" ? ellipsis.lineClamp ?? 3 : null;
+  }, [children, ellipsis, lineClampLines]);
   const truncationClass = React4.useMemo(() => {
     if (!ellipsis) return "";
     if (typeof ellipsis === "number") return `line-clamp-${ellipsis}`;
@@ -9849,14 +9887,20 @@ var Truncated = ({ children, className, ellipsis = true, as = "p", style }) => {
   }, [lineClampLines, style]);
   const baseContent = /* @__PURE__ */ jsxRuntime.jsx(Comp, { ref: elementRef, className: cn(truncationClass, className), style: clampedStyle, children: normalizedChildren });
   let tooltipContent = normalizedChildren;
-  let tooltipSide = "top";
   if (typeof ellipsis === "object") {
     tooltipContent = ellipsis?.content ?? normalizedChildren;
-    tooltipSide = ellipsis?.side ?? "top";
   }
+  const {
+    className: tooltipContentClassName,
+    arrowClassName: tooltipArrowClassName,
+    side: tooltipContentSide,
+    ...tooltipContentRest
+  } = tooltipContentProps ?? {};
+  const tooltipSide = (typeof ellipsis === "object" ? ellipsis?.side : void 0) ?? tooltipContentSide ?? "top";
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Tooltip2,
     {
+      ...tooltipProps,
       open,
       onOpenChange: (open2) => {
         setOpen(isTruncated && open2);
@@ -9867,8 +9911,12 @@ var Truncated = ({ children, className, ellipsis = true, as = "p", style }) => {
           TooltipContent2,
           {
             side: tooltipSide,
-            className: cn("text-white bg-[#8B8B8B] max-w-md wrap-break-word shadow-lg"),
-            arrowClassName: "bg-[#8B8B8B] fill-[#8B8B8B]",
+            className: cn(
+              "text-white bg-[#8B8B8B] max-w-xs sm:max-w-md wrap-break-word shadow-lg",
+              tooltipContentClassName
+            ),
+            arrowClassName: cn("bg-[#8B8B8B] fill-[#8B8B8B]", tooltipArrowClassName),
+            ...tooltipContentRest,
             children: tooltipContent
           }
         )