@expcat/tigercat-react 2.1.3 → 2.1.4

package/dist/{chunk-TVVLCER6.mjs → chunk-QCRTRRBD.mjs}

@@ -33,6 +33,9 @@ import {
   getImageEditorLabels,
   getInitialCropRect,
   imageCropperContainerClasses,
+  imageCropperSizeHostClasses,
+  planCropperDisplaySize,
+  resolveCropperAvailableSize,
   imageCropperDragAreaClasses,
   imageCropperFrameClasses,
   imageCropperGuideClasses,
@@ -127,10 +130,12 @@ var ImageCropper = forwardRef(
     const defaultCropRectRef = useRef(defaultCropRect);
     const onReadyRef = useRef(onReady);
     const onErrorRef = useRef(onError);
+    const styleRef = useRef(style);
     aspectRef.current = aspectRatio;
     defaultCropRectRef.current = defaultCropRect;
     onReadyRef.current = onReady;
     onErrorRef.current = onError;
+    styleRef.current = style;
     const [status, setStatus] = useState("loading");
     const [displayWidth, setDisplayWidth] = useState(0);
     const [displayHeight, setDisplayHeight] = useState(0);
@@ -160,12 +165,12 @@ var ImageCropper = forwardRef(
       loader.load(src, {
         onLoad: (img, naturalWidth, naturalHeight) => {
           const container = containerRef.current;
-          const size = getCropperDisplaySize(
-            naturalWidth,
-            naturalHeight,
+          const box = resolveCropperAvailableSize(
             container?.clientWidth ?? 0,
-            container?.clientHeight ?? 0
+            container?.clientHeight ?? 0,
+            styleRef.current
           );
+          const size = getCropperDisplaySize(naturalWidth, naturalHeight, box.width, box.height);
           if (!size) {
             setStatus("error");
             onErrorRef.current?.(new Error("Image not loaded"));
@@ -205,15 +210,21 @@ var ImageCropper = forwardRef(
       if (!container || status !== "ready" || typeof ResizeObserver === "undefined") return;
       const observer = new ResizeObserver(() => {
         const natural = naturalSizeRef.current;
-        const next = getCropperDisplaySize(
+        const box = resolveCropperAvailableSize(
+          container.clientWidth,
+          container.clientHeight,
+          styleRef.current
+        );
+        const current = displayDimsRef.current;
+        const next = planCropperDisplaySize(
           natural.w,
           natural.h,
-          container.clientWidth,
-          container.clientHeight
+          box.width,
+          box.height,
+          current.w,
+          current.h
         );
         if (!next) return;
-        const current = displayDimsRef.current;
-        if (next.width === current.w && next.height === current.h) return;
         setCropRect(
           (prev) => remapCropRect(
             prev,
@@ -340,13 +351,10 @@ var ImageCropper = forwardRef(
       },
       [cropRect, setCropRect]
     );
-    const containerClasses = classNames(imageCropperContainerClasses, className);
+    const containerClasses = classNames(imageCropperSizeHostClasses, className);
     const rootStyle = { ...style };
     if (status === "loading" || status === "error") {
       if (rootStyle.minHeight == null) rootStyle.minHeight = 200;
-    } else {
-      if (rootStyle.width == null) rootStyle.width = displayWidth;
-      if (rootStyle.height == null) rootStyle.height = displayHeight;
     }
     if (status !== "ready") {
       return /* @__PURE__ */ jsx(
@@ -354,7 +362,7 @@ var ImageCropper = forwardRef(
         {
           ...rest,
           ref: containerRef,
-          className: classNames(containerClasses, "flex items-center justify-center"),
+          className: classNames(containerClasses, "items-center"),
           style: rootStyle,
           "data-image-cropper": "",
           "data-image-cropper-status": status,
@@ -365,7 +373,7 @@ var ImageCropper = forwardRef(
       );
     }
     const cr = cropRect;
-    return /* @__PURE__ */ jsxs(
+    return /* @__PURE__ */ jsx(
       "div",
       {
         ...rest,
@@ -374,161 +382,169 @@ var ImageCropper = forwardRef(
         style: rootStyle,
         "data-image-cropper": "",
         "data-image-cropper-status": "ready",
-        role: "group",
-        "aria-label": labels.cropperDialogAriaLabel,
-        children: [
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: imageCropperFrameClasses,
-              style: { width: displayWidth, height: displayHeight },
-              children: [
+        children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: imageCropperContainerClasses,
+            style: { width: displayWidth, height: displayHeight },
+            "data-image-cropper-stage": "",
+            role: "group",
+            "aria-label": labels.cropperDialogAriaLabel,
+            children: [
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: imageCropperFrameClasses,
+                  style: { width: displayWidth, height: displayHeight },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "img",
+                      {
+                        src,
+                        className: imageCropperImgClasses,
+                        style: { width: displayWidth, height: displayHeight },
+                        draggable: false,
+                        alt: labels.imageToCropAriaLabel
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      "svg",
+                      {
+                        className: imageCropperMaskClasses,
+                        width: displayWidth,
+                        height: displayHeight,
+                        xmlns: "http://www.w3.org/2000/svg",
+                        children: [
+                          /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("mask", { id: maskId, children: [
+                            /* @__PURE__ */ jsx("rect", { width: displayWidth, height: displayHeight, fill: "white" }),
+                            /* @__PURE__ */ jsx("rect", { x: cr.x, y: cr.y, width: cr.width, height: cr.height, fill: "black" })
+                          ] }) }),
+                          /* @__PURE__ */ jsx(
+                            "rect",
+                            {
+                              width: displayWidth,
+                              height: displayHeight,
+                              fill: IMAGE_CROPPER_MASK_FILL,
+                              mask: `url(#${maskId})`
+                            }
+                          )
+                        ]
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: imageCropperSelectionClasses,
+                  style: {
+                    left: cr.x,
+                    top: cr.y,
+                    width: cr.width,
+                    height: cr.height
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: imageCropperDragAreaClasses,
+                  style: {
+                    left: cr.x,
+                    top: cr.y,
+                    width: cr.width,
+                    height: cr.height
+                  },
+                  "data-crop-move": "",
+                  role: "button",
+                  tabIndex: 0,
+                  "aria-label": labels.moveCropAreaAriaLabel,
+                  onPointerDown: (event) => startDrag(event, "move"),
+                  onKeyDown: handleMoveKeyDown
+                }
+              ),
+              guides && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: imageCropperGuideClasses,
+                    "data-guide": "true",
+                    style: {
+                      left: cr.x,
+                      top: cr.y + cr.height / 3,
+                      width: cr.width,
+                      height: 0,
+                      borderTopWidth: 1,
+                      borderTopStyle: "dashed"
+                    }
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: imageCropperGuideClasses,
+                    "data-guide": "true",
+                    style: {
+                      left: cr.x,
+                      top: cr.y + cr.height * 2 / 3,
+                      width: cr.width,
+                      height: 0,
+                      borderTopWidth: 1,
+                      borderTopStyle: "dashed"
+                    }
+                  }
+                ),
                 /* @__PURE__ */ jsx(
-                  "img",
+                  "div",
                   {
-                    src,
-                    className: imageCropperImgClasses,
-                    style: { width: displayWidth, height: displayHeight },
-                    draggable: false,
-                    alt: labels.imageToCropAriaLabel
+                    className: imageCropperGuideClasses,
+                    "data-guide": "true",
+                    style: {
+                      left: cr.x + cr.width / 3,
+                      top: cr.y,
+                      width: 0,
+                      height: cr.height,
+                      borderLeftWidth: 1,
+                      borderLeftStyle: "dashed"
+                    }
                   }
                 ),
-                /* @__PURE__ */ jsxs(
-                  "svg",
+                /* @__PURE__ */ jsx(
+                  "div",
                   {
-                    className: imageCropperMaskClasses,
-                    width: displayWidth,
-                    height: displayHeight,
-                    xmlns: "http://www.w3.org/2000/svg",
-                    children: [
-                      /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("mask", { id: maskId, children: [
-                        /* @__PURE__ */ jsx("rect", { width: displayWidth, height: displayHeight, fill: "white" }),
-                        /* @__PURE__ */ jsx("rect", { x: cr.x, y: cr.y, width: cr.width, height: cr.height, fill: "black" })
-                      ] }) }),
-                      /* @__PURE__ */ jsx(
-                        "rect",
-                        {
-                          width: displayWidth,
-                          height: displayHeight,
-                          fill: IMAGE_CROPPER_MASK_FILL,
-                          mask: `url(#${maskId})`
-                        }
-                      )
-                    ]
+                    className: imageCropperGuideClasses,
+                    "data-guide": "true",
+                    style: {
+                      left: cr.x + cr.width * 2 / 3,
+                      top: cr.y,
+                      width: 0,
+                      height: cr.height,
+                      borderLeftWidth: 1,
+                      borderLeftStyle: "dashed"
+                    }
                   }
                 )
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: imageCropperSelectionClasses,
-              style: {
-                left: cr.x,
-                top: cr.y,
-                width: cr.width,
-                height: cr.height
-              }
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: imageCropperDragAreaClasses,
-              style: {
-                left: cr.x,
-                top: cr.y,
-                width: cr.width,
-                height: cr.height
-              },
-              "data-crop-move": "",
-              role: "button",
-              tabIndex: 0,
-              "aria-label": labels.moveCropAreaAriaLabel,
-              onPointerDown: (event) => startDrag(event, "move"),
-              onKeyDown: handleMoveKeyDown
-            }
-          ),
-          guides && /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: imageCropperGuideClasses,
-                "data-guide": "true",
-                style: {
-                  left: cr.x,
-                  top: cr.y + cr.height / 3,
-                  width: cr.width,
-                  height: 0,
-                  borderTopWidth: 1,
-                  borderTopStyle: "dashed"
-                }
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: imageCropperGuideClasses,
-                "data-guide": "true",
-                style: {
-                  left: cr.x,
-                  top: cr.y + cr.height * 2 / 3,
-                  width: cr.width,
-                  height: 0,
-                  borderTopWidth: 1,
-                  borderTopStyle: "dashed"
-                }
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: imageCropperGuideClasses,
-                "data-guide": "true",
-                style: {
-                  left: cr.x + cr.width / 3,
-                  top: cr.y,
-                  width: 0,
-                  height: cr.height,
-                  borderLeftWidth: 1,
-                  borderLeftStyle: "dashed"
-                }
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: imageCropperGuideClasses,
-                "data-guide": "true",
-                style: {
-                  left: cr.x + cr.width * 2 / 3,
-                  top: cr.y,
-                  width: 0,
-                  height: cr.height,
-                  borderLeftWidth: 1,
-                  borderLeftStyle: "dashed"
-                }
-              }
-            )
-          ] }),
-          CROP_HANDLES.map((handle) => /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: getCropperHandleClasses(handle),
-              style: getCropperHandleStyle(handle, cr),
-              "data-crop-handle": handle,
-              role: "button",
-              tabIndex: -1,
-              "aria-label": formatCropperResizeAriaLabel(
-                labels.resizeCropAreaAriaLabel,
-                getCropperHandleName(handle, labels)
-              ),
-              onPointerDown: (event) => startDrag(event, "resize", handle)
-            },
-            handle
-          ))
-        ]
+              ] }),
+              CROP_HANDLES.map((handle) => /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: getCropperHandleClasses(handle),
+                  style: getCropperHandleStyle(handle, cr),
+                  "data-crop-handle": handle,
+                  role: "button",
+                  tabIndex: -1,
+                  "aria-label": formatCropperResizeAriaLabel(
+                    labels.resizeCropAreaAriaLabel,
+                    getCropperHandleName(handle, labels)
+                  ),
+                  onPointerDown: (event) => startDrag(event, "resize", handle)
+                },
+                handle
+              ))
+            ]
+          }
+        )
       }
     );
   }

