@safe-ugc-ui/types 0.3.1 → 0.5.0

package/dist/index.js

@@ -3,16 +3,13 @@ import { z } from "zod";
 var refSchema = z.object({
   $ref: z.string()
 });
-var exprSchema = z.object({
-  $expr: z.string()
-});
 var assetPathSchema = z.string().startsWith("@assets/");
 var colorSchema = z.string();
 var lengthSchema = z.union([z.number(), z.string()]);
 var percentageSchema = z.string();
 var iconNameSchema = z.string();
 function dynamicSchema(schema) {
-  return z.union([schema, refSchema, exprSchema]);
+  return z.union([schema, refSchema]);
 }
 function refOnlySchema(schema) {
   return z.union([schema, refSchema]);
@@ -20,11 +17,8 @@ function refOnlySchema(schema) {
 function isRef(value) {
   return typeof value === "object" && value !== null && "$ref" in value && typeof value.$ref === "string";
 }
-function isExpr(value) {
-  return typeof value === "object" && value !== null && "$expr" in value && typeof value.$expr === "string";
-}
 function isDynamic(value) {
-  return isRef(value) || isExpr(value);
+  return isRef(value);
 }
 function isAssetPath(value) {
   return typeof value === "string" && value.startsWith("@assets/");
@@ -32,430 +26,6 @@ function isAssetPath(value) {
 
 // src/styles.ts
 import { z as z2 } from "zod";
-var gradientStopSchema = z2.object({
-  color: z2.string(),
-  position: z2.string()
-  // e.g. "0%", "100%"
-});
-var linearGradientSchema = z2.object({
-  type: z2.literal("linear"),
-  direction: z2.string(),
-  // e.g. "135deg", "to right"
-  stops: z2.array(gradientStopSchema)
-});
-var radialGradientSchema = z2.object({
-  type: z2.literal("radial"),
-  stops: z2.array(gradientStopSchema)
-});
-var gradientObjectSchema = z2.union([
-  linearGradientSchema,
-  radialGradientSchema
-]);
-var shadowObjectSchema = z2.object({
-  offsetX: z2.number(),
-  offsetY: z2.number(),
-  blur: z2.number().optional(),
-  spread: z2.number().optional(),
-  color: z2.string()
-});
-var borderObjectSchema = z2.object({
-  width: z2.number(),
-  style: z2.enum(["solid", "dashed", "dotted", "none"]),
-  color: z2.string()
-});
-var transformObjectSchema = z2.object({
-  rotate: z2.string().optional(),
-  // e.g. "45deg"
-  scale: z2.number().optional(),
-  // 0.1 ~ 1.5
-  translateX: z2.number().optional(),
-  // -500 ~ 500
-  translateY: z2.number().optional()
-  // -500 ~ 500
-});
-var positionValueSchema = z2.enum(["static", "relative", "absolute"]);
-var overflowValueSchema = z2.enum(["visible", "hidden", "auto"]);
-var displayValueSchema = z2.enum(["flex", "block", "none"]);
-var flexDirectionValueSchema = z2.enum([
-  "row",
-  "column",
-  "row-reverse",
-  "column-reverse"
-]);
-var justifyContentValueSchema = z2.enum([
-  "start",
-  "center",
-  "end",
-  "space-between",
-  "space-around",
-  "space-evenly"
-]);
-var alignItemsValueSchema = z2.enum([
-  "start",
-  "center",
-  "end",
-  "stretch",
-  "baseline"
-]);
-var alignSelfValueSchema = z2.enum([
-  "auto",
-  "start",
-  "center",
-  "end",
-  "stretch"
-]);
-var flexWrapValueSchema = z2.enum(["nowrap", "wrap", "wrap-reverse"]);
-var textAlignValueSchema = z2.enum([
-  "left",
-  "center",
-  "right",
-  "justify"
-]);
-var textDecorationValueSchema = z2.enum([
-  "none",
-  "underline",
-  "line-through"
-]);
-var fontStyleValueSchema = z2.enum(["normal", "italic"]);
-var fontWeightValueSchema = z2.union([
-  z2.enum(["normal", "bold"]),
-  z2.literal(100),
-  z2.literal(200),
-  z2.literal(300),
-  z2.literal(400),
-  z2.literal(500),
-  z2.literal(600),
-  z2.literal(700),
-  z2.literal(800),
-  z2.literal(900)
-]);
-var easingValueSchema = z2.enum([
-  "ease",
-  "linear",
-  "ease-in",
-  "ease-out",
-  "ease-in-out"
-]);
-var transitionDefSchema = z2.object({
-  property: z2.string(),
-  duration: z2.number(),
-  easing: easingValueSchema.optional(),
-  delay: z2.number().optional()
-});
-var transitionFieldSchema = z2.union([transitionDefSchema, z2.array(transitionDefSchema)]).optional();
-var sizeValueSchema = z2.union([lengthSchema, percentageSchema, z2.literal("auto")]);
-var lineHeightValueSchema = z2.union([z2.number(), lengthSchema]);
-var coreStyleShape = {
-  // -----------------------------------------------------------------------
-  // Layout — Dynamic
-  // -----------------------------------------------------------------------
-  display: dynamicSchema(displayValueSchema).optional(),
-  flexDirection: dynamicSchema(flexDirectionValueSchema).optional(),
-  justifyContent: dynamicSchema(justifyContentValueSchema).optional(),
-  alignItems: dynamicSchema(alignItemsValueSchema).optional(),
-  alignSelf: dynamicSchema(alignSelfValueSchema).optional(),
-  flexWrap: dynamicSchema(flexWrapValueSchema).optional(),
-  flex: dynamicSchema(z2.number()).optional(),
-  gap: dynamicSchema(lengthSchema).optional(),
-  // -----------------------------------------------------------------------
-  // Sizing — Dynamic
-  // -----------------------------------------------------------------------
-  width: dynamicSchema(sizeValueSchema).optional(),
-  height: dynamicSchema(sizeValueSchema).optional(),
-  minWidth: dynamicSchema(z2.union([lengthSchema, percentageSchema])).optional(),
-  maxWidth: dynamicSchema(z2.union([lengthSchema, percentageSchema])).optional(),
-  minHeight: dynamicSchema(z2.union([lengthSchema, percentageSchema])).optional(),
-  maxHeight: dynamicSchema(z2.union([lengthSchema, percentageSchema])).optional(),
-  // -----------------------------------------------------------------------
-  // Spacing — Dynamic
-  // -----------------------------------------------------------------------
-  padding: dynamicSchema(lengthSchema).optional(),
-  paddingTop: dynamicSchema(lengthSchema).optional(),
-  paddingRight: dynamicSchema(lengthSchema).optional(),
-  paddingBottom: dynamicSchema(lengthSchema).optional(),
-  paddingLeft: dynamicSchema(lengthSchema).optional(),
-  margin: dynamicSchema(lengthSchema).optional(),
-  marginTop: dynamicSchema(lengthSchema).optional(),
-  marginRight: dynamicSchema(lengthSchema).optional(),
-  marginBottom: dynamicSchema(lengthSchema).optional(),
-  marginLeft: dynamicSchema(lengthSchema).optional(),
-  // -----------------------------------------------------------------------
-  // Colors — Dynamic
-  // -----------------------------------------------------------------------
-  backgroundColor: dynamicSchema(colorSchema).optional(),
-  color: dynamicSchema(colorSchema).optional(),
-  // -----------------------------------------------------------------------
-  // Border radius — Dynamic
-  // -----------------------------------------------------------------------
-  borderRadius: dynamicSchema(lengthSchema).optional(),
-  borderRadiusTopLeft: dynamicSchema(lengthSchema).optional(),
-  borderRadiusTopRight: dynamicSchema(lengthSchema).optional(),
-  borderRadiusBottomLeft: dynamicSchema(lengthSchema).optional(),
-  borderRadiusBottomRight: dynamicSchema(lengthSchema).optional(),
-  // -----------------------------------------------------------------------
-  // Typography — Dynamic
-  // -----------------------------------------------------------------------
-  fontSize: dynamicSchema(lengthSchema).optional(),
-  fontWeight: dynamicSchema(fontWeightValueSchema).optional(),
-  fontStyle: dynamicSchema(fontStyleValueSchema).optional(),
-  textAlign: dynamicSchema(textAlignValueSchema).optional(),
-  textDecoration: dynamicSchema(textDecorationValueSchema).optional(),
-  lineHeight: dynamicSchema(lineHeightValueSchema).optional(),
-  letterSpacing: dynamicSchema(lengthSchema).optional(),
-  // -----------------------------------------------------------------------
-  // Opacity — Dynamic
-  // -----------------------------------------------------------------------
-  opacity: dynamicSchema(z2.number()).optional(),
-  // -----------------------------------------------------------------------
-  // Gradient — Static only
-  // -----------------------------------------------------------------------
-  backgroundGradient: gradientObjectSchema.optional(),
-  // -----------------------------------------------------------------------
-  // Shadow — Static only (single or array of shadows)
-  // -----------------------------------------------------------------------
-  boxShadow: z2.union([shadowObjectSchema, z2.array(shadowObjectSchema)]).optional(),
-  // -----------------------------------------------------------------------
-  // Borders — Static only
-  // -----------------------------------------------------------------------
-  border: borderObjectSchema.optional(),
-  borderTop: borderObjectSchema.optional(),
-  borderRight: borderObjectSchema.optional(),
-  borderBottom: borderObjectSchema.optional(),
-  borderLeft: borderObjectSchema.optional(),
-  // -----------------------------------------------------------------------
-  // Transform — Static only (skew excluded)
-  // -----------------------------------------------------------------------
-  transform: transformObjectSchema.optional(),
-  // -----------------------------------------------------------------------
-  // Overflow — Static only
-  // -----------------------------------------------------------------------
-  overflow: overflowValueSchema.optional(),
-  // -----------------------------------------------------------------------
-  // Position — Static only
-  // -----------------------------------------------------------------------
-  position: positionValueSchema.optional(),
-  top: lengthSchema.optional(),
-  right: lengthSchema.optional(),
-  bottom: lengthSchema.optional(),
-  left: lengthSchema.optional(),
-  // -----------------------------------------------------------------------
-  // Object-fit — Dynamic (for Image nodes)
-  // -----------------------------------------------------------------------
-  objectFit: dynamicSchema(z2.enum(["cover", "contain", "fill", "none", "scale-down"])).optional(),
-  objectPosition: dynamicSchema(z2.string()).optional(),
-  // -----------------------------------------------------------------------
-  // Grid — Dynamic
-  // -----------------------------------------------------------------------
-  gridTemplateColumns: dynamicSchema(z2.string()).optional(),
-  gridTemplateRows: dynamicSchema(z2.string()).optional(),
-  gridColumn: dynamicSchema(z2.string()).optional(),
-  gridRow: dynamicSchema(z2.string()).optional(),
-  // -----------------------------------------------------------------------
-  // z-index — Static only (0-100 enforced at validation layer)
-  // -----------------------------------------------------------------------
-  zIndex: z2.number().optional(),
-  // -----------------------------------------------------------------------
-  // $style — reference to a named style in card.styles
-  // -----------------------------------------------------------------------
-  $style: z2.string().optional()
-};
-var { $style: _$styleField, ...coreStyleShapeWithout$style } = coreStyleShape;
-var hoverStylePropsSchema = z2.object({
-  ...coreStyleShapeWithout$style,
-  transition: transitionFieldSchema
-});
-var stylePropsSchema = z2.object({
-  ...coreStyleShape,
-  hoverStyle: hoverStylePropsSchema.optional(),
-  transition: transitionFieldSchema
-});
-
-// src/props.ts
-import { z as z3 } from "zod";
-var textPropsSchema = z3.object({
-  content: dynamicSchema(z3.string())
-});
-var imagePropsSchema = z3.object({
-  src: refOnlySchema(assetPathSchema),
-  alt: dynamicSchema(z3.string()).optional()
-});
-var progressBarPropsSchema = z3.object({
-  value: dynamicSchema(z3.number()),
-  max: dynamicSchema(z3.number()),
-  color: dynamicSchema(colorSchema).optional()
-});
-var avatarPropsSchema = z3.object({
-  src: refOnlySchema(assetPathSchema),
-  size: dynamicSchema(lengthSchema).optional()
-});
-var iconPropsSchema = z3.object({
-  name: iconNameSchema,
-  size: dynamicSchema(lengthSchema).optional(),
-  color: dynamicSchema(colorSchema).optional()
-});
-var badgePropsSchema = z3.object({
-  label: dynamicSchema(z3.string()),
-  color: dynamicSchema(colorSchema).optional()
-});
-var chipPropsSchema = z3.object({
-  label: dynamicSchema(z3.string()),
-  color: dynamicSchema(colorSchema).optional()
-});
-var dividerPropsSchema = z3.object({
-  color: dynamicSchema(colorSchema).optional(),
-  thickness: dynamicSchema(lengthSchema).optional()
-});
-var spacerPropsSchema = z3.object({
-  size: dynamicSchema(lengthSchema).optional()
-});
-var buttonPropsSchema = z3.object({
-  label: dynamicSchema(z3.string()),
-  action: z3.string()
-});
-var togglePropsSchema = z3.object({
-  value: dynamicSchema(z3.boolean()),
-  onToggle: z3.string()
-});
-
-// src/primitives.ts
-import { z as z4 } from "zod";
-var forLoopSchema = z4.object({
-  for: z4.string(),
-  in: z4.string(),
-  template: z4.lazy(() => ugcNodeSchema)
-});
-var childrenSchema = z4.union([
-  z4.array(z4.lazy(() => ugcNodeSchema)),
-  forLoopSchema
-]);
-var baseFields = {
-  style: stylePropsSchema.optional(),
-  condition: exprSchema.optional()
-};
-var boxNodeSchema = z4.object({
-  type: z4.literal("Box"),
-  children: childrenSchema.optional(),
-  ...baseFields
-});
-var rowNodeSchema = z4.object({
-  type: z4.literal("Row"),
-  children: childrenSchema.optional(),
-  ...baseFields
-});
-var columnNodeSchema = z4.object({
-  type: z4.literal("Column"),
-  children: childrenSchema.optional(),
-  ...baseFields
-});
-var stackNodeSchema = z4.object({
-  type: z4.literal("Stack"),
-  children: childrenSchema.optional(),
-  ...baseFields
-});
-var gridNodeSchema = z4.object({
-  type: z4.literal("Grid"),
-  children: childrenSchema.optional(),
-  ...baseFields
-});
-var textNodeSchema = z4.object({
-  type: z4.literal("Text"),
-  ...textPropsSchema.shape,
-  ...baseFields
-});
-var imageNodeSchema = z4.object({
-  type: z4.literal("Image"),
-  ...imagePropsSchema.shape,
-  ...baseFields
-});
-var progressBarNodeSchema = z4.object({
-  type: z4.literal("ProgressBar"),
-  ...progressBarPropsSchema.shape,
-  ...baseFields
-});
-var avatarNodeSchema = z4.object({
-  type: z4.literal("Avatar"),
-  ...avatarPropsSchema.shape,
-  ...baseFields
-});
-var iconNodeSchema = z4.object({
-  type: z4.literal("Icon"),
-  ...iconPropsSchema.shape,
-  ...baseFields
-});
-var badgeNodeSchema = z4.object({
-  type: z4.literal("Badge"),
-  ...badgePropsSchema.shape,
-  ...baseFields
-});
-var chipNodeSchema = z4.object({
-  type: z4.literal("Chip"),
-  ...chipPropsSchema.shape,
-  ...baseFields
-});
-var dividerNodeSchema = z4.object({
-  type: z4.literal("Divider"),
-  ...dividerPropsSchema.shape,
-  ...baseFields
-});
-var spacerNodeSchema = z4.object({
-  type: z4.literal("Spacer"),
-  ...spacerPropsSchema.shape,
-  ...baseFields
-});
-var buttonNodeSchema = z4.object({
-  type: z4.literal("Button"),
-  ...buttonPropsSchema.shape,
-  ...baseFields
-});
-var toggleNodeSchema = z4.object({
-  type: z4.literal("Toggle"),
-  ...togglePropsSchema.shape,
-  ...baseFields
-});
-var ugcNodeSchema = z4.lazy(
-  () => z4.discriminatedUnion("type", [
-    boxNodeSchema,
-    rowNodeSchema,
-    columnNodeSchema,
-    stackNodeSchema,
-    gridNodeSchema,
-    textNodeSchema,
-    imageNodeSchema,
-    progressBarNodeSchema,
-    avatarNodeSchema,
-    iconNodeSchema,
-    badgeNodeSchema,
-    chipNodeSchema,
-    dividerNodeSchema,
-    spacerNodeSchema,
-    buttonNodeSchema,
-    toggleNodeSchema
-  ])
-);
-var phase1NodeSchema = z4.lazy(
-  () => z4.discriminatedUnion("type", [
-    boxNodeSchema,
-    rowNodeSchema,
-    columnNodeSchema,
-    textNodeSchema,
-    imageNodeSchema
-  ])
-);
-
-// src/card.ts
-import { z as z5 } from "zod";
-var cardMetaSchema = z5.object({
-  name: z5.string(),
-  version: z5.string()
-});
-var styleNamePattern = /^[A-Za-z][A-Za-z0-9_-]*$/;
-var ugcCardSchema = z5.object({
-  meta: cardMetaSchema,
-  assets: z5.record(z5.string(), z5.string()).optional(),
-  state: z5.record(z5.string(), z5.unknown()).optional(),
-  styles: z5.record(z5.string().regex(styleNamePattern), stylePropsSchema).optional(),
-  views: z5.record(z5.string(), ugcNodeSchema)
-});
 
 // src/constants.ts
 var CARD_JSON_MAX_BYTES = 1e6;
@@ -468,14 +38,6 @@ var MAX_LOOP_ITERATIONS = 1e3;
 var MAX_NESTED_LOOPS = 2;
 var MAX_OVERFLOW_AUTO_COUNT = 2;
 var MAX_STACK_NESTING = 3;
-var EXPR_MAX_LENGTH = 500;
-var EXPR_MAX_TOKENS = 50;
-var EXPR_MAX_NESTING = 10;
-var EXPR_MAX_CONDITION_NESTING = 3;
-var EXPR_MAX_STRING_LITERAL = 1e3;
-var EXPR_MAX_REF_DEPTH = 5;
-var EXPR_MAX_ARRAY_INDEX = 9999;
-var EXPR_MAX_FRACTIONAL_DIGITS = 10;
 var ZINDEX_MIN = 0;
 var ZINDEX_MAX = 100;
 var TRANSFORM_SCALE_MIN = 0.1;
@@ -484,6 +46,16 @@ var TRANSFORM_TRANSLATE_MIN = -500;
 var TRANSFORM_TRANSLATE_MAX = 500;
 var FONT_SIZE_MIN = 8;
 var FONT_SIZE_MAX = 72;
+var ALLOWED_FONT_FAMILIES = [
+  "sans",
+  "serif",
+  "mono",
+  "rounded",
+  "display",
+  "handwriting"
+];
+var TEXT_SHADOW_MAX_COUNT = 5;
+var TEXT_SHADOW_BLUR_MAX = 100;
 var BOX_SHADOW_MAX_COUNT = 5;
 var BOX_SHADOW_BLUR_MAX = 100;
 var BOX_SHADOW_SPREAD_MAX = 50;
@@ -547,7 +119,8 @@ var ALLOWED_TRANSITION_PROPERTIES = [
   "gridColumn",
   "gridRow",
   "objectFit",
-  "objectPosition"
+  "objectPosition",
+  "textShadow"
 ];
 var PHASE1_COMPONENT_TYPES = [
   "Box",
@@ -755,7 +328,467 @@ var CSS_NAMED_COLORS = /* @__PURE__ */ new Set([
   "yellow",
   "yellowgreen"
 ]);
+
+// src/styles.ts
+var gradientStopSchema = z2.object({
+  color: dynamicSchema(z2.string()),
+  position: dynamicSchema(z2.string())
+  // e.g. "0%", "100%"
+});
+var linearGradientSchema = z2.object({
+  type: z2.literal("linear"),
+  direction: dynamicSchema(z2.string()),
+  // e.g. "135deg", "to right"
+  stops: z2.array(gradientStopSchema)
+});
+var radialGradientSchema = z2.object({
+  type: z2.literal("radial"),
+  stops: z2.array(gradientStopSchema)
+});
+var repeatingLinearGradientSchema = z2.object({
+  type: z2.literal("repeating-linear"),
+  direction: dynamicSchema(z2.string()),
+  // e.g. "180deg"
+  stops: z2.array(gradientStopSchema)
+});
+var gradientObjectSchema = z2.union([
+  linearGradientSchema,
+  radialGradientSchema,
+  repeatingLinearGradientSchema
+]);
+var shadowObjectSchema = z2.object({
+  offsetX: dynamicSchema(z2.number()),
+  offsetY: dynamicSchema(z2.number()),
+  blur: dynamicSchema(z2.number()).optional(),
+  spread: dynamicSchema(z2.number()).optional(),
+  color: dynamicSchema(z2.string())
+});
+var textShadowObjectSchema = z2.object({
+  offsetX: dynamicSchema(z2.number()),
+  offsetY: dynamicSchema(z2.number()),
+  blur: dynamicSchema(z2.number()).optional(),
+  color: dynamicSchema(z2.string())
+});
+var borderStyleValueSchema = z2.enum(["solid", "dashed", "dotted", "none"]);
+var borderObjectSchema = z2.object({
+  width: dynamicSchema(z2.number()),
+  style: dynamicSchema(borderStyleValueSchema),
+  color: dynamicSchema(z2.string())
+});
+var transformObjectSchema = z2.object({
+  rotate: dynamicSchema(z2.string()).optional(),
+  // e.g. "45deg"
+  scale: dynamicSchema(z2.number()).optional(),
+  // 0.1 ~ 1.5
+  translateX: dynamicSchema(z2.number()).optional(),
+  // -500 ~ 500
+  translateY: dynamicSchema(z2.number()).optional()
+  // -500 ~ 500
+});
+var positionValueSchema = z2.enum(["static", "relative", "absolute"]);
+var overflowValueSchema = z2.enum(["visible", "hidden", "auto"]);
+var displayValueSchema = z2.enum(["flex", "block", "none"]);
+var flexDirectionValueSchema = z2.enum([
+  "row",
+  "column",
+  "row-reverse",
+  "column-reverse"
+]);
+var justifyContentValueSchema = z2.enum([
+  "start",
+  "flex-start",
+  "center",
+  "end",
+  "flex-end",
+  "space-between",
+  "space-around",
+  "space-evenly"
+]);
+var alignItemsValueSchema = z2.enum([
+  "start",
+  "flex-start",
+  "center",
+  "end",
+  "flex-end",
+  "stretch",
+  "baseline"
+]);
+var alignSelfValueSchema = z2.enum([
+  "auto",
+  "start",
+  "flex-start",
+  "center",
+  "end",
+  "flex-end",
+  "stretch"
+]);
+var flexWrapValueSchema = z2.enum(["nowrap", "wrap", "wrap-reverse"]);
+var textAlignValueSchema = z2.enum([
+  "left",
+  "center",
+  "right",
+  "justify"
+]);
+var textDecorationValueSchema = z2.enum([
+  "none",
+  "underline",
+  "line-through"
+]);
+var fontStyleValueSchema = z2.enum(["normal", "italic"]);
+var fontFamilyValueSchema = z2.enum(ALLOWED_FONT_FAMILIES);
+var fontWeightValueSchema = z2.union([
+  z2.enum(["normal", "bold"]),
+  z2.literal("100"),
+  z2.literal("200"),
+  z2.literal("300"),
+  z2.literal("400"),
+  z2.literal("500"),
+  z2.literal("600"),
+  z2.literal("700"),
+  z2.literal("800"),
+  z2.literal("900"),
+  z2.literal(100),
+  z2.literal(200),
+  z2.literal(300),
+  z2.literal(400),
+  z2.literal(500),
+  z2.literal(600),
+  z2.literal(700),
+  z2.literal(800),
+  z2.literal(900)
+]);
+var easingValueSchema = z2.enum([
+  "ease",
+  "linear",
+  "ease-in",
+  "ease-out",
+  "ease-in-out"
+]);
+var transitionDefSchema = z2.object({
+  property: z2.string(),
+  duration: z2.number(),
+  easing: easingValueSchema.optional(),
+  delay: z2.number().optional()
+});
+var transitionFieldSchema = z2.union([transitionDefSchema, z2.array(transitionDefSchema)]).optional();
+var sizeValueSchema = z2.union([lengthSchema, percentageSchema, z2.literal("auto")]);
+var lineHeightValueSchema = z2.union([z2.number(), lengthSchema]);
+var coreStyleShape = {
+  // -----------------------------------------------------------------------
+  // Layout — Dynamic
+  // -----------------------------------------------------------------------
+  display: dynamicSchema(displayValueSchema).optional(),
+  flexDirection: dynamicSchema(flexDirectionValueSchema).optional(),
+  justifyContent: dynamicSchema(justifyContentValueSchema).optional(),
+  alignItems: dynamicSchema(alignItemsValueSchema).optional(),
+  alignSelf: dynamicSchema(alignSelfValueSchema).optional(),
+  flexWrap: dynamicSchema(flexWrapValueSchema).optional(),
+  flex: dynamicSchema(z2.number()).optional(),
+  gap: dynamicSchema(lengthSchema).optional(),
+  // -----------------------------------------------------------------------
+  // Sizing — Dynamic
+  // -----------------------------------------------------------------------
+  width: dynamicSchema(sizeValueSchema).optional(),
+  height: dynamicSchema(sizeValueSchema).optional(),
+  minWidth: dynamicSchema(z2.union([lengthSchema, percentageSchema])).optional(),
+  maxWidth: dynamicSchema(z2.union([lengthSchema, percentageSchema])).optional(),
+  minHeight: dynamicSchema(z2.union([lengthSchema, percentageSchema])).optional(),
+  maxHeight: dynamicSchema(z2.union([lengthSchema, percentageSchema])).optional(),
+  // -----------------------------------------------------------------------
+  // Spacing — Dynamic
+  // -----------------------------------------------------------------------
+  padding: dynamicSchema(lengthSchema).optional(),
+  paddingTop: dynamicSchema(lengthSchema).optional(),
+  paddingRight: dynamicSchema(lengthSchema).optional(),
+  paddingBottom: dynamicSchema(lengthSchema).optional(),
+  paddingLeft: dynamicSchema(lengthSchema).optional(),
+  margin: dynamicSchema(lengthSchema).optional(),
+  marginTop: dynamicSchema(lengthSchema).optional(),
+  marginRight: dynamicSchema(lengthSchema).optional(),
+  marginBottom: dynamicSchema(lengthSchema).optional(),
+  marginLeft: dynamicSchema(lengthSchema).optional(),
+  // -----------------------------------------------------------------------
+  // Colors — Dynamic
+  // -----------------------------------------------------------------------
+  backgroundColor: dynamicSchema(colorSchema).optional(),
+  color: dynamicSchema(colorSchema).optional(),
+  // -----------------------------------------------------------------------
+  // Border radius — Dynamic
+  // -----------------------------------------------------------------------
+  borderRadius: dynamicSchema(lengthSchema).optional(),
+  borderRadiusTopLeft: dynamicSchema(lengthSchema).optional(),
+  borderRadiusTopRight: dynamicSchema(lengthSchema).optional(),
+  borderRadiusBottomLeft: dynamicSchema(lengthSchema).optional(),
+  borderRadiusBottomRight: dynamicSchema(lengthSchema).optional(),
+  // -----------------------------------------------------------------------
+  // Typography — Dynamic
+  // -----------------------------------------------------------------------
+  fontFamily: dynamicSchema(fontFamilyValueSchema).optional(),
+  fontSize: dynamicSchema(lengthSchema).optional(),
+  fontWeight: dynamicSchema(fontWeightValueSchema).optional(),
+  fontStyle: dynamicSchema(fontStyleValueSchema).optional(),
+  textAlign: dynamicSchema(textAlignValueSchema).optional(),
+  textDecoration: dynamicSchema(textDecorationValueSchema).optional(),
+  lineHeight: dynamicSchema(lineHeightValueSchema).optional(),
+  letterSpacing: dynamicSchema(lengthSchema).optional(),
+  // -----------------------------------------------------------------------
+  // Opacity — Dynamic
+  // -----------------------------------------------------------------------
+  opacity: dynamicSchema(z2.number()).optional(),
+  // -----------------------------------------------------------------------
+  // Gradient — Static only
+  // -----------------------------------------------------------------------
+  backgroundGradient: gradientObjectSchema.optional(),
+  // -----------------------------------------------------------------------
+  // Shadow — Static only (single or array of shadows)
+  // -----------------------------------------------------------------------
+  boxShadow: z2.union([shadowObjectSchema, z2.array(shadowObjectSchema)]).optional(),
+  // -----------------------------------------------------------------------
+  // Text shadow — Static only (single or array of shadows)
+  // -----------------------------------------------------------------------
+  textShadow: z2.union([textShadowObjectSchema, z2.array(textShadowObjectSchema)]).optional(),
+  // -----------------------------------------------------------------------
+  // Borders — Static only
+  // -----------------------------------------------------------------------
+  border: borderObjectSchema.optional(),
+  borderTop: borderObjectSchema.optional(),
+  borderRight: borderObjectSchema.optional(),
+  borderBottom: borderObjectSchema.optional(),
+  borderLeft: borderObjectSchema.optional(),
+  // -----------------------------------------------------------------------
+  // Transform — Static only (skew excluded)
+  // -----------------------------------------------------------------------
+  transform: transformObjectSchema.optional(),
+  // -----------------------------------------------------------------------
+  // Overflow — Static only
+  // -----------------------------------------------------------------------
+  overflow: overflowValueSchema.optional(),
+  // -----------------------------------------------------------------------
+  // Position — Static only
+  // -----------------------------------------------------------------------
+  position: positionValueSchema.optional(),
+  top: lengthSchema.optional(),
+  right: lengthSchema.optional(),
+  bottom: lengthSchema.optional(),
+  left: lengthSchema.optional(),
+  // -----------------------------------------------------------------------
+  // Object-fit — Dynamic (for Image nodes)
+  // -----------------------------------------------------------------------
+  objectFit: dynamicSchema(z2.enum(["cover", "contain", "fill", "none", "scale-down"])).optional(),
+  objectPosition: dynamicSchema(z2.string()).optional(),
+  // -----------------------------------------------------------------------
+  // Grid — Dynamic
+  // -----------------------------------------------------------------------
+  gridTemplateColumns: dynamicSchema(z2.string()).optional(),
+  gridTemplateRows: dynamicSchema(z2.string()).optional(),
+  gridColumn: dynamicSchema(z2.string()).optional(),
+  gridRow: dynamicSchema(z2.string()).optional(),
+  // -----------------------------------------------------------------------
+  // z-index — Static only (0-100 enforced at validation layer)
+  // -----------------------------------------------------------------------
+  zIndex: z2.number().optional(),
+  // -----------------------------------------------------------------------
+  // $style — reference to a named style in card.styles
+  // -----------------------------------------------------------------------
+  $style: z2.string().optional()
+};
+var hoverStylePropsSchema = z2.object({
+  ...coreStyleShape,
+  transition: transitionFieldSchema
+});
+var stylePropsSchema = z2.object({
+  ...coreStyleShape,
+  hoverStyle: hoverStylePropsSchema.optional(),
+  transition: transitionFieldSchema
+});
+
+// src/props.ts
+import { z as z3 } from "zod";
+var textPropsSchema = z3.object({
+  content: dynamicSchema(z3.string())
+});
+var imagePropsSchema = z3.object({
+  src: refOnlySchema(assetPathSchema),
+  alt: dynamicSchema(z3.string()).optional()
+});
+var progressBarPropsSchema = z3.object({
+  value: dynamicSchema(z3.number()),
+  max: dynamicSchema(z3.number()),
+  color: dynamicSchema(colorSchema).optional()
+});
+var avatarPropsSchema = z3.object({
+  src: refOnlySchema(assetPathSchema),
+  size: dynamicSchema(lengthSchema).optional()
+});
+var iconPropsSchema = z3.object({
+  name: dynamicSchema(iconNameSchema),
+  size: dynamicSchema(lengthSchema).optional(),
+  color: dynamicSchema(colorSchema).optional()
+});
+var badgePropsSchema = z3.object({
+  label: dynamicSchema(z3.string()),
+  color: dynamicSchema(colorSchema).optional()
+});
+var chipPropsSchema = z3.object({
+  label: dynamicSchema(z3.string()),
+  color: dynamicSchema(colorSchema).optional()
+});
+var dividerPropsSchema = z3.object({
+  color: dynamicSchema(colorSchema).optional(),
+  thickness: dynamicSchema(lengthSchema).optional()
+});
+var spacerPropsSchema = z3.object({
+  size: dynamicSchema(lengthSchema).optional()
+});
+var buttonPropsSchema = z3.object({
+  label: dynamicSchema(z3.string()),
+  action: z3.string()
+});
+var togglePropsSchema = z3.object({
+  value: dynamicSchema(z3.boolean()),
+  onToggle: z3.string()
+});
+
+// src/primitives.ts
+import { z as z4 } from "zod";
+var forLoopSchema = z4.object({
+  for: z4.string(),
+  in: z4.string(),
+  template: z4.lazy(() => ugcNodeSchema)
+});
+var childrenSchema = z4.union([
+  z4.array(z4.lazy(() => ugcNodeSchema)),
+  forLoopSchema
+]);
+var baseFields = {
+  style: stylePropsSchema.optional()
+};
+var boxNodeSchema = z4.object({
+  type: z4.literal("Box"),
+  children: childrenSchema.optional(),
+  ...baseFields
+});
+var rowNodeSchema = z4.object({
+  type: z4.literal("Row"),
+  children: childrenSchema.optional(),
+  ...baseFields
+});
+var columnNodeSchema = z4.object({
+  type: z4.literal("Column"),
+  children: childrenSchema.optional(),
+  ...baseFields
+});
+var stackNodeSchema = z4.object({
+  type: z4.literal("Stack"),
+  children: childrenSchema.optional(),
+  ...baseFields
+});
+var gridNodeSchema = z4.object({
+  type: z4.literal("Grid"),
+  children: childrenSchema.optional(),
+  ...baseFields
+});
+var textNodeSchema = z4.object({
+  type: z4.literal("Text"),
+  ...textPropsSchema.shape,
+  ...baseFields
+});
+var imageNodeSchema = z4.object({
+  type: z4.literal("Image"),
+  ...imagePropsSchema.shape,
+  ...baseFields
+});
+var progressBarNodeSchema = z4.object({
+  type: z4.literal("ProgressBar"),
+  ...progressBarPropsSchema.shape,
+  ...baseFields
+});
+var avatarNodeSchema = z4.object({
+  type: z4.literal("Avatar"),
+  ...avatarPropsSchema.shape,
+  ...baseFields
+});
+var iconNodeSchema = z4.object({
+  type: z4.literal("Icon"),
+  ...iconPropsSchema.shape,
+  ...baseFields
+});
+var badgeNodeSchema = z4.object({
+  type: z4.literal("Badge"),
+  ...badgePropsSchema.shape,
+  ...baseFields
+});
+var chipNodeSchema = z4.object({
+  type: z4.literal("Chip"),
+  ...chipPropsSchema.shape,
+  ...baseFields
+});
+var dividerNodeSchema = z4.object({
+  type: z4.literal("Divider"),
+  ...dividerPropsSchema.shape,
+  ...baseFields
+});
+var spacerNodeSchema = z4.object({
+  type: z4.literal("Spacer"),
+  ...spacerPropsSchema.shape,
+  ...baseFields
+});
+var buttonNodeSchema = z4.object({
+  type: z4.literal("Button"),
+  ...buttonPropsSchema.shape,
+  ...baseFields
+});
+var toggleNodeSchema = z4.object({
+  type: z4.literal("Toggle"),
+  ...togglePropsSchema.shape,
+  ...baseFields
+});
+var ugcNodeSchema = z4.lazy(
+  () => z4.discriminatedUnion("type", [
+    boxNodeSchema,
+    rowNodeSchema,
+    columnNodeSchema,
+    stackNodeSchema,
+    gridNodeSchema,
+    textNodeSchema,
+    imageNodeSchema,
+    progressBarNodeSchema,
+    avatarNodeSchema,
+    iconNodeSchema,
+    badgeNodeSchema,
+    chipNodeSchema,
+    dividerNodeSchema,
+    spacerNodeSchema,
+    buttonNodeSchema,
+    toggleNodeSchema
+  ])
+);
+var phase1NodeSchema = z4.lazy(
+  () => z4.discriminatedUnion("type", [
+    boxNodeSchema,
+    rowNodeSchema,
+    columnNodeSchema,
+    textNodeSchema,
+    imageNodeSchema
+  ])
+);
+
+// src/card.ts
+import { z as z5 } from "zod";
+var cardMetaSchema = z5.object({
+  name: z5.string(),
+  version: z5.string()
+});
+var styleNamePattern = /^[A-Za-z][A-Za-z0-9_-]*$/;
+var ugcCardSchema = z5.object({
+  meta: cardMetaSchema,
+  assets: z5.record(z5.string(), z5.string()).optional(),
+  state: z5.record(z5.string(), z5.unknown()).optional(),
+  styles: z5.record(z5.string().regex(styleNamePattern), stylePropsSchema).optional(),
+  views: z5.record(z5.string(), ugcNodeSchema)
+});
 export {
+  ALLOWED_FONT_FAMILIES,
   ALLOWED_OVERFLOW_VALUES,
   ALLOWED_TRANSITION_PROPERTIES,
   ALL_COMPONENT_TYPES,
@@ -768,14 +801,6 @@ export {
   CARD_JSON_MAX_BYTES,
   CSS_NAMED_COLORS,
   DANGEROUS_CSS_FUNCTIONS,
-  EXPR_MAX_ARRAY_INDEX,
-  EXPR_MAX_CONDITION_NESTING,
-  EXPR_MAX_FRACTIONAL_DIGITS,
-  EXPR_MAX_LENGTH,
-  EXPR_MAX_NESTING,
-  EXPR_MAX_REF_DEPTH,
-  EXPR_MAX_STRING_LITERAL,
-  EXPR_MAX_TOKENS,
   FONT_SIZE_MAX,
   FONT_SIZE_MIN,
   FORBIDDEN_POSITION_VALUES,
@@ -793,6 +818,8 @@ export {
   PROTOTYPE_POLLUTION_SEGMENTS,
   STYLE_OBJECTS_TOTAL_MAX_BYTES,
   TEXT_CONTENT_TOTAL_MAX_BYTES,
+  TEXT_SHADOW_BLUR_MAX,
+  TEXT_SHADOW_MAX_COUNT,
   TRANSFORM_SCALE_MAX,
   TRANSFORM_SCALE_MIN,
   TRANSFORM_TRANSLATE_MAX,
@@ -810,6 +837,7 @@ export {
   badgeNodeSchema,
   badgePropsSchema,
   borderObjectSchema,
+  borderStyleValueSchema,
   boxNodeSchema,
   buttonNodeSchema,
   buttonPropsSchema,
@@ -823,9 +851,9 @@ export {
   dividerPropsSchema,
   dynamicSchema,
   easingValueSchema,
-  exprSchema,
   flexDirectionValueSchema,
   flexWrapValueSchema,
+  fontFamilyValueSchema,
   fontStyleValueSchema,
   fontWeightValueSchema,
   forLoopSchema,
@@ -840,7 +868,6 @@ export {
   imagePropsSchema,
   isAssetPath,
   isDynamic,
-  isExpr,
   isRef,
   justifyContentValueSchema,
   lengthSchema,
@@ -854,6 +881,7 @@ export {
   radialGradientSchema,
   refOnlySchema,
   refSchema,
+  repeatingLinearGradientSchema,
   rowNodeSchema,
   shadowObjectSchema,
   spacerNodeSchema,
@@ -864,6 +892,7 @@ export {
   textDecorationValueSchema,
   textNodeSchema,
   textPropsSchema,
+  textShadowObjectSchema,
   toggleNodeSchema,
   togglePropsSchema,
   transformObjectSchema,