@expcat/tigercat-vue 2.0.19 → 2.1.1

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-MAKOSWR6.mjs → chunk-RHQWQJ4I.mjs}

@@ -1,18 +1,18 @@
 import {
   useChartInteraction
-} from "./chunk-PE5OA4YG.mjs";
+} from "./chunk-FHUGOSEY.mjs";
+import {
+  ChartSeries
+} from "./chunk-2ZUEXCVJ.mjs";
 import {
   ChartTooltip
 } from "./chunk-SPFL55TF.mjs";
 import {
   ChartCanvas
-} from "./chunk-W5RZPTFD.mjs";
+} from "./chunk-SNNT64HK.mjs";
 import {
   ChartLegend
 } from "./chunk-V443QIJM.mjs";
-import {
-  ChartSeries
-} from "./chunk-2ZUEXCVJ.mjs";
 
 // src/components/FunnelChart.ts
 import { defineComponent, computed, h, useId } from "vue";
@@ -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,

package/dist/{chunk-GS4SV2HK.mjs → chunk-RRLE7QRH.mjs}

@@ -4,19 +4,22 @@ import {
 } from "./chunk-U6OGGZBY.mjs";
 import {
   List
-} from "./chunk-KOG3HKOF.mjs";
+} from "./chunk-GQOPDD44.mjs";
 import {
   Button
 } from "./chunk-YZBQ6IR7.mjs";
 import {
   Loading
-} from "./chunk-AUMTHL6N.mjs";
+} from "./chunk-ZOP7PEKY.mjs";
 import {
   Text
 } from "./chunk-NN6AINLG.mjs";
 import {
   Card
 } from "./chunk-TC6ZPQFT.mjs";
+import {
+  useTigerConfig
+} from "./chunk-UOJOJBEU.mjs";
 
 // src/components/NotificationCenter.ts
 import { defineComponent, computed, ref, watch, h } from "vue";
@@ -25,7 +28,10 @@ import {
   coerceClassValue,
   mergeStyleValues,
   buildNotificationGroups,
-  formatActivityTime
+  formatActivityTime,
+  getNotificationCenterLabels,
+  mergeTigerLocale,
+  resolveLocaleText
 } from "@expcat/tigercat-core";
 
 // ../core/src/internal/notification-center-styles.ts
