@openeditor/react-native-prose-editor 0.0.2

package/dist/useNativeEditor.js

@@ -0,0 +1,124 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useNativeEditor = useNativeEditor;
+const react_1 = require("react");
+const NativeEditorBridge_1 = require("./NativeEditorBridge");
+const DEFAULT_SELECTION = { type: 'text', anchor: 0, head: 0 };
+const DEFAULT_ACTIVE_STATE = {
+    marks: {},
+    markAttrs: {},
+    nodes: {},
+    commands: {},
+    allowedMarks: [],
+    insertableNodes: [],
+};
+const DEFAULT_HISTORY_STATE = { canUndo: false, canRedo: false };
+function useNativeEditor(options = {}) {
+    const { maxLength, initialHtml, onChange, onSelectionChange } = options;
+    const bridgeRef = (0, react_1.useRef)(null);
+    const onChangeRef = (0, react_1.useRef)(onChange);
+    onChangeRef.current = onChange;
+    const onSelectionChangeRef = (0, react_1.useRef)(onSelectionChange);
+    onSelectionChangeRef.current = onSelectionChange;
+    const [isReady, setIsReady] = (0, react_1.useState)(false);
+    const [selection, setSelection] = (0, react_1.useState)(DEFAULT_SELECTION);
+    const [activeState, setActiveState] = (0, react_1.useState)(DEFAULT_ACTIVE_STATE);
+    const [historyState, setHistoryState] = (0, react_1.useState)(DEFAULT_HISTORY_STATE);
+    const [renderElements, setRenderElements] = (0, react_1.useState)([]);
+    const syncStateFromUpdate = (0, react_1.useCallback)((update) => {
+        if (!update)
+            return;
+        setRenderElements(update.renderElements);
+        setSelection(update.selection);
+        setActiveState(update.activeState);
+        setHistoryState(update.historyState);
+    }, []);
+    const applyUpdate = (0, react_1.useCallback)((update) => {
+        if (!update)
+            return;
+        syncStateFromUpdate(update);
+        onSelectionChangeRef.current?.(update.selection);
+        // Fetch current HTML and notify onChange
+        if (onChangeRef.current && bridgeRef.current && !bridgeRef.current.isDestroyed) {
+            const html = bridgeRef.current.getHtml();
+            onChangeRef.current(html);
+        }
+    }, [syncStateFromUpdate]);
+    (0, react_1.useEffect)(() => {
+        const bridge = NativeEditorBridge_1.NativeEditorBridge.create(maxLength != null ? { maxLength } : undefined);
+        bridgeRef.current = bridge;
+        if (initialHtml) {
+            bridge.setHtml(initialHtml);
+        }
+        syncStateFromUpdate(bridge.getCurrentState());
+        setIsReady(true);
+        return () => {
+            bridge.destroy();
+            bridgeRef.current = null;
+            setIsReady(false);
+        };
+    }, [maxLength, initialHtml, syncStateFromUpdate]);
+    const toggleMark = (0, react_1.useCallback)((markType) => {
+        if (!bridgeRef.current || bridgeRef.current.isDestroyed)
+            return;
+        const update = bridgeRef.current.toggleMark(markType);
+        applyUpdate(update);
+    }, [applyUpdate]);
+    const undo = (0, react_1.useCallback)(() => {
+        if (!bridgeRef.current || bridgeRef.current.isDestroyed)
+            return;
+        const update = bridgeRef.current.undo();
+        applyUpdate(update);
+    }, [applyUpdate]);
+    const redo = (0, react_1.useCallback)(() => {
+        if (!bridgeRef.current || bridgeRef.current.isDestroyed)
+            return;
+        const update = bridgeRef.current.redo();
+        applyUpdate(update);
+    }, [applyUpdate]);
+    const toggleBlockquote = (0, react_1.useCallback)(() => {
+        if (!bridgeRef.current || bridgeRef.current.isDestroyed)
+            return;
+        const update = bridgeRef.current.toggleBlockquote();
+        applyUpdate(update);
+    }, [applyUpdate]);
+    const toggleHeading = (0, react_1.useCallback)((level) => {
+        if (!bridgeRef.current || bridgeRef.current.isDestroyed)
+            return;
+        const update = bridgeRef.current.toggleHeading(level);
+        applyUpdate(update);
+    }, [applyUpdate]);
+    const insertText = (0, react_1.useCallback)((pos, text) => {
+        if (!bridgeRef.current || bridgeRef.current.isDestroyed)
+            return;
+        const update = bridgeRef.current.insertText(pos, text);
+        applyUpdate(update);
+    }, [applyUpdate]);
+    const deleteRange = (0, react_1.useCallback)((from, to) => {
+        if (!bridgeRef.current || bridgeRef.current.isDestroyed)
+            return;
+        const update = bridgeRef.current.deleteRange(from, to);
+        applyUpdate(update);
+    }, [applyUpdate]);
+    const getHtml = (0, react_1.useCallback)(() => {
+        if (!bridgeRef.current || bridgeRef.current.isDestroyed)
+            return '';
+        return bridgeRef.current.getHtml();
+    }, []);
+    return {
+        bridge: bridgeRef.current,
+        isReady,
+        selection,
+        activeState,
+        historyState,
+        renderElements,
+        toggleMark,
+        undo,
+        redo,
+        toggleBlockquote,
+        toggleHeading,
+        insertText,
+        deleteRange,
+        getHtml,
+    };
+}

