@simten/embed 0.1.1

package/LICENSE

@@ -0,0 +1,176 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for describing the origin of the Work and
+      reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Support. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or support.
+
+   END OF TERMS AND CONDITIONS

package/README.md

@@ -0,0 +1,167 @@
+# @simten/embed
+
+Embeddable interactive hardware circuits. Drop live, cycle-accurate simulations into any React app.
+
+## Install
+
+```bash
+npm install @simten/embed @simten/core
+```
+
+## Usage
+
+### CircuitEmbed — read-only interactive viewer
+
+```tsx
+import '@simten/embed/styles.css'
+import { CircuitEmbed } from '@simten/embed'
+import { circuit, bit } from '@simten/core/circuit'
+import { Xor, And } from '@simten/core/std'
+
+const HalfAdder = circuit('HalfAdder', {
+  inputs:  { a: bit, b: bit },
+  outputs: { sum: bit, carry: bit },
+  nodes: { xor1: Xor, and1: And },
+  connect: ({ inputs, outputs, nodes: { xor1, and1 } }) => [
+    inputs.a.to(xor1.a, and1.a),
+    inputs.b.to(xor1.b, and1.b),
+    xor1.out.to(outputs.sum),
+    and1.out.to(outputs.carry),
+  ],
+})
+
+function App() {
+  return <CircuitEmbed circuit={HalfAdder} height={300} />
+}
+```
+
+The circuit compiles, simulates, and renders in the browser. Users can toggle switches, see values propagate, and interact with the simulation.
+
+### useCircuitSimulator — custom layouts
+
+```tsx
+import { useCircuitSimulator } from '@simten/embed'
+import { circuit, bit } from '@simten/core/circuit'
+import { Xor, And } from '@simten/core/std'
+
+const HalfAdder = circuit('HalfAdder', {
+  inputs: { a: bit, b: bit },
+  outputs: { sum: bit, carry: bit },
+  nodes: { xor1: Xor, and1: And },
+  connect: ({ inputs, outputs, nodes: { xor1, and1 } }) => [
+    inputs.a.to(xor1.a, and1.a),
+    inputs.b.to(xor1.b, and1.b),
+    xor1.out.to(outputs.sum),
+    and1.out.to(outputs.carry),
+  ],
+})
+
+function MyComponent() {
+  const sim = useCircuitSimulator(HalfAdder)
+
+  // sim.ready, sim.error, sim.circuit
+  // sim.inputs, sim.outputs, sim.portValues
+  // sim.setNode(), sim.toggleNode(), sim.tick(), sim.reset()
+}
+```
+
+Build your own UI around the simulator. Each hook instance has its own isolated component library — multiple embeds on the same page won't interfere.
+
+## Props
+
+### CircuitEmbed
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `circuit` | `BuiltCircuit` | required | Circuit definition (result of `circuit()`) |
+| `height` | `number \| string` | `300` | Component height |
+| `showControls` | `boolean` | `true` | Show tick/auto/reset for sequential circuits |
+| `title` | `string` | — | Header title |
+| `description` | `string` | — | Header subtitle |
+| `focus` | `string \| string[]` | — | Highlight specific nodes, dim others |
+| `layout` | `CircuitLayout<C>` | — | Pre-computed positions, keyed by node label or id. Bypasses the runtime layout engine. Keys are constrained at compile time to the circuit's input/output/node names. |
+| `initialInputs` | `Record<string, number \| boolean>` | — | Set initial input values |
+| `autoRunSpeed` | `number` | `500` | Auto-run interval in ms |
+| `showPortLabels` | `boolean` | — | Show port labels on nodes |
+| `glowUnconnected` | `boolean` | — | Highlight unconnected ports |
+| `theme` | `"light" \| "dark"` | — | Force a color theme |
+
+## How it works
+
+1. The `BuiltCircuit` is elaborated (composites flattened to primitives)
+2. A simulator engine evaluates the netlist
+3. ReactFlow renders the circuit as interactive nodes and edges
+4. The layout engine computes positions when no `layout` prop is provided (lazy-loaded, SSR-safe)
+
+Each `useCircuitSimulator` call creates its own component library instance. Sub-circuits are registered into that instance during elaboration. No global state is shared between embeds.
+
+## Type-safe layouts
+
+`CircuitLayout<C>` constrains keys to the circuit's actual port/node names at compile time:
+
+```tsx
+import { circuit, bit } from '@simten/core/circuit'
+import { CircuitEmbed, type CircuitLayout } from '@simten/embed'
+
+const HalfAdder = circuit('HalfAdder', {
+  inputs:  { a: bit, b: bit },
+  outputs: { sum: bit, carry: bit },
+  nodes:   { xor1: Xor, and1: And },
+  connect: /* ... */
+})
+
+// TS infers the valid keys: a | b | sum | carry | xor1 | and1
+const halfAdderLayout: CircuitLayout<typeof HalfAdder> = {
+  a:    { x: 0,   y: 0   },
+  b:    { x: 0,   y: 80  },
+  xor1: { x: 200, y: 0   },
+  and1: { x: 200, y: 100 },
+  // typo: { x: 1, y: 1 }  // TS error: not a valid key
+}
+
+<CircuitEmbed circuit={HalfAdder} layout={halfAdderLayout} />
+```
+
+In dev mode, a runtime warning also fires if `layout` keys don't match the circuit's nodes — useful for circuits compiled at runtime via the web component path where TS can't help.
+
+## CSS
+
+The package ships compiled CSS at `dist/styles.css`. All classes are prefixed with `ti-` to avoid collisions with host app styles.
+
+```tsx
+import '@simten/embed/styles.css'
+```
+
+No Tailwind configuration required in the consuming app.
+
+## Server-side rendering (SSR)
+
+All embed components include `"use client"` directives and are compatible with React server component frameworks.
+
+### Next.js App Router
+
+Components work directly — the `"use client"` boundary is automatic.
+
+### Next.js Pages Router
+
+```tsx
+import dynamic from 'next/dynamic'
+
+const CircuitEmbed = dynamic(
+  () => import('@simten/embed').then(m => m.CircuitEmbed),
+  { ssr: false }
+)
+```
+
+### What happens during SSR
+
+Components are skipped on the server and render only on the client. The layout engine uses `dynamic import()` so it is never loaded on the server. If you pass a `layout` prop, the engine isn't loaded at all — positions are applied directly.
+
+## Requirements
+
+- React 18 or 19
+- A bundler that supports ESM (Vite, Next.js, etc.)
+
+## License
+
+Business Source License 1.1

