@pibbl/core 0.0.1

package/dist/lib/backend/types.d.ts

@@ -0,0 +1,309 @@
+import type { registerNestedInteractionResolver, useBackendEventTarget } from "../../internal.js";
+import type { mountBackendPibbl } from "../mount-pibbl.js";
+import type { defineBackendPrimitive } from "../define-primitive.js";
+import type { PibblElementSource } from '../element/metadata.js';
+import type { PibblNode, PibblNodeInput } from '../element/types.js';
+import type { PibblHitTestOutput } from '../events/paint-entry.js';
+import type { PibblEventFocusOptions, PibblEventHandlers } from '../events/types.js';
+import type { MeasureInput, MeasureResult, NormalizedStyle, PreservedSignalPropKey, PrimitiveProgramProps, ResolvedStyle, SpecifiedStyle, StyleResolutionContext, SystemStyle, Canvas, RenderingContext2D } from '../types.js';
+import type { RenderTargetSnapshot } from '../render-target.js';
+declare const PIBBL_BACKEND_TOKEN: unique symbol;
+/**
+ * Opaque identity for one official Pibbl rendering backend.
+ *
+ * @see {@link createBackendToken}
+ * @see {@link PibblBackendDriver}
+ * @see {@link PibblBackendPrimitiveDefinition}
+ */
+export interface PibblBackendToken {
+    readonly [PIBBL_BACKEND_TOKEN]: true;
+}
+/**
+ * Creates a package-private backend identity for an official Pibbl renderer.
+ *
+ * @param name - Diagnostic name identifying the backend.
+ * @returns A unique backend identity token. See {@link PibblBackendToken}.
+ *
+ * @see {@link PibblBackendToken}
+ */
+export declare function createBackendToken(name: string): PibblBackendToken;
+/** @internal Used only for diagnostics and dispatch inside core. */
+export declare function getBackendTokenName(token: PibblBackendToken): string;
+/**
+ * Executable primitive rendering program recognized by the backend.
+ *
+ * @param props - Resolved non-style component inputs. See {@link PrimitiveProgramProps}.
+ * @param style - Resolved primitive style. See {@link ResolvedStyle}.
+ * @param environment - Backend environment for the active frame.
+ * @returns Child nodes to traverse, or no children. See {@link PibblNodeInput}.
+ *
+ * @see {@link SystemStyle}
+ * @see {@link PrimitiveProgramProps}
+ * @see {@link ResolvedStyle}
+ * @see {@link PibblNodeInput}
+ * @see {@link PibblBackendPrimitiveDefinition}
+ * @see {@link defineBackendPrimitive}
+ */
+export type PibblBackendPrimitiveProgram<P = any, R extends SystemStyle = SystemStyle, E = any> = (props: Readonly<PrimitiveProgramProps<P>>, style: ResolvedStyle<R>, environment: E) => PibblNodeInput | void;
+/**
+ * Rendering, style, and measurement definition of a backend primitive.
+ *
+ * @see {@link SystemStyle}
+ * @see {@link PibblBackendToken}
+ * @see {@link PibblBackendPrimitiveProgram}
+ * @see {@link SpecifiedStyle}
+ * @see {@link NormalizedStyle}
+ * @see {@link StyleResolutionContext}
+ * @see {@link ResolvedStyle}
+ * @see {@link MeasureInput}
+ * @see {@link PrimitiveProgramProps}
+ * @see {@link MeasureResult}
+ * @see {@link PibblBackendPrimitiveInput}
+ */
+export interface PibblBackendPrimitiveDefinition<P = any, S extends SystemStyle = SystemStyle, N extends SystemStyle = S, R extends SystemStyle = N, E = any> {
+    /** Identity of the backend that accepts this primitive. See {@link PibblBackendToken}. */
+    readonly backend: PibblBackendToken;
+    /**
+     * Names props whose signal identity is preserved for the primitive program. See
+     * {@link PreservedSignalPropKey}.
+     */
+    readonly preserveSignalProps?: readonly PreservedSignalPropKey<P>[];
+    /**
+     * Declares how the primitive receives and resolves its children. See
+     * {@link PibblBackendPrimitiveDefinition}.
+     */
+    readonly childInput?: 'structural' | 'text';
+    /** Executable primitive program used by the backend. See {@link PibblBackendPrimitiveProgram}. */
+    readonly program: PibblBackendPrimitiveProgram<P, R, E>;
+    /**
+     * Applies primitive defaults and shorthand normalization before layout resolution. See
+     * {@link SpecifiedStyle}, {@link NormalizedStyle}.
+     * @param style - Specified style values before normalization. See {@link SpecifiedStyle}.
+     * @returns Normalized style with the primitive's shorthand and defaults applied. See
+     * {@link NormalizedStyle} .
+     */
+    readonly normalizeStyle?: (style: SpecifiedStyle<S>) => NormalizedStyle<N>;
+    /**
+     * Resolves normalized style using the current layout context. See {@link NormalizedStyle},
+     * {@link StyleResolutionContext}, {@link ResolvedStyle}.
+     * @param style - Normalized style to resolve. See {@link NormalizedStyle}.
+     * @param context - Layout and diagnostic context for resolution. See
+     * {@link StyleResolutionContext} .
+     * @returns Resolved style ready for rendering. See {@link ResolvedStyle}.
+     */
+    readonly resolveStyle?: (style: NormalizedStyle<N>, context: Readonly<StyleResolutionContext>) => ResolvedStyle<R>;
+    /**
+     * Measures declared primitive inputs without painting or retaining draw commands. See
+     * {@link MeasureInput}, {@link PrimitiveProgramProps}, {@link MeasureResult}.
+     * @param input - Props, normalized style, constraints, and nested measurement services. See
+     * {@link MeasureInput} , {@link PrimitiveProgramProps} .
+     * @returns Measured dimensions or an unsupported measurement result. See {@link MeasureResult}.
+     */
+    readonly measure?: (input: MeasureInput<PrimitiveProgramProps<P>, N>) => MeasureResult;
+}
+/**
+ * Inputs used to begin a backend frame.
+ *
+ * @see {@link Canvas}
+ * @see {@link PibblBackendDriver}
+ */
+export interface PibblBackendFrameInput {
+    /** Canvas surface associated with this resource or mount. See {@link Canvas}. */
+    readonly canvas: Canvas;
+    /** Canvas width in logical units. See {@link PibblBackendFrameInput}. */
+    readonly logicalWidth: number;
+    /** Canvas height in logical units. See {@link PibblBackendFrameInput}. */
+    readonly logicalHeight: number;
+    /** Width of the backing raster in physical pixels. See {@link PibblBackendFrameInput}. */
+    readonly backingWidth: number;
+    /** Height of the backing raster in physical pixels. See {@link PibblBackendFrameInput}. */
+    readonly backingHeight: number;
+    /** Timestamp associated with this render frame. See {@link PibblBackendFrameInput}. */
+    readonly renderTimestamp: number;
+}
+/**
+ * The backend rendering context for one scheduled frame.
+ *
+ * @see {@link RenderingContext2D}
+ * @see {@link PibblBackendDriver}
+ */
+export interface PibblBackendFrame<E> {
+    /** Backend environment used while evaluating the frame. See {@link PibblBackendFrame}. */
+    readonly environment: E;
+    /** Canvas 2D context used for the current frame. See {@link RenderingContext2D}. */
+    readonly context2D?: RenderingContext2D;
+    /** Current drawing target owned by the backend frame. See {@link RenderTargetSnapshot}. */
+    readonly renderTarget?: RenderTargetSnapshot;
+    /**
+     * World transform establishing the backend frame's logical coordinate basis. See
+     * {@link PibblBackendFrame}.
+     */
+    readonly worldBaseTransform?: DOMMatrix;
+}
+/**
+ * Resolved inputs delivered to a backend primitive program.
+ *
+ * @see {@link PibblElementSource}
+ * @see {@link PibblBackendPrimitiveDefinition}
+ * @see {@link PibblBackendDriver}
+ */
+export interface PibblBackendPrimitiveInput {
+    /** Component name retained for diagnostics. See {@link PibblBackendPrimitiveInput}. */
+    readonly componentName: string;
+    /** Authoring source location retained for diagnostics. See {@link PibblElementSource}. */
+    readonly source?: PibblElementSource;
+    /**
+     * Primitive definition used to resolve and render the supplied inputs. See
+     * {@link PibblBackendPrimitiveDefinition}.
+     */
+    readonly definition: PibblBackendPrimitiveDefinition;
+    /**
+     * Component props supplied to evaluation or measurement. See {@link PibblBackendPrimitiveInput}.
+     */
+    readonly props: Readonly<Record<PropertyKey, unknown>>;
+    /** Declared presentation and layout properties. See {@link PibblBackendPrimitiveInput}. */
+    readonly style: Readonly<Record<PropertyKey, unknown>>;
+    /**
+     * Transform applied to the primitive's presented Canvas geometry. See
+     * {@link PibblBackendPrimitiveInput}.
+     */
+    readonly presentationTransform2D?: DOMMatrix;
+}
+/**
+ * A mounted backend's frame execution and cleanup operations.
+ *
+ * @see {@link Canvas}
+ * @see {@link PibblNode}
+ * @see {@link PibblNestedResolverInput}
+ * @see {@link mountBackendPibbl}
+ */
+export interface PibblBackendMount {
+    /** Canvas surface associated with this resource or mount. See {@link Canvas}. */
+    readonly canvas: Canvas;
+    /**
+     * Updates the backend surface to the supplied dimensions. See {@link PibblBackendMount}.
+     * @param logicalWidth - New logical viewport width.
+     * @param logicalHeight - New logical viewport height.
+     */
+    resize(logicalWidth: number, logicalHeight: number): void;
+    /**
+     * Renders the current data or resources using the supplied context. See {@link PibblBackendMount}
+     * .
+     * @param root - Node tree to render. See {@link PibblNode}.
+     * @param timestamp - Frame timestamp in milliseconds.
+     */
+    render(root: PibblNode, timestamp: number): void;
+    /**
+     * Requests future work from the owning scheduler. See {@link PibblBackendMount}.
+     * @param updateParents - Whether ancestor compositions also need to be scheduled.
+     */
+    requestFrame(updateParents: boolean): void;
+    /** Releases resources owned by this mounted object. See {@link PibblBackendMount}. */
+    dispose(): void;
+}
+/**
+ * Version-coupled rendering backend lifecycle used by official integrations.
+ *
+ * @see {@link PibblBackendToken}
+ * @see {@link PibblBackendFrameInput}
+ * @see {@link PibblBackendFrame}
+ * @see {@link PibblBackendPrimitiveInput}
+ * @see {@link PibblNodeInput}
+ * @see {@link PibblBackendMountOptions}
+ */
+export interface PibblBackendDriver<E> {
+    /** Identity token distinguishing this backend driver. See {@link PibblBackendToken}. */
+    readonly token: PibblBackendToken;
+    /** Name identifying this backend, emitter, or parameter. See {@link PibblBackendDriver}. */
+    readonly name: string;
+    /**
+     * Begins backend work for one shared scheduler frame. See {@link PibblBackendFrame}.
+     * @param input - Root surface, timestamp, and logical dimensions for this render. See
+     * {@link PibblBackendFrameInput} .
+     * @returns Frame state, or undefined when no frame should be rendered. See
+     * {@link PibblBackendFrame} .
+     */
+    beginFrame(input: PibblBackendFrameInput): PibblBackendFrame<E> | undefined;
+    /**
+     * Enters a component's backend evaluation scope. See {@link PibblBackendDriver}.
+     * @param frame - Frame whose component environment should become active. See
+     * {@link PibblBackendFrame} .
+     * @returns A cleanup function restoring the previous environment.
+     */
+    enterComponent(frame: PibblBackendFrame<E>): () => void;
+    /**
+     * Runs a primitive's drawing program in the current backend frame. See {@link PibblBackendDriver}
+     * .
+     * @param frame - Active backend frame. See {@link PibblBackendFrame}.
+     * @param input - Primitive descriptor and resolved rendering inputs. See
+     * {@link PibblBackendPrimitiveInput} .
+     * @param runProgram - Runtime callback used to invoke the primitive program. See
+     * {@link PibblNodeInput} .
+     */
+    runPrimitive(frame: PibblBackendFrame<E>, input: PibblBackendPrimitiveInput, runProgram: (invoke: () => PibblNodeInput | void) => void): void;
+    /**
+     * Completes the backend frame and its pending composition work. See {@link PibblBackendDriver}.
+     * @param frame - Frame returned by beginFrame. See {@link PibblBackendFrame}.
+     * @param success - Whether traversal completed successfully.
+     */
+    finishFrame(frame: PibblBackendFrame<E>, success: boolean): void;
+    /** Releases resources owned by this mounted object. See {@link PibblBackendDriver}. */
+    dispose(): void;
+}
+/**
+ * Canvas, configuration, and ownership inputs used to create a backend mount.
+ *
+ * @see {@link Canvas}
+ * @see {@link PibblBackendDriver}
+ * @see {@link mountBackendPibbl}
+ */
+export interface PibblBackendMountOptions<E> {
+    /** Owning parent runtime instance. See {@link Canvas}. */
+    readonly parent: Canvas;
+    /** Canvas width in logical units. See {@link PibblBackendMountOptions}. */
+    readonly logicalWidth: number;
+    /** Canvas height in logical units. See {@link PibblBackendMountOptions}. */
+    readonly logicalHeight: number;
+    /** Backend driver responsible for this mount. See {@link PibblBackendDriver}. */
+    readonly driver: PibblBackendDriver<E>;
+}
+/**
+ * Backend target registration options with logical interaction geometry.
+ *
+ * @see {@link useBackendEventTarget}
+ */
+export interface PibblBackendEventTargetOptions extends PibblEventFocusOptions {
+    /**
+     * Cursor shown while this target owns pointer presentation. See
+     * {@link PibblBackendEventTargetOptions}.
+     */
+    readonly cursor?: string;
+    /** Defers backend-owned focus geometry until its visual generation commits. */
+    readonly deferKeyboardNavigationGeometry?: boolean;
+}
+/**
+ * Context supplied when resolving nested content through a backend.
+ *
+ * @see {@link PibblBackendMount}
+ * @see {@link PibblHitTestOutput}
+ * @see {@link registerNestedInteractionResolver}
+ */
+export interface PibblNestedResolverInput {
+    /** Nested child content to resolve. See {@link PibblBackendMount}. */
+    readonly child: PibblBackendMount;
+    /** Logical region constraining the content or query. See {@link PibblNestedResolverInput}. */
+    readonly bounds: Path2D;
+    /** Whether this content participates in pointer targeting. See {@link PibblNestedResolverInput}. */
+    readonly pointerEvents: 'auto' | 'none';
+    /**
+     * Resolves nested content in the current local coordinate system. See
+     * {@link PibblNestedResolverInput}.
+     * @param localX - Horizontal position in resolver-local coordinates.
+     * @param localY - Vertical position in resolver-local coordinates.
+     * @param output - Mutable hit-test result to populate. See {@link PibblHitTestOutput}.
+     */
+    resolveLocal(localX: number, localY: number, output: PibblHitTestOutput): void;
+}
+/** @internal */
+export declare function backendMismatchError(componentName: string, required: PibblBackendToken, active: PibblBackendDriver<unknown>, source?: PibblElementSource): Error;
+export type { PibblEventHandlers };

