chore: catch up Storybook preview, coverage, and story hygiene

Stories were throwing without AuthModal/CreateFlow providers, autodocs was a no-op, and several DS/create-flow screens had no stories.

stories/buttons/Button.stories.js

@@ -1,4 +1,9 @@
 import Button from "../../app/components/buttons/Button";
+import {
+  BUTTON_PALETTE_OPTIONS,
+  BUTTON_TYPE_OPTIONS,
+  SIZE_OPTIONS,
+} from "../../lib/propNormalization";
 
 export default {
   title: "Components/Buttons/Button",
@@ -15,17 +20,17 @@ export default {
   argTypes: {
     buttonType: {
       control: { type: "select" },
-      options: ["filled", "outline", "ghost", "danger"],
+      options: [...BUTTON_TYPE_OPTIONS],
       description: "The button type (Figma prop)",
     },
     palette: {
       control: { type: "select" },
-      options: ["default", "inverse"],
+      options: [...BUTTON_PALETTE_OPTIONS],
       description: "The button palette (Figma prop)",
     },
     size: {
       control: { type: "select" },
-      options: ["xsmall", "small", "medium", "large", "xlarge"],
+      options: [...SIZE_OPTIONS],
       description: "The size of the button",
     },
     disabled: {

stories/buttons/InlineTextButton.stories.js

@@ -33,7 +33,7 @@ export const Default = {
 
 export const InParagraph = {
   render: () => (
-    <p className="max-w-md font-inter text-[14px] leading-[20px] text-[color:var(--color-content-default-primary,#fff)]">
+    <p className="max-w-md text-small-paragraph text-[var(--color-content-default-primary)]">
       Share a bit more detail so the group can weigh in. You can always{" "}
       <InlineTextButton onClick={() => {}}>expand this later</InlineTextButton>{" "}
       if you need more room.

stories/buttons/Vertical.stories.js

@@ -37,10 +37,10 @@ export const Default = {
         <Icon
           name="number"
           size={32}
-          className="text-[var(--color-content-default-brand-primary,#fefcc9)]"
+          className="text-[var(--color-content-default-brand-primary)]"
         />
       </span>
-      <span className="w-full text-center font-inter text-[14px] font-medium leading-[18px] text-[var(--color-content-default-brand-primary,#fefcc9)]">
+      <span className="w-full text-center text-small-paragraph font-medium text-[var(--color-content-default-brand-primary)]">
         Number
       </span>
     </Vertical>
@@ -54,10 +54,10 @@ export const Disabled = {
         <Icon
           name="number"
           size={32}
-          className="text-[var(--color-content-default-brand-primary,#fefcc9)]"
+          className="text-[var(--color-content-default-brand-primary)]"
         />
       </span>
-      <span className="w-full text-center font-inter text-[14px] font-medium leading-[18px] text-[var(--color-content-default-brand-primary,#fefcc9)]">
+      <span className="w-full text-center text-small-paragraph font-medium text-[var(--color-content-default-brand-primary)]">
         Number
       </span>
     </Vertical>