pxd 0.0.61 → 0.0.62

package/dist/composables/use-swipe-gesture.d.ts

@@ -0,0 +1,65 @@
+import type { MaybeElementRef } from '../types/shared';
+import type { MaybeRefOrGetter } from 'vue';
+export type SwipeDirection = 'left' | 'right' | 'top' | 'bottom';
+export interface SwipePressState {
+    size: number;
+}
+export interface SwipeFollowState {
+    /** Movement since the previous event along the active axis (px). */
+    delta: number;
+    /** Velocity (px / ms) since the previous event along the active axis. */
+    velocity: number;
+    /** `displacement / containerSize` — signed ratio, typically in the range of -1 to 1. */
+    offset: number;
+    /** Signed displacement from the start point along the active axis (px). */
+    displacement: number;
+}
+export interface SwipeReleaseState {
+    /** Whether the gesture qualified as a successful swipe (by velocity or distance). */
+    swiped: boolean;
+    /** Physical swipe direction. `undefined` when `swiped` is `false`. */
+    direction?: SwipeDirection;
+}
+export interface SwipeGestureOptions {
+    disabled?: MaybeRefOrGetter<boolean>;
+    /**
+     * CSS selector for the drag handle element within the container.
+     * When set, gesture events bind to this element instead of the container,
+     * preventing interference with scrollable content inside the container.
+     */
+    handleSelector?: string;
+    /**
+     * Swipe axis. Reactive — accepts a ref or getter.
+     * @default 'horizontal'
+     */
+    direction?: MaybeRefOrGetter<'horizontal' | 'vertical'>;
+    /**
+     * Minimum swipe distance (px) for a successful swipe.
+     * @default 10
+     */
+    swipeThreshold?: number;
+    /**
+     * Fraction of the container size (0–1) the finger must travel
+     * for a slow-drag to count as a successful swipe.
+     * @default 0.35
+     */
+    distanceThreshold?: number;
+    /**
+     * Minimum velocity (px / ms) for a quick-flick to count as a swipe,
+     * regardless of distance traveled.
+     * @default 0.3
+     */
+    velocityThreshold?: number;
+    /** Fires when the pointer touches down and the gesture begins. */
+    onPress?: (state: SwipePressState) => void;
+    /** Fires continuously while the pointer moves. */
+    onFollow?: (state: SwipeFollowState) => void;
+    /**
+     * Fires on pointer-up or pointer-cancel.
+     * Check `state.swiped` to decide whether to commit the transition or snap back.
+     */
+    onRelease?: (state: SwipeReleaseState) => void;
+}
+export declare function useSwipeGesture(containerRef: MaybeElementRef<HTMLElement>, options?: SwipeGestureOptions): {
+    stop: () => void;
+};

package/dist/composables/use-swipe-gesture.js

