@atlaskit/media-ui 27.4.0 → 27.4.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/media-ui
 
+## 27.4.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 27.4.1
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 27.4.0
 
 ### Minor Changes

package/dist/cjs/customMediaPlayer/index.js

@@ -16,7 +16,7 @@ var CustomMediaPlayerBase = exports.CustomMediaPlayerBase = function CustomMedia
   return (0, _platformFeatureFlags.fg)('platform_media_compiled') ? /*#__PURE__*/_react.default.createElement(_indexCompiled.CustomMediaPlayerBase, props) : /*#__PURE__*/_react.default.createElement(_indexEmotion.CustomMediaPlayerBase, props);
 };
 var packageName = "@atlaskit/media-ui";
-var packageVersion = "27.4.0";
+var packageVersion = "27.4.2";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 var CustomMediaPlayer = exports.CustomMediaPlayer = (0, _mediaCommon.withMediaAnalyticsContext)({

package/dist/cjs/customMediaPlayer/volumeRange.js

@@ -75,9 +75,9 @@ var VolumeRange = function VolumeRange(props) {
       onChange(newVolumeWithBoundaries);
     }
   };
-  var onMouseUp = function onMouseUp() {
+  var _onMouseUp = function onMouseUp() {
     // As soon as user finished dragging, we should clean up events.
-    document.removeEventListener('mouseup', onMouseUp);
+    document.removeEventListener('mouseup', _onMouseUp);
     document.removeEventListener('mousemove', onMouseMove);
     if (onChanged) {
       onChanged();
@@ -93,7 +93,7 @@ var VolumeRange = function VolumeRange(props) {
     // We are implementing drag and drop here. There is no reason to start listening for mouseUp or move
     // before that. Also if we start listening for mouseup before that we could pick up someone else's event
     // For example editors resizing of a inline video player.
-    document.addEventListener('mouseup', onMouseUp);
+    document.addEventListener('mouseup', _onMouseUp);
     document.addEventListener('mousemove', onMouseMove);
     var event = e.nativeEvent;
     var x = event.offsetX;

package/dist/es2019/customMediaPlayer/index.js

@@ -7,7 +7,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import { withMediaAnalyticsContext } from '@atlaskit/media-common';
 export const CustomMediaPlayerBase = props => fg('platform_media_compiled') ? /*#__PURE__*/React.createElement(CompiledCustomMediaPlayerBase, props) : /*#__PURE__*/React.createElement(EmotionCustomMediaPlayerBase, props);
 const packageName = "@atlaskit/media-ui";
-const packageVersion = "27.4.0";
+const packageVersion = "27.4.2";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 export const CustomMediaPlayer = withMediaAnalyticsContext({

package/dist/esm/customMediaPlayer/index.js

@@ -9,7 +9,7 @@ export var CustomMediaPlayerBase = function CustomMediaPlayerBase(props) {
   return fg('platform_media_compiled') ? /*#__PURE__*/React.createElement(CompiledCustomMediaPlayerBase, props) : /*#__PURE__*/React.createElement(EmotionCustomMediaPlayerBase, props);
 };
 var packageName = "@atlaskit/media-ui";
-var packageVersion = "27.4.0";
+var packageVersion = "27.4.2";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 export var CustomMediaPlayer = withMediaAnalyticsContext({

package/dist/esm/customMediaPlayer/volumeRange.js

@@ -65,9 +65,9 @@ var VolumeRange = function VolumeRange(props) {
       onChange(newVolumeWithBoundaries);
     }
   };
-  var onMouseUp = function onMouseUp() {
+  var _onMouseUp = function onMouseUp() {
     // As soon as user finished dragging, we should clean up events.
-    document.removeEventListener('mouseup', onMouseUp);
+    document.removeEventListener('mouseup', _onMouseUp);
     document.removeEventListener('mousemove', onMouseMove);
     if (onChanged) {
       onChanged();
@@ -83,7 +83,7 @@ var VolumeRange = function VolumeRange(props) {
     // We are implementing drag and drop here. There is no reason to start listening for mouseUp or move
     // before that. Also if we start listening for mouseup before that we could pick up someone else's event
     // For example editors resizing of a inline video player.
-    document.addEventListener('mouseup', onMouseUp);
+    document.addEventListener('mouseup', _onMouseUp);
     document.addEventListener('mousemove', onMouseMove);
     var event = e.nativeEvent;
     var x = event.offsetX;

package/dist/types/MediaButton.d.ts

@@ -1,4 +1,4 @@
-import { type RefObject } from 'react';
+import React, { type RefObject } from 'react';
 import { type ButtonProps } from '@atlaskit/button/types';
 import { type CustomThemeButtonProps, type Appearance } from '@atlaskit/button/types';
 type MediaButtonAppearance = Appearance;
@@ -11,5 +11,5 @@ export interface MediaButtonProps extends ButtonProps {
 type Props = WithMediaButtonAppearance<CustomThemeButtonProps> & {
     buttonRef?: RefObject<HTMLButtonElement>;
 };
-export default function MediaButton({ appearance, buttonRef, ...rest }: Props): JSX.Element;
+export default function MediaButton({ appearance, buttonRef, ...rest }: Props): React.JSX.Element;
 export {};

package/dist/types/MediaInlineCard/ErroredView/index.d.ts

@@ -12,6 +12,6 @@ export interface MediaInlineCardErroredViewProps {
     innerRef?: React.Ref<HTMLSpanElement>;
 }
 export declare class MediaInlineCardErroredView extends React.Component<MediaInlineCardErroredViewProps> {
-    renderMessage: () => JSX.Element;
-    render(): JSX.Element;
+    renderMessage: () => React.JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types/MediaInlineCard/Frame/index.d.ts

@@ -13,5 +13,5 @@ export interface FrameViewProps {
 export declare class Frame extends React.Component<FrameViewProps> {
     handleClick: (event: React.MouseEvent<HTMLDivElement>) => void;
     handleKeyPress: (event: React.KeyboardEvent<HTMLDivElement>) => void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types/MediaInlineCard/Frame/styled-emotion.d.ts

@@ -2,5 +2,5 @@
 import { type WrapperProps } from './styled-compiled';
 export declare const Wrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & WrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/types/MediaInlineCard/Icon-emotion.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 export declare const Icon: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
 export declare const AKIconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/types/MediaInlineCard/Icon.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-export declare const Icon: (props: React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>) => JSX.Element;
-export declare const AKIconWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
+export declare const Icon: (props: React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>) => React.JSX.Element;
+export declare const AKIconWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;

package/dist/types/MediaInlineCard/IconAndTitleLayout/index.d.ts

@@ -12,6 +12,6 @@ export declare class IconAndTitleLayout extends React.Component<IconAndTitleLayo
     private renderAtlaskitIcon;
     private renderImageIcon;
     private renderIconPlaceholder;
-    renderIcon(testId: string): JSX.Element;
-    render(): JSX.Element;
+    renderIcon(testId: string): React.JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types/MediaInlineCard/IconAndTitleLayout/styled-emotion.d.ts

@@ -3,33 +3,33 @@ export declare const IconObjectOverrides = "\n  & > span {\n    height: 16px;\n
 export declare const IconOverrides = "\n  & > * > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
 export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const EmojiWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const IconTitleWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const LozengeWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const LozengeBlockWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const RightIconPositionWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const IconPositionWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const IconEmptyWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/types/MediaInlineCard/IconAndTitleLayout/styled.d.ts

@@ -1,10 +1,10 @@
 import React from 'react';
 export { IconObjectOverrides, IconOverrides } from './styled-emotion';
-export declare const IconWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const EmojiWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const IconTitleWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const LozengeWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const LozengeBlockWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const RightIconPositionWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const IconPositionWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const IconEmptyWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
+export declare const IconWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const EmojiWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const IconTitleWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const LozengeWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const LozengeBlockWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const RightIconPositionWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const IconPositionWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const IconEmptyWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;

package/dist/types/MediaInlineCard/LoadedView/index.d.ts

@@ -15,5 +15,5 @@ export interface MediaInlineCardLoadedViewProps {
     innerRef?: React.Ref<HTMLSpanElement>;
 }
 export declare class MediaInlineCardLoadedView extends React.Component<MediaInlineCardLoadedViewProps> {
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types/MediaInlineCard/LoadingView/index.d.ts

@@ -14,5 +14,5 @@ export interface MediaInlineCardLoadingViewProps {
     withoutHover?: boolean;
 }
 export declare class MediaInlineCardLoadingView extends React.Component<MediaInlineCardLoadingViewProps> {
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types/MediaInlineCard/LoadingView/styled-emotion.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 export declare const SpinnerWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;

package/dist/types/MediaInlineCard/LoadingView/styled.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const SpinnerWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
+export declare const SpinnerWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;

package/dist/types/MediaInlineCard/styled-emotion.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 export declare const NoLinkAppearance: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/types/MediaInlineCard/styled.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const NoLinkAppearance: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
+export declare const NoLinkAppearance: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;

package/dist/types/customMediaPlayer/index-compiled.d.ts

@@ -72,5 +72,5 @@ export declare class CustomMediaPlayerBase extends Component<CustomMediaPlayerPr
     private pausePlayByBlanketClick;
     private startPlayByButtonClick;
     private pausePlayByButtonClick;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types/customMediaPlayer/index-emotion.d.ts

@@ -48,5 +48,5 @@ export declare class CustomMediaPlayerBase extends Component<CustomMediaPlayerPr
     private pausePlayByBlanketClick;
     private startPlayByButtonClick;
     private pausePlayByButtonClick;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types/customMediaPlayer/index.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { type WrappedComponentProps } from 'react-intl-next';
 import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
 import { type CustomMediaPlayerProps } from './index-compiled';
-export declare const CustomMediaPlayerBase: (props: CustomMediaPlayerProps & WrappedComponentProps & WithAnalyticsEventsProps) => JSX.Element;
+export declare const CustomMediaPlayerBase: (props: CustomMediaPlayerProps & WrappedComponentProps & WithAnalyticsEventsProps) => React.JSX.Element;
 export declare const CustomMediaPlayer: React.ComponentType<CustomMediaPlayerProps & WithAnalyticsEventsProps>;
 export { type CustomMediaPlayerProps } from './index-compiled';
 export type { CustomMediaPlayerState, Action } from './index-compiled';

package/dist/types/customMediaPlayer/playPauseBlanket-emotion.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 export declare const PlayPauseBlanket: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/types/customMediaPlayer/playPauseBlanket.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const PlayPauseBlanket: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
+export declare const PlayPauseBlanket: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;

package/dist/types/customMediaPlayer/playbackSpeedControls.d.ts

@@ -18,7 +18,7 @@ export declare class PlaybackSpeedControls extends Component<PlaybackSpeedContro
     private speedOptions;
     private popupCustomStyles;
     private onResize;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 declare const _default: React.FC<PlaybackSpeedControlsProps>;
 export default _default;

package/dist/types/customMediaPlayer/styled-emotion.d.ts

@@ -5,65 +5,65 @@ export interface CurrentTimeTooltipProps {
 }
 export declare const VolumeWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & VolumeWrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const CurrentTime: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 interface WithAsActiveProps {
     showAsActive: boolean;
 }
 export declare const TimeLine: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const CurrentTimeLine: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const Thumb: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const CurrentTimeLineThumb: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const BufferedTime: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const LeftControls: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const RightControls: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const ControlsWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const VolumeToggleWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & MutedIndicatorProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const VolumeTimeRangeWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const MutedIndicator: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & MutedIndicatorProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const CurrentTimeTooltip: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & CurrentTimeTooltipProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const TimeRangeWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & WithAsActiveProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};

package/dist/types/customMediaPlayer/styled.d.ts

@@ -1,16 +1,16 @@
 import React from 'react';
 import { type VolumeWrapperProps, type MutedIndicatorProps } from './styled-compiled';
-export declare const VolumeWrapper: (props: VolumeWrapperProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const CurrentTime: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
+export declare const VolumeWrapper: (props: VolumeWrapperProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const CurrentTime: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
 export declare const TimeLine: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<unknown>>;
-export declare const CurrentTimeLine: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const Thumb: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
+export declare const CurrentTimeLine: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const Thumb: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
 export declare const CurrentTimeLineThumb: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<unknown>>;
-export declare const BufferedTime: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const LeftControls: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const RightControls: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const VolumeToggleWrapper: (props: MutedIndicatorProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const VolumeTimeRangeWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const MutedIndicator: (props: MutedIndicatorProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
+export declare const BufferedTime: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const LeftControls: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const RightControls: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const VolumeToggleWrapper: (props: MutedIndicatorProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const VolumeTimeRangeWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const MutedIndicator: (props: MutedIndicatorProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
 export type { MutedIndicatorProps } from './styled-compiled';
 export type { CurrentTimeTooltipProps } from './styled-emotion';

package/dist/types/customMediaPlayer/timeRange.d.ts

@@ -36,7 +36,7 @@ export declare class TimeRangeBase extends Component<TimeRangeProps & WrappedCom
     onMouseUp: () => void;
     onThumbMouseDown: (e: React.SyntheticEvent<HTMLDivElement>) => void;
     onTimeLineThumbKeydown: (event: React.KeyboardEvent<HTMLDivElement>) => void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export declare const TimeRange: React.FC<import("react-intl-next").WithIntlProps<TimeRangeProps & WrappedComponentProps<"intl">>> & {
     WrappedComponent: React.ComponentType<TimeRangeProps & WrappedComponentProps<"intl">>;

package/dist/types/customMediaPlayer/volumeRange.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 export type VolumeRangeProps = {
     currentVolume: number;
     onChange: (newVolume: number) => void;
@@ -6,5 +6,5 @@ export type VolumeRangeProps = {
     onChanged?: () => void;
     ariaLabel: string;
 };
-declare const VolumeRange: (props: VolumeRangeProps) => JSX.Element;
+declare const VolumeRange: (props: VolumeRangeProps) => React.JSX.Element;
 export default VolumeRange;

package/dist/types/errorIcon.d.ts

@@ -1,2 +1,2 @@
-/// <reference types="react" />
-export declare const errorIcon: JSX.Element;
+import React from 'react';
+export declare const errorIcon: React.JSX.Element;

package/dist/types/inactivityDetector/inactivityDetector.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { Component, type ReactElement } from 'react';
 export interface InactivityDetectorProps {
     children: (triggerActivityCallback: () => void) => ReactElement;
@@ -20,5 +21,5 @@ export declare class InactivityDetector extends Component<InactivityDetectorProp
     private checkMouseMovement;
     componentDidMount(): void;
     componentWillUnmount(): void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types/inactivityDetector/styled-emotion.d.ts

@@ -2,5 +2,5 @@
 import { type ContentWrapperProps } from './styled-compiled';
 export declare const InactivityDetectorWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & ContentWrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/types/media-type-icon-emotion.d.ts

@@ -2,11 +2,11 @@ import React from 'react';
 import { type FileIconProps } from './media-type-icon-compiled';
 export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
 } & {
     size: Required<FileIconProps['size']>;
 }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare class MediaTypeIcon extends React.Component<FileIconProps, {}> {
     static defaultProps: FileIconProps;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types/media-type-icon.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { type FileIconProps } from './media-type-icon-compiled';
 export { IconWrapper } from './media-type-icon-emotion';
 export declare class MediaTypeIcon extends React.Component<FileIconProps, {}> {
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export type { IconWrapperProps, FileIconProps } from './media-type-icon-compiled';

package/dist/types/modalSpinner-emotion.d.ts

@@ -1,15 +1,15 @@
 import React from 'react';
 export declare const Blanket: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
 }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const SpinnerWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
 }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 interface Props {
     blankedColor?: string;
     invertSpinnerColor?: boolean;
 }
-declare const _default: ({ blankedColor, invertSpinnerColor }: Props) => JSX.Element;
+declare const _default: ({ blankedColor, invertSpinnerColor }: Props) => React.JSX.Element;
 export default _default;

package/dist/types/truncateText-emotion.d.ts

@@ -2,10 +2,10 @@ import React from 'react';
 import { type TruncateStyledProps, type TruncateProps } from './truncateText-compiled';
 export declare const TruncateLeft: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
 } & TruncateStyledProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const TruncateRight: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
 } & TruncateStyledProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const Truncate: React.FC<TruncateProps>;

package/dist/types/truncateText.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { Truncate as EmotionTruncate } from './truncateText-emotion';
 import { type TruncateStyledProps } from './truncateText-compiled';
 export declare const Truncate: typeof EmotionTruncate;
-export declare const TruncateLeft: (props: TruncateStyledProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const TruncateRight: (props: TruncateStyledProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
+export declare const TruncateLeft: (props: TruncateStyledProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const TruncateRight: (props: TruncateStyledProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
 export { calculateTruncation } from './truncateText-compiled';
 export type { TruncateStyledProps, TruncateProps, TruncateOutput } from './truncateText-compiled';

package/dist/types-ts4.5/MediaButton.d.ts

@@ -1,4 +1,4 @@
-import { type RefObject } from 'react';
+import React, { type RefObject } from 'react';
 import { type ButtonProps } from '@atlaskit/button/types';
 import { type CustomThemeButtonProps, type Appearance } from '@atlaskit/button/types';
 type MediaButtonAppearance = Appearance;
@@ -11,5 +11,5 @@ export interface MediaButtonProps extends ButtonProps {
 type Props = WithMediaButtonAppearance<CustomThemeButtonProps> & {
     buttonRef?: RefObject<HTMLButtonElement>;
 };
-export default function MediaButton({ appearance, buttonRef, ...rest }: Props): JSX.Element;
+export default function MediaButton({ appearance, buttonRef, ...rest }: Props): React.JSX.Element;
 export {};

package/dist/types-ts4.5/MediaInlineCard/ErroredView/index.d.ts

@@ -12,6 +12,6 @@ export interface MediaInlineCardErroredViewProps {
     innerRef?: React.Ref<HTMLSpanElement>;
 }
 export declare class MediaInlineCardErroredView extends React.Component<MediaInlineCardErroredViewProps> {
-    renderMessage: () => JSX.Element;
-    render(): JSX.Element;
+    renderMessage: () => React.JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types-ts4.5/MediaInlineCard/Frame/index.d.ts

@@ -13,5 +13,5 @@ export interface FrameViewProps {
 export declare class Frame extends React.Component<FrameViewProps> {
     handleClick: (event: React.MouseEvent<HTMLDivElement>) => void;
     handleKeyPress: (event: React.KeyboardEvent<HTMLDivElement>) => void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types-ts4.5/MediaInlineCard/Frame/styled-emotion.d.ts

@@ -2,5 +2,5 @@
 import { type WrapperProps } from './styled-compiled';
 export declare const Wrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & WrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/types-ts4.5/MediaInlineCard/Icon-emotion.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 export declare const Icon: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
 export declare const AKIconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/types-ts4.5/MediaInlineCard/Icon.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-export declare const Icon: (props: React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>) => JSX.Element;
-export declare const AKIconWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
+export declare const Icon: (props: React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>) => React.JSX.Element;
+export declare const AKIconWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;

package/dist/types-ts4.5/MediaInlineCard/IconAndTitleLayout/index.d.ts

@@ -12,6 +12,6 @@ export declare class IconAndTitleLayout extends React.Component<IconAndTitleLayo
     private renderAtlaskitIcon;
     private renderImageIcon;
     private renderIconPlaceholder;
-    renderIcon(testId: string): JSX.Element;
-    render(): JSX.Element;
+    renderIcon(testId: string): React.JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types-ts4.5/MediaInlineCard/IconAndTitleLayout/styled-emotion.d.ts

@@ -3,33 +3,33 @@ export declare const IconObjectOverrides = "\n  & > span {\n    height: 16px;\n
 export declare const IconOverrides = "\n  & > * > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
 export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const EmojiWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const IconTitleWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const LozengeWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const LozengeBlockWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const RightIconPositionWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const IconPositionWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const IconEmptyWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/types-ts4.5/MediaInlineCard/IconAndTitleLayout/styled.d.ts

@@ -1,10 +1,10 @@
 import React from 'react';
 export { IconObjectOverrides, IconOverrides } from './styled-emotion';
-export declare const IconWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const EmojiWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const IconTitleWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const LozengeWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const LozengeBlockWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const RightIconPositionWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const IconPositionWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const IconEmptyWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
+export declare const IconWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const EmojiWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const IconTitleWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const LozengeWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const LozengeBlockWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const RightIconPositionWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const IconPositionWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const IconEmptyWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;

package/dist/types-ts4.5/MediaInlineCard/LoadedView/index.d.ts

@@ -15,5 +15,5 @@ export interface MediaInlineCardLoadedViewProps {
     innerRef?: React.Ref<HTMLSpanElement>;
 }
 export declare class MediaInlineCardLoadedView extends React.Component<MediaInlineCardLoadedViewProps> {
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types-ts4.5/MediaInlineCard/LoadingView/index.d.ts

@@ -14,5 +14,5 @@ export interface MediaInlineCardLoadingViewProps {
     withoutHover?: boolean;
 }
 export declare class MediaInlineCardLoadingView extends React.Component<MediaInlineCardLoadingViewProps> {
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types-ts4.5/MediaInlineCard/LoadingView/styled-emotion.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 export declare const SpinnerWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;

package/dist/types-ts4.5/MediaInlineCard/LoadingView/styled.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const SpinnerWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
+export declare const SpinnerWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;

package/dist/types-ts4.5/MediaInlineCard/styled-emotion.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 export declare const NoLinkAppearance: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/types-ts4.5/MediaInlineCard/styled.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const NoLinkAppearance: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
+export declare const NoLinkAppearance: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;

package/dist/types-ts4.5/customMediaPlayer/index-compiled.d.ts

@@ -72,5 +72,5 @@ export declare class CustomMediaPlayerBase extends Component<CustomMediaPlayerPr
     private pausePlayByBlanketClick;
     private startPlayByButtonClick;
     private pausePlayByButtonClick;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types-ts4.5/customMediaPlayer/index-emotion.d.ts

@@ -48,5 +48,5 @@ export declare class CustomMediaPlayerBase extends Component<CustomMediaPlayerPr
     private pausePlayByBlanketClick;
     private startPlayByButtonClick;
     private pausePlayByButtonClick;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types-ts4.5/customMediaPlayer/index.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { type WrappedComponentProps } from 'react-intl-next';
 import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
 import { type CustomMediaPlayerProps } from './index-compiled';
-export declare const CustomMediaPlayerBase: (props: CustomMediaPlayerProps & WrappedComponentProps & WithAnalyticsEventsProps) => JSX.Element;
+export declare const CustomMediaPlayerBase: (props: CustomMediaPlayerProps & WrappedComponentProps & WithAnalyticsEventsProps) => React.JSX.Element;
 export declare const CustomMediaPlayer: React.ComponentType<CustomMediaPlayerProps & WithAnalyticsEventsProps>;
 export { type CustomMediaPlayerProps } from './index-compiled';
 export type { CustomMediaPlayerState, Action } from './index-compiled';

package/dist/types-ts4.5/customMediaPlayer/playPauseBlanket-emotion.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 export declare const PlayPauseBlanket: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/types-ts4.5/customMediaPlayer/playPauseBlanket.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const PlayPauseBlanket: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
+export declare const PlayPauseBlanket: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;

package/dist/types-ts4.5/customMediaPlayer/playbackSpeedControls.d.ts

@@ -18,7 +18,7 @@ export declare class PlaybackSpeedControls extends Component<PlaybackSpeedContro
     private speedOptions;
     private popupCustomStyles;
     private onResize;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 declare const _default: React.FC<PlaybackSpeedControlsProps>;
 export default _default;

package/dist/types-ts4.5/customMediaPlayer/styled-emotion.d.ts

@@ -5,65 +5,65 @@ export interface CurrentTimeTooltipProps {
 }
 export declare const VolumeWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & VolumeWrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const CurrentTime: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 interface WithAsActiveProps {
     showAsActive: boolean;
 }
 export declare const TimeLine: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const CurrentTimeLine: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const Thumb: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const CurrentTimeLineThumb: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const BufferedTime: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const LeftControls: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const RightControls: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const ControlsWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const VolumeToggleWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & MutedIndicatorProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const VolumeTimeRangeWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const MutedIndicator: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & MutedIndicatorProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const CurrentTimeTooltip: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & CurrentTimeTooltipProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const TimeRangeWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & WithAsActiveProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};

package/dist/types-ts4.5/customMediaPlayer/styled.d.ts

@@ -1,16 +1,16 @@
 import React from 'react';
 import { type VolumeWrapperProps, type MutedIndicatorProps } from './styled-compiled';
-export declare const VolumeWrapper: (props: VolumeWrapperProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const CurrentTime: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
+export declare const VolumeWrapper: (props: VolumeWrapperProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const CurrentTime: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
 export declare const TimeLine: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<unknown>>;
-export declare const CurrentTimeLine: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const Thumb: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
+export declare const CurrentTimeLine: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const Thumb: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
 export declare const CurrentTimeLineThumb: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<unknown>>;
-export declare const BufferedTime: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const LeftControls: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const RightControls: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const VolumeToggleWrapper: (props: MutedIndicatorProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const VolumeTimeRangeWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
-export declare const MutedIndicator: (props: MutedIndicatorProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => JSX.Element;
+export declare const BufferedTime: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const LeftControls: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const RightControls: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const VolumeToggleWrapper: (props: MutedIndicatorProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const VolumeTimeRangeWrapper: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
+export declare const MutedIndicator: (props: MutedIndicatorProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.JSX.Element;
 export type { MutedIndicatorProps } from './styled-compiled';
 export type { CurrentTimeTooltipProps } from './styled-emotion';

package/dist/types-ts4.5/customMediaPlayer/timeRange.d.ts

@@ -36,7 +36,7 @@ export declare class TimeRangeBase extends Component<TimeRangeProps & WrappedCom
     onMouseUp: () => void;
     onThumbMouseDown: (e: React.SyntheticEvent<HTMLDivElement>) => void;
     onTimeLineThumbKeydown: (event: React.KeyboardEvent<HTMLDivElement>) => void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export declare const TimeRange: React.FC<import("react-intl-next").WithIntlProps<TimeRangeProps & WrappedComponentProps<"intl">>> & {
     WrappedComponent: React.ComponentType<TimeRangeProps & WrappedComponentProps<"intl">>;

package/dist/types-ts4.5/customMediaPlayer/volumeRange.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 export type VolumeRangeProps = {
     currentVolume: number;
     onChange: (newVolume: number) => void;
@@ -6,5 +6,5 @@ export type VolumeRangeProps = {
     onChanged?: () => void;
     ariaLabel: string;
 };
-declare const VolumeRange: (props: VolumeRangeProps) => JSX.Element;
+declare const VolumeRange: (props: VolumeRangeProps) => React.JSX.Element;
 export default VolumeRange;

package/dist/types-ts4.5/errorIcon.d.ts

@@ -1,2 +1,2 @@
-/// <reference types="react" />
-export declare const errorIcon: JSX.Element;
+import React from 'react';
+export declare const errorIcon: React.JSX.Element;

package/dist/types-ts4.5/inactivityDetector/inactivityDetector.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { Component, type ReactElement } from 'react';
 export interface InactivityDetectorProps {
     children: (triggerActivityCallback: () => void) => ReactElement;
@@ -20,5 +21,5 @@ export declare class InactivityDetector extends Component<InactivityDetectorProp
     private checkMouseMovement;
     componentDidMount(): void;
     componentWillUnmount(): void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types-ts4.5/inactivityDetector/styled-emotion.d.ts

@@ -2,5 +2,5 @@
 import { type ContentWrapperProps } from './styled-compiled';
 export declare const InactivityDetectorWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & ContentWrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/types-ts4.5/media-type-icon-emotion.d.ts

@@ -2,11 +2,11 @@ import React from 'react';
 import { type FileIconProps } from './media-type-icon-compiled';
 export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
 } & {
     size: Required<FileIconProps['size']>;
 }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare class MediaTypeIcon extends React.Component<FileIconProps, {}> {
     static defaultProps: FileIconProps;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types-ts4.5/media-type-icon.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { type FileIconProps } from './media-type-icon-compiled';
 export { IconWrapper } from './media-type-icon-emotion';
 export declare class MediaTypeIcon extends React.Component<FileIconProps, {}> {
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export type { IconWrapperProps, FileIconProps } from './media-type-icon-compiled';

package/dist/types-ts4.5/modalSpinner-emotion.d.ts

@@ -1,15 +1,15 @@
 import React from 'react';
 export declare const Blanket: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
 }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const SpinnerWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
 }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 interface Props {
     blankedColor?: string;
     invertSpinnerColor?: boolean;
 }
-declare const _default: ({ blankedColor, invertSpinnerColor }: Props) => JSX.Element;
+declare const _default: ({ blankedColor, invertSpinnerColor }: Props) => React.JSX.Element;
 export default _default;

package/dist/types-ts4.5/truncateText-emotion.d.ts

@@ -2,10 +2,10 @@ import React from 'react';
 import { type TruncateStyledProps, type TruncateProps } from './truncateText-compiled';
 export declare const TruncateLeft: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
 } & TruncateStyledProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const TruncateRight: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
 } & TruncateStyledProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const Truncate: React.FC<TruncateProps>;

package/dist/types-ts4.5/truncateText.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { Truncate as EmotionTruncate } from './truncateText-emotion';
 import { type TruncateStyledProps } from './truncateText-compiled';
 export declare const Truncate: typeof EmotionTruncate;
-export declare const TruncateLeft: (props: TruncateStyledProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
-export declare const TruncateRight: (props: TruncateStyledProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => JSX.Element;
+export declare const TruncateLeft: (props: TruncateStyledProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
+export declare const TruncateRight: (props: TruncateStyledProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => React.JSX.Element;
 export { calculateTruncation } from './truncateText-compiled';
 export type { TruncateStyledProps, TruncateProps, TruncateOutput } from './truncateText-compiled';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/media-ui",
-	"version": "27.4.0",
+	"version": "27.4.2",
 	"description": "Includes common components and utilities used by other media packages",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -25,21 +25,21 @@
 	},
 	"dependencies": {
 		"@atlaskit/analytics-next": "^10.3.0",
-		"@atlaskit/button": "^20.4.0",
+		"@atlaskit/button": "^20.5.0",
 		"@atlaskit/code": "^15.7.0",
 		"@atlaskit/css": "^0.8.0",
-		"@atlaskit/icon": "^23.5.0",
+		"@atlaskit/icon": "^23.7.0",
 		"@atlaskit/icon-file-type": "^6.9.0",
 		"@atlaskit/legacy-custom-icons": "^0.21.0",
 		"@atlaskit/locale": "^2.8.0",
 		"@atlaskit/media-common": "^11.8.0",
 		"@atlaskit/modal-dialog": "^12.20.0",
-		"@atlaskit/platform-feature-flags": "^0.3.0",
+		"@atlaskit/platform-feature-flags": "^1.0.0",
 		"@atlaskit/primitives": "^13.4.0",
 		"@atlaskit/range": "^8.1.0",
 		"@atlaskit/select": "^18.10.0",
 		"@atlaskit/spinner": "^17.1.0",
-		"@atlaskit/theme": "^14.1.0",
+		"@atlaskit/theme": "^15.0.0",
 		"@atlaskit/tokens": "^3.3.0",
 		"@atlaskit/tooltip": "^19.1.0",
 		"@atlaskit/width-detector": "^4.4.0",