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/controls/TextInput.stories.js

@@ -1,5 +1,9 @@
 import React from "react";
 import TextInput from "../../app/components/controls/TextInput";
+import {
+  INPUT_STATE_OPTIONS,
+  TEXT_INPUT_SIZE_OPTIONS,
+} from "../../lib/propNormalization";
 
 export default {
   title: "Components/Controls/TextInput",
@@ -10,11 +14,11 @@ export default {
   argTypes: {
     inputSize: {
       control: { type: "select" },
-      options: ["small", "medium", "Small", "Medium"],
+      options: [...TEXT_INPUT_SIZE_OPTIONS],
     },
     state: {
       control: { type: "select" },
-      options: ["default", "active", "hover", "focus", "error", "disabled"],
+      options: [...INPUT_STATE_OPTIONS],
     },
     disabled: {
       control: { type: "boolean" },
@@ -37,75 +41,80 @@ export default {
 const Template = (args) => <TextInput {...args} />;
 
 // Default story
-export const Default = Template.bind({});
-Default.args = {
-  label: "Default Text Input",
-  placeholder: "Enter text...",
-  inputSize: "medium",
-  state: "default",
+export const Default = {
+  args: {
+    label: "Default Text Input",
+    placeholder: "Enter text...",
+    inputSize: "medium",
+    state: "default",
+  },
+  render: Template,
+}; // Size variants
+export const Small = {
+  args: {
+    label: "Small Text Input",
+    placeholder: "Small size",
+    inputSize: "small",
+    state: "default",
+  },
+  render: Template,
 };
-
-// Size variants
-export const Small = Template.bind({});
-Small.args = {
-  label: "Small Text Input",
-  placeholder: "Small size",
-  inputSize: "small",
-  state: "default",
+export const Medium = {
+  args: {
+    label: "Medium Text Input",
+    placeholder: "Medium size",
+    inputSize: "medium",
+    state: "default",
+  },
+  render: Template,
+}; // States
+export const Active = {
+  args: {
+    label: "Active State",
+    placeholder: "Active input",
+    inputSize: "medium",
+    state: "active",
+  },
+  render: Template,
 };
-
-export const Medium = Template.bind({});
-Medium.args = {
-  label: "Medium Text Input",
-  placeholder: "Medium size",
-  inputSize: "medium",
-  state: "default",
+export const Hover = {
+  args: {
+    label: "Hover State",
+    placeholder: "Hover input",
+    inputSize: "medium",
+    state: "hover",
+  },
+  render: Template,
 };
-
-// States
-export const Active = Template.bind({});
-Active.args = {
-  label: "Active State",
-  placeholder: "Active input",
-  inputSize: "medium",
-  state: "active",
+export const Focus = {
+  args: {
+    label: "Focus State",
+    placeholder: "Focused input",
+    inputSize: "medium",
+    state: "focus",
+  },
+  render: Template,
 };
-
-export const Hover = Template.bind({});
-Hover.args = {
-  label: "Hover State",
-  placeholder: "Hover input",
-  inputSize: "medium",
-  state: "hover",
+export const Error = {
+  args: {
+    label: "Error State",
+    placeholder: "Error input",
+    inputSize: "medium",
+    state: "default",
+    error: true,
+  },
+  render: Template,
 };
-
-export const Focus = Template.bind({});
-Focus.args = {
-  label: "Focus State",
-  placeholder: "Focused input",
-  inputSize: "medium",
-  state: "focus",
-};
-
-export const Error = Template.bind({});
-Error.args = {
-  label: "Error State",
-  placeholder: "Error input",
-  inputSize: "medium",
-  state: "default",
-  error: true,
-};
-
-export const Disabled = Template.bind({});
-Disabled.args = {
-  label: "Disabled State",
-  placeholder: "Disabled input",
-  inputSize: "medium",
-  state: "default",
-  disabled: true,
-};
-
-// Interactive example
+export const Disabled = {
+  args: {
+    label: "Disabled State",
+    placeholder: "Disabled input",
+    inputSize: "medium",
+    state: "default",
+    disabled: true,
+  },
+  render: Template,
+}; // Interactive example
 export const Interactive = (args) => {
   const [value, setValue] = React.useState("");