@expcat/tigercat-react 1.0.4 → 1.1.0

package/dist/chunk-Y3NDP56G.mjs

@@ -1,174 +0,0 @@
-import { useChartInteraction } from './chunk-3CDAG4HD.mjs';
-import { ChartTooltip } from './chunk-LVC43YX2.mjs';
-import { ChartCanvas } from './chunk-IS467WAO.mjs';
-import React, { useMemo } from 'react';
-import { getChartInnerRect, computeHeatmapCells, resolveChartTooltipContent, classNames, chartAxisTickTextClasses, getChartElementOpacity } from '@expcat/tigercat-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var HeatmapChart = ({
-  width = 400,
-  height = 300,
-  padding = 40,
-  data,
-  xLabels,
-  yLabels,
-  minColor = "#f0f9ff",
-  maxColor = "#2563eb",
-  cellRadius = 2,
-  cellGap = 1,
-  showValues = false,
-  valueFormatter,
-  hoverable = false,
-  hoveredIndex: hoveredIndexProp,
-  activeOpacity = 1,
-  inactiveOpacity = 0.25,
-  selectable = false,
-  selectedIndex: selectedIndexProp,
-  showTooltip = true,
-  title,
-  desc,
-  className,
-  onHoveredIndexChange,
-  onSelectedIndexChange,
-  onCellClick,
-  onCellHover
-}) => {
-  const {
-    tooltipPosition,
-    resolvedHoveredIndex,
-    activeIndex,
-    handleMouseEnter,
-    handleMouseMove,
-    handleMouseLeave,
-    handleClick
-  } = useChartInteraction({
-    hoverable,
-    hoveredIndexProp,
-    selectable,
-    selectedIndexProp,
-    activeOpacity,
-    inactiveOpacity,
-    getData: (index) => data[index],
-    onHoveredIndexChange: (index) => {
-      onHoveredIndexChange?.(index);
-      onCellHover?.(index, index !== null ? data[index] : null);
-    },
-    onSelectedIndexChange,
-    callbacks: { onClick: onCellClick }
-  });
-  const innerRect = useMemo(
-    () => getChartInnerRect(width, height, padding),
-    [width, height, padding]
-  );
-  const cells = useMemo(
-    () => computeHeatmapCells(data, {
-      xLabels,
-      yLabels,
-      width: innerRect.width,
-      height: innerRect.height,
-      cellGap,
-      minColor,
-      maxColor
-    }),
-    [data, xLabels, yLabels, innerRect.width, innerRect.height, cellGap, minColor, maxColor]
-  );
-  const tooltipContent = useMemo(
-    () => resolveChartTooltipContent(resolvedHoveredIndex, cells, void 0, (cell) => {
-      const val = valueFormatter ? valueFormatter(cell.value) : `${cell.value}`;
-      return `${cell.xLabel} \xD7 ${cell.yLabel}: ${val}`;
-    }),
-    [resolvedHoveredIndex, cells, valueFormatter]
-  );
-  const interactive = hoverable || selectable;
-  const rect = innerRect;
-  const cellW = (rect.width - cellGap * (xLabels.length - 1)) / xLabels.length;
-  const cellH = (rect.height - cellGap * (yLabels.length - 1)) / yLabels.length;
-  const chart = /* @__PURE__ */ jsxs(
-    ChartCanvas,
-    {
-      width,
-      height,
-      padding,
-      title,
-      desc,
-      className: classNames(className),
-      children: [
-        xLabels.map((lbl, i) => /* @__PURE__ */ jsx(
-          "text",
-          {
-            x: i * (cellW + cellGap) + cellW / 2,
-            y: rect.height + 16,
-            className: chartAxisTickTextClasses,
-            textAnchor: "middle",
-            children: lbl
-          },
-          `x-${i}`
-        )),
-        yLabels.map((lbl, i) => /* @__PURE__ */ jsx(
-          "text",
-          {
-            x: -8,
-            y: i * (cellH + cellGap) + cellH / 2,
-            className: chartAxisTickTextClasses,
-            textAnchor: "end",
-            dominantBaseline: "middle",
-            children: lbl
-          },
-          `y-${i}`
-        )),
-        cells.map((cell, idx) => {
-          const opacity = getChartElementOpacity(idx, activeIndex, {
-            activeOpacity,
-            inactiveOpacity
-          });
-          return /* @__PURE__ */ jsxs(React.Fragment, { children: [
-            /* @__PURE__ */ jsx(
-              "rect",
-              {
-                x: cell.x,
-                y: cell.y,
-                width: cell.w,
-                height: cell.h,
-                rx: cellRadius,
-                fill: cell.fill,
-                opacity,
-                className: classNames(interactive && "cursor-pointer"),
-                style: { transition: "opacity 0.2s ease-out" },
-                onMouseEnter: (e) => handleMouseEnter(idx, e),
-                onMouseMove: handleMouseMove,
-                onMouseLeave: handleMouseLeave,
-                onClick: () => handleClick(idx)
-              }
-            ),
-            showValues && /* @__PURE__ */ jsx(
-              "text",
-              {
-                x: cell.x + cell.w / 2,
-                y: cell.y + cell.h / 2,
-                className: "fill-[color:var(--tiger-text,#374151)] text-[10px]",
-                textAnchor: "middle",
-                dominantBaseline: "middle",
-                children: valueFormatter ? valueFormatter(cell.value) : `${cell.value}`
-              }
-            )
-          ] }, `cell-${idx}`);
-        })
-      ]
-    }
-  );
-  const tooltip = showTooltip && hoverable ? /* @__PURE__ */ jsx(
-    ChartTooltip,
-    {
-      content: tooltipContent,
-      visible: resolvedHoveredIndex !== null && tooltipContent !== "",
-      x: tooltipPosition.x,
-      y: tooltipPosition.y
-    }
-  ) : null;
-  return /* @__PURE__ */ jsxs("div", { className: "inline-block relative", children: [
-    chart,
-    tooltip
-  ] });
-};
-
-export { HeatmapChart };

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 };

