@expcat/tigercat-react 1.0.4 → 1.1.0

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-3NE6VZRY.js

@@ -1,67 +0,0 @@
-'use strict';
-
-var chunkOWUGXP6K_js = require('./chunk-OWUGXP6K.js');
-var react = require('react');
-var tigercatCore = require('@expcat/tigercat-core');
-var jsxRuntime = require('react/jsx-runtime');
-
-var BreadcrumbItem = ({
-  href,
-  target,
-  current = false,
-  separator: customSeparator,
-  className,
-  style,
-  onClick,
-  children,
-  icon,
-  ...props
-}) => {
-  const breadcrumbContext = chunkOWUGXP6K_js.useBreadcrumbContext();
-  const itemClasses = react.useMemo(
-    () => tigercatCore.getBreadcrumbItemClasses(className),
-    [className]
-  );
-  const linkClasses = react.useMemo(() => tigercatCore.getBreadcrumbLinkClasses(current), [current]);
-  const separatorClasses = react.useMemo(() => tigercatCore.getBreadcrumbSeparatorClasses(), []);
-  const separatorContent = react.useMemo(() => {
-    const sep = customSeparator !== void 0 ? customSeparator : breadcrumbContext?.separator || "/";
-    return tigercatCore.getSeparatorContent(sep);
-  }, [customSeparator, breadcrumbContext]);
-  const handleClick = react.useCallback(
-    (event) => {
-      if (!current) {
-        onClick?.(event);
-      }
-    },
-    [current, onClick]
-  );
-  const computedRel = react.useMemo(() => {
-    if (target === "_blank") {
-      return "noopener noreferrer";
-    }
-    return void 0;
-  }, [target]);
-  const contentElements = icon ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex", children: icon }),
-    children
-  ] }) : children;
-  const linkElement = href && !current ? /* @__PURE__ */ jsxRuntime.jsx(
-    "a",
-    {
-      className: linkClasses,
-      href,
-      target,
-      rel: computedRel,
-      onClick: handleClick,
-      children: contentElements
-    }
-  ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: linkClasses, "aria-current": current ? "page" : void 0, children: contentElements });
-  const separatorElement = !current ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: separatorClasses, "aria-hidden": "true", children: separatorContent }) : null;
-  return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: itemClasses, style, ...props, children: [
-    linkElement,
-    separatorElement
-  ] });
-};
-
-exports.BreadcrumbItem = BreadcrumbItem;

package/dist/chunk-7YLVAZJQ.mjs

@@ -1,47 +0,0 @@
-import { classNames, getSegmentedOptionClasses, getSegmentedContainerClasses } from '@expcat/tigercat-core';
-import { jsx } from 'react/jsx-runtime';
-
-// src/components/Segmented.tsx
-var Segmented = ({
-  value,
-  options = [],
-  disabled = false,
-  size = "md",
-  block = false,
-  className,
-  onChange
-}) => {
-  function handleSelect(opt) {
-    if (opt.disabled || disabled) return;
-    if (opt.value === value) return;
-    onChange?.(opt.value);
-  }
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: classNames(getSegmentedContainerClasses(size, block), className),
-      role: "radiogroup",
-      children: options.map((opt) => {
-        const selected = opt.value === value;
-        const isDisabled = !!opt.disabled || disabled;
-        return /* @__PURE__ */ jsx(
-          "label",
-          {
-            className: classNames(
-              getSegmentedOptionClasses(size, selected, isDisabled),
-              block ? "flex-1 text-center" : ""
-            ),
-            role: "radio",
-            "aria-checked": selected,
-            "aria-disabled": isDisabled,
-            onClick: () => handleSelect(opt),
-            children: /* @__PURE__ */ jsx("span", { children: opt.label })
-          },
-          opt.value
-        );
-      })
-    }
-  );
-};
-
-export { Segmented };

package/dist/chunk-A3PYG3D6.js

