@expcat/tigercat-vue 1.0.4 → 1.1.0

package/dist/chunk-7UU4PULK.mjs

@@ -1,138 +0,0 @@
-import { defineComponent, computed, provide, reactive, h } from 'vue';
-import { classNames, getStepsContainerClasses, coerceClassValue, mergeStyleValues } from '@expcat/tigercat-core';
-
-// src/components/Steps.ts
-var StepsContextKey = /* @__PURE__ */ Symbol("StepsContext");
-var Steps = defineComponent({
-  name: "TigerSteps",
-  inheritAttrs: false,
-  props: {
-    /**
-     * Current step index (0-based)
-     * @default 0
-     */
-    current: {
-      type: Number,
-      default: 0
-    },
-    /**
-     * Step status (for current step)
-     * @default 'process'
-     */
-    status: {
-      type: String,
-      default: "process"
-    },
-    /**
-     * Steps direction/orientation
-     * @default 'horizontal'
-     */
-    direction: {
-      type: String,
-      default: "horizontal"
-    },
-    /**
-     * Step size
-     * @default 'default'
-     */
-    size: {
-      type: String,
-      default: "default"
-    },
-    /**
-     * Whether to use simple style (no description, smaller icons)
-     * @default false
-     */
-    simple: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether steps are clickable
-     * @default false
-     */
-    clickable: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Additional CSS classes
-     */
-    className: {
-      type: String,
-      default: void 0
-    },
-    style: {
-      type: Object,
-      default: void 0
-    }
-  },
-  emits: ["change", "update:current"],
-  setup(props, { slots, attrs, emit }) {
-    const containerClasses = computed(
-      () => classNames(
-        getStepsContainerClasses(props.direction),
-        props.className,
-        coerceClassValue(attrs.class)
-      )
-    );
-    const mergedStyle = computed(() => mergeStyleValues(attrs.style, props.style));
-    const handleStepClick = (index) => {
-      if (!props.clickable) {
-        return;
-      }
-      emit("update:current", index);
-      emit("change", index);
-    };
-    provide(
-      StepsContextKey,
-      reactive({
-        current: computed(() => props.current),
-        status: computed(() => props.status),
-        direction: computed(() => props.direction),
-        size: computed(() => props.size),
-        simple: computed(() => props.simple),
-        clickable: computed(() => props.clickable),
-        handleStepClick: computed(() => props.clickable ? handleStepClick : void 0)
-      })
-    );
-    return () => {
-      const children = slots.default?.() || [];
-      const {
-        class: _class,
-        style: _style,
-        ...restAttrs
-      } = attrs;
-      const stepsWithProps = children.map((child, index) => {
-        const childType = child?.type;
-        const childName = typeof childType === "object" && childType && "name" in childType ? childType.name : void 0;
-        if (childName === "TigerStepsItem") {
-          const childProps = child.props ?? {};
-          const stepItemType = typeof child.type === "string" || typeof child.type === "object" ? child.type : "div";
-          return h(
-            stepItemType,
-            {
-              ...childProps,
-              stepIndex: index,
-              isLast: index === children.length - 1
-            },
-            child.children ?? void 0
-          );
-        }
-        return child;
-      });
-      return h(
-        "ol",
-        {
-          class: containerClasses.value,
-          style: mergedStyle.value,
-          ...restAttrs
-        },
-        stepsWithProps
-      );
-    };
-  }
-});
-var Steps_default = Steps;
-
-export { Steps, StepsContextKey, Steps_default };

package/dist/chunk-AN3HKOCS.mjs

@@ -1,50 +0,0 @@
-import { defineComponent, computed, h } from 'vue';
-import { classNames, getDropdownMenuClasses, coerceClassValue, mergeStyleValues } from '@expcat/tigercat-core';
-
-// src/components/DropdownMenu.ts
-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 DropdownMenu_default = DropdownMenu;
-
-export { DropdownMenu, DropdownMenu_default };

