Update app.py

app.py

@@ -5,56 +5,89 @@ from bs4 import BeautifulSoup
 def parse_variable_file(variable_content):
     """Parses the SCSS variable content and returns a mapping of color names to their values."""
     variables = {}
-    # First pass: collect all variable definitions
-    for line in variable_content.splitlines():
-        # Match SCSS variables with more flexible pattern
-        match = re.match(r'^\s*\$([\w-]+)\s*:\s*([^;]+)\s*(!default)?;?', line)
-        if match:
-            var_name = match.group(1)
-            var_value = match.group(2).strip()
-            variables[var_value] = f"${var_name}"
-            # Also store the variable name itself for reference
+    variable_references = {}
+    
+    # First pass: collect direct color definitions
+    # Match both with and without !default, including rgba values
+    color_pattern = re.compile(r'^\s*\$([\w-]+):\s*(#[a-fA-F0-9]{3,6}|rgba?\([^)]+\))\s*(!default)?\s*;')
+    # Match variable references
+    reference_pattern = re.compile(r'^\s*\$([\w-]+):\s*\$([\w-]+)\s*(!default)?\s*;')
+    
+    # Process each line
+    lines = variable_content.splitlines()
+    for line in lines:
+        # Skip comments and empty lines
+        if line.strip().startswith('//') or not line.strip():
+            continue
+            
+        # Skip map-merge blocks
+        if 'map-merge' in line:
+            continue
+            
+        # Try to match direct color values
+        color_match = color_pattern.match(line)
+        if color_match:
+            var_name = color_match.group(1)
+            color_value = color_match.group(2)
+            variables[color_value] = f"${var_name}"
+            # Store the variable name itself as a key for reference
             variables[f"${var_name}"] = f"${var_name}"
+            continue
+            
+        # Try to match variable references
+        ref_match = reference_pattern.match(line)
+        if ref_match:
+            var_name = ref_match.group(1)
+            referenced_var = ref_match.group(2)
+            variable_references[var_name] = referenced_var
+    
+    # Second pass: resolve variable references
+    for var_name, referenced_var in variable_references.items():
+        for color, original_var in variables.items():
+            if f"${referenced_var}" == original_var:
+                variables[f"${var_name}"] = original_var
+    
     return variables
 
 def convert_css_to_scss(css_content, variable_mapping):
     """Converts CSS content to SCSS by replacing color values with variable names."""
-    # Sort the color mappings by length (longest first) to avoid partial replacements
-    sorted_mappings = sorted(variable_mapping.items(), key=lambda x: len(x[0]), reverse=True)
+    # Sort mappings by length of the color value (longest first)
+    sorted_mappings = sorted(variable_mapping.items(), 
+                           key=lambda x: len(x[0]) if not x[0].startswith('$') else 0, 
+                           reverse=True)
     
-    # Process the content line by line
-    converted_lines = []
+    # Process each line while preserving comments
+    result_lines = []
     for line in css_content.splitlines():
         processed_line = line
         
-        # Skip comments
+        # Handle lines with comments
         if '/*' in line and '*/' in line:
-            comment_start = line.index('/*')
-            comment_end = line.index('*/') + 2
-            before_comment = line[:comment_start]
-            comment = line[comment_start:comment_end]
-            after_comment = line[comment_end:]
-            
-            # Process only the non-comment parts
-            for value, variable in sorted_mappings:
-                before_comment = before_comment.replace(value, variable)
-                after_comment = after_comment.replace(value, variable)
-            
-            processed_line = before_comment + comment + after_comment
+            parts = re.split(r'(/\*.*?\*/)', line)
+            for i, part in enumerate(parts):
+                if not part.startswith('/*'):
+                    # Only process non-comment parts
+                    for color, variable in sorted_mappings:
+                        if not color.startswith('$'):  # Only replace actual color values
+                            part = part.replace(color, variable)
+                    parts[i] = part
+            processed_line = ''.join(parts)
         else:
-            # Process normal lines
-            for value, variable in sorted_mappings:
-                processed_line = processed_line.replace(value, variable)
+            # Process lines without comments
+            for color, variable in sorted_mappings:
+                if not color.startswith('$'):  # Only replace actual color values
+                    processed_line = processed_line.replace(color, variable)
         
-        converted_lines.append(processed_line)
+        result_lines.append(processed_line)
     
-    return '\n'.join(converted_lines)
+    return '\n'.join(result_lines)
 
 def extract_css_and_replace_with_variables(css_content, variables_content):
     """Replaces CSS properties with SCSS variables."""
     try:
         variable_mapping = parse_variable_file(variables_content)
-        return convert_css_to_scss(css_content, variable_mapping)
+        scss_content = convert_css_to_scss(css_content, variable_mapping)
+        return scss_content
     except Exception as e:
         st.error(f"Error processing CSS to SCSS: {e}")
         return None