lecom-ui 5.2.71 → 5.2.72

package/dist/button.js

@@ -1,104 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { Slot } from '@radix-ui/react-slot';
-import { cva } from 'class-variance-authority';
-import { Loader2Icon } from 'lucide-react';
-import { cn, PercentOfOpacityAlphaCode } from './lib/utils.js';
-
-const buttonVariants = cva(
-  "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
-  {
-    variants: {
-      variant: {
-        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
-        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
-        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
-        primary: "bg-blue-dark text-white shadow-sm hover:bg-[#4096ff]",
-        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
-        link: "text-primary underline-offset-4 hover:underline",
-        rounded: "bg-primary text-primary-foreground shadow hover:bg-primary/90 rounded-full",
-        transparencyLight: "text-primary-foreground shadow rounded-full bg-transparency-light hover:bg-transparency-light focus-visible:ring-transparent",
-        transparencyDark: "text-primary-foreground shadow rounded-full bg-transparency-dark hover:bg-transparency-dark focus-visible:ring-transparent"
-      },
-      size: {
-        default: "h-9 px-4 py-2",
-        sm: "h-8 rounded-md px-3 text-xs",
-        lg: "h-10 rounded-md px-8",
-        icon: "h-9 w-9",
-        padding: "px-4 py-3"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default"
-    }
-  }
-);
-const Button = forwardRef(
-  ({
-    className,
-    variant,
-    size,
-    asChild = false,
-    headerBackgroundColor = "",
-    headerTextColor = "",
-    isToggle = false,
-    pulse = false,
-    loading = false,
-    hiddenChildren = false,
-    disabled,
-    onClick,
-    children,
-    ...props
-  }, ref) => {
-    const Comp = asChild ? Slot : "button";
-    const handleClick = (event) => {
-      if (pulse) {
-        const button = event.currentTarget;
-        button.classList.add("pulse");
-        button.addEventListener(
-          "animationend",
-          () => {
-            button.classList.remove("pulse");
-          },
-          { once: true }
-        );
-      }
-      if (onClick) {
-        onClick(event);
-      }
-    };
-    return /* @__PURE__ */ jsxs(
-      Comp,
-      {
-        className: cn(
-          buttonVariants({ variant, size, className }),
-          loading && "hover:brightness-125"
-        ),
-        onClick: handleClick,
-        ref,
-        disabled: loading || disabled,
-        style: {
-          ...headerTextColor && headerTextColor !== "" && isToggle && (variant === "transparencyDark" || variant === "transparencyLight") && {
-            backgroundColor: headerTextColor
-          },
-          ...headerBackgroundColor && headerBackgroundColor !== "" && isToggle && (variant === "transparencyDark" || variant === "transparencyLight") && {
-            color: headerBackgroundColor
-          },
-          ...headerTextColor && headerTextColor !== "" && !isToggle && (variant === "transparencyDark" || variant === "transparencyLight") && {
-            color: PercentOfOpacityAlphaCode(headerTextColor, 0.87)
-          }
-        },
-        ...props,
-        children: [
-          loading && /* @__PURE__ */ jsx(Loader2Icon, { className: cn("h-4 w-4 animate-spin", children && "mr-2") }),
-          hiddenChildren && loading ? null : children
-        ]
-      }
-    );
-  }
-);
-Button.displayName = "Button";
-
-export { Button, buttonVariants };

package/dist/calendar.js

@@ -1,62 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { DayPicker } from 'react-day-picker';
-import { ChevronLeftIcon, ChevronRightIcon } from '@radix-ui/react-icons';
-import { cn } from './lib/utils.js';
-import { buttonVariants } from './button.js';
-
-function Calendar({
-  className,
-  classNames,
-  showOutsideDays = true,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DayPicker,
-    {
-      showOutsideDays,
-      className: cn("p-3", className),
-      classNames: {
-        months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
-        month: "space-y-4",
-        caption: "flex justify-center pt-1 relative items-center",
-        caption_label: "text-sm font-medium",
-        nav: "space-x-1 flex items-center",
-        nav_button: cn(
-          buttonVariants({ variant: "outline" }),
-          "h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100"
-        ),
-        nav_button_previous: "absolute left-1",
-        nav_button_next: "absolute right-1",
-        table: "w-full border-collapse space-y-1",
-        head_row: "flex",
-        head_cell: "text-muted-foreground rounded-md w-8 font-normal text-[0.8rem]",
-        row: "flex w-full mt-2",
-        cell: cn(
-          "relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-accent [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected].day-range-end)]:rounded-r-md",
-          props.mode === "range" ? "[&:has(>.day-range-end)]:rounded-r-md [&:has(>.day-range-start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md" : "[&:has([aria-selected])]:rounded-md"
-        ),
-        day: cn(
-          buttonVariants({ variant: "ghost" }),
-          "h-8 w-8 p-0 font-normal aria-selected:opacity-100"
-        ),
-        day_range_start: "day-range-start",
-        day_range_end: "day-range-end",
-        day_selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground",
-        day_today: "bg-accent text-accent-foreground",
-        day_outside: "day-outside text-muted-foreground opacity-50  aria-selected:bg-accent/50 aria-selected:text-muted-foreground aria-selected:opacity-30",
-        day_disabled: "text-muted-foreground opacity-50",
-        day_range_middle: "aria-selected:bg-accent aria-selected:text-accent-foreground",
-        day_hidden: "invisible",
-        ...classNames
-      },
-      components: {
-        IconLeft: () => /* @__PURE__ */ jsx(ChevronLeftIcon, { className: "h-4 w-4" }),
-        IconRight: () => /* @__PURE__ */ jsx(ChevronRightIcon, { className: "h-4 w-4" })
-      },
-      ...props
-    }
-  );
-}
-Calendar.displayName = "Calendar";
-
-export { Calendar };

package/dist/card.js

@@ -1,56 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import * as React from 'react';
-import { cn } from './lib/utils.js';
-
-const Card = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  "div",
-  {
-    ref,
-    className: cn(
-      "rounded-xl border bg-card text-card-foreground shadow",
-      className
-    ),
-    ...props
-  }
-));
-Card.displayName = "Card";
-const CardHeader = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  "div",
-  {
-    ref,
-    className: cn("flex flex-col space-y-1.5 p-6", className),
-    ...props
-  }
-));
-CardHeader.displayName = "CardHeader";
-const CardTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  "h3",
-  {
-    ref,
-    className: cn("font-semibold leading-none tracking-tight", className),
-    ...props
-  }
-));
-CardTitle.displayName = "CardTitle";
-const CardDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  "p",
-  {
-    ref,
-    className: cn("text-sm text-muted-foreground", className),
-    ...props
-  }
-));
-CardDescription.displayName = "CardDescription";
-const CardContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
-CardContent.displayName = "CardContent";
-const CardFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  "div",
-  {
-    ref,
-    className: cn("flex items-center p-6 pt-0", className),
-    ...props
-  }
-));
-CardFooter.displayName = "CardFooter";
-
-export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/checkbox.js

