@tailorkit/client-core 0.1.0-beta.23 → 0.1.0-beta.24

package/dist/chunk-QWOVC765.js

@@ -0,0 +1,222 @@
+import {
+  createEndpointClient
+} from "./chunk-FUBKKH3Q.js";
+import {
+  createFetchCache
+} from "./chunk-BLDTSDUG.js";
+
+// src/client/fetch-client.ts
+function createTailorKitFetchClient(options) {
+  const endpoints = createEndpointClient(options);
+  const cache = createFetchCache(options.cache);
+  const baseUrl = endpoints.baseUrl;
+  const prefix = ["tailorkit", baseUrl.toString()];
+  return {
+    baseUrl,
+    endpoints,
+    cache,
+    cacheOptions: options.cache,
+    apps: (settings = {}) => cache.getStore([...prefix, "apps"], endpoints.apps, { ...options.cache?.apps, ...settings }),
+    meta: (settings = {}) => cache.getStore([...prefix, "meta"], endpoints.meta, { ...options.cache?.meta, ...settings }),
+    clear() {
+      cache.clear();
+      endpoints.clearSessions();
+    }
+  };
+}
+
+// src/client/config.ts
+var componentTagPrefix = "tailorkit-";
+var toComponentTagName = (name) => `${componentTagPrefix}${name.replaceAll(/([a-z0-9])([A-Z])/gu, "$1-$2").replaceAll(/[\s_]+/gu, "-").toLowerCase()}`;
+function createTailorKitClientConfig(options) {
+  return {
+    baseUrl: options.baseUrl,
+    fetchClient: createTailorKitFetchClient(options),
+    components: options.components ?? {},
+    theme: options.theme ?? {}
+  };
+}
+function createComponentRegistry(renderers, wrap) {
+  const components = {};
+  for (const [name, renderer] of Object.entries(renderers)) {
+    if (renderer) {
+      const component = wrap(renderer);
+      components[name] = component;
+      components[toComponentTagName(name)] = component;
+    }
+  }
+  return components;
+}
+
+// src/client/primitive-css.ts
+import { resolveTheme } from "@tailorkit/core/primitives/theme";
+var tokenGroups = [
+  "space",
+  "radius",
+  "background",
+  "border",
+  "borderColor",
+  "textColor"
+];
+var cssEscape = (value) => {
+  const css = globalThis.CSS;
+  if (typeof css?.escape === "function") {
+    return css.escape(value);
+  }
+  return value.replaceAll(/[^A-Za-z0-9_-]/gu, "\\$&");
+};
+var toCssValue = (group, value) => {
+  if (typeof value === "number") {
+    return `${value}px`;
+  }
+  if (group === "size" || group === "raw") {
+    return value;
+  }
+  return `var(--tailorkit-${group}-${cssEscape(value)})`;
+};
+var toResponsiveEntries = (value) => {
+  if (value === void 0) {
+    return [];
+  }
+  if (!(value && typeof value === "object") || Array.isArray(value)) {
+    return [["base", value]];
+  }
+  return Object.entries(value).filter(
+    (entry) => entry[1] !== void 0
+  );
+};
+var declarationsForProp = (prop, value) => {
+  if (prop === "columns") {
+    return [`grid-template-columns: repeat(${String(value)}, minmax(0, 1fr));`];
+  }
+  const tokenDeclarations = {
+    background: ["background", "background"],
+    border: ["border", "border"],
+    borderColor: ["borderColor", "border-color"],
+    textColor: ["textColor", "color"]
+  };
+  const tokenDeclaration = tokenDeclarations[prop];
+  if (tokenDeclaration) {
+    const [group, property] = tokenDeclaration;
+    if (prop === "border") {
+      return [`border-style: ${toCssValue(group, value)};`, "border-width: 1px;"];
+    }
+    return [`${property}: ${toCssValue(group, value)};`];
+  }
+  if (prop === "gap" || prop === "margin" || prop === "padding") {
+    return [`${prop}: ${toCssValue("space", value)};`];
+  }
+  if (prop === "height" || prop === "width") {
+    return [`${prop}: ${toCssValue("size", value)};`];
+  }
+  if (prop === "radius") {
+    return [`border-radius: ${toCssValue("radius", value)};`];
+  }
+  if (prop === "align") {
+    return [`align-items: ${toFlexAlignment(value)};`];
+  }
+  if (prop === "justify") {
+    return [`justify-content: ${toFlexJustification(value)};`];
+  }
+  if (prop === "direction") {
+    return [`flex-direction: ${toCssValue("raw", value)};`];
+  }
+  if (prop === "overflow") {
+    return [`overflow: ${toCssValue("raw", value)};`];
+  }
+  if (prop === "grow") {
+    return [`flex-grow: ${String(value)};`];
+  }
+  if (prop === "shrink") {
+    return [`flex-shrink: ${String(value)};`];
+  }
+  if (prop === "minHeight") {
+    return [`min-height: ${toCssValue("size", value)};`];
+  }
+  if (prop === "minWidth") {
+    return [`min-width: ${toCssValue("size", value)};`];
+  }
+  if (prop === "basis") {
+    return [`flex-basis: ${toCssValue("size", value)};`];
+  }
+  if (prop === "wrap") {
+    return [`flex-wrap: ${toCssValue("raw", value)};`];
+  }
+  return [];
+};
+var toFlexAlignment = (value) => {
+  if (value === "start") {
+    return "flex-start";
+  }
+  if (value === "end") {
+    return "flex-end";
+  }
+  return String(value);
+};
+var toFlexJustification = (value) => {
+  if (value === "start") {
+    return "flex-start";
+  }
+  if (value === "end") {
+    return "flex-end";
+  }
+  if (value === "between") {
+    return "space-between";
+  }
+  return String(value);
+};
+var buildPrimitiveCss = ({
+  display,
+  nodeId,
+  props,
+  viewId,
+  theme
+}) => {
+  const selector = `[data-tailorkit-view="${cssEscape(viewId)}"] [data-tailorkit-node="${cssEscape(
+    nodeId
+  )}"]`;
+  const base = [`display: ${display};`];
+  const byBreakpoint = /* @__PURE__ */ new Map();
+  for (const [prop, rawValue] of Object.entries(props)) {
+    for (const [breakpoint, value] of toResponsiveEntries(rawValue)) {
+      const declarations = declarationsForProp(prop, value);
+      if (declarations.length === 0) {
+        continue;
+      }
+      const target = breakpoint === "base" ? base : byBreakpoint.get(breakpoint) ?? [];
+      target.push(...declarations);
+      if (breakpoint !== "base") {
+        byBreakpoint.set(breakpoint, target);
+      }
+    }
+  }
+  const rules = [`${selector} { ${base.join(" ")} }`];
+  for (const [breakpoint, declarations] of byBreakpoint) {
+    const minWidth = theme.breakpoints?.[breakpoint];
+    if (!minWidth) {
+      continue;
+    }
+    rules.push(`@media (min-width: ${minWidth}) { ${selector} { ${declarations.join(" ")} } }`);
+  }
+  return rules.join("\n");
+};
+var buildThemeCss = (viewId, theme) => {
+  const selector = `[data-tailorkit-view="${cssEscape(viewId)}"]`;
+  const declarations = [];
+  const resolvedTheme = resolveTheme(theme);
+  for (const group of tokenGroups) {
+    for (const [name, value] of Object.entries(resolvedTheme.tokens?.[group] ?? {})) {
+      declarations.push(`--tailorkit-${group}-${cssEscape(name)}: ${value};`);
+    }
+  }
+  return `${selector} { ${declarations.join(" ")} }`;
+};
+
+export {
+  createTailorKitFetchClient,
+  toComponentTagName,
+  createTailorKitClientConfig,
+  createComponentRegistry,
+  buildPrimitiveCss,
+  buildThemeCss
+};

