ods-component-lib 1.18.259 → 1.18.261

package/dist/components/devextreme/OdsTimelineTable/OdsTimelineTable.Types.d.ts

@@ -160,6 +160,8 @@ export interface ITranslationValue {
     translatedValue: string;
 }
 export interface IOdsTimelineTableColumnChooserProps {
+    open: boolean;
+    onVisibilityChanged: (visible: boolean) => void;
     title: string;
     selectAllText: string;
     items: IOdsTimelineTableColumnChooserItemProps[];

package/dist/index.js

@@ -56779,7 +56779,7 @@ var OdsTimelineTableColumnChooser = function OdsTimelineTableColumnChooser(props
   var initialSelectedColumns = props.items.filter(function (item) {
     return item.visible !== false;
   });
-  var _useState = React.useState(false),
+  var _useState = React.useState(props.open),
     open = _useState[0],
     setOpen = _useState[1];
   var _useState2 = React.useState(props.items),
@@ -56868,62 +56868,66 @@ var OdsTimelineTableColumnChooser = function OdsTimelineTableColumnChooser(props
     })),
     selectAll = _useState4[0],
     setSelectAll = _useState4[1];
-  var content = React__default.createElement("div", {
-    key: "OdsTimelineTableColumnChooser_content",
-    className: timelineTableStyles.columnChooserPopup
-  }, React__default.createElement("div", {
-    key: "OdsTimelineTableColumnChooser_header",
-    className: timelineTableStyles.columnChooserHeader
-  }, React__default.createElement("span", {
-    key: "OdsTimelineTableColumnChooser_title"
-  }, props.title), React__default.createElement("span", {
-    key: "OdsTimelineTableColumnChooser_closebutton",
-    className: timelineTableStyles.columnChooserCloseButton
-  }, React__default.createElement(outline.CrossIcon, {
-    style: {
-      cursor: "pointer"
-    },
-    onClick: function onClick() {
-      return setOpen(false);
-    }
-  }))), React__default.createElement(OdsInput, {
-    key: "OdsTimelineTableColumnChooser_OdsSearch",
-    prefix: React__default.createElement("span", {
-      className: "dx-icon-search " + timelineTableStyles.searchBoxIcon
-    }),
-    className: timelineTableStyles.columnChooserSearchbox,
-    onChange: function onChange(e) {
-      return filterColumns(e.target.value);
-    }
-  }), React__default.createElement(OdsCheckbox, {
-    key: "OdsTimelineTableColumnChooser_SelectAll",
-    className: timelineTableStyles.columnChooserCheckbox,
-    checked: selectAll,
-    onChange: function onChange(e) {
-      return selectAllChanged(e.target.checked);
-    }
-  }, props.selectAllText), React__default.createElement(antd.Divider, {
-    key: "OdsTimelineTableColumnChooser_Divider",
-    className: timelineTableStyles.columnChooserDivider
-  }), columns.map(function (_column, index) {
+  var content = React.useMemo(function () {
     return React__default.createElement("div", {
-      key: "OdsTimelineTableColumnChooser_columns_item_" + index
-    }, React__default.createElement(OdsCheckbox, {
-      key: "OdsTimelineTableColumnChooser_OdsCheckbox_" + index,
+      key: "OdsTimelineTableColumnChooser_content",
+      className: timelineTableStyles.columnChooserPopup
+    }, React__default.createElement("div", {
+      key: "OdsTimelineTableColumnChooser_header",
+      className: timelineTableStyles.columnChooserHeader
+    }, React__default.createElement("span", {
+      key: "OdsTimelineTableColumnChooser_title"
+    }, props.title), React__default.createElement("span", {
+      key: "OdsTimelineTableColumnChooser_closebutton",
+      className: timelineTableStyles.columnChooserCloseButton
+    }, React__default.createElement(outline.CrossIcon, {
+      style: {
+        cursor: "pointer"
+      },
+      onClick: function onClick() {
+        setOpen(false);
+        props.onVisibilityChanged && props.onVisibilityChanged(false);
+      }
+    }))), React__default.createElement(OdsInput, {
+      key: "OdsTimelineTableColumnChooser_OdsSearch",
+      prefix: React__default.createElement("span", {
+        className: "dx-icon-search " + timelineTableStyles.searchBoxIcon
+      }),
+      className: timelineTableStyles.columnChooserSearchbox,
+      onChange: function onChange(e) {
+        return filterColumns(e.target.value);
+      }
+    }), React__default.createElement(OdsCheckbox, {
+      key: "OdsTimelineTableColumnChooser_SelectAll",
       className: timelineTableStyles.columnChooserCheckbox,
-      checked: isSelected(_column.columnName),
+      checked: selectAll,
       onChange: function onChange(e) {
-        return selectChanged(e.target.checked, _column);
+        return selectAllChanged(e.target.checked);
       }
-    }, _column.columnCaption));
-  }));
+    }, props.selectAllText), React__default.createElement(antd.Divider, {
+      key: "OdsTimelineTableColumnChooser_Divider",
+      className: timelineTableStyles.columnChooserDivider
+    }), columns.map(function (_column, index) {
+      return React__default.createElement("div", {
+        key: "OdsTimelineTableColumnChooser_columns_item_" + index
+      }, React__default.createElement(OdsCheckbox, {
+        key: "OdsTimelineTableColumnChooser_OdsCheckbox_" + index,
+        className: timelineTableStyles.columnChooserCheckbox,
+        checked: isSelected(_column.columnName),
+        onChange: function onChange(e) {
+          return selectChanged(e.target.checked, _column);
+        }
+      }, _column.columnCaption));
+    }));
+  }, [open, columns]);
   return React__default.createElement(React__default.Fragment, null, React__default.createElement(antd.Popover, {
     open: open,
     content: content
   }, React__default.createElement(button.Button, {
     icon: "columnchooser",
     onClick: function onClick() {
-      return setOpen(true);
+      setOpen(true);
+      props.onVisibilityChanged && props.onVisibilityChanged(true);
     }
   })));
 };
