@expcat/tigercat-vue 2.0.19 → 2.1.1

package/dist/{chunk-OTHJIFDV.mjs → chunk-M4FWWEMX.mjs}

@@ -1,6 +1,12 @@
+import {
+  useResponsiveChartSize
+} from "./chunk-UEGNXN5B.mjs";
 import {
   useChartInteraction
-} from "./chunk-PE5OA4YG.mjs";
+} from "./chunk-FHUGOSEY.mjs";
+import {
+  ChartSeries
+} from "./chunk-2ZUEXCVJ.mjs";
 import {
   ChartTooltip
 } from "./chunk-SPFL55TF.mjs";
@@ -9,16 +15,13 @@ import {
 } from "./chunk-ZWVA7HT3.mjs";
 import {
   ChartCanvas
-} from "./chunk-W5RZPTFD.mjs";
+} from "./chunk-SNNT64HK.mjs";
 import {
   ChartGrid
 } from "./chunk-MI6TL3CQ.mjs";
 import {
   ChartLegend
 } from "./chunk-V443QIJM.mjs";
-import {
-  ChartSeries
-} from "./chunk-2ZUEXCVJ.mjs";
 
 // src/components/BarChart.ts
 import { defineComponent, computed, h, useId } from "vue";
@@ -30,7 +33,6 @@ import {
   ensureBarMinHeight,
   getStableChartGradientPrefix,
   getBarValueLabelY,
-  getChartInnerRect,
   getNumberExtent,
   resolveChartPalette,
   buildChartLegendItems,
@@ -245,6 +247,7 @@ var BarChart = defineComponent({
       wrapperClasses
     } = useChartInteraction({
       hoverable: computed(() => props.hoverable),
+      showTooltip: computed(() => props.showTooltip),
       hoveredIndexProp: () => props.hoveredIndex,
       selectable: computed(() => props.selectable),
       selectedIndexProp: () => props.selectedIndex,
@@ -255,7 +258,12 @@ var BarChart = defineComponent({
       getData: (index) => props.data[index],
       eventNames: { hover: "bar-hover", click: "bar-click" }
     });
-    const innerRect = computed(() => getChartInnerRect(props.width, props.height, props.padding));
+    const { innerRect, onResolvedSizeChange } = useResponsiveChartSize(
+      () => props.width,
+      () => props.height,
+      () => props.padding,
+      () => props.responsive
+    );
     const xDomain = computed(() => props.data.map((item) => String(item.x)));
     const yValues = computed(() => props.data.map((item) => item.y));
     const resolvedXScale = computed(() => {
@@ -379,7 +387,8 @@ var BarChart = defineComponent({
           responsive: props.responsive,
           title: props.title,
           desc: props.desc,
-          className: classNames(props.className)
+          className: classNames(props.className),
+          onResolvedSizeChange
         },
         {
           default: () => [
@@ -452,7 +461,7 @@ var BarChart = defineComponent({
           ].filter(Boolean)
         }
       );
-      const tooltip = props.showTooltip && props.hoverable ? h(ChartTooltip, {
+      const tooltip = props.showTooltip ? h(ChartTooltip, {
         content: tooltipContent.value,
         open: resolvedHoveredIndex.value !== null && tooltipContent.value !== "",
         x: tooltipPosition.value.x,

package/dist/{chunk-NGAA73CV.mjs → chunk-N2XV37BL.mjs}

@@ -1,18 +1,18 @@
 import {
   useChartInteraction
-} from "./chunk-PE5OA4YG.mjs";
+} from "./chunk-FHUGOSEY.mjs";
+import {
+  ChartSeries
+} from "./chunk-2ZUEXCVJ.mjs";
 import {
   ChartTooltip
 } from "./chunk-SPFL55TF.mjs";
 import {
   ChartCanvas
-} from "./chunk-W5RZPTFD.mjs";
+} from "./chunk-SNNT64HK.mjs";
 import {
   ChartLegend
 } from "./chunk-V443QIJM.mjs";
-import {
-  ChartSeries
-} from "./chunk-2ZUEXCVJ.mjs";
 
 // src/components/RadarChart.ts
 import { defineComponent, computed, h, ref, useId } from "vue";
@@ -20,7 +20,9 @@ import {
   chartAxisTickTextClasses,
   chartGridLineClasses,
   classNames,
+  createCircleRingPath,
   createPolygonPath,
+  createPolygonRingPath,
   getChartGridLineDasharray,
   getChartInnerRect,
   getRadarAngles,
@@ -269,6 +271,7 @@ var RadarChart = defineComponent({
       wrapperClasses
     } = useChartInteraction({
       hoverable: computed(() => props.hoverable),
+      showTooltip: computed(() => props.showTooltip),
       hoveredIndexProp: () => props.hoveredIndex,
       selectable: computed(() => props.selectable),
       selectedIndexProp: () => props.selectedIndex,
@@ -284,7 +287,7 @@ var RadarChart = defineComponent({
     });
     const hoveredPoint = ref(null);
     const handlePointEnter = (seriesIndex, pointIndex, event) => {
-      if (!props.hoverable) return;
+      if (!props.hoverable && !props.showTooltip) return;
       hoveredPoint.value = { seriesIndex, pointIndex };
       handleHoverEnter(seriesIndex, event);
     };
@@ -547,43 +550,36 @@ var RadarChart = defineComponent({
                 );
               }) : []
             ]) : null,
-            // Split area (alternating fills – ECharts splitArea style)
+            // Split area (alternating fills – evenodd ring, transparent inner)
             ...splitAreaPaths.value.map((area, index) => {
+              const shared = {
+                key: `split-${index}`,
+                fill: area.color,
+                "fill-opacity": props.splitAreaOpacity,
+                stroke: "none",
+                "data-radar-split-area": "true"
+              };
               if (area.type === "circle-ring") {
-                return h("g", { key: `split-${index}` }, [
-                  h("circle", {
-                    cx: area.cx,
-                    cy: area.cy,
-                    r: area.outerRadius,
-                    fill: area.color,
-                    "fill-opacity": props.splitAreaOpacity,
-                    stroke: "none",
-                    "data-radar-split-area": "true"
-                  }),
-                  area.innerRadius > 0 ? h("circle", {
-                    cx: area.cx,
-                    cy: area.cy,
-                    r: area.innerRadius,
-                    fill: "var(--tiger-bg,#fff)",
-                    stroke: "none"
-                  }) : null
-                ]);
+                if (area.innerRadius > 0) {
+                  return h("path", {
+                    ...shared,
+                    d: createCircleRingPath(area.cx, area.cy, area.outerRadius, area.innerRadius),
+                    "fill-rule": "evenodd"
+                  });
+                }
+                return h("circle", {
+                  ...shared,
+                  cx: area.cx,
+                  cy: area.cy,
+                  r: area.outerRadius
+                });
+              }
+              if (area.innerPoints.length > 0) {
+                const d2 = createPolygonRingPath(area.outerPoints, area.innerPoints);
+                return d2 ? h("path", { ...shared, d: d2, "fill-rule": "evenodd" }) : null;
               }
-              const outerPath = createPolygonPath(area.outerPoints);
-              return h("g", { key: `split-${index}` }, [
-                outerPath ? h("path", {
-                  d: outerPath,
-                  fill: area.color,
-                  "fill-opacity": props.splitAreaOpacity,
-                  stroke: "none",
-                  "data-radar-split-area": "true"
-                }) : null,
-                area.innerPoints.length > 0 ? h("path", {
-                  d: createPolygonPath(area.innerPoints),
-                  fill: "var(--tiger-bg,#fff)",
-                  stroke: "none"
-                }) : null
-              ]);
+              const d = createPolygonPath(area.outerPoints);
+              return d ? h("path", { ...shared, d }) : null;
             }),
             // Grid lines
             ...gridPaths.value.map(
@@ -694,9 +690,9 @@ var RadarChart = defineComponent({
                         "data-series-index": seriesIndex,
                         "data-series-key": item.seriesKey,
                         "data-point-index": point.index,
-                        onMouseenter: props.showTooltip && props.hoverable ? (e) => handlePointEnter(seriesIndex, point.index, e) : void 0,
-                        onMousemove: props.showTooltip && props.hoverable ? handlePointMove : void 0,
-                        onMouseleave: props.showTooltip && props.hoverable ? handlePointLeave : void 0,
+                        onMouseenter: props.showTooltip || props.hoverable ? (e) => handlePointEnter(seriesIndex, point.index, e) : void 0,
+                        onMousemove: props.showTooltip || props.hoverable ? handlePointMove : void 0,
+                        onMouseleave: props.showTooltip || props.hoverable ? handlePointLeave : void 0,
                         onFocus: props.showTooltip && props.hoverable ? (e) => showPointTooltipFromElement(
                           e.currentTarget,
                           seriesIndex,
@@ -753,7 +749,7 @@ var RadarChart = defineComponent({
           ].filter(Boolean)
         }
       );
-      const tooltip = props.showTooltip && props.hoverable ? h(ChartTooltip, {
+      const tooltip = props.showTooltip ? h(ChartTooltip, {
         content: tooltipContent.value,
         open: hoveredPoint.value !== null && tooltipContent.value !== "",
         x: tooltipPosition.value.x,

package/dist/{chunk-2LIIMWBR.mjs → chunk-OYU47A57.mjs}

@@ -19,7 +19,6 @@ import {
   getPageRange,
   validateCurrentPage,
   getPageNumbers,
-  defaultTotalText,
   formatPaginationTotal,
   getPaginationContainerClasses,
   getPaginationButtonBaseClasses,
@@ -357,7 +356,7 @@ var Pagination = defineComponent({
       const prevDisabled = page <= 1 || props.disabled;
       const nextDisabled = page >= pages || props.disabled;
       if (props.showTotal) {
-        const totalTextFn = props.totalText || (props.labels?.totalText || mergedLocale.value?.pagination?.totalText ? (value, range) => formatPaginationTotal(labels.value.totalText, value, range, localeCode.value) : defaultTotalText);
+        const totalTextFn = props.totalText || ((value, range) => formatPaginationTotal(labels.value.totalText, value, range, localeCode.value));
         elements.push(
           h("span", { class: getTotalTextClasses(size) }, totalTextFn(props.total, pageRange.value))
         );

package/dist/{chunk-KU2Q5V3L.mjs → chunk-P62TYR3M.mjs}

@@ -102,6 +102,9 @@ var CollapsePanel = defineComponent({
         collapseContext.handlePanelClick(props.panelKey);
       }
     };
+    const handleExtraClick = (event) => {
+      event.stopPropagation();
+    };
     const handleKeydown = (event) => {
       if (props.disabled) {
         return;
@@ -163,7 +166,16 @@ var CollapsePanel = defineComponent({
         )
       );
       if (extraSlot) {
-        headerContent.push(h("span", { class: "ml-auto" }, extraSlot));
+        headerContent.push(
+          h(
+            "span",
+            {
+              class: "ml-auto",
+              onClick: handleExtraClick
+            },
+            extraSlot
+          )
+        );
       }
       if (props.showArrow && collapseContext.expandIconPosition === "end") {
         headerContent.push(arrowIcon);
@@ -187,7 +199,11 @@ var CollapsePanel = defineComponent({
           ref: contentRef,
           "data-tiger-collapse-content": "",
           class: collapsePanelContentWrapperClasses,
-          style: initialContentStyle
+          style: initialContentStyle,
+          ...isActive.value ? {} : {
+            inert: true,
+            "aria-hidden": "true"
+          }
         },
         [
           h(

package/dist/chunk-P6FMU4AT.mjs

@@ -0,0 +1,54 @@
+// src/components/AspectRatio.ts
+import { defineComponent, h } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  mergeStyleValues,
+  getAspectRatioContentClasses,
+  getAspectRatioRootClasses,
+  getAspectRatioStyle,
+  ASPECT_RATIO_DEFAULT
+} from "@expcat/tigercat-core";
+var AspectRatio = defineComponent({
+  name: "TigerAspectRatio",
+  inheritAttrs: false,
+  props: {
+    ratio: {
+      type: [Number, String],
+      default: ASPECT_RATIO_DEFAULT
+    },
+    className: { type: String, default: void 0 },
+    contentClassName: { type: String, default: void 0 }
+  },
+  setup(props, { slots, attrs }) {
+    return () => h(
+      "div",
+      {
+        ...attrs,
+        class: classNames(
+          getAspectRatioRootClasses(),
+          props.className,
+          coerceClassValue(attrs.class)
+        ),
+        style: mergeStyleValues(getAspectRatioStyle(props.ratio), attrs.style),
+        "data-aspect-ratio": ""
+      },
+      [
+        h(
+          "div",
+          {
+            class: classNames(getAspectRatioContentClasses(), props.contentClassName),
+            "data-aspect-ratio-content": ""
+          },
+          slots.default?.()
+        )
+      ]
+    );
+  }
+});
+var AspectRatio_default = AspectRatio;
+
+export {
+  AspectRatio,
+  AspectRatio_default
+};

package/dist/{chunk-P5FDKBXG.mjs → chunk-P7X46BAW.mjs}

@@ -3,7 +3,15 @@ import {
 } from "./chunk-UOJOJBEU.mjs";
 
 // src/components/Signature.ts
-import { computed, defineComponent, h, onMounted, ref, watch } from "vue";
+import {
+  computed,
+  defineComponent,
+  h,
+  onMounted,
+  onUnmounted,
+  ref,
+  watch
+} from "vue";
 import {
   classNames,
   clampSignatureLineWidth,
@@ -61,8 +69,10 @@ var Signature = defineComponent({
     const canvasRef = ref(null);
     const strokes = ref([]);
     const activeStroke = ref(null);
+    const capturedPointerId = ref(null);
     const isDisabled = computed(() => props.disabled || props.readonly);
     const normalizedLineWidth = computed(() => clampSignatureLineWidth(props.lineWidth));
+    let documentPointerListening = false;
     const draw = (nextStrokes) => {
       const canvas = canvasRef.value;
       const context = canvas?.getContext("2d");
@@ -90,6 +100,8 @@ var Signature = defineComponent({
         if (value === "" && !isSignatureEmpty(strokes.value)) {
           strokes.value = [];
           activeStroke.value = null;
+          detachDocumentPointerListeners();
+          releaseCanvasPointer();
           draw([]);
         }
       }
@@ -130,6 +142,8 @@ var Signature = defineComponent({
     const clear = () => {
       strokes.value = [];
       activeStroke.value = null;
+      detachDocumentPointerListeners();
+      releaseCanvasPointer();
       draw([]);
       emitChange([]);
       emit("clear");
@@ -144,10 +158,55 @@ var Signature = defineComponent({
       };
       return getSignaturePoint(event.clientX, event.clientY, rect, props.width, props.height);
     };
+    const captureCanvasPointer = (pointerId) => {
+      capturedPointerId.value = pointerId;
+      const canvas = canvasRef.value;
+      if (!canvas || typeof canvas.setPointerCapture !== "function") return;
+      try {
+        canvas.setPointerCapture(pointerId);
+      } catch {
+      }
+    };
+    const releaseCanvasPointer = () => {
+      const canvas = canvasRef.value;
+      const pointerId = capturedPointerId.value;
+      capturedPointerId.value = null;
+      if (!canvas || pointerId == null || typeof canvas.releasePointerCapture !== "function") return;
+      if (typeof canvas.hasPointerCapture === "function") {
+        try {
+          if (!canvas.hasPointerCapture(pointerId)) return;
+        } catch {
+          return;
+        }
+      }
+      try {
+        canvas.releasePointerCapture(pointerId);
+      } catch {
+      }
+    };
+    const handleDocumentPointerEnd = () => {
+      finishStroke();
+    };
+    const attachDocumentPointerListeners = () => {
+      if (documentPointerListening || !isBrowser()) return;
+      document.addEventListener("pointerup", handleDocumentPointerEnd);
+      document.addEventListener("pointercancel", handleDocumentPointerEnd);
+      documentPointerListening = true;
+    };
+    const detachDocumentPointerListeners = () => {
+      if (!documentPointerListening || !isBrowser()) return;
+      document.removeEventListener("pointerup", handleDocumentPointerEnd);
+      document.removeEventListener("pointercancel", handleDocumentPointerEnd);
+      documentPointerListening = false;
+    };
     const handlePointerDown = (event) => {
       if (isDisabled.value) return;
       event.preventDefault();
       canvasRef.value?.focus();
+      const pointerId = event.pointerId;
+      if (typeof pointerId === "number") {
+        captureCanvasPointer(pointerId);
+      }
       const stroke = {
         color: props.penColor,
         lineWidth: normalizedLineWidth.value,
@@ -155,6 +214,7 @@ var Signature = defineComponent({
       };
       activeStroke.value = stroke;
       strokes.value = [...strokes.value, stroke];
+      attachDocumentPointerListeners();
       emit("begin");
     };
     const handlePointerMove = (event) => {
@@ -163,12 +223,18 @@ var Signature = defineComponent({
       activeStroke.value.points.push(getPointFromEvent(event));
       strokes.value = [...strokes.value];
     };
-    const finishStroke = () => {
+    function finishStroke() {
       if (!activeStroke.value) return;
       activeStroke.value = null;
       const payload = emitChange(strokes.value);
       emit("end", payload);
-    };
+      detachDocumentPointerListeners();
+      releaseCanvasPointer();
+    }
+    onUnmounted(() => {
+      detachDocumentPointerListeners();
+      releaseCanvasPointer();
+    });
     const handleKeyDown = (event) => {
       if (!props.clearable || isDisabled.value) return;
       if (event.key !== "Delete" && event.key !== "Backspace") return;
@@ -213,6 +279,7 @@ var Signature = defineComponent({
               onPointermove: handlePointerMove,
               onPointerup: finishStroke,
               onPointercancel: finishStroke,
+              onLostpointercapture: finishStroke,
               onKeydown: handleKeyDown
             })
           ]),

package/dist/chunk-PFIV5MXD.mjs

@@ -0,0 +1,48 @@
+// src/components/LoadingBarRoot.ts
+var loadingBarModulePromise = null;
+var pendingCommands = [];
+var resolvedApi = null;
+function loadLoadingBarModule() {
+  loadingBarModulePromise ??= import("./components/LoadingBar.mjs");
+  return loadingBarModulePromise;
+}
+function applyCommand(api, command) {
+  if (command.type === "start") {
+    api.start(command.options);
+    return;
+  }
+  api[command.type]();
+}
+function enqueue(command) {
+  if (resolvedApi) {
+    applyCommand(resolvedApi, command);
+    return;
+  }
+  pendingCommands.push(command);
+  void loadLoadingBarModule().then(({ LoadingBar: LoadingBar2 }) => {
+    resolvedApi = LoadingBar2;
+    const queue = pendingCommands;
+    pendingCommands = [];
+    for (const item of queue) {
+      applyCommand(LoadingBar2, item);
+    }
+  });
+}
+var LoadingBar = {
+  start(options) {
+    enqueue({ type: "start", options });
+  },
+  finish() {
+    enqueue({ type: "finish" });
+  },
+  error() {
+    enqueue({ type: "error" });
+  },
+  clear() {
+    enqueue({ type: "clear" });
+  }
+};
+
+export {
+  LoadingBar
+};

package/dist/{chunk-KROVW4AW.mjs → chunk-PJQTRDIG.mjs}

@@ -101,6 +101,15 @@ var DropdownItem = defineComponent({
       type: Boolean,
       default: false
     },
+    /**
+     * When set, overrides the parent Dropdown `closeOnClick`.
+     * Omitted inherits the parent. Must default to undefined (not false): a
+     * bare Boolean would coerce omitted to false and break parent inheritance.
+     */
+    closeOnClick: {
+      type: Boolean,
+      default: void 0
+    },
     /**
      * Additional CSS classes
      */
@@ -125,8 +134,9 @@ var DropdownItem = defineComponent({
         return;
       }
       emit("click", event);
-      if (context?.closeOnClick) {
-        context.handleItemClick();
+      const shouldClose = props.closeOnClick ?? context?.closeOnClick ?? true;
+      if (shouldClose) {
+        context?.handleItemClick();
       }
     };
     const itemClasses = computed(() => {
@@ -286,7 +296,7 @@ var Dropdown = defineComponent({
       }
     };
     const handleItemClick = () => {
-      if (props.closeOnClick) setVisible(false);
+      setVisible(false);
     };
     let hoverTimer = null;
     const handleMouseEnter = () => {

package/dist/{chunk-26OI3TEA.mjs → chunk-PMQSXEMT.mjs}

@@ -3,9 +3,10 @@ import {
 } from "./chunk-Q7Y22OFX.mjs";
 
 // src/utils/use-floating-popup.ts
-import { computed, ref, watch } from "vue";
+import { computed, onBeforeUnmount, ref, watch } from "vue";
 import {
   buildTriggerHandlerMap,
+  createFloatingHoverDelayController,
   restoreFocus
 } from "@expcat/tigercat-core";
 function useFloatingPopup(options) {
@@ -27,6 +28,10 @@ function useFloatingPopup(options) {
     emit("update:open", next);
     emit("open-change", next);
   };
+  const hoverController = createFloatingHoverDelayController({
+    show: () => setVisible(true),
+    hide: () => setVisible(false)
+  });
   const containerRef = ref(null);
   const triggerRef = ref(null);
   const floatingRef = ref(null);
@@ -40,7 +45,7 @@ function useFloatingPopup(options) {
     }, 0);
   };
   const closeAndRestoreFocus = () => {
-    setVisible(false);
+    hoverController.closeNow();
     restoreTriggerFocus();
   };
   const effectiveTrigger = computed(
@@ -59,21 +64,52 @@ function useFloatingPopup(options) {
       if (reason === "escape") {
         closeAndRestoreFocus();
       } else {
-        setVisible(false);
+        hoverController.closeNow();
       }
     }
   });
   const x = overlay.x;
   const y = overlay.y;
   const handleToggle = () => {
-    if (!props.disabled) setVisible(!currentVisible.value);
+    if (props.disabled) return;
+    hoverController.cancel();
+    setVisible(!currentVisible.value);
   };
   const handleShow = () => {
-    if (!props.disabled) setVisible(true);
+    if (props.disabled) return;
+    if (effectiveTrigger.value === "hover") {
+      hoverController.enter();
+      return;
+    }
+    hoverController.cancel();
+    setVisible(true);
   };
   const handleHide = () => {
-    if (!props.disabled) setVisible(false);
+    if (props.disabled) return;
+    if (effectiveTrigger.value === "hover") {
+      hoverController.leave();
+      return;
+    }
+    hoverController.closeNow();
   };
+  watch(
+    () => [floatingRef.value, currentVisible.value, effectiveTrigger.value],
+    ([el, visible, trigger], _prev, onCleanup) => {
+      if (!multiTrigger || trigger !== "hover" || !visible || !el) return;
+      const handleEnter = () => hoverController.enter();
+      const handleLeave = () => hoverController.leave();
+      el.addEventListener("mouseenter", handleEnter);
+      el.addEventListener("mouseleave", handleLeave);
+      onCleanup(() => {
+        el.removeEventListener("mouseenter", handleEnter);
+        el.removeEventListener("mouseleave", handleLeave);
+      });
+    },
+    { flush: "post", immediate: true }
+  );
+  onBeforeUnmount(() => {
+    hoverController.dispose();
+  });
   const triggerHandlers = computed(() => {
     if (!multiTrigger) {
       return { onClick: handleToggle };