@expcat/tigercat-vue 1.0.4 → 1.1.0

package/dist/{chunk-DN5GU5PC.js → chunk-2LNNB55E.js}

@@ -1,9 +1,9 @@
 'use strict';
 
+var chunkJDCVS4SJ_js = require('./chunk-JDCVS4SJ.js');
 var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
-// src/components/Loading.ts
 var Loading = vue.defineComponent({
   name: "TigerLoading",
   inheritAttrs: false,
@@ -40,6 +40,14 @@ var Loading = vue.defineComponent({
       type: String,
       default: void 0
     },
+    lockScroll: {
+      type: Boolean,
+      default: true
+    },
+    disableTeleport: {
+      type: Boolean,
+      default: false
+    },
     className: {
       type: String,
       default: void 0
@@ -53,6 +61,10 @@ var Loading = vue.defineComponent({
     tigercatCore.injectLoadingAnimationStyles();
     const visible = vue.ref(false);
     let timer = null;
+    const shouldLockBodyScroll = vue.computed(
+      () => props.fullscreen && visible.value && props.lockScroll
+    );
+    chunkJDCVS4SJ_js.useVueBodyScrollLock(shouldLockBodyScroll);
     const clearTimer = () => {
       if (timer) {
         clearTimeout(timer);
@@ -164,7 +176,7 @@ var Loading = vue.defineComponent({
       if (props.text) {
         children.push(vue.h("div", { class: textClasses.value }, props.text));
       }
-      return vue.h(
+      const loadingNode = vue.h(
         "div",
         {
           role: "status",
@@ -177,6 +189,10 @@ var Loading = vue.defineComponent({
         },
         children
       );
+      if (props.fullscreen) {
+        return chunkJDCVS4SJ_js.renderVueBodyTeleport([loadingNode], props.disableTeleport);
+      }
+      return loadingNode;
     };
   }
 });

package/dist/{chunk-RB7KVVWE.mjs → chunk-2X3ZPH2H.mjs}

@@ -1,5 +1,5 @@
 import { h, defineComponent, ref, computed, watch, onBeforeUnmount, nextTick } from 'vue';
-import { icon20ViewBox, closeSolidIcon20PathD, filterAutoCompleteOptions, classNames, autoCompleteBaseClasses, coerceClassValue, getAutoCompleteInputClasses, autoCompleteDropdownClasses, getAutoCompleteOptionClasses, autoCompleteEmptyStateClasses } from '@expcat/tigercat-core';
+import { icon20ViewBox, closeSolidIcon20PathD, filterAutoCompleteOptions, classNames, autoCompleteBaseClasses, coerceClassValue, getPickerComboboxAria, getAutoCompleteInputClasses, autoCompleteDropdownClasses, getPickerListboxAria, getAutoCompleteOptionClasses, getPickerOptionAria, getPickerOptionId, autoCompleteEmptyStateClasses, getPickerNavigationIndex, getInitialPickerActiveIndex } from '@expcat/tigercat-core';
 
 // src/components/AutoComplete.ts
 var autoCompleteInstanceId = 0;
@@ -87,9 +87,10 @@ var AutoComplete = defineComponent({
     function openDropdown() {
       if (props.disabled) return;
       isOpen.value = true;
-      if (props.defaultActiveFirstOption && filteredOptions.value.length > 0) {
-        activeIndex.value = 0;
-      }
+      activeIndex.value = getInitialPickerActiveIndex(
+        filteredOptions.value,
+        props.defaultActiveFirstOption
+      );
     }
     function closeDropdown() {
       isOpen.value = false;
@@ -103,7 +104,7 @@ var AutoComplete = defineComponent({
       emit("change", val);
       if (!isOpen.value) openDropdown();
       if (props.defaultActiveFirstOption) {
-        activeIndex.value = filteredOptions.value.length > 0 ? 0 : -1;
+        activeIndex.value = getInitialPickerActiveIndex(filteredOptions.value, true);
       }
     }
     function handleSelect(option) {
@@ -132,20 +133,11 @@ var AutoComplete = defineComponent({
       const options = filteredOptions.value;
       switch (e.key) {
         case "ArrowDown":
-          e.preventDefault();
-          if (options.length > 0) {
-            let next = activeIndex.value + 1;
-            while (next < options.length && options[next].disabled) next++;
-            if (next < options.length) activeIndex.value = next;
-          }
-          break;
         case "ArrowUp":
+        case "Home":
+        case "End":
           e.preventDefault();
-          if (options.length > 0) {
-            let prev = activeIndex.value - 1;
-            while (prev >= 0 && options[prev].disabled) prev--;
-            if (prev >= 0) activeIndex.value = prev;
-          }
+          activeIndex.value = getPickerNavigationIndex(options, activeIndex.value, e.key);
           break;
         case "Enter":
           e.preventDefault();
@@ -192,11 +184,11 @@ var AutoComplete = defineComponent({
             value: inputValue.value,
             placeholder: props.placeholder,
             disabled: props.disabled,
-            role: "combobox",
-            "aria-expanded": String(isOpen.value),
-            "aria-haspopup": "listbox",
-            "aria-controls": isOpen.value ? listboxId : void 0,
-            "aria-activedescendant": isOpen.value && activeIndex.value >= 0 ? `${listboxId}-option-${activeIndex.value}` : void 0,
+            ...getPickerComboboxAria({
+              expanded: isOpen.value,
+              listboxId,
+              activeIndex: activeIndex.value
+            }),
             autocomplete: "off",
             onInput: handleInput,
             onFocus: openDropdown,
@@ -217,18 +209,18 @@ var AutoComplete = defineComponent({
           isOpen.value && options.length > 0 ? h(
             "div",
             {
-              id: listboxId,
-              role: "listbox",
+              ...getPickerListboxAria({ id: listboxId }),
               class: autoCompleteDropdownClasses
             },
             options.map(
               (option, index) => h(
                 "div",
                 {
-                  id: `${listboxId}-option-${index}`,
-                  role: "option",
-                  "aria-selected": String(option.value) === String(props.modelValue),
-                  "aria-disabled": option.disabled,
+                  id: getPickerOptionId(listboxId, index),
+                  ...getPickerOptionAria({
+                    selected: String(option.value) === String(props.modelValue),
+                    disabled: !!option.disabled
+                  }),
                   class: getAutoCompleteOptionClasses(
                     String(option.value) === String(props.modelValue),
                     !!option.disabled,

package/dist/{chunk-SEKYX56R.js → chunk-2Z2CJEUL.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkD6AWPRGV_js = require('./chunk-D6AWPRGV.js');
+var chunkVYGI74MJ_js = require('./chunk-VYGI74MJ.js');
 var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
@@ -76,7 +76,7 @@ var FormItem = vue.defineComponent({
     }
   },
   setup(props, { slots }) {
-    const formContextRef = vue.inject(chunkD6AWPRGV_js.FormContextKey, null);
+    const formContextRef = vue.inject(chunkVYGI74MJ_js.FormContextKey, null);
     const formContext = vue.computed(() => formContextRef?.value ?? null);
     const errorMessage = vue.ref("");
     const shakeTrigger = vue.ref(0);
@@ -133,18 +133,16 @@ var FormItem = vue.defineComponent({
       return showRequiredAsterisk.value && (formContext.value?.showRequiredAsterisk ?? true);
     });
     vue.watch(
-      () => formContext.value?.errors,
-      (errors) => {
-        if (props.name && errors) {
-          const error = tigercatCore.getFieldError(props.name, errors) || "";
-          errorMessage.value = error;
-          if (error && error !== prevFormError.value) {
-            shakeTrigger.value++;
-          }
-          prevFormError.value = error;
+      () => props.name ? formContext.value?.errorsByField[props.name] : void 0,
+      (error) => {
+        const nextError = error || "";
+        errorMessage.value = nextError;
+        if (nextError && nextError !== prevFormError.value) {
+          shakeTrigger.value++;
         }
+        prevFormError.value = nextError;
       },
-      { deep: true, immediate: true }
+      { immediate: true }
     );
     vue.watch(
       () => props.error,
@@ -285,7 +283,6 @@ var FormItem = vue.defineComponent({
               "aria-labelledby": props.label ? labelId : void 0,
               "aria-describedby": describedById.value,
               "aria-invalid": hasError.value ? "true" : void 0,
-              "aria-required": isRequired.value ? "true" : void 0,
               onFocusout: isSingleVNode ? void 0 : handleBlur,
               onInput: isSingleVNode ? void 0 : handleChange
             },

package/dist/{chunk-TDL4BUUB.js → chunk-33YTJPF7.js}

@@ -1,6 +1,7 @@
 'use strict';
 
-var chunk2WZGK7XJ_js = require('./chunk-2WZGK7XJ.js');
+var chunkLWDA7ABQ_js = require('./chunk-LWDA7ABQ.js');
+var chunkJDCVS4SJ_js = require('./chunk-JDCVS4SJ.js');
 var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
@@ -69,7 +70,7 @@ var Popconfirm = vue.defineComponent({
       floatingRef,
       floatingStyles,
       actualPlacement
-    } = chunk2WZGK7XJ_js.useFloatingPopup({ props, emit, multiTrigger: false });
+    } = chunkLWDA7ABQ_js.useFloatingPopup({ props, emit, multiTrigger: false });
     const popconfirmId = createPopconfirmId();
     const titleId = `${popconfirmId}-title`;
     const descriptionId = `${popconfirmId}-description`;
@@ -243,7 +244,7 @@ var Popconfirm = vue.defineComponent({
           class: containerClasses.value,
           style: tigercatCore.mergeStyleValues(attrs.style, props.style)
         },
-        [trigger, content]
+        [trigger, chunkJDCVS4SJ_js.renderVueBodyTeleport(content)]
       );
     };
   }

package/dist/{chunk-NXGCLBVG.js → chunk-47Z4MGKP.js}

@@ -72,41 +72,112 @@ var ImageViewer = vue.defineComponent({
   emits: ["update:open", "update:currentIndex", "close"],
   setup(props, { emit, attrs }) {
     const index = vue.ref(props.currentIndex);
-    const zoom = vue.ref(1);
-    const rotation = vue.ref(0);
+    const transform = vue.ref(tigercatCore.createDefaultTransform());
+    let panState = tigercatCore.createPanState();
+    let pinchState = tigercatCore.createPinchState();
     vue.watch(
       () => props.currentIndex,
       (val) => {
         index.value = val;
       }
     );
+    function resetTransform() {
+      transform.value = tigercatCore.createDefaultTransform();
+      panState = tigercatCore.createPanState();
+      pinchState = tigercatCore.createPinchState();
+    }
     const handleClose = () => {
       emit("update:open", false);
       emit("close");
     };
     const handlePrev = () => {
       index.value = (index.value - 1 + props.images.length) % props.images.length;
-      zoom.value = 1;
-      rotation.value = 0;
+      resetTransform();
       emit("update:currentIndex", index.value);
     };
     const handleNext = () => {
       index.value = (index.value + 1) % props.images.length;
-      zoom.value = 1;
-      rotation.value = 0;
+      resetTransform();
       emit("update:currentIndex", index.value);
     };
     const handleZoomIn = () => {
-      zoom.value = tigercatCore.clampZoom(zoom.value + 0.25, props.minZoom, props.maxZoom);
+      transform.value = {
+        ...transform.value,
+        scale: tigercatCore.clampZoom(transform.value.scale + 0.25, props.minZoom, props.maxZoom)
+      };
     };
     const handleZoomOut = () => {
-      zoom.value = tigercatCore.clampZoom(zoom.value - 0.25, props.minZoom, props.maxZoom);
+      transform.value = {
+        ...transform.value,
+        scale: tigercatCore.clampZoom(transform.value.scale - 0.25, props.minZoom, props.maxZoom)
+      };
     };
     const handleRotateLeft = () => {
-      rotation.value = tigercatCore.normalizeRotation(rotation.value - 90);
+      transform.value = {
+        ...transform.value,
+        rotation: tigercatCore.normalizeRotation(transform.value.rotation - 90)
+      };
     };
     const handleRotateRight = () => {
-      rotation.value = tigercatCore.normalizeRotation(rotation.value + 90);
+      transform.value = {
+        ...transform.value,
+        rotation: tigercatCore.normalizeRotation(transform.value.rotation + 90)
+      };
+    };
+    const handleWheel = (e) => {
+      if (!props.zoomable) return;
+      e.preventDefault();
+      const newScale = tigercatCore.applyWheelZoom(transform.value.scale, e.deltaY, {
+        minZoom: props.minZoom,
+        maxZoom: props.maxZoom
+      });
+      transform.value = { ...transform.value, scale: newScale };
+    };
+    const handleMouseDown = (e) => {
+      if (e.button !== 0) return;
+      e.preventDefault();
+      panState = tigercatCore.startPan(e.clientX, e.clientY, transform.value.translateX, transform.value.translateY);
+    };
+    const handleMouseMove = (e) => {
+      if (!panState.isPanning) return;
+      const result = tigercatCore.movePan(panState, e.clientX, e.clientY);
+      transform.value = { ...transform.value, ...result };
+    };
+    const handleMouseUp = () => {
+      panState = tigercatCore.createPanState();
+    };
+    const handleTouchStart = (e) => {
+      if (e.touches.length === 2 && props.zoomable) {
+        e.preventDefault();
+        pinchState = tigercatCore.startPinch(e.touches[0], e.touches[1], transform.value.scale);
+      } else if (e.touches.length === 1) {
+        panState = tigercatCore.startPan(
+          e.touches[0].clientX,
+          e.touches[0].clientY,
+          transform.value.translateX,
+          transform.value.translateY
+        );
+      }
+    };
+    const handleTouchMove = (e) => {
+      if (e.touches.length === 2 && pinchState.isPinching) {
+        e.preventDefault();
+        const newScale = tigercatCore.movePinch(
+          pinchState,
+          e.touches[0],
+          e.touches[1],
+          props.minZoom,
+          props.maxZoom
+        );
+        transform.value = { ...transform.value, scale: newScale };
+      } else if (e.touches.length === 1 && panState.isPanning) {
+        const result = tigercatCore.movePan(panState, e.touches[0].clientX, e.touches[0].clientY);
+        transform.value = { ...transform.value, ...result };
+      }
+    };
+    const handleTouchEnd = () => {
+      pinchState = tigercatCore.createPinchState();
+      panState = tigercatCore.createPanState();
     };
     const handleKeydown = (e) => {
       if (!props.open) return;
@@ -182,9 +253,18 @@ var ImageViewer = vue.defineComponent({
           src: props.images[index.value],
           alt: `Image ${index.value + 1}`,
           style: {
-            transform: `scale(${zoom.value}) rotate(${rotation.value}deg)`
+            transform: tigercatCore.getImageTransformStyle(transform.value)
           },
-          draggable: false
+          draggable: false,
+          onWheel: handleWheel,
+          onMousedown: handleMouseDown,
+          onMousemove: handleMouseMove,
+          onMouseup: handleMouseUp,
+          onMouseleave: handleMouseUp,
+          onTouchstart: handleTouchStart,
+          onTouchmove: handleTouchMove,
+          onTouchend: handleTouchEnd,
+          onTouchcancel: handleTouchEnd
         })
       );
       const toolbarButtons = [];

package/dist/{chunk-243JSTYQ.mjs → chunk-4CWRNKPE.mjs}

@@ -1,4 +1,5 @@
-import { useFloatingPopup } from './chunk-6A57RY3H.mjs';
+import { useFloatingPopup } from './chunk-DBTS5QBX.mjs';
+import { renderVueBodyTeleport } from './chunk-7RIWAO2A.mjs';
 import { defineComponent, computed, isVNode, h, cloneVNode } from 'vue';
 import { createFloatingIdFactory, classNames, getPopconfirmContainerClasses, coerceClassValue, getPopconfirmTriggerClasses, getPopconfirmArrowClasses, getPopconfirmContentClasses, getPopconfirmTitleClasses, getPopconfirmDescriptionClasses, getPopconfirmButtonsClasses, getPopconfirmCancelButtonClasses, getPopconfirmIconClasses, getPopconfirmOkButtonClasses, mergeStyleValues, popconfirmIconViewBox, popconfirmIconStrokeWidth, getPopconfirmIconPath, popconfirmIconPathStrokeLinejoin, popconfirmIconPathStrokeLinecap } from '@expcat/tigercat-core';
 
@@ -241,7 +242,7 @@ var Popconfirm = defineComponent({
           class: containerClasses.value,
           style: mergeStyleValues(attrs.style, props.style)
         },
-        [trigger, content]
+        [trigger, renderVueBodyTeleport(content)]
       );
     };
   }

package/dist/{chunk-BUTNEKFD.js → chunk-4VB6I3CA.js}

@@ -1,7 +1,6 @@
 'use strict';
 
-var chunk6DP7XE77_js = require('./chunk-6DP7XE77.js');
-var chunkPNKVD2UK_js = require('./chunk-PNKVD2UK.js');
+var chunkCRGGJKV2_js = require('./chunk-CRGGJKV2.js');
 var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
@@ -155,19 +154,16 @@ var Image = vue.defineComponent({
           onError: handleError
         });
       }
-      const previewEl = !group && previewVisible.value && props.src ? (() => {
-        const { ImagePreview } = (chunk6DP7XE77_js.init_ImagePreview(), chunkPNKVD2UK_js.__toCommonJS(chunk6DP7XE77_js.ImagePreview_exports));
-        return vue.h(ImagePreview, {
-          open: previewVisible.value,
-          images: [props.src],
-          currentIndex: 0,
-          "onUpdate:open": (val) => {
-            previewVisible.value = val;
-            emit("preview-open-change", val);
-            emit("preview-visible-change", val);
-          }
-        });
-      })() : null;
+      const previewEl = !group && previewVisible.value && props.src ? vue.h(chunkCRGGJKV2_js.ImagePreview, {
+        open: previewVisible.value,
+        images: [props.src],
+        currentIndex: 0,
+        "onUpdate:open": (val) => {
+          previewVisible.value = val;
+          emit("preview-open-change", val);
+          emit("preview-visible-change", val);
+        }
+      }) : null;
       return vue.h(
         "div",
         {

package/dist/{chunk-U7CCKZAG.js → chunk-5436FG3B.js}

@@ -4,19 +4,21 @@ var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
 // src/components/Button.ts
-var spinnerSvg = tigercatCore.getSpinnerSVG("spinner");
-var LoadingSpinner = vue.h(
-  "svg",
-  {
-    class: "animate-spin h-4 w-4",
-    xmlns: "http://www.w3.org/2000/svg",
-    fill: "none",
-    viewBox: spinnerSvg.viewBox,
-    "aria-hidden": "true",
-    focusable: "false"
-  },
-  spinnerSvg.elements.map((el) => vue.h(el.type, tigercatCore.normalizeSvgAttrs(el.attrs)))
-);
+var createLoadingSpinner = () => {
+  const spinnerSvg = tigercatCore.getSpinnerSVG("spinner");
+  return vue.h(
+    "svg",
+    {
+      class: "animate-spin h-4 w-4",
+      xmlns: "http://www.w3.org/2000/svg",
+      fill: "none",
+      viewBox: spinnerSvg.viewBox,
+      "aria-hidden": "true",
+      focusable: "false"
+    },
+    spinnerSvg.elements.map((el) => vue.h(el.type, tigercatCore.normalizeSvgAttrs(el.attrs)))
+  );
+};
 var Button = vue.defineComponent({
   name: "TigerButton",
   inheritAttrs: false,
@@ -82,14 +84,14 @@ var Button = vue.defineComponent({
   setup(props, { slots, emit, attrs }) {
     const buttonClasses = vue.computed(() => {
       const variantClasses = props.danger ? tigercatCore.buttonDangerClasses[props.variant] ?? tigercatCore.buttonDangerClasses.primary : tigercatCore.getButtonVariantClasses(props.variant);
-      return tigercatCore.classNames(
+      return tigercatCore.composeComponentClasses(
         tigercatCore.buttonBaseClasses,
         variantClasses,
         tigercatCore.buttonSizeClasses[props.size],
         (props.disabled || props.loading) && tigercatCore.buttonDisabledClasses,
         props.block && "w-full",
         props.className,
-        tigercatCore.coerceClassValue(attrs.class)
+        attrs.class
       );
     });
     const mergedStyle = vue.computed(() => tigercatCore.mergeStyleValues(attrs.style, props.style));
@@ -99,7 +101,7 @@ var Button = vue.defineComponent({
       const loadingNode = props.loading ? vue.h(
         "span",
         { class: iconIsRight ? "ml-2 order-1" : "mr-2" },
-        slots["loading-icon"] ? slots["loading-icon"]() : LoadingSpinner
+        slots["loading-icon"] ? slots["loading-icon"]() : createLoadingSpinner()
       ) : null;
       const iconNode = !props.loading && slots.icon ? vue.h("span", { class: iconIsRight ? "ml-2 order-1" : "mr-2" }, slots.icon()) : null;
       return vue.h(

package/dist/{chunk-AGAJJYP2.js → chunk-56EI2AYV.js}

@@ -150,6 +150,10 @@ var Pagination = vue.defineComponent({
      * Locale configuration for i18n support
      */
     locale: {
+      type: [Object, Function],
+      default: void 0
+    },
+    quickJumperValidation: {
       type: Object,
       default: void 0
     }
@@ -159,10 +163,46 @@ var Pagination = vue.defineComponent({
     const attrsRecord = attrs;
     const attrsClass = attrsRecord.class;
     const attrsStyle = attrsRecord.style;
-    const labels = vue.computed(() => tigercatCore.getPaginationLabels(props.locale));
+    const resolvedLocale = vue.ref(
+      tigercatCore.getImmediateTigerLocale(props.locale)
+    );
+    let localeResolveId = 0;
+    let disposed = false;
+    vue.watch(
+      () => props.locale,
+      (locale) => {
+        const resolveId = ++localeResolveId;
+        const immediateLocale = tigercatCore.getImmediateTigerLocale(locale);
+        resolvedLocale.value = immediateLocale;
+        if (!tigercatCore.isLazyTigerLocale(locale)) return;
+        tigercatCore.resolveTigerLocale(locale).then((nextLocale) => {
+          if (!disposed && resolveId === localeResolveId) {
+            resolvedLocale.value = nextLocale;
+          }
+        }).catch(() => {
+          if (!disposed && resolveId === localeResolveId) {
+            resolvedLocale.value = immediateLocale;
+          }
+        });
+      },
+      { immediate: true }
+    );
+    const labels = vue.computed(() => tigercatCore.getPaginationLabels(resolvedLocale.value));
     const internalCurrent = vue.ref(props.defaultCurrent);
     const internalPageSize = vue.ref(props.defaultPageSize);
     const quickJumperValue = vue.ref("");
+    let quickJumperValidationScheduler = tigercatCore.createPaginationIdleValidationScheduler(props.quickJumperValidation);
+    vue.watch(
+      () => props.quickJumperValidation,
+      (options) => {
+        quickJumperValidationScheduler.cancel();
+        quickJumperValidationScheduler = tigercatCore.createPaginationIdleValidationScheduler(options);
+      }
+    );
+    vue.onBeforeUnmount(() => {
+      disposed = true;
+      quickJumperValidationScheduler.cancel();
+    });
     const currentPage = vue.computed(() => {
       return props.current !== void 0 ? props.current : internalCurrent.value;
     });
@@ -212,12 +252,19 @@ var Pagination = vue.defineComponent({
       }
     };
     const handleQuickJumperSubmit = () => {
-      const page = parseInt(quickJumperValue.value, 10);
-      if (!isNaN(page)) {
+      quickJumperValidationScheduler.cancel();
+      const page = tigercatCore.getPaginationJumperPage(quickJumperValue.value, totalPages.value);
+      if (page !== null) {
         handlePageChange(page);
       }
       quickJumperValue.value = "";
     };
+    const handleQuickJumperInput = (value) => {
+      quickJumperValue.value = value;
+      quickJumperValidationScheduler.schedule(() => {
+        quickJumperValue.value = tigercatCore.getValidatedPaginationJumperValue(value, totalPages.value);
+      });
+    };
     const handleQuickJumperKeypress = (event) => {
       if (event.key === "Enter") {
         handleQuickJumperSubmit();
@@ -280,11 +327,7 @@ var Pagination = vue.defineComponent({
         tigercatCore.getPageNumbers(page, pages, props.showLessItems).forEach((pageNum) => {
           if (pageNum === "...") {
             elements.push(
-              vue.h(
-                "span",
-                { class: tigercatCore.getPaginationEllipsisClasses(size), "aria-hidden": "true" },
-                "..."
-              )
+              vue.h("span", { class: tigercatCore.getPaginationEllipsisClasses(size), "aria-hidden": "true" }, "...")
             );
           } else {
             const isActive = pageNum === page;
@@ -342,9 +385,7 @@ var Pagination = vue.defineComponent({
       }
       if (props.showQuickJumper) {
         const sizeText = tigercatCore.getSizeTextClasses(size);
-        elements.push(
-          vue.h("span", { class: tigercatCore.classNames("ml-2", sizeText) }, labels.value.jumpToText)
-        );
+        elements.push(vue.h("span", { class: tigercatCore.classNames("ml-2", sizeText) }, labels.value.jumpToText));
         elements.push(
           vue.h("input", {
             type: "number",
@@ -352,7 +393,7 @@ var Pagination = vue.defineComponent({
             disabled: props.disabled,
             value: quickJumperValue.value,
             onInput: (e) => {
-              quickJumperValue.value = e.target.value;
+              handleQuickJumperInput(e.target.value);
             },
             onKeydown: handleQuickJumperKeypress,
             min: 1,