@ohhwells/bridge 0.1.105 → 0.1.107

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -593,6 +593,19 @@ function alignSubjectOf(el) {
593
593
  while (subject.parentElement && !subject.parentElement.hasAttribute("data-ohw-section") && /^inline/.test(getComputedStyle(subject).display)) {
594
594
  subject = subject.parentElement;
595
595
  }
596
+ const TEXT_ROW = /^(P|LI|H[1-6]|BLOCKQUOTE|FIGCAPTION|DT|DD)$/;
597
+ const parent = subject.parentElement;
598
+ if (parent && TEXT_ROW.test(parent.tagName) && /^(inline-)?flex$/.test(getComputedStyle(parent).display)) {
599
+ return parent;
600
+ }
601
+ if (parent && !parent.hasAttribute("data-ohw-section")) {
602
+ const pcs = getComputedStyle(parent);
603
+ const children = Array.from(parent.children);
604
+ const textRowChild = (c) => c.hasAttribute("data-ohw-editable") || (c.textContent ?? "").trim().length === 0 || c.getAttribute("aria-hidden") === "true";
605
+ if (/^(inline-)?flex$/.test(pcs.display) && pcs.flexDirection.startsWith("row") && children.length > 0 && children.some((c) => c.hasAttribute("data-ohw-editable")) && children.every(textRowChild)) {
606
+ return parent;
607
+ }
608
+ }
596
609
  const row = subject.closest("li");
597
610
  if (row && row !== subject && /^(inline-)?flex$/.test(getComputedStyle(row).display)) {
598
611
  return row;
@@ -19501,10 +19514,21 @@ function OhhwellsBridge() {
19501
19514
  gap: 6px;
19502
19515
  }
19503
19516
  /* Not the form: it is a layout container (flex/grid with gaps), and forcing block
19504
- crushed its fields together (OHH-490). */
19505
- [data-ohw-editable]:not([data-ohw-editable="form"]) {
19517
+ crushed its fields together (OHH-490). Not media (image/bg-image/video/icon/map)
19518
+ either: those can be their own flex containers centering fallback content (a
19519
+ placeholder label, a mascot emoji) \u2014 forcing block broke that centering while the
19520
+ image was unset (OHH-758-ish). */
19521
+ [data-ohw-editable]:not([data-ohw-editable="form"]):not([data-ohw-editable="image"]):not([data-ohw-editable="bg-image"]):not([data-ohw-editable="video"]):not([data-ohw-editable="icon"]):not([data-ohw-editable="map"]) {
19506
19522
  display: block;
19507
19523
  }
19524
+ /* The block-force above is an author rule, so it beats the browser's own
19525
+ details-not-open child-display-none UA rule \u2014 origin always wins over specificity.
19526
+ Left alone, a closed FAQ's answer became a real, hoverable box that overflowed past
19527
+ the collapsed <details> into the gap before the next item. Restore the native
19528
+ collapse for editable content once it isn't the summary. */
19529
+ details:not([open]) > [data-ohw-editable]:not(summary) {
19530
+ display: none !important;
19531
+ }
19508
19532
  /* Body text (no item-action toolbar) \u2014 first click enters text edit \u2192 I-beam.
19509
19533
  Exclude select-first nav/footer labels so grab/default on [data-ohw-href-key] can win. */
19510
19534
  [data-ohw-editable]:not([contenteditable]):not([data-ohw-editable="image"]):not([data-ohw-editable="bg-image"]):not([data-ohw-editable="video"]):not([data-ohw-editable="link"]):not(:is([data-ohw-href-key] *)) {
@@ -19528,6 +19552,14 @@ function OhhwellsBridge() {
19528
19552
  [data-ohw-editable="video"], [data-ohw-editable="video"] *,
19529
19553
  [data-ohw-editable="bg-image"], [data-ohw-editable="bg-image"] * { cursor: pointer !important; }
19530
19554
  [data-ohw-editable="link"], [data-ohw-editable="link"] * { cursor: pointer !important; }
19555
+ /* A text/plain editable nested inside a media editable (e.g. a placeholder's fallback
19556
+ label inside its bg-image box) is its own click target, not the media picker \u2014 the
19557
+ blanket media cursor rule above would otherwise show pointer where a click actually
19558
+ opens text edit. */
19559
+ [data-ohw-editable="bg-image"] [data-ohw-editable="text"],
19560
+ [data-ohw-editable="bg-image"] [data-ohw-editable="text"] *,
19561
+ [data-ohw-editable="image"] [data-ohw-editable="text"],
19562
+ [data-ohw-editable="image"] [data-ohw-editable="text"] * { cursor: text !important; }
19531
19563
  /* A form field is a design surface in the editor: its input takes the pointer so the
19532
19564
  field can be picked and hovered from anywhere inside it (OHH-642). */
19533
19565
  [data-ohw-editable="form"] [data-ohw-form-field] input,
@@ -20114,6 +20146,8 @@ function OhhwellsBridge() {
20114
20146
  setFormHoverRect(null);
20115
20147
  }
20116
20148
  if (!editable) return;
20149
+ const editableRect = editable.getBoundingClientRect();
20150
+ if (editableRect.width <= 0 || editableRect.height <= 0) return;
20117
20151
  const selected = selectedElRef.current;
20118
20152
  if (selected && (selected === editable || selected.contains(editable))) return;
20119
20153
  if (!isMediaEditable(editable) && !editable.hasAttribute("contenteditable")) {
@@ -22217,6 +22251,18 @@ function OhhwellsBridge() {
22217
22251
  hoveredNavContainerRef.current = null;
22218
22252
  setHoveredNavContainerRect(null);
22219
22253
  };
22254
+ const handleDetailsToggle = (e) => {
22255
+ if (e.target?.tagName !== "DETAILS") return;
22256
+ document.querySelectorAll("[data-ohw-hovered]").forEach((hovered) => {
22257
+ hovered.removeAttribute("data-ohw-hovered");
22258
+ });
22259
+ setHoveredTextRect(null);
22260
+ hoveredItemElRef.current = null;
22261
+ setHoveredItemRect(null);
22262
+ hoveredNavContainerRef.current = null;
22263
+ setHoveredNavContainerRect(null);
22264
+ };
22265
+ document.addEventListener("toggle", handleDetailsToggle, true);
22220
22266
  window.addEventListener("resize", handleViewportResize, { passive: true });
22221
22267
  document.addEventListener("click", handleClick, true);
22222
22268
  document.addEventListener("dblclick", handleDblClick, true);
@@ -22234,6 +22280,7 @@ function OhhwellsBridge() {
22234
22280
  document.addEventListener("selectionchange", handleSelectionChange);
22235
22281
  window.addEventListener("scroll", handleScroll, true);
22236
22282
  return () => {
22283
+ document.removeEventListener("toggle", handleDetailsToggle, true);
22237
22284
  document.removeEventListener("click", handleClick, true);
22238
22285
  document.removeEventListener("dblclick", handleDblClick, true);
22239
22286
  document.removeEventListener("paste", handlePaste, true);
@@ -22487,7 +22534,7 @@ function OhhwellsBridge() {
22487
22534
  postToParent2({
22488
22535
  type: "ow:ready",
22489
22536
  version: "1",
22490
- bridgeVersion: "0.1.104",
22537
+ bridgeVersion: "0.1.106",
22491
22538
  path: pathname,
22492
22539
  nodes: collectEditableNodes(editContentRef.current),
22493
22540
  sections