lecom-ui 5.3.59 → 5.3.61

package/dist/components/DataTable/DataTable.utils.js

@@ -40,7 +40,19 @@ function renderSortArrow({
     event.stopPropagation();
     const sortingHandler = column.getToggleSortingHandler?.();
     if (externalColumn.onSort) {
-      externalColumn.onSort({ table, column });
+      const newSortState = externalColumn.onSort({ table, column });
+      if (newSortState !== void 0) {
+        if (newSortState === null) {
+          table.setSorting([]);
+        } else {
+          table.setSorting([
+            {
+              id: column.id,
+              desc: newSortState === "desc"
+            }
+          ]);
+        }
+      }
     } else if (sortingHandler) {
       sortingHandler(event);
     }

package/dist/components/MultiSelect/MultiSelect.js

@@ -4,6 +4,7 @@ import { Command, CommandInput, CommandList, CommandEmpty, CommandGroup, Command
 import { Popover, PopoverTrigger, PopoverContent } from '../Popover/Popover.js';
 import { Separator } from '../Separator/Separator.js';
 import { Tag } from '../Tag/Tag.js';
+import { Typography } from '../Typography/Typography.js';
 import { cn } from '../../lib/utils.js';
 import { X, ChevronUp, ChevronDown, Check, Minus } from 'lucide-react';
 import { initializeI18n } from '../../i18n/index.js';
@@ -310,51 +311,49 @@ const MultiSelect = React.forwardRef(
       },
       [highlightMatches, norm]
     );
-    const renderTree = (nodes, depth = 0) => {
-      return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col" }, nodes.map((n) => {
-        const hasChildren = !!(n.children && n.children.length);
-        const fully = isNodeFullySelected(n);
-        const partial = !fully && isNodePartiallySelected(n);
-        const isSelectedLeaf = !hasChildren && selectedValues.includes(n.value);
-        return /* @__PURE__ */ React.createElement("div", { key: n.value, className: "select-none" }, /* @__PURE__ */ React.createElement(
+    const renderTree = (nodes, depth = 0) => /* @__PURE__ */ React.createElement("div", { className: "flex flex-col" }, nodes.map((n) => {
+      const hasChildren = !!(n.children && n.children.length);
+      const fully = isNodeFullySelected(n);
+      const partial = !fully && isNodePartiallySelected(n);
+      const isSelectedLeaf = !hasChildren && selectedValues.includes(n.value);
+      return /* @__PURE__ */ React.createElement("div", { key: n.value, className: "select-none" }, /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          className: cn(
+            "flex items-center gap-2 px-2 py-1 cursor-pointer rounded-sm text-grey-800 hover:bg-grey-100 text-sm",
+            (fully || isSelectedLeaf) && "bg-blue-50"
+          ),
+          style: { paddingLeft: depth * 14 + 8 }
+        },
+        /* @__PURE__ */ React.createElement(
           "div",
           {
             className: cn(
-              "flex items-center gap-2 px-2 py-1 cursor-pointer rounded-sm text-grey-800 hover:bg-grey-100 text-sm",
-              (fully || isSelectedLeaf) && "bg-blue-50"
+              "flex h-4 w-4 items-center justify-center rounded-sm border transition-colors flex-shrink-0",
+              fully ? "bg-blue-600 border-blue-600 text-primary-foreground" : "border-grey-400 bg-white"
             ),
-            style: { paddingLeft: depth * 14 + 8 }
+            onClick: (e) => {
+              e.stopPropagation();
+              toggleTreeNode(n);
+            }
           },
-          /* @__PURE__ */ React.createElement(
-            "div",
-            {
-              className: cn(
-                "flex h-4 w-4 items-center justify-center rounded-sm border transition-colors flex-shrink-0",
-                fully ? "bg-blue-600 border-blue-600 text-primary-foreground" : "border-grey-400 bg-white"
-              ),
-              onClick: (e) => {
-                e.stopPropagation();
-                toggleTreeNode(n);
-              }
-            },
-            fully && /* @__PURE__ */ React.createElement(Check, { className: "h-3 w-3" }),
-            partial && !fully && /* @__PURE__ */ React.createElement(Minus, { className: "h-3 w-3 text-blue-600" })
-          ),
-          /* @__PURE__ */ React.createElement(
-            "span",
-            {
-              className: "text-sm flex-1 truncate cursor-pointer overflow-hidden",
-              onClick: (e) => {
-                e.stopPropagation();
-                toggleTreeNode(n);
-              },
-              title: n.label
+          fully && /* @__PURE__ */ React.createElement(Check, { className: "h-3 w-3" }),
+          partial && !fully && /* @__PURE__ */ React.createElement(Minus, { className: "h-3 w-3 text-blue-600" })
+        ),
+        /* @__PURE__ */ React.createElement(
+          "span",
+          {
+            className: "text-sm flex-1 truncate cursor-pointer overflow-hidden",
+            onClick: (e) => {
+              e.stopPropagation();
+              toggleTreeNode(n);
             },
-            highlightMatches ? highlight(n.label, treeQuery) : n.label
-          )
-        ), hasChildren && /* @__PURE__ */ React.createElement("div", null, renderTree(n.children, depth + 1)));
-      }));
-    };
+            title: n.label
+          },
+          highlightMatches ? highlight(n.label, treeQuery) : n.label
+        )
+      ), hasChildren && /* @__PURE__ */ React.createElement("div", null, renderTree(n.children, depth + 1)));
+    }));
     return /* @__PURE__ */ React.createElement(
       Popover,
       {
@@ -379,20 +378,27 @@ const MultiSelect = React.forwardRef(
         },
         selectedValues.length > 0 ? /* @__PURE__ */ React.createElement("div", { className: "flex justify-between items-center w-full" }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap items-center gap-1" }, selectedValues.slice(0, maxCount).map((value2) => {
           const label = findTreeLabel(value2) || options.find((o) => o.value === value2)?.label || value2;
-          return /* @__PURE__ */ React.createElement(Tag, { key: value2, color: "blue", className: "focus:ring-0" }, label, /* @__PURE__ */ React.createElement(
+          return /* @__PURE__ */ React.createElement(Tag, { key: value2, color: "blue", className: "focus:ring-0" }, /* @__PURE__ */ React.createElement(
+            Typography,
+            {
+              variant: "body-small-400",
+              textColor: "text-blue-600"
+            },
+            label
+          ), /* @__PURE__ */ React.createElement(
             X,
             {
-              className: "h-4 w-4 cursor-pointer",
+              className: "h-4 w-4 cursor-pointer flex-shrink-0",
               onClick: (event) => {
                 event.stopPropagation();
                 toggleOption(value2);
               }
             }
           ));
-        }), selectedValues.length > maxCount && /* @__PURE__ */ React.createElement(Tag, { color: "blue", className: "focus:ring-0" }, `+ ${selectedValues.length - maxCount}`, /* @__PURE__ */ React.createElement(
+        }), selectedValues.length > maxCount && /* @__PURE__ */ React.createElement(Tag, { color: "blue", className: "focus:ring-0" }, /* @__PURE__ */ React.createElement(Typography, { variant: "body-small-400", className: "text-blue-600" }, `+ ${selectedValues.length - maxCount}`), /* @__PURE__ */ React.createElement(
           X,
           {
-            className: "h-4 w-4 cursor-pointer",
+            className: "h-4 w-4 cursor-pointer flex-shrink-0",
             onClick: (event) => {
               event.stopPropagation();
               clearExtraOptions();

package/dist/index.d.ts

@@ -500,7 +500,7 @@ interface Column<TData, TValue> {
     cellClassName?: string;
     customHeaderRender?: ({ table, column, }: ColumnSort<TData, TValue>) => React.ReactNode;
     render?: (({ value, row }: ColumnRender<TData, TValue>) => React.ReactNode) | React.ReactNode;
-    onSort?: ({ table, column }: ColumnSort<TData, TValue>) => void;
+    onSort?: ({ table, column }: ColumnSort<TData, TValue>) => 'asc' | 'desc' | null | void;
     onSortClient?: ({ rowA, rowB, columnId }: ColumnSortClient<TData>) => number;
     checkedHeader?: ({ table, column }: CheckedHeader<TData, TValue>) => boolean;
     checkedCell?: ({ row }: CheckedCell<TData>) => boolean;
@@ -756,9 +756,9 @@ interface HeaderProps extends React$1.HTMLAttributes<HTMLElement>, VariantProps<
 }
 
 declare const inputVariants: (props?: ({
-    variant?: "default" | "filled" | "borderless" | null | undefined;
-    size?: "default" | "small" | "large" | null | undefined;
-    radius?: "default" | "small" | "large" | "full" | null | undefined;
+    variant?: "filled" | "default" | "borderless" | null | undefined;
+    size?: "small" | "large" | "default" | null | undefined;
+    radius?: "small" | "large" | "default" | "full" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface InputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, 'size' | 'sufix' | 'prefix'>, VariantProps<typeof inputVariants> {
     sufix?: React$1.ReactNode;
@@ -959,7 +959,7 @@ declare const RadioGroup: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimi
 declare const RadioGroupItem: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
 
 declare const ResizablePanelGroup: ({ className, ...props }: React$1.ComponentProps<typeof ResizablePrimitive.PanelGroup>) => React$1.JSX.Element;
-declare const ResizablePanel: React$1.ForwardRefExoticComponent<Omit<React$1.HTMLAttributes<HTMLDivElement | HTMLElement | HTMLButtonElement | HTMLSpanElement | HTMLOListElement | HTMLLIElement | HTMLAnchorElement | HTMLInputElement | HTMLHeadingElement | HTMLParagraphElement | HTMLLabelElement | HTMLUListElement | HTMLObjectElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLCanvasElement | HTMLTableCaptionElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLImageElement | HTMLLegendElement | HTMLLinkElement | HTMLMapElement | HTMLMenuElement | HTMLMetaElement | HTMLMeterElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLPictureElement | HTMLPreElement | HTMLProgressElement | HTMLScriptElement | HTMLSelectElement | HTMLSlotElement | HTMLSourceElement | HTMLStyleElement | HTMLTableElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTitleElement | HTMLTableRowElement | HTMLTrackElement | HTMLVideoElement>, "id" | "onResize"> & {
+declare const ResizablePanel: React$1.ForwardRefExoticComponent<Omit<React$1.HTMLAttributes<HTMLElement | HTMLOListElement | HTMLLIElement | HTMLAnchorElement | HTMLSpanElement | HTMLDivElement | HTMLButtonElement | HTMLLabelElement | HTMLParagraphElement | HTMLHeadingElement | HTMLInputElement | HTMLUListElement | HTMLObjectElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLCanvasElement | HTMLTableCaptionElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLImageElement | HTMLLegendElement | HTMLLinkElement | HTMLMapElement | HTMLMenuElement | HTMLMetaElement | HTMLMeterElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLPictureElement | HTMLPreElement | HTMLProgressElement | HTMLScriptElement | HTMLSelectElement | HTMLSlotElement | HTMLSourceElement | HTMLStyleElement | HTMLTableElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTitleElement | HTMLTableRowElement | HTMLTrackElement | HTMLVideoElement>, "id" | "onResize"> & {
     className?: string;
     collapsedSize?: number | undefined;
     collapsible?: boolean | undefined;
@@ -1054,7 +1054,7 @@ declare const TooltipTrigger: React$1.ForwardRefExoticComponent<TooltipPrimitive
 declare const TooltipArrow: React$1.ForwardRefExoticComponent<TooltipPrimitive.TooltipArrowProps & React$1.RefAttributes<SVGSVGElement>>;
 declare const TooltipPortal: React$1.FC<TooltipPrimitive.TooltipPortalProps>;
 declare const tooltipContentVariants: (props?: ({
-    color?: "white" | "black" | null | undefined;
+    color?: "black" | "white" | null | undefined;
     arrow?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface TooltipContentProps extends React$1.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>, VariantProps<typeof tooltipContentVariants> {
@@ -1124,10 +1124,10 @@ declare const TabsTrigger: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.
 declare const TabsContent: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 
 declare const textareaVariants: (props?: ({
-    variant?: "default" | "filled" | "borderless" | null | undefined;
-    size?: "default" | "small" | "large" | null | undefined;
-    radius?: "default" | "small" | "large" | "full" | null | undefined;
-    resize?: "default" | "both" | "horizontal" | "vertical" | "vertical-limited" | null | undefined;
+    variant?: "filled" | "default" | "borderless" | null | undefined;
+    size?: "small" | "large" | "default" | null | undefined;
+    radius?: "small" | "large" | "default" | "full" | null | undefined;
+    resize?: "both" | "horizontal" | "vertical" | "default" | "vertical-limited" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface TextareaProps extends React$1.ComponentProps<'textarea'>, VariantProps<typeof textareaVariants> {
 }
@@ -1255,7 +1255,7 @@ declare const SheetClose: React$1.ForwardRefExoticComponent<DialogPrimitive.Dial
 declare const SheetPortal: React$1.FC<DialogPrimitive.DialogPortalProps>;
 declare const SheetOverlay: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 declare const sheetVariants: (props?: ({
-    side?: "left" | "right" | "top" | "bottom" | null | undefined;
+    side?: "top" | "right" | "bottom" | "left" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface SheetContentProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof sheetVariants> {
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lecom-ui",
-  "version": "5.3.59",
+  "version": "5.3.61",
   "license": "MIT",
   "type": "module",
   "module": "dist/index.js",
@@ -128,4 +128,4 @@
   "overrides": {
     "react-is": "^19.0.0-rc-69d4b800-20241021"
   }
-}
+}

package/dist/components/SyntaxHighlighter/SyntaxHighlighter.js

@@ -1,27 +0,0 @@
-import { Prism } from 'react-syntax-highlighter';
-import * as themes from 'react-syntax-highlighter/dist/esm/styles/prism';
-export { themes };
-
-const SyntaxHighlighter = ({
-  style = "vscDarkPlus",
-  language = "javascript",
-  showLineNumbers = false,
-  wrapLines = false,
-  children,
-  ...props
-}) => {
-  const themeStyle = typeof style === "string" ? themes[style] || themes.vscDarkPlus : style;
-  return /* @__PURE__ */ React.createElement(
-    Prism,
-    {
-      language,
-      style: themeStyle,
-      showLineNumbers,
-      wrapLines,
-      ...props
-    },
-    children
-  );
-};
-
-export { SyntaxHighlighter };