@promakeai/inspector-hook 1.2.6 → 1.2.8

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 (3) hide show
  1. package/dist/utils/jsxUpdater.d.ts.map +1 -1
  2. package/dist/utils/jsxUpdater.js +67 -63
  3. package/package.json +1 -1
package/dist/utils/jsxUpdater.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"jsxUpdater.d.ts","sourceRoot":"","sources":["../../src/utils/jsxUpdater.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EACV,eAAe,EACf,mBAAmB,EAEpB,MAAM,4BAA4B,CAAC;AAEpC,MAAM,WAAW,sBAAsB;IACrC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,uBAAuB;IACtC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,0BAA0B;IACzC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;CACjB;AA4YD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,GAC9B,qBAAqB,CAmFvB;AAoGD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAC9B,OAAO,EAAE,uBAAuB,GAC/B,qBAAqB,CAqDvB;AAED;;;;;GAKG;AACH,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,0BAA0B,GAClC,qBAAqB,CAmDvB;AAED;;GAEG;AACH,MAAM,WAAW,wBAAwB;IACvC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;CACjB;AAmBD;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,wBAAwB,GAChC,qBAAqB,CA+FvB;AAED;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,eAAe,EAAE,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,uBAAuB,EAAE,CAAC;IACnC,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,UAAU,EAAE,MAAM,CAAC;QACnB,MAAM,EAAE,MAAM,CAAC;QACf,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC;CACH;AA4CD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,uBAAuB,CACrC,OAAO,EAAE,mBAAmB,GAC3B,kBAAkB,CA2MpB"}
1
+ {"version":3,"file":"jsxUpdater.d.ts","sourceRoot":"","sources":["../../src/utils/jsxUpdater.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EACV,eAAe,EACf,mBAAmB,EAEpB,MAAM,4BAA4B,CAAC;AAEpC,MAAM,WAAW,sBAAsB;IACrC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,uBAAuB;IACtC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,0BAA0B;IACzC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;CACjB;AA+YD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,GAC9B,qBAAqB,CAmFvB;AAoGD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAC9B,OAAO,EAAE,uBAAuB,GAC/B,qBAAqB,CAqDvB;AAED;;;;;GAKG;AACH,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,0BAA0B,GAClC,qBAAqB,CAmDvB;AAED;;GAEG;AACH,MAAM,WAAW,wBAAwB;IACvC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;CACjB;AAmBD;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,wBAAwB,GAChC,qBAAqB,CA+FvB;AAED;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,eAAe,EAAE,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,uBAAuB,EAAE,CAAC;IACnC,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,UAAU,EAAE,MAAM,CAAC;QACnB,MAAM,EAAE,MAAM,CAAC;QACf,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC;CACH;AA4CD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,uBAAuB,CACrC,OAAO,EAAE,mBAAmB,GAC3B,kBAAkB,CA2MpB"}
package/dist/utils/jsxUpdater.js CHANGED
@@ -130,11 +130,43 @@ function parseStyleObject(styleValue) {
130
130
  }
131
131
  return styles;
132
132
  }
133
+ /**
134
+ * Convert convenience style properties to valid CSS properties
135
+ * e.g., paddingHorizontal -> paddingLeft + paddingRight
136
+ */
137
+ function normalizeStyleProperties(styles) {
138
+ const normalized = {};
139
+ for (const [key, value] of Object.entries(styles)) {
140
+ switch (key) {
141
+ case "paddingHorizontal":
142
+ normalized["paddingLeft"] = value;
143
+ normalized["paddingRight"] = value;
144
+ break;
145
+ case "paddingVertical":
146
+ normalized["paddingTop"] = value;
147
+ normalized["paddingBottom"] = value;
148
+ break;
149
+ case "marginHorizontal":
150
+ normalized["marginLeft"] = value;
151
+ normalized["marginRight"] = value;
152
+ break;
153
+ case "marginVertical":
154
+ normalized["marginTop"] = value;
155
+ normalized["marginBottom"] = value;
156
+ break;
157
+ default:
158
+ normalized[key] = value;
159
+ }
160
+ }
161
+ return normalized;
162
+ }
133
163
  /**
134
164
  * Create style object string from styles
135
165
  */
136
166
  function createStyleString(styles) {
137
- const entries = Object.entries(styles).map(([key, value]) => `${key}: "${value}"`);
167
+ // First normalize convenience properties to valid CSS
168
+ const normalizedStyles = normalizeStyleProperties(styles);
169
+ const entries = Object.entries(normalizedStyles).map(([key, value]) => `${key}: "${value}"`);
138
170
  return `{{ ${entries.join(", ")} }}`;
139
171
  }
140
172
  /**
@@ -153,6 +185,8 @@ function validateTagSyntax(tagContent) {
153
185
  }
154
186
  /**
155
187
  * Check if a JSX element has a proper closing tag and valid content (basic check)
188
+ * This is a simplified validation - we check for closing tag existence and balanced braces,
189
+ * but skip the complex nesting validation which can fail on valid JSX with components.
156
190
  */
