@superblocksteam/library 2.0.3-next.71

package/dist-types/edit-mode/features/drag-and-drop-store.d.ts

@@ -0,0 +1,69 @@
+import { GridManager } from "../dnd/grid-store.js";
+import { StackManager } from "../dnd/stack-store.js";
+import type { RootStore } from "../../lib/internal-details/lib/root-store.js";
+import type { ClientRect } from "@dnd-kit/core";
+import type { SbElement, SbInstance } from "@superblocksteam/library-shared/types";
+type DNDFeatures = {
+    dragAndDrop?: boolean;
+    nudging?: boolean;
+};
+export declare class DragAndDropManager {
+    private root;
+    stack: StackManager;
+    grid: GridManager;
+    private _dropTargetInstanceId;
+    private _isDragging;
+    private _isDraggingNewComponent;
+    private _activeDragRect;
+    private _activeTargetRect;
+    private _draggingWidgetSize;
+    private _dragToCanvasComponentType;
+    private _validRootIds;
+    private _shouldResizePage;
+    private _invalidDropTarget;
+    private _perWidgetFeatures;
+    widgetPositions: Record<SbInstance, ClientRect>;
+    constructor(root: RootStore);
+    get isDragging(): boolean;
+    get isDraggingNewComponent(): boolean;
+    get draggingWidgetSize(): {
+        height: number;
+        width: number;
+    };
+    get dropTargetId(): `I-${string}` | null;
+    get activeDragRect(): ClientRect | null;
+    get activeTargetRect(): ClientRect | null;
+    get shouldResizePage(): boolean;
+    get dropTargetWidgetType(): string | undefined;
+    get isDropTargetGridLike(): boolean;
+    get isDropTargetStackLike(): boolean;
+    get draggedWidgetType(): string | null | undefined;
+    get dragToCanvasComponentType(): string | null;
+    get validRootIds(): `I-${string}`[] | null;
+    get invalidDropTarget(): boolean;
+    canDragWidget(instanceId: SbInstance): boolean;
+    canNudgeWidget(instanceId: SbInstance): boolean;
+    setWidgetFeatures(id: SbElement, features: Partial<DNDFeatures>): void;
+    setIsDragging(isDragging: boolean): void;
+    /**
+     * Indicates a drag of a new component into the canvas (e.g: from the sidebar)
+     * Used to handle the dragging preview, and the drop handling
+     */
+    startNewComponentDrag({ height, width, componentType, }: {
+        height: number;
+        width: number;
+        componentType: string | null;
+    }): void;
+    cancelNewComponentDrag(): void;
+    setValidRootIds(ids: SbInstance[]): void;
+    setInvalidDropTarget(invalid: boolean): void;
+    setDropTargetId(id: SbInstance | null): void;
+    setActiveDragRect(collidingRect: ClientRect | null): void;
+    setActiveTargetRect(rect: ClientRect | null): void;
+    setWidgetPosition(id: SbInstance, rect: ClientRect | null): void;
+    updateChildPositions(id: SbInstance): void;
+    private getPageElement;
+    resizePageIfNeeded(): void;
+    private restorePageDimensions;
+}
+export {};

package/dist-types/edit-mode/features/interaction-layer-manager.d.ts

@@ -0,0 +1,17 @@
+import type { SbElement, SbInstance } from "@superblocksteam/library-shared/types";
+declare class InteractionLayerManager {
+    /**
+     * The id of the root element that is currently being interacted with
+     * the root can be SbPage, SbModal or SbSlideout
+     * If set to undefined, the interaction layer will be the SbPage
+     * if set to the detached component id, the inteactoin layer will be disabled on the page
+     */
+    activeRootInstanceId: SbInstance | undefined;
+    sourceIdElements: Map<HTMLElement, `SB-${string}`>;
+    constructor();
+    setActiveRootInstanceId(rootInstanceId: SbInstance | undefined): void;
+    setSourceIdElement(element: HTMLElement, sourceId: SbElement): void;
+    removeSourceIdElement(element: HTMLElement): void;
+    getSourceIdElements(sourceId: SbElement): HTMLElement[];
+}
+export default InteractionLayerManager;

