@rocapine/react-native-onboarding-ui 1.9.0 → 1.11.1
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/UI/Pages/ComposableScreen/elements/BaseBoxProps.d.ts +26 -4
- package/dist/UI/Pages/ComposableScreen/elements/BaseBoxProps.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/BaseBoxProps.js +11 -2
- package/dist/UI/Pages/ComposableScreen/elements/BaseBoxProps.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/ButtonElement.d.ts +22 -10
- package/dist/UI/Pages/ComposableScreen/elements/ButtonElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/ButtonElement.js +3 -3
- package/dist/UI/Pages/ComposableScreen/elements/ButtonElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/CarouselElement.d.ts +79 -0
- package/dist/UI/Pages/ComposableScreen/elements/CarouselElement.d.ts.map +1 -0
- package/dist/UI/Pages/ComposableScreen/elements/CarouselElement.js +133 -0
- package/dist/UI/Pages/ComposableScreen/elements/CarouselElement.js.map +1 -0
- package/dist/UI/Pages/ComposableScreen/elements/CheckboxGroupElement.d.ts +16 -3
- package/dist/UI/Pages/ComposableScreen/elements/CheckboxGroupElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/CheckboxGroupElement.js +3 -2
- package/dist/UI/Pages/ComposableScreen/elements/CheckboxGroupElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/DatePickerElement.d.ts +81 -0
- package/dist/UI/Pages/ComposableScreen/elements/DatePickerElement.d.ts.map +1 -0
- package/dist/UI/Pages/ComposableScreen/elements/DatePickerElement.js +121 -0
- package/dist/UI/Pages/ComposableScreen/elements/DatePickerElement.js.map +1 -0
- package/dist/UI/Pages/ComposableScreen/elements/IconElement.d.ts +14 -2
- package/dist/UI/Pages/ComposableScreen/elements/IconElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/IconElement.js +12 -2
- package/dist/UI/Pages/ComposableScreen/elements/IconElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/ImageElement.d.ts +15 -2
- package/dist/UI/Pages/ComposableScreen/elements/ImageElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/ImageElement.js +15 -7
- package/dist/UI/Pages/ComposableScreen/elements/ImageElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/InputElement.d.ts +20 -2
- package/dist/UI/Pages/ComposableScreen/elements/InputElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/InputElement.js +17 -2
- package/dist/UI/Pages/ComposableScreen/elements/InputElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/LottieElement.d.ts +15 -2
- package/dist/UI/Pages/ComposableScreen/elements/LottieElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/LottieElement.js +12 -2
- package/dist/UI/Pages/ComposableScreen/elements/LottieElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/RadioGroupElement.d.ts +15 -2
- package/dist/UI/Pages/ComposableScreen/elements/RadioGroupElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/RadioGroupElement.js +3 -2
- package/dist/UI/Pages/ComposableScreen/elements/RadioGroupElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/RiveElement.d.ts +17 -4
- package/dist/UI/Pages/ComposableScreen/elements/RiveElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/RiveElement.js +25 -14
- package/dist/UI/Pages/ComposableScreen/elements/RiveElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/StackElement.d.ts +28 -47
- package/dist/UI/Pages/ComposableScreen/elements/StackElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/StackElement.js +30 -47
- package/dist/UI/Pages/ComposableScreen/elements/StackElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/TextElement.d.ts +35 -23
- package/dist/UI/Pages/ComposableScreen/elements/TextElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/TextElement.js +35 -35
- package/dist/UI/Pages/ComposableScreen/elements/TextElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/VideoElement.d.ts +15 -2
- package/dist/UI/Pages/ComposableScreen/elements/VideoElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/VideoElement.js +12 -2
- package/dist/UI/Pages/ComposableScreen/elements/VideoElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/renderElement.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/renderElement.js +8 -0
- package/dist/UI/Pages/ComposableScreen/elements/renderElement.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/shared.d.ts +1 -0
- package/dist/UI/Pages/ComposableScreen/elements/shared.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/elements/shared.js +4 -1
- package/dist/UI/Pages/ComposableScreen/elements/shared.js.map +1 -1
- package/dist/UI/Pages/ComposableScreen/types.d.ts +15 -0
- package/dist/UI/Pages/ComposableScreen/types.d.ts.map +1 -1
- package/dist/UI/Pages/ComposableScreen/types.js +15 -0
- package/dist/UI/Pages/ComposableScreen/types.js.map +1 -1
- package/package.json +11 -4
- package/src/UI/Pages/ComposableScreen/elements/BaseBoxProps.ts +22 -4
- package/src/UI/Pages/ComposableScreen/elements/ButtonElement.tsx +3 -5
- package/src/UI/Pages/ComposableScreen/elements/CarouselElement.tsx +152 -0
- package/src/UI/Pages/ComposableScreen/elements/CheckboxGroupElement.tsx +3 -3
- package/src/UI/Pages/ComposableScreen/elements/DatePickerElement.tsx +172 -0
- package/src/UI/Pages/ComposableScreen/elements/IconElement.tsx +12 -3
- package/src/UI/Pages/ComposableScreen/elements/ImageElement.tsx +16 -8
- package/src/UI/Pages/ComposableScreen/elements/InputElement.tsx +20 -3
- package/src/UI/Pages/ComposableScreen/elements/LottieElement.tsx +12 -3
- package/src/UI/Pages/ComposableScreen/elements/RadioGroupElement.tsx +3 -3
- package/src/UI/Pages/ComposableScreen/elements/RiveElement.tsx +26 -16
- package/src/UI/Pages/ComposableScreen/elements/StackElement.tsx +31 -70
- package/src/UI/Pages/ComposableScreen/elements/TextElement.tsx +36 -47
- package/src/UI/Pages/ComposableScreen/elements/VideoElement.tsx +12 -3
- package/src/UI/Pages/ComposableScreen/elements/renderElement.tsx +10 -0
- package/src/UI/Pages/ComposableScreen/elements/shared.ts +4 -0
- package/src/UI/Pages/ComposableScreen/types.ts +30 -0
|
@@ -11,8 +11,15 @@ export type VideoElementProps = BaseBoxProps & {
|
|
|
11
11
|
controls?: boolean;
|
|
12
12
|
};
|
|
13
13
|
export declare const VideoElementPropsSchema: z.ZodObject<{
|
|
14
|
-
width: z.ZodOptional<z.ZodNumber
|
|
15
|
-
height: z.ZodOptional<z.ZodNumber
|
|
14
|
+
width: z.ZodOptional<z.ZodUnion<readonly [z.ZodNumber, z.ZodString]>>;
|
|
15
|
+
height: z.ZodOptional<z.ZodUnion<readonly [z.ZodNumber, z.ZodString]>>;
|
|
16
|
+
minWidth: z.ZodOptional<z.ZodNumber>;
|
|
17
|
+
maxWidth: z.ZodOptional<z.ZodNumber>;
|
|
18
|
+
minHeight: z.ZodOptional<z.ZodNumber>;
|
|
19
|
+
maxHeight: z.ZodOptional<z.ZodNumber>;
|
|
20
|
+
flex: z.ZodOptional<z.ZodNumber>;
|
|
21
|
+
flexShrink: z.ZodOptional<z.ZodNumber>;
|
|
22
|
+
flexGrow: z.ZodOptional<z.ZodNumber>;
|
|
16
23
|
alignSelf: z.ZodOptional<z.ZodEnum<{
|
|
17
24
|
auto: "auto";
|
|
18
25
|
center: "center";
|
|
@@ -22,6 +29,12 @@ export declare const VideoElementPropsSchema: z.ZodObject<{
|
|
|
22
29
|
baseline: "baseline";
|
|
23
30
|
}>>;
|
|
24
31
|
opacity: z.ZodOptional<z.ZodNumber>;
|
|
32
|
+
backgroundColor: z.ZodOptional<z.ZodString>;
|
|
33
|
+
overflow: z.ZodOptional<z.ZodEnum<{
|
|
34
|
+
visible: "visible";
|
|
35
|
+
hidden: "hidden";
|
|
36
|
+
scroll: "scroll";
|
|
37
|
+
}>>;
|
|
25
38
|
margin: z.ZodOptional<z.ZodNumber>;
|
|
26
39
|
marginHorizontal: z.ZodOptional<z.ZodNumber>;
|
|
27
40
|
marginVertical: z.ZodOptional<z.ZodNumber>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoElement.d.ts","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/VideoElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,OAAO,EAAE,YAAY,EAAsB,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,aAAa,
|
|
1
|
+
{"version":3,"file":"VideoElement.d.ts","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/VideoElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,OAAO,EAAE,YAAY,EAAsB,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,aAAa,EAAO,MAAM,UAAU,CAAC;AAG9C,MAAM,MAAM,iBAAiB,GAAG,YAAY,GAAG;IAC7C,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAMlC,CAAC;AAEH,KAAK,cAAc,GAAG,OAAO,CAAC,SAAS,EAAE;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC,CAAC;AAmC5D,KAAK,KAAK,GAAG;IACX,OAAO,EAAE,cAAc,CAAC;IACxB,GAAG,EAAE,aAAa,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,kBAAkB,KAAK,KAAG,KAAK,CAAC,YA0CpE,CAAC"}
|
|
@@ -6,6 +6,7 @@ const react_1 = require("react");
|
|
|
6
6
|
const zod_1 = require("zod");
|
|
7
7
|
const react_native_1 = require("react-native");
|
|
8
8
|
const BaseBoxProps_1 = require("./BaseBoxProps");
|
|
9
|
+
const shared_1 = require("./shared");
|
|
9
10
|
const helpers_1 = require("../../../Theme/helpers");
|
|
10
11
|
exports.VideoElementPropsSchema = BaseBoxProps_1.BaseBoxPropsSchema.extend({
|
|
11
12
|
url: zod_1.z.string().min(1, "url must not be empty"),
|
|
@@ -47,9 +48,18 @@ const VideoElementRenderer = ({ element, ctx }) => {
|
|
|
47
48
|
var _a, _b;
|
|
48
49
|
const { theme } = ctx;
|
|
49
50
|
const wrapperStyle = {
|
|
50
|
-
|
|
51
|
-
|
|
51
|
+
flex: element.props.flex,
|
|
52
|
+
flexShrink: element.props.flexShrink,
|
|
53
|
+
flexGrow: element.props.flexGrow,
|
|
54
|
+
alignSelf: element.props.alignSelf,
|
|
55
|
+
width: (_a = (0, shared_1.dim)(element.props.width)) !== null && _a !== void 0 ? _a : "100%",
|
|
56
|
+
height: (0, shared_1.dim)((_b = element.props.height) !== null && _b !== void 0 ? _b : 200),
|
|
57
|
+
minWidth: element.props.minWidth,
|
|
58
|
+
maxWidth: element.props.maxWidth,
|
|
59
|
+
minHeight: element.props.minHeight,
|
|
60
|
+
maxHeight: element.props.maxHeight,
|
|
52
61
|
opacity: element.props.opacity,
|
|
62
|
+
backgroundColor: element.props.backgroundColor,
|
|
53
63
|
margin: element.props.margin,
|
|
54
64
|
marginHorizontal: element.props.marginHorizontal,
|
|
55
65
|
marginVertical: element.props.marginVertical,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoElement.js","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/VideoElement.tsx"],"names":[],"mappings":";;;;AAAA,iCAAyC;AACzC,6BAAwB;AACxB,+CAAsD;AACtD,iDAAkE;
|
|
1
|
+
{"version":3,"file":"VideoElement.js","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/VideoElement.tsx"],"names":[],"mappings":";;;;AAAA,iCAAyC;AACzC,6BAAwB;AACxB,+CAAsD;AACtD,iDAAkE;AAElE,qCAA8C;AAC9C,oDAAsD;AAUzC,QAAA,uBAAuB,GAAG,iCAAkB,CAAC,MAAM,CAAC;IAC/D,GAAG,EAAE,OAAC,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,uBAAuB,CAAC;IAC/C,QAAQ,EAAE,OAAC,CAAC,OAAO,EAAE,CAAC,QAAQ,EAAE;IAChC,IAAI,EAAE,OAAC,CAAC,OAAO,EAAE,CAAC,QAAQ,EAAE;IAC5B,KAAK,EAAE,OAAC,CAAC,OAAO,EAAE,CAAC,QAAQ,EAAE;IAC7B,QAAQ,EAAE,OAAC,CAAC,OAAO,EAAE,CAAC,QAAQ,EAAE;CACjC,CAAC,CAAC;AAIH,IAAI,qBAAqB,GAA2E,IAAI,CAAC;AACzG,IAAI,CAAC;IACH,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,GAAG,OAAO,CAAC,YAAY,CAAC,CAAC;IAC5D,qBAAqB,GAAG,CAAC,EAAE,OAAO,EAAE,KAAK,EAA8C,EAAE,EAAE;;QACzF,MAAM,MAAM,GAAG,cAAc,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,CAAM,EAAE,EAAE;;YAC1D,CAAC,CAAC,IAAI,GAAG,MAAA,OAAO,CAAC,KAAK,CAAC,IAAI,mCAAI,KAAK,CAAC;YACrC,CAAC,CAAC,KAAK,GAAG,MAAA,OAAO,CAAC,KAAK,CAAC,KAAK,mCAAI,IAAI,CAAC;YACtC,IAAI,OAAO,CAAC,KAAK,CAAC,QAAQ;gBAAE,CAAC,CAAC,IAAI,EAAE,CAAC;QACvC,CAAC,CAAC,CAAC;QAEH,IAAA,iBAAS,EAAC,GAAG,EAAE;;YACb,MAAM,CAAC,IAAI,GAAG,MAAA,OAAO,CAAC,KAAK,CAAC,IAAI,mCAAI,KAAK,CAAC;YAC1C,MAAM,CAAC,KAAK,GAAG,MAAA,OAAO,CAAC,KAAK,CAAC,KAAK,mCAAI,IAAI,CAAC;YAC3C,IAAI,OAAO,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;gBAC3B,MAAM,CAAC,IAAI,EAAE,CAAC;YAChB,CAAC;iBAAM,CAAC;gBACN,MAAM,CAAC,KAAK,EAAE,CAAC;YACjB,CAAC;QACH,CAAC,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;QAEtE,OAAO,CACL,uBAAC,SAAS,IACR,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,gBAAgB,EAAE,KAAK,EACvB,cAAc,EAAE,MAAA,OAAO,CAAC,KAAK,CAAC,QAAQ,mCAAI,KAAK,GAC/C,CACH,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC;AAAC,WAAM,CAAC;IACP,2BAA2B;AAC7B,CAAC;AAOM,MAAM,oBAAoB,GAAG,CAAC,EAAE,OAAO,EAAE,GAAG,EAAS,EAAsB,EAAE;;IAClF,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,CAAC;IACtB,MAAM,YAAY,GAAG;QACnB,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI;QACxB,UAAU,EAAE,OAAO,CAAC,KAAK,CAAC,UAAU;QACpC,QAAQ,EAAE,OAAO,CAAC,KAAK,CAAC,QAAQ;QAChC,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,SAAS;QAClC,KAAK,EAAE,MAAA,IAAA,YAAG,EAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,mCAAK,MAAuB;QAC3D,MAAM,EAAE,IAAA,YAAG,EAAC,MAAA,OAAO,CAAC,KAAK,CAAC,MAAM,mCAAI,GAAG,CAAC;QACxC,QAAQ,EAAE,OAAO,CAAC,KAAK,CAAC,QAAQ;QAChC,QAAQ,EAAE,OAAO,CAAC,KAAK,CAAC,QAAQ;QAChC,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,SAAS;QAClC,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,SAAS;QAClC,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC,OAAO;QAC9B,eAAe,EAAE,OAAO,CAAC,KAAK,CAAC,eAAe;QAC9C,MAAM,EAAE,OAAO,CAAC,KAAK,CAAC,MAAM;QAC5B,gBAAgB,EAAE,OAAO,CAAC,KAAK,CAAC,gBAAgB;QAChD,cAAc,EAAE,OAAO,CAAC,KAAK,CAAC,cAAc;QAC5C,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC,OAAO;QAC9B,iBAAiB,EAAE,OAAO,CAAC,KAAK,CAAC,iBAAiB;QAClD,eAAe,EAAE,OAAO,CAAC,KAAK,CAAC,eAAe;QAC9C,WAAW,EAAE,OAAO,CAAC,KAAK,CAAC,WAAW;QACtC,YAAY,EAAE,OAAO,CAAC,KAAK,CAAC,YAAY;QACxC,WAAW,EAAE,OAAO,CAAC,KAAK,CAAC,WAAW;QACtC,QAAQ,EAAE,QAAiB;KAC5B,CAAC;IAEF,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC3B,OAAO,CACL,uBAAC,mBAAI,IAAC,KAAK,EAAE,CAAC,YAAY,EAAE,MAAM,CAAC,aAAa,EAAE,EAAE,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,YACjG,uBAAC,mBAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,iBAAiB,EAAE,IAAA,sBAAY,EAAC,KAAK,EAAE,SAAS,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,qDAEvG,GACF,CACR,CAAC;IACJ,CAAC;IAED,OAAO,CACL,uBAAC,mBAAI,IAAC,KAAK,EAAE,YAAY,YACvB,uBAAC,qBAAqB,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC,IAAI,GAAI,GAC1D,CACR,CAAC;AACJ,CAAC,CAAC;AA1CW,QAAA,oBAAoB,wBA0C/B;AAEF,MAAM,MAAM,GAAG,yBAAU,CAAC,MAAM,CAAC;IAC/B,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;KACf;IACD,aAAa,EAAE;QACb,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;KACzB;IACD,iBAAiB,EAAE;QACjB,SAAS,EAAE,QAAQ;QACnB,iBAAiB,EAAE,EAAE;KACtB;CACF,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderElement.d.ts","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/renderElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"renderElement.d.ts","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/renderElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAezC,eAAO,MAAM,aAAa,GACxB,SAAS,SAAS,EAClB,KAAK,aAAa,EAClB,aAAa,QAAQ,GAAG,QAAQ,KAC/B,KAAK,CAAC,SAsDR,CAAC"}
|
|
@@ -13,6 +13,8 @@ const InputElement_1 = require("./InputElement");
|
|
|
13
13
|
const RadioGroupElement_1 = require("./RadioGroupElement");
|
|
14
14
|
const CheckboxGroupElement_1 = require("./CheckboxGroupElement");
|
|
15
15
|
const ButtonElement_1 = require("./ButtonElement");
|
|
16
|
+
const DatePickerElement_1 = require("./DatePickerElement");
|
|
17
|
+
const CarouselElement_1 = require("./CarouselElement");
|
|
16
18
|
const renderElement = (element, ctx, parentType) => {
|
|
17
19
|
if (element.type === "YStack" || element.type === "XStack") {
|
|
18
20
|
return (0, jsx_runtime_1.jsx)(StackElement_1.StackElementComponent, { element: element, ctx: ctx, parentType: parentType }, element.id);
|
|
@@ -47,6 +49,12 @@ const renderElement = (element, ctx, parentType) => {
|
|
|
47
49
|
if (element.type === "Button") {
|
|
48
50
|
return (0, jsx_runtime_1.jsx)(ButtonElement_1.ButtonElementComponent, { element: element, ctx: ctx }, element.id);
|
|
49
51
|
}
|
|
52
|
+
if (element.type === "DatePicker") {
|
|
53
|
+
return (0, jsx_runtime_1.jsx)(DatePickerElement_1.DatePickerElementComponent, { element: element, ctx: ctx }, element.id);
|
|
54
|
+
}
|
|
55
|
+
if (element.type === "Carousel") {
|
|
56
|
+
return (0, jsx_runtime_1.jsx)(CarouselElement_1.CarouselElementComponent, { element: element, ctx: ctx }, element.id);
|
|
57
|
+
}
|
|
50
58
|
return null;
|
|
51
59
|
};
|
|
52
60
|
exports.renderElement = renderElement;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderElement.js","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/renderElement.tsx"],"names":[],"mappings":";;;;AAGA,iDAAuD;AACvD,+CAAqD;AACrD,iDAAuD;AACvD,mDAAyD;AACzD,+CAAoD;AACpD,+CAAqD;AACrD,iDAAsD;AACtD,iDAAuD;AACvD,2DAA0D;AAC1D,iEAAgE;AAChE,mDAAyD;
|
|
1
|
+
{"version":3,"file":"renderElement.js","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/renderElement.tsx"],"names":[],"mappings":"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"}
|
|
@@ -10,4 +10,5 @@ export type RenderContext = {
|
|
|
10
10
|
renderChildren: (elements: UIElement[], parentType: "XStack" | "YStack") => React.ReactNode;
|
|
11
11
|
};
|
|
12
12
|
export declare const interpolate: (template: string, variables: Record<string, ComposableVariableEntry>) => string;
|
|
13
|
+
export declare const dim: (v: number | string | undefined) => import("react-native").DimensionValue | undefined;
|
|
13
14
|
//# sourceMappingURL=shared.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/shared.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAC7C,OAAO,EAAE,uBAAuB,EAAE,MAAM,8CAA8C,CAAC;AAEvF,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,uBAAuB,CAAC,CAAC;IACnD,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IACnE,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,GAAG,QAAQ,KAAK,KAAK,CAAC,SAAS,CAAC;CAC7F,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,UAAU,MAAM,EAAE,WAAW,MAAM,CAAC,MAAM,EAAE,uBAAuB,CAAC,KAAG,MACM,CAAC"}
|
|
1
|
+
{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/shared.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAC7C,OAAO,EAAE,uBAAuB,EAAE,MAAM,8CAA8C,CAAC;AAEvF,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,uBAAuB,CAAC,CAAC;IACnD,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IACnE,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,GAAG,QAAQ,KAAK,KAAK,CAAC,SAAS,CAAC;CAC7F,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,UAAU,MAAM,EAAE,WAAW,MAAM,CAAC,MAAM,EAAE,uBAAuB,CAAC,KAAG,MACM,CAAC;AAG1G,eAAO,MAAM,GAAG,GAAI,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,KAAG,OAAO,cAAc,EAAE,cAAc,GAAG,SACrC,CAAC"}
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.interpolate = void 0;
|
|
3
|
+
exports.dim = exports.interpolate = void 0;
|
|
4
4
|
const interpolate = (template, variables) => template.replace(/\{\{([^}]+?)\}\}/g, (_, key) => { var _a, _b, _c, _d; return (_d = (_b = (_a = variables[key]) === null || _a === void 0 ? void 0 : _a.label) !== null && _b !== void 0 ? _b : (_c = variables[key]) === null || _c === void 0 ? void 0 : _c.value) !== null && _d !== void 0 ? _d : ""; });
|
|
5
5
|
exports.interpolate = interpolate;
|
|
6
|
+
// Cast number | string dimension values to DimensionValue for React Native style props
|
|
7
|
+
const dim = (v) => v;
|
|
8
|
+
exports.dim = dim;
|
|
6
9
|
//# sourceMappingURL=shared.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared.js","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/shared.ts"],"names":[],"mappings":";;;AAaO,MAAM,WAAW,GAAG,CAAC,QAAgB,EAAE,SAAkD,EAAU,EAAE,CAC1G,QAAQ,CAAC,OAAO,CAAC,mBAAmB,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,uBAAC,OAAA,MAAA,MAAA,MAAA,SAAS,CAAC,GAAG,CAAC,0CAAE,KAAK,mCAAI,MAAA,SAAS,CAAC,GAAG,CAAC,0CAAE,KAAK,mCAAI,EAAE,CAAA,EAAA,CAAC,CAAC;AAD7F,QAAA,WAAW,eACkF"}
|
|
1
|
+
{"version":3,"file":"shared.js","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/shared.ts"],"names":[],"mappings":";;;AAaO,MAAM,WAAW,GAAG,CAAC,QAAgB,EAAE,SAAkD,EAAU,EAAE,CAC1G,QAAQ,CAAC,OAAO,CAAC,mBAAmB,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,uBAAC,OAAA,MAAA,MAAA,MAAA,SAAS,CAAC,GAAG,CAAC,0CAAE,KAAK,mCAAI,MAAA,SAAS,CAAC,GAAG,CAAC,0CAAE,KAAK,mCAAI,EAAE,CAAA,EAAA,CAAC,CAAC;AAD7F,QAAA,WAAW,eACkF;AAE1G,uFAAuF;AAChF,MAAM,GAAG,GAAG,CAAC,CAA8B,EAAqD,EAAE,CACvG,CAAsD,CAAC;AAD5C,QAAA,GAAG,OACyC"}
|
|
@@ -10,6 +10,8 @@ import { type InputElementProps } from "./elements/InputElement";
|
|
|
10
10
|
import { type ButtonElementProps } from "./elements/ButtonElement";
|
|
11
11
|
import { type RadioGroupElementProps } from "./elements/RadioGroupElement";
|
|
12
12
|
import { type CheckboxGroupElementProps } from "./elements/CheckboxGroupElement";
|
|
13
|
+
import { type DatePickerElementProps } from "./elements/DatePickerElement";
|
|
14
|
+
import { type CarouselElementProps } from "./elements/CarouselElement";
|
|
13
15
|
export type { BaseBoxProps } from "./elements/BaseBoxProps";
|
|
14
16
|
export { BaseBoxPropsSchema } from "./elements/BaseBoxProps";
|
|
15
17
|
export type { StackElementProps } from "./elements/StackElement";
|
|
@@ -23,6 +25,8 @@ export type { InputElementProps } from "./elements/InputElement";
|
|
|
23
25
|
export type { ButtonElementProps } from "./elements/ButtonElement";
|
|
24
26
|
export type { RadioGroupElementProps } from "./elements/RadioGroupElement";
|
|
25
27
|
export type { CheckboxGroupElementProps } from "./elements/CheckboxGroupElement";
|
|
28
|
+
export type { DatePickerElementProps } from "./elements/DatePickerElement";
|
|
29
|
+
export type { CarouselElementProps } from "./elements/CarouselElement";
|
|
26
30
|
export type UIElement = {
|
|
27
31
|
id: string;
|
|
28
32
|
name?: string;
|
|
@@ -79,6 +83,17 @@ export type UIElement = {
|
|
|
79
83
|
name?: string;
|
|
80
84
|
type: "CheckboxGroup";
|
|
81
85
|
props: CheckboxGroupElementProps;
|
|
86
|
+
} | {
|
|
87
|
+
id: string;
|
|
88
|
+
name?: string;
|
|
89
|
+
type: "DatePicker";
|
|
90
|
+
props: DatePickerElementProps;
|
|
91
|
+
} | {
|
|
92
|
+
id: string;
|
|
93
|
+
name?: string;
|
|
94
|
+
type: "Carousel";
|
|
95
|
+
props: CarouselElementProps;
|
|
96
|
+
children: UIElement[];
|
|
82
97
|
};
|
|
83
98
|
export declare const UIElementSchema: z.ZodType<UIElement>;
|
|
84
99
|
export declare const ComposableScreenStepPayloadSchema: z.ZodObject<{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/UI/Pages/ComposableScreen/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,OAAO,EAAE,KAAK,iBAAiB,EAA2B,MAAM,yBAAyB,CAAC;AAC1F,OAAO,EAAE,KAAK,gBAAgB,EAA0B,MAAM,wBAAwB,CAAC;AACvF,OAAO,EAAE,KAAK,iBAAiB,EAA2B,MAAM,yBAAyB,CAAC;AAC1F,OAAO,EAAE,KAAK,kBAAkB,EAA4B,MAAM,0BAA0B,CAAC;AAC7F,OAAO,EAAE,KAAK,gBAAgB,EAA0B,MAAM,wBAAwB,CAAC;AACvF,OAAO,EAAE,KAAK,gBAAgB,EAA0B,MAAM,wBAAwB,CAAC;AACvF,OAAO,EAAE,KAAK,iBAAiB,EAA2B,MAAM,yBAAyB,CAAC;AAC1F,OAAO,EAAE,KAAK,iBAAiB,EAA2B,MAAM,yBAAyB,CAAC;AAC1F,OAAO,EAAE,KAAK,kBAAkB,EAA4B,MAAM,0BAA0B,CAAC;AAC7F,OAAO,EAAE,KAAK,sBAAsB,EAAgC,MAAM,8BAA8B,CAAC;AACzG,OAAO,EAAE,KAAK,yBAAyB,EAAmC,MAAM,iCAAiC,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/UI/Pages/ComposableScreen/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -14,6 +14,8 @@ const InputElement_1 = require("./elements/InputElement");
|
|
|
14
14
|
const ButtonElement_1 = require("./elements/ButtonElement");
|
|
15
15
|
const RadioGroupElement_1 = require("./elements/RadioGroupElement");
|
|
16
16
|
const CheckboxGroupElement_1 = require("./elements/CheckboxGroupElement");
|
|
17
|
+
const DatePickerElement_1 = require("./elements/DatePickerElement");
|
|
18
|
+
const CarouselElement_1 = require("./elements/CarouselElement");
|
|
17
19
|
var BaseBoxProps_1 = require("./elements/BaseBoxProps");
|
|
18
20
|
Object.defineProperty(exports, "BaseBoxPropsSchema", { enumerable: true, get: function () { return BaseBoxProps_1.BaseBoxPropsSchema; } });
|
|
19
21
|
exports.UIElementSchema = zod_1.z.lazy(() => zod_1.z.union([
|
|
@@ -84,6 +86,19 @@ exports.UIElementSchema = zod_1.z.lazy(() => zod_1.z.union([
|
|
|
84
86
|
type: zod_1.z.literal("CheckboxGroup"),
|
|
85
87
|
props: CheckboxGroupElement_1.CheckboxGroupElementPropsSchema,
|
|
86
88
|
}),
|
|
89
|
+
zod_1.z.object({
|
|
90
|
+
id: zod_1.z.string(),
|
|
91
|
+
name: zod_1.z.string().optional(),
|
|
92
|
+
type: zod_1.z.literal("DatePicker"),
|
|
93
|
+
props: DatePickerElement_1.DatePickerElementPropsSchema,
|
|
94
|
+
}),
|
|
95
|
+
zod_1.z.object({
|
|
96
|
+
id: zod_1.z.string(),
|
|
97
|
+
name: zod_1.z.string().optional(),
|
|
98
|
+
type: zod_1.z.literal("Carousel"),
|
|
99
|
+
props: CarouselElement_1.CarouselElementPropsSchema,
|
|
100
|
+
children: zod_1.z.array(exports.UIElementSchema),
|
|
101
|
+
}),
|
|
87
102
|
]));
|
|
88
103
|
exports.ComposableScreenStepPayloadSchema = zod_1.z.object({
|
|
89
104
|
elements: zod_1.z.array(exports.UIElementSchema),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/UI/Pages/ComposableScreen/types.ts"],"names":[],"mappings":";;;AAAA,6BAAwB;AACxB,oCAA+C;AAC/C,0DAA0F;AAC1F,wDAAuF;AACvF,0DAA0F;AAC1F,4DAA6F;AAC7F,wDAAuF;AACvF,wDAAuF;AACvF,0DAA0F;AAC1F,0DAA0F;AAC1F,4DAA6F;AAC7F,oEAAyG;AACzG,0EAAkH;
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/UI/Pages/ComposableScreen/types.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rocapine/react-native-onboarding-ui",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.11.1",
|
|
4
4
|
"description": "UI components and renderers for Rocapine Onboarding Studio - Built on top of the headless SDK",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -28,6 +28,7 @@
|
|
|
28
28
|
"zod": "^4.1.11"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
|
+
"@react-native-community/datetimepicker": "^8.2.0",
|
|
31
32
|
"@react-native-picker/picker": "^2.11.2",
|
|
32
33
|
"@shopify/react-native-skia": "2.4.18",
|
|
33
34
|
"@types/react": "^19.0.0",
|
|
@@ -37,26 +38,32 @@
|
|
|
37
38
|
"react-native": "0.83.4",
|
|
38
39
|
"react-native-gesture-handler": "^2.28.0",
|
|
39
40
|
"react-native-reanimated": "^4.1.2",
|
|
41
|
+
"react-native-reanimated-carousel": "^4.0.3",
|
|
40
42
|
"react-native-safe-area-context": "^5.6.1",
|
|
41
43
|
"react-native-svg": "15.15.3",
|
|
42
44
|
"typescript": "^5.0.0"
|
|
43
45
|
},
|
|
44
46
|
"peerDependencies": {
|
|
47
|
+
"@react-native-community/datetimepicker": "*",
|
|
45
48
|
"@react-native-picker/picker": "*",
|
|
46
|
-
"@rocapine/react-native-onboarding": "^1.
|
|
49
|
+
"@rocapine/react-native-onboarding": "^1.11.1",
|
|
47
50
|
"@shopify/react-native-skia": ">=1.0.0",
|
|
48
51
|
"@tanstack/react-query": ">=5.0.0",
|
|
49
52
|
"@types/react": "*",
|
|
50
53
|
"expo-router": ">=3.0.0",
|
|
51
54
|
"expo-store-review": "*",
|
|
55
|
+
"expo-video": "*",
|
|
52
56
|
"lottie-react-native": "*",
|
|
53
57
|
"react": "*",
|
|
54
58
|
"react-native": "*",
|
|
59
|
+
"react-native-reanimated-carousel": "*",
|
|
55
60
|
"react-native-safe-area-context": "*",
|
|
56
|
-
"rive-react-native": "*"
|
|
57
|
-
"expo-video": "*"
|
|
61
|
+
"rive-react-native": "*"
|
|
58
62
|
},
|
|
59
63
|
"peerDependenciesMeta": {
|
|
64
|
+
"@react-native-community/datetimepicker": {
|
|
65
|
+
"optional": true
|
|
66
|
+
},
|
|
60
67
|
"@react-native-picker/picker": {
|
|
61
68
|
"optional": true
|
|
62
69
|
},
|
|
@@ -1,10 +1,19 @@
|
|
|
1
1
|
import { z } from "zod";
|
|
2
2
|
|
|
3
3
|
export type BaseBoxProps = {
|
|
4
|
-
width?: number;
|
|
5
|
-
height?: number;
|
|
4
|
+
width?: number | string;
|
|
5
|
+
height?: number | string;
|
|
6
|
+
minWidth?: number;
|
|
7
|
+
maxWidth?: number;
|
|
8
|
+
minHeight?: number;
|
|
9
|
+
maxHeight?: number;
|
|
10
|
+
flex?: number;
|
|
11
|
+
flexShrink?: number;
|
|
12
|
+
flexGrow?: number;
|
|
6
13
|
alignSelf?: "auto" | "flex-start" | "flex-end" | "center" | "stretch" | "baseline";
|
|
7
14
|
opacity?: number;
|
|
15
|
+
backgroundColor?: string;
|
|
16
|
+
overflow?: "hidden" | "visible" | "scroll";
|
|
8
17
|
margin?: number;
|
|
9
18
|
marginHorizontal?: number;
|
|
10
19
|
marginVertical?: number;
|
|
@@ -17,10 +26,19 @@ export type BaseBoxProps = {
|
|
|
17
26
|
};
|
|
18
27
|
|
|
19
28
|
export const BaseBoxPropsSchema = z.object({
|
|
20
|
-
width: z.number().min(0).optional(),
|
|
21
|
-
height: z.number().min(0).optional(),
|
|
29
|
+
width: z.union([z.number().min(0), z.string()]).optional(),
|
|
30
|
+
height: z.union([z.number().min(0), z.string()]).optional(),
|
|
31
|
+
minWidth: z.number().min(0).optional(),
|
|
32
|
+
maxWidth: z.number().min(0).optional(),
|
|
33
|
+
minHeight: z.number().min(0).optional(),
|
|
34
|
+
maxHeight: z.number().min(0).optional(),
|
|
35
|
+
flex: z.number().min(0).optional(),
|
|
36
|
+
flexShrink: z.number().min(0).optional(),
|
|
37
|
+
flexGrow: z.number().min(0).optional(),
|
|
22
38
|
alignSelf: z.enum(["auto", "flex-start", "flex-end", "center", "stretch", "baseline"]).optional(),
|
|
23
39
|
opacity: z.number().min(0).max(1).optional(),
|
|
40
|
+
backgroundColor: z.string().optional(),
|
|
41
|
+
overflow: z.enum(["hidden", "visible", "scroll"]).optional(),
|
|
24
42
|
margin: z.number().optional(),
|
|
25
43
|
marginHorizontal: z.number().optional(),
|
|
26
44
|
marginVertical: z.number().optional(),
|
|
@@ -3,7 +3,7 @@ import { z } from "zod";
|
|
|
3
3
|
import { Text, TouchableOpacity } from "react-native";
|
|
4
4
|
import { BaseBoxProps, BaseBoxPropsSchema } from "./BaseBoxProps";
|
|
5
5
|
import { UIElement } from "../types";
|
|
6
|
-
import { RenderContext } from "./shared";
|
|
6
|
+
import { RenderContext, dim } from "./shared";
|
|
7
7
|
|
|
8
8
|
export type ButtonElementProps = BaseBoxProps & {
|
|
9
9
|
label: string;
|
|
@@ -15,7 +15,6 @@ export type ButtonElementProps = BaseBoxProps & {
|
|
|
15
15
|
fontWeight?: string;
|
|
16
16
|
fontFamily?: string;
|
|
17
17
|
textAlign?: "left" | "center" | "right";
|
|
18
|
-
alignSelf?: "auto" | "flex-start" | "center" | "flex-end" | "stretch";
|
|
19
18
|
};
|
|
20
19
|
|
|
21
20
|
export const ButtonElementPropsSchema = BaseBoxPropsSchema.extend({
|
|
@@ -28,7 +27,6 @@ export const ButtonElementPropsSchema = BaseBoxPropsSchema.extend({
|
|
|
28
27
|
fontWeight: z.string().optional(),
|
|
29
28
|
fontFamily: z.string().optional(),
|
|
30
29
|
textAlign: z.enum(["left", "center", "right"]).optional(),
|
|
31
|
-
alignSelf: z.enum(["auto", "flex-start", "center", "flex-end", "stretch"]).optional(),
|
|
32
30
|
});
|
|
33
31
|
|
|
34
32
|
type ButtonUIElement = Extract<UIElement, { type: "Button" }>;
|
|
@@ -69,8 +67,8 @@ export const ButtonElementComponent = ({ element, ctx }: Props): React.ReactElem
|
|
|
69
67
|
padding: element.props.padding,
|
|
70
68
|
paddingVertical: element.props.paddingVertical ?? 14,
|
|
71
69
|
paddingHorizontal: element.props.paddingHorizontal ?? 24,
|
|
72
|
-
width: element.props.width,
|
|
73
|
-
height: element.props.height,
|
|
70
|
+
width: dim(element.props.width),
|
|
71
|
+
height: dim(element.props.height),
|
|
74
72
|
margin: element.props.margin,
|
|
75
73
|
marginHorizontal: element.props.marginHorizontal,
|
|
76
74
|
marginVertical: element.props.marginVertical,
|
|
@@ -0,0 +1,152 @@
|
|
|
1
|
+
import React, { useRef } from "react";
|
|
2
|
+
import { useWindowDimensions, View } from "react-native";
|
|
3
|
+
import { z } from "zod";
|
|
4
|
+
import { useSharedValue } from "react-native-reanimated";
|
|
5
|
+
import Carousel, { Pagination, ICarouselInstance } from "react-native-reanimated-carousel";
|
|
6
|
+
import { BaseBoxProps, BaseBoxPropsSchema } from "./BaseBoxProps";
|
|
7
|
+
import type { UIElement } from "../types";
|
|
8
|
+
import { dim, type RenderContext } from "./shared";
|
|
9
|
+
|
|
10
|
+
export type CarouselElementProps = BaseBoxProps & {
|
|
11
|
+
carouselType?: "left-align" | "normal" | "parallax" | "stack";
|
|
12
|
+
autoPlay?: boolean;
|
|
13
|
+
autoPlayInterval?: number;
|
|
14
|
+
loop?: boolean;
|
|
15
|
+
showDots?: boolean;
|
|
16
|
+
dotColor?: string;
|
|
17
|
+
activeDotColor?: string;
|
|
18
|
+
dotWidth?: number;
|
|
19
|
+
dotHeight?: number;
|
|
20
|
+
dotsGap?: number;
|
|
21
|
+
dotsMarginTop?: number;
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
export const CarouselElementPropsSchema = BaseBoxPropsSchema.extend({
|
|
25
|
+
carouselType: z.enum(["left-align", "normal", "parallax", "stack"]).optional().default("normal"),
|
|
26
|
+
autoPlay: z.boolean().optional().default(false),
|
|
27
|
+
autoPlayInterval: z.number().nonnegative().optional().default(3000),
|
|
28
|
+
loop: z.boolean().optional().default(true),
|
|
29
|
+
showDots: z.boolean().optional().default(true),
|
|
30
|
+
dotColor: z.string().optional(),
|
|
31
|
+
activeDotColor: z.string().optional(),
|
|
32
|
+
dotWidth: z.number().nonnegative().optional().default(20),
|
|
33
|
+
dotHeight: z.number().nonnegative().optional().default(4),
|
|
34
|
+
dotsGap: z.number().nonnegative().optional().default(8),
|
|
35
|
+
dotsMarginTop: z.number().optional().default(12),
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
type CarouselUIElement = Extract<UIElement, { type: "Carousel" }>;
|
|
39
|
+
|
|
40
|
+
type Props = {
|
|
41
|
+
element: CarouselUIElement;
|
|
42
|
+
ctx: RenderContext;
|
|
43
|
+
};
|
|
44
|
+
|
|
45
|
+
export function CarouselElementComponent({ element, ctx }: Props): React.ReactElement {
|
|
46
|
+
const { theme } = ctx;
|
|
47
|
+
const { props, children } = element;
|
|
48
|
+
const { width: windowWidth } = useWindowDimensions();
|
|
49
|
+
const progress = useSharedValue<number>(0);
|
|
50
|
+
const ref = useRef<ICarouselInstance>(null);
|
|
51
|
+
|
|
52
|
+
const carouselType = props.carouselType ?? "normal";
|
|
53
|
+
|
|
54
|
+
// Stack uses 75% width (shows side items); left-align uses 82% (peek effect)
|
|
55
|
+
const itemWidth =
|
|
56
|
+
carouselType === "stack"
|
|
57
|
+
? windowWidth * 0.75
|
|
58
|
+
: carouselType === "left-align"
|
|
59
|
+
? windowWidth * 0.82
|
|
60
|
+
: (typeof props.width === "number" ? props.width : windowWidth);
|
|
61
|
+
const itemHeight = typeof props.height === "number" ? props.height : 220;
|
|
62
|
+
|
|
63
|
+
const containerStyle = {
|
|
64
|
+
alignSelf: props.alignSelf,
|
|
65
|
+
flex: props.flex,
|
|
66
|
+
flexShrink: props.flexShrink,
|
|
67
|
+
flexGrow: props.flexGrow,
|
|
68
|
+
width: dim(props.width),
|
|
69
|
+
minWidth: props.minWidth,
|
|
70
|
+
maxWidth: props.maxWidth,
|
|
71
|
+
minHeight: props.minHeight,
|
|
72
|
+
maxHeight: props.maxHeight,
|
|
73
|
+
margin: props.margin,
|
|
74
|
+
marginHorizontal: props.marginHorizontal,
|
|
75
|
+
marginVertical: props.marginVertical,
|
|
76
|
+
padding: props.padding,
|
|
77
|
+
paddingHorizontal: props.paddingHorizontal,
|
|
78
|
+
paddingVertical: props.paddingVertical,
|
|
79
|
+
borderRadius: props.borderRadius,
|
|
80
|
+
borderWidth: props.borderWidth,
|
|
81
|
+
borderColor: props.borderColor,
|
|
82
|
+
backgroundColor: props.backgroundColor,
|
|
83
|
+
opacity: props.opacity,
|
|
84
|
+
// Left-align shows the next slide peeking — must not clip
|
|
85
|
+
overflow: carouselType === "left-align" ? ("visible" as const) : (props.overflow ?? ("hidden" as const)),
|
|
86
|
+
};
|
|
87
|
+
|
|
88
|
+
const modeProps: Record<string, unknown> =
|
|
89
|
+
carouselType === "parallax"
|
|
90
|
+
? {
|
|
91
|
+
mode: "parallax",
|
|
92
|
+
modeConfig: { parallaxScrollingScale: 0.9, parallaxScrollingOffset: 50 },
|
|
93
|
+
}
|
|
94
|
+
: carouselType === "stack"
|
|
95
|
+
? {
|
|
96
|
+
mode: "horizontal-stack",
|
|
97
|
+
modeConfig: { snapDirection: "left", stackInterval: 18 },
|
|
98
|
+
customConfig: () => ({ type: "positive", viewCount: 5 }),
|
|
99
|
+
}
|
|
100
|
+
: {};
|
|
101
|
+
|
|
102
|
+
const dotW = props.dotWidth ?? 20;
|
|
103
|
+
const dotH = props.dotHeight ?? 4;
|
|
104
|
+
const dotsGap = props.dotsGap ?? 8;
|
|
105
|
+
const dotsMarginTop = props.dotsMarginTop ?? 12;
|
|
106
|
+
const dotBg = props.dotColor ?? theme.colors.neutral.low;
|
|
107
|
+
const activeDotBg = props.activeDotColor ?? theme.colors.primary;
|
|
108
|
+
console.log(props.autoPlay, props.autoPlayInterval);
|
|
109
|
+
console.log(element);
|
|
110
|
+
return (
|
|
111
|
+
<View style={containerStyle}>
|
|
112
|
+
<Carousel
|
|
113
|
+
ref={ref}
|
|
114
|
+
loop={props.loop}
|
|
115
|
+
autoPlay={props.autoPlay}
|
|
116
|
+
autoPlayInterval={props.autoPlayInterval}
|
|
117
|
+
snapEnabled={true}
|
|
118
|
+
pagingEnabled={true}
|
|
119
|
+
data={children}
|
|
120
|
+
width={itemWidth}
|
|
121
|
+
height={itemHeight}
|
|
122
|
+
style={{ width: itemWidth, height: itemHeight }}
|
|
123
|
+
renderItem={({ item }: { item: UIElement }) => ctx.renderChildren([item], "YStack")}
|
|
124
|
+
onProgressChange={(_: number, absoluteProgress: number) => {
|
|
125
|
+
progress.value = absoluteProgress;
|
|
126
|
+
}}
|
|
127
|
+
{...(modeProps as any)}
|
|
128
|
+
/>
|
|
129
|
+
{(props.showDots ?? true) && (
|
|
130
|
+
<Pagination.Basic
|
|
131
|
+
progress={progress}
|
|
132
|
+
data={children}
|
|
133
|
+
dotStyle={{
|
|
134
|
+
width: dotW,
|
|
135
|
+
height: dotH,
|
|
136
|
+
borderRadius: dotH / 2,
|
|
137
|
+
backgroundColor: dotBg,
|
|
138
|
+
}}
|
|
139
|
+
activeDotStyle={{
|
|
140
|
+
overflow: "hidden",
|
|
141
|
+
backgroundColor: activeDotBg,
|
|
142
|
+
}}
|
|
143
|
+
containerStyle={{ gap: dotsGap, marginTop: dotsMarginTop }}
|
|
144
|
+
horizontal
|
|
145
|
+
onPress={(index: number) => {
|
|
146
|
+
ref.current?.scrollTo({ count: index - progress.value, animated: true });
|
|
147
|
+
}}
|
|
148
|
+
/>
|
|
149
|
+
)}
|
|
150
|
+
</View>
|
|
151
|
+
);
|
|
152
|
+
}
|
|
@@ -3,7 +3,7 @@ import { z } from "zod";
|
|
|
3
3
|
import { View, Text, TouchableOpacity } from "react-native";
|
|
4
4
|
import { BaseBoxProps, BaseBoxPropsSchema } from "./BaseBoxProps";
|
|
5
5
|
import type { UIElement } from "../types";
|
|
6
|
-
import type
|
|
6
|
+
import { dim, type RenderContext } from "./shared";
|
|
7
7
|
|
|
8
8
|
export type CheckboxGroupElementProps = BaseBoxProps & {
|
|
9
9
|
variableName?: string;
|
|
@@ -109,8 +109,8 @@ export const CheckboxGroupComponent = ({ element, ctx }: Props): React.ReactElem
|
|
|
109
109
|
flexWrap: isHorizontal ? "wrap" : undefined,
|
|
110
110
|
alignSelf: element.props.alignSelf,
|
|
111
111
|
gap: element.props.gap ?? 8,
|
|
112
|
-
width: element.props.width,
|
|
113
|
-
height: element.props.height,
|
|
112
|
+
width: dim(element.props.width),
|
|
113
|
+
height: dim(element.props.height),
|
|
114
114
|
margin: element.props.margin,
|
|
115
115
|
marginHorizontal: element.props.marginHorizontal,
|
|
116
116
|
marginVertical: element.props.marginVertical,
|