@atlaskit/editor-plugin-loom 2.8.3 → 3.0.0

package/dist/es2019/commands.js

@@ -1,5 +1,7 @@
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { logException } from '@atlaskit/editor-common/monitoring';
 import { LoomPluginAction, loomPluginKey } from './pm-plugin';
+import { getQuickInsertItem } from './ui/quickInsert';
 export const enableLoom = ({
   loomButton
 }) => ({
@@ -113,4 +115,95 @@ export const insertLoom = (editorView, api, video, positionType) => {
   } = getPositions(state.tr, positionType);
   return (_api$hyperlink$action = api === null || api === void 0 ? void 0 : (_api$hyperlink = api.hyperlink) === null || _api$hyperlink === void 0 ? void 0 : _api$hyperlink.actions.insertLink(INPUT_METHOD.TYPEAHEAD, from, to, video.sharedUrl, video.title, undefined, undefined, undefined, 'embed' // Convert to embed card instead of inline
   )(state, dispatch)) !== null && _api$hyperlink$action !== void 0 ? _api$hyperlink$action : false;
+};
+export const executeRecordVideo = api => {
+  var _api$core, _api$analytics;
+  api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : _api$core.actions.execute(recordVideo({
+    inputMethod: INPUT_METHOD.TOOLBAR,
+    editorAnalyticsAPI: api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions
+  }));
+};
+export const setupLoom = async (loomProvider, api, editorView, isAfterEditorLoaded) => {
+  var _api$core4;
+  const clientResult = await loomProvider.getClient();
+  if (clientResult.status === 'error') {
+    var _api$core2, _api$analytics2;
+    api === null || api === void 0 ? void 0 : (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions.execute(disableLoom({
+      error: clientResult.message
+    }));
+    logException(new Error(clientResult.message), {
+      location: 'editor-plugin-loom/sdk-initialisation'
+    });
+    api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent({
+      action: ACTION.ERRORED,
+      actionSubject: ACTION_SUBJECT.LOOM,
+      eventType: EVENT_TYPE.OPERATIONAL,
+      attributes: {
+        error: clientResult.message
+      }
+    });
+    return {
+      error: clientResult.message
+    };
+  }
+  const {
+    attachToButton
+  } = clientResult.client;
+
+  // Hidden element to work around the SDK API
+  const loomButton = document.createElement('button');
+  attachToButton({
+    button: loomButton,
+    onInsert: video => {
+      var _api$hyperlink2, _api$core3, _api$analytics3;
+      if (!editorView) {
+        return;
+      }
+      const {
+        state,
+        dispatch
+      } = editorView;
+      const pos = state.selection.from;
+      api === null || api === void 0 ? void 0 : (_api$hyperlink2 = api.hyperlink) === null || _api$hyperlink2 === void 0 ? void 0 : _api$hyperlink2.actions.insertLink(INPUT_METHOD.TYPEAHEAD, pos,
+      // from === to, don't replace text to avoid accidental content loss
+      pos, video.sharedUrl, video.title, undefined, undefined, undefined, 'embed' // Convert to embed card instead of inline
+      )(state, dispatch);
+      api === null || api === void 0 ? void 0 : (_api$core3 = api.core) === null || _api$core3 === void 0 ? void 0 : _api$core3.actions.execute(insertVideo({
+        editorAnalyticsAPI: api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions,
+        video
+      }));
+    }
+  });
+  api === null || api === void 0 ? void 0 : (_api$core4 = api.core) === null || _api$core4 === void 0 ? void 0 : _api$core4.actions.execute(({
+    tr
+  }) => {
+    enableLoom({
+      loomButton
+    })({
+      tr
+    });
+    if (isAfterEditorLoaded) {
+      var _api$quickInsert, _api$analytics4, _api$analytics5;
+      api === null || api === void 0 ? void 0 : (_api$quickInsert = api.quickInsert) === null || _api$quickInsert === void 0 ? void 0 : _api$quickInsert.commands.addQuickInsertItem(getQuickInsertItem(api === null || api === void 0 ? void 0 : (_api$analytics4 = api.analytics) === null || _api$analytics4 === void 0 ? void 0 : _api$analytics4.actions))({
+        tr
+      });
+      api === null || api === void 0 ? void 0 : (_api$analytics5 = api.analytics) === null || _api$analytics5 === void 0 ? void 0 : _api$analytics5.actions.attachAnalyticsEvent({
+        action: ACTION.INITIALISED,
+        actionSubject: ACTION_SUBJECT.LOOM,
+        eventType: EVENT_TYPE.OPERATIONAL
+      })(tr);
+    }
+    return tr;
+  });
+  if (!isAfterEditorLoaded) {
+    var _api$analytics6;
+    // We're not combining the analytics steps into the enable / disable commands because the collab-edit plugin
+    // filters out any transactions with steps (even analytics) when it's initialising
+    api === null || api === void 0 ? void 0 : (_api$analytics6 = api.analytics) === null || _api$analytics6 === void 0 ? void 0 : _api$analytics6.actions.fireAnalyticsEvent({
+      action: ACTION.INITIALISED,
+      actionSubject: ACTION_SUBJECT.LOOM,
+      eventType: EVENT_TYPE.OPERATIONAL
+    });
+  }
+  return {};
 };

package/dist/es2019/plugin.js

@@ -1,12 +1,8 @@
-import React from 'react';
-import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { toolbarInsertBlockMessages } from '@atlaskit/editor-common/messages';
-import { logException } from '@atlaskit/editor-common/monitoring';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { LoomIcon } from '@atlaskit/logo';
-import { insertLoom, recordVideo, recordVideoFailed } from './commands';
+import { insertLoom, recordVideo, setupLoom } from './commands';
 import { createPlugin, loomPluginKey } from './pm-plugin';
-import LoomToolbarButton from './ui/ToolbarButton';
+import { loomPrimaryToolbarComponent } from './ui/PrimaryToolbarButton';
+import { getQuickInsertItem } from './ui/quickInsert';
 export const loomPlugin = ({
   config,
   api
@@ -20,19 +16,7 @@ export const loomPlugin = ({
   const editorViewRef = {
     current: null
   };
-  const primaryToolbarComponent = ({
-    disabled,
-    appearance
-  }) => {
-    if (!config.shouldShowToolbarButton) {
-      return null;
-    }
-    return /*#__PURE__*/React.createElement(LoomToolbarButton, {
-      disabled: disabled,
-      api: api,
-      appearance: appearance
-    });
-  };
+  const primaryToolbarComponent = loomPrimaryToolbarComponent(config, api);
   api === null || api === void 0 ? void 0 : (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 ? void 0 : _api$primaryToolbar.actions.registerComponent({
     name: 'loom',
     component: primaryToolbarComponent
@@ -41,7 +25,12 @@ export const loomPlugin = ({
     name: 'loom',
     actions: {
       recordVideo,
-      insertLoom: (video, positionType) => insertLoom(editorViewRef.current, api, video, positionType)
+      insertLoom: (video, positionType) => insertLoom(editorViewRef.current, api, video, positionType),
+      initLoom: ({
+        loomProvider
+      }) => {
+        return setupLoom(loomProvider, api, editorViewRef.current, true);
+      }
     },
     pmPlugins: () => [{
       name: 'loom',
@@ -74,43 +63,12 @@ export const loomPlugin = ({
     },
     pluginsOptions: {
       // Enable inserting Loom recordings through the slash command
-      quickInsert: ({
-        formatMessage
-      }) => [{
-        id: 'loom',
-        title: formatMessage(toolbarInsertBlockMessages.recordVideo),
-        description: formatMessage(toolbarInsertBlockMessages.recordVideoDescription),
-        keywords: ['loom', 'record', 'video'],
-        priority: 800,
-        icon: () => /*#__PURE__*/React.createElement(LoomIcon, {
-          appearance: "brand"
-        }),
-        action(insert, editorState) {
-          var _recordVideo;
-          const tr = insert(undefined);
-          const loomState = loomPluginKey.getState(editorState);
-          if (!(loomState !== null && loomState !== void 0 && loomState.isEnabled)) {
-            var _recordVideoFailed;
-            const errorMessage = loomState === null || loomState === void 0 ? void 0 : loomState.error;
-            logException(new Error(errorMessage), {
-              location: 'editor-plugin-loom/quick-insert-record-video'
-            });
-            return (_recordVideoFailed = recordVideoFailed({
-              inputMethod: INPUT_METHOD.QUICK_INSERT,
-              error: errorMessage,
-              editorAnalyticsAPI
-            })({
-              tr
-            })) !== null && _recordVideoFailed !== void 0 ? _recordVideoFailed : false;
-          }
-          return (_recordVideo = recordVideo({
-            inputMethod: INPUT_METHOD.QUICK_INSERT,
-            editorAnalyticsAPI
-          })({
-            tr
-          })) !== null && _recordVideo !== void 0 ? _recordVideo : false;
+      quickInsert: intl => {
+        if (config.loomProvider) {
+          return getQuickInsertItem(editorAnalyticsAPI)(intl);
         }
-      }]
+        return [];
+      }
     },
     // Enable inserting Loom recordings through main toolbar
     primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined

package/dist/es2019/pm-plugin.js

@@ -1,8 +1,6 @@
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { logException } from '@atlaskit/editor-common/monitoring';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
-import { disableLoom, enableLoom, insertVideo } from './commands';
+import { setupLoom } from './commands';
 export let LoomPluginAction = /*#__PURE__*/function (LoomPluginAction) {
   LoomPluginAction[LoomPluginAction["ENABLE"] = 0] = "ENABLE";
   LoomPluginAction[LoomPluginAction["DISABLE"] = 1] = "DISABLE";
@@ -15,8 +13,6 @@ export const createPlugin = ({
   config,
   api
 }) => {
-  var _api$analytics;
-  const editorAnalyticsAPI = api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
   return new SafePlugin({
     key: loomPluginKey,
     state: {
@@ -67,65 +63,8 @@ export const createPlugin = ({
       }
     },
     view(editorView) {
-      const setupLoom = async () => {
-        var _api$core3, _api$analytics3;
-        const clientResult = await config.loomProvider.getClient();
-        if (clientResult.status === 'error') {
-          var _api$core, _api$analytics2;
-          api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : _api$core.actions.execute(disableLoom({
-            error: clientResult.message
-          }));
-          logException(new Error(clientResult.message), {
-            location: 'editor-plugin-loom/sdk-initialisation'
-          });
-          api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent({
-            action: ACTION.ERRORED,
-            actionSubject: ACTION_SUBJECT.LOOM,
-            eventType: EVENT_TYPE.OPERATIONAL,
-            attributes: {
-              error: clientResult.message
-            }
-          });
-          return;
-        }
-        const {
-          attachToButton
-        } = clientResult.client;
-
-        // Hidden element to work around the SDK API
-        const loomButton = document.createElement('button');
-        attachToButton({
-          button: loomButton,
-          onInsert: video => {
-            var _api$hyperlink, _api$core2;
-            const {
-              state,
-              dispatch
-            } = editorView;
-            const pos = editorView.state.selection.from;
-            api === null || api === void 0 ? void 0 : (_api$hyperlink = api.hyperlink) === null || _api$hyperlink === void 0 ? void 0 : _api$hyperlink.actions.insertLink(INPUT_METHOD.TYPEAHEAD, pos,
-            // from === to, don't replace text to avoid accidental content loss
-            pos, video.sharedUrl, video.title, undefined, undefined, undefined, 'embed' // Convert to embed card instead of inline
-            )(state, dispatch);
-            api === null || api === void 0 ? void 0 : (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions.execute(insertVideo({
-              editorAnalyticsAPI,
-              video
-            }));
-          }
-        });
-        api === null || api === void 0 ? void 0 : (_api$core3 = api.core) === null || _api$core3 === void 0 ? void 0 : _api$core3.actions.execute(enableLoom({
-          loomButton
-        }));
-        // We're not combining the analytics steps into the enable / disable commands because the collab-edit plugin
-        // filters out any transactions with steps (even analytics) when it's initialising
-        api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent({
-          action: ACTION.INITIALISED,
-          actionSubject: ACTION_SUBJECT.LOOM,
-          eventType: EVENT_TYPE.OPERATIONAL
-        });
-      };
-      if (config) {
-        setupLoom();
+      if (config.loomProvider) {
+        setupLoom(config.loomProvider, api, editorView);
       }
       return {};
     }

package/dist/es2019/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/ui/PrimaryToolbarButton.js

@@ -0,0 +1,84 @@
+import _extends from "@babel/runtime/helpers/extends";
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+import React, { useCallback } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import { jsx } from '@emotion/react';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
+import { executeRecordVideo } from '../commands';
+import { loomPluginKey } from '../pm-plugin';
+import ToolbarButtonComponent from './ToolbarButtonComponent';
+const CustomisableLoomToolbarButton = (editorView, disabled, appearance, api) => /*#__PURE__*/React.forwardRef((props, ref) => {
+  var _loomPluginKey$getSta;
+  const {
+    onClickBeforeInit,
+    isDisabled = false,
+    href,
+    ...restProps
+  } = props;
+  const isLoomEnabled = (_loomPluginKey$getSta = loomPluginKey.getState(editorView.state)) === null || _loomPluginKey$getSta === void 0 ? void 0 : _loomPluginKey$getSta.isEnabled;
+  const handleOnClick = useCallback(e => {
+    if (isLoomEnabled) {
+      executeRecordVideo(api);
+    } else {
+      onClickBeforeInit && onClickBeforeInit(e);
+    }
+  }, [isLoomEnabled, onClickBeforeInit]);
+  return jsx(ToolbarButtonComponent, _extends({
+    ref: ref,
+    hideTooltip: !!(restProps.onMouseEnter || restProps.onMouseLeave)
+    // Ignore href if Loom is enabled so that it doesn't interfere with recording
+    ,
+    href: isLoomEnabled ? undefined : href,
+    disabled: disabled || isDisabled,
+    api: api,
+    appearance: appearance,
+    onClick: e => handleOnClick(e)
+  }, restProps));
+});
+const LoomToolbarButtonWrapper = ({
+  disabled,
+  api,
+  appearance
+}) => {
+  const handleOnClick = useCallback(() => executeRecordVideo(api), [api]);
+  const {
+    loomState
+  } = useSharedPluginState(api, ['loom']);
+  if (!loomState) {
+    return null;
+  }
+  return jsx(ToolbarButtonComponent
+  // Disable the icon while the SDK isn't initialised
+  , {
+    disabled: disabled || !(loomState !== null && loomState !== void 0 && loomState.isEnabled),
+    api: api,
+    appearance: appearance,
+    onClick: handleOnClick
+  });
+};
+export const loomPrimaryToolbarComponent = (config, api) => ({
+  disabled,
+  appearance,
+  editorView
+}) => {
+  if (config.shouldShowToolbarButton === false) {
+    return null;
+  }
+  if (config.renderButton) {
+    return config.renderButton(CustomisableLoomToolbarButton(editorView, disabled, appearance, api));
+  }
+  if (config.shouldShowToolbarButton) {
+    return jsx(LoomToolbarButtonWrapper
+    // Disable the icon while the SDK isn't initialised
+    , {
+      disabled: disabled,
+      api: api,
+      appearance: appearance
+    });
+  }
+  return null;
+};

package/dist/es2019/ui/{ToolbarButton.js → ToolbarButtonComponent.js}

@@ -2,53 +2,71 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
+import React from 'react';
+
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
-import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { toolbarInsertBlockMessages } from '@atlaskit/editor-common/messages';
 import { TOOLBAR_BUTTON, ToolbarButton } from '@atlaskit/editor-common/ui-menu';
 import { LoomIcon } from '@atlaskit/logo';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { recordVideo } from '../commands';
 // This const is derived from the breakpoint where the toolbar hides its icons. It is used to hide the text in the AI button.
 // Derived from values from platform/packages/editor/editor-core/src/ui/Appearance/FullPage/MainToolbar.tsx
 const LOOM_BUTTON_WIDTH_BREAKPOINT = 1076;
-const LoomToolbarButton = ({
+const LoomToolbarButtonInternal = /*#__PURE__*/React.forwardRef(({
   disabled,
   api,
   appearance,
   intl: {
     formatMessage
-  }
-}) => {
+  },
+  selected,
+  onBlur,
+  onFocus,
+  onKeyDown,
+  onMouseEnter,
+  onMouseLeave,
+  'aria-controls': ariaControls,
+  'aria-expanded': ariaExpanded,
+  'aria-haspopup': ariaHasPopup,
+  'data-ds--level': dataDsLevel,
+  onClick,
+  href,
+  target,
+  hideTooltip
+}, ref) => {
   const {
-    loomState,
     widthState
   } = useSharedPluginState(api, ['loom', 'width']);
-  if (!loomState) {
-    return null;
-  }
   const label = formatMessage(appearance === 'comment' ? toolbarInsertBlockMessages.addLoomVideoComment : toolbarInsertBlockMessages.addLoomVideo);
   const shouldShowRecordText = fg('platform.editor.plugin.loom.responsive-menu_4at4a') && ((widthState === null || widthState === void 0 ? void 0 : widthState.width) || 0) > LOOM_BUTTON_WIDTH_BREAKPOINT;
   return jsx(ToolbarButton, {
+    hideTooltip: hideTooltip,
+    ref: ref,
+    href: href,
     buttonId: TOOLBAR_BUTTON.RECORD_VIDEO,
-    onClick: () => {
-      var _api$core, _api$analytics;
-      return api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : _api$core.actions.execute(recordVideo({
-        inputMethod: INPUT_METHOD.TOOLBAR,
-        editorAnalyticsAPI: api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions
-      }));
-    }
-    // Disable the icon while the SDK isn't initialised
-    ,
-    disabled: disabled || !(loomState !== null && loomState !== void 0 && loomState.isEnabled),
+    disabled: disabled,
     title: label,
     iconBefore: jsx(LoomIcon, {
       label: label,
       size: "small"
-    })
+    }),
+    selected: selected,
+    onBlur: onBlur,
+    onFocus: onFocus,
+    onKeyDown: onKeyDown,
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave,
+    "aria-controls": ariaControls,
+    "aria-expanded": ariaExpanded,
+    "aria-haspopup": ariaHasPopup,
+    "data-ds--level": dataDsLevel,
+    onClick: onClick,
+    target: target
   }, shouldShowRecordText && formatMessage(toolbarInsertBlockMessages.recordLoomShortTitle));
-};
-export default injectIntl(LoomToolbarButton);
+});
+export default injectIntl(LoomToolbarButtonInternal, {
+  forwardRef: true
+});

package/dist/es2019/ui/quickInsert.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { toolbarInsertBlockMessages } from '@atlaskit/editor-common/messages';
+import { logException } from '@atlaskit/editor-common/monitoring';
+import { LoomIcon } from '@atlaskit/logo';
+import { recordVideo, recordVideoFailed } from '../commands';
+import { loomPluginKey } from '../pm-plugin';
+export const getQuickInsertItem = editorAnalyticsAPI => ({
+  formatMessage
+}) => [{
+  id: 'loom',
+  title: formatMessage(toolbarInsertBlockMessages.recordVideo),
+  description: formatMessage(toolbarInsertBlockMessages.recordVideoDescription),
+  keywords: ['loom', 'record', 'video'],
+  priority: 800,
+  icon: () => /*#__PURE__*/React.createElement(LoomIcon, {
+    appearance: "brand"
+  }),
+  action(insert, editorState) {
+    var _recordVideo;
+    const tr = insert(undefined);
+    const loomState = loomPluginKey.getState(editorState);
+    if (!(loomState !== null && loomState !== void 0 && loomState.isEnabled)) {
+      var _recordVideoFailed;
+      const errorMessage = loomState === null || loomState === void 0 ? void 0 : loomState.error;
+      logException(new Error(errorMessage), {
+        location: 'editor-plugin-loom/quick-insert-record-video'
+      });
+      return (_recordVideoFailed = recordVideoFailed({
+        inputMethod: INPUT_METHOD.QUICK_INSERT,
+        error: errorMessage,
+        editorAnalyticsAPI
+      })({
+        tr
+      })) !== null && _recordVideoFailed !== void 0 ? _recordVideoFailed : false;
+    }
+    return (_recordVideo = recordVideo({
+      inputMethod: INPUT_METHOD.QUICK_INSERT,
+      editorAnalyticsAPI
+    })({
+      tr
+    })) !== null && _recordVideo !== void 0 ? _recordVideo : false;
+  }
+}];

package/dist/esm/commands.js

@@ -1,5 +1,9 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { logException } from '@atlaskit/editor-common/monitoring';
 import { LoomPluginAction, loomPluginKey } from './pm-plugin';
+import { getQuickInsertItem } from './ui/quickInsert';
 export var enableLoom = function enableLoom(_ref) {
   var loomButton = _ref.loomButton;
   return function (_ref2) {
@@ -110,4 +114,106 @@ export var insertLoom = function insertLoom(editorView, api, video, positionType
     to = _getPositions.to;
   return (_api$hyperlink$action = api === null || api === void 0 || (_api$hyperlink = api.hyperlink) === null || _api$hyperlink === void 0 ? void 0 : _api$hyperlink.actions.insertLink(INPUT_METHOD.TYPEAHEAD, from, to, video.sharedUrl, video.title, undefined, undefined, undefined, 'embed' // Convert to embed card instead of inline
   )(state, dispatch)) !== null && _api$hyperlink$action !== void 0 ? _api$hyperlink$action : false;
-};
+};
+export var executeRecordVideo = function executeRecordVideo(api) {
+  var _api$core, _api$analytics;
+  api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(recordVideo({
+    inputMethod: INPUT_METHOD.TOOLBAR,
+    editorAnalyticsAPI: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions
+  }));
+};
+export var setupLoom = /*#__PURE__*/function () {
+  var _ref11 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(loomProvider, api, editorView, isAfterEditorLoaded) {
+    var _api$core4;
+    var clientResult, _api$core2, _api$analytics2, attachToButton, loomButton, _api$analytics6;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _context.next = 2;
+          return loomProvider.getClient();
+        case 2:
+          clientResult = _context.sent;
+          if (!(clientResult.status === 'error')) {
+            _context.next = 8;
+            break;
+          }
+          api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(disableLoom({
+            error: clientResult.message
+          }));
+          logException(new Error(clientResult.message), {
+            location: 'editor-plugin-loom/sdk-initialisation'
+          });
+          api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 || _api$analytics2.actions.fireAnalyticsEvent({
+            action: ACTION.ERRORED,
+            actionSubject: ACTION_SUBJECT.LOOM,
+            eventType: EVENT_TYPE.OPERATIONAL,
+            attributes: {
+              error: clientResult.message
+            }
+          });
+          return _context.abrupt("return", {
+            error: clientResult.message
+          });
+        case 8:
+          attachToButton = clientResult.client.attachToButton; // Hidden element to work around the SDK API
+          loomButton = document.createElement('button');
+          attachToButton({
+            button: loomButton,
+            onInsert: function onInsert(video) {
+              var _api$hyperlink2, _api$core3, _api$analytics3;
+              if (!editorView) {
+                return;
+              }
+              var state = editorView.state,
+                dispatch = editorView.dispatch;
+              var pos = state.selection.from;
+              api === null || api === void 0 || (_api$hyperlink2 = api.hyperlink) === null || _api$hyperlink2 === void 0 || _api$hyperlink2.actions.insertLink(INPUT_METHOD.TYPEAHEAD, pos,
+              // from === to, don't replace text to avoid accidental content loss
+              pos, video.sharedUrl, video.title, undefined, undefined, undefined, 'embed' // Convert to embed card instead of inline
+              )(state, dispatch);
+              api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(insertVideo({
+                editorAnalyticsAPI: api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions,
+                video: video
+              }));
+            }
+          });
+          api === null || api === void 0 || (_api$core4 = api.core) === null || _api$core4 === void 0 || _api$core4.actions.execute(function (_ref12) {
+            var tr = _ref12.tr;
+            enableLoom({
+              loomButton: loomButton
+            })({
+              tr: tr
+            });
+            if (isAfterEditorLoaded) {
+              var _api$quickInsert, _api$analytics4, _api$analytics5;
+              api === null || api === void 0 || (_api$quickInsert = api.quickInsert) === null || _api$quickInsert === void 0 || _api$quickInsert.commands.addQuickInsertItem(getQuickInsertItem(api === null || api === void 0 || (_api$analytics4 = api.analytics) === null || _api$analytics4 === void 0 ? void 0 : _api$analytics4.actions))({
+                tr: tr
+              });
+              api === null || api === void 0 || (_api$analytics5 = api.analytics) === null || _api$analytics5 === void 0 || _api$analytics5.actions.attachAnalyticsEvent({
+                action: ACTION.INITIALISED,
+                actionSubject: ACTION_SUBJECT.LOOM,
+                eventType: EVENT_TYPE.OPERATIONAL
+              })(tr);
+            }
+            return tr;
+          });
+          if (!isAfterEditorLoaded) {
+            // We're not combining the analytics steps into the enable / disable commands because the collab-edit plugin
+            // filters out any transactions with steps (even analytics) when it's initialising
+            api === null || api === void 0 || (_api$analytics6 = api.analytics) === null || _api$analytics6 === void 0 || _api$analytics6.actions.fireAnalyticsEvent({
+              action: ACTION.INITIALISED,
+              actionSubject: ACTION_SUBJECT.LOOM,
+              eventType: EVENT_TYPE.OPERATIONAL
+            });
+          }
+          return _context.abrupt("return", {});
+        case 14:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+  return function setupLoom(_x, _x2, _x3, _x4) {
+    return _ref11.apply(this, arguments);
+  };
+}();