lecom-ui 5.2.71 → 5.2.73

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.
Files changed (81) hide show
  1. package/dist/components/Combobox/Combobox.js +5 -19
  2. package/dist/components/CustomDivider/CustomDivider.js +18 -36
  3. package/dist/components/DataTable/DataTable.utils.js +1 -5
  4. package/dist/components/DataTable/Table.js +40 -60
  5. package/dist/components/Sheet/Sheet.js +1 -31
  6. package/dist/components/Steps/{StepsTimeline.js → Steps.js} +1 -0
  7. package/dist/components/Switch/Switch.js +20 -5
  8. package/dist/components/TagInput/TagInput.js +55 -58
  9. package/dist/index.d.ts +67 -93
  10. package/dist/index.js +3 -4
  11. package/dist/style.min.css +1 -1
  12. package/package.json +4 -3
  13. package/dist/badge.js +0 -26
  14. package/dist/button-dropdown.js +0 -117
  15. package/dist/button.js +0 -104
  16. package/dist/calendar.js +0 -62
  17. package/dist/card.js +0 -56
  18. package/dist/checkbox.js +0 -55
  19. package/dist/collapse.js +0 -60
  20. package/dist/collapsible.js +0 -7
  21. package/dist/command.js +0 -107
  22. package/dist/components/DataTable/useOptimizedTable.js +0 -75
  23. package/dist/data-table/data-table.js +0 -490
  24. package/dist/date-picker.js +0 -92
  25. package/dist/dialog.js +0 -95
  26. package/dist/dropdown-menu.js +0 -138
  27. package/dist/fonts/Montserrat-Bold.otf +0 -0
  28. package/dist/fonts/Montserrat-Medium.otf +0 -0
  29. package/dist/fonts/Montserrat-Regular.otf +0 -0
  30. package/dist/fonts/Roboto-Bold.otf +0 -0
  31. package/dist/fonts/Roboto-Light.otf +0 -0
  32. package/dist/fonts/Roboto-Medium.otf +0 -0
  33. package/dist/fonts/Roboto-Regular.otf +0 -0
  34. package/dist/form.js +0 -102
  35. package/dist/header.js +0 -90
  36. package/dist/hook/useDebounce.js +0 -16
  37. package/dist/icon-handler.js +0 -72
  38. package/dist/icons/brandModules.js +0 -27
  39. package/dist/icons/companyLogo.js +0 -61
  40. package/dist/icons/createUseAuxiliary.js +0 -107
  41. package/dist/icons/footerInfo.js +0 -25
  42. package/dist/icons/logo_lecom.svg.js +0 -3
  43. package/dist/icons/newUpdate.js +0 -23
  44. package/dist/icons/robertyRPA.js +0 -30
  45. package/dist/ilustrations/access_denied.js +0 -252
  46. package/dist/ilustrations/page_not_found.js +0 -188
  47. package/dist/input.js +0 -42
  48. package/dist/label.js +0 -20
  49. package/dist/modal.js +0 -27
  50. package/dist/pagination.js +0 -474
  51. package/dist/plugin/extend.ts +0 -78
  52. package/dist/plugin/fontFaces.ts +0 -172
  53. package/dist/plugin/general.ts +0 -12
  54. package/dist/plugin/pluginDev.js +0 -5
  55. package/dist/plugin/pluginNext.js +0 -5
  56. package/dist/plugin/pluginVite.js +0 -5
  57. package/dist/plugin/template.ts +0 -31
  58. package/dist/plugin/typographies.ts +0 -152
  59. package/dist/plugin/varsTheme.ts +0 -79
  60. package/dist/plugin.cjs +0 -298
  61. package/dist/popover.js +0 -24
  62. package/dist/radio-group.js +0 -74
  63. package/dist/range-picker.js +0 -99
  64. package/dist/scroll-area.js +0 -37
  65. package/dist/search-bar.js +0 -151
  66. package/dist/select.js +0 -156
  67. package/dist/separator.js +0 -24
  68. package/dist/sheet.js +0 -106
  69. package/dist/sidebar.js +0 -188
  70. package/dist/skeleton.js +0 -17
  71. package/dist/slider.js +0 -23
  72. package/dist/status-screen.js +0 -71
  73. package/dist/switch.js +0 -27
  74. package/dist/table.js +0 -83
  75. package/dist/tabs.js +0 -44
  76. package/dist/tag.js +0 -33
  77. package/dist/textarea.js +0 -22
  78. package/dist/toast.js +0 -105
  79. package/dist/toaster.js +0 -23
  80. package/dist/tooltip.js +0 -133
  81. package/dist/use-toast.js +0 -121
