@developer_tribe/react-builder 1.1.0 → 1.2.1

package/README.md

@@ -2,6 +2,11 @@
 
 A minimal TypeScript library starter using Rollup, ESLint (flat), and Prettier.
 
+### React Native support (no `react-dom`)
+
+- **Web**: import from `@developer_tribe/react-builder` (default entry)
+- **React Native**: import from `@developer_tribe/react-builder/native` (or rely on Metro picking the `react-native` entry)
+
 ### Scripts
 
 - **build**: Clean and bundle to `dist/` (CJS + ESM, types)
@@ -22,6 +27,7 @@ npm run build
 ```
 src/
   index.ts
+  index.native.ts
 rollup.config.mjs
 eslint.config.mjs
 tsconfig.json

package/dist/AttributesEditor.d.ts

@@ -1,9 +1,11 @@
 import React from 'react';
 import { Node } from './types/Node';
+import type { ProjectColors } from './types/Project';
 type AttributesEditorProps = {
     node: Node;
     onChange: (next: Node) => void;
+    projectColors?: ProjectColors;
 };
-export declare function AttributesEditor({ node, onChange }: AttributesEditorProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function AttributesEditor({ node, onChange, projectColors, }: AttributesEditorProps): import("react/jsx-runtime").JSX.Element | null;
 declare const _default: React.MemoExoticComponent<typeof AttributesEditor>;
 export default _default;

package/dist/DeviceMockFrame.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 type DeviceMockFrameProps = {
     children: React.ReactNode;
+    appName?: string;
 };
-export declare function DeviceMockFrame({ children }: DeviceMockFrameProps): import("react/jsx-runtime").JSX.Element;
+export declare function DeviceMockFrame({ children, appName }: DeviceMockFrameProps): import("react/jsx-runtime").JSX.Element;
 export default DeviceMockFrame;

package/dist/RenderPage.d.ts

@@ -11,8 +11,10 @@ export type ScreenStyle = {
         seperatorColor?: string;
     };
 };
-type RenderPageProps = {
+interface RenderPageProps {
     data: Node;
-};
-export declare function RenderPage({ data }: RenderPageProps): import("react/jsx-runtime").JSX.Element;
+    name: string;
+    onSelectNode?: (node: Node | null) => void;
+}
+export declare function RenderPage({ data, name, onSelectNode }: RenderPageProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/assets/samples/getSamples.d.ts

@@ -2,3 +2,4 @@ import { Project } from '../../types/Project';
 export declare function getSamples(): Project[];
 export declare function getBasicSamples(): Project[];
 export declare function getOnboardSamples(): Project[];
+export declare function getPaywallSamples(): Project[];

package/dist/attributes-editor/Field.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { ViewPropsGenerated } from '../build-components/View/ViewProps.generated';
+import type { ProjectColors } from '../types/Project';
+import { type PreferredScale } from './SizeField';
+import { LayoutContext } from './types';
+export type FieldProps = {
+    name: string;
+    type: string | string[];
+    value: any;
+    onChange: (v: any) => void;
+    componentType?: string;
+    projectColors?: ProjectColors;
+    layoutContext?: LayoutContext;
+    viewAttributes?: Partial<ViewPropsGenerated['attributes']>;
+    label?: React.ReactNode;
+    preferredScale?: PreferredScale;
+};
+export declare function Field({ name, type, value, onChange, componentType, projectColors, layoutContext, viewAttributes, label, preferredScale, }: FieldProps): import("react/jsx-runtime").JSX.Element;

package/dist/attributes-editor/FieldInfoTooltip.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+type FieldInfoTooltipProps = {
+    description?: string;
+    children: React.ReactNode;
+};
+export declare function FieldInfoTooltip({ description, children, }: FieldInfoTooltipProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/attributes-editor/LayoutPreviewPicker.d.ts

@@ -0,0 +1,12 @@
+import type { ViewPropsGenerated } from '../build-components/View/ViewProps.generated';
+import { LayoutContext, LayoutFieldName } from './types';
+type LayoutPreviewPickerProps = {
+    mode: LayoutFieldName;
+    options: string[];
+    value?: string;
+    onChange: (val?: string) => void;
+    layoutContext?: LayoutContext;
+    viewAttributes?: Partial<ViewPropsGenerated['attributes']>;
+};
+export declare function LayoutPreviewPicker({ mode, options, value, onChange, layoutContext, viewAttributes, }: LayoutPreviewPickerProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/attributes-editor/SizeField.d.ts

@@ -0,0 +1,9 @@
+export type PreferredScale = 'vs' | 's' | 'f' | '%';
+export declare function toPreferredScale(value: unknown): PreferredScale | undefined;
+export type SizeFieldProps = {
+    value: unknown;
+    onChange: (val: unknown) => void;
+    preferredScale?: PreferredScale;
+    fieldName: string;
+};
+export declare function SizeField({ value, onChange, preferredScale, fieldName, }: SizeFieldProps): import("react/jsx-runtime").JSX.Element;

package/dist/attributes-editor/SpecialCategorySection.d.ts

@@ -0,0 +1,20 @@
+import { NodeDefaultAttribute } from '../types/Node';
+import type { ProjectColors } from '../types/Project';
+import { AttributeMetaMap, LayoutContext, SchemaEntry } from './types';
+type SpecialCategorySectionProps = {
+    category: string;
+    entries: SchemaEntry[];
+    attributeMeta?: AttributeMetaMap;
+    attributes: NodeDefaultAttribute;
+    onAttributeChange: (name: string, value: unknown) => void;
+    componentType?: string;
+    projectColors?: ProjectColors;
+    layoutContext?: LayoutContext;
+    viewAttributes?: NodeDefaultAttribute;
+    meta?: {
+        label?: string;
+        description?: string;
+    };
+};
+export declare function SpecialCategorySection({ category, entries, attributeMeta, attributes, onAttributeChange, componentType, projectColors, layoutContext, viewAttributes, meta, }: SpecialCategorySectionProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/attributes-editor/types.d.ts

@@ -0,0 +1,14 @@
+import type { AlignItemsOptionType, FlexDirectionOptionType, JustifyContentOptionType } from '../build-components/View/ViewProps.generated';
+import { getAttributeMeta } from '../utils/patterns';
+export type SchemaEntry = {
+    name: string;
+    type: string | string[];
+};
+export type AttributeMetaMap = ReturnType<typeof getAttributeMeta>;
+export type LayoutFieldName = 'flexDirection' | 'alignItems' | 'justifyContent';
+export type LayoutContext = {
+    flexDirection?: FlexDirectionOptionType;
+    alignItems?: AlignItemsOptionType;
+    justifyContent?: JustifyContentOptionType;
+};
+export declare function isBooleanFieldType(type: string | string[]): boolean;

package/dist/build-components/BIcon/BIcon.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { BIconComponentProps } from './BIconProps.generated';
+declare function BIcon({ node }: BIconComponentProps): import("react/jsx-runtime").JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof BIcon>;
+export default _default;

package/dist/build-components/BIcon/BIconProps.generated.d.ts

@@ -0,0 +1,58 @@
+import type { NodeData } from '../../types/Node';
+export type TextAlignOptionType = 'left' | 'center' | 'right' | 'justify';
+export type FlexDirectionOptionType = 'row' | 'column';
+export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+export type PositionOptionType = 'relative' | 'absolute';
+export interface BIconPropsGenerated {
+    child: string;
+    attributes: {
+        style?: Record<string, unknown>;
+        color?: string;
+        fontSize?: string;
+        fontFamily?: string;
+        fontWeight?: string;
+        textAlign?: TextAlignOptionType;
+        adjustsFontSizeToFit?: boolean;
+        showEllipsis?: boolean;
+        scrollable?: boolean;
+        flexDirection?: FlexDirectionOptionType;
+        alignItems?: AlignItemsOptionType;
+        justifyContent?: JustifyContentOptionType;
+        gap?: string;
+        padding?: string;
+        paddingHorizontal?: string;
+        paddingVertical?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        margin?: string;
+        marginVertical?: string;
+        marginTop?: string;
+        marginBottom?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        backgroundColor?: string;
+        borderRadius?: string;
+        width?: string;
+        minWidth?: string;
+        maxWidth?: string;
+        height?: string;
+        minHeight?: string;
+        maxHeight?: string;
+        flex?: number;
+        position?: PositionOptionType;
+        top?: string;
+        bottom?: string;
+        left?: string;
+        right?: string;
+        zIndex?: number;
+        iconType?: string;
+        size?: number;
+        strokeWidth?: number;
+    };
+}
+export interface BIconComponentProps {
+    node: NodeData<BIconPropsGenerated['attributes']>;
+}

package/dist/build-components/BackgroundImage/BackgroundImage.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { BackgroundImageComponentProps } from './BackgroundImageProps.generated';
+declare function BackgroundImage({ node }: BackgroundImageComponentProps): import("react/jsx-runtime").JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof BackgroundImage>;
+export default _default;

package/dist/build-components/BackgroundImage/BackgroundImageProps.generated.d.ts

@@ -0,0 +1,50 @@
+import type { NodeData } from '../../types/Node';
+export type FlexDirectionOptionType = 'row' | 'column';
+export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+export type PositionOptionType = 'relative' | 'absolute';
+export type ResizeModeOptionType = 'cover' | 'contain' | 'stretch' | 'center';
+export interface BackgroundImagePropsGenerated {
+    child: string;
+    attributes: {
+        style?: Record<string, unknown>;
+        scrollable?: boolean;
+        flexDirection?: FlexDirectionOptionType;
+        alignItems?: AlignItemsOptionType;
+        justifyContent?: JustifyContentOptionType;
+        gap?: string;
+        padding?: string;
+        paddingHorizontal?: string;
+        paddingVertical?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        margin?: string;
+        marginVertical?: string;
+        marginTop?: string;
+        marginBottom?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        backgroundColor?: string;
+        borderRadius?: string;
+        width?: string;
+        minWidth?: string;
+        maxWidth?: string;
+        height?: string;
+        minHeight?: string;
+        maxHeight?: string;
+        flex?: number;
+        position?: PositionOptionType;
+        top?: string;
+        bottom?: string;
+        left?: string;
+        right?: string;
+        zIndex?: number;
+        src?: string;
+        resizeMode?: ResizeModeOptionType;
+    };
+}
+export interface BackgroundImageComponentProps {
+    node: NodeData<BackgroundImagePropsGenerated['attributes']>;
+}

package/dist/build-components/Button/Button.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import type { ButtonComponentProps } from './ButtonProps.generated';
-declare function Button({ node }: ButtonComponentProps): string;
+declare function Button({ node }: ButtonComponentProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof Button>;
 export default _default;

package/dist/build-components/Button/ButtonProps.generated.d.ts

@@ -1,10 +1,48 @@
 import type { NodeData } from '../../types/Node';
+export type FlexDirectionOptionType = 'row' | 'column';
+export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+export type PositionOptionType = 'relative' | 'absolute';
 export type FontWeightOptionType = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
 export interface ButtonPropsGenerated {
     child: string;
     attributes: {
+        style?: Record<string, unknown>;
+        scrollable?: boolean;
+        flexDirection?: FlexDirectionOptionType;
+        alignItems?: AlignItemsOptionType;
+        justifyContent?: JustifyContentOptionType;
+        gap?: string;
+        padding?: string;
+        paddingHorizontal?: string;
+        paddingVertical?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        margin?: string;
+        marginVertical?: string;
+        marginTop?: string;
+        marginBottom?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        backgroundColor?: string;
+        borderRadius?: string;
+        width?: string;
+        minWidth?: string;
+        maxWidth?: string;
+        height?: string;
+        minHeight?: string;
+        maxHeight?: string;
+        flex?: number;
+        position?: PositionOptionType;
+        top?: string;
+        bottom?: string;
+        left?: string;
+        right?: string;
+        zIndex?: number;
         color?: string;
-        fontSize?: number;
+        fontSize?: string;
         fontWeight?: FontWeightOptionType;
     };
 }

package/dist/build-components/Carousel/CarouselProps.generated.d.ts

@@ -1,7 +1,50 @@
 import type { NodeData } from '../../types/Node';
+export type FlexDirectionOptionType = 'row' | 'column';
+export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+export type PositionOptionType = 'relative' | 'absolute';
+export type AlignOptionType = 'start' | 'center' | 'end';
 export interface CarouselPropsGenerated {
     child: string;
-    attributes: {};
+    attributes: {
+        style?: Record<string, unknown>;
+        scrollable?: boolean;
+        flexDirection?: FlexDirectionOptionType;
+        alignItems?: AlignItemsOptionType;
+        justifyContent?: JustifyContentOptionType;
+        gap?: string;
+        padding?: string;
+        paddingHorizontal?: string;
+        paddingVertical?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        margin?: string;
+        marginVertical?: string;
+        marginTop?: string;
+        marginBottom?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        backgroundColor?: string;
+        borderRadius?: string;
+        width?: string;
+        minWidth?: string;
+        maxWidth?: string;
+        height?: string;
+        minHeight?: string;
+        maxHeight?: string;
+        flex?: number;
+        position?: PositionOptionType;
+        top?: string;
+        bottom?: string;
+        left?: string;
+        right?: string;
+        zIndex?: number;
+        loop?: boolean;
+        dragFree?: boolean;
+        align?: AlignOptionType;
+    };
 }
 export interface CarouselComponentProps {
     node: NodeData<CarouselPropsGenerated['attributes']>;

package/dist/build-components/CarouselButtons/CarouselButtonsProps.generated.d.ts

@@ -1,8 +1,46 @@
 import type { NodeData } from '../../types/Node';
+export type FlexDirectionOptionType = 'row' | 'column';
+export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+export type PositionOptionType = 'relative' | 'absolute';
 export type ButtonTypeOptionType = 'previous_button' | 'next_button' | 'skip_button';
 export interface CarouselButtonsPropsGenerated {
     child: string;
     attributes: {
+        style?: Record<string, unknown>;
+        scrollable?: boolean;
+        flexDirection?: FlexDirectionOptionType;
+        alignItems?: AlignItemsOptionType;
+        justifyContent?: JustifyContentOptionType;
+        gap?: string;
+        padding?: string;
+        paddingHorizontal?: string;
+        paddingVertical?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        margin?: string;
+        marginVertical?: string;
+        marginTop?: string;
+        marginBottom?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        backgroundColor?: string;
+        borderRadius?: string;
+        width?: string;
+        minWidth?: string;
+        maxWidth?: string;
+        height?: string;
+        minHeight?: string;
+        maxHeight?: string;
+        flex?: number;
+        position?: PositionOptionType;
+        top?: string;
+        bottom?: string;
+        left?: string;
+        right?: string;
+        zIndex?: number;
         buttonType?: ButtonTypeOptionType;
         skipNumber?: number;
     };

package/dist/build-components/CarouselDots/CarouselDotsProps.generated.d.ts

@@ -1,8 +1,46 @@
 import type { NodeData } from '../../types/Node';
+export type FlexDirectionOptionType = 'row' | 'column';
+export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+export type PositionOptionType = 'relative' | 'absolute';
 export type DotTypeOptionType = 'expanding_dot' | 'normal_dot' | 'scaling_dot' | 'sliding_border' | 'sliding_dot' | 'liquid_like';
 export interface CarouselDotsPropsGenerated {
     child: string;
     attributes: {
+        style?: Record<string, unknown>;
+        scrollable?: boolean;
+        flexDirection?: FlexDirectionOptionType;
+        alignItems?: AlignItemsOptionType;
+        justifyContent?: JustifyContentOptionType;
+        gap?: string;
+        padding?: string;
+        paddingHorizontal?: string;
+        paddingVertical?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        margin?: string;
+        marginVertical?: string;
+        marginTop?: string;
+        marginBottom?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        backgroundColor?: string;
+        borderRadius?: string;
+        width?: string;
+        minWidth?: string;
+        maxWidth?: string;
+        height?: string;
+        minHeight?: string;
+        maxHeight?: string;
+        flex?: number;
+        position?: PositionOptionType;
+        top?: string;
+        bottom?: string;
+        left?: string;
+        right?: string;
+        zIndex?: number;
         dotType?: DotTypeOptionType;
     };
 }

package/dist/build-components/CarouselItem/CarouselItemProps.generated.d.ts

@@ -1,7 +1,46 @@
 import type { NodeData } from '../../types/Node';
+export type FlexDirectionOptionType = 'row' | 'column';
+export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+export type PositionOptionType = 'relative' | 'absolute';
 export interface CarouselItemPropsGenerated {
     child: string;
-    attributes: {};
+    attributes: {
+        style?: Record<string, unknown>;
+        scrollable?: boolean;
+        flexDirection?: FlexDirectionOptionType;
+        alignItems?: AlignItemsOptionType;
+        justifyContent?: JustifyContentOptionType;
+        gap?: string;
+        padding?: string;
+        paddingHorizontal?: string;
+        paddingVertical?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        margin?: string;
+        marginVertical?: string;
+        marginTop?: string;
+        marginBottom?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        backgroundColor?: string;
+        borderRadius?: string;
+        width?: string;
+        minWidth?: string;
+        maxWidth?: string;
+        height?: string;
+        minHeight?: string;
+        maxHeight?: string;
+        flex?: number;
+        position?: PositionOptionType;
+        top?: string;
+        bottom?: string;
+        left?: string;
+        right?: string;
+        zIndex?: number;
+    };
 }
 export interface CarouselItemComponentProps {
     node: NodeData<CarouselItemPropsGenerated['attributes']>;

package/dist/build-components/CarouselProvider/CarouselProviderProps.generated.d.ts

@@ -1,7 +1,46 @@
 import type { NodeData } from '../../types/Node';
+export type FlexDirectionOptionType = 'row' | 'column';
+export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+export type PositionOptionType = 'relative' | 'absolute';
 export interface CarouselProviderPropsGenerated {
     child: string;
-    attributes: {};
+    attributes: {
+        style?: Record<string, unknown>;
+        scrollable?: boolean;
+        flexDirection?: FlexDirectionOptionType;
+        alignItems?: AlignItemsOptionType;
+        justifyContent?: JustifyContentOptionType;
+        gap?: string;
+        padding?: string;
+        paddingHorizontal?: string;
+        paddingVertical?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        margin?: string;
+        marginVertical?: string;
+        marginTop?: string;
+        marginBottom?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        backgroundColor?: string;
+        borderRadius?: string;
+        width?: string;
+        minWidth?: string;
+        maxWidth?: string;
+        height?: string;
+        minHeight?: string;
+        maxHeight?: string;
+        flex?: number;
+        position?: PositionOptionType;
+        top?: string;
+        bottom?: string;
+        left?: string;
+        right?: string;
+        zIndex?: number;
+    };
 }
 export interface CarouselProviderComponentProps {
     node: NodeData<CarouselProviderPropsGenerated['attributes']>;

package/dist/build-components/Image/ImageProps.generated.d.ts

@@ -1,13 +1,48 @@
 import type { NodeData } from '../../types/Node';
+export type FlexDirectionOptionType = 'row' | 'column';
+export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+export type PositionOptionType = 'relative' | 'absolute';
 export type ResizeModeOptionType = 'cover' | 'contain' | 'stretch' | 'center';
 export interface ImagePropsGenerated {
     child: string;
     attributes: {
+        style?: Record<string, unknown>;
+        scrollable?: boolean;
+        flexDirection?: FlexDirectionOptionType;
+        alignItems?: AlignItemsOptionType;
+        justifyContent?: JustifyContentOptionType;
+        gap?: string;
+        padding?: string;
+        paddingHorizontal?: string;
+        paddingVertical?: string;
+        paddingTop?: string;
+        paddingBottom?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        margin?: string;
+        marginVertical?: string;
+        marginTop?: string;
+        marginBottom?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        backgroundColor?: string;
+        borderRadius?: string;
+        width?: string;
+        minWidth?: string;
+        maxWidth?: string;
+        height?: string;
+        minHeight?: string;
+        maxHeight?: string;
+        flex?: number;
+        position?: PositionOptionType;
+        top?: string;
+        bottom?: string;
+        left?: string;
+        right?: string;
+        zIndex?: number;
         src?: string;
-        width?: number;
-        height?: number;
         resizeMode?: ResizeModeOptionType;
-        borderRadius?: number;
     };
 }
 export interface ImageComponentProps {

package/dist/build-components/Main/Main.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { MainComponentProps } from './MainProps.generated';
+declare function Main({ node }: MainComponentProps): import("react/jsx-runtime").JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof Main>;
+export default _default;