@cloudtower/eagle 0.0.0-double-rc-1 → 0.0.0-no-uikit-1

package/dist/cjs/core/Link/index.js

@@ -0,0 +1,62 @@
+'use strict';
+
+var index = require('../Button/index.js');
+var cs = require('classnames');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var cs__default = /*#__PURE__*/_interopDefault(cs);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+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;
+};
+const LinkStyle = "E_l48ei06";
+const Link = React__default.default.forwardRef((_a, ref) => {
+  var _b = _a,
+    {
+      className,
+      disabled,
+      type = "default"
+    } = _b,
+    props = __objRest(_b, ["className", "disabled", "type"]);
+  return /* @__PURE__ */React__default.default.createElement(index, __spreadProps(__spreadValues({}, props), {
+    ref,
+    disabled,
+    className: cs__default.default(LinkStyle, className, {
+      "ui-kit-link-disabled": disabled,
+      "ui-kit-link-primary": type === "primary",
+      "ui-kit-link-secondary": type === "secondary"
+    }),
+    type: "link"
+  }));
+});
+var Link$1 = Link;
+
+module.exports = Link$1;

package/dist/cjs/core/Loading/index.js

@@ -0,0 +1,37 @@
+'use strict';
+
+var style = require('./style.js');
+var index = require('../Styled/index.js');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+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));
+const Loading = ({ fullView = true }) => {
+  const Wrapper = fullView ? index.FullView : React.Fragment;
+  const props = fullView ? { className: "loading-full-view" } : {};
+  return /* @__PURE__ */ React__default.default.createElement(Wrapper, __spreadProps(__spreadValues({}, props), { "data-testid": "loading" }), /* @__PURE__ */ React__default.default.createElement("div", { className: style.LoadingWrapper }, /* @__PURE__ */ React__default.default.createElement("div", { className: style.LoadingLine1 }), /* @__PURE__ */ React__default.default.createElement("div", { className: style.LoadingLine2 }), /* @__PURE__ */ React__default.default.createElement("div", { className: style.LoadingLine3 })));
+};
+var Loading$1 = Loading;
+
+module.exports = Loading$1;

package/dist/cjs/core/Loading/style.js

@@ -0,0 +1,11 @@
+'use strict';
+
+const LoadingWrapper = "E_lht19u8";
+const LoadingLine1 = "E_lk3gkp4";
+const LoadingLine2 = "E_ll4n94n";
+const LoadingLine3 = "E_l17lbdo6";
+
+exports.LoadingLine1 = LoadingLine1;
+exports.LoadingLine2 = LoadingLine2;
+exports.LoadingLine3 = LoadingLine3;
+exports.LoadingWrapper = LoadingWrapper;

package/dist/cjs/core/Metric/MetricActions.js

@@ -0,0 +1,18 @@
+'use strict';
+
+var useParrotTranslation = require('../../hooks/useParrotTranslation.js');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const MetricActions = (props) => {
+  const { info, dropdown } = props;
+  const { current, max } = info;
+  const { t } = useParrotTranslation();
+  return /* @__PURE__ */ React__default.default.createElement("div", { className: "metric-extra" }, /* @__PURE__ */ React__default.default.createElement("div", null, /* @__PURE__ */ React__default.default.createElement("span", { className: "info-item" }, t("metric.max"), "\uFF1A", max), /* @__PURE__ */ React__default.default.createElement("span", { className: "info-item" }, t("metric.current"), "\uFF1A", current)), dropdown);
+};
+var MetricActions$1 = MetricActions;
+
+module.exports = MetricActions$1;

package/dist/cjs/core/Metric/MetricLegend.js