package/dist-types/edit-mode/features/operation-store.d.ts

@@ -0,0 +1,49 @@
+import type { PropertyInfo, ReparentRequest, SbElement, SetPropertiesRequest, SetPropertyRequest, SourceLocation } from "@superblocksteam/library-shared/types";
+export type ReparentTransaction = {
+    type: "reparent";
+    id: string;
+    affectedSourceIds: string[];
+    payload: Omit<ReparentRequest, "transaction">;
+    callback?: () => void;
+};
+type SetPropertiesTransaction = {
+    type: "setProperties";
+    id: string;
+    sourceId: string;
+    payload: Omit<SetPropertiesRequest, "transaction">;
+    callback?: () => void;
+};
+type SetPropertyTransaction = {
+    type: "setProperty";
+    id: string;
+    sourceId: string;
+    payload: Omit<SetPropertyRequest, "transaction">;
+    callback?: () => void;
+};
+type PendingTransaction = ReparentTransaction | SetPropertiesTransaction | SetPropertyTransaction;
+declare class OperationManager {
+    private pendingTransactions;
+    visibleSourceIds: string[];
+    constructor();
+    get allPendingTransactions(): PendingTransaction[];
+    get pendingReparentOperations(): ReparentTransaction[];
+    get pendingSetPropertiesOperations(): SetPropertiesTransaction[];
+    get pendingSetPropertyOperations(): SetPropertyTransaction[];
+    get allNames(): never[];
+    private addPendingTransaction;
+    clearPendingTransactions(transactionIds: string[]): void;
+    dropComponent(action: {
+        from: {
+            source: SourceLocation;
+        };
+        to: {
+            source: SourceLocation;
+        };
+        propsToChange?: Record<string, PropertyInfo>;
+    }): void;
+    writeRuntimeProperties(sourceId: SbElement, transactionId: string, updates: Record<string, PropertyInfo<unknown>>): void;
+    setWidgetProperties(sourceId: SbElement, properties: Record<string, PropertyInfo<unknown>>, callback?: () => void): void;
+    setWidgetProperty(sourceId: SbElement, property: string, value: PropertyInfo<unknown>, callback?: () => void): void;
+    ensureFilesSynced(): Promise<void>;
+}
+export default OperationManager;

package/dist-types/edit-mode/features/properties-panel-manager.d.ts

@@ -0,0 +1,31 @@
+import { type PropertyInfo, type SbElement, type SbInstance } from "@superblocksteam/library-shared/types";
+import type RuntimeEntitiesManager from "./runtime-entities-manager.js";
+import type { IEntityManager } from "../../lib/internal-details/lib/evaluator/base-entity-manager.js";
+import type { PropertiesDefinition } from "../../lib/user-facing/properties-panel/props-builder.js";
+import type { PropertiesPanelDefinition } from "@superblocksteam/library-shared/props";
+declare class PropertiesPanelManager {
+    readonly runtimeEntitiesManager: RuntimeEntitiesManager;
+    readonly entityManager: IEntityManager;
+    private propertiesDefinitions;
+    private propertiesPanelTrackerDisposer;
+    private nonDynamicPropertyPanels;
+    constructor(runtimeEntitiesManager: RuntimeEntitiesManager, entityManager: IEntityManager);
+    getPropertiesPanel(scopeId: string, instanceId: SbInstance): PropertiesPanelDefinition;
+    trackPropertiesPanel(scopeId: string, instanceId: SbInstance, sourceId: string): void;
+    getPropertiesDefinition(type: string): PropertiesDefinition | undefined;
+    setPropertiesDefinition(widgetType: string, propertiesDefinition: PropertiesDefinition): void;
+    getNonDynamicPropertiesPanels(): {
+        [k: string]: PropertiesPanelDefinition;
+    };
+    private _propertyLookupCache;
+    private cachedPropertyLookupForType;
+    private getPropertyForPath;
+    computeSideEffectsForPropertyUpdate(payload: {
+        sourceId: SbElement;
+        updates: Record<string, PropertyInfo<unknown>>;
+    }): Record<string, {
+        props?: Record<string, PropertyInfo<unknown>>;
+        meta?: Record<string, unknown>;
+    }>;
+}
+export default PropertiesPanelManager;

