@particle-academy/react-fancy 1.9.1 → 2.1.0

package/dist/icons.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+var lucideReact = require('lucide-react');
+
+
+
+Object.keys(lucideReact).forEach(function (k) {
+	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+		enumerable: true,
+		get: function () { return lucideReact[k]; }
+	});
+});
+//# sourceMappingURL=icons.cjs.map
+//# sourceMappingURL=icons.cjs.map

package/dist/icons.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"icons.cjs","sourcesContent":[]}

package/dist/icons.d.cts

@@ -0,0 +1 @@
+export * from 'lucide-react';

package/dist/icons.d.ts

@@ -0,0 +1 @@
+export * from 'lucide-react';

package/dist/icons.js

@@ -0,0 +1,3 @@
+export * from 'lucide-react';
+//# sourceMappingURL=icons.js.map
+//# sourceMappingURL=icons.js.map

package/dist/icons.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"icons.js","sourcesContent":[]}

package/dist/index.cjs

@@ -3,31 +3,11 @@
 var react = require('react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
-var LucideIcons = require('lucide-react');
 var jsxRuntime = require('react/jsx-runtime');
 var reactDom = require('react-dom');
+var lucideReact = require('lucide-react');
 var marked = require('marked');
 
-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 LucideIcons__namespace = /*#__PURE__*/_interopNamespace(LucideIcons);
-
 var __defProp = Object.defineProperty;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __esm = (fn, res) => function __init() {
@@ -1195,22 +1175,31 @@ function search(query) {
 function find(char) {
   return EMOJI_ENTRIES.find((e) => e.char === char);
 }
+
+// src/components/Icon/icon-config.ts
 var registry = /* @__PURE__ */ new Map();
 var defaultSetName = "lucide";
 function kebabToPascal(str) {
   return str.split("-").map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
 }
-var lucideSet = {
-  resolve: (name) => {
-    const pascal = kebabToPascal(name);
-    const icon = LucideIcons__namespace[pascal];
-    if (typeof icon === "function" || typeof icon === "object" && icon !== null) {
-      return icon;
-    }
-    return null;
+function registerIcons(icons) {
+  let set = registry.get("lucide");
+  if (!set) {
+    const map2 = /* @__PURE__ */ new Map();
+    set = {
+      resolve: (name) => {
+        const pascal = kebabToPascal(name);
+        return map2.get(pascal) ?? null;
+      },
+      _map: map2
+    };
+    registry.set("lucide", set);
   }
-};
-registry.set("lucide", lucideSet);
+  const map = set._map;
+  for (const [key, component] of Object.entries(icons)) {
+    map.set(key, component);
+  }
+}
 function registerIconSet(name, set) {
   registry.set(name, set);
 }
@@ -4868,7 +4857,7 @@ var Callout = react.forwardRef(
                 "shrink-0 rounded p-0.5 opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-current"
               ),
               "aria-label": "Dismiss",
-              children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.X, { size: 16 })
+              children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { size: 16 })
             }
           )
         ]
@@ -5638,7 +5627,7 @@ function ModalHeader({ children, className }) {
             onClick: close,
             className: "rounded-lg p-1 text-zinc-400 transition-colors hover:bg-zinc-100 hover:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-300",
             "aria-label": "Close",
-            children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.X, { size: 20 })
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { size: 20 })
           }
         )
       ]
@@ -5815,10 +5804,10 @@ function ToastItem({ data, onDismiss }) {
       ),
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mt-0.5 shrink-0", VARIANT_ICON_COLORS[variant]), children: [
-          variant === "success" && /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Check, { size: 16 }),
-          variant === "error" && /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.XCircle, { size: 16 }),
-          variant === "warning" && /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.AlertTriangle, { size: 16 }),
-          variant === "info" && /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Info, { size: 16 })
+          variant === "success" && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { size: 16 }),
+          variant === "error" && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XCircle, { size: 16 }),
+          variant === "warning" && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertTriangle, { size: 16 }),
+          variant === "info" && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, { size: 16 })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
           /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-zinc-900 dark:text-zinc-100", children: title }),
@@ -5831,7 +5820,7 @@ function ToastItem({ data, onDismiss }) {
             onClick: () => onDismiss(id),
             className: "shrink-0 rounded p-0.5 text-zinc-400 transition-colors hover:text-zinc-600 dark:hover:text-zinc-300",
             "aria-label": "Dismiss",
-            children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.X, { size: 14 })
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { size: 14 })
           }
         )
       ] })
