@devtable/dashboard 1.29.0 → 1.32.0

package/dist/dashboard.es.js

@@ -1,51 +1,24 @@
 var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import React, { createContext, useContext, useReducer } from "react";
+import React from "react";
 import _ from "lodash";
 import RGL, { WidthProvider } from "react-grid-layout";
-import { Box, Group, Button, Modal, Popover, Tooltip, Text, ActionIcon, TextInput, LoadingOverlay, Table, Select, useMantineTheme, ColorSwatch, Switch, Slider, SegmentedControl, NumberInput, ColorInput, Divider, Accordion, JsonInput, AppShell, Tabs, Menu, Container, Textarea } from "@mantine/core";
+import { Popover, Tooltip, Group, Text, ActionIcon, Box, Button, TextInput, LoadingOverlay, Table, Select, useMantineTheme, ColorSwatch, Switch, Slider, SegmentedControl, NumberInput, ColorInput, Divider, Accordion, JsonInput, Modal, AppShell, Tabs, Menu, Container, Textarea } from "@mantine/core";
 import { useRequest } from "ahooks";
 import axios from "axios";
-import { InfoCircle, DeviceFloppy, Refresh, Trash, PlaylistAdd, Settings, Copy, Resize, Paint, PlayerPlay, Database, Recycle, Share } from "tabler-icons-react";
+import { useModals, ModalsProvider } from "@mantine/modals";
+import { InfoCircle, DeviceFloppy, Refresh, Trash, PlaylistAdd, ArrowsMaximize, Settings, Copy, PlayerPlay, Resize, Paint, Database, Recycle, Share, ArrowLeft } from "tabler-icons-react";
 import RichTextEditor, { RichTextEditor as RichTextEditor$1 } from "@mantine/rte";
-import { randomId, useInputState, useElementSize } from "@mantine/hooks";
+import { useInputState, useElementSize, randomId } from "@mantine/hooks";
 import ReactEChartsCore from "echarts-for-react/lib/core";
 import * as echarts from "echarts/core";
 import { SunburstChart, BarChart, LineChart, ScatterChart, PieChart } from "echarts/charts";
 import { CanvasRenderer } from "echarts/renderers";
+import { transform } from "echarts-stat";
 import { GridComponent, LegendComponent, TooltipComponent, VisualMapComponent } from "echarts/components";
 import numbro from "numbro";
 import "echarts-gl";