package/dist-types/edit-mode/features/resizing-store.d.ts

@@ -0,0 +1,50 @@
+import { Dim } from "@superblocksteam/library-shared";
+import type { SbElement, SbInstance } from "@superblocksteam/library-shared/types";
+type GU = {
+    xGU: number;
+    yGU: number;
+    widthGU: number;
+    heightGU: number;
+};
+type ResizeState = {
+    instanceId: SbInstance;
+    sourceId: SbElement;
+    dragStartX: number;
+    dragStartY: number;
+    start: {
+        width: number;
+        height: number;
+        marginLeft: number;
+        marginTop: number;
+    };
+    resizedPosition: string;
+    widthToUpdate: Dim | null;
+    marginLeftToUpdate: Dim | null;
+    heightToUpdate: Dim | null;
+    marginTopToUpdate: Dim | null;
+    gridUnitWidth: number;
+    gridUnitHeight: number;
+    potentialCollisions: Record<SbInstance, GU>;
+    widgetGU: GU | null;
+    isApplyingResize: boolean;
+};
+export declare class ResizingManager {
+    private _activeResizes;
+    constructor();
+    startResizing(dragStartX: number, dragStartY: number, instanceId: SbInstance, position: string): void;
+    private calculatePotentialCollisions;
+    private calculateDimension;
+    private handleResizeDimension;
+    private isColliding;
+    resizeWidget(currentX: number, currentY: number, instanceId: SbInstance, canResizeWidth: boolean, canResizeHeight: boolean): void;
+    pendingResize(sourceId: SbElement): {
+        width: Dim | null;
+        height: Dim | null;
+        marginLeft: Dim | null;
+        marginTop: Dim | null;
+    } | null;
+    get hasAnyPendingResize(): boolean;
+    get pendingResizes(): ResizeState[];
+    applyResize(instanceId: SbInstance): void;
+}
+export {};

package/dist-types/edit-mode/features/runtime-entities-manager.d.ts

