Any support for @property?

[bschlenk]

Is there a way to define an @property in vanilla extract? I'm migrating some .css files over, and it is currently using @property to be able to add a transition to a fade out effect that uses mask-image:

@property --fade-left {
  syntax: '<color>';
  inherits: false;
  initial-value: transparent;
}

@property --fade-right {
  syntax: '<color>';
  inherits: false;
  initial-value: transparent;
}

.tabStripScroll {
  --fade-size: 32px;

  padding-left: var(--spacer-2);
  transition: --fade-left, --fade-right;
  transition-timing-function: linear;
  transition-duration: var(--duration-sm);

  .tabStripRoot:not([data-scroll-x='none']) & {
    mask-image: linear-gradient(
      to right,
      var(--fade-left),
      black var(--fade-size),
      black calc(100% - var(--fade-size)),
      var(--fade-right)
    );
  }

  .tabStripRoot[data-scroll-x='start'] & {
    --fade-left: black;
  }

  .tabStripRoot[data-scroll-x='end'] & {
    --fade-right: black;
  }

I didn't see any mention of @property in the docs or issues.

[bschlenk]

Ahh sorry! I just didn't look hard enough. https://vanilla-extract.style/documentation/api/create-var/#property-rules