@sme.up/ketchup 9.2.0 → 9.3.0

package/dist/collection/components/kup-planner/kup-planner.js

@@ -1,28 +1,25 @@
 var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
-  if (kind === "a" && !f)
-    throw new TypeError("Private accessor was defined without a getter");
-  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
-    throw new TypeError("Cannot read private member from an object whose class did not declare it");
-  return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
 };
 var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
-  if (kind === "m")
-    throw new TypeError("Private method is not writable");
-  if (kind === "a" && !f)
-    throw new TypeError("Private accessor was defined without a setter");
-  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
-    throw new TypeError("Cannot write private member to an object whose class did not declare it");
-  return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+    if (kind === "m")
+        throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
 };
-var _KupPlanner_instances, _KupPlanner_kupManager, _KupPlanner_lastOnChangeReceived, _KupPlanner_rootPlanner, _KupPlanner_phases, _KupPlanner_storedSettings, _KupPlanner_renderReactPlannerElement, _KupPlanner_toTasks, _KupPlanner_toDetails, _KupPlanner_getTask, _KupPlanner_removePhases, _KupPlanner_handleOnClickOnTask, _KupPlanner_handleOnClickOnPhase, _KupPlanner_handleOnClickOnDetail, _KupPlanner_handleOnContextMenuOnTask, _KupPlanner_handleOnContextMenuOnPhase, _KupPlanner_handleOnContextMenuOnDetail, _KupPlanner_emitOnChangeEventsReceived, _KupPlanner_onFilter, _KupPlanner_getFilteredRows, _KupPlanner_getIconUrl, _KupPlanner_getIconColor;
+var _KupPlanner_instances, _KupPlanner_kupManager, _KupPlanner_lastOnChangeReceived, _KupPlanner_clickTimeout, _KupPlanner_phases, _KupPlanner_storedSettings, _KupPlanner_toTasks, _KupPlanner_toDetails, _KupPlanner_getTask, _KupPlanner_removePhases, _KupPlanner_handleOnDblClickOnTask, _KupPlanner_handleOnDblClickOnPhase, _KupPlanner_handleOnDblClickOnDetail, _KupPlanner_handleOnClickOnTask, _KupPlanner_handleOnClickOnPhase, _KupPlanner_handleOnClickOnDetail, _KupPlanner_handleOnContextMenuOnTask, _KupPlanner_handleOnContextMenuOnPhase, _KupPlanner_handleOnContextMenuOnDetail, _KupPlanner_emitOnChangeEventsReceived, _KupPlanner_onFilter, _KupPlanner_getFilteredRows, _KupPlanner_getIconUrl, _KupPlanner_getIconColor;
 import { forceUpdate, getAssetPath, h, Host, } from "@stencil/core";
 import { kupManagerInstance, } from "../../managers/kup-manager/kup-manager";
-import { defaultStylingOptions, KupPlannerLastOnChangeReceived, KupPlannerProps, KupPlannerTaskAction, KupPlannerGanttRowType, } from "./kup-planner-declarations";
+import { KupPlannerLastOnChangeReceived, KupPlannerProps, KupPlannerTaskAction, KupPlannerGanttRowType, defaultStylingOptions, } from "./kup-planner-declarations";
 import { getProps, setProps } from "../../utils/utils";
 import { componentWrapperId } from "../../variables/GenericVariables";
-import { createRoot } from "react-dom/client";
-import React from "react";
-import { Planner, } from "@sme.up/gantt-component";
 import { getCellValueForDisplay } from "../../utils/cell-utils";
 import { getValuesToShow, isAtLeastOneDateValid, sanitizeAllDates, } from "./kup-planner-helper";
 import { FTextField } from "../../f-components/f-text-field/f-text-field";
@@ -31,1720 +28,1825 @@ import { KupThemeIconValues } from "../../managers/kup-theme/kup-theme-declarati
 import { KupLanguageSearch } from "../../managers/kup-language/kup-language-declarations";
 import { KupPlannerState } from "./kup-planner-state";
 export class KupPlanner {
-  constructor() {
-    _KupPlanner_instances.add(this);
-    this.state = new KupPlannerState();
-    /*-------------------------------------------------*/
-    /*       I n t e r n a l   V a r i a b l e s       */
-    /*-------------------------------------------------*/
-    _KupPlanner_kupManager.set(this, kupManagerInstance());
-    _KupPlanner_lastOnChangeReceived.set(this, void 0);
-    _KupPlanner_rootPlanner.set(this, void 0);
-    _KupPlanner_phases.set(this, {});
-    // no re-render
-    _KupPlanner_storedSettings.set(this, void 0);
-    this.stateId = '';
-    this.store = undefined;
-    this.customStyle = '';
-    this.data = undefined;
-    this.detailData = undefined;
-    this.detailColorCol = undefined;
-    this.detailColumns = undefined;
-    this.detailDates = undefined;
-    this.detailFilter = undefined;
-    this.detailHeight = undefined;
-    this.detailIconCol = undefined;
-    this.detailIdCol = undefined;
-    this.detailNameCol = undefined;
-    this.detailPrevDates = undefined;
-    this.detailInitialScrollX = undefined;
-    this.detailInitialScrollY = undefined;
-    this.listCellWidth = '300px';
-    this.maxWidth = '90vw';
-    this.phaseColorCol = undefined;
-    this.phaseColumns = undefined;
-    this.phaseColParDep = undefined;
-    this.phaseDates = undefined;
-    this.phaseIconCol = undefined;
-    this.phaseIdCol = undefined;
-    this.phaseNameCol = undefined;
-    this.phasePrevDates = undefined;
-    this.readOnly = false;
-    this.showSecondaryDates = false;
-    this.taskColumns = undefined;
-    this.taskDates = undefined;
-    this.taskFilter = undefined;
-    this.taskHeight = undefined;
-    this.taskIconCol = undefined;
-    this.taskIdCol = undefined;
-    this.taskInitialScrollX = undefined;
-    this.taskInitialScrollY = undefined;
-    this.taskNameCol = undefined;
-    this.taskPrevDates = undefined;
-    this.titleMess = undefined;
-    this.viewMode = 'month';
-    this.plannerProps = undefined;
-  }
-  initWithPersistedState() {
-    if (this.store && this.stateId) {
-      const state = this.store.getState(this.stateId);
-      if (state != null) {
-        __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logMessage(this, 'Initializing stateId ' + this.stateId);
-        // *** PROPS ***
-        this.detailFilter = state.detailFilter;
-        this.showSecondaryDates = state.showSecondaryDates;
-        this.detailInitialScrollX = state.detailInitialScrollX;
-        this.detailInitialScrollY = state.detailInitialScrollY;
-        this.taskFilter = state.taskFilter;
-        this.taskInitialScrollX = state.taskInitialScrollX;
-        this.taskInitialScrollY = state.taskInitialScrollY;
-        this.viewMode = state.viewMode;
-      }
-    }
-  }
-  persistState() {
-    if (this.store && this.stateId) {
-      let somethingChanged = false;
-      if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.detailFilter, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailFilter)) {
-        this.state.detailFilter = __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailFilter;
-        somethingChanged = true;
-      }
-      if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.showSecondaryDates, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").showSecondaryDates)) {
-        this.state.showSecondaryDates =
-          __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").showSecondaryDates;
-        somethingChanged = true;
-      }
-      if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.detailInitialScrollX, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollX)) {
-        this.state.detailInitialScrollX =
-          __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollX;
-        somethingChanged = true;
-      }
-      if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.detailInitialScrollY, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollY)) {
-        this.state.detailInitialScrollY =
-          __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollY;
-        somethingChanged = true;
-      }
-      if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.taskFilter, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskFilter)) {
-        this.state.taskFilter = __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskFilter;
-        somethingChanged = true;
-      }
-      if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.taskInitialScrollX, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollX)) {
-        this.state.taskInitialScrollX =
-          __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollX;
-        somethingChanged = true;
-      }
-      if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.taskInitialScrollY, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollY)) {
-        this.state.taskInitialScrollY =
-          __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollY;
-        somethingChanged = true;
-      }
-      if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.viewMode, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").viewMode)) {
-        this.state.viewMode = __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").viewMode;
-        somethingChanged = true;
-      }
-      if (somethingChanged) {
-        __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logMessage(this, 'Persisting stateId ' + this.stateId);
-        this.store.persistState(this.stateId, this.state);
-      }
+    constructor() {
+        _KupPlanner_instances.add(this);
+        this.state = new KupPlannerState();
+        /*-------------------------------------------------*/
+        /*       I n t e r n a l   V a r i a b l e s       */
+        /*-------------------------------------------------*/
+        _KupPlanner_kupManager.set(this, kupManagerInstance());
+        _KupPlanner_lastOnChangeReceived.set(this, void 0);
+        _KupPlanner_clickTimeout.set(this, []);
+        _KupPlanner_phases.set(this, {});
+        // no re-render
+        _KupPlanner_storedSettings.set(this, void 0);
+        this.stateId = '';
+        this.store = undefined;
+        this.customStyle = '';
+        this.data = undefined;
+        this.detailData = undefined;
+        this.detailColorCol = undefined;
+        this.detailColumns = undefined;
+        this.detailDates = undefined;
+        this.detailFilter = undefined;
+        this.detailHeight = undefined;
+        this.detailIconCol = undefined;
+        this.detailIdCol = undefined;
+        this.detailNameCol = undefined;
+        this.detailPrevDates = undefined;
+        this.detailInitialScrollX = undefined;
+        this.detailInitialScrollY = undefined;
+        this.listCellWidth = '300px';
+        this.maxWidth = '90vw';
+        this.phaseColorCol = undefined;
+        this.phaseColumns = undefined;
+        this.phaseColParDep = undefined;
+        this.phaseDates = undefined;
+        this.phaseIconCol = undefined;
+        this.phaseIdCol = undefined;
+        this.phaseNameCol = undefined;
+        this.phasePrevDates = undefined;
+        this.readOnly = false;
+        this.showSecondaryDates = false;
+        this.taskColumns = undefined;
+        this.taskDates = undefined;
+        this.taskFilter = undefined;
+        this.taskHeight = undefined;
+        this.taskIconCol = undefined;
+        this.taskIdCol = undefined;
+        this.taskInitialScrollX = undefined;
+        this.taskInitialScrollY = undefined;
+        this.taskNameCol = undefined;
+        this.taskPrevDates = undefined;
+        this.titleMess = undefined;
+        this.viewMode = 'month';
+        this.mainFilter = undefined;
+        this.secondaryFilter = undefined;
+        this.plannerProps = undefined;
     }
