@expcat/tigercat-vue 2.1.2 → 2.1.4

package/dist/{chunk-HS4YQGZQ.mjs → chunk-SZO4WL42.mjs}

@@ -1,5 +1,12 @@
 // src/components/VirtualList.ts
-import { defineComponent, h, ref, computed, onMounted, onUpdated } from "vue";
+import {
+  defineComponent,
+  h,
+  ref,
+  computed,
+  onMounted,
+  onUpdated
+} from "vue";
 import {
   virtualListContainerClasses,
   virtualListInnerClasses,
@@ -7,10 +14,12 @@ import {
   variableSizeStrategy,
   dynamicSizeStrategy,
   classNames,
-  coerceClassValue
+  coerceClassValue,
+  mergeStyleValues
 } from "@expcat/tigercat-core";
 var VirtualList = defineComponent({
   name: "TigerVirtualList",
+  inheritAttrs: false,
   props: {
     itemCount: { type: Number, default: 0 },
     itemHeight: { type: Number, default: 40 },
@@ -25,34 +34,48 @@ var VirtualList = defineComponent({
     },
     height: { type: Number, default: 400 },
     overscan: { type: Number, default: 5 },
-    /** Custom class name (merged with the `class` attribute) */
-    className: { type: String, default: void 0 }
+    getItemKey: {
+      type: Function,
+      default: void 0
+    },
+    ariaLabel: { type: String, default: void 0 },
+    className: { type: String, default: void 0 },
+    role: { type: String, default: "list" }
   },
   emits: ["scroll"],
-  setup(props, { emit, attrs, slots }) {
+  setup(props, { emit, attrs, slots, expose }) {
     const scrollTop = ref(0);
     const measureVersion = ref(0);
     const containerRef = ref(null);
     const itemEls = /* @__PURE__ */ new Map();
-    const isDynamic = computed(
-      () => !props.sizeStrategy && !props.getItemHeight && props.estimatedItemHeight !== void 0
-    );
+    let dynamicHeld = null;
+    let heldEstimated;
     const strategy = computed(() => {
-      if (props.sizeStrategy) return props.sizeStrategy;
+      if (props.sizeStrategy) {
+        dynamicHeld = null;
+        return props.sizeStrategy;
+      }
       if (props.getItemHeight) {
+        dynamicHeld = null;
         return variableSizeStrategy(props.getItemHeight, props.itemCount);
       }
       if (props.estimatedItemHeight !== void 0) {
-        return dynamicSizeStrategy(props.estimatedItemHeight, props.itemCount);
+        if (!dynamicHeld || heldEstimated !== props.estimatedItemHeight) {
+          dynamicHeld = dynamicSizeStrategy(props.estimatedItemHeight, props.itemCount);
+          heldEstimated = props.estimatedItemHeight;
+        }
+        return dynamicHeld;
       }
+      dynamicHeld = null;
       return fixedSizeStrategy(props.itemHeight);
     });
+    const canMeasure = computed(() => typeof strategy.value.updateItemHeight === "function");
     const range = computed(() => {
       void measureVersion.value;
       return strategy.value.getRange(scrollTop.value, props.height, props.itemCount, props.overscan);
     });
-    function measureDynamic() {
-      if (!isDynamic.value) return;
+    function measureVisible() {
+      if (!canMeasure.value) return;
       const strat = strategy.value;
       if (!strat.updateItemHeight) return;
       let changed = false;
@@ -65,31 +88,59 @@ var VirtualList = defineComponent({
       });
       if (changed) measureVersion.value += 1;
     }
-    onMounted(measureDynamic);
-    onUpdated(measureDynamic);
-    function handleScroll() {
-      if (containerRef.value) {
-        scrollTop.value = containerRef.value.scrollTop;
-        emit("scroll", scrollTop.value);
+    onMounted(measureVisible);
+    onUpdated(measureVisible);
+    function applyScrollTop(next) {
+      const offset = Math.max(0, next);
+      if (containerRef.value && containerRef.value.scrollTop !== offset) {
+        containerRef.value.scrollTop = offset;
+      }
+      scrollTop.value = offset;
+      emit("scroll", offset);
+    }
+    const handle = {
+      scrollToIndex(index) {
+        const safe = Number.isFinite(index) ? Math.floor(index) : 0;
+        const clamped = Math.max(0, Math.min(Math.max(props.itemCount - 1, 0), safe));
+        applyScrollTop(strategy.value.getItemOffset(clamped));
+      },
+      scrollToOffset(offset) {
+        applyScrollTop(Number.isFinite(offset) ? offset : 0);
+      },
+      getScrollElement() {
+        return containerRef.value;
       }
+    };
+    expose(handle);
+    function handleScroll() {
+      if (!containerRef.value) return;
+      const st = containerRef.value.scrollTop;
+      scrollTop.value = st;
+      emit("scroll", st);
     }
     return () => {
-      const { startIndex, endIndex, totalHeight } = range.value;
+      const { startIndex, endIndex, totalHeight, offsetTop } = range.value;
       const currentStrategy = strategy.value;
       const items = [];
-      const dynamic = isDynamic.value;
+      const dynamic = canMeasure.value;
+      const asList = props.role === "list";
       if (dynamic) itemEls.clear();
       for (let i = startIndex; i <= endIndex; i++) {
         const itemH = currentStrategy.getItemHeight(i);
         const slotContent = slots.default?.({ index: i });
         const index = i;
+        const key = props.getItemKey ? props.getItemKey(i) : i;
         items.push(
           h(
             "div",
             {
-              key: index,
-              // Auto height in dynamic mode so real content height is measurable.
-              style: dynamic ? { width: "100%" } : { height: `${itemH}px`, width: "100%" },
+              key,
+              ...asList ? {
+                role: "listitem",
+                "aria-setsize": props.itemCount,
+                "aria-posinset": index + 1
+              } : {},
+              style: dynamic ? { width: "100%" } : { height: `${itemH}px`, width: "100%", overflow: "hidden" },
               ref: dynamic ? (el) => {
                 if (el)
                   itemEls.set(index, el.$el ?? el);
@@ -100,17 +151,22 @@ var VirtualList = defineComponent({
           )
         );
       }
-      const offsetTop = startIndex >= 0 ? currentStrategy.getItemOffset(startIndex) : 0;
+      const { class: attrClass, style: attrStyle, ...restAttrs } = attrs;
+      const namedAriaLabel = props.ariaLabel ?? (typeof restAttrs["aria-label"] === "string" ? restAttrs["aria-label"] : void 0);
       return h(
         "div",
         {
+          ...restAttrs,
           ref: containerRef,
+          role: props.role,
+          tabindex: 0,
+          "aria-label": namedAriaLabel,
           class: classNames(
             virtualListContainerClasses,
             props.className,
-            coerceClassValue(attrs.class)
+            coerceClassValue(attrClass)
           ),
-          style: { height: `${props.height}px` },
+          style: mergeStyleValues(attrStyle, { height: `${props.height}px` }),
           onScroll: handleScroll
         },
         [

package/dist/{chunk-TBOXTAIA.mjs → chunk-T2ESVQNC.mjs}

@@ -1,15 +1,20 @@
+import {
+  getGlobalTigerLocale,
+  useTigerConfig
+} from "./chunk-4GOTWNOO.mjs";
+
 // src/components/LoadingBarContainer.ts
 import { computed, defineComponent, h } from "vue";
 import {
   classNames,
   coerceClassValue,
-  DEFAULT_LOADING_BAR_ARIA_LABEL,
   DEFAULT_LOADING_BAR_COLOR,
   DEFAULT_LOADING_BAR_HEIGHT,
   getLoadingBarContainerClasses,
   getLoadingBarFillClasses,
   getLoadingBarFillStyle,
-  LOADING_BAR_CONTAINER_ID,
+  getLoadingBarProgressValue,
+  getLoadingLabel,
   mergeStyleValues
 } from "@expcat/tigercat-core";
 var LoadingBarContainer = /* @__PURE__ */ defineComponent({
@@ -46,23 +51,43 @@ var LoadingBarContainer = /* @__PURE__ */ defineComponent({
     }
   },
   setup(props, { attrs }) {
+    const config = useTigerConfig();
     const containerClasses = computed(
       () => getLoadingBarContainerClasses(classNames(props.className, coerceClassValue(attrs.class)))
     );
     const fillClasses = computed(() => getLoadingBarFillClasses(props.status, props.color));
     const fillStyle = computed(() => getLoadingBarFillStyle(props.percentage, props.height));
     const resolvedAriaLabel = computed(
-      () => props.ariaLabel?.trim() || DEFAULT_LOADING_BAR_ARIA_LABEL
+      () => getLoadingLabel(config.value.locale ?? getGlobalTigerLocale(), props.ariaLabel)
     );
+    const valueNow = computed(() => getLoadingBarProgressValue(props.percentage));
     return () => {
       const isBusy = props.status === "loading";
+      const {
+        role: _role,
+        "aria-label": _ariaLabel,
+        "aria-live": _ariaLive,
+        "aria-atomic": _ariaAtomic,
+        "aria-busy": _ariaBusy,
+        "aria-valuenow": _ariaValueNow,
+        "aria-valuemin": _ariaValueMin,
+        "aria-valuemax": _ariaValueMax,
+        class: _class,
+        style: attrStyle,
+        ...domAttrs
+      } = attrs;
       return h(
         "div",
         {
-          ...attrs,
+          ...domAttrs,
           class: containerClasses.value,
-          style: mergeStyleValues(attrs.style, props.style, { height: `${props.height}px` }),
-          id: LOADING_BAR_CONTAINER_ID,
+          style: mergeStyleValues(attrStyle, props.style, { height: `${props.height}px` }),
+          role: "progressbar",
+          "aria-label": resolvedAriaLabel.value,
+          "aria-valuemin": 0,
+          "aria-valuemax": 100,
+          "aria-valuenow": valueNow.value,
+          "aria-busy": isBusy ? "true" : void 0,
           "data-tiger-loading-bar-container": "",
           "data-tiger-loading-bar-status": props.status
         },
@@ -70,14 +95,6 @@ var LoadingBarContainer = /* @__PURE__ */ defineComponent({
           h("div", {
             class: fillClasses.value,
             style: fillStyle.value,
-            role: "progressbar",
-            "aria-label": resolvedAriaLabel.value,
-            "aria-valuemin": 0,
-            "aria-valuemax": 100,
-            "aria-valuenow": Math.round(props.percentage),
-            "aria-busy": isBusy ? "true" : void 0,
-            "aria-live": "polite",
-            "aria-atomic": "true",
             "data-tiger-loading-bar": "",
             "data-tiger-loading-bar-status": props.status
           })

package/dist/{chunk-M7EBWJZ5.mjs → chunk-T5UGCVQW.mjs}

@@ -1,11 +1,15 @@
 // src/components/Space.ts
 import { defineComponent, computed, h } from "vue";
 import {
+  classNames,
+  coerceClassValue,
+  mergeStyleValues,
   getSpaceClasses,
   getSpaceStyle
 } from "@expcat/tigercat-core";
 var Space = defineComponent({
   name: "TigerSpace",
+  inheritAttrs: false,
   props: {
     direction: {
       type: String,
@@ -22,20 +26,32 @@ var Space = defineComponent({
     wrap: {
       type: Boolean,
       default: false
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
     }
   },
   setup(props, { slots, attrs }) {
     const classes = computed(() => getSpaceClasses(props));
-    const style = computed(() => getSpaceStyle(props.size));
-    return () => h(
-      "div",
-      {
-        ...attrs,
-        class: [classes.value, attrs.class],
-        style: [style.value, attrs.style]
-      },
-      slots.default?.()
-    );
+    const gapStyle = computed(() => getSpaceStyle(props.size));
+    return () => {
+      const attrsRecord = attrs;
+      return h(
+        "div",
+        {
+          ...attrs,
+          class: classNames(classes.value, props.className, coerceClassValue(attrsRecord.class)),
+          style: mergeStyleValues(gapStyle.value, attrsRecord.style, props.style),
+          "data-tiger-space": ""
+        },
+        slots.default?.()
+      );
+    };
   }
 });
 var Space_default = Space;