feat(admin-sdk,admin-bundler,admin-shared,medusa): Restructure admin packages (#8988)

**What**
- Renames /admin-next -> /admin
- Renames @medusajs/admin-sdk -> @medusajs/admin-bundler
- Creates a new package called @medusajs/admin-sdk that will hold all tooling relevant to creating admin extensions. This is currently `defineRouteConfig` and `defineWidgetConfig`, but will eventually also export methods for adding custom fields, register translation, etc. 
  - cc: @shahednasser we should update the examples in the docs so these functions are imported from `@medusajs/admin-sdk`. People will also need to install the package in their project, as it's no longer a transient dependency.
  - cc: @olivermrbl we might want to publish a changelog when this is merged, as it is a breaking change, and will require people to import the `defineXConfig` from the new package instead of `@medusajs/admin-shared`.
- Updates CODEOWNERS so /admin packages does not require a review from the UI team.

packages/admin/dashboard/src/components/modals/route-focus-modal/index.ts

@@ -0,0 +1 @@
+export * from "./route-focus-modal"

packages/admin/dashboard/src/components/modals/route-focus-modal/route-focus-modal.tsx

@@ -0,0 +1,101 @@
+import { FocusModal, clx } from "@medusajs/ui"
+import { PropsWithChildren, useEffect, useState } from "react"
+import { useNavigate } from "react-router-dom"
+import { RouteModalForm } from "../route-modal-form"
+import { useRouteModal } from "../route-modal-provider"
+import { RouteModalProvider } from "../route-modal-provider/route-provider"
+import { StackedModalProvider } from "../stacked-modal-provider"
+
+type RouteFocusModalProps = PropsWithChildren<{
+  prev?: string
+}>
+
+const Root = ({ prev = "..", children }: RouteFocusModalProps) => {
+  const navigate = useNavigate()
+  const [open, setOpen] = useState(false)
+  const [stackedModalOpen, onStackedModalOpen] = useState(false)
+
+  /**
+   * Open the modal when the component mounts. This
+   * ensures that the entry animation is played.
+   */
+  useEffect(() => {
+    setOpen(true)
+
+    return () => {
+      setOpen(false)
+      onStackedModalOpen(false)
+    }
+  }, [])
+
+  const handleOpenChange = (open: boolean) => {
+    if (!open) {
+      document.body.style.pointerEvents = "auto"
+      navigate(prev, { replace: true })
+      return
+    }
+
+    setOpen(open)
+  }
+
+  return (
+    <FocusModal open={open} onOpenChange={handleOpenChange}>
+      <RouteModalProvider prev={prev}>
+        <StackedModalProvider onOpenChange={onStackedModalOpen}>
+          <Content stackedModalOpen={stackedModalOpen}>{children}</Content>
+        </StackedModalProvider>
+      </RouteModalProvider>
+    </FocusModal>
+  )
+}
+
+type ContentProps = PropsWithChildren<{
+  stackedModalOpen: boolean
+}>
+
+const Content = ({ stackedModalOpen, children }: ContentProps) => {
+  const { __internal } = useRouteModal()
+
+  const shouldPreventClose = !__internal.closeOnEscape
+
+  return (
+    <FocusModal.Content
+      onEscapeKeyDown={
+        shouldPreventClose
+          ? (e) => {
+              e.preventDefault()
+            }
+          : undefined
+      }
+      className={clx({
+        "!bg-ui-bg-disabled !inset-x-5 !inset-y-3": stackedModalOpen,
+      })}
+    >
+      {children}
+    </FocusModal.Content>
+  )
+}
+
+const Header = FocusModal.Header
+const Title = FocusModal.Title
+const Description = FocusModal.Description
+const Footer = FocusModal.Footer
+const Body = FocusModal.Body
+const Close = FocusModal.Close
+const Form = RouteModalForm
+
+/**
+ * FocusModal that is used to render a form on a separate route.
+ *
+ * Typically used for forms creating a resource or forms that require
+ * a lot of space.
+ */
+export const RouteFocusModal = Object.assign(Root, {
+  Header,
+  Title,
+  Body,
+  Description,
+  Footer,
+  Close,
+  Form,
+})