@vef-framework/components 1.0.62 → 1.0.64

package/lib/vef-crud-page/components/crud-header.cjs

@@ -1,3 +1,34 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),t=require("react"),r=require("./crud-filter.cjs");const i=t.memo((function({title:t,tableApi:i,tableApiParams:l,filterItems:a,actionButtons:o}){return a.length>0?e.jsx(r.default,{actionButtons:o,filterSchema:a,tableApi:i,tableApiParams:l,title:t}):null}));exports.default=i;
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const react = require('react');
+const crudFilter = require('./crud-filter.cjs');
+
+function VefCrudHeaderBase({
+  title,
+  tableApi,
+  tableApiParams,
+  filterItems,
+  actionButtons
+}) {
+  if (filterItems.length > 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      crudFilter.default,
+      {
+        actionButtons,
+        filterSchema: filterItems,
+        tableApi,
+        tableApiParams,
+        title
+      }
+    );
+  }
+  return null;
+}
+const VefCrudHeader = react.memo(VefCrudHeaderBase);
+
+exports.default = VefCrudHeader;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-crud-page/components/crud-table.cjs

@@ -1,3 +1,81 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),t=require("react"),s=require("../../vef-table/index.cjs"),o=require("../hooks/use-crud-context.cjs"),a=require("../hooks/use-operation-buttons.cjs"),r=require("../store.cjs");const n=t.memo((function({api:n,apiParams:l,deletionApi:u,paginated:c,schema:i,selectable:d,operationButtons:m,...p}){const[f,x,S]=r.useCrudStore((e=>[e.confirmedFilterValues,e.selectedInfo,e.setSelectedInfo])),b=t.useMemo((()=>({...l,...f})),[l,f]),C=t.useCallback(((e,t)=>{S({selectedKeys:e,selectedRecords:t})}),[S]),j=a.useOperationButtons(u,m),y=t.useRef(null),h=r.useCrudStoreApi();t.useEffect((()=>{h.setState({tableInstanceRef:y})}),[h]);const g=o.useCrudContext();return c?e.jsx(s.default,{ref:y,multipleSelection:!0,paginated:!0,api:n,apiParams:b,externalContext:g,operationButtons:j,schema:i,selectable:d,selectedKeys:x.selectedKeys,selectionSummary:!1,onRowSelectionChange:C,...p}):e.jsx(s.default,{ref:y,multipleSelection:!0,api:n,apiParams:b,externalContext:g,schema:i,selectable:d,selectedKeys:x.selectedKeys,selectionSummary:!1,onRowSelectionChange:C,...p})}));exports.default=n;
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const react = require('react');
+const index = require('../../vef-table/index.cjs');
+const useCrudContext = require('../hooks/use-crud-context.cjs');
+const useOperationButtons = require('../hooks/use-operation-buttons.cjs');
+const store = require('../store.cjs');
+
+function VefCrudTableBase({
+  api,
+  apiParams,
+  deletionApi,
+  paginated,
+  schema,
+  selectable,
+  operationButtons,
+  ...tableProps
+}) {
+  const [confirmedFilterValues, selectedInfo, setSelectedInfo] = store.useCrudStore((state) => [state.confirmedFilterValues, state.selectedInfo, state.setSelectedInfo]);
+  const mergedApiParams = react.useMemo(() => ({
+    ...apiParams,
+    ...confirmedFilterValues
+  }), [apiParams, confirmedFilterValues]);
+  const handleSelectionChange = react.useCallback((selectedKeys, selectedRecords) => {
+    setSelectedInfo({
+      selectedKeys,
+      selectedRecords
+    });
+  }, [setSelectedInfo]);
+  const operationButtonsToUse = useOperationButtons.useOperationButtons(deletionApi, operationButtons);
+  const tableInstanceRef = react.useRef(null);
+  const crudStore = store.useCrudStoreApi();
+  react.useEffect(() => {
+    crudStore.setState({ tableInstanceRef });
+  }, [crudStore]);
+  const crudContext = useCrudContext.useCrudContext();
+  if (paginated) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      index.default,
+      {
+        ref: tableInstanceRef,
+        multipleSelection: true,
+        paginated: true,
+        api,
+        apiParams: mergedApiParams,
+        externalContext: crudContext,
+        operationButtons: operationButtonsToUse,
+        schema,
+        selectable,
+        selectedKeys: selectedInfo.selectedKeys,
+        selectionSummary: false,
+        onRowSelectionChange: handleSelectionChange,
+        ...tableProps
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.default,
+    {
+      ref: tableInstanceRef,
+      multipleSelection: true,
+      api,
+      apiParams: mergedApiParams,
+      externalContext: crudContext,
+      schema,
+      selectable,
+      selectedKeys: selectedInfo.selectedKeys,
+      selectionSummary: false,
+      onRowSelectionChange: handleSelectionChange,
+      ...tableProps
+    }
+  );
+}
+const VefCrudTable = react.memo(VefCrudTableBase);
+
+exports.default = VefCrudTable;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-crud-page/hooks/use-action-buttons.cjs