@@ -5898,7 +5887,7 @@ function CommandInput({
 }) {
   const { query, setQuery } = useCommand();
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-react-fancy-command-input": "", className: "flex items-center border-b border-zinc-200 px-4 dark:border-zinc-700", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Search, { size: 16, className: "shrink-0 text-zinc-400" }),
+    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { size: 16, className: "shrink-0 text-zinc-400" }),
     /* @__PURE__ */ jsxRuntime.jsx(
       "input",
       {
@@ -6251,7 +6240,7 @@ function AccordionTrigger({
       ),
       children: [
         children,
-        /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronDown, { size: 16, className: cn("shrink-0 transition-transform duration-200", isOpen && "rotate-180") })
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { size: 16, className: cn("shrink-0 transition-transform duration-200", isOpen && "rotate-180") })
       ]
     }
   );
@@ -6338,7 +6327,7 @@ function BreadcrumbsDropdown({ items, activeLabel }) {
         className: "flex items-center gap-1 rounded-lg px-2 py-1 text-sm font-medium text-zinc-900 hover:bg-zinc-100 dark:text-white dark:hover:bg-zinc-800",
         children: [
           activeLabel,
-          /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronDown, { size: 14, className: cn("transition-transform", open && "rotate-180") })
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { size: 14, className: cn("transition-transform", open && "rotate-180") })
         ]
       }
     ),
@@ -6363,7 +6352,7 @@ function BreadcrumbsRoot({
 }) {
   const items = react.Children.toArray(children);
   const [expanded, setExpanded] = react.useState(false);
-  const sep = separator ?? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronRight, { size: 12, className: "text-zinc-400" });
+  const sep = separator ?? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { size: 12, className: "text-zinc-400" });
   const lastItem = items[items.length - 1];
   const dropdownItems = items.map((child) => {
     const el = child;
@@ -6467,7 +6456,7 @@ function NavbarToggle({ className }) {
       ),
       "aria-label": "Toggle navigation",
       "aria-expanded": mobileOpen,
-      children: mobileOpen ? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.X, { size: 20 }) : /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Menu, { size: 20 })
+      children: mobileOpen ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { size: 20 }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Menu, { size: 20 })
     }
   );
 }
@@ -6547,7 +6536,7 @@ function Pagination({
         onClick: () => onPageChange(page - 1),
         className: cn(btnBase, btnDefault, page <= 1 && btnDisabled, "px-2"),
         "aria-label": "Previous page",
-        children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronLeft, { size: 16 })
+        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { size: 16 })
       }
     ),
     pages.map(
@@ -6580,7 +6569,7 @@ function Pagination({
           "px-2"
         ),
         "aria-label": "Next page",
-        children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronRight, { size: 16 })
+        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { size: 16 })
       }
     )
   ] });
@@ -6795,7 +6784,7 @@ var Pillbox = react.forwardRef(
                     },
                     className: "text-zinc-400 hover:text-zinc-600 dark:hover:text-zinc-300",
                     "aria-label": `Remove ${item}`,
-                    children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.X, { size: 12 })
+                    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { size: 12 })
                   }
                 )
               ]
@@ -6970,7 +6959,7 @@ function FileUploadDropzone({
           }
         ),
         children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Upload, { size: 32, strokeWidth: 1.5, className: "mb-2 text-zinc-400" }),
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Upload, { size: 32, strokeWidth: 1.5, className: "mb-2 text-zinc-400" }),
           /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-zinc-500", children: "Drop files here or click to browse" })
         ] })
       ]
@@ -6998,7 +6987,7 @@ function ThumbnailItem({ file, index, onRemove }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group relative flex w-20 flex-col items-center gap-1", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative h-20 w-20 overflow-hidden rounded-lg border border-zinc-200 bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-800", children: [
       isImage && objectUrl ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: objectUrl, alt: file.name, className: "h-full w-full object-cover" }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full flex-col items-center justify-center gap-1", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.File, { size: 20, className: "text-zinc-400" }),
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.File, { size: 20, className: "text-zinc-400" }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-medium text-zinc-500", children: getExtension(file.name) })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -7008,7 +6997,7 @@ function ThumbnailItem({ file, index, onRemove }) {
           onClick: () => onRemove(index),
           className: "absolute top-1 right-1 flex h-5 w-5 items-center justify-center rounded-full bg-black/60 text-white opacity-0 transition-opacity hover:bg-black/80 group-hover:opacity-100",
           "aria-label": `Remove ${file.name}`,
-          children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.X, { size: 10 })
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { size: 10 })
         }
       )
     ] }),
