@plitzi/sdk-elements 0.38.6 → 0.38.7

package/dist/elements/provider/ApiContainer/hooks/useApi.mjs

@@ -1,8 +1,8 @@
 import { useCallback as e, useId as t, useMemo as n } from "react";
 import { hasValidToken as r } from "@plitzi/sdk-shared/helpers/twigWrapper";
 import { emptyObject as i } from "@plitzi/sdk-shared/helpers/utils";
-import { authFailureFromResponse as a, reportAuthFailure as o } from "@plitzi/sdk-shared/auth";
-import { requestKey as s, useQuery as c } from "@plitzi/sdk-shared/queries";
+import { requestKey as a, useQuery as o } from "@plitzi/sdk-shared/queries";
+import { authFailureFromResponse as s, reportAuthFailure as c } from "@plitzi/sdk-shared/auth";
 //#region src/elements/provider/ApiContainer/hooks/useApi.ts
 var l = 30, u = 300, d = (e) => !!e && e !== "{}" && e !== i, f = (e) => {
 	if (typeof e != "string") return {
@@ -20,27 +20,27 @@ var l = 30, u = 300, d = (e) => !!e && e !== "{}" && e !== i, f = (e) => {
 			data: e.message
 		};
 	}
-}, p = async (e, t, n, r, i, s = !1) => {
+}, p = async (e, t, n, r, i, a = !1) => {
 	if (!e) return {
 		status: 400,
 		data: "URL is required"
 	};
-	let c = new Headers(r);
-	c.has("Accept") || c.set("Accept", "application/json");
+	let o = new Headers(r);
+	o.has("Accept") || o.set("Accept", "application/json");
 	let l = {
 		method: t,
 		credentials: n,
-		headers: c,
+		headers: o,
 		signal: i
 	};
-	t !== "get" && (l.body = "{}", c.has("Content-Type") || c.set("Content-Type", "application/json"));
+	t !== "get" && (l.body = "{}", o.has("Content-Type") || o.set("Content-Type", "application/json"));
 	try {
-		let c = await fetch(e, l), u = await c.json(), d = a(c.status, u);
-		return d && await o({
+		let o = await fetch(e, l), u = await o.json(), d = s(o.status, u);
+		return d && await c({
 			reason: d,
 			url: e
-		}) && !s && !i.aborted ? await p(e, t, n, r, i, !0) : {
-			status: c.status,
+		}) && !a && !i.aborted ? await p(e, t, n, r, i, !0) : {
+			status: o.status,
 			data: u
 		};
 	} catch (e) {
@@ -53,12 +53,12 @@ var l = 30, u = 300, d = (e) => !!e && e !== "{}" && e !== i, f = (e) => {
 }, m = (e) => e.status < 400, h = (e, t) => {
 	let n = typeof e == "number" ? e : Number(e);
 	return (Number.isFinite(n) && n >= 0 ? n : t) * 1e3;
-}, g = ({ url: a = "", method: o = "get", mock: l, customHeaders: u = i, enabled: g = !0, credentials: _ = "same-origin", cache: v = !1, staleTime: y = 30, gcTime: b = 300, tags: x }) => {
-	let S = d(l), C = t(), w = !S && (!a || r(a)), T = n(() => {
+}, g = ({ url: s = "", method: c = "get", mock: l, customHeaders: u = i, enabled: g = !0, credentials: _ = "same-origin", cache: v = !1, staleTime: y = 30, gcTime: b = 300, tags: x }) => {
+	let S = d(l), C = t(), w = !S && (!s || r(s)), T = n(() => {
 		if (S || w) return;
-		let e = s({
-			method: o,
-			url: a,
+		let e = a({
+			method: c,
+			url: s,
 			credentials: _,
 			headers: u
 		});
@@ -66,21 +66,21 @@ var l = 30, u = 300, d = (e) => !!e && e !== "{}" && e !== i, f = (e) => {
 	}, [
 		S,
 		w,
-		a,
-		o,
+		s,
+		c,
 		_,
 		u,
 		v,
 		C
-	]), E = e((e) => p(a, o, _, u, e), [
-		a,
-		o,
+	]), E = e((e) => p(s, c, _, u, e), [
+		s,
+		c,
 		_,
 		u
-	]), D = c({
+	]), D = o({
 		key: T,
 		meta: {
-			url: a,
+			url: s,
 			tags: x
 		},
 		fetcher: E,

package/dist/elements/provider/ApiContainer/hooks/useProviderWrite.mjs

@@ -1,6 +1,6 @@
 import { useCallback as e } from "react";
-import { authFailureFromResponse as t, reportAuthFailure as n } from "@plitzi/sdk-shared/auth";
-import { invalidateQueries as r } from "@plitzi/sdk-shared/queries";
+import { invalidateQueries as t } from "@plitzi/sdk-shared/queries";
+import { authFailureFromResponse as n, reportAuthFailure as r } from "@plitzi/sdk-shared/auth";
 //#region src/elements/provider/ApiContainer/hooks/useProviderWrite.ts
 var i = ({ elementId: i, enabled: a, actionPath: o = "/_action", onDone: s }) => ({ writeRecord: e(async (e = {}) => {
 	let { action: c, recordId: l, ...u } = e;
@@ -17,14 +17,14 @@ var i = ({ elementId: i, enabled: a, actionPath: o = "/_action", onDone: s }) =>
 		})
 	});
 	if (!d.ok) {
-		let e = t(d.status, await d.json().catch(() => void 0));
-		throw e && n({
+		let e = n(d.status, await d.json().catch(() => void 0));
+		throw e && r({
 			reason: e,
 			url: o
 		}), Error(`Write failed with status ${d.status}`);
 	}
 	let f = await d.json();
-	return r(), await s?.(), f.record;
+	return t(), await s?.(), f.record;
 }, [
 	o,
 	i,

package/dist/elements/structure/Carousel/CarouselTrack/declaration.d.ts

@@ -43,7 +43,10 @@ declare const declaration: {
             readonly displayMode: "desktop";
             readonly style: {
                 readonly base: {
-                    readonly default: {};
+                    readonly default: {
+                        readonly position: "relative";
+                        readonly overflow: "hidden";
+                    };
                 };
             };
         };

package/dist/elements/structure/Carousel/CarouselTrack/declaration.mjs

@@ -35,7 +35,10 @@ var t = e()({
 		defaultStyle: {
 			name: "Carousel Track",
 			displayMode: "desktop",
-			style: { base: { default: {} } }
+			style: { base: { default: {
+				position: "relative",
+				overflow: "hidden"
+			} } }
 		},
 		settings: {}
 	}

package/dist/elements/structure/Carousel/CarouselTrack/index.d.ts

@@ -42,7 +42,10 @@ declare const CarouselTrack: {
             readonly displayMode: "desktop";
             readonly style: {
                 readonly base: {
-                    readonly default: {};
+                    readonly default: {
+                        readonly position: "relative";
+                        readonly overflow: "hidden";
+                    };
                 };
             };
         };

package/dist/elements/structure/Carousel/index.d.ts

@@ -47,7 +47,10 @@ declare const Carousel: {
                     readonly displayMode: "desktop";
                     readonly style: {
                         readonly base: {
-                            readonly default: {};
+                            readonly default: {
+                                readonly position: "relative";
+                                readonly overflow: "hidden";
+                            };
                         };
                     };
                 };

package/dist/elements/structure/DialogContainer/DialogContainer.mjs

@@ -131,7 +131,7 @@ var b = ({ ref: e, className: b = "", children: x, headerLabel: S = "Dialog Head
 						children: S || "Dialog Header"
 					}), /* @__PURE__ */ h("button", {
 						type: "button",
-						className: "dialog-container__close",
+						className: _("dialog-container__close", j.headerCloseButton),
 						"aria-label": "Close",
 						title: "Close",
 						onClick: J,
@@ -142,7 +142,7 @@ var b = ({ ref: e, className: b = "", children: x, headerLabel: S = "Dialog Head
 					})]
 				}),
 				/* @__PURE__ */ h("div", {
-					className: _("dialog-container__body", j.body),
+					className: _("dialog-container__body", j.bodyContainer),
 					children: /* @__PURE__ */ h(p, {
 						inherit: "live",
 						name: `Dialog:${D}`,

package/dist/elements/structure/DialogContainer/declaration.d.ts

@@ -140,11 +140,12 @@ declare const declaration: {
             readonly style: {
                 readonly base: {
                     readonly default: {
-                        readonly position: "absolute";
+                        readonly position: "fixed";
                         readonly top: "0";
                         readonly bottom: "0";
                         readonly left: "0";
                         readonly right: "0";
+                        readonly 'z-index': "200";
                     };
                 };
                 readonly backgroundContainer: {
@@ -154,6 +155,7 @@ declare const declaration: {
                         readonly left: "0";
                         readonly top: "0";
                         readonly position: "absolute";
+                        readonly 'z-index': "210";
                         readonly 'background-color': "black";
                         readonly opacity: "0.5";
                     };
@@ -165,8 +167,11 @@ declare const declaration: {
                         readonly position: "absolute";
                         readonly top: "50%";
                         readonly left: "50%";
+                        readonly 'z-index': "250";
                         readonly width: "500px";
-                        readonly height: "300px";
+                        readonly 'max-width': "calc(100vw - 32px)";
+                        readonly 'max-height': "calc(100dvh - 32px)";
+                        readonly overflow: "auto";
                         readonly 'background-color': "light-dark(white, oklch(0.21 0.006 285.885))";
                         readonly transform: "translate3d(-50%, -50%, 0px)";
                         readonly 'padding-top': "20px";
@@ -191,18 +196,32 @@ declare const declaration: {
                         readonly 'font-size': "20px";
                         readonly 'font-weight': "500";
                         readonly 'line-height': "1.2";
-                        readonly color: "#333";
                     };
                 };
                 readonly headerCloseButton: {
-                    readonly default: {
-                        readonly height: "20px";
-                        readonly width: "20px";
-                        readonly padding: "4px";
-                        readonly display: "flex";
-                        readonly 'justify-content': "center";
-                        readonly 'align-items': "center";
-                        readonly cursor: "pointer";
+                    default: {
+                        height: string;
+                        width: string;
+                        'padding-top': string;
+                        'padding-bottom': string;
+                        'padding-left': string;
+                        'padding-right': string;
+                        display: string;
+                        'justify-content': string;
+                        'align-items': string;
+                        'flex-shrink': string;
+                        'border-top-left-radius': string;
+                        'border-top-right-radius': string;
+                        'border-bottom-left-radius': string;
+                        'border-bottom-right-radius': string;
+                        'background-color': string;
+                        color: string;
+                        'font-style': string;
+                        'font-weight': string;
+                        'line-height': string;
+                        'font-family': string;
+                        'font-size': string;
+                        cursor: string;
                     };
                 };
                 readonly bodyContainer: {
@@ -210,7 +229,7 @@ declare const declaration: {
                         readonly display: "flex";
                         readonly 'flex-direction': "column";
                         readonly 'flex-grow': "1";
-                        readonly 'flex-basis': "0";
+                        readonly 'flex-basis': "auto";
                     };
                 };
                 readonly footerContainer: {
@@ -220,6 +239,47 @@ declare const declaration: {
                         readonly 'margin-top': "8px";
                     };
                 };
+                readonly acceptButton: {
+                    readonly default: {
+                        'min-height': string;
+                        'min-width': string;
+                        'padding-top': string;
+                        'padding-bottom': string;
+                        'padding-left': string;
+                        'padding-right': string;
+                        'border-top-left-radius': string;
+                        'border-top-right-radius': string;
+                        'border-bottom-left-radius': string;
+                        'border-bottom-right-radius': string;
+                        'background-color': string;
+                        color: string;
+                        'line-height': string;
+                        'font-size': string;
+                        outline: string;
+                        cursor: string;
+                    };
+                };
+                readonly cancelButton: {
+                    readonly default: {
+                        readonly 'margin-left': "12px";
+                        readonly 'min-height': string;
+                        readonly 'min-width': string;
+                        readonly 'padding-top': string;
+                        readonly 'padding-bottom': string;
+                        readonly 'padding-left': string;
+                        readonly 'padding-right': string;
+                        readonly 'border-top-left-radius': string;
+                        readonly 'border-top-right-radius': string;
+                        readonly 'border-bottom-left-radius': string;
+                        readonly 'border-bottom-right-radius': string;
+                        readonly 'background-color': string;
+                        readonly color: string;
+                        readonly 'line-height': string;
+                        readonly 'font-size': string;
+                        readonly outline: string;
+                        readonly cursor: string;
+                    };
+                };
             };
             readonly subTypes: {};
         };

package/dist/elements/structure/DialogContainer/declaration.mjs

@@ -1,6 +1,46 @@
 import { elementDeclaration as e } from "@plitzi/sdk-shared/authoring/declare";
 //#region src/elements/structure/DialogContainer/declaration.ts
-var t = e()({
+var t = { default: {
+	height: "28px",
+	width: "28px",
+	"padding-top": "4px",
+	"padding-bottom": "4px",
+	"padding-left": "4px",
+	"padding-right": "4px",
+	display: "flex",
+	"justify-content": "center",
+	"align-items": "center",
+	"flex-shrink": "0",
+	"border-top-left-radius": "4px",
+	"border-top-right-radius": "4px",
+	"border-bottom-left-radius": "4px",
+	"border-bottom-right-radius": "4px",
+	"background-color": "transparent",
+	color: "inherit",
+	"font-style": "inherit",
+	"font-weight": "inherit",
+	"line-height": "inherit",
+	"font-family": "inherit",
+	"font-size": "inherit",
+	cursor: "pointer"
+} }, n = {
+	"min-height": "30px",
+	"min-width": "30px",
+	"padding-top": "6px",
+	"padding-bottom": "6px",
+	"padding-left": "12px",
+	"padding-right": "12px",
+	"border-top-left-radius": "4px",
+	"border-top-right-radius": "4px",
+	"border-bottom-left-radius": "4px",
+	"border-bottom-right-radius": "4px",
+	"background-color": "#4422ee",
+	color: "white",
+	"line-height": "24px",
+	"font-size": "16px",
+	outline: "none",
+	cursor: "pointer"
+}, r = e()({
 	type: "dialogContainer",
 	sourceType: "dialogContainer",
 	triggers: {
@@ -115,11 +155,12 @@ var t = e()({
 			displayMode: "desktop",
 			style: {
 				base: { default: {
-					position: "absolute",
+					position: "fixed",
 					top: "0",
 					bottom: "0",
 					left: "0",
-					right: "0"
+					right: "0",
+					"z-index": "200"
 				} },
 				backgroundContainer: { default: {
 					height: "100%",
@@ -127,6 +168,7 @@ var t = e()({
 					left: "0",
 					top: "0",
 					position: "absolute",
+					"z-index": "210",
 					"background-color": "black",
 					opacity: "0.5"
 				} },
@@ -136,8 +178,11 @@ var t = e()({
 					position: "absolute",
 					top: "50%",
 					left: "50%",
+					"z-index": "250",
 					width: "500px",
-					height: "300px",
+					"max-width": "calc(100vw - 32px)",
+					"max-height": "calc(100dvh - 32px)",
+					overflow: "auto",
 					"background-color": "light-dark(white, oklch(0.21 0.006 285.885))",
 					transform: "translate3d(-50%, -50%, 0px)",
 					"padding-top": "20px",
@@ -157,28 +202,24 @@ var t = e()({
 				headerTitle: { default: {
 					"font-size": "20px",
 					"font-weight": "500",
-					"line-height": "1.2",
-					color: "#333"
-				} },
-				headerCloseButton: { default: {
-					height: "20px",
-					width: "20px",
-					padding: "4px",
-					display: "flex",
-					"justify-content": "center",
-					"align-items": "center",
-					cursor: "pointer"
+					"line-height": "1.2"
 				} },
+				headerCloseButton: t,
 				bodyContainer: { default: {
 					display: "flex",
 					"flex-direction": "column",
 					"flex-grow": "1",
-					"flex-basis": "0"
+					"flex-basis": "auto"
 				} },
 				footerContainer: { default: {
 					display: "flex",
 					"justify-content": "flex-end",
 					"margin-top": "8px"
+				} },
+				acceptButton: { default: n },
+				cancelButton: { default: {
+					...n,
+					"margin-left": "12px"
 				} }
 			},
 			subTypes: {}
@@ -188,4 +229,4 @@ var t = e()({
 	initialItems: ["container"]
 });
 //#endregion
-export { t as default };
+export { r as default };

package/dist/elements/structure/DialogContainer/index.d.ts

@@ -139,11 +139,12 @@ declare const DialogContainer: {
             readonly style: {
                 readonly base: {
                     readonly default: {
-                        readonly position: "absolute";
+                        readonly position: "fixed";
                         readonly top: "0";
                         readonly bottom: "0";
                         readonly left: "0";
                         readonly right: "0";
+                        readonly 'z-index': "200";
                     };
                 };
                 readonly backgroundContainer: {
@@ -153,6 +154,7 @@ declare const DialogContainer: {
                         readonly left: "0";
                         readonly top: "0";
                         readonly position: "absolute";
+                        readonly 'z-index': "210";
                         readonly 'background-color': "black";
                         readonly opacity: "0.5";
                     };
@@ -164,8 +166,11 @@ declare const DialogContainer: {
                         readonly position: "absolute";
                         readonly top: "50%";
                         readonly left: "50%";
+                        readonly 'z-index': "250";
                         readonly width: "500px";
-                        readonly height: "300px";
+                        readonly 'max-width': "calc(100vw - 32px)";
+                        readonly 'max-height': "calc(100dvh - 32px)";
+                        readonly overflow: "auto";
                         readonly 'background-color': "light-dark(white, oklch(0.21 0.006 285.885))";
                         readonly transform: "translate3d(-50%, -50%, 0px)";
                         readonly 'padding-top': "20px";
@@ -190,18 +195,32 @@ declare const DialogContainer: {
                         readonly 'font-size': "20px";
                         readonly 'font-weight': "500";
                         readonly 'line-height': "1.2";
-                        readonly color: "#333";
                     };
                 };
                 readonly headerCloseButton: {
-                    readonly default: {
-                        readonly height: "20px";
-                        readonly width: "20px";
-                        readonly padding: "4px";
-                        readonly display: "flex";
-                        readonly 'justify-content': "center";
-                        readonly 'align-items': "center";
-                        readonly cursor: "pointer";
+                    default: {
+                        height: string;
+                        width: string;
+                        'padding-top': string;
+                        'padding-bottom': string;
+                        'padding-left': string;
+                        'padding-right': string;
+                        display: string;
+                        'justify-content': string;
+                        'align-items': string;
+                        'flex-shrink': string;
+                        'border-top-left-radius': string;
+                        'border-top-right-radius': string;
+                        'border-bottom-left-radius': string;
+                        'border-bottom-right-radius': string;
+                        'background-color': string;
+                        color: string;
+                        'font-style': string;
+                        'font-weight': string;
+                        'line-height': string;
+                        'font-family': string;
+                        'font-size': string;
+                        cursor: string;
                     };
                 };
                 readonly bodyContainer: {
@@ -209,7 +228,7 @@ declare const DialogContainer: {
                         readonly display: "flex";
                         readonly 'flex-direction': "column";
                         readonly 'flex-grow': "1";
-                        readonly 'flex-basis': "0";
+                        readonly 'flex-basis': "auto";
                     };
                 };
                 readonly footerContainer: {
@@ -219,6 +238,47 @@ declare const DialogContainer: {
                         readonly 'margin-top': "8px";
                     };
                 };
+                readonly acceptButton: {
+                    readonly default: {
+                        'min-height': string;
+                        'min-width': string;
+                        'padding-top': string;
+                        'padding-bottom': string;
+                        'padding-left': string;
+                        'padding-right': string;
+                        'border-top-left-radius': string;
+                        'border-top-right-radius': string;
+                        'border-bottom-left-radius': string;
+                        'border-bottom-right-radius': string;
+                        'background-color': string;
+                        color: string;
+                        'line-height': string;
+                        'font-size': string;
+                        outline: string;
+                        cursor: string;
+                    };
+                };
+                readonly cancelButton: {
+                    readonly default: {
+                        readonly 'margin-left': "12px";
+                        readonly 'min-height': string;
+                        readonly 'min-width': string;
+                        readonly 'padding-top': string;
+                        readonly 'padding-bottom': string;
+                        readonly 'padding-left': string;
+                        readonly 'padding-right': string;
+                        readonly 'border-top-left-radius': string;
+                        readonly 'border-top-right-radius': string;
+                        readonly 'border-bottom-left-radius': string;
+                        readonly 'border-bottom-right-radius': string;
+                        readonly 'background-color': string;
+                        readonly color: string;
+                        readonly 'line-height': string;
+                        readonly 'font-size': string;
+                        readonly outline: string;
+                        readonly cursor: string;
+                    };
+                };
             };
             readonly subTypes: {};
         };

package/dist/elements/structure/List/declaration.d.ts

@@ -51,7 +51,11 @@ declare const declaration: {
             readonly displayMode: "desktop";
             readonly style: {
                 readonly base: {
-                    readonly default: {};
+                    readonly default: {
+                        readonly 'margin-top': "0px";
+                        readonly 'margin-bottom': "10px";
+                        readonly 'padding-left': "40px";
+                    };
                 };
             };
             readonly subTypes: {

package/dist/elements/structure/List/declaration.mjs

@@ -43,7 +43,11 @@ var n = e()({
 		defaultStyle: {
 			name: "List",
 			displayMode: "desktop",
-			style: { base: { default: {} } },
+			style: { base: { default: {
+				"margin-top": "0px",
+				"margin-bottom": "10px",
+				"padding-left": "40px"
+			} } },
 			subTypes: {
 				ul: {
 					name: "List UL",

package/dist/elements/structure/List/index.d.ts

@@ -102,7 +102,11 @@ declare const List: {
             readonly displayMode: "desktop";
             readonly style: {
                 readonly base: {
-                    readonly default: {};
+                    readonly default: {
+                        readonly 'margin-top': "0px";
+                        readonly 'margin-bottom': "10px";
+                        readonly 'padding-left': "40px";
+                    };
                 };
             };
             readonly subTypes: {