@expcat/tigercat-react 2.1.1 → 2.1.3

package/dist/chunk-5SEMRHBD.mjs

@@ -1,327 +0,0 @@
-import {
-  useControlledState
-} from "./chunk-MEFARVQI.mjs";
-import {
-  useTigerConfig
-} from "./chunk-YSIXURBW.mjs";
-
-// src/components/FileManager.tsx
-import { useCallback, useMemo, useRef, useState } from "react";
-import {
-  classNames,
-  getFileManagerContainerClasses,
-  getFileItemClasses,
-  deriveFileManagerModel,
-  toggleFileSelection,
-  resolveFileOpen,
-  sliceBreadcrumbPath,
-  toFileDragItem,
-  applyFileDragReorder,
-  formatFileSizeLabel,
-  getFileManagerLabels,
-  fileManagerToolbarClasses,
-  fileManagerBreadcrumbClasses,
-  fileManagerBreadcrumbItemClasses,
-  fileManagerBreadcrumbSeparatorClasses,
-  fileManagerContentClasses,
-  fileManagerItemIconClasses,
-  fileManagerItemNameClasses,
-  fileManagerItemMetaClasses,
-  fileManagerEmptyClasses,
-  fileManagerLoadingClasses,
-  fileManagerSearchClasses,
-  resolveLocaleText,
-  mergeTigerLocale
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var FileManager = ({
-  files = [],
-  viewMode = "list",
-  selectedKeys,
-  defaultSelectedKeys,
-  multiple = false,
-  columns,
-  sortField = "name",
-  sortOrder = "asc",
-  currentPath = [],
-  showHidden = false,
-  draggable = false,
-  loading = false,
-  emptyText,
-  searchable = false,
-  searchText = "",
-  className,
-  onSelect,
-  onOpen,
-  onNavigate,
-  onSelectedKeysChange,
-  onCurrentPathChange,
-  onSearchTextChange,
-  onReorder,
-  renderIcon,
-  locale
-}) => {
-  const config = useTigerConfig();
-  const mergedLocale = useMemo(
-    () => mergeTigerLocale(config.locale, locale),
-    [config.locale, locale]
-  );
-  const [localSearch, setLocalSearch] = useState(searchText);
-  const [focusedIndex, setFocusedIndex] = useState(0);
-  const contentRef = useRef(null);
-  const dragFromIndex = useRef(null);
-  const labels = useMemo(() => getFileManagerLabels(mergedLocale), [mergedLocale]);
-  const [keys, setKeys] = useControlledState(
-    selectedKeys,
-    defaultSelectedKeys ?? [],
-    onSelectedKeysChange
-  );
-  const metaColumns = columns ?? ["size", "modified"];
-  const showSizeColumn = metaColumns.includes("size");
-  const showModifiedColumn = metaColumns.includes("modified");
-  const showTypeColumn = metaColumns.includes("type");
-  const model = useMemo(
-    () => deriveFileManagerModel({
-      files,
-      currentPath,
-      selectedKeys: keys,
-      sortField,
-      sortOrder,
-      showHidden,
-      searchText: localSearch || searchText
-    }),
-    [files, currentPath, keys, sortField, sortOrder, showHidden, localSearch, searchText]
-  );
-  const containerClasses = useMemo(() => getFileManagerContainerClasses(className), [className]);
-  const handleSelect = useCallback(
-    (item) => {
-      if (item.disabled) return;
-      onSelect?.(item);
-      setKeys(toggleFileSelection(keys, item.key, multiple));
-    },
-    [keys, multiple, onSelect, setKeys]
-  );
-  const handleOpen = useCallback(
-    (item) => {
-      const result = resolveFileOpen(item, currentPath);
-      if (!result) return;
-      if (result.type === "navigate") {
-        onCurrentPathChange?.(result.path);
-        onNavigate?.(result.path);
-      } else {
-        onOpen?.(result.item);
-      }
-    },
-    [currentPath, onOpen, onNavigate, onCurrentPathChange]
-  );
-  const navigateToBreadcrumb = useCallback(
-    (index) => {
-      const newPath = sliceBreadcrumbPath(currentPath, index);
-      onCurrentPathChange?.(newPath);
-      onNavigate?.(newPath);
-    },
-    [currentPath, onNavigate, onCurrentPathChange]
-  );
-  const breadcrumbItems = [
-    /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: fileManagerBreadcrumbItemClasses,
-        onClick: () => navigateToBreadcrumb(0),
-        children: labels.rootText
-      },
-      "root"
-    ),
-    ...currentPath.flatMap((seg, i) => [
-      /* @__PURE__ */ jsx("span", { className: fileManagerBreadcrumbSeparatorClasses, children: "/" }, `sep-${i}`),
-      /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: fileManagerBreadcrumbItemClasses,
-          onClick: () => navigateToBreadcrumb(i + 1),
-          children: seg
-        },
-        `path-${i}`
-      )
-    ])
-  ];
-  const contentClass = viewMode === "grid" ? `${fileManagerContentClasses} grid grid-cols-4 gap-2` : fileManagerContentClasses;
-  const firstEnabledIndex = model.processedItems.findIndex((item) => !item.disabled);
-  const focusedItem = focusedIndex >= 0 && !model.processedItems[focusedIndex]?.disabled ? focusedIndex : firstEnabledIndex;
-  const focusItemAt = useCallback((index) => {
-    requestAnimationFrame(() => {
-      contentRef.current?.querySelector(`[data-option-index="${index}"]`)?.focus();
-    });
-  }, []);
-  const moveFocus = useCallback(
-    (current, direction) => {
-      if (model.processedItems.length === 0) return;
-      let next = current;
-      for (let i = 0; i < model.processedItems.length; i += 1) {
-        next = (next + direction + model.processedItems.length) % model.processedItems.length;
-        if (!model.processedItems[next]?.disabled) {
-          setFocusedIndex(next);
-          focusItemAt(next);
-          return;
-        }
-      }
-    },
-    [focusItemAt, model.processedItems]
-  );
-  const handleItemKeyDown = useCallback(
-    (event, item, index) => {
-      switch (event.key) {
-        case "ArrowDown":
-        case "ArrowRight":
-          event.preventDefault();
-          moveFocus(index, 1);
-          return;
-        case "ArrowUp":
-        case "ArrowLeft":
-          event.preventDefault();
-          moveFocus(index, -1);
-          return;
-        case "Home":
-          event.preventDefault();
-          if (firstEnabledIndex >= 0) {
-            setFocusedIndex(firstEnabledIndex);
-            focusItemAt(firstEnabledIndex);
-          }
-          return;
-        case "End": {
-          event.preventDefault();
-          let lastEnabledIndex = -1;
-          for (let next = model.processedItems.length - 1; next >= 0; next -= 1) {
-            if (!model.processedItems[next]?.disabled) {
-              lastEnabledIndex = next;
-              break;
-            }
-          }
-          if (lastEnabledIndex >= 0) {
-            setFocusedIndex(lastEnabledIndex);
-            focusItemAt(lastEnabledIndex);
-          }
-          return;
-        }
-        case " ":
-          event.preventDefault();
-          handleSelect(item);
-          return;
-        case "Enter":
-          event.preventDefault();
-          handleSelect(item);
-          handleOpen(item);
-          return;
-        default:
-          return;
-      }
-    },
-    [firstEnabledIndex, focusItemAt, handleOpen, handleSelect, model.processedItems, moveFocus]
-  );
-  const handleDragStart = useCallback(
-    (event, item, index) => {
-      if (!draggable || item.disabled) return;
-      dragFromIndex.current = index;
-      event.dataTransfer.effectAllowed = "move";
-      event.dataTransfer.setData("text/plain", String(toFileDragItem(item, index).id));
-    },
-    [draggable]
-  );
-  const handleDragOver = useCallback(
-    (event) => {
-      if (!draggable || dragFromIndex.current === null) return;
-      event.preventDefault();
-      event.dataTransfer.dropEffect = "move";
-    },
-    [draggable]
-  );
-  const handleDrop = useCallback(
-    (event, toIndex) => {
-      if (!draggable) return;
-      const fromIndex = dragFromIndex.current;
-      dragFromIndex.current = null;
-      if (fromIndex === null || fromIndex === toIndex) return;
-      event.preventDefault();
-      const items = model.processedItems;
-      const reordered = applyFileDragReorder(items, {
-        item: toFileDragItem(items[fromIndex], fromIndex),
-        fromIndex,
-        toIndex,
-        fromContainerId: "",
-        toContainerId: ""
-      });
-      onReorder?.(reordered, fromIndex, toIndex);
-    },
-    [draggable, model.processedItems, onReorder]
-  );
-  return /* @__PURE__ */ jsxs("div", { className: classNames(containerClasses), children: [
-    /* @__PURE__ */ jsxs("div", { className: fileManagerToolbarClasses, children: [
-      /* @__PURE__ */ jsx("nav", { className: fileManagerBreadcrumbClasses, "aria-label": "File path", children: breadcrumbItems }),
-      /* @__PURE__ */ jsx("div", { className: "flex-1" }),
-      searchable && /* @__PURE__ */ jsx(
-        "input",
-        {
-          type: "text",
-          className: fileManagerSearchClasses,
-          placeholder: resolveLocaleText("Search...", mergedLocale?.common?.searchPlaceholder),
-          value: localSearch,
-          onChange: (e) => {
-            setLocalSearch(e.target.value);
-            onSearchTextChange?.(e.target.value);
-          }
-        }
-      )
-    ] }),
-    model.processedItems.length > 0 ? /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref: contentRef,
-        className: contentClass,
-        role: "listbox",
-        "aria-multiselectable": multiple,
-        children: model.processedItems.map((item, index) => {
-          const isSelected = model.selectedSet.has(item.key);
-          const itemClass = getFileItemClasses(viewMode, isSelected);
-          const dragItem = draggable && !item.disabled ? toFileDragItem(item, index) : void 0;
-          return /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: itemClass,
-              role: "option",
-              "aria-selected": isSelected,
-              tabIndex: !item.disabled && index === focusedItem ? 0 : -1,
-              "data-option-index": index,
-              "data-disabled": item.disabled || void 0,
-              "data-drag-id": dragItem?.id,
-              onFocus: () => {
-                if (!item.disabled) setFocusedIndex(index);
-              },
-              onKeyDown: (event) => handleItemKeyDown(event, item, index),
-              onClick: () => handleSelect(item),
-              onDoubleClick: () => handleOpen(item),
-              draggable: draggable && !item.disabled,
-              onDragStart: (event) => handleDragStart(event, item, index),
-              onDragOver: handleDragOver,
-              onDrop: (event) => handleDrop(event, index),
-              children: [
-                renderIcon ? renderIcon(item) : /* @__PURE__ */ jsx("span", { className: fileManagerItemIconClasses, "aria-hidden": "true", children: item.type === "folder" ? "\u{1F4C1}" : "\u{1F4C4}" }),
-                /* @__PURE__ */ jsx("span", { className: fileManagerItemNameClasses, children: item.name }),
-                viewMode === "list" && showTypeColumn && /* @__PURE__ */ jsx("span", { className: fileManagerItemMetaClasses, children: item.extension ?? item.type }),
-                viewMode === "list" && showSizeColumn && item.size !== void 0 && /* @__PURE__ */ jsx("span", { className: fileManagerItemMetaClasses, children: formatFileSizeLabel(item.size) }),
-                viewMode === "list" && showModifiedColumn && item.modified && /* @__PURE__ */ jsx("span", { className: fileManagerItemMetaClasses, children: item.modified })
-              ]
-            },
-            item.key
-          );
-        })
-      }
-    ) : /* @__PURE__ */ jsx("div", { className: fileManagerEmptyClasses, children: resolveLocaleText("Empty folder", emptyText, mergedLocale?.common?.emptyText) }),
-    loading && /* @__PURE__ */ jsx("div", { className: fileManagerLoadingClasses, children: resolveLocaleText("Loading...", mergedLocale?.common?.loadingText) })
-  ] });
-};
-var FileManager_default = FileManager;
-
-export {
-  FileManager,
-  FileManager_default
-};