@@ -7026,7 +7015,7 @@ function FileUploadList({ thumbnail, className }) {
     {
       className: "flex items-center gap-3 rounded-lg border border-zinc-200 px-3 py-2 text-sm dark:border-zinc-700",
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.File, { size: 16, className: "shrink-0 text-zinc-400" }),
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.File, { size: 16, className: "shrink-0 text-zinc-400" }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 truncate", children: file.name }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-xs text-zinc-400", children: formatSize(file.size) }),
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -7036,7 +7025,7 @@ function FileUploadList({ thumbnail, className }) {
             onClick: () => removeFile(i),
             className: "shrink-0 text-zinc-400 hover:text-zinc-600 dark:hover:text-zinc-300",
             "aria-label": `Remove ${file.name}`,
-            children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.X, { size: 14 })
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { size: 14 })
           }
         )
       ]
@@ -7149,15 +7138,15 @@ var TimePicker = react.forwardRef(
         ),
         children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => changeHour(1), disabled, className: spinBtnClass, "aria-label": "Increase hour", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronUp, { size: 14 }) }),
+            /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => changeHour(1), disabled, className: spinBtnClass, "aria-label": "Increase hour", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { size: 14 }) }),
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: displayClass, children: pad(displayHour) }),
-            /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => changeHour(-1), disabled, className: spinBtnClass, "aria-label": "Decrease hour", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronDown, { size: 14 }) })
+            /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => changeHour(-1), disabled, className: spinBtnClass, "aria-label": "Decrease hour", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { size: 14 }) })
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-lg text-zinc-400", children: ":" }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => changeMinute(minuteStep), disabled, className: spinBtnClass, "aria-label": "Increase minute", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronUp, { size: 14 }) }),
+            /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => changeMinute(minuteStep), disabled, className: spinBtnClass, "aria-label": "Increase minute", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { size: 14 }) }),
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: displayClass, children: pad(minutes) }),
-            /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => changeMinute(-minuteStep), disabled, className: spinBtnClass, "aria-label": "Decrease minute", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronDown, { size: 14 }) })
+            /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => changeMinute(-minuteStep), disabled, className: spinBtnClass, "aria-label": "Decrease minute", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { size: 14 }) })
           ] }),
           format === "12h" && /* @__PURE__ */ jsxRuntime.jsx(
             "button",
@@ -7328,7 +7317,7 @@ var Calendar = react.forwardRef(
                 onClick: prevMonth,
                 className: "rounded-lg p-1 text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800",
                 "aria-label": "Previous month",
-                children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronLeft, { size: 16 })
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { size: 16 })
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-semibold", children: [
@@ -7343,7 +7332,7 @@ var Calendar = react.forwardRef(
                 onClick: nextMonth,
                 className: "rounded-lg p-1 text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800",
                 "aria-label": "Next month",
-                children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronRight, { size: 16 })
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { size: 16 })
               }
             )
           ] }),
@@ -8997,7 +8986,7 @@ function MenuSubmenu({
               children: [
                 icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center", children: icon }),
                 /* @__PURE__ */ jsxRuntime.jsx("span", { children: label }),
-                /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronDown, { className: "h-3.5 w-3.5 opacity-60" })
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-3.5 w-3.5 opacity-60" })
               ]
             }
           ),
@@ -9030,7 +9019,7 @@ function MenuSubmenu({
           icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center", children: icon }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-left", children: label }),
           /* @__PURE__ */ jsxRuntime.jsx(
-            LucideIcons.ChevronDown,
+            lucideReact.ChevronDown,
             {
               className: cn(
                 "h-3.5 w-3.5 opacity-60 transition-transform duration-200",
@@ -9197,7 +9186,7 @@ function SidebarSubmenu({
           icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center", children: icon }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-left", children: label }),
           /* @__PURE__ */ jsxRuntime.jsx(
-            LucideIcons.ChevronDown,
+            lucideReact.ChevronDown,
             {
               className: cn(
                 "h-3.5 w-3.5 opacity-60 transition-transform duration-200",
@@ -9235,7 +9224,7 @@ function SidebarToggle({ className }) {
         "hover:bg-zinc-100 hover:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-300",
         className
       ),
-      children: collapsed ? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.PanelLeftOpen, { className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.PanelLeftClose, { className: "h-4 w-4" })
+      children: collapsed ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PanelLeftOpen, { className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PanelLeftClose, { className: "h-4 w-4" })
     }
   );
 }
@@ -9337,7 +9326,7 @@ function MobileMenuFlyout({
                 type: "button",
                 onClick: onClose,
                 className: "flex h-8 w-8 items-center justify-center rounded-md text-zinc-400 transition-colors hover:bg-zinc-100 hover:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-300",
-                children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.X, { className: "h-4 w-4" })
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
               }
             )
           ] }),
