GeezerVison

PR Checklist

• The PR title follows our guidelines: https://github.com/NativeScript/NativeScript/blob/master/tools/notes/CONTRIBUTING.md#commit-messages.
• There is an issue for the bug/feature this PR is for. To avoid wasting your time, it's best to open a suggestion issue first and wait for approval before working on it.
• You have signed the CLA.
• All existing tests are passing: https://github.com/NativeScript/NativeScript/blob/master/tools/notes/DevelopmentWorkflow.md#running-unit-tests-application.
• Tests for the changes are included - https://github.com/NativeScript/NativeScript/blob/master/tools/notes/WritingUnitTests.md.

What is the current behavior?

Both CSS parsers (css-tree, and rework / webpack's css2json) emit @supports blocks, but _populateRules only handles @media, @keyframes and plain rules, so every rule inside an @supports block is silently dropped. A common progressive-enhancement pattern does nothing:

.card { background-color: #e0e0e0; }
@supports (color: color-mix(in srgb, red, blue)) {
  .card { background-color: color-mix(in srgb, var(--accent) 20%, white); }
}

What is the new behavior?

@supports conditions are evaluated when the stylesheet is built (ui/styling/css-supports.ts):

• (property: value) passes when core knows the property and that property's own value converter accepts the value. (color: color-mix(...)) is true because Color parses color-mix(), while (display: grid) is false. var() / calc() values, CSS-wide keywords and custom properties pass, matching browsers.
• selector(...) passes when core's selector parser accepts it.
• not / and / or and nested parentheses follow css-conditional-3. Mixing and/or without parentheses, or any other malformed condition, drops the block.
• Unknown properties and unknown functions (font-tech(), etc.) evaluate to false. That keeps them negatable, so @supports not (display: grid) applies. Unknown or invalid conditions log a Trace warning in the Style category.

A supported block is flattened into the surrounding rule list, so its rules keep their source position and override an earlier fallback by order, inside @media too. @keyframes inside @supports work.

To support the declaration test, properties/index.ts now records each CssProperty value converter by CSS name, updated by overrideHandlers, and exposes _isCssDeclarationSupported. Shorthands and CssAnimationProperty use their existing converters.

Notes:

• Support follows each property's converter. A property whose converter accepts any string reports any value as supported, and a converter that returns NaN counts as unsupported.
• A property registered by a module that has not loaded yet when the stylesheet is parsed reports as unknown.