@@ -56936,7 +56940,7 @@ var callAddFont = function callAddFont() {
 jsPDF.jsPDF.API.events.push(['addFonts', callAddFont]);
 
 var OdsTimelineTable = React.forwardRef(function (props, ref) {
-  var _toolbarSettings$sear, _toolbarSettings$sear5, _toolbarSettings$expo12, _toolbarSettings$expo13, _toolbarSettings$expo14, _toolbarSettings$expo15, _toolbarSettings$expo19, _toolbarSettings$expo20, _toolbarSettings$expo21, _toolbarSettings$colu, _props$toolbarSetting5, _props$toolbarSetting6, _props$toolbarSetting7, _props$toolbarSetting8;
+  var _toolbarSettings$sear, _toolbarSettings$sear5, _toolbarSettings$expo12, _toolbarSettings$expo13, _toolbarSettings$expo14, _toolbarSettings$expo15, _toolbarSettings$expo19, _toolbarSettings$expo20, _toolbarSettings$expo21, _toolbarSettings$colu;
   var customColumns = props.customColumns,
     customTasks = props.customTasks,
     customTaskKey = props.customTaskKey,
@@ -56955,10 +56959,10 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
   var refGantt = React.useRef(null);
   var refGanttExportable = React.useRef(null);
   var refDataGridExportable = React.useRef(null);
-  var _useState = React.useState(startDateRange != null ? startDateRange : Constants.timelineDefaultStartDate),
+  var _useState = React.useState(Constants.timelineDefaultStartDate),
     startDate = _useState[0],
     setStartDate = _useState[1];
-  var _useState2 = React.useState(endDateRange != null ? endDateRange : Constants.timelineDefaultEndDate),
+  var _useState2 = React.useState(Constants.timelineDefaultEndDate),
     endDate = _useState2[0],
     setEndDate = _useState2[1];
   var _useState3 = React.useState([]),
@@ -56989,11 +56993,8 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
     })),
     unvisibleColumnNames = _useState9[0];
   var _useState10 = React.useState(false),
-    exportPdfModalOpen = _useState10[0],
-    setExportPdfModalOpen = _useState10[1];
-  var _useState11 = React.useState(false),
-    exporting = _useState11[0],
-    setExporting = _useState11[1];
+    columnChooserOpen = _useState10[0],
+    setColumnChooserOpen = _useState10[1];
   var originalSortingMode = sorting.mode === undefined || sorting.mode === "" ? "none" : sorting.mode;
   var sortingMode = sortingProcess == "ServerSideSorting" ? "none" : originalSortingMode;
   var showSortIndexes = sortingProcess == "ServerSideSorting" ? false : sorting.showSortIndexes;
@@ -57004,11 +57005,27 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
   React.useEffect(function () {
     updateExportableTasks();
   }, [timelineTasks]);
+  React.useEffect(function () {
+    setStartDate(startDateRange);
+  }, [startDateRange]);
+  React.useEffect(function () {
+    setEndDate(endDateRange);
+  }, [endDateRange]);
   React.useEffect(function () {
     if (sortingChangeEventProps.columnHeaderProps !== null) {
       onSortingChanged && onSortingChanged(sortingChangeEventProps.sortedColumns, sortingChangeEventProps.columnHeaderProps);
     }
   }, [sortingChangeEventProps]);