@@ -0,0 +1,84 @@
+import RuntimeWidgetsManager from "./runtime-widgets-manager.js";
+import type { ChildElement, RuntimeWidgetMeta } from "./runtime-widgets-manager.js";
+import type { IEntityManager } from "../../lib/internal-details/lib/evaluator/base-entity-manager.js";
+import type { IdentifierInfo, NameManager } from "../../lib/internal-details/lib/features/name-manager.js";
+import type { SbElement, SbInstance } from "@superblocksteam/library-shared/types";
+declare class RuntimeEntitiesManager {
+    readonly nameManager: NameManager;
+    readonly entityManager: IEntityManager;
+    widgets: RuntimeWidgetsManager;
+    entitiesWithLocalBindings: Set<string>;
+    constructor(nameManager: NameManager, entityManager: IEntityManager);
+    processRootWidget(params: {
+        rootIdentifier: IdentifierInfo;
+        rootProps: Record<string, unknown>;
+        rootType: string;
+        fallbackScopeId: string;
+        isInCustomComponent: boolean;
+    }): void;
+    private getOptimisticWidgetMeta;
+    getEditorWidgetMeta(instanceId: SbInstance): RuntimeWidgetMeta | undefined;
+    getEditorWidgetSourceId(instanceId: SbInstance): `SB-${string}` | undefined;
+    getEditorWidgetScopeId(instanceId: SbInstance): string | undefined;
+    getAnyEditorWidgetMeta(sourceId: SbElement): RuntimeWidgetMeta | undefined;
+    getEditorWidgetName(instanceId: SbInstance): string | undefined;
+    getEditorWidgetType(instanceId: SbInstance): string | undefined;
+    getEditorWidgetChildrenMeta(instanceId: SbInstance): Array<RuntimeWidgetMeta>;
+    setEntitiesWithLocalBindings(entities: string[]): void;
+    doesEntityHaveLocalBindings(entity: SbInstance): boolean;
+    private getOptimisticWidgetChildrenIds;
+    private getParentSourceId;
+    private get relevantChildrenOperationsMap();
+    private getChildrenWithOptimisticUpdates;
+    getEditorWidgetChildren(instanceId: SbInstance): ChildElement[];
+    get hasEditOperationsPending(): boolean;
+    get getPendingOperations(): ((import("./operation-store.js").ReparentTransaction | {
+        type: "setProperties";
+        id: string;
+        sourceId: string;
+        payload: Omit<import("@superblocksteam/library-shared/types").SetPropertiesRequest, "transaction">;
+        callback?: () => void;
+    } | {
+        type: "setProperty";
+        id: string;
+        sourceId: string;
+        payload: Omit<import("@superblocksteam/library-shared/types").SetPropertyRequest, "transaction">;
+        callback?: () => void;
+    }) | {
+        instanceId: SbInstance;
+        sourceId: SbElement;
+        dragStartX: number;
+        dragStartY: number;
+        start: {
+            width: number;
+            height: number;
+            marginLeft: number;
+            marginTop: number;
+        };
+        resizedPosition: string;
+        widthToUpdate: import("@superblocksteam/library-shared").Dim | null;
+        marginLeftToUpdate: import("@superblocksteam/library-shared").Dim | null;
+        heightToUpdate: import("@superblocksteam/library-shared").Dim | null;
+        marginTopToUpdate: import("@superblocksteam/library-shared").Dim | null;
+        gridUnitWidth: number;
+        gridUnitHeight: number;
+        potentialCollisions: Record<SbInstance, {
+            xGU: number;
+            yGU: number;
+            widthGU: number;
+            heightGU: number;
+        }>;
+        widgetGU: {
+            xGU: number;
+            yGU: number;
+            widthGU: number;
+            heightGU: number;
+        } | null;
+        isApplyingResize: boolean;
+    })[];
+    getScopeIdForSourceId(sourceId: SbElement): string | undefined;
+    applySideEffects(changes: Record<string, Record<string, unknown>>, scopeId: string): void;
+    isChildOf(childId: SbInstance, parentId: SbInstance): boolean;
+    getClosestAncestorByType(id: SbInstance, type: string): RuntimeWidgetMeta | undefined;
+}
+export default RuntimeEntitiesManager;

package/dist-types/edit-mode/features/runtime-widgets-manager.d.ts