@@ -9797,10 +9786,10 @@ function CanvasControls({
         className
       ),
       children: [
-        showZoomIn && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: zoomIn, className: btnClass, "aria-label": "Zoom in", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ZoomIn, { size: 16 }) }),
-        showZoomOut && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: zoomOut, className: btnClass, "aria-label": "Zoom out", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ZoomOut, { size: 16 }) }),
-        showReset && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: reset, className: btnClass, "aria-label": "Reset view", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.RotateCcw, { size: 16 }) }),
-        showFitAll && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: fitAll, className: btnClass, "aria-label": "Fit all", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Maximize, { size: 16 }) })
+        showZoomIn && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: zoomIn, className: btnClass, "aria-label": "Zoom in", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ZoomIn, { size: 16 }) }),
+        showZoomOut && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: zoomOut, className: btnClass, "aria-label": "Zoom out", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ZoomOut, { size: 16 }) }),
+        showReset && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: reset, className: btnClass, "aria-label": "Reset view", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RotateCcw, { size: 16 }) }),
+        showFitAll && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: fitAll, className: btnClass, "aria-label": "Fit all", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Maximize, { size: 16 }) })
       ]
     }
   );
@@ -10564,12 +10553,67 @@ function ChevronIcon({ open }) {
     }
   );
 }
