next-data-kit 8.0.0 → 8.1.0

package/dist/index.d.cts

@@ -78,28 +78,34 @@ type TSortEntry = {
     path: string;
     value: 1 | -1;
 };
+/**
+ * Filter configuration item
+ */
+type TFilterConfiguration = {
+    type: 'REGEX' | 'EXACT';
+    field?: string;
+};
 /**
  * Filter configuration for automatic filtering
  */
 type TFilterConfig = {
-    [key: string]: {
-        type: 'REGEX' | 'EXACT';
-        field?: string;
-    };
+    [key: string]: TFilterConfiguration;
 };
 /**
  * Custom filter configuration
  * Allows defining custom filter functions for specific filter keys
+ * The value parameter can be typed by using a type assertion in the function definition
  */
 type TFilterCustomConfig<T = unknown> = {
-    [id: string]: (data: unknown) => TMongoFilterQuery<T>;
+    [id: string]: (data: any) => TMongoFilterQuery<T>;
 };
 /**
  * Variant of TFilterCustomConfig that allows customizing the returned filter shape.
  * Useful for Mongo (operator-based) vs. other ORMs (where clauses) in the future.
+ * The value parameter can be typed by using a type assertion in the function definition
  */
 type TFilterCustomConfigWithFilter<TDoc = unknown, TFilter = TMongoFilterQuery<TDoc>> = {
-    [id: string]: (data: unknown) => TFilter;
+    [id: string]: (data: any) => TFilter;
 };
 /**
  * React Data Kit server action input
@@ -265,7 +271,10 @@ type TUseDataKitOptions<T = unknown, R = unknown> = {
         query?: Record<string, unknown>;
     };
     memory?: 'memory' | 'search-params';
-    filterConfig?: TFilterConfig;
+    filters?: {
+        id: string;
+        configuration?: TFilterConfiguration;
+    }[];
     action: (input: TDataKitInput<T>) => Promise<TDataKitResult<R>>;
     onSuccess?: (result: TDataKitResult<R>) => void;
     onError?: (error: Error) => void;
@@ -379,6 +388,7 @@ type TDataKitFilterItemBase = {
     id: string;
     label: string;
     placeholder?: string;
+    configuration?: TFilterConfiguration;
 };
 /**
  * Text filter item
@@ -571,7 +581,6 @@ declare const DefaultDataKitContext: React$1.Context<TDataKitContextValue<unknow
 declare const DataKit: <TAction extends (input: TDataKitInput<unknown>) => Promise<TDataKitResult<TDataKitSelectableItem>>>(props: Readonly<{
     action: TAction;
     query?: Record<string, unknown>;
-    filterConfig?: TFilterConfig;
     filters?: TDataKitFilterItem[];
     limit?: {
         default: number;

package/dist/index.d.ts

@@ -78,28 +78,34 @@ type TSortEntry = {
     path: string;
     value: 1 | -1;
 };
+/**
+ * Filter configuration item
+ */
+type TFilterConfiguration = {
+    type: 'REGEX' | 'EXACT';
+    field?: string;
+};
 /**
  * Filter configuration for automatic filtering
  */
 type TFilterConfig = {
-    [key: string]: {
-        type: 'REGEX' | 'EXACT';
-        field?: string;
-    };
+    [key: string]: TFilterConfiguration;
 };
 /**
  * Custom filter configuration
  * Allows defining custom filter functions for specific filter keys
+ * The value parameter can be typed by using a type assertion in the function definition
  */
 type TFilterCustomConfig<T = unknown> = {
-    [id: string]: (data: unknown) => TMongoFilterQuery<T>;
+    [id: string]: (data: any) => TMongoFilterQuery<T>;
 };
 /**
  * Variant of TFilterCustomConfig that allows customizing the returned filter shape.
  * Useful for Mongo (operator-based) vs. other ORMs (where clauses) in the future.
+ * The value parameter can be typed by using a type assertion in the function definition
  */
 type TFilterCustomConfigWithFilter<TDoc = unknown, TFilter = TMongoFilterQuery<TDoc>> = {
-    [id: string]: (data: unknown) => TFilter;
+    [id: string]: (data: any) => TFilter;
 };
 /**
  * React Data Kit server action input
@@ -265,7 +271,10 @@ type TUseDataKitOptions<T = unknown, R = unknown> = {
         query?: Record<string, unknown>;
     };
     memory?: 'memory' | 'search-params';
-    filterConfig?: TFilterConfig;
+    filters?: {
+        id: string;
+        configuration?: TFilterConfiguration;
+    }[];
     action: (input: TDataKitInput<T>) => Promise<TDataKitResult<R>>;
     onSuccess?: (result: TDataKitResult<R>) => void;
     onError?: (error: Error) => void;
@@ -379,6 +388,7 @@ type TDataKitFilterItemBase = {
     id: string;
     label: string;
     placeholder?: string;
+    configuration?: TFilterConfiguration;
 };
 /**
  * Text filter item
@@ -571,7 +581,6 @@ declare const DefaultDataKitContext: React$1.Context<TDataKitContextValue<unknow
 declare const DataKit: <TAction extends (input: TDataKitInput<unknown>) => Promise<TDataKitResult<TDataKitSelectableItem>>>(props: Readonly<{
     action: TAction;
     query?: Record<string, unknown>;
-    filterConfig?: TFilterConfig;
     filters?: TDataKitFilterItem[];
     limit?: {
         default: number;

package/dist/index.js

@@ -111,6 +111,7 @@ var mongooseAdapter = (model, options = {}) => {
     if (filter && !customFilter) {
       if (input.filterConfig) {
         Object.entries(filter).forEach(([key, value]) => {
+          if (filterCustom && filterCustom[key]) return;
           if (isProvided(value) && isSafeKey(key) && input.filterConfig?.[key]) {
             const config = input.filterConfig[key];
             const fieldName = config?.field ?? key;
@@ -126,6 +127,7 @@ var mongooseAdapter = (model, options = {}) => {
         });
       } else {
         Object.entries(filter).forEach(([key, value]) => {
+          if (filterCustom && filterCustom[key]) return;
           if (isProvided(value) && isSafeKey(key)) {
             if (typeof value === "string") {
               filterQuery[key] = {
@@ -222,8 +224,7 @@ async function executeDataKit(input, adapter, item, maxLimit, filterAllowed, que
 }
 async function dataKitServerAction(props) {
   const { input, item, maxLimit = 100, queryAllowed, filterAllowed: explicitFilterAllowed, sortAllowed } = props;
-  const filterCustom = "filterCustom" in props ? props.filterCustom : void 0;
-  const filterAllowed = explicitFilterAllowed ?? (filterCustom ? Object.keys(filterCustom) : void 0);
+  const filterAllowed = explicitFilterAllowed;
   let finalAdapter;
   if ("adapter" in props && props.adapter) {
     finalAdapter = props.adapter;
@@ -410,7 +411,7 @@ var stateToUrlParams = (state) => {
 
 // src/client/hooks/useDataKit.ts
 var useDataKit = (props) => {
-  const { initial = {}, memory: memoryMode = "memory", filterConfig, action, onSuccess, onError, autoFetch = true, debounce: debounceDelay = 300 } = props;
+  const { initial = {}, memory: memoryMode = "memory", filters, action, onSuccess, onError, autoFetch = true, debounce: debounceDelay = 300 } = props;
   const { page: initialPage = 1, limit: initialLimit = 10, sorts: initialSorts = [], filter: initialFilter = {}, query: initialQuery = {} } = initial;
   const [page, setPageState] = useState(initialPage);
   const [limit, setLimitState] = useState(initialLimit);
@@ -428,11 +429,11 @@ var useDataKit = (props) => {
   const actionRef = useRef(action);
   const onSuccessRef = useRef(onSuccess);
   const onErrorRef = useRef(onError);
-  const filterConfigRef = useRef(filterConfig);
+  const filtersRef = useRef(filters);
   actionRef.current = action;
   onSuccessRef.current = onSuccess;
   onErrorRef.current = onError;
-  filterConfigRef.current = filterConfig;
+  filtersRef.current = filters;
   const getInput = useCallback(() => {
     const input = {
       action: "FETCH",
@@ -442,8 +443,11 @@ var useDataKit = (props) => {
       filter: debouncedFilter,
       query
     };
-    if (filterConfigRef.current) {
-      input.filterConfig = filterConfigRef.current;
+    if (filtersRef.current) {
+      input.filterConfig = filtersRef.current.reduce((acc, f) => {
+        if (f.configuration) acc[f.id] = f.configuration;
+        return acc;
+      }, {});
     }
     return input;
   }, [page, limit, sorts, debouncedFilter, query]);
@@ -497,8 +501,8 @@ var useDataKit = (props) => {
     setFilterState((prev) => ({ ...prev, [key]: value }));
     setPageState(1);
   }, []);
-  const setFilters = useCallback((filters) => {
-    setFilterState((prev) => ({ ...prev, ...filters }));
+  const setFilters = useCallback((filters2) => {
+    setFilterState((prev) => ({ ...prev, ...filters2 }));
     setPageState(1);
   }, []);
   const clearFilters = useCallback(() => {
@@ -592,7 +596,10 @@ var useDataKit = (props) => {
     limit,
     sorts,
     filter,
-    filterConfig,
+    filterConfig: filters?.reduce((acc, f) => {
+      if (f.configuration) acc[f.id] = f.configuration;
+      return acc;
+    }, {}),
     query,
     items,
     total,
@@ -925,7 +932,7 @@ function Switch({
     {
       "data-slot": "switch",
       className: cn(
-        "peer data-[state=checked]:bg-gray-900 data-[state=unchecked]:bg-gray-200 dark:data-[state=checked]:bg-gray-100 dark:data-[state=unchecked]:bg-gray-800 focus-visible:ring-black/20 dark:focus-visible:ring-white/20 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
+        "peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
         className
       ),
       ...props,
@@ -934,7 +941,7 @@ function Switch({
         {
           "data-slot": "switch-thumb",
           className: cn(
-            "pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0 bg-white dark:data-[state=unchecked]:bg-gray-100 dark:data-[state=checked]:bg-gray-900"
+            "bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
           )
         }
       )
@@ -1232,7 +1239,6 @@ var DataKitRoot = (props) => {
   const {
     action,
     query,
-    filterConfig,
     table: columns,
     filters = [],
     selectable,
@@ -1269,7 +1275,7 @@ var DataKitRoot = (props) => {
   }, [initialState]);
   const dataKit = useDataKit({
     action,
-    filterConfig,
+    filters,
     autoFetch,
     debounce: debounce2,
     memory: memoryMode,
@@ -1493,18 +1499,20 @@ var DataKitRoot = (props) => {
         ] }, rowId);
       }) })
     ] }) }),
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground", children: [
-        "Page ",
-        dataKit.page,
-        " of ",
-        pagination.totalPages,
-        selectable?.enabled && selectedCount > 0 && /* @__PURE__ */ jsxs("span", { className: "ml-2 text-foreground", children: [
-          "(",
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "min-w-[140px]", children: [
+        /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground", children: [
+          "Page ",
+          dataKit.page,
+          " of ",
+          pagination.totalPages
+        ] }),
+        selectable?.enabled && selectedCount > 0 && /* @__PURE__ */ jsxs("p", { className: "text-sm text-foreground", children: [
           selectedCount,
-          " selected)"
+          " selected"
         ] })
       ] }),
+      /* @__PURE__ */ jsx("div", { className: "flex-1" }),
       paginationType === "SIMPLE" ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
         /* @__PURE__ */ jsx(
           Button,
@@ -1579,7 +1587,6 @@ var DataKitInner = (props, ref) => {
   const {
     action,
     query,
-    filterConfig,
     filters = [],
     limit: limitConfig,
     defaultSort = [],
@@ -1599,7 +1606,7 @@ var DataKitInner = (props, ref) => {
   const overlayContainer = containerRef.current;
   const dataKit = useDataKit({
     action,
-    filterConfig,
+    filters,
     autoFetch,
     debounce: debounce2,
     memory: memoryMode,