package/dist/{chunk-XKB7ECPU.mjs → chunk-S37KEELR.mjs}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-UJTAHHQT.mjs";
 import {
   useAnchoredOverlay
-} from "./chunk-NPGU6VYD.mjs";
+} from "./chunk-OU2AV7DY.mjs";
 
 // src/utils/use-popup.ts
 import { useCallback, useEffect, useMemo, useRef } from "react";

package/dist/{chunk-RNKUEEIX.mjs → chunk-S5GHNXGQ.mjs}

@@ -1,15 +1,15 @@
 import {
   ImageGroupContext
-} from "./chunk-KVXGNUIE.mjs";
+} from "./chunk-4IVRLBKW.mjs";
 import {
   ImagePreview
-} from "./chunk-OYQ6HTLQ.mjs";
+} from "./chunk-SGKPZW57.mjs";
 import {
   usePopup
-} from "./chunk-XKB7ECPU.mjs";
+} from "./chunk-S37KEELR.mjs";
 import {
   renderOverlayPortal
-} from "./chunk-NPGU6VYD.mjs";
+} from "./chunk-OU2AV7DY.mjs";
 import {
   useTigerConfig
 } from "./chunk-RUIFGSVN.mjs";

package/dist/{chunk-OES5DL3S.mjs → chunk-SCN6UULA.mjs}

