From f17ee0eeabd36682fe6600433f38e534327d870c Mon Sep 17 00:00:00 2001 From: Bogdan Chadkin Date: Fri, 18 Jul 2025 17:37:19 +0200 Subject: [PATCH 1/3] feat: support svg properties in css Ref https://github.com/webstudio-is/webstudio/issues/5258 Newer mdn-data contains all stylable svg properties (they finally got through some documentation and implementation process). Tweaked all experimental stuff and ditched obsolete properties. --- packages/css-data/bin/mdn-data.ts | 34 +- packages/css-data/package.json | 2 +- .../__generated__/animatable-properties.ts | 42 +- .../src/__generated__/keyword-values.ts | 1879 ++++++++++++----- .../css-data/src/__generated__/properties.ts | 630 ++++-- .../src/__generated__/pseudo-elements.ts | 32 +- .../src/__generated__/shorthand-properties.ts | 3 + packages/css-data/src/custom-data.ts | 42 +- .../css-engine/src/__generated__/types.ts | 148 +- pnpm-lock.yaml | 10 +- 10 files changed, 2018 insertions(+), 804 deletions(-) diff --git a/packages/css-data/bin/mdn-data.ts b/packages/css-data/bin/mdn-data.ts index 6db7ab1341a9..d6604a46c4b8 100755 --- a/packages/css-data/bin/mdn-data.ts +++ b/packages/css-data/bin/mdn-data.ts @@ -235,25 +235,18 @@ const writeToFile = (fileName: string, constant: string, data: unknown) => { }; const supportedExperimentalProperties = [ - "appearance", - "aspect-ratio", + "field-sizing", "text-size-adjust", - "-webkit-line-clamp", - "background-position-x", - "background-position-y", "-webkit-tap-highlight-color", "-webkit-overflow-scrolling", - "transition-behavior", - "offset-position", - // https://github.com/mdn/data/pull/759 - // offset-anchor is standard according to mdn. - // But the mdn_url is missing from its config which is skipping othe starndard check. - "offset-anchor", ]; // Properties we don't support in this form. const unsupportedProperties = [ "--*", + "-webkit-text-fill-color", + "-webkit-text-stroke-color", + "-webkit-text-stroke-width", // shorthand properties "all", "font-synthesis", @@ -262,6 +255,12 @@ const unsupportedProperties = [ "white-space", "text-wrap", "background-position", + "border-block-style", + "border-block-width", + "border-block-color", + "border-inline-style", + "border-inline-width", + "border-inline-color", ]; type FilteredProperties = { [property: string]: Value }; @@ -334,7 +333,7 @@ const getPropertiesData = ( const unitGroups = new Set(); walkSyntax(config.syntax, (node) => { if (node.type === "Type") { - if (node.name === "integer" || node.name === "number") { + if (node.name === "number-token" || node.name === "number") { unitGroups.add("number"); return; } @@ -374,10 +373,6 @@ const pseudoElements = Object.keys(selectors) const getKeywordValues = (filteredProperties: FilteredProperties) => { const result = { ...customData.keywordValues }; - // Non-standard properties are just missing in mdn data - const nonStandardValues = { - "background-clip": ["text"], - }; // https://www.w3.org/TR/css-values/#common-keywords const commonKeywords = ["initial", "inherit", "unset"]; @@ -393,13 +388,6 @@ const getKeywordValues = (filteredProperties: FilteredProperties) => { } }); - if (property in nonStandardValues) { - for (const nonStandartKeyword of nonStandardValues[ - property as keyof typeof nonStandardValues - ]) { - keywords.add(nonStandartKeyword); - } - } for (const commonKeyword of commonKeywords) { // Delete to add commonKeyword at the end of the set keywords.delete(commonKeyword); diff --git a/packages/css-data/package.json b/packages/css-data/package.json index a95da3ba2866..0eeb6a52cea3 100644 --- a/packages/css-data/package.json +++ b/packages/css-data/package.json @@ -19,7 +19,7 @@ "@types/css-tree": "^2.3.1", "@webstudio-is/tsconfig": "workspace:*", "html-tags": "^4.0.0", - "mdn-data": "2.8.0", + "mdn-data": "2.23.0", "vitest": "^3.1.2", "zod": "^3.24.2" }, diff --git a/packages/css-data/src/__generated__/animatable-properties.ts b/packages/css-data/src/__generated__/animatable-properties.ts index 5be3e343979c..fe6f94950494 100644 --- a/packages/css-data/src/__generated__/animatable-properties.ts +++ b/packages/css-data/src/__generated__/animatable-properties.ts @@ -10,8 +10,6 @@ export const animatableProperties = [ "background-position-y", "background-size", "block-size", - "border-block-color", - "border-block-width", "border-block-end-color", "border-block-end-width", "border-block-start-color", @@ -25,8 +23,6 @@ export const animatableProperties = [ "border-image-outset", "border-image-slice", "border-image-width", - "border-inline-color", - "border-inline-width", "border-inline-end-color", "border-inline-end-width", "border-inline-start-color", @@ -44,7 +40,6 @@ export const animatableProperties = [ "bottom", "box-shadow", "caret-color", - "clip", "clip-path", "color", "column-count", @@ -61,16 +56,23 @@ export const animatableProperties = [ "counter-increment", "counter-reset", "counter-set", + "cx", + "cy", + "d", "display", + "fill", + "fill-opacity", "filter", "flex-basis", "flex-grow", "flex-shrink", - "font-variation-settings", + "flood-color", + "flood-opacity", + "font-palette", "font-size", "font-size-adjust", - "font-stretch", "font-style", + "font-variation-settings", "font-weight", "grid-auto-columns", "grid-auto-rows", @@ -78,6 +80,7 @@ export const animatableProperties = [ "grid-template-rows", "height", "hyphenate-limit-chars", + "initial-letter", "inline-size", "inset-block-end", "inset-block-start", @@ -85,6 +88,8 @@ export const animatableProperties = [ "inset-inline-start", "left", "letter-spacing", + "lighting-color", + "line-clamp", "line-height", "margin-block-end", "margin-block-start", @@ -127,31 +132,39 @@ export const animatableProperties = [ "padding-top", "perspective", "perspective-origin", + "r", "right", "rotate", "row-gap", + "ruby-align", + "rx", + "ry", "scale", - "scrollbar-color", - "scrollbar-width", - "scroll-margin-block-start", "scroll-margin-block-end", + "scroll-margin-block-start", "scroll-margin-bottom", - "scroll-margin-inline-start", "scroll-margin-inline-end", + "scroll-margin-inline-start", "scroll-margin-left", "scroll-margin-right", "scroll-margin-top", - "scroll-padding-block-start", "scroll-padding-block-end", + "scroll-padding-block-start", "scroll-padding-bottom", - "scroll-padding-inline-start", "scroll-padding-inline-end", + "scroll-padding-inline-start", "scroll-padding-left", "scroll-padding-right", "scroll-padding-top", + "scrollbar-color", "shape-image-threshold", "shape-margin", "shape-outside", + "stroke-dasharray", + "stroke-dashoffset", + "stroke-miterlimit", + "stroke-opacity", + "stroke-width", "tab-size", "text-decoration-color", "text-decoration-thickness", @@ -169,6 +182,7 @@ export const animatableProperties = [ "widows", "width", "word-spacing", + "x", + "y", "z-index", - "zoom", ] as const; diff --git a/packages/css-data/src/__generated__/keyword-values.ts b/packages/css-data/src/__generated__/keyword-values.ts index e19427582bc6..569c436de38d 100644 --- a/packages/css-data/src/__generated__/keyword-values.ts +++ b/packages/css-data/src/__generated__/keyword-values.ts @@ -28,7 +28,6 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "text-wrap-mode": ["wrap", "nowrap", "initial", "inherit", "unset"], "-webkit-line-clamp": ["none", "initial", "inherit", "unset"], "-webkit-overflow-scrolling": [ "auto", @@ -38,7 +37,6 @@ export const keywordValues: KeywordValues = { "unset", ], "-webkit-tap-highlight-color": [ - "transparent", "aliceblue", "antiquewhite", "aqua", @@ -187,14 +185,33 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], "accent-color": [ "auto", - "transparent", "aliceblue", "antiquewhite", "aqua", @@ -343,7 +360,27 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", @@ -407,6 +444,27 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], + "alignment-baseline": [ + "baseline", + "alphabetic", + "ideographic", + "middle", + "central", + "mathematical", + "text-before-edge", + "text-after-edge", + "initial", + "inherit", + "unset", + ], + "animation-composition": [ + "replace", + "add", + "accumulate", + "initial", + "inherit", + "unset", + ], "animation-delay": ["initial", "inherit", "unset"], "animation-direction": [ "normal", @@ -417,7 +475,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "animation-duration": ["initial", "inherit", "unset"], + "animation-duration": ["auto", "initial", "inherit", "unset"], "animation-fill-mode": [ "none", "forwards", @@ -496,16 +554,16 @@ export const keywordValues: KeywordValues = { "unset", ], "background-clip": [ - "border-box", - "padding-box", "content-box", + "padding-box", + "border-box", + "border-area", "text", "initial", "inherit", "unset", ], "background-color": [ - "transparent", "aliceblue", "antiquewhite", "aqua", @@ -654,16 +712,36 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], "background-image": ["none", "initial", "inherit", "unset"], "background-origin": [ - "border-box", - "padding-box", "content-box", + "padding-box", + "border-box", "initial", "inherit", "unset", @@ -716,8 +794,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-block-color": [ - "transparent", + "border-block-end-color": [ "aliceblue", "antiquewhite", "aqua", @@ -866,12 +943,32 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - "border-block-style": [ + "border-block-end-style": [ "none", "hidden", "dotted", @@ -886,7 +983,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-block-width": [ + "border-block-end-width": [ "thin", "medium", "thick", @@ -894,8 +991,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-block-end-color": [ - "transparent", + "border-block-start-color": [ "aliceblue", "antiquewhite", "aqua", @@ -1044,12 +1140,32 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - "border-block-end-style": [ + "border-block-start-style": [ "none", "hidden", "dotted", @@ -1064,7 +1180,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-block-end-width": [ + "border-block-start-width": [ "thin", "medium", "thick", @@ -1072,8 +1188,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-block-start-color": [ - "transparent", + "border-bottom-color": [ "aliceblue", "antiquewhite", "aqua", @@ -1222,12 +1337,34 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - "border-block-start-style": [ + "border-bottom-left-radius": ["initial", "inherit", "unset"], + "border-bottom-right-radius": ["initial", "inherit", "unset"], + "border-bottom-style": [ "none", "hidden", "dotted", @@ -1242,7 +1379,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-block-start-width": [ + "border-bottom-width": [ "thin", "medium", "thick", @@ -1250,8 +1387,23 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-bottom-color": [ - "transparent", + "border-collapse": ["collapse", "separate", "initial", "inherit", "unset"], + "border-end-end-radius": ["initial", "inherit", "unset"], + "border-end-start-radius": ["initial", "inherit", "unset"], + "border-image-outset": ["initial", "inherit", "unset"], + "border-image-repeat": [ + "stretch", + "repeat", + "round", + "space", + "initial", + "inherit", + "unset", + ], + "border-image-slice": ["fill", "initial", "inherit", "unset"], + "border-image-source": ["none", "initial", "inherit", "unset"], + "border-image-width": ["auto", "initial", "inherit", "unset"], + "border-inline-end-color": [ "aliceblue", "antiquewhite", "aqua", @@ -1400,14 +1552,32 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - "border-bottom-left-radius": ["initial", "inherit", "unset"], - "border-bottom-right-radius": ["initial", "inherit", "unset"], - "border-bottom-style": [ + "border-inline-end-style": [ "none", "hidden", "dotted", @@ -1422,7 +1592,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-bottom-width": [ + "border-inline-end-width": [ "thin", "medium", "thick", @@ -1430,24 +1600,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-collapse": ["collapse", "separate", "initial", "inherit", "unset"], - "border-end-end-radius": ["initial", "inherit", "unset"], - "border-end-start-radius": ["initial", "inherit", "unset"], - "border-image-outset": ["initial", "inherit", "unset"], - "border-image-repeat": [ - "stretch", - "repeat", - "round", - "space", - "initial", - "inherit", - "unset", - ], - "border-image-slice": ["fill", "initial", "inherit", "unset"], - "border-image-source": ["none", "initial", "inherit", "unset"], - "border-image-width": ["auto", "initial", "inherit", "unset"], - "border-inline-color": [ - "transparent", + "border-inline-start-color": [ "aliceblue", "antiquewhite", "aqua", @@ -1596,12 +1749,32 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - "border-inline-style": [ + "border-inline-start-style": [ "none", "hidden", "dotted", @@ -1616,7 +1789,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-inline-width": [ + "border-inline-start-width": [ "thin", "medium", "thick", @@ -1624,8 +1797,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-inline-end-color": [ - "transparent", + "border-left-color": [ "aliceblue", "antiquewhite", "aqua", @@ -1774,12 +1946,32 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - "border-inline-end-style": [ + "border-left-style": [ "none", "hidden", "dotted", @@ -1794,7 +1986,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-inline-end-width": [ + "border-left-width": [ "thin", "medium", "thick", @@ -1802,8 +1994,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-inline-start-color": [ - "transparent", + "border-right-color": [ "aliceblue", "antiquewhite", "aqua", @@ -1952,12 +2143,32 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - "border-inline-start-style": [ + "border-right-style": [ "none", "hidden", "dotted", @@ -1972,7 +2183,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-inline-start-width": [ + "border-right-width": [ "thin", "medium", "thick", @@ -1980,8 +2191,10 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-left-color": [ - "transparent", + "border-spacing": ["initial", "inherit", "unset"], + "border-start-end-radius": ["initial", "inherit", "unset"], + "border-start-start-radius": ["initial", "inherit", "unset"], + "border-top-color": [ "aliceblue", "antiquewhite", "aqua", @@ -2130,12 +2343,34 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - "border-left-style": [ + "border-top-left-radius": ["initial", "inherit", "unset"], + "border-top-right-radius": ["initial", "inherit", "unset"], + "border-top-style": [ "none", "hidden", "dotted", @@ -2150,7 +2385,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-left-width": [ + "border-top-width": [ "thin", "medium", "thick", @@ -2158,8 +2393,11 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "border-right-color": [ - "transparent", + bottom: ["auto", "initial", "inherit", "unset"], + "box-decoration-break": ["slice", "clone", "initial", "inherit", "unset"], + "box-shadow": [ + "none", + "inset", "aliceblue", "antiquewhite", "aqua", @@ -2308,39 +2546,83 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - "border-right-style": [ - "none", - "hidden", - "dotted", - "dashed", - "solid", - "double", - "groove", - "ridge", - "inset", - "outset", + "box-sizing": ["content-box", "border-box", "initial", "inherit", "unset"], + "break-after": [ + "auto", + "avoid", + "always", + "all", + "avoid-page", + "page", + "left", + "right", + "recto", + "verso", + "avoid-column", + "column", + "avoid-region", + "region", "initial", "inherit", "unset", ], - "border-right-width": [ - "thin", - "medium", - "thick", + "break-before": [ + "auto", + "avoid", + "always", + "all", + "avoid-page", + "page", + "left", + "right", + "recto", + "verso", + "avoid-column", + "column", + "avoid-region", + "region", "initial", "inherit", "unset", ], - "border-spacing": ["initial", "inherit", "unset"], - "border-start-end-radius": ["initial", "inherit", "unset"], - "border-start-start-radius": ["initial", "inherit", "unset"], - "border-top-color": [ - "transparent", + "break-inside": [ + "auto", + "avoid", + "avoid-page", + "avoid-column", + "avoid-region", + "initial", + "inherit", + "unset", + ], + "caption-side": ["top", "bottom", "initial", "inherit", "unset"], + "caret-color": [ + "auto", "aliceblue", "antiquewhite", "aqua", @@ -2489,42 +2771,57 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - "border-top-left-radius": ["initial", "inherit", "unset"], - "border-top-right-radius": ["initial", "inherit", "unset"], - "border-top-style": [ + clear: [ "none", - "hidden", - "dotted", - "dashed", - "solid", - "double", - "groove", - "ridge", - "inset", - "outset", + "left", + "right", + "both", + "inline-start", + "inline-end", "initial", "inherit", "unset", ], - "border-top-width": [ - "thin", - "medium", - "thick", + "clip-path": [ + "content-box", + "padding-box", + "border-box", + "margin-box", + "fill-box", + "stroke-box", + "view-box", + "none", "initial", "inherit", "unset", ], - bottom: ["auto", "initial", "inherit", "unset"], - "box-decoration-break": ["slice", "clone", "initial", "inherit", "unset"], - "box-shadow": [ - "none", - "inset", - "transparent", + "clip-rule": ["nonzero", "evenodd", "initial", "inherit", "unset"], + color: [ "aliceblue", "antiquewhite", "aqua", @@ -2673,74 +2970,52 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", - "initial", - "inherit", - "unset", - ], - "box-sizing": ["content-box", "border-box", "initial", "inherit", "unset"], - "break-after": [ + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", + "initial", + "inherit", + "unset", + ], + "color-interpolation-filters": [ "auto", - "avoid", - "always", - "all", - "avoid-page", - "page", - "left", - "right", - "recto", - "verso", - "avoid-column", - "column", - "avoid-region", - "region", + "sRGB", + "linearRGB", "initial", "inherit", "unset", ], - "break-before": [ - "auto", - "avoid", - "always", - "all", - "avoid-page", - "page", - "left", - "right", - "recto", - "verso", - "avoid-column", - "column", - "avoid-region", - "region", - "initial", - "inherit", - "unset", - ], - "break-inside": [ - "auto", - "avoid", - "avoid-page", - "avoid-column", - "avoid-region", - "initial", - "inherit", - "unset", - ], - "caption-side": [ - "top", - "bottom", - "block-start", - "block-end", - "inline-start", - "inline-end", + "color-scheme": [ + "normal", + "light", + "dark", + "only", "initial", "inherit", "unset", ], - "caret-color": [ - "auto", - "transparent", + "column-count": ["auto", "initial", "inherit", "unset"], + "column-fill": ["auto", "balance", "initial", "inherit", "unset"], + "column-gap": ["normal", "initial", "inherit", "unset"], + "column-rule-color": [ "aliceblue", "antiquewhite", "aqua", @@ -2889,38 +3164,215 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], - clear: [ + "column-rule-style": [ "none", - "left", - "right", - "both", - "inline-start", - "inline-end", + "hidden", + "dotted", + "dashed", + "solid", + "double", + "groove", + "ridge", + "inset", + "outset", "initial", "inherit", "unset", ], - clip: ["auto", "initial", "inherit", "unset"], - "clip-path": [ - "border-box", - "padding-box", - "content-box", - "margin-box", - "fill-box", - "stroke-box", - "view-box", + "column-rule-width": [ + "thin", + "medium", + "thick", + "initial", + "inherit", + "unset", + ], + "column-span": ["none", "all", "initial", "inherit", "unset"], + "column-width": ["auto", "initial", "inherit", "unset"], + contain: [ + "none", + "strict", + "content", + "size", + "inline-size", + "layout", + "style", + "paint", + "initial", + "inherit", + "unset", + ], + "contain-intrinsic-block-size": [ + "auto", "none", "initial", "inherit", "unset", ], - color: [ - "transparent", + "contain-intrinsic-height": ["auto", "none", "initial", "inherit", "unset"], + "contain-intrinsic-inline-size": [ + "auto", + "none", + "initial", + "inherit", + "unset", + ], + "contain-intrinsic-width": ["auto", "none", "initial", "inherit", "unset"], + "container-name": ["none", "initial", "inherit", "unset"], + "container-type": [ + "normal", + "size", + "inline-size", + "scroll-state", + "initial", + "inherit", + "unset", + ], + content: [ + "normal", + "none", + "contents", + "open-quote", + "close-quote", + "no-open-quote", + "no-close-quote", + "initial", + "inherit", + "unset", + ], + "content-visibility": [ + "visible", + "auto", + "hidden", + "initial", + "inherit", + "unset", + ], + "counter-increment": ["none", "initial", "inherit", "unset"], + "counter-reset": ["none", "initial", "inherit", "unset"], + "counter-set": ["none", "initial", "inherit", "unset"], + cursor: [ + "auto", + "default", + "none", + "context-menu", + "help", + "pointer", + "progress", + "wait", + "cell", + "crosshair", + "text", + "vertical-text", + "alias", + "copy", + "move", + "no-drop", + "not-allowed", + "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", + "grab", + "grabbing", + "initial", + "inherit", + "unset", + ], + cx: ["initial", "inherit", "unset"], + cy: ["initial", "inherit", "unset"], + d: ["none", "initial", "inherit", "unset"], + direction: ["ltr", "rtl", "initial", "inherit", "unset"], + display: [ + "block", + "inline", + "run-in", + "flow", + "flow-root", + "table", + "flex", + "grid", + "ruby", + "list-item", + "table-row-group", + "table-header-group", + "table-footer-group", + "table-row", + "table-cell", + "table-column-group", + "table-column", + "table-caption", + "ruby-base", + "ruby-text", + "ruby-base-container", + "ruby-text-container", + "contents", + "none", + "inline-block", + "inline-list-item", + "inline-table", + "inline-flex", + "inline-grid", + "initial", + "inherit", + "unset", + ], + "dominant-baseline": [ + "auto", + "text-bottom", + "alphabetic", + "ideographic", + "middle", + "central", + "mathematical", + "hanging", + "text-top", + "initial", + "inherit", + "unset", + ], + "empty-cells": ["show", "hide", "initial", "inherit", "unset"], + "field-sizing": ["content", "fixed", "initial", "inherit", "unset"], + fill: [ + "none", "aliceblue", "antiquewhite", "aqua", @@ -3069,32 +3521,76 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", + "context-fill", + "context-stroke", + "initial", + "inherit", + "unset", + ], + "fill-opacity": ["initial", "inherit", "unset"], + "fill-rule": ["nonzero", "evenodd", "initial", "inherit", "unset"], + filter: ["none", "initial", "inherit", "unset"], + "flex-basis": [ + "content", + "auto", + "min-content", + "max-content", + "fit-content", "initial", "inherit", "unset", ], - "color-scheme": [ - "normal", - "light", - "dark", - "only", + "flex-direction": [ + "row", + "row-reverse", + "column", + "column-reverse", "initial", "inherit", "unset", ], - "column-count": ["auto", "initial", "inherit", "unset"], - "column-fill": [ - "auto", - "balance", - "balance-all", + "flex-grow": ["initial", "inherit", "unset"], + "flex-shrink": ["initial", "inherit", "unset"], + "flex-wrap": [ + "nowrap", + "wrap", + "wrap-reverse", "initial", "inherit", "unset", ], - "column-gap": ["normal", "initial", "inherit", "unset"], - "column-rule-color": [ - "transparent", + float: [ + "left", + "right", + "none", + "inline-start", + "inline-end", + "initial", + "inherit", + "unset", + ], + "flood-color": [ "aliceblue", "antiquewhite", "aqua", @@ -3243,221 +3739,46 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", - "initial", - "inherit", - "unset", - ], - "column-rule-style": [ - "none", - "hidden", - "dotted", - "dashed", - "solid", - "double", - "groove", - "ridge", - "inset", - "outset", - "initial", - "inherit", - "unset", - ], - "column-rule-width": [ - "thin", - "medium", - "thick", - "initial", - "inherit", - "unset", - ], - "column-span": ["none", "all", "initial", "inherit", "unset"], - "column-width": ["auto", "initial", "inherit", "unset"], - contain: [ - "none", - "strict", - "content", - "size", - "inline-size", - "layout", - "style", - "paint", - "initial", - "inherit", - "unset", - ], - "contain-intrinsic-block-size": [ - "auto", - "none", - "initial", - "inherit", - "unset", - ], - "contain-intrinsic-height": ["auto", "none", "initial", "inherit", "unset"], - "contain-intrinsic-inline-size": [ - "auto", - "none", - "initial", - "inherit", - "unset", - ], - "contain-intrinsic-width": ["auto", "none", "initial", "inherit", "unset"], - "container-name": ["none", "initial", "inherit", "unset"], - "container-type": [ - "normal", - "size", - "inline-size", - "initial", - "inherit", - "unset", - ], - content: [ - "normal", - "none", - "contents", - "open-quote", - "close-quote", - "no-open-quote", - "no-close-quote", - "initial", - "inherit", - "unset", - ], - "content-visibility": [ - "visible", - "auto", - "hidden", - "initial", - "inherit", - "unset", - ], - "counter-increment": ["none", "initial", "inherit", "unset"], - "counter-reset": ["none", "initial", "inherit", "unset"], - "counter-set": ["none", "initial", "inherit", "unset"], - cursor: [ - "auto", - "default", - "none", - "context-menu", - "help", - "pointer", - "progress", - "wait", - "cell", - "crosshair", - "text", - "vertical-text", - "alias", - "copy", - "move", - "no-drop", - "not-allowed", - "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", - "grab", - "grabbing", - "initial", - "inherit", - "unset", - ], - direction: ["ltr", "rtl", "initial", "inherit", "unset"], - display: [ - "block", - "inline", - "run-in", - "flow", - "flow-root", - "table", - "flex", - "grid", - "ruby", - "list-item", - "table-row-group", - "table-header-group", - "table-footer-group", - "table-row", - "table-cell", - "table-column-group", - "table-column", - "table-caption", - "ruby-base", - "ruby-text", - "ruby-base-container", - "ruby-text-container", - "contents", - "none", - "inline-block", - "inline-list-item", - "inline-table", - "inline-flex", - "inline-grid", - "initial", - "inherit", - "unset", - ], - "empty-cells": ["show", "hide", "initial", "inherit", "unset"], - "field-sizing": ["content", "fixed", "initial", "inherit", "unset"], - filter: ["none", "initial", "inherit", "unset"], - "flex-basis": [ - "content", - "auto", - "min-content", - "max-content", - "fit-content", - "initial", - "inherit", - "unset", - ], - "flex-direction": [ - "row", - "row-reverse", - "column", - "column-reverse", - "initial", - "inherit", - "unset", - ], - "flex-grow": ["initial", "inherit", "unset"], - "flex-shrink": ["initial", "inherit", "unset"], - "flex-wrap": [ - "nowrap", - "wrap", - "wrap-reverse", - "initial", - "inherit", - "unset", - ], - float: [ - "left", - "right", - "none", - "inline-start", - "inline-end", - "initial", - "inherit", - "unset", - ], + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", + "initial", + "inherit", + "unset", + ], + "flood-opacity": ["initial", "inherit", "unset"], "font-family": [ "serif", "sans-serif", + "system-ui", "cursive", "fantasy", + "math", "monospace", + "ui-serif", + "ui-sans-serif", + "ui-monospace", + "ui-rounded", + "emoji", + "fangsong", "initial", "inherit", "unset", @@ -3473,7 +3794,7 @@ export const keywordValues: KeywordValues = { "font-kerning": ["auto", "normal", "none", "initial", "inherit", "unset"], "font-language-override": ["normal", "initial", "inherit", "unset"], "font-optical-sizing": ["auto", "none", "initial", "inherit", "unset"], - "font-variation-settings": ["normal", "initial", "inherit", "unset"], + "font-palette": ["normal", "light", "dark", "initial", "inherit", "unset"], "font-size": [ "xx-small", "x-small", @@ -3485,6 +3806,7 @@ export const keywordValues: KeywordValues = { "xxx-large", "larger", "smaller", + "math", "initial", "inherit", "unset", @@ -3501,20 +3823,6 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "font-stretch": [ - "normal", - "ultra-condensed", - "extra-condensed", - "condensed", - "semi-condensed", - "semi-expanded", - "expanded", - "extra-expanded", - "ultra-expanded", - "initial", - "inherit", - "unset", - ], "font-style": ["normal", "italic", "oblique", "initial", "inherit", "unset"], "font-synthesis-small-caps": ["auto", "none", "initial", "inherit", "unset"], "font-synthesis-style": ["auto", "none", "initial", "inherit", "unset"], @@ -3553,6 +3861,15 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], + "font-variant-emoji": [ + "normal", + "text", + "emoji", + "unicode", + "initial", + "inherit", + "unset", + ], "font-variant-ligatures": [ "normal", "none", @@ -3590,6 +3907,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], + "font-variation-settings": ["normal", "initial", "inherit", "unset"], "font-weight": [ "normal", "bold", @@ -3599,6 +3917,14 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], + "forced-color-adjust": [ + "auto", + "none", + "preserve-parent-color", + "initial", + "inherit", + "unset", + ], "grid-auto-columns": [ "min-content", "max-content", @@ -3668,10 +3994,12 @@ export const keywordValues: KeywordValues = { "auto", "crisp-edges", "pixelated", + "smooth", "initial", "inherit", "unset", ], + "initial-letter": ["normal", "initial", "inherit", "unset"], "inline-size": [ "auto", "min-content", @@ -3749,8 +4077,182 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - left: ["auto", "initial", "inherit", "unset"], - "letter-spacing": ["normal", "initial", "inherit", "unset"], + left: ["auto", "initial", "inherit", "unset"], + "letter-spacing": ["normal", "initial", "inherit", "unset"], + "lighting-color": [ + "aliceblue", + "antiquewhite", + "aqua", + "aquamarine", + "azure", + "beige", + "bisque", + "black", + "blanchedalmond", + "blue", + "blueviolet", + "brown", + "burlywood", + "cadetblue", + "chartreuse", + "chocolate", + "coral", + "cornflowerblue", + "cornsilk", + "crimson", + "cyan", + "darkblue", + "darkcyan", + "darkgoldenrod", + "darkgray", + "darkgreen", + "darkgrey", + "darkkhaki", + "darkmagenta", + "darkolivegreen", + "darkorange", + "darkorchid", + "darkred", + "darksalmon", + "darkseagreen", + "darkslateblue", + "darkslategray", + "darkslategrey", + "darkturquoise", + "darkviolet", + "deeppink", + "deepskyblue", + "dimgray", + "dimgrey", + "dodgerblue", + "firebrick", + "floralwhite", + "forestgreen", + "fuchsia", + "gainsboro", + "ghostwhite", + "gold", + "goldenrod", + "gray", + "green", + "greenyellow", + "grey", + "honeydew", + "hotpink", + "indianred", + "indigo", + "ivory", + "khaki", + "lavender", + "lavenderblush", + "lawngreen", + "lemonchiffon", + "lightblue", + "lightcoral", + "lightcyan", + "lightgoldenrodyellow", + "lightgray", + "lightgreen", + "lightgrey", + "lightpink", + "lightsalmon", + "lightseagreen", + "lightskyblue", + "lightslategray", + "lightslategrey", + "lightsteelblue", + "lightyellow", + "lime", + "limegreen", + "linen", + "magenta", + "maroon", + "mediumaquamarine", + "mediumblue", + "mediumorchid", + "mediumpurple", + "mediumseagreen", + "mediumslateblue", + "mediumspringgreen", + "mediumturquoise", + "mediumvioletred", + "midnightblue", + "mintcream", + "mistyrose", + "moccasin", + "navajowhite", + "navy", + "oldlace", + "olive", + "olivedrab", + "orange", + "orangered", + "orchid", + "palegoldenrod", + "palegreen", + "paleturquoise", + "palevioletred", + "papayawhip", + "peachpuff", + "peru", + "pink", + "plum", + "powderblue", + "purple", + "rebeccapurple", + "red", + "rosybrown", + "royalblue", + "saddlebrown", + "salmon", + "sandybrown", + "seagreen", + "seashell", + "sienna", + "silver", + "skyblue", + "slateblue", + "slategray", + "slategrey", + "snow", + "springgreen", + "steelblue", + "tan", + "teal", + "thistle", + "tomato", + "turquoise", + "violet", + "wheat", + "white", + "whitesmoke", + "yellow", + "yellowgreen", + "transparent", + "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", + "initial", + "inherit", + "unset", + ], "line-break": [ "auto", "loose", @@ -3761,6 +4263,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], + "line-clamp": ["none", "initial", "inherit", "unset"], "line-height": ["normal", "initial", "inherit", "unset"], "list-style-image": ["none", "initial", "inherit", "unset"], "list-style-position": ["inside", "outside", "initial", "inherit", "unset"], @@ -3772,6 +4275,9 @@ export const keywordValues: KeywordValues = { "margin-left": ["auto", "initial", "inherit", "unset"], "margin-right": ["auto", "initial", "inherit", "unset"], "margin-top": ["auto", "initial", "inherit", "unset"], + "marker-end": ["none", "initial", "inherit", "unset"], + "marker-mid": ["none", "initial", "inherit", "unset"], + "marker-start": ["none", "initial", "inherit", "unset"], "mask-border-mode": ["luminance", "alpha", "initial", "inherit", "unset"], "mask-border-outset": ["initial", "inherit", "unset"], "mask-border-repeat": [ @@ -3787,10 +4293,9 @@ export const keywordValues: KeywordValues = { "mask-border-source": ["none", "initial", "inherit", "unset"], "mask-border-width": ["auto", "initial", "inherit", "unset"], "mask-clip": [ - "border-box", - "padding-box", "content-box", - "margin-box", + "padding-box", + "border-box", "fill-box", "stroke-box", "view-box", @@ -3818,10 +4323,9 @@ export const keywordValues: KeywordValues = { "unset", ], "mask-origin": [ - "border-box", - "padding-box", "content-box", - "margin-box", + "padding-box", + "border-box", "fill-box", "stroke-box", "view-box", @@ -3853,7 +4357,6 @@ export const keywordValues: KeywordValues = { "mask-size": ["auto", "cover", "contain", "initial", "inherit", "unset"], "mask-type": ["luminance", "alpha", "initial", "inherit", "unset"], "math-depth": ["auto-add", "initial", "inherit", "unset"], - "math-shift": ["normal", "compact", "initial", "inherit", "unset"], "math-style": ["normal", "compact", "initial", "inherit", "unset"], "max-block-size": [ "none", @@ -3981,7 +4484,30 @@ export const keywordValues: KeywordValues = { "unset", ], "offset-distance": ["initial", "inherit", "unset"], - "offset-path": ["none", "initial", "inherit", "unset"], + "offset-path": [ + "none", + "closest-side", + "closest-corner", + "farthest-side", + "farthest-corner", + "sides", + "contain", + "at", + "left", + "center", + "right", + "top", + "bottom", + "content-box", + "padding-box", + "border-box", + "fill-box", + "stroke-box", + "view-box", + "initial", + "inherit", + "unset", + ], "offset-position": [ "normal", "auto", @@ -4000,7 +4526,6 @@ export const keywordValues: KeywordValues = { orphans: ["initial", "inherit", "unset"], "outline-color": [ "auto", - "transparent", "aliceblue", "antiquewhite", "aqua", @@ -4149,7 +4674,27 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", @@ -4158,7 +4703,6 @@ export const keywordValues: KeywordValues = { "outline-style": [ "auto", "none", - "hidden", "dotted", "dashed", "solid", @@ -4172,6 +4716,35 @@ export const keywordValues: KeywordValues = { "unset", ], "outline-width": ["thin", "medium", "thick", "initial", "inherit", "unset"], + "overflow-anchor": ["auto", "none", "initial", "inherit", "unset"], + "overflow-block": [ + "visible", + "hidden", + "clip", + "scroll", + "auto", + "initial", + "inherit", + "unset", + ], + "overflow-clip-margin": [ + "content-box", + "padding-box", + "border-box", + "initial", + "inherit", + "unset", + ], + "overflow-inline": [ + "visible", + "hidden", + "clip", + "scroll", + "auto", + "initial", + "inherit", + "unset", + ], "overflow-wrap": [ "normal", "break-word", @@ -4249,31 +4822,6 @@ export const keywordValues: KeywordValues = { "padding-right": ["initial", "inherit", "unset"], "padding-top": ["initial", "inherit", "unset"], page: ["auto", "initial", "inherit", "unset"], - "page-break-after": [ - "auto", - "always", - "avoid", - "left", - "right", - "recto", - "verso", - "initial", - "inherit", - "unset", - ], - "page-break-before": [ - "auto", - "always", - "avoid", - "left", - "right", - "recto", - "verso", - "initial", - "inherit", - "unset", - ], - "page-break-inside": ["auto", "avoid", "initial", "inherit", "unset"], "paint-order": [ "normal", "fill", @@ -4319,26 +4867,86 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "print-color-adjust": ["economy", "exact", "initial", "inherit", "unset"], - quotes: ["none", "auto", "initial", "inherit", "unset"], - resize: [ + "print-color-adjust": ["economy", "exact", "initial", "inherit", "unset"], + quotes: ["none", "auto", "initial", "inherit", "unset"], + r: ["initial", "inherit", "unset"], + resize: [ + "none", + "both", + "horizontal", + "vertical", + "block", + "inline", + "initial", + "inherit", + "unset", + ], + right: ["auto", "initial", "inherit", "unset"], + rotate: ["none", "x", "y", "z", "initial", "inherit", "unset"], + "row-gap": ["normal", "initial", "inherit", "unset"], + "ruby-align": [ + "start", + "center", + "space-between", + "space-around", + "initial", + "inherit", + "unset", + ], + "ruby-position": [ + "alternate", + "over", + "under", + "inter-character", + "initial", + "inherit", + "unset", + ], + rx: ["initial", "inherit", "unset"], + ry: ["initial", "inherit", "unset"], + scale: ["none", "initial", "inherit", "unset"], + "scroll-behavior": ["auto", "smooth", "initial", "inherit", "unset"], + "scroll-margin-block-end": ["initial", "inherit", "unset"], + "scroll-margin-block-start": ["initial", "inherit", "unset"], + "scroll-margin-bottom": ["initial", "inherit", "unset"], + "scroll-margin-inline-end": ["initial", "inherit", "unset"], + "scroll-margin-inline-start": ["initial", "inherit", "unset"], + "scroll-margin-left": ["initial", "inherit", "unset"], + "scroll-margin-right": ["initial", "inherit", "unset"], + "scroll-margin-top": ["initial", "inherit", "unset"], + "scroll-padding-block-end": ["auto", "initial", "inherit", "unset"], + "scroll-padding-block-start": ["auto", "initial", "inherit", "unset"], + "scroll-padding-bottom": ["auto", "initial", "inherit", "unset"], + "scroll-padding-inline-end": ["auto", "initial", "inherit", "unset"], + "scroll-padding-inline-start": ["auto", "initial", "inherit", "unset"], + "scroll-padding-left": ["auto", "initial", "inherit", "unset"], + "scroll-padding-right": ["auto", "initial", "inherit", "unset"], + "scroll-padding-top": ["auto", "initial", "inherit", "unset"], + "scroll-snap-align": [ + "none", + "start", + "end", + "center", + "initial", + "inherit", + "unset", + ], + "scroll-snap-stop": ["normal", "always", "initial", "inherit", "unset"], + "scroll-snap-type": [ "none", - "both", - "horizontal", - "vertical", + "x", + "y", "block", "inline", + "both", + "mandatory", + "proximity", "initial", "inherit", "unset", ], - right: ["auto", "initial", "inherit", "unset"], - rotate: ["none", "x", "y", "z", "initial", "inherit", "unset"], - "row-gap": ["normal", "initial", "inherit", "unset"], - scale: ["none", "initial", "inherit", "unset"], "scrollbar-color": [ "auto", - "transparent", "aliceblue", "antiquewhite", "aqua", @@ -4487,7 +5095,27 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", @@ -4501,58 +5129,218 @@ export const keywordValues: KeywordValues = { "unset", ], "scrollbar-width": ["auto", "thin", "none", "initial", "inherit", "unset"], - "scroll-behavior": ["auto", "smooth", "initial", "inherit", "unset"], - "scroll-margin-block-start": ["initial", "inherit", "unset"], - "scroll-margin-block-end": ["initial", "inherit", "unset"], - "scroll-margin-bottom": ["initial", "inherit", "unset"], - "scroll-margin-inline-start": ["initial", "inherit", "unset"], - "scroll-margin-inline-end": ["initial", "inherit", "unset"], - "scroll-margin-left": ["initial", "inherit", "unset"], - "scroll-margin-right": ["initial", "inherit", "unset"], - "scroll-margin-top": ["initial", "inherit", "unset"], - "scroll-padding-block-start": ["auto", "initial", "inherit", "unset"], - "scroll-padding-block-end": ["auto", "initial", "inherit", "unset"], - "scroll-padding-bottom": ["auto", "initial", "inherit", "unset"], - "scroll-padding-inline-start": ["auto", "initial", "inherit", "unset"], - "scroll-padding-inline-end": ["auto", "initial", "inherit", "unset"], - "scroll-padding-left": ["auto", "initial", "inherit", "unset"], - "scroll-padding-right": ["auto", "initial", "inherit", "unset"], - "scroll-padding-top": ["auto", "initial", "inherit", "unset"], - "scroll-snap-align": [ + "shape-image-threshold": ["initial", "inherit", "unset"], + "shape-margin": ["initial", "inherit", "unset"], + "shape-outside": [ "none", - "start", - "end", - "center", + "content-box", + "padding-box", + "border-box", + "margin-box", "initial", "inherit", "unset", ], - "scroll-snap-stop": ["normal", "always", "initial", "inherit", "unset"], - "scroll-snap-type": [ - "none", - "x", - "y", - "block", - "inline", - "both", - "mandatory", - "proximity", + "shape-rendering": [ + "auto", + "optimizeSpeed", + "crispEdges", + "geometricPrecision", "initial", "inherit", "unset", ], - "shape-image-threshold": ["initial", "inherit", "unset"], - "shape-margin": ["initial", "inherit", "unset"], - "shape-outside": [ - "none", - "border-box", - "padding-box", - "content-box", - "margin-box", + "stop-color": [ + "aliceblue", + "antiquewhite", + "aqua", + "aquamarine", + "azure", + "beige", + "bisque", + "black", + "blanchedalmond", + "blue", + "blueviolet", + "brown", + "burlywood", + "cadetblue", + "chartreuse", + "chocolate", + "coral", + "cornflowerblue", + "cornsilk", + "crimson", + "cyan", + "darkblue", + "darkcyan", + "darkgoldenrod", + "darkgray", + "darkgreen", + "darkgrey", + "darkkhaki", + "darkmagenta", + "darkolivegreen", + "darkorange", + "darkorchid", + "darkred", + "darksalmon", + "darkseagreen", + "darkslateblue", + "darkslategray", + "darkslategrey", + "darkturquoise", + "darkviolet", + "deeppink", + "deepskyblue", + "dimgray", + "dimgrey", + "dodgerblue", + "firebrick", + "floralwhite", + "forestgreen", + "fuchsia", + "gainsboro", + "ghostwhite", + "gold", + "goldenrod", + "gray", + "green", + "greenyellow", + "grey", + "honeydew", + "hotpink", + "indianred", + "indigo", + "ivory", + "khaki", + "lavender", + "lavenderblush", + "lawngreen", + "lemonchiffon", + "lightblue", + "lightcoral", + "lightcyan", + "lightgoldenrodyellow", + "lightgray", + "lightgreen", + "lightgrey", + "lightpink", + "lightsalmon", + "lightseagreen", + "lightskyblue", + "lightslategray", + "lightslategrey", + "lightsteelblue", + "lightyellow", + "lime", + "limegreen", + "linen", + "magenta", + "maroon", + "mediumaquamarine", + "mediumblue", + "mediumorchid", + "mediumpurple", + "mediumseagreen", + "mediumslateblue", + "mediumspringgreen", + "mediumturquoise", + "mediumvioletred", + "midnightblue", + "mintcream", + "mistyrose", + "moccasin", + "navajowhite", + "navy", + "oldlace", + "olive", + "olivedrab", + "orange", + "orangered", + "orchid", + "palegoldenrod", + "palegreen", + "paleturquoise", + "palevioletred", + "papayawhip", + "peachpuff", + "peru", + "pink", + "plum", + "powderblue", + "purple", + "rebeccapurple", + "red", + "rosybrown", + "royalblue", + "saddlebrown", + "salmon", + "sandybrown", + "seagreen", + "seashell", + "sienna", + "silver", + "skyblue", + "slateblue", + "slategray", + "slategrey", + "snow", + "springgreen", + "steelblue", + "tan", + "teal", + "thistle", + "tomato", + "turquoise", + "violet", + "wheat", + "white", + "whitesmoke", + "yellow", + "yellowgreen", + "transparent", + "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", + "initial", + "inherit", + "unset", + ], + "stop-opacity": ["initial", "inherit", "unset"], + "stroke-dasharray": ["none", "initial", "inherit", "unset"], + "stroke-dashoffset": ["initial", "inherit", "unset"], + "stroke-linecap": ["butt", "round", "square", "initial", "inherit", "unset"], + "stroke-linejoin": [ + "miter", + "miter-clip", + "round", + "bevel", + "arcs", "initial", "inherit", "unset", ], + "stroke-miterlimit": ["initial", "inherit", "unset"], + "stroke-opacity": ["initial", "inherit", "unset"], + "stroke-width": ["initial", "inherit", "unset"], "tab-size": ["initial", "inherit", "unset"], "table-layout": ["auto", "fixed", "initial", "inherit", "unset"], "text-align": [ @@ -4579,6 +5367,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], + "text-anchor": ["start", "middle", "end", "initial", "inherit", "unset"], "text-combine-upright": [ "none", "all", @@ -4588,7 +5377,6 @@ export const keywordValues: KeywordValues = { "unset", ], "text-decoration-color": [ - "transparent", "aliceblue", "antiquewhite", "aqua", @@ -4737,7 +5525,27 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", @@ -4780,7 +5588,6 @@ export const keywordValues: KeywordValues = { "unset", ], "text-emphasis-color": [ - "transparent", "aliceblue", "antiquewhite", "aqua", @@ -4929,12 +5736,33 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", ], "text-emphasis-position": [ + "auto", "over", "under", "right", @@ -4986,7 +5814,6 @@ export const keywordValues: KeywordValues = { ], "text-shadow": [ "none", - "transparent", "aliceblue", "antiquewhite", "aqua", @@ -5135,7 +5962,27 @@ export const keywordValues: KeywordValues = { "whitesmoke", "yellow", "yellowgreen", + "transparent", "currentColor", + "AccentColor", + "AccentColorText", + "ActiveText", + "ButtonBorder", + "ButtonFace", + "ButtonText", + "Canvas", + "CanvasText", + "Field", + "FieldText", + "GrayText", + "Highlight", + "HighlightText", + "LinkText", + "Mark", + "MarkText", + "SelectedItem", + "SelectedItemText", + "VisitedText", "initial", "inherit", "unset", @@ -5148,6 +5995,7 @@ export const keywordValues: KeywordValues = { "lowercase", "full-width", "full-size-kana", + "math-auto", "initial", "inherit", "unset", @@ -5163,6 +6011,7 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], + "text-wrap-mode": ["wrap", "nowrap", "initial", "inherit", "unset"], "text-wrap-style": [ "auto", "balance", @@ -5244,12 +6093,13 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], - "user-select": [ - "auto", - "text", + "user-select": ["auto", "text", "none", "all", "initial", "inherit", "unset"], + "vector-effect": [ "none", - "contain", - "all", + "non-scaling-stroke", + "non-scaling-size", + "non-rotation", + "fixed-position", "initial", "inherit", "unset", @@ -5267,10 +6117,16 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], + "view-transition-name": [ + "none", + "match-element", + "initial", + "inherit", + "unset", + ], visibility: ["visible", "hidden", "collapse", "initial", "inherit", "unset"], "white-space-collapse": [ "collapse", - "discard", "preserve", "preserve-breaks", "preserve-spaces", @@ -5302,6 +6158,7 @@ export const keywordValues: KeywordValues = { "break-all", "keep-all", "break-word", + "auto-phrase", "initial", "inherit", "unset", @@ -5318,6 +6175,8 @@ export const keywordValues: KeywordValues = { "inherit", "unset", ], + x: ["initial", "inherit", "unset"], + y: ["initial", "inherit", "unset"], "z-index": ["auto", "initial", "inherit", "unset"], zoom: ["normal", "reset", "initial", "inherit", "unset"], }; diff --git a/packages/css-data/src/__generated__/properties.ts b/packages/css-data/src/__generated__/properties.ts index a49048cbe7ae..adaf24892e92 100644 --- a/packages/css-data/src/__generated__/properties.ts +++ b/packages/css-data/src/__generated__/properties.ts @@ -97,8 +97,6 @@ export const properties: Properties = { type: "keyword", value: "auto", }, - mdnUrl: - "https://developer.mozilla.org/docs/Web/CSS/-webkit-overflow-scrolling", }, "-webkit-tap-highlight-color": { unitGroups: [], @@ -146,6 +144,24 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/align-self", }, + "alignment-baseline": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "baseline", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/alignment-baseline", + }, + "animation-composition": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "replace", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/animation-composition", + }, "animation-delay": { unitGroups: ["time"], inherited: false, @@ -360,33 +376,6 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/block-size", }, - "border-block-color": { - unitGroups: [], - inherited: false, - initial: { - type: "keyword", - value: "currentColor", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/border-block-color", - }, - "border-block-style": { - unitGroups: [], - inherited: false, - initial: { - type: "keyword", - value: "none", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/border-block-style", - }, - "border-block-width": { - unitGroups: ["length"], - inherited: false, - initial: { - type: "keyword", - value: "medium", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/border-block-width", - }, "border-block-end-color": { unitGroups: [], inherited: false, @@ -571,33 +560,6 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/border-image-width", }, - "border-inline-color": { - unitGroups: [], - inherited: false, - initial: { - type: "keyword", - value: "currentColor", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/border-inline-color", - }, - "border-inline-style": { - unitGroups: [], - inherited: false, - initial: { - type: "keyword", - value: "none", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/border-inline-style", - }, - "border-inline-width": { - unitGroups: ["length"], - inherited: false, - initial: { - type: "keyword", - value: "medium", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/border-inline-width", - }, "border-inline-end-color": { unitGroups: [], inherited: false, @@ -882,23 +844,23 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/clear", }, - clip: { + "clip-path": { unitGroups: [], inherited: false, initial: { type: "keyword", - value: "auto", + value: "none", }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/clip", + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/clip-path", }, - "clip-path": { + "clip-rule": { unitGroups: [], - inherited: false, + inherited: true, initial: { type: "keyword", - value: "none", + value: "nonzero", }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/clip-path", + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/clip-rule", }, color: { unitGroups: [], @@ -909,6 +871,16 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/color", }, + "color-interpolation-filters": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "linearRGB", + }, + mdnUrl: + "https://developer.mozilla.org/docs/Web/CSS/color-interpolation-filters", + }, "color-scheme": { unitGroups: [], inherited: true, @@ -1112,6 +1084,35 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/cursor", }, + cx: { + unitGroups: ["length", "percentage"], + inherited: false, + initial: { + type: "unit", + unit: "px", + value: 0, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/cx", + }, + cy: { + unitGroups: ["length", "percentage"], + inherited: false, + initial: { + type: "unit", + unit: "px", + value: 0, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/cy", + }, + d: { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "none", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/d", + }, direction: { unitGroups: [], inherited: true, @@ -1130,6 +1131,15 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/display", }, + "dominant-baseline": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "auto", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/dominant-baseline", + }, "empty-cells": { unitGroups: [], inherited: true, @@ -1148,6 +1158,34 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/field-sizing", }, + fill: { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "black", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/fill", + }, + "fill-opacity": { + unitGroups: ["number", "percentage"], + inherited: true, + initial: { + type: "unit", + unit: "number", + value: 1, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/fill-opacity", + }, + "fill-rule": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "nonzero", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/fill-rule", + }, filter: { unitGroups: [], inherited: false, @@ -1213,6 +1251,24 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/float", }, + "flood-color": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "black", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/flood-color", + }, + "flood-opacity": { + unitGroups: ["number", "percentage"], + inherited: false, + initial: { + type: "keyword", + value: "black", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/flood-opacity", + }, "font-family": { unitGroups: [], inherited: true, @@ -1258,15 +1314,14 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/font-optical-sizing", }, - "font-variation-settings": { - unitGroups: ["number"], + "font-palette": { + unitGroups: [], inherited: true, initial: { type: "keyword", value: "normal", }, - mdnUrl: - "https://developer.mozilla.org/docs/Web/CSS/font-variation-settings", + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/font-palette", }, "font-size": { unitGroups: ["length", "percentage"], @@ -1286,15 +1341,6 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/font-size-adjust", }, - "font-stretch": { - unitGroups: ["percentage"], - inherited: true, - initial: { - type: "keyword", - value: "normal", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/font-stretch", - }, "font-style": { unitGroups: ["angle"], inherited: true, @@ -1361,6 +1407,15 @@ export const properties: Properties = { mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/font-variant-east-asian", }, + "font-variant-emoji": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "normal", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/font-variant-emoji", + }, "font-variant-ligatures": { unitGroups: [], inherited: true, @@ -1388,6 +1443,16 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/font-variant-position", }, + "font-variation-settings": { + unitGroups: ["number"], + inherited: true, + initial: { + type: "keyword", + value: "normal", + }, + mdnUrl: + "https://developer.mozilla.org/docs/Web/CSS/font-variation-settings", + }, "font-weight": { unitGroups: ["number"], inherited: true, @@ -1397,6 +1462,15 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/font-weight", }, + "forced-color-adjust": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "auto", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/forced-color-adjust", + }, "grid-auto-columns": { unitGroups: ["length", "percentage", "flex"], inherited: false, @@ -1550,6 +1624,15 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/image-rendering", }, + "initial-letter": { + unitGroups: ["number"], + inherited: false, + initial: { + type: "keyword", + value: "normal", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/initial-letter", + }, "inline-size": { unitGroups: ["length", "percentage"], inherited: false, @@ -1649,6 +1732,15 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/letter-spacing", }, + "lighting-color": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "white", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/lighting-color", + }, "line-break": { unitGroups: [], inherited: true, @@ -1658,6 +1750,15 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/line-break", }, + "line-clamp": { + unitGroups: ["number"], + inherited: false, + initial: { + type: "keyword", + value: "none", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/line-clamp", + }, "line-height": { unitGroups: ["number", "length", "percentage"], inherited: true, @@ -1774,6 +1875,33 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/margin-top", }, + "marker-end": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "none", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/marker-end", + }, + "marker-mid": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "none", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/marker-mid", + }, + "marker-start": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "none", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/marker-start", + }, "mask-border-mode": { unitGroups: [], inherited: false, @@ -1932,15 +2060,6 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/math-depth", }, - "math-shift": { - unitGroups: [], - inherited: true, - initial: { - type: "keyword", - value: "normal", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/math-shift", - }, "math-style": { unitGroups: [], inherited: true, @@ -2069,6 +2188,7 @@ export const properties: Properties = { type: "keyword", value: "auto", }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/offset-anchor", }, "offset-distance": { unitGroups: ["length", "percentage"], @@ -2081,7 +2201,7 @@ export const properties: Properties = { mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/offset-distance", }, "offset-path": { - unitGroups: [], + unitGroups: ["length", "percentage"], inherited: false, initial: { type: "keyword", @@ -2096,6 +2216,7 @@ export const properties: Properties = { type: "keyword", value: "normal", }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/offset-position", }, "offset-rotate": { unitGroups: ["angle"], @@ -2173,6 +2294,43 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/outline-width", }, + "overflow-anchor": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "auto", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/overflow-anchor", + }, + "overflow-block": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "auto", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/overflow-block", + }, + "overflow-clip-margin": { + unitGroups: ["length"], + inherited: false, + initial: { + type: "unit", + unit: "px", + value: 0, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/overflow-clip-margin", + }, + "overflow-inline": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "auto", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/overflow-inline", + }, "overflow-wrap": { unitGroups: [], inherited: true, @@ -2336,33 +2494,6 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/page", }, - "page-break-after": { - unitGroups: [], - inherited: false, - initial: { - type: "keyword", - value: "auto", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/page-break-after", - }, - "page-break-before": { - unitGroups: [], - inherited: false, - initial: { - type: "keyword", - value: "auto", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/page-break-before", - }, - "page-break-inside": { - unitGroups: [], - inherited: false, - initial: { - type: "keyword", - value: "auto", - }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/page-break-inside", - }, "paint-order": { unitGroups: [], inherited: true, @@ -2437,6 +2568,16 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/quotes", }, + r: { + unitGroups: ["length", "percentage"], + inherited: false, + initial: { + type: "unit", + unit: "px", + value: 0, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/r", + }, resize: { unitGroups: [], inherited: false, @@ -2474,41 +2615,52 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/row-gap", }, - scale: { - unitGroups: ["number"], - inherited: false, + "ruby-align": { + unitGroups: [], + inherited: true, initial: { type: "keyword", - value: "none", + value: "space-around", }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scale", + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/ruby-align", }, - "scrollbar-color": { + "ruby-position": { unitGroups: [], inherited: true, initial: { type: "keyword", - value: "auto", + value: "alternate", }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scrollbar-color", + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/ruby-position", }, - "scrollbar-gutter": { - unitGroups: [], + rx: { + unitGroups: ["length", "percentage"], inherited: false, initial: { - type: "keyword", - value: "auto", + type: "unit", + unit: "px", + value: 0, }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scrollbar-gutter", + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/rx", }, - "scrollbar-width": { - unitGroups: [], + ry: { + unitGroups: ["length", "percentage"], + inherited: false, + initial: { + type: "unit", + unit: "px", + value: 0, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/ry", + }, + scale: { + unitGroups: ["number", "percentage"], inherited: false, initial: { type: "keyword", - value: "auto", + value: "none", }, - mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scrollbar-width", + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scale", }, "scroll-behavior": { unitGroups: [], @@ -2519,7 +2671,7 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scroll-behavior", }, - "scroll-margin-block-start": { + "scroll-margin-block-end": { unitGroups: ["length"], inherited: false, initial: { @@ -2528,9 +2680,9 @@ export const properties: Properties = { value: 0, }, mdnUrl: - "https://developer.mozilla.org/docs/Web/CSS/scroll-margin-block-start", + "https://developer.mozilla.org/docs/Web/CSS/scroll-margin-block-end", }, - "scroll-margin-block-end": { + "scroll-margin-block-start": { unitGroups: ["length"], inherited: false, initial: { @@ -2539,7 +2691,7 @@ export const properties: Properties = { value: 0, }, mdnUrl: - "https://developer.mozilla.org/docs/Web/CSS/scroll-margin-block-end", + "https://developer.mozilla.org/docs/Web/CSS/scroll-margin-block-start", }, "scroll-margin-bottom": { unitGroups: ["length"], @@ -2551,7 +2703,7 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scroll-margin-bottom", }, - "scroll-margin-inline-start": { + "scroll-margin-inline-end": { unitGroups: ["length"], inherited: false, initial: { @@ -2560,9 +2712,9 @@ export const properties: Properties = { value: 0, }, mdnUrl: - "https://developer.mozilla.org/docs/Web/CSS/scroll-margin-inline-start", + "https://developer.mozilla.org/docs/Web/CSS/scroll-margin-inline-end", }, - "scroll-margin-inline-end": { + "scroll-margin-inline-start": { unitGroups: ["length"], inherited: false, initial: { @@ -2571,7 +2723,7 @@ export const properties: Properties = { value: 0, }, mdnUrl: - "https://developer.mozilla.org/docs/Web/CSS/scroll-margin-inline-end", + "https://developer.mozilla.org/docs/Web/CSS/scroll-margin-inline-start", }, "scroll-margin-left": { unitGroups: ["length"], @@ -2603,7 +2755,7 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scroll-margin-top", }, - "scroll-padding-block-start": { + "scroll-padding-block-end": { unitGroups: ["length", "percentage"], inherited: false, initial: { @@ -2611,9 +2763,9 @@ export const properties: Properties = { value: "auto", }, mdnUrl: - "https://developer.mozilla.org/docs/Web/CSS/scroll-padding-block-start", + "https://developer.mozilla.org/docs/Web/CSS/scroll-padding-block-end", }, - "scroll-padding-block-end": { + "scroll-padding-block-start": { unitGroups: ["length", "percentage"], inherited: false, initial: { @@ -2621,7 +2773,7 @@ export const properties: Properties = { value: "auto", }, mdnUrl: - "https://developer.mozilla.org/docs/Web/CSS/scroll-padding-block-end", + "https://developer.mozilla.org/docs/Web/CSS/scroll-padding-block-start", }, "scroll-padding-bottom": { unitGroups: ["length", "percentage"], @@ -2632,7 +2784,7 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scroll-padding-bottom", }, - "scroll-padding-inline-start": { + "scroll-padding-inline-end": { unitGroups: ["length", "percentage"], inherited: false, initial: { @@ -2640,9 +2792,9 @@ export const properties: Properties = { value: "auto", }, mdnUrl: - "https://developer.mozilla.org/docs/Web/CSS/scroll-padding-inline-start", + "https://developer.mozilla.org/docs/Web/CSS/scroll-padding-inline-end", }, - "scroll-padding-inline-end": { + "scroll-padding-inline-start": { unitGroups: ["length", "percentage"], inherited: false, initial: { @@ -2650,7 +2802,7 @@ export const properties: Properties = { value: "auto", }, mdnUrl: - "https://developer.mozilla.org/docs/Web/CSS/scroll-padding-inline-end", + "https://developer.mozilla.org/docs/Web/CSS/scroll-padding-inline-start", }, "scroll-padding-left": { unitGroups: ["length", "percentage"], @@ -2706,6 +2858,33 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scroll-snap-type", }, + "scrollbar-color": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "auto", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scrollbar-color", + }, + "scrollbar-gutter": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "auto", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scrollbar-gutter", + }, + "scrollbar-width": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "auto", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/scrollbar-width", + }, "shape-image-threshold": { unitGroups: ["number", "percentage"], inherited: false, @@ -2735,6 +2914,100 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/shape-outside", }, + "shape-rendering": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "auto", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/shape-rendering", + }, + "stop-color": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "black", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/stop-color", + }, + "stop-opacity": { + unitGroups: ["number", "percentage"], + inherited: false, + initial: { + type: "keyword", + value: "black", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/stop-opacity", + }, + "stroke-dasharray": { + unitGroups: ["length", "percentage", "number"], + inherited: true, + initial: { + type: "keyword", + value: "none", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/stroke-dasharray", + }, + "stroke-dashoffset": { + unitGroups: ["length", "percentage", "number"], + inherited: true, + initial: { + type: "unit", + unit: "number", + value: 0, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/stroke-dashoffset", + }, + "stroke-linecap": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "butt", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/stroke-linecap", + }, + "stroke-linejoin": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "miter", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/stroke-linejoin", + }, + "stroke-miterlimit": { + unitGroups: ["number"], + inherited: true, + initial: { + type: "unit", + unit: "number", + value: 4, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/stroke-miterlimit", + }, + "stroke-opacity": { + unitGroups: ["number", "percentage"], + inherited: true, + initial: { + type: "unit", + unit: "number", + value: 1, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/stroke-opacity", + }, + "stroke-width": { + unitGroups: ["length", "percentage", "number"], + inherited: true, + initial: { + type: "unit", + unit: "px", + value: 1, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/stroke-width", + }, "tab-size": { unitGroups: ["number", "length"], inherited: true, @@ -2772,6 +3045,15 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/text-align-last", }, + "text-anchor": { + unitGroups: [], + inherited: true, + initial: { + type: "keyword", + value: "start", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/text-anchor", + }, "text-combine-upright": { unitGroups: ["number"], inherited: true, @@ -2841,17 +3123,8 @@ export const properties: Properties = { unitGroups: [], inherited: true, initial: { - type: "tuple", - value: [ - { - type: "keyword", - value: "over", - }, - { - type: "keyword", - value: "right", - }, - ], + type: "keyword", + value: "auto", }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/text-emphasis-position", }, @@ -3119,6 +3392,15 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/user-select", }, + "vector-effect": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "none", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/vector-effect", + }, "vertical-align": { unitGroups: ["percentage", "length"], inherited: false, @@ -3128,6 +3410,15 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/vertical-align", }, + "view-transition-name": { + unitGroups: [], + inherited: false, + initial: { + type: "keyword", + value: "none", + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/view-transition-name", + }, visibility: { unitGroups: [], inherited: true, @@ -3210,6 +3501,26 @@ export const properties: Properties = { }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/writing-mode", }, + x: { + unitGroups: ["length", "percentage"], + inherited: false, + initial: { + type: "unit", + unit: "px", + value: 0, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/x", + }, + y: { + unitGroups: ["length", "percentage"], + inherited: false, + initial: { + type: "unit", + unit: "px", + value: 0, + }, + mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/y", + }, "z-index": { unitGroups: ["number"], inherited: false, @@ -3223,8 +3534,9 @@ export const properties: Properties = { unitGroups: ["number", "percentage"], inherited: false, initial: { - type: "keyword", - value: "normal", + type: "unit", + unit: "number", + value: 1, }, mdnUrl: "https://developer.mozilla.org/docs/Web/CSS/zoom", }, diff --git a/packages/css-data/src/__generated__/pseudo-elements.ts b/packages/css-data/src/__generated__/pseudo-elements.ts index abaaaa3e0183..ea04df8cb3a6 100644 --- a/packages/css-data/src/__generated__/pseudo-elements.ts +++ b/packages/css-data/src/__generated__/pseudo-elements.ts @@ -1,10 +1,5 @@ // This file was generated by pnpm mdn-data export const pseudoElements = [ - "target-text", - "-moz-progress-bar", - "-moz-range-progress", - "-moz-range-thumb", - "-moz-range-track", "-ms-browse", "-ms-check", "-ms-clear", @@ -19,6 +14,10 @@ export const pseudoElements = [ "-ms-tooltip", "-ms-track", "-ms-value", + "-moz-progress-bar", + "-moz-range-progress", + "-moz-range-thumb", + "-moz-range-track", "-webkit-progress-bar", "-webkit-progress-inner-value", "-webkit-progress-value", @@ -27,20 +26,31 @@ export const pseudoElements = [ "after", "backdrop", "before", + "checkmark", "cue", + "cue()", "cue-region", + "cue-region()", + "details-content", + "file-selector-button", "first-letter", "first-line", "grammar-error", + "highlight()", "marker", - "part", + "part()", + "picker-icon", + "picker()", "placeholder", + "scroll-marker", + "scroll-marker-group", "selection", - "slotted", + "slotted()", "spelling-error", + "target-text", "view-transition", - "view-transition-group", - "view-transition-image-pair", - "view-transition-new", - "view-transition-old", + "view-transition-group()", + "view-transition-image-pair()", + "view-transition-new()", + "view-transition-old()", ] as const; diff --git a/packages/css-data/src/__generated__/shorthand-properties.ts b/packages/css-data/src/__generated__/shorthand-properties.ts index 8295f27ffe4a..e01f9ba96078 100644 --- a/packages/css-data/src/__generated__/shorthand-properties.ts +++ b/packages/css-data/src/__generated__/shorthand-properties.ts @@ -1,5 +1,6 @@ // This file was generated by pnpm mdn-data export const shorthandProperties = [ + "-webkit-text-stroke", "animation", "background", "border", @@ -38,6 +39,7 @@ export const shorthandProperties = [ "margin", "margin-block", "margin-inline", + "marker", "mask", "mask-border", "offset", @@ -54,6 +56,7 @@ export const shorthandProperties = [ "scroll-padding", "scroll-padding-block", "scroll-padding-inline", + "stroke", "text-decoration", "text-emphasis", "transition", diff --git a/packages/css-data/src/custom-data.ts b/packages/css-data/src/custom-data.ts index 8e7d5d50698d..a55ae9c3945d 100644 --- a/packages/css-data/src/custom-data.ts +++ b/packages/css-data/src/custom-data.ts @@ -1,37 +1,7 @@ import type { StyleValue } from "@webstudio-is/css-engine"; -const numericTypes = [ - "number", - "percentage", - "length", - "time", - "angle", - "resolution", - "integer", - "x", - "y", -] as const; - -export const valueTypes: string[] = [ - ...numericTypes, - "hex-color", - "url", - "string", - "custom-ident", - "dashed-ident", - "single-animation-composition", - "palette-identifier", - "flex", - "inset-area", - "offset-path", - "coord-box", - "anchor-element", - "try-tactic", - "try-size", -]; - // Data type used before we generate a the constants. -export type RawPropertyData = { +type RawPropertyData = { unitGroups: Array; inherited: boolean; initial: StyleValue; @@ -124,16 +94,6 @@ keywordValues["list-style-type"] = [ "unset", ]; -// removed auto from keywords -// fixed in webref btw -keywordValues["text-wrap-mode"] = [ - "wrap", - "nowrap", - "initial", - "inherit", - "unset", -]; - export const customLonghandPropertyNames = [ "boxShadowOffsetX", "boxShadowOffsetY", diff --git a/packages/css-engine/src/__generated__/types.ts b/packages/css-engine/src/__generated__/types.ts index fe7924cbf993..3f4ad2ead3b4 100644 --- a/packages/css-engine/src/__generated__/types.ts +++ b/packages/css-engine/src/__generated__/types.ts @@ -13,6 +13,8 @@ export type CamelCasedProperty = | "alignContent" | "alignItems" | "alignSelf" + | "alignmentBaseline" + | "animationComposition" | "animationDelay" | "animationDirection" | "animationDuration" @@ -36,9 +38,6 @@ export type CamelCasedProperty = | "backgroundRepeat" | "backgroundSize" | "blockSize" - | "borderBlockColor" - | "borderBlockStyle" - | "borderBlockWidth" | "borderBlockEndColor" | "borderBlockEndStyle" | "borderBlockEndWidth" @@ -58,9 +57,6 @@ export type CamelCasedProperty = | "borderImageSlice" | "borderImageSource" | "borderImageWidth" - | "borderInlineColor" - | "borderInlineStyle" - | "borderInlineWidth" | "borderInlineEndColor" | "borderInlineEndStyle" | "borderInlineEndWidth" @@ -91,9 +87,10 @@ export type CamelCasedProperty = | "captionSide" | "caretColor" | "clear" - | "clip" | "clipPath" + | "clipRule" | "color" + | "colorInterpolationFilters" | "colorScheme" | "columnCount" | "columnFill" @@ -116,10 +113,17 @@ export type CamelCasedProperty = | "counterReset" | "counterSet" | "cursor" + | "cx" + | "cy" + | "d" | "direction" | "display" + | "dominantBaseline" | "emptyCells" | "fieldSizing" + | "fill" + | "fillOpacity" + | "fillRule" | "filter" | "flexBasis" | "flexDirection" @@ -127,15 +131,16 @@ export type CamelCasedProperty = | "flexShrink" | "flexWrap" | "float" + | "floodColor" + | "floodOpacity" | "fontFamily" | "fontFeatureSettings" | "fontKerning" | "fontLanguageOverride" | "fontOpticalSizing" - | "fontVariationSettings" + | "fontPalette" | "fontSize" | "fontSizeAdjust" - | "fontStretch" | "fontStyle" | "fontSynthesisSmallCaps" | "fontSynthesisStyle" @@ -143,10 +148,13 @@ export type CamelCasedProperty = | "fontVariantAlternates" | "fontVariantCaps" | "fontVariantEastAsian" + | "fontVariantEmoji" | "fontVariantLigatures" | "fontVariantNumeric" | "fontVariantPosition" + | "fontVariationSettings" | "fontWeight" + | "forcedColorAdjust" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" @@ -164,6 +172,7 @@ export type CamelCasedProperty = | "hyphens" | "imageOrientation" | "imageRendering" + | "initialLetter" | "inlineSize" | "insetBlockEnd" | "insetBlockStart" @@ -175,7 +184,9 @@ export type CamelCasedProperty = | "justifySelf" | "left" | "letterSpacing" + | "lightingColor" | "lineBreak" + | "lineClamp" | "lineHeight" | "listStyleImage" | "listStylePosition" @@ -188,6 +199,9 @@ export type CamelCasedProperty = | "marginLeft" | "marginRight" | "marginTop" + | "markerEnd" + | "markerMid" + | "markerStart" | "maskBorderMode" | "maskBorderOutset" | "maskBorderRepeat" @@ -204,7 +218,6 @@ export type CamelCasedProperty = | "maskSize" | "maskType" | "mathDepth" - | "mathShift" | "mathStyle" | "maxBlockSize" | "maxHeight" @@ -229,6 +242,10 @@ export type CamelCasedProperty = | "outlineOffset" | "outlineStyle" | "outlineWidth" + | "overflowAnchor" + | "overflowBlock" + | "overflowClipMargin" + | "overflowInline" | "overflowWrap" | "overflowX" | "overflowY" @@ -246,9 +263,6 @@ export type CamelCasedProperty = | "paddingRight" | "paddingTop" | "page" - | "pageBreakAfter" - | "pageBreakBefore" - | "pageBreakInside" | "paintOrder" | "perspective" | "perspectiveOrigin" @@ -256,41 +270,57 @@ export type CamelCasedProperty = | "position" | "printColorAdjust" | "quotes" + | "r" | "resize" | "right" | "rotate" | "rowGap" + | "rubyAlign" + | "rubyPosition" + | "rx" + | "ry" | "scale" - | "scrollbarColor" - | "scrollbarGutter" - | "scrollbarWidth" | "scrollBehavior" - | "scrollMarginBlockStart" | "scrollMarginBlockEnd" + | "scrollMarginBlockStart" | "scrollMarginBottom" - | "scrollMarginInlineStart" | "scrollMarginInlineEnd" + | "scrollMarginInlineStart" | "scrollMarginLeft" | "scrollMarginRight" | "scrollMarginTop" - | "scrollPaddingBlockStart" | "scrollPaddingBlockEnd" + | "scrollPaddingBlockStart" | "scrollPaddingBottom" - | "scrollPaddingInlineStart" | "scrollPaddingInlineEnd" + | "scrollPaddingInlineStart" | "scrollPaddingLeft" | "scrollPaddingRight" | "scrollPaddingTop" | "scrollSnapAlign" | "scrollSnapStop" | "scrollSnapType" + | "scrollbarColor" + | "scrollbarGutter" + | "scrollbarWidth" | "shapeImageThreshold" | "shapeMargin" | "shapeOutside" + | "shapeRendering" + | "stopColor" + | "stopOpacity" + | "strokeDasharray" + | "strokeDashoffset" + | "strokeLinecap" + | "strokeLinejoin" + | "strokeMiterlimit" + | "strokeOpacity" + | "strokeWidth" | "tabSize" | "tableLayout" | "textAlign" | "textAlignLast" + | "textAnchor" | "textCombineUpright" | "textDecorationColor" | "textDecorationLine" @@ -326,7 +356,9 @@ export type CamelCasedProperty = | "translate" | "unicodeBidi" | "userSelect" + | "vectorEffect" | "verticalAlign" + | "viewTransitionName" | "visibility" | "whiteSpaceCollapse" | "widows" @@ -336,6 +368,8 @@ export type CamelCasedProperty = | "wordSpacing" | "wordWrap" | "writingMode" + | "x" + | "y" | "zIndex" | "zoom"; @@ -353,6 +387,8 @@ export type HyphenatedProperty = | "align-content" | "align-items" | "align-self" + | "alignment-baseline" + | "animation-composition" | "animation-delay" | "animation-direction" | "animation-duration" @@ -376,9 +412,6 @@ export type HyphenatedProperty = | "background-repeat" | "background-size" | "block-size" - | "border-block-color" - | "border-block-style" - | "border-block-width" | "border-block-end-color" | "border-block-end-style" | "border-block-end-width" @@ -398,9 +431,6 @@ export type HyphenatedProperty = | "border-image-slice" | "border-image-source" | "border-image-width" - | "border-inline-color" - | "border-inline-style" - | "border-inline-width" | "border-inline-end-color" | "border-inline-end-style" | "border-inline-end-width" @@ -431,9 +461,10 @@ export type HyphenatedProperty = | "caption-side" | "caret-color" | "clear" - | "clip" | "clip-path" + | "clip-rule" | "color" + | "color-interpolation-filters" | "color-scheme" | "column-count" | "column-fill" @@ -456,10 +487,17 @@ export type HyphenatedProperty = | "counter-reset" | "counter-set" | "cursor" + | "cx" + | "cy" + | "d" | "direction" | "display" + | "dominant-baseline" | "empty-cells" | "field-sizing" + | "fill" + | "fill-opacity" + | "fill-rule" | "filter" | "flex-basis" | "flex-direction" @@ -467,15 +505,16 @@ export type HyphenatedProperty = | "flex-shrink" | "flex-wrap" | "float" + | "flood-color" + | "flood-opacity" | "font-family" | "font-feature-settings" | "font-kerning" | "font-language-override" | "font-optical-sizing" - | "font-variation-settings" + | "font-palette" | "font-size" | "font-size-adjust" - | "font-stretch" | "font-style" | "font-synthesis-small-caps" | "font-synthesis-style" @@ -483,10 +522,13 @@ export type HyphenatedProperty = | "font-variant-alternates" | "font-variant-caps" | "font-variant-east-asian" + | "font-variant-emoji" | "font-variant-ligatures" | "font-variant-numeric" | "font-variant-position" + | "font-variation-settings" | "font-weight" + | "forced-color-adjust" | "grid-auto-columns" | "grid-auto-flow" | "grid-auto-rows" @@ -504,6 +546,7 @@ export type HyphenatedProperty = | "hyphens" | "image-orientation" | "image-rendering" + | "initial-letter" | "inline-size" | "inset-block-end" | "inset-block-start" @@ -515,7 +558,9 @@ export type HyphenatedProperty = | "justify-self" | "left" | "letter-spacing" + | "lighting-color" | "line-break" + | "line-clamp" | "line-height" | "list-style-image" | "list-style-position" @@ -528,6 +573,9 @@ export type HyphenatedProperty = | "margin-left" | "margin-right" | "margin-top" + | "marker-end" + | "marker-mid" + | "marker-start" | "mask-border-mode" | "mask-border-outset" | "mask-border-repeat" @@ -544,7 +592,6 @@ export type HyphenatedProperty = | "mask-size" | "mask-type" | "math-depth" - | "math-shift" | "math-style" | "max-block-size" | "max-height" @@ -569,6 +616,10 @@ export type HyphenatedProperty = | "outline-offset" | "outline-style" | "outline-width" + | "overflow-anchor" + | "overflow-block" + | "overflow-clip-margin" + | "overflow-inline" | "overflow-wrap" | "overflow-x" | "overflow-y" @@ -586,9 +637,6 @@ export type HyphenatedProperty = | "padding-right" | "padding-top" | "page" - | "page-break-after" - | "page-break-before" - | "page-break-inside" | "paint-order" | "perspective" | "perspective-origin" @@ -596,41 +644,57 @@ export type HyphenatedProperty = | "position" | "print-color-adjust" | "quotes" + | "r" | "resize" | "right" | "rotate" | "row-gap" + | "ruby-align" + | "ruby-position" + | "rx" + | "ry" | "scale" - | "scrollbar-color" - | "scrollbar-gutter" - | "scrollbar-width" | "scroll-behavior" - | "scroll-margin-block-start" | "scroll-margin-block-end" + | "scroll-margin-block-start" | "scroll-margin-bottom" - | "scroll-margin-inline-start" | "scroll-margin-inline-end" + | "scroll-margin-inline-start" | "scroll-margin-left" | "scroll-margin-right" | "scroll-margin-top" - | "scroll-padding-block-start" | "scroll-padding-block-end" + | "scroll-padding-block-start" | "scroll-padding-bottom" - | "scroll-padding-inline-start" | "scroll-padding-inline-end" + | "scroll-padding-inline-start" | "scroll-padding-left" | "scroll-padding-right" | "scroll-padding-top" | "scroll-snap-align" | "scroll-snap-stop" | "scroll-snap-type" + | "scrollbar-color" + | "scrollbar-gutter" + | "scrollbar-width" | "shape-image-threshold" | "shape-margin" | "shape-outside" + | "shape-rendering" + | "stop-color" + | "stop-opacity" + | "stroke-dasharray" + | "stroke-dashoffset" + | "stroke-linecap" + | "stroke-linejoin" + | "stroke-miterlimit" + | "stroke-opacity" + | "stroke-width" | "tab-size" | "table-layout" | "text-align" | "text-align-last" + | "text-anchor" | "text-combine-upright" | "text-decoration-color" | "text-decoration-line" @@ -666,7 +730,9 @@ export type HyphenatedProperty = | "translate" | "unicode-bidi" | "user-select" + | "vector-effect" | "vertical-align" + | "view-transition-name" | "visibility" | "white-space-collapse" | "widows" @@ -676,6 +742,8 @@ export type HyphenatedProperty = | "word-spacing" | "word-wrap" | "writing-mode" + | "x" + | "y" | "z-index" | "zoom"; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1ae0efec375f..4cd97a1c721d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1318,8 +1318,8 @@ importers: specifier: ^4.0.0 version: 4.0.0 mdn-data: - specifier: 2.8.0 - version: 2.8.0 + specifier: 2.23.0 + version: 2.23.0 vitest: specifier: ^3.1.2 version: 3.1.2(@types/debug@4.1.12)(@types/node@22.13.10)(@vitest/browser@3.1.2)(jiti@2.4.2)(jsdom@20.0.3)(msw@2.7.3(@types/node@22.13.10)(typescript@5.8.2))(tsx@4.19.3) @@ -7510,8 +7510,8 @@ packages: mdn-data@2.0.30: resolution: {integrity: sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==} - mdn-data@2.8.0: - resolution: {integrity: sha512-sez0u7AGXSY0LU2NKoHoMn2F2YAbHgDEXb91Wk2zAfTYsDoOqA4aJS+ZVIlk7ZdODBuOL0vhJ4yF57gMojXVbw==} + mdn-data@2.23.0: + resolution: {integrity: sha512-786vq1+4079JSeu2XdcDjrhi/Ry7BWtjDl9WtGPWLiIHb2T66GvIVflZTBoSNZ5JqTtJGYEVMuFA/lbQlMOyDQ==} media-query-parser@2.0.2: resolution: {integrity: sha512-1N4qp+jE0pL5Xv4uEcwVUhIkwdUO3S/9gML90nqKA7v7FcOS5vUtatfzok9S9U1EJU8dHWlcv95WLnKmmxZI9w==} @@ -15454,7 +15454,7 @@ snapshots: mdn-data@2.0.30: {} - mdn-data@2.8.0: {} + mdn-data@2.23.0: {} media-query-parser@2.0.2: dependencies: From 24bb641594ab1d8902ab5e0729548f881f32892a Mon Sep 17 00:00:00 2001 From: Bogdan Chadkin Date: Fri, 18 Jul 2025 17:48:40 +0200 Subject: [PATCH 2/3] Fix test --- .../parse-intermediate-or-invalid-value.ts.test.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/builder/app/builder/features/style-panel/shared/css-value-input/parse-intermediate-or-invalid-value.ts.test.ts b/apps/builder/app/builder/features/style-panel/shared/css-value-input/parse-intermediate-or-invalid-value.ts.test.ts index 9ba4da52208d..b028d05fd46f 100644 --- a/apps/builder/app/builder/features/style-panel/shared/css-value-input/parse-intermediate-or-invalid-value.ts.test.ts +++ b/apps/builder/app/builder/features/style-panel/shared/css-value-input/parse-intermediate-or-invalid-value.ts.test.ts @@ -49,7 +49,7 @@ describe("Parse intermediate or invalid value without math evaluation", () => { }); test("fallback to % if px is not supported", () => { - const result = parseIntermediateOrInvalidValue("font-stretch", { + const result = parseIntermediateOrInvalidValue("opacity", { type: "intermediate", value: "10", }); From 96b019d44576d011db9b694c56328082d7a8e001 Mon Sep 17 00:00:00 2001 From: Bogdan Chadkin Date: Fri, 18 Jul 2025 17:55:49 +0200 Subject: [PATCH 3/3] Fix types --- .../props-section/animation/animation-keyframes.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/builder/app/builder/features/settings-panel/props-section/animation/animation-keyframes.tsx b/apps/builder/app/builder/features/settings-panel/props-section/animation/animation-keyframes.tsx index 50039b0af695..ad36ea42ed63 100644 --- a/apps/builder/app/builder/features/settings-panel/props-section/animation/animation-keyframes.tsx +++ b/apps/builder/app/builder/features/settings-panel/props-section/animation/animation-keyframes.tsx @@ -67,7 +67,7 @@ const OffsetInput = ({ intermediateValue={intermediateValue} styleSource="default" /* same as offset has 0 - 100% */ - property={"font-stretch"} + property={"opacity"} value={ value !== undefined ? { type: "unit", value: roundOffset(value), unit: "%" }