@ohhwells/bridge 0.1.43 → 0.1.45

package/dist/index.d.cts

@@ -152,8 +152,14 @@ declare const DropIndicator: React.ForwardRefExoticComponent<React.HTMLAttribute
     state?: "default" | "hover" | "dragIdle" | "dragActive" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
 
+/**
+ * Custom/Toolbar shell (Figma 7320:11058).
+ * One pill, two fills — text formatting or item actions. No hardcoded colors.
+ */
 declare const CustomToolbar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+/** Separators belong on the text-format fill only — not item-actions. */
 declare function CustomToolbarDivider({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react_jsx_runtime.JSX.Element;
+/** Figma Toggle: 28×28, radius calc(var(--radius)-2px)=6px, icon 16. */
 declare const CustomToolbarButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
     active?: boolean;
 } & React.RefAttributes<HTMLButtonElement>>;
@@ -165,11 +171,15 @@ type ItemActionToolbarProps = {
     editLinkDisabled?: boolean;
     addItemDisabled?: boolean;
     moreDisabled?: boolean;
+    /** Hide Add item — CTA buttons only show Edit link (prototype). */
+    showAddItem?: boolean;
+    /** Hide More — CTA buttons only show Edit link (prototype). */
+    showMore?: boolean;
     /** Tooltip placement relative to each icon — Figma uses bottom. */
     tooltipSide?: 'top' | 'bottom' | 'left' | 'right';
 };
-/** Item-action fill for Custom/Toolbar — Edit link / Add item / More. */
-declare function ItemActionToolbar({ onEditLink, onAddItem, onMore, editLinkDisabled, addItemDisabled, moreDisabled, tooltipSide, }: ItemActionToolbarProps): react_jsx_runtime.JSX.Element;
+/** Item-action fill for Custom/Toolbar — Edit link / Add item / More (no separators). */
+declare function ItemActionToolbar({ onEditLink, onAddItem, onMore, editLinkDisabled, addItemDisabled, moreDisabled, showAddItem, showMore, tooltipSide, }: ItemActionToolbarProps): react_jsx_runtime.JSX.Element;
 
 type ItemInteractionState = 'default' | 'hover' | 'sibling-hint' | 'active-top' | 'active-bottom' | 'dragging';
 type ItemInteractionLayerProps = {
@@ -183,15 +193,31 @@ type ItemInteractionLayerProps = {
     dragHandleLabel?: string;
     onDragHandleDragStart?: (e: React.DragEvent<HTMLButtonElement>) => void;
     onDragHandleDragEnd?: (e: React.DragEvent<HTMLButtonElement>) => void;
+    /** Press on the item chrome (not handle/toolbar) — starts press-to-drag. */
+    onItemPointerDown?: (e: React.PointerEvent<HTMLDivElement>) => void;
+    /** Click on chrome without a drag — typically enter text edit. */
+    onItemClick?: (clientX: number, clientY: number) => void;
+    /**
+     * Full-bleed press-drag surface over the selection.
+     * Disable for footer column frames so child links keep grab cursor / hover.
+     */
+    itemDragSurface?: boolean;
+    /** Gap between element and chrome border — Figma inset is 4px. */
     chromeGap?: number;
     className?: string;
 };
-declare function ItemInteractionLayer({ rect, state, elRef, toolbar, showHandle, dragDisabled, dragHandleLabel, onDragHandleDragStart, onDragHandleDragEnd, chromeGap, className, }: ItemInteractionLayerProps): react_jsx_runtime.JSX.Element | null;
+declare function ItemInteractionLayer({ rect, state, elRef, toolbar, showHandle, dragDisabled, dragHandleLabel, onDragHandleDragStart, onDragHandleDragEnd, onItemPointerDown, onItemClick, itemDragSurface, chromeGap, className, }: ItemInteractionLayerProps): react_jsx_runtime.JSX.Element | null;
 
 declare function TooltipProvider({ delayDuration, ...props }: React.ComponentProps<typeof Tooltip$1.Provider>): react_jsx_runtime.JSX.Element;
 declare function Tooltip({ ...props }: React.ComponentProps<typeof Tooltip$1.Root>): react_jsx_runtime.JSX.Element;
 declare function TooltipTrigger({ ...props }: React.ComponentProps<typeof Tooltip$1.Trigger>): react_jsx_runtime.JSX.Element;
-declare function TooltipContent({ className, sideOffset, side, children, ...props }: React.ComponentProps<typeof Tooltip$1.Content>): react_jsx_runtime.JSX.Element;
+/**
+ * Tooltip content — CSS caret (not Radix Arrow) so `sideOffset` is the true
+ * trigger↔tooltip gap. Default 6px matches item-action toolbar AC.
+ */
+declare function TooltipContent({ className, sideOffset, side, children, hideArrow, ...props }: React.ComponentProps<typeof Tooltip$1.Content> & {
+    hideArrow?: boolean;
+}): react_jsx_runtime.JSX.Element;
 
 declare function isEditSessionActive(): boolean;
 

package/dist/index.d.ts

@@ -152,8 +152,14 @@ declare const DropIndicator: React.ForwardRefExoticComponent<React.HTMLAttribute
     state?: "default" | "hover" | "dragIdle" | "dragActive" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
 
+/**
+ * Custom/Toolbar shell (Figma 7320:11058).
+ * One pill, two fills — text formatting or item actions. No hardcoded colors.
+ */
 declare const CustomToolbar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+/** Separators belong on the text-format fill only — not item-actions. */
 declare function CustomToolbarDivider({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react_jsx_runtime.JSX.Element;
+/** Figma Toggle: 28×28, radius calc(var(--radius)-2px)=6px, icon 16. */
 declare const CustomToolbarButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
     active?: boolean;
 } & React.RefAttributes<HTMLButtonElement>>;
@@ -165,11 +171,15 @@ type ItemActionToolbarProps = {
     editLinkDisabled?: boolean;
     addItemDisabled?: boolean;
     moreDisabled?: boolean;
+    /** Hide Add item — CTA buttons only show Edit link (prototype). */
+    showAddItem?: boolean;
+    /** Hide More — CTA buttons only show Edit link (prototype). */
+    showMore?: boolean;
     /** Tooltip placement relative to each icon — Figma uses bottom. */
     tooltipSide?: 'top' | 'bottom' | 'left' | 'right';
 };
-/** Item-action fill for Custom/Toolbar — Edit link / Add item / More. */
-declare function ItemActionToolbar({ onEditLink, onAddItem, onMore, editLinkDisabled, addItemDisabled, moreDisabled, tooltipSide, }: ItemActionToolbarProps): react_jsx_runtime.JSX.Element;
+/** Item-action fill for Custom/Toolbar — Edit link / Add item / More (no separators). */
+declare function ItemActionToolbar({ onEditLink, onAddItem, onMore, editLinkDisabled, addItemDisabled, moreDisabled, showAddItem, showMore, tooltipSide, }: ItemActionToolbarProps): react_jsx_runtime.JSX.Element;
 
 type ItemInteractionState = 'default' | 'hover' | 'sibling-hint' | 'active-top' | 'active-bottom' | 'dragging';
 type ItemInteractionLayerProps = {
@@ -183,15 +193,31 @@ type ItemInteractionLayerProps = {
     dragHandleLabel?: string;
     onDragHandleDragStart?: (e: React.DragEvent<HTMLButtonElement>) => void;
     onDragHandleDragEnd?: (e: React.DragEvent<HTMLButtonElement>) => void;
+    /** Press on the item chrome (not handle/toolbar) — starts press-to-drag. */
+    onItemPointerDown?: (e: React.PointerEvent<HTMLDivElement>) => void;
+    /** Click on chrome without a drag — typically enter text edit. */
+    onItemClick?: (clientX: number, clientY: number) => void;
+    /**
+     * Full-bleed press-drag surface over the selection.
+     * Disable for footer column frames so child links keep grab cursor / hover.
+     */
+    itemDragSurface?: boolean;
+    /** Gap between element and chrome border — Figma inset is 4px. */
     chromeGap?: number;
     className?: string;
 };
-declare function ItemInteractionLayer({ rect, state, elRef, toolbar, showHandle, dragDisabled, dragHandleLabel, onDragHandleDragStart, onDragHandleDragEnd, chromeGap, className, }: ItemInteractionLayerProps): react_jsx_runtime.JSX.Element | null;
+declare function ItemInteractionLayer({ rect, state, elRef, toolbar, showHandle, dragDisabled, dragHandleLabel, onDragHandleDragStart, onDragHandleDragEnd, onItemPointerDown, onItemClick, itemDragSurface, chromeGap, className, }: ItemInteractionLayerProps): react_jsx_runtime.JSX.Element | null;
 
 declare function TooltipProvider({ delayDuration, ...props }: React.ComponentProps<typeof Tooltip$1.Provider>): react_jsx_runtime.JSX.Element;
 declare function Tooltip({ ...props }: React.ComponentProps<typeof Tooltip$1.Root>): react_jsx_runtime.JSX.Element;
 declare function TooltipTrigger({ ...props }: React.ComponentProps<typeof Tooltip$1.Trigger>): react_jsx_runtime.JSX.Element;
-declare function TooltipContent({ className, sideOffset, side, children, ...props }: React.ComponentProps<typeof Tooltip$1.Content>): react_jsx_runtime.JSX.Element;
+/**
+ * Tooltip content — CSS caret (not Radix Arrow) so `sideOffset` is the true
+ * trigger↔tooltip gap. Default 6px matches item-action toolbar AC.
+ */
+declare function TooltipContent({ className, sideOffset, side, children, hideArrow, ...props }: React.ComponentProps<typeof Tooltip$1.Content> & {
+    hideArrow?: boolean;
+}): react_jsx_runtime.JSX.Element;
 
 declare function isEditSessionActive(): boolean;