package/expo-module.config.json

@@ -0,0 +1,9 @@
+{
+  "platforms": ["ios", "android"],
+  "ios": {
+    "modules": ["NativeEditorModule"]
+  },
+  "android": {
+    "modules": ["com.openeditor.editor.NativeEditorModule"]
+  }
+}

package/ios/EditorAddons.swift

@@ -0,0 +1,327 @@
+import UIKit
+
+struct NativeMentionSuggestion {
+    let key: String
+    let title: String
+    let subtitle: String?
+    let label: String
+    let attrs: [String: Any]
+
+    init?(dictionary: [String: Any]) {
+        guard let key = dictionary["key"] as? String,
+              let title = dictionary["title"] as? String,
+              let label = dictionary["label"] as? String
+        else {
+            return nil
+        }
+
+        self.key = key
+        self.title = title
+        self.subtitle = dictionary["subtitle"] as? String
+        self.label = label
+        self.attrs = dictionary["attrs"] as? [String: Any] ?? [:]
+    }
+}
+
+struct NativeMentionsAddonConfig {
+    let trigger: String
+    let suggestions: [NativeMentionSuggestion]
+    let theme: EditorMentionTheme?
+    let resolveSelectionAttrs: Bool
+    let resolveTheme: Bool
+
+    init?(dictionary: [String: Any]) {
+        let trigger = (dictionary["trigger"] as? String)?.trimmingCharacters(in: .whitespacesAndNewlines)
+        self.trigger = (trigger?.isEmpty == false ? trigger : "@") ?? "@"
+        self.suggestions = ((dictionary["suggestions"] as? [[String: Any]]) ?? []).compactMap(NativeMentionSuggestion.init(dictionary:))
+        self.resolveSelectionAttrs = dictionary["resolveSelectionAttrs"] as? Bool ?? false
+        self.resolveTheme = dictionary["resolveTheme"] as? Bool ?? false
+        if let theme = dictionary["theme"] as? [String: Any] {
+            self.theme = EditorMentionTheme(dictionary: theme)
+        } else {
+            self.theme = nil
+        }
+    }
+}
+
+struct NativeEditorAddons {
+    let mentions: NativeMentionsAddonConfig?
+
+    static func from(json: String?) -> NativeEditorAddons {
+        guard let json,
+              let data = json.data(using: .utf8),
+              let raw = try? JSONSerialization.jsonObject(with: data) as? [String: Any]
+        else {
+            return NativeEditorAddons(mentions: nil)
+        }
+
+        return NativeEditorAddons(
+            mentions: (raw["mentions"] as? [String: Any]).flatMap(NativeMentionsAddonConfig.init(dictionary:))
+        )
+    }
+}
+
+struct MentionQueryState: Equatable {
+    let query: String
+    let trigger: String
+    let anchor: UInt32
+    let head: UInt32
+}
+
+func isMentionIdentifierScalar(_ scalar: Unicode.Scalar) -> Bool {
+    CharacterSet.alphanumerics.contains(scalar) || scalar == "_" || scalar == "-"
+}
+
+func resolveMentionQueryState(
+    in text: String,
+    cursorScalar: UInt32,
+    trigger: String,
+    isCaretInsideMention: Bool
+) -> MentionQueryState? {
+    guard !isCaretInsideMention else { return nil }
+
+    let scalars = Array(text.unicodeScalars)
+    let scalarCount = UInt32(scalars.count)
+    guard cursorScalar <= scalarCount else { return nil }
+
+    let triggerScalars = Array(trigger.unicodeScalars)
+    guard triggerScalars.count == 1, let triggerScalar = triggerScalars.first else {
+        return nil
+    }
+
+    var start = Int(cursorScalar)
+    while start > 0 {
+        let previous = scalars[start - 1]
+        if previous.properties.isWhitespace
+            || previous == "\n"
+            || previous == "\u{FFFC}"
+            || (!isMentionIdentifierScalar(previous) && previous != triggerScalar)
+        {
+            break
+        }
+        start -= 1
+    }
+
+    guard start < scalars.count, scalars[start] == triggerScalar else {
+        return nil
+    }
+    if start > 0 {
+        let previous = scalars[start - 1]
+        if isMentionIdentifierScalar(previous) {
+            return nil
+        }
+    }
+
+    let queryStart = start + 1
+    let cursor = Int(cursorScalar)
+    guard queryStart <= cursor else { return nil }
+    let query = String(String.UnicodeScalarView(scalars[queryStart..<cursor]))
+    if query.unicodeScalars.contains(where: {
+        $0.properties.isWhitespace || $0 == "\n" || $0 == "\u{FFFC}"
+    }) {
+        return nil
+    }
+
+    return MentionQueryState(
+        query: query,
+        trigger: trigger,
+        anchor: UInt32(start),
+        head: cursorScalar
+    )
+}
+
+final class MentionSuggestionChipButton: UIButton {
+    private static let horizontalContentInset: CGFloat = 8
+    private static let verticalContentInset: CGFloat = 8
+
+    private let titleLabelView = UILabel()
+    private let subtitleLabelView = UILabel()
+    private let stackView = UIStackView()
+    private var theme: EditorMentionTheme?
+    private var toolbarAppearance: EditorToolbarAppearance = .custom
+
+    let suggestion: NativeMentionSuggestion
+
+    init(
+        suggestion: NativeMentionSuggestion,
+        theme: EditorMentionTheme?,
+        toolbarAppearance: EditorToolbarAppearance = .custom
+    ) {
+        self.suggestion = suggestion
+        self.theme = theme
+        self.toolbarAppearance = toolbarAppearance
+        super.init(frame: .zero)
+        translatesAutoresizingMaskIntoConstraints = false
+        layer.cornerRadius = 12
+        clipsToBounds = true
+        if #available(iOS 15.0, *) {
+            var configuration = UIButton.Configuration.plain()
+            configuration.contentInsets = .zero
+            self.configuration = configuration
+        }
+
+        titleLabelView.translatesAutoresizingMaskIntoConstraints = false
+        titleLabelView.isUserInteractionEnabled = false
+        titleLabelView.font = .systemFont(ofSize: 14, weight: .semibold)
+        titleLabelView.text = suggestion.label
+        titleLabelView.numberOfLines = 1
+
+        subtitleLabelView.translatesAutoresizingMaskIntoConstraints = false
+        subtitleLabelView.isUserInteractionEnabled = false
+        subtitleLabelView.font = .systemFont(ofSize: 12)
+        subtitleLabelView.text = suggestion.subtitle
+        subtitleLabelView.numberOfLines = 1
+        subtitleLabelView.isHidden = suggestion.subtitle == nil
+
+        stackView.translatesAutoresizingMaskIntoConstraints = false
+        stackView.isUserInteractionEnabled = false
+        stackView.axis = .vertical
+        stackView.alignment = .fill
+        stackView.spacing = 1
+        stackView.addArrangedSubview(titleLabelView)
+        stackView.addArrangedSubview(subtitleLabelView)
+        addSubview(stackView)
+
+        NSLayoutConstraint.activate([
+            stackView.topAnchor.constraint(equalTo: topAnchor, constant: Self.verticalContentInset),
+            stackView.leadingAnchor.constraint(equalTo: leadingAnchor, constant: Self.horizontalContentInset),
+            stackView.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -Self.horizontalContentInset),
+            stackView.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -Self.verticalContentInset),
+            heightAnchor.constraint(greaterThanOrEqualToConstant: 40),
+        ])
+
+        addTarget(self, action: #selector(handleTouchDown), for: [.touchDown, .touchDragEnter])
+        addTarget(self, action: #selector(handleTouchUp), for: [.touchCancel, .touchDragExit, .touchUpInside, .touchUpOutside])
+        apply(theme: theme, toolbarAppearance: toolbarAppearance)
+        updateAppearance(highlighted: false)
+    }
+
+    required init?(coder: NSCoder) {
+        return nil
+    }
+
+    func apply(theme: EditorMentionTheme?, toolbarAppearance: EditorToolbarAppearance = .custom) {
+        self.theme = theme
+        self.toolbarAppearance = toolbarAppearance
+        layer.cornerRadius = theme?.borderRadius ?? 12
+        layer.borderColor = (theme?.borderColor ?? UIColor.clear).cgColor
+        layer.borderWidth = theme?.borderWidth ?? 0
+        subtitleLabelView.isHidden = suggestion.subtitle == nil
+        updateAppearance(highlighted: isHighlighted)
+    }
+
+    override var isHighlighted: Bool {
+        didSet {
+            updateAppearance(highlighted: isHighlighted)
+        }
+    }
+
+    override func tintColorDidChange() {
+        super.tintColorDidChange()
+        if toolbarAppearance == .native {
+            updateAppearance(highlighted: isHighlighted)
+        }
+    }
+
+    @objc private func handleTouchDown() {
+        updateAppearance(highlighted: true)
+    }
+
+    @objc private func handleTouchUp() {
+        updateAppearance(highlighted: false)
+    }
+
+    private func updateAppearance(highlighted: Bool) {
+        if toolbarAppearance == .native {
+            layer.cornerRadius = 18
+            layer.borderColor = UIColor.clear.cgColor
+            layer.borderWidth = 0
+            #if compiler(>=6.2)
+            if #available(iOS 26.0, *) {
+                stackView.isHidden = true
+                backgroundColor = .clear
+                var configuration = highlighted
+                    ? UIButton.Configuration.prominentGlass()
+                    : UIButton.Configuration.glass()
+                configuration.cornerStyle = .capsule
+                configuration.contentInsets = NSDirectionalEdgeInsets(
+                    top: Self.verticalContentInset,
+                    leading: Self.horizontalContentInset,
+                    bottom: Self.verticalContentInset,
+                    trailing: Self.horizontalContentInset
+                )
+                configuration.title = suggestion.label
+                configuration.subtitle = suggestion.subtitle
+                configuration.titleTextAttributesTransformer = UIConfigurationTextAttributesTransformer { incoming in
+                    var outgoing = incoming
+                    outgoing.font = .systemFont(ofSize: 14, weight: .semibold)
+                    return outgoing
+                }
+                self.configuration = configuration
+                return
+            }
+            #endif
+            stackView.isHidden = false
+            backgroundColor = highlighted
+                ? UIColor.white.withAlphaComponent(0.18)
+                : .clear
+            titleLabelView.textColor = tintColor
+            subtitleLabelView.textColor = tintColor.withAlphaComponent(0.72)
+            return
+        }
+
+        stackView.isHidden = false
+        if #available(iOS 15.0, *) {
+            var configuration = UIButton.Configuration.plain()
+            configuration.contentInsets = .zero
+            self.configuration = configuration
+        }
+        backgroundColor = highlighted
+            ? (theme?.optionHighlightedBackgroundColor ?? UIColor.systemBlue.withAlphaComponent(0.12))
+            : (theme?.backgroundColor ?? UIColor.secondarySystemBackground)
+        titleLabelView.textColor = highlighted
+            ? (theme?.optionHighlightedTextColor ?? theme?.optionTextColor ?? .label)
+            : (theme?.optionTextColor ?? theme?.textColor ?? .label)
+        subtitleLabelView.textColor = theme?.optionSecondaryTextColor ?? .secondaryLabel
+    }
+
+    func contentViewsAllowTouchPassthroughForTesting() -> Bool {
+        !stackView.isUserInteractionEnabled
+            && !titleLabelView.isUserInteractionEnabled
+            && !subtitleLabelView.isUserInteractionEnabled
+    }
+
+    func usesNativeAppearanceForTesting() -> Bool {
+        toolbarAppearance == .native
+    }
+
+    func titleTextColorForTesting() -> UIColor? {
+        titleLabelView.textColor
+    }
+
+    func subtitleTextColorForTesting() -> UIColor? {
+        subtitleLabelView.textColor
+    }
+
+    func usesNativeGlassTextRenderingForTesting() -> Bool {
+        #if compiler(>=6.2)
+        if #available(iOS 26.0, *) {
+            return toolbarAppearance == .native
+                && stackView.isHidden
+                && configuration?.title == suggestion.label
+        }
+        #endif
+        return false
+    }
+
+    func usesNativeGlassSemiboldTitleForTesting() -> Bool {
+        #if compiler(>=6.2)
+        if #available(iOS 26.0, *) {
+            return toolbarAppearance == .native
+                && stackView.isHidden
+                && configuration?.titleTextAttributesTransformer != nil
+        }
+        #endif
+        return false
+    }
+}