@@ -1,55 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import * as React from 'react';
-import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
-import { Check } from 'lucide-react';
-import { cn } from './lib/utils.js';
-
-const Checkbox = React.forwardRef(({ className, disabled, checked, ...props }, ref) => {
-  const id = React.useId();
-  const buildClassNameRoot = () => {
-    if (disabled && checked) {
-      return "border-gray-400 bg-gray-200 cursor-not-allowed opacity-50";
-    }
-    if (disabled) {
-      return "bg-gray-200 cursor-not-allowed opacity-50";
-    }
-    if (checked) {
-      return "bg-primary border-primary text-primary-foreground";
-    }
-    return "hover:border-primary";
-  };
-  return /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
-    /* @__PURE__ */ jsx(
-      CheckboxPrimitive.Root,
-      {
-        ref,
-        className: cn(
-          `peer h-4 w-4 shrink-0 rounded-sm border border-gray-400 shadow focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring ${buildClassNameRoot()}`,
-          className
-        ),
-        disabled,
-        checked,
-        ...props,
-        id,
-        children: /* @__PURE__ */ jsx(
-          CheckboxPrimitive.Indicator,
-          {
-            className: cn("flex items-center justify-center text-current"),
-            children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" })
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "label",
-      {
-        className: `text-[15px] leading-none cursor-pointer pl-2 ${disabled ? "cursor-not-allowed" : ""}`,
-        htmlFor: id,
-        children: props.children
-      }
-    )
-  ] });
-});
-Checkbox.displayName = CheckboxPrimitive.Root.displayName;
-
-export { Checkbox };

