@tatuarvela/wisp - npm Package Compare versions

Comparing version 0.2.0 to 0.3.0

dist/index.cjs.js

 "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("styled-components");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(e),o=i(t);const a=o.default.div`
   ${e=>e.theme.controls.AlertText}
 `,s=e=>{let{children:t}=e;return n.default.createElement(a,null,t)};function l(e,t){var i={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(i[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(n=Object.getOwnPropertySymbols(e);o<n.length;o++)t.indexOf(n[o])<0&&Object.prototype.propertyIsEnumerable.call(e,n[o])&&(i[n[o]]=e[n[o]])}return i}const r=o.default.div`
-  height: ${e=>`${e.height}px`};
-  width: ${e=>`${e.width}px`};
   ${e=>e.theme.controls.ButtonWrapper}
@@ -55,3 +53,3 @@ `,d=o.default.button`
   ${e=>e.theme.elements.VersionInfo}
-`,oe=()=>n.default.createElement(ne,null,"Wisp Version ","0.2.0"),ae=t.css`
+`,oe=()=>n.default.createElement(ne,null,"Wisp Version ","0.3.0"),ae=t.css`
   display: flex;
@@ -61,5 +59,10 @@ flex-grow: 1;
 `,se=t.css`
+  width: 60px;
+  margin: auto;
+`,le=t.css`
   display: inherit;
+  height: ${e=>`${e.height}px`};
   padding: 0 1px 1px 0;
-`,le={AlertText:ae,Button:t.css`
+  width: ${e=>`${e.width}px`};
+`,re={AlertText:ae,AlertButton:se,Button:t.css`
   box-shadow: 1px 1px 0 0 gray;
@@ -78,3 +81,3 @@ font-size: 11px;
   }
-`,ButtonWrapper:se,ResizeHandle:t.css`
+`,ButtonWrapper:le,ResizeHandle:t.css`
   position: absolute;
@@ -112,3 +115,3 @@ right: 0;
   padding: 2px 3px;
-`},re=t.css`
+`},de=t.css`
   background: white;
@@ -128,3 +131,3 @@ border-top: 1px solid black;
   width: 100%;
-`,de=t.css`
+`,ue=t.css`
   background: none;
@@ -134,3 +137,3 @@ border-color: lightgray;
   font-weight: bold;
-`,ue={Taskbar:re,TaskbarButton:t.css`
+`,ce={Taskbar:de,TaskbarButton:t.css`
   border-radius: 3px;
@@ -144,3 +147,3 @@ border: 1px solid gray;
   user-select: none;
-  ${e=>e.active&&de};
+  ${e=>e.active&&ue};
 `,Desktop:t.css`
@@ -167,7 +170,7 @@ background: rgb(10, 36, 106);
   z-index: 1000;
-`},ce=t.css`
+`},pe=t.css`
   box-sizing: border-box;
   position: absolute;
-`,pe=t.css`
-  ${ce};
+`,me=t.css`
+  ${pe};
   top: ${-5}px;
@@ -178,4 +181,4 @@ left: ${-5}px;
   cursor: n-resize;
-`,me=t.css`
-  ${ce};
+`,we=t.css`
+  ${pe};
   top: ${-5}px;
@@ -186,4 +189,4 @@ right: ${-5}px;
   cursor: ne-resize;
-`,we=t.css`
-  ${ce};
+`,he=t.css`
+  ${pe};
   top: ${-5}px;
@@ -194,4 +197,4 @@ bottom: ${-5}px;
   cursor: e-resize;
-`,he=t.css`
-  ${ce};
+`,xe=t.css`
+  ${pe};
   bottom: ${-5}px;
@@ -202,4 +205,4 @@ right: ${-5}px;
   cursor: se-resize;
-`,xe=t.css`
-  ${ce};
+`,be=t.css`
+  ${pe};
   bottom: ${-5}px;
@@ -210,4 +213,4 @@ left: ${-5}px;
   cursor: s-resize;
-`,be=t.css`
-  ${ce};
+`,fe=t.css`
+  ${pe};
   bottom: ${-5}px;
@@ -218,4 +221,4 @@ left: ${-5}px;
   cursor: sw-resize;
-`,fe=t.css`
-  ${ce};
+`,ge=t.css`
+  ${pe};
   top: ${-5}px;
@@ -226,4 +229,4 @@ bottom: ${-5}px;
   cursor: w-resize;
-`;var ge={EResize:we,NEResize:me,NResize:pe,NWResize:t.css`
-  ${ce};
+`;var ve={EResize:he,NEResize:we,NResize:me,NWResize:t.css`
+  ${pe};
   top: ${-5}px;
@@ -234,3 +237,3 @@ left: ${-5}px;
   cursor: nw-resize;
-`,SEResize:he,SResize:xe,SWResize:be,WResize:fe};var ve={TitleBar:t.css`
+`,SEResize:xe,SResize:be,SWResize:fe,WResize:ge};var We={TitleBar:t.css`
   background: ${e=>e.isActive?"rgb(19, 71, 214)":"grey"};
@@ -254,3 +257,3 @@ border-radius: 3px;
   flex-grow: 1;
-`};const We=t.css`
+`};const ze=t.css`
   box-sizing: border-box;
@@ -262,3 +265,3 @@ display: flex;
   margin: 0;
-`,ze=t.css`
+`,Ee=t.css`
   background: white;
@@ -281,4 +284,4 @@ border-radius: 2px;
   }
-`;var Ee={TitleBarButtons:We,MinimizeButton:t.css`
-  ${ze};
+`;var $e={TitleBarButtons:ze,MinimizeButton:t.css`
+  ${Ee};
 