package/dist/chunk-BDMWFNTC.js

@@ -1,443 +0,0 @@
-'use strict';
-
-var chunkV4PBWEAU_js = require('./chunk-V4PBWEAU.js');
-var vue = require('vue');
-var tigercatCore = require('@expcat/tigercat-core');
-
-var TaskBoard = vue.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
-    },
-    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", "update:columns"],
-  setup(props, { slots, attrs, emit }) {
-    const config = chunkV4PBWEAU_js.useTigerConfig();
-    const mergedLocale = vue.computed(() => tigercatCore.mergeTigerLocale(config.value.locale, props.locale));
-    const labels = vue.computed(() => tigercatCore.getTaskBoardLabels(mergedLocale.value));
-    const innerColumns = vue.ref(props.columns ?? props.defaultColumns ?? []);
-    vue.watch(
-      () => props.columns,
-      (value) => {
-        if (value !== void 0) innerColumns.value = value;
-      }
-    );
-    vue.watch(
-      () => props.defaultColumns,
-      (value) => {
-        if (props.columns === void 0 && value !== void 0) {
-          innerColumns.value = value;
-        }
-      }
-    );
-    const currentColumns = vue.computed(() => props.columns ?? innerColumns.value);
-    const updateColumns = (next) => {
-      innerColumns.value = next;
-      emit("update:columns", next);
-    };
-    const dragState = vue.ref(null);
-    const dropTargetColumnId = vue.ref(null);
-    const dropIndex = vue.ref(-1);
-    const boardRef = vue.ref(null);
-    let touchTracker = null;
-    let touchRaf = 0;
-    const isTouchDevice = () => typeof window !== "undefined" && ("ontouchstart" in window || navigator.maxTouchPoints > 0);
-    const applyCardMove = async (cardId, fromColumnId, toColumnId, toIdx) => {
-      const result = tigercatCore.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 = tigercatCore.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 handleCardDragStart = (e, card, column) => {
-      if (!props.draggable || !e.dataTransfer) return;
-      const idx = column.cards.findIndex((c) => c.id === card.id);
-      tigercatCore.setDragData(e.dataTransfer, tigercatCore.createCardDragData(card.id, column.id, idx));
-      dragState.value = { type: "card", id: card.id, fromColumnId: column.id, fromIndex: idx };
-    };
-    const handleCardDragOver = (e, column) => {
-      e.preventDefault();
-      if (!dragState.value || dragState.value.type !== "card") return;
-      dropTargetColumnId.value = column.id;
-      const target = e.currentTarget;
-      const cardEls = target.querySelectorAll("[data-tiger-taskboard-card]");
-      const rects = [];
-      cardEls.forEach((el) => rects.push(el.getBoundingClientRect()));
-      dropIndex.value = tigercatCore.getDropIndex(e.clientY, rects);
-    };
-    const handleCardDrop = (e, column) => {
-      e.preventDefault();
-      if (!e.dataTransfer) return;
-      const data = tigercatCore.parseDragData(e.dataTransfer);
-      if (!data || data.type !== "card") return;
-      applyCardMove(
-        data.cardId,
-        data.columnId,
-        column.id,
-        dropIndex.value >= 0 ? dropIndex.value : column.cards.length
-      );
-      resetDragState();
-    };
-    const handleColumnDragStart = (e, column, index) => {
-      if (!props.columnDraggable || !e.dataTransfer) return;
-      tigercatCore.setDragData(e.dataTransfer, tigercatCore.createColumnDragData(column.id, index));
-      dragState.value = { type: "column", id: column.id, fromIndex: index };
-    };
-    const handleColumnDragOver = (e) => {
-      if (!dragState.value || dragState.value.type !== "column") return;
-      e.preventDefault();
-    };
-    const handleColumnDrop = (e) => {
-      e.preventDefault();
-      if (!e.dataTransfer) return;
-      const data = tigercatCore.parseDragData(e.dataTransfer);
-      if (!data || data.type !== "column") return;
-      const colEls = boardRef.value?.querySelectorAll("[data-tiger-taskboard-column]");
-      if (!colEls) return;
-      const rects = [];
-      colEls.forEach((el) => rects.push(el.getBoundingClientRect()));
-      const toIdx = tigercatCore.getColumnDropIndex(e.clientX, rects);
-      applyColumnMove(data.index, toIdx);
-      resetDragState();
-    };
-    const handleDragEnd = () => {
-      resetDragState();
-    };
-    const handleDragLeave = (e) => {
-      const related = e.relatedTarget;
-      if (!related || !e.currentTarget.contains(related)) {
-        if (dragState.value?.type === "card") {
-          dropTargetColumnId.value = null;
-          dropIndex.value = -1;
-        }
-      }
-    };
-    const resetDragState = () => {
-      dragState.value = null;
-      dropTargetColumnId.value = null;
-      dropIndex.value = -1;
-    };
-    const setupTouch = () => {
-      if (!isTouchDevice()) return;
-      touchTracker = tigercatCore.createTouchDragTracker();
-    };
-    const handleTouchStart = (e, card, column) => {
-      if (!props.draggable || !touchTracker) return;
-      const idx = column.cards.findIndex((c) => c.id === card.id);
-      touchTracker.onTouchStart(e, e.currentTarget);
-      dragState.value = { type: "card", id: card.id, fromColumnId: column.id, fromIndex: idx };
-    };
-    const handleTouchMove = (e) => {
-      if (!touchTracker || !dragState.value) return;
-      touchTracker.onTouchMove(e);
-      cancelAnimationFrame(touchRaf);
-      touchRaf = requestAnimationFrame(() => {
-        const st = touchTracker.getState();
-        if (dragState.value?.type === "card") {
-          const colEl = tigercatCore.findColumnFromPoint(st.currentX, st.currentY, boardRef.value);
-          if (colEl) {
-            const colId = colEl.getAttribute("data-tiger-taskboard-column-id");
-            dropTargetColumnId.value = colId ?? null;
-            const cardEls = colEl.querySelectorAll("[data-tiger-taskboard-card]");
-            const rects = [];
-            cardEls.forEach((el) => rects.push(el.getBoundingClientRect()));
-            dropIndex.value = tigercatCore.getDropIndex(st.currentY, rects);
-          }
-        }
-      });
-    };
-    const handleTouchEnd = () => {
-      if (!touchTracker || !dragState.value) return;
-      touchTracker.onTouchEnd();
-      if (dragState.value.type === "card" && dropTargetColumnId.value != null) {
-        applyCardMove(
-          dragState.value.id,
-          dragState.value.fromColumnId,
-          dropTargetColumnId.value,
-          dropIndex.value >= 0 ? dropIndex.value : 0
-        );
-      }
-      resetDragState();
-    };
-    const handleColumnTouchStart = (e, column, index) => {
-      if (!props.columnDraggable || !touchTracker) return;
-      touchTracker.onTouchStart(e, e.currentTarget);
-      dragState.value = { type: "column", id: column.id, fromIndex: index };
-    };
-    const handleColumnTouchMove = (e) => {
-      if (!touchTracker || !dragState.value || dragState.value.type !== "column") return;
-      touchTracker.onTouchMove(e);
-    };
-    const handleColumnTouchEnd = () => {
-      if (!touchTracker || !dragState.value || dragState.value.type !== "column") return;
-      const st = touchTracker.onTouchEnd();
-      const colEls = boardRef.value?.querySelectorAll("[data-tiger-taskboard-column]");
-      if (!colEls) {
-        resetDragState();
-        return;
-      }
-      const rects = [];
-      colEls.forEach((el) => rects.push(el.getBoundingClientRect()));
-      const toIdx = tigercatCore.getColumnDropIndex(st.currentX, rects);
-      applyColumnMove(dragState.value.fromIndex, Math.min(toIdx, currentColumns.value.length - 1));
-      resetDragState();
-    };
-    const kbDragState = vue.ref(null);
-    const handleCardKeyDown = (e, card, column) => {
-      if (!props.draggable) return;
-      if (e.key === "Enter" || e.key === " ") {
-        e.preventDefault();
-        if (!kbDragState.value) {
-          const idx = column.cards.findIndex((c) => c.id === card.id);
-          kbDragState.value = { type: "card", id: card.id, fromColumnId: column.id, fromIndex: idx };
-        } else {
-          const cardIdx = column.cards.findIndex((c) => c.id === card.id);
-          if (kbDragState.value.fromColumnId !== void 0) {
-            applyCardMove(kbDragState.value.id, kbDragState.value.fromColumnId, column.id, cardIdx);
-          }
-          kbDragState.value = null;
-        }
-        return;
-      }
-      if (e.key === "Escape" && kbDragState.value) {
-        e.preventDefault();
-        kbDragState.value = null;
-      }
-    };
-    vue.onMounted(() => {
-      setupTouch();
-    });
-    vue.onBeforeUnmount(() => {
-      cancelAnimationFrame(touchRaf);
-    });
-    const wrapperClasses = vue.computed(
-      () => tigercatCore.classNames(
-        tigercatCore.taskBoardBaseClasses,
-        props.className,
-        tigercatCore.coerceClassValue(attrs.class)
-      )
-    );
-    const wrapperStyle = vue.computed(
-      () => tigercatCore.mergeStyleValues(attrs.style, props.style)
-    );
-    const renderCard = (card, column) => {
-      const isDragging = dragState.value?.type === "card" && dragState.value.id === card.id;
-      const isKbGrabbed = kbDragState.value?.id === card.id;
-      const cardClasses = tigercatCore.classNames(
-        tigercatCore.taskBoardCardClasses,
-        isDragging && tigercatCore.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) => handleCardDragStart(e, card, column),
-        onDragend: handleDragEnd,
-        onTouchstart: (e) => handleTouchStart(e, card, column),
-        onTouchmove: handleTouchMove,
-        onTouchend: handleTouchEnd,
-        onKeydown: (e) => handleCardKeyDown(e, card, column)
-      };
-      if (slots.card) {
-        return vue.h("div", cardAttrs, slots.card({ card, column, isDragging }));
-      }
-      return vue.h("div", cardAttrs, [
-        vue.h("div", { class: "font-medium text-sm text-[var(--tiger-text,#1f2937)]" }, card.title),
-        card.description ? vue.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 = dragState.value?.type === "card" && dropTargetColumnId.value === column.id;
-      const isColDragging = dragState.value?.type === "column" && dragState.value.id === column.id;
-      const wipOver = tigercatCore.isWipExceeded(column);
-      const colClasses = tigercatCore.classNames(
-        tigercatCore.taskBoardColumnClasses,
-        isDropTarget && tigercatCore.taskBoardColumnDropTargetClasses,
-        isColDragging && tigercatCore.taskBoardColumnDraggingClasses
-      );
-      const headerContent = slots["column-header"] ? slots["column-header"]({ column }) : [
-        vue.h("span", { class: wipOver ? tigercatCore.taskBoardWipExceededClasses : void 0 }, [
-          column.title,
-          column.wipLimit != null ? vue.h(
-            "span",
-            {
-              class: "ml-2 text-xs font-normal opacity-70",
-              title: tigercatCore.resolveLocaleText(
-                labels.value.wipLimitText.replace("{limit}", String(column.wipLimit))
-              )
-            },
-            `(${column.cards.length}/${column.wipLimit})`
-          ) : vue.h(
-            "span",
-            { class: "ml-2 text-xs font-normal opacity-50" },
-            String(column.cards.length)
-          )
-        ]),
-        column.description ? vue.h(
-          "span",
-          {
-            class: "text-xs font-normal text-[var(--tiger-text-muted,#6b7280)] truncate max-w-[120px]"
-          },
-          column.description
-        ) : null
-      ];
-      const header = vue.h(
-        "div",
-        {
-          class: tigercatCore.taskBoardColumnHeaderClasses,
-          draggable: props.columnDraggable,
-          onDragstart: (e) => handleColumnDragStart(e, column, colIndex),
-          onDragend: handleDragEnd,
-          onTouchstart: (e) => handleColumnTouchStart(e, column, colIndex),
-          onTouchmove: handleColumnTouchMove,
-          onTouchend: handleColumnTouchEnd,
-          style: props.columnDraggable ? "cursor: grab" : void 0
-        },
-        headerContent
-      );
-      const cards = column.cards.length > 0 ? column.cards.flatMap((card, i) => {
-        const nodes = [];
-        if (isDropTarget && dropIndex.value === i) {
-          nodes.push(vue.h("div", { key: `drop-${i}`, class: tigercatCore.taskBoardDropIndicatorClasses }));
-        }
-        nodes.push(renderCard(card, column));
-        return nodes;
-      }).concat(
-        isDropTarget && dropIndex.value >= column.cards.length ? [vue.h("div", { key: "drop-end", class: tigercatCore.taskBoardDropIndicatorClasses })] : []
-      ) : [
-        isDropTarget ? vue.h("div", { key: "drop-empty", class: tigercatCore.taskBoardDropIndicatorClasses }) : slots["empty-column"] ? slots["empty-column"]({ column }) : vue.h(
-          "div",
-          { class: tigercatCore.taskBoardEmptyClasses },
-          tigercatCore.resolveLocaleText(labels.value.emptyColumnText)
-        )
-      ];
-      const body = vue.h(
-        "div",
-        {
-          class: tigercatCore.taskBoardColumnBodyClasses,
-          role: "list",
-          "aria-label": column.title,
-          onDragover: (e) => handleCardDragOver(e, column),
-          onDrop: (e) => handleCardDrop(e, column),
-          onDragleave: handleDragLeave
-        },
-        cards
-      );
-      const footer = slots["column-footer"] ? slots["column-footer"]({ column }) : props.onCardAdd ? vue.h(
-        "div",
-        {
-          class: tigercatCore.classNames(
-            "border-t border-[var(--tiger-border,#e5e7eb)]",
-            tigercatCore.taskBoardAddCardClasses
-          ),
-          onClick: () => {
-            emit("card-add", column.id);
-          }
-        },
-        [vue.h("span", null, "+"), vue.h("span", null, tigercatCore.resolveLocaleText(labels.value.addCardText))]
-      ) : null;
-      return vue.h(
-        "div",
-        {
-          key: String(column.id),
-          class: colClasses,
-          "data-tiger-taskboard-column": "",
-          "data-tiger-taskboard-column-id": String(column.id),
-          onDragover: dragState.value?.type === "column" ? handleColumnDragOver : void 0,
-          onDrop: dragState.value?.type === "column" ? handleColumnDrop : void 0
-        },
-        [header, body, footer]
-      );
-    };
-    return () => vue.h(
-      "div",
-      {
-        ...attrs,
-        ref: boardRef,
-        class: wrapperClasses.value,
-        style: wrapperStyle.value,
-        role: "region",
-        "aria-label": tigercatCore.resolveLocaleText(labels.value.boardAriaLabel),
-        "data-tiger-task-board": ""
-      },
-      currentColumns.value.map((col, i) => renderColumnNode(col, i))
-    );
-  }
-});
-var TaskBoard_default = TaskBoard;
-
-exports.TaskBoard = TaskBoard;
-exports.TaskBoard_default = TaskBoard_default;