@vuer-ai/vuer-uikit 0.0.45 → 0.0.48

package/dist/{chunk-RFVRJ4XV.js → chunk-25I4OTUA.js}

@@ -3,7 +3,7 @@
 var chunkILJK43VJ_js = require('./chunk-ILJK43VJ.js');
 var jsxRuntime = require('react/jsx-runtime');
 
-var PACKAGE_VERSION = "0.0.45" ;
+var PACKAGE_VERSION = "0.0.48" ;
 var PACKAGE_NAME = "@vuer-ai/vuer-uikit" ;
 function VersionBadge({
   className,

package/dist/chunk-4HJQPZQ2.js

@@ -0,0 +1,139 @@
+'use strict';
+
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/ui/drag-selectable/DragSelectProvider.tsx
+var DragSelectContext = react.createContext(void 0);
+var DragSelectProvider = ({ children }) => {
+  const [selectedItems, setSelectedItems] = react.useState(/* @__PURE__ */ new Set());
+  const [isDragging, setIsDragging] = react.useState(false);
+  const dragStartId = react.useRef(null);
+  const dragMode = react.useRef("replace");
+  const dragStartSelection = react.useRef(/* @__PURE__ */ new Set());
+  const registeredItems = react.useRef(/* @__PURE__ */ new Map());
+  const registerItem = react.useCallback((id, index) => {
+    registeredItems.current.set(id, index);
+  }, []);
+  const unregisterItem = react.useCallback((id) => {
+    registeredItems.current.delete(id);
+  }, []);
+  const startDrag = react.useCallback(
+    (startId, mode = "replace") => {
+      setIsDragging(true);
+      dragStartId.current = startId;
+      dragMode.current = mode;
+      dragStartSelection.current = new Set(selectedItems);
+      if (mode === "replace") {
+        setSelectedItems(/* @__PURE__ */ new Set([startId]));
+      } else if (mode === "add") {
+        setSelectedItems((prev) => new Set(Array.from(prev).concat([startId])));
+      } else if (mode === "toggle") {
+        setSelectedItems((prev) => {
+          const newSelection = new Set(prev);
+          if (newSelection.has(startId)) {
+            newSelection.delete(startId);
+          } else {
+            newSelection.add(startId);
+          }
+          return newSelection;
+        });
+      }
+    },
+    [selectedItems]
+  );
+  const updateSelection = react.useCallback(
+    (currentId) => {
+      if (!isDragging || !dragStartId.current) return;
+      const startIndex = registeredItems.current.get(dragStartId.current);
+      const currentIndex = registeredItems.current.get(currentId);
+      if (startIndex === void 0 || currentIndex === void 0) return;
+      const minIndex = Math.min(startIndex, currentIndex);
+      const maxIndex = Math.max(startIndex, currentIndex);
+      const dragSelection = /* @__PURE__ */ new Set();
+      Array.from(registeredItems.current.entries()).forEach(([itemId, itemIndex]) => {
+        if (itemIndex >= minIndex && itemIndex <= maxIndex) {
+          dragSelection.add(itemId);
+        }
+      });
+      if (dragMode.current === "replace") {
+        setSelectedItems(dragSelection);
+      } else if (dragMode.current === "add") {
+        setSelectedItems(
+          () => new Set(Array.from(dragStartSelection.current).concat(Array.from(dragSelection)))
+        );
+      } else if (dragMode.current === "toggle") {
+        setSelectedItems(() => {
+          const newSelection = new Set(dragStartSelection.current);
+          Array.from(dragSelection).forEach((itemId) => {
+            if (newSelection.has(itemId)) {
+              newSelection.delete(itemId);
+            } else {
+              newSelection.add(itemId);
+            }
+          });
+          return newSelection;
+        });
+      }
+    },
+    [isDragging]
+  );
+  const endDrag = react.useCallback(() => {
+    setIsDragging(false);
+    dragStartId.current = null;
+  }, []);
+  const clearSelection = react.useCallback(() => {
+    setSelectedItems(/* @__PURE__ */ new Set());
+  }, []);
+  const isSelected = react.useCallback(
+    (id) => {
+      return selectedItems.has(id);
+    },
+    [selectedItems]
+  );
+  react.useEffect(() => {
+    const handleMouseUp = () => {
+      if (isDragging) {
+        endDrag();
+      }
+    };
+    const handleKeyDown = (e) => {
+      if (e.key === "Escape") {
+        clearSelection();
+      }
+    };
+    document.addEventListener("mouseup", handleMouseUp);
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.removeEventListener("mouseup", handleMouseUp);
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [isDragging, endDrag, clearSelection]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    DragSelectContext.Provider,
+    {
+      value: {
+        selectedItems,
+        isDragging,
+        registerItem,
+        unregisterItem,
+        startDrag,
+        updateSelection,
+        endDrag,
+        clearSelection,
+        isSelected
+      },
+      children
+    }
+  );
+};
+var useDragSelectContext = () => {
+  const context = react.useContext(DragSelectContext);
+  if (context === void 0) {
+    throw new Error("useDragSelectContext must be used within a DragSelectProvider");
+  }
+  return context;
+};
+
+exports.DragSelectProvider = DragSelectProvider;
+exports.useDragSelectContext = useDragSelectContext;

package/dist/chunk-53PX4SCN.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var chunk7KYAICHB_js = require('./chunk-7KYAICHB.js');
+var lucideReact = require('lucide-react');
+var ResizablePrimitive = require('react-resizable-panels');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var ResizablePrimitive__namespace = /*#__PURE__*/_interopNamespace(ResizablePrimitive);
+
+function ResizablePanelGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ResizablePrimitive__namespace.PanelGroup,
+    {
+      "data-slot": "resizable-panel-group",
+      className: chunk7KYAICHB_js.cn("flex h-full w-full data-[panel-group-direction=vertical]:flex-col", className),
+      ...props
+    }
+  );
+}
+function ResizablePanel(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(ResizablePrimitive__namespace.Panel, { "data-slot": "resizable-panel", ...props });
+}
+function ResizableHandle({ withHandle, className, children, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    ResizablePrimitive__namespace.PanelResizeHandle,
+    {
+      "data-slot": "resizable-handle",
+      className: chunk7KYAICHB_js.cn(
+        "bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        !children && withHandle && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-border z-10 flex h-4 w-3 items-center justify-center rounded-xs border", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.GripVerticalIcon, { className: "size-2.5" }) })
+      ]
+    }
+  );
+}
+
+exports.ResizableHandle = ResizableHandle;
+exports.ResizablePanel = ResizablePanel;
+exports.ResizablePanelGroup = ResizablePanelGroup;

