eco-vue-js 0.10.77 → 0.10.79

package/dist/components/Chart/WChartLine.vue.d.ts

@@ -0,0 +1,38 @@
+import { ChartContext } from './types';
+declare const _default: <Data extends Record<string, number>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, never> & ({
+        data: Data[];
+        xKey: keyof Data;
+        yKey: keyof Data;
+        strokeStyle?: "solid" | "dashed" | "dotted";
+        strokeWidth?: number;
+        hasArea?: boolean;
+        showPoints?: boolean;
+        pointRadius?: number;
+        disableMessage?: string;
+    } & ChartContext) & Partial<{}>> & import('vue').PublicProps;
+    expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {
+        gradient?(_: {
+            scaleY: (value: number) => number;
+            scaleYPercent: (value: number) => number;
+            topPercent: number;
+            bottomPercent: number;
+        }): any;
+        tooltip?(_: {
+            d: Data;
+            x: number;
+            y: number;
+            index: number | null;
+        }): any;
+    };
+    emit: {};
+}>) => import('vue').VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T]: T[K];
+} & {};
+//# sourceMappingURL=WChartLine.vue.d.ts.map

package/dist/components/Chart/WChartLine.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WChartLine.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/WChartLine.vue"],"names":[],"mappings":"AAsIA;AA8UA,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,SAAS,CAAA;yBAMxB,IAAI,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACnD,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,eAAe,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EACjE;WA6YO,mBAAmB,CAAC;cAzYpB,IAAI,EAAE;cACN,MAAM,IAAI;cACV,MAAM,IAAI;sBACF,OAAO,GAAG,QAAQ,GAAG,QAAQ;sBAC7B,MAAM;kBACV,OAAO;qBACJ,OAAO;sBACN,MAAM;yBACH,MAAM;mCAiYqE,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;;;mCAjOmB,MAAM,KAAG,MAAM;;;YAqLf,GAAG;;;;;;YACJ,GAAG;;UA6CzB,EAAE;EAEL,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAE;AAxZzE,wBAwZ4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}

package/dist/components/Chart/WChartLine.vue.js