@@ -10,7 +10,7 @@ import {
   useEscapeKey,
   useFocusTrap,
   useOverlayPortalTarget
-} from "./chunk-NPGU6VYD.mjs";
+} from "./chunk-OU2AV7DY.mjs";
 import {
   useTigerConfig
 } from "./chunk-RUIFGSVN.mjs";

package/dist/{chunk-OYQ6HTLQ.mjs → chunk-SGKPZW57.mjs}

@@ -3,7 +3,7 @@ import {
   useBodyScrollLock,
   useEscapeKey,
   useFocusTrap
-} from "./chunk-NPGU6VYD.mjs";
+} from "./chunk-OU2AV7DY.mjs";
 import {
   useTigerConfig
 } from "./chunk-RUIFGSVN.mjs";

package/dist/{chunk-C4UZFBFV.mjs → chunk-SOVB7HJF.mjs}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-ST4NN6XV.mjs";
 import {
   ChartTooltip
-} from "./chunk-IPI45RUK.mjs";
+} from "./chunk-JX2WKSVM.mjs";
 import {
   ChartAxis
 } from "./chunk-XZFHPHV5.mjs";

package/dist/{chunk-T5VXIYWF.mjs → chunk-SUHSOVWP.mjs}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-WQMOFDAY.mjs";
 import {
   Loading
-} from "./chunk-BNCUJLRV.mjs";
+} from "./chunk-VW6RNQK4.mjs";
 import {
   Tag
 } from "./chunk-FVA5VKN2.mjs";