package/dist/chunk-7NHWT7CO.mjs

@@ -0,0 +1,26 @@
+import { cn } from './chunk-WM2VP7MI.mjs';
+import * as SeparatorPrimitive from '@radix-ui/react-separator';
+import { jsx } from 'react/jsx-runtime';
+
+function Separator({
+  className,
+  orientation = "horizontal",
+  decorative = true,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    SeparatorPrimitive.Root,
+    {
+      "data-slot": "separator-root",
+      decorative,
+      orientation,
+      className: cn(
+        "bg-line-primary shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+export { Separator };

package/dist/{chunk-NSN3O6CZ.mjs → chunk-AQENEOV3.mjs}

@@ -170,9 +170,9 @@ var CursorProvider = ({
   );
   let styleClass;
   if (hoveredElementId) {
-    styleClass = `opacity-[0.05] rounded-md transition-[width,height,left,top] duration-${transitionDuration} ease-out`;
+    styleClass = `opacity-[0.05] rounded-uk-md transition-[width,height,left,top] duration-${transitionDuration} ease-out`;
   } else {
-    styleClass = `opacity-90 rounded-xl z-10 transition-[width,height,left,top] duration-${transitionDuration} ease-out transition-opacity duration-${transitionDuration}`;
+    styleClass = `opacity-90 rounded-full z-10 transition-[width,height,left,top] duration-${transitionDuration} ease-out transition-opacity duration-${transitionDuration}`;
   }
   const cursorElement = isClient && isMouseInside && /* @__PURE__ */ jsx(
     "div",

package/dist/{chunk-NKNUMZJL.mjs → chunk-DDG2W6BX.mjs}

@@ -69,33 +69,42 @@ var TreeViewRoot = forwardRef(
       walkTreeItems(data, initialSelectedItemId);
       return ids;
     }, [data, expandAll, initialSelectedItemId]);
-    return /* @__PURE__ */ jsxs("div", { className: cn("px-sm relative w-[300px] overflow-hidden", className), children: [
-      /* @__PURE__ */ jsx(
-        TreeItem,
-        {
-          data,
-          ref,
-          selectedItemId,
-          handleSelectChange,
-          expandedItemIds,
-          defaultLeafIcon,
-          defaultNodeIcon,
-          handleDragStart,
-          handleDrop,
-          draggedItem,
-          ...props
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: "h-[48px] w-full",
-          onDrop: () => {
-            handleDrop({ id: "", name: "parent_div" });
-          }
-        }
-      )
-    ] });
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "px-sm relative w-[300px] w-full overflow-x-auto overflow-y-hidden",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx(
+            TreeItem,
+            {
+              data,
+              ref,
+              selectedItemId,
+              handleSelectChange,
+              expandedItemIds,
+              defaultLeafIcon,
+              defaultNodeIcon,
+              handleDragStart,
+              handleDrop,
+              draggedItem,
+              ...props
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "h-[0px] w-full",
+              onDrop: () => {
+                handleDrop({ id: "", name: "parent_div" });
+              }
+            }
+          )
+        ]
+      }
+    );
   }
 );
 TreeViewRoot.displayName = "TreeViewRoot";