-  }
-  dataChanged() {
-    __classPrivateFieldSet(this, _KupPlanner_phases, {}, "f");
-  }
-  /*-------------------------------------------------*/
-  /*           P u b l i c   M e t h o d s           */
-  /*-------------------------------------------------*/
-  /**
-   * Used to retrieve component's props values.
-   * @param {boolean} descriptions - When provided and true, the result will be the list of props with their description.
-   * @returns {Promise<GenericObject>} List of props as object, each key will be a prop.
-   */
-  async getProps(descriptions) {
-    return getProps(this, KupPlannerProps, descriptions);
-  }
-  /**
-   * This method is used to trigger a new render of the component.
-   */
-  async refresh() {
-    forceUpdate(this);
-  }
-  /**
-   * Sets the props to the component.
-   * @param {GenericObject} props - Object containing props that will be set to the component.
-   */
-  async setProps(props) {
-    setProps(this, KupPlannerProps, props);
-  }
-  /**
-   * Add a list of phases to the project
-   * @param taskId
-   * @param data - Matrix which contains project phases
-   */
-  async addPhases(taskId, data) {
-    var _a;
-    const task = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getTask).call(this, taskId);
-    if (task) {
-      __classPrivateFieldGet(this, _KupPlanner_phases, "f")[taskId] = data;
-      task.phases = (_a = data.rows) === null || _a === void 0 ? void 0 : _a.filter((row) => isAtLeastOneDateValid(row.cells[this.phaseDates[0]], row.cells[this.phaseDates[1]])).map((row) => {
-        const datesSanitized = sanitizeAllDates(row.cells[this.phaseDates[0]], row.cells[this.phaseDates[1]], row.cells[this.phasePrevDates[0]], row.cells[this.phasePrevDates[1]]);
-        const valuesToShow = getValuesToShow(row, this.phaseIdCol, this.phaseNameCol, data.columns, this.phaseColumns, () => this.phaseColumns.map((col) => col == this.phaseDates[0]
-          ? '#START#'
-          : col == this.phaseDates[1]
-            ? '#END#'
-            : getCellValueForDisplay(data.columns.find((kCol) => kCol.name == col), row.cells[col])));
-        let iconUrl = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconUrl).call(this, row, this.phaseIconCol);
-        let iconColor = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconColor).call(this, row, this.phaseIconCol);
-        let phase = {
-          taskRow: task.taskRow,
-          phaseRow: row,
-          id: task.id + '_' + row.cells[this.phaseIdCol].value,
-          phaseRowId: row.id,
-          taskRowId: task.taskRowId,
-          name: row.cells[this.phaseNameCol].value,
-          startDate: datesSanitized.dateValues[0],
-          endDate: datesSanitized.dateValues[1],
-          secondaryStartDate: datesSanitized.secDateValues[0],
-          secondaryEndDate: datesSanitized.secDateValues[1],
-          type: 'task',
-          color: row.cells[this.phaseColorCol].value,
-          selectedColor: row.cells[this.phaseColorCol].value,
-          valuesToShow: valuesToShow,
-          rowType: KupPlannerGanttRowType.PHASE,
-          icon: iconUrl
-            ? { url: iconUrl, color: iconColor !== null && iconColor !== void 0 ? iconColor : '#595959' }
-            : undefined,
-        };
-        return phase;
-      });
+    initWithPersistedState() {
+        if (this.store && this.stateId) {
+            const state = this.store.getState(this.stateId);
+            if (state != null) {
+                __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logMessage(this, 'Initializing stateId ' + this.stateId);
+                // *** PROPS ***
+                this.detailFilter = state.detailFilter;
+                this.showSecondaryDates = state.showSecondaryDates;
+                this.detailInitialScrollX = state.detailInitialScrollX;
+                this.detailInitialScrollY = state.detailInitialScrollY;
+                this.taskFilter = state.taskFilter;
+                this.taskInitialScrollX = state.taskInitialScrollX;
+                this.taskInitialScrollY = state.taskInitialScrollY;
+                this.viewMode = state.viewMode;
+            }
+        }
     }
-    this.plannerProps.mainGantt.initialScrollX =
-      __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollX;
-    this.plannerProps.mainGantt.initialScrollY =
-      __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollY;
-    if (this.plannerProps.secondaryGantt) {
-      this.plannerProps.secondaryGantt.initialScrollX =
-        __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollX;
-      this.plannerProps.secondaryGantt.initialScrollX =
-        __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollY;
+    persistState() {
+        if (this.store && this.stateId) {
+            let somethingChanged = false;
+            if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.detailFilter, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailFilter)) {
+                this.state.detailFilter = __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailFilter;
+                somethingChanged = true;
+            }
+            if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.showSecondaryDates, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").showSecondaryDates)) {
+                this.state.showSecondaryDates =
+                    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").showSecondaryDates;
+                somethingChanged = true;
+            }
+            if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.detailInitialScrollX, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollX)) {
+                this.state.detailInitialScrollX =
+                    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollX;
+                somethingChanged = true;
+            }
+            if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.detailInitialScrollY, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollY)) {
+                this.state.detailInitialScrollY =
+                    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollY;
+                somethingChanged = true;
+            }
+            if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.taskFilter, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskFilter)) {
+                this.state.taskFilter = __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskFilter;
+                somethingChanged = true;
+            }
+            if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.taskInitialScrollX, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollX)) {
+                this.state.taskInitialScrollX =
+                    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollX;
+                somethingChanged = true;
+            }
+            if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.taskInitialScrollY, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollY)) {
+                this.state.taskInitialScrollY =
+                    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollY;
+                somethingChanged = true;
+            }
+            if (!__classPrivateFieldGet(this, _KupPlanner_kupManager, "f").objects.deepEqual(this.state.viewMode, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").viewMode)) {
+                this.state.viewMode = __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").viewMode;
+                somethingChanged = true;
+            }
+            if (somethingChanged) {
+                __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logMessage(this, 'Persisting stateId ' + this.stateId);
+                this.store.persistState(this.stateId, this.state);
+            }
+        }
     }
-    this.plannerProps = Object.assign({}, this.plannerProps);
-  }
-  //---- Lifecycle hooks ----
-  componentWillLoad() {
-    __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logLoad(this, false);
-    __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").theme.register(this);
-    // *** Store
-    this.initWithPersistedState();
-    __classPrivateFieldSet(this, _KupPlanner_storedSettings, {
-      detailFilter: this.detailFilter,
-      detailInitialScrollX: this.detailInitialScrollX,
-      detailInitialScrollY: this.detailInitialScrollY,
-      showSecondaryDates: this.showSecondaryDates,
-      taskFilter: this.taskFilter,
-      taskInitialScrollX: this.taskInitialScrollX,
-      taskInitialScrollY: this.taskInitialScrollY,
-      viewMode: this.viewMode,
-    }, "f");
-  }
-  componentDidLoad() {
-    let details = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_toDetails).call(this, __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getFilteredRows).call(this, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailFilter, true));
-    const mainFilter = this.rootElement.shadowRoot.querySelector('#main-filter');
-    FTextFieldMDC(mainFilter);
-    const secondaryFilter = this.rootElement.shadowRoot.querySelector('#secondary-filter');
-    if (details) {
-      FTextFieldMDC(secondaryFilter);
+    dataChanged() {
+        __classPrivateFieldSet(this, _KupPlanner_phases, {}, "f");
     }
-    // timeout for scroll events
-    let scrollXTimeout;
-    let taskScrollYTimeout;
-    let detailScrollYTimeout;
-    const scrollDelay = 500;
-    this.plannerProps = {
-      mainGantt: {
-        title: this.titleMess,
-        items: __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_toTasks).call(this, __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getFilteredRows).call(this, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskFilter, false)),
-        stylingOptions: Object.assign(Object.assign({}, defaultStylingOptions), { listCellWidth: this.listCellWidth }),
-        filter: mainFilter,
-        hideLabel: true,
-        ganttHeight: this.taskHeight,
-        showSecondaryDates: __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").showSecondaryDates,
-        onClick: (nativeEvent) => this.handleOnClick(nativeEvent),
-        onContextMenu: (event, row) => this.handleOnContextMenu(event, row),
-        onDateChange: (nativeEvent) => this.handleOnDateChange(nativeEvent),
-        initialScrollX: this.taskInitialScrollX,
-        initialScrollY: this.taskInitialScrollY,
-        readOnly: this.readOnly,
-        onScrollY: (y) => {
-          window.clearTimeout(taskScrollYTimeout);
-          taskScrollYTimeout = window.setTimeout(() => this.handleTaskGanttScrollY(y), scrollDelay);
-        },
-      },
-      secondaryGantt: details
-        ? {
-          title: '',
-          items: details,
-          stylingOptions: Object.assign(Object.assign({}, defaultStylingOptions), { listCellWidth: this.listCellWidth }),
-          filter: secondaryFilter,
-          hideLabel: true,
-          ganttHeight: this.detailHeight,
-          onClick: (nativeEvent) => this.handleOnClick(nativeEvent),
-          onContextMenu: (event, row) => this.handleOnContextMenu(event, row),
-          onDateChange: (nativeEvent) => this.handleOnDateChange(nativeEvent),
-          initialScrollX: this.detailInitialScrollX,
-          initialScrollY: this.detailInitialScrollY,
-          readOnly: this.readOnly,
-          onScrollY: (y) => {
-            window.clearTimeout(detailScrollYTimeout);
-            detailScrollYTimeout = window.setTimeout(() => this.handleDetailGanttScrollY(y), scrollDelay);
-          },
-        }
-        : undefined,
-      onSetDoubleView: (checked) => this.handleOnSetDoubleView(checked),
-      onSetViewMode: (value) => this.handleOnSetViewMode(value),
-      viewMode: this.viewMode,
-      onScrollX: (x) => {
-        window.clearTimeout(scrollXTimeout);
-        scrollXTimeout = window.setTimeout(() => this.handleOnScrollX(x), scrollDelay);
-      },
-    };
-    __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_renderReactPlannerElement).call(this);
-    this.kupReady.emit({
-      comp: this,
-      id: this.rootElement.id,
-      value: undefined,
-    });
-    if (this.taskFilter) {
-      __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_onFilter).call(this, this.taskFilter);
+    /*-------------------------------------------------*/
+    /*           P u b l i c   M e t h o d s           */
+    /*-------------------------------------------------*/
+    /**
+     * Used to retrieve component's props values.
+     * @param {boolean} descriptions - When provided and true, the result will be the list of props with their description.
+     * @returns {Promise<GenericObject>} List of props as object, each key will be a prop.
+     */
+    async getProps(descriptions) {
+        return getProps(this, KupPlannerProps, descriptions);
     }
-    if (this.detailFilter) {
-      __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_onFilter).call(this, this.detailFilter, true);
+    /**
+     * This method is used to trigger a new render of the component.
+     */
+    async refresh() {
+        forceUpdate(this);
     }
