`font-family: system-ui;` support

See https://github.com/Fyrd/caniuse/issues/2918 for caniuse feature inclusion.

It would be nice if autoprefixer replaced font-family: system-ui; with this:

font-family: system-ui, 
    -apple-system, BlinkMacSystemFont, 
    "Segoe UI", "Roboto", "Oxygen", 
    "Ubuntu", "Cantarell", "Fira Sans", 
    "Droid Sans", "Helvetica Neue", sans-serif;

(adapted from https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical-guide/ )

[ausi]

I think extending system-ui to the complete font list from above can be problematic. There is not “the one” list that is correct IMO, it’s just a best practice for now and may be different depending on the user base. The linked Smashing Magazine article itself notes that “this is not future-proof” and “The list targets the most popular browsers and operating systems, but it doesn’t target all of them”.

I think it would be nice if autoprefixer extends system-ui to only system-ui, -apple-system, BlinkMacSystemFont which are all equivalent AFAIK and that would be some kind of “prefixing”. The list of fallback fonts should be up to the CSS author (or to cssnext).

[yisibl]

I think autoprefixer should only deal with the prefix and private value.

Input:

font-family: system-ui, sans-serif;

Output:

font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;