@developer_tribe/react-builder 0.1.24 → 0.1.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/DeviceMockFrame.d.ts +22 -0
- package/dist/RenderPage.d.ts +6 -3
- package/dist/build-components/OnboardProvider/OnboardProviderProps.generated.d.ts +4 -1
- package/dist/build-components/useNode.d.ts +2 -0
- package/dist/index.cjs.js +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.esm.js +1 -1
- package/dist/types/Device.d.ts +18 -2
- package/dist/types/Node.d.ts +2 -1
- package/dist/utils/patterns.d.ts +4 -0
- package/package.json +1 -1
- package/scripts/prebuild/build-components.js +4 -4
- package/scripts/prebuild/utils/createBuildComponentsRootGetDefaults.js +2 -47
- package/scripts/prebuild/utils/createGetDefaultsPerComponent.js +2 -19
- package/scripts/prebuild/utils/createRootGetDefaults.js +2 -44
- package/scripts/prebuild/utils/validateAllComponentsOrThrow.js +3 -2
- package/src/AttributesEditor.tsx +19 -15
- package/src/DeviceMockFrame.tsx +119 -0
- package/src/RenderPage.tsx +19 -27
- package/src/assets/devices.json +364 -91
- package/src/build-components/Button/Button.tsx +2 -0
- package/src/build-components/Carousel/Carousel.tsx +2 -0
- package/src/build-components/CarouselButtons/CarouselButtons.tsx +2 -0
- package/src/build-components/CarouselDots/CarouselDots.tsx +2 -0
- package/src/build-components/CarouselItem/CarouselItem.tsx +2 -0
- package/src/build-components/CarouselProvider/CarouselProvider.tsx +2 -0
- package/src/build-components/Image/Image.tsx +2 -0
- package/src/build-components/Onboard/Onboard.tsx +2 -0
- package/src/build-components/OnboardButton/OnboardButton.tsx +2 -0
- package/src/build-components/OnboardButtons/OnboardButtons.tsx +2 -0
- package/src/build-components/OnboardDot/OnboardDot.tsx +2 -0
- package/src/build-components/OnboardFooter/OnboardFooter.tsx +2 -0
- package/src/build-components/OnboardImage/OnboardImage.tsx +2 -0
- package/src/build-components/OnboardItem/OnboardItem.tsx +2 -0
- package/src/build-components/OnboardProvider/OnboardProvider.tsx +13 -1
- package/src/build-components/OnboardProvider/OnboardProviderProps.generated.ts +4 -1
- package/src/build-components/OnboardProvider/pattern.json +4 -1
- package/src/build-components/OnboardSubtitle/OnboardSubtitle.tsx +2 -0
- package/src/build-components/OnboardSubtitle/pattern.json +1 -1
- package/src/build-components/OnboardTitle/OnboardTitle.tsx +2 -0
- package/src/build-components/OnboardTitle/pattern.json +1 -1
- package/src/build-components/Text/Text.tsx +2 -0
- package/src/build-components/View/View.tsx +2 -0
- package/src/build-components/useNode.ts +15 -0
- package/src/index.ts +2 -0
- package/src/types/Device.ts +23 -2
- package/src/types/Node.ts +2 -11
- package/src/utils/getDevices.ts +7 -1
- package/src/utils/novaToJson.ts +7 -0
- package/src/utils/patterns.ts +11 -0
- package/dist/build-components/Button/getDefaults.d.ts +0 -3
- package/dist/build-components/Carousel/getDefaults.d.ts +0 -3
- package/dist/build-components/CarouselButtons/getDefaults.d.ts +0 -3
- package/dist/build-components/CarouselDots/getDefaults.d.ts +0 -3
- package/dist/build-components/CarouselItem/getDefaults.d.ts +0 -3
- package/dist/build-components/CarouselProvider/getDefaults.d.ts +0 -3
- package/dist/build-components/Image/getDefaults.d.ts +0 -3
- package/dist/build-components/Onboard/getDefaults.d.ts +0 -3
- package/dist/build-components/OnboardButton/getDefaults.d.ts +0 -3
- package/dist/build-components/OnboardButtons/getDefaults.d.ts +0 -3
- package/dist/build-components/OnboardDot/getDefaults.d.ts +0 -3
- package/dist/build-components/OnboardFooter/getDefaults.d.ts +0 -3
- package/dist/build-components/OnboardImage/getDefaults.d.ts +0 -3
- package/dist/build-components/OnboardItem/getDefaults.d.ts +0 -3
- package/dist/build-components/OnboardProvider/getDefaults.d.ts +0 -3
- package/dist/build-components/OnboardSubtitle/getDefaults.d.ts +0 -3
- package/dist/build-components/OnboardTitle/getDefaults.d.ts +0 -3
- package/dist/build-components/Text/getDefaults.d.ts +0 -3
- package/dist/build-components/View/getDefaults.d.ts +0 -3
- package/dist/build-components/getDefaults.d.ts +0 -25
- package/src/build-components/Button/getDefaults.ts +0 -11
- package/src/build-components/Carousel/getDefaults.ts +0 -11
- package/src/build-components/CarouselButtons/getDefaults.ts +0 -13
- package/src/build-components/CarouselDots/getDefaults.ts +0 -13
- package/src/build-components/CarouselItem/getDefaults.ts +0 -13
- package/src/build-components/CarouselProvider/getDefaults.ts +0 -13
- package/src/build-components/Image/getDefaults.ts +0 -11
- package/src/build-components/Onboard/getDefaults.ts +0 -11
- package/src/build-components/OnboardButton/getDefaults.ts +0 -13
- package/src/build-components/OnboardButtons/getDefaults.ts +0 -13
- package/src/build-components/OnboardDot/getDefaults.ts +0 -13
- package/src/build-components/OnboardFooter/getDefaults.ts +0 -13
- package/src/build-components/OnboardImage/getDefaults.ts +0 -13
- package/src/build-components/OnboardItem/getDefaults.ts +0 -13
- package/src/build-components/OnboardProvider/getDefaults.ts +0 -13
- package/src/build-components/OnboardSubtitle/getDefaults.ts +0 -13
- package/src/build-components/OnboardTitle/getDefaults.ts +0 -13
- package/src/build-components/Text/getDefaults.ts +0 -11
- package/src/build-components/View/getDefaults.ts +0 -11
- package/src/build-components/getDefaults.ts +0 -115
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { ButtonComponentProps } from './ButtonProps.generated';
|
|
3
|
+
import useDefaults from '../useNode';
|
|
3
4
|
|
|
4
5
|
function Button({ node }: ButtonComponentProps) {
|
|
6
|
+
node = useDefaults(node);
|
|
5
7
|
return String(node?.type ?? 'button');
|
|
6
8
|
}
|
|
7
9
|
|
|
@@ -2,8 +2,10 @@ import React from 'react';
|
|
|
2
2
|
import type { CarouselComponentProps } from './CarouselProps.generated';
|
|
3
3
|
import RenderNode from '../RenderNode.generated';
|
|
4
4
|
import { isCarouselItem } from '../../utils/isCarousel';
|
|
5
|
+
import useDefaults from '../useNode';
|
|
5
6
|
|
|
6
7
|
function Carousel({ node }: CarouselComponentProps) {
|
|
8
|
+
node = useDefaults(node);
|
|
7
9
|
// Ensure children are carouselItems
|
|
8
10
|
const renderChildren = () => {
|
|
9
11
|
if (Array.isArray(node.children)) {
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React, { useContext } from 'react';
|
|
2
2
|
import type { CarouselButtonsComponentProps } from './CarouselButtonsProps.generated';
|
|
3
3
|
import { carouselContext } from '../CarouselProvider/CarouselProvider';
|
|
4
|
+
import useDefaults from '../useNode';
|
|
4
5
|
|
|
5
6
|
function CarouselButtons({ node }: CarouselButtonsComponentProps) {
|
|
7
|
+
node = useDefaults(node);
|
|
6
8
|
const emblaApi = useContext(carouselContext);
|
|
7
9
|
const buttonTypes = node.attributes?.buttonType || [
|
|
8
10
|
'previous_button',
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React, { useContext, useEffect, useState } from 'react';
|
|
2
2
|
import type { CarouselDotsComponentProps } from './CarouselDotsProps.generated';
|
|
3
3
|
import { carouselContext } from '../CarouselProvider/CarouselProvider';
|
|
4
|
+
import useDefaults from '../useNode';
|
|
4
5
|
|
|
5
6
|
function CarouselDots({ node }: CarouselDotsComponentProps) {
|
|
7
|
+
node = useDefaults(node);
|
|
6
8
|
const dotType = node.attributes?.dotType || 'normal_dot';
|
|
7
9
|
const emblaApi = useContext(carouselContext);
|
|
8
10
|
const [selectedIndex, setSelectedIndex] = useState(0);
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { CarouselItemComponentProps } from './CarouselItemProps.generated';
|
|
3
3
|
import { RenderNode } from '../..';
|
|
4
|
+
import useDefaults from '../useNode';
|
|
4
5
|
|
|
5
6
|
export function CarouselItem({ node }: CarouselItemComponentProps) {
|
|
7
|
+
node = useDefaults(node);
|
|
6
8
|
return (
|
|
7
9
|
<div className="embla__slide" {...node.attributes}>
|
|
8
10
|
{node.children && <RenderNode node={node.children} />}
|
|
@@ -2,9 +2,11 @@ import React, { createContext } from 'react';
|
|
|
2
2
|
import type { CarouselProviderComponentProps } from './CarouselProviderProps.generated';
|
|
3
3
|
import { RenderNode } from '../..';
|
|
4
4
|
import useEmblaCarousel from 'embla-carousel-react';
|
|
5
|
+
import useDefaults from '../useNode';
|
|
5
6
|
|
|
6
7
|
export const carouselContext = createContext<any>(undefined);
|
|
7
8
|
function CarouselProvider({ node }: CarouselProviderComponentProps) {
|
|
9
|
+
node = useDefaults(node);
|
|
8
10
|
const [emblaRef, emblaApi] = useEmblaCarousel(node.attributes as any);
|
|
9
11
|
return (
|
|
10
12
|
<carouselContext.Provider value={emblaApi}>
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { OnboardComponentProps } from './OnboardProps.generated';
|
|
3
3
|
import Carousel from '../Carousel/Carousel';
|
|
4
|
+
import useDefaults from '../useNode';
|
|
4
5
|
|
|
5
6
|
function Onboard({ node }: OnboardComponentProps) {
|
|
7
|
+
node = useDefaults(node);
|
|
6
8
|
return <Carousel node={{ ...node, type: 'carousel' } as any} />;
|
|
7
9
|
}
|
|
8
10
|
|
|
@@ -2,8 +2,10 @@ import React, { useContext } from 'react';
|
|
|
2
2
|
import type { OnboardButtonComponentProps } from './OnboardButtonProps.generated';
|
|
3
3
|
import { onboardContext } from '../OnboardProvider/OnboardProvider';
|
|
4
4
|
import { mainNodeContext } from '../../RenderMainNode';
|
|
5
|
+
import useDefaults from '../useNode';
|
|
5
6
|
|
|
6
7
|
function OnboardButton({ node }: OnboardButtonComponentProps) {
|
|
8
|
+
node = useDefaults(node);
|
|
7
9
|
const { emblaApi } = useContext(onboardContext) ?? {};
|
|
8
10
|
const { localication, defaultLanguage } = useContext(mainNodeContext) ?? {};
|
|
9
11
|
|
|
@@ -3,12 +3,14 @@ import type { Node } from '../../types/Node';
|
|
|
3
3
|
import type { OnboardButtonsComponentProps } from './OnboardButtonsProps.generated';
|
|
4
4
|
import { onboardContext } from '../OnboardProvider/OnboardProvider';
|
|
5
5
|
import RenderNode from '../RenderNode.generated';
|
|
6
|
+
import useDefaults from '../useNode';
|
|
6
7
|
|
|
7
8
|
const THEME_COLORS = {
|
|
8
9
|
ONBOARD_SEPARATOR_COLOR: '#E5E7EB',
|
|
9
10
|
};
|
|
10
11
|
|
|
11
12
|
function OnboardButtons({ node }: OnboardButtonsComponentProps) {
|
|
13
|
+
node = useDefaults(node);
|
|
12
14
|
const ctx = useContext(onboardContext) ?? {};
|
|
13
15
|
const emblaApi = ctx.emblaApi;
|
|
14
16
|
const [selectedIndex, setSelectedIndex] = useState(ctx.selectedIndex ?? 0);
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { OnboardDotComponentProps } from './OnboardExpandingDotProps.generated';
|
|
3
3
|
import CarouselDots from '../CarouselDots/CarouselDots';
|
|
4
|
+
import useDefaults from '../useNode';
|
|
4
5
|
|
|
5
6
|
function OnboardDot({ node }: OnboardDotComponentProps) {
|
|
7
|
+
node = useDefaults(node);
|
|
6
8
|
return <CarouselDots node={{ ...node, type: 'carouselDots' } as any} />;
|
|
7
9
|
}
|
|
8
10
|
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React, { useContext } from 'react';
|
|
2
2
|
import type { OnboardFooterComponentProps } from './OnboardFooterProps.generated';
|
|
3
3
|
import { mainNodeContext } from '../../RenderMainNode';
|
|
4
|
+
import useDefaults from '../useNode';
|
|
4
5
|
|
|
5
6
|
type Segment =
|
|
6
7
|
| { type: 'text'; value: string }
|
|
@@ -83,6 +84,7 @@ function buildSegments(
|
|
|
83
84
|
}
|
|
84
85
|
|
|
85
86
|
function OnboardFooter({ node }: OnboardFooterComponentProps) {
|
|
87
|
+
node = useDefaults(node);
|
|
86
88
|
const { localication, defaultLanguage, setWarning } =
|
|
87
89
|
useContext(mainNodeContext) ?? {};
|
|
88
90
|
const t = (key?: string) =>
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { OnboardImageComponentProps } from './OnboardImageProps.generated';
|
|
3
3
|
import Image from '../Image/Image';
|
|
4
|
+
import useDefaults from '../useNode';
|
|
4
5
|
|
|
5
6
|
function OnboardImage({ node }: OnboardImageComponentProps) {
|
|
7
|
+
node = useDefaults(node);
|
|
6
8
|
return <Image node={{ ...node, type: 'image' } as any} />;
|
|
7
9
|
}
|
|
8
10
|
|
|
@@ -3,8 +3,10 @@ import type { NodeData } from '../../types/Node';
|
|
|
3
3
|
import type { OnboardItemComponentProps } from './OnboardItemProps.generated';
|
|
4
4
|
import CarouselItem from '../CarouselItem/CarouselItem';
|
|
5
5
|
import { isNodeArray } from '../../utils/analyseNode';
|
|
6
|
+
import useDefaults from '../useNode';
|
|
6
7
|
|
|
7
8
|
function OnboardItem({ node }: OnboardItemComponentProps) {
|
|
9
|
+
node = useDefaults(node);
|
|
8
10
|
const children = useMemo(() => {
|
|
9
11
|
return (
|
|
10
12
|
(
|
|
@@ -10,9 +10,13 @@ import type { OnboardProviderComponentProps } from './OnboardProviderProps.gener
|
|
|
10
10
|
import { mainNodeContext } from '../../RenderMainNode';
|
|
11
11
|
import useEmblaCarousel from 'embla-carousel-react';
|
|
12
12
|
import RenderNode from '../RenderNode.generated';
|
|
13
|
+
import { renderPageContext } from '../../RenderPage';
|
|
14
|
+
import useDefaults from '../useNode';
|
|
13
15
|
|
|
14
16
|
export const onboardContext = createContext<any>(undefined);
|
|
15
17
|
function OnboardProvider({ node }: OnboardProviderComponentProps) {
|
|
18
|
+
node = useDefaults(node);
|
|
19
|
+
const { device } = useContext(renderPageContext) ?? {};
|
|
16
20
|
const [emblaRef, emblaApi] = useEmblaCarousel(node.attributes as any);
|
|
17
21
|
const { theme, setWarning } = useContext(mainNodeContext) ?? {};
|
|
18
22
|
const [selectedIndex, setSelectedIndex] = useState(0);
|
|
@@ -49,7 +53,15 @@ function OnboardProvider({ node }: OnboardProviderComponentProps) {
|
|
|
49
53
|
|
|
50
54
|
return (
|
|
51
55
|
<onboardContext.Provider value={{ emblaApi, selectedIndex }}>
|
|
52
|
-
<div
|
|
56
|
+
<div
|
|
57
|
+
className="carousel-provider"
|
|
58
|
+
style={{
|
|
59
|
+
paddingTop: device?.insets?.[0],
|
|
60
|
+
paddingRight: device?.insets?.[1],
|
|
61
|
+
paddingBottom: device?.insets?.[2],
|
|
62
|
+
paddingLeft: device?.insets?.[3],
|
|
63
|
+
}}
|
|
64
|
+
>
|
|
53
65
|
<div className="embla">
|
|
54
66
|
<div className="embla__viewport" ref={emblaRef}>
|
|
55
67
|
{node.children && <RenderNode node={children} />}
|
|
@@ -4,7 +4,10 @@ import type { NodeData } from '../../types/Node';
|
|
|
4
4
|
|
|
5
5
|
export interface OnboardProviderPropsGenerated {
|
|
6
6
|
child: string;
|
|
7
|
-
attributes: {
|
|
7
|
+
attributes: {
|
|
8
|
+
theme?: string;
|
|
9
|
+
use_safe_area_inset?: boolean;
|
|
10
|
+
};
|
|
8
11
|
}
|
|
9
12
|
|
|
10
13
|
export interface OnboardProviderComponentProps {
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { OnboardSubtitleComponentProps } from './OnboardSubtitleProps.generated';
|
|
3
3
|
import Text from '../Text/Text';
|
|
4
|
+
import useDefaults from '../useNode';
|
|
4
5
|
|
|
5
6
|
function OnboardSubtitle({ node }: OnboardSubtitleComponentProps) {
|
|
7
|
+
node = useDefaults(node);
|
|
6
8
|
return (
|
|
7
9
|
<Text
|
|
8
10
|
node={
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { OnboardTitleComponentProps } from './OnboardTitleProps.generated';
|
|
3
3
|
import Text from '../Text/Text';
|
|
4
|
+
import useDefaults from '../useNode';
|
|
4
5
|
|
|
5
6
|
function OnboardTitle({ node }: OnboardTitleComponentProps) {
|
|
7
|
+
node = useDefaults(node);
|
|
6
8
|
return (
|
|
7
9
|
<Text
|
|
8
10
|
node={
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React, { useContext } from 'react';
|
|
2
2
|
import type { TextComponentProps } from './TextProps.generated';
|
|
3
3
|
import { mainNodeContext } from '../../RenderMainNode';
|
|
4
|
+
import useDefaults from '../useNode';
|
|
4
5
|
|
|
5
6
|
function Text({ node }: TextComponentProps) {
|
|
7
|
+
node = useDefaults(node);
|
|
6
8
|
const { localication, defaultLanguage } = useContext(mainNodeContext) ?? {};
|
|
7
9
|
const keyOrText: string = node.children as string;
|
|
8
10
|
return (
|
|
@@ -5,6 +5,7 @@ import type {
|
|
|
5
5
|
} from './ViewProps.generated';
|
|
6
6
|
import RenderNode from '../RenderNode.generated';
|
|
7
7
|
import { Node } from '../../types/Node';
|
|
8
|
+
import useDefaults from '../useNode';
|
|
8
9
|
|
|
9
10
|
function mapAttributesToStyle(
|
|
10
11
|
attributes: ViewPropsGenerated['attributes'],
|
|
@@ -48,6 +49,7 @@ function mapAttributesToStyle(
|
|
|
48
49
|
}
|
|
49
50
|
|
|
50
51
|
export function View({ node }: ViewComponentProps) {
|
|
52
|
+
node = useDefaults(node);
|
|
51
53
|
return (
|
|
52
54
|
<div
|
|
53
55
|
style={mapAttributesToStyle(node.attributes ?? {})}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { NodeData, NodeDefaultAttribute } from '../types/Node';
|
|
2
|
+
import { getDefaultsForType } from '../utils/patterns';
|
|
3
|
+
|
|
4
|
+
export default function useNode<
|
|
5
|
+
T extends NodeDefaultAttribute = NodeDefaultAttribute,
|
|
6
|
+
>(node: NodeData<T>): NodeData<T> {
|
|
7
|
+
const type = node?.type;
|
|
8
|
+
const defaults = getDefaultsForType(type) as Partial<T> | undefined;
|
|
9
|
+
if (!defaults) return node;
|
|
10
|
+
const mergedAttributes: T = {
|
|
11
|
+
...(defaults as T),
|
|
12
|
+
...((node.attributes as T) ?? ({} as T)),
|
|
13
|
+
};
|
|
14
|
+
return { ...node, attributes: mergedAttributes };
|
|
15
|
+
}
|
package/src/index.ts
CHANGED
|
@@ -17,9 +17,11 @@ export { getOnboardSamples } from './assets/samples/getSamples';
|
|
|
17
17
|
export { PreviewConfig } from './types/PreviewConfig';
|
|
18
18
|
export { RenderPage } from './RenderPage';
|
|
19
19
|
export { RenderMainNode } from './RenderMainNode';
|
|
20
|
+
export { DeviceMockFrame } from './DeviceMockFrame';
|
|
20
21
|
export { novaToJson } from './utils/novaToJson';
|
|
21
22
|
export type { Localication } from './types/PreviewConfig';
|
|
22
23
|
export { getDevices } from './utils/getDevices';
|
|
23
24
|
export type { Device } from './types/Device';
|
|
24
25
|
export { AttributesEditor };
|
|
25
26
|
export * from './build-components/index';
|
|
27
|
+
export { default as useNode } from './build-components/useNode';
|
package/src/types/Device.ts
CHANGED
|
@@ -4,9 +4,30 @@ export interface Device {
|
|
|
4
4
|
width: number;
|
|
5
5
|
height: number;
|
|
6
6
|
type: 'phone' | 'tablet';
|
|
7
|
+
/**
|
|
8
|
+
* Optional physical corner radius of the device screen area in CSS pixels.
|
|
9
|
+
* Used only for visual preview rounding; has no effect on layout calculations.
|
|
10
|
+
*/
|
|
11
|
+
radius?: number;
|
|
12
|
+
/**
|
|
13
|
+
* Insets in CSS pixels in the order: [top, right, bottom, left]
|
|
14
|
+
* Represents safe area or system UI overlaps (status bar, home indicator, etc.).
|
|
15
|
+
*/
|
|
16
|
+
insets?: [number, number, number, number];
|
|
17
|
+
/**
|
|
18
|
+
* Navigation bar style depending on platform.
|
|
19
|
+
* - iOS: 'none' | 'homeIndicator' | 'tabBar' (visual reference only)
|
|
20
|
+
* - Android: 'threeButtons' | 'gesture' | 'none'
|
|
21
|
+
*/
|
|
22
|
+
navigationBarType?:
|
|
23
|
+
| 'none'
|
|
24
|
+
| 'homeIndicator' // iOS
|
|
25
|
+
| 'tabBar' // iOS (for previewing tab bar overlap if desired)
|
|
26
|
+
| 'threeButtons' // Android classic nav bar
|
|
27
|
+
| 'gesture'; // Android gesture navigation
|
|
7
28
|
/**
|
|
8
29
|
* Relative importance for generic targeting and display ordering.
|
|
9
|
-
* 1 = highest importance,
|
|
30
|
+
* 1 = highest importance, 100 = lowest importance
|
|
10
31
|
*/
|
|
11
|
-
importance?:
|
|
32
|
+
importance?: number;
|
|
12
33
|
}
|
package/src/types/Node.ts
CHANGED
|
@@ -1,14 +1,4 @@
|
|
|
1
|
-
export type NodeDefaultAttribute = Record<
|
|
2
|
-
string,
|
|
3
|
-
| boolean
|
|
4
|
-
| string
|
|
5
|
-
| number
|
|
6
|
-
| null
|
|
7
|
-
| undefined
|
|
8
|
-
| string[]
|
|
9
|
-
| Record<string, unknown>
|
|
10
|
-
| Array<Record<string, unknown>>
|
|
11
|
-
>;
|
|
1
|
+
export type NodeDefaultAttribute = Record<string, unknown>;
|
|
12
2
|
|
|
13
3
|
export type Node<T = NodeDefaultAttribute> =
|
|
14
4
|
| null
|
|
@@ -23,4 +13,5 @@ export interface NodeData<T = Record<string, unknown>> {
|
|
|
23
13
|
children: Node<Record<string, unknown>>;
|
|
24
14
|
attributes?: T;
|
|
25
15
|
key?: string;
|
|
16
|
+
isMain?: boolean;
|
|
26
17
|
}
|
package/src/utils/getDevices.ts
CHANGED
|
@@ -2,5 +2,11 @@ import { Device } from '../types/Device';
|
|
|
2
2
|
import devices from '../assets/devices.json';
|
|
3
3
|
|
|
4
4
|
export function getDevices(): Device[] {
|
|
5
|
-
|
|
5
|
+
const deviceList = (devices as Device[]).slice();
|
|
6
|
+
deviceList.sort((a, b) => {
|
|
7
|
+
const ai = a.importance ?? 999;
|
|
8
|
+
const bi = b.importance ?? 999;
|
|
9
|
+
return ai - bi;
|
|
10
|
+
});
|
|
11
|
+
return deviceList;
|
|
6
12
|
}
|
package/src/utils/novaToJson.ts
CHANGED
|
@@ -26,6 +26,8 @@ function onboardNovaToJson(nova: ProjectBase<unknown>): Node {
|
|
|
26
26
|
|
|
27
27
|
const providerNode: NodeData = {
|
|
28
28
|
type: 'OnboardProvider',
|
|
29
|
+
isMain: true,
|
|
30
|
+
key: (nova?.data as any)?.data?.key,
|
|
29
31
|
children: [
|
|
30
32
|
carouselNode,
|
|
31
33
|
// Place dots above buttons in visual order
|
|
@@ -35,6 +37,11 @@ function onboardNovaToJson(nova: ProjectBase<unknown>): Node {
|
|
|
35
37
|
],
|
|
36
38
|
attributes: {
|
|
37
39
|
theme: (nova?.data as any)?.theme,
|
|
40
|
+
// forward safe area inset preference; default to true when absent
|
|
41
|
+
use_safe_area_inset:
|
|
42
|
+
(attributes as any)?.use_safe_area_inset !== undefined
|
|
43
|
+
? (attributes as any)?.use_safe_area_inset
|
|
44
|
+
: true,
|
|
38
45
|
},
|
|
39
46
|
};
|
|
40
47
|
|
package/src/utils/patterns.ts
CHANGED
|
@@ -17,6 +17,7 @@ import OnboardTitlePattern from '../build-components/OnboardTitle/pattern.json';
|
|
|
17
17
|
import onboardSubtitlePattern from '../build-components/OnboardSubtitle/pattern.json';
|
|
18
18
|
import onboardFooterPattern from '../build-components/OnboardFooter/pattern.json';
|
|
19
19
|
import onboardExpandingDotPattern from '../build-components/OnboardDot/pattern.json';
|
|
20
|
+
import type { NodeDefaultAttribute } from '../types/Node';
|
|
20
21
|
|
|
21
22
|
type Pattern = {
|
|
22
23
|
schemaVersion: number;
|
|
@@ -30,6 +31,8 @@ type Pattern = {
|
|
|
30
31
|
// Each entry maps a type name (e.g., "EventObject") to its field schema
|
|
31
32
|
// where the inner record maps fieldName -> primitive type or enum options
|
|
32
33
|
types?: Record<string, Record<string, string | string[]>>;
|
|
34
|
+
// Optional defaults to be applied to node.attributes if not provided
|
|
35
|
+
defaults?: NodeDefaultAttribute;
|
|
33
36
|
};
|
|
34
37
|
|
|
35
38
|
const patterns: Pattern[] = [
|
|
@@ -66,6 +69,14 @@ export function getAttributeSchema(
|
|
|
66
69
|
return p?.pattern.attributes;
|
|
67
70
|
}
|
|
68
71
|
|
|
72
|
+
/** Returns defaults block (if any) for a given component type */
|
|
73
|
+
export function getDefaultsForType(
|
|
74
|
+
type?: string | null,
|
|
75
|
+
): NodeDefaultAttribute | undefined {
|
|
76
|
+
const p = getPatternByType(type);
|
|
77
|
+
return p?.defaults as NodeDefaultAttribute | undefined;
|
|
78
|
+
}
|
|
79
|
+
|
|
69
80
|
/**
|
|
70
81
|
* Returns the schema of a custom complex type declared under a component pattern's `types` block.
|
|
71
82
|
* For example, OnboardButton.pattern.types.EventObject
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import type { ButtonPropsGenerated, CarouselPropsGenerated, CarouselButtonsPropsGenerated, CarouselDotsPropsGenerated, CarouselItemPropsGenerated, CarouselProviderPropsGenerated, ImagePropsGenerated, OnboardPropsGenerated, OnboardButtonPropsGenerated, OnboardButtonsPropsGenerated, OnboardDotPropsGenerated, OnboardFooterPropsGenerated, OnboardImagePropsGenerated, OnboardItemPropsGenerated, OnboardProviderPropsGenerated, OnboardSubtitlePropsGenerated, OnboardTitlePropsGenerated, TextPropsGenerated, ViewPropsGenerated } from './index';
|
|
2
|
-
import type { NodeData } from '../types/Node';
|
|
3
|
-
export type Types = {
|
|
4
|
-
button: ButtonPropsGenerated['attributes'];
|
|
5
|
-
carousel: CarouselPropsGenerated['attributes'];
|
|
6
|
-
carouselButtons: CarouselButtonsPropsGenerated['attributes'];
|
|
7
|
-
carouselDots: CarouselDotsPropsGenerated['attributes'];
|
|
8
|
-
carouselItem: CarouselItemPropsGenerated['attributes'];
|
|
9
|
-
carouselProvider: CarouselProviderPropsGenerated['attributes'];
|
|
10
|
-
image: ImagePropsGenerated['attributes'];
|
|
11
|
-
Onboard: OnboardPropsGenerated['attributes'];
|
|
12
|
-
OnboardButton: OnboardButtonPropsGenerated['attributes'];
|
|
13
|
-
OnboardButtons: OnboardButtonsPropsGenerated['attributes'];
|
|
14
|
-
OnboardDot: OnboardDotPropsGenerated['attributes'];
|
|
15
|
-
OnboardFooter: OnboardFooterPropsGenerated['attributes'];
|
|
16
|
-
OnboardImage: OnboardImagePropsGenerated['attributes'];
|
|
17
|
-
OnboardItem: OnboardItemPropsGenerated['attributes'];
|
|
18
|
-
OnboardProvider: OnboardProviderPropsGenerated['attributes'];
|
|
19
|
-
OnboardSubtitle: OnboardSubtitlePropsGenerated['attributes'];
|
|
20
|
-
OnboardTitle: OnboardTitlePropsGenerated['attributes'];
|
|
21
|
-
text: TextPropsGenerated['attributes'];
|
|
22
|
-
view: ViewPropsGenerated['attributes'];
|
|
23
|
-
};
|
|
24
|
-
export type List<T> = T extends keyof Types ? Types[T] : never;
|
|
25
|
-
export declare function getDefaults<T extends keyof Types>(type: T, _node: NodeData<List<T>>): Partial<Types[T]>;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
/* AUTO-GENERATED FILE - DO NOT EDIT */
|
|
2
|
-
|
|
3
|
-
import pattern from './pattern.json';
|
|
4
|
-
import type { ButtonPropsGenerated } from './ButtonProps.generated';
|
|
5
|
-
|
|
6
|
-
export type ButtonDefaults = Partial<ButtonPropsGenerated['attributes']>;
|
|
7
|
-
|
|
8
|
-
export function getDefaults(): ButtonDefaults {
|
|
9
|
-
return ((pattern as unknown as { default?: unknown })?.default ??
|
|
10
|
-
{}) as ButtonDefaults;
|
|
11
|
-
}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
/* AUTO-GENERATED FILE - DO NOT EDIT */
|
|
2
|
-
|
|
3
|
-
import pattern from './pattern.json';
|
|
4
|
-
import type { CarouselPropsGenerated } from './CarouselProps.generated';
|
|
5
|
-
|
|
6
|
-
export type CarouselDefaults = Partial<CarouselPropsGenerated['attributes']>;
|
|
7
|
-
|
|
8
|
-
export function getDefaults(): CarouselDefaults {
|
|
9
|
-
return ((pattern as unknown as { default?: unknown })?.default ??
|
|
10
|
-
{}) as CarouselDefaults;
|
|
11
|
-
}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
/* AUTO-GENERATED FILE - DO NOT EDIT */
|
|
2
|
-
|
|
3
|
-
import pattern from './pattern.json';
|
|
4
|
-
import type { CarouselButtonsPropsGenerated } from './CarouselButtonsProps.generated';
|
|
5
|
-
|
|
6
|
-
export type CarouselButtonsDefaults = Partial<
|
|
7
|
-
CarouselButtonsPropsGenerated['attributes']
|
|
8
|
-
>;
|
|
9
|
-
|
|
10
|
-
export function getDefaults(): CarouselButtonsDefaults {
|
|
11
|
-
return ((pattern as unknown as { default?: unknown })?.default ??
|
|
12
|
-
{}) as CarouselButtonsDefaults;
|
|
13
|
-
}
|