api_binding_ui 1.1.0 → 2.0.0

package/spec/FRAMEWORK.md

@@ -0,0 +1,271 @@
+# API Binding Framework — v1 (draft)
+
+Status: draft for review. Normative types: [`contract.ts`](./contract.ts).
+
+This framework connects **UI components** to **documented API operations** during the design phase, and produces a reviewed, versioned **binding manifest** for every screen. Any product can adopt it. It contains no knowledge of any component kind, product, operation or field: all of that arrives as data or through registration.
+
+---
+
+## 1. Principles
+
+1. **Nothing concrete in the framework.** No component kinds, product names, operation ids, field names or vocabularies are written into framework code. If something has to be known, it is declared as data (descriptor, registry entry, catalog, glossary) or registered as an extension.
+2. **The API docs are the only source of operations.** The catalog is generated from the published OpenAPI documents. Nothing is supplied by the app instead: no local hooks, hardcoded option lists or free-text overrides.
+3. **UI first.** The unit of work is a screen and its components. APIs are attached to component slots, not the other way round.
+4. **Components describe themselves.** Every bindable component ships a descriptor stating its slots. A component built next year works with the same studio, the same manifest and the same runtime, unchanged.
+5. **Types flow through bindings.** The shape of a selection, a row or a dialog's context is derived from what the source slot is bound to, never typed in by hand.
+6. **Design-time and runtime are separate.** The studio never ships to production. The runtime reads manifests only.
+7. **Every contract is versioned.** Descriptors, registry, catalog and manifest each carry a version, and changes are detected, not discovered in production.
+
+---
+
+## 2. The pieces and who owns them
+
+| Piece | What it is | Owned by | Format |
+|---|---|---|---|
+| Component descriptor | A kind's slots, with JSON Schema shapes | Component library (design system) | `ComponentDescriptor` |
+| Screen registry | Every screen in the app, with its component instances | Each product | `ScreenRegistry` (JSON) |
+| Catalog | Normalized operations from the API docs | Generated from OpenAPI with `catalogFromOpenApi` | `Catalog` (JSON) |
+| Binding manifest | Which operation or expression feeds each slot | Designers in the studio, reviewed by engineers | `BindingManifest` (JSON, one per screen) |
+| Extensions | Transforms, context providers, matchers, glossaries, persistence | Framework defaults + products | `FrameworkRegistry` |
+| Studio | Design-time editor that reads all of the above | This package | UI, design mode only |
+| Runtime | Executes manifests in the app | This package | Small library, production |
+
+```
+OpenAPI docs ──► Catalog ─┐
+Descriptors ──────────────┼──► Studio ──► Manifests (repo) ──► Runtime (production)
+Screen registry ──────────┘
+```
+
+---
+
+## 3. Component descriptors
+
+A descriptor is published once per component kind, next to the component, by whoever builds the component. The framework only understands three slot **roles**:
+
+| Role | Meaning | Bound to |
+|---|---|---|
+| `consume` | The component needs data | An operation (via request + response selection) or an expression |
+| `produce` | The component exposes data | Nothing; it is a **source** others can read |
+| `trigger` | The component emits an event | An ordered list of steps |
+
+Each slot carries a JSON Schema (`schema`) and an optional `many`. That is all the studio needs to render an editor, propose matches and validate.
+
+**Scoped slots.** A consume slot can be evaluated per item of a parent slot (`scope.parentSlot`). Inside it, `$item` is the parent's current item. This covers cells in rows, items in a list, cards in a lane, without the framework knowing what a row, list or lane is.
+
+**Feeding requests.** A consume slot can name produce slots of the same component in `feeds` (for example, paging or sorting state). The studio offers them as sources when mapping that slot's request.
+
+### Illustrations (not part of the framework)
+
+These show three unrelated kinds expressed with the same vocabulary. Names are examples.
+
+```jsonc
+// A data grid
+{ "kind": "example-ds/grid", "version": 1, "label": "Grid",
+  "children": { "scopedTo": "rows" },
+  "slots": [
+    { "id": "rows",      "role": "consume", "many": true, "required": true, "label": "Rows",
+      "schema": { "type": "object" }, "feeds": ["page", "sort", "filter"] },
+    { "id": "total",     "role": "consume", "label": "Total", "schema": { "type": "integer" } },
+    { "id": "page",      "role": "produce", "label": "Page", "schema": { "type": "object", "properties": { "offset": { "type": "integer" }, "limit": { "type": "integer" } } } },
+    { "id": "sort",      "role": "produce", "label": "Sort", "schema": { "type": "object", "properties": { "field": { "type": "string" }, "direction": { "enum": ["asc", "desc"] } } } },
+    { "id": "filter",    "role": "produce", "label": "Filter", "schema": { "type": "object" } },
+    { "id": "selection", "role": "produce", "many": true, "label": "Selected rows", "schema": { "$ref": "#slot/rows" } },
+    { "id": "rowClick",  "role": "trigger", "label": "Row clicked", "schema": { "$ref": "#slot/rows" } }
+  ] }
+
+// A single-choice input
+{ "kind": "example-ds/select", "version": 1, "label": "Dropdown",
+  "slots": [
+    { "id": "options", "role": "consume", "many": true, "label": "Options",
+      "schema": { "type": "object", "required": ["value", "label"], "properties": { "value": {}, "label": { "type": "string" } } } },
+    { "id": "selected", "role": "produce", "label": "Selected option", "schema": { "$ref": "#slot/options" } },
+    { "id": "change",   "role": "trigger", "label": "Changed", "schema": { "$ref": "#slot/options" } }
+  ] }
+
+// A dropdown publishes the whole chosen option, not only its display value: every field the options API
+// returns (an id, a code, a name) is then available as a separate, correctly typed value.
+
+// A component that does not exist yet
+{ "kind": "example-ds/timeline", "version": 1, "label": "Timeline",
+  "slots": [
+    { "id": "events", "role": "consume", "many": true, "label": "Events",
+      "schema": { "type": "object", "required": ["at", "title"], "properties": { "at": { "type": "string", "format": "date-time" }, "title": { "type": "string" }, "detail": { "type": "string" } } } },
+    { "id": "eventClick", "role": "trigger", "label": "Event clicked", "schema": { "$ref": "#slot/events" } }
+  ] }
+```
+
+`"$ref": "#slot/<id>"` means "the same shape as that slot after binding". This is how a grid's selection gets the row shape of whatever operation feeds its rows, and how a dropdown's selected option gets the fields of the operation that feeds its options. Until that slot is bound, the shape is unknown and the studio offers nothing from it; it shows which slot to connect first.
+
+---
+
+## 4. Screen registry
+
+The registry lists the screens that exist in the app, and only those. It is the studio's inventory, so thousands of screens can be bound without opening the app.
+
+- Each screen ships its registry entry next to its code (a JSON file or an exported constant). The app's build collects the entries into one registry file.
+- A screen that is not in the app has no entry. Nothing is listed ahead of time.
+- Every component in an entry must have a registered descriptor. An unknown kind fails validation at build time, so the studio never shows a component it cannot bind.
+- `context` declares what a screen receives from outside. Its shape is either a schema or a reference to another screen's produce slot (`shape.from`), so a dialog opened from a grid toolbar automatically knows the selected rows' fields.
+- `parent` groups a dialog or drawer under the screen it appears over, for studio navigation only. How it opens and closes is the app's own UI code.
+
+---
+
+## 5. Catalog
+
+`api-binding catalog pull <url-or-file>` normalizes one or more OpenAPI 3.x documents into a `Catalog`:
+
+- Every operation, with parameters as request pointers (`/path/…`, `/query/…`, `/header/…`, `/body/…`), body schema and response schemas.
+- `intent` comes from HTTP semantics (safe methods are reads) unless the docs declare it with an extension. It is never inferred from names.
+- All `x-*` extensions are kept verbatim, so new docs metadata reaches matchers without a framework change.
+- A content hash pins the catalog. Manifests record the hash they were made with.
+
+List locations in responses are discovered from schemas (any array of objects is a candidate selector). Envelope shapes are never assumed.
+
+---
+
+## 6. Binding manifest
+
+One JSON file per screen in the product repository (for example `bindings/<screen-id>.binding.json`). It references only: bindIds and slot ids from the registry and descriptors, operation ids from the catalog, and expressions.
+
+| Slot role | Binding type | Contents |
+|---|---|---|
+| consume | `operation` | operation, request mapping (pointer → expression), response `select`, optional `map` to the slot's properties, load policy |
+| consume | `expression` | a single expression (scoped item field, another component's produce slot, context) |
+| trigger | `steps` | ordered API `call` steps; a call may run `forEach` over a list |
+| trigger | `none` | reviewed: this event calls no API |
+| produce | — | never bound; produce slots are sources |
+
+Bindings describe API calls and nothing else. Opening and closing screens, navigation, reloading after a save and every other UI behaviour belong to the app's code, never to a manifest.
+
+Every binding records `origin` (manual or suggested) and `state` (draft or confirmed). Only confirmed bindings run in production.
+
+---
+
+## 7. Expressions
+
+One grammar for every source. Nothing outside it is allowed.
+
+| Form | Resolves to |
+|---|---|
+| `<bindId>.<slot>` | A produce slot of a component on this screen, e.g. `subject.value`, `grid.selection`, `status.selected` |
+| `<bindId>.<slot>.<path>` | A property inside it |
+| `<expr>[*].<path>` | A property of every item, as a list |
+| `$item.<path>` | The current item in a scoped slot or `forEach` |
+| `$context.<id>.<path>` | A value declared in the screen's `context` |
+| `$<provider>.<path>` | A registered context provider |
+| `$steps.<stepId>.response.<path>` | The response of an earlier `call` step |
+| `<expr> \| <transform>(<args>)` | A registered transform |
+
+Literal values are allowed only when the target schema defines them (`enum`, `const` or `default`). There is no free-text source.
+
+---
+
+## 8. Suggestions
+
+The studio ranks **all** catalog operations for each slot and shows the best ones first. The user can always choose any operation. Ranking is done by registered `Matcher`s, combined by weight. The default matchers use only metadata already present in the inputs:
+
+| Matcher | Signal |
+|---|---|
+| Shape | Compatibility between the slot's schema and the operation's response (consume) or request (trigger), including `many` and scalar types |
+| Intent | Slot role and `hints.intents` against the operation's `intent` |
+| Names | Token similarity between screen, component and slot labels and the operation's summary, tags and description |
+| Glossary | Synonym groups from registered glossaries (data files per product) |
+| Fields | For request and `map` entries: name and type similarity between available sources and target fields |
+
+Rules for matchers: no product words in code, every score comes with plain reasons, and proposals stay `origin: "suggested"` until a person confirms them.
+
+---
+
+## 9. Validation
+
+The studio and CI (a script calling `validateRegistry` and `validateBindings`) apply the same rules. All are generic:
+
+- A `required` slot is unbound.
+- A binding refers to a bindId, slot, operation or descriptor version that no longer exists.
+- Schema incompatibility between a source expression and its target (type, `many` vs single, required request fields unmapped).
+- An expression uses a source not available on this screen.
+- A literal is not defined by the target schema.
+- The catalog hash changed: each affected binding is listed with what changed (field removed, renamed or newly required).
+
+---
+
+## 10. Studio rules
+
+The studio renders entirely from descriptors, registry, catalog and manifest:
+
+- Navigation comes from `ScreenEntry.path` and `parent`. It scales to any number of screens.
+- Component lists come from `ScreenEntry.components`. Icons come from descriptors.
+- There are exactly three slot editors, chosen by role, and their forms are generated from the slot's schema. A new kind never needs studio code.
+- Every consume and trigger slot offers the full catalog in a searchable picker, with matcher suggestions on top.
+- The studio shows only what validates. A component with an unknown kind, or a binding that points at an operation no longer in the catalog, is reported by validation and kept out of the studio until it is fixed.
+
+---
+
+## 11. Runtime
+
+Entry `api_binding_ui`. Production-safe: it contains no studio code and no styles.
+
+```tsx
+<BindingProvider catalog={catalog} manifests={manifests} fetcher={fetcher} transforms={…} providers={…}>
+  <BindingScreen id="collections.worklist.add-notes" context={{ selection: selectedRows }}>
+    …
+  </BindingScreen>
+</BindingProvider>
+```
+
+| Hook | Slot role | Returns |
+|---|---|---|
+| `useSlot(bindId, slot)` | consume | `{ status, data, error, reload }`; status is `unbound`, `waiting` (a required input has no value yet), `loading`, `ready` or `error` |
+| `useCell(bindId, slot)` | scoped consume | `(item) => value` for one row or item |
+| `useProduce(bindId, slot, value)` | produce | publishes the component's current value to the screen |
+| `useTrigger(bindId, slot)` | trigger | `{ bound, running, run(item?) }`; `run` performs the API calls and returns each step's outcome |
+
+- Only **confirmed** bindings run. Drafts exist only in the studio.
+- Requests are built from request pointers and sent through the host's `fetcher`; base URL, authentication and error display stay in the app.
+- A component re-renders only when the values its own binding reads change. Identical requests on one screen share one call.
+- Without a confirmed binding a consume slot is `unbound` and a trigger has `bound: false`. What the component shows or does then is the app's decision.
+- Bindings never open, close, navigate or reload anything. After `run()` resolves, the app decides what happens next (for example close a dialog and call `reload()` on a grid).
+
+---
+
+## 12. Design-time integration
+
+Entry `api_binding_ui/studio` (plus `api_binding_ui/studio.css`). Import it only from design-time code so production bundles never contain it.
+
+- The app renders `<BindingWidget framework={{ descriptors, registry, transforms, providers }} />` once, inside `BindingProvider`, in design mode only. It is a floating button that opens the studio in a modal over the app, on the most recently shown `BindingScreen` (an open dialog wins over its page). Views that stay mounted while hidden (inactive tabs) are wrapped in `<BindingActive value={isVisible}>` so their screens are skipped. When the studio closes, the runtime reloads the saved manifests of mounted screens, so edits apply without a page reload.
+- `<BindingStudio>` is the same studio as a plain component, for hosts that mount it on their own page.
+- The studio loads the catalog from the published docs (`docsUrl`, default `https://apidocs.highradius.com/documentation-ui/index.yaml`; JSON or YAML; products from `x-tagGroups`). Each user can change the URL in Settings. A `catalog` passed in `framework` is used instead.
+- Settings also download and import manifests as JSON, so bindings made in the studio can be committed with the app.
+- The widget saves manifests through `BindingProvider persistence` (browser storage by default), so the app runs them immediately. Committed manifests come from Settings → Download.
+
+---
+
+## 13. Versioning
+
+| Contract | Version field | On change |
+|---|---|---|
+| Descriptor | `version` per kind | Manifests record `kinds`; the studio offers a migration when a kind's version rises |
+| Registry | `registryVersion` | Bumped when the shape changes; a migration ships with the package version that changes it |
+| Catalog | `catalogVersion`, `hash` | bindings to operations no longer in the catalog are reported by validation and hidden in the studio |
+| Manifest | `manifestVersion` | Bumped when the shape changes; a migration ships with the package version that changes it |
+
+---
+
+## 14. Conformance rules for an app (for example, an app built with Lovable)
+
+1. Every interactive or data-showing component comes from a library that publishes a descriptor for its kind.
+2. Every component instance has a stable `bindId`, unique within its screen and independent of its label.
+3. Every screen is wrapped in `BindingScreen` with a stable screen id and declares its `context`.
+4. Components get data and call APIs only through their slots. No direct API calls, no hardcoded option lists, no local data hooks in screens. Opening, closing and navigation stay in the app's UI code.
+5. Dialogs and drawers are separate screens with `parent` set to the screen they appear over.
+6. Manifests are committed to the repository and reviewed like code.
+7. The catalog is regenerated from the docs, never edited by hand.
+
+---
+
+## 15. Out of scope for the framework
+
+- Any list of component kinds or slots (they belong to descriptors).
+- Any product, module, operation or field name (they belong to the registry, catalog and manifests).
+- Any vocabulary or naming rule (it belongs to glossaries and docs extensions).
+- Business behavior that is not expressed as slots and steps.

package/dist/api-binding-ui.css

@@ -1,248 +0,0 @@
-/* src/styles/highradius-bridge.css */
-
-
-/* src/styles/index.css */
-
-
-/* src/styles/workspace.css */
-.binding-workspace, .binding-workspace * {
-  box-sizing: border-box;
-}
-
-.binding-workspace, .api-binding, .binding-v2 {
-  display: flex;
-  background: var(--ds-color-background, #fff);
-  color: var(--ds-color-foreground, #0f172a);
-  font-family: var(--ds-font-family-sans, sans-serif);
-  flex-direction: column;
-  height: 100vh;
-}
-
-.binding-workspace h1, .api-binding h1, .binding-v2 h1 {
-  font-size: var(--ds-font-size-2xl, 1.5rem);
-  font-weight: var(--ds-font-weight-bold, 700);
-  margin: 0;
-}
-
-.binding-workspace h2, .api-binding h2, .binding-v2 h2 {
-  font-size: var(--ds-font-size-lg, 1.125rem);
-  font-weight: var(--ds-font-weight-semibold, 600);
-  margin: 0;
-}
-
-.binding-workspace h3, .api-binding h3, .binding-v2 h3 {
-  font-size: var(--ds-font-size-base, .875rem);
-  font-weight: var(--ds-font-weight-semibold, 600);
-  margin: 0;
-}
-
-.binding-workspace p, .api-binding p, .binding-v2 p {
-  line-height: var(--ds-line-height-normal, 1.5);
-  margin: 0;
-}
-
-.binding-header, .binding-footer, .binding-v2-header, .binding-v2-footer {
-  padding: var(--ds-page-padding, 1rem 1.5rem);
-  display: flex;
-  gap: var(--ds-space-4, 1rem);
-  flex-wrap: wrap;
-  justify-content: space-between;
-  align-items:  center;
-}
-
-.binding-header, .binding-v2-header {
-  border-bottom-width: var(--ds-screen-surface-border-width, 1px);
-  border-bottom-style: solid;
-  border-bottom-color: var(--ds-color-border, #e2e8f0);
-}
-
-.binding-body, .binding-v2-body {
-  overflow: auto;
-  position: relative;
-  padding: var(--ds-page-padding, 1rem 1.5rem);
-  flex: 1;
-  min-height: 0;
-}
-
-.binding-columns, .binding-v2-columns {
-  isolation: isolate;
-  display: flex;
-  gap: var(--ds-space-8, 2rem);
-  flex-wrap: wrap;
-  align-items:  start;
-}
-
-.binding-main, .binding-v2-main {
-  flex-grow: 1;
-  flex-basis: var(--ds-dialog-form-min-width, 32rem);
-  padding-bottom: var(--ds-space-12, 3rem);
-}
-
-.binding-main, .binding-stack, .binding-v2-main, .binding-v2-stack {
-  display: flex;
-  gap: var(--ds-space-4, 1rem);
-  flex-direction: column;
-  min-width: 0;
-}
-
-.binding-section, .binding-v2-section {
-  padding-bottom: var(--ds-space-6, 1.5rem);
-  display: flex;
-  gap: var(--ds-space-4, 1rem);
-  border-bottom-width: var(--ds-screen-surface-border-width, 1px);
-  border-bottom-style: solid;
-  border-bottom-color: var(--ds-color-border, #e2e8f0);
-  flex-direction: column;
-}
-
-.binding-section-title, .binding-v2-section-title {
-  display: flex;
-  justify-content: space-between;
-  align-items:  center;
-  gap: var(--ds-space-4, 1rem);
-}
-
-.binding-muted, .binding-v2-muted {
-  color: var(--ds-color-muted-foreground, #64748b);
-  font-size: var(--ds-font-size-sm, .8125rem);
-}
-
-.binding-preview, .binding-v2-preview {
-  flex-basis: var(--ds-dialog-min-width, 24rem);
-  position: sticky;
-  background: var(--ds-color-surface, #fff);
-  border-width: var(--ds-screen-surface-border-width, 1px);
-  border-style: solid;
-  border-color: var(--ds-color-border, #e2e8f0);
-  border-radius: var(--ds-radius-md, 6px);
-  padding: var(--ds-space-6, 1.5rem);
-  display: flex;
-  gap: var(--ds-space-4, 1rem);
-  flex-direction: column;
-  flex-grow: 0;
-  max-width: 100%;
-  top: 0;
-}
-
-.binding-panel, .binding-v2-panel {
-  position: absolute;
-  width: var(--ds-dialog-form-min-width, 32rem);
-  background: var(--ds-color-background, #fff);
-  border-left-width: var(--ds-screen-surface-border-width, 1px);
-  border-left-style: solid;
-  border-left-color: var(--ds-color-border, #e2e8f0);
-  box-shadow: var(--ds-shadow-md, 0 4px 6px -1px #0000001a);
-  padding: var(--ds-space-6, 1.5rem);
-  display: flex;
-  gap: var(--ds-space-6, 1.5rem);
-  z-index: var(--ds-focus-z-index, 50);
-  flex-direction: column;
-  max-width: 100%;
-  min-height: 100%;
-  top: 0;
-  right: 0;
-}
-
-.binding-details, .binding-v2-details {
-  display: flex;
-  gap: var(--ds-space-2, .5rem);
-  font-size: var(--ds-font-size-sm, .8125rem);
-  overflow-wrap: anywhere;
-  flex-direction: column;
-}
-
-.binding-details summary, .binding-v2-details summary {
-  cursor: pointer;
-  color: var(--ds-color-muted-foreground, #64748b);
-}
-
-.binding-footer, .binding-v2-footer {
-  border-top-width: var(--ds-screen-surface-border-width, 1px);
-  border-top-style: solid;
-  border-top-color: var(--ds-color-border, #e2e8f0);
-  background: var(--ds-color-background, #fff);
-}
-
-.binding-simulation, .binding-v2-simulation {
-  display: flex;
-  gap: var(--ds-space-4, 1rem);
-  flex-direction: column;
-}
-
-.binding-empty, .binding-v2-empty {
-  padding: var(--ds-space-12, 3rem);
-  margin: auto;
-}
-
-.binding-error, .binding-v2-error {
-  color: var(--ds-color-destructive, #ef4444);
-}
-
-.binding-stack-tight, .binding-v2-stack-tight {
-  display: flex;
-  align-items:  flex-start;
-  gap: var(--ds-space-1, .25rem);
-  flex-direction: column;
-}
-
-.binding-list, .binding-v2-list {
-  padding-left: var(--ds-space-4, 1rem);
-  margin: 0;
-}
-
-.binding-panel-wide, .binding-v2-panel-wide {
-  width: var(--ds-dialog-width-large, 48rem);
-  overflow: auto;
-}
-
-.binding-call, .binding-v2-call {
-  display: flex;
-  gap: var(--ds-space-3, .75rem);
-  padding: var(--ds-space-4, 1rem);
-  border-width: var(--ds-screen-surface-border-width, 1px);
-  border-style: solid;
-  border-color: var(--ds-color-border, #e2e8f0);
-  border-radius: var(--ds-radius-md, 6px);
-  flex-direction: column;
-  min-width: 0;
-}
-
-.binding-call-grid, .binding-v2-call-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(var(--ds-menu-min-width, 12rem), 1fr));
-  gap: var(--ds-space-3, .75rem);
-}
-
-.binding-params, .binding-v2-params {
-  display: flex;
-  gap: var(--ds-space-2, .5rem);
-  flex-direction: column;
-}
-
-.binding-param, .binding-v2-param {
-  display: grid;
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-  gap: var(--ds-space-3, .75rem);
-  overflow-wrap: anywhere;
-  align-items:  start;
-}
-
-.binding-endpoint, .binding-v2-endpoint {
-  font-family: var(--ds-font-family-mono, monospace);
-  font-size: var(--ds-font-size-sm, .8125rem);
-  overflow-wrap: anywhere;
-}
-
-.binding-preview-parts, .binding-v2-preview-parts {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(var(--ds-menu-min-width, 12rem), 1fr));
-  gap: var(--ds-space-3, .75rem);
-}
-
-.binding-pre, .binding-v2-pre {
-  font-family: var(--ds-font-family-mono, monospace);
-  font-size: var(--ds-font-size-sm, .8125rem);
-  white-space: pre-wrap;
-  overflow-wrap: anywhere;
-  margin: 0;
-}

package/dist/components/ApiBindingWorkspace.d.ts

@@ -1,10 +0,0 @@
-import * as React from "react";
-import type { ApiBindingContext, WorkspaceComponents } from "../types";
-import "../styles/workspace.css";
-export interface ApiBindingWorkspaceProps {
-    pageKey: string;
-    initialContext?: ApiBindingContext;
-    components?: Partial<WorkspaceComponents>;
-}
-export declare function ApiBindingWorkspace({ pageKey, initialContext, components, }: ApiBindingWorkspaceProps): React.JSX.Element;
-export declare const ApiBindingStudio: typeof ApiBindingWorkspace;

package/dist/components/ApiMappings.d.ts

@@ -1,21 +0,0 @@
-import * as React from "react";
-import type { ApiBindingConfig, ApiBindingContext } from "../types";
-export declare const TIMING_OPTIONS: {
-    value: string;
-    label: string;
-}[];
-export declare const FRESHNESS_OPTIONS: {
-    value: string;
-    label: string;
-}[];
-/**
- * The single canonical API-mapping editor. The global entry shows every call;
- * a field or action entry passes `focus` and sees only calls targeting it or sending its value.
- */
-export declare function ApiMappings({ config, context, focus, defaultTarget, onChange, }: {
-    config: ApiBindingConfig;
-    context: ApiBindingContext;
-    focus?: string;
-    defaultTarget?: string;
-    onChange: (updater: (old: ApiBindingConfig) => ApiBindingConfig) => void;
-}): React.JSX.Element;

package/dist/components/BindApiButton.d.ts

@@ -1,41 +0,0 @@
-import * as React from "react";
-import type { ApiDefinition, BindingGrid, BindingOption, MappingFile, SnapshotComponent, SnapshotContext, WindowKind, WindowTrigger } from "../types";
-export interface BindApiButtonProps {
-    appId?: string;
-    windowId: string;
-    /** Source window, screen, or action name, e.g. "Add Notes", "Create P2P", "Invoice Details" */
-    source: string;
-    /** Parent grid, panel, or screen name, e.g. "Worklist Grid", "Dashboard", "Main Screen" */
-    parent: string;
-    /** Optional Grid context (selected rows and columns) if triggered from or acting upon a grid */
-    grid?: BindingGrid;
-    /** Parent windows / screens context hierarchy */
-    parents?: SnapshotContext[];
-    /** UI presentation kind (modal, drawer, screen, form, etc.) */
-    kind?: WindowKind;
-    /** Action trigger info */
-    trigger?: WindowTrigger;
-    /** Captured dropdown/combobox options from the host form */
-    options?: Record<string, BindingOption[]>;
-    /** Registered API definitions catalog */
-    definitions?: ApiDefinition[];
-    /** Existing saved mapping file */
-    mappingFile?: MappingFile | null;
-    /** Base route for the Studio in the router (defaults to `/api-binding`) */
-    routeBase?: string;
-    /** Optional container ref to override automatic DOM discovery */
-    containerRef?: React.RefObject<HTMLElement | null>;
-    /** Optional container CSS selector to locate screen root */
-    containerSelector?: string;
-    /** Explicit root DOM element */
-    rootElement?: HTMLElement | null;
-    /** Optional HTML form id */
-    formId?: string;
-    /** Explicit components / fields override if not discovered via DOM */
-    components?: SnapshotComponent[];
-    /** Explicit action buttons override */
-    buttons?: string[];
-    className?: string;
-    children?: React.ReactNode;
-}
-export declare function BindApiButton({ appId, windowId, source, parent, grid, parents, kind, trigger, options, definitions, mappingFile, routeBase, containerRef, containerSelector, rootElement, formId, components: explicitComponents, buttons: explicitButtons, className, children, }: BindApiButtonProps): React.JSX.Element;

package/dist/components/RequestPreview.d.ts

@@ -1,7 +0,0 @@
-import * as React from "react";
-import type { RequestPreviewItem } from "../types";
-/** Simulated requests in call order. Nothing here is sent over network. */
-export declare function RequestPreview({ title, requests }: {
-    title: string;
-    requests: RequestPreviewItem[];
-}): React.JSX.Element;

package/dist/components/SimulationDialog.d.ts

@@ -1,8 +0,0 @@
-import * as React from "react";
-import type { ApiBindingConfig, ApiBindingContext } from "../types";
-export declare function SimulationDialog({ config, context, onClose, onVerified, }: {
-    config: ApiBindingConfig;
-    context: ApiBindingContext;
-    onClose: () => void;
-    onVerified: (signature: string) => void;
-}): React.JSX.Element;

package/dist/components/ValidationDialog.d.ts

@@ -1,8 +0,0 @@
-import * as React from "react";
-import type { ApiBindingConfig, ApiBindingContext } from "../types";
-export declare function ValidationDialog({ config, context, onClose, onVerified }: {
-    config: ApiBindingConfig;
-    context: ApiBindingContext;
-    onClose: () => void;
-    onVerified: (signature: string) => void;
-}): React.JSX.Element;

package/dist/components/WorkspaceContext.d.ts

@@ -1,7 +0,0 @@
-import * as React from "react";
-import type { WorkspaceComponents } from "../types";
-export declare function WorkspaceComponentsProvider({ components, children, }: {
-    components?: Partial<WorkspaceComponents>;
-    children: React.ReactNode;
-}): React.JSX.Element;
-export declare function useWorkspaceComponents(): Required<WorkspaceComponents>;

package/dist/components/ui/AppGrid.d.ts

@@ -1,27 +0,0 @@
-import * as React from "react";
-export interface AppGridColDef<T = unknown> {
-    field?: keyof T | string;
-    headerName: string;
-    fill?: boolean;
-    type?: "number" | "badge" | "action";
-    badgeVariants?: Record<string, "success" | "warning" | "danger" | "neutral">;
-    labelField?: keyof T | string;
-    icon?: string;
-    onClick?: (row: T) => void;
-    render?: (row: T) => React.ReactNode;
-}
-export declare function createActionColumn<T>(spec: {
-    headerName: string;
-    labelField: keyof T | string;
-    icon?: string;
-    onClick: (row: T) => void;
-}): AppGridColDef<T>;
-export interface AppGridProps<T> {
-    rows: T[];
-    columns: AppGridColDef<T>[];
-    getRowKey?: (row: T, index: number) => string | number;
-    className?: string;
-    filtering?: boolean;
-    height?: string;
-}
-export declare function AppGrid<T extends Record<string, any>>({ rows, columns, getRowKey, className, }: AppGridProps<T>): React.JSX.Element;

package/dist/components/ui/Badge.d.ts

@@ -1,9 +0,0 @@
-import * as React from "react";
-export type BadgeVariant = "neutral" | "info" | "success" | "warning" | "danger" | "brand";
-export interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
-    variant?: BadgeVariant;
-    children: React.ReactNode;
-    className?: string;
-    style?: React.CSSProperties;
-}
-export declare function Badge({ variant, children, className, style, ...rest }: BadgeProps): React.JSX.Element;