@react-email/editor 0.0.0-experimental.41 → 0.0.0-experimental.43

package/dist/ui/index.cjs

@@ -1,7 +1,321 @@
-const require_event_bus = require('../event-bus-fb8U7hrl.cjs');
-const require_root = require('../root-Jq1R3tkX.cjs');
+const require_event_bus = require('../event-bus-BJn1dJM1.cjs');
+const require_extension = require('../extension-CF0s-pGh.cjs');
+const require_root = require('../root-D6lslKju.cjs');
+let _tiptap_react = require("@tiptap/react");
+let react = require("react");
+react = require_event_bus.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
+let _tiptap_core = require("@tiptap/core");
+let _tiptap_pm_state = require("@tiptap/pm/state");
 
+//#region src/ui/icons/align-center-vertical.tsx
+function AlignCenterVerticalIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M12 2v20" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 10H4a2 2 0 0 1-2-2V6c0-1.1.9-2 2-2h4" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M16 10h4a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-4" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 20H7a2 2 0 0 1-2-2v-2c0-1.1.9-2 2-2h1" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M16 14h1a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-1" })
+		]
+	});
+}
+
+//#endregion
+//#region src/ui/icons/align-end-vertical.tsx
+function AlignEndVerticalIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				width: "9",
+				height: "6",
+				x: "9",
+				y: "14",
+				rx: "2"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				width: "16",
+				height: "6",
+				x: "2",
+				y: "4",
+				rx: "2"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M22 2v20" })
+		]
+	});
+}
+
+//#endregion
+//#region src/ui/icons/align-start-vertical.tsx
+function AlignStartVerticalIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				width: "9",
+				height: "6",
+				x: "6",
+				y: "14",
+				rx: "2"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				width: "16",
+				height: "6",
+				x: "6",
+				y: "4",
+				rx: "2"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M2 2v20" })
+		]
+	});
+}
+
+//#endregion
+//#region src/ui/icons/box.tsx
+function BoxIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16Z" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m3.3 7 8.7 5 8.7-5" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M12 22V12" })
+		]
+	});
+}
+
+//#endregion
+//#region src/ui/icons/image.tsx
+function ImageIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				width: "18",
+				height: "18",
+				x: "3",
+				y: "3",
+				rx: "2",
+				ry: "2"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+				cx: "9",
+				cy: "9",
+				r: "2"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" })
+		]
+	});
+}
+
+//#endregion
+//#region src/ui/icons/layout.tsx
+function LayoutIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				width: "18",
+				height: "18",
+				x: "3",
+				y: "3",
+				rx: "2",
+				ry: "2"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M3 9h18" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M9 21V9" })
+		]
+	});
+}
+
+//#endregion
+//#region src/ui/icons/minus.tsx
+function MinusIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M5 12h14" })
+	});
+}
+
+//#endregion
+//#region src/ui/icons/mouse-pointer-click.tsx
+function MousePointerClickIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M14 4.1 12 6" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m5.1 8-2.9-.8" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m6 12-1.9 2" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M7.2 2.2 8 5.1" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M9.037 9.69a.498.498 0 0 1 .653-.653l11 4.5a.5.5 0 0 1-.074.949l-4.349 1.041a1 1 0 0 0-.74.739l-1.04 4.35a.5.5 0 0 1-.95.074z" })
+		]
+	});
+}
+
+//#endregion
+//#region src/ui/icons/square-round-corner.tsx
+function SquareRoundCornerIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M14 3a8 8 0 0 1 8 8" })]
+	});
+}
+
+//#endregion
+//#region src/ui/icons/table.tsx
+function TableIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M12 3v18" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				width: "18",
+				height: "18",
+				x: "3",
+				y: "3",
+				rx: "2"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M3 9h18" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M3 15h18" })
+		]
+	});
+}
+
+//#endregion
+//#region src/ui/icons/type.tsx
+function TypeIcon({ size, width, height, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size ?? width ?? 24,
+		height: size ?? height ?? 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("polyline", { points: "4 7 4 4 20 4 20 7" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+				x1: "9",
+				x2: "15",
+				y1: "20",
+				y2: "20"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+				x1: "12",
+				x2: "12",
+				y1: "4",
+				y2: "20"
+			})
+		]
+	});
+}
+
+//#endregion
 //#region src/ui/bubble-menu/separator.tsx
 function BubbleMenuSeparator({ className }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("hr", {
@@ -49,6 +363,319 @@ const BubbleMenu = {
 	ImageDefault: require_root.BubbleMenuImageDefault
 };
 
+//#endregion
+//#region src/ui/inspector/provider.tsx
+const IGNORED_NODES = ["doc", "text"];
+function getHierarchyAtPosition(editor, pos) {
+	if (!editor) return [];
+	const { doc } = editor.state;
+	const hierarchy = [];
+	const nodeAtPos = doc.nodeAt(pos);
+	if (nodeAtPos && !IGNORED_NODES.includes(nodeAtPos.type.name)) hierarchy.push({
+		nodeType: nodeAtPos.type.name,
+		nodeAttrs: { ...nodeAtPos.attrs },
+		nodePos: {
+			pos,
+			inside: pos
+		}
+	});
+	const resolvedPos = doc.resolve(pos);
+	for (let depth = resolvedPos.depth; depth > 0; depth--) {
+		const node = resolvedPos.node(depth);
+		const nodePos = resolvedPos.before(depth);
+		if (node && !IGNORED_NODES.includes(node.type.name)) {
+			if (!hierarchy.some((h) => h.nodePos.pos === nodePos)) hierarchy.push({
+				nodeType: node.type.name,
+				nodeAttrs: { ...node.attrs },
+				nodePos: {
+					pos: nodePos,
+					inside: nodePos
+				}
+			});
+		}
+	}
+	return hierarchy;
+}
+function getNodeHierarchy(editor) {
+	if (!editor) return [];
+	const { selection } = editor.state;
+	const hierarchy = [];
+	if (selection instanceof _tiptap_pm_state.NodeSelection) {
+		const node = selection.node;
+		if (node && !IGNORED_NODES.includes(node.type.name)) hierarchy.push({
+			nodeType: node.type.name,
+			nodeAttrs: { ...node.attrs },
+			nodePos: {
+				pos: selection.from,
+				inside: selection.from
+			}
+		});
+	}
+	const { from } = selection;
+	const resolvedPos = editor.state.doc.resolve(from);
+	for (let depth = resolvedPos.depth; depth > 0; depth--) {
+		const node = resolvedPos.node(depth);
+		const pos = resolvedPos.before(depth);
+		if (node && !IGNORED_NODES.includes(node.type.name)) {
+			if (!hierarchy.some((h) => h.nodePos.pos === pos)) hierarchy.push({
+				nodeType: node.type.name,
+				nodeAttrs: { ...node.attrs },
+				nodePos: {
+					pos,
+					inside: pos
+				}
+			});
+		}
+	}
+	return hierarchy;
+}
+const InspectorContext = react.createContext(null);
+function useInspector() {
+	const context = react.useContext(InspectorContext);
+	if (!context) throw new Error("useInspector can only be called from inside the InspectorContext. This probably means you forgot the <Inspector.Provider>");
+	return context;
+}
+function InspectorProvider({ children }) {
+	const { editor } = (0, _tiptap_react.useCurrentEditor)();
+	const target = (0, _tiptap_react.useEditorState)({
+		editor,
+		selector(context) {
+			if (!context.editor) return null;
+			if (!context.editor.isFocused) return "doc";
+			const { selection } = context.editor.state;
+			if (selection.content().size > 0 && selection instanceof _tiptap_pm_state.TextSelection) {
+				const { $from } = selection;
+				for (let depth = $from.depth; depth > 0; depth--) if ($from.node(depth).type.name === "button") {
+					const pos = $from.before(depth);
+					const node = context.editor.state.doc.nodeAt(pos);
+					if (node) return {
+						nodeType: "button",
+						nodeAttrs: { ...node.attrs },
+						nodePos: {
+							pos,
+							inside: pos
+						}
+					};
+					break;
+				}
+				return "text";
+			}
+			const hierarchy = getNodeHierarchy(context.editor);
+			if (hierarchy.length > 0) {
+				const innermost = hierarchy[0];
+				const columnEntry = hierarchy.find((h) => h.nodeType === "columnsColumn");
+				return columnEntry && innermost.nodeType === "paragraph" ? columnEntry : innermost;
+			}
+			return "doc";
+		}
+	});
+	const pathFromRoot = react.useMemo(() => {
+		if (!editor) return [];
+		if (typeof target === "object" && target) {
+			const path = [...getHierarchyAtPosition(editor, target.nodePos.pos)].reverse();
+			return path.length > 0 ? path : [target];
+		}
+		if (target === "text") return [...getNodeHierarchy(editor)].reverse();
+		return [];
+	}, [editor, target]);
+	const editorDomFocused = react.useRef(false);
+	const inspectorFocused = react.useRef(false);
+	react.useEffect(() => {
+		const defaultFocusPlugin = editor?.state.plugins.find((plugin) => plugin.spec.key === _tiptap_core.extensions.focusEventsPluginKey);
+		if (editor && defaultFocusPlugin) {
+			editor?.unregisterPlugin(_tiptap_core.extensions.focusEventsPluginKey);
+			const pluginKey = new _tiptap_pm_state.PluginKey("inspectorReactEmailFocusEvents");
+			editor.registerPlugin(new _tiptap_pm_state.Plugin({
+				key: pluginKey,
+				props: { handleDOMEvents: {
+					focus: (view, event) => {
+						editorDomFocused.current = true;
+						editor.isFocused = true;
+						const transaction = editor.state.tr.setMeta("focus", { event }).setMeta("addToHistory", false);
+						view.dispatch(transaction);
+						return false;
+					},
+					blur: (view, event) => {
+						editorDomFocused.current = false;
+						if (!inspectorFocused.current) {
+							editor.isFocused = false;
+							const transaction = editor.state.tr.setMeta("blur", { event }).setMeta("addToHistory", false);
+							view.dispatch(transaction);
+						}
+						return false;
+					}
+				} }
+			}));
+			return () => {
+				editor?.unregisterPlugin(pluginKey);
+				editor?.registerPlugin(defaultFocusPlugin);
+			};
+		}
+	}, [editor]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(InspectorContext.Provider, {
+		value: {
+			target,
+			pathFromRoot,
+			focus: (event) => {
+				inspectorFocused.current = true;
+				if (editor) {
+					editor.isFocused = true;
+					const transaction = editor.state.tr.setMeta("focus", { event }).setMeta("addToHistory", false);
+					editor.view.dispatch(transaction);
+				}
+			},
+			blur: (event) => {
+				inspectorFocused.current = false;
+				if (!editorDomFocused.current && editor) {
+					editor.isFocused = false;
+					const transaction = editor.state.tr.setMeta("blur", { event }).setMeta("addToHistory", false);
+					editor.view.dispatch(transaction);
+				}
+			}
+		},
+		children
+	});
+}
+
+//#endregion
+//#region src/ui/inspector/breadcrumb.tsx
+function InspectorBreadcrumb({ children }) {
+	const { editor } = (0, _tiptap_react.useCurrentEditor)();
+	const { pathFromRoot } = useInspector();
+	return children(react.default.useMemo(() => {
+		return [{
+			node: null,
+			focus() {
+				editor?.commands.setTextSelection(0);
+			}
+		}, ...pathFromRoot.map((focusedNode) => ({
+			node: focusedNode,
+			focus() {
+				editor?.commands.setNodeSelection(focusedNode.nodePos.pos);
+				editor?.commands.focus();
+			}
+		}))];
+	}, [pathFromRoot]));
+}
+
+//#endregion
+//#region src/ui/inspector/document.tsx
+function ensureAllProperties(currentStyles, themeDefaults) {
+	return currentStyles.map((group) => {
+		const defaultGroup = themeDefaults.find((g) => group.id ? g.id === group.id : g.title === group.title);
+		if (!defaultGroup || defaultGroup.inputs.length === 0) return group;
+		const existingProps = new Set(group.inputs.map((i) => `${i.classReference}:${i.prop}`));
+		const missingInputs = defaultGroup.inputs.filter((defaultInput) => !existingProps.has(`${defaultInput.classReference}:${defaultInput.prop}`)).map((defaultInput) => {
+			const propDef = require_extension.SUPPORTED_CSS_PROPERTIES[defaultInput.prop];
+			if (propDef && propDef.type === "number") return {
+				...defaultInput,
+				value: "",
+				placeholder: String(propDef.defaultValue)
+			};
+			return { ...defaultInput };
+		});
+		if (missingInputs.length === 0) return group;
+		return {
+			...group,
+			inputs: [...group.inputs, ...missingInputs]
+		};
+	});
+}
+function applyStyleChange(styles, themeName, { classReference, prop, newValue }) {
+	let found = false;
+	const updatedStyles = styles.map((styleGroup) => {
+		if (styleGroup.inputs.find((input) => input.classReference === classReference && input.prop === prop)) {
+			found = true;
+			return {
+				...styleGroup,
+				inputs: styleGroup.inputs.map((input) => {
+					if (input.classReference === classReference && input.prop === prop) return {
+						...input,
+						value: newValue
+					};
+					return input;
+				})
+			};
+		}
+		return styleGroup;
+	});
+	if (found) return updatedStyles;
+	const propDef = require_extension.SUPPORTED_CSS_PROPERTIES[prop] ?? null;
+	return updatedStyles.map((styleGroup) => {
+		if (styleGroup.classReference !== classReference) return styleGroup;
+		const defaultInput = require_extension.EDITOR_THEMES[themeName].find((g) => styleGroup.id ? g.id === styleGroup.id : g.title === styleGroup.title)?.inputs.find((i) => i.prop === prop && i.classReference === classReference);
+		if (defaultInput) return {
+			...styleGroup,
+			inputs: [...styleGroup.inputs, {
+				...defaultInput,
+				value: newValue
+			}]
+		};
+		if (propDef) return {
+			...styleGroup,
+			inputs: [...styleGroup.inputs, {
+				label: propDef.label,
+				type: propDef.type,
+				value: newValue,
+				prop,
+				classReference,
+				unit: propDef.unit,
+				options: propDef.options
+			}]
+		};
+		return styleGroup;
+	});
+}
+function InspectorDocument({ children }) {
+	const { editor } = (0, _tiptap_react.useCurrentEditor)();
+	const theming = require_extension.useEmailTheming(editor);
+	const { target } = useInspector();
+	if (!editor || !theming) return null;
+	const themeDefaults = require_extension.EDITOR_THEMES[theming.theme];
+	const groups = ensureAllProperties(theming.styles, themeDefaults);
+	function setGlobalStyle(classReference, property, value) {
+		require_extension.setGlobalStyles(editor, applyStyleChange(theming.styles, theming.theme, {
+			classReference,
+			prop: property,
+			newValue: value
+		}));
+	}
+	function batchSetGlobalStyle(changes) {
+		let styles = theming.styles;
+		for (const change of changes) styles = applyStyleChange(styles, theming.theme, {
+			classReference: change.classReference,
+			prop: change.property,
+			newValue: change.value
+		});
+		require_extension.setGlobalStyles(editor, styles);
+	}
+	function findStyleValue(classReference, prop) {
+		for (const group of groups) {
+			const input = group.inputs.find((i) => i.classReference === classReference && i.prop === prop);
+			if (input) return input.value;
+		}
+		for (const group of themeDefaults) {
+			const input = group.inputs.find((i) => i.classReference === classReference && i.prop === prop);
+			if (input) return input.value;
+		}
+		return require_extension.SUPPORTED_CSS_PROPERTIES[prop]?.defaultValue ?? "";
+	}
+	if (target === "doc") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: children({
+		styles: groups,
+		setGlobalStyle,
+		batchSetGlobalStyle,
+		findStyleValue
+	}) });
+}
+
+//#endregion
+//#region src/ui/inspector/index.tsx
+const Inspector = {
+	Provider: InspectorProvider,
+	Breadcrumb: InspectorBreadcrumb,
+	Document: InspectorDocument
+};
+
 //#endregion
 //#region src/ui/slash-command/index.ts
 const SlashCommand = {
@@ -58,11 +685,15 @@ const SlashCommand = {
 
 //#endregion
 exports.AlignCenterIcon = require_root.AlignCenterIcon;
+exports.AlignCenterVerticalIcon = AlignCenterVerticalIcon;
+exports.AlignEndVerticalIcon = AlignEndVerticalIcon;
 exports.AlignLeftIcon = require_root.AlignLeftIcon;
 exports.AlignRightIcon = require_root.AlignRightIcon;
+exports.AlignStartVerticalIcon = AlignStartVerticalIcon;
 exports.BULLET_LIST = require_root.BULLET_LIST;
 exports.BUTTON = require_root.BUTTON;
 exports.BoldIcon = require_root.BoldIcon;
+exports.BoxIcon = BoxIcon;
 exports.BubbleMenu = BubbleMenu;
 exports.BubbleMenuAlignCenter = require_root.BubbleMenuAlignCenter;
 exports.BubbleMenuAlignLeft = require_root.BubbleMenuAlignLeft;
@@ -111,31 +742,43 @@ exports.H1 = require_root.H1;
 exports.H2 = require_root.H2;
 exports.H3 = require_root.H3;
 exports.Heading1 = require_root.Heading1;
+exports.Heading1Icon = require_root.Heading1;
 exports.Heading2 = require_root.Heading2;
 exports.Heading3 = require_root.Heading3;
+exports.ImageIcon = ImageIcon;
+exports.Inspector = Inspector;
 exports.ItalicIcon = require_root.ItalicIcon;
+exports.LayoutIcon = LayoutIcon;
 exports.LinkIcon = require_root.LinkIcon;
 exports.List = require_root.List;
+exports.ListIcon = require_root.List;
 exports.ListOrdered = require_root.ListOrdered;
+exports.ListOrderedIcon = require_root.ListOrdered;
+exports.MinusIcon = MinusIcon;
 exports.MousePointer = require_root.MousePointer;
+exports.MousePointerClickIcon = MousePointerClickIcon;
 exports.NUMBERED_LIST = require_root.NUMBERED_LIST;
 exports.NodeSelectorContent = require_root.NodeSelectorContent;
 exports.NodeSelectorRoot = require_root.NodeSelectorRoot;
 exports.NodeSelectorTrigger = require_root.NodeSelectorTrigger;
 exports.PencilIcon = require_root.PencilIcon;
 exports.QUOTE = require_root.QUOTE;
+exports.QuoteIcon = require_root.TextQuote;
 exports.Rows2 = require_root.Rows2;
 exports.SECTION = require_root.SECTION;
 exports.SlashCommand = SlashCommand;
 exports.SplitSquareVertical = require_root.SplitSquareVertical;
 exports.SquareCode = require_root.SquareCode;
+exports.SquareRoundCornerIcon = SquareRoundCornerIcon;
 exports.StrikethroughIcon = require_root.StrikethroughIcon;
 exports.TEXT = require_root.TEXT;
 exports.THREE_COLUMNS = require_root.THREE_COLUMNS;
 exports.TWO_COLUMNS = require_root.TWO_COLUMNS;
+exports.TableIcon = TableIcon;
 exports.Text = require_root.Text;
 exports.TextIcon = require_root.TextIcon;
 exports.TextQuote = require_root.TextQuote;
+exports.TypeIcon = TypeIcon;
 exports.UnderlineIcon = require_root.UnderlineIcon;
 exports.UnlinkIcon = require_root.UnlinkIcon;
 exports.bubbleMenuTriggers = require_root.bubbleMenuTriggers;