@lit-pigeon/editor 0.3.1 → 0.3.2

package/dist/index.d.ts

@@ -683,7 +683,15 @@ export declare class PigeonPaletteItem extends LitElement {
     columnCount: number;
     static styles: CSSResult;
     render(): TemplateResult<1>;
+    /** Suppresses the click that some browsers fire after a drag operation. */
+    private _didDrag;
+    private _onClick;
     private _onKeyDown;
+    /**
+     * Click/keyboard equivalent of dragging this item onto the canvas: ask the
+     * editor to append the block/layout to the document.
+     */
+    private _activate;
     private _onDragStart;
     private _onDragEnd;
 }

package/dist/index.js

@@ -1,11 +1,12 @@
 import { css as b, LitElement as g, html as l, nothing as te } from "lit";
 import { property as p, state as d, customElement as u } from "lit/decorators.js";
 import { t as s, c as Bt, r as po } from "./templates.js";
-import { P as Ur } from "./templates.js";
+import { P as Kr } from "./templates.js";
 import { getAllBlockDefinitions as co, getBlockDefinition as yt, updateBlock as ct, createBlock as Ye, insertBlock as ce, createColumn as Ie, insertRow as oe, createRow as Pe, cloneRowWithNewIds as jt, createBodySelection as Rt, deleteBlock as ho, deleteRow as Lt, duplicateBlock as go, duplicateRow as zt, generateId as Mt, EditorState as Ht, createHistoryPlugin as Ft, undo as uo, redo as bo, InMemoryTemplateStorage as vo, InMemoryRowLibraryStorage as fo, SYSTEM_LINK_TYPES as mo, createDocStep as dt, createDefaultDocument as _o, HISTORY_PLUGIN_NAME as Nt, canUndo as yo, canRedo as xo, createBlockSelection as ht, createRowSelection as Ut, createColumnSelection as $o, moveRow as wo, moveBlock as ko, updateRowAttributes as Co, addColumn as Io, removeColumn as Po, resizeColumns as To } from "@lit-pigeon/core";
 import { unsafeHTML as eo } from "lit/directives/unsafe-html.js";
-import { l as xt, r as So } from "./rich-text.js";
+import { l as xt, r as So } from "./rich-text-bridge.js";
 import { styleMap as Oo } from "lit/directives/style-map.js";
+import "./rich-text.js";
 const Kt = b`
   /* base palette */
   --pigeon-bg: #0f172a; /* slate-900 */
@@ -500,7 +501,7 @@ function Xe() {
 function wt(e, t) {
   e.dataTransfer && (e.dataTransfer.setData("application/json", JSON.stringify(t)), e.dataTransfer.effectAllowed = "move"), Bo(t);
 }
-function Hr(e) {
+function Fr(e) {
   if (e.dataTransfer)
     try {
       const t = e.dataTransfer.getData("application/json");
@@ -525,7 +526,7 @@ const Lo = {
 };
 let W = class extends g {
   constructor() {
-    super(...arguments), this.label = "", this.icon = "", this.dragType = "palette-block", this.blockType = "", this.columnCount = 1;
+    super(...arguments), this.label = "", this.icon = "", this.dragType = "palette-block", this.blockType = "", this.columnCount = 1, this._didDrag = !1;
   }
   render() {
     const e = Lo[this.icon] ?? this.icon ?? "?", t = this.dragType === "palette-row" ? "Add layout" : "Add block";
@@ -536,7 +537,8 @@ let W = class extends g {
         role="button"
         tabindex="0"
         aria-label="${t}: ${this.label}"
-        title="Drag onto the canvas, or press Enter to add"
+        title="Click to add, or drag onto the canvas"
+        @click=${this._onClick}
         @dragstart=${this._onDragStart}
         @dragend=${this._onDragEnd}
         @keydown=${this._onKeyDown}
@@ -546,8 +548,18 @@ let W = class extends g {
       </div>
     `;
   }
+  _onClick() {
+    this._didDrag || this._activate();
+  }
   _onKeyDown(e) {
-    e.key !== "Enter" && e.key !== " " || (e.preventDefault(), this.dispatchEvent(
+    e.key !== "Enter" && e.key !== " " || (e.preventDefault(), this._activate());
+  }
+  /**
+   * Click/keyboard equivalent of dragging this item onto the canvas: ask the
+   * editor to append the block/layout to the document.
+   */
+  _activate() {
+    this.dispatchEvent(
       new CustomEvent("palette-item-activate", {
         detail: {
           type: this.dragType,
@@ -557,10 +569,10 @@ let W = class extends g {
         bubbles: !0,
         composed: !0
       })
-    ));
+    );
   }
   _onDragStart(e) {
-    wt(e, {
+    this._didDrag = !0, wt(e, {
       type: this.dragType,
       blockType: this.blockType || void 0,
       columnCount: this.columnCount
@@ -577,7 +589,9 @@ let W = class extends g {
     });
   }
   _onDragEnd() {
-    this.dispatchEvent(new CustomEvent("palette-drag-end", {
+    setTimeout(() => {
+      this._didDrag = !1;
+    }, 0), this.dispatchEvent(new CustomEvent("palette-drag-end", {
       bubbles: !0,
       composed: !0
     }));
@@ -8769,7 +8783,7 @@ export {
   Re as PigeonSocialBlock,
   je as PigeonSpacerBlock,
   Ue as PigeonSpacingInput,
-  Ur as PigeonTemplatePicker,
+  Kr as PigeonTemplatePicker,
   de as PigeonTextBlock,
   E as PigeonTextPanel,
   K as PigeonToolbar,
@@ -8777,7 +8791,7 @@ export {
   Vo as calculateRowDropIndex,
   Xe as clearDragData,
   De as getDragData,
-  Hr as readDragTransfer,
+  Fr as readDragTransfer,
   Bo as setDragData,
   wt as writeDragTransfer
 };

package/dist/rich-text-bridge.js

@@ -0,0 +1,47 @@
+let t = null;
+function r() {
+  return t || (t = import("./rich-text.js").then((s) => s.default)), t;
+}
+class l {
+  constructor() {
+    this._active = null, this._listeners = /* @__PURE__ */ new Set(), this._held = !1;
+  }
+  setActive(e) {
+    if (this._active !== e) {
+      this._active = e;
+      for (const i of this._listeners) i(e);
+    }
+  }
+  /** Clear only if `editor` is the currently-active one (avoids races on rapid focus changes). */
+  clearIfActive(e) {
+    this._active === e && this.setActive(null);
+  }
+  /**
+   * "Focus hold" — set while the user operates a formatting control that lives
+   * outside the editable (the bubble's link field, the sidebar format panel's
+   * `<select>`/color inputs). Native form controls steal DOM focus, which would
+   * otherwise blur the editor and tear it down before the command runs. While
+   * held, the editor's blur handler keeps the editor alive and the active
+   * binding intact so the command can apply to the preserved selection.
+   */
+  holdFocus() {
+    this._held = !0;
+  }
+  releaseFocus() {
+    this._held = !1;
+  }
+  isHeld() {
+    return this._held;
+  }
+  getActive() {
+    return this._active;
+  }
+  subscribe(e) {
+    return this._listeners.add(e), () => this._listeners.delete(e);
+  }
+}
+const h = new l();
+export {
+  r as l,
+  h as r
+};