package/dist/client/config.d.ts

@@ -0,0 +1,66 @@
+import type { TailorKitTheme, CallbackMap, ComponentDefinition, ComponentProps, Schema, ViewDefinition, SlotDefinitions } from "@tailorkit/core/schema";
+import type { TailorKitFetchClient, TailorKitCacheOptions } from "./fetch-client";
+export type AnyComponentDefinition = ComponentDefinition<Schema | undefined, CallbackMap, boolean | undefined>;
+export type ComponentRenderer<TComponent extends AnyComponentDefinition, TNode> = (args: {
+    props: ComponentProps<TComponent>;
+    children?: TComponent extends {
+        children: true;
+    } ? TNode : never;
+}) => TNode;
+export type ComponentRenderers<TComponents extends Record<string, AnyComponentDefinition>, TNode> = {
+    [TName in keyof TComponents]?: ComponentRenderer<TComponents[TName], TNode>;
+};
+export type CompleteComponentRenderers<TComponents extends Record<string, AnyComponentDefinition>, TNode> = {
+    [TName in keyof TComponents]-?: ComponentRenderer<TComponents[TName], TNode>;
+};
+export declare const toComponentTagName: (name: string) => string;
+export interface TailorKitClientConfig {
+    readonly baseUrl: string | URL;
+    readonly fetchClient?: TailorKitFetchClient;
+    readonly components: Record<string, unknown>;
+    readonly theme: TailorKitTheme;
+}
+export type SlotMultiple<TSlot> = TSlot extends {
+    multiple: infer TMultiple extends boolean;
+} ? TMultiple : TSlot extends {
+    multiple?: infer TMultiple extends boolean;
+} ? TMultiple | false : false;
+export interface TailorKitServerShape {
+    $internal: {
+        schema: {
+            components: Record<string, unknown>;
+            views: Record<string, unknown>;
+        };
+    };
+}
+type ServerComponentMap<TTailor extends TailorKitServerShape> = TTailor["$internal"]["schema"]["components"];
+export type ServerComponents<TTailor extends TailorKitServerShape> = {
+    [TName in keyof ServerComponentMap<TTailor>]: ServerComponentMap<TTailor>[TName] extends AnyComponentDefinition ? ServerComponentMap<TTailor>[TName] : never;
+};
+type ServerViewMap<TTailor extends TailorKitServerShape> = TTailor["$internal"]["schema"]["views"];
+export type ServerScopeNames<TTailor extends TailorKitServerShape> = TTailor extends {
+    handler: (request: Request, options: infer TOptions) => unknown;
+} ? TOptions extends {
+    authenticate: infer TAuthenticate;
+} ? TAuthenticate extends (...args: infer _TArgs) => infer TResult ? Extract<Awaited<TResult>, {
+    scopes: unknown;
+}> extends {
+    scopes: infer TScopes;
+} ? keyof TScopes & string : never : never : never : never;
+export type ServerViews<TTailor extends TailorKitServerShape> = {
+    [TName in keyof ServerViewMap<TTailor>]: ServerViewMap<TTailor>[TName] extends ViewDefinition ? ServerViewMap<TTailor>[TName] : never;
+};
+export type ServerSlots<TTailor> = TTailor extends {
+    readonly $slots?: infer V extends SlotDefinitions;
+} ? V : SlotDefinitions;
+/** Build framework-independent client configuration after an adapter wraps its renderers. */
+export declare function createTailorKitClientConfig(options: {
+    baseUrl: string | URL;
+    components?: Record<string, unknown>;
+    theme?: TailorKitTheme;
+    cache?: TailorKitCacheOptions;
+    fetch?: typeof fetch;
+}): TailorKitClientConfig;
+/** Register schema names and their remote element aliases with the same wrapped renderer. */
+export declare function createComponentRegistry<T extends Record<string, unknown>, TRenderer>(renderers: T, wrap: (renderer: NonNullable<T[keyof T]>) => TRenderer): Record<string, TRenderer>;
+export {};

