@getrheo/flow-runtime 1.0.0

package/dist/responsive/index.js

@@ -0,0 +1,307 @@
+// src/responsive/breakpoints.ts
+var TAILWIND_DEFAULT_BREAKPOINTS = {
+  sm: 640,
+  md: 768,
+  lg: 1024,
+  xl: 1280,
+  "2xl": 1536
+};
+var STYLE_BREAKPOINT_MERGE_ORDER = ["sm", "md", "lg", "xl", "2xl"];
+var SCREEN_SIZE_BUCKET_ORDER = [
+  "default",
+  "sm",
+  "md",
+  "lg",
+  "xl",
+  "2xl"
+];
+var BUILDER_INSPECTOR_BUCKET_ORDER = [
+  "default",
+  "sm",
+  "md",
+  "lg"
+];
+var SCREEN_SIZE_BUCKET_LABEL = {
+  default: "Default (< 640px)",
+  sm: "sm (640\u2013767px)",
+  md: "md (768\u20131023px)",
+  lg: "lg (1024\u20131279px)",
+  xl: "xl (1280\u20131535px)",
+  "2xl": "2xl (1536px+)"
+};
+var DEFAULT_PREVIEW_VIEWPORT_WIDTH_PX = 390;
+var getScreenSizeBucketForWidth = (width) => {
+  const { sm, md, lg, xl, "2xl": xxl } = TAILWIND_DEFAULT_BREAKPOINTS;
+  if (width < sm) return "default";
+  if (width < md) return "sm";
+  if (width < lg) return "md";
+  if (width < xl) return "lg";
+  if (width < xxl) return "xl";
+  return "2xl";
+};
+var getActiveStyleBreakpointChain = (widthPx) => {
+  const bucket = getScreenSizeBucketForWidth(widthPx);
+  if (bucket === "default") return [];
+  const idx = STYLE_BREAKPOINT_MERGE_ORDER.indexOf(bucket);
+  if (idx < 0) return [];
+  return STYLE_BREAKPOINT_MERGE_ORDER.slice(0, idx + 1);
+};
+
+// src/responsive/merge.ts
+var isPlainObject = (v) => v !== null && typeof v === "object" && !Array.isArray(v);
+var deepMergeStyle = (base, ...overrides) => {
+  let acc = base ? { ...base } : void 0;
+  for (const o of overrides) {
+    if (!o) continue;
+    acc = acc ?? {};
+    for (const [k, v] of Object.entries(o)) {
+      if (v === void 0) continue;
+      const prev = acc[k];
+      if (isPlainObject(v) && isPlainObject(prev)) {
+        const merged = deepMergeStyle(prev, v);
+        if (merged !== void 0) acc[k] = merged;
+      } else {
+        acc[k] = v;
+      }
+    }
+  }
+  return acc;
+};
+var mergeResponsivePartial = (base, breakpoints, widthPx) => {
+  const chain = getActiveStyleBreakpointChain(widthPx);
+  if (chain.length === 0) return base ? { ...base } : void 0;
+  let acc = base ? { ...base } : void 0;
+  for (const key of chain) {
+    const patch = breakpoints?.[key];
+    if (!patch) continue;
+    acc = deepMergeStyle(acc, patch);
+  }
+  return acc;
+};
+var mergeResponsivePartialUpToBucket = (base, breakpoints, bucket) => {
+  if (bucket === "default") return base ? { ...base } : void 0;
+  const end = STYLE_BREAKPOINT_MERGE_ORDER.indexOf(bucket);
+  if (end < 0) return base ? { ...base } : void 0;
+  let acc = base ? { ...base } : void 0;
+  for (let i = 0; i <= end; i++) {
+    const key = STYLE_BREAKPOINT_MERGE_ORDER[i];
+    const patch = breakpoints?.[key];
+    if (!patch) continue;
+    acc = deepMergeStyle(acc, patch);
+  }
+  return acc;
+};
+
+// src/layout/scalarLayoutDefaults.ts
+var DEFAULT_PROGRESS_LINEAR_HEIGHT_PX = 6;
+var DEFAULT_LOADER_LINEAR_HEIGHT_PX = 6;
+var DEFAULT_LOADER_CIRCULAR_SIZE_PX = 48;
+var DEFAULT_LOADER_STROKE_WIDTH_PX = 4;
+var GAP_BY_KIND = {
+  stack: 12,
+  single_choice: 8,
+  multiple_choice: 8,
+  oauth_login: 8,
+  email_password_auth: 8,
+  email_password_submit: 8,
+  button: 8,
+  back_button: 8,
+  oauth_provider: 8,
+  hyperlink: 0
+};
+var defaultGapForLayerKind = (kind) => GAP_BY_KIND[kind] ?? null;
+
+// src/responsive/layerResolve.ts
+var resolveLayerGap = (kind, gap) => gap ?? defaultGapForLayerKind(kind) ?? 0;
+var resolveProgressLinearHeightPx = (height) => typeof height === "number" ? height : DEFAULT_PROGRESS_LINEAR_HEIGHT_PX;
+var resolveLoaderLinearHeightPx = (height) => typeof height === "number" ? height : DEFAULT_LOADER_LINEAR_HEIGHT_PX;
+var resolveLoaderCircularSizePx = (width) => typeof width === "number" ? width : DEFAULT_LOADER_CIRCULAR_SIZE_PX;
+var resolveLoaderStrokeWidthPx = (strokeWidth) => strokeWidth ?? DEFAULT_LOADER_STROKE_WIDTH_PX;
+var resolveCommonStyleAtWidth = (base, breakpoints, widthPx) => mergeResponsivePartial(
+  base,
+  breakpoints,
+  widthPx
+);
+var resolveTextStyleAtWidth = (base, breakpoints, widthPx) => mergeResponsivePartial(
+  base,
+  breakpoints,
+  widthPx
+);
+var resolveImageStyleAtWidth = (base, breakpoints, widthPx) => mergeResponsivePartial(
+  base,
+  breakpoints,
+  widthPx
+);
+var resolveIconStyleAtWidth = (base, breakpoints, widthPx) => mergeResponsivePartial(
+  base,
+  breakpoints,
+  widthPx
+);
+var resolveButtonStyleAtWidth = (base, breakpoints, widthPx) => mergeResponsivePartial(
+  base,
+  breakpoints,
+  widthPx
+);
+var mergeLayoutScalars = (base, breakpoints, widthPx) => {
+  const chain = getActiveStyleBreakpointChain(widthPx);
+  let acc = { ...base };
+  for (const key of chain) {
+    const p = breakpoints?.[key];
+    if (!p) continue;
+    acc = { ...acc, ...p };
+  }
+  return acc;
+};
+var resolveStackLayoutAtWidth = (layer, widthPx) => {
+  const base = {
+    gap: layer.gap,
+    direction: layer.direction
+  };
+  const merged = mergeLayoutScalars(
+    base,
+    layer.stackLayoutBreakpoints,
+    widthPx
+  );
+  return {
+    gap: merged.gap,
+    direction: merged.direction ?? layer.direction
+  };
+};
+var resolveButtonLayoutAtWidth = (layer, widthPx) => {
+  const merged = mergeLayoutScalars(
+    { gap: layer.gap, direction: layer.direction },
+    layer.buttonLayoutBreakpoints,
+    widthPx
+  );
+  return { gap: merged.gap, direction: merged.direction };
+};
+var resolveTextStyleForEditBucket = (base, breakpoints, bucket) => mergeResponsivePartialUpToBucket(
+  base,
+  breakpoints,
+  bucket
+);
+var resolveCommonStyleForEditBucket = (base, breakpoints, bucket) => mergeResponsivePartialUpToBucket(
+  base,
+  breakpoints,
+  bucket
+);
+
+// src/responsive/screenContainerResolve.ts
+var mergeBackgroundFillPatch = (fill, patch) => {
+  if (fill.kind === "color") {
+    return {
+      ...fill,
+      kind: "color",
+      ...patch.color !== void 0 ? { color: patch.color } : {},
+      ...patch.opacity !== void 0 ? { opacity: patch.opacity } : {}
+    };
+  }
+  const scrim = patch.scrim !== void 0 ? deepMergeStyle(fill.scrim, patch.scrim) : fill.scrim;
+  const shared = {
+    ...fill,
+    ...patch.fit !== void 0 ? { fit: patch.fit } : {},
+    ...patch.opacity !== void 0 ? { opacity: patch.opacity } : {},
+    ...scrim !== void 0 ? { scrim } : {}
+  };
+  if (fill.kind === "image") {
+    return shared;
+  }
+  return {
+    ...shared,
+    ...patch.loop !== void 0 ? { loop: patch.loop } : {},
+    ...patch.autoPlay !== void 0 ? { autoPlay: patch.autoPlay } : {},
+    ...patch.triggerLayerId !== void 0 ? { triggerLayerId: patch.triggerLayerId } : {},
+    ...patch.onComplete !== void 0 ? { onComplete: patch.onComplete } : {},
+    ...patch.audioEnabled !== void 0 ? { audioEnabled: patch.audioEnabled } : {}
+  };
+};
+var resolveScreenContainerStyleAtWidth = (base, breakpoints, widthPx) => {
+  const chain = getActiveStyleBreakpointChain(widthPx);
+  let acc = base ? { ...base } : void 0;
+  for (const key of chain) {
+    const patch = breakpoints?.[key];
+    if (!patch) continue;
+    acc = acc ?? {};
+    if (patch.padding !== void 0) acc = { ...acc, padding: patch.padding };
+    if (patch.margin !== void 0) acc = { ...acc, margin: patch.margin };
+    if (patch.insetSafeArea !== void 0) acc = { ...acc, insetSafeArea: patch.insetSafeArea };
+    if (patch.backgroundFillPatch && acc.backgroundFill) {
+      acc = {
+        ...acc,
+        backgroundFill: mergeBackgroundFillPatch(acc.backgroundFill, patch.backgroundFillPatch)
+      };
+    }
+  }
+  return acc;
+};
+var screenBackgroundFillUsesMedia = (fill) => fill?.kind === "image" || fill?.kind === "video";
+var resolveScreenContainerForEditBucket = (base, breakpoints, bucket) => {
+  if (bucket === "default") return base ? { ...base } : void 0;
+  const end = STYLE_BREAKPOINT_MERGE_ORDER.indexOf(bucket);
+  if (end < 0) return base ? { ...base } : void 0;
+  let acc = base ? { ...base } : {};
+  for (let i = 0; i <= end; i++) {
+    const patch = breakpoints?.[STYLE_BREAKPOINT_MERGE_ORDER[i]];
+    if (!patch) continue;
+    acc = acc ?? {};
+    if (patch.padding !== void 0) acc = { ...acc, padding: patch.padding };
+    if (patch.margin !== void 0) acc = { ...acc, margin: patch.margin };
+    if (patch.insetSafeArea !== void 0) acc = { ...acc, insetSafeArea: patch.insetSafeArea };
+    if (patch.backgroundFillPatch && acc.backgroundFill) {
+      acc = {
+        ...acc,
+        backgroundFill: mergeBackgroundFillPatch(acc.backgroundFill, patch.backgroundFillPatch)
+      };
+    }
+  }
+  const hasKeys = acc && (acc.padding !== void 0 || acc.margin !== void 0 || acc.insetSafeArea !== void 0 || acc.backgroundFill !== void 0);
+  return hasKeys ? acc : void 0;
+};
+
+// src/responsive/previewSafeAreaInsets.ts
+var previewPhoneSafeAreaInsetTopPx = (width) => {
+  const statusChromePadY = Math.max(6, Math.round(width * 0.016));
+  const chromePadBottom = Math.max(4, Math.round(width * 0.01));
+  const padY = Math.max(5, Math.round(width * 0.012));
+  const statusH = Math.max(23, Math.round(width * 0.058));
+  return statusChromePadY + statusH + 2 * padY + chromePadBottom;
+};
+var previewPhoneSafeAreaInsetBottomPx = (width, systemUi = "ios") => {
+  const pad = systemUi === "ios" ? 8 : 10;
+  const pill = systemUi === "ios" ? 5 : 4;
+  return pad + pill + Math.max(6, Math.round(width * 0.014));
+};
+var previewPhoneSafeAreaInsetHorizontalPx = (_width) => 0;
+var previewPhoneSafeAreaPadding = (widthPx, systemUi = "ios") => ({
+  t: previewPhoneSafeAreaInsetTopPx(widthPx),
+  r: previewPhoneSafeAreaInsetHorizontalPx(),
+  b: previewPhoneSafeAreaInsetBottomPx(widthPx, systemUi),
+  l: previewPhoneSafeAreaInsetHorizontalPx()
+});
+
+// src/responsive/screenShellInsets.ts
+var edge = (a, b) => {
+  const sum = (a ?? 0) + (b ?? 0);
+  return sum === 0 ? void 0 : sum;
+};
+var addPadding = (a, b) => {
+  if (!a && !b) return void 0;
+  const out = {
+    t: edge(a?.t, b?.t),
+    r: edge(a?.r, b?.r),
+    b: edge(a?.b, b?.b),
+    l: edge(a?.l, b?.l)
+  };
+  const cleaned = Object.fromEntries(
+    Object.entries(out).filter(([, v]) => v !== void 0)
+  );
+  return Object.keys(cleaned).length === 0 ? void 0 : cleaned;
+};
+var resolveEffectiveScreenShellPadding = (opts) => {
+  if (!opts.insetSafeArea) return opts.manual;
+  return addPadding(opts.manual, opts.safeAreaInsets);
+};
+
+export { BUILDER_INSPECTOR_BUCKET_ORDER, DEFAULT_PREVIEW_VIEWPORT_WIDTH_PX, SCREEN_SIZE_BUCKET_LABEL, SCREEN_SIZE_BUCKET_ORDER, STYLE_BREAKPOINT_MERGE_ORDER, TAILWIND_DEFAULT_BREAKPOINTS, addPadding, deepMergeStyle, getActiveStyleBreakpointChain, getScreenSizeBucketForWidth, mergeResponsivePartial, mergeResponsivePartialUpToBucket, previewPhoneSafeAreaInsetBottomPx, previewPhoneSafeAreaInsetHorizontalPx, previewPhoneSafeAreaInsetTopPx, previewPhoneSafeAreaPadding, resolveButtonLayoutAtWidth, resolveButtonStyleAtWidth, resolveCommonStyleAtWidth, resolveCommonStyleForEditBucket, resolveEffectiveScreenShellPadding, resolveIconStyleAtWidth, resolveImageStyleAtWidth, resolveLayerGap, resolveLoaderCircularSizePx, resolveLoaderLinearHeightPx, resolveLoaderStrokeWidthPx, resolveProgressLinearHeightPx, resolveScreenContainerForEditBucket, resolveScreenContainerStyleAtWidth, resolveStackLayoutAtWidth, resolveTextStyleAtWidth, resolveTextStyleForEditBucket, screenBackgroundFillUsesMedia };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/responsive/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/responsive/breakpoints.ts","../../src/responsive/merge.ts","../../src/layout/scalarLayoutDefaults.ts","../../src/responsive/layerResolve.ts","../../src/responsive/screenContainerResolve.ts","../../src/responsive/previewSafeAreaInsets.ts","../../src/responsive/screenShellInsets.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Tailwind CSS default `screens` min-width values (px). Single source of truth\n * for preview buckets, manifest breakpoints, and runtime style resolution.\n *\n * @see https://tailwindcss.com/docs/screens\n */\nexport const TAILWIND_DEFAULT_BREAKPOINTS = {\n  sm: 640,\n  md: 768,\n  lg: 1024,\n  xl: 1280,\n  '2xl': 1536,\n} as const;\n\n/** Viewport classification used by preview UI and editing scope. */\nexport type ScreenSizeBucket = 'default' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';\n\n/** Ordered keys stored on layers (`styleBreakpoints`) and merged mobile-first. */\nexport const STYLE_BREAKPOINT_MERGE_ORDER = ['sm', 'md', 'lg', 'xl', '2xl'] as const;\nexport type StyleBreakpointKey = (typeof STYLE_BREAKPOINT_MERGE_ORDER)[number];\n\nexport const SCREEN_SIZE_BUCKET_ORDER: readonly ScreenSizeBucket[] = [\n  'default',\n  'sm',\n  'md',\n  'lg',\n  'xl',\n  '2xl',\n] as const;\n\n/** Buckets shown in the flow builder inspector (xl / 2xl omitted from authoring UI). */\nexport const BUILDER_INSPECTOR_BUCKET_ORDER: readonly ScreenSizeBucket[] = [\n  'default',\n  'sm',\n  'md',\n  'lg',\n] as const;\n\n/** Human-readable bucket titles; ranges lie between consecutive breakpoints. */\nexport const SCREEN_SIZE_BUCKET_LABEL: Record<ScreenSizeBucket, string> = {\n  default: 'Default (< 640px)',\n  sm: 'sm (640–767px)',\n  md: 'md (768–1023px)',\n  lg: 'lg (1024–1279px)',\n  xl: 'xl (1280–1535px)',\n  '2xl': '2xl (1536px+)',\n};\n\n/** Fallback viewport width when no `previewWidthPx` is passed (simulator / static previews). */\nexport const DEFAULT_PREVIEW_VIEWPORT_WIDTH_PX = 390;\n\n/** Maps viewport width (CSS px) to the Tailwind viewport bucket. */\nexport const getScreenSizeBucketForWidth = (width: number): ScreenSizeBucket => {\n  const { sm, md, lg, xl, '2xl': xxl } = TAILWIND_DEFAULT_BREAKPOINTS;\n  if (width < sm) return 'default';\n  if (width < md) return 'sm';\n  if (width < lg) return 'md';\n  if (width < xl) return 'lg';\n  if (width < xxl) return 'xl';\n  return '2xl';\n};\n\n/**\n * Breakpoint keys whose partials apply at this width (mobile-first), e.g.\n * width 800 → `['sm','md']`.\n */\nexport const getActiveStyleBreakpointChain = (widthPx: number): StyleBreakpointKey[] => {\n  const bucket = getScreenSizeBucketForWidth(widthPx);\n  if (bucket === 'default') return [];\n  const idx = STYLE_BREAKPOINT_MERGE_ORDER.indexOf(bucket as StyleBreakpointKey);\n  if (idx < 0) return [];\n  return STYLE_BREAKPOINT_MERGE_ORDER.slice(0, idx + 1) as StyleBreakpointKey[];\n};\n","import {\n  STYLE_BREAKPOINT_MERGE_ORDER,\n  getActiveStyleBreakpointChain,\n} from './breakpoints';\nimport type { StyleBreakpointKey } from './breakpoints';\n\nconst isPlainObject = (v: unknown): v is Record<string, unknown> =>\n  v !== null && typeof v === 'object' && !Array.isArray(v);\n\n/**\n * Deep-merge style-like objects: nested plain objects merge per-key; scalars\n * and arrays replace. Suitable for padding/margin/border/shadow objects.\n */\nexport const deepMergeStyle = <T extends Record<string, unknown>>(\n  base: T | undefined,\n  ...overrides: (Partial<T> | undefined)[]\n): T | undefined => {\n  let acc: T | undefined = base ? ({ ...base } as T) : undefined;\n  for (const o of overrides) {\n    if (!o) continue;\n    acc = acc ?? ({} as T);\n    for (const [k, v] of Object.entries(o) as [keyof T, T[keyof T] | undefined][]) {\n      if (v === undefined) continue;\n      const prev = acc[k as keyof T] as unknown;\n      if (isPlainObject(v) && isPlainObject(prev)) {\n        const merged = deepMergeStyle(prev as Record<string, unknown>, v as Partial<T>);\n        if (merged !== undefined) (acc as Record<string, unknown>)[k as string] = merged;\n      } else {\n        (acc as Record<string, unknown>)[k as string] = v as unknown;\n      }\n    }\n  }\n  return acc;\n};\n\n/**\n * Mobile-first merge: `base` applies below `sm`; each breakpoint partial stacks\n * from `sm` through the bucket implied by `widthPx`.\n */\nexport const mergeResponsivePartial = <T extends Record<string, unknown>>(\n  base: Partial<T> | undefined,\n  breakpoints: Partial<Record<StyleBreakpointKey, Partial<T>>> | undefined,\n  widthPx: number,\n): Partial<T> | undefined => {\n  const chain = getActiveStyleBreakpointChain(widthPx);\n  if (chain.length === 0) return base ? { ...base } : undefined;\n  let acc = base ? ({ ...base } as Partial<T>) : undefined;\n  for (const key of chain) {\n    const patch = breakpoints?.[key];\n    if (!patch) continue;\n    acc = deepMergeStyle(acc as Record<string, unknown> | undefined, patch as Partial<T>) as\n      | Partial<T>\n      | undefined;\n  }\n  return acc;\n};\n\n/**\n * Merge breakpoint partials up to and including `bucket` (not using viewport width).\n * Use when editing a specific bucket's effective preview.\n */\nexport const mergeResponsivePartialUpToBucket = <T extends Record<string, unknown>>(\n  base: Partial<T> | undefined,\n  breakpoints: Partial<Record<StyleBreakpointKey, Partial<T>>> | undefined,\n  bucket: StyleBreakpointKey | 'default',\n): Partial<T> | undefined => {\n  if (bucket === 'default') return base ? { ...base } : undefined;\n  const end = STYLE_BREAKPOINT_MERGE_ORDER.indexOf(bucket);\n  if (end < 0) return base ? { ...base } : undefined;\n  let acc = base ? ({ ...base } as Partial<T>) : undefined;\n  for (let i = 0; i <= end; i++) {\n    const key = STYLE_BREAKPOINT_MERGE_ORDER[i]!;\n    const patch = breakpoints?.[key];\n    if (!patch) continue;\n    acc = deepMergeStyle(acc as Record<string, unknown> | undefined, patch as Partial<T>) as\n      | Partial<T>\n      | undefined;\n  }\n  return acc;\n};\n","import type { CommonStyle, LayerKind, LoaderLayer } from '@getrheo/contracts/layers';\n\n/** Bar thickness (px) for a linear progress bar when `style.height` is omitted. */\nexport const DEFAULT_PROGRESS_LINEAR_HEIGHT_PX = 6;\n/** Bar thickness (px) for a linear loader when `style.height` is omitted. */\nexport const DEFAULT_LOADER_LINEAR_HEIGHT_PX = 6;\n/** Diameter (px) for a circular loader when `style.width`/`style.height` are omitted. */\nexport const DEFAULT_LOADER_CIRCULAR_SIZE_PX = 48;\n/** Ring thickness (px) for a circular loader when `style.strokeWidth` is omitted. */\nexport const DEFAULT_LOADER_STROKE_WIDTH_PX = 4;\n\n/**\n * Standard child spacing (px) for kinds that lay out children in a flex\n * container. Mirrors the authoring defaults in `createLayer*` and the\n * historical renderer fallbacks (`?? 8` / `?? 0`). Kinds without a `gap`\n * field, or where spacing does not apply, are absent (→ `null`).\n */\nconst GAP_BY_KIND: Partial<Record<LayerKind, number>> = {\n  stack: 12,\n  single_choice: 8,\n  multiple_choice: 8,\n  oauth_login: 8,\n  email_password_auth: 8,\n  email_password_submit: 8,\n  button: 8,\n  back_button: 8,\n  oauth_provider: 8,\n  hyperlink: 0,\n};\n\nexport const defaultGapForLayerKind = (kind: LayerKind): number | null =>\n  GAP_BY_KIND[kind] ?? null;\n\n/**\n * Explicit scalar dimensions for feedback layers (progress / loader) whose\n * sizing lives directly on `style` as pixel values. Used by ingress\n * normalization to backfill omitted dimensions and by the inspector to show\n * the effective size. Renderers keep their own safety nets via the resolvers\n * in `responsive/layerResolve`.\n */\nexport const defaultFeedbackStyleScalars = (\n  kind: 'progress' | 'loader',\n  variant?: LoaderLayer['variant'],\n): Partial<CommonStyle> | null => {\n  if (kind === 'progress') {\n    return { height: DEFAULT_PROGRESS_LINEAR_HEIGHT_PX };\n  }\n  if (variant === 'circular') {\n    return {\n      width: DEFAULT_LOADER_CIRCULAR_SIZE_PX,\n      height: DEFAULT_LOADER_CIRCULAR_SIZE_PX,\n      strokeWidth: DEFAULT_LOADER_STROKE_WIDTH_PX,\n    };\n  }\n  return { height: DEFAULT_LOADER_LINEAR_HEIGHT_PX };\n};\n","import type {\n  BackButtonLayer,\n  ButtonLayer,\n  ButtonStyle,\n  CommonLayoutHeight,\n  CommonStyle,\n  IconStyle,\n  ImageStyle,\n  LayerKind,\n  StackLayer,\n  TextLayer,\n  TextStyle,\n  WidthValue,\n} from '@getrheo/contracts/layers';\nimport {\n  DEFAULT_LOADER_CIRCULAR_SIZE_PX,\n  DEFAULT_LOADER_LINEAR_HEIGHT_PX,\n  DEFAULT_LOADER_STROKE_WIDTH_PX,\n  DEFAULT_PROGRESS_LINEAR_HEIGHT_PX,\n  defaultGapForLayerKind,\n} from '../layout/scalarLayoutDefaults';\nimport type { StyleBreakpointKey } from './breakpoints';\nimport { getActiveStyleBreakpointChain } from './breakpoints';\nimport { mergeResponsivePartial, mergeResponsivePartialUpToBucket } from './merge';\n\n/**\n * Effective child spacing (px) for a layer, falling back to the per-kind\n * default and finally `0`. Single runtime source of truth so renderers stop\n * hard-coding `?? 8` / `?? 0`.\n */\nexport const resolveLayerGap = (kind: LayerKind, gap: number | undefined): number =>\n  gap ?? defaultGapForLayerKind(kind) ?? 0;\n\n/** Effective bar thickness (px) for a linear progress bar. */\nexport const resolveProgressLinearHeightPx = (\n  height: CommonLayoutHeight | undefined,\n): number => (typeof height === 'number' ? height : DEFAULT_PROGRESS_LINEAR_HEIGHT_PX);\n\n/** Effective bar thickness (px) for a linear loader. */\nexport const resolveLoaderLinearHeightPx = (\n  height: CommonLayoutHeight | undefined,\n): number => (typeof height === 'number' ? height : DEFAULT_LOADER_LINEAR_HEIGHT_PX);\n\n/** Effective diameter (px) for a circular loader (sized via `style.width`). */\nexport const resolveLoaderCircularSizePx = (width: WidthValue | undefined): number =>\n  typeof width === 'number' ? width : DEFAULT_LOADER_CIRCULAR_SIZE_PX;\n\n/** Effective ring thickness (px) for a circular loader. */\nexport const resolveLoaderStrokeWidthPx = (strokeWidth: number | undefined): number =>\n  strokeWidth ?? DEFAULT_LOADER_STROKE_WIDTH_PX;\n\nexport type StackLayoutBreakpointPatch = {\n  gap?: number;\n  direction?: 'vertical' | 'horizontal';\n};\n\nexport type ButtonLayoutBreakpointPatch = {\n  gap?: number;\n  direction?: 'vertical' | 'horizontal';\n};\n\nexport const resolveCommonStyleAtWidth = (\n  base: CommonStyle | undefined,\n  breakpoints:\n    | Partial<Record<StyleBreakpointKey, Partial<CommonStyle>>>\n    | undefined,\n  widthPx: number,\n): CommonStyle | undefined =>\n  mergeResponsivePartial(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    widthPx,\n  ) as CommonStyle | undefined;\n\nexport const resolveTextStyleAtWidth = (\n  base: TextStyle | undefined,\n  breakpoints:\n    | Partial<Record<StyleBreakpointKey, Partial<TextStyle>>>\n    | undefined,\n  widthPx: number,\n): TextStyle | undefined =>\n  mergeResponsivePartial(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    widthPx,\n  ) as TextStyle | undefined;\n\nexport const resolveImageStyleAtWidth = (\n  base: ImageStyle | undefined,\n  breakpoints:\n    | Partial<Record<StyleBreakpointKey, Partial<ImageStyle>>>\n    | undefined,\n  widthPx: number,\n): ImageStyle | undefined =>\n  mergeResponsivePartial(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    widthPx,\n  ) as ImageStyle | undefined;\n\nexport const resolveIconStyleAtWidth = (\n  base: IconStyle | undefined,\n  breakpoints:\n    | Partial<Record<StyleBreakpointKey, Partial<IconStyle>>>\n    | undefined,\n  widthPx: number,\n): IconStyle | undefined =>\n  mergeResponsivePartial(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    widthPx,\n  ) as IconStyle | undefined;\n\nexport const resolveButtonStyleAtWidth = (\n  base: ButtonStyle | undefined,\n  breakpoints:\n    | Partial<Record<StyleBreakpointKey, Partial<ButtonStyle>>>\n    | undefined,\n  widthPx: number,\n): ButtonStyle | undefined =>\n  mergeResponsivePartial(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    widthPx,\n  ) as ButtonStyle | undefined;\n\nconst mergeLayoutScalars = <T extends Record<string, unknown>>(\n  base: T,\n  breakpoints: Partial<Record<StyleBreakpointKey, Partial<T>>> | undefined,\n  widthPx: number,\n): T => {\n  const chain = getActiveStyleBreakpointChain(widthPx);\n  let acc = { ...base };\n  for (const key of chain) {\n    const p = breakpoints?.[key];\n    if (!p) continue;\n    acc = { ...acc, ...p };\n  }\n  return acc;\n};\n\nexport const resolveStackLayoutAtWidth = (\n  layer: Pick<\n    StackLayer,\n    'gap' | 'direction' | 'stackLayoutBreakpoints'\n  >,\n  widthPx: number,\n): { gap: number | undefined; direction: StackLayer['direction'] } => {\n  const base = {\n    gap: layer.gap,\n    direction: layer.direction,\n  };\n  const merged = mergeLayoutScalars(\n    base,\n    layer.stackLayoutBreakpoints as\n      | Partial<Record<StyleBreakpointKey, Partial<{ gap?: number; direction?: StackLayer['direction'] }>>>\n      | undefined,\n    widthPx,\n  );\n  return {\n    gap: merged.gap,\n    direction: merged.direction ?? layer.direction,\n  };\n};\n\nexport const resolveButtonLayoutAtWidth = (\n  layer: Pick<ButtonLayer | BackButtonLayer, 'gap' | 'direction' | 'buttonLayoutBreakpoints'>,\n  widthPx: number,\n): { gap: number | undefined; direction: ButtonLayer['direction'] | undefined } => {\n  const merged = mergeLayoutScalars(\n    { gap: layer.gap, direction: layer.direction },\n    layer.buttonLayoutBreakpoints as\n      | Partial<\n          Record<\n            StyleBreakpointKey,\n            Partial<{ gap?: number; direction?: ButtonLayer['direction'] }>\n          >\n        >\n      | undefined,\n    widthPx,\n  );\n  return { gap: merged.gap, direction: merged.direction };\n};\n\n/** Effective styles for editor preview at the bucket implied by device width. */\nexport const resolveTextStyleForEditBucket = (\n  base: TextStyle | undefined,\n  breakpoints: TextLayer['styleBreakpoints'],\n  bucket: StyleBreakpointKey | 'default',\n): TextStyle | undefined =>\n  mergeResponsivePartialUpToBucket(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    bucket,\n  ) as TextStyle | undefined;\n\nexport const resolveCommonStyleForEditBucket = (\n  base: CommonStyle | undefined,\n  breakpoints: StackLayer['styleBreakpoints'],\n  bucket: StyleBreakpointKey | 'default',\n): CommonStyle | undefined =>\n  mergeResponsivePartialUpToBucket(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    bucket,\n  ) as CommonStyle | undefined;\n","import type {\n  ScreenBackgroundFill,\n  ScreenBackgroundFillPatch,\n  ScreenContainerStyle,\n  ScreenContainerStyleBreakpoints,\n} from '@getrheo/contracts';\nimport type { StyleBreakpointKey } from './breakpoints';\nimport { getActiveStyleBreakpointChain, STYLE_BREAKPOINT_MERGE_ORDER } from './breakpoints';\nimport { deepMergeStyle } from './merge';\n\nconst mergeBackgroundFillPatch = (\n  fill: ScreenBackgroundFill,\n  patch: ScreenBackgroundFillPatch,\n): ScreenBackgroundFill => {\n  if (fill.kind === 'color') {\n    return {\n      ...fill,\n      kind: 'color',\n      ...(patch.color !== undefined ? { color: patch.color } : {}),\n      ...(patch.opacity !== undefined ? { opacity: patch.opacity } : {}),\n    };\n  }\n  const scrim =\n    patch.scrim !== undefined\n      ? deepMergeStyle(fill.scrim as Record<string, unknown> | undefined, patch.scrim)\n      : fill.scrim;\n  const shared = {\n    ...fill,\n    ...(patch.fit !== undefined ? { fit: patch.fit } : {}),\n    ...(patch.opacity !== undefined ? { opacity: patch.opacity } : {}),\n    ...(scrim !== undefined ? { scrim } : {}),\n  };\n  if (fill.kind === 'image') {\n    return shared as ScreenBackgroundFill;\n  }\n  return {\n    ...shared,\n    ...(patch.loop !== undefined ? { loop: patch.loop } : {}),\n    ...(patch.autoPlay !== undefined ? { autoPlay: patch.autoPlay } : {}),\n    ...(patch.triggerLayerId !== undefined ? { triggerLayerId: patch.triggerLayerId } : {}),\n    ...(patch.onComplete !== undefined ? { onComplete: patch.onComplete } : {}),\n    ...(patch.audioEnabled !== undefined ? { audioEnabled: patch.audioEnabled } : {}),\n  } as ScreenBackgroundFill;\n};\n\nexport const resolveScreenContainerStyleAtWidth = (\n  base: ScreenContainerStyle | undefined,\n  breakpoints: ScreenContainerStyleBreakpoints | undefined,\n  widthPx: number,\n): ScreenContainerStyle | undefined => {\n  const chain = getActiveStyleBreakpointChain(widthPx);\n  let acc: ScreenContainerStyle | undefined = base ? { ...base } : undefined;\n  for (const key of chain) {\n    const patch = breakpoints?.[key as StyleBreakpointKey];\n    if (!patch) continue;\n    acc = acc ?? {};\n    if (patch.padding !== undefined) acc = { ...acc, padding: patch.padding };\n    if (patch.margin !== undefined) acc = { ...acc, margin: patch.margin };\n    if (patch.insetSafeArea !== undefined) acc = { ...acc, insetSafeArea: patch.insetSafeArea };\n    if (patch.backgroundFillPatch && acc.backgroundFill) {\n      acc = {\n        ...acc,\n        backgroundFill: mergeBackgroundFillPatch(acc.backgroundFill, patch.backgroundFillPatch),\n      };\n    }\n  }\n  return acc;\n};\n\nexport const screenBackgroundFillUsesMedia = (\n  fill: ScreenBackgroundFill | undefined,\n): fill is Extract<ScreenBackgroundFill, { kind: 'image' | 'video' }> =>\n  fill?.kind === 'image' || fill?.kind === 'video';\n\n/** Effective shell style for builder inspector at a specific breakpoint bucket. */\nexport const resolveScreenContainerForEditBucket = (\n  base: ScreenContainerStyle | undefined,\n  breakpoints: ScreenContainerStyleBreakpoints | undefined,\n  bucket: StyleBreakpointKey | 'default',\n): ScreenContainerStyle | undefined => {\n  if (bucket === 'default') return base ? { ...base } : undefined;\n  const end = STYLE_BREAKPOINT_MERGE_ORDER.indexOf(bucket);\n  if (end < 0) return base ? { ...base } : undefined;\n  let acc: ScreenContainerStyle | undefined = base ? { ...base } : {};\n  for (let i = 0; i <= end; i++) {\n    const patch = breakpoints?.[STYLE_BREAKPOINT_MERGE_ORDER[i]!];\n    if (!patch) continue;\n    acc = acc ?? {};\n    if (patch.padding !== undefined) acc = { ...acc, padding: patch.padding };\n    if (patch.margin !== undefined) acc = { ...acc, margin: patch.margin };\n    if (patch.insetSafeArea !== undefined) acc = { ...acc, insetSafeArea: patch.insetSafeArea };\n    if (patch.backgroundFillPatch && acc.backgroundFill) {\n      acc = {\n        ...acc,\n        backgroundFill: mergeBackgroundFillPatch(acc.backgroundFill, patch.backgroundFillPatch),\n      };\n    }\n  }\n  const hasKeys =\n    acc &&\n    (acc.padding !== undefined ||\n      acc.margin !== undefined ||\n      acc.insetSafeArea !== undefined ||\n      acc.backgroundFill !== undefined);\n  return hasKeys ? acc : undefined;\n};\n","/** Preview / sim status bar + home-indicator insets (portrait phone). */\n\nexport type PreviewPhoneSystemUi = 'ios' | 'android';\n\nexport const previewPhoneSafeAreaInsetTopPx = (width: number): number => {\n  const statusChromePadY = Math.max(6, Math.round(width * 0.016));\n  const chromePadBottom = Math.max(4, Math.round(width * 0.01));\n  const padY = Math.max(5, Math.round(width * 0.012));\n  const statusH = Math.max(23, Math.round(width * 0.058));\n  return statusChromePadY + statusH + 2 * padY + chromePadBottom;\n};\n\nexport const previewPhoneSafeAreaInsetBottomPx = (\n  width: number,\n  systemUi: PreviewPhoneSystemUi = 'ios',\n): number => {\n  const pad = systemUi === 'ios' ? 8 : 10;\n  const pill = systemUi === 'ios' ? 5 : 4;\n  return pad + pill + Math.max(6, Math.round(width * 0.014));\n};\n\n/** Portrait phone preview: no horizontal inset (matches RN `SafeAreaView` in portrait). */\nexport const previewPhoneSafeAreaInsetHorizontalPx = (_width: number): number => 0;\n\nexport const previewPhoneSafeAreaPadding = (\n  widthPx: number,\n  systemUi: PreviewPhoneSystemUi = 'ios',\n): { t: number; r: number; b: number; l: number } => ({\n  t: previewPhoneSafeAreaInsetTopPx(widthPx),\n  r: previewPhoneSafeAreaInsetHorizontalPx(widthPx),\n  b: previewPhoneSafeAreaInsetBottomPx(widthPx, systemUi),\n  l: previewPhoneSafeAreaInsetHorizontalPx(widthPx),\n});\n","import type { Padding } from '@getrheo/contracts';\n\nconst edge = (a: number | undefined, b: number | undefined): number | undefined => {\n  const sum = (a ?? 0) + (b ?? 0);\n  return sum === 0 ? undefined : sum;\n};\n\n/** Per-edge sum of two padding objects; omits zero edges. */\nexport const addPadding = (a?: Padding, b?: Padding): Padding | undefined => {\n  if (!a && !b) return undefined;\n  const out: Padding = {\n    t: edge(a?.t, b?.t),\n    r: edge(a?.r, b?.r),\n    b: edge(a?.b, b?.b),\n    l: edge(a?.l, b?.l),\n  };\n  const cleaned = Object.fromEntries(\n    Object.entries(out).filter(([, v]) => v !== undefined),\n  ) as Padding;\n  return Object.keys(cleaned).length === 0 ? undefined : cleaned;\n};\n\nexport const resolveEffectiveScreenShellPadding = (opts: {\n  manual?: Padding;\n  insetSafeArea?: boolean;\n  safeAreaInsets: Padding;\n}): Padding | undefined => {\n  if (!opts.insetSafeArea) return opts.manual;\n  return addPadding(opts.manual, opts.safeAreaInsets);\n};\n"]}

