WRNexusJS/docs/v0.6/language.md

WRNexusJS v0.6 language

Imports

import type { PublicUser } from "@/types/user.ts"
import PublicLayout from "@/layouts/PublicLayout.wrn"
import userStore from "@/stores/global/user.wrn"
import { Button, Modal } from "@wrnexus/ui"

Existing applications default to compatible import mode. Explicit mode requires component, layout, store, and non-global type imports.

Typed props, state, functions, and outputs

component ConfirmCard {
  props {
    title: string
    open: boolean = false
    user?: PublicUser
  }

  state count: number = 0

  state {
    loading: boolean = false
  }

  client state {
    focused: boolean = false
  }

  server state {
    internalSessionId: string | null = null
  }

  outputs {
    confirm(payload: ConfirmPayload)
    cancel()
  }

  functions {
    client async function confirm(payload: ConfirmPayload): Promise<void> {
      const result = await server.confirm(payload)
      output.confirm(result)
    }

    server async function confirm(payload: ConfirmPayload): Promise<ConfirmResult> {
      return await confirmationService.save(payload)
    }

    shared function normalize(value: string): string {
      return value.trim()
    }
  }
}

event is reserved for native DOM events. payload is the component-output payload. $emit and event.detail are compatibility-only APIs in v0.6.

Stores

global store UserStore {
  state {
    user: PublicUser | null = null
  }

  computed {
    authenticated: boolean = user !== null
  }

  persist {
    storage = "local"
    include = ["user"]
    version = 1
  }

  functions {
    client function clear(): void {
      user = null
    }
  }
}

Global stores survive CSR navigation and are request-scoped during SSR. Page stores are disposed on route leave. External state mutation is rejected; use store functions. reset() and snapshot() are built in.