@retailcrm/datalens-ui 0.0.0

package/pages/WizardPage.js

@@ -0,0 +1,2774 @@
+import { bv as resetWizardStore, bJ as setDefaults, bK as mapClientConfigToChartsConfig, bL as setActualChart, bM as onErrorWizardWidgetUpdate, bN as onSuccessWizardWidgetUpdate, bO as receiveWidget, bP as selectDatasetId, bQ as selectUpdatesByFieldId, S as selectUpdates, bR as selectOriginalParameters, Y as selectDataset, bS as setUpdates, $ as updateDatasetByValidation, bT as selectParameters, bU as selectHierarchyEditorData, a7 as selectHierarchies, f as selectSubVisualization, K as selectSort, E as setDrillDownLevel, F as updatePlaceholderSettings, bV as closeHierarchyEditor, G as updatePreviewAndClientChartsConfig, bW as setHierarchies, D as getAxisModePlaceholderSettings, az as selectWidget, c as selectVisualization, R as selectDimensions, L as selectMeasures, ay as selectDatasetError, bX as selectLinks, bY as selectDatasetApiErrors, X as selectDatasets, Z as selectFields, bZ as selectIsNavigationVisible, b_ as selectDatasetLoaded, b$ as selectDatasetLoading, c0 as setDatasetApiErrors, c1 as openDialogMultidataset, c2 as fetchWidget, a3 as openHierarchyEditor, c3 as toggleNavigation, c4 as setLinks, c5 as removeDataset, c6 as setCurrentDataset, c7 as fetchDataset, a8 as selectExtendedDimensionsAndMeasures, T as selectWizardWorkbookId, c8 as selectIsChartSaved, c9 as selectPreviewEntryId, ca as selectConfigForSaving, cb as selectConfig, cc as selectConfigType, cd as updateWizardWidgetAndUpdateConfig, ce as setHighchartsWidget, cf as selectPreviewDescription, cg as selectIsDescriptionChanged, ch as setDescription, u as useBindHotkey, ci as toggleFullscreen, cj as selectViewOnlyMode, ck as selectIsFullscreen, s as selectCanGoBack, a as selectCanGoForward, cl as toggleViewOnlyMode, w as withHotkeysContext, cm as selectInitialPreviewHash, cn as selectPreviewHash, co as selectWidgetHash, cp as selectDefaultPath, cq as selectIsDefaultsSet, cr as selectIsWidgetLoading, cs as selectWidgetError, U as selectExtraSettings, ct as selectSettings, cu as updateWizardWidget, cv as updateClientChartsConfig, cw as receiveWidgetAndPrepareMetadata, bw as setWizardStore, bH as dash_default, bI as wizardReducer } from "./DashPage.js";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import React__default, { Component } from "react";
+import block from "bem-cn-lite";
+import { batch, useDispatch, connect, useSelector } from "react-redux";
+import { bindActionCreators } from "redux";
+import { a as iconError, w as withInaccessibleOnMobile } from "./ConnectionsPage.js";
+import { a as selectDebugMode, e as setCurrentPageEntry, g as getIsAsideHeaderEnabled } from "../components/AsideHeaderAdapter.js";
+import { Dialog, Button, DropdownMenu, Icon, Popover, TextInput, HelpMark, Loader } from "@gravity-ui/uikit";
+import { toaster } from "@gravity-ui/uikit/toaster-singleton";
+import { j as i18n$1, eD as SectionDatasetQA, l as I18n, F as Feature, b6 as isParameter, aZ as DATASET_FIELD_TYPES, b5 as DatasetFieldType, eE as DatasetItemActionsQa, eF as HierarchyEditorQa, eG as isPlaceholderSupportsAxisMode, bT as getResultSchemaFromDataset, D as DL, r as registry, d as EntryScope, c7 as PLACE, aR as MenuItemsIds, ev as WizardPageQa, x as EntryUpdateMode, y as ChartSaveControlsQA, e as URL_QUERY, d1 as AccessRightsUrlOpen, cs as SPLIT_PANE_RESIZER_CLASSNAME } from "../components/AccessRights.js";
+import isEqual from "lodash/isEqual";
+import { withRouter } from "react-router-dom";
+import SplitPane from "react-split-pane";
+import { compose } from "recompose";
+import { A as setEntryContent, ah as setRevisionsMode, R as RevisionsMode, f as openDialogErrorWithTabs, i as isEnabledFeature, o as openDialog, bd as openDialogParameter, U as Utils, T as withHiddenUnmount, c as closeDialog, z as getRouter, r as getLocation, bg as matchDatasetFieldFilter, b0 as reloadRevisionsOnSave, bk as openDialogSaveChartConfirm, aX as updateDialogProps, aZ as ActionPanel, bo as ChartSaveControls, aY as openDialogSaveDraftChartAsActualConfirm, ba as cleanRevisions, y as getUrlParamFromStr, ag as isUnreleasedByUrlParams, D as sdk, V as useEffectOnce } from "../components/ActionPanel.js";
+import { i as isDraftVersion } from "../components/Revisions.js";
+import { w as withErrorPage } from "../components/ErrorPage.js";
+import { W as WIZARD_EDIT_HISTORY_UNIT_ID, s as getIconForDataType, av as ITEM_TYPES, aE as generateNextTitle, aF as prepareFieldForCreate, ap as prepareFieldForUpdate, c as isFieldVisible, aG as DATASET_ERRORS, y as AVAILABLE_DATE_FORMATS, aj as AVAILABLE_DATETIME_FORMATS, al as AVAILABLE_DATETIMETZ_FORMATS, aH as shouldComponentUpdateWithDeepComparison, a9 as UNDO_HOTKEY, a8 as HOTKEYS_SCOPES, aa as REDO_HOTKEY, z as getDefaultChartName, k as getAvailableVisualizations } from "../components/DialogFilter.js";
+import { hg as resetEditHistoryUnit, cv as goBack, cw as goForward, dd as setEditMode, d7 as isDraft, cT as isEditMode, bI as addEditHistoryPoint, gO as initEditHistoryUnit, bp as reducerRegistry } from "../components/ControlComponents.js";
+import debounce from "lodash/debounce";
+import ResizeObserver from "resize-observer-polyfill";
+import { W as WorkbookNavigationMinimal } from "../components/WorkbookNavigationMinimal.js";
+import { v1 } from "uuid";
+import { D as DIALOG_FIELD_EDITOR } from "../components/DialogFieldEditor.js";
+import { D as DIALOG_FIELD_INSPECTOR, a as DNDContainer, b as DIALOG_FIELD, g as getCustomExportActionWrapperWithSave, S as SectionVisualization } from "./QLPage.js";
+import { Ellipsis, ChevronDown, Plus, CirclesIntersection, Link, Function, PencilToSquare, ArrowUturnCcwLeft, ArrowUturnCwRight, ChevronsCollapseUpRight, ChevronsExpandUpRight, CircleInfo } from "@gravity-ui/icons";
+import { S as SharedEntryIcon } from "../components/SharedEntryIcon.js";
+import { ItemSelector } from "@gravity-ui/components";
+import omit from "lodash/omit";
+import { i as iconPlus } from "../components/ColorPaletteEditorContainer.js";
+import { E as EntryDialogName, a as EntryDialogResolveStatus, b as EntryDialogues } from "../components/EntryDialogues.js";
+import { N as NavigationMinimal_default } from "../components/Navigation.js";
+import { P as PlaceholderIllustration } from "../components/PlaceholderIllustration.js";
+import { C as ChartWrapper } from "../components/Widgets.js";
+import { M as MAX_ENTRY_DESCRIPTION_LENGTH, D as DIALOG_ENTRY_DESCRIPTION, o as openDialogEntryAnnotationDescription } from "../components/DialogEntryDescription.js";
+import { E as ErrorContent } from "../components/ErrorContent.js";
+import { S as SlugifyUrl } from "../components/SlugifyUrl.js";
+import { P as PageTitle } from "../components/PageTitle.js";
+class DialogNoRights extends React__default.PureComponent {
+  render() {
+    return /* @__PURE__ */ jsx(Dialog, { open: this.props.visible, onClose: this.props.onClose, children: /* @__PURE__ */ jsxs("div", { className: "dialog-no-rights", children: [
+      /* @__PURE__ */ jsx(Dialog.Header, { caption: i18n$1("wizard", "label_no-rights-title") }),
+      /* @__PURE__ */ jsx(Dialog.Body, { children: /* @__PURE__ */ jsx("div", { children: i18n$1("wizard", "label_no-rights-text") }) }),
+      /* @__PURE__ */ jsxs(Dialog.Footer, { preset: "default", children: [
+        /* @__PURE__ */ jsx(Button, { view: "outlined", size: "l", onClick: this.props.onAccessRights, children: i18n$1("wizard", "button_access-rights") }),
+        /* @__PURE__ */ jsx(Button, { view: "outlined", size: "l", onClick: this.props.onSaveAs, children: i18n$1("wizard", "button_save-as") })
+      ] })
+    ] }) });
+  }
+}
+function onSuccessSetActualWizardChart() {
+  return async (dispatch, getState) => {
+    const newWidget = getState().wizard.widget.widget;
+    if (newWidget) {
+      await dispatch(setEntryContent(newWidget));
+    } else {
+      await dispatch(setRevisionsMode(RevisionsMode.Closed));
+    }
+  };
+}
+function onErrorSetActualWizardChart(error) {
+  return (dispatch) => {
+    dispatch(receiveWidget({ data: null, error }));
+  };
+}
+function setActualWizardChart(isDraftEntry) {
+  return async (dispatch, getState) => {
+    const state = getState();
+    const configForSaving = state.wizard.widget.widget.data;
+    const entry = state.wizard?.widget?.widget || {};
+    const data = mapClientConfigToChartsConfig({ shared: configForSaving });
+    await dispatch(
+      setActualChart({
+        data,
+        entry,
+        isDraftEntry,
+        onRequestSuccess: (responseData) => dispatch(onSuccessWizardWidgetUpdate(responseData)),
+        onRequestError: (error) => dispatch(onErrorWizardWidgetUpdate(error)),
+        onSetActualSuccess: () => dispatch(onSuccessSetActualWizardChart()),
+        onSetActualError: (error) => dispatch(onErrorSetActualWizardChart(error))
+      })
+    );
+    return null;
+  };
+}
+function reloadWizardEntryByRevision(params) {
+  return (dispatch) => {
+    batch(() => {
+      dispatch(resetWizardStore());
+      dispatch(setDefaults(params));
+      dispatch(resetEditHistoryUnit({ unitId: WIZARD_EDIT_HISTORY_UNIT_ID }));
+    });
+  };
+}
+const i18n = I18n.keyset("wizard");
+const b$9 = block("dataset-select-item");
+const CurrentItemContent = (props) => {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: b$9("content"),
+      onClick: props.onClick,
+      title: `${props.label} ${props.description}`,
+      "data-qa": props.qaRole,
+      children: [
+        props.icon,
+        /* @__PURE__ */ jsx("div", { className: b$9("label"), children: props.label }),
+        /* @__PURE__ */ jsx("div", { className: b$9("description"), "data-qa": "current-dataset", children: props.description })
+      ]
+    }
+  );
+};
+const getIsShowDelegation = (delegation) => {
+  return typeof delegation === "boolean";
+};
+const SecondaryItemContent = (props) => {
+  return /* @__PURE__ */ jsxs("div", { className: b$9("content"), onClick: props.onClick, "data-qa": props.qaRole, children: [
+    props.icon,
+    /* @__PURE__ */ jsx("div", { className: b$9("label"), title: props.label, children: props.label }),
+    getIsShowDelegation(props.sharedDatasetDelegation) && /* @__PURE__ */ jsx(
+      SharedEntryIcon,
+      {
+        className: b$9("shared-icon"),
+        isDelegated: props.sharedDatasetDelegation
+      }
+    )
+  ] });
+};
+const ErrorIcon = (props) => {
+  const dispatch = useDispatch();
+  const handleClickDetails = React__default.useCallback(() => {
+    dispatch(
+      openDialogErrorWithTabs({
+        error: props.error
+      })
+    );
+  }, [dispatch, props.error]);
+  return /* @__PURE__ */ jsx(
+    Popover,
+    {
+      hasArrow: true,
+      content: /* @__PURE__ */ jsxs("div", { className: b$9("popover-content"), children: [
+        i18n("tooltip_dataset-fetch-failed"),
+        /* @__PURE__ */ jsx(Button, { onClick: handleClickDetails, children: i18n("tooltip_dataset-fetch-failed-details-label") })
+      ] }),
+      children: /* @__PURE__ */ jsx(
+        Icon,
+        {
+          qa: "dataset-error-icon",
+          className: b$9("icon"),
+          data: iconError,
+          width: "20",
+          height: "20"
+        }
+      )
+    }
+  );
+};
+const DatasetSelectItem = (props) => {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: b$9({
+        secondary: props.secondary,
+        primary: !props.secondary,
+        selected: props.selected,
+        error: Boolean(props.error)
+      }),
+      "data-qa": "dataset-select-item",
+      children: [
+        props.secondary ? /* @__PURE__ */ jsx(SecondaryItemContent, { ...props }) : /* @__PURE__ */ jsx(CurrentItemContent, { ...props }),
+        props.error && /* @__PURE__ */ jsx(ErrorIcon, { ...props }),
+        props.items ? /* @__PURE__ */ jsx("div", { className: b$9("more"), children: /* @__PURE__ */ jsx(
+          DropdownMenu,
+          {
+            size: "s",
+            popupProps: {
+              qa: SectionDatasetQA.DatasetSelectMoreMenu
+            },
+            renderSwitcher: ({ onClick, onKeyDown }) => /* @__PURE__ */ jsx(
+              Button,
+              {
+                view: "flat-secondary",
+                qa: SectionDatasetQA.DatasetSelectMore,
+                onClick,
+                onKeyDown,
+                children: /* @__PURE__ */ jsx(Icon, { data: Ellipsis, size: 16 })
+              }
+            ),
+            items: props.items
+          }
+        ) }) : null
+      ]
+    }
+  );
+};
+const b$8 = block("dataset-select");
+const DatasetIcon = () => {
+  return /* @__PURE__ */ jsx("div", { className: b$8("icon-container"), children: /* @__PURE__ */ jsx(Icon, { data: CirclesIntersection, size: 18 }) });
+};
+class DatasetSelect extends React__default.Component {
+  constructor(props) {
+    super(props);
+    this.onSelectClick = () => {
+      if (this.state.isOpen && this.props.isPopupVisible) {
+        this.props.toggleNavigation(false);
+      }
+      this.setState({
+        isOpen: !this.state.isOpen
+      });
+    };
+    this.state = {
+      isOpen: Boolean(props.datasetApiErrors.length)
+    };
+  }
+  render() {
+    const { datasets, datasetApiErrors } = this.props;
+    const shouldShowSelect = datasets?.length || Object.keys(datasetApiErrors).length;
+    return /* @__PURE__ */ jsx("div", { className: b$8(), children: /* @__PURE__ */ jsx("div", { className: b$8("content"), children: shouldShowSelect ? this.getSelect() : this.getPreselect() }) });
+  }
+  getSelect() {
+    const { dataset } = this.props;
+    const { isOpen } = this.state;
+    return /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        DatasetSelectItem,
+        {
+          onClick: this.onSelectClick,
+          icon: /* @__PURE__ */ jsx(
+            Icon,
+            {
+              data: ChevronDown,
+              className: b$8("icon", { rotated: isOpen }),
+              size: 20
+            }
+          ),
+          label: i18n$1("wizard", "dataset-selector_label"),
+          description: dataset?.realName,
+          items: this.getDatasetItemActions(dataset?.id),
+          qaRole: "dataset-select"
+        }
+      ),
+      this.getSelectItems()
+    ] });
+  }
+  getSelectItems() {
+    const { onChange, datasets = [], dataset, datasetApiErrors } = this.props;
+    const { isOpen } = this.state;
+    if (!isOpen) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+      datasets.map((el) => /* @__PURE__ */ jsx(
+        DatasetSelectItem,
+        {
+          icon: /* @__PURE__ */ jsx(DatasetIcon, {}),
+          onClick: onChange.bind(null, el),
+          label: el.realName,
+          items: this.getDatasetItemActions(el.id),
+          secondary: true,
+          selected: el === dataset,
+          sharedDatasetDelegation: el.collection_id ? el.isDelegated : void 0
+        },
+        `${el.id}`
+      )),
+      datasetApiErrors.map(({ datasetId, error }) => {
+        return /* @__PURE__ */ jsx(
+          DatasetSelectItem,
+          {
+            icon: /* @__PURE__ */ jsx(DatasetIcon, {}),
+            label: datasetId,
+            items: this.getDatasetItemActions(datasetId),
+            secondary: true,
+            error
+          },
+          datasetId
+        );
+      }),
+      isEnabledFeature(Feature.HideMultiDatasets) ? null : /* @__PURE__ */ jsx(
+        DatasetSelectItem,
+        {
+          icon: /* @__PURE__ */ jsx(Icon, { data: Plus, className: b$8("icon"), size: 20 }),
+          label: i18n$1("wizard", "button_add-dataset"),
+          secondary: true,
+          qaRole: SectionDatasetQA.AddDatasetButton,
+          onClick: this.props.onAddDatasetClick
+        }
+      )
+    ] });
+  }
+  getPreselect() {
+    const { onPreselectClick } = this.props;
+    return /* @__PURE__ */ jsx(
+      Button,
+      {
+        className: b$8("preselect-button"),
+        view: "flat",
+        pin: "brick-brick",
+        size: "l",
+        qa: SectionDatasetQA.DatasetSelect,
+        onClick: onPreselectClick,
+        children: /* @__PURE__ */ jsxs("div", { className: b$8("container"), children: [
+          /* @__PURE__ */ jsx(DatasetIcon, {}),
+          i18n$1("wizard", "button_choose-dataset")
+        ] })
+      }
+    );
+  }
+  getDatasetItemActions(datasetId) {
+    if (!datasetId) {
+      return [];
+    }
+    const { datasets = [], datasetApiErrors } = this.props;
+    const isError = datasetApiErrors.some((item) => item.datasetId === datasetId);
+    return [
+      {
+        action: () => this.props.onOpenDatasetClick(datasetId),
+        text: i18n$1("wizard", "button_to-dataset"),
+        qa: SectionDatasetQA.GoToDatasetButton
+      },
+      {
+        action: () => this.props.onReplaceDatasetClick(datasetId),
+        text: i18n$1("wizard", "button_replace-dataset"),
+        qa: SectionDatasetQA.ReplaceDatasetButton
+      },
+      {
+        action: () => this.props.onRemoveDatasetClick(datasetId),
+        text: i18n$1("wizard", "button_remove-dataset"),
+        hidden: datasets.length <= 1 && !isError,
+        qa: SectionDatasetQA.RemoveDatasetButton
+      },
+      {
+        action: () => this.props.openDialogMultidataset({}),
+        text: i18n$1("wizard", "button_datasets-settings"),
+        hidden: datasets.length <= 1,
+        qa: SectionDatasetQA.SettingsDatasetButton
+      }
+    ];
+  }
+}
+const b$7 = block("custom-text-input");
+class SearchInput extends React__default.PureComponent {
+  render() {
+    const { text, placeholder, onChange } = this.props;
+    return /* @__PURE__ */ jsx("div", { className: b$7(), children: /* @__PURE__ */ jsx(
+      TextInput,
+      {
+        type: "text",
+        size: "m",
+        pin: "round-round",
+        value: text,
+        placeholder,
+        hasClear: true,
+        onUpdate: onChange,
+        qa: "find-field-input"
+      }
+    ) });
+  }
+}
+const b$6 = block("wizard-dataset-item");
+class DatasetItem extends React__default.Component {
+  constructor() {
+    super(...arguments);
+    this.itemRef = React__default.createRef();
+    this.handleApplyDialogParameter = (updatedField, initialField) => {
+      const { dataset, originalParameters } = this.props;
+      if (!dataset) {
+        return;
+      }
+      const originalParameter = originalParameters.find(
+        (originalField) => originalField.guid === updatedField.guid
+      );
+      const deleteUpdateAfterValidation = originalParameter && String(originalParameter.default_value) === String(updatedField.default_value);
+      let updates;
+      if (updatedField.guid === initialField.guid) {
+        updates = [
+          {
+            action: "update_field",
+            field: updatedField,
+            deleteUpdateAfterValidation
+          }
+        ];
+      } else {
+        updates = [
+          // Updating the guid first
+          {
+            action: "update_field",
+            field: {
+              ...updatedField,
+              guid: initialField.guid,
+              new_id: updatedField.guid
+            }
+          },
+          // And then the whole field is completely
+          {
+            action: "update_field",
+            field: updatedField
+          }
+        ];
+      }
+      this.props.updateDatasetByValidation({
+        dataset,
+        updates
+      });
+    };
+    this.handleResetDialogParameter = (fieldId) => {
+      const { originalParameters, updates } = this.props;
+      const filteredUpdates = updates.filter((update) => update.field.guid !== fieldId);
+      this.props.setUpdates({ updates: filteredUpdates });
+      return originalParameters.find((originalField) => originalField.guid === fieldId);
+    };
+  }
+  render() {
+    const { item } = this.props.dndProps;
+    const itemTitle = item.fakeTitle || item.title;
+    const itemTitleAndDescription = item.description ? `${item.title}
+
+${item.description}` : itemTitle;
+    const isLinked = this.getIsLinked();
+    const isItemParameter = isParameter(item);
+    const isDatasetParameter = isItemParameter && !item.local;
+    const menuItems = this.getItems();
+    const needToShowMoreButton = menuItems.some((menuItem) => !menuItem.hidden);
+    const hasParameterChanged = this.props.datasetItemUpdates.length > 0;
+    const showFormulaIcon = item.type !== "PSEUDO" && !isParameter(item) && item.data_type !== DATASET_FIELD_TYPES.HIERARCHY;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `${b$6()} ${this.getClassName()}`,
+        title: itemTitleAndDescription,
+        ref: this.itemRef,
+        "data-qa": itemTitle,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: `${b$6("item-icon")} ${item.data_type}-icon`,
+              "data-qa": SectionDatasetQA.ItemIcon,
+              onClick: () => {
+                if (item.data_type === DATASET_FIELD_TYPES.HIERARCHY) {
+                  this.props.openHierarchyEditor(item);
+                }
+                if (item.type === "PSEUDO") {
+                  return;
+                }
+                if (isItemParameter) {
+                  this.props.openDialogParameter({
+                    type: isDatasetParameter ? "edit-default-value" : "edit",
+                    field: item,
+                    onApply: (field) => this.handleApplyDialogParameter(field, item),
+                    onReset: this.handleResetDialogParameter
+                  });
+                  return;
+                }
+                const extra = {
+                  title: Boolean(item.local)
+                };
+                this.props.openDialogField(item, extra);
+              },
+              children: /* @__PURE__ */ jsx(Icon, { data: this.getItemIcon(), width: "16", height: "16" })
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `${b$6("item-title")}`,
+              "data-qa": SectionDatasetQA.ItemTitle,
+              title: itemTitleAndDescription,
+              children: [
+                itemTitle,
+                isLinked && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: `${b$6("item-link-icon")}`,
+                    onClick: this.props.openDialogMultidataset,
+                    children: /* @__PURE__ */ jsx(Icon, { data: Link, width: "16", height: "16" })
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: `${b$6("item-right-icons-container")}`, children: [
+            showFormulaIcon && /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: `${b$6("item-formula-icon")}`,
+                onClick: () => {
+                  this.props.onClickEditDatasetItem(item);
+                },
+                "data-qa": SectionDatasetQA.ItemFunction,
+                children: /* @__PURE__ */ jsx(Icon, { data: Function, size: 14 })
+              }
+            ),
+            isDatasetParameter && hasParameterChanged && /* @__PURE__ */ jsx(
+              Popover,
+              {
+                content: i18n$1("wizard", "tooltip_parameter-changed-icon"),
+                hasArrow: false,
+                placement: "bottom",
+                offset: { mainAxis: -5, crossAxis: 0 },
+                children: /* @__PURE__ */ jsx("div", { className: `${b$6("item-formula-icon")}`, title: "", children: /* @__PURE__ */ jsx(Icon, { data: PencilToSquare, size: 14 }) })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: `${b$6("item-more-icon")}`,
+                onMouseEnter: (e) => {
+                  this.addIgnoreDrag(e.currentTarget.parentElement);
+                },
+                onMouseLeave: (e) => {
+                  this.removeIgnoreDrag(e.currentTarget.parentElement);
+                },
+                children: needToShowMoreButton && /* @__PURE__ */ jsx(
+                  DropdownMenu,
+                  {
+                    size: "s",
+                    defaultSwitcherProps: {
+                      qa: SectionDatasetQA.FieldActions,
+                      size: "s",
+                      width: "max"
+                    },
+                    items: menuItems
+                  }
+                )
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+  getClassName() {
+    const { item, className, isDragging } = this.props.dndProps;
+    let resultClassName = "";
+    const itemType = isParameter(item) ? DatasetFieldType.Parameter.toLowerCase() : item.type?.toLowerCase();
+    resultClassName += item.formula && !item.asPseudo ? " formula-item" : "";
+    resultClassName += className || "";
+    resultClassName += item.className ? ` ${item.className}` : ` item ${itemType}-item`;
+    resultClassName += isDragging ? " is-dragging" : "";
+    resultClassName += item.local && !item.asPseudo ? " local-item" : "";
+    resultClassName += item.asPseudo ? " pseudo-item" : "";
+    if (item.type !== "PSEUDO" || item.data_type === DATASET_FIELD_TYPES.HIERARCHY) {
+      resultClassName += item.valid ? "" : " item-error";
+    }
+    return resultClassName;
+  }
+  getItemIcon() {
+    const { item } = this.props.dndProps;
+    return getIconForDataType(item.data_type);
+  }
+  getIsLinked() {
+    const { links, dndProps } = this.props;
+    const item = dndProps.item;
+    if (links.length) {
+      return links.some((link) => {
+        const linkWithThisDataset = link.fields[item.datasetId];
+        return linkWithThisDataset && linkWithThisDataset.field.guid === item.guid;
+      });
+    } else {
+      return false;
+    }
+  }
+  getItems() {
+    const { item } = this.props.dndProps;
+    const isItemParameter = isParameter(item);
+    const isDatasetParameter = isItemParameter && !item.local;
+    return [
+      {
+        action: async () => {
+          if (window.confirm(i18n$1("wizard", "toast_confirm-remove-item"))) {
+            this.removeIgnoreDrag(this.itemRef.current);
+            this.props.onClickRemoveDatasetItem(item);
+          }
+        },
+        qa: DatasetItemActionsQa.RemoveField,
+        text: i18n$1("wizard", "button_remove"),
+        hidden: !item.local
+      },
+      {
+        action: () => {
+          this.props.removeHierarchy(item);
+        },
+        qa: "dropdown-field-menu-hierarchy-remove",
+        text: i18n$1("wizard", "button_remove"),
+        hidden: item.data_type !== DATASET_FIELD_TYPES.HIERARCHY
+      },
+      {
+        action: () => {
+          this.props.openHierarchyEditor(item);
+        },
+        qa: "dropdown-field-menu-hierarchy-edit",
+        text: i18n$1("wizard", "button_edit"),
+        hidden: item.data_type !== DATASET_FIELD_TYPES.HIERARCHY
+      },
+      {
+        action: () => {
+          this.removeIgnoreDrag(this.itemRef.current);
+          this.props.onClickDuplicateDatasetItem(item);
+        },
+        qa: "dropdown-field-menu-duplicate",
+        text: i18n$1("wizard", "button_duplicate"),
+        hidden: item.data_type === DATASET_FIELD_TYPES.HIERARCHY || isItemParameter
+      },
+      {
+        action: () => {
+          this.removeIgnoreDrag(this.itemRef.current);
+          this.props.onClickEditDatasetItem(item);
+        },
+        qa: "dropdown-field-menu-edit",
+        text: i18n$1("wizard", "button_edit"),
+        hidden: !item.local || item.calc_mode !== "formula"
+      },
+      {
+        action: () => {
+          this.props.openDialogParameter({
+            type: isDatasetParameter ? "edit-default-value" : "edit",
+            field: item,
+            onApply: (field) => this.handleApplyDialogParameter(field, item),
+            onReset: this.handleResetDialogParameter
+          });
+        },
+        qa: "dropdown-field-menu-edit-parameter",
+        text: i18n$1("wizard", "button_edit"),
+        hidden: !isParameter(item)
+      },
+      {
+        action: () => {
+          this.props.openDialog({ id: DIALOG_FIELD_INSPECTOR, props: { field: item } });
+        },
+        qa: "dropdown-field-menu-inspect",
+        text: "Inspect!",
+        hidden: !Utils.isSuperUser()
+      }
+    ];
+  }
+  removeIgnoreDrag(element) {
+    if (!element) {
+      return;
+    }
+    element.className = element.className.replace(" ignore-drag", "");
+  }
+  addIgnoreDrag(element) {
+    if (!element) {
+      return;
+    }
+    element.className += " ignore-drag";
+  }
+}
+const mapDispatchToProps$5 = (dispatch) => {
+  return bindActionCreators(
+    {
+      openDialogParameter,
+      updateDatasetByValidation,
+      openDialog,
+      setUpdates
+    },
+    dispatch
+  );
+};
+const mapStateToProps$5 = (state, ownProps) => {
+  const currentDatasetId = selectDatasetId(state) || "";
+  const item = ownProps.dndProps.item;
+  return {
+    dataset: selectDataset(state),
+    originalParameters: selectOriginalParameters(state, currentDatasetId),
+    updates: selectUpdates(state),
+    datasetItemUpdates: selectUpdatesByFieldId(state, item.guid)
+  };
+};
+const DatasetItem$1 = connect(mapStateToProps$5, mapDispatchToProps$5)(DatasetItem);
+const b$5 = block("section-container");
+const SectionContainer = (props) => {
+  const { title, items, wrapTo, qa, appliedSearchPhrase } = props;
+  const filteredSectionItems = items.filter(
+    (item) => item.title.toLowerCase().includes(appliedSearchPhrase)
+  );
+  return /* @__PURE__ */ jsxs("div", { className: b$5(), "data-qa": qa, children: [
+    /* @__PURE__ */ jsx("div", { className: b$5("title"), children: /* @__PURE__ */ jsx("span", { children: title }) }),
+    /* @__PURE__ */ jsx(
+      DNDContainer,
+      {
+        id: "parameters-container",
+        noRemove: true,
+        allowedTypes: ITEM_TYPES.PARAMETERS,
+        items: filteredSectionItems,
+        wrapTo
+      }
+    )
+  ] });
+};
+const ParametersContainer = (props) => {
+  const { wrapTo, appliedSearchPhrase } = props;
+  const parameters = useSelector(selectParameters);
+  const title = i18n$1("wizard", "section_parameters");
+  if (!parameters.length) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    SectionContainer,
+    {
+      appliedSearchPhrase,
+      wrapTo,
+      items: parameters,
+      title,
+      qa: SectionDatasetQA.SectionParameters
+    }
+  );
+};
+const FieldsContainer = (props) => {
+  const { wrapTo, appliedSearchPhrase } = props;
+  return /* @__PURE__ */ jsx(ParametersContainer, { appliedSearchPhrase, wrapTo });
+};
+const b$4 = block("hierarchy-editor");
+let HierarchyEditor$1 = class HierarchyEditor extends React__default.Component {
+  constructor(props) {
+    super(props);
+    this.renderItemValue = (item) => {
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: b$4("item", {
+            error: !item.valid
+          }),
+          onClick: () => {
+            let resultValue = [];
+            if (this.state.selectedFields[item.title]) {
+              const updatedSelectedFields = omit(this.state.selectedFields, item.title);
+              this.setState({ selectedFields: updatedSelectedFields });
+              resultValue = this.props.value.filter((title) => title !== item.title);
+            } else {
+              resultValue = [...this.props.value, item.title];
+              this.setState({
+                selectedFields: { ...this.state.selectedFields, [item.title]: true }
+              });
+            }
+            this.props.onChange(resultValue);
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              Icon,
+              {
+                className: b$4("item-icon", {
+                  error: !item.valid
+                }),
+                data: getIconForDataType(item.data_type),
+                width: "16",
+                height: "16"
+              }
+            ),
+            item.title
+          ]
+        }
+      );
+    };
+    this.getSelectedFields = (values) => {
+      return values.reduce(
+        (acc, value) => {
+          acc[value] = true;
+          return acc;
+        },
+        {}
+      );
+    };
+    this.state = {
+      selectedFields: this.getSelectedFields(this.props.value)
+    };
+  }
+  render() {
+    const {
+      value,
+      hierarchyName,
+      hierarchyNameError,
+      hierarchyHasInvalidFields,
+      fields,
+      onClose,
+      onApply,
+      visible,
+      onHierarchyNameChange,
+      onChange
+    } = this.props;
+    const saveButtonDisabled = Boolean(
+      value.length < 2 || !hierarchyName || hierarchyNameError || hierarchyHasInvalidFields
+    );
+    return /* @__PURE__ */ jsx(Dialog, { size: "m", open: visible, onClose, children: /* @__PURE__ */ jsxs("div", { className: b$4(), "data-qa": HierarchyEditorQa.Dialog, children: [
+      /* @__PURE__ */ jsx(
+        Dialog.Header,
+        {
+          caption: /* @__PURE__ */ jsxs("span", { children: [
+            i18n$1("wizard.hierarchy-editor", "caption"),
+            /* @__PURE__ */ jsx(HelpMark, { className: b$4("help-icon"), children: i18n$1("wizard.hierarchy-editor", "help_tooltip") })
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsxs(Dialog.Body, { className: b$4("body"), children: [
+        /* @__PURE__ */ jsx("div", { className: b$4("hierarchy-name-input-wrapper"), children: /* @__PURE__ */ jsx(
+          TextInput,
+          {
+            size: "s",
+            placeholder: i18n$1("wizard.hierarchy-editor", "name-placeholder"),
+            value: hierarchyName,
+            onUpdate: onHierarchyNameChange,
+            error: hierarchyNameError,
+            qa: "hierarchy-name-input"
+          }
+        ) }),
+        /* @__PURE__ */ jsx(Dialog.Divider, { className: b$4("dialog-divider") }),
+        /* @__PURE__ */ jsx(
+          ItemSelector,
+          {
+            selectorTitle: i18n$1("wizard.hierarchy-editor", "selector_title"),
+            items: fields,
+            value,
+            onUpdate: (values) => {
+              this.setState({
+                selectedFields: this.getSelectedFields(values)
+              });
+              onChange(values);
+            },
+            filterItem: this.filterItem,
+            getItemId: (item) => item.title,
+            renderItemValue: this.renderItemValue,
+            hideSelectAllButton: true
+          }
+        ),
+        /* @__PURE__ */ jsx(Dialog.Divider, { className: b$4("dialog-divider") })
+      ] }),
+      /* @__PURE__ */ jsx(
+        Dialog.Footer,
+        {
+          onClickButtonCancel: onClose,
+          onClickButtonApply: onApply,
+          textButtonApply: i18n$1("wizard.hierarchy-editor", "button_save"),
+          textButtonCancel: i18n$1("wizard.hierarchy-editor", "button_cancel"),
+          propsButtonApply: {
+            disabled: saveButtonDisabled,
+            qa: HierarchyEditorQa.ApplyButton
+          }
+        }
+      )
+    ] }) });
+  }
+  filterItem(filter) {
+    return (item) => item.title.toLowerCase().includes(filter.toLowerCase());
+  }
+};
+class HierarchyEditorContainer extends React__default.Component {
+  constructor(props) {
+    super(props);
+    this.onApply = () => {
+      const { hierarchy } = this.props;
+      if (hierarchy) {
+        this.updateHierarchy();
+      } else {
+        this.addHierarchy();
+      }
+      this.onClose();
+    };
+    this.onChange = (value2) => {
+      this.setState({
+        value: value2
+      });
+    };
+    this.onHierarchyNameChange = (hierarchyName2) => {
+      this.setState({
+        hierarchyName: hierarchyName2
+      });
+    };
+    this.onClose = () => {
+      this.props.closeHierarchyEditor();
+    };
+    const value = (props.hierarchy?.fields || []).map((el) => el.title);
+    this.existedTitles = [...props.hierarchies, ...props.fields].reduce(
+      (acc, field) => {
+        acc[field.title] = field.guid;
+        return acc;
+      },
+      {}
+    );
+    const hierarchyName = props.hierarchy?.title || generateNextTitle(
+      Object.keys(this.existedTitles),
+      i18n$1("wizard.hierarchy-editor", "new_hierarchy")
+    );
+    this.state = {
+      value,
+      hierarchyName
+    };
+  }
+  render() {
+    const { value, hierarchyName } = this.state;
+    const { fields, visible, hierarchy } = this.props;
+    const fieldWithSameTitle = this.existedTitles[hierarchyName];
+    const hierarchyNameError = fieldWithSameTitle && fieldWithSameTitle !== hierarchy?.guid ? i18n$1("wizard.hierarchy-editor", "field_already_exists") : void 0;
+    const hierarchyHasInvalidFields = this.getOrderedHierarchyFields().some(
+      (field) => !field.valid
+    );
+    return /* @__PURE__ */ jsx(
+      HierarchyEditor$1,
+      {
+        visible,
+        fields,
+        hierarchyName,
+        hierarchyNameError,
+        hierarchyHasInvalidFields,
+        value,
+        onClose: this.onClose,
+        onApply: this.onApply,
+        onChange: this.onChange,
+        onHierarchyNameChange: this.onHierarchyNameChange
+      }
+    );
+  }
+  getOrderedHierarchyFields() {
+    const fieldsDict = this.props.fields.reduce((acc, field) => {
+      acc[field.title] = field;
+      return acc;
+    }, {});
+    return this.state.value.map((fieldTitle) => fieldsDict[fieldTitle]).filter(Boolean);
+  }
+  updateHierarchy() {
+    const { hierarchies, hierarchy, visualization, chartConfig } = this.props;
+    const { hierarchyName } = this.state;
+    const orderedHierarchyFields = this.getOrderedHierarchyFields();
+    if (visualization) {
+      const placeholders = visualization.placeholders;
+      const currentHierarchy = hierarchies.find((h) => h.guid === hierarchy?.guid);
+      placeholders.forEach((placeholder) => {
+        const firstField = placeholder.items[0];
+        const isFirstFieldCurrentHierarchy = currentHierarchy && firstField && currentHierarchy.guid === firstField.guid;
+        const placeholderId = placeholder.id;
+        const visualizationId = visualization.id;
+        if (!isPlaceholderSupportsAxisMode(placeholderId, visualizationId) || !isFirstFieldCurrentHierarchy) {
+          return;
+        }
+        if (currentHierarchy) {
+          this.props.setDrillDownLevel({ drillDownLevel: 0 });
+          this.props.updatePlaceholderSettings(
+            placeholderId,
+            getAxisModePlaceholderSettings({
+              placeholder,
+              firstField: {
+                ...currentHierarchy,
+                fields: orderedHierarchyFields,
+                title: hierarchyName
+              },
+              chartConfig
+            })
+          );
+        }
+      });
+    }
+    this.onHierarchiesUpdate(
+      hierarchies.map(
+        (el) => el.guid === hierarchy?.guid ? {
+          ...el,
+          title: hierarchyName,
+          fields: orderedHierarchyFields
+        } : el
+      )
+    );
+  }
+  addHierarchy() {
+    const { hierarchies } = this.props;
+    const { hierarchyName } = this.state;
+    const orderedHierarchyFields = this.getOrderedHierarchyFields();
+    const guid = v1();
+    const newHierarchy = {
+      guid,
+      title: hierarchyName,
+      // TODO: we need to expand the types for fields - in the wizard there may be a className
+      // @ts-ignore
+      className: "item dimension-item",
+      type: DatasetFieldType.Pseudo,
+      data_type: DATASET_FIELD_TYPES.HIERARCHY,
+      valid: true,
+      fields: orderedHierarchyFields
+    };
+    this.onHierarchiesUpdate([...hierarchies, newHierarchy]);
+  }
+  onHierarchiesUpdate(hierarchies) {
+    this.props.setHierarchies({
+      hierarchies
+    });
+    this.props.updatePreviewAndClientChartsConfig({});
+  }
+}
+const mapStateToProps$4 = (state) => {
+  const { fields, hierarchy, visible } = selectHierarchyEditorData(state);
+  const hierarchies = selectHierarchies(state);
+  const visualization = selectSubVisualization(state);
+  const sort = selectSort(state);
+  const chartConfig = state.wizard.visualization;
+  return {
+    fields,
+    hierarchies,
+    hierarchy,
+    visible,
+    visualization,
+    sort,
+    chartConfig
+  };
+};
+const mapDispatchToProps$4 = (dispatch) => {
+  return bindActionCreators(
+    {
+      setHierarchies,
+      updatePreviewAndClientChartsConfig,
+      closeHierarchyEditor,
+      updatePlaceholderSettings,
+      setDrillDownLevel
+    },
+    dispatch
+  );
+};
+const HierarchyEditor2 = connect(
+  mapStateToProps$4,
+  mapDispatchToProps$4
+)(withHiddenUnmount(HierarchyEditorContainer));
+class SectionDataset extends React__default.Component {
+  constructor(props) {
+    super(props);
+    this.navigationButtonRef = React__default.createRef();
+    this.onDatasetSelectResize = () => {
+      this.setState({
+        datasetSelectHeight: this.navigationButtonRef.current?.clientHeight || 0
+      });
+    };
+    this.createField = ({ field }) => {
+      const dataset = this.props.dataset;
+      const preparedField = prepareFieldForCreate({
+        field,
+        dataset
+      });
+      this.props.updateDatasetByValidation({
+        dataset,
+        updates: [
+          {
+            action: "add_field",
+            field: preparedField
+          }
+        ]
+      });
+    };
+    this.updateField = ({ field, groupingChanged }) => {
+      const dataset = this.props.dataset;
+      const preparedField = prepareFieldForUpdate({
+        field,
+        groupingChanged
+      });
+      this.props.updateDatasetByValidation({
+        dataset,
+        updates: [
+          {
+            action: "update_field",
+            field: preparedField
+          }
+        ]
+      });
+    };
+    this.saveAsNewField = (field) => {
+      const { updates } = this.props;
+      const dataset = this.props.dataset;
+      const resultSchema = getResultSchemaFromDataset(dataset);
+      const guid = v1();
+      let { title } = field;
+      const fieldNext = {
+        ...field,
+        guid
+      };
+      const existedTitles = [...resultSchema, ...updates].map(
+        (row) => row.title || row.field.title || ""
+      );
+      title = generateNextTitle(existedTitles, title);
+      fieldNext.title = title;
+      fieldNext.originalFormula = field.originalFormula || field.formula;
+      if (field.grouping && field.grouping !== "none") {
+        const [operation, mode] = field.grouping.split("-");
+        let functionName;
+        if (operation === "trunc") {
+          functionName = "datetrunc";
+        } else {
+          functionName = "datepart";
+          fieldNext.data_type = DATASET_FIELD_TYPES.INTEGER;
+          fieldNext.cast = DATASET_FIELD_TYPES.INTEGER;
+        }
+        field.formula = `${functionName}([${field.originalTitle || field.title}], "${mode}")`;
+        fieldNext.grouping = field.grouping;
+        fieldNext.originalDateCast = field.cast;
+        fieldNext.originalSource = field.source;
+      }
+      if (field.formula) {
+        if (fieldNext.grouping && fieldNext.grouping !== "none") {
+          fieldNext.aggregation = field.aggregation;
+        } else {
+          fieldNext.aggregation = field.aggregation || "none";
+        }
+        fieldNext.calc_mode = "formula";
+        fieldNext.formula = field.formula;
+        fieldNext.source = "";
+      } else {
+        fieldNext.aggregation = field.aggregation;
+        fieldNext.calc_mode = "direct";
+        fieldNext.source = field.source;
+        fieldNext.cast = field.cast;
+        fieldNext.data_type = field.data_type;
+      }
+      return this.props.updateDatasetByValidation({
+        dataset,
+        updates: [
+          {
+            action: "add_field",
+            field: fieldNext
+          }
+        ]
+      });
+    };
+    this.removeField = async ({ field }) => {
+      const { dataset } = this.props;
+      const failed = await this.props.updateDatasetByValidation({
+        dataset,
+        updates: [
+          {
+            action: "delete_field",
+            field
+          }
+        ]
+      });
+      if (failed) {
+        this.props.toaster.add({
+          title: i18n$1("wizard", "label_error-remove-field"),
+          name: "WIZARD",
+          theme: "danger"
+        });
+      }
+    };
+    this.openDialogFieldEditor = async (item) => {
+      const { dataset, fields, workbookId } = this.props;
+      const fieldEditorFields = fields.filter(
+        (field2) => !field2.quickFormula && !field2.hidden && !field2.virtual
+      );
+      let field;
+      if (item) {
+        if (item.local) {
+          if (item.formula) {
+            field = item;
+          } else {
+            field = {
+              ...item,
+              local: false,
+              title: "",
+              guid: v1(),
+              calc_mode: "formula",
+              formula: `[${item.originalTitle || item.title}]`
+            };
+          }
+        } else if (item.formula) {
+          field = {
+            ...item,
+            title: "",
+            guid: v1()
+          };
+        } else {
+          field = {
+            ...item,
+            title: "",
+            guid: v1(),
+            fakeTitle: "",
+            calc_mode: "formula",
+            formula: `[${item.originalTitle || item.title}]`
+          };
+        }
+      }
+      if (dataset) {
+        const props2 = {
+          datasetContent: dataset.dataset,
+          datasetId: dataset.id,
+          workbookId: workbookId ?? null,
+          datasetOptions: dataset.options,
+          field,
+          fields: fieldEditorFields,
+          onlyFormulaEditor: true,
+          onClose: this.closeDialogFieldEditor,
+          onSave: this.onSaveDialogFieldEditor,
+          onCreate: this.onCreateDialogFieldEditor,
+          onLoadStart: () => {
+            this.setState({ fieldEditorLoading: true });
+          },
+          onLoadComplete: () => {
+            this.setState({ fieldEditorLoading: false });
+          }
+        };
+        this.props.openDialog({
+          id: DIALOG_FIELD_EDITOR,
+          props: props2
+        });
+      }
+    };
+    this.closeDialogFieldEditor = () => {
+      this.props.closeDialog();
+    };
+    this.onNavigationClick = async (data) => {
+      const {
+        datasetError,
+        datasets,
+        datasetApiErrors,
+        fetchDataset: fetchDataset2,
+        removeDataset: removeDataset2,
+        setCurrentDataset: setCurrentDataset2,
+        toggleNavigation: toggleNavigation2,
+        datasetId,
+        setDatasetApiErrors: setDatasetApiErrors2
+      } = this.props;
+      const newDatasetId = data.entryId;
+      toggleNavigation2(false);
+      const prevDatasetId = this.state.replaceDatasetId || datasetId;
+      const prevDataset = datasets.find((dataset) => dataset.id === prevDatasetId);
+      if (prevDataset) {
+        if (prevDataset.id !== data.entryId) {
+          const existingDataset = datasets.find(
+            (someDataset) => someDataset.id === newDatasetId
+          );
+          if (existingDataset) {
+            setCurrentDataset2({ dataset: existingDataset });
+          } else {
+            await fetchDataset2({
+              id: newDatasetId,
+              replacing: this.state.navigationMode === "replace"
+            });
+            const { dataset: newDataset } = this.props;
+            if (this.state.navigationMode === "replace") {
+              this.setState({ datasetReplacingInProgress: true });
+              await removeDataset2({
+                datasetId: prevDataset.id,
+                newDataset
+              });
+              if (datasets.length > 1) {
+                this.openDialogMultidataset({ initedDataset: newDataset });
+              }
+            } else if (!datasetError) {
+              this.openDialogMultidataset({ initedDataset: newDataset });
+            }
+          }
+        }
+      } else {
+        if (datasetApiErrors.some((item) => item.datasetId === prevDatasetId)) {
+          setDatasetApiErrors2({
+            datasetApiErrors: datasetApiErrors.filter(
+              (item) => item.datasetId !== prevDatasetId
+            )
+          });
+        }
+        await fetchDataset2({
+          id: newDatasetId
+        });
+      }
+      this.setState({
+        navigationMode: "",
+        replaceDatasetId: "",
+        datasetReplacingInProgress: false
+      });
+    };
+    this.onDatasetChange = (dataset) => {
+      if (this.props.dataset !== dataset) {
+        this.props.setCurrentDataset({ dataset });
+      }
+    };
+    this.onPreselectClick = () => {
+      this.props.toggleNavigation();
+    };
+    this.onOpenDatasetClick = (id) => {
+      getRouter().openTab({ pathname: `${DL.ENDPOINTS.dataset}/${id}` });
+    };
+    this.onAddDatasetClick = () => {
+      const { toggleNavigation: toggleNavigation2 } = this.props;
+      this.setState({
+        navigationMode: "add"
+      });
+      toggleNavigation2(true);
+    };
+    this.onReplaceDatasetClick = (id) => {
+      const { toggleNavigation: toggleNavigation2 } = this.props;
+      this.setState({
+        navigationMode: "replace",
+        replaceDatasetId: id
+      });
+      toggleNavigation2(true);
+    };
+    this.onRemoveDatasetClick = (datasetId) => {
+      const { removeDataset: removeDataset2, setDatasetApiErrors: setDatasetApiErrors2, datasetApiErrors } = this.props;
+      if (window.confirm(i18n$1("wizard", "toast_confirm-remove-item"))) {
+        removeDataset2({ datasetId });
+        if (datasetApiErrors.some((item) => item.datasetId === datasetId)) {
+          setDatasetApiErrors2({
+            datasetApiErrors: datasetApiErrors.filter(
+              (item) => item.datasetId !== datasetId
+            )
+          });
+        }
+      }
+    };
+    this.onButtonDatasetTryAgainClick = () => {
+      const { extractEntryId } = registry.common.functions.getAll();
+      const entryId = extractEntryId(getLocation().pathname);
+      if (entryId) {
+        this.props.fetchWidget({ entryId });
+      }
+    };
+    this.onButtonDatasetRequestRightsClick = () => {
+      const { dataset, entryDialoguesRef, datasetId } = this.props;
+      entryDialoguesRef.current.open({
+        dialog: EntryDialogName.Unlock,
+        dialogProps: {
+          // @ts-ignore
+          entry: {
+            ...dataset,
+            entryId: datasetId || dataset.id
+          }
+        }
+      });
+    };
+    this.onNavigationClose = (event) => {
+      const { toggleNavigation: toggleNavigation2, isNavigationVisible } = this.props;
+      const className = event.target.getAttribute("class") || "";
+      if (isNavigationVisible) {
+        if (this.navigationButtonRef.current && !this.navigationButtonRef.current.contains(event.target) && className.indexOf && className.indexOf("menu__") === -1 && className.indexOf("multidataset") === -1 && event.composedPath().every((x) => {
+          const pathElementClassName = x.getAttribute?.("class");
+          return !pathElementClassName || pathElementClassName.indexOf("dl-navigation-minimal__popup") === -1;
+        }) || event instanceof KeyboardEvent && event.code === "Escape") {
+          toggleNavigation2(false);
+        }
+      }
+    };
+    this.onSaveDialogFieldEditor = (field) => {
+      if (field.local) {
+        this.updateField({ field });
+      } else {
+        this.createField({ field });
+      }
+      this.closeDialogFieldEditor();
+    };
+    this.onCreateDialogFieldEditor = (field) => {
+      this.createField({ field });
+      this.closeDialogFieldEditor();
+    };
+    this.openDialogField = (item, extra) => {
+      const { dataset, visualization } = this.props;
+      this.props.openDialog({
+        id: DIALOG_FIELD,
+        props: {
+          item,
+          extra,
+          visualization,
+          options: dataset && dataset.options,
+          onCancel: this.closeDialogField,
+          formattingEnabled: false,
+          onApply: this.onDialogFieldApply.bind(null, item),
+          markupTypeEnabled: false
+        }
+      });
+    };
+    this.closeDialogField = () => {
+      this.props.closeDialog();
+    };
+    this.openDialogMultidataset = ({ initedDataset }) => this.props.openDialogMultidataset({
+      onAddDatasetClick: this.onAddDialogMultidatasetClick,
+      onRemoveDatasetClick: this.onRemoveDialogMultidatasetClick,
+      onApply: this.onApplyDialogMultidataset,
+      initedDataset
+    });
+    this.onClickEditDatasetItem = (item) => {
+      if (item.asPseudo) {
+        return;
+      }
+      this.openDialogFieldEditor(item);
+    };
+    this.onClickDuplicateDatasetItem = (item) => {
+      return this.saveAsNewField(item);
+    };
+    this.onClickRemoveDatasetItem = async (item) => {
+      if (!item.local) {
+        return;
+      }
+      return this.removeField({ field: item });
+    };
+    this.onApplyDialogMultidataset = ({ links }) => {
+      const { setLinks: setLinks2, updatePreviewAndClientChartsConfig: updatePreviewAndClientChartsConfig2, closeDialog: closeDialog2 } = this.props;
+      const newLinks = [...links];
+      setLinks2({
+        links: newLinks
+      });
+      updatePreviewAndClientChartsConfig2({});
+      closeDialog2();
+    };
+    this.onAddDialogMultidatasetClick = () => {
+      const { closeDialog: closeDialog2, toggleNavigation: toggleNavigation2 } = this.props;
+      closeDialog2();
+      this.setState({
+        navigationMode: "add"
+      });
+      toggleNavigation2(true);
+    };
+    this.onRemoveDialogMultidatasetClick = (dataset) => {
+      if (confirm(i18n$1("wizard", "toast_confirm-remove-item"))) {
+        this.props.removeDataset({ datasetId: dataset.id });
+      }
+    };
+    this.onSearchInputChange = (value) => {
+      this.setState(
+        {
+          searchPhrase: value
+        },
+        () => {
+          if (this.debouncedApply) {
+            this.debouncedApply.cancel();
+          }
+          const searchPhrase = value.toLowerCase();
+          this.debouncedApply = debounce(() => {
+            this.setState({
+              appliedSearchPhrase: searchPhrase
+            });
+          }, 150);
+          this.debouncedApply();
+        }
+      );
+    };
+    this.handleCreateParameterField = (field) => {
+      const { dataset } = this.props;
+      if (!dataset) {
+        return;
+      }
+      const parameterField = {
+        ...field,
+        datasetId: dataset.id,
+        local: true
+      };
+      this.props.updateDatasetByValidation({
+        dataset,
+        updates: [
+          {
+            action: "add_field",
+            field: parameterField
+          }
+        ]
+      });
+    };
+    this.renderDatasetItem = (props2) => {
+      const datasetItemProps = {
+        dndProps: props2,
+        links: this.props.links,
+        removeHierarchy: this.removeHierarchy,
+        openHierarchyEditor: this.props.openHierarchyEditor,
+        openDialogField: this.openDialogField,
+        onClickEditDatasetItem: this.onClickEditDatasetItem,
+        openDialogMultidataset: this.openDialogMultidataset.bind(null, {}),
+        openDialog: this.props.openDialog,
+        onClickDuplicateDatasetItem: async (item) => {
+          this.setState({
+            datasetItemsLoading: true
+          });
+          await this.onClickDuplicateDatasetItem(item);
+          this.setState({
+            datasetItemsLoading: false
+          });
+        },
+        onClickRemoveDatasetItem: async (item) => {
+          this.setState({
+            datasetItemsLoading: true
+          });
+          await this.onClickRemoveDatasetItem(item);
+          this.setState({
+            datasetItemsLoading: false
+          });
+        }
+      };
+      return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(DatasetItem$1, { ...datasetItemProps }) });
+    };
+    this.renderSections = () => {
+      const { visualization, dlDebugMode } = this.props;
+      let { dimensions, measures } = this.props;
+      const { searchPhrase, appliedSearchPhrase, datasetItemsLoading } = this.state;
+      ({ dimensions, measures } = selectExtendedDimensionsAndMeasures(
+        visualization,
+        dimensions,
+        measures
+      ));
+      if (appliedSearchPhrase) {
+        dimensions = dimensions.filter(
+          (item) => matchDatasetFieldFilter(appliedSearchPhrase, dlDebugMode, {
+            title: item.title,
+            description: item.description,
+            guid: item.guid
+          })
+        );
+        measures = measures.filter(
+          (item) => matchDatasetFieldFilter(appliedSearchPhrase, dlDebugMode, {
+            title: item.title,
+            description: item.description,
+            guid: item.guid
+          })
+        );
+      }
+      const filteredDimensions = dimensions.filter(isFieldVisible);
+      const filteredMeasures = measures.filter(isFieldVisible);
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "dataset-wrapper",
+          "data-qa": SectionDatasetQA.DatasetFields,
+          style: {
+            height: `calc(100% - ${this.state.datasetSelectHeight}px)`
+          },
+          children: [
+            datasetItemsLoading && /* @__PURE__ */ jsx("div", { className: "dataset-veil", children: /* @__PURE__ */ jsx(Loader, { className: "dataset-fields-loader", size: "s" }) }),
+            /* @__PURE__ */ jsx("div", { className: "subcontainer actions-subcontainer", children: /* @__PURE__ */ jsxs("div", { className: "subheader actions-subheader", children: [
+              /* @__PURE__ */ jsx(
+                SearchInput,
+                {
+                  text: searchPhrase,
+                  placeholder: i18n$1("wizard", "field_search"),
+                  onChange: this.onSearchInputChange
+                }
+              ),
+              this.renderAddButton()
+            ] }) }),
+            /* @__PURE__ */ jsxs("div", { className: "subcontainer dimensions-subcontainer", children: [
+              /* @__PURE__ */ jsx("div", { className: "subheader dimensions-subheader", children: /* @__PURE__ */ jsx("span", { children: i18n$1("wizard", "section_dimensions") }) }),
+              /* @__PURE__ */ jsx(
+                DNDContainer,
+                {
+                  id: "dimensions-container",
+                  noRemove: true,
+                  items: filteredDimensions,
+                  allowedTypes: ITEM_TYPES.DIMENSIONS,
+                  wrapTo: this.renderDatasetItem
+                }
+              )
+            ] }),
+            this.getHierarchySubcontainer(),
+            /* @__PURE__ */ jsx(HierarchyEditor2, {}),
+            filteredMeasures.length > 0 && /* @__PURE__ */ jsxs("div", { className: "subcontainer measures-subcontainer", children: [
+              /* @__PURE__ */ jsx("div", { className: "subheader measures-subheader", children: /* @__PURE__ */ jsx("span", { children: i18n$1("wizard", "section_measures") }) }),
+              /* @__PURE__ */ jsx(
+                DNDContainer,
+                {
+                  id: "measures-container",
+                  noRemove: true,
+                  allowedTypes: ITEM_TYPES.MEASURES,
+                  items: filteredMeasures,
+                  wrapTo: this.renderDatasetItem
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx(
+              FieldsContainer,
+              {
+                wrapTo: this.renderDatasetItem,
+                appliedSearchPhrase
+              }
+            )
+          ]
+        }
+      );
+    };
+    this.renderSectionsOrBlank = () => {
+      const { datasetLoading, datasetLoaded, datasetError } = this.props;
+      const { datasetReplacingInProgress } = this.state;
+      if (datasetLoading || datasetReplacingInProgress) {
+        return /* @__PURE__ */ jsx(Loader, { className: "dataset-fields-loader", size: "s" });
+      }
+      if (datasetError) {
+        const { status, details } = Utils.parseErrorResponse(datasetError);
+        const scope = details.scope || "dataset";
+        let datasetErrorText;
+        if (status === 403) {
+          datasetErrorText = DATASET_ERRORS[`403-${scope}`] || DATASET_ERRORS.UNKNOWN;
+        } else {
+          datasetErrorText = DATASET_ERRORS[status] || DATASET_ERRORS.UNKNOWN;
+        }
+        let errorContent;
+        if (datasetErrorText === DATASET_ERRORS["403-dataset"]) {
+          errorContent = /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              qa: SectionDatasetQA.RequestDatasetAccess,
+              onClick: this.onButtonDatasetRequestRightsClick,
+              view: "action",
+              size: "l",
+              children: i18n$1("wizard", "button_access-rights")
+            }
+          ) });
+        } else if (datasetErrorText === DATASET_ERRORS[404]) {
+          errorContent = /* @__PURE__ */ jsx("div", {});
+        } else {
+          errorContent = /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              className: "btn-retry",
+              onClick: this.onButtonDatasetTryAgainClick,
+              view: "action",
+              qa: "wizard-dataset-btn-retry",
+              size: "l",
+              children: i18n$1("wizard", "button_retry")
+            }
+          ) });
+        }
+        return /* @__PURE__ */ jsxs("div", { className: "error", children: [
+          i18n$1("wizard", datasetErrorText),
+          errorContent
+        ] });
+      }
+      return datasetLoaded ? this.renderSections() : this.renderBlank();
+    };
+    this.removeHierarchy = (hierarchy) => {
+      const hierarchies = this.props.hierarchies.filter((el) => el.guid !== hierarchy.guid);
+      this.props.setHierarchies({
+        hierarchies
+      });
+      this.props.updatePreviewAndClientChartsConfig({});
+    };
+    this.getDropdownItems = () => {
+      return [
+        {
+          action: () => {
+            this.openDialogFieldEditor();
+          },
+          text: i18n$1("wizard", "add_field_item"),
+          qa: SectionDatasetQA.CreateFieldButton
+        },
+        {
+          action: () => {
+            this.props.openHierarchyEditor();
+          },
+          text: i18n$1("wizard", "add_hierarchy_item"),
+          qa: SectionDatasetQA.CreateHierarchyButton
+        },
+        {
+          action: () => {
+            this.props.openDialogParameter({
+              type: "create",
+              onApply: this.handleCreateParameterField
+            });
+          },
+          text: i18n$1("wizard", "add_parameter_item"),
+          qa: SectionDatasetQA.CreateParameterButton
+        }
+      ];
+    };
+    this.onDialogFieldApply = (target, { title, cast, aggregation, format, grouping, formatting }) => {
+      let groupingChanged = false;
+      if (target.title !== title) {
+        target.title = title;
+      }
+      if (target.format !== format) {
+        target.format = format;
+      }
+      if (target.cast !== cast) {
+        if (cast === "date") {
+          target.format = AVAILABLE_DATE_FORMATS[2];
+        } else if (cast === "genericdatetime") {
+          target.format = AVAILABLE_DATETIME_FORMATS[5];
+        } else if (cast === "datetimetz") {
+          target.format = AVAILABLE_DATETIMETZ_FORMATS[7];
+        }
+        target.cast = cast;
+        target.data_type = cast;
+      }
+      if (target.aggregation !== aggregation) {
+        target.aggregation = aggregation;
+      }
+      if (target.grouping !== grouping) {
+        groupingChanged = true;
+        target.grouping = grouping;
+      }
+      if (target.formatting !== formatting) {
+        target.formatting = formatting;
+      }
+      if (target.local) {
+        this.updateField({ field: target, groupingChanged });
+      } else {
+        this.saveAsNewField(target);
+      }
+      this.closeDialogField();
+    };
+    this.resizeObserver = new ResizeObserver(this.onDatasetSelectResize);
+    this.state = {
+      fieldEditorLoading: false,
+      fieldEditorIsVisible: false,
+      editingField: void 0,
+      dialogMultidatasetVisible: false,
+      datasetSelectHeight: 0,
+      navigationMode: "",
+      dialogMultidatasetInitedDataset: void 0,
+      searchPhrase: "",
+      appliedSearchPhrase: "",
+      datasetItemsLoading: false
+    };
+  }
+  componentDidMount() {
+    this.resizeObserver.observe(this.navigationButtonRef.current);
+  }
+  componentWillUnmount() {
+    this.resizeObserver.disconnect();
+  }
+  getHierarchySubcontainer() {
+    let { hierarchies } = this.props;
+    const { appliedSearchPhrase } = this.state;
+    if (!hierarchies.length) {
+      return null;
+    }
+    if (appliedSearchPhrase) {
+      hierarchies = hierarchies.filter((item) => {
+        return item.title.toLowerCase().includes(appliedSearchPhrase);
+      });
+    }
+    return /* @__PURE__ */ jsxs("div", { className: "subcontainer hierarchy-subcontainer", children: [
+      /* @__PURE__ */ jsx("div", { className: "subheader hierarchy-subheader", children: /* @__PURE__ */ jsx("span", { children: i18n$1("wizard", "section_hierarchy") }) }),
+      /* @__PURE__ */ jsx(
+        DNDContainer,
+        {
+          id: "hierarchy-container",
+          noRemove: true,
+          items: hierarchies,
+          wrapTo: this.renderDatasetItem
+        }
+      )
+    ] });
+  }
+  renderBlank() {
+    return /* @__PURE__ */ jsx("div", { className: "dataset-blank", "data-qa": SectionDatasetQA.DatasetEmptyMessage, children: i18n$1("wizard", "label_dataset-blank") });
+  }
+  renderAddButton() {
+    return /* @__PURE__ */ jsx(
+      DropdownMenu,
+      {
+        size: "s",
+        switcherWrapperClassName: "add-param-btn-wrapper",
+        renderSwitcher: ({ onClick, onKeyDown }) => /* @__PURE__ */ jsx(
+          Button,
+          {
+            className: "add-param-btn",
+            view: "outlined",
+            size: "m",
+            loading: this.state.fieldEditorLoading,
+            qa: "add-param",
+            onClick,
+            onKeyDown,
+            children: /* @__PURE__ */ jsx(Icon, { data: iconPlus, size: 15 })
+          }
+        ),
+        items: this.getDropdownItems()
+      }
+    );
+  }
+  render() {
+    const {
+      sdk: sdk2,
+      dataset,
+      datasets,
+      datasetApiErrors,
+      datasetLoading,
+      isNavigationVisible,
+      datasetLoaded,
+      widget
+    } = this.props;
+    const workbookId = widget.workbookId;
+    const startFrom = widget?.key.replace(/[^/]+$/, "");
+    const { getPlaceSelectParameters } = registry.common.functions.getAll();
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `datasets-container${!datasetLoaded ? " blank" : ""}`,
+        "data-qa": SectionDatasetQA.DatasetContainer,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "actions-container datasets-actions-container",
+              ref: this.navigationButtonRef,
+              children: datasetLoading ? /* @__PURE__ */ jsx("div", { className: "datasets-actions-loader-wrapper", children: /* @__PURE__ */ jsx(Loader, { className: "dataset-list-loader", size: "s" }) }) : /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+                /* @__PURE__ */ jsx(
+                  DatasetSelect,
+                  {
+                    dataset,
+                    datasets,
+                    datasetApiErrors,
+                    onChange: this.onDatasetChange,
+                    onPreselectClick: this.onPreselectClick,
+                    onOpenDatasetClick: this.onOpenDatasetClick,
+                    onAddDatasetClick: this.onAddDatasetClick,
+                    onReplaceDatasetClick: this.onReplaceDatasetClick,
+                    openDialogMultidataset: this.openDialogMultidataset,
+                    onRemoveDatasetClick: this.onRemoveDatasetClick,
+                    toggleNavigation: this.props.toggleNavigation,
+                    isPopupVisible: this.props.isNavigationVisible
+                  }
+                ),
+                workbookId ? /* @__PURE__ */ jsx(
+                  WorkbookNavigationMinimal,
+                  {
+                    anchor: this.navigationButtonRef,
+                    visible: isNavigationVisible,
+                    onClose: this.onNavigationClose,
+                    onEntryClick: this.onNavigationClick,
+                    workbookId,
+                    scope: EntryScope.Dataset
+                  }
+                ) : /* @__PURE__ */ jsx(
+                  NavigationMinimal_default,
+                  {
+                    sdk: sdk2,
+                    anchor: this.navigationButtonRef,
+                    visible: isNavigationVisible,
+                    onClose: this.onNavigationClose,
+                    onEntryClick: this.onNavigationClick,
+                    clickableScope: "dataset",
+                    scope: "dataset",
+                    startFrom,
+                    ignoreWorkbookEntries: true,
+                    ignoreSharedEntries: true,
+                    placeSelectParameters: getPlaceSelectParameters([
+                      PLACE.ROOT,
+                      PLACE.FAVORITES,
+                      PLACE.DATASETS
+                    ])
+                  }
+                )
+              ] })
+            }
+          ),
+          this.renderSectionsOrBlank()
+        ]
+      }
+    );
+  }
+}
+const mapStateToProps$3 = (state, ownProps) => {
+  const { workbookId } = ownProps;
+  let widget = selectWidget(state);
+  if (widget.fake && workbookId) {
+    widget = {
+      ...widget,
+      workbookId
+    };
+  }
+  return {
+    datasetLoading: selectDatasetLoading(state),
+    datasetLoaded: selectDatasetLoaded(state),
+    isNavigationVisible: selectIsNavigationVisible(state),
+    fields: selectFields(state),
+    dataset: selectDataset(state),
+    datasets: selectDatasets(state),
+    datasetApiErrors: selectDatasetApiErrors(state),
+    links: selectLinks(state),
+    updates: selectUpdates(state),
+    datasetError: selectDatasetError(state),
+    measures: selectMeasures(state),
+    dimensions: selectDimensions(state),
+    visualization: selectVisualization(state),
+    hierarchies: selectHierarchies(state),
+    widget,
+    datasetId: selectDatasetId(state),
+    dlDebugMode: selectDebugMode(state)
+  };
+};
+const mapDispatchToProps$3 = (dispatch) => {
+  return bindActionCreators(
+    {
+      updatePreviewAndClientChartsConfig,
+      fetchDataset,
+      setCurrentDataset,
+      removeDataset,
+      setLinks,
+      toggleNavigation,
+      updateDatasetByValidation,
+      setHierarchies,
+      openHierarchyEditor,
+      openDialog,
+      closeDialog,
+      fetchWidget,
+      openDialogMultidataset,
+      openDialogParameter,
+      setDatasetApiErrors
+    },
+    dispatch
+  );
+};
+const SectionDataset$1 = connect(mapStateToProps$3, mapDispatchToProps$3)(SectionDataset);
+const FORBIDDEN_PARAMS = [
+  // it should not be possible to redefine the type of visualization
+  "_chart_type"
+];
+class SectionPreview extends Component {
+  constructor() {
+    super(...arguments);
+    this.handleLoad = (result) => {
+      const widgetData = result.data?.widgetData || result.data?.widget || result.data?.loadedData;
+      this.props.setHighchartsWidget({
+        // TODO: probably highchartsWidget should be renamed to something like widgetData,
+        // because now the map will be take here
+        // the methods for setting the transparency and visibility of layers
+        highchartsWidget: widgetData
+      });
+    };
+    this.handleInnerParamsChanged = (params) => {
+      if ("drillDownLevel" in params && !isNaN(Number(params.drillDownLevel))) {
+        this.props.setDrillDownLevel({ drillDownLevel: Number(params.drillDownLevel) });
+      }
+    };
+  }
+  shouldComponentUpdate(nextProps) {
+    return shouldComponentUpdateWithDeepComparison({
+      nextProps,
+      currentProps: this.props,
+      deepComparePropKey: "widget"
+    });
+  }
+  getMenuType() {
+    const widgetEntryId = this.props.widget ? this.props.widget.entryId : "";
+    const entryId = this.props.previewEntryId ? this.props.previewEntryId : widgetEntryId;
+    return entryId ? "wizard" : "panePreview";
+  }
+  getCustomMenuOptions() {
+    const { isChartSaved, widget, configForSaving } = this.props;
+    const args = {
+      canBeSaved: !isChartSaved,
+      onApply: async () => {
+        if (configForSaving) {
+          await this.props.updateWizardWidgetAndUpdateConfig({
+            config: configForSaving,
+            entry: widget
+          });
+          this.props.reloadRevisionsOnSave();
+        }
+      }
+    };
+    return {
+      [MenuItemsIds.EXPORT]: {
+        actionWrapper: getCustomExportActionWrapperWithSave.bind(null, {
+          message: i18n$1("wizard", "confirm_chart-save_message"),
+          ...args
+        })
+      },
+      [MenuItemsIds.ALERTS]: {
+        actionWrapper: getCustomExportActionWrapperWithSave.bind(null, {
+          message: i18n$1("wizard", "confirm_chart-save_message_alerts"),
+          ...args
+        })
+      }
+    };
+  }
+  renderChartkit() {
+    const { configType, config, widget, previewEntryId, datasetError, chartKitRef, workbookId } = this.props;
+    const revId = widget?.revId;
+    if (datasetError) {
+      return /* @__PURE__ */ jsx("div", { className: "dataset-error-container", children: /* @__PURE__ */ jsx(
+        PlaceholderIllustration,
+        {
+          title: i18n$1("wizard", "label_preview-dataset-error"),
+          direction: "column",
+          name: "badRequest"
+        }
+      ) });
+    }
+    if (previewEntryId || config && configType) {
+      let editMode;
+      if (config && configType) {
+        editMode = {
+          data: config,
+          type: configType
+        };
+      }
+      const search = getLocation().search;
+      const params = omit(Utils.getParamsFromSearch(search), FORBIDDEN_PARAMS);
+      const { actionParamsEnabled } = Utils.getOptionsFromSearch(search);
+      return /* @__PURE__ */ jsx(
+        ChartWrapper,
+        {
+          usageType: "chart",
+          id: previewEntryId ? previewEntryId : widget ? widget.entryId : "",
+          revId,
+          params,
+          config: editMode,
+          onChartRender: this.handleLoad,
+          menuType: this.getMenuType(),
+          customMenuOptions: this.getCustomMenuOptions(),
+          forwardedRef: chartKitRef,
+          onInnerParamsChanged: this.handleInnerParamsChanged,
+          workbookId,
+          actionParamsEnabled
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx("div", { className: "dataset-stub-container", children: /* @__PURE__ */ jsx(
+      PlaceholderIllustration,
+      {
+        description: i18n$1("wizard", "label_preview-dataset-stub"),
+        name: "template"
+      }
+    ) });
+  }
+  render() {
+    return /* @__PURE__ */ jsx("div", { className: "preview-container", children: /* @__PURE__ */ jsx("div", { className: "preview-chartkit", "data-qa": WizardPageQa.SectionPreview, children: this.renderChartkit() }) });
+  }
+}
+const mapStateToProps$2 = (state) => {
+  return {
+    datasetError: selectDatasetError(state),
+    configType: selectConfigType(state),
+    config: selectConfig(state),
+    configForSaving: selectConfigForSaving(state),
+    widget: selectWidget(state),
+    previewEntryId: selectPreviewEntryId(state),
+    isChartSaved: selectIsChartSaved(state),
+    workbookId: selectWizardWorkbookId(state)
+  };
+};
+const mapDispatchToProps$2 = (dispatch) => {
+  return bindActionCreators(
+    {
+      setHighchartsWidget,
+      openDialogSaveChartConfirm,
+      updateWizardWidgetAndUpdateConfig,
+      reloadRevisionsOnSave,
+      setDrillDownLevel
+    },
+    dispatch
+  );
+};
+const SectionPreview$1 = connect(mapStateToProps$2, mapDispatchToProps$2)(SectionPreview);
+const b$3 = block("wizard-action-panel");
+const useWizardActionPanel = (args) => {
+  const dispatch = useDispatch();
+  const description = useSelector(selectPreviewDescription);
+  const isDescriptionChanged = useSelector(selectIsDescriptionChanged);
+  const {
+    editButtonLoading,
+    handleEditButtonClick,
+    isViewOnlyMode,
+    isFullscreen,
+    canGoBack,
+    canGoForward,
+    canEdit
+  } = args;
+  const onClickGoBack = React__default.useCallback(() => {
+    if (canGoBack) {
+      dispatch(goBack({ unitId: WIZARD_EDIT_HISTORY_UNIT_ID }));
+    }
+  }, [canGoBack, dispatch]);
+  const onClickGoForward = React__default.useCallback(() => {
+    if (canGoForward) {
+      dispatch(goForward({ unitId: WIZARD_EDIT_HISTORY_UNIT_ID }));
+    }
+  }, [canGoForward, dispatch]);
+  const handleApplyDescriptionClick = React__default.useCallback(
+    (text) => {
+      dispatch(setDescription(text));
+    },
+    [dispatch]
+  );
+  const handleEditDescriptionClick = React__default.useCallback(() => {
+    dispatch(
+      updateDialogProps({
+        id: DIALOG_ENTRY_DESCRIPTION,
+        props: {
+          title: i18n$1("wizard", "label_wizard-info"),
+          description: description || "",
+          canEdit: true,
+          isEditMode: true,
+          onApply: handleApplyDescriptionClick,
+          maxLength: MAX_ENTRY_DESCRIPTION_LENGTH
+        }
+      })
+    );
+  }, [description, dispatch, handleApplyDescriptionClick]);
+  const handleDescriptionClick = React__default.useCallback(() => {
+    dispatch(
+      openDialogEntryAnnotationDescription({
+        title: i18n$1("wizard", "label_wizard-info"),
+        description: description || "",
+        canEdit,
+        onEdit: handleEditDescriptionClick,
+        isEditMode: canEdit && (!description || isDescriptionChanged),
+        onApply: handleApplyDescriptionClick
+      })
+    );
+  }, [
+    description,
+    dispatch,
+    handleApplyDescriptionClick,
+    handleEditDescriptionClick,
+    isDescriptionChanged,
+    canEdit
+  ]);
+  useBindHotkey({
+    key: UNDO_HOTKEY,
+    handler: onClickGoBack,
+    options: { scopes: HOTKEYS_SCOPES.WIZARD }
+  });
+  useBindHotkey({
+    key: REDO_HOTKEY,
+    handler: onClickGoForward,
+    options: { scopes: HOTKEYS_SCOPES.WIZARD }
+  });
+  const defaultButtons = React__default.useMemo(() => {
+    const iconFullScreenData = {
+      data: isFullscreen ? ChevronsCollapseUpRight : ChevronsExpandUpRight,
+      size: 16
+    };
+    const items = [
+      {
+        key: "undo",
+        action: onClickGoBack,
+        className: b$3("undo-btn"),
+        icon: { data: ArrowUturnCcwLeft, size: 16 },
+        view: "flat",
+        disabled: !canGoBack,
+        qa: WizardPageQa.UndoButton,
+        title: i18n$1("component.action-panel.view", "button_undo"),
+        hotkey: UNDO_HOTKEY.join("+")
+      },
+      {
+        key: "redo",
+        action: onClickGoForward,
+        className: b$3("redo-btn"),
+        icon: { data: ArrowUturnCwRight, size: 16 },
+        view: "flat",
+        disabled: !canGoForward,
+        qa: WizardPageQa.RedoButton,
+        title: i18n$1("component.action-panel.view", "button_redo"),
+        hotkey: REDO_HOTKEY.join("+")
+      },
+      {
+        key: "fullscreen",
+        action: () => {
+          dispatch(toggleFullscreen());
+        },
+        text: i18n$1("wizard", "button_toggle-fullscreen"),
+        textClassName: b$3("fullscreen-btn-text"),
+        icon: iconFullScreenData,
+        view: "flat"
+      }
+    ];
+    if (canEdit || description) {
+      items.push({
+        key: "description",
+        action: handleDescriptionClick,
+        icon: { data: CircleInfo, size: 16 },
+        view: "flat",
+        className: b$3("description-btn")
+      });
+    }
+    return items;
+  }, [
+    isFullscreen,
+    onClickGoBack,
+    canGoBack,
+    onClickGoForward,
+    canGoForward,
+    canEdit,
+    description,
+    dispatch,
+    handleDescriptionClick
+  ]);
+  const viewOnlyModeButtons = React__default.useMemo(() => {
+    const descriptionButton = description ? [
+      {
+        key: "description",
+        action: handleDescriptionClick,
+        icon: { data: CircleInfo, size: 16 },
+        view: "flat",
+        className: b$3("description-btn")
+      }
+    ] : [];
+    return [
+      ...descriptionButton,
+      {
+        key: "action-panel-edit-button",
+        loading: editButtonLoading,
+        text: i18n$1("wizard", "button_edit-built-in"),
+        action: handleEditButtonClick,
+        view: "action"
+      }
+    ];
+  }, [description, editButtonLoading, handleDescriptionClick, handleEditButtonClick]);
+  return isViewOnlyMode ? viewOnlyModeButtons : defaultButtons;
+};
+const b$2 = block("wizard-action-panel");
+const WizardActionPanel = (props) => {
+  const {
+    dropdownItems,
+    entry,
+    config,
+    configType,
+    onNoRightsDialogCallback,
+    onSaveCallback,
+    onSetActualVersionCallback,
+    onSaveAsNewClick,
+    onSaveAndPublishClick,
+    onSaveAsDraftClick
+  } = props;
+  const dispatch = useDispatch();
+  const [editButtonLoading, setEditButtonLoading] = React__default.useState(false);
+  const isChartSaved = useSelector(selectIsChartSaved);
+  const isViewOnlyMode = useSelector(selectViewOnlyMode);
+  const isFullscreen = useSelector(selectIsFullscreen);
+  const handleEditButtonClick = React__default.useCallback(() => {
+    const successCallback = () => {
+      dispatch(toggleViewOnlyMode());
+      setEditButtonLoading(false);
+    };
+    const failCallback = () => {
+      setEditButtonLoading(false);
+    };
+    setEditButtonLoading(true);
+    dispatch(setEditMode(successCallback, failCallback));
+  }, [dispatch]);
+  const isNewEntryInWorkbook = entry && entry.workbookId && entry.fake;
+  const canEdit = !(entry && entry.permissions && entry.permissions.edit === false);
+  const saveDisabled = !config || !configType || isChartSaved;
+  const saveMoreDisabled = !config || !configType;
+  const isCurrentRevisionActual = entry.revId && entry.revId === entry.publishedId;
+  const isNewChart = entry.fake;
+  const handleSaveCallback = React__default.useCallback(() => {
+    if (isCurrentRevisionActual) {
+      onSaveCallback(EntryUpdateMode.Publish);
+    } else {
+      onSaveCallback(EntryUpdateMode.Save);
+    }
+  }, [isCurrentRevisionActual, onSaveCallback]);
+  const canGoBack = useSelector(
+    (state) => selectCanGoBack(state, { unitId: WIZARD_EDIT_HISTORY_UNIT_ID })
+  );
+  const canGoForward = useSelector(
+    (state) => selectCanGoForward(state, { unitId: WIZARD_EDIT_HISTORY_UNIT_ID })
+  );
+  const additionalButtons = useWizardActionPanel({
+    editButtonLoading,
+    handleEditButtonClick,
+    isViewOnlyMode,
+    isFullscreen,
+    canGoBack,
+    canGoForward,
+    canEdit
+  });
+  const { WizardActionPanelExtension } = registry.wizard.components.getAll();
+  const enablePublish = isEnabledFeature(Feature.EnablePublishEntry) && !entry.fake;
+  return /* @__PURE__ */ jsx(
+    ActionPanel,
+    {
+      entry,
+      enablePublish,
+      rightItems: /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+        /* @__PURE__ */ jsx(WizardActionPanelExtension, {}),
+        /* @__PURE__ */ jsx(
+          ChartSaveControls,
+          {
+            className: b$2("save-controls"),
+            onClickButtonSave: handleSaveCallback,
+            onOpenNoRightsDialog: onNoRightsDialogCallback,
+            dropdownItems: dropdownItems || [],
+            canEdit,
+            isSaveButtonDisabled: !canEdit || saveDisabled,
+            isDropdownDisabled: saveMoreDisabled,
+            isCurrentRevisionActual,
+            hideSaveDropdown: isViewOnlyMode || isNewEntryInWorkbook,
+            hideSaveButton: isViewOnlyMode,
+            additionalControls: additionalButtons,
+            onSaveAndPublishClick,
+            onSaveAsDraftClick,
+            onSaveAsNewClick,
+            isNewChart
+          }
+        )
+      ] }),
+      setActualVersion: onSetActualVersionCallback
+    }
+  );
+};
+const b$1 = block("wizard");
+const SPLIT_PANE_MIN_SIZE = 256;
+const SPLIT_PANE_MAX_SIZE = 512;
+let Wizard$1 = class Wizard extends React__default.Component {
+  constructor(props) {
+    super(props);
+    this.chartKitRef = React__default.createRef();
+    this.unloadConfirmation = (event) => {
+      const { previewHash, widgetHash, initialPreviewHash } = this.props;
+      const widgetChanged = previewHash !== widgetHash && previewHash !== initialPreviewHash;
+      if (widgetChanged) {
+        const message = i18n$1("wizard", "toast_unsaved");
+        (event || window.event).returnValue = message;
+        return message;
+      }
+      return null;
+    };
+    this.openSaveAsWidgetDialog = async (convert = false) => {
+      const {
+        dataset,
+        visualization,
+        extraSettings,
+        defaultPath,
+        widget,
+        configForSaving,
+        description
+      } = this.props;
+      const resultConfig = mapClientConfigToChartsConfig(configForSaving);
+      const data = {
+        ...resultConfig,
+        convert
+      };
+      const path = widget && !widget.fake ? widget.key.replace(/[^/]+$/, "") : defaultPath;
+      const initName = widget && !widget.fake ? i18n$1("wizard", "label_widget-name-copy", {
+        name: Utils.getEntryNameFromKey(widget.key, true)
+      }) : extraSettings?.title || getDefaultChartName({ dataset, visualization });
+      const result = await this.entryDialoguesRef.current.open({
+        dialog: EntryDialogName.CreateWizardChart,
+        dialogProps: {
+          data,
+          initName,
+          initDestination: path,
+          workbookId: widget.workbookId,
+          annotation: {
+            description
+          }
+        }
+      });
+      if (!result || result.status === EntryDialogResolveStatus.Close) {
+        return;
+      }
+      if (result.status === EntryDialogResolveStatus.Success && Boolean(convert)) {
+        getRouter().open({ pathname: `${DL.ENDPOINTS.editor}/${result.data.entryId}` });
+        return;
+      }
+      this.props.receiveWidgetAndPrepareMetadata({
+        ...result,
+        isWidgetWasSaved: true
+      });
+      this.props.resetEditHistoryUnit({
+        unitId: WIZARD_EDIT_HISTORY_UNIT_ID
+      });
+    };
+    this.openSaveWidgetDialog = async (mode) => {
+      const { widget, configForSaving, description } = this.props;
+      if (widget && !widget.fake) {
+        this.props.updateWizardWidget({
+          entry: widget,
+          config: configForSaving,
+          mode,
+          annotation: { description }
+        });
+        this.props.updateClientChartsConfig({
+          isInitialPreview: true,
+          withoutRerender: true
+        });
+        await this.props.reloadRevisionsOnSave(true);
+        this.props.resetEditHistoryUnit({
+          unitId: WIZARD_EDIT_HISTORY_UNIT_ID
+        });
+        this.props.addEditHistoryPoint({
+          newState: this.props.wizardState,
+          unitId: WIZARD_EDIT_HISTORY_UNIT_ID
+        });
+      } else {
+        this.openSaveAsWidgetDialog();
+      }
+    };
+    this.openNoRightsDialog = () => {
+      this.setState({
+        dialogNoRightsVisible: true
+      });
+    };
+    this.openSettingsDialog = () => {
+      this.setState({
+        dialogSettingsVisible: true
+      });
+    };
+    this.openRequestWidgetAccessRightsDialog = () => {
+      const { widget } = this.props;
+      const { entryDialoguesRef } = this;
+      entryDialoguesRef.current.open({
+        dialog: EntryDialogName.Unlock,
+        dialogProps: {
+          entry: {
+            ...widget,
+            entryId: widget.entryId
+          }
+        }
+      });
+    };
+    this.handleSetActualVersion = () => {
+      const { widget } = this.props;
+      const isDraftEntry = isDraftVersion(widget);
+      if (isDraftEntry) {
+        this.props.setActualWizardChart(true);
+      } else {
+        this.props.openDialogSaveDraftChartAsActualConfirm({
+          onApply: () => this.props.setActualWizardChart()
+        });
+      }
+    };
+    this.handleSaveDraftClick = () => {
+      this.openSaveWidgetDialog(EntryUpdateMode.Save);
+    };
+    this.handleSavePublishClick = () => {
+      this.openSaveWidgetDialog(EntryUpdateMode.Publish);
+    };
+    this.handleSplitPaneSizeChange = () => {
+      if (this.chartKitRef.current !== null && typeof this.chartKitRef.current.reflow !== "undefined") {
+        this.chartKitRef.current.reflow();
+      }
+    };
+    this.getErrorInfo = ({ code }) => {
+      switch (code) {
+        case 403:
+        case "no-access":
+          return {
+            type: "no-access",
+            title: i18n$1("wizard", "label_error-widget-no-access")
+          };
+        case 404:
+        case "not-found":
+          return {
+            type: "not-found",
+            title: i18n$1("wizard", "label_error-widget-not-found")
+          };
+        case 500:
+        case "error":
+        default:
+          return {
+            type: "error",
+            title: i18n$1("wizard", "label_error-widget-unknown-error")
+          };
+      }
+    };
+    this.getSaveMenuItems = () => {
+      return [
+        {
+          action: () => this.openSaveAsWidgetDialog(true),
+          text: i18n$1("wizard", "button_save-as-editor-script"),
+          hidden: !isEnabledFeature(Feature.EnableSaveAsEditorScript),
+          qa: ChartSaveControlsQA.SaveAsEditorScript
+        }
+      ];
+    };
+    this.enableWizardScope = () => {
+      this.props.hotkeysContext?.enableScope(HOTKEYS_SCOPES.WIZARD);
+    };
+    this.disableWizardScope = () => {
+      this.props.hotkeysContext?.disableScope(HOTKEYS_SCOPES.WIZARD);
+    };
+    const { isDefaultsSet } = props;
+    if (!isDefaultsSet) {
+      const { extractEntryId } = registry.common.functions.getAll();
+      const entryId = extractEntryId(getLocation().pathname);
+      const revId = getUrlParamFromStr(this.props.location.search, URL_QUERY.REV_ID);
+      const unreleased = isUnreleasedByUrlParams(this.props.location.search);
+      const params = { entryId, unreleased };
+      if (revId) {
+        params.revId = revId;
+      }
+      if (props.match.params.workbookId) {
+        params.routeWorkbookId = props.match.params.workbookId;
+      }
+      this.props.setDefaults(params);
+    }
+    this.entryDialoguesRef = React__default.createRef();
+    this.hotkeysAreaRef = React__default.createRef();
+    this.state = {
+      editButtonLoading: false,
+      dialogNoRightsVisible: false,
+      dialogSettingsVisible: false
+    };
+    this.props.initEditHistoryUnit({
+      unitId: WIZARD_EDIT_HISTORY_UNIT_ID,
+      setState: ({ state }) => {
+        this.props.setWizardStore({
+          store: state
+        });
+      },
+      options: {
+        pathIgnoreList: [
+          "/preview/highchartsWidget",
+          "/preview/filters",
+          "/visualization/layers"
+        ]
+      }
+    });
+  }
+  componentDidMount() {
+    window.addEventListener("beforeunload", this.unloadConfirmation);
+    this.hotkeysAreaRef?.current?.addEventListener("mouseenter", this.enableWizardScope);
+    this.hotkeysAreaRef?.current?.addEventListener("mouseleave", this.disableWizardScope);
+    this.props.hotkeysContext?.enableScope(HOTKEYS_SCOPES.WIZARD);
+  }
+  shouldComponentUpdate(nextProps, nextState) {
+    return shouldComponentUpdateWithDeepComparison({
+      nextProps,
+      currentProps: this.props,
+      deepComparePropKey: "widget"
+    }) || !isEqual(this.state, nextState);
+  }
+  componentDidUpdate(prevProps) {
+    const { match, asideHeaderSize, isFullscreen } = this.props;
+    if ((prevProps.asideHeaderSize !== asideHeaderSize || prevProps.isFullscreen !== isFullscreen) && this.chartKitRef.current !== null && typeof this.chartKitRef.current.reflow !== "undefined") {
+      this.chartKitRef.current.reflow();
+    }
+    const { extractEntryId } = registry.common.functions.getAll();
+    const oldEntryId = extractEntryId(prevProps.match.url);
+    const newEntryId = extractEntryId(match.url);
+    const hasWizardEntryChanged = oldEntryId !== newEntryId;
+    const revId = getUrlParamFromStr(this.props.location.search, URL_QUERY.REV_ID);
+    const prevRevId = getUrlParamFromStr(prevProps.location.search, URL_QUERY.REV_ID);
+    const hasRevisionChanged = revId !== prevRevId;
+    if (hasRevisionChanged && !hasWizardEntryChanged) {
+      const entryId = newEntryId;
+      const params = { entryId };
+      if (revId) {
+        params.revId = revId;
+      }
+      this.props.reloadWizardEntryByRevision(params);
+    }
+    if (hasWizardEntryChanged) {
+      this.props.cleanRevisions();
+      this.props.setRevisionsMode(RevisionsMode.Closed);
+      this.props.resetWizardStore();
+      this.props.resetEditHistoryUnit({
+        unitId: WIZARD_EDIT_HISTORY_UNIT_ID
+      });
+      const entryId = newEntryId;
+      const params = { entryId };
+      if (revId) {
+        const router = getRouter();
+        const search = router.location().params();
+        search.delete(URL_QUERY.REV_ID);
+        search.delete(URL_QUERY.UNRELEASED);
+        router.replace({ search });
+      }
+      this.props.setDefaults(params);
+    }
+  }
+  componentWillUnmount() {
+    window.removeEventListener("beforeunload", this.unloadConfirmation);
+    this.props.resetWizardStore();
+    this.props.resetEditHistoryUnit({
+      unitId: WIZARD_EDIT_HISTORY_UNIT_ID
+    });
+    this.props.hotkeysContext?.disableScope(HOTKEYS_SCOPES.WIZARD);
+    this.hotkeysAreaRef?.current?.removeEventListener("mouseenter", this.enableWizardScope);
+    this.hotkeysAreaRef?.current?.removeEventListener("mouseleave", this.disableWizardScope);
+  }
+  render() {
+    const { widgetError } = this.props;
+    if (widgetError) {
+      return this.renderError();
+    }
+    return this.renderApp();
+  }
+  renderError() {
+    const { widgetError } = this.props;
+    const { type, title } = this.getErrorInfo(widgetError);
+    return /* @__PURE__ */ jsx(ErrorContent, { className: b$1("error-content"), type, title });
+  }
+  renderApp() {
+    const { widget, isFullscreen, isWidgetLoading, config, configType } = this.props;
+    const fullscreen = isFullscreen ? " fullscreen-mode" : "";
+    const hidden = isFullscreen ? " hidden" : "";
+    const { entryDialoguesRef } = this;
+    return /* @__PURE__ */ jsxs("div", { className: `${b$1()}${fullscreen}`, children: [
+      !isWidgetLoading && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          DialogNoRights,
+          {
+            visible: this.state.dialogNoRightsVisible,
+            onClose: () => {
+              this.setState({
+                dialogNoRightsVisible: false
+              });
+            },
+            onAccessRights: () => {
+              this.openRequestWidgetAccessRightsDialog();
+            },
+            onSaveAs: () => {
+              this.openSaveAsWidgetDialog();
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx(EntryDialogues, { ref: entryDialoguesRef }),
+        Boolean(widget) && !widget.fake && /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            SlugifyUrl,
+            {
+              entryId: widget.entryId,
+              name: Utils.getEntryNameFromKey(widget.key)
+            }
+          ),
+          /* @__PURE__ */ jsx(AccessRightsUrlOpen, { history: this.props.history })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: b$1("hotkeyes-area"),
+          ref: this.hotkeysAreaRef,
+          children: [
+            /* @__PURE__ */ jsx(PageTitle, { entry: widget }),
+            /* @__PURE__ */ jsx(
+              WizardActionPanel,
+              {
+                config,
+                configType,
+                entry: widget,
+                onSaveCallback: this.openSaveWidgetDialog,
+                onNoRightsDialogCallback: this.openNoRightsDialog,
+                onSetActualVersionCallback: this.handleSetActualVersion,
+                dropdownItems: this.getSaveMenuItems(),
+                onSaveAsNewClick: this.openSaveAsWidgetDialog,
+                onSaveAsDraftClick: this.handleSaveDraftClick,
+                onSaveAndPublishClick: this.handleSavePublishClick
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { className: b$1("columns"), children: /* @__PURE__ */ jsxs(
+              SplitPane,
+              {
+                resizerClassName: SPLIT_PANE_RESIZER_CLASSNAME,
+                className: "top-pane",
+                split: "vertical",
+                minSize: SPLIT_PANE_MIN_SIZE,
+                maxSize: SPLIT_PANE_MAX_SIZE,
+                onChange: this.handleSplitPaneSizeChange,
+                children: [
+                  /* @__PURE__ */ jsx("div", { className: `column data-column${hidden}`, children: isWidgetLoading ? /* @__PURE__ */ jsx("div", { className: b$1("loader"), children: /* @__PURE__ */ jsx(Loader, { size: "l" }) }) : /* @__PURE__ */ jsx(
+                    SectionDataset$1,
+                    {
+                      workbookId: widget.workbookId,
+                      entryDialoguesRef,
+                      toaster,
+                      sdk
+                    }
+                  ) }),
+                  isWidgetLoading ? /* @__PURE__ */ jsx("div", { className: b$1("loader"), children: /* @__PURE__ */ jsx(Loader, { size: "l" }) }) : /* @__PURE__ */ jsxs(
+                    SplitPane,
+                    {
+                      resizerClassName: SPLIT_PANE_RESIZER_CLASSNAME,
+                      split: "vertical",
+                      minSize: SPLIT_PANE_MIN_SIZE,
+                      maxSize: SPLIT_PANE_MAX_SIZE,
+                      onChange: this.handleSplitPaneSizeChange,
+                      children: [
+                        /* @__PURE__ */ jsx("div", { className: `column visual-column${hidden}`, children: /* @__PURE__ */ jsx(
+                          SectionVisualization,
+                          {
+                            availableVisualizations: getAvailableVisualizations()
+                          }
+                        ) }),
+                        /* @__PURE__ */ jsx("div", { className: "column preview-column", children: /* @__PURE__ */ jsx(SectionPreview$1, { chartKitRef: this.chartKitRef }) })
+                      ]
+                    }
+                  )
+                ]
+              }
+            ) })
+          ]
+        },
+        "wizard-hotkeyes-area"
+      )
+    ] });
+  }
+};
+const mapStateToProps$1 = (state, ownProps) => {
+  const { workbookId } = ownProps.match.params || {};
+  let widget = selectWidget(state);
+  if (widget.fake && workbookId) {
+    widget = {
+      ...widget,
+      workbookId
+    };
+  }
+  return {
+    settings: selectSettings(state),
+    extraSettings: selectExtraSettings(state),
+    config: selectConfig(state),
+    configForSaving: selectConfigForSaving(state),
+    configType: selectConfigType(state),
+    widget,
+    dataset: selectDataset(state),
+    visualization: selectVisualization(state),
+    widgetError: selectWidgetError(state),
+    isFullscreen: selectIsFullscreen(state),
+    isWidgetLoading: selectIsWidgetLoading(state),
+    isDefaultsSet: selectIsDefaultsSet(state),
+    defaultPath: selectDefaultPath(state),
+    widgetHash: selectWidgetHash(state),
+    previewHash: selectPreviewHash(state),
+    previewEntryId: selectPreviewEntryId(state),
+    isParentDashWasChanged: isDraft(state) && isEditMode(state),
+    initialPreviewHash: selectInitialPreviewHash(state),
+    wizardState: state.wizard,
+    description: selectPreviewDescription(state)
+  };
+};
+const mapDispatchToProps$1 = (dispatch) => {
+  return bindActionCreators(
+    {
+      resetWizardStore,
+      setWizardStore,
+      setDefaults,
+      receiveWidgetAndPrepareMetadata,
+      toggleViewOnlyMode,
+      updateClientChartsConfig,
+      setRevisionsMode,
+      cleanRevisions,
+      setActualWizardChart,
+      updateWizardWidget,
+      reloadRevisionsOnSave,
+      reloadWizardEntryByRevision,
+      openDialogSaveDraftChartAsActualConfirm,
+      initEditHistoryUnit,
+      resetEditHistoryUnit,
+      addEditHistoryPoint
+    },
+    dispatch
+  );
+};
+const Wizard$2 = compose(
+  withRouter,
+  connect(mapStateToProps$1, mapDispatchToProps$1)
+)(withErrorPage(withHotkeysContext(Wizard$1)));
+const b = block("wizard-app");
+const App = ({ widget, setCurrentPageEntry: setCurrentPageEntry2, asideHeaderData, ...routeProps }) => {
+  const isAsideHeaderEnabled = getIsAsideHeaderEnabled();
+  useEffectOnce(() => {
+    return () => {
+      setCurrentPageEntry2(null);
+    };
+  });
+  const widgetFake = widget && widget.fake || false;
+  const widgetKey = widget && widget.key || "";
+  const widgetEntryId = widget && widget.entryId || "";
+  React__default.useEffect(() => {
+    if (isAsideHeaderEnabled) {
+      setCurrentPageEntry2(widgetFake ? null : widget);
+    }
+  }, [widgetFake, widgetKey, widgetEntryId, isAsideHeaderEnabled]);
+  return /* @__PURE__ */ jsx("div", { className: b(), children: /* @__PURE__ */ jsx(
+    Wizard$2,
+    {
+      ...routeProps,
+      asideHeaderSize: asideHeaderData.size
+    }
+  ) });
+};
+const mapStateToProps = (state) => {
+  return {
+    asideHeaderData: state.asideHeader.asideHeaderData,
+    widget: selectWidget(state)
+  };
+};
+const mapDispatchToProps = (dispatch) => {
+  return bindActionCreators(
+    {
+      setCurrentPageEntry
+    },
+    dispatch
+  );
+};
+const Wizard2 = connect(mapStateToProps, mapDispatchToProps)(withInaccessibleOnMobile(App));
+reducerRegistry.register({
+  wizard: wizardReducer,
+  dash: dash_default
+});
+export {
+  Wizard2 as default
+};