@canlooks/can-ui 0.0.161 → 0.0.163

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/cjs/components/curd/curd.d.ts +4 -2
  2. package/dist/cjs/components/curd/curd.js +15 -4
  3. package/dist/esm/components/curd/curd.d.ts +4 -2
  4. package/dist/esm/components/curd/curd.js +15 -4
  5. package/package.json +1 -1
package/dist/cjs/components/curd/curd.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { ReactElement, ReactNode, Ref } from 'react';
2
- import { DivProps, Id, Obj } from '../../types';
2
+ import { DivProps, Id, Obj, Size } from '../../types';
3
3
  import { ColumnType, DataGridBaseProps, DataGridMultipleProps, DataGridSingleProps, OrderType, RowType } from '../dataGrid';
4
4
  import { FormItemProps, FormProps, FormRef, FormValue } from '../form';
5
5
  import { CurdFilterable, CurdFilterableProps } from './curdFilterable';
@@ -52,7 +52,7 @@ export interface CurdBaseProps<R extends RowType = RowType, F extends FormValue
52
52
  }, filterValue?: FormValue, sorter?: {
53
53
  field: FieldPath;
54
54
  type: OrderType;
55
- }): LoadRowsReturn<R> | Promise<LoadRowsReturn<R>>;
55
+ }): LoadRowsReturn<R> | null | Promise<LoadRowsReturn<R> | null>;
56
56
  }['bivarianceHack'];
57
57
  onLoad?(rowsReturn: LoadRowsReturn<R>): void;
58
58
  columns?: (CurdColumn<R> | symbol)[];
@@ -69,6 +69,8 @@ export interface CurdBaseProps<R extends RowType = RowType, F extends FormValue
69
69
  order?: Id[];
70
70
  onOrderChange?(order: Id[]): void;
71
71
  };
72
+ defaultSize?: Size;
73
+ onSizeChange?(size: Size): void;
72
74
  filterableProps?: Omit<CurdFilterableProps, 'columns'>;
73
75
  renderFilterable?(filterableProps: CurdFilterableProps): ReactNode;
74
76
  renderFilterConditions?: CurdFilterableProps['renderFilterConditions'];
