# WRNexusJS v0.6 language

## Imports

```wrn
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

```wrn
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

```wrn
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.