@@ -0,0 +1,73 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var icons = require('@ant-design/icons');
+var styled = require('./styled.js');
+var index = require('../Overflow/index.js');
+var index$1 = require('../Truncate/index.js');
+var antd = require('antd');
+var cs = require('classnames');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var cs__default = /*#__PURE__*/_interopDefault(cs);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const ColorBlock = ({ background }) => /* @__PURE__ */ React__default.default.createElement("div", { className: cs__default.default(styled.ColorBlockStyle, "color-block"), style: { background } });
+const MetricLegend = (props) => {
+  const { deselected, onClick, legends } = props;
+  return /* @__PURE__ */ React__default.default.createElement(
+    index.ExtraOverflow,
+    {
+      className: styled.LegendStyle,
+      extraEl: (end) => /* @__PURE__ */ React__default.default.createElement(
+        antd.Dropdown,
+        {
+          overlayClassName: styled.ExtraResource,
+          overlay: /* @__PURE__ */ React__default.default.createElement(antd.Menu, null, legends.slice(end).map((legend, idx) => {
+            return /* @__PURE__ */ React__default.default.createElement(
+              antd.Menu.Item,
+              {
+                className: cs__default.default(
+                  styled.LegendItemStyle,
+                  deselected.includes(legend.id) && "deselected"
+                ),
+                key: legend.id,
+                onClick: () => onClick(legend.id)
+              },
+              /* @__PURE__ */ React__default.default.createElement(ColorBlock, { background: legend.color }),
+              /* @__PURE__ */ React__default.default.createElement("span", null, legend.name)
+            );
+          }))
+        },
+        /* @__PURE__ */ React__default.default.createElement(icons.DoubleRightOutlined, { rotate: 90 })
+      ),
+      els: legends.map((legend) => {
+        return /* @__PURE__ */ React__default.default.createElement(
+          "div",
+          {
+            className: cs__default.default(
+              styled.LegendItemStyle,
+              deselected.includes(legend.id) && "deselected"
+            ),
+            key: legend.id,
+            onClick: () => onClick(legend.id)
+          },
+          /* @__PURE__ */ React__default.default.createElement(ColorBlock, { background: legend.color }),
+          /* @__PURE__ */ React__default.default.createElement("span", null, /* @__PURE__ */ React__default.default.createElement(index$1, { text: legend.name, len: 50, backLen: 20 }))
+        );
+      })
+    }
+  );
+};
+const LegendComponent = (props) => {
+  const { name, color } = props;
+  return /* @__PURE__ */ React__default.default.createElement("div", { className: cs__default.default(styled.LegendItemStyle, "legend-component") }, /* @__PURE__ */ React__default.default.createElement(ColorBlock, { background: color }), /* @__PURE__ */ React__default.default.createElement("span", null, name));
+};
+var MetricLegend$1 = MetricLegend;
+
+exports.ColorBlock = ColorBlock;
+exports.LegendComponent = LegendComponent;
+exports.default = MetricLegend$1;

package/dist/cjs/core/Metric/Pointer.js

@@ -0,0 +1,45 @@
+'use strict';
+
+var index = require('../KitStoreProvider/index.js');
+var _ = require('lodash');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var ___default = /*#__PURE__*/_interopDefault(_);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const Pointer = ({ uuid = "", metricWidth }) => {
+  const pointers = index.useKitSelector(
+    (state) => ___default.default.get(state, "chart.pointers")
+  );
+  if (!(pointers == null ? void 0 : pointers[uuid])) {
+    return null;
+  }
+  const { left = 0, text } = pointers[uuid];
+  let dis = -99999999;
+  const threshold = 50;
+  if (metricWidth) {
+    if (left <= threshold) {
+      dis = threshold;
+    } else if (left >= metricWidth - threshold) {
+      dis = metricWidth - threshold;
+    } else {
+      dis = left;
+    }
+  }
+  return /* @__PURE__ */ React__default.default.createElement(
+    "div",
+    {
+      style: {
+        transform: `translate(${dis}px)`,
+        position: "absolute",
+        whiteSpace: "nowrap"
+      }
+    },
+    /* @__PURE__ */ React__default.default.createElement("div", { className: "pointer-wrapper" }, text)
+  );
+};
+var Pointer$1 = Pointer;
+
+module.exports = Pointer$1;

package/dist/cjs/core/Metric/RenderChart.js