@@ -0,0 +1,296 @@
+import { defineComponent, useId, useTemplateRef, ref, computed, watch, nextTick, onUnmounted, createElementBlock, openBlock, createElementVNode, createCommentVNode, unref, renderSlot, normalizeProps, guardReactiveProps, createVNode, withCtx, toDisplayString } from 'vue';
+import _sfc_main$1 from '../Tooltip/WTooltip.vue.js';
+
+const _hoisted_1 = { key: 0 };
+const _hoisted_2 = ["id"];
+const _hoisted_3 = ["id"];
+const _hoisted_4 = ["id"];
+const _hoisted_5 = ["d", "fill"];
+const _hoisted_6 = ["d", "stroke-width", "stroke-dasharray"];
+const _hoisted_7 = { key: 2 };
+const _hoisted_8 = ["cx", "cy", "r"];
+const _hoisted_9 = { key: 0 };
+const _hoisted_10 = ["transform"];
+const _hoisted_11 = ["x", "y1", "y2"];
+const _hoisted_12 = ["y"];
+const _hoisted_13 = ["fill", "mask"];
+const _hoisted_14 = {
+  key: 1,
+  y: "0",
+  x: "0",
+  width: "100%",
+  height: "100%"
+};
+const _hoisted_15 = { class: "text-description text-2xs flex size-full cursor-not-allowed items-center opacity-40" };
+const _hoisted_16 = { class: "pl-36" };
+const ROUND_FACTOR = 100;
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "WChartLine",
+  props: {
+    data: {},
+    xKey: {},
+    yKey: {},
+    strokeStyle: {},
+    strokeWidth: {},
+    hasArea: { type: Boolean },
+    showPoints: { type: Boolean },
+    pointRadius: {},
+    disableMessage: {},
+    scaleX: { type: Function },
+    scaleY: { type: Function },
+    svgWidth: {},
+    svgHeight: {},
+    top: {},
+    bottom: {},
+    left: {},
+    right: {},
+    xExtent: {},
+    onUpdateDomain: { type: Function }
+  },
+  setup(__props) {
+    const props = __props;
+    const gradientId = useId();
+    const gradientAreaId = useId();
+    const maskId = useId();
+    const lineId = useId();
+    const overlayRef = useTemplateRef("overlay");
+    const tooltipRef = useTemplateRef("tooltip");
+    const hoveredIndex = ref(null);
+    const strokeDashArray = computed(() => {
+      const width = props.svgWidth - props.left - props.right;
+      switch (props.strokeStyle) {
+        case "dashed":
+          return width / (width > 500 ? 33 : 13);
+        case "dotted":
+          return "2,2";
+        default:
+          return void 0;
+      }
+    });
+    const dataFiltered = computed(
+      () => props.data.filter(
+        (data) => typeof data[props.yKey] === "number" && typeof data[props.xKey] === "number" && data[props.xKey] >= props.xExtent[0] && data[props.xKey] <= props.xExtent[1]
+      )
+    );
+    const round = (value) => Math.round(value * ROUND_FACTOR) / ROUND_FACTOR;
+    const preparedData = computed(() => {
+      const result = dataFiltered.value.map((d) => ({
+        x: round(Math.min(Math.max(props.scaleX(d[props.xKey]), props.left), props.svgWidth - props.right)),
+        y: round(props.scaleY(d[props.yKey])),
+        d
+      }));
+      const lastIndex = result.length - 1;
+      if (result[lastIndex] && result[lastIndex].x !== props.left) result.push({ ...result[lastIndex], x: props.left });
+      if (result[0] && result[0].x !== props.right) result.unshift({ ...result[0], x: props.svgWidth - props.right });
+      return result;
+    });
+    const tooltipData = computed(() => {
+      return preparedData.value.slice(
+        preparedData.value[0]?.d === preparedData.value[1]?.d ? 1 : 0,
+        preparedData.value[preparedData.value.length - 1]?.d === preparedData.value[preparedData.value.length - 2]?.d ? -1 : void 0
+      ).reverse();
+    });
+    const hoveredData = computed(() => {
+      if (hoveredIndex.value === null || !tooltipData.value[hoveredIndex.value]) return null;
+      return tooltipData.value[hoveredIndex.value];
+    });
+    const findNearestDataPoint = (mouseX) => {
+      const data = tooltipData.value;
+      if (data.length === 0) return null;
+      if (data.length === 1) return 0;
+      let left = 0;
+      let right = data.length - 1;
+      let closest = 0;
+      let minDistance = Math.abs(data[0].x - mouseX);
+      while (left <= right) {
+        const mid = Math.floor((left + right) / 2);
+        const distance = Math.abs(data[mid].x - mouseX);
+        if (distance < minDistance) {
+          minDistance = distance;
+          closest = mid;
+        }
+        if (data[mid].x < mouseX) {
+          left = mid + 1;
+        } else {
+          right = mid - 1;
+        }
+      }
+      return closest;
+    };
+    const handleMouseMove = (event) => {
+      if (!overlayRef.value) return;
+      const rect = overlayRef.value.getBoundingClientRect();
+      const mouseX = event.clientX - rect.left;
+      const nearestIndex = findNearestDataPoint(mouseX);
+      if (nearestIndex !== null) {
+        hoveredIndex.value = nearestIndex;
+      } else {
+        hoveredIndex.value = null;
+      }
+    };
+    const closeTooltip = () => {
+      if (tooltipRef.value) tooltipRef.value?.close();
+      else hoveredIndex.value = null;
+    };
+    const linePath = computed(() => {
+      if (preparedData.value.length === 0) return "";
+      const commands = preparedData.value.map((d, i) => {
+        const command = i === 0 ? "M" : "L";
+        return `${command} ${d.x} ${d.y}`;
+      });
+      return commands.join(" ");
+    });
+    const areaPath = computed(() => {
+      if (!props.hasArea || preparedData.value.length === 0) return "";
+      const y0 = props.svgHeight - props.bottom;
+      let path = `M ${preparedData.value[0].x} ${y0}`;
+      path += ` L ${preparedData.value[0].x} ${preparedData.value[0].y}`;
+      for (let i = 1; i < preparedData.value.length; i++) {
+        path += ` L ${preparedData.value[i].x} ${preparedData.value[i].y}`;
+      }
+      path += ` L ${preparedData.value[preparedData.value.length - 1].x} ${y0}`;
+      path += " Z";
+      return path;
+    });
+    const yExtent = computed(() => {
+      if (props.data.length === 0) return [0, 100];
+      const yValues = dataFiltered.value.map((d) => d[props.yKey]);
+      return yValues.length > 0 ? [0, Math.max(...yValues)] : [0, 100];
+    });
+    const emitDomainUpdate = () => {
+      props.onUpdateDomain?.(lineId, yExtent.value);
+    };
+    const scaleYPercent = (value) => props.scaleY(value) / props.svgHeight;
+    watch(() => yExtent.value[0], emitDomainUpdate, { immediate: true });
+    watch(() => yExtent.value[1], emitDomainUpdate, { immediate: true });
+    watch(hoveredIndex, (value) => {
+      if (value !== null) nextTick(() => tooltipRef.value?.open());
+    });
+    watch(() => tooltipRef.value?.isOpen ?? false, (value) => {
+      if (value) return;
+      hoveredIndex.value = null;
+    });
+    onUnmounted(() => {
+      props.onUpdateDomain?.(lineId, [0, 0]);
+    });
+    return (_ctx, _cache) => {
+      return dataFiltered.value.length ? (openBlock(), createElementBlock("g", _hoisted_1, [
+        createElementVNode("defs", null, [
+          _ctx.$slots.gradient ? (openBlock(), createElementBlock("linearGradient", {
+            key: 0,
+            id: unref(gradientId),
+            gradientTransform: "rotate(90)"
+          }, [
+            renderSlot(_ctx.$slots, "gradient", normalizeProps(guardReactiveProps({
+              scaleY: _ctx.scaleY,
+              scaleYPercent,
+              topPercent: _ctx.top / _ctx.svgHeight,
+              bottomPercent: 1 - _ctx.bottom / _ctx.svgHeight
+            })))
+          ], 8, _hoisted_2)) : createCommentVNode("", true),
+          _ctx.hasArea ? (openBlock(), createElementBlock("linearGradient", {
+            key: 1,
+            id: unref(gradientAreaId),
+            gradientTransform: "rotate(90)"
+          }, _cache[0] || (_cache[0] = [
+            createElementVNode("stop", {
+              offset: "0%",
+              "stop-color": "#222222"
+            }, null, -1),
+            createElementVNode("stop", {
+              offset: "70%",
+              "stop-color": "#111111"
+            }, null, -1),
+            createElementVNode("stop", {
+              offset: "100%",
+              "stop-color": "#000000"
+            }, null, -1)
+          ]), 8, _hoisted_3)) : createCommentVNode("", true),
+          createElementVNode("mask", { id: unref(maskId) }, [
+            _ctx.hasArea && areaPath.value ? (openBlock(), createElementBlock("path", {
+              key: 0,
+              d: areaPath.value,
+              fill: `url(#${unref(gradientAreaId)})`,
+              class: "transition-[d]"
+            }, null, 8, _hoisted_5)) : createCommentVNode("", true),
+            linePath.value ? (openBlock(), createElementBlock("path", {
+              key: 1,
+              d: linePath.value,
+              fill: "none",
+              "stroke-width": _ctx.strokeWidth ?? 2,
+              "stroke-dasharray": strokeDashArray.value,
+              stroke: "white",
+              "stroke-linejoin": "round",
+              "stroke-linecap": "round",
+              class: "transition-[d]"
+            }, null, 8, _hoisted_6)) : createCommentVNode("", true),
+            _ctx.$slots.tooltip && hoveredData.value && unref(tooltipRef)?.isOpen ? (openBlock(), createElementBlock("g", _hoisted_7, [
+              createElementVNode("circle", {
+                cx: hoveredData.value.x,
+                cy: hoveredData.value.y,
+                r: _ctx.pointRadius ?? 3,
+                fill: "white"
+              }, null, 8, _hoisted_8)
+            ])) : createCommentVNode("", true)
+          ], 8, _hoisted_4)
+        ]),
+        _ctx.$slots.tooltip && tooltipData.value.length !== 0 ? (openBlock(), createElementBlock("g", _hoisted_9, [
+          createElementVNode("rect", {
+            ref: "overlay",
+            width: "100%",
+            height: "100%",
+            fill: "transparent",
+            class: "cursor-crosshair",
+            onMousemove: handleMouseMove,
+            onMouseleave: closeTooltip
+          }, null, 544),
+          createElementVNode("g", {
+            transform: `translate(${hoveredData.value?.x ?? 0} 0)`
+          }, [
+            hoveredData.value && unref(tooltipRef)?.isOpen ? (openBlock(), createElementBlock("line", {
+              key: 0,
+              x: hoveredData.value.x,
+              y1: _ctx.top,
+              y2: _ctx.svgHeight - _ctx.bottom,
+              stroke: "currentColor",
+              "stroke-width": "1",
+              class: "text-description pointer-events-none"
+            }, null, 8, _hoisted_11)) : createCommentVNode("", true),
+            (openBlock(), createElementBlock("foreignObject", {
+              y: _ctx.svgHeight - _ctx.bottom
+            }, [
+              createVNode(_sfc_main$1, {
+                ref: "tooltip",
+                "no-trigger": ""
+              }, {
+                default: withCtx(() => [
+                  hoveredData.value ? renderSlot(_ctx.$slots, "tooltip", {
+                    key: 0,
+                    d: hoveredData.value.d,
+                    x: hoveredData.value.x,
+                    y: hoveredData.value.y,
+                    index: hoveredIndex.value
+                  }) : createCommentVNode("", true)
+                ]),
+                _: 3
+              }, 512)
+            ], 8, _hoisted_12))
+          ], 8, _hoisted_10)
+        ])) : createCommentVNode("", true),
+        createElementVNode("rect", {
+          width: "100%",
+          height: "100%",
+          fill: _ctx.$slots.gradient ? `url(#${unref(gradientId)})` : "currentColor",
+          mask: `url(#${unref(maskId)})`,
+          class: "pointer-events-none transition-[color]"
+        }, null, 8, _hoisted_13)
+      ])) : (openBlock(), createElementBlock("foreignObject", _hoisted_14, [
+        createElementVNode("div", _hoisted_15, [
+          createElementVNode("div", _hoisted_16, toDisplayString(_ctx.disableMessage ?? "No data is currently available"), 1)
+        ])
+      ]));
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/components/Chart/WChartLine.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from './WChartLine.vue.js';
+
+
+
+export { _sfc_main as default };

package/dist/components/Chart/WChartLinear.vue.d.ts

@@ -0,0 +1,49 @@
+import { ChartContext } from './types';
+import { VNode } from 'vue';
+type __VLS_Props = {
+    xDomain: [number, number];
+    yDomainGetter?: (extent: [number, number]) => [number, number];
+    height?: number;
+    xHidden?: boolean;
+    yHidden?: boolean;
+    yFormat?: (value: number) => string;
+    top?: number;
+    bottom?: number;
+    left?: number;
+    right?: number;
+    skeleton?: boolean;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        default: (props: ChartContext) => VNode[];
+    }> & {
+        default: (props: ChartContext) => VNode[];
+    };
+    refs: {
+        container: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {
+    updateSize: () => void;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    bottom: number;
+    left: number;
+    right: number;
+    top: number;
+    height: number;
+    yDomainGetter: (extent: [number, number]) => [number, number];
+    yFormat: (value: number) => string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    container: HTMLDivElement;
+}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=WChartLinear.vue.d.ts.map

package/dist/components/Chart/WChartLinear.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WChartLinear.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/WChartLinear.vue"],"names":[],"mappings":"AAoDA;AAqKA,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,SAAS,CAAA;AAEzC,OAAO,EAAC,KAAK,KAAK,EAAmE,MAAM,KAAK,CAAA;AAShG,KAAK,WAAW,GAAG;IACf,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACzB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAC9D,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IACnC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAC;AAsGJ,iBAAS,cAAc;WA+FT,OAAO,IAA6B;;iBA7GvC,CAAC,KAAK,EAAE,YAAY,KAAK,KAAK,EAAE;;iBAAhC,CAAC,KAAK,EAAE,YAAY,KAAK,KAAK,EAAE;;;;;;EAkH1C;AAmBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;YAlOR,MAAM;UACR,MAAM;WACL,MAAM;SAHR,MAAM;YAJH,MAAM;mBADC,CAAC,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,EAAE,MAAM,CAAC;aAIpD,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM;;;kBA8OrC,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/Chart/WChartLinear.vue.js

@@ -0,0 +1,126 @@
+import { defineComponent, ref, useTemplateRef, computed, watch, onMounted, onBeforeUnmount, createElementBlock, openBlock, normalizeClass, createBlock, createCommentVNode, renderSlot, unref } from 'vue';
+import WSkeleton from '../Skeleton/WSkeleton.vue.js';
+import DOMListenerContainer from '../../utils/DOMListenerContainer.js';
+import { dateFormat } from '../../utils/dateTime.js';
+import _sfc_main$1 from './components/ChartAxis.vue.js';
+
+const _hoisted_1 = ["height", "width"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "WChartLinear",
+  props: {
+    xDomain: {},
+    yDomainGetter: { type: Function, default: void 0 },
+    height: { default: 0 },
+    xHidden: { type: Boolean },
+    yHidden: { type: Boolean },
+    yFormat: { type: Function, default: void 0 },
+    top: { default: 10 },
+    bottom: { default: 20 },
+    left: { default: 40 },
+    right: { default: 32 },
+    skeleton: { type: Boolean }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const svgWidth = ref(0);
+    const svgHeight = ref(props.height);
+    const containerRef = useTemplateRef("container");
+    const xExtent = computed(() => props.xDomain);
+    const lineDomains = ref(/* @__PURE__ */ new Map());
+    const yExtent = computed(() => {
+      if (lineDomains.value.size === 0) return [0, 100];
+      const allYValues = [];
+      lineDomains.value.forEach((domain) => {
+        allYValues.push(...domain);
+      });
+      return allYValues.length > 0 ? [Math.min(...allYValues), Math.max(...allYValues)] : [0, 100];
+    });
+    const yDomainComputed = computed(() => {
+      if (props.yDomainGetter) return props.yDomainGetter(yExtent.value);
+      const [min, max] = yExtent.value;
+      const yRoundFactor = min > -100 && min < 100 && max < 100 ? 10 : 100;
+      return [
+        Math.floor((min > 0 ? 0 : min) / yRoundFactor) * yRoundFactor,
+        Math.max(Math.ceil(max / yRoundFactor) * yRoundFactor, yRoundFactor)
+      ];
+    });
+    const handleDomainUpdate = (lineId, yExtent2) => {
+      lineDomains.value.set(lineId, yExtent2);
+    };
+    const scaleX = (value) => props.left + (value - xExtent.value[0]) / (xExtent.value[1] - xExtent.value[0]) * (svgWidth.value - props.right - props.left);
+    const scaleY = (value) => svgHeight.value - props.bottom - (value - yDomainComputed.value[0]) / (yDomainComputed.value[1] - yDomainComputed.value[0]) * (svgHeight.value - props.bottom - props.top);
+    const updateSize = () => {
+      if (!containerRef.value) return;
+      svgWidth.value = Math.floor(containerRef.value.offsetWidth);
+      svgHeight.value = props.height || Math.floor(containerRef.value.parentElement?.offsetHeight ?? containerRef.value.offsetHeight);
+    };
+    const animationFrameId = ref();
+    const requestUpdateWidth = () => {
+      if (animationFrameId.value) cancelAnimationFrame(animationFrameId.value);
+      animationFrameId.value = requestAnimationFrame(updateSize);
+    };
+    watch(() => props.height, (newHeight) => {
+      if (newHeight) svgHeight.value = newHeight;
+    });
+    const listenerContainer = new DOMListenerContainer([window], ["resize"], requestUpdateWidth);
+    onMounted(() => {
+      updateSize();
+    });
+    onBeforeUnmount(() => {
+      listenerContainer.destroy();
+    });
+    __expose({
+      updateSize
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref: "container",
+        class: normalizeClass({
+          "size-full cursor-progress": _ctx.skeleton
+        })
+      }, [
+        _ctx.skeleton ? (openBlock(), createBlock(WSkeleton, {
+          key: 0,
+          class: "w-skeleton-w-full w-skeleton-h-full w-skeleton-rounded-3xl"
+        })) : svgWidth.value !== 0 && svgHeight.value !== 0 ? (openBlock(), createElementBlock("svg", {
+          key: 1,
+          height: svgHeight.value,
+          width: svgWidth.value,
+          class: "min-w-0"
+        }, [
+          !_ctx.xHidden ? (openBlock(), createBlock(_sfc_main$1, {
+            key: 0,
+            orientation: "x",
+            scale: scaleX,
+            format: (value) => unref(dateFormat)(new Date(value)),
+            domain: xExtent.value,
+            transform: `translate(0, ${svgHeight.value - _ctx.bottom})`
+          }, null, 8, ["format", "domain", "transform"])) : createCommentVNode("", true),
+          !_ctx.yHidden ? (openBlock(), createBlock(_sfc_main$1, {
+            key: 1,
+            orientation: "y",
+            scale: scaleY,
+            domain: yDomainComputed.value,
+            format: _ctx.yFormat,
+            transform: `translate(${_ctx.left}, 0)`
+          }, null, 8, ["domain", "format", "transform"])) : createCommentVNode("", true),
+          !_ctx.skeleton ? renderSlot(_ctx.$slots, "default", {
+            key: 2,
+            scaleX,
+            scaleY,
+            svgWidth: svgWidth.value,
+            svgHeight: svgHeight.value,
+            top: _ctx.top,
+            bottom: _ctx.bottom,
+            left: _ctx.left,
+            right: _ctx.right,
+            xExtent: xExtent.value,
+            onUpdateDomain: handleDomainUpdate
+          }) : createCommentVNode("", true)
+        ], 8, _hoisted_1)) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/components/Chart/WChartLinear.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from './WChartLinear.vue.js';
+
+
+
+export { _sfc_main as default };

package/dist/components/Chart/components/ChartAxis.vue.d.ts

@@ -0,0 +1,10 @@
+type __VLS_Props = {
+    orientation: 'x' | 'y';
+    scale: (value: number) => number;
+    domain: [number, number];
+    format: (value: number) => string;
+    transform: string;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, SVGGElement>;
+export default _default;
+//# sourceMappingURL=ChartAxis.vue.d.ts.map

package/dist/components/Chart/components/ChartAxis.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartAxis.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/Chart/components/ChartAxis.vue"],"names":[],"mappings":"AA6BA;AA4CA,KAAK,WAAW,GAAG;IACjB,WAAW,EAAE,GAAG,GAAG,GAAG,CAAA;IACtB,KAAK,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IAChC,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACxB,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IACjC,SAAS,EAAE,MAAM,CAAA;CAClB,CAAC;;AA8DF,wBAOG"}

package/dist/components/Chart/components/ChartAxis.vue.js

@@ -0,0 +1,40 @@
+import { defineComponent, createElementBlock, openBlock, Fragment, renderList, createElementVNode, mergeProps, toDisplayString, unref } from 'vue';
+import { numberCompactFormatter } from '../../../utils/utils.js';
+
+const _hoisted_1 = ["transform"];
+const _hoisted_2 = ["transform"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ChartAxis",
+  props: {
+    orientation: {},
+    scale: { type: Function },
+    domain: {},
+    format: { type: Function },
+    transform: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("g", {
+        class: "text-description font-medium",
+        "font-size": "8",
+        transform: _ctx.transform
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.domain, (item) => {
+          return openBlock(), createElementBlock("g", {
+            key: item,
+            transform: `translate(${_ctx.orientation === "x" ? `${_ctx.scale(item)}, 0` : `0, ${_ctx.scale(item)}`})`
+          }, [
+            createElementVNode("line", mergeProps({ ref_for: true }, _ctx.orientation === "x" ? { y2: 6 } : { x2: -6 }, { stroke: "currentcolor" }), null, 16),
+            createElementVNode("text", mergeProps(
+              { ref_for: true },
+              _ctx.orientation === "x" ? { y: 8, dy: "0.72em", "text-anchor": "middle" } : { x: -9, dy: "0.32em", "text-anchor": "end" },
+              { fill: "currentcolor" }
+            ), toDisplayString(_ctx.format?.(item) ?? unref(numberCompactFormatter).format(item)), 17)
+          ], 8, _hoisted_2);
+        }), 128))
+      ], 8, _hoisted_1);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/components/Chart/components/ChartAxis.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from './ChartAxis.vue.js';
+
+
+
+export { _sfc_main as default };

package/dist/components/Chart/types.d.ts

@@ -0,0 +1,16 @@
+export interface ChartContext {
+    /** Scaling functions */
+    scaleX: (value: number) => number;
+    scaleY: (value: number) => number;
+    /** Chart dimensions */
+    svgWidth: number;
+    svgHeight: number;
+    top: number;
+    bottom: number;
+    left: number;
+    right: number;
+    xExtent: [number, number];
+    /** Domain update handler */
+    onUpdateDomain: (lineId: string, yExtent: [number, number]) => void;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/components/Chart/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,YAAY;IAC3B,wBAAwB;IACxB,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IACjC,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IACjC,uBAAuB;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,MAAM,CAAA;IACjB,GAAG,EAAE,MAAM,CAAA;IACX,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACzB,4BAA4B;IAC5B,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAA;CACpE"}

package/dist/components/DragContainer/use/useDragContainer.js

@@ -7,6 +7,7 @@ import 'vue-router';
 import '@tanstack/vue-query';
 import '../../Button/WButton.vue.js';
 import '../../../utils/mobile.js';
+import '../../Tooltip/models/tooltipMeta.js';
 import '../../Button/WButtonDropdown.vue.js';
 import '../../../utils/supportsPassive.js';
 import '../../Dropdown/utils/DropdownStyle.js';

package/dist/components/InfiniteList/components/InfiniteListScroll.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InfiniteListScroll.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/InfiniteList/components/InfiniteListScroll.vue"],"names":[],"mappings":"AAKA;AAoIA,iBAAS,cAAc;WA0BT,OAAO,IAA6B;;yBAXrB,GAAG;;;;;;EAgB/B;AAQD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;kBASnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAEpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"InfiniteListScroll.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/InfiniteList/components/InfiniteListScroll.vue"],"names":[],"mappings":"AAKA;AAgIA,iBAAS,cAAc;WA0BT,OAAO,IAA6B;;yBAXrB,GAAG;;;;;;EAgB/B;AAQD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;kBASnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAEpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/InfiniteList/components/InfiniteListScroll.vue.js

@@ -11,26 +11,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const containerRef = useTemplateRef("container");
     const scrollingElement = inject(wScrollingElement, null);
     const element = computed(() => scrollingElement?.value ?? document);
-    const listener = (event) => {
-      if (event.target !== element.value || !containerRef.value) return;
+    const checkIsScrollUp = () => {
+      if (!containerRef.value) return;
       if (getIsScrollUp(scrollingElement?.value ?? document.scrollingElement, containerRef.value.offsetTop)) {
         emit("scroll:up");
-        return;
-      }
-      if (getIsScrollDown(scrollingElement?.value ?? document.scrollingElement)) {
-        emit("scroll:down");
-      }
-    };
-    const checkIsScrollUp = () => {
-      if (getIsScrollDown(scrollingElement?.value ?? document.scrollingElement)) {
-        emit("scroll:down");
       }
     };
     const checkIsScrollDown = () => {
+      if (!containerRef.value) return;
       if (getIsScrollDown(scrollingElement?.value ?? document.scrollingElement)) {
         emit("scroll:down");
       }
     };
+    const listener = (event) => {
+      if (event.target !== element.value || !containerRef.value) return;
+      checkIsScrollUp();
+      checkIsScrollDown();
+    };
     watch(element, (newValue, oldValue) => {
       oldValue?.removeEventListener("scroll", listener);
       newValue?.addEventListener("scroll", listener);