+function isDescendantOf(nodes, ancestorId, targetId) {
+  function findNode(haystack, id) {
+    for (const n of haystack) {
+      if (n.id === id) return n;
+      if (n.children) {
+        const found = findNode(n.children, id);
+        if (found) return found;
+      }
+    }
+    return void 0;
+  }
+  function hasDescendant(node, id) {
+    if (!node.children) return false;
+    for (const child of node.children) {
+      if (child.id === id) return true;
+      if (hasDescendant(child, id)) return true;
+    }
+    return false;
+  }
+  const ancestor = findNode(nodes, ancestorId);
+  return ancestor ? hasDescendant(ancestor, targetId) : false;
+}
+function computeDropPosition(e, isFolder) {
+  const rect = e.currentTarget.getBoundingClientRect();
+  const offsetY = e.clientY - rect.top;
+  const third = rect.height / 3;
+  if (offsetY < third) return "before";
+  if (offsetY > third * 2) return "after";
+  return isFolder ? "inside" : "after";
+}
 function TreeNode({ node, depth }) {
-  const { selectedId, onSelect, onNodeContextMenu, expandedIds, toggle, indentSize, showIcons } = useTreeNav();
+  const {
+    selectedId,
+    onSelect,
+    onNodeContextMenu,
+    expandedIds,
+    toggle,
+    indentSize,
+    showIcons,
+    draggable,
+    dragState,
+    setDragState,
+    onNodeMove,
+    nodes,
+    expandNode
+  } = useTreeNav();
   const isFolder = node.type === "folder" || node.children && node.children.length > 0;
   const isExpanded = expandedIds.includes(node.id);
   const isSelected = selectedId === node.id;
   const paddingLeft = depth * indentSize + 4;
+  const isDragging = dragState.draggedNodeId === node.id;
+  const isDropTarget = dragState.dropTargetId === node.id;
+  const dropPosition = isDropTarget ? dragState.dropPosition : null;
+  const autoExpandTimer = react.useRef(null);
+  const clearAutoExpand = react.useCallback(() => {
+    if (autoExpandTimer.current) {
+      clearTimeout(autoExpandTimer.current);
+      autoExpandTimer.current = null;
+    }
+  }, []);
+  react.useEffect(() => clearAutoExpand, [clearAutoExpand]);
   const handleClick = () => {
     if (node.disabled) return;
     if (isFolder) {
@@ -10583,30 +10627,116 @@ function TreeNode({ node, depth }) {
       onNodeContextMenu(e, node);
     }
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-react-fancy-tree-node": "", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
-      {
-        type: "button",
-        onClick: handleClick,
-        onContextMenu: handleContextMenu,
-        disabled: node.disabled,
-        className: cn(
-          "flex w-full items-center gap-1 rounded-md py-0.5 text-left text-[13px] transition-colors",
-          isSelected ? "bg-blue-500/15 text-blue-600 dark:text-blue-400" : "text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800",
-          node.disabled && "pointer-events-none opacity-40"
-        ),
-        style: { paddingLeft },
-        children: [
-          isFolder && /* @__PURE__ */ jsxRuntime.jsx(ChevronIcon, { open: isExpanded }),
-          !isFolder && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-3.5 shrink-0" }),
-          showIcons && (node.icon ?? (isFolder ? /* @__PURE__ */ jsxRuntime.jsx(FolderIcon, { open: isExpanded }) : /* @__PURE__ */ jsxRuntime.jsx(FileIcon, { ext: node.ext ?? node.label.split(".").pop() }))),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: node.label })
-        ]
+  const handleDragStart = react.useCallback((e) => {
+    e.dataTransfer.setData("text/plain", node.id);
+    e.dataTransfer.effectAllowed = "move";
+    requestAnimationFrame(() => {
+      setDragState({ draggedNodeId: node.id, dropTargetId: null, dropPosition: null });
+    });
+  }, [node.id, setDragState]);
+  const handleDragEnd = react.useCallback(() => {
+    clearAutoExpand();
+    setDragState({ draggedNodeId: null, dropTargetId: null, dropPosition: null });
+  }, [clearAutoExpand, setDragState]);
+  const handleDragOver = react.useCallback((e) => {
+    if (!dragState.draggedNodeId) return;
+    const sourceId = dragState.draggedNodeId;
+    if (sourceId === node.id) return;
+    if (isDescendantOf(nodes, sourceId, node.id)) return;
+    e.preventDefault();
+    e.stopPropagation();
+    e.dataTransfer.dropEffect = "move";
+    const position = computeDropPosition(e, !!isFolder);
+    if (isFolder && !isExpanded && position === "inside") {
+      if (!autoExpandTimer.current) {
+        autoExpandTimer.current = setTimeout(() => {
+          expandNode(node.id);
+          autoExpandTimer.current = null;
+        }, 500);
       }
-    ),
-    isFolder && isExpanded && node.children && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-react-fancy-tree-node-children": "", children: node.children.map((child) => /* @__PURE__ */ jsxRuntime.jsx(TreeNode, { node: child, depth: depth + 1 }, child.id)) })
-  ] });
+    } else {
+      clearAutoExpand();
+    }
+    if (dragState.dropTargetId !== node.id || dragState.dropPosition !== position) {
+      setDragState({ draggedNodeId: sourceId, dropTargetId: node.id, dropPosition: position });
+    }
+  }, [dragState, node.id, isFolder, isExpanded, nodes, setDragState, expandNode, clearAutoExpand]);
+  const handleDragLeave = react.useCallback((e) => {
+    if (!e.currentTarget.contains(e.relatedTarget)) {
+      clearAutoExpand();
+      if (dragState.dropTargetId === node.id) {
+        setDragState({ ...dragState, dropTargetId: null, dropPosition: null });
+      }
+    }
+  }, [dragState, node.id, setDragState, clearAutoExpand]);
+  const handleDrop = react.useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    clearAutoExpand();
+    const sourceId = dragState.draggedNodeId;
+    const position = dragState.dropPosition;
+    if (!sourceId || !position) return;
+    if (sourceId === node.id) return;
+    if (isDescendantOf(nodes, sourceId, node.id)) return;
+    onNodeMove?.(sourceId, node.id, position);
+    setDragState({ draggedNodeId: null, dropTargetId: null, dropPosition: null });
+  }, [dragState, node.id, nodes, onNodeMove, setDragState, clearAutoExpand]);
+  const canDrag = draggable && !node.disabled;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-react-fancy-tree-node": "",
+      onDragOver: draggable ? handleDragOver : void 0,
+      onDragLeave: draggable ? handleDragLeave : void 0,
+      onDrop: draggable ? handleDrop : void 0,
+      children: [
+        isDropTarget && dropPosition === "before" && /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            "data-react-fancy-tree-drop-indicator": "before",
+            className: "pointer-events-none h-0.5 rounded-full bg-blue-500",
+            style: { marginLeft: paddingLeft }
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            type: "button",
+            draggable: canDrag,
+            onDragStart: canDrag ? handleDragStart : void 0,
+            onDragEnd: canDrag ? handleDragEnd : void 0,
+            onClick: handleClick,
+            onContextMenu: handleContextMenu,
+            disabled: node.disabled,
+            className: cn(
+              "flex w-full items-center gap-1 rounded-md py-0.5 text-left text-[13px] transition-colors",
+              isSelected ? "bg-blue-500/15 text-blue-600 dark:text-blue-400" : "text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800",
+              node.disabled && "pointer-events-none opacity-40",
+              isDragging && "opacity-50",
+              canDrag && "cursor-grab active:cursor-grabbing",
+              isDropTarget && dropPosition === "inside" && "bg-blue-500/10 ring-1 ring-blue-500/30 ring-inset"
+            ),
+            style: { paddingLeft },
+            children: [
+              isFolder && /* @__PURE__ */ jsxRuntime.jsx(ChevronIcon, { open: isExpanded }),
+              !isFolder && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-3.5 shrink-0" }),
+              showIcons && (node.icon ?? (isFolder ? /* @__PURE__ */ jsxRuntime.jsx(FolderIcon, { open: isExpanded }) : /* @__PURE__ */ jsxRuntime.jsx(FileIcon, { ext: node.ext ?? node.label.split(".").pop() }))),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: node.label })
+            ]
+          }
+        ),
+        isDropTarget && dropPosition === "after" && /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            "data-react-fancy-tree-drop-indicator": "after",
+            className: "pointer-events-none h-0.5 rounded-full bg-blue-500",
+            style: { marginLeft: paddingLeft }
+          }
+        ),
+        isFolder && isExpanded && node.children && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-react-fancy-tree-node-children": "", children: node.children.map((child) => /* @__PURE__ */ jsxRuntime.jsx(TreeNode, { node: child, depth: depth + 1 }, child.id)) })
+      ]
+    }
+  );
 }
 TreeNode.displayName = "TreeNode";
 function collectFolderIds(nodes) {
@@ -10619,11 +10749,18 @@ function collectFolderIds(nodes) {
   }
   return ids;
 }
