feat: add create account flow

packages/ui/src/container.tsx

@@ -1,13 +1,16 @@
+import { ArrowLeftIcon, ArrowRightIcon } from "@lume/icons";
 import { cn } from "@lume/utils";
 import { ReactNode } from "react";
 
 export function Container({
   children,
   withDrag = false,
+  withNavigate = true,
   className,
 }: {
   children: ReactNode;
   withDrag?: boolean;
+  withNavigate?: boolean;
   className?: string;
 }) {
   return (
@@ -18,7 +21,29 @@ export function Container({
       )}
     >
       {withDrag ? (
-        <div data-tauri-drag-region className="h-11 w-full shrink-0" />
+        <div
+          data-tauri-drag-region
+          className="flex h-11 w-full shrink-0 items-center justify-end pr-2"
+        >
+          {withNavigate ? (
+            <div className="flex items-center gap-1">
+              <button
+                type="button"
+                onClick={() => window.history.back()}
+                className="inline-flex size-8 items-center justify-center rounded-full text-neutral-800 hover:bg-neutral-200 dark:text-neutral-200 dark:hover:bg-neutral-800"
+              >
+                <ArrowLeftIcon className="size-5" />
+              </button>
+              <button
+                type="button"
+                onClick={() => window.history.forward()}
+                className="inline-flex size-8 items-center justify-center rounded-full text-neutral-800 hover:bg-neutral-200 dark:text-neutral-200 dark:hover:bg-neutral-800"
+              >
+                <ArrowRightIcon className="size-5" />
+              </button>
+            </div>
+          ) : null}
+        </div>
       ) : null}
       {children}
     </div>