made-refine 0.2.13 → 0.2.16
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.mts +4 -3
- package/dist/index.d.ts +4 -3
- package/dist/index.js +388 -49
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +388 -49
- package/dist/index.mjs.map +1 -1
- package/dist/{utils-DvJ3xKrO.d.mts → utils-lksVP2Wq.d.mts} +14 -1
- package/dist/{utils-DvJ3xKrO.d.ts → utils-lksVP2Wq.d.ts} +14 -1
- package/dist/utils.d.mts +1 -1
- package/dist/utils.d.ts +1 -1
- package/dist/utils.js +224 -19
- package/dist/utils.js.map +1 -1
- package/dist/utils.mjs +222 -19
- package/dist/utils.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -29,6 +29,12 @@ interface ElementLocator {
|
|
|
29
29
|
id: string | null;
|
|
30
30
|
classList: string[];
|
|
31
31
|
domSource?: DomSourceLocation;
|
|
32
|
+
reactComponentName?: string;
|
|
33
|
+
authoredProps?: Record<string, unknown>;
|
|
34
|
+
subElementSources?: Record<string, DomSourceLocation>;
|
|
35
|
+
callSiteSource?: DomSourceLocation;
|
|
36
|
+
definitionSource?: DomSourceLocation;
|
|
37
|
+
isComponentPrimitive?: boolean;
|
|
32
38
|
}
|
|
33
39
|
interface CSSPropertyValue {
|
|
34
40
|
numericValue: number;
|
|
@@ -135,6 +141,7 @@ interface DirectEditState {
|
|
|
135
141
|
computedColor: ColorProperties | null;
|
|
136
142
|
computedBoxShadow: string | null;
|
|
137
143
|
computedTypography: TypographyProperties | null;
|
|
144
|
+
isComponentPrimitive: boolean;
|
|
138
145
|
originalStyles: Record<string, string>;
|
|
139
146
|
pendingStyles: Record<string, string>;
|
|
140
147
|
editModeActive: boolean;
|
|
@@ -485,6 +492,12 @@ declare function getChildBriefInfo(element: HTMLElement): ChildBriefInfo;
|
|
|
485
492
|
/** Resolve the source location for an element: data-direct-edit-source attribute, then fiber fallback. */
|
|
486
493
|
declare function getElementSource(element: HTMLElement): DomSourceLocation | null;
|
|
487
494
|
declare function getElementLocator(element: HTMLElement): ElementLocator;
|
|
495
|
+
declare function getLocatorHeader(locator: ElementLocator): {
|
|
496
|
+
componentLabel: string;
|
|
497
|
+
formattedSource: string | null;
|
|
498
|
+
formattedCallSite: string | null;
|
|
499
|
+
};
|
|
500
|
+
declare function formatComponentTree(reactStack: ReactComponentFrame[]): string | null;
|
|
488
501
|
declare function buildElementContext(locator: ElementLocator): string;
|
|
489
502
|
/** Whether a session edit has any meaningful changes (styles, text, or move). */
|
|
490
503
|
declare function hasSessionEditChanges(edit: SessionEdit): boolean;
|
|
@@ -535,4 +548,4 @@ declare function getExportContentProfile(edits: SessionEdit[], comments: Comment
|
|
|
535
548
|
declare function buildExportInstruction(profile: ExportContentProfile): string;
|
|
536
549
|
declare function buildSessionExport(edits: SessionEdit[], comments?: Comment[], options?: SessionExportOptions): string;
|
|
537
550
|
|
|
538
|
-
export { elementFromPointWithoutOverlays as $, type ActiveTool as A, type BorderRadiusPropertyKey as B, type CSSPropertyValue as C, type DragState as D, type ElementInfo as E, type FlexPropertyKey as F, type Guideline as G, type MeasurementState as H, type SizingChangePhase as I, type SizingMode as J, type SizingProperties as K, type SpacingProperties as L, type MeasurementLine as M, type UndoEntry as N, type UndoMoveEntry as O, type UndoSelectionEntry as P, buildCommentExport as Q, type ReactComponentFrame as R, type SelectElementOptions as S, type TypographyPropertyKey as T, type UndoEditEntry as U, buildSessionExport as V, calculateDropPosition as W, calculateElementMeasurements as X, calculateGuidelineMeasurements as Y, calculateParentMeasurements as Z, colorToTailwind as _, type DropIndicator as a, findContainerAtPoint as a0, findLayoutContainerAtPoint as a1, formatPropertyValue as a2, getComputedBorderStyles as a3, getComputedBoxShadow as a4, getComputedColorStyles as a5, getComputedStyles as a6, getDimensionDisplay as a7, getElementInfo as a8, getElementLocator as a9, findChildAtPoint as aA, findTextOwnerAtPoint as aB, findTextOwnerByRangeScan as aC, flexPropertyToCSSMap as aD,
|
|
551
|
+
export { elementFromPointWithoutOverlays as $, type ActiveTool as A, type BorderRadiusPropertyKey as B, type CSSPropertyValue as C, type DragState as D, type ElementInfo as E, type FlexPropertyKey as F, type Guideline as G, type MeasurementState as H, type SizingChangePhase as I, type SizingMode as J, type SizingProperties as K, type SpacingProperties as L, type MeasurementLine as M, type UndoEntry as N, type UndoMoveEntry as O, type UndoSelectionEntry as P, buildCommentExport as Q, type ReactComponentFrame as R, type SelectElementOptions as S, type TypographyPropertyKey as T, type UndoEditEntry as U, buildSessionExport as V, calculateDropPosition as W, calculateElementMeasurements as X, calculateGuidelineMeasurements as Y, calculateParentMeasurements as Z, colorToTailwind as _, type DropIndicator as a, sizingValueToCSS as a$, findContainerAtPoint as a0, findLayoutContainerAtPoint as a1, formatPropertyValue as a2, getComputedBorderStyles as a3, getComputedBoxShadow as a4, getComputedColorStyles as a5, getComputedStyles as a6, getDimensionDisplay as a7, getElementInfo as a8, getElementLocator as a9, findChildAtPoint as aA, findTextOwnerAtPoint as aB, findTextOwnerByRangeScan as aC, flexPropertyToCSSMap as aD, formatComponentTree as aE, getAllComputedStyles as aF, getChildBriefInfo as aG, getComputedSizing as aH, getComputedTypography as aI, getContextOnlyBlocks as aJ, getElementDisplayName as aK, getElementSource as aL, getExportContentProfile as aM, getLocatorHeader as aN, getMoveIntentForEdit as aO, getOriginalInlineStyles as aP, getSelectionColors as aQ, getSizingValue as aR, hasSessionEditChanges as aS, isInFlowChild as aT, isInputFocused as aU, isTextElement as aV, partitionMultiSelectedEdits as aW, propertyToCSSMap as aX, resolveElementTarget as aY, sizingPropertyToCSSMap as aZ, sizingToTailwind as a_, getFlexDirection as aa, isFlexContainer as ab, isLayoutContainer as ac, parseColorValue as ad, parsePropertyValue as ae, stylesToTailwind as af, type AllComputedStyles as ag, type ExportContentProfile as ah, type MovePlanContext as ai, ORIGINAL_STYLE_PROPS as aj, borderPropertyToCSSMap as ak, borderRadiusPropertyToCSSMap as al, buildEditExport as am, buildElementContext as an, buildExportInstruction as ao, buildMovePlan as ap, buildMovePlanContext as aq, clamp as ar, collapseExportShorthands as as, collapseSpacingShorthands as at, colorPropertyToCSSMap as au, computeHoverHighlight as av, computeIntendedIndex as aw, detectChildrenDirection as ax, detectSizingMode as ay, ensureDirectTextSpanAtPoint as az, type SelectElementsOptions as b, typographyPropertyToCSSMap as b0, type SpacingPropertyKey as c, type BorderPropertyKey as d, type BorderProperties as e, type SizingPropertyKey as f, type SizingValue as g, type SizingChangeOptions as h, type ColorPropertyKey as i, type ColorValue as j, type Theme as k, type BorderStyleControlPreference as l, type DirectEditState as m, type SessionEdit as n, type SessionItem as o, type CanvasElementKind as p, type TypographyProperties as q, type Comment as r, type BorderRadiusProperties as s, type BorderStyle as t, type ColorProperties as u, type CommentReply as v, type DomSourceLocation as w, type DropTarget as x, type ElementLocator as y, type FlexProperties as z };
|
|
@@ -29,6 +29,12 @@ interface ElementLocator {
|
|
|
29
29
|
id: string | null;
|
|
30
30
|
classList: string[];
|
|
31
31
|
domSource?: DomSourceLocation;
|
|
32
|
+
reactComponentName?: string;
|
|
33
|
+
authoredProps?: Record<string, unknown>;
|
|
34
|
+
subElementSources?: Record<string, DomSourceLocation>;
|
|
35
|
+
callSiteSource?: DomSourceLocation;
|
|
36
|
+
definitionSource?: DomSourceLocation;
|
|
37
|
+
isComponentPrimitive?: boolean;
|
|
32
38
|
}
|
|
33
39
|
interface CSSPropertyValue {
|
|
34
40
|
numericValue: number;
|
|
@@ -135,6 +141,7 @@ interface DirectEditState {
|
|
|
135
141
|
computedColor: ColorProperties | null;
|
|
136
142
|
computedBoxShadow: string | null;
|
|
137
143
|
computedTypography: TypographyProperties | null;
|
|
144
|
+
isComponentPrimitive: boolean;
|
|
138
145
|
originalStyles: Record<string, string>;
|
|
139
146
|
pendingStyles: Record<string, string>;
|
|
140
147
|
editModeActive: boolean;
|
|
@@ -485,6 +492,12 @@ declare function getChildBriefInfo(element: HTMLElement): ChildBriefInfo;
|
|
|
485
492
|
/** Resolve the source location for an element: data-direct-edit-source attribute, then fiber fallback. */
|
|
486
493
|
declare function getElementSource(element: HTMLElement): DomSourceLocation | null;
|
|
487
494
|
declare function getElementLocator(element: HTMLElement): ElementLocator;
|
|
495
|
+
declare function getLocatorHeader(locator: ElementLocator): {
|
|
496
|
+
componentLabel: string;
|
|
497
|
+
formattedSource: string | null;
|
|
498
|
+
formattedCallSite: string | null;
|
|
499
|
+
};
|
|
500
|
+
declare function formatComponentTree(reactStack: ReactComponentFrame[]): string | null;
|
|
488
501
|
declare function buildElementContext(locator: ElementLocator): string;
|
|
489
502
|
/** Whether a session edit has any meaningful changes (styles, text, or move). */
|
|
490
503
|
declare function hasSessionEditChanges(edit: SessionEdit): boolean;
|
|
@@ -535,4 +548,4 @@ declare function getExportContentProfile(edits: SessionEdit[], comments: Comment
|
|
|
535
548
|
declare function buildExportInstruction(profile: ExportContentProfile): string;
|
|
536
549
|
declare function buildSessionExport(edits: SessionEdit[], comments?: Comment[], options?: SessionExportOptions): string;
|
|
537
550
|
|
|
538
|
-
export { elementFromPointWithoutOverlays as $, type ActiveTool as A, type BorderRadiusPropertyKey as B, type CSSPropertyValue as C, type DragState as D, type ElementInfo as E, type FlexPropertyKey as F, type Guideline as G, type MeasurementState as H, type SizingChangePhase as I, type SizingMode as J, type SizingProperties as K, type SpacingProperties as L, type MeasurementLine as M, type UndoEntry as N, type UndoMoveEntry as O, type UndoSelectionEntry as P, buildCommentExport as Q, type ReactComponentFrame as R, type SelectElementOptions as S, type TypographyPropertyKey as T, type UndoEditEntry as U, buildSessionExport as V, calculateDropPosition as W, calculateElementMeasurements as X, calculateGuidelineMeasurements as Y, calculateParentMeasurements as Z, colorToTailwind as _, type DropIndicator as a, findContainerAtPoint as a0, findLayoutContainerAtPoint as a1, formatPropertyValue as a2, getComputedBorderStyles as a3, getComputedBoxShadow as a4, getComputedColorStyles as a5, getComputedStyles as a6, getDimensionDisplay as a7, getElementInfo as a8, getElementLocator as a9, findChildAtPoint as aA, findTextOwnerAtPoint as aB, findTextOwnerByRangeScan as aC, flexPropertyToCSSMap as aD,
|
|
551
|
+
export { elementFromPointWithoutOverlays as $, type ActiveTool as A, type BorderRadiusPropertyKey as B, type CSSPropertyValue as C, type DragState as D, type ElementInfo as E, type FlexPropertyKey as F, type Guideline as G, type MeasurementState as H, type SizingChangePhase as I, type SizingMode as J, type SizingProperties as K, type SpacingProperties as L, type MeasurementLine as M, type UndoEntry as N, type UndoMoveEntry as O, type UndoSelectionEntry as P, buildCommentExport as Q, type ReactComponentFrame as R, type SelectElementOptions as S, type TypographyPropertyKey as T, type UndoEditEntry as U, buildSessionExport as V, calculateDropPosition as W, calculateElementMeasurements as X, calculateGuidelineMeasurements as Y, calculateParentMeasurements as Z, colorToTailwind as _, type DropIndicator as a, sizingValueToCSS as a$, findContainerAtPoint as a0, findLayoutContainerAtPoint as a1, formatPropertyValue as a2, getComputedBorderStyles as a3, getComputedBoxShadow as a4, getComputedColorStyles as a5, getComputedStyles as a6, getDimensionDisplay as a7, getElementInfo as a8, getElementLocator as a9, findChildAtPoint as aA, findTextOwnerAtPoint as aB, findTextOwnerByRangeScan as aC, flexPropertyToCSSMap as aD, formatComponentTree as aE, getAllComputedStyles as aF, getChildBriefInfo as aG, getComputedSizing as aH, getComputedTypography as aI, getContextOnlyBlocks as aJ, getElementDisplayName as aK, getElementSource as aL, getExportContentProfile as aM, getLocatorHeader as aN, getMoveIntentForEdit as aO, getOriginalInlineStyles as aP, getSelectionColors as aQ, getSizingValue as aR, hasSessionEditChanges as aS, isInFlowChild as aT, isInputFocused as aU, isTextElement as aV, partitionMultiSelectedEdits as aW, propertyToCSSMap as aX, resolveElementTarget as aY, sizingPropertyToCSSMap as aZ, sizingToTailwind as a_, getFlexDirection as aa, isFlexContainer as ab, isLayoutContainer as ac, parseColorValue as ad, parsePropertyValue as ae, stylesToTailwind as af, type AllComputedStyles as ag, type ExportContentProfile as ah, type MovePlanContext as ai, ORIGINAL_STYLE_PROPS as aj, borderPropertyToCSSMap as ak, borderRadiusPropertyToCSSMap as al, buildEditExport as am, buildElementContext as an, buildExportInstruction as ao, buildMovePlan as ap, buildMovePlanContext as aq, clamp as ar, collapseExportShorthands as as, collapseSpacingShorthands as at, colorPropertyToCSSMap as au, computeHoverHighlight as av, computeIntendedIndex as aw, detectChildrenDirection as ax, detectSizingMode as ay, ensureDirectTextSpanAtPoint as az, type SelectElementsOptions as b, typographyPropertyToCSSMap as b0, type SpacingPropertyKey as c, type BorderPropertyKey as d, type BorderProperties as e, type SizingPropertyKey as f, type SizingValue as g, type SizingChangeOptions as h, type ColorPropertyKey as i, type ColorValue as j, type Theme as k, type BorderStyleControlPreference as l, type DirectEditState as m, type SessionEdit as n, type SessionItem as o, type CanvasElementKind as p, type TypographyProperties as q, type Comment as r, type BorderRadiusProperties as s, type BorderStyle as t, type ColorProperties as u, type CommentReply as v, type DomSourceLocation as w, type DropTarget as x, type ElementLocator as y, type FlexProperties as z };
|
package/dist/utils.d.mts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { ag as AllComputedStyles, e as BorderProperties, d as BorderPropertyKey, s as BorderRadiusProperties, B as BorderRadiusPropertyKey, t as BorderStyle, C as CSSPropertyValue, u as ColorProperties, i as ColorPropertyKey, j as ColorValue, m as DirectEditState, D as DragState, a as DropIndicator, x as DropTarget, E as ElementInfo, y as ElementLocator, ah as ExportContentProfile, z as FlexProperties, F as FlexPropertyKey, M as MeasurementLine, H as MeasurementState, ai as MovePlanContext, aj as ORIGINAL_STYLE_PROPS, R as ReactComponentFrame, J as SizingMode, K as SizingProperties, f as SizingPropertyKey, g as SizingValue, L as SpacingProperties, c as SpacingPropertyKey, q as TypographyProperties, T as TypographyPropertyKey, ak as borderPropertyToCSSMap, al as borderRadiusPropertyToCSSMap, Q as buildCommentExport, am as buildEditExport, an as buildElementContext, ao as buildExportInstruction, ap as buildMovePlan, aq as buildMovePlanContext, V as buildSessionExport, W as calculateDropPosition, X as calculateElementMeasurements, Y as calculateGuidelineMeasurements, Z as calculateParentMeasurements, ar as clamp, as as collapseExportShorthands, at as collapseSpacingShorthands, au as colorPropertyToCSSMap, _ as colorToTailwind, av as computeHoverHighlight, aw as computeIntendedIndex, ax as detectChildrenDirection, ay as detectSizingMode, $ as elementFromPointWithoutOverlays, az as ensureDirectTextSpanAtPoint, aA as findChildAtPoint, a0 as findContainerAtPoint, a1 as findLayoutContainerAtPoint, aB as findTextOwnerAtPoint, aC as findTextOwnerByRangeScan, aD as flexPropertyToCSSMap, a2 as formatPropertyValue,
|
|
1
|
+
export { ag as AllComputedStyles, e as BorderProperties, d as BorderPropertyKey, s as BorderRadiusProperties, B as BorderRadiusPropertyKey, t as BorderStyle, C as CSSPropertyValue, u as ColorProperties, i as ColorPropertyKey, j as ColorValue, m as DirectEditState, D as DragState, a as DropIndicator, x as DropTarget, E as ElementInfo, y as ElementLocator, ah as ExportContentProfile, z as FlexProperties, F as FlexPropertyKey, M as MeasurementLine, H as MeasurementState, ai as MovePlanContext, aj as ORIGINAL_STYLE_PROPS, R as ReactComponentFrame, J as SizingMode, K as SizingProperties, f as SizingPropertyKey, g as SizingValue, L as SpacingProperties, c as SpacingPropertyKey, q as TypographyProperties, T as TypographyPropertyKey, ak as borderPropertyToCSSMap, al as borderRadiusPropertyToCSSMap, Q as buildCommentExport, am as buildEditExport, an as buildElementContext, ao as buildExportInstruction, ap as buildMovePlan, aq as buildMovePlanContext, V as buildSessionExport, W as calculateDropPosition, X as calculateElementMeasurements, Y as calculateGuidelineMeasurements, Z as calculateParentMeasurements, ar as clamp, as as collapseExportShorthands, at as collapseSpacingShorthands, au as colorPropertyToCSSMap, _ as colorToTailwind, av as computeHoverHighlight, aw as computeIntendedIndex, ax as detectChildrenDirection, ay as detectSizingMode, $ as elementFromPointWithoutOverlays, az as ensureDirectTextSpanAtPoint, aA as findChildAtPoint, a0 as findContainerAtPoint, a1 as findLayoutContainerAtPoint, aB as findTextOwnerAtPoint, aC as findTextOwnerByRangeScan, aD as flexPropertyToCSSMap, aE as formatComponentTree, a2 as formatPropertyValue, aF as getAllComputedStyles, aG as getChildBriefInfo, a3 as getComputedBorderStyles, a4 as getComputedBoxShadow, a5 as getComputedColorStyles, aH as getComputedSizing, a6 as getComputedStyles, aI as getComputedTypography, aJ as getContextOnlyBlocks, a7 as getDimensionDisplay, aK as getElementDisplayName, a8 as getElementInfo, a9 as getElementLocator, aL as getElementSource, aM as getExportContentProfile, aa as getFlexDirection, aN as getLocatorHeader, aO as getMoveIntentForEdit, aP as getOriginalInlineStyles, aQ as getSelectionColors, aR as getSizingValue, aS as hasSessionEditChanges, ab as isFlexContainer, aT as isInFlowChild, aU as isInputFocused, ac as isLayoutContainer, aV as isTextElement, ad as parseColorValue, ae as parsePropertyValue, aW as partitionMultiSelectedEdits, aX as propertyToCSSMap, aY as resolveElementTarget, aZ as sizingPropertyToCSSMap, a_ as sizingToTailwind, a$ as sizingValueToCSS, af as stylesToTailwind, b0 as typographyPropertyToCSSMap } from './utils-lksVP2Wq.mjs';
|
package/dist/utils.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { ag as AllComputedStyles, e as BorderProperties, d as BorderPropertyKey, s as BorderRadiusProperties, B as BorderRadiusPropertyKey, t as BorderStyle, C as CSSPropertyValue, u as ColorProperties, i as ColorPropertyKey, j as ColorValue, m as DirectEditState, D as DragState, a as DropIndicator, x as DropTarget, E as ElementInfo, y as ElementLocator, ah as ExportContentProfile, z as FlexProperties, F as FlexPropertyKey, M as MeasurementLine, H as MeasurementState, ai as MovePlanContext, aj as ORIGINAL_STYLE_PROPS, R as ReactComponentFrame, J as SizingMode, K as SizingProperties, f as SizingPropertyKey, g as SizingValue, L as SpacingProperties, c as SpacingPropertyKey, q as TypographyProperties, T as TypographyPropertyKey, ak as borderPropertyToCSSMap, al as borderRadiusPropertyToCSSMap, Q as buildCommentExport, am as buildEditExport, an as buildElementContext, ao as buildExportInstruction, ap as buildMovePlan, aq as buildMovePlanContext, V as buildSessionExport, W as calculateDropPosition, X as calculateElementMeasurements, Y as calculateGuidelineMeasurements, Z as calculateParentMeasurements, ar as clamp, as as collapseExportShorthands, at as collapseSpacingShorthands, au as colorPropertyToCSSMap, _ as colorToTailwind, av as computeHoverHighlight, aw as computeIntendedIndex, ax as detectChildrenDirection, ay as detectSizingMode, $ as elementFromPointWithoutOverlays, az as ensureDirectTextSpanAtPoint, aA as findChildAtPoint, a0 as findContainerAtPoint, a1 as findLayoutContainerAtPoint, aB as findTextOwnerAtPoint, aC as findTextOwnerByRangeScan, aD as flexPropertyToCSSMap, a2 as formatPropertyValue,
|
|
1
|
+
export { ag as AllComputedStyles, e as BorderProperties, d as BorderPropertyKey, s as BorderRadiusProperties, B as BorderRadiusPropertyKey, t as BorderStyle, C as CSSPropertyValue, u as ColorProperties, i as ColorPropertyKey, j as ColorValue, m as DirectEditState, D as DragState, a as DropIndicator, x as DropTarget, E as ElementInfo, y as ElementLocator, ah as ExportContentProfile, z as FlexProperties, F as FlexPropertyKey, M as MeasurementLine, H as MeasurementState, ai as MovePlanContext, aj as ORIGINAL_STYLE_PROPS, R as ReactComponentFrame, J as SizingMode, K as SizingProperties, f as SizingPropertyKey, g as SizingValue, L as SpacingProperties, c as SpacingPropertyKey, q as TypographyProperties, T as TypographyPropertyKey, ak as borderPropertyToCSSMap, al as borderRadiusPropertyToCSSMap, Q as buildCommentExport, am as buildEditExport, an as buildElementContext, ao as buildExportInstruction, ap as buildMovePlan, aq as buildMovePlanContext, V as buildSessionExport, W as calculateDropPosition, X as calculateElementMeasurements, Y as calculateGuidelineMeasurements, Z as calculateParentMeasurements, ar as clamp, as as collapseExportShorthands, at as collapseSpacingShorthands, au as colorPropertyToCSSMap, _ as colorToTailwind, av as computeHoverHighlight, aw as computeIntendedIndex, ax as detectChildrenDirection, ay as detectSizingMode, $ as elementFromPointWithoutOverlays, az as ensureDirectTextSpanAtPoint, aA as findChildAtPoint, a0 as findContainerAtPoint, a1 as findLayoutContainerAtPoint, aB as findTextOwnerAtPoint, aC as findTextOwnerByRangeScan, aD as flexPropertyToCSSMap, aE as formatComponentTree, a2 as formatPropertyValue, aF as getAllComputedStyles, aG as getChildBriefInfo, a3 as getComputedBorderStyles, a4 as getComputedBoxShadow, a5 as getComputedColorStyles, aH as getComputedSizing, a6 as getComputedStyles, aI as getComputedTypography, aJ as getContextOnlyBlocks, a7 as getDimensionDisplay, aK as getElementDisplayName, a8 as getElementInfo, a9 as getElementLocator, aL as getElementSource, aM as getExportContentProfile, aa as getFlexDirection, aN as getLocatorHeader, aO as getMoveIntentForEdit, aP as getOriginalInlineStyles, aQ as getSelectionColors, aR as getSizingValue, aS as hasSessionEditChanges, ab as isFlexContainer, aT as isInFlowChild, aU as isInputFocused, ac as isLayoutContainer, aV as isTextElement, ad as parseColorValue, ae as parsePropertyValue, aW as partitionMultiSelectedEdits, aX as propertyToCSSMap, aY as resolveElementTarget, aZ as sizingPropertyToCSSMap, a_ as sizingToTailwind, a$ as sizingValueToCSS, af as stylesToTailwind, b0 as typographyPropertyToCSSMap } from './utils-lksVP2Wq.js';
|
package/dist/utils.js
CHANGED
|
@@ -51,6 +51,7 @@ __export(utils_exports, {
|
|
|
51
51
|
findTextOwnerAtPoint: () => findTextOwnerAtPoint,
|
|
52
52
|
findTextOwnerByRangeScan: () => findTextOwnerByRangeScan,
|
|
53
53
|
flexPropertyToCSSMap: () => flexPropertyToCSSMap,
|
|
54
|
+
formatComponentTree: () => formatComponentTree,
|
|
54
55
|
formatPropertyValue: () => formatPropertyValue,
|
|
55
56
|
getAllComputedStyles: () => getAllComputedStyles,
|
|
56
57
|
getChildBriefInfo: () => getChildBriefInfo,
|
|
@@ -68,6 +69,7 @@ __export(utils_exports, {
|
|
|
68
69
|
getElementSource: () => getElementSource,
|
|
69
70
|
getExportContentProfile: () => getExportContentProfile,
|
|
70
71
|
getFlexDirection: () => getFlexDirection,
|
|
72
|
+
getLocatorHeader: () => getLocatorHeader,
|
|
71
73
|
getMoveIntentForEdit: () => getMoveIntentForEdit,
|
|
72
74
|
getOriginalInlineStyles: () => getOriginalInlineStyles,
|
|
73
75
|
getSelectionColors: () => getSelectionColors,
|
|
@@ -133,6 +135,125 @@ function getZoomScale() {
|
|
|
133
135
|
return snap.active ? snap.zoom : 1;
|
|
134
136
|
}
|
|
135
137
|
|
|
138
|
+
// src/utils/react-fiber.ts
|
|
139
|
+
var EXCLUDED_PROP_KEYS = /* @__PURE__ */ new Set([
|
|
140
|
+
"className",
|
|
141
|
+
"style",
|
|
142
|
+
"children",
|
|
143
|
+
"ref",
|
|
144
|
+
"key",
|
|
145
|
+
"render"
|
|
146
|
+
]);
|
|
147
|
+
function serializePropValue(value) {
|
|
148
|
+
if (typeof value === "function") return "[function]";
|
|
149
|
+
if (typeof value === "symbol") return void 0;
|
|
150
|
+
if (value === void 0) return void 0;
|
|
151
|
+
if (value !== null && typeof value === "object") {
|
|
152
|
+
if ("$$typeof" in value) return "[element]";
|
|
153
|
+
try {
|
|
154
|
+
JSON.stringify(value);
|
|
155
|
+
return value;
|
|
156
|
+
} catch {
|
|
157
|
+
return "[object]";
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
return value;
|
|
161
|
+
}
|
|
162
|
+
function getComponentProps(fiber) {
|
|
163
|
+
const props = fiber?.memoizedProps ?? fiber?.pendingProps;
|
|
164
|
+
if (!props || typeof props !== "object") return {};
|
|
165
|
+
const result = {};
|
|
166
|
+
for (const [key, value] of Object.entries(props)) {
|
|
167
|
+
if (EXCLUDED_PROP_KEYS.has(key)) continue;
|
|
168
|
+
if (key.startsWith("data-")) continue;
|
|
169
|
+
const serialized = serializePropValue(value);
|
|
170
|
+
if (serialized !== void 0) {
|
|
171
|
+
result[key] = serialized;
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
return result;
|
|
175
|
+
}
|
|
176
|
+
function getCallSiteSource(fiber) {
|
|
177
|
+
const source = fiber?._debugSource;
|
|
178
|
+
if (source?.fileName) {
|
|
179
|
+
return {
|
|
180
|
+
file: source.fileName,
|
|
181
|
+
line: typeof source.lineNumber === "number" ? source.lineNumber : void 0,
|
|
182
|
+
column: typeof source.columnNumber === "number" ? source.columnNumber : void 0
|
|
183
|
+
};
|
|
184
|
+
}
|
|
185
|
+
const pending = fiber?.pendingProps?.__source;
|
|
186
|
+
if (pending?.fileName) {
|
|
187
|
+
return {
|
|
188
|
+
file: pending.fileName,
|
|
189
|
+
line: typeof pending.lineNumber === "number" ? pending.lineNumber : void 0,
|
|
190
|
+
column: typeof pending.columnNumber === "number" ? pending.columnNumber : void 0
|
|
191
|
+
};
|
|
192
|
+
}
|
|
193
|
+
return null;
|
|
194
|
+
}
|
|
195
|
+
function deriveDefinitionSource(frames) {
|
|
196
|
+
for (const frame of frames) {
|
|
197
|
+
if (frame.file && isComponentPrimitivePath(frame.file)) {
|
|
198
|
+
return { file: frame.file, line: frame.line, column: frame.column };
|
|
199
|
+
}
|
|
200
|
+
}
|
|
201
|
+
return null;
|
|
202
|
+
}
|
|
203
|
+
var PRIMITIVE_PATH_PATTERNS = [
|
|
204
|
+
/\/components\/ui\//,
|
|
205
|
+
/\/ui\/primitives\//,
|
|
206
|
+
/\/design-system\//
|
|
207
|
+
];
|
|
208
|
+
var PRIMITIVE_NPM_PATTERNS = [
|
|
209
|
+
/@base-ui\//,
|
|
210
|
+
/@radix-ui\//,
|
|
211
|
+
/@headlessui\//,
|
|
212
|
+
/@chakra-ui\//,
|
|
213
|
+
/@mantine\//,
|
|
214
|
+
/@mui\//,
|
|
215
|
+
/@ark-ui\//
|
|
216
|
+
];
|
|
217
|
+
var FRAMEWORK_EXCLUSION_PATTERNS = [
|
|
218
|
+
/node_modules\/react\//,
|
|
219
|
+
/node_modules\/react-dom\//,
|
|
220
|
+
/node_modules\/next\/dist\//,
|
|
221
|
+
/node_modules\/scheduler\//,
|
|
222
|
+
/node_modules\/react-server\//
|
|
223
|
+
];
|
|
224
|
+
function isComponentPrimitivePath(filePath) {
|
|
225
|
+
const normalized = filePath.replace(/\\/g, "/");
|
|
226
|
+
for (const pattern of FRAMEWORK_EXCLUSION_PATTERNS) {
|
|
227
|
+
if (pattern.test(normalized)) return false;
|
|
228
|
+
}
|
|
229
|
+
for (const pattern of PRIMITIVE_NPM_PATTERNS) {
|
|
230
|
+
if (pattern.test(normalized)) return true;
|
|
231
|
+
}
|
|
232
|
+
for (const pattern of PRIMITIVE_PATH_PATTERNS) {
|
|
233
|
+
if (pattern.test(normalized)) return true;
|
|
234
|
+
}
|
|
235
|
+
return false;
|
|
236
|
+
}
|
|
237
|
+
function classifyComponentFiber(fiber, frames, elementSourceFile) {
|
|
238
|
+
if (elementSourceFile && isComponentPrimitivePath(elementSourceFile)) {
|
|
239
|
+
return { isComponentPrimitive: true };
|
|
240
|
+
}
|
|
241
|
+
if (!fiber) return { isComponentPrimitive: false };
|
|
242
|
+
const callSite = getCallSiteSource(fiber);
|
|
243
|
+
if (callSite?.file && isComponentPrimitivePath(callSite.file)) {
|
|
244
|
+
return { isComponentPrimitive: true };
|
|
245
|
+
}
|
|
246
|
+
for (const frame of frames) {
|
|
247
|
+
if (frame.file && isComponentPrimitivePath(frame.file)) {
|
|
248
|
+
return { isComponentPrimitive: true };
|
|
249
|
+
}
|
|
250
|
+
}
|
|
251
|
+
if (!elementSourceFile && fiber._debugSource) {
|
|
252
|
+
return { isComponentPrimitive: true };
|
|
253
|
+
}
|
|
254
|
+
return { isComponentPrimitive: false };
|
|
255
|
+
}
|
|
256
|
+
|
|
136
257
|
// src/utils.ts
|
|
137
258
|
function clamp(value, min, max) {
|
|
138
259
|
if (!Number.isFinite(value)) return min;
|
|
@@ -1898,38 +2019,48 @@ function getOwnerStack(fiber) {
|
|
|
1898
2019
|
const frames = [];
|
|
1899
2020
|
let current = fiber;
|
|
1900
2021
|
let lastFrame = null;
|
|
2022
|
+
let nearestComponentFiber = null;
|
|
1901
2023
|
while (current) {
|
|
1902
2024
|
const frame = buildFrame(current);
|
|
1903
2025
|
if (frame && shouldIncludeFrame(frame, lastFrame)) {
|
|
1904
2026
|
frames.push(frame);
|
|
1905
2027
|
lastFrame = frame;
|
|
2028
|
+
if (!nearestComponentFiber) {
|
|
2029
|
+
nearestComponentFiber = current;
|
|
2030
|
+
}
|
|
1906
2031
|
}
|
|
1907
2032
|
current = current._debugOwner;
|
|
1908
2033
|
}
|
|
1909
|
-
return frames;
|
|
2034
|
+
return { frames, nearestComponentFiber };
|
|
1910
2035
|
}
|
|
1911
2036
|
function getRenderStack(fiber) {
|
|
1912
2037
|
const frames = [];
|
|
1913
2038
|
let current = fiber;
|
|
1914
2039
|
let lastFrame = null;
|
|
2040
|
+
let nearestComponentFiber = null;
|
|
1915
2041
|
while (current) {
|
|
1916
2042
|
const frame = buildFrame(current);
|
|
1917
2043
|
if (frame && shouldIncludeFrame(frame, lastFrame)) {
|
|
1918
2044
|
frames.push(frame);
|
|
1919
2045
|
lastFrame = frame;
|
|
2046
|
+
if (!nearestComponentFiber) {
|
|
2047
|
+
nearestComponentFiber = current;
|
|
2048
|
+
}
|
|
1920
2049
|
}
|
|
1921
2050
|
current = current.return;
|
|
1922
2051
|
}
|
|
1923
|
-
return frames;
|
|
2052
|
+
return { frames, nearestComponentFiber };
|
|
1924
2053
|
}
|
|
1925
|
-
function
|
|
2054
|
+
function getReactComponentInfo(element) {
|
|
1926
2055
|
const fiber = getFiberForElement(element);
|
|
1927
|
-
if (!fiber) return [];
|
|
1928
|
-
const
|
|
1929
|
-
|
|
1930
|
-
|
|
2056
|
+
if (!fiber) return { frames: [], nearestComponentFiber: null };
|
|
2057
|
+
const elementSource = getSourceFromFiber(fiber);
|
|
2058
|
+
const elementSourceFile = elementSource?.fileName || void 0;
|
|
2059
|
+
const ownerResult = getOwnerStack(fiber);
|
|
2060
|
+
if (ownerResult.frames.length > 0) {
|
|
2061
|
+
return { ...ownerResult, elementSourceFile };
|
|
1931
2062
|
}
|
|
1932
|
-
return getRenderStack(fiber);
|
|
2063
|
+
return { ...getRenderStack(fiber), elementSourceFile };
|
|
1933
2064
|
}
|
|
1934
2065
|
function getElementDisplayName(element) {
|
|
1935
2066
|
const tag = element.tagName.toLowerCase();
|
|
@@ -2231,6 +2362,27 @@ function parseDomSource(element) {
|
|
|
2231
2362
|
}
|
|
2232
2363
|
return { file, line, column };
|
|
2233
2364
|
}
|
|
2365
|
+
var MAX_SUB_ELEMENT_SOURCES = 20;
|
|
2366
|
+
function collectSubElementSources(element) {
|
|
2367
|
+
const sources = {};
|
|
2368
|
+
const children = element.querySelectorAll("[data-direct-edit-source]");
|
|
2369
|
+
const labelCounts = /* @__PURE__ */ new Map();
|
|
2370
|
+
let count = 0;
|
|
2371
|
+
for (const child of children) {
|
|
2372
|
+
if (count >= MAX_SUB_ELEMENT_SOURCES) break;
|
|
2373
|
+
if (!(child instanceof HTMLElement)) continue;
|
|
2374
|
+
const source = parseDomSource(child);
|
|
2375
|
+
if (!source) continue;
|
|
2376
|
+
const text = ((child.innerText || child.textContent) ?? "").trim();
|
|
2377
|
+
let baseLabel = text.length > 0 && text.length <= 30 ? text.slice(0, 30).toLowerCase().replace(/\s+/g, "_") : child.tagName.toLowerCase();
|
|
2378
|
+
const existing = labelCounts.get(baseLabel) ?? 0;
|
|
2379
|
+
labelCounts.set(baseLabel, existing + 1);
|
|
2380
|
+
const label = existing > 0 ? `${baseLabel}_${existing + 1}` : baseLabel;
|
|
2381
|
+
sources[label] = source;
|
|
2382
|
+
count++;
|
|
2383
|
+
}
|
|
2384
|
+
return sources;
|
|
2385
|
+
}
|
|
2234
2386
|
function getElementSource(element) {
|
|
2235
2387
|
const domSource = parseDomSource(element);
|
|
2236
2388
|
if (domSource) return domSource;
|
|
@@ -2253,8 +2405,15 @@ function getElementSource(element) {
|
|
|
2253
2405
|
function getElementLocator(element) {
|
|
2254
2406
|
const elementInfo = getElementInfo(element);
|
|
2255
2407
|
const domSource = getElementSource(element);
|
|
2408
|
+
const { frames, nearestComponentFiber, elementSourceFile } = getReactComponentInfo(element);
|
|
2409
|
+
const componentName = nearestComponentFiber?.type?.displayName || nearestComponentFiber?.type?.name || void 0;
|
|
2410
|
+
const authoredProps = nearestComponentFiber ? getComponentProps(nearestComponentFiber) : void 0;
|
|
2411
|
+
const classification = classifyComponentFiber(nearestComponentFiber, frames, elementSourceFile);
|
|
2412
|
+
const callSite = nearestComponentFiber ? getCallSiteSource(nearestComponentFiber) : null;
|
|
2413
|
+
const definitionSrc = classification.isComponentPrimitive ? deriveDefinitionSource(frames) : null;
|
|
2414
|
+
const subSources = collectSubElementSources(element);
|
|
2256
2415
|
return {
|
|
2257
|
-
reactStack:
|
|
2416
|
+
reactStack: frames,
|
|
2258
2417
|
domSelector: buildDomSelector(element),
|
|
2259
2418
|
domContextHtml: buildDomContextHtml(element),
|
|
2260
2419
|
targetHtml: buildTargetHtml(element),
|
|
@@ -2262,36 +2421,80 @@ function getElementLocator(element) {
|
|
|
2262
2421
|
tagName: elementInfo.tagName,
|
|
2263
2422
|
id: elementInfo.id,
|
|
2264
2423
|
classList: elementInfo.classList,
|
|
2265
|
-
domSource: domSource ?? void 0
|
|
2424
|
+
domSource: domSource ?? void 0,
|
|
2425
|
+
reactComponentName: componentName,
|
|
2426
|
+
authoredProps: authoredProps && Object.keys(authoredProps).length > 0 ? authoredProps : void 0,
|
|
2427
|
+
subElementSources: Object.keys(subSources).length > 0 ? subSources : void 0,
|
|
2428
|
+
callSiteSource: callSite ?? void 0,
|
|
2429
|
+
definitionSource: definitionSrc ?? void 0,
|
|
2430
|
+
isComponentPrimitive: nearestComponentFiber || elementSourceFile ? classification.isComponentPrimitive : void 0
|
|
2266
2431
|
};
|
|
2267
2432
|
}
|
|
2268
2433
|
function getLocatorHeader(locator) {
|
|
2269
2434
|
const primaryFrame = getPrimaryFrame(locator);
|
|
2270
|
-
const componentLabel =
|
|
2271
|
-
|
|
2272
|
-
|
|
2435
|
+
const componentLabel = locator.reactComponentName ?? primaryFrame?.name ?? locator.tagName;
|
|
2436
|
+
let formattedSource;
|
|
2437
|
+
if (locator.isComponentPrimitive && locator.definitionSource?.file) {
|
|
2438
|
+
formattedSource = formatSourceLocation(
|
|
2439
|
+
locator.definitionSource.file,
|
|
2440
|
+
locator.definitionSource.line,
|
|
2441
|
+
locator.definitionSource.column
|
|
2442
|
+
);
|
|
2443
|
+
} else {
|
|
2444
|
+
formattedSource = locator.domSource?.file ? formatSourceLocation(locator.domSource.file, locator.domSource.line, locator.domSource.column) : primaryFrame?.file ? formatSourceLocation(primaryFrame.file, primaryFrame.line, primaryFrame.column) : null;
|
|
2445
|
+
}
|
|
2446
|
+
const formattedCallSite = locator.callSiteSource?.file ? formatSourceLocation(locator.callSiteSource.file, locator.callSiteSource.line, locator.callSiteSource.column) : null;
|
|
2447
|
+
return { componentLabel, formattedSource, formattedCallSite };
|
|
2448
|
+
}
|
|
2449
|
+
function formatComponentTree(reactStack) {
|
|
2450
|
+
const names = reactStack.map((f) => f.name).filter(Boolean);
|
|
2451
|
+
if (names.length === 0) return null;
|
|
2452
|
+
if (names.length === 1) return names[0];
|
|
2453
|
+
const [component, ...ancestors] = names;
|
|
2454
|
+
return `${component} (in ${ancestors.join(" > ")})`;
|
|
2273
2455
|
}
|
|
2274
2456
|
function buildLocatorContextLines(locator, options) {
|
|
2275
2457
|
const lines = [];
|
|
2276
|
-
const { componentLabel, formattedSource } = getLocatorHeader(locator);
|
|
2458
|
+
const { componentLabel, formattedSource, formattedCallSite } = getLocatorHeader(locator);
|
|
2277
2459
|
const target = (locator.targetHtml || locator.domContextHtml || "").trim();
|
|
2278
2460
|
const context = locator.domContextHtml?.trim() || "";
|
|
2279
|
-
const
|
|
2461
|
+
const path = locator.domSelector?.trim();
|
|
2280
2462
|
const text = locator.textPreview?.trim();
|
|
2281
2463
|
lines.push(`@<${componentLabel}>`);
|
|
2282
2464
|
lines.push("");
|
|
2465
|
+
const tree = formatComponentTree(locator.reactStack);
|
|
2466
|
+
if (tree) {
|
|
2467
|
+
lines.push(`react: ${tree}`);
|
|
2468
|
+
}
|
|
2469
|
+
if (locator.authoredProps && Object.keys(locator.authoredProps).length > 0) {
|
|
2470
|
+
lines.push(`props: ${JSON.stringify(locator.authoredProps)}`);
|
|
2471
|
+
}
|
|
2472
|
+
if (locator.isComponentPrimitive != null) {
|
|
2473
|
+
lines.push(`type: ${locator.isComponentPrimitive ? "component" : "instance"}`);
|
|
2474
|
+
}
|
|
2475
|
+
lines.push(`source: ${formattedSource ?? "(file not available)"}`);
|
|
2476
|
+
if (formattedCallSite && formattedCallSite !== formattedSource) {
|
|
2477
|
+
lines.push(`call-site: ${formattedCallSite}`);
|
|
2478
|
+
}
|
|
2479
|
+
if (locator.subElementSources && Object.keys(locator.subElementSources).length > 0) {
|
|
2480
|
+
lines.push("source-map:");
|
|
2481
|
+
for (const [label, source] of Object.entries(locator.subElementSources)) {
|
|
2482
|
+
lines.push(` - ${label}: ${formatSourceLocation(source.file, source.line, source.column)}`);
|
|
2483
|
+
}
|
|
2484
|
+
}
|
|
2485
|
+
if (path) {
|
|
2486
|
+
lines.push(`path: ${path}`);
|
|
2487
|
+
}
|
|
2283
2488
|
if (target) {
|
|
2489
|
+
lines.push("");
|
|
2284
2490
|
lines.push("target:");
|
|
2285
2491
|
lines.push(target);
|
|
2286
2492
|
}
|
|
2287
2493
|
if (!options?.skipContext && context && context !== target) {
|
|
2494
|
+
lines.push("");
|
|
2288
2495
|
lines.push("context:");
|
|
2289
2496
|
lines.push(context);
|
|
2290
2497
|
}
|
|
2291
|
-
lines.push(`in ${formattedSource ?? "(file not available)"}`);
|
|
2292
|
-
if (selector) {
|
|
2293
|
-
lines.push(`selector: ${selector}`);
|
|
2294
|
-
}
|
|
2295
2498
|
if (text) {
|
|
2296
2499
|
lines.push(`text: ${text}`);
|
|
2297
2500
|
}
|
|
@@ -3088,6 +3291,7 @@ ${buildMoveExportLines(moveIntent).join("\n")}`;
|
|
|
3088
3291
|
findTextOwnerAtPoint,
|
|
3089
3292
|
findTextOwnerByRangeScan,
|
|
3090
3293
|
flexPropertyToCSSMap,
|
|
3294
|
+
formatComponentTree,
|
|
3091
3295
|
formatPropertyValue,
|
|
3092
3296
|
getAllComputedStyles,
|
|
3093
3297
|
getChildBriefInfo,
|
|
@@ -3105,6 +3309,7 @@ ${buildMoveExportLines(moveIntent).join("\n")}`;
|
|
|
3105
3309
|
getElementSource,
|
|
3106
3310
|
getExportContentProfile,
|
|
3107
3311
|
getFlexDirection,
|
|
3312
|
+
getLocatorHeader,
|
|
3108
3313
|
getMoveIntentForEdit,
|
|
3109
3314
|
getOriginalInlineStyles,
|
|
3110
3315
|
getSelectionColors,
|