@ohhwells/bridge 0.1.38-next.69 → 0.1.39

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.d.cts CHANGED
@@ -27,7 +27,6 @@ type LinkModalProps = {
27
27
  onClose: () => void;
28
28
  onSubmit: (target: string) => void;
29
29
  };
30
- type LinkModalStep = 'input' | 'sectionPicker' | 'confirmed';
31
30
  type SelectedPage = {
32
31
  path: string;
33
32
  title: string;
@@ -43,55 +42,10 @@ type LinkPopoverProps = LinkModalProps & {
43
42
  portalContainer?: HTMLElement | null;
44
43
  };
45
44
  /** Centered link editor dialog (shadcn Dialog + Radix). */
46
- declare function LinkPopover({ open, panelRef, portalContainer, onClose, mode, pages, sections, sectionsByPath, initialTarget, existingTargets, onSubmit, }: LinkPopoverProps): react_jsx_runtime.JSX.Element;
45
+ declare function LinkPopover({ open, panelRef, portalContainer, onClose, ...editorProps }: LinkPopoverProps): react_jsx_runtime.JSX.Element;
47
46
 
48
- type UseLinkModalStateParams = {
49
- open: boolean;
50
- mode: LinkModalMode;
51
- pages: LinkPage[];
52
- sections: LinkSection[];
53
- sectionsByPath?: Record<string, LinkSection[]>;
54
- initialTarget?: string;
55
- existingTargets: string[];
56
- onClose: () => void;
57
- onSubmit: (target: string) => void;
58
- };
59
- declare function useLinkModalState({ open, mode, pages, sections: _sections, sectionsByPath, initialTarget, existingTargets: _existingTargets, onClose, onSubmit, }: UseLinkModalStateParams): {
60
- title: string;
61
- submitLabel: string;
62
- secondaryLabel: string;
63
- searchValue: string;
64
- selectedPage: SelectedPage | null;
65
- selectedSection: SelectedSection | null;
66
- step: LinkModalStep;
67
- dropdownOpen: boolean;
68
- setDropdownOpen: React.Dispatch<React.SetStateAction<boolean>>;
69
- urlError: string;
70
- filteredPages: LinkPage[];
71
- showBreadcrumb: false | SelectedSection | null;
72
- showSectionPicker: false | SelectedPage | null;
73
- showChooseSection: boolean | null;
74
- showSectionRow: boolean | null;
75
- isValid: boolean;
76
- activeSections: LinkSection[];
77
- handleInputChange: (value: string) => void;
78
- handlePageSelect: (page: LinkPage) => void;
79
- handleChooseSection: () => void;
80
- handleSectionSelect: (section: LinkSection) => void;
81
- handleBackToSections: () => void;
82
- handleSectionPickerBack: () => void;
83
- handleClose: () => void;
84
- handleSecondary: () => void;
85
- handleSubmit: () => void;
86
- };
87
-
88
- type LinkModalState = ReturnType<typeof useLinkModalState>;
89
- type LinkEditorPanelProps = {
90
- state: LinkModalState;
91
- onClose: () => void;
92
- };
93
47
  /** Link destination editor body — Figma node 8365:7616 / 8382:4161 */
94
- declare function LinkEditorPanel({ state, onClose }: LinkEditorPanelProps): react_jsx_runtime.JSX.Element;
48
+ declare function LinkEditorPanel({ open, mode, pages, sections, sectionsByPath, initialTarget, existingTargets, onClose, onSubmit, }: LinkModalProps): react_jsx_runtime.JSX.Element;
95
49
 
96
50
  declare function parseTarget(target: string | null | undefined): {
97
51
  pageRoute: string;
@@ -132,26 +86,6 @@ declare function SchedulingWidget({ notifyOnConnect, initialScheduleId, insertAf
132
86
 
133
87
  declare const DragHandle: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
134
88
 
135
- /**
136
- * Visual drop-gap line for navbar / footer / repeater reorder.
137
- * Figma: Custom/Drop Indicator (8140:1731) — CSS class `.ov-gap-line`
138
- *
139
- * Opacity (Figma docs):
140
- * - default: 0 (hidden)
141
- * - hover: 1
142
- * - dragIdle: 0.4
143
- * - dragActive: 1
144
- */
145
- declare const dropIndicatorVariants: (props?: ({
146
- direction?: "horizontal" | "vertical" | null | undefined;
147
- state?: "default" | "hover" | "dragIdle" | "dragActive" | null | undefined;
148
- } & class_variance_authority_types.ClassProp) | undefined) => string;
149
- type DropIndicatorProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof dropIndicatorVariants>;
150
- declare const DropIndicator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
151
- direction?: "horizontal" | "vertical" | null | undefined;
152
- state?: "default" | "hover" | "dragIdle" | "dragActive" | null | undefined;
153
- } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
154
-
155
89
  declare const CustomToolbar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
156
90
  declare function CustomToolbarDivider({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react_jsx_runtime.JSX.Element;
157
91
  declare const CustomToolbarButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
@@ -162,35 +96,30 @@ type ItemActionToolbarProps = {
162
96
  onEditLink?: () => void;
163
97
  onAddItem?: () => void;
164
98
  onMore?: () => void;
165
- editLinkDisabled?: boolean;
166
99
  addItemDisabled?: boolean;
167
100
  moreDisabled?: boolean;
168
101
  /** Tooltip placement relative to each icon — Figma uses bottom. */
169
102
  tooltipSide?: 'top' | 'bottom' | 'left' | 'right';
170
103
  };
171
104
  /** Item-action fill for Custom/Toolbar — Edit link / Add item / More. */
172
- declare function ItemActionToolbar({ onEditLink, onAddItem, onMore, editLinkDisabled, addItemDisabled, moreDisabled, tooltipSide, }: ItemActionToolbarProps): react_jsx_runtime.JSX.Element;
105
+ declare function ItemActionToolbar({ onEditLink, onAddItem, onMore, addItemDisabled, moreDisabled, tooltipSide, }: ItemActionToolbarProps): react_jsx_runtime.JSX.Element;
173
106
 
174
107
  type ItemInteractionState = 'default' | 'hover' | 'sibling-hint' | 'active-top' | 'active-bottom' | 'dragging';
175
108
  type ItemInteractionLayerProps = {
176
109
  rect: DOMRect;
177
110
  state: ItemInteractionState;
178
111
  elRef?: React.Ref<HTMLDivElement>;
179
- /** Slotted Custom/Toolbar instance (item-action or other fill). */
112
+ /** Slotted Custom/Toolbar instance (item-action or other fill). */
180
113
  toolbar?: React.ReactNode;
181
114
  showHandle?: boolean;
182
115
  dragDisabled?: boolean;
183
116
  dragHandleLabel?: string;
184
117
  onDragHandleDragStart?: (e: React.DragEvent<HTMLButtonElement>) => void;
185
118
  onDragHandleDragEnd?: (e: React.DragEvent<HTMLButtonElement>) => void;
186
- /** Press on the item chrome (not handle/toolbar) — starts press-to-drag. */
187
- onItemPointerDown?: (e: React.PointerEvent<HTMLDivElement>) => void;
188
- /** Click on chrome without a drag — typically enter text edit. */
189
- onItemClick?: (clientX: number, clientY: number) => void;
190
119
  chromeGap?: number;
191
120
  className?: string;
192
121
  };
193
- declare function ItemInteractionLayer({ rect, state, elRef, toolbar, showHandle, dragDisabled, dragHandleLabel, onDragHandleDragStart, onDragHandleDragEnd, onItemPointerDown, onItemClick, chromeGap, className, }: ItemInteractionLayerProps): react_jsx_runtime.JSX.Element | null;
122
+ declare function ItemInteractionLayer({ rect, state, elRef, toolbar, showHandle, dragDisabled, dragHandleLabel, onDragHandleDragStart, onDragHandleDragEnd, chromeGap, className, }: ItemInteractionLayerProps): react_jsx_runtime.JSX.Element | null;
194
123
 
195
124
  declare function TooltipProvider({ delayDuration, ...props }: React.ComponentProps<typeof Tooltip$1.Provider>): react_jsx_runtime.JSX.Element;
196
125
  declare function Tooltip({ ...props }: React.ComponentProps<typeof Tooltip$1.Root>): react_jsx_runtime.JSX.Element;
@@ -199,25 +128,4 @@ declare function TooltipContent({ className, sideOffset, side, children, ...prop
199
128
 
200
129
  declare function isEditSessionActive(): boolean;
201
130
 
202
- type CarouselSlide = {
203
- src: string;
204
- alt: string;
205
- };
206
- /**
207
- * Template hook. Owns the slide array in React state, stamps the DOM contract via `bind`, and
208
- * listens for the bridge's change event so replace/add/delete re-render the component.
209
- *
210
- * `bind` is plain data attributes (no ref), so it spreads onto any element type without type
211
- * friction; the hook finds its own container by key. Slides inside still need
212
- * `data-ohw-carousel-slide={i}`.
213
- *
214
- * const { images, bind } = useOhwCarousel('hero-carousel', content.images)
215
- * <div {...bind}>{images.map((img, i) => <Slide data-ohw-carousel-slide={i} … />)}</div>
216
- */
217
- declare function useOhwCarousel(key: string, initial: CarouselSlide[]): {
218
- images: CarouselSlide[];
219
- setImages: React.Dispatch<React.SetStateAction<CarouselSlide[]>>;
220
- bind: Record<string, string>;
221
- };
222
-
223
- export { type CarouselSlide, 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, useOhwCarousel, validateUrlInput };
131
+ 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 };
package/dist/index.d.ts CHANGED
@@ -27,7 +27,6 @@ type LinkModalProps = {
27
27
  onClose: () => void;
28
28
  onSubmit: (target: string) => void;
29
29
  };
30
- type LinkModalStep = 'input' | 'sectionPicker' | 'confirmed';
31
30
  type SelectedPage = {
32
31
  path: string;
33
32
  title: string;
@@ -43,55 +42,10 @@ type LinkPopoverProps = LinkModalProps & {
43
42
  portalContainer?: HTMLElement | null;
44
43
  };
45
44
  /** Centered link editor dialog (shadcn Dialog + Radix). */
46
- declare function LinkPopover({ open, panelRef, portalContainer, onClose, mode, pages, sections, sectionsByPath, initialTarget, existingTargets, onSubmit, }: LinkPopoverProps): react_jsx_runtime.JSX.Element;
45
+ declare function LinkPopover({ open, panelRef, portalContainer, onClose, ...editorProps }: LinkPopoverProps): react_jsx_runtime.JSX.Element;
47
46
 
48
- type UseLinkModalStateParams = {
49
- open: boolean;
50
- mode: LinkModalMode;
51
- pages: LinkPage[];
52
- sections: LinkSection[];
53
- sectionsByPath?: Record<string, LinkSection[]>;
54
- initialTarget?: string;
55
- existingTargets: string[];
56
- onClose: () => void;
57
- onSubmit: (target: string) => void;
58
- };
59
- declare function useLinkModalState({ open, mode, pages, sections: _sections, sectionsByPath, initialTarget, existingTargets: _existingTargets, onClose, onSubmit, }: UseLinkModalStateParams): {
60
- title: string;
61
- submitLabel: string;
62
- secondaryLabel: string;
63
- searchValue: string;
64
- selectedPage: SelectedPage | null;
65
- selectedSection: SelectedSection | null;
66
- step: LinkModalStep;
67
- dropdownOpen: boolean;
68
- setDropdownOpen: React.Dispatch<React.SetStateAction<boolean>>;
69
- urlError: string;
70
- filteredPages: LinkPage[];
71
- showBreadcrumb: false | SelectedSection | null;
72
- showSectionPicker: false | SelectedPage | null;
73
- showChooseSection: boolean | null;
74
- showSectionRow: boolean | null;
75
- isValid: boolean;
76
- activeSections: LinkSection[];
77
- handleInputChange: (value: string) => void;
78
- handlePageSelect: (page: LinkPage) => void;
79
- handleChooseSection: () => void;
80
- handleSectionSelect: (section: LinkSection) => void;
81
- handleBackToSections: () => void;
82
- handleSectionPickerBack: () => void;
83
- handleClose: () => void;
84
- handleSecondary: () => void;
85
- handleSubmit: () => void;
86
- };
87
-
88
- type LinkModalState = ReturnType<typeof useLinkModalState>;
89
- type LinkEditorPanelProps = {
90
- state: LinkModalState;
91
- onClose: () => void;
92
- };
93
47
  /** Link destination editor body — Figma node 8365:7616 / 8382:4161 */
94
- declare function LinkEditorPanel({ state, onClose }: LinkEditorPanelProps): react_jsx_runtime.JSX.Element;
48
+ declare function LinkEditorPanel({ open, mode, pages, sections, sectionsByPath, initialTarget, existingTargets, onClose, onSubmit, }: LinkModalProps): react_jsx_runtime.JSX.Element;
95
49
 
96
50
  declare function parseTarget(target: string | null | undefined): {
97
51
  pageRoute: string;
@@ -132,26 +86,6 @@ declare function SchedulingWidget({ notifyOnConnect, initialScheduleId, insertAf
132
86
 
133
87
  declare const DragHandle: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
134
88
 
135
- /**
136
- * Visual drop-gap line for navbar / footer / repeater reorder.
137
- * Figma: Custom/Drop Indicator (8140:1731) — CSS class `.ov-gap-line`
138
- *
139
- * Opacity (Figma docs):
140
- * - default: 0 (hidden)
141
- * - hover: 1
142
- * - dragIdle: 0.4
143
- * - dragActive: 1
144
- */
145
- declare const dropIndicatorVariants: (props?: ({
146
- direction?: "horizontal" | "vertical" | null | undefined;
147
- state?: "default" | "hover" | "dragIdle" | "dragActive" | null | undefined;
148
- } & class_variance_authority_types.ClassProp) | undefined) => string;
149
- type DropIndicatorProps = React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof dropIndicatorVariants>;
150
- declare const DropIndicator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
151
- direction?: "horizontal" | "vertical" | null | undefined;
152
- state?: "default" | "hover" | "dragIdle" | "dragActive" | null | undefined;
153
- } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
154
-
155
89
  declare const CustomToolbar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
156
90
  declare function CustomToolbarDivider({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react_jsx_runtime.JSX.Element;
157
91
  declare const CustomToolbarButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
@@ -162,35 +96,30 @@ type ItemActionToolbarProps = {
162
96
  onEditLink?: () => void;
163
97
  onAddItem?: () => void;
164
98
  onMore?: () => void;
165
- editLinkDisabled?: boolean;
166
99
  addItemDisabled?: boolean;
167
100
  moreDisabled?: boolean;
168
101
  /** Tooltip placement relative to each icon — Figma uses bottom. */
169
102
  tooltipSide?: 'top' | 'bottom' | 'left' | 'right';
170
103
  };
171
104
  /** Item-action fill for Custom/Toolbar — Edit link / Add item / More. */
172
- declare function ItemActionToolbar({ onEditLink, onAddItem, onMore, editLinkDisabled, addItemDisabled, moreDisabled, tooltipSide, }: ItemActionToolbarProps): react_jsx_runtime.JSX.Element;
105
+ declare function ItemActionToolbar({ onEditLink, onAddItem, onMore, addItemDisabled, moreDisabled, tooltipSide, }: ItemActionToolbarProps): react_jsx_runtime.JSX.Element;
173
106
 
174
107
  type ItemInteractionState = 'default' | 'hover' | 'sibling-hint' | 'active-top' | 'active-bottom' | 'dragging';
175
108
  type ItemInteractionLayerProps = {
176
109
  rect: DOMRect;
177
110
  state: ItemInteractionState;
178
111
  elRef?: React.Ref<HTMLDivElement>;
179
- /** Slotted Custom/Toolbar instance (item-action or other fill). */
112
+ /** Slotted Custom/Toolbar instance (item-action or other fill). */
180
113
  toolbar?: React.ReactNode;
181
114
  showHandle?: boolean;
182
115
  dragDisabled?: boolean;
183
116
  dragHandleLabel?: string;
184
117
  onDragHandleDragStart?: (e: React.DragEvent<HTMLButtonElement>) => void;
185
118
  onDragHandleDragEnd?: (e: React.DragEvent<HTMLButtonElement>) => void;
186
- /** Press on the item chrome (not handle/toolbar) — starts press-to-drag. */
187
- onItemPointerDown?: (e: React.PointerEvent<HTMLDivElement>) => void;
188
- /** Click on chrome without a drag — typically enter text edit. */
189
- onItemClick?: (clientX: number, clientY: number) => void;
190
119
  chromeGap?: number;
191
120
  className?: string;
192
121
  };
193
- declare function ItemInteractionLayer({ rect, state, elRef, toolbar, showHandle, dragDisabled, dragHandleLabel, onDragHandleDragStart, onDragHandleDragEnd, onItemPointerDown, onItemClick, chromeGap, className, }: ItemInteractionLayerProps): react_jsx_runtime.JSX.Element | null;
122
+ declare function ItemInteractionLayer({ rect, state, elRef, toolbar, showHandle, dragDisabled, dragHandleLabel, onDragHandleDragStart, onDragHandleDragEnd, chromeGap, className, }: ItemInteractionLayerProps): react_jsx_runtime.JSX.Element | null;
194
123
 
195
124
  declare function TooltipProvider({ delayDuration, ...props }: React.ComponentProps<typeof Tooltip$1.Provider>): react_jsx_runtime.JSX.Element;
196
125
  declare function Tooltip({ ...props }: React.ComponentProps<typeof Tooltip$1.Root>): react_jsx_runtime.JSX.Element;
@@ -199,25 +128,4 @@ declare function TooltipContent({ className, sideOffset, side, children, ...prop
199
128
 
200
129
  declare function isEditSessionActive(): boolean;
201
130
 
202
- type CarouselSlide = {
203
- src: string;
204
- alt: string;
205
- };
206
- /**
207
- * Template hook. Owns the slide array in React state, stamps the DOM contract via `bind`, and
208
- * listens for the bridge's change event so replace/add/delete re-render the component.
209
- *
210
- * `bind` is plain data attributes (no ref), so it spreads onto any element type without type
211
- * friction; the hook finds its own container by key. Slides inside still need
212
- * `data-ohw-carousel-slide={i}`.
213
- *
214
- * const { images, bind } = useOhwCarousel('hero-carousel', content.images)
215
- * <div {...bind}>{images.map((img, i) => <Slide data-ohw-carousel-slide={i} … />)}</div>
216
- */
217
- declare function useOhwCarousel(key: string, initial: CarouselSlide[]): {
218
- images: CarouselSlide[];
219
- setImages: React.Dispatch<React.SetStateAction<CarouselSlide[]>>;
220
- bind: Record<string, string>;
221
- };
222
-
223
- export { type CarouselSlide, 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, useOhwCarousel, validateUrlInput };
131
+ 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 };