@plitzi/sdk-elements 0.38.9 → 0.38.11

package/dist/elements/provider/Channel/Channel.mjs

@@ -1,8 +1,8 @@
-import e from "../../../Element/hocs/withElement.mjs";
-import t from "../../../Element/hooks/useElement.mjs";
-import { RootElement as n } from "../../../Element/RootElement.mjs";
-import r from "../../../dataSource/pathFields.mjs";
-import i from "./declaration.mjs";
+import e from "./declaration.mjs";
+import t from "../../../Element/hocs/withElement.mjs";
+import n from "../../../Element/hooks/useElement.mjs";
+import { RootElement as r } from "../../../Element/RootElement.mjs";
+import i from "../../../dataSource/pathFields.mjs";
 import a from "../../../realtime/useChannel.mjs";
 import { use as o, useCallback as s, useMemo as c, useState as l } from "react";
 import u from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
@@ -12,81 +12,82 @@ import { jsx as p } from "react/jsx-runtime";
 import m from "clsx";
 import h from "@plitzi/sdk-shared/dataSource/helpers/getSourceName";
 import g from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
-import { JOIN_TYPE as _, LEAVE_TYPE as v, PRESENCE_TYPE as y } from "@plitzi/sdk-shared/realtime";
+import { isTrue as _ } from "@plitzi/sdk-shared/dataSource/utility/truthiness";
+import { JOIN_TYPE as v, LEAVE_TYPE as y, PRESENCE_TYPE as b } from "@plitzi/sdk-shared/realtime";
 //#region src/elements/provider/Channel/Channel.tsx