package/dist/CircuitEmbed.d.ts

@@ -0,0 +1,92 @@
+/**
+ * CircuitEmbed — embeddable circuit viewer with optional info bar.
+ *
+ * Thin wrapper around CircuitViewer that adds:
+ *   - Auto-harness (wraps bare circuits with Switch/Led nodes)
+ *   - Info bar (title, subtitle, description, link)
+ *
+ * For React users: pass a BuiltCircuit object.
+ * For web component users: <circuit-embed code="..."> goes through the
+ * web component bridge which sandboxes compilation via an iframe.
+ */
+import { type ForwardedRef, type ReactElement } from "react";
+import { type CircuitViewerHandle, type HarnessedLayout } from "./CircuitViewer";
+import { type BuiltCircuit } from "@simten/core/circuit";
+import type { FlatPortValueMap } from "@simten/core/simulator";
+export interface CircuitEmbedProps<C extends BuiltCircuit = BuiltCircuit> {
+    /** The circuit to display (result of circuit()) */
+    circuit: C;
+    /**
+     * Container height. Optional — when omitted, the embed sizes itself
+     * width-responsively using `aspectRatio` (or one inferred from `layout`)
+     * with sensible mobile-friendly min/max clamps.
+     */
+    height?: number | string;
+    /**
+     * Width-to-height ratio of the embed. Used only when `height` is not set.
+     * If omitted and `layout` is passed, the ratio is computed from the
+     * layout's bounding box. Otherwise defaults to 1.5 (3:2).
+     */
+    aspectRatio?: number;
+    /** Show clock controls for sequential circuits */
+    showControls?: boolean;
+    /**
+     * Pre-computed node positions. Keys are constrained to the circuit's
+     * input names, output names, and node labels at compile time.
+     * Pass to bypass the runtime layout engine.
+     */
+    layout?: HarnessedLayout<C>;
+    /** Theme */
+    theme?: "light" | "dark";
+    /** Title shown in bottom bar */
+    title?: string;
+    /** Subtitle shown next to title */
+    subtitle?: string;
+    /** Description shown below title */
+    description?: string;
+    /**
+     * Custom URL for the card's right-side link. When omitted (the common case),
+     * a Fork button is rendered that opens the circuit in the simten.dev editor
+     * via `/circuit/<lz-encoded-source>`. Pass `href` only to override.
+     */
+    href?: string;
+    /**
+     * Optional raw TypeScript source for the Fork button. When provided, the
+     * Fork button encodes this verbatim instead of running the BuiltCircuit
+     * through the IR-to-source serializer (which drops comments and helpers).
+     * The web-component path passes the user's original `code` here.
+     */
+    forkSource?: string;
+    /** Focus on specific node(s) */
+    focus?: string | string[];
+    /** Show port labels on nodes */
+    showPortLabels?: boolean;
+    /** Callback when a port is clicked */
+    onPortClick?: (nodeLabel: string, portName: string, portType: "input" | "output") => void;
+    /** Highlight unconnected ports */
+    glowUnconnected?: boolean;
+    /** Auto-run speed (ms between ticks) */
+    autoRunSpeed?: number;
+    /** Initial values for input ports (set on harness Switch/Input nodes) */
+    initialInputs?: Record<string, number | boolean>;
+    /**
+     * Called when the embed's internal simulator settles on a new set of
+     * port values — once on first settle, then on every subsequent settled
+     * change (e.g. when the user toggles a switch on the canvas). Forwarded
+     * verbatim to CircuitViewer; see its docs for full firing semantics.
+     *
+     * Use this to drive sibling UI (truth-table highlights, external value
+     * readouts) without giving up the embed's chrome. The callback is
+     * ref-stabilized inside the embed, so inline functions are safe.
+     */
+    onPortValuesChange?: (portValues: FlatPortValueMap) => void;
+}
+export type CircuitEmbedHandle = CircuitViewerHandle;
+/**
+ * CircuitEmbed component with generic inference over the circuit type.
+ * Cast preserves the generic so `layout` keys are constrained at compile time.
+ */
+export declare const CircuitEmbed: <C extends BuiltCircuit>(props: CircuitEmbedProps<C> & {
+    ref?: ForwardedRef<CircuitEmbedHandle>;
+}) => ReactElement;
+//# sourceMappingURL=CircuitEmbed.d.ts.map