package/dist/lib/backend/types.js

@@ -0,0 +1,26 @@
+const backendNames = /* @__PURE__ */ new WeakMap();
+function createBackendToken(name) {
+  if (!name.trim()) {
+    throw new Error("Pibbl backend names must be nonempty.");
+  }
+  const token = Object.freeze({});
+  backendNames.set(token, name);
+  return token;
+}
+function getBackendTokenName(token) {
+  return backendNames.get(token) ?? "unknown";
+}
+function backendMismatchError(componentName, required, active, source) {
+  const requiredName = getBackendTokenName(required);
+  const prefix = `${componentName} requires the ${requiredName} backend and cannot render in the ${active.name} root.`;
+  return new Error(withJSXSource(prefix, source));
+}
+function withJSXSource(message, source) {
+  return source ? `${message} JSX source: ${source.fileName}:${source.lineNumber}:${source.columnNumber}.` : message;
+}
+export {
+  backendMismatchError,
+  createBackendToken,
+  getBackendTokenName
+};
+//# sourceMappingURL=types.js.map

package/dist/lib/backend/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/lib/backend/types.ts"],
+  "sourcesContent": ["import type { registerNestedInteractionResolver, useBackendEventTarget } from '../../internal.js';\nimport type { mountBackendPibbl } from '../mount-pibbl.js';\nimport type { defineBackendPrimitive } from '../define-primitive.js';\nimport type { PibblElementSource } from '../element/metadata.js';\nimport type { PibblNode, PibblNodeInput } from '../element/types.js';\nimport type { PibblHitTestOutput } from '../events/paint-entry.js';\nimport type { PibblEventFocusOptions, PibblEventHandlers } from '../events/types.js';\nimport type {\n  MeasureInput,\n  MeasureResult,\n  NormalizedStyle,\n  PreservedSignalPropKey,\n  PrimitiveProgramProps,\n  ResolvedStyle,\n  SpecifiedStyle,\n  StyleResolutionContext,\n  SystemStyle,\n  Canvas,\n  RenderingContext2D,\n} from '../types.js';\nimport type { RenderTargetSnapshot } from '../render-target.js';\n\ndeclare const PIBBL_BACKEND_TOKEN: unique symbol;\n\n/**\n * Opaque identity for one official Pibbl rendering backend.\n *\n * @see {@link createBackendToken}\n * @see {@link PibblBackendDriver}\n * @see {@link PibblBackendPrimitiveDefinition}\n */\nexport interface PibblBackendToken {\n  readonly [PIBBL_BACKEND_TOKEN]: true;\n}\n\nconst backendNames = new WeakMap<PibblBackendToken, string>();\n\n/**\n * Creates a package-private backend identity for an official Pibbl renderer.\n *\n * @param name - Diagnostic name identifying the backend.\n * @returns A unique backend identity token. See {@link PibblBackendToken}.\n *\n * @see {@link PibblBackendToken}\n */\nexport function createBackendToken(name: string): PibblBackendToken {\n  if (!name.trim()) {\n    throw new Error('Pibbl backend names must be nonempty.');\n  }\n  const token = Object.freeze({}) as PibblBackendToken;\n  backendNames.set(token, name);\n  return token;\n}\n\n/** @internal Used only for diagnostics and dispatch inside core. */\nexport function getBackendTokenName(token: PibblBackendToken): string {\n  return backendNames.get(token) ?? 'unknown';\n}\n\n/**\n * Executable primitive rendering program recognized by the backend.\n *\n * @param props - Resolved non-style component inputs. See {@link PrimitiveProgramProps}.\n * @param style - Resolved primitive style. See {@link ResolvedStyle}.\n * @param environment - Backend environment for the active frame.\n * @returns Child nodes to traverse, or no children. See {@link PibblNodeInput}.\n *\n * @see {@link SystemStyle}\n * @see {@link PrimitiveProgramProps}\n * @see {@link ResolvedStyle}\n * @see {@link PibblNodeInput}\n * @see {@link PibblBackendPrimitiveDefinition}\n * @see {@link defineBackendPrimitive}\n */\nexport type PibblBackendPrimitiveProgram<\n  P = any,\n  R extends SystemStyle = SystemStyle,\n  E = any,\n> = (\n  props: Readonly<PrimitiveProgramProps<P>>,\n  style: ResolvedStyle<R>,\n  environment: E,\n) => PibblNodeInput | void;\n\n/**\n * Rendering, style, and measurement definition of a backend primitive.\n *\n * @see {@link SystemStyle}\n * @see {@link PibblBackendToken}\n * @see {@link PibblBackendPrimitiveProgram}\n * @see {@link SpecifiedStyle}\n * @see {@link NormalizedStyle}\n * @see {@link StyleResolutionContext}\n * @see {@link ResolvedStyle}\n * @see {@link MeasureInput}\n * @see {@link PrimitiveProgramProps}\n * @see {@link MeasureResult}\n * @see {@link PibblBackendPrimitiveInput}\n */\nexport interface PibblBackendPrimitiveDefinition<\n  P = any,\n  S extends SystemStyle = SystemStyle,\n  N extends SystemStyle = S,\n  R extends SystemStyle = N,\n  E = any,\n> {\n  /** Identity of the backend that accepts this primitive. See {@link PibblBackendToken}. */\n  readonly backend: PibblBackendToken;\n  /**\n   * Names props whose signal identity is preserved for the primitive program. See\n   * {@link PreservedSignalPropKey}.\n   */\n  readonly preserveSignalProps?: readonly PreservedSignalPropKey<P>[];\n  /**\n   * Declares how the primitive receives and resolves its children. See\n   * {@link PibblBackendPrimitiveDefinition}.\n   */\n  readonly childInput?: 'structural' | 'text';\n  /** Executable primitive program used by the backend. See {@link PibblBackendPrimitiveProgram}. */\n  readonly program: PibblBackendPrimitiveProgram<P, R, E>;\n  /**\n   * Applies primitive defaults and shorthand normalization before layout resolution. See\n   * {@link SpecifiedStyle}, {@link NormalizedStyle}.\n   * @param style - Specified style values before normalization. See {@link SpecifiedStyle}.\n   * @returns Normalized style with the primitive's shorthand and defaults applied. See\n   * {@link NormalizedStyle} .\n   */\n  readonly normalizeStyle?: (style: SpecifiedStyle<S>) => NormalizedStyle<N>;\n  /**\n   * Resolves normalized style using the current layout context. See {@link NormalizedStyle},\n   * {@link StyleResolutionContext}, {@link ResolvedStyle}.\n   * @param style - Normalized style to resolve. See {@link NormalizedStyle}.\n   * @param context - Layout and diagnostic context for resolution. See\n   * {@link StyleResolutionContext} .\n   * @returns Resolved style ready for rendering. See {@link ResolvedStyle}.\n   */\n  readonly resolveStyle?: (\n    style: NormalizedStyle<N>,\n    context: Readonly<StyleResolutionContext>,\n  ) => ResolvedStyle<R>;\n  /**\n   * Measures declared primitive inputs without painting or retaining draw commands. See\n   * {@link MeasureInput}, {@link PrimitiveProgramProps}, {@link MeasureResult}.\n   * @param input - Props, normalized style, constraints, and nested measurement services. See\n   * {@link MeasureInput} , {@link PrimitiveProgramProps} .\n   * @returns Measured dimensions or an unsupported measurement result. See {@link MeasureResult}.\n   */\n  readonly measure?: (input: MeasureInput<PrimitiveProgramProps<P>, N>) => MeasureResult;\n}\n\n/**\n * Inputs used to begin a backend frame.\n *\n * @see {@link Canvas}\n * @see {@link PibblBackendDriver}\n */\nexport interface PibblBackendFrameInput {\n  /** Canvas surface associated with this resource or mount. See {@link Canvas}. */\n  readonly canvas: Canvas;\n  /** Canvas width in logical units. See {@link PibblBackendFrameInput}. */\n  readonly logicalWidth: number;\n  /** Canvas height in logical units. See {@link PibblBackendFrameInput}. */\n  readonly logicalHeight: number;\n  /** Width of the backing raster in physical pixels. See {@link PibblBackendFrameInput}. */\n  readonly backingWidth: number;\n  /** Height of the backing raster in physical pixels. See {@link PibblBackendFrameInput}. */\n  readonly backingHeight: number;\n  /** Timestamp associated with this render frame. See {@link PibblBackendFrameInput}. */\n  readonly renderTimestamp: number;\n}\n\n/**\n * The backend rendering context for one scheduled frame.\n *\n * @see {@link RenderingContext2D}\n * @see {@link PibblBackendDriver}\n */\nexport interface PibblBackendFrame<E> {\n  /** Backend environment used while evaluating the frame. See {@link PibblBackendFrame}. */\n  readonly environment: E;\n  /** Canvas 2D context used for the current frame. See {@link RenderingContext2D}. */\n  readonly context2D?: RenderingContext2D;\n  /** Current drawing target owned by the backend frame. See {@link RenderTargetSnapshot}. */\n  readonly renderTarget?: RenderTargetSnapshot;\n  /**\n   * World transform establishing the backend frame's logical coordinate basis. See\n   * {@link PibblBackendFrame}.\n   */\n  readonly worldBaseTransform?: DOMMatrix;\n}\n\n/**\n * Resolved inputs delivered to a backend primitive program.\n *\n * @see {@link PibblElementSource}\n * @see {@link PibblBackendPrimitiveDefinition}\n * @see {@link PibblBackendDriver}\n */\nexport interface PibblBackendPrimitiveInput {\n  /** Component name retained for diagnostics. See {@link PibblBackendPrimitiveInput}. */\n  readonly componentName: string;\n  /** Authoring source location retained for diagnostics. See {@link PibblElementSource}. */\n  readonly source?: PibblElementSource;\n  /**\n   * Primitive definition used to resolve and render the supplied inputs. See\n   * {@link PibblBackendPrimitiveDefinition}.\n   */\n  readonly definition: PibblBackendPrimitiveDefinition;\n  /**\n   * Component props supplied to evaluation or measurement. See {@link PibblBackendPrimitiveInput}.\n   */\n  readonly props: Readonly<Record<PropertyKey, unknown>>;\n  /** Declared presentation and layout properties. See {@link PibblBackendPrimitiveInput}. */\n  readonly style: Readonly<Record<PropertyKey, unknown>>;\n  /**\n   * Transform applied to the primitive's presented Canvas geometry. See\n   * {@link PibblBackendPrimitiveInput}.\n   */\n  readonly presentationTransform2D?: DOMMatrix;\n}\n\n/**\n * A mounted backend's frame execution and cleanup operations.\n *\n * @see {@link Canvas}\n * @see {@link PibblNode}\n * @see {@link PibblNestedResolverInput}\n * @see {@link mountBackendPibbl}\n */\nexport interface PibblBackendMount {\n  /** Canvas surface associated with this resource or mount. See {@link Canvas}. */\n  readonly canvas: Canvas;\n  /**\n   * Updates the backend surface to the supplied dimensions. See {@link PibblBackendMount}.\n   * @param logicalWidth - New logical viewport width.\n   * @param logicalHeight - New logical viewport height.\n   */\n  resize(logicalWidth: number, logicalHeight: number): void;\n  /**\n   * Renders the current data or resources using the supplied context. See {@link PibblBackendMount}\n   * .\n   * @param root - Node tree to render. See {@link PibblNode}.\n   * @param timestamp - Frame timestamp in milliseconds.\n   */\n  render(root: PibblNode, timestamp: number): void;\n  /**\n   * Requests future work from the owning scheduler. See {@link PibblBackendMount}.\n   * @param updateParents - Whether ancestor compositions also need to be scheduled.\n   */\n  requestFrame(updateParents: boolean): void;\n  /** Releases resources owned by this mounted object. See {@link PibblBackendMount}. */\n  dispose(): void;\n}\n\n/**\n * Version-coupled rendering backend lifecycle used by official integrations.\n *\n * @see {@link PibblBackendToken}\n * @see {@link PibblBackendFrameInput}\n * @see {@link PibblBackendFrame}\n * @see {@link PibblBackendPrimitiveInput}\n * @see {@link PibblNodeInput}\n * @see {@link PibblBackendMountOptions}\n */\nexport interface PibblBackendDriver<E> {\n  /** Identity token distinguishing this backend driver. See {@link PibblBackendToken}. */\n  readonly token: PibblBackendToken;\n  /** Name identifying this backend, emitter, or parameter. See {@link PibblBackendDriver}. */\n  readonly name: string;\n  /**\n   * Begins backend work for one shared scheduler frame. See {@link PibblBackendFrame}.\n   * @param input - Root surface, timestamp, and logical dimensions for this render. See\n   * {@link PibblBackendFrameInput} .\n   * @returns Frame state, or undefined when no frame should be rendered. See\n   * {@link PibblBackendFrame} .\n   */\n  beginFrame(input: PibblBackendFrameInput): PibblBackendFrame<E> | undefined;\n  /**\n   * Enters a component's backend evaluation scope. See {@link PibblBackendDriver}.\n   * @param frame - Frame whose component environment should become active. See\n   * {@link PibblBackendFrame} .\n   * @returns A cleanup function restoring the previous environment.\n   */\n  enterComponent(frame: PibblBackendFrame<E>): () => void;\n  /**\n   * Runs a primitive's drawing program in the current backend frame. See {@link PibblBackendDriver}\n   * .\n   * @param frame - Active backend frame. See {@link PibblBackendFrame}.\n   * @param input - Primitive descriptor and resolved rendering inputs. See\n   * {@link PibblBackendPrimitiveInput} .\n   * @param runProgram - Runtime callback used to invoke the primitive program. See\n   * {@link PibblNodeInput} .\n   */\n  runPrimitive(\n    frame: PibblBackendFrame<E>,\n    input: PibblBackendPrimitiveInput,\n    runProgram: (invoke: () => PibblNodeInput | void) => void,\n  ): void;\n  /**\n   * Completes the backend frame and its pending composition work. See {@link PibblBackendDriver}.\n   * @param frame - Frame returned by beginFrame. See {@link PibblBackendFrame}.\n   * @param success - Whether traversal completed successfully.\n   */\n  finishFrame(frame: PibblBackendFrame<E>, success: boolean): void;\n  /** Releases resources owned by this mounted object. See {@link PibblBackendDriver}. */\n  dispose(): void;\n}\n\n/**\n * Canvas, configuration, and ownership inputs used to create a backend mount.\n *\n * @see {@link Canvas}\n * @see {@link PibblBackendDriver}\n * @see {@link mountBackendPibbl}\n */\nexport interface PibblBackendMountOptions<E> {\n  /** Owning parent runtime instance. See {@link Canvas}. */\n  readonly parent: Canvas;\n  /** Canvas width in logical units. See {@link PibblBackendMountOptions}. */\n  readonly logicalWidth: number;\n  /** Canvas height in logical units. See {@link PibblBackendMountOptions}. */\n  readonly logicalHeight: number;\n  /** Backend driver responsible for this mount. See {@link PibblBackendDriver}. */\n  readonly driver: PibblBackendDriver<E>;\n}\n\n/**\n * Backend target registration options with logical interaction geometry.\n *\n * @see {@link useBackendEventTarget}\n */\nexport interface PibblBackendEventTargetOptions extends PibblEventFocusOptions {\n  /**\n   * Cursor shown while this target owns pointer presentation. See\n   * {@link PibblBackendEventTargetOptions}.\n   */\n  readonly cursor?: string;\n  /** Defers backend-owned focus geometry until its visual generation commits. */\n  readonly deferKeyboardNavigationGeometry?: boolean;\n}\n\n/**\n * Context supplied when resolving nested content through a backend.\n *\n * @see {@link PibblBackendMount}\n * @see {@link PibblHitTestOutput}\n * @see {@link registerNestedInteractionResolver}\n */\nexport interface PibblNestedResolverInput {\n  /** Nested child content to resolve. See {@link PibblBackendMount}. */\n  readonly child: PibblBackendMount;\n  /** Logical region constraining the content or query. See {@link PibblNestedResolverInput}. */\n  readonly bounds: Path2D;\n  /** Whether this content participates in pointer targeting. See {@link PibblNestedResolverInput}. */\n  readonly pointerEvents: 'auto' | 'none';\n  /**\n   * Resolves nested content in the current local coordinate system. See\n   * {@link PibblNestedResolverInput}.\n   * @param localX - Horizontal position in resolver-local coordinates.\n   * @param localY - Vertical position in resolver-local coordinates.\n   * @param output - Mutable hit-test result to populate. See {@link PibblHitTestOutput}.\n   */\n  resolveLocal(localX: number, localY: number, output: PibblHitTestOutput): void;\n}\n\n/** @internal */\nexport function backendMismatchError(\n  componentName: string,\n  required: PibblBackendToken,\n  active: PibblBackendDriver<unknown>,\n  source?: PibblElementSource,\n): Error {\n  const requiredName = getBackendTokenName(required);\n  const prefix = `${componentName} requires the ${requiredName} backend and ` +\n    `cannot render in the ${active.name} root.`;\n  return new Error(withJSXSource(prefix, source));\n}\n\nfunction withJSXSource(message: string, source?: PibblElementSource): string {\n  return source ?\n      `${message} JSX source: ${source.fileName}:${source.lineNumber}:${source.columnNumber}.` :\n    message;\n}\n\nexport type { PibblEventHandlers };\n"],
+  "mappings": "AAmCA,MAAM,eAAe,oBAAI,QAAmC;AAUrD,SAAS,mBAAmB,MAAiC;AAClE,MAAI,CAAC,KAAK,KAAK,GAAG;AAChB,UAAM,IAAI,MAAM,uCAAuC;AAAA,EACzD;AACA,QAAM,QAAQ,OAAO,OAAO,CAAC,CAAC;AAC9B,eAAa,IAAI,OAAO,IAAI;AAC5B,SAAO;AACT;AAGO,SAAS,oBAAoB,OAAkC;AACpE,SAAO,aAAa,IAAI,KAAK,KAAK;AACpC;AAqTO,SAAS,qBACd,eACA,UACA,QACA,QACO;AACP,QAAM,eAAe,oBAAoB,QAAQ;AACjD,QAAM,SAAS,GAAG,aAAa,iBAAiB,YAAY,qCAClC,OAAO,IAAI;AACrC,SAAO,IAAI,MAAM,cAAc,QAAQ,MAAM,CAAC;AAChD;AAEA,SAAS,cAAc,SAAiB,QAAqC;AAC3E,SAAO,SACH,GAAG,OAAO,gBAAgB,OAAO,QAAQ,IAAI,OAAO,UAAU,IAAI,OAAO,YAAY,MACvF;AACJ;",
+  "names": []
+}