@@ -0,0 +1,99 @@
+import Core from "@any-touch/core";
+import Pan from "@any-touch/pan";
+import { onScopeDispose, watch } from "vue";
+import { toValue, unrefElement } from "../utils/ref.js";
+export function useSwipeGesture(containerRef, options = {}) {
+  const {
+    handleSelector,
+    distanceThreshold = 0.35,
+    velocityThreshold = 0.3,
+    swipeThreshold = 10,
+    onPress,
+    onFollow,
+    onRelease
+  } = options;
+  let at = null;
+  function isHorizontal() {
+    return (toValue(options.direction) ?? "horizontal") === "horizontal";
+  }
+  function resolveDirection(displacement, horizontal) {
+    return horizontal ? displacement > 0 ? "right" : "left" : displacement > 0 ? "bottom" : "top";
+  }
+  function bind() {
+    const container = unrefElement(containerRef);
+    if (!container) {
+      return;
+    }
+    const handle = handleSelector ? container.querySelector(handleSelector) : container;
+    if (!handle) {
+      return;
+    }
+    at = new Core(handle);
+    at.use(Pan, { threshold: swipeThreshold });
+    let containerSize = 0;
+    at.on("panstart", () => {
+      const h = isHorizontal();
+      containerSize = h ? container.offsetWidth : container.offsetHeight;
+      onPress?.({ size: containerSize });
+    });
+    at.on("panmove", (e) => {
+      const h = isHorizontal();
+      const displacement = h ? e.displacementX : e.displacementY;
+      const delta = h ? e.deltaX : e.deltaY;
+      const velocity = h ? e.velocityX : e.velocityY;
+      onFollow?.({
+        delta,
+        velocity,
+        displacement,
+        offset: containerSize > 0 ? displacement / containerSize : 0
+      });
+    });
+    at.on("panend", (e) => {
+      const h = isHorizontal();
+      const displacement = h ? e.displacementX : e.displacementY;
+      const velocity = h ? e.velocityX : e.velocityY;
+      if (containerSize === 0 || displacement === 0) {
+        onRelease?.({ swiped: false });
+        return;
+      }
+      const meetsVelocity = velocity >= velocityThreshold;
+      const meetsDistance = Math.abs(displacement) / containerSize >= distanceThreshold;
+      if (meetsVelocity || meetsDistance) {
+        onRelease?.({ swiped: true, direction: resolveDirection(displacement, h) });
+      } else {
+        onRelease?.({ swiped: false });
+      }
+    });
+    at.on("pancancel", () => {
+      onRelease?.({ swiped: false });
+    });
+  }
+  function unbind() {
+    if (!at) {
+      return;
+    }
+    at.destroy();
+    at = null;
+  }
+  function stop() {
+    unwatch();
+    unbind();
+  }
+  const unwatch = watch(
+    () => [unrefElement(containerRef), toValue(options.disabled)],
+    ([el, disabled]) => {
+      if (!el || disabled) {
+        unbind();
+        return;
+      }
+      bind();
+    },
+    { immediate: true }
+  );
+  onScopeDispose(() => {
+    stop();
+  });
+  return {
+    stop
+  };
+}

package/dist/composables/use-virtual-list.d.ts

@@ -11,6 +11,8 @@ export interface VirtualListOptions {
     listData?: any[];
     itemSize?: number;
     overScan?: number;
+    columnGap?: number;
+    columnCount?: number;
     onBottom?: () => void | Promise<void>;
     bottomThreshold?: number;
 }
@@ -18,8 +20,8 @@ export declare function useVirtualList<Options extends VirtualListOptions>(conta
     virtualItems: import("vue").ComputedRef<VirtualListItem[]>;
     totalSize: import("vue").ComputedRef<number>;
     measureElement: (el: Element | ComponentPublicInstance | null) => void;
-    scrollToIndex: any;
-    scrollToOffset: any;
-    scrollBy: any;
+    scrollToIndex: (index: number, { align: initialAlign, behavior, }?: import("@tanstack/virtual-core").ScrollToOptions) => void;
+    scrollToOffset: (toOffset: number, { align, behavior }?: import("@tanstack/virtual-core").ScrollToOptions) => void;
+    scrollBy: (delta: number, { behavior }?: import("@tanstack/virtual-core").ScrollToOptions) => void;
     getVirtualizer: () => Virtualizer<HTMLElement, HTMLElement>;
 };

package/dist/composables/use-virtual-list.js

@@ -4,12 +4,14 @@ import {
   observeElementRect,
   Virtualizer
 } from "@tanstack/virtual-core";