package/dist/chunk-5TE7KLE5.mjs

@@ -1,92 +0,0 @@
-import {
-  useButtonGroupContext
-} from "./chunk-ZJWUBR2X.mjs";
-
-// src/components/Button.tsx
-import React, { useMemo } from "react";
-import {
-  classNames,
-  buttonBaseClasses,
-  buttonSizeClasses,
-  buttonDisabledClasses,
-  buttonDangerClasses,
-  getButtonVariantClasses,
-  getSpinnerSVG,
-  warnUnsupportedColorProp
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var createDefaultSpinner = () => {
-  const spinnerSvg = getSpinnerSVG("spinner");
-  return /* @__PURE__ */ jsx(
-    "svg",
-    {
-      className: "animate-spin h-4 w-4",
-      xmlns: "http://www.w3.org/2000/svg",
-      fill: "none",
-      viewBox: spinnerSvg.viewBox,
-      "aria-hidden": "true",
-      focusable: "false",
-      children: spinnerSvg.elements.map(
-        (el, index) => React.createElement(el.type, { key: index, ...el.attrs })
-      )
-    }
-  );
-};
-var Button = ({
-  variant = "primary",
-  size,
-  disabled = false,
-  loading = false,
-  loadingIcon,
-  icon,
-  block = false,
-  iconPosition = "left",
-  htmlType = "button",
-  danger = false,
-  onClick,
-  children,
-  className,
-  "aria-busy": ariaBusyProp,
-  "aria-disabled": ariaDisabledProp,
-  ...rest
-}) => {
-  warnUnsupportedColorProp("Button", rest);
-  const group = useButtonGroupContext();
-  const resolvedSize = size ?? group?.size ?? "md";
-  const isDisabled = disabled || loading;
-  const ariaBusy = ariaBusyProp ?? (loading ? true : void 0);
-  const ariaDisabled = ariaDisabledProp ?? (isDisabled ? true : void 0);
-  const buttonClasses = useMemo(() => {
-    const variantClasses = danger ? buttonDangerClasses[variant] ?? buttonDangerClasses.primary : getButtonVariantClasses(variant);
-    return classNames(
-      buttonBaseClasses,
-      variantClasses,
-      buttonSizeClasses[resolvedSize],
-      isDisabled && buttonDisabledClasses,
-      block && "w-full",
-      className
-    );
-  }, [variant, resolvedSize, isDisabled, block, danger, className]);
-  const iconIsRight = iconPosition === "right";
-  return /* @__PURE__ */ jsxs(
-    "button",
-    {
-      ...rest,
-      className: buttonClasses,
-      "aria-busy": ariaBusy,
-      "aria-disabled": ariaDisabled,
-      disabled: isDisabled,
-      onClick: isDisabled ? void 0 : onClick,
-      type: htmlType,
-      children: [
-        loading && /* @__PURE__ */ jsx("span", { className: iconIsRight ? "ml-2 order-1" : "mr-2", children: loadingIcon ?? createDefaultSpinner() }),
-        !loading && icon && /* @__PURE__ */ jsx("span", { className: iconIsRight ? "ml-2 order-1" : "mr-2", children: icon }),
-        children
-      ]
-    }
-  );
-};
-
-export {
-  Button
-};

package/dist/chunk-5ZYZQXEM.mjs

@@ -1,188 +0,0 @@
-// src/components/Progress.tsx
-import React from "react";
-import {
-  classNames,
-  getProgressVariantClasses,
-  getProgressTextColorClasses,
-  getStatusVariant,
-  formatProgressText,
-  clampPercentage,
-  calculateCirclePath,
-  getCircleSize,
-  progressLineBaseClasses,
-  progressLineInnerClasses,
-  progressTextBaseClasses,
-  progressCircleBaseClasses,
-  progressLineSizeClasses,
-  progressTextSizeClasses,
-  progressStripedClasses,
-  progressStripedAnimationClasses,
-  progressTrackBgClasses,
-  progressCircleTextClasses,
-  progressCircleTrackStrokeClasses
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var Progress = React.memo(
-  ({
-    variant = "primary",
-    size = "md",
-    type = "line",
-    percentage = 0,
-    status = "normal",
-    showText,
-    text,
-    format,
-    striped = false,
-    stripedAnimation = false,
-    strokeWidth = 6,
-    width = "auto",
-    height,
-    className,
-    style,
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledby,
-    "aria-describedby": ariaDescribedby,
-    ...props
-  }) => {
-    const clampedPercentage = clampPercentage(percentage);
-    const effectiveVariant = getStatusVariant(status) || variant;
-    const shouldShowText = showText ?? type === "line";
-    const displayText = shouldShowText ? formatProgressText(clampedPercentage, text, format) : "";
-    const resolvedAriaLabel = ariaLabel ?? (ariaLabelledby ? void 0 : `Progress: ${clampedPercentage}%`);
-    const ariaAttrs = {
-      role: "progressbar",
-      "aria-label": resolvedAriaLabel,
-      "aria-labelledby": ariaLabelledby,
-      "aria-describedby": ariaDescribedby,
-      "aria-valuenow": clampedPercentage,
-      "aria-valuemin": 0,
-      "aria-valuemax": 100
-    };
-    const renderLineProgress = () => {
-      const containerStyle = width !== "auto" ? { width: typeof width === "number" ? `${width}px` : width } : {};
-      return /* @__PURE__ */ jsxs(
-        "div",
-        {
-          ...props,
-          className: classNames("flex items-center w-full", className),
-          style: { ...style ?? {}, ...containerStyle },
-          children: [
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: classNames(
-                  progressLineBaseClasses,
-                  progressTrackBgClasses,
-                  !height && progressLineSizeClasses[size]
-                ),
-                style: { flex: 1, ...height ? { height: `${height}px` } : {} },
-                children: /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    className: classNames(
-                      progressLineInnerClasses,
-                      getProgressVariantClasses(effectiveVariant),
-                      striped && progressStripedClasses,
-                      striped && stripedAnimation && progressStripedAnimationClasses
-                    ),
-                    style: { width: `${clampedPercentage}%` },
-                    ...ariaAttrs
-                  }
-                )
-              }
-            ),
-            shouldShowText && /* @__PURE__ */ jsx(
-              "span",
-              {
-                className: classNames(
-                  progressTextBaseClasses,
-                  progressTextSizeClasses[size],
-                  getProgressTextColorClasses(effectiveVariant)
-                ),
-                children: displayText
-              }
-            )
-          ]
-        }
-      );
-    };
-    const renderCircleProgress = () => {
-      const {
-        width: svgWidth,
-        height: svgHeight,
-        radius,
-        cx,
-        cy
-      } = getCircleSize(size, strokeWidth);
-      const { strokeDasharray, strokeDashoffset } = calculateCirclePath(radius, clampedPercentage);
-      return /* @__PURE__ */ jsxs(
-        "div",
-        {
-          ...props,
-          className: classNames(progressCircleBaseClasses, className),
-          style: {
-            ...style ?? {},
-            width: `${svgWidth}px`,
-            height: `${svgHeight}px`
-          },
-          children: [
-            /* @__PURE__ */ jsxs("svg", { width: svgWidth, height: svgHeight, viewBox: `0 0 ${svgWidth} ${svgHeight}`, children: [
-              /* @__PURE__ */ jsx(
-                "circle",
-                {
-                  cx,
-                  cy,
-                  r: radius,
-                  fill: "none",
-                  stroke: "currentColor",
-                  className: progressCircleTrackStrokeClasses,
-                  strokeWidth
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                "circle",
-                {
-                  cx,
-                  cy,
-                  r: radius,
-                  fill: "none",
-                  stroke: "currentColor",
-                  className: getProgressVariantClasses(effectiveVariant).replace("bg-", "text-"),
-                  strokeWidth,
-                  strokeLinecap: "round",
-                  strokeDasharray,
-                  strokeDashoffset,
-                  style: {
-                    transition: "stroke-dashoffset 0.3s ease",
-                    transform: "rotate(-90deg)",
-                    transformOrigin: "center"
-                  },
-                  ...ariaAttrs
-                }
-              )
-            ] }),
-            shouldShowText && /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: classNames(
-                  progressCircleTextClasses,
-                  progressTextSizeClasses[size],
-                  "font-medium",
-                  getProgressTextColorClasses(effectiveVariant)
-                ),
-                children: displayText
-              }
-            )
-          ]
-        }
-      );
-    };
-    if (type === "circle") return renderCircleProgress();
-    return renderLineProgress();
-  }
-);
-Progress.displayName = "Progress";
-
-export {
-  Progress
-};

package/dist/chunk-677VSTPW.mjs

@@ -1,72 +0,0 @@
-// src/components/ChartGrid.tsx
-import { useMemo } from "react";
-import {
-  chartGridLineClasses,
-  classNames,
-  getChartAxisTicks,
-  getChartGridLineDasharray
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var ChartGrid = ({
-  xScale,
-  yScale,
-  show = "both",
-  xTicks = 5,
-  yTicks = 5,
-  xTickValues,
-  yTickValues,
-  lineStyle = "solid",
-  strokeWidth = 1,
-  x = 0,
-  y = 0,
-  className,
-  ...props
-}) => {
-  const dasharray = useMemo(() => getChartGridLineDasharray(lineStyle), [lineStyle]);
-  const resolvedXTicks = useMemo(() => {
-    if (!xScale) return [];
-    return getChartAxisTicks(xScale, { tickCount: xTicks, tickValues: xTickValues });
-  }, [xScale, xTicks, xTickValues]);
-  const resolvedYTicks = useMemo(() => {
-    if (!yScale) return [];
-    return getChartAxisTicks(yScale, { tickCount: yTicks, tickValues: yTickValues });
-  }, [yScale, yTicks, yTickValues]);
-  const shouldRenderX = show === "both" || show === "x";
-  const shouldRenderY = show === "both" || show === "y";
-  const xRange = xScale?.range;
-  const yRange = yScale?.range;
-  return /* @__PURE__ */ jsxs("g", { ...props, className: classNames(className), transform: `translate(${x}, ${y})`, children: [
-    shouldRenderX && xScale && yRange ? resolvedXTicks.map((tick) => /* @__PURE__ */ jsx(
-      "line",
-      {
-        x1: tick.position,
-        y1: yRange[0],
-        x2: tick.position,
-        y2: yRange[1],
-        className: chartGridLineClasses,
-        strokeWidth,
-        strokeDasharray: dasharray
-      },
-      `x-${tick.value}`
-    )) : null,
-    shouldRenderY && yScale && xRange ? resolvedYTicks.map((tick) => /* @__PURE__ */ jsx(
-      "line",
-      {
-        x1: xRange[0],
-        y1: tick.position,
-        x2: xRange[1],
-        y2: tick.position,
-        className: chartGridLineClasses,
-        strokeWidth,
-        strokeDasharray: dasharray
-      },
-      `y-${tick.value}`
-    )) : null
-  ] });
-};
-var ChartGrid_default = ChartGrid;
-
-export {
-  ChartGrid,
-  ChartGrid_default
-};