@developer_tribe/react-builder 1.0.4 → 1.0.6

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/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/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,55 @@
+import type { NodeData } from '../../types/Node';
+export type FontWeightOptionType = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
+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: {
+        color?: string;
+        fontSize?: string;
+        fontWeight?: FontWeightOptionType;
+        textAlign?: TextAlignOptionType;
+        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/BackgroundImageProps.generated.d.ts

@@ -28,7 +28,11 @@ export interface BackgroundImagePropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

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

@@ -28,7 +28,11 @@ export interface ButtonPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

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

@@ -27,7 +27,11 @@ export interface CarouselPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

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

@@ -28,7 +28,11 @@ export interface CarouselButtonsPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

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

@@ -28,7 +28,11 @@ export interface CarouselDotsPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

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

@@ -27,7 +27,11 @@ export interface CarouselItemPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

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

@@ -27,7 +27,11 @@ export interface CarouselProviderPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

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

@@ -28,7 +28,11 @@ export interface ImagePropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

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;

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

@@ -0,0 +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 interface MainPropsGenerated {
+    child: string;
+    attributes: {
+        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;
+        useSafeAreaView?: boolean;
+        [key: string]: string | number | boolean | undefined;
+    };
+}
+export interface MainComponentProps {
+    node: NodeData<MainPropsGenerated['attributes']>;
+}

package/dist/build-components/Onboard/OnboardProps.generated.d.ts

@@ -27,7 +27,11 @@ export interface OnboardPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

package/dist/build-components/OnboardButton/OnboardButtonProps.generated.d.ts

@@ -36,7 +36,11 @@ export interface OnboardButtonPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

package/dist/build-components/OnboardButtons/OnboardButtonsProps.generated.d.ts

@@ -30,7 +30,11 @@ export interface OnboardButtonsPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

package/dist/build-components/OnboardDot/OnboardDotProps.generated.d.ts

@@ -25,7 +25,11 @@ export interface OnboardDotPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

package/dist/build-components/OnboardFooter/OnboardFooterProps.generated.d.ts

@@ -33,7 +33,11 @@ export interface OnboardFooterPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

package/dist/build-components/OnboardImage/OnboardImageProps.generated.d.ts

@@ -31,6 +31,10 @@ export interface OnboardImagePropsGenerated {
         marginRight?: string;
         backgroundColor?: string;
         borderRadius?: string;
+        minWidth?: string;
+        maxWidth?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

package/dist/build-components/OnboardItem/OnboardItemProps.generated.d.ts

@@ -28,7 +28,11 @@ export interface OnboardItemPropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

package/dist/build-components/OnboardProvider/OnboardProviderProps.generated.d.ts

@@ -27,7 +27,11 @@ export interface OnboardProviderPropsGenerated {
         backgroundColor?: string;
         borderRadius?: never;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;
@@ -35,7 +39,6 @@ export interface OnboardProviderPropsGenerated {
         left?: string;
         right?: string;
         zIndex?: number;
-        use_safe_area_inset?: boolean;
     };
 }
 export interface OnboardProviderComponentProps {

package/dist/build-components/OnboardSubtitle/OnboardSubtitleProps.generated.d.ts

@@ -33,7 +33,11 @@ export interface OnboardSubtitlePropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

package/dist/build-components/OnboardTitle/OnboardTitleProps.generated.d.ts

@@ -33,7 +33,11 @@ export interface OnboardTitlePropsGenerated {
         backgroundColor?: string;
         borderRadius?: string;
         width?: string;
+        minWidth?: string;
+        maxWidth?: string;
         height?: string;
+        minHeight?: string;
+        maxHeight?: string;
         flex?: number;
         position?: PositionOptionType;
         top?: string;

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

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

package/dist/build-components/PaywallBackground/PaywallBackgroundProps.generated.d.ts

@@ -0,0 +1,47 @@
+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 PaywallBackgroundPropsGenerated {
+    child: string;
+    attributes: {
+        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;
+        [key: string]: string | number | boolean | undefined;
+    };
+}
+export interface PaywallBackgroundComponentProps {
+    node: NodeData<PaywallBackgroundPropsGenerated['attributes']>;
+}

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

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

package/dist/build-components/PaywallCloseButton/PaywallCloseButtonProps.generated.d.ts

@@ -0,0 +1,56 @@
+import type { NodeData } from '../../types/Node';
+export type FontWeightOptionType = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
+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 PaywallCloseButtonPropsGenerated {
+    child: string;
+    attributes: {
+        iconType?: string;
+        size?: number;
+        strokeWidth?: number;
+        color?: string;
+        fontSize?: string;
+        fontWeight?: FontWeightOptionType;
+        textAlign?: TextAlignOptionType;
+        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;
+        [key: string]: string | number | boolean | undefined;
+    };
+}
+export interface PaywallCloseButtonComponentProps {
+    node: NodeData<PaywallCloseButtonPropsGenerated['attributes']>;
+}

package/dist/build-components/PaywallOptions/PaywallOptionButton.d.ts

@@ -0,0 +1,9 @@
+import type { Product } from '../../paywall/types/paywall-types';
+import type { NodeData } from '../../types/Node';
+export type OptionsButtonProps = {
+    product: Product;
+    selected: boolean;
+    onPress: (productId: string) => void;
+    node: NodeData<any>;
+};
+export declare function PaywallOptionButton({ product, selected, onPress, node, }: OptionsButtonProps): import("react/jsx-runtime").JSX.Element;

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

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

package/dist/build-components/PaywallOptions/PaywallOptionsProps.generated.d.ts

@@ -0,0 +1,47 @@
+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 PaywallOptionsPropsGenerated {
+    child: string;
+    attributes: {
+        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;
+        [key: string]: string | number | boolean | undefined;
+    };
+}
+export interface PaywallOptionsComponentProps {
+    node: NodeData<PaywallOptionsPropsGenerated['attributes']>;
+}

package/dist/build-components/PaywallOptions/usePaywallOptionParamsFactory.d.ts

@@ -0,0 +1,10 @@
+import type { Product } from '../../paywall/types/paywall-types';
+import { LocalizationParams, OtherParams } from '../../components/ParamsProvider';
+type PaywallOptionParams = {
+    localizationParams: LocalizationParams;
+    otherParams: OtherParams;
+};
+export declare function usePaywallOptionParamsFactory(): (p: Product, { isSelected }: {
+    isSelected: boolean;
+}) => PaywallOptionParams;
+export {};

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

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

package/dist/build-components/PaywallProvider/PaywallProviderProps.generated.d.ts

@@ -0,0 +1,47 @@
+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 PaywallProviderPropsGenerated {
+    child: string;
+    attributes: {
+        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;
+        [key: string]: string | number | boolean | undefined;
+    };
+}
+export interface PaywallProviderComponentProps {
+    node: NodeData<PaywallProviderPropsGenerated['attributes']>;
+}

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

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