warqadui 0.0.22 → 0.0.24

package/dist/index.d.mts

@@ -424,14 +424,19 @@ declare module "@tanstack/react-table" {
 }
 interface PostTableActions {
     focus: (columnId: string) => void;
-    setError: (columnId: string, hasError: boolean) => void;
+    setError: (columnId: string, error: boolean | string) => void;
 }
 interface PostTableProps<TData> {
     columns: (ColumnDef<TData, any> & {
         key?: string;
     })[];
     data?: TData[];
-    onChange?: (entryData: Partial<TData>, actions: PostTableActions, actionType: "add" | "edit" | "delete", fullData: TData[]) => void | Promise<void | boolean>;
+    onChange?: (params: {
+        entryData: Partial<TData>;
+        actions: PostTableActions;
+        actionType: "add" | "edit" | "delete";
+        fullData: TData[];
+    }) => void | Promise<void | boolean>;
     isLoading?: boolean;
     className?: string;
     verticalLines?: boolean;

package/dist/index.d.ts

@@ -424,14 +424,19 @@ declare module "@tanstack/react-table" {
 }
 interface PostTableActions {
     focus: (columnId: string) => void;
-    setError: (columnId: string, hasError: boolean) => void;
+    setError: (columnId: string, error: boolean | string) => void;
 }
 interface PostTableProps<TData> {
     columns: (ColumnDef<TData, any> & {
         key?: string;
     })[];
     data?: TData[];
-    onChange?: (entryData: Partial<TData>, actions: PostTableActions, actionType: "add" | "edit" | "delete", fullData: TData[]) => void | Promise<void | boolean>;
+    onChange?: (params: {
+        entryData: Partial<TData>;
+        actions: PostTableActions;
+        actionType: "add" | "edit" | "delete";
+        fullData: TData[];
+    }) => void | Promise<void | boolean>;
     isLoading?: boolean;
     className?: string;
     verticalLines?: boolean;

package/dist/index.js

@@ -1877,7 +1877,7 @@ var Textarea = (0, import_react11.forwardRef)(
 );
 
 // src/components/Fields/searchApi.tsx
-var import_react13 = __toESM(require("react"));
+var import_react13 = require("react");
 var import_react_dom2 = require("react-dom");
 var import_lucide_react8 = require("lucide-react");
 
@@ -2063,7 +2063,7 @@ var useSearchApiContext = () => {
 };
 var SearchApi = (0, import_react13.forwardRef)(
   (props, _) => {
-    const { form, name, onChange, value, children } = props;
+    const { form, name, onChange, value, children, ...restProps } = props;
     if (form && name) {
       return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         import_react_hook_form5.Controller,
@@ -2073,7 +2073,9 @@ var SearchApi = (0, import_react13.forwardRef)(
           render: ({ field }) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
             SearchApiRoot,
             {
-              ...props,
+              ...restProps,
+              form,
+              name,
               currentValue: field.value !== void 0 && field.value !== "" ? field.value : value,
               onChangeHandler: (val) => {
                 field.onChange(val);
@@ -2089,7 +2091,9 @@ var SearchApi = (0, import_react13.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       SearchApiRoot,
       {
-        ...props,
+        ...restProps,
+        form,
+        name,
         currentValue: value,
         onChangeHandler: onChange || (() => {
         }),
@@ -2343,7 +2347,7 @@ var SearchApiRoot = ({
     obj,
     error: message
   };
-  const hasChildren = import_react13.default.Children.count(children) > 0;
+  const hasChildren = !!children;
   return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SearchApiContext.Provider, { value: valueCtx, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
     "div",
     {
@@ -2390,7 +2394,8 @@ var SearchApiTrigger = (0, import_react13.forwardRef)(
       clearSelection,
       selectedValue,
       variant,
-      inputRef
+      inputRef,
+      searchTerm
     } = useSearchApiContext();
     return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "relative", ref: dropdownAnchorRef, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
       "div",
@@ -2403,7 +2408,9 @@ var SearchApiTrigger = (0, import_react13.forwardRef)(
         onClick: () => {
           if (disabled) return;
           inputRef.current?.focus();
-          setIsOpen(true);
+          if (searchTerm.trim()) {
+            setIsOpen(true);
+          }
         },
         ...props,
         children: [
@@ -2471,7 +2478,8 @@ var SearchApiInput = (0, import_react13.forwardRef)(
     };
     const handleKeyDown = (e) => {
       if (!isOpen) {
-        if (e.key === "ArrowDown" || e.key === "Enter") setIsOpen(true);
+        if ((e.key === "ArrowDown" || e.key === "Enter") && searchTerm.trim())
+          setIsOpen(true);
         return;
       }
       switch (e.key) {
@@ -2510,10 +2518,20 @@ var SearchApiInput = (0, import_react13.forwardRef)(
           className: `block w-full bg-transparent border-none focus:ring-0 py-1 focus:outline-none text-sm placeholder-gray-400 dark:placeholder-zinc-500 ${!isOpen && selectedValue ? "opacity-0" : "opacity-100"} ${variant === "ghost" ? "h-full" : "h-9"} ${className}`,
           placeholder: !selectedValue ? placeholder : "",
           value: searchTerm,
-          onChange: (e) => setSearchTerm(e.target.value),
+          onChange: (e) => {
+            const val = e.target.value;
+            setSearchTerm(val);
+            if (val.trim()) {
+              setIsOpen(true);
+            } else {
+              setIsOpen(false);
+            }
+          },
           onFocus: () => {
             setIsFocused(true);
-            setIsOpen(true);
+            if (searchTerm.trim()) {
+              setIsOpen(true);
+            }
           },
           onKeyDown: handleKeyDown,
           disabled,
@@ -2580,7 +2598,7 @@ var SearchApiContent = (0, import_react13.forwardRef)(
             isLoading && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "p-4 text-center text-sm text-gray-500", children: [
               /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react8.Loader2, { className: "h-5 w-5 animate-spin mx-auto mb-2" }),
               "Loading options..."
-            ] }) : import_react13.default.Children.count(children) > 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "py-1", children }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "p-4 text-center text-sm text-gray-500", children: searchTerm ? `No results for "${searchTerm}"` : "No options available" })
+            ] }) : children ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "py-1", children }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "p-4 text-center text-sm text-gray-500", children: searchTerm ? `No results for "${searchTerm}"` : "No options available" })
           ]
         }
       ),
@@ -3175,15 +3193,20 @@ function PostTable({
               }
             }
           },
-          setError: (columnId, hasError) => {
+          setError: (columnId, error) => {
             setFieldErrors((prev) => ({
               ...prev,
-              [columnId]: hasError
+              [columnId]: error
             }));
           }
         };
         const type = editingIndex !== null ? "edit" : "add";
-        const result = await onChange(entryData, actions, type, newData);
+        const result = await onChange({
+          entryData,
+          actions,
+          actionType: type,
+          fullData: newData
+        });
         if (result === false) {
           setIsSavingAsync(false);
           return;
@@ -3229,14 +3252,19 @@ function PostTable({
           }
         }
       },
-      setError: (columnId, hasError) => {
+      setError: (columnId, error) => {
         setFieldErrors((prev) => ({
           ...prev,
-          [columnId]: hasError
+          [columnId]: error
         }));
       }
     };
-    onChange?.(data[index2], actions, "delete", newData);
+    onChange?.({
+      entryData: data[index2],
+      actions,
+      actionType: "delete",
+      fullData: newData
+    });
     if (editingIndex === index2) {
       handleCancelEdit();
     } else if (editingIndex !== null && editingIndex > index2) {
@@ -3463,7 +3491,8 @@ function PostTable({
                   const fieldRenderer = column.columnDef.meta?.field;
                   const accessor = column.columnDef.accessorKey || column.id;
                   const value = entryData[accessor] || "";
-                  const hasError = !!fieldErrors[accessor];
+                  const error = fieldErrors[accessor];
+                  const hasError = !!error;
                   const onChangeValue = (val) => {
                     setEntryData((prev) => ({
                       ...prev,
@@ -3497,12 +3526,12 @@ function PostTable({
                         column.id === "_index" ? "w-px whitespace-nowrap" : "",
                         hasError && "ring-1 ring-inset ring-red-500"
                       ),
-                      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
                         "div",
                         {
                           className: cn(
-                            "flex items-center",
-                            column.id === "_index" ? "" : "w-full min-w-32 h-9"
+                            "flex items-center relative group w-full",
+                            column.id === "_index" ? "" : "min-w-32 h-9"
                           ),
                           onKeyDown: (e) => {
                             if (e.key === "Enter") {
@@ -3510,23 +3539,26 @@ function PostTable({
                               handleSaveField();
                             }
                           },
-                          children: fieldRenderer ? fieldRenderer({
-                            value,
-                            onChange: onChangeValue,
-                            rowData: entryData,
-                            setRowData: setEntryData
-                          }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-                            Fields_default.Input,
-                            {
-                              id: `pti-${accessor}`,
-                              label: "",
-                              variant: "ghost",
+                          children: [
+                            fieldRenderer ? fieldRenderer({
                               value,
-                              onChange: (e) => onChangeValue(e.target.value),
-                              className: "px-0! bg-transparent!",
-                              placeholder: `${typeof column.columnDef.header === "string" ? column.columnDef.header : column.id}`
-                            }
-                          )
+                              onChange: onChangeValue,
+                              rowData: entryData,
+                              setRowData: setEntryData
+                            }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                              Fields_default.Input,
+                              {
+                                id: `pti-${accessor}`,
+                                label: "",
+                                variant: "ghost",
+                                value,
+                                onChange: (e) => onChangeValue(e.target.value),
+                                className: "px-0! bg-transparent!",
+                                placeholder: `${typeof column.columnDef.header === "string" ? column.columnDef.header : column.id}`
+                              }
+                            ),
+                            typeof error === "string" && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "absolute left-1/2 -translate-x-1/2 bottom-[100%] mb-2 z-[9999] pointer-events-none opacity-0 group-hover:opacity-100 focus-within:opacity-100 group-focus-within:opacity-100 transition-opacity whitespace-nowrap bg-red-500 text-white text-xs px-2.5 py-1.5 rounded shadow-lg before:content-[''] before:absolute before:top-full before:left-1/2 before:-translate-x-1/2 before:border-4 before:border-transparent before:border-t-red-500", children: error })
+                          ]
                         }
                       )
                     },

package/dist/index.mjs

@@ -1811,7 +1811,7 @@ var Textarea = forwardRef4(
 );
 
 // src/components/Fields/searchApi.tsx
-import React7, {
+import {
   createContext as createContext4,
   useContext as useContext4,
   useState as useState12,
@@ -2004,7 +2004,7 @@ var useSearchApiContext = () => {
 };
 var SearchApi = forwardRef5(
   (props, _) => {
-    const { form, name, onChange, value, children } = props;
+    const { form, name, onChange, value, children, ...restProps } = props;
     if (form && name) {
       return /* @__PURE__ */ jsx20(
         Controller5,
@@ -2014,7 +2014,9 @@ var SearchApi = forwardRef5(
           render: ({ field }) => /* @__PURE__ */ jsx20(
             SearchApiRoot,
             {
-              ...props,
+              ...restProps,
+              form,
+              name,
               currentValue: field.value !== void 0 && field.value !== "" ? field.value : value,
               onChangeHandler: (val) => {
                 field.onChange(val);
@@ -2030,7 +2032,9 @@ var SearchApi = forwardRef5(
     return /* @__PURE__ */ jsx20(
       SearchApiRoot,
       {
-        ...props,
+        ...restProps,
+        form,
+        name,
         currentValue: value,
         onChangeHandler: onChange || (() => {
         }),
@@ -2284,7 +2288,7 @@ var SearchApiRoot = ({
     obj,
     error: message
   };
-  const hasChildren = React7.Children.count(children) > 0;
+  const hasChildren = !!children;
   return /* @__PURE__ */ jsx20(SearchApiContext.Provider, { value: valueCtx, children: /* @__PURE__ */ jsxs15(
     "div",
     {
@@ -2331,7 +2335,8 @@ var SearchApiTrigger = forwardRef5(
       clearSelection,
       selectedValue,
       variant,
-      inputRef
+      inputRef,
+      searchTerm
     } = useSearchApiContext();
     return /* @__PURE__ */ jsx20("div", { className: "relative", ref: dropdownAnchorRef, children: /* @__PURE__ */ jsxs15(
       "div",
@@ -2344,7 +2349,9 @@ var SearchApiTrigger = forwardRef5(
         onClick: () => {
           if (disabled) return;
           inputRef.current?.focus();
-          setIsOpen(true);
+          if (searchTerm.trim()) {
+            setIsOpen(true);
+          }
         },
         ...props,
         children: [
@@ -2412,7 +2419,8 @@ var SearchApiInput = forwardRef5(
     };
     const handleKeyDown = (e) => {
       if (!isOpen) {
-        if (e.key === "ArrowDown" || e.key === "Enter") setIsOpen(true);
+        if ((e.key === "ArrowDown" || e.key === "Enter") && searchTerm.trim())
+          setIsOpen(true);
         return;
       }
       switch (e.key) {
@@ -2451,10 +2459,20 @@ var SearchApiInput = forwardRef5(
           className: `block w-full bg-transparent border-none focus:ring-0 py-1 focus:outline-none text-sm placeholder-gray-400 dark:placeholder-zinc-500 ${!isOpen && selectedValue ? "opacity-0" : "opacity-100"} ${variant === "ghost" ? "h-full" : "h-9"} ${className}`,
           placeholder: !selectedValue ? placeholder : "",
           value: searchTerm,
-          onChange: (e) => setSearchTerm(e.target.value),
+          onChange: (e) => {
+            const val = e.target.value;
+            setSearchTerm(val);
+            if (val.trim()) {
+              setIsOpen(true);
+            } else {
+              setIsOpen(false);
+            }
+          },
           onFocus: () => {
             setIsFocused(true);
-            setIsOpen(true);
+            if (searchTerm.trim()) {
+              setIsOpen(true);
+            }
           },
           onKeyDown: handleKeyDown,
           disabled,
@@ -2521,7 +2539,7 @@ var SearchApiContent = forwardRef5(
             isLoading && options.length === 0 ? /* @__PURE__ */ jsxs15("div", { className: "p-4 text-center text-sm text-gray-500", children: [
               /* @__PURE__ */ jsx20(Loader22, { className: "h-5 w-5 animate-spin mx-auto mb-2" }),
               "Loading options..."
-            ] }) : React7.Children.count(children) > 0 ? /* @__PURE__ */ jsx20("div", { className: "py-1", children }) : /* @__PURE__ */ jsx20("div", { className: "p-4 text-center text-sm text-gray-500", children: searchTerm ? `No results for "${searchTerm}"` : "No options available" })
+            ] }) : children ? /* @__PURE__ */ jsx20("div", { className: "py-1", children }) : /* @__PURE__ */ jsx20("div", { className: "p-4 text-center text-sm text-gray-500", children: searchTerm ? `No results for "${searchTerm}"` : "No options available" })
           ]
         }
       ),
@@ -3133,15 +3151,20 @@ function PostTable({
               }
             }
           },
-          setError: (columnId, hasError) => {
+          setError: (columnId, error) => {
             setFieldErrors((prev) => ({
               ...prev,
-              [columnId]: hasError
+              [columnId]: error
             }));
           }
         };
         const type = editingIndex !== null ? "edit" : "add";
-        const result = await onChange(entryData, actions, type, newData);
+        const result = await onChange({
+          entryData,
+          actions,
+          actionType: type,
+          fullData: newData
+        });
         if (result === false) {
           setIsSavingAsync(false);
           return;
@@ -3187,14 +3210,19 @@ function PostTable({
           }
         }
       },
-      setError: (columnId, hasError) => {
+      setError: (columnId, error) => {
         setFieldErrors((prev) => ({
           ...prev,
-          [columnId]: hasError
+          [columnId]: error
         }));
       }
     };
-    onChange?.(data[index2], actions, "delete", newData);
+    onChange?.({
+      entryData: data[index2],
+      actions,
+      actionType: "delete",
+      fullData: newData
+    });
     if (editingIndex === index2) {
       handleCancelEdit();
     } else if (editingIndex !== null && editingIndex > index2) {
@@ -3421,7 +3449,8 @@ function PostTable({
                   const fieldRenderer = column.columnDef.meta?.field;
                   const accessor = column.columnDef.accessorKey || column.id;
                   const value = entryData[accessor] || "";
-                  const hasError = !!fieldErrors[accessor];
+                  const error = fieldErrors[accessor];
+                  const hasError = !!error;
                   const onChangeValue = (val) => {
                     setEntryData((prev) => ({
                       ...prev,
@@ -3455,12 +3484,12 @@ function PostTable({
                         column.id === "_index" ? "w-px whitespace-nowrap" : "",
                         hasError && "ring-1 ring-inset ring-red-500"
                       ),
-                      children: /* @__PURE__ */ jsx23(
+                      children: /* @__PURE__ */ jsxs18(
                         "div",
                         {
                           className: cn(
-                            "flex items-center",
-                            column.id === "_index" ? "" : "w-full min-w-32 h-9"
+                            "flex items-center relative group w-full",
+                            column.id === "_index" ? "" : "min-w-32 h-9"
                           ),
                           onKeyDown: (e) => {
                             if (e.key === "Enter") {
@@ -3468,23 +3497,26 @@ function PostTable({
                               handleSaveField();
                             }
                           },
-                          children: fieldRenderer ? fieldRenderer({
-                            value,
-                            onChange: onChangeValue,
-                            rowData: entryData,
-                            setRowData: setEntryData
-                          }) : /* @__PURE__ */ jsx23(
-                            Fields_default.Input,
-                            {
-                              id: `pti-${accessor}`,
-                              label: "",
-                              variant: "ghost",
+                          children: [
+                            fieldRenderer ? fieldRenderer({
                               value,
-                              onChange: (e) => onChangeValue(e.target.value),
-                              className: "px-0! bg-transparent!",
-                              placeholder: `${typeof column.columnDef.header === "string" ? column.columnDef.header : column.id}`
-                            }
-                          )
+                              onChange: onChangeValue,
+                              rowData: entryData,
+                              setRowData: setEntryData
+                            }) : /* @__PURE__ */ jsx23(
+                              Fields_default.Input,
+                              {
+                                id: `pti-${accessor}`,
+                                label: "",
+                                variant: "ghost",
+                                value,
+                                onChange: (e) => onChangeValue(e.target.value),
+                                className: "px-0! bg-transparent!",
+                                placeholder: `${typeof column.columnDef.header === "string" ? column.columnDef.header : column.id}`
+                              }
+                            ),
+                            typeof error === "string" && /* @__PURE__ */ jsx23("div", { className: "absolute left-1/2 -translate-x-1/2 bottom-[100%] mb-2 z-[9999] pointer-events-none opacity-0 group-hover:opacity-100 focus-within:opacity-100 group-focus-within:opacity-100 transition-opacity whitespace-nowrap bg-red-500 text-white text-xs px-2.5 py-1.5 rounded shadow-lg before:content-[''] before:absolute before:top-full before:left-1/2 before:-translate-x-1/2 before:border-4 before:border-transparent before:border-t-red-500", children: error })
+                          ]
                         }
                       )
                     },