@@ -1,107 +0,0 @@
-'use strict';
-
-var chunkIBYIPXIO_js = require('./chunk-IBYIPXIO.js');
-var react = require('react');
-var tigercatCore = require('@expcat/tigercat-core');
-var jsxRuntime = require('react/jsx-runtime');
-
-var MenuItem = ({
-  itemKey,
-  disabled = false,
-  icon,
-  className,
-  children,
-  level = 0,
-  collapsed: collapsedOverride
-}) => {
-  const menuContext = chunkIBYIPXIO_js.useMenuContext();
-  if (!menuContext) {
-    console.warn("MenuItem must be used within Menu component");
-  }
-  const isSelected = !!menuContext && tigercatCore.isKeySelected(itemKey, menuContext.selectedKeys);
-  const effectiveCollapsed = collapsedOverride ?? (menuContext ? menuContext.collapsed : false);
-  const itemClasses = tigercatCore.classNames(
-    menuContext ? tigercatCore.getMenuItemClasses(isSelected, disabled, menuContext.theme, effectiveCollapsed) : "flex items-center px-4 py-2 cursor-pointer transition-colors duration-200",
-    className
-  );
-  const indentStyle = menuContext && menuContext.mode === "inline" && level > 0 ? tigercatCore.getMenuItemIndent(level, menuContext.inlineIndent) : {};
-  const handleClick = react.useCallback(() => {
-    if (!disabled && menuContext) {
-      menuContext.handleSelect(itemKey);
-    }
-  }, [disabled, menuContext, itemKey]);
-  const handleKeyDown = react.useCallback(
-    (event) => {
-      if (!menuContext) return;
-      const current = event.currentTarget;
-      const rootMenu = current.closest('ul[role="menu"]');
-      const isRoot = rootMenu?.dataset.tigerMenuRoot === "true";
-      const isHorizontalRoot = isRoot && menuContext.mode === "horizontal";
-      const nextKey = isHorizontalRoot ? "ArrowRight" : "ArrowDown";
-      const prevKey = isHorizontalRoot ? "ArrowLeft" : "ArrowUp";
-      if (event.key === nextKey) {
-        event.preventDefault();
-        tigercatCore.moveFocusInMenu(current, 1);
-        return;
-      }
-      if (event.key === prevKey) {
-        event.preventDefault();
-        tigercatCore.moveFocusInMenu(current, -1);
-        return;
-      }
-      if (event.key === "Home") {
-        event.preventDefault();
-        tigercatCore.focusMenuEdge(current, "start");
-        return;
-      }
-      if (event.key === "End") {
-        event.preventDefault();
-        tigercatCore.focusMenuEdge(current, "end");
-        return;
-      }
-      if (event.key === "Enter" || event.key === " ") {
-        event.preventDefault();
-        handleClick();
-      }
-    },
-    [menuContext, handleClick]
-  );
-  const renderIcon = () => {
-    if (!icon) return null;
-    if (typeof icon === "string") {
-      return /* @__PURE__ */ jsxRuntime.jsx("span", { className: tigercatCore.menuItemIconClasses, dangerouslySetInnerHTML: { __html: icon } });
-    }
-    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: tigercatCore.menuItemIconClasses, children: icon });
-  };
-  const renderLabel = () => {
-    if (!effectiveCollapsed) return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children });
-    if (!icon) {
-      const text = String(children || "");
-      return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-center", children: text.charAt(0).toUpperCase() });
-    }
-    return null;
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("li", { role: "none", children: /* @__PURE__ */ jsxRuntime.jsxs(
-    "button",
-    {
-      type: "button",
-      className: itemClasses,
-      style: indentStyle,
-      role: "menuitem",
-      "data-tiger-menuitem": "true",
-      "data-tiger-selected": isSelected ? "true" : "false",
-      "aria-current": isSelected ? "page" : void 0,
-      "aria-disabled": disabled ? "true" : void 0,
-      disabled,
-      tabIndex: -1,
-      onClick: handleClick,
-      onKeyDown: handleKeyDown,
-      children: [
-        renderIcon(),
-        renderLabel()
-      ]
-    }
-  ) });
-};
-
-exports.MenuItem = MenuItem;

