@webref/css 3.1.0 → 4.1.0

package/README.md

@@ -41,3 +41,5 @@ for (const [shortname, data] of Object.entries(parsedFiles)) {
 
 The following guarantees are provided by this package:
 - All CSS files can be parsed by the version of [CSSTree](https://github.com/csstree/csstree) used in `peerDependencies` in `package.json`, with the exception of a handful CSS value definitions that, although valid, are not yet supported by CSSTree.
+- No duplicate definitions of CSS properties provided that CSS extracts of [delta specs](https://github.com/w3c/browser-specs/#seriescomposition) are not taken into account (such extracts end with `-n.json`, where `n` is a level number).
+- CSS extracts contain a base definition of all CSS properties that get extended by other CSS property definitions (those for which `newValues` is set).

package/SVG.json

@@ -131,36 +131,6 @@
         "d"
       ]
     },
-    "inline-size": {
-      "name": "inline-size",
-      "value": "auto | <length-percentage>",
-      "initial": "auto",
-      "appliesTo": "‘text’ elements",
-      "inherited": "no",
-      "percentages": "Refer to the width (for horizontal text) or height (for vertical text) of the current SVG viewport (see Units)",
-      "media": "visual",
-      "computedValue": "an absolute length or percentage",
-      "animationType": "by computed value",
-      "styleDeclaration": [
-        "inline-size",
-        "inlineSize"
-      ]
-    },
-    "shape-inside": {
-      "name": "shape-inside",
-      "value": "auto | [ <basic-shape> | <uri> ]+",
-      "initial": "auto",
-      "appliesTo": "‘text’ elements",
-      "inherited": "no",
-      "percentages": "Relative to the ‘viewBox’",
-      "media": "visual",
-      "computedValue": "computed lengths for <shape>, the absolute URI for <uri>, otherwise as specified",
-      "animationType": "See Interpolation of Basic Shapes",
-      "styleDeclaration": [
-        "shape-inside",
-        "shapeInside"
-      ]
-    },
     "shape-subtract": {
       "name": "shape-subtract",
       "value": "none | [ <basic-shape>| <uri> ]+",
@@ -176,21 +146,6 @@
         "shapeSubtract"
       ]
     },
-    "shape-margin": {
-      "name": "shape-margin",
-      "value": "<length-percentage>",
-      "initial": "0",
-      "appliesTo": "‘text’ elements",
-      "inherited": "no",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "an absolute length",
-      "animationType": "by computed value",
-      "styleDeclaration": [
-        "shape-margin",
-        "shapeMargin"
-      ]
-    },
     "text-anchor": {
       "name": "text-anchor",
       "value": "start | middle | end",
@@ -206,169 +161,6 @@
         "textAnchor"
       ]
     },
-    "fill": {
-      "name": "fill",
-      "value": "<paint>",
-      "initial": "black",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "as specified, but with <color> values computed and <url> values made absolute",
-      "animationType": "by computed value",
-      "styleDeclaration": [
-        "fill"
-      ]
-    },
-    "fill-rule": {
-      "name": "fill-rule",
-      "value": "nonzero | evenodd",
-      "initial": "nonzero",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "as specified",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "fill-rule",
-        "fillRule"
-      ]
-    },
-    "fill-opacity": {
-      "name": "fill-opacity",
-      "value": "<'opacity'>",
-      "initial": "1",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "the specified value converted to a number, clamped to the range [0,1]",
-      "animationType": "by computed value",
-      "styleDeclaration": [
-        "fill-opacity",
-        "fillOpacity"
-      ]
-    },
-    "stroke": {
-      "name": "stroke",
-      "value": "<paint>",
-      "initial": "none",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "as specified, but with <color> values computed and <url> values made absolute",
-      "animationType": "by computed value",
-      "styleDeclaration": [
-        "stroke"
-      ]
-    },
-    "stroke-opacity": {
-      "name": "stroke-opacity",
-      "value": "<'opacity'>",
-      "initial": "1",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "the specified value converted to a number, clamped to the range [0,1]",
-      "animationType": "by computed value",
-      "styleDeclaration": [
-        "stroke-opacity",
-        "strokeOpacity"
-      ]
-    },
-    "stroke-width": {
-      "name": "stroke-width",
-      "value": "<length-percentage> | <number>",
-      "initial": "1px",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "refer to the normalized diagonal of the current SVG viewport (see Units)",
-      "media": "visual",
-      "computedValue": "an absolute length or percentage, numbers converted to absolute lengths first",
-      "animationType": "by computed value",
-      "styleDeclaration": [
-        "stroke-width",
-        "strokeWidth"
-      ]
-    },
-    "stroke-linecap": {
-      "name": "stroke-linecap",
-      "value": "butt | round | square",
-      "initial": "butt",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "as specified",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "stroke-linecap",
-        "strokeLinecap"
-      ]
-    },
-    "stroke-linejoin": {
-      "name": "stroke-linejoin",
-      "value": "miter | miter-clip | round | bevel | arcs",
-      "initial": "miter",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "as specified",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "stroke-linejoin",
-        "strokeLinejoin"
-      ]
-    },
-    "stroke-miterlimit": {
-      "name": "stroke-miterlimit",
-      "value": "<number>",
-      "initial": "4",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "as specified",
-      "animationType": "by computed value",
-      "styleDeclaration": [
-        "stroke-miterlimit",
-        "strokeMiterlimit"
-      ]
-    },
-    "stroke-dasharray": {
-      "name": "stroke-dasharray",
-      "value": "none | <dasharray>",
-      "initial": "none",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "refer to the normalized diagonal of the current SVG viewport (see Units)",
-      "media": "visual",
-      "computedValue": "as comma separated list of absolute lengths or percentages, numbers converted to absolute lengths first, or keyword specified",
-      "animationType": "See prose",
-      "styleDeclaration": [
-        "stroke-dasharray",
-        "strokeDasharray"
-      ]
-    },
-    "stroke-dashoffset": {
-      "name": "stroke-dashoffset",
-      "value": "<length-percentage> | <number>",
-      "initial": "0",
-      "appliesTo": "shapes and text content elements",
-      "inherited": "yes",
-      "percentages": "refer to the normalized diagonal of the current SVG viewport (see Units)",
-      "media": "visual",
-      "computedValue": "an absolute length or percentage, numbers converted to absolute lengths first",
-      "animationType": "by computed value",
-      "styleDeclaration": [
-        "stroke-dashoffset",
-        "strokeDashoffset"
-      ]
-    },
     "marker-start": {
       "name": "marker-start",
       "value": "none | <marker-ref>",
@@ -488,36 +280,6 @@
         "textRendering"
       ]
     },
