@base44-preview/vite-plugin 0.2.22-pr.36.db00ef7 → 0.2.22-pr.37.68542f2

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.
Files changed (119) hide show
  1. package/dist/injections/utils.d.ts +0 -6
  2. package/dist/injections/utils.d.ts.map +1 -1
  3. package/dist/injections/utils.js +0 -25
  4. package/dist/injections/utils.js.map +1 -1
  5. package/dist/injections/visual-edit-agent/capabilities/inline-editing/core.d.ts +25 -0
  6. package/dist/injections/visual-edit-agent/capabilities/inline-editing/core.d.ts.map +1 -0
  7. package/dist/injections/visual-edit-agent/capabilities/inline-editing/core.js +78 -0
  8. package/dist/injections/visual-edit-agent/capabilities/inline-editing/core.js.map +1 -0
  9. package/dist/injections/visual-edit-agent/capabilities/inline-editing/index.d.ts +4 -0
  10. package/dist/injections/visual-edit-agent/capabilities/inline-editing/index.d.ts.map +1 -0
  11. package/dist/injections/visual-edit-agent/capabilities/inline-editing/index.js +4 -0
  12. package/dist/injections/visual-edit-agent/capabilities/inline-editing/index.js.map +1 -0
  13. package/dist/injections/visual-edit-agent/capabilities/inline-editing/styles.d.ts +9 -0
  14. package/dist/injections/visual-edit-agent/capabilities/inline-editing/styles.d.ts.map +1 -0
  15. package/dist/injections/visual-edit-agent/capabilities/inline-editing/styles.js +26 -0
  16. package/dist/injections/visual-edit-agent/capabilities/inline-editing/styles.js.map +1 -0
  17. package/dist/injections/visual-edit-agent/capabilities/inline-editing/validation.d.ts +10 -0
  18. package/dist/injections/visual-edit-agent/capabilities/inline-editing/validation.d.ts.map +1 -0
  19. package/dist/injections/visual-edit-agent/capabilities/inline-editing/validation.js +60 -0
  20. package/dist/injections/visual-edit-agent/capabilities/inline-editing/validation.js.map +1 -0
  21. package/dist/injections/visual-edit-agent/constants.d.ts +10 -0
  22. package/dist/injections/visual-edit-agent/constants.d.ts.map +1 -0
  23. package/dist/injections/visual-edit-agent/constants.js +10 -0
  24. package/dist/injections/visual-edit-agent/constants.js.map +1 -0
  25. package/dist/injections/visual-edit-agent/handlers/click-handlers.d.ts +10 -0
  26. package/dist/injections/visual-edit-agent/handlers/click-handlers.d.ts.map +1 -0
  27. package/dist/injections/visual-edit-agent/handlers/click-handlers.js +107 -0
  28. package/dist/injections/visual-edit-agent/handlers/click-handlers.js.map +1 -0
  29. package/dist/injections/visual-edit-agent/handlers/hover-handlers.d.ts +14 -0
  30. package/dist/injections/visual-edit-agent/handlers/hover-handlers.d.ts.map +1 -0
  31. package/dist/injections/visual-edit-agent/handlers/hover-handlers.js +64 -0
  32. package/dist/injections/visual-edit-agent/handlers/hover-handlers.js.map +1 -0
  33. package/dist/injections/visual-edit-agent/handlers/inline-edit-handlers.d.ts +14 -0
  34. package/dist/injections/visual-edit-agent/handlers/inline-edit-handlers.d.ts.map +1 -0
  35. package/dist/injections/visual-edit-agent/handlers/inline-edit-handlers.js +104 -0
  36. package/dist/injections/visual-edit-agent/handlers/inline-edit-handlers.js.map +1 -0
  37. package/dist/injections/visual-edit-agent/handlers/message-handlers.d.ts +26 -0
  38. package/dist/injections/visual-edit-agent/handlers/message-handlers.d.ts.map +1 -0
  39. package/dist/injections/visual-edit-agent/handlers/message-handlers.js +145 -0
  40. package/dist/injections/visual-edit-agent/handlers/message-handlers.js.map +1 -0
  41. package/dist/injections/visual-edit-agent/handlers/messages/toggle-inline-edit-mode.d.ts +7 -0
  42. package/dist/injections/visual-edit-agent/handlers/messages/toggle-inline-edit-mode.d.ts.map +1 -0
  43. package/dist/injections/visual-edit-agent/handlers/messages/toggle-inline-edit-mode.js +42 -0
  44. package/dist/injections/visual-edit-agent/handlers/messages/toggle-inline-edit-mode.js.map +1 -0
  45. package/dist/injections/visual-edit-agent/handlers/messages/toggle-visual-edit-mode.d.ts +11 -0
  46. package/dist/injections/visual-edit-agent/handlers/messages/toggle-visual-edit-mode.d.ts.map +1 -0
  47. package/dist/injections/visual-edit-agent/handlers/messages/toggle-visual-edit-mode.js +32 -0
  48. package/dist/injections/visual-edit-agent/handlers/messages/toggle-visual-edit-mode.js.map +1 -0
  49. package/dist/injections/visual-edit-agent/handlers/messages/types.d.ts +86 -0
  50. package/dist/injections/visual-edit-agent/handlers/messages/types.d.ts.map +1 -0
  51. package/dist/injections/visual-edit-agent/handlers/messages/types.js +28 -0
  52. package/dist/injections/visual-edit-agent/handlers/messages/types.js.map +1 -0
  53. package/dist/injections/visual-edit-agent/index.d.ts +5 -0
  54. package/dist/injections/visual-edit-agent/index.d.ts.map +1 -0
  55. package/dist/injections/visual-edit-agent/index.js +106 -0
  56. package/dist/injections/visual-edit-agent/index.js.map +1 -0
  57. package/dist/injections/visual-edit-agent/state/agent-state.d.ts +17 -0
  58. package/dist/injections/visual-edit-agent/state/agent-state.d.ts.map +1 -0
  59. package/dist/injections/visual-edit-agent/state/agent-state.js +18 -0
  60. package/dist/injections/visual-edit-agent/state/agent-state.js.map +1 -0
  61. package/dist/injections/visual-edit-agent/ui/overlay.d.ts +26 -0
  62. package/dist/injections/visual-edit-agent/ui/overlay.d.ts.map +1 -0
  63. package/dist/injections/visual-edit-agent/ui/overlay.js +100 -0
  64. package/dist/injections/visual-edit-agent/ui/overlay.js.map +1 -0
  65. package/dist/injections/visual-edit-agent/utils/dom-utils.d.ts +14 -0
  66. package/dist/injections/visual-edit-agent/utils/dom-utils.d.ts.map +1 -0
  67. package/dist/injections/visual-edit-agent/utils/dom-utils.js +34 -0
  68. package/dist/injections/visual-edit-agent/utils/dom-utils.js.map +1 -0
  69. package/dist/injections/visual-edit-agent.d.ts +1 -1
  70. package/dist/injections/visual-edit-agent.d.ts.map +1 -1
  71. package/dist/injections/visual-edit-agent.js +1 -474
  72. package/dist/injections/visual-edit-agent.js.map +1 -1
  73. package/dist/statics/index.mjs +5 -1
  74. package/dist/statics/index.mjs.map +1 -1
  75. package/package.json +1 -1
  76. package/src/injections/utils.ts +0 -34
  77. package/src/injections/visual-edit-agent/README.md +222 -0
  78. package/src/injections/visual-edit-agent/capabilities/inline-editing/core.ts +100 -0
  79. package/src/injections/visual-edit-agent/capabilities/inline-editing/index.ts +10 -0
  80. package/src/injections/visual-edit-agent/capabilities/inline-editing/styles.ts +26 -0
  81. package/src/injections/visual-edit-agent/capabilities/inline-editing/validation.ts +67 -0
  82. package/src/injections/visual-edit-agent/constants.ts +9 -0
  83. package/src/injections/visual-edit-agent/handlers/click-handlers.ts +134 -0
  84. package/src/injections/visual-edit-agent/handlers/hover-handlers.ts +78 -0
  85. package/src/injections/visual-edit-agent/handlers/inline-edit-handlers.ts +136 -0
  86. package/src/injections/visual-edit-agent/handlers/message-handlers.ts +191 -0
  87. package/src/injections/visual-edit-agent/handlers/messages/toggle-inline-edit-mode.ts +51 -0
  88. package/src/injections/visual-edit-agent/handlers/messages/toggle-visual-edit-mode.ts +40 -0
  89. package/src/injections/visual-edit-agent/handlers/messages/types.ts +112 -0
  90. package/src/injections/visual-edit-agent/index.ts +120 -0
  91. package/src/injections/visual-edit-agent/state/agent-state.ts +31 -0
  92. package/src/injections/visual-edit-agent/ui/overlay.ts +121 -0
  93. package/src/injections/visual-edit-agent/utils/dom-utils.ts +39 -0
  94. package/src/injections/visual-edit-agent.ts +1 -577
  95. package/dist/injections/layer-dropdown/consts.d.ts +0 -15
  96. package/dist/injections/layer-dropdown/consts.d.ts.map +0 -1
  97. package/dist/injections/layer-dropdown/consts.js +0 -36
  98. package/dist/injections/layer-dropdown/consts.js.map +0 -1
  99. package/dist/injections/layer-dropdown/controller.d.ts +0 -4
  100. package/dist/injections/layer-dropdown/controller.d.ts.map +0 -1
  101. package/dist/injections/layer-dropdown/controller.js +0 -85
  102. package/dist/injections/layer-dropdown/controller.js.map +0 -1
  103. package/dist/injections/layer-dropdown/dropdown-ui.d.ts +0 -13
  104. package/dist/injections/layer-dropdown/dropdown-ui.d.ts.map +0 -1
  105. package/dist/injections/layer-dropdown/dropdown-ui.js +0 -158
  106. package/dist/injections/layer-dropdown/dropdown-ui.js.map +0 -1
  107. package/dist/injections/layer-dropdown/types.d.ts +0 -21
  108. package/dist/injections/layer-dropdown/types.d.ts.map +0 -1
  109. package/dist/injections/layer-dropdown/types.js +0 -3
  110. package/dist/injections/layer-dropdown/types.js.map +0 -1
  111. package/dist/injections/layer-dropdown/utils.d.ts +0 -23
  112. package/dist/injections/layer-dropdown/utils.d.ts.map +0 -1
  113. package/dist/injections/layer-dropdown/utils.js +0 -119
  114. package/dist/injections/layer-dropdown/utils.js.map +0 -1
  115. package/src/injections/layer-dropdown/consts.ts +0 -44
  116. package/src/injections/layer-dropdown/controller.ts +0 -105
  117. package/src/injections/layer-dropdown/dropdown-ui.ts +0 -221
  118. package/src/injections/layer-dropdown/types.ts +0 -24
  119. package/src/injections/layer-dropdown/utils.ts +0 -148
