diff --git a/package-lock.json b/package-lock.json
index 613607c..bdfd91e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,7 +14,7 @@
 				"@hotwired/turbo": "^8.0.2",
 				"@koa/router": "^12.0.1",
 				"@playwright/test": "^1.36.1",
-				"@sealcode/jdd": "^0.2.10",
+				"@sealcode/jdd": "^0.2.12",
 				"@sealcode/sealgen": "^0.11.7",
 				"@sealcode/ts-predicates": "^0.4.3",
 				"@types/kill-port": "^2.0.0",
@@ -1278,9 +1278,9 @@
 			}
 		},
 		"node_modules/@sealcode/jdd": {
-			"version": "0.2.10",
-			"resolved": "https://registry.npmjs.org/@sealcode/jdd/-/jdd-0.2.10.tgz",
-			"integrity": "sha512-8dQfskMUqotrh9Fbnk2sBcXJ12gXNM1ENPvrQOOX6VabXgE7eQc9gAZgmkcgA2prEwn1vbfpo+Lz9wxzpHOLDQ==",
+			"version": "0.2.12",
+			"resolved": "https://registry.npmjs.org/@sealcode/jdd/-/jdd-0.2.12.tgz",
+			"integrity": "sha512-iYJnnfRBu5dXnSRnyhdxb4DVCv3oKv0AK4RVxss9Dmk5JlEdx85Vwi4H9FzOu16r9fQY2jjTw2Z7t5sk56gZ3A==",
 			"dependencies": {
 				"@sealcode/ts-predicates": "^0.5.3",
 				"marked": "^12.0.0",
diff --git a/package.json b/package.json
index aa9b9f7..47a80ef 100644
--- a/package.json
+++ b/package.json
@@ -35,7 +35,7 @@
 		"@hotwired/turbo": "^8.0.2",
 		"@koa/router": "^12.0.1",
 		"@playwright/test": "^1.36.1",
-		"@sealcode/jdd": "^0.2.10",
+		"@sealcode/jdd": "^0.2.12",
 		"@sealcode/sealgen": "^0.11.7",
 		"@sealcode/ts-predicates": "^0.4.3",
 		"@types/kill-port": "^2.0.0",
diff --git a/src/back/routes/components.sreact.tsx b/src/back/routes/components.sreact.tsx
index 933da72..6ae99c1 100644
--- a/src/back/routes/components.sreact.tsx
+++ b/src/back/routes/components.sreact.tsx
@@ -102,7 +102,7 @@ export default new (class ComponentsPage extends StatefulPage<State, typeof acti
 						label: "➕",
 					},
 					arg_path,
-					arg.item_type.getEmptyValue()
+					arg.item_type.getExampleValue()
 				)}
 			</fieldset>
 		);
@@ -236,7 +236,9 @@ export default new (class ComponentsPage extends StatefulPage<State, typeof acti
 								state,
 								[arg_name],
 								arg,
-								state.args[arg_name]
+								state.args[arg_name] === undefined
+									? arg.getExampleValue()
+									: state.args[arg_name]
 							)
 						)}
 						<input type="submit" value="Preview" />