@expcat/tigercat-react 1.4.0 → 1.5.0

package/dist/{chunk-EHIXCFD7.js → chunk-JHRFG5PG.js}

@@ -1,4 +1,8 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }// src/components/ImageAnnotation.tsx
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+var _chunkTDODFBBOjs = require('./chunk-TDODFBBO.js');
+
+// src/components/ImageAnnotation.tsx
 var _react = require('react');
 
 
@@ -18,12 +22,15 @@ var _react = require('react');
 
 
 
+
+
 
 
 
 var _tigercatcore = require('@expcat/tigercat-core');
 var _jsxruntime = require('react/jsx-runtime');
 function ImageAnnotation({
+  locale,
   src,
   alt = "Image to annotate",
   value,
@@ -45,6 +52,22 @@ function ImageAnnotation({
   onToolChange,
   onReady
 }) {
+  const config = _chunkTDODFBBOjs.useTigerConfig.call(void 0, );
+  const mergedLocale = _react.useMemo.call(void 0, 
+    () => _tigercatcore.mergeTigerLocale.call(void 0, config.locale, locale),
+    [config.locale, locale]
+  );
+  const labels = _react.useMemo.call(void 0, () => _tigercatcore.getImageEditorLabels.call(void 0, mergedLocale), [mergedLocale]);
+  const toolLabels = _react.useMemo.call(void 0, 
+    () => ({
+      select: labels.selectToolText,
+      rectangle: labels.rectangleToolText,
+      ellipse: labels.ellipseToolText,
+      polygon: labels.polygonToolText,
+      freehand: labels.freehandToolText
+    }),
+    [labels]
+  );
   const containerRef = _react.useRef.call(void 0, null);
   const overlayRef = _react.useRef.call(void 0, null);
   const idSeedRef = _react.useRef.call(void 0, 0);
@@ -183,13 +206,20 @@ function ImageAnnotation({
     },
     [activeTool, canEdit, getPointFromEvent]
   );
+  const removeAnnotation = _react.useCallback.call(void 0, 
+    (annotation) => {
+      if (!canEdit) return;
+      const next = annotations.filter((item) => item.id !== annotation.id);
+      commitAnnotations(next, { type: "remove", annotation });
+      selectAnnotation(null);
+    },
+    [annotations, canEdit, commitAnnotations, selectAnnotation]
+  );
   const removeSelectedAnnotation = _react.useCallback.call(void 0, () => {
     if (!canEdit || !activeSelectedId) return;
     const removed = annotations.find((annotation) => annotation.id === activeSelectedId);
-    const next = annotations.filter((annotation) => annotation.id !== activeSelectedId);
-    commitAnnotations(next, { type: "remove", annotation: removed });
-    selectAnnotation(null);
-  }, [activeSelectedId, annotations, canEdit, commitAnnotations, selectAnnotation]);
+    if (removed) removeAnnotation(removed);
+  }, [activeSelectedId, annotations, canEdit, removeAnnotation]);
   const handleKeyDown = _react.useCallback.call(void 0, 
     (event) => {
       if (event.key === "Escape") {
@@ -212,6 +242,20 @@ function ImageAnnotation({
     (annotation, isDraft = false) => {
       const selected = !isDraft && annotation.id === activeSelectedId;
       const stroke = _tigercatcore.getImageAnnotationStrokeColor.call(void 0, annotation);
+      const onKeyDown = (event) => {
+        if (isDraft) return;
+        if (_tigercatcore.isActivationKey.call(void 0, event)) {
+          event.preventDefault();
+          event.stopPropagation();
+          selectAnnotation(annotation);
+          return;
+        }
+        if (event.key === "Delete" || event.key === "Backspace") {
+          event.preventDefault();
+          event.stopPropagation();
+          removeAnnotation(annotation);
+        }
+      };
       const commonProps = {
         stroke,
         strokeWidth: selected ? strokeWidth + 1 : strokeWidth,
@@ -220,7 +264,8 @@ function ImageAnnotation({
         role: "button",
         tabIndex: isDraft ? -1 : 0,
         "aria-label": _tigercatcore.getImageAnnotationShapeAriaLabel.call(void 0, annotation),
-        className: _tigercatcore.classNames.call(void 0, !isDraft && "cursor-pointer focus:outline-none")
+        className: _tigercatcore.classNames.call(void 0, !isDraft && "cursor-pointer focus:outline-none"),
+        onKeyDown: isDraft ? void 0 : onKeyDown
       };
       const onClick = (event) => {
         if (isDraft) return;
@@ -267,7 +312,7 @@ function ImageAnnotation({
         annotation.id
       );
     },
-    [activeSelectedId, displayHeight, displayWidth, selectAnnotation, strokeWidth]
+    [activeSelectedId, displayHeight, displayWidth, removeAnnotation, selectAnnotation, strokeWidth]
   );
   const renderedAnnotations = _react.useMemo.call(void 0, 
     () => annotations.map((annotation) => renderAnnotation(annotation)),
@@ -290,7 +335,7 @@ function ImageAnnotation({
   }) : null;
   const containerClasses = _tigercatcore.classNames.call(void 0, _tigercatcore.imageAnnotationContainerClasses, className);
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: containerClasses, style, onKeyDown: handleKeyDown, children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.imageAnnotationToolbarClasses, "aria-label": "Annotation tools", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.imageAnnotationToolbarClasses, "aria-label": labels.annotationToolbarAriaLabel, children: [
       tools.map((item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         "button",
         {
@@ -299,7 +344,7 @@ function ImageAnnotation({
           disabled: disabled || readonly,
           "aria-pressed": activeTool === item,
           onClick: () => setActiveTool(item),
-          children: _tigercatcore.getImageAnnotationToolLabel.call(void 0, item)
+          children: toolLabels[item]
         },
         item
       )),
@@ -310,7 +355,7 @@ function ImageAnnotation({
           className: _tigercatcore.imageAnnotationDeleteButtonClasses,
           disabled: !canEdit || !activeSelectedId,
           onClick: removeSelectedAnnotation,
-          children: "Delete"
+          children: labels.deleteText
         }
       )
     ] }),
@@ -321,7 +366,7 @@ function ImageAnnotation({
         className: _tigercatcore.imageAnnotationStageClasses,
         style: { width: imageLoaded ? `${displayWidth}px` : void 0 },
         role: imageLoaded ? "application" : "img",
-        "aria-label": imageLoaded ? "Image annotation editor" : "Loading image for annotation",
+        "aria-label": imageLoaded ? labels.annotationEditorAriaLabel : labels.loadingAnnotationImageAriaLabel,
         children: !imageLoaded ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex min-h-[200px] min-w-[240px] items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-8 w-8 animate-spin rounded-full border-2 border-[var(--tiger-border,#d1d5db)] border-t-[var(--tiger-primary,#2563eb)]" }) }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             "img",
@@ -344,7 +389,7 @@ function ImageAnnotation({
               width: displayWidth,
               height: displayHeight,
               viewBox: `0 0 ${displayWidth} ${displayHeight}`,
-              "aria-label": "Image annotation canvas",
+              "aria-label": labels.annotationCanvasAriaLabel,
               onMouseDown: handleStageMouseDown,
               onClick: handleStageClick,
               onDoubleClick: commitPolygon,

package/dist/{chunk-3EB42WFR.mjs → chunk-KCPGFO5R.mjs}

@@ -14,7 +14,7 @@ import {
   resultExtraClasses,
   getResultColorScheme,
   getResultIconPath,
-  getResultHttpLabel
+  isHttpResultStatus
 } from "@expcat/tigercat-core";
 import { jsx, jsxs } from "react/jsx-runtime";
 var Result = ({
@@ -29,7 +29,7 @@ var Result = ({
 }) => {
   const colors = useMemo(() => getResultColorScheme(status), [status]);
   const iconPath = useMemo(() => getResultIconPath(status), [status]);
-  const httpLabel = useMemo(() => getResultHttpLabel(status), [status]);
+  const httpLabel = useMemo(() => isHttpResultStatus(status) ? status : void 0, [status]);
   const wrapperClasses = useMemo(() => classNames(resultBaseClasses, className), [className]);
   const iconContainerCls = useMemo(
     () => classNames(resultIconContainerBaseClasses, colors.iconBg),

package/dist/{chunk-G3PBQ4B4.mjs → chunk-KQ4ZKXXN.mjs}

@@ -15,7 +15,8 @@ var Segmented = ({
   size = "md",
   block = false,
   className,
-  onChange
+  onChange,
+  ...rest
 }) => {
   function handleSelect(opt) {
     if (opt.disabled || disabled) return;
@@ -23,12 +24,59 @@ var Segmented = ({
     onChange?.(opt.value);
   }
   const selectedIndex = options.findIndex((opt) => opt.value === value);
+  const firstEnabledIndex = options.findIndex((opt) => !opt.disabled);
+  const rovingIndex = selectedIndex >= 0 ? selectedIndex : firstEnabledIndex;
+  function focusOption(container, index) {
+    if (!container) return;
+    const els = container.querySelectorAll('[role="radio"]');
+    els[index]?.focus();
+  }
+  function handleKeyDown(e, index) {
+    if (disabled) return;
+    const enabledIdxs = options.reduce((acc, opt, i) => {
+      if (!opt.disabled) acc.push(i);
+      return acc;
+    }, []);
+    if (enabledIdxs.length === 0) return;
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      handleSelect(options[index]);
+      return;
+    }
+    const pos = enabledIdxs.indexOf(index);
+    let target = null;
+    switch (e.key) {
+      case "ArrowRight":
+      case "ArrowDown":
+        target = enabledIdxs[(pos + 1 + enabledIdxs.length) % enabledIdxs.length];
+        break;
+      case "ArrowLeft":
+      case "ArrowUp":
+        target = enabledIdxs[(pos - 1 + enabledIdxs.length) % enabledIdxs.length];
+        break;
+      case "Home":
+        target = enabledIdxs[0];
+        break;
+      case "End":
+        target = enabledIdxs[enabledIdxs.length - 1];
+        break;
+      default:
+        return;
+    }
+    if (target == null) return;
+    e.preventDefault();
+    const container = e.currentTarget.closest('[role="radiogroup"]');
+    focusOption(container, target);
+    handleSelect(options[target]);
+  }
   return /* @__PURE__ */ jsxs(
     "div",
     {
+      ...rest,
       className: classNames(getSegmentedContainerClasses(size, block), className),
       style: getSegmentedContainerStyle(options.length),
       role: "radiogroup",
+      "aria-disabled": disabled || void 0,
       children: [
         /* @__PURE__ */ jsx(
           "div",
@@ -39,7 +87,7 @@ var Segmented = ({
             style: getSegmentedIndicatorStyle(selectedIndex, options.length, size)
           }
         ),
-        options.map((opt) => {
+        options.map((opt, index) => {
           const selected = opt.value === value;
           const isDisabled = !!opt.disabled || disabled;
           return /* @__PURE__ */ jsx(
@@ -52,7 +100,9 @@ var Segmented = ({
               role: "radio",
               "aria-checked": selected,
               "aria-disabled": isDisabled,
+              tabIndex: isDisabled ? -1 : index === rovingIndex ? 0 : -1,
               onClick: () => handleSelect(opt),
+              onKeyDown: (e) => handleKeyDown(e, index),
               children: /* @__PURE__ */ jsx("span", { children: opt.label })
             },
             opt.value

package/dist/{chunk-MC26ORSN.js → chunk-KSXGH3FO.js}

@@ -1,15 +1,15 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkZZAR4IDSjs = require('./chunk-ZZAR4IDS.js');
+var _chunk4TPRBVW7js = require('./chunk-4TPRBVW7.js');
 
 
-var _chunkYRVAF2IDjs = require('./chunk-YRVAF2ID.js');
+var _chunk5QLSTNA3js = require('./chunk-5QLSTNA3.js');
 
 
 var _chunkQYYAXM5Fjs = require('./chunk-QYYAXM5F.js');
 
 
-var _chunkZJI2VLILjs = require('./chunk-ZJI2VLIL.js');
+var _chunkTLDTBCT6js = require('./chunk-TLDTBCT6.js');
 
 
 var _chunkUF3DXKCIjs = require('./chunk-UF3DXKCI.js');
@@ -121,11 +121,11 @@ var ActivityFeed = ({
                   }
                 ) : null,
                 item.status ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                  _chunkZJI2VLILjs.Tag,
+                  _chunkTLDTBCT6js.Tag,
                   {
                     variant: _nullishCoalesce(item.status.variant, () => ( "default")),
                     size: "sm",
-                    className: "shrink-0 rounded-full px-2 py-0.5 text-[10px] font-semibold tracking-wide uppercase border border-current bg-opacity-10 shadow-sm",
+                    className: "shrink-0 rounded-full px-2 py-0.5 text-[10px] font-semibold tracking-wide uppercase border border-current bg-current/10 shadow-sm",
                     children: item.status.label
                   }
                 ) : null
@@ -176,7 +176,7 @@ var ActivityFeed = ({
             variant: "bordered",
             size: "sm",
             className: "tiger-activity-feed-loading bg-white/40 dark:bg-gray-900/20 border-gray-100 dark:border-gray-800/80 backdrop-blur-sm rounded-2xl shadow-sm overflow-hidden",
-            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center justify-center py-8", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYRVAF2IDjs.Loading, { text: loadingText, className: "text-blue-500 dark:text-blue-400 font-medium" }) })
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center justify-center py-8", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5QLSTNA3js.Loading, { text: loadingText, className: "text-blue-500 dark:text-blue-400 font-medium" }) })
           }
         )
       }
@@ -250,7 +250,7 @@ var ActivityFeed = ({
             )
           ] }))) : null,
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _chunkZZAR4IDSjs.Timeline,
+            _chunk4TPRBVW7js.Timeline,
             {
               items: timelineItems,
               style: {

package/dist/{chunk-X7JAYXPY.js → chunk-KVWSVDAJ.js}

@@ -3,10 +3,10 @@
 var _chunkXTV5JLLCjs = require('./chunk-XTV5JLLC.js');
 
 
-var _chunkWV5XHYW6js = require('./chunk-WV5XHYW6.js');
+var _chunk23XPDNCAjs = require('./chunk-23XPDNCA.js');
 
 
-var _chunkUVMQJOTXjs = require('./chunk-UVMQJOTX.js');
+var _chunkSK7PXSVEjs = require('./chunk-SK7PXSVE.js');
 
 
 var _chunkUKLVOR4Ejs = require('./chunk-UKLVOR4E.js');
@@ -201,7 +201,7 @@ var TreeMapChart = ({
     }
   );
   const tooltip = showTooltip && hoverable ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkUVMQJOTXjs.ChartTooltip,
+    _chunkSK7PXSVEjs.ChartTooltip,
     {
       content: tooltipContent,
       visible: resolvedHoveredIndex !== null && tooltipContent !== "",
@@ -218,7 +218,7 @@ var TreeMapChart = ({
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: wrapperClasses, children: [
     chart,
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkWV5XHYW6js.ChartLegend,
+      _chunk23XPDNCAjs.ChartLegend,
       {
         items: legendItems,
         position: legendPosition,

package/dist/{chunk-OFRKYQOZ.mjs → chunk-LACDTZTE.mjs}

@@ -1,12 +1,12 @@
 import {
   Textarea
-} from "./chunk-DVEK5SO6.mjs";
+} from "./chunk-D4X3NBAI.mjs";
 import {
   Button
 } from "./chunk-5TE7KLE5.mjs";
 import {
   Tag
-} from "./chunk-WMPCN7OF.mjs";
+} from "./chunk-MZCGQED3.mjs";
 import {
   Text
 } from "./chunk-HLS4CHWX.mjs";
@@ -296,7 +296,7 @@ var CommentThread = ({
                 {
                   size: "sm",
                   variant: node.tag.variant ?? "default",
-                  className: "rounded-full px-2 py-0.5 text-[10px] font-semibold tracking-wide uppercase border border-current bg-opacity-10",
+                  className: "rounded-full px-2 py-0.5 text-[10px] font-semibold tracking-wide uppercase border border-current bg-current/10",
                   children: node.tag.label
                 }
               ) : null,
@@ -305,7 +305,7 @@ var CommentThread = ({
                 {
                   size: "sm",
                   variant: tag.variant ?? "default",
-                  className: "rounded-full px-2 py-0.5 text-[10px] font-semibold tracking-wide uppercase border border-current bg-opacity-10",
+                  className: "rounded-full px-2 py-0.5 text-[10px] font-semibold tracking-wide uppercase border border-current bg-current/10",
                   children: tag.label
                 },
                 `${node.id}-tag-${index}`

package/dist/{chunk-YH57D4AV.mjs → chunk-LAKPYMBZ.mjs}

@@ -62,6 +62,7 @@ var InfiniteScroll = ({
       threshold,
       direction,
       root: containerRef.current,
+      inverse,
       onLoadMore: () => {
         if (!disabled && !loading && hasMore) {
           onLoadMoreRef.current?.();

package/dist/{chunk-6GU5NH5F.mjs → chunk-LBXNMCXN.mjs}

@@ -9,6 +9,8 @@ import {
   countLines,
   generateLineNumbers,
   handleTabKey,
+  getActiveLineIndex,
+  getCodeEditorActiveLineClasses,
   codeEditorTextareaClasses,
   codeEditorHighlightClasses
 } from "@expcat/tigercat-core";
@@ -25,6 +27,7 @@ var CodeEditor = ({
   wordWrap = false,
   minLines = 3,
   maxLines = 0,
+  highlightActiveLine = true,
   disabled = false,
   className,
   style,
@@ -32,6 +35,7 @@ var CodeEditor = ({
   highlighter
 }) => {
   const [internalValue, setInternalValue] = useState(defaultValue);
+  const [activeLine, setActiveLine] = useState(0);
   const textareaRef = useRef(null);
   const code = controlledValue !== void 0 ? controlledValue : internalValue;
   const lines = useMemo(() => code.split("\n"), [code]);
@@ -48,11 +52,17 @@ var CodeEditor = ({
     if (maxLines > 0) s.maxHeight = `${maxLines * lineHeight + 1.5}rem`;
     return s;
   }, [minLines, maxLines, style]);
+  const updateActiveLine = useCallback(() => {
+    const ta = textareaRef.current;
+    if (!ta) return;
+    setActiveLine(getActiveLineIndex(ta.value, ta.selectionStart));
+  }, []);
   const handleInput = useCallback(
     (e) => {
       const val = e.target.value;
       setInternalValue(val);
       onChange?.(val);
+      setActiveLine(getActiveLineIndex(val, e.target.selectionStart));
     },
     [onChange]
   );
@@ -74,27 +84,42 @@ var CodeEditor = ({
     [tabSize, onChange]
   );
   const wrapClass = wordWrap ? "whitespace-pre-wrap break-all" : "";
+  const showActiveLine = highlightActiveLine && !disabled;
+  const activeLineClass = getCodeEditorActiveLineClasses(theme);
   const renderToken = (token, idx) => {
     const cls = getTokenClasses(token.type, theme);
     return cls ? /* @__PURE__ */ jsx("span", { className: cls, children: token.value }, idx) : /* @__PURE__ */ jsx(React.Fragment, { children: token.value }, idx);
   };
   const renderLine = (line, lineIndex) => {
+    const lineClass = classNames(
+      "min-h-[1.625rem]",
+      showActiveLine && lineIndex === activeLine && activeLineClass
+    );
     if (highlighter?.highlightLine) {
       const html = highlighter.highlightLine(line, language, theme) || (line === "" ? "\n" : "");
       return /* @__PURE__ */ jsx(
         "div",
         {
-          className: "min-h-[1.625rem]",
+          className: lineClass,
+          "data-active-line": showActiveLine && lineIndex === activeLine ? "" : void 0,
           dangerouslySetInnerHTML: { __html: html }
         },
         lineIndex
       );
     }
     const tokens = tokenizeLine(line, language);
-    return /* @__PURE__ */ jsxs("div", { className: "min-h-[1.625rem]", children: [
-      tokens.map(renderToken),
-      line === "" ? "\n" : null
-    ] }, lineIndex);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: lineClass,
+        "data-active-line": showActiveLine && lineIndex === activeLine ? "" : void 0,
+        children: [
+          tokens.map(renderToken),
+          line === "" ? "\n" : null
+        ]
+      },
+      lineIndex
+    );
   };
   const blockHtml = highlighter && !highlighter.highlightLine && highlighter.highlightCode ? highlighter.highlightCode(code, language, theme) : null;
   return /* @__PURE__ */ jsx(
@@ -123,6 +148,9 @@ var CodeEditor = ({
               value: code,
               onChange: handleInput,
               onKeyDown: handleKeyDown,
+              onSelect: updateActiveLine,
+              onClick: updateActiveLine,
+              onKeyUp: updateActiveLine,
               readOnly: readOnly || disabled,
               disabled,
               placeholder,

package/dist/{chunk-KGMVRIYC.mjs → chunk-LOM6NNQK.mjs}

@@ -1,3 +1,7 @@
+import {
+  useTigerConfig
+} from "./chunk-QAIBQHIO.mjs";
+
 // src/components/ImageViewer.tsx
 import { useState, useCallback, useEffect, useMemo, useRef } from "react";
 import {
@@ -20,7 +24,9 @@ import {
   movePan,
   createPinchState,
   startPinch,
-  movePinch
+  movePinch,
+  getImageViewerLabels,
+  mergeTigerLocale
 } from "@expcat/tigercat-core";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 function SvgIcon({ pathD, label }) {
@@ -40,6 +46,7 @@ function SvgIcon({ pathD, label }) {
   );
 }
 var ImageViewer = ({
+  locale,
   images,
   open = false,
   currentIndex = 0,
@@ -55,6 +62,12 @@ var ImageViewer = ({
   onClose,
   onCurrentIndexChange
 }) => {
+  const config = useTigerConfig();
+  const mergedLocale = useMemo(
+    () => mergeTigerLocale(config.locale, locale),
+    [config.locale, locale]
+  );
+  const labels = useMemo(() => getImageViewerLabels(mergedLocale), [mergedLocale]);
   const [index, setIndex] = useState(currentIndex);
   const [transform, setTransform] = useState(createDefaultTransform);
   const panRef = useRef(createPanState());
@@ -112,7 +125,7 @@ var ImageViewer = ({
       className: backdropClasses,
       role: "dialog",
       "aria-modal": "true",
-      "aria-label": "Image viewer",
+      "aria-label": labels.dialogAriaLabel,
       onClick: (e) => {
         if (maskClosable && e.target === e.currentTarget) handleClose();
       },
@@ -127,9 +140,9 @@ var ImageViewer = ({
           {
             className: imageViewerCloseBtnClasses,
             onClick: handleClose,
-            "aria-label": "Close",
+            "aria-label": labels.closeAriaLabel,
             type: "button",
-            children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.close, label: "Close" })
+            children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.close, label: labels.closeAriaLabel })
           }
         ),
         showNav && images.length > 1 && /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -138,9 +151,9 @@ var ImageViewer = ({
             {
               className: classNames(imageViewerNavBtnClasses, "left-4"),
               onClick: handlePrev,
-              "aria-label": "Previous image",
+              "aria-label": labels.previousImageAriaLabel,
               type: "button",
-              children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.prev, label: "Previous" })
+              children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.prev, label: labels.previousImageAriaLabel })
             }
           ),
           /* @__PURE__ */ jsx(
@@ -148,9 +161,9 @@ var ImageViewer = ({
             {
               className: classNames(imageViewerNavBtnClasses, "right-4"),
               onClick: handleNext,
-              "aria-label": "Next image",
+              "aria-label": labels.nextImageAriaLabel,
               type: "button",
-              children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.next, label: "Next" })
+              children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.next, label: labels.nextImageAriaLabel })
             }
           )
         ] }),
@@ -238,9 +251,9 @@ var ImageViewer = ({
                   ...t,
                   scale: clampZoom(t.scale - 0.25, minZoom, maxZoom)
                 })),
-                "aria-label": "Zoom out",
+                "aria-label": labels.zoomOutAriaLabel,
                 type: "button",
-                children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.zoomOut, label: "Zoom out" })
+                children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.zoomOut, label: labels.zoomOutAriaLabel })
               }
             ),
             /* @__PURE__ */ jsx(
@@ -251,9 +264,9 @@ var ImageViewer = ({
                   ...t,
                   scale: clampZoom(t.scale + 0.25, minZoom, maxZoom)
                 })),
-                "aria-label": "Zoom in",
+                "aria-label": labels.zoomInAriaLabel,
                 type: "button",
-                children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.zoomIn, label: "Zoom in" })
+                children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.zoomIn, label: labels.zoomInAriaLabel })
               }
             )
           ] }),
@@ -263,9 +276,9 @@ var ImageViewer = ({
               {
                 className: imageViewerToolbarBtnClasses,
                 onClick: () => setTransform((t) => ({ ...t, rotation: normalizeRotation(t.rotation - 90) })),
-                "aria-label": "Rotate left",
+                "aria-label": labels.rotateLeftAriaLabel,
                 type: "button",
-                children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.rotateLeft, label: "Rotate left" })
+                children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.rotateLeft, label: labels.rotateLeftAriaLabel })
               }
             ),
             /* @__PURE__ */ jsx(
@@ -273,9 +286,9 @@ var ImageViewer = ({
               {
                 className: imageViewerToolbarBtnClasses,
                 onClick: () => setTransform((t) => ({ ...t, rotation: normalizeRotation(t.rotation + 90) })),
-                "aria-label": "Rotate right",
+                "aria-label": labels.rotateRightAriaLabel,
                 type: "button",
-                children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.rotateRight, label: "Rotate right" })
+                children: /* @__PURE__ */ jsx(SvgIcon, { pathD: imageViewerIcons.rotateRight, label: labels.rotateRightAriaLabel })
               }
             )
           ] })