made-refine 0.1.1-beta.1 → 0.1.2

package/dist/index.d.mts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { D as DragState, a as DropIndicator, b as DirectEditState, S as SpacingPropertyKey, C as CSSPropertyValue, B as BorderRadiusPropertyKey, c as BorderPropertyKey, d as BorderProperties, F as FlexPropertyKey, e as SizingPropertyKey, f as SizingValue, g as ColorPropertyKey, h as ColorValue, T as TypographyPropertyKey, A as ActiveTool, i as Theme, j as SessionEdit, k as TypographyProperties, M as MeasurementLine, G as Guideline, l as Comment } from './utils-DNTIJ83m.mjs';
-export { m as BorderRadiusProperties, n as BorderStyle, o as ColorProperties, p as CommentReply, q as DomSourceLocation, r as DropTarget, E as ElementInfo, s as ElementLocator, t as FlexProperties, u as MeasurementState, R as ReactComponentFrame, v as SizingMode, w as SizingProperties, x as SpacingProperties, U as UndoEditEntry, y as UndoEntry, z as UndoMoveEntry, H as UndoSelectionEntry, I as buildCommentExport, J as buildSessionExport, K as calculateDropPosition, L as calculateElementMeasurements, N as calculateGuidelineMeasurements, O as calculateParentMeasurements, P as colorToTailwind, Q as elementFromPointWithoutOverlays, V as findContainerAtPoint, W as formatPropertyValue, X as getComputedBorderStyles, Y as getComputedColorStyles, Z as getComputedStyles, _ as getDimensionDisplay, $ as getElementInfo, a0 as getElementLocator, a1 as getFlexDirection, a2 as isFlexContainer, a3 as parseColorValue, a4 as parsePropertyValue, a5 as stylesToTailwind } from './utils-DNTIJ83m.mjs';
+import { D as DragState, a as DropIndicator, b as DirectEditState, S as SpacingPropertyKey, C as CSSPropertyValue, B as BorderRadiusPropertyKey, c as BorderPropertyKey, d as BorderProperties, F as FlexPropertyKey, e as SizingPropertyKey, f as SizingValue, g as ColorPropertyKey, h as ColorValue, T as TypographyPropertyKey, A as ActiveTool, i as Theme, j as SessionEdit, k as TypographyProperties, M as MeasurementLine, G as Guideline, l as Comment } from './utils-DyR599SI.mjs';
+export { m as BorderRadiusProperties, n as BorderStyle, o as ColorProperties, p as CommentReply, q as DomSourceLocation, r as DropTarget, E as ElementInfo, s as ElementLocator, t as FlexProperties, u as MeasurementState, R as ReactComponentFrame, v as SizingMode, w as SizingProperties, x as SpacingProperties, U as UndoEditEntry, y as UndoEntry, z as UndoMoveEntry, H as UndoSelectionEntry, I as buildCommentExport, J as buildSessionExport, K as calculateDropPosition, L as calculateElementMeasurements, N as calculateGuidelineMeasurements, O as calculateParentMeasurements, P as colorToTailwind, Q as elementFromPointWithoutOverlays, V as findContainerAtPoint, W as formatPropertyValue, X as getComputedBorderStyles, Y as getComputedColorStyles, Z as getComputedStyles, _ as getDimensionDisplay, $ as getElementInfo, a0 as getElementLocator, a1 as getFlexDirection, a2 as isFlexContainer, a3 as parseColorValue, a4 as parsePropertyValue, a5 as stylesToTailwind } from './utils-DyR599SI.mjs';
 
 declare function DirectEdit(): react_jsx_runtime.JSX.Element;
 
