@thejaredwilcurt/csslop 0.0.38 → 0.0.40

package/src/value/transforms.js

@@ -2,6 +2,11 @@
  * @file Minifies CSS transform values by simplifying individual transform functions, collapsing axes, and removing identity components.
  */
 
+import {
+  findMatchingParenthesis,
+  splitTopLevelCommaList
+} from '../parser/source-search.js';
+
 import {
   normalizeScaleComponent,
   roundCompactNumber
@@ -17,41 +22,11 @@ function isZeroTransformValue (value) {
   return /^[-+]?0(?:[a-z%]+)?$/i.test(value.trim());
 }
 
-/**
- * Splits a CSS function's comma-separated argument string into an array, correctly handling nested parentheses.
- *
- * @param  {string} value  The raw arguments string inside the function parentheses.
- * @return {Array}         An array of trimmed argument strings.
- */
-function splitFunctionArguments (value) {
-  const parts = [];
-  let depth = 0;
-  let current = '';
-  for (const character of value) {
-    if (character === '(') {
-      depth++;
-    }
-    if (character === ')') {
-      depth--;
-    }
-    if (character === ',' && depth === 0) {
-      parts.push(current.trim());
-      current = '';
-    } else {
-      current += character;
-    }
-  }
-  if (current.trim() || parts.length) {
-    parts.push(current.trim());
-  }
-  return parts;
-}
-
 /**
  * Parses a CSS transform value string into an array of objects, each containing a function name and its raw arguments string.
  *
  * @param  {string}     value  The full CSS transform value string.
- * @return {Array|null}        An array of { name, args } objects, or null if the string cannot be parsed.
+ * @return {Array|null}        An array of { name, arguments } objects, or null if the string cannot be parsed.
  */
 function splitTransformFunctions (value) {
   const parts = [];
@@ -72,23 +47,15 @@ function splitTransformFunctions (value) {
     if (nameStart === position || value[position] !== '(') {
       return null;
     }
-    const name = value.slice(nameStart, position);
-    let depth = 1;
-    let end = position + 1;
-    while (end < value.length && depth > 0) {
-      if (value[end] === '(') {
-        depth++;
-      }
-      if (value[end] === ')') {
-        depth--;
-      }
-      end++;
-    }
-    if (depth !== 0) {
+    const closeIndex = findMatchingParenthesis(value, position);
+    if (closeIndex === -1) {
       return null;
     }
-    parts.push({ name, args: value.slice(position + 1, end - 1) });
-    position = end;
+    parts.push({
+      name: value.slice(nameStart, position),
+      argumentText: value.slice(position + 1, closeIndex)
+    });
+    position = closeIndex + 1;
   }
   return parts;
 }
@@ -96,13 +63,13 @@ function splitTransformFunctions (value) {
 /**
  * Minifies a single CSS transform function by simplifying 3D functions to 2D equivalents, collapsing redundant axes, and normalizing scale percentages.
  *
- * @param  {string} name  The transform function name (e.g. "translate3d", "scale").
- * @param  {string} args  The raw comma-separated arguments string.
- * @return {string}       The minified transform function call string.
+ * @param  {string} name          The transform function name (e.g. "translate3d", "scale").
+ * @param  {string} argumentText  The raw comma-separated arguments string.
+ * @return {string}               The minified transform function call string.
  */
-function minifyTransformFunction (name, args) {
+function minifyTransformFunction (name, argumentText) {
   const lowerName = name.toLowerCase();
-  const parts = splitFunctionArguments(args);
+  const parts = splitTopLevelCommaList(argumentText);
 
   if (lowerName === 'rotate' && parts.length === 1) {
     // Convert turn units to degrees (e.g. 0.5turn → 180deg)
@@ -214,8 +181,8 @@ function minifyTransformValue (value) {
   if (!functions) {
     return value;
   }
-  return functions.map(({ name, args }) => {
-    return minifyTransformFunction(name, args);
+  return functions.map(({ name, argumentText }) => {
+    return minifyTransformFunction(name, argumentText);
   }).join(' ');
 }
 

package/src/value/syntax.js

@@ -1,144 +0,0 @@
-/**
- * @file Provides syntax-aware CSS string scanning utilities.
- */
-
-/**
- * Finds the closing parenthesis for an opening parenthesis while respecting
- * nested parentheses and quoted strings.
- *
- * @param  {string} value           The CSS text being scanned.
- * @param  {number} openParenIndex  The index of the opening `(` character.
- * @return {number}                 The closing `)` index, or -1 if unmatched.
- */
-function findMatchingParenthesis (value, openParenIndex) {
-  let depth = 1;
-  let index = openParenIndex + 1;
-  let activeQuote = '';
-
-  while (index < value.length) {
-    const character = value[index];
-    if (activeQuote) {
-      if (character === '\\') {
-        index += 2;
-        continue;
-      }
-      if (character === activeQuote) {
-        activeQuote = '';
-      }
-      index++;
-      continue;
-    }
-
-    // An escaped character is data rather than a delimiter, even outside a
-    // quoted string, as in the `\)` of an unquoted url()
-    if (character === '\\') {
-      index += 2;
-      continue;
-    }
-
-    if (character === '"' || character === '\'') {
-      activeQuote = character;
-      index++;
-      continue;
-    }
-
-    if (character === '(') {
-      depth++;
-      index++;
-      continue;
-    }
-
-    if (character === ')') {
-      depth--;
-      if (depth === 0) {
-        return index;
-      }
-    }
-    index++;
-  }
-
-  return -1;
-}
-
-/**
- * Splits a CSS value into its top-level components, keeping parenthesized
- * function arguments and quoted strings intact. Components are separated by
- * whitespace, or by a `#`, which always starts a hash token and therefore ends
- * any component already in progress.
- *
- * For example, `rgb(0 0 0) red` yields `["rgb(0 0 0)", "red"]`, and the
- * minified `red#00f` yields `["red", "#00f"]`.
- *
- * @param  {string} value  The CSS value to split.
- * @return {Array}         The top-level components of the value.
- */
-function splitTopLevelComponents (value) {
-  const components = [];
-  let current = '';
-  let depth = 0;
-  let activeQuote = '';
-  let index = 0;
-
-  while (index < value.length) {
-    const character = value[index];
-
-    if (activeQuote) {
-      current += character;
-      if (character === '\\') {
-        current += value[index + 1] ?? '';
-        index += 2;
-        continue;
-      }
-      if (character === activeQuote) {
-        activeQuote = '';
-      }
-      index++;
-      continue;
-    }
-
-    if (character === '"' || character === '\'') {
-      activeQuote = character;
-      current += character;
-      index++;
-      continue;
-    }
-
-    if (character === '(') {
-      depth++;
-    }
-    if (character === ')' && depth > 0) {
-      depth--;
-    }
-
-    // Match any whitespace character, which separates components at depth zero
-    const isSeparator = depth === 0 && /\s/.test(character);
-    if (isSeparator) {
-      if (current) {
-        components.push(current);
-        current = '';
-      }
-      index++;
-      continue;
-    }
-
-    const startsHashToken = character === '#' && depth === 0 && current !== '';
-    if (startsHashToken) {
-      components.push(current);
-      current = '';
-    }
-
-    current += character;
-    index++;
-  }
-
-  if (current) {
-    components.push(current);
-  }
-
-  return components;
-}
-
-export {
-  findMatchingParenthesis,
-  splitTopLevelComponents
-};