@expcat/tigercat-vue 1.4.0 → 2.0.0-preview.1

package/dist/{chunk-IZF4VHJ2.mjs → chunk-ASOJXXU6.mjs}

@@ -16,7 +16,7 @@ import {
   resultExtraClasses,
   getResultColorScheme,
   getResultIconPath,
-  getResultHttpLabel
+  isHttpResultStatus
 } from "@expcat/tigercat-core";
 var Result = defineComponent({
   name: "TigerResult",
@@ -46,7 +46,7 @@ var Result = defineComponent({
   setup(props, { slots, attrs }) {
     const colors = computed(() => getResultColorScheme(props.status));
     const iconPath = computed(() => getResultIconPath(props.status));
-    const httpLabel = computed(() => getResultHttpLabel(props.status));
+    const httpLabel = computed(() => isHttpResultStatus(props.status) ? props.status : void 0);
     const iconContainerClasses = computed(
       () => classNames(resultIconContainerBaseClasses, colors.value.iconBg)
     );

package/dist/{chunk-NDS2DLUS.mjs → chunk-AZXS4QWC.mjs}

@@ -1,18 +1,18 @@
 import {
   useChartInteraction
-} from "./chunk-R2HO74FE.mjs";
-import {
-  ChartLegend
-} from "./chunk-VVS2CQS4.mjs";
-import {
-  ChartSeries
-} from "./chunk-2ZUEXCVJ.mjs";
+} from "./chunk-PE5OA4YG.mjs";
 import {
   ChartTooltip
-} from "./chunk-OK4PVFQG.mjs";
+} from "./chunk-SPFL55TF.mjs";
 import {
   ChartCanvas
 } from "./chunk-W5RZPTFD.mjs";
+import {
+  ChartLegend
+} from "./chunk-HLPSHCXO.mjs";
+import {
+  ChartSeries
+} from "./chunk-2ZUEXCVJ.mjs";
 
 // src/components/PieChart.ts
 import { defineComponent, computed, h, useId } from "vue";
@@ -123,6 +123,10 @@ var PieChart = defineComponent({
       type: Number,
       default: 8
     },
+    legendFormatter: {
+      type: Function,
+      default: void 0
+    },
     // Tooltip props
     showTooltip: {
       type: Boolean,
@@ -217,7 +221,7 @@ var PieChart = defineComponent({
         data: props.data,
         palette: palette.value,
         activeIndex: activeIndex.value,
-        getLabel: (d) => d.label ?? `${d.value}`,
+        getLabel: (d, i) => props.legendFormatter ? props.legendFormatter(d, i) : d.label ?? `${d.value}`,
         getColor: (d, i) => d.color ?? palette.value[i % palette.value.length]
       })
     );
@@ -390,7 +394,7 @@ var PieChart = defineComponent({
       );
       const tooltip = props.showTooltip && props.hoverable ? h(ChartTooltip, {
         content: tooltipContent.value,
-        visible: resolvedHoveredIndex.value !== null && tooltipContent.value !== "",
+        open: resolvedHoveredIndex.value !== null && tooltipContent.value !== "",
         x: tooltipPosition.value.x,
         y: tooltipPosition.value.y
       }) : null;

package/dist/{chunk-KY6AJRGT.mjs → chunk-B47QLHVW.mjs}

@@ -1,15 +1,15 @@
 import {
   Timeline
-} from "./chunk-DOJPPVAN.mjs";
-import {
-  Loading
-} from "./chunk-6WF3336O.mjs";
+} from "./chunk-RTZUIWCN.mjs";
 import {
   Link
 } from "./chunk-3MO7A4GU.mjs";
+import {
+  Loading
+} from "./chunk-6WF3336O.mjs";
 import {
   Tag
-} from "./chunk-G6ULKE6H.mjs";
+} from "./chunk-KRWKO2JQ.mjs";
 import {
   Text
 } from "./chunk-NN6AINLG.mjs";
@@ -18,7 +18,7 @@ import {
 } from "./chunk-TC6ZPQFT.mjs";
 import {
   Avatar
-} from "./chunk-ZCT56WB7.mjs";
+} from "./chunk-XZYFVOOS.mjs";
 
 // src/components/ActivityFeed.ts
 import { defineComponent, computed, h } from "vue";
@@ -171,7 +171,7 @@ var ActivityFeed = defineComponent({
                     {
                       variant: 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"
                     },
                     { default: () => item.status?.label }
                   ) : null

package/dist/{chunk-UAD2XROX.mjs → chunk-BGO2ILHM.mjs}

@@ -1,15 +1,9 @@
 import {
   useChartInteraction
-} from "./chunk-R2HO74FE.mjs";
-import {
-  ChartLegend
-} from "./chunk-VVS2CQS4.mjs";
-import {
-  ChartSeries
-} from "./chunk-2ZUEXCVJ.mjs";
+} from "./chunk-PE5OA4YG.mjs";
 import {
   ChartTooltip
-} from "./chunk-OK4PVFQG.mjs";
+} from "./chunk-SPFL55TF.mjs";
 import {
   ChartAxis
 } from "./chunk-ZWVA7HT3.mjs";
@@ -19,6 +13,12 @@ import {
 import {
   ChartGrid
 } from "./chunk-MI6TL3CQ.mjs";
+import {
+  ChartLegend
+} from "./chunk-HLPSHCXO.mjs";
+import {
+  ChartSeries
+} from "./chunk-2ZUEXCVJ.mjs";
 
 // src/components/ScatterChart.ts
 import { defineComponent, computed, h, onMounted, ref, useId } from "vue";
@@ -332,7 +332,7 @@ var ScatterChart = defineComponent({
       );
       const tooltip = props.showTooltip && props.hoverable ? h(ChartTooltip, {
         content: tooltipContent.value,
-        visible: resolvedHoveredIndex.value !== null && tooltipContent.value !== "",
+        open: resolvedHoveredIndex.value !== null && tooltipContent.value !== "",
         x: tooltipPosition.value.x,
         y: tooltipPosition.value.y
       }) : null;

package/dist/{chunk-GRP54POG.mjs → chunk-BJV62I73.mjs}

@@ -1,18 +1,18 @@
 import {
   Textarea
-} from "./chunk-MKBIVETW.mjs";
+} from "./chunk-2OI6GWOT.mjs";
 import {
   Button
 } from "./chunk-YZBQ6IR7.mjs";
 import {
   Tag
-} from "./chunk-G6ULKE6H.mjs";
+} from "./chunk-KRWKO2JQ.mjs";
 import {
   Text
 } from "./chunk-NN6AINLG.mjs";
 import {
   Avatar
-} from "./chunk-ZCT56WB7.mjs";
+} from "./chunk-XZYFVOOS.mjs";
 
 // src/components/CommentThread.ts
 import { defineComponent, computed, h, ref } from "vue";
