react-window-manager-ui/dist/index.d.ts

A lightweight React component library for creating draggable, resizable windows with TypeScript support

import { default as default_2 } from 'react';
import { JSX } from 'react/jsx-runtime';
import { StoreApi } from 'zustand';
import { UseBoundStore } from 'zustand';

export declare type ContextMenuInfo = {
    visible: boolean;
    x: number;
    y: number;
    items: ContextMenuItem[];
    sourceWindowId: string | null;
    zIndex: number;
};

export declare type ContextMenuItem = {
    id: string;
    label: string;
    icon?: React.ReactNode;
    action: () => void;
    disabled?: boolean;
    separator?: boolean;
    variant?: "default" | "destructive";
};

export declare const useWindowManagerStore: UseBoundStore<StoreApi<WindowManagerState>>;

declare const Window_2: ({ id, title, children, position, size, toolbar, className, animation: animationType, icons, resize, minSize, maxSize, allowFullscreen, onClose, onToggleFullscreen, onResize, }: WindowProps) => JSX.Element;
export { Window_2 as Window }

declare type Window_3 = {
    id: string;
    title: string | React.ReactNode;
    type: string;
    position: {
        x: number;
        y: number;
    };
    size: {
        width: number;
        height: number;
    };
    originalSize?: {
        width: number;
        height: number;
    };
    isMinimized: boolean;
    isMaximized: boolean;
    zIndex: number;
    mode?: "open" | "save";
    data?: any;
    snapPosition?: "left" | "right" | "none";
    toolbar?: React.ReactNode | string;
    minSize?: {
        width: number;
        height: number;
    };
    maxSize?: {
        width: number;
        height: number;
    };
};

export declare type WindowAnimationType = "fade" | "scale" | "slide" | "flip" | "rotate" | "jellyfish" | "none";

export declare interface WindowManagerConfig {
    theme?: "light" | "dark" | "system";
    animations?: boolean;
}

export declare type WindowManagerState = {
    windows: Window_3[];
    activeWindowId: string | null;
    previousWindowId: string | null;
    windowHistory: string[];
    isAltQOpen: boolean;
    selectedWindowIndex: number;
    splitterPosition: number;
    isSplitterVisible: boolean;
    windowAnimation: WindowAnimationType;
    addWindow: (window: Window_3) => void;
    removeWindow: (id: string) => void;
    updateWindow: (id: string, updates: Partial<Window_3>) => void;
    setActiveWindow: (id: string) => void;
    bringToFront: (id: string) => void;
    endSplitOnDrag: (draggedWindowId: string) => void;
    setWindowAnimation: (animation: WindowAnimationType) => void;
};

export declare interface WindowPosition {
    x: number;
    y: number;
}

/**
 * Props for the Window component
 */
export declare type WindowProps = {
    /** Unique identifier for the window */
    id: string;
    /** Window title - can be string or React component */
    title?: string | default_2.ReactNode;
    /** Window content */
    children?: default_2.ReactNode;
    /** Initial window position */
    position?: {
        x: number;
        y: number;
    };
    /** Initial window size */
    size?: {
        width: number;
        height: number;
    };
    /** Content to display in the toolbar */
    toolbar?: default_2.ReactNode | string;
    /** Additional CSS classes for the window */
    className?: string;
    /** Custom toolbar icons */
    icons?: {
        fullscreen?: default_2.ReactNode;
        fullscreenExit?: default_2.ReactNode;
        close?: default_2.ReactNode;
    };
    /** Animation type for fullscreen transitions (overrides global setting) */
    animation?: WindowAnimationType;
    /** Whether to allow resizing the window */
    resize?: boolean | "horizontal" | "vertical" | "both" | "left" | "right" | "top" | "bottom";
    /** Minimum window size */
    minSize?: {
        width: number;
        height: number;
    };
    /** Maximum window size */
    maxSize?: {
        width: number;
        height: number;
    };
    /** Whether to allow fullscreen mode */
    allowFullscreen?: boolean;
    /** Callback when window is closed */
    onClose?: () => void;
    /** Callback when fullscreen state changes */
    onToggleFullscreen?: (isFullscreen: boolean) => void;
    /** Callback when window is resized */
    onResize?: (size: {
        width: number;
        height: number;
    }) => void;
};

export declare interface WindowSize {
    width: number;
    height: number;
}

export { }