package/dist/client/index.d.ts

@@ -6,3 +6,10 @@ export { toBaseUrl } from "./url";
 export { matchesApp } from "./apps";
 export { normalizeScopeSelection, appendScopeSelection } from "./scope-query";
 export { resolveSlotView, selectSlotView } from "./slot-view";
+export { refetchViews } from "./views";
+export type { ViewsQueryOptions } from "./views";
+export * from "./config";
+export * from "./slot-types";
+export { buildPrimitiveCss, buildThemeCss } from "./primitive-css";
+export type { PrimitiveProps } from "./primitive-css";
+export { createValueMemo } from "./value-memo";

package/dist/client/primitive-css.d.ts

@@ -0,0 +1,10 @@
+import type { TailorKitTheme } from "@tailorkit/core/schema";
+export type PrimitiveProps = Record<string, unknown>;
+export declare const buildPrimitiveCss: ({ display, nodeId, props, viewId, theme, }: {
+    display: "block" | "flex" | "grid" | "inline";
+    nodeId: string;
+    props: PrimitiveProps;
+    viewId: string;
+    theme: TailorKitTheme;
+}) => string;
+export declare const buildThemeCss: (viewId: string, theme: TailorKitTheme) => string;

package/dist/client/slot-types.d.ts

@@ -0,0 +1,61 @@
+import type { ViewInstance } from "@tailorkit/app/client";
+import type { SlotDefinitions, ViewDefinition } from "@tailorkit/core/schema";
+import type { ActiveView, ViewStatus } from "@tailorkit/core/views";
+import type { TailorKitApp } from "../types";
+import type { ViewContext, ViewName } from "../store/local/view-context-types";
+type DefaultViews = Record<`/${string}`, ViewDefinition>;
+type ContextPaths<TViews extends Record<string, ViewDefinition>, TView extends ViewName<TViews>> = {
+    [P in ViewName<TViews>]: P extends "/" | TView ? P : TView extends `${P}/${string}` ? P : never;
+}[ViewName<TViews>];
+type ContextFields<TView> = undefined extends ViewContext<TView> ? Partial<Exclude<ViewContext<TView>, undefined>> : ViewContext<TView>;
+export type SlotContext<TViews extends Record<string, ViewDefinition>, TView extends ViewName<TViews>> = {
+    [P in ContextPaths<TViews, TView>]: (context: ContextFields<TViews[P]>) => void;
+}[ContextPaths<TViews, TView>] extends (context: infer TContext) => void ? TContext : never;
+export interface RuntimeSlotProps {
+    app: TailorKitApp;
+    /** The host slot to render in. */
+    name: string;
+    /** Select an instance of the matching view. */
+    instanceKey?: string;
+}
+type InstanceProps<TSlot, TKey extends string, TValue> = boolean extends (TSlot extends {
+    multiple?: infer T;
+} ? T : false) ? {
+    [K in TKey]?: TValue;
+} : TSlot extends {
+    multiple: true;
+} ? {
+    [K in TKey]: TValue;
+} : {
+    [K in TKey]?: never;
+};
+export type SlotProps<TSlots extends SlotDefinitions = SlotDefinitions> = {
+    [TSlot in keyof TSlots & string]: {
+        app: TailorKitApp;
+        name: TSlot;
+    } & InstanceProps<TSlots[TSlot], "instanceKey", string>;
+}[keyof TSlots & string];
+export type ControlledSlotProps<TViews extends Record<string, ViewDefinition> = DefaultViews, TSlots extends SlotDefinitions = SlotDefinitions> = {
+    [TSlot in keyof TSlots & string]: {
+        [TView in Extract<ViewName<TViews>, TSlots[TSlot]["views"][number]>]: {
+            app: TailorKitApp;
+            name: TSlot;
+            view: TView;
+        } & (({
+            context: SlotContext<TViews, TView>;
+            status: "ready";
+        } & InstanceProps<TSlots[TSlot], "instance", ViewInstance>) | {
+            context?: never;
+            status: "loading" | "error";
+            instance?: never;
+        });
+    }[Extract<ViewName<TViews>, TSlots[TSlot]["views"][number]>];
+}[keyof TSlots & string];
+export type SlotState = ActiveView | {
+    view: string;
+    controlled: true;
+    context?: unknown;
+    status: ViewStatus;
+    instance?: ViewInstance;
+};
+export {};

