@plitzi/sdk-elements 0.37.1 → 0.37.2

package/dist/elements/declarations/index.d.ts

@@ -37,6 +37,81 @@ export declare const elementDeclarations: {
     readonly ApiContainer: {
         readonly type: "apiContainer";
         readonly sourceType: "apiContainer";
+        readonly triggers: {
+            readonly onApiError: {
+                readonly action: "onApiError";
+                readonly title: "On Api Error";
+                readonly type: "trigger";
+                readonly params: {};
+                readonly preview: {
+                    readonly url: "";
+                    readonly method: "";
+                    readonly status: "";
+                    readonly data: "";
+                };
+            };
+            readonly onApiSuccess: {
+                readonly action: "onApiSuccess";
+                readonly title: "On Api Success";
+                readonly type: "trigger";
+                readonly params: {};
+                readonly preview: {
+                    readonly url: "";
+                    readonly method: "";
+                    readonly status: "";
+                    readonly data: "";
+                };
+            };
+        };
+        readonly callbacks: {
+            readonly performQuery: {
+                readonly action: "performQuery";
+                readonly title: "Perform Query";
+                readonly type: "callback";
+                readonly preview: {};
+                readonly params: {};
+            };
+            readonly loadMore: {
+                readonly action: "loadMore";
+                readonly title: "Load More";
+                readonly type: "callback";
+                readonly preview: {};
+                readonly params: {};
+            };
+            readonly goToPage: {
+                readonly action: "goToPage";
+                readonly title: "Go To Page";
+                readonly type: "callback";
+                readonly preview: {};
+                readonly params: {
+                    readonly page: {
+                        readonly label: "Page";
+                        readonly defaultValue: "1";
+                        readonly type: "text";
+                    };
+                };
+            };
+            readonly writeRecord: {
+                readonly action: "writeRecord";
+                readonly title: "Write Record";
+                readonly type: "callback";
+                readonly preview: {
+                    readonly action: "create";
+                };
+                readonly params: {
+                    readonly action: {
+                        readonly label: "Endpoint";
+                        readonly defaultValue: "create";
+                        readonly type: "text";
+                    };
+                    readonly recordId: {
+                        readonly label: "Record Id";
+                        readonly defaultValue: "";
+                        readonly type: "text";
+                    };
+                };
+            };
+        };
         readonly content: {
             readonly attributes: {
                 readonly query: "";
@@ -434,6 +509,87 @@ export declare const elementDeclarations: {
     readonly DialogContainer: {
         readonly type: "dialogContainer";
         readonly sourceType: "dialogContainer";
+        readonly triggers: {
+            readonly onDialogAccept: {
+                readonly action: "onDialogAccept";
+                readonly title: "On Dialog Accept";
+                readonly type: "trigger";
+                readonly params: {
+                    readonly metadata: {
+                        readonly type: "text";
+                        readonly defaultValue: "";
+                    };
+                };
+                readonly preview: {
+                    readonly metadata: "";
+                };
+            };
+            readonly onDialogReject: {
+                readonly action: "onDialogReject";
+                readonly title: "On Dialog Reject";
+                readonly type: "trigger";
+                readonly params: {
+                    readonly metadata: {
+                        readonly type: "text";
+                        readonly defaultValue: "";
+                    };
+                };
+                readonly preview: {
+                    readonly metadata: "";
+                };
+            };
+            readonly onDialogOpen: {
+                readonly action: "onDialogOpen";
+                readonly title: "On Dialog Open";
+                readonly type: "trigger";
+                readonly params: {
+                    readonly metadata: {
+                        readonly type: "text";
+                        readonly defaultValue: "";
+                    };
+                };
+                readonly preview: {
+                    readonly metadata: "";
+                };
+            };
+            readonly onDialogClose: {
+                readonly action: "onDialogClose";
+                readonly title: "On Dialog Close";
+                readonly type: "trigger";
+                readonly params: {
+                    readonly metadata: {
+                        readonly type: "text";
+                        readonly defaultValue: "";
+                    };
+                };
+                readonly preview: {
+                    readonly metadata: "";
+                };
+            };
+        };
+        readonly callbacks: {
+            readonly openDialog: {
+                readonly action: "openDialog";
+                readonly title: "Open Dialog";
+                readonly type: "callback";
+                readonly params: {
+                    readonly metadata: {
+                        readonly type: "text";
+                        readonly defaultValue: "";
+                    };
+                };
+                readonly preview: {
+                    readonly metadata: "";
+                };
+            };
+            readonly closeDialog: {
+                readonly action: "closeDialog";
+                readonly title: "Close Dialog";
+                readonly type: "callback";
+                readonly preview: {};
+                readonly params: {};
+            };
+        };
         readonly content: {
             readonly attributes: {
                 readonly headerLabel: "Dialog Header";
@@ -515,7 +671,7 @@ export declare const elementDeclarations: {
                             readonly left: "50%";
                             readonly width: "500px";
                             readonly height: "300px";
-                            readonly 'background-color': "white";
+                            readonly 'background-color': "light-dark(white, oklch(0.21 0.006 285.885))";
                             readonly transform: "translate3d(-50%, -50%, 0px)";
                             readonly 'padding-top': "20px";
                             readonly 'padding-bottom': "20px";
@@ -664,6 +820,7 @@ export declare const elementDeclarations: {
     }>>;
     readonly DropdownPopup: {
         readonly type: "dropdownPopup";
+        readonly ancestorType: "dropdown";
         readonly content: {
             readonly attributes: {};
             readonly definition: {
@@ -701,7 +858,7 @@ export declare const elementDeclarations: {
                 readonly style: {
                     readonly base: {
                         readonly default: {
-                            readonly 'background-color': "white";
+                            readonly 'background-color': "light-dark(white, oklch(0.21 0.006 285.885))";
                             readonly 'padding-right': "4px";
                             readonly 'padding-bottom': "4px";
                             readonly 'padding-left': "4px";
@@ -784,6 +941,63 @@ export declare const elementDeclarations: {
     readonly Form: {
         readonly type: "form";
         readonly sourceType: "apiContainer";
+        readonly triggers: {
+            readonly onSubmit: {
+                readonly action: "onSubmit";
+                readonly title: "On Form Submit";
+                readonly type: "trigger";
+                readonly params: {};
+                readonly preview: {
+                    readonly values: {};
+                    readonly actionUrl: "";
+                    readonly method: "";
+                };
+            };
+        };
+        readonly callbacks: {
+            readonly performReset: {
+                readonly action: "performReset";
+                readonly title: "Reset Form";
+                readonly type: "callback";
+                readonly params: {};
+            };
+            readonly setFieldValue: {
+                readonly action: "setFieldValue";
+                readonly title: "Set Field Value";
+                readonly type: "callback";
+                readonly preview: {};
+                readonly params: {
+                    readonly name: {
+                        readonly label: "Field Name";
+                        readonly defaultValue: undefined;
+                        readonly type: "select";
+                        readonly options: [];
+                    };
+                    readonly value: {
+                        readonly type: "text";
+                        readonly defaultValue: "";
+                    };
+                };
+            };
+            readonly setFieldError: {
+                readonly action: "setFieldError";
+                readonly title: "Set Field Error";
+                readonly type: "callback";
+                readonly preview: {};
+                readonly params: {
+                    readonly name: {
+                        readonly label: "Field Name";
+                        readonly defaultValue: undefined;
+                        readonly type: "select";
+                        readonly options: [];
+                    };
+                    readonly error: {
+                        readonly type: "text";
+                        readonly defaultValue: "";
+                    };
+                };
+            };
+        };
         readonly content: {
             readonly attributes: {
                 readonly method: "get";
@@ -844,6 +1058,18 @@ export declare const elementDeclarations: {
     }>>;
     readonly FormControl: {
         readonly type: "formControl";
+        readonly triggers: {
+            readonly onChange: {
+                readonly action: "onChange";
+                readonly title: "On Change";
+                readonly type: "trigger";
+                readonly params: {};
+                readonly preview: {
+                    readonly value: "";
+                    readonly name: "";
+                };
+            };
+        };
         readonly content: {
             readonly attributes: {
                 readonly subType: "text";
@@ -1889,6 +2115,52 @@ export declare const elementDeclarations: {
     readonly ModalContainer: {
         readonly type: "modalContainer";
         readonly sourceType: "modalContainer";
+        readonly triggers: {
+            readonly onModalOpen: {
+                readonly action: "onModalOpen";
+                readonly title: "On Modal Open";
+                readonly type: "trigger";
+                readonly params: {
+                    readonly metadata: {
+                        readonly type: "text";
+                        readonly defaultValue: "";
+                    };
+                };
+                readonly preview: {
+                    readonly metadata: "";
+                };
+            };
+            readonly onModalClose: {
+                readonly action: "onModalClose";
+                readonly title: "On Modal Close";
+                readonly type: "trigger";
+                readonly preview: {};
+                readonly params: {};
+            };
+        };
+        readonly callbacks: {
+            readonly openModal: {
+                readonly action: "openModal";
+                readonly title: "Open Modal";
+                readonly type: "callback";
+                readonly params: {
+                    readonly metadata: {
+                        readonly type: "text";
+                        readonly defaultValue: "";
+                    };
+                };
+                readonly preview: {
+                    readonly metadata: "";
+                };
+            };
+            readonly closeModal: {
+                readonly action: "closeModal";
+                readonly title: "Close Modal";
+                readonly type: "callback";
+                readonly params: {};
+                readonly preview: {};
+            };
+        };
         readonly content: {
             readonly attributes: {
                 readonly title: "Modal Header";
@@ -1965,7 +2237,7 @@ export declare const elementDeclarations: {
                             readonly left: "50%";
                             readonly width: "500px";
                             readonly height: "300px";
-                            readonly 'background-color': "white";
+                            readonly 'background-color': "light-dark(white, oklch(0.21 0.006 285.885))";
                             readonly transform: "translate3d(-50%, -50%, 0px)";
                             readonly 'border-top-left-radius': "8px";
                             readonly 'border-top-right-radius': "8px";
@@ -1979,7 +2251,7 @@ export declare const elementDeclarations: {
                             readonly 'align-items': "center";
                             readonly 'justify-content': "space-between";
                             readonly 'border-bottom-width': "1px";
-                            readonly 'border-bottom-color': "#d1d5db";
+                            readonly 'border-bottom-color': "light-dark(#d1d5db, oklch(0.37 0.013 285.805))";
                             readonly 'border-bottom-style': "solid";
                             readonly 'padding-left': "20px";
                             readonly 'padding-right': "20px";
@@ -2416,6 +2688,19 @@ export declare const elementDeclarations: {
     } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<unknown>;
     readonly Page: {
         readonly type: "page";
+        readonly triggers: {
+            readonly onPageLoad: {
+                readonly action: "onPageLoad";
+                readonly title: "On Page Load";
+                readonly type: "trigger";
+                readonly params: {};
+                readonly preview: {
+                    readonly pageId: "";
+                    readonly routeParams: "";
+                    readonly queryParams: "";
+                };
+            };
+        };
         readonly content: {
             readonly attributes: {
                 readonly enabled: true;
@@ -2491,6 +2776,17 @@ export declare const elementDeclarations: {
     }>>;
     readonly Pagination: {
         readonly type: "pagination";
+        readonly triggers: {
+            readonly onPageChange: {
+                readonly action: "onPageChange";
+                readonly title: "On Page Change";
+                readonly type: "trigger";
+                readonly params: {};
+                readonly preview: {
+                    readonly page: "1";
+                };
+            };
+        };
         readonly content: {
             readonly attributes: {
                 readonly pageInfo: {};
@@ -2775,6 +3071,7 @@ export declare const elementDeclarations: {
     } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<unknown>;
     readonly TabContainerBody: {
         readonly type: "tabContainerBody";
+        readonly ancestorType: "tabContainer";
         readonly content: {
             readonly attributes: {};
             readonly definition: {
@@ -2824,6 +3121,7 @@ export declare const elementDeclarations: {
     } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<unknown>;
     readonly TabContainerHeader: {
         readonly type: "tabContainerHeader";
+        readonly ancestorType: "tabContainer";
         readonly content: {
             readonly attributes: {};
             readonly definition: {
@@ -2975,6 +3273,17 @@ export declare const elementDeclarations: {
     }>>;
     readonly ThemeToggle: {
         readonly type: "themeToggle";
+        readonly triggers: {
+            readonly onThemeChange: {
+                readonly action: "onThemeChange";
+                readonly title: "On Theme Change";
+                readonly type: "trigger";
+                readonly params: {};
+                readonly preview: {
+                    readonly theme: "dark";
+                };
+            };
+        };
         readonly content: {
             readonly attributes: {
                 readonly subType: "switch";
@@ -2986,7 +3295,7 @@ export declare const elementDeclarations: {
             readonly definition: {
                 readonly label: "Theme Toggle";
                 readonly type: "themeToggle";
-                readonly description: "Lets a visitor choose light or dark. It writes the choice on the document root, where a space stylesheet is already looking for it, and remembers it — so the machine decides until somebody says otherwise. It ships no colours of its own: style it with the space own classes, and use `data-theme-icon` to decide which icon each scheme shows.";
+                readonly description: "Lets a visitor choose light or dark. It writes the choice on the document root, where a space stylesheet is already looking for it, and remembers it — so the machine decides until somebody says otherwise. It ships no colours of its own: style it with the space own classes. It shows the icon of the scheme in use by default; key a rule off `data-theme-icon` to change that.";
                 readonly items: readonly [];
                 readonly bindings: {};
                 readonly styleSelectors: {

package/dist/elements/form/Form/Form.d.ts

@@ -35,9 +35,9 @@ export type FormContextValue = {
     setFieldValue: (name: string, value: FieldValue | null) => void;
     setFieldError: (name: string, error: string) => void;
 };
-declare const Form: ({ ref, className, children, method, actionUrl, managedByInteractions, noValidate, errors, values }: FormProps) => import("react").JSX.Element;
+declare const Form: ({ ref, className, children, method, actionUrl, managedByInteractions, noValidate, errors, values }: FormProps) => import('react').JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<FormProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<FormProps>): import('react').JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/form/Form/Form.mjs

@@ -106,17 +106,13 @@ var b = ({ ref: e, className: b = "", children: x, method: S = "get", actionUrl:
 		fields: G
 	});
 	let q = s(() => ({ onSubmit: {
-		action: "onSubmit",
-		title: "On Form Submit",
-		type: "trigger",
-		params: {},
+		...r.triggers.onSubmit,
 		preview: {
+			...r.triggers.onSubmit.preview,
 			values: Object.values(O).reduce((e, t) => ({
 				...e,
 				[t.name]: ""
-			}), {}),
-			actionUrl: "",
-			method: ""
+			}), {})
 		}
 	} }), [O]), J = a((e) => {
 		let t = [...A.current].reduce((e, [t, n]) => {
@@ -165,59 +161,43 @@ var b = ({ ref: e, className: b = "", children: x, method: S = "get", actionUrl:
 	}, [U]), Z = a((e) => {
 		let { name: t, error: n } = e;
 		W(t, n);
-	}, [W]), Q = s(() => ({
-		performReset: {
-			action: "performReset",
-			title: `Reset ${N}`,
-			type: "callback",
-			callback: Y,
-			params: {}
-		},
-		setFieldValue: {
-			action: "setFieldValue",
-			title: `Set Field Value ${N}`,
-			type: "callback",
-			callback: X,
-			preview: {},
-			params: {
-				name: {
-					label: "Field Name",
-					defaultValue: void 0,
-					type: "select",
-					options: Object.values(O).map((e) => ({
-						value: e.name,
-						label: e.name
-					}))
-				},
-				value: {
-					type: "text",
-					defaultValue: ""
+	}, [W]), Q = s(() => {
+		let { performReset: e, setFieldValue: t, setFieldError: n } = r.callbacks, i = Object.values(O).map((e) => ({
+			value: e.name,
+			label: e.name
+		}));
+		return {
+			performReset: {
+				...e,
+				title: `Reset ${N}`,
+				callback: Y
+			},
+			setFieldValue: {
+				...t,
+				title: `Set Field Value ${N}`,
+				callback: X,
+				params: {
+					...t.params,
+					name: {
+						...t.params.name,
+						options: i
+					}
 				}
-			}
-		},
-		setFieldError: {
-			action: "setFieldError",
-			title: `Set Field Error ${N}`,
-			type: "callback",
-			callback: Z,
-			preview: {},
-			params: {
-				name: {
-					label: "Field Name",
-					defaultValue: void 0,
-					type: "select",
-					options: Object.values(O).map((e) => ({
-						value: e.name,
-						label: e.name
-					}))
-				},
-				error: {
-					type: "text",
-					defaultValue: ""
+			},
+			setFieldError: {
+				...n,
+				title: `Set Field Error ${N}`,
+				callback: Z,
+				params: {
+					...n.params,
+					name: {
+						...n.params.name,
+						options: i
+					}
 				}
 			}
-		}
-	}), [
+		};
+	}, [
 		N,
 		Y,
 		X,

package/dist/elements/form/Form/Settings.d.ts

@@ -5,5 +5,5 @@ type SettingsProps = {
     actionUrl?: string;
     onUpdate?: (key: string, value: string | boolean | number) => void;
 };
-declare const Settings: ({ method, managedByInteractions, noValidate, actionUrl, onUpdate }: SettingsProps) => import("react").JSX.Element;
+declare const Settings: ({ method, managedByInteractions, noValidate, actionUrl, onUpdate }: SettingsProps) => import('react').JSX.Element;
 export default Settings;

package/dist/elements/form/Form/declaration.d.ts

@@ -5,6 +5,63 @@ export type FormAttributes = AuthorableAttributes<FormProps>;
 declare const declaration: {
     readonly type: "form";
     readonly sourceType: "apiContainer";
+    readonly triggers: {
+        readonly onSubmit: {
+            readonly action: "onSubmit";
+            readonly title: "On Form Submit";
+            readonly type: "trigger";
+            readonly params: {};
+            readonly preview: {
+                readonly values: {};
+                readonly actionUrl: "";
+                readonly method: "";
+            };
+        };
+    };
+    readonly callbacks: {
+        readonly performReset: {
+            readonly action: "performReset";
+            readonly title: "Reset Form";
+            readonly type: "callback";
+            readonly params: {};
+        };
+        readonly setFieldValue: {
+            readonly action: "setFieldValue";
+            readonly title: "Set Field Value";
+            readonly type: "callback";
+            readonly preview: {};
+            readonly params: {
+                readonly name: {
+                    readonly label: "Field Name";
+                    readonly defaultValue: undefined;
+                    readonly type: "select";
+                    readonly options: [];
+                };
+                readonly value: {
+                    readonly type: "text";
+                    readonly defaultValue: "";
+                };
+            };
+        };
+        readonly setFieldError: {
+            readonly action: "setFieldError";
+            readonly title: "Set Field Error";
+            readonly type: "callback";
+            readonly preview: {};
+            readonly params: {
+                readonly name: {
+                    readonly label: "Field Name";
+                    readonly defaultValue: undefined;
+                    readonly type: "select";
+                    readonly options: [];
+                };
+                readonly error: {
+                    readonly type: "text";
+                    readonly defaultValue: "";
+                };
+            };
+        };
+    };
     readonly content: {
         readonly attributes: {
             readonly method: "get";

package/dist/elements/form/Form/declaration.mjs

@@ -3,6 +3,61 @@ import { elementDeclaration as e } from "@plitzi/sdk-shared/authoring/declare";
 var t = e()({
 	type: "form",
 	sourceType: "apiContainer",
+	triggers: { onSubmit: {
+		action: "onSubmit",
+		title: "On Form Submit",
+		type: "trigger",
+		params: {},
+		preview: {
+			values: {},
+			actionUrl: "",
+			method: ""
+		}
+	} },
+	callbacks: {
+		performReset: {
+			action: "performReset",
+			title: "Reset Form",
+			type: "callback",
+			params: {}
+		},
+		setFieldValue: {
+			action: "setFieldValue",
+			title: "Set Field Value",
+			type: "callback",
+			preview: {},
+			params: {
+				name: {
+					label: "Field Name",
+					defaultValue: void 0,
+					type: "select",
+					options: []
+				},
+				value: {
+					type: "text",
+					defaultValue: ""
+				}
+			}
+		},
+		setFieldError: {
+			action: "setFieldError",
+			title: "Set Field Error",
+			type: "callback",
+			preview: {},
+			params: {
+				name: {
+					label: "Field Name",
+					defaultValue: void 0,
+					type: "select",
+					options: []
+				},
+				error: {
+					type: "text",
+					defaultValue: ""
+				}
+			}
+		}
+	},
 	content: {
 		attributes: {
 			method: "get",