make options optional & handle unknowns

README.md

@@ -74,11 +74,59 @@ bun i
 
 ## Playground
 
-Run `bun dev` to launch the [examples/run-example.ts](./examples/run-example.ts) CLI, where you can dive into and explore any of the examples listed below. Experiment with @reliverse/prompts by running examples locally or reviewing the linked code:
+Run `bun dev` to launch the [examples/launcher.ts](./examples/launcher.ts) CLI, which helps you to dive into and explore any of the examples listed below. Experiment with @reliverse/prompts by running examples locally or reviewing the linked code:
 
-1. **[1-main-example.ts](./examples/1-main-example.ts)**: A comprehensive example of a CLI application featuring a well styled UI config. This example showcases all available prompt components, with code organized into separate functions and files for better readability and clarity.
-2. **[2-mono-example.ts](./examples/2-mono-example.ts)**: A quiz game example inspired by Fireship's [video](https://youtube.com/watch?v=_oHByo8tiEY). It demonstrates the dynamic capabilities of @reliverse/prompts by using a prompt() that includes all prompt components, so you don't need to import each component separately.
-3. **[3-basic-example.ts](./examples/3-basic-example.ts)**: A simple example highlighting the core functionalities of @reliverse/prompts. The entire implementation is contained within a single file for easy understanding.
+1. **[1-main.ts](./examples/1-main.ts)**: A comprehensive example of a CLI application featuring a well styled UI config. This example showcases all available prompt components, with code organized into separate functions and files for better readability and clarity.
+2. **[2-mono.ts](./examples/2-mono.ts)**: A quiz game example inspired by Fireship's video about CLIs. It demonstrates the dynamic capabilities of @reliverse/prompts by using a prompt() that includes all prompt components, so you don't need to import each component separately.
+3. **[3-relinka.ts](./examples/3-relinka.ts)**: The example which demonstrates how [@reliverse/relinka](https://github.com/reliverse/relinka#readme) extends the possibilities of @reliverse/prompts.
+4. **[4-simple.ts](./examples/4-simple.ts)**: A simple example highlighting the core functionalities of @reliverse/prompts. The entire implementation is contained within a single file for easy understanding.
+
+## Extendable Configuration
+
+**Example Configuration:**
+
+```typescript
+const basicConfig = {
+  titleColor: "cyanBright",
+  titleTypography: "bold",
+  borderColor: "viceGradient",
+} satisfies PromptOptions;
+
+const extendedConfig = {
+  ...basicConfig,
+  contentTypography: "italic",
+  contentColor: "dim",
+} satisfies PromptOptions;
+
+const username = await inputPrompt({
+  id: "username",
+  title: "We're glad you're testing our library!",
+  content: "Let's get to know each other!\nWhat's your username?",
+  schema: schema.properties.username,
+  ...extendedConfig,
+});
+```
+
+## Mono Component
+
+The Mono Component is a special component that includes all other components. It's a great way to get started quickly or to see how all the components work together.
+
+This component requires providing prompt id. To have typesafety use something like the following:
+
+```ts
+export const IDs = {
+  start: "start",
+  username: "username",
+  dir: "dir",
+  spinner: "spinner",
+  password: "password",
+  age: "age",
+  lang: "lang",
+  color: "color",
+  birthday: "birthday",
+  features: "features",
+};
+```
 
 ## Prompts Library Comparison
 
@@ -133,30 +181,6 @@ Run `bun dev` to launch the [examples/run-example.ts](./examples/run-example.ts)
 
 @reliverse/prompts is a versatile library designed to accelerate CLI development by providing customizable prompt components. Integrated into the [Reliverse CLI](https://github.com/blefnk/reliverse#readme), @reliverse/prompts enables you to create a unique design aligned with your CLI app’s aesthetics, similar to how @shadcn/ui supports customizable web UI components. Quickly get started by copying configurations from the [Reliverse Docs](https://docs.reliverse.org/relinka) and using components that fit your project, making it faster to bring your CLI app to life. You’re free to customize each component as desired, with default designs provided to ensure an attractive interface from the start.
 
-**Example Configuration:**
-
-```typescript
-const basicConfig = {
-  titleColor: "cyanBright",
-  titleTypography: "bold",
-  borderColor: "viceGradient",
-} satisfies OptionalPromptOptions;
-
-const extendedConfig = {
-  ...basicConfig,
-  contentTypography: "italic",
-  contentColor: "dim",
-} satisfies OptionalPromptOptions;
-
-const username = await inputPrompt({
-  id: "username",
-  title: "We're glad you're testing our library!",
-  content: "Let's get to know each other!\nWhat's your username?",
-  schema: schema.properties.username,
-  ...extendedConfig,
-});
-```
-
 ## Learn More
 
 - [Temporary Relinka Docs](.github/DOCS.md)

build.publish.ts

@@ -96,10 +96,10 @@ async function bumpNpmVersion() {
 async function main() {
   const { jsr, "dry-run": dryRun } = argv;
   if (jsr) {
-    await bumpJsrVersion();
+    // await bumpJsrVersion();
     await publishJsr(dryRun);
   } else {
-    await bumpNpmVersion();
+    // await bumpNpmVersion();
     await publishNpm(dryRun);
   }
 }

cspell.json

@@ -33,6 +33,7 @@
     "citty",
     "Clooney",
     "cmder",
+    "conemu",
     "confirmtoggle",
     "continuar",
     "cristal",
@@ -67,6 +68,8 @@
     "iife",
     "invertir",
     "Italiano",
+    "iterm",
+    "jediterm",
     "jetbrains",
     "język",
     "jiejie",
@@ -134,6 +137,7 @@
     "venv",
     "Vous",
     "vsprintf",
+    "wezterm",
     "Whoo",
     "Wybrałeś",
     "Yadxh",

examples/main.ts → examples/1-main.ts

@@ -25,6 +25,7 @@ import {
 import { type UserInput } from "@/src/schema.js";
 
 import { errorHandler } from "~/utils/errors.js";
+import { getCurrentTerminalName } from "~/utils/platforms.js";
 
 export async function detailedExample() {
   await showStartPrompt();

examples/deprecated/2-mono-example.ts → examples/2-mono.ts

@@ -1,30 +1,36 @@
 // 2-mono-example.ts: A fun example of a quiz game. Inspired by CLI-game created by Fireship. The example demonstrates how to use a mono prompt() component.
 
-import { createAsciiArt } from "~/components/visual/ascii-art/ascii-art.js";
 import { prompt } from "~/components/mono/mono.js";
 import { spinner } from "~/components/spinner/index.js";
+import { createAsciiArt } from "~/components/visual/ascii-art/ascii-art.js";
+import { animateText, inputPrompt } from "~/main.js";
 import { colorize } from "~/utils/colorize.js";
 import { errorHandler } from "~/utils/errors.js";
 
 async function main() {
+  console.clear();
   await prompt({
     type: "start",
     id: "welcome",
+    title: "Mono Component Example",
+    titleColor: "passionGradient",
+    titleTypography: "bold",
+  });
+
+  await animateText({
     title: "Who Wants to Be a JS Mil?",
+    anim: "rainbow",
     titleColor: "gradientGradient",
-    titleTypography: "bold",
-    titleVariant: "animated",
   });
+
   console.log(`
     ${colorize("HOW TO PLAY", "white", "bold")} 
     I am a process on your computer.
     If you get any question wrong I will be ${colorize("killed", "red", "bold")}
     So get all the questions right...
   `);
 
-  const player_name = await prompt({
-    type: "text",
-    id: "player_name",
+  const player_name = await inputPrompt({
     title: "What is your name?",
     defaultValue: "Player",
   });

examples/relinka.ts → examples/3-relinka.ts

@@ -15,11 +15,13 @@ import { formatTree } from "~/utils/tree.js";
 import { reporterDemo } from "./deprecated/reliverse/experiments/utils/index.js";
 
 async function detailedExample() {
+  console.clear();
+
   // box
   relinka.box("=== box ===");
 
   relinka.box(
-    `Welcome to @reliverse/prompts! You're going to test an 'experimental' example.`,
+    `Welcome to @reliverse/prompts! You're going to test an 'Relinka' example.`,
   );
 
   relinka.box({
@@ -42,7 +44,7 @@ async function detailedExample() {
       { label: "fancy", value: "fancy" },
       { label: "nothing", value: "nothing" },
     ] as const,
-    defaultValue: "nothing",
+    defaultValue: "fancy",
   });
 
   if (reporterType === "basic") {
@@ -66,8 +68,8 @@ async function detailedExample() {
     },
   });
 
-  // range
-  relinka.box("=== range ===");
+  // range (experimental)
+  /* relinka.box("=== range ===");
 
   try {
     const value = await rangePrompt("How much ice cream would you like?", {
@@ -81,7 +83,7 @@ async function detailedExample() {
     console.log(`You chose: ${value} kg`);
   } catch (error) {
     console.log("You aborted, having chosen:", (error as Error).message);
-  }
+  } */
 
   // prompt
   relinka.box("=== prompt ===");
@@ -114,7 +116,7 @@ async function detailedExample() {
       { value: "prettier", label: "Prettier" },
       { value: "gh-action", label: "GitHub Actions" },
     ],
-    initial: ["eslint", "prettier"],
+    defaultValue: ["eslint", "prettier"],
   });
 
   relinka.start("Creating project...");

examples/deprecated/3-basic-example.ts

@@ -2,7 +2,7 @@
 
 import { showSpinner } from "@/src/prompts.js";
 
-import type { OptionalPromptOptions } from "~/types/general.js";
+import type { PromptOptions } from "~/types/general.js";
 
 import { numberPrompt, inputPrompt } from "~/components/prompts/index.js";
 import { errorHandler } from "~/utils/errors.js";
@@ -11,13 +11,13 @@ export const basicConfig = {
   titleColor: "cyanBright",
   titleTypography: "bold",
   borderColor: "viceGradient",
-} satisfies OptionalPromptOptions;
+} satisfies PromptOptions;
 
 export const extendedConfig = {
   ...basicConfig,
   contentTypography: "italic",
   contentColor: "dim",
-} satisfies OptionalPromptOptions;
+} satisfies PromptOptions;
 
 async function main() {
   await inputPrompt({

examples/deprecated/reliverse/experiments/state/ui/number-with-hooks.ts

@@ -27,7 +27,7 @@ export async function numberPrompt<T extends TSchema>(
     titleVariant,
     content,
     contentColor,
-    contentTypography,
+    contentTypography = "italic",
     contentVariant,
   } = options;
 

examples/deprecated/reliverse/experiments/state/ui/number-with-state.ts

@@ -27,8 +27,8 @@ export async function numberPrompt<T extends TSchema>(
     titleTypography,
     titleVariant,
     content,
-    contentColor,
-    contentTypography,
+    contentColor = "dim",
+    contentTypography = "italic",
     contentVariant,
     state: initialState = "initial",
   } = options;

examples/deprecated/reliverse/experiments/state/ui/start-with-erase.ts

@@ -24,8 +24,8 @@ export async function startPrompt(
     titleTypography,
     titleVariant,
     content,
-    contentColor,
-    contentTypography,
+    contentColor = "dim",
+    contentTypography = "italic",
     contentVariant,
     variantOptions,
   } = options;

examples/deprecated/reliverse/experiments/state/ui/start-with-hooks.ts

@@ -17,8 +17,8 @@ export async function startPrompt(
     titleTypography,
     titleVariant,
     content,
-    contentColor,
-    contentTypography,
+    contentColor = "dim",
+    contentTypography = "italic",
     contentVariant,
     variantOptions,
   } = options;

examples/deprecated/reliverse/experiments/state/ui/text-with-erase.ts

@@ -33,8 +33,8 @@ export async function inputPrompt<T extends TSchema>(
     titleColor,
     titleTypography,
     content,
-    contentColor,
-    contentTypography,
+    contentColor = "dim",
+    contentTypography = "italic",
     titleVariant,
     contentVariant,
     action,

examples/deprecated/reliverse/experiments/state/ui/text-with-hooks.ts

@@ -32,8 +32,8 @@ export async function inputPrompt<T extends TSchema>(
     titleColor,
     titleTypography,
     content,
-    contentColor,
-    contentTypography,
+    contentColor = "dim",
+    contentTypography = "italic",
     titleVariant,
     contentVariant,
     defaultColor,

examples/deprecated/reliverse/experiments/state/ui/text-with-state.ts

@@ -32,8 +32,8 @@ export async function inputPrompt<T extends TSchema>(
     titleColor,
     titleTypography,
     content,
-    contentColor,
-    contentTypography,
+    contentColor = "dim",
+    contentTypography = "italic",
     titleVariant,
     contentVariant,
     action,