-var b = (e) => {
+var x = (e) => {
 	if (typeof e != "string") return e;
 	try {
 		return JSON.parse(e);
 	} catch {
 		return e;
 	}
-}, x = /* @__PURE__ */ new Set([
-	y,
-	_,
-	v
-]), S = ({ ref: e, className: _, children: v, topic: y = "", grant: S = "", presence: C, keep: w = 20, subType: T = "" }) => {
-	let { id: E, definition: { label: D = "Channel" } } = t(), { settings: { previewMode: O }, contexts: { InteractionsContext: k } } = u(), { interactionsManager: A } = o(k), j = Math.max(0, Number(w) || 0), [M, N] = l([]), P = s((e) => {
-		x.has(e.type) || (j > 0 && N((t) => [...t, e].slice(-j)), A.interactionTrigger(E, "onMessage", { ...e }));
+}, S = /* @__PURE__ */ new Set([
+	b,
+	v,
+	y
+]), C = ({ ref: t, className: v, children: y, topic: b = "", grant: C = "", presence: w, keep: T = 20, subType: E = "" }) => {
+	let { id: D, definition: { label: O = "Channel" } } = n(), { settings: { previewMode: k }, contexts: { InteractionsContext: A } } = u(), { interactionsManager: j } = o(A), M = Math.max(0, Number(T) || 0), [N, P] = l([]), F = s((e) => {
+		S.has(e.type) || (M > 0 && P((t) => [...t, e].slice(-M)), j.interactionTrigger(D, "onMessage", { ...e }));
 	}, [
-		E,
-		A,
-		j
-	]), F = s(({ from: e, user: t, state: n }) => void A.interactionTrigger(E, "onJoin", {
+		D,
+		j,
+		M
+	]), I = s(({ from: e, user: t, state: n }) => void j.interactionTrigger(D, "onJoin", {
 		from: e,
 		user: t ?? "",
 		state: n
-	}), [E, A]), I = s(({ from: e, user: t, state: n }) => void A.interactionTrigger(E, "onLeave", {
+	}), [D, j]), L = s(({ from: e, user: t, state: n }) => void j.interactionTrigger(D, "onLeave", {
 		from: e,
 		user: t ?? "",
 		state: n
-	}), [E, A]), L = a(O && y ? y : void 0, {
-		grant: S || void 0,
-		presence: C === void 0 || C === "" ? void 0 : b(C),
-		onMessage: P,
-		onJoin: F,
-		onLeave: I
-	}), R = c(() => ({
+	}), [D, j]), R = a(k && b ? b : void 0, {
+		grant: C || void 0,
+		presence: w === void 0 || w === "" ? void 0 : x(w),
+		onMessage: F,
+		onJoin: I,
+		onLeave: L
+	}), z = c(() => ({
 		publish: {
-			...i.callbacks.publish,
-			callback: ({ type: e, data: t }) => typeof e == "string" && e ? L.publish(e, b(t)) : Promise.resolve(!1)
+			...e.callbacks.publish,
+			callback: ({ type: e, data: t, echo: n }) => typeof e == "string" && e ? R.publish(e, x(t), { echo: _(n) }) : Promise.resolve(!1)
 		},
 		setPresence: {
-			...i.callbacks.setPresence,
-			callback: ({ data: e }) => L.setPresence(b(e))
+			...e.callbacks.setPresence,
+			callback: ({ data: e }) => R.setPresence(x(e))
 		}
-	}), [L]), z = h(i.sourceType, E), B = c(() => ({
-		connected: L.connected,
-		me: L.me ?? "",
-		members: L.members,
-		messages: M,
-		last: M.at(-1) ?? null
+	}), [R]), B = h(e.sourceType, D), V = c(() => ({
+		connected: R.connected,
+		me: R.me ?? "",
+		members: R.members,
+		messages: N,
+		last: N.at(-1) ?? null
 	}), [
-		L.connected,
-		L.me,
-		L.members,
-		M
-	]), V = s(() => r(B), [B]);
+		R.connected,
+		R.me,
+		R.members,
+		N
+	]), H = s(() => i(V), [V]);
 	g({
-		id: E,
-		source: z,
-		name: D || `Channel - ${E}`,
-		fields: V
+		id: D,
+		source: B,
+		name: O || `Channel - ${D}`,
+		fields: H
 	});
-	let H = c(() => z ? { runtime: { sources: { [z]: B } } } : f, [B, z]);
-	return /* @__PURE__ */ p(n, {
-		ref: e,
-		tag: T,
-		className: m("plitzi-component__channel", _),
-		interactionTriggers: i.triggers,
-		interactionCallbacks: R,
+	let U = c(() => B ? { runtime: { sources: { [B]: V } } } : f, [V, B]);
+	return /* @__PURE__ */ p(r, {
+		ref: t,
+		tag: E,
+		className: m("plitzi-component__channel", v),
+		interactionTriggers: e.triggers,
+		interactionCallbacks: z,
 		children: /* @__PURE__ */ p(d, {
 			inherit: "live",
-			name: `Channel:${E}`,
-			value: H,
-			children: v
+			name: `Channel:${D}`,
+			value: U,
+			children: y
 		})
 	});
-}, C = e(S);
+}, w = t(C);
 //#endregion
-export { S as Channel, C as default };
+export { C as Channel, w as default };

package/dist/elements/provider/Channel/declaration.d.ts

@@ -20,6 +20,7 @@ declare const declaration: {
                 readonly from: "";
                 readonly user: "";
                 readonly at: "";
+                readonly echo: false;
             };
         };
         readonly onJoin: {
@@ -62,6 +63,11 @@ declare const declaration: {
                     readonly defaultValue: "";
                     readonly type: "text";
                 };
+                readonly echo: {
+                    readonly label: "Heard on this page too";
+                    readonly defaultValue: false;
+                    readonly type: "boolean";
+                };
             };
         };
         readonly setPresence: {
@@ -130,9 +136,9 @@ declare const declaration: {
     };
 } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
     subType?: "" | "div" | "section" | "aside" | "main" | undefined;
-    topic?: string | undefined;
     grant?: string | undefined;
     presence?: unknown;
+    topic?: string | undefined;
     keep?: number | string | undefined;
 }>>;
 export default declaration;

package/dist/elements/provider/Channel/declaration.mjs

@@ -21,7 +21,8 @@ var n = e()({
 				data: "",
 				from: "",
 				user: "",
-				at: ""
+				at: "",
+				echo: !1
 			}
 		},
 		onJoin: {
@@ -63,6 +64,11 @@ var n = e()({
 					label: "Data (JSON or a template)",
 					defaultValue: "",
 					type: "text"
+				},
+				echo: {
+					label: "Heard on this page too",
+					defaultValue: !1,
+					type: "boolean"
 				}
 			}
 		},