package/dist/lib/components/arc-geometry.d.ts

@@ -0,0 +1,4 @@
+import type { LayoutBox } from "../layout/types.js";
+import type { CircularSweep } from "../geometry/circular-sweep.js";
+export declare function arcBounds(cx: number, cy: number, radius: number, sweep: Readonly<CircularSweep>): LayoutBox | undefined;
+export declare function wedgeBounds(cx: number, cy: number, radius: number, sweep: Readonly<CircularSweep>): LayoutBox | undefined;

package/dist/lib/components/arc-geometry.js

@@ -0,0 +1,46 @@
+const fullTurn = Math.PI * 2;
+function arcBounds(cx, cy, radius, sweep) {
+  if (radius <= 0 || sweep.sweep === 0) return void 0;
+  if (sweep.fullCircle) {
+    return {
+      x: cx - radius,
+      y: cy - radius,
+      width: radius * 2,
+      height: radius * 2
+    };
+  }
+  const angles = [sweep.startAngle, sweep.endAngle];
+  for (const cardinal of [0, Math.PI / 2, Math.PI, Math.PI * 1.5]) {
+    if (containsAngle(sweep, cardinal)) angles.push(cardinal);
+  }
+  const xs = angles.map((angle) => cx + radius * Math.cos(angle));
+  const ys = angles.map((angle) => cy + radius * Math.sin(angle));
+  const left = Math.min(...xs);
+  const right = Math.max(...xs);
+  const top = Math.min(...ys);
+  const bottom = Math.max(...ys);
+  return { x: left, y: top, width: right - left, height: bottom - top };
+}
+function wedgeBounds(cx, cy, radius, sweep) {
+  const bounds = arcBounds(cx, cy, radius, sweep);
+  if (!bounds || sweep.fullCircle) return bounds;
+  const left = Math.min(bounds.x, cx);
+  const right = Math.max(bounds.x + bounds.width, cx);
+  const top = Math.min(bounds.y, cy);
+  const bottom = Math.max(bounds.y + bounds.height, cy);
+  return { x: left, y: top, width: right - left, height: bottom - top };
+}
+function containsAngle(sweep, angle) {
+  const distance = sweep.counterclockwise ? positiveModulo(sweep.startAngle - angle, fullTurn) : positiveModulo(angle - sweep.startAngle, fullTurn);
+  return distance <= Math.abs(sweep.sweep);
+}
+function positiveModulo(value, divisor) {
+  const result = value % divisor;
+  if (result === 0) return 0;
+  return result < 0 ? result + divisor : result;
+}
+export {
+  arcBounds,
+  wedgeBounds
+};
+//# sourceMappingURL=arc-geometry.js.map

