@webstudio-is/css-engine 0.271.0 → 0.273.0

package/lib/index.js

@@ -36,16 +36,22 @@ var prefixStyles = (styleMap) => {
   return newStyleMap;
 };
 
-// src/schema.ts
-import { z } from "zod";
+// src/css.ts
+var cssWideKeywords = /* @__PURE__ */ new Set([
+  "initial",
+  "inherit",
+  "unset",
+  "revert",
+  "revert-layer"
+]);
 
 // src/core/to-value.ts
 import { DEFAULT_FONT_FALLBACK, SYSTEM_FONTS } from "@webstudio-is/fonts";
-var fallbackTransform = (styleValue) => {
-  if (styleValue.type !== "fontFamily") {
+var fallbackTransform = (styleValue2) => {
+  if (styleValue2.type !== "fontFamily") {
     return;
   }
-  let { value } = styleValue;
+  let { value } = styleValue2;
   if (value.length === 0) {
     value = [DEFAULT_FONT_FALLBACK];
   }
@@ -59,12 +65,12 @@ var fallbackTransform = (styleValue) => {
   };
 };
 var sanitizeCssUrl = (str) => JSON.stringify(str);
-var toValue = (styleValue, transformValue) => {
-  if (styleValue === void 0) {
+var toValue = (styleValue2, transformValue) => {
+  if (styleValue2 === void 0) {
     return "";
   }
-  const transformedValue = transformValue?.(styleValue) ?? fallbackTransform(styleValue);
-  const value = transformedValue ?? styleValue;
+  const transformedValue = transformValue?.(styleValue2) ?? fallbackTransform(styleValue2);
+  const value = transformedValue ?? styleValue2;
   if (value.type === "unit") {
     return value.value + (value.unit === "number" ? "" : value.unit);
   }
@@ -195,184 +201,6 @@ var toValue = (styleValue, transformValue) => {
   return "";
 };
 
-// src/schema.ts
-var Unit = z.string();
-var UnitValue = z.object({
-  type: z.literal("unit"),
-  unit: Unit,
-  value: z.number(),
-  hidden: z.boolean().optional()
-});
-var KeywordValue = z.object({
-  type: z.literal("keyword"),
-  // @todo use exact type
-  value: z.string(),
-  hidden: z.boolean().optional()
-});
-var 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()
-});
-var FontFamilyValue = z.object({
-  type: z.literal("fontFamily"),
-  value: z.array(z.string()),
-  hidden: z.boolean().optional()
-});
-var RgbValue = z.object({
-  type: z.literal("rgb"),
-  r: z.number(),
-  g: z.number(),
-  b: z.number(),
-  alpha: z.number(),
-  hidden: z.boolean().optional()
-});
-var ColorValue = z.object({
-  type: z.literal("color"),
-  // all these color spaces are defined by design tokens specification
-  colorSpace: z.union([
-    z.literal("hex"),
-    z.literal("srgb"),
-    z.literal("p3"),
-    z.literal("srgb-linear"),
-    z.literal("hsl"),
-    z.literal("hwb"),
-    z.literal("lab"),
-    z.literal("lch"),
-    z.literal("oklab"),
-    z.literal("oklch"),
-    z.literal("a98rgb"),
-    z.literal("prophoto"),
-    z.literal("rec2020"),
-    z.literal("xyz-d65"),
-    z.literal("xyz-d50")
-  ]),
-  components: z.tuple([z.number(), z.number(), z.number()]),
-  alpha: z.union([z.number(), z.lazy(() => VarValue)]),
-  hidden: z.boolean().optional()
-});
-var FunctionValue = z.object({
-  type: z.literal("function"),
-  name: z.string(),
-  args: z.lazy(() => StyleValue),
-  hidden: z.boolean().optional()
-});
-var 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()
-});
-var GuaranteedInvalidValue = z.object({
-  type: z.literal("guaranteedInvalid"),
-  hidden: z.boolean().optional()
-});
-var InvalidValue = z.object({
-  type: z.literal("invalid"),
-  value: z.string(),
-  hidden: z.boolean().optional()
-});
-var UnsetValue = z.object({
-  type: z.literal("unset"),
-  value: z.literal(""),
-  hidden: z.boolean().optional()
-});
-var VarFallback = z.union([
-  UnparsedValue,
-  KeywordValue,
-  UnitValue,
-  ColorValue,
-  RgbValue
-]);
-var toVarFallback = (styleValue, transformValue) => {
-  if (styleValue.type === "unparsed" || styleValue.type === "keyword" || styleValue.type === "unit" || styleValue.type === "color" || styleValue.type === "rgb") {
-    return styleValue;
-  }
-  styleValue;
-  return { type: "unparsed", value: toValue(styleValue, transformValue) };
-};
-var VarValue = z.object({
-  type: z.literal("var"),
-  value: z.string(),
-  fallback: VarFallback.optional(),
-  hidden: z.boolean().optional()
-});
-var TupleValueItem = z.union([
-  UnitValue,
-  KeywordValue,
-  UnparsedValue,
-  ImageValue,
-  ColorValue,
-  RgbValue,
-  FunctionValue,
-  VarValue
-]);
-var TupleValue = z.object({
-  type: z.literal("tuple"),
-  value: z.array(TupleValueItem),
-  hidden: z.boolean().optional()
-});
-var ShadowValue = z.object({
-  type: z.literal("shadow"),
-  hidden: z.boolean().optional(),
-  position: z.union([z.literal("inset"), z.literal("outset")]),
-  offsetX: z.union([UnitValue, VarValue]),
-  offsetY: z.union([UnitValue, VarValue]),
-  blur: z.union([UnitValue, VarValue]).optional(),
-  spread: z.union([UnitValue, VarValue]).optional(),
-  color: z.union([ColorValue, RgbValue, KeywordValue, VarValue]).optional()
-});
-var LayerValueItem = z.union([
-  UnitValue,
-  KeywordValue,
-  UnparsedValue,
-  ImageValue,
-  TupleValue,
-  ShadowValue,
-  ColorValue,
-  RgbValue,
-  InvalidValue,
-  FunctionValue,
-  VarValue
-]);
-var LayersValue = z.object({
-  type: z.literal("layers"),
-  value: z.array(LayerValueItem),
-  hidden: z.boolean().optional()
-});
-var StyleValue = z.union([
-  ImageValue,
-  LayersValue,
-  UnitValue,
-  KeywordValue,
-  FontFamilyValue,
-  ColorValue,
-  RgbValue,
-  UnparsedValue,
-  TupleValue,
-  FunctionValue,
-  GuaranteedInvalidValue,
-  InvalidValue,
-  UnsetValue,
-  VarValue,
-  ShadowValue
-]);
-
-// src/css.ts
-var cssWideKeywords = /* @__PURE__ */ new Set([
-  "initial",
-  "inherit",
-  "unset",
-  "revert",
-  "revert-layer"
-]);
-
 // src/core/merger.ts
 var isLonghandValue = (value) => {
   if (value === void 0) {
@@ -419,8 +247,8 @@ var mergeWhiteSpaceAndTextWrap = (styleMap) => {
   const collapse = toValue(collapseValue);
   const modeValue = styleMap.get("text-wrap-mode");
   const mode = toValue(modeValue);
-  const styleValue = styleMap.get("text-wrap-style");
-  const style = toValue(styleValue);
+  const styleValue2 = styleMap.get("text-wrap-style");
+  const style = toValue(styleValue2);
   styleMap.delete("text-wrap-mode");
   styleMap.delete("text-wrap-style");
   if (collapse === "collapse" || collapse === "initial" || mode === "wrap" || mode === "initial") {
@@ -448,7 +276,7 @@ var mergeWhiteSpaceAndTextWrap = (styleMap) => {
   if (style === "balance" || style === "stable" || style === "pretty") {
     styleMap.set("text-wrap", { type: "keyword", value: style });
   }
-  const textWrap = (styleValue?.type !== "keyword" ? styleValue : void 0) ?? (modeValue?.type !== "keyword" ? modeValue : void 0);
+  const textWrap = (styleValue2?.type !== "keyword" ? styleValue2 : void 0) ?? (modeValue?.type !== "keyword" ? modeValue : void 0);
   if (textWrap) {
     styleMap.set("text-wrap", textWrap);
   }
@@ -1080,6 +908,176 @@ var generateAtomic = (sheet, options) => {
   return { cssText, classes };
 };
 
+// src/schema.ts
+import { z } from "zod";
+var unit = z.string();
+var unitValue = z.object({
+  type: z.literal("unit"),
+  unit,
+  value: z.number(),
+  hidden: z.boolean().optional()
+});
+var keywordValue = z.object({
+  type: z.literal("keyword"),
+  // @todo use exact type
+  value: z.string(),
+  hidden: z.boolean().optional()
+});
+var 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()
+});
+var fontFamilyValue = z.object({
+  type: z.literal("fontFamily"),
+  value: z.array(z.string()),
+  hidden: z.boolean().optional()
+});
+var rgbValue = z.object({
+  type: z.literal("rgb"),
+  r: z.number(),
+  g: z.number(),
+  b: z.number(),
+  alpha: z.number(),
+  hidden: z.boolean().optional()
+});
+var colorValue = z.object({
+  type: z.literal("color"),
+  // all these color spaces are defined by design tokens specification
+  colorSpace: z.union([
+    z.literal("hex"),
+    z.literal("srgb"),
+    z.literal("p3"),
+    z.literal("srgb-linear"),
+    z.literal("hsl"),
+    z.literal("hwb"),
+    z.literal("lab"),
+    z.literal("lch"),
+    z.literal("oklab"),
+    z.literal("oklch"),
+    z.literal("a98rgb"),
+    z.literal("prophoto"),
+    z.literal("rec2020"),
+    z.literal("xyz-d65"),
+    z.literal("xyz-d50")
+  ]),
+  components: z.tuple([z.number(), z.number(), z.number()]),
+  alpha: z.union([z.number(), z.lazy(() => varValue)]),
+  hidden: z.boolean().optional()
+});
+var functionValue = z.object({
+  type: z.literal("function"),
+  name: z.string(),
+  args: z.lazy(() => styleValue),
+  hidden: z.boolean().optional()
+});
+var 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()
+});
+var guaranteedInvalidValue = z.object({
+  type: z.literal("guaranteedInvalid"),
+  hidden: z.boolean().optional()
+});
+var invalidValue = z.object({
+  type: z.literal("invalid"),
+  value: z.string(),
+  hidden: z.boolean().optional()
+});
+var unsetValue = z.object({
+  type: z.literal("unset"),
+  value: z.literal(""),
+  hidden: z.boolean().optional()
+});
+var varFallback = z.union([
+  unparsedValue,
+  keywordValue,
+  unitValue,
+  colorValue,
+  rgbValue
+]);
+var toVarFallback = (styleValue2, transformValue) => {
+  if (styleValue2.type === "unparsed" || styleValue2.type === "keyword" || styleValue2.type === "unit" || styleValue2.type === "color" || styleValue2.type === "rgb") {
+    return styleValue2;
+  }
+  styleValue2;
+  return { type: "unparsed", value: toValue(styleValue2, transformValue) };
+};
+var varValue = z.object({
+  type: z.literal("var"),
+  value: z.string(),
+  fallback: varFallback.optional(),
+  hidden: z.boolean().optional()
+});
+var tupleValueItem = z.union([
+  unitValue,
+  keywordValue,
+  unparsedValue,
+  imageValue,
+  colorValue,
+  rgbValue,
+  functionValue,
+  varValue
+]);
+var tupleValue = z.object({
+  type: z.literal("tuple"),
+  value: z.array(tupleValueItem),
+  hidden: z.boolean().optional()
+});
+var shadowValue = z.object({
+  type: z.literal("shadow"),
+  hidden: z.boolean().optional(),
+  position: z.union([z.literal("inset"), z.literal("outset")]),
+  offsetX: z.union([unitValue, varValue]),
+  offsetY: z.union([unitValue, varValue]),
+  blur: z.union([unitValue, varValue]).optional(),
+  spread: z.union([unitValue, varValue]).optional(),
+  color: z.union([colorValue, rgbValue, keywordValue, varValue]).optional()
+});
+var layerValueItem = z.union([
+  unitValue,
+  keywordValue,
+  unparsedValue,
+  imageValue,
+  tupleValue,
+  shadowValue,
+  colorValue,
+  rgbValue,
+  invalidValue,
+  functionValue,
+  varValue
+]);
+var layersValue = z.object({
+  type: z.literal("layers"),
+  value: z.array(layerValueItem),
+  hidden: z.boolean().optional()
+});
+var styleValue = z.union([
+  imageValue,
+  layersValue,
+  unitValue,
+  keywordValue,
+  fontFamilyValue,
+  colorValue,
+  rgbValue,
+  unparsedValue,
+  tupleValue,
+  functionValue,
+  guaranteedInvalidValue,
+  invalidValue,
+  unsetValue,
+  varValue,
+  shadowValue
+]);
+
 // src/color.ts
 import * as colorjs from "colorjs.io/fn";
 colorjs.ColorSpace.register(colorjs.sRGB);
@@ -1190,42 +1188,42 @@ var serializeColor = (color2) => {
   return `rgb(${red}, ${green}, ${blue})`;
 };
 export {
-  ColorValue,
   FakeStyleElement,
-  FunctionValue,
-  GuaranteedInvalidValue,
-  ImageValue,
-  InvalidValue,
-  KeywordValue,
-  LayersValue,
-  ShadowValue,
-  StyleValue,
-  TupleValue,
-  TupleValueItem,
-  UnitValue,
-  UnparsedValue,
-  VarFallback,
   color,
   colorDistance,
+  colorValue,
   compareMedia,
   createRegularStyleSheet,
   cssWideKeywords,
   equalMedia,
   findApplicableMedia,
+  functionValue,
   generateAtomic,
   generateStyleMap,
+  guaranteedInvalidValue,
   hyphenateProperty,
+  imageValue,
+  invalidValue,
+  keywordValue,
+  layersValue,
   lerpColor,
   matchMedia,
   mergeStyles,
   parseColor,
   prefixStyles,
   serializeColor,
+  shadowValue,
   srgbColor,
+  styleValue,
   toColorComponent,
   toColorSpace,
   toValue,
   toVarFallback,
   transparentColor,
+  tupleValue,
+  tupleValueItem,
+  unitValue,
+  unparsedValue,
+  varFallback,
   whiteColor
 };

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

@@ -1,4 +1,4 @@
-import { StyleValue } from "../schema";
+import type { StyleValue } from "../schema";
 import type { StyleMap } from "./rules";
 export declare const mergeStyles: (styleMap: StyleMap) => Map<string, {
     value: {

package/lib/types/schema.d.ts

@@ -5,9 +5,9 @@ export type CustomProperty = `--${string}`;
 export type StyleProperty = CamelCasedProperty | CustomProperty;
 export type CssProperty = HyphenatedProperty | CustomProperty;
 export type CssStyleMap = Map<CssProperty, StyleValue>;
-declare const Unit: z.ZodType<GeneratedUnit | "number">;
-export type Unit = z.infer<typeof Unit>;
-export declare const UnitValue: z.ZodObject<{
+declare const unit: z.ZodType<GeneratedUnit | "number">;
+export type Unit = z.infer<typeof unit>;
+export declare const unitValue: z.ZodObject<{
     type: z.ZodLiteral<"unit">;
     unit: z.ZodType<"number" | GeneratedUnit, z.ZodTypeDef, "number" | GeneratedUnit>;
     value: z.ZodNumber;
@@ -23,8 +23,8 @@ export declare const UnitValue: z.ZodObject<{
     unit: "number" | GeneratedUnit;
     hidden?: boolean | undefined;
 }>;
-export type UnitValue = z.infer<typeof UnitValue>;
-export declare const KeywordValue: z.ZodObject<{
+export type UnitValue = z.infer<typeof unitValue>;
+export declare const keywordValue: z.ZodObject<{
     type: z.ZodLiteral<"keyword">;
     value: z.ZodString;
     hidden: z.ZodOptional<z.ZodBoolean>;
@@ -37,11 +37,11 @@ export declare const KeywordValue: z.ZodObject<{
     type: "keyword";
     hidden?: boolean | undefined;
 }>;
-export type KeywordValue = z.infer<typeof KeywordValue>;
+export type KeywordValue = z.infer<typeof keywordValue>;
 /**
  * Valid unparsed css value
  **/
-export declare const UnparsedValue: z.ZodObject<{
+export declare const unparsedValue: z.ZodObject<{
     type: z.ZodLiteral<"unparsed">;
     value: z.ZodString;
     hidden: z.ZodOptional<z.ZodBoolean>;
@@ -54,8 +54,8 @@ export declare const UnparsedValue: z.ZodObject<{
     type: "unparsed";
     hidden?: boolean | undefined;
 }>;
-export type UnparsedValue = z.infer<typeof UnparsedValue>;
-declare const FontFamilyValue: z.ZodObject<{
+export type UnparsedValue = z.infer<typeof unparsedValue>;
+declare const fontFamilyValue: z.ZodObject<{
     type: z.ZodLiteral<"fontFamily">;
     value: z.ZodArray<z.ZodString, "many">;
     hidden: z.ZodOptional<z.ZodBoolean>;
@@ -68,8 +68,8 @@ declare const FontFamilyValue: z.ZodObject<{
     type: "fontFamily";
     hidden?: boolean | undefined;
 }>;
-export type FontFamilyValue = z.infer<typeof FontFamilyValue>;
-declare const RgbValue: z.ZodObject<{
+export type FontFamilyValue = z.infer<typeof fontFamilyValue>;
+declare const rgbValue: z.ZodObject<{
     type: z.ZodLiteral<"rgb">;
     r: z.ZodNumber;
     g: z.ZodNumber;
@@ -91,7 +91,7 @@ declare const RgbValue: z.ZodObject<{
     alpha: number;
     hidden?: boolean | undefined;
 }>;
-export type RgbValue = z.infer<typeof RgbValue>;
+export type RgbValue = z.infer<typeof rgbValue>;
 export type ColorValue = {
     type: "color";
     colorSpace: "hex" | "srgb" | "p3" | "srgb-linear" | "hsl" | "hwb" | "lab" | "lch" | "oklab" | "oklch" | "a98rgb" | "prophoto" | "rec2020" | "xyz-d65" | "xyz-d50";
@@ -99,15 +99,15 @@ export type ColorValue = {
     alpha: number | VarValue;
     hidden?: boolean;
 };
-export declare const ColorValue: z.ZodType<ColorValue>;
-export type FunctionValue = z.infer<typeof FunctionValue>;
-export declare const FunctionValue: z.ZodType<{
+export declare const colorValue: z.ZodType<ColorValue>;
+export type FunctionValue = z.infer<typeof functionValue>;
+export declare const functionValue: z.ZodType<{
     type: "function";
     name: string;
     args: StyleValue;
     hidden?: boolean;
 }>;
-export declare const ImageValue: z.ZodObject<{
+export declare const imageValue: z.ZodObject<{
     type: z.ZodLiteral<"image">;
     value: z.ZodUnion<[z.ZodObject<{
         type: z.ZodLiteral<"asset">;
@@ -150,8 +150,8 @@ export declare const ImageValue: z.ZodObject<{
     type: "image";
     hidden?: boolean | undefined;
 }>;
-export type ImageValue = z.infer<typeof ImageValue>;
-export declare const GuaranteedInvalidValue: z.ZodObject<{
+export type ImageValue = z.infer<typeof imageValue>;
+export declare const guaranteedInvalidValue: z.ZodObject<{
     type: z.ZodLiteral<"guaranteedInvalid">;
     hidden: z.ZodOptional<z.ZodBoolean>;
 }, "strip", z.ZodTypeAny, {
@@ -161,8 +161,8 @@ export declare const GuaranteedInvalidValue: z.ZodObject<{
     type: "guaranteedInvalid";
     hidden?: boolean | undefined;
 }>;
-export type GuaranteedInvalidValue = z.infer<typeof GuaranteedInvalidValue>;
-export declare const InvalidValue: z.ZodObject<{
+export type GuaranteedInvalidValue = z.infer<typeof guaranteedInvalidValue>;
+export declare const invalidValue: z.ZodObject<{
     type: z.ZodLiteral<"invalid">;
     value: z.ZodString;
     hidden: z.ZodOptional<z.ZodBoolean>;
@@ -175,12 +175,12 @@ export declare const InvalidValue: z.ZodObject<{
     type: "invalid";
     hidden?: boolean | undefined;
 }>;
-export type InvalidValue = z.infer<typeof InvalidValue>;
+export type InvalidValue = z.infer<typeof invalidValue>;
 /**
  * Use GuaranteedInvalidValue if you need a temp placeholder before user enters a value
  * @deprecated
  */
-declare const UnsetValue: z.ZodObject<{
+declare const unsetValue: z.ZodObject<{
     type: z.ZodLiteral<"unset">;
     value: z.ZodLiteral<"">;
     hidden: z.ZodOptional<z.ZodBoolean>;
@@ -193,8 +193,8 @@ declare const UnsetValue: z.ZodObject<{
     type: "unset";
     hidden?: boolean | undefined;
 }>;
-export type UnsetValue = z.infer<typeof UnsetValue>;
-export declare const VarFallback: z.ZodUnion<[z.ZodObject<{
+export type UnsetValue = z.infer<typeof unsetValue>;
+export declare const varFallback: z.ZodUnion<[z.ZodObject<{
     type: z.ZodLiteral<"unparsed">;
     value: z.ZodString;
     hidden: z.ZodOptional<z.ZodBoolean>;
@@ -255,9 +255,9 @@ export declare const VarFallback: z.ZodUnion<[z.ZodObject<{
     alpha: number;
     hidden?: boolean | undefined;
 }>]>;
-export type VarFallback = z.infer<typeof VarFallback>;
+export type VarFallback = z.infer<typeof varFallback>;
 export declare const toVarFallback: (styleValue: StyleValue, transformValue?: TransformValue) => VarFallback;
-declare const VarValue: z.ZodObject<{
+declare const varValue: z.ZodObject<{
     type: z.ZodLiteral<"var">;
     value: z.ZodString;
     fallback: z.ZodOptional<z.ZodUnion<[z.ZodObject<{
@@ -373,8 +373,8 @@ declare const VarValue: z.ZodObject<{
     } | undefined;
     hidden?: boolean | undefined;
 }>;
-export type VarValue = z.infer<typeof VarValue>;
-export declare const TupleValueItem: z.ZodUnion<[z.ZodObject<{
+export type VarValue = z.infer<typeof varValue>;
+export declare const tupleValueItem: z.ZodUnion<[z.ZodObject<{
     type: z.ZodLiteral<"unit">;
     unit: z.ZodType<"number" | GeneratedUnit, z.ZodTypeDef, "number" | GeneratedUnit>;
     value: z.ZodNumber;
@@ -602,8 +602,8 @@ export declare const TupleValueItem: z.ZodUnion<[z.ZodObject<{
     } | undefined;
     hidden?: boolean | undefined;
 }>]>;
-export type TupleValueItem = z.infer<typeof TupleValueItem>;
-export declare const TupleValue: z.ZodObject<{
+export type TupleValueItem = z.infer<typeof tupleValueItem>;
+export declare const tupleValue: z.ZodObject<{
     type: z.ZodLiteral<"tuple">;
     value: z.ZodArray<z.ZodUnion<[z.ZodObject<{
         type: z.ZodLiteral<"unit">;
@@ -963,8 +963,8 @@ export declare const TupleValue: z.ZodObject<{
     type: "tuple";
     hidden?: boolean | undefined;
 }>;
-export type TupleValue = z.infer<typeof TupleValue>;
-export declare const ShadowValue: z.ZodObject<{
+export type TupleValue = z.infer<typeof tupleValue>;
+export declare const shadowValue: z.ZodObject<{
     type: z.ZodLiteral<"shadow">;
     hidden: z.ZodOptional<z.ZodBoolean>;
     position: z.ZodUnion<[z.ZodLiteral<"inset">, z.ZodLiteral<"outset">]>;
@@ -1972,8 +1972,8 @@ export declare const ShadowValue: z.ZodObject<{
         hidden?: boolean | undefined;
     } | undefined;
 }>;
-export type ShadowValue = z.infer<typeof ShadowValue>;
-declare const LayerValueItem: z.ZodUnion<[z.ZodObject<{
+export type ShadowValue = z.infer<typeof shadowValue>;
+declare const layerValueItem: z.ZodUnion<[z.ZodObject<{
     type: z.ZodLiteral<"unit">;
     unit: z.ZodType<"number" | GeneratedUnit, z.ZodTypeDef, "number" | GeneratedUnit>;
     value: z.ZodNumber;
@@ -3579,8 +3579,8 @@ declare const LayerValueItem: z.ZodUnion<[z.ZodObject<{
     } | undefined;
     hidden?: boolean | undefined;
 }>]>;
-export type LayerValueItem = z.infer<typeof LayerValueItem>;
-export declare const LayersValue: z.ZodObject<{
+export type LayerValueItem = z.infer<typeof layerValueItem>;
+export declare const layersValue: z.ZodObject<{
     type: z.ZodLiteral<"layers">;
     value: z.ZodArray<z.ZodUnion<[z.ZodObject<{
         type: z.ZodLiteral<"unit">;
@@ -5784,8 +5784,8 @@ export declare const LayersValue: z.ZodObject<{
     type: "layers";
     hidden?: boolean | undefined;
 }>;
-export type LayersValue = z.infer<typeof LayersValue>;
-export declare const StyleValue: z.ZodUnion<[z.ZodObject<{
+export type LayersValue = z.infer<typeof layersValue>;
+export declare const styleValue: z.ZodUnion<[z.ZodObject<{
     type: z.ZodLiteral<"image">;
     value: z.ZodUnion<[z.ZodObject<{
         type: z.ZodLiteral<"asset">;
@@ -9627,5 +9627,5 @@ export declare const StyleValue: z.ZodUnion<[z.ZodObject<{
         hidden?: boolean | undefined;
     } | undefined;
 }>]>;
-export type StyleValue = z.infer<typeof StyleValue>;
+export type StyleValue = z.infer<typeof styleValue>;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webstudio-is/css-engine",
-  "version": "0.271.0",
+  "version": "0.273.0",
   "description": "CSS Renderer for Webstudio",
   "author": "Webstudio <github@webstudio.is>",
   "homepage": "https://webstudio.is",
@@ -9,7 +9,7 @@
     "@emotion/hash": "^0.9.2",
     "colorjs.io": "^0.6.1",
     "zod": "^3.24.2",
-    "@webstudio-is/fonts": "0.271.0"
+    "@webstudio-is/fonts": "0.273.0"
   },
   "devDependencies": {
     "@types/react": "^18.2.70",
@@ -17,8 +17,8 @@
     "react": "18.3.0-canary-14898b6a9-20240318",
     "react-dom": "18.3.0-canary-14898b6a9-20240318",
     "vitest": "^3.1.2",
-    "@webstudio-is/design-system": "0.0.0",
-    "@webstudio-is/tsconfig": "1.0.7"
+    "@webstudio-is/tsconfig": "1.0.7",
+    "@webstudio-is/design-system": "0.0.0"
   },
   "exports": {
     ".": {