-    "image-rendering": {
-      "name": "image-rendering",
-      "value": "auto | optimizeQuality | optimizeSpeed",
-      "initial": "auto",
-      "appliesTo": "images",
-      "inherited": "yes",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "as specified",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "image-rendering",
-        "imageRendering"
-      ]
-    },
-    "pointer-events": {
-      "name": "pointer-events",
-      "value": "auto | bounding-box | visiblePainted | visibleFill | visibleStroke | visible | painted | fill | stroke | all | none",
-      "initial": "auto",
-      "appliesTo": "container elements, graphics elements and ‘use’",
-      "inherited": "yes",
-      "percentages": "N/A",
-      "media": "visual",
-      "computedValue": "as specified",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "pointer-events",
-        "pointerEvents"
-      ]
-    },
     "stop-color": {
       "name": "stop-color",
       "styleDeclaration": [

package/css-color.json

@@ -45,13 +45,15 @@
       "value": "<number> | <angle> | none"
     },
     "<rgb()>": {
-      "value": "rgb( [<percentage> | none]{3} [ / [<alpha-value> | none] ]? ) | rgb( [<number> | none]{3} [ / [<alpha-value> | none] ]? )"
+      "value": "rgb( [<percentage> | none]{3} [ / [<alpha-value> | none] ]? ) | rgb( [<number> | none]{3} [ / [<alpha-value> | none] ]? )",
+      "legacyValue": "rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )"
     },
     "<alpha-value>": {
       "value": "<number> | <percentage>"
     },
     "<hsl()>": {
-      "value": "hsl( [<hue> | none] [<percentage> | none] [<percentage> | none] [ / [<alpha-value> | none] ]? )"
+      "value": "hsl( [<hue> | none] [<percentage> | none] [<percentage> | none] [ / [<alpha-value> | none] ]? )",
+      "legacyValue": "hsl( <hue>, <percentage>, <percentage>, <alpha-value>? )"
     },
     "<hwb()>": {
       "value": "hwb( [<hue> | none] [<percentage> | none] [<percentage> | none] [ / [<alpha-value> | none] ]? )"

package/css-easing.json

@@ -1,6 +1,6 @@
 {
   "spec": {
-    "title": "CSS Easing Functions Level 1",
+    "title": "CSS Easing Functions Level 2",
     "url": "https://drafts.csswg.org/css-easing/"
   },
   "properties": {},

package/css-flexbox.json

@@ -114,66 +114,6 @@
         "flex-basis",
         "flexBasis"
       ]
-    },
-    "justify-content": {
-      "name": "justify-content",
-      "value": "flex-start | flex-end | center | space-between | space-around",
-      "initial": "flex-start",
-      "appliesTo": "flex containers",
-      "inherited": "no",
-      "percentages": "n/a",
-      "computedValue": "specified keyword",
-      "canonicalOrder": "per grammar",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "justify-content",
-        "justifyContent"
-      ]
-    },
-    "align-items": {
-      "name": "align-items",
-      "value": "flex-start | flex-end | center | baseline | stretch",
-      "initial": "stretch",
-      "appliesTo": "flex containers",
-      "inherited": "no",
-      "percentages": "n/a",
-      "computedValue": "specified keyword",
-      "canonicalOrder": "per grammar",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "align-items",
-        "alignItems"
-      ]
-    },
-    "align-self": {
-      "name": "align-self",
-      "value": "auto | flex-start | flex-end | center | baseline | stretch",
-      "initial": "auto",
-      "appliesTo": "flex items",
-      "inherited": "no",
-      "percentages": "n/a",
-      "computedValue": "specified keyword",
-      "canonicalOrder": "per grammar",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "align-self",
-        "alignSelf"
-      ]
-    },
-    "align-content": {
-      "name": "align-content",
-      "value": "flex-start | flex-end | center | space-between | space-around | stretch",
-      "initial": "stretch",
-      "appliesTo": "multi-line flex containers",
-      "inherited": "no",
-      "percentages": "n/a",
-      "computedValue": "specified keyword",
-      "canonicalOrder": "per grammar",
-      "animationType": "discrete",
-      "styleDeclaration": [
-        "align-content",
-        "alignContent"
-      ]
     }
   },
   "descriptors": {},

