@atlaskit/editor-core/dist/cjs/use-preset.js

A package contains Atlassian editor core functionality

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.usePreset = usePreset;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = require("react");
var _preset = require("@atlaskit/editor-common/preset");
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
// eslint-disable-next-line @typescript-eslint/no-explicit-any

/**
 * Creates a preset.
 *
 * Takes an input function that returns a preset (and memoizes it) depending
 * on the dependency array provided.
 *
 * Returns a pluginInjectionApi in order to apply actions and subscribe to plugin
 * changes outside of the editor.
 *
 * @param createPreset
 * @param dependencies
 * @returns PresetAPI ({ pluginInjectionApi, preset, actionBuilder })
 *
 * Example:
 * ```ts
 * function ExampleEditor() {
 *   const { preset, editorApi } = usePreset((builder) =>
 *     builder.add(plugin1).add(plugin2)
 *   , []);
 *
 *   // Can execute typesafe commands based on plugin1 or 2
 *   const runCommand = () => editorApi.core.actions.execute(
 *     editorApi.plugin1.commands.doSomething()
 *   )
 *   return (
 *     <>
 *       <Editor preset={preset} />
 *       <Button onClick={runCommand}>Run command</Button>
 *     </>
 *   )
 * }
 * ```
 */
function usePreset(createPreset) {
  var dependencies = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
  var _useState = (0, _react.useState)(undefined),
    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
    editorApi = _useState2[0],
    setAPI = _useState2[1];
  var preset = (0, _react.useMemo)(function () {
    return createPreset(new _preset.EditorPresetBuilder());
  },
  // eslint-disable-next-line react-hooks/exhaustive-deps
  dependencies);
  (0, _react.useLayoutEffect)(function () {
    if ((0, _platformFeatureFlags.fg)('platform_editor_fix_api_strict_mode')) {
      return preset.apiResolver.on(function (api) {
        setAPI(api);
      });
    }
  }, [preset.apiResolver]);

  // Deprecated approach (not compatible with strict mode)
  (0, _react.useLayoutEffect)(function () {
    if (!(0, _platformFeatureFlags.fg)('platform_editor_fix_api_strict_mode')) {
      preset.apiPromise.then(function (api) {
        setAPI(api);
      });
    }
  }, [preset.apiPromise]);
  return {
    editorApi: editorApi,
    preset: preset
  };
}