es-grid-template 1.8.91 → 1.8.92

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 (4) hide show
  1. package/es/group-component/hook/utils.d.ts +8 -8
  2. package/es/table-component/body/EditableCell.js +65 -43
  3. package/lib/table-component/body/EditableCell.js +64 -42
  4. package/package.json +1 -1
package/es/group-component/hook/utils.d.ts CHANGED
@@ -162,7 +162,7 @@ export declare const fixColumnsLeft: <RecordType>(columns: ColumnTable<RecordTyp
162
162
  type?: IColumnType;
163
163
  haveSum?: boolean;
164
164
  isSummary?: boolean;
165
- summaryTemplate?: (data: number, key: string) => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
165
+ summaryTemplate?: (data: number, key: string) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode;
166
166
  format?: IFormat | ((rowData: any) => IFormat);
167
167
  allowFiltering?: boolean;
168
168
  sorter?: boolean;
@@ -177,18 +177,18 @@ export declare const fixColumnsLeft: <RecordType>(columns: ColumnTable<RecordTyp
177
177
  headerText?: string;
178
178
  hidden?: boolean;
179
179
  visible?: boolean;
180
- headerTooltip?: string | boolean | (() => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>);
180
+ headerTooltip?: string | boolean | (() => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
181
181
  columnGroupText?: string;
182
182
  align?: import("./../../grid-component/type").ITextAlign;
183
183
  textAlign?: import("./../../grid-component/type").ITextAlign;
184
184
  headerTextAlign?: import("./../../grid-component/type").ITextAlign;
185
- template?: import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | ((args: import("./../../grid-component/type").ColumnTemplate<RecordType>) => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>);
185
+ template?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode | ((args: import("./../../grid-component/type").ColumnTemplate<RecordType>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
186
186
  showTooltip?: boolean;
187
187
  tooltipDescription?: string | ((args: {
188
188
  value: any;
189
189
  rowData: RecordType;
190
- }) => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>);
191
- headerTemplate?: import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | ((column: ColumnTable<RecordType>) => import("react").ReactNode | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>);
190
+ }) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
191
+ headerTemplate?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode | ((column: ColumnTable<RecordType>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
192
192
  commandItems?: import("./../../grid-component/type").CommandItem[];
193
193
  children?: ColumnTable<RecordType>[];
194
194
  editType?: EditType | ((rowData?: RecordType) => EditType);
@@ -208,9 +208,9 @@ export declare const fixColumnsLeft: <RecordType>(columns: ColumnTable<RecordTyp
208
208
  ellipsis?: boolean;
209
209
  allowResizing?: boolean;
210
210
  allowSelection?: boolean | ((rowData: RecordType) => boolean);
211
- onCellStyles?: Omit<CSSProperties, "left" | "right" | "display" | "width" | "minWidth" | "position"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "display" | "width" | "minWidth" | "position">);
212
- onCellHeaderStyles?: Omit<CSSProperties, "left" | "right" | "display" | "width" | "minWidth" | "position"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "display" | "width" | "minWidth" | "position">);
213
- onCellFooterStyles?: Omit<CSSProperties, "left" | "right" | "display" | "width" | "minWidth" | "position"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "display" | "width" | "minWidth" | "position">);
211
+ onCellStyles?: Omit<CSSProperties, "width" | "left" | "right" | "display" | "minWidth" | "position"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "width" | "left" | "right" | "display" | "minWidth" | "position">);
212
+ onCellHeaderStyles?: Omit<CSSProperties, "width" | "left" | "right" | "display" | "minWidth" | "position"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "width" | "left" | "right" | "display" | "minWidth" | "position">);
213
+ onCellFooterStyles?: Omit<CSSProperties, "width" | "left" | "right" | "display" | "minWidth" | "position"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "width" | "left" | "right" | "display" | "minWidth" | "position">);
214
214
  sumGroup?: boolean;
215
215
  getValue?: (row: any, rowIndex: number) => any;
216
216
  getCellProps?: (value: any, row: any, rowIndex: number) => import("./../../grid-component/type").CellProps;
package/es/table-component/body/EditableCell.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import React, { useContext } from "react";
3
3
  import { DatePicker, TimePicker } from "rc-master-ui";