@@ -1,3 +1,42 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@emotion/react/jsx-runtime"),r=require("@vef-framework/shared"),o=require("lucide-react"),t=require("react"),c=require("../../vef-icon/index.cjs"),i=require("../store.cjs");exports.useActionButtons=function(n){const s=i.useCrudStore((e=>e.formApiKeys)),u=Reflect.has(s,r.creationFormScene),a=Reflect.get(s,r.creationFormScene);return t.useMemo((()=>u?[...n??[],{label:"创建",key:`_${r.creationFormScene}`,icon:e.jsx(c.default,{children:e.jsx(o.PlusIcon,{})}),color:"primary",permissions:[a],onClick:({openForm:e,refetch:o})=>e({scene:r.creationFormScene,title:"创建",onSubmitSuccess:()=>{o()}})}]:n??[]),[u,n,a])};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const shared = require('@vef-framework/shared');
+const lucideReact = require('lucide-react');
+const react = require('react');
+const index = require('../../vef-icon/index.cjs');
+const store = require('../store.cjs');
+
+function useActionButtons(actionButtons) {
+  const formApiKeys = store.useCrudStore((state) => state.formApiKeys);
+  const showCreationActionButton = Reflect.has(formApiKeys, shared.creationFormScene);
+  const creationFormApiKey = Reflect.get(formApiKeys, shared.creationFormScene);
+  return react.useMemo(() => {
+    if (showCreationActionButton) {
+      return [
+        ...actionButtons ?? [],
+        {
+          label: "\u521B\u5EFA",
+          key: `_${shared.creationFormScene}`,
+          icon: /* @__PURE__ */ jsxRuntime.jsx(index.default, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PlusIcon, {}) }),
+          color: "primary",
+          permissions: [creationFormApiKey],
+          onClick: ({ openForm, refetch }) => openForm({
+            scene: shared.creationFormScene,
+            title: "\u521B\u5EFA",
+            onSubmitSuccess: () => {
+              refetch();
+            }
+          })
+        }
+      ];
+    }
+    return actionButtons ?? [];
+  }, [showCreationActionButton, actionButtons, creationFormApiKey]);
+}
+
+exports.useActionButtons = useActionButtons;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-crud-page/hooks/use-crud-context.cjs

@@ -1,3 +1,25 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),r=require("../store.cjs");exports.useCrudContext=function(){const[t,o,s]=r.useCrudStore((e=>[e.openForm,e.filterValues,e.tableInstanceRef]));return e.useMemo((()=>({openForm:t,filterValues:o,refetch:async()=>{await(s.current?.refetch())}})),[t,o,s])};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const react = require('react');
+const store = require('../store.cjs');
+
+function useCrudContext() {
+  const [openForm, filterValues, tableInstanceRef] = store.useCrudStore((state) => [
+    state.openForm,
+    state.filterValues,
+    state.tableInstanceRef
+  ]);
+  return react.useMemo(() => ({
+    openForm,
+    filterValues,
+    refetch: async () => {
+      await tableInstanceRef.current?.refetch();
+    }
+  }), [openForm, filterValues, tableInstanceRef]);
+}
+
+exports.useCrudContext = useCrudContext;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-crud-page/hooks/use-crud-schema.cjs

