@gomeniucivan/ui 1.0.55 → 1.0.57

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gomeniucivan/ui",
-  "version": "1.0.55",
+  "version": "1.0.57",
   "private": false,
   "sideEffects": [
     "**/*.css"
@@ -56,7 +56,6 @@
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
     "@emoji-mart/data": "^1.2.1",
-    "@emoji-mart/react": "^1.1.1",
     "@emotion/cache": "^11.11.0",
     "@emotion/css": "^11.11.2",
     "@emotion/is-prop-valid": "^1.4.0",

package/scripts/stylePathTransform.js

@@ -3,9 +3,24 @@
 /**
  * Functions whose calls get a `{ path }` option injected.
  */
-const TARGET_FNS = ['createStaticStyles', 'createStyles'];
+const TARGET_FNS = ['createStaticStyles', 'createStyles', 'createStylish'];
 const CALL_RE = new RegExp(`(?:${TARGET_FNS.join('|')})\\s*\\(`, 'g');
 
+/**
+ * Regex to detect standalone `css` tagged template literals.
+ * Matches `css` NOT preceded by `.`, `$`, or word characters (avoids
+ * matching `obj.css`, `customCss`, `$css`, etc.) followed by a backtick.
+ */
+const CSS_TAG_RE = /(?<![.\w$])css\s*`/g;
+
+/**
+ * Inline helper prepended to files that have css tagged template wraps.
+ * Attaches __inspPath to SerializedStyles objects (typeof === 'object').
+ * Strings (from createStaticStyles css) pass through unchanged.
+ */
+const INSP_CSS_HELPER =
+  'var __inspCss__ = function(s, p) { if (s && typeof s === "object") s.__inspPath = p; return s; };\n';
+
 const hasPathProperty = (text) => /\bpath\s*:/.test(text);
 
 const escapePathValue = (value) => value.replace(/\\/g, '/').replace(/'/g, "\\'");
@@ -141,86 +156,268 @@ const findCallBoundaries = (source, afterParen) => {
 };
 
 /**
- * Inject `{ path: '<file-path>' }` into createStyles/createStaticStyles calls.
- *
- * Rules:
- * - One arg call: append second arg `{ path }`
- * - Two+ arg call:
- *   - if second arg is object literal and has no `path`, inject into object
- *   - otherwise append third arg `{ path }` as a fallback
+ * Find the closing backtick of a template literal.
+ * `afterBacktick` is the index right after the opening backtick.
+ * Returns the index of the closing backtick, or -1 if not found.
  */
-const injectStylePath = (source, filePath, resourcePath = '') => {
-  if (!CALL_RE.test(source)) return source;
-  CALL_RE.lastIndex = 0;
+const findTemplateLiteralEnd = (source, afterBacktick) => {
+  let i = afterBacktick;
 
-  const normalizedResourcePath = resourcePath.replace(/\\/g, '/');
+  while (i < source.length) {
+    const ch = source[i];
 
-  // Skip the style factory implementation files themselves.
-  if (
-    (normalizedResourcePath.includes('createStaticStyles') ||
-      normalizedResourcePath.includes('createStyles')) &&
-    normalizedResourcePath.endsWith('index.ts')
-  ) {
-    return source;
+    // Escaped character
+    if (ch === '\\') {
+      i += 2;
+      continue;
+    }
+
+    // End of template literal
+    if (ch === '`') {
+      return i;
+    }
+
+    // Template expression: ${...}
+    if (ch === '$' && i + 1 < source.length && source[i + 1] === '{') {
+      i += 2; // skip ${
+      let depth = 1;
+
+      while (i < source.length && depth > 0) {
+        const c = source[i];
+
+        if (c === '\\') {
+          i += 2;
+          continue;
+        }
+
+        if (c === '{') {
+          depth++;
+          i++;
+          continue;
+        }
+
+        if (c === '}') {
+          depth--;
+          if (depth === 0) {
+            i++; // skip closing }
+            break;
+          }
+          i++;
+          continue;
+        }
+
+        // Nested template literal inside expression
+        if (c === '`') {
+          i++; // skip opening backtick
+          const nested = findTemplateLiteralEnd(source, i);
+          if (nested === -1) return -1;
+          i = nested + 1; // skip closing backtick
+          continue;
+        }
+
+        // String literal inside expression
+        if (c === '"' || c === "'") {
+          const quote = c;
+          i++; // skip opening quote
+          while (i < source.length && source[i] !== quote) {
+            if (source[i] === '\\') i++;
+            i++;
+          }
+          if (i < source.length) i++; // skip closing quote
+          continue;
+        }
+
+        // Line comment inside expression
+        if (c === '/' && i + 1 < source.length && source[i + 1] === '/') {
+          i += 2;
+          while (i < source.length && source[i] !== '\n') i++;
+          continue;
+        }
+
+        // Block comment inside expression
+        if (c === '/' && i + 1 < source.length && source[i + 1] === '*') {
+          i += 2;
+          while (
+            i < source.length &&
+            !(source[i] === '*' && i + 1 < source.length && source[i + 1] === '/')
+          ) {
+            i++;
+          }
+          if (i < source.length) i += 2; // skip */
+          continue;
+        }
+
+        i++;
+      }
+      continue;
+    }
+
+    i++;
   }
 
