@thejaredwilcurt/csslop 0.0.48 → 0.0.49

package/src/rules/selectors.js

@@ -33,6 +33,11 @@ const COMPOUND_SELECTOR_BOUNDARIES = '>+~ \t\n\r\f';
  * @return {number}               The index of the next top-level occurrence, or -1 if none remains.
  */
 function findNextFunctionCallOutsideStrings (text, functionCall, start) {
+  // A token that appears nowhere in the selector cannot appear at its top
+  // level either, and one search rules that out without walking every character
+  if (!text.toLowerCase().includes(functionCall)) {
+    return -1;
+  }
   let index = start;
   while (index < text.length) {
     const character = text[index];
@@ -655,6 +660,10 @@ function readWholeSelectorIsParts (selector) {
  * @return {Array}                        An array of one or more processed selector strings.
  */
 function processIsSelector (selector, hasSiblingSelectors) {
+  // Every rewrite below starts from an `:is(`, so a selector without one is left as it is
+  if (!selector.toLowerCase().includes(':is(')) {
+    return [selector];
+  }
   // Replace :is(:link,:visited) and :is(:visited,:link) with :any-link
   selector = selector.replace(/:is\(:link,:visited\)/g, ':any-link');
   selector = selector.replace(/:is\(:visited,:link\)/g, ':any-link');

package/src/rules/stringify.js

@@ -276,6 +276,143 @@ function stringifyAtRule (rule, context) {
   const separator = minifiedPrelude ? ' ' : '';
   return '@' + rule.name + separator + minifiedPrelude + '{' + body + '}';
 }
+
+/**
+ * Rewrites `:nth-*()` pseudo-classes into their shortest equivalent forms.
+ *
+ * @param  {string} selector  A selector with its whitespace already collapsed.
+ * @return {string}           The selector with simplified `:nth-*()` pseudo-classes.
+ */
+function simplifyNthPseudoClasses (selector) {
+  let minified = selector;
+  // Simplify :nth-child(2n+1) to :nth-child(odd)
+  minified = minified.replace(/:nth-child\(2n\s*\+\s*1\)/g, ':nth-child(odd)');
+  // Simplify :nth-child(2n+0) to :nth-child(2n)
+  minified = minified.replace(/:nth-child\(2n\s*\+\s*0\)/g, ':nth-child(2n)');
+  // Simplify :nth-child(1n) to :nth-child(n)
+  minified = minified.replace(/:nth-child\(1n\)/g, ':nth-child(n)');
+  // Remove unnecessary leading + sign from :nth-child()
+  minified = minified.replace(/:nth-child\(\+\s*(\d+)\)/g, ':nth-child($1)');
+  // Simplify :nth-child(0n+N) to :nth-child(N)
+  minified = minified.replace(/:nth-child\(0n\s*\+\s*(\d+)\)/g, ':nth-child($1)');
+  // Replace :nth-child(1) with :first-child
+  minified = minified.replace(/:nth-child\(1\)/g, ':first-child');
+  // Replace :nth-last-child(1) with :last-child
+  minified = minified.replace(/:nth-last-child\(1\)/g, ':last-child');
+  // Replace :nth-of-type(1) with :first-of-type
+  minified = minified.replace(/:nth-of-type\(1\)/g, ':first-of-type');
+  // Replace :nth-last-of-type(1) with :last-of-type
+  minified = minified.replace(/:nth-last-of-type\(1\)/g, ':last-of-type');
+  return minified;
+}
+
+/**
+ * Writes each attribute selector's value quoted or escaped, whichever is
+ * shorter, and removes the whitespace inside its brackets.
+ *
+ * @param  {string} selector  A selector with its whitespace already collapsed.
+ * @return {string}           The selector with minified attribute selectors.
+ */
+function minifyAttributeSelectors (selector) {
+  let minified = selector;
+  // Minify double-quoted attribute selectors: remove inner whitespace and escape when shorter
+  minified = minified.replace(/\[\s*([^=]+)\s*=\s*"(.*?)"\s*\]/g, (match, attribute, value) => {
+    // Escape special characters that require quoting (spaces, #, ., :, /, ;), and compare lengths
+    let escaped = value.replace(/([ #.:/;])/g, '\\$1');
+    if (escaped.length < value.length + 2) {
+      return '[' + attribute + '=' + escaped + ']';
+    }
+    return '[' + attribute + '="' + value + '"]';
+  });
+  // Minify single-quoted attribute selectors: remove inner whitespace and escape when shorter
+  minified = minified.replace(/\[\s*([^=]+)\s*=\s*'(.*?)'\s*\]/g, (match, attribute, value) => {
+    // Escape special characters that require quoting (spaces, #, ., :, /, ;), and compare lengths
+    let escaped = value.replace(/([ #.:/;])/g, '\\$1');
+    if (escaped.length < value.length + 2) {
+      return '[' + attribute + '=' + escaped + ']';
+    }
+    return '[' + attribute + '="' + value + '"]';
+  });
+  // Minify unquoted attribute selectors: quote when unescaping produces a shorter result
+  minified = minified.replace(/\[\s*([^=]+)\s*=\s*([^"'].*?)\s*\]/g, (match, attribute, value) => {
+    // Unescape special characters (spaces, #, ., :, /, ;) and compare with quoted form
+    let unescaped = value.replace(/\\([ #.:/;])/g, '$1');
+    if (unescaped.length + 2 < value.length) {
+      return '[' + attribute + '="' + unescaped + '"]';
+    }
+    return '[' + attribute + '=' + value + ']';
+  });
+  return minified;
+}
+
+/**
+ * Rewrites `:not()` pseudo-classes that negate a pseudo-class with a direct
+ * opposite, such as `:not(:enabled)`, into that opposite.
+ *
+ * @param  {string} selector  A selector with its whitespace already collapsed.
+ * @return {string}           The selector with simplified negations.
+ */
+function simplifyNegatedPseudoClasses (selector) {
+  let minified = selector;
+  // Minify logical combinations
+  // Replace :not(:invalid) with :valid, only directly after a form element type selector
+  minified = minified.replace(/(?<=\b(?:button|fieldset|form|input|select|textarea)):not\(:invalid\)/g, ':valid');
+  // Replace :not(:dir(ltr)) with :dir(rtl)
+  minified = minified.replace(/:not\(:dir\(ltr\)\)/g, ':dir(rtl)');
+  // Replace a double negation, :not(:not(X)), with the X it wraps
+  minified = minified.replace(/:not\(:not\((.*?)\)\)/g, '$1');
+  // Replace :not(:enabled) with :disabled
+  minified = minified.replace(/:not\(:enabled\)/g, ':disabled');
+  // Replace :not(:required) with :optional
+  minified = minified.replace(/:not\(:required\)/g, ':optional');
+  // Match a link element type selector at the start or after a combinator, with any attribute selectors and an optional :where( wrapper, followed by :not(:link)
+  minified = minified.replace(/(^|[\s,>+~])(a|area|link)(?:\[.*?\])*(?::where\()?:not\(:link\)\)?/g, (match) => {
+    return match.replace(':not(:link)', ':visited');
+  });
+  return minified;
+}
+
+/**
+ * Minifies a single selector's spacing, pseudo-classes, pseudo-elements, and
+ * attribute selectors. Most selectors hold none of the patterns a group of
+ * rewrites looks for, so each group only runs when its marker text is present.
+ *
+ * @param  {string} selector  A single selector from a rule's selector list.
+ * @return {string}           The minified selector.
+ */
+function minifySelector (selector) {
+  let minified = unescapeSelector(selector);
+  // Collapse whitespace to single space
+  minified = minified.replace(/\s+/g, ' ');
+  // Strip whitespace around selector combinators and commas
+  minified = minified.replace(/\s*([,>+~])\s*/g, '$1');
+  // Strip whitespace inside parentheses for pseudo-class arguments
+  minified = minified.replace(/\(\s+/g, '(').replace(/\s+\)/g, ')');
+  if (minified.includes(':nth-')) {
+    minified = simplifyNthPseudoClasses(minified);
+  }
+  if (minified.includes('::')) {
+    // Convert double-colon pseudo-elements to single-colon legacy form
+    minified = minified.replace(/::before/g, ':before');
+    minified = minified.replace(/::after/g, ':after');
+  }
+  if (minified.includes('*')) {
+    // Strip redundant universal selector `*` when it precedes an ID, class, or attribute selector
+    minified = minified.replace(/\*([#.[])/g, '$1');
+  }
+  if (minified.includes('[') && minified.includes('=')) {
+    minified = minifyAttributeSelectors(minified);
+  }
+  if (minified.includes(':not(')) {
+    minified = simplifyNegatedPseudoClasses(minified);
+  }
+  // Remove redundant leading "& " nesting selector
+  minified = minified.replace(/^& /, '');
+  minified = mergeAdjacentWherePseudoClasses(minified);
+  minified = minifyLanguageSelector(minified);
+  return minified;
+}
+
 /**
  * Converts a parsed CSS AST rule node into a minified CSS string, dispatching to specialized handlers for each rule type including selectors, `@media`, `@keyframes`, `@layer`, and other at-rules.
  *
@@ -305,82 +442,7 @@ function stringifyRule (rule, context) {
     if (rule.selectors?.length) {
       let uniqueSelectors = [...new Set(rule.selectors)];
       // Minify spacing within selectors (e.g. inside :is(), :where(), etc)
-      uniqueSelectors = uniqueSelectors.map((selector) => {
-        let minified = unescapeSelector(selector);
-        // Collapse whitespace to single space
-        minified = minified.replace(/\s+/g, ' ');
-        // Strip whitespace around selector combinators and commas
-        minified = minified.replace(/\s*([,>+~])\s*/g, '$1');
-        // Strip whitespace inside parentheses for pseudo-class arguments
-        minified = minified.replace(/\(\s+/g, '(').replace(/\s+\)/g, ')');
-        // Simplify :nth-child(2n+1) to :nth-child(odd)
-        minified = minified.replace(/:nth-child\(2n\s*\+\s*1\)/g, ':nth-child(odd)');
-        // Simplify :nth-child(2n+0) to :nth-child(2n)
-        minified = minified.replace(/:nth-child\(2n\s*\+\s*0\)/g, ':nth-child(2n)');
-        // Simplify :nth-child(1n) to :nth-child(n)
-        minified = minified.replace(/:nth-child\(1n\)/g, ':nth-child(n)');
-        // Remove unnecessary leading + sign from :nth-child()
-        minified = minified.replace(/:nth-child\(\+\s*(\d+)\)/g, ':nth-child($1)');
-        // Simplify :nth-child(0n+N) to :nth-child(N)
-        minified = minified.replace(/:nth-child\(0n\s*\+\s*(\d+)\)/g, ':nth-child($1)');
-        // Replace :nth-child(1) with :first-child
-        minified = minified.replace(/:nth-child\(1\)/g, ':first-child');
-        // Replace :nth-last-child(1) with :last-child
-        minified = minified.replace(/:nth-last-child\(1\)/g, ':last-child');
-        // Replace :nth-of-type(1) with :first-of-type
-        minified = minified.replace(/:nth-of-type\(1\)/g, ':first-of-type');
-        // Replace :nth-last-of-type(1) with :last-of-type
-        minified = minified.replace(/:nth-last-of-type\(1\)/g, ':last-of-type');
-        // Convert double-colon pseudo-elements to single-colon legacy form
-        minified = minified.replace(/::before/g, ':before');
-        minified = minified.replace(/::after/g, ':after');
-
-        // Strip redundant universal selector `*` when it precedes an ID, class, or attribute selector
-        minified = minified.replace(/\*([#.[])/g, '$1');
-
-        // Minify double-quoted attribute selectors: remove inner whitespace and escape when shorter
-        minified = minified.replace(/\[\s*([^=]+)\s*=\s*"(.*?)"\s*\]/g, (match, attribute, value) => {
-          // Escape special characters that require quoting (spaces, #, ., :, /, ;), and compare lengths
-          let escaped = value.replace(/([ #.:/;])/g, '\\$1');
-          if (escaped.length < value.length + 2) {
-            return '[' + attribute + '=' + escaped + ']';
-          }
-          return '[' + attribute + '="' + value + '"]';
-        });
-        // Minify single-quoted attribute selectors: remove inner whitespace and escape when shorter
-        minified = minified.replace(/\[\s*([^=]+)\s*=\s*'(.*?)'\s*\]/g, (match, attribute, value) => {
-          // Escape special characters that require quoting (spaces, #, ., :, /, ;), and compare lengths
-          let escaped = value.replace(/([ #.:/;])/g, '\\$1');
-          if (escaped.length < value.length + 2) {
-            return '[' + attribute + '=' + escaped + ']';
-          }
-          return '[' + attribute + '="' + value + '"]';
-        });
-        // Minify unquoted attribute selectors: quote when unescaping produces a shorter result
-        minified = minified.replace(/\[\s*([^=]+)\s*=\s*([^"'].*?)\s*\]/g, (match, attribute, value) => {
-          // Unescape special characters (spaces, #, ., :, /, ;) and compare with quoted form
-          let unescaped = value.replace(/\\([ #.:/;])/g, '$1');
-          if (unescaped.length + 2 < value.length) {
-            return '[' + attribute + '="' + unescaped + '"]';
-          }
-          return '[' + attribute + '=' + value + ']';
-        });
-
-        // Minify logical combinations
-        minified = minified.replace(/(?<=\b(?:button|fieldset|form|input|select|textarea)):not\(:invalid\)/g, ':valid');
-        minified = minified.replace(/:not\(:dir\(ltr\)\)/g, ':dir(rtl)');
-        minified = minified.replace(/:not\(:not\((.*?)\)\)/g, '$1');
-        minified = minified.replace(/:not\(:enabled\)/g, ':disabled');
-        minified = minified.replace(/:not\(:required\)/g, ':optional');
-        minified = minified.replace(/(^|[\s,>+~])(a|area|link)(?:\[.*?\])*(?::where\()?:not\(:link\)\)?/g, (match) => {
-          return match.replace(':not(:link)', ':visited');
-        });
-        // Remove redundant leading "& " nesting selector
-        minified = minified.replace(/^& /, '');
-        minified = mergeAdjacentWherePseudoClasses(minified);
-        minified = minifyLanguageSelector(minified);
-        return minified;
-      });
+      uniqueSelectors = uniqueSelectors.map(minifySelector);
       uniqueSelectors = combineLegacyAnySelectors(uniqueSelectors);
       // When this rule is a nesting parent, its whole selector list is treated
       // as :is() for the children's specificity, so a top-level :is() can be

package/src/utilities.js

@@ -19,19 +19,6 @@ function resolveUnicodeEscape (hex) {
   return String.fromCodePoint(codePoint);
 }
 
-/**
- * Escapes special regex metacharacters in a string so it can be safely used
- * as a literal pattern in a RegExp constructor.
- *
- * @param  {string} input  The string to escape.
- * @return {string}        The escaped string safe for use in a RegExp.
- */
-function escapeRegexString (input) {
-  // Escape all regex metacharacters: . * + ? ^ $ { } ( ) | [ ] backslash
-  return input.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-}
-
 export {
-  escapeRegexString,
   resolveUnicodeEscape
 };

package/src/value/minify.js

@@ -7,6 +7,7 @@ import {
   findMatchingParenthesis,
   skipParenthesizedGroup,
   skipQuotedString,
+  splitTopLevelComponents,
   startsUrlToken
 } from '../parser/source-search.js';
 import { tokenizeCssValue } from '../parser/tokenizer.js';
@@ -1606,7 +1607,12 @@ function applyPropertyOptimizations (val, property, urlTokens) {
   // Shorthands: margin, padding, border-width, border-style, border-color, inset
   // Check if property supports box-model shorthand collapsing (4 → 3 → 2 → 1 values)
   if (/^(margin|padding|inset|border-width|border-style|border-color|gap|overflow)$/.test(property)) {
-    val = collapseShorthandParts(val.split(' ')).join(' ');
+    // Split components instead of splitting on spaces, so values that legally
+    // touch, like the adjacent hex colors of `#ddd#ddd`, count separately
+    val = collapseShorthandParts(splitTopLevelComponents(val))
+      .join(' ')
+      // A hash token may touch the component before it, so the separator space is not needed
+      .replace(/ #/g, '#');
   }
 
   if (property === 'hyphenate-limit-chars') {
@@ -1760,12 +1766,25 @@ function computeMinifiedValue (declaration) {
  * Memoizes minified values for the current stylesheet. Minification runs many
  * passes over the same declarations (deduplication, shorthand assembly,
  * CSS-wide keyword hoisting, stringification), and the result only depends on
- * the declaration fields that make up the cache key, so each distinct
+ * the declaration's property, its value, and whether it is an assembled
+ * shorthand, so each distinct
  * property/value pair is minified once per stylesheet.
  *
- * @type {Map<string, string>}
+ * Values are filed under their property first, and assembled shorthands are
+ * kept apart from authored declarations, so a lookup reuses the property and
+ * value strings as they are instead of building a combined key on every call.
+ *
+ * @type {Map<string, Map<string, string>>}
  */
-const minifiedValueCache = new Map();
+const minifiedValuesByProperty = new Map();
+
+/**
+ * The memoized values of shorthands the minifier assembled itself, filed the
+ * same way as `minifiedValuesByProperty`.
+ *
+ * @type {Map<string, Map<string, string>>}
+ */
+const assembledMinifiedValuesByProperty = new Map();
 
 /**
  * Discards every memoized value. The minifier calls this at the start of each
@@ -1773,20 +1792,27 @@ const minifiedValueCache = new Map();
  * the cache should not outlive the pass that filled it.
  */
 function clearMinifiedValueCache () {
-  minifiedValueCache.clear();
+  minifiedValuesByProperty.clear();
+  assembledMinifiedValuesByProperty.clear();
 }
 
 /**
- * Builds the cache key for a declaration from every field the value minifier
- * reads. A null character cannot appear in a property name or in a parsed CSS
- * value, so it safely delimits the parts.
+ * Finds the memoized values for a declaration's property, creating the empty
+ * collection the first time the property is seen.
  *
- * @param  {object} declaration  The CSS declaration object.
- * @return {string}              The cache key.
- */
-function createMinifiedValueCacheKey (declaration) {
-  const assembledFlag = declaration.isAssembledShorthand ? '1' : '0';
-  return declaration.property + '\u0000' + assembledFlag + '\u0000' + declaration.value;
+ * @param  {object}              declaration  The CSS declaration object.
+ * @return {Map<string, string>}              Map of value to its minified form for that property.
+ */
+function getMinifiedValuesForProperty (declaration) {
+  const valuesByProperty = declaration.isAssembledShorthand ?
+    assembledMinifiedValuesByProperty :
+    minifiedValuesByProperty;
+  let minifiedValues = valuesByProperty.get(declaration.property);
+  if (!minifiedValues) {
+    minifiedValues = new Map();
+    valuesByProperty.set(declaration.property, minifiedValues);
+  }
+  return minifiedValues;
 }
 
 /**
@@ -1802,13 +1828,13 @@ function minifyValue (declaration) {
   if (typeof declaration.value !== 'string') {
     return computeMinifiedValue(declaration);
   }
-  const cacheKey = createMinifiedValueCacheKey(declaration);
-  const cachedValue = minifiedValueCache.get(cacheKey);
+  const minifiedValues = getMinifiedValuesForProperty(declaration);
+  const cachedValue = minifiedValues.get(declaration.value);
   if (cachedValue !== undefined) {
     return cachedValue;
   }
   const minifiedValue = computeMinifiedValue(declaration);
-  minifiedValueCache.set(cacheKey, minifiedValue);
+  minifiedValues.set(declaration.value, minifiedValue);
   return minifiedValue;
 }