@@ -0,0 +1,203 @@
+'use strict';
+
+var index = require('../KitStoreProvider/index.js');
+var metric = require('./metric.js');
+var MetricActions = require('./MetricActions.js');
+var MetricLegend = require('./MetricLegend.js');
+var styled = require('./styled.js');
+var TooltipFormatter = require('./TooltipFormatter.js');
+var type = require('./type.js');
+var useParrotTranslation = require('../../hooks/useParrotTranslation.js');
+var cs = require('classnames');
+var dayjs = require('dayjs');
+var React = require('react');
+var recharts = require('recharts');
+var chart = require('../../store/chart.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var cs__default = /*#__PURE__*/_interopDefault(cs);
+var dayjs__default = /*#__PURE__*/_interopDefault(dayjs);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+var __defProp = Object.defineProperty;
+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;
+};
+const RenderChart = (props) => {
+  const {
+    metricName,
+    showLegend,
+    syncId,
+    showXAxis,
+    yAxisAlign,
+    height,
+    type: type$1,
+    mode = "legend",
+    dropdown,
+    onLabelsChange,
+    metric: metric$1,
+    yAxisProps,
+    xAxisProps,
+    actionsProps,
+    tooltipProps
+  } = props;
+  const { t } = useParrotTranslation();
+  const dispatch = index.useKitDispatch();
+  const [deselected, setDeselected] = React.useState([]);
+  const streams = React.useMemo(() => metric$1.sample_streams, [metric$1]);
+  const legends = React.useMemo(() => {
+    return metric$1.sample_streams.map((stream) => stream.legend);
+  }, [metric$1.sample_streams]);
+  const areaChartData = React.useMemo(
+    () => metric.convertDataStruct(streams.map((stream) => stream.points)),
+    [streams]
+  );
+  const onLegendClick = React.useCallback(
+    (id) => {
+      setDeselected((prev) => {
+        const include = prev.includes(id);
+        const newDeselected = include ? prev.filter((r) => r !== id) : [...prev, id];
+        onLabelsChange == null ? void 0 : onLabelsChange(newDeselected);
+        return newDeselected.length >= streams.length ? prev : newDeselected;
+      });
+    },
+    [onLabelsChange, streams]
+  );
+  const hidePointer = React.useCallback(() => {
+    dispatch({
+      type: chart.ChartActions.SET_POINTER,
+      payload: { visible: false, uuid: syncId }
+    });
+  }, [dispatch, syncId]);
+  const handleMouseMove = React.useCallback(
+    (e) => {
+      var _a;
+      if (e.isTooltipActive) {
+        const { chartX, activePayload } = e;
+        if (!((_a = activePayload == null ? void 0 : activePayload[0]) == null ? void 0 : _a.payload)) {
+          return;
+        }
+        dispatch({
+          type: chart.ChartActions.SET_POINTER,
+          payload: {
+            uuid: syncId,
+            visible: true,
+            left: chartX,
+            text: dayjs__default.default(Number(activePayload[0].payload.t)).format(
+              "MM-DD HH:mm:ss"
+            ),
+            value: activePayload[0].payload.v
+          }
+        });
+      }
+    },
+    [dispatch, syncId]
+  );
+  if (!(streams == null ? void 0 : streams.length) || streams.every((stream) => {
+    var _a;
+    return !((_a = stream.points) == null ? void 0 : _a.length);
+  })) {
+    return /* @__PURE__ */ React__default.default.createElement("div", { className: styled.MetricLegendTabStyle }, /* @__PURE__ */ React__default.default.createElement("div", { className: "name-toolbar" }, /* @__PURE__ */ React__default.default.createElement(
+      MetricLegend.default,
+      {
+        streams,
+        metricName,
+        deselected,
+        onClick: onLegendClick,
+        legends
+      }
+    )), /* @__PURE__ */ React__default.default.createElement("div", { className: cs__default.default("content", mode === "single" && "single-content") }, t("metric.empty")));
+  }
+  return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement("div", { className: "metric-toolbar" }, showLegend && /* @__PURE__ */ React__default.default.createElement(
+    MetricLegend.default,
+    {
+      streams,
+      metricName,
+      deselected,
+      onClick: onLegendClick,
+      legends
+    }
+  ), (actionsProps == null ? void 0 : actionsProps.show) && /* @__PURE__ */ React__default.default.createElement(MetricActions, __spreadValues({ dropdown }, actionsProps))), /* @__PURE__ */ React__default.default.createElement(recharts.ResponsiveContainer, { height }, /* @__PURE__ */ React__default.default.createElement(
+    recharts.AreaChart,
+    {
+      style: { backgroundColor: "white" },
+      margin: showLegend ? { top: 10, left: 10, right: 10, bottom: 0 } : { top: 20, left: 10, right: 10, bottom: 5 },
+      data: areaChartData,
+      syncId,
+      onMouseLeave: hidePointer,
+      onMouseMove: handleMouseMove
+    },
+    /* @__PURE__ */ React__default.default.createElement(
+      recharts.XAxis,
+      __spreadValues({
+        hide: !showXAxis,
+        dataKey: "t",
+        axisLine: false,
+        tickLine: false,
+        type: "number"
+      }, xAxisProps)
+    ),
+    /* @__PURE__ */ React__default.default.createElement(
+      recharts.YAxis,
+      __spreadValues({
+        width: 200,
+        mirror: true,
+        allowDataOverflow: true,
+        axisLine: false,
+        tickLine: false,
+        orientation: yAxisAlign
+      }, yAxisProps)
+    ),
+    /* @__PURE__ */ React__default.default.createElement(
+      recharts.Tooltip,
+      __spreadValues({
+        content: tooltipProps.format && /* @__PURE__ */ React__default.default.createElement(
+          TooltipFormatter,
+          {
+            deselected,
+            legends,
+            format: tooltipProps.format
+          }
+        )
+      }, tooltipProps)
+    ),
+    streams.map((item, index) => {
+      if (deselected.includes(item.legend.id)) {
+        return null;
+      }
+      return /* @__PURE__ */ React__default.default.createElement(
+        recharts.Area,
+        {
+          key: index,
+          dataKey: `v${index}`,
+          stackId: type$1 === type.GraphType.Stack ? "stack" : void 0,
+          stroke: item.legend.stroke ? `${item.legend.color}1A` : item.legend.color,
+          fill: item.legend.fill,
+          isAnimationActive: false,
+          activeDot: {
+            stroke: item.legend.color,
+            r: 4,
+            strokeWidth: 2,
+            fill: "white"
+          }
+        }
+      );
+    })
+  )));
+};
+var RenderChart$1 = RenderChart;
+
+module.exports = RenderChart$1;

