react-window-modal

Features

• Supports TypeScript
• Highly tested
• Movable
• Resizable
• Titles (with icons)
• Minimize
• Close
• Scrollable
• Customizable style (override styles with classnames, may have to use !important)
• Many options!

Setup

npm install react-window-modal

then

const WindowModal = require("react-window-modal");

or

import WindowModal from "react-window-modal";

Usage

render() {
    return <WindowModal>contents</WindowModal>
}

Props

* All props are optional

| Name | Type | Description | | ------------- | ------------- | ----- | | title | string | The title for the window | | icon | IWindowIcon | An icon to use for the window | | pos | IPoint | The starting position for the window | | size | IPoint | The starting size for the (must be greater than 200!) | | resizable | boolean | If false, the window cannot be resized by the user | | movable | boolean | If false, the window cannot be moved by the user | | compact | boolean | If true, the style for the window's title bar will have less spacing | | hideClose | boolean | If true, no close button will be added to the window | | hideMinimize | boolean | If true, no minimize button will be added to the window |

Events

| Name | Type | Description | | ------------- | ------------- | ----- | | onClose | Function | Called when the window is closed | | onMinimize | Function | Called when the window is minimized | | onUnminimize | Function | Called when the window is unminimized | | onResize | Function | Called when the window is resized | | onMove | Function | Called when the window is moved | | onFocus | Function | Called when the window is focused | | onBlur | Function | Called when the window is blurred |