-    __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logLoad(this, true);
-  }
-  componentWillRender() {
-    __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_renderReactPlannerElement).call(this);
-  }
-  componentDidRender() {
-    this.persistState();
-    __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logRender(this, true);
-  }
-  onKupClick(event, taskAction) {
-    this.kupClick.emit({
-      comp: this,
-      id: this.rootElement.id,
-      value: event,
-      taskAction: taskAction,
-    });
-  }
-  onKupContextMenu(event, ganttRow, taskAction) {
-    let row;
-    let cell;
-    let column;
-    switch (ganttRow.type) {
-      case 'project': {
-        row = ganttRow.taskRow;
-        cell = row.cells[this.taskIdCol];
-        column = this.data.columns[this.taskIdCol];
-        break;
-      }
-      case 'task': {
-        row = ganttRow.phaseRow;
-        cell = row.cells[this.phaseIdCol];
-        //column = this.data.columns[this.taskIdCol];
-        break;
-      }
-      case 'timeline': {
-        row = ganttRow.detailRow;
-        cell = row.cells[this.detailIdCol];
-        column = this.data.columns[this.detailIdCol];
-        break;
-      }
+    /**
+     * Sets the props to the component.
+     * @param {GenericObject} props - Object containing props that will be set to the component.
+     */
+    async setProps(props) {
+        setProps(this, KupPlannerProps, props);
     }
-    this.kupContextMenu.emit({
-      comp: this,
-      id: this.rootElement.id,
-      value: ganttRow,
-      taskAction: taskAction,
-      details: {
-        cell: cell,
-        column: column,
-        originalEvent: event,
-        row: row,
-      },
-    });
-  }
-  onKupDateChange(event, taskAction) {
-    this.kupDateChange.emit({
-      comp: this,
-      id: this.rootElement.id,
-      value: event,
-      taskAction: taskAction,
-    });
-  }
-  handleOnClick(nativeEvent) {
-    switch (nativeEvent.rowType) {
-      case KupPlannerGanttRowType.TASK:
-        const taskAction = nativeEvent.phases
-          ? KupPlannerTaskAction.onTaskClosing
-          : KupPlannerTaskAction.onTaskOpening;
-        if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnClickOnTask).call(this, nativeEvent)) {
-          this.onKupClick(nativeEvent, taskAction);
-        }
-        break;
-      case KupPlannerGanttRowType.PHASE:
-        if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnClickOnPhase).call(this)) {
-          this.onKupClick(nativeEvent, KupPlannerTaskAction.onClick);
+    /**
+     * Add a list of phases to the project
+     * @param taskId
+     * @param data - Matrix which contains project phases
+     */
+    async addPhases(taskId, data) {
+        var _a;
+        const task = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getTask).call(this, taskId);
+        if (task) {
+            __classPrivateFieldGet(this, _KupPlanner_phases, "f")[taskId] = data;
+            task.phases = (_a = data.rows) === null || _a === void 0 ? void 0 : _a.filter((row) => isAtLeastOneDateValid(row.cells[this.phaseDates[0]], row.cells[this.phaseDates[1]])).map((row) => {
+                const datesSanitized = sanitizeAllDates(row.cells[this.phaseDates[0]], row.cells[this.phaseDates[1]], row.cells[this.phasePrevDates[0]], row.cells[this.phasePrevDates[1]]);
+                const valuesToShow = getValuesToShow(row, this.phaseIdCol, this.phaseNameCol, data.columns, this.phaseColumns, () => this.phaseColumns.map((col) => col == this.phaseDates[0]
+                    ? '#START#'
+                    : col == this.phaseDates[1]
+                        ? '#END#'
+                        : getCellValueForDisplay(data.columns.find((kCol) => kCol.name == col), row.cells[col])));
+                let iconUrl = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconUrl).call(this, row, this.phaseIconCol);
+                let iconColor = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconColor).call(this, row, this.phaseIconCol);
+                let phase = {
+                    taskRow: task.taskRow,
+                    phaseRow: row,
+                    id: task.id + '_' + row.cells[this.phaseIdCol].value,
+                    phaseRowId: row.id,
+                    taskRowId: task.taskRowId,
+                    name: row.cells[this.phaseNameCol].value,
+                    startDate: datesSanitized.dateValues[0],
+                    endDate: datesSanitized.dateValues[1],
+                    secondaryStartDate: datesSanitized.secDateValues[0],
+                    secondaryEndDate: datesSanitized.secDateValues[1],
+                    type: 'task',
+                    color: row.cells[this.phaseColorCol].value,
+                    selectedColor: row.cells[this.phaseColorCol].value,
+                    valuesToShow: valuesToShow,
+                    rowType: KupPlannerGanttRowType.PHASE,
+                    icon: iconUrl
+                        ? { url: iconUrl, color: iconColor !== null && iconColor !== void 0 ? iconColor : '#595959' }
+                        : undefined,
+                };
+                return phase;
+            });
         }
-        break;
-      case KupPlannerGanttRowType.DETAIL:
-        if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnClickOnDetail).call(this)) {
-          this.onKupClick(nativeEvent, KupPlannerTaskAction.onClick);
+        this.plannerProps.mainGantt.initialScrollX =
+            __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollX;
+        this.plannerProps.mainGantt.initialScrollY =
+            __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollY;
+        if (this.plannerProps.secondaryGantt) {
+            this.plannerProps.secondaryGantt.initialScrollX =
+                __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollX;
+            this.plannerProps.secondaryGantt.initialScrollX =
+                __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollY;
         }
-        break;
+        this.plannerProps = Object.assign({}, this.plannerProps);
+    }
+    //---- Lifecycle hooks ----
+    componentWillLoad() {
+        __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logLoad(this, false);
+        __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").theme.register(this);
+        // *** Store
+        this.initWithPersistedState();
+        __classPrivateFieldSet(this, _KupPlanner_storedSettings, {
+            detailFilter: this.detailFilter,
+            detailInitialScrollX: this.detailInitialScrollX,
+            detailInitialScrollY: this.detailInitialScrollY,
+            showSecondaryDates: this.showSecondaryDates,
+            taskFilter: this.taskFilter,
+            taskInitialScrollX: this.taskInitialScrollX,
+            taskInitialScrollY: this.taskInitialScrollY,
+            viewMode: this.viewMode,
+        }, "f");
     }
-  }
-  handleOnContextMenu(event, row) {
-    switch (row.rowType) {
-      case KupPlannerGanttRowType.TASK:
-        if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnContextMenuOnTask).call(this)) {
-          this.onKupContextMenu(event, row, KupPlannerTaskAction.onRightClick);
+    componentDidLoad() {
+        let details = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_toDetails).call(this, __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getFilteredRows).call(this, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailFilter, true));
+        const mainFilter = this.rootElement.shadowRoot.querySelector('#main-filter');
+        FTextFieldMDC(mainFilter);
+        const secondaryFilter = this.rootElement.shadowRoot.querySelector('#secondary-filter');
+        if (details) {
+            FTextFieldMDC(secondaryFilter);
         }
-        break;
-      case KupPlannerGanttRowType.PHASE:
-        if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnContextMenuOnPhase).call(this)) {
-          this.onKupContextMenu(event, row, KupPlannerTaskAction.onRightClick);
+        // timeout for scroll events
+        let scrollXTimeout;
+        let taskScrollYTimeout;
+        let detailScrollYTimeout;
+        const scrollDelay = 500;
+        this.plannerProps = {
+            mainGantt: {
+                title: this.titleMess,
+                items: __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_toTasks).call(this, __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getFilteredRows).call(this, __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskFilter, false)),
+                stylingOptions: Object.assign(Object.assign({}, defaultStylingOptions), { listCellWidth: this.listCellWidth }),
+                filter: mainFilter,
+                hideLabel: true,
+                ganttHeight: this.taskHeight,
+                showSecondaryDates: __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").showSecondaryDates,
+                onClick: (nativeEvent) => this.handleOnClick(nativeEvent),
+                onDblClick: (nativeEvent) => this.handleOnDblClick(nativeEvent),
+                onContextMenu: (event, row) => this.handleOnContextMenu(event, row),
+                onDateChange: (nativeEvent) => this.handleOnDateChange(nativeEvent),
+                initialScrollX: this.taskInitialScrollX,
+                initialScrollY: this.taskInitialScrollY,
+                readOnly: this.readOnly,
+                onScrollY: (y) => {
+                    window.clearTimeout(taskScrollYTimeout);
+                    taskScrollYTimeout = window.setTimeout(() => this.handleTaskGanttScrollY(y), scrollDelay);
+                },
+            },
+            secondaryGantt: details
+                ? {
+                    title: '',
+                    items: details,
+                    stylingOptions: Object.assign(Object.assign({}, defaultStylingOptions), { listCellWidth: this.listCellWidth }),
+                    filter: secondaryFilter,
+                    hideLabel: true,
+                    ganttHeight: this.detailHeight,
+                    onClick: (nativeEvent) => this.handleOnClick(nativeEvent),
+                    onContextMenu: (event, row) => this.handleOnContextMenu(event, row),
+                    onDateChange: (nativeEvent) => this.handleOnDateChange(nativeEvent),
+                    initialScrollX: this.detailInitialScrollX,
+                    initialScrollY: this.detailInitialScrollY,
+                    readOnly: this.readOnly,
+                    onScrollY: (y) => {
+                        window.clearTimeout(detailScrollYTimeout);
+                        detailScrollYTimeout = window.setTimeout(() => this.handleDetailGanttScrollY(y), scrollDelay);
+                    },
+                }
+                : undefined,
+            onSetDoubleView: (checked) => this.handleOnSetDoubleView(checked),
+            onSetViewMode: (value) => this.handleOnSetViewMode(value),
+            viewMode: this.viewMode,
+            onScrollX: (x) => {
+                window.clearTimeout(scrollXTimeout);
+                scrollXTimeout = window.setTimeout(() => this.handleOnScrollX(x), scrollDelay);
+            },
+        };
+        this.kupReady.emit({
+            comp: this,
+            id: this.rootElement.id,
+            value: undefined,
+        });
+        if (this.taskFilter) {
+            __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_onFilter).call(this, this.taskFilter);
         }
-        break;
-      case KupPlannerGanttRowType.DETAIL:
-        if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnContextMenuOnDetail).call(this)) {
-          this.onKupContextMenu(event, row, KupPlannerTaskAction.onRightClick);
+        if (this.detailFilter) {
+            __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_onFilter).call(this, this.detailFilter, true);
         }
-        break;
+        __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logLoad(this, true);
     }
