Added support for custom dialog window type

[danielmeloalencar]

Sometimes we want to add a different style or decoration for different types of windows, this PR adds initial support for this. In my example, the window title have a height of 15, in addition to the more obvious customizations. Maybe this could be the essential change to allow the creation of a start menu.

[wnayes]

I think it makes sense to want to style different kinds of windows in different ways, but I imagine this being done in "user land" rather than implementing a new page.

For example, in your config, you could render differently based on the kind of window. Here is some example code for something like this:

frame.tsx

import React from "react";
import { WindowFrame, WindowClientArea, ThemeContextProvider, useWindow } from "@bond-wm/react";
import {
  TitleBar,
  TitleBarCloseButton,
  TitleBarIcon,
  TitleBarMaximizeButton,
  TitleBarMinimizeButton,
  TitleBarText,
} from "@bond-wm/react-titlebar";
import { MyTheme } from "../theme";
import { WindowType } from "@bond-wm/shared";

export default () => {
  return (
    <ThemeContextProvider theme={MyTheme}>
      <WindowFrame>
        <MyWindow />
      </WindowFrame>
    </ThemeContextProvider>
  );
};

function MyWindow() {
  const win = useWindow();
  if (!win) {
    return;
  }

  if (win.type === WindowType.Dialog) {
    return <MyDialogWindow />;
  }
  else {
    return <MyRegularWindow />;
  }
}

function MyRegularWindow() {
  return <>
    <TitleBar>
      <TitleBarIcon />
      <TitleBarText />
      <TitleBarMinimizeButton />
      <TitleBarMaximizeButton />
      <TitleBarCloseButton />
    </TitleBar>
    <WindowClientArea />
  </>;
}

function MyDialogWindow() {
  // This is identical, but could be changed up as desired.
  return <>
    <TitleBar>
      <TitleBarIcon />
      <TitleBarText />
      <TitleBarMinimizeButton />
      <TitleBarMaximizeButton />
      <TitleBarCloseButton />
    </TitleBar>
    <WindowClientArea />
  </>;
}