package/dist/collapse.js

@@ -1,60 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import * as React from 'react';
-import * as AccordionPrimitive from '@radix-ui/react-accordion';
-import { ChevronDownIcon } from '@radix-ui/react-icons';
-import { cn } from './lib/utils.js';
-
-const Accordion = AccordionPrimitive.Root;
-const AccordionItem = React.forwardRef(({ className, warning, ...props }, ref) => /* @__PURE__ */ jsx(
-  AccordionPrimitive.Item,
-  {
-    ref,
-    className: cn(!warning && "border-b", className),
-    "data-warning": warning,
-    ...props
-  }
-));
-AccordionItem.displayName = "AccordionItem";
-const AccordionTrigger = React.forwardRef(({ className, warning, children, ...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
-  AccordionPrimitive.Trigger,
-  {
-    ref,
-    className: cn(
-      "flex flex-1 items-center justify-between text-sm font-medium transition-all [&[data-state=open]>svg#ChevronDownIcon]:rotate-180",
-      warning ? "[&[data-state=closed]]:py-4 py-1" : "hover:underline py-4 ",
-      className
-    ),
-    ...props,
-    children: [
-      children,
-      /* @__PURE__ */ jsx(ChevronDownIcon, { id: "ChevronDownIcon", className: "h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200" })
-    ]
-  }
-) }));
-AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
-const AccordionContent = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
-  AccordionPrimitive.Content,
-  {
-    ref,
-    className: "overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
-    ...props,
-    children: /* @__PURE__ */ jsx("div", { className: cn("pb-4 pt-0", className), children })
-  }
-));
-AccordionContent.displayName = AccordionPrimitive.Content.displayName;
-const Collapse = ({ items, defaultActiveKey, className }) => {
-  return /* @__PURE__ */ jsx(
-    Accordion,
-    {
-      type: "multiple",
-      className,
-      defaultValue: defaultActiveKey,
-      children: items.map((i) => /* @__PURE__ */ jsxs(AccordionItem, { value: i.key, warning: i.warning ?? false, children: [
-        /* @__PURE__ */ jsx(AccordionTrigger, { warning: i.warning ?? false, children: i.label }),
-        /* @__PURE__ */ jsx(AccordionContent, { children: i.children })
-      ] }, i.key))
-    }
-  );
-};
-
-export { Collapse };

package/dist/collapsible.js

@@ -1,7 +0,0 @@
-import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
-
-const Collapsible = CollapsiblePrimitive.Root;
-const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
-const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;
-
-export { Collapsible, CollapsibleContent, CollapsibleTrigger };

package/dist/command.js