package/dist/client/value-memo.d.ts

@@ -0,0 +1,2 @@
+/** Retain equivalent serialized values without involving a framework's rendering API. */
+export declare function createValueMemo<T>(): (value: T) => T;

package/dist/client/views.d.ts

@@ -0,0 +1,8 @@
+import type { TailorKitStore } from "../store/store";
+export interface ViewsQueryOptions<TScopeNames extends string = string, TSlot extends string = string> {
+    slot: TSlot;
+    scopes?: readonly TScopeNames[];
+    appIds?: readonly string[];
+}
+/** Refresh discovery or instances and join queries created by the resulting state. */
+export declare function refetchViews(store: TailorKitStore, { slot, scopes, appIds }: ViewsQueryOptions): Promise<void>;

package/dist/client.js

@@ -1,22 +1,40 @@
 import {
-  appendScopeSelection,
+  buildPrimitiveCss,
+  buildThemeCss,
+  createComponentRegistry,
+  createTailorKitClientConfig,
   createTailorKitFetchClient,
+  toComponentTagName
+} from "./chunk-QWOVC765.js";
+import {
+  createEndpointClient
+} from "./chunk-FUBKKH3Q.js";
+import {
+  appendScopeSelection,
+  createValueMemo,
   matchesApp,
-  normalizeScopeSelection
-} from "./chunk-DPR3U4U2.js";
+  normalizeScopeSelection,
+  refetchViews
+} from "./chunk-LNGQREZV.js";
 import {
-  createEndpointClient,
   resolveSlotView,
   selectSlotView,
   toBaseUrl
-} from "./chunk-RNTQ3LLF.js";
+} from "./chunk-BLDTSDUG.js";
 export {
   appendScopeSelection,
+  buildPrimitiveCss,
+  buildThemeCss,
+  createComponentRegistry,
   createEndpointClient,
+  createTailorKitClientConfig,
   createTailorKitFetchClient,
+  createValueMemo,
   matchesApp,
   normalizeScopeSelection,
+  refetchViews,
   resolveSlotView,
   selectSlotView,
-  toBaseUrl
+  toBaseUrl,
+  toComponentTagName
 };