package/ios/EditorCore.xcframework/Info.plist

@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>AvailableLibraries</key>
+	<array>
+		<dict>
+			<key>BinaryPath</key>
+			<string>libeditor_core.a</string>
+			<key>LibraryIdentifier</key>
+			<string>ios-arm64</string>
+			<key>LibraryPath</key>
+			<string>libeditor_core.a</string>
+			<key>SupportedArchitectures</key>
+			<array>
+				<string>arm64</string>
+			</array>
+			<key>SupportedPlatform</key>
+			<string>ios</string>
+		</dict>
+		<dict>
+			<key>BinaryPath</key>
+			<string>libeditor_core.a</string>
+			<key>LibraryIdentifier</key>
+			<string>ios-arm64_x86_64-simulator</string>
+			<key>LibraryPath</key>
+			<string>libeditor_core.a</string>
+			<key>SupportedArchitectures</key>
+			<array>
+				<string>arm64</string>
+				<string>x86_64</string>
+			</array>
+			<key>SupportedPlatform</key>
+			<string>ios</string>
+			<key>SupportedPlatformVariant</key>
+			<string>simulator</string>
+		</dict>
+	</array>
+	<key>CFBundlePackageType</key>
+	<string>XFWK</string>
+	<key>XCFrameworkFormatVersion</key>
+	<string>1.0</string>
+</dict>
+</plist>