@@ -0,0 +1,51 @@
+import React from "react";
+import type { Name } from "../../lib/internal-details/lib/evaluator/names.js";
+import type { IdentifierInfo, NameManager } from "../../lib/internal-details/lib/features/name-manager.js";
+import type { SbElement, SbInstance } from "@superblocksteam/library-shared/types";
+import type { ReactNode } from "react";
+export type ChildFunction = React.FunctionComponent;
+export type ChildElement = {
+    isSupportedElement: true;
+    isSbComponent: boolean;
+    value: SbInstance;
+} | {
+    isSupportedElement: false;
+    isSbComponent: false;
+    value: ChildFunction;
+};
+export type RuntimeWidgetMeta = {
+    instanceId: SbInstance;
+    sourceId: SbElement;
+    rootInstanceId: SbInstance;
+    isSbComponent: boolean;
+    isInCustomComponent: boolean;
+    node?: ReactNode;
+    scopeId?: string;
+    type?: string;
+    name?: Name;
+    props?: Record<string, unknown>;
+    children?: ChildElement[];
+    parentInstanceId?: SbInstance;
+    isUnmounted?: boolean;
+};
+declare class RuntimeWidgetsManager {
+    readonly nameManager: NameManager;
+    private widgets;
+    private sourceIdCount;
+    private sourceToInstanceIdSample;
+    constructor(nameManager: NameManager);
+    private setWidgetMeta;
+    getAnyInstanceIdForSourceId(sourceId: SbElement): `I-${string}`;
+    processRoot(params: {
+        rootIdentifier: IdentifierInfo;
+        rootProps: Record<string, unknown>;
+        rootType: string;
+        isInCustomComponent: boolean;
+        fallbackScopeId: string;
+    }): void;
+    getMeta(id: SbInstance): RuntimeWidgetMeta | undefined;
+    getSourceIdCount(sourceId: SbElement): number;
+    isChildOf(childId: SbInstance, parentId: SbInstance): boolean;
+    getClosestAncestorByType(instanceId: SbInstance, type: string): RuntimeWidgetMeta | undefined;
+}
+export default RuntimeWidgetsManager;

package/dist-types/edit-mode/features/ui-store.d.ts

@@ -0,0 +1,41 @@
+import { DragAndDropManager } from "./drag-and-drop-store.js";
+import { ResizingManager } from "./resizing-store.js";
+import type { RootStore } from "../../lib/internal-details/lib/root-store.js";
+import type { EditStore } from "../edit-store.js";
+import type { SbElement, SbInstance } from "@superblocksteam/library-shared/types";
+declare class UIStore {
+    readonly root: RootStore;
+    readonly editStore: EditStore;
+    dnd: DragAndDropManager;
+    resizing: ResizingManager;
+    private _selectedSourceIds;
+    private _selectedInstanceIds;
+    private _focusedSourceId;
+    private _focusedInstanceId;
+    private newComponentSelectPromise;
+    constructor(root: RootStore, editStore: EditStore);
+    isSourceSelected(sourceId: SbElement): boolean;
+    isInstanceSelected(instanceId: SbInstance): boolean;
+    isSourceFocused(sourceId: SbElement): boolean;
+    isInstanceFocused(instanceId: SbInstance): boolean;
+    getSelectedSourceIds(): SbElement[];
+    getSelectedInstanceIds(): SbInstance[];
+    private get focusedSourceId();
+    private get focusedInstanceId();
+    getFocusedSourceId(): SbElement | null;
+    getFocusedInstanceId(): SbInstance | null;
+    setSelectedSourceIds(sourceIds: SbElement[]): void;
+    setSelectedInstanceIds(ids: SbInstance[]): void;
+    setFocusedInstanceId(instanceId: SbInstance | null): void;
+    setFocusedSourceId(sourceId: SbElement | null): void;
+    selectWidget(instanceId: SbInstance | null): void;
+    /**
+     * This is cursed because component selection actually needs to be done by instance ids, but
+     * instance IDs are only guaranteed to be stable after the component is rendered, while source IDs
+     * are assigned by the source tracker.
+     *
+     * If _any_ other selection comes in before we select something, we will cancel this reaction
+     */
+    selectNewComponentBySourceId(sourceId: SbElement): Promise<void>;
+}
+export default UIStore;

package/dist-types/edit-mode/hooks/use-register-source-element.d.ts

@@ -0,0 +1,2 @@
+import type { SbElement } from "@superblocksteam/library-shared/types";
+export declare function useRegisterSourceElement(sourceId: SbElement): (element: HTMLElement | null) => void;

package/dist-types/edit-mode/iframe-wrappers.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+declare const Auth0Wrapper: (props: React.PropsWithChildren) => React.JSX.Element;
+declare const EmbedWrapper: (props: React.PropsWithChildren) => React.JSX.Element;
+export { EmbedWrapper, Auth0Wrapper };

package/dist-types/edit-mode/interaction-add-section-button.d.ts

