@farmzone/fz-react-ui 1.0.9 → 1.0.10

package/dist/index.js

@@ -3454,8 +3454,8 @@ var VARIANT_CONFIG = {
     closeBtn: "text-gray-400 group-hover:text-gray-600"
   },
   "system-light": {
-    container: "bg-gray-50 border-gray-200",
-    iconBg: "bg-white border border-gray-200 shadow-sm rounded-lg",
+    container: "bg-[#ededed] border-gray-200",
+    iconBg: "bg-white border border-gray-200 shadow-xs rounded-lg",
     iconColor: "text-slate-600",
     titleColor: "text-gray-900",
     descColor: "text-gray-500",
@@ -7756,7 +7756,7 @@ function PageFilter(props) {
             value: currentValue,
             onChange: handleSelectChange(optionKey),
             options: option.options,
-            placeholder: "\uC120\uD0DD",
+            placeholder: option.placeholder || "\uC120\uD0DD",
             canReset: option.canReset ?? true,
             containerClassName: option.containerClassName ?? "w-30"
           }
@@ -7977,6 +7977,7 @@ function MultiTabBar(props) {
   };
   const handleDrop = (e, targetTabId) => {
     e.preventDefault();
+    e.stopPropagation();
     if (!draggingId || draggingId === targetTabId) {
       setDraggingId(null);
       setDropTargetId(null);
@@ -7998,6 +7999,23 @@ function MultiTabBar(props) {
     setDraggingId(null);
     setDropTargetId(null);
   };
+  const handleContainerDrop = (e) => {
+    e.preventDefault();
+    if (!draggingId || !onTabsReorder) {
+      setDraggingId(null);
+      setDropTargetId(null);
+      return;
+    }
+    const fromIdx = tabs.findIndex((t) => t.id === draggingId);
+    if (fromIdx !== -1 && fromIdx < tabs.length - 1) {
+      const newTabs = [...tabs];
+      const moved = newTabs.splice(fromIdx, 1)[0];
+      newTabs.push(moved);
+      onTabsReorder(newTabs);
+    }
+    setDraggingId(null);
+    setDropTargetId(null);
+  };
   const handleDragEnd = () => {
     setDraggingId(null);
     setDropTargetId(null);
@@ -8029,6 +8047,10 @@ function MultiTabBar(props) {
         className: `flex-1 min-w-0 flex items-end gap-0.5 ${s.scrollPadding} overflow-x-auto [&::-webkit-scrollbar]:hidden`,
         style: { scrollbarWidth: "none" },
         onScroll: updateFades,
+        onDragOver: (e) => {
+          if (draggingId) e.preventDefault();
+        },
+        onDrop: handleContainerDrop,
         children: tabs.map((tab) => {
           const isActive = tab.id === activeTabId;
           const isDraggingThis = tab.id === draggingId;