package/dist/chunk-Z6CRXABX.js

@@ -1,88 +0,0 @@
-'use strict';
-
-var react = require('react');
-var tigercatCore = require('@expcat/tigercat-core');
-var jsxRuntime = require('react/jsx-runtime');
-
-// src/components/Affix.tsx
-var Affix = ({
-  offsetTop = 0,
-  offsetBottom,
-  target,
-  zIndex = 10,
-  className,
-  children,
-  onChange,
-  ...props
-}) => {
-  const wrapperRef = react.useRef(null);
-  const placeholderRef = react.useRef(null);
-  const originalRectRef = react.useRef(null);
-  const [state, setState] = react.useState({ affixed: false, style: {} });
-  const prevAffixed = react.useRef(false);
-  const update = react.useCallback(() => {
-    const el = prevAffixed.current && placeholderRef.current ? placeholderRef.current : wrapperRef.current;
-    if (!el) return;
-    const rect = el.getBoundingClientRect();
-    if (!originalRectRef.current || !prevAffixed.current) {
-      originalRectRef.current = {
-        top: rect.top,
-        left: rect.left,
-        width: rect.width,
-        height: rect.height
-      };
-    }
-    const resolved = tigercatCore.resolveAffixTarget(target);
-    const containerRect = resolved.getRect();
-    const newState = tigercatCore.calculateAffixState(
-      originalRectRef.current,
-      containerRect,
-      offsetBottom !== void 0 ? void 0 : offsetTop,
-      offsetBottom,
-      zIndex
-    );
-    if (newState.affixed !== prevAffixed.current) {
-      prevAffixed.current = newState.affixed;
-      onChange?.(newState.affixed);
-    }
-    setState(newState);
-  }, [offsetTop, offsetBottom, target, zIndex, onChange]);
-  react.useEffect(() => {
-    const resolved = tigercatCore.resolveAffixTarget(target);
-    const scrollEl = resolved.element;
-    scrollEl.addEventListener("scroll", update, { passive: true });
-    window.addEventListener("resize", update, { passive: true });
-    update();
-    return () => {
-      scrollEl.removeEventListener("scroll", update);
-      window.removeEventListener("resize", update);
-    };
-  }, [target, update]);
-  const wrapperClasses = react.useMemo(() => tigercatCore.classNames(className), [className]);
-  if (state.affixed) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: placeholderRef, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          style: {
-            width: originalRectRef.current?.width ?? 0,
-            height: originalRectRef.current?.height ?? 0
-          }
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          ref: wrapperRef,
-          className: wrapperClasses,
-          style: state.style,
-          ...props,
-          children
-        }
-      )
-    ] });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: wrapperRef, className: wrapperClasses, ...props, children });
-};
-
-exports.Affix = Affix;

