UNPKG

@blocknote/react

Version:

A "Notion-style" block-based extensible text editor built on top of Prosemirror and Tiptap.

1,373 lines (1,370 loc) 100 kB
import D, { createContext as Wn, useContext as qn, useEffect as B, useMemo as E, useState as p, forwardRef as ee, useRef as K, useCallback as V, createElement as Yn, Children as Kn } from "react"; import { mergeCSSClasses as ue, isSafari as Ne, formatKeyboardShortcut as ye, checkBlockIsDefaultType as Pt, checkDefaultBlockTypeInSchema as Dt, checkBlockHasDefaultProp as Ze, checkBlockTypeHasDefaultProp as le, getDefaultSlashMenuItems as Gn, filterSuggestionItems as Ot, BlockNoteEditor as Jn, inheritedProps as Qn, camelToDataKebab as At, createStronglyTypedTiptapNode as Ft, propsToAttributes as Nt, getParseRules as Xn, getBlockFromPos as er, createInternalBlockSpec as tr, addInlineContentKeyboardShortcuts as nr, getInlineContentParseRules as rr, nodeToCustomInlineContent as jt, addInlineContentAttributes as or, createInternalInlineContentSpec as ir, stylePropsToAttributes as ar, getStyleParseRules as lr, addStyleAttributes as sr, createInternalStyleSpec as cr } from "@blocknote/core"; import { useFloating as Zt, useTransitionStyles as zt, offset as de, flip as Se, size as ur } from "@floating-ui/react"; import { Group as je, Stack as Ke, Text as se, Tooltip as dr, Button as Ge, ActionIcon as Ut, Box as $t, Menu as j, Popover as X, TextInput as Wt, FileInput as qt, Tabs as Q, LoadingOverlay as fr, Badge as gr, Loader as hr, MantineProvider as mr } from "@mantine/core"; import br from "use-prefers-color-scheme"; import xr, { flushSync as Yt, createPortal as Kt } from "react-dom"; import { NodeViewWrapper as Gt, ReactNodeViewRenderer as Jt, NodeViewContent as Qt, Mark as vr } from "@tiptap/react"; const Xt = Wn(void 0); function te(e) { return qn(Xt); } var ze = { exports: {} }, ie = {}; /** * @license React * react-jsx-runtime.production.min.js * * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var wt; function kr() { if (wt) return ie; wt = 1; var e = D, t = Symbol.for("react.element"), n = Symbol.for("react.fragment"), r = Object.prototype.hasOwnProperty, a = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, l = { key: !0, ref: !0, __self: !0, __source: !0 }; function c(s, d, f) { var h, b = {}, T = null, L = null; f !== void 0 && (T = "" + f), d.key !== void 0 && (T = "" + d.key), d.ref !== void 0 && (L = d.ref); for (h in d) r.call(d, h) && !l.hasOwnProperty(h) && (b[h] = d[h]); if (s && s.defaultProps) for (h in d = s.defaultProps, d) b[h] === void 0 && (b[h] = d[h]); return { $$typeof: t, type: s, key: T, ref: L, props: b, _owner: a.current }; } return ie.Fragment = n, ie.jsx = c, ie.jsxs = c, ie; } var ae = {}; /** * @license React * react-jsx-runtime.development.js * * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var Tt; function pr() { return Tt || (Tt = 1, process.env.NODE_ENV !== "production" && function() { var e = D, t = Symbol.for("react.element"), n = Symbol.for("react.portal"), r = Symbol.for("react.fragment"), a = Symbol.for("react.strict_mode"), l = Symbol.for("react.profiler"), c = Symbol.for("react.provider"), s = Symbol.for("react.context"), d = Symbol.for("react.forward_ref"), f = Symbol.for("react.suspense"), h = Symbol.for("react.suspense_list"), b = Symbol.for("react.memo"), T = Symbol.for("react.lazy"), L = Symbol.for("react.offscreen"), U = Symbol.iterator, Te = "@@iterator"; function $(i) { if (i === null || typeof i != "object") return null; var u = U && i[U] || i[Te]; return typeof u == "function" ? u : null; } var N = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; function M(i) { { for (var u = arguments.length, g = new Array(u > 1 ? u - 1 : 0), m = 1; m < u; m++) g[m - 1] = arguments[m]; He("error", i, g); } } function He(i, u, g) { { var m = N.ReactDebugCurrentFrame, k = m.getStackAddendum(); k !== "" && (u += "%s", g = g.concat([k])); var S = g.map(function(v) { return String(v); }); S.unshift("Warning: " + u), Function.prototype.apply.call(console[i], console, S); } } var W = !1, ge = !1, Ee = !1, Me = !1, Re = !1, q; q = Symbol.for("react.module.reference"); function kn(i) { return !!(typeof i == "string" || typeof i == "function" || i === r || i === l || Re || i === a || i === f || i === h || Me || i === L || W || ge || Ee || typeof i == "object" && i !== null && (i.$$typeof === T || i.$$typeof === b || i.$$typeof === c || i.$$typeof === s || i.$$typeof === d || // This needs to include all possible module reference object // types supported by any Flight configuration anywhere since // we don't know which Flight build this will end up being used // with. i.$$typeof === q || i.getModuleId !== void 0)); } function pn(i, u, g) { var m = i.displayName; if (m) return m; var k = u.displayName || u.name || ""; return k !== "" ? g + "(" + k + ")" : g; } function tt(i) { return i.displayName || "Context"; } function O(i) { if (i == null) return null; if (typeof i.tag == "number" && M("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof i == "function") return i.displayName || i.name || null; if (typeof i == "string") return i; switch (i) { case r: return "Fragment"; case n: return "Portal"; case l: return "Profiler"; case a: return "StrictMode"; case f: return "Suspense"; case h: return "SuspenseList"; } if (typeof i == "object") switch (i.$$typeof) { case s: var u = i; return tt(u) + ".Consumer"; case c: var g = i; return tt(g._context) + ".Provider"; case d: return pn(i, i.render, "ForwardRef"); case b: var m = i.displayName || null; return m !== null ? m : O(i.type) || "Memo"; case T: { var k = i, S = k._payload, v = k._init; try { return O(v(S)); } catch { return null; } } } return null; } var Y = Object.assign, re = 0, nt, rt, ot, it, at, lt, st; function ct() { } ct.__reactDisabledLog = !0; function Cn() { { if (re === 0) { nt = console.log, rt = console.info, ot = console.warn, it = console.error, at = console.group, lt = console.groupCollapsed, st = console.groupEnd; var i = { configurable: !0, enumerable: !0, value: ct, writable: !0 }; Object.defineProperties(console, { info: i, log: i, warn: i, error: i, group: i, groupCollapsed: i, groupEnd: i }); } re++; } } function yn() { { if (re--, re === 0) { var i = { configurable: !0, enumerable: !0, writable: !0 }; Object.defineProperties(console, { log: Y({}, i, { value: nt }), info: Y({}, i, { value: rt }), warn: Y({}, i, { value: ot }), error: Y({}, i, { value: it }), group: Y({}, i, { value: at }), groupCollapsed: Y({}, i, { value: lt }), groupEnd: Y({}, i, { value: st }) }); } re < 0 && M("disabledDepth fell below zero. This is a bug in React. Please file an issue."); } } var Ve = N.ReactCurrentDispatcher, Le; function he(i, u, g) { { if (Le === void 0) try { throw Error(); } catch (k) { var m = k.stack.trim().match(/\n( *(at )?)/); Le = m && m[1] || ""; } return ` ` + Le + i; } } var Be = !1, me; { var Sn = typeof WeakMap == "function" ? WeakMap : Map; me = new Sn(); } function ut(i, u) { if (!i || Be) return ""; { var g = me.get(i); if (g !== void 0) return g; } var m; Be = !0; var k = Error.prepareStackTrace; Error.prepareStackTrace = void 0; var S; S = Ve.current, Ve.current = null, Cn(); try { if (u) { var v = function() { throw Error(); }; if (Object.defineProperty(v.prototype, "props", { set: function() { throw Error(); } }), typeof Reflect == "object" && Reflect.construct) { try { Reflect.construct(v, []); } catch (A) { m = A; } Reflect.construct(i, [], v); } else { try { v.call(); } catch (A) { m = A; } i.call(v.prototype); } } else { try { throw Error(); } catch (A) { m = A; } i(); } } catch (A) { if (A && m && typeof A.stack == "string") { for (var x = A.stack.split(` `), I = m.stack.split(` `), H = x.length - 1, R = I.length - 1; H >= 1 && R >= 0 && x[H] !== I[R]; ) R--; for (; H >= 1 && R >= 0; H--, R--) if (x[H] !== I[R]) { if (H !== 1 || R !== 1) do if (H--, R--, R < 0 || x[H] !== I[R]) { var _ = ` ` + x[H].replace(" at new ", " at "); return i.displayName && _.includes("<anonymous>") && (_ = _.replace("<anonymous>", i.displayName)), typeof i == "function" && me.set(i, _), _; } while (H >= 1 && R >= 0); break; } } } finally { Be = !1, Ve.current = S, yn(), Error.prepareStackTrace = k; } var J = i ? i.displayName || i.name : "", St = J ? he(J) : ""; return typeof i == "function" && me.set(i, St), St; } function jn(i, u, g) { return ut(i, !1); } function wn(i) { var u = i.prototype; return !!(u && u.isReactComponent); } function be(i, u, g) { if (i == null) return ""; if (typeof i == "function") return ut(i, wn(i)); if (typeof i == "string") return he(i); switch (i) { case f: return he("Suspense"); case h: return he("SuspenseList"); } if (typeof i == "object") switch (i.$$typeof) { case d: return jn(i.render); case b: return be(i.type, u, g); case T: { var m = i, k = m._payload, S = m._init; try { return be(S(k), u, g); } catch { } } } return ""; } var xe = Object.prototype.hasOwnProperty, dt = {}, ft = N.ReactDebugCurrentFrame; function ve(i) { if (i) { var u = i._owner, g = be(i.type, i._source, u ? u.type : null); ft.setExtraStackFrame(g); } else ft.setExtraStackFrame(null); } function Tn(i, u, g, m, k) { { var S = Function.call.bind(xe); for (var v in i) if (S(i, v)) { var x = void 0; try { if (typeof i[v] != "function") { var I = Error((m || "React class") + ": " + g + " type `" + v + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof i[v] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."); throw I.name = "Invariant Violation", I; } x = i[v](u, v, m, g, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"); } catch (H) { x = H; } x && !(x instanceof Error) && (ve(k), M("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", m || "React class", g, v, typeof x), ve(null)), x instanceof Error && !(x.message in dt) && (dt[x.message] = !0, ve(k), M("Failed %s type: %s", g, x.message), ve(null)); } } } var Hn = Array.isArray; function Ie(i) { return Hn(i); } function En(i) { { var u = typeof Symbol == "function" && Symbol.toStringTag, g = u && i[Symbol.toStringTag] || i.constructor.name || "Object"; return g; } } function Mn(i) { try { return gt(i), !1; } catch { return !0; } } function gt(i) { return "" + i; } function ht(i) { if (Mn(i)) return M("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", En(i)), gt(i); } var oe = N.ReactCurrentOwner, Rn = { key: !0, ref: !0, __self: !0, __source: !0 }, mt, bt, _e; _e = {}; function Vn(i) { if (xe.call(i, "ref")) { var u = Object.getOwnPropertyDescriptor(i, "ref").get; if (u && u.isReactWarning) return !1; } return i.ref !== void 0; } function Ln(i) { if (xe.call(i, "key")) { var u = Object.getOwnPropertyDescriptor(i, "key").get; if (u && u.isReactWarning) return !1; } return i.key !== void 0; } function Bn(i, u) { if (typeof i.ref == "string" && oe.current && u && oe.current.stateNode !== u) { var g = O(oe.current.type); _e[g] || (M('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', O(oe.current.type), i.ref), _e[g] = !0); } } function In(i, u) { { var g = function() { mt || (mt = !0, M("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", u)); }; g.isReactWarning = !0, Object.defineProperty(i, "key", { get: g, configurable: !0 }); } } function _n(i, u) { { var g = function() { bt || (bt = !0, M("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", u)); }; g.isReactWarning = !0, Object.defineProperty(i, "ref", { get: g, configurable: !0 }); } } var Pn = function(i, u, g, m, k, S, v) { var x = { // This tag allows us to uniquely identify this as a React Element $$typeof: t, // Built-in properties that belong on the element type: i, key: u, ref: g, props: v, // Record the component responsible for creating this element. _owner: S }; return x._store = {}, Object.defineProperty(x._store, "validated", { configurable: !1, enumerable: !1, writable: !0, value: !1 }), Object.defineProperty(x, "_self", { configurable: !1, enumerable: !1, writable: !1, value: m }), Object.defineProperty(x, "_source", { configurable: !1, enumerable: !1, writable: !1, value: k }), Object.freeze && (Object.freeze(x.props), Object.freeze(x)), x; }; function Dn(i, u, g, m, k) { { var S, v = {}, x = null, I = null; g !== void 0 && (ht(g), x = "" + g), Ln(u) && (ht(u.key), x = "" + u.key), Vn(u) && (I = u.ref, Bn(u, k)); for (S in u) xe.call(u, S) && !Rn.hasOwnProperty(S) && (v[S] = u[S]); if (i && i.defaultProps) { var H = i.defaultProps; for (S in H) v[S] === void 0 && (v[S] = H[S]); } if (x || I) { var R = typeof i == "function" ? i.displayName || i.name || "Unknown" : i; x && In(v, R), I && _n(v, R); } return Pn(i, x, I, k, m, oe.current, v); } } var Pe = N.ReactCurrentOwner, xt = N.ReactDebugCurrentFrame; function G(i) { if (i) { var u = i._owner, g = be(i.type, i._source, u ? u.type : null); xt.setExtraStackFrame(g); } else xt.setExtraStackFrame(null); } var De; De = !1; function Oe(i) { return typeof i == "object" && i !== null && i.$$typeof === t; } function vt() { { if (Pe.current) { var i = O(Pe.current.type); if (i) return ` Check the render method of \`` + i + "`."; } return ""; } } function On(i) { { if (i !== void 0) { var u = i.fileName.replace(/^.*[\\\/]/, ""), g = i.lineNumber; return ` Check your code at ` + u + ":" + g + "."; } return ""; } } var kt = {}; function An(i) { { var u = vt(); if (!u) { var g = typeof i == "string" ? i : i.displayName || i.name; g && (u = ` Check the top-level render call using <` + g + ">."); } return u; } } function pt(i, u) { { if (!i._store || i._store.validated || i.key != null) return; i._store.validated = !0; var g = An(u); if (kt[g]) return; kt[g] = !0; var m = ""; i && i._owner && i._owner !== Pe.current && (m = " It was passed a child from " + O(i._owner.type) + "."), G(i), M('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', g, m), G(null); } } function Ct(i, u) { { if (typeof i != "object") return; if (Ie(i)) for (var g = 0; g < i.length; g++) { var m = i[g]; Oe(m) && pt(m, u); } else if (Oe(i)) i._store && (i._store.validated = !0); else if (i) { var k = $(i); if (typeof k == "function" && k !== i.entries) for (var S = k.call(i), v; !(v = S.next()).done; ) Oe(v.value) && pt(v.value, u); } } } function Fn(i) { { var u = i.type; if (u == null || typeof u == "string") return; var g; if (typeof u == "function") g = u.propTypes; else if (typeof u == "object" && (u.$$typeof === d || // Note: Memo only checks outer props here. // Inner props are checked in the reconciler. u.$$typeof === b)) g = u.propTypes; else return; if (g) { var m = O(u); Tn(g, i.props, "prop", m, i); } else if (u.PropTypes !== void 0 && !De) { De = !0; var k = O(u); M("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", k || "Unknown"); } typeof u.getDefaultProps == "function" && !u.getDefaultProps.isReactClassApproved && M("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead."); } } function Nn(i) { { for (var u = Object.keys(i.props), g = 0; g < u.length; g++) { var m = u[g]; if (m !== "children" && m !== "key") { G(i), M("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", m), G(null); break; } } i.ref !== null && (G(i), M("Invalid attribute `ref` supplied to `React.Fragment`."), G(null)); } } function yt(i, u, g, m, k, S) { { var v = kn(i); if (!v) { var x = ""; (i === void 0 || typeof i == "object" && i !== null && Object.keys(i).length === 0) && (x += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."); var I = On(k); I ? x += I : x += vt(); var H; i === null ? H = "null" : Ie(i) ? H = "array" : i !== void 0 && i.$$typeof === t ? (H = "<" + (O(i.type) || "Unknown") + " />", x = " Did you accidentally export a JSX literal instead of a component?") : H = typeof i, M("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", H, x); } var R = Dn(i, u, g, k, S); if (R == null) return R; if (v) { var _ = u.children; if (_ !== void 0) if (m) if (Ie(_)) { for (var J = 0; J < _.length; J++) Ct(_[J], i); Object.freeze && Object.freeze(_); } else M("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."); else Ct(_, i); } return i === r ? Nn(R) : Fn(R), R; } } function Zn(i, u, g) { return yt(i, u, g, !0); } function zn(i, u, g) { return yt(i, u, g, !1); } var Un = zn, $n = Zn; ae.Fragment = r, ae.jsx = Un, ae.jsxs = $n; }()), ae; } process.env.NODE_ENV === "production" ? ze.exports = kr() : ze.exports = pr(); var o = ze.exports; function w(e) { const t = te(); if (!(t != null && t.editor)) throw new Error( "useBlockNoteEditor was called outside of a BlockNoteContext provider or BlockNoteView component" ); return t.editor; } function Je(e, t) { const n = te(); t || (t = n == null ? void 0 : n.editor), B(() => { if (!t) throw new Error( "'editor' is required, either from BlockNoteContext or as a function argument" ); return t.onChange(e); }, [e, t]); } function Qe(e, t) { const n = te(); t || (t = n == null ? void 0 : n.editor), B(() => { if (!t) throw new Error( "'editor' is required, either from BlockNoteContext or as a function argument" ); return t.onSelectionChange(e); }, [e, t]); } function z(e, t) { Je(e, t), Qe(e, t); } function fe(e, t, n, r) { const { refs: a, update: l, context: c, floatingStyles: s } = Zt({ open: e, ...r }), { isMounted: d, styles: f } = zt(c); return B(() => { l(); }, [t, l]), B(() => { t !== null && a.setReference({ getBoundingClientRect: () => t }); }, [t, a]), E( () => ({ isMounted: d, ref: a.setFloating, style: { display: "flex", ...f, ...s, zIndex: n } }), [s, d, a.setFloating, f, n] ); } function ne(e) { const [t, n] = p(); return B(() => e((r) => { n({ ...r }); }), [e]), t; } function en(e) { return (t) => { e.forEach((n) => { typeof n == "function" ? n(t) : n != null && (n.current = t); }); }; } const Ue = ee((e, t) => { const { className: n, children: r, ...a } = e; return /* @__PURE__ */ o.jsx( je, { className: ue("bn-toolbar", n || ""), ref: t, ...a, children: r } ); }); var tn = { color: void 0, size: void 0, className: void 0, style: void 0, attr: void 0 }, Ht = D.createContext && D.createContext(tn), Z = globalThis && globalThis.__assign || function() { return Z = Object.assign || function(e) { for (var t, n = 1, r = arguments.length; n < r; n++) { t = arguments[n]; for (var a in t) Object.prototype.hasOwnProperty.call(t, a) && (e[a] = t[a]); } return e; }, Z.apply(this, arguments); }, Cr = globalThis && globalThis.__rest || function(e, t) { var n = {}; for (var r in e) Object.prototype.hasOwnProperty.call(e, r) && t.indexOf(r) < 0 && (n[r] = e[r]); if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var a = 0, r = Object.getOwnPropertySymbols(e); a < r.length; a++) t.indexOf(r[a]) < 0 && Object.prototype.propertyIsEnumerable.call(e, r[a]) && (n[r[a]] = e[r[a]]); return n; }; function nn(e) { return e && e.map(function(t, n) { return D.createElement(t.tag, Z({ key: n }, t.attr), nn(t.child)); }); } function y(e) { return function(t) { return D.createElement(yr, Z({ attr: Z({}, e.attr) }, t), nn(e.child)); }; } function yr(e) { var t = function(n) { var r = e.attr, a = e.size, l = e.title, c = Cr(e, ["attr", "size", "title"]), s = a || n.size || "1em", d; return n.className && (d = n.className), e.className && (d = (d ? d + " " : "") + e.className), D.createElement("svg", Z({ stroke: "currentColor", fill: "currentColor", strokeWidth: "0" }, n.attr, r, c, { className: d, style: Z(Z({ color: e.color || n.color }, n.style), e.style), height: s, width: s, xmlns: "http://www.w3.org/2000/svg" }), l && D.createElement("title", null, l), e.children); }; return Ht !== void 0 ? D.createElement(Ht.Consumer, null, function(n) { return t(n); }) : t(tn); } function Sr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M23 11.9998L15.9289 19.0708L14.5147 17.6566L20.1716 11.9998L14.5147 6.34292L15.9289 4.92871L23 11.9998ZM3.82843 11.9998L9.48528 17.6566L8.07107 19.0708L1 11.9998L8.07107 4.92871L9.48528 6.34292L3.82843 11.9998Z" } }] })(e); } function jr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M3 4H21V6H3V4ZM5 19H19V21H5V19ZM3 14H21V16H3V14ZM5 9H19V11H5V9Z" } }] })(e); } function wr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M3 4H21V6H3V4ZM3 19H21V21H3V19ZM3 14H21V16H3V14ZM3 9H21V11H3V9Z" } }] })(e); } function Tr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M3 4H21V6H3V4ZM3 19H17V21H3V19ZM3 14H21V16H3V14ZM3 9H17V11H3V9Z" } }] })(e); } function Hr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M3 4H21V6H3V4ZM7 19H21V21H7V19ZM3 14H21V16H3V14ZM7 9H21V11H7V9Z" } }] })(e); } function Er(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M8 11H12.5C13.8807 11 15 9.88071 15 8.5C15 7.11929 13.8807 6 12.5 6H8V11ZM18 15.5C18 17.9853 15.9853 20 13.5 20H6V4H12.5C14.9853 4 17 6.01472 17 8.5C17 9.70431 16.5269 10.7981 15.7564 11.6058C17.0979 12.3847 18 13.837 18 15.5ZM8 13V18H13.5C14.8807 18 16 16.8807 16 15.5C16 14.1193 14.8807 13 13.5 13H8Z" } }] })(e); } function rn(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M13 20H11V13H4V20H2V4H4V11H11V4H13V20ZM21.0005 8V20H19.0005L19 10.204L17 10.74V8.67L19.5005 8H21.0005Z" } }] })(e); } function on(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M4 4V11H11V4H13V20H11V13H4V20H2V4H4ZM18.5 8C20.5711 8 22.25 9.67893 22.25 11.75C22.25 12.6074 21.9623 13.3976 21.4781 14.0292L21.3302 14.2102L18.0343 18H22V20H15L14.9993 18.444L19.8207 12.8981C20.0881 12.5908 20.25 12.1893 20.25 11.75C20.25 10.7835 19.4665 10 18.5 10C17.5818 10 16.8288 10.7071 16.7558 11.6065L16.75 11.75H14.75C14.75 9.67893 16.4289 8 18.5 8Z" } }] })(e); } function an(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M22 8L21.9984 10L19.4934 12.883C21.0823 13.3184 22.25 14.7728 22.25 16.5C22.25 18.5711 20.5711 20.25 18.5 20.25C16.674 20.25 15.1528 18.9449 14.8184 17.2166L16.7821 16.8352C16.9384 17.6413 17.6481 18.25 18.5 18.25C19.4665 18.25 20.25 17.4665 20.25 16.5C20.25 15.5335 19.4665 14.75 18.5 14.75C18.214 14.75 17.944 14.8186 17.7056 14.9403L16.3992 13.3932L19.3484 10H15V8H22ZM4 4V11H11V4H13V20H11V13H4V20H2V4H4Z" } }] })(e); } function Mr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M3 4H21V6H3V4ZM3 19H21V21H3V19ZM11 14H21V16H11V14ZM11 9H21V11H11V9ZM3 12.5L7 9V16L3 12.5Z" } }] })(e); } function Rr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M3 4H21V6H3V4ZM3 19H21V21H3V19ZM11 14H21V16H11V14ZM11 9H21V11H11V9ZM7 12.5L3 16V9L7 12.5Z" } }] })(e); } function Vr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M15 20H7V18H9.92661L12.0425 6H9V4H17V6H14.0734L11.9575 18H15V20Z" } }] })(e); } function Lr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M17 17H22V19H19V22H17V17ZM7 7H2V5H5V2H7V7ZM18.364 15.5355L16.9497 14.1213L18.364 12.7071C20.3166 10.7545 20.3166 7.58866 18.364 5.63604C16.4113 3.68342 13.2455 3.68342 11.2929 5.63604L9.87868 7.05025L8.46447 5.63604L9.87868 4.22183C12.6123 1.48816 17.0445 1.48816 19.7782 4.22183C22.5118 6.9555 22.5118 11.3877 19.7782 14.1213L18.364 15.5355ZM15.5355 18.364L14.1213 19.7782C11.3877 22.5118 6.9555 22.5118 4.22183 19.7782C1.48816 17.0445 1.48816 12.6123 4.22183 9.87868L5.63604 8.46447L7.05025 9.87868L5.63604 11.2929C3.68342 13.2455 3.68342 16.4113 5.63604 18.364C7.58866 20.3166 10.7545 20.3166 12.7071 18.364L14.1213 16.9497L15.5355 18.364ZM14.8284 7.75736L16.2426 9.17157L9.17157 16.2426L7.75736 14.8284L14.8284 7.75736Z" } }] })(e); } function ln(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M18.3643 15.5353L16.95 14.1211L18.3643 12.7069C20.3169 10.7543 20.3169 7.58847 18.3643 5.63585C16.4116 3.68323 13.2458 3.68323 11.2932 5.63585L9.87898 7.05007L8.46477 5.63585L9.87898 4.22164C12.6127 1.48797 17.0448 1.48797 19.7785 4.22164C22.5121 6.95531 22.5121 11.3875 19.7785 14.1211L18.3643 15.5353ZM15.5358 18.3638L14.1216 19.778C11.388 22.5117 6.9558 22.5117 4.22213 19.778C1.48846 17.0443 1.48846 12.6122 4.22213 9.87849L5.63634 8.46428L7.05055 9.87849L5.63634 11.2927C3.68372 13.2453 3.68372 16.4112 5.63634 18.3638C7.58896 20.3164 10.7548 20.3164 12.7074 18.3638L14.1216 16.9496L15.5358 18.3638ZM14.8287 7.75717L16.2429 9.17139L9.17187 16.2425L7.75766 14.8282L14.8287 7.75717Z" } }] })(e); } function sn(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M8 4H21V6H8V4ZM5 3V6H6V7H3V6H4V4H3V3H5ZM3 14V11.5H5V11H3V10H6V12.5H4V13H6V14H3ZM5 19.5H3V18.5H5V18H3V17H6V21H3V20H5V19.5ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z" } }] })(e); } function cn(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M8 4H21V6H8V4ZM4.5 6.5C3.67157 6.5 3 5.82843 3 5C3 4.17157 3.67157 3.5 4.5 3.5C5.32843 3.5 6 4.17157 6 5C6 5.82843 5.32843 6.5 4.5 6.5ZM4.5 13.5C3.67157 13.5 3 12.8284 3 12C3 11.1716 3.67157 10.5 4.5 10.5C5.32843 10.5 6 11.1716 6 12C6 12.8284 5.32843 13.5 4.5 13.5ZM4.5 20.4C3.67157 20.4 3 19.7284 3 18.9C3 18.0716 3.67157 17.4 4.5 17.4C5.32843 17.4 6 18.0716 6 18.9C6 19.7284 5.32843 20.4 4.5 20.4ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z" } }] })(e); } function Br(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M17.1538 14C17.3846 14.5161 17.5 15.0893 17.5 15.7196C17.5 17.0625 16.9762 18.1116 15.9286 18.867C14.8809 19.6223 13.4335 20 11.5862 20C9.94674 20 8.32335 19.6185 6.71592 18.8555V16.6009C8.23538 17.4783 9.7908 17.917 11.3822 17.917C13.9333 17.917 15.2128 17.1846 15.2208 15.7196C15.2208 15.0939 15.0049 14.5598 14.5731 14.1173C14.5339 14.0772 14.4939 14.0381 14.4531 14H3V12H21V14H17.1538ZM13.076 11H7.62908C7.4566 10.8433 7.29616 10.6692 7.14776 10.4778C6.71592 9.92084 6.5 9.24559 6.5 8.45207C6.5 7.21602 6.96583 6.165 7.89749 5.299C8.82916 4.43299 10.2706 4 12.2219 4C13.6934 4 15.1009 4.32808 16.4444 4.98426V7.13591C15.2448 6.44921 13.9293 6.10587 12.4978 6.10587C10.0187 6.10587 8.77917 6.88793 8.77917 8.45207C8.77917 8.87172 8.99709 9.23796 9.43293 9.55079C9.86878 9.86362 10.4066 10.1135 11.0463 10.3004C11.6665 10.4816 12.3431 10.7148 13.076 11H13.076Z" } }] })(e); } function Ir(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M13 10V14H19V10H13ZM11 10H5V14H11V10ZM13 19H19V16H13V19ZM11 19V16H5V19H11ZM13 5V8H19V5H13ZM11 5H5V8H11V5ZM4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3Z" } }] })(e); } function ce(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M13 6V21H11V6H5V4H19V6H13Z" } }] })(e); } function _r(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M8 3V12C8 14.2091 9.79086 16 12 16C14.2091 16 16 14.2091 16 12V3H18V12C18 15.3137 15.3137 18 12 18C8.68629 18 6 15.3137 6 12V3H8ZM4 20H20V22H4V20Z" } }] })(e); } function Pr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M5 11.1005L7 9.1005L12.5 14.6005L16 11.1005L19 14.1005V5H5V11.1005ZM4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3ZM15.5 10C14.6716 10 14 9.32843 14 8.5C14 7.67157 14.6716 7 15.5 7C16.3284 7 17 7.67157 17 8.5C17 9.32843 16.3284 10 15.5 10Z" } }] })(e); } function Dr(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M20 3C20.5523 3 21 3.44772 21 4V5.757L19 7.757V5H5V13.1L9 9.1005L13.328 13.429L12.0012 14.7562L11.995 18.995L16.2414 19.0012L17.571 17.671L18.8995 19H19V16.242L21 14.242V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3H20ZM21.7782 7.80761L23.1924 9.22183L15.4142 17L13.9979 16.9979L14 15.5858L21.7782 7.80761ZM15.5 7C16.3284 7 17 7.67157 17 8.5C17 9.32843 16.3284 10 15.5 10C14.6716 10 14 9.32843 14 8.5C14 7.67157 14.6716 7 15.5 7Z" } }] })(e); } function Or(e) { return y({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M10 6V8H5V19H16V14H18V20C18 20.5523 17.5523 21 17 21H4C3.44772 21 3 20.5523 3 20V7C3 6.44772 3.44772 6 4 6H10ZM21 3V12L17.206 8.207L11.2071 14.2071L9.79289 12.7929L15.792 6.793L12 3H21Z" } }] })(e); } function F(e) { const t = te(); if (e || (e = t == null ? void 0 : t.editor), !e) throw new Error( "'editor' is required, either from BlockNoteContext or as a function argument" ); const n = e, [r, a] = p(() => { var l; return ((l = n.getSelection()) == null ? void 0 : l.blocks) || [n.getTextCursorPosition().block]; }); return z( () => { var l; return a( ((l = n.getSelection()) == null ? void 0 : l.blocks) || [n.getTextCursorPosition().block] ); }, n ), r; } const Ar = (e) => /* @__PURE__ */ o.jsxs(Ke, { gap: 0, className: "bn-tooltip", children: [ /* @__PURE__ */ o.jsx(se, { size: "sm", children: e.mainTooltip }), e.secondaryTooltip && /* @__PURE__ */ o.jsx(se, { size: "xs", children: e.secondaryTooltip }) ] }), P = ee( (e, t) => { const n = e.icon; return /* @__PURE__ */ o.jsx( dr, { withinPortal: !1, label: /* @__PURE__ */ o.jsx( Ar, { mainTooltip: e.mainTooltip, secondaryTooltip: e.secondaryTooltip } ), children: e.children ? /* @__PURE__ */ o.jsxs( Ge, { onMouseDown: (r) => { Ne() && r.currentTarget.focus(); }, onClick: e.onClick, "data-selected": e.isSelected ? "true" : void 0, "data-test": e.mainTooltip.slice(0, 1).toLowerCase() + e.mainTooltip.replace(/\s+/g, "").slice(1), size: "xs", disabled: e.isDisabled || !1, ref: t, children: [ n && /* @__PURE__ */ o.jsx(n, {}), e.children ] } ) : /* @__PURE__ */ o.jsx( Ut, { onMouseDown: (r) => { Ne() && r.currentTarget.focus(); }, onClick: e.onClick, "data-selected": e.isSelected ? "true" : void 0, "data-test": e.mainTooltip.slice(0, 1).toLowerCase() + e.mainTooltip.replace(/\s+/g, "").slice(1), size: 30, disabled: e.isDisabled || !1, ref: t, children: n && /* @__PURE__ */ o.jsx(n, {}) } ) } ); } ), Fr = { bold: Er, italic: Vr, underline: _r, strike: Br, code: Sr }, Nr = { bold: "Mod+B", italic: "Mod+I", underline: "Mod+U", strike: "Mod+Shift+X", code: "" }; function Zr(e, t) { return e in t.schema.styleSchema && t.schema.styleSchema[e].type === e && t.schema.styleSchema[e].propSchema === "boolean"; } const ke = (e) => { const t = w(), n = Zr( e.basicTextStyle, t ), r = F(t), [a, l] = p( e.basicTextStyle in t.getActiveStyles() ); z(() => { n && l(e.basicTextStyle in t.getActiveStyles()); }, t); const c = (d) => { if (n) { if (t.focus(), t.schema.styleSchema[d].propSchema !== "boolean") throw new Error("can only toggle boolean styles"); t.toggleStyles({ [d]: !0 }); } }; return E(() => n ? !!r.find((d) => d.content !== void 0) : !1, [n, r]) ? /* @__PURE__ */ o.jsx( P, { onClick: () => c(e.basicTextStyle), isSelected: a, mainTooltip: e.basicTextStyle.slice(0, 1).toUpperCase() + e.basicTextStyle.slice(1), secondaryTooltip: ye(Nr[e.basicTextStyle]), icon: Fr[e.basicTextStyle] } ) : null; }; function Xe() { const e = K(null); return { ref: e, updateMaxHeight: () => { setTimeout(() => { if (e.current && e.current.childElementCount > 0) { e.current.firstElementChild.style.maxHeight = "none"; const t = e.current.firstElementChild.getBoundingClientRect(); e.current.firstElementChild.style.maxHeight = `${Math.min( t.top >= 0 ? window.innerHeight - t.top - 20 : t.bottom - 20 )}px`; } }, 10); } }; } const $e = (e) => { const t = e.textColor || "default", n = e.backgroundColor || "default", r = e.size || 16, a = E( () => ({ pointerEvents: "none", fontSize: (r * 0.75).toString() + "px", height: r.toString() + "px", lineHeight: r.toString() + "px", textAlign: "center", width: r.toString() + "px" }), [r] ); return /* @__PURE__ */ o.jsx( $t, { className: "bn-color-icon", "data-background-color": n, "data-text-color": t, style: a, children: "A" } ); }; function We(e) { return y({ tag: "svg", attr: { version: "1.2", baseProfile: "tiny", viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M16.972 6.251c-.967-.538-2.185-.188-2.72.777l-3.713 6.682-2.125-2.125c-.781-.781-2.047-.781-2.828 0-.781.781-.781 2.047 0 2.828l4 4c.378.379.888.587 1.414.587l.277-.02c.621-.087 1.166-.46 1.471-1.009l5-9c.537-.966.189-2.183-.776-2.72z" } }] })(e); } const un = (e) => { const t = () => e.text ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [ /* @__PURE__ */ o.jsx(j.Label, { children: "Text" }), [ "default", "gray", "brown", "red", "orange", "yellow", "green", "blue", "purple", "pink" ].map((r) => /* @__PURE__ */ o.jsx( j.Item, { onClick: () => { e.onClick && e.onClick(), e.text.setColor(r); }, component: "div", "data-test": "text-color-" + r, leftSection: /* @__PURE__ */ o.jsx($e, { textColor: r, size: e.iconSize }), rightSection: e.text.color === r ? /* @__PURE__ */ o.jsx(We, { size: 20, className: "bn-tick-icon" }) : /* @__PURE__ */ o.jsx("div", { className: "bn-tick-space" }), children: r.charAt(0).toUpperCase() + r.slice(1) }, "text-color-" + r )) ] }) : null, n = () => e.background ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [ /* @__PURE__ */ o.jsx(j.Label, { children: "Background" }), [ "default", "gray", "brown", "red", "orange", "yellow", "green", "blue", "purple", "pink" ].map((r) => /* @__PURE__ */ o.jsx( j.Item, { onClick: () => { e.onClick && e.onClick(), e.background.setColor(r); }, component: "div", "data-test": "background-color-" + r, leftSection: /* @__PURE__ */ o.jsx($e, { backgroundColor: r, size: e.iconSize }), rightSection: e.background.color === r ? /* @__PURE__ */ o.jsx(We, { size: 20, className: "bn-tick-icon" }) : /* @__PURE__ */ o.jsx("div", { className: "bn-tick-space" }), children: r.charAt(0).toUpperCase() + r.slice(1) }, "background-color-" + r )) ] }) : null; return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [ /* @__PURE__ */ o.jsx(t, {}), /* @__PURE__ */ o.jsx(n, {}) ] }); }; function Et(e, t) { return `${e}Color` in t.schema.styleSchema && t.schema.styleSchema[`${e}Color`].type === `${e}Color` && t.schema.styleSchema[`${e}Color`].propSchema === "string"; } const zr = () => { const e = w(), t = Et("text", e), n = Et("background", e), r = F(e), [a, l] = p( t && e.getActiveStyles().textColor || "default" ), [c, s] = p( n && e.getActiveStyles().backgroundColor || "default" ); z(() => { t && l(e.getActiveStyles().textColor || "default"), n && s( e.getActiveStyles().backgroundColor || "default" ); }, e); const { ref: d, updateMaxHeight: f } = Xe(), h = V( (L) => { if (!t) throw Error( "Tried to set text color, but style does not exist in editor schema." ); e.focus(), L === "default" ? e.removeStyles({ textColor: L }) : e.addStyles({ textColor: L }); }, [e, t] ), b = V( (L) => { if (!n) throw Error( "Tried to set background color, but style does not exist in editor schema." ); e.focus(), L === "default" ? e.removeStyles({ backgroundColor: L }) : e.addStyles({ backgroundColor: L }); }, [n, e] ); return E(() => { if (!t && !n) return !1; for (const L of r) if (L.content !== void 0) return !0; return !1; }, [n, r, t]) ? /* @__PURE__ */ o.jsxs(j, { withinPortal: !1, onOpen: f, children: [ /* @__PURE__ */ o.jsx(j.Target, { children: /* @__PURE__ */ o.jsx( P, { mainTooltip: "Colors", icon: () => /* @__PURE__ */ o.jsx( $e, { textColor: a, backgroundColor: c, size: 20 } ) } ) }), /* @__PURE__ */ o.jsx("div", { ref: d, children: /* @__PURE__ */ o.jsx(j.Dropdown, { children: /* @__PURE__ */ o.jsx( un, { text: t ? { color: a, setColor: h } : void 0, background: n ? { color: c, setColor: b } : void 0 } ) }) }) ] }) : null; }, et = (e) => /* @__PURE__ */ o.jsxs(X, { withinPortal: !1, zIndex: 1e4, children: [ /* @__PURE__ */ o.jsx(X.Target, { children: e.button }), /* @__PURE__ */ o.jsx(X.Dropdown, { children: /* @__PURE__ */ o.jsx(Ke, { className: "bn-toolbar-input-dropdown", children: e.dropdownItems }) }) ] }), Ur = { text: Wt, file: qt }, qe = (e) => { const { type: t, icon: n, ...r } = e, a = Ur[e.type], l = e.icon; return /* @__PURE__ */ o.jsx(je, { children: /* @__PURE__ */ o.jsx(a, { size: "xs", icon: /* @__PURE__ */ o.jsx(l, {}), ...r }) }); }, dn = (e) => { const { url: t, text: n, editLink: r } = e, [a, l] = p(t), [c, s] = p(n); B(() => { l(t), s(n); }, [n, t]); const d = V( (T) => { T.key === "Enter" && (T.preventDefault(), r(a, c)); }, [r, a, c] ), f = V( (T) => l(T.currentTarget.value), [] ), h = V( (T) => s(T.currentTarget.value), [] ), b = V( () => r(a, c), [r, a, c] ); return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [ /* @__PURE__ */ o.jsx( qe, { type: "text", icon: ln, autoFocus: !0, placeholder: "Edit URL", value: a, onKeyDown: d, onChange: f, onSubmit: b } ), /* @__PURE__ */ o.jsx( qe, { type: "text", icon: ce, placeholder: "Edit Title", value: c, onKeyDown: d, onChange: h, onSubmit: b } ) ] }); }; function $r(e) { return "link" in e.schema.inlineContentSchema && e.schema.inlineContentSchema.link === "link"; } const Wr = () => { const e = w(), t = $r(e), n = F(e), [r, a] = p(e.getSelectedLinkUrl() || ""), [l, c] = p(e.getSelectedText()); z(() => { c(e.getSelectedText() || ""), a(e.getSelectedLinkUrl() || ""); }, e); const s = V( (f, h) => { e.createLink(f, h), e.focus(); }, [e] ); return E(() => { if (!t) return !1; for (const f of n) if (f.content === void 0) return !1; return !0; }, [t, n]) ? /* @__PURE__ */ o.jsx( et, { button: /* @__PURE__ */ o.jsx( P, { mainTooltip: "Create Link", secondaryTooltip: ye("Mod+K"), icon: ln } ), dropdownItems: /* @__PURE__ */ o.jsx(dn, { url: r, text: l, editLink: s }) } ) : null; }, qr = () => { const e = w(), [t, n] = p(), r = F(e), a = E(() => { if (r.length !== 1) return; const s = r[0]; if (Pt("image", s, e)) return s; }, [e, r]), l = V( (s) => { a && Dt("image", e) && s.key === "Enter" && (s.preventDefault(), e.updateBlock(a, { type: "image", props: { caption: t } })); }, [t, e, a] ), c = V( (s) => n(s.currentTarget.value), [] ); return a ? /* @__PURE__ */ o.jsx( et, { button: /* @__PURE__ */ o.jsx( P, { mainTooltip: "Edit Caption", icon: ce, isSelected: a.props.caption !== "" } ), dropdownItems: /* @__PURE__ */ o.jsx( qe, { type: "text", icon: ce, value: t, autoFocus: !0, placeholder: "Edit Caption", onKeyDown: l, defaultValue: a.props.caption, onChange: c } ) } ) : null; }, Yr = () => { const e = w(), t = F(e), [n, r] = p( () => e.canNestBlock() ); z(() => { r(e.canNestBlock()); }, e); const a = V(() => { e.focus(), e.nestBlock(); }, [e]); return E(() => !t.find( (c) => e.schema.blockSchema[c.type].content !== "inline" ), [e.schema.blockSchema, t]) ? /* @__PURE__ */ o.jsx( P, { onClick: a, isDisabled: !n, mainTooltip: "Nest Block", secondaryTooltip: ye("Tab"), icon: Rr } ) : null; }, Kr = () => { const e = w(), t = F(e), [n, r] = p( () => e.canUnnestBlock() ); z(() => { r(e.canUnnestBlock()); }, e); const a = V(() => { e.focus(), e.unnestBlock(); }, [e]); return E(() => !t.find( (c) => e.schema.blockSchema[c.type].content !== "inline" ), [e.schema.blockSchema, t]) ? /* @__PURE__ */ o.jsx( P, { onClick: a, isDisabled: !n, mainTooltip: "Unnest Block", secondaryTooltip: ye("Shift+Tab"), icon: Mr } ) : null; }, fn = ee((e, t) => { const { className: n, children: r, ...a } = e; return /* @__PURE__ */ o.jsx( "div", { className: ue("bn-image-panel-tab", n || ""), ...a, ref: t, children: r } ); }), Gr = ee((e, t) => /* @__PURE__ */ o.jsx(qt, { size: "xs", ...e, ref: t, "data-test": "upload-input" })), Jr = (e) => { const { block: t, setLoading: n } = e, r = w(), [a, l] = p(!1); B(() => { a && setTimeout(() => { l(!1); }, 3e3); }, [a]); const c = V( (s) => { if (s === null) return; async function d(f) { if (n(!0), r.uploadFile !== void 0) try { const h = await r.uploadFile(f); r.updateBlock(t, { type: "image", props: { url: h } }); } catch { l(!0); } finally { n(!1); } } d(s); }, [t, r, n] ); return r.uploadFile !== void 0 ? /* @__PURE__ */ o.jsxs(fn, { children: [ /* @__PURE__ */ o.jsx( Gr, { placeholder: "Upload Image", value: null, onChange: c } ), a && /* @__PURE__ */ o.jsx(se, { c: "red", size: "12px", children: "Error: Upload failed" }) ] }) : null; }, Qr = ee((e, t) => /* @__PURE__ */ o.jsx(Wt, { size: "xs", ...e, ref: t, "data