@@ -0,0 +1,4 @@
+import type { SbInstance } from "@superblocksteam/library-shared/types";
+export declare const AddSectionButtons: ({ sectionInstanceId, }: {
+    sectionInstanceId: SbInstance;
+}) => import("react").JSX.Element | null;

package/dist-types/edit-mode/interaction-layer.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import type { SbInstance } from "@superblocksteam/library-shared/types";
+export type RootType = "SbPage" | "SbModal" | "SbSlideout";
+declare const InteractionLayer: ((props: {
+    rootType: RootType;
+    rootInstanceId: SbInstance;
+    rootName?: string;
+}) => React.JSX.Element | null) & {
+    displayName: string;
+};
+export default InteractionLayer;

package/dist-types/edit-mode/interaction-rect-handles.d.ts

@@ -0,0 +1,7 @@
+import type { SbInstance } from "@superblocksteam/library-shared/types";
+export declare const NotifierTooltipBody: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const InteractionRectHandles: (props: {
+    instanceId: SbInstance;
+    isDragging: boolean;
+    selectionType: "SELECTED" | "FOCUSED" | "ERROR";
+}) => import("react").JSX.Element;

package/dist-types/edit-mode/interaction-rect-name-pill.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import type { SbInstance } from "@superblocksteam/library-shared/types";
+declare const NamePill: ((props: {
+    instanceId: SbInstance;
+    displayName: string;
+    anyIsDragging: boolean;
+    enableDragging: boolean;
+    type: "SELECTED" | "FOCUSED" | "ERROR";
+    isVisible?: boolean;
+}) => React.JSX.Element) & {
+    displayName: string;
+};
+export default NamePill;

package/dist-types/edit-mode/interaction-rect.d.ts

@@ -0,0 +1,44 @@
+import React from "react";
+import type { RootType } from "./interaction-layer.jsx";
+import type { IdentifierInfo } from "../lib/internal-details/lib/features/name-manager.js";
+import type { SbElement, SbInstance } from "@superblocksteam/library-shared/types";
+type SelectionInfo = {
+    sourceId: SbElement;
+    instanceId: SbInstance;
+    displayName: string;
+    selectionType: "SELECTED" | "FOCUSED";
+    type: string | undefined;
+    isVisible?: boolean;
+};
+export declare const isWidgetInCurrentLayer: ({ instanceId, rootType, rootInstanceId, }: {
+    instanceId: SbInstance;
+    rootType: RootType;
+    rootInstanceId: SbInstance;
+}) => boolean;
+export declare const useWidgetErrors: (params: {
+    widgetScopesToNamesToIds: Record<string, Record<string, Record<SbInstance, IdentifierInfo>>>;
+    rootType: RootType;
+    rootInstanceId: SbInstance;
+    scopeId: string;
+}) => Record<SbInstance, {
+    name: string;
+    error: string;
+}>;
+export declare const useSelectionElements: (params: {
+    focusedSourceId: SbElement | null;
+    selectedSourceIds: SbElement[];
+    focusedInstanceId: SbInstance | null;
+    selectedInstanceIds: SbInstance[];
+    rootType: RootType;
+    rootId: SbInstance;
+}) => SelectionInfo[];
+export declare const InteractionRect: (props: {
+    displayName: string;
+    isDragging: boolean;
+    instanceId: SbInstance;
+    selectionType: "SELECTED" | "FOCUSED" | "ERROR";
+    hideRectBorder?: boolean;
+    isVisible?: boolean;
+    type?: string;
+}) => React.JSX.Element;
+export {};

package/dist-types/edit-mode/interaction-utils.d.ts

@@ -0,0 +1,3 @@
+import type { SbInstance } from "@superblocksteam/library-shared/types";
+export declare const getBoundingBoxForWidget: (instanceId: SbInstance) => DOMRect | undefined;
+export declare const getWidgetNode: (instanceId: SbInstance) => HTMLElement | null;

