@atlaskit/editor-plugin-card/dist/types/nodeviews/embedCard.d.ts

Card plugin for @atlaskit/editor-core

import React from 'react';
import type { ComponentProps } from 'react';
import type { IntlShape } from 'react-intl';
import type { Layout as RichMediaLayout } from '@atlaskit/adf-schema/rich-media-common';
import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
import ReactNodeView from '@atlaskit/editor-common/react-node-view';
import type { getPosHandler } from '@atlaskit/editor-common/react-node-view/types';
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types/next-editor-plugin';
import type { PMPluginFactoryParams } from '@atlaskit/editor-common/types/plugin-factory';
import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
import type { CardContext } from '@atlaskit/link-provider/types';
import type { cardPlugin } from '../index';
import type { SmartCardProps } from './genericCard';
/**
 * Returns a forced aspect ratio for URLs that have a known canvas shape,
 * overriding the generic value returned by the link resolver.
 * Add new URL checks here as more content types get fixed aspect ratios.
 */
/**
 * Returns a forced aspect ratio for URLs that have a known canvas shape,
 * or `undefined` to use the default resolver-provided ratio.
 *
 * @internal Exported for testing only.
 */
export declare const getAspectRatioForUrl: (url: string | undefined) => number | undefined;
export type EmbedCardState = {
    hasPreview: boolean;
    initialAspectRatio?: number;
    liveHeight?: number;
};
export declare class EmbedCardComponent extends React.PureComponent<SmartCardProps & {
    id: string;
}, EmbedCardState> {
    private scrollContainer?;
    private embedIframeRef;
    private resolvedCardData?;
    componentDidUpdate(prevProps: Readonly<SmartCardProps & {
        id: string;
    }>): void;
    constructor(props: SmartCardProps & {
        id: string;
    });
    state: EmbedCardState;
    private getPosSafely;
    onResolve: (data: {
        aspectRatio?: number;
        title?: string;
        url?: string;
    }) => void;
    private resolveCard;
    private registerResolvedCard;
    updateSize: (pctWidth: number | null, layout: RichMediaLayout) => true | undefined;
    /**
     * Defers line-length measurement until the embed card DOM has fully rendered.
     *
     * When put embed in the expand, reload the page and open that expand, the embed was collapsed.
     * Because the `.rich-media-item` can temporarily report `offsetWidth = 1`, as proportional width styles have not been applied yet.
     * Measuring at that moment would cache the bogus width and break resize calculations.
     * Scheduling a measurement on the next animation frame ensures layout has
     * settled. We then force the node view to re-render so `getLineLength`
     * re-runs and captures the correct width.
     */
    private scheduleLineLengthRemeasureRaf;
    private getLineLength;
    /**
     * Even though render is capable of listening and reacting to iframely wrapper iframe sent `resize` events
     * it's good idea to store latest actual height in ADF, so that when renderer (well, editor as well) is loading
     * we will show embed window of appropriate size and avoid unnecessary content jumping.
     */
    saveOriginalDimensionsAttributes: (height: number, width: number | undefined) => void;
    onHeightUpdate: (height: number) => void;
    onError: ({ err }: {
        err?: Error;
    }) => void;
    componentWillUnmount(): void;
    private removeCardDispatched;
    private removeCard;
    private removeCardRegistration;
    render(): React.JSX.Element;
}
export declare const EmbedOrBlockCardComponent: (props: ComponentProps<typeof EmbedCardComponent>) => React.JSX.Element;
export declare const isPreviewPanelResponsivenessEnabled: () => boolean;
export type EmbedCardNodeViewProps = Pick<SmartCardProps, 'eventDispatcher' | 'allowResizing' | 'fullWidthMode' | 'dispatchAnalyticsEvent' | 'pluginInjectionApi' | 'actionOptions' | 'onClickCallback' | 'isPageSSRed' | 'provider' | 'CompetitorPrompt' | 'intl' | 'smartCardContext'>;
export declare class EmbedCard extends ReactNodeView<EmbedCardNodeViewProps> {
    private id;
    private preservationSlot?;
    unsubscribe: (() => void) | undefined;
    viewShouldUpdate(nextNode: PMNode): boolean;
    createDomRef(): HTMLElement;
    setDomAttrs(node: PMNode, element: HTMLElement): void;
    attachPreservationSlot(slot: HTMLElement, getPos: getPosHandler): void;
    canReuseWith(provider: EmbedCardNodeViewProps['provider'], eventDispatcher: EventDispatcher): boolean;
    private updateContentEditable;
    render(): React.JSX.Element;
    /**
     * Prevent ProseMirror from handling drag events on the smart-element-link,
     * allowing native drag to work so SmartLinkDraggable can intercept it.
     * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
     */
    stopEvent(event: Event): boolean;
    destroy(): void;
}
export interface EmbedCardNodeViewProperties {
    actionOptions: EmbedCardNodeViewProps['actionOptions'];
    allowResizing: EmbedCardNodeViewProps['allowResizing'];
    CompetitorPrompt?: EmbedCardNodeViewProps['CompetitorPrompt'];
    fullWidthMode: EmbedCardNodeViewProps['fullWidthMode'];
    intl?: IntlShape;
    isPageSSRed: EmbedCardNodeViewProps['isPageSSRed'];
    onClickCallback: EmbedCardNodeViewProps['onClickCallback'];
    pluginInjectionApi: ExtractInjectionAPI<typeof cardPlugin> | undefined;
    pmPluginFactoryParams: PMPluginFactoryParams;
    provider: EmbedCardNodeViewProps['provider'];
    smartCardContext?: CardContext;
}
export declare const embedCardNodeView: ({ allowResizing, fullWidthMode, pmPluginFactoryParams, pluginInjectionApi, actionOptions, onClickCallback, CompetitorPrompt, isPageSSRed, provider, intl, smartCardContext, }: EmbedCardNodeViewProperties) => (node: PMNode, view: EditorView, getPos: () => number | undefined) => EmbedCard;