import { DSCustomElement, DSElementConstructor } from 'dry-suite';
import { Subscription } from 'rxjs';
import type { LoadingOptions } from '../types/config';
import type { TectonMessageBus } from '../types/message-bus';
import type { PlatformOutletOptions, FrameWrapperResult } from '../types/outlet';
/**
 * Factory function that creates a Tecton outlet custom element constructor.
 *
 * This function generates a custom element that serves as a container for rendering
 * content within the Tecton micro-frontend framework. The element uses Shadow DOM
 * and manages its lifecycle through RxJS observables.
 *
 * @param elementName - The tag name for the custom element (e.g., 'tecton-platform-outlet')
 * @param options - Configuration options including message bus, module ID, props, and adaptor
 * @returns A custom element constructor that can be registered with `customElements.define()`
 *
 * @example
 * const OutletElement = makeTectonElement('my-outlet', {
 *   messageBus,
 *   moduleId: 'my-module',
 *   props: [],
 *   tectonOutletAdaptor: myAdaptor,
 * });
 * customElements.define('my-outlet', OutletElement);
 */
export declare function makeTectonElement(elementName: string, { messageBus, props, moduleId, tectonOutletAdaptor, resize }: PlatformOutletOptions): DSElementConstructor;
/**
 * Higher-order function that creates a setup function for Tecton outlet elements.
 * Wraps `makeTectonElement` with `createSetupElement` from dry-suite.
 *
 * @example
 * setupTectonElement('tecton-platform-outlet', {
 *   messageBus,
 *   moduleId: '',
 *   props: [],
 *   tectonOutletAdaptor: platformAdaptor,
 * });
 */
export declare const setupTectonElement: (elementOptions: PlatformOutletOptions) => (elementName: string) => void;
/**
 * Creates and configures an iframe wrapper element for rendering external content within an outlet.
 *
 * This function handles iframe creation with security policies, form-based authentication (POST),
 * legacy iframe resizer initialization, and scroll behavior configuration.
 *
 * @param src - The URL to load in the iframe
 * @param moduleId - Unique identifier for the module, used for targeting messages
 * @param authPayload - Array of key-value pairs for form-based POST authentication
 * @param iframeTitle - Accessible title for the iframe element
 * @param maxHeight - Maximum height CSS value for the iframe
 * @param maxWidth - Maximum width CSS value for the iframe
 * @param canScroll - Whether the iframe should allow scrolling (default: false)
 * @param isFormPost - Whether to use form POST for authentication instead of URL params
 * @param additionalDomainsConfig - Additional domains to allow in the iframe's allow attribute
 * @param allowDirectivesConfig - Permission policy directives (default: ['geolocation', 'camera'])
 * @returns Object containing the wrapper element and a cleanup function
 *
 * @example
 * const { element, cleanup } = setupOutletIFrameWrapper(
 *   'https://example.com/feature',
 *   'my-module-id',
 *   [{ key: 'token', value: 'abc123' }],
 *   'My Feature',
 *   '500px',
 *   '100%',
 *   true
 * );
 * shadowRoot.appendChild(element);
 * // Later, when cleaning up:
 * cleanup();
 */
export declare function setupOutletIFrameWrapper(src: string, moduleId: string, authPayload: {
    key: string;
    value: string;
}[], iframeTitle: string, maxHeight: string, maxWidth: string, canScroll?: boolean, isFormPost?: boolean, additionalDomainsConfig?: string[] | undefined, allowDirectivesConfig?: string[] | undefined): FrameWrapperResult;
/**
 * Builds an array of loading indicator elements organized by rows.
 *
 * When `loadingOptions` is provided with loaders configuration, creates custom loading
 * elements with the specified shapes, types, and styles. Otherwise, creates a single
 * default spinner loader.
 *
 * @param loadingOptions - Optional configuration for custom loading indicators
 * @returns A 2D array of loader elements, where each inner array represents a row
 *
 * @example Default spinner
 * const loaders = buildLoaders();
 * // loaders = [[<q2-loading>]]
 *
 * // Custom skeleton loaders
 * const loaders = buildLoaders({
 *   loaders: [
 *     { row: 1, shape: 'rectangle', type: 'skeleton' },
 *     { row: 1, shape: 'circle', type: 'skeleton' },
 *     { row: 2, shape: 'rectangle', type: 'skeleton' },
 *   ]
 * });
 * // loaders = [[rect, circle], [rect]]
 */
export declare function buildLoaders(loadingOptions?: LoadingOptions): DSCustomElement[][];
/**
 * Creates a loading wrapper element with loaders based on loadingOptions configuration.
 *
 * Used for dynamically creating loading wrappers when `setFetching` receives `LoadingOptions`.
 * The wrapper is configured with the appropriate slot, classes, and minimum height.
 *
 * @param loadingOptions - Optional configuration for custom loading indicators
 * @param minHeight - Minimum height CSS value for the wrapper (default: '0px')
 * @returns A configured div element containing the loading indicators
 *
 * @example
 * const wrapper = createLoadingWrapperElement(
 *   { loaders: [{ row: 1, shape: 'rectangle', type: 'skeleton' }] },
 *   '100px'
 * );
 * shadowRoot.appendChild(wrapper);
 */
export declare function createLoadingWrapperElement(loadingOptions?: LoadingOptions, minHeight?: string): HTMLElement;
/**
 * Sets up a message bus listener to respond to outlet information requests.
 *
 * When a `requestOutletInfo` message is received for this outlet's module ID,
 * responds with the iframe's bounding client rect if it has non-zero dimensions.
 *
 * @param messageBus - Message bus for platform/feature communication
 * @param getModuleId - Function that returns the current module ID
 * @param getContent - Function that returns the outlet's DOM elements and configuration
 * @returns An RxJS Subscription that can be unsubscribed to stop listening
 *
 * @example
 * const subscription = setupOutletInfo(
 *   messageBus,
 *   () => moduleId,
 *   () => ({ loaderWrapper, iframeEl, minHeight })
 * );
 * // Later, to clean up:
 * subscription.unsubscribe();
 */
