listpage-next 0.0.113 → 0.0.115

package/dist/components/Page/components/ListPage/DataTable.d.ts

@@ -1,10 +1,16 @@
 import { TableProps } from 'antd';
 import { ListPageStore } from '../../context/listpage';
-import { DataTableColumns } from '../../../DataTable';
+import { ComponentProps, ComponentType } from '../../../DataTable/typings';
+import { ColumnType } from 'antd/es/table';
+import { ColumnRender } from '../../../DataTable/components/Render';
 export interface DataTableProps<Record = any> extends Omit<TableProps<Record>, 'dataSource' | 'title' | 'columns'> {
     title?: React.ReactNode;
     extra?: React.ReactNode;
-    columns?: DataTableColumns<Record, ListPageStore>[];
+    columns?: ListPageTableColumn<Record>[];
+}
+export interface ListPageTableColumn<Record = any> extends ColumnType<Record> {
+    component?: ComponentType | ColumnRender<Record, ListPageStore>;
+    props?: ComponentProps;
 }
 export declare const DataTable: ((props: DataTableProps) => import("react/jsx-runtime").JSX.Element) & {
     displayName: string;

package/dist/components/Page/components/ListPage/styles.js

@@ -23,7 +23,9 @@ const Title = styled_components.div`
 `;
 const FilterSection = styled_components.div`
   background: #fff;
-  padding: 16px;
+  padding: 24px 32px;
+  border-radius: 8px;
+  border: 0.5px solid #f0f0f0;
 `;
 const ToolbarSection = styled_components.div``;
 const BodySection = styled_components.div`

package/dist/components/Page/components/ListPage/v2.d.ts

@@ -1,14 +1,13 @@
 import { ReactNode } from 'react';
 import { TableProps } from 'antd';
-import { ListPageStore, TableRequest } from '../../context/listpage';
+import { FloatRender, ListPageStore, TableRequest } from '../../context/listpage';
 import { FilterFormOption } from '../../../FilterGroup';
 import { DataTableColumns } from '../../../DataTable';
-import { FloatComponentProps } from '../../../../context';
 export interface ListPageProps<FilterValue = any, RecordValue extends Record<string, any> = any> {
     request: TableRequest<FilterValue, RecordValue>;
     floats?: {
         key: string;
-        render: (props: FloatComponentProps<RecordValue>) => ReactNode;
+        render: FloatRender<RecordValue>;
     }[];
     initialValues?: {
         filterValues?: FilterValue;

package/dist/components/Page/context/listpage.d.ts

@@ -2,12 +2,13 @@ import { JSX, ReactNode } from 'react';
 import { FloatComponentProps } from '../../../context';
 import { BaseQueryParams, PaginationData } from '../../../http-client/types';
 export type TableRequest<FilterValue = any, RecordValue = any> = (pageParams: BaseQueryParams, filterValues: FilterValue) => Promise<PaginationData<RecordValue>>;
+export type FloatRender<RecordValue extends Record<string, any> = any> = (props: FloatComponentProps<RecordValue>) => JSX.Element;
 export declare class ListPageStore<FilterValue = any, RecordValue extends Record<string, any> = any> {
     filters: FilterValue;
     tableDataRequest: TableRequest<FilterValue, RecordValue>;
     floats: {
         key: string;
-        render: (props: FloatComponentProps<RecordValue>) => JSX.Element | ReactNode;
+        render: FloatRender<RecordValue>;
     }[];
     visibleFloat?: {
         key: string;
@@ -23,7 +24,7 @@ export declare class ListPageStore<FilterValue = any, RecordValue extends Record
     };
     constructor(initialValues: any | undefined, request: TableRequest<FilterValue, RecordValue>, floats: {
         key: string;
-        render: (props: FloatComponentProps<RecordValue>) => ReactNode;
+        render: FloatRender<RecordValue>;
     }[]);
     submitFiltersChange(value?: FilterValue): void;
     showFloat(key: string, record: any, onCloseCallback?: () => void): void;
@@ -41,7 +42,7 @@ export declare const ListPageProvider: ({ children, initialValues, request, floa
     };
     floats?: {
         key: string;
-        render: (props: FloatComponentProps<any>) => ReactNode;
+        render: FloatRender<any>;
     }[];
     request: TableRequest<any, any>;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Page/context/listpage.js

@@ -22,6 +22,8 @@ class ListPageStore {
     }
     submitFiltersChange(value = {}) {
         this.filters = value;
+        this.pagination.current = 1;
+        this.refreshTable();
     }
     showFloat(key, record, onCloseCallback) {
         this.visibleFloat = {

package/dist/components/Page/hooks/useFloat.d.ts

@@ -1 +1 @@
-export declare function useFloat(): import("react").ReactNode | import("react").JSX.Element;
+export declare function useFloat(): false | import("react/jsx-runtime").JSX.Element;

package/dist/components/Page/hooks/useFloat.js

@@ -1,10 +1,11 @@
+import { jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { useListPageStore } from "../context/listpage.js";
 function useFloat() {
     const store = useListPageStore();
     const visibleFloat = store.visibleFloat;
     const floatEle = useMemo(()=>{
-        const render = store.floats.find((f)=>f.key === visibleFloat?.key)?.render;
+        const Component = store.floats.find((f)=>f.key === visibleFloat?.key)?.render;
         const props = {
             record: visibleFloat?.record,
             onClose: ()=>{
@@ -13,7 +14,10 @@ function useFloat() {
             },
             visible: true
         };
-        return render?.(props);
+        if (!Component) return false;
+        return /*#__PURE__*/ jsx(Component, {
+            ...props
+        });
     }, [
         visibleFloat,
         store

package/dist/components/Page/index.d.ts

@@ -3,3 +3,4 @@ export { ListPage, type ListPageProps } from './components/ListPage';
 export { PageLoading } from './components/Loading';
 export { usePageContext } from './context/page';
 export { ListPage as ListPagePro, type ListPageProps as ListPageProProps, } from './components/ListPage/v2';
+export { type ListPageTableColumn } from './components/ListPage/DataTable';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "listpage-next",
-  "version": "0.0.113",
+  "version": "0.0.115",
   "description": "A React component library for creating filter forms with Ant Design",
   "type": "module",
   "main": "./dist/index.js",