import { jsx as i, jsxs as S } from "react/jsx-runtime";
import { Plate as g, PlateContent as z } from "@udecode/plate-core";
import { noop as D } from "lodash-es";
import { useMemo as j, useCallback as T } from "react";
import { BlurObserver as B } from "./BlurObserver.es.js";
import { useMemoizedId as H } from "../../hooks/useMemoizedId.es.js";
import { merge as U } from "../../utilities/merge.es.js";
import { ContentReplacement as A } from "./ContentReplacement.es.js";
import { RichTextEditorProvider as J } from "./context/RichTextEditorContext.es.js";
import { PaddingSizes as Y } from "./types.es.js";
import { useEditorState as b } from "./hooks/useEditorState.es.js";
import { KEY_ELEMENT_BREAK_AFTER_COLUMN as q, GAP_DEFAULT as v } from "./Plugins/ColumnBreakPlugin/createColumnBreakPlugin.es.js";
import { forceToFocusNextElement as Q } from "./helpers/forceToFocusElement.es.js";
import { RenderPlaceholder as W } from "./components/RenderPlaceholder/RenderPlaceholder.es.js";
import { Position as h } from "./components/EditorPositioningWrapper/types.es.js";
import { defaultPlugins as X } from "./Plugins/defaultPlugins.es.js";
import { parseRawValue as Z } from "./utils/parseRawValue.es.js";
const $ = ({
  id: N,
  value: m,
  placeholder: R = "",
  readonly: x = !1,
  onTextChange: C,
  onBlur: n,
  padding: F = Y.None,
  position: l = h.FLOATING,
  plugins: s = X,
  updateValueOnChange: O = !1,
  onValueChanged: V,
  border: w = !0,
  toolbarWidth: I,
  hideExternalFloatingModals: K
}) => {
  var u, E, y;
  const t = H(N), { localValue: a, onChange: L, memoizedValue: P, config: r } = b({
    editorId: t,
    initialValue: m,
    onTextChange: C,
    plugins: s,
    onValueChanged: V
  }), o = s.plugins.find((e) => e.key === q), c = (u = o == null ? void 0 : o.options) == null ? void 0 : u.customClass, d = c ? null : ((E = o == null ? void 0 : o.options) == null ? void 0 : E.columns) ?? 1, p = ((y = o == null ? void 0 : o.options) == null ? void 0 : y.gap) ?? v, _ = j(
    () => ({
      columns: d,
      columnGap: p,
      outline: "none"
    }),
    [d, p]
  ), G = T(() => {
    n && n(JSON.stringify(a.current));
  }, [n, a]), M = T((e) => {
    e.code === "Tab" && Q(e, !e.shiftKey);
  }, []), f = {
    placeholder: R,
    renderPlaceholder: W,
    readOnly: x,
    onBlur: G,
    className: U([F, c]),
    style: _,
    onKeyDown: M,
    scrollSelectionIntoView: D
  };
  return /* @__PURE__ */ i(J, { styles: r.styles(), position: l, border: w, editorId: t, children: /* @__PURE__ */ S(g, { id: t, onChange: L, plugins: r.plugins, initialValue: P, children: [
    /* @__PURE__ */ i(z, { ...f }),
    !f.readOnly && r.toolbar(I),
    r.inline(),
    O && /* @__PURE__ */ i(A, { value: Z({ editorId: t, raw: m, plugins: s }) }),
    l === h.FLOATING && /* @__PURE__ */ i(B, { hideExternalFloatingModals: K })
  ] }) });
};
$.displayName = "FondueRichTextEditor";
export {
  $ as RichTextEditor
};
//# sourceMappingURL=RichTextEditor.es.js.map
