@expcat/tigercat-vue 2.1.0 → 2.1.1

package/dist/{chunk-66OS5A4D.mjs → chunk-67VS6QHJ.mjs}

@@ -1,6 +1,9 @@
+import {
+  useResponsiveChartSize
+} from "./chunk-UEGNXN5B.mjs";
 import {
   useChartInteraction
-} from "./chunk-PE5OA4YG.mjs";
+} from "./chunk-FHUGOSEY.mjs";
 import {
   ChartSeries
 } from "./chunk-2ZUEXCVJ.mjs";
@@ -12,7 +15,7 @@ import {
 } from "./chunk-ZWVA7HT3.mjs";
 import {
   ChartCanvas
-} from "./chunk-W5RZPTFD.mjs";
+} from "./chunk-SNNT64HK.mjs";
 import {
   ChartGrid
 } from "./chunk-MI6TL3CQ.mjs";
@@ -29,7 +32,6 @@ import {
   classNames,
   createLinearScale,
   getChartElementOpacity,
-  getChartInnerRect,
   getNumberExtent,
   getStableChartGradientPrefix,
   getScatterHoverShadow,
@@ -158,6 +160,7 @@ var ScatterChart = defineComponent({
       wrapperClasses
     } = useChartInteraction({
       hoverable: computed(() => props.hoverable),
+      showTooltip: computed(() => props.showTooltip),
       hoveredIndexProp: () => props.hoveredIndex,
       selectable: computed(() => props.selectable),
       selectedIndexProp: () => props.selectedIndex,
@@ -168,7 +171,12 @@ var ScatterChart = defineComponent({
       getData: (index) => props.data[index],
       eventNames: { hover: "point-hover", click: "point-click" }
     });
-    const innerRect = computed(() => getChartInnerRect(props.width, props.height, props.padding));
+    const { innerRect, onResolvedSizeChange } = useResponsiveChartSize(
+      () => props.width,
+      () => props.height,
+      () => props.padding,
+      () => props.responsive
+    );
     const xValues = computed(() => props.data.map((item) => item.x));
     const yValues = computed(() => props.data.map((item) => item.y));
     const resolvedXScale = computed(() => {
@@ -252,7 +260,8 @@ var ScatterChart = defineComponent({
           responsive: props.responsive,
           title: props.title,
           desc: props.desc,
-          className: classNames(props.className)
+          className: classNames(props.className),
+          onResolvedSizeChange
         },
         {
           default: () => [
@@ -330,19 +339,24 @@ var ScatterChart = defineComponent({
                       ...shared
                     });
                   }
-                  return h("path", {
-                    key: `point-${index}`,
-                    d: getScatterPointPath(props.pointStyle, point.r),
-                    transform: `translate(${point.cx},${point.cy})`,
-                    ...shared
-                  });
+                  return h(
+                    "g",
+                    {
+                      key: `point-${index}`,
+                      transform: `translate(${point.cx},${point.cy})`
+                    },
+                    h("path", {
+                      d: getScatterPointPath(props.pointStyle, point.r),
+                      ...shared
+                    })
+                  );
                 })
               }
             )
           ].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-EHGFW5GX.mjs → chunk-6JAAXPBW.mjs}

@@ -1,6 +1,6 @@
 import {
   useChartInteraction
-} from "./chunk-PE5OA4YG.mjs";
+} from "./chunk-FHUGOSEY.mjs";
 import {
   ChartSeries
 } from "./chunk-2ZUEXCVJ.mjs";
@@ -9,7 +9,7 @@ import {
 } from "./chunk-SPFL55TF.mjs";
 import {
   ChartCanvas
-} from "./chunk-W5RZPTFD.mjs";
+} from "./chunk-SNNT64HK.mjs";
 import {
   ChartLegend
 } from "./chunk-V443QIJM.mjs";
