@syntrologie/runtime-sdk 0.2.21 → 1.0.0

package/dist/surfaces/Surfaces.js

@@ -0,0 +1,361 @@
+/**
+ * Surfaces
+ *
+ * Managed surface system for rendering UI into named slots.
+ * Handles layout, stacking, animations, and priority-based arbitration.
+ */
+import { sanitizeWithFallback } from '../hostPatcher/core/sanitizer';
+import { applyStaticSlotStyles, setupAdjacentPositioning, setupInlinePositioning, playEnterAnimation, playExitAnimation, createSurfaceContainer, getSlotZIndex, } from './positioning';
+import { getSlotType, getSlotAnchorId } from './types';
+/** Counter for generating unique mount IDs */
+let mountIdCounter = 0;
+/**
+ * Create a Surfaces instance.
+ */
+export function createSurfaces(options) {
+    const { overlayRoot, eventBus, anchorResolver, defaultAnimation = 'fade', widgetRegistry, } = options;
+    /** Map of current mounts by slot */
+    const mounts = new Map();
+    /** Map of mount counts by slot (for stats) */
+    const mountCounts = new Map();
+    /** Map of state change callbacks by slot */
+    const stateCallbacks = new Map();
+    /**
+     * Generate a unique mount ID.
+     */
+    function generateMountId() {
+        return `mount-${++mountIdCounter}`;
+    }
+    /**
+     * Publish an event to the EventBus if available.
+     */
+    function publishEvent(name, props) {
+        if (eventBus) {
+            eventBus.publish(name, props);
+        }
+    }
+    /**
+     * Notify state change callbacks for a slot.
+     */
+    function notifyStateChange(slot) {
+        const callbacks = stateCallbacks.get(slot);
+        if (callbacks) {
+            const state = getState(slot);
+            for (const callback of callbacks) {
+                try {
+                    callback(state);
+                }
+                catch (error) {
+                    console.error('[Surfaces] State callback error:', error);
+                }
+            }
+        }
+    }
+    /** Track mounted widget handles for cleanup */
+    const widgetHandles = new Map();
+    /**
+     * Render content into a container.
+     */
+    function renderContent(container, content, mountId) {
+        switch (content.type) {
+            case 'html':
+                container.innerHTML = sanitizeWithFallback(content.content);
+                return undefined;
+            case 'widget': {
+                // Use widget registry if available
+                if (widgetRegistry && widgetRegistry.has(content.widgetId)) {
+                    const handle = widgetRegistry.mount(content.widgetId, container, content.config);
+                    if (mountId) {
+                        widgetHandles.set(mountId, handle);
+                    }
+                    return () => {
+                        handle.unmount();
+                        if (mountId) {
+                            widgetHandles.delete(mountId);
+                        }
+                    };
+                }
+                // Fallback: create a placeholder if widget not found
+                console.warn(`[Surfaces] Widget not found: ${content.widgetId}`);
+                container.innerHTML = `<div data-widget-id="${content.widgetId}" data-widget-missing="true">Widget: ${content.widgetId}</div>`;
+                return undefined;
+            }
+            case 'custom':
+                return content.mount(container);
+            case 'react':
+                // React rendering would require ReactDOM
+                // For now, create a placeholder
+                container.innerHTML = `<div data-react-component>React Component</div>`;
+                return undefined;
+            default:
+                console.warn('[Surfaces] Unknown content type');
+                return undefined;
+        }
+    }
+    /**
+     * Mount content to a surface slot.
+     */
+    function mount(slot, content, opts) {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        const id = generateMountId();
+        const slotType = getSlotType(slot);
+        const priority = (_a = opts === null || opts === void 0 ? void 0 : opts.priority) !== null && _a !== void 0 ? _a : 0;
+        const animation = (_b = opts === null || opts === void 0 ? void 0 : opts.animation) !== null && _b !== void 0 ? _b : defaultAnimation;
+        const exclusive = (_c = opts === null || opts === void 0 ? void 0 : opts.exclusive) !== null && _c !== void 0 ? _c : true;
+        // Check for existing mount
+        const existingMount = mounts.get(slot);
+        if (existingMount) {
+            if (exclusive) {
+                // Priority-based arbitration
+                if (existingMount.options.priority > priority) {
+                    throw new Error(`Slot ${slot} is occupied by higher priority content (${existingMount.options.priority} > ${priority})`);
+                }
+                // Unmount existing content
+                unmountEntry(existingMount);
+            }
+        }
+        // Create container
+        const container = createSurfaceContainer(slot, id);
+        container.style.zIndex = String(getSlotZIndex(slot));
+        // Set up positioning based on slot type
+        let positionCleanup;
+        if (slotType === 'static') {
+            applyStaticSlotStyles(container, slot, opts === null || opts === void 0 ? void 0 : opts.constraints);
+            overlayRoot.appendChild(container);
+        }
+        else if (slotType === 'inline') {
+            const anchorId = getSlotAnchorId(slot);
+            if (!anchorId) {
+                throw new Error(`Invalid inline slot: ${slot}`);
+            }
+            if (!anchorResolver) {
+                throw new Error('Anchor resolver required for inline slots');
+            }
+            const anchorEl = anchorResolver(anchorId);
+            if (!anchorEl) {
+                throw new Error(`Anchor not found for inline slot: ${anchorId}`);
+            }
+            positionCleanup = setupInlinePositioning(container, anchorEl);
+        }
+        else if (slotType === 'adjacent') {
+            const anchorId = getSlotAnchorId(slot);
+            if (!anchorId) {
+                throw new Error(`Invalid adjacent slot: ${slot}`);
+            }
+            if (!anchorResolver) {
+                throw new Error('Anchor resolver required for adjacent slots');
+            }
+            const anchorEl = anchorResolver(anchorId);
+            if (!anchorEl) {
+                throw new Error(`Anchor not found for adjacent slot: ${anchorId}`);
+            }
+            overlayRoot.appendChild(container);
+            positionCleanup = setupAdjacentPositioning(container, anchorEl, (_d = opts === null || opts === void 0 ? void 0 : opts.position) !== null && _d !== void 0 ? _d : { placement: 'bottom' });
+        }
+        // Render content
+        const contentCleanup = renderContent(container, content, id);
+        // Play enter animation
+        playEnterAnimation(container, animation);
+        // Create internal entry
+        const entry = {
+            id,
+            slot,
+            content,
+            options: {
+                priority,
+                exclusive,
+                animation,
+                position: (_e = opts === null || opts === void 0 ? void 0 : opts.position) !== null && _e !== void 0 ? _e : { placement: 'auto' },
+                constraints: (_f = opts === null || opts === void 0 ? void 0 : opts.constraints) !== null && _f !== void 0 ? _f : {},
+                adaptiveId: opts === null || opts === void 0 ? void 0 : opts.adaptiveId,
+                autoUnmountOnRouteChange: (_g = opts === null || opts === void 0 ? void 0 : opts.autoUnmountOnRouteChange) !== null && _g !== void 0 ? _g : true,
+            },
+            container,
+            cleanup: () => {
+                positionCleanup === null || positionCleanup === void 0 ? void 0 : positionCleanup();
+                contentCleanup === null || contentCleanup === void 0 ? void 0 : contentCleanup();
+            },
+            mountedAt: Date.now(),
+        };
+        // Store mount
+        mounts.set(slot, entry);
+        // Update mount count
+        mountCounts.set(slot, ((_h = mountCounts.get(slot)) !== null && _h !== void 0 ? _h : 0) + 1);
+        // Publish event
+        publishEvent('surface.mounted', {
+            slot,
+            id,
+            adaptiveId: opts === null || opts === void 0 ? void 0 : opts.adaptiveId,
+        });
+        // Notify state change
+        notifyStateChange(slot);
+        // Create and return handle
+        const handle = {
+            id,
+            update(newContent) {
+                const entry = mounts.get(slot);
+                if (!entry || entry.id !== id) {
+                    throw new Error('Mount no longer active');
+                }
+                // Clean up existing widget handle if present
+                const existingWidgetHandle = widgetHandles.get(id);
+                if (existingWidgetHandle) {
+                    // If content is a widget and we have an update method, use it
+                    if (newContent.type === 'widget') {
+                        existingWidgetHandle.update(newContent.config);
+                        entry.content = newContent;
+                        return;
+                    }
+                    // Otherwise, unmount the old widget
+                    existingWidgetHandle.unmount();
+                    widgetHandles.delete(id);
+                }
+                // Clear existing content
+                entry.container.innerHTML = '';
+                // Render new content
+                const newCleanup = renderContent(entry.container, newContent, id);
+                entry.content = newContent;
+                // Update cleanup if needed
+                if (newCleanup) {
+                    const oldCleanup = entry.cleanup;
+                    entry.cleanup = () => {
+                        oldCleanup === null || oldCleanup === void 0 ? void 0 : oldCleanup();
+                        newCleanup();
+                    };
+                }
+            },
+            setOptions(newOpts) {
+                const entry = mounts.get(slot);
+                if (!entry || entry.id !== id) {
+                    throw new Error('Mount no longer active');
+                }
+                // Update options
+                if (newOpts.priority !== undefined) {
+                    entry.options.priority = newOpts.priority;
+                }
+                if (newOpts.animation !== undefined) {
+                    entry.options.animation = newOpts.animation;
+                }
+                // Re-apply constraints if changed
+                if (newOpts.constraints && slotType === 'static') {
+                    if (newOpts.constraints.maxWidth)
+                        entry.container.style.maxWidth = newOpts.constraints.maxWidth;
+                    if (newOpts.constraints.maxHeight)
+                        entry.container.style.maxHeight = newOpts.constraints.maxHeight;
+                    if (newOpts.constraints.minWidth)
+                        entry.container.style.minWidth = newOpts.constraints.minWidth;
+                    if (newOpts.constraints.minHeight)
+                        entry.container.style.minHeight = newOpts.constraints.minHeight;
+                }
+                notifyStateChange(slot);
+            },
+            async unmount() {
+                const entry = mounts.get(slot);
+                if (!entry || entry.id !== id)
+                    return;
+                await unmountEntry(entry);
+            },
+            isMounted() {
+                const entry = mounts.get(slot);
+                return (entry === null || entry === void 0 ? void 0 : entry.id) === id;
+            },
+            getContainer() {
+                const entry = mounts.get(slot);
+                return (entry === null || entry === void 0 ? void 0 : entry.id) === id ? entry.container : null;
+            },
+        };
+        return handle;
+    }
+    /**
+     * Unmount an entry with animation.
+     */
+    async function unmountEntry(entry) {
+        var _a;
+        // Play exit animation
+        await playExitAnimation(entry.container, entry.options.animation);
+        // Run cleanup
+        (_a = entry.cleanup) === null || _a === void 0 ? void 0 : _a.call(entry);
+        // Remove container
+        entry.container.remove();
+        // Remove from mounts
+        mounts.delete(entry.slot);
+        // Publish event
+        publishEvent('surface.unmounted', {
+            slot: entry.slot,
+            id: entry.id,
+        });
+        // Notify state change
+        notifyStateChange(entry.slot);
+    }
+    /**
+     * Get the current state of a slot.
+     */
+    function getState(slot) {
+        var _a;
+        const entry = mounts.get(slot);
+        return {
+            slot,
+            occupied: !!entry,
+            currentPriority: entry === null || entry === void 0 ? void 0 : entry.options.priority,
+            currentAdaptiveId: entry === null || entry === void 0 ? void 0 : entry.options.adaptiveId,
+            mountCount: (_a = mountCounts.get(slot)) !== null && _a !== void 0 ? _a : 0,
+            currentMountId: entry === null || entry === void 0 ? void 0 : entry.id,
+        };
+    }
+    /**
+     * Subscribe to state changes for a slot.
+     */
+    function onStateChange(slot, fn) {
+        let callbacks = stateCallbacks.get(slot);
+        if (!callbacks) {
+            callbacks = new Set();
+            stateCallbacks.set(slot, callbacks);
+        }
+        callbacks.add(fn);
+        return () => {
+            callbacks === null || callbacks === void 0 ? void 0 : callbacks.delete(fn);
+            if ((callbacks === null || callbacks === void 0 ? void 0 : callbacks.size) === 0) {
+                stateCallbacks.delete(slot);
+            }
+        };
+    }
+    /**
+     * Check if content can be mounted to a slot.
+     */
+    function canMount(slot, priority) {
+        const existingMount = mounts.get(slot);
+        if (!existingMount)
+            return true;
+        // Check priority if provided
+        if (priority !== undefined) {
+            return priority >= existingMount.options.priority;
+        }
+        return false;
+    }
+    /**
+     * Clean up all mounted surfaces.
+     */
+    function destroy() {
+        var _a;
+        // Unmount all surfaces
+        for (const entry of mounts.values()) {
+            try {
+                (_a = entry.cleanup) === null || _a === void 0 ? void 0 : _a.call(entry);
+                entry.container.remove();
+            }
+            catch (error) {
+                console.error('[Surfaces] Error during cleanup:', error);
+            }
+        }
+        mounts.clear();
+        stateCallbacks.clear();
+    }
+    return {
+        mount,
+        getState,
+        onStateChange,
+        canMount,
+        destroy,
+    };
+}
+//# sourceMappingURL=Surfaces.js.map