@@ -1,107 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import * as React from 'react';
-import { MagnifyingGlassIcon } from '@radix-ui/react-icons';
-import { Command as Command$1 } from 'cmdk';
-import { cn } from './lib/utils.js';
-import { Dialog, DialogContent } from './dialog.js';
-
-const Command = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  Command$1,
-  {
-    ref,
-    className: cn(
-      "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
-      className
-    ),
-    ...props
-  }
-));
-Command.displayName = Command$1.displayName;
-const CommandDialog = ({ children, ...props }) => {
-  return /* @__PURE__ */ jsx(Dialog, { ...props, children: /* @__PURE__ */ jsx(DialogContent, { className: "overflow-hidden p-0", children: /* @__PURE__ */ jsx(Command, { className: "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children }) }) });
-};
-CommandDialog.displayName = "CommandDialog";
-const CommandInput = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
-  /* @__PURE__ */ jsx(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
-  /* @__PURE__ */ jsx(
-    Command$1.Input,
-    {
-      ref,
-      className: cn(
-        "flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
-        className
-      ),
-      ...props
-    }
-  )
-] }));
-CommandInput.displayName = Command$1.Input.displayName;
-const CommandList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  Command$1.List,
-  {
-    ref,
-    className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className),
-    ...props
-  }
-));
-CommandList.displayName = Command$1.List.displayName;
-const CommandEmpty = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(
-  Command$1.Empty,
-  {
-    ref,
-    className: "py-6 text-center text-sm",
-    ...props
-  }
-));
-CommandEmpty.displayName = Command$1.Empty.displayName;
-const CommandGroup = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  Command$1.Group,
-  {
-    ref,
-    className: cn(
-      "overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
-      className
-    ),
-    ...props
-  }
-));
-CommandGroup.displayName = Command$1.Group.displayName;
-const CommandSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  Command$1.Separator,
-  {
-    ref,
-    className: cn("-mx-1 h-px bg-border", className),
-    ...props
-  }
-));
-CommandSeparator.displayName = Command$1.Separator.displayName;
-const CommandItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  Command$1.Item,
-  {
-    ref,
-    className: cn(
-      "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50",
-      className
-    ),
-    ...props
-  }
-));
-CommandItem.displayName = Command$1.Item.displayName;
-const CommandShortcut = ({
-  className,
-  ...props
-}) => {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: cn(
-        "ml-auto text-xs tracking-widest text-muted-foreground",
-        className
-      ),
-      ...props
-    }
-  );
-};
-CommandShortcut.displayName = "CommandShortcut";
-
-export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };

package/dist/components/Collapse/Collapse.js

@@ -1,94 +0,0 @@
-import * as React from 'react';
-import { cn } from '../../lib/utils.js';
-import * as AccordionPrimitive from '@radix-ui/react-accordion';
-import { cva } from 'class-variance-authority';
-import { ChevronRight } from 'lucide-react';
-
-const collapseTriggerVariants = cva(
-  "flex items-center justify-between w-full transition-all text-left outline-none data-[state=open]:font-semibold",
-  {
-    variants: {
-      size: {
-        small: "text-sm py-1.5 px-4 min-h-8",
-        medium: "text-base py-2.5 px-4 min-h-10",
-        large: "text-lg py-3 px-4 min-h-12"
-      },
-      ghost: {
-        true: "bg-transparent border-none",
-        false: "border-t-none border-grey-400"
-      }
-    },
-    defaultVariants: {
-      size: "large",
-      ghost: false
-    }
-  }
-);
-const CollapseRoot = AccordionPrimitive.Root;
-const CollapseItem = AccordionPrimitive.Item;
-const CollapsePanel = React.forwardRef(
-  ({
-    header,
-    children,
-    extra,
-    expandIconPosition = "start",
-    size = "large",
-    ghost = false,
-    disabled = false,
-    className,
-    ...props
-  }, ref) => /* @__PURE__ */ React.createElement(
-    CollapseItem,
-    {
-      ref,
-      ...props,
-      className: cn(
-        "group w-full",
-        disabled && "pointer-events-none opacity-50",
-        className
-      )
-    },
-    /* @__PURE__ */ React.createElement(AccordionPrimitive.Header, { asChild: true }, /* @__PURE__ */ React.createElement(
-      AccordionPrimitive.Trigger,
-      {
-        disabled,
-        className: cn(
-          collapseTriggerVariants({ size, ghost }),
-          "flex gap-2 items-center text-left font-normal"
-        )
-      },
-      /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          className: cn(
-            "flex flex-1 items-center justify-between gap-4 w-full",
-            expandIconPosition === "end" ? "flex-row-reverse" : ""
-          )
-        },
-        /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 truncate" }, /* @__PURE__ */ React.createElement(
-          "span",
-          {
-            className: "flex items-center justify-center flex-shrink-0 min-w-4 min-h-4 transition-transform duration-300 group-data-[state=open]:rotate-90 text-grey-700 text-lg select-none font-normal"
-          },
-          /* @__PURE__ */ React.createElement(ChevronRight, { className: "size-4" })
-        ), /* @__PURE__ */ React.createElement("span", { className: "font-normal" }, header)),
-        extra && /* @__PURE__ */ React.createElement("div", { className: "text-sm text-grey-500" }, extra)
-      )
-    )),
-    /* @__PURE__ */ React.createElement(
-      AccordionPrimitive.Content,
-      {
-        className: cn(
-          "overflow-hidden data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up"
-        )
-      },
-      /* @__PURE__ */ React.createElement("div", { className: "text-sm text-grey-800 pt-2 pb-4 px-4" }, children)
-    )
-  )
-);
-CollapsePanel.displayName = "CollapsePanel";
-const Collapse = Object.assign(CollapseRoot, {
-  Panel: CollapsePanel
-});
-
-export { Collapse, collapseTriggerVariants };

