@webref/css 6.21.2 → 6.23.0

package/css-shapes.json

@@ -151,6 +151,183 @@
           "href": "https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-path",
           "type": "function",
           "value": "path( <'fill-rule'>? , <string> )"
+        },
+        {
+          "name": "shape()",
+          "prose": "See The shape() function.",
+          "href": "https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-shape",
+          "type": "function",
+          "value": "shape( <'fill-rule'>? from <position> <shape-command># )",
+          "values": [
+            {
+              "name": "<coordinate-pair>",
+              "value": "<length-percentage>{2}",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-coordinate-pair",
+              "type": "type"
+            },
+            {
+              "name": "<command-end-point>",
+              "value": "[ to <position> | by <coordinate-pair> ]",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-command-end-point",
+              "type": "type",
+              "values": [
+                {
+                  "name": "to",
+                  "prose": "<command-end-point> = [ to <position> | by <coordinate-pair> ]",
+                  "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-to",
+                  "type": "value",
+                  "value": "to"
+                },
+                {
+                  "name": "by",
+                  "prose": "<command-end-point> = [ to <position> | by <coordinate-pair> ]",
+                  "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-by",
+                  "type": "value",
+                  "value": "by"
+                }
+              ]
+            },
+            {
+              "name": "<move-command>",
+              "value": "move <command-end-point>",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-move-command",
+              "type": "type"
+            },
+            {
+              "name": "move",
+              "prose": "<move-command> = move <command-end-point>",
+              "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-move",
+              "type": "value",
+              "value": "move"
+            },
+            {
+              "name": "<line-command>",
+              "value": "line <command-end-point>",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-line-command",
+              "type": "type"
+            },
+            {
+              "name": "line",
+              "prose": "<line-command> = line <command-end-point>",
+              "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-line",
+              "type": "value",
+              "value": "line"
+            },
+            {
+              "name": "<horizontal-line-command>",
+              "value": "hline [ to [ <length-percentage> | left | center | right | x-start | x-end ] | by <length-percentage> ]",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-horizontal-line-command",
+              "type": "type"
+            },
+            {
+              "name": "<vertical-line-command>",
+              "value": "vline [ to [ <length-percentage> | top | center | bottom | y-start | y-end ] | by <length-percentage> ]",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-vertical-line-command",
+              "type": "type"
+            },
+            {
+              "name": "<curve-command>",
+              "value": "curve [ [ to <position> with <control-point> [ / <control-point> ]? ] | [ by <coordinate-pair> with <relative-control-point> [ / <relative-control-point> ]? ] ]",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-curve-command",
+              "type": "type"
+            },
+            {
+              "name": "curve",
+              "prose": "<curve-command> = curve [ [ to <position> with <control-point> [ / <control-point> ]? ] | [ by <coordinate-pair> with <relative-control-point> [ / <relative-control-point> ]? ] ]",
+              "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-curve",
+              "type": "value",
+              "value": "curve"
+            },
+            {
+              "name": "<smooth-command>",
+              "value": "smooth [ [ to <position> [ with <control-point> ]? ] | [ by <coordinate-pair> [ with <relative-control-point> ]? ] ]",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-smooth-command",
+              "type": "type"
+            },
+            {
+              "name": "smooth",
+              "prose": "<smooth-command> = smooth [ [ to <position> [with <control-point> ]? ] | [ by <coordinate-pair> [ with <relative-control-point> ]? ] ]",
+              "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-smooth",
+              "type": "value",
+              "value": "smooth"
+            },
+            {
+              "name": "<control-point>",
+              "value": "[ <position> | <relative-control-point> ]",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-control-point",
+              "type": "type"
+            },
+            {
+              "name": "<relative-control-point>",
+              "value": "<coordinate-pair> [ from [ start | end | origin ] ]?",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-relative-control-point",
+              "type": "type"
+            },
+            {
+              "name": "<arc-command>",
+              "value": "arc <command-end-point> [ [ of <length-percentage>{1,2} ] && <arc-sweep>? && <arc-size>? && [rotate <angle>]? ]",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-arc-command",
+              "type": "type"
+            },
+            {
+              "name": "arc",
+              "prose": "<arc-command> = arc <command-end-point> [[of <length-percentage>{1,2}] && <arc-sweep>? && <arc-size>? && rotate <angle>? ]",
+              "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-arc",
+              "type": "value",
+              "value": "arc",
+              "values": [
+                {
+                  "name": "cw",
+                  "prose": "<arc-sweep> can be cw or ccw, indicating that the arc that is traced around the ellipse clockwise or counter-clockwise from the center, respectively, must be chosen. If omitted, this defaults to ccw.",
+                  "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-cw",
+                  "type": "value",
+                  "value": "cw"
+                },
+                {
+                  "name": "ccw",
+                  "prose": "<arc-sweep> can be cw or ccw, indicating that the arc that is traced around the ellipse clockwise or counter-clockwise from the center, respectively, must be chosen. If omitted, this defaults to ccw.",
+                  "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-ccw",
+                  "type": "value",
+                  "value": "ccw"
+                },
+                {
+                  "name": "large",
+                  "prose": "<arc-size> can be large or small, indicating that the larger or smaller, respectively, of the two possible arcs must be chosen. If omitted, this defaults to small.",
+                  "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-large",
+                  "type": "value",
+                  "value": "large"
+                },
+                {
+                  "name": "small",
+                  "prose": "<arc-size> can be large or small, indicating that the larger or smaller, respectively, of the two possible arcs must be chosen. If omitted, this defaults to small.",
+                  "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-small",
+                  "type": "value",
+                  "value": "small"
+                }
+              ]
+            },
+            {
+              "name": "<arc-sweep>",
+              "prose": "<arc-sweep> can be cw or ccw, indicating that the arc that is traced around the ellipse clockwise or counter-clockwise from the center, respectively, must be chosen. If omitted, this defaults to ccw.",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-arc-sweep",
+              "type": "type",
+              "value": "cw | ccw"
+            },
+            {
+              "name": "<arc-size>",
+              "prose": "<arc-size> can be large or small, indicating that the larger or smaller, respectively, of the two possible arcs must be chosen. If omitted, this defaults to small.",
+              "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-arc-size",
+              "type": "type",
+              "value": "large | small"
+            },
+            {
+              "name": "close",
+              "prose": "Adds a closepath command to the list of path data commands.",
+              "href": "https://drafts.csswg.org/css-shapes-1/#valdef-shape-close",
+              "type": "value",
+              "value": "close"
+            }
+          ]
         }
       ]
     },