package/dist/CircuitEmbed.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CircuitEmbed.d.ts","sourceRoot":"","sources":["../src/CircuitEmbed.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAA4C,KAAK,YAAY,EAAE,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AACvG,OAAO,EAAiB,KAAK,mBAAmB,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAChG,OAAO,EAAmB,KAAK,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAC1E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAgB/D,MAAM,WAAW,iBAAiB,CAAC,CAAC,SAAS,YAAY,GAAG,YAAY;IACtE,mDAAmD;IACnD,OAAO,EAAE,CAAC,CAAC;IACX;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kDAAkD;IAClD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;OAIG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC;IAC5B,YAAY;IACZ,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACzB,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mCAAmC;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oCAAoC;IACpC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC1B,gCAAgC;IAChC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,sCAAsC;IACtC,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,QAAQ,KAAK,IAAI,CAAC;IAC1F,kCAAkC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,wCAAwC;IACxC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,yEAAyE;IACzE,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC;IACjD;;;;;;;;;OASG;IACH,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAC7D;AAED,MAAM,MAAM,kBAAkB,GAAG,mBAAmB,CAAC;AAkJrD;;;GAGG;AACH,eAAO,MAAM,YAAY,EAAuB,CAAC,CAAC,SAAS,YAAY,EACrE,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,YAAY,CAAC,kBAAkB,CAAC,CAAA;CAAE,KACrE,YAAY,CAAC"}

package/dist/CircuitEmbed.js

