@expcat/tigercat-vue 1.3.4 → 1.5.0

package/dist/chunk-E7NE5HEC.mjs

@@ -0,0 +1,351 @@
+import {
+  useTigerConfig
+} from "./chunk-R6WFL6NI.mjs";
+
+// src/components/FileManager.ts
+import { defineComponent, h, ref, computed, nextTick } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  getFileManagerContainerClasses,
+  getFileItemClasses,
+  deriveFileManagerModel,
+  toggleFileSelection,
+  resolveFileOpen,
+  sliceBreadcrumbPath,
+  toFileDragItem,
+  applyFileDragReorder,
+  formatFileSizeLabel,
+  getFileManagerLabels,
+  fileManagerToolbarClasses,
+  fileManagerBreadcrumbClasses,
+  fileManagerBreadcrumbItemClasses,
+  fileManagerBreadcrumbSeparatorClasses,
+  fileManagerContentClasses,
+  fileManagerItemIconClasses,
+  fileManagerItemNameClasses,
+  fileManagerItemMetaClasses,
+  fileManagerEmptyClasses,
+  fileManagerLoadingClasses,
+  fileManagerSearchClasses,
+  resolveLocaleText,
+  mergeTigerLocale
+} from "@expcat/tigercat-core";
+var FileManager = defineComponent({
+  name: "TigerFileManager",
+  inheritAttrs: false,
+  props: {
+    files: { type: Array, default: () => [] },
+    viewMode: {
+      type: String,
+      default: "list"
+    },
+    selectedKeys: {
+      type: Array,
+      default: () => []
+    },
+    multiple: { type: Boolean, default: false },
+    columns: {
+      type: Array,
+      default: void 0
+    },
+    sortField: {
+      type: String,
+      default: "name"
+    },
+    sortOrder: {
+      type: String,
+      default: "asc"
+    },
+    currentPath: {
+      type: Array,
+      default: () => []
+    },
+    showHidden: { type: Boolean, default: false },
+    draggable: { type: Boolean, default: false },
+    loading: { type: Boolean, default: false },
+    emptyText: { type: String, default: void 0 },
+    searchable: { type: Boolean, default: false },
+    searchText: { type: String, default: "" },
+    className: { type: String, default: void 0 },
+    locale: { type: Object, default: void 0 }
+  },
+  emits: [
+    "select",
+    "open",
+    "navigate",
+    "update:currentPath",
+    "update:searchText",
+    "update:selectedKeys",
+    "update:files",
+    "reorder"
+  ],
+  setup(props, { emit, attrs }) {
+    const config = useTigerConfig();
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const labels = computed(() => getFileManagerLabels(mergedLocale.value));
+    const localSearch = ref(props.searchText);
+    const focusedIndex = ref(0);
+    const contentRef = ref(null);
+    let dragFromIndex = null;
+    function handleDragStart(event, item, index) {
+      if (!props.draggable || item.disabled) return;
+      dragFromIndex = index;
+      if (event.dataTransfer) {
+        event.dataTransfer.effectAllowed = "move";
+        event.dataTransfer.setData("text/plain", String(toFileDragItem(item, index).id));
+      }
+    }
+    function handleDragOver(event) {
+      if (!props.draggable || dragFromIndex === null) return;
+      event.preventDefault();
+      if (event.dataTransfer) event.dataTransfer.dropEffect = "move";
+    }
+    function handleDrop(event, toIndex) {
+      if (!props.draggable) return;
+      const fromIndex = dragFromIndex;
+      dragFromIndex = null;
+      if (fromIndex === null || fromIndex === toIndex) return;
+      event.preventDefault();
+      const items = model.value.processedItems;
+      const reordered = applyFileDragReorder(items, {
+        item: toFileDragItem(items[fromIndex], fromIndex),
+        fromIndex,
+        toIndex,
+        fromContainerId: "",
+        toContainerId: ""
+      });
+      emit("reorder", reordered, fromIndex, toIndex);
+      emit("update:files", reordered);
+    }
+    const model = computed(
+      () => deriveFileManagerModel({
+        files: props.files,
+        currentPath: props.currentPath,
+        selectedKeys: props.selectedKeys,
+        sortField: props.sortField,
+        sortOrder: props.sortOrder,
+        showHidden: props.showHidden,
+        searchText: localSearch.value || props.searchText
+      })
+    );
+    const containerClasses = computed(
+      () => classNames(getFileManagerContainerClasses(props.className), coerceClassValue(attrs.class))
+    );
+    function handleSelect(item) {
+      if (item.disabled) return;
+      emit("select", item);
+      const keys = toggleFileSelection(props.selectedKeys, item.key, props.multiple);
+      emit("update:selectedKeys", keys);
+    }
+    function handleOpen(item) {
+      const result = resolveFileOpen(item, props.currentPath);
+      if (!result) return;
+      if (result.type === "navigate") {
+        emit("update:currentPath", result.path);
+        emit("navigate", result.path);
+      } else {
+        emit("open", result.item);
+      }
+    }
+    function navigateToBreadcrumb(index) {
+      const newPath = sliceBreadcrumbPath(props.currentPath, index);
+      emit("update:currentPath", newPath);
+      emit("navigate", newPath);
+    }
+    function getFirstEnabledIndex() {
+      return model.value.processedItems.findIndex((item) => !item.disabled);
+    }
+    function getLastEnabledIndex() {
+      for (let index = model.value.processedItems.length - 1; index >= 0; index -= 1) {
+        if (!model.value.processedItems[index]?.disabled) {
+          return index;
+        }
+      }
+      return -1;
+    }
+    function getFocusedItemIndex() {
+      return focusedIndex.value >= 0 && !model.value.processedItems[focusedIndex.value]?.disabled ? focusedIndex.value : getFirstEnabledIndex();
+    }
+    function focusItemAt(index) {
+      nextTick(() => {
+        contentRef.value?.querySelector(`[data-option-index="${index}"]`)?.focus();
+      });
+    }
+    function moveFocus(current, direction) {
+      if (model.value.processedItems.length === 0) return;
+      let next = current;
+      for (let i = 0; i < model.value.processedItems.length; i += 1) {
+        next = (next + direction + model.value.processedItems.length) % model.value.processedItems.length;
+        if (!model.value.processedItems[next]?.disabled) {
+          focusedIndex.value = next;
+          focusItemAt(next);
+          return;
+        }
+      }
+    }
+    function handleItemKeydown(event, item, index) {
+      switch (event.key) {
+        case "ArrowDown":
+        case "ArrowRight":
+          event.preventDefault();
+          moveFocus(index, 1);
+          return;
+        case "ArrowUp":
+        case "ArrowLeft":
+          event.preventDefault();
+          moveFocus(index, -1);
+          return;
+        case "Home": {
+          event.preventDefault();
+          const first = getFirstEnabledIndex();
+          if (first >= 0) {
+            focusedIndex.value = first;
+            focusItemAt(first);
+          }
+          return;
+        }
+        case "End": {
+          event.preventDefault();
+          const last = getLastEnabledIndex();
+          if (last >= 0) {
+            focusedIndex.value = last;
+            focusItemAt(last);
+          }
+          return;
+        }
+        case " ":
+          event.preventDefault();
+          handleSelect(item);
+          return;
+        case "Enter":
+          event.preventDefault();
+          handleSelect(item);
+          handleOpen(item);
+          return;
+        default:
+          return;
+      }
+    }
+    return () => {
+      const breadcrumbItems = [
+        h(
+          "span",
+          {
+            class: fileManagerBreadcrumbItemClasses,
+            onClick: () => navigateToBreadcrumb(0)
+          },
+          labels.value.rootText
+        ),
+        ...props.currentPath.flatMap((seg, i) => [
+          h("span", { class: fileManagerBreadcrumbSeparatorClasses }, "/"),
+          h(
+            "span",
+            {
+              class: fileManagerBreadcrumbItemClasses,
+              onClick: () => navigateToBreadcrumb(i + 1)
+            },
+            seg
+          )
+        ])
+      ];
+      const breadcrumb = h(
+        "nav",
+        { class: fileManagerBreadcrumbClasses, "aria-label": "File path" },
+        breadcrumbItems
+      );
+      const searchInput = props.searchable ? h("input", {
+        type: "text",
+        class: fileManagerSearchClasses,
+        placeholder: resolveLocaleText(
+          "Search...",
+          mergedLocale.value?.common?.searchPlaceholder
+        ),
+        value: localSearch.value,
+        onInput: (e) => {
+          const val = e.target.value;
+          localSearch.value = val;
+          emit("update:searchText", val);
+        }
+      }) : null;
+      const toolbar = h("div", { class: fileManagerToolbarClasses }, [
+        breadcrumb,
+        h("div", { class: "flex-1" }),
+        searchInput
+      ]);
+      const fileIcon = (item) => h(
+        "span",
+        { class: fileManagerItemIconClasses, "aria-hidden": "true" },
+        item.type === "folder" ? "\u{1F4C1}" : "\u{1F4C4}"
+      );
+      const renderItem = (item, index) => {
+        const isSelected = model.value.selectedSet.has(item.key);
+        const itemClass = getFileItemClasses(props.viewMode, isSelected);
+        const focusedItem = getFocusedItemIndex();
+        const nameEl = h("span", { class: fileManagerItemNameClasses }, item.name);
+        const metaColumns = props.columns ?? ["size", "modified"];
+        const metaEls = props.viewMode === "list" ? [
+          metaColumns.includes("type") ? h("span", { class: fileManagerItemMetaClasses }, item.extension ?? item.type) : null,
+          metaColumns.includes("size") && item.size !== void 0 ? h("span", { class: fileManagerItemMetaClasses }, formatFileSizeLabel(item.size)) : null,
+          metaColumns.includes("modified") && item.modified ? h("span", { class: fileManagerItemMetaClasses }, item.modified) : null
+        ] : [];
+        const dragItem = props.draggable && !item.disabled ? toFileDragItem(item, index) : void 0;
+        return h(
+          "div",
+          {
+            key: item.key,
+            class: itemClass,
+            role: "option",
+            "aria-selected": isSelected,
+            tabindex: !item.disabled && index === focusedItem ? 0 : -1,
+            "data-option-index": index,
+            "data-disabled": item.disabled || void 0,
+            onFocus: () => {
+              if (!item.disabled) focusedIndex.value = index;
+            },
+            onKeydown: (event) => handleItemKeydown(event, item, index),
+            onClick: () => handleSelect(item),
+            onDblclick: () => handleOpen(item),
+            draggable: props.draggable && !item.disabled,
+            "data-drag-id": dragItem?.id,
+            onDragstart: (event) => handleDragStart(event, item, index),
+            onDragover: handleDragOver,
+            onDrop: (event) => handleDrop(event, index)
+          },
+          [fileIcon(item), nameEl, ...metaEls]
+        );
+      };
+      const contentClass = props.viewMode === "grid" ? `${fileManagerContentClasses} grid grid-cols-4 gap-2` : fileManagerContentClasses;
+      const content = model.value.processedItems.length > 0 ? h(
+        "div",
+        {
+          ref: contentRef,
+          class: contentClass,
+          role: "listbox",
+          "aria-multiselectable": props.multiple
+        },
+        model.value.processedItems.map(renderItem)
+      ) : h(
+        "div",
+        { class: fileManagerEmptyClasses },
+        resolveLocaleText(
+          "Empty folder",
+          props.emptyText,
+          mergedLocale.value?.common?.emptyText
+        )
+      );
+      const loadingEl = props.loading ? h(
+        "div",
+        { class: fileManagerLoadingClasses },
+        resolveLocaleText("Loading...", mergedLocale.value?.common?.loadingText)
+      ) : null;
+      return h("div", { class: containerClasses.value }, [toolbar, content, loadingEl]);
+    };
+  }
+});
+var FileManager_default = FileManager;
+
+export {
+  FileManager,
+  FileManager_default
+};