package/dist/{chunk-KDRYDUQT.js → chunk-DWK23X7J.js}

@@ -91,3 +91,4 @@ var Button = react.forwardRef(function Button2({ className, variant, size, icon,
 });
 
 exports.Button = Button;
+exports.buttonVariants = buttonVariants;

package/dist/{chunk-R3SHGA4V.js → chunk-EOTROHFU.js}

@@ -91,33 +91,42 @@ var TreeViewRoot = react.forwardRef(
       walkTreeItems(data, initialSelectedItemId);
       return ids;
     }, [data, expandAll, initialSelectedItemId]);
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunk7KYAICHB_js.cn("px-sm relative w-[300px] overflow-hidden", className), children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        TreeItem,
-        {
-          data,
-          ref,
-          selectedItemId,
-          handleSelectChange,
-          expandedItemIds,
-          defaultLeafIcon,
-          defaultNodeIcon,
-          handleDragStart,
-          handleDrop,
-          draggedItem,
-          ...props
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          className: "h-[48px] w-full",
-          onDrop: () => {
-            handleDrop({ id: "", name: "parent_div" });
-          }
-        }
-      )
-    ] });
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: chunk7KYAICHB_js.cn(
+          "px-sm relative w-[300px] w-full overflow-x-auto overflow-y-hidden",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            TreeItem,
+            {
+              data,
+              ref,
+              selectedItemId,
+              handleSelectChange,
+              expandedItemIds,
+              defaultLeafIcon,
+              defaultNodeIcon,
+              handleDragStart,
+              handleDrop,
+              draggedItem,
+              ...props
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: "h-[0px] w-full",
+              onDrop: () => {
+                handleDrop({ id: "", name: "parent_div" });
+              }
+            }
+          )
+        ]
+      }
+    );
   }
 );
 TreeViewRoot.displayName = "TreeViewRoot";

package/dist/chunk-GCIH5IMQ.mjs