@@ -100,39 +106,47 @@ var NotificationCenter = defineComponent({
     },
     loadingText: {
       type: String,
-      default: "\u52A0\u8F7D\u4E2D..."
+      default: void 0
     },
     emptyText: {
       type: String,
-      default: "\u6682\u65E0\u901A\u77E5"
+      default: void 0
     },
     title: {
       type: String,
-      default: "\u901A\u77E5\u4E2D\u5FC3"
+      default: void 0
     },
     allLabel: {
       type: String,
-      default: "\u5168\u90E8"
+      default: void 0
     },
     unreadLabel: {
       type: String,
-      default: "\u672A\u8BFB"
+      default: void 0
     },
     readLabel: {
       type: String,
-      default: "\u5DF2\u8BFB"
+      default: void 0
     },
     markAllReadText: {
       type: String,
-      default: "\u5168\u90E8\u6807\u8BB0\u5DF2\u8BFB"
+      default: void 0
     },
     markReadText: {
       type: String,
-      default: "\u6807\u8BB0\u5DF2\u8BFB"
+      default: void 0
     },
     markUnreadText: {
       type: String,
-      default: "\u6807\u8BB0\u672A\u8BFB"
+      default: void 0
+    },
+    locale: {
+      type: Object,
+      default: void 0
+    },
+    labels: {
+      type: Object,
+      default: void 0
     },
     manageReadState: {
       type: Boolean,
@@ -157,6 +171,9 @@ var NotificationCenter = defineComponent({
     "item-read-change"
   ],
   setup(props, { emit, attrs }) {
+    const config = useTigerConfig();
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const labels = computed(() => getNotificationCenterLabels(mergedLocale.value, props.labels));
     const resolvedGroups = computed(
       () => buildNotificationGroups(props.items, props.groups, props.groupBy, props.groupOrder)
     );
@@ -296,9 +313,9 @@ var NotificationCenter = defineComponent({
     };
     const renderReadFilterButtons = () => {
       const options = [
-        { key: "all", label: props.allLabel },
-        { key: "unread", label: props.unreadLabel },
-        { key: "read", label: props.readLabel }
+        { key: "all", label: resolveLocaleText(labels.value.allLabel, props.allLabel) },
+        { key: "unread", label: resolveLocaleText(labels.value.unreadLabel, props.unreadLabel) },
+        { key: "read", label: resolveLocaleText(labels.value.readLabel, props.readLabel) }
       ];
       return h(
         "div",
@@ -380,7 +397,9 @@ var NotificationCenter = defineComponent({
                 handleItemReadChange(item, !isRead);
               }
             },
-            { default: () => isRead ? props.markUnreadText : props.markReadText }
+            {
+              default: () => isRead ? resolveLocaleText(labels.value.markUnreadText, props.markUnreadText) : resolveLocaleText(labels.value.markReadText, props.markReadText)
+            }
           )
         ]
       );
@@ -424,7 +443,7 @@ var NotificationCenter = defineComponent({
                 color: "muted",
                 class: notificationCenterEmptyTextClasses
               },
-              { default: () => props.emptyText }
+              { default: () => resolveLocaleText(labels.value.emptyText, props.emptyText) }
             )
           ]
         );
@@ -436,7 +455,7 @@ var NotificationCenter = defineComponent({
           split: true,
           bordered: "divided",
           hoverable: true,
-          emptyText: props.emptyText,
+          emptyText: resolveLocaleText(labels.value.emptyText, props.emptyText),
           onItemClick: handleItemClick
         },
         {
@@ -484,7 +503,7 @@ var NotificationCenter = defineComponent({
                 weight: "bold",
                 class: notificationCenterTitleClasses
               },
-              { default: () => props.title }
+              { default: () => resolveLocaleText(labels.value.title, props.title) }
             ),
             totalUnread.value > 0 ? h(
               "span",
@@ -506,20 +525,22 @@ var NotificationCenter = defineComponent({
               ),
               onClick: handleMarkAllRead
             },
-            { default: () => props.markAllReadText }
+            {
+              default: () => resolveLocaleText(labels.value.markAllReadText, props.markAllReadText)
+            }
           )
         ]),
         renderReadFilterButtons()
       ]);
       const content = props.loading ? h("div", { class: "flex items-center justify-center py-16" }, [
         h(Loading, {
-          text: props.loadingText,
+          text: resolveLocaleText(labels.value.loadingText, props.loadingText),
           class: notificationCenterLoadingClasses
         })
       ]) : resolvedGroups.value.length > 0 ? h("div", { class: "-mx-4 -mb-4" }, [renderTabs()]) : h("div", { class: "-mx-4 -mb-4 max-h-[380px] overflow-y-auto" }, [
         renderList(filteredFlatItems.value)
       ]);
