Update create flow pages

stories/pages/CardsPage.stories.js

@@ -1,8 +1,8 @@
-import CardsPage from "../../app/create/cards/page";
+import { CardsScreen } from "../../app/create/screens/card/CardsScreen";
 
 export default {
   title: "Pages/Create Flow/Cards",
-  component: CardsPage,
+  component: CardsScreen,
   parameters: {
     layout: "fullscreen",
     docs: {

stories/pages/CompletedPage.stories.js

@@ -1,8 +1,8 @@
-import CompletedPage from "../../app/create/completed/page";
+import { CompletedScreen } from "../../app/create/screens/completed/CompletedScreen";
 
 export default {
   title: "Pages/Create Flow/Completed",
-  component: CompletedPage,
+  component: CompletedScreen,
   parameters: {
     layout: "fullscreen",
     docs: {

stories/pages/ConfirmStakeholdersPage.stories.js

@@ -1,8 +1,8 @@
-import ConfirmStakeholdersPage from "../../app/create/confirm-stakeholders/page";
+import { ConfirmStakeholdersScreen } from "../../app/create/screens/select/ConfirmStakeholdersScreen";
 
 export default {
   title: "Pages/Create Flow/Confirm stakeholders",
-  component: ConfirmStakeholdersPage,
+  component: ConfirmStakeholdersScreen,
   parameters: {
     layout: "fullscreen",
     docs: {

stories/pages/FinalReviewPage.stories.js

@@ -1,8 +1,8 @@
-import FinalReviewPage from "../../app/create/final-review/page";
+import { FinalReviewScreen } from "../../app/create/screens/review/FinalReviewScreen";
 
 export default {
   title: "Pages/Create Flow/Final review",
-  component: FinalReviewPage,
+  component: FinalReviewScreen,
   parameters: {
     layout: "fullscreen",
     docs: {

stories/pages/InformationalPage.stories.js

@@ -1,35 +1,9 @@
-import InformationalPage from "../../app/create/informational/page";
+import { InformationalScreen } from "../../app/create/screens/informational/InformationalScreen";
 
 export default {
-  title: "Pages/Create Flow/Informational",
-  component: InformationalPage,
-  parameters: {
-    layout: "fullscreen",
-    docs: {
-      description: {
-        component:
-          "Create flow entry: HeaderLockup + NumberedList. Responsive L/M and M/S at 640px.",
-      },
-    },
-  },
-  decorators: [
-    (Story) => (
-      <div className="min-h-screen bg-black flex items-center justify-center">
-        <Story />
-      </div>
-    ),
-  ],
-  tags: ["autodocs"],
+  title: "Pages/Create/Informational",
+  component: InformationalScreen,
+  parameters: { layout: "fullscreen" },
 };
 
-export const Desktop = {
-  parameters: {
-    viewport: { defaultViewport: "desktop" },
-  },
-};
-
-export const Mobile = {
-  parameters: {
-    viewport: { defaultViewport: "mobile1" },
-  },
-};
+export const Default = {};

stories/pages/ReviewPage.stories.js

@@ -1,39 +1,9 @@
-import ReviewPage from "../../app/create/review/page";
+import { CommunityReviewScreen } from "../../app/create/screens/review/CommunityReviewScreen";
 
 export default {
-  title: "Pages/Create Flow/Review",
-  component: ReviewPage,
-  parameters: {
-    layout: "fullscreen",
-    docs: {
-      description: {
-        component:
-          "Mid-flow review step (after upload). 640px+: HeaderLockup left (L), RuleCard right (L, collapsed). Below 640px: single column with HeaderLockup M and RuleCard M. Figma: 19688-13891, 19706-12120.",
-      },
-    },
-  },
-  decorators: [
-    (Story) => (
-      <div className="min-h-screen bg-black flex items-center justify-center">
-        <Story />
-      </div>
-    ),
-  ],
-  tags: ["autodocs"],
+  title: "Pages/Create/Review",
+  component: CommunityReviewScreen,
+  parameters: { layout: "fullscreen" },
 };
 
-export const Desktop = {
-  parameters: {
-    viewport: {
-      defaultViewport: "desktop",
-    },
-  },
-};
-
-export const Mobile = {
-  parameters: {
-    viewport: {
-      defaultViewport: "mobile1",
-    },
-  },
-};
+export const Default = {};

stories/pages/RightRailPage.stories.js

@@ -1,8 +1,8 @@
-import RightRailPage from "../../app/create/right-rail/page";
+import { RightRailScreen } from "../../app/create/screens/right-rail/RightRailScreen";
 
 export default {
   title: "Pages/Create Flow/Right rail",
-  component: RightRailPage,
+  component: RightRailScreen,
   parameters: {
     layout: "fullscreen",
     docs: {

stories/pages/SelectPage.stories.js

@@ -1,35 +1,9 @@
-import SelectPage from "../../app/create/select/page";
+import { CommunitySizeSelectScreen } from "../../app/create/screens/select/CommunitySizeSelectScreen";
 
 export default {
-  title: "Pages/Create Flow/Select",
-  component: SelectPage,
-  parameters: {
-    layout: "fullscreen",
-    docs: {
-      description: {
-        component:
-          "Multi-select template: two columns at 640px+, stacked below. MultiSelect with add → custom chip.",
-      },
-    },
-  },
-  decorators: [
-    (Story) => (
-      <div className="min-h-screen bg-black flex items-center justify-center">
-        <Story />
-      </div>
-    ),
-  ],
-  tags: ["autodocs"],
+  title: "Pages/Create/CommunitySize",
+  component: CommunitySizeSelectScreen,
+  parameters: { layout: "fullscreen" },
 };
 
-export const Desktop = {
-  parameters: {
-    viewport: { defaultViewport: "desktop" },
-  },
-};
-
-export const Mobile = {
-  parameters: {
-    viewport: { defaultViewport: "mobile1" },
-  },
-};
+export const Default = {};

stories/pages/TextPage.stories.js

@@ -1,35 +1,15 @@
-import TextPage from "../../app/create/text/page";
+import { CreateFlowTextFieldScreen } from "../../app/create/screens/text/CreateFlowTextFieldScreen";
 
 export default {
-  title: "Pages/Create Flow/Text",
-  component: TextPage,
-  parameters: {
-    layout: "fullscreen",
-    docs: {
-      description: {
-        component:
-          "Community name step: HeaderLockup + TextInput. Responsive sizing at 640px.",
-      },
-    },
-  },
-  decorators: [
-    (Story) => (
-      <div className="min-h-screen bg-black flex items-center justify-center">
-        <Story />
-      </div>
-    ),
-  ],
-  tags: ["autodocs"],
+  title: "Pages/Create/CommunityName",
+  component: CreateFlowTextFieldScreen,
+  parameters: { layout: "fullscreen" },
 };
 
-export const Desktop = {
-  parameters: {
-    viewport: { defaultViewport: "desktop" },
-  },
-};
-
-export const Mobile = {
-  parameters: {
-    viewport: { defaultViewport: "mobile1" },
+export const Default = {
+  args: {
+    messageNamespace: "create.communityName",
+    stateField: "title",
+    maxLength: 48,
   },
 };

stories/pages/UploadPage.stories.js

@@ -1,35 +1,9 @@
-import UploadPage from "../../app/create/upload/page";
+import { CommunityUploadScreen } from "../../app/create/screens/upload/CommunityUploadScreen";
 
 export default {
-  title: "Pages/Create Flow/Upload",
-  component: UploadPage,
-  parameters: {
-    layout: "fullscreen",
-    docs: {
-      description: {
-        component:
-          "Upload step: HeaderLockup + Upload control. Centered lockup at 640px+.",
-      },
-    },
-  },
-  decorators: [
-    (Story) => (
-      <div className="min-h-screen bg-black flex items-center justify-center">
-        <Story />
-      </div>
-    ),
-  ],
-  tags: ["autodocs"],
+  title: "Pages/Create/CommunityUpload",
+  component: CommunityUploadScreen,
+  parameters: { layout: "fullscreen" },
 };
 
-export const Desktop = {
-  parameters: {
-    viewport: { defaultViewport: "desktop" },
-  },
-};
-
-export const Mobile = {
-  parameters: {
-    viewport: { defaultViewport: "mobile1" },
-  },
-};
+export const Default = {};