@atlaskit/editor-common 107.28.2 → 107.29.0

package/dist/types/types/text-formatting.d.ts

@@ -7,38 +7,38 @@ import type { INPUT_METHOD } from '../analytics';
  * @see https://product-fabric.atlassian.net/browse/ED-27496
  */
 export interface TextFormattingOptions {
-    disableSuperscriptAndSubscript?: boolean;
-    disableUnderline?: boolean;
     disableCode?: boolean;
     disableSmartTextCompletion?: boolean;
     disableStrikethrough?: boolean;
+    disableSuperscriptAndSubscript?: boolean;
+    disableUnderline?: boolean;
     responsiveToolbarMenu?: boolean;
 }
 export interface TextFormattingState {
-    isInitialised: boolean;
-    emActive?: boolean;
-    emDisabled?: boolean;
-    emHidden?: boolean;
     codeActive?: boolean;
-    codeInSelection?: boolean;
     codeDisabled?: boolean;
     codeHidden?: boolean;
-    underlineActive?: boolean;
-    underlineDisabled?: boolean;
-    underlineHidden?: boolean;
+    codeInSelection?: boolean;
+    emActive?: boolean;
+    emDisabled?: boolean;
+    emHidden?: boolean;
+    formattingIsPresent?: boolean;
+    isInitialised: boolean;
     strikeActive?: boolean;
     strikeDisabled?: boolean;
     strikeHidden?: boolean;
     strongActive?: boolean;
     strongDisabled?: boolean;
     strongHidden?: boolean;
-    superscriptActive?: boolean;
-    superscriptDisabled?: boolean;
-    superscriptHidden?: boolean;
     subscriptActive?: boolean;
     subscriptDisabled?: boolean;
     subscriptHidden?: boolean;
-    formattingIsPresent?: boolean;
+    superscriptActive?: boolean;
+    superscriptDisabled?: boolean;
+    superscriptHidden?: boolean;
+    underlineActive?: boolean;
+    underlineDisabled?: boolean;
+    underlineHidden?: boolean;
 }
 export type InputMethodToolbar = INPUT_METHOD.TOOLBAR | INPUT_METHOD.FLOATING_TB;
 export type InputMethodBasic = InputMethodToolbar | INPUT_METHOD.SHORTCUT | INPUT_METHOD.FORMATTING;

package/dist/types/types/toolbar.d.ts

@@ -45,8 +45,8 @@ export declare enum ToolbarWidthsFullPageNext {
     S = 410
 }
 export type ToolbarUiComponentFactoryParams = UiComponentFactoryParams & {
-    toolbarSize: ToolbarSize;
-    isToolbarReducedSpacing: boolean;
     isLastItem?: boolean;
+    isToolbarReducedSpacing: boolean;
+    toolbarSize: ToolbarSize;
 };
 export type ToolbarUIComponentFactory = (params: ToolbarUiComponentFactoryParams) => React.ReactElement<any> | null;

package/dist/types/types/type-ahead.d.ts