@@ -1,3 +1,119 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@vef-framework/shared"),s=require("react");exports.useCrudSchema=function(t){return s.useMemo((()=>{const s=[],o=[],r=new Set,l={};for(const n of t){const{filter:t,form:u,...c}=n,{name:a,title:i}=c;if(s.push(c),t){const{label:s,advanced:r,...l}=t,n={name:a,label:r&&e.isNullish(s)?i:s,advanced:r,...l};("Input"===n.type||"InputNumber"===n.type)&&e.isNullish(s)&&e.isNullish(n.placeholder)&&(n.placeholder=e.isString(i)?`请输入${i}`:"请输入"),o.push(n)}if(u){const{group:s,row:t,column:o,filterValueAsDefault:n,label:c,...f}=u,p=`${s??1}`,m=l[p]??{};l[p]||(l[p]=m);const h=`${t??1}`,d=m[h]??{};m[h]||(m[h]=d);const y=`${o??1}`,b=d[y]??[];d[y]||(d[y]=b),"Hidden"===f.type?b.push({name:a,...f}):b.push({name:a,label:e.isNullish(c)?i:c,...f}),n&&r.add(a)}}const n=[],u=Object.keys(l).sort();for(const e of u){const s=l[e],t=[],o=Object.keys(s).sort();for(const e of o){const o=s[e],r=[],l=Object.keys(o).sort();for(const e of l){const s={key:e,items:o[e]};r.push(s)}t.push({key:e,columns:r})}n.push({key:e,rows:t})}return{tableSchema:s,filterItems:o,formGroups:n,filterValueAsDefaultKeys:Array.from(r)}}),[t])};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const shared = require('@vef-framework/shared');
+const react = require('react');
+
+function useCrudSchema(schema) {
+  return react.useMemo(() => {
+    const tableColumns = [];
+    const filterItems = [];
+    const filterValueAsDefaultSet = /* @__PURE__ */ new Set();
+    const formGroupMap = {};
+    for (const item of schema) {
+      const {
+        filter,
+        form,
+        ...column
+      } = item;
+      const { name, title } = column;
+      tableColumns.push(column);
+      if (filter) {
+        const {
+          label,
+          advanced,
+          ...rest
+        } = filter;
+        const filterItem = {
+          name,
+          label: advanced && shared.isNullish(label) ? title : label,
+          advanced,
+          ...rest
+        };
+        if ((filterItem.type === "Input" || filterItem.type === "InputNumber") && shared.isNullish(label) && shared.isNullish(filterItem.placeholder)) {
+          filterItem.placeholder = shared.isString(title) ? `\u8BF7\u8F93\u5165${title}` : "\u8BF7\u8F93\u5165";
+        }
+        filterItems.push(filterItem);
+      }
+      if (form) {
+        const {
+          group,
+          row,
+          column: column2,
+          filterValueAsDefault,
+          label,
+          ...rest
+        } = form;
+        const groupKey = `${group ?? 1}`;
+        const groupSchema = formGroupMap[groupKey] ?? {};
+        if (!formGroupMap[groupKey]) {
+          formGroupMap[groupKey] = groupSchema;
+        }
+        const rowKey = `${row ?? 1}`;
+        const rowSchema = groupSchema[rowKey] ?? {};
+        if (!groupSchema[rowKey]) {
+          groupSchema[rowKey] = rowSchema;
+        }
+        const columnKey = `${column2 ?? 1}`;
+        const columnSchema = rowSchema[columnKey] ?? [];
+        if (!rowSchema[columnKey]) {
+          rowSchema[columnKey] = columnSchema;
+        }
+        if (rest.type === "Hidden") {
+          columnSchema.push({
+            name,
+            ...rest
+          });
+        } else {
+          columnSchema.push({
+            name,
+            label: shared.isNullish(label) ? title : label,
+            ...rest
+          });
+        }
+        if (filterValueAsDefault ?? false) {
+          filterValueAsDefaultSet.add(name);
+        }
+      }
+    }
+    const formGroups = [];
+    const groupKeys = Object.keys(formGroupMap).sort();
+    for (const groupKey of groupKeys) {
+      const groupSchemaMap = formGroupMap[groupKey];
+      const formRows = [];
+      const rowKeys = Object.keys(groupSchemaMap).sort();
+      for (const rowKey of rowKeys) {
+        const rowSchema = groupSchemaMap[rowKey];
+        const formColumns = [];
+        const columnKeys = Object.keys(rowSchema).sort();
+        for (const columnKey of columnKeys) {
+          const columnSchema = rowSchema[columnKey];
+          const formColumn = {
+            key: columnKey,
+            items: columnSchema
+          };
+          formColumns.push(formColumn);
+        }
+        formRows.push({
+          key: rowKey,
+          columns: formColumns
+        });
+      }
+      formGroups.push({
+        key: groupKey,
+        rows: formRows
+      });
+    }
+    return {
+      tableSchema: tableColumns,
+      filterItems,
+      formGroups,
+      filterValueAsDefaultKeys: Array.from(filterValueAsDefaultSet)
+    };
+  }, [schema]);
+}
+
+exports.useCrudSchema = useCrudSchema;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-crud-page/hooks/use-operation-buttons.cjs