package/dist/surfaces/Surfaces.js.map

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

package/dist/surfaces/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Surfaces Module
+ *
+ * Managed surface system for rendering UI into named slots.
+ */
+export { createSurfaces } from './Surfaces';
+export type { Surfaces, SurfacesOptions, SurfacesWidgetRegistry, MountHandle, SurfaceState, SurfaceChangeCallback, SurfaceSlot, StaticSurfaceSlot, InlineSurfaceSlot, AdjacentSurfaceSlot, RenderableContent, ReactContent, HtmlContent, WidgetContent, CustomContent, MountOptions, PositionConfig, MountConstraints, AnimationType, } from './types';
+export { getSlotType, getSlotAnchorId } from './types';
+export { STATIC_SLOT_STYLES, ANIMATION_KEYFRAMES, applyStaticSlotStyles, setupAdjacentPositioning, setupInlinePositioning, playEnterAnimation, playExitAnimation, createSurfaceContainer, getSlotZIndex, } from './positioning';

package/dist/surfaces/index.js

@@ -0,0 +1,12 @@
+/**
+ * Surfaces Module
+ *
+ * Managed surface system for rendering UI into named slots.
+ */
+// Main factory
+export { createSurfaces } from './Surfaces';
+// Utilities
+export { getSlotType, getSlotAnchorId } from './types';
+// Positioning (for advanced usage)
+export { STATIC_SLOT_STYLES, ANIMATION_KEYFRAMES, applyStaticSlotStyles, setupAdjacentPositioning, setupInlinePositioning, playEnterAnimation, playExitAnimation, createSurfaceContainer, getSlotZIndex, } from './positioning';
+//# sourceMappingURL=index.js.map

