WIP

frontend/src/app/main/ui/workspace/shapes/text/v2_editor.cljs

@@ -131,7 +131,8 @@
 
         on-style-change
         (fn [event]
-          (let [styles (styles/get-styles-from-event event)]
+          (let [
+            styles (styles/get-styles-from-event event)]
             (st/emit! (dwt/v2-update-text-editor-styles shape-id styles))))
 
         on-needs-layout

frontend/src/app/main/ui/workspace/shapes/text/v3_editor.cljs

@@ -0,0 +1,338 @@
+;; This Source Code Form is subject to the terms of the Mozilla Public
+;; License, v. 2.0. If a copy of the MPL was not distributed with this
+;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
+;;
+;; Copyright (c) KALEIDOS INC
+
+(ns app.main.ui.workspace.shapes.text.v3-editor
+  "Contenteditable DOM element for WASM text editor input"
+  (:require-macros [app.main.style :as stl])
+  (:require
+   [app.common.data.macros :as dm]
+   [app.common.geom.shapes :as gsh]
+   [app.common.math :as mth]
+   [app.main.data.helpers :as dsh]
+   [app.main.data.workspace.texts :as dwt]
+   [app.main.refs :as refs]
+   [app.main.store :as st]
+   [app.main.ui.css-cursors :as cur]
+   [app.render-wasm.api :as wasm.api]
+   [app.render-wasm.text-editor :as text-editor]
+   [app.util.dom :as dom]
+   [app.util.object :as obj]
+   [cuerdas.core :as str]
+   [rumext.v2 :as mf]
+   [app.main.ui.ds.foundations.assets.icon :as i]))
+
+(def caret-blink-interval-ms 250)
+
+(defn- sync-wasm-text-editor-content!
+  "Sync WASM text editor content back to the shape via the standard
+  commit pipeline. Called after every text-modifying input."
+  [& {:keys [finalize?]}]
+  (when-let [{:keys [shape-id content]}
+             (text-editor/text-editor-sync-content)]
+    (st/emit! (dwt/v2-update-text-shape-content
+               shape-id content
+               :update-name? true
+               :finalize? finalize?))))
+
+(defn- font-family-from-font-id [font-id]
+  (if (str/includes? font-id "gfont-noto-sans")
+    (let [lang (str/replace font-id #"gfont\-noto\-sans\-" "")]
+      (if (>= (count lang) 3) (str/capital lang) (str/upper lang)))
+    "Noto Color Emoji"))
+
+(mf/defc text-editor
+  "Contenteditable element positioned over the text shape to capture input events."
+  {::mf/wrap-props false}
+  [props]
+  (let [shape     (obj/get props "shape")
+        shape-id  (dm/get-prop shape :id)
+
+        clip-id   (dm/str "text-edition-clip" shape-id)
+
+        contenteditable-ref (mf/use-ref nil)
+        composing?          (mf/use-state false)
+
+        fallback-fonts    (wasm.api/fonts-from-text-content (:content shape) false)
+        fallback-families (map (fn [font]
+                                 (font-family-from-font-id (:font-id font))) fallback-fonts)
+
+        ;; Calculate screen position from shape bounds
+        bounds (gsh/shape->rect shape)
+
+        x      (mth/min (dm/get-prop bounds :x)
+                        (dm/get-prop shape :x))
+        y      (mth/min (dm/get-prop bounds :y)
+                        (dm/get-prop shape :y))
+        width  (mth/max (dm/get-prop bounds :width)
+                        (dm/get-prop shape :width))
+        height (mth/max (dm/get-prop bounds :height)
+                        (dm/get-prop shape :height))
+
+        [{:keys [x y width height]} transform]
+        (let [{:keys [width height]} (wasm.api/get-text-dimensions shape-id)
+              selrect-transform (mf/deref refs/workspace-selrect)
+              [selrect transform] (dsh/get-selrect selrect-transform shape)
+              selrect-height (:height selrect)
+              selrect-width (:width selrect)
+              max-width (max width selrect-width)
+              max-height (max height selrect-height)
+              valign (-> shape :content :vertical-align)
+              y (:y selrect)
+              y (case valign
+                  "bottom" (+ y (- selrect-height height))
+                  "center" (+ y (/ (- selrect-height height) 2))
+                  y)]
+          [(assoc selrect :y y :width max-width :height max-height) transform])
+
+        on-composition-start
+        (mf/use-fn
+         (fn [_event]
+           (reset! composing? true)))
+
+        on-composition-end
+        (mf/use-fn
+         (fn [^js event]
+           (reset! composing? false)
+           (let [data (.-data event)]
+             (when data
+               (text-editor/text-editor-insert-text data)
+               (sync-wasm-text-editor-content!)
+               (wasm.api/request-render "text-composition"))
+             (when-let [node (mf/ref-val contenteditable-ref)]
+               (set! (.-textContent node) "")))))
+
+        on-paste
+        (mf/use-fn
+         (fn [^js event]
+           (dom/prevent-default event)
+           (let [clipboard-data (.-clipboardData event)
+                 text (.getData clipboard-data "text/plain")]
+             (when (and text (seq text))
+               (text-editor/text-editor-insert-text text)
+               (sync-wasm-text-editor-content!)
+               (wasm.api/request-render "text-paste"))
+             (when-let [node (mf/ref-val contenteditable-ref)]
+               (set! (.-textContent node) "")))))
+
+        on-copy
+        (mf/use-fn
+         (fn [^js event]
+           (when (text-editor/text-editor-is-active?)
+             (dom/prevent-default event)
+             (when (text-editor/text-editor-get-selection)
+               (let [text (text-editor/text-editor-export-selection)]
+                 (.setData (.-clipboardData event) "text/plain" text))))))
+
+        on-key-down
+        (mf/use-fn
+         (fn [^js event]
+           (js/console.log (.-type event) (.-key event))
+           (when (and (text-editor/text-editor-is-active?)
+                      (not @composing?))
+
+             (let [key    (.-key event)
+                   ctrl?  (or (.-ctrlKey event) (.-metaKey event))
+                   shift? (.-shiftKey event)]
+
+               (cond
+                 ;; Escape: finalize and stop
+                 (= key "Escape")
+                 (do
+                   (dom/prevent-default event)
+                   (sync-wasm-text-editor-content! :finalize? true)
+                   (text-editor/text-editor-stop))
+
+                 ;; Ctrl+A: select all (key is "a" or "A" depending on platform)
+                 (and ctrl? (= (str/lower key) "a"))
+                 (do
+                   (dom/prevent-default event)
+                   (text-editor/text-editor-select-all)
+                   (wasm.api/request-render "text-select-all"))
+
+                 ;; Enter
+                 (= key "Enter")
+                 (do
+                   (dom/prevent-default event)
+                   (text-editor/text-editor-insert-paragraph)
+                   (sync-wasm-text-editor-content!)
+                   (wasm.api/request-render "text-paragraph"))
+
+                 ;; Backspace
+                 (= key "Backspace")
+                 (do
+                   (dom/prevent-default event)
+                   (text-editor/text-editor-delete-backward)
+                   (sync-wasm-text-editor-content!)
+                   (wasm.api/request-render "text-delete-backward"))
+
+                 ;; Delete
+                 (= key "Delete")
+                 (do
+                   (dom/prevent-default event)
+                   (text-editor/text-editor-delete-forward)
+                   (sync-wasm-text-editor-content!)
+                   (wasm.api/request-render "text-delete-forward"))
+
+                 ;; Arrow keys
+                 (= key "ArrowLeft")
+                 (do
+                   (dom/prevent-default event)
+                   (text-editor/text-editor-move-cursor 0 shift?)
+                   (wasm.api/request-render "text-cursor-move"))
+
+                 (= key "ArrowRight")
+                 (do
+                   (dom/prevent-default event)
+                   (text-editor/text-editor-move-cursor 1 shift?)
+                   (wasm.api/request-render "text-cursor-move"))
+
+                 (= key "ArrowUp")
+                 (do
+                   (dom/prevent-default event)
+                   (text-editor/text-editor-move-cursor 2 shift?)
+                   (wasm.api/request-render "text-cursor-move"))
+
+                 (= key "ArrowDown")
+                 (do
+                   (dom/prevent-default event)
+                   (text-editor/text-editor-move-cursor 3 shift?)
+                   (wasm.api/request-render "text-cursor-move"))
+
+                 (= key "Home")
+                 (do
+                   (dom/prevent-default event)
+                   (text-editor/text-editor-move-cursor 4 shift?)
+                   (wasm.api/request-render "text-cursor-move"))
+
+                 (= key "End")
+                 (do
+                   (dom/prevent-default event)
+                   (text-editor/text-editor-move-cursor 5 shift?)
+                   (wasm.api/request-render "text-cursor-move"))
+
+                 ;; Let contenteditable handle text input via on-input
+                 :else nil)))))
+
+        on-input
+        (mf/use-fn
+         (fn [^js event]
+           (js/console.log "event" event)
+           (let [native-event (.-nativeEvent event)
+                 input-type   (.-inputType native-event)
+                 data         (.-data native-event)]
+             ;; Skip composition-related input events - composition-end handles those
+             (when (and (not @composing?)
+                        (not= input-type "insertCompositionText"))
+               (when (and data (seq data))
+                 (text-editor/text-editor-insert-text data)
+                 (sync-wasm-text-editor-content!)
+                 (wasm.api/request-render "text-input"))
+               (when-let [node (mf/ref-val contenteditable-ref)]
+                 (set! (.-textContent node) ""))))))
+
+        on-pointer-down
+        (mf/use-fn
+         (fn [^js event]
+           (js/console.log (.-type event))
+           (let [native-event (dom/event->native-event event)
+                 off-pt (dom/get-offset-position native-event)]
+             (wasm.api/text-editor-pointer-down (.-x off-pt) (.-y off-pt)))))
+
+        on-pointer-move
+        (mf/use-fn
+         (fn [^js event]
+           (js/console.log (.-type event))
+           (let [native-event (dom/event->native-event event)
+                 off-pt (dom/get-offset-position native-event)]
+             (wasm.api/text-editor-pointer-move (.-x off-pt) (.-y off-pt)))))
+
+        on-pointer-up
+        (mf/use-fn
+         (fn [^js event]
+           (js/console.log (.-type event))
+           (let [native-event (dom/event->native-event event)
+                 off-pt (dom/get-offset-position native-event)]
+             (wasm.api/text-editor-pointer-up (.-x off-pt) (.-y off-pt)))))
+
+        on-click
+        (mf/use-fn
+         (fn [^js event]
+           (js/console.log (.-type event))
+           (let [native-event (dom/event->native-event event)
+                 off-pt (dom/get-offset-position native-event)]
+             (wasm.api/text-editor-set-cursor-from-offset (.-x off-pt) (.-y off-pt)))))
+
+        on-focus
+        (mf/use-fn
+         (fn [^js event]
+           (js/console.log (.-type event) event)))
+
+        on-blur
+        (mf/use-fn
+         (fn [^js event]
+           (js/console.log (.-type event) event)
+           (sync-wasm-text-editor-content!)
+           (wasm.api/text-editor-stop)))
+
+        style #js {:pointerEvents "all"
+                   "--editor-container-width" (dm/str width "px")
+                   "--editor-container-height" (dm/str height "px")
+                   "--fallback-families" (if (seq fallback-families) (dm/str (str/join ", " fallback-families)) "sourcesanspro")}]
+
+    ;; Focus contenteditable on mount
+    (mf/use-effect
+     (mf/deps contenteditable-ref)
+     (fn []
+       (when-let [node (mf/ref-val contenteditable-ref)]
+         (js/console.log "focusing")
+         (.focus node))))
+
+    (mf/use-effect
+     (fn []
+       (let [timeout-id (atom nil)
+             schedule-blink (fn schedule-blink []
+                              (when (text-editor/text-editor-is-active?)
+                                (wasm.api/request-render "cursor-blink"))
+                              (reset! timeout-id (js/setTimeout schedule-blink caret-blink-interval-ms)))]
+         (schedule-blink)
+         (fn []
+           (when @timeout-id
+             (js/clearTimeout @timeout-id))))))
+
+    ;; Composition and input events
+    [:g.text-editor {:clip-path (dm/fmt "url(#%)" clip-id)
+                     :transform (dm/str transform)
+                     :data-testid "text-editor"}
+     [:defs
+      [:clipPath {:id clip-id}
+       [:rect {:x x :y y :width width :height height}]]]
+
+     [:foreignObject {:x x :y y :width width :height height}
+      [:div {:on-click on-click
+             :on-pointer-down on-pointer-down
+             :on-pointer-move on-pointer-move
+             :on-pointer-up on-pointer-up
+             :class (stl/css :text-editor)
+             :style style}
+       [:div
+        {:ref contenteditable-ref
+         :contentEditable true
+         :suppressContentEditableWarning true
+         :on-composition-start on-composition-start
+         :on-composition-end on-composition-end
+         :on-key-down on-key-down
+         :on-input on-input
+         :on-paste on-paste
+         :on-copy on-copy
+         :on-focus on-focus
+         :on-blur on-blur
+         ;; FIXME on-click
+         ;; :on-click on-click
+         :id "text-editor-wasm-input"
+         :class (dm/str (cur/get-dynamic "text" (:rotation shape))
+                        " "
+                        (stl/css :text-editor-container))
+         :data-testid "text-editor-container"}]]]]))

frontend/src/app/main/ui/workspace/shapes/text/v3_editor.scss

@@ -0,0 +1,12 @@
+.text-editor {
+  height: 100%;
+}
+
+.text-editor-container {
+  height: 100%;
+  position: absolute;
+
+  opacity: 0;
+  overflow: hidden;
+  white-space: pre;
+}

frontend/src/app/main/ui/workspace/viewport/actions.cljs

@@ -94,23 +94,8 @@
                (st/emit! (mse/->MouseEvent :down ctrl? shift? alt? meta?)
                          ::dwsp/interrupt)
 
-               (when (wasm.api/text-editor-is-active?)
-                 (wasm.api/text-editor-pointer-down (.-x off-pt) (.-y off-pt)))
-
                (when (and (not= edition id) (or text-editing? grid-editing?))
-                 (st/emit! (dw/clear-edition-mode))
-                 ;; FIXME: I think this is not completely correct because this
-                 ;; is going to happen even when clicking or selecting text.
-                 ;; Sync and stop WASM text editor when exiting edit mode
-                 #_(when (and text-editing?
-                              (features/active-feature? @st/state "render-wasm/v1")
-                              wasm.wasm/context-initialized?)
-                     (when-let [{:keys [shape-id content]} (wasm.api/text-editor-sync-content)]
-                       (st/emit! (dwt/v2-update-text-shape-content
-                                  shape-id content
-                                  :update-name? true
-                                  :finalize? true)))
-                     (wasm.api/text-editor-stop)))
+                 (st/emit! (dw/clear-edition-mode)))
 
                (when (and (not text-editing?)
                           (not blocked)

frontend/src/app/main/ui/workspace/viewport_wasm.cljs

@@ -30,6 +30,7 @@
    [app.main.ui.workspace.shapes.text.editor :as editor-v1]
    [app.main.ui.workspace.shapes.text.text-edition-outline :refer [text-edition-outline]]
    [app.main.ui.workspace.shapes.text.v2-editor :as editor-v2]
+   [app.main.ui.workspace.shapes.text.v3-editor :as editor-v3]
    [app.main.ui.workspace.top-toolbar :refer [top-toolbar*]]
    [app.main.ui.workspace.viewport.actions :as actions]
    [app.main.ui.workspace.viewport.comments :as comments]
@@ -54,7 +55,6 @@
    [app.main.ui.workspace.viewport.viewport-ref :refer [create-viewport-ref]]
    [app.main.ui.workspace.viewport.widgets :as widgets]
    [app.render-wasm.api :as wasm.api]
-   [app.render-wasm.text-editor-input :refer [text-editor-input]]
    [app.util.debug :as dbg]
    [app.util.text-editor :as ted]
    [beicon.v2.core :as rx]
@@ -328,10 +328,14 @@
 
     (mf/with-effect [show-text-editor? workspace-editor-state edition]
       (let [active-editor-state (get workspace-editor-state edition)]
+        (js/console.log "show-text-editor?" show-text-editor?)
         (when (and show-text-editor? active-editor-state)
           (let [content (-> active-editor-state
                             (ted/get-editor-current-content)
                             (ted/export-content))]
+            (when-not (wasm.api/text-editor-is-active? edition)
+              (prn "hola")
+              (wasm.api/text-editor-start edition))
             (wasm.api/use-shape edition)
             (wasm.api/set-shape-text-content edition content)
             (let [dimension (wasm.api/get-text-dimensions)]
@@ -417,14 +421,7 @@
 
       (when picking-color?
         [:> pixel-overlay/pixel-overlay-wasm* {:viewport-ref viewport-ref
-                                               :canvas-ref canvas-ref}])
-
-      ;; WASM text editor contenteditable (must be outside SVG to work)
-      (when (and show-text-editor?
-                 (features/active-feature? @st/state "text-editor-wasm/v1"))
-        [:& text-editor-input {:shape editing-shape
-                               :zoom zoom
-                               :vbox vbox}])]
+                                               :canvas-ref canvas-ref}])]
 
      [:canvas {:id "render"
                :data-testid "canvas-wasm-shapes"
@@ -471,14 +468,20 @@
       [:g {:style {:pointer-events (if disable-events? "none" "auto")}}
        ;; Text editor handling:
        ;; - When text-editor-wasm/v1 is active, contenteditable is rendered in viewport-overlays (HTML DOM)
-       (when (and show-text-editor?
-                  (not (features/active-feature? @st/state "text-editor-wasm/v1")))
-         (if (features/active-feature? @st/state "text-editor/v2")
+       (when show-text-editor?
+         (cond
+           (features/active-feature? @st/state "text-editor-wasm/v1")
+           [:& editor-v3/text-editor {:shape editing-shape
+                                      :canvas-ref canvas-ref
+                                      :ref text-editor-ref}]
+
+           (features/active-feature? @st/state "text-editor/v2")
            [:& editor-v2/text-editor {:shape editing-shape
                                       :canvas-ref canvas-ref
                                       :ref text-editor-ref}]
-           [:& editor-v1/text-editor-svg {:shape editing-shape
-                                          :ref text-editor-ref}]))
+
+           :else [:& editor-v1/text-editor-svg {:shape editing-shape
+                                                :ref text-editor-ref}]))
 
        (when show-frame-outline?
          (let [outlined-frame-id

frontend/src/app/render_wasm/api.cljs

@@ -86,6 +86,7 @@
 ;; Re-export public text editor functions
 (def text-editor-start text-editor/text-editor-start)
 (def text-editor-stop text-editor/text-editor-stop)
+(def text-editor-set-cursor-from-offset text-editor/text-editor-set-cursor-from-offset)
 (def text-editor-set-cursor-from-point text-editor/text-editor-set-cursor-from-point)
 (def text-editor-pointer-down text-editor/text-editor-pointer-down)
 (def text-editor-pointer-move text-editor/text-editor-pointer-move)

frontend/src/app/render_wasm/text_editor.cljs

@@ -22,7 +22,14 @@
               (aget buffer 2)
               (aget buffer 3)))))
 
+(defn text-editor-set-cursor-from-offset
+  "Sets caret position from shape relative coordinates"
+  [x y]
+  (when wasm/context-initialized?
+    (h/call wasm/internal-module "_text_editor_set_cursor_from_offset" x y)))
+
 (defn text-editor-set-cursor-from-point
+  "Sets caret position from screen (canvas) coordinates"
   [x y]
   (when wasm/context-initialized?
     (h/call wasm/internal-module "_text_editor_set_cursor_from_point" x y)))

frontend/src/app/render_wasm/text_editor_input.cljs

@@ -203,6 +203,7 @@
           on-input
           (mf/use-fn
            (fn [^js event]
+             (js/console.log "event" event)
              (let [native-event (.-nativeEvent event)
                    input-type   (.-inputType native-event)
                    data         (.-data native-event)]
@@ -214,7 +215,17 @@
                    (sync-wasm-text-editor-content!)
                    (wasm.api/request-render "text-input"))
                  (when-let [node (mf/ref-val contenteditable-ref)]
-                   (set! (.-textContent node) ""))))))]
+                   (set! (.-textContent node) ""))))))
+
+          on-focus
+          (mf/use-fn
+           (fn [^js event]
+             (js/console.log (.-type event) event)))
+
+          on-blur
+          (mf/use-fn
+           (fn [^js event]
+             (js/console.log (.-type event) event)))]
 
       [:div
        {:ref contenteditable-ref
@@ -225,6 +236,8 @@
         :on-input on-input
         :on-paste on-paste
         :on-copy on-copy
+        :on-focus on-focus
+        :on-blur on-blur
         ;; FIXME on-click
         ;; :on-click on-click
         :id "text-editor-wasm-input"

render-wasm/src/state/text_editor.rs

@@ -142,9 +142,9 @@ impl TextEditorState {
         self.is_active = false;
         self.active_shape_id = None;
         self.cursor_visible = false;
+        self.last_blink_time = 0.0;
         self.is_pointer_selection_active = false;
         self.pending_events.clear();
-        self.reset_blink();
     }
 
     pub fn start_pointer_selection(&mut self) -> bool {
@@ -195,13 +195,11 @@ impl TextEditorState {
 
     pub fn set_caret_from_position(&mut self, position: &TextPositionWithAffinity) {
         self.selection.set_caret(*position);
-        self.reset_blink();
         self.push_event(TextEditorEvent::SelectionChanged);
     }
 
     pub fn extend_selection_from_position(&mut self, position: &TextPositionWithAffinity) {
         self.selection.extend_to(*position);
-        self.reset_blink();
         self.push_event(TextEditorEvent::SelectionChanged);
     }
 

render-wasm/src/wasm/text_editor.rs

@@ -126,11 +126,9 @@ pub extern "C" fn text_editor_pointer_down(x: f32, y: f32) {
             return;
         };
         let point = Point::new(x, y);
-        let view_matrix: Matrix = state.render_state.viewbox.get_matrix();
-        let shape_matrix = shape.get_matrix();
         state.text_editor_state.start_pointer_selection();
         if let Some(position) =
-            text_content.get_caret_position_from_screen_coords(&point, &view_matrix, &shape_matrix)
+            text_content.get_caret_position_from_shape_coords(&point)
         {
             state.text_editor_state.set_caret_from_position(&position);
         }
@@ -143,7 +141,6 @@ pub extern "C" fn text_editor_pointer_move(x: f32, y: f32) {
         if !state.text_editor_state.is_active {
             return;
         }
-        let view_matrix: Matrix = state.render_state.viewbox.get_matrix();
         let point = Point::new(x, y);
         let Some(shape_id) = state.text_editor_state.active_shape_id else {
             return;
@@ -151,11 +148,6 @@ pub extern "C" fn text_editor_pointer_move(x: f32, y: f32) {
         let Some(shape) = state.shapes.get(&shape_id) else {
             return;
         };
-        let shape_matrix = shape.get_matrix();
-        let Some(_shape_rel_point) = Shape::get_relative_point(&point, &view_matrix, &shape_matrix)
-        else {
-            return;
-        };
         if !state.text_editor_state.is_pointer_selection_active {
             return;
         }
@@ -164,7 +156,7 @@ pub extern "C" fn text_editor_pointer_move(x: f32, y: f32) {
         };
 
         if let Some(position) =
-            text_content.get_caret_position_from_screen_coords(&point, &view_matrix, &shape_matrix)
+            text_content.get_caret_position_from_shape_coords(&point)
         {
             state
                 .text_editor_state
@@ -179,7 +171,6 @@ pub extern "C" fn text_editor_pointer_up(x: f32, y: f32) {
         if !state.text_editor_state.is_active {
             return;
         }
-        let view_matrix: Matrix = state.render_state.viewbox.get_matrix();
         let point = Point::new(x, y);
         let Some(shape_id) = state.text_editor_state.active_shape_id else {
             return;
@@ -187,11 +178,6 @@ pub extern "C" fn text_editor_pointer_up(x: f32, y: f32) {
         let Some(shape) = state.shapes.get(&shape_id) else {
             return;
         };
-        let shape_matrix = shape.get_matrix();
-        let Some(_shape_rel_point) = Shape::get_relative_point(&point, &view_matrix, &shape_matrix)
-        else {
-            return;
-        };
         if !state.text_editor_state.is_pointer_selection_active {
             return;
         }
@@ -199,7 +185,7 @@ pub extern "C" fn text_editor_pointer_up(x: f32, y: f32) {
             return;
         };
         if let Some(position) =
-            text_content.get_caret_position_from_screen_coords(&point, &view_matrix, &shape_matrix)
+            text_content.get_caret_position_from_shape_coords(&point)
         {
             state
                 .text_editor_state
@@ -209,6 +195,31 @@ pub extern "C" fn text_editor_pointer_up(x: f32, y: f32) {
     });
 }
 
+#[no_mangle]
+pub extern "C" fn text_editor_set_cursor_from_offset(x: f32, y: f32) {
+    with_state_mut!(state, {
+        if !state.text_editor_state.is_active {
+            return;
+        }
+
+        let point = Point::new(x, y);
+        let Some(shape_id) = state.text_editor_state.active_shape_id else {
+            return;
+        };
+        let Some(shape) = state.shapes.get(&shape_id) else {
+            return;
+        };
+        let Type::Text(text_content) = &shape.shape_type else {
+            return;
+        };
+        if let Some(position) =
+            text_content.get_caret_position_from_shape_coords(&point)
+        {
+            state.text_editor_state.set_caret_from_position(&position);
+        }
+    });
+}
+
 #[no_mangle]
 pub extern "C" fn text_editor_set_cursor_from_point(x: f32, y: f32) {
     with_state_mut!(state, {