-  }
-  handleOnSetDoubleView(checked) {
-    var _a;
-    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").showSecondaryDates = checked;
-    if ((_a = this.plannerProps) === null || _a === void 0 ? void 0 : _a.mainGantt) {
-      this.plannerProps.mainGantt.showSecondaryDates = checked;
+    componentDidRender() {
+        this.persistState();
+        __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logRender(this, true);
     }
-    this.persistState();
-  }
-  handleOnSetViewMode(value) {
-    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").viewMode = value;
-    this.plannerProps.viewMode = value;
-    this.persistState();
-  }
-  handleOnScrollX(x) {
-    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollX = x;
-    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollX = x;
-    this.persistState();
-  }
-  handleTaskGanttScrollY(y) {
-    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollY = y;
-    this.persistState();
-  }
-  handleDetailGanttScrollY(y) {
-    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollY = y;
-    this.persistState();
-  }
-  handleOnDateChange(nativeEvent) {
-    if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_emitOnChangeEventsReceived).call(this, nativeEvent)) {
-      if (nativeEvent.rowType != KupPlannerGanttRowType.DETAIL) {
-        this.onKupDateChange(nativeEvent, KupPlannerTaskAction.onResize);
-      }
+    onKupDblClick(event, taskAction) {
+        this.kupDblClick.emit({
+            comp: this,
+            id: this.rootElement.id,
+            value: event,
+            taskAction: taskAction,
+        });
     }
-  }
-  render() {
-    var _a;
-    return (h(Host, null, h("style", null, __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, style: { maxWidth: this.maxWidth } }), h(FTextField, { icon: KupThemeIconValues.SEARCH, id: "main-filter", label: __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), onKeyDown: (e) => {
-        if (e.key === 'Enter') {
-          __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_onFilter).call(this, e.target.value);
-        }
-      }, value: this.taskFilter, wrapperClass: "filter" }), ((_a = this.detailData) === null || _a === void 0 ? void 0 : _a.rows) && this.detailData.rows.length > 0 ? (h(FTextField, { icon: KupThemeIconValues.SEARCH, id: "secondary-filter", label: __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), onKeyDown: (e) => {
-        if (e.key === 'Enter') {
-          __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_onFilter).call(this, e.target.value, true);
-        }
-      }, value: this.detailFilter, wrapperClass: "filter" })) : null));
-  }
-  disconnectedCallback() {
-    __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").theme.unregister(this);
-    this.kupDidUnload.emit({
-      comp: this,
-      id: this.rootElement.id,
-      storedSettings: __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f"),
-    });
-  }
-  static get is() { return "kup-planner"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["kup-planner.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["kup-planner.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "stateId": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "state-id",
-        "reflect": false,
-        "defaultValue": "''"
-      },
-      "store": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "KupStore",
-          "resolved": "KupStore",
-          "references": {
-            "KupStore": {
-              "location": "import",
-              "path": "../kup-state/kup-store",
-              "id": "src/components/kup-state/kup-store.ts::KupStore"
+    onKupClick(event, taskAction) {
+        this.kupClick.emit({
+            comp: this,
+            id: this.rootElement.id,
+            value: event,
+            taskAction: taskAction,
+        });
+    }
+    onKupContextMenu(event, ganttRow, taskAction) {
+        let row;
+        let cell;
+        let column;
+        switch (ganttRow.type) {
+            case 'project': {
+                row = ganttRow.taskRow;
+                cell = row.cells[this.taskIdCol];
+                column = this.data.columns[this.taskIdCol];
+                break;
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        }
-      },
-      "customStyle": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "\"\""
-            }, {
-              "name": "see",
-              "text": "https://ketchup.smeup.com/ketchup-showcase/#/customization"
-            }],
-          "text": "Custom style of the component."
-        },
-        "attribute": "custom-style",
-        "reflect": false,
-        "defaultValue": "''"
-      },
-      "data": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "KupDataDataset",
-          "resolved": "KupDataDataset",
-          "references": {
-            "KupDataDataset": {
-              "location": "import",
-              "path": "../../managers/kup-data/kup-data-declarations",
-              "id": "src/managers/kup-data/kup-data-declarations.ts::KupDataDataset"
+            case 'task': {
+                row = ganttRow.phaseRow;
+                cell = row.cells[this.phaseIdCol];
+                //column = this.data.columns[this.taskIdCol];
+                break;
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Dataset containg the tasks list"
-        }
-      },
-      "detailData": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "KupDataDataset",
-          "resolved": "KupDataDataset",
-          "references": {
-            "KupDataDataset": {
-              "location": "import",
-              "path": "../../managers/kup-data/kup-data-declarations",
-              "id": "src/managers/kup-data/kup-data-declarations.ts::KupDataDataset"
+            case 'timeline': {
+                row = ganttRow.detailRow;
+                cell = row.cells[this.detailIdCol];
+                column = this.data.columns[this.detailIdCol];
+                break;
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Dataset containg the details list"
-        }
-      },
-      "detailColorCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing the detail color, in hex format"
-        },
-        "attribute": "detail-color-col",
-        "reflect": false
-      },
-      "detailColumns": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Columns containing informations displayed in the left box, near the gantt of details"
-        }
-      },
-      "detailDates": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Columns containing detail duration, from (firstDate) to (secondDate)"
-        }
-      },
-      "detailFilter": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "undefined"
-            }],
-          "text": "Sets the detail's filter."
-        },
-        "attribute": "detail-filter",
-        "reflect": false
-      },
-      "detailHeight": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Height for detail gantt"
-        },
-        "attribute": "detail-height",
-        "reflect": false
-      },
-      "detailIconCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing icon name to show, for detail"
-        },
-        "attribute": "detail-icon-col",
-        "reflect": false
-      },
-      "detailIdCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing unique detail identifier"
-        },
-        "attribute": "detail-id-col",
-        "reflect": false
-      },
-      "detailNameCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing detail name displayed"
-        },
-        "attribute": "detail-name-col",
-        "reflect": false
-      },
-      "detailPrevDates": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Columns containing forecast detail duration, from (firstDate) to (secondDate)"
-        }
-      },
-      "detailInitialScrollX": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "undefined"
-            }],
-          "text": "Sets the initial scroll X for the detail."
-        },
-        "attribute": "detail-initial-scroll-x",
-        "reflect": false
-      },
-      "detailInitialScrollY": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "undefined"
-            }],
-          "text": "Sets the initial scroll Y for the detail."
-        },
-        "attribute": "detail-initial-scroll-y",
-        "reflect": false
-      },
-      "listCellWidth": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "'300px'"
-            }],
-          "text": "Total size of the cells inside to the left box, near the gantt"
-        },
-        "attribute": "list-cell-width",
-        "reflect": false,
-        "defaultValue": "'300px'"
-      },
-      "maxWidth": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "'90vw'"
-            }],
-          "text": "Max width for component"
-        },
-        "attribute": "max-width",
-        "reflect": false,
-        "defaultValue": "'90vw'"
-      },
-      "phaseColorCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing the phase color in hex format"
-        },
-        "attribute": "phase-color-col",
-        "reflect": false
-      },
-      "phaseColumns": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Columns containing informations displayed in the left box ,near the gantt of phases"
         }
-      },
-      "phaseColParDep": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing the name of the parent phases"
-        },
-        "attribute": "phase-col-par-dep",
-        "reflect": false
-      },
-      "phaseDates": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Columns containing phase duration, from (firstDate) to (secondDate)"
-        }
-      },
-      "phaseIconCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing icon name to show, for phase"
-        },
-        "attribute": "phase-icon-col",
-        "reflect": false
-      },
-      "phaseIdCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing unique phase identifier"
-        },
-        "attribute": "phase-id-col",
-        "reflect": false
-      },
-      "phaseNameCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing phase name displayed"
-        },
-        "attribute": "phase-name-col",
-        "reflect": false
-      },
-      "phasePrevDates": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Columns containing forecast phase duration, from (firstDate) to (secondDate)"
-        }
-      },
-      "readOnly": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "false"
-            }],
-          "text": "When true, the two gantts are not interactable."
-        },
-        "attribute": "read-only",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "showSecondaryDates": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "false"
-            }],
-          "text": "Enable/disable display of secondary dates"
-        },
-        "attribute": "show-secondary-dates",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "taskColumns": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Columns containing informations displayed in the left box, near the gantt"
-        }
-      },
-      "taskDates": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Columns containing task duration, from (firstDate) to (secondDate)"
-        }
-      },
-      "taskFilter": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "undefined"
-            }],
-          "text": "Sets the task's filter."
-        },
-        "attribute": "task-filter",
-        "reflect": false
-      },
-      "taskHeight": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Height for main gantt"
-        },
-        "attribute": "task-height",
-        "reflect": false
-      },
-      "taskIconCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing icon name to show, for task"
-        },
-        "attribute": "task-icon-col",
-        "reflect": false
-      },
-      "taskIdCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing unique task identifier"
-        },
-        "attribute": "task-id-col",
-        "reflect": false
-      },
-      "taskInitialScrollX": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "undefined"
-            }],
-          "text": "Sets the initial scroll X for the task."
-        },
-        "attribute": "task-initial-scroll-x",
-        "reflect": false
-      },
-      "taskInitialScrollY": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "undefined"
-            }],
-          "text": "Sets the initial scroll Y for the task."
-        },
-        "attribute": "task-initial-scroll-y",
-        "reflect": false
-      },
-      "taskNameCol": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Column containing task name displayed"
-        },
-        "attribute": "task-name-col",
-        "reflect": false
-      },
-      "taskPrevDates": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Columns containing forecast task duration, from (firstDate) to (secondDate)"
+        this.kupContextMenu.emit({
+            comp: this,
+            id: this.rootElement.id,
+            value: ganttRow,
+            taskAction: taskAction,
+            details: {
+                cell: cell,
+                column: column,
+                originalEvent: event,
+                row: row,
+            },
+        });
+    }
+    onKupDateChange(event, taskAction) {
+        this.kupDateChange.emit({
+            comp: this,
+            id: this.rootElement.id,
+            value: event,
+            taskAction: taskAction,
+        });
+    }
+    handleOnDblClick(nativeEvent) {
+        switch (nativeEvent.rowType) {
+            case KupPlannerGanttRowType.TASK:
+                if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnDblClickOnTask).call(this)) {
+                    this.onKupDblClick(nativeEvent, KupPlannerTaskAction.onDblClick);
+                }
+                break;
+            case KupPlannerGanttRowType.PHASE:
+                if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnDblClickOnPhase).call(this)) {
+                    this.onKupDblClick(nativeEvent, KupPlannerTaskAction.onDblClick);
+                }
+                break;
+            case KupPlannerGanttRowType.DETAIL:
+                if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnDblClickOnDetail).call(this)) {
+                    this.onKupDblClick(nativeEvent, KupPlannerTaskAction.onDblClick);
+                }
+                break;
         }
