@expcat/tigercat-vue 1.0.7 → 1.2.0

package/dist/{chunk-WLKOJFOC.mjs → chunk-NNNG6NIA.mjs}

@@ -1,7 +1,13 @@
-import { defineComponent, ref, computed, watch, onBeforeUnmount, h } from 'vue';
-import { classNames, coerceClassValue, getMentionsInputClasses, mentionsDropdownClasses, getMentionsOptionClasses, extractMentionQuery } from '@expcat/tigercat-core';
-
 // src/components/Mentions.ts
+import { defineComponent, h, ref, computed, watch, nextTick, onBeforeUnmount } from "vue";
+import { classNames, coerceClassValue } from "@expcat/tigercat-core";
+import {
+  getMentionsInputClasses,
+  mentionsDropdownClasses,
+  getMentionsOptionClasses,
+  extractMentionQuery,
+  positionMentionsDropdown
+} from "@expcat/tigercat-core";
 var Mentions = defineComponent({
   name: "TigerMentions",
   props: {
@@ -20,6 +26,7 @@ var Mentions = defineComponent({
     const mentionStartPos = ref(-1);
     const query = ref("");
     const textareaRef = ref(null);
+    const dropdownRef = ref(null);
     const containerRef = ref(null);
     const filteredOptions = computed(() => {
       if (!query.value) return props.options || [];
@@ -78,6 +85,16 @@ var Mentions = defineComponent({
       if (val) document.addEventListener("mousedown", onClickOutside);
       else document.removeEventListener("mousedown", onClickOutside);
     });
+    watch(
+      [isOpen, filteredOptions],
+      async () => {
+        if (!isOpen.value || filteredOptions.value.length === 0) return;
+        await nextTick();
+        if (!textareaRef.value || !dropdownRef.value) return;
+        await positionMentionsDropdown(textareaRef.value, dropdownRef.value);
+      },
+      { flush: "post" }
+    );
     onBeforeUnmount(() => {
       document.removeEventListener("mousedown", onClickOutside);
     });
@@ -96,7 +113,7 @@ var Mentions = defineComponent({
         }),
         isOpen.value && filteredOptions.value.length > 0 ? h(
           "div",
-          { class: mentionsDropdownClasses, role: "listbox" },
+          { ref: dropdownRef, class: mentionsDropdownClasses, role: "listbox" },
           filteredOptions.value.map(
             (opt, i) => h(
               "div",
@@ -117,4 +134,7 @@ var Mentions = defineComponent({
 });
 var Mentions_default = Mentions;
 
-export { Mentions, Mentions_default };
+export {
+  Mentions,
+  Mentions_default
+};

package/dist/chunk-NOZ65AMO.js

@@ -1,10 +1,18 @@
-'use strict';
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }// src/components/Empty.ts
+var _vue = require('vue');
 
-var vue = require('vue');
-var tigercatCore = require('@expcat/tigercat-core');
 
-// src/components/Empty.ts
-var Empty = vue.defineComponent({
+
+
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var Empty = _vue.defineComponent.call(void 0, {
   name: "TigerEmpty",
   inheritAttrs: false,
   props: {
@@ -30,31 +38,31 @@ var Empty = vue.defineComponent({
     }
   },
   setup(props, { slots, attrs }) {
-    const descText = vue.computed(() => props.description ?? tigercatCore.getEmptyDescription(props.preset));
+    const descText = _vue.computed.call(void 0, () => _nullishCoalesce(props.description, () => ( _tigercatcore.getEmptyDescription.call(void 0, props.preset))));
     return () => {
       const attrsRecord = attrs;
       const children = [];
       if (props.showImage) {
         if (slots.image) {
-          children.push(vue.h("div", { class: tigercatCore.emptyImageClasses }, slots.image()));
+          children.push(_vue.h.call(void 0, "div", { class: _tigercatcore.emptyImageClasses }, slots.image()));
         } else {
-          const paths = tigercatCore.emptyIllustrationPaths.map(
-            (p, i) => vue.h("path", {
+          const paths = _tigercatcore.emptyIllustrationPaths.map(
+            (p, i) => _vue.h.call(void 0, "path", {
               key: i,
               d: p.d,
-              fill: p.fill ?? "none",
+              fill: _nullishCoalesce(p.fill, () => ( "none")),
               stroke: p.stroke,
               "stroke-width": p.strokeWidth,
               opacity: p.opacity
             })
           );
           children.push(
-            vue.h("div", { class: tigercatCore.emptyImageClasses }, [
-              vue.h(
+            _vue.h.call(void 0, "div", { class: _tigercatcore.emptyImageClasses }, [
+              _vue.h.call(void 0, 
                 "svg",
                 {
                   xmlns: "http://www.w3.org/2000/svg",
-                  viewBox: tigercatCore.emptyIllustrationViewBox,
+                  viewBox: _tigercatcore.emptyIllustrationViewBox,
                   class: "mx-auto h-24 w-24"
                 },
                 paths
@@ -65,25 +73,25 @@ var Empty = vue.defineComponent({
       }
       if (slots.description || descText.value) {
         children.push(
-          vue.h(
+          _vue.h.call(void 0, 
             "div",
-            { class: tigercatCore.emptyDescriptionClasses },
+            { class: _tigercatcore.emptyDescriptionClasses },
             slots.description ? slots.description() : descText.value
           )
         );
       }
       if (slots.extra) {
-        children.push(vue.h("div", { class: tigercatCore.emptyActionsClasses }, slots.extra()));
+        children.push(_vue.h.call(void 0, "div", { class: _tigercatcore.emptyActionsClasses }, slots.extra()));
       }
       if (slots.default) {
-        children.push(vue.h("div", null, slots.default()));
+        children.push(_vue.h.call(void 0, "div", null, slots.default()));
       }
-      return vue.h(
+      return _vue.h.call(void 0, 
         "div",
         {
           ...attrs,
-          class: tigercatCore.classNames(tigercatCore.emptyBaseClasses, props.className, tigercatCore.coerceClassValue(attrsRecord.class)),
-          style: tigercatCore.mergeStyleValues(attrsRecord.style, props.style)
+          class: _tigercatcore.classNames.call(void 0, _tigercatcore.emptyBaseClasses, props.className, _tigercatcore.coerceClassValue.call(void 0, attrsRecord.class)),
+          style: _tigercatcore.mergeStyleValues.call(void 0, attrsRecord.style, props.style)
         },
         children
       );
@@ -92,5 +100,7 @@ var Empty = vue.defineComponent({
 });
 var Empty_default = Empty;
 
-exports.Empty = Empty;
-exports.Empty_default = Empty_default;
+
+
+
+exports.Empty = Empty; exports.Empty_default = Empty_default;

package/dist/{chunk-TYFUO6PE.mjs → chunk-NWS45JQP.mjs}

@@ -1,13 +1,46 @@
-import { useChartInteraction } from './chunk-DU2NXX75.mjs';
-import { ChartLegend } from './chunk-F5HOHSFH.mjs';
-import { ChartSeries } from './chunk-2ZUEXCVJ.mjs';
-import { ChartTooltip } from './chunk-FXGIIFGN.mjs';
-import { ChartAxis } from './chunk-ZWVA7HT3.mjs';
-import { ChartCanvas } from './chunk-5WHLXWWT.mjs';
-import { ChartGrid } from './chunk-MI6TL3CQ.mjs';
-import { defineComponent, ref, computed, h } from 'vue';
-import { getAreaGradientPrefix, getChartInnerRect, resolveSeriesData, stackSeriesData, getNumberExtent, createLinearScale, createPointScale, resolveChartPalette, createLinePath, createAreaPath, getChartElementOpacity, buildChartLegendItems, resolveMultiSeriesTooltipContent, defaultSeriesXYTooltipFormatter, classNames } from '@expcat/tigercat-core';
+import {
+  useChartInteraction
+} from "./chunk-R2HO74FE.mjs";
+import {
+  ChartLegend
+} from "./chunk-VVS2CQS4.mjs";
+import {
+  ChartSeries
+} from "./chunk-2ZUEXCVJ.mjs";
+import {
+  ChartTooltip
+} from "./chunk-OK4PVFQG.mjs";
+import {
+  ChartAxis
+} from "./chunk-ZWVA7HT3.mjs";
+import {
+  ChartCanvas
+} from "./chunk-W5RZPTFD.mjs";
+import {
+  ChartGrid
+} from "./chunk-MI6TL3CQ.mjs";
 
+// src/components/AreaChart.ts
+import { defineComponent, computed, h, ref, useId } from "vue";
+import {
+  classNames,
+  createAreaPath,
+  createLinearScale,
+  createLinePath,
+  createPointScale,
+  getStableChartGradientPrefix,
+  getChartElementOpacity,
+  getChartInnerRect,
+  getNumberExtent,
+  linePointTransitionClasses,
+  stackSeriesData,
+  resolveChartPalette,
+  buildChartLegendItems,
+  buildChartSeriesKeys,
+  resolveMultiSeriesTooltipContent,
+  resolveSeriesData,
+  defaultSeriesXYTooltipFormatter
+} from "@expcat/tigercat-core";
 var AreaChart = defineComponent({
   name: "TigerAreaChart",
   props: {
@@ -172,7 +205,7 @@ var AreaChart = defineComponent({
     },
     gradient: {
       type: Boolean,
-      default: false
+      default: true
     },
     animated: {
       type: Boolean,
@@ -182,6 +215,14 @@ var AreaChart = defineComponent({
       type: Boolean,
       default: false
     },
+    strokeGradient: {
+      type: Boolean,
+      default: false
+    },
+    pointGradient: {
+      type: Boolean,
+      default: false
+    },
     tooltipFormatter: {
       type: Function
     },
@@ -210,7 +251,7 @@ var AreaChart = defineComponent({
   setup(props, { emit }) {
     const hoveredPointInfo = ref(null);
     const tooltipPosition = ref({ x: 0, y: 0 });
-    const gradientPrefix = getAreaGradientPrefix();
+    const gradientPrefix = getStableChartGradientPrefix("area", useId());
     const innerRect = computed(() => getChartInnerRect(props.width, props.height, props.padding));
     const resolvedSeries = computed(
       () => resolveSeriesData(props.series, props.data)
@@ -270,9 +311,13 @@ var AreaChart = defineComponent({
     const shouldShowXAxis = computed(() => props.showAxis && props.showXAxis);
     const shouldShowYAxis = computed(() => props.showAxis && props.showYAxis);
     const palette = computed(() => resolveChartPalette(props.colors));
+    const seriesKeys = computed(
+      () => buildChartSeriesKeys(resolvedSeries.value, { prefix: "area-" })
+    );
     const seriesData = computed(() => {
       const stackedData = props.stacked ? stackSeriesData(resolvedSeries.value.map((s) => s.data)) : null;
       return resolvedSeries.value.map((series, seriesIndex) => {
+        const seriesKey = seriesKeys.value[seriesIndex];
         const color = series.color ?? palette.value[seriesIndex % palette.value.length];
         const fillColor = series.fillColor ?? color;
         const seriesFillOpacity = series.fillOpacity ?? props.fillOpacity;
@@ -313,6 +358,7 @@ var AreaChart = defineComponent({
         return {
           series,
           seriesIndex,
+          seriesKey,
           color,
           fillColor,
           fillOpacity: seriesFillOpacity,
@@ -393,19 +439,22 @@ var AreaChart = defineComponent({
         {
           default: () => [
             // Gradient defs and animation styles
-            props.gradient || props.animated ? h("defs", null, [
+            props.gradient || props.animated || props.strokeGradient || props.pointGradient ? h("defs", null, [
               // Animation keyframes
               props.animated ? h(
                 "style",
                 null,
                 `
                           .tiger-area-animated {
-                            animation: tiger-area-draw 1.2s cubic-bezier(.4,0,.2,1) forwards;
+                            animation: tiger-area-draw var(--tiger-motion-duration-slow,1.2s) var(--tiger-motion-ease-emphasized,cubic-bezier(.4,0,.2,1)) forwards;
                           }
                           @keyframes tiger-area-draw {
                             from { stroke-dashoffset: 1; }
                             to { stroke-dashoffset: 0; }
                           }
+                          @media (prefers-reduced-motion: reduce) {
+                            .tiger-area-animated { animation-duration: 0ms; }
+                          }
                         `
               ) : null,
               // Area fill gradients
@@ -413,8 +462,8 @@ var AreaChart = defineComponent({
                 (sd) => h(
                   "linearGradient",
                   {
-                    key: `area-grad-${sd.seriesIndex}`,
-                    id: `${gradientPrefix}-${sd.seriesIndex}`,
+                    key: `area-grad-${sd.seriesKey}`,
+                    id: `${gradientPrefix}-${sd.seriesKey}`,
                     x1: "0",
                     y1: "0",
                     x2: "0",
@@ -433,6 +482,61 @@ var AreaChart = defineComponent({
                     })
                   ]
                 )
+              ) : [],
+              // Point fill radial gradients (bright center → series color edge)
+              ...props.pointGradient ? reversedSeriesData.map(
+                (sd) => h(
+                  "radialGradient",
+                  {
+                    key: `point-grad-${sd.seriesKey}`,
+                    id: `${gradientPrefix}-point-${sd.seriesKey}`,
+                    cx: "0.5",
+                    cy: "0.5",
+                    r: "0.5"
+                  },
+                  [
+                    h("stop", {
+                      offset: "0%",
+                      "stop-color": `color-mix(in oklab, ${sd.color} 100%, white 30%)`
+                    }),
+                    h("stop", {
+                      offset: "70%",
+                      "stop-color": sd.color
+                    }),
+                    h("stop", {
+                      offset: "100%",
+                      "stop-color": `color-mix(in oklab, ${sd.color} 100%, black 12%)`
+                    })
+                  ]
+                )
+              ) : [],
+              // Stroke gradients (3-stop horizontal brightness ramp)
+              ...props.strokeGradient ? reversedSeriesData.map(
+                (sd) => h(
+                  "linearGradient",
+                  {
+                    key: `stroke-grad-${sd.seriesKey}`,
+                    id: `${gradientPrefix}-stroke-${sd.seriesKey}`,
+                    x1: "0",
+                    y1: "0",
+                    x2: "1",
+                    y2: "0"
+                  },
+                  [
+                    h("stop", {
+                      offset: "0%",
+                      "stop-color": `color-mix(in oklab, ${sd.color} 100%, white 12%)`
+                    }),
+                    h("stop", {
+                      offset: "50%",
+                      "stop-color": sd.color
+                    }),
+                    h("stop", {
+                      offset: "100%",
+                      "stop-color": `color-mix(in oklab, ${sd.color} 100%, black 8%)`
+                    })
+                  ]
+                )
               ) : []
             ]) : null,
             props.showGrid ? h(ChartGrid, {
@@ -468,11 +572,12 @@ var AreaChart = defineComponent({
               (sd) => h(
                 ChartSeries,
                 {
-                  key: `series-${sd.seriesIndex}`,
+                  key: sd.seriesKey,
                   data: sd.series.data,
                   name: sd.series.name,
                   type: "area",
                   opacity: sd.opacity,
+                  "data-series-key": sd.seriesKey,
                   class: classNames(
                     sd.series.className,
                     (props.hoverable || props.selectable) && "cursor-pointer",
@@ -489,17 +594,18 @@ var AreaChart = defineComponent({
                     // Area fill
                     h("path", {
                       d: sd.areaPath,
-                      fill: props.gradient ? `url(#${gradientPrefix}-${sd.seriesIndex})` : sd.fillColor,
+                      fill: props.gradient ? `url(#${gradientPrefix}-${sd.seriesKey})` : sd.fillColor,
                       "fill-opacity": props.gradient ? 1 : sd.fillOpacity,
                       stroke: "none",
                       class: "transition-opacity duration-300",
-                      "data-area-series": sd.seriesIndex
+                      "data-area-series": sd.seriesIndex,
+                      "data-series-key": sd.seriesKey
                     }),
                     // Line stroke
                     h("path", {
                       d: sd.linePath,
                       fill: "none",
-                      stroke: sd.color,
+                      stroke: props.strokeGradient ? `url(#${gradientPrefix}-stroke-${sd.seriesKey})` : sd.color,
                       "stroke-width": sd.strokeWidth,
                       "stroke-dasharray": props.animated ? sd.strokeDasharray ?? "1" : sd.strokeDasharray,
                       "stroke-dashoffset": props.animated ? "1" : void 0,
@@ -507,7 +613,7 @@ var AreaChart = defineComponent({
                       "stroke-linejoin": "round",
                       pathLength: props.animated ? 1 : void 0,
                       class: classNames(
-                        "transition-opacity duration-200",
+                        "transition-opacity [transition-duration:var(--tiger-motion-duration-base,200ms)]",
                         props.animated && "tiger-area-animated"
                       )
                     })
@@ -519,21 +625,26 @@ var AreaChart = defineComponent({
             ...seriesData.value.filter((sd) => sd.showPoints).map(
               (sd) => h(
                 "g",
-                { key: `points-${sd.seriesIndex}`, opacity: sd.opacity },
+                {
+                  key: `points-${sd.seriesKey}`,
+                  opacity: sd.opacity,
+                  "data-series-key": sd.seriesKey
+                },
                 sd.points.map((point) => {
                   const isHovered = hoveredPointInfo.value?.seriesIndex === sd.seriesIndex && hoveredPointInfo.value?.pointIndex === point.pointIndex;
                   const hoverSize = sd.pointSize + 2;
                   return h("circle", {
-                    key: `point-${sd.seriesIndex}-${point.pointIndex}`,
+                    key: `point-${sd.seriesKey}-${point.pointIndex}`,
                     cx: point.x,
                     cy: point.y,
                     r: isHovered ? hoverSize : sd.pointSize,
-                    fill: sd.pointHollow ? "white" : sd.pointColor,
+                    fill: sd.pointHollow ? "white" : props.pointGradient ? `url(#${gradientPrefix}-point-${sd.seriesKey})` : sd.pointColor,
                     stroke: sd.pointHollow ? sd.pointColor : "none",
                     "stroke-width": sd.pointHollow ? 2 : 0,
-                    class: "transition-all duration-200 ease-out",
+                    class: linePointTransitionClasses,
                     style: isHovered ? `filter: drop-shadow(0 0 4px ${sd.color})` : void 0,
                     "data-point-index": point.pointIndex,
+                    "data-series-key": sd.seriesKey,
                     onMouseenter: (e) => handlePointMouseEnter(sd.seriesIndex, point.pointIndex, e),
                     onMousemove: handlePointMouseMove,
                     onMouseleave: handlePointMouseLeave,
@@ -576,4 +687,7 @@ var AreaChart = defineComponent({
 });
 var AreaChart_default = AreaChart;
 
-export { AreaChart, AreaChart_default };
+export {
+  AreaChart,
+  AreaChart_default
+};

package/dist/{chunk-NHCCPMLC.mjs → chunk-NZUQ2KCW.mjs}

@@ -1,7 +1,40 @@
-import { defineComponent, computed, ref, h } from 'vue';
-import { getPaginationLabels, getTotalPages, validateCurrentPage, getPageRange, classNames, getPaginationContainerClasses, coerceClassValue, mergeStyleValues, defaultTotalText, getTotalTextClasses, getPaginationButtonBaseClasses, getSizeTextClasses, getPageNumbers, getPaginationEllipsisClasses, formatPageAriaLabel, getPaginationButtonActiveClasses, getPageSizeSelectorClasses, getQuickJumperInputClasses } from '@expcat/tigercat-core';
-
 // src/components/Pagination.ts
+import {
+  defineComponent,
+  computed,
+  ref,
+  watch,
+  onBeforeUnmount,
+  h
+} from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  mergeStyleValues,
+  getTotalPages,
+  getPageRange,
+  validateCurrentPage,
+  getPageNumbers,
+  defaultTotalText,
+  formatPaginationTotal,
+  getPaginationContainerClasses,
+  getPaginationButtonBaseClasses,
+  getPaginationButtonActiveClasses,
+  getPaginationEllipsisClasses,
+  getQuickJumperInputClasses,
+  getPageSizeSelectorClasses,
+  getTotalTextClasses,
+  getSizeTextClasses,
+  getPaginationLabels,
+  getLocaleDirection,
+  formatPageAriaLabel,
+  createPaginationIdleValidationScheduler,
+  getImmediateTigerLocale,
+  getPaginationJumperPage,
+  getValidatedPaginationJumperValue,
+  isLazyTigerLocale,
+  resolveTigerLocale
+} from "@expcat/tigercat-core";
 var Pagination = defineComponent({
   name: "TigerPagination",
   inheritAttrs: false,
@@ -148,6 +181,10 @@ var Pagination = defineComponent({
      * Locale configuration for i18n support
      */
     locale: {
+      type: [Object, Function],
+      default: void 0
+    },
+    quickJumperValidation: {
       type: Object,
       default: void 0
     }
@@ -157,10 +194,48 @@ var Pagination = defineComponent({
     const attrsRecord = attrs;
     const attrsClass = attrsRecord.class;
     const attrsStyle = attrsRecord.style;
-    const labels = computed(() => getPaginationLabels(props.locale));
+    const resolvedLocale = ref(
+      getImmediateTigerLocale(props.locale)
+    );
+    let localeResolveId = 0;
+    let disposed = false;
+    watch(
+      () => props.locale,
+      (locale) => {
+        const resolveId = ++localeResolveId;
+        const immediateLocale = getImmediateTigerLocale(locale);
+        resolvedLocale.value = immediateLocale;
+        if (!isLazyTigerLocale(locale)) return;
+        resolveTigerLocale(locale).then((nextLocale) => {
+          if (!disposed && resolveId === localeResolveId) {
+            resolvedLocale.value = nextLocale;
+          }
+        }).catch(() => {
+          if (!disposed && resolveId === localeResolveId) {
+            resolvedLocale.value = immediateLocale;
+          }
+        });
+      },
+      { immediate: true }
+    );
+    const labels = computed(() => getPaginationLabels(resolvedLocale.value));
+    const localeCode = computed(() => resolvedLocale.value?.locale);
+    const isRtl = computed(() => getLocaleDirection(resolvedLocale.value) === "rtl");
     const internalCurrent = ref(props.defaultCurrent);
     const internalPageSize = ref(props.defaultPageSize);
     const quickJumperValue = ref("");
+    let quickJumperValidationScheduler = createPaginationIdleValidationScheduler(props.quickJumperValidation);
+    watch(
+      () => props.quickJumperValidation,
+      (options) => {
+        quickJumperValidationScheduler.cancel();
+        quickJumperValidationScheduler = createPaginationIdleValidationScheduler(options);
+      }
+    );
+    onBeforeUnmount(() => {
+      disposed = true;
+      quickJumperValidationScheduler.cancel();
+    });
     const currentPage = computed(() => {
       return props.current !== void 0 ? props.current : internalCurrent.value;
     });
@@ -210,12 +285,19 @@ var Pagination = defineComponent({
       }
     };
     const handleQuickJumperSubmit = () => {
-      const page = parseInt(quickJumperValue.value, 10);
-      if (!isNaN(page)) {
+      quickJumperValidationScheduler.cancel();
+      const page = getPaginationJumperPage(quickJumperValue.value, totalPages.value);
+      if (page !== null) {
         handlePageChange(page);
       }
       quickJumperValue.value = "";
     };
+    const handleQuickJumperInput = (value) => {
+      quickJumperValue.value = value;
+      quickJumperValidationScheduler.schedule(() => {
+        quickJumperValue.value = getValidatedPaginationJumperValue(value, totalPages.value);
+      });
+    };
     const handleQuickJumperKeypress = (event) => {
       if (event.key === "Enter") {
         handleQuickJumperSubmit();
@@ -252,7 +334,7 @@ var Pagination = defineComponent({
       const prevDisabled = page <= 1 || props.disabled;
       const nextDisabled = page >= pages || props.disabled;
       if (props.showTotal) {
-        const totalTextFn = props.totalText || defaultTotalText;
+        const totalTextFn = props.totalText || (resolvedLocale.value?.pagination?.totalText ? (value, range) => formatPaginationTotal(labels.value.totalText, value, range, localeCode.value) : defaultTotalText);
         elements.push(
           h("span", { class: getTotalTextClasses(size) }, totalTextFn(props.total, pageRange.value))
         );
@@ -267,7 +349,7 @@ var Pagination = defineComponent({
             onClick: () => handlePageChange(page - 1),
             "aria-label": labels.value.prevPageAriaLabel
           },
-          "\u2039"
+          isRtl.value ? "\u203A" : "\u2039"
         )
       );
       if (props.simple) {
@@ -278,11 +360,7 @@ var Pagination = defineComponent({
         getPageNumbers(page, pages, props.showLessItems).forEach((pageNum) => {
           if (pageNum === "...") {
             elements.push(
-              h(
-                "span",
-                { class: getPaginationEllipsisClasses(size), "aria-hidden": "true" },
-                "..."
-              )
+              h("span", { class: getPaginationEllipsisClasses(size), "aria-hidden": "true" }, "...")
             );
           } else {
             const isActive = pageNum === page;
@@ -297,7 +375,11 @@ var Pagination = defineComponent({
                   ),
                   disabled: props.disabled,
                   onClick: () => handlePageChange(pageNum),
-                  "aria-label": formatPageAriaLabel(labels.value.pageAriaLabel, pageNum),
+                  "aria-label": formatPageAriaLabel(
+                    labels.value.pageAriaLabel,
+                    pageNum,
+                    localeCode.value
+                  ),
                   "aria-current": isActive ? "page" : void 0
                 },
                 String(pageNum)
@@ -316,7 +398,7 @@ var Pagination = defineComponent({
             onClick: () => handlePageChange(page + 1),
             "aria-label": labels.value.nextPageAriaLabel
           },
-          "\u203A"
+          isRtl.value ? "\u2039" : "\u203A"
         )
       );
       if (props.showSizeChanger) {
@@ -340,9 +422,7 @@ var Pagination = defineComponent({
       }
       if (props.showQuickJumper) {
         const sizeText = getSizeTextClasses(size);
-        elements.push(
-          h("span", { class: classNames("ml-2", sizeText) }, labels.value.jumpToText)
-        );
+        elements.push(h("span", { class: classNames("ml-2", sizeText) }, labels.value.jumpToText));
         elements.push(
           h("input", {
             type: "number",
@@ -350,7 +430,7 @@ var Pagination = defineComponent({
             disabled: props.disabled,
             value: quickJumperValue.value,
             onInput: (e) => {
-              quickJumperValue.value = e.target.value;
+              handleQuickJumperInput(e.target.value);
             },
             onKeydown: handleQuickJumperKeypress,
             min: 1,
@@ -382,4 +462,7 @@ var Pagination = defineComponent({
 });
 var Pagination_default = Pagination;
 
-export { Pagination, Pagination_default };
+export {
+  Pagination,
+  Pagination_default
+};