@expcat/tigercat-react 1.0.0 → 1.0.7

package/dist/chunk-24RUEJWB.js

@@ -1,293 +0,0 @@
-'use strict';
-
-var chunkUKGQ7256_js = require('./chunk-UKGQ7256.js');
-var React = require('react');
-var tigercatCore = require('@expcat/tigercat-core');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-var Kanban = ({
-  columns: controlledColumns,
-  defaultColumns = [],
-  draggable = true,
-  columnDraggable = true,
-  enforceWipLimit = false,
-  beforeCardMove,
-  beforeColumnMove,
-  filterText = "",
-  hiddenColumns,
-  showCardCount = true,
-  allowAddCard = true,
-  allowAddColumn = false,
-  onCardMove,
-  onColumnMove,
-  onColumnsChange,
-  onCardAdd,
-  onColumnAdd,
-  renderCard,
-  renderColumnHeader,
-  className,
-  ...restProps
-}) => {
-  const boardRef = React.useRef(null);
-  const [rawColumns, setInternalColumns, isControlled] = chunkUKGQ7256_js.useControlledState(
-    controlledColumns,
-    defaultColumns
-  );
-  const visibleColumns = React.useMemo(
-    () => tigercatCore.filterColumns(rawColumns, filterText, hiddenColumns),
-    [rawColumns, filterText, hiddenColumns]
-  );
-  const [dragState, setDragState] = React.useState(null);
-  const [dropTargetCol, setDropTargetCol] = React.useState(null);
-  const [dropTargetIdx, setDropTargetIdx] = React.useState(-1);
-  function updateColumns(cols) {
-    if (!isControlled) setInternalColumns(cols);
-    onColumnsChange?.(cols);
-  }
-  function resetDrag() {
-    setDragState(null);
-    setDropTargetCol(null);
-    setDropTargetIdx(-1);
-  }
-  const handleCardDragStart = React.useCallback(
-    (e, card, colId, idx) => {
-      if (!draggable) return;
-      tigercatCore.setDragData(e.nativeEvent.dataTransfer, tigercatCore.createCardDragData(card.id, colId, idx));
-      setDragState({ type: "card", id: card.id, fromColumnId: colId, fromIndex: idx });
-    },
-    [draggable]
-  );
-  const handleColumnDragStart = React.useCallback(
-    (e, colId, idx) => {
-      if (!columnDraggable) return;
-      tigercatCore.setDragData(e.nativeEvent.dataTransfer, tigercatCore.createColumnDragData(colId, idx));
-      setDragState({ type: "column", id: colId, fromIndex: idx });
-    },
-    [columnDraggable]
-  );
-  const handleDragOver = React.useCallback(
-    (e, colId) => {
-      e.preventDefault();
-      if (!dragState) return;
-      setDropTargetCol(colId);
-      if (dragState.type === "card") {
-        const colEl = e.currentTarget.querySelector("[data-kanban-body]");
-        if (colEl) {
-          const cards = Array.from(colEl.querySelectorAll("[data-kanban-card]"));
-          const rects = cards.map((c) => c.getBoundingClientRect());
-          setDropTargetIdx(tigercatCore.getDropIndex(e.clientY, rects));
-        }
-      }
-    },
-    [dragState]
-  );
-  const handleColumnDragOver = React.useCallback(
-    (e) => {
-      e.preventDefault();
-      if (!dragState || dragState.type !== "column") return;
-      const boardEl = boardRef.current;
-      if (!boardEl) return;
-      const cols = Array.from(boardEl.querySelectorAll("[data-kanban-column]"));
-      const rects = cols.map((c) => c.getBoundingClientRect());
-      setDropTargetIdx(tigercatCore.getColumnDropIndex(e.clientX, rects));
-    },
-    [dragState]
-  );
-  const handleDrop = React.useCallback(
-    async (e) => {
-      e.preventDefault();
-      const data = tigercatCore.parseDragData(e.nativeEvent.dataTransfer);
-      if (!data || !dragState) {
-        resetDrag();
-        return;
-      }
-      if (data.type === "card" && dropTargetCol != null) {
-        if (beforeCardMove) {
-          const evt = {
-            cardId: data.cardId,
-            fromColumnId: data.columnId,
-            toColumnId: dropTargetCol,
-            fromIndex: data.index,
-            toIndex: dropTargetIdx
-          };
-          const ok = await beforeCardMove(evt);
-          if (!ok) {
-            resetDrag();
-            return;
-          }
-        }
-        const result = tigercatCore.moveCard(
-          rawColumns,
-          data.cardId,
-          data.columnId,
-          dropTargetCol,
-          dropTargetIdx,
-          { enforceWipLimit }
-        );
-        if (result) {
-          updateColumns(result.columns);
-          onCardMove?.(result.event);
-        }
-      } else if (data.type === "column") {
-        if (beforeColumnMove) {
-          const evt = {
-            columnId: data.columnId,
-            fromIndex: data.index,
-            toIndex: dropTargetIdx
-          };
-          const ok = await beforeColumnMove(evt);
-          if (!ok) {
-            resetDrag();
-            return;
-          }
-        }
-        const result = tigercatCore.reorderColumns(rawColumns, data.index, dropTargetIdx);
-        if (result) {
-          updateColumns(result.columns);
-          onColumnMove?.(result.event);
-        }
-      }
-      resetDrag();
-    },
-    [
-      dragState,
-      dropTargetCol,
-      dropTargetIdx,
-      rawColumns,
-      enforceWipLimit,
-      beforeCardMove,
-      beforeColumnMove,
-      onCardMove,
-      onColumnMove
-    ]
-  );
-  const containerClasses = React.useMemo(
-    () => tigercatCore.classNames(tigercatCore.getKanbanContainerClasses(className)),
-    [className]
-  );
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      ref: boardRef,
-      className: containerClasses,
-      role: "region",
-      "aria-label": "Kanban board",
-      onDragOver: handleColumnDragOver,
-      ...restProps,
-      children: [
-        visibleColumns.map((col, colIdx) => {
-          const wipExceeded = tigercatCore.isWipExceeded(col);
-          const cardCount = tigercatCore.getColumnCardCount(col);
-          const isDragOverCol = dropTargetCol === col.id;
-          const isColDragging = dragState?.type === "column" && dragState.id === col.id;
-          return /* @__PURE__ */ jsxRuntime.jsxs(
-            "div",
-            {
-              className: tigercatCore.classNames(
-                tigercatCore.taskBoardColumnClasses,
-                isDragOverCol && dragState?.type === "card" && tigercatCore.taskBoardColumnDropTargetClasses,
-                isColDragging && tigercatCore.taskBoardColumnDraggingClasses
-              ),
-              "data-kanban-column": "",
-              draggable: columnDraggable,
-              onDragStart: (e) => handleColumnDragStart(e, col.id, colIdx),
-              onDragOver: (e) => handleDragOver(e, col.id),
-              onDrop: handleDrop,
-              onDragEnd: resetDrag,
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsxs(
-                  "div",
-                  {
-                    className: tigercatCore.classNames(
-                      tigercatCore.taskBoardColumnHeaderClasses,
-                      wipExceeded && tigercatCore.taskBoardWipExceededClasses
-                    ),
-                    children: [
-                      renderColumnHeader ? renderColumnHeader(col) : /* @__PURE__ */ jsxRuntime.jsx("span", { children: col.title }),
-                      showCardCount && /* @__PURE__ */ jsxRuntime.jsx(
-                        "span",
-                        {
-                          className: tigercatCore.classNames(
-                            tigercatCore.kanbanCardCountClasses,
-                            wipExceeded && tigercatCore.taskBoardWipExceededClasses
-                          ),
-                          children: cardCount.limit ? `${cardCount.count}/${cardCount.limit}` : `${cardCount.count}`
-                        }
-                      )
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: tigercatCore.taskBoardColumnBodyClasses, "data-kanban-body": "", children: [
-                  col.cards.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: tigercatCore.taskBoardEmptyClasses, children: "No cards" }) : col.cards.map((card, cardIdx) => {
-                    const isCardDragging = dragState?.type === "card" && dragState.id === card.id;
-                    return /* @__PURE__ */ jsxRuntime.jsxs(React__default.default.Fragment, { children: [
-                      isDragOverCol && dragState?.type === "card" && dropTargetIdx === cardIdx && /* @__PURE__ */ jsxRuntime.jsx("div", { className: tigercatCore.taskBoardDropIndicatorClasses }),
-                      /* @__PURE__ */ jsxRuntime.jsx(
-                        "div",
-                        {
-                          className: tigercatCore.classNames(
-                            tigercatCore.taskBoardCardClasses,
-                            isCardDragging && tigercatCore.taskBoardCardDraggingClasses
-                          ),
-                          draggable,
-                          "data-kanban-card": "",
-                          onDragStart: (e) => handleCardDragStart(e, card, col.id, cardIdx),
-                          children: renderCard ? renderCard(card, col.id) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium text-sm", children: card.title }),
-                            card.description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-[var(--tiger-text-muted,#6b7280)] mt-1", children: card.description })
-                          ] })
-                        }
-                      )
-                    ] }, card.id);
-                  }),
-                  isDragOverCol && dragState?.type === "card" && dropTargetIdx >= col.cards.length && /* @__PURE__ */ jsxRuntime.jsx("div", { className: tigercatCore.taskBoardDropIndicatorClasses })
-                ] }),
-                allowAddCard && /* @__PURE__ */ jsxRuntime.jsx(
-                  "div",
-                  {
-                    className: tigercatCore.kanbanAddCardClasses,
-                    role: "button",
-                    tabIndex: 0,
-                    onClick: () => onCardAdd?.(col.id),
-                    onKeyDown: (e) => {
-                      if (e.key === "Enter" || e.key === " ") {
-                        e.preventDefault();
-                        onCardAdd?.(col.id);
-                      }
-                    },
-                    children: "+ Add card"
-                  }
-                )
-              ]
-            },
-            col.id
-          );
-        }),
-        allowAddColumn && /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            className: tigercatCore.kanbanAddColumnClasses,
-            role: "button",
-            tabIndex: 0,
-            onClick: () => onColumnAdd?.(),
-            onKeyDown: (e) => {
-              if (e.key === "Enter" || e.key === " ") {
-                e.preventDefault();
-                onColumnAdd?.();
-              }
-            },
-            children: "+ Add column"
-          }
-        )
-      ]
-    }
-  );
-};
-var Kanban_default = Kanban;
-
-exports.Kanban = Kanban;
-exports.Kanban_default = Kanban_default;