@@ -38,6 +38,7 @@ interface DirectEditContextValue extends DirectEditState {
     updateBorderProperty: (key: BorderPropertyKey, value: BorderProperties[BorderPropertyKey]) => void;
     updateBorderProperties: (changes: Array<[BorderPropertyKey, BorderProperties[BorderPropertyKey]]>) => void;
     updateFlexProperty: (key: FlexPropertyKey, value: string) => void;
+    toggleFlexLayout: () => void;
     updateSizingProperty: (key: SizingPropertyKey, value: SizingValue) => void;
     updateColorProperty: (key: ColorPropertyKey, value: ColorValue) => void;
     updateTypographyProperty: (key: TypographyPropertyKey, value: CSSPropertyValue | string) => void;
@@ -127,6 +128,7 @@ interface DirectEditPanelInnerProps {
     onUpdateBorder: (key: BorderPropertyKey, value: BorderProperties[BorderPropertyKey]) => void;
     onBatchUpdateBorder: (changes: Array<[BorderPropertyKey, BorderProperties[BorderPropertyKey]]>) => void;
     onUpdateFlex: (key: 'flexDirection' | 'justifyContent' | 'alignItems', value: string) => void;
+    onToggleFlex: () => void;
     onUpdateSizing: (key: SizingPropertyKey, value: SizingValue) => void;
     onUpdateColor: (key: ColorPropertyKey, value: ColorValue) => void;
     onUpdateTypography: (key: TypographyPropertyKey, value: CSSPropertyValue | string) => void;
@@ -141,7 +143,7 @@ interface DirectEditPanelInnerProps {
     onHeaderPointerMove?: (e: React.PointerEvent) => void;
     onHeaderPointerUp?: (e: React.PointerEvent) => void;
 }
-declare function DirectEditPanelInner({ elementInfo, computedSpacing, computedBorderRadius, computedBorder, computedFlex, computedSizing, computedColor, computedTypography, pendingStyles, onClose, onSelectParent, onSelectChild, onUpdateSpacing, onUpdateBorderRadius, onUpdateBorder, onBatchUpdateBorder, onUpdateFlex, onUpdateSizing, onUpdateColor, onUpdateTypography, onReset, onExportEdits, onSendToAgent, className, style, panelRef, isDragging, onHeaderPointerDown, onHeaderPointerMove, onHeaderPointerUp, }: DirectEditPanelInnerProps): react_jsx_runtime.JSX.Element;
+declare function DirectEditPanelInner({ elementInfo, computedSpacing, computedBorderRadius, computedBorder, computedFlex, computedSizing, computedColor, computedTypography, pendingStyles, onClose, onSelectParent, onSelectChild, onUpdateSpacing, onUpdateBorderRadius, onUpdateBorder, onBatchUpdateBorder, onUpdateFlex, onToggleFlex, onUpdateSizing, onUpdateColor, onUpdateTypography, onReset, onExportEdits, onSendToAgent, className, style, panelRef, isDragging, onHeaderPointerDown, onHeaderPointerMove, onHeaderPointerUp, }: DirectEditPanelInnerProps): react_jsx_runtime.JSX.Element;
 declare function DirectEditPanel(): react_jsx_runtime.JSX.Element | null;
 
 interface DirectEditToolbarInnerProps {
@@ -190,9 +192,11 @@ interface SelectionOverlayProps {
     };
     onMoveStart: (e: React.PointerEvent) => void;
     isTextEditing?: boolean;
-    onDoubleClick?: () => void;
+    onDoubleClick?: (clientX: number, clientY: number) => void;
+    onHoverElement?: (element: HTMLElement | null) => void;
+    onClickThrough?: (clientX: number, clientY: number) => void;
 }
-declare function SelectionOverlay({ selectedElement, isDragging, ghostPosition, onMoveStart, isTextEditing, onDoubleClick, }: SelectionOverlayProps): react_jsx_runtime.JSX.Element;
+declare function SelectionOverlay({ selectedElement, isDragging, ghostPosition, onMoveStart, isTextEditing, onDoubleClick, onHoverElement, onClickThrough, }: SelectionOverlayProps): react_jsx_runtime.JSX.Element;
 
 interface MoveOverlayProps {
     dropIndicator: DropIndicator | null;
@@ -220,7 +224,7 @@ interface UseGuidelinesResult {
     clearAll: () => void;
 }
 declare function getStoredGuidelines(): Guideline[];
-declare function useGuidelines(enabled: boolean): UseGuidelinesResult;
+declare function useGuidelines(enabled: boolean, hostElement?: HTMLElement | null): UseGuidelinesResult;
 
 interface CommentOverlayProps {
     comments: Comment[];

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { D as DragState, a as DropIndicator, b as DirectEditState, S as SpacingPropertyKey, C as CSSPropertyValue, B as BorderRadiusPropertyKey, c as BorderPropertyKey, d as BorderProperties, F as FlexPropertyKey, e as SizingPropertyKey, f as SizingValue, g as ColorPropertyKey, h as ColorValue, T as TypographyPropertyKey, A as ActiveTool, i as Theme, j as SessionEdit, k as TypographyProperties, M as MeasurementLine, G as Guideline, l as Comment } from './utils-DNTIJ83m.js';
-export { m as BorderRadiusProperties, n as BorderStyle, o as ColorProperties, p as CommentReply, q as DomSourceLocation, r as DropTarget, E as ElementInfo, s as ElementLocator, t as FlexProperties, u as MeasurementState, R as ReactComponentFrame, v as SizingMode, w as SizingProperties, x as SpacingProperties, U as UndoEditEntry, y as UndoEntry, z as UndoMoveEntry, H as UndoSelectionEntry, I as buildCommentExport, J as buildSessionExport, K as calculateDropPosition, L as calculateElementMeasurements, N as calculateGuidelineMeasurements, O as calculateParentMeasurements, P as colorToTailwind, Q as elementFromPointWithoutOverlays, V as findContainerAtPoint, W as formatPropertyValue, X as getComputedBorderStyles, Y as getComputedColorStyles, Z as getComputedStyles, _ as getDimensionDisplay, $ as getElementInfo, a0 as getElementLocator, a1 as getFlexDirection, a2 as isFlexContainer, a3 as parseColorValue, a4 as parsePropertyValue, a5 as stylesToTailwind } from './utils-DNTIJ83m.js';
+import { D as DragState, a as DropIndicator, b as DirectEditState, S as SpacingPropertyKey, C as CSSPropertyValue, B as BorderRadiusPropertyKey, c as BorderPropertyKey, d as BorderProperties, F as FlexPropertyKey, e as SizingPropertyKey, f as SizingValue, g as ColorPropertyKey, h as ColorValue, T as TypographyPropertyKey, A as ActiveTool, i as Theme, j as SessionEdit, k as TypographyProperties, M as MeasurementLine, G as Guideline, l as Comment } from './utils-DyR599SI.js';
+export { m as BorderRadiusProperties, n as BorderStyle, o as ColorProperties, p as CommentReply, q as DomSourceLocation, r as DropTarget, E as ElementInfo, s as ElementLocator, t as FlexProperties, u as MeasurementState, R as ReactComponentFrame, v as SizingMode, w as SizingProperties, x as SpacingProperties, U as UndoEditEntry, y as UndoEntry, z as UndoMoveEntry, H as UndoSelectionEntry, I as buildCommentExport, J as buildSessionExport, K as calculateDropPosition, L as calculateElementMeasurements, N as calculateGuidelineMeasurements, O as calculateParentMeasurements, P as colorToTailwind, Q as elementFromPointWithoutOverlays, V as findContainerAtPoint, W as formatPropertyValue, X as getComputedBorderStyles, Y as getComputedColorStyles, Z as getComputedStyles, _ as getDimensionDisplay, $ as getElementInfo, a0 as getElementLocator, a1 as getFlexDirection, a2 as isFlexContainer, a3 as parseColorValue, a4 as parsePropertyValue, a5 as stylesToTailwind } from './utils-DyR599SI.js';
 
 declare function DirectEdit(): react_jsx_runtime.JSX.Element;
 
@@ -38,6 +38,7 @@ interface DirectEditContextValue extends DirectEditState {
     updateBorderProperty: (key: BorderPropertyKey, value: BorderProperties[BorderPropertyKey]) => void;
     updateBorderProperties: (changes: Array<[BorderPropertyKey, BorderProperties[BorderPropertyKey]]>) => void;
     updateFlexProperty: (key: FlexPropertyKey, value: string) => void;
+    toggleFlexLayout: () => void;
     updateSizingProperty: (key: SizingPropertyKey, value: SizingValue) => void;
     updateColorProperty: (key: ColorPropertyKey, value: ColorValue) => void;
     updateTypographyProperty: (key: TypographyPropertyKey, value: CSSPropertyValue | string) => void;
@@ -127,6 +128,7 @@ interface DirectEditPanelInnerProps {
     onUpdateBorder: (key: BorderPropertyKey, value: BorderProperties[BorderPropertyKey]) => void;
     onBatchUpdateBorder: (changes: Array<[BorderPropertyKey, BorderProperties[BorderPropertyKey]]>) => void;
     onUpdateFlex: (key: 'flexDirection' | 'justifyContent' | 'alignItems', value: string) => void;
+    onToggleFlex: () => void;
     onUpdateSizing: (key: SizingPropertyKey, value: SizingValue) => void;
     onUpdateColor: (key: ColorPropertyKey, value: ColorValue) => void;
     onUpdateTypography: (key: TypographyPropertyKey, value: CSSPropertyValue | string) => void;
@@ -141,7 +143,7 @@ interface DirectEditPanelInnerProps {
     onHeaderPointerMove?: (e: React.PointerEvent) => void;
     onHeaderPointerUp?: (e: React.PointerEvent) => void;
 }
-declare function DirectEditPanelInner({ elementInfo, computedSpacing, computedBorderRadius, computedBorder, computedFlex, computedSizing, computedColor, computedTypography, pendingStyles, onClose, onSelectParent, onSelectChild, onUpdateSpacing, onUpdateBorderRadius, onUpdateBorder, onBatchUpdateBorder, onUpdateFlex, onUpdateSizing, onUpdateColor, onUpdateTypography, onReset, onExportEdits, onSendToAgent, className, style, panelRef, isDragging, onHeaderPointerDown, onHeaderPointerMove, onHeaderPointerUp, }: DirectEditPanelInnerProps): react_jsx_runtime.JSX.Element;
+declare function DirectEditPanelInner({ elementInfo, computedSpacing, computedBorderRadius, computedBorder, computedFlex, computedSizing, computedColor, computedTypography, pendingStyles, onClose, onSelectParent, onSelectChild, onUpdateSpacing, onUpdateBorderRadius, onUpdateBorder, onBatchUpdateBorder, onUpdateFlex, onToggleFlex, onUpdateSizing, onUpdateColor, onUpdateTypography, onReset, onExportEdits, onSendToAgent, className, style, panelRef, isDragging, onHeaderPointerDown, onHeaderPointerMove, onHeaderPointerUp, }: DirectEditPanelInnerProps): react_jsx_runtime.JSX.Element;
 declare function DirectEditPanel(): react_jsx_runtime.JSX.Element | null;
 
 interface DirectEditToolbarInnerProps {
@@ -190,9 +192,11 @@ interface SelectionOverlayProps {
     };
     onMoveStart: (e: React.PointerEvent) => void;
     isTextEditing?: boolean;
-    onDoubleClick?: () => void;
+    onDoubleClick?: (clientX: number, clientY: number) => void;
+    onHoverElement?: (element: HTMLElement | null) => void;
+    onClickThrough?: (clientX: number, clientY: number) => void;
 }
-declare function SelectionOverlay({ selectedElement, isDragging, ghostPosition, onMoveStart, isTextEditing, onDoubleClick, }: SelectionOverlayProps): react_jsx_runtime.JSX.Element;
+declare function SelectionOverlay({ selectedElement, isDragging, ghostPosition, onMoveStart, isTextEditing, onDoubleClick, onHoverElement, onClickThrough, }: SelectionOverlayProps): react_jsx_runtime.JSX.Element;
 
 interface MoveOverlayProps {
     dropIndicator: DropIndicator | null;
@@ -220,7 +224,7 @@ interface UseGuidelinesResult {
     clearAll: () => void;
 }
 declare function getStoredGuidelines(): Guideline[];
-declare function useGuidelines(enabled: boolean): UseGuidelinesResult;
+declare function useGuidelines(enabled: boolean, hostElement?: HTMLElement | null): UseGuidelinesResult;
 
 interface CommentOverlayProps {
     comments: Comment[];