@@ -296,3 +299,3 @@ &:before {
 `,MaximizeButton:t.css`
-  ${ze};
+  ${Ee};
 
@@ -310,3 +313,3 @@ &:before {
 `,UnmaximizeButton:t.css`
-  ${ze};
+  ${Ee};
 
@@ -336,3 +339,3 @@ &:before {
 `,CloseButton:t.css`
-  ${ze};
+  ${Ee};
 
@@ -360,3 +363,3 @@ &:before {
   }
-`};const $e=t.css`
+`};const Me=t.css`
   box-sizing: border-box;
@@ -373,3 +376,3 @@ display: flex;
   width: 100%;
-`,Me=t.css`
+`,Oe=t.css`
   height: ${e=>{return`calc(100% - ${(t=e.viewportWindowMargins).top+t.bottom}px)`;var t}} !important;
@@ -381,5 +384,5 @@ left: ${e=>e.viewportWindowMargins.left} !important;
   border-radius: 0;
-`,Oe=t.css`
+`,ye=t.css`
   display: none;
-`,ye=t.css`
+`,je=t.css`
   background: white;
@@ -396,5 +399,7 @@ border-radius: 3px;
 
-  ${e=>e.isMaximized&&Me}
-  ${e=>e.isMinimized&&Oe}
-`,je={id:"DEFAULT",name:"Default Theme",controls:le,elements:ue,window:Object.assign(Object.assign(Object.assign(Object.assign({},ge),ve),Ee),{WindowContent:$e,WindowElement:ye})},ke={enableDefaultElements:!0,defaultWindowHeight:100,defaultWindowWidth:200,maxWindowHeight:1/0,maxWindowWidth:1/0,minWindowHeight:100,minWindowWidth:200,newWindowXOffset:10,newWindowYOffset:10,themes:[je],viewportWindowMargins:{top:0,left:0,bottom:0,right:0}},Ce=()=>n.default.createElement(n.default.Fragment,null,n.default.createElement(O,null,n.default.createElement(oe,null)),n.default.createElement(k,null)),Te=e=>e&&"object"==typeof e&&!Array.isArray(e),De=(e,t)=>{let i=Object.assign({},e);return Te(e)&&Te(t)&&Object.keys(t).forEach((n=>{Te(t[n])?n in e?i[n]=De(e[n],t[n]):Object.assign(i,{[n]:t[n]}):Object.assign(i,{[n]:t[n]})})),i},Ne=i=>{let{children:o,themes:a}=i;const s=e=>e.id===je.id?e:De(je,e),l=s(a[0]),[r,d]=e.useState(l),u={theme:r,changeTheme:e=>{d(s(e))},themes:a};return n.default.createElement(T,{value:u},n.default.createElement(t.ThemeProvider,{theme:r},o))},Se=e=>t=>{e.deactivateWindow(t),e.updateWindow(t,{isMinimized:!0})},Re=e=>t=>{e.activateWindow(t),e.updateWindow(t,{isMinimized:!1})},Ie=e=>t=>{e.activateWindow(t),e.updateWindow(t,{isMaximized:!1})};function Ae(e,t){switch(t.type){case"ACTIVATE_WINDOW":return Object.assign(Object.assign({},e),{activeWindowId:t.payload,windowOrder:[...e.windowOrder.filter((e=>e!==t.payload)),t.payload]});case"CLOSE_WINDOW":{const i=new Map(e.windows);return i.delete(t.payload),Object.assign(Object.assign({},e),{windows:i,windowOrder:[...e.windowOrder].filter((e=>e!==t.payload))})}case"CREATE_WINDOW":return Object.assign(Object.assign({},e),{windows:new Map(e.windows).set(t.payload.id,t.payload),windowOrder:e.windowOrder.concat(t.payload.id)});case"DEACTIVATE_WINDOW":return Object.assign(Object.assign({},e),{activeWindowId:t.payload===e.activeWindowId?null:e.activeWindowId});case"UPDATE_WINDOW":return Object.assign(Object.assign({},e),{windows:new Map(e.windows).set(t.payload.id,Object.assign(Object.assign({},e.windows.get(t.payload.id)),t.payload.props))});case"SET_WINDOW_MARGINS":return Object.assign(Object.assign({},e),{viewportWindowMargins:Object.assign(Object.assign({},e.viewportWindowMargins),t.payload)});default:return e}}const Be=o.default.div`
+  ${e=>e.isMaximized&&Oe}
+  ${e=>e.isMinimized&&ye}
+`,ke={id:"DEFAULT",name:"Default Theme",controls:re,elements:ce,window:Object.assign(Object.assign(Object.assign(Object.assign({},ve),We),$e),{WindowContent:Me,WindowElement:je})},Ce=o.default(u)`
+  ${e=>e.theme.controls.AlertButton}
+`,Te={enableDefaultElements:!0,defaultWindowHeight:100,defaultWindowWidth:200,maxWindowHeight:1/0,maxWindowWidth:1/0,minWindowHeight:100,minWindowWidth:200,newWindowXOffset:10,newWindowYOffset:10,themes:[ke],viewportWindowMargins:{top:0,left:0,bottom:0,right:0}},De=()=>n.default.createElement(n.default.Fragment,null,n.default.createElement(O,null,n.default.createElement(oe,null)),n.default.createElement(k,null)),Ne=e=>e&&"object"==typeof e&&!Array.isArray(e),Se=(e,t)=>{let i=Object.assign({},e);return Ne(e)&&Ne(t)&&Object.keys(t).forEach((n=>{Ne(t[n])?n in e?i[n]=Se(e[n],t[n]):Object.assign(i,{[n]:t[n]}):Object.assign(i,{[n]:t[n]})})),i},Re=i=>{let{children:o,themes:a}=i;const s=e=>e.id===ke.id?e:Se(ke,e),l=s(a[0]),[r,d]=e.useState(l),u={theme:r,changeTheme:e=>{d(s(e))},themes:a};return n.default.createElement(T,{value:u},n.default.createElement(t.ThemeProvider,{theme:r},o))},Ie=e=>t=>{e.deactivateWindow(t),e.updateWindow(t,{isMinimized:!0})},Ae=e=>t=>{e.activateWindow(t),e.updateWindow(t,{isMinimized:!1})},Be=e=>t=>{e.activateWindow(t),e.updateWindow(t,{isMaximized:!1})};function Xe(e,t){switch(t.type){case"ACTIVATE_WINDOW":return Object.assign(Object.assign({},e),{activeWindowId:t.payload,windowOrder:[...e.windowOrder.filter((e=>e!==t.payload)),t.payload]});case"CLOSE_WINDOW":{const i=new Map(e.windows);return i.delete(t.payload),Object.assign(Object.assign({},e),{windows:i,windowOrder:[...e.windowOrder].filter((e=>e!==t.payload))})}case"CREATE_WINDOW":return Object.assign(Object.assign({},e),{windows:new Map(e.windows).set(t.payload.id,t.payload),windowOrder:e.windowOrder.concat(t.payload.id)});case"DEACTIVATE_WINDOW":return Object.assign(Object.assign({},e),{activeWindowId:t.payload===e.activeWindowId?null:e.activeWindowId});case"UPDATE_WINDOW":return Object.assign(Object.assign({},e),{windows:new Map(e.windows).set(t.payload.id,Object.assign(Object.assign({},e.windows.get(t.payload.id)),t.payload.props))});case"SET_WINDOW_MARGINS":return Object.assign(Object.assign({},e),{viewportWindowMargins:Object.assign(Object.assign({},e.viewportWindowMargins),t.payload)});default:return e}}const Ye=o.default.div`
   box-sizing: border-box;
@@ -405,2 +410,2 @@ height: 100%;
   width: 100%;
-`,Xe=n.default.forwardRef(((e,t)=>{let{children:i}=e;return n.default.createElement(Be,{ref:t},i)})),Ye=t=>{let{children:i,config:o}=t;const[a,s]=n.default.useReducer(Ae,{activeWindowId:null,viewportWindowMargins:o.viewportWindowMargins,windowOrder:[],windows:new Map}),l=n.default.useRef(),r=e.useCallback((e=>s({type:"ACTIVATE_WINDOW",payload:e})),[s]),d=e.useCallback((e=>s({type:"CLOSE_WINDOW",payload:e})),[s]),u=e.useCallback((e=>s({type:"DEACTIVATE_WINDOW",payload:e})),[s]),c=e.useCallback(((e,t)=>s({type:"UPDATE_WINDOW",payload:{id:e,props:t}})),[s]),p=e.useCallback((e=>s({type:"SET_WINDOW_MARGINS",payload:e})),[s]),m=e.useCallback((()=>{var e;return(null===(e=l.current)||void 0===e?void 0:e.offsetHeight)||0}),[l]),w=e.useCallback((()=>{var e;return(null===(e=l.current)||void 0===e?void 0:e.offsetWidth)||0}),[l]),h=Object.assign(Object.assign({},a),{activateWindow:r,closeWindow:d,createWindow:(e,t)=>{const i=((e,t,i)=>{var n,o,a,s,l,r,d,u,c,p,m,w,h,x,b,f,g;return{height:null!==(n=null==i?void 0:i.height)&&void 0!==n?n:e.defaultWindowHeight,id:t,isClosable:null===(o=null==i?void 0:i.isClosable)||void 0===o||o,isClosed:null!==(a=null==i?void 0:i.isClosed)&&void 0!==a&&a,isDraggable:null===(s=null==i?void 0:i.isDraggable)||void 0===s||s,isMaximizable:null===(l=null==i?void 0:i.isMaximizable)||void 0===l||l,isMaximized:null!==(r=null==i?void 0:i.isMaximized)&&void 0!==r&&r,isMinimizable:null===(d=null==i?void 0:i.isMinimizable)||void 0===d||d,isMinimized:null!==(u=null==i?void 0:i.isMinimized)&&void 0!==u&&u,isResizable:null===(c=null==i?void 0:i.isResizable)||void 0===c||c,maxHeight:null!==(p=null==i?void 0:i.maxHeight)&&void 0!==p?p:e.maxWindowHeight,maxWidth:null!==(m=null==i?void 0:i.maxWidth)&&void 0!==m?m:e.maxWindowWidth,minHeight:null!==(w=null==i?void 0:i.minHeight)&&void 0!==w?w:e.minWindowHeight,minWidth:null!==(h=null==i?void 0:i.minWidth)&&void 0!==h?h:e.minWindowWidth,positionX:null!==(x=null==i?void 0:i.positionX)&&void 0!==x?x:e.newWindowXOffset,positionY:null!==(b=null==i?void 0:i.positionY)&&void 0!==b?b:e.newWindowYOffset,title:null!==(f=null==i?void 0:i.title)&&void 0!==f?f:"",width:null!==(g=null==i?void 0:i.width)&&void 0!==g?g:e.defaultWindowWidth}})(o,e,t);return s({type:"CREATE_WINDOW",payload:i}),a.windows.get(e)},deactivateWindow:u,getViewportHeight:m,getViewportWidth:w,setViewportWindowMargins:p,updateWindow:c,viewportRef:l}),x=Object.assign(Object.assign({},h),{maximizeWindow:(b=h,e=>{b.activateWindow(e),b.updateWindow(e,{isMaximized:!0})}),minimizeWindow:Se(h),restoreWindow:Re(h),unmaximizeWindow:Ie(h)});var b;return n.default.createElement(W,{value:x},n.default.createElement(Xe,{ref:l},i))};exports.AlertText=s,exports.AlertWindow=e=>{let{id:t,title:i,buttonText:o="OK",onButtonClick:a,children:l}=e;return n.default.createElement(ie,{id:t,initialState:{title:i,isMaximizable:!1,isMinimizable:!1,isResizable:!1}},n.default.createElement(s,null,l),n.default.createElement(u,{onClick:a,type:"button",style:{width:"60px",margin:"auto"}},o))},exports.Button=u,exports.Desktop=O,exports.StatusBar=e=>{let{children:t,showResizeHandle:i,window:o}=e;return n.default.createElement(M,null,t,i&&n.default.createElement($,{window:o}))},exports.Taskbar=k,exports.ThemeSwitcher=()=>{const{theme:e,themes:t,changeTheme:i}=D();return n.default.createElement(ie,{initialState:{title:"Theme Switcher"},id:"THEME_SWITCHER"},n.default.createElement("select",{onChange:e=>{const n=t.find((t=>t.id===e.target.value));n&&i(n)},value:e.id},t.map((t=>n.default.createElement("option",{key:t.id,value:t.id},t.name,t.id===e.id&&" (Active)")))))},exports.VersionInfo=oe,exports.Window=ie,exports.Wisp=e=>{var{children:t}=e,i=l(e,["children"]);const o=Object.assign(Object.assign({},ke),i);return n.default.createElement(Ne,{themes:o.themes},n.default.createElement(Ye,{config:o},o.enableDefaultElements&&n.default.createElement(Ce,null),t))},exports.defaultTheme=je,exports.useThemeManager=D,exports.useWindowManager=z;
+`,He=n.default.forwardRef(((e,t)=>{let{children:i}=e;return n.default.createElement(Ye,{ref:t},i)})),_e=t=>{let{children:i,config:o}=t;const[a,s]=n.default.useReducer(Xe,{activeWindowId:null,viewportWindowMargins:o.viewportWindowMargins,windowOrder:[],windows:new Map}),l=n.default.useRef(),r=e.useCallback((e=>s({type:"ACTIVATE_WINDOW",payload:e})),[s]),d=e.useCallback((e=>s({type:"CLOSE_WINDOW",payload:e})),[s]),u=e.useCallback((e=>s({type:"DEACTIVATE_WINDOW",payload:e})),[s]),c=e.useCallback(((e,t)=>s({type:"UPDATE_WINDOW",payload:{id:e,props:t}})),[s]),p=e.useCallback((e=>s({type:"SET_WINDOW_MARGINS",payload:e})),[s]),m=e.useCallback((()=>{var e;return(null===(e=l.current)||void 0===e?void 0:e.offsetHeight)||0}),[l]),w=e.useCallback((()=>{var e;return(null===(e=l.current)||void 0===e?void 0:e.offsetWidth)||0}),[l]),h=Object.assign(Object.assign({},a),{activateWindow:r,closeWindow:d,createWindow:(e,t)=>{const i=((e,t,i)=>{var n,o,a,s,l,r,d,u,c,p,m,w,h,x,b,f,g;return{height:null!==(n=null==i?void 0:i.height)&&void 0!==n?n:e.defaultWindowHeight,id:t,isClosable:null===(o=null==i?void 0:i.isClosable)||void 0===o||o,isClosed:null!==(a=null==i?void 0:i.isClosed)&&void 0!==a&&a,isDraggable:null===(s=null==i?void 0:i.isDraggable)||void 0===s||s,isMaximizable:null===(l=null==i?void 0:i.isMaximizable)||void 0===l||l,isMaximized:null!==(r=null==i?void 0:i.isMaximized)&&void 0!==r&&r,isMinimizable:null===(d=null==i?void 0:i.isMinimizable)||void 0===d||d,isMinimized:null!==(u=null==i?void 0:i.isMinimized)&&void 0!==u&&u,isResizable:null===(c=null==i?void 0:i.isResizable)||void 0===c||c,maxHeight:null!==(p=null==i?void 0:i.maxHeight)&&void 0!==p?p:e.maxWindowHeight,maxWidth:null!==(m=null==i?void 0:i.maxWidth)&&void 0!==m?m:e.maxWindowWidth,minHeight:null!==(w=null==i?void 0:i.minHeight)&&void 0!==w?w:e.minWindowHeight,minWidth:null!==(h=null==i?void 0:i.minWidth)&&void 0!==h?h:e.minWindowWidth,positionX:null!==(x=null==i?void 0:i.positionX)&&void 0!==x?x:e.newWindowXOffset,positionY:null!==(b=null==i?void 0:i.positionY)&&void 0!==b?b:e.newWindowYOffset,title:null!==(f=null==i?void 0:i.title)&&void 0!==f?f:"",width:null!==(g=null==i?void 0:i.width)&&void 0!==g?g:e.defaultWindowWidth}})(o,e,t);return s({type:"CREATE_WINDOW",payload:i}),a.windows.get(e)},deactivateWindow:u,getViewportHeight:m,getViewportWidth:w,setViewportWindowMargins:p,updateWindow:c,viewportRef:l}),x=Object.assign(Object.assign({},h),{maximizeWindow:(b=h,e=>{b.activateWindow(e),b.updateWindow(e,{isMaximized:!0})}),minimizeWindow:Ie(h),restoreWindow:Ae(h),unmaximizeWindow:Be(h)});var b;return n.default.createElement(W,{value:x},n.default.createElement(He,{ref:l},i))};exports.AlertText=s,exports.AlertWindow=e=>{let{id:t,title:i,buttonText:o="OK",onButtonClick:a,children:l}=e;return n.default.createElement(ie,{id:t,initialState:{title:i,isMaximizable:!1,isMinimizable:!1,isResizable:!1}},n.default.createElement(s,null,l),n.default.createElement(Ce,{onClick:a,type:"button"},o))},exports.Button=u,exports.Desktop=O,exports.StatusBar=e=>{let{children:t,showResizeHandle:i,window:o}=e;return n.default.createElement(M,null,t,i&&n.default.createElement($,{window:o}))},exports.Taskbar=k,exports.ThemeSwitcher=()=>{const{theme:e,themes:t,changeTheme:i}=D();return n.default.createElement(ie,{initialState:{title:"Theme Switcher"},id:"THEME_SWITCHER"},n.default.createElement("select",{onChange:e=>{const n=t.find((t=>t.id===e.target.value));n&&i(n)},value:e.id},t.map((t=>n.default.createElement("option",{key:t.id,value:t.id},t.name,t.id===e.id&&" (Active)")))))},exports.VersionInfo=oe,exports.Window=ie,exports.Wisp=e=>{var{children:t}=e,i=l(e,["children"]);const o=Object.assign(Object.assign({},Te),i);return n.default.createElement(Re,{themes:o.themes},n.default.createElement(_e,{config:o},o.enableDefaultElements&&n.default.createElement(De,null),t))},exports.defaultTheme=ke,exports.useThemeManager=D,exports.useWindowManager=z;

dist/index.d.ts

@@ -6,3 +6,3 @@ /// <reference types="react" />
 
-declare const ControlsProperties: readonly ["AlertText", "Button", "ButtonWrapper", "ResizeHandle", "StatusBar"];
+declare const ControlsProperties: readonly ["AlertText", "AlertButton", "Button", "ButtonWrapper", "ResizeHandle", "StatusBar"];
 declare const ElementsProperties: readonly ["Desktop", "Taskbar", "TaskbarButton", "VersionInfo"];
@@ -17,3 +17,3 @@ declare const WindowProperties: readonly ["CloseButton", "EResize", "MaximizeButton", "MinimizeButton", "NEResize", "NResize", "NWResize", "SEResize", "SResize", "SWResize", "Title", "TitleBar", "TitleBarButtons", "UnmaximizeButton", "WResize", "WindowContent", "WindowElement"];
 declare type WindowThemeSection = ThemeSection<typeof WindowProperties>;
-declare type DefaultTheme = {
+interface DefaultTheme {
     id: string;
@@ -24,4 +24,4 @@ name: string;
     window: WindowThemeSection;
-};
-declare type Theme = {
+}
+interface Theme {
     id: string;
@@ -32,5 +32,5 @@ name: string;
     window?: Partial<WindowThemeSection>;
-};
+}
 
-declare type WindowManagerState = {
+interface WindowManagerState {
     activeWindowId: string | null;
@@ -40,3 +40,3 @@ windows: Map<string, WindowType>;
     viewportWindowMargins: ViewportWindowMargins;
-};
+}
 declare type BaseMethods = {
@@ -58,7 +58,8 @@ activateWindow(id: string): void;
 };
-declare type WindowManagerBase = {
+interface WindowManagerBase extends WindowManagerState, BaseMethods {
     viewportRef: React.Ref<HTMLDivElement>;
-} & WindowManagerState & BaseMethods;
-declare type WindowManager = WindowManagerBase & WindowStateMethods;
-declare type WindowType = {
+}
+interface WindowManager extends WindowManagerBase, WindowStateMethods {
+}
+interface WindowType {
     height: number;
@@ -82,4 +83,4 @@ id: string;
     width: number;
-};
-declare type ViewportWindowMargins = {
+}
+interface ViewportWindowMargins {
     top: number;
@@ -89,5 +90,5 @@ right: number;
     left: number;
-};
+}
 
-declare type WispConfig = {
+interface WispConfig {
     enableDefaultElements: boolean;
@@ -104,18 +105,21 @@ defaultWindowHeight: number;
     viewportWindowMargins: ViewportWindowMargins;
-};
+}
 
-declare const AlertText: React.FC;
+interface Props$2 {
+    children: React.ReactNode;
+}
+declare const AlertText: ({ children }: Props$2) => JSX.Element;
 
-declare type ButtonWrapperProps = {
-    width: number;
-    height: number;
-};
-declare type Props$1 = any & ButtonWrapperProps;
-declare const Button: React.FC<Props$1>;
+interface Props$1 extends React.ComponentPropsWithoutRef<'button'> {
+    width?: number;
+    height?: number;
+}
+declare const Button: ({ width, height, ...rest }: Props$1) => JSX.Element;
 
-declare type StatusBarProps = {
+interface StatusBarProps {
+    children: React.ReactNode;
     showResizeHandle?: boolean;
     window?: WindowType;
-};
-declare const StatusBar: React.FC<StatusBarProps>;
+}
+declare const StatusBar: ({ children, showResizeHandle, window }: StatusBarProps) => JSX.Element;
 
@@ -126,11 +130,11 @@ declare const Desktop: styled_components.StyledComponent<"div", any, {}, never>;
 
-declare const ThemeSwitcher: React.FC;
+declare const ThemeSwitcher: () => JSX.Element;
 
-declare const VersionInfo: React.FC;
+declare const VersionInfo: () => JSX.Element;
 
-declare type ThemeManager = {
+interface ThemeManager {
     theme: Theme;
     changeTheme: (theme: Theme) => void;
     themes: Theme[];
-};
+}
 
@@ -141,15 +145,16 @@ declare function useThemeManager(): ThemeManager;
 
-declare type Props = {
+interface Props {
+    buttonText?: string;
+    children: React.ReactNode;
     id: string;
+    onButtonClick?(): void;
     title: string;
-    buttonText?: string;
-    onButtonClick?: () => void;
-};
-declare const AlertWindow: React.FC<Props>;
+}
+declare const AlertWindow: ({ id, title, buttonText, onButtonClick, children, }: Props) => JSX.Element;
 
-declare type WindowProps = {
+interface WindowProps {
     children: React.ReactNode;
     id: string;
     initialState?: Partial<WindowType>;
-};
+}
 declare const Window: React.FC<WindowProps>;
@@ -159,7 +164,7 @@
 
-declare type WispProps = {
+interface WispProps extends Partial<WispConfig> {
     children: React.ReactNode;
-} & Partial<WispConfig>;
+}
 declare const Wisp: ({ children, ...rest }: WispProps) => JSX.Element;
 
 export { AlertText, AlertWindow, Button, Desktop, StatusBar, Taskbar, Theme, ThemeSwitcher, VersionInfo, Window, Wisp, WispConfig, WispProps, defaultTheme, useThemeManager, useWindowManager };

dist/index.esm.js

 import e,{useCallback as i,useEffect as t,useState as n}from"react";import o,{css as r,ThemeProvider as s}from"styled-components";const a=o.div`
   ${e=>e.theme.controls.AlertText}
 `,l=i=>{let{children:t}=i;return e.createElement(a,null,t)};function d(e,i){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&i.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(n=Object.getOwnPropertySymbols(e);o<n.length;o++)i.indexOf(n[o])<0&&Object.prototype.propertyIsEnumerable.call(e,n[o])&&(t[n[o]]=e[n[o]])}return t}const p=o.div`
-  height: ${e=>`${e.height}px`};
-  width: ${e=>`${e.width}px`};
   ${e=>e.theme.controls.ButtonWrapper}
 `,c=o.button`
   ${e=>e.theme.controls.Button}
-`,m=i=>{var{width:t,height:n}=i,o=d(i,["width","height"]);return e.createElement(p,{width:t,height:n},e.createElement(c,Object.assign({},o)))};var w;!function(e){e.N="N",e.NE="NE",e.E="E",e.SE="SE",e.S="S",e.SW="SW",e.W="W",e.NW="NW"}(w||(w={}));const h=(e,i,t)=>{const n=e.positionX-i,o=t.maxX-e.width;return Math.min(Math.max(n,t.minX),o)},u=(e,i,t)=>{const n=e.positionY-i,o=t.maxY-e.height;return Math.min(Math.max(n,t.minY),o)},x=(e,i,t,n)=>{const o=e.width-i;return Math.min(Math.max(o,e.minWidth),t.maxX-e.positionX,e.maxWidth,n?e.width+e.positionX-t.minX:Math.min())},b=(e,i,t,n)=>{const o=e.height-i;return Math.min(Math.max(o,e.minHeight),t.maxY-e.positionY,e.maxHeight,n?e.height+e.positionY-t.minY:Math.min())},g=e=>{let{getViewportWidth:i,getViewportHeight:t,viewportWindowMargins:n}=e;return{minX:n.left,minY:n.top,maxX:i()-n.right,maxY:t()-n.bottom}},v=(e,i)=>{e.preventDefault();let t=null,n=null,o=null,r=null,s=0,a=0;t=e=>{return(t=e).preventDefault(),void(0===t.button&&(o?(s=o-t.clientX,a=r-t.clientY,o=t.clientX,r=t.clientY,i(s,a)):(o=t.clientX,r=t.clientY)));var t},n=()=>(document.removeEventListener("mousemove",t),void document.removeEventListener("mouseup",n)),document.addEventListener("mousemove",t),document.addEventListener("mouseup",n)},W=(e,i)=>(t,n)=>{if(e.activateWindow(i.id),i.isResizable&&!i.isMaximized)return v(t,((t,o)=>{i=Object.assign(Object.assign({},i),f(i,n,t,o,g(e))),e.updateWindow(i.id,i)}))},f=(e,i,t,n,o)=>{const r=()=>{const i=b(e,-n,o,!0);return{height:i,positionY:e.positionY+(e.height-i)}},s=()=>({width:x(e,t,o)}),a=()=>({height:b(e,n,o)}),l=()=>{const i=x(e,-t,o,!0);return{width:i,positionX:e.positionX+(e.width-i)}};switch(i){case w.N:return Object.assign({},r());case w.NE:return Object.assign(Object.assign({},r()),s());case w.E:return Object.assign({},s());case w.SE:return Object.assign(Object.assign({},a()),s());case w.S:return Object.assign({},a());case w.SW:return Object.assign(Object.assign({},a()),l());case w.W:return Object.assign({},l());case w.NW:return Object.assign(Object.assign({},r()),l());default:return{}}},z=e.createContext(void 0);z.displayName="WindowManagerContext";const E=z.Provider;function $(){return e.useContext(z)}const O=o.div`
+`,m=i=>{var{width:t,height:n}=i,o=d(i,["width","height"]);return e.createElement(p,{width:t,height:n},e.createElement(c,Object.assign({},o)))};var w;!function(e){e.N="N",e.NE="NE",e.E="E",e.SE="SE",e.S="S",e.SW="SW",e.W="W",e.NW="NW"}(w||(w={}));const u=(e,i,t)=>{const n=e.positionX-i,o=t.maxX-e.width;return Math.min(Math.max(n,t.minX),o)},h=(e,i,t)=>{const n=e.positionY-i,o=t.maxY-e.height;return Math.min(Math.max(n,t.minY),o)},x=(e,i,t,n)=>{const o=e.width-i;return Math.min(Math.max(o,e.minWidth),t.maxX-e.positionX,e.maxWidth,n?e.width+e.positionX-t.minX:Math.min())},b=(e,i,t,n)=>{const o=e.height-i;return Math.min(Math.max(o,e.minHeight),t.maxY-e.positionY,e.maxHeight,n?e.height+e.positionY-t.minY:Math.min())},g=e=>{let{getViewportWidth:i,getViewportHeight:t,viewportWindowMargins:n}=e;return{minX:n.left,minY:n.top,maxX:i()-n.right,maxY:t()-n.bottom}},v=(e,i)=>{e.preventDefault();let t=null,n=null,o=null,r=null,s=0,a=0;t=e=>{return(t=e).preventDefault(),void(0===t.button&&(o?(s=o-t.clientX,a=r-t.clientY,o=t.clientX,r=t.clientY,i(s,a)):(o=t.clientX,r=t.clientY)));var t},n=()=>(document.removeEventListener("mousemove",t),void document.removeEventListener("mouseup",n)),document.addEventListener("mousemove",t),document.addEventListener("mouseup",n)},W=(e,i)=>(t,n)=>{if(e.activateWindow(i.id),i.isResizable&&!i.isMaximized)return v(t,((t,o)=>{i=Object.assign(Object.assign({},i),f(i,n,t,o,g(e))),e.updateWindow(i.id,i)}))},f=(e,i,t,n,o)=>{const r=()=>{const i=b(e,-n,o,!0);return{height:i,positionY:e.positionY+(e.height-i)}},s=()=>({width:x(e,t,o)}),a=()=>({height:b(e,n,o)}),l=()=>{const i=x(e,-t,o,!0);return{width:i,positionX:e.positionX+(e.width-i)}};switch(i){case w.N:return Object.assign({},r());case w.NE:return Object.assign(Object.assign({},r()),s());case w.E:return Object.assign({},s());case w.SE:return Object.assign(Object.assign({},a()),s());case w.S:return Object.assign({},a());case w.SW:return Object.assign(Object.assign({},a()),l());case w.W:return Object.assign({},l());case w.NW:return Object.assign(Object.assign({},r()),l());default:return{}}},z=e.createContext(void 0);z.displayName="WindowManagerContext";const E=z.Provider;function $(){return e.useContext(z)}const O=o.div`
   ${e=>e.theme.controls.ResizeHandle}
@@ -53,5 +51,5 @@ `,M=i=>{let{window:t}=i;const n=$(),o=W(n,t);return e.createElement(O,{onMouseDown:e=>o(e,w.SE)})},y=o.div`
   ${e=>e.theme.window.WindowElement}
-`,ne=(e,i)=>t=>{if(e.activateWindow(i.id),i.isDraggable&&!i.isMaximized)return v(t,((t,n)=>{i=Object.assign(Object.assign({},i),oe(i,t,n,g(e))),e.updateWindow(i.id,i)}))},oe=(e,i,t,n)=>({positionX:h(e,i,n),positionY:u(e,t,n)}),re=i=>{let{children:n,id:o,initialState:r}=i;const s=$(),a=s.windows.get(o),l=s.windowOrder.indexOf(o);if(t((()=>(a||s.createWindow(o,r),()=>s.closeWindow(o))),[o]),!a||a.isClosed)return null;const d=Object.assign({},a),p=e.Children.map(n,(i=>e.isValidElement(i)?e.cloneElement(i,{window:d}):i));return e.createElement(te,{height:d.height,isMaximized:d.isMaximized,isMinimized:d.isMinimized,orderNumber:l,positionX:d.positionX,positionY:d.positionY,width:d.width,viewportWindowMargins:s.viewportWindowMargins},e.createElement(ee,{close:()=>s.closeWindow(o),drag:ne(s,d),isActive:o===s.activeWindowId,isClosable:d.isClosable,isMaximizable:d.isMaximizable,isMaximized:d.isMaximized,isMinimizable:d.isMinimizable,maximize:()=>s.maximizeWindow(o),minimize:()=>s.minimizeWindow(o),title:d.title,unmaximize:()=>s.unmaximizeWindow(o)}),e.createElement(ie,{onClick:()=>s.activateWindow(o)},p),d.isResizable&&e.createElement(P,{resize:W(s,d)}))},se=()=>{const{theme:i,themes:t,changeTheme:n}=R();return e.createElement(re,{initialState:{title:"Theme Switcher"},id:"THEME_SWITCHER"},e.createElement("select",{onChange:e=>{const i=t.find((i=>i.id===e.target.value));i&&n(i)},value:i.id},t.map((t=>e.createElement("option",{key:t.id,value:t.id},t.name,t.id===i.id&&" (Active)")))))},ae=o.p`
+`,ne=(e,i)=>t=>{if(e.activateWindow(i.id),i.isDraggable&&!i.isMaximized)return v(t,((t,n)=>{i=Object.assign(Object.assign({},i),oe(i,t,n,g(e))),e.updateWindow(i.id,i)}))},oe=(e,i,t,n)=>({positionX:u(e,i,n),positionY:h(e,t,n)}),re=i=>{let{children:n,id:o,initialState:r}=i;const s=$(),a=s.windows.get(o),l=s.windowOrder.indexOf(o);if(t((()=>(a||s.createWindow(o,r),()=>s.closeWindow(o))),[o]),!a||a.isClosed)return null;const d=Object.assign({},a),p=e.Children.map(n,(i=>e.isValidElement(i)?e.cloneElement(i,{window:d}):i));return e.createElement(te,{height:d.height,isMaximized:d.isMaximized,isMinimized:d.isMinimized,orderNumber:l,positionX:d.positionX,positionY:d.positionY,width:d.width,viewportWindowMargins:s.viewportWindowMargins},e.createElement(ee,{close:()=>s.closeWindow(o),drag:ne(s,d),isActive:o===s.activeWindowId,isClosable:d.isClosable,isMaximizable:d.isMaximizable,isMaximized:d.isMaximized,isMinimizable:d.isMinimizable,maximize:()=>s.maximizeWindow(o),minimize:()=>s.minimizeWindow(o),title:d.title,unmaximize:()=>s.unmaximizeWindow(o)}),e.createElement(ie,{onClick:()=>s.activateWindow(o)},p),d.isResizable&&e.createElement(P,{resize:W(s,d)}))},se=()=>{const{theme:i,themes:t,changeTheme:n}=R();return e.createElement(re,{initialState:{title:"Theme Switcher"},id:"THEME_SWITCHER"},e.createElement("select",{onChange:e=>{const i=t.find((i=>i.id===e.target.value));i&&n(i)},value:i.id},t.map((t=>e.createElement("option",{key:t.id,value:t.id},t.name,t.id===i.id&&" (Active)")))))},ae=o.p`
   ${e=>e.theme.elements.VersionInfo}
-`,le=()=>e.createElement(ae,null,"Wisp Version ","0.2.0"),de=r`
+`,le=()=>e.createElement(ae,null,"Wisp Version ","0.3.0"),de=r`
   display: flex;
@@ -61,5 +59,10 @@ flex-grow: 1;
 `,pe=r`
+  width: 60px;
+  margin: auto;
+`,ce=r`
   display: inherit;
+  height: ${e=>`${e.height}px`};
   padding: 0 1px 1px 0;
-`,ce=r`
+  width: ${e=>`${e.width}px`};
+`,me=r`
   box-shadow: 1px 1px 0 0 gray;
@@ -78,3 +81,3 @@ font-size: 11px;
   }
-`,me=r`
+`,we=r`
   position: absolute;
@@ -102,3 +105,3 @@ right: 0;
   }
-`,we=r`
+`,ue=r`
   box-sizing: border-box;
@@ -128,3 +131,3 @@ margin: -3px;
   width: 100%;
-`,ue=r`
+`,xe=r`
   background: none;
@@ -134,3 +137,3 @@ border-color: lightgray;
   font-weight: bold;
-`,xe=r`
+`,be=r`
   border-radius: 3px;
@@ -144,4 +147,4 @@ border: 1px solid gray;
   user-select: none;
-  ${e=>e.active&&ue};
-`,be=r`
+  ${e=>e.active&&xe};
+`,ge=r`
   background: rgb(10, 36, 106);
@@ -155,3 +158,3 @@ bottom: 0;
   top: 0;
-`,ge=r`
+`,ve=r`
   bottom: 30px;
@@ -168,7 +171,7 @@ color: white;
   z-index: 1000;
-`,ve=r`
+`,We=r`
   box-sizing: border-box;
   position: absolute;
-`;var We={EResize:r`
-  ${ve};
+`;var fe={EResize:r`
+  ${We};
   top: ${-5}px;
@@ -180,3 +183,3 @@ bottom: ${-5}px;
 `,NEResize:r`
-  ${ve};
+  ${We};
   top: ${-5}px;
@@ -188,3 +191,3 @@ right: ${-5}px;
 `,NResize:r`
-  ${ve};
+  ${We};
   top: ${-5}px;
@@ -196,3 +199,3 @@ left: ${-5}px;
 `,NWResize:r`
-  ${ve};
+  ${We};
   top: ${-5}px;
@@ -204,3 +207,3 @@ left: ${-5}px;
 `,SEResize:r`
-  ${ve};
+  ${We};
   bottom: ${-5}px;
@@ -212,3 +215,3 @@ right: ${-5}px;
 `,SResize:r`
-  ${ve};
+  ${We};
   bottom: ${-5}px;
@@ -220,3 +223,3 @@ left: ${-5}px;
 `,SWResize:r`
-  ${ve};
+  ${We};
   bottom: ${-5}px;
@@ -228,3 +231,3 @@ left: ${-5}px;
 `,WResize:r`
-  ${ve};
+  ${We};
   top: ${-5}px;
@@ -235,3 +238,3 @@ bottom: ${-5}px;
   cursor: w-resize;
-`};var fe={TitleBar:r`
+`};var ze={TitleBar:r`
   background: ${e=>e.isActive?"rgb(19, 71, 214)":"grey"};
@@ -255,3 +258,3 @@ border-radius: 3px;
   flex-grow: 1;
-`};const ze=r`
+`};const Ee=r`
   background: white;
@@ -274,3 +277,3 @@ border-radius: 2px;
   }
-`;var Ee={TitleBarButtons:r`
+`;var $e={TitleBarButtons:r`
   box-sizing: border-box;
@@ -283,3 +286,3 @@ display: flex;
 `,MinimizeButton:r`
-  ${ze};
+  ${Ee};
 
@@ -297,3 +300,3 @@ &:before {
 `,MaximizeButton:r`
-  ${ze};
+  ${Ee};
 
@@ -311,3 +314,3 @@ &:before {
 `,UnmaximizeButton:r`
-  ${ze};
+  ${Ee};
 
@@ -337,3 +340,3 @@ &:before {
 `,CloseButton:r`
-  ${ze};
+  ${Ee};
 
@@ -361,3 +364,3 @@ &:before {
   }
-`};const $e=r`
+`};const Oe=r`
   box-sizing: border-box;
@@ -374,3 +377,3 @@ display: flex;
   width: 100%;
-`,Oe=r`
+`,Me=r`
   height: ${e=>{return`calc(100% - ${(i=e.viewportWindowMargins).top+i.bottom}px)`;var i}} !important;
@@ -382,5 +385,5 @@ left: ${e=>e.viewportWindowMargins.left} !important;
   border-radius: 0;
-`,Me=r`
+`,ye=r`
   display: none;
-`,ye=r`
+`,je=r`
   background: white;
@@ -397,5 +400,7 @@ border-radius: 3px;
 
-  ${e=>e.isMaximized&&Oe}
-  ${e=>e.isMinimized&&Me}
-`,je={id:"DEFAULT",name:"Default Theme",controls:{AlertText:de,Button:ce,ButtonWrapper:pe,ResizeHandle:me,StatusBar:we},elements:{Taskbar:he,TaskbarButton:xe,Desktop:be,VersionInfo:ge},window:Object.assign(Object.assign(Object.assign(Object.assign({},We),fe),Ee),{WindowContent:$e,WindowElement:ye})},ke=i=>{let{id:t,title:n,buttonText:o="OK",onButtonClick:r,children:s}=i;return e.createElement(re,{id:t,initialState:{title:n,isMaximizable:!1,isMinimizable:!1,isResizable:!1}},e.createElement(l,null,s),e.createElement(m,{onClick:r,type:"button",style:{width:"60px",margin:"auto"}},o))},Ce={enableDefaultElements:!0,defaultWindowHeight:100,defaultWindowWidth:200,maxWindowHeight:1/0,maxWindowWidth:1/0,minWindowHeight:100,minWindowWidth:200,newWindowXOffset:10,newWindowYOffset:10,themes:[je],viewportWindowMargins:{top:0,left:0,bottom:0,right:0}},De=()=>e.createElement(e.Fragment,null,e.createElement(k,null,e.createElement(le,null)),e.createElement(N,null)),Ne=e=>e&&"object"==typeof e&&!Array.isArray(e),Te=(e,i)=>{let t=Object.assign({},e);return Ne(e)&&Ne(i)&&Object.keys(i).forEach((n=>{Ne(i[n])?n in e?t[n]=Te(e[n],i[n]):Object.assign(t,{[n]:i[n]}):Object.assign(t,{[n]:i[n]})})),t},Se=i=>{let{children:t,themes:o}=i;const r=e=>e.id===je.id?e:Te(je,e),a=r(o[0]),[l,d]=n(a),p={theme:l,changeTheme:e=>{d(r(e))},themes:o};return e.createElement(S,{value:p},e.createElement(s,{theme:l},t))},Re=e=>i=>{e.deactivateWindow(i),e.updateWindow(i,{isMinimized:!0})},Ie=e=>i=>{e.activateWindow(i),e.updateWindow(i,{isMinimized:!1})},Ae=e=>i=>{e.activateWindow(i),e.updateWindow(i,{isMaximized:!1})};function Be(e,i){switch(i.type){case"ACTIVATE_WINDOW":return Object.assign(Object.assign({},e),{activeWindowId:i.payload,windowOrder:[...e.windowOrder.filter((e=>e!==i.payload)),i.payload]});case"CLOSE_WINDOW":{const t=new Map(e.windows);return t.delete(i.payload),Object.assign(Object.assign({},e),{windows:t,windowOrder:[...e.windowOrder].filter((e=>e!==i.payload))})}case"CREATE_WINDOW":return Object.assign(Object.assign({},e),{windows:new Map(e.windows).set(i.payload.id,i.payload),windowOrder:e.windowOrder.concat(i.payload.id)});case"DEACTIVATE_WINDOW":return Object.assign(Object.assign({},e),{activeWindowId:i.payload===e.activeWindowId?null:e.activeWindowId});case"UPDATE_WINDOW":return Object.assign(Object.assign({},e),{windows:new Map(e.windows).set(i.payload.id,Object.assign(Object.assign({},e.windows.get(i.payload.id)),i.payload.props))});case"SET_WINDOW_MARGINS":return Object.assign(Object.assign({},e),{viewportWindowMargins:Object.assign(Object.assign({},e.viewportWindowMargins),i.payload)});default:return e}}const Xe=o.div`
+  ${e=>e.isMaximized&&Me}
+  ${e=>e.isMinimized&&ye}
+`,ke={id:"DEFAULT",name:"Default Theme",controls:{AlertText:de,AlertButton:pe,Button:me,ButtonWrapper:ce,ResizeHandle:we,StatusBar:ue},elements:{Taskbar:he,TaskbarButton:be,Desktop:ge,VersionInfo:ve},window:Object.assign(Object.assign(Object.assign(Object.assign({},fe),ze),$e),{WindowContent:Oe,WindowElement:je})},Ce=o(m)`
+  ${e=>e.theme.controls.AlertButton}
+`,De=i=>{let{id:t,title:n,buttonText:o="OK",onButtonClick:r,children:s}=i;return e.createElement(re,{id:t,initialState:{title:n,isMaximizable:!1,isMinimizable:!1,isResizable:!1}},e.createElement(l,null,s),e.createElement(Ce,{onClick:r,type:"button"},o))},Ne={enableDefaultElements:!0,defaultWindowHeight:100,defaultWindowWidth:200,maxWindowHeight:1/0,maxWindowWidth:1/0,minWindowHeight:100,minWindowWidth:200,newWindowXOffset:10,newWindowYOffset:10,themes:[ke],viewportWindowMargins:{top:0,left:0,bottom:0,right:0}},Te=()=>e.createElement(e.Fragment,null,e.createElement(k,null,e.createElement(le,null)),e.createElement(N,null)),Se=e=>e&&"object"==typeof e&&!Array.isArray(e),Re=(e,i)=>{let t=Object.assign({},e);return Se(e)&&Se(i)&&Object.keys(i).forEach((n=>{Se(i[n])?n in e?t[n]=Re(e[n],i[n]):Object.assign(t,{[n]:i[n]}):Object.assign(t,{[n]:i[n]})})),t},Ie=i=>{let{children:t,themes:o}=i;const r=e=>e.id===ke.id?e:Re(ke,e),a=r(o[0]),[l,d]=n(a),p={theme:l,changeTheme:e=>{d(r(e))},themes:o};return e.createElement(S,{value:p},e.createElement(s,{theme:l},t))},Ae=e=>i=>{e.deactivateWindow(i),e.updateWindow(i,{isMinimized:!0})},Be=e=>i=>{e.activateWindow(i),e.updateWindow(i,{isMinimized:!1})},Xe=e=>i=>{e.activateWindow(i),e.updateWindow(i,{isMaximized:!1})};function Ye(e,i){switch(i.type){case"ACTIVATE_WINDOW":return Object.assign(Object.assign({},e),{activeWindowId:i.payload,windowOrder:[...e.windowOrder.filter((e=>e!==i.payload)),i.payload]});case"CLOSE_WINDOW":{const t=new Map(e.windows);return t.delete(i.payload),Object.assign(Object.assign({},e),{windows:t,windowOrder:[...e.windowOrder].filter((e=>e!==i.payload))})}case"CREATE_WINDOW":return Object.assign(Object.assign({},e),{windows:new Map(e.windows).set(i.payload.id,i.payload),windowOrder:e.windowOrder.concat(i.payload.id)});case"DEACTIVATE_WINDOW":return Object.assign(Object.assign({},e),{activeWindowId:i.payload===e.activeWindowId?null:e.activeWindowId});case"UPDATE_WINDOW":return Object.assign(Object.assign({},e),{windows:new Map(e.windows).set(i.payload.id,Object.assign(Object.assign({},e.windows.get(i.payload.id)),i.payload.props))});case"SET_WINDOW_MARGINS":return Object.assign(Object.assign({},e),{viewportWindowMargins:Object.assign(Object.assign({},e.viewportWindowMargins),i.payload)});default:return e}}const He=o.div`
   box-sizing: border-box;
@@ -406,2 +411,2 @@ height: 100%;
   width: 100%;
-`,Ye=e.forwardRef(((i,t)=>{let{children:n}=i;return e.createElement(Xe,{ref:t},n)})),He=t=>{let{children:n,config:o}=t;const[r,s]=e.useReducer(Be,{activeWindowId:null,viewportWindowMargins:o.viewportWindowMargins,windowOrder:[],windows:new Map}),a=e.useRef(),l=i((e=>s({type:"ACTIVATE_WINDOW",payload:e})),[s]),d=i((e=>s({type:"CLOSE_WINDOW",payload:e})),[s]),p=i((e=>s({type:"DEACTIVATE_WINDOW",payload:e})),[s]),c=i(((e,i)=>s({type:"UPDATE_WINDOW",payload:{id:e,props:i}})),[s]),m=i((e=>s({type:"SET_WINDOW_MARGINS",payload:e})),[s]),w=i((()=>{var e;return(null===(e=a.current)||void 0===e?void 0:e.offsetHeight)||0}),[a]),h=i((()=>{var e;return(null===(e=a.current)||void 0===e?void 0:e.offsetWidth)||0}),[a]),u=Object.assign(Object.assign({},r),{activateWindow:l,closeWindow:d,createWindow:(e,i)=>{const t=((e,i,t)=>{var n,o,r,s,a,l,d,p,c,m,w,h,u,x,b,g,v;return{height:null!==(n=null==t?void 0:t.height)&&void 0!==n?n:e.defaultWindowHeight,id:i,isClosable:null===(o=null==t?void 0:t.isClosable)||void 0===o||o,isClosed:null!==(r=null==t?void 0:t.isClosed)&&void 0!==r&&r,isDraggable:null===(s=null==t?void 0:t.isDraggable)||void 0===s||s,isMaximizable:null===(a=null==t?void 0:t.isMaximizable)||void 0===a||a,isMaximized:null!==(l=null==t?void 0:t.isMaximized)&&void 0!==l&&l,isMinimizable:null===(d=null==t?void 0:t.isMinimizable)||void 0===d||d,isMinimized:null!==(p=null==t?void 0:t.isMinimized)&&void 0!==p&&p,isResizable:null===(c=null==t?void 0:t.isResizable)||void 0===c||c,maxHeight:null!==(m=null==t?void 0:t.maxHeight)&&void 0!==m?m:e.maxWindowHeight,maxWidth:null!==(w=null==t?void 0:t.maxWidth)&&void 0!==w?w:e.maxWindowWidth,minHeight:null!==(h=null==t?void 0:t.minHeight)&&void 0!==h?h:e.minWindowHeight,minWidth:null!==(u=null==t?void 0:t.minWidth)&&void 0!==u?u:e.minWindowWidth,positionX:null!==(x=null==t?void 0:t.positionX)&&void 0!==x?x:e.newWindowXOffset,positionY:null!==(b=null==t?void 0:t.positionY)&&void 0!==b?b:e.newWindowYOffset,title:null!==(g=null==t?void 0:t.title)&&void 0!==g?g:"",width:null!==(v=null==t?void 0:t.width)&&void 0!==v?v:e.defaultWindowWidth}})(o,e,i);return s({type:"CREATE_WINDOW",payload:t}),r.windows.get(e)},deactivateWindow:p,getViewportHeight:w,getViewportWidth:h,setViewportWindowMargins:m,updateWindow:c,viewportRef:a}),x=Object.assign(Object.assign({},u),{maximizeWindow:(b=u,e=>{b.activateWindow(e),b.updateWindow(e,{isMaximized:!0})}),minimizeWindow:Re(u),restoreWindow:Ie(u),unmaximizeWindow:Ae(u)});var b;return e.createElement(E,{value:x},e.createElement(Ye,{ref:a},n))},Ve=i=>{var{children:t}=i,n=d(i,["children"]);const o=Object.assign(Object.assign({},Ce),n);return e.createElement(Se,{themes:o.themes},e.createElement(He,{config:o},o.enableDefaultElements&&e.createElement(De,null),t))};export{l as AlertText,ke as AlertWindow,m as Button,k as Desktop,j as StatusBar,N as Taskbar,se as ThemeSwitcher,le as VersionInfo,re as Window,Ve as Wisp,je as defaultTheme,R as useThemeManager,$ as useWindowManager};
+`,Ve=e.forwardRef(((i,t)=>{let{children:n}=i;return e.createElement(He,{ref:t},n)})),_e=t=>{let{children:n,config:o}=t;const[r,s]=e.useReducer(Ye,{activeWindowId:null,viewportWindowMargins:o.viewportWindowMargins,windowOrder:[],windows:new Map}),a=e.useRef(),l=i((e=>s({type:"ACTIVATE_WINDOW",payload:e})),[s]),d=i((e=>s({type:"CLOSE_WINDOW",payload:e})),[s]),p=i((e=>s({type:"DEACTIVATE_WINDOW",payload:e})),[s]),c=i(((e,i)=>s({type:"UPDATE_WINDOW",payload:{id:e,props:i}})),[s]),m=i((e=>s({type:"SET_WINDOW_MARGINS",payload:e})),[s]),w=i((()=>{var e;return(null===(e=a.current)||void 0===e?void 0:e.offsetHeight)||0}),[a]),u=i((()=>{var e;return(null===(e=a.current)||void 0===e?void 0:e.offsetWidth)||0}),[a]),h=Object.assign(Object.assign({},r),{activateWindow:l,closeWindow:d,createWindow:(e,i)=>{const t=((e,i,t)=>{var n,o,r,s,a,l,d,p,c,m,w,u,h,x,b,g,v;return{height:null!==(n=null==t?void 0:t.height)&&void 0!==n?n:e.defaultWindowHeight,id:i,isClosable:null===(o=null==t?void 0:t.isClosable)||void 0===o||o,isClosed:null!==(r=null==t?void 0:t.isClosed)&&void 0!==r&&r,isDraggable:null===(s=null==t?void 0:t.isDraggable)||void 0===s||s,isMaximizable:null===(a=null==t?void 0:t.isMaximizable)||void 0===a||a,isMaximized:null!==(l=null==t?void 0:t.isMaximized)&&void 0!==l&&l,isMinimizable:null===(d=null==t?void 0:t.isMinimizable)||void 0===d||d,isMinimized:null!==(p=null==t?void 0:t.isMinimized)&&void 0!==p&&p,isResizable:null===(c=null==t?void 0:t.isResizable)||void 0===c||c,maxHeight:null!==(m=null==t?void 0:t.maxHeight)&&void 0!==m?m:e.maxWindowHeight,maxWidth:null!==(w=null==t?void 0:t.maxWidth)&&void 0!==w?w:e.maxWindowWidth,minHeight:null!==(u=null==t?void 0:t.minHeight)&&void 0!==u?u:e.minWindowHeight,minWidth:null!==(h=null==t?void 0:t.minWidth)&&void 0!==h?h:e.minWindowWidth,positionX:null!==(x=null==t?void 0:t.positionX)&&void 0!==x?x:e.newWindowXOffset,positionY:null!==(b=null==t?void 0:t.positionY)&&void 0!==b?b:e.newWindowYOffset,title:null!==(g=null==t?void 0:t.title)&&void 0!==g?g:"",width:null!==(v=null==t?void 0:t.width)&&void 0!==v?v:e.defaultWindowWidth}})(o,e,i);return s({type:"CREATE_WINDOW",payload:t}),r.windows.get(e)},deactivateWindow:p,getViewportHeight:w,getViewportWidth:u,setViewportWindowMargins:m,updateWindow:c,viewportRef:a}),x=Object.assign(Object.assign({},h),{maximizeWindow:(b=h,e=>{b.activateWindow(e),b.updateWindow(e,{isMaximized:!0})}),minimizeWindow:Ae(h),restoreWindow:Be(h),unmaximizeWindow:Xe(h)});var b;return e.createElement(E,{value:x},e.createElement(Ve,{ref:a},n))},Pe=i=>{var{children:t}=i,n=d(i,["children"]);const o=Object.assign(Object.assign({},Ne),n);return e.createElement(Ie,{themes:o.themes},e.createElement(_e,{config:o},o.enableDefaultElements&&e.createElement(Te,null),t))};export{l as AlertText,De as AlertWindow,m as Button,k as Desktop,j as StatusBar,N as Taskbar,se as ThemeSwitcher,le as VersionInfo,re as Window,Pe as Wisp,ke as defaultTheme,R as useThemeManager,$ as useWindowManager};

package.json

 {
   "name": "@tatuarvela/wisp",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Window manager and widget toolkit",
@@ -5,0 +5,0 @@ "main": "dist/index.cjs.js",

No alert changes

Improved metrics

Total package byte prevSize

50188

0.79%

Lines of code

968

1.47%

No dependency changes