@@ -88,7 +94,7 @@ var n = e()({
 		definition: {
 			label: "Channel",
 			type: "channel",
-			description: "A realtime channel: every page on the same `topic` hears what any of them publishes, within milliseconds. The topic must match a channel the space declares in its settings (`channels`), e.g. `board:{{ id }}` under `board:{id}`. A topic of a private channel (`grant: true`) opens only with `grant`, bound to the grant the action that let this visitor in returned (its `realtime.grant` step). ITS DESCENDANTS bind to its source `channel_<id>`: `connected`, `members` (with the state each announced), `messages` (the last `keep`) and `last`. It fires `onMessage`; `onJoin` when somebody who came after this page has announced who they are, and `onLeave` when somebody goes — each with `from`, `user` and the `state` they announced; and answers `publish({ type, data })` and `setPresence({ data })`; `presence` is the state this page announces (a name, a colour). Closed in the builder and anywhere without a server.",
+			description: "A realtime channel: every OTHER page on the same `topic` hears what one publishes, within milliseconds — the page that sent it too with `echo` (its `from` is then the channel's `me`). The topic must match a channel the space declares in its settings (`channels`), e.g. `board:{{ id }}` under `board:{id}`. A topic of a private channel (`grant: true`) opens only with `grant`, bound to the grant the action that let this visitor in returned (its `realtime.grant` step). ITS DESCENDANTS bind to its source `channel_<id>`: `connected`, `members` (with the state each announced), `messages` (the last `keep`) and `last`. It fires `onMessage`; `onJoin` when somebody who came after this page has announced who they are, and `onLeave` when somebody goes — each with `from`, `user` and the `state` they announced; and answers `publish({ type, data, echo })` and `setPresence({ data })`; `presence` is the state this page announces (a name, a colour). Closed in the builder and anywhere without a server.",
 			items: [],
 			bindings: {},
 			styleSelectors: { base: "" },

package/dist/elements/provider/Channel/index.d.ts

@@ -19,6 +19,7 @@ declare const Channel: {
                 readonly from: "";
                 readonly user: "";
                 readonly at: "";
+                readonly echo: false;
             };
         };
         readonly onJoin: {
@@ -61,6 +62,11 @@ declare const Channel: {
                     readonly defaultValue: "";
                     readonly type: "text";
                 };
+                readonly echo: {
+                    readonly label: "Heard on this page too";
+                    readonly defaultValue: false;
+                    readonly type: "boolean";
+                };
             };
         };
         readonly setPresence: {
@@ -129,9 +135,9 @@ declare const Channel: {
     };
 } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
     subType?: "" | "div" | "section" | "aside" | "main" | undefined;
-    topic?: string | undefined;
     grant?: string | undefined;
     presence?: unknown;
+    topic?: string | undefined;
     keep?: number | string | undefined;
 }>>;
 export default Channel;

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

