Re: [csswg-drafts] [css-values-5] Interpolating calc-size() more generally (#10294)

My main concern is that `transition-behavior` is specifically for transitions, but auto-coercion to calc_size to support smooth interpolations is applicable to css animations and web animations.

I.e. there are three ways to trigger an animation of size:
1. CSS Transitions
   ```html
   <style>
     .small { height: 0; }
     .target { transition: height 1s; }
   </style>
   <script>
     document.querySelector('.target').classList.remove('small');
   </script>
   ```
2. CSS Animations
   ```html
   <style>
     @keyframes expand { from { height: 0; } }
     .target { animation: expand 1s; }
   </style>
   ```
3. Web Animations
   ```js
     document.querySelector('.target').animate([
           {height: '0', offset: 0}
            /* Implicit to keyframe */
         ],
         1000);
   ```

It would be nice to use a property that opts into all of these working instead of only having transitions work but animations still be discrete.

Options:
1. So if we use `transition-behavior: interpolate-sizes` (name to be bikeshedded) then we'd also need an `animation-interpolation-behavior` and a property on the web animation api.
2. We introduce a property to refer to the interpolation behavior.

-- 
GitHub Notification of comment by flackr
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10294#issuecomment-2101047372 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 8 May 2024 17:17:13 UTC