+  return -1; // unclosed template literal
+};
+
+/**
+ * Check whether a position in the source is inside a comment or string.
+ * Simple heuristic: checks the line text before the match.
+ */
+const isInCommentOrString = (source, index) => {
+  const lineStart = source.lastIndexOf('\n', index) + 1;
+  const lineText = source.slice(lineStart, index).trimStart();
+  return lineText.startsWith('*') || lineText.startsWith('//');
+};
+
+/**
+ * Wrap standalone `css` tagged template literals with __inspCss__().
+ *
+ * Transforms: css`color: red;`
+ * Into:       __inspCss__(css`color: red;`, 'src/File/path')
+ *
+ * The wrapper attaches __inspPath to SerializedStyles objects so that
+ * createCSS.ts can register the className → path in the source registry.
+ */
+const wrapCssTaggedTemplates = (source, filePath) => {
+  CSS_TAG_RE.lastIndex = 0;
+  if (!CSS_TAG_RE.test(source)) return source;
+  CSS_TAG_RE.lastIndex = 0;
+
+  const escapedPath = escapePathValue(filePath);
+
+  // Collect all match positions
   const positions = [];
   let match;
-  while ((match = CALL_RE.exec(source)) !== null) {
-    const lineStart = source.lastIndexOf('\n', match.index) + 1;
-    const lineText = source.slice(lineStart, match.index).trimStart();
-    if (lineText.startsWith('*') || lineText.startsWith('//')) continue;
-    positions.push(match.index + match[0].length);
+  while ((match = CSS_TAG_RE.exec(source)) !== null) {
+    if (isInCommentOrString(source, match.index)) continue;
+
+    // cssStart = start of "css", backtickIdx = position of the backtick
+    const cssStart = match.index;
+    const backtickIdx = cssStart + match[0].length - 1;
+    positions.push({ cssStart, backtickIdx });
   }
 
   if (positions.length === 0) return source;
 
+  // Process from right to left so indices remain valid
   let result = source;
-  const escapedPath = escapePathValue(filePath);
+  let needsHelper = false;
 
   for (let pi = positions.length - 1; pi >= 0; pi--) {
-    const afterParen = positions[pi];
-    const callInfo = findCallBoundaries(result, afterParen);
-    if (!callInfo) continue;
+    const { cssStart, backtickIdx } = positions[pi];
+    const afterBacktick = backtickIdx + 1;
+    const endBacktick = findTemplateLiteralEnd(result, afterBacktick);
+    if (endBacktick === -1) continue;
+
+    // Extract the full css`...` expression
+    const beforeCss = result.slice(0, cssStart);
+    const cssExpr = result.slice(cssStart, endBacktick + 1);
+    const afterCss = result.slice(endBacktick + 1);
+
+    result = beforeCss + `__inspCss__(${cssExpr}, '${escapedPath}')` + afterCss;
+    needsHelper = true;
+  }
 
-    const { closeIdx, topLevelCommas } = callInfo;
+  if (needsHelper) {
+    result = INSP_CSS_HELPER + result;
+  }
 
-    // Single-arg call: add options as second arg.
-    if (topLevelCommas.length === 0) {
-      const inner = result.slice(afterParen, closeIdx);
-      const hasTrailingComma = /,\s*$/.test(inner);
-      result =
-        result.slice(0, closeIdx) +
-        (hasTrailingComma ? ` { path: '${escapedPath}' }` : `, { path: '${escapedPath}' }`) +
-        result.slice(closeIdx);
-      continue;
-    }
+  return result;
+};
+
+/**
+ * Inject `{ path: '<file-path>' }` into createStyles/createStaticStyles/createStylish calls.
+ *
+ * Rules:
+ * - One arg call: append second arg `{ path }`
+ * - Two+ arg call:
+ *   - if second arg is object literal and has no `path`, inject into object
+ *   - otherwise append third arg `{ path }` as a fallback
+ *
+ * Also wraps standalone `css` tagged templates with __inspCss__() for
+ * path tracking on SerializedStyles objects.
+ */
+const injectStylePath = (source, filePath, resourcePath = '') => {
+  const normalizedResourcePath = resourcePath.replace(/\\/g, '/');
 
-    // Two+ args: patch second arg when it's an object literal.
-    const secondStart = topLevelCommas[0] + 1;
-    const secondEnd = topLevelCommas[1] ?? closeIdx;
-    const secondArgRaw = result.slice(secondStart, secondEnd);
+  // Skip the style factory implementation files themselves.
+  if (
+    (normalizedResourcePath.includes('createStaticStyles') ||
+      normalizedResourcePath.includes('createStyles') ||
+      normalizedResourcePath.includes('createStyish') ||
+      normalizedResourcePath.includes('createGlobalStyle')) &&
+    (normalizedResourcePath.endsWith('index.ts') || normalizedResourcePath.endsWith('.ts') || normalizedResourcePath.endsWith('.tsx'))
+  ) {
+    // Still check if we should skip: only skip files inside the antd-style factories
+    if (normalizedResourcePath.includes('antd-style/factories/')) {
+      return source;
+    }
+  }
 
-    if (hasPathProperty(secondArgRaw)) continue;
+  let result = source;
 
-    const injectedSecondArg = injectPathIntoObjectLiteral(secondArgRaw, filePath);
-    if (injectedSecondArg !== null) {
-      result =
-        result.slice(0, secondStart) +
-        injectedSecondArg +
-        result.slice(secondEnd);
-      continue;
+  // 1. Inject { path } into createStaticStyles/createStyles/createStylish calls
+  CALL_RE.lastIndex = 0;
+  if (CALL_RE.test(result)) {
+    CALL_RE.lastIndex = 0;
+
+    const positions = [];
+    let match;
+    while ((match = CALL_RE.exec(result)) !== null) {
+      if (isInCommentOrString(result, match.index)) continue;
+      positions.push(match.index + match[0].length);
     }
 
-    // Fallback for non-object second args.
-    const inner = result.slice(afterParen, closeIdx);
-    const hasTrailingComma = /,\s*$/.test(inner);
-    result =
-      result.slice(0, closeIdx) +
-      (hasTrailingComma ? ` { path: '${escapedPath}' }` : `, { path: '${escapedPath}' }`) +
-      result.slice(closeIdx);
+    if (positions.length > 0) {
+      const escapedPath = escapePathValue(filePath);
+
+      for (let pi = positions.length - 1; pi >= 0; pi--) {
+        const afterParen = positions[pi];
+        const callInfo = findCallBoundaries(result, afterParen);
+        if (!callInfo) continue;
+
+        const { closeIdx, topLevelCommas } = callInfo;
+
+        // Single-arg call: add options as second arg.
+        if (topLevelCommas.length === 0) {
+          const inner = result.slice(afterParen, closeIdx);
+          const hasTrailingComma = /,\s*$/.test(inner);
+          result =
+            result.slice(0, closeIdx) +
+            (hasTrailingComma ? ` { path: '${escapedPath}' }` : `, { path: '${escapedPath}' }`) +
+            result.slice(closeIdx);
+          continue;
+        }
+
+        // Two+ args: patch second arg when it's an object literal.
+        const secondStart = topLevelCommas[0] + 1;
+        const secondEnd = topLevelCommas[1] ?? closeIdx;
+        const secondArgRaw = result.slice(secondStart, secondEnd);
+
+        if (hasPathProperty(secondArgRaw)) continue;
+
+        const injectedSecondArg = injectPathIntoObjectLiteral(secondArgRaw, filePath);
+        if (injectedSecondArg !== null) {
+          result =
+            result.slice(0, secondStart) +
+            injectedSecondArg +
+            result.slice(secondEnd);
+          continue;
+        }
+
+        // Fallback for non-object second args.
+        const inner = result.slice(afterParen, closeIdx);
+        const hasTrailingComma = /,\s*$/.test(inner);
+        result =
+          result.slice(0, closeIdx) +
+          (hasTrailingComma ? ` { path: '${escapedPath}' }` : `, { path: '${escapedPath}' }`) +
+          result.slice(closeIdx);
+      }
+    }
   }
 
+  // 2. Wrap standalone css tagged templates with __inspCss__()
+  result = wrapCssTaggedTemplates(result, filePath);
+
   return result;
 };