package/dist/cjs/core/Metric/TooltipFormatter.js

@@ -0,0 +1,45 @@
+'use strict';
+
+var MetricLegend = require('./MetricLegend.js');
+var styled = require('./styled.js');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+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));
+const TooltipFormatter = (props) => {
+  const { active, payload, deselected, legends, format } = props;
+  if (!active || !(payload == null ? void 0 : payload.length)) {
+    return null;
+  }
+  return /* @__PURE__ */ React__default.default.createElement(styled.TooltipWrapper, null, payload.map((item, index) => {
+    return __spreadProps(__spreadValues({}, item), {
+      legend: legends[index]
+    });
+  }).sort((a, b) => b.value - a.value).map((item) => {
+    return deselected.includes(item.legend.id) ? null : /* @__PURE__ */ React__default.default.createElement(styled.TooltipColumn, { key: item.legend.id }, /* @__PURE__ */ React__default.default.createElement("div", null, /* @__PURE__ */ React__default.default.createElement(MetricLegend.ColorBlock, { background: item.legend.color }), item.legend.name), /* @__PURE__ */ React__default.default.createElement("div", { className: "column-value" }, format(item)));
+  }));
+};
+var TooltipFormatter$1 = TooltipFormatter;
+
+module.exports = TooltipFormatter$1;

package/dist/cjs/core/Metric/index.js

@@ -0,0 +1,63 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var parrot = require('@cloudtower/parrot');
+var index = require('../ErrorBoundary/index.js');
+var Pointer = require('./Pointer.js');
+var RenderChart = require('./RenderChart.js');
+var styled = require('./styled.js');
+var cs = require('classnames');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var cs__default = /*#__PURE__*/_interopDefault(cs);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+var __defProp = Object.defineProperty;
+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;
+};
+const Metric = (props) => {
+  const {
+    height = 154,
+    showPointer = true,
+    showLegend = true,
+    showXaxis = false,
+    chartProps
+  } = props;
+  const [width, setWidth] = React.useState();
+  const wrapperRef = React.useRef(null);
+  React.useEffect(() => {
+    var _a;
+    setWidth((_a = wrapperRef.current) == null ? void 0 : _a.offsetWidth);
+  }, []);
+  return /* @__PURE__ */ React__default.default.createElement(index, { i18n: parrot.parrotI18n }, /* @__PURE__ */ React__default.default.createElement(
+    styled.MetricWrapper,
+    {
+      className: cs__default.default("metric-wrapper", !showXaxis && "hidden-xaxis"),
+      ref: wrapperRef,
+      style: { height: showLegend ? height + 30 : height }
+    },
+    /* @__PURE__ */ React__default.default.createElement(RenderChart, __spreadValues({}, chartProps)),
+    showPointer && /* @__PURE__ */ React__default.default.createElement(Pointer, { uuid: chartProps.syncId, metricWidth: width })
+  ));
+};
+var Metric$1 = Metric;
+
+exports.Pointer = Pointer;
+exports.RenderChart = RenderChart;
+exports.default = Metric$1;