+  var getTimelineStartDate = function getTimelineStartDate() {
+    var newSD = startDate;
+    newSD.setDate(1);
+    return newSD;
+  };
+  var getTimelineEndDate = function getTimelineEndDate() {
+    var newED = endDate;
+    newED = moment__default(newED).add(1, "months").set("date", 28).toDate();
+    return newED;
+  };
   var actionButtons = React.useMemo(function () {
     if (actionColumnSettings.actionButtonGroup) {
       if (actionColumnSettings.actionButtonGroup.length > 3) {
@@ -57033,8 +57050,7 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
     setExportableTasks(result);
   };
   var prepareTimelineTasks = function prepareTimelineTasks(tasks, selectedKeys) {
-    var _tasks = mapSelectedKeys(tasks.map(mapCustomTask), customTaskKey, multiSelectionEnabled ? selectedKeys : selectedKeys.length > 0 ? selectedKeys[0] : []);
-    setTimelineTasks(_tasks);
+    setTimelineTasks(mapSelectedKeys(tasks.map(mapCustomTask), customTaskKey, multiSelectionEnabled ? selectedKeys : selectedKeys.length > 0 ? selectedKeys[0] : []));
   };
   var getSelectedRowsData = function getSelectedRowsData() {
     return timelineTasks.filter(function (item) {
@@ -57274,8 +57290,7 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
     }).then(function (doc) {
       return doc.save(getExportFileName());
     })["finally"](function () {
-      setExporting(false);
-      setExportPdfModalOpen(false);
+      return exportableTimelineTable.repaint();
     });
   };
   var getExportFileName = function getExportFileName() {
@@ -57310,41 +57325,6 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
     });
     return newExportedColumns;
   }, [exportableTasks, columnList]);