package/dist/{chunk-AP42636I.js → chunk-EG7XX6U4.js}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); 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 _chunkUWZSTI3Ejs = require('./chunk-UWZSTI3E.js');
+var _chunkW34IV4ECjs = require('./chunk-W34IV4EC.js');
 
 // src/components/DropdownItem.ts
 var _vue = require('vue');
@@ -47,7 +47,7 @@ var DropdownItem = _vue.defineComponent.call(void 0, {
     const attrsRecord = attrs;
     const attrsClass = attrsRecord.class;
     const attrsStyle = attrsRecord.style;
-    const context = _vue.inject.call(void 0, _chunkUWZSTI3Ejs.DropdownContextKey, null);
+    const context = _vue.inject.call(void 0, _chunkW34IV4ECjs.DropdownContextKey, null);
     const handleClick = (event) => {
       if (props.disabled) {
         event.preventDefault();

package/dist/{chunk-WNKF2OD5.mjs → chunk-EVIZXEB2.mjs}

@@ -1,6 +1,16 @@
+import {
+  useTigerConfig
+} from "./chunk-R6WFL6NI.mjs";
+
 // src/components/QRCode.ts
 import { defineComponent, h, computed } from "vue";
-import { classNames, coerceClassValue, mergeStyleValues } from "@expcat/tigercat-core";
+import {
+  classNames,
+  coerceClassValue,
+  mergeStyleValues,
+  resolveLocaleText,
+  mergeTigerLocale
+} from "@expcat/tigercat-core";
 import {
   qrcodeContainerClasses,
   qrcodeOverlayClasses,
@@ -18,14 +28,17 @@ var QRCode = defineComponent({
     bgColor: { type: String, default: "#ffffff" },
     level: { type: String, default: "M" },
     status: { type: String, default: "active" },
-    className: { type: String, default: void 0 }
+    className: { type: String, default: void 0 },
+    locale: { type: Object, default: void 0 }
   },
   emits: ["refresh"],
   setup(props, { emit, attrs }) {
+    const config = useTigerConfig();
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
     const matrix = computed(() => generateQRMatrix(props.value));
     const moduleSize = computed(() => {
       const mLen = matrix.value.length;
-      return props.size / mLen;
+      return (props.size ?? 128) / mLen;
     });
     return () => {
       const attrsRecord = attrs;
@@ -36,6 +49,17 @@ var QRCode = defineComponent({
       );
       const mSize = moduleSize.value;
       const modules = matrix.value;
+      const ariaLabel = resolveLocaleText("QR Code", mergedLocale.value?.qrcode?.ariaLabel);
+      const expiredText = resolveLocaleText(
+        "QR code expired",
+        mergedLocale.value?.qrcode?.expiredText
+      );
+      const refreshText = resolveLocaleText("Refresh", mergedLocale.value?.qrcode?.refreshText);
+      const loadingText = resolveLocaleText(
+        "Loading...",
+        mergedLocale.value?.qrcode?.loadingText,
+        mergedLocale.value?.common?.loadingText
+      );
       const rects = modules.flatMap(
         (row, r) => row.map(
           (cell, c) => cell ? h("rect", {
@@ -56,7 +80,7 @@ var QRCode = defineComponent({
           viewBox: `0 0 ${props.size} ${props.size}`,
           xmlns: "http://www.w3.org/2000/svg",
           role: "img",
-          "aria-label": "QR Code"
+          "aria-label": ariaLabel
         },
         [h("rect", { width: props.size, height: props.size, fill: props.bgColor }), ...rects]
       );
@@ -64,14 +88,14 @@ var QRCode = defineComponent({
       if (props.status === "expired") {
         children.push(
           h("div", { class: qrcodeOverlayClasses }, [
-            h("span", { class: qrcodeExpiredTextClasses }, "QR code expired"),
+            h("span", { class: qrcodeExpiredTextClasses }, expiredText),
             h(
               "span",
               {
                 class: qrcodeRefreshClasses,
                 onClick: () => emit("refresh")
               },
-              "Refresh"
+              refreshText
             )
           ])
         );
@@ -79,7 +103,7 @@ var QRCode = defineComponent({
       if (props.status === "loading") {
         children.push(
           h("div", { class: qrcodeOverlayClasses }, [
-            h("span", { class: "text-sm text-gray-500" }, "Loading...")
+            h("span", { class: "text-sm text-gray-500" }, loadingText)
           ])
         );
       }

package/dist/{chunk-SGRUGYQ6.mjs → chunk-EYR27UIE.mjs}

@@ -25,6 +25,7 @@ import {
   getGestureTouchPoint,
   resolveSwipeGesture,
   isKeyActive,
+  getNextActiveKey,
   tabAddButtonClasses,
   tabCloseButtonClasses,
   tabContentBaseClasses
@@ -132,6 +133,7 @@ var TabPane = defineComponent({
       }
     };
     const handleClose = (event) => {
+      event.stopPropagation();
       if (!props.disabled) {
         tabsContext.handleTabClose(props.tabKey, event);
       }
@@ -157,10 +159,8 @@ var TabPane = defineComponent({
         return;
       }
       const tabList = event.currentTarget?.closest('[role="tablist"]');
-      const tabButtons = Array.from(
-        tabList?.querySelectorAll('[role="tab"]') ?? []
-      );
-      const enabled = tabButtons.filter((button) => !button.disabled);
+      const tabButtons = Array.from(tabList?.querySelectorAll('[role="tab"]') ?? []);
+      const enabled = tabButtons.filter((button) => button.getAttribute("aria-disabled") !== "true");
       const currentIndex = enabled.findIndex((button) => button.id === props.tabId);
       if (currentIndex === -1) {
         return;
@@ -194,17 +194,15 @@ var TabPane = defineComponent({
     return () => {
       if (props.renderMode === "tab") {
         return h(
-          "button",
+          "div",
           {
-            type: "button",
             class: tabItemClasses.value,
             role: "tab",
             id: props.tabId,
             "aria-controls": props.panelId,
             "aria-selected": isActive.value,
             "aria-disabled": props.disabled,
-            disabled: props.disabled,
-            tabindex: typeof props.tabIndex === "number" ? props.tabIndex : isActive.value ? 0 : -1,
+            tabindex: props.disabled ? -1 : typeof props.tabIndex === "number" ? props.tabIndex : isActive.value ? 0 : -1,
             "data-tiger-tabs-id": tabsContext.idBase,
             "data-tiger-tab-key": typeof props.tabKey === "number" ? `n:${props.tabKey}` : `s:${props.tabKey}`,
             onClick: handleClick,
@@ -214,9 +212,9 @@ var TabPane = defineComponent({
             props.icon && h("span", { class: "flex items-center" }, props.icon),
             h("span", props.label),
             isClosable.value && h(
-              "span",
+              "button",
               {
-                role: "button",
+                type: "button",
                 class: tabCloseButtonClasses,
                 "aria-label": `Close ${String(props.label)}`,
                 tabindex: -1,
@@ -363,6 +361,7 @@ var Tabs = defineComponent({
     const idBase = `tiger-tabs-${instance?.uid ?? "0"}`;
     const internalActiveKey = ref(props.defaultActiveKey);
     const swipeStart = ref(null);
+    let lastTabKeys = [];
     const currentActiveKey = computed(() => {
       return props.activeKey !== void 0 ? props.activeKey : internalActiveKey.value;
     });
@@ -377,6 +376,9 @@ var Tabs = defineComponent({
     };
     const handleTabClose = (key, event) => {
       event.stopPropagation();
+      if (props.activeKey === void 0 && key === currentActiveKey.value) {
+        internalActiveKey.value = getNextActiveKey(key, currentActiveKey.value, lastTabKeys);
+      }
       emit("edit", { targetKey: key, action: "remove" });
     };
     const activateAdjacentTab = (direction, enabledTabKeys) => {
@@ -480,6 +482,7 @@ var Tabs = defineComponent({
       if (props.activeKey === void 0 && internalActiveKey.value === void 0 && firstTabKey !== void 0) {
         internalActiveKey.value = firstTabKey;
       }
+      lastTabKeys = tabKeys;
       const resolvedActiveKey = currentActiveKey.value ?? firstTabKey;
       const activeTabIndex = tabKeys.indexOf(resolvedActiveKey ?? "");
       for (const { type, props: childProps, children: childChildren } of validChildren) {

package/dist/{chunk-5JKQPOG2.js → chunk-F5TZIFMW.js}

@@ -1,4 +1,8 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/components/NumberKeyboard.ts
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); 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 _chunkIXTYS3EKjs = require('./chunk-IXTYS3EK.js');
+
+// src/components/NumberKeyboard.ts
 var _vue = require('vue');
 
 
@@ -12,6 +16,8 @@ var _vue = require('vue');
 
 
 
+
+
 var _tigercatcore = require('@expcat/tigercat-core');
 var NumberKeyboard = _vue.defineComponent.call(void 0, {
   name: "TigerNumberKeyboard",
@@ -25,10 +31,11 @@ var NumberKeyboard = _vue.defineComponent.call(void 0, {
     decimalSeparator: { type: String, default: "." },
     disabled: { type: Boolean, default: false },
     readonly: { type: Boolean, default: false },
-    confirmText: { type: String, default: "Done" },
+    confirmText: { type: String, default: void 0 },
     deleteText: { type: String, default: "Delete" },
     ariaLabel: { type: String, default: "Number keyboard" },
     showConfirm: { type: Boolean, default: true },
+    locale: { type: Object, default: void 0 },
     className: { type: String, default: void 0 },
     style: {
       type: Object,
@@ -37,6 +44,11 @@ var NumberKeyboard = _vue.defineComponent.call(void 0, {
   },
   emits: ["update:modelValue", "change", "key-press", "delete", "confirm"],
   setup(props, { attrs, emit }) {
+    const config = _chunkIXTYS3EKjs.useTigerConfig.call(void 0, );
+    const mergedLocale = _vue.computed.call(void 0, () => _tigercatcore.mergeTigerLocale.call(void 0, config.value.locale, props.locale));
+    const confirmLabel = _vue.computed.call(void 0, 
+      () => _tigercatcore.resolveLocaleText.call(void 0, "Done", props.confirmText, _optionalChain([mergedLocale, 'access', _ => _.value, 'optionalAccess', _2 => _2.common, 'optionalAccess', _3 => _3.okText]))
+    );
     const innerValue = _vue.ref.call(void 0, _tigercatcore.normalizeNumberKeyboardValue.call(void 0, props.defaultValue));
     const isControlled = _vue.computed.call(void 0, () => props.modelValue !== void 0);
     const currentValue = _vue.computed.call(void 0, 
@@ -48,7 +60,7 @@ var NumberKeyboard = _vue.defineComponent.call(void 0, {
         mode: props.mode,
         decimalSeparator: props.decimalSeparator,
         deleteText: props.deleteText,
-        confirmText: props.confirmText,
+        confirmText: confirmLabel.value,
         showConfirm: props.showConfirm
       })
     );

package/dist/{chunk-7WQN5BYE.mjs → chunk-FAQL7HFW.mjs}

@@ -1,3 +1,7 @@
+import {
+  useTigerConfig
+} from "./chunk-R6WFL6NI.mjs";
+
 // src/components/Form.ts
 import {
   defineComponent,
@@ -25,7 +29,9 @@ import {
   undoFormHistory,
   redoFormHistory,
   canUndo,
-  canRedo
+  canRedo,
+  mergeTigerLocale,
+  getFormValidationLabels
 } from "@expcat/tigercat-core";
 var FormContextKey = /* @__PURE__ */ Symbol("FormContext");
 var Form = defineComponent({
@@ -127,6 +133,14 @@ var Form = defineComponent({
     maxHistorySize: {
       type: Number,
       default: 50
+    },
+    /**
+     * Locale override for built-in validation messages. Merged on top of the
+     * ConfigProvider locale; a per-rule `message` still takes precedence.
+     */
+    locale: {
+      type: Object,
+      default: void 0
     }
   },
   emits: {
@@ -140,10 +154,15 @@ var Form = defineComponent({
     validate: (fieldName, isValid, _errorMessage) => typeof fieldName === "string" && typeof isValid === "boolean"
   },
   setup(props, { slots, emit, expose }) {
+    const initialValues = { ...props.model ?? {} };
     const errors = reactive([]);
     const fieldRules = reactive({});
     const fieldConditions = reactive({});
     const errorsByField = computed(() => createFormErrorMap(errors));
+    const config = useTigerConfig();
+    const validationMessages = computed(
+      () => getFormValidationLabels(mergeTigerLocale(config.value.locale, props.locale))
+    );
     let validationDebouncer = createFormValidationDebouncer({
       delay: props.validateDebounce
     });
@@ -222,7 +241,14 @@ var Form = defineComponent({
         return null;
       }
       const value = getValueByPath(props.model, fieldName);
-      return validateFieldUtil(fieldName, value, effectiveFieldRules, props.model, trigger);
+      return validateFieldUtil(
+        fieldName,
+        value,
+        effectiveFieldRules,
+        props.model,
+        trigger,
+        validationMessages.value
+      );
     };
     const validateFieldNow = async (fieldName, rulesOverride, trigger) => {
       const conditionState = getFieldConditionState(fieldName);
@@ -276,7 +302,7 @@ var Form = defineComponent({
       if (!effectiveRules) {
         return true;
       }
-      const result = await validateForm(props.model, effectiveRules);
+      const result = await validateForm(props.model, effectiveRules, validationMessages.value);
       errors.push(...result.errors);
       return result.valid;
     };
@@ -325,6 +351,13 @@ var Form = defineComponent({
     const resetFields = () => {
       validationDebouncer.cancel();
       clearValidate();
+      if (props.model) {
+        Object.keys(props.model).forEach((key) => delete props.model[key]);
+        Object.assign(props.model, { ...initialValues });
+      }
+      if (props.undoable) {
+        history.value = createFormHistory({ ...initialValues }, props.maxHistorySize);
+      }
     };
     const addField = (fieldName, defaultValue) => {
       if (props.model && fieldName) {