import { ComputedRef, Ref } from '../../node_modules/vue'; /** * Direction the truncated text scrolls towards on hover. */ export type ActiveTextTruncateDirection = 'ltr' | 'rtl'; /** * Options driving the truncation animation. They mirror the * `ActiveTextTruncate` component props. */ export interface UseActiveTextTruncateOptions { /** * Number of pixels per millisecond for the text transition. */ ppms: Ref; /** * Maximum width of the fading mask, in pixels. */ fadingMaxWidth: Ref; /** * Minimum width of the fading mask, in pixels. */ fadingMinWidth: Ref; /** * Delay before the text starts moving, in milliseconds. */ delay: Ref; /** * Direction of the truncation animation. */ direction: Ref; } /** * Emit signature for the animation lifecycle events. */ type ActiveTextTruncateEmit = (event: 'cancel' | 'end' | 'start') => void; /** * Reactive API returned by {@link useActiveTextTruncate}. */ export interface UseActiveTextTruncate { resizeRef: Ref; isFading: ComputedRef; fadingLeftWidth: ComputedRef; fadingRightWidth: ComputedRef; textFinalOffset: ComputedRef; textOffsetTransitionDelay: ComputedRef; textOffsetTransitionDuration: ComputedRef; resetTextLivePosition: () => void; } /** * Drives the resize-aware text truncation animation for `ActiveTextTruncate`: * measures the wrapper and text elements, derives the CSS custom properties * that animate the text offset and fading mask, and tracks the text position * live (via `requestAnimationFrame`) while a transition is running so the * fading mask can follow it. * * Reuses {@link useResizeObserver} to re-measure whenever the host element is * resized. * * @param options - Reactive truncation options (see {@link UseActiveTextTruncateOptions}). * @param emit - The component's emit function, used to raise `start`, `end` and `cancel`. * @returns The {@link UseActiveTextTruncate} API: `resizeRef` to attach to the * host element, the derived CSS-value computeds for the template, and the * `resetTextLivePosition` handler. * @remarks Internal building block of `ActiveTextTruncate`; not exported from the package root. * @example * import { toRef } from 'vue' * import { useActiveTextTruncate } from '@/composables/useActiveTextTruncate' * * const { resizeRef, isFading, resetTextLivePosition } = useActiveTextTruncate( * { * ppms: toRef(props, 'ppms'), * fadingMaxWidth: toRef(props, 'fadingMaxWidth'), * fadingMinWidth: toRef(props, 'fadingMinWidth'), * delay: toRef(props, 'delay'), * direction: toRef(props, 'direction') * }, * emit * ) */ export declare function useActiveTextTruncate(options: UseActiveTextTruncateOptions, emit: ActiveTextTruncateEmit): UseActiveTextTruncate; export default useActiveTextTruncate;