-  var exportableTimelineTable = React__default.createElement(React__default.Fragment, null, React__default.createElement(antd.Spin, {
-    size: "large",
-    spinning: exporting
-  }, React__default.createElement("div", {
-    style: {
-      overflowX: "auto",
-      overflowY: "auto",
-      paddingTop: 20
-    }
-  }, React__default.createElement(gantt.Gantt, Object.assign({
-    key: "OdsTimelineTableExportable",
-    width: "100%",
-    height: 500,
-    startDateRange: startDate,
-    endDateRange: endDate,
-    taskContentRender: function taskContentRender(params) {
-      return React__default.createElement(OdsTimelineTableTaskTemplate, Object.assign({}, params));
-    }
-  }, props, {
-    ref: refGanttExportable,
-    sorting: {
-      mode: "none",
-      showSortIndexes: false
-    }
-  }), React__default.createElement(gantt.ContextMenu, {
-    enabled: false
-  }), exportedColumns.map(function (columnProps, index) {
-    return React__default.createElement(gantt.Column, Object.assign({}, columnProps, {
-      key: "TimelineTable_ExportPdfColumn_" + index
-    }));
-  }), React__default.createElement(gantt.Tasks, {
-    dataSource: exportableTasks
-  }), children, React__default.createElement(gantt.Sorting, {
-    mode: "none"
-  })))));
   React.useImperativeHandle(ref, function () {
     return {
       getSelectedRowsData: getSelectedRowsData,
@@ -57356,8 +57336,8 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
     key: "OdsTimelineTable",
     width: "100%",
     height: 500,
-    startDateRange: startDate,
-    endDateRange: endDate,
+    startDateRange: getTimelineStartDate(),
+    endDateRange: getTimelineEndDate(),
     taskContentRender: function taskContentRender(params) {
       return React__default.createElement(OdsTimelineTableTaskTemplate, Object.assign({}, params));
     }
@@ -57412,8 +57392,7 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
           icon: "exportpdf",
           onClick: function onClick() {
             if (exportableTasks.length > 0) {
-              setExportPdfModalOpen(true);
-              setExporting(true);
+              exportPdf();
             } else {
               var _toolbarSettings$expo16, _toolbarSettings$expo17, _toolbarSettings$expo18;
               OdsNotification({
@@ -57427,7 +57406,19 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
         }, {
           text: (_toolbarSettings$expo19 = toolbarSettings === null || toolbarSettings === void 0 ? void 0 : (_toolbarSettings$expo20 = toolbarSettings["export"]) === null || _toolbarSettings$expo20 === void 0 ? void 0 : (_toolbarSettings$expo21 = _toolbarSettings$expo20.excel) === null || _toolbarSettings$expo21 === void 0 ? void 0 : _toolbarSettings$expo21.title) != null ? _toolbarSettings$expo19 : "Export to Excel",
           icon: "exportxlsx",
-          onClick: exportExcel
+          onClick: function onClick() {
+            if (exportableTasks.length > 0) {
+              exportExcel();
+            } else {
+              var _toolbarSettings$expo22, _toolbarSettings$expo23, _toolbarSettings$expo24;
+              OdsNotification({
+                title: "",
+                content: (_toolbarSettings$expo22 = toolbarSettings === null || toolbarSettings === void 0 ? void 0 : (_toolbarSettings$expo23 = toolbarSettings["export"]) === null || _toolbarSettings$expo23 === void 0 ? void 0 : (_toolbarSettings$expo24 = _toolbarSettings$expo23.messages) === null || _toolbarSettings$expo24 === void 0 ? void 0 : _toolbarSettings$expo24.noRecord) != null ? _toolbarSettings$expo22 : "No record",
+                type: "warning",
+                placement: "bottom"
+              });
+            }
+          }
         }]
       }]
     }
@@ -57438,6 +57429,10 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
     component: function component(props) {
       var _toolbarSettings$colu2, _toolbarSettings$colu3, _toolbarSettings$colu4, _toolbarSettings$colu5;
       return OdsTimelineTableColumnChooser(_extends({}, props, {
+        open: columnChooserOpen,
+        onVisibilityChanged: function onVisibilityChanged(visible) {
+          return setColumnChooserOpen(visible);
+        },
         title: (_toolbarSettings$colu2 = toolbarSettings === null || toolbarSettings === void 0 ? void 0 : (_toolbarSettings$colu3 = toolbarSettings.columnChooser) === null || _toolbarSettings$colu3 === void 0 ? void 0 : _toolbarSettings$colu3.title) != null ? _toolbarSettings$colu2 : "Column Chooser",
         selectAllText: (_toolbarSettings$colu4 = toolbarSettings === null || toolbarSettings === void 0 ? void 0 : (_toolbarSettings$colu5 = toolbarSettings.columnChooser) === null || _toolbarSettings$colu5 === void 0 ? void 0 : _toolbarSettings$colu5.selectAllText) != null ? _toolbarSettings$colu4 : "Select All",
         items: columnList.filter(function (item) {
@@ -57483,7 +57478,8 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
       }, columnProps));
     }
   }), actionColumnSettings.actionColumnEnable != false ? React__default.createElement(gantt.Column, Object.assign({
-    key: "OdsTimelineColumn_Actions"
+    key: "OdsTimelineColumn_Actions",
+    width: 100
   }, actionColumnProps, {
     caption: actionColumnSettings.actionButtonGroupCaption,
     cssClass: "actionButtonGroupCell",
@@ -57495,23 +57491,20 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
   }), children, React__default.createElement(gantt.Sorting, {
     mode: sortingMode,
     showSortIndexes: showSortIndexes
-  })), React__default.createElement(antd.Modal, {
-    title: (_props$toolbarSetting5 = (_props$toolbarSetting6 = props.toolbarSettings) === null || _props$toolbarSetting6 === void 0 ? void 0 : (_props$toolbarSetting7 = _props$toolbarSetting6["export"]) === null || _props$toolbarSetting7 === void 0 ? void 0 : (_props$toolbarSetting8 = _props$toolbarSetting7.pdf) === null || _props$toolbarSetting8 === void 0 ? void 0 : _props$toolbarSetting8.loadingText) != null ? _props$toolbarSetting5 : "Exporting to Pdf",
-    width: 1200,
-    open: exportPdfModalOpen,
-    closable: false,
-    footer: "",
-    afterOpenChange: function afterOpenChange(open) {
-      if (open) {
-        var _exportableTimelineTable = refGanttExportable.current.instance;
-        _exportableTimelineTable.refresh().then(function () {
-          setTimeout(function () {
-            return exportPdf();
-          }, 2000);
-        });
-      }
-    }
-  }, exportableTimelineTable), React__default.createElement(DataGrid__default, {
+  })), React__default.createElement(gantt.Gantt, Object.assign({}, props, {
+    startDateRange: getTimelineStartDate(),
+    endDateRange: getTimelineEndDate(),
+    width: 0,
+    height: 0,
+    ref: refGanttExportable,
+    key: "OdsTimelineTable_Export"
+  }), exportedColumns.map(function (columnProps, index) {
+    return React__default.createElement(gantt.Column, Object.assign({}, columnProps, {
+      key: "TimelineTable_ExportPdfColumn_" + index
+    }));
+  }), React__default.createElement(gantt.Tasks, {
+    dataSource: exportableTasks
+  }), children), React__default.createElement(DataGrid__default, {
     key: "DataGrid_Export",
     ref: refDataGridExportable,
     className: "odsTimelineTable-ExportDataGrid",