@@ -1,3 +1,65 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@emotion/react/jsx-runtime"),r=require("@vef-framework/core"),o=require("@vef-framework/shared"),i=require("lucide-react"),t=require("react"),c=require("../../vef-icon/index.cjs"),n=require("../store.cjs");exports.useOperationButtons=function(s,u){const{useApiMutation:a,stubMutationApi:l}=r.useApiContext(),m=a(s??l),f=n.useCrudStore((e=>e.formApiKeys)),d=Reflect.has(f,o.modificationFormScene);return t.useMemo((()=>{const r=[...u??[]];return d&&r.push({key:"_modification",label:"修改",icon:e.jsx(c.default,{children:e.jsx(i.PencilIcon,{})}),color:"primary",onClick:({record:e,openForm:r,refetch:i})=>{r({scene:o.modificationFormScene,title:"修改",initialValues:e,onSubmitSuccess:()=>{i()}})}}),s&&r.push({key:"_deletion",label:"删除",icon:e.jsx(c.default,{children:e.jsx(i.TrashIcon,{})}),color:"error",requireConfirmation:!0,confirmationMode:"simple",onClick:async({record:e,refetch:r})=>{const{message:i}=await m.mutate(e);o.showSuccessMessage(i),r()}}),r}),[s,m,u,d])};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const core = require('@vef-framework/core');
+const shared = require('@vef-framework/shared');
+const lucideReact = require('lucide-react');
+const react = require('react');
+const index = require('../../vef-icon/index.cjs');
+const store = require('../store.cjs');
+
+function useOperationButtons(deletionApi, operationButtons) {
+  const { useApiMutation, stubMutationApi } = core.useApiContext();
+  const deletionMutation = useApiMutation(deletionApi ?? stubMutationApi);
+  const formApiKeys = store.useCrudStore((state) => state.formApiKeys);
+  const showModificationButton = Reflect.has(formApiKeys, shared.modificationFormScene);
+  return react.useMemo(() => {
+    const buttons = [
+      ...operationButtons ?? []
+    ];
+    if (showModificationButton) {
+      buttons.push({
+        key: "_modification",
+        label: "\u4FEE\u6539",
+        icon: /* @__PURE__ */ jsxRuntime.jsx(index.default, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PencilIcon, {}) }),
+        color: "primary",
+        onClick: ({
+          record,
+          openForm,
+          refetch
+        }) => {
+          openForm({
+            scene: shared.modificationFormScene,
+            title: "\u4FEE\u6539",
+            initialValues: record,
+            onSubmitSuccess: () => {
+              refetch();
+            }
+          });
+        }
+      });
+    }
+    if (deletionApi) {
+      buttons.push({
+        key: "_deletion",
+        label: "\u5220\u9664",
+        icon: /* @__PURE__ */ jsxRuntime.jsx(index.default, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.TrashIcon, {}) }),
+        color: "error",
+        requireConfirmation: true,
+        confirmationMode: "simple",
+        onClick: async ({ record, refetch }) => {
+          const { message } = await deletionMutation.mutate(record);
+          shared.showSuccessMessage(message);
+          refetch();
+        }
+      });
+    }
+    return buttons;
+  }, [deletionApi, deletionMutation, operationButtons, showModificationButton]);
+}
+
+exports.useOperationButtons = useOperationButtons;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-crud-page/index.cjs