@@ -1,27 +1,27 @@
-import e from "../../../Element/hocs/withElement.mjs";
-import t from "../../../Element/hooks/useElement.mjs";
-import { RootElement as n } from "../../../Element/RootElement.mjs";
-import r from "../../../dataSource/pathFields.mjs";
-import i from "./CarouselContext.mjs";
-import { clampIndex as a, directionOf as o, slideStep as s, stepIndex as c } from "./carouselIndex.mjs";
-import l from "./declaration.mjs";
-import u from "./useAutoplay.mjs";
-import { rowKeys as ee } from "../List/modes/ListControlled/rowKeys.mjs";
-import { use as te, useCallback as d, useEffect as f, useMemo as p, useRef as m, useState as h } from "react";
-import ne from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
-import { StoreProvider as re } from "@plitzi/nexus/react";
-import { emptyObject as g } from "@plitzi/sdk-shared/helpers/utils";
-import { jsx as _ } from "react/jsx-runtime";
-import ie from "clsx";
-import ae from "@plitzi/sdk-shared/dataSource/helpers/getSourceName";
-import oe from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
+import e from "./declaration.mjs";
+import t from "../../../Element/hocs/withElement.mjs";
+import n from "../../../Element/hooks/useElement.mjs";
+import { RootElement as ee } from "../../../Element/RootElement.mjs";
+import te from "../../../dataSource/pathFields.mjs";
+import ne from "./CarouselContext.mjs";
+import { clampIndex as r, directionOf as i, slideStep as a, stepIndex as o } from "./carouselIndex.mjs";
+import re from "./useAutoplay.mjs";
+import { rowKeys as s } from "../List/modes/ListControlled/rowKeys.mjs";
+import { use as ie, useCallback as c, useEffect as l, useMemo as u, useRef as d, useState as f } from "react";
+import p from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
+import { StoreProvider as m } from "@plitzi/nexus/react";
+import { emptyObject as h } from "@plitzi/sdk-shared/helpers/utils";
+import { jsx as g } from "react/jsx-runtime";
+import ae from "clsx";
+import oe from "@plitzi/sdk-shared/dataSource/helpers/getSourceName";
+import se from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
 //#region src/elements/structure/Carousel/Carousel.tsx