@@ -6,69 +6,53 @@ import type { TypeAheadPayload } from '../analytics/types/type-ahead';
 import type { SelectItemMode, TypeAheadAvailableNodes } from '../type-ahead';
 import type { EditorCommand } from '../types';
 type TypeAheadForceSelectProps = {
-    query: string;
-    items: Array<TypeAheadItem>;
     editorState: EditorState;
+    items: Array<TypeAheadItem>;
+    query: string;
 };
 export interface TypeAheadStats {
-    startedAt: number;
     endedAt: number;
     keyCount: {
-        arrowUp: number;
         arrowDown: number;
+        arrowUp: number;
     };
+    startedAt: number;
 }
 export type TypeAheadItemRenderProps = {
+    isSelected: boolean;
     onClick: () => void;
     onHover: () => void;
-    isSelected: boolean;
 };
 export type TypeAheadInsert = (node?: PMNode | Object | string | Fragment, opts?: {
     selectInlineNode?: boolean;
 }) => Transaction;
 export type TypeAheadSelectItem = (state: EditorState, item: TypeAheadItem, insert: TypeAheadInsert, meta: {
     mode: SelectItemMode;
-    stats: TypeAheadStats;
     query: string;
     sourceListItem: Array<TypeAheadItem>;
+    stats: TypeAheadStats;
 }) => Transaction | false;
 export type TypeAheadItem = {
-    title: string;
+    [key: string]: any;
     description?: string;
-    keyshortcut?: string;
-    key?: string | number;
     icon?: () => ReactElement<any>;
-    render?: (props: TypeAheadItemRenderProps) => React.ReactElement<TypeAheadItemRenderProps> | null;
     isDisabledOffline?: boolean;
-    [key: string]: any;
+    key?: string | number;
+    keyshortcut?: string;
+    render?: (props: TypeAheadItemRenderProps) => React.ReactElement<TypeAheadItemRenderProps> | null;
+    title: string;
 };
 export type TypeAheadForceSelect = (props: TypeAheadForceSelectProps) => TypeAheadItem | undefined;
 export type MoreOptionsButtonConfig = {
-    title: string;
     ariaLabel?: string;
-    onClick: EditorCommand;
     iconBefore?: ReactNode;
+    onClick: EditorCommand;
+    title: string;
 };
 export type TypeAheadHandler = {
-    id: TypeAheadAvailableNodes;
-    /** Pattern that will trigger the TypeAhead */
-    trigger: string;
     /** Custom regex must have a capture group around trigger so it's possible to
      * use it without needing to scan through all triggers again */
     customRegex?: string;
-    headless?: boolean;
-    /** Handler returns typeahead item based on query. Used to find which item to insert. */
-    forceSelect?: TypeAheadForceSelect;
-    onInvokeAnalytics?: TypeAheadPayload;
-    /** Handler executes logic when TypeAhead opens */
-    onOpen?: (editorState: EditorState) => void;
-    /** Handler returns an array of TypeAheadItem based on query to be displayed in the TypeAhead */
-    getItems: (props: {
-        query: string;
-        editorState: EditorState;
-    }) => Promise<Array<TypeAheadItem>>;
-    /** Handler returns a transaction which inserts the TypeAheadItem into the doc */
-    selectItem: TypeAheadSelectItem;
     /** Handler executes logic when TypeAhead is dismissed */
     dismiss?: (props: {
         editorState: EditorState;
@@ -76,7 +60,23 @@ export type TypeAheadHandler = {
         stats: TypeAheadStats;
         wasItemInserted?: boolean;
     }) => void;
+    /** Handler returns typeahead item based on query. Used to find which item to insert. */
+    forceSelect?: TypeAheadForceSelect;
     getHighlight?: (state: EditorState) => JSX.Element | null;
+    /** Handler returns an array of TypeAheadItem based on query to be displayed in the TypeAhead */
+    getItems: (props: {
+        editorState: EditorState;
+        query: string;
+    }) => Promise<Array<TypeAheadItem>>;
     getMoreOptionsButtonConfig?: (intl: IntlShape) => MoreOptionsButtonConfig;
+    headless?: boolean;
+    id: TypeAheadAvailableNodes;
+    onInvokeAnalytics?: TypeAheadPayload;
+    /** Handler executes logic when TypeAhead opens */
+    onOpen?: (editorState: EditorState) => void;
+    /** Handler returns a transaction which inserts the TypeAheadItem into the doc */
+    selectItem: TypeAheadSelectItem;
+    /** Pattern that will trigger the TypeAhead */
+    trigger: string;
 };
 export {};

package/dist/types/types/ui-components.d.ts

@@ -6,17 +6,17 @@ import type { ProviderFactory } from '../provider-factory';
 import type { EditorActionsOptions } from './editor-actions';
 import type { EditorAppearance } from './editor-appearance';
 export type UiComponentFactoryParams = {
-    editorView: EditorView;
+    appearance: EditorAppearance;
+    containerElement: HTMLElement | null;
+    disabled: boolean;
+    dispatchAnalyticsEvent?: DispatchAnalyticsEvent;
     editorActions: EditorActionsOptions;
+    editorView: EditorView;
     eventDispatcher: EventDispatcher;
-    dispatchAnalyticsEvent?: DispatchAnalyticsEvent;
-    providerFactory: ProviderFactory;
-    appearance: EditorAppearance;
-    popupsMountPoint?: HTMLElement;
     popupsBoundariesElement?: HTMLElement;
+    popupsMountPoint?: HTMLElement;
     popupsScrollableElement?: HTMLElement;
-    containerElement: HTMLElement | null;
-    disabled: boolean;
+    providerFactory: ProviderFactory;
     wrapperElement: HTMLElement | null;
 };
 export type UIComponentFactory = (params: UiComponentFactoryParams) => React.ReactElement<any> | null;

package/dist/types/types/user-preferences.d.ts

@@ -2,6 +2,12 @@ export type UserPreferences = {
     toolbarDockingInitialPosition?: 'top' | 'none' | null;
 };
 export interface UserPreferencesProvider {
+    /**
+     * get a user preference, Note that this function is a not async function,
+     * meaning that consumers should prefetch the user preference and make it available initially
+     * @param key
+     */
+    getPreference<K extends keyof UserPreferences>(key: K): UserPreferences[K] | undefined | null;
     /**
      * This method fetches the latest user preferences
      * @returns a promise that resolves with the user preferences, or rejects if error occurs
@@ -14,10 +20,4 @@ export interface UserPreferencesProvider {
      * @returns a promise that resolves when the preference is updated, or rejects if the update fails
      */
     updatePreference<K extends keyof UserPreferences>(key: K, value: UserPreferences[K]): Promise<void>;
-    /**
-     * get a user preference, Note that this function is a not async function,
-     * meaning that consumers should prefetch the user preference and make it available initially
-     * @param key
-     */
-    getPreference<K extends keyof UserPreferences>(key: K): UserPreferences[K] | undefined | null;
 }

package/dist/types/ugc-tokens/editor-ugc-token-names.d.ts

@@ -1,4 +1,5 @@
 export type EditorUGCTokens = {
+    'editor.font.body': string;
     'editor.font.heading.h1': string;
     'editor.font.heading.h2': string;
     'editor.font.heading.h3': string;
@@ -11,7 +12,6 @@ export type EditorUGCTokens = {
     'editor.font.weight.heading.h4.bold': string;
     'editor.font.weight.heading.h5.bold': string;
     'editor.font.weight.heading.h6.bold': string;
-    'editor.font.body': string;
 };
 export declare const editorUGCTokens: EditorUGCTokens;
 export declare const editorUGCTokensModernized: EditorUGCTokens;

package/dist/types/ui/Announcer/announcer.d.ts

@@ -1,7 +1,6 @@
 import type { AriaAttributes, Ref } from 'react';
 import React from 'react';
 type AnnouncerProps = {
-    ref?: Ref<HTMLDivElement>;
     /** Set 'false' for announcing only changed text
      * (not announce duplicate part of string after second render),
      * and 'true' for announcing all the string after each render */
@@ -10,14 +9,15 @@ type AnnouncerProps = {
     ariaLive?: AriaAttributes['aria-live'];
     /** Used to describe what types of changes have occurred to an aria-live region */
     ariaRelevant?: AriaAttributes['aria-relevant'];
-    /** Role used to set attribute role. See more details https://dequeuniversity.com/library/aria/liveregion-playground#configOptions */
-    role?: 'status' | 'log' | 'alert' | 'timer' | 'marquee';
-    /** Text message that will be announced */
-    text: string;
     /** Debounce delay.
      *  Set delay (ms) to prevent announce the same string multiple times.
      *  It can be useful for cases when the parent component re-renders with the same announcer's text. */
     delay?: number;
+    ref?: Ref<HTMLDivElement>;
+    /** Role used to set attribute role. See more details https://dequeuniversity.com/library/aria/liveregion-playground#configOptions */
+    role?: 'status' | 'log' | 'alert' | 'timer' | 'marquee';
+    /** Text message that will be announced */
+    text: string;
 };
 declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<React.PropsWithChildren<AnnouncerProps>, "ref"> & React.RefAttributes<HTMLDivElement>>>;
 export default _default;

package/dist/types/ui/AssistiveText/AssistiveText.d.ts

@@ -5,10 +5,10 @@
 import { jsx } from '@emotion/react';
 type AssistiveTextProps = {
     assistiveText: string;
-    isInFocus: boolean;
+    debounce?: boolean;
     id: string;
+    isInFocus: boolean;
     statusDebounceMillis?: number;
-    debounce?: boolean;
 };
 export declare const AssistiveText: ({ assistiveText, isInFocus, id, statusDebounceMillis, }: AssistiveTextProps) => jsx.JSX.Element;
 export {};

package/dist/types/ui/BaseTheme/index.d.ts

@@ -2,9 +2,9 @@ import React from 'react';
 import type { Breakpoints } from '../WidthProvider';
 export declare function mapBreakpointToLayoutMaxWidth(breakpoint: Breakpoints): 760 | 680;
 type BaseThemeWrapperProps = {
+    baseFontSize?: number;
     breakpoint: Breakpoints;
     children: React.ReactNode;
-    baseFontSize?: number;
 };
 declare module '@emotion/react' {
     interface Theme {
@@ -14,8 +14,8 @@ declare module '@emotion/react' {
 }
 export declare function BaseThemeWrapper({ baseFontSize, children }: BaseThemeWrapperProps): React.JSX.Element;
 type BaseThemeProps = {
-    children: React.ReactNode;
     baseFontSize?: number;
+    children: React.ReactNode;
 };
 export declare function BaseTheme({ children, baseFontSize }: BaseThemeProps): React.JSX.Element;
 export {};

package/dist/types/ui/Caption/index.d.ts

@@ -6,12 +6,12 @@ import React from 'react';
 import { jsx } from '@emotion/react';
 import type { WrappedComponentProps } from 'react-intl-next';
 type Props = {
-    selected?: boolean;
-    hasContent?: boolean;
     children?: React.ReactNode;
     dataAttributes?: {
         'data-renderer-start-pos': number;
     };
+    hasContent?: boolean;
+    selected?: boolean;
 };
 export declare class CaptionComponent extends React.Component<Props & WrappedComponentProps> {
     render(): jsx.JSX.Element;

package/dist/types/ui/ContextPanel/context.d.ts

@@ -1,14 +1,14 @@
 import React from 'react';
 export type ContextPanelContext = {
-    width: number;
-    positionedOverEditor: boolean;
-    broadcastWidth: (width: number) => void;
     broadcastPosition: (positionedOverEditor: boolean) => void;
+    broadcastWidth: (width: number) => void;
+    positionedOverEditor: boolean;
+    width: number;
 };
 export declare const ContextPanel: React.Context<ContextPanelContext>;
 export type ContextPanelProviderState = {
-    width?: number;
     positionedOverEditor?: boolean;
+    width?: number;
 };
 export declare class ContextPanelWidthProvider extends React.Component<any, ContextPanelProviderState> {
     state: {

package/dist/types/ui/DropList/index.d.ts

@@ -5,20 +5,20 @@
 import type { ReactNode } from 'react';
 import type { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
 export interface Props extends WithAnalyticsEventsProps {
+    children?: ReactNode;
+    id?: string;
     isOpen?: boolean;
-    trigger?: React.ReactNode;
-    position: string;
+    onDroplistRef?: (ref: HTMLDivElement | null) => unknown;
     onOpenChange?: (event: OpenChangedEvent) => void;
     onPositioned?: () => void;
-    testId?: string;
+    position: string;
     shouldFitContainer: boolean;
-    children?: ReactNode;
-    id?: string;
-    onDroplistRef?: (ref: HTMLDivElement | null) => unknown;
+    testId?: string;
+    trigger?: React.ReactNode;
 }
 export type OpenChangedEvent = {
-    isOpen: boolean;
     event: MouseEvent | KeyboardEvent;
+    isOpen: boolean;
 };
 declare const _default: import("react").ForwardRefExoticComponent<Omit<Omit<Props, keyof WithAnalyticsEventsProps> & import("react").RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "ref"> & import("react").RefAttributes<any>>;
 export default _default;

package/dist/types/ui/Emoji/index.d.ts

@@ -4,11 +4,11 @@ import type { EmojiId } from '@atlaskit/emoji/types';
 import { type ProviderFactory } from '../../provider-factory';
 export interface EmojiProps extends EmojiId {
     allowTextFallback?: boolean;
-    providers?: ProviderFactory;
+    emojiProvider?: EmojiProvider;
     fitToHeight?: number;
-    showTooltip?: boolean;
+    providers?: ProviderFactory;
     resourceConfig?: EmojiResourceConfig;
-    emojiProvider?: EmojiProvider;
+    showTooltip?: boolean;
 }
 declare const _default: React.MemoExoticComponent<(props: EmojiProps) => React.JSX.Element>;
 export default _default;

package/dist/types/ui/ErrorBoundary/index.d.ts

@@ -5,11 +5,11 @@ type ErrorCrashPayload = Extract<ErrorEventPayload, {
     action: ACTION.EDITOR_CRASHED;
 }>;
 interface ErrorBoundaryProps {
+    children?: React.ReactNode;
     component: ErrorCrashPayload['actionSubject'];
     componentId?: ErrorCrashPayload['actionSubjectId'];
     dispatchAnalyticsEvent?: DispatchAnalyticsEvent;
     fallbackComponent?: React.ReactNode;
-    children?: React.ReactNode;
 }
 interface ErrorBoundaryState {
     errorCaptured: boolean;

package/dist/types/ui/EventHandlers/index.d.ts

@@ -17,19 +17,19 @@ export interface MentionEventHandlers {
 }
 /** Callbacks for mouse events in the renderer */
 export interface EventHandlers {
+    link?: {
+        onClick?: LinkEventClickHandler;
+    };
+    media?: {
+        onClick?: CardEventClickHandler;
+    };
+    mention?: MentionEventHandlers;
     /** This fires when there is a click in the renderer that wasn’t handled by anything in the
      * renderer. Example usage of this callback: load the editor in place of the renderer when
      * renderer text is clicked.
      * See example at /examples.html?groupId=editor&packageId=editor-core&exampleId=full-page-click-to-edit
      *  */
     onUnhandledClick?: OnUnhandledClickHandler;
-    mention?: MentionEventHandlers;
-    media?: {
-        onClick?: CardEventClickHandler;
-    };
-    link?: {
-        onClick?: LinkEventClickHandler;
-    };
     smartCard?: {
         onClick?: SmartCardEventClickHandler;
     };

package/dist/types/ui/Expand/sharedStyles.d.ts

@@ -1,9 +1,9 @@
 export declare const EXPAND_CONTAINER_PADDING = 8;
 export interface StyleProps {
-    expanded?: boolean;
-    focused?: boolean;
     'data-node-type'?: 'expand' | 'nestedExpand';
     'data-title'?: string;
+    expanded?: boolean;
+    focused?: boolean;
 }
 export declare const sharedExpandStyles: {
     titleInputStyles: () => import("@emotion/react").SerializedStyles;

package/dist/types/ui/FloatingToolbar/Button.d.ts

@@ -3,37 +3,37 @@ import { type TooltipProps } from '@atlaskit/tooltip';
 import type { ButtonAppearance } from '../../types';
 import type { FloatingToolbarButtonSpotlightConfig } from '../../types/floating-toolbar';
 export interface Props {
-    title?: string;
+    appearance?: ButtonAppearance;
+    areaControls?: string;
+    ariaHasPopup?: boolean | 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid' | undefined;
+    ariaLabel?: string;
+    children?: React.ReactNode;
+    className?: string;
+    disabled?: boolean;
+    hideTooltipOnClick?: boolean;
+    href?: string;
     icon?: React.ReactElement<any>;
     iconAfter?: React.ReactElement<any>;
+    interactionName?: string;
+    isRadioButton?: boolean;
+    onBlur?: <T>(event: React.FocusEvent<T>) => void;
     onClick?: React.MouseEventHandler;
+    onFocus?: <T>(event: React.FocusEvent<T>) => void;
     onKeyDown?: React.KeyboardEventHandler;
+    onMount?: () => void;
     onMouseEnter?: <T>(event: React.MouseEvent<T>) => void;
     onMouseLeave?: <T>(event: React.MouseEvent<T>) => void;
-    onFocus?: <T>(event: React.FocusEvent<T>) => void;
-    onBlur?: <T>(event: React.FocusEvent<T>) => void;
-    onMount?: () => void;
     onUnmount?: () => void;
+    /** If true, the component will have pulse onboarding effect around it. */
+    pulse?: boolean;
     selected?: boolean;
-    disabled?: boolean;
-    appearance?: ButtonAppearance;
-    ariaHasPopup?: boolean | 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid' | undefined;
-    ariaLabel?: string;
-    href?: string;
+    spotlightConfig?: FloatingToolbarButtonSpotlightConfig;
+    tabIndex?: number | null | undefined;
     target?: string;
-    children?: React.ReactNode;
-    className?: string;
+    testId?: string;
+    title?: string;
     tooltipContent?: TooltipProps['content'];
     tooltipStyle?: React.ForwardRefExoticComponent<any> | React.ComponentType<any>;
-    testId?: string;
-    interactionName?: string;
-    hideTooltipOnClick?: boolean;
-    tabIndex?: number | null | undefined;
-    areaControls?: string;
-    isRadioButton?: boolean;
-    /** If true, the component will have pulse onboarding effect around it. */
-    pulse?: boolean;
-    spotlightConfig?: FloatingToolbarButtonSpotlightConfig;
 }
 declare const _default: ({ title, icon, iconAfter, onClick, onKeyDown, onMouseEnter, onMouseLeave, onFocus, onBlur, onMount, onUnmount, selected, disabled, href, target, appearance, children, className, tooltipContent, tooltipStyle, testId, interactionName, hideTooltipOnClick, ariaHasPopup, tabIndex, areaControls, ariaLabel, isRadioButton, pulse, spotlightConfig, }: Props) => React.JSX.Element;
 export default _default;

package/dist/types/ui/FloatingToolbar/ButtonSpotlightCard.d.ts

@@ -3,8 +3,8 @@ import { SpotlightCard } from '@atlaskit/onboarding';
 import { type Placement } from '@atlaskit/popper';
 type PropsFromSpotlightCard = ComponentProps<typeof SpotlightCard>;
 export type ButtonSpotlightCardProps = PropsFromSpotlightCard & {
-    referenceElement: HTMLElement;
     placement?: Placement;
+    referenceElement: HTMLElement;
 };
 export declare const ButtonSpotlightCard: (props: ButtonSpotlightCardProps) => React.JSX.Element;
 export {};

package/dist/types/ui/HoverLinkOverlay/types.d.ts

@@ -1,12 +1,12 @@
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { EditorAnalyticsAPI } from '../../analytics';
 export type HoverLinkOverlayProps = React.HTMLAttributes<HTMLSpanElement> & {
-    isVisible?: boolean;
-    url: string;
+    compactPadding?: boolean;
     editorAnalyticsApi?: EditorAnalyticsAPI;
-    view?: EditorView;
+    isVisible?: boolean;
     onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
     showPanelButton?: boolean;
     showPanelButtonIcon?: 'panel' | 'modal';
-    compactPadding?: boolean;
+    url: string;
+    view?: EditorView;
 };

package/dist/types/ui/Layer/index.d.ts

@@ -1,25 +1,25 @@
 import React, { Component, type ReactNode } from 'react';
 import { type Data } from 'popper.js';
 export type Props = {
+    children?: React.ReactNode;
     content: ReactNode | null;
     offset: string;
-    position: string;
     onPositioned: () => void;
-    children?: React.ReactNode;
+    position: string;
 };
 export type State = {
+    cssPosition: string;
     hasExtractedStyles: boolean;
-    position?: string;
-    transform?: string;
+    maxHeight: number | null;
     offsets: {
         popper: {
             left: number;
             top: number;
         };
     };
-    cssPosition: string;
     originalHeight: number | null;
-    maxHeight: number | null;
+    position?: string;
+    transform?: string;
 };
 export default class Layer extends Component<Props, State> {
     private popper;

package/dist/types/ui/MediaSingle/grid.d.ts

@@ -9,15 +9,15 @@ export declare function calcPctFromPx(width: number, lineLength: number): number
 export declare const wrappedLayouts: MediaSingleLayout[];
 export declare const calcPctWidth: (containerWidth: EditorContainerWidth, pctWidth?: number, origWidth?: number, origHeight?: number) => number | undefined;
 export declare const calcMediaPxWidth: (opts: {
-    origWidth: number;
-    origHeight: number;
-    state?: EditorState;
     containerWidth: EditorContainerWidth;
+    isFullWidthModeEnabled?: boolean;
     layout?: MediaSingleLayout;
+    origHeight: number;
+    origWidth: number;
     pctWidth?: number;
     pos?: number;
     resizedPctWidth?: number;
-    isFullWidthModeEnabled?: boolean;
+    state?: EditorState;
 }) => number;
 export declare const snapToGrid: (gridWidth: number, width: number, height: number, lineLength: number, gridSize: number) => {
     height: number;

package/dist/types/ui/MediaSingle/index.d.ts

@@ -9,13 +9,19 @@ import type { EditorAppearance } from '../../types';
 import type { MediaSingleSize } from './types';
 export interface Props {
     children: React.ReactNode;
-    layout: MediaSingleLayout;
-    width?: number;
-    height: number;
-    lineLength: number;
+    className?: string;
     containerWidth?: number;
+    dataAttributes?: Record<string, any>;
+    editorAppearance?: EditorAppearance;
+    fullWidthMode?: boolean;
+    handleMediaSingleRef?: React.RefObject<HTMLDivElement>;
+    hasFallbackContainer?: boolean;
+    height: number;
+    isInsideOfInlineExtension?: boolean;
     isLoading?: boolean;
-    className?: string;
+    layout: MediaSingleLayout;
+    lineLength: number;
+    nodeType?: string;
     /**
      * @private
      * @deprecated Use {@link Props.size.width} instead.
@@ -23,13 +29,7 @@ export interface Props {
      */
     pctWidth?: number;
     size?: MediaSingleSize;
-    nodeType?: string;
-    fullWidthMode?: boolean;
-    hasFallbackContainer?: boolean;
-    handleMediaSingleRef?: React.RefObject<HTMLDivElement>;
-    isInsideOfInlineExtension?: boolean;
-    dataAttributes?: Record<string, any>;
-    editorAppearance?: EditorAppearance;
+    width?: number;
 }
 /**
  * MediaSingle

package/dist/types/ui/MediaSingle/styled.d.ts

@@ -58,21 +58,21 @@ export declare function roundToClosestEvenPxValue(widthValue: string): string;
 export interface MediaSingleWrapperProps {
     containerWidth?: number;
     fullWidthMode?: boolean;
+    innerRef?: ((elem: HTMLDivElement) => void) | RefObject<HTMLDivElement>;
+    isExtendedResizeExperienceOn?: boolean;
+    isInsideOfInlineExtension?: boolean;
+    isNestedNode?: boolean;
     isResized?: boolean;
     layout: MediaSingleLayout;
+    mediaSingleWidth?: number;
+    nodeType?: string;
     /**
      * @private
      * @deprecated Use {@link MediaSingleWrapperProps["mediaSingleWidth"]} instead.
      * Cleanup ticket: https://product-fabric.atlassian.net/browse/ED-19076
      */
     pctWidth?: number;
-    mediaSingleWidth?: number;
     width?: number;
-    innerRef?: ((elem: HTMLDivElement) => void) | RefObject<HTMLDivElement>;
-    isExtendedResizeExperienceOn?: boolean;
-    isNestedNode?: boolean;
-    isInsideOfInlineExtension?: boolean;
-    nodeType?: string;
 }
 /**
  * Can't use `.attrs` to handle highly dynamic styles because we are still
@@ -92,9 +92,9 @@ export interface MediaSingleWrapperProps {
  */
 export declare const MediaSingleDimensionHelper: ({ containerWidth, fullWidthMode, isResized, layout, mediaSingleWidth, width, isExtendedResizeExperienceOn, isNestedNode, isInsideOfInlineExtension, nodeType, }: MediaSingleWrapperProps) => import("@emotion/react").SerializedStyles;
 export interface MediaWrapperProps {
-    paddingBottom?: string;
-    height?: number;
     hasFallbackContainer?: boolean;
+    height?: number;
+    paddingBottom?: string;
 }
 export declare const mediaWrapperStyle: (props: MediaWrapperProps) => import("@emotion/react").SerializedStyles;
 export declare const MediaWrapper: {