chaincss 1.12.8 → 1.12.11

package/browser/commonProps.js

@@ -0,0 +1,14 @@
+export const COMMON_CSS_PROPERTIES = [
+  'color', 'background', 'background-color', 'background-image', 'background-size',
+  'margin', 'margin-top', 'margin-right', 'margin-bottom', 'margin-left',
+  'padding', 'padding-top', 'padding-right', 'padding-bottom', 'padding-left',
+  'border', 'border-radius', 'border-width', 'border-style', 'border-color',
+  'display', 'position', 'top', 'left', 'right', 'bottom',
+  'width', 'height', 'max-width', 'min-width', 'max-height', 'min-height',
+  'font-size', 'font-weight', 'font-family', 'font-style', 'line-height',
+  'text-align', 'text-decoration', 'text-transform', 'letter-spacing',
+  'opacity', 'z-index', 'overflow', 'cursor', 'pointer-events',
+  'transition', 'transform', 'animation', 'animation-duration', 'animation-timing-function',
+  'flex', 'grid', 'gap', 'justify-content', 'align-items', 'flex-direction',
+  'box-shadow', 'outline', 'filter', 'backdrop-filter'
+]

package/browser/rtt.js

@@ -1,16 +1,42 @@
 import { tokens, createTokens, responsive } from '../shared/tokens.mjs';
 
-let cssProperties = [];
+let cachedProperties = null;
 
 const loadCSSProperties = async () => {
+  // Return cached if already loaded
+  if (cachedProperties !== null) {
+    return cachedProperties;
+  }
+  // Try CDN first (only once)
   try {
-    const module = await import('../node/css-properties.json', { 
-      assert: { type: 'json' }
+    const controller = new AbortController();
+    const timeoutId = setTimeout(() => controller.abort(), 3000); // 3 second timeout
+    
+    const response = await fetch('https://raw.githubusercontent.com/mdn/data/main/css/properties.json', {
+      signal: controller.signal
     });
-    return module.default;
-  } catch (e) {
-    console.log('CSS properties file not found in package, will fetch from CDN');
-    return null;
+    clearTimeout(timeoutId);
+    
+    if (response.ok) {
+      const data = await response.json();
+      const allProperties = Object.keys(data);
+      const baseProperties = new Set();
+      
+      allProperties.forEach(prop => {
+        const baseProp = prop.replace(/^-(webkit|moz|ms|o)-/, '');
+        baseProperties.add(baseProp);
+      });
+      
+      cachedProperties = Array.from(baseProperties).sort();
+      console.log(`✅ Loaded ${cachedProperties.length} CSS properties from CDN`);
+      return cachedProperties;
+    }
+  } catch (error) {
+    console.log('CDN failed, using fallback CSS property list');
+    // Use hardcoded fallback (always works)
+    const { COMMON_CSS_PROPERTIES } = await import('./commonProps.js');
+    cachedProperties = COMMON_CSS_PROPERTIES;
+    return cachedProperties;
   }
 };
 
@@ -23,35 +49,18 @@ const chain = {
       return;
     }
     
-    const localProperties = await loadCSSProperties();
-    if (localProperties && localProperties.length > 0) {
-      this.cachedValidProperties = localProperties;
-      return;
-    }
-    
-    try {
-      console.log('Loading CSS properties from CDN...');
-      const response = await fetch('https://raw.githubusercontent.com/mdn/data/main/css/properties.json');
-      const data = await response.json();
-      const allProperties = Object.keys(data);
-      
-      const baseProperties = new Set();
-      allProperties.forEach(prop => {
-        const baseProp = prop.replace(/^-(webkit|moz|ms|o)-/, '');
-        baseProperties.add(baseProp);
-      });
-      this.cachedValidProperties = Array.from(baseProperties).sort();
-    } catch (error) {
-      console.error('Error loading from CDN:', error);
-      this.cachedValidProperties = [];
-    }
+    const properties = await loadCSSProperties();
+    this.cachedValidProperties = properties;
   },
   getCachedProperties() {
     return this.cachedValidProperties;
   }
 };
 
