feat(dashboard): Submit forms on Cmd + Enter (#9623)

**What**
- Changes all forms to only submit on Cmd/Ctrl + Enter instead of just Enter.
- Cleans up the position of submit/cancel buttons in many FocusModals that still had them in the header.
- Fixes responsiveness of multiple forms
- Removes the SplitView component, and replaces its usages with StackedDrawer/Modal to align the UX across the project.

Resolves CC-103, CC-535

packages/admin/dashboard/src/components/utilities/generic-forward-ref/generic-forward-ref.tsx

@@ -0,0 +1,7 @@
+import { ReactNode, Ref, RefAttributes, forwardRef } from "react"
+
+export function genericForwardRef<T, P = {}>(
+  render: (props: P, ref: Ref<T>) => ReactNode
+): (props: P & RefAttributes<T>) => ReactNode {
+  return forwardRef(render) as any
+}

packages/admin/dashboard/src/components/utilities/generic-forward-ref/index.ts

@@ -0,0 +1 @@
+export * from "./generic-forward-ref"

packages/admin/dashboard/src/components/utilities/keybound-form/index.ts

@@ -0,0 +1 @@
+export * from "./keybound-form"

packages/admin/dashboard/src/components/utilities/keybound-form/keybound-form.tsx

@@ -0,0 +1,35 @@
+import React from "react"
+
+/**
+ * A form that can only be submitted when using the meta or control key.
+ */
+export const KeyboundForm = React.forwardRef<
+  HTMLFormElement,
+  React.FormHTMLAttributes<HTMLFormElement>
+>(({ onSubmit, onKeyDown, ...rest }, ref) => {
+  const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
+    event.preventDefault()
+    onSubmit?.(event)
+  }
+
+  const handleKeyDown = (event: React.KeyboardEvent<HTMLFormElement>) => {
+    if (event.key === "Enter") {
+      event.preventDefault()
+
+      if (event.metaKey || event.ctrlKey) {
+        handleSubmit(event)
+      }
+    }
+  }
+
+  return (
+    <form
+      {...rest}
+      onSubmit={handleSubmit}
+      onKeyDown={onKeyDown ?? handleKeyDown}
+      ref={ref}
+    />
+  )
+})
+
+KeyboundForm.displayName = "KeyboundForm"

packages/admin/dashboard/src/components/utilities/visually-hidden/index.ts

@@ -0,0 +1 @@
+export * from "./visually-hidden"

packages/admin/dashboard/src/components/utilities/visually-hidden/visually-hidden.tsx

@@ -0,0 +1,5 @@
+import { PropsWithChildren } from "react"
+
+export const VisuallyHidden = ({ children }: PropsWithChildren) => {
+  return <span className="sr-only">{children}</span>
+}