4
- import { Divider, Row, Col, Input, ColorPicker } from "antd";
4
+ import { Divider, Row, Col, Input, ColorPicker, Button } from "antd";
5
5
  import { checkDecimalSeparator, checkThousandSeparator, checkFieldKey, convertArrayWithIndent, convertDateToDayjs, convertLabelToTitle, getDatepickerFormat, isDisable, isEmpty, isNullOrUndefined, customWeekStartEndFormat, convertDayjsToDate, parseBooleanToValue, isColor, genPresets, getFormat } from "../hook/utils";
6
6
  import classNames from "classnames";
7
7
  import { NumericFormat } from "react-numeric-component";
@@ -15,6 +15,7 @@ import { cyan, green, red, blue } from '@ant-design/colors';
15
15
  import { EditForm } from "../components/EditForm";
16
16
  import { TableContext } from "../useContext";
17
17
  import { useLocale } from "rc-master-ui/es/locale";
18
+ import { getTemplate } from "../../grid-component/hooks";
18
19
  const {
19
20
  SHOW_PARENT
20
21
  } = TreeSelect;
@@ -79,7 +80,7 @@ const EditableCell = props => {
79
80
  toolbarItems,
80
81
  filterOption,
81
82
  inputKey,
82
- // toolbarClick,
83
+ toolbarClick,
83
84
  loadOptions,
84
85
  validateOption,
85
86
  options: propsOptions
@@ -393,13 +394,24 @@ const EditableCell = props => {
393
394
  status: isInvalid ? 'error' : undefined,
394
395
  dropdownRender: menu => {
395
396
  if (toolbarItems && toolbarItems.length > 0) {
396
- return /*#__PURE__*/React.createElement(React.Fragment, null, menu, /*#__PURE__*/React.createElement(Divider, {
397
+ return /*#__PURE__*/React.createElement(React.Fragment, null, menu, toolbarItems && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Divider, {
397
398
  style: {
398
399
  margin: '8px 0'
399
400
  }
400
401
  }), /*#__PURE__*/React.createElement("div", {
401
402
  className: 'toolbar-control d-flex justify-content-end'
402
- }));
403
+ }, toolbarItems.map(it => {
404
+ return /*#__PURE__*/React.createElement("div", {
405
+ key: it.key,
406
+ className: 'toolbar-item',
407
+ onClick: () => toolbarClick?.({
408
+ item: it,
409
+ column
410
+ })
411
+ }, it.template ? getTemplate(it.template) : /*#__PURE__*/React.createElement(Button, {
412
+ className: "toolbar-item-btn"
413
+ }, it.icon && getTemplate(it.icon), it.title));
414
+ }))));
403
415
  } else {
404
416
  return /*#__PURE__*/React.createElement(React.Fragment, null, " ", menu);
405
417
  }
@@ -514,6 +526,30 @@ const EditableCell = props => {
514
526
  });
515
527
  }
516
528
  },
529
+ dropdownRender: menu => {
530
+ if (toolbarItems && toolbarItems.length > 0) {
531
+ return /*#__PURE__*/React.createElement(React.Fragment, null, menu, toolbarItems && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Divider, {
532
+ style: {
533
+ margin: '8px 0'
534
+ }
535
+ }), /*#__PURE__*/React.createElement("div", {
536
+ className: 'toolbar-control d-flex justify-content-end'
537
+ }, toolbarItems.map(it => {
538
+ return /*#__PURE__*/React.createElement("div", {
539
+ key: it.key,
540
+ className: 'toolbar-item',
541
+ onClick: () => toolbarClick?.({
542
+ item: it,
543
+ column
544
+ })
545
+ }, it.template ? getTemplate(it.template) : /*#__PURE__*/React.createElement(Button, {
546
+ className: "toolbar-item-btn"
547
+ }, it.icon && getTemplate(it.icon), it.title));
548
+ }))));
549
+ } else {
550
+ return /*#__PURE__*/React.createElement(React.Fragment, null, " ", menu);
551
+ }
552
+ },
517
553
  "data-tooltip-content": message,
518
554
  "data-tooltip-id": `${id}-tooltip-error`
519
555
  });