@@ -1,85 +0,0 @@
1
- /** Controller that encapsulates layer-dropdown integration logic */
2
- import { getElementSelectorId } from "../utils.js";
3
- import { buildLayerChain } from "./utils.js";
4
- import { enhanceLabelWithChevron, showDropdown, closeDropdown, isDropdownOpen, } from "./dropdown-ui.js";
5
- export function createLayerController(deps) {
6
- let layerPreviewOverlay = null;
7
- let escapeHandler = null;
8
- let dropdownSourceElement = null;
9
- const clearLayerPreview = () => {
10
- if (layerPreviewOverlay && layerPreviewOverlay.parentNode) {
11
- layerPreviewOverlay.remove();
12
- }
13
- layerPreviewOverlay = null;
14
- };
15
- const showLayerPreview = (layer) => {
16
- clearLayerPreview();
17
- if (getElementSelectorId(layer.element) === deps.getSelectedElementId())
18
- return;
19
- layerPreviewOverlay = deps.createPreviewOverlay(layer.element);
20
- };
21
- const selectElementFromLayer = (layer) => {
22
- clearLayerPreview();
23
- closeDropdown();
24
- if (escapeHandler) {
25
- document.removeEventListener("keydown", escapeHandler, true);
26
- escapeHandler = null;
27
- }
28
- dropdownSourceElement = null;
29
- const firstOverlay = deps.selectElement(layer.element);
30
- attachToOverlay(firstOverlay, layer.element);
31
- };
32
- const reselectDropdownSource = () => {
33
- if (escapeHandler) {
34
- document.removeEventListener("keydown", escapeHandler, true);
35
- escapeHandler = null;
36
- }
37
- if (dropdownSourceElement) {
38
- selectElementFromLayer({
39
- element: dropdownSourceElement,
40
- tagName: dropdownSourceElement.tagName.toLowerCase(),
41
- selectorId: getElementSelectorId(dropdownSourceElement),
42
- });
43
- dropdownSourceElement = null;
44
- }
45
- };
46
- const attachToOverlay = (overlay, element) => {
47
- if (!overlay)
48
- return;
49
- const label = overlay.querySelector("div");
50
- if (!label)
51
- return;
52
- const layers = buildLayerChain(element);
53
- if (layers.length <= 1)
54
- return;
55
- const currentId = getElementSelectorId(element);
56
- enhanceLabelWithChevron(label);
57
- label.addEventListener("click", (e) => {
58
- e.stopPropagation();
59
- e.preventDefault();
60
- if (isDropdownOpen()) {
61
- closeDropdown();
62
- reselectDropdownSource();
63
- }
64
- else {
65
- dropdownSourceElement = element;
66
- deps.onDeselect();
67
- escapeHandler = (ev) => {
68
- if (ev.key === "Escape") {
69
- ev.stopPropagation();
70
- closeDropdown();
71
- reselectDropdownSource();
72
- }
73
- };
74
- document.addEventListener("keydown", escapeHandler, true);
75
- showDropdown(label, layers, currentId, selectElementFromLayer, showLayerPreview, clearLayerPreview);
76
- }
77
- });
78
- };
79
- const cleanup = () => {
80
- clearLayerPreview();
81
- closeDropdown();
82
- };
83
- return { attachToOverlay, cleanup };
84
- }
85
- //# sourceMappingURL=controller.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"controller.js","sourceRoot":"","sources":["../../../src/injections/layer-dropdown/controller.ts"],"names":[],"mappings":"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"}
@@ -1,13 +0,0 @@
1
- /** Dropdown UI component for layer navigation */
2
- import type { LayerInfo, OnLayerSelect, OnLayerHover, OnLayerHoverEnd } from "./types.js";
3
- /** Create the dropdown DOM element with layer items */
4
- export declare function createDropdownElement(layers: LayerInfo[], currentSelectorId: string | null, onSelect: OnLayerSelect, onHover?: OnLayerHover, onHoverEnd?: OnLayerHoverEnd): HTMLDivElement;
5
- /** Add chevron indicator and pointer-events to the label */
6
- export declare function enhanceLabelWithChevron(label: HTMLDivElement): void;
7
- /** Show the dropdown below the label element */
8
- export declare function showDropdown(label: HTMLDivElement, layers: LayerInfo[], currentSelectorId: string | null, onSelect: OnLayerSelect, onHover?: OnLayerHover, onHoverEnd?: OnLayerHoverEnd): void;
9
- /** Close the active dropdown and clean up listeners */
10
- export declare function closeDropdown(): void;
11
- /** Check if a dropdown is currently visible */
12
- export declare function isDropdownOpen(): boolean;
13
- //# sourceMappingURL=dropdown-ui.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-ui.d.ts","sourceRoot":"","sources":["../../../src/injections/layer-dropdown/dropdown-ui.ts"],"names":[],"mappings":"AAAA,iDAAiD;AAcjD,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAgD1F,uDAAuD;AACvD,wBAAgB,qBAAqB,CACnC,MAAM,EAAE,SAAS,EAAE,EACnB,iBAAiB,EAAE,MAAM,GAAG,IAAI,EAChC,QAAQ,EAAE,aAAa,EACvB,OAAO,CAAC,EAAE,YAAY,EACtB,UAAU,CAAC,EAAE,eAAe,GAC3B,cAAc,CAWhB;AAED,4DAA4D;AAC5D,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,CAQnE;AAkED,gDAAgD;AAChD,wBAAgB,YAAY,CAC1B,KAAK,EAAE,cAAc,EACrB,MAAM,EAAE,SAAS,EAAE,EACnB,iBAAiB,EAAE,MAAM,GAAG,IAAI,EAChC,QAAQ,EAAE,aAAa,EACvB,OAAO,CAAC,EAAE,YAAY,EACtB,UAAU,CAAC,EAAE,eAAe,GAC3B,IAAI,CA2BN;AAED,uDAAuD;AACvD,wBAAgB,aAAa,IAAI,IAAI,CAoBpC;AAED,+CAA+C;AAC/C,wBAAgB,cAAc,IAAI,OAAO,CAExC"}
@@ -1,158 +0,0 @@
1
- /** Dropdown UI component for layer navigation */
2
- import { DROPDOWN_CONTAINER_STYLES, DROPDOWN_ITEM_BASE_STYLES, DROPDOWN_ITEM_ACTIVE_COLOR, DROPDOWN_ITEM_ACTIVE_BG, DROPDOWN_ITEM_ACTIVE_FONT_WEIGHT, DROPDOWN_ITEM_HOVER_BG, DEPTH_INDENT_PX, LABEL_CHEVRON, LAYER_DROPDOWN_ATTR, } from "./consts.js";
3
- import { applyStyles, getLayerDisplayName } from "./utils.js";
4
- let activeDropdown = null;
5
- let outsideMousedownHandler = null;
6
- let activeOnHoverEnd = null;
7
- let activeKeydownHandler = null;
8
- function createDropdownItem(layer, isActive, onSelect, onHover, onHoverEnd) {
9
- const item = document.createElement("div");
10
- item.textContent = getLayerDisplayName(layer);
11
- applyStyles(item, DROPDOWN_ITEM_BASE_STYLES);
12
- const depth = layer.depth ?? 0;
13
- if (depth > 0) {
14
- item.style.paddingLeft = `${12 + depth * DEPTH_INDENT_PX}px`;
15
- }
16
- if (isActive) {
17
- item.style.color = DROPDOWN_ITEM_ACTIVE_COLOR;
18
- item.style.backgroundColor = DROPDOWN_ITEM_ACTIVE_BG;
19
- item.style.fontWeight = DROPDOWN_ITEM_ACTIVE_FONT_WEIGHT;
20
- }
21
- item.addEventListener("mouseenter", () => {
22
- if (!isActive)
23
- item.style.backgroundColor = DROPDOWN_ITEM_HOVER_BG;
24
- if (onHover)
25
- onHover(layer);
26
- });
27
- item.addEventListener("mouseleave", () => {
28
- if (!isActive)
29
- item.style.backgroundColor = "transparent";
30
- if (onHoverEnd)
31
- onHoverEnd();
32
- });
33
- item.addEventListener("click", (e) => {
34
- e.stopPropagation();
35
- e.preventDefault();
36
- onSelect(layer);
37
- });
38
- return item;
39
- }
40
- /** Create the dropdown DOM element with layer items */
41
- export function createDropdownElement(layers, currentSelectorId, onSelect, onHover, onHoverEnd) {
42
- const container = document.createElement("div");
43
- container.setAttribute(LAYER_DROPDOWN_ATTR, "true");
44
- applyStyles(container, DROPDOWN_CONTAINER_STYLES);
45
- layers.forEach((layer) => {
46
- const isActive = layer.selectorId === currentSelectorId;
47
- container.appendChild(createDropdownItem(layer, isActive, onSelect, onHover, onHoverEnd));
48
- });
49
- return container;
50
- }
51
- /** Add chevron indicator and pointer-events to the label */
52
- export function enhanceLabelWithChevron(label) {
53
- if (label.textContent?.includes(LABEL_CHEVRON))
54
- return;
55
- label.textContent = label.textContent + LABEL_CHEVRON;
56
- label.style.cursor = "pointer";
57
- label.style.userSelect = "none";
58
- label.style.pointerEvents = "auto";
59
- label.setAttribute(LAYER_DROPDOWN_ATTR, "true");
60
- }
61
- function setupKeyboardNavigation(dropdown, layers, currentSelectorId, onSelect, onHover, onHoverEnd) {
62
- const items = Array.from(dropdown.children);
63
- let focusedIndex = layers.findIndex((l) => l.selectorId === currentSelectorId);
64
- const setFocusedItem = (index) => {
65
- if (focusedIndex >= 0 && focusedIndex < items.length) {
66
- const prev = items[focusedIndex];
67
- if (prev.style.color !== DROPDOWN_ITEM_ACTIVE_COLOR) {
68
- prev.style.backgroundColor = "transparent";
69
- }
70
- }
71
- focusedIndex = index;
72
- if (focusedIndex >= 0 && focusedIndex < items.length) {
73
- const cur = items[focusedIndex];
74
- if (cur.style.color !== DROPDOWN_ITEM_ACTIVE_COLOR) {
75
- cur.style.backgroundColor = DROPDOWN_ITEM_HOVER_BG;
76
- }
77
- cur.scrollIntoView({ block: "nearest" });
78
- if (onHover)
79
- onHover(layers[focusedIndex]);
80
- }
81
- };
82
- activeKeydownHandler = (e) => {
83
- if (e.key === "ArrowDown") {
84
- e.preventDefault();
85
- e.stopPropagation();
86
- setFocusedItem(focusedIndex < items.length - 1 ? focusedIndex + 1 : 0);
87
- }
88
- else if (e.key === "ArrowUp") {
89
- e.preventDefault();
90
- e.stopPropagation();
91
- setFocusedItem(focusedIndex > 0 ? focusedIndex - 1 : items.length - 1);
92
- }
93
- else if (e.key === "Enter" && focusedIndex >= 0) {
94
- e.preventDefault();
95
- e.stopPropagation();
96
- if (onHoverEnd)
97
- onHoverEnd();
98
- onSelect(layers[focusedIndex]);
99
- closeDropdown();
100
- }
101
- };
102
- document.addEventListener("keydown", activeKeydownHandler, true);
103
- }
104
- function setupOutsideClickHandler(dropdown, label) {
105
- setTimeout(() => {
106
- outsideMousedownHandler = (e) => {
107
- const target = e.target;
108
- if (!dropdown.contains(target) && target !== label) {
109
- closeDropdown();
110
- }
111
- };
112
- document.addEventListener("mousedown", outsideMousedownHandler, true);
113
- }, 0);
114
- }
115
- /** Show the dropdown below the label element */
116
- export function showDropdown(label, layers, currentSelectorId, onSelect, onHover, onHoverEnd) {
117
- closeDropdown();
118
- const dropdown = createDropdownElement(layers, currentSelectorId, (layer) => {
119
- if (onHoverEnd)
120
- onHoverEnd();
121
- onSelect(layer);
122
- closeDropdown();
123
- }, onHover, onHoverEnd);
124
- const overlay = label.parentElement;
125
- if (!overlay)
126
- return;
127
- dropdown.style.top = `${label.offsetTop + label.offsetHeight + 2}px`;
128
- dropdown.style.left = `${label.offsetLeft}px`;
129
- overlay.appendChild(dropdown);
130
- activeDropdown = dropdown;
131
- activeOnHoverEnd = onHoverEnd ?? null;
132
- setupKeyboardNavigation(dropdown, layers, currentSelectorId, onSelect, onHover, onHoverEnd);
133
- setupOutsideClickHandler(dropdown, label);
134
- }
135
- /** Close the active dropdown and clean up listeners */
136
- export function closeDropdown() {
137
- if (activeOnHoverEnd) {
138
- activeOnHoverEnd();
139
- activeOnHoverEnd = null;
140
- }
141
- if (activeDropdown && activeDropdown.parentNode) {
142
- activeDropdown.remove();
143
- }
144
- activeDropdown = null;
145
- if (outsideMousedownHandler) {
146
- document.removeEventListener("mousedown", outsideMousedownHandler, true);
147
- outsideMousedownHandler = null;
148
- }
149
- if (activeKeydownHandler) {
150
- document.removeEventListener("keydown", activeKeydownHandler, true);
151
- activeKeydownHandler = null;
152
- }
153
- }
154
- /** Check if a dropdown is currently visible */
155
- export function isDropdownOpen() {
156
- return activeDropdown !== null;
157
- }
158
- //# sourceMappingURL=dropdown-ui.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"dropdown-ui.js","sourceRoot":"","sources":["../../../src/injections/layer-dropdown/dropdown-ui.ts"],"names":[],"mappings":"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"}
@@ -1,21 +0,0 @@
1
- /** Shared types for the layer-dropdown module */
2
- export interface LayerInfo {
3
- element: Element;
4
- tagName: string;
5
- selectorId: string | null;
6
- depth?: number;
7
- }
8
- export type OnLayerSelect = (layer: LayerInfo) => void;
9
- export type OnLayerHover = (layer: LayerInfo) => void;
10
- export type OnLayerHoverEnd = () => void;
11
- export interface LayerControllerDeps {
12
- createPreviewOverlay: (element: Element) => HTMLDivElement;
13
- getSelectedElementId: () => string | null;
14
- selectElement: (element: Element) => HTMLDivElement | undefined;
15
- onDeselect: () => void;
16
- }
17
- export interface LayerController {
18
- attachToOverlay: (overlay: HTMLDivElement | undefined, element: Element) => void;
19
- cleanup: () => void;
20
- }
21
- //# sourceMappingURL=types.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/injections/layer-dropdown/types.ts"],"names":[],"mappings":"AAAA,iDAAiD;AAEjD,MAAM,WAAW,SAAS;IACxB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,MAAM,aAAa,GAAG,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;AACvD,MAAM,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;AACtD,MAAM,MAAM,eAAe,GAAG,MAAM,IAAI,CAAC;AAEzC,MAAM,WAAW,mBAAmB;IAClC,oBAAoB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,cAAc,CAAC;IAC3D,oBAAoB,EAAE,MAAM,MAAM,GAAG,IAAI,CAAC;IAC1C,aAAa,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,cAAc,GAAG,SAAS,CAAC;IAChE,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,MAAM,WAAW,eAAe;IAC9B,eAAe,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,SAAS,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACjF,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB"}
@@ -1,3 +0,0 @@
1
- /** Shared types for the layer-dropdown module */
2
- export {};
3
- //# sourceMappingURL=types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/injections/layer-dropdown/types.ts"],"names":[],"mappings":"AAAA,iDAAiD"}
@@ -1,23 +0,0 @@
1
- /** DOM utilities for the layer-dropdown module */
2
- import type { LayerInfo } from "./types.js";
3
- /** Apply a style map to an element */
4
- export declare function applyStyles(element: HTMLElement, styles: Record<string, string>): void;
5
- /** Display name for a layer — just the real tag name */
6
- export declare function getLayerDisplayName(layer: LayerInfo): string;
7
- /**
8
- * Collect instrumented descendants up to `maxDepth` instrumented nesting levels.
9
- * Non-instrumented wrappers are walked through without counting toward depth.
10
- * Results are in DOM order.
11
- */
12
- export declare function getInstrumentedDescendants(parent: Element, maxDepth: number): LayerInfo[];
13
- /**
14
- * Build the layer chain for the dropdown:
15
- *
16
- * Parents – up to MAX_PARENT_DEPTH instrumented ancestors, outer → inner.
17
- * Current – the selected element.
18
- * Children – instrumented descendants within MAX_CHILD_DEPTH levels, DOM order.
19
- *
20
- * Each item carries a `depth` for visual indentation.
21
- */
22
- export declare function buildLayerChain(selectedElement: Element): LayerInfo[];
23
- //# sourceMappingURL=utils.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/injections/layer-dropdown/utils.ts"],"names":[],"mappings":"AAAA,kDAAkD;AAKlD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE5C,sCAAsC;AACtC,wBAAgB,WAAW,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAEtF;AAED,wDAAwD;AACxD,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,SAAS,GAAG,MAAM,CAE5D;AAED;;;;GAIG;AACH,wBAAgB,0BAA0B,CACxC,MAAM,EAAE,OAAO,EACf,QAAQ,EAAE,MAAM,GACf,SAAS,EAAE,CAsBb;AAsDD;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAAC,eAAe,EAAE,OAAO,GAAG,SAAS,EAAE,CAQrE"}
@@ -1,119 +0,0 @@
1
- /** DOM utilities for the layer-dropdown module */
2
- import { isInstrumentedElement, getElementSelectorId } from "../utils.js";
3
- import { MAX_PARENT_DEPTH, MAX_CHILD_DEPTH } from "./consts.js";
4
- /** Apply a style map to an element */
5
- export function applyStyles(element, styles) {
6
- Object.assign(element.style, styles);
7
- }
8
- /** Display name for a layer — just the real tag name */
9
- export function getLayerDisplayName(layer) {
10
- return layer.tagName;
11
- }
12
- /**
13
- * Collect instrumented descendants up to `maxDepth` instrumented nesting levels.
14
- * Non-instrumented wrappers are walked through without counting toward depth.
15
- * Results are in DOM order.
16
- */
17
- export function getInstrumentedDescendants(parent, maxDepth) {
18
- const result = [];
19
- function walk(el, instrDepth) {
20
- if (instrDepth > maxDepth)
21
- return;
22
- for (let i = 0; i < el.children.length; i++) {
23
- const child = el.children[i];
24
- if (isInstrumentedElement(child)) {
25
- result.push({
26
- element: child,
27
- tagName: child.tagName.toLowerCase(),
28
- selectorId: getElementSelectorId(child),
29
- });
30
- walk(child, instrDepth + 1);
31
- }
32
- else {
33
- walk(child, instrDepth);
34
- }
35
- }
36
- }
37
- walk(parent, 1);
38
- return result;
39
- }
40
- function toLayerInfo(element, depth) {
41
- const info = {
42
- element,
43
- tagName: element.tagName.toLowerCase(),
44
- selectorId: getElementSelectorId(element),
45
- };
46
- if (depth !== undefined)
47
- info.depth = depth;
48
- return info;
49
- }
50
- /** Collect instrumented ancestors from selected element up to MAX_PARENT_DEPTH (outermost first). */
51
- function collectInstrumentedParents(selectedElement) {
52
- const parents = [];
53
- let current = selectedElement.parentElement;
54
- while (current &&
55
- current !== document.documentElement &&
56
- current !== document.body &&
57
- parents.length < MAX_PARENT_DEPTH) {
58
- if (isInstrumentedElement(current)) {
59
- parents.push(toLayerInfo(current));
60
- }
61
- current = current.parentElement;
62
- }
63
- parents.reverse();
64
- return parents;
65
- }
66
- /** Append parents to chain with depth 0, 1, …; returns depth of selected (parents.length). */
67
- function appendParentsWithDepth(chain, parents) {
68
- parents.forEach((p, i) => {
69
- chain.push({ ...p, depth: i });
70
- });
71
- return parents.length;
72
- }
73
- /** Append selected element and its descendants at the given depth. */
74
- function appendSelfAndDescendants(chain, selectedElement, selfDepth) {
75
- chain.push(toLayerInfo(selectedElement, selfDepth));
76
- const descendants = getInstrumentedDescendants(selectedElement, MAX_CHILD_DEPTH);
77
- assignDescendantDepths(selectedElement, descendants, selfDepth + 1);
78
- chain.push(...descendants);
79
- }
80
- /**
81
- * Build the layer chain for the dropdown:
82
- *
83
- * Parents – up to MAX_PARENT_DEPTH instrumented ancestors, outer → inner.
84
- * Current – the selected element.
85
- * Children – instrumented descendants within MAX_CHILD_DEPTH levels, DOM order.
86
- *
87
- * Each item carries a `depth` for visual indentation.
88
- */
89
- export function buildLayerChain(selectedElement) {
90
- const parents = collectInstrumentedParents(selectedElement);
91
- const chain = [];
92
- const selfDepth = appendParentsWithDepth(chain, parents);
93
- appendSelfAndDescendants(chain, selectedElement, selfDepth);
94
- return chain;
95
- }
96
- /**
97
- * Walk the DOM tree again to assign correct visual depth to each descendant.
98
- * This avoids storing depth during collection and keeps the API simple.
99
- */
100
- function assignDescendantDepths(root, descendants, startDepth) {
101
- // Build a set for O(1) lookup
102
- const descSet = new Set(descendants.map((d) => d.element));
103
- // Map element → LayerInfo for mutation
104
- const descMap = new Map(descendants.map((d) => [d.element, d]));
105
- function walk(el, instrDepth) {
106
- for (let i = 0; i < el.children.length; i++) {
107
- const child = el.children[i];
108
- if (descSet.has(child)) {
109
- descMap.get(child).depth = startDepth + instrDepth - 1;
110
- walk(child, instrDepth + 1);
111
- }
112
- else {
113
- walk(child, instrDepth);
114
- }
115
- }
116
- }
117
- walk(root, 1);
118
- }
119
- //# sourceMappingURL=utils.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/injections/layer-dropdown/utils.ts"],"names":[],"mappings":"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"}
@@ -1,44 +0,0 @@
1
- /** Style constants for the layer dropdown UI */
2
-
3
- export const DROPDOWN_CONTAINER_STYLES: Record<string, string> = {
4
- position: "absolute",
5
- backgroundColor: "#ffffff",
6
- border: "1px solid #e2e8f0",
7
- borderRadius: "6px",
8
- boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
9
- fontSize: "12px",
10
- minWidth: "120px",
11
- maxHeight: "200px",
12
- overflowY: "auto",
13
- zIndex: "10001",
14
- padding: "4px 0",
15
- pointerEvents: "auto",
16
- };
17
-
18
- export const DROPDOWN_ITEM_BASE_STYLES: Record<string, string> = {
19
- padding: "4px 12px",
20
- cursor: "pointer",
21
- color: "#334155",
22
- backgroundColor: "transparent",
23
- whiteSpace: "nowrap",
24
- lineHeight: "1.5",
25
- fontWeight: "400",
26
- };
27
-
28
- export const DROPDOWN_ITEM_ACTIVE_COLOR = "#526cff";
29
- export const DROPDOWN_ITEM_ACTIVE_BG = "#DBEAFE";
30
- export const DROPDOWN_ITEM_ACTIVE_FONT_WEIGHT = "600";
31
-
32
- export const DROPDOWN_ITEM_HOVER_BG = "#f1f5f9";
33
-
34
- export const DEPTH_INDENT_PX = 10;
35
-
36
- export const LABEL_CHEVRON = " \u25BE";
37
-
38
- export const LAYER_DROPDOWN_ATTR = "data-layer-dropdown";
39
-
40
- /** Max instrumented ancestors to show above the selected element */
41
- export const MAX_PARENT_DEPTH = 2;
42
-
43
- /** Max instrumented depth levels to show below the selected element */
44
- export const MAX_CHILD_DEPTH = 2;
@@ -1,105 +0,0 @@
1
- /** Controller that encapsulates layer-dropdown integration logic */
2
-
3
- import { getElementSelectorId } from "../utils.js";
4
- import { buildLayerChain } from "./utils.js";
5
- import {
6
- enhanceLabelWithChevron,
7
- showDropdown,
8
- closeDropdown,
9
- isDropdownOpen,
10
- } from "./dropdown-ui.js";
11
- import type { LayerInfo, LayerControllerDeps, LayerController } from "./types.js";
12
-
13
- export function createLayerController(deps: LayerControllerDeps): LayerController {
14
- let layerPreviewOverlay: HTMLDivElement | null = null;
15
- let escapeHandler: ((e: KeyboardEvent) => void) | null = null;
16
- let dropdownSourceElement: Element | null = null;
17
-
18
- const clearLayerPreview = () => {
19
- if (layerPreviewOverlay && layerPreviewOverlay.parentNode) {
20
- layerPreviewOverlay.remove();
21
- }
22
- layerPreviewOverlay = null;
23
- };
24
-
25
- const showLayerPreview = (layer: LayerInfo) => {
26
- clearLayerPreview();
27
- if (getElementSelectorId(layer.element) === deps.getSelectedElementId()) return;
28
-
29
- layerPreviewOverlay = deps.createPreviewOverlay(layer.element);
30
- };
31
-
32
- const selectElementFromLayer = (layer: LayerInfo) => {
33
- clearLayerPreview();
34
- closeDropdown();
35
- if (escapeHandler) {
36
- document.removeEventListener("keydown", escapeHandler, true);
37
- escapeHandler = null;
38
- }
39
- dropdownSourceElement = null;
40
-
41
- const firstOverlay = deps.selectElement(layer.element);
42
- attachToOverlay(firstOverlay, layer.element);
43
- };
44
-
45
- const reselectDropdownSource = () => {
46
- if (escapeHandler) {
47
- document.removeEventListener("keydown", escapeHandler, true);
48
- escapeHandler = null;
49
- }
50
- if (dropdownSourceElement) {
51
- selectElementFromLayer({
52
- element: dropdownSourceElement,
53
- tagName: dropdownSourceElement.tagName.toLowerCase(),
54
- selectorId: getElementSelectorId(dropdownSourceElement),
55
- });
56
- dropdownSourceElement = null;
57
- }
58
- };
59
-
60
- const attachToOverlay = (
61
- overlay: HTMLDivElement | undefined,
62
- element: Element
63
- ) => {
64
- if (!overlay) return;
65
-
66
- const label = overlay.querySelector("div") as HTMLDivElement | null;
67
- if (!label) return;
68
-
69
- const layers = buildLayerChain(element);
70
- if (layers.length <= 1) return;
71
-
72
- const currentId = getElementSelectorId(element);
73
- enhanceLabelWithChevron(label);
74
-
75
- label.addEventListener("click", (e: MouseEvent) => {
76
- e.stopPropagation();
77
- e.preventDefault();
78
- if (isDropdownOpen()) {
79
- closeDropdown();
80
- reselectDropdownSource();
81
- } else {
82
- dropdownSourceElement = element;
83
- deps.onDeselect();
84
-
85
- escapeHandler = (ev: KeyboardEvent) => {
86
- if (ev.key === "Escape") {
87
- ev.stopPropagation();
88
- closeDropdown();
89
- reselectDropdownSource();
90
- }
91
- };
92
- document.addEventListener("keydown", escapeHandler, true);
93
-
94
- showDropdown(label, layers, currentId, selectElementFromLayer, showLayerPreview, clearLayerPreview);
95
- }
96
- });
97
- };
98
-
99
- const cleanup = () => {
100
- clearLayerPreview();
101
- closeDropdown();
102
- };
103
-
104
- return { attachToOverlay, cleanup };
105
- }