webim-adapter 0.25.0 → 0.26.0

package/build/webim-ssr.js

@@ -3797,43 +3797,156 @@ function tn({ greeting: e = "Hi", signOutLabel: t = "Sign out", showEmail: n = !
 	});
 }
 //#endregion
+//#region ../ui/src/components/builder/apps/language/manifest.js
+var nn = {
+	id: "language",
+	label: "Language",
+	category: "Apps",
+	keys: ["SiteLanguagePicker"],
+	ssr: "prefetch",
+	settings: ["locales"]
+};
+//#endregion
+//#region ../ui/src/components/builder/apps/language/views.jsx
+function rn(e) {
+	let t = e?.locales, n = [typeof t?.default == "string" && t.default.trim() ? t.default.trim() : "", ...Array.isArray(t?.enabled) ? t.enabled : []].filter((e) => typeof e == "string" && e.trim());
+	return [...new Set(n.map((e) => e.trim()))];
+}
+var an = (e) => e && e.charAt(0).toUpperCase() + e.slice(1);
+function on(e, t) {
+	let n = String(e ?? "").toUpperCase();
+	if (t === "code") return n;
+	let r = "";
+	try {
+		r = an(new Intl.DisplayNames([e], { type: "language" }).of(e) ?? "");
+	} catch {}
+	return !r || r.toUpperCase() === n ? n : t === "both" ? `${n} — ${r}` : r;
+}
+function sn(e, t) {
+	let n = t ? "" : `?locale=${encodeURIComponent(e)}`;
+	if (typeof window > "u") return n || "?";
+	try {
+		let n = new URL(window.location.href);
+		return t ? n.searchParams.delete("locale") : n.searchParams.set("locale", e), n.searchParams.delete("page"), `${n.pathname}${n.search}${n.hash}`;
+	} catch {
+		return n || "/";
+	}
+}
+function cn({ variant: e, display: t, separator: n, label: r, style: a, nodeRef: o, inert: s }) {
+	let c = i(V), l = rn(c?.settings), u = l[0] ?? "", p = l.includes(c?.locale) ? c.locale : u, m = {
+		display: "inline-flex",
+		alignItems: "center",
+		gap: 8,
+		...D(a)
+	};
+	if (l.length < 2) return s ? /* @__PURE__ */ d("div", {
+		ref: o,
+		style: {
+			...m,
+			padding: "8px 12px",
+			border: "1px dashed rgba(100, 116, 139, 0.45)",
+			borderRadius: 6,
+			color: "rgba(100, 116, 139, 0.8)",
+			fontSize: 12
+		},
+		children: "Add site languages in Settings → Languages"
+	}) : null;
+	let h = r ? /* @__PURE__ */ d("span", {
+		style: { opacity: .7 },
+		children: r
+	}) : null;
+	return e === "inline" ? /* @__PURE__ */ f("div", {
+		ref: o,
+		style: m,
+		children: [h, l.map((e, r) => /* @__PURE__ */ f("span", {
+			style: {
+				display: "inline-flex",
+				alignItems: "center",
+				gap: 8
+			},
+			children: [r > 0 && /* @__PURE__ */ d("span", {
+				style: { opacity: .4 },
+				children: n ?? "·"
+			}), /* @__PURE__ */ d("a", {
+				href: sn(e, e === u),
+				hrefLang: e,
+				"aria-current": e === p ? "true" : void 0,
+				onClick: s ? (e) => e.preventDefault() : void 0,
+				style: {
+					color: e === p ? "var(--page-accent, inherit)" : "inherit",
+					fontWeight: e === p ? 600 : 400,
+					textDecoration: "none",
+					cursor: s ? "default" : "pointer"
+				},
+				children: on(e, t)
+			})]
+		}, e))]
+	}) : /* @__PURE__ */ f("div", {
+		ref: o,
+		style: m,
+		children: [h, /* @__PURE__ */ d("select", {
+			"aria-label": r || "Language",
+			value: p,
+			onChange: s ? void 0 : (e) => {
+				let t = e.target.value;
+				window.location.assign(sn(t, t === u));
+			},
+			onKeyDown: s ? (e) => e.preventDefault() : void 0,
+			style: {
+				font: "inherit",
+				color: "inherit",
+				background: "var(--page-surface, transparent)",
+				border: "1px solid var(--page-border, rgba(148, 163, 184, 0.4))",
+				borderRadius: 6,
+				padding: "4px 8px",
+				cursor: s ? "default" : "pointer"
+			},
+			children: l.map((e) => /* @__PURE__ */ d("option", {
+				value: e,
+				children: on(e, t)
+			}, e))
+		})]
+	});
+}
+//#endregion
 //#region ../ui/src/components/builder/apps/index.js