+var EMPTY_DRAG_STATE = {
+  draggedNodeId: null,
+  dropTargetId: null,
+  dropPosition: null
+};
 function TreeNavRoot({
   nodes,
   selectedId,
   onSelect,
   onNodeContextMenu,
+  draggable = false,
+  onNodeMove,
   expandedIds: controlledExpanded,
   defaultExpandedIds,
   onExpandedChange,
@@ -10649,15 +10786,58 @@ function TreeNavRoot({
     },
     [expandedIds, isControlled, onExpandedChange]
   );
+  const expandNode = react.useCallback(
+    (id) => {
+      if (expandedIds.includes(id)) return;
+      const next = [...expandedIds, id];
+      if (!isControlled) {
+        setInternalExpanded(next);
+      }
+      onExpandedChange?.(next);
+    },
+    [expandedIds, isControlled, onExpandedChange]
+  );
+  const [dragState, setDragState] = react.useState(EMPTY_DRAG_STATE);
+  const handleDragEnd = react.useCallback(() => {
+    setDragState(EMPTY_DRAG_STATE);
+  }, []);
   const ctx = react.useMemo(
-    () => ({ selectedId, onSelect, onNodeContextMenu, expandedIds, toggle, indentSize, showIcons }),
-    [selectedId, onSelect, onNodeContextMenu, expandedIds, toggle, indentSize, showIcons]
+    () => ({
+      selectedId,
+      onSelect,
+      onNodeContextMenu,
+      expandedIds,
+      toggle,
+      indentSize,
+      showIcons,
+      draggable,
+      dragState,
+      setDragState,
+      onNodeMove,
+      nodes,
+      expandNode
+    }),
+    [
+      selectedId,
+      onSelect,
+      onNodeContextMenu,
+      expandedIds,
+      toggle,
+      indentSize,
+      showIcons,
+      draggable,
+      dragState,
+      onNodeMove,
+      nodes,
+      expandNode
+    ]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(TreeNavContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
     "nav",
     {
       "data-react-fancy-tree-nav": "",
       className: cn("flex flex-col gap-0.5 py-1 text-sm", className),
+      onDragEnd: draggable ? handleDragEnd : void 0,
       children: nodes.map((node) => /* @__PURE__ */ jsxRuntime.jsx(TreeNode, { node, depth: 0 }, node.id))
     }
   ) });
@@ -10735,6 +10915,7 @@ exports.find = find;
 exports.registerExtension = registerExtension;
 exports.registerExtensions = registerExtensions;
 exports.registerIconSet = registerIconSet;
+exports.registerIcons = registerIcons;
 exports.resolve = resolve;
 exports.search = search;
 exports.useAccordion = useAccordion;