akanjs 3.0.0-beta.8 → 3.0.0

package/README.md

@@ -1,234 +1,289 @@
 # Akan.js
 
-[한국어](./README.ko.md) | [Docs](https://akanjs.com/docs) | [npm](https://www.npmjs.com/package/akanjs)
+[한국어](https://github.com/akan-team/akanjs/blob/main/pkgs/akanjs/README.ko.md) | [Docs](https://akanjs.com/docs) | [v3 release note](https://akanjs.com/blog/v3release) | [npm](https://www.npmjs.com/package/akanjs)
 
-**One line of business code ships web, iOS, Android, server, and database together.**
+<img width="600" alt="Akan.js — one line of business code, every face." src="https://akanjs.com/jelly/og.jpg" />
 
-No more framework assembly, duplicated declarations, or per-platform rewrites. Akan.js is a Bun-first
-full-stack TypeScript framework where business intent is written once, then compiled into SEO web surfaces,
-iOS and Android app packages, servers, database contracts, infrastructure artifacts, and documentation.
+**The TypeScript framework, agents included.** Powered by Bun.
 
-<img width="563" height="720" alt="multi-platform-dev" src="https://github.com/user-attachments/assets/de2ec810-7b7f-4e9d-8e9e-e565e648fb45" />
+**Build a screen — agents can use it. Build a server — any AI can run it.**
 
-A single Akan.js codebase keeps server rendering, client rendering, mobile apps, server, and database moving in one development flow.
+No tool schemas, no MCP server to write, no second permission model. The app you build for people is already the
+one AI can use, on the model you choose. One line of business code runs through every layer, ships to six platforms,
+and reaches everyone who uses it — people and agents.
 
-## Why Akan
+## Quick Start
 
-Akan is designed for teams and solo builders who would rather ship the business than keep wiring technical
-layers by hand. Define the domain once, then let the framework connect schema, API, fetch client, store, UI,
-server, app packaging, deployment artifacts, and generated references.
+### With your coding agent
 
-- **Web devs**: the same business code becomes SEO-ready web and native-feeling iOS/Android screens.
-- **App devs**: Bun server, SQLite, API contracts, and validation follow without hand-wiring.
-- **Solo and small teams**: one full-stack developer can own all five surfaces with a quarter of the code.
-- **Agents stay consistent**: strict conventions keep file paths, names, structures, and declarations readable.
+Open Claude Code or Codex in an empty directory and paste this prompt. Add your workspace and app names under it,
+or let the agent ask.
 
-## Requirements
+```text
+Set up a new Akan.js workspace for me (https://akanjs.com).
 
-- [Bun](https://bun.sh) `>=1.4.0`
-- TypeScript-first application code
-- React-based UI surfaces
+1. Check that Bun 1.4 or newer is installed (`bun --version`). If it isn't, install or upgrade it as https://bun.sh describes.
+2. Ask me for a workspace name and a first app name, short and lowercase, unless I wrote them below.
+3. In this directory, run `bunx create-akan-workspace@latest <workspace> --app <app>`. It installs the akan CLI globally, creates ./<workspace> and installs its dependencies.
+4. Inside ./<workspace>, start the dev server in the background with `akan start <app>` and check that the URL it prints (http://localhost:8282 by default) loads.
+5. Tell me it's running, and that I should reopen you inside ./<workspace>: the project's Akan MCP server and AGENTS.md rules load from there.
+```
 
-## Quick Start
+The new workspace already carries what the agent works through: `AGENTS.md` and `CLAUDE.md`, Cursor rules, and the
+Akan MCP server registered for Claude Code, Codex and Cursor. Reopen the agent inside the workspace so it loads them.
 
-Create a workspace directly:
+### In a terminal
 
-```bash
-bunx create-akan-workspace@latest
-```
-
-Or install the CLI globally:
+Requires [Bun](https://bun.sh) `>=1.4.0`.
 
 ```bash
-bun install -g @akanjs/cli --latest
-akan create-workspace
+bunx create-akan-workspace@latest
 cd <workspace-name>
 akan start <app-name> --open
 ```
 
-A minimal app can start with almost no configuration:
+The creator asks for a workspace name and an app name, installs the `akan` CLI and the workspace's dependencies, and
+generates a sample app. The app opens on `http://localhost:8282`.
+
+## All Of It Is One Line
 
 ```ts
-import type { AppConfig } from "akanjs";
+export class ProductInput extends via((field) => ({
+  name: field(String),
+})) {}
+```
 
-const config: AppConfig = {};
+**1 line × 8 layers × 6 platforms × people & agents.**
+
+- **1 line.** Adding a field is one declaration: a name and a type.
+- **× 8 layers.** That line runs through the schema, query, service, API, fetch, client type, state and UI prop. In a
+  usual stack those are eight places to change by hand, and missing one breaks a type or fails at runtime. Here they
+  change together.
+- **× 6 platforms.** The same code ships as SEO-ready web, iOS and Android apps, and macOS, Windows and Linux desktop
+  apps, with native-level screen transitions rather than a wrapped website.
+- **× people & agents.** Every guarded endpoint becomes an MCP tool and every control on screen an in-page agent
+  tool, behind the same guards people pass.
+
+## The Screen You Build Is The Agent's Interface
+
+```tsx
+export const Order = () => {
+  const { l } = usePage();
+  const icecreamOrderForm = st.use.icecreamOrderForm();
+  const order = st.tool("createIcecreamOrder", { confirm: true })
+    .desc("Place the order in the form.")
+    .exec(() => st.do.createIcecreamOrder());
+  return (
+    <>
+      <Field.MultiToggleSelect
+        label={l("icecreamOrder.toppings")}
+        items={cnst.Topping}
+        value={icecreamOrderForm.toppings}
+        onChange={st.do.setToppingsOnIcecreamOrder}
+      />
+      <Button onClick={order}>{l("icecreamOrder.createIcecreamOrder")}</Button>
+    </>
+  );
+};
+```
 
-export default config;
+- **Write the screen you were going to write.** A field handed its setter publishes it. A button's handler becomes a
+  tool with one `st.tool` line — the same function the button calls.
+- **An agent sees tools, not pixels.** Every control you wired is published under its own name, with the arguments it
+  takes. What isn't on the screen isn't on the list.
+- **It works the screen in the user's own tab**, with their session, exactly like a click.
+- **What matters waits for a yes.** A tool declared with `confirm` stops on an approval card.
+
+Setup is one `<Agent.Chat />` in a layout and your model's key in `option.ts`. OpenAI-compatible hosts and Anthropic
+both work.
+
+## Your Server Is Already An MCP Server
+
+```ts
+serveIcecreamOrder: mutation(cnst.IcecreamOrder, {
+  guards: [Admin],
+})
+  .param("icecreamOrderId", ID)
+  .exec(async function (icecreamOrderId) {
+    return await this.icecreamOrderService.serve(icecreamOrderId);
+  }),
+refundIcecreamOrder: mutation(cnst.IcecreamOrder, {
+  guards: [Every, Person],
+})
+  .param("icecreamOrderId", ID)
+  .with(Self)
+  .exec(async function (icecreamOrderId, self) {
+    return await this.icecreamOrderService.refund(icecreamOrderId, self.id);
+  }),
 ```
 
-Production apps can grow into routes, base paths, domains, mobile metadata, and deployment options through
-`akan.config.ts`.
+- **Point any MCP client at your app.** `POST /mcp` is on by default. Every endpoint whose guards admit the caller is
+  a tool, described by the dictionary you already write.
+- **Sign-in and consent happen on your app.** OAuth 2.1 ships with `libs/shared`. The AI gets a token for one user —
+  exactly their rights, revocable at any time.
+- **It can't do what it shouldn't.** `refundIcecreamOrder` is guarded by `Person`, so it never reaches the shelf. To
+  the AI it looks exactly like a tool that doesn't exist.
+- **Pages become prompts.** `page().prompt(name, description)` publishes a screen as an MCP prompt: its fetches run
+  under the caller's token and the agent receives the data, with no second implementation to keep in sync.
+
+## One Rule, Three Kinds Of Users
 
-## Readable By Design
+You write a guard once per endpoint. It decides for a person on the screen, for the agent in their tab, and for an AI
+calling over MCP.
 
-Akan keeps long-lived applications understandable by making the important decisions explicit and repeatable.
+- **Refusals give nothing away.** A tool an agent may not use answers exactly like one that doesn't exist.
+- **Rate-limited per caller.** MCP calls are capped at 120 a minute and 8 at once for each caller.
+- **Secrets stay home.** Hidden and secret fields are stripped before anything reaches a model.
+- **Connections end when you say.** Revoke a connection and its next call is refused. The chat relay keeps no
+  session and no transcript.
 
-- **One configuration surface**: `akan.config.ts` is the app-level control plane. It can stay empty until the
-  app actually needs routes, domains, base paths, mobile settings, or deployment options.
-- **Monorepo-native reuse**: shared libraries and domain modules are first-class, so validated business code can
-  be reused without rebuilding the same wheel in each app.
-- **Strict structure, familiar code**: file locations, names, declarations, and module boundaries follow the same
-  pattern across the workspace, so code written by another contributor still reads like local code.
+## Agents Build It, Too
+
+AI coding turns to spaghetti past a certain size: the faster an agent writes, the more file paths, names, structures
+and declaration styles drift apart. Akan stops this at the source with strict rules.
+
+- **Config hell ends.** Everything is configured in `akan.config.ts`, and an empty one still runs.
+- **Strict rules, unified style.** File paths, names, structures and declarations stay consistent, and lint enforces
+  them, so code reads like one person wrote it.
+- **Rules agents can't route around.** Every workspace ships a generated `AGENTS.md`, bundled guidelines, a
+  plan-then-apply workflow MCP, and `akan code`, a terminal coding agent that works through them.
+- **Fixed blocks.** Upload, login, admin, chat, boards and alerts are ready-made blocks, so agents produce
+  consistent code on top of them.
 
 ## The Domain Module
 
-The domain module is the center of Akan development. Instead of organizing code by technical layer first,
-Akan organizes code around business domains such as `user`, `product`, `ticket`, or `project`.
+Code is organized around business domains such as `user`, `product`, `ticket` or `project`, not by technical layer
+first.
 
 ```text
 lib/product/
 ├── product.constant.ts    # model, scalar, enum, schema definition
 ├── product.dictionary.ts  # i18n labels, descriptions, errors
-├── product.signal.ts      # typed endpoint contract
+├── product.signal.ts      # typed endpoint contract, guards
 ├── product.document.ts    # persistence and document queries
 ├── product.service.ts     # business logic
 ├── product.store.ts       # domain state and actions
-├── Product.Template.tsx   # form-oriented UI
-├── Product.Unit.tsx       # list/item UI
+├── Product.Template.tsx   # form UI
+├── Product.Unit.tsx       # list item UI
 ├── Product.View.tsx       # detail UI
-└── Product.Zone.tsx       # page/container UI
+└── Product.Zone.tsx       # page section UI
 ```
 
 ```mermaid
 flowchart LR
   ConstantDictionarySignal["constant + dictionary + signal"] --> DocumentService["document + service"]
   ConstantDictionarySignal --> StoreComponents["store + UI components"]
-  DocumentService --> ServerRuntime["server runtime"]
-  StoreComponents --> ClientRuntime["client runtime"]
+  DocumentService --> ServerRuntime["server runtime + MCP"]
+  StoreComponents --> ClientRuntime["client runtime + in-page agent"]
   ServerRuntime --> DeployArtifacts["deploy artifacts"]
   ClientRuntime --> DeployArtifacts
 ```
 
-This structure lets one model and one contract flow through the database, server, API, state management,
-and UI without duplicating intent across layers.
-
-## 8 in 1
+## Faster Than v2
 
-One field. Eight layers follow.
+v3 adds agents, MCP and a new UI system, and it is still faster than v2 on every number we measured.
 
-Adding a single business field in a traditional full-stack app usually means changing all of this by hand:
+| Metric | v2 | v3 | Change |
+| --- | --- | --- | --- |
+| Requests per second | 112K | 123K | +10% |
+| Response time (p99) | 1.30 ms | 1.04 ms | −20% |
+| Startup time | 204 ms | 102 ms | −50% |
+| Memory at rest | 84 MB | 57 MB | −32% |
+| Memory under load | 105 MB | 85 MB | −19% |
 
-1. Define the DB schema.
-2. Add the query field.
-3. Add the service logic.
-4. Add the API field.
-5. Add the fetch field.
-6. Declare the client type.
-7. Declare the state management.
-8. Declare the UI prop.
+- Client build output: 26MB → 8.1MB (605 chunks down to 258).
+- Hydrating 1,000 rows on the client: 3.5ms → 0.9ms.
+- A 50-row list query: −33% time, with 85% fewer allocations.
 
-Change one place, chase eight. Miss one, and types break, or it fails at runtime. In Akan, the business field is
-the source of truth:
+Measured on an Apple M4 Pro MacBook Pro with production builds and 50 concurrent users. The harness and raw data live
+in [`benchmarks/api-benchmark`](https://github.com/akan-team/akanjs/tree/main/benchmarks/api-benchmark).
 
-```ts
-export class ProductInput extends via((field) => ({
-  name: field(String),
-})) {}
-```
+## From Build To A Live URL
 
-That one declaration defines schema and type together. The surrounding layers are generated from the same
-intent, so the stack stays connected instead of turning into spaghetti.
+[Akan Cloud](https://cloud.akanjs.com) is the deploy platform built for Akan apps.
 
-## What Akan Builds
-
-Akan is one framework for the pieces that normally become separate projects:
-
-- SEO-optimized server-side rendered web surfaces.
-- iOS and Android app packages from compiled web surfaces, with native-level built-in screen transitions.
-- Bun-powered HTTP and WebSocket servers.
-- SQLite-first simple server paths, with Postgres and Redis expansion paths for larger systems.
-- Schema validation, error handling, security helpers, and middleware.
-- Type-safe flow from database schema to server, API, state, and UI.
-- Internationalized schemas, errors, API descriptions, and UI copy.
-- Generated database and API documentation from the same definitions that run the app.
-- Composable feature blocks for upload, authentication, admin, chat, boards, and notifications.
+```bash
+akan login           # sign in to Akan Cloud from your machine
+akan tunnel <app>    # share the app you are running on a public URL
+akan build <app>     # build the production artifact Akan Cloud runs
+```
 
-Deployment and documentation should not consume a day of work. Akan is built so schema and endpoint
-definitions can also become table references, runtime contracts, API docs, and testable endpoint references.
+## Docs For You And Your Agent
 
-Unlike ordinary app packaging that can feel like a wrapped website, Akan's client runtime includes transition
-presets for list-detail flows, overlays, and context changes. Packaged web surfaces can deliver a native-level
-user experience without a separate UI rewrite.
+- Read the docs at [akanjs.com/docs](https://akanjs.com/docs). Every docs page carries the in-page agent, so you can
+  ask it about a topic and it opens the page.
+- Connect Claude Code or Cursor to `https://akanjs.com/mcp`, and your AI reads the docs (`listDocPages`,
+  `searchDocPages`, `readDocPage`) while it writes your code.
+- [`llms.txt`](https://akanjs.com/llms.txt) indexes the docs for any model.
 
 ## One Package, Many Boundaries
 
-Akan is published as a single npm package: `akanjs`.
-
-The root import is intentionally small. Use subpath imports to keep server-only, client-only, UI, and
-tooling surfaces clear:
+Akan is published as a single npm package, `akanjs`. The root import is intentionally small; subpath imports keep
+server-only, client-only, UI and tooling surfaces apart.
 
 ```ts
 import { Int, dayjs } from "akanjs/base";
 import { via } from "akanjs/constant";
 import { endpoint } from "akanjs/signal";
-import { fetch } from "akanjs/fetch";
 import { Button, Layout } from "akanjs/ui";
-import type { PageConfig } from "akanjs/client";
+import { page } from "akanjs/client";
+import { AkanApp } from "akanjs/server/akanApp";
 ```
 
 ```css
 @import "akanjs/ui/styles.css";
 ```
 
-This model keeps install and update flows simple while preserving runtime boundaries and allowing the
-frontend build to rewrite UI barrel imports into leaf imports.
-
-## Package Surface
-
 | Subpath | Purpose |
 | --- | --- |
-| `akanjs/base` | Core primitives, scalar helpers, environment helpers, symbols, and common types. |
-| `akanjs/common` | Shared cross-runtime helpers used by multiple Akan surfaces. |
+| `akanjs/base` | Core primitives, scalars (`Int`, `Float`, `ID`, `Binary`, `enumOf`), `dayjs`, environment helpers. |
+| `akanjs/common` | Shared cross-runtime helpers. |
 | `akanjs/constant` | Model declarations, schema shaping, serialization, defaults, and the `via` builder. |
-| `akanjs/dictionary` | Locale, translation, and dictionary helpers for natural-language metadata. |
-| `akanjs/document` | Database document schemas, query builders, loaders, and persistence utilities. |
-| `akanjs/signal` | Endpoint, slice, guard, middleware, serializer, and typed signal contracts. |
-| `akanjs/service` | Service modules, adaptors, dependency injection metadata, and business logic runtime. |
-| `akanjs/fetch` | Typed fetch clients, HTTP clients, WebSocket clients, and request storage. |
-| `akanjs/store` | Domain state, actions, store registry, and root-store helpers. |
-| `akanjs/ui` | React components and UI primitives such as layout, form, modal, table, loading, and model views. |
-| `akanjs/client` | Client routing, cookies, storage, locale, device, CSR types, and page helpers. |
-| `akanjs/client` | Client bootstrapping and location helpers used by Akan page runtimes. |
-| `akanjs/server` | Server app runtime, route composition, SSR/RSC artifacts, proxying, sitemap, and server types. |
-| `@akanjs/devkit` | Build runners, config loaders, code generation, scanners, transforms, CLI helpers, and tooling. |
-| `akanjs/test` | Test helpers and sample generation utilities. |
-| `@akanjs/cli` | Programmatic CLI entrypoint. The executable command is `akan`. |
-
-Special public surfaces:
-
-- `akanjs/ui/styles.css`
-- `akanjs/capacitor.base.config`
-- `akanjs/server/rsc-worker`
-- `akanjs/package.json`
+| `akanjs/dictionary` | Locale, translation, and dictionary helpers for labels, descriptions and errors. |
+| `akanjs/document` | Database documents, filters, query builders, full-text search, and persistence utilities. |
+| `akanjs/signal` | Endpoints, slices, guards, middleware, and typed signal contracts. |
+| `akanjs/service` | Services, adaptors, dependency injection, and the business logic runtime. |
+| `akanjs/fetch` | Typed fetch, HTTP and WebSocket clients. |
+| `akanjs/store` | Domain state, actions, and the in-page agent's `st.tool` / `st.use` surface. |
+| `akanjs/ui` | React components, recipes, and `_overrides.tsx` slots: layout, form, modal, table, loading, agent chat. |
+| `akanjs/client` | The route chain (`page()`, `layout()`), routing, cookies, storage, locale, and `cn`. |
+| `akanjs/client/native` | The native bridge and builtin plugins for iOS, Android and desktop apps. |
+| `akanjs/webkit` | Browser-side helpers such as `lazy` and SEO pages. |
+| `akanjs/server` | Server runtime, SSR/RSC, MCP, logging, and server types. `akanjs/server/akanApp` is the entrypoint. |
+| `akanjs/native/desktop` | Desktop parts of native plugins. |
+| `akanjs/test` | Test helpers and sample generation. |
+
+Tooling ships as separate packages: `@akanjs/cli` (the `akan` command), `@akanjs/devkit` (build runners, code
+generation, lint rules) and `create-akan-workspace`.
 
 ## CLI Overview
 
-The `akan` command manages the whole workspace lifecycle.
-
 ```bash
 akan create-workspace
-akan create-application <app-name>
+akan create-application <app>
 akan create-module
-akan create-scalar
-akan start <app-name> --open
-akan build <app-name>
-akan lint-all
+akan start <app> --open          # or several: akan start a,b
+akan build <app>
+akan build-ios <app>             # also build-android, build-desktop
+akan lint <app>
+akan typecheck <app>
+akan test <app>
+akan logs <app>
+akan code
 akan update
 ```
 
-Common areas:
-
-- **Workspace**: create workspaces, lint and sync projects.
-- **Application**: start, build, typecheck, package, and release apps.
+- **Workspace**: create workspaces, lint, sync, and run `akan doctor`.
+- **Application**: start, build, typecheck, test, and package web, mobile and desktop apps.
 - **Library**: create, install, sync, push, and pull shared libraries.
 - **Module and scalar**: generate domain modules, models, views, units, templates, and stores.
-- **Cloud and release**: prepare deployment assets and update Akan package versions.
-- **Guidelines**: generate and inspect framework coding guidelines for agents and contributors.
+- **Agents**: `akan code`, `akan mcp`, `akan mcp-install`, `akan workflow`, `akan guideline`.
+- **Cloud and release**: `akan login`, `akan tunnel`, deployment assets, and package updates.
 
 ## Application Configuration
 
-`akan.config.ts` is the single place for app-level configuration. It can be empty for simple apps, then
-grow only when the app needs routes, domains, base paths, or mobile settings.
+`akan.config.ts` is the single place for app-level configuration. It can stay empty, then grow only when the app
+needs routes, domains, base paths, database modes, or native app settings.
 
 ```ts
 import type { AppConfig } from "akanjs";
@@ -238,7 +293,9 @@ const config: AppConfig = {
     { domains: { main: ["example.com", "www.example.com"] }, basePath: "web" },
     { domains: {}, basePath: "app" },
   ],
-  mobile: {
+  database: { modes: ["single", "cluster"] },
+  native: {
+    basePath: "app",
     appName: "Example",
     appId: "com.example.app",
     version: "1.0.0",
@@ -251,23 +308,25 @@ export default config;
 
 ## Contributor Notes
 
-This repository is a Bun-first monorepo. Framework code lives under `pkgs/akanjs`, applications under
-`apps`, shared libraries under `libs`, and deployment assets under `infra`.
+This repository is a Bun-first monorepo. Framework code lives under `pkgs/akanjs`, tooling under `pkgs/@akanjs`,
+applications under `apps`, shared libraries under `libs`, and deployment assets under `infra`. `apps/akan` is
+[akanjs.com](https://akanjs.com) itself.
 
-Useful commands:
+Inside this repository, `bun run akan` builds the CLI from source and runs it:
 
 ```bash
-akan lint-all --fix=false
-akan build <appName>
-akan start <appName>
+bun run akan start <app>
+bun run akan lint <app>
+bun run akan typecheck <app>
+bun run akan test <app-or-lib-or-pkg>
 ```
 
-When editing framework code, prefer established subpaths and keep the root `akanjs` entrypoint small.
-The package boundary is part of the runtime design.
+`AGENTS.md` is the guide for coding agents and contributors alike. When editing framework code, prefer established
+subpaths and keep the root `akanjs` entrypoint small. The package boundary is part of the runtime design.
 
 ## Open Source Notes
 
-- License: MIT. See the root `LICENSE`.
+- License: MIT. See [`pkgs/akanjs/LICENSE`](https://github.com/akan-team/akanjs/blob/main/pkgs/akanjs/LICENSE).
 - Repository: [akan-team/akanjs](https://github.com/akan-team/akanjs).
-- Contribution guide: see the root `CONTRIBUTING.md`.
-- Code of conduct: see the root `CODE_OF_CONDUCT.md`.
+- Contribution guide: [`pkgs/akanjs/CONTRIBUTING.md`](https://github.com/akan-team/akanjs/blob/main/pkgs/akanjs/CONTRIBUTING.md).
+- Code of conduct: [`pkgs/akanjs/CODE_OF_CONDUCT.md`](https://github.com/akan-team/akanjs/blob/main/pkgs/akanjs/CODE_OF_CONDUCT.md).

package/base/base.ts

@@ -23,10 +23,10 @@ export type EnumInstance<RefName extends string = string, T = string | number> =
   }
 >;
 
-/** Returns true when a class was created by `enumOf`. */
+/** True for a `class X extends enumOf(...) {}`, not for the bare `enumOf(...)` result. */
 export const isEnum = (enumRef: Cls) => Object.getPrototypeOf(Object.getPrototypeOf(enumRef) ?? {}) === EnumPrototype;
 
-/** Creates a typed scalar enum class from a readonly list of string or number values. */
+/** `type` is `String` for string values, else `Int` when every value is an integer, else `Float`. */
 export const enumOf = <RefName extends string, T = string | number>(
   refName: RefName,
   values: readonly T[],
@@ -78,9 +78,7 @@ export const enumOf = <RefName extends string, T = string | number>(
   return Enum as unknown as EnumInstance<RefName, T>;
 };
 
-/** Id-keyed list helper used for light model collections and immutable-style list updates. */
 export class DataList<Light extends { id: string }> {
-  
   #idMap: Map<string, number>;
   length: number;
   values: Light[];
@@ -125,8 +123,7 @@ export class DataList<Light extends { id: string }> {
   }
   get(id: string) {
     const idx = this.#idMap.get(id);
-    if (idx === undefined) return undefined;
-    return this.values[idx];
+    return idx === undefined ? undefined : this.values[idx];
   }
   at(idx: number) {
     return this.values.at(idx);
@@ -143,12 +140,10 @@ export class DataList<Light extends { id: string }> {
     return this.#idMap.has(id);
   }
   find(fn: (value: Light, idx: number) => boolean) {
-    const val = this.values.find(fn);
-    return val;
+    return this.values.find(fn);
   }
   findIndex(fn: (value: Light, idx: number) => boolean) {
-    const val = this.values.findIndex(fn);
-    return val;
+    return this.values.findIndex(fn);
   }
   some(fn: (value: Light, idx: number) => boolean) {
     return this.values.some(fn);
@@ -166,7 +161,7 @@ export class DataList<Light extends { id: string }> {
     return this.values.flatMap(fn);
   }
   sort(fn: (a: Light, b: Light) => number) {
-    return new DataList(this.values.sort(fn));
+    return new DataList([...this.values].sort(fn));
   }
   filter(fn: (value: Light, idx: number) => boolean) {
     return new DataList(this.values.filter(fn));