package/dist/lib/components/arc-geometry.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/lib/components/arc-geometry.ts"],
+  "sourcesContent": ["import type { LayoutBox } from \"../layout/types.js\";\nimport type { CircularSweep } from \"../geometry/circular-sweep.js\";\n\nconst fullTurn = Math.PI * 2;\n\nexport function arcBounds(\n  cx: number,\n  cy: number,\n  radius: number,\n  sweep: Readonly<CircularSweep>,\n): LayoutBox | undefined {\n  if (radius <= 0 || sweep.sweep === 0) return undefined;\n  if (sweep.fullCircle) {\n    return {\n      x: cx - radius,\n      y: cy - radius,\n      width: radius * 2,\n      height: radius * 2,\n    };\n  }\n\n  const angles = [sweep.startAngle, sweep.endAngle];\n  for (const cardinal of [0, Math.PI / 2, Math.PI, Math.PI * 1.5]) {\n    if (containsAngle(sweep, cardinal)) angles.push(cardinal);\n  }\n  const xs = angles.map((angle) => cx + radius * Math.cos(angle));\n  const ys = angles.map((angle) => cy + radius * Math.sin(angle));\n  const left = Math.min(...xs);\n  const right = Math.max(...xs);\n  const top = Math.min(...ys);\n  const bottom = Math.max(...ys);\n  return { x: left, y: top, width: right - left, height: bottom - top };\n}\n\nexport function wedgeBounds(\n  cx: number,\n  cy: number,\n  radius: number,\n  sweep: Readonly<CircularSweep>,\n): LayoutBox | undefined {\n  const bounds = arcBounds(cx, cy, radius, sweep);\n  if (!bounds || sweep.fullCircle) return bounds;\n  const left = Math.min(bounds.x, cx);\n  const right = Math.max(bounds.x + bounds.width, cx);\n  const top = Math.min(bounds.y, cy);\n  const bottom = Math.max(bounds.y + bounds.height, cy);\n  return { x: left, y: top, width: right - left, height: bottom - top };\n}\n\nfunction containsAngle(sweep: Readonly<CircularSweep>, angle: number): boolean {\n  const distance = sweep.counterclockwise\n    ? positiveModulo(sweep.startAngle - angle, fullTurn)\n    : positiveModulo(angle - sweep.startAngle, fullTurn);\n  return distance <= Math.abs(sweep.sweep);\n}\n\nfunction positiveModulo(value: number, divisor: number): number {\n  const result = value % divisor;\n  if (result === 0) return 0;\n  return result < 0 ? result + divisor : result;\n}\n"],
+  "mappings": "AAGA,MAAM,WAAW,KAAK,KAAK;AAEpB,SAAS,UACd,IACA,IACA,QACA,OACuB;AACvB,MAAI,UAAU,KAAK,MAAM,UAAU,EAAG,QAAO;AAC7C,MAAI,MAAM,YAAY;AACpB,WAAO;AAAA,MACL,GAAG,KAAK;AAAA,MACR,GAAG,KAAK;AAAA,MACR,OAAO,SAAS;AAAA,MAChB,QAAQ,SAAS;AAAA,IACnB;AAAA,EACF;AAEA,QAAM,SAAS,CAAC,MAAM,YAAY,MAAM,QAAQ;AAChD,aAAW,YAAY,CAAC,GAAG,KAAK,KAAK,GAAG,KAAK,IAAI,KAAK,KAAK,GAAG,GAAG;AAC/D,QAAI,cAAc,OAAO,QAAQ,EAAG,QAAO,KAAK,QAAQ;AAAA,EAC1D;AACA,QAAM,KAAK,OAAO,IAAI,CAAC,UAAU,KAAK,SAAS,KAAK,IAAI,KAAK,CAAC;AAC9D,QAAM,KAAK,OAAO,IAAI,CAAC,UAAU,KAAK,SAAS,KAAK,IAAI,KAAK,CAAC;AAC9D,QAAM,OAAO,KAAK,IAAI,GAAG,EAAE;AAC3B,QAAM,QAAQ,KAAK,IAAI,GAAG,EAAE;AAC5B,QAAM,MAAM,KAAK,IAAI,GAAG,EAAE;AAC1B,QAAM,SAAS,KAAK,IAAI,GAAG,EAAE;AAC7B,SAAO,EAAE,GAAG,MAAM,GAAG,KAAK,OAAO,QAAQ,MAAM,QAAQ,SAAS,IAAI;AACtE;AAEO,SAAS,YACd,IACA,IACA,QACA,OACuB;AACvB,QAAM,SAAS,UAAU,IAAI,IAAI,QAAQ,KAAK;AAC9C,MAAI,CAAC,UAAU,MAAM,WAAY,QAAO;AACxC,QAAM,OAAO,KAAK,IAAI,OAAO,GAAG,EAAE;AAClC,QAAM,QAAQ,KAAK,IAAI,OAAO,IAAI,OAAO,OAAO,EAAE;AAClD,QAAM,MAAM,KAAK,IAAI,OAAO,GAAG,EAAE;AACjC,QAAM,SAAS,KAAK,IAAI,OAAO,IAAI,OAAO,QAAQ,EAAE;AACpD,SAAO,EAAE,GAAG,MAAM,GAAG,KAAK,OAAO,QAAQ,MAAM,QAAQ,SAAS,IAAI;AACtE;AAEA,SAAS,cAAc,OAAgC,OAAwB;AAC7E,QAAM,WAAW,MAAM,mBACnB,eAAe,MAAM,aAAa,OAAO,QAAQ,IACjD,eAAe,QAAQ,MAAM,YAAY,QAAQ;AACrD,SAAO,YAAY,KAAK,IAAI,MAAM,KAAK;AACzC;AAEA,SAAS,eAAe,OAAe,SAAyB;AAC9D,QAAM,SAAS,QAAQ;AACvB,MAAI,WAAW,EAAG,QAAO;AACzB,SAAO,SAAS,IAAI,SAAS,UAAU;AACzC;",
+  "names": []
+}

