@webstudio-is/css-data 0.19.0 → 0.20.0

package/src/__generated__/units.ts

@@ -1,32 +1,63 @@
-// This file was generated by yarn mdn-data
-export const units = [
-  "ch",
-  "cm",
-  "deg",
-  "dpcm",
-  "dpi",
-  "dppx",
-  "em",
-  "ex",
-  "fr",
-  "grad",
-  "Hz",
-  "in",
-  "kHz",
-  "mm",
-  "ms",
-  "pc",
-  "pt",
-  "px",
-  "Q",
-  "rad",
-  "rem",
-  "s",
-  "turn",
-  "vh",
-  "vmax",
-  "vmin",
-  "vw",
-  "x",
-  "%",
-] as const;
+// This file was generated by pnpm mdn-data
+export const units = {
+  number: [],
+  percentage: ["%"],
+  angle: ["deg", "grad", "rad", "turn"],
+  decibel: ["db"],
+  flex: ["fr"],
+  frequency: ["hz", "khz"],
+  length: [
+    "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",
+  ],
+  resolution: ["dpi", "dpcm", "dppx", "x"],
+  semitones: ["st"],
+  time: ["s", "ms"],
+} as const;

package/src/schema.ts

@@ -1,6 +1,7 @@
 import { units } from "./__generated__/units";
 import { properties } from "./__generated__/properties";
 import { z } from "zod";
+import { ImageAsset } from "@webstudio-is/asset-uploader";
 
 type Properties = typeof properties & {
   [custom: CustomProperty]: {
@@ -16,7 +17,16 @@ type CustomProperty = `--${string}`;
 
 export type AppliesTo = Properties[StyleProperty]["appliesTo"];
 
-const Unit = z.union([z.enum(units), z.literal("number")]);
+export type UnitGroup = keyof typeof units;
+
+type UnitEnum = typeof units[UnitGroup][number];
+
+const Unit = z.union([
+  // expected tuple with at least single element
+  // so cast to tuple with single union element to get correct inference
+  z.enum(Object.values(units).flat() as [UnitEnum]),
+  z.literal("number"),
+]);
 
 export type Unit = z.infer<typeof Unit>;
 
@@ -50,6 +60,13 @@ const RgbValue = z.object({
 });
 export type RgbValue = z.infer<typeof RgbValue>;
 
+export const ImageValue = z.object({
+  type: z.literal("image"),
+  value: z.array(z.object({ type: z.literal("asset"), value: ImageAsset })),
+});
+
+export type ImageValue = z.infer<typeof ImageValue>;
+
 // We want to be able to render the invalid value
 // and show it is invalid visually, without saving it to the db
 const InvalidValue = z.object({
@@ -69,14 +86,22 @@ export const validStaticValueTypes = [
   "keyword",
   "fontFamily",
   "rgb",
+  "image",
 ] as const;
 
-const ValidStaticStyleValue = z.union([
+/**
+ * Shared zod types with DB types.
+ * ImageValue in DB has a different type
+ */
+const SharedStaticStyleValue = z.union([
   UnitValue,
   KeywordValue,
   FontFamilyValue,
   RgbValue,
 ]);
+
+const ValidStaticStyleValue = z.union([ImageValue, SharedStaticStyleValue]);
+
 export type ValidStaticStyleValue = z.infer<typeof ValidStaticStyleValue>;
 
 const VarValue = z.object({
@@ -91,8 +116,18 @@ const StyleValue = z.union([
   InvalidValue,
   UnsetValue,
   VarValue,
-  RgbValue,
 ]);
+
+/**
+ * Shared types with DB types
+ */
+export const SharedStyleValue = z.union([
+  SharedStaticStyleValue,
+  InvalidValue,
+  UnsetValue,
+  VarValue,
+]);
+
 export type StyleValue = z.infer<typeof StyleValue>;
 
 const Style = z.record(z.string(), StyleValue);