package/dist/components/DataTable/useOptimizedTable.js

@@ -1,75 +0,0 @@
-import { useState, useRef, useMemo, useCallback, useEffect } from 'react';
-
-function useOptimizedTable({
-  columns,
-  isLoading
-}) {
-  const [scrollLeft, setScrollLeft] = useState(0);
-  const tableRef = useRef(null);
-  const scrollAreaRef = useRef(null);
-  const rafRef = useRef(null);
-  const fixedColumnsPositions = useMemo(() => {
-    const positions = {};
-    let accumulatedWidth = 0;
-    columns.forEach((column) => {
-      if (column.fixed) {
-        positions[column.key] = accumulatedWidth;
-        accumulatedWidth += typeof column.width === "number" ? column.width : 150;
-      }
-    });
-    return positions;
-  }, [columns]);
-  const handleScroll = useCallback((e) => {
-    if (rafRef.current) {
-      cancelAnimationFrame(rafRef.current);
-    }
-    rafRef.current = requestAnimationFrame(() => {
-      const target = e.target;
-      setScrollLeft(target.scrollLeft);
-    });
-  }, []);
-  useEffect(() => {
-    const scrollElement = scrollAreaRef.current?.querySelector(
-      "[data-radix-scroll-area-viewport]"
-    );
-    if (scrollElement) {
-      scrollElement.addEventListener("scroll", handleScroll, {
-        passive: true,
-        capture: false
-      });
-      return () => {
-        scrollElement.removeEventListener("scroll", handleScroll);
-        if (rafRef.current) {
-          cancelAnimationFrame(rafRef.current);
-        }
-      };
-    }
-  }, [handleScroll]);
-  useEffect(() => {
-    if (!tableRef.current || isLoading) return;
-    requestAnimationFrame(() => {
-      if (!tableRef.current) return;
-      const style = tableRef.current.style;
-      Object.entries(fixedColumnsPositions).forEach(([columnKey, position]) => {
-        style.setProperty(`--fixed-${columnKey}-left`, `${position}px`);
-      });
-      tableRef.current.classList.toggle("scrolled", scrollLeft > 0);
-    });
-  }, [fixedColumnsPositions, scrollLeft, isLoading]);
-  useEffect(
-    () => () => {
-      if (rafRef.current) {
-        cancelAnimationFrame(rafRef.current);
-      }
-    },
-    []
-  );
-  return {
-    tableRef,
-    scrollAreaRef,
-    scrollLeft,
-    fixedColumnsPositions
-  };
-}
-
-export { useOptimizedTable };