@@ -110,10 +83,11 @@ const APIClient = {
   baseURL: "http://localhost:31200",
   getRequest(method) {
     return (url, data, options2 = {}) => {
-      const headers = __spreadValues({
+      const headers = {
         "X-Requested-With": "XMLHttpRequest",
-        "Content-Type": options2.string ? "application/x-www-form-urlencoded" : "application/json"
-      }, options2.headers);
+        "Content-Type": options2.string ? "application/x-www-form-urlencoded" : "application/json",
+        ...options2.headers
+      };
       const conf = {
         baseURL: this.baseURL,
         method,
@@ -155,7 +129,7 @@ const queryBySQL = ({ context, definitions, title, query }) => async () => {
 };
 async function listDataSources() {
   try {
-    const res = await APIClient.getRequest("GET")("/datasource/list", {});
+    const res = await APIClient.getRequest("POST")("/datasource/list", {});
     return res;
   } catch (error) {
     console.error(error);
@@ -188,96 +162,23 @@ const initialContext$2 = {
   }
 };
 const PanelContext = React.createContext(initialContext$2);
-const ModalsContext = createContext(null);
-ModalsContext.displayName = "@mantine/modals/ModalsContext";
-function useModals() {
-  const ctx = useContext(ModalsContext);
-  if (!ctx) {
-    throw new Error("[@mantine/modals] useModals hook was called outside of context, wrap your app with ModalsProvider component");
-  }
-  return ctx;
-}
-var __defProp$1 = Object.defineProperty;
-var __defProps$1 = Object.defineProperties;
-var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
-var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
-var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$1.call(b, prop))
-      __defNormalProp$1(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1)
-    for (var prop of __getOwnPropSymbols$1(b)) {
-      if (__propIsEnum$1.call(b, prop))
-        __defNormalProp$1(a, prop, b[prop]);
-    }
-  return a;
+const initialContext$1 = {
+  addPanel: _.noop,
+  duplidatePanel: _.noop,
+  removePanelByID: _.noop,
+  viewPanelInFullScreen: _.noop,
+  inFullScreen: false
 };
-var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
-function ConfirmModal({
-  id,
-  cancelProps,
-  confirmProps,
-  labels = { cancel: "", confirm: "" },
-  closeOnConfirm = true,
-  closeOnCancel = true,
-  groupProps,
-  onCancel,
-  onConfirm,
-  children
-}) {
-  const { cancel: cancelLabel, confirm: confirmLabel } = labels;
-  const ctx = useModals();
-  const handleCancel = (event) => {
-    typeof (cancelProps == null ? void 0 : cancelProps.onClick) === "function" && (cancelProps == null ? void 0 : cancelProps.onClick(event));
-    typeof onCancel === "function" && onCancel();
-    closeOnCancel && ctx.closeModal(id);
-  };
-  const handleConfirm = (event) => {
-    typeof (confirmProps == null ? void 0 : confirmProps.onClick) === "function" && (confirmProps == null ? void 0 : confirmProps.onClick(event));
-    typeof onConfirm === "function" && onConfirm();
-    closeOnConfirm && ctx.closeModal(id);
-  };
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, children && /* @__PURE__ */ React.createElement(Box, {
-    mb: "md"
-  }, children), /* @__PURE__ */ React.createElement(Group, __spreadValues$1({
-    position: "right"
-  }, groupProps), /* @__PURE__ */ React.createElement(Button, __spreadProps$1(__spreadValues$1({
-    variant: "default"
-  }, cancelProps), {
-    onClick: handleCancel
-  }), (cancelProps == null ? void 0 : cancelProps.children) || cancelLabel), /* @__PURE__ */ React.createElement(Button, __spreadProps$1(__spreadValues$1({}, confirmProps), {
-    onClick: handleConfirm
-  }), (confirmProps == null ? void 0 : confirmProps.children) || confirmLabel)));
-}
-function modalsReducer(state, action) {
-  switch (action.type) {
-    case "OPEN": {
-      return {
-        current: action.payload,
-        modals: [...state.modals, action.payload]
-      };
-    }
-    case "CLOSE": {
-      return {
-        current: state.modals[state.modals.length - 2] || null,
-        modals: state.modals.filter((m2) => m2.id !== action.payload)
-      };
-    }
-    case "CLOSE_ALL": {
-      return {
-        current: state.current,
-        modals: []
-      };
-    }
-    default: {
-      return state;
-    }
+const DashboardActionContext = React.createContext(initialContext$1);
+const initialContext = {
+  sqlSnippets: [],
+  setSQLSnippets: () => {
+  },
+  queries: [],
+  setQueries: () => {
   }
-}
-var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
+};
+const DefinitionContext = React.createContext(initialContext);
 var jsxRuntime = { exports: {} };
 var reactJsxRuntime_production_min = {};
 /**
@@ -292,14 +193,14 @@ var reactJsxRuntime_production_min = {};
 var f = React, k = Symbol.for("react.element"), l = Symbol.for("react.fragment"), m = Object.prototype.hasOwnProperty, n = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, p = { key: true, ref: true, __self: true, __source: true };
 function q(c, a, g) {
   var b, d = {}, e = null, h = null;
-  g !== void 0 && (e = "" + g);
-  a.key !== void 0 && (e = "" + a.key);
-  a.ref !== void 0 && (h = a.ref);
+  void 0 !== g && (e = "" + g);
+  void 0 !== a.key && (e = "" + a.key);
+  void 0 !== a.ref && (h = a.ref);
   for (b in a)
     m.call(a, b) && !p.hasOwnProperty(b) && (d[b] = a[b]);
   if (c && c.defaultProps)
     for (b in a = c.defaultProps, a)
-      d[b] === void 0 && (d[b] = a[b]);
+      void 0 === d[b] && (d[b] = a[b]);
   return { $$typeof: k, type: c, key: e, ref: h, props: d, _owner: n.current };
 }
 reactJsxRuntime_production_min.Fragment = l;
@@ -311,240 +212,6 @@ reactJsxRuntime_production_min.jsxs = q;
 const jsx = jsxRuntime.exports.jsx;
 const jsxs = jsxRuntime.exports.jsxs;
 const Fragment = jsxRuntime.exports.Fragment;
-var __defProp2 = Object.defineProperty;
-var __defProps2 = Object.defineProperties;
-var __getOwnPropDescs2 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
-var __hasOwnProp2 = Object.prototype.hasOwnProperty;
-var __propIsEnum2 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues2 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp2.call(b, prop))
-      __defNormalProp2(a, prop, b[prop]);
-  if (__getOwnPropSymbols2)
-    for (var prop of __getOwnPropSymbols2(b)) {
-      if (__propIsEnum2.call(b, prop))
-        __defNormalProp2(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps2 = (a, b) => __defProps2(a, __getOwnPropDescs2(b));
-var __objRest2 = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp2.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols2)
-    for (var prop of __getOwnPropSymbols2(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum2.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-function separateConfirmModalProps(props) {
-  if (!props) {
-    return {
-      confirmProps: {},
-      modalProps: {}
-    };
-  }
-  const _a = props, {
-    id,
-    children,
-    onCancel,
-    onConfirm,
-    closeOnConfirm,
-    closeOnCancel,
-    cancelProps,
-    confirmProps,
-    groupProps,
-    labels
-  } = _a, others = __objRest2(_a, ["id", "children", "onCancel", "onConfirm", "closeOnConfirm", "closeOnCancel", "cancelProps", "confirmProps", "groupProps", "labels"]);
-  return {
-    confirmProps: {
-      id,
-      children,
-      onCancel,
-      onConfirm,
-      closeOnConfirm,
-      closeOnCancel,
-      cancelProps,
-      confirmProps,
-      groupProps,
-      labels
-    },
-    modalProps: __spreadValues2({
-      id
-    }, others)
-  };
-}
-function ModalsProvider({
-  children,
-  modalProps,
-  labels,
-  modals
-}) {
-  const [state, dispatch] = useReducer(modalsReducer, {
-    modals: [],
-    current: null
-  });
-  const closeAll = (canceled) => {
-    state.modals.forEach((modal) => {
-      var _a, _b, _c, _d;
-      if (modal.type === "confirm" && canceled) {
-        (_b = (_a = modal.props) == null ? void 0 : _a.onCancel) == null ? void 0 : _b.call(_a);
-      }
-      (_d = (_c = modal.props) == null ? void 0 : _c.onClose) == null ? void 0 : _d.call(_c);
-    });
-    dispatch({
-      type: "CLOSE_ALL"
-    });
-  };
-  const openModal = (props) => {
-    const id = props.id || randomId();
-    dispatch({
-      type: "OPEN",
-      payload: {
-        id,
-        type: "content",
-        props
-      }
-    });
-    return id;
-  };
-  const openConfirmModal = (props) => {
-    const id = props.id || randomId();
-    dispatch({
-      type: "OPEN",
-      payload: {
-        id,
-        type: "confirm",
-        props
-      }
-    });
-    return id;
-  };
-  const openContextModal = (modal, props) => {
-    const id = props.id || randomId();
-    dispatch({
-      type: "OPEN",
-      payload: {
-        id,
-        type: "context",
-        props,
-        ctx: modal
-      }
-    });
-    return id;
-  };
-  const closeModal = (id, canceled) => {
-    var _a, _b, _c, _d;
-    if (state.modals.length <= 1) {
-      closeAll(canceled);
-      return;
-    }
-    const modal = state.modals.find((item) => item.id === id);
-    if ((modal == null ? void 0 : modal.type) === "confirm" && canceled) {
-      (_b = (_a = modal.props) == null ? void 0 : _a.onCancel) == null ? void 0 : _b.call(_a);
-    }
-    (_d = (_c = modal == null ? void 0 : modal.props) == null ? void 0 : _c.onClose) == null ? void 0 : _d.call(_c);
-    dispatch({
-      type: "CLOSE",
-      payload: modal.id
-    });
-  };
-  const ctx = {
-    modals: state.modals,
-    openModal,
-    openConfirmModal,
-    openContextModal,
-    closeModal,
-    closeAll
-  };
-  const getCurrentModal = () => {
-    var _a;
-    switch ((_a = state.current) == null ? void 0 : _a.type) {
-      case "context": {
-        const _b = state.current.props, {
-          innerProps
-        } = _b, rest = __objRest2(_b, ["innerProps"]);
-        const ContextModal = modals[state.current.ctx];
-        return {
-          modalProps: rest,
-          content: /* @__PURE__ */ jsx(ContextModal, {
-            innerProps,
-            context: ctx,
-            id: state.current.id
-          })
-        };
-      }
-      case "confirm": {
-        const {
-          modalProps: separatedModalProps,
-          confirmProps: separatedConfirmProps
-        } = separateConfirmModalProps(state.current.props);
-        return {
-          modalProps: separatedModalProps,
-          content: /* @__PURE__ */ jsx(ConfirmModal, __spreadValues({}, __spreadProps2(__spreadValues2({}, separatedConfirmProps), {
-            id: state.current.id,
-            labels: state.current.props.labels || labels
-          })))
-        };
-      }
-      case "content": {
-        const _c = state.current.props, {
-          children: currentModalChildren
-        } = _c, rest = __objRest2(_c, ["children"]);
-        return {
-          modalProps: rest,
-          content: /* @__PURE__ */ jsx(Fragment, {
-            children: currentModalChildren
-          })
-        };
-      }
-      default: {
-        return {
-          modalProps: {},
-          content: null
-        };
-      }
-    }
-  };
-  const {
-    modalProps: currentModalProps,
-    content
-  } = getCurrentModal();
-  return /* @__PURE__ */ jsxs(ModalsContext.Provider, {
-    value: ctx,
-    children: [/* @__PURE__ */ jsx(Modal, __spreadProps(__spreadValues({}, __spreadProps2(__spreadValues2(__spreadValues2({}, modalProps), currentModalProps), {
-      opened: state.modals.length > 0,
-      onClose: () => closeModal(state.current.id)
-    })), {
-      children: content
-    })), children]
-  });
-}
-const initialContext$1 = {
-  addPanel: _.noop,
-  duplidatePanel: _.noop,
-  removePanelByID: _.noop
-};
-const DashboardActionContext = React.createContext(initialContext$1);
-const initialContext = {
-  sqlSnippets: [],
-  setSQLSnippets: () => {
-  },
-  queries: [],
-  setQueries: () => {
-  }
-};
-const DefinitionContext = React.createContext(initialContext);
 function DescriptionPopover({
   position = "bottom",
   trigger = "hover"
@@ -958,13 +625,11 @@ function Sunbrust({
   width,
   height
 }) {
-  const _a = conf, {
+  const {
     label_field = "name",
-    value_field = "value"
-  } = _a, restConf = __objRest(_a, [
-    "label_field",
-    "value_field"
-  ]);
+    value_field = "value",
+    ...restConf
+  } = conf;
   const chartData = React.useMemo(() => {
     return data.map((d) => ({
       name: d[label_field],
@@ -972,8 +637,8 @@ function Sunbrust({
     }));
   }, [data, label_field, value_field]);
   const max = React.useMemo(() => {
-    var _a2, _b;
-    return (_b = (_a2 = _.maxBy(chartData, (d) => d.value)) == null ? void 0 : _a2.value) != null ? _b : 1;
+    var _a, _b;
+    return (_b = (_a = _.maxBy(chartData, (d) => d.value)) == null ? void 0 : _a.value) != null ? _b : 1;
   }, [chartData]);
   const labelOption = React.useMemo(() => ({
     series: {
@@ -1004,1269 +669,6 @@ function Sunbrust({
     }
   });
 }
-var ecStat = { exports: {} };
-(function(module, exports) {
-  (function webpackUniversalModuleDefinition(root, factory) {
-    module.exports = factory();
-  })(commonjsGlobal, function() {
-    return function(modules) {
-      var installedModules = {};
-      function __webpack_require__(moduleId) {
-        if (installedModules[moduleId])
-          return installedModules[moduleId].exports;
-        var module2 = installedModules[moduleId] = {
-          exports: {},
-          id: moduleId,
-          loaded: false
-        };
-        modules[moduleId].call(module2.exports, module2, module2.exports, __webpack_require__);
-        module2.loaded = true;
-        return module2.exports;
-      }
-      __webpack_require__.m = modules;
-      __webpack_require__.c = installedModules;
-      __webpack_require__.p = "";
-      return __webpack_require__(0);
-    }([
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          return {
-            clustering: __webpack_require__(1),
-            regression: __webpack_require__(5),
-            statistics: __webpack_require__(6),
-            histogram: __webpack_require__(15),
-            transform: {
-              regression: __webpack_require__(18),
-              histogram: __webpack_require__(21),
-              clustering: __webpack_require__(22)
-            }
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var dataProcess = __webpack_require__(2);
-          var dataPreprocess = dataProcess.dataPreprocess;
-          var normalizeDimensions = dataProcess.normalizeDimensions;
-          var arrayUtil = __webpack_require__(3);
-          var numberUtil = __webpack_require__(4);
-          var arraySize = arrayUtil.size;
-          var sumOfColumn = arrayUtil.sumOfColumn;
-          var arraySum = arrayUtil.sum;
-          var zeros = arrayUtil.zeros;
-          var numberUtil = __webpack_require__(4);
-          var isNumber = numberUtil.isNumber;
-          var mathPow = Math.pow;
-          var OutputType = {
-            SINGLE: "single",
-            MULTIPLE: "multiple"
-          };
-          function kMeans(data, k2, dataMeta) {
-            var clusterAssigned = zeros(data.length, 2);
-            var centroids = createRandCent(k2, calcExtents(data, dataMeta.dimensions));
-            var clusterChanged = true;
-            var minDist;
-            var minIndex;
-            var distIJ;
-            var ptsInClust;
-            while (clusterChanged) {
-              clusterChanged = false;
-              for (var i = 0; i < data.length; i++) {
-                minDist = Infinity;
-                minIndex = -1;
-                for (var j = 0; j < k2; j++) {
-                  distIJ = distEuclid(data[i], centroids[j], dataMeta);
-                  if (distIJ < minDist) {
-                    minDist = distIJ;
-                    minIndex = j;
-                  }
-                }
-                if (clusterAssigned[i][0] !== minIndex) {
-                  clusterChanged = true;
-                }
-                clusterAssigned[i][0] = minIndex;
-                clusterAssigned[i][1] = minDist;
-              }
-              for (var i = 0; i < k2; i++) {
-                ptsInClust = [];
-                for (var j = 0; j < clusterAssigned.length; j++) {
-                  if (clusterAssigned[j][0] === i) {
-                    ptsInClust.push(data[j]);
-                  }
-                }
-                centroids[i] = meanInColumns(ptsInClust, dataMeta);
-              }
-            }
-            var clusterWithKmeans = {
-              centroids,
-              clusterAssigned
-            };
-            return clusterWithKmeans;
-          }
-          function meanInColumns(dataList, dataMeta) {
-            var meanArray = [];
-            var sum;
-            var mean;
-            for (var j = 0; j < dataMeta.dimensions.length; j++) {
-              var dimIdx = dataMeta.dimensions[j];
-              sum = 0;
-              for (var i = 0; i < dataList.length; i++) {
-                sum += dataList[i][dimIdx];
-              }
-              mean = sum / dataList.length;
-              meanArray.push(mean);
-            }
-            return meanArray;
-          }
-          function hierarchicalKMeans(data, clusterCountOrConfig, stepByStep) {
-            var config = (isNumber(clusterCountOrConfig) ? { clusterCount: clusterCountOrConfig, stepByStep } : clusterCountOrConfig) || { clusterCount: 2 };
-            var k2 = config.clusterCount;
-            if (k2 < 2) {
-              return;
-            }
-            var dataMeta = parseDataMeta(data, config);
-            var isOutputTypeSingle = dataMeta.outputType === OutputType.SINGLE;
-            var dataSet = dataPreprocess(data, { dimensions: dataMeta.dimensions });
-            var clusterAssment = zeros(dataSet.length, 2);
-            var outputSingleData;
-            var setClusterIndex;
-            var getClusterIndex;
-            function setDistance(dataIndex, dist2) {
-              clusterAssment[dataIndex][1] = dist2;
-            }
-            function getDistance(dataIndex) {
-              return clusterAssment[dataIndex][1];
-            }
-            if (isOutputTypeSingle) {
-              outputSingleData = [];
-              var outputClusterIndexDimension = dataMeta.outputClusterIndexDimension;
-              setClusterIndex = function(dataIndex, clusterIndex) {
-                outputSingleData[dataIndex][outputClusterIndexDimension] = clusterIndex;
-              };
-              getClusterIndex = function(dataIndex) {
-                return outputSingleData[dataIndex][outputClusterIndexDimension];
-              };
-              for (var i = 0; i < dataSet.length; i++) {
-                outputSingleData.push(dataSet[i].slice());
-                setDistance(i, 0);
-                setClusterIndex(i, 0);
-              }
-            } else {
-              setClusterIndex = function(dataIndex, clusterIndex) {
-                clusterAssment[dataIndex][0] = clusterIndex;
-              };
-              getClusterIndex = function(dataIndex) {
-                return clusterAssment[dataIndex][0];
-              };
-            }
-            var centroid0 = meanInColumns(dataSet, dataMeta);
-            var centList = [centroid0];
-            for (var i = 0; i < dataSet.length; i++) {
-              var dist = distEuclid(dataSet[i], centroid0, dataMeta);
-              setDistance(i, dist);
-            }
-            var lowestSSE;
-            var ptsInClust;
-            var ptsNotClust;
-            var clusterInfo;
-            var sseSplit;
-            var sseNotSplit;
-            var index2 = 1;
-            var result = {
-              data: outputSingleData,
-              centroids: centList,
-              isEnd: false
-            };
-            if (!isOutputTypeSingle) {
-              result.clusterAssment = clusterAssment;
-            }
-            function oneStep() {
-              if (index2 < k2) {
-                lowestSSE = Infinity;
-                var centSplit;
-                var newCentroid;
-                var newClusterAss;
-                for (var j = 0; j < centList.length; j++) {
-                  ptsInClust = [];
-                  ptsNotClust = [];
-                  for (var i2 = 0; i2 < dataSet.length; i2++) {
-                    if (getClusterIndex(i2) === j) {
-                      ptsInClust.push(dataSet[i2]);
-                    } else {
-                      ptsNotClust.push(getDistance(i2));
-                    }
-                  }
-                  clusterInfo = kMeans(ptsInClust, 2, dataMeta);
-                  sseSplit = sumOfColumn(clusterInfo.clusterAssigned, 1);
-                  sseNotSplit = arraySum(ptsNotClust);
-                  if (sseSplit + sseNotSplit < lowestSSE) {
-                    lowestSSE = sseNotSplit + sseSplit;
-                    centSplit = j;
-                    newCentroid = clusterInfo.centroids;
-                    newClusterAss = clusterInfo.clusterAssigned;
-                  }
-                }
-                for (var i2 = 0; i2 < newClusterAss.length; i2++) {
-                  if (newClusterAss[i2][0] === 0) {
-                    newClusterAss[i2][0] = centSplit;
-                  } else if (newClusterAss[i2][0] === 1) {
-                    newClusterAss[i2][0] = centList.length;
-                  }
-                }
-                centList[centSplit] = newCentroid[0];
-                centList.push(newCentroid[1]);
-                for (var i2 = 0, j = 0; i2 < dataSet.length && j < newClusterAss.length; i2++) {
-                  if (getClusterIndex(i2) === centSplit) {
-                    setClusterIndex(i2, newClusterAss[j][0]);
-                    setDistance(i2, newClusterAss[j++][1]);
-                  }
-                }
-                var pointInClust = [];
-                if (!isOutputTypeSingle) {
-                  for (var i2 = 0; i2 < centList.length; i2++) {
-                    pointInClust[i2] = [];
-                    for (var j = 0; j < dataSet.length; j++) {
-                      if (getClusterIndex(j) === i2) {
-                        pointInClust[i2].push(dataSet[j]);
-                      }
-                    }
-                  }
-                  result.pointsInCluster = pointInClust;
-                }
-                index2++;
-              } else {
-                result.isEnd = true;
-              }
-            }
-            if (!config.stepByStep) {
-              while (oneStep(), !result.isEnd)
-                ;
-            } else {
-              result.next = function() {
-                oneStep();
-                setCentroidToResultData(result, dataMeta);
-                return result;
-              };
-            }
-            setCentroidToResultData(result, dataMeta);
-            return result;
-          }
-          function setCentroidToResultData(result, dataMeta) {
-            var outputCentroidDimensions = dataMeta.outputCentroidDimensions;
-            if (dataMeta.outputType !== OutputType.SINGLE || outputCentroidDimensions == null) {
-              return;
-            }
-            var outputSingleData = result.data;
-            var centroids = result.centroids;
-            for (var i = 0; i < outputSingleData.length; i++) {
-              var line = outputSingleData[i];
-              var clusterIndex = line[dataMeta.outputClusterIndexDimension];
-              var centroid = centroids[clusterIndex];
-              var dimLen = Math.min(centroid.length, outputCentroidDimensions.length);
-              for (var j = 0; j < dimLen; j++) {
-                line[outputCentroidDimensions[j]] = centroid[j];
-              }
-            }
-          }
-          function createRandCent(k2, extents) {
-            var centroids = zeros(k2, extents.length);
-            for (var j = 0; j < extents.length; j++) {
-              var extentItem = extents[j];
-              for (var i = 0; i < k2; i++) {
-                centroids[i][j] = extentItem.min + extentItem.span * Math.random();
-              }
-            }
-            return centroids;
-          }
-          function distEuclid(dataItem, centroid, dataMeta) {
-            var powerSum = 0;
-            var dimensions = dataMeta.dimensions;
-            var extents = dataMeta.rawExtents;
-            for (var i = 0; i < dimensions.length; i++) {
-              var span = extents[i].span;
-              if (span) {
-                var dimIdx = dimensions[i];
-                var dist = (dataItem[dimIdx] - centroid[i]) / span;
-                powerSum += mathPow(dist, 2);
-              }
-            }
-            return powerSum;
-          }
-          function parseDataMeta(dataSet, config) {
-            var size = arraySize(dataSet);
-            if (size.length < 1) {
-              throw new Error("The input data of clustering should be two-dimension array.");
-            }
-            var colCount = size[1];
-            var defaultDimensions = [];
-            for (var i = 0; i < colCount; i++) {
-              defaultDimensions.push(i);
-            }
-            var dimensions = normalizeDimensions(config.dimensions, defaultDimensions);
-            var outputType = config.outputType || OutputType.MULTIPLE;
-            var outputClusterIndexDimension = config.outputClusterIndexDimension;
-            if (outputType === OutputType.SINGLE && !numberUtil.isNumber(outputClusterIndexDimension)) {
-              throw new Error("outputClusterIndexDimension is required as a number.");
-            }
-            var extents = calcExtents(dataSet, dimensions);
-            return {
-              dimensions,
-              rawExtents: extents,
-              outputType,
-              outputClusterIndexDimension,
-              outputCentroidDimensions: config.outputCentroidDimensions
-            };
-          }
-          function calcExtents(dataSet, dimensions) {
-            var extents = [];
-            var dimLen = dimensions.length;
-            for (var i = 0; i < dimLen; i++) {
-              extents.push({ min: Infinity, max: -Infinity });
-            }
-            for (var i = 0; i < dataSet.length; i++) {
-              var line = dataSet[i];
-              for (var j = 0; j < dimLen; j++) {
-                var extentItem = extents[j];
-                var val = line[dimensions[j]];
-                extentItem.min > val && (extentItem.min = val);
-                extentItem.max < val && (extentItem.max = val);
-              }
-            }
-            for (var i = 0; i < dimLen; i++) {
-              extents[i].span = extents[i].max - extents[i].min;
-            }
-            return extents;
-          }
-          return {
-            OutputType,
-            hierarchicalKMeans
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var array = __webpack_require__(3);
-          var isArray = array.isArray;
-          var size = array.size;
-          var number2 = __webpack_require__(4);
-          var isNumber = number2.isNumber;
-          function normalizeDimensions(dimensions, defaultDimensions) {
-            return typeof dimensions === "number" ? [dimensions] : dimensions == null ? defaultDimensions : dimensions;
-          }
-          function dataPreprocess(data, opt) {
-            opt = opt || {};
-            var dimensions = opt.dimensions;
-            var numberDimensionMap = {};
-            if (dimensions != null) {
-              for (var i = 0; i < dimensions.length; i++) {
-                numberDimensionMap[dimensions[i]] = true;
-              }
-            }
-            var targetOneDim = opt.toOneDimensionArray ? dimensions ? dimensions[0] : 0 : null;
-            function shouldBeNumberDimension(dimIdx) {
-              return !dimensions || numberDimensionMap.hasOwnProperty(dimIdx);
-            }
-            if (!isArray(data)) {
-              throw new Error("Invalid data type, you should input an array");
-            }
-            var predata = [];
-            var arraySize = size(data);
-            if (arraySize.length === 1) {
-              for (var i = 0; i < arraySize[0]; i++) {
-                var item = data[i];
-                if (isNumber(item)) {
-                  predata.push(item);
-                }
-              }
-            } else if (arraySize.length === 2) {
-              for (var i = 0; i < arraySize[0]; i++) {
-                var isCorrect = true;
-                var item = data[i];
-                for (var j = 0; j < arraySize[1]; j++) {
-                  if (shouldBeNumberDimension(j) && !isNumber(item[j])) {
-                    isCorrect = false;
-                  }
-                }
-                if (isCorrect) {
-                  predata.push(targetOneDim != null ? item[targetOneDim] : item);
-                }
-              }
-            }
-            return predata;
-          }
-          function getPrecision(val) {
-            var str = val.toString();
-            var dotIndex = str.indexOf(".");
-            return dotIndex < 0 ? 0 : str.length - 1 - dotIndex;
-          }
-          return {
-            normalizeDimensions,
-            dataPreprocess,
-            getPrecision
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var objToString = Object.prototype.toString;
-          var arrayProto = Array.prototype;
-          var nativeMap = arrayProto.map;
-          function size(data) {
-            var s = [];
-            while (isArray(data)) {
-              s.push(data.length);
-              data = data[0];
-            }
-            return s;
-          }
-          function isArray(value) {
-            return objToString.call(value) === "[object Array]";
-          }
-          function zeros(m2, n2) {
-            var zeroArray = [];
-            for (var i = 0; i < m2; i++) {
-              zeroArray[i] = [];
-              for (var j = 0; j < n2; j++) {
-                zeroArray[i][j] = 0;
-              }
-            }
-            return zeroArray;
-          }
-          function sum(vector) {
-            var sum2 = 0;
-            for (var i = 0; i < vector.length; i++) {
-              sum2 += vector[i];
-            }
-            return sum2;
-          }
-          function sumOfColumn(dataList, n2) {
-            var sum2 = 0;
-            for (var i = 0; i < dataList.length; i++) {
-              sum2 += dataList[i][n2];
-            }
-            return sum2;
-          }
-          function ascending(a, b) {
-            return a > b ? 1 : a < b ? -1 : a === b ? 0 : NaN;
-          }
-          function bisect(array, value, start, end) {
-            if (start == null) {
-              start = 0;
-            }
-            if (end == null) {
-              end = array.length;
-            }
-            while (start < end) {
-              var mid = Math.floor((start + end) / 2);
-              var compare = ascending(array[mid], value);
-              if (compare > 0) {
-                end = mid;
-              } else if (compare < 0) {
-                start = mid + 1;
-              } else {
-                return mid + 1;
-              }
-            }
-            return start;
-          }
-          function map(obj, cb, context) {
-            if (!(obj && cb)) {
-              return;
-            }
-            if (obj.map && obj.map === nativeMap) {
-              return obj.map(cb, context);
-            } else {
-              var result = [];
-              for (var i = 0, len = obj.length; i < len; i++) {
-                result.push(cb.call(context, obj[i], i, obj));
-              }
-              return result;
-            }
-          }
-          return {
-            size,
-            isArray,
-            zeros,
-            sum,
-            sumOfColumn,
-            ascending,
-            bisect,
-            map
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          function isNumber(value) {
-            value = value === null ? NaN : +value;
-            return typeof value === "number" && !isNaN(value);
-          }
-          function isInteger(value) {
-            return isFinite(value) && value === Math.round(value);
-          }
-          function quantityExponent(val) {
-            if (val === 0) {
-              return 0;
-            }
-            var exp = Math.floor(Math.log(val) / Math.LN10);
-            if (val / Math.pow(10, exp) >= 10) {
-              exp++;
-            }
-            return exp;
-          }
-          return {
-            isNumber,
-            isInteger,
-            quantityExponent
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var dataProcess = __webpack_require__(2);
-          var dataPreprocess = dataProcess.dataPreprocess;
-          var normalizeDimensions = dataProcess.normalizeDimensions;
-          var regreMethods = {
-            linear: function(predata, opt) {
-              var xDimIdx = opt.dimensions[0];
-              var yDimIdx = opt.dimensions[1];
-              var sumX = 0;
-              var sumY = 0;
-              var sumXY = 0;
-              var sumXX = 0;
-              var len = predata.length;
-              for (var i = 0; i < len; i++) {
-                var rawItem = predata[i];
-                sumX += rawItem[xDimIdx];
-                sumY += rawItem[yDimIdx];
-                sumXY += rawItem[xDimIdx] * rawItem[yDimIdx];
-                sumXX += rawItem[xDimIdx] * rawItem[xDimIdx];
-              }
-              var gradient = (len * sumXY - sumX * sumY) / (len * sumXX - sumX * sumX);
-              var intercept = sumY / len - gradient * sumX / len;
-              var result = [];
-              for (var j = 0; j < predata.length; j++) {
-                var rawItem = predata[j];
-                var resultItem = rawItem.slice();
-                resultItem[xDimIdx] = rawItem[xDimIdx];
-                resultItem[yDimIdx] = gradient * rawItem[xDimIdx] + intercept;
-                result.push(resultItem);
-              }
-              var expression = "y = " + Math.round(gradient * 100) / 100 + "x + " + Math.round(intercept * 100) / 100;
-              return {
-                points: result,
-                parameter: {
-                  gradient,
-                  intercept
-                },
-                expression
-              };
-            },
-            linearThroughOrigin: function(predata, opt) {
-              var xDimIdx = opt.dimensions[0];
-              var yDimIdx = opt.dimensions[1];
-              var sumXX = 0;
-              var sumXY = 0;
-              for (var i = 0; i < predata.length; i++) {
-                var rawItem = predata[i];
-                sumXX += rawItem[xDimIdx] * rawItem[xDimIdx];
-                sumXY += rawItem[xDimIdx] * rawItem[yDimIdx];
-              }
-              var gradient = sumXY / sumXX;
-              var result = [];
-              for (var j = 0; j < predata.length; j++) {
-                var rawItem = predata[j];
-                var resultItem = rawItem.slice();
-                resultItem[xDimIdx] = rawItem[xDimIdx];
-                resultItem[yDimIdx] = rawItem[xDimIdx] * gradient;
-                result.push(resultItem);
-              }
-              var expression = "y = " + Math.round(gradient * 100) / 100 + "x";
-              return {
-                points: result,
-                parameter: {
-                  gradient
-                },
-                expression
-              };
-            },
-            exponential: function(predata, opt) {
-              var xDimIdx = opt.dimensions[0];
-              var yDimIdx = opt.dimensions[1];
-              var sumX = 0;
-              var sumY = 0;
-              var sumXXY = 0;
-              var sumYlny = 0;
-              var sumXYlny = 0;
-              var sumXY = 0;
-              for (var i = 0; i < predata.length; i++) {
-                var rawItem = predata[i];
-                sumX += rawItem[xDimIdx];
-                sumY += rawItem[yDimIdx];
-                sumXY += rawItem[xDimIdx] * rawItem[yDimIdx];
-                sumXXY += rawItem[xDimIdx] * rawItem[xDimIdx] * rawItem[yDimIdx];
-                sumYlny += rawItem[yDimIdx] * Math.log(rawItem[yDimIdx]);
-                sumXYlny += rawItem[xDimIdx] * rawItem[yDimIdx] * Math.log(rawItem[yDimIdx]);
-              }
-              var denominator = sumY * sumXXY - sumXY * sumXY;
-              var coefficient = Math.pow(Math.E, (sumXXY * sumYlny - sumXY * sumXYlny) / denominator);
-              var index2 = (sumY * sumXYlny - sumXY * sumYlny) / denominator;
-              var result = [];
-              for (var j = 0; j < predata.length; j++) {
-                var rawItem = predata[j];
-                var resultItem = rawItem.slice();
-                resultItem[xDimIdx] = rawItem[xDimIdx];
-                resultItem[yDimIdx] = coefficient * Math.pow(Math.E, index2 * rawItem[xDimIdx]);
-                result.push(resultItem);
-              }
-              var expression = "y = " + Math.round(coefficient * 100) / 100 + "e^(" + Math.round(index2 * 100) / 100 + "x)";
-              return {
-                points: result,
-                parameter: {
-                  coefficient,
-                  index: index2
-                },
-                expression
-              };
-            },
-            logarithmic: function(predata, opt) {
-              var xDimIdx = opt.dimensions[0];
-              var yDimIdx = opt.dimensions[1];
-              var sumlnx = 0;
-              var sumYlnx = 0;
-              var sumY = 0;
-              var sumlnxlnx = 0;
-              for (var i = 0; i < predata.length; i++) {
-                var rawItem = predata[i];
-                sumlnx += Math.log(rawItem[xDimIdx]);
-                sumYlnx += rawItem[yDimIdx] * Math.log(rawItem[xDimIdx]);
-                sumY += rawItem[yDimIdx];
-                sumlnxlnx += Math.pow(Math.log(rawItem[xDimIdx]), 2);
-              }
-              var gradient = (i * sumYlnx - sumY * sumlnx) / (i * sumlnxlnx - sumlnx * sumlnx);
-              var intercept = (sumY - gradient * sumlnx) / i;
-              var result = [];
-              for (var j = 0; j < predata.length; j++) {
-                var rawItem = predata[j];
-                var resultItem = rawItem.slice();
-                resultItem[xDimIdx] = rawItem[xDimIdx];
-                resultItem[yDimIdx] = gradient * Math.log(rawItem[xDimIdx]) + intercept;
-                result.push(resultItem);
-              }
-              var expression = "y = " + Math.round(intercept * 100) / 100 + " + " + Math.round(gradient * 100) / 100 + "ln(x)";
-              return {
-                points: result,
-                parameter: {
-                  gradient,
-                  intercept
-                },
-                expression
-              };
-            },
-            polynomial: function(predata, opt) {
-              var xDimIdx = opt.dimensions[0];
-              var yDimIdx = opt.dimensions[1];
-              var order = opt.order;
-              if (order == null) {
-                order = 2;
-              }
-              var coeMatrix = [];
-              var lhs = [];
-              var k2 = order + 1;
-              for (var i = 0; i < k2; i++) {
-                var sumA = 0;
-                for (var n2 = 0; n2 < predata.length; n2++) {
-                  var rawItem = predata[n2];
-                  sumA += rawItem[yDimIdx] * Math.pow(rawItem[xDimIdx], i);
-                }
-                lhs.push(sumA);
-                var temp = [];
-                for (var j = 0; j < k2; j++) {
-                  var sumB = 0;
-                  for (var m2 = 0; m2 < predata.length; m2++) {
-                    sumB += Math.pow(predata[m2][xDimIdx], i + j);
-                  }
-                  temp.push(sumB);
-                }
-                coeMatrix.push(temp);
-              }
-              coeMatrix.push(lhs);
-              var coeArray = gaussianElimination(coeMatrix, k2);
-              var result = [];
-              for (var i = 0; i < predata.length; i++) {
-                var value = 0;
-                var rawItem = predata[i];
-                for (var n2 = 0; n2 < coeArray.length; n2++) {
-                  value += coeArray[n2] * Math.pow(rawItem[xDimIdx], n2);
-                }
-                var resultItem = rawItem.slice();
-                resultItem[xDimIdx] = rawItem[xDimIdx];
-                resultItem[yDimIdx] = value;
-                result.push(resultItem);
-              }
-              var expression = "y = ";
-              for (var i = coeArray.length - 1; i >= 0; i--) {
-                if (i > 1) {
-                  expression += Math.round(coeArray[i] * Math.pow(10, i + 1)) / Math.pow(10, i + 1) + "x^" + i + " + ";
-                } else if (i === 1) {
-                  expression += Math.round(coeArray[i] * 100) / 100 + "x + ";
-                } else {
-                  expression += Math.round(coeArray[i] * 100) / 100;
-                }
-              }
-              return {
-                points: result,
-                parameter: coeArray,
-                expression
-              };
-            }
-          };
-          function gaussianElimination(matrix, number2) {
-            for (var i = 0; i < matrix.length - 1; i++) {
-              var maxColumn = i;
-              for (var j = i + 1; j < matrix.length - 1; j++) {
-                if (Math.abs(matrix[i][j]) > Math.abs(matrix[i][maxColumn])) {
-                  maxColumn = j;
-                }
-              }
-              for (var k2 = i; k2 < matrix.length; k2++) {
-                var temp = matrix[k2][i];
-                matrix[k2][i] = matrix[k2][maxColumn];
-                matrix[k2][maxColumn] = temp;
-              }
-              for (var n2 = i + 1; n2 < matrix.length - 1; n2++) {
-                for (var m2 = matrix.length - 1; m2 >= i; m2--) {
-                  matrix[m2][n2] -= matrix[m2][i] / matrix[i][i] * matrix[i][n2];
-                }
-              }
-            }
-            var data = new Array(number2);
-            var len = matrix.length - 1;
-            for (var j = matrix.length - 2; j >= 0; j--) {
-              var temp = 0;
-              for (var i = j + 1; i < matrix.length - 1; i++) {
-                temp += matrix[i][j] * data[i];
-              }
-              data[j] = (matrix[len][j] - temp) / matrix[j][j];
-            }
-            return data;
-          }
-          var regression = function(regreMethod, data, optOrOrder) {
-            var opt = typeof optOrOrder === "number" ? { order: optOrOrder } : optOrOrder || {};
-            var dimensions = normalizeDimensions(opt.dimensions, [0, 1]);
-            var predata = dataPreprocess(data, { dimensions });
-            var result = regreMethods[regreMethod](predata, {
-              order: opt.order,
-              dimensions
-            });
-            var xDimIdx = dimensions[0];
-            result.points.sort(function(itemA, itemB) {
-              return itemA[xDimIdx] - itemB[xDimIdx];
-            });
-            return result;
-          };
-          return regression;
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var statistics = {};
-          statistics.max = __webpack_require__(7);
-          statistics.deviation = __webpack_require__(8);
-          statistics.mean = __webpack_require__(10);
-          statistics.median = __webpack_require__(12);
-          statistics.min = __webpack_require__(14);
-          statistics.quantile = __webpack_require__(13);
-          statistics.sampleVariance = __webpack_require__(9);
-          statistics.sum = __webpack_require__(11);
-          return statistics;
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var number2 = __webpack_require__(4);
-          var isNumber = number2.isNumber;
-          function max(data) {
-            var maxData = -Infinity;
-            for (var i = 0; i < data.length; i++) {
-              if (isNumber(data[i]) && data[i] > maxData) {
-                maxData = data[i];
-              }
-            }
-            return maxData;
-          }
-          return max;
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var variance = __webpack_require__(9);
-          return function(data) {
-            var squaredDeviation = variance(data);
-            return squaredDeviation ? Math.sqrt(squaredDeviation) : squaredDeviation;
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var number2 = __webpack_require__(4);
-          var isNumber = number2.isNumber;
-          var mean = __webpack_require__(10);
-          function sampleVariance(data) {
-            var len = data.length;
-            if (!len || len < 2) {
-              return 0;
-            }
-            if (data.length >= 2) {
-              var meanValue = mean(data);
-              var sum = 0;
-              var temple;
-              for (var i = 0; i < data.length; i++) {
-                if (isNumber(data[i])) {
-                  temple = data[i] - meanValue;
-                  sum += temple * temple;
-                }
-              }
-              return sum / (data.length - 1);
-            }
-          }
-          return sampleVariance;
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var sum = __webpack_require__(11);
-          function mean(data) {
-            var len = data.length;
-            if (!len) {
-              return 0;
-            }
-            return sum(data) / data.length;
-          }
-          return mean;
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var number2 = __webpack_require__(4);
-          var isNumber = number2.isNumber;
-          function sum(data) {
-            var len = data.length;
-            if (!len) {
-              return 0;
-            }
-            var sumData = 0;
-            for (var i = 0; i < len; i++) {
-              if (isNumber(data[i])) {
-                sumData += data[i];
-              }
-            }
-            return sumData;
-          }
-          return sum;
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var quantile = __webpack_require__(13);
-          function median2(data) {
-            return quantile(data, 0.5);
-          }
-          return median2;
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          return function(data, p2) {
-            var len = data.length;
-            if (!len) {
-              return 0;
-            }
-            if (p2 <= 0 || len < 2) {
-              return data[0];
-            }
-            if (p2 >= 1) {
-              return data[len - 1];
-            }
-            var h = (len - 1) * p2;
-            var i = Math.floor(h);
-            var a = data[i];
-            var b = data[i + 1];
-            return a + (b - a) * (h - i);
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var number2 = __webpack_require__(4);
-          var isNumber = number2.isNumber;
-          function min(data) {
-            var minData = Infinity;
-            for (var i = 0; i < data.length; i++) {
-              if (isNumber(data[i]) && data[i] < minData) {
-                minData = data[i];
-              }
-            }
-            return minData;
-          }
-          return min;
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var max = __webpack_require__(7);
-          var min = __webpack_require__(14);
-          var quantile = __webpack_require__(13);
-          var deviation = __webpack_require__(8);
-          var dataProcess = __webpack_require__(2);
-          var dataPreprocess = dataProcess.dataPreprocess;
-          var normalizeDimensions = dataProcess.normalizeDimensions;
-          var array = __webpack_require__(3);
-          var ascending = array.ascending;
-          var map = array.map;
-          var range = __webpack_require__(16);
-          var bisect = array.bisect;
-          var tickStep = __webpack_require__(17);
-          function computeBins(data, optOrMethod) {
-            var opt = typeof optOrMethod === "string" ? { method: optOrMethod } : optOrMethod || {};
-            var threshold = opt.method == null ? thresholdMethod.squareRoot : thresholdMethod[opt.method];
-            var dimensions = normalizeDimensions(opt.dimensions);
-            var values = dataPreprocess(data, {
-              dimensions,
-              toOneDimensionArray: true
-            });
-            var maxValue = max(values);
-            var minValue = min(values);
-            var binsNumber = threshold(values, minValue, maxValue);
-            var tickStepResult = tickStep(minValue, maxValue, binsNumber);
-            var step = tickStepResult.step;
-            var toFixedPrecision = tickStepResult.toFixedPrecision;
-            var rangeArray = range(+(Math.ceil(minValue / step) * step).toFixed(toFixedPrecision), +(Math.floor(maxValue / step) * step).toFixed(toFixedPrecision), step, toFixedPrecision);
-            var len = rangeArray.length;
-            var bins = new Array(len + 1);
-            for (var i = 0; i <= len; i++) {
-              bins[i] = {};
-              bins[i].sample = [];
-              bins[i].x0 = i > 0 ? rangeArray[i - 1] : rangeArray[i] - minValue === step ? minValue : rangeArray[i] - step;
-              bins[i].x1 = i < len ? rangeArray[i] : maxValue - rangeArray[i - 1] === step ? maxValue : rangeArray[i - 1] + step;
-            }
-            for (var i = 0; i < values.length; i++) {
-              if (minValue <= values[i] && values[i] <= maxValue) {
-                bins[bisect(rangeArray, values[i], 0, len)].sample.push(values[i]);
-              }
-            }
-            var data = map(bins, function(bin) {
-              return [
-                +((bin.x0 + bin.x1) / 2).toFixed(toFixedPrecision),
-                bin.sample.length,
-                bin.x0,
-                bin.x1,
-                bin.x0 + " - " + bin.x1
-              ];
-            });
-            var customData = map(bins, function(bin) {
-              return [bin.x0, bin.x1, bin.sample.length];
-            });
-            return {
-              bins,
-              data,
-              customData
-            };
-          }
-          var thresholdMethod = {
-            squareRoot: function(data) {
-              var bins = Math.ceil(Math.sqrt(data.length));
-              return bins > 50 ? 50 : bins;
-            },
-            scott: function(data, min2, max2) {
-              return Math.ceil((max2 - min2) / (3.5 * deviation(data) * Math.pow(data.length, -1 / 3)));
-            },
-            freedmanDiaconis: function(data, min2, max2) {
-              data.sort(ascending);
-              return Math.ceil((max2 - min2) / (2 * (quantile(data, 0.75) - quantile(data, 0.25)) * Math.pow(data.length, -1 / 3)));
-            },
-            sturges: function(data) {
-              return Math.ceil(Math.log(data.length) / Math.LN2) + 1;
-            }
-          };
-          return computeBins;
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var dataProcess = __webpack_require__(2);
-          var getPrecision = dataProcess.getPrecision;
-          return function(start, end, step, precision) {
-            var len = arguments.length;
-            if (len < 2) {
-              end = start;
-              start = 0;
-              step = 1;
-            } else if (len < 3) {
-              step = 1;
-            } else if (len < 4) {
-              step = +step;
-              precision = getPrecision(step);
-            } else {
-              precision = +precision;
-            }
-            var n2 = Math.ceil(((end - start) / step).toFixed(precision));
-            var range = new Array(n2 + 1);
-            for (var i = 0; i < n2 + 1; i++) {
-              range[i] = +(start + i * step).toFixed(precision);
-            }
-            return range;
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var numberUtil = __webpack_require__(4);
-          return function(start, stop, count) {
-            var step0 = Math.abs(stop - start) / count;
-            var precision = numberUtil.quantityExponent(step0);
-            var step1 = Math.pow(10, precision);
-            var error = step0 / step1;
-            if (error >= Math.sqrt(50)) {
-              step1 *= 10;
-            } else if (error >= Math.sqrt(10)) {
-              step1 *= 5;
-            } else if (error >= Math.sqrt(2)) {
-              step1 *= 2;
-            }
-            var toFixedPrecision = precision < 0 ? -precision : 0;
-            var resultStep = +(stop >= start ? step1 : -step1).toFixed(toFixedPrecision);
-            return {
-              step: resultStep,
-              toFixedPrecision
-            };
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var regression = __webpack_require__(5);
-          var transformHelper = __webpack_require__(19);
-          var FORMULA_DIMENSION = 2;
-          return {
-            type: "ecStat:regression",
-            transform: function transform(params) {
-              var upstream = params.upstream;
-              var config = params.config || {};
-              var method = config.method || "linear";
-              var result = regression(method, upstream.cloneRawData(), {
-                order: config.order,
-                dimensions: transformHelper.normalizeExistingDimensions(params, config.dimensions)
-              });
-              var points = result.points;
-              var formulaOn = config.formulaOn;
-              if (formulaOn == null) {
-                formulaOn = "end";
-              }
-              var dimensions;
-              if (formulaOn !== "none") {
-                for (var i = 0; i < points.length; i++) {
-                  points[i][FORMULA_DIMENSION] = formulaOn === "start" && i === 0 || formulaOn === "all" || formulaOn === "end" && i === points.length - 1 ? result.expression : "";
-                }
-                dimensions = upstream.cloneAllDimensionInfo();
-                dimensions[FORMULA_DIMENSION] = {};
-              }
-              return [{
-                dimensions,
-                data: points
-              }];
-            }
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var arrayUtil = __webpack_require__(3);
-          var numberUtil = __webpack_require__(4);
-          var objectUtil = __webpack_require__(20);
-          function normalizeExistingDimensions(transformParams, dimensionsConfig) {
-            if (dimensionsConfig == null) {
-              return;
-            }
-            var upstream = transformParams.upstream;
-            if (arrayUtil.isArray(dimensionsConfig)) {
-              var result = [];
-              for (var i = 0; i < dimensionsConfig.length; i++) {
-                var dimInfo = upstream.getDimensionInfo(dimensionsConfig[i]);
-                validateDimensionExists(dimInfo, dimensionsConfig[i]);
-                result[i] = dimInfo.index;
-              }
-              return result;
-            } else {
-              var dimInfo = upstream.getDimensionInfo(dimensionsConfig);
-              validateDimensionExists(dimInfo, dimensionsConfig);
-              return dimInfo.index;
-            }
-            function validateDimensionExists(dimInfo2, dimConfig) {
-              if (!dimInfo2) {
-                throw new Error("Can not find dimension by " + dimConfig);
-              }
-            }
-          }
-          function normalizeNewDimensions(dimensionsConfig) {
-            if (arrayUtil.isArray(dimensionsConfig)) {
-              var names = [];
-              var indices = [];
-              for (var i = 0; i < dimensionsConfig.length; i++) {
-                var item = parseDimensionNewItem(dimensionsConfig[i]);
-                names.push(item.name);
-                indices.push(item.index);
-              }
-              return { name: names, index: indices };
-            } else if (dimensionsConfig != null) {
-              return parseDimensionNewItem(dimensionsConfig);
-            }
-            function parseDimensionNewItem(dimConfig) {
-              if (numberUtil.isNumber(dimConfig)) {
-                return { index: dimConfig };
-              } else if (objectUtil.isObject(dimConfig) && numberUtil.isNumber(dimConfig.index)) {
-                return dimConfig;
-              }
-              throw new Error("Illegle new dimensions config. Expect `{ name: string, index: number }`.");
-            }
-          }
-          return {
-            normalizeExistingDimensions,
-            normalizeNewDimensions
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          function extend(target, source) {
-            if (Object.assign) {
-              Object.assign(target, source);
-            } else {
-              for (var key in source) {
-                if (source.hasOwnProperty(key)) {
-                  target[key] = source[key];
-                }
-              }
-            }
-            return target;
-          }
-          function isObject(value) {
-            const type = typeof value;
-            return type === "function" || !!value && type === "object";
-          }
-          return {
-            extend,
-            isObject
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var histogram = __webpack_require__(15);
-          var transformHelper = __webpack_require__(19);
-          return {
-            type: "ecStat:histogram",
-            transform: function transform(params) {
-              var upstream = params.upstream;
-              var config = params.config || {};
-              var result = histogram(upstream.cloneRawData(), {
-                method: config.method,
-                dimensions: transformHelper.normalizeExistingDimensions(params, config.dimensions)
-              });
-              return [{
-                dimensions: ["MeanOfV0V1", "VCount", "V0", "V1", "DisplayableName"],
-                data: result.data
-              }, {
-                data: result.customData
-              }];
-            }
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      },
-      function(module2, exports2, __webpack_require__) {
-        var __WEBPACK_AMD_DEFINE_RESULT__;
-        !(__WEBPACK_AMD_DEFINE_RESULT__ = function(require2) {
-          var clustering = __webpack_require__(1);
-          var numberUtil = __webpack_require__(4);
-          var transformHelper = __webpack_require__(19);
-          var isNumber = numberUtil.isNumber;
-          return {
-            type: "ecStat:clustering",
-            transform: function transform(params) {
-              var upstream = params.upstream;
-              var config = params.config || {};
-              var clusterCount = config.clusterCount;
-              if (!isNumber(clusterCount) || clusterCount <= 0) {
-                throw new Error('config param "clusterCount" need to be specified as an interger greater than 1.');
-              }
-              if (clusterCount === 1) {
-                return [{}, {
-                  data: []
-                }];
-              }
-              var outputClusterIndexDimension = transformHelper.normalizeNewDimensions(config.outputClusterIndexDimension);
-              var outputCentroidDimensions = transformHelper.normalizeNewDimensions(config.outputCentroidDimensions);
-              if (outputClusterIndexDimension == null) {
-                throw new Error("outputClusterIndexDimension is required as a number.");
-              }
-              var result = clustering.hierarchicalKMeans(upstream.cloneRawData(), {
-                clusterCount,
-                stepByStep: false,
-                dimensions: transformHelper.normalizeExistingDimensions(params, config.dimensions),
-                outputType: clustering.OutputType.SINGLE,
-                outputClusterIndexDimension: outputClusterIndexDimension.index,
-                outputCentroidDimensions: (outputCentroidDimensions || {}).index
-              });
-              var sourceDimAll = upstream.cloneAllDimensionInfo();
-              var resultDimsDef = [];
-              for (var i = 0; i < sourceDimAll.length; i++) {
-                var sourceDimItem = sourceDimAll[i];
-                resultDimsDef.push(sourceDimItem.name);
-              }
-              resultDimsDef[outputClusterIndexDimension.index] = outputClusterIndexDimension.name;
-              if (outputCentroidDimensions) {
-                for (var i = 0; i < outputCentroidDimensions.index.length; i++) {
-                  if (outputCentroidDimensions.name[i] != null) {
-                    resultDimsDef[outputCentroidDimensions.index[i]] = outputCentroidDimensions.name[i];
-                  }
-                }
-              }
-              return [{
-                dimensions: resultDimsDef,
-                data: result.data
-              }, {
-                data: result.centroids
-              }];
-            }
-          };
-        }.call(exports2, __webpack_require__, exports2, module2), __WEBPACK_AMD_DEFINE_RESULT__ !== void 0 && (module2.exports = __WEBPACK_AMD_DEFINE_RESULT__));
-      }
-    ]);
-  });
-})(ecStat);
-var echartsStat = ecStat.exports;
 function getRegressionConfs({ regressions = [] }, data) {
   const regressionDataSets = [];
   const regressionSeries = [];
@@ -2274,7 +676,7 @@ function getRegressionConfs({ regressions = [] }, data) {
   if (data.length === 0) {
     return { regressionDataSets, regressionSeries, regressionXAxes };
   }
-  regressions.forEach(({ transform, plot, name, y_axis_data_key }) => {
+  regressions.forEach(({ transform: transform2, plot, name, y_axis_data_key }) => {
     const xAxisId = `x-axis-for-${name}`;
     const rawDatasetId = `dataset-for-${name}--raw`;
     const regDatasetId = `dataset-for-${name}--transformed`;
@@ -2283,11 +685,12 @@ function getRegressionConfs({ regressions = [] }, data) {
       source: data.map((d, i) => [i, d[y_axis_data_key]])
     });
     regressionDataSets.push({
-      transform,
+      transform: transform2,
       id: regDatasetId,
       fromDatasetId: rawDatasetId
     });
-    regressionSeries.push(__spreadProps(__spreadValues({}, plot), {
+    regressionSeries.push({
+      ...plot,
       name,
       datasetId: regDatasetId,
       xAxisId,
@@ -2295,7 +698,7 @@ function getRegressionConfs({ regressions = [] }, data) {
       tooltip: {
         show: false
       }
-    }));
+    });
     regressionXAxes.push({
       type: "category",
       id: xAxisId,
@@ -2331,7 +734,7 @@ const defaultOption$1 = {
   }
 };
 function getOption(conf, data) {
-  var _c;
+  var _a;
   const labelFormatters = conf.y_axes.reduce((ret, { label_formatter }, index2) => {
     ret[index2] = function formatter(payload) {
       const value = typeof payload === "object" ? payload.value : payload;
@@ -2353,9 +756,8 @@ function getOption(conf, data) {
     ret[name] = yAxisIndex;
     return ret;
   }, {});
-  const series = conf.series.map((_a) => {
-    var _b = _a, { y_axis_data_key, yAxisIndex, label_position, name } = _b, rest = __objRest(_b, ["y_axis_data_key", "yAxisIndex", "label_position", "name"]);
-    const ret = __spreadValues({
+  const series = conf.series.map(({ y_axis_data_key, yAxisIndex, label_position, name, ...rest }) => {
+    const ret = {
       data: data.map((d) => d[y_axis_data_key]),
       label: {
         show: !!label_position,
@@ -2364,8 +766,9 @@ function getOption(conf, data) {
       },
       name,
       xAxisId: "main-x-axis",
-      yAxisIndex
-    }, rest);
+      yAxisIndex,
+      ...rest
+    };
     return ret;
   });
   const { regressionDataSets, regressionSeries, regressionXAxes } = getRegressionConfs(conf, data);
@@ -2373,20 +776,20 @@ function getOption(conf, data) {
     xAxis: [
       {
         data: data.map((d) => d[conf.x_axis_data_key]),
-        name: (_c = conf.x_axis_name) != null ? _c : "",
+        name: (_a = conf.x_axis_name) != null ? _a : "",
         id: "main-x-axis"
       },
       ...regressionXAxes
     ],
-    yAxis: conf.y_axes.map((_d, index2) => {
-      var _e = _d, { label_formatter } = _e, rest = __objRest(_e, ["label_formatter"]);
-      var _a;
-      return __spreadProps(__spreadValues({}, rest), {
+    yAxis: conf.y_axes.map(({ label_formatter, ...rest }, index2) => {
+      var _a2;
+      return {
+        ...rest,
         axisLabel: {
           show: true,
-          formatter: (_a = labelFormatters[index2]) != null ? _a : labelFormatters.default
+          formatter: (_a2 = labelFormatters[index2]) != null ? _a2 : labelFormatters.default
         }
-      });
+      };
     }),
     dataset: [
       ...regressionDataSets
@@ -2402,12 +805,12 @@ function getOption(conf, data) {
           return "";
         }
         const lines = arr.map(({ seriesName, value }) => {
-          var _a;
+          var _a2;
           if (!seriesName) {
             return value;
           }
           const yAxisIndex = yAxisIndexMap[seriesName];
-          const formatter = (_a = labelFormatters[yAxisIndex]) != null ? _a : labelFormatters.default;
+          const formatter = (_a2 = labelFormatters[yAxisIndex]) != null ? _a2 : labelFormatters.default;
           return `${seriesName}: ${formatter({ value })}`;
         });
         lines.unshift(`<strong>${arr[0].name}</strong>`);
@@ -2900,7 +1303,7 @@ function templateToJSX(template, variables, data) {
   });
 }
 echarts.use([BarChart, LineChart, ScatterChart, GridComponent, LegendComponent, TooltipComponent, CanvasRenderer]);
-echarts.registerTransform(echartsStat.transform.regression);
+echarts.registerTransform(transform.regression);
 function templateNotEmpty(str) {
   return str.trim().length > 0;
 }
@@ -3048,15 +1451,12 @@ function VizTable({
   width,
   height
 }) {
-  const _a = conf, {
+  const {
     id_field,
     use_raw_columns,
-    columns
-  } = _a, rest = __objRest(_a, [
-    "id_field",
-    "use_raw_columns",
-    "columns"
-  ]);
+    columns,
+    ...rest
+  } = conf;
   const labels = React.useMemo(() => {
     if (use_raw_columns) {
       return Object.keys(data == null ? void 0 : data[0]);
@@ -3073,11 +1473,11 @@ function VizTable({
     }
     return columns;
   }, [use_raw_columns, columns, data]);
-  return /* @__PURE__ */ jsxs(Table, __spreadProps(__spreadValues({
+  return /* @__PURE__ */ jsxs(Table, {
     sx: {
       maxHeight: height
-    }
-  }, rest), {
+    },
+    ...rest,
     children: [/* @__PURE__ */ jsx("thead", {
       children: /* @__PURE__ */ jsx("tr", {
         children: labels.map((label) => /* @__PURE__ */ jsx("th", {
@@ -3116,12 +1516,13 @@ function VizTable({
         })
       })
     })]
-  }));
+  });
 }
 function interpolateString(template, params = {}) {
-  const extendedParams = __spreadProps(__spreadValues({}, params), {
+  const extendedParams = {
+    ...params,
     numbro
-  });
+  };
   const names = Object.keys(extendedParams);
   const vals = Object.values(extendedParams);
   try {
@@ -3137,21 +1538,17 @@ function VizText({
   data
 }) {
   return /* @__PURE__ */ jsx(Fragment, {
-    children: paragraphs.map((_a, index2) => {
-      var _b = _a, {
-        template,
-        size
-      } = _b, rest = __objRest(_b, [
-        "template",
-        "size"
-      ]);
-      return /* @__PURE__ */ jsx(Text, __spreadProps(__spreadValues({}, rest), {
-        sx: {
-          fontSize: size
-        },
-        children: interpolateString(template, data[0])
-      }), `${template}---${index2}`);
-    })
+    children: paragraphs.map(({
+      template,
+      size,
+      ...rest
+    }, index2) => /* @__PURE__ */ jsx(Text, {
+      ...rest,
+      sx: {
+        fontSize: size
+      },
+      children: interpolateString(template, data[0])
+    }, `${template}---${index2}`))
   });
 }
 echarts.use([GridComponent, VisualMapComponent, LegendComponent, TooltipComponent, CanvasRenderer]);
@@ -3161,22 +1558,19 @@ function VizBar3D({
   width,
   height
 }) {
-  const _a = conf, {
+  const {
     x_axis_data_key,
     y_axis_data_key,
-    z_axis_data_key
-  } = _a, restConf = __objRest(_a, [
-    "x_axis_data_key",
-    "y_axis_data_key",
-    "z_axis_data_key"
-  ]);
+    z_axis_data_key,
+    ...restConf
+  } = conf;
   const min = React.useMemo(() => {
     return _.minBy(data, (d) => d[z_axis_data_key])[z_axis_data_key];
   }, [data, z_axis_data_key]);
   const max = React.useMemo(() => {
     return _.maxBy(data, (d) => d[z_axis_data_key])[z_axis_data_key];
   }, [data, z_axis_data_key]);
-  const option = __spreadProps(__spreadValues({
+  const option = {
     tooltip: {},
     backgroundColor: "#fff",
     visualMap: {
@@ -3209,14 +1603,14 @@ function VizBar3D({
           intensity: 1.5
         }
       }
-    }
-  }, restConf), {
+    },
+    ...restConf,
     series: [{
       type: "bar3D",
       wireframe: {},
       data: data.map((d) => [d[x_axis_data_key], d[y_axis_data_key], d[z_axis_data_key]])
     }]
-  });
+  };
   return /* @__PURE__ */ jsx(ReactEChartsCore, {
     echarts,
     option,
@@ -3267,13 +1661,11 @@ function VizPie({
   width,
   height
 }) {
-  const _a = conf, {
+  const {
     label_field = "name",
-    value_field = "value"
-  } = _a, restConf = __objRest(_a, [
-    "label_field",
-    "value_field"
-  ]);
+    value_field = "value",
+    ...restConf
+  } = conf;
   const chartData = React.useMemo(() => {
     return data.map((d) => ({
       name: d[label_field],
@@ -3350,21 +1742,37 @@ function renderViz(width, height, data, viz) {
   };
   switch (viz.type) {
     case "sunburst":
-      return /* @__PURE__ */ jsx(Sunbrust, __spreadValues({}, props));
+      return /* @__PURE__ */ jsx(Sunbrust, {
+        ...props
+      });
     case "cartesian":
-      return /* @__PURE__ */ jsx(VizCartesianChart, __spreadValues({}, props));
+      return /* @__PURE__ */ jsx(VizCartesianChart, {
+        ...props
+      });
     case "table":
-      return /* @__PURE__ */ jsx(VizTable, __spreadValues({}, props));
+      return /* @__PURE__ */ jsx(VizTable, {
+        ...props
+      });
     case "text":
-      return /* @__PURE__ */ jsx(VizText, __spreadValues({}, props));
+      return /* @__PURE__ */ jsx(VizText, {
+        ...props
+      });
     case "stats":
-      return /* @__PURE__ */ jsx(VizStats, __spreadValues({}, props));
+      return /* @__PURE__ */ jsx(VizStats, {
+        ...props
+      });
     case "rich-text":
-      return /* @__PURE__ */ jsx(VizRichText, __spreadValues({}, props));
+      return /* @__PURE__ */ jsx(VizRichText, {
+        ...props
+      });
     case "bar-3d":
-      return /* @__PURE__ */ jsx(VizBar3D, __spreadValues({}, props));
+      return /* @__PURE__ */ jsx(VizBar3D, {
+        ...props
+      });
     case "pie":
-      return /* @__PURE__ */ jsx(VizPie, __spreadValues({}, props));
+      return /* @__PURE__ */ jsx(VizPie, {
+        ...props
+      });
     default:
       return null;
   }
@@ -3505,23 +1913,25 @@ function VizBar3DPanel({
           control,
           render: ({
             field
-          }) => /* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+          }) => /* @__PURE__ */ jsx(DataFieldSelector, {
             label: "Data Field",
             required: true,
-            data
-          }, field))
+            data,
+            ...field
+          })
         }), /* @__PURE__ */ jsx(Controller, {
           name: "xAxis3D.name",
           control,
           render: ({
             field
-          }) => /* @__PURE__ */ jsx(TextInput, __spreadValues({
+          }) => /* @__PURE__ */ jsx(TextInput, {
             sx: {
               flexGrow: 1
             },
             size: "md",
-            label: "Name"
-          }, field))
+            label: "Name",
+            ...field
+          })
         })]
       }), /* @__PURE__ */ jsx(Text, {
         mt: "lg",
@@ -3539,23 +1949,25 @@ function VizBar3DPanel({
           control,
           render: ({
             field
-          }) => /* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+          }) => /* @__PURE__ */ jsx(DataFieldSelector, {
             label: "Data Field",
             required: true,
-            data
-          }, field))
+            data,
+            ...field
+          })
         }), /* @__PURE__ */ jsx(Controller, {
           name: "yAxis3D.name",
           control,
           render: ({
             field
-          }) => /* @__PURE__ */ jsx(TextInput, __spreadValues({
+          }) => /* @__PURE__ */ jsx(TextInput, {
             sx: {
               flexGrow: 1
             },
             size: "md",
-            label: "Name"
-          }, field))
+            label: "Name",
+            ...field
+          })
         })]
       }), /* @__PURE__ */ jsx(Text, {
         mt: "lg",
@@ -3573,23 +1985,25 @@ function VizBar3DPanel({
           control,
           render: ({
             field
-          }) => /* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+          }) => /* @__PURE__ */ jsx(DataFieldSelector, {
             label: "Data Field",
             required: true,
-            data
-          }, field))
+            data,
+            ...field
+          })
         }), /* @__PURE__ */ jsx(Controller, {
           name: "zAxis3D.name",
           control,
           render: ({
             field
-          }) => /* @__PURE__ */ jsx(TextInput, __spreadValues({
+          }) => /* @__PURE__ */ jsx(TextInput, {
             sx: {
               flexGrow: 1
             },
             size: "md",
-            label: "Name"
-          }, field))
+            label: "Name",
+            ...field
+          })
         })]
       }), /* @__PURE__ */ jsx(Group, {
         position: "center",
@@ -3679,24 +2093,26 @@ function BarFields({
       control,
       render: ({
         field
-      }) => /* @__PURE__ */ jsx(TextInput, __spreadValues({
+      }) => /* @__PURE__ */ jsx(TextInput, {
         label: "Stack",
         placeholder: "Stack bars by this ID",
         sx: {
           flexGrow: 1
-        }
-      }, field))
+        },
+        ...field
+      })
     }), /* @__PURE__ */ jsx(Controller, {
       name: `series.${index2}.barWidth`,
       control,
       render: ({
         field
-      }) => /* @__PURE__ */ jsx(TextInput, __spreadValues({
+      }) => /* @__PURE__ */ jsx(TextInput, {
         label: "Bar Width",
         sx: {
           flexGrow: 1
-        }
-      }, field))
+        },
+        ...field
+      })
     })]
   });
 }
@@ -3726,20 +2142,20 @@ function LineFields({
       control,
       render: ({
         field
-      }) => /* @__PURE__ */ jsx(Select, __spreadProps(__spreadValues({
+      }) => /* @__PURE__ */ jsx(Select, {
         label: "Step",
         data: stepOptions,
         sx: {
           flexGrow: 1,
           maxWidth: "48%"
-        }
-      }, field), {
+        },
+        ...field,
         value: String(field.value),
         onChange: (v) => {
           const step = v === "false" ? false : v;
           field.onChange(step);
         }
-      }))
+      })
     }), /* @__PURE__ */ jsx(Controller, {
       name: `series.${index2}.smooth`,
       control,
@@ -3786,15 +2202,15 @@ function ScatterFields({
         children: [/* @__PURE__ */ jsx(Text, {
           size: "sm",
           children: "Size"
-        }), /* @__PURE__ */ jsx(Slider, __spreadProps(__spreadValues({
+        }), /* @__PURE__ */ jsx(Slider, {
           min: 1,
           max: 10,
-          marks: symbolSizeOptions
-        }, field), {
+          marks: symbolSizeOptions,
+          ...field,
           sx: {
             width: "100%"
           }
-        }))]
+        })]
       })
     })
   });
@@ -3870,7 +2286,7 @@ function SeriesItemField({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(SegmentedControl, __spreadValues({
+        }) => /* @__PURE__ */ jsx(SegmentedControl, {
           data: [{
             label: "Line",
             value: "line"
@@ -3884,21 +2300,23 @@ function SeriesItemField({
             label: "Boxplot",
             value: "boxplot",
             disabled: true
-          }]
-        }, field))
+          }],
+          ...field
+        })
       })
     }), /* @__PURE__ */ jsx(Controller, {
       name: `series.${index2}.name`,
       control,
       render: ({
         field
-      }) => /* @__PURE__ */ jsx(TextInput, __spreadValues({
+      }) => /* @__PURE__ */ jsx(TextInput, {
         label: "Name",
         required: true,
         sx: {
           flex: 1
-        }
-      }, field))
+        },
+        ...field
+      })
     }), /* @__PURE__ */ jsxs(Group, {
       direction: "row",
       grow: true,
@@ -3908,34 +2326,32 @@ function SeriesItemField({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+        }) => /* @__PURE__ */ jsx(DataFieldSelector, {
           label: "Value Field",
           required: true,
           data,
           sx: {
             flex: 1
-          }
-        }, field))
+          },
+          ...field
+        })
       }), /* @__PURE__ */ jsx(Controller, {
         name: `series.${index2}.yAxisIndex`,
         control,
-        render: (_a) => {
-          var {
-            field: _b
-          } = _a, _c = _b, {
+        render: ({
+          field: {
             value,
-            onChange
-          } = _c, rest = __objRest(_c, [
-            "value",
-            "onChange"
-          ]);
-          var _a2;
-          return /* @__PURE__ */ jsx(Select, __spreadProps(__spreadValues({
+            onChange,
+            ...rest
+          }
+        }) => {
+          var _a;
+          return /* @__PURE__ */ jsx(Select, {
             label: "Y Axis",
             data: yAxisOptions,
-            disabled: yAxisOptions.length === 0
-          }, rest), {
-            value: (_a2 = value == null ? void 0 : value.toString()) != null ? _a2 : "",
+            disabled: yAxisOptions.length === 0,
+            ...rest,
+            value: (_a = value == null ? void 0 : value.toString()) != null ? _a : "",
             onChange: (value2) => {
               if (!value2) {
                 onChange(0);
@@ -3946,7 +2362,7 @@ function SeriesItemField({
             sx: {
               flex: 1
             }
-          }));
+          });
         }
       })]
     }), type === "line" && /* @__PURE__ */ jsx(LineFields, {
@@ -3963,10 +2379,11 @@ function SeriesItemField({
       control,
       render: ({
         field
-      }) => /* @__PURE__ */ jsx(Select, __spreadValues({
+      }) => /* @__PURE__ */ jsx(Select, {
         label: "Label Position",
-        data: labelPositions
-      }, field))
+        data: labelPositions,
+        ...field
+      })
     }), /* @__PURE__ */ jsxs(Group, {
       direction: "column",
       grow: true,
@@ -3979,7 +2396,9 @@ function SeriesItemField({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(MantineColorSelector, __spreadValues({}, field))
+        }) => /* @__PURE__ */ jsx(MantineColorSelector, {
+          ...field
+        })
       })]
     }), /* @__PURE__ */ jsx(ActionIcon, {
       color: "red",
@@ -4012,7 +2431,10 @@ function SeriesField({
   });
   const watchFieldArray = watch("series");
   const controlledFields = fields.map((field, index2) => {
-    return __spreadValues(__spreadValues({}, field), watchFieldArray[index2]);
+    return {
+      ...field,
+      ...watchFieldArray[index2]
+    };
   });
   const addSeries = () => append({
     type: "bar",
@@ -4064,21 +2486,24 @@ function _NumbroFormatSelector({
   onChange
 }, ref) {
   const changeOutput = (output) => {
-    onChange(__spreadProps(__spreadValues({}, value), {
+    onChange({
+      ...value,
       output
-    }));
+    });
   };
   const changeMantissa = (mantissa) => {
     const trimMantissa = mantissa === 0 ? false : value.trimMantissa;
-    onChange(__spreadProps(__spreadValues({}, value), {
+    onChange({
+      ...value,
       mantissa,
       trimMantissa
-    }));
+    });
   };
   const changeTrimMantissa = (event) => {
-    onChange(__spreadProps(__spreadValues({}, value), {
+    onChange({
+      ...value,
       trimMantissa: event.currentTarget.checked
-    }));
+    });
   };
   return /* @__PURE__ */ jsx(Group, {
     direction: "column",
@@ -4141,13 +2566,14 @@ function YAxisField({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(TextInput, __spreadValues({
+        }) => /* @__PURE__ */ jsx(TextInput, {
           label: "Name",
           required: true,
           sx: {
             flex: 1
-          }
-        }, field))
+          },
+          ...field
+        })
       })
     }), /* @__PURE__ */ jsx(Group, {
       direction: "column",
@@ -4158,7 +2584,9 @@ function YAxisField({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(NumbroFormatSelector, __spreadValues({}, field))
+        }) => /* @__PURE__ */ jsx(NumbroFormatSelector, {
+          ...field
+        })
       })
     }), /* @__PURE__ */ jsx(ActionIcon, {
       color: "red",
@@ -4190,7 +2618,10 @@ function YAxesField({
   });
   const watchFieldArray = watch("y_axes");
   const controlledFields = fields.map((field, index2) => {
-    return __spreadValues(__spreadValues({}, field), watchFieldArray[index2]);
+    return {
+      ...field,
+      ...watchFieldArray[index2]
+    };
   });
   const addYAxis = () => append({
     name: "",
@@ -4250,13 +2681,14 @@ function RegressionField({
       control,
       render: ({
         field
-      }) => /* @__PURE__ */ jsx(TextInput, __spreadValues({
+      }) => /* @__PURE__ */ jsx(TextInput, {
         label: "Name",
         required: true,
         sx: {
           flex: 1
-        }
-      }, field))
+        },
+        ...field
+      })
     }), /* @__PURE__ */ jsxs(Group, {
       direction: "row",
       grow: true,
@@ -4266,34 +2698,32 @@ function RegressionField({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+        }) => /* @__PURE__ */ jsx(DataFieldSelector, {
           label: "Value Field",
           required: true,
           data,
           sx: {
             flex: 1
-          }
-        }, field))
+          },
+          ...field
+        })
       }), /* @__PURE__ */ jsx(Controller, {
         name: `regressions.${index2}.plot.yAxisIndex`,
         control,
-        render: (_a) => {
-          var {
-            field: _b
-          } = _a, _c = _b, {
+        render: ({
+          field: {
             value,
-            onChange
-          } = _c, rest = __objRest(_c, [
-            "value",
-            "onChange"
-          ]);
-          var _a2;
-          return /* @__PURE__ */ jsx(Select, __spreadProps(__spreadValues({
+            onChange,
+            ...rest
+          }
+        }) => {
+          var _a;
+          return /* @__PURE__ */ jsx(Select, {
             label: "Y Axis",
             data: yAxisOptions,
-            disabled: yAxisOptions.length === 0
-          }, rest), {
-            value: (_a2 = value == null ? void 0 : value.toString()) != null ? _a2 : "",
+            disabled: yAxisOptions.length === 0,
+            ...rest,
+            value: (_a = value == null ? void 0 : value.toString()) != null ? _a : "",
             onChange: (value2) => {
               if (!value2) {
                 onChange(0);
@@ -4304,7 +2734,7 @@ function RegressionField({
             sx: {
               flex: 1
             }
-          }));
+          });
         }
       })]
     }), /* @__PURE__ */ jsxs(Group, {
@@ -4316,24 +2746,26 @@ function RegressionField({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(Select, __spreadValues({
+        }) => /* @__PURE__ */ jsx(Select, {
           label: "Method",
           data: regressionOptions,
           sx: {
             flex: 1
-          }
-        }, field))
+          },
+          ...field
+        })
       }), method === "polynomial" && /* @__PURE__ */ jsx(Controller, {
         name: `regressions.${index2}.transform.config.order`,
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(NumberInput, __spreadValues({
+        }) => /* @__PURE__ */ jsx(NumberInput, {
           label: "Order",
           sx: {
             flex: 1
-          }
-        }, field))
+          },
+          ...field
+        })
       })]
     }), /* @__PURE__ */ jsxs(Group, {
       direction: "column",
@@ -4347,7 +2779,9 @@ function RegressionField({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(MantineColorSelector, __spreadValues({}, field))
+        }) => /* @__PURE__ */ jsx(MantineColorSelector, {
+          ...field
+        })
       })]
     }), /* @__PURE__ */ jsx(ActionIcon, {
       color: "red",
@@ -4380,7 +2814,10 @@ function RegressionsField({
   });
   const watchFieldArray = watch("regressions");
   const controlledFields = fields.map((field, index2) => {
-    return __spreadValues(__spreadValues({}, field), watchFieldArray[index2]);
+    return {
+      ...field,
+      ...watchFieldArray[index2]
+    };
   });
   const yAxisOptions = React.useMemo(() => {
     return getValues().y_axes.map(({
@@ -4669,19 +3106,17 @@ function getANewVariable() {
     }
   };
 }
-const TemplateInput = React.forwardRef(function TemplateInput2(_a, ref) {
-  var _b = _a, {
-    value,
-    onChange
-  } = _b, rest = __objRest(_b, [
-    "value",
-    "onChange"
-  ]);
-  return /* @__PURE__ */ jsx(TextInput, __spreadValues({
+const TemplateInput = React.forwardRef(function TemplateInput2({
+  value,
+  onChange,
+  ...rest
+}, ref) {
+  return /* @__PURE__ */ jsx(TextInput, {
     ref,
     value,
-    onChange
-  }, rest));
+    onChange,
+    ...rest
+  });
 });
 function TemplateVariableField({
   value,
@@ -4815,9 +3250,10 @@ function VariableField$1({
       control,
       render: ({
         field
-      }) => /* @__PURE__ */ jsx(TemplateVariableField, __spreadValues({
-        data
-      }, field))
+      }) => /* @__PURE__ */ jsx(TemplateVariableField, {
+        data,
+        ...field
+      })
     }), /* @__PURE__ */ jsx(ActionIcon, {
       color: "red",
       variant: "hover",
@@ -4849,7 +3285,10 @@ function StatsField({
   watch("stats.templates");
   const watchFieldArray = watch("stats.variables");
   const controlledFields = fields.map((field, index2) => {
-    return __spreadValues(__spreadValues({}, field), watchFieldArray[index2]);
+    return {
+      ...field,
+      ...watchFieldArray[index2]
+    };
   });
   const add = () => append(getANewVariable());
   return /* @__PURE__ */ jsxs(Group, {
@@ -4865,25 +3304,27 @@ function StatsField({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(TemplateInput, __spreadValues({
+        }) => /* @__PURE__ */ jsx(TemplateInput, {
           label: "Template for stats above the chart",
           py: "md",
           sx: {
             flexGrow: 1
-          }
-        }, field))
+          },
+          ...field
+        })
       }), /* @__PURE__ */ jsx(Controller, {
         name: "stats.templates.bottom",
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(TemplateInput, __spreadValues({
+        }) => /* @__PURE__ */ jsx(TemplateInput, {
           label: "Template for stats under the chart",
           py: "md",
           sx: {
             flexGrow: 1
-          }
-        }, field))
+          },
+          ...field
+        })
       })]
     }), controlledFields.map((_variableItem, index2) => /* @__PURE__ */ jsx(VariableField$1, {
       control,
@@ -4949,30 +3390,27 @@ function VizCartesianChartPanel({
   setConf,
   data
 }) {
-  const _a = conf, {
+  const {
     series,
-    y_axes
-  } = _a, restConf = __objRest(_a, [
-    "series",
-    "y_axes"
-  ]);
+    y_axes,
+    ...restConf
+  } = conf;
   const defaultValues = React.useMemo(() => {
-    const _a2 = restConf, {
+    const {
       x_axis_name = "",
-      stats
-    } = _a2, rest = __objRest(_a2, [
-      "x_axis_name",
-      "stats"
-    ]);
-    return __spreadValues({
+      stats,
+      ...rest
+    } = restConf;
+    return {
       series: withDefaults(series != null ? series : []),
       x_axis_name,
       y_axes: y_axes != null ? y_axes : [{
         name: "Y Axis",
         label_formatter: defaultNumbroFormat
       }],
-      stats: normalizeStats(stats)
-    }, rest);
+      stats: normalizeStats(stats),
+      ...rest
+    };
   }, [series, restConf]);
   React.useEffect(() => {
     const configMalformed = !_.isEqual(conf, defaultValues);
@@ -5038,25 +3476,27 @@ function VizCartesianChartPanel({
               control,
               render: ({
                 field
-              }) => /* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+              }) => /* @__PURE__ */ jsx(DataFieldSelector, {
                 label: "X Axis Data Field",
                 required: true,
                 data,
                 sx: {
                   flex: 1
-                }
-              }, field))
+                },
+                ...field
+              })
             }), /* @__PURE__ */ jsx(Controller, {
               name: "x_axis_name",
               control,
               render: ({
                 field
-              }) => /* @__PURE__ */ jsx(TextInput, __spreadValues({
+              }) => /* @__PURE__ */ jsx(TextInput, {
                 label: "X Axis Name",
                 sx: {
                   flex: 1
-                }
-              }, field))
+                },
+                ...field
+              })
             })]
           })
         }), /* @__PURE__ */ jsx(Accordion.Item, {
@@ -5142,15 +3582,17 @@ function VizPiePanel({
           border: "1px solid #eee",
           borderRadius: "5px"
         },
-        children: [/* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+        children: [/* @__PURE__ */ jsx(DataFieldSelector, {
           label: "Label Field",
           required: true,
-          data
-        }, form.getInputProps("label_field"))), /* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+          data,
+          ...form.getInputProps("label_field")
+        }), /* @__PURE__ */ jsx(DataFieldSelector, {
           label: "Value Field",
           required: true,
-          data
-        }, form.getInputProps("value_field")))]
+          data,
+          ...form.getInputProps("value_field")
+        })]
       })]
     })
   });
