@webstudio-is/css-engine 0.91.0 → 0.93.0

package/lib/core/index.js

@@ -1,4 +1,5 @@
-import { CssEngine } from "./css-engine";
+"use strict";
+export { CssEngine } from "./css-engine";
 export * from "./create-css-engine";
 export * from "./to-value";
 export * from "./to-property";
@@ -6,6 +7,3 @@ export * from "./match-media";
 export * from "./equal-media";
 export * from "./compare-media";
 export * from "./find-applicable-media";
-export {
-  CssEngine
-};

package/lib/core/match-media.js

@@ -1,8 +1,6 @@
-const matchMedia = (options, width) => {
+"use strict";
+export const matchMedia = (options, width) => {
   const minWidth = options.minWidth ?? Number.MIN_SAFE_INTEGER;
   const maxWidth = options.maxWidth ?? Number.MAX_SAFE_INTEGER;
   return width >= minWidth && width <= maxWidth;
 };
-export {
-  matchMedia
-};

package/{src/core/match-media.test.ts → lib/core/match-media.test.js}

@@ -1,19 +1,17 @@
+"use strict";
 import { describe, expect, test } from "@jest/globals";
 import { matchMedia } from "./match-media";
-
 describe("matchMedia", () => {
   test("minWidth", () => {
     expect(matchMedia({ minWidth: 100 }, 10)).toBe(false);
     expect(matchMedia({ minWidth: 100 }, 100)).toBe(true);
     expect(matchMedia({ minWidth: 100 }, 101)).toBe(true);
   });
-
   test("maxWidth", () => {
     expect(matchMedia({ maxWidth: 100 }, 101)).toBe(false);
     expect(matchMedia({ maxWidth: 100 }, 100)).toBe(true);
     expect(matchMedia({ maxWidth: 100 }, 10)).toBe(true);
   });
-
   test("minWidth and maxWidth", () => {
     expect(matchMedia({ maxWidth: 100, minWidth: 10 }, 9)).toBe(false);
     expect(matchMedia({ maxWidth: 100, minWidth: 10 }, 101)).toBe(false);

package/lib/core/rules.js

@@ -1,3 +1,4 @@
+"use strict";
 import { toValue } from "./to-value";
 import { toProperty } from "./to-property";
 class StylePropertyMap {
@@ -60,7 +61,7 @@ class StylePropertyMap {
     return this.#string;
   }
 }
-class StyleRule {
+export class StyleRule {
   styleMap;
   selectorText;
   onChange;
@@ -88,7 +89,7 @@ ${this.styleMap.toString({
 ${spaces}}`;
   }
 }
-class MediaRule {
+export class MediaRule {
   options;
   rules = [];
   #mediaType;
@@ -126,7 +127,7 @@ ${rules.join(
 }`;
   }
 }
-class PlaintextRule {
+export class PlaintextRule {
   cssText;
   styleMap = new StylePropertyMap();
   constructor(cssText) {
@@ -136,7 +137,7 @@ class PlaintextRule {
     return this.cssText;
   }
 }
-class FontFaceRule {
+export class FontFaceRule {
   options;
   constructor(options) {
     this.options = options;
@@ -159,9 +160,3 @@ class FontFaceRule {
 }`;
   }
 }
-export {
-  FontFaceRule,
-  MediaRule,
-  PlaintextRule,
-  StyleRule
-};

package/lib/core/style-element.js

@@ -1,4 +1,5 @@
-class StyleElement {
+"use strict";
+export class StyleElement {
   #element;
   #name;
   constructor(name = "") {
@@ -36,6 +37,3 @@ class StyleElement {
     }
   }
 }
-export {
-  StyleElement
-};

package/lib/core/style-sheet.js

@@ -1,4 +1,5 @@
-class StyleSheet {
+"use strict";
+export class StyleSheet {
   #cssText = "";
   #element;
   constructor(element) {
@@ -11,6 +12,3 @@ class StyleSheet {
     }
   }
 }
-export {
-  StyleSheet
-};

package/lib/core/to-property.js

@@ -1,10 +1,8 @@
+"use strict";
 import hyphenate from "hyphenate-style-name";
-const toProperty = (property) => {
+export const toProperty = (property) => {
   if (property === "backgroundClip") {
     return "-webkit-background-clip";
   }
   return hyphenate(property);
 };
-export {
-  toProperty
-};

package/{src/core/to-property.test.ts → lib/core/to-property.test.js}

@@ -1,6 +1,6 @@
+"use strict";
 import { describe, test, expect } from "@jest/globals";
 import { toProperty } from "./to-property";
-
 describe("toProperty", () => {
   test("boxSizing", () => {
     expect(toProperty("boxSizing")).toBe("box-sizing");

package/lib/core/to-value.js

@@ -1,3 +1,4 @@
+"use strict";
 import { captureError } from "@webstudio-is/error-utils";
 import { DEFAULT_FONT_FALLBACK, SYSTEM_FONTS } from "@webstudio-is/fonts";
 const fallbackTransform = (styleValue) => {
@@ -16,7 +17,7 @@ const fallbackTransform = (styleValue) => {
     };
   }
 };
-const toValue = (styleValue, transformValue) => {
+export const toValue = (styleValue, transformValue) => {
   if (styleValue === void 0) {
     return "";
   }
@@ -73,6 +74,3 @@ const toValue = (styleValue, transformValue) => {
   }
   return captureError(new Error("Unknown value type"), value);
 };
-export {
-  toValue
-};

package/{src/core/to-value.test.ts → lib/core/to-value.test.js}

@@ -1,32 +1,27 @@
+"use strict";
 import { describe, test, expect } from "@jest/globals";
 import { toValue } from "./to-value";
-
 describe("Convert WS CSS Values to native CSS strings", () => {
   test("keyword", () => {
     const value = toValue({ type: "keyword", value: "red" });
     expect(value).toBe("red");
   });
-
   test("unit", () => {
     const value = toValue({ type: "unit", value: 10, unit: "px" });
     expect(value).toBe("10px");
   });
-
   test("invalid", () => {
     const value = toValue({ type: "invalid", value: "bad" });
     expect(value).toBe("bad");
   });
-
   test("unset", () => {
     const value = toValue({ type: "unset", value: "" });
     expect(value).toBe("");
   });
-
   test("var", () => {
     const value = toValue({ type: "var", value: "namespace", fallbacks: [] });
     expect(value).toBe("var(--namespace)");
   });
-
   test("var with fallbacks", () => {
     const value = toValue({
       type: "var",
@@ -34,56 +29,52 @@ describe("Convert WS CSS Values to native CSS strings", () => {
       fallbacks: [
         {
           type: "keyword",
-          value: "normal",
+          value: "normal"
         },
         {
           type: "unit",
           value: 10,
-          unit: "px",
-        },
-      ],
+          unit: "px"
+        }
+      ]
     });
     expect(value).toBe("var(--namespace, normal, 10px)");
   });
-
   test("fontFamily", () => {
     const value = toValue({
       type: "fontFamily",
-      value: ["Courier New"],
+      value: ["Courier New"]
     });
     expect(value).toBe("Courier New, monospace");
   });
-
   test("Transform font family value to override default fallback", () => {
     const value = toValue(
       {
         type: "fontFamily",
-        value: ["Courier New"],
+        value: ["Courier New"]
       },
       (styleValue) => {
         if (styleValue.type === "fontFamily") {
           return {
             type: "fontFamily",
-            value: [styleValue.value[0]],
+            value: [styleValue.value[0]]
           };
         }
       }
     );
     expect(value).toBe("Courier New");
   });
-
   test("array", () => {
-    const assets = new Map<string, { path: string }>([
-      ["1234567890", { path: "foo.png" }],
+    const assets = /* @__PURE__ */ new Map([
+      ["1234567890", { path: "foo.png" }]
     ]);
-
     const value = toValue(
       {
         type: "layers",
         value: [
           {
             type: "keyword",
-            value: "auto",
+            value: "auto"
           },
           { type: "unit", value: 10, unit: "px" },
           { type: "unparsed", value: "calc(10px)" },
@@ -91,34 +82,32 @@ describe("Convert WS CSS Values to native CSS strings", () => {
             type: "image",
             value: {
               type: "asset",
-              value: "1234567890",
-            },
-          },
-        ],
+              value: "1234567890"
+            }
+          }
+        ]
       },
       (styleValue) => {
         if (styleValue.type === "image" && styleValue.value.type === "asset") {
           const asset = assets.get(styleValue.value.value);
-          if (asset === undefined) {
+          if (asset === void 0) {
             return {
               type: "keyword",
-              value: "none",
+              value: "none"
             };
           }
           return {
             type: "image",
             value: {
               type: "url",
-              url: asset.path,
-            },
+              url: asset.path
+            }
           };
         }
       }
     );
-
     expect(value).toBe("auto, 10px, calc(10px), url(foo.png)");
   });
-
   test("tuple", () => {
     const value = toValue({
       type: "tuple",
@@ -126,8 +115,8 @@ describe("Convert WS CSS Values to native CSS strings", () => {
         { type: "unit", value: 10, unit: "px" },
         { type: "unit", value: 20, unit: "px" },
         { type: "unit", value: 30, unit: "px" },
-        { type: "unit", value: 40, unit: "px" },
-      ],
+        { type: "unit", value: 40, unit: "px" }
+      ]
     });
     expect(value).toBe("10px 20px 30px 40px");
   });

package/lib/index.js

@@ -1 +1,3 @@
+"use strict";
 export * from "./core";
+export * from "./schema";

package/lib/schema.js

@@ -0,0 +1,98 @@
+"use strict";
+import { z } from "zod";
+const Unit = z.string();
+export const UnitValue = z.object({
+  type: z.literal("unit"),
+  unit: Unit,
+  value: z.number()
+});
+export const KeywordValue = z.object({
+  type: z.literal("keyword"),
+  // @todo use exact type
+  value: z.string()
+});
+export const UnparsedValue = z.object({
+  type: z.literal("unparsed"),
+  value: z.string(),
+  // For the builder we want to be able to hide background-image
+  hidden: z.boolean().optional()
+});
+const FontFamilyValue = z.object({
+  type: z.literal("fontFamily"),
+  value: z.array(z.string())
+});
+const RgbValue = z.object({
+  type: z.literal("rgb"),
+  r: z.number(),
+  g: z.number(),
+  b: z.number(),
+  alpha: z.number()
+});
+export const ImageValue = z.object({
+  type: z.literal("image"),
+  value: z.union([
+    z.object({ type: z.literal("asset"), value: z.string() }),
+    // url is not stored in db and only used by css-engine transformValue
+    // to prepare image value for rendering
+    z.object({ type: z.literal("url"), url: z.string() })
+  ]),
+  // For the builder we want to be able to hide images
+  hidden: z.boolean().optional()
+});
+export const InvalidValue = z.object({
+  type: z.literal("invalid"),
+  value: z.string()
+});
+const UnsetValue = z.object({
+  type: z.literal("unset"),
+  value: z.literal("")
+});
+export const TupleValueItem = z.union([
+  UnitValue,
+  KeywordValue,
+  UnparsedValue,
+  RgbValue
+]);
+export const TupleValue = z.object({
+  type: z.literal("tuple"),
+  value: z.array(TupleValueItem),
+  hidden: z.boolean().optional()
+});
+const LayerValueItem = z.union([
+  UnitValue,
+  KeywordValue,
+  UnparsedValue,
+  ImageValue,
+  TupleValue,
+  InvalidValue
+]);
+export const LayersValue = z.object({
+  type: z.literal("layers"),
+  value: z.array(LayerValueItem)
+});
+const ValidStaticStyleValue = z.union([
+  ImageValue,
+  LayersValue,
+  UnitValue,
+  KeywordValue,
+  FontFamilyValue,
+  RgbValue,
+  UnparsedValue,
+  TupleValue
+]);
+export const isValidStaticStyleValue = (styleValue) => {
+  const staticStyleValue = styleValue;
+  return staticStyleValue.type === "image" || staticStyleValue.type === "layers" || staticStyleValue.type === "unit" || staticStyleValue.type === "keyword" || staticStyleValue.type === "fontFamily" || staticStyleValue.type === "rgb" || staticStyleValue.type === "unparsed" || staticStyleValue.type === "tuple";
+};
+const VarValue = z.object({
+  type: z.literal("var"),
+  value: z.string(),
+  fallbacks: z.array(ValidStaticStyleValue)
+});
+export const StyleValue = z.union([
+  ValidStaticStyleValue,
+  InvalidValue,
+  UnsetValue,
+  VarValue
+]);
+const Style = z.record(z.string(), StyleValue);

package/lib/types/__generated__/types.d.ts

@@ -0,0 +1,2 @@
+export type Property = "WebkitFontSmoothing" | "MozOsxFontSmoothing" | "accentColor" | "alignContent" | "alignItems" | "alignSelf" | "alignTracks" | "animationComposition" | "animationDelay" | "animationDirection" | "animationDuration" | "animationFillMode" | "animationIterationCount" | "animationName" | "animationPlayState" | "animationTimingFunction" | "animationTimeline" | "appearance" | "aspectRatio" | "backdropFilter" | "backfaceVisibility" | "backgroundAttachment" | "backgroundBlendMode" | "backgroundClip" | "backgroundColor" | "backgroundImage" | "backgroundOrigin" | "backgroundPosition" | "backgroundPositionX" | "backgroundPositionY" | "backgroundRepeat" | "backgroundSize" | "blockOverflow" | "blockSize" | "borderBlockColor" | "borderBlockStyle" | "borderBlockWidth" | "borderBlockEndColor" | "borderBlockEndStyle" | "borderBlockEndWidth" | "borderBlockStartColor" | "borderBlockStartStyle" | "borderBlockStartWidth" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderCollapse" | "borderEndEndRadius" | "borderEndStartRadius" | "borderImageOutset" | "borderImageRepeat" | "borderImageSlice" | "borderImageSource" | "borderImageWidth" | "borderInlineColor" | "borderInlineStyle" | "borderInlineWidth" | "borderInlineEndColor" | "borderInlineEndStyle" | "borderInlineEndWidth" | "borderInlineStartColor" | "borderInlineStartStyle" | "borderInlineStartWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderSpacing" | "borderStartEndRadius" | "borderStartStartRadius" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxDecorationBreak" | "boxShadow" | "boxSizing" | "breakAfter" | "breakBefore" | "breakInside" | "captionSide" | "caretColor" | "caretShape" | "clear" | "clip" | "clipPath" | "color" | "colorScheme" | "columnCount" | "columnFill" | "columnGap" | "columnRuleColor" | "columnRuleStyle" | "columnRuleWidth" | "columnSpan" | "columnWidth" | "contain" | "containIntrinsicBlockSize" | "containIntrinsicHeight" | "containIntrinsicInlineSize" | "containIntrinsicWidth" | "containerName" | "containerType" | "content" | "contentVisibility" | "counterIncrement" | "counterReset" | "counterSet" | "cursor" | "direction" | "display" | "emptyCells" | "filter" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "float" | "fontFamily" | "fontFeatureSettings" | "fontKerning" | "fontLanguageOverride" | "fontOpticalSizing" | "fontPalette" | "fontVariationSettings" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontSynthesis" | "fontVariant" | "fontVariantAlternates" | "fontVariantCaps" | "fontVariantEastAsian" | "fontVariantEmoji" | "fontVariantLigatures" | "fontVariantNumeric" | "fontVariantPosition" | "fontWeight" | "forcedColorAdjust" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "hangingPunctuation" | "height" | "hyphenateCharacter" | "hyphenateLimitChars" | "hyphens" | "imageOrientation" | "imageRendering" | "imageResolution" | "initialLetter" | "initialLetterAlign" | "inlineSize" | "inputSecurity" | "insetBlockEnd" | "insetBlockStart" | "insetInlineEnd" | "insetInlineStart" | "isolation" | "justifyContent" | "justifyItems" | "justifySelf" | "justifyTracks" | "left" | "letterSpacing" | "lineBreak" | "lineClamp" | "lineHeight" | "lineHeightStep" | "listStyleImage" | "listStylePosition" | "listStyleType" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "marginTrim" | "maskBorderMode" | "maskBorderOutset" | "maskBorderRepeat" | "maskBorderSlice" | "maskBorderSource" | "maskBorderWidth" | "maskClip" | "maskComposite" | "maskImage" | "maskMode" | "maskOrigin" | "maskPosition" | "maskRepeat" | "maskSize" | "maskType" | "masonryAutoFlow" | "mathDepth" | "mathShift" | "mathStyle" | "maxBlockSize" | "maxHeight" | "maxInlineSize" | "maxLines" | "maxWidth" | "minBlockSize" | "minHeight" | "minInlineSize" | "minWidth" | "mixBlendMode" | "objectFit" | "objectPosition" | "offsetAnchor" | "offsetDistance" | "offsetPath" | "offsetPosition" | "offsetRotate" | "opacity" | "order" | "orphans" | "outlineColor" | "outlineOffset" | "outlineStyle" | "outlineWidth" | "overflow" | "overflowAnchor" | "overflowBlock" | "overflowClipMargin" | "overflowInline" | "overflowWrap" | "overflowX" | "overflowY" | "overscrollBehavior" | "overscrollBehaviorBlock" | "overscrollBehaviorInline" | "overscrollBehaviorX" | "overscrollBehaviorY" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "page" | "pageBreakAfter" | "pageBreakBefore" | "pageBreakInside" | "paintOrder" | "perspective" | "perspectiveOrigin" | "pointerEvents" | "position" | "printColorAdjust" | "quotes" | "resize" | "right" | "rotate" | "rowGap" | "rubyAlign" | "rubyMerge" | "rubyPosition" | "scale" | "scrollbarColor" | "scrollbarGutter" | "scrollbarWidth" | "scrollBehavior" | "scrollMarginBlockStart" | "scrollMarginBlockEnd" | "scrollMarginBottom" | "scrollMarginInlineStart" | "scrollMarginInlineEnd" | "scrollMarginLeft" | "scrollMarginRight" | "scrollMarginTop" | "scrollPaddingBlockStart" | "scrollPaddingBlockEnd" | "scrollPaddingBottom" | "scrollPaddingInlineStart" | "scrollPaddingInlineEnd" | "scrollPaddingLeft" | "scrollPaddingRight" | "scrollPaddingTop" | "scrollSnapAlign" | "scrollSnapStop" | "scrollSnapType" | "scrollTimelineAxis" | "scrollTimelineName" | "shapeImageThreshold" | "shapeMargin" | "shapeOutside" | "tabSize" | "tableLayout" | "textAlign" | "textAlignLast" | "textCombineUpright" | "textDecorationColor" | "textDecorationLine" | "textDecorationSkip" | "textDecorationSkipInk" | "textDecorationStyle" | "textDecorationThickness" | "textEmphasisColor" | "textEmphasisPosition" | "textEmphasisStyle" | "textIndent" | "textJustify" | "textOrientation" | "textOverflow" | "textRendering" | "textShadow" | "textSizeAdjust" | "textTransform" | "textUnderlineOffset" | "textUnderlinePosition" | "top" | "touchAction" | "transform" | "transformBox" | "transformOrigin" | "transformStyle" | "transitionDelay" | "transitionDuration" | "transitionProperty" | "transitionTimingFunction" | "translate" | "unicodeBidi" | "userSelect" | "verticalAlign" | "viewTransitionName" | "visibility" | "whiteSpace" | "widows" | "width" | "willChange" | "wordBreak" | "wordSpacing" | "wordWrap" | "writingMode" | "zIndex";
+export type Unit = "%" | "deg" | "grad" | "rad" | "turn" | "db" | "fr" | "hz" | "khz" | "cm" | "mm" | "q" | "in" | "pt" | "pc" | "px" | "em" | "rem" | "ex" | "rex" | "cap" | "rcap" | "ch" | "rch" | "ic" | "ric" | "lh" | "rlh" | "vw" | "svw" | "lvw" | "dvw" | "vh" | "svh" | "lvh" | "dvh" | "vi" | "svi" | "lvi" | "dvi" | "vb" | "svb" | "lvb" | "dvb" | "vmin" | "svmin" | "lvmin" | "dvmin" | "vmax" | "svmax" | "lvmax" | "dvmax" | "cqw" | "cqh" | "cqi" | "cqb" | "cqmin" | "cqmax" | "dpi" | "dpcm" | "dppx" | "x" | "st" | "s" | "ms";

package/lib/types/core/css-engine.d.ts

@@ -1,4 +1,4 @@
-import type { Style } from "@webstudio-is/css-data";
+import type { Style } from "../schema";
 import { MediaRule, PlaintextRule, StyleRule, type FontFaceOptions, type MediaRuleOptions } from "./rules";
 import type { TransformValue } from "./to-value";
 type CssRule = {

package/lib/types/core/rules.d.ts

@@ -1,4 +1,4 @@
-import type { Style, StyleProperty, StyleValue } from "@webstudio-is/css-data";
+import type { Style, StyleProperty, StyleValue } from "../schema";
 import { type TransformValue } from "./to-value";
 declare class StylePropertyMap {
     #private;
@@ -8,7 +8,7 @@ declare class StylePropertyMap {
     set(property: StyleProperty, value?: StyleValue): void;
     has(property: StyleProperty): boolean;
     get size(): number;
-    keys(): IterableIterator<"clip" | "top" | "right" | `--${string}` | "WebkitFontSmoothing" | "MozOsxFontSmoothing" | "accentColor" | "alignContent" | "alignItems" | "alignSelf" | "alignTracks" | "animationComposition" | "animationDelay" | "animationDirection" | "animationDuration" | "animationFillMode" | "animationIterationCount" | "animationName" | "animationPlayState" | "animationTimingFunction" | "animationTimeline" | "appearance" | "aspectRatio" | "backdropFilter" | "backfaceVisibility" | "backgroundAttachment" | "backgroundBlendMode" | "backgroundClip" | "backgroundColor" | "backgroundImage" | "backgroundOrigin" | "backgroundPosition" | "backgroundPositionX" | "backgroundPositionY" | "backgroundRepeat" | "backgroundSize" | "blockOverflow" | "blockSize" | "borderBlockColor" | "borderBlockStyle" | "borderBlockWidth" | "borderBlockEndColor" | "borderBlockEndStyle" | "borderBlockEndWidth" | "borderBlockStartColor" | "borderBlockStartStyle" | "borderBlockStartWidth" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderCollapse" | "borderEndEndRadius" | "borderEndStartRadius" | "borderImageOutset" | "borderImageRepeat" | "borderImageSlice" | "borderImageSource" | "borderImageWidth" | "borderInlineColor" | "borderInlineStyle" | "borderInlineWidth" | "borderInlineEndColor" | "borderInlineEndStyle" | "borderInlineEndWidth" | "borderInlineStartColor" | "borderInlineStartStyle" | "borderInlineStartWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderSpacing" | "borderStartEndRadius" | "borderStartStartRadius" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxDecorationBreak" | "boxShadow" | "boxSizing" | "breakAfter" | "breakBefore" | "breakInside" | "captionSide" | "caretColor" | "caretShape" | "clear" | "clipPath" | "color" | "colorScheme" | "columnCount" | "columnFill" | "columnGap" | "columnRuleColor" | "columnRuleStyle" | "columnRuleWidth" | "columnSpan" | "columnWidth" | "contain" | "containIntrinsicBlockSize" | "containIntrinsicHeight" | "containIntrinsicInlineSize" | "containIntrinsicWidth" | "containerName" | "containerType" | "content" | "contentVisibility" | "counterIncrement" | "counterReset" | "counterSet" | "cursor" | "direction" | "display" | "emptyCells" | "filter" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "float" | "fontFamily" | "fontFeatureSettings" | "fontKerning" | "fontLanguageOverride" | "fontOpticalSizing" | "fontPalette" | "fontVariationSettings" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontSynthesis" | "fontVariant" | "fontVariantAlternates" | "fontVariantCaps" | "fontVariantEastAsian" | "fontVariantEmoji" | "fontVariantLigatures" | "fontVariantNumeric" | "fontVariantPosition" | "fontWeight" | "forcedColorAdjust" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "hangingPunctuation" | "height" | "hyphenateCharacter" | "hyphenateLimitChars" | "hyphens" | "imageOrientation" | "imageRendering" | "imageResolution" | "initialLetter" | "initialLetterAlign" | "inlineSize" | "inputSecurity" | "insetBlockEnd" | "insetBlockStart" | "insetInlineEnd" | "insetInlineStart" | "isolation" | "justifyContent" | "justifyItems" | "justifySelf" | "justifyTracks" | "left" | "letterSpacing" | "lineBreak" | "lineClamp" | "lineHeight" | "lineHeightStep" | "listStyleImage" | "listStylePosition" | "listStyleType" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "marginTrim" | "maskBorderMode" | "maskBorderOutset" | "maskBorderRepeat" | "maskBorderSlice" | "maskBorderSource" | "maskBorderWidth" | "maskClip" | "maskComposite" | "maskImage" | "maskMode" | "maskOrigin" | "maskPosition" | "maskRepeat" | "maskSize" | "maskType" | "masonryAutoFlow" | "mathDepth" | "mathShift" | "mathStyle" | "maxBlockSize" | "maxHeight" | "maxInlineSize" | "maxLines" | "maxWidth" | "minBlockSize" | "minHeight" | "minInlineSize" | "minWidth" | "mixBlendMode" | "objectFit" | "objectPosition" | "offsetAnchor" | "offsetDistance" | "offsetPath" | "offsetPosition" | "offsetRotate" | "opacity" | "order" | "orphans" | "outlineColor" | "outlineOffset" | "outlineStyle" | "outlineWidth" | "overflow" | "overflowAnchor" | "overflowBlock" | "overflowClipMargin" | "overflowInline" | "overflowWrap" | "overflowX" | "overflowY" | "overscrollBehavior" | "overscrollBehaviorBlock" | "overscrollBehaviorInline" | "overscrollBehaviorX" | "overscrollBehaviorY" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "page" | "pageBreakAfter" | "pageBreakBefore" | "pageBreakInside" | "paintOrder" | "perspective" | "perspectiveOrigin" | "pointerEvents" | "position" | "printColorAdjust" | "quotes" | "resize" | "rotate" | "rowGap" | "rubyAlign" | "rubyMerge" | "rubyPosition" | "scale" | "scrollbarColor" | "scrollbarGutter" | "scrollbarWidth" | "scrollBehavior" | "scrollMarginBlockStart" | "scrollMarginBlockEnd" | "scrollMarginBottom" | "scrollMarginInlineStart" | "scrollMarginInlineEnd" | "scrollMarginLeft" | "scrollMarginRight" | "scrollMarginTop" | "scrollPaddingBlockStart" | "scrollPaddingBlockEnd" | "scrollPaddingBottom" | "scrollPaddingInlineStart" | "scrollPaddingInlineEnd" | "scrollPaddingLeft" | "scrollPaddingRight" | "scrollPaddingTop" | "scrollSnapAlign" | "scrollSnapStop" | "scrollSnapType" | "scrollTimelineAxis" | "scrollTimelineName" | "shapeImageThreshold" | "shapeMargin" | "shapeOutside" | "tabSize" | "tableLayout" | "textAlign" | "textAlignLast" | "textCombineUpright" | "textDecorationColor" | "textDecorationLine" | "textDecorationSkip" | "textDecorationSkipInk" | "textDecorationStyle" | "textDecorationThickness" | "textEmphasisColor" | "textEmphasisPosition" | "textEmphasisStyle" | "textIndent" | "textJustify" | "textOrientation" | "textOverflow" | "textRendering" | "textShadow" | "textSizeAdjust" | "textTransform" | "textUnderlineOffset" | "textUnderlinePosition" | "touchAction" | "transform" | "transformBox" | "transformOrigin" | "transformStyle" | "transitionDelay" | "transitionDuration" | "transitionProperty" | "transitionTimingFunction" | "translate" | "unicodeBidi" | "userSelect" | "verticalAlign" | "viewTransitionName" | "visibility" | "whiteSpace" | "widows" | "width" | "willChange" | "wordBreak" | "wordSpacing" | "wordWrap" | "writingMode" | "zIndex">;
+    keys(): IterableIterator<StyleProperty>;
     delete(property: StyleProperty): void;
     clear(): void;
     toString({ indent }?: {

package/lib/types/core/to-property.d.ts

@@ -1,2 +1,2 @@
-import type { StyleProperty } from "@webstudio-is/css-data";
+import type { StyleProperty } from "../schema";
 export declare const toProperty: (property: StyleProperty) => string;

package/lib/types/core/to-value.d.ts

@@ -1,3 +1,3 @@
-import type { StyleValue } from "@webstudio-is/css-data";
+import type { StyleValue } from "../schema";
 export type TransformValue = (styleValue: StyleValue) => undefined | StyleValue;
 export declare const toValue: (styleValue: undefined | StyleValue, transformValue?: TransformValue) => string;

package/lib/types/index.d.ts

@@ -1 +1,3 @@
 export * from "./core";
+export * from "./schema";
+export type { Property as __Property, Unit as __Unit, } from "./__generated__/types";