@@ -76,6 +76,7 @@ var TreeMapChart = defineComponent({
       wrapperClasses
     } = useChartInteraction({
       hoverable: computed(() => props.hoverable),
+      showTooltip: computed(() => props.showTooltip),
       hoveredIndexProp: () => props.hoveredIndex,
       selectable: computed(() => props.selectable),
       selectedIndexProp: () => props.selectedIndex,
@@ -219,7 +220,7 @@ var TreeMapChart = defineComponent({
           }
         }
       );
-      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-JHMT5Q6P.mjs → chunk-6NYC7EY2.mjs}

@@ -1,6 +1,9 @@
+import {
+  useResponsiveChartSize
+} from "./chunk-UEGNXN5B.mjs";
 import {
   useChartInteraction
-} from "./chunk-PE5OA4YG.mjs";
+} from "./chunk-FHUGOSEY.mjs";
 import {
   ChartSeries
 } from "./chunk-2ZUEXCVJ.mjs";
@@ -12,7 +15,7 @@ import {
 } from "./chunk-ZWVA7HT3.mjs";
 import {
   ChartCanvas
-} from "./chunk-W5RZPTFD.mjs";
+} from "./chunk-SNNT64HK.mjs";
 import {
   ChartGrid
 } from "./chunk-MI6TL3CQ.mjs";