package/dist/responsive/layerResolve.d.ts

@@ -0,0 +1,43 @@
+import { ButtonLayer, BackButtonLayer, ButtonStyle, CommonStyle, StackLayer, IconStyle, ImageStyle, LayerKind, WidthValue, CommonLayoutHeight, TextStyle, TextLayer } from '@getrheo/contracts/layers';
+import { StyleBreakpointKey } from './breakpoints.js';
+
+/**
+ * Effective child spacing (px) for a layer, falling back to the per-kind
+ * default and finally `0`. Single runtime source of truth so renderers stop
+ * hard-coding `?? 8` / `?? 0`.
+ */
+declare const resolveLayerGap: (kind: LayerKind, gap: number | undefined) => number;
+/** Effective bar thickness (px) for a linear progress bar. */
+declare const resolveProgressLinearHeightPx: (height: CommonLayoutHeight | undefined) => number;
+/** Effective bar thickness (px) for a linear loader. */
+declare const resolveLoaderLinearHeightPx: (height: CommonLayoutHeight | undefined) => number;
+/** Effective diameter (px) for a circular loader (sized via `style.width`). */
+declare const resolveLoaderCircularSizePx: (width: WidthValue | undefined) => number;
+/** Effective ring thickness (px) for a circular loader. */
+declare const resolveLoaderStrokeWidthPx: (strokeWidth: number | undefined) => number;
+type StackLayoutBreakpointPatch = {
+    gap?: number;
+    direction?: 'vertical' | 'horizontal';
+};
+type ButtonLayoutBreakpointPatch = {
+    gap?: number;
+    direction?: 'vertical' | 'horizontal';
+};
+declare const resolveCommonStyleAtWidth: (base: CommonStyle | undefined, breakpoints: Partial<Record<StyleBreakpointKey, Partial<CommonStyle>>> | undefined, widthPx: number) => CommonStyle | undefined;
+declare const resolveTextStyleAtWidth: (base: TextStyle | undefined, breakpoints: Partial<Record<StyleBreakpointKey, Partial<TextStyle>>> | undefined, widthPx: number) => TextStyle | undefined;
+declare const resolveImageStyleAtWidth: (base: ImageStyle | undefined, breakpoints: Partial<Record<StyleBreakpointKey, Partial<ImageStyle>>> | undefined, widthPx: number) => ImageStyle | undefined;
+declare const resolveIconStyleAtWidth: (base: IconStyle | undefined, breakpoints: Partial<Record<StyleBreakpointKey, Partial<IconStyle>>> | undefined, widthPx: number) => IconStyle | undefined;
+declare const resolveButtonStyleAtWidth: (base: ButtonStyle | undefined, breakpoints: Partial<Record<StyleBreakpointKey, Partial<ButtonStyle>>> | undefined, widthPx: number) => ButtonStyle | undefined;
+declare const resolveStackLayoutAtWidth: (layer: Pick<StackLayer, "gap" | "direction" | "stackLayoutBreakpoints">, widthPx: number) => {
+    gap: number | undefined;
+    direction: StackLayer["direction"];
+};
+declare const resolveButtonLayoutAtWidth: (layer: Pick<ButtonLayer | BackButtonLayer, "gap" | "direction" | "buttonLayoutBreakpoints">, widthPx: number) => {
+    gap: number | undefined;
+    direction: ButtonLayer["direction"] | undefined;
+};
+/** Effective styles for editor preview at the bucket implied by device width. */
+declare const resolveTextStyleForEditBucket: (base: TextStyle | undefined, breakpoints: TextLayer["styleBreakpoints"], bucket: StyleBreakpointKey | "default") => TextStyle | undefined;
+declare const resolveCommonStyleForEditBucket: (base: CommonStyle | undefined, breakpoints: StackLayer["styleBreakpoints"], bucket: StyleBreakpointKey | "default") => CommonStyle | undefined;
+
+export { type ButtonLayoutBreakpointPatch, type StackLayoutBreakpointPatch, resolveButtonLayoutAtWidth, resolveButtonStyleAtWidth, resolveCommonStyleAtWidth, resolveCommonStyleForEditBucket, resolveIconStyleAtWidth, resolveImageStyleAtWidth, resolveLayerGap, resolveLoaderCircularSizePx, resolveLoaderLinearHeightPx, resolveLoaderStrokeWidthPx, resolveProgressLinearHeightPx, resolveStackLayoutAtWidth, resolveTextStyleAtWidth, resolveTextStyleForEditBucket };