package/dist/index.js

@@ -1,27 +1,45 @@
 import {
-  appendScopeSelection,
+  buildPrimitiveCss,
+  buildThemeCss,
+  createComponentRegistry,
+  createTailorKitClientConfig,
   createTailorKitFetchClient,
-  matchesApp,
-  normalizeScopeSelection
-} from "./chunk-DPR3U4U2.js";
+  toComponentTagName
+} from "./chunk-QWOVC765.js";
 import {
   createAppsStore,
   createMetadataStore,
-  createPreviewManager,
-  createSlotStore
-} from "./chunk-K3QITWU4.js";
+  createPreviewManager
+} from "./chunk-CWDPTXSZ.js";
+import {
+  createEndpointClient
+} from "./chunk-FUBKKH3Q.js";
+import {
+  NodeStore,
+  appsQueryKey,
+  createAppViewsQuery,
+  createAppsQuery,
+  createRemoteElementProps,
+  createRemoteViewStore,
+  createSlotRuntime,
+  createViewContextStore,
+  createViewsQuery
+} from "./chunk-N4X53WS2.js";
+import {
+  appendScopeSelection,
+  createValueMemo,
+  matchesApp,
+  normalizeScopeSelection,
+  refetchViews
+} from "./chunk-LNGQREZV.js";
 import {
-  createEndpointClient,
   createFetchCache,
+  createSlotStore,
   resolveSlotView,
   selectSlotView,
   serializeCacheKey,
   toBaseUrl
-} from "./chunk-RNTQ3LLF.js";
-import {
-  NodeStore,
-  createViewRegistry
-} from "./chunk-ED3BWTXG.js";
+} from "./chunk-BLDTSDUG.js";
 
 // src/store/store.ts
 function createTailorKitStore(baseUrl, initialApps, client = createTailorKitFetchClient({ baseUrl })) {
@@ -34,7 +52,7 @@ function createTailorKitStore(baseUrl, initialApps, client = createTailorKitFetc
     baseUrl: client.baseUrl,
     client,
     fetch: { apps, meta },
-    views: createViewRegistry(),
+    views: createViewContextStore(client),
     setProvidedApps: apps.setProvidedApps,
     fetchApps: apps.fetch,
     fetchMeta: meta.fetch,
@@ -55,19 +73,33 @@ function createTailorKitStore(baseUrl, initialApps, client = createTailorKitFetc
 export {
   NodeStore,
   appendScopeSelection,
+  appsQueryKey,
+  buildPrimitiveCss,
+  buildThemeCss,
+  createAppViewsQuery,
+  createAppsQuery,
   createAppsStore,
+  createComponentRegistry,
   createEndpointClient,
   createFetchCache,
   createMetadataStore,
   createPreviewManager,
+  createRemoteElementProps,
+  createRemoteViewStore,
+  createSlotRuntime,
   createSlotStore,
+  createTailorKitClientConfig,
   createTailorKitFetchClient,
   createTailorKitStore,
-  createViewRegistry,
+  createValueMemo,
+  createViewContextStore,
+  createViewsQuery,
   matchesApp,
   normalizeScopeSelection,
+  refetchViews,
   resolveSlotView,
   selectSlotView,
   serializeCacheKey,
-  toBaseUrl
+  toBaseUrl,
+  toComponentTagName
 };

package/dist/store/fetch/apps.d.ts

@@ -15,4 +15,5 @@ export declare function createAppsStore(client: TailorKitFetchClient, initialApp
     setProvidedApps(apps: TailorKitApp[] | undefined): void;
     updateViews(appId: string, appViews: NonNullable<TailorKitApp["views"]>): void;
     invalidate: () => Promise<void>;
+    state: import("nanostores").ReadableAtom<TailorKitAppsSnapshot>;
 };

package/dist/store/fetch/cache.d.ts

@@ -1,3 +1,4 @@
+import type { ReadableAtom } from "nanostores";
 export interface FetchCacheOptions {
     /** Milliseconds before a successful response needs refreshing. Infinity keeps it fresh. */
     staleTime?: number;
@@ -14,8 +15,9 @@ export interface FetchSnapshot<T> {
 export interface FetchOptions extends Pick<FetchCacheOptions, "staleTime"> {
     force?: boolean;
 }
-/** Framework-neutral contract; adapters need not depend on the state library. */
+/** A cached request and readable state shared across framework adapters. */
 export interface FetchStore<T> {
+    state: ReadableAtom<FetchSnapshot<T>>;
     getSnapshot: () => FetchSnapshot<T>;
     subscribe: (listener: () => void) => () => void;
     fetch: (options?: FetchOptions) => Promise<void>;

package/dist/store/fetch/meta.d.ts

@@ -13,4 +13,5 @@ export declare function createMetadataStore(client: TailorKitFetchClient): {
     subscribe: (listener: () => void) => () => void;
     fetch: (options?: import("./cache").FetchOptions) => Promise<void>;
     invalidate: () => Promise<void>;
+    state: import("nanostores").ReadableAtom<TailorKitMetaSnapshot>;
 };

package/dist/store/fetch/preview-manager.d.ts

@@ -8,4 +8,5 @@ export declare function createPreviewManager(baseUrl: URL, onEnded: () => void,
     updateApp: (app: TailorKitApp) => void;
     subscribe: (app: TailorKitApp, listener: () => void) => (() => void);
     dispose: () => void;
+    getStore(getApp: () => TailorKitApp): import("nanostores").ReadableAtom<PreviewSnapshot>;
 };

package/dist/store/fetch/slot.d.ts

@@ -28,5 +28,6 @@ export declare function createSlotStore(client: TailorKitFetchClient, options: S
     subscribe: (listener: () => void) => () => void;
     fetch: (fetchOptions?: FetchOptions) => Promise<void>;
     invalidate: () => Promise<void>;
+    state: import("nanostores").ReadableAtom<SlotSnapshot>;
 };
 export {};

package/dist/store/index.d.ts

@@ -2,3 +2,5 @@ export { createTailorKitStore } from "./store";
 export type { TailorKitStore } from "./store";
 export * from "./fetch/index";
 export * from "./local/index";
+export { createAppsQuery, createViewsQuery, createAppViewsQuery, appsQueryKey } from "./query";
+export type { AppsQueryOptions, QueryResult, ViewsQueryResult } from "./query";

package/dist/store/local/index.d.ts

@@ -1,4 +1,9 @@
 export { NodeStore } from "./node-store";
 export type { NodeSnapshot } from "./node-store";
-export { createViewRegistry } from "./view-registry";
-export type { ViewEntry } from "./view-registry";
+export { createRemoteViewStore, createRemoteElementProps } from "./remote-view";
+export type { RemoteViewStore, RemoteViewStoreOptions, RemoteViewMountOptions, RemoteViewSnapshot, } from "./remote-view";
+export { createViewContextStore } from "./view-context";
+export type { ViewEntry } from "./view-context";
+export type { ViewContext, ViewContextRegistration, ViewContextState, ViewName, ViewOptions, ViewState, } from "./view-context-types";
+export { createSlotRuntime } from "./slot-runtime";
+export type { SlotRuntimeOptions, SlotRuntimeSnapshot } from "./slot-runtime";

package/dist/store/local/node-store.d.ts

@@ -6,11 +6,13 @@ export interface NodeSnapshot {
 }
 export declare class NodeStore {
     readonly state: import("nanostores").PreinitializedWritableAtom<NodeSnapshot> & object;
+    readonly root: import("nanostores").ReadableAtom<string | null>;
     private signatures;
     clear(): void;
     setSnapshot(tree: RemoteNode): void;
     getRootId(): string | null;
     getNode(id: string): RemoteNode | null;
+    selectNode(id: string): import("nanostores").ReadableAtom<RemoteNode | null>;
     subscribe(id: string, listener: Listener): () => void;
     subscribeRoot(listener: Listener): () => void;
 }

package/dist/store/local/remote-view.d.ts

@@ -0,0 +1,31 @@
+import { createIframeUiHost } from "@tailorkit/sandbox/host";
+import type { IframeUiHostOptions } from "@tailorkit/sandbox/host";
+import type { HostToIframePayload, RemoteElementNode } from "@tailorkit/sandbox/protocol";
+import { NodeStore } from "./node-store";
+export interface RemoteViewSnapshot {
+    error: Error | null;
+    generation: number;
+    status: "starting" | "ready" | "error";
+}
+export interface RemoteViewStoreOptions {
+    components?: Record<string, unknown>;
+    props?: Record<string, unknown>;
+}
+export interface RemoteViewMountOptions extends Omit<IframeUiHostOptions, "onError" | "props"> {
+    appUrl: string | URL;
+}
+/** One remote app's state and host lifecycle, independent of its rendering framework. */
+export declare function createRemoteViewStore(options?: RemoteViewStoreOptions, createHost?: typeof createIframeUiHost): {
+    nodes: NodeStore;
+    components: import("nanostores").PreinitializedWritableAtom<Record<string, unknown>> & object;
+    state: import("nanostores").PreinitializedWritableAtom<RemoteViewSnapshot> & object;
+    selectComponent: (name: string) => import("nanostores").ReadableAtom<unknown>;
+    setComponents: (registry: Record<string, unknown>) => void;
+    setProps(next: Record<string, unknown> | undefined): void;
+    dispatch(payload: HostToIframePayload): void;
+    mount({ appUrl, ...hostOptions }: RemoteViewMountOptions): () => void;
+    destroy(): void;
+};
+export type RemoteViewStore = ReturnType<typeof createRemoteViewStore>;
+/** Bind remote callbacks to their protocol payload without framework event arguments leaking. */
+export declare function createRemoteElementProps(node: RemoteElementNode, dispatch: RemoteViewStore["dispatch"]): Record<string, unknown>;