-      },
-      "titleMess": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "null"
-            }],
-          "text": "Message displayed on top"
-        },
-        "attribute": "title-mess",
-        "reflect": false
-      },
-      "viewMode": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "KupPlannerViewMode",
-          "resolved": "\"day\" | \"month\" | \"week\" | \"year\"",
-          "references": {
-            "KupPlannerViewMode": {
-              "location": "import",
-              "path": "./kup-planner-declarations",
-              "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerViewMode"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "default",
-              "text": "'month'"
-            }],
-          "text": "Sets the view mode."
-        },
-        "attribute": "view-mode",
-        "reflect": false,
-        "defaultValue": "'month'"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "plannerProps": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "kupClick",
-        "name": "kup-planner-click",
-        "bubbles": true,
-        "cancelable": false,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "KupPlannerEventPayload",
-          "resolved": "KupPlannerEventPayload",
-          "references": {
-            "KupPlannerEventPayload": {
-              "location": "import",
-              "path": "./kup-planner-declarations",
-              "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerEventPayload"
-            }
-          }
+        for (let index = 0; index < __classPrivateFieldGet(this, _KupPlanner_clickTimeout, "f").length; index++) {
+            clearTimeout(__classPrivateFieldGet(this, _KupPlanner_clickTimeout, "f")[index]);
+            __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").debug.logMessage(this, 'Cleared click timeout(' + __classPrivateFieldGet(this, _KupPlanner_clickTimeout, "f")[index] + ').');
         }
-      }, {
-        "method": "kupDateChange",
-        "name": "kup-planner-datechange",
-        "bubbles": true,
-        "cancelable": false,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "KupPlannerEventPayload",
-          "resolved": "KupPlannerEventPayload",
-          "references": {
-            "KupPlannerEventPayload": {
-              "location": "import",
-              "path": "./kup-planner-declarations",
-              "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerEventPayload"
+        __classPrivateFieldSet(this, _KupPlanner_clickTimeout, [], "f");
+    }
+    handleOnClick(nativeEvent) {
+        __classPrivateFieldGet(this, _KupPlanner_clickTimeout, "f").push(setTimeout(() => {
+            switch (nativeEvent.rowType) {
+                case KupPlannerGanttRowType.TASK:
+                    const taskAction = nativeEvent
+                        .phases
+                        ? KupPlannerTaskAction.onTaskClosing
+                        : KupPlannerTaskAction.onTaskOpening;
+                    if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnClickOnTask).call(this, nativeEvent)) {
+                        this.onKupClick(nativeEvent, taskAction);
+                    }
+                    break;
+                case KupPlannerGanttRowType.PHASE:
+                    if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnClickOnPhase).call(this)) {
+                        this.onKupClick(nativeEvent, KupPlannerTaskAction.onClick);
+                    }
+                    break;
+                case KupPlannerGanttRowType.DETAIL:
+                    if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnClickOnDetail).call(this)) {
+                        this.onKupClick(nativeEvent, KupPlannerTaskAction.onClick);
+                    }
+                    break;
             }
-          }
+        }, 300));
+    }
+    handleOnContextMenu(event, row) {
+        switch (row.rowType) {
+            case KupPlannerGanttRowType.TASK:
+                if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnContextMenuOnTask).call(this)) {
+                    this.onKupContextMenu(event, row, KupPlannerTaskAction.onRightClick);
+                }
+                break;
+            case KupPlannerGanttRowType.PHASE:
+                if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnContextMenuOnPhase).call(this)) {
+                    this.onKupContextMenu(event, row, KupPlannerTaskAction.onRightClick);
+                }
+                break;
+            case KupPlannerGanttRowType.DETAIL:
+                if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_handleOnContextMenuOnDetail).call(this)) {
+                    this.onKupContextMenu(event, row, KupPlannerTaskAction.onRightClick);
+                }
+                break;
         }
-      }, {
-        "method": "kupReady",
-        "name": "kup-planner-ready",
-        "bubbles": true,
-        "cancelable": false,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "KupPlannerEventPayload",
-          "resolved": "KupPlannerEventPayload",
-          "references": {
-            "KupPlannerEventPayload": {
-              "location": "import",
-              "path": "./kup-planner-declarations",
-              "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerEventPayload"
-            }
-          }
+    }
+    handleOnSetDoubleView(checked) {
+        var _a;
+        __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").showSecondaryDates = checked;
+        if ((_a = this.plannerProps) === null || _a === void 0 ? void 0 : _a.mainGantt) {
+            this.plannerProps.mainGantt.showSecondaryDates = checked;
         }
-      }, {
-        "method": "kupContextMenu",
-        "name": "kup-planner-contextmenu",
-        "bubbles": true,
-        "cancelable": false,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Generic right click event on planner."
-        },
-        "complexType": {
-          "original": "KupPlannerClickEventPayload",
-          "resolved": "KupPlannerClickEventPayload",
-          "references": {
-            "KupPlannerClickEventPayload": {
-              "location": "import",
-              "path": "./kup-planner-declarations",
-              "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerClickEventPayload"
+        this.persistState();
+    }
+    handleOnSetViewMode(value) {
+        __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").viewMode = value;
+        this.plannerProps.viewMode = value;
+        this.persistState();
+    }
+    handleOnScrollX(x) {
+        __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollX = x;
+        __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollX = x;
+        this.persistState();
+    }
+    handleTaskGanttScrollY(y) {
+        __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskInitialScrollY = y;
+        this.persistState();
+    }
+    handleDetailGanttScrollY(y) {
+        __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailInitialScrollY = y;
+        this.persistState();
+    }
+    handleOnDateChange(nativeEvent) {
+        if (__classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_emitOnChangeEventsReceived).call(this, nativeEvent)) {
+            if (nativeEvent.rowType != KupPlannerGanttRowType.DETAIL) {
+                this.onKupDateChange(nativeEvent, KupPlannerTaskAction.onResize);
             }
-          }
         }
-      }, {
-        "method": "kupDidUnload",
-        "name": "kup-planner-didunload",
-        "bubbles": true,
-        "cancelable": false,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "When component unload is complete"
-        },
-        "complexType": {
-          "original": "KupPlannerUnloadEventPayload",
-          "resolved": "KupPlannerUnloadEventPayload",
-          "references": {
-            "KupPlannerUnloadEventPayload": {
-              "location": "import",
-              "path": "./kup-planner-declarations",
-              "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerUnloadEventPayload"
-            }
-          }
+    }
+    render() {
+        var _a, _b, _c;
+        const plannerProps = this.plannerProps
+            ? Object.assign(Object.assign({}, this.plannerProps), { onSetDoubleView: this.handleOnSetDoubleView.bind(this), onSetViewMode: this.handleOnSetViewMode.bind(this), onScrollX: this.handleOnScrollX.bind(this), mainGantt: Object.assign(Object.assign({}, (_a = this.plannerProps) === null || _a === void 0 ? void 0 : _a.mainGantt), { onScrollY: this.handleTaskGanttScrollY.bind(this) }) }) : null;
+        if ((_b = this.plannerProps) === null || _b === void 0 ? void 0 : _b.secondaryGantt) {
+            plannerProps.secondaryGantt = Object.assign(Object.assign({}, this.plannerProps.secondaryGantt), { onScrollY: this.handleDetailGanttScrollY.bind(this) });
         }
-      }];
-  }
-  static get methods() {
-    return {
-      "getProps": {
-        "complexType": {
-          "signature": "(descriptions?: boolean) => Promise<GenericObject>",
-          "parameters": [{
-              "tags": [{
-                  "name": "param",
-                  "text": "descriptions - When provided and true, the result will be the list of props with their description."
-                }],
-              "text": "- When provided and true, the result will be the list of props with their description."
-            }],
-          "references": {
-            "Promise": {
-              "location": "global",
-              "id": "global::Promise"
+        return (h(Host, null, h("style", null, __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, style: { maxWidth: this.maxWidth } }, this.plannerProps && (h("kup-planner-renderer", { props: plannerProps }))), h("div", { style: { display: this.plannerProps ? 'none' : '' } }, h(FTextField, { icon: KupThemeIconValues.SEARCH, id: "main-filter", label: __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), onKeyDown: (e) => {
+                if (e.key === 'Enter') {
+                    __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_onFilter).call(this, e.target.value);
+                }
+            }, value: this.taskFilter, wrapperClass: "filter" }), ((_c = this.detailData) === null || _c === void 0 ? void 0 : _c.rows) &&
+            this.detailData.rows.length > 0 ? (h(FTextField, { icon: KupThemeIconValues.SEARCH, id: "secondary-filter", label: __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").language.translate(KupLanguageSearch.SEARCH), onKeyDown: (e) => {
+                if (e.key === 'Enter') {
+                    __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_onFilter).call(this, e.target.value, true);
+                }
+            }, value: this.detailFilter, wrapperClass: "filter" })) : null)));
+    }
+    disconnectedCallback() {
+        __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").theme.unregister(this);
+        this.kupDidUnload.emit({
+            comp: this,
+            id: this.rootElement.id,
+            storedSettings: __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f"),
+        });
+    }
+    static get is() { return "kup-planner"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["kup-planner.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["kup-planner.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "stateId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "state-id",
+                "reflect": false,
+                "defaultValue": "''"
             },
-            "GenericObject": {
-              "location": "import",
-              "path": "../../types/GenericTypes",
-              "id": "src/types/GenericTypes.ts::GenericObject"
-            }
-          },
-          "return": "Promise<GenericObject>"
-        },
-        "docs": {
-          "text": "Used to retrieve component's props values.",
-          "tags": [{
-              "name": "param",
-              "text": "descriptions - When provided and true, the result will be the list of props with their description."
-            }, {
-              "name": "returns",
-              "text": "List of props as object, each key will be a prop."
-            }]
-        }
-      },
-      "refresh": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global",
-              "id": "global::Promise"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "This method is used to trigger a new render of the component.",
-          "tags": []
-        }
-      },
-      "setProps": {
-        "complexType": {
-          "signature": "(props: GenericObject) => Promise<void>",
-          "parameters": [{
-              "tags": [{
-                  "name": "param",
-                  "text": "props - Object containing props that will be set to the component."
-                }],
-              "text": "- Object containing props that will be set to the component."
-            }],
-          "references": {
-            "Promise": {
-              "location": "global",
-              "id": "global::Promise"
+            "store": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "KupStore",
+                    "resolved": "KupStore",
+                    "references": {
+                        "KupStore": {
+                            "location": "import",
+                            "path": "../kup-state/kup-store",
+                            "id": "src/components/kup-state/kup-store.ts::KupStore"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
+            },
+            "customStyle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "\"\""
+                        }, {
+                            "name": "see",
+                            "text": "https://ketchup.smeup.com/ketchup-showcase/#/customization"
+                        }],
+                    "text": "Custom style of the component."
+                },
+                "attribute": "custom-style",
+                "reflect": false,
+                "defaultValue": "''"
+            },
+            "data": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "KupDataDataset",
+                    "resolved": "KupDataDataset",
+                    "references": {
+                        "KupDataDataset": {
+                            "location": "import",
+                            "path": "../../managers/kup-data/kup-data-declarations",
+                            "id": "src/managers/kup-data/kup-data-declarations.ts::KupDataDataset"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Dataset containg the tasks list"
+                }
+            },
+            "detailData": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "KupDataDataset",
+                    "resolved": "KupDataDataset",
+                    "references": {
+                        "KupDataDataset": {
+                            "location": "import",
+                            "path": "../../managers/kup-data/kup-data-declarations",
+                            "id": "src/managers/kup-data/kup-data-declarations.ts::KupDataDataset"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Dataset containg the details list"
+                }
+            },
+            "detailColorCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing the detail color, in hex format"
+                },
+                "attribute": "detail-color-col",
+                "reflect": false
+            },
+            "detailColumns": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Columns containing informations displayed in the left box, near the gantt of details"
+                }
+            },
+            "detailDates": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Columns containing detail duration, from (firstDate) to (secondDate)"
+                }
+            },
+            "detailFilter": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "undefined"
+                        }],
+                    "text": "Sets the detail's filter."
+                },
+                "attribute": "detail-filter",
+                "reflect": false
+            },
+            "detailHeight": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Height for detail gantt"
+                },
+                "attribute": "detail-height",
+                "reflect": false
+            },
+            "detailIconCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing icon name to show, for detail"
+                },
+                "attribute": "detail-icon-col",
+                "reflect": false
+            },
+            "detailIdCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing unique detail identifier"
+                },
+                "attribute": "detail-id-col",
+                "reflect": false
+            },
+            "detailNameCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing detail name displayed"
+                },
+                "attribute": "detail-name-col",
+                "reflect": false
+            },
+            "detailPrevDates": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Columns containing forecast detail duration, from (firstDate) to (secondDate)"
+                }
+            },
+            "detailInitialScrollX": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "undefined"
+                        }],
+                    "text": "Sets the initial scroll X for the detail."
+                },
+                "attribute": "detail-initial-scroll-x",
+                "reflect": false
+            },
+            "detailInitialScrollY": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "undefined"
+                        }],
+                    "text": "Sets the initial scroll Y for the detail."
+                },
+                "attribute": "detail-initial-scroll-y",
+                "reflect": false
+            },
+            "listCellWidth": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "'300px'"
+                        }],
+                    "text": "Total size of the cells inside to the left box, near the gantt"
+                },
+                "attribute": "list-cell-width",
+                "reflect": false,
+                "defaultValue": "'300px'"
+            },
+            "maxWidth": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "'90vw'"
+                        }],
+                    "text": "Max width for component"
+                },
+                "attribute": "max-width",
+                "reflect": false,
+                "defaultValue": "'90vw'"
+            },
+            "phaseColorCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing the phase color in hex format"
+                },
+                "attribute": "phase-color-col",
+                "reflect": false
+            },
+            "phaseColumns": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Columns containing informations displayed in the left box ,near the gantt of phases"
+                }
+            },
+            "phaseColParDep": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing the name of the parent phases"
+                },
+                "attribute": "phase-col-par-dep",
+                "reflect": false
+            },
+            "phaseDates": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Columns containing phase duration, from (firstDate) to (secondDate)"
+                }
             },
