[CORE-152] Add form flow editor

package.json

@@ -24,6 +24,7 @@
 		"@radix-ui/react-dialog": "^1.1.15",
 		"@radix-ui/react-dropdown-menu": "^2.1.16",
 		"@radix-ui/react-label": "^2.1.8",
+		"@radix-ui/react-popover": "^1.1.15",
 		"@radix-ui/react-progress": "^1.1.8",
 		"@radix-ui/react-radio-group": "^1.3.8",
 		"@radix-ui/react-select": "^2.2.6",
@@ -36,7 +37,8 @@
 		"lucide-react": "^0.562.0",
 		"react": "^19.2.4",
 		"react-dom": "^19.2.4",
-		"react-router-dom": "^7.13.0"
+		"react-router-dom": "^7.13.0",
+		"uuid": "^13.0.0"
 	},
 	"devDependencies": {
 		"@eslint/js": "^9.39.2",

src/features/dashboard/components/ComponentsDemo.tsx

@@ -12,6 +12,7 @@ import {
 	FileUpload,
 	Input,
 	Label,
+	Popover,
 	ProgressBar,
 	Radio,
 	RadioCard,
@@ -243,6 +244,15 @@ export const ComponentsDemo = () => {
 							<cite>— Author Name</cite>
 						</blockquote>
 					</section>
+
+					<section className={styles.section}>
+						<h2>Popover</h2>
+						<div className={styles.row}>
+							<Popover content={<p>This is the content of the popover.</p>}>
+								<Button>Open Popover</Button>
+							</Popover>
+						</div>
+					</section>
 				</div>
 			</UserLayout>
 		</ToastProvider>

src/features/form/components/AdminFormDetailPages/EditPage.module.css

@@ -0,0 +1,9 @@
+.description {
+	padding: 0;
+	padding-left: 1rem;
+}
+
+.flowContainer {
+	display: flex;
+	justify-content: center;
+}