package/dist/{chunk-HZGTQGSM.mjs → chunk-UNT7WJ2M.mjs}

@@ -10,7 +10,7 @@ import {
 import {
   renderOverlayPortal,
   useAnchoredOverlay
-} from "./chunk-NPGU6VYD.mjs";
+} from "./chunk-OU2AV7DY.mjs";
 import {
   useTigerConfig
 } from "./chunk-RUIFGSVN.mjs";

package/dist/{chunk-GJRGMIB3.mjs → chunk-UVI5JN47.mjs}

@@ -13,7 +13,7 @@ import {
 import {
   renderOverlayPortal,
   useAnchoredOverlay
-} from "./chunk-NPGU6VYD.mjs";
+} from "./chunk-OU2AV7DY.mjs";
 import {
   useTigerConfig
 } from "./chunk-RUIFGSVN.mjs";

package/dist/{chunk-UAFA5GOL.mjs → chunk-VE3PZFFT.mjs}

@@ -10,6 +10,7 @@ import { forwardRef, useMemo, useState } from "react";
 import {
   rateBaseClasses,
   getRateStarClasses,
+  rateCharacterGlyphClasses,
   rateHalfStarInnerClasses,
   rateActiveColor,
   rateInactiveColor,
@@ -66,7 +67,7 @@ var Rate = forwardRef(function Rate2({
   const normalized = sliderNormalizeValue(currentValue, 0, count, step);
   const displayValue = hoverValue > 0 ? hoverValue : normalized;
   const isChar = character != null && character !== false;
-  const glyph = (extraClass) => isChar ? /* @__PURE__ */ jsx("span", { className: extraClass, children: character }) : /* @__PURE__ */ jsx("svg", { viewBox: starViewBox, fill: "currentColor", className: extraClass ?? "h-full w-full", children: /* @__PURE__ */ jsx("path", { d: starPathD }) });
+  const glyph = (extraClass) => isChar ? /* @__PURE__ */ jsx("span", { className: classNames(rateCharacterGlyphClasses, extraClass), children: character }) : /* @__PURE__ */ jsx("svg", { viewBox: starViewBox, fill: "currentColor", className: extraClass ?? "h-full w-full", children: /* @__PURE__ */ jsx("path", { d: starPathD }) });
   const hitValue = (index, clientX, el) => {
     const half = allowHalf && rateIsInlineStartHalf(clientX, el.getBoundingClientRect(), rtl);
     return half ? index + 0.5 : index + 1;

package/dist/{chunk-XXU5VQV5.mjs → chunk-VGWFHVJ7.mjs}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-ST4NN6XV.mjs";
 import {
   ChartTooltip
-} from "./chunk-IPI45RUK.mjs";
+} from "./chunk-JX2WKSVM.mjs";
 import {
   ChartAxis
 } from "./chunk-XZFHPHV5.mjs";

package/dist/{chunk-BNCUJLRV.mjs → chunk-VW6RNQK4.mjs}

@@ -2,7 +2,7 @@ import {
   renderBodyPortal,
   useBackgroundInert,
   useBodyScrollLock
-} from "./chunk-NPGU6VYD.mjs";
+} from "./chunk-OU2AV7DY.mjs";
 import {
   useTigerConfig
 } from "./chunk-RUIFGSVN.mjs";

package/dist/{chunk-IZC77KAN.mjs → chunk-WWDZAWTS.mjs}

@@ -13,7 +13,7 @@ import {
   useAnchoredOverlay,
   useBodyScrollLock,
   useFocusTrap
-} from "./chunk-NPGU6VYD.mjs";
+} from "./chunk-OU2AV7DY.mjs";
 import {
   useTigerConfig
 } from "./chunk-RUIFGSVN.mjs";

package/dist/{chunk-ZGXC47M5.mjs → chunk-YDIEWFBM.mjs}

@@ -12,7 +12,7 @@ import {
 } from "./chunk-RLUBTLOT.mjs";
 import {
   Loading
-} from "./chunk-BNCUJLRV.mjs";
+} from "./chunk-VW6RNQK4.mjs";
 import {
   useTigerConfig
 } from "./chunk-RUIFGSVN.mjs";

package/dist/{chunk-53RDSFKZ.mjs → chunk-YUFKPLCK.mjs}

@@ -7,7 +7,7 @@ import {
 import {
   renderOverlayPortal,
   useAnchoredOverlay
-} from "./chunk-NPGU6VYD.mjs";
+} from "./chunk-OU2AV7DY.mjs";
 
 // src/components/FormItem.tsx
 import React, { useMemo, useEffect, useState, useCallback, useId, useRef } from "react";

package/dist/{chunk-WSN4Z4MC.mjs → chunk-Z3AD5DZX.mjs}

@@ -7,7 +7,7 @@ import {
   useEscapeKey,
   useFocusTrap,
   useOverlayPortalTarget
-} from "./chunk-NPGU6VYD.mjs";
+} from "./chunk-OU2AV7DY.mjs";
 import {
   useTigerConfig
 } from "./chunk-RUIFGSVN.mjs";

