[scroll-animations] Use CSSStyleValue for scroll offsets

[andruud]

Just a thought:

Perhaps it's appropriate to use CSSStyleValue from css-typed-om to get and set scroll offsets. It would allow specifying offsets in a "structured" manner, such as CSS.px(42) rather than "42px".

Specifically, this is how that could look:

// Set:

const timeline = new ScrollTimeline({
  // ...
  startScrollOffset: CSS.px(10),
  endScrollOffset: new CSSKeywordValue('auto')
  // ...
});

// Get:

console.log(timeline.startScrollOffset);
// -> CSSUnitValue {value: 10, unit: "px"}

console.log(timeline.endScrollOffset);
// -> CSSKeywordValue {value: "auto"}

[tabatkins]

If we do this, it would probably be good to remove support for supplying a string like "42px", that way we can infer that strings are keywords.

(The CSSKeywordish typedef that allowed for CSSKeywordValue or DOMString was removed from the spec for now, but I should add it back.)

[flackr]

We've removed scroll offsets but we'll probably want to consider the same for whatever programmatic API we add to set view-timeline-inset.

[flackr]

Also relevant to #7575 and in particular how those values would be passed via JS, where I have already been leaning in this direction for the related API's: #7748, #7589

[flackr]

Closing this issue in favor of the specific issues linked relevant to the new APIs using offsets.