package/dist/cjs/components/curd/curd.js CHANGED
@@ -24,7 +24,7 @@ const faPenToSquare_1 = require("@fortawesome/free-regular-svg-icons/faPenToSqua
24
24
  const faPlus_1 = require("@fortawesome/free-solid-svg-icons/faPlus");
25
25
  const faRotateRight_1 = require("@fortawesome/free-solid-svg-icons/faRotateRight");
26
26
  exports.Curd = (0, react_1.memo)((props) => {
27
- const { ref, wrapperProps, variant = 'standard', loadRows, onLoad, columns, toolbarLeft, toolbarRight, reloadable = true, onReload, resizable = true, columnConfigurable = true, filterProps, initialFilterValue, onFilter, filterableProps, renderFilterable, renderFilterConditions, copyable, creatable = true, updatable = true, deletable = true, createButtonProps, updateButtonProps, deleteButtonProps, deleteConfirmProps, controlColumnTitle = '操作', renderExtraControl, titleKey, dataName = '', createName = '添加', updateName = '编辑', deleteName = '删除', onCreate, onUpdate, onDelete, rowToForm, dialogProps, formProps, formRef, onChange, ...dataGridProps } = props;
27
+ const { ref, wrapperProps, variant = 'standard', loadRows, onLoad, columns, toolbarLeft, toolbarRight, reloadable = true, onReload, resizable = true, columnConfigurable = true, defaultSize = 'medium', onSizeChange, filterProps, initialFilterValue, onFilter, filterableProps, renderFilterable, renderFilterConditions, copyable, creatable = true, updatable = true, deletable = true, createButtonProps, updateButtonProps, deleteButtonProps, deleteConfirmProps, controlColumnTitle = '操作', renderExtraControl, titleKey, dataName = '', createName = '添加', updateName = '编辑', deleteName = '删除', onCreate, onUpdate, onDelete, rowToForm, dialogProps, formProps, formRef, onChange, ...dataGridProps } = props;
28
28
  /**
29
29
  * -------------------------------------------------------------
30
30
  * ref
@@ -120,7 +120,7 @@ exports.Curd = (0, react_1.memo)((props) => {
120
120
  * -------------------------------------------------------------
121
121
  * 表格设置
122
122
  */
123
- const [innerSize, setInnerSize] = (0, utils_1.useDerivedState)(props.size || props.tableProps?.size || 'medium');
123
+ const [innerSize, setInnerSize] = (0, utils_1.useControlled)(defaultSize, props.size || props.tableProps?.size, onSizeChange);
124
124
  const [innerPage, setInnerPage] = (0, utils_1.useControlled)(props.paginationProps?.defaultPage ?? 1, props.paginationProps?.page, props.paginationProps?.onPageChange);
125
125
  const [innerPageSize, setInnerPageSize] = (0, utils_1.useControlled)(props.paginationProps?.defaultPageSize ?? 10, props.paginationProps?.pageSize, props.paginationProps?.onPageSizeChange);
126
126
  const [innerOrderColumn, setInnerOrderColumn] = (0, utils_1.useControlled)(props.defaultOrderColumn, props.orderColumn);
@@ -144,7 +144,12 @@ exports.Curd = (0, react_1.memo)((props) => {
144
144
  _setInnerRows(data);
145
145
  };
146
146
  const [innerTotal, setInnerTotal] = (0, utils_1.useDerivedState)(props.paginationProps?.total || 0);
147
+ const suppressReload = (0, react_1.useRef)(false);
147
148
  const [innerLoading, innerLoadRows] = (0, utils_1.useLoading)(async () => {
149
+ if (suppressReload.current) {
150
+ suppressReload.current = false;
151
+ return;
152
+ }
148
153
  if (loadRows) {
149
154
  const res = await loadRows(props.paginatable !== false
150
155
  ? {
@@ -158,8 +163,14 @@ exports.Curd = (0, react_1.memo)((props) => {
158
163
  }
159
164
  : void 0);
160
165
  if (typeof res === 'object' && res !== null) {
161
- setInnerRows(res.rows);
162
- setInnerTotal(res.total);
166
+ const { rows, total = 0 } = res;
167
+ setInnerRows(rows);
168
+ setInnerTotal(total);
169
+ const maxPage = Math.max(Math.ceil(total / innerPageSize.current), 1);
170
+ if (maxPage < innerPage.current) {
171
+ suppressReload.current = true;
172
+ setInnerPage(maxPage);
173
+ }
163
174
  }
164
175
  }
165
176
  }, props.loading);
package/dist/esm/components/curd/curd.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { ReactElement, ReactNode, Ref } from 'react';
2
- import { DivProps, Id, Obj } from '../../types.js';
2
+ import { DivProps, Id, Obj, Size } from '../../types.js';
3
3
  import { ColumnType, DataGridBaseProps, DataGridMultipleProps, DataGridSingleProps, OrderType, RowType } from '../dataGrid/index.js';
4
4
  import { FormItemProps, FormProps, FormRef, FormValue } from '../form/index.js';
5
5
  import { CurdFilterable, CurdFilterableProps } from './curdFilterable.js';
@@ -52,7 +52,7 @@ export interface CurdBaseProps<R extends RowType = RowType, F extends FormValue
52
52
  }, filterValue?: FormValue, sorter?: {
53
53
  field: FieldPath;
54
54
  type: OrderType;
55
- }): LoadRowsReturn<R> | Promise<LoadRowsReturn<R>>;
55
+ }): LoadRowsReturn<R> | null | Promise<LoadRowsReturn<R> | null>;
56
56
  }['bivarianceHack'];
57
57
  onLoad?(rowsReturn: LoadRowsReturn<R>): void;
58
58
  columns?: (CurdColumn<R> | symbol)[];
@@ -69,6 +69,8 @@ export interface CurdBaseProps<R extends RowType = RowType, F extends FormValue
69
69
  order?: Id[];
70
70
  onOrderChange?(order: Id[]): void;
71
71
  };
72
+ defaultSize?: Size;
73
+ onSizeChange?(size: Size): void;
72
74
  filterableProps?: Omit<CurdFilterableProps, 'columns'>;
73
75
  renderFilterable?(filterableProps: CurdFilterableProps): ReactNode;
74
76
  renderFilterConditions?: CurdFilterableProps['renderFilterConditions'];
package/dist/esm/components/curd/curd.js CHANGED
@@ -21,7 +21,7 @@ import { faPenToSquare } from '@fortawesome/free-regular-svg-icons/faPenToSquare
21
21
  import { faPlus } from '@fortawesome/free-solid-svg-icons/faPlus';