-chain.initializeProperties();
+// Start initialization (non-blocking)
+chain.initializeProperties().catch(err => {
+  console.error('Failed to load CSS properties:', err.message);
+});
 
 const resolveToken = (value, useTokens) => {
   if (!useTokens || typeof value !== 'string' || !value.startsWith('$')) {
@@ -66,75 +75,229 @@ const resolveToken = (value, useTokens) => {
 };
 
 function $(useTokens = true) {
-  const regularStyles = {};
-  const hoverStyles = {};
-  let isBuildingHover = false;
-  
+  const catcher = {};
   const validProperties = chain.cachedValidProperties;
   
-  // Create the main proxy
-  const createProxy = () => {
-    const handler = {
-      get: (target, prop) => {
-        // Handle .block()
-        if (prop === 'block') {
-          return (...args) => {
-            const result = { ...regularStyles };
-            
-            // Add hover styles if any exist
-            if (Object.keys(hoverStyles).length > 0) {
-              result.hover = { ...hoverStyles };
-            }
-            
-            if (args.length > 0) {
-              result.selectors = args;
-            }
-            
-            // Clear for next use
-            Object.keys(regularStyles).forEach(key => delete regularStyles[key]);
-            Object.keys(hoverStyles).forEach(key => delete hoverStyles[key]);
-            isBuildingHover = false;
-            
+  const handler = {
+    get: (target, prop) => {
+      if (prop === 'block') {
+        return function(...args) {
+          if (args.length === 0) {
+            const result = { ...catcher };
+            Object.keys(catcher).forEach(key => delete catcher[key]);
             return result;
+          }
+          const result = {
+            selectors: args,
+            ...catcher
           };
-        }
-        
-        // Handle .hover()
-        if (prop === 'hover') {
-          return () => {
-            isBuildingHover = true;
-            return proxy; // Return the same proxy, just with hover mode on
-          };
-        }
+          Object.keys(catcher).forEach(key => delete catcher[key]);
+          return result;
+        };
+      }
 
-        if(prop==='end'){
-          return () => {
-            isBuildingHover = false;
-            return proxy; // Return the same proxy, but end of hover mode
+      if (prop === 'hover') {
+        return () => {
+          const hoverCatcher = {};
+          const hoverHandler = {
+            get: (hoverTarget, hoverProp) => {
+              if (hoverProp === 'end') {
+                return () => {
+                  catcher.hover = { ...hoverCatcher };
+                  Object.keys(hoverCatcher).forEach(key => delete hoverCatcher[key]);
+                  return proxy;
+                };
+              }
+              const cssProperty = hoverProp.replace(/([A-Z])/g, '-$1').toLowerCase();
+              if (validProperties && validProperties.length > 0 && !validProperties.includes(cssProperty)) {
+                console.warn(`Warning: '${cssProperty}' may not be a valid CSS property`);
+              }
+              return (value) => {
+                hoverCatcher[hoverProp] = resolveToken(value, useTokens);
+                return hoverProxy;
+              };
+            }
           };
-        }
-        
-        // Handle regular CSS properties
-        const cssProperty = prop.replace(/([A-Z])/g, '-$1').toLowerCase();
-        if (validProperties && validProperties.length > 0 && !validProperties.includes(cssProperty)) {
-          console.warn(`Warning: '${cssProperty}' may not be a valid CSS property`);
-        }
-        
-        return (value) => {
-          if (isBuildingHover) {
-            hoverStyles[prop] = resolveToken(value, useTokens);
-          } else {
-            regularStyles[prop] = resolveToken(value, useTokens);
-          }
+          const hoverProxy = new Proxy({}, hoverHandler);
+          return hoverProxy;
+        };
+      }
+
+      if (prop === 'end') {
+        return () => {
           return proxy;
         };
       }
-    };
-    
-    return new Proxy({}, handler);
+
+      if (prop === 'select') {
+        return function(selector) {
+          const props = {};
+          const selectorProxy = new Proxy({}, {
+            get: (target, methodProp) => {
+              if (methodProp === 'block') {
+                return function() {
+                  return {
+                    selectors: [selector],
+                    ...props
+                  };
+                };
+              }
+              return function(value) {
+                props[methodProp] = resolveToken(value, useTokens);
+                return selectorProxy;
+              };
+            }
+          });
+          return selectorProxy;
+        };
+      }
+
+      // At-Rules
+      if (prop === 'media') {
+        return function(query, callback) {
+          const subChain = $(useTokens);
+          const result = callback(subChain);
+          if (!catcher.atRules) catcher.atRules = [];
+          catcher.atRules.push({
+            type: 'media',
+            query: query,
+            styles: result
+          });
+          return proxy;
+        };
+      }
+
+      if (prop === 'keyframes') {
+        return function(name, callback) {
+          const keyframeContext = { _keyframeSteps: {} };
+          const keyframeProxy = new Proxy(keyframeContext, {
+            get: (target, stepProp) => {
+              if (stepProp === 'from' || stepProp === 'to') {
+                return function(stepCallback) {
+                  const subChain = $(useTokens);
+                  const properties = stepCallback(subChain).block();
+                  target._keyframeSteps[stepProp] = properties;
+                  return keyframeProxy;
+                };
+              }
+              if (stepProp === 'percent') {
+                return function(value, stepCallback) {
+                  const subChain = $(useTokens);
+                  const properties = stepCallback(subChain).block();
+                  target._keyframeSteps[`${value}%`] = properties;
+                  return keyframeProxy;
+                };
+              }
+              return undefined;
+            }
+          });
+          callback(keyframeProxy);
+          if (!catcher.atRules) catcher.atRules = [];
+          catcher.atRules.push({
+            type: 'keyframes',
+            name: name,
+            steps: keyframeContext._keyframeSteps
+          });
+          return proxy;
+        };
+      }
+
+      if (prop === 'fontFace') {
+        return function(callback) {
+          const subChain = $(useTokens);
+          const fontProps = callback(subChain).block();
+          if (!catcher.atRules) catcher.atRules = [];
+          catcher.atRules.push({
+            type: 'font-face',
+            properties: fontProps
+          });
+          return proxy;
+        };
+      }
+
+      if (prop === 'supports') {
+        return function(condition, callback) {
+          const subChain = $(useTokens);
+          const styles = callback(subChain);
+          if (!catcher.atRules) catcher.atRules = [];
+          catcher.atRules.push({
+            type: 'supports',
+            condition: condition,
+            styles: styles
+          });
+          return proxy;
+        };
+      }
+
+      if (prop === 'container') {
+        return function(condition, callback) {
+          const subChain = $(useTokens);
+          const styles = callback(subChain);
+          if (!catcher.atRules) catcher.atRules = [];
+          catcher.atRules.push({
+            type: 'container',
+            condition: condition,
+            styles: styles
+          });
+          return proxy;
+        };
+      }
+
+      if (prop === 'layer') {
+        return function(name, callback) {
+          const subChain = $(useTokens);
+          const styles = callback(subChain);
+          if (!catcher.atRules) catcher.atRules = [];
+          catcher.atRules.push({
+            type: 'layer',
+            name: name,
+            styles: styles
+          });
+          return proxy;
+        };
+      }
+
+      if (prop === 'counterStyle') {
+        return function(name, callback) {
+          const subChain = $(useTokens);
+          const properties = callback(subChain).block();
+          if (!catcher.atRules) catcher.atRules = [];
+          catcher.atRules.push({
+            type: 'counter-style',
+            name: name,
+            properties: properties
+          });
+          return proxy;
+        };
+      }
+
+      if (prop === 'property') {
+        return function(name, callback) {
+          const subChain = $(useTokens);
+          const descriptors = callback(subChain).block();
+          if (!catcher.atRules) catcher.atRules = [];
+          catcher.atRules.push({
+            type: 'property',
+            name: name,
+            descriptors: descriptors
+          });
+          return proxy;
+        };
+      }
+
+      const cssProperty = prop.replace(/([A-Z])/g, '-$1').toLowerCase();
+      if (validProperties && validProperties.length > 0 && !validProperties.includes(cssProperty)) {
+        console.warn(`Warning: '${cssProperty}' may not be a valid CSS property`);
+      }
+      
+      return function(value) {
+        catcher[prop] = resolveToken(value, useTokens);
+        return proxy;
+      };
+    }
   };
   
-  const proxy = createProxy();
+  const proxy = new Proxy({}, handler);
   return proxy;
 }
 
@@ -166,34 +329,29 @@ const compile = (obj) => {
       
       // Generate normal styles
       let normalCSS = '';
-      let hoverCSS = '';
-      
       for (let prop in element) {
         if (element.hasOwnProperty(prop) && prop !== 'selectors' && prop !== 'hover') {
           const kebabKey = prop.replace(/([A-Z])/g, '-$1').toLowerCase();
           normalCSS += `  ${kebabKey}: ${element[prop]};\n`;
         }
       }
+      if (normalCSS) {
+        cssString += `${selectors.join(', ')} {\n${normalCSS}}\n`;
+      }
       
-      // Generate hover styles if present
+      // Generate hover styles
       if (element.hover && typeof element.hover === 'object') {
+        let hoverCSS = '';
         for (let prop in element.hover) {
-          if (element.hover.hasOwnProperty(prop)) {
+          if (element.hover.hasOwnProperty(prop) && prop !== 'selectors') {
             const kebabKey = prop.replace(/([A-Z])/g, '-$1').toLowerCase();
             hoverCSS += `  ${kebabKey}: ${element.hover[prop]};\n`;
           }
         }
-      }
-      
-      // Add normal styles
-      if (normalCSS) {
-        cssString += `${selectors.join(', ')} {\n${normalCSS}}\n`;
-      }
-      
-      // Add hover styles as separate rule
-      if (hoverCSS) {
-        const hoverSelectors = selectors.map(s => `${s}:hover`);
-        cssString += `${hoverSelectors.join(', ')} {\n${hoverCSS}}\n`;
+        if (hoverCSS) {
+          const hoverSelectors = selectors.map(s => `${s}:hover`);
+          cssString += `${hoverSelectors.join(', ')} {\n${hoverCSS}}\n`;
+        }
       }
     }
   }

package/node/chaincss.js

@@ -345,12 +345,9 @@ const processor = async (inputFile, outputFile) => {
   try {
     const input = path.resolve(inputFile);
     const outputDir = path.resolve(outputFile);
-    //console.log('const output = path.resolve(outputFile) : ',output);
-    //const outputDir = path.dirname(output);
     if (!fs.existsSync(outputDir)) {
       fs.mkdirSync(outputDir, { recursive: true });
     }
-    console.log('const outputDir = path.dirname(output) : ',outputDir);
     const content = fs.readFileSync(input, 'utf8');
     const processedCSS = processJavascriptBlocks(content, input);
     if (!validateCSS(processedCSS)) {
@@ -360,11 +357,9 @@ const processor = async (inputFile, outputFile) => {
     const result = await processAndMinifyCss(processedCSS, input, stylePath);
     if (result.css) {
       fs.writeFileSync(stylePath, result.css, 'utf8');
-      console.log(`✅ CSS compiled successfully: ${stylePath}`);
       if (result.map) {
         const mapFile = `${stylePath}.map`;
         fs.writeFileSync(mapFile, result.map, 'utf8');
-        console.log(`✅ Source map: ${mapFile}`);
       }
       
       // ========== ATOMIC CLASS MAP GENERATION ==========

package/node/css-properties.json

@@ -0,0 +1,633 @@
+[
+  "--*",
+  "accelerator",
+  "accent-color",
+  "align-content",
+  "align-items",
+  "align-self",
+  "align-tracks",
+  "alignment-baseline",
+  "all",
+  "anchor-name",
+  "anchor-scope",
+  "animation",
+  "animation-composition",
+  "animation-delay",
+  "animation-direction",
+  "animation-duration",
+  "animation-fill-mode",
+  "animation-iteration-count",
+  "animation-name",
+  "animation-play-state",
+  "animation-range",
+  "animation-range-end",
+  "animation-range-start",
+  "animation-timeline",
+  "animation-timing-function",
+  "animation-trigger",
+  "appearance",
+  "aspect-ratio",
+  "backdrop-filter",
+  "backface-visibility",
+  "background",
+  "background-attachment",
+  "background-blend-mode",
+  "background-clip",
+  "background-color",
+  "background-image",
+  "background-origin",
+  "background-position",
+  "background-position-x",
+  "background-position-y",
+  "background-repeat",
+  "background-size",
+  "baseline-shift",
+  "baseline-source",
+  "binding",
+  "block-progression",
+  "block-size",
+  "border",
+  "border-before",
+  "border-before-color",
+  "border-before-style",
+  "border-before-width",
+  "border-block",
+  "border-block-color",
+  "border-block-end",
+  "border-block-end-color",
+  "border-block-end-style",
+  "border-block-end-width",
+  "border-block-start",
+  "border-block-start-color",
+  "border-block-start-style",
+  "border-block-start-width",
+  "border-block-style",
+  "border-block-width",
+  "border-bottom",
+  "border-bottom-color",
+  "border-bottom-colors",
+  "border-bottom-left-radius",
+  "border-bottom-right-radius",
+  "border-bottom-style",
+  "border-bottom-width",
+  "border-collapse",
+  "border-color",
+  "border-end-end-radius",
+  "border-end-start-radius",
+  "border-image",
+  "border-image-outset",
+  "border-image-repeat",
+  "border-image-slice",
+  "border-image-source",
+  "border-image-width",
+  "border-inline",
+  "border-inline-color",
+  "border-inline-end",
+  "border-inline-end-color",
+  "border-inline-end-style",
+  "border-inline-end-width",
+  "border-inline-start",
+  "border-inline-start-color",
+  "border-inline-start-style",
+  "border-inline-start-width",
+  "border-inline-style",
+  "border-inline-width",
+  "border-left",
+  "border-left-color",
+  "border-left-colors",
+  "border-left-style",
+  "border-left-width",
+  "border-radius",
+  "border-right",
+  "border-right-color",
+  "border-right-colors",
+  "border-right-style",
+  "border-right-width",
+  "border-spacing",
+  "border-start-end-radius",
+  "border-start-start-radius",
+  "border-style",
+  "border-top",
+  "border-top-color",
+  "border-top-colors",
+  "border-top-left-radius",
+  "border-top-right-radius",
+  "border-top-style",
+  "border-top-width",
+  "border-width",
+  "bottom",
+  "box-align",
+  "box-decoration-break",
+  "box-direction",
+  "box-flex",
+  "box-flex-group",
+  "box-lines",
+  "box-ordinal-group",
+  "box-orient",
+  "box-pack",
+  "box-reflect",
+  "box-shadow",
+  "box-sizing",
+  "break-after",
+  "break-before",
+  "break-inside",
+  "caption-side",
+  "caret",
+  "caret-animation",
+  "caret-color",
+  "caret-shape",
+  "clear",
+  "clip",
+  "clip-path",
+  "clip-rule",
+  "color",
+  "color-interpolation-filters",
+  "color-scheme",
+  "column-count",
+  "column-fill",
+  "column-gap",
+  "column-height",
+  "column-rule",
+  "column-rule-color",
+  "column-rule-style",
+  "column-rule-width",
+  "column-span",
+  "column-width",
+  "column-wrap",
+  "columns",
+  "contain",
+  "contain-intrinsic-block-size",
+  "contain-intrinsic-height",
+  "contain-intrinsic-inline-size",
+  "contain-intrinsic-size",
+  "contain-intrinsic-width",
+  "container",
+  "container-name",
+  "container-type",
+  "content",
+  "content-visibility",
+  "content-zoom-chaining",
+  "content-zoom-limit",
+  "content-zoom-limit-max",
+  "content-zoom-limit-min",
+  "content-zoom-snap",
+  "content-zoom-snap-points",
+  "content-zoom-snap-type",
+  "content-zooming",
+  "context-properties",
+  "corner-block-end-shape",
+  "corner-block-start-shape",
+  "corner-bottom-left-shape",
+  "corner-bottom-right-shape",
+  "corner-bottom-shape",
+  "corner-end-end-shape",
+  "corner-end-start-shape",
+  "corner-inline-end-shape",
+  "corner-inline-start-shape",
+  "corner-left-shape",
+  "corner-right-shape",
+  "corner-shape",
+  "corner-start-end-shape",
+  "corner-start-start-shape",
+  "corner-top-left-shape",
+  "corner-top-right-shape",
+  "corner-top-shape",
+  "counter-increment",
+  "counter-reset",
+  "counter-set",
+  "cursor",
+  "cx",
+  "cy",
+  "d",
+  "direction",
+  "display",
+  "dominant-baseline",
+  "dynamic-range-limit",
+  "empty-cells",
+  "field-sizing",
+  "fill",
+  "fill-opacity",
+  "fill-rule",
+  "filter",
+  "flex",
+  "flex-basis",
+  "flex-direction",
+  "flex-flow",
+  "flex-grow",
+  "flex-shrink",
+  "flex-wrap",
+  "float",
+  "float-edge",
+  "flood-color",
+  "flood-opacity",
+  "flow-from",
+  "flow-into",
+  "font",
+  "font-family",
+  "font-feature-settings",
+  "font-kerning",
+  "font-language-override",
+  "font-optical-sizing",
+  "font-palette",
+  "font-size",
+  "font-size-adjust",
+  "font-smooth",
+  "font-stretch",
+  "font-style",
+  "font-synthesis",
+  "font-synthesis-position",
+  "font-synthesis-small-caps",
+  "font-synthesis-style",
+  "font-synthesis-weight",
+  "font-variant",
+  "font-variant-alternates",
+  "font-variant-caps",
+  "font-variant-east-asian",
+  "font-variant-emoji",
+  "font-variant-ligatures",
+  "font-variant-numeric",
+  "font-variant-position",
+  "font-variation-settings",
+  "font-weight",
+  "font-width",
+  "force-broken-image-icon",
+  "forced-color-adjust",
+  "gap",
+  "grid",
+  "grid-area",
+  "grid-auto-columns",
+  "grid-auto-flow",
+  "grid-auto-rows",
+  "grid-column",
+  "grid-column-end",
+  "grid-column-gap",
+  "grid-column-start",
+  "grid-columns",
+  "grid-gap",
+  "grid-row",
+  "grid-row-end",
+  "grid-row-gap",
+  "grid-row-start",
+  "grid-rows",
+  "grid-template",
+  "grid-template-areas",
+  "grid-template-columns",
+  "grid-template-rows",
+  "hanging-punctuation",
+  "height",
+  "high-contrast-adjust",
+  "hyphenate-character",
+  "hyphenate-limit-chars",
+  "hyphenate-limit-lines",
+  "hyphenate-limit-zone",
+  "hyphens",
+  "image-orientation",
+  "image-rendering",
+  "image-resolution",
+  "ime-align",
+  "ime-mode",
+  "initial-letter",
+  "initial-letter-align",
+  "inline-size",
+  "inset",
+  "inset-block",
+  "inset-block-end",
+  "inset-block-start",
+  "inset-inline",
+  "inset-inline-end",
+  "inset-inline-start",
+  "interactivity",
+  "interest-delay",
+  "interest-delay-end",
+  "interest-delay-start",
+  "interpolate-size",
+  "isolation",
+  "justify-content",
+  "justify-items",
+  "justify-self",
+  "justify-tracks",
+  "left",
+  "letter-spacing",
+  "lighting-color",
+  "line-break",
+  "line-clamp",
+  "line-height",
+  "line-height-step",
+  "list-style",
+  "list-style-image",
+  "list-style-position",
+  "list-style-type",
+  "margin",
+  "margin-block",
+  "margin-block-end",
+  "margin-block-start",
+  "margin-bottom",
+  "margin-inline",
+  "margin-inline-end",
+  "margin-inline-start",
+  "margin-left",
+  "margin-right",
+  "margin-top",
+  "margin-trim",
+  "marker",
+  "marker-end",
+  "marker-mid",
+  "marker-start",
+  "mask",
+  "mask-attachment",
+  "mask-border",
+  "mask-border-mode",
+  "mask-border-outset",
+  "mask-border-repeat",
+  "mask-border-slice",
+  "mask-border-source",
+  "mask-border-width",
+  "mask-clip",
+  "mask-composite",
+  "mask-image",
+  "mask-mode",
+  "mask-origin",
+  "mask-position",
+  "mask-position-x",
+  "mask-position-y",
+  "mask-repeat",
+  "mask-repeat-x",
+  "mask-repeat-y",
+  "mask-size",
+  "mask-type",
+  "masonry-auto-flow",
+  "math-depth",
+  "math-shift",
+  "math-style",
+  "max-block-size",
+  "max-height",
+  "max-inline-size",
+  "max-lines",
+  "max-width",
+  "min-block-size",
+  "min-height",
+  "min-inline-size",
+  "min-width",
+  "mix-blend-mode",
+  "object-fit",
+  "object-position",
+  "object-view-box",
+  "offset",
+  "offset-anchor",
+  "offset-distance",
+  "offset-path",
+  "offset-position",
+  "offset-rotate",
+  "opacity",
+  "order",
+  "orient",
+  "orphans",
+  "outline",
+  "outline-color",
+  "outline-offset",
+  "outline-radius",
+  "outline-radius-bottomleft",
+  "outline-radius-bottomright",
+  "outline-radius-topleft",
+  "outline-radius-topright",
+  "outline-style",
+  "outline-width",
+  "overflow",
+  "overflow-anchor",
+  "overflow-block",
+  "overflow-clip-box",
+  "overflow-clip-margin",
+  "overflow-inline",
+  "overflow-scrolling",
+  "overflow-style",
+  "overflow-wrap",
+  "overflow-x",
+  "overflow-y",
+  "overlay",
+  "overscroll-behavior",
+  "overscroll-behavior-block",
+  "overscroll-behavior-inline",
+  "overscroll-behavior-x",
+  "overscroll-behavior-y",
+  "padding",
+  "padding-block",
+  "padding-block-end",
+  "padding-block-start",
+  "padding-bottom",
+  "padding-inline",
+  "padding-inline-end",
+  "padding-inline-start",
+  "padding-left",
+  "padding-right",
+  "padding-top",
+  "page",
+  "page-break-after",
+  "page-break-before",
+  "page-break-inside",
+  "paint-order",
+  "perspective",
+  "perspective-origin",
+  "place-content",
+  "place-items",
+  "place-self",
+  "pointer-events",
+  "position",
+  "position-anchor",
+  "position-area",
+  "position-try",
+  "position-try-fallbacks",
+  "position-try-order",
+  "position-visibility",
+  "print-color-adjust",
+  "quotes",
+  "r",
+  "reading-flow",
+  "reading-order",
+  "resize",
+  "right",
+  "rotate",
+  "row-gap",
+  "ruby-align",
+  "ruby-merge",
+  "ruby-overhang",
+  "ruby-position",
+  "rx",
+  "ry",
+  "scale",
+  "scroll-behavior",
+  "scroll-chaining",
+  "scroll-initial-target",
+  "scroll-limit",
+  "scroll-limit-x-max",
+  "scroll-limit-x-min",
+  "scroll-limit-y-max",
+  "scroll-limit-y-min",
+  "scroll-margin",
+  "scroll-margin-block",
+  "scroll-margin-block-end",
+  "scroll-margin-block-start",
+  "scroll-margin-bottom",
+  "scroll-margin-inline",
+  "scroll-margin-inline-end",
+  "scroll-margin-inline-start",
+  "scroll-margin-left",
+  "scroll-margin-right",
+  "scroll-margin-top",
+  "scroll-marker-group",
+  "scroll-padding",
+  "scroll-padding-block",
+  "scroll-padding-block-end",
+  "scroll-padding-block-start",
+  "scroll-padding-bottom",
+  "scroll-padding-inline",
+  "scroll-padding-inline-end",
+  "scroll-padding-inline-start",
+  "scroll-padding-left",
+  "scroll-padding-right",
+  "scroll-padding-top",
+  "scroll-rails",
+  "scroll-snap-align",
+  "scroll-snap-coordinate",
+  "scroll-snap-destination",
+  "scroll-snap-points-x",
+  "scroll-snap-points-y",
+  "scroll-snap-stop",
+  "scroll-snap-type",
+  "scroll-snap-type-x",
+  "scroll-snap-type-y",
+  "scroll-snap-x",
+  "scroll-snap-y",
+  "scroll-target-group",
+  "scroll-timeline",
+  "scroll-timeline-axis",
+  "scroll-timeline-name",
+  "scroll-translation",
+  "scrollbar-3dlight-color",
+  "scrollbar-arrow-color",
+  "scrollbar-base-color",
+  "scrollbar-color",
+  "scrollbar-darkshadow-color",
+  "scrollbar-face-color",
+  "scrollbar-gutter",
+  "scrollbar-highlight-color",
+  "scrollbar-shadow-color",
+  "scrollbar-track-color",
+  "scrollbar-width",
+  "shape-image-threshold",
+  "shape-margin",
+  "shape-outside",
+  "shape-rendering",
+  "speak-as",
+  "stack-sizing",
+  "stop-color",
+  "stop-opacity",
+  "stroke",
+  "stroke-color",
+  "stroke-dasharray",
+  "stroke-dashoffset",
+  "stroke-linecap",
+  "stroke-linejoin",
+  "stroke-miterlimit",
+  "stroke-opacity",
+  "stroke-width",
+  "tab-size",
+  "table-layout",
+  "tap-highlight-color",
+  "text-align",
+  "text-align-last",
+  "text-anchor",
+  "text-autospace",
+  "text-blink",
+  "text-box",
+  "text-box-edge",
+  "text-box-trim",
+  "text-combine-upright",
+  "text-decoration",
+  "text-decoration-color",
+  "text-decoration-inset",
+  "text-decoration-line",
+  "text-decoration-skip",
+  "text-decoration-skip-ink",
+  "text-decoration-style",
+  "text-decoration-thickness",
+  "text-emphasis",
+  "text-emphasis-color",
+  "text-emphasis-position",
+  "text-emphasis-style",
+  "text-fill-color",
+  "text-indent",
+  "text-justify",
+  "text-orientation",
+  "text-overflow",
+  "text-rendering",
+  "text-shadow",
+  "text-size-adjust",
+  "text-spacing-trim",
+  "text-stroke",
+  "text-stroke-color",
+  "text-stroke-width",
+  "text-transform",
+  "text-underline-offset",
+  "text-underline-position",
+  "text-wrap",
+  "text-wrap-mode",
+  "text-wrap-style",
+  "timeline-scope",
+  "timeline-trigger",
+  "timeline-trigger-activation-range",
+  "timeline-trigger-activation-range-end",
+  "timeline-trigger-activation-range-start",
+  "timeline-trigger-active-range",
+  "timeline-trigger-active-range-end",
+  "timeline-trigger-active-range-start",
+  "timeline-trigger-name",
+  "timeline-trigger-source",
+  "top",
+  "touch-action",
+  "touch-callout",
+  "touch-select",
+  "transform",
+  "transform-box",
+  "transform-origin",
+  "transform-style",
+  "transition",
+  "transition-behavior",
+  "transition-delay",
+  "transition-duration",
+  "transition-property",
+  "transition-timing-function",
+  "translate",
+  "trigger-scope",
+  "unicode-bidi",
+  "user-focus",
+  "user-input",
+  "user-modify",
+  "user-select",
+  "vector-effect",
+  "vertical-align",
+  "view-timeline",
+  "view-timeline-axis",
+  "view-timeline-inset",
+  "view-timeline-name",
+  "view-transition-class",
+  "view-transition-name",
+  "visibility",
+  "white-space",
+  "white-space-collapse",
+  "widows",
+  "width",
+  "will-change",
+  "window-dragging",
+  "window-shadow",
+  "word-break",
+  "word-spacing",
+  "word-wrap",
+  "wrap-flow",
+  "wrap-margin",
+  "wrap-through",
+  "writing-mode",
+  "x",
+  "y",
+  "z-index",
+  "zoom"
+]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chaincss",
-  "version": "1.12.8",
+  "version": "1.12.11",
   "description": "Chainable CSS-in-JS with build-time compilation, atomic CSS, and zero-runtime options",
   "keywords": [
     "css",
@@ -12,7 +12,23 @@
     "react",
     "nextjs",
     "vite",
-    "webpack"
+    "webpack",
+    "styled-components",
+    "emotion",
+    "tailwind",
+    "vanilla-extract",
+    "panda-css",
+    "styling",
+    "component-library",
+    "theming",
+    "responsive",
+    "buildtime-css",
+    "buildtime",
+    "stylesheet",
+    "javascript",
+    "typescript",
+    "runtime-css",
+    "runtime"
   ],
   "author": "Rommel Caneos",
   "license": "MIT",
@@ -93,7 +109,8 @@
   ],
   "publishConfig": {
     "access": "public",
-    "registry": "https://registry.npmjs.org/"
+    "registry": "https://registry.npmjs.org/",
+    "provenance": false
   },
   "bin": {
     "chaincss": "./node/chaincss.js"