package/dist/chunk-B3LRUKXM.mjs

@@ -1,65 +0,0 @@
-import { useAnchorContext } from './chunk-FNDPGSEW.mjs';
-import React, { useEffect, useMemo } from 'react';
-import { classNames, getAnchorLinkClasses } from '@expcat/tigercat-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var AnchorLink = ({
-  href,
-  title,
-  target,
-  className,
-  children,
-  ...props
-}) => {
-  const anchorContext = useAnchorContext();
-  useEffect(() => {
-    anchorContext?.registerLink(href);
-    return () => {
-      anchorContext?.unregisterLink(href);
-    };
-  }, [href, anchorContext]);
-  const handleClick = (event) => {
-    event.preventDefault();
-    anchorContext?.handleLinkClick(href, event);
-  };
-  const linkClasses = useMemo(() => {
-    const isActive = anchorContext?.activeLink === href;
-    return classNames(getAnchorLinkClasses(isActive, className));
-  }, [anchorContext?.activeLink, href, className]);
-  const hasNestedLinks = React.Children.toArray(children).some(
-    (child) => React.isValidElement(child) && child.type === AnchorLink
-  );
-  if (hasNestedLinks) {
-    return /* @__PURE__ */ jsxs("div", { className: "anchor-link-wrapper", children: [
-      /* @__PURE__ */ jsx(
-        "a",
-        {
-          href,
-          target,
-          className: linkClasses,
-          "data-anchor-href": href,
-          onClick: handleClick,
-          ...props,
-          children: title
-        }
-      ),
-      /* @__PURE__ */ jsx("div", { className: "pl-3 mt-1 space-y-1", children })
-    ] });
-  }
-  const content = children ?? title;
-  return /* @__PURE__ */ jsx(
-    "a",
-    {
-      href,
-      target,
-      className: linkClasses,
-      "data-anchor-href": href,
-      onClick: handleClick,
-      ...props,
-      children: content
-    }
-  );
-};
-var AnchorLink_default = AnchorLink;
-
-export { AnchorLink, AnchorLink_default };

package/dist/chunk-B53R2U2R.mjs

@@ -1,86 +0,0 @@
-import { useRef, useState, useCallback, useEffect, useMemo } from 'react';
-import { resolveAffixTarget, calculateAffixState, classNames } from '@expcat/tigercat-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-// src/components/Affix.tsx
-var Affix = ({
-  offsetTop = 0,
-  offsetBottom,
-  target,
-  zIndex = 10,
-  className,
-  children,
-  onChange,
-  ...props
-}) => {
-  const wrapperRef = useRef(null);
-  const placeholderRef = useRef(null);
-  const originalRectRef = useRef(null);
-  const [state, setState] = useState({ affixed: false, style: {} });
-  const prevAffixed = useRef(false);
-  const update = 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 = resolveAffixTarget(target);
-    const containerRect = resolved.getRect();
-    const newState = 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]);
-  useEffect(() => {
-    const resolved = 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 = useMemo(() => classNames(className), [className]);
-  if (state.affixed) {
-    return /* @__PURE__ */ jsxs("div", { ref: placeholderRef, children: [
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          style: {
-            width: originalRectRef.current?.width ?? 0,
-            height: originalRectRef.current?.height ?? 0
-          }
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          ref: wrapperRef,
-          className: wrapperClasses,
-          style: state.style,
-          ...props,
-          children
-        }
-      )
-    ] });
-  }
-  return /* @__PURE__ */ jsx("div", { ref: wrapperRef, className: wrapperClasses, ...props, children });
-};
-
-export { Affix };