package/dist/button.js DELETED
@@ -1,104 +0,0 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { forwardRef } from 'react';
3
- import { Slot } from '@radix-ui/react-slot';
4
- import { cva } from 'class-variance-authority';
5
- import { Loader2Icon } from 'lucide-react';
6
- import { cn, PercentOfOpacityAlphaCode } from './lib/utils.js';
7
-
8
- const buttonVariants = cva(
9
- "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",
10
- {
11
- variants: {
12
- variant: {
13
- default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
14
- destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
15
- outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
16
- primary: "bg-blue-dark text-white shadow-sm hover:bg-[#4096ff]",
17
- secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
18
- ghost: "hover:bg-accent hover:text-accent-foreground",
19
- link: "text-primary underline-offset-4 hover:underline",
20
- rounded: "bg-primary text-primary-foreground shadow hover:bg-primary/90 rounded-full",
21
- transparencyLight: "text-primary-foreground shadow rounded-full bg-transparency-light hover:bg-transparency-light focus-visible:ring-transparent",
22
- transparencyDark: "text-primary-foreground shadow rounded-full bg-transparency-dark hover:bg-transparency-dark focus-visible:ring-transparent"
23
- },
24
- size: {
25
- default: "h-9 px-4 py-2",
26
- sm: "h-8 rounded-md px-3 text-xs",
27
- lg: "h-10 rounded-md px-8",
28
- icon: "h-9 w-9",
29
- padding: "px-4 py-3"
30
- }
31
- },
32
- defaultVariants: {
33
- variant: "default",
34
- size: "default"
35
- }
36
- }
37
- );
38
- const Button = forwardRef(
39
- ({
40
- className,
41
- variant,
42
- size,
43
- asChild = false,
44
- headerBackgroundColor = "",
45
- headerTextColor = "",
46
- isToggle = false,
47
- pulse = false,
48
- loading = false,
49
- hiddenChildren = false,
50
- disabled,
51
- onClick,
52
- children,
53
- ...props
54
- }, ref) => {
55
- const Comp = asChild ? Slot : "button";
56
- const handleClick = (event) => {
57
- if (pulse) {
58
- const button = event.currentTarget;
59
- button.classList.add("pulse");
60
- button.addEventListener(
61
- "animationend",
62
- () => {
63
- button.classList.remove("pulse");
64
- },
65
- { once: true }
66
- );
67
- }
68
- if (onClick) {
69
- onClick(event);
70
- }
71
- };
72
- return /* @__PURE__ */ jsxs(
73
- Comp,
74
- {
75
- className: cn(
76
- buttonVariants({ variant, size, className }),
77
- loading && "hover:brightness-125"
78
- ),
79
- onClick: handleClick,
80
- ref,
81
- disabled: loading || disabled,
82
- style: {
83
- ...headerTextColor && headerTextColor !== "" && isToggle && (variant === "transparencyDark" || variant === "transparencyLight") && {
84
- backgroundColor: headerTextColor
85
- },
86
- ...headerBackgroundColor && headerBackgroundColor !== "" && isToggle && (variant === "transparencyDark" || variant === "transparencyLight") && {
87
- color: headerBackgroundColor
88
- },
89
- ...headerTextColor && headerTextColor !== "" && !isToggle && (variant === "transparencyDark" || variant === "transparencyLight") && {
90
- color: PercentOfOpacityAlphaCode(headerTextColor, 0.87)
91
- }
92
- },
93
- ...props,
94
- children: [
95
- loading && /* @__PURE__ */ jsx(Loader2Icon, { className: cn("h-4 w-4 animate-spin", children && "mr-2") }),
96
- hiddenChildren && loading ? null : children
97
- ]
98
- }
99
- );
100
- }
101
- );
102
- Button.displayName = "Button";
103
-
104
- export { Button, buttonVariants };
package/dist/calendar.js DELETED
@@ -1,62 +0,0 @@
1
- import { jsx } from 'react/jsx-runtime';
2
- import { DayPicker } from 'react-day-picker';
3
- import { ChevronLeftIcon, ChevronRightIcon } from '@radix-ui/react-icons';
4
- import { cn } from './lib/utils.js';
5
- import { buttonVariants } from './button.js';
6
-
7
- function Calendar({
8
- className,
9
- classNames,
10
- showOutsideDays = true,
11
- ...props
12
- }) {
13
- return /* @__PURE__ */ jsx(
14
- DayPicker,
15
- {
16
- showOutsideDays,
17
- className: cn("p-3", className),
18
- classNames: {
19
- months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
20
- month: "space-y-4",
21
- caption: "flex justify-center pt-1 relative items-center",
22
- caption_label: "text-sm font-medium",
23
- nav: "space-x-1 flex items-center",
24
- nav_button: cn(
25
- buttonVariants({ variant: "outline" }),
26
- "h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100"
27
- ),
28
- nav_button_previous: "absolute left-1",
29
- nav_button_next: "absolute right-1",
30
- table: "w-full border-collapse space-y-1",
31
- head_row: "flex",
32
- head_cell: "text-muted-foreground rounded-md w-8 font-normal text-[0.8rem]",
33
- row: "flex w-full mt-2",
34
- cell: cn(
35
- "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",
36
- 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"
37
- ),
38
- day: cn(
39
- buttonVariants({ variant: "ghost" }),
40
- "h-8 w-8 p-0 font-normal aria-selected:opacity-100"
41
- ),
42
- day_range_start: "day-range-start",
43
- day_range_end: "day-range-end",
44
- day_selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground",
45
- day_today: "bg-accent text-accent-foreground",
46
- day_outside: "day-outside text-muted-foreground opacity-50 aria-selected:bg-accent/50 aria-selected:text-muted-foreground aria-selected:opacity-30",
47
- day_disabled: "text-muted-foreground opacity-50",
48
- day_range_middle: "aria-selected:bg-accent aria-selected:text-accent-foreground",
49
- day_hidden: "invisible",
50
- ...classNames
51
- },
52
- components: {
53
- IconLeft: () => /* @__PURE__ */ jsx(ChevronLeftIcon, { className: "h-4 w-4" }),
54
- IconRight: () => /* @__PURE__ */ jsx(ChevronRightIcon, { className: "h-4 w-4" })
55
- },
56
- ...props
57
- }
58
- );
59
- }
60
- Calendar.displayName = "Calendar";
61
-
62
- export { Calendar };
package/dist/card.js DELETED
@@ -1,56 +0,0 @@
1
- import { jsx } from 'react/jsx-runtime';
2
- import * as React from 'react';
3
- import { cn } from './lib/utils.js';
4
-
5
- const Card = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
6
- "div",
7
- {
8
- ref,
9
- className: cn(
10
- "rounded-xl border bg-card text-card-foreground shadow",
11
- className
12
- ),
13
- ...props
14
- }
15
- ));
16
- Card.displayName = "Card";
17
- const CardHeader = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
18
- "div",
19
- {
20
- ref,
21
- className: cn("flex flex-col space-y-1.5 p-6", className),
22
- ...props
23
- }
24
- ));
25
- CardHeader.displayName = "CardHeader";
26
- const CardTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
27
- "h3",
28
- {
29
- ref,
30
- className: cn("font-semibold leading-none tracking-tight", className),
31
- ...props
32
- }
33
- ));
34
- CardTitle.displayName = "CardTitle";
35
- const CardDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
36
- "p",
37
- {
38
- ref,
39
- className: cn("text-sm text-muted-foreground", className),
40
- ...props
41
- }
42
- ));
43
- CardDescription.displayName = "CardDescription";
44
- const CardContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
45
- CardContent.displayName = "CardContent";
46
- const CardFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
47
- "div",
48
- {
49
- ref,
50
- className: cn("flex items-center p-6 pt-0", className),
51
- ...props
52
- }
53
- ));
54
- CardFooter.displayName = "CardFooter";
55
-
56
- export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
package/dist/checkbox.js DELETED
@@ -1,55 +0,0 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
- import * as React from 'react';
3
- import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
4
- import { Check } from 'lucide-react';
5
- import { cn } from './lib/utils.js';
6
-
7
- const Checkbox = React.forwardRef(({ className, disabled, checked, ...props }, ref) => {
8
- const id = React.useId();
9
- const buildClassNameRoot = () => {
10
- if (disabled && checked) {
11
- return "border-gray-400 bg-gray-200 cursor-not-allowed opacity-50";
12
- }
13
- if (disabled) {
14
- return "bg-gray-200 cursor-not-allowed opacity-50";
15
- }
16
- if (checked) {
17
- return "bg-primary border-primary text-primary-foreground";
18
- }
19
- return "hover:border-primary";
20
- };
21
- return /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
22
- /* @__PURE__ */ jsx(
23
- CheckboxPrimitive.Root,
24
- {
25
- ref,
26
- className: cn(
27
- `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()}`,
28
- className
29
- ),
30
- disabled,
31
- checked,
32
- ...props,
33
- id,
34
- children: /* @__PURE__ */ jsx(
35
- CheckboxPrimitive.Indicator,
36
- {
37
- className: cn("flex items-center justify-center text-current"),
38
- children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" })
39
- }
40
- )
41
- }
42
- ),
43
- /* @__PURE__ */ jsx(
44
- "label",
45
- {
46
- className: `text-[15px] leading-none cursor-pointer pl-2 ${disabled ? "cursor-not-allowed" : ""}`,
47
- htmlFor: id,
48
- children: props.children
49
- }
50
- )
51
- ] });
52
- });
53
- Checkbox.displayName = CheckboxPrimitive.Root.displayName;
54
-
55
- export { Checkbox };
package/dist/collapse.js DELETED
@@ -1,60 +0,0 @@
1
- import { jsx, jsxs } from 'react/jsx-runtime';
2
- import * as React from 'react';
3
- import * as AccordionPrimitive from '@radix-ui/react-accordion';
4
- import { ChevronDownIcon } from '@radix-ui/react-icons';
5
- import { cn } from './lib/utils.js';
6
-
7
- const Accordion = AccordionPrimitive.Root;
8
- const AccordionItem = React.forwardRef(({ className, warning, ...props }, ref) => /* @__PURE__ */ jsx(
9
- AccordionPrimitive.Item,
10
- {
11
- ref,
12
- className: cn(!warning && "border-b", className),
13
- "data-warning": warning,
14
- ...props
15
- }
16
- ));
17
- AccordionItem.displayName = "AccordionItem";
18
- const AccordionTrigger = React.forwardRef(({ className, warning, children, ...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
19
- AccordionPrimitive.Trigger,
20
- {
21
- ref,
22
- className: cn(
23
- "flex flex-1 items-center justify-between text-sm font-medium transition-all [&[data-state=open]>svg#ChevronDownIcon]:rotate-180",
24
- warning ? "[&[data-state=closed]]:py-4 py-1" : "hover:underline py-4 ",
25
- className
26
- ),
27
- ...props,
28
- children: [
29
- children,
30
- /* @__PURE__ */ jsx(ChevronDownIcon, { id: "ChevronDownIcon", className: "h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200" })
31
- ]
32
- }
33
- ) }));
34
- AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
35
- const AccordionContent = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
36
- AccordionPrimitive.Content,
37
- {
38
- ref,
39
- className: "overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
40
- ...props,
41
- children: /* @__PURE__ */ jsx("div", { className: cn("pb-4 pt-0", className), children })
42
- }
43
- ));
44
- AccordionContent.displayName = AccordionPrimitive.Content.displayName;
45
- const Collapse = ({ items, defaultActiveKey, className }) => {
46
- return /* @__PURE__ */ jsx(
47
- Accordion,
48
- {
49
- type: "multiple",
50
- className,
51
- defaultValue: defaultActiveKey,
52
- children: items.map((i) => /* @__PURE__ */ jsxs(AccordionItem, { value: i.key, warning: i.warning ?? false, children: [
53
- /* @__PURE__ */ jsx(AccordionTrigger, { warning: i.warning ?? false, children: i.label }),
54
- /* @__PURE__ */ jsx(AccordionContent, { children: i.children })
55
- ] }, i.key))
56
- }
57
- );
58
- };
59
-
60
- export { Collapse };
@@ -1,7 +0,0 @@
1
- import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
2
-
3
- const Collapsible = CollapsiblePrimitive.Root;
4
- const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
5
- const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;
6
-
7
- export { Collapsible, CollapsibleContent, CollapsibleTrigger };
package/dist/command.js DELETED
@@ -1,107 +0,0 @@
1
- import { jsx, jsxs } from 'react/jsx-runtime';
2
- import * as React from 'react';
3
- import { MagnifyingGlassIcon } from '@radix-ui/react-icons';
4
- import { Command as Command$1 } from 'cmdk';
5
- import { cn } from './lib/utils.js';
6
- import { Dialog, DialogContent } from './dialog.js';
7
-
8
- const Command = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
9
- Command$1,
10
- {
11
- ref,
12
- className: cn(
13
- "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
14
- className
15
- ),
16
- ...props
17
- }
18
- ));
19
- Command.displayName = Command$1.displayName;
20
- const CommandDialog = ({ children, ...props }) => {
21
- 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 }) }) });
22
- };
23
- CommandDialog.displayName = "CommandDialog";
24
- const CommandInput = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
25
- /* @__PURE__ */ jsx(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
26
- /* @__PURE__ */ jsx(
27
- Command$1.Input,
28
- {
29
- ref,
30
- className: cn(
31
- "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",
32
- className
33
- ),
34
- ...props
35
- }
36
- )
37
- ] }));
38
- CommandInput.displayName = Command$1.Input.displayName;
39
- const CommandList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
40
- Command$1.List,
41
- {
42
- ref,
43
- className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className),
44
- ...props
45
- }
46
- ));
47
- CommandList.displayName = Command$1.List.displayName;
48
- const CommandEmpty = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(
49
- Command$1.Empty,
50
- {
51
- ref,
52
- className: "py-6 text-center text-sm",
53
- ...props
54
- }
55
- ));
56
- CommandEmpty.displayName = Command$1.Empty.displayName;
57
- const CommandGroup = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
58
- Command$1.Group,
59
- {
60
- ref,
61
- className: cn(
62
- "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",
63
- className
64
- ),
65
- ...props
66
- }
67
- ));
68
- CommandGroup.displayName = Command$1.Group.displayName;
69
- const CommandSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
70
- Command$1.Separator,
71
- {
72
- ref,
73
- className: cn("-mx-1 h-px bg-border", className),
74
- ...props
75
- }
76
- ));
77
- CommandSeparator.displayName = Command$1.Separator.displayName;
78
- const CommandItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
79
- Command$1.Item,
80
- {
81
- ref,
82
- className: cn(
83
- "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",
84
- className
85
- ),
86
- ...props
87
- }
88
- ));
89
- CommandItem.displayName = Command$1.Item.displayName;
90
- const CommandShortcut = ({
91
- className,
92
- ...props
93
- }) => {
94
- return /* @__PURE__ */ jsx(
95
- "span",
96
- {
97
- className: cn(
98
- "ml-auto text-xs tracking-widest text-muted-foreground",
99
- className
100
- ),
101
- ...props
102
- }
103
- );
104
- };
105
- CommandShortcut.displayName = "CommandShortcut";
106
-
107
- export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };
@@ -1,75 +0,0 @@
1
- import { useState, useRef, useMemo, useCallback, useEffect } from 'react';
2
-
3
- function useOptimizedTable({
4
- columns,
5
- isLoading
6
- }) {
7
- const [scrollLeft, setScrollLeft] = useState(0);
8
- const tableRef = useRef(null);
9
- const scrollAreaRef = useRef(null);
10
- const rafRef = useRef(null);
11
- const fixedColumnsPositions = useMemo(() => {
12
- const positions = {};
13
- let accumulatedWidth = 0;
14
- columns.forEach((column) => {
15
- if (column.fixed) {
16
- positions[column.key] = accumulatedWidth;
17
- accumulatedWidth += typeof column.width === "number" ? column.width : 150;
18
- }
19
- });
20
- return positions;
21
- }, [columns]);
22
- const handleScroll = useCallback((e) => {
23
- if (rafRef.current) {
24
- cancelAnimationFrame(rafRef.current);
25
- }
26
- rafRef.current = requestAnimationFrame(() => {
27
- const target = e.target;
28
- setScrollLeft(target.scrollLeft);
29
- });
30
- }, []);
31
- useEffect(() => {
32
- const scrollElement = scrollAreaRef.current?.querySelector(
33
- "[data-radix-scroll-area-viewport]"
34
- );
35
- if (scrollElement) {
36
- scrollElement.addEventListener("scroll", handleScroll, {
37
- passive: true,
38
- capture: false
39
- });
40
- return () => {
41
- scrollElement.removeEventListener("scroll", handleScroll);
42
- if (rafRef.current) {
43
- cancelAnimationFrame(rafRef.current);
44
- }
45
- };
46
- }
47
- }, [handleScroll]);
48
- useEffect(() => {
49
- if (!tableRef.current || isLoading) return;
50
- requestAnimationFrame(() => {
51
- if (!tableRef.current) return;
52
- const style = tableRef.current.style;
53
- Object.entries(fixedColumnsPositions).forEach(([columnKey, position]) => {
54
- style.setProperty(`--fixed-${columnKey}-left`, `${position}px`);
55
- });
56
- tableRef.current.classList.toggle("scrolled", scrollLeft > 0);
57
- });
58
- }, [fixedColumnsPositions, scrollLeft, isLoading]);
59
- useEffect(
60
- () => () => {
61
- if (rafRef.current) {
62
- cancelAnimationFrame(rafRef.current);
63
- }
64
- },
65
- []
66
- );
67
- return {
68
- tableRef,
69
- scrollAreaRef,
70
- scrollLeft,
71
- fixedColumnsPositions
72
- };
73
- }
74
-
75
- export { useOptimizedTable };