@@ -0,0 +1,104 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * CircuitEmbed — embeddable circuit viewer with optional info bar.
+ *
+ * Thin wrapper around CircuitViewer that adds:
+ *   - Auto-harness (wraps bare circuits with Switch/Led nodes)
+ *   - Info bar (title, subtitle, description, link)
+ *
+ * For React users: pass a BuiltCircuit object.
+ * For web component users: <circuit-embed code="..."> goes through the
+ * web component bridge which sandboxes compilation via an iframe.
+ */
+import { forwardRef, useState } from "react";
+import { CircuitViewer } from "./CircuitViewer";
+import { circuitToSource } from "@simten/core/circuit";
+import { encodeSourceForUrl } from "@simten/ui/share";
+import { useShareCircuit } from "./share-context";
+/**
+ * Where Fork links open. simten.dev for everything except local dev of the
+ * embed itself (where the embed is mounted at localhost). Detected at runtime
+ * because the embed runs on third-party origins we don't control at build time.
+ */
+function simtenHost() {
+    if (typeof window === "undefined")
+        return "https://simten.dev";
+    return window.location.hostname === "localhost"
+        ? window.location.origin
+        : "https://simten.dev";
+}
+// Approximate node footprint used when inferring aspect ratio from a layout.
+// Layout coords are top-left of each node, so we add ~one node's width/height
+// to the bounding box so the rightmost / bottommost nodes aren't clipped.
+const NODE_W = 160;
+const NODE_H = 90;
+function inferAspectFromLayout(layout) {
+    if (!layout)
+        return 1.5; // default 3:2 — sane for auto-laid-out circuits
+    const positions = Object.values(layout);
+    if (positions.length === 0)
+        return 1.5;
+    const w = Math.max(...positions.map(p => p.x)) + NODE_W;
+    const h = Math.max(...positions.map(p => p.y)) + NODE_H;
+    if (w <= 0 || h <= 0)
+        return 1.5;
+    return w / h;
+}
+const CircuitEmbedImpl = forwardRef(function CircuitEmbed({ circuit, height, aspectRatio, showControls = true, layout, theme, title, subtitle, description, href, focus, showPortLabels, onPortClick, glowUnconnected, autoRunSpeed = 500, initialInputs, forkSource, onPortValuesChange, }, ref) {
+    const hasInfoBar = title || description;
+    const [forkError, setForkError] = useState(null);
+    const [forkPending, setForkPending] = useState(false);
+    const shareCircuit = useShareCircuit();
+    const onFork = async () => {
+        if (forkPending)
+            return;
+        try {
+            const source = forkSource ?? circuitToSource(circuit);
+            // Use the KV shortener when available (simten.dev). Outside simten.dev
+            // — embeds on third-party pages — fall back to the inline-encoded URL.
+            if (shareCircuit) {
+                setForkPending(true);
+                const { hash } = await shareCircuit(source);
+                window.open(`${simtenHost()}/circuit/s/${hash}`, "_blank", "noopener");
+            }
+            else {
+                const encoded = encodeSourceForUrl(source);
+                window.open(`${simtenHost()}/circuit/${encoded}`, "_blank", "noopener");
+            }
+        }
+        catch (err) {
+            setForkError(err instanceof Error ? err.message : "Couldn't fork this circuit");
+            setTimeout(() => setForkError(null), 3000);
+        }
+        finally {
+            setForkPending(false);
+        }
+    };
+    // Sizing strategy: if `height` is set, use it (backwards compat).
+    // Otherwise size width-responsively via aspect-ratio with mobile clamps.
+    const useResponsive = height === undefined;
+    const aspect = aspectRatio ?? inferAspectFromLayout(layout);
+    const responsiveStyle = {
+        width: '100%',
+        aspectRatio: String(aspect),
+        minHeight: 240,
+        maxHeight: '70vh',
+    };
+    const outerStyle = hasInfoBar
+        ? undefined
+        : useResponsive
+            ? responsiveStyle
+            : { height };
+    const canvasStyle = hasInfoBar
+        ? useResponsive
+            ? responsiveStyle
+            : { height }
+        : { height: '100%' };
+    return (_jsxs("div", { style: outerStyle, className: `relative flex flex-col ${hasInfoBar ? 'rounded-xl border border-[var(--embed-border)] overflow-hidden bg-[var(--embed-bg-secondary)]' : ''}`, children: [!hasInfoBar && !href && (_jsx("button", { type: "button", onClick: onFork, title: forkError ?? "Open and modify this circuit in the Simten editor", className: "absolute top-2 right-2 z-10 hidden md:flex items-center px-2.5 py-1 rounded border border-[var(--embed-border)] bg-[var(--embed-bg-secondary)] text-[11px] text-[var(--embed-text-primary)] hover:opacity-80 transition-colors shadow-sm", children: forkError ? "Fork failed" : "Fork →" })), _jsx("div", { style: canvasStyle, className: "min-h-0", children: _jsx(CircuitViewer, { ref: ref, circuit: circuit, height: "100%", showControls: showControls, autoHarness: true, initialInputs: initialInputs, layout: layout, theme: theme, focus: focus, showPortLabels: showPortLabels, onPortClick: onPortClick, glowUnconnected: glowUnconnected, autoRunSpeed: autoRunSpeed, onPortValuesChange: onPortValuesChange }) }), hasInfoBar && (_jsxs("div", { className: "border-t border-[var(--embed-border)] px-4 py-3 flex items-end justify-between gap-4", children: [_jsxs("div", { children: [_jsx("div", { className: "text-base font-semibold text-[var(--embed-text-primary)]", children: title }), subtitle && _jsx("div", { className: "text-xs text-[var(--embed-text-muted)] font-mono mt-0.5", children: subtitle }), description && _jsx("div", { className: "text-sm text-[var(--embed-text-secondary)] mt-1.5 leading-relaxed", children: description })] }), href ? (_jsx("a", { href: href, className: "shrink-0 px-3 py-1.5 rounded border border-[var(--embed-border)] text-xs text-[var(--embed-text-primary)] hover:opacity-80 transition-colors", children: "Open \u2192" })) : (_jsx("button", { type: "button", onClick: onFork, title: forkError ?? "Open and modify this circuit in the Simten editor", className: "hidden md:flex items-center shrink-0 px-3 py-1.5 rounded border border-[var(--embed-border)] text-xs text-[var(--embed-text-primary)] hover:opacity-80 transition-colors", children: forkError ? `Can't fork: ${forkError.slice(0, 40)}` : "Fork →" }))] }))] }));
+});
+/**
+ * CircuitEmbed component with generic inference over the circuit type.
+ * Cast preserves the generic so `layout` keys are constrained at compile time.
+ */
+export const CircuitEmbed = CircuitEmbedImpl;
+//# sourceMappingURL=CircuitEmbed.js.map