package/dist-types/edit-mode/mobx-sync/create-patch.d.ts

@@ -0,0 +1,2 @@
+import type { MobXPatch } from "@superblocksteam/library-shared/types";
+export declare const microPatches: (oldValue: any, newValue: any, baseStr: string) => MobXPatch[];

package/dist-types/edit-mode/mobx-sync/deep-observe.d.ts

@@ -0,0 +1,24 @@
+import type { IObjectDidChange, IArrayDidChange, IMapDidChange } from "mobx";
+export type IDisposer = () => void;
+type IChange = IObjectDidChange | IArrayDidChange | IMapDidChange;
+export type ObserveListener<T> = (change: IChange, path: string, root: T) => void;
+/**
+ * Given an object, deeply observes the given object.
+ * It is like `observe` from mobx, but applied recursively, including all future children.
+ *
+ * Note that the given object cannot ever contain cycles and should be a tree.
+ *
+ * As benefit: path and root will be provided in the callback, so the signature of the listener is
+ * (change, path, root) => void
+ *
+ * The returned disposer can be invoked to clean up the listener
+ *
+ * deepObserve cannot be used on computed values.
+ *
+ * @example
+ * const disposer = deepObserve(target, (change, path) => {
+ *    console.dir(change)
+ * })
+ */
+export declare function deepObserve<T = any>(target: T, listener: ObserveListener<T>): IDisposer;
+export {};

package/dist-types/edit-mode/mobx-sync/mobx-editor-sync.d.ts

@@ -0,0 +1,23 @@
+import type { KeyToState } from "@superblocksteam/library-shared/types";
+export interface MobXEditorSyncOptions<SID extends keyof KeyToState = keyof KeyToState, OUTPUT extends KeyToState[SID] = KeyToState[SID], STORE = OUTPUT> {
+    storeId: SID & string;
+    store: STORE;
+    /**
+     * A function that takes the store and returns a view/projection of the store.
+     * This is useful for syncing only a subset of the store in a different shape.
+     */
+    projection?: (store: STORE) => OUTPUT;
+    /**
+     * When provided, only patches under these keys are forwarded.
+     * Other changes are dropped.
+     */
+    keys?: Record<keyof OUTPUT, true>;
+    /**
+     * Debounce time in milliseconds.
+     */
+    debounce?: number;
+}
+/**
+ * Syncs a mobx store to the editor automatically through postmessage
+ */
+export declare function startEditorSync<SID extends keyof KeyToState = keyof KeyToState, OUTPUT extends KeyToState[SID] = KeyToState[SID], STORE = any>(options: MobXEditorSyncOptions<SID, OUTPUT, STORE>): () => void;

package/dist-types/edit-mode/properties.d.ts

@@ -0,0 +1,13 @@
+import type { Name } from "../lib/internal-details/lib/evaluator/names.js";
+/**
+ * Gets the actual value from a PropertyInfo object.
+ * This will parse the value based on the type of property.
+ * @param property - The property to get the value from.
+ * @returns The parsed value of the property.
+ */
+export declare function getPropertyValue({ entityKey, property, name, scopeId, }: {
+    property: unknown;
+    entityKey?: string;
+    name?: Name;
+    scopeId?: string;
+}): unknown;

package/dist-types/edit-mode/resize-capabilities.d.ts

@@ -0,0 +1,5 @@
+import type { SbInstance } from "@superblocksteam/library-shared/types";
+export declare const useResizeCapabilities: (instanceId: SbInstance) => {
+    canResizeWidth: boolean;
+    canResizeHeight: boolean;
+};

package/dist-types/edit-mode/right-click-menu/right-click-menu.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import type { SbElement } from "@superblocksteam/library-shared/types";
+import type { ReactNode } from "react";
+interface RightClickMenuProps {
+    children?: ReactNode;
+    componentName: string;
+    sourceId: SbElement;
+    scopeName: string;
+}
+declare const RightClickMenuWrapper: React.FC<RightClickMenuProps & {
+    disabled?: boolean;
+}>;
+export default RightClickMenuWrapper;

