From 5116ef9e2afaf7a019884ee456891f9cd545e1e0 Mon Sep 17 00:00:00 2001
From: Paul Valladares <85648028+dreyfus92@users.noreply.github.com>
Date: Fri, 21 Mar 2025 15:06:29 -0600
Subject: [PATCH] refactor: enhance examples with isCancel checks and type
 adjustments

---
 src/content/docs/guides/examples.mdx | 26 +++++++++++++-------------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/content/docs/guides/examples.mdx b/src/content/docs/guides/examples.mdx
index 8a7ca64..1a893ae 100644
--- a/src/content/docs/guides/examples.mdx
+++ b/src/content/docs/guides/examples.mdx
@@ -10,14 +10,14 @@ This guide provides practical examples of using Clack in different scenarios.
 ### Simple Text Input
 
 ```ts twoslash
-import { text } from '@clack/prompts';
+import { text, isCancel } from '@clack/prompts';
 
 const name = await text({
   message: 'What is your name?',
   placeholder: 'John Doe',
-}) as string;
+});
 
-console.log(`Hello, ${name}!`);
+console.log(`Hello, ${isCancel(name)}!`);
 ```
 
 ### Selection Menu
@@ -40,7 +40,7 @@ if (isCancel(framework)) {
 }
 
 // Convert to string before using in template literal
-const frameworkStr = String(framework);
+const frameworkStr = isCancel(framework);
 console.log(`You selected ${frameworkStr}`);
 ```
 
@@ -75,7 +75,7 @@ async function setupProject() {
       if (value.length === 0) return 'Name is required';
       return undefined;
     },
-  }) as string;
+  });
 
   const type = await select({
     message: 'Project type:',
@@ -111,7 +111,7 @@ async function setupProject() {
 
   // Confirm setup
   const shouldProceed = await confirm({
-    message: `Create ${String(type)} project "${name}"${framework ? ` with ${String(framework)}` : ''}?`,
+    message: `Create ${isCancel(type)} project "${isCancel(name)}"${framework ? ` with ${isCancel(framework)}` : ''}?`,
   });
 
   if (shouldProceed) {
@@ -246,9 +246,9 @@ async function cliTool() {
 import { text, select, isCancel } from '@clack/prompts';
 
 interface UserData {
-  name: string | symbol;
-  email: string | symbol;
-  age: number;
+  name: string;
+  email: string;
+  age: string;
   role: string;
 }
 
@@ -279,7 +279,7 @@ async function collectUserData(): Promise<UserData> {
       if (num < 18 || num > 100) return 'Age must be between 18 and 100';
       return undefined;
     },
-  });
+  })
 
   const role = await select({
     message: 'Select role:',
@@ -290,7 +290,7 @@ async function collectUserData(): Promise<UserData> {
     ],
   });
 
-  if (isCancel(role)) {
+  if (isCancel(role) || isCancel(name) || isCancel(email) || isCancel(age)) {
     console.log('Operation cancelled');
     process.exit(0);
   }
@@ -298,8 +298,8 @@ async function collectUserData(): Promise<UserData> {
   return {
     name,
     email,
-    age: Number(age),
-    role: String(role),
+    age,
+    role,
   };
 }
 ``` 
\ No newline at end of file
-- 
2.51.2