package/css-gcpm.json

@@ -4,20 +4,6 @@
     "url": "https://drafts.csswg.org/css-gcpm/"
   },
   "properties": {
-    "string-set": {
-      "name": "string-set",
-      "value": "[ <custom-ident> <content-list> ]# | none",
-      "initial": "none",
-      "appliesTo": "all elements, but not pseudo-elements",
-      "inherited": "no",
-      "percentages": "N/A",
-      "computedValue": "specified value",
-      "canonicalOrder": "per grammar",
-      "styleDeclaration": [
-        "string-set",
-        "stringSet"
-      ]
-    },
     "position": {
       "name": "position",
       "newValues": "running()",
@@ -70,12 +56,6 @@
   },
   "descriptors": {},
   "valuespaces": {
-    "<content()>": {
-      "value": "content([text | before | after | first-letter ])"
-    },
-    "<string()>": {
-      "value": "string( <custom-ident> , [ first | start | last | first-except ]? )"
-    },
     "<running()>": {
       "value": "running( <custom-ident> )"
     },

package/css-logical.json

@@ -218,110 +218,6 @@
         "marginInline"
       ]
     },
-    "inset-block-start": {
-      "name": "inset-block-start",
-      "value": "<'top'>",
-      "initial": "auto",
-      "appliesTo": "positioned elements",
-      "inherited": "no",
-      "percentages": "As for the corresponding physical property",
-      "computedValue": "Same as corresponding top/right/bottom/left properties",
-      "canonicalOrder": "per grammar",
-      "animationType": "by computed value type",
-      "styleDeclaration": [
-        "inset-block-start",
-        "insetBlockStart"
-      ]
-    },
-    "inset-block-end": {
-      "name": "inset-block-end",
-      "value": "<'top'>",
-      "initial": "auto",
-      "appliesTo": "positioned elements",
-      "inherited": "no",
-      "percentages": "As for the corresponding physical property",
-      "computedValue": "Same as corresponding top/right/bottom/left properties",
-      "canonicalOrder": "per grammar",
-      "animationType": "by computed value type",
-      "styleDeclaration": [
-        "inset-block-end",
-        "insetBlockEnd"
-      ]
-    },
-    "inset-inline-start": {
-      "name": "inset-inline-start",
-      "value": "<'top'>",
-      "initial": "auto",
-      "appliesTo": "positioned elements",
-      "inherited": "no",
-      "percentages": "As for the corresponding physical property",
-      "computedValue": "Same as corresponding top/right/bottom/left properties",
-      "canonicalOrder": "per grammar",
-      "animationType": "by computed value type",
-      "styleDeclaration": [
-        "inset-inline-start",
-        "insetInlineStart"
-      ]
-    },
-    "inset-inline-end": {
-      "name": "inset-inline-end",
-      "value": "<'top'>",
-      "initial": "auto",
-      "appliesTo": "positioned elements",
-      "inherited": "no",
-      "percentages": "As for the corresponding physical property",
-      "computedValue": "Same as corresponding top/right/bottom/left properties",
-      "canonicalOrder": "per grammar",
-      "animationType": "by computed value type",
-      "styleDeclaration": [
-        "inset-inline-end",
-        "insetInlineEnd"
-      ]
-    },
-    "inset-block": {
-      "name": "inset-block",
-      "value": "<'top'>{1,2}",
-      "initial": "see individual properties",
-      "appliesTo": "see individual properties",
-      "inherited": "see individual properties",
-      "percentages": "see individual properties",
-      "computedValue": "see individual properties",
-      "animationType": "see individual properties",
-      "canonicalOrder": "per grammar",
-      "styleDeclaration": [
-        "inset-block",
-        "insetBlock"
-      ]
-    },
-    "inset-inline": {
-      "name": "inset-inline",
-      "value": "<'top'>{1,2}",
-      "initial": "see individual properties",
-      "appliesTo": "see individual properties",
-      "inherited": "see individual properties",
-      "percentages": "see individual properties",
-      "computedValue": "see individual properties",
-      "animationType": "see individual properties",
-      "canonicalOrder": "per grammar",
-      "styleDeclaration": [
-        "inset-inline",
-        "insetInline"
-      ]
-    },
-    "inset": {
-      "name": "inset",
-      "value": "<'top'>{1,4}",
-      "initial": "see individual properties",
-      "appliesTo": "see individual properties",
-      "inherited": "see individual properties",
-      "percentages": "see individual properties",
-      "computedValue": "see individual properties",
-      "animationType": "see individual properties",
-      "canonicalOrder": "per grammar",
-      "styleDeclaration": [
-        "inset"
-      ]
-    },
     "padding-block-start": {
       "name": "padding-block-start",
       "value": "<'padding-top'>",

package/css-round-display.json

@@ -4,21 +4,6 @@
     "url": "https://drafts.csswg.org/css-round-display/"
   },
   "properties": {
-    "shape-inside": {
-      "name": "shape-inside",
-      "value": "auto | outside-shape | [ <basic-shape> || shape-box ] | <image> | display",
-      "initial": "auto",
-      "appliesTo": "block-level elements",
-      "inherited": "no",
-      "percentages": "n/a",
-      "computedValue": "computed lengths for <basic-shape>, the absolute URI for <uri>, otherwise as specified",
-      "canonicalOrder": "per grammar",
-      "animatable": "as defined for <basic-shape>, otherwise discrete",
-      "styleDeclaration": [
-        "shape-inside",
-        "shapeInside"
-      ]
-    },
     "border-boundary": {
       "name": "border-boundary",
       "value": "none | parent | display",

package/css-scroll-snap-2.json

@@ -6,7 +6,7 @@
   "properties": {
     "scroll-start": {
       "name": "scroll-start",
-      "value": "[ auto | start | end | center | <length-percentage> ]{1,2}",
+      "value": "[ auto | start | end | center | left | right | top | bottom | <length-percentage> ]{1,2}",
       "initial": "see individual properties",
       "appliesTo": "see individual properties",
       "inherited": "see individual properties",

package/css-ui.json

@@ -94,7 +94,7 @@
     },
     "cursor": {
       "name": "cursor",
-      "value": "[ [<url> [<x> <y>]?,]* [ auto | default | none | context-menu | help | pointer | progress | wait | cell | crosshair | text | vertical-text | alias | copy | move | no-drop | not-allowed | grab | grabbing | e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize | sw-resize | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize | col-resize | row-resize | all-scroll | zoom-in | zoom-out ] ]",
+      "value": "[ [ <url> | <url-set> ] [<x> <y>]? ]#? [ auto | default | none | context-menu | help | pointer | progress | wait | cell | crosshair | text | vertical-text | alias | copy | move | no-drop | not-allowed | grab | grabbing | e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize | sw-resize | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize | col-resize | row-resize | all-scroll | zoom-in | zoom-out ]",
       "initial": "auto",
       "appliesTo": "all elements",
       "inherited": "yes",
@@ -257,7 +257,7 @@
     },
     "appearance": {
       "name": "appearance",
-      "value": "none | auto | textfield | menulist-button | <compat-auto>",
+      "value": "none | auto | <compat-auto> | <compat-special>",
       "initial": "none",
       "appliesTo": "all elements",
       "inherited": "no",
@@ -306,6 +306,9 @@
     "<compat-auto>": {
       "value": "searchfield | textarea | push-button | slider-horizontal | checkbox | radio | square-button | menulist | listbox | meter | progress-bar | button"
     },
+    "<compat-special>": {
+      "value": "textfield | menulist-button"
+    },
     "<id>": {
       "prose": "The <id> value is an ID selector [SELECT]. In response to directional navigation input corresponding to the property, the focus is navigated to the first element in tree order matching the selector. If this refers to the currently focused element, the directional navigation input respective to the nav- property is ignored — there is no need to refocus the same element. If no element matches the selector, the user agent automatically determines which element to navigate the focus to. If the focus is navigated to an element that was not otherwise focusable, it becomes focusable only as the result of this directional navigation, and the :focus pseudo-class matches the element while it is focused as such."
     },

package/package.json

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