feat: typed css property reference lookup on known types

[barak007]

Previous direction:

This feature adds to the js formatter function call this caller.
This will allow us to implement a "namespace" function within a formatter.

@keyframes a {}
.root {
   --name: a;
   animation-name: var(--name);
}

This will not apply the animation to the root because the --name var is not name spaced
After this change users would be able to implement a solution.

function ns(name) {
    return this.meta.namespace + '__' + name;
}

• port to v4?
• less more context?
• docs

New direction:

This will hinder optimizations in the future. because we don't know the location of the replacements. and does not open full experience for the type of the value.

Another approach could be to type a property with <'animation-name'> or similar tagging and then follow it and transfrom

@property --name {
   syntax: "<'animation-name'>"
   ...
}  
@st-import [keyframes(a)] from ".";
.root {
  --name: a;
}

will lookup for a symbol that match the type. or valid custom property reference.

[idoros]

Taking into account the custom property type and transforming accordingly seems like the correct solution (second solution).

Notice that the syntax: <'animation-name'> is not part of the spec and could cause the native parser/lsp issues that might need to be handled.

We can start with a closed set of property types that we use in transformation and expand it to more properties or even open it to custom value syntax in the future.

Another feature that can be done is to type check var(--name) in the supported properties (can be expanded to more in the future), and offer better completions accordingly.

Maybe close this PR for now?