package/dist/CircuitEmbed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CircuitEmbed.js","sourceRoot":"","sources":["../src/CircuitEmbed.tsx"],"names":[],"mappings":"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"}

package/dist/CircuitViewer.d.ts

@@ -0,0 +1,100 @@
+/**
+ * CircuitViewer — the single "render an interactive circuit" component.
+ *
+ * Takes a BuiltCircuit, wires up simulation, and renders CircuitCanvas + ClockControls.
+ * Pure props — no stores. Everything else (CircuitEmbed, EditorWorkspace, <circuit-embed>)
+ * is a thin wrapper around this.
+ */
+import { type ForwardedRef, type ReactElement } from "react";
+import type { BuiltCircuit } from "@simten/core/circuit";
+import type { CircuitLayout } from "@simten/ui/canvas";
+import type { FlatPortValueMap } from "@simten/core/simulator";
+/**
+ * Type-level model of what `autoHarness` produces at runtime: it wraps the
+ * original circuit `C` as a single `dut` node and adds one Switch per input
+ * and one Led per output. The placeable nodes therefore become the input
+ * names ∪ output names ∪ `'dut'`. CircuitLayout<HarnessedCircuit<C>>
+ * resolves to exactly that key set.
+ */
+export type HarnessedCircuit<C extends BuiltCircuit> = C extends BuiltCircuit<infer Ins, infer Outs, any> ? BuiltCircuit<Ins, Outs, {
+    [K in keyof Ins]: BuiltCircuit;
+} & {
+    [K in keyof Outs]: BuiltCircuit;
+} & {
+    dut: C;
+}> : never;
+/** Strictly-keyed layout for an autoHarness-wrapped circuit. */
+export type HarnessedLayout<C extends BuiltCircuit> = CircuitLayout<HarnessedCircuit<C>>;
+export interface CircuitViewerProps<C extends BuiltCircuit = BuiltCircuit> {
+    /** The circuit to display (result of circuit()) */
+    circuit: C;
+    /** Container height */
+    height?: number | string;
+    /** Show clock controls for sequential circuits */
+    showControls?: boolean;
+    /** Auto-wrap with Switch/Led nodes for bare circuits */
+    autoHarness?: boolean;
+    /** Initial values for auto-harnessed input nodes */
+    initialInputs?: Record<string, number | boolean>;
+    /**
+     * Pre-computed node positions. Keys are constrained at compile time.
+     * Accepts either the raw circuit's layout shape (when autoHarness is
+     * off) or the harnessed layout shape (when autoHarness is on, with
+     * keys = input names ∪ output names ∪ 'dut').
+     */
+    layout?: CircuitLayout<C> | HarnessedLayout<C>;
+    /** Theme */
+    theme?: "light" | "dark";
+    /** Focus on specific node(s) */
+    focus?: string | string[];
+    /** Show port labels on nodes */
+    showPortLabels?: boolean;
+    /** Callback when a port is clicked */
+    onPortClick?: (nodeLabel: string, portName: string, portType: "input" | "output") => void;
+    /** Highlight unconnected ports */
+    glowUnconnected?: boolean;
+    /** Auto-run speed (ms between ticks) */
+    autoRunSpeed?: number;
+    /** Render custom content when no circuit is compiled */
+    renderEmptyState?: () => React.ReactNode;
+    /** Render custom overlay on top of the canvas */
+    renderOverlay?: () => React.ReactNode;
+    /**
+     * Called when the simulator's port values settle. Fires once on first
+     * settled state (after the circuit compiles and propagates) and on every
+     * subsequent settled change (e.g. when the user toggles a switch). Use
+     * this to drive sibling UI that needs to react to live simulator state
+     * — a truth-table highlight, an external value readout, etc.
+     *
+     * Firing semantics:
+     *   - Does NOT fire before `ready` or while `portValues` is empty.
+     *   - Fires only on settled (post-propagation) states; the simulator
+     *     never exposes intermediate propagation states.
+     *   - The map reference is NOT guaranteed stable across no-op ticks
+     *     (sequential auto-run loops can produce new Map instances with
+     *     unchanged contents). Memoize derived state if perf matters.
+     *
+     * The callback is captured in a ref internally so inline functions
+     * (e.g. `onPortValuesChange={(pv) => setX(pv)}`) don't cause spurious
+     * re-fires — pass whatever shape is convenient for the caller.
+     */
+    onPortValuesChange?: (portValues: FlatPortValueMap) => void;
+}
+export interface CircuitViewerHandle {
+    tick: () => void;
+    reset: () => void;
+    setNodeValue: (nodeId: string, value: number | boolean | Map<number, number>) => void;
+    /** Start the simulator's internal auto-run loop. Equivalent to clicking the
+     *  in-canvas play button — the play/pause control will stop it normally. */
+    startAutoRun: (ticksPerSecond: number) => void;
+    /** Stop the simulator's internal auto-run loop. */
+    stopAutoRun: () => void;
+}
+/**
+ * CircuitViewer with generic inference over the circuit type.
+ * Cast preserves the generic so `layout` keys are constrained at compile time.
+ */
+export declare const CircuitViewer: <C extends BuiltCircuit>(props: CircuitViewerProps<C> & {
+    ref?: ForwardedRef<CircuitViewerHandle>;
+}) => ReactElement;
+//# sourceMappingURL=CircuitViewer.d.ts.map

package/dist/CircuitViewer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CircuitViewer.d.ts","sourceRoot":"","sources":["../src/CircuitViewer.tsx"],"names":[],"mappings":"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"}