made-refine 0.2.19 → 0.2.21

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/README.md CHANGED
@@ -5,7 +5,7 @@
5
5
  Visual CSS editor for React. Edit styles in the browser, then copy agent-ready edits with component and file context.
6
6
 
7
7
  <p align="center">
8
- <img src=".github/screenshot.png" alt="handmade visual editor" width="720" />
8
+ <img src="https://raw.githubusercontent.com/rezailmi/made-refine/main/.github/screenshot.png" alt="handmade visual editor" width="720" />
9
9
  </p>
10
10
 
11
11
  ## Quick start
package/dist/babel.cjs CHANGED
@@ -5,7 +5,11 @@ var path = require("path");
5
5
  function isHostElement(name) {
6
6
  return /^[a-z]/.test(name);
7
7
  }
8
- module.exports = function directEditSourcePlugin({ types: t }) {
8
+ module.exports = function directEditSourcePlugin(api) {
9
+ const t = api.types;
10
+ if (typeof api.env === "function" && !api.env("development")) {
11
+ return { name: "direct-edit-source", visitor: {} };
12
+ }
9
13
  return {
10
14
  name: "direct-edit-source",
11
15
  visitor: {
package/dist/index.d.mts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as React from 'react';
3
- import { D as DragState, a as DropIndicator, S as SelectElementOptions, b as SelectElementsOptions, c as SpacingPropertyKey, C as CSSPropertyValue, B as BorderRadiusPropertyKey, d as BorderPropertyKey, e as BorderProperties, F as FlexPropertyKey, f as SizingPropertyKey, g as SizingValue, h as SizingChangeOptions, i as ColorPropertyKey, j as ColorValue, T as TypographyPropertyKey, A as ActiveTool, k as Theme, l as BorderStyleControlPreference, m as DirectEditState, n as SessionEdit, o as SessionItem, p as CanvasElementKind, q as TypographyProperties, M as MeasurementLine, G as Guideline, r as Comment } from './utils-CpmjloNg.mjs';
4
- export { s as BorderRadiusProperties, t as BorderStyle, u as ColorProperties, v as CommentReply, w as DomSourceLocation, x as DropTarget, E as ElementInfo, y as ElementLocator, z as FlexProperties, H as MeasurementState, R as ReactComponentFrame, I as SizingChangePhase, J as SizingMode, K as SizingProperties, L as SpacingProperties, U as UndoEditEntry, N as UndoEntry, O as UndoMoveEntry, P as UndoSelectionEntry, Q as buildCommentExport, V as buildSessionExport, W as calculateDropPosition, X as calculateElementMeasurements, Y as calculateGuidelineMeasurements, Z as calculateParentMeasurements, _ as colorToTailwind, $ as elementFromPointWithoutOverlays, a0 as findContainerAtPoint, a1 as findLayoutContainerAtPoint, a2 as formatPropertyValue, a3 as getComputedBorderStyles, a4 as getComputedBoxShadow, a5 as getComputedColorStyles, a6 as getComputedStyles, a7 as getDimensionDisplay, a8 as getElementInfo, a9 as getElementLocator, aa as getFlexDirection, ab as isFlexContainer, ac as isLayoutContainer, ad as parseColorValue, ae as parsePropertyValue, af as stylesToTailwind } from './utils-CpmjloNg.mjs';
3
+ import { D as DragState, a as DropIndicator, S as SelectElementOptions, b as SelectElementsOptions, c as SpacingPropertyKey, C as CSSPropertyValue, B as BorderRadiusPropertyKey, d as BorderPropertyKey, e as BorderProperties, F as FlexPropertyKey, f as SizingPropertyKey, g as SizingValue, h as SizingChangeOptions, i as ColorPropertyKey, j as ColorValue, T as TypographyPropertyKey, A as ActiveTool, k as Theme, l as BorderStyleControlPreference, m as DirectEditState, n as SessionEdit, o as SessionItem, p as CanvasElementKind, q as TypographyProperties, M as MeasurementLine, G as Guideline, r as Comment } from './utils-Byovnuwg.mjs';
4
+ export { s as BorderRadiusProperties, t as BorderStyle, u as ColorProperties, v as CommentReply, w as DomSourceLocation, x as DropTarget, E as ElementInfo, y as ElementLocator, z as FlexProperties, H as MeasurementState, R as ReactComponentFrame, I as SizingChangePhase, J as SizingMode, K as SizingProperties, L as SpacingProperties, U as UndoEditEntry, N as UndoEntry, O as UndoMoveEntry, P as UndoSelectionEntry, Q as buildCommentExport, V as buildSessionExport, W as calculateDropPosition, X as calculateElementMeasurements, Y as calculateGuidelineMeasurements, Z as calculateParentMeasurements, _ as colorToTailwind, $ as elementFromPointWithoutOverlays, a0 as findContainerAtPoint, a1 as findLayoutContainerAtPoint, a2 as formatPropertyValue, a3 as getComputedBorderStyles, a4 as getComputedBoxShadow, a5 as getComputedColorStyles, a6 as getComputedStyles, a7 as getDimensionDisplay, a8 as getElementInfo, a9 as getElementLocator, aa as getFlexDirection, ab as isFlexContainer, ac as isLayoutContainer, ad as parseColorValue, ae as parsePropertyValue, af as stylesToTailwind } from './utils-Byovnuwg.mjs';
5
5
 
6
6
  declare function DirectEdit(): react_jsx_runtime.JSX.Element;
7
7
 
@@ -44,6 +44,13 @@ interface UseMoveResult {
44
44
  }
45
45
  declare function useMove({ onMoveComplete }: UseMoveOptions): UseMoveResult;
46
46
 
47
+ type SendFailure = {
48
+ reason: 'unreachable' | 'rejected';
49
+ failedEditElements: HTMLElement[];
50
+ failedCommentIds: string[];
51
+ at: number;
52
+ };
53
+
47
54
  interface DirectEditActionsContextValue {
48
55
  selectElement: (element: HTMLElement, options?: SelectElementOptions) => void;
49
56
  selectElements: (elements: HTMLElement[], options?: SelectElementsOptions) => void;
@@ -81,6 +88,7 @@ interface DirectEditActionsContextValue {
81
88
  addCommentReply: (id: string, text: string) => void;
82
89
  deleteComment: (id: string) => void;
83
90
  exportComment: (id: string) => Promise<boolean>;
91
+ clearSendFailure: () => void;
84
92
  canSendEditToAgent: (snapshot?: {
85
93
  selectedElement: HTMLElement | null;
86
94
  elementInfo: DirectEditState['elementInfo'];
@@ -97,6 +105,8 @@ interface DirectEditActionsContextValue {
97
105
  removeSessionEdit: (element: HTMLElement) => void;
98
106
  startTextEditing: (element: HTMLElement) => void;
99
107
  commitTextEditing: () => void;
108
+ setCommentDraftText: (text: string) => void;
109
+ setCommentDraftBlockedHandler: (handler: (() => void) | null) => void;
100
110
  groupSelection: () => void;
101
111
  deleteSelection: () => void;
102
112
  insertElement: (kind: CanvasElementKind) => void;
@@ -107,6 +117,7 @@ interface DirectEditActionsContextValue {
107
117
  }
108
118
  interface DirectEditStateContextValue extends DirectEditState {
109
119
  agentAvailable: boolean;
120
+ lastSendFailure: SendFailure | null;
110
121
  sessionEditCount: number;
111
122
  multiSelectContextCount: number;
112
123
  }
@@ -189,6 +200,7 @@ interface DirectEditPanelInnerProps {
189
200
  onSendToAgent?: () => Promise<boolean>;
190
201
  canSendToAgent?: boolean;
191
202
  showSendButton?: boolean;
203
+ sendFailureReason?: 'unreachable' | 'rejected' | null;
192
204
  className?: string;
193
205
  style?: React.CSSProperties;
194
206
  panelRef?: React.RefObject<HTMLDivElement>;
@@ -198,7 +210,7 @@ interface DirectEditPanelInnerProps {
198
210
  onHeaderPointerUp?: (e: React.PointerEvent) => void;
199
211
  onHeaderPointerCancel?: (e: React.PointerEvent) => void;
200
212
  }
201
- declare function DirectEditPanelInner({ elementInfo, computedSpacing, computedBorderRadius, computedBorder, computedFlex, computedSizing, computedColor, selectionColors, computedBoxShadow, borderStyleControlPreference, computedTypography, pendingStyles, onClose, onSelectParent, onSelectChild, onUpdateSpacing, onUpdateBorderRadius, onUpdateBorder, onBatchUpdateBorder, onSetCSS, onUpdateFlex, onToggleFlex, onUpdateSizing, onUpdateColor, onReplaceSelectionColor, onSelectSelectionColorTarget, onUpdateTypography, onReset, onExportEdits, onSendToAgent, canSendToAgent, showSendButton, className, style, panelRef, isDragging, onHeaderPointerDown, onHeaderPointerMove, onHeaderPointerUp, onHeaderPointerCancel, }: DirectEditPanelInnerProps): react_jsx_runtime.JSX.Element;
213
+ declare function DirectEditPanelInner({ elementInfo, computedSpacing, computedBorderRadius, computedBorder, computedFlex, computedSizing, computedColor, selectionColors, computedBoxShadow, borderStyleControlPreference, computedTypography, pendingStyles, onClose, onSelectParent, onSelectChild, onUpdateSpacing, onUpdateBorderRadius, onUpdateBorder, onBatchUpdateBorder, onSetCSS, onUpdateFlex, onToggleFlex, onUpdateSizing, onUpdateColor, onReplaceSelectionColor, onSelectSelectionColorTarget, onUpdateTypography, onReset, onExportEdits, onSendToAgent, canSendToAgent, showSendButton, sendFailureReason, className, style, panelRef, isDragging, onHeaderPointerDown, onHeaderPointerMove, onHeaderPointerUp, onHeaderPointerCancel, }: DirectEditPanelInnerProps): react_jsx_runtime.JSX.Element;
202
214
  declare function DirectEditPanel(): react_jsx_runtime.JSX.Element | null;
203
215
 
204
216
  interface DirectEditToolbarInnerProps {
@@ -217,6 +229,11 @@ interface DirectEditToolbarInnerProps {
217
229
  onExportAllEdits?: () => Promise<boolean>;
218
230
  onSendAllToAgents?: () => Promise<boolean>;
219
231
  agentAvailable?: boolean;
232
+ sendFailureReason?: 'unreachable' | 'rejected' | null;
233
+ sendFailure?: {
234
+ failedEditElements: HTMLElement[];
235
+ failedCommentIds: string[];
236
+ } | null;
220
237
  onClearSessionEdits?: () => void;
221
238
  onRemoveSessionEdit?: (element: HTMLElement) => void;
222
239
  onDeleteComment?: (id: string) => void;
@@ -227,8 +244,9 @@ interface DirectEditToolbarInnerProps {
227
244
  onSetCanvasZoom?: (zoom: number) => void;
228
245
  onZoomTo100?: () => void;
229
246
  onFitToViewport?: () => void;
247
+ onInsertElement?: (kind: CanvasElementKind) => void;
230
248
  }
231
- declare function DirectEditToolbarInner({ editModeActive, onToggleEditMode, rulersVisible, onToggleRulers, activeTool: _activeTool, onSetActiveTool: _onSetActiveTool, theme, onSetTheme, sessionEditCount, multiSelectCount, multiSelectedElements, onGetSessionItems, onExportAllEdits, onSendAllToAgents, agentAvailable, onClearSessionEdits, onRemoveSessionEdit, onDeleteComment, className, canvasActive, canvasZoom, onToggleCanvas, onSetCanvasZoom, onZoomTo100, onFitToViewport, }: DirectEditToolbarInnerProps): react_jsx_runtime.JSX.Element;
249
+ declare function DirectEditToolbarInner({ editModeActive, onToggleEditMode, rulersVisible, onToggleRulers, activeTool: _activeTool, onSetActiveTool: _onSetActiveTool, theme, onSetTheme, sessionEditCount, multiSelectCount, multiSelectedElements, onGetSessionItems, onExportAllEdits, onSendAllToAgents, agentAvailable, sendFailureReason, sendFailure, onClearSessionEdits, onRemoveSessionEdit, onDeleteComment, className, canvasActive, canvasZoom, onToggleCanvas, onSetCanvasZoom, onZoomTo100, onFitToViewport, onInsertElement, }: DirectEditToolbarInnerProps): react_jsx_runtime.JSX.Element;
232
250
  declare function DirectEditToolbar(): react_jsx_runtime.JSX.Element | null;
233
251
 
234
252
  interface UseMeasurementResult {
@@ -271,8 +289,11 @@ interface SelectionOverlayProps {
271
289
  isComponentPrimitive?: boolean;
272
290
  enableResizeHandles?: boolean;
273
291
  onResizeSizingChange?: (changes: Partial<Record<SizingPropertyKey, SizingValue>>, options?: SizingChangeOptions) => void;
292
+ showCommentPill?: boolean;
293
+ isCommentActive?: boolean;
294
+ onCommentPillClick?: () => void;
274
295
  }
275
- declare function SelectionOverlay({ selectedElement, pageFrameElement, pageFrameLabel, canvasZoom, draggedElement, isDragging, ghostPosition, onMoveStart, showMoveHandle, isTextEditing, onDoubleClick, onHoverElement, onClickThrough, onSelectPageFrame, isComponentPrimitive, enableResizeHandles, onResizeSizingChange, }: SelectionOverlayProps): react_jsx_runtime.JSX.Element;
296
+ declare function SelectionOverlay({ selectedElement, pageFrameElement, pageFrameLabel, canvasZoom, draggedElement, isDragging, ghostPosition, onMoveStart, showMoveHandle, isTextEditing, onDoubleClick, onHoverElement, onClickThrough, onSelectPageFrame, isComponentPrimitive, enableResizeHandles, onResizeSizingChange, showCommentPill, isCommentActive, onCommentPillClick, }: SelectionOverlayProps): react_jsx_runtime.JSX.Element;
276
297
 
277
298
  interface MoveOverlayProps {
278
299
  dropIndicator: DropIndicator | null;
package/dist/index.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as React from 'react';
3
- import { D as DragState, a as DropIndicator, S as SelectElementOptions, b as SelectElementsOptions, c as SpacingPropertyKey, C as CSSPropertyValue, B as BorderRadiusPropertyKey, d as BorderPropertyKey, e as BorderProperties, F as FlexPropertyKey, f as SizingPropertyKey, g as SizingValue, h as SizingChangeOptions, i as ColorPropertyKey, j as ColorValue, T as TypographyPropertyKey, A as ActiveTool, k as Theme, l as BorderStyleControlPreference, m as DirectEditState, n as SessionEdit, o as SessionItem, p as CanvasElementKind, q as TypographyProperties, M as MeasurementLine, G as Guideline, r as Comment } from './utils-CpmjloNg.js';
4
- export { s as BorderRadiusProperties, t as BorderStyle, u as ColorProperties, v as CommentReply, w as DomSourceLocation, x as DropTarget, E as ElementInfo, y as ElementLocator, z as FlexProperties, H as MeasurementState, R as ReactComponentFrame, I as SizingChangePhase, J as SizingMode, K as SizingProperties, L as SpacingProperties, U as UndoEditEntry, N as UndoEntry, O as UndoMoveEntry, P as UndoSelectionEntry, Q as buildCommentExport, V as buildSessionExport, W as calculateDropPosition, X as calculateElementMeasurements, Y as calculateGuidelineMeasurements, Z as calculateParentMeasurements, _ as colorToTailwind, $ as elementFromPointWithoutOverlays, a0 as findContainerAtPoint, a1 as findLayoutContainerAtPoint, a2 as formatPropertyValue, a3 as getComputedBorderStyles, a4 as getComputedBoxShadow, a5 as getComputedColorStyles, a6 as getComputedStyles, a7 as getDimensionDisplay, a8 as getElementInfo, a9 as getElementLocator, aa as getFlexDirection, ab as isFlexContainer, ac as isLayoutContainer, ad as parseColorValue, ae as parsePropertyValue, af as stylesToTailwind } from './utils-CpmjloNg.js';
3
+ import { D as DragState, a as DropIndicator, S as SelectElementOptions, b as SelectElementsOptions, c as SpacingPropertyKey, C as CSSPropertyValue, B as BorderRadiusPropertyKey, d as BorderPropertyKey, e as BorderProperties, F as FlexPropertyKey, f as SizingPropertyKey, g as SizingValue, h as SizingChangeOptions, i as ColorPropertyKey, j as ColorValue, T as TypographyPropertyKey, A as ActiveTool, k as Theme, l as BorderStyleControlPreference, m as DirectEditState, n as SessionEdit, o as SessionItem, p as CanvasElementKind, q as TypographyProperties, M as MeasurementLine, G as Guideline, r as Comment } from './utils-Byovnuwg.js';
4
+ export { s as BorderRadiusProperties, t as BorderStyle, u as ColorProperties, v as CommentReply, w as DomSourceLocation, x as DropTarget, E as ElementInfo, y as ElementLocator, z as FlexProperties, H as MeasurementState, R as ReactComponentFrame, I as SizingChangePhase, J as SizingMode, K as SizingProperties, L as SpacingProperties, U as UndoEditEntry, N as UndoEntry, O as UndoMoveEntry, P as UndoSelectionEntry, Q as buildCommentExport, V as buildSessionExport, W as calculateDropPosition, X as calculateElementMeasurements, Y as calculateGuidelineMeasurements, Z as calculateParentMeasurements, _ as colorToTailwind, $ as elementFromPointWithoutOverlays, a0 as findContainerAtPoint, a1 as findLayoutContainerAtPoint, a2 as formatPropertyValue, a3 as getComputedBorderStyles, a4 as getComputedBoxShadow, a5 as getComputedColorStyles, a6 as getComputedStyles, a7 as getDimensionDisplay, a8 as getElementInfo, a9 as getElementLocator, aa as getFlexDirection, ab as isFlexContainer, ac as isLayoutContainer, ad as parseColorValue, ae as parsePropertyValue, af as stylesToTailwind } from './utils-Byovnuwg.js';
5
5
 
6
6
  declare function DirectEdit(): react_jsx_runtime.JSX.Element;
7
7
 
@@ -44,6 +44,13 @@ interface UseMoveResult {
44
44
  }
45
45
  declare function useMove({ onMoveComplete }: UseMoveOptions): UseMoveResult;
46
46
 
47
+ type SendFailure = {
48
+ reason: 'unreachable' | 'rejected';
49
+ failedEditElements: HTMLElement[];
50
+ failedCommentIds: string[];
51
+ at: number;
52
+ };
53
+
47
54
  interface DirectEditActionsContextValue {
48
55
  selectElement: (element: HTMLElement, options?: SelectElementOptions) => void;
49
56
  selectElements: (elements: HTMLElement[], options?: SelectElementsOptions) => void;
@@ -81,6 +88,7 @@ interface DirectEditActionsContextValue {
81
88
  addCommentReply: (id: string, text: string) => void;
82
89
  deleteComment: (id: string) => void;
83
90
  exportComment: (id: string) => Promise<boolean>;
91
+ clearSendFailure: () => void;
84
92
  canSendEditToAgent: (snapshot?: {
85
93
  selectedElement: HTMLElement | null;
86
94
  elementInfo: DirectEditState['elementInfo'];
@@ -97,6 +105,8 @@ interface DirectEditActionsContextValue {
97
105
  removeSessionEdit: (element: HTMLElement) => void;
98
106
  startTextEditing: (element: HTMLElement) => void;
99
107
  commitTextEditing: () => void;
108
+ setCommentDraftText: (text: string) => void;
109
+ setCommentDraftBlockedHandler: (handler: (() => void) | null) => void;
100
110
  groupSelection: () => void;
101
111
  deleteSelection: () => void;
102
112
  insertElement: (kind: CanvasElementKind) => void;
@@ -107,6 +117,7 @@ interface DirectEditActionsContextValue {
107
117
  }
108
118
  interface DirectEditStateContextValue extends DirectEditState {
109
119
  agentAvailable: boolean;
120
+ lastSendFailure: SendFailure | null;
110
121
  sessionEditCount: number;
111
122
  multiSelectContextCount: number;
112
123
  }
@@ -189,6 +200,7 @@ interface DirectEditPanelInnerProps {
189
200
  onSendToAgent?: () => Promise<boolean>;
190
201
  canSendToAgent?: boolean;
191
202
  showSendButton?: boolean;
203
+ sendFailureReason?: 'unreachable' | 'rejected' | null;
192
204
  className?: string;
193
205
  style?: React.CSSProperties;
194
206
  panelRef?: React.RefObject<HTMLDivElement>;
@@ -198,7 +210,7 @@ interface DirectEditPanelInnerProps {
198
210
  onHeaderPointerUp?: (e: React.PointerEvent) => void;
199
211
  onHeaderPointerCancel?: (e: React.PointerEvent) => void;
200
212
  }
201
- declare function DirectEditPanelInner({ elementInfo, computedSpacing, computedBorderRadius, computedBorder, computedFlex, computedSizing, computedColor, selectionColors, computedBoxShadow, borderStyleControlPreference, computedTypography, pendingStyles, onClose, onSelectParent, onSelectChild, onUpdateSpacing, onUpdateBorderRadius, onUpdateBorder, onBatchUpdateBorder, onSetCSS, onUpdateFlex, onToggleFlex, onUpdateSizing, onUpdateColor, onReplaceSelectionColor, onSelectSelectionColorTarget, onUpdateTypography, onReset, onExportEdits, onSendToAgent, canSendToAgent, showSendButton, className, style, panelRef, isDragging, onHeaderPointerDown, onHeaderPointerMove, onHeaderPointerUp, onHeaderPointerCancel, }: DirectEditPanelInnerProps): react_jsx_runtime.JSX.Element;
213
+ declare function DirectEditPanelInner({ elementInfo, computedSpacing, computedBorderRadius, computedBorder, computedFlex, computedSizing, computedColor, selectionColors, computedBoxShadow, borderStyleControlPreference, computedTypography, pendingStyles, onClose, onSelectParent, onSelectChild, onUpdateSpacing, onUpdateBorderRadius, onUpdateBorder, onBatchUpdateBorder, onSetCSS, onUpdateFlex, onToggleFlex, onUpdateSizing, onUpdateColor, onReplaceSelectionColor, onSelectSelectionColorTarget, onUpdateTypography, onReset, onExportEdits, onSendToAgent, canSendToAgent, showSendButton, sendFailureReason, className, style, panelRef, isDragging, onHeaderPointerDown, onHeaderPointerMove, onHeaderPointerUp, onHeaderPointerCancel, }: DirectEditPanelInnerProps): react_jsx_runtime.JSX.Element;
202
214
  declare function DirectEditPanel(): react_jsx_runtime.JSX.Element | null;
203
215
 
204
216
  interface DirectEditToolbarInnerProps {
@@ -217,6 +229,11 @@ interface DirectEditToolbarInnerProps {
217
229
  onExportAllEdits?: () => Promise<boolean>;
218
230
  onSendAllToAgents?: () => Promise<boolean>;
219
231
  agentAvailable?: boolean;
232
+ sendFailureReason?: 'unreachable' | 'rejected' | null;
233
+ sendFailure?: {
234
+ failedEditElements: HTMLElement[];
235
+ failedCommentIds: string[];
236
+ } | null;
220
237
  onClearSessionEdits?: () => void;
221
238
  onRemoveSessionEdit?: (element: HTMLElement) => void;
222
239
  onDeleteComment?: (id: string) => void;
@@ -227,8 +244,9 @@ interface DirectEditToolbarInnerProps {
227
244
  onSetCanvasZoom?: (zoom: number) => void;
228
245
  onZoomTo100?: () => void;
229
246
  onFitToViewport?: () => void;
247
+ onInsertElement?: (kind: CanvasElementKind) => void;
230
248
  }
231
- declare function DirectEditToolbarInner({ editModeActive, onToggleEditMode, rulersVisible, onToggleRulers, activeTool: _activeTool, onSetActiveTool: _onSetActiveTool, theme, onSetTheme, sessionEditCount, multiSelectCount, multiSelectedElements, onGetSessionItems, onExportAllEdits, onSendAllToAgents, agentAvailable, onClearSessionEdits, onRemoveSessionEdit, onDeleteComment, className, canvasActive, canvasZoom, onToggleCanvas, onSetCanvasZoom, onZoomTo100, onFitToViewport, }: DirectEditToolbarInnerProps): react_jsx_runtime.JSX.Element;
249
+ declare function DirectEditToolbarInner({ editModeActive, onToggleEditMode, rulersVisible, onToggleRulers, activeTool: _activeTool, onSetActiveTool: _onSetActiveTool, theme, onSetTheme, sessionEditCount, multiSelectCount, multiSelectedElements, onGetSessionItems, onExportAllEdits, onSendAllToAgents, agentAvailable, sendFailureReason, sendFailure, onClearSessionEdits, onRemoveSessionEdit, onDeleteComment, className, canvasActive, canvasZoom, onToggleCanvas, onSetCanvasZoom, onZoomTo100, onFitToViewport, onInsertElement, }: DirectEditToolbarInnerProps): react_jsx_runtime.JSX.Element;
232
250
  declare function DirectEditToolbar(): react_jsx_runtime.JSX.Element | null;
233
251
 
234
252
  interface UseMeasurementResult {
@@ -271,8 +289,11 @@ interface SelectionOverlayProps {
271
289
  isComponentPrimitive?: boolean;
272
290
  enableResizeHandles?: boolean;
273
291
  onResizeSizingChange?: (changes: Partial<Record<SizingPropertyKey, SizingValue>>, options?: SizingChangeOptions) => void;
292
+ showCommentPill?: boolean;
293
+ isCommentActive?: boolean;
294
+ onCommentPillClick?: () => void;
274
295
  }
275
- declare function SelectionOverlay({ selectedElement, pageFrameElement, pageFrameLabel, canvasZoom, draggedElement, isDragging, ghostPosition, onMoveStart, showMoveHandle, isTextEditing, onDoubleClick, onHoverElement, onClickThrough, onSelectPageFrame, isComponentPrimitive, enableResizeHandles, onResizeSizingChange, }: SelectionOverlayProps): react_jsx_runtime.JSX.Element;
296
+ declare function SelectionOverlay({ selectedElement, pageFrameElement, pageFrameLabel, canvasZoom, draggedElement, isDragging, ghostPosition, onMoveStart, showMoveHandle, isTextEditing, onDoubleClick, onHoverElement, onClickThrough, onSelectPageFrame, isComponentPrimitive, enableResizeHandles, onResizeSizingChange, showCommentPill, isCommentActive, onCommentPillClick, }: SelectionOverlayProps): react_jsx_runtime.JSX.Element;
276
297
 
277
298
  interface MoveOverlayProps {
278
299
  dropIndicator: DropIndicator | null;