fix: size prop can't order corretly.

[GiveMe-A-Name]

Example

.foo { 
   height: auto; 
   height: calc(100vh - var(--header-height, 0rem)); 
}

After lightningcss minify, css code would like this

.foo { 
   height: calc(100vh - var(--header-height, 0rem)); 
   height: auto; 
}

But it's not expect.
we can maintain the last prop, then delete the repeat prop. Like bellow:

.foo { 
   height: calc(100vh - var(--header-height, 0rem)); 
}

fix: #805

[sbyps]

anyone can review this PR? @devongovett

[devongovett]

One problem with this approach is that it assumes that all unparsed properties are valid and supported by all browser targets. Unparsed properties may be things other than values containing variables. Say CSS adds a new unit that lightningcss doesn't support yet. This will result in an unparsed property value, which means we may need to preserve multiple values for unparsed properties.

.foo {
  width: 200px;
  width: 200abc;
  width: some-keyword;
}

If some-keyword and 200abc aren't supported by all browsers, they'll fall back to 200px. In this case we need to preserve all property values. A real-world example is the new calc-size() function that lightningcss does not yet parse, but that is supported in Chrome.

I think we can do a better job of deduplicating values that are exactly the same, or values that contain var(), but that is a much bigger task that should apply across all properties. For now, I'm just going to fix the immediate bug which is that we don't flush the current values when we hit an unparsed property.