-            "GenericObject": {
-              "location": "import",
-              "path": "../../types/GenericTypes",
-              "id": "src/types/GenericTypes.ts::GenericObject"
+            "phaseIconCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing icon name to show, for phase"
+                },
+                "attribute": "phase-icon-col",
+                "reflect": false
+            },
+            "phaseIdCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing unique phase identifier"
+                },
+                "attribute": "phase-id-col",
+                "reflect": false
+            },
+            "phaseNameCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing phase name displayed"
+                },
+                "attribute": "phase-name-col",
+                "reflect": false
+            },
+            "phasePrevDates": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Columns containing forecast phase duration, from (firstDate) to (secondDate)"
+                }
+            },
+            "readOnly": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "false"
+                        }],
+                    "text": "When true, the two gantts are not interactable."
+                },
+                "attribute": "read-only",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "showSecondaryDates": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "false"
+                        }],
+                    "text": "Enable/disable display of secondary dates"
+                },
+                "attribute": "show-secondary-dates",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "taskColumns": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Columns containing informations displayed in the left box, near the gantt"
+                }
+            },
+            "taskDates": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Columns containing task duration, from (firstDate) to (secondDate)"
+                }
+            },
+            "taskFilter": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "undefined"
+                        }],
+                    "text": "Sets the task's filter."
+                },
+                "attribute": "task-filter",
+                "reflect": false
+            },
+            "taskHeight": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Height for main gantt"
+                },
+                "attribute": "task-height",
+                "reflect": false
+            },
+            "taskIconCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing icon name to show, for task"
+                },
+                "attribute": "task-icon-col",
+                "reflect": false
+            },
+            "taskIdCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing unique task identifier"
+                },
+                "attribute": "task-id-col",
+                "reflect": false
+            },
+            "taskInitialScrollX": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "undefined"
+                        }],
+                    "text": "Sets the initial scroll X for the task."
+                },
+                "attribute": "task-initial-scroll-x",
+                "reflect": false
+            },
+            "taskInitialScrollY": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "undefined"
+                        }],
+                    "text": "Sets the initial scroll Y for the task."
+                },
+                "attribute": "task-initial-scroll-y",
+                "reflect": false
+            },
+            "taskNameCol": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Column containing task name displayed"
+                },
+                "attribute": "task-name-col",
+                "reflect": false
+            },
+            "taskPrevDates": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Columns containing forecast task duration, from (firstDate) to (secondDate)"
+                }
+            },
+            "titleMess": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "null"
+                        }],
+                    "text": "Message displayed on top"
+                },
+                "attribute": "title-mess",
+                "reflect": false
+            },
+            "viewMode": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "KupPlannerViewMode",
+                    "resolved": "\"day\" | \"month\" | \"week\" | \"year\"",
+                    "references": {
+                        "KupPlannerViewMode": {
+                            "location": "import",
+                            "path": "./kup-planner-declarations",
+                            "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerViewMode"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "'month'"
+                        }],
+                    "text": "Sets the view mode."
+                },
+                "attribute": "view-mode",
+                "reflect": false,
+                "defaultValue": "'month'"
+            },
+            "mainFilter": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "HTMLElement",
+                    "resolved": "HTMLElement",
+                    "references": {
+                        "HTMLElement": {
+                            "location": "global",
+                            "id": "global::HTMLElement"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "undefined"
+                        }],
+                    "text": "Sets the filter for main gantt."
+                }
+            },
+            "secondaryFilter": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "HTMLElement",
+                    "resolved": "HTMLElement",
+                    "references": {
+                        "HTMLElement": {
+                            "location": "global",
+                            "id": "global::HTMLElement"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "undefined"
+                        }],
+                    "text": "Sets the filter for secondary gantt."
+                }
             }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "Sets the props to the component.",
-          "tags": [{
-              "name": "param",
-              "text": "props - Object containing props that will be set to the component."
-            }]
-        }
-      },
-      "addPhases": {
-        "complexType": {
-          "signature": "(taskId: string, data: KupDataDataset) => Promise<void>",
-          "parameters": [{
-              "tags": [{
-                  "name": "param",
-                  "text": "taskId"
-                }],
-              "text": ""
+        };
+    }
+    static get states() {
+        return {
+            "plannerProps": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "kupClick",
+                "name": "kup-planner-click",
+                "bubbles": true,
+                "cancelable": false,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "KupPlannerEventPayload",
+                    "resolved": "KupPlannerEventPayload",
+                    "references": {
+                        "KupPlannerEventPayload": {
+                            "location": "import",
+                            "path": "./kup-planner-declarations",
+                            "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerEventPayload"
+                        }
+                    }
+                }
+            }, {
+                "method": "kupDblClick",
+                "name": "kup-planner-dblclick",
+                "bubbles": true,
+                "cancelable": false,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "KupPlannerEventPayload",
+                    "resolved": "KupPlannerEventPayload",
+                    "references": {
+                        "KupPlannerEventPayload": {
+                            "location": "import",
+                            "path": "./kup-planner-declarations",
+                            "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerEventPayload"
+                        }
+                    }
+                }
+            }, {
+                "method": "kupDateChange",
+                "name": "kup-planner-datechange",
+                "bubbles": true,
+                "cancelable": false,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "KupPlannerEventPayload",
+                    "resolved": "KupPlannerEventPayload",
+                    "references": {
+                        "KupPlannerEventPayload": {
+                            "location": "import",
+                            "path": "./kup-planner-declarations",
+                            "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerEventPayload"
+                        }
+                    }
+                }
+            }, {
+                "method": "kupReady",
+                "name": "kup-planner-ready",
+                "bubbles": true,
+                "cancelable": false,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "KupPlannerEventPayload",
+                    "resolved": "KupPlannerEventPayload",
+                    "references": {
+                        "KupPlannerEventPayload": {
+                            "location": "import",
+                            "path": "./kup-planner-declarations",
+                            "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerEventPayload"
+                        }
+                    }
+                }
             }, {
-              "tags": [{
-                  "name": "param",
-                  "text": "data - Matrix which contains project phases"
-                }],
-              "text": "- Matrix which contains project phases"
-            }],
-          "references": {
-            "Promise": {
-              "location": "global",
-              "id": "global::Promise"
+                "method": "kupContextMenu",
+                "name": "kup-planner-contextmenu",
+                "bubbles": true,
+                "cancelable": false,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Generic right click event on planner."
+                },
+                "complexType": {
+                    "original": "KupPlannerClickEventPayload",
+                    "resolved": "KupPlannerClickEventPayload",
+                    "references": {
+                        "KupPlannerClickEventPayload": {
+                            "location": "import",
+                            "path": "./kup-planner-declarations",
+                            "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerClickEventPayload"
+                        }
+                    }
+                }
+            }, {
+                "method": "kupDidUnload",
+                "name": "kup-planner-didunload",
+                "bubbles": true,
+                "cancelable": false,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "When component unload is complete"
+                },
+                "complexType": {
+                    "original": "KupPlannerUnloadEventPayload",
+                    "resolved": "KupPlannerUnloadEventPayload",
+                    "references": {
+                        "KupPlannerUnloadEventPayload": {
+                            "location": "import",
+                            "path": "./kup-planner-declarations",
+                            "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerUnloadEventPayload"
+                        }
+                    }
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "getProps": {
+                "complexType": {
+                    "signature": "(descriptions?: boolean) => Promise<GenericObject>",
+                    "parameters": [{
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "descriptions - When provided and true, the result will be the list of props with their description."
+                                }],
+                            "text": "- When provided and true, the result will be the list of props with their description."
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "GenericObject": {
+                            "location": "import",
+                            "path": "../../types/GenericTypes",
+                            "id": "src/types/GenericTypes.ts::GenericObject"
+                        }
+                    },
+                    "return": "Promise<GenericObject>"
+                },
+                "docs": {
+                    "text": "Used to retrieve component's props values.",
+                    "tags": [{
+                            "name": "param",
+                            "text": "descriptions - When provided and true, the result will be the list of props with their description."
+                        }, {
+                            "name": "returns",
+                            "text": "List of props as object, each key will be a prop."
+                        }]
+                }
             },
