@wyxos/vibe 3.0.4 → 3.0.6

package/lib/components/viewer-core/useMasonryList.d.ts

@@ -13,12 +13,10 @@ export declare function useVibeMasonryList(options: {
     commitPendingAppend: Ref<(() => void | Promise<void>) | null | undefined>;
     requestNextPage: Ref<(() => void | Promise<void>) | null | undefined>;
     requestPreviousPage: Ref<(() => void | Promise<void>) | null | undefined>;
-    restoreToken: Ref<number>;
     setActiveIndex: (index: number) => void;
 }): {
     columnWidth: import("vue").ComputedRef<number>;
     containerHeight: import("vue").ComputedRef<number>;
-    footerStatusMessage: import("vue").ComputedRef<"Loading the first page" | "Loading more items" | "End of list" | null>;
     getCardStyle: (index: number) => {
         height: string;
         width: string;
@@ -26,10 +24,44 @@ export declare function useVibeMasonryList(options: {
         transitionDelay: string | undefined;
         transform: string;
     };
+    getLeavingCardStyle: (item: VibeViewerItem) => {
+        opacity: string;
+        transform: string;
+        transition: string;
+        height?: undefined;
+        width?: undefined;
+    } | {
+        height: string;
+        opacity: string;
+        transform: string;
+        transition: string;
+        width: string;
+    };
     getScrollbarThumbStyle: () => {
         height: string;
         transform: string;
     };
+    leavingItems: import("vue").ComputedRef<{
+        height: number;
+        item: {
+            [x: string]: unknown;
+            id: string;
+            type: import("../viewer").VibeViewerType;
+            title?: string | undefined;
+            url: string;
+            preview?: {
+                url: string;
+                width?: number | undefined;
+                height?: number | undefined;
+            } | undefined;
+            width?: number | undefined;
+            height?: number | undefined;
+        };
+        position: {
+            x: number;
+            y: number;
+        };
+    }[]>;
     onScroll: () => void;
     onWheel: (event: WheelEvent) => void;
     paginationLabel: import("vue").ComputedRef<string>;

package/lib/components/viewer-core/useMasonryMotion.d.ts

@@ -2,8 +2,14 @@ import { type ComputedRef, type Ref } from 'vue';
 import type { VibeViewerItem } from '../viewer';
 import type { LayoutPosition } from './masonryLayout';
 export type VibeMasonryEnterDirection = 'bottom' | 'top';
+export interface VibeMasonryLeavingItem {
+    height: number;
+    item: VibeViewerItem;
+    position: LayoutPosition;
+}
 export declare function getVibeMasonryEnterOrder(itemIds: string[], direction: VibeMasonryEnterDirection): string[];
 export declare function getVibeMasonryEnterDuration(itemCount: number): number;
+export declare function getVibeMasonryLeaveDuration(): number;
 export declare function getVibeMasonryEnterStartY(options: {
     direction: VibeMasonryEnterDirection;
     itemHeight: number;
@@ -24,6 +30,41 @@ export declare function useMasonryMotion(options: {
     getCardTransform: (index: number) => string;
     getCardTransition: (itemId: string) => string | undefined;
     getCardTransitionDelay: (itemId: string) => string | undefined;
+    getLeavingCardStyle: (item: VibeViewerItem) => {
+        opacity: string;
+        transform: string;
+        transition: string;
+        height?: undefined;
+        width?: undefined;
+    } | {
+        height: string;
+        opacity: string;
+        transform: string;
+        transition: string;
+        width: string;
+    };
+    leavingItems: ComputedRef<{
+        height: number;
+        item: {
+            [x: string]: unknown;
+            id: string;
+            type: import("../viewer").VibeViewerType;
+            title?: string | undefined;
+            url: string;
+            preview?: {
+                url: string;
+                width?: number | undefined;
+                height?: number | undefined;
+            } | undefined;
+            width?: number | undefined;
+            height?: number | undefined;
+        };
+        position: {
+            x: number;
+            y: number;
+        };
+    }[]>;
     markEnter: (items: VibeViewerItem[], direction?: VibeMasonryEnterDirection) => void;
+    markLeave: (items: VibeMasonryLeavingItem[]) => void;
     playFlipMoveAnimation: (oldPositionsById: Map<string, LayoutPosition>, skipIds?: Set<string>, durationMs?: number) => void;
 };

package/lib/components/viewer-core/useSurfaceEmptyState.d.ts

@@ -0,0 +1,15 @@
+import { type Ref } from 'vue';
+import type { VibeEmptyStateMode, VibeEmptyStateSlotProps } from './surfaceSlots';
+export declare const DEFAULT_VIBE_EMPTY_STATE_MESSAGE = "no items available";
+export declare function useSurfaceEmptyState(options: {
+    emptyStateMode: Ref<VibeEmptyStateMode | undefined>;
+    itemCount: Ref<number>;
+    loading: Ref<boolean | undefined>;
+    renderSlot?: ((props: VibeEmptyStateSlotProps) => unknown) | undefined;
+    surface: VibeEmptyStateSlotProps['surface'];
+}): {
+    emptyStateProps: import("vue").ComputedRef<VibeEmptyStateSlotProps | null>;
+    showBadgeEmptyState: import("vue").ComputedRef<boolean>;
+    showCustomEmptyState: import("vue").ComputedRef<boolean>;
+    showInlineEmptyState: import("vue").ComputedRef<boolean>;
+};

package/lib/components/viewer-core/useViewer.d.ts

@@ -1,20 +1,31 @@
 import { type Ref } from 'vue';
+import type { VibeViewerItem } from '../viewer';
 import type { VibeAssetErrorReporter, VibeAssetLoadReporter } from './assetErrors';
 import { formatPlaybackTime } from './format';
-import { type VibeProps } from './useDataSource';
-export type { VibeResolveParams, VibeResolveResult, VibeAutoProps, VibeControlledProps, VibeEmit, VibeFeedMode, VibeHandle, VibeInitialState, VibeLoadPhase, VibeProps, } from './useDataSource';
+import type { VibeLoadPhase } from './removalState';
+export type { VibeResolveParams, VibeResolveResult, VibeEmit, VibeFeedMode, VibeHandle, VibeInitialState, VibeLoadPhase, VibeProps, VibeSurfaceMode, } from './useDataSource';
 export type { VibeAssetErrorKind } from './loadError';
 export type { VibeStatus } from './removalState';
 export type { VibeAssetErrorEvent, VibeAssetErrorReporter, VibeAssetErrorSurface, VibeAssetLoadEvent, VibeAssetLoadReporter, VibeAssetLoadSurface } from './assetErrors';
-export declare function useViewer(props: Readonly<VibeProps>, emit: (event: 'update:activeIndex', value: number) => void, options?: {
+export type { VibeEmptyStateMode, VibeEmptyStateSlotProps } from './surfaceSlots';
+export interface VibeViewerProps {
+    activeIndex?: number;
+    errorMessage?: string | null;
+    hasNextPage?: boolean;
+    items: VibeViewerItem[];
+    loading?: boolean;
+    paginationDetail?: string | null;
+    phase?: VibeLoadPhase | null;
+}
+export declare function useViewer(props: Readonly<VibeViewerProps>, emit: (event: 'update:activeIndex', value: number) => void, options?: {
     enabled?: Ref<boolean>;
     onAssetError?: VibeAssetErrorReporter;
     onAssetLoad?: VibeAssetLoadReporter;
 }): {
-    activeItem: import("vue").ComputedRef<import("../viewer").VibeViewerItem>;
+    activeItem: import("vue").ComputedRef<VibeViewerItem>;
     activeAssetErrorKind: import("vue").ComputedRef<import("./loadError").VibeAssetErrorKind | null>;
     activeMediaDuration: import("vue").ComputedRef<number>;
-    activeMediaItem: import("vue").ComputedRef<import("../viewer").VibeViewerItem | null>;
+    activeMediaItem: import("vue").ComputedRef<VibeViewerItem | null>;
     activeMediaProgress: import("vue").ComputedRef<number>;
     activeMediaState: import("vue").ComputedRef<import("./assetState").MediaUiState>;
     canRetryAsset: (id: string) => boolean;
@@ -24,13 +35,13 @@ export declare function useViewer(props: Readonly<VibeProps>, emit: (event: 'upd
     getAssetErrorLabel: (id: string) => "404" | "Load error" | null;
     getAssetRenderKey: (id: string) => string;
     formatPlaybackTime: typeof formatPlaybackTime;
-    getImageSource: (item: import("../viewer").VibeViewerItem) => string;
+    getImageSource: (item: VibeViewerItem) => string;
     getSlideStyle: (index: number) => import("vue").CSSProperties;
     hasNextPage: import("vue").ComputedRef<boolean>;
     isAtEnd: import("vue").ComputedRef<boolean>;
-    isAudio: (item: import("../viewer").VibeViewerItem) => boolean;
-    isVisual: (item: import("../viewer").VibeViewerItem) => boolean;
-    items: import("vue").ComputedRef<import("../viewer").VibeViewerItem[]>;
+    isAudio: (item: VibeViewerItem) => boolean;
+    isVisual: (item: VibeViewerItem) => boolean;
+    items: import("vue").ComputedRef<VibeViewerItem[]>;
     loading: import("vue").ComputedRef<boolean>;
     mediaStates: Ref<Record<string, import("./assetState").MediaUiState>, Record<string, import("./assetState").MediaUiState>>;
     isImageReady: (id: string) => boolean;
@@ -56,6 +67,8 @@ export declare function useViewer(props: Readonly<VibeProps>, emit: (event: 'upd
     retryInitialLoad: () => Promise<void>;
     retryAsset: (id: string) => Promise<void>;
     stageRef: Ref<HTMLElement | null, HTMLElement | null>;
-    statusMessage: import("vue").ComputedRef<"Loading the first page" | "Loading more items" | "End of feed" | null>;
+    statusKind: import("vue").ComputedRef<import("./surfaceSlots").VibeSurfaceStatusKind | null>;
+    statusMessage: import("vue").ComputedRef<string | null>;
     paginationDetail: import("vue").ComputedRef<string | null>;
+    phase: import("vue").ComputedRef<VibeLoadPhase>;
 };