Launch day fixes (#1916)

* refactor: move alert components out of folder

* feat: add id to Box

* fix: update fieldset description margins

* docs: update the readmes

packages/odyssey-react-mui/README.md

@@ -2,19 +2,16 @@
 
 ## Production Readiness
 
-This project has not yet hit version 1.0.0 and is still in active development.
+Odyssey is production-ready and available to use for real things. The API
+is stable for the duration of the point-release, meaning that while Odyssey is
+in version 1.x.x, there will be no changes that break the API.
 
-That said, it is beyond the early alpha stage in some key areas. For some
-early-adopters that means it is good enough to use for real things. Some
-other people think this means it is not ready yet.
+This project follows semantic versioning conventions:
 
-Even though the project is in development, effort is still made to keep
-the API stable. Patch versions are intended for backwards-compatible
-changes and minor versions are intended for backwards-incompatible changes.
-
-If you plan to use this for something real, you should either pin the
-exact version (maximum safety) or pin the major and minor versions
-(only accept backwards-compatible upgrades).
+- **Major point releases** may include breaking changes, but the API is stable for the duration of
+  the major point release (for example, 1.x.x)
+- **Minor point releases** include new features and are backwards-compatible (eg, x.1.x)
+- **Patch releases** include bug fixes (eg, x.x.1)
 
 ## Getting Started
 

packages/odyssey-react-mui/src/Box.tsx

@@ -16,12 +16,19 @@ import { ReactNode, forwardRef } from "react";
 export type BoxProps = {
   children?: ReactNode;
   component?: MuiBoxProps["component"];
+  id?: MuiBoxProps["id"];
   sx?: MuiBoxProps["sx"];
 };
 
 export const Box = forwardRef<HTMLElement, BoxProps>(
-  ({ children, component, sx }, ref) => (
-    <MuiBox ref={ref} children={children} component={component} sx={sx} />
+  ({ children, component, id, sx }, ref) => (
+    <MuiBox
+      ref={ref}
+      children={children}
+      component={component}
+      id={id}
+      sx={sx}
+    />
   )
 );
 

packages/odyssey-react-mui/src/Fieldset.tsx

@@ -15,7 +15,7 @@ import { memo, ReactElement, useMemo } from "react";
 
 import { Callout } from "./Callout";
 import { FieldsetContext } from "./FieldsetContext";
-import { Legend, Subordinate } from "./Typography";
+import { Legend, Support } from "./Typography";
 import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext";
 import { useUniqueId } from "./useUniqueId";
 
@@ -89,7 +89,7 @@ const Fieldset = ({
     >
       <Legend>{legend}</Legend>
 
-      {description && <Subordinate component="p">{description}</Subordinate>}
+      {description && <Support>{description}</Support>}
 
       {alert}
 

packages/odyssey-react-mui/src/labs/README.md

@@ -2,19 +2,21 @@
 
 ## Production Readiness
 
-This project has not yet hit version 1.0.0 and is still in active development.
+Odyssey is production-ready and available to use for real things. The API
+is stable for the duration of the point-release, meaning that while Odyssey is
+in version 1.x.x, there will be no changes that break the API.
 
-That said, it is beyond the early alpha stage in some key areas. For some
-early-adopters that means it is good enough to use for real things. Some
-other people think this means it is not ready yet.
+**Odyssey Labs** is the home for components that are usable, but not feature-complete.
+At minimum, they'll provide a good jumping-off point for your project; however, they
+are not guaranteed to have full support for the full suite of things that Odyssey
+provides, such as RTL support, internationalization, etc.
 
-Even though the project is in development, effort is still made to keep
-the API stable. Patch versions are intended for backwards-compatible
-changes and minor versions are intended for backwards-incompatible changes.
+This project follows semantic versioning conventions:
 
-If you plan to use this for something real, you should either pin the
-exact version (maximum safety) or pin the major and minor versions
-(only accept backwards-compatible upgrades).
+- **Major point releases** may include breaking changes, but the API is stable for the duration of
+  the major point release (for example, 1.x.x)
+- **Minor point releases** include new features and are backwards-compatible (eg, x.1.x)
+- **Patch releases** include bug fixes (eg, x.x.1)
 
 ## Getting Started
 

packages/odyssey-storybook/src/components/odyssey-mui/Banner/Banner.stories.tsx

@@ -24,7 +24,7 @@ import { expect, jest } from "@storybook/jest";
 import { axeRun } from "../../../axe-util";
 
 const storybookMeta: Meta<typeof Banner> = {
-  title: "MUI Components/Alerts/Banner",
+  title: "MUI Components/Banner",
   component: Banner,
   argTypes: {
     linkText: {

packages/odyssey-storybook/src/components/odyssey-mui/Box/Box.stories.tsx

@@ -32,13 +32,23 @@ const storybookMeta: Meta<BoxProps> = {
     component: {
       control: null,
       description:
-        "The HTML element the component should render, if different from the default",
+        "The HTML element the component should render, if different from the default.",
       table: {
         type: {
           summary: "ElementType",
         },
       },
     },
+    id: {
+      control: "text",
+      description:
+        "An optional id for the HTML elemenet rendered by the component.",
+      table: {
+        type: {
+          summary: "string",
+        },
+      },
+    },
     sx: {
       control: "object",
       description:

packages/odyssey-storybook/src/components/odyssey-mui/Callout/Callout.stories.tsx

@@ -22,7 +22,7 @@ import {
 import { MuiThemeDecorator } from "../../../../.storybook/components";
 
 const storybookMeta: Meta<CalloutProps> = {
-  title: "MUI Components/Alerts/Callout",
+  title: "MUI Components/Callout",
   component: Callout,
   argTypes: {
     children: {

packages/odyssey-storybook/src/components/odyssey-mui/Toast/Toast.stories.tsx

@@ -28,7 +28,7 @@ import { axeRun } from "../../../axe-util";
 import type { PlaywrightProps } from "../storybookTypes";
 
 const meta: Meta<ToastProps> = {
-  title: "MUI Components/Alerts/Toast",
+  title: "MUI Components/Toast",
   component: Toast,
   argTypes: {
     autoHideDuration: {