package/dist/surfaces/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/surfaces/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,eAAe;AACf,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAgC5C,YAAY;AACZ,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAEvD,mCAAmC;AACnC,OAAO,EACL,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,wBAAwB,EACxB,sBAAsB,EACtB,kBAAkB,EAClB,iBAAiB,EACjB,sBAAsB,EACtB,aAAa,GACd,MAAM,eAAe,CAAC"}

package/dist/surfaces/positioning.d.ts

@@ -0,0 +1,50 @@
+/**
+ * Surfaces Positioning
+ *
+ * Handles positioning for different slot types using CSS for static slots
+ * and Floating UI for adjacent slots.
+ */
+import type { SurfaceSlot, StaticSurfaceSlot, PositionConfig, MountConstraints, AnimationType } from './types';
+/**
+ * CSS styles for static surface slots.
+ */
+export declare const STATIC_SLOT_STYLES: Record<StaticSurfaceSlot, Record<string, string>>;
+/**
+ * Animation keyframes for different animation types.
+ */
+export declare const ANIMATION_KEYFRAMES: Record<AnimationType, Keyframe[]>;
+/**
+ * Animation options.
+ */
+export declare const ANIMATION_OPTIONS: KeyframeAnimationOptions;
+/**
+ * Apply static slot positioning to an element.
+ */
+export declare function applyStaticSlotStyles(element: HTMLElement, slot: StaticSurfaceSlot, constraints?: MountConstraints): void;
+/**
+ * Set up adjacent slot positioning using Floating UI.
+ * Returns a cleanup function.
+ */
+export declare function setupAdjacentPositioning(container: HTMLElement, anchorEl: HTMLElement, config: PositionConfig): () => void;
+/**
+ * Set up inline slot positioning.
+ * Inline slots render content inside the anchor element.
+ */
+export declare function setupInlinePositioning(container: HTMLElement, anchorEl: HTMLElement, position?: 'prepend' | 'append'): () => void;
+/**
+ * Play enter animation on an element.
+ */
+export declare function playEnterAnimation(element: HTMLElement, animationType: AnimationType): Animation | null;
+/**
+ * Play exit animation on an element.
+ * Returns a promise that resolves when the animation completes.
+ */
+export declare function playExitAnimation(element: HTMLElement, animationType: AnimationType): Promise<void>;
+/**
+ * Create and style a surface container element.
+ */
+export declare function createSurfaceContainer(slot: SurfaceSlot, id: string): HTMLElement;
+/**
+ * Get the z-index for a slot type.
+ */
+export declare function getSlotZIndex(slot: SurfaceSlot): number;

