![](\"https://www.soodohkohd.com/assets/images/logo.png\" "\\"soo-doh-kohd\\""){kind=logo}
\n\n## Description:\nThe sdk-window component is a reusable, modular window that can be resized or moved around the page.\n\n## Angular Compatibility Chart\n\n| Version | Compatibility |\n|---------|---------------|\n| >= 16 | ✔ |\n\n**NOTE: This package leverages the [sdk-core-library](https://www.npmjs.com/package/sdk-core-library) for core configurations (i.e., colors, icons, etc.).**\n\n## INSTALLATION:\nUsing NPM:\n\n```bash\nnpm install --save sdk-window\n```\n\n## CONFIGURATION:\nTo configure the ```sdk-window``` for your application, add the following lines to your app.module.ts file:\n\n```typescript\nimport { SDKWindowModule } from 'sdk-window';\n\n@NgModule({\n imports: [\n SDKWindowModule\n ]\n})\nexport class AppModule { }\n```\n\n## PROPERTIES:\n#### Inputs:\n- ```parent: (string):``` The id of the parent object. [Default \"webspace\"]\n- ```windowID: (string):``` The id for the window.\n- ```windowTitle: (string):``` The title to show in the header bar.\n- ```windowColor: (string):``` The header bar background color. [Default \"rgb(36, 144, 201)\"]\n- ```windowTitleColor: (string):``` The title font color. [Default \"white\"]\n- ```windowContent: (TemplateRef):``` The reference name of the content template for the window.\n- ```windowContentData: (any | undefined)``` Data passed into the content template.\n- ```windowActions: (TemplateRef):``` The reference name of the actions template (i.e., buttons) to show in the right side of the header.\n- ```windowActionsData: (any | undefined)``` Data passed into the actions template.\n- ```zIndex: (number):``` The z-index (style) for the window. [Default 0]\n- ```top: (string):``` Top position of the window. [Default \"0\"]\n- ```left: (string):``` Left position of the window. [Default \"0\"]\n- ```height: (string):``` Height of the window. [Default \"500\"]\n- ```width: (string):``` Width of the window. [Default \"600\"]\n- ```minHeight: (string):``` Minimum height of the window. [Default \"300\"]\n- ```minWidth: (string):``` Minimum width of the window. [Default \"300\"]\n- ```overflow: (string):``` Allow window content to be scrollable. [Default: \"auto\"]\n- ```init: (boolean):``` Initially show the window. [Default false]\n- ```fullscreen: (boolean):``` Set window to fullscreen (maximized). [Default false]\n- ```centered: (boolean):``` Center window on init. [Default true]\n- ```resizable: (boolean):``` Allow window to be resizable. [Default true]\n- ```closeable: (boolean):``` Show close icon (right side of header). [Default true]\n- ```maximize: (boolean):``` Show maximize icon (left side of header). [Default true]\n- ```highlight: (boolean):``` Highlight window on focus. [Default true]\n\n#### Outputs:\n- ```adjustmentEvent``` Emitted when the window is resized or moved.\n\n returns:\n ```\n {\n window: (pointer to html element),\n top: (number),\n left: (number),\n height: (number),\n width: (number)\n }\n ```\n- ```closeEvent``` Emitted when the window is closed.\n\n## USAGE:\n```html\n