@@ -563,45 +599,31 @@ const EditableCell = props => {
563
599
  optionFilterProp: "label",
564
600
  popupClassName: 'be-popup-container',
565
601
  loadOptions: loadOptions,
566
- status: isInvalid ? 'error' : undefined
567
- // dropdownRender={(menu) => {
568
- // if (toolbarItems && toolbarItems.length > 0) {
569
- // return (
570
- // <>
571
- // {menu}
572
- // <Divider style={{margin: '8px 0'}}/>
573
- //
574
- // <div
575
- // className={'toolbar-control d-flex justify-content-end'}
576
- // >
577
- // {toolbarItems.map((it) => {
578
- // return (
579
- // <div
580
- // key={it.key}
581
- // className={'toolbar-item'}
582
- // onClick={() => toolbarClick?.({item: it, column})}
583
- // >
584
- // {it.template ? getTemplate(it.template) : (
585
- // <Button className='toolbar-item-btn'>
586
- //
587
- // {it.icon && getTemplate(it.icon)}
588
- // {it.title}
589
- // </Button>
590
- // )}
591
- //
592
- // </div>
593
- // )
594
- // })}
595
- //
596
- // </div>
597
- // </>
598
- // )
599
- // } else {
600
- // return <> {menu}</>
601
- // }
602
- //
603
- // }}
604
- ,
602
+ status: isInvalid ? 'error' : undefined,
603
+ dropdownRender: menu => {
604
+ if (toolbarItems && toolbarItems.length > 0) {
605
+ return /*#__PURE__*/React.createElement(React.Fragment, null, menu, toolbarItems && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Divider, {
606
+ style: {
607
+ margin: '8px 0'
608
+ }
609
+ }), /*#__PURE__*/React.createElement("div", {
610
+ className: 'toolbar-control d-flex justify-content-end'
611
+ }, toolbarItems.map(it => {
612
+ return /*#__PURE__*/React.createElement("div", {
613
+ key: it.key,
614
+ className: 'toolbar-item',
615
+ onClick: () => toolbarClick?.({
616
+ item: it,
617
+ column
618
+ })
619
+ }, it.template ? getTemplate(it.template) : /*#__PURE__*/React.createElement(Button, {
620
+ className: "toolbar-item-btn"
621
+ }, it.icon && getTemplate(it.icon), it.title));
622
+ }))));
623
+ } else {
624
+ return /*#__PURE__*/React.createElement(React.Fragment, null, " ", menu);
625
+ }
626
+ },
605
627
  filterOption: filterOption,
606
628
  fieldNames: fieldNames ? fieldNames : {
607
629
  value: keySelect,
package/lib/table-component/body/EditableCell.js CHANGED
@@ -21,6 +21,7 @@ var _colors = require("@ant-design/colors");
21
21
  var _EditForm = require("../components/EditForm");
22
22
  var _useContext = require("../useContext");
23
23
  var _locale = require("rc-master-ui/es/locale");
24
+ var _hooks = require("../../grid-component/hooks");
24
25
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
25
26
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
26
27
  const {
@@ -87,7 +88,7 @@ const EditableCell = props => {
87
88
  toolbarItems,
88
89
  filterOption,
89
90
  inputKey,
90
- // toolbarClick,
91
+ toolbarClick,
91
92
  loadOptions,
92
93
  validateOption,
93
94
  options: propsOptions
@@ -401,13 +402,24 @@ const EditableCell = props => {
401
402
  status: isInvalid ? 'error' : undefined,
402
403
  dropdownRender: menu => {
403
404
  if (toolbarItems && toolbarItems.length > 0) {
404
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, menu, /*#__PURE__*/_react.default.createElement(_antd.Divider, {
405
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, menu, toolbarItems && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_antd.Divider, {
405
406
  style: {
406
407
  margin: '8px 0'
407
408
  }
408
409
  }), /*#__PURE__*/_react.default.createElement("div", {
409
410
  className: 'toolbar-control d-flex justify-content-end'
410
- }));
411
+ }, toolbarItems.map(it => {
412
+ return /*#__PURE__*/_react.default.createElement("div", {
413
+ key: it.key,
414
+ className: 'toolbar-item',
415
+ onClick: () => toolbarClick?.({
416
+ item: it,
417
+ column
418
+ })
419
+ }, it.template ? (0, _hooks.getTemplate)(it.template) : /*#__PURE__*/_react.default.createElement(_antd.Button, {
420
+ className: "toolbar-item-btn"
421
+ }, it.icon && (0, _hooks.getTemplate)(it.icon), it.title));
422
+ }))));
411
423
  } else {
412
424
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, " ", menu);
413
425
  }
