@developer_tribe/react-builder 1.2.31 → 1.2.32

package/src/build-components/useNode.ts

@@ -2,7 +2,6 @@ import { NodeData, NodeDefaultAttribute } from '../types/Node';
 import { getDefaultsForType } from '../utils/patterns';
 
 type WithStyleBags = {
-  style?: Record<string, unknown>;
   styles?: Record<string, unknown>;
 };
 
@@ -15,29 +14,16 @@ export default function useNode<
   const nodeAttributes = ((node.attributes as T) ?? ({} as T)) as T &
     WithStyleBags;
   const defaultAttributes = defaults as T & WithStyleBags;
-  // Merge styles from both defaults and node (schemaVersion=2 uses `styles` only).
-  // Read legacy `style` for back-compat with old persisted data, but output only `styles`.
-  const defaultStyle = {
-    ...(defaultAttributes?.style ?? {}),
+  // Deep-merge styles so default style values aren't lost when the node provides partial overrides.
+  const mergedStyle = {
     ...(defaultAttributes?.styles ?? {}),
-  };
-  const nodeStyle = {
-    ...(nodeAttributes?.style ?? {}),
     ...(nodeAttributes?.styles ?? {}),
   };
-  const mergedStyle = {
-    ...defaultStyle,
-    ...nodeStyle,
-  };
   const mergedRecord: Record<string, unknown> = {
     ...(defaultAttributes as Record<string, unknown>),
     ...(nodeAttributes as Record<string, unknown>),
-    // Deep merge styles so default style values aren't lost when the node provides partial overrides.
-    // Only use `styles` (schemaVersion=2). Remove legacy `style` to avoid validator rejection.
     styles: mergedStyle,
   };
-  // Remove legacy `style` key if it was inherited from defaults or node attributes.
-  delete mergedRecord.style;
   if (
     typeof mergedRecord.styles === 'object' &&
     mergedRecord.styles != null &&

package/src/migrations/migrations/1.1.2_extract_component_attributes_from_style.ts

@@ -50,11 +50,16 @@ function normalizeStyleAttributes(node: Node, styleKeys: Set<string>): Node {
   }
 
   const nextAttrs: Record<string, unknown> = { ...(record.attributes ?? {}) };
-  const prevStyle = isPlainObject(nextAttrs.style) ? nextAttrs.style : {};
-  const nextStyle: Record<string, unknown> = { ...prevStyle };
+  // Read from both legacy `style` and `styles` for backwards compatibility.
+  const prevStyleLegacy = isPlainObject(nextAttrs.style) ? nextAttrs.style : {};
+  const prevStyles = isPlainObject(nextAttrs.styles) ? nextAttrs.styles : {};
+  const nextStyle: Record<string, unknown> = {
+    ...prevStyleLegacy,
+    ...prevStyles,
+  };
 
   for (const [k, v] of Object.entries(nextAttrs)) {
-    if (k === 'style') continue;
+    if (k === 'style' || k === 'styles') continue;
     if (!styleKeys.has(k)) continue;
 
     // If already set in style, prefer style (drop legacy flat key).
@@ -62,8 +67,10 @@ function normalizeStyleAttributes(node: Node, styleKeys: Set<string>): Node {
     delete nextAttrs[k];
   }
 
+  // Always output as `styles` (schemaVersion=2). Remove legacy `style`.
+  delete nextAttrs.style;
   if (Object.keys(nextStyle).length > 0) {
-    nextAttrs.style = nextStyle;
+    nextAttrs.styles = nextStyle;
   }
 
   return {
@@ -77,16 +84,16 @@ function getStyleSubSchemaKeys(
   schema: Record<string, unknown> | undefined,
 ): Set<string> {
   if (!schema) return new Set();
-  const style = schema.style;
-  if (!isPlainObject(style)) return new Set();
-  return new Set(Object.keys(style));
+  const styles = schema.styles;
+  if (!isPlainObject(styles)) return new Set();
+  return new Set(Object.keys(styles));
 }
 
 function getTopLevelAttributeKeys(
   schema: Record<string, unknown> | undefined,
 ): Set<string> {
   if (!schema) return new Set();
-  const keys = Object.keys(schema).filter((k) => k !== 'style');
+  const keys = Object.keys(schema).filter((k) => k !== 'styles');
   return new Set(keys);
 }
 
@@ -131,7 +138,18 @@ function extractAttributesFromStyle(
   }
 
   const nextAttrs: Record<string, unknown> = { ...(record.attributes ?? {}) };
-  const style = nextAttrs.style;
+  // Read from both legacy `style` and canonical `styles`.
+  const legacyStyle = nextAttrs.style;
+  const canonicalStyles = nextAttrs.styles;
+  const style = isPlainObject(canonicalStyles)
+    ? canonicalStyles
+    : isPlainObject(legacyStyle)
+      ? legacyStyle
+      : undefined;
+
+  if (!style) {
+    return { ...record, children: nextChildren, attributes: nextAttrs };
+  }
 
   if (!isPlainObject(style)) {
     return { ...record, children: nextChildren, attributes: nextAttrs };
@@ -174,8 +192,11 @@ function extractAttributesFromStyle(
 
   if (Object.keys(nextStyle).length === 0) {
     delete nextAttrs.style;
+    delete nextAttrs.styles;
   } else {
-    nextAttrs.style = nextStyle;
+    // Always output as `styles` (schemaVersion=2). Remove legacy `style`.
+    delete nextAttrs.style;
+    nextAttrs.styles = nextStyle;
   }
 
   return {

package/src/utils/analyseNodeByPatterns.ts

@@ -22,7 +22,7 @@ export type AnalyseResultWithPath = {
 };
 
 type AttributeTypeSpec = string | string[];
-// schema v2 supports nesting style specs under `attributes.style` (one level deep)
+// schema v2 supports nesting style specs under `attributes.styles` (one level deep)
 type NestedAttributeSchema = Record<string, AttributeTypeSpec>;
 type AttributeSchema = Record<
   string,
@@ -60,7 +60,7 @@ function getStyleSubSchema(
   schema: AttributeSchema | undefined,
 ): AttributeSchema {
   if (!schema) return {};
-  const maybe = schema.style;
+  const maybe = schema.styles;
   if (!maybe) return {};
   if (typeof maybe === 'string' || Array.isArray(maybe)) return {};
   return (maybe ?? {}) as AttributeSchema;

package/src/utils/attributeStyle.ts

@@ -1,19 +1,25 @@
 /**
  * Shared utilities for attribute/style bag access.
- * schemaVersion=2 uses `attributes.styles`, legacy uses `attributes.style`.
+ * schemaVersion=2 uses `attributes.styles` exclusively.
  */
 
 import type { NodeDefaultAttribute } from '../types/Node';
 
-/** Returns styles or style bag from attributes (schemaVersion=2 uses styles, legacy uses style). */
+/** Returns styles bag from attributes (schemaVersion=2 uses `styles` only). Throws if legacy `style` is found. */
 export function getStyleBag(
   attributes: NodeDefaultAttribute | undefined,
 ): Record<string, unknown> | undefined {
   const record = toAttributeRecord(attributes);
-  const bag = record.styles ?? record.style;
+  if ('style' in record && record.style != null) {
+    throw new Error(
+      '[getStyleBag] Legacy "style" key detected in attributes. Use "styles" instead (schemaVersion=2).',
+    );
+  }
+  const bag = record.styles;
   return isPlainObject(bag) ? (bag as Record<string, unknown>) : undefined;
 }
 
+//TODO: sil
 /** Safe indexed access to attributes. Use for reading style/direct props. */
 export function toAttributeRecord(
   attributes: unknown,

package/src/utils/extractImageStyle.ts

@@ -19,9 +19,9 @@ export function extractImageStyle<T extends ImagePropsGenerated['attributes']>(
 
   if (!attributes) return style;
 
-  // Map resizeMode to CSS object-fit (schemaVersion=2 uses `styles`, fallback to legacy `style`)
+  // Map resizeMode to CSS object-fit (schemaVersion=2 uses `styles`)
   const stylesBag = getStyleBag(attributes) as
-    | ImagePropsGenerated['attributes']['style']
+    | ImagePropsGenerated['attributes']['styles']
     | undefined;
   const resizeMode: ResizeModeOptionType | undefined =
     stylesBag?.resizeMode ?? (attributes as any).resizeMode;
@@ -40,9 +40,9 @@ export function extractImageStyleNative<
   const attributes = node.attributes;
   if (!attributes) return {};
 
-  // schemaVersion=2 uses `styles`, fallback to legacy `style`
+  // schemaVersion=2 uses `styles`
   const nativeStylesBag = getStyleBag(attributes) as
-    | ImagePropsGenerated['attributes']['style']
+    | ImagePropsGenerated['attributes']['styles']
     | undefined;
   const resizeMode: ResizeModeOptionType | undefined =
     nativeStylesBag?.resizeMode ?? (attributes as any).resizeMode;

package/src/utils/patterns.ts

@@ -73,7 +73,7 @@ function normalizePlatform(platform?: BuilderPlatform | null): BuilderPlatform {
 
 /**
  * Keys that conceptually behave like component props (behavior/flags) rather than
- * style properties. These should NOT be normalized into `attributes.style`.
+ * style properties. These should NOT be normalized into `attributes.styles`.
  */
 export const NON_STYLE_ATTRIBUTE_KEYS = new Set<string>([
   'scrollable',
@@ -82,7 +82,7 @@ export const NON_STYLE_ATTRIBUTE_KEYS = new Set<string>([
 ]);
 
 /**
- * schemaVersion=2 stores style-like keys inside `attributes.style`.
+ * schemaVersion=2 stores style-like keys inside `attributes.styles`.
  *
  * We treat View+Text schema keys as style-like by default, but explicitly exclude
  * known non-style props (behavior flags).
@@ -97,7 +97,7 @@ export function getStyleAttributeKeySet(): Set<string> {
     unknown
   >;
   const getNestedStyleKeys = (schema: Record<string, unknown>): string[] => {
-    const nested = schema.style;
+    const nested = schema.styles;
     return typeof nested === 'object' && nested
       ? Object.keys(nested)
       : Object.keys(schema);