@@ -29,7 +32,6 @@ import {
   createLinePath,
   createPointScale,
   getChartElementOpacity,
-  getChartInnerRect,
   getStableChartGradientPrefix,
   getNumberExtent,
   linePointTransitionClasses,
@@ -255,7 +257,12 @@ var LineChart = defineComponent({
     const hoveredPointInfo = ref(null);
     const tooltipPosition = ref({ x: 0, y: 0 });
     const gradientPrefix = getStableChartGradientPrefix("line", useId());
-    const innerRect = computed(() => getChartInnerRect(props.width, props.height, props.padding));
+    const { innerRect, onResolvedSizeChange } = useResponsiveChartSize(
+      () => props.width,
+      () => props.height,
+      () => props.padding,
+      () => props.responsive
+    );
     const resolvedSeries = computed(
       () => resolveSeriesData(props.series, props.data, {
         color: props.lineColor,
@@ -273,6 +280,7 @@ var LineChart = defineComponent({
       wrapperClasses
     } = useChartInteraction({
       hoverable: computed(() => props.hoverable),
+      showTooltip: computed(() => props.showTooltip),
       hoveredIndexProp: () => props.hoveredIndex,
       selectable: computed(() => props.selectable),
       selectedIndexProp: () => props.selectedIndex,
@@ -368,19 +376,23 @@ var LineChart = defineComponent({
     const handlePointMouseEnter = (seriesIndex, pointIndex, event) => {
       hoveredPointInfo.value = { seriesIndex, pointIndex };
       tooltipPosition.value = { x: event.clientX, y: event.clientY };
-      emit(
-        "point-hover",
-        seriesIndex,
-        pointIndex,
-        resolvedSeries.value[seriesIndex]?.data[pointIndex]
-      );
+      if (props.hoverable) {
+        emit(
+          "point-hover",
+          seriesIndex,
+          pointIndex,
+          resolvedSeries.value[seriesIndex]?.data[pointIndex]
+        );
+      }
     };
     const handlePointMouseMove = (event) => {
       tooltipPosition.value = { x: event.clientX, y: event.clientY };
     };
     const handlePointMouseLeave = () => {
       hoveredPointInfo.value = null;
-      emit("point-hover", null, null, null);
+      if (props.hoverable) {
+        emit("point-hover", null, null, null);
+      }
     };
     const showPointTooltipFromElement = (el, seriesIndex, pointIndex) => {
       if (!props.hoverable) return;
@@ -411,6 +423,7 @@ var LineChart = defineComponent({
     };
     return () => {
       const pointClickable = props.selectable || typeof instance?.vnode.props?.onPointClick === "function";
+      const trackPointHover = props.showTooltip || props.hoverable;
       const chart = h(
         ChartCanvas,
         {
@@ -420,7 +433,8 @@ var LineChart = defineComponent({
           responsive: props.responsive,
           title: props.title,
           desc: props.desc,
-          className: classNames(props.className)
+          className: classNames(props.className),
+          onResolvedSizeChange
         },
         {
           default: () => [
@@ -627,9 +641,9 @@ var LineChart = defineComponent({
                         tabindex: pointInteractive ? 0 : void 0,
                         "data-point-index": point.pointIndex,
                         "data-series-key": sd.seriesKey,
-                        onMouseenter: props.hoverable ? (e) => handlePointMouseEnter(sd.seriesIndex, point.pointIndex, e) : void 0,
-                        onMousemove: props.hoverable ? handlePointMouseMove : void 0,
-                        onMouseleave: props.hoverable ? handlePointMouseLeave : void 0,
+                        onMouseenter: trackPointHover ? (e) => handlePointMouseEnter(sd.seriesIndex, point.pointIndex, e) : void 0,
+                        onMousemove: trackPointHover ? handlePointMouseMove : void 0,
+                        onMouseleave: trackPointHover ? handlePointMouseLeave : void 0,
                         onClick: pointClickable ? (e) => {
                           e.stopPropagation();
                           handlePointClick(sd.seriesIndex, point.pointIndex);

package/dist/{chunk-6BDDX2R4.mjs → chunk-73Z7N7VG.mjs}

@@ -99,10 +99,7 @@ var Radio = defineComponent({
     });
     const isInGroup = computed(() => !!groupContext.value);
     const actualSize = computed(() => props.size || groupContext.value?.size || "md");
-    const actualDisabled = computed(() => {
-      if (props.disabled !== void 0) return props.disabled;
-      return groupContext.value?.disabled || false;
-    });
+    const actualDisabled = computed(() => props.disabled || groupContext.value?.disabled || false);
     const actualName = computed(() => props.name || groupContext.value?.name);
     const isChecked = computed(() => {
       if (isCheckedControlled.value) return props.modelValue;

package/dist/{chunk-F3ZVVVYD.mjs → chunk-7C7SG3SS.mjs}

@@ -63,7 +63,10 @@ var MaskInput = defineComponent({
     readonly: Boolean,
     /** Whether to show a clear button when the input has value */
     clearable: Boolean,
-    /** Input name attribute */
+    /**
+     * Input name attribute. When set, a hidden input with this name submits the
+     * raw (unmasked) value; the visible field displays the mask and has no name.
+     */
     name: String,
     /** Input id attribute */
     id: String,
@@ -200,7 +203,6 @@ var MaskInput = defineComponent({
           placeholder: props.placeholder,
           disabled: props.disabled,
           readonly: props.readonly,
-          name: props.name,
           id: props.id,
           autocomplete: props.autoComplete,
           autofocus: props.autoFocus,
@@ -214,11 +216,21 @@ var MaskInput = defineComponent({
           onBlur: handleBlur
         })
       ];
+      if (props.name) {
+        children.push(
+          h("input", {
+            key: "hidden",
+            type: "hidden",
+            name: props.name,
+            value: rawValue.value
+          })
+        );
+      }
       if (activeError) {
         children.push(
           h(
             "div",
-            { id: errorMsgId, class: getInputErrorClasses(props.size) },
+            { id: errorMsgId, class: getInputErrorClasses(props.size), "aria-live": "polite" },
             effectiveErrorMessage.value
           )
         );

package/dist/{chunk-CHEXI7MO.mjs → chunk-7TJE7OYH.mjs}

@@ -1,6 +1,6 @@
 import {
   useChartInteraction
-} from "./chunk-PE5OA4YG.mjs";
+} from "./chunk-FHUGOSEY.mjs";
 import {
   ChartSeries
 } from "./chunk-2ZUEXCVJ.mjs";
@@ -9,7 +9,7 @@ import {
 } from "./chunk-SPFL55TF.mjs";
 import {
   ChartCanvas
-} from "./chunk-W5RZPTFD.mjs";
+} from "./chunk-SNNT64HK.mjs";
 import {
   ChartLegend
 } from "./chunk-V443QIJM.mjs";
@@ -188,6 +188,7 @@ var PieChart = defineComponent({
       wrapperClasses
     } = useChartInteraction({
       hoverable: computed(() => props.hoverable),
+      showTooltip: computed(() => props.showTooltip),
       hoveredIndexProp: () => props.hoveredIndex,
       selectable: computed(() => props.selectable),
       selectedIndexProp: () => props.selectedIndex,
@@ -392,7 +393,7 @@ var PieChart = defineComponent({
           }
         }
       );
-      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-AU6IC6K7.mjs → chunk-ABNS4B5V.mjs}

@@ -3,10 +3,10 @@ import {
 } from "./chunk-BZ6MVFV7.mjs";
 import {
   Radio
-} from "./chunk-6BDDX2R4.mjs";
+} from "./chunk-73Z7N7VG.mjs";
 import {
   Pagination
-} from "./chunk-2LIIMWBR.mjs";
+} from "./chunk-OYU47A57.mjs";
 import {
   Empty
 } from "./chunk-SJINC5NF.mjs";
@@ -128,8 +128,8 @@ var tableProps = {
   pagination: {
     type: [Object, Boolean],
     default: () => ({
-      current: 1,
-      pageSize: 10,
+      defaultCurrent: 1,
+      defaultPageSize: 10,
       total: 0,
       pageSizeOptions: [10, 20, 50, 100],
       showSizeChanger: true,
@@ -398,7 +398,13 @@ function useTableState(props, emit, measuredColumnWidths) {
     }
     if (sortState.value.key && sortState.value.direction) {
       const column = columnByKey.value[sortState.value.key];
-      data = sortData(data, sortState.value.key, sortState.value.direction, column?.sortFn);
+      data = sortData(
+        data,
+        sortState.value.key,
+        sortState.value.direction,
+        column?.sortFn,
+        props.columns
+      );
     }
     return data;
   });
@@ -764,7 +770,8 @@ import {
   getFixedColumnStyle,
   getCheckboxCellClasses,
   getExpandIconCellClasses,
-  formatTableSortByText
+  formatTableSortByText,
+  tableSortButtonClasses
 } from "@expcat/tigercat-core";
 function renderTableHeader(ctx, props, slots, labels) {
   const headerCells = [];
@@ -805,14 +812,31 @@ function renderTableHeader(ctx, props, slots, labels) {
       width: typeof column.width === "number" ? `${column.width}px` : column.width
     } : void 0;
     const style = fixedStyle ? { ...widthStyle, ...fixedStyle } : widthStyle;
-    const headerContent = [];
+    const titleContent = [];
     const slotContent = slots[`header-${column.key}`]?.();
     if (slotContent && slotContent.length > 0) {
-      headerContent.push(...slotContent);
+      titleContent.push(...slotContent);
     } else if (column.renderHeader) {
-      headerContent.push(column.renderHeader());
+      titleContent.push(column.renderHeader());
+    } else {
+      titleContent.push(column.title);
+    }
+    const headerContent = [];
+    if (column.sortable) {
+      headerContent.push(
+        h2(
+          "button",
+          {
+            type: "button",
+            "data-tiger-table-sort": "",
+            class: tableSortButtonClasses,
+            onClick: () => ctx.handleSort(column.key)
+          },
+          [...titleContent, SortIcon(sortDirection)]
+        )
+      );
     } else {
-      headerContent.push(column.title);
+      headerContent.push(...titleContent);
     }
     if (props.columnLockable) {
       headerContent.push(
@@ -837,9 +861,6 @@ function renderTableHeader(ctx, props, slots, labels) {
         )
       );
     }
-    if (column.sortable) {
-      headerContent.push(SortIcon(sortDirection));
-    }
     headerCells.push(
       h2(
         "th",
@@ -865,8 +886,7 @@ function renderTableHeader(ctx, props, slots, labels) {
           draggable: props.columnDraggable ? "true" : void 0,
           onDragstart: props.columnDraggable ? () => ctx.handleDragStart(column.key) : void 0,
           onDragover: props.columnDraggable ? (e) => e.preventDefault() : void 0,
-          onDrop: props.columnDraggable ? () => ctx.handleDrop(column.key) : void 0,
-          onClick: column.sortable ? () => ctx.handleSort(column.key) : void 0
+          onDrop: props.columnDraggable ? () => ctx.handleDrop(column.key) : void 0
         },
         [
           h2("div", { class: "flex items-center gap-2" }, headerContent),

package/dist/{chunk-EGIMTTZA.mjs → chunk-BOHE5URZ.mjs}

@@ -30,11 +30,14 @@ import {
   kanbanSwimlaneCollapsedClasses,
   kanbanAddColumnClasses,
   filterColumns,
+  filterCards,
   groupBySwimlane,
   getColumnCardCount,
   moveCard,
+  mapVisibleCardIndexToSource,
   reorderColumns,
   isWipExceeded,
+  appendDefaultTaskBoardCard,
   createTaskBoardDragController,
   createDefaultDragSnapshot
 } from "@expcat/tigercat-core";
@@ -139,10 +142,22 @@ var TaskBoard = defineComponent({
       innerColumns.value = next;
       emit("update:columns", next);
     };
+    const addCardToColumn = (columnId) => {
+      emit("card-add", columnId);
+      if (props.onCardAdd == null) {
+        updateColumns(appendDefaultTaskBoardCard(currentColumns.value, columnId));
+      }
+    };
     const dragSnap = ref(createDefaultDragSnapshot());
     const boardRef = ref(null);
     const applyCardMove = async (cardId, fromColumnId, toColumnId, toIdx) => {
-      const result = moveCard(currentColumns.value, cardId, fromColumnId, toColumnId, toIdx, {
+      const sourceCol = currentColumns.value.find((c) => c.id === toColumnId);
+      const mappedIdx = sourceCol == null ? toIdx : mapVisibleCardIndexToSource(
+        sourceCol.cards,
+        filterCards(sourceCol.cards, props.filterText || ""),
+        toIdx
+      );
+      const result = moveCard(currentColumns.value, cardId, fromColumnId, toColumnId, mappedIdx, {
         enforceWipLimit: props.enforceWipLimit
       });
       if (!result) return;
@@ -395,12 +410,12 @@ var TaskBoard = defineComponent({
           role: "button",
           tabindex: 0,
           onClick: () => {
-            emit("card-add", column.id);
+            addCardToColumn(column.id);
           },
           onKeydown: (e) => {
             if (e.key === "Enter" || e.key === " ") {
               e.preventDefault();
-              emit("card-add", column.id);
+              addCardToColumn(column.id);
             }
           }
         },

package/dist/{chunk-5RIHHZF6.mjs → chunk-BQK7LH2L.mjs}

@@ -271,6 +271,7 @@ var InputNumber = defineComponent({
     });
     onBeforeUnmount(() => repeatController.stop());
     return () => {
+      const { class: _attrClass, style: attrStyle, ...restAttrs } = attrs;
       const children = [];
       if (props.controls && props.controlsPosition === "both") {
         children.push(
@@ -307,6 +308,7 @@ var InputNumber = defineComponent({
       }
       children.push(
         h("input", {
+          ...restAttrs,
           ref: inputRef,
           type: "text",
           inputmode: "decimal",
@@ -423,7 +425,8 @@ var InputNumber = defineComponent({
       return h(
         "div",
         {
-          class: wrapperClasses.value
+          class: wrapperClasses.value,
+          style: attrStyle
         },
         children
       );

package/dist/{chunk-E6EZHSGY.mjs → chunk-BSOLH6R5.mjs}

@@ -26,7 +26,6 @@ var QRCode = defineComponent({
     size: { type: Number, default: 128 },
     color: { type: String, default: "#000000" },
     bgColor: { type: String, default: "#ffffff" },
-    level: { type: String, default: "M" },
     status: { type: String, default: "active" },
     className: { type: String, default: void 0 },
     locale: { type: Object, default: void 0 }

package/dist/{chunk-RSM6FOWX.mjs → chunk-CCC3S6LK.mjs}

@@ -227,12 +227,15 @@ var FormWizard = defineComponent({
       setCurrent(target);
     };
     const handleStepChange = async (nextIndex) => {
-      if (nextIndex === currentIndex.value || props.steps[nextIndex]?.disabled) return;
-      if (nextIndex > currentIndex.value) {
+      if (nextIndex === currentIndex.value) return;
+      const direction = nextIndex > currentIndex.value ? 1 : -1;
+      if (direction === 1) {
         const ok = await runBeforeNext();
         if (!ok) return;
       }
-      setCurrent(nextIndex);
+      const target = findNextUnskipped(nextIndex, direction);
+      if (target === currentIndex.value) return;
+      setCurrent(target);
     };
     const renderContent = () => {
       if (!currentStep.value) {

package/dist/{chunk-U75YXWSA.mjs → chunk-CLTRADS7.mjs}

@@ -1,9 +1,12 @@
 import {
   TaskBoard
-} from "./chunk-EGIMTTZA.mjs";
+} from "./chunk-BOHE5URZ.mjs";
 
 // src/components/Kanban.ts
-import { defineComponent, h } from "vue";
+import { defineComponent, h, ref } from "vue";
+import {
+  appendDefaultTaskBoardCard
+} from "@expcat/tigercat-core";
 var Kanban = defineComponent({
   name: "TigerKanban",
   inheritAttrs: false,
@@ -59,7 +62,14 @@ var Kanban = defineComponent({
   },
   emits: ["card-move", "column-move", "update:columns", "card-add", "column-add"],
   setup(props, { emit, attrs, slots }) {
+    const pendingColumns = ref(void 0);
     const handleCardAdd = (colId) => {
+      if (props.onCardAdd == null) {
+        const source = props.columns ?? pendingColumns.value ?? props.defaultColumns;
+        const next = appendDefaultTaskBoardCard(source, colId);
+        pendingColumns.value = next;
+        emit("update:columns", next);
+      }
       props.onCardAdd?.(colId);
       emit("card-add", colId);
     };
@@ -67,14 +77,13 @@ var Kanban = defineComponent({
       TaskBoard,
       {
         ...attrs,
-        columns: props.columns,
+        columns: props.columns !== void 0 ? props.columns : pendingColumns.value,
         defaultColumns: props.defaultColumns,
         draggable: props.draggable,
         columnDraggable: props.columnDraggable,
         enforceWipLimit: props.enforceWipLimit,
         beforeCardMove: props.beforeCardMove,
         beforeColumnMove: props.beforeColumnMove,
-        // Only set onCardAdd when needed — its presence affects button visibility
         onCardAdd: props.allowAddCard || props.onCardAdd ? handleCardAdd : void 0,
         filterText: props.filterText,
         hiddenColumns: props.hiddenColumns,
@@ -88,7 +97,10 @@ var Kanban = defineComponent({
         style: props.style,
         "onCard-move": (e) => emit("card-move", e),
         "onColumn-move": (e) => emit("column-move", e),
-        "onUpdate:columns": (cols) => emit("update:columns", cols),
+        "onUpdate:columns": (cols) => {
+          pendingColumns.value = cols;
+          emit("update:columns", cols);
+        },
         "onColumn-add": () => emit("column-add")
       },
       slots