@@ -522,6 +534,30 @@ const EditableCell = props => {
522
534
  });
523
535
  }
524
536
  },
537
+ dropdownRender: menu => {
538
+ if (toolbarItems && toolbarItems.length > 0) {
539
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, menu, toolbarItems && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_antd.Divider, {
540
+ style: {
541
+ margin: '8px 0'
542
+ }
543
+ }), /*#__PURE__*/_react.default.createElement("div", {
544
+ className: 'toolbar-control d-flex justify-content-end'
545
+ }, toolbarItems.map(it => {
546
+ return /*#__PURE__*/_react.default.createElement("div", {
547
+ key: it.key,
548
+ className: 'toolbar-item',
549
+ onClick: () => toolbarClick?.({
550
+ item: it,
551
+ column
552
+ })
553
+ }, it.template ? (0, _hooks.getTemplate)(it.template) : /*#__PURE__*/_react.default.createElement(_antd.Button, {
554
+ className: "toolbar-item-btn"
555
+ }, it.icon && (0, _hooks.getTemplate)(it.icon), it.title));
556
+ }))));
557
+ } else {
558
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, " ", menu);
559
+ }
560
+ },
525
561
  "data-tooltip-content": message,
526
562
  "data-tooltip-id": `${id}-tooltip-error`
527
563
  });
@@ -571,45 +607,31 @@ const EditableCell = props => {
571
607
  optionFilterProp: "label",
572
608
  popupClassName: 'be-popup-container',
573
609
  loadOptions: loadOptions,
574
- status: isInvalid ? 'error' : undefined
575
- // dropdownRender={(menu) => {
576
- // if (toolbarItems && toolbarItems.length > 0) {
577
- // return (
578
- // <>
579
- // {menu}
580
- // <Divider style={{margin: '8px 0'}}/>
581
- //
582
- // <div
583
- // className={'toolbar-control d-flex justify-content-end'}
584
- // >
585
- // {toolbarItems.map((it) => {
586
- // return (
587
- // <div
588
- // key={it.key}
589
- // className={'toolbar-item'}
590
- // onClick={() => toolbarClick?.({item: it, column})}
591
- // >
592
- // {it.template ? getTemplate(it.template) : (
593
- // <Button className='toolbar-item-btn'>
594
- //
595
- // {it.icon && getTemplate(it.icon)}
596
- // {it.title}
597
- // </Button>
598
- // )}
599
- //
600
- // </div>
601
- // )
602
- // })}
603
- //
604
- // </div>
605
- // </>
606
- // )
607
- // } else {
608
- // return <> {menu}</>
609
- // }
610
- //
611
- // }}
612
- ,
610
+ status: isInvalid ? 'error' : undefined,
611
+ dropdownRender: menu => {
612
+ if (toolbarItems && toolbarItems.length > 0) {
613
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, menu, toolbarItems && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_antd.Divider, {
614
+ style: {
615
+ margin: '8px 0'
616
+ }
617
+ }), /*#__PURE__*/_react.default.createElement("div", {
618
+ className: 'toolbar-control d-flex justify-content-end'
619
+ }, toolbarItems.map(it => {
620
+ return /*#__PURE__*/_react.default.createElement("div", {
621
+ key: it.key,
622
+ className: 'toolbar-item',
623
+ onClick: () => toolbarClick?.({
624
+ item: it,
625
+ column
626
+ })
627
+ }, it.template ? (0, _hooks.getTemplate)(it.template) : /*#__PURE__*/_react.default.createElement(_antd.Button, {
628
+ className: "toolbar-item-btn"
629
+ }, it.icon && (0, _hooks.getTemplate)(it.icon), it.title));
630
+ }))));
631
+ } else {
632
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, " ", menu);
633
+ }
634
+ },
613
635
  filterOption: filterOption,
614
636
  fieldNames: fieldNames ? fieldNames : {
615
637
  value: keySelect,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "es-grid-template",
3
- "version": "1.8.91",
3
+ "version": "1.8.92",
4
4
  "description": "es-grid-template",
5
5
  "keywords": [
6
6
  "react",