@async/framework 0.11.19 → 0.11.23

package/CHANGELOG.md

@@ -1,5 +1,49 @@
 # Changelog
 
+## 0.11.23 - 2026-06-21
+
+- Added first-class JSX type profiles for runtime/no-build and
+  buildtime/build-required authoring, including profile-local automatic
+  `jsx-runtime` and `jsx-dev-runtime` package subpaths.
+- Added TypeScript fixtures proving runtime JSX accepts protocol attributes,
+  strict buildtime JSX rejects protocol props, and both profiles avoid global
+  ambient JSX pollution.
+- Added component registry mounting through `async:component` plus
+  `this.slot(...)` outlets for child component replacement from signal-derived
+  props.
+- Added example README coverage and clarified benchmark smoke checks without
+  publishing an incomplete Vite optimizer setup as a public example.
+- Bundle size from bundled TypeScript source: `browser.ts` raw 228,180 B (228.2 KB / 0.228 MB), gzip 43,390 B (43.4 KB / 0.043 MB), br 35,878 B (35.9 KB / 0.036 MB) -> `browser.min.js` raw 97,570 B (97.6 KB / 0.098 MB), gzip 29,015 B (29.0 KB / 0.029 MB), br 25,549 B (25.5 KB / 0.026 MB); delta raw -130,610 B (-130.6 KB / -0.131 MB), gzip -14,375 B (-14.4 KB / -0.014 MB), br -10,329 B (-10.3 KB / -0.010 MB).
+
+## 0.11.22 - 2026-06-19
+
+- Updated framework release automation to consume `@async/pipeline@0.9.25`,
+  whose generated release workflow runs package-owned release evidence before
+  release plan/inspect/changelog/notes steps so `dist/` exists before package
+  inspection.
+- Kept release-description sync checks on the released pipeline path after the
+  existing `v0.11.20` and `v0.11.21` GitHub Release description repairs.
+- Bundle size from bundled TypeScript source: `browser.ts` raw 221,403 B (221.4 KB / 0.221 MB), gzip 42,093 B (42.1 KB / 0.042 MB), br 34,797 B (34.8 KB / 0.035 MB) -> `browser.min.js` raw 95,027 B (95.0 KB / 0.095 MB), gzip 28,145 B (28.1 KB / 0.028 MB), br 24,793 B (24.8 KB / 0.025 MB); delta raw -126,376 B (-126.4 KB / -0.126 MB), gzip -13,948 B (-13.9 KB / -0.014 MB), br -10,004 B (-10.0 KB / -0.010 MB).
+
+## 0.11.21 - 2026-06-19
+
+- Updated framework release automation to consume `@async/pipeline@0.9.24`,
+  whose generated release helper steps use `pnpm dlx` for the pinned
+  `@async/release` package on Node 24/npm 11 runners.
+- Kept release-description sync scripts and generated workflow entries on the
+  released pipeline path.
+- Bundle size from bundled TypeScript source: `browser.ts` raw 221,403 B (221.4 KB / 0.221 MB), gzip 42,093 B (42.1 KB / 0.042 MB), br 34,797 B (34.8 KB / 0.035 MB) -> `browser.min.js` raw 95,027 B (95.0 KB / 0.095 MB), gzip 28,145 B (28.1 KB / 0.028 MB), br 24,793 B (24.8 KB / 0.025 MB); delta raw -126,376 B (-126.4 KB / -0.126 MB), gzip -13,948 B (-13.9 KB / -0.014 MB), br -10,004 B (-10.0 KB / -0.010 MB).
+
+## 0.11.20 - 2026-06-19
+
+- Updated framework release automation to consume `@async/pipeline@0.9.22`
+  with the released `release sync-descriptions` command.
+- Added framework package scripts for release-description sync checks and
+  generated matching `pipeline:release:sync-descriptions` entries.
+- Synced existing semver GitHub Release descriptions from `CHANGELOG.md` so the
+  changelog remains the source of truth.
+- Bundle size from bundled TypeScript source: `browser.ts` raw 221,403 B (221.4 KB / 0.221 MB), gzip 42,093 B (42.1 KB / 0.042 MB), br 34,797 B (34.8 KB / 0.035 MB) -> `browser.min.js` raw 95,027 B (95.0 KB / 0.095 MB), gzip 28,145 B (28.1 KB / 0.028 MB), br 24,793 B (24.8 KB / 0.025 MB); delta raw -126,376 B (-126.4 KB / -0.126 MB), gzip -13,948 B (-13.9 KB / -0.014 MB), br -10,004 B (-10.0 KB / -0.010 MB).
+
 ## 0.11.19 - 2026-06-19
 
 - Added the first build-required profile subpaths,

