@atlaskit/editor-plugin-media
Version:
Media plugin for @atlaskit/editor-core
46 lines (45 loc) • 1.96 kB
JavaScript
import React from 'react';
import { injectIntl } from 'react-intl';
import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
import { toolbarMediaMessages } from '@atlaskit/editor-common/media';
import { TOOLBAR_BUTTON, ToolbarButton } from '@atlaskit/editor-common/ui-menu';
import AttachmentIcon from '@atlaskit/icon/core/attachment';
var onClickMediaButton = function onClickMediaButton(showMediaPicker) {
return function () {
showMediaPicker();
return true;
};
};
var selector = function selector(states) {
var _states$mediaState, _states$mediaState2;
return {
allowsUploads: (_states$mediaState = states.mediaState) === null || _states$mediaState === void 0 ? void 0 : _states$mediaState.allowsUploads,
showMediaPicker: (_states$mediaState2 = states.mediaState) === null || _states$mediaState2 === void 0 ? void 0 : _states$mediaState2.showMediaPicker
};
};
var ToolbarMedia = function ToolbarMedia(_ref) {
var isDisabled = _ref.isDisabled,
isReducedSpacing = _ref.isReducedSpacing,
intl = _ref.intl,
api = _ref.api;
var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['media'], selector),
allowsUploads = _useSharedPluginState.allowsUploads,
showMediaPicker = _useSharedPluginState.showMediaPicker;
if (!allowsUploads || !showMediaPicker) {
return null;
}
var toolbarMediaTitle = toolbarMediaMessages.toolbarMediaTitle;
return /*#__PURE__*/React.createElement(ToolbarButton, {
buttonId: TOOLBAR_BUTTON.MEDIA,
onClick: onClickMediaButton(showMediaPicker),
disabled: isDisabled,
title: intl.formatMessage(toolbarMediaTitle),
spacing: isReducedSpacing ? 'none' : 'default',
iconBefore: /*#__PURE__*/React.createElement(AttachmentIcon, {
label: intl.formatMessage(toolbarMediaTitle)
})
});
};
// eslint-disable-next-line @typescript-eslint/ban-types
var _default_1 = injectIntl(ToolbarMedia);
export default _default_1;