package/dist/lib/components/arc.d.ts

@@ -0,0 +1,55 @@
+import type { PibblEventFocusOptions, PibblEventHandlers, PibblEventParticipationOptions } from "../events/types.js";
+import type { BoxStyle, CursorStyle, LayoutItemStyle, Length, PaintStyle } from "../style/types.js";
+import type { SystemStyle } from "../types.js";
+import type { PibblPhysics2DPropExtension } from "../types.js";
+/**
+ * Authored inputs for Arc, including the declared data and presentation options.
+ *
+ * @see {@link PibblEventHandlers}
+ * @see {@link PibblEventParticipationOptions}
+ * @see {@link PibblPhysics2DPropExtension}
+ * @see {@link Arc}
+ */
+export interface ArcProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {
+}
+/**
+ * Supported geometry and presentation properties for Arc.
+ *
+ * @see {@link SystemStyle}
+ * @see {@link PaintStyle}
+ * @see {@link CursorStyle}
+ * @see {@link BoxStyle}
+ * @see {@link LayoutItemStyle}
+ * @see {@link Length}
+ * @see {@link Arc}
+ */
+export interface ArcStyle extends SystemStyle, Omit<PaintStyle, "fill">, CursorStyle, BoxStyle, LayoutItemStyle {
+    /** Radius in the coordinate system of this geometry or effect. See {@link Length}. */
+    radius: Exclude<Length, "auto">;
+    /** Angle at which the arc or slice begins. See {@link ArcStyle}. */
+    startAngle: number;
+    /** Angle at which the arc or slice ends. See {@link ArcStyle}. */
+    endAngle: number;
+    /** Horizontal coordinate of the center. See {@link Length}. */
+    cx?: Exclude<Length, "auto">;
+    /** Vertical coordinate of the center. See {@link Length}. */
+    cy?: Exclude<Length, "auto">;
+    /** Whether the arc follows the counterclockwise direction. See {@link ArcStyle}. */
+    counterclockwise?: boolean;
+    /**
+     * Width used for line hit testing independently of the visible stroke width. See
+     * {@link ArcStyle}.
+     */
+    lineInteractionWidth?: number;
+}
+/**
+ * Describes an open circular arc primitive for JSX or createElement authoring.
+ *
+ * @param props - Authored component inputs, supplied through JSX or createElement. See the linked
+ * props and style types.
+ * @throws When called directly; Pibbl mounts this component through JSX or createElement.
+ *
+ * @see {@link ArcProps}
+ * @see {@link ArcStyle}
+ */
+export declare const Arc: import("@pibbl/core").PibblPrimitiveComponent<ArcProps, import("@pibbl/core").PrimitiveInput<ArcProps, ArcStyle>>;

