/*! JointJS React v4.3.6 (2026-09-04) - React bindings and hooks for JointJS to build interactive diagrams and graphs. This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0. If a copy of the MPL was not distributed with this file, You can obtain one at http://mozilla.org/MPL/2.0/. */ import { G as GraphStore, aM as PaperStore, aN as Feature, E as ElementJSONInit, L as LinkJSONInit, aO as GraphStoreInternalSnapshot, P as PaperProps, aP as PaperView, aQ as Atom, m as CellDragState, h as ElementRecord, T as LinkRecord, g as PaperTarget } from './use-cell-drag-shT4kvtb.js'; export { aR as AUTO_SIZE_OPTION, aS as AddPaperOptions, aT as DEFAULT_CELL_NAMESPACE, i as ELEMENT_MODEL_TYPE, aU as GraphStoreOptions, j as LINK_MODEL_TYPE, Y as MeasureElementOptions, aV as OmitWithoutIndexSignature, aW as PORTAL_SELECTOR, aX as PaperStoreOptions, aY as PaperStoreState, a3 as PortalSelector, aZ as createAtom, a_ as subscribeToPaperEvents, a$ as usePaperStore, b0 as useResolvePaperId } from './use-cell-drag-shT4kvtb.js'; import * as react from 'react'; import { ComponentType, PropsWithChildren, DependencyList, RefObject, ReactNode, ForwardedRef } from 'react'; import * as _joint_core_types_dia_d_ts from '@joint/core/types/dia.d.ts'; import * as react_jsx_runtime from 'react/jsx-runtime'; import { dia, mvc } from '@joint/core'; import '@joint/core/types/dia'; import '@joint/core/types/internal'; /** * Props for element item portal components. * Reads the current cell id from `CellIdContext` and subscribes to its * record via the graph store directly. */ interface ElementItemProps { /** * Element renderer. Invoked as a JSX component with the element's `data` * spread as props, so wrapping it in `React.memo` works (React calls the * memo wrapper, not the inner function). Use `useCell(c => c.id)` inside * the renderer when the id is needed. */ readonly renderElement: ComponentType>; /** The DOM element to portal into. */ readonly portalElement: SVGElement | HTMLElement | null; /** Whether all auto-sized elements have been measured. */ readonly areElementsMeasured: boolean; } /** * SVG element portal component. Subscribes only to the element's `data` * slice, position and size are handled by JointJS's view transform and * never cause a React re-render here. Clears cached views after * measurement to force re-render with correct dimensions. * @param props - render/portal props * @internal */ declare function SVGElementItemComponent(props: ElementItemProps): react.ReactPortal | null; /** * SVG portal wrapper used by `renderElement`. * @internal */ declare const SVGElementItem: typeof SVGElementItemComponent; /** * HTML element portal component with absolute positioning. Reads * `position` / `size` directly from the element record; `renderElement` * only receives `data` and is memoised on the `data` reference so position * or size updates re-style the wrapper without re-invoking the user render. * @param props - render/portal props * @internal */ declare function HTMLElementItemComponent(props: ElementItemProps): react.ReactPortal | null; /** * HTML portal wrapper used by `renderElement` with `useHTMLOverlay`. * @internal */ declare const HTMLElementItem: typeof HTMLElementItemComponent; interface Props$1 { readonly onSetElement: (element: HTMLElement) => void; } declare function Component({ onSetElement }: Readonly): react_jsx_runtime.JSX.Element | undefined; declare const PaperHTMLContainer: react.MemoExoticComponent; declare const GraphStoreContext: react.Context | null>; declare const PaperStoreContext: react.Context; declare const CellIdContext: react.Context<_joint_core_types_dia_d_ts.Cell.ID | undefined>; /** * Callback stored in the features context for deferred feature creation. * @internal */ type DeferredFeatureCallback = (options: { readonly graphStore: GraphStore; readonly paperStore: PaperStore; readonly asChildren: boolean; } | { readonly graphStore: GraphStore; }) => Feature; /** * Context returned by useCreateFeature and provided by FeaturesProvider. * Stores deferred feature registrations before their target store is available. * @internal */ interface FeaturesContext { readonly features: Map; } /** Context for paper-scoped deferred feature registrations. */ declare const PaperFeaturesContext: react.Context; /** Context for graph-scoped feature registrations. */ declare const GraphFeaturesContext: react.Context; /** * Discriminator for feature lifecycle, determines where the feature is stored and managed. * @internal */ type FeatureTarget = 'paper' | 'graph'; interface PaperStoreOptions { readonly graphStore: GraphStore; readonly paperStore: PaperStore; readonly asChildren: boolean; } interface GraphStoreOptions { readonly graphStore: GraphStore; } /** Context passed to feature `onAdd`, exposes the paper or graph store depending on `Target`. */ type OnAddFeatureOptions = Target extends 'paper' ? PaperStoreOptions : GraphStoreOptions; /** Same as {@link OnAddFeatureOptions}, plus the live feature `instance` being updated. */ type OnUpdateFeatureOptions = OnAddFeatureOptions & { readonly instance: T; }; /** Same as {@link OnAddFeatureOptions}, plus the freshly mounted feature `instance`. */ type OnLoadFeatureOptions = OnAddFeatureOptions & { readonly instance: T; }; /** Factory that creates and registers a feature instance against the target store. */ type OnAddFeature = (options: OnAddFeatureOptions) => Feature; /** Callback invoked when a previously created feature instance needs to react to updated props. */ type OnUpdateFeature = (options: OnUpdateFeatureOptions) => void; /** Callback invoked once a feature instance has been mounted and is ready to use. */ type OnLoadFeature = (options: OnLoadFeatureOptions) => void; /** Configuration accepted by {@link useCreateFeature} to wire a feature into a store. */ interface AddFeatureOptions { readonly onAddFeature: OnAddFeature; readonly onLoad?: OnLoadFeature; readonly onUpdateFeature?: OnUpdateFeature; readonly id: string; readonly forwardedRef?: React.Ref; } /** * Creates and manages a feature lifecycle for either paper or graph scope. * * Paper features are deferred until a PaperStore is available and stored per-paper. * Graph features are created immediately and stored on the GraphStore. * @param target - Where the feature lives: 'paper' (per-paper) or 'graph' (global). * @param options - Feature configuration including callbacks and id. * @param dependencies - Optional dependency array to trigger feature updates. * @returns The features context for nesting child features. * @internal */ declare function useCreateFeature(target: 'paper', options: AddFeatureOptions, dependencies?: unknown[]): FeaturesContext; declare function useCreateFeature(target: 'graph', options: AddFeatureOptions, dependencies?: unknown[]): FeaturesContext; declare function useCreateFeature(target: Target, options: AddFeatureOptions, dependencies?: unknown[]): FeaturesContext; interface Props extends AddFeatureOptions, PropsWithChildren> { readonly target: Target; } /** * Provider component that wraps children with a feature context. * Use `target="paper"` for paper-scoped features or `target="graph"` for graph-scoped features. * @param props - The feature provider props including target, id, onAddFeature, and children. * @returns The provider element wrapping children. */ declare function FeaturesProviderBase(props: Readonly>): react_jsx_runtime.JSX.Element; declare const FeaturesProvider: typeof FeaturesProviderBase; /** * Hook for accessing the `GraphStore` from a {@link GraphProvider}. * Each call site narrows the store's record shape via its own generics. * @template Element - element record shape (must extend `ElementAttributes`) * @template Link - link record shape (must extend `LinkAttributes`) * @group Hooks * @returns The JointJS graph store narrowed to the consumer's record shape. * @throws {Error} If used outside of a {@link GraphProvider}. */ declare function useGraphStore(): GraphStore; /** * Hook to select data from the internal graph store state. * @param selector - The selector function. * @param isEqual - The equality function. * @returns The selected data. */ declare function useInternalData(selector: (snapshot: GraphStoreInternalSnapshot) => Selection, isEqual?: (a: Selection, b: Selection) => boolean): Selection; /** * Return value from the onLoad callback. * @template Instance - The type of the instance being created */ interface OnLoadReturn { /** The created instance */ readonly instance: Instance; /** Cleanup function to call when the instance is destroyed */ readonly cleanup: () => void; } /** * Options for the useImperativeApi hook. * @template Instance - The type of the instance being managed */ interface ImperativeApiOptions { /** * Function called to create the instance. * Should return the instance and a cleanup function. */ readonly onLoad: () => OnLoadReturn; /** * Optional function called when dependencies change. * Can return a cleanup function that will be called before the next update. * @param instance - The current instance * @param reset - Function to reset the instance by calling onLoad again * @returns Optional cleanup function */ readonly onUpdate?: (instance: Instance, reset: () => void) => void | (() => void); /** * Optional callback called when the ready state changes. * @param isReady - Whether the instance is ready * @param instance - The instance (null if not ready) */ readonly onReadyChange?: (isReady: boolean, instance: Instance | null) => void; /** * Whether the instance creation is disabled. * When true, the instance will be cleaned up and not created. */ readonly isDisabled?: boolean; /** * Optional ref to forward the instance to. */ readonly forwardedRef?: React.Ref; readonly instanceSelector?: (instance: Instance) => InstanceSelector; } interface ResultBase { readonly ref: RefObject; readonly isReady: boolean; } interface ResultReady extends ResultBase { readonly ref: RefObject; readonly isReady: true; } interface ResultNotReady extends ResultBase { readonly ref: RefObject; readonly isReady: false; } /** * Result of {@link useImperativeApi}, a discriminated union narrowed by `isReady`. * When `isReady` is `true`, `ref.current` is guaranteed non-null. */ type ImperativeStateResult = ResultReady | ResultNotReady; /** * A hook that provides an imperative API for managing an instance lifecycle. * * This hook handles: * - Creating instances via onLoad callback * - Updating instances when dependencies change * - Cleaning up instances when unmounted or disabled * - Exposing instances via refs * - Tracking ready state * * Used internally by components like GraphProvider and Paper to manage their instances. * @template Instance - The type of the instance being managed * @param options - Configuration options including onLoad, onUpdate, and callbacks * @param dependencies - Dependencies array that triggers onUpdate when changed * @returns An object containing a ref to the instance and a readiness flag * @private * @group Hooks */ declare function useImperativeApi(options: ImperativeApiOptions, dependencies: DependencyList): ImperativeStateResult; /** Options accepted by {@link useCreatePortalPaper}; extends all `PaperProps`. */ interface CreatePortalPaperOptions extends PaperProps { /** * Host element ref where the paper should be mounted automatically. * When omitted, paper rendering is manual (e.g. via `onReady` callback). */ readonly nodeRef?: RefObject; /** Callback fired once when paper instance is created and ready. */ readonly onReady?: (paper: PaperView) => void; /** Whether the paper is externally managed (skip div mounting). */ readonly isExternalPaper?: boolean; } /** Return value of {@link useCreatePortalPaper}: the paper id, ref, and helper APIs. */ interface CreatePortalPaperResult { /** Effective paper id used in GraphStore. */ readonly id: string; /** Current paper instance, available synchronously after mount and kept in sync afterwards. */ readonly paperRef: RefObject; /** PaperStore for this paper id, available after registration. */ readonly paperStore?: PaperStore; /** True when paper exists and is ready for content rendering. */ readonly isReady: boolean; /** React portals content for elements/links/HTML overlay. */ readonly content: ReactNode; } /** * Creates and manages a React-backed JointJS paper instance lifecycle. * @param options - Hook options with paper settings and behavior overrides. * @returns Hook state with paper instance and rendered portal content. */ declare function useCreatePortalPaper(options: Readonly): CreatePortalPaperResult; /** * Custom hook to combine a forwarded ref with an internal ref. * This is useful when you want to pass a ref to a component while also keeping a reference to the element internally. * @private * @param ref - The forwarded ref to combine with the internal ref. * @returns A ref object that combines the forwarded ref and the internal ref. * @example * const MyComponent = forwardRef((props, ref) => { * const combinedRef = useCombinedRef(ref); * return
Hello
; * }); */ declare function useCombinedRef(ref?: ForwardedRef): RefObject; /** * Returns the dragging atom for a paper. Creates one lazily on first access. * Keyed by `dia.Paper` in a `WeakMap`, garbage-collected with the paper. * @param paper - The paper instance. */ declare function getCellDragState(paper: dia.Paper): Atom; /** * Convert a React element record to JointJS-ready cell attributes. * applies preset transforms (`portMap` → native `ports`) and fills * framework defaults for `position` / `size` / `angle` / `data`. * @param element */ declare function mapElementToAttributes(element: ElementJSONInit): dia.Element.JSONInit; /** * Converts JointJS element attributes back to an element record. * * - `portMap` on model → return `portMap` (ignore native `ports`). * - No `portMap` → return `ports` as-is. * * 1:1 mapping, no `presentation` wrapper. * @param attributes */ declare function mapAttributesToElement(attributes: dia.Element.Attributes): ElementRecord; /** Function signature that maps raw JointJS element attributes to an `ElementRecord`. */ type MapAttributesToElement = typeof mapAttributesToElement; /** Function signature that maps an `ElementRecord` back to JointJS element attributes. */ type MapElementToAttributes = typeof mapElementToAttributes; /** * Convert a React link record to JointJS-ready cell attributes. * applies preset transforms (`style` → native `attrs`, `labelMap` → native * `labels`) and fills framework default for `data`. * @param link */ declare function mapLinkToAttributes(link: LinkJSONInit): dia.Link.JSONInit; /** * Converts JointJS link attributes back to a link record. * * - `style` on model → return in record. * - `labelMap` on model → return `labelMap` (merge updated positions from native `labels`). * - No `labelMap` → return `labels` as-is. * * 1:1 mapping, no `presentation` wrapper. * @param attributes */ declare function mapAttributesToLink(attributes: dia.Link.Attributes): LinkRecord; /** Function signature that maps raw JointJS link attributes to a `LinkRecord`. */ type MapAttributesToLink = typeof mapAttributesToLink; /** Function signature that maps a `LinkRecord` back to JointJS link attributes. */ type MapLinkToAttributes = typeof mapLinkToAttributes; /** * Creates a shallow copy of options without `undefined` values. * * JointJS treats an explicitly-set `undefined` as a concrete value, so these * keys must be omitted entirely when building an options object. * @param options - The source options (may contain `undefined` values). * @returns A new object with the `undefined`-valued keys removed. * @example * ```ts * makeOptions<{ width?: number; color?: string }>({ width: 100, color: undefined }); * // Result: { width: 100 } * ``` */ declare function makeOptions(options: Readonly>): T; /** * Assign new properties to an instance, ignoring undefined values. * @param props - The instance to which new properties will be assigned. * @param newProps - An object containing new properties to assign to the instance. * @returns - The updated instance with the new properties assigned, excluding any properties that were undefined. * @example * ```ts * import { assignOptions } from '@joint/react'; * * const props = { width: 100, height: 50 }; * const updated = assignOptions(props, { * width: 200, * color: undefined, // This will be ignored * }); * // Result: { width: 200, height: 50 } * ``` */ declare function assignOptions>(props: T, newProps: Partial): T; /** * Extracts the values of specified keys from an object and returns them as an array. * @param object - The source object from which to extract values. * @param picked - An array of keys whose corresponding values need to be extracted from the object. * @returns - An array containing the values associated with the specified keys in the same order as the keys array. * @example * ```ts * import { pickValues } from '@joint/react'; * * const obj = { width: 100, height: 50, color: 'red' }; * const values = pickValues(obj, new Set(['width', 'height'])); * // Result: [100, 50] * ``` */ declare function pickValues, K extends keyof T = keyof T>(object: T, picked?: Set): unknown[]; /** * Narrows an unknown value to a {@link PaperTarget}, a paper id string, a * `dia.Paper` instance, or a `RefObject`. Used to discriminate * overloaded hook arguments (target vs handlers/options). * @param value - Candidate value. * @returns True when `value` is a paper target. */ declare function isPaperTarget(value: unknown): value is PaperTarget; /** * Resolves a `dia.Paper` instance from a {@link PaperTarget}. String ids cannot * be resolved here (no access to the paper store) and return `null`. * @param paperTarget - The paper target to resolve. * @returns The resolved paper, or `null`. */ declare function resolvePaper(paperTarget: PaperTarget): dia.Paper | null; /** * Extracts the paper id from a {@link PaperTarget}. * @param paperTarget - The paper target to extract the id from. * @returns The paper id string, or `null`. */ declare function resolvePaperId(paperTarget?: PaperTarget): string | null; declare function isRecord(value: unknown): value is Record; interface GuardEvent { readonly type: string; readonly target: EventTarget | null; readonly ctrlKey?: boolean; readonly metaKey?: boolean; } /** * DOM attribute that opts an element into the wheel-guard: a wheel whose target * sits inside a marked element that has actual overflow tells `dia.Paper` that * the element owns the wheel input, so `paper:pan` / `paper:pinch` do not fire. * @group Constants */ declare const SCROLLABLE_ATTRIBUTE = "data-jj-scrollable"; /** * Predicate for `dia.Paper.options.guard`. Returns `true` when a wheel event * targets a scrollable region (native `