@@ -367,7 +367,7 @@ var CommentThread = defineComponent({
                   {
                     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"
                   },
                   { default: () => node.tag?.label }
                 ) : null,
@@ -378,7 +378,7 @@ var CommentThread = defineComponent({
                       key: `${node.id}-tag-${index}`,
                       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"
                     },
                     { default: () => tag.label }
                   )

package/dist/{chunk-FSGD24HV.mjs → chunk-BNNTDSLJ.mjs}

@@ -11,6 +11,8 @@ import {
   computed,
   ref,
   provide,
+  inject,
+  reactive,
   h,
   onBeforeUnmount,
   onMounted,
@@ -26,6 +28,7 @@ import {
   getDropdownTriggerClasses,
   getDropdownChevronClasses,
   getDropdownMenuClasses,
+  getDropdownItemClasses,
   getTransformOrigin,
   injectDropdownStyles,
   FLOATING_OVERLAY_Z_INDEX,
@@ -82,6 +85,86 @@ var DropdownMenu = defineComponent({
 var dropdownIdCounter = 0;
 var createDropdownMenuId = () => `tiger-dropdown-menu-${++dropdownIdCounter}`;
 var DropdownContextKey = /* @__PURE__ */ Symbol("DropdownContext");
+var DropdownItem = defineComponent({
+  name: "TigerDropdownItem",
+  inheritAttrs: false,
+  props: {
+    /**
+     * Whether the item is disabled
+     * @default false
+     */
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Whether the item is divided from previous item
+     * @default false
+     */
+    divided: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Additional CSS classes
+     */
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: ["click"],
+  setup(props, { slots, emit, attrs }) {
+    const attrsRecord = attrs;
+    const attrsClass = attrsRecord.class;
+    const attrsStyle = attrsRecord.style;
+    const context = inject(DropdownContextKey, null);
+    const handleClick = (event) => {
+      if (props.disabled) {
+        event.preventDefault();
+        return;
+      }
+      emit("click", event);
+      if (context?.closeOnClick) {
+        context.handleItemClick();
+      }
+    };
+    const itemClasses = computed(() => {
+      return classNames(
+        getDropdownItemClasses(props.disabled, props.divided),
+        props.className,
+        coerceClassValue(attrsClass)
+      );
+    });
+    const mergedStyle = computed(() => mergeStyleValues(attrsStyle, props.style));
+    return () => {
+      const {
+        class: _class,
+        style: _style,
+        ...restAttrs
+      } = attrsRecord;
+      return h(
+        "button",
+        {
+          ...restAttrs,
+          type: "button",
+          class: itemClasses.value,
+          role: "menuitem",
+          tabindex: -1,
+          "aria-disabled": props.disabled,
+          disabled: props.disabled,
+          onClick: handleClick,
+          style: mergedStyle.value
+        },
+        slots.default?.()
+      );
+    };
+  }
+});
 var Dropdown = defineComponent({
   name: "TigerDropdown",
   inheritAttrs: false,
@@ -296,10 +379,17 @@ var Dropdown = defineComponent({
       zIndex: FLOATING_OVERLAY_Z_INDEX,
       transformOrigin: getTransformOrigin(currentPlacement.value)
     }));
-    provide(DropdownContextKey, {
+    const dropdownContext = reactive({
       closeOnClick: props.closeOnClick,
       handleItemClick
     });
+    watch(
+      () => props.closeOnClick,
+      (closeOnClick) => {
+        dropdownContext.closeOnClick = closeOnClick;
+      }
+    );
+    provide(DropdownContextKey, dropdownContext);
     const _menuItemTabIndex = -1;
     return () => {
       const defaultSlot = slots.default?.();
@@ -388,6 +478,7 @@ var Dropdown_default = Dropdown;
 export {
   DropdownMenu,
   DropdownContextKey,
+  DropdownItem,
   Dropdown,
   Dropdown_default
 };

package/dist/{chunk-6NJXI66G.mjs → chunk-CF4GX6BD.mjs}

@@ -1,5 +1,19 @@
+import {
+  INPUT_GROUP_INJECTION_KEY
+} from "./chunk-VIIGYWUY.mjs";
+
 // src/components/InputNumber.ts
-import { defineComponent, computed, ref, watch, h, onMounted, onBeforeUnmount } from "vue";
+import {
+  defineComponent,
+  computed,
+  ref,
+  watch,
+  h,
+  onMounted,
+  onBeforeUnmount,
+  inject,
+  getCurrentInstance
+} from "vue";
 import {
   classNames,
   coerceClassValue,
@@ -31,6 +45,10 @@ var InputNumber = defineComponent({
     modelValue: {
       type: [Number, null]
     },
+    defaultValue: {
+      type: [Number, null],
+      default: void 0
+    },
     size: {
       type: String,
       default: "md"
@@ -87,10 +105,20 @@ var InputNumber = defineComponent({
     autoFocus: {
       type: Boolean,
       default: false
+    },
+    className: {
+      type: String,
+      default: void 0
     }
   },
   emits: ["update:modelValue", "change", "focus", "blur"],
   setup(props, { emit, attrs }) {
+    const instance = getCurrentInstance();
+    const inputGroup = inject(INPUT_GROUP_INJECTION_KEY, null);
+    const effectiveSize = computed(() => {
+      const hasOwnSize = Object.prototype.hasOwnProperty.call(instance?.vnode.props ?? {}, "size");
+      return hasOwnSize ? props.size : inputGroup?.size ?? props.size;
+    });
     const inputRef = ref(null);
     const focused = ref(false);
     const repeatController = createRafRepeatActionController();
@@ -116,10 +144,13 @@ var InputNumber = defineComponent({
       { immediate: true }
     );
     const isControlled = computed(() => props.modelValue !== void 0);
-    const internalValue = ref(props.modelValue ?? null);
+    const internalValue = ref(props.modelValue ?? props.defaultValue ?? null);
     const currentValue = computed(
       () => isControlled.value ? props.modelValue ?? null : internalValue.value
     );
+    if (!isControlled.value && internalValue.value !== null) {
+      displayValue.value = toDisplayValue(internalValue.value);
+    }
     function commitValue(val) {
       let finalVal = val;
       if (finalVal !== null) {
@@ -212,14 +243,15 @@ var InputNumber = defineComponent({
       () => classNames(
         getInputNumberWrapperClasses(props.disabled),
         getInputNumberStatusClasses(props.status),
-        getInputNumberSizeClasses(props.size),
+        getInputNumberSizeClasses(effectiveSize.value),
         focused.value && `ring-2 ${getInputNumberFocusRingColor(props.status)}`,
+        props.className,
         coerceClassValue(attrs.class)
       )
     );
     const inputClasses = computed(
       () => getInputNumberInputClasses(
-        props.size,
+        effectiveSize.value,
         props.controls && props.controlsPosition === "right",
         props.controls && props.controlsPosition === "both"
       )

package/dist/{chunk-QKP5C26H.mjs → chunk-CW5TEG7N.mjs}

@@ -615,7 +615,7 @@ var Upload = defineComponent({
           h(
             "div",
             {
-              class: "absolute inset-0 bg-black bg-opacity-0 hover:bg-opacity-50 transition-all flex items-center justify-center space-x-2 opacity-0 hover:opacity-100"
+              class: "absolute inset-0 bg-black/0 hover:bg-black/50 transition-all flex items-center justify-center space-x-2 opacity-0 hover:opacity-100"
             },
             [
               // Preview button
@@ -692,7 +692,7 @@ var Upload = defineComponent({
           file.status === "uploading" && h(
             "div",
             {
-              class: "absolute inset-0 bg-white bg-opacity-75 flex items-center justify-center"
+              class: "absolute inset-0 bg-white/75 flex items-center justify-center"
             },
             [
               h(

package/dist/{chunk-MOLGN476.mjs → chunk-DMQLA35L.mjs}

@@ -1,6 +1,6 @@
 import {
   TaskBoard
-} from "./chunk-6K4UE5MK.mjs";
+} from "./chunk-2YPPXZ4I.mjs";
 
 // src/components/Kanban.ts
 import { defineComponent, h } from "vue";
@@ -36,6 +36,14 @@ var Kanban = defineComponent({
       type: Array,
       default: () => []
     },
+    swimlanes: {
+      type: Array,
+      default: void 0
+    },
+    swimlaneField: {
+      type: String,
+      default: void 0
+    },
     showCardCount: { type: Boolean, default: true },
     allowAddCard: { type: Boolean, default: true },
     allowAddColumn: { type: Boolean, default: false },
@@ -70,6 +78,8 @@ var Kanban = defineComponent({
         onCardAdd: props.allowAddCard || props.onCardAdd ? handleCardAdd : void 0,
         filterText: props.filterText,
         hiddenColumns: props.hiddenColumns,
+        swimlanes: props.swimlanes,
+        swimlaneField: props.swimlaneField,
         showCardCount: props.showCardCount,
         allowAddCard: props.allowAddCard,
         allowAddColumn: props.allowAddColumn,

package/dist/{chunk-7VSNXYFM.mjs → chunk-DOVBKVTB.mjs}

@@ -1,12 +1,15 @@
 import {
   Modal
-} from "./chunk-3VFZB5ZK.mjs";
+} from "./chunk-IQNZ4UEA.mjs";
 import {
   ImageCropper
-} from "./chunk-DEJKRMMU.mjs";
+} from "./chunk-4IZUJJUO.mjs";
 import {
   Button
 } from "./chunk-YZBQ6IR7.mjs";
+import {
+  useTigerConfig
+} from "./chunk-R6WFL6NI.mjs";
 
 // src/components/CropUpload.ts
 import { defineComponent, h, ref, computed } from "vue";
@@ -21,12 +24,18 @@ import {
   validateUploadFile,
   readFileAsDataUrl,
   getCropperResult,
-  isActivationKey
+  isActivationKey,
+  getImageEditorLabels,
+  mergeTigerLocale
 } from "@expcat/tigercat-core";
 var CropUpload = defineComponent({
   name: "TigerCropUpload",
   inheritAttrs: false,
   props: {
+    locale: {
+      type: Object,
+      default: void 0
+    },
     accept: { type: String, default: "image/*" },
     disabled: { type: Boolean, default: false },
     maxSize: { type: Number, default: void 0 },
@@ -34,7 +43,7 @@ var CropUpload = defineComponent({
       type: Object,
       default: void 0
     },
-    modalTitle: { type: String, default: "\u88C1\u526A\u56FE\u7247" },
+    modalTitle: { type: String, default: void 0 },
     modalWidth: { type: Number, default: 520 },
     className: { type: String, default: void 0 },
     style: {
@@ -44,6 +53,9 @@ var CropUpload = defineComponent({
   },
   emits: ["crop-complete", "error"],
   setup(props, { slots, emit, attrs }) {
+    const config = useTigerConfig();
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const labels = computed(() => getImageEditorLabels(mergedLocale.value));
     const fileInputRef = ref(null);
     const modalVisible = ref(false);
     const imageSrc = ref("");
@@ -120,7 +132,7 @@ var CropUpload = defineComponent({
           onClick: handleTriggerClick,
           role: "button",
           tabindex: props.disabled ? -1 : 0,
-          "aria-label": "Select image to crop and upload",
+          "aria-label": labels.value.selectImageAriaLabel,
           "aria-disabled": props.disabled ? "true" : void 0,
           onKeydown: (e) => {
             if (isActivationKey(e)) {
@@ -139,7 +151,7 @@ var CropUpload = defineComponent({
           onClick: handleTriggerClick,
           role: "button",
           tabindex: props.disabled ? -1 : 0,
-          "aria-label": "Select image to crop and upload",
+          "aria-label": labels.value.selectImageAriaLabel,
           "aria-disabled": props.disabled ? "true" : void 0,
           onKeydown: (e) => {
             if (isActivationKey(e)) {
@@ -167,7 +179,7 @@ var CropUpload = defineComponent({
               })
             ]
           ),
-          h("span", null, "\u9009\u62E9\u56FE\u7247")
+          h("span", null, labels.value.selectImageText)
         ]
       );
       const modal = h(
@@ -175,7 +187,8 @@ var CropUpload = defineComponent({
         {
           open: modalVisible.value,
           size: "lg",
-          title: props.modalTitle,
+          width: props.modalWidth,
+          title: props.modalTitle ?? labels.value.cropModalTitle,
           closable: true,
           maskClosable: false,
           showDefaultFooter: false,
@@ -188,14 +201,19 @@ var CropUpload = defineComponent({
           default: () => imageSrc.value ? h(ImageCropper, {
             ref: cropperRef,
             src: imageSrc.value,
+            locale: props.locale,
             ...props.cropperProps
           }) : null,
           footer: ({ cancel: _cancel }) => h("div", { class: modalFooterClasses }, [
-            h(Button, { variant: "secondary", onClick: handleCancel }, { default: () => "\u53D6\u6D88" }),
+            h(
+              Button,
+              { variant: "secondary", onClick: handleCancel },
+              { default: () => labels.value.cropCancelText }
+            ),
             h(
               Button,
               { onClick: handleConfirm, loading: cropping.value },
-              { default: () => "\u786E\u8BA4\u88C1\u526A" }
+              { default: () => labels.value.cropConfirmText }
             )
           ])
         }

package/dist/{chunk-2WJADO6O.mjs → chunk-DZFM7H3M.mjs}

@@ -1,5 +1,9 @@
+import {
+  INPUT_GROUP_INJECTION_KEY
+} from "./chunk-VIIGYWUY.mjs";
+
 // src/components/Input.ts
-import { defineComponent, computed, ref, watch, h } from "vue";
+import { defineComponent, computed, ref, watch, h, inject, getCurrentInstance } from "vue";
 import {
   classNames,
   coerceClassValue,
@@ -133,6 +137,12 @@ var Input = defineComponent({
   },
   setup(props, { emit, attrs, slots }) {
     injectShakeStyle();
+    const instance = getCurrentInstance();
+    const inputGroup = inject(INPUT_GROUP_INJECTION_KEY, null);
+    const effectiveSize = computed(() => {
+      const hasOwnSize = Object.prototype.hasOwnProperty.call(instance?.vnode.props ?? {}, "size");
+      return hasOwnSize ? props.size : inputGroup?.size ?? props.size;
+    });
     const inputRef = ref(null);
     const wrapperRef = ref(null);
     const localValue = ref(props.modelValue ?? "");
@@ -166,7 +176,7 @@ var Input = defineComponent({
     const activeError = computed(() => props.status === "error" && !!props.errorMessage);
     const inputClasses = computed(
       () => getInputClasses({
-        size: props.size,
+        size: effectiveSize.value,
         status: props.status,
         hasPrefix: hasPrefix.value,
         hasSuffix: hasSuffix.value
@@ -205,7 +215,11 @@ var Input = defineComponent({
       const suffixNodes = [];
       if (activeError.value) {
         suffixNodes.push(
-          h("div", { id: errorMsgId, class: getInputErrorClasses(props.size) }, props.errorMessage)
+          h(
+            "div",
+            { id: errorMsgId, class: getInputErrorClasses(effectiveSize.value) },
+            props.errorMessage
+          )
         );
       } else {
         if (showClear) {
@@ -214,7 +228,7 @@ var Input = defineComponent({
               "button",
               {
                 type: "button",
-                class: getInputClearButtonClasses(props.size),
+                class: getInputClearButtonClasses(effectiveSize.value),
                 onClick: handleClear,
                 "aria-label": "Clear input",
                 tabindex: -1
@@ -229,7 +243,7 @@ var Input = defineComponent({
               "button",
               {
                 type: "button",
-                class: getInputPasswordToggleClasses(props.size),
+                class: getInputPasswordToggleClasses(effectiveSize.value),
                 onClick: togglePasswordVisibility,
                 "aria-label": passwordVisible.value ? "Hide password" : "Show password",
                 tabindex: -1
@@ -242,7 +256,7 @@ var Input = defineComponent({
           suffixNodes.push(
             h(
               "div",
-              { class: getInputAffixClasses("suffix", props.size) },
+              { class: getInputAffixClasses("suffix", effectiveSize.value) },
               slots.suffix ? slots.suffix() : props.suffix
             )
           );
@@ -251,7 +265,7 @@ var Input = defineComponent({
       const wrapperChildren = [
         hasPrefix.value && h(
           "div",
-          { class: getInputAffixClasses("prefix", props.size) },
+          { class: getInputAffixClasses("prefix", effectiveSize.value) },
           slots.prefix ? slots.prefix() : props.prefix
         ),
         h("input", {