@expcat/tigercat-vue 2.1.0 → 2.1.2

package/dist/{chunk-XLNK3Z2P.mjs → chunk-POWDTOMF.mjs}

@@ -10,7 +10,7 @@ import { defineComponent, computed, ref, watch, h, inject, getCurrentInstance }
 import {
   classNames,
   coerceClassValue,
-  getInputClasses,
+  getInputFieldClasses,
   getInputWrapperClasses,
   getInputAffixClasses,
   getInputErrorClasses,
@@ -177,14 +177,18 @@ var Input = defineComponent({
         }
       }
     );
-    watch([effectiveStatus, effectiveShakeTrigger], ([newStatus]) => {
-      if (newStatus === "error" && wrapperRef.value) {
-        const el = wrapperRef.value;
-        el.classList.remove(SHAKE_CLASS);
-        void el.offsetWidth;
-        el.classList.add(SHAKE_CLASS);
-      }
-    });
+    watch(
+      [effectiveStatus, effectiveShakeTrigger],
+      ([newStatus]) => {
+        if (newStatus === "error" && wrapperRef.value) {
+          const el = wrapperRef.value;
+          el.classList.remove(SHAKE_CLASS);
+          void el.offsetWidth;
+          el.classList.add(SHAKE_CLASS);
+        }
+      },
+      { flush: "post" }
+    );
     const handleAnimationEnd = () => {
       wrapperRef.value?.classList.remove(SHAKE_CLASS);
     };
