@humandialog/forms.svelte 1.2.4 → 1.2.5

package/components/document/editor.svelte

@@ -133,7 +133,8 @@ const suggestion = {
         if (!props.clientRect) {
           return;
         }
-        show_command_palette();
+        const cursorRect = props.clientRect();
+        show_command_palette(cursorRect);
         palette.set_current_editor_range(props.range);
         palette.filter("");
       },
@@ -528,8 +529,8 @@ function on_palette_shown() {
 function on_palette_hidden() {
   is_command_palette_visible = false;
 }
-function show_command_palette() {
-  let rect = get_selection_bbox();
+function show_command_palette(cursorRect) {
+  let rect = cursorRect;
   let client_rect = get_window_box();
   let top_space = rect.y;
   let bottom_space = client_rect.height - (rect.y + rect.height);

package/components/document/internal/palette.svelte

@@ -26,19 +26,21 @@ export function showAsToolbox(rect) {
   const windowWidth = window.innerWidth - 2 * margin;
   toolboxX = margin;
   toolboxY = rect.bottom + margin;
-  const mainContentDiv = document.getElementById("__hd_svelte_main_content_container");
   toolboxY += window.scrollY;
   css_style = `position: absolute; left:${toolboxX}px; top:${toolboxY}px;`;
   dispatch("palette_shown");
 }
-let toolboxElement;
+let paletteElement;
 afterUpdate(
   async () => {
-    if (isToolbox && visible && toolboxElement) {
+    if (
+      /*isToolbox && */
+      visible && paletteElement
+    ) {
       let layoutRoot = document.getElementById("__hd_svelte_layout_root");
-      if (!!layoutRoot && toolboxElement.parentElement != layoutRoot) {
+      if (!!layoutRoot && paletteElement.parentElement != layoutRoot) {
         await tick();
-        layoutRoot.appendChild(toolboxElement);
+        layoutRoot.appendChild(paletteElement);
       }
     }
   }
@@ -181,7 +183,7 @@ function mouseup(e) {
             on:touchstart={mousedown}
             on:touchmove={mousemove}
             on:touchend={mouseup}
-            bind:this={toolboxElement}>
+            bind:this={paletteElement}>
         {#if filtered_commands && filtered_commands.length}
             {#each filtered_commands as cmd, idx (cmd.caption)}
                 {@const id = "cpi_" + idx}
@@ -208,7 +210,8 @@ function mouseup(e) {
 {:else}
     <div    class="not-prose bg-white dark:bg-stone-800 text-stone-500 dark:text-stone-400 rounded-lg border border-stone-200 dark:border-stone-700 shadow-md z-30" 
             hidden={!visible}
-            style={css_style}>
+            style={css_style}
+            bind:this={paletteElement}>
         {#if filtered_commands && filtered_commands.length}
             {#each filtered_commands as cmd, idx (cmd.caption)}
                 {@const id = "cpi_" + idx}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@humandialog/forms.svelte",
-  "version": "1.2.4",
+  "version": "1.2.5",
   "description": "Basic Svelte UI components for Object Reef applications",
   "devDependencies": {
     "@playwright/test": "^1.28.1",