@@ -0,0 +1,118 @@
+import { buttonVariants } from './chunk-PZ3FWTMB.mjs';
+import { cn } from './chunk-WM2VP7MI.mjs';
+import { useTabsCursor, TabsCursorProvider } from './chunk-XMG3IVGZ.mjs';
+import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from 'lucide-react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function Pagination({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      role: "navigation",
+      "aria-label": "pagination",
+      "data-slot": "pagination",
+      className: cn("mx-auto flex w-full justify-center", className),
+      ...props
+    }
+  );
+}
+function PaginationContent({ className, ...props }) {
+  const { setCursorTarget } = useTabsCursor();
+  return /* @__PURE__ */ jsx(TabsCursorProvider, { children: /* @__PURE__ */ jsx(
+    "ul",
+    {
+      onMouseLeave: () => setCursorTarget(null),
+      "data-slot": "pagination-content",
+      className: cn("gap-xs flex flex-row items-center", className),
+      style: {
+        marginBottom: "0px"
+      },
+      ...props
+    }
+  ) });
+}
+function PaginationItem({ ...props }) {
+  const { setCursorTarget } = useTabsCursor();
+  return /* @__PURE__ */ jsx(
+    "li",
+    {
+      onMouseEnter: (e) => setCursorTarget(e.currentTarget),
+      "data-slot": "pagination-item",
+      className: "rounded-uk-sm",
+      style: {
+        marginBottom: "0px"
+      },
+      ...props
+    }
+  );
+}
+function PaginationLink({
+  className,
+  isActive,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      "aria-current": isActive ? "page" : void 0,
+      "data-slot": "pagination-link",
+      "data-active": isActive,
+      className: cn(
+        buttonVariants({
+          variant: isActive ? "secondary" : "ghost"
+        }),
+        "hover:bg-transparent",
+        "hover:text-text-primary",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function PaginationPrevious({ className, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    PaginationLink,
+    {
+      "aria-label": "Go to previous page",
+      size: "base",
+      className: cn("gap-1 px-2.5 sm:pl-2.5", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(ChevronLeftIcon, {}),
+        /* @__PURE__ */ jsx("span", { className: "hidden sm:block", children: "Previous" })
+      ]
+    }
+  );
+}
+function PaginationNext({ className, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    PaginationLink,
+    {
+      "aria-label": "Go to next page",
+      size: "base",
+      className: cn("gap-1 px-2.5 sm:pr-2.5", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "hidden sm:block", children: "Next" }),
+        /* @__PURE__ */ jsx(ChevronRightIcon, {})
+      ]
+    }
+  );
+}
+function PaginationEllipsis({ className, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      "aria-hidden": true,
+      "data-slot": "pagination-ellipsis",
+      className: cn("text-text-primary flex size-9 items-center justify-center", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(MoreHorizontalIcon, { className: "size-4" }),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "More pages" })
+      ]
+    }
+  );
+}
+
+export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious };

package/dist/chunk-HOQHWWLY.mjs

@@ -0,0 +1,37 @@
+import { cn } from './chunk-WM2VP7MI.mjs';
+import { GripVerticalIcon } from 'lucide-react';
+import * as ResizablePrimitive from 'react-resizable-panels';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function ResizablePanelGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ResizablePrimitive.PanelGroup,
+    {
+      "data-slot": "resizable-panel-group",
+      className: cn("flex h-full w-full data-[panel-group-direction=vertical]:flex-col", className),
+      ...props
+    }
+  );
+}
+function ResizablePanel(props) {
+  return /* @__PURE__ */ jsx(ResizablePrimitive.Panel, { "data-slot": "resizable-panel", ...props });
+}
+function ResizableHandle({ withHandle, className, children, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    ResizablePrimitive.PanelResizeHandle,
+    {
+      "data-slot": "resizable-handle",
+      className: cn(
+        "bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        !children && withHandle && /* @__PURE__ */ jsx("div", { className: "bg-border z-10 flex h-4 w-3 items-center justify-center rounded-xs border", children: /* @__PURE__ */ jsx(GripVerticalIcon, { className: "size-2.5" }) })
+      ]
+    }
+  );
+}
+
+export { ResizableHandle, ResizablePanel, ResizablePanelGroup };

package/dist/{chunk-AKBWNVRH.js → chunk-HYVF2TGW.js}

@@ -172,9 +172,9 @@ var CursorProvider = ({
   );
   let styleClass;
   if (hoveredElementId) {
-    styleClass = `opacity-[0.05] rounded-md transition-[width,height,left,top] duration-${transitionDuration} ease-out`;
+    styleClass = `opacity-[0.05] rounded-uk-md transition-[width,height,left,top] duration-${transitionDuration} ease-out`;
   } else {
-    styleClass = `opacity-90 rounded-xl z-10 transition-[width,height,left,top] duration-${transitionDuration} ease-out transition-opacity duration-${transitionDuration}`;
+    styleClass = `opacity-90 rounded-full z-10 transition-[width,height,left,top] duration-${transitionDuration} ease-out transition-opacity duration-${transitionDuration}`;
   }
   const cursorElement = isClient && isMouseInside && /* @__PURE__ */ jsxRuntime.jsx(
     "div",