{"record":{"id":"5bab1edf4826612f","repo":"swc-project/swc","slug":"number-dimension-function-math-functions-or-id","errorCode":null,"errorMessage":"number, dimension, function (math functions) or ident (with 'none' value) token","messagePattern":"number, dimension, function \\(math functions\\) or ident \\(with 'none' value\\) token","errorType":"validation","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"crates/swc_css_parser/src/parser/values_and_units/mod.rs","lineNumber":475,"sourceCode":"                                }\n                                tok!(\"ident\") => {\n                                    let ident: Box<Ident> = parser.parse()?;\n\n                                    if ident.value.eq_ignore_ascii_case(\"none\") {\n                                        Ok(Some(ComponentValue::Ident(ident)))\n                                    } else {\n                                        Err(Error::new(\n                                            ident.span,\n                                            ErrorKind::Expected(\"'none' value of an ident token\"),\n                                        ))\n                                    }\n                                }\n                                Token::Function { value, .. } if is_math_function(value) => {\n                                    Ok(Some(ComponentValue::Function(parser.parse()?)))\n                                }\n                                _ => {\n                                    if !has_variable_before {\n                                        Err(Error::new(\n                                            parser.input.cur_span(),\n                                            ErrorKind::Expected(\n                                                \"number, dimension, function (math functions) or \\\n                                                 ident (with 'none' value) token\",\n                                            ),\n                                        ))\n                                    } else {\n                                        Ok(None)\n                                    }\n                                }\n                            },\n                            &mut has_variable,\n                        )?;\n\n                        if let Some(hue_or_none) = hue_or_none {\n                            values.push(hue_or_none);\n                        }\n","sourceCodeStart":457,"sourceCodeEnd":493,"githubUrl":"https://github.com/swc-project/swc/blob/5176682b65416c6b5de6b47379ae1588ea3ecb3f/crates/swc_css_parser/src/parser/values_and_units/mod.rs#L457-L493","documentation":"Thrown by swc_css_parser when the FIRST channel of an hsl()/hsla() function (the hue) begins with a token that is not a number, dimension, ident, or math function (crates/swc_css_parser/src/parser/values_and_units/mod.rs:473-485). The parser emits ErrorKind::Expected(\"number, dimension, function (math functions) or ident (with 'none' value) token\") at the current span. It only fires when has_variable_before is false — once a var()/env()/constant() appeared, the arm yields Ok(None) and the parser stays lenient.","triggerScenarios":"parse_string on 'hsl(#fff, 100%, 50%)', 'hsl(\"240\" 100% 50%)', 'hsl(, 100%, 50%)', or 'hsl(/ 100% 50%)' — the hue slot starts with a hash/string/comma/slash token and hits the '_' arm at line 473.","commonSituations":"Pasting a hex hue into hsl(); quoted hue values produced by JS template strings ('hsl(\"${h}\", ...)'); malformed output from CSS-in-JS or older preprocessor loops; truncated files after minification or merge conflicts leaving an empty first argument.","solutions":["Write the hue as number or dimension: 'hsl(240 100% 50%)' or 'hsl(240deg 100% 50%)'.","Remove quotes around interpolated values before emitting CSS ('hsl(' + h + ' 100% 50%)').","Keep hex colors as-is ('#fff') instead of forcing them into hsl().","Use the error span from err.into_inner().0 to locate the bad token quickly."],"exampleFix":"/* before */\ncolor: hsl(\"240\" 100% 50%);\ncolor: hsl(#fff, 100%, 50%);\n\n/* after */\ncolor: hsl(240 100% 50%);\ncolor: hsl(240deg 100% 50%);","handlingStrategy":"try-catch","validationCode":"fn hsl_hue_token_ok(raw: &str) -> bool {\n    let a = raw.trim();\n    match a.chars().next() {\n        Some(c) if c.is_ascii_digit() || c == '.' || c == '-' || c == '+' => true,\n        Some(_) => a.eq_ignore_ascii_case(\"none\") || a.starts_with(\"var(\") || a.ends_with(')'),\n        None => false, // empty hue slot will hit the fallback arm\n    }\n}","typeGuard":"fn is_hue_start_token(text: &str) -> bool {\n    let t = text.trim_start();\n    !t.is_empty()\n        && !t.starts_with('#')\n        && !t.starts_with('\"')\n        && !t.starts_with(',')\n        && !t.starts_with('/')\n}","tryCatchPattern":"match swc_css_parser::parse_string::<Stylesheet>(css, config) {\n    Ok(sheet) => sheet,\n    Err(err) if matches!(&err.kind(), ErrorKind::Expected(m) if m.contains(\"number, dimension, function (math functions) or ident\")) => {\n        // hsl hue starts with an unexpected token (hash/string/comma); report span, skip declaration\n        Err(err.into())\n    }\n    Err(err) => Err(err.into()),\n}","preventionTips":["Never quote interpolated hue values in generated CSS.","Do not paste hex values into hsl(); branch to the hex form instead.","Fail fast in codegen: assert the first non-space character of every hsl() argument is a digit, '.', '-', or a letter that starts var(/calc(."],"tags":["css","swc","css-parser","hsl","hue","unexpected-token"],"backgroundTag":"css-color-function-invalid-token","analyzedSha":"5176682b65416c6b5de6b47379ae1588ea3ecb3f","analyzedAt":"2026-08-17T16:16:52.067Z","contentChangedAt":"2026-08-17T16:16:52.067Z","schemaVersion":2},"datasetVersion":"2026-09-14T05:17:10.506Z"}