@webref/css 6.8.3 → 6.9.0

package/css-color-5.json

@@ -63,7 +63,7 @@
       "name": "<color>",
       "prose": "Colors in CSS are represented by the <color> type:",
       "type": "type",
-      "value": "<absolute-color-base> | currentcolor | <system-color> | <device-cmyk()> | <light-dark()>"
+      "value": "<absolute-color-base> | currentcolor | <system-color> | <device-cmyk()> | <color-mix()> | <light-dark()>"
     },
     {
       "name": "<absolute-color-base>",
@@ -312,7 +312,7 @@
     {
       "name": "<custom-params>",
       "type": "type",
-      "value": "<dashed-ident> [ <number> | <percentage> | none ]#"
+      "value": "<dashed-ident> [ <number> | <percentage> | none ]+"
     },
     {
       "name": "<predefined-rgb-params>",
@@ -337,12 +337,22 @@
     {
       "name": "device-cmyk()",
       "type": "function",
-      "value": "device-cmyk( <cmyk-component>{4} [ / <alpha-value> ]? )"
+      "value": "<legacy-device-cmyk-syntax> | <modern-device-cmyk-syntax>"
+    },
+    {
+      "name": "<legacy-device-cmyk-syntax>",
+      "type": "type",
+      "value": "device-cmyk( <number>#{4} )"
+    },
+    {
+      "name": "<modern-device-cmyk-syntax>",
+      "type": "type",
+      "value": "device-cmyk( <cmyk-component>{4} [ / [ <alpha-value> | none ] ]? )"
     },
     {
       "name": "<cmyk-component>",
       "type": "type",
-      "value": "<number> | <percentage>"
+      "value": "<number> | <percentage> | none"
     },
     {
       "name": "light-dark()",
@@ -357,7 +367,7 @@
     {
       "name": "<rectangular-color-space>",
       "type": "type",
-      "value": "srgb | srgb-linear | lab | oklab | xyz | xyz-d50 | xyz-d65"
+      "value": "srgb | srgb-linear | display-p3 | a98-rgb | prophoto-rgb | rec2020 | lab | oklab | xyz | xyz-d50 | xyz-d65"
     },
     {
       "name": "<polar-color-space>",

package/css-color.json

@@ -1093,7 +1093,7 @@
       "values": [
         {
           "name": "srgb",
-          "prose": "The srgb [SRGB] color space accepts three numeric parameters, representing the red, green, and blue channels of the color. In-gamut colors have all three components in the range [0, 1]. The whitepoint is D65. [SRGB] specifies two viewing conditions, encoding and typical. The [ICC] recommends using the encoding conditions for color conversion and for optimal viewing, which are the values in the table below. sRGB is the default color space for CSS, used for all the legacy color functions. It has the following characteristics: x y Red chromaticity 0.640 0.330 Green chromaticity 0.300 0.600 Blue chromaticity 0.150 0.060 White chromaticity D65 Transfer function see below White luminance 80.0 cd/m Black luminance 0.20 cd/m Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 let sign = c < 0? -1 : 1; let abs = Math.abs(c); if (abs < 0.04045) { cl = c / 12.92; } else { cl = sign * (Math.pow((abs + 0.055) / 1.055, 2.4)); } c is the gamma-encoded red, green or blue component. cl is the corresponding linear-light component. Visualization of the sRGB color space in LCH. The primaries and secondaries are shown.",
+          "prose": "The srgb [SRGB] color space accepts three numeric parameters, representing the red, green, and blue channels of the color. In-gamut colors have all three components in the range [0, 1]. The whitepoint is D65. [SRGB] specifies two viewing conditions, encoding and typical. The [ICC] recommends using the encoding conditions for color conversion and for optimal viewing, which are the values in the table below. sRGB is the default color space for CSS, used for all the legacy color functions. It has the following characteristics: x y Red chromaticity 0.640 0.330 Green chromaticity 0.300 0.600 Blue chromaticity 0.150 0.060 White chromaticity D65 Transfer function see below White luminance 80.0 cd/m Black luminance 0.20 cd/m Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 let sign = c < 0? -1 : 1; let abs = Math.abs(c); if (abs <= 0.04045) { cl = c / 12.92; } else { cl = sign * (Math.pow((abs + 0.055) / 1.055, 2.4)); } c is the gamma-encoded red, green or blue component. cl is the corresponding linear-light component. Visualization of the sRGB color space in LCH. The primaries and secondaries are shown.",
           "type": "value",
           "value": "srgb"
         },

package/css-counter-styles.json

@@ -292,7 +292,7 @@
         },
         {
           "name": "oriya",
-          "prose": "Oriya numbering (e.g., ୧, ୨, ୩, ..., ୯୮, ୯୯, ୧୦୦).",
+          "prose": "Oriya (Odia) numbering (e.g., ୧, ୨, ୩, ..., ୯୮, ୯୯, ୧୦୦).",
           "type": "value",
           "value": "oriya"
         },

package/css-fonts.json

@@ -1319,12 +1319,6 @@
           "type": "value",
           "value": "system-ui"
         },
-        {
-          "name": "emoji",
-          "prose": "This font family is intended for use with emoji characters. Emoji are pictographs (pictorial symbols) that are typically presented in a colorful form and used inline in text. They represent things such as faces, weather, vehicles and buildings, food and drink, animals and plants, or icons that represent emotions, feelings, or activities.",
-          "type": "value",
-          "value": "emoji"
-        },
         {
           "name": "math",
           "prose": "This font family is intended for use with mathematical expressions. Such fonts may include additional data (for example, the OpenType MATH table) to help with the hierarchical process of equation layout. In particular, they may contain stylistic and stretching glyph variants useful in setting mathematical equations.",

package/css-grid-3.json

@@ -46,36 +46,6 @@
         "masonry-auto-flow",
         "masonryAutoFlow"
       ]
-    },
-    {
-      "name": "align-tracks",
-      "value": "[normal | <baseline-position> | <content-distribution> | <overflow-position>? <content-position>]#",
-      "initial": "normal",
-      "appliesTo": "grid containers with masonry layout in their block axis",
-      "inherited": "no",
-      "percentages": "n/a",
-      "computedValue": "specified keyword(s)",
-      "canonicalOrder": "per grammar",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "align-tracks",
-        "alignTracks"
-      ]
-    },
-    {
-      "name": "justify-tracks",
-      "value": "[normal | <content-distribution> | <overflow-position>? [ <content-position> | left | right ] ]#",
-      "initial": "normal",
-      "appliesTo": "grid containers with masonry layout in their inline axis",
-      "inherited": "no",
-      "percentages": "n/a",
-      "computedValue": "specified keyword(s)",
-      "canonicalOrder": "per grammar",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "justify-tracks",
-        "justifyTracks"
-      ]
     }
   ],
   "atrules": [],

package/css-grid.json

@@ -237,7 +237,7 @@
       "percentages": "see Track Sizing",
       "computedValue": "see Track Sizing",
       "canonicalOrder": "per grammar",
-      "animationType": "by computed value type",
+      "animationType": "if the list lengths match, by computed value type per item; discrete otherwise",
       "styleDeclaration": [
         "grid-auto-columns",
         "gridAutoColumns"
@@ -252,7 +252,7 @@
       "percentages": "see Track Sizing",
       "computedValue": "see Track Sizing",
       "canonicalOrder": "per grammar",
-      "animationType": "by computed value type",
+      "animationType": "if the list lengths match, by computed value type per item; discrete otherwise",
       "styleDeclaration": [
         "grid-auto-rows",
         "gridAutoRows"

package/css-inline.json

@@ -377,7 +377,7 @@
     },
     {
       "name": "line-height",
-      "value": "normal | <number> | <length-percentage>",
+      "value": "normal | <number [0,∞]> | <length-percentage [0,∞]>",
       "initial": "normal",
       "appliesTo": "non-replaced inline boxes and SVG text content elements",
       "inherited": "yes",
@@ -393,22 +393,22 @@
           "value": "normal"
         },
         {
-          "name": "<length>",
+          "name": "<length [0,∞]>",
           "prose": "The specified length is used as the preferred line height. Negative values are illegal.",
           "type": "value",
-          "value": "<length>"
+          "value": "<length [0,∞]>"
         },
         {
-          "name": "<number>",
+          "name": "<number [0,∞]>",
           "prose": "The preferred line height is this number multiplied by the element’s computed font-size. Negative values are illegal. The computed value is the same as the specified value.",
           "type": "value",
-          "value": "<number>"
+          "value": "<number [0,∞]>"
         },
         {
-          "name": "<percentage>",
+          "name": "<percentage [0,∞]>",
           "prose": "The preferred line height and computed value of the property is this percentage of the element’s computed font-size. Negative values are illegal.",
           "type": "value",
-          "value": "<percentage>"
+          "value": "<percentage [0,∞]>"
         }
       ],
       "styleDeclaration": [

package/css-page.json

@@ -27,7 +27,7 @@
         {
           "name": "size",
           "for": "@page",
-          "value": "<length>{1,2} | auto | [ <page-size> || [ portrait | landscape ] ]",
+          "value": "<length [0,∞]>{1,2} | auto | [ <page-size> || [ portrait | landscape ] ]",
           "initial": "auto",
           "computedValue": "specified value, with <length>s made absolute.",
           "values": [
@@ -50,10 +50,10 @@
               "value": "portrait"
             },
             {
-              "name": "<length>",
+              "name": "<length [0,∞]>",
               "prose": "The page box will be set to the given absolute dimension(s). If only one length value is specified, it sets both the width and height of the page box (i.e., the box is a square). If two length values are specified, the first establishes the page box width, and the second the page box height. Values in units of em and ex refer to the page context’s font. Negative lengths are illegal.",
               "type": "value",
-              "value": "<length>"
+              "value": "<length [0,∞]>"
             },
             {
               "name": "<page-size>",

package/css-text-4.json

@@ -100,7 +100,7 @@
     },
     {
       "name": "white-space",
-      "value": "normal | pre | nowrap | pre-wrap | pre-line | <'white-space-collapse'> || <'text-wrap-mode'> || <'white-space-trim'>",
+      "value": "normal | pre | pre-wrap | pre-line | <'white-space-collapse'> || <'text-wrap-mode'> || <'white-space-trim'>",
       "initial": "normal",
       "appliesTo": "text",
       "inherited": "yes",
@@ -225,7 +225,7 @@
     },
     {
       "name": "tab-size",
-      "value": "<number> | <length>",
+      "value": "<number [0,∞]> | <length [0,∞]>",
       "initial": "8",
       "appliesTo": "text",
       "inherited": "yes",
@@ -849,7 +849,7 @@
     },
     {
       "name": "text-align-all",
-      "value": "start | end | left | right | center | justify | match-parent",
+      "value": "start | end | left | right | center | <string> | justify | match-parent",
       "initial": "start",
       "appliesTo": "block containers",
       "inherited": "yes",
@@ -1190,7 +1190,7 @@
     },
     {
       "name": "text-spacing",
-      "value": "normal | none | auto | <autospace> || <spacing-trim>",
+      "value": "normal | none | auto | <spacing-trim> || <autospace>",
       "initial": "see individual properties",
       "appliesTo": "text",
       "inherited": "yes",

package/css-text-decor-4.json

@@ -103,7 +103,7 @@
     },
     {
       "name": "text-decoration-thickness",
-      "value": "auto | from-font | <length> | <percentage>",
+      "value": "auto | from-font | <length-percentage>",
       "initial": "auto",
       "appliesTo": "all elements",
       "inherited": "no",
@@ -206,7 +206,7 @@
     },
     {
       "name": "text-underline-offset",
-      "value": "auto | <length> | <percentage>",
+      "value": "auto | <length-percentage>",
       "initial": "auto",
       "appliesTo": "all elements",
       "inherited": "yes",

package/css-text.json

@@ -112,7 +112,7 @@
     },
     {
       "name": "tab-size",
-      "value": "<number> | <length>",
+      "value": "<number [0,∞]> | <length [0,∞]>",
       "initial": "8",
       "appliesTo": "text",
       "inherited": "yes",

package/css-ui.json

@@ -622,6 +622,35 @@
         "appearance"
       ]
     },
+    {
+      "name": "field-sizing",
+      "value": "fixed | content",
+      "initial": "fixed",
+      "appliesTo": "elements with default preferred size",
+      "inherited": "no",
+      "percentages": "N/A",
+      "computedValue": "as specified",
+      "canonicalOrder": "per grammar",
+      "animationType": "discrete",
+      "values": [
+        {
+          "name": "fixed",
+          "prose": "For element with default preferred size, the UA must apply set the intrinsic size to the default preferred size defined by the host language for that element. Otherwise UA must behave the same as content.",
+          "type": "value",
+          "value": "fixed"
+        },
+        {
+          "name": "content",
+          "prose": "The UA must determine the element’s intrinsic size based on its content, and must ignore any default preferred size defined by the host language for that element. If the element is an element with default preferred size and is listed in compressible replaced elements, the UA must stop treating the element as a replaced element for min-content contribution.",
+          "type": "value",
+          "value": "content"
+        }
+      ],
+      "styleDeclaration": [
+        "field-sizing",
+        "fieldSizing"
+      ]
+    },
     {
       "name": "input-security",
       "value": "auto | none",

package/css-values-5.json

@@ -106,20 +106,117 @@
       ]
     },
     {
-      "name": "toggle()",
-      "prose": "The toggle() expression allows descendant elements to cycle over a list of values instead of inheriting the same value.",
+      "name": "progress()",
+      "prose": "The progress() functional notation returns a <number> value representing the position of one calculation (the progress value) between two other calculations (the progress start value and progress end value). The argument calculations can resolve to any <number>, <dimension>, or <percentage>, but must have the same type, or else the function is invalid.",
       "type": "function"
     },
     {
-      "name": "<toggle-value>",
-      "prose": "where <toggle-value> is any CSS value that is valid where the expression is placed. If any of the values inside are not valid, then the entire toggle() expression is invalid. The toggle() expression may be used as the value of any property, but must be the only component in that property’s value.",
-      "type": "type"
+      "name": "<progress()>",
+      "type": "type",
+      "value": "progress(<calc-sum> from <calc-sum> to <calc-sum>)"
+    },
+    {
+      "name": "media-progress()",
+      "prose": "Similar to the progress() notation, the media-progress() functional notation returns a <number> value representing current value of the specified media query [MEDIAQUERIES-4] as a progress value between two explicit values of the media query (as the progress start value and progress end value).",
+      "type": "function"
+    },
+    {
+      "name": "<media-progress()>",
+      "type": "type",
+      "value": "media-progress(<media-feature> from <calc-sum> to <calc-sum>)"
+    },
+    {
+      "name": "container-progress()",
+      "prose": "The container-progress() functional notation is identical to the media-progress() functional notation, except that it accepts container features [CSS-CONTAIN-3] in place of media features.",
+      "type": "function"
+    },
+    {
+      "name": "<container-progress()>",
+      "type": "type",
+      "value": "container-progress(<size-feature> [ of <container-name> ]? from <calc-sum> to <calc-sum>)"
+    },
+    {
+      "name": "<progress>",
+      "prose": "The <progress> value type represents the mix progress value in a mix notation, and ultimately resolves to a percentage. It can, however, draw that percentage value from sources such as media queries and animation timelines, and can also convert it through an easing function before using it for interpolation.",
+      "type": "type",
+      "value": "[ <percentage> | <number> | <'animation-timeline'> ]? && by <easing-function>",
+      "values": [
+        {
+          "name": "<percentage>",
+          "prose": "Represents the mix progress value as a <percentage>.",
+          "type": "value",
+          "value": "<percentage>"
+        },
+        {
+          "name": "<number>",
+          "prose": "Computes to the equivalent <percentage>. Note: This allows the use of the progress(), media-progress(), and container-progress() notations.",
+          "type": "value",
+          "value": "<number>"
+        },
+        {
+          "name": "<'animation-timeline'>",
+          "prose": "Represents the mix progress value as the progress of the specified animation timeline. The values none and auto, however, are invalid. [CSS-ANIMATIONS-2] [WEB-ANIMATIONS-2]",
+          "type": "value",
+          "value": "<'animation-timeline'>"
+        },
+        {
+          "name": "<easing-function>",
+          "prose": "Converts the specified input mix progress value into an output mix progress value using the specified easing function. [CSS-EASING-1]",
+          "type": "value",
+          "value": "<easing-function>"
+        }
+      ]
+    },
+    {
+      "name": "calc-mix()",
+      "prose": "The calc-mix() mix notation represents an interpolated numeric or dimensional value. Like calc(), it is a math function, with the following syntactic form:",
+      "type": "function"
+    },
+    {
+      "name": "<calc-mix()>",
+      "type": "type",
+      "value": "calc-mix( <progress>, <calc-sum>, <calc-sum> )"
+    },
+    {
+      "name": "transform-mix()",
+      "prose": "The transform-mix() mix notation represents an interpolated <transform-list>, with the following syntactic form:",
+      "type": "function"
+    },
+    {
+      "name": "<transform-mix()>",
+      "type": "type",
+      "value": "transform-mix( <progress>, <transform-list>, <transform-list> )"
+    },
+    {
+      "name": "mix()",
+      "prose": "Interpolation of any two property values can be represented by the mix() mix notation, which supports two alternative syntax patterns:",
+      "type": "function"
+    },
+    {
+      "name": "<mix()>",
+      "type": "type",
+      "value": "mix( <progress> ';' <whole-value> ';' <whole-value> ) | mix( <progress> && of <'animation-name'> )"
+    },
+    {
+      "name": "first-valid()",
+      "prose": "The first-valid() functional notation inlines the fallback behavior intrinsic to parsing declarations. Unlike most notations, it can accept any valid or invalid syntax in its arguments, and represents the first value among its arguments that is supported (parsed as valid) by the UA as the whole value of the property it’s used in.",
+      "type": "function"
+    },
+    {
+      "name": "<first-valid()>",
+      "type": "type",
+      "value": "first-valid( <declaration-value> [ ';' <declaration-value> ]* )"
+    },
+    {
+      "name": "toggle()",
+      "prose": "The toggle() expression allows descendant elements to cycle over a list of values instead of inheriting the same value.",
+      "type": "function"
     },
     {
       "name": "attr()",
       "prose": "The attr() function substitutes the value of an attribute on an element into a property, similar to how the var() function substitutes a custom property value into a function.",
       "type": "function",
-      "value": "attr( <q-name> <attr-type>? , <declaration-value>?)",
+      "value": "attr( <attr-name> <attr-type>? , <declaration-value>?)",
       "values": [
         {
           "name": "string",
@@ -195,6 +292,11 @@
         }
       ]
     },
+    {
+      "name": "<attr-name>",
+      "type": "type",
+      "value": "[ <ident-token> '|' ]? <ident-token>"
+    },
     {
       "name": "<attr-type>",
       "type": "type",
@@ -221,6 +323,38 @@
       "prose": "The random-item() function resolves to a random item from among its list of items.",
       "type": "function",
       "value": "random-item( <random-caching-options> ';' <any-value> [ ';' <any-value> ]* )"
+    },
+    {
+      "name": "sibling-count()",
+      "prose": "The sibling-count() functional notation represents, as an <integer>, the total number of child elements in the parent of the element on which the notation is used.",
+      "type": "function"
+    },
+    {
+      "name": "sibling-index()",
+      "prose": "The sibling-index() functional notation represents, as an <integer>, the index of the element on which the notation is used among the children of its parent. Like :nth-child(), sibling-index() is 1-indexed.",
+      "type": "function"
+    }
+  ],
+  "warnings": [
+    {
+      "msg": "Missing definition",
+      "name": "progress-function()",
+      "value": "progress-function( progress value from start value to end value )"
+    },
+    {
+      "msg": "Missing definition",
+      "name": "mix-function()",
+      "value": "mix-function( <progress>,"
+    },
+    {
+      "msg": "Missing definition",
+      "name": "<color-mix()>",
+      "value": "color-mix( <progress> && <color-interpolation-method>?, <color>, <color> ) | color-mix( <color-interpolation-method>, [<color> && <percentage [0,100]>?]#{2} )"
+    },
+    {
+      "msg": "Missing definition",
+      "name": "<cross-fade()>",
+      "value": "cross-fade( <progress>, [ <image> | <color> ], [ <image> | <color> ] ) | cross-fade( <cf-image># )"
     }
   ]
 }

package/css-values.json

@@ -7,26 +7,6 @@
   "atrules": [],
   "selectors": [],
   "values": [
-    {
-      "name": "mix()",
-      "prose": "Interpolation of two values can be represented by the mix() functional notation, whose syntax is defined as follows:",
-      "type": "function",
-      "value": "mix( <percentage> ';' <declaration-value>? ';' <declaration-value>? )",
-      "values": [
-        {
-          "name": "<percentage>",
-          "prose": "Represents the interpolation progress between the two values.",
-          "type": "value",
-          "value": "<percentage>"
-        },
-        {
-          "name": "<declaration-value>",
-          "prose": "The first <declaration-value> represents the value at the “start” (0%) of the interpolation range, interpreted as a value for the property this function is used in. The second <declaration-value> represents the value at the “end” (100%) of the interpolation range, interpreted the same. Either value can be omitted, to refer to an empty value (this is valid in custom properties, such as --foo:;). The separating ; cannot be omitted; for example, a mix() with an empty starting value would be written like mix(50%;;bar).",
-          "type": "value",
-          "value": "<declaration-value>"
-        }
-      ]
-    },
     {
       "name": "<ident>",
       "prose": "CSS identifiers, generically denoted by <ident>, consist of a sequence of characters conforming to the <ident-token> grammar. [CSS-SYNTAX-3] Identifiers cannot be quoted; otherwise they would be interpreted as strings. CSS properties accept two classes of identifiers: pre-defined keywords and author-defined identifiers.",
@@ -492,31 +472,31 @@
       "values": [
         {
           "name": "e",
-          "prose": "e is the base of the natural logarithm, approximately equal to 2.7182818284590452354.",
+          "prose": "the base of the natural logarithm, approximately equal to 2.7182818284590452354.",
           "type": "value",
           "value": "e"
         },
         {
           "name": "pi",
-          "prose": "pi is the ratio of a circle’s circumference to its diameter, approximately equal to 3.1415926535897932.",
+          "prose": "the ratio of a circle’s circumference to its diameter, approximately equal to 3.1415926535897932.",
           "type": "value",
           "value": "pi"
         },
         {
           "name": "infinity",
-          "prose": "When a calculation or a subtree of a calculation becomes infinite or NaN, representing it with a numeric value is no longer possible. To aid in serialization of these degenerate values, the additional math constants infinity (with the value +∞), -infinity (with the value −∞), and NaN (with the value NaN) are defined.",
+          "prose": "the value positive infinity (+∞)",
           "type": "value",
           "value": "infinity"
         },
         {
           "name": "-infinity",
-          "prose": "When a calculation or a subtree of a calculation becomes infinite or NaN, representing it with a numeric value is no longer possible. To aid in serialization of these degenerate values, the additional math constants infinity (with the value +∞), -infinity (with the value −∞), and NaN (with the value NaN) are defined.",
+          "prose": "the value negative infinity (−∞)",
           "type": "value",
           "value": "-infinity"
         },
         {
           "name": "NaN",
-          "prose": "When a calculation or a subtree of a calculation becomes infinite or NaN, representing it with a numeric value is no longer possible. To aid in serialization of these degenerate values, the additional math constants infinity (with the value +∞), -infinity (with the value −∞), and NaN (with the value NaN) are defined.",
+          "prose": "the value NaN",
           "type": "value",
           "value": "NaN"
         }
@@ -670,10 +650,10 @@
     {
       "name": "<calc-value>",
       "type": "type",
-      "value": "<number> | <dimension> | <percentage> | <calc-constant> | ( <calc-sum> )"
+      "value": "<number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )"
     },
     {
-      "name": "<calc-constant>",
+      "name": "<calc-keyword>",
       "type": "type",
       "value": "e | pi | infinity | -infinity | NaN"
     },

package/css-view-transitions-2.json

@@ -9,9 +9,9 @@
       "name": "@view-transition",
       "descriptors": [
         {
-          "name": "trigger",
+          "name": "navigation",
           "for": "@view-transition",
-          "value": "navigation | none",
+          "value": "auto | none",
           "initial": "none",
           "values": [
             {
@@ -21,15 +21,21 @@
               "value": "none"
             },
             {
-              "name": "navigation",
-              "prose": "The transition will be enabled if the navigation is same-origin, without cross-origin redirects.",
+              "name": "auto",
+              "prose": "The transition will be enabled if the navigation is same-origin, without cross-origin redirects, and is not a reload.",
               "type": "value",
-              "value": "navigation"
+              "value": "auto"
             }
           ]
+        },
+        {
+          "name": "type",
+          "for": "@view-transition",
+          "value": "<custom-ident>*",
+          "initial": "an empty list"
         }
       ],
-      "value": "@view-transition same-origin { <declaration-rule-list> }"
+      "value": "@view-transition { <declaration-rule-list> }"
     }
   ],
   "selectors": [

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@webref/css",
   "description": "CSS definitions of the web platform",
-  "version": "6.8.3",
+  "version": "6.9.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/w3c/webref.git"