-            "KupDataDataset": {
-              "location": "import",
-              "path": "../../managers/kup-data/kup-data-declarations",
-              "id": "src/managers/kup-data/kup-data-declarations.ts::KupDataDataset"
+            "refresh": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "This method is used to trigger a new render of the component.",
+                    "tags": []
+                }
             },
-            "KupPlannerPhase": {
-              "location": "import",
-              "path": "./kup-planner-declarations",
-              "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerPhase"
+            "setProps": {
+                "complexType": {
+                    "signature": "(props: GenericObject) => Promise<void>",
+                    "parameters": [{
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "props - Object containing props that will be set to the component."
+                                }],
+                            "text": "- Object containing props that will be set to the component."
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "GenericObject": {
+                            "location": "import",
+                            "path": "../../types/GenericTypes",
+                            "id": "src/types/GenericTypes.ts::GenericObject"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Sets the props to the component.",
+                    "tags": [{
+                            "name": "param",
+                            "text": "props - Object containing props that will be set to the component."
+                        }]
+                }
             },
-            "TaskType": {
-              "location": "import",
-              "path": "@sme.up/gantt-component/dist/types/public-types",
-              "id": ""
+            "addPhases": {
+                "complexType": {
+                    "signature": "(taskId: string, data: KupDataDataset) => Promise<void>",
+                    "parameters": [{
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "taskId"
+                                }],
+                            "text": ""
+                        }, {
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "data - Matrix which contains project phases"
+                                }],
+                            "text": "- Matrix which contains project phases"
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "KupDataDataset": {
+                            "location": "import",
+                            "path": "../../managers/kup-data/kup-data-declarations",
+                            "id": "src/managers/kup-data/kup-data-declarations.ts::KupDataDataset"
+                        },
+                        "KupPlannerPhase": {
+                            "location": "import",
+                            "path": "./kup-planner-declarations",
+                            "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerPhase"
+                        },
+                        "KupPlannerTaskType": {
+                            "location": "import",
+                            "path": "./kup-planner-declarations",
+                            "id": "src/components/kup-planner/kup-planner-declarations.ts::KupPlannerTaskType"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Add a list of phases to the project",
+                    "tags": [{
+                            "name": "param",
+                            "text": "taskId"
+                        }, {
+                            "name": "param",
+                            "text": "data - Matrix which contains project phases"
+                        }]
+                }
             }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "Add a list of phases to the project",
-          "tags": [{
-              "name": "param",
-              "text": "taskId"
-            }, {
-              "name": "param",
-              "text": "data - Matrix which contains project phases"
-            }]
-        }
-      }
-    };
-  }
-  static get elementRef() { return "rootElement"; }
-  static get watchers() {
-    return [{
-        "propName": "data",
-        "methodName": "dataChanged"
-      }];
-  }
+        };
+    }
+    static get elementRef() { return "rootElement"; }
+    static get watchers() {
+        return [{
+                "propName": "data",
+                "methodName": "dataChanged"
+            }];
+    }
 }
-_KupPlanner_kupManager = new WeakMap(), _KupPlanner_lastOnChangeReceived = new WeakMap(), _KupPlanner_rootPlanner = new WeakMap(), _KupPlanner_phases = new WeakMap(), _KupPlanner_storedSettings = new WeakMap(), _KupPlanner_instances = new WeakSet(), _KupPlanner_renderReactPlannerElement = function _KupPlanner_renderReactPlannerElement() {
-  var _a;
-  (_a = __classPrivateFieldGet(this, _KupPlanner_rootPlanner, "f")) === null || _a === void 0 ? void 0 : _a.unmount();
-  const componentWrapperElement = this.rootElement.shadowRoot.getElementById(componentWrapperId);
-  if (componentWrapperElement) {
-    __classPrivateFieldSet(this, _KupPlanner_rootPlanner, createRoot(componentWrapperElement), "f");
-    __classPrivateFieldGet(this, _KupPlanner_rootPlanner, "f").render(React.createElement(Planner, this.plannerProps));
-  }
-}, _KupPlanner_toTasks = function _KupPlanner_toTasks(data) {
-  var _a;
-  if (!data || !data.rows) {
-    return [];
-  }
-  let tasks = (_a = data.rows) === null || _a === void 0 ? void 0 : _a.filter((row) => isAtLeastOneDateValid(row.cells[this.taskDates[0]], row.cells[this.taskDates[1]])).map((row) => {
-    const datesSanitized = sanitizeAllDates(row.cells[this.taskDates[0]], row.cells[this.taskDates[1]], row.cells[this.taskPrevDates[0]], row.cells[this.taskPrevDates[1]]);
-    const valuesToShow = getValuesToShow(row, this.taskIdCol, this.taskNameCol, data.columns, this.taskColumns, () => this.taskColumns.map((col) => col == this.taskDates[0]
-      ? '#START#'
-      : col == this.taskDates[1]
-        ? '#END#'
-        : getCellValueForDisplay(data.columns.find((kCol) => kCol.name == col), row.cells[col])));
-    let iconUrl = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconUrl).call(this, row, this.taskIconCol);
-    let iconColor = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconColor).call(this, row, this.taskIconCol);
-    let task = {
-      taskRow: row,
-      taskRowId: row.id,
-      id: row.cells[this.taskIdCol].value,
-      name: row.cells[this.taskNameCol].value,
-      startDate: datesSanitized.dateValues[0],
-      endDate: datesSanitized.dateValues[1],
-      secondaryStartDate: datesSanitized.secDateValues[0],
-      secondaryEndDate: datesSanitized.secDateValues[1],
-      type: 'project',
-      valuesToShow: valuesToShow,
-      rowType: KupPlannerGanttRowType.TASK,
-      icon: iconUrl
-        ? { url: iconUrl, color: iconColor !== null && iconColor !== void 0 ? iconColor : '#595959' }
-        : undefined,
-    };
-    return task;
-  });
-  return tasks;
+_KupPlanner_kupManager = new WeakMap(), _KupPlanner_lastOnChangeReceived = new WeakMap(), _KupPlanner_clickTimeout = new WeakMap(), _KupPlanner_phases = new WeakMap(), _KupPlanner_storedSettings = new WeakMap(), _KupPlanner_instances = new WeakSet(), _KupPlanner_toTasks = function _KupPlanner_toTasks(data) {
+    var _a;
+    if (!data || !data.rows) {
+        return [];
+    }
+    let tasks = (_a = data.rows) === null || _a === void 0 ? void 0 : _a.filter((row) => isAtLeastOneDateValid(row.cells[this.taskDates[0]], row.cells[this.taskDates[1]])).map((row) => {
+        const datesSanitized = sanitizeAllDates(row.cells[this.taskDates[0]], row.cells[this.taskDates[1]], row.cells[this.taskPrevDates[0]], row.cells[this.taskPrevDates[1]]);
+        const valuesToShow = getValuesToShow(row, this.taskIdCol, this.taskNameCol, data.columns, this.taskColumns, () => this.taskColumns.map((col) => col == this.taskDates[0]
+            ? '#START#'
+            : col == this.taskDates[1]
+                ? '#END#'
+                : getCellValueForDisplay(data.columns.find((kCol) => kCol.name == col), row.cells[col])));
+        let iconUrl = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconUrl).call(this, row, this.taskIconCol);
+        let iconColor = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconColor).call(this, row, this.taskIconCol);
+        let task = {
+            taskRow: row,
+            taskRowId: row.id,
+            id: row.cells[this.taskIdCol].value,
+            name: row.cells[this.taskNameCol].value,
+            startDate: datesSanitized.dateValues[0],
+            endDate: datesSanitized.dateValues[1],
+            secondaryStartDate: datesSanitized.secDateValues[0],
+            secondaryEndDate: datesSanitized.secDateValues[1],
+            type: 'project',
+            valuesToShow: valuesToShow,
+            rowType: KupPlannerGanttRowType.TASK,
+            icon: iconUrl
+                ? { url: iconUrl, color: iconColor !== null && iconColor !== void 0 ? iconColor : '#595959' }
+                : undefined,
+        };
+        return task;
+    });
+    return tasks;
 }, _KupPlanner_toDetails = function _KupPlanner_toDetails(data) {
-  if (!data || !data.rows) {
-    return undefined;
-  }
-  let details = [];
-  data.rows
-    .filter((row) => isAtLeastOneDateValid(row.cells[this.detailDates[0]], row.cells[this.detailDates[1]]))
-    .forEach((row) => {
-    var _a, _b;
-    const detailId = row.cells[this.detailIdCol].value;
-    const detailNameId = row.cells[this.detailNameCol].value;
-    const datesSanitized = sanitizeAllDates(row.cells[this.detailDates[0]], row.cells[this.detailDates[1]]);
-    const valuesToShow = getValuesToShow(row, this.detailIdCol, this.detailNameCol, data.columns, this.detailColumns);
-    let detail = details.find((det) => det.id == detailId);
-    if (!detail) {
-      detail = {
-        id: detailId,
-        name: detailNameId,
-        detailRow: row,
-        type: 'timeline',
-        valuesToShow: valuesToShow,
-        rowType: KupPlannerGanttRowType.DETAIL,
-        schedule: [],
-      };
-      details.push(detail);
+    if (!data || !data.rows) {
+        return undefined;
     }
-    let iconUrl = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconUrl).call(this, row, this.detailIconCol);
-    let iconColor = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconColor).call(this, row, this.detailIconCol);
-    detail.schedule.push({
-      startDate: datesSanitized.dateValues[0],
-      endDate: datesSanitized.dateValues[1],
-      color: this.detailColorCol
-        ? (_a = row.cells[this.detailColorCol].value) !== null && _a !== void 0 ? _a : '#D9D9D8'
-        : '#D9D9D8',
-      selectedColor: this.detailColorCol
-        ? (_b = row.cells[this.detailColorCol].value) !== null && _b !== void 0 ? _b : '#D9D9D8'
-        : '#D9D9D8',
-      icon: iconUrl
-        ? { url: iconUrl, color: iconColor !== null && iconColor !== void 0 ? iconColor : '#595959' }
-        : undefined,
+    let details = [];
+    data.rows
+        .filter((row) => isAtLeastOneDateValid(row.cells[this.detailDates[0]], row.cells[this.detailDates[1]]))
+        .forEach((row) => {
+        var _a, _b;
+        const detailId = row.cells[this.detailIdCol].value;
+        const detailNameId = row.cells[this.detailNameCol].value;
+        const datesSanitized = sanitizeAllDates(row.cells[this.detailDates[0]], row.cells[this.detailDates[1]]);
+        const valuesToShow = getValuesToShow(row, this.detailIdCol, this.detailNameCol, data.columns, this.detailColumns);
+        let detail = details.find((det) => det.id == detailId);
+        if (!detail) {
+            detail = {
+                id: detailId,
+                name: detailNameId,
+                detailRow: row,
+                type: 'timeline',
+                valuesToShow: valuesToShow,
+                rowType: KupPlannerGanttRowType.DETAIL,
+                schedule: [],
+            };
+            details.push(detail);
+        }
+        let iconUrl = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconUrl).call(this, row, this.detailIconCol);
+        let iconColor = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getIconColor).call(this, row, this.detailIconCol);
+        detail.schedule.push({
+            startDate: datesSanitized.dateValues[0],
+            endDate: datesSanitized.dateValues[1],
+            color: this.detailColorCol
+                ? (_a = row.cells[this.detailColorCol].value) !== null && _a !== void 0 ? _a : '#D9D9D8'
+                : '#D9D9D8',
+            selectedColor: this.detailColorCol
+                ? (_b = row.cells[this.detailColorCol].value) !== null && _b !== void 0 ? _b : '#D9D9D8'
+                : '#D9D9D8',
+            icon: iconUrl
+                ? { url: iconUrl, color: iconColor !== null && iconColor !== void 0 ? iconColor : '#595959' }
+                : undefined,
+        });
     });
-  });
-  return details;
+    return details;
 }, _KupPlanner_getTask = function _KupPlanner_getTask(taskId) {
-  return this.plannerProps.mainGantt.items.find((task) => task.id == taskId);
+    return this.plannerProps.mainGantt.items.find((task) => task.id == taskId);
 }, _KupPlanner_removePhases = function _KupPlanner_removePhases(taskId) {
-  const task = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getTask).call(this, taskId);
-  if (task)
-    task.phases = undefined;
-  this.plannerProps = Object.assign({}, this.plannerProps);
+    const task = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getTask).call(this, taskId);
+    if (task)
+        task.phases = undefined;
+    this.plannerProps = Object.assign({}, this.plannerProps);
+}, _KupPlanner_handleOnDblClickOnTask = function _KupPlanner_handleOnDblClickOnTask() {
+    return true;
+}, _KupPlanner_handleOnDblClickOnPhase = function _KupPlanner_handleOnDblClickOnPhase() {
+    return true;
+}, _KupPlanner_handleOnDblClickOnDetail = function _KupPlanner_handleOnDblClickOnDetail() {
+    return true;
 }, _KupPlanner_handleOnClickOnTask = function _KupPlanner_handleOnClickOnTask(nativeEvent) {
-  const task = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getTask).call(this, nativeEvent.id);
-  if (task === null || task === void 0 ? void 0 : task.phases) {
-    __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_removePhases).call(this, task.id);
-  }
-  return true;
+    const task = __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getTask).call(this, nativeEvent.id);
+    if (task === null || task === void 0 ? void 0 : task.phases) {
+        __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_removePhases).call(this, task.id);
+    }
+    return true;
 }, _KupPlanner_handleOnClickOnPhase = function _KupPlanner_handleOnClickOnPhase() {
-  return true;
+    return true;
 }, _KupPlanner_handleOnClickOnDetail = function _KupPlanner_handleOnClickOnDetail() {
-  return true;
+    return true;
 }, _KupPlanner_handleOnContextMenuOnTask = function _KupPlanner_handleOnContextMenuOnTask() {
-  return true;
+    return true;
 }, _KupPlanner_handleOnContextMenuOnPhase = function _KupPlanner_handleOnContextMenuOnPhase() {
-  return true;
+    return true;
 }, _KupPlanner_handleOnContextMenuOnDetail = function _KupPlanner_handleOnContextMenuOnDetail() {
-  return true;
+    return true;
 }, _KupPlanner_emitOnChangeEventsReceived = function _KupPlanner_emitOnChangeEventsReceived(nativeEvent) {
-  let emitEvent = false;
-  if (!__classPrivateFieldGet(this, _KupPlanner_lastOnChangeReceived, "f")) {
-    emitEvent = true;
-    __classPrivateFieldSet(this, _KupPlanner_lastOnChangeReceived, new KupPlannerLastOnChangeReceived(nativeEvent), "f");
-  }
-  else if (!__classPrivateFieldGet(this, _KupPlanner_lastOnChangeReceived, "f").isEquivalent(nativeEvent)) {
-    __classPrivateFieldSet(this, _KupPlanner_lastOnChangeReceived, new KupPlannerLastOnChangeReceived(nativeEvent), "f");
-    emitEvent = true;
-  }
-  return emitEvent;
+    let emitEvent = false;
+    if (!__classPrivateFieldGet(this, _KupPlanner_lastOnChangeReceived, "f")) {
+        emitEvent = true;
+        __classPrivateFieldSet(this, _KupPlanner_lastOnChangeReceived, new KupPlannerLastOnChangeReceived(nativeEvent), "f");
+    }
+    else if (!__classPrivateFieldGet(this, _KupPlanner_lastOnChangeReceived, "f").isEquivalent(nativeEvent)) {
+        __classPrivateFieldSet(this, _KupPlanner_lastOnChangeReceived, new KupPlannerLastOnChangeReceived(nativeEvent), "f");
+        emitEvent = true;
+    }
+    return emitEvent;
 }, _KupPlanner_onFilter = function _KupPlanner_onFilter(value, isDetail) {
-  if (isDetail) {
-    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailFilter = value;
-  }
-  else {
-    __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskFilter = value;
-  }
-  const newGantt = isDetail
-    ? {
-      secondaryGantt: Object.assign(Object.assign({}, this.plannerProps.secondaryGantt), { items: __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_toDetails).call(this, __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getFilteredRows).call(this, value, isDetail)) }),
+    if (isDetail) {
+        __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").detailFilter = value;
     }