@@ -5218,11 +3660,12 @@ function VizRichTextPanel({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(RichTextEditor, __spreadValues({
+        }) => /* @__PURE__ */ jsx(RichTextEditor, {
           sx: {
             flex: 1
-          }
-        }, field))
+          },
+          ...field
+        })
       })]
     })
   });
@@ -5284,9 +3727,10 @@ function VariableField({
       control,
       render: ({
         field
-      }) => /* @__PURE__ */ jsx(TemplateVariableField, __spreadValues({
-        data
-      }, field))
+      }) => /* @__PURE__ */ jsx(TemplateVariableField, {
+        data,
+        ...field
+      })
     }), /* @__PURE__ */ jsx(ActionIcon, {
       color: "red",
       variant: "hover",
@@ -5317,7 +3761,10 @@ function VariablesField({
   });
   const watchFieldArray = watch("variables");
   const controlledFields = fields.map((field, index2) => {
-    return __spreadValues(__spreadValues({}, field), watchFieldArray[index2]);
+    return {
+      ...field,
+      ...watchFieldArray[index2]
+    };
   });
   const add = () => append(getANewVariable());
   return /* @__PURE__ */ jsxs(Group, {
@@ -5432,13 +3879,14 @@ function VizStatsPanel({
         control,
         render: ({
           field
-        }) => /* @__PURE__ */ jsx(TemplateInput, __spreadValues({
+        }) => /* @__PURE__ */ jsx(TemplateInput, {
           label: "Template",
           py: "md",
           sx: {
             flexGrow: 1
-          }
-        }, field))
+          },
+          ...field
+        })
       }), /* @__PURE__ */ jsx(Text, {
         pb: "sm",
         pt: "md",
@@ -5501,15 +3949,17 @@ function SunburstPanel({
           border: "1px solid #eee",
           borderRadius: "5px"
         },
-        children: [/* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+        children: [/* @__PURE__ */ jsx(DataFieldSelector, {
           label: "Label Field",
           required: true,
-          data
-        }, form.getInputProps("label_field"))), /* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+          data,
+          ...form.getInputProps("label_field")
+        }), /* @__PURE__ */ jsx(DataFieldSelector, {
           label: "Value Field",
           required: true,
-          data
-        }, form.getInputProps("value_field")))]
+          data,
+          ...form.getInputProps("value_field")
+        })]
       })]
     })
   });
