Function composeFrame

packages/backend/src/compose/composeMain.ts:228–280

(
  node: SceneNode & BaseFrameMixin & MinimalBlendMixin,
)

};

const composeFrame = (
  node: SceneNode & BaseFrameMixin & MinimalBlendMixin,
): string => {
  const hasAbsoluteChildren = node.children.some(
    (child: any) => (child as any).layoutPositioning === "ABSOLUTE",
  );

  if (hasAbsoluteChildren && node.layoutMode !== "NONE") {
    addWarning(
      `Frame "${node.name}" has absolute positioned children. Using Box instead of ${
        node.layoutMode === "HORIZONTAL" ? "Row" : "Column"
      }.`,
    );
  }

  const children = composeWidgetGenerator(node.children);

  if (hasAbsoluteChildren) {
    return composeContainer(
      node,
      generateComposeWidget("Box", {
        content: children !== "" ? [children] : [],
      }),
    );
  }

  if (node.layoutMode !== "NONE") {
    const rowColumnWrap = makeRowColumnWrap(node, children);
    return composeContainer(node, rowColumnWrap);
  } else {
    if (node.inferredAutoLayout) {
      const rowColumnWrap = makeRowColumnWrap(
        node.inferredAutoLayout,
        children,
      );
      return composeContainer(node, rowColumnWrap);
    }

    if (node.isAsset) {
      return composeContainer(
        node,
        "Icon(Icons.Default.Home, contentDescription = null)",
      );
    }

    return composeContainer(
      node,
      generateComposeWidget("Box", {
        content: children !== "" ? [children] : [],
      }),
    );
  }
};

const makeRowColumnWrap = (
  autoLayout: InferredAutoLayoutResult,