@rocapine/react-native-onboarding-ui 1.8.0 → 1.9.0

package/dist/UI/Pages/ComposableScreen/elements/StackElement.js

@@ -20,6 +20,7 @@ exports.StackElementPropsSchema = zod_1.z.object({
     minHeight: zod_1.z.number().optional(),
     maxHeight: zod_1.z.number().optional(),
     alignItems: zod_1.z.enum(["flex-start", "center", "flex-end", "stretch"]).optional(),
+    alignSelf: zod_1.z.enum(["auto", "flex-start", "flex-end", "center", "stretch", "baseline"]).optional(),
     justifyContent: zod_1.z.enum(["flex-start", "center", "flex-end", "space-between", "space-around"]).optional(),
     backgroundColor: zod_1.z.string().optional(),
     flexWrap: zod_1.z.enum(["wrap", "nowrap"]).optional(),
@@ -34,6 +35,8 @@ const StackElementComponent = ({ element, ctx, parentType }) => {
     var _a;
     return ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: {
             flexDirection: element.type === "XStack" ? "row" : "column",
+            alignSelf: element.props.alignSelf,
+            alignItems: element.props.alignItems,
             gap: element.props.gap,
             padding: element.props.padding,
             paddingHorizontal: element.props.paddingHorizontal,
@@ -50,7 +53,6 @@ const StackElementComponent = ({ element, ctx, parentType }) => {
             maxHeight: element.props.maxHeight,
             flexShrink: (_a = element.props.flexShrink) !== null && _a !== void 0 ? _a : (parentType === "XStack" ? 1 : undefined),
             flexWrap: element.props.flexWrap,
-            alignItems: element.props.alignItems,
             justifyContent: element.props.justifyContent,
             backgroundColor: element.props.backgroundColor,
             borderWidth: element.props.borderWidth,

package/dist/UI/Pages/ComposableScreen/elements/StackElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackElement.js","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/StackElement.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"StackElement.js","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/StackElement.tsx"],"names":[],"mappings":"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"}

package/dist/UI/Pages/ComposableScreen/elements/VideoElement.d.ts

@@ -13,6 +13,14 @@ export type VideoElementProps = BaseBoxProps & {
 export declare const VideoElementPropsSchema: z.ZodObject<{
     width: z.ZodOptional<z.ZodNumber>;
     height: z.ZodOptional<z.ZodNumber>;
+    alignSelf: z.ZodOptional<z.ZodEnum<{
+        auto: "auto";
+        center: "center";
+        "flex-start": "flex-start";
+        "flex-end": "flex-end";
+        stretch: "stretch";
+        baseline: "baseline";
+    }>>;
     opacity: z.ZodOptional<z.ZodNumber>;
     margin: z.ZodOptional<z.ZodNumber>;
     marginHorizontal: z.ZodOptional<z.ZodNumber>;

package/dist/UI/Pages/ComposableScreen/elements/VideoElement.d.ts.map

@@ -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,EAAE,MAAM,UAAU,CAAC;AAGzC,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,YAiCpE,CAAC"}
+{"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,EAAE,MAAM,UAAU,CAAC;AAGzC,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,YAiCpE,CAAC"}

package/dist/UI/Pages/ComposableScreen/elements/renderElement.d.ts.map

@@ -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;AAYzC,eAAO,MAAM,aAAa,GACxB,SAAS,SAAS,EAClB,KAAK,aAAa,EAClB,aAAa,QAAQ,GAAG,QAAQ,KAC/B,KAAK,CAAC,SA0CR,CAAC"}
+{"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;AAazC,eAAO,MAAM,aAAa,GACxB,SAAS,SAAS,EAClB,KAAK,aAAa,EAClB,aAAa,QAAQ,GAAG,QAAQ,KAC/B,KAAK,CAAC,SA8CR,CAAC"}

package/dist/UI/Pages/ComposableScreen/elements/renderElement.js

@@ -11,6 +11,7 @@ const IconElement_1 = require("./IconElement");
 const VideoElement_1 = require("./VideoElement");
 const InputElement_1 = require("./InputElement");
 const RadioGroupElement_1 = require("./RadioGroupElement");
+const CheckboxGroupElement_1 = require("./CheckboxGroupElement");
 const ButtonElement_1 = require("./ButtonElement");
 const renderElement = (element, ctx, parentType) => {
     if (element.type === "YStack" || element.type === "XStack") {
@@ -40,6 +41,9 @@ const renderElement = (element, ctx, parentType) => {
     if (element.type === "RadioGroup") {
         return (0, jsx_runtime_1.jsx)(RadioGroupElement_1.RadioGroupComponent, { element: element, ctx: ctx }, element.id);
     }
+    if (element.type === "CheckboxGroup") {
+        return (0, jsx_runtime_1.jsx)(CheckboxGroupElement_1.CheckboxGroupComponent, { element: element, ctx: ctx }, element.id);
+    }
     if (element.type === "Button") {
         return (0, jsx_runtime_1.jsx)(ButtonElement_1.ButtonElementComponent, { element: element, ctx: ctx }, element.id);
     }

package/dist/UI/Pages/ComposableScreen/elements/renderElement.js.map

@@ -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,mDAAyD;AAElD,MAAM,aAAa,GAAG,CAC3B,OAAkB,EAClB,GAAkB,EAClB,UAAgC,EACf,EAAE;IACnB,IAAI,OAAO,CAAC,IAAI,KAAK,QAAQ,IAAI,OAAO,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;QAC3D,OAAO,uBAAC,oCAAqB,IAAkB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,IAA9D,OAAO,CAAC,EAAE,CAAwD,CAAC;IACxG,CAAC;IAED,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;QAC5B,OAAO,uBAAC,kCAAoB,IAAkB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,IAA9D,OAAO,CAAC,EAAE,CAAwD,CAAC;IACvG,CAAC;IAED,IAAI,OAAO,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;QAC7B,OAAO,uBAAC,oCAAqB,IAAkB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,IAAtC,OAAO,CAAC,EAAE,CAAgC,CAAC;IAChF,CAAC;IAED,IAAI,OAAO,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;QAC9B,OAAO,uBAAC,sCAAsB,IAAkB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,IAAtC,OAAO,CAAC,EAAE,CAAgC,CAAC;IACjF,CAAC;IAED,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;QAC5B,OAAO,uBAAC,iCAAmB,IAAkB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,IAAtC,OAAO,CAAC,EAAE,CAAgC,CAAC;IAC9E,CAAC;IAED,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;QAC5B,OAAO,uBAAC,kCAAoB,IAAkB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,IAAtC,OAAO,CAAC,EAAE,CAAgC,CAAC;IAC/E,CAAC;IAED,IAAI,OAAO,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;QAC7B,OAAO,uBAAC,mCAAoB,IAAkB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,IAAtC,OAAO,CAAC,EAAE,CAAgC,CAAC;IAC/E,CAAC;IAED,IAAI,OAAO,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;QAC7B,OAAO,uBAAC,oCAAqB,IAAkB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,IAAtC,OAAO,CAAC,EAAE,CAAgC,CAAC;IAChF,CAAC;IAED,IAAI,OAAO,CAAC,IAAI,KAAK,YAAY,EAAE,CAAC;QAClC,OAAO,uBAAC,uCAAmB,IAAkB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,IAAtC,OAAO,CAAC,EAAE,CAAgC,CAAC;IAC9E,CAAC;IAED,IAAI,OAAO,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;QAC9B,OAAO,uBAAC,sCAAsB,IAAkB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,IAAtC,OAAO,CAAC,EAAE,CAAgC,CAAC;IACjF,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AA9CW,QAAA,aAAa,iBA8CxB"}
+{"version":3,"file":"renderElement.js","sourceRoot":"","sources":["../../../../../src/UI/Pages/ComposableScreen/elements/renderElement.tsx"],"names":[],"mappings":"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"}

package/dist/UI/Pages/ComposableScreen/types.d.ts

@@ -9,6 +9,7 @@ import { type VideoElementProps } from "./elements/VideoElement";
 import { type InputElementProps } from "./elements/InputElement";
 import { type ButtonElementProps } from "./elements/ButtonElement";
 import { type RadioGroupElementProps } from "./elements/RadioGroupElement";
+import { type CheckboxGroupElementProps } from "./elements/CheckboxGroupElement";
 export type { BaseBoxProps } from "./elements/BaseBoxProps";
 export { BaseBoxPropsSchema } from "./elements/BaseBoxProps";
 export type { StackElementProps } from "./elements/StackElement";
@@ -21,6 +22,7 @@ export type { VideoElementProps } from "./elements/VideoElement";
 export type { InputElementProps } from "./elements/InputElement";
 export type { ButtonElementProps } from "./elements/ButtonElement";
 export type { RadioGroupElementProps } from "./elements/RadioGroupElement";
+export type { CheckboxGroupElementProps } from "./elements/CheckboxGroupElement";
 export type UIElement = {
     id: string;
     name?: string;
@@ -72,6 +74,11 @@ export type UIElement = {
     name?: string;
     type: "RadioGroup";
     props: RadioGroupElementProps;
+} | {
+    id: string;
+    name?: string;
+    type: "CheckboxGroup";
+    props: CheckboxGroupElementProps;
 };
 export declare const UIElementSchema: z.ZodType<UIElement>;
 export declare const ComposableScreenStepPayloadSchema: z.ZodObject<{

package/dist/UI/Pages/ComposableScreen/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/UI/Pages/ComposableScreen/types.ts"],"names":[],"mappings":"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"}
+{"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;AAElH,YAAY,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,YAAY,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AACjE,YAAY,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC/D,YAAY,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AACjE,YAAY,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AACnE,YAAY,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC/D,YAAY,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC/D,YAAY,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AACjE,YAAY,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AACjE,YAAY,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AACnE,YAAY,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;AAC3E,YAAY,EAAE,yBAAyB,EAAE,MAAM,iCAAiC,CAAC;AAIjF,MAAM,MAAM,SAAS,GACjB;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC1B,KAAK,EAAE,iBAAiB,CAAC;IACzB,QAAQ,EAAE,SAAS,EAAE,CAAC;CACvB,GACD;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,gBAAgB,CAAC;CACzB,GACD;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,iBAAiB,CAAC;CAC1B,GACD;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,kBAAkB,CAAC;CAC3B,GACD;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,gBAAgB,CAAC;CACzB,GACD;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,gBAAgB,CAAC;CACzB,GACD;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,iBAAiB,CAAC;CAC1B,GACD;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,iBAAiB,CAAC;CAC1B,GACD;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,kBAAkB,CAAC;CAC3B,GACD;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,YAAY,CAAC;IACnB,KAAK,EAAE,sBAAsB,CAAC;CAC/B,GACD;IACE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,eAAe,CAAC;IACtB,KAAK,EAAE,yBAAyB,CAAC;CAClC,CAAC;AAEN,eAAO,MAAM,eAAe,EAAE,CAAC,CAAC,OAAO,CAAC,SAAS,CAsEhD,CAAC;AAEF,eAAO,MAAM,iCAAiC;;iBAE5C,CAAC;AAEH,eAAO,MAAM,8BAA8B;;;;;;;;;;;iBASzC,CAAC;AAEH,MAAM,MAAM,wBAAwB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,8BAA8B,CAAC,CAAC"}

package/dist/UI/Pages/ComposableScreen/types.js

@@ -13,6 +13,7 @@ const VideoElement_1 = require("./elements/VideoElement");
 const InputElement_1 = require("./elements/InputElement");
 const ButtonElement_1 = require("./elements/ButtonElement");
 const RadioGroupElement_1 = require("./elements/RadioGroupElement");
+const CheckboxGroupElement_1 = require("./elements/CheckboxGroupElement");
 var BaseBoxProps_1 = require("./elements/BaseBoxProps");
 Object.defineProperty(exports, "BaseBoxPropsSchema", { enumerable: true, get: function () { return BaseBoxProps_1.BaseBoxPropsSchema; } });
 exports.UIElementSchema = zod_1.z.lazy(() => zod_1.z.union([
@@ -77,6 +78,12 @@ exports.UIElementSchema = zod_1.z.lazy(() => zod_1.z.union([
         type: zod_1.z.literal("RadioGroup"),
         props: RadioGroupElement_1.RadioGroupElementPropsSchema,
     }),
+    zod_1.z.object({
+        id: zod_1.z.string(),
+        name: zod_1.z.string().optional(),
+        type: zod_1.z.literal("CheckboxGroup"),
+        props: CheckboxGroupElement_1.CheckboxGroupElementPropsSchema,
+    }),
 ]));
 exports.ComposableScreenStepPayloadSchema = zod_1.z.object({
     elements: zod_1.z.array(exports.UIElementSchema),

package/dist/UI/Pages/ComposableScreen/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/UI/Pages/ComposableScreen/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/UI/Pages/ComposableScreen/types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rocapine/react-native-onboarding-ui",
-  "version": "1.8.0",
+  "version": "1.9.0",
   "description": "UI components and renderers for Rocapine Onboarding Studio - Built on top of the headless SDK",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "peerDependencies": {
     "@react-native-picker/picker": "*",
-    "@rocapine/react-native-onboarding": "^1.8.0",
+    "@rocapine/react-native-onboarding": "^1.9.0",
     "@shopify/react-native-skia": ">=1.0.0",
     "@tanstack/react-query": ">=5.0.0",
     "@types/react": "*",

package/src/UI/Pages/ComposableScreen/elements/BaseBoxProps.ts

@@ -3,6 +3,7 @@ import { z } from "zod";
 export type BaseBoxProps = {
   width?: number;
   height?: number;
+  alignSelf?: "auto" | "flex-start" | "flex-end" | "center" | "stretch" | "baseline";
   opacity?: number;
   margin?: number;
   marginHorizontal?: number;
@@ -18,6 +19,7 @@ export type BaseBoxProps = {
 export const BaseBoxPropsSchema = z.object({
   width: z.number().min(0).optional(),
   height: z.number().min(0).optional(),
+  alignSelf: z.enum(["auto", "flex-start", "flex-end", "center", "stretch", "baseline"]).optional(),
   opacity: z.number().min(0).max(1).optional(),
   margin: z.number().optional(),
   marginHorizontal: z.number().optional(),

package/src/UI/Pages/ComposableScreen/elements/CheckboxGroupElement.tsx

@@ -0,0 +1,200 @@
+import React, { useEffect } from "react";
+import { z } from "zod";
+import { View, Text, TouchableOpacity } from "react-native";
+import { BaseBoxProps, BaseBoxPropsSchema } from "./BaseBoxProps";
+import type { UIElement } from "../types";
+import type { RenderContext } from "./shared";
+
+export type CheckboxGroupElementProps = BaseBoxProps & {
+  variableName?: string;
+  defaultValues?: string[];
+  gap?: number;
+  direction?: "vertical" | "horizontal";
+  items: Array<{ label: string; value: string }>;
+  itemBackgroundColor?: string;
+  itemSelectedBackgroundColor?: string;
+  itemBorderColor?: string;
+  itemSelectedBorderColor?: string;
+  itemBorderRadius?: number;
+  itemBorderWidth?: number;
+  itemColor?: string;
+  itemSelectedColor?: string;
+  itemFontSize?: number;
+  itemFontWeight?: string;
+  itemFontFamily?: string;
+  itemPadding?: number;
+  itemPaddingHorizontal?: number;
+  itemPaddingVertical?: number;
+};
+
+export const CheckboxGroupElementPropsSchema = BaseBoxPropsSchema.extend({
+  variableName: z.string().optional(),
+  defaultValues: z.array(z.string()).optional(),
+  gap: z.number().optional(),
+  direction: z.enum(["vertical", "horizontal"]).optional(),
+  items: z.array(z.object({ label: z.string().trim().min(1, "item label must not be empty"), value: z.string().trim().min(1, "item value must not be empty") })).min(1, "items must not be empty"),
+  itemBackgroundColor: z.string().optional(),
+  itemSelectedBackgroundColor: z.string().optional(),
+  itemBorderColor: z.string().optional(),
+  itemSelectedBorderColor: z.string().optional(),
+  itemBorderRadius: z.number().optional(),
+  itemBorderWidth: z.number().optional(),
+  itemColor: z.string().optional(),
+  itemSelectedColor: z.string().optional(),
+  itemFontSize: z.number().optional(),
+  itemFontWeight: z.string().optional(),
+  itemFontFamily: z.string().optional(),
+  itemPadding: z.number().optional(),
+  itemPaddingHorizontal: z.number().optional(),
+  itemPaddingVertical: z.number().optional(),
+}).superRefine((data, ctx) => {
+  const values = data.items.map((i) => i.value);
+  const unique = new Set(values);
+  if (unique.size !== values.length) {
+    ctx.addIssue({ code: z.ZodIssueCode.custom, message: "item values must be unique", path: ["items"] });
+  }
+  if (data.defaultValues !== undefined) {
+    data.defaultValues.forEach((dv, i) => {
+      if (!unique.has(dv)) {
+        ctx.addIssue({ code: z.ZodIssueCode.custom, message: `defaultValues entry "${dv}" must match one of the item values`, path: ["defaultValues", i] });
+      }
+    });
+  }
+});
+
+type CheckboxGroupUIElement = Extract<UIElement, { type: "CheckboxGroup" }>;
+
+type Props = {
+  element: CheckboxGroupUIElement;
+  ctx: RenderContext;
+};
+
+export const CheckboxGroupComponent = ({ element, ctx }: Props): React.ReactElement => {
+  const { theme, variables, setVariable } = ctx;
+  // The variable stores a JSON-serialised string[] to stay compatible with the string-based variable system.
+  const rawValue = element.props.variableName ? variables[element.props.variableName]?.value : undefined;
+  const selectedValues: string[] | undefined = (() => {
+    if (typeof rawValue !== "string") return undefined;
+    try { return JSON.parse(rawValue) as string[]; } catch { return undefined; }
+  })();
+
+  useEffect(() => {
+    if (element.props.variableName && element.props.defaultValues && selectedValues === undefined) {
+      const defaultLabels = element.props.defaultValues.map((dv) => element.props.items.find((i) => i.value === dv)?.label ?? dv);
+      setVariable(element.props.variableName, {
+        value: JSON.stringify(element.props.defaultValues),
+        label: defaultLabels.join(", "),
+      });
+    }
+  }, [element.props.variableName, element.props.defaultValues, element.props.items, selectedValues]);
+
+  const handleToggle = (value: string, label: string) => {
+    if (!element.props.variableName) return;
+    const current: string[] = selectedValues ?? [];
+    const next = current.includes(value) ? current.filter((v) => v !== value) : [...current, value];
+    const nextLabels = next.map((v) => element.props.items.find((i) => i.value === v)?.label ?? v);
+    setVariable(element.props.variableName, {
+      value: JSON.stringify(next),
+      label: nextLabels.join(", "),
+    });
+  };
+
+  const isHorizontal = element.props.direction === "horizontal";
+
+  return (
+    <View
+      accessibilityRole="list"
+      style={{
+        flexDirection: isHorizontal ? "row" : "column",
+        flexWrap: isHorizontal ? "wrap" : undefined,
+        alignSelf: element.props.alignSelf,
+        gap: element.props.gap ?? 8,
+        width: element.props.width,
+        height: element.props.height,
+        margin: element.props.margin,
+        marginHorizontal: element.props.marginHorizontal,
+        marginVertical: element.props.marginVertical,
+        padding: element.props.padding,
+        paddingHorizontal: element.props.paddingHorizontal,
+        paddingVertical: element.props.paddingVertical,
+        borderWidth: element.props.borderWidth,
+        borderRadius: element.props.borderRadius,
+        borderColor: element.props.borderColor,
+        opacity: element.props.opacity,
+      }}
+    >
+      {element.props.items.map((item) => {
+        const isSelected = (selectedValues ?? []).includes(item.value);
+        const bgColor = isSelected
+          ? (element.props.itemSelectedBackgroundColor ?? (theme.colors.primary.startsWith("#") ? theme.colors.primary + "1A" : theme.colors.primary))
+          : (element.props.itemBackgroundColor ?? "transparent");
+        const textColor = isSelected
+          ? (element.props.itemSelectedColor ?? theme.colors.primary)
+          : (element.props.itemColor ?? theme.colors.text.primary);
+        const borderColor = isSelected
+          ? (element.props.itemSelectedBorderColor ?? theme.colors.primary)
+          : (element.props.itemBorderColor ?? theme.colors.neutral.low);
+
+        return (
+          <TouchableOpacity
+            key={item.value}
+            activeOpacity={0.7}
+            onPress={() => handleToggle(item.value, item.label)}
+            accessibilityRole="checkbox"
+            accessibilityState={{ checked: isSelected }}
+            accessibilityLabel={item.label}
+            style={{
+              flexDirection: "row",
+              alignItems: "center",
+              gap: 12,
+              backgroundColor: bgColor,
+              borderRadius: element.props.itemBorderRadius ?? 8,
+              borderWidth: element.props.itemBorderWidth ?? 1,
+              borderColor: borderColor,
+              padding: element.props.itemPadding ?? (element.props.itemPaddingHorizontal === undefined && element.props.itemPaddingVertical === undefined ? 12 : undefined),
+              paddingHorizontal: element.props.itemPaddingHorizontal,
+              paddingVertical: element.props.itemPaddingVertical,
+            }}
+          >
+            <View
+              style={{
+                width: 20,
+                height: 20,
+                borderRadius: 4,
+                borderWidth: 2,
+                borderColor: isSelected ? theme.colors.primary : theme.colors.neutral.medium,
+                alignItems: "center",
+                justifyContent: "center",
+                backgroundColor: isSelected ? theme.colors.primary : "transparent",
+              }}
+            >
+              {isSelected && (
+                <Text
+                  style={{
+                    color: "#fff",
+                    fontSize: 12,
+                    fontWeight: "700",
+                    lineHeight: 14,
+                  }}
+                >
+                  ✓
+                </Text>
+              )}
+            </View>
+            <Text
+              style={{
+                flexShrink: 1,
+                color: textColor,
+                fontSize: element.props.itemFontSize ?? theme.typography.textStyles.body.fontSize,
+                fontWeight: (element.props.itemFontWeight as any) ?? theme.typography.textStyles.body.fontWeight,
+                fontFamily: element.props.itemFontFamily,
+              }}
+            >
+              {item.label}
+            </Text>
+          </TouchableOpacity>
+        );
+      })}
+    </View>
+  );
+};

package/src/UI/Pages/ComposableScreen/elements/InputElement.tsx

@@ -71,45 +71,39 @@ export const InputElementComponent = ({ element, ctx }: Props): React.ReactEleme
   };
 
   return (
-    <View
+    <TextInput
+      value={value}
+      onChangeText={handleChange}
+      placeholder={element.props.placeholder}
+      placeholderTextColor={element.props.placeholderColor ?? theme.colors.text.tertiary}
+      keyboardType={element.props.keyboardType ?? "default"}
+      returnKeyType={element.props.returnKeyType ?? "done"}
+      autoCapitalize={element.props.autoCapitalize ?? "sentences"}
+      secureTextEntry={element.props.secureTextEntry ?? false}
+      maxLength={element.props.maxLength}
+      multiline={element.props.multiline ?? false}
+      numberOfLines={element.props.numberOfLines}
+      editable={element.props.editable ?? true}
       style={{
-        backgroundColor: element.props.backgroundColor ?? theme.colors.neutral.lowest,
-        borderWidth: element.props.borderWidth ?? 1,
-        borderRadius: element.props.borderRadius ?? 8,
-        borderColor: element.props.borderColor ?? theme.colors.neutral.low,
+        alignSelf: element.props.alignSelf,
         width: element.props.width,
         height: element.props.height,
         opacity: element.props.opacity,
         margin: element.props.margin,
         marginHorizontal: element.props.marginHorizontal,
         marginVertical: element.props.marginVertical,
-        overflow: "hidden",
+        backgroundColor: element.props.backgroundColor ?? theme.colors.neutral.lowest,
+        borderWidth: element.props.borderWidth ?? 1,
+        borderRadius: element.props.borderRadius ?? 8,
+        borderColor: element.props.borderColor ?? theme.colors.neutral.low,
+        color: element.props.color ?? theme.colors.text.primary,
+        fontSize: element.props.fontSize ?? theme.typography.textStyles.body.fontSize,
+        fontWeight: element.props.fontWeight as any,
+        textAlign: element.props.textAlign,
+        padding: element.props.padding ?? 12,
+        paddingHorizontal: element.props.paddingHorizontal,
+        paddingVertical: element.props.paddingVertical,
       }}
-    >
-      <TextInput
-        value={value}
-        onChangeText={handleChange}
-        placeholder={element.props.placeholder}
-        placeholderTextColor={element.props.placeholderColor ?? theme.colors.text.tertiary}
-        keyboardType={element.props.keyboardType ?? "default"}
-        returnKeyType={element.props.returnKeyType ?? "done"}
-        autoCapitalize={element.props.autoCapitalize ?? "sentences"}
-        secureTextEntry={element.props.secureTextEntry ?? false}
-        maxLength={element.props.maxLength}
-        multiline={element.props.multiline ?? false}
-        numberOfLines={element.props.numberOfLines}
-        editable={element.props.editable ?? true}
-        style={{
-          flex: 1,
-          color: element.props.color ?? theme.colors.text.primary,
-          fontSize: element.props.fontSize ?? theme.typography.textStyles.body.fontSize,
-          fontWeight: element.props.fontWeight as any,
-          textAlign: element.props.textAlign,
-          padding: element.props.padding ?? 12,
-          paddingHorizontal: element.props.paddingHorizontal,
-          paddingVertical: element.props.paddingVertical,
-        }}
-      />
-    </View>
+    />
   );
 };

package/src/UI/Pages/ComposableScreen/elements/RadioGroupElement.tsx

@@ -90,6 +90,7 @@ export const RadioGroupComponent = ({ element, ctx }: Props): React.ReactElement
       style={{
         flexDirection: isHorizontal ? "row" : "column",
         flexWrap: isHorizontal ? "wrap" : undefined,
+        alignSelf: element.props.alignSelf,
         gap: element.props.gap ?? 8,
         width: element.props.width,
         height: element.props.height,
@@ -164,7 +165,7 @@ export const RadioGroupComponent = ({ element, ctx }: Props): React.ReactElement
             </View>
             <Text
               style={{
-                flex: 1,
+                flexShrink: 1,
                 color: textColor,
                 fontSize: element.props.itemFontSize ?? theme.typography.textStyles.body.fontSize,
                 fontWeight: (element.props.itemFontWeight as any) ?? theme.typography.textStyles.body.fontWeight,

package/src/UI/Pages/ComposableScreen/elements/StackElement.tsx

@@ -20,6 +20,7 @@ export type StackElementProps = {
   minHeight?: number;
   maxHeight?: number;
   alignItems?: "flex-start" | "center" | "flex-end" | "stretch";
+  alignSelf?: "auto" | "flex-start" | "flex-end" | "center" | "stretch" | "baseline";
   justifyContent?: "flex-start" | "center" | "flex-end" | "space-between" | "space-around";
   backgroundColor?: string;
   flexWrap?: "wrap" | "nowrap";
@@ -47,6 +48,7 @@ export const StackElementPropsSchema = z.object({
   minHeight: z.number().optional(),
   maxHeight: z.number().optional(),
   alignItems: z.enum(["flex-start", "center", "flex-end", "stretch"]).optional(),
+  alignSelf: z.enum(["auto", "flex-start", "flex-end", "center", "stretch", "baseline"]).optional(),
   justifyContent: z.enum(["flex-start", "center", "flex-end", "space-between", "space-around"]).optional(),
   backgroundColor: z.string().optional(),
   flexWrap: z.enum(["wrap", "nowrap"]).optional(),
@@ -71,6 +73,8 @@ export const StackElementComponent = ({ element, ctx, parentType }: Props): Reac
     <View
       style={{
         flexDirection: element.type === "XStack" ? "row" : "column",
+        alignSelf: element.props.alignSelf,
+        alignItems: element.props.alignItems,
         gap: element.props.gap,
         padding: element.props.padding,
         paddingHorizontal: element.props.paddingHorizontal,
@@ -87,7 +91,6 @@ export const StackElementComponent = ({ element, ctx, parentType }: Props): Reac
         maxHeight: element.props.maxHeight,
         flexShrink: element.props.flexShrink ?? (parentType === "XStack" ? 1 : undefined),
         flexWrap: element.props.flexWrap,
-        alignItems: element.props.alignItems,
         justifyContent: element.props.justifyContent,
         backgroundColor: element.props.backgroundColor,
         borderWidth: element.props.borderWidth,

package/src/UI/Pages/ComposableScreen/elements/renderElement.tsx

@@ -10,6 +10,7 @@ import { IconElementComponent } from "./IconElement";
 import { VideoElementRenderer } from "./VideoElement";
 import { InputElementComponent } from "./InputElement";
 import { RadioGroupComponent } from "./RadioGroupElement";
+import { CheckboxGroupComponent } from "./CheckboxGroupElement";
 import { ButtonElementComponent } from "./ButtonElement";
 
 export const renderElement = (
@@ -53,6 +54,10 @@ export const renderElement = (
     return <RadioGroupComponent key={element.id} element={element} ctx={ctx} />;
   }
 
+  if (element.type === "CheckboxGroup") {
+    return <CheckboxGroupComponent key={element.id} element={element} ctx={ctx} />;
+  }
+
   if (element.type === "Button") {
     return <ButtonElementComponent key={element.id} element={element} ctx={ctx} />;
   }

package/src/UI/Pages/ComposableScreen/types.ts

@@ -10,6 +10,7 @@ import { type VideoElementProps, VideoElementPropsSchema } from "./elements/Vide
 import { type InputElementProps, InputElementPropsSchema } from "./elements/InputElement";
 import { type ButtonElementProps, ButtonElementPropsSchema } from "./elements/ButtonElement";
 import { type RadioGroupElementProps, RadioGroupElementPropsSchema } from "./elements/RadioGroupElement";
+import { type CheckboxGroupElementProps, CheckboxGroupElementPropsSchema } from "./elements/CheckboxGroupElement";
 
 export type { BaseBoxProps } from "./elements/BaseBoxProps";
 export { BaseBoxPropsSchema } from "./elements/BaseBoxProps";
@@ -23,6 +24,7 @@ export type { VideoElementProps } from "./elements/VideoElement";
 export type { InputElementProps } from "./elements/InputElement";
 export type { ButtonElementProps } from "./elements/ButtonElement";
 export type { RadioGroupElementProps } from "./elements/RadioGroupElement";
+export type { CheckboxGroupElementProps } from "./elements/CheckboxGroupElement";
 
 // UIElement union — must live here (not in elements/) to avoid circular deps
 // because the Stack variant's children: UIElement[] references itself.
@@ -87,6 +89,12 @@ export type UIElement =
       name?: string;
       type: "RadioGroup";
       props: RadioGroupElementProps;
+    }
+  | {
+      id: string;
+      name?: string;
+      type: "CheckboxGroup";
+      props: CheckboxGroupElementProps;
     };
 
 export const UIElementSchema: z.ZodType<UIElement> = z.lazy(() =>
@@ -152,6 +160,12 @@ export const UIElementSchema: z.ZodType<UIElement> = z.lazy(() =>
       type: z.literal("RadioGroup"),
       props: RadioGroupElementPropsSchema,
     }),
+    z.object({
+      id: z.string(),
+      name: z.string().optional(),
+      type: z.literal("CheckboxGroup"),
+      props: CheckboxGroupElementPropsSchema,
+    }),
   ])
 );