-      const ariaLabel = attrs["aria-label"] ?? (attrs["aria-labelledby"] ? void 0 : props.title);
+      const ariaLabel = attrs["aria-label"] ?? (attrs["aria-labelledby"] ? void 0 : resolveLocaleText(labels.value.title, props.title));
       return h(
         "div",
         {

package/dist/{chunk-RID7A5V7.mjs → chunk-RRNQL6MJ.mjs}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-3MO7A4GU.mjs";
 import {
   Loading
-} from "./chunk-AUMTHL6N.mjs";
+} from "./chunk-ZOP7PEKY.mjs";
 import {
   Tag
 } from "./chunk-342DH5CF.mjs";
@@ -19,6 +19,9 @@ import {
 import {
   Avatar
 } from "./chunk-ZFTRR3KW.mjs";
+import {
+  useTigerConfig
+} from "./chunk-UOJOJBEU.mjs";
 
 // src/components/ActivityFeed.ts
 import { defineComponent, computed, h } from "vue";
@@ -28,6 +31,9 @@ import {
   coerceClassValue,
   formatActivityTime,
   mergeStyleValues,
+  getActivityFeedLabels,
+  mergeTigerLocale,
+  resolveLocaleText,
   toActivityTimelineItems,
   activityItemClasses,
   activityItemLayoutClasses,
@@ -120,11 +126,19 @@ var ActivityFeed = defineComponent({
     },
     loadingText: {
       type: String,
-      default: "\u52A0\u8F7D\u4E2D..."
+      default: void 0
     },
     emptyText: {
       type: String,
-      default: "\u6682\u65E0\u52A8\u6001"
+      default: void 0
+    },
+    locale: {
+      type: Object,
+      default: void 0
+    },
+    labels: {
+      type: Object,
+      default: void 0
     },
     showAvatar: {
       type: Boolean,
@@ -148,6 +162,9 @@ var ActivityFeed = defineComponent({
     }
   },
   setup(props, { slots, attrs }) {
+    const config = useTigerConfig();
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const labels = computed(() => getActivityFeedLabels(mergedLocale.value, props.labels));
     const resolvedGroups = computed(
       () => buildActivityGroups(props.items, props.groups, props.groupBy, props.groupOrder)
     );
@@ -246,13 +263,13 @@ var ActivityFeed = defineComponent({
     };
     const feedRole = computed(() => attrs.role ?? "feed");
     const feedAriaLabel = computed(
-      () => attrs["aria-label"] ?? (attrs["aria-labelledby"] ? void 0 : "\u52A8\u6001")
+      () => attrs["aria-label"] ?? (attrs["aria-labelledby"] ? void 0 : "Activity")
     );
     const feedAriaBusy = computed(() => attrs["aria-busy"] ?? (props.loading ? "true" : void 0));
     return () => {
       if (props.loading) {
         const loadingNode = slots.loading ? slots.loading() : h(Loading, {
-          text: props.loadingText,
+          text: resolveLocaleText(labels.value.loadingText, props.loadingText),
           class: activityFeedLoadingClasses
         });
         return h(
@@ -303,7 +320,7 @@ var ActivityFeed = defineComponent({
           h(
             Text,
             { tag: "div", size: "sm", color: "muted", class: "font-medium" },
-            { default: () => props.emptyText }
+            { default: () => resolveLocaleText(labels.value.emptyText, props.emptyText) }
           )
         ]);
         return h(

package/dist/{chunk-VJ6YM2EW.mjs → chunk-S4BKVFQ7.mjs}

@@ -1,6 +1,6 @@
 import {
   ChartCanvas
-} from "./chunk-W5RZPTFD.mjs";
+} from "./chunk-SNNT64HK.mjs";
 
 // src/components/OrgChart.ts
 import { computed, defineComponent, h, ref } from "vue";

package/dist/{chunk-LPZBXTJ6.mjs → chunk-SAC4PAG3.mjs}

@@ -265,8 +265,8 @@ var ImagePreview = defineComponent({
       panState = createPanState();
       pinchState = createPinchState();
     };
-    const handleMaskClick = (e) => {
-      if (props.maskClosable && e.target === e.currentTarget) {
+    const handleMaskClick = () => {
+      if (props.maskClosable) {
         handleClose();
       }
     };
@@ -299,7 +299,8 @@ var ImagePreview = defineComponent({
       const currentSrc = props.images[index.value] || props.images[0];
       const mask = h("div", {
         class: imagePreviewMaskClasses,
-        "aria-hidden": "true"
+        "aria-hidden": "true",
+        onClick: handleMaskClick
       });
       const img = h("img", {
         src: currentSrc,
@@ -409,7 +410,6 @@ var ImagePreview = defineComponent({
           role: "dialog",
           "aria-modal": "true",
           "aria-label": labels.value.previewDialogAriaLabel,
-          onClick: handleMaskClick,
           onWheel: handleWheel
         },
         [mask, img, closeBtn, prevBtn, nextBtn, toolbar]

package/dist/{chunk-W5RZPTFD.mjs → chunk-SNNT64HK.mjs}

@@ -11,6 +11,9 @@ import {
 var ChartCanvas = defineComponent({
   name: "TigerChartCanvas",
   inheritAttrs: false,
+  emits: {
+    "resolved-size-change": (_size) => true
+  },
   props: {
     width: {
       type: Number,
@@ -38,7 +41,7 @@ var ChartCanvas = defineComponent({
       type: String
     }
   },
-  setup(props, { slots, attrs }) {
+  setup(props, { slots, attrs, emit }) {
     const svgRef = ref(null);
     const observedSize = ref(null);
     const resizeController = createChartResizeObserverController({
@@ -74,6 +77,14 @@ var ChartCanvas = defineComponent({
     };
     onMounted(syncResponsiveObserver);
     watch(() => props.responsive, syncResponsiveObserver);
+    watch(
+      [() => resolvedSize.value.width, () => resolvedSize.value.height],
+      ([nextWidth, nextHeight], prev) => {
+        if (prev && prev[0] === nextWidth && prev[1] === nextHeight) return;
+        emit("resolved-size-change", { width: nextWidth, height: nextHeight });
+      },
+      { immediate: true }
+    );
     onBeforeUnmount(() => resizeController.disconnect());
     return () => {
       const rect = innerRect.value;
@@ -97,7 +108,7 @@ var ChartCanvas = defineComponent({
             {
               transform: `translate(${rect.x}, ${rect.y})`
             },
-            slots.default?.({ innerRect: rect })
+            slots.default?.({ innerRect: rect, width: size.width, height: size.height })
           )
         ].filter(Boolean)
       );

package/dist/{chunk-N3C6YI7I.mjs → chunk-SWMYIORV.mjs}

@@ -1,5 +1,5 @@
 // src/components/Switch.ts
-import { defineComponent, computed, h } from "vue";
+import { defineComponent, computed, h, ref } from "vue";
 import {
   getSwitchClasses,
   getSwitchThumbClasses,
@@ -10,10 +10,17 @@ var Switch = defineComponent({
   inheritAttrs: false,
   props: {
     /**
-     * Whether the switch is checked
-     * @default false
+     * Whether the switch is checked (controlled mode)
      */
     modelValue: {
+      type: [Boolean, null],
+      default: null
+    },
+    /**
+     * Default checked state (uncontrolled mode)
+     * @default false
+     */
+    defaultValue: {
       type: Boolean,
       default: false
     },
@@ -51,13 +58,21 @@ var Switch = defineComponent({
     change: (value) => typeof value === "boolean"
   },
   setup(props, { emit, attrs }) {
+    const internalChecked = ref(props.defaultValue);
+    const isControlled = computed(() => props.modelValue !== null);
+    const checked = computed(
+      () => isControlled.value ? props.modelValue === true : internalChecked.value
+    );
     const switchClasses = computed(
-      () => getSwitchClasses(props.size, props.modelValue, props.disabled, props.className, attrs.class)
+      () => getSwitchClasses(props.size, checked.value, props.disabled, props.className, attrs.class)
     );
-    const thumbClasses = computed(() => getSwitchThumbClasses(props.size, props.modelValue));
+    const thumbClasses = computed(() => getSwitchThumbClasses(props.size, checked.value));
     const emitChange = () => {
       if (props.disabled) return;
-      const newValue = !props.modelValue;
+      const newValue = !checked.value;
+      if (!isControlled.value) {
+        internalChecked.value = newValue;
+      }
       emit("update:modelValue", newValue);
       emit("change", newValue);
     };
@@ -74,7 +89,7 @@ var Switch = defineComponent({
         ...attrs,
         type: "button",
         role: "switch",
-        "aria-checked": props.modelValue,
+        "aria-checked": checked.value,
         "aria-disabled": props.disabled ? "true" : void 0,
         class: switchClasses.value,
         style: mergeStyleValues(attrs.style, props.style),

package/dist/{chunk-2XCXK3NQ.mjs → chunk-SX3NAN4M.mjs}

@@ -1,6 +1,6 @@
 import {
   PieChart
-} from "./chunk-NNC75I7F.mjs";
+} from "./chunk-7TJE7OYH.mjs";
 
 // src/components/DonutChart.ts
 import { defineComponent, computed, h, onMounted, ref } from "vue";

package/dist/chunk-TBOXTAIA.mjs

@@ -0,0 +1,94 @@
+// src/components/LoadingBarContainer.ts
+import { computed, defineComponent, h } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  DEFAULT_LOADING_BAR_ARIA_LABEL,
+  DEFAULT_LOADING_BAR_COLOR,
+  DEFAULT_LOADING_BAR_HEIGHT,
+  getLoadingBarContainerClasses,
+  getLoadingBarFillClasses,
+  getLoadingBarFillStyle,
+  LOADING_BAR_CONTAINER_ID,
+  mergeStyleValues
+} from "@expcat/tigercat-core";
+var LoadingBarContainer = /* @__PURE__ */ defineComponent({
+  name: "TigerLoadingBarContainer",
+  inheritAttrs: false,
+  props: {
+    percentage: {
+      type: Number,
+      default: 0
+    },
+    status: {
+      type: String,
+      default: "idle"
+    },
+    color: {
+      type: String,
+      default: DEFAULT_LOADING_BAR_COLOR
+    },
+    height: {
+      type: Number,
+      default: DEFAULT_LOADING_BAR_HEIGHT
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    },
+    ariaLabel: {
+      type: String,
+      default: void 0
+    }
+  },
+  setup(props, { attrs }) {
+    const containerClasses = computed(
+      () => getLoadingBarContainerClasses(classNames(props.className, coerceClassValue(attrs.class)))
+    );
+    const fillClasses = computed(() => getLoadingBarFillClasses(props.status, props.color));
+    const fillStyle = computed(() => getLoadingBarFillStyle(props.percentage, props.height));
+    const resolvedAriaLabel = computed(
+      () => props.ariaLabel?.trim() || DEFAULT_LOADING_BAR_ARIA_LABEL
+    );
+    return () => {
+      const isBusy = props.status === "loading";
+      return h(
+        "div",
+        {
+          ...attrs,
+          class: containerClasses.value,
+          style: mergeStyleValues(attrs.style, props.style, { height: `${props.height}px` }),
+          id: LOADING_BAR_CONTAINER_ID,
+          "data-tiger-loading-bar-container": "",
+          "data-tiger-loading-bar-status": props.status
+        },
+        [
+          h("div", {
+            class: fillClasses.value,
+            style: fillStyle.value,
+            role: "progressbar",
+            "aria-label": resolvedAriaLabel.value,
+            "aria-valuemin": 0,
+            "aria-valuemax": 100,
+            "aria-valuenow": Math.round(props.percentage),
+            "aria-busy": isBusy ? "true" : void 0,
+            "aria-live": "polite",
+            "aria-atomic": "true",
+            "data-tiger-loading-bar": "",
+            "data-tiger-loading-bar-status": props.status
+          })
+        ]
+      );
+    };
+  }
+});
+var LoadingBarContainer_default = LoadingBarContainer;
+
+export {
+  LoadingBarContainer,
+  LoadingBarContainer_default
+};