@rei/cedar 16.3.0 → 17.0.0-alpha.0

package/dist/components/filmstrip/CdrFilmstripEngine.vue.d.ts

@@ -0,0 +1,734 @@
+import { CdrFilmstripEngine, CdrFilmstripArrowClickPayload, CdrFilmstripScrollPayload } from './interfaces';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        frame(props: {
+            index: number;
+            tabindex: string;
+            [key: string]: any;
+        }): any;
+        arrow(props: {
+            attributes: Record<string, any>;
+            direction: string;
+            icon: any;
+            onClick: (e: Event) => void;
+        }): any;
+    }> & {
+        frame(props: {
+            index: number;
+            tabindex: string;
+            [key: string]: any;
+        }): any;
+        arrow(props: {
+            attributes: Record<string, any>;
+            direction: string;
+            icon: any;
+            onClick: (e: Event) => void;
+        }): any;
+    };
+    refs: {
+        containerRef: HTMLDivElement;
+        surfaceScrollRef: ({
+            $: import('vue').ComponentInternalInstance;
+            $data: {};
+            $props: {
+                readonly rootProps?: any;
+                readonly scrollbarProps?: any;
+                readonly thumbProps?: any;
+                readonly viewportProps?: any;
+            } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
+            $attrs: {
+                [x: string]: unknown;
+            };
+            $refs: {
+                [x: string]: unknown;
+            } & {
+                viewportRef: ({
+                    $: import('vue').ComponentInternalInstance;
+                    $data: {};
+                    $props: Partial<{}> & Omit<{
+                        readonly as?: (import('radix-vue').AsTag | import('vue').Component) | undefined;
+                        readonly nonce?: string | undefined;
+                        readonly asChild?: boolean | undefined;
+                    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>;
+                    $attrs: {
+                        [x: string]: unknown;
+                    };
+                    $refs: {
+                        [x: string]: unknown;
+                    };
+                    $slots: Readonly<{
+                        [name: string]: import('vue').Slot<any> | undefined;
+                    }>;
+                    $root: import('vue').ComponentPublicInstance | null;
+                    $parent: import('vue').ComponentPublicInstance | null;
+                    $host: Element | null;
+                    $emit: (event: string, ...args: any[]) => void;
+                    $el: any;
+                    $options: import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                        nonce: {
+                            type: import('vue').PropType<string>;
+                        };
+                        asChild: {
+                            type: import('vue').PropType<boolean>;
+                        };
+                        as: {
+                            type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                        };
+                    }>>, {
+                        viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                    }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+                        beforeCreate?: (() => void) | (() => void)[];
+                        created?: (() => void) | (() => void)[];
+                        beforeMount?: (() => void) | (() => void)[];
+                        mounted?: (() => void) | (() => void)[];
+                        beforeUpdate?: (() => void) | (() => void)[];
+                        updated?: (() => void) | (() => void)[];
+                        activated?: (() => void) | (() => void)[];
+                        deactivated?: (() => void) | (() => void)[];
+                        beforeDestroy?: (() => void) | (() => void)[];
+                        beforeUnmount?: (() => void) | (() => void)[];
+                        destroyed?: (() => void) | (() => void)[];
+                        unmounted?: (() => void) | (() => void)[];
+                        renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                        renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                        errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+                    };
+                    $forceUpdate: () => void;
+                    $nextTick: typeof import('vue').nextTick;
+                    $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+                } & Readonly<{}> & Omit<Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, "viewportElement"> & import('vue').ShallowUnwrapRef<{
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }> & {} & import('vue').ComponentCustomProperties & {} & {
+                    $slots: {
+                        default?(_: {}): any;
+                    };
+                }) | null;
+            };
+            $slots: Readonly<{
+                [name: string]: import('vue').Slot<any> | undefined;
+            }>;
+            $root: import('vue').ComponentPublicInstance | null;
+            $parent: import('vue').ComponentPublicInstance | null;
+            $host: Element | null;
+            $emit: (event: string, ...args: any[]) => void;
+            $el: any;
+            $options: import('vue').ComponentOptionsBase<Readonly<import('../surfaceScroll/types').CdrSurfaceScrollProps> & Readonly<{}>, {
+                viewportRef: import('vue').Ref<({
+                    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+                        nonce: {
+                            type: import('vue').PropType<string>;
+                        };
+                        asChild: {
+                            type: import('vue').PropType<boolean>;
+                        };
+                        as: {
+                            type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                        };
+                    }>>, {
+                        viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                    }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+                        P: {};
+                        B: {};
+                        D: {};
+                        C: {};
+                        M: {};
+                        Defaults: {};
+                    }, Readonly<import('vue').ExtractPropTypes<{
+                        nonce: {
+                            type: import('vue').PropType<string>;
+                        };
+                        asChild: {
+                            type: import('vue').PropType<boolean>;
+                        };
+                        as: {
+                            type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                        };
+                    }>>, {
+                        viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                    }, {}, {}, {}, {}>;
+                    __isFragment?: never;
+                    __isTeleport?: never;
+                    __isSuspense?: never;
+                } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+                    $slots: {
+                        default?(_: {}): any;
+                    };
+                })) | null, ({
+                    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+                        nonce: {
+                            type: import('vue').PropType<string>;
+                        };
+                        asChild: {
+                            type: import('vue').PropType<boolean>;
+                        };
+                        as: {
+                            type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                        };
+                    }>>, {
+                        viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                    }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+                        P: {};
+                        B: {};
+                        D: {};
+                        C: {};
+                        M: {};
+                        Defaults: {};
+                    }, Readonly<import('vue').ExtractPropTypes<{
+                        nonce: {
+                            type: import('vue').PropType<string>;
+                        };
+                        asChild: {
+                            type: import('vue').PropType<boolean>;
+                        };
+                        as: {
+                            type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                        };
+                    }>>, {
+                        viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                    }, {}, {}, {}, {}>;
+                    __isFragment?: never;
+                    __isTeleport?: never;
+                    __isSuspense?: never;
+                } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+                    $slots: {
+                        default?(_: {}): any;
+                    };
+                })) | null>;
+            }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+                beforeCreate?: (() => void) | (() => void)[];
+                created?: (() => void) | (() => void)[];
+                beforeMount?: (() => void) | (() => void)[];
+                mounted?: (() => void) | (() => void)[];
+                beforeUpdate?: (() => void) | (() => void)[];
+                updated?: (() => void) | (() => void)[];
+                activated?: (() => void) | (() => void)[];
+                deactivated?: (() => void) | (() => void)[];
+                beforeDestroy?: (() => void) | (() => void)[];
+                beforeUnmount?: (() => void) | (() => void)[];
+                destroyed?: (() => void) | (() => void)[];
+                unmounted?: (() => void) | (() => void)[];
+                renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+            };
+            $forceUpdate: () => void;
+            $nextTick: typeof import('vue').nextTick;
+            $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+        } & Readonly<{}> & Omit<Readonly<import('../surfaceScroll/types').CdrSurfaceScrollProps> & Readonly<{}>, "viewportRef"> & import('vue').ShallowUnwrapRef<{
+            viewportRef: import('vue').Ref<({
+                new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+                    P: {};
+                    B: {};
+                    D: {};
+                    C: {};
+                    M: {};
+                    Defaults: {};
+                }, Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, {}, {}, {}, {}>;
+                __isFragment?: never;
+                __isTeleport?: never;
+                __isSuspense?: never;
+            } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                nonce: {
+                    type: import('vue').PropType<string>;
+                };
+                asChild: {
+                    type: import('vue').PropType<boolean>;
+                };
+                as: {
+                    type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                };
+            }>>, {
+                viewportElement: import('vue').Ref<HTMLElement | undefined>;
+            }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+                $slots: {
+                    default?(_: {}): any;
+                };
+            })) | null, ({
+                new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+                    P: {};
+                    B: {};
+                    D: {};
+                    C: {};
+                    M: {};
+                    Defaults: {};
+                }, Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, {}, {}, {}, {}>;
+                __isFragment?: never;
+                __isTeleport?: never;
+                __isSuspense?: never;
+            } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                nonce: {
+                    type: import('vue').PropType<string>;
+                };
+                asChild: {
+                    type: import('vue').PropType<boolean>;
+                };
+                as: {
+                    type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                };
+            }>>, {
+                viewportElement: import('vue').Ref<HTMLElement | undefined>;
+            }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+                $slots: {
+                    default?(_: {}): any;
+                };
+            })) | null>;
+        }> & {} & import('vue').ComponentCustomProperties & {} & {
+            $slots: Readonly<{
+                default(props: Record<string, never>): any;
+            }> & {
+                default(props: Record<string, never>): any;
+            };
+        }) | null;
+        framesItemsRef: HTMLLIElement[];
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<CdrFilmstripEngine, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    arrowClick: (payload: CdrFilmstripArrowClickPayload<Record<string, unknown>>) => any;
+    scrollNavigate: (payload: CdrFilmstripScrollPayload<Record<string, unknown>>) => any;
+    ariaMessage: (message: string) => any;
+}, string, import('vue').PublicProps, Readonly<CdrFilmstripEngine> & Readonly<{
+    onArrowClick?: ((payload: CdrFilmstripArrowClickPayload<Record<string, unknown>>) => any) | undefined;
+    onScrollNavigate?: ((payload: CdrFilmstripScrollPayload<Record<string, unknown>>) => any) | undefined;
+    onAriaMessage?: ((message: string) => any) | undefined;
+}>, {
+    id: string;
+    description: string;
+    dataUi: string;
+    isShowingArrows: boolean;
+    frames: import('./interfaces').CdrFilmstripFrame[];
+    framesToShow: number;
+    framesToScroll: number;
+    framesGap: number;
+    frameExtra: number;
+    focusSelector: string;
+    viewportTabindex: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    containerRef: HTMLDivElement;
+    surfaceScrollRef: ({
+        $: import('vue').ComponentInternalInstance;
+        $data: {};
+        $props: {
+            readonly rootProps?: any;
+            readonly scrollbarProps?: any;
+            readonly thumbProps?: any;
+            readonly viewportProps?: any;
+        } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        } & {
+            viewportRef: ({
+                $: import('vue').ComponentInternalInstance;
+                $data: {};
+                $props: Partial<{}> & Omit<{
+                    readonly as?: (import('radix-vue').AsTag | import('vue').Component) | undefined;
+                    readonly nonce?: string | undefined;
+                    readonly asChild?: boolean | undefined;
+                } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>;
+                $attrs: {
+                    [x: string]: unknown;
+                };
+                $refs: {
+                    [x: string]: unknown;
+                };
+                $slots: Readonly<{
+                    [name: string]: import('vue').Slot<any> | undefined;
+                }>;
+                $root: import('vue').ComponentPublicInstance | null;
+                $parent: import('vue').ComponentPublicInstance | null;
+                $host: Element | null;
+                $emit: (event: string, ...args: any[]) => void;
+                $el: any;
+                $options: import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+                    beforeCreate?: (() => void) | (() => void)[];
+                    created?: (() => void) | (() => void)[];
+                    beforeMount?: (() => void) | (() => void)[];
+                    mounted?: (() => void) | (() => void)[];
+                    beforeUpdate?: (() => void) | (() => void)[];
+                    updated?: (() => void) | (() => void)[];
+                    activated?: (() => void) | (() => void)[];
+                    deactivated?: (() => void) | (() => void)[];
+                    beforeDestroy?: (() => void) | (() => void)[];
+                    beforeUnmount?: (() => void) | (() => void)[];
+                    destroyed?: (() => void) | (() => void)[];
+                    unmounted?: (() => void) | (() => void)[];
+                    renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                    renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                    errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+                };
+                $forceUpdate: () => void;
+                $nextTick: typeof import('vue').nextTick;
+                $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+            } & Readonly<{}> & Omit<Readonly<import('vue').ExtractPropTypes<{
+                nonce: {
+                    type: import('vue').PropType<string>;
+                };
+                asChild: {
+                    type: import('vue').PropType<boolean>;
+                };
+                as: {
+                    type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                };
+            }>>, "viewportElement"> & import('vue').ShallowUnwrapRef<{
+                viewportElement: import('vue').Ref<HTMLElement | undefined>;
+            }> & {} & import('vue').ComponentCustomProperties & {} & {
+                $slots: {
+                    default?(_: {}): any;
+                };
+            }) | null;
+        };
+        $slots: Readonly<{
+            [name: string]: import('vue').Slot<any> | undefined;
+        }>;
+        $root: import('vue').ComponentPublicInstance | null;
+        $parent: import('vue').ComponentPublicInstance | null;
+        $host: Element | null;
+        $emit: (event: string, ...args: any[]) => void;
+        $el: any;
+        $options: import('vue').ComponentOptionsBase<Readonly<import('../surfaceScroll/types').CdrSurfaceScrollProps> & Readonly<{}>, {
+            viewportRef: import('vue').Ref<({
+                new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+                    P: {};
+                    B: {};
+                    D: {};
+                    C: {};
+                    M: {};
+                    Defaults: {};
+                }, Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, {}, {}, {}, {}>;
+                __isFragment?: never;
+                __isTeleport?: never;
+                __isSuspense?: never;
+            } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                nonce: {
+                    type: import('vue').PropType<string>;
+                };
+                asChild: {
+                    type: import('vue').PropType<boolean>;
+                };
+                as: {
+                    type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                };
+            }>>, {
+                viewportElement: import('vue').Ref<HTMLElement | undefined>;
+            }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+                $slots: {
+                    default?(_: {}): any;
+                };
+            })) | null, ({
+                new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+                    P: {};
+                    B: {};
+                    D: {};
+                    C: {};
+                    M: {};
+                    Defaults: {};
+                }, Readonly<import('vue').ExtractPropTypes<{
+                    nonce: {
+                        type: import('vue').PropType<string>;
+                    };
+                    asChild: {
+                        type: import('vue').PropType<boolean>;
+                    };
+                    as: {
+                        type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                    };
+                }>>, {
+                    viewportElement: import('vue').Ref<HTMLElement | undefined>;
+                }, {}, {}, {}, {}>;
+                __isFragment?: never;
+                __isTeleport?: never;
+                __isSuspense?: never;
+            } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                nonce: {
+                    type: import('vue').PropType<string>;
+                };
+                asChild: {
+                    type: import('vue').PropType<boolean>;
+                };
+                as: {
+                    type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                };
+            }>>, {
+                viewportElement: import('vue').Ref<HTMLElement | undefined>;
+            }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+                $slots: {
+                    default?(_: {}): any;
+                };
+            })) | null>;
+        }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import('vue').nextTick;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+    } & Readonly<{}> & Omit<Readonly<import('../surfaceScroll/types').CdrSurfaceScrollProps> & Readonly<{}>, "viewportRef"> & import('vue').ShallowUnwrapRef<{
+        viewportRef: import('vue').Ref<({
+            new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+                nonce: {
+                    type: import('vue').PropType<string>;
+                };
+                asChild: {
+                    type: import('vue').PropType<boolean>;
+                };
+                as: {
+                    type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                };
+            }>>, {
+                viewportElement: import('vue').Ref<HTMLElement | undefined>;
+            }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+                P: {};
+                B: {};
+                D: {};
+                C: {};
+                M: {};
+                Defaults: {};
+            }, Readonly<import('vue').ExtractPropTypes<{
+                nonce: {
+                    type: import('vue').PropType<string>;
+                };
+                asChild: {
+                    type: import('vue').PropType<boolean>;
+                };
+                as: {
+                    type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                };
+            }>>, {
+                viewportElement: import('vue').Ref<HTMLElement | undefined>;
+            }, {}, {}, {}, {}>;
+            __isFragment?: never;
+            __isTeleport?: never;
+            __isSuspense?: never;
+        } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+            nonce: {
+                type: import('vue').PropType<string>;
+            };
+            asChild: {
+                type: import('vue').PropType<boolean>;
+            };
+            as: {
+                type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+            };
+        }>>, {
+            viewportElement: import('vue').Ref<HTMLElement | undefined>;
+        }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+            $slots: {
+                default?(_: {}): any;
+            };
+        })) | null, ({
+            new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+                nonce: {
+                    type: import('vue').PropType<string>;
+                };
+                asChild: {
+                    type: import('vue').PropType<boolean>;
+                };
+                as: {
+                    type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                };
+            }>>, {
+                viewportElement: import('vue').Ref<HTMLElement | undefined>;
+            }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+                P: {};
+                B: {};
+                D: {};
+                C: {};
+                M: {};
+                Defaults: {};
+            }, Readonly<import('vue').ExtractPropTypes<{
+                nonce: {
+                    type: import('vue').PropType<string>;
+                };
+                asChild: {
+                    type: import('vue').PropType<boolean>;
+                };
+                as: {
+                    type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+                };
+            }>>, {
+                viewportElement: import('vue').Ref<HTMLElement | undefined>;
+            }, {}, {}, {}, {}>;
+            __isFragment?: never;
+            __isTeleport?: never;
+            __isSuspense?: never;
+        } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+            nonce: {
+                type: import('vue').PropType<string>;
+            };
+            asChild: {
+                type: import('vue').PropType<boolean>;
+            };
+            as: {
+                type: import('vue').PropType<import('vue').Component | import('radix-vue').AsTag>;
+            };
+        }>>, {
+            viewportElement: import('vue').Ref<HTMLElement | undefined>;
+        }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+            $slots: {
+                default?(_: {}): any;
+            };
+        })) | null>;
+    }> & {} & import('vue').ComponentCustomProperties & {} & {
+        $slots: Readonly<{
+            default(props: Record<string, never>): any;
+        }> & {
+            default(props: Record<string, never>): any;
+        };
+    }) | null;
+    framesItemsRef: HTMLLIElement[];
+}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};