ods-component-lib 1.18.259 → 1.18.260

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);
     }
   })));
 };
@@ -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([]),
@@ -56994,6 +56998,9 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
   var _useState11 = React.useState(false),
     exporting = _useState11[0],
     setExporting = _useState11[1];
+  var _useState12 = React.useState(false),
+    columnChooserOpen = _useState12[0],
+    setColumnChooserOpen = _useState12[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 +57011,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", 15).toDate();
+    return newED;
+  };
   var actionButtons = React.useMemo(function () {
     if (actionColumnSettings.actionButtonGroup) {
       if (actionColumnSettings.actionButtonGroup.length > 3) {
@@ -57323,8 +57346,8 @@ var OdsTimelineTable = React.forwardRef(function (props, ref) {
     key: "OdsTimelineTableExportable",
     width: "100%",
     height: 500,
-    startDateRange: startDate,
-    endDateRange: endDate,
+    startDateRange: getTimelineStartDate(),
+    endDateRange: getTimelineEndDate(),
     taskContentRender: function taskContentRender(params) {
       return React__default.createElement(OdsTimelineTableTaskTemplate, Object.assign({}, params));
     }
@@ -57356,8 +57379,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));
     }
@@ -57438,6 +57461,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) {