@ohhwells/bridge 0.1.40 → 0.1.42

package/dist/index.d.cts

@@ -132,6 +132,26 @@ declare function SchedulingWidget({ notifyOnConnect, initialScheduleId, insertAf
 
 declare const DragHandle: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
 
+/**
+ * Visual drop-gap line for navbar / footer / repeater reorder.
+ * Figma: Custom/Drop Indicator (8140:1731) — CSS class `.ov-gap-line`
+ *
+ * Opacity (Figma docs):
+ * - default: 0 (hidden)
+ * - hover: 1
+ * - dragIdle: 0.4
+ * - dragActive: 1
+ */
+declare const dropIndicatorVariants: (props?: ({
+    direction?: "horizontal" | "vertical" | null | undefined;
+    state?: "default" | "hover" | "dragIdle" | "dragActive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type DropIndicatorProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof dropIndicatorVariants>;
+declare const DropIndicator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    direction?: "horizontal" | "vertical" | null | undefined;
+    state?: "default" | "hover" | "dragIdle" | "dragActive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
+
 declare const CustomToolbar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 declare function CustomToolbarDivider({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react_jsx_runtime.JSX.Element;
 declare const CustomToolbarButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
@@ -175,4 +195,4 @@ declare function TooltipContent({ className, sideOffset, side, children, ...prop
 
 declare function isEditSessionActive(): boolean;
 
-export { CustomToolbar, CustomToolbarButton, CustomToolbarDivider, DragHandle, ItemActionToolbar, type ItemActionToolbarProps, ItemInteractionLayer, type ItemInteractionLayerProps, type ItemInteractionState, LinkEditorPanel, type LinkModalMode, type LinkModalProps, type LinkPage, LinkPopover, type LinkSection, OhhwellsBridge, SchedulingWidget, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, buildTarget, filterAvailablePages, getEditModeInitialState, isEditSessionActive, isValidUrl, parseTarget, toggleVariants, validateUrlInput };
+export { CustomToolbar, CustomToolbarButton, CustomToolbarDivider, DragHandle, DropIndicator, type DropIndicatorProps, ItemActionToolbar, type ItemActionToolbarProps, ItemInteractionLayer, type ItemInteractionLayerProps, type ItemInteractionState, LinkEditorPanel, type LinkModalMode, type LinkModalProps, type LinkPage, LinkPopover, type LinkSection, OhhwellsBridge, SchedulingWidget, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, buildTarget, dropIndicatorVariants, filterAvailablePages, getEditModeInitialState, isEditSessionActive, isValidUrl, parseTarget, toggleVariants, validateUrlInput };

package/dist/index.d.ts

@@ -132,6 +132,26 @@ declare function SchedulingWidget({ notifyOnConnect, initialScheduleId, insertAf
 
 declare const DragHandle: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
 
+/**
+ * Visual drop-gap line for navbar / footer / repeater reorder.
+ * Figma: Custom/Drop Indicator (8140:1731) — CSS class `.ov-gap-line`
+ *
+ * Opacity (Figma docs):
+ * - default: 0 (hidden)
+ * - hover: 1
+ * - dragIdle: 0.4
+ * - dragActive: 1
+ */
+declare const dropIndicatorVariants: (props?: ({
+    direction?: "horizontal" | "vertical" | null | undefined;
+    state?: "default" | "hover" | "dragIdle" | "dragActive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type DropIndicatorProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof dropIndicatorVariants>;
+declare const DropIndicator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    direction?: "horizontal" | "vertical" | null | undefined;
+    state?: "default" | "hover" | "dragIdle" | "dragActive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
+
 declare const CustomToolbar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 declare function CustomToolbarDivider({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react_jsx_runtime.JSX.Element;
 declare const CustomToolbarButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
@@ -175,4 +195,4 @@ declare function TooltipContent({ className, sideOffset, side, children, ...prop
 
 declare function isEditSessionActive(): boolean;
 
-export { CustomToolbar, CustomToolbarButton, CustomToolbarDivider, DragHandle, ItemActionToolbar, type ItemActionToolbarProps, ItemInteractionLayer, type ItemInteractionLayerProps, type ItemInteractionState, LinkEditorPanel, type LinkModalMode, type LinkModalProps, type LinkPage, LinkPopover, type LinkSection, OhhwellsBridge, SchedulingWidget, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, buildTarget, filterAvailablePages, getEditModeInitialState, isEditSessionActive, isValidUrl, parseTarget, toggleVariants, validateUrlInput };
+export { CustomToolbar, CustomToolbarButton, CustomToolbarDivider, DragHandle, DropIndicator, type DropIndicatorProps, ItemActionToolbar, type ItemActionToolbarProps, ItemInteractionLayer, type ItemInteractionLayerProps, type ItemInteractionState, LinkEditorPanel, type LinkModalMode, type LinkModalProps, type LinkPage, LinkPopover, type LinkSection, OhhwellsBridge, SchedulingWidget, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, buildTarget, dropIndicatorVariants, filterAvailablePages, getEditModeInitialState, isEditSessionActive, isValidUrl, parseTarget, toggleVariants, validateUrlInput };

package/dist/index.js

@@ -7014,6 +7014,22 @@ function placeCaretAtPoint(el, x, y) {
     }
   }
 }
+function selectAllTextInEditable(el) {
+  const selection = window.getSelection();
+  if (!selection) return;
+  const range = document.createRange();
+  range.selectNodeContents(el);
+  selection.removeAllRanges();
+  selection.addRange(range);
+}
+function getNavigationLabelEditable(target) {
+  const editable = target.closest('[data-ohw-editable="text"]');
+  if (!editable) return null;
+  const hrefCtx = getHrefKeyFromElement(editable);
+  const navAnchor = hrefCtx ? getNavigationItemAnchor(hrefCtx.anchor) : null;
+  if (!navAnchor) return null;
+  return { editable, navAnchor };
+}
 function collectSections() {
   return collectSectionsFromDom();
 }
@@ -8158,6 +8174,7 @@ function OhhwellsBridge() {
           e.preventDefault();
           e.stopPropagation();
           if (selectedElRef.current === navAnchor) {
+            if (e.detail >= 2) return;
             activateRef.current(editable, { caretX: e.clientX, caretY: e.clientY });
             return;
           }
@@ -8218,6 +8235,28 @@ function OhhwellsBridge() {
       deselectRef.current();
       deactivateRef.current();
     };
+    const handleDblClick = (e) => {
+      const target = e.target;
+      if (target.closest("[data-ohw-toolbar]")) return;
+      if (target.closest("[data-ohw-state-toggle]")) return;
+      if (target.closest("[data-ohw-max-badge]")) return;
+      if (isInsideLinkEditor(target)) return;
+      if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
+        return;
+      }
+      const navLabel = getNavigationLabelEditable(target);
+      if (!navLabel) return;
+      const { editable } = navLabel;
+      e.preventDefault();
+      e.stopPropagation();
+      if (activeElRef.current !== editable) {
+        activateRef.current(editable);
+      }
+      requestAnimationFrame(() => {
+        selectAllTextInEditable(editable);
+        refreshActiveCommandsRef.current();
+      });
+    };
     const handleMouseOver = (e) => {
       if (document.documentElement.hasAttribute("data-ohw-section-picking")) return;
       const target = e.target;
@@ -8939,6 +8978,15 @@ function OhhwellsBridge() {
     window.addEventListener("message", handleUiEscape);
     const handleKeyDown = (e) => {
       if (e.key === "Escape" && document.querySelector("[data-ohw-section-picker]")) return;
+      if ((e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "a" && activeElRef.current) {
+        const navAnchor = getNavigationItemAnchor(activeElRef.current);
+        if (navAnchor) {
+          e.preventDefault();
+          selectAllTextInEditable(activeElRef.current);
+          refreshActiveCommandsRef.current();
+          return;
+        }
+      }
       if (e.key === "Escape" && linkPopoverOpenRef.current) {
         setLinkPopoverRef.current(null);
         return;
@@ -9271,6 +9319,7 @@ function OhhwellsBridge() {
     };
     window.addEventListener("resize", handleViewportResize, { passive: true });
     document.addEventListener("click", handleClick, true);
+    document.addEventListener("dblclick", handleDblClick, true);
     document.addEventListener("paste", handlePaste, true);
     document.addEventListener("input", handleInput, true);
     document.addEventListener("mouseover", handleMouseOver, true);
@@ -9285,6 +9334,7 @@ function OhhwellsBridge() {
     window.addEventListener("scroll", handleScroll, true);
     return () => {
       document.removeEventListener("click", handleClick, true);
+      document.removeEventListener("dblclick", handleDblClick, true);
       document.removeEventListener("paste", handlePaste, true);
       document.removeEventListener("input", handleInput, true);
       document.removeEventListener("mouseover", handleMouseOver, true);
@@ -9671,11 +9721,54 @@ function OhhwellsBridge() {
     bridgeRoot
   ) : null;
 }
+
+// src/ui/drop-indicator.tsx
+import * as React10 from "react";
+import { jsx as jsx24 } from "react/jsx-runtime";
+var dropIndicatorVariants = cva(
+  "ov-gap-line pointer-events-none shrink-0 transition-opacity duration-150",
+  {
+    variants: {
+      direction: {
+        vertical: "h-6 w-[3px]",
+        horizontal: "h-[3px] w-[200px]"
+      },
+      state: {
+        default: "opacity-0",
+        hover: "opacity-100",
+        dragIdle: "opacity-40",
+        dragActive: "opacity-100"
+      }
+    },
+    defaultVariants: {
+      direction: "vertical",
+      state: "default"
+    }
+  }
+);
+var DropIndicator = React10.forwardRef(
+  ({ className, direction, state, ...props }, ref) => {
+    return /* @__PURE__ */ jsx24(
+      "div",
+      {
+        ref,
+        "data-slot": "drop-indicator",
+        "data-direction": direction ?? "vertical",
+        "data-state": state ?? "default",
+        "aria-hidden": "true",
+        className: cn(dropIndicatorVariants({ direction, state }), className),
+        ...props
+      }
+    );
+  }
+);
+DropIndicator.displayName = "DropIndicator";
 export {
   CustomToolbar,
   CustomToolbarButton,
   CustomToolbarDivider,
   DragHandle,
+  DropIndicator,
   ItemActionToolbar,
   ItemInteractionLayer,
   LinkEditorPanel,
@@ -9690,6 +9783,7 @@ export {
   TooltipProvider,
   TooltipTrigger,
   buildTarget,
+  dropIndicatorVariants,
   filterAvailablePages,
   getEditModeInitialState,
   isEditSessionActive,