-var nn = [Yt], rn = {
+var ln = [Yt, nn], un = {
 	SiteLoginForm: en,
-	SiteAccountMenu: tn
+	SiteAccountMenu: tn,
+	SiteLanguagePicker: cn
 };
-new Set(nn.filter((e) => e.ssr === "shell").flatMap((e) => e.keys));
+new Set(ln.filter((e) => e.ssr === "shell").flatMap((e) => e.keys));
 //#endregion
 //#region ../ui/src/components/builder/plugins/runtime.js
-var an = /* @__PURE__ */ new Map();
-function on(e) {
-	if (an.has(e)) return an.get(e);
+var dn = /* @__PURE__ */ new Map();
+function fn(e) {
+	if (dn.has(e)) return dn.get(e);
 	let t = URL.createObjectURL(new Blob([e], { type: "text/javascript" })), n = import(
 		/* @vite-ignore */
 		/* webpackIgnore: true */
 		t
 ).finally(() => URL.revokeObjectURL(t));
-	return an.set(e, n), n;
+	return dn.set(e, n), n;
 }
-function sn(e) {
+function pn(e) {
 	let t = e && typeof e == "object" ? e.builder_plugins : null, n = t && typeof t == "object" ? t.plugins : null;
 	return n && typeof n == "object" ? n : {};
 }
 //#endregion
 //#region ../ui/src/components/builder/plugins/view.jsx
-async function cn(e, t) {
-	let n = await on(e);
+async function mn(e, t) {
+	let n = await fn(e);
 	return (Array.isArray(n?.default?.blocks) ? n.default.blocks : []).find((e) => e?.id === t && typeof e.mount == "function") ?? null;
 }
-var ln = {
+var hn = {
 	padding: "10px 12px",
 	border: "1px dashed rgba(148, 163, 184, 0.5)",
 	borderRadius: 8,
 	fontSize: 12,
 	opacity: .6
 };
-function un({ pluginId: e, blockId: t, props: n, style: r, nodeRef: o }) {
-	let s = i(V), l = sn(s?.settings)[e], u = c(null), p = c(null), m = {
+function gn({ pluginId: e, blockId: t, props: n, style: r, nodeRef: o }) {
+	let s = i(V), l = pn(s?.settings)[e], u = c(null), p = c(null), m = {
 		tenant: s?.tenant ?? "",
 		apiUrl: s?.apiUrl ?? "/api",
 		locale: s?.locale ?? "",
@@ -3845,7 +3958,7 @@ function un({ pluginId: e, blockId: t, props: n, style: r, nodeRef: o }) {
 		let e = u.current;
 		if (!l?.code || !e) return;
 		let n = !0;
-		return cn(l.code, t).then((e) => {
+		return mn(l.code, t).then((e) => {
 			if (!(!n || !e || !u.current)) {
 				p.current = e;
 				try {
@@ -3875,7 +3988,7 @@ function un({ pluginId: e, blockId: t, props: n, style: r, nodeRef: o }) {
 	}) : /* @__PURE__ */ f("div", {
 		ref: o,
 		style: {
-			...ln,
+			...hn,
 			...D(r)
 		},
 		children: [
@@ -3887,12 +4000,12 @@ function un({ pluginId: e, blockId: t, props: n, style: r, nodeRef: o }) {
 }
 //#endregion
 //#region ../ui/src/components/builder/render.jsx
-var dn = {
+var _n = {
 	...Jt,
-	...rn,
-	PluginBlock: un
+	...un,
+	PluginBlock: gn
 };
-function fn(e, n, r, i = /* @__PURE__ */ new Set(), a = void 0) {
+function vn(e, n, r, i = /* @__PURE__ */ new Set(), a = void 0) {
 	let o = n[e];
 	if (!o || o.hidden) return null;
 	let s = o.type?.resolvedName, c = a?.mapProps ? a.mapProps(o.props ?? {}, s) : o.props ?? {};
@@ -3900,11 +4013,11 @@ function fn(e, n, r, i = /* @__PURE__ */ new Set(), a = void 0) {
 		let n = o.props?.componentId, s = r?.[n];
 		if (!s?.template || i.has(n)) return null;
 		let c = new Set(i).add(n);
-		return /* @__PURE__ */ d(t, { children: fn(s.template.rootId, s.template.nodes, r, c, a) }, e);
+		return /* @__PURE__ */ d(t, { children: vn(s.template.rootId, s.template.nodes, r, c, a) }, e);
 	}
-	let l = dn[s];
+	let l = _n[s];
 	if (!l) return null;
-	let u = (o.nodes ?? []).map((e) => fn(e, n, r, i, a)).filter(Boolean), f = Object.entries(o.linkedNodes ?? {}), p = f.length ? Object.fromEntries(f.map(([e, t]) => [e, fn(t, n, r, i)])) : void 0, m = /* @__PURE__ */ d(l, {
+	let u = (o.nodes ?? []).map((e) => vn(e, n, r, i, a)).filter(Boolean), f = Object.entries(o.linkedNodes ?? {}), p = f.length ? Object.fromEntries(f.map(([e, t]) => [e, vn(t, n, r, i)])) : void 0, m = /* @__PURE__ */ d(l, {
 		...c,
 		...s === "CollectionList" ? { templateId: o.linkedNodes?.card } : null,
 		linked: p,
@@ -3920,9 +4033,9 @@ function fn(e, n, r, i = /* @__PURE__ */ new Set(), a = void 0) {
 }
 //#endregion
 //#region ../ui/src/components/builder/PageRenderer.jsx
-var pn = (e) => Object.entries(e).map(([e, t]) => `${e}: ${t};`).join(" "), mn = (e) => `.webim-page[data-webim-mode="light"] { ${Object.entries(B(e.light)).map(([e, t]) => `${e}: ${t} !important;`).join(" ")} }
+var yn = (e) => Object.entries(e).map(([e, t]) => `${e}: ${t};`).join(" "), bn = (e) => `.webim-page[data-webim-mode="light"] { ${Object.entries(B(e.light)).map(([e, t]) => `${e}: ${t} !important;`).join(" ")} }
 .webim-page[data-webim-mode="dark"] { ${Object.entries(B(e.dark)).map(([e, t]) => `${e}: ${t} !important;`).join(" ")} }`;
-function hn({ blocks: e, theme: t, components: n, mode: r = "auto", style: i, custom: o, tenant: c, apiUrl: l, datasets: u, locale: p, direction: m, settings: g, siteUser: _ }) {
+function xn({ blocks: e, theme: t, components: n, mode: r = "auto", style: i, custom: o, tenant: c, apiUrl: l, datasets: u, locale: p, direction: m, settings: g, siteUser: _ }) {
 	let v = o?.js?.trim();
 	if (a(() => {
 		if (!v) return;
@@ -3936,11 +4049,11 @@ function hn({ blocks: e, theme: t, components: n, mode: r = "auto", style: i, cu
 		minHeight: "100%",
 		display: "flex",
 		flexDirection: "column"
-	}, w = fn("ROOT", e, n), T = s(() => ({ render: (t, r) => fn(t, e, n, void 0, { mapProps: r }) }), [e, n]), E = re(e, n), D = ne(e, n), O = o?.css?.trim(), k = z(t), A = [k.font, k.headingFont].filter((e) => typeof e == "string" && e.trim() && e !== "inherit" && !R[e]), j = [.../* @__PURE__ */ new Set([...C(e, n), ...A])].map((e) => /* @__PURE__ */ d("link", {
+	}, w = vn("ROOT", e, n), T = s(() => ({ render: (t, r) => vn(t, e, n, void 0, { mapProps: r }) }), [e, n]), E = re(e, n), D = ne(e, n), O = o?.css?.trim(), k = z(t), A = [k.font, k.headingFont].filter((e) => typeof e == "string" && e.trim() && e !== "inherit" && !R[e]), j = [.../* @__PURE__ */ new Set([...C(e, n), ...A])].map((e) => /* @__PURE__ */ d("link", {
 		rel: "stylesheet",
 		precedence: "default",
 		href: b(e)
-	}, e)), M = mn(k);
+	}, e)), M = bn(k);
 	return r === "auto" ? /* @__PURE__ */ d(V.Provider, {
 		value: {
 			tenant: c || "",
@@ -3963,8 +4076,8 @@ function hn({ blocks: e, theme: t, components: n, mode: r = "auto", style: i, cu
 							...i
 						},
 						children: [
-							/* @__PURE__ */ d("style", { children: `.webim-page { ${pn(B(k.light))} }
-@media (prefers-color-scheme: dark) { .webim-page { ${pn(B(k.dark))} } }` }),
+							/* @__PURE__ */ d("style", { children: `.webim-page { ${yn(B(k.light))} }
+@media (prefers-color-scheme: dark) { .webim-page { ${yn(B(k.dark))} } }` }),
 							/* @__PURE__ */ d("style", { children: M }),
 							j,
 							/* @__PURE__ */ d("style", { children: x }),
@@ -4015,8 +4128,8 @@ function hn({ blocks: e, theme: t, components: n, mode: r = "auto", style: i, cu
 }
 //#endregion
 //#region src/WebimContent.jsx
-function gn({ bundle: e, mode: t = "auto", style: n }) {
-	return e?.blocks?.ROOT ? /* @__PURE__ */ d(hn, {
+function Sn({ bundle: e, mode: t = "auto", style: n }) {
+	return e?.blocks?.ROOT ? /* @__PURE__ */ d(xn, {
 		blocks: e.blocks,
 		theme: e.theme,
 		components: e.components,
@@ -4033,7 +4146,7 @@ function gn({ bundle: e, mode: t = "auto", style: n }) {
 }
 //#endregion
 //#region src/bundle.js
-function _n({ page: e, settings: t, tenant: n, apiUrl: r, locale: i }) {
+function Cn({ page: e, settings: t, tenant: n, apiUrl: r, locale: i }) {
 	let a = {
 		...t?.global ?? {},
 		...t?.tenant ?? {}
@@ -4058,18 +4171,18 @@ function _n({ page: e, settings: t, tenant: n, apiUrl: r, locale: i }) {
 }
 //#endregion
 //#region src/fetchPage.js
-var vn = async (e) => {
+var wn = async (e) => {
 	let t = await e.json().catch(() => null);
 	if (!e.ok || t?.success === !1) throw Error(t?.error?.message || `Request failed (${e.status})`);
 	return t?.payload ?? t;
 };
-async function yn({ apiUrl: e, tenant: t, slug: n, locale: r, preview: i, token: a, page: o, fetch: s }) {
+async function Tn({ apiUrl: e, tenant: t, slug: n, locale: r, preview: i, token: a, page: o, fetch: s }) {
 	if (!e) throw Error("fetchPage: apiUrl is required");
 	if (!n) throw Error("fetchPage: slug is required");
 	let c = s ?? fetch, l = e.replace(/\/$/, ""), u = {
 		...t ? { "x-tenant": t } : {},
 		...a ? { authorization: `Bearer ${a}` } : {}
-	}, [d, f] = await Promise.all([c(`${l}/render/${encodeURIComponent(n)}${i ? `?preview=${encodeURIComponent(i)}` : ""}`, { headers: u }).then(vn), c(`${l}/settings/public`, { headers: u }).then(vn)]), p = _n({
+	}, [d, f] = await Promise.all([c(`${l}/render/${encodeURIComponent(n)}${i ? `?preview=${encodeURIComponent(i)}` : ""}`, { headers: u }).then(wn), c(`${l}/settings/public`, { headers: u }).then(wn)]), p = Cn({
 		page: d,
 		settings: f,
 		tenant: t,
@@ -4077,7 +4190,7 @@ async function yn({ apiUrl: e, tenant: t, slug: n, locale: r, preview: i, token:
 		locale: r
 	}), m = [...new Set(Object.values(p.blocks ?? {}).map((e) => e?.type?.resolvedName === "CollectionList" ? e.props?.collection : e?.type?.resolvedName === "TableBlock" || e?.type?.resolvedName === "OrgChartBlock" ? e.props?.source : null).filter(Boolean))];
 	if (m.length) {
-		let e = (e) => e.startsWith("api:") ? `${l}/data/${encodeURIComponent(e.slice(4))}` : `${l}/dynamic/${encodeURIComponent(e)}?all=1${r ? `&locale=${encodeURIComponent(r)}` : ""}`, t = await Promise.all(m.map((t) => c(e(t), { headers: u }).then(vn).then((e) => {
+		let e = (e) => e.startsWith("api:") ? `${l}/data/${encodeURIComponent(e.slice(4))}` : `${l}/dynamic/${encodeURIComponent(e)}?all=1${r ? `&locale=${encodeURIComponent(r)}` : ""}`, t = await Promise.all(m.map((t) => c(e(t), { headers: u }).then(wn).then((e) => {
 			let n = Array.isArray(e) ? e : Array.isArray(e?.data) ? e.data : [], r = Number(e?.total?.filtered ?? e?.total?.all ?? n.length);
 			return [[t, n], [`${t}:total`, Number.isFinite(r) ? r : n.length]];
 		}).catch(() => [[t, []]])));
@@ -4091,40 +4204,40 @@ async function yn({ apiUrl: e, tenant: t, slug: n, locale: r, preview: i, token:
 }
 //#endregion
 //#region src/ssr.jsx
-var bn = (e) => String(e ?? "").replace(/[&<>"]/g, (e) => ({
+var En = (e) => String(e ?? "").replace(/[&<>"]/g, (e) => ({
 	"&": "&amp;",
 	"<": "&lt;",
 	">": "&gt;",
 	"\"": "&quot;"
 })[e]);
-function xn(t, { mode: n = "auto", style: r } = {}) {
-	return e(/* @__PURE__ */ d(gn, {
+function Dn(t, { mode: n = "auto", style: r } = {}) {
+	return e(/* @__PURE__ */ d(Sn, {
 		bundle: t,
 		mode: n,
 		style: r
 	}));
 }
-function Sn(e, { mode: t = "auto", lang: n } = {}) {
+function On(e, { mode: t = "auto", lang: n } = {}) {
 	let r = e.seo ?? {}, i = n || e.locale || "en", a = h(e.direction, i), o = r.title || e.title || e.slug || "Page", s = e.custom?.js?.trim(), c = [
 		"<meta charset=\"utf-8\"/>",
 		"<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"/>",
-		`<title>${bn(o)}</title>`,
-		r.description && `<meta name="description" content="${bn(r.description)}"/>`,
-		`<meta property="og:title" content="${bn(o)}"/>`,
-		r.image && `<meta property="og:image" content="${bn(r.image)}"/>`,
+		`<title>${En(o)}</title>`,
+		r.description && `<meta name="description" content="${En(r.description)}"/>`,
+		`<meta property="og:title" content="${En(o)}"/>`,
+		r.image && `<meta property="og:image" content="${En(r.image)}"/>`,
 		r.noindex && "<meta name=\"robots\" content=\"noindex\"/>",
 		"<style>html,body{margin:0;height:100%}</style>"
 	].filter(Boolean).join("\n");
 	return `<!doctype html>
-<html lang="${bn(i)}"${a ? ` dir="${a}"` : ""}>
+<html lang="${En(i)}"${a ? ` dir="${a}"` : ""}>
 <head>
 ${c}
 </head>
 <body>
-${xn(e, { mode: t })}
+${Dn(e, { mode: t })}
 ${s ? `<script>${s.replaceAll("<\/script", "<\\/script")}<\/script>` : ""}
 </body>
 </html>`;
 }
 //#endregion
-export { _n as assembleBundle, yn as fetchPage, xn as renderBundleHtml, Sn as renderPageDocument };
+export { Cn as assembleBundle, Tn as fetchPage, Dn as renderBundleHtml, On as renderPageDocument };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webim-adapter",
-  "version": "0.25.0",
+  "version": "0.26.0",
   "description": "Render WebIM builder pages inside any React app",
   "author": "Orhan POLAT",
   "license": "ISC",