package/dist/responsive/layerResolve.js

@@ -0,0 +1,168 @@
+// src/layout/scalarLayoutDefaults.ts
+var DEFAULT_PROGRESS_LINEAR_HEIGHT_PX = 6;
+var DEFAULT_LOADER_LINEAR_HEIGHT_PX = 6;
+var DEFAULT_LOADER_CIRCULAR_SIZE_PX = 48;
+var DEFAULT_LOADER_STROKE_WIDTH_PX = 4;
+var GAP_BY_KIND = {
+  stack: 12,
+  single_choice: 8,
+  multiple_choice: 8,
+  oauth_login: 8,
+  email_password_auth: 8,
+  email_password_submit: 8,
+  button: 8,
+  back_button: 8,
+  oauth_provider: 8,
+  hyperlink: 0
+};
+var defaultGapForLayerKind = (kind) => GAP_BY_KIND[kind] ?? null;
+
+// src/responsive/breakpoints.ts
+var TAILWIND_DEFAULT_BREAKPOINTS = {
+  sm: 640,
+  md: 768,
+  lg: 1024,
+  xl: 1280,
+  "2xl": 1536
+};
+var STYLE_BREAKPOINT_MERGE_ORDER = ["sm", "md", "lg", "xl", "2xl"];
+var getScreenSizeBucketForWidth = (width) => {
+  const { sm, md, lg, xl, "2xl": xxl } = TAILWIND_DEFAULT_BREAKPOINTS;
+  if (width < sm) return "default";
+  if (width < md) return "sm";
+  if (width < lg) return "md";
+  if (width < xl) return "lg";
+  if (width < xxl) return "xl";
+  return "2xl";
+};
+var getActiveStyleBreakpointChain = (widthPx) => {
+  const bucket = getScreenSizeBucketForWidth(widthPx);
+  if (bucket === "default") return [];
+  const idx = STYLE_BREAKPOINT_MERGE_ORDER.indexOf(bucket);
+  if (idx < 0) return [];
+  return STYLE_BREAKPOINT_MERGE_ORDER.slice(0, idx + 1);
+};
+
+// src/responsive/merge.ts
+var isPlainObject = (v) => v !== null && typeof v === "object" && !Array.isArray(v);
+var deepMergeStyle = (base, ...overrides) => {
+  let acc = base ? { ...base } : void 0;
+  for (const o of overrides) {
+    if (!o) continue;
+    acc = acc ?? {};
+    for (const [k, v] of Object.entries(o)) {
+      if (v === void 0) continue;
+      const prev = acc[k];
+      if (isPlainObject(v) && isPlainObject(prev)) {
+        const merged = deepMergeStyle(prev, v);
+        if (merged !== void 0) acc[k] = merged;
+      } else {
+        acc[k] = v;
+      }
+    }
+  }
+  return acc;
+};
+var mergeResponsivePartial = (base, breakpoints, widthPx) => {
+  const chain = getActiveStyleBreakpointChain(widthPx);
+  if (chain.length === 0) return base ? { ...base } : void 0;
+  let acc = base ? { ...base } : void 0;
+  for (const key of chain) {
+    const patch = breakpoints?.[key];
+    if (!patch) continue;
+    acc = deepMergeStyle(acc, patch);
+  }
+  return acc;
+};
+var mergeResponsivePartialUpToBucket = (base, breakpoints, bucket) => {
+  if (bucket === "default") return base ? { ...base } : void 0;
+  const end = STYLE_BREAKPOINT_MERGE_ORDER.indexOf(bucket);
+  if (end < 0) return base ? { ...base } : void 0;
+  let acc = base ? { ...base } : void 0;
+  for (let i = 0; i <= end; i++) {
+    const key = STYLE_BREAKPOINT_MERGE_ORDER[i];
+    const patch = breakpoints?.[key];
+    if (!patch) continue;
+    acc = deepMergeStyle(acc, patch);
+  }
+  return acc;
+};
+
+// src/responsive/layerResolve.ts
+var resolveLayerGap = (kind, gap) => gap ?? defaultGapForLayerKind(kind) ?? 0;
+var resolveProgressLinearHeightPx = (height) => typeof height === "number" ? height : DEFAULT_PROGRESS_LINEAR_HEIGHT_PX;
+var resolveLoaderLinearHeightPx = (height) => typeof height === "number" ? height : DEFAULT_LOADER_LINEAR_HEIGHT_PX;
+var resolveLoaderCircularSizePx = (width) => typeof width === "number" ? width : DEFAULT_LOADER_CIRCULAR_SIZE_PX;
+var resolveLoaderStrokeWidthPx = (strokeWidth) => strokeWidth ?? DEFAULT_LOADER_STROKE_WIDTH_PX;
+var resolveCommonStyleAtWidth = (base, breakpoints, widthPx) => mergeResponsivePartial(
+  base,
+  breakpoints,
+  widthPx
+);
+var resolveTextStyleAtWidth = (base, breakpoints, widthPx) => mergeResponsivePartial(
+  base,
+  breakpoints,
+  widthPx
+);
+var resolveImageStyleAtWidth = (base, breakpoints, widthPx) => mergeResponsivePartial(
+  base,
+  breakpoints,
+  widthPx
+);
+var resolveIconStyleAtWidth = (base, breakpoints, widthPx) => mergeResponsivePartial(
+  base,
+  breakpoints,
+  widthPx
+);
+var resolveButtonStyleAtWidth = (base, breakpoints, widthPx) => mergeResponsivePartial(
+  base,
+  breakpoints,
+  widthPx
+);
+var mergeLayoutScalars = (base, breakpoints, widthPx) => {
+  const chain = getActiveStyleBreakpointChain(widthPx);
+  let acc = { ...base };
+  for (const key of chain) {
+    const p = breakpoints?.[key];
+    if (!p) continue;
+    acc = { ...acc, ...p };
+  }
+  return acc;
+};
+var resolveStackLayoutAtWidth = (layer, widthPx) => {
+  const base = {
+    gap: layer.gap,
+    direction: layer.direction
+  };
+  const merged = mergeLayoutScalars(
+    base,
+    layer.stackLayoutBreakpoints,
+    widthPx
+  );
+  return {
+    gap: merged.gap,
+    direction: merged.direction ?? layer.direction
+  };
+};
+var resolveButtonLayoutAtWidth = (layer, widthPx) => {
+  const merged = mergeLayoutScalars(
+    { gap: layer.gap, direction: layer.direction },
+    layer.buttonLayoutBreakpoints,
+    widthPx
+  );
+  return { gap: merged.gap, direction: merged.direction };
+};
+var resolveTextStyleForEditBucket = (base, breakpoints, bucket) => mergeResponsivePartialUpToBucket(
+  base,
+  breakpoints,
+  bucket
+);
+var resolveCommonStyleForEditBucket = (base, breakpoints, bucket) => mergeResponsivePartialUpToBucket(
+  base,
+  breakpoints,
+  bucket
+);
+
+export { resolveButtonLayoutAtWidth, resolveButtonStyleAtWidth, resolveCommonStyleAtWidth, resolveCommonStyleForEditBucket, resolveIconStyleAtWidth, resolveImageStyleAtWidth, resolveLayerGap, resolveLoaderCircularSizePx, resolveLoaderLinearHeightPx, resolveLoaderStrokeWidthPx, resolveProgressLinearHeightPx, resolveStackLayoutAtWidth, resolveTextStyleAtWidth, resolveTextStyleForEditBucket };
+//# sourceMappingURL=layerResolve.js.map
+//# sourceMappingURL=layerResolve.js.map

