Create Page.Container component

src/components/Page.tsx

@@ -2,6 +2,7 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import { or } from 'airbnb-prop-types';
 import StyleSheet from '../stylesheet';
+import PageContainer from './PageContainer';
 import PageStylePropTypes from './PageStylePropTypes';
 
 export const PagePropTypes = {
@@ -14,6 +15,7 @@ type Props = PropTypes.InferProps<typeof PagePropTypes>;
 
 export default class Page extends React.Component<Props> {
   static propTypes = PagePropTypes;
+  static Container = PageContainer;
 
   render() {
     const { name, children, style, ...otherProps } = this.props;

src/components/PageContainer.tsx

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import * as PropTypes from 'prop-types';
+import { or } from 'airbnb-prop-types';
+import StyleSheet from '../stylesheet';
+import PageStylePropTypes from './PageStylePropTypes';
+
+export const PagePropTypes = {
+  children: PropTypes.node,
+  style: or([PropTypes.shape(PageStylePropTypes), PropTypes.number]),
+};
+
+type Props = PropTypes.InferProps<typeof PagePropTypes>;
+
+export default class PageContainer extends React.Component<Props> {
+  static propTypes = PagePropTypes;
+
+  render() {
+    const { children, style, ...otherProps } = this.props;
+    const _style = StyleSheet.flatten(style);
+
+    return (
+      <sketch_pagecontainer style={_style} {...otherProps}>
+        {children}
+      </sketch_pagecontainer>
+    );
+  }
+}

src/render.tsx

@@ -41,6 +41,11 @@ const getDefaultPage = (): SketchLayer => {
 };
 
 const renderContents = (tree: TreeNode | string, container: SketchLayer): SketchLayer => {
+  if (typeof tree !== 'string' && tree.type === 'sketch_pagecontainer') {
+    const children = tree.children || [];
+
+    return children.map(child => renderContents(child, container));
+  }
   const json = flexToSketchJSON(tree);
   const layer = fromSJSON(json, '119');
 

src/types/intrinsic.d.ts

@@ -5,6 +5,7 @@ declare module JSX {
     sketch_view: any;
     sketch_text: any;
     sketch_page: any;
+    sketch_pagecontainer: any;
     sketch_image: any;
     sketch_document: any;
     sketch_artboard: any;