-import { computed, onMounted, onUnmounted, shallowRef, watch } from "vue";
+import { computed, onMounted, onScopeDispose, watch, shallowRef } from "vue";
 import { toValue } from "../utils/ref.js";
 const DEFAULTS = {
   status: "",
   itemSize: 50,
-  overScan: 2
+  overScan: 2,
+  columnGap: 0,
+  columnCount: 1
 };
 export function useVirtualList(containerRef, options) {
   let reachBottomFired = false;
@@ -31,6 +33,9 @@ export function useVirtualList(containerRef, options) {
     estimateSize: () => options.itemSize ?? DEFAULTS.itemSize,
     getItemKey,
     overscan: options.overScan ?? DEFAULTS.overScan,
+    lanes: options.columnCount ?? DEFAULTS.columnCount,
+    gap: options.columnGap ?? DEFAULTS.columnGap,
+    laneAssignmentMode: "measured",
     observeElementRect,
     observeElementOffset,
     scrollToFn: elementScroll,
@@ -54,7 +59,7 @@ export function useVirtualList(containerRef, options) {
       if (scrollBottom >= totalSize2 - threshold) {
         if (!reachBottomFired) {
           reachBottomFired = true;
-          onBottom();
+          void onBottom();
         }
       } else {
         reachBottomFired = false;
@@ -69,33 +74,39 @@ export function useVirtualList(containerRef, options) {
     void triggerVersion.value;
     return virtualizer.getTotalSize();
   });
+  function measureElement(el) {
+    if (!el) {
+      virtualizer.measureElement(null);
+      return;
+    }
+    const htmlEl = el instanceof HTMLElement ? el : el.$el;
+    virtualizer.measureElement(htmlEl);
+  }
   function updateVirtualizer() {
     virtualizer.setOptions({
       ...virtualizer.options,
       count: options.listData?.length ?? 0,
       estimateSize: () => options.itemSize ?? DEFAULTS.itemSize,
-      getItemKey
+      getItemKey,
+      lanes: options.columnCount ?? DEFAULTS.columnCount,
+      gap: options.columnGap ?? DEFAULTS.columnGap
     });
     virtualizer._willUpdate();
     triggerVersion.value++;
   }
-  watch(() => [options.itemSize, options.dataKey], updateVirtualizer);
+  watch(
+    () => [options.itemSize, options.dataKey, options.columnCount, options.columnGap],
+    updateVirtualizer
+  );
   watch(() => [options.listData, options.listData?.length], updateVirtualizer);
   onMounted(() => {
     virtualizer._willUpdate();
     cleanup = virtualizer._didMount();
   });
-  onUnmounted(() => {
+  onScopeDispose(() => {
     cleanup?.();
+    cleanup = void 0;
   });
-  function measureElement(el) {
-    if (!el) {
-      virtualizer.measureElement(null);
-      return;
-    }
-    const htmlEl = el instanceof HTMLElement ? el : el.$el;
-    virtualizer.measureElement(htmlEl);
-  }
   return {
     virtualItems,
     totalSize,

package/dist/composables/use-window-size.js

@@ -1,4 +1,4 @@
-import { onBeforeUnmount, onMounted, shallowRef } from "vue";
+import { onScopeDispose, onMounted, shallowRef } from "vue";
 import { cachedOn, cachedOff } from "../utils/event.js";
 import { isServer } from "../utils/is.js";
 export function useWindowSize() {
@@ -16,7 +16,7 @@ export function useWindowSize() {
     cachedOn(window, "resize", updateSize);
     cachedOn(window, "orientationchange", updateSize);
   });
-  onBeforeUnmount(() => {
+  onScopeDispose(() => {
     cachedOff(window, "resize", updateSize);
     cachedOff(window, "orientationchange", updateSize);
   });

package/dist/constants/size.d.ts

@@ -0,0 +1,12 @@
+export declare const BASIC_HEIGHTS: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+};
+export declare const BASIC_MIN_HEIGHTS: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+};

package/dist/constants/size.js

@@ -0,0 +1,12 @@
+export const BASIC_HEIGHTS = {
+  xs: "h-6",
+  sm: "h-7.5",
+  md: "h-9",
+  lg: "h-11"
+};
+export const BASIC_MIN_HEIGHTS = {
+  xs: "min-h-6",
+  sm: "min-h-7.5",
+  md: "min-h-9",
+  lg: "min-h-11"
+};

package/dist/contexts/button.d.ts

@@ -0,0 +1,5 @@
+import type { ButtonGroupProps } from '../components/button-group/types';
+export interface ButtonGroupContext {
+    props: ButtonGroupProps;
+}
+export declare const provideButtonGroupContext: (contextValue: ButtonGroupContext) => ButtonGroupContext, useButtonGroupContext: (fallback?: ButtonGroupContext | null | undefined) => ButtonGroupContext | null;

package/dist/contexts/button.js

@@ -0,0 +1,5 @@
+import { createContext } from "../utils/context.js";
+export const [provideButtonGroupContext, useButtonGroupContext] = createContext(
+  "ButtonGroup",
+  null
+);

package/dist/contexts/carousel.d.ts

@@ -2,11 +2,12 @@ import type { CarouselProps } from '../components/carousel/types';
 import type { Ref } from 'vue';
 export interface CarouselState {
     uid: string;
-    translateItem: (index: number, activeIndex: number) => void;
+    updateItemIndex: (index: number) => void;
 }
 export interface CarouselContext {
     props: CarouselProps;
     carousels: Ref<CarouselState[]>;
+    virtualIndex: Ref<number>;
     registerCarousel: (state: CarouselState) => void;
     unregisterCarousel: (id: string) => void;
 }

package/dist/contexts/list.d.ts

@@ -1,8 +1,28 @@
 import type { ListOption } from '../components/list/types';
-import type { Ref } from 'vue';
+import type { ComputedRef, Ref } from 'vue';
 export interface ListContext {
-    activeValue: Ref<string>;
+    activeIndex: Ref<number>;
+    registerItem: (el: HTMLElement, indexRef: Ref<number>) => void;
+    unregisterItem: (el: HTMLElement) => void;
     onOptionClick: ListOption['onClick'];
 }
 export declare const provideListContext: (contextValue: ListContext) => ListContext, useListContext: ((fallback?: ListContext | undefined) => ListContext) & ((fallback: null) => ListContext | null);
-export declare const provideListFilterValue: (contextValue: Ref<string, string>) => Ref<string, string>, useListFilterValue: (fallback?: Ref<string, string> | null | undefined) => Ref<string, string> | null;
+export interface ListFilterItemPayload {
+    groupId: string | null;
+    getValue: () => string;
+    getKeywords: () => string[];
+}
+export interface ListFilterContext {
+    searchValue: Ref<string>;
+    visibleCount: ComputedRef<number>;
+    isItemVisible: (id: string) => boolean;
+    isGroupVisible: (id: string) => boolean;
+    registerItem: (id: string, payload: ListFilterItemPayload) => void;
+    unregisterItem: (id: string) => void;
+}
+export declare const provideListFilterContext: (contextValue: ListFilterContext) => ListFilterContext, useListFilterContext: (fallback?: ListFilterContext | null | undefined) => ListFilterContext | null;
+/**
+ * Provided by group containers so nested list items know which group to
+ * register into.
+ */
+export declare const provideListFilterGroupId: (contextValue: string) => string, useListFilterGroupId: (fallback?: string | null | undefined) => string | null;

package/dist/contexts/list.js

@@ -1,6 +1,10 @@
 import { createContext } from "../utils/context.js";
 export const [provideListContext, useListContext] = createContext("List");
-export const [provideListFilterValue, useListFilterValue] = createContext(
-  "ListFilterValue",
+export const [provideListFilterContext, useListFilterContext] = createContext(
+  "ListFilter",
+  null
+);
+export const [provideListFilterGroupId, useListFilterGroupId] = createContext(
+  "ListFilterGroupId",
   null
 );

package/dist/contexts/resizable.d.ts

@@ -1,15 +1,8 @@
-import type { ComponentDirection } from '../types/shared/props';
+import type { ResizableProps } from '../components/resizable/types';
 import type { Ref } from 'vue';
-interface PanelConfig {
-    id: string;
-    order: number;
-    size?: number | null;
-    minSize?: number;
-}
 export interface ResizableContext {
-    direction: Ref<ComponentDirection>;
-    panelSizes: Ref<number[]>;
-    panelConfigs: Ref<PanelConfig[]>;
+    props: ResizableProps;
+    panelSizes: Ref<Record<string, number>>;
     getPanelSize: (id: string) => number;
     onHandleDrag: (id: string, delta: {
         deltaX: number;
@@ -32,4 +25,3 @@ export interface ResizableContext {
     unregisterHandle: (id: string) => void;
 }
 export declare const provideResizableContext: (contextValue: ResizableContext) => ResizableContext, useResizableContext: ((fallback?: ResizableContext | undefined) => ResizableContext) & ((fallback: null) => ResizableContext | null);
-export {};

package/dist/contexts/tabs.d.ts

@@ -0,0 +1,15 @@
+import type { TabsEmits, TabsProps, TabsValue } from '../components/tabs/types';
+import type { ComponentLabel } from '../types/shared';
+import type { EmitFn, Slots } from 'vue';
+export interface TabsItemState {
+    id: string;
+    value: TabsValue;
+    label?: ComponentLabel;
+    disabled?: boolean;
+    slots: Slots;
+}
+export interface TabsContext {
+    props: TabsProps;
+    emits: EmitFn<TabsEmits>;
+}
+export declare const provideTabsContext: (contextValue: TabsContext) => TabsContext, useTabsContext: ((fallback?: TabsContext | undefined) => TabsContext) & ((fallback: null) => TabsContext | null);

package/dist/contexts/tabs.js

@@ -0,0 +1,2 @@
+import { createContext } from "../utils/context.js";
+export const [provideTabsContext, useTabsContext] = createContext("Tabs");

package/dist/locales/en-us.d.ts

@@ -31,14 +31,14 @@ declare const _default: {
         next: string;
         prev: string;
     };
-    empty: {
-        search: string;
-        noData: string;
-    };
     confirm: {
         ok: string;
         conform: string;
         cancel: string;
     };
+    results: {
+        searchText: string;
+        noData: string;
+    };
 };
 export default _default;

package/dist/locales/en-us.js

@@ -31,13 +31,13 @@ export default {
     next: "Next",
     prev: "Previous"
   },
-  empty: {
-    search: "No results found for",
-    noData: "No data available"
-  },
   confirm: {
     ok: "OK",
     conform: "Confirm",
     cancel: "Cancel"
+  },
+  results: {
+    searchText: "No results found for",
+    noData: "No data available"
   }
 };

package/dist/locales/zh-cn.d.ts

@@ -31,14 +31,14 @@ declare const _default: {
         next: string;
         prev: string;
     };
-    empty: {
-        search: string;
-        noData: string;
-    };
     confirm: {
         ok: string;
         conform: string;
         cancel: string;
     };
+    results: {
+        searchText: string;
+        noData: string;
+    };
 };
 export default _default;

package/dist/locales/zh-cn.js

@@ -31,13 +31,13 @@ export default {
     next: "\u4E4B\u540E",
     prev: "\u4E4B\u524D"
   },
-  empty: {
-    search: "\u672A\u627E\u5230\u7ED3\u679C",
-    noData: "\u6682\u65E0\u6570\u636E"
-  },
   confirm: {
     ok: "\u786E\u5B9A",
     conform: "\u786E\u8BA4",
     cancel: "\u53D6\u6D88"
+  },
+  results: {
+    searchText: "\u672A\u627E\u5230\u7ED3\u679C\uFF1A",
+    noData: "\u6682\u65E0\u6570\u636E"
   }
 };

package/dist/plugins/dayjs-millisecond-token.js

@@ -16,7 +16,7 @@ function processFormat(ms, formatStr, maxDigits) {
   const msValue = normalizeMilliseconds(ms);
   return replaceToken(formatStr, msValue, maxDigits);
 }
-const millisecondTokenPlugin = (options = {}, DayjsClass, dayjsFactory) => {
+const millisecondTokenPlugin = (options, DayjsClass, dayjsFactory) => {
   const maxDigits = Math.max(1, Math.min(3, options?.maxDigits ?? 3));
   const originalFormat = DayjsClass.prototype.format;
   const originalDurationFormat = dayjsFactory.duration?.(0)?.format;