package/README.md

@@ -318,6 +318,7 @@ import {
   createLazyRegistry,
   component,
   computed,
+  component,
   createSignal,
   createHandlerRegistry,
   createPartialRegistry,
@@ -332,7 +333,6 @@ import {
   defineAttributeConfig,
   defineApp,
   defineCache,
-  defineComponent,
   defineRegistrySnapshot,
   defineRoute,
   delay,
@@ -404,13 +404,13 @@ You can also create isolated app hubs and runtimes:
 ```js
 const app = defineApp();
 app.use("signal", { count: createSignal(0) });
-
-const runtime = createApp(app, { root: document }).start();
-runtime.use("handler", {
+app.use("handler", {
   increment() {
     this.signals.update("count", (count) => count + 1);
   }
 });
+
+const runtime = createApp(app, { root: document }).start();
 ```
 
 Naming rules:
@@ -472,6 +472,28 @@ runtime.registry.snapshot().entries.server;
 // {}
 ```
 
+The singleton runtime is intentionally internal. Use app-level methods for
+global lifecycle work, and use `inspectRuntime()` for diagnostics:
+
+```js
+Async.attachRoot(document.body);
+Async.applySnapshot(snapshot);
+
+Async.inspectRuntime();
+// {
+//   active: true,
+//   started: true,
+//   destroyed: false,
+//   target: "browser",
+//   roots: { count: 1, roots: [...] },
+//   loader: { ready: true, pending: 0, root: document.body },
+//   router: false
+// }
+```
+
+`Async.runtime` is not public API. If you need direct instance ownership, keep
+the handle returned from `Async.start(...)` or `createApp(...).start()`.
+
 ### Signals
 
 ```js
@@ -1049,6 +1071,34 @@ If an `async:snapshot` script is present under the root or document,
 const snapshot = readSnapshot(document);
 ```
 
+## Loader Bootstrap Queue
+
+`Async.loader` is a promise-returning facade for script-friendly loader work
+that may run before the app has attached a root. Calls to `scan`, `swap`, and
+`mount` queue until `Async.start({ root })` or `Async.attachRoot(root)` creates
+the concrete runtime loader:
+
+```js
+Async.use("handler", {
+  selectProduct() {
+    this.signals.set("selected", true);
+  }
+});
+
+const swapped = Async.loader.swap(
+  "route",
+  `<button type="button" on:click="selectProduct">Select</button>`
+);
+
+Async.start({ root: document, router: false });
+await swapped;
+```
+
+`Async.loader.ready()` resolves with the concrete `runtime.loader`.
+`Async.loader.inspect()` reports whether a loader is ready and how many loader
+operations are still pending. The concrete `runtime.loader` remains
+synchronous for routers, boundary receivers, and server-result application.
+
 ## Components
 
 Components are scoped fragment functions. They return strings or `html`
@@ -1056,7 +1106,7 @@ templates; Loader inserts and scans the result. There is no virtual node
 type and no rerender loop.
 
 ```js
-const Toggle = defineComponent(function Toggle() {
+const Toggle = component(function Toggle() {
   const selected = this.signal(false);
   const attach = this.handler("attach", function ({ element }) {
     element.dataset.attached = "true";
@@ -1086,8 +1136,6 @@ const loader = Loader({ root: document });
 loader.mount(document.querySelector("#app"), Toggle);
 ```
 
-`component(...)` remains a compatibility alias for `defineComponent(...)`.
-
 Component helpers:
 
 | Helper | Behavior |
@@ -1100,6 +1148,7 @@ Component helpers:
 | `this.handler(name, fn)` | Scoped named handler registry entry |
 | `this.handler(fn)` | Generated scoped handler registry entry |
 | `this.render(Component, props)` | Child fragment rendering |
+| `this.slot(Component, propsOrFn)` | Child component outlet using an `on:attach` target |
 | `this.suspense(signalRef, views)` | Async boundary template helper |
 | `this.on(event, fn)` | Fragment lifecycle fallback for `attach`, `visible`, and `destroy` |
 | `this.onMount(fn)` | Compatibility alias for `this.on("attach", fn)` |
@@ -1113,7 +1162,7 @@ caller owns the boundary element, and the loader chooses the loading, ready, or
 error template from the async signal status.
 
 ```js
-const Product = defineComponent(function Product() {
+const Product = component(function Product() {
   const product = this.asyncSignal("product", async function () {
     return this.server.products.get("sku-1");
   });
@@ -1202,7 +1251,7 @@ Use `this.on("intersect", ...)` when a component needs continuous visibility
 state:
 
 ```js
-const Card = defineComponent(function Card() {
+const Card = component(function Card() {
   const visible = this.signal(false);
 
   this.on("intersect", { threshold: 0.5 }, ({ isIntersecting }) => {
@@ -1217,7 +1266,7 @@ Use `this.intersect(...)` with a direct element when a parent owns scroll-spy or
 active-section state:
 
 ```js
-const Section = defineComponent(function Section({ id, observeSection }) {
+const Section = component(function Section({ id, observeSection }) {
   const attach = this.handler("attach", function ({ element }) {
     return observeSection(id, element);
   });
@@ -1225,7 +1274,7 @@ const Section = defineComponent(function Section({ id, observeSection }) {
   return html`<section on:attach="${attach}"><h2>${id}</h2></section>`;
 });
 
-const Page = defineComponent(function Page() {
+const Page = component(function Page() {
   const active = this.signal("intro");
   const ratios = new Map();
   const options = {
@@ -1309,6 +1358,9 @@ rerendering.
 
 ## Examples
 
+See [`examples/README.md`](./examples/README.md) for start commands and a short
+description of every example.
+
 | Example | Shows |
 | --- | --- |
 | [`examples/counter`](./examples/counter) | Signal text binding and delegated handlers |
@@ -1320,6 +1372,7 @@ rerendering.
 | [`examples/partials`](./examples/partials) | Server-rendered partial fragments |
 | [`examples/cache`](./examples/cache) | Browser/server cache declarations |
 | [`examples/ssr`](./examples/ssr) | Server render output and browser activation snapshot |
+| [`examples/size`](./examples/size) | Scenario-size fixtures for bundle and runtime slices |
 
 ## Pipeline
 

package/browser.d.ts

@@ -512,6 +512,21 @@ export interface LoaderInstance {
 
 export type AsyncLoaderOptions = LoaderOptions;
 export type AsyncLoaderInstance = LoaderInstance;
+export interface AsyncLoaderFacadeInspection {
+  ready: boolean;
+  pending: number;
+  root?: Document | Element | DocumentFragment;
+}
+
+export interface AsyncLoaderFacade {
+  readonly current?: LoaderInstance;
+  ready(): Promise<LoaderInstance>;
+  scan(rootOrFragment?: Document | Element | DocumentFragment): Promise<LoaderInstance>;
+  swap(boundaryId: string, fragmentOrTemplate: TemplateLike): Promise<Element>;
+  mount<TProps extends Record<string, unknown> = Record<string, unknown>>(target: Element, Component: ComponentFunction<TProps>, props?: TProps): Promise<unknown>;
+  inspect(): AsyncLoaderFacadeInspection;
+}
+
 
 export type AttributePatchValue = string | number | boolean | null | undefined;
 export type BuiltAttributePatchTriples = readonly AttributePatchValue[];
@@ -652,9 +667,19 @@ export interface RootInspection {
   roots: Array<{ root: Document | Element | DocumentFragment; loader: LoaderInstance; primary: boolean }>;
 }
 
+export interface RuntimeInspection {
+  active: boolean;
+  started: boolean;
+  destroyed: boolean;
+  target?: RuntimeTarget;
+  roots: RootInspection;
+  loader: AsyncLoaderFacadeInspection;
+  router: boolean;
+}
+
 export interface AppHub {
   registry: RegistryStore;
-  runtime?: AppRuntime;
+  loader: AsyncLoaderFacade;
   use(type: "signal", entries: SignalMap): this;
   use(type: "handler", entries: Record<string, HandlerFunction | LazyDescriptor>): this;
   use(type: "server", entries: Record<string, ServerFunction>): this;
@@ -669,6 +694,7 @@ export interface AppHub {
   detachRoot(root?: Document | Element | DocumentFragment): this;
   applySnapshot(snapshot: RegistryRuntimeSnapshot, options?: { strict?: boolean }): this;
   inspectRoots(): RootInspection;
+  inspectRuntime(): RuntimeInspection;
 }
 
 export interface CreateAppOptions extends LoaderOptions {
@@ -734,6 +760,7 @@ export interface AsyncNamespace extends AppHub {
   detachRoot: AppHub["detachRoot"];
   applySnapshot: AppHub["applySnapshot"];
   inspectRoots: AppHub["inspectRoots"];
+  inspectRuntime: AppHub["inspectRuntime"];
   attributeName: typeof attributeName;
   defineAttributeConfig: typeof defineAttributeConfig;
   AsyncStream: AsyncStreamNamespace;