@@ -195,14 +199,6 @@ var Input = defineComponent({
     const activeError = computed(
       () => effectiveStatus.value === "error" && !!effectiveErrorMessage.value
     );
-    const inputClasses = computed(
-      () => getInputClasses({
-        size: effectiveSize.value,
-        status: effectiveStatus.value,
-        hasPrefix: hasPrefix.value,
-        hasSuffix: hasSuffix.value
-      })
-    );
     const effectiveType = computed(() => {
       if (props.showPassword && props.type === "password") {
         return passwordVisible.value ? "text" : "password";
@@ -233,55 +229,56 @@ var Input = defineComponent({
       const currentValStr = String(localValue.value);
       const showClear = props.clearable && !props.disabled && !props.readonly && currentValStr.length > 0;
       const showPasswordToggle = props.showPassword && props.type === "password" && !props.disabled;
+      const dualSuffix = showClear && showPasswordToggle;
+      const inputClasses = getInputFieldClasses({
+        size: effectiveSize.value,
+        status: effectiveStatus.value,
+        hasPrefix: hasPrefix.value,
+        hasSuffix: hasSuffix.value,
+        hasDualSuffix: dualSuffix
+      });
       const suffixNodes = [];
-      if (activeError.value) {
+      if (showClear) {
+        suffixNodes.push(
+          h(
+            "button",
+            {
+              type: "button",
+              class: getInputClearButtonClasses(
+                effectiveSize.value,
+                dualSuffix ? { offset: true } : void 0
+              ),
+              onClick: handleClear,
+              "aria-label": "Clear input",
+              tabindex: -1
+            },
+            "\u2715"
+          )
+        );
+      }
+      if (showPasswordToggle) {
+        suffixNodes.push(
+          h(
+            "button",
+            {
+              type: "button",
+              class: getInputPasswordToggleClasses(effectiveSize.value),
+              onClick: togglePasswordVisibility,
+              "aria-label": passwordVisible.value ? "Hide password" : "Show password",
+              tabindex: -1
+            },
+            passwordVisible.value ? "\u{1F648}" : "\u{1F441}"
+          )
+        );
+      }
+      if (!showClear && !showPasswordToggle && hasSuffix.value) {
         suffixNodes.push(
           h(
             "div",
-            { id: errorMsgId, class: getInputErrorClasses(effectiveSize.value) },
-            effectiveErrorMessage.value
+            { class: getInputAffixClasses("suffix", effectiveSize.value) },
+            slots.suffix ? slots.suffix() : props.suffix
           )
         );
-      } else {
-        if (showClear) {
-          suffixNodes.push(
-            h(
-              "button",
-              {
-                type: "button",
-                class: getInputClearButtonClasses(effectiveSize.value),
-                onClick: handleClear,
-                "aria-label": "Clear input",
-                tabindex: -1
-              },
-              "\u2715"
-            )
-          );
-        }
-        if (showPasswordToggle) {
-          suffixNodes.push(
-            h(
-              "button",
-              {
-                type: "button",
-                class: getInputPasswordToggleClasses(effectiveSize.value),
-                onClick: togglePasswordVisibility,
-                "aria-label": passwordVisible.value ? "Hide password" : "Show password",
-                tabindex: -1
-              },
-              passwordVisible.value ? "\u{1F648}" : "\u{1F441}"
-            )
-          );
-        }
-        if (!showClear && !showPasswordToggle && hasSuffix.value) {
-          suffixNodes.push(
-            h(
-              "div",
-              { class: getInputAffixClasses("suffix", effectiveSize.value) },
-              slots.suffix ? slots.suffix() : props.suffix
-            )
-          );
-        }
       }
       const wrapperChildren = [
         hasPrefix.value && h(
@@ -292,7 +289,7 @@ var Input = defineComponent({
         h("input", {
           ...restAttrs,
           ref: inputRef,
-          class: inputClasses.value,
+          class: inputClasses,
           type: effectiveType.value,
           value: localValue.value,
           placeholder: props.placeholder,
@@ -314,29 +311,41 @@ var Input = defineComponent({
         }),
         ...suffixNodes
       ];
-      const nodes = [
-        h(
-          "div",
-          {
-            ref: wrapperRef,
-            class: classNames(
-              getInputWrapperClasses(),
-              props.className,
-              coerceClassValue(attrClass)
-            ),
-            style: [attrStyle, props.style],
-            onAnimationend: handleAnimationEnd
-          },
-          wrapperChildren
-        )
-      ];
+      const chromeNode = h(
+        "div",
+        {
+          ref: wrapperRef,
+          class: classNames(
+            getInputWrapperClasses(effectiveStatus.value),
+            props.className,
+            coerceClassValue(attrClass)
+          ),
+          style: [attrStyle, props.style],
+          onAnimationend: handleAnimationEnd
+        },
+        wrapperChildren
+      );
+      const extras = [];
+      if (activeError.value) {
+        extras.push(
+          h(
+            "div",
+            {
+              id: errorMsgId,
+              class: getInputErrorClasses(effectiveSize.value),
+              "aria-live": "polite"
+            },
+            effectiveErrorMessage.value
+          )
+        );
+      }
       if (props.showCount) {
         const count = currentValStr.length;
         const isOver = props.maxLength !== void 0 && count > props.maxLength;
         const countText = props.maxLength !== void 0 ? `${count} / ${props.maxLength}` : `${count}`;
-        nodes.push(h("div", { class: getInputCountClasses(isOver) }, countText));
+        extras.push(h("div", { class: getInputCountClasses(isOver) }, countText));
       }
-      return nodes.length === 1 ? nodes[0] : h("div", null, nodes);
+      return extras.length === 0 ? chromeNode : h("div", { class: "w-full" }, [chromeNode, ...extras]);
     };
   }
 });

package/dist/{chunk-AXDBME5A.mjs → chunk-PSGVG4TN.mjs}

@@ -5,9 +5,11 @@ import {
   coerceClassValue,
   getSplitterContainerClasses,
   getSplitterGutterClasses,
+  getSplitterGutterCssVars,
   getSplitterGutterHandleClasses,
   getPaneStyle,
   resizePanes,
+  resolveInitialPaneSizes,
   createDocumentDragSession
 } from "@expcat/tigercat-core";
 var Splitter = defineComponent({
@@ -54,29 +56,41 @@ var Splitter = defineComponent({
     const startPos = ref(0);
     const startSizes = ref([]);
     let dragSession = null;
-    watch(
-      () => props.sizes,
-      (newSizes) => {
-        if (newSizes) paneSizes.value = [...newSizes];
-      },
-      { immediate: true }
-    );
-    const initSizes = () => {
-      if (props.sizes && props.sizes.length > 0) {
-        paneSizes.value = [...props.sizes];
-        return;
-      }
+    const getPaneCount = () => {
+      if (props.sizes && props.sizes.length > 0) return props.sizes.length;
       const el = containerRef.value;
-      if (!el) return;
-      const slotChildren = slots.default?.() || [];
-      const paneCount = slotChildren.length;
+      if (!el) return 0;
+      let n = 0;
+      for (let i = 0; i < el.children.length; i++) {
+        if (el.children[i].classList.contains("tiger-splitter-pane")) n++;
+      }
+      return n;
+    };
+    const resolveAndApplySizes = () => {
+      const paneCount = getPaneCount();
       if (paneCount === 0) return;
-      const totalGutter = (paneCount - 1) * props.gutterSize;
-      const total = props.direction === "horizontal" ? el.clientWidth - totalGutter : el.clientHeight - totalGutter;
-      const eachSize = total / paneCount;
-      paneSizes.value = Array.from({ length: paneCount }, () => eachSize);
+      const el = containerRef.value;
+      const containerSize = el ? props.direction === "horizontal" ? el.clientWidth : el.clientHeight : 0;
+      const resolved = resolveInitialPaneSizes(
+        paneCount,
+        containerSize,
+        props.gutterSize,
+        props.sizes,
+        props.min,
+        props.max
+      );
+      if (resolved) {
+        paneSizes.value = resolved;
+      }
     };
-    onMounted(initSizes);
+    watch(
+      () => [props.sizes, props.min, props.max, props.gutterSize, props.direction],
+      () => {
+        resolveAndApplySizes();
+      },
+      { immediate: true, deep: true }
+    );
+    onMounted(resolveAndApplySizes);
     const containerClasses = computed(
       () => classNames(
         getSplitterContainerClasses(props.direction, props.className),
@@ -196,7 +210,10 @@ var Splitter = defineComponent({
         {
           ref: containerRef,
           class: containerClasses.value,
-          style: props.style,
+          style: {
+            ...props.style,
+            ...getSplitterGutterCssVars(props.gutterSize)
+          },
           "data-direction": props.direction
         },
         nodes

package/dist/{chunk-7DWWNFRP.mjs → chunk-PWWWACHC.mjs}

@@ -2,7 +2,7 @@ import {
   Dropdown,
   DropdownItem,
   DropdownMenu
-} from "./chunk-KROVW4AW.mjs";
+} from "./chunk-PJQTRDIG.mjs";
 import {
   Button
 } from "./chunk-YZBQ6IR7.mjs";

package/dist/{chunk-UUWTKCMY.mjs → chunk-QWLD5FMJ.mjs}

@@ -1,6 +1,6 @@
 import {
   ImagePreview
-} from "./chunk-LPZBXTJ6.mjs";
+} from "./chunk-SAC4PAG3.mjs";
 
 // src/components/ImageGroup.ts
 import { defineComponent, h, ref, provide, onBeforeUnmount } from "vue";

package/dist/{chunk-ALIUAGJO.mjs → chunk-QZLOF36M.mjs}

@@ -22,6 +22,7 @@ import {
   getAnchorLinkClasses,
   getAnchorLinkListClasses,
   createAnchorObserver,
+  createProgrammaticScrollLock,
   scrollToAnchor
 } from "@expcat/tigercat-core";
 var AnchorContextKey = /* @__PURE__ */ Symbol("AnchorContext");
@@ -200,9 +201,8 @@ var Anchor = defineComponent({
     const links = ref([]);
     const anchorRef = ref(null);
     const inkRef = ref(null);
-    const isScrolling = ref(false);
-    let scrollTimeoutId = null;
     const getContainer = () => props.getContainer();
+    const scrollLock = createProgrammaticScrollLock(getContainer);
     const scrollOffset = computed(() => props.targetOffset ?? props.offsetTop);
     const registerLink = (href) => {
       if (href && !links.value.includes(href)) {
@@ -219,9 +219,10 @@ var Anchor = defineComponent({
       const root = container === window ? null : container;
       stopObserver = createAnchorObserver(links.value, {
         offsetTop: scrollOffset.value,
+        bounds: props.bounds,
         root,
         onChange: (newActiveLink) => {
-          if (isScrolling.value) return;
+          if (scrollLock.isLocked()) return;
           const finalActiveLink = props.getCurrentAnchor ? props.getCurrentAnchor(newActiveLink) : newActiveLink;
           if (finalActiveLink !== activeLink.value) {
             activeLink.value = finalActiveLink;
@@ -235,14 +236,9 @@ var Anchor = defineComponent({
     };
     const handleLinkClick = (href, event) => {
       emit("click", event, href);
-      isScrolling.value = true;
+      scrollLock.lock();
       activeLink.value = href;
       scrollTo(href);
-      if (scrollTimeoutId !== null) clearTimeout(scrollTimeoutId);
-      scrollTimeoutId = setTimeout(() => {
-        isScrolling.value = false;
-        scrollTimeoutId = null;
-      }, 500);
     };
     const updateInkPosition = () => {
       if (!inkRef.value || !anchorRef.value || !activeLink.value) {
@@ -274,14 +270,12 @@ var Anchor = defineComponent({
         setTimeout(updateInkPosition, 0);
       });
     });
-    watch([links, scrollOffset, () => props.getContainer], () => {
+    watch([links, scrollOffset, () => props.getContainer, () => props.bounds], () => {
       nextTick(() => setupObserver());
     });
     onBeforeUnmount(() => {
       stopObserver?.();
-      if (scrollTimeoutId !== null) {
-        clearTimeout(scrollTimeoutId);
-      }
+      scrollLock.dispose();
     });
     const wrapperClasses = computed(() => {
       return classNames(

package/dist/{chunk-WLYQHKLZ.mjs → chunk-QZRSFGZZ.mjs}

@@ -1,3 +1,7 @@
+import {
+  useTigerConfig
+} from "./chunk-UOJOJBEU.mjs";
+
 // src/components/Code.ts
 import { computed, defineComponent, h, onBeforeUnmount, ref } from "vue";
 import {
@@ -6,7 +10,10 @@ import {
   copyTextToClipboard,
   getCodeBlockContainerClasses,
   getCodeBlockCopyButtonClasses,
-  mergeStyleValues
+  getCodeLabels,
+  mergeStyleValues,
+  mergeTigerLocale,
+  resolveLocaleText
 } from "@expcat/tigercat-core";
 var Code = defineComponent({
   name: "TigerCode",
@@ -22,11 +29,23 @@ var Code = defineComponent({
     },
     copyLabel: {
       type: String,
-      default: "\u590D\u5236"
+      default: void 0
     },
     copiedLabel: {
       type: String,
-      default: "\u5DF2\u590D\u5236"
+      default: void 0
+    },
+    copyFailedLabel: {
+      type: String,
+      default: void 0
+    },
+    locale: {
+      type: Object,
+      default: void 0
+    },
+    labels: {
+      type: Object,
+      default: void 0
     },
     className: {
       type: String,
@@ -39,14 +58,31 @@ var Code = defineComponent({
   },
   emits: ["copy"],
   setup(props, { emit, attrs }) {
-    const isCopied = ref(false);
+    const config = useTigerConfig();
+    const copyStatus = ref("idle");
     const timerRef = ref(null);
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const labels = computed(() => getCodeLabels(mergedLocale.value, props.labels));
+    const resolvedCopyLabel = computed(
+      () => resolveLocaleText(labels.value.copyLabel, props.copyLabel)
+    );
+    const resolvedCopiedLabel = computed(
+      () => resolveLocaleText(labels.value.copiedLabel, props.copiedLabel)
+    );
+    const resolvedCopyFailedLabel = computed(
+      () => resolveLocaleText(labels.value.copyFailedLabel, props.copyFailedLabel)
+    );
+    const buttonLabel = computed(() => {
+      if (copyStatus.value === "failed") return resolvedCopyFailedLabel.value;
+      if (copyStatus.value === "copied") return resolvedCopiedLabel.value;
+      return resolvedCopyLabel.value;
+    });
     const containerClasses = computed(() => {
       const attrsRecord = attrs;
       return getCodeBlockContainerClasses(props.className, coerceClassValue(attrsRecord.class));
     });
     const copyButtonClasses = computed(() => {
-      return getCodeBlockCopyButtonClasses(isCopied.value);
+      return getCodeBlockCopyButtonClasses(copyStatus.value);
     });
     const clearTimer = () => {
       if (timerRef.value != null) {
@@ -57,12 +93,15 @@ var Code = defineComponent({
     const handleCopy = async () => {
       if (!props.copyable) return;
       const ok = await copyTextToClipboard(props.code);
-      if (!ok) return;
-      isCopied.value = true;
-      emit("copy", props.code);
       clearTimer();
+      if (ok) {
+        copyStatus.value = "copied";
+        emit("copy", props.code);
+      } else {
+        copyStatus.value = "failed";
+      }
       timerRef.value = window.setTimeout(() => {
-        isCopied.value = false;
+        copyStatus.value = "idle";
         timerRef.value = null;
       }, 1500);
     };
@@ -84,9 +123,9 @@ var Code = defineComponent({
             type: "button",
             class: copyButtonClasses.value,
             onClick: handleCopy,
-            "aria-label": isCopied.value ? props.copiedLabel : props.copyLabel
+            "aria-label": buttonLabel.value
           },
-          isCopied.value ? props.copiedLabel : props.copyLabel
+          buttonLabel.value
         ) : null
       ]
     );

package/dist/{chunk-37W7XTA6.mjs → chunk-RHQWQJ4I.mjs}

@@ -1,6 +1,6 @@
 import {
   useChartInteraction
-} from "./chunk-PE5OA4YG.mjs";
+} from "./chunk-FHUGOSEY.mjs";
 import {
   ChartSeries
 } from "./chunk-2ZUEXCVJ.mjs";
@@ -9,7 +9,7 @@ import {
 } from "./chunk-SPFL55TF.mjs";
 import {
   ChartCanvas
-} from "./chunk-W5RZPTFD.mjs";
+} from "./chunk-SNNT64HK.mjs";
 import {
   ChartLegend
 } from "./chunk-V443QIJM.mjs";
@@ -78,6 +78,7 @@ var FunnelChart = defineComponent({
       wrapperClasses
     } = useChartInteraction({
       hoverable: computed(() => props.hoverable),
+      showTooltip: computed(() => props.showTooltip),
       hoveredIndexProp: () => props.hoveredIndex,
       selectable: computed(() => props.selectable),
       selectedIndexProp: () => props.selectedIndex,
@@ -209,7 +210,7 @@ var FunnelChart = defineComponent({
           }
         }
       );
-      const tooltip = props.showTooltip && props.hoverable ? h(ChartTooltip, {
+      const tooltip = props.showTooltip ? h(ChartTooltip, {
         content: tooltipContent.value,
         open: resolvedHoveredIndex.value !== null && tooltipContent.value !== "",
         x: tooltipPosition.value.x,