package/dist/responsive/layerResolve.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/layout/scalarLayoutDefaults.ts","../../src/responsive/breakpoints.ts","../../src/responsive/merge.ts","../../src/responsive/layerResolve.ts"],"names":[],"mappings":"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","file":"layerResolve.js","sourcesContent":["import type { CommonStyle, LayerKind, LoaderLayer } from '@getrheo/contracts/layers';\n\n/** Bar thickness (px) for a linear progress bar when `style.height` is omitted. */\nexport const DEFAULT_PROGRESS_LINEAR_HEIGHT_PX = 6;\n/** Bar thickness (px) for a linear loader when `style.height` is omitted. */\nexport const DEFAULT_LOADER_LINEAR_HEIGHT_PX = 6;\n/** Diameter (px) for a circular loader when `style.width`/`style.height` are omitted. */\nexport const DEFAULT_LOADER_CIRCULAR_SIZE_PX = 48;\n/** Ring thickness (px) for a circular loader when `style.strokeWidth` is omitted. */\nexport const DEFAULT_LOADER_STROKE_WIDTH_PX = 4;\n\n/**\n * Standard child spacing (px) for kinds that lay out children in a flex\n * container. Mirrors the authoring defaults in `createLayer*` and the\n * historical renderer fallbacks (`?? 8` / `?? 0`). Kinds without a `gap`\n * field, or where spacing does not apply, are absent (→ `null`).\n */\nconst GAP_BY_KIND: Partial<Record<LayerKind, number>> = {\n  stack: 12,\n  single_choice: 8,\n  multiple_choice: 8,\n  oauth_login: 8,\n  email_password_auth: 8,\n  email_password_submit: 8,\n  button: 8,\n  back_button: 8,\n  oauth_provider: 8,\n  hyperlink: 0,\n};\n\nexport const defaultGapForLayerKind = (kind: LayerKind): number | null =>\n  GAP_BY_KIND[kind] ?? null;\n\n/**\n * Explicit scalar dimensions for feedback layers (progress / loader) whose\n * sizing lives directly on `style` as pixel values. Used by ingress\n * normalization to backfill omitted dimensions and by the inspector to show\n * the effective size. Renderers keep their own safety nets via the resolvers\n * in `responsive/layerResolve`.\n */\nexport const defaultFeedbackStyleScalars = (\n  kind: 'progress' | 'loader',\n  variant?: LoaderLayer['variant'],\n): Partial<CommonStyle> | null => {\n  if (kind === 'progress') {\n    return { height: DEFAULT_PROGRESS_LINEAR_HEIGHT_PX };\n  }\n  if (variant === 'circular') {\n    return {\n      width: DEFAULT_LOADER_CIRCULAR_SIZE_PX,\n      height: DEFAULT_LOADER_CIRCULAR_SIZE_PX,\n      strokeWidth: DEFAULT_LOADER_STROKE_WIDTH_PX,\n    };\n  }\n  return { height: DEFAULT_LOADER_LINEAR_HEIGHT_PX };\n};\n","/**\n * Tailwind CSS default `screens` min-width values (px). Single source of truth\n * for preview buckets, manifest breakpoints, and runtime style resolution.\n *\n * @see https://tailwindcss.com/docs/screens\n */\nexport const TAILWIND_DEFAULT_BREAKPOINTS = {\n  sm: 640,\n  md: 768,\n  lg: 1024,\n  xl: 1280,\n  '2xl': 1536,\n} as const;\n\n/** Viewport classification used by preview UI and editing scope. */\nexport type ScreenSizeBucket = 'default' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';\n\n/** Ordered keys stored on layers (`styleBreakpoints`) and merged mobile-first. */\nexport const STYLE_BREAKPOINT_MERGE_ORDER = ['sm', 'md', 'lg', 'xl', '2xl'] as const;\nexport type StyleBreakpointKey = (typeof STYLE_BREAKPOINT_MERGE_ORDER)[number];\n\nexport const SCREEN_SIZE_BUCKET_ORDER: readonly ScreenSizeBucket[] = [\n  'default',\n  'sm',\n  'md',\n  'lg',\n  'xl',\n  '2xl',\n] as const;\n\n/** Buckets shown in the flow builder inspector (xl / 2xl omitted from authoring UI). */\nexport const BUILDER_INSPECTOR_BUCKET_ORDER: readonly ScreenSizeBucket[] = [\n  'default',\n  'sm',\n  'md',\n  'lg',\n] as const;\n\n/** Human-readable bucket titles; ranges lie between consecutive breakpoints. */\nexport const SCREEN_SIZE_BUCKET_LABEL: Record<ScreenSizeBucket, string> = {\n  default: 'Default (< 640px)',\n  sm: 'sm (640–767px)',\n  md: 'md (768–1023px)',\n  lg: 'lg (1024–1279px)',\n  xl: 'xl (1280–1535px)',\n  '2xl': '2xl (1536px+)',\n};\n\n/** Fallback viewport width when no `previewWidthPx` is passed (simulator / static previews). */\nexport const DEFAULT_PREVIEW_VIEWPORT_WIDTH_PX = 390;\n\n/** Maps viewport width (CSS px) to the Tailwind viewport bucket. */\nexport const getScreenSizeBucketForWidth = (width: number): ScreenSizeBucket => {\n  const { sm, md, lg, xl, '2xl': xxl } = TAILWIND_DEFAULT_BREAKPOINTS;\n  if (width < sm) return 'default';\n  if (width < md) return 'sm';\n  if (width < lg) return 'md';\n  if (width < xl) return 'lg';\n  if (width < xxl) return 'xl';\n  return '2xl';\n};\n\n/**\n * Breakpoint keys whose partials apply at this width (mobile-first), e.g.\n * width 800 → `['sm','md']`.\n */\nexport const getActiveStyleBreakpointChain = (widthPx: number): StyleBreakpointKey[] => {\n  const bucket = getScreenSizeBucketForWidth(widthPx);\n  if (bucket === 'default') return [];\n  const idx = STYLE_BREAKPOINT_MERGE_ORDER.indexOf(bucket as StyleBreakpointKey);\n  if (idx < 0) return [];\n  return STYLE_BREAKPOINT_MERGE_ORDER.slice(0, idx + 1) as StyleBreakpointKey[];\n};\n","import {\n  STYLE_BREAKPOINT_MERGE_ORDER,\n  getActiveStyleBreakpointChain,\n} from './breakpoints';\nimport type { StyleBreakpointKey } from './breakpoints';\n\nconst isPlainObject = (v: unknown): v is Record<string, unknown> =>\n  v !== null && typeof v === 'object' && !Array.isArray(v);\n\n/**\n * Deep-merge style-like objects: nested plain objects merge per-key; scalars\n * and arrays replace. Suitable for padding/margin/border/shadow objects.\n */\nexport const deepMergeStyle = <T extends Record<string, unknown>>(\n  base: T | undefined,\n  ...overrides: (Partial<T> | undefined)[]\n): T | undefined => {\n  let acc: T | undefined = base ? ({ ...base } as T) : undefined;\n  for (const o of overrides) {\n    if (!o) continue;\n    acc = acc ?? ({} as T);\n    for (const [k, v] of Object.entries(o) as [keyof T, T[keyof T] | undefined][]) {\n      if (v === undefined) continue;\n      const prev = acc[k as keyof T] as unknown;\n      if (isPlainObject(v) && isPlainObject(prev)) {\n        const merged = deepMergeStyle(prev as Record<string, unknown>, v as Partial<T>);\n        if (merged !== undefined) (acc as Record<string, unknown>)[k as string] = merged;\n      } else {\n        (acc as Record<string, unknown>)[k as string] = v as unknown;\n      }\n    }\n  }\n  return acc;\n};\n\n/**\n * Mobile-first merge: `base` applies below `sm`; each breakpoint partial stacks\n * from `sm` through the bucket implied by `widthPx`.\n */\nexport const mergeResponsivePartial = <T extends Record<string, unknown>>(\n  base: Partial<T> | undefined,\n  breakpoints: Partial<Record<StyleBreakpointKey, Partial<T>>> | undefined,\n  widthPx: number,\n): Partial<T> | undefined => {\n  const chain = getActiveStyleBreakpointChain(widthPx);\n  if (chain.length === 0) return base ? { ...base } : undefined;\n  let acc = base ? ({ ...base } as Partial<T>) : undefined;\n  for (const key of chain) {\n    const patch = breakpoints?.[key];\n    if (!patch) continue;\n    acc = deepMergeStyle(acc as Record<string, unknown> | undefined, patch as Partial<T>) as\n      | Partial<T>\n      | undefined;\n  }\n  return acc;\n};\n\n/**\n * Merge breakpoint partials up to and including `bucket` (not using viewport width).\n * Use when editing a specific bucket's effective preview.\n */\nexport const mergeResponsivePartialUpToBucket = <T extends Record<string, unknown>>(\n  base: Partial<T> | undefined,\n  breakpoints: Partial<Record<StyleBreakpointKey, Partial<T>>> | undefined,\n  bucket: StyleBreakpointKey | 'default',\n): Partial<T> | undefined => {\n  if (bucket === 'default') return base ? { ...base } : undefined;\n  const end = STYLE_BREAKPOINT_MERGE_ORDER.indexOf(bucket);\n  if (end < 0) return base ? { ...base } : undefined;\n  let acc = base ? ({ ...base } as Partial<T>) : undefined;\n  for (let i = 0; i <= end; i++) {\n    const key = STYLE_BREAKPOINT_MERGE_ORDER[i]!;\n    const patch = breakpoints?.[key];\n    if (!patch) continue;\n    acc = deepMergeStyle(acc as Record<string, unknown> | undefined, patch as Partial<T>) as\n      | Partial<T>\n      | undefined;\n  }\n  return acc;\n};\n","import type {\n  BackButtonLayer,\n  ButtonLayer,\n  ButtonStyle,\n  CommonLayoutHeight,\n  CommonStyle,\n  IconStyle,\n  ImageStyle,\n  LayerKind,\n  StackLayer,\n  TextLayer,\n  TextStyle,\n  WidthValue,\n} from '@getrheo/contracts/layers';\nimport {\n  DEFAULT_LOADER_CIRCULAR_SIZE_PX,\n  DEFAULT_LOADER_LINEAR_HEIGHT_PX,\n  DEFAULT_LOADER_STROKE_WIDTH_PX,\n  DEFAULT_PROGRESS_LINEAR_HEIGHT_PX,\n  defaultGapForLayerKind,\n} from '../layout/scalarLayoutDefaults';\nimport type { StyleBreakpointKey } from './breakpoints';\nimport { getActiveStyleBreakpointChain } from './breakpoints';\nimport { mergeResponsivePartial, mergeResponsivePartialUpToBucket } from './merge';\n\n/**\n * Effective child spacing (px) for a layer, falling back to the per-kind\n * default and finally `0`. Single runtime source of truth so renderers stop\n * hard-coding `?? 8` / `?? 0`.\n */\nexport const resolveLayerGap = (kind: LayerKind, gap: number | undefined): number =>\n  gap ?? defaultGapForLayerKind(kind) ?? 0;\n\n/** Effective bar thickness (px) for a linear progress bar. */\nexport const resolveProgressLinearHeightPx = (\n  height: CommonLayoutHeight | undefined,\n): number => (typeof height === 'number' ? height : DEFAULT_PROGRESS_LINEAR_HEIGHT_PX);\n\n/** Effective bar thickness (px) for a linear loader. */\nexport const resolveLoaderLinearHeightPx = (\n  height: CommonLayoutHeight | undefined,\n): number => (typeof height === 'number' ? height : DEFAULT_LOADER_LINEAR_HEIGHT_PX);\n\n/** Effective diameter (px) for a circular loader (sized via `style.width`). */\nexport const resolveLoaderCircularSizePx = (width: WidthValue | undefined): number =>\n  typeof width === 'number' ? width : DEFAULT_LOADER_CIRCULAR_SIZE_PX;\n\n/** Effective ring thickness (px) for a circular loader. */\nexport const resolveLoaderStrokeWidthPx = (strokeWidth: number | undefined): number =>\n  strokeWidth ?? DEFAULT_LOADER_STROKE_WIDTH_PX;\n\nexport type StackLayoutBreakpointPatch = {\n  gap?: number;\n  direction?: 'vertical' | 'horizontal';\n};\n\nexport type ButtonLayoutBreakpointPatch = {\n  gap?: number;\n  direction?: 'vertical' | 'horizontal';\n};\n\nexport const resolveCommonStyleAtWidth = (\n  base: CommonStyle | undefined,\n  breakpoints:\n    | Partial<Record<StyleBreakpointKey, Partial<CommonStyle>>>\n    | undefined,\n  widthPx: number,\n): CommonStyle | undefined =>\n  mergeResponsivePartial(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    widthPx,\n  ) as CommonStyle | undefined;\n\nexport const resolveTextStyleAtWidth = (\n  base: TextStyle | undefined,\n  breakpoints:\n    | Partial<Record<StyleBreakpointKey, Partial<TextStyle>>>\n    | undefined,\n  widthPx: number,\n): TextStyle | undefined =>\n  mergeResponsivePartial(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    widthPx,\n  ) as TextStyle | undefined;\n\nexport const resolveImageStyleAtWidth = (\n  base: ImageStyle | undefined,\n  breakpoints:\n    | Partial<Record<StyleBreakpointKey, Partial<ImageStyle>>>\n    | undefined,\n  widthPx: number,\n): ImageStyle | undefined =>\n  mergeResponsivePartial(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    widthPx,\n  ) as ImageStyle | undefined;\n\nexport const resolveIconStyleAtWidth = (\n  base: IconStyle | undefined,\n  breakpoints:\n    | Partial<Record<StyleBreakpointKey, Partial<IconStyle>>>\n    | undefined,\n  widthPx: number,\n): IconStyle | undefined =>\n  mergeResponsivePartial(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    widthPx,\n  ) as IconStyle | undefined;\n\nexport const resolveButtonStyleAtWidth = (\n  base: ButtonStyle | undefined,\n  breakpoints:\n    | Partial<Record<StyleBreakpointKey, Partial<ButtonStyle>>>\n    | undefined,\n  widthPx: number,\n): ButtonStyle | undefined =>\n  mergeResponsivePartial(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    widthPx,\n  ) as ButtonStyle | undefined;\n\nconst mergeLayoutScalars = <T extends Record<string, unknown>>(\n  base: T,\n  breakpoints: Partial<Record<StyleBreakpointKey, Partial<T>>> | undefined,\n  widthPx: number,\n): T => {\n  const chain = getActiveStyleBreakpointChain(widthPx);\n  let acc = { ...base };\n  for (const key of chain) {\n    const p = breakpoints?.[key];\n    if (!p) continue;\n    acc = { ...acc, ...p };\n  }\n  return acc;\n};\n\nexport const resolveStackLayoutAtWidth = (\n  layer: Pick<\n    StackLayer,\n    'gap' | 'direction' | 'stackLayoutBreakpoints'\n  >,\n  widthPx: number,\n): { gap: number | undefined; direction: StackLayer['direction'] } => {\n  const base = {\n    gap: layer.gap,\n    direction: layer.direction,\n  };\n  const merged = mergeLayoutScalars(\n    base,\n    layer.stackLayoutBreakpoints as\n      | Partial<Record<StyleBreakpointKey, Partial<{ gap?: number; direction?: StackLayer['direction'] }>>>\n      | undefined,\n    widthPx,\n  );\n  return {\n    gap: merged.gap,\n    direction: merged.direction ?? layer.direction,\n  };\n};\n\nexport const resolveButtonLayoutAtWidth = (\n  layer: Pick<ButtonLayer | BackButtonLayer, 'gap' | 'direction' | 'buttonLayoutBreakpoints'>,\n  widthPx: number,\n): { gap: number | undefined; direction: ButtonLayer['direction'] | undefined } => {\n  const merged = mergeLayoutScalars(\n    { gap: layer.gap, direction: layer.direction },\n    layer.buttonLayoutBreakpoints as\n      | Partial<\n          Record<\n            StyleBreakpointKey,\n            Partial<{ gap?: number; direction?: ButtonLayer['direction'] }>\n          >\n        >\n      | undefined,\n    widthPx,\n  );\n  return { gap: merged.gap, direction: merged.direction };\n};\n\n/** Effective styles for editor preview at the bucket implied by device width. */\nexport const resolveTextStyleForEditBucket = (\n  base: TextStyle | undefined,\n  breakpoints: TextLayer['styleBreakpoints'],\n  bucket: StyleBreakpointKey | 'default',\n): TextStyle | undefined =>\n  mergeResponsivePartialUpToBucket(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    bucket,\n  ) as TextStyle | undefined;\n\nexport const resolveCommonStyleForEditBucket = (\n  base: CommonStyle | undefined,\n  breakpoints: StackLayer['styleBreakpoints'],\n  bucket: StyleBreakpointKey | 'default',\n): CommonStyle | undefined =>\n  mergeResponsivePartialUpToBucket(\n    base as Record<string, unknown> | undefined,\n    breakpoints as Partial<Record<StyleBreakpointKey, Partial<Record<string, unknown>>>> | undefined,\n    bucket,\n  ) as CommonStyle | undefined;\n"]}