@@ -5532,19 +3982,16 @@ function ValueTypeSelector({
     sx
   });
 }
-function VizTablePanel(_c) {
-  var _d = _c, {
-    conf: _e
-  } = _d, _f = _e, {
-    columns
-  } = _f, restConf = __objRest(_f, [
-    "columns"
-  ]), {
-    setConf,
-    data
-  } = _d;
+function VizTablePanel({
+  conf: {
+    columns,
+    ...restConf
+  },
+  setConf,
+  data
+}) {
   const form = useForm$1({
-    initialValues: __spreadValues({
+    initialValues: {
       id_field: "id",
       use_raw_columns: true,
       columns: formList(columns != null ? columns : []),
@@ -5552,8 +3999,9 @@ function VizTablePanel(_c) {
       horizontalSpacing: "sm",
       verticalSpacing: "sm",
       striped: false,
-      highlightOnHover: false
-    }, restConf)
+      highlightOnHover: false,
+      ...restConf
+    }
   });
   const addColumn = () => form.addListItem("columns", {
     label: randomId(),
@@ -5595,11 +4043,12 @@ function VizTablePanel(_c) {
           border: "1px solid #eee",
           borderRadius: "5px"
         },
-        children: [/* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+        children: [/* @__PURE__ */ jsx(DataFieldSelector, {
           label: "ID Field",
           required: true,
-          data
-        }, form.getInputProps("id_field"))), /* @__PURE__ */ jsxs(Group, {
+          data,
+          ...form.getInputProps("id_field")
+        }), /* @__PURE__ */ jsxs(Group, {
           position: "apart",
           mb: "lg",
           grow: true,
@@ -5608,21 +4057,23 @@ function VizTablePanel(_c) {
               flexGrow: 1
             }
           },
-          children: [/* @__PURE__ */ jsx(TextInput, __spreadValues({
+          children: [/* @__PURE__ */ jsx(TextInput, {
             label: "Horizontal Spacing",
             placeholder: "10px, 1em, 1rem, 100%...",
             required: true,
             sx: {
               flex: 1
-            }
-          }, form.getInputProps("horizontalSpacing"))), /* @__PURE__ */ jsx(TextInput, __spreadValues({
+            },
+            ...form.getInputProps("horizontalSpacing")
+          }), /* @__PURE__ */ jsx(TextInput, {
             label: "Vertical Spacing",
             placeholder: "10px, 1em, 1rem, 100%...",
             required: true,
             sx: {
               flex: 1
-            }
-          }, form.getInputProps("verticalSpacing")))]
+            },
+            ...form.getInputProps("verticalSpacing")
+          })]
         }), /* @__PURE__ */ jsx(Group, {
           position: "apart",
           mb: "lg",
@@ -5632,14 +4083,15 @@ function VizTablePanel(_c) {
               flexGrow: 1
             }
           },
-          children: /* @__PURE__ */ jsx(TextInput, __spreadValues({
+          children: /* @__PURE__ */ jsx(TextInput, {
             label: "Font Size",
             placeholder: "10px, 1em, 1rem, 100%...",
             required: true,
             sx: {
               flex: 1
-            }
-          }, form.getInputProps("fontSize")))
+            },
+            ...form.getInputProps("fontSize")
+          })
         }), /* @__PURE__ */ jsxs(Group, {
           direction: "column",
           grow: true,
@@ -5648,15 +4100,17 @@ function VizTablePanel(_c) {
           }), /* @__PURE__ */ jsxs(Group, {
             position: "apart",
             grow: true,
-            children: [/* @__PURE__ */ jsx(Switch, __spreadValues({
-              label: "Striped"
-            }, form.getInputProps("striped", {
-              type: "checkbox"
-            }))), /* @__PURE__ */ jsx(Switch, __spreadValues({
-              label: "Highlight on hover"
-            }, form.getInputProps("highlightOnHover", {
-              type: "checkbox"
-            })))]
+            children: [/* @__PURE__ */ jsx(Switch, {
+              label: "Striped",
+              ...form.getInputProps("striped", {
+                type: "checkbox"
+              })
+            }), /* @__PURE__ */ jsx(Switch, {
+              label: "Highlight on hover",
+              ...form.getInputProps("highlightOnHover", {
+                type: "checkbox"
+              })
+            })]
           })]
         })]
       }), /* @__PURE__ */ jsxs(Group, {
@@ -5670,11 +4124,12 @@ function VizTablePanel(_c) {
           border: "1px solid #eee",
           borderRadius: "5px"
         },
-        children: [/* @__PURE__ */ jsx(Switch, __spreadValues({
-          label: "Use Original Data Columns"
-        }, form.getInputProps("use_raw_columns", {
-          type: "checkbox"
-        }))), !form.values.use_raw_columns && /* @__PURE__ */ jsxs(Group, {
+        children: [/* @__PURE__ */ jsx(Switch, {
+          label: "Use Original Data Columns",
+          ...form.getInputProps("use_raw_columns", {
+            type: "checkbox"
+          })
+        }), !form.values.use_raw_columns && /* @__PURE__ */ jsxs(Group, {
           direction: "column",
           grow: true,
           children: [/* @__PURE__ */ jsx(Text, {
@@ -5694,22 +4149,25 @@ function VizTablePanel(_c) {
             children: [/* @__PURE__ */ jsxs(Group, {
               position: "apart",
               grow: true,
-              children: [/* @__PURE__ */ jsx(TextInput, __spreadValues({
+              children: [/* @__PURE__ */ jsx(TextInput, {
                 label: "Label",
                 required: true,
                 sx: {
                   flex: 1
-                }
-              }, form.getListInputProps("columns", index2, "label"))), /* @__PURE__ */ jsx(DataFieldSelector, __spreadValues({
+                },
+                ...form.getListInputProps("columns", index2, "label")
+              }), /* @__PURE__ */ jsx(DataFieldSelector, {
                 label: "Value Field",
                 required: true,
-                data
-              }, form.getListInputProps("columns", index2, "value_field"))), /* @__PURE__ */ jsx(ValueTypeSelector, __spreadValues({
+                data,
+                ...form.getListInputProps("columns", index2, "value_field")
+              }), /* @__PURE__ */ jsx(ValueTypeSelector, {
                 label: "Value Type",
                 sx: {
                   flex: 1
-                }
-              }, form.getListInputProps("columns", index2, "value_type")))]
+                },
+                ...form.getListInputProps("columns", index2, "value_type")
+              })]
             }), /* @__PURE__ */ jsx(ActionIcon, {
               color: "red",
               variant: "hover",
@@ -5768,9 +4226,10 @@ function VizTextPanel({
       paragraphs: formList((_a = conf.paragraphs) != null ? _a : sampleParagraphs)
     }
   });
-  const addParagraph = () => form.addListItem("paragraphs", __spreadProps(__spreadValues({}, sampleParagraphs[0]), {
+  const addParagraph = () => form.addListItem("paragraphs", {
+    ...sampleParagraphs[0],
     template: randomId()
-  }));
+  });
   return /* @__PURE__ */ jsx(Group, {
     direction: "column",
     mt: "md",
@@ -5811,29 +4270,33 @@ function VizTextPanel({
           border: "1px solid #eee",
           position: "relative"
         },
-        children: [/* @__PURE__ */ jsx(TextInput, __spreadValues({
+        children: [/* @__PURE__ */ jsx(TextInput, {
           placeholder: "Time: ${new Date().toISOString()}",
           label: "Content Template",
           required: true,
           sx: {
             flex: 1
-          }
-        }, form.getListInputProps("paragraphs", index2, "template"))), /* @__PURE__ */ jsxs(Group, {
+          },
+          ...form.getListInputProps("paragraphs", index2, "template")
+        }), /* @__PURE__ */ jsxs(Group, {
           direction: "column",
           grow: true,
           children: [/* @__PURE__ */ jsx(Text, {
             children: "Color"
-          }), /* @__PURE__ */ jsx(MantineColorSelector, __spreadValues({}, form.getListInputProps("paragraphs", index2, "color")))]
+          }), /* @__PURE__ */ jsx(MantineColorSelector, {
+            ...form.getListInputProps("paragraphs", index2, "color")
+          })]
         }), /* @__PURE__ */ jsx(Group, {
           direction: "column",
           grow: true,
-          children: /* @__PURE__ */ jsx(TextInput, __spreadValues({
+          children: /* @__PURE__ */ jsx(TextInput, {
             label: "Font Size",
             placeholder: "10px, 1em, 1rem, 100%...",
             sx: {
               flex: 1
-            }
-          }, form.getListInputProps("paragraphs", index2, "size")))
+            },
+            ...form.getListInputProps("paragraphs", index2, "size")
+          })
         }), /* @__PURE__ */ jsx(Group, {
           position: "apart",
           grow: true,
@@ -5843,9 +4306,10 @@ function VizTextPanel({
               maxWidth: "100%"
             }
           },
-          children: /* @__PURE__ */ jsx(MantineFontWeightSlider, __spreadValues({
-            label: "Font Weight"
-          }, form.getListInputProps("paragraphs", index2, "weight")))
+          children: /* @__PURE__ */ jsx(MantineFontWeightSlider, {
+            label: "Font Weight",
+            ...form.getListInputProps("paragraphs", index2, "weight")
+          })
         }), /* @__PURE__ */ jsx(ActionIcon, {
           color: "red",
           variant: "hover",
@@ -5925,12 +4389,14 @@ function EditVizConf() {
     if (!changed) {
       return;
     }
-    setViz((v) => __spreadProps(__spreadValues({}, v), {
+    setViz((v) => ({
+      ...v,
       type
     }));
   }, [changed, type]);
   const setVizConf = (conf) => {
-    setViz((v) => __spreadProps(__spreadValues({}, v), {
+    setViz((v) => ({
+      ...v,
       conf
     }));
   };
@@ -6073,7 +4539,9 @@ function PanelTitleBar({}) {
   } = React.useContext(LayoutStateContext);
   const {
     duplidatePanel,
-    removePanelByID
+    removePanelByID,
+    viewPanelInFullScreen,
+    inFullScreen
   } = React.useContext(DashboardActionContext);
   const duplicate = React.useCallback(() => {
     duplidatePanel(id);
@@ -6087,6 +4555,9 @@ function PanelTitleBar({}) {
     onCancel: () => console.log("Cancel"),
     onConfirm: () => removePanelByID(id)
   });
+  const enterFullScreen = React.useCallback(() => {
+    viewPanelInFullScreen(id);
+  }, [id, viewPanelInFullScreen]);
   return /* @__PURE__ */ jsxs(Box, {
     sx: {
       position: "relative"
@@ -6120,25 +4591,36 @@ function PanelTitleBar({}) {
             size: 14
           }),
           children: "Refresh"
-        }), inEditMode && /* @__PURE__ */ jsx(Menu.Item, {
-          onClick: open,
-          icon: /* @__PURE__ */ jsx(Settings, {
-            size: 14
-          }),
-          children: "Settings"
-        }), /* @__PURE__ */ jsx(Divider, {}), /* @__PURE__ */ jsx(Menu.Item, {
-          onClick: duplicate,
-          icon: /* @__PURE__ */ jsx(Copy, {
-            size: 14
-          }),
-          children: "Duplicate"
-        }), /* @__PURE__ */ jsx(Menu.Item, {
-          color: "red",
-          onClick: remove,
-          icon: /* @__PURE__ */ jsx(Trash, {
+        }), !inFullScreen && /* @__PURE__ */ jsx(Menu.Item, {
+          onClick: enterFullScreen,
+          icon: /* @__PURE__ */ jsx(ArrowsMaximize, {
             size: 14
           }),
-          children: "Delete"
+          children: "Full Screen"
+        }), inEditMode && /* @__PURE__ */ jsxs(Fragment, {
+          children: [/* @__PURE__ */ jsx(Divider, {
+            label: "Edit",
+            labelPosition: "center"
+          }), /* @__PURE__ */ jsx(Menu.Item, {
+            onClick: open,
+            icon: /* @__PURE__ */ jsx(Settings, {
+              size: 14
+            }),
+            children: "Settings"
+          }), /* @__PURE__ */ jsx(Menu.Item, {
+            onClick: duplicate,
+            icon: /* @__PURE__ */ jsx(Copy, {
+              size: 14
+            }),
+            children: "Duplicate"
+          }), /* @__PURE__ */ jsx(Menu.Item, {
+            color: "red",
+            onClick: remove,
+            icon: /* @__PURE__ */ jsx(Trash, {
+              size: 14
+            }),
+            children: "Delete"
+          })]
         })]
       })
     }), inEditMode && /* @__PURE__ */ jsx(PanelSettingsModal, {
@@ -6229,15 +4711,14 @@ function DashboardLayout({
 }) {
   const onLayoutChange = React.useCallback((currentLayout) => {
     const m2 = /* @__PURE__ */ new Map();
-    currentLayout.forEach((_a) => {
-      var _b = _a, {
-        i
-      } = _b, rest = __objRest(_b, [
-        "i"
-      ]);
+    currentLayout.forEach(({
+      i,
+      ...rest
+    }) => {
       m2.set(i, rest);
     });
-    const newPanels = panels.map((p2) => __spreadProps(__spreadValues({}, p2), {
+    const newPanels = panels.map((p2) => ({
+      ...p2,
       layout: m2.get(p2.id)
     }));
     setPanels(newPanels);
@@ -6248,24 +4729,22 @@ function DashboardLayout({
     rowHeight,
     isDraggable,
     isResizable,
-    children: panels.map((_a, index2) => {
-      var _b = _a, {
-        id
-      } = _b, rest = __objRest(_b, [
-        "id"
-      ]);
+    children: panels.map(({
+      id,
+      ...rest
+    }, index2) => {
       return /* @__PURE__ */ jsx("div", {
         "data-grid": rest.layout,
-        children: /* @__PURE__ */ jsx(Panel, __spreadProps(__spreadValues({
-          id
-        }, rest), {
+        children: /* @__PURE__ */ jsx(Panel, {
+          id,
+          ...rest,
           update: (panel) => {
             setPanels((prevs) => {
               prevs.splice(index2, 1, panel);
               return [...prevs];
             });
           }
-        }))
+        })
       }, id);
     })
   });
@@ -6490,39 +4969,42 @@ function QueryForm({
         pr: 40,
         children: [/* @__PURE__ */ jsxs(Group, {
           grow: true,
-          children: [/* @__PURE__ */ jsx(TextInput, __spreadValues({
+          children: [/* @__PURE__ */ jsx(TextInput, {
             placeholder: "An ID unique in this dashboard",
             label: "ID",
             required: true,
             sx: {
               flex: 1
             },
-            disabled: loading
-          }, form.getInputProps("id"))), /* @__PURE__ */ jsx(Select, __spreadValues({
+            disabled: loading,
+            ...form.getInputProps("id")
+          }), /* @__PURE__ */ jsx(Select, {
             label: "Data Source Type",
             data: querySourceTypeOptions,
             sx: {
               flex: 1
             },
-            disabled: loading
-          }, form.getInputProps("type"))), /* @__PURE__ */ jsx(Select, __spreadValues({
+            disabled: loading,
+            ...form.getInputProps("type")
+          }), /* @__PURE__ */ jsx(Select, {
             label: "Data Source Key",
             data: querySourceKeyOptions,
             sx: {
               flex: 1
             },
-            disabled: loading
-          }, form.getInputProps("key")))]
+            disabled: loading,
+            ...form.getInputProps("key")
+          })]
         }), /* @__PURE__ */ jsxs(Tabs, {
           children: [/* @__PURE__ */ jsx(Tabs.Tab, {
             label: "SQL",
-            children: /* @__PURE__ */ jsx(Textarea, __spreadProps(__spreadValues({
+            children: /* @__PURE__ */ jsx(Textarea, {
               autosize: true,
               minRows: 12,
-              maxRows: 24
-            }, form.getInputProps("sql")), {
+              maxRows: 24,
+              ...form.getInputProps("sql"),
               className: "code-textarea"
-            }))
+            })
           }), /* @__PURE__ */ jsx(Tabs.Tab, {
             label: "Preview",
             children: /* @__PURE__ */ jsx(PreviewSQL, {
@@ -6839,16 +5321,17 @@ function SQLSnippetsEditor({}) {
               border: "1px solid #eee",
               position: "relative"
             },
-            children: [/* @__PURE__ */ jsx(TextInput, __spreadValues({
+            children: [/* @__PURE__ */ jsx(TextInput, {
               label: "Key",
-              required: true
-            }, form.getListInputProps("snippets", index2, "key"))), /* @__PURE__ */ jsx(Textarea, __spreadProps(__spreadValues({
+              required: true,
+              ...form.getListInputProps("snippets", index2, "key")
+            }), /* @__PURE__ */ jsx(Textarea, {
               minRows: 3,
               label: "Value",
-              required: true
-            }, form.getListInputProps("snippets", index2, "value")), {
+              required: true,
+              ...form.getListInputProps("snippets", index2, "value"),
               className: "code-textarea"
-            })), /* @__PURE__ */ jsx(PreviewSnippet, {
+            }), /* @__PURE__ */ jsx(PreviewSnippet, {
               value: form.values.snippets[index2].value
             }), /* @__PURE__ */ jsx(ActionIcon, {
               color: "red",
@@ -7127,6 +5610,62 @@ function DashboardActions({
     })]
   });
 }
+function FullScreenPanel({
+  panel,
+  exitFullScreen
+}) {
+  return /* @__PURE__ */ jsxs(Group, {
+    direction: "column",
+    grow: true,
+    sx: {
+      flexGrow: 1,
+      justifyContent: "flex-start"
+    },
+    children: [/* @__PURE__ */ jsx(Group, {
+      direction: "row",
+      sx: {
+        flexGrow: 0
+      },
+      children: /* @__PURE__ */ jsx(Button, {
+        variant: "default",
+        size: "sm",
+        onClick: exitFullScreen,
+        leftIcon: /* @__PURE__ */ jsx(ArrowLeft, {
+          size: 20
+        }),
+        children: "Exit fullscreen"
+      })
+    }), /* @__PURE__ */ jsx(Group, {
+      grow: true,
+      sx: {
+        flexGrow: 1,
+        flexShrink: 0
+      },
+      children: /* @__PURE__ */ jsx(Panel, {
+        ...panel
+      })
+    })]
+  });
+}
+function usePanelFullScreen(panels) {
+  const [fullScreenPanelID, setFullScreenPanelID] = React.useState(null);
+  const viewPanelInFullScreen = React.useCallback((id) => {
+    setFullScreenPanelID(id);
+  }, []);
+  const exitFullScreen = React.useCallback(() => {
+    setFullScreenPanelID(null);
+  }, []);
+  const fullScreenPanel = React.useMemo(() => {
+    return panels.find((p2) => p2.id === fullScreenPanelID);
+  }, [fullScreenPanelID, panels]);
+  const inFullScreen = !!fullScreenPanel;
+  return {
+    viewPanelInFullScreen,
+    exitFullScreen,
+    inFullScreen,
+    fullScreenPanel
+  };
+}
 function Dashboard({
   context,
   dashboard,
@@ -7141,7 +5680,7 @@ function Dashboard({
   const [panels, setPanels] = React.useState(dashboard.panels);
   const [sqlSnippets, setSQLSnippets] = React.useState(dashboard.definition.sqlSnippets);
   const [queries, setQueries] = React.useState(dashboard.definition.queries);
-  const [mode, setMode] = React.useState(DashboardMode.Edit);
+  const [mode, setMode] = React.useState(DashboardMode.Use);
   const hasChanges = React.useMemo(() => {
     const cleanJSON = (v) => JSON.parse(JSON.stringify(v));
     const panelsEqual = _.isEqual(cleanJSON(panels), cleanJSON(dashboard.panels));
@@ -7154,13 +5693,14 @@ function Dashboard({
     return !_.isEqual(queries, dashboard.definition.queries);
   }, [dashboard, panels, sqlSnippets, queries]);
   const saveDashboardChanges = async () => {
-    const d = __spreadProps(__spreadValues({}, dashboard), {
+    const d = {
+      ...dashboard,
       panels,
       definition: {
         sqlSnippets,
         queries
       }
-    });
+    };
     await update(d);
   };
   const revertDashboardChanges = () => {
@@ -7194,13 +5734,15 @@ function Dashboard({
       if (!panel) {
         throw new Error(`[duplicate panel] Can't find a panel by id[${id}]`);
       }
-      const newPanel = __spreadProps(__spreadValues({}, panel), {
+      const newPanel = {
+        ...panel,
         id: randomId(),
-        layout: __spreadProps(__spreadValues({}, panel.layout), {
+        layout: {
+          ...panel.layout,
           x: 0,
           y: Infinity
-        })
-      });
+        }
+      };
       setPanels((prevs) => [...prevs, newPanel]);
     } catch (error) {
       console.error(error);
@@ -7231,6 +5773,12 @@ function Dashboard({
       }
     };
   }, [sqlSnippets, queries, panels]);
+  const {
+    viewPanelInFullScreen,
+    exitFullScreen,
+    inFullScreen,
+    fullScreenPanel
+  } = usePanelFullScreen(panels);
   return /* @__PURE__ */ jsx(ModalsProvider, {
     children: /* @__PURE__ */ jsx(ContextInfoContext.Provider, {
       value: context,
@@ -7238,11 +5786,13 @@ function Dashboard({
         value: {
           addPanel,
           duplidatePanel,
-          removePanelByID
+          removePanelByID,
+          viewPanelInFullScreen,
+          inFullScreen
         },
         children: /* @__PURE__ */ jsx(DefinitionContext.Provider, {
           value: definitions,
-          children: /* @__PURE__ */ jsx(LayoutStateContext.Provider, {
+          children: /* @__PURE__ */ jsxs(LayoutStateContext.Provider, {
             value: {
               layoutFrozen,
               freezeLayout,
@@ -7251,8 +5801,15 @@ function Dashboard({
               inLayoutMode,
               inUseMode
             },
-            children: /* @__PURE__ */ jsxs("div", {
+            children: [inFullScreen && /* @__PURE__ */ jsx(FullScreenPanel, {
+              panel: fullScreenPanel,
+              exitFullScreen
+            }), /* @__PURE__ */ jsxs(Box, {
               className,
+              sx: {
+                position: "relative",
+                display: inFullScreen ? "none" : "block"
+              },
               children: [/* @__PURE__ */ jsx(DashboardActions, {
                 mode,
                 setMode,
@@ -7266,7 +5823,7 @@ function Dashboard({
                 isDraggable: inLayoutMode,
                 isResizable: inLayoutMode
               })]
-            })
+            })]
           })
         })
       })
@@ -7284,17 +5841,16 @@ function ReadOnlyDashboardLayout({
     rowHeight,
     isDraggable: false,
     isResizable: false,
-    children: panels.map((_a) => {
-      var _b = _a, {
-        id
-      } = _b, rest = __objRest(_b, [
-        "id"
-      ]);
+    children: panels.map(({
+      id,
+      ...rest
+    }) => {
       return /* @__PURE__ */ jsx("div", {
         "data-grid": rest.layout,
-        children: /* @__PURE__ */ jsx(Panel, __spreadValues({
-          id
-        }, rest))
+        children: /* @__PURE__ */ jsx(Panel, {
+          id,
+          ...rest
+        })
       }, id);
     })
   });
@@ -7308,20 +5864,33 @@ function ReadOnlyDashboard({
   if (APIClient.baseURL !== config.apiBaseURL) {
     APIClient.baseURL = config.apiBaseURL;
   }
-  const definition = React.useMemo(() => __spreadProps(__spreadValues({}, dashboard.definition), {
+  const definition = React.useMemo(() => ({
+    ...dashboard.definition,
     setSQLSnippets: () => {
     },
     setQueries: () => {
     }
   }), [dashboard]);
+  const {
+    viewPanelInFullScreen,
+    exitFullScreen,
+    inFullScreen,
+    fullScreenPanel
+  } = usePanelFullScreen(dashboard.panels);
   return /* @__PURE__ */ jsx(ModalsProvider, {
     children: /* @__PURE__ */ jsx(ContextInfoContext.Provider, {
       value: context,
-      children: /* @__PURE__ */ jsx("div", {
-        className,
+      children: /* @__PURE__ */ jsx(DashboardActionContext.Provider, {
+        value: {
+          addPanel: _.noop,
+          duplidatePanel: _.noop,
+          removePanelByID: _.noop,
+          viewPanelInFullScreen,
+          inFullScreen
+        },
         children: /* @__PURE__ */ jsx(DefinitionContext.Provider, {
           value: definition,
-          children: /* @__PURE__ */ jsx(LayoutStateContext.Provider, {
+          children: /* @__PURE__ */ jsxs(LayoutStateContext.Provider, {
             value: {
               layoutFrozen: true,
               freezeLayout: () => {
@@ -7331,9 +5900,18 @@ function ReadOnlyDashboard({
               inLayoutMode: false,
               inUseMode: true
             },
-            children: /* @__PURE__ */ jsx(ReadOnlyDashboardLayout, {
-              panels: dashboard.panels
-            })
+            children: [inFullScreen && /* @__PURE__ */ jsx(FullScreenPanel, {
+              panel: fullScreenPanel,
+              exitFullScreen
+            }), /* @__PURE__ */ jsx(Box, {
+              className,
+              sx: {
+                display: inFullScreen ? "none" : "block"
+              },
+              children: /* @__PURE__ */ jsx(ReadOnlyDashboardLayout, {
+                panels: dashboard.panels
+              })
+            })]
           })
         })
       })