package/dist/surfaces/positioning.js

@@ -0,0 +1,228 @@
+/**
+ * Surfaces Positioning
+ *
+ * Handles positioning for different slot types using CSS for static slots
+ * and Floating UI for adjacent slots.
+ */
+import { computePosition, autoUpdate, offset, flip, shift } from '@floating-ui/dom';
+import { getSlotType } from './types';
+/**
+ * CSS styles for static surface slots.
+ */
+export const STATIC_SLOT_STYLES = {
+    drawer_right: {
+        position: 'fixed',
+        top: '0',
+        right: '0',
+        bottom: '0',
+        width: '360px',
+        maxWidth: '90vw',
+    },
+    drawer_left: {
+        position: 'fixed',
+        top: '0',
+        left: '0',
+        bottom: '0',
+        width: '360px',
+        maxWidth: '90vw',
+    },
+    drawer_bottom: {
+        position: 'fixed',
+        left: '0',
+        right: '0',
+        bottom: '0',
+        maxHeight: '50vh',
+    },
+    overlay_center: {
+        position: 'fixed',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)',
+        maxWidth: '90vw',
+        maxHeight: '90vh',
+    },
+    overlay_corner_br: {
+        position: 'fixed',
+        bottom: '16px',
+        right: '16px',
+        maxWidth: '400px',
+        maxHeight: '80vh',
+    },
+    overlay_corner_bl: {
+        position: 'fixed',
+        bottom: '16px',
+        left: '16px',
+        maxWidth: '400px',
+        maxHeight: '80vh',
+    },
+    toast_top: {
+        position: 'fixed',
+        top: '16px',
+        left: '50%',
+        transform: 'translateX(-50%)',
+        maxWidth: '90vw',
+    },
+    toast_bottom: {
+        position: 'fixed',
+        bottom: '16px',
+        left: '50%',
+        transform: 'translateX(-50%)',
+        maxWidth: '90vw',
+    },
+};
+/**
+ * Animation keyframes for different animation types.
+ */
+export const ANIMATION_KEYFRAMES = {
+    fade: [{ opacity: 0 }, { opacity: 1 }],
+    slide: [
+        { opacity: 0, transform: 'translateY(10px)' },
+        { opacity: 1, transform: 'translateY(0)' },
+    ],
+    scale: [
+        { opacity: 0, transform: 'scale(0.95)' },
+        { opacity: 1, transform: 'scale(1)' },
+    ],
+    none: [],
+};
+/**
+ * Animation options.
+ */
+export const ANIMATION_OPTIONS = {
+    duration: 200,
+    easing: 'cubic-bezier(0.16, 1, 0.3, 1)',
+    fill: 'forwards',
+};
+/**
+ * Apply static slot positioning to an element.
+ */
+export function applyStaticSlotStyles(element, slot, constraints) {
+    const styles = STATIC_SLOT_STYLES[slot];
+    Object.assign(element.style, styles);
+    // Apply constraints
+    if (constraints) {
+        if (constraints.maxWidth)
+            element.style.maxWidth = constraints.maxWidth;
+        if (constraints.maxHeight)
+            element.style.maxHeight = constraints.maxHeight;
+        if (constraints.minWidth)
+            element.style.minWidth = constraints.minWidth;
+        if (constraints.minHeight)
+            element.style.minHeight = constraints.minHeight;
+    }
+}
+/**
+ * Set up adjacent slot positioning using Floating UI.
+ * Returns a cleanup function.
+ */
+export function setupAdjacentPositioning(container, anchorEl, config) {
+    const placement = config.placement === 'auto' ? 'bottom' : config.placement;
+    const middleware = [
+        offset(config.offset ? { mainAxis: config.offset.y, crossAxis: config.offset.x } : 8),
+    ];
+    if (config.flip !== false) {
+        middleware.push(flip());
+    }
+    if (config.shift !== false) {
+        middleware.push(shift({ padding: 8 }));
+    }
+    // Set initial position style
+    container.style.position = 'absolute';
+    container.style.zIndex = '2147483646';
+    const cleanup = autoUpdate(anchorEl, container, async () => {
+        const { x, y, strategy } = await computePosition(anchorEl, container, {
+            placement,
+            middleware,
+        });
+        Object.assign(container.style, {
+            position: strategy,
+            left: `${x}px`,
+            top: `${y}px`,
+        });
+    });
+    return cleanup;
+}
+/**
+ * Set up inline slot positioning.
+ * Inline slots render content inside the anchor element.
+ */
+export function setupInlinePositioning(container, anchorEl, position = 'append') {
+    // Reset container positioning (inline is flow-based)
+    container.style.position = 'relative';
+    container.style.display = 'inline-block';
+    if (position === 'prepend') {
+        anchorEl.insertBefore(container, anchorEl.firstChild);
+    }
+    else {
+        anchorEl.appendChild(container);
+    }
+    return () => {
+        container.remove();
+    };
+}
+/**
+ * Play enter animation on an element.
+ */
+export function playEnterAnimation(element, animationType) {
+    if (animationType === 'none' || ANIMATION_KEYFRAMES[animationType].length === 0) {
+        return null;
+    }
+    return element.animate(ANIMATION_KEYFRAMES[animationType], ANIMATION_OPTIONS);
+}
+/**
+ * Play exit animation on an element.
+ * Returns a promise that resolves when the animation completes.
+ */
+export function playExitAnimation(element, animationType) {
+    if (animationType === 'none' || ANIMATION_KEYFRAMES[animationType].length === 0) {
+        return Promise.resolve();
+    }
+    const keyframes = [...ANIMATION_KEYFRAMES[animationType]].reverse();
+    const animation = element.animate(keyframes, ANIMATION_OPTIONS);
+    return new Promise((resolve) => {
+        animation.onfinish = () => resolve();
+        animation.oncancel = () => resolve();
+    });
+}
+/**
+ * Create and style a surface container element.
+ */
+export function createSurfaceContainer(slot, id) {
+    const container = document.createElement('div');
+    container.setAttribute('data-syntro-surface', slot);
+    container.setAttribute('data-syntro-mount-id', id);
+    container.className = 'syntro-surface';
+    // Base styles for all surfaces
+    Object.assign(container.style, {
+        pointerEvents: 'auto',
+        boxSizing: 'border-box',
+        overflow: 'auto',
+    });
+    return container;
+}
+/**
+ * Get the z-index for a slot type.
+ */
+export function getSlotZIndex(slot) {
+    const type = getSlotType(slot);
+    switch (type) {
+        case 'static':
+            // Drawers and overlays
+            if (slot.startsWith('drawer'))
+                return 2147483640;
+            if (slot.startsWith('overlay'))
+                return 2147483642;
+            if (slot.startsWith('toast'))
+                return 2147483644;
+            return 2147483640;
+        case 'inline':
+            // Inline content doesn't need high z-index
+            return 1;
+        case 'adjacent':
+            // Adjacent content needs to be above page content
+            return 2147483638;
+        default:
+            return 2147483640;
+    }
+}
+//# sourceMappingURL=positioning.js.map