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

@@ -1,5 +1,9 @@
 import React from "react";
 import ToggleGroup from "../../app/components/controls/ToggleGroup";
+import {
+  STATE_OPTIONS,
+  TOGGLE_GROUP_POSITION_OPTIONS,
+} from "../../lib/propNormalization";
 
 export default {
   title: "Components/Controls/ToggleGroup",
@@ -10,11 +14,11 @@ export default {
   argTypes: {
     position: {
       control: { type: "select" },
-      options: ["left", "middle", "right"],
+      options: [...TOGGLE_GROUP_POSITION_OPTIONS],
     },
     state: {
       control: { type: "select" },
-      options: ["default", "hover", "focus", "selected"],
+      options: [...STATE_OPTIONS],
     },
     showText: {
       control: { type: "boolean" },
@@ -24,27 +28,30 @@ export default {
 
 const Template = (args) => <ToggleGroup {...args}>Toggle Item</ToggleGroup>;
 
-export const Default = Template.bind({});
-Default.args = {
-  position: "left",
-  state: "default",
-  showText: true,
+export const Default = {
+  args: {
+    position: "left",
+    state: "default",
+    showText: true,
+  },
+  render: Template,
 };
-
-export const Middle = Template.bind({});
-Middle.args = {
-  position: "middle",
-  state: "default",
-  showText: true,
+export const Middle = {
+  args: {
+    position: "middle",
+    state: "default",
+    showText: true,
+  },
+  render: Template,
 };
-
-export const Right = Template.bind({});
-Right.args = {
-  position: "right",
-  state: "default",
-  showText: true,
+export const Right = {
+  args: {
+    position: "right",
+    state: "default",
+    showText: true,
+  },
+  render: Template,
 };
-
 export const States = () => (
   <div className="space-y-4">
     <div className="space-y-2">
@@ -89,22 +96,24 @@ export const Positions = () => (
   </div>
 );
 
-export const WithText = Template.bind({});
-WithText.args = {
-  position: "left",
-  state: "default",
-  showText: true,
-  children: "Active Deals",
+export const WithText = {
+  args: {
+    position: "left",
+    state: "default",
+    showText: true,
+    children: "Active Deals",
+  },
+  render: Template,
 };
-
-export const WithoutText = Template.bind({});
-WithoutText.args = {
-  position: "left",
-  state: "default",
-  showText: false,
-  children: "☰",
+export const WithoutText = {
+  args: {
+    position: "left",
+    state: "default",
+    showText: false,
+    children: "☰",
+  },
+  render: Template,
 };
-
 export const WithIcons = () => (
   <div className="space-y-4">
     <div className="space-y-2">