package/dist-types/edit-mode/roots.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import type { IdentifierInfo } from "../lib/internal-details/lib/features/name-manager.js";
+export declare function EditorRoot(props: {
+    type: string;
+    identifier: IdentifierInfo;
+    children: any;
+    widgetProps: Record<string, unknown>;
+    [key: string]: unknown;
+}): React.JSX.Element;

package/dist-types/edit-mode/runtime-children.d.ts

@@ -0,0 +1,14 @@
+import type { ChildFunction } from "./features/runtime-widgets-manager.js";
+import type { SbInstance } from "@superblocksteam/library-shared/types";
+import type { ReactNode } from "react";
+/**
+ * Attempts to merge the children of a component with the children that should be rendered
+ * based on the current state from our drag-and-drop editor.
+ *
+ * @returns {ReactNode[]} - An array of merged and sorted React nodes.
+ */
+export declare function useRuntimeChildren(props: {
+    instanceId: SbInstance;
+    isEditing: boolean;
+    children?: ReactNode[] | ChildFunction;
+}): ReactNode[] | ChildFunction | undefined;

package/dist-types/edit-mode/sb-component-from-meta.d.ts

@@ -0,0 +1,2 @@
+import type { RuntimeWidgetMeta } from "./features/runtime-widgets-manager.js";
+export declare const makeSbComponentFromMeta: (widgetMeta: RuntimeWidgetMeta) => import("react").JSX.Element | null;

package/dist-types/edit-mode/source-update-api.d.ts

@@ -0,0 +1,24 @@
+import type { EditOperationType, EditOperations, ReparentRequest, CreateRequest, SetPropertyRequest, SetPropertiesRequest, BatchUpdateRequest, ApiUpdateRequest, AddEntityRequest, UpdateEntityRequest, UpdateThemeRequest, DeleteEntityRequest } from "@superblocksteam/library-shared/types";
+type CamelCase<S extends string> = S extends `${infer Head}-${infer Tail}` ? `${Head}${Capitalize<CamelCase<Tail>>}` : S extends `${infer Head}:${infer Tail}` ? `${Head}${Capitalize<CamelCase<Tail>>}` : S;
+type IOperationAPI = {
+    [K in EditOperationType as CamelCase<K>]: (payload: Parameters<EditOperations[K]>[0]) => Promise<ReturnType<EditOperations[K]> | undefined>;
+};
+declare class OperationAPI implements IOperationAPI {
+    private readonly serverUrl;
+    private socket;
+    constructor(serverUrl: string);
+    connect(peerId: string, userId?: string): Promise<void>;
+    editorMoveComponent: (payload: ReparentRequest) => Promise<void | undefined>;
+    editorCreateComponent: (payload: CreateRequest) => Promise<`SB-${string}` | undefined>;
+    editorSetProperty: (payload: SetPropertyRequest) => Promise<void | undefined>;
+    editorSetProperties: (payload: SetPropertiesRequest) => Promise<any>;
+    editorBatchUpdate: (payload: BatchUpdateRequest) => Promise<unknown[] | undefined>;
+    apiUpdate: (payload: ApiUpdateRequest) => Promise<import("@superblocksteam/library-shared/types").ApiUpdateResponse | undefined>;
+    editorAddEntity: (payload: AddEntityRequest) => Promise<void | undefined>;
+    editorUpdateEntity: (payload: UpdateEntityRequest) => Promise<void | undefined>;
+    editorDeleteEntity: (payload: DeleteEntityRequest) => Promise<void | undefined>;
+    editorUpdateTheme: (payload: UpdateThemeRequest) => Promise<void | undefined>;
+    ensureFilesSynced: () => Promise<string | undefined>;
+}
+declare const _default: OperationAPI;
+export default _default;