package/dist/lib/components/arc.js

@@ -0,0 +1,91 @@
+import { definePrimitive } from "../define-primitive.js";
+import {
+  resolveLocalOffset,
+  stripLayoutParticipation
+} from "../style/resolve-built-in.js";
+import { registerOpaqueStyleProperties } from "../style/resolve-dispatch.js";
+import { arcBounds } from "./arc-geometry.js";
+import {
+  createArcPath,
+  resolveCircularSweep
+} from "../geometry/circular-sweep.js";
+import { renderPath } from "./path.js";
+import {
+  circularPercentageBasis,
+  resolveFiniteShapeNumber,
+  resolveNonnegativeShapeLength
+} from "./shape-style.js";
+function renderArc(props, style, ctx) {
+  const {
+    cx,
+    cy,
+    radius,
+    startAngle,
+    endAngle,
+    counterclockwise,
+    stroke,
+    strokeWidth,
+    opacity,
+    cursor,
+    lineInteractionWidth
+  } = style;
+  const sweep = resolveCircularSweep(startAngle, endAngle, counterclockwise);
+  const path = createArcPath({
+    cx,
+    cy,
+    radius,
+    startAngle,
+    endAngle,
+    counterclockwise
+  });
+  return renderPath(
+    {
+      ...props,
+      keyboardNavigationBounds: props.keyboardNavigationBounds ?? arcBounds(cx, cy, radius, sweep)
+    },
+    {
+      d: path,
+      stroke,
+      strokeWidth,
+      opacity,
+      cursor,
+      lineInteractionWidth
+    },
+    ctx
+  );
+}
+const Arc = definePrimitive(renderArc, {
+  resolveStyle: (style, context) => ({
+    ...stripLayoutParticipation(style),
+    cx: resolveLocalOffset(
+      style.cx,
+      context.percentageBasis.width,
+      "cx",
+      context
+    ),
+    cy: resolveLocalOffset(
+      style.cy,
+      context.percentageBasis.height,
+      "cy",
+      context
+    ),
+    radius: resolveNonnegativeShapeLength(
+      style.radius,
+      circularPercentageBasis(context),
+      "radius",
+      context
+    ),
+    startAngle: resolveFiniteShapeNumber(
+      style.startAngle,
+      "startAngle",
+      context
+    ),
+    endAngle: resolveFiniteShapeNumber(style.endAngle, "endAngle", context),
+    counterclockwise: style.counterclockwise ?? false
+  })
+});
+registerOpaqueStyleProperties(Arc, ["stroke", "cursor"]);
+export {
+  Arc
+};
+//# sourceMappingURL=arc.js.map

