@expcat/tigercat-vue 1.0.4 → 1.1.0

package/dist/{chunk-U2K7CF67.js → chunk-FMLNJXCX.js}

@@ -1,9 +1,8 @@
 'use strict';
 
-var chunkWCZGYU7M_js = require('./chunk-WCZGYU7M.js');
-var chunkNOTJRUAK_js = require('./chunk-NOTJRUAK.js');
-var chunkV4PBWEAU_js = require('./chunk-V4PBWEAU.js');
-var chunkU7CCKZAG_js = require('./chunk-U7CCKZAG.js');
+var chunkVPNIZPIF_js = require('./chunk-VPNIZPIF.js');
+var chunkBZBQUUXF_js = require('./chunk-BZBQUUXF.js');
+var chunk5436FG3B_js = require('./chunk-5436FG3B.js');
 var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
@@ -82,7 +81,7 @@ var FormWizard = vue.defineComponent({
   },
   emits: ["change", "update:current", "finish"],
   setup(props, { slots, attrs, emit }) {
-    const config = chunkV4PBWEAU_js.useTigerConfig();
+    const config = chunkBZBQUUXF_js.useTigerConfig();
     const mergedLocale = vue.computed(() => tigercatCore.mergeTigerLocale(config.value.locale, props.locale));
     const labels = vue.computed(() => tigercatCore.getFormWizardLabels(mergedLocale.value));
     const innerCurrent = vue.ref(props.current ?? props.defaultCurrent);
@@ -107,7 +106,7 @@ var FormWizard = vue.defineComponent({
     const currentStep = vue.computed(() => props.steps[currentIndex.value]);
     const wrapperClasses = vue.computed(
       () => tigercatCore.classNames(
-        "tiger-form-wizard w-full rounded-lg border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)] shadow-sm overflow-hidden",
+        "tiger-form-wizard w-full rounded-[var(--tiger-radius-md,0.5rem)] border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)] shadow-sm overflow-hidden",
         props.className,
         tigercatCore.coerceClassValue(attrs.class)
       )
@@ -115,12 +114,8 @@ var FormWizard = vue.defineComponent({
     const wrapperStyle = vue.computed(
       () => tigercatCore.mergeStyleValues(attrs.style, props.style)
     );
-    const clampIndex = (next) => {
-      const max = Math.max(totalCount.value - 1, 0);
-      return Math.min(Math.max(next, 0), max);
-    };
     const setCurrent = (next) => {
-      const clamped = clampIndex(next);
+      const clamped = tigercatCore.clampStepIndex(next, totalCount.value);
       const prev = currentIndex.value;
       if (props.current === void 0) {
         innerCurrent.value = clamped;
@@ -131,25 +126,8 @@ var FormWizard = vue.defineComponent({
         props.autoSave(clamped, props.steps[clamped]);
       }
     };
-    const runBeforeNext = async () => {
-      if (!props.beforeNext || !currentStep.value) {
-        return true;
-      }
-      const result = await props.beforeNext(currentIndex.value, currentStep.value, props.steps);
-      if (result === true) {
-        return true;
-      }
-      return false;
-    };
-    const findNextUnskipped = (from, direction) => {
-      let idx = from;
-      while (idx >= 0 && idx < totalCount.value) {
-        const step = props.steps[idx];
-        if (!step?.disabled && !step?.skipCondition?.()) return idx;
-        idx += direction;
-      }
-      return currentIndex.value;
-    };
+    const runBeforeNext = () => tigercatCore.runStepValidation(currentIndex.value, currentStep.value, props.steps, props.beforeNext);
+    const findNextUnskipped = (from, direction) => tigercatCore.findNextUnskippedStep(from, direction, props.steps, currentIndex.value);
     const handlePrev = () => {
       if (currentIndex.value <= 0) return;
       const target = findNextUnskipped(currentIndex.value - 1, -1);
@@ -194,7 +172,7 @@ var FormWizard = vue.defineComponent({
     };
     return () => {
       const stepsNodes = props.steps.map(
-        (step, index) => vue.h(chunkWCZGYU7M_js.StepsItem, {
+        (step, index) => vue.h(chunkVPNIZPIF_js.StepsItem, {
           key: step.key ?? index,
           title: step.title,
           description: step.description,
@@ -216,7 +194,7 @@ var FormWizard = vue.defineComponent({
         [
           props.showSteps && props.steps.length > 0 ? vue.h("div", { class: "px-6 py-5 bg-[var(--tiger-surface-muted,#f9fafb)]" }, [
             vue.h(
-              chunkNOTJRUAK_js.Steps,
+              chunkVPNIZPIF_js.Steps,
               {
                 current: currentIndex.value,
                 direction: props.direction,
@@ -240,7 +218,7 @@ var FormWizard = vue.defineComponent({
             },
             [
               vue.h(
-                chunkU7CCKZAG_js.Button,
+                chunk5436FG3B_js.Button,
                 {
                   type: "button",
                   variant: "secondary",
@@ -250,7 +228,7 @@ var FormWizard = vue.defineComponent({
                 { default: () => tigercatCore.resolveLocaleText(labels.value.prevText, props.prevText) }
               ),
               vue.h(
-                chunkU7CCKZAG_js.Button,
+                chunk5436FG3B_js.Button,
                 {
                   type: "button",
                   variant: "primary",

package/dist/{chunk-3PQ2I5IQ.mjs → chunk-FQHYU76P.mjs}

@@ -1,8 +1,8 @@
-import { Modal } from './chunk-M6PEW6V5.mjs';
-import { ImageCropper } from './chunk-T77L326M.mjs';
-import { Button } from './chunk-M7JUNLA7.mjs';
+import { Modal } from './chunk-OSOA7LWH.mjs';
+import { ImageCropper } from './chunk-H2BH6TJN.mjs';
+import { Button } from './chunk-UM5GGKIX.mjs';
 import { defineComponent, ref, computed, h } from 'vue';
-import { classNames, cropUploadTriggerDisabledClasses, cropUploadTriggerClasses, coerceClassValue, mergeStyleValues, uploadPlusIconPath, modalFooterClasses } from '@expcat/tigercat-core';
+import { classNames, cropUploadTriggerDisabledClasses, cropUploadTriggerClasses, coerceClassValue, mergeStyleValues, isActivationKey, uploadPlusIconPath, modalFooterClasses, validateUploadFile, readFileAsDataUrl, getCropperResult } from '@expcat/tigercat-core';
 
 var CropUpload = defineComponent({
   name: "TigerCropUpload",
@@ -38,26 +38,29 @@ var CropUpload = defineComponent({
       const input = e.target;
       const file = input.files?.[0];
       if (!file) return;
-      if (props.maxSize && file.size > props.maxSize) {
-        emit("error", new Error(`File size exceeds maximum of ${props.maxSize} bytes`));
+      const sizeError = validateUploadFile(file, props.maxSize);
+      if (sizeError) {
+        emit("error", sizeError);
         input.value = "";
         return;
       }
-      const reader = new FileReader();
-      reader.onload = (ev) => {
-        imageSrc.value = ev.target?.result;
+      readFileAsDataUrl(file).then((url) => {
+        imageSrc.value = url;
         modalVisible.value = true;
-      };
-      reader.readAsDataURL(file);
+      }).catch((err) => emit("error", err));
       input.value = "";
     };
     const handleConfirm = async () => {
       if (!cropperRef.value) return;
       cropping.value = true;
       try {
-        const result = await cropperRef.value.getCropResult();
-        emit("crop-complete", result);
-        modalVisible.value = false;
+        const result = await getCropperResult(
+          cropperRef.value
+        );
+        if (result) {
+          emit("crop-complete", result);
+          modalVisible.value = false;
+        }
       } catch (err) {
         emit("error", err);
       } finally {
@@ -101,7 +104,7 @@ var CropUpload = defineComponent({
           "aria-label": "Select image to crop and upload",
           "aria-disabled": props.disabled ? "true" : void 0,
           onKeydown: (e) => {
-            if (e.key === "Enter" || e.key === " ") {
+            if (isActivationKey(e)) {
               e.preventDefault();
               handleTriggerClick();
             }
@@ -120,7 +123,7 @@ var CropUpload = defineComponent({
           "aria-label": "Select image to crop and upload",
           "aria-disabled": props.disabled ? "true" : void 0,
           onKeydown: (e) => {
-            if (e.key === "Enter" || e.key === " ") {
+            if (isActivationKey(e)) {
               e.preventDefault();
               handleTriggerClick();
             }

package/dist/{chunk-HFCVHAQ6.mjs → chunk-FRFCXRUJ.mjs}

@@ -1,9 +1,9 @@
-import { useChartInteraction } from './chunk-DU2NXX75.mjs';
-import { ChartLegend } from './chunk-F5HOHSFH.mjs';
+import { useChartInteraction } from './chunk-N4GS2LSN.mjs';
+import { ChartLegend } from './chunk-VVS2CQS4.mjs';
 import { ChartSeries } from './chunk-2ZUEXCVJ.mjs';
-import { ChartTooltip } from './chunk-FXGIIFGN.mjs';
+import { ChartTooltip } from './chunk-OK4PVFQG.mjs';
 import { ChartAxis } from './chunk-ZWVA7HT3.mjs';
-import { ChartCanvas } from './chunk-5WHLXWWT.mjs';
+import { ChartCanvas } from './chunk-W5RZPTFD.mjs';
 import { ChartGrid } from './chunk-MI6TL3CQ.mjs';
 import { defineComponent, ref, onMounted, computed, h } from 'vue';
 import { getScatterGradientPrefix, getChartInnerRect, getNumberExtent, createLinearScale, resolveChartPalette, getChartElementOpacity, getScatterHoverSize, buildChartLegendItems, resolveChartTooltipContent, SCATTER_ENTRANCE_KEYFRAMES, classNames, getScatterHoverShadow, scatterPointTransitionClasses, SCATTER_ENTRANCE_CLASS, getScatterPointPath } from '@expcat/tigercat-core';

package/dist/{chunk-3ICMBQPM.mjs → chunk-FRMMT3K3.mjs}

@@ -1,8 +1,50 @@
-import { DropdownMenu } from './chunk-AN3HKOCS.mjs';
-import { useVueFloating, useVueClickOutside, useVueEscapeKey } from './chunk-CU4M5ABS.mjs';
-import { defineComponent, onMounted, ref, computed, watch, onBeforeUnmount, provide, h, nextTick } from 'vue';
-import { injectDropdownStyles, classNames, getDropdownContainerClasses, coerceClassValue, mergeStyleValues, getDropdownTriggerClasses, DROPDOWN_ENTER_CLASS, getTransformOrigin, getDropdownChevronClasses, DROPDOWN_CHEVRON_PATH, restoreFocus, handleMenuNavigation, captureActiveElement, focusFirstMenuItem } from '@expcat/tigercat-core';
+import { useVueFloating, useVueClickOutside, useVueEscapeKey } from './chunk-7RIWAO2A.mjs';
+import { defineComponent, computed, h, onMounted, ref, watch, onBeforeUnmount, provide, nextTick } from 'vue';
+import { classNames, getDropdownMenuClasses, coerceClassValue, mergeStyleValues, injectDropdownStyles, getDropdownContainerClasses, getDropdownTriggerClasses, DROPDOWN_ENTER_CLASS, getTransformOrigin, getDropdownChevronClasses, DROPDOWN_CHEVRON_PATH, restoreFocus, handleMenuNavigation, captureActiveElement, focusFirstMenuItem } from '@expcat/tigercat-core';
 
+var DropdownMenu = defineComponent({
+  name: "TigerDropdownMenu",
+  inheritAttrs: false,
+  props: {
+    /**
+     * Additional CSS classes
+     */
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    const attrsRecord = attrs;
+    const attrsClass = attrsRecord.class;
+    const attrsStyle = attrsRecord.style;
+    const menuClasses = computed(
+      () => classNames(getDropdownMenuClasses(), props.className, coerceClassValue(attrsClass))
+    );
+    const mergedStyle = computed(() => mergeStyleValues(attrsStyle, props.style));
+    return () => {
+      const {
+        class: _class,
+        style: _style,
+        ...restAttrs
+      } = attrsRecord;
+      return h(
+        "div",
+        {
+          ...restAttrs,
+          class: menuClasses.value,
+          role: "menu",
+          style: mergedStyle.value
+        },
+        slots.default?.()
+      );
+    };
+  }
+});
 var dropdownIdCounter = 0;
 var createDropdownMenuId = () => `tiger-dropdown-menu-${++dropdownIdCounter}`;
 var DropdownContextKey = /* @__PURE__ */ Symbol("DropdownContext");
@@ -295,4 +337,4 @@ var Dropdown = defineComponent({
 });
 var Dropdown_default = Dropdown;
 
-export { Dropdown, DropdownContextKey, Dropdown_default };
+export { Dropdown, DropdownContextKey, DropdownMenu, Dropdown_default };

package/dist/chunk-G2IZAKJY.mjs

@@ -0,0 +1,375 @@
+import { useTigerConfig } from './chunk-E3BSOB7P.mjs';
+import { defineComponent, computed, ref, watch, onMounted, onBeforeUnmount, h } from 'vue';
+import { mergeTigerLocale, getTaskBoardLabels, filterColumns, createDefaultDragSnapshot, createTaskBoardDragController, classNames, taskBoardBaseClasses, coerceClassValue, mergeStyleValues, kanbanAddColumnClasses, resolveLocaleText, reorderColumns, moveCard, isWipExceeded, getColumnCardCount, taskBoardColumnClasses, taskBoardColumnDropTargetClasses, taskBoardColumnDraggingClasses, taskBoardWipExceededClasses, kanbanCardCountClasses, taskBoardColumnHeaderClasses, taskBoardDropIndicatorClasses, taskBoardEmptyClasses, taskBoardColumnBodyClasses, taskBoardAddCardClasses, taskBoardCardClasses, taskBoardCardDraggingClasses } from '@expcat/tigercat-core';
+
+var TaskBoard = defineComponent({
+  name: "TigerTaskBoard",
+  inheritAttrs: false,
+  props: {
+    columns: {
+      type: Array,
+      default: void 0
+    },
+    defaultColumns: {
+      type: Array,
+      default: () => []
+    },
+    draggable: {
+      type: Boolean,
+      default: true
+    },
+    columnDraggable: {
+      type: Boolean,
+      default: true
+    },
+    enforceWipLimit: {
+      type: Boolean,
+      default: false
+    },
+    beforeCardMove: {
+      type: Function,
+      default: void 0
+    },
+    beforeColumnMove: {
+      type: Function,
+      default: void 0
+    },
+    onCardAdd: {
+      type: Function,
+      default: void 0
+    },
+    filterText: { type: String, default: "" },
+    hiddenColumns: {
+      type: Array,
+      default: () => []
+    },
+    showCardCount: { type: Boolean, default: false },
+    allowAddCard: { type: Boolean, default: false },
+    allowAddColumn: { type: Boolean, default: false },
+    locale: {
+      type: Object,
+      default: void 0
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: ["card-move", "column-move", "card-add", "column-add", "update:columns"],
+  setup(props, { slots, attrs, emit }) {
+    const config = useTigerConfig();
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const labels = computed(() => getTaskBoardLabels(mergedLocale.value));
+    const innerColumns = ref(props.columns ?? props.defaultColumns ?? []);
+    watch(
+      () => props.columns,
+      (value) => {
+        if (value !== void 0) innerColumns.value = value;
+      }
+    );
+    watch(
+      () => props.defaultColumns,
+      (value) => {
+        if (props.columns === void 0 && value !== void 0) {
+          innerColumns.value = value;
+        }
+      }
+    );
+    const currentColumns = computed(() => props.columns ?? innerColumns.value);
+    const visibleColumns = computed(() => {
+      const cols = currentColumns.value;
+      if (!props.filterText && (!props.hiddenColumns || props.hiddenColumns.length === 0)) {
+        return cols;
+      }
+      return filterColumns(cols, props.filterText || "", props.hiddenColumns);
+    });
+    const updateColumns = (next) => {
+      innerColumns.value = next;
+      emit("update:columns", next);
+    };
+    const dragSnap = ref(createDefaultDragSnapshot());
+    const boardRef = ref(null);
+    const applyCardMove = async (cardId, fromColumnId, toColumnId, toIdx) => {
+      const result = moveCard(currentColumns.value, cardId, fromColumnId, toColumnId, toIdx, {
+        enforceWipLimit: props.enforceWipLimit
+      });
+      if (!result) return;
+      if (props.beforeCardMove) {
+        const ok = await props.beforeCardMove(result.event);
+        if (!ok) return;
+      }
+      updateColumns(result.columns);
+      emit("card-move", result.event);
+    };
+    const applyColumnMove = async (fromIdx, toIdx) => {
+      const result = reorderColumns(
+        currentColumns.value,
+        fromIdx,
+        Math.min(toIdx, currentColumns.value.length - 1)
+      );
+      if (!result) return;
+      if (props.beforeColumnMove) {
+        const ok = await props.beforeColumnMove(result.event);
+        if (!ok) return;
+      }
+      updateColumns(result.columns);
+      emit("column-move", result.event);
+    };
+    const dragCtrl = createTaskBoardDragController(
+      {
+        onStateChange: (s) => {
+          dragSnap.value = s;
+        },
+        applyCardMove,
+        applyColumnMove,
+        getBoardEl: () => boardRef.value,
+        getColumnCount: () => currentColumns.value.length
+      },
+      { draggable: props.draggable, columnDraggable: props.columnDraggable }
+    );
+    watch(
+      () => [props.draggable, props.columnDraggable],
+      () => dragCtrl.setOptions({ draggable: props.draggable, columnDraggable: props.columnDraggable })
+    );
+    onMounted(() => {
+      dragCtrl.init();
+    });
+    onBeforeUnmount(() => {
+      dragCtrl.dispose();
+    });
+    const wrapperClasses = computed(
+      () => classNames(
+        taskBoardBaseClasses,
+        props.className,
+        coerceClassValue(attrs.class)
+      )
+    );
+    const wrapperStyle = computed(
+      () => mergeStyleValues(attrs.style, props.style)
+    );
+    const renderCard = (card, column) => {
+      const isDragging = dragSnap.value.drag?.type === "card" && dragSnap.value.drag.id === card.id;
+      const isKbGrabbed = dragSnap.value.kbDrag?.id === card.id;
+      const cardClasses = classNames(
+        taskBoardCardClasses,
+        isDragging && taskBoardCardDraggingClasses,
+        isKbGrabbed && "ring-2 ring-[var(--tiger-primary,#2563eb)]"
+      );
+      const cardAttrs = {
+        key: String(card.id),
+        class: cardClasses,
+        draggable: props.draggable,
+        tabindex: 0,
+        role: "listitem",
+        "aria-roledescription": labels.value.dragHintText,
+        "aria-grabbed": isKbGrabbed ? "true" : void 0,
+        "data-tiger-taskboard-card": "",
+        "data-tiger-taskboard-card-id": String(card.id),
+        onDragstart: (e) => {
+          if (e.dataTransfer) dragCtrl.cardDragStart(e.dataTransfer, card, column);
+        },
+        onDragend: () => dragCtrl.dragEnd(),
+        onTouchstart: (e) => dragCtrl.cardTouchStart(e, e.currentTarget, card, column),
+        onTouchmove: (e) => dragCtrl.cardTouchMove(e),
+        onTouchend: () => dragCtrl.cardTouchEnd(),
+        onKeydown: (e) => {
+          if (dragCtrl.cardKeyDown(e.key, card, column)) e.preventDefault();
+        }
+      };
+      if (slots.card) {
+        return h("div", cardAttrs, slots.card({ card, column, isDragging }));
+      }
+      return h("div", cardAttrs, [
+        h("div", { class: "font-medium text-sm text-[var(--tiger-text,#1f2937)]" }, card.title),
+        card.description ? h(
+          "div",
+          { class: "mt-1 text-xs text-[var(--tiger-text-muted,#6b7280)] line-clamp-2" },
+          card.description
+        ) : null
+      ]);
+    };
+    const renderColumnNode = (column, colIndex) => {
+      const isDropTarget = dragSnap.value.drag?.type === "card" && dragSnap.value.dropTargetColumnId === column.id;
+      const isColDragging = dragSnap.value.drag?.type === "column" && dragSnap.value.drag.id === column.id;
+      const wipOver = isWipExceeded(column);
+      const cardCount = props.showCardCount ? getColumnCardCount(column) : null;
+      const colClasses = classNames(
+        taskBoardColumnClasses,
+        isDropTarget && taskBoardColumnDropTargetClasses,
+        isColDragging && taskBoardColumnDraggingClasses
+      );
+      const headerContent = slots["column-header"] ? slots["column-header"]({ column }) : [
+        h("span", { class: wipOver ? taskBoardWipExceededClasses : void 0 }, [
+          column.title,
+          // When showCardCount is enabled, use the compact badge style
+          props.showCardCount && cardCount ? null : column.wipLimit != null ? h(
+            "span",
+            {
+              class: "ml-2 text-xs font-normal opacity-70",
+              title: resolveLocaleText(
+                labels.value.wipLimitText.replace("{limit}", String(column.wipLimit))
+              )
+            },
+            `(${column.cards.length}/${column.wipLimit})`
+          ) : h(
+            "span",
+            { class: "ml-2 text-xs font-normal opacity-50" },
+            String(column.cards.length)
+          )
+        ]),
+        // Card count badge (Kanban-style)
+        props.showCardCount && cardCount ? h(
+          "span",
+          {
+            class: classNames(
+              kanbanCardCountClasses,
+              wipOver && taskBoardWipExceededClasses
+            )
+          },
+          cardCount.limit ? `${cardCount.count}/${cardCount.limit}` : `${cardCount.count}`
+        ) : null,
+        column.description ? h(
+          "span",
+          {
+            class: "text-xs font-normal text-[var(--tiger-text-muted,#6b7280)] truncate max-w-[120px]"
+          },
+          column.description
+        ) : null
+      ];
+      const header = h(
+        "div",
+        {
+          class: taskBoardColumnHeaderClasses,
+          draggable: props.columnDraggable,
+          onDragstart: (e) => {
+            if (e.dataTransfer) dragCtrl.columnDragStart(e.dataTransfer, column, colIndex);
+          },
+          onDragend: () => dragCtrl.dragEnd(),
+          onTouchstart: (e) => dragCtrl.columnTouchStart(e, e.currentTarget, column, colIndex),
+          onTouchmove: (e) => dragCtrl.columnTouchMove(e),
+          onTouchend: () => dragCtrl.columnTouchEnd(),
+          style: props.columnDraggable ? "cursor: grab" : void 0
+        },
+        headerContent
+      );
+      const cards = column.cards.length > 0 ? column.cards.flatMap((card, i) => {
+        const nodes = [];
+        if (isDropTarget && dragSnap.value.dropIndex === i) {
+          nodes.push(h("div", { key: `drop-${i}`, class: taskBoardDropIndicatorClasses }));
+        }
+        nodes.push(renderCard(card, column));
+        return nodes;
+      }).concat(
+        isDropTarget && dragSnap.value.dropIndex >= column.cards.length ? [h("div", { key: "drop-end", class: taskBoardDropIndicatorClasses })] : []
+      ) : [
+        isDropTarget ? h("div", { key: "drop-empty", class: taskBoardDropIndicatorClasses }) : slots["empty-column"] ? slots["empty-column"]({ column }) : h(
+          "div",
+          { class: taskBoardEmptyClasses },
+          resolveLocaleText(labels.value.emptyColumnText)
+        )
+      ];
+      const body = h(
+        "div",
+        {
+          class: taskBoardColumnBodyClasses,
+          role: "list",
+          "aria-label": column.title,
+          onDragover: (e) => {
+            e.preventDefault();
+            dragCtrl.cardDragOver(e.clientY, e.currentTarget, column);
+          },
+          onDrop: (e) => {
+            e.preventDefault();
+            if (e.dataTransfer) dragCtrl.cardDrop(e.dataTransfer, column);
+          },
+          onDragleave: (e) => dragCtrl.dragLeave(e.currentTarget, e.relatedTarget)
+        },
+        cards
+      );
+      const showAddCard = props.allowAddCard || props.onCardAdd;
+      const footer = slots["column-footer"] ? slots["column-footer"]({ column }) : showAddCard ? h(
+        "div",
+        {
+          class: classNames(
+            "border-t border-[var(--tiger-border,#e5e7eb)]",
+            taskBoardAddCardClasses
+          ),
+          role: "button",
+          tabindex: 0,
+          onClick: () => {
+            emit("card-add", column.id);
+          },
+          onKeydown: (e) => {
+            if (e.key === "Enter" || e.key === " ") {
+              e.preventDefault();
+              emit("card-add", column.id);
+            }
+          }
+        },
+        [h("span", null, "+"), h("span", null, resolveLocaleText(labels.value.addCardText))]
+      ) : null;
+      return h(
+        "div",
+        {
+          key: String(column.id),
+          class: colClasses,
+          "data-tiger-taskboard-column": "",
+          "data-tiger-taskboard-column-id": String(column.id),
+          onDragover: dragSnap.value.drag?.type === "column" ? (e) => {
+            e.preventDefault();
+            dragCtrl.columnDragOver();
+          } : void 0,
+          onDrop: dragSnap.value.drag?.type === "column" ? (e) => {
+            e.preventDefault();
+            if (e.dataTransfer) dragCtrl.columnDrop(e.dataTransfer, e.clientX);
+          } : void 0
+        },
+        [header, body, footer]
+      );
+    };
+    return () => {
+      const children = visibleColumns.value.map((col, i) => renderColumnNode(col, i));
+      if (props.allowAddColumn) {
+        children.push(
+          h(
+            "div",
+            {
+              key: "__add-column",
+              class: kanbanAddColumnClasses,
+              role: "button",
+              tabindex: 0,
+              onClick: () => emit("column-add"),
+              onKeydown: (e) => {
+                if (e.key === "Enter" || e.key === " ") {
+                  e.preventDefault();
+                  emit("column-add");
+                }
+              }
+            },
+            "+ " + resolveLocaleText(labels.value.addCardText)
+          )
+        );
+      }
+      return h(
+        "div",
+        {
+          ...attrs,
+          ref: boardRef,
+          class: wrapperClasses.value,
+          style: wrapperStyle.value,
+          role: "region",
+          "aria-label": resolveLocaleText(labels.value.boardAriaLabel),
+          "data-tiger-task-board": ""
+        },
+        children
+      );
+    };
+  }
+});
+var TaskBoard_default = TaskBoard;
+
+export { TaskBoard, TaskBoard_default };