157
191
  function hasProperClosingTag(sourceCode, tagStart, tagEnd, tagName) {
158
192
  // For self-closing tags, no closing tag needed
@@ -162,20 +196,16 @@ function hasProperClosingTag(sourceCode, tagStart, tagEnd, tagName) {
162
196
  }
163
197
  // Look for closing tag after the opening tag
164
198
  const afterOpening = sourceCode.slice(tagEnd);
165
- const closingTagPattern = new RegExp(`</${tagName}\\s*>`);
166
- // Check if there's a closing tag somewhere
167
- const closingMatch = closingTagPattern.exec(afterOpening);
168
- if (!closingMatch) {
169
- return false;
170
- }
171
- // Check the content between opening and closing tags for unmatched braces
172
- const contentBetween = afterOpening.slice(0, closingMatch.index);
173
- let braceDepth = 0;
199
+ // For the target tag, we need to find the MATCHING closing tag
200
+ // by tracking the depth of same-named tags
201
+ let depth = 1;
202
+ let i = 0;
174
203
  let inString = false;
175
204
  let stringChar = "";
176
- for (let i = 0; i < contentBetween.length; i++) {
177
- const char = contentBetween[i];
178
- const prevChar = i > 0 ? contentBetween[i - 1] : "";
205
+ let inJSXExpression = 0;
206
+ while (i < afterOpening.length && depth > 0) {
207
+ const char = afterOpening[i];
208
+ const prevChar = i > 0 ? afterOpening[i - 1] : "";
179
209
  // Handle strings
180
210
  if ((char === '"' || char === "'" || char === "`") && prevChar !== "\\") {
181
211
  if (!inString) {
@@ -187,66 +217,40 @@ function hasProperClosingTag(sourceCode, tagStart, tagEnd, tagName) {
187
217
  stringChar = "";
188
218
  }
189
219
  }
190
- // Count braces outside of strings
220
+ // Track JSX expression depth (to ignore > inside expressions like {x > 0})
191
221
  if (!inString) {
192
222
  if (char === "{") {
193
- braceDepth++;
223
+ inJSXExpression++;
194
224
  }
195
225
  else if (char === "}") {
196
- braceDepth--;
226
+ inJSXExpression--;
197
227
  }
198
228
  }
199
- }
200
- // If braces don't match, JSX is invalid
201
- if (braceDepth !== 0) {
202
- return false;
203
- }
204
- // Validate proper nesting by tracking all opening and closing tags
205
- let tagStack = [tagName];
206
- let i = 0;
207
- while (i < afterOpening.length && tagStack.length > 0) {
208
- // Look for next tag (opening or closing)
209
- const remainingCode = afterOpening.slice(i);
210
- const nextTag = remainingCode.match(/^<\/?([A-Za-z_$][A-Za-z0-9_$]*)/);
211
- if (!nextTag) {
212
- // No more tags, move forward
213
- i++;
214
- continue;
215
- }
216
- const isClosing = remainingCode.startsWith("</");
217
- const foundTagName = nextTag[1];
218
- if (isClosing) {
219
- // Closing tag - should match top of stack
220
- if (tagStack.length === 0 ||
221
- tagStack[tagStack.length - 1] !== foundTagName) {
222
- return false; // Mismatched closing tag
223
- }
224
- tagStack.pop();
225
- // If this was our target tag's closing, we're done
226
- if (tagStack.length === 0) {
227
- break;
229
+ // Only look for tags outside of strings and JSX expressions
230
+ if (!inString && inJSXExpression === 0 && char === "<") {
231
+ const remainingCode = afterOpening.slice(i);
232
+ // Check for closing tag of our target element
233
+ const closingPattern = new RegExp(`^</${tagName}(?:\\s|>)`);
234
+ if (closingPattern.test(remainingCode)) {
235
+ depth--;
236
+ if (depth === 0) {
237
+ return true; // Found matching closing tag
238
+ }
228
239
  }
229
- }
230
- else {
231
- // Opening tag - check if it's self-closing
232
- const tagEndMatch = remainingCode.match(/^<[^>]+?(\/?)>/);
233
- if (tagEndMatch && !tagEndMatch[1]) {
234
- // Not self-closing, add to stack
235
- tagStack.push(foundTagName);
240
+ // Check for opening tag of same element type (increases depth)
241
+ const openingPattern = new RegExp(`^<${tagName}(?:\\s|>|/)`);
242
+ if (openingPattern.test(remainingCode)) {
243
+ // Check if it's self-closing
244
+ const tagContent = remainingCode.match(/^<[^>]*>/);
245
+ if (tagContent && !tagContent[0].endsWith("/>")) {
246
+ depth++;
247
+ }
236
248
  }
237
- // If self-closing (/>), don't add to stack
238
249
  }
239
- // Move past this tag
240
- const tagEnd = remainingCode.indexOf(">");
241
- if (tagEnd === -1)
242
- break;
243
- i += tagEnd + 1;
244
- }
245
- // Stack should be empty if all tags matched properly
246
- if (tagStack.length > 0) {
247
- return false;
250
+ i++;
248
251
  }
249
- return true;
252
+ // If we found the matching closing tag, depth would be 0 and we'd have returned true
253
+ return false;
250
254
  }
251
255
  /**
252
256
  * Update or add style attribute in JSX tag
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@promakeai/inspector-hook",
3
- "version": "1.2.6",
3
+ "version": "1.2.8",
4
4
  "description": "React hook for controlling inspector in parent applications",
5
5
  "author": "Promake",
6
6
  "type": "module",