export declare function setupOutletInfo(messageBus: TectonMessageBus, getModuleId: () => string | undefined, getContent: () => {
    loaderWrapper: HTMLDivElement;
    iframeEl: HTMLIFrameElement;
    minHeight: string;
}): Subscription;
/**
 * Sets up a message bus listener to handle loading state changes for an outlet.
 *
 * Listens for `setFetching` messages and toggles visibility between the loading wrapper
 * and iframe based on the fetching state. Supports three modes:
 * - `false`: Hide loading UI, show iframe
 * - `true`: Show loading UI (using module config or default), hide iframe
 * - `LoadingOptions`: Create and show custom loading UI from provided options
 *
 * @param messageBus - Message bus for platform/feature communication
 * @param getModuleId - Function that returns the current module ID
 * @param getContent - Function that returns the outlet's DOM elements and configuration
 * @param getModuleLoadingOptions - Optional function that returns module-level loading configuration
 * @param getShadowRoot - Optional function that returns the shadow root for custom loader injection
 * @returns An RxJS Subscription that can be unsubscribed to stop listening
 *
 * @example
 * const subscription = setupOutletIFrameLoading(
 *   messageBus,
 *   () => moduleId,
 *   () => ({ loaderWrapper, iframeEl, minHeight: '100px' }),
 *   () => moduleConfig?.loadingOptions,
 *   () => element.shadowRoot
 * );
 */
export declare function setupOutletIFrameLoading(messageBus: TectonMessageBus, getModuleId: () => string | undefined, getContent: () => {
    loaderWrapper: HTMLDivElement;
    iframeEl: HTMLIFrameElement;
    minHeight: string;
}, getModuleLoadingOptions?: () => LoadingOptions | undefined, getShadowRoot?: () => ShadowRoot | null): Subscription;
/**
 * Sets up a message bus listener to handle iframe title updates.
 *
 * Listens for `setTitle` messages and updates the iframe's title attribute
 * for accessibility purposes.
 *
 * @param messageBus - Message bus for platform/feature communication
 * @param getModuleId - Function that returns the current module ID
 * @param getContent - Function that returns the outlet's DOM elements and configuration
 * @returns An RxJS Subscription that can be unsubscribed to stop listening
 *
 * @example
 * const subscription = setupOutletSetTitleListener(
 *   messageBus,
 *   () => moduleId,
 *   () => ({ loaderWrapper, iframeEl, minHeight })
 * );
 */
export declare function setupOutletSetTitleListener(messageBus: TectonMessageBus, getModuleId: () => string | undefined, getContent: () => {
    loaderWrapper: HTMLDivElement;
    iframeEl: HTMLIFrameElement;
    minHeight: string;
}): Subscription;
/**
 * Sets up listeners for iframe resize messages from both legacy and modern sources.
 *
 * Handles two resize message formats:
 * - **v1 (legacy)**: Window postMessage with `[iFrameSizer]` prefix format
 * - **v2 (modern)**: Message bus `resizeIframe` messages
 *
 * When a resize message is received, updates the iframe height and optionally
 * calls the resize callback.
 *
 * @param messageBus - Message bus for platform/feature communication
 * @param getModuleId - Function that returns the current module ID
 * @param getContent - Function that returns the outlet's DOM elements and configuration
 * @param resize - Optional callback invoked after the iframe is resized
 * @returns An RxJS Subscription that can be unsubscribed to stop listening
 *
 * @example
 * const subscription = setupOutletIFrameResizer(
 *   messageBus,
 *   () => moduleId,
 *   () => ({ loaderWrapper, iframeEl, minHeight }),
 *   () => console.log('Iframe resized')
 * );
 */
export declare function setupOutletIFrameResizer(messageBus: TectonMessageBus, getModuleId: () => string | undefined, getContent: () => {
    loaderWrapper: HTMLDivElement;
    iframeEl: HTMLIFrameElement;
    minHeight: string;
}, resize?: () => void): Subscription;
/**
 * Gets the value of the `base-class` attribute with spaces encoded as `%7C`.
 *
 * This encoding is necessary because Tornado (the backend server) converts `%20` to literal
 * spaces in requests, which breaks URL parsing. The `connect` method reverses this encoding
 * by converting `%7C` back to spaces.
 *
 * @param element - The HTML element to read the base-class attribute from
 * @returns The base-class value with spaces replaced by `%7C`, or empty string if not set
 *
 * @example
 * <my-outlet base-class="primary dark"></my-outlet>
 *
 * getBaseClass(element); // Returns "primary%7Cdark"
 */
export declare function getBaseClass(element: HTMLElement): string;
/**
 * Checks whether the element has the `beta` attribute enabled.
 *
 * The beta attribute can be set as a boolean attribute (presence indicates true)
 * or as an explicit string value.
 *
 * @param element - The HTML element to check for the beta attribute
 * @returns `true` if the beta attribute is present (empty string) or set to "true", otherwise `false`
 *
 * @example
 * <my-outlet beta></my-outlet>
 *
 * isBeta(element); // Returns true
 *
 * // <my-outlet beta="true"></my-outlet>
 * isBeta(element); // Returns true
 *
 * // <my-outlet></my-outlet>
 * isBeta(element); // Returns false
 */
export declare function isBeta(element: HTMLElement): boolean;
//# sourceMappingURL=tecton-outlet-base.d.ts.map