UNPKG

@atlaskit/editor-plugin-card

Version:

Card plugin for @atlaskit/editor-core

67 lines (66 loc) 2.57 kB
/** * @jsxRuntime classic * @jsx jsx */ import React from 'react'; import { jsx } from '@emotion/react'; import type { RichMediaLayout } from '@atlaskit/adf-schema'; import type { ResizerProps } from '@atlaskit/editor-common/ui'; import type { ResolvedPos } from '@atlaskit/editor-prosemirror/model'; type State = { offsetLeft: number; resizedPctWidth?: number; }; export type Props = Omit<ResizerProps, 'height' | 'width'> & { aspectRatio: number; height?: number; isResizeDisabled?: boolean; width?: number; }; export default class ResizableEmbedCard extends React.Component<Props, State> { static defaultProps: { aspectRatio: number; }; state: State; componentDidUpdate(prevProps: Props): void; get wrappedLayout(): boolean; /** * When returning to center layout from a wrapped/aligned layout, it might actually * be wide or full-width */ checkLayout(oldLayout: RichMediaLayout, newLayout: RichMediaLayout): void; calcNewSize: (newWidth: number, stop: boolean) => { layout: RichMediaLayout; width: number | null; }; calcUnwrappedLayout: (pct: number, width: number) => "center" | "wide" | "full-width"; get $pos(): ResolvedPos | null; /** * The maxmimum number of grid columns this node can resize to. */ get gridWidth(): number; calcOffsetLeft(): number; calcColumnLeftOffset: () => number; wrapper?: HTMLElement; get wideLayoutWidth(): number; isNestedInTable(): boolean; calcSnapPoints(): number[]; calcPxWidth: (useLayout?: RichMediaLayout) => number; get insideInlineLike(): boolean; private handleResizeStart; highlights: (newWidth: number, snapPoints: number[]) => string[] | number[]; /** * Previously height of the box was controlled with paddingTop/paddingBottom trick inside Wrapper. * It allowed height to be defined by a given percent ratio and so absolute value was defined by actual width. * Also, it was part of styled component, which was fine because it was static through out life time of component. * * Now, two things changed: * 1. If `height` is present we take it as actual height of the box, and hence we don't need * (or even can't have, due to lack of width value) paddingTop trick. * 2. Since `height` can be changing through out life time of a component, we can't have it as part of styled component, * and hence we use `style` prop. */ private getHeightDefiningComponent; render(): jsx.JSX.Element; } export {};