package/dist/{chunk-6NCG4SLX.mjs → chunk-ZZJVJUO4.mjs}

@@ -2,7 +2,7 @@ import {
   Dropdown,
   DropdownItem,
   DropdownMenu
-} from "./chunk-CJSB5NOK.mjs";
+} from "./chunk-H3UEVWOO.mjs";
 import {
   useTigerConfig
 } from "./chunk-RUIFGSVN.mjs";

package/dist/components/ActivityFeed.mjs

@@ -1,10 +1,10 @@
 import {
   ActivityFeed,
   ActivityFeed_default
-} from "../chunk-T5VXIYWF.mjs";
+} from "../chunk-SUHSOVWP.mjs";
 import "../chunk-4DFN6RZ4.mjs";
 import "../chunk-WQMOFDAY.mjs";
-import "../chunk-BNCUJLRV.mjs";
+import "../chunk-VW6RNQK4.mjs";
 import "../chunk-FVA5VKN2.mjs";
 import "../chunk-VDBLI5Y3.mjs";
 import "../chunk-WCIUNNIN.mjs";
@@ -12,7 +12,7 @@ import "../chunk-3KBFOO2E.mjs";
 import "../chunk-IELUUOM4.mjs";
 import "../chunk-WFLXJOFU.mjs";
 import "../chunk-G5NPND2T.mjs";
-import "../chunk-NPGU6VYD.mjs";
+import "../chunk-OU2AV7DY.mjs";
 import "../chunk-RUIFGSVN.mjs";
 export {
   ActivityFeed,

package/dist/components/AreaChart.mjs

@@ -1,16 +1,16 @@
 import {
   AreaChart,
   AreaChart_default
-} from "../chunk-XXU5VQV5.mjs";
+} from "../chunk-VGWFHVJ7.mjs";
 import "../chunk-7H7EKANG.mjs";
 import "../chunk-7P4R3NVO.mjs";
 import "../chunk-ST4NN6XV.mjs";
-import "../chunk-IPI45RUK.mjs";
+import "../chunk-JX2WKSVM.mjs";
 import "../chunk-XZFHPHV5.mjs";
 import "../chunk-OP77MPGN.mjs";
 import "../chunk-2PC625DX.mjs";
 import "../chunk-A4JRK5SM.mjs";
-import "../chunk-NPGU6VYD.mjs";
+import "../chunk-OU2AV7DY.mjs";
 import "../chunk-RUIFGSVN.mjs";
 export {
   AreaChart,

package/dist/components/AutoComplete.mjs

@@ -1,10 +1,10 @@
 import {
   AutoComplete
-} from "../chunk-JML6CK44.mjs";
+} from "../chunk-PQPO7XSV.mjs";
 import "../chunk-2AVQQGL2.mjs";
 import "../chunk-F6T3OLTQ.mjs";
 import "../chunk-UJTAHHQT.mjs";
-import "../chunk-NPGU6VYD.mjs";
+import "../chunk-OU2AV7DY.mjs";
 import "../chunk-RUIFGSVN.mjs";
 export {
   AutoComplete