-var v = ({ ref: e, className: v = "", children: y, items: b = [], mode: x = "slide", autoplay: S = 0, pauseOnHover: C = !0, loop: w = !0, transition: T = "slide", speed: E = 30, itemKey: D, label: se = "" }) => {
-	let { id: O, definition: { label: k = "Carousel" } } = t(), A = ae(l.sourceType, O), { settings: { previewMode: ce }, contexts: { InteractionsContext: le } } = ne(), { interactionsManager: j } = te(le), M = p(() => Array.isArray(b) ? b : [], [b]), N = p(() => ee(M, D), [M, D]), P = M.length, F = !!ce, [I, L] = h(0), [R, z] = h("next"), [B, V] = h(!1), [H, U] = h(S > 0), ue = m(null), W = e ?? ue, G = m(null), K = a(I, P);
-	f(() => {
+var _ = ({ ref: t, className: _ = "", children: v, items: y = [], mode: b = "slide", autoplay: x = 0, pauseOnHover: S = !0, loop: C = !0, transition: w = "slide", speed: T = 30, itemKey: E, label: D = "" }) => {
+	let { id: O, definition: { label: k = "Carousel" } } = n(), A = oe(e.sourceType, O), { settings: { previewMode: ce }, contexts: { InteractionsContext: le } } = p(), { interactionsManager: j } = ie(le), M = u(() => Array.isArray(y) ? y : [], [y]), N = u(() => s(M, E), [M, E]), P = M.length, F = !!ce, [I, L] = f(0), [R, z] = f("next"), [B, V] = f(!1), [H, U] = f(x > 0), ue = d(null), W = t ?? ue, G = d(null), K = r(I, P);
+	l(() => {
 		I !== K && L(K);
 	}, [I, K]);
-	let q = d((e, t) => {
+	let q = c((e, t) => {
 		P !== 0 && e !== K && (z(t), V(!0), L(e), j.interactionTrigger(O, "onChange", {
 			index: e,
 			item: M[e]
@@ -32,117 +32,117 @@ var v = ({ ref: e, className: v = "", children: y, items: b = [], mode: x = "sli
 		O,
 		j,
 		M
-	]), J = d((e) => {
-		let t = G.current, n = t ? s(t) : 0;
+	]), J = c((e) => {
+		let t = G.current, n = t ? a(t) : 0;
 		t && n > 0 && t.scrollBy({
 			left: e * n,
 			behavior: "smooth"
 		});
-	}, []), Y = d(() => {
-		if (x === "scroll") {
+	}, []), Y = c(() => {
+		if (b === "scroll") {
 			J(1);
 			return;
 		}
-		q(c(K, P, 1, w), "next");
+		q(o(K, P, 1, C), "next");
 	}, [
 		P,
 		K,
-		w,
-		x,
+		C,
+		b,
 		q,
 		J
-	]), X = d(() => {
-		if (x === "scroll") {
+	]), X = c(() => {
+		if (b === "scroll") {
 			J(-1);
 			return;
 		}
-		q(c(K, P, -1, w), "previous");
+		q(o(K, P, -1, C), "previous");
 	}, [
 		P,
 		K,
-		w,
-		x,
+		C,
+		b,
 		q,
 		J
-	]), Z = d((e) => {
-		let t = a(e.index, P);
-		if (x === "scroll") {
+	]), Z = c((e) => {
+		let t = r(e.index, P);
+		if (b === "scroll") {
 			J(t - K);
 			return;
 		}
-		q(t, o(K, t));
+		q(t, i(K, t));
 	}, [
 		P,
 		K,
-		x,
+		b,
 		q,
 		J
-	]), Q = d((e) => {
-		e !== K && q(e, o(K, e));
+	]), Q = c((e) => {
+		e !== K && q(e, i(K, e));
 	}, [K, q]);
-	u({
-		delay: x === "slide" ? S : 0,
+	re({
+		delay: b === "slide" ? x : 0,
 		active: F && H && P > 1,
 		rootRef: W,
-		pauseOnHover: C,
+		pauseOnHover: S,
 		position: K,
 		onTick: Y
 	});
-	let de = p(() => ({
+	let de = u(() => ({
 		next: {
-			...l.callbacks.next,
+			...e.callbacks.next,
 			callback: Y
 		},
 		previous: {
-			...l.callbacks.previous,
+			...e.callbacks.previous,
 			callback: X
 		},
 		goTo: {
-			...l.callbacks.goTo,
+			...e.callbacks.goTo,
 			callback: Z
 		},
 		play: {
-			...l.callbacks.play,
+			...e.callbacks.play,
 			callback: () => U(!0)
 		},
 		pause: {
-			...l.callbacks.pause,
+			...e.callbacks.pause,
 			callback: () => U(!1)
 		}
 	}), [
 		Z,
 		Y,
 		X
-	]), $ = p(() => ({
+	]), $ = u(() => ({
 		items: M,
 		count: P,
 		index: K,
 		item: M[K],
-		playing: H && S > 0
+		playing: H && x > 0
 	}), [
-		S,
+		x,
 		P,
 		K,
 		M,
 		H
-	]), fe = d(() => r($), [$]);
-	oe({
+	]), fe = c(() => te($), [$]);
+	se({
 		id: O,
 		source: A,
 		name: k || `Carousel - ${O}`,
 		fields: fe
 	});
-	let pe = p(() => A ? { runtime: { sources: { [A]: $ } } } : g, [A, $]), me = p(() => ({
+	let pe = u(() => A ? { runtime: { sources: { [A]: $ } } } : h, [A, $]), me = u(() => ({
 		source: A,
 		items: M,
 		keys: N,
 		index: K,
 		direction: R,
 		moved: B,
-		mode: x,
-		transition: T,
-		speed: E,
-		pauseOnHover: C,
+		mode: b,
+		transition: w,
+		speed: T,
+		pauseOnHover: S,
 		live: F,
 		scrollerRef: G,
 		onScrolledTo: Q
@@ -152,32 +152,32 @@ var v = ({ ref: e, className: v = "", children: y, items: b = [], mode: x = "sli
 		N,
 		M,
 		F,
-		x,
+		b,
 		B,
 		Q,
-		C,
+		S,
 		A,
-		E,
-		T
+		T,
+		w
 	]);
-	return /* @__PURE__ */ _(n, {
+	return /* @__PURE__ */ g(ee, {
 		ref: W,
-		className: ie("plitzi-component__carousel", `carousel--${x}`, v),
+		className: ae("plitzi-component__carousel", `carousel--${b}`, _),
 		role: "region",
 		"aria-roledescription": "carousel",
-		"aria-label": se || void 0,
-		interactionTriggers: l.triggers,
+		"aria-label": D || void 0,
+		interactionTriggers: e.triggers,
 		interactionCallbacks: de,
-		children: /* @__PURE__ */ _(re, {
+		children: /* @__PURE__ */ g(m, {
 			inherit: "live",
 			name: `Carousel:${O}`,
 			value: pe,
-			children: /* @__PURE__ */ _(i, {
+			children: /* @__PURE__ */ g(ne, {
 				value: me,
-				children: y
+				children: v
 			})
 		})
 	});
-}, y = e(v);
+}, v = t(_);
 //#endregion
-export { v as Carousel, y as default };
+export { _ as Carousel, v as default };

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

@@ -1,6 +1,6 @@
-import e from "./CarouselTrack.mjs";
-import t from "./declaration.mjs";
+import e from "./declaration.mjs";
+import t from "./CarouselTrack.mjs";
 //#region src/elements/structure/Carousel/CarouselTrack/index.ts
-var n = Object.assign(e, t);
+var n = Object.assign(t, e);
 //#endregion
 export { n as default };

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

@@ -123,8 +123,8 @@ declare const declaration: {
     items?: unknown[] | undefined;
     speed?: number | undefined;
     loop?: boolean | undefined;
-    autoplay?: number | undefined;
     pauseOnHover?: boolean | undefined;
+    autoplay?: number | undefined;
     transition?: import('./CarouselContext').CarouselTransition | undefined;
     itemKey?: string | undefined;
 }>>;

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

@@ -178,8 +178,8 @@ declare const Carousel: {
         items?: unknown[] | undefined;
         speed?: number | undefined;
         loop?: boolean | undefined;
-        autoplay?: number | undefined;
         pauseOnHover?: boolean | undefined;
+        autoplay?: number | undefined;
         transition?: import('./CarouselContext').CarouselTransition | undefined;
         itemKey?: string | undefined;
     }>;

package/dist/elements/structure/Container/Container.mjs

@@ -1,16 +1,16 @@
-import e from "../../../Element/hocs/withElement.mjs";
-import { RootElement as t } from "../../../Element/RootElement.mjs";
-import { NAMEABLE_CONTAINER_TAGS as n } from "./declaration.mjs";
+import { NAMEABLE_CONTAINER_TAGS as e } from "./declaration.mjs";
+import t from "../../../Element/hocs/withElement.mjs";
+import { RootElement as n } from "../../../Element/RootElement.mjs";
 import { jsx as r } from "react/jsx-runtime";
 import i from "clsx";
 //#region src/elements/structure/Container/Container.tsx
-var a = ({ ref: e, className: a = "", subType: o = "div", label: s = "", decorative: c = !1, live: l = "", title: u = "", children: d }) => {
-	let f = !c && s && n.includes(o) ? {
+var a = ({ ref: t, className: a = "", subType: o = "div", label: s = "", decorative: c = !1, live: l = "", title: u = "", children: d }) => {
+	let f = !c && s && e.includes(o) ? {
 		"aria-label": s,
 		...o === "div" ? { role: "group" } : {}
 	} : {}, p = c ? { "aria-hidden": !0 } : {}, m = l ? { "aria-live": l } : {};
-	return /* @__PURE__ */ r(t, {
-		ref: e,
+	return /* @__PURE__ */ r(n, {
+		ref: t,
 		tag: o,
 		className: i(`plitzi-component__container plitzi-component__container-${o}`, a),
 		title: u || void 0,
@@ -19,6 +19,6 @@ var a = ({ ref: e, className: a = "", subType: o = "div", label: s = "", decorat
 		...m,
 		children: d
 	});
-}, o = e(a);
+}, o = t(a);
 //#endregion
 export { a as Container, o as default };

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

@@ -1,8 +1,8 @@
-import e from "../../../Element/hocs/withElement.mjs";
-import t from "../../../Element/hooks/useElement.mjs";
-import { RootElement as n } from "../../../Element/RootElement.mjs";
-import r from "../../../dataSource/pathFields.mjs";
-import i from "./declaration.mjs";
+import e from "./declaration.mjs";
+import t from "../../../Element/hocs/withElement.mjs";
+import n from "../../../Element/hooks/useElement.mjs";
+import { RootElement as r } from "../../../Element/RootElement.mjs";
+import i from "../../../dataSource/pathFields.mjs";
 import a from "../ModalContainer/useModalDialog.mjs";
 import { use as o, useCallback as s, useEffect as c, useMemo as l, useRef as u, useState as d } from "react";
 import f from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
@@ -13,8 +13,8 @@ import _ from "clsx";
 import v from "@plitzi/sdk-shared/dataSource/helpers/getSourceName";
 import y from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
 //#region src/elements/structure/DialogContainer/DialogContainer.tsx
-var b = ({ ref: e, className: b = "", children: x, headerLabel: S = "Dialog Header", acceptButtonLabel: C = "Accept", acceptButtonLabelLoading: w = "Loading...", rejectButtonLabel: T = "Cancel", autoHideAfterClick: E = !0 }) => {
-	let { id: D, rootId: O, visible: k, setElementState: A, definition: { styleSelectors: j, label: M = "Dialog" }, elementState: N } = t(), P = v(i.sourceType, D), { settings: { previewMode: F }, contexts: { InteractionsContext: I } } = f(), { interactionsManager: L } = o(I), [R, z] = d({}), [B, V] = d(!1), H = u(null), U = `${O}_${D}_title`, W = s((e) => {
+var b = ({ ref: t, className: b = "", children: x, headerLabel: S = "Dialog Header", acceptButtonLabel: C = "Accept", acceptButtonLabelLoading: w = "Loading...", rejectButtonLabel: T = "Cancel", autoHideAfterClick: E = !0 }) => {
+	let { id: D, rootId: O, visible: k, setElementState: A, definition: { styleSelectors: j, label: M = "Dialog" }, elementState: N } = n(), P = v(e.sourceType, D), { settings: { previewMode: F }, contexts: { InteractionsContext: I } } = f(), { interactionsManager: L } = o(I), [R, z] = d({}), [B, V] = d(!1), H = u(null), U = `${O}_${D}_title`, W = s((e) => {
 		let { metadata: t } = e;
 		if (t && typeof t == "object") z(t);
 		else if (typeof t == "string") try {
@@ -72,12 +72,12 @@ var b = ({ ref: e, className: b = "", children: x, headerLabel: S = "Dialog Head
 		A
 	]), Y = l(() => ({
 		openDialog: {
-			...i.callbacks.openDialog,
+			...e.callbacks.openDialog,
 			title: `Open ${M}`,
 			callback: W
 		},
 		closeDialog: {
-			...i.callbacks.closeDialog,
+			...e.callbacks.closeDialog,
 			title: `Close ${M}`,
 			callback: G
 		}
@@ -98,7 +98,7 @@ var b = ({ ref: e, className: b = "", children: x, headerLabel: S = "Dialog Head
 		R,
 		N.visibility
 	]);
-	let X = s(() => r(R), [R]);
+	let X = s(() => i(R), [R]);
 	y({
 		id: D,
 		source: P,
@@ -106,10 +106,10 @@ var b = ({ ref: e, className: b = "", children: x, headerLabel: S = "Dialog Head
 		fields: X
 	});
 	let Z = l(() => P ? { runtime: { sources: { [P]: R } } } : m, [P, R]);
-	return /* @__PURE__ */ g(n, {
-		ref: e,
+	return /* @__PURE__ */ g(r, {
+		ref: t,
 		className: _("plitzi-component__dialog-container", b),
-		interactionTriggers: i.triggers,
+		interactionTriggers: e.triggers,
 		interactionCallbacks: Y,
 		children: [/* @__PURE__ */ h("div", {
 			className: _("dialog-container__background", j.backgroundContainer),
@@ -175,6 +175,6 @@ var b = ({ ref: e, className: b = "", children: x, headerLabel: S = "Dialog Head
 			]
 		})]
 	});
-}, x = e(b);
+}, x = t(b);
 //#endregion
 export { b as DialogContainer, x as default };

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

@@ -156,8 +156,7 @@ declare const declaration: {
                         readonly top: "0";
                         readonly position: "absolute";
                         readonly 'z-index': "210";
-                        readonly 'background-color': "black";
-                        readonly opacity: "0.5";
+                        readonly 'background-color': "rgb(0 0 0 / 50%)";
                     };
                 };
                 readonly rootContainer: {