@gobolt/genesis 0.0.9 → 0.0.11

package/dist/components/Dashboard/__stories__/DashboardLayoutContent.js

@@ -0,0 +1,948 @@
+import { jsxs as S, jsx as f } from "react/jsx-runtime";
+import * as b from "react";
+import h, { PureComponent as Ce, useState as De } from "react";
+import "../../Avatar/styles.js";
+import "../../Badge/styles.js";
+import "../../../providers/BreakpointThemeProvider.js";
+import { u as Pe, a as I } from "../../../Typography-DqI7RslA.js";
+import { BREAKPOINTS as Ne } from "../../../constants/index.js";
+import "../../Breadcrumb/styles.js";
+import "../../Button/styles.js";
+import H from "../../Card/Card.js";
+import "../../Checkbox/styles.js";
+import "../../ErrorBoundaryFallback/styles.js";
+import "../../Input/styles.js";
+import "../../Layout/Content/styles.js";
+import "../../Message/styles.js";
+import "../../Notification/NotificationBadge/styles.js";
+import "../../Notification/styles.js";
+import "../../../styles-BSD221S5.js";
+import "../../Progress/styles.js";
+import "../../../styles/global-styles.js";
+import je from "../../Radio/RadioGroup.js";
+import "../../Row/styles.js";
+import "../../Row/RowLabelValue/styles.js";
+import "../../Row/RowActions/styles.js";
+import "../../SegmentedControls/styles.js";
+import "../../Select/styles.js";
+import "../../Switch/styles.js";
+import { S as ie, F as Te } from "../../../styles-D9iYILpv.js";
+import "../../Tabs/styles.js";
+import "../../Tile/styles.js";
+import "../../Toast/styles.js";
+import "../../Tooltip/styles.js";
+import { columns as ke, deliveryData as J } from "../__mocks__/dashboard-data.js";
+import { R as _e, C as Q } from "../../../styles-BDbHpHsc.js";
+import { a as Ie } from "../../../useBreakpoint-CAMzKscx.js";
+import { c as Le } from "../../../reactNode-sKPeiqPL.js";
+import { d as ve, e as Re } from "../../../presets-Djh_L_6R.js";
+import { p as $e } from "../../../pickAttrs-CleuMJFR.js";
+import { g as Ve, m as Me, r as Be, C as ze } from "../../../index-ByspLxrB.js";
+import { S as Fe } from "../../../Skeleton-B3vg9CbL.js";
+import "../../../index-DLdU7Tpd.js";
+import { I as he } from "../../../AntdIcon-nCNB0J1E.js";
+import { G as Ke, n as B, g as oe, a as se, D as We, u as Ge, b as V, L as K, o as X, C as Z, A as He, c as M, i as le, p as Xe, d as ce, h as Ue, e as Ye, j as ye, B as ee, X as U, Y, k as ge, l as ue, T as pe, m as de } from "../../../generateCategoricalChart-7ceYaiZ2.js";
+import { c as be } from "../../../clsx-OuTLNxxd.js";
+import { i as te } from "../../../_baseIsEqual-L0-w1QRI.js";
+import { L as qe } from "../../../index-CodMmNWv.js";
+var Je = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0048.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z" } }] }, name: "arrow-down", theme: "outlined" }, Qe = function(r, n) {
+  return /* @__PURE__ */ b.createElement(he, ve({}, r, {
+    ref: n,
+    icon: Je
+  }));
+}, xe = /* @__PURE__ */ b.forwardRef(Qe);
+process.env.NODE_ENV !== "production" && (xe.displayName = "ArrowDownOutlined");
+var Ze = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M868 545.5L536.1 163a31.96 31.96 0 00-48.3 0L156 545.5a7.97 7.97 0 006 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z" } }] }, name: "arrow-up", theme: "outlined" }, et = function(r, n) {
+  return /* @__PURE__ */ b.createElement(he, ve({}, r, {
+    ref: n,
+    icon: Ze
+  }));
+}, Ae = /* @__PURE__ */ b.forwardRef(et);
+process.env.NODE_ENV !== "production" && (Ae.displayName = "ArrowUpOutlined");
+const tt = (e) => {
+  const {
+    value: r,
+    formatter: n,
+    precision: t,
+    decimalSeparator: a,
+    groupSeparator: o = "",
+    prefixCls: s
+  } = e;
+  let i;
+  if (typeof n == "function")
+    i = n(r);
+  else {
+    const l = String(r), u = l.match(/^(-?)(\d*)(\.(\d+))?$/);
+    if (!u || l === "-")
+      i = l;
+    else {
+      const c = u[1];
+      let p = u[2] || "0", d = u[4] || "";
+      p = p.replace(/\B(?=(\d{3})+(?!\d))/g, o), typeof t == "number" && (d = d.padEnd(t, "0").slice(0, t > 0 ? t : 0)), d && (d = `${a}${d}`), i = [/* @__PURE__ */ b.createElement("span", {
+        key: "int",
+        className: `${s}-content-value-int`
+      }, c, p), d && /* @__PURE__ */ b.createElement("span", {
+        key: "decimal",
+        className: `${s}-content-value-decimal`
+      }, d)];
+    }
+  }
+  return /* @__PURE__ */ b.createElement("span", {
+    className: `${s}-content-value`
+  }, i);
+}, rt = (e) => {
+  const {
+    componentCls: r,
+    marginXXS: n,
+    padding: t,
+    colorTextDescription: a,
+    titleFontSize: o,
+    colorTextHeading: s,
+    contentFontSize: i,
+    fontFamily: l
+  } = e;
+  return {
+    [r]: Object.assign(Object.assign({}, Be(e)), {
+      [`${r}-title`]: {
+        marginBottom: n,
+        color: a,
+        fontSize: o
+      },
+      [`${r}-skeleton`]: {
+        paddingTop: t
+      },
+      [`${r}-content`]: {
+        color: s,
+        fontSize: i,
+        fontFamily: l,
+        [`${r}-content-value`]: {
+          display: "inline-block",
+          direction: "ltr"
+        },
+        [`${r}-content-prefix, ${r}-content-suffix`]: {
+          display: "inline-block"
+        },
+        [`${r}-content-prefix`]: {
+          marginInlineEnd: n
+        },
+        [`${r}-content-suffix`]: {
+          marginInlineStart: n
+        }
+      }
+    })
+  };
+}, nt = (e) => {
+  const {
+    fontSizeHeading3: r,
+    fontSize: n
+  } = e;
+  return {
+    titleFontSize: n,
+    contentFontSize: r
+  };
+}, at = Ve("Statistic", (e) => {
+  const r = Me(e, {});
+  return [rt(r)];
+}, nt);
+var it = function(e, r) {
+  var n = {};
+  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && r.indexOf(t) < 0 && (n[t] = e[t]);
+  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var a = 0, t = Object.getOwnPropertySymbols(e); a < t.length; a++)
+    r.indexOf(t[a]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[a]) && (n[t[a]] = e[t[a]]);
+  return n;
+};
+const W = (e) => {
+  const {
+    prefixCls: r,
+    className: n,
+    rootClassName: t,
+    style: a,
+    valueStyle: o,
+    value: s = 0,
+    title: i,
+    valueRender: l,
+    prefix: u,
+    suffix: c,
+    loading: p = !1,
+    /* --- FormatConfig starts --- */
+    formatter: d,
+    precision: g,
+    decimalSeparator: A = ".",
+    groupSeparator: O = ",",
+    /* --- FormatConfig starts --- */
+    onMouseEnter: x,
+    onMouseLeave: C
+  } = e, E = it(e, ["prefixCls", "className", "rootClassName", "style", "valueStyle", "value", "title", "valueRender", "prefix", "suffix", "loading", "formatter", "precision", "decimalSeparator", "groupSeparator", "onMouseEnter", "onMouseLeave"]), {
+    getPrefixCls: P,
+    direction: y,
+    statistic: m
+  } = b.useContext(ze), v = P("statistic", r), [D, w, _] = at(v), N = /* @__PURE__ */ b.createElement(tt, {
+    decimalSeparator: A,
+    groupSeparator: O,
+    prefixCls: v,
+    formatter: d,
+    precision: g,
+    value: s
+  }), j = Re(v, {
+    [`${v}-rtl`]: y === "rtl"
+  }, m == null ? void 0 : m.className, n, t, w, _), R = $e(E, {
+    aria: !0,
+    data: !0
+  });
+  return D(/* @__PURE__ */ b.createElement("div", Object.assign({}, R, {
+    className: j,
+    style: Object.assign(Object.assign({}, m == null ? void 0 : m.style), a),
+    onMouseEnter: x,
+    onMouseLeave: C
+  }), i && /* @__PURE__ */ b.createElement("div", {
+    className: `${v}-title`
+  }, i), /* @__PURE__ */ b.createElement(Fe, {
+    paragraph: !1,
+    loading: p,
+    className: `${v}-skeleton`
+  }, /* @__PURE__ */ b.createElement("div", {
+    style: o,
+    className: `${v}-content`
+  }, u && /* @__PURE__ */ b.createElement("span", {
+    className: `${v}-content-prefix`
+  }, u), l ? l(N) : N, c && /* @__PURE__ */ b.createElement("span", {
+    className: `${v}-content-suffix`
+  }, c)))));
+};
+process.env.NODE_ENV !== "production" && (W.displayName = "Statistic");
+const ot = [
+  ["Y", 1e3 * 60 * 60 * 24 * 365],
+  // years
+  ["M", 1e3 * 60 * 60 * 24 * 30],
+  // months
+  ["D", 1e3 * 60 * 60 * 24],
+  // days
+  ["H", 1e3 * 60 * 60],
+  // hours
+  ["m", 1e3 * 60],
+  // minutes
+  ["s", 1e3],
+  // seconds
+  ["S", 1]
+  // million seconds
+];
+function st(e, r) {
+  let n = e;
+  const t = /\[[^\]]*]/g, a = (r.match(t) || []).map((l) => l.slice(1, -1)), o = r.replace(t, "[]"), s = ot.reduce((l, u) => {
+    let [c, p] = u;
+    if (l.includes(c)) {
+      const d = Math.floor(n / p);
+      return n -= d * p, l.replace(new RegExp(`${c}+`, "g"), (g) => {
+        const A = g.length;
+        return d.toString().padStart(A, "0");
+      });
+    }
+    return l;
+  }, o);
+  let i = 0;
+  return s.replace(t, () => {
+    const l = a[i];
+    return i += 1, l;
+  });
+}
+function lt(e, r) {
+  const {
+    format: n = ""
+  } = r, t = new Date(e).getTime(), a = Date.now(), o = Math.max(t - a, 0);
+  return st(o, n);
+}
+var ct = function(e, r) {
+  var n = {};
+  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && r.indexOf(t) < 0 && (n[t] = e[t]);
+  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var a = 0, t = Object.getOwnPropertySymbols(e); a < t.length; a++)
+    r.indexOf(t[a]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[a]) && (n[t[a]] = e[t[a]]);
+  return n;
+};
+const ut = 1e3 / 30;
+function pt(e) {
+  return new Date(e).getTime();
+}
+const dt = (e) => {
+  const {
+    value: r,
+    format: n = "HH:mm:ss",
+    onChange: t,
+    onFinish: a
+  } = e, o = ct(e, ["value", "format", "onChange", "onFinish"]), s = Ie(), i = b.useRef(null), l = () => {
+    a == null || a(), i.current && (clearInterval(i.current), i.current = null);
+  }, u = () => {
+    const d = pt(r);
+    d >= Date.now() && (i.current = setInterval(() => {
+      s(), t == null || t(d - Date.now()), d < Date.now() && l();
+    }, ut));
+  };
+  b.useEffect(() => (u(), () => {
+    i.current && (clearInterval(i.current), i.current = null);
+  }), [r]);
+  const c = (d, g) => lt(d, Object.assign(Object.assign({}, g), {
+    format: n
+  })), p = (d) => Le(d, {
+    title: void 0
+  });
+  return /* @__PURE__ */ b.createElement(W, Object.assign({}, o, {
+    value: r,
+    valueRender: p,
+    formatter: c
+  }));
+}, ft = /* @__PURE__ */ b.memo(dt);
+W.Countdown = ft;
+var mt = ["layout", "type", "stroke", "connectNulls", "isRange", "ref"], vt = ["key"], Ee;
+function z(e) {
+  "@babel/helpers - typeof";
+  return z = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(r) {
+    return typeof r;
+  } : function(r) {
+    return r && typeof Symbol == "function" && r.constructor === Symbol && r !== Symbol.prototype ? "symbol" : typeof r;
+  }, z(e);
+}
+function Oe(e, r) {
+  if (e == null) return {};
+  var n = ht(e, r), t, a;
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    for (a = 0; a < o.length; a++)
+      t = o[a], !(r.indexOf(t) >= 0) && Object.prototype.propertyIsEnumerable.call(e, t) && (n[t] = e[t]);
+  }
+  return n;
+}
+function ht(e, r) {
+  if (e == null) return {};
+  var n = {};
+  for (var t in e)
+    if (Object.prototype.hasOwnProperty.call(e, t)) {
+      if (r.indexOf(t) >= 0) continue;
+      n[t] = e[t];
+    }
+  return n;
+}
+function $() {
+  return $ = Object.assign ? Object.assign.bind() : function(e) {
+    for (var r = 1; r < arguments.length; r++) {
+      var n = arguments[r];
+      for (var t in n)
+        Object.prototype.hasOwnProperty.call(n, t) && (e[t] = n[t]);
+    }
+    return e;
+  }, $.apply(this, arguments);
+}
+function fe(e, r) {
+  var n = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var t = Object.getOwnPropertySymbols(e);
+    r && (t = t.filter(function(a) {
+      return Object.getOwnPropertyDescriptor(e, a).enumerable;
+    })), n.push.apply(n, t);
+  }
+  return n;
+}
+function L(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var n = arguments[r] != null ? arguments[r] : {};
+    r % 2 ? fe(Object(n), !0).forEach(function(t) {
+      T(e, t, n[t]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : fe(Object(n)).forEach(function(t) {
+      Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(n, t));
+    });
+  }
+  return e;
+}
+function yt(e, r) {
+  if (!(e instanceof r))
+    throw new TypeError("Cannot call a class as a function");
+}
+function me(e, r) {
+  for (var n = 0; n < r.length; n++) {
+    var t = r[n];
+    t.enumerable = t.enumerable || !1, t.configurable = !0, "value" in t && (t.writable = !0), Object.defineProperty(e, Se(t.key), t);
+  }
+}
+function gt(e, r, n) {
+  return me(e.prototype, r), me(e, n), Object.defineProperty(e, "prototype", { writable: !1 }), e;
+}
+function bt(e, r, n) {
+  return r = q(r), xt(e, we() ? Reflect.construct(r, n, q(e).constructor) : r.apply(e, n));
+}
+function xt(e, r) {
+  if (r && (z(r) === "object" || typeof r == "function"))
+    return r;
+  if (r !== void 0)
+    throw new TypeError("Derived constructors may only return object or undefined");
+  return At(e);
+}
+function At(e) {
+  if (e === void 0)
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  return e;
+}
+function we() {
+  try {
+    var e = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {
+    }));
+  } catch {
+  }
+  return (we = function() {
+    return !!e;
+  })();
+}
+function q(e) {
+  return q = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(n) {
+    return n.__proto__ || Object.getPrototypeOf(n);
+  }, q(e);
+}
+function Et(e, r) {
+  if (typeof r != "function" && r !== null)
+    throw new TypeError("Super expression must either be null or a function");
+  e.prototype = Object.create(r && r.prototype, { constructor: { value: e, writable: !0, configurable: !0 } }), Object.defineProperty(e, "prototype", { writable: !1 }), r && re(e, r);
+}
+function re(e, r) {
+  return re = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(t, a) {
+    return t.__proto__ = a, t;
+  }, re(e, r);
+}
+function T(e, r, n) {
+  return r = Se(r), r in e ? Object.defineProperty(e, r, { value: n, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = n, e;
+}
+function Se(e) {
+  var r = Ot(e, "string");
+  return z(r) == "symbol" ? r : r + "";
+}
+function Ot(e, r) {
+  if (z(e) != "object" || !e) return e;
+  var n = e[Symbol.toPrimitive];
+  if (n !== void 0) {
+    var t = n.call(e, r || "default");
+    if (z(t) != "object") return t;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (r === "string" ? String : Number)(e);
+}
+var k = /* @__PURE__ */ function(e) {
+  function r() {
+    var n;
+    yt(this, r);
+    for (var t = arguments.length, a = new Array(t), o = 0; o < t; o++)
+      a[o] = arguments[o];
+    return n = bt(this, r, [].concat(a)), T(n, "state", {
+      isAnimationFinished: !0
+    }), T(n, "id", Ge("recharts-area-")), T(n, "handleAnimationEnd", function() {
+      var s = n.props.onAnimationEnd;
+      n.setState({
+        isAnimationFinished: !0
+      }), te(s) && s();
+    }), T(n, "handleAnimationStart", function() {
+      var s = n.props.onAnimationStart;
+      n.setState({
+        isAnimationFinished: !1
+      }), te(s) && s();
+    }), n;
+  }
+  return Et(r, e), gt(r, [{
+    key: "renderDots",
+    value: function(t, a, o) {
+      var s = this.props.isAnimationActive, i = this.state.isAnimationFinished;
+      if (s && !i)
+        return null;
+      var l = this.props, u = l.dot, c = l.points, p = l.dataKey, d = V(this.props, !1), g = V(u, !0), A = c.map(function(x, C) {
+        var E = L(L(L({
+          key: "dot-".concat(C),
+          r: 3
+        }, d), g), {}, {
+          index: C,
+          cx: x.x,
+          cy: x.y,
+          dataKey: p,
+          value: x.value,
+          payload: x.payload,
+          points: c
+        });
+        return r.renderDotItem(u, E);
+      }), O = {
+        clipPath: t ? "url(#clipPath-".concat(a ? "" : "dots-").concat(o, ")") : null
+      };
+      return /* @__PURE__ */ h.createElement(K, $({
+        className: "recharts-area-dots"
+      }, O), A);
+    }
+  }, {
+    key: "renderHorizontalRect",
+    value: function(t) {
+      var a = this.props, o = a.baseLine, s = a.points, i = a.strokeWidth, l = s[0].x, u = s[s.length - 1].x, c = t * Math.abs(l - u), p = X(s.map(function(d) {
+        return d.y || 0;
+      }));
+      return B(o) && typeof o == "number" ? p = Math.max(o, p) : o && Array.isArray(o) && o.length && (p = Math.max(X(o.map(function(d) {
+        return d.y || 0;
+      })), p)), B(p) ? /* @__PURE__ */ h.createElement("rect", {
+        x: l < u ? l : l - c,
+        y: 0,
+        width: c,
+        height: Math.floor(p + (i ? parseInt("".concat(i), 10) : 1))
+      }) : null;
+    }
+  }, {
+    key: "renderVerticalRect",
+    value: function(t) {
+      var a = this.props, o = a.baseLine, s = a.points, i = a.strokeWidth, l = s[0].y, u = s[s.length - 1].y, c = t * Math.abs(l - u), p = X(s.map(function(d) {
+        return d.x || 0;
+      }));
+      return B(o) && typeof o == "number" ? p = Math.max(o, p) : o && Array.isArray(o) && o.length && (p = Math.max(X(o.map(function(d) {
+        return d.x || 0;
+      })), p)), B(p) ? /* @__PURE__ */ h.createElement("rect", {
+        x: 0,
+        y: l < u ? l : l - c,
+        width: p + (i ? parseInt("".concat(i), 10) : 1),
+        height: Math.floor(c)
+      }) : null;
+    }
+  }, {
+    key: "renderClipRect",
+    value: function(t) {
+      var a = this.props.layout;
+      return a === "vertical" ? this.renderVerticalRect(t) : this.renderHorizontalRect(t);
+    }
+  }, {
+    key: "renderAreaStatically",
+    value: function(t, a, o, s) {
+      var i = this.props, l = i.layout, u = i.type, c = i.stroke, p = i.connectNulls, d = i.isRange;
+      i.ref;
+      var g = Oe(i, mt);
+      return /* @__PURE__ */ h.createElement(K, {
+        clipPath: o ? "url(#clipPath-".concat(s, ")") : null
+      }, /* @__PURE__ */ h.createElement(Z, $({}, V(g, !0), {
+        points: t,
+        connectNulls: p,
+        type: u,
+        baseLine: a,
+        layout: l,
+        stroke: "none",
+        className: "recharts-area-area"
+      })), c !== "none" && /* @__PURE__ */ h.createElement(Z, $({}, V(this.props, !1), {
+        className: "recharts-area-curve",
+        layout: l,
+        type: u,
+        connectNulls: p,
+        fill: "none",
+        points: t
+      })), c !== "none" && d && /* @__PURE__ */ h.createElement(Z, $({}, V(this.props, !1), {
+        className: "recharts-area-curve",
+        layout: l,
+        type: u,
+        connectNulls: p,
+        fill: "none",
+        points: a
+      })));
+    }
+  }, {
+    key: "renderAreaWithAnimation",
+    value: function(t, a) {
+      var o = this, s = this.props, i = s.points, l = s.baseLine, u = s.isAnimationActive, c = s.animationBegin, p = s.animationDuration, d = s.animationEasing, g = s.animationId, A = this.state, O = A.prevPoints, x = A.prevBaseLine;
+      return /* @__PURE__ */ h.createElement(He, {
+        begin: c,
+        duration: p,
+        isActive: u,
+        easing: d,
+        from: {
+          t: 0
+        },
+        to: {
+          t: 1
+        },
+        key: "area-".concat(g),
+        onAnimationEnd: this.handleAnimationEnd,
+        onAnimationStart: this.handleAnimationStart
+      }, function(C) {
+        var E = C.t;
+        if (O) {
+          var P = O.length / i.length, y = i.map(function(w, _) {
+            var N = Math.floor(_ * P);
+            if (O[N]) {
+              var j = O[N], R = M(j.x, w.x), F = M(j.y, w.y);
+              return L(L({}, w), {}, {
+                x: R(E),
+                y: F(E)
+              });
+            }
+            return w;
+          }), m;
+          if (B(l) && typeof l == "number") {
+            var v = M(x, l);
+            m = v(E);
+          } else if (le(l) || Xe(l)) {
+            var D = M(x, 0);
+            m = D(E);
+          } else
+            m = l.map(function(w, _) {
+              var N = Math.floor(_ * P);
+              if (x[N]) {
+                var j = x[N], R = M(j.x, w.x), F = M(j.y, w.y);
+                return L(L({}, w), {}, {
+                  x: R(E),
+                  y: F(E)
+                });
+              }
+              return w;
+            });
+          return o.renderAreaStatically(y, m, t, a);
+        }
+        return /* @__PURE__ */ h.createElement(K, null, /* @__PURE__ */ h.createElement("defs", null, /* @__PURE__ */ h.createElement("clipPath", {
+          id: "animationClipPath-".concat(a)
+        }, o.renderClipRect(E))), /* @__PURE__ */ h.createElement(K, {
+          clipPath: "url(#animationClipPath-".concat(a, ")")
+        }, o.renderAreaStatically(i, l, t, a)));
+      });
+    }
+  }, {
+    key: "renderArea",
+    value: function(t, a) {
+      var o = this.props, s = o.points, i = o.baseLine, l = o.isAnimationActive, u = this.state, c = u.prevPoints, p = u.prevBaseLine, d = u.totalLength;
+      return l && s && s.length && (!c && d > 0 || !ce(c, s) || !ce(p, i)) ? this.renderAreaWithAnimation(t, a) : this.renderAreaStatically(s, i, t, a);
+    }
+  }, {
+    key: "render",
+    value: function() {
+      var t, a = this.props, o = a.hide, s = a.dot, i = a.points, l = a.className, u = a.top, c = a.left, p = a.xAxis, d = a.yAxis, g = a.width, A = a.height, O = a.isAnimationActive, x = a.id;
+      if (o || !i || !i.length)
+        return null;
+      var C = this.state.isAnimationFinished, E = i.length === 1, P = be("recharts-area", l), y = p && p.allowDataOverflow, m = d && d.allowDataOverflow, v = y || m, D = le(x) ? this.id : x, w = (t = V(s, !1)) !== null && t !== void 0 ? t : {
+        r: 3,
+        strokeWidth: 2
+      }, _ = w.r, N = _ === void 0 ? 3 : _, j = w.strokeWidth, R = j === void 0 ? 2 : j, F = Ue(s) ? s : {}, ne = F.clipDot, ae = ne === void 0 ? !0 : ne, G = N * 2 + R;
+      return /* @__PURE__ */ h.createElement(K, {
+        className: P
+      }, y || m ? /* @__PURE__ */ h.createElement("defs", null, /* @__PURE__ */ h.createElement("clipPath", {
+        id: "clipPath-".concat(D)
+      }, /* @__PURE__ */ h.createElement("rect", {
+        x: y ? c : c - g / 2,
+        y: m ? u : u - A / 2,
+        width: y ? g : g * 2,
+        height: m ? A : A * 2
+      })), !ae && /* @__PURE__ */ h.createElement("clipPath", {
+        id: "clipPath-dots-".concat(D)
+      }, /* @__PURE__ */ h.createElement("rect", {
+        x: c - G / 2,
+        y: u - G / 2,
+        width: g + G,
+        height: A + G
+      }))) : null, E ? null : this.renderArea(v, D), (s || E) && this.renderDots(v, ae, D), (!O || C) && Ye.renderCallByParent(this.props, i));
+    }
+  }], [{
+    key: "getDerivedStateFromProps",
+    value: function(t, a) {
+      return t.animationId !== a.prevAnimationId ? {
+        prevAnimationId: t.animationId,
+        curPoints: t.points,
+        curBaseLine: t.baseLine,
+        prevPoints: a.curPoints,
+        prevBaseLine: a.curBaseLine
+      } : t.points !== a.curPoints || t.baseLine !== a.curBaseLine ? {
+        curPoints: t.points,
+        curBaseLine: t.baseLine
+      } : null;
+    }
+  }]);
+}(Ce);
+Ee = k;
+T(k, "displayName", "Area");
+T(k, "defaultProps", {
+  stroke: "#3182bd",
+  fill: "#3182bd",
+  fillOpacity: 0.6,
+  xAxisId: 0,
+  yAxisId: 0,
+  legendType: "line",
+  connectNulls: !1,
+  // points of area
+  points: [],
+  dot: !1,
+  activeDot: !0,
+  hide: !1,
+  isAnimationActive: !Ke.isSsr,
+  animationBegin: 0,
+  animationDuration: 1500,
+  animationEasing: "ease"
+});
+T(k, "getBaseValue", function(e, r, n, t) {
+  var a = e.layout, o = e.baseValue, s = r.props.baseValue, i = s ?? o;
+  if (B(i) && typeof i == "number")
+    return i;
+  var l = a === "horizontal" ? t : n, u = l.scale.domain();
+  if (l.type === "number") {
+    var c = Math.max(u[0], u[1]), p = Math.min(u[0], u[1]);
+    return i === "dataMin" ? p : i === "dataMax" || c < 0 ? c : Math.max(Math.min(u[0], u[1]), 0);
+  }
+  return i === "dataMin" ? u[0] : i === "dataMax" ? u[1] : u[0];
+});
+T(k, "getComposedData", function(e) {
+  var r = e.props, n = e.item, t = e.xAxis, a = e.yAxis, o = e.xAxisTicks, s = e.yAxisTicks, i = e.bandSize, l = e.dataKey, u = e.stackedData, c = e.dataStartIndex, p = e.displayedData, d = e.offset, g = r.layout, A = u && u.length, O = Ee.getBaseValue(r, n, t, a), x = g === "horizontal", C = !1, E = p.map(function(y, m) {
+    var v;
+    A ? v = u[c + m] : (v = oe(y, l), Array.isArray(v) ? C = !0 : v = [O, v]);
+    var D = v[1] == null || A && oe(y, l) == null;
+    return x ? {
+      x: se({
+        axis: t,
+        ticks: o,
+        bandSize: i,
+        entry: y,
+        index: m
+      }),
+      y: D ? null : a.scale(v[1]),
+      value: v,
+      payload: y
+    } : {
+      x: D ? null : t.scale(v[1]),
+      y: se({
+        axis: a,
+        ticks: s,
+        bandSize: i,
+        entry: y,
+        index: m
+      }),
+      value: v,
+      payload: y
+    };
+  }), P;
+  return A || C ? P = E.map(function(y) {
+    var m = Array.isArray(y.value) ? y.value[0] : null;
+    return x ? {
+      x: y.x,
+      y: m != null && y.y != null ? a.scale(m) : null
+    } : {
+      x: m != null ? t.scale(m) : null,
+      y: y.y
+    };
+  }) : P = x ? a.scale(O) : t.scale(O), L({
+    points: E,
+    baseLine: P,
+    layout: g,
+    isRange: C
+  }, d);
+});
+T(k, "renderDotItem", function(e, r) {
+  var n;
+  if (/* @__PURE__ */ h.isValidElement(e))
+    n = /* @__PURE__ */ h.cloneElement(e, r);
+  else if (te(e))
+    n = e(r);
+  else {
+    var t = be("recharts-area-dot", typeof e != "boolean" ? e.className : ""), a = r.key, o = Oe(r, vt);
+    n = /* @__PURE__ */ h.createElement(We, $({}, o, {
+      key: a,
+      className: t
+    }));
+  }
+  return n;
+});
+var wt = ye({
+  chartName: "BarChart",
+  GraphicalChild: ee,
+  defaultTooltipEventType: "axis",
+  validateTooltipEventTypes: ["axis", "item"],
+  axisComponents: [{
+    axisType: "xAxis",
+    AxisComp: U
+  }, {
+    axisType: "yAxis",
+    AxisComp: Y
+  }],
+  formatAxisMap: ge
+}), St = ye({
+  chartName: "AreaChart",
+  GraphicalChild: k,
+  axisComponents: [{
+    axisType: "xAxis",
+    AxisComp: U
+  }, {
+    axisType: "yAxis",
+    AxisComp: Y
+  }],
+  formatAxisMap: ge
+});
+const { Content: Ct } = qe, br = () => {
+  const [e, r] = h.useState("line"), { breakpoint: n } = Pe(), t = n === Ne.narrow, [a, o] = De("1"), s = (c) => {
+    o(c.id), r(c.id === "1" ? "line" : "bar");
+  }, i = {
+    totalDeliveries: 107,
+    evDeliveries: 89,
+    iceDeliveries: 68
+  };
+  return /* @__PURE__ */ S(Ct, { style: { margin: "24px 16px", padding: 24, background: "#fff" }, children: [
+    /* @__PURE__ */ S(
+      ie,
+      {
+        direction: t ? "vertical" : "horizontal",
+        size: "large",
+        style: t ? {
+          display: "flex",
+          flexDirection: "column",
+          gap: 8,
+          marginBottom: 26,
+          justifyContent: "flex-start",
+          width: "100%"
+        } : {
+          marginBottom: 26,
+          justifyContent: "space-between",
+          width: "100%"
+        },
+        children: [
+          /* @__PURE__ */ S(
+            _e,
+            {
+              style: {
+                width: "100%"
+              },
+              children: [
+                /* @__PURE__ */ f(Q, { span: 8, style: { textAlign: "center", padding: "0 4px" }, children: /* @__PURE__ */ S(H, { children: [
+                  /* @__PURE__ */ f(
+                    I,
+                    {
+                      variant: "heading3",
+                      level: 4,
+                      style: {
+                        whiteSpace: "nowrap"
+                      },
+                      children: "Total Deliveries"
+                    }
+                  ),
+                  /* @__PURE__ */ f(I, { variant: "digits2", level: 2, children: i.totalDeliveries })
+                ] }) }),
+                /* @__PURE__ */ f(Q, { span: 8, style: { textAlign: "center", padding: "0 4px" }, children: /* @__PURE__ */ S(H, { children: [
+                  /* @__PURE__ */ f(I, { variant: "heading3", level: 4, children: "EV Deliveries" }),
+                  /* @__PURE__ */ f(I, { variant: "digits2", level: 2, children: i.evDeliveries })
+                ] }) }),
+                /* @__PURE__ */ f(Q, { span: 8, style: { textAlign: "center", padding: "0 4px" }, children: /* @__PURE__ */ S(H, { children: [
+                  /* @__PURE__ */ f(I, { variant: "heading3", level: 4, children: "ICE Deliveries" }),
+                  /* @__PURE__ */ f(I, { variant: "digits2", level: 2, children: i.iceDeliveries })
+                ] }) })
+              ]
+            }
+          ),
+          /* @__PURE__ */ f(
+            W,
+            {
+              title: "EV (Goal Increase 10%)",
+              value: 52.28,
+              precision: 2,
+              valueStyle: { color: "#3f8600" },
+              prefix: /* @__PURE__ */ f(Ae, {}),
+              suffix: "%"
+            }
+          ),
+          /* @__PURE__ */ f(
+            W,
+            {
+              title: "ICE (Goal Reduce 10%)",
+              value: 25.28,
+              precision: 2,
+              valueStyle: { color: "#3f8600" },
+              prefix: /* @__PURE__ */ f(xe, {}),
+              suffix: "%"
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ f(
+      Te,
+      {
+        columns: ke,
+        dataSource: J,
+        rowKey: "id",
+        pagination: { pageSize: 5 },
+        scroll: { x: "max-content" }
+      }
+    ),
+    /* @__PURE__ */ S(H, { style: { marginTop: 24 }, children: [
+      /* @__PURE__ */ f("div", { style: { marginBottom: 24 }, children: /* @__PURE__ */ f(I, { variant: "heading3", level: 4, children: "Delivery Trends" }) }),
+      e === "line" ? /* @__PURE__ */ S(
+        St,
+        {
+          width: t ? window.innerWidth - 50 : 800,
+          height: 300,
+          data: J.map((c) => ({
+            deliveryTime: c.deliveryTime,
+            EV: c.vehicleType === "EV" ? c.parcelsDelivered : 0,
+            ICE: c.vehicleType === "ICE" ? c.parcelsDelivered : 0
+          })),
+          children: [
+            /* @__PURE__ */ f(ue, { strokeDasharray: "3 3" }),
+            /* @__PURE__ */ f(U, { dataKey: "deliveryTime" }),
+            /* @__PURE__ */ f(Y, {}),
+            /* @__PURE__ */ f(pe, {}),
+            /* @__PURE__ */ f(de, {}),
+            /* @__PURE__ */ S("defs", { children: [
+              /* @__PURE__ */ S("linearGradient", { id: "colorEV", x1: "0", y1: "0", x2: "0", y2: "1", children: [
+                /* @__PURE__ */ f("stop", { offset: "5%", stopColor: "#8884d8", stopOpacity: 0.8 }),
+                /* @__PURE__ */ f("stop", { offset: "95%", stopColor: "#8884d8", stopOpacity: 0.1 })
+              ] }),
+              /* @__PURE__ */ S("linearGradient", { id: "colorICE", x1: "0", y1: "0", x2: "0", y2: "1", children: [
+                /* @__PURE__ */ f("stop", { offset: "5%", stopColor: "#82ca9d", stopOpacity: 0.8 }),
+                /* @__PURE__ */ f("stop", { offset: "95%", stopColor: "#82ca9d", stopOpacity: 0.1 })
+              ] })
+            ] }),
+            /* @__PURE__ */ f(
+              k,
+              {
+                type: "monotone",
+                dataKey: "EV",
+                stroke: "#8884d8",
+                fill: "url(#colorEV)",
+                name: "EV Deliveries"
+              }
+            ),
+            /* @__PURE__ */ f(
+              k,
+              {
+                type: "monotone",
+                dataKey: "ICE",
+                stroke: "#82ca9d",
+                fill: "url(#colorICE)",
+                name: "ICE Deliveries"
+              }
+            )
+          ]
+        }
+      ) : /* @__PURE__ */ S(
+        wt,
+        {
+          width: t ? window.innerWidth - 50 : 800,
+          height: 300,
+          data: J.map((c) => ({
+            deliveryTime: c.deliveryTime,
+            EV: c.vehicleType === "EV" ? c.parcelsDelivered : 0,
+            ICE: c.vehicleType === "ICE" ? c.parcelsDelivered : 0
+          })),
+          children: [
+            /* @__PURE__ */ f(ue, { strokeDasharray: "3 3" }),
+            /* @__PURE__ */ f(U, { dataKey: "deliveryTime" }),
+            /* @__PURE__ */ f(Y, {}),
+            /* @__PURE__ */ f(pe, {}),
+            /* @__PURE__ */ f(de, {}),
+            /* @__PURE__ */ f(ee, { dataKey: "EV", fill: "#8884d8", name: "EV Deliveries" }),
+            /* @__PURE__ */ f(ee, { dataKey: "ICE", fill: "#82ca9d", name: "ICE Deliveries" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ f("div", { style: { marginBottom: 16 }, children: /* @__PURE__ */ S(ie, { direction: "vertical", size: "small", children: [
+        /* @__PURE__ */ f(I, { variant: "body2", children: "Chart Type:" }),
+        /* @__PURE__ */ f(
+          je,
+          {
+            selectedId: a,
+            options: [
+              { id: "1", label: "Line Chart" },
+              { id: "2", label: "Bar Chart" }
+            ],
+            onChange: s
+          }
+        )
+      ] }) })
+    ] })
+  ] });
+};
+export {
+  br as default
+};