package/dist/chunk-YXWRSEP5.mjs

@@ -1,286 +0,0 @@
-import { useControlledState } from './chunk-UQMPEMY7.mjs';
-import React, { useRef, useMemo, useState, useCallback } from 'react';
-import { filterColumns, setDragData, createCardDragData, createColumnDragData, getDropIndex, getColumnDropIndex, parseDragData, moveCard, reorderColumns, classNames, getKanbanContainerClasses, isWipExceeded, getColumnCardCount, kanbanCardCountClasses, taskBoardWipExceededClasses, taskBoardColumnHeaderClasses, taskBoardColumnBodyClasses, taskBoardEmptyClasses, taskBoardDropIndicatorClasses, taskBoardCardClasses, taskBoardCardDraggingClasses, kanbanAddCardClasses, taskBoardColumnClasses, taskBoardColumnDropTargetClasses, taskBoardColumnDraggingClasses, kanbanAddColumnClasses } from '@expcat/tigercat-core';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-
-var Kanban = ({
-  columns: controlledColumns,
-  defaultColumns = [],
-  draggable = true,
-  columnDraggable = true,
-  enforceWipLimit = false,
-  beforeCardMove,
-  beforeColumnMove,
-  filterText = "",
-  hiddenColumns,
-  showCardCount = true,
-  allowAddCard = true,
-  allowAddColumn = false,
-  onCardMove,
-  onColumnMove,
-  onColumnsChange,
-  onCardAdd,
-  onColumnAdd,
-  renderCard,
-  renderColumnHeader,
-  className,
-  ...restProps
-}) => {
-  const boardRef = useRef(null);
-  const [rawColumns, setInternalColumns, isControlled] = useControlledState(
-    controlledColumns,
-    defaultColumns
-  );
-  const visibleColumns = useMemo(
-    () => filterColumns(rawColumns, filterText, hiddenColumns),
-    [rawColumns, filterText, hiddenColumns]
-  );
-  const [dragState, setDragState] = useState(null);
-  const [dropTargetCol, setDropTargetCol] = useState(null);
-  const [dropTargetIdx, setDropTargetIdx] = useState(-1);
-  function updateColumns(cols) {
-    if (!isControlled) setInternalColumns(cols);
-    onColumnsChange?.(cols);
-  }
-  function resetDrag() {
-    setDragState(null);
-    setDropTargetCol(null);
-    setDropTargetIdx(-1);
-  }
-  const handleCardDragStart = useCallback(
-    (e, card, colId, idx) => {
-      if (!draggable) return;
-      setDragData(e.nativeEvent.dataTransfer, createCardDragData(card.id, colId, idx));
-      setDragState({ type: "card", id: card.id, fromColumnId: colId, fromIndex: idx });
-    },
-    [draggable]
-  );
-  const handleColumnDragStart = useCallback(
-    (e, colId, idx) => {
-      if (!columnDraggable) return;
-      setDragData(e.nativeEvent.dataTransfer, createColumnDragData(colId, idx));
-      setDragState({ type: "column", id: colId, fromIndex: idx });
-    },
-    [columnDraggable]
-  );
-  const handleDragOver = useCallback(
-    (e, colId) => {
-      e.preventDefault();
-      if (!dragState) return;
-      setDropTargetCol(colId);
-      if (dragState.type === "card") {
-        const colEl = e.currentTarget.querySelector("[data-kanban-body]");
-        if (colEl) {
-          const cards = Array.from(colEl.querySelectorAll("[data-kanban-card]"));
-          const rects = cards.map((c) => c.getBoundingClientRect());
-          setDropTargetIdx(getDropIndex(e.clientY, rects));
-        }
-      }
-    },
-    [dragState]
-  );
-  const handleColumnDragOver = useCallback(
-    (e) => {
-      e.preventDefault();
-      if (!dragState || dragState.type !== "column") return;
-      const boardEl = boardRef.current;
-      if (!boardEl) return;
-      const cols = Array.from(boardEl.querySelectorAll("[data-kanban-column]"));
-      const rects = cols.map((c) => c.getBoundingClientRect());
-      setDropTargetIdx(getColumnDropIndex(e.clientX, rects));
-    },
-    [dragState]
-  );
-  const handleDrop = useCallback(
-    async (e) => {
-      e.preventDefault();
-      const data = parseDragData(e.nativeEvent.dataTransfer);
-      if (!data || !dragState) {
-        resetDrag();
-        return;
-      }
-      if (data.type === "card" && dropTargetCol != null) {
-        if (beforeCardMove) {
-          const evt = {
-            cardId: data.cardId,
-            fromColumnId: data.columnId,
-            toColumnId: dropTargetCol,
-            fromIndex: data.index,
-            toIndex: dropTargetIdx
-          };
-          const ok = await beforeCardMove(evt);
-          if (!ok) {
-            resetDrag();
-            return;
-          }
-        }
-        const result = moveCard(
-          rawColumns,
-          data.cardId,
-          data.columnId,
-          dropTargetCol,
-          dropTargetIdx,
-          { enforceWipLimit }
-        );
-        if (result) {
-          updateColumns(result.columns);
-          onCardMove?.(result.event);
-        }
-      } else if (data.type === "column") {
-        if (beforeColumnMove) {
-          const evt = {
-            columnId: data.columnId,
-            fromIndex: data.index,
-            toIndex: dropTargetIdx
-          };
-          const ok = await beforeColumnMove(evt);
-          if (!ok) {
-            resetDrag();
-            return;
-          }
-        }
-        const result = reorderColumns(rawColumns, data.index, dropTargetIdx);
-        if (result) {
-          updateColumns(result.columns);
-          onColumnMove?.(result.event);
-        }
-      }
-      resetDrag();
-    },
-    [
-      dragState,
-      dropTargetCol,
-      dropTargetIdx,
-      rawColumns,
-      enforceWipLimit,
-      beforeCardMove,
-      beforeColumnMove,
-      onCardMove,
-      onColumnMove
-    ]
-  );
-  const containerClasses = useMemo(
-    () => classNames(getKanbanContainerClasses(className)),
-    [className]
-  );
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: boardRef,
-      className: containerClasses,
-      role: "region",
-      "aria-label": "Kanban board",
-      onDragOver: handleColumnDragOver,
-      ...restProps,
-      children: [
-        visibleColumns.map((col, colIdx) => {
-          const wipExceeded = isWipExceeded(col);
-          const cardCount = getColumnCardCount(col);
-          const isDragOverCol = dropTargetCol === col.id;
-          const isColDragging = dragState?.type === "column" && dragState.id === col.id;
-          return /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: classNames(
-                taskBoardColumnClasses,
-                isDragOverCol && dragState?.type === "card" && taskBoardColumnDropTargetClasses,
-                isColDragging && taskBoardColumnDraggingClasses
-              ),
-              "data-kanban-column": "",
-              draggable: columnDraggable,
-              onDragStart: (e) => handleColumnDragStart(e, col.id, colIdx),
-              onDragOver: (e) => handleDragOver(e, col.id),
-              onDrop: handleDrop,
-              onDragEnd: resetDrag,
-              children: [
-                /* @__PURE__ */ jsxs(
-                  "div",
-                  {
-                    className: classNames(
-                      taskBoardColumnHeaderClasses,
-                      wipExceeded && taskBoardWipExceededClasses
-                    ),
-                    children: [
-                      renderColumnHeader ? renderColumnHeader(col) : /* @__PURE__ */ jsx("span", { children: col.title }),
-                      showCardCount && /* @__PURE__ */ jsx(
-                        "span",
-                        {
-                          className: classNames(
-                            kanbanCardCountClasses,
-                            wipExceeded && taskBoardWipExceededClasses
-                          ),
-                          children: cardCount.limit ? `${cardCount.count}/${cardCount.limit}` : `${cardCount.count}`
-                        }
-                      )
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ jsxs("div", { className: taskBoardColumnBodyClasses, "data-kanban-body": "", children: [
-                  col.cards.length === 0 ? /* @__PURE__ */ jsx("div", { className: taskBoardEmptyClasses, children: "No cards" }) : col.cards.map((card, cardIdx) => {
-                    const isCardDragging = dragState?.type === "card" && dragState.id === card.id;
-                    return /* @__PURE__ */ jsxs(React.Fragment, { children: [
-                      isDragOverCol && dragState?.type === "card" && dropTargetIdx === cardIdx && /* @__PURE__ */ jsx("div", { className: taskBoardDropIndicatorClasses }),
-                      /* @__PURE__ */ jsx(
-                        "div",
-                        {
-                          className: classNames(
-                            taskBoardCardClasses,
-                            isCardDragging && taskBoardCardDraggingClasses
-                          ),
-                          draggable,
-                          "data-kanban-card": "",
-                          onDragStart: (e) => handleCardDragStart(e, card, col.id, cardIdx),
-                          children: renderCard ? renderCard(card, col.id) : /* @__PURE__ */ jsxs(Fragment, { children: [
-                            /* @__PURE__ */ jsx("div", { className: "font-medium text-sm", children: card.title }),
-                            card.description && /* @__PURE__ */ jsx("div", { className: "text-xs text-[var(--tiger-text-muted,#6b7280)] mt-1", children: card.description })
-                          ] })
-                        }
-                      )
-                    ] }, card.id);
-                  }),
-                  isDragOverCol && dragState?.type === "card" && dropTargetIdx >= col.cards.length && /* @__PURE__ */ jsx("div", { className: taskBoardDropIndicatorClasses })
-                ] }),
-                allowAddCard && /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    className: kanbanAddCardClasses,
-                    role: "button",
-                    tabIndex: 0,
-                    onClick: () => onCardAdd?.(col.id),
-                    onKeyDown: (e) => {
-                      if (e.key === "Enter" || e.key === " ") {
-                        e.preventDefault();
-                        onCardAdd?.(col.id);
-                      }
-                    },
-                    children: "+ Add card"
-                  }
-                )
-              ]
-            },
-            col.id
-          );
-        }),
-        allowAddColumn && /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: kanbanAddColumnClasses,
-            role: "button",
-            tabIndex: 0,
-            onClick: () => onColumnAdd?.(),
-            onKeyDown: (e) => {
-              if (e.key === "Enter" || e.key === " ") {
-                e.preventDefault();
-                onColumnAdd?.();
-              }
-            },
-            children: "+ Add column"
-          }
-        )
-      ]
-    }
-  );
-};
-var Kanban_default = Kanban;
-
-export { Kanban, Kanban_default };