@expcat/tigercat-vue 1.0.7 → 1.2.0

package/dist/chunk-BGMQIUPP.js

@@ -0,0 +1,409 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+var _chunk25EYT2CBjs = require('./chunk-25EYT2CB.js');
+
+// src/components/TaskBoard.ts
+var _vue = require('vue');
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var TaskBoard = _vue.defineComponent.call(void 0, {
+  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 = _chunk25EYT2CBjs.useTigerConfig.call(void 0, );
+    const mergedLocale = _vue.computed.call(void 0, () => _tigercatcore.mergeTigerLocale.call(void 0, config.value.locale, props.locale));
+    const labels = _vue.computed.call(void 0, () => _tigercatcore.getTaskBoardLabels.call(void 0, mergedLocale.value));
+    const innerColumns = _vue.ref.call(void 0, _nullishCoalesce(_nullishCoalesce(props.columns, () => ( props.defaultColumns)), () => ( [])));
+    _vue.watch.call(void 0, 
+      () => props.columns,
+      (value) => {
+        if (value !== void 0) innerColumns.value = value;
+      }
+    );
+    _vue.watch.call(void 0, 
+      () => props.defaultColumns,
+      (value) => {
+        if (props.columns === void 0 && value !== void 0) {
+          innerColumns.value = value;
+        }
+      }
+    );
+    const currentColumns = _vue.computed.call(void 0, () => _nullishCoalesce(props.columns, () => ( innerColumns.value)));
+    const visibleColumns = _vue.computed.call(void 0, () => {
+      const cols = currentColumns.value;
+      if (!props.filterText && (!props.hiddenColumns || props.hiddenColumns.length === 0)) {
+        return cols;
+      }
+      return _tigercatcore.filterColumns.call(void 0, cols, props.filterText || "", props.hiddenColumns);
+    });
+    const updateColumns = (next) => {
+      innerColumns.value = next;
+      emit("update:columns", next);
+    };
+    const dragSnap = _vue.ref.call(void 0, _tigercatcore.createDefaultDragSnapshot.call(void 0, ));
+    const boardRef = _vue.ref.call(void 0, null);
+    const applyCardMove = async (cardId, fromColumnId, toColumnId, toIdx) => {
+      const result = _tigercatcore.moveCard.call(void 0, 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.call(void 0, 
+        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 = _tigercatcore.createTaskBoardDragController.call(void 0, 
+      {
+        onStateChange: (s) => {
+          dragSnap.value = s;
+        },
+        applyCardMove,
+        applyColumnMove,
+        getBoardEl: () => boardRef.value,
+        getColumnCount: () => currentColumns.value.length
+      },
+      { draggable: props.draggable, columnDraggable: props.columnDraggable }
+    );
+    _vue.watch.call(void 0, 
+      () => [props.draggable, props.columnDraggable],
+      () => dragCtrl.setOptions({ draggable: props.draggable, columnDraggable: props.columnDraggable })
+    );
+    _vue.onMounted.call(void 0, () => {
+      dragCtrl.init();
+    });
+    _vue.onBeforeUnmount.call(void 0, () => {
+      dragCtrl.dispose();
+    });
+    const wrapperClasses = _vue.computed.call(void 0, 
+      () => _tigercatcore.classNames.call(void 0, 
+        _tigercatcore.taskBoardBaseClasses,
+        props.className,
+        _tigercatcore.coerceClassValue.call(void 0, attrs.class)
+      )
+    );
+    const wrapperStyle = _vue.computed.call(void 0, 
+      () => _tigercatcore.mergeStyleValues.call(void 0, attrs.style, props.style)
+    );
+    const renderCard = (card, column) => {
+      const isDragging = _optionalChain([dragSnap, 'access', _ => _.value, 'access', _2 => _2.drag, 'optionalAccess', _3 => _3.type]) === "card" && dragSnap.value.drag.id === card.id;
+      const isKbGrabbed = _optionalChain([dragSnap, 'access', _4 => _4.value, 'access', _5 => _5.kbDrag, 'optionalAccess', _6 => _6.id]) === card.id;
+      const cardClasses = _tigercatcore.classNames.call(void 0, 
+        _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) => {
+          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 _vue.h.call(void 0, "div", cardAttrs, slots.card({ card, column, isDragging }));
+      }
+      return _vue.h.call(void 0, "div", cardAttrs, [
+        _vue.h.call(void 0, "div", { class: "font-medium text-sm text-[var(--tiger-text,#1f2937)]" }, card.title),
+        card.description ? _vue.h.call(void 0, 
+          "div",
+          { class: "mt-1 text-xs text-[var(--tiger-text-muted,#6b7280)] line-clamp-2" },
+          card.description
+        ) : null
+      ]);
+    };
+    const renderColumnNode = (column, colIndex) => {
+      const isDropTarget = _optionalChain([dragSnap, 'access', _7 => _7.value, 'access', _8 => _8.drag, 'optionalAccess', _9 => _9.type]) === "card" && dragSnap.value.dropTargetColumnId === column.id;
+      const isColDragging = _optionalChain([dragSnap, 'access', _10 => _10.value, 'access', _11 => _11.drag, 'optionalAccess', _12 => _12.type]) === "column" && dragSnap.value.drag.id === column.id;
+      const wipOver = _tigercatcore.isWipExceeded.call(void 0, column);
+      const cardCount = props.showCardCount ? _tigercatcore.getColumnCardCount.call(void 0, column) : null;
+      const colClasses = _tigercatcore.classNames.call(void 0, 
+        _tigercatcore.taskBoardColumnClasses,
+        isDropTarget && _tigercatcore.taskBoardColumnDropTargetClasses,
+        isColDragging && _tigercatcore.taskBoardColumnDraggingClasses
+      );
+      const headerContent = slots["column-header"] ? slots["column-header"]({ column }) : [
+        _vue.h.call(void 0, "span", { class: wipOver ? _tigercatcore.taskBoardWipExceededClasses : void 0 }, [
+          column.title,
+          // When showCardCount is enabled, use the compact badge style
+          props.showCardCount && cardCount ? null : column.wipLimit != null ? _vue.h.call(void 0, 
+            "span",
+            {
+              class: "ml-2 text-xs font-normal opacity-70",
+              title: _tigercatcore.resolveLocaleText.call(void 0, 
+                labels.value.wipLimitText.replace("{limit}", String(column.wipLimit))
+              )
+            },
+            `(${column.cards.length}/${column.wipLimit})`
+          ) : _vue.h.call(void 0, 
+            "span",
+            { class: "ml-2 text-xs font-normal opacity-50" },
+            String(column.cards.length)
+          )
+        ]),
+        // Card count badge (Kanban-style)
+        props.showCardCount && cardCount ? _vue.h.call(void 0, 
+          "span",
+          {
+            class: _tigercatcore.classNames.call(void 0, 
+              _tigercatcore.kanbanCardCountClasses,
+              wipOver && _tigercatcore.taskBoardWipExceededClasses
+            )
+          },
+          cardCount.limit ? `${cardCount.count}/${cardCount.limit}` : `${cardCount.count}`
+        ) : null,
+        column.description ? _vue.h.call(void 0, 
+          "span",
+          {
+            class: "text-xs font-normal text-[var(--tiger-text-muted,#6b7280)] truncate max-w-[120px]"
+          },
+          column.description
+        ) : null
+      ];
+      const header = _vue.h.call(void 0, 
+        "div",
+        {
+          class: _tigercatcore.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(_vue.h.call(void 0, "div", { key: `drop-${i}`, class: _tigercatcore.taskBoardDropIndicatorClasses }));
+        }
+        nodes.push(renderCard(card, column));
+        return nodes;
+      }).concat(
+        isDropTarget && dragSnap.value.dropIndex >= column.cards.length ? [_vue.h.call(void 0, "div", { key: "drop-end", class: _tigercatcore.taskBoardDropIndicatorClasses })] : []
+      ) : [
+        isDropTarget ? _vue.h.call(void 0, "div", { key: "drop-empty", class: _tigercatcore.taskBoardDropIndicatorClasses }) : slots["empty-column"] ? slots["empty-column"]({ column }) : _vue.h.call(void 0, 
+          "div",
+          { class: _tigercatcore.taskBoardEmptyClasses },
+          _tigercatcore.resolveLocaleText.call(void 0, labels.value.emptyColumnText)
+        )
+      ];
+      const body = _vue.h.call(void 0, 
+        "div",
+        {
+          class: _tigercatcore.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 ? _vue.h.call(void 0, 
+        "div",
+        {
+          class: _tigercatcore.classNames.call(void 0, 
+            "border-t border-[var(--tiger-border,#e5e7eb)]",
+            _tigercatcore.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);
+            }
+          }
+        },
+        [_vue.h.call(void 0, "span", null, "+"), _vue.h.call(void 0, "span", null, _tigercatcore.resolveLocaleText.call(void 0, labels.value.addCardText))]
+      ) : null;
+      return _vue.h.call(void 0, 
+        "div",
+        {
+          key: String(column.id),
+          class: colClasses,
+          "data-tiger-taskboard-column": "",
+          "data-tiger-taskboard-column-id": String(column.id),
+          onDragover: _optionalChain([dragSnap, 'access', _13 => _13.value, 'access', _14 => _14.drag, 'optionalAccess', _15 => _15.type]) === "column" ? (e) => {
+            e.preventDefault();
+            dragCtrl.columnDragOver();
+          } : void 0,
+          onDrop: _optionalChain([dragSnap, 'access', _16 => _16.value, 'access', _17 => _17.drag, 'optionalAccess', _18 => _18.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(
+          _vue.h.call(void 0, 
+            "div",
+            {
+              key: "__add-column",
+              class: _tigercatcore.kanbanAddColumnClasses,
+              role: "button",
+              tabindex: 0,
+              onClick: () => emit("column-add"),
+              onKeydown: (e) => {
+                if (e.key === "Enter" || e.key === " ") {
+                  e.preventDefault();
+                  emit("column-add");
+                }
+              }
+            },
+            "+ " + _tigercatcore.resolveLocaleText.call(void 0, labels.value.addCardText)
+          )
+        );
+      }
+      return _vue.h.call(void 0, 
+        "div",
+        {
+          ...attrs,
+          ref: boardRef,
+          class: wrapperClasses.value,
+          style: wrapperStyle.value,
+          role: "region",
+          "aria-label": _tigercatcore.resolveLocaleText.call(void 0, labels.value.boardAriaLabel),
+          "data-tiger-task-board": ""
+        },
+        children
+      );
+    };
+  }
+});
+var TaskBoard_default = TaskBoard;
+
+
+
+
+exports.TaskBoard = TaskBoard; exports.TaskBoard_default = TaskBoard_default;

package/dist/{chunk-564LMZQL.mjs → chunk-BMT5PGAQ.mjs}

@@ -1,7 +1,20 @@
-import { useFloatingPopup } from './chunk-6A57RY3H.mjs';
-import { defineComponent, computed, h } from 'vue';
-import { createFloatingIdFactory, classNames, getTooltipContainerClasses, coerceClassValue, getTooltipTriggerClasses, getTooltipContentClasses } from '@expcat/tigercat-core';
+import {
+  useFloatingPopup
+} from "./chunk-DBTS5QBX.mjs";
+import {
+  renderVueBodyTeleport
+} from "./chunk-7RIWAO2A.mjs";
 
+// src/components/Tooltip.ts
+import { defineComponent, computed, h } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  createFloatingIdFactory,
+  getTooltipContainerClasses,
+  getTooltipTriggerClasses,
+  getTooltipContentClasses
+} from "@expcat/tigercat-core";
 var createTooltipId = createFloatingIdFactory("tooltip");
 var Tooltip = defineComponent({
   name: "TigerTooltip",
@@ -72,24 +85,26 @@ var Tooltip = defineComponent({
             defaultSlot
           ),
           // Tooltip content (positioned with Floating UI)
-          currentVisible.value ? h(
-            "div",
-            {
-              ref: floatingRef,
-              style: floatingStyles.value,
-              "aria-hidden": false
-            },
-            [
-              h(
-                "div",
-                {
-                  id: tooltipId,
-                  role: "tooltip",
-                  class: contentClasses.value
-                },
-                slots.content ? slots.content() : props.content
-              )
-            ]
+          currentVisible.value ? renderVueBodyTeleport(
+            h(
+              "div",
+              {
+                ref: floatingRef,
+                style: floatingStyles.value,
+                "aria-hidden": false
+              },
+              [
+                h(
+                  "div",
+                  {
+                    id: tooltipId,
+                    role: "tooltip",
+                    class: contentClasses.value
+                  },
+                  slots.content ? slots.content() : props.content
+                )
+              ]
+            )
           ) : null
         ]
       );
@@ -98,4 +113,7 @@ var Tooltip = defineComponent({
 });
 var Tooltip_default = Tooltip;
 
-export { Tooltip, Tooltip_default };
+export {
+  Tooltip,
+  Tooltip_default
+};

package/dist/chunk-BPAN6T7H.mjs

@@ -1,7 +1,16 @@
-import { defineComponent, ref, computed, h } from 'vue';
-import { starViewBox, starPathD, classNames, rateInactiveColor, rateHoverColor, rateActiveColor, getRateStarClasses, rateBaseClasses, coerceClassValue } from '@expcat/tigercat-core';
-
 // src/components/Rate.ts
+import { defineComponent, h, ref, computed } from "vue";
+import {
+  rateBaseClasses,
+  getRateStarClasses,
+  rateActiveColor,
+  rateInactiveColor,
+  rateHoverColor,
+  starPathD,
+  starViewBox,
+  classNames,
+  coerceClassValue
+} from "@expcat/tigercat-core";
 var Rate = defineComponent({
   name: "TigerRate",
   props: {
@@ -132,4 +141,7 @@ var Rate = defineComponent({
 });
 var Rate_default = Rate;
 
-export { Rate, Rate_default };
+export {
+  Rate,
+  Rate_default
+};