package/dist/lib/components/arc.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/lib/components/arc.ts"],
+  "sourcesContent": ["import { definePrimitive } from \"../define-primitive.js\";\nimport type {\n  PibblEventFocusOptions,\n  PibblEventHandlers,\n  PibblEventParticipationOptions,\n} from \"../events/types.js\";\nimport {\n  resolveLocalOffset,\n  stripLayoutParticipation,\n} from \"../style/resolve-built-in.js\";\nimport { registerOpaqueStyleProperties } from \"../style/resolve-dispatch.js\";\nimport type {\n  BoxStyle,\n  CursorStyle,\n  LayoutItemStyle,\n  Length,\n  PaintStyle,\n  ResolvedDrawingStyle,\n} from \"../style/types.js\";\nimport type { RenderingContext2D, SystemStyle } from \"../types.js\";\nimport type { PibblPhysics2DPropExtension } from \"../types.js\";\nimport { arcBounds } from \"./arc-geometry.js\";\nimport {\n  createArcPath,\n  resolveCircularSweep,\n} from \"../geometry/circular-sweep.js\";\nimport { renderPath } from \"./path.js\";\nimport {\n  circularPercentageBasis,\n  resolveFiniteShapeNumber,\n  resolveNonnegativeShapeLength,\n} from \"./shape-style.js\";\n\n/**\n * Authored inputs for Arc, including the declared data and presentation options.\n *\n * @see {@link PibblEventHandlers}\n * @see {@link PibblEventParticipationOptions}\n * @see {@link PibblPhysics2DPropExtension}\n * @see {@link Arc}\n */\nexport interface ArcProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {}\n\n/**\n * Supported geometry and presentation properties for Arc.\n *\n * @see {@link SystemStyle}\n * @see {@link PaintStyle}\n * @see {@link CursorStyle}\n * @see {@link BoxStyle}\n * @see {@link LayoutItemStyle}\n * @see {@link Length}\n * @see {@link Arc}\n */\nexport interface ArcStyle\n  extends SystemStyle, Omit<PaintStyle, \"fill\">, CursorStyle, BoxStyle, LayoutItemStyle {\n  /** Radius in the coordinate system of this geometry or effect. See {@link Length}. */\n  radius: Exclude<Length, \"auto\">;\n  /** Angle at which the arc or slice begins. See {@link ArcStyle}. */\n  startAngle: number;\n  /** Angle at which the arc or slice ends. See {@link ArcStyle}. */\n  endAngle: number;\n  /** Horizontal coordinate of the center. See {@link Length}. */\n  cx?: Exclude<Length, \"auto\">;\n  /** Vertical coordinate of the center. See {@link Length}. */\n  cy?: Exclude<Length, \"auto\">;\n  /** Whether the arc follows the counterclockwise direction. See {@link ArcStyle}. */\n  counterclockwise?: boolean;\n  /**\n   * Width used for line hit testing independently of the visible stroke width. See\n   * {@link ArcStyle}.\n   */\n  lineInteractionWidth?: number;\n}\n\ntype ResolvedArcStyle = ResolvedDrawingStyle<ArcStyle> & {\n  radius: number;\n  startAngle: number;\n  endAngle: number;\n  cx: number;\n  cy: number;\n  counterclockwise: boolean;\n};\n\nfunction renderArc(\n  props: ArcProps,\n  style: Readonly<ResolvedArcStyle>,\n  ctx: RenderingContext2D,\n) {\n  const {\n    cx,\n    cy,\n    radius,\n    startAngle,\n    endAngle,\n    counterclockwise,\n    stroke,\n    strokeWidth,\n    opacity,\n    cursor,\n    lineInteractionWidth,\n  } = style;\n  const sweep = resolveCircularSweep(startAngle, endAngle, counterclockwise);\n  const path = createArcPath({\n    cx,\n    cy,\n    radius,\n    startAngle,\n    endAngle,\n    counterclockwise,\n  });\n\n  return renderPath(\n    {\n      ...props,\n      keyboardNavigationBounds:\n        props.keyboardNavigationBounds ?? arcBounds(cx, cy, radius, sweep),\n    },\n    {\n      d: path,\n      stroke,\n      strokeWidth,\n      opacity,\n      cursor,\n      lineInteractionWidth,\n    },\n    ctx,\n  );\n}\n\n/**\n * Describes an open circular arc primitive for JSX or createElement authoring.\n *\n * @param props - Authored component inputs, supplied through JSX or createElement. See the linked\n * props and style types.\n * @throws When called directly; Pibbl mounts this component through JSX or createElement.\n *\n * @see {@link ArcProps}\n * @see {@link ArcStyle}\n */\nexport const Arc = definePrimitive<\n  ArcProps,\n  ArcStyle,\n  ArcStyle,\n  ResolvedArcStyle\n>(renderArc, {\n  resolveStyle: (style, context) =>\n    ({\n      ...stripLayoutParticipation(style),\n      cx: resolveLocalOffset(\n        style.cx,\n        context.percentageBasis.width,\n        \"cx\",\n        context,\n      ),\n      cy: resolveLocalOffset(\n        style.cy,\n        context.percentageBasis.height,\n        \"cy\",\n        context,\n      ),\n      radius: resolveNonnegativeShapeLength(\n        style.radius,\n        circularPercentageBasis(context),\n        \"radius\",\n        context,\n      ),\n      startAngle: resolveFiniteShapeNumber(\n        style.startAngle,\n        \"startAngle\",\n        context,\n      ),\n      endAngle: resolveFiniteShapeNumber(style.endAngle, \"endAngle\", context),\n      counterclockwise: style.counterclockwise ?? false,\n    }) as ResolvedArcStyle,\n});\nregisterOpaqueStyleProperties(Arc, [\"stroke\", \"cursor\"]);\n"],
+  "mappings": "AAAA,SAAS,uBAAuB;AAMhC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,qCAAqC;AAW9C,SAAS,iBAAiB;AAC1B;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,kBAAkB;AAC3B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAqDP,SAAS,UACP,OACA,OACA,KACA;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,QAAQ,qBAAqB,YAAY,UAAU,gBAAgB;AACzE,QAAM,OAAO,cAAc;AAAA,IACzB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL;AAAA,MACE,GAAG;AAAA,MACH,0BACE,MAAM,4BAA4B,UAAU,IAAI,IAAI,QAAQ,KAAK;AAAA,IACrE;AAAA,IACA;AAAA,MACE,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,EACF;AACF;AAYO,MAAM,MAAM,gBAKjB,WAAW;AAAA,EACX,cAAc,CAAC,OAAO,aACnB;AAAA,IACC,GAAG,yBAAyB,KAAK;AAAA,IACjC,IAAI;AAAA,MACF,MAAM;AAAA,MACN,QAAQ,gBAAgB;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AAAA,IACA,IAAI;AAAA,MACF,MAAM;AAAA,MACN,QAAQ,gBAAgB;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AAAA,IACA,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,wBAAwB,OAAO;AAAA,MAC/B;AAAA,MACA;AAAA,IACF;AAAA,IACA,YAAY;AAAA,MACV,MAAM;AAAA,MACN;AAAA,MACA;AAAA,IACF;AAAA,IACA,UAAU,yBAAyB,MAAM,UAAU,YAAY,OAAO;AAAA,IACtE,kBAAkB,MAAM,oBAAoB;AAAA,EAC9C;AACJ,CAAC;AACD,8BAA8B,KAAK,CAAC,UAAU,QAAQ,CAAC;",
+  "names": []
+}

