create-foldkit-app 0.32.0 → 0.32.1

package/dist/templates/examples/routing/src/page/people.ts

@@ -1,12 +1,4 @@
-import {
-  Array,
-  Duration,
-  Effect,
-  Option,
-  Schema as S,
-  String,
-  pipe,
-} from 'effect'
+import { Array, Duration, Effect, Option, Schema, String, pipe } from 'effect'
 import { Command, Submodel, type Update } from 'foldkit'
 import { Html, HtmlBuilder } from 'foldkit/html'
 import { defineMessageUnion } from 'foldkit/message'
@@ -25,10 +17,10 @@ import {
 
 // DOMAIN
 
-const Person = S.Struct({
-  id: S.Number,
-  name: S.String,
-  role: S.String,
+const Person = Schema.Struct({
+  id: Schema.Number,
+  name: Schema.String,
+  role: Schema.String,
 })
 type Person = typeof Person.Type
 
@@ -83,13 +75,13 @@ export const findPerson = (id: number) =>
 
 export const SearchResults = defineTaggedUnion({
   Loading: {},
-  Loaded: { query: S.String, people: S.Array(Person) },
+  Loaded: { query: Schema.String, people: Schema.Array(Person) },
 })
 export type SearchResults = typeof SearchResults.Type
 
-export const Model = S.Struct({
-  searchInput: S.String,
-  searchHistory: S.Array(S.String),
+export const Model = Schema.Struct({
+  searchInput: Schema.String,
+  searchHistory: Schema.Array(Schema.String),
   results: SearchResults,
 })
 export type Model = typeof Model.Type
@@ -97,12 +89,12 @@ export type Model = typeof Model.Type
 // MESSAGE
 
 export const Message = defineMessageUnion({
-  ChangedSearchInput: { value: S.String },
+  ChangedSearchInput: { value: Schema.String },
   SubmittedSearch: {},
   ChangedRoute: { route: AppRoute.People },
   SucceededFetchPeople: {
-    query: S.String,
-    people: S.Array(Person),
+    query: Schema.String,
+    people: Schema.Array(Person),
   },
   CompletedPushSearchUrl: {},
 })
@@ -128,7 +120,7 @@ export const init = (route: PeopleRoute): InitReturn => {
 // COMMAND
 
 export const PushSearchUrl = Command.define('PushSearchUrl', {
-  args: { searchText: S.Option(S.String) },
+  args: { searchText: Schema.Option(Schema.String) },
   messages: [Message.CompletedPushSearchUrl],
   execute: ({ searchText }) =>
     pushUrl(peopleRouter({ searchText })).pipe(
@@ -137,7 +129,7 @@ export const PushSearchUrl = Command.define('PushSearchUrl', {
 })
 
 export const FetchPeople = Command.define('FetchPeople', {
-  args: { searchText: S.String },
+  args: { searchText: Schema.String },
   messages: [Message.SucceededFetchPeople],
   execute: ({ searchText }) =>
     Effect.sleep(SEARCH_LATENCY).pipe(

package/dist/templates/examples/routing/src/route.ts

@@ -1,15 +1,15 @@
-import { Schema as S, pipe } from 'effect'
+import { Schema, pipe } from 'effect'
 import { Route } from 'foldkit'
 import { defineRouteUnion, int, literal, rest, slash } from 'foldkit/route'
 
 export const AppRoute = defineRouteUnion({
   Home: {},
   Nested: {},
-  People: { searchText: S.Option(S.String) },
-  Person: { personId: S.Number },
+  People: { searchText: Schema.Option(Schema.String) },
+  Person: { personId: Schema.Number },
   FilesIndex: {},
-  Files: { path: S.NonEmptyArray(S.String) },
-  NotFound: { path: S.String },
+  Files: { path: Schema.NonEmptyArray(Schema.String) },
+  NotFound: { path: Schema.String },
 })
 
 export type AppRoute = typeof AppRoute.Type
@@ -29,8 +29,8 @@ export const nestedRouter = pipe(
 export const peopleRouter = pipe(
   literal('people'),
   Route.query(
-    S.Struct({
-      searchText: S.OptionFromOptional(S.String),
+    Schema.Struct({
+      searchText: Schema.OptionFromOptional(Schema.String),
     }),
   ),
   Route.mapTo(AppRoute.People),

package/dist/templates/examples/shopping-cart/src/main.ts

@@ -1,4 +1,4 @@
-import { Effect, Match as M, Option, Schema as S } from 'effect'
+import { Effect, Match, Option, Schema } from 'effect'
 import { Command, Runtime, Update } from 'foldkit'
 import { Document, Html, HtmlBuilder } from 'foldkit/html'
 import { defineMessageUnion } from 'foldkit/message'
@@ -19,11 +19,11 @@ import {
 
 // MODEL
 
-export const Model = S.Struct({
+export const Model = Schema.Struct({
   route: AppRoute,
   cart: Cart.Cart,
-  deliveryInstructions: S.String,
-  orderPlaced: S.Boolean,
+  deliveryInstructions: Schema.String,
+  orderPlaced: Schema.Boolean,
   productsPage: Products.Model,
 })
 export type Model = typeof Model.Type
@@ -36,11 +36,11 @@ export const Message = defineMessageUnion({
   ClickedLink: { request: UrlRequest },
   ChangedUrl: { url: Url },
   GotProductsMessage: { message: Products.Message },
-  ClickedIncrementQuantity: { itemId: S.String },
-  ClickedDecrementQuantity: { itemId: S.String },
-  ClickedRemoveCartItem: { itemId: S.String },
+  ClickedIncrementQuantity: { itemId: Schema.String },
+  ClickedDecrementQuantity: { itemId: Schema.String },
+  ClickedRemoveCartItem: { itemId: Schema.String },
   ClickedClearCart: {},
-  UpdatedDeliveryInstructions: { value: S.String },
+  UpdatedDeliveryInstructions: { value: Schema.String },
   ClickedPlaceOrder: {},
 })
 
@@ -65,14 +65,14 @@ export const init: Runtime.RoutingApplicationInit<Model, Message> = (
 // COMMAND
 
 const NavigateInternal = Command.define('NavigateInternal', {
-  args: { url: S.String },
+  args: { url: Schema.String },
   messages: [Message.CompletedNavigateInternal],
   execute: ({ url }) =>
     pushUrl(url).pipe(Effect.as(Message.CompletedNavigateInternal())),
 })
 
 const LoadExternal = Command.define('LoadExternal', {
-  args: { href: S.String },
+  args: { href: Schema.String },
   messages: [Message.CompletedLoadExternal],
   execute: ({ href }) =>
     load(href).pipe(Effect.as(Message.CompletedLoadExternal())),
@@ -82,24 +82,23 @@ const LoadExternal = Command.define('LoadExternal', {
 
 type UpdateReturn = Update.Return<Model, Message>
 
-const foldProductsOutMessage = M.type<Products.OutMessage>().pipe(
-  M.withReturnType<Update.Step<Model, Message>>(),
-  M.tagsExhaustive({
-    AddedToCart:
-      ({ item }) =>
-      model => ({ model: evo(model, { cart: Cart.addItem(item) }) }),
-    IncrementedQuantity:
-      ({ itemId }) =>
-      model => ({
-        model: evo(model, { cart: Cart.incrementQuantity(itemId) }),
-      }),
-    DecrementedQuantity:
-      ({ itemId }) =>
-      model => ({
-        model: evo(model, { cart: Cart.decrementQuantity(itemId) }),
-      }),
-  }),
-)
+const foldProductsOutMessage = Products.OutMessage.match<
+  Update.Step<Model, Message>
+>({
+  AddedToCart:
+    ({ item }) =>
+    model => ({ model: evo(model, { cart: Cart.addItem(item) }) }),
+  IncrementedQuantity:
+    ({ itemId }) =>
+    model => ({
+      model: evo(model, { cart: Cart.incrementQuantity(itemId) }),
+    }),
+  DecrementedQuantity:
+    ({ itemId }) =>
+    model => ({
+      model: evo(model, { cart: Cart.decrementQuantity(itemId) }),
+    }),
+})
 
 const foldProducts = Update.foldChild({
   update: Products.update,
@@ -271,9 +270,9 @@ const notFoundView = (path: string, h: HtmlBuilder<Message>): Html =>
   )
 
 const routeTitle = (route: Model['route']): string =>
-  M.value(route).pipe(
-    M.tag('Products', () => 'Shopping Cart'),
-    M.orElse(({ _tag }) => `${_tag} | Shopping Cart`),
+  Match.value(route).pipe(
+    Match.tag('Products', () => 'Shopping Cart'),
+    Match.orElse(({ _tag }) => `${_tag} | Shopping Cart`),
   )
 
 export const view = (model: Model, h: HtmlBuilder<Message>): Document => {

package/dist/templates/examples/shopping-cart/src/page/products.ts

@@ -1,4 +1,4 @@
-import { Array, Effect, Option, Schema as S } from 'effect'
+import { Array, Effect, Option, Schema } from 'effect'
 import { Command, Submodel, type Update } from 'foldkit'
 import { defineMessageUnion } from 'foldkit/message'
 import { replaceUrl } from 'foldkit/navigation'
@@ -11,9 +11,9 @@ import { cartRouter, productsRouter } from '../route'
 
 // MODEL
 
-export const Model = S.Struct({
-  products: S.Array(Item.Item),
-  searchText: S.String,
+export const Model = Schema.Struct({
+  products: Schema.Array(Item.Item),
+  searchText: Schema.String,
 })
 export type Model = typeof Model.Type
 
@@ -21,10 +21,10 @@ export type Model = typeof Model.Type
 
 export const Message = defineMessageUnion({
   CompletedReplaceSearchUrl: {},
-  ChangedSearchInput: { value: S.String },
+  ChangedSearchInput: { value: Schema.String },
   ClickedAddToCart: { item: Item.Item },
-  ClickedIncrementQuantity: { itemId: S.String },
-  ClickedDecrementQuantity: { itemId: S.String },
+  ClickedIncrementQuantity: { itemId: Schema.String },
+  ClickedDecrementQuantity: { itemId: Schema.String },
 })
 
 export type Message = typeof Message.Type
@@ -33,8 +33,8 @@ export type Message = typeof Message.Type
 
 export const OutMessage = defineMessageUnion({
   AddedToCart: { item: Item.Item },
-  IncrementedQuantity: { itemId: S.String },
-  DecrementedQuantity: { itemId: S.String },
+  IncrementedQuantity: { itemId: Schema.String },
+  DecrementedQuantity: { itemId: Schema.String },
 })
 
 export type OutMessage = typeof OutMessage.Type
@@ -53,7 +53,7 @@ export const init = (products: ReadonlyArray<Item.Item>): Model => ({
 // COMMAND
 
 const ReplaceSearchUrl = Command.define('ReplaceSearchUrl', {
-  args: { url: S.String },
+  args: { url: Schema.String },
   messages: [Message.CompletedReplaceSearchUrl],
   execute: ({ url }) =>
     replaceUrl(url).pipe(Effect.as(Message.CompletedReplaceSearchUrl())),

package/dist/templates/examples/shopping-cart/src/route.ts

@@ -1,14 +1,14 @@
-import { Schema as S, pipe } from 'effect'
+import { Schema, pipe } from 'effect'
 import { Route } from 'foldkit'
 import { defineRouteUnion, literal } from 'foldkit/route'
 
 // ROUTE
 
 export const AppRoute = defineRouteUnion({
-  Products: { searchText: S.Option(S.String) },
+  Products: { searchText: Schema.Option(Schema.String) },
   Cart: {},
   Checkout: {},
-  NotFound: { path: S.String },
+  NotFound: { path: Schema.String },
 })
 
 export type AppRoute = typeof AppRoute.Type
@@ -17,7 +17,9 @@ export type AppRoute = typeof AppRoute.Type
 
 export const productsRouter = pipe(
   Route.root,
-  Route.query(S.Struct({ searchText: S.OptionFromOptional(S.String) })),
+  Route.query(
+    Schema.Struct({ searchText: Schema.OptionFromOptional(Schema.String) }),
+  ),
   Route.mapTo(AppRoute.Products),
 )
 export const cartRouter = pipe(literal('cart'), Route.mapTo(AppRoute.Cart))

package/dist/templates/examples/slow-warnings/src/main.ts

@@ -1,12 +1,4 @@
-import {
-  Array,
-  Match as M,
-  Number,
-  Option,
-  Schema as S,
-  Stream,
-  pipe,
-} from 'effect'
+import { Array, Match, Number, Option, Schema, Stream, pipe } from 'effect'
 import { Runtime, Subscription, type Update } from 'foldkit'
 import { type Document, type Html, HtmlBuilder, createLazy } from 'foldkit/html'
 import { defineMessageUnion } from 'foldkit/message'
@@ -19,7 +11,7 @@ const PATCH_ROW_COUNT = 4000
 const MAX_WARNING_COUNT = 8
 const SLOW_WARNING_EVENT = 'foldkit:slow-warning'
 
-const Workload = S.Literals([
+const Workload = Schema.Literals([
   'Idle',
   'Update',
   'View',
@@ -30,29 +22,29 @@ type Workload = typeof Workload.Type
 
 type SlowPhase = Runtime.SlowPhase
 
-export const SlowWarningReport = S.Struct({
+export const SlowWarningReport = Schema.Struct({
   phase: Runtime.SlowPhase,
-  durationMs: S.Number,
-  thresholdMs: S.Number,
-  trigger: S.String,
-  details: S.String,
+  durationMs: Schema.Number,
+  thresholdMs: Schema.Number,
+  trigger: Schema.String,
+  details: Schema.String,
 })
 export type SlowWarningReport = typeof SlowWarningReport.Type
 
-export const SlowWarning = S.Struct({
-  id: S.Number,
+export const SlowWarning = Schema.Struct({
+  id: Schema.Number,
   ...SlowWarningReport.fields,
 })
 export type SlowWarning = typeof SlowWarning.Type
 
 // MODEL
 
-export const Model = S.Struct({
+export const Model = Schema.Struct({
   activeWorkload: Workload,
-  nextWarningId: S.Number,
-  warnings: S.Array(SlowWarning),
-  patchRows: S.Number,
-  patchRun: S.Number,
+  nextWarningId: Schema.Number,
+  warnings: Schema.Array(SlowWarning),
+  patchRows: Schema.Number,
+  patchRun: Schema.Number,
 })
 export type Model = typeof Model.Type
 
@@ -93,9 +85,9 @@ const maybeMessageTrigger = (message: Option.Option<Message>): string =>
 const triggerForSlowContext = (
   context: Runtime.SlowContext<Model, Message>,
 ): string =>
-  M.value(context).pipe(
-    M.withReturnType<string>(),
-    M.tagsExhaustive({
+  Match.value(context).pipe(
+    Match.withReturnType<string>(),
+    Match.tagsExhaustive({
       Update: ({ message }) => messageToTag(message),
       View: ({ message }) => maybeMessageTrigger(message),
       Patch: ({ message }) => maybeMessageTrigger(message),
@@ -106,9 +98,9 @@ const triggerForSlowContext = (
 const detailsForSlowContext = (
   context: Runtime.SlowContext<Model, Message>,
 ): string =>
-  M.value(context).pipe(
-    M.withReturnType<string>(),
-    M.tagsExhaustive({
+  Match.value(context).pipe(
+    Match.withReturnType<string>(),
+    Match.tagsExhaustive({
       Update: () =>
         'CPU work ran inside update before Foldkit could return the next Model.',
       View: () =>
@@ -121,13 +113,13 @@ const detailsForSlowContext = (
   )
 
 const phaseLabel = (phase: SlowPhase): string =>
-  M.value(phase).pipe(
-    M.withReturnType<string>(),
-    M.when('Update', () => 'Update'),
-    M.when('View', () => 'View'),
-    M.when('Patch', () => 'Patch'),
-    M.when('SubscriptionDependencies', () => 'Subscription dependencies'),
-    M.exhaustive,
+  Match.value(phase).pipe(
+    Match.withReturnType<string>(),
+    Match.when('Update', () => 'Update'),
+    Match.when('View', () => 'View'),
+    Match.when('Patch', () => 'Patch'),
+    Match.when('SubscriptionDependencies', () => 'Subscription dependencies'),
+    Match.exhaustive,
   )
 
 const slowContextToReport = (
@@ -235,7 +227,7 @@ export const subscriptions = Subscription.make<Model, Message>()(entry => ({
       toMessage: event =>
         pipe(
           event.detail,
-          S.decodeUnknownOption(SlowWarningReport),
+          Schema.decodeUnknownOption(SlowWarningReport),
           Option.map(report => Message.RecordedSlowWarning({ report })),
         ),
     }),
@@ -270,16 +262,16 @@ const secondaryButtonClass =
   'inline-flex items-center justify-center rounded-md border border-zinc-300 bg-white px-3 py-2 text-sm font-semibold text-zinc-900 transition hover:bg-zinc-100 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-zinc-950'
 
 const phaseAccentClass = (phase: SlowPhase): string =>
-  M.value(phase).pipe(
-    M.withReturnType<string>(),
-    M.when('Update', () => 'border-amber-400 bg-amber-50 text-amber-950'),
-    M.when('View', () => 'border-sky-400 bg-sky-50 text-sky-950'),
-    M.when('Patch', () => 'border-rose-400 bg-rose-50 text-rose-950'),
-    M.when(
+  Match.value(phase).pipe(
+    Match.withReturnType<string>(),
+    Match.when('Update', () => 'border-amber-400 bg-amber-50 text-amber-950'),
+    Match.when('View', () => 'border-sky-400 bg-sky-50 text-sky-950'),
+    Match.when('Patch', () => 'border-rose-400 bg-rose-50 text-rose-950'),
+    Match.when(
       'SubscriptionDependencies',
       () => 'border-emerald-400 bg-emerald-50 text-emerald-950',
     ),
-    M.exhaustive,
+    Match.exhaustive,
   )
 
 const burnCpuDuringView = (workload: Workload): void => {

package/dist/templates/examples/snake/src/domain/snake.ts

@@ -1,11 +1,11 @@
-import { Array, Schema as S } from 'effect'
+import { Array, Schema } from 'effect'
 
 import type { Direction } from './direction'
 import * as Position from './position'
 
 export const INITIAL_LENGTH = 3
 
-export const Snake = S.NonEmptyArray(Position.Position)
+export const Snake = Schema.NonEmptyArray(Position.Position)
 export type Snake = typeof Snake.Type
 
 export const create = (startPos: Position.Position): Snake =>

package/dist/templates/examples/snake/src/main.ts

@@ -1,12 +1,4 @@
-import {
-  Array,
-  Duration,
-  Effect,
-  Match as M,
-  Schema as S,
-  Stream,
-  pipe,
-} from 'effect'
+import { Array, Duration, Effect, Match, Schema, Stream, pipe } from 'effect'
 import { Command, Runtime, Subscription, type Update } from 'foldkit'
 import { Document, Html, HtmlBuilder } from 'foldkit/html'
 import { defineMessageUnion } from 'foldkit/message'
@@ -17,7 +9,7 @@ import { Apple, Direction, Position, Snake } from './domain'
 
 // MODEL
 
-export const GameState = S.Literals([
+export const GameState = Schema.Literals([
   'NotStarted',
   'Playing',
   'Paused',
@@ -25,14 +17,14 @@ export const GameState = S.Literals([
 ])
 export type GameState = typeof GameState.Type
 
-export const Model = S.Struct({
+export const Model = Schema.Struct({
   snake: Snake.Snake,
   apple: Position.Position,
   direction: Direction.Direction,
   nextDirection: Direction.Direction,
   gameState: GameState,
-  points: S.Number,
-  highScore: S.Number,
+  points: Schema.Number,
+  highScore: Schema.Number,
 })
 export type Model = typeof Model.Type
 
@@ -40,7 +32,7 @@ export type Model = typeof Model.Type
 
 export const Message = defineMessageUnion({
   TickedClock: {},
-  PressedKey: { key: S.String },
+  PressedKey: { key: Schema.String },
   PausedGame: {},
   RestartedGame: {},
   CompletedGenerateApplePosition: { position: Position.Position },
@@ -74,9 +66,9 @@ type UpdateReturn = Update.Return<Model, Message>
 export const update = (model: Model, message: Message) =>
   Message.match<UpdateReturn>(message, {
     PressedKey: ({ key }) =>
-      M.value(key).pipe(
-        M.withReturnType<UpdateReturn>(),
-        M.whenOr(
+      Match.value(key).pipe(
+        Match.withReturnType<UpdateReturn>(),
+        Match.whenOr(
           'ArrowUp',
           'ArrowDown',
           'ArrowLeft',
@@ -86,13 +78,13 @@ export const update = (model: Model, message: Message) =>
           's',
           'd',
           moveKey => {
-            const nextDirection = M.value(moveKey).pipe(
-              M.withReturnType<Direction.Direction>(),
-              M.whenOr('ArrowUp', 'w', () => 'Up'),
-              M.whenOr('ArrowDown', 's', () => 'Down'),
-              M.whenOr('ArrowLeft', 'a', () => 'Left'),
-              M.whenOr('ArrowRight', 'd', () => 'Right'),
-              M.exhaustive,
+            const nextDirection = Match.value(moveKey).pipe(
+              Match.withReturnType<Direction.Direction>(),
+              Match.whenOr('ArrowUp', 'w', () => 'Up'),
+              Match.whenOr('ArrowDown', 's', () => 'Down'),
+              Match.whenOr('ArrowLeft', 'a', () => 'Left'),
+              Match.whenOr('ArrowRight', 'd', () => 'Right'),
+              Match.exhaustive,
             )
 
             if (model.gameState === 'Playing') {
@@ -106,14 +98,14 @@ export const update = (model: Model, message: Message) =>
             }
           },
         ),
-        M.when(' ', () => {
-          const nextGameState = M.value(model.gameState).pipe(
-            M.withReturnType<GameState>(),
-            M.when('NotStarted', () => 'Playing'),
-            M.when('Playing', () => 'Paused'),
-            M.when('Paused', () => 'Playing'),
-            M.when('GameOver', () => 'GameOver'),
-            M.exhaustive,
+        Match.when(' ', () => {
+          const nextGameState = Match.value(model.gameState).pipe(
+            Match.withReturnType<GameState>(),
+            Match.when('NotStarted', () => 'Playing'),
+            Match.when('Playing', () => 'Paused'),
+            Match.when('Paused', () => 'Playing'),
+            Match.when('GameOver', () => 'GameOver'),
+            Match.exhaustive,
           )
           return {
             model: evo(model, {
@@ -121,7 +113,7 @@ export const update = (model: Model, message: Message) =>
             }),
           }
         }),
-        M.when('r', () => {
+        Match.when('r', () => {
           const nextSnake = Snake.create(GAME.INITIAL_POSITION)
 
           return {
@@ -135,7 +127,7 @@ export const update = (model: Model, message: Message) =>
             commands: [GenerateApplePosition({ snake: nextSnake })],
           }
         }),
-        M.orElse(() => ({ model })),
+        Match.orElse(() => ({ model })),
       ),
 
     TickedClock: () => {
@@ -229,8 +221,8 @@ export const GenerateApplePosition = Command.define('GenerateApplePosition', {
 export const subscriptions = Subscription.make<Model, Message>()(entry => ({
   gameClock: entry(
     {
-      isPlaying: S.Boolean,
-      interval: S.Number,
+      isPlaying: Schema.Boolean,
+      interval: Schema.Number,
     },
     {
       modelToDependencies: model => ({
@@ -272,11 +264,11 @@ const cellClass = (x: number, y: number, model: Model): string => {
   )
   const isApple = Position.equivalence({ x, y }, model.apple)
 
-  return M.value({ isSnakeHead, isSnakeTail, isApple }).pipe(
-    M.when({ isSnakeHead: true }, () => 'bg-green-700'),
-    M.when({ isSnakeTail: true }, () => 'bg-green-500'),
-    M.when({ isApple: true }, () => 'bg-red-500'),
-    M.orElse(() => 'bg-gray-800'),
+  return Match.value({ isSnakeHead, isSnakeTail, isApple }).pipe(
+    Match.when({ isSnakeHead: true }, () => 'bg-green-700'),
+    Match.when({ isSnakeTail: true }, () => 'bg-green-500'),
+    Match.when({ isApple: true }, () => 'bg-red-500'),
+    Match.orElse(() => 'bg-gray-800'),
   )
 }
 
@@ -294,12 +286,12 @@ const gridView = (model: Model, h: HtmlBuilder<Message>): Html =>
   )
 
 const gameStateView = (gameState: GameState): string =>
-  M.value(gameState).pipe(
-    M.when('NotStarted', () => 'Press SPACE to start'),
-    M.when('Playing', () => 'Playing - SPACE to pause'),
-    M.when('Paused', () => 'Paused - SPACE to continue'),
-    M.when('GameOver', () => 'Game Over - Press R to restart'),
-    M.exhaustive,
+  Match.value(gameState).pipe(
+    Match.when('NotStarted', () => 'Press SPACE to start'),
+    Match.when('Playing', () => 'Playing - SPACE to pause'),
+    Match.when('Paused', () => 'Paused - SPACE to continue'),
+    Match.when('GameOver', () => 'Game Over - Press R to restart'),
+    Match.exhaustive,
   )
 
 const instructionsView = (h: HtmlBuilder<Message>): Html =>

package/dist/templates/examples/ssg/src/main.ts

@@ -1,4 +1,4 @@
-import { Effect, Schema as S } from 'effect'
+import { Effect, Schema } from 'effect'
 import { Command, Runtime, type Update } from 'foldkit'
 import { type Document, type Html, type HtmlBuilder } from 'foldkit/html'
 import { defineMessageUnion } from 'foldkit/message'
@@ -10,9 +10,9 @@ import { AppRoute, aboutRouter, homeRouter, urlToAppRoute } from './route'
 
 // MODEL
 
-export const Model = S.Struct({
+export const Model = Schema.Struct({
   route: AppRoute,
-  count: S.Number,
+  count: Schema.Number,
 })
 export type Model = typeof Model.Type
 
@@ -37,14 +37,14 @@ export const init: Runtime.RoutingApplicationInit<Model, Message> = url => ({
 // COMMAND
 
 const NavigateInternal = Command.define('NavigateInternal', {
-  args: { url: S.String },
+  args: { url: Schema.String },
   messages: [Message.CompletedNavigateInternal],
   execute: ({ url }) =>
     pushUrl(url).pipe(Effect.as(Message.CompletedNavigateInternal())),
 })
 
 const LoadExternal = Command.define('LoadExternal', {
-  args: { href: S.String },
+  args: { href: Schema.String },
   messages: [Message.CompletedLoadExternal],
   execute: ({ href }) =>
     load(href).pipe(Effect.as(Message.CompletedLoadExternal())),