@fit-screen/react/dist/components/FitScreen.d.ts

Scale-based large-screen adaptive solution for React Everything is based on the design draft's px size, and the adaptation is done by scale, everything is so simple

import * as React from 'react';
export interface FitScreenProps {
    /**
     * The design draft width
     * @default 1920
     */
    width?: number;
    /**
     * The design draft height
     * @default 1080
     */
    height?: number;
    /**
     * Calculation mode
     */
    mode?: 'fit' | 'scrollX' | 'scrollY' | 'full';
    /**
     * Represents the execution mode for calculating scaling ratio.
     * - throttle: Uses a throttling mechanism to limit the execution frequency.
     * - debounce: Uses a debouncing mechanism to delay execution until a certain period of inactivity.
     * - none: Executes the function without any throttling or debouncing.
     * @default 'throttle'
     */
    executeMode?: 'throttle' | 'debounce' | 'none';
    /**
     * Represents the execution rate for debounce and throttle (unit: ms).
     * @default 200
     */
    waitTime?: number;
    /**
     * The root container class name
     */
    className?: string;
    /**
     * Slots
     */
    children: React.ReactNode;
    /**
     * Adaptive container class
     */
    scaleClass?: string;
    /**
     * Adaptive container style
     */
    scaleStyle?: Record<string, string> | Record<string, string>[];
    /**
     * Callback for change in page calculation ratio
     */
    onScaleChange?: (scale: {
        widthRatio: number;
        heightRatio: number;
    }) => void;
}
export declare const FitScreen: React.MemoExoticComponent<React.ForwardRefExoticComponent<FitScreenProps & React.RefAttributes<HTMLDivElement>>>;
export default FitScreen;