22
22
  import { faRotateRight } from '@fortawesome/free-solid-svg-icons/faRotateRight';
23
23
  export const Curd = memo((props) => {
24
- const { ref, wrapperProps, variant = 'standard', loadRows, onLoad, columns, toolbarLeft, toolbarRight, reloadable = true, onReload, resizable = true, columnConfigurable = true, filterProps, initialFilterValue, onFilter, filterableProps, renderFilterable, renderFilterConditions, copyable, creatable = true, updatable = true, deletable = true, createButtonProps, updateButtonProps, deleteButtonProps, deleteConfirmProps, controlColumnTitle = '操作', renderExtraControl, titleKey, dataName = '', createName = '添加', updateName = '编辑', deleteName = '删除', onCreate, onUpdate, onDelete, rowToForm, dialogProps, formProps, formRef, onChange, ...dataGridProps } = props;
24
+ const { ref, wrapperProps, variant = 'standard', loadRows, onLoad, columns, toolbarLeft, toolbarRight, reloadable = true, onReload, resizable = true, columnConfigurable = true, defaultSize = 'medium', onSizeChange, filterProps, initialFilterValue, onFilter, filterableProps, renderFilterable, renderFilterConditions, copyable, creatable = true, updatable = true, deletable = true, createButtonProps, updateButtonProps, deleteButtonProps, deleteConfirmProps, controlColumnTitle = '操作', renderExtraControl, titleKey, dataName = '', createName = '添加', updateName = '编辑', deleteName = '删除', onCreate, onUpdate, onDelete, rowToForm, dialogProps, formProps, formRef, onChange, ...dataGridProps } = props;
25
25
  /**
26
26
  * -------------------------------------------------------------
27
27
  * ref
@@ -117,7 +117,7 @@ export const Curd = memo((props) => {
117
117
  * -------------------------------------------------------------
118
118
  * 表格设置
119
119
  */
120
- const [innerSize, setInnerSize] = useDerivedState(props.size || props.tableProps?.size || 'medium');
120
+ const [innerSize, setInnerSize] = useControlled(defaultSize, props.size || props.tableProps?.size, onSizeChange);
121
121
  const [innerPage, setInnerPage] = useControlled(props.paginationProps?.defaultPage ?? 1, props.paginationProps?.page, props.paginationProps?.onPageChange);
122
122
  const [innerPageSize, setInnerPageSize] = useControlled(props.paginationProps?.defaultPageSize ?? 10, props.paginationProps?.pageSize, props.paginationProps?.onPageSizeChange);
123
123
  const [innerOrderColumn, setInnerOrderColumn] = useControlled(props.defaultOrderColumn, props.orderColumn);
@@ -141,7 +141,12 @@ export const Curd = memo((props) => {
141
141
  _setInnerRows(data);
142
142
  };
143
143
  const [innerTotal, setInnerTotal] = useDerivedState(props.paginationProps?.total || 0);
144
+ const suppressReload = useRef(false);
144
145
  const [innerLoading, innerLoadRows] = useLoading(async () => {
146
+ if (suppressReload.current) {
147
+ suppressReload.current = false;
148
+ return;
149
+ }
145
150
  if (loadRows) {
146
151
  const res = await loadRows(props.paginatable !== false
147
152
  ? {
@@ -155,8 +160,14 @@ export const Curd = memo((props) => {
155
160
  }
156
161
  : void 0);
157
162
  if (typeof res === 'object' && res !== null) {
158
- setInnerRows(res.rows);
159
- setInnerTotal(res.total);
163
+ const { rows, total = 0 } = res;
164
+ setInnerRows(rows);
165
+ setInnerTotal(total);
166
+ const maxPage = Math.max(Math.ceil(total / innerPageSize.current), 1);
167
+ if (maxPage < innerPage.current) {
168
+ suppressReload.current = true;
169
+ setInnerPage(maxPage);
170
+ }
160
171
  }
161
172
  }
162
173
  }, props.loading);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@canlooks/can-ui",
3
- "version": "0.0.161",
3
+ "version": "0.0.163",
4
4
  "author": "C.CanLiang <canlooks@gmail.com>",
5
5
  "description": "My ui framework",
6
6
  "license": "MIT",