package/dist/chunk-ZIUOENTL.mjs

@@ -1,85 +0,0 @@
-import { createContext, useContext, useRef, useState, useCallback, useMemo, useEffect } from 'react';
-import { replaceKeys, toggleKey, classNames, getMenuClasses, initRovingTabIndex } from '@expcat/tigercat-core';
-import { jsx } from 'react/jsx-runtime';
-
-// src/components/Menu.tsx
-var MenuContext = createContext(null);
-function useMenuContext() {
-  return useContext(MenuContext);
-}
-var Menu = ({
-  mode = "vertical",
-  theme = "light",
-  selectedKeys: controlledSelectedKeys,
-  defaultSelectedKeys = [],
-  openKeys: controlledOpenKeys,
-  defaultOpenKeys = [],
-  collapsed = false,
-  multiple = true,
-  inlineIndent = 24,
-  className,
-  style,
-  onSelect,
-  onOpenChange,
-  children
-}) => {
-  const menuRef = useRef(null);
-  const [internalSelectedKeys, setInternalSelectedKeys] = useState(defaultSelectedKeys);
-  const [internalOpenKeys, setInternalOpenKeys] = useState(defaultOpenKeys);
-  const selectedKeys = controlledSelectedKeys !== void 0 ? controlledSelectedKeys : internalSelectedKeys;
-  const openKeys = controlledOpenKeys !== void 0 ? controlledOpenKeys : internalOpenKeys;
-  const handleSelect = useCallback(
-    (key) => {
-      const newSelectedKeys = replaceKeys(key, selectedKeys);
-      if (controlledSelectedKeys === void 0) {
-        setInternalSelectedKeys(newSelectedKeys);
-      }
-      onSelect?.(key, { selectedKeys: newSelectedKeys });
-    },
-    [controlledSelectedKeys, selectedKeys, onSelect]
-  );
-  const handleOpenChange = useCallback(
-    (key) => {
-      const toggled = toggleKey(key, openKeys);
-      const newOpenKeys = multiple ? toggled : toggled.includes(key) ? [key] : [];
-      if (controlledOpenKeys === void 0) {
-        setInternalOpenKeys(newOpenKeys);
-      }
-      onOpenChange?.(key, { openKeys: newOpenKeys });
-    },
-    [openKeys, multiple, controlledOpenKeys, onOpenChange]
-  );
-  const menuClasses = useMemo(() => {
-    return classNames(getMenuClasses(mode, theme, collapsed), className);
-  }, [mode, theme, collapsed, className]);
-  const contextValue = useMemo(
-    () => ({
-      mode,
-      theme,
-      collapsed,
-      inlineIndent,
-      selectedKeys,
-      openKeys,
-      handleSelect,
-      handleOpenChange
-    }),
-    [mode, theme, collapsed, inlineIndent, selectedKeys, openKeys, handleSelect, handleOpenChange]
-  );
-  useEffect(() => {
-    if (menuRef.current) initRovingTabIndex(menuRef.current);
-  }, [mode, collapsed, selectedKeys, openKeys]);
-  return /* @__PURE__ */ jsx(MenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
-    "ul",
-    {
-      ref: menuRef,
-      className: menuClasses,
-      style,
-      role: "menu",
-      "data-tiger-menu-root": "true",
-      "data-tiger-menu-mode": mode,
-      children
-    }
-  ) });
-};
-
-export { Menu, useMenuContext };