@@ -1,3 +1,155 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),t=require("@vef-framework/shared"),s=require("react"),r=require("../vef-card/index.cjs"),o=require("../vef-page/index.cjs"),i=require("./components/crud-actions.cjs"),a=require("./components/crud-footer.cjs"),l=require("./components/crud-form-modal.cjs"),c=require("./components/crud-header.cjs"),u=require("./components/crud-table.cjs"),n=require("./hooks/use-crud-schema.cjs"),m=require("./store.cjs");function f({title:s,actionButtons:n,batchActionButtons:f,tableSchema:d,filterItems:p,formGroups:b,tableApiParams:h,formApis:A,deletionApi:j,batchDeletionApi:S,selectionSummary:x,...q}){const{selectedKeys:y}=m.useCrudStore((e=>e.selectedInfo)),g=!t.isNullish(S)||!t.isNullish(f)&&f.length>0;let P;if(q.paginated){const{tableApi:t,...s}=q;P=e.jsx(u.default,{showRowNumber:!0,api:t,apiParams:h,deletionApi:j,schema:d,selectable:g,...s})}else{const{tableApi:t,...s}=q;P=e.jsx(u.default,{showRowNumber:!0,api:t,apiParams:h,deletionApi:j,schema:d,selectable:g,...s})}const{tableApi:B}=q;return e.jsx(o.default,{scrollable:!0,title:s,actions:e.jsx(i.default,{actionButtons:n,tableApi:B,tableApiParams:h}),footer:y.length>0&&e.jsx(a.default,{batchActionButtons:f,batchDeletionApi:S,selectionSummary:x,tableApi:B,tableApiParams:h}),header:e.jsx(c.default,{actionButtons:n,filterItems:p,tableApi:B,tableApiParams:h,title:s}),children:e.jsxs(r.default,{children:[P,A&&Object.keys(A).length>0&&b.length>0&&e.jsx(l.default,{formApis:A,formSchema:b})]})})}exports.default=function({schema:t,formApis:r,onFormOpen:o,onBeforeSubmit:i,onSubmitSuccess:a,...l}){const{tableSchema:c,filterItems:u,formGroups:d,filterValueAsDefaultKeys:p}=n.useCrudSchema(t),b=s.useMemo((()=>{const e=r??{};return Object.keys(e).reduce(((t,s)=>(e[s]&&(t[s]=e[s].key),t)),{})}),[r]),h=s.useMemo((()=>({filterValueAsDefaultKeys:p,formApiKeys:b,onBeforeSubmit:i,onFormOpen:o,onSubmitSuccess:a})),[p,b,i,o,a]);return e.jsx(m.CrudStoreProvider,{initialState:h,children:e.jsx(f,{filterItems:u,formApis:r,formGroups:d,tableSchema:c,...l})})};
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const shared = require('@vef-framework/shared');
+const react = require('react');
+const index$1 = require('../vef-card/index.cjs');
+const index = require('../vef-page/index.cjs');
+const crudActions = require('./components/crud-actions.cjs');
+const crudFooter = require('./components/crud-footer.cjs');
+const crudFormModal = require('./components/crud-form-modal.cjs');
+const crudHeader = require('./components/crud-header.cjs');
+const crudTable = require('./components/crud-table.cjs');
+const useCrudSchema = require('./hooks/use-crud-schema.cjs');
+const store = require('./store.cjs');
+
+function VefCrudPageBase({
+  title,
+  actionButtons,
+  batchActionButtons,
+  tableSchema,
+  filterItems,
+  formGroups,
+  tableApiParams,
+  formApis,
+  deletionApi,
+  batchDeletionApi,
+  selectionSummary,
+  ...tableProps
+}) {
+  const { selectedKeys } = store.useCrudStore((state) => state.selectedInfo);
+  const selectable = !shared.isNullish(batchDeletionApi) || !shared.isNullish(batchActionButtons) && batchActionButtons.length > 0;
+  let tableNode;
+  if (tableProps.paginated) {
+    const { tableApi: tableApi2, ...restTableProps } = tableProps;
+    tableNode = /* @__PURE__ */ jsxRuntime.jsx(
+      crudTable.default,
+      {
+        showRowNumber: true,
+        api: tableApi2,
+        apiParams: tableApiParams,
+        deletionApi,
+        schema: tableSchema,
+        selectable,
+        ...restTableProps
+      }
+    );
+  } else {
+    const { tableApi: tableApi2, ...restTableProps } = tableProps;
+    tableNode = /* @__PURE__ */ jsxRuntime.jsx(
+      crudTable.default,
+      {
+        showRowNumber: true,
+        api: tableApi2,
+        apiParams: tableApiParams,
+        deletionApi,
+        schema: tableSchema,
+        selectable,
+        ...restTableProps
+      }
+    );
+  }
+  const { tableApi } = tableProps;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.default,
+    {
+      scrollable: true,
+      title,
+      actions: /* @__PURE__ */ jsxRuntime.jsx(
+        crudActions.default,
+        {
+          actionButtons,
+          tableApi,
+          tableApiParams
+        }
+      ),
+      footer: selectedKeys.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+        crudFooter.default,
+        {
+          batchActionButtons,
+          batchDeletionApi,
+          selectionSummary,
+          tableApi,
+          tableApiParams
+        }
+      ),
+      header: /* @__PURE__ */ jsxRuntime.jsx(
+        crudHeader.default,
+        {
+          actionButtons,
+          filterItems,
+          tableApi,
+          tableApiParams,
+          title
+        }
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsxs(index$1.default, { children: [
+        tableNode,
+        formApis && Object.keys(formApis).length > 0 && formGroups.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+          crudFormModal.default,
+          {
+            formApis,
+            formSchema: formGroups
+          }
+        )
+      ] })
+    }
+  );
+}
+function VefCrudPage({
+  schema,
+  formApis,
+  onFormOpen,
+  onBeforeSubmit,
+  onSubmitSuccess,
+  ...restProps
+}) {
+  const {
+    tableSchema,
+    filterItems,
+    formGroups,
+    filterValueAsDefaultKeys
+  } = useCrudSchema.useCrudSchema(schema);
+  const formApiKeys = react.useMemo(() => {
+    const apis = formApis ?? {};
+    return Object.keys(apis).reduce((acc, key) => {
+      if (apis[key]) {
+        acc[key] = apis[key].key;
+      }
+      return acc;
+    }, {});
+  }, [formApis]);
+  const initialState = react.useMemo(() => ({
+    filterValueAsDefaultKeys,
+    formApiKeys,
+    onBeforeSubmit,
+    onFormOpen,
+    onSubmitSuccess
+  }), [filterValueAsDefaultKeys, formApiKeys, onBeforeSubmit, onFormOpen, onSubmitSuccess]);
+  return /* @__PURE__ */ jsxRuntime.jsx(store.CrudStoreProvider, { initialState, children: /* @__PURE__ */ jsxRuntime.jsx(
+    VefCrudPageBase,
+    {
+      filterItems,
+      formApis,
+      formGroups,
+      tableSchema,
+      ...restProps
+    }
+  ) });
+}
+
+exports.default = VefCrudPage;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-crud-page/props.cjs

@@ -1,3 +1,5 @@
-/*! VefFramework version: 1.0.62, build time: 2025-01-09T07:31:10.823Z, made by Venus. */
-"use strict";
+/*! VefFramework version: 1.0.64, build time: 2025-01-10T01:26:01.691Z, made by Venus. */
+'use strict';
+
+
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */