@expcat/tigercat-react 2.1.1 → 2.1.3

package/dist/chunk-V7HJ5HLC.mjs

@@ -1,412 +0,0 @@
-import {
-  renderBodyPortal,
-  useEscapeKey
-} from "./chunk-HKAZXG74.mjs";
-import {
-  useTigerConfig
-} from "./chunk-YSIXURBW.mjs";
-
-// src/components/ImagePreview.tsx
-import { useState, useRef, useEffect, useMemo, useCallback } from "react";
-import {
-  classNames,
-  imagePreviewMaskClasses,
-  imagePreviewWrapperClasses,
-  imagePreviewImgClasses,
-  imagePreviewToolbarClasses,
-  imagePreviewToolbarBtnClasses,
-  imagePreviewNavBtnClasses,
-  imagePreviewCloseBtnClasses,
-  imagePreviewCounterClasses,
-  zoomInIconPath,
-  zoomOutIconPath,
-  resetIconPath,
-  prevIconPath,
-  nextIconPath,
-  previewCloseIconPath,
-  imageViewerIcons,
-  clampScale,
-  calculateTransform,
-  getPreviewNavState,
-  normalizeRotation,
-  createPanState,
-  startPan,
-  movePan,
-  createPinchState,
-  startPinch,
-  movePinch,
-  getImageViewerLabels,
-  mergeTigerLocale
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var SvgIcon = ({ d, cls = "w-5 h-5" }) => /* @__PURE__ */ jsx(
-  "svg",
-  {
-    className: cls,
-    xmlns: "http://www.w3.org/2000/svg",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    stroke: "currentColor",
-    children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d })
-  }
-);
-var ImagePreview = ({
-  open,
-  images,
-  currentIndex = 0,
-  zIndex = 1050,
-  maskClosable = true,
-  scaleStep = 0.5,
-  minScale = 0.25,
-  maxScale = 5,
-  touchSwipeable = true,
-  touchSwipeThreshold = 48,
-  locale,
-  onOpenChange,
-  onCurrentIndexChange,
-  onScaleChange
-}) => {
-  const config = useTigerConfig();
-  const mergedLocale = useMemo(
-    () => mergeTigerLocale(config.locale, locale),
-    [config.locale, locale]
-  );
-  const labels = useMemo(() => getImageViewerLabels(mergedLocale), [mergedLocale]);
-  const isOpen = open ?? false;
-  const [scale, setScale] = useState(1);
-  const [rotation, setRotation] = useState(0);
-  const [offsetX, setOffsetX] = useState(0);
-  const [offsetY, setOffsetY] = useState(0);
-  const [index, setIndex] = useState(currentIndex);
-  const draggingRef = useRef(false);
-  const dragStartRef = useRef({ x: 0, y: 0, ox: 0, oy: 0 });
-  const panRef = useRef(createPanState());
-  const pinchRef = useRef(createPinchState());
-  const touchSwipeRef = useRef({
-    isTracking: false,
-    startX: 0,
-    startY: 0,
-    currentX: 0,
-    currentY: 0
-  });
-  const resetTransform = useCallback(() => {
-    setScale(1);
-    setRotation(0);
-    setOffsetX(0);
-    setOffsetY(0);
-    panRef.current = createPanState();
-    pinchRef.current = createPinchState();
-    touchSwipeRef.current.isTracking = false;
-  }, []);
-  useEffect(() => {
-    setIndex(currentIndex);
-    resetTransform();
-  }, [currentIndex, resetTransform]);
-  useEffect(() => {
-    if (isOpen) {
-      resetTransform();
-      setIndex(currentIndex);
-      document.body.style.overflow = "hidden";
-    } else {
-      document.body.style.overflow = "";
-    }
-    return () => {
-      document.body.style.overflow = "";
-    };
-  }, [isOpen, currentIndex, resetTransform]);
-  const handleClose = useCallback(() => {
-    onOpenChange?.(false);
-  }, [onOpenChange]);
-  useEscapeKey({ enabled: !!isOpen, onEscape: handleClose });
-  const navState = useMemo(() => getPreviewNavState(index, images.length), [index, images.length]);
-  const handleZoomIn = useCallback(() => {
-    setScale((s) => {
-      const next = clampScale(s + scaleStep, minScale, maxScale);
-      onScaleChange?.(next);
-      return next;
-    });
-  }, [scaleStep, minScale, maxScale, onScaleChange]);
-  const handleZoomOut = useCallback(() => {
-    setScale((s) => {
-      const next = clampScale(s - scaleStep, minScale, maxScale);
-      onScaleChange?.(next);
-      return next;
-    });
-  }, [scaleStep, minScale, maxScale, onScaleChange]);
-  const handleReset = useCallback(() => {
-    resetTransform();
-    onScaleChange?.(1);
-  }, [resetTransform, onScaleChange]);
-  const handleRotateLeft = useCallback(() => {
-    setRotation((value) => normalizeRotation(value - 90));
-  }, []);
-  const handleRotateRight = useCallback(() => {
-    setRotation((value) => normalizeRotation(value + 90));
-  }, []);
-  const handlePrev = useCallback(() => {
-    if (index > 0) {
-      const next = index - 1;
-      setIndex(next);
-      resetTransform();
-      onCurrentIndexChange?.(next);
-    }
-  }, [index, resetTransform, onCurrentIndexChange]);
-  const handleNext = useCallback(() => {
-    if (index < images.length - 1) {
-      const next = index + 1;
-      setIndex(next);
-      resetTransform();
-      onCurrentIndexChange?.(next);
-    }
-  }, [index, images.length, resetTransform, onCurrentIndexChange]);
-  useEffect(() => {
-    if (!isOpen) return;
-    const handler = (e) => {
-      if (e.key === "ArrowLeft") handlePrev();
-      if (e.key === "ArrowRight") handleNext();
-    };
-    document.addEventListener("keydown", handler);
-    return () => document.removeEventListener("keydown", handler);
-  }, [isOpen, handlePrev, handleNext]);
-  const handleWheel = useCallback(
-    (e) => {
-      e.preventDefault();
-      const delta = e.deltaY > 0 ? -scaleStep : scaleStep;
-      setScale((s) => {
-        const next = clampScale(s + delta, minScale, maxScale);
-        onScaleChange?.(next);
-        return next;
-      });
-    },
-    [scaleStep, minScale, maxScale, onScaleChange]
-  );
-  const handleMouseDown = useCallback(
-    (e) => {
-      if (e.button !== 0) return;
-      e.preventDefault();
-      draggingRef.current = true;
-      dragStartRef.current = { x: e.clientX, y: e.clientY, ox: offsetX, oy: offsetY };
-    },
-    [offsetX, offsetY]
-  );
-  const handleMouseMove = useCallback((e) => {
-    if (!draggingRef.current) return;
-    setOffsetX(dragStartRef.current.ox + (e.clientX - dragStartRef.current.x));
-    setOffsetY(dragStartRef.current.oy + (e.clientY - dragStartRef.current.y));
-  }, []);
-  const handleMouseUp = useCallback(() => {
-    draggingRef.current = false;
-  }, []);
-  const handleTouchStart = useCallback(
-    (e) => {
-      if (e.touches.length === 2) {
-        e.preventDefault();
-        touchSwipeRef.current.isTracking = false;
-        pinchRef.current = startPinch(e.touches[0], e.touches[1], scale);
-        return;
-      }
-      if (e.touches.length === 1) {
-        const touch = e.touches[0];
-        if (touchSwipeable && images.length > 1 && scale === 1) {
-          touchSwipeRef.current = {
-            isTracking: true,
-            startX: touch.clientX,
-            startY: touch.clientY,
-            currentX: touch.clientX,
-            currentY: touch.clientY
-          };
-          panRef.current = createPanState();
-          return;
-        }
-        touchSwipeRef.current.isTracking = false;
-        panRef.current = startPan(touch.clientX, touch.clientY, offsetX, offsetY);
-      }
-    },
-    [images.length, offsetX, offsetY, scale, touchSwipeable]
-  );
-  const handleTouchMove = useCallback(
-    (e) => {
-      if (e.touches.length === 2 && pinchRef.current.isPinching) {
-        e.preventDefault();
-        const next = movePinch(pinchRef.current, e.touches[0], e.touches[1], minScale, maxScale);
-        setScale(next);
-        onScaleChange?.(next);
-        return;
-      }
-      if (e.touches.length === 1 && panRef.current.isPanning) {
-        const next = movePan(panRef.current, e.touches[0].clientX, e.touches[0].clientY);
-        setOffsetX(next.translateX);
-        setOffsetY(next.translateY);
-        return;
-      }
-      if (e.touches.length === 1 && touchSwipeRef.current.isTracking) {
-        const touch = e.touches[0];
-        touchSwipeRef.current.currentX = touch.clientX;
-        touchSwipeRef.current.currentY = touch.clientY;
-        const deltaX = touch.clientX - touchSwipeRef.current.startX;
-        const deltaY = touch.clientY - touchSwipeRef.current.startY;
-        if (Math.abs(deltaX) > 8 && Math.abs(deltaX) > Math.abs(deltaY)) {
-          e.preventDefault();
-        }
-      }
-    },
-    [maxScale, minScale, onScaleChange]
-  );
-  const handleTouchEnd = useCallback(
-    (e) => {
-      if (touchSwipeRef.current.isTracking) {
-        const endedTouch = e?.changedTouches?.[0];
-        const currentX = endedTouch?.clientX ?? touchSwipeRef.current.currentX;
-        const currentY = endedTouch?.clientY ?? touchSwipeRef.current.currentY;
-        const deltaX = currentX - touchSwipeRef.current.startX;
-        const deltaY = currentY - touchSwipeRef.current.startY;
-        const threshold = Math.max(0, touchSwipeThreshold);
-        if (Math.abs(deltaX) >= threshold && Math.abs(deltaX) > Math.abs(deltaY) * 1.2) {
-          if (deltaX < 0) {
-            handleNext();
-          } else {
-            handlePrev();
-          }
-        }
-      }
-      touchSwipeRef.current.isTracking = false;
-      panRef.current = createPanState();
-      pinchRef.current = createPinchState();
-    },
-    [handleNext, handlePrev, touchSwipeThreshold]
-  );
-  const handleMaskClick = useCallback(() => {
-    if (maskClosable) {
-      handleClose();
-    }
-  }, [maskClosable, handleClose]);
-  const transform = useMemo(
-    () => `${calculateTransform(scale, offsetX, offsetY)} rotate(${rotation}deg)`,
-    [scale, offsetX, offsetY, rotation]
-  );
-  if (!isOpen || !images.length) return null;
-  const currentSrc = images[index] || images[0];
-  return renderBodyPortal(
-    /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: imagePreviewWrapperClasses,
-        style: { zIndex },
-        role: "dialog",
-        "aria-modal": "true",
-        "aria-label": labels.previewDialogAriaLabel,
-        onWheel: handleWheel,
-        children: [
-          /* @__PURE__ */ jsx("div", { className: imagePreviewMaskClasses, "aria-hidden": "true", onClick: handleMaskClick }),
-          /* @__PURE__ */ jsx(
-            "img",
-            {
-              src: currentSrc,
-              className: imagePreviewImgClasses,
-              style: { transform },
-              alt: `Preview image ${index + 1}`,
-              draggable: false,
-              onMouseDown: handleMouseDown,
-              onMouseMove: handleMouseMove,
-              onMouseUp: handleMouseUp,
-              onMouseLeave: handleMouseUp,
-              onTouchStart: handleTouchStart,
-              onTouchMove: handleTouchMove,
-              onTouchEnd: handleTouchEnd,
-              onTouchCancel: handleTouchEnd
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              className: imagePreviewCloseBtnClasses,
-              onClick: handleClose,
-              "aria-label": labels.closePreviewAriaLabel,
-              type: "button",
-              children: /* @__PURE__ */ jsx(SvgIcon, { d: previewCloseIconPath })
-            }
-          ),
-          images.length > 1 && /* @__PURE__ */ jsx(
-            "button",
-            {
-              className: classNames(imagePreviewNavBtnClasses, "left-4"),
-              onClick: handlePrev,
-              disabled: !navState.hasPrev,
-              "aria-label": labels.previousImageAriaLabel,
-              type: "button",
-              children: /* @__PURE__ */ jsx(SvgIcon, { d: prevIconPath })
-            }
-          ),
-          images.length > 1 && /* @__PURE__ */ jsx(
-            "button",
-            {
-              className: classNames(imagePreviewNavBtnClasses, "right-4"),
-              onClick: handleNext,
-              disabled: !navState.hasNext,
-              "aria-label": labels.nextImageAriaLabel,
-              type: "button",
-              children: /* @__PURE__ */ jsx(SvgIcon, { d: nextIconPath })
-            }
-          ),
-          /* @__PURE__ */ jsxs("div", { className: imagePreviewToolbarClasses, children: [
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                className: imagePreviewToolbarBtnClasses,
-                onClick: handleZoomOut,
-                "aria-label": labels.zoomOutAriaLabel,
-                type: "button",
-                children: /* @__PURE__ */ jsx(SvgIcon, { d: zoomOutIconPath })
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                className: imagePreviewToolbarBtnClasses,
-                onClick: handleReset,
-                "aria-label": labels.resetAriaLabel,
-                type: "button",
-                children: /* @__PURE__ */ jsx(SvgIcon, { d: resetIconPath })
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                className: imagePreviewToolbarBtnClasses,
-                onClick: handleZoomIn,
-                "aria-label": labels.zoomInAriaLabel,
-                type: "button",
-                children: /* @__PURE__ */ jsx(SvgIcon, { d: zoomInIconPath })
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                className: imagePreviewToolbarBtnClasses,
-                onClick: handleRotateLeft,
-                "aria-label": labels.rotateLeftAriaLabel,
-                type: "button",
-                children: /* @__PURE__ */ jsx(SvgIcon, { d: imageViewerIcons.rotateLeft })
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                className: imagePreviewToolbarBtnClasses,
-                onClick: handleRotateRight,
-                "aria-label": labels.rotateRightAriaLabel,
-                type: "button",
-                children: /* @__PURE__ */ jsx(SvgIcon, { d: imageViewerIcons.rotateRight })
-              }
-            ),
-            navState.counter && /* @__PURE__ */ jsx("span", { className: imagePreviewCounterClasses, children: navState.counter })
-          ] })
-        ]
-      }
-    )
-  );
-};
-
-export {
-  ImagePreview
-};

package/dist/chunk-VSFDT2RS.mjs

@@ -1,46 +0,0 @@
-// src/components/Divider.tsx
-import React, { useMemo } from "react";
-import {
-  getDividerClasses,
-  getDividerStyle
-} from "@expcat/tigercat-core";
-import { jsx } from "react/jsx-runtime";
-var Divider = React.memo(
-  ({
-    orientation = "horizontal",
-    lineStyle = "solid",
-    spacing = "md",
-    color,
-    thickness,
-    className,
-    style: styleProp,
-    ...props
-  }) => {
-    const classes = useMemo(() => {
-      const base = getDividerClasses(orientation, lineStyle, spacing);
-      return className ? `${base} ${className}` : base;
-    }, [orientation, lineStyle, spacing, className]);
-    const style = useMemo(
-      () => ({
-        ...getDividerStyle(orientation, color, thickness),
-        ...styleProp
-      }),
-      [color, thickness, orientation, styleProp]
-    );
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ...props,
-        className: classes,
-        style,
-        role: "separator",
-        "aria-orientation": orientation
-      }
-    );
-  }
-);
-Divider.displayName = "Divider";
-
-export {
-  Divider
-};

package/dist/chunk-W7BC4I2Y.mjs

@@ -1,68 +0,0 @@
-import {
-  useTigerConfig
-} from "./chunk-YSIXURBW.mjs";
-
-// src/components/Empty.tsx
-import { useMemo } from "react";
-import {
-  classNames,
-  emptyBaseClasses,
-  emptyImageClasses,
-  emptyDescriptionClasses,
-  emptyActionsClasses,
-  emptyIllustrationViewBox,
-  emptyIllustrationPaths,
-  getEmptyDescription,
-  mergeTigerLocale
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var Empty = ({
-  preset = "default",
-  description,
-  showImage = true,
-  image,
-  extra,
-  className,
-  children,
-  locale,
-  ...props
-}) => {
-  const config = useTigerConfig();
-  const mergedLocale = useMemo(
-    () => mergeTigerLocale(config.locale, locale),
-    [config.locale, locale]
-  );
-  const descText = useMemo(
-    () => description ?? getEmptyDescription(preset, mergedLocale),
-    [description, preset, mergedLocale]
-  );
-  const wrapperClasses = useMemo(() => classNames(emptyBaseClasses, className), [className]);
-  return /* @__PURE__ */ jsxs("div", { className: wrapperClasses, ...props, children: [
-    showImage && /* @__PURE__ */ jsx("div", { className: emptyImageClasses, children: image !== void 0 ? image : /* @__PURE__ */ jsx(
-      "svg",
-      {
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: emptyIllustrationViewBox,
-        className: "mx-auto h-24 w-24",
-        children: emptyIllustrationPaths.map((p, i) => /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: p.d,
-            fill: p.fill ?? "none",
-            stroke: p.stroke,
-            strokeWidth: p.strokeWidth,
-            opacity: p.opacity
-          },
-          i
-        ))
-      }
-    ) }),
-    descText && /* @__PURE__ */ jsx("div", { className: emptyDescriptionClasses, children: descText }),
-    extra && /* @__PURE__ */ jsx("div", { className: emptyActionsClasses, children: extra }),
-    children && /* @__PURE__ */ jsx("div", { children })
-  ] });
-};
-
-export {
-  Empty
-};

package/dist/chunk-WK45IRP7.mjs

@@ -1,93 +0,0 @@
-// src/components/Watermark.tsx
-import { useEffect, useRef, useState, useMemo } from "react";
-import {
-  classNames,
-  watermarkDefaults,
-  watermarkWrapperClasses,
-  resolveWatermarkFont,
-  createWatermarkRenderController,
-  getWatermarkOverlayStyle
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-var Watermark = ({
-  content,
-  image,
-  width = watermarkDefaults.width,
-  height = watermarkDefaults.height,
-  rotate = watermarkDefaults.rotate,
-  zIndex = watermarkDefaults.zIndex,
-  gapX = watermarkDefaults.gapX,
-  gapY = watermarkDefaults.gapY,
-  offsetX = watermarkDefaults.offsetX,
-  offsetY = watermarkDefaults.offsetY,
-  font,
-  className,
-  children,
-  ...props
-}) => {
-  const [base64, setBase64] = useState();
-  const wrapperRef = useRef(null);
-  const renderControllerRef = useRef(null);
-  const resolvedFont = useMemo(() => resolveWatermarkFont(font), [font]);
-  useEffect(() => {
-    const target = wrapperRef.current;
-    if (!target) return;
-    const controller = createWatermarkRenderController({
-      getRenderOptions: () => ({
-        content,
-        image,
-        width,
-        height,
-        rotate,
-        font: resolvedFont
-      }),
-      onRender: setBase64
-    });
-    renderControllerRef.current = controller;
-    controller.observe(target);
-    controller.render();
-    return () => {
-      controller.disconnect();
-      if (renderControllerRef.current === controller) {
-        renderControllerRef.current = null;
-      }
-    };
-  }, [content, image, width, height, rotate, resolvedFont]);
-  useEffect(() => {
-    if (typeof MutationObserver === "undefined" || !wrapperRef.current) return;
-    const observer = new MutationObserver((mutations) => {
-      for (const m of mutations) {
-        for (const node of Array.from(m.removedNodes)) {
-          if (node.dataset?.watermark === "true") {
-            renderControllerRef.current?.render();
-            return;
-          }
-        }
-      }
-    });
-    observer.observe(wrapperRef.current, { childList: true });
-    return () => observer.disconnect();
-  }, []);
-  const overlayStyle = useMemo(
-    () => getWatermarkOverlayStyle({
-      base64Url: base64,
-      width,
-      height,
-      gapX,
-      gapY,
-      offsetX,
-      offsetY,
-      zIndex
-    }),
-    [base64, width, height, gapX, gapY, offsetX, offsetY, zIndex]
-  );
-  const wrapperClasses = useMemo(() => classNames(watermarkWrapperClasses, className), [className]);
-  return /* @__PURE__ */ jsxs("div", { ref: wrapperRef, className: wrapperClasses, ...props, children: [
-    children,
-    /* @__PURE__ */ jsx("div", { "data-watermark": "true", "aria-hidden": "true", style: overlayStyle })
-  ] });
-};
-
-export {
-  Watermark
-};

package/dist/chunk-WX5VUIGT.mjs

@@ -1,22 +0,0 @@
-// src/components/Header.tsx
-import {
-  classNames,
-  getLayoutHeaderClasses
-} from "@expcat/tigercat-core";
-import { jsx } from "react/jsx-runtime";
-var Header = ({
-  className,
-  variant = "default",
-  height = "64px",
-  style,
-  children,
-  ...props
-}) => {
-  const headerClasses = classNames(getLayoutHeaderClasses(variant), className);
-  const headerStyle = { ...style, height };
-  return /* @__PURE__ */ jsx("header", { className: headerClasses, style: headerStyle, ...props, children });
-};
-
-export {
-  Header
-};