-    : {
-      mainGantt: Object.assign(Object.assign({}, this.plannerProps.mainGantt), { items: __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_toTasks).call(this, __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getFilteredRows).call(this, value, isDetail)) }),
-    };
-  this.plannerProps = Object.assign(Object.assign({}, this.plannerProps), newGantt);
-  this.persistState();
+    else {
+        __classPrivateFieldGet(this, _KupPlanner_storedSettings, "f").taskFilter = value;
+    }
+    const newGantt = isDetail
+        ? {
+            secondaryGantt: Object.assign(Object.assign({}, this.plannerProps.secondaryGantt), { items: __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_toDetails).call(this, __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getFilteredRows).call(this, value, isDetail)) }),
+        }
+        : {
+            mainGantt: Object.assign(Object.assign({}, this.plannerProps.mainGantt), { items: __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_toTasks).call(this, __classPrivateFieldGet(this, _KupPlanner_instances, "m", _KupPlanner_getFilteredRows).call(this, value, isDetail)) }),
+        };
+    this.plannerProps = Object.assign(Object.assign({}, this.plannerProps), newGantt);
+    this.persistState();
 }, _KupPlanner_getFilteredRows = function _KupPlanner_getFilteredRows(value, isDetail) {
-  const data = isDetail ? this.detailData : this.data;
-  if (!data || !data.rows || data.rows.length == 0) {
-    return undefined;
-  }
-  if (!value) {
-    return data;
-  }
-  const tempData = {
-    columns: this.data.columns,
-    rows: [],
-  };
-  const tempRows = [];
-  for (let index = 0; index < data.rows.length; index++) {
-    const row = data.rows[index];
-    const cells = row.cells;
-    for (let index = 0; index < data.columns.length; index++) {
-      const column = data.columns[index];
-      const cell = cells[column.name];
-      if (cell) {
-        const dValue = getCellValueForDisplay(data.columns[index], cell);
-        const found = !!(dValue.toLowerCase().indexOf(value.toLowerCase()) > -1);
-        if (found) {
-          tempRows.push({ row, weight: index });
-          break;
+    const data = isDetail ? this.detailData : this.data;
+    if (!data || !data.rows || data.rows.length == 0) {
+        return undefined;
+    }
+    if (!value) {
+        return data;
+    }
+    const tempData = {
+        columns: this.data.columns,
+        rows: [],
+    };
+    const tempRows = [];
+    for (let index = 0; index < data.rows.length; index++) {
+        const row = data.rows[index];
+        const cells = row.cells;
+        for (let index = 0; index < data.columns.length; index++) {
+            const column = data.columns[index];
+            const cell = cells[column.name];
+            if (cell) {
+                const dValue = getCellValueForDisplay(data.columns[index], cell);
+                const found = !!(dValue.toLowerCase().indexOf(value.toLowerCase()) > -1);
+                if (found) {
+                    tempRows.push({ row, weight: index });
+                    break;
+                }
+            }
         }
-      }
     }
-  }
-  tempRows
-    .sort((a, b) => a.weight - b.weight)
-    .forEach((tempRow) => {
-    tempData.rows.push(tempRow.row);
-  });
-  return tempData;
+    tempRows
+        .sort((a, b) => a.weight - b.weight)
+        .forEach((tempRow) => {
+        tempData.rows.push(tempRow.row);
+    });
+    return tempData;
 }, _KupPlanner_getIconUrl = function _KupPlanner_getIconUrl(row, columnName) {
-  var _a;
-  let iconUrl = undefined;
-  if (columnName) {
-    const iconCell = row.cells[columnName];
-    let icon = (_a = iconCell === null || iconCell === void 0 ? void 0 : iconCell.data) === null || _a === void 0 ? void 0 : _a.resource;
-    if (!icon) {
-      icon = iconCell.value;
-    }
-    if (icon) {
-      iconUrl = getAssetPath('./assets/svg/' + icon + '.svg');
+    var _a;
+    let iconUrl = undefined;
+    if (columnName) {
+        const iconCell = row.cells[columnName];
+        let icon = (_a = iconCell === null || iconCell === void 0 ? void 0 : iconCell.data) === null || _a === void 0 ? void 0 : _a.resource;
+        if (!icon) {
+            icon = iconCell.value;
+        }
+        if (icon) {
+            iconUrl = getAssetPath('./assets/svg/' + icon + '.svg');
+        }
     }
-  }
-  return iconUrl;
+    return iconUrl;
 }, _KupPlanner_getIconColor = function _KupPlanner_getIconColor(row, columnName) {
-  var _a;
-  let iconColor = undefined;
-  if (columnName) {
-    const iconCell = row.cells[columnName];
-    iconColor = (_a = iconCell === null || iconCell === void 0 ? void 0 : iconCell.data) === null || _a === void 0 ? void 0 : _a.color;
-    if (iconColor) {
-      iconColor =
-        __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").theme.colorCheck(iconColor).hexColor;
+    var _a;
+    let iconColor = undefined;
+    if (columnName) {
+        const iconCell = row.cells[columnName];
+        iconColor = (_a = iconCell === null || iconCell === void 0 ? void 0 : iconCell.data) === null || _a === void 0 ? void 0 : _a.color;
+        if (iconColor) {
+            iconColor =
+                __classPrivateFieldGet(this, _KupPlanner_kupManager, "f").theme.colorCheck(iconColor).hexColor;
+        }
     }
-  }
-  return iconColor;
+    return iconColor;
 };