eai-frontend-components 2.0.80 → 2.0.81

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -10144,6 +10144,24 @@ const Header = ({ splittedPath, modules, pages, isLoading, combobox, }) => {
10144
10144
  return (jsxRuntime.jsxs("header", { className: 'flex flex-col justify-between items-center w-full', children: [jsxRuntime.jsxs("div", { className: 'flex justify-between items-center py-3 px-5 w-full', children: [jsxRuntime.jsxs("div", { className: 'flex items-center gap-x-2 h-[40px]', children: [jsxRuntime.jsx(SidebarTrigger, { className: 'p-5' }), jsxRuntime.jsx("div", { className: 'p-2', children: jsxRuntime.jsx(Breadcrumb, { children: jsxRuntime.jsx(BreadcrumbList, { children: renderBreadcrumbItens() }) }) })] }), jsxRuntime.jsx("div", { className: 'flex items-center', children: combobox })] }), jsxRuntime.jsx(LoadingBar, { ref: refProgressLoading, color: getColorLoadingBar(), height: 7 })] }));
10145
10145
  };
10146
10146
 
10147
+ const TruncatedText = ({ text }) => {
10148
+ const ref = React$1.useRef(null);
10149
+ const [isTruncated, setIsTruncated] = React$1.useState(false);
10150
+ React$1.useLayoutEffect(() => {
10151
+ const el = ref.current;
10152
+ if (!el)
10153
+ return;
10154
+ const check = () => setIsTruncated(el.scrollWidth > el.clientWidth);
10155
+ check();
10156
+ const observer = new ResizeObserver(check);
10157
+ observer.observe(el);
10158
+ return () => observer.disconnect();
10159
+ }, [text]);
10160
+ const inner = (jsxRuntime.jsx("div", { ref: ref, className: 'text-zinc-500 truncate', children: text }));
10161
+ if (!isTruncated)
10162
+ return inner;
10163
+ return (jsxRuntime.jsx(TooltipProvider, { children: jsxRuntime.jsxs(Tooltip, { children: [jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: inner }), jsxRuntime.jsx(TooltipContent, { children: text })] }) }));
10164
+ };
10147
10165
  const LabelWithTitle = ({ title, value, value2, required, showCopyIcon = false, className, isLoading, hoverAction, }) => {
10148
10166
  const handleCopy = () => {
10149
10167
  if (showCopyIcon && value) {
@@ -10154,7 +10172,7 @@ const LabelWithTitle = ({ title, value, value2, required, showCopyIcon = false,
10154
10172
  });
10155
10173
  }
10156
10174
  };
10157
- return (jsxRuntime.jsx("div", { className: cn('flex group', className), children: jsxRuntime.jsx("div", { className: cn('flex flex-col text-sm w-full', showCopyIcon || hoverAction ? 'p-1 rounded-md transition-colors group-hover:bg-sidebar-accent' : 'p-1'), children: jsxRuntime.jsxs("div", { className: 'relative', children: [jsxRuntime.jsxs("div", { className: 'flex items-center text-sm font-medium gap-0.5', children: [jsxRuntime.jsx("span", { className: 'text-default truncate', children: title }), required && jsxRuntime.jsx("div", { className: 'text-red-500 truncate', children: "*" })] }), jsxRuntime.jsx("div", { className: 'grid flex-1 items-center pt-1', children: isLoading ? jsxRuntime.jsx(Skeleton, { className: 'h-5 w-full rounded-lg' }) : jsxRuntime.jsx("div", { className: 'text-zinc-500 truncate', children: value }) }), value2 && (jsxRuntime.jsx("div", { className: 'grid flex-1 items-center pt-1', children: isLoading ? jsxRuntime.jsx(Skeleton, { className: 'h-5 w-full rounded-lg' }) : jsxRuntime.jsx("div", { className: 'text-zinc-500 truncate', children: value2 }) })), showCopyIcon && (jsxRuntime.jsx("div", { className: cn('absolute top-1/2 right-0 -translate-y-1/2 opacity-0 transition-opacity group-hover:opacity-100'), children: jsxRuntime.jsx(TooltipProvider, { children: jsxRuntime.jsxs(Tooltip, { children: [jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: jsxRuntime.jsx(Button, { variant: 'ghost', type: 'button', className: cn('p-1 h-10 w-8 bg-sidebar-accent'), onClick: handleCopy, children: jsxRuntime.jsx(lucideReact.Copy, { size: 16 }) }) }), jsxRuntime.jsx(TooltipContent, { children: "Copiar" })] }) }) })), hoverAction && (jsxRuntime.jsx("div", { className: cn('absolute top-1/2 right-0 -translate-y-1/2 opacity-0 transition-opacity group-hover:opacity-100'), children: jsxRuntime.jsx(TooltipProvider, { children: jsxRuntime.jsxs(Tooltip, { children: [jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: jsxRuntime.jsx(Button, { variant: 'ghost', type: 'button', className: cn('p-1 h-10 w-8 bg-sidebar-accent'), onClick: hoverAction.onClick, children: hoverAction.icon }) }), jsxRuntime.jsx(TooltipContent, { children: hoverAction.tooltip })] }) }) }))] }) }) }));
10175
+ return (jsxRuntime.jsx("div", { className: cn('flex group', className), children: jsxRuntime.jsx("div", { className: cn('flex flex-col text-sm w-full', showCopyIcon || hoverAction ? 'p-1 rounded-md transition-colors group-hover:bg-sidebar-accent' : 'p-1'), children: jsxRuntime.jsxs("div", { className: 'relative', children: [jsxRuntime.jsxs("div", { className: 'flex items-center text-sm font-medium gap-0.5', children: [jsxRuntime.jsx("span", { className: 'text-default truncate', children: title }), required && jsxRuntime.jsx("div", { className: 'text-red-500 truncate', children: "*" })] }), jsxRuntime.jsx("div", { className: 'grid flex-1 items-center pt-1', children: isLoading ? jsxRuntime.jsx(Skeleton, { className: 'h-5 w-full rounded-lg' }) : jsxRuntime.jsx(TruncatedText, { text: value }) }), value2 && (jsxRuntime.jsx("div", { className: 'grid flex-1 items-center pt-1', children: isLoading ? jsxRuntime.jsx(Skeleton, { className: 'h-5 w-full rounded-lg' }) : jsxRuntime.jsx(TruncatedText, { text: value2 }) })), showCopyIcon && (jsxRuntime.jsx("div", { className: cn('absolute top-1/2 right-0 -translate-y-1/2 opacity-0 transition-opacity group-hover:opacity-100'), children: jsxRuntime.jsx(TooltipProvider, { children: jsxRuntime.jsxs(Tooltip, { children: [jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: jsxRuntime.jsx(Button, { variant: 'ghost', type: 'button', className: cn('p-1 h-10 w-8 bg-sidebar-accent'), onClick: handleCopy, children: jsxRuntime.jsx(lucideReact.Copy, { size: 16 }) }) }), jsxRuntime.jsx(TooltipContent, { children: "Copiar" })] }) }) })), hoverAction && (jsxRuntime.jsx("div", { className: cn('absolute top-1/2 right-0 -translate-y-1/2 opacity-0 transition-opacity group-hover:opacity-100'), children: jsxRuntime.jsx(TooltipProvider, { children: jsxRuntime.jsxs(Tooltip, { children: [jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: jsxRuntime.jsx(Button, { variant: 'ghost', type: 'button', className: cn('p-1 h-10 w-8 bg-sidebar-accent'), onClick: hoverAction.onClick, children: hoverAction.icon }) }), jsxRuntime.jsx(TooltipContent, { children: hoverAction.tooltip })] }) }) }))] }) }) }));
10158
10176
  };
10159
10177
 
10160
10178
  const NotFound = () => {