package/dist/lib/components/circle.d.ts

@@ -0,0 +1,49 @@
+import type { PibblEventFocusOptions, PibblEventHandlers, PibblEventParticipationOptions } from '../events/types.js';
+import type { SystemStyle } from '../types.js';
+import type { PibblPhysics2DPropExtension } from '../types.js';
+import type { BoxStyle, CursorStyle, LayoutItemStyle, Length, PaintStyle } from '../style/types.js';
+/**
+ * Authored inputs for Circle, including the declared data and presentation options.
+ *
+ * @see {@link PibblEventHandlers}
+ * @see {@link PibblEventParticipationOptions}
+ * @see {@link PibblPhysics2DPropExtension}
+ * @see {@link Circle}
+ */
+export interface CircleProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {
+}
+/**
+ * Supported geometry and presentation properties for Circle.
+ *
+ * @see {@link SystemStyle}
+ * @see {@link PaintStyle}
+ * @see {@link CursorStyle}
+ * @see {@link BoxStyle}
+ * @see {@link LayoutItemStyle}
+ * @see {@link Length}
+ * @see {@link Circle}
+ */
+export interface CircleStyle extends SystemStyle, PaintStyle, CursorStyle, BoxStyle, LayoutItemStyle {
+    /** Radius in the coordinate system of this geometry or effect. See {@link Length}. */
+    radius: Exclude<Length, 'auto'>;
+    /** Horizontal coordinate of the center. See {@link Length}. */
+    cx?: Exclude<Length, 'auto'>;
+    /** Vertical coordinate of the center. See {@link Length}. */
+    cy?: Exclude<Length, 'auto'>;
+    /**
+     * Width used for line hit testing independently of the visible stroke width. See
+     * {@link CircleStyle}.
+     */
+    lineInteractionWidth?: number;
+}
+/**
+ * Describes a circle primitive for JSX or createElement authoring.
+ *
+ * @param props - Authored component inputs, supplied through JSX or createElement. See the linked
+ * props and style types.
+ * @throws When called directly; Pibbl mounts this component through JSX or createElement.
+ *
+ * @see {@link CircleProps}
+ * @see {@link CircleStyle}
+ */
+export declare const Circle: import("@pibbl/core").PibblPrimitiveComponent<CircleProps, import("@pibbl/core").PrimitiveInput<CircleProps, CircleStyle>>;