@wix/zero-config-implementation 1.23.0 → 1.25.0

package/package.json

@@ -4,7 +4,7 @@
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
-  "version": "1.23.0",
+  "version": "1.25.0",
   "description": "Core library for extracting component manifests from JS and CSS files",
   "type": "module",
   "main": "dist/index.js",
@@ -83,5 +83,5 @@
       ]
     }
   },
-  "falconPackageHash": "93d5823d13acb8bb58ccf6bfebbbba2f1f65e9250a67b60a9204b722"
+  "falconPackageHash": "e76e4e02feadede0d8c9d011d32118218b349b5ab948a12605907e98"
 }

package/src/information-extractors/css/sass-adapter.ts

@@ -1,6 +1,21 @@
+import { existsSync } from 'node:fs'
 import { createRequire } from 'node:module'
+import { dirname, join } from 'node:path'
 import { Result, err } from 'neverthrow'
 
+function collectNodeModulesPaths(filePath: string): string[] {
+  const paths: string[] = []
+  let dir = dirname(filePath)
+  while (true) {
+    const candidate = join(dir, 'node_modules')
+    if (existsSync(candidate)) paths.push(candidate)
+    const parent = dirname(dir)
+    if (parent === dir) break
+    dir = parent
+  }
+  return paths
+}
+
 const require = createRequire(import.meta.url)
 
 export function compileSass(filePath: string): Result<string, Error> {
@@ -14,26 +29,11 @@ export function compileSass(filePath: string): Result<string, Error> {
       ),
     )
   }
+  const loadPaths = collectNodeModulesPaths(filePath)
   return Result.fromThrowable(
     () =>
       sass.compile(filePath, {
-        importers: [
-          {
-            // Return null for relative paths and built-in sass: modules so the
-            // built-in filesystem resolver handles them. For everything else
-            // (aliases, missing node_modules, etc.) silently return empty content
-            // rather than failing the whole compilation.
-            canonicalize(url: string): URL | null {
-              if (url.startsWith('.') || url.startsWith('/') || url.startsWith('sass:')) {
-                return null
-              }
-              return new URL(`empty-sass-import:${encodeURIComponent(url)}`)
-            },
-            load(): { contents: string; syntax: 'scss' } {
-              return { contents: '', syntax: 'scss' }
-            },
-          },
-        ],
+        loadPaths,
       }).css,
     (thrown) => (thrown instanceof Error ? thrown : new Error(String(thrown))),
   )()

package/src/information-extractors/react/extractors/css-properties.ts

@@ -5,6 +5,7 @@
  * based on its tag, role, and whether it has text content.
  */
 
+import { CSS_PROPERTIES } from '@wix/zero-config-schema'
 import type { CreateElementEvent, ReactExtractor } from './core/types'
 
 // ─────────────────────────────────────────────────────────────────────────────
@@ -62,41 +63,50 @@ const INTERACTIVE_TAGS = new Set(['button', 'input', 'textarea', 'select'])
 /**
  * CSS properties for Layout Containers and Interactive Elements
  */
+const { CSS_PROPERTY_TYPE } = CSS_PROPERTIES
+
 const CONTAINER_CSS_PROPERTIES = [
-  'background',
-  'border-block-start',
-  'border-block-end',
-  'border-inline-start',
-  'border-inline-end',
-  'padding-block-start',
-  'padding-block-end',
-  'padding-inline-start',
-  'padding-inline-end',
-  'border-start-start-radius',
-  'border-start-end-radius',
-  'border-end-start-radius',
-  'border-end-end-radius',
-  'box-shadow',
+  CSS_PROPERTY_TYPE.background,
+  CSS_PROPERTY_TYPE.borderTop,
+  CSS_PROPERTY_TYPE.borderBottom,
+  CSS_PROPERTY_TYPE.borderInlineStart,
+  CSS_PROPERTY_TYPE.borderInlineEnd,
+  CSS_PROPERTY_TYPE.paddingTop,
+  CSS_PROPERTY_TYPE.paddingBottom,
+  CSS_PROPERTY_TYPE.paddingInlineStart,
+  CSS_PROPERTY_TYPE.paddingInlineEnd,
+  CSS_PROPERTY_TYPE.borderStartStartRadius,
+  CSS_PROPERTY_TYPE.borderStartEndRadius,
+  CSS_PROPERTY_TYPE.borderEndStartRadius,
+  CSS_PROPERTY_TYPE.borderEndEndRadius,
+  CSS_PROPERTY_TYPE.boxShadow,
 ]
 
 /**
  * CSS properties for Text elements and leaf elements with textContent
  */
-const TEXT_CSS_PROPERTIES = ['font', 'line-height', 'letter-spacing', 'text-decoration']
+const TEXT_CSS_PROPERTIES = [
+  CSS_PROPERTY_TYPE.font,
+  CSS_PROPERTY_TYPE.lineHeight,
+  CSS_PROPERTY_TYPE.letterSpacing,
+  CSS_PROPERTY_TYPE.textDecorationLine,
+  CSS_PROPERTY_TYPE.textTransform,
+  CSS_PROPERTY_TYPE.color,
+]
 
 /**
  * CSS properties for Media elements (excluding svg)
  */
 const MEDIA_CSS_PROPERTIES = [
-  'border-block-start',
-  'border-block-end',
-  'border-inline-start',
-  'border-inline-end',
-  'border-start-start-radius',
-  'border-start-end-radius',
-  'border-end-start-radius',
-  'border-end-end-radius',
-  'box-shadow',
+  CSS_PROPERTY_TYPE.borderTop,
+  CSS_PROPERTY_TYPE.borderBottom,
+  CSS_PROPERTY_TYPE.borderInlineStart,
+  CSS_PROPERTY_TYPE.borderInlineEnd,
+  CSS_PROPERTY_TYPE.borderStartStartRadius,
+  CSS_PROPERTY_TYPE.borderStartEndRadius,
+  CSS_PROPERTY_TYPE.borderEndStartRadius,
+  CSS_PROPERTY_TYPE.borderEndEndRadius,
+  CSS_PROPERTY_TYPE.boxShadow,
 ]
 
 // ─────────────────────────────────────────────────────────────────────────────