@@ -160,6 +337,13 @@
       "type": "type",
       "value": "<inset()> | <rect()> | <xywh()>"
     },
+    {
+      "name": "<shape-command>",
+      "prose": "The sequence of <shape-command>s represent further path data commands. Each command’s starting point is the previous command’s ending point.",
+      "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-command",
+      "type": "type",
+      "value": "<move-command> | <line-command> | close | <horizontal-line-command> | <vertical-line-command> | <curve-command> | <smooth-command> | <arc-command>"
+    },
     {
       "name": "<shape-box>",
       "href": "https://drafts.csswg.org/css-shapes-1/#typedef-shape-box",

package/css-text-4.json

@@ -60,7 +60,7 @@
         },
         {
           "name": "math-auto",
-          "prose": "See .",
+          "prose": "See MathML Core § 4.2 The math-auto transform.",
           "href": "https://drafts.csswg.org/css-text-4/#valdef-text-transform-math-auto",
           "type": "value",
           "value": "math-auto"

package/css-values-5.json

@@ -25,7 +25,7 @@
         },
         {
           "name": "allow-keywords",
-          "prose": "Two values can also be interpolated if one of them is an <intrinsic-size-keyword> and the other is a <length-percentage>. This is done by treating the <intrinsic-size-keyword> keyword as though it is calc-size(keyword, size) and applying the rules in § 10.3 Interpolating calc-size(). In other cases, an <intrinsic-size-keyword> still cannot be interpolated.",
+          "prose": "Two values can also be interpolated if one of them is an <intrinsic-size-keyword> and the other is a <length-percentage>. This is done by treating the <intrinsic-size-keyword> keyword as though it is calc-size(keyword, size) and applying the rules in § 11.3 Interpolating calc-size(). In other cases, an <intrinsic-size-keyword> still cannot be interpolated.",
           "href": "https://drafts.csswg.org/css-values-5/#valdef-interpolate-size-allow-keywords",
           "type": "value",
           "value": "allow-keywords"
@@ -336,62 +336,195 @@
       "value": "progress(<calc-sum>, <calc-sum>, <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.",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-progress",
+      "name": "calc-mix()",
+      "prose": "The calc-mix() mix notation represents a weighted average of numeric or dimensional value. Like calc(), it is a math function, with the following syntactic form:",
+      "href": "https://drafts.csswg.org/css-values-5/#funcdef-calc-mix",
+      "type": "function",
+      "value": "calc-mix( [ <calc-sum> <percentage [0,100]>? ]# )"
+    },
+    {
+      "name": "transform-mix()",
+      "prose": "The transform-mix() mix notation represents a weighted average of <transform-list>, with the following syntactic form:",
+      "href": "https://drafts.csswg.org/css-values-5/#funcdef-transform-mix",
+      "type": "function",
+      "value": "transform-mix( [ <transform-list> && <percentage [0,100]> ]# )"
+    },
+    {
+      "name": "<progress-source>",
+      "prose": "The <progress-source> value type represents the interpolation progress in an interpolation notation. Its syntax is:",
+      "href": "https://drafts.csswg.org/css-values-5/#typedef-progress-source",
       "type": "type",
-      "value": "[ <percentage-token> | <number> | <'animation-timeline'> ] && [ by <easing-function> ]?",
+      "value": "<percentage> | <number> | <dimension> | <'animation-timeline'>",
       "values": [
         {
-          "name": "<percentage-token>",
-          "prose": "Computes to the equivalent <number>: 0% becomes 0, 100% becomes 1, etc.",
-          "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-percentage-token",
+          "name": "<percentage>",
+          "prose": "Represents the interpolation progress as a percentage, with 0% computing to zero and 100% computing to 1.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-percentage",
           "type": "value",
-          "value": "<percentage-token>"
+          "value": "<percentage>"
         },
         {
           "name": "<number>",
-          "prose": "Represents the mix progress value.",
-          "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-number",
+          "prose": "Represents the interpolation progress as a number directly.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-number",
           "type": "value",
           "value": "<number>"
         },
+        {
+          "name": "<dimension>",
+          "prose": "Represents the interpolation progress as a dimension, which is converted to a number as specified in § 7.2 Validation and Normalization.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-dimension",
+          "type": "value",
+          "value": "<dimension>"
+        },
         {
           "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]",
-          "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-animation-timeline",
+          "prose": "Represents the interpolation progress as the progress of the specified animation timeline. The values none and auto are invalid. [CSS-ANIMATIONS-2] [WEB-ANIMATIONS-2]",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-animation-timeline",
           "type": "value",
           "value": "<'animation-timeline'>"
+        }
+      ]
+    },
+    {
+      "name": "calc-interpolate()",
+      "prose": "The calc-interpolate() interpolation notation represents an interpolated numeric or dimensional value. Like calc(), it is a math function, with the following syntax:",
+      "href": "https://drafts.csswg.org/css-values-5/#funcdef-calc-interpolate",
+      "type": "function",
+      "value": "calc-interpolate( <progress-source> && [ by <easing-function> ]? && <easing-function>?, <input-position>{1,2} : <calc-sum> , [ <easing-function>? , <input-position>{1,2} : <calc-sum> ]# )",
+      "values": [
+        {
+          "name": "by",
+          "prose": "The interpolation progress given by <progress-source> may be optionally modified by the <easing-function> specified after the by keyword. It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to the interpolation map, analogous to animation-easing.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-by",
+          "type": "value",
+          "value": "by"
+        },
+        {
+          "name": "<input-position>",
+          "prose": "Represents an interpolation stop associating the specified input position(s) with the specified output values. As with the gradient functions, if two <input-position>s are specified, it is treated the same as two stops with the same <output-value>.",
+          "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-input-position",
+          "type": "type"
         },
         {
           "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]",
-          "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-easing-function",
+          "prose": "When appearing in the first argument, specifies the “default” easing function to be used between each stop. When appearing between stops, specifies the easing function to be used between the two surrounding stops, overriding any default provided by a global <easing-function> argument. (It is analogous to animation-timing-function.) The input progress value to this easing function is the segment interpolation progress—​how far the interpolation progress is between the input positions of the nearest stops preceding and following it. For example, in color-interpolate(20%, 0%: red, ease-in-out, 80%: green, 100%: blue), the 20% interpolation progress becomes a 25% segment interpolation progress, as 20% is 25% of the way between 0% and 80%, the surrounding input positions.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function",
           "type": "value",
           "value": "<easing-function>"
+        },
+        {
+          "name": "<segment-options>",
+          "prose": "When appearing in the first argument, provides any type-specific interpolation options that apply to every segment in the interpolation map. When appearing between stops, provides any type-specific interpolation options that apply to the interpolation segment between the stops on either side of this argument, overriding any default provided by a corresponding global <segment-options> argument.",
+          "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-segment-options",
+          "type": "type"
         }
       ]
     },
     {
-      "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:",
-      "href": "https://drafts.csswg.org/css-values-5/#funcdef-calc-mix",
+      "name": "color-interpolate()",
+      "prose": "The color-interpolate() interpolation notation represents an interpolated <color> value, with the following syntax:",
+      "href": "https://drafts.csswg.org/css-values-5/#funcdef-color-interpolate",
       "type": "function",
-      "value": "calc-mix( <progress>, <calc-sum>, <calc-sum> )"
+      "value": "color-interpolate( <progress-source> && [ by <easing-function> ]? && <easing-function>? && <color-interpolation-method>?, <input-position>{1,2} : <color>, [ [ <easing-function> || <color-interpolation-method> ], <input-position>{1,2} : <color> ]# )",
+      "values": [
+        {
+          "name": "by",
+          "prose": "The interpolation progress given by <progress-source> may be optionally modified by the <easing-function> specified after the by keyword. It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to the interpolation map, analogous to animation-easing.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-by",
+          "type": "value",
+          "value": "by"
+        },
+        {
+          "name": "<input-position>",
+          "prose": "Represents an interpolation stop associating the specified input position(s) with the specified output values. As with the gradient functions, if two <input-position>s are specified, it is treated the same as two stops with the same <output-value>.",
+          "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-input-position",
+          "type": "type"
+        },
+        {
+          "name": "<easing-function>",
+          "prose": "When appearing in the first argument, specifies the “default” easing function to be used between each stop. When appearing between stops, specifies the easing function to be used between the two surrounding stops, overriding any default provided by a global <easing-function> argument. (It is analogous to animation-timing-function.) The input progress value to this easing function is the segment interpolation progress—​how far the interpolation progress is between the input positions of the nearest stops preceding and following it. For example, in color-interpolate(20%, 0%: red, ease-in-out, 80%: green, 100%: blue), the 20% interpolation progress becomes a 25% segment interpolation progress, as 20% is 25% of the way between 0% and 80%, the surrounding input positions.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function",
+          "type": "value",
+          "value": "<easing-function>"
+        },
+        {
+          "name": "<segment-options>",
+          "prose": "When appearing in the first argument, provides any type-specific interpolation options that apply to every segment in the interpolation map. When appearing between stops, provides any type-specific interpolation options that apply to the interpolation segment between the stops on either side of this argument, overriding any default provided by a corresponding global <segment-options> argument.",
+          "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-segment-options",
+          "type": "type"
+        }
+      ]
     },
     {
-      "name": "transform-mix()",
-      "prose": "The transform-mix() mix notation represents an interpolated <transform-list>, with the following syntactic form:",
-      "href": "https://drafts.csswg.org/css-values-5/#funcdef-transform-mix",
+      "name": "transform-interpolate()",
+      "prose": "The transform-interpolate() interpolation notation represents an interpolated <transform-list>, with the following syntax:",
+      "href": "https://drafts.csswg.org/css-values-5/#funcdef-transform-interpolate",
       "type": "function",
-      "value": "transform-mix( <progress>, <transform-list>, <transform-list> )"
+      "value": "transform-interpolate( <progress-source> && [ by <easing-function> ]? && <easing-function>?, <input-position>{1,2} : <transform-list>, [ <easing-function>?, <input-position>{1,2} : <transform-list> ]# )",
+      "values": [
+        {
+          "name": "by",
+          "prose": "The interpolation progress given by <progress-source> may be optionally modified by the <easing-function> specified after the by keyword. It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to the interpolation map, analogous to animation-easing.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-by",
+          "type": "value",
+          "value": "by"
+        },
+        {
+          "name": "<input-position>",
+          "prose": "Represents an interpolation stop associating the specified input position(s) with the specified output values. As with the gradient functions, if two <input-position>s are specified, it is treated the same as two stops with the same <output-value>.",
+          "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-input-position",
+          "type": "type"
+        },
+        {
+          "name": "<easing-function>",
+          "prose": "When appearing in the first argument, specifies the “default” easing function to be used between each stop. When appearing between stops, specifies the easing function to be used between the two surrounding stops, overriding any default provided by a global <easing-function> argument. (It is analogous to animation-timing-function.) The input progress value to this easing function is the segment interpolation progress—​how far the interpolation progress is between the input positions of the nearest stops preceding and following it. For example, in color-interpolate(20%, 0%: red, ease-in-out, 80%: green, 100%: blue), the 20% interpolation progress becomes a 25% segment interpolation progress, as 20% is 25% of the way between 0% and 80%, the surrounding input positions.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function",
+          "type": "value",
+          "value": "<easing-function>"
+        },
+        {
+          "name": "<segment-options>",
+          "prose": "When appearing in the first argument, provides any type-specific interpolation options that apply to every segment in the interpolation map. When appearing between stops, provides any type-specific interpolation options that apply to the interpolation segment between the stops on either side of this argument, overriding any default provided by a corresponding global <segment-options> argument.",
+          "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-segment-options",
+          "type": "type"
+        }
+      ]
     },
     {
-      "name": "mix()",
-      "prose": "Interpolation of any two property values can be represented by the mix() mix notation, which supports two alternative syntax patterns:",
-      "href": "https://drafts.csswg.org/css-values-5/#funcdef-mix",
+      "name": "interpolate()",
+      "prose": "The interpolate() interpolation notation represents the interpolation of entire property values, which supports two alternative syntax patterns:",
+      "href": "https://drafts.csswg.org/css-values-5/#funcdef-interpolate",
       "type": "function",
-      "value": "mix( <progress> , <whole-value> , <whole-value> ) | mix( <progress> && of <keyframes-name> )"
+      "value": "interpolate( <progress-source> && [ by <easing-function> ]? && <easing-function>?, <input-position>{1,2} : <whole-value>, [ <easing-function>?, <input-position>{1,2} : <whole-value> ]# ) | interpolate( <progress-source> && [ by <easing-function> ]? && <easing-function>? of <keyframes-name> )",
+      "values": [
+        {
+          "name": "by",
+          "prose": "The interpolation progress given by <progress-source> may be optionally modified by the <easing-function> specified after the by keyword. It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to the interpolation map, analogous to animation-easing.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-by",
+          "type": "value",
+          "value": "by"
+        },
+        {
+          "name": "<input-position>",
+          "prose": "Represents an interpolation stop associating the specified input position(s) with the specified output values. As with the gradient functions, if two <input-position>s are specified, it is treated the same as two stops with the same <output-value>.",
+          "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-input-position",
+          "type": "type"
+        },
+        {
+          "name": "<easing-function>",
+          "prose": "When appearing in the first argument, specifies the “default” easing function to be used between each stop. When appearing between stops, specifies the easing function to be used between the two surrounding stops, overriding any default provided by a global <easing-function> argument. (It is analogous to animation-timing-function.) The input progress value to this easing function is the segment interpolation progress—​how far the interpolation progress is between the input positions of the nearest stops preceding and following it. For example, in color-interpolate(20%, 0%: red, ease-in-out, 80%: green, 100%: blue), the 20% interpolation progress becomes a 25% segment interpolation progress, as 20% is 25% of the way between 0% and 80%, the surrounding input positions.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function",
+          "type": "value",
+          "value": "<easing-function>"
+        },
+        {
+          "name": "<segment-options>",
+          "prose": "When appearing in the first argument, provides any type-specific interpolation options that apply to every segment in the interpolation map. When appearing between stops, provides any type-specific interpolation options that apply to the interpolation segment between the stops on either side of this argument, overriding any default provided by a corresponding global <segment-options> argument.",
+          "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-segment-options",
+          "type": "type"
+        }
+      ]
     },
     {
       "name": "first-valid()",
@@ -634,18 +767,88 @@
     },
     {
       "msg": "Missing definition",
-      "name": "mix-function()",
-      "value": "mix-function( <progress>, start-value, end-value )"
+      "name": "*mix()",
+      "value": "*mix( options? , [ value && <percentage>? ]# )"
     },
     {
       "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} )"
+      "name": "*interpolate()",
+      "value": "*interpolate( progress && global-options?, stop, [ between-options? , stop ]# )"
     },
     {
       "msg": "Missing definition",
-      "name": "<cross-fade()>",
-      "value": "cross-fade( <progress>, [ <image> | <color> ], [ <image> | <color> ] ) | cross-fade( <cf-image># )"
+      "name": "interpolate-function()",
+      "value": "interpolate-function( <progress-source> && [ by <easing-function> ]? && <easing-function>? && <segment-options>?, <input-position>{1,2} : <output-value> , [ [ <easing-function> || <segment-options> , ]? <input-position>{1,2} : <output-value> ]* )"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "<percentage>",
+      "prose": "Represents the interpolation progress as a percentage, with 0% computing to zero and 100% computing to 1.",
+      "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-percentage",
+      "type": "value",
+      "value": "<percentage>",
+      "for": "palette-interpolate()"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "<number>",
+      "prose": "Represents the interpolation progress as a number directly.",
+      "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-number",
+      "type": "value",
+      "value": "<number>",
+      "for": "palette-interpolate()"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "<dimension>",
+      "prose": "Represents the interpolation progress as a dimension, which is converted to a number as specified in § 7.2 Validation and Normalization.",
+      "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-dimension",
+      "type": "value",
+      "value": "<dimension>",
+      "for": "palette-interpolate()"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "<'animation-timeline'>",
+      "prose": "Represents the interpolation progress as the progress of the specified animation timeline. The values none and auto are invalid. [CSS-ANIMATIONS-2] [WEB-ANIMATIONS-2]",
+      "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-animation-timeline",
+      "type": "value",
+      "value": "<'animation-timeline'>",
+      "for": "palette-interpolate()"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "by",
+      "prose": "The interpolation progress given by <progress-source> may be optionally modified by the <easing-function> specified after the by keyword. It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to the interpolation map, analogous to animation-easing.",
+      "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-by",
+      "type": "value",
+      "value": "by",
+      "for": "palette-interpolate()"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "<input-position>",
+      "prose": "Represents an interpolation stop associating the specified input position(s) with the specified output values. As with the gradient functions, if two <input-position>s are specified, it is treated the same as two stops with the same <output-value>.",
+      "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-input-position",
+      "type": "type",
+      "for": "palette-interpolate()"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "<easing-function>",
+      "prose": "When appearing in the first argument, specifies the “default” easing function to be used between each stop. When appearing between stops, specifies the easing function to be used between the two surrounding stops, overriding any default provided by a global <easing-function> argument. (It is analogous to animation-timing-function.) The input progress value to this easing function is the segment interpolation progress—​how far the interpolation progress is between the input positions of the nearest stops preceding and following it. For example, in color-interpolate(20%, 0%: red, ease-in-out, 80%: green, 100%: blue), the 20% interpolation progress becomes a 25% segment interpolation progress, as 20% is 25% of the way between 0% and 80%, the surrounding input positions.",
+      "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function",
+      "type": "value",
+      "value": "<easing-function>",
+      "for": "palette-interpolate()"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "<segment-options>",
+      "prose": "When appearing in the first argument, provides any type-specific interpolation options that apply to every segment in the interpolation map. When appearing between stops, provides any type-specific interpolation options that apply to the interpolation segment between the stops on either side of this argument, overriding any default provided by a corresponding global <segment-options> argument.",
+      "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-segment-options",
+      "type": "type",
+      "for": "palette-interpolate()"
     }
   ]
 }

package/css-view-transitions-2.json

@@ -126,7 +126,8 @@
     {
       "name": ":active-view-transition",
       "prose": "The :active-view-transition pseudo-class applies to the root element of the document, if it has an active view transition.",
-      "href": "https://drafts.csswg.org/css-view-transitions-2/#active-view-transition-pseudo"
+      "href": "https://drafts.csswg.org/css-view-transitions-2/#active-view-transition-pseudo",
+      "value": ":active-view-transition"
     },
     {
       "name": ":active-view-transition-type()",

package/css-view-transitions.json

@@ -42,7 +42,8 @@
     {
       "name": "::view-transition",
       "prose": "The ::view-transition pseudo-element is a tree-abiding pseudo-element that is also a pseudo-element root. Its originating element is the document’s document element, and its containing block is the snapshot containing block.",
-      "href": "https://drafts.csswg.org/css-view-transitions-1/#selectordef-view-transition"
+      "href": "https://drafts.csswg.org/css-view-transitions-1/#selectordef-view-transition",
+      "value": "::view-transition"
     },
     {
       "name": "::view-transition-group()",

package/package.json

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