UNPKG

@atlaskit/editor-plugin-card

Version:

Card plugin for @atlaskit/editor-core

95 lines (94 loc) • 4.13 kB
import _extends from "@babel/runtime/helpers/extends"; import React, { useEffect, useMemo } from 'react'; import UnsupportedInline from '@atlaskit/editor-common/UnsupportedInline'; import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/useSharedPluginStateWithSelector'; import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from '@atlaskit/editor-smart-link-draggable'; import { getAwarenessProps } from '../pm-plugins/utils'; import { SmartCardSSRReactContextsProvider } from '../ui/SmartCardSSRReactContextsProvider'; import { Card } from './genericCard'; import { InlineCardWithAwareness } from './inlineCardWithAwareness'; const WrappedInlineCardWithAwareness = Card(InlineCardWithAwareness, UnsupportedInline); const selectorWithCard = states => { var _states$editorViewMod, _states$cardState; return { mode: (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode, resolvedInlineSmartLinks: (_states$cardState = states.cardState) === null || _states$cardState === void 0 ? void 0 : _states$cardState.resolvedInlineSmartLinks }; }; /** * Inline card node view component that renders a Smart Link inline card within the editor. * * @param props * @example */ export function InlineCardNodeView(props) { var _resolvedInlineSmartL; const { useAlternativePreloader, node, view, getPos, actionOptions, allowEmbeds, allowBlockCards, enableInlineUpgradeFeatures, pluginInjectionApi, onClickCallback, isPageSSRed, provider, CompetitorPrompt, intl, smartCardContext } = props; const { mode, resolvedInlineSmartLinks } = useSharedPluginStateWithSelector(pluginInjectionApi, ['editorViewMode', 'card'], selectorWithCard); const url = node.attrs.url; const CompetitorPromptComponent = CompetitorPrompt && url ? /*#__PURE__*/React.createElement(CompetitorPrompt, { sourceUrl: url, linkType: "inline" }) : null; useEffect(() => { provider === null || provider === void 0 ? void 0 : provider.then(providerInstance => { var _refreshCache, _ref; (_refreshCache = (_ref = providerInstance).refreshCache) === null || _refreshCache === void 0 ? void 0 : _refreshCache.call(_ref, props.node); }); }, [provider, props.node]); const linkPosition = useMemo(() => { if (!getPos || typeof getPos === 'boolean') { return undefined; } const pos = getPos(); return typeof pos === 'number' ? pos : undefined; }, [getPos]); const isChangeboardTarget = linkPosition !== undefined && (resolvedInlineSmartLinks === null || resolvedInlineSmartLinks === void 0 ? void 0 : (_resolvedInlineSmartL = resolvedInlineSmartLinks[0]) === null || _resolvedInlineSmartL === void 0 ? void 0 : _resolvedInlineSmartL.pos) === linkPosition; const inlineCardContent = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(WrappedInlineCardWithAwareness, _extends({ node: node, view: view, getPos: getPos, actionOptions: actionOptions, useAlternativePreloader: useAlternativePreloader, pluginInjectionApi: pluginInjectionApi, onClickCallback: onClickCallback, isPageSSRed: isPageSSRed, provider: provider, appearance: "inline" // Ignored via go/ees005 // eslint-disable-next-line react/jsx-props-no-spreading }, enableInlineUpgradeFeatures && getAwarenessProps(view.state, getPos, allowEmbeds, allowBlockCards, mode === 'view'))), CompetitorPromptComponent); return /*#__PURE__*/React.createElement(SmartCardSSRReactContextsProvider, { intl: intl, smartCardContext: smartCardContext }, /*#__PURE__*/React.createElement(SmartLinkDraggable, { url: url, appearance: SMART_LINK_APPEARANCE.INLINE, source: SMART_LINK_DRAG_TYPES.EDITOR, isChangeboardTarget: isChangeboardTarget }, inlineCardContent)); } export const inlineCardNodeView = ({ inlineCardViewProducer }) => (node, view, getPos, decorations) => { return inlineCardViewProducer(node, view, getPos, decorations); };