@palmyit/elements 0.1.8 → 0.1.20

package/dist/definitions.js

@@ -1,83 +1,464 @@
-import { _ as e, a as t, c as n, d as r, f as i, g as a, h as o, i as s, l as c, m as l, o as u, p as ee, r as te, s as ne, t as re, u as ie } from "./styleToClasses-CZSWp6Ez.js";
-import { z as d } from "zod";
+import { A as e, B as t, C as n, D as r, E as i, F as a, G as o, H as s, I as c, J as l, K as u, L as d, M as f, N as p, O as m, P as h, R as g, S as ee, T as te, U as ne, V as _, W as re, b as ie, g as ae, i as oe, k as se, n as ce, q as v, r as le, t as ue, v as de, w as fe, x as pe, y as me, z as he } from "./youtube-BDsE1Bz3.js";
+import { z as y } from "zod";
 // src/schema/elementConfiguration.ts
-var f = d.string().trim().min(1);
-function p(e) {
+var b = y.string().trim().min(1);
+function x(e) {
 	return e;
 }
-var ae = /^[#0-9a-z%.,\s()-]+$/i, oe = /url|var|image|expression|attr/i;
-function m(e) {
+// src/schema/deviceVisibility.ts
+var S = {
+	Desktop: "showOnDesktop",
+	Tablet: "showOnTablet",
+	Mobile: "showOnMobile"
+}, ge = {
+	Tablet: "showOnTabletLandscape",
+	Mobile: "showOnMobileLandscape"
+}, _e = [...Object.values(S), ...Object.values(ge)], ve = s.flatMap(({ name: e, landscape: t }) => t ? [{
+	device: e,
+	orientation: "portrait"
+}, {
+	device: e,
+	orientation: "landscape"
+}] : [{
+	device: e,
+	orientation: "portrait"
+}]);
+function ye(e, t) {
+	return (t === "landscape" ? ge[e] : void 0) ?? S[e];
+}
+function C(e, t, n = "portrait") {
+	let r = e[ye(t, n)];
+	return r === void 0 ? e[S[t]] !== !1 : r;
+}
+function be(e) {
+	return ve.filter(({ device: t, orientation: n }) => C(e, t, n)).length;
+}
+// src/schema/styleItems.ts
+var xe = y.strictObject({
+	key: y.string(),
+	variable: y.string().optional(),
+	variables: y.record(y.string(), y.string()).optional(),
+	attribute: y.string().optional(),
+	value: y.unknown()
+}), Se = [
+	"variable",
+	"variables",
+	"attribute"
+];
+function Ce(e) {
+	let t = {};
+	for (let n of e) n.defaultValue !== void 0 && (t[n.key] = n.defaultValue);
+	return t;
+}
+function we(e, t) {
+	return Se.find((n) => JSON.stringify(e[n]) !== JSON.stringify(t[n]));
+}
+function Te(e, t, n) {
+	if (!t) return {
+		field: "key",
+		message: `Unknown style key "${e.key}"`
+	};
+	if (n.has(e.key)) return {
+		field: "key",
+		message: `Style key "${e.key}" appears twice`
+	};
+	let r = we(e, t);
+	if (r) return {
+		field: r,
+		message: `Style "${e.key}" ${r} does not match the element configuration`
+	};
+}
+function Ee(e) {
+	return Oe(e, () => Ce(e));
+}
+function De(e) {
+	return Oe(e, () => ({}));
+}
+function Oe(e, t) {
+	let n = new Map(e.map((e) => [e.key, e]));
+	return y.array(xe).default([]).transform((e, r) => {
+		let i = t(), a = /* @__PURE__ */ new Set();
+		return e.forEach((e, t) => {
+			let o = n.get(e.key), s = Te(e, o, a);
+			if (s || !o) {
+				r.addIssue({
+					code: "custom",
+					path: [t, s?.field ?? "key"],
+					message: s?.message ?? ""
+				});
+				return;
+			}
+			a.add(e.key);
+			let c = o.value.safeParse(e.value);
+			if (c.success) i[e.key] = c.data;
+			else {
+				let e = c.error.issues[0]?.message ?? "Invalid value";
+				r.addIssue({
+					code: "custom",
+					path: [t, "value"],
+					message: e
+				});
+			}
+		}), i;
+	});
+}
+function ke(e, t) {
+	let n = Object.fromEntries(Se.filter((t) => e[t] !== void 0).map((t) => [t, e[t]]));
+	return {
+		key: e.key,
+		...n,
+		value: t
+	};
+}
+function w(e, t = "") {
+	return Object.fromEntries(e.flatMap(({ key: e, label: n }) => n === void 0 ? [] : [[`${t}${e}`, n]]));
+}
+function Ae(e, t) {
+	return Me({
+		...Ce(t),
+		...e
+	}, t);
+}
+function je(e, t) {
+	return Me(e ?? {}, t);
+}
+function Me(e, t) {
+	return t.filter((t) => e[t.key] !== void 0).map((t) => ke(t, e[t.key]));
+}
+function Ne(e, t) {
+	return JSON.stringify(e) === JSON.stringify(t);
+}
+function Pe(e, t) {
+	let n = {};
+	for (let r of t) {
+		let t = e?.[r.key];
+		t !== void 0 && (r.defaultValue !== void 0 && Ne(t, r.defaultValue) || (n[r.key] = r.document ? r.document.encode(t) : t));
+	}
+	return Object.keys(n).length > 0 ? n : void 0;
+}
+function T(e, t) {
+	return Pe(e, t);
+}
+function E(e) {
+	return e === void 0 ? {} : { style: e };
+}
+function Fe(e, t) {
+	return Pe(e, t);
+}
+function Ie(e, t) {
+	let n = new Map(e.map((e) => [e.key, e])), r = new Set(e.map((e) => e.key));
+	return y.record(y.string(), y.unknown()).superRefine((e, t) => {
+		for (let n of Object.keys(e)) r.has(n) || t.addIssue({
+			code: "custom",
+			path: [n],
+			message: `Unknown style key "${n}"`
+		});
+	}).transform((e, r) => {
+		let i = t();
+		for (let [t, a] of Object.entries(e)) {
+			let e = n.get(t);
+			if (!e) continue;
+			let o = (e.document?.schema ?? e.value).safeParse(a);
+			if (o.success) i[t] = o.data;
+			else {
+				let e = o.error.issues[0]?.message ?? "Invalid value";
+				r.addIssue({
+					code: "custom",
+					path: [t],
+					message: e
+				});
+			}
+		}
+		return i;
+	}).optional().transform((e) => e ?? t());
+}
+function D(e) {
+	return Ie(e, () => Ce(e));
+}
+function Le(e) {
+	return Ie(e, () => ({}));
+}
+// src/schema/deviceSettings.ts
+var Re = [
+	{
+		key: "desktop",
+		visibility: "showOnDesktop",
+		label: "Desktop"
+	},
+	{
+		key: "tablet",
+		visibility: "showOnTablet",
+		styleProp: "tabletStyle",
+		label: "Tablet"
+	},
+	{
+		key: "tabletLandscape",
+		visibility: "showOnTabletLandscape",
+		styleProp: "tabletLandscapeStyle",
+		label: "Landscape tablet"
+	},
+	{
+		key: "mobile",
+		visibility: "showOnMobile",
+		styleProp: "mobileStyle",
+		label: "Mobile"
+	},
+	{
+		key: "mobileLandscape",
+		visibility: "showOnMobileLandscape",
+		styleProp: "mobileLandscapeStyle",
+		label: "Landscape mobile"
+	}
+], ze = Re.filter((e) => e.styleProp !== void 0).map(({ styleProp: e, label: t }) => ({
+	prop: e,
+	device: t
+})), Be = {
+	showOnDesktop: "Show on desktop",
+	showOnTablet: "Show on portrait tablet",
+	showOnTabletLandscape: "Show on landscape tablet",
+	showOnMobile: "Show on portrait mobile",
+	showOnMobileLandscape: "Show on landscape mobile"
+};
+function O(e, t) {
+	return t && e ? y.strictObject({
+		style: Le(e).optional(),
+		hidden: y.boolean().optional()
+	}) : y.strictObject({ hidden: y.boolean().optional() });
+}
+function Ve(e) {
+	return y.strictObject({ devices: y.strictObject({
+		desktop: O(e, !1).optional(),
+		tablet: O(e, !0).optional(),
+		tabletLandscape: O(e, !0).optional(),
+		mobile: O(e, !0).optional(),
+		mobileLandscape: O(e, !0).optional()
+	}).optional() });
+}
+function He(e) {
+	if (!e) return {};
+	let t = {};
+	for (let n of Re) {
+		let r = e[n.key];
+		r && (r.hidden !== void 0 && (t[n.visibility] = !r.hidden), n.styleProp && r.style !== void 0 && (t[n.styleProp] = r.style));
+	}
+	return t;
+}
+function Ue(e, t, n) {
+	return Object.fromEntries(Object.entries(e).filter(([e]) => t.has(e) === n));
+}
+function We(e, t) {
+	let n = /* @__PURE__ */ new Set(["devices"]);
+	return y.record(y.string(), y.unknown()).transform((r, i) => {
+		let a = e.safeParse(Ue(r, n, !1)), o = t.safeParse(Ue(r, n, !0));
+		for (let e of [...a.error?.issues ?? [], ...o.error?.issues ?? []]) i.addIssue({
+			code: "custom",
+			path: e.path,
+			message: e.message
+		});
+		if (!a.success || !o.success) return y.NEVER;
+		let s = He(o.data.devices);
+		return be(s) === 0 ? (i.addIssue({
+			code: "custom",
+			path: ["devices"],
+			message: "Show the element on at least one device"
+		}), y.NEVER) : {
+			...a.data,
+			...Ge(s)
+		};
+	});
+}
+function Ge(e) {
+	return Object.fromEntries(Object.entries(e).filter(([, e]) => !Ke(e)));
+}
+function Ke(e) {
+	return e === void 0 || typeof e == "object" && !!e && Object.keys(e).length === 0;
+}
+function qe(e) {
+	let t = {};
+	for (let { device: n, orientation: r } of ve) {
+		let i = C(e, n, r);
+		if (!(r === "portrait" ? !i : i !== C(e, n, "portrait"))) continue;
+		let a = Je(ye(n, r));
+		t[a] = {
+			...t[a],
+			hidden: !i
+		};
+	}
+	return t;
+}
+function Je(e) {
+	let t = Re.find((t) => t.visibility === e);
+	if (!t) throw Error(`Unknown visibility prop ${e}`);
+	return t.key;
+}
+function Ye(e, t) {
+	let n = {};
+	for (let r of ze) {
+		let i = Fe(e[r.prop], t);
+		if (i === void 0) continue;
+		let a = Re.find((e) => e.styleProp === r.prop).key;
+		n[a] = {
+			...n[a],
+			style: i
+		};
+	}
+	return n;
+}
+function Xe(...e) {
+	let t = {};
+	for (let n of e) for (let [e, r] of Object.entries(n)) t[e] = {
+		...t[e],
+		...r
+	};
+	return Object.keys(t).length > 0 ? t : void 0;
+}
+function Ze(e, t) {
+	let n = Xe(qe(e), t ? Ye(e, t) : {});
+	return n === void 0 ? {} : { devices: n };
+}
+function Qe(e) {
+	return `${e.charAt(0).toLowerCase()}${e.slice(1)}`;
+}
+function $e(e) {
+	return Object.fromEntries(ze.flatMap(({ prop: t, device: n }) => Object.entries(w(e, `${t}.`)).map(([e, t]) => [e, `${n} ${Qe(t)}`])));
+}
+function k(e, t) {
+	return {
+		...e,
+		attributes: We(e.attributes, Ve(t)),
+		toDocumentAttributes: (n) => ({
+			...e.toDocumentAttributes(n),
+			...Ze(n, t)
+		}),
+		history: {
+			summary: e.history.summary,
+			attributes: {
+				...e.history.attributes,
+				...Be,
+				...t ? $e(t) : {}
+			}
+		}
+	};
+}
+// src/schema/textItems.ts
+function A(e, t) {
+	return y.array(y.strictObject({ text: y.string().trim().min(1, t) })).min(1, e);
+}
+function j(e) {
+	return e.map(({ text: e }) => ({ text: e }));
+}
+// src/schema/Fields/ColorField/colorText.ts
+var et = /^#[0-9A-Fa-f]{6}$/, tt = new Set(ee), nt = new Set(fe);
+function rt(e) {
+	return "name" in e;
+}
+function it(e) {
+	let t = e.lastIndexOf("/");
+	if (t === -1) return {
+		base: e,
+		opacity: void 0
+	};
+	let n = e.slice(t + 1);
+	return /^\d+$/.test(n) ? {
+		base: e.slice(0, t),
+		opacity: Number.parseInt(n, 10)
+	} : null;
+}
+function at(e) {
+	if (rt(e)) return e.opacity === 100 ? e.name : `${e.name}/${e.opacity}`;
+	let t = e.hex.toUpperCase();
+	return e.opacity === 100 ? t : `${t}/${e.opacity}`;
+}
+function ot(e) {
+	let t = it(e.trim());
+	if (!t) return null;
+	if (et.test(t.base)) {
+		let e = t.opacity ?? 100;
+		return e < 0 || e > 100 ? null : {
+			hex: t.base.toUpperCase(),
+			opacity: e
+		};
+	}
+	if (!tt.has(t.base)) return null;
+	let n = t.opacity ?? 100;
+	return nt.has(n) ? {
+		name: t.base,
+		opacity: n
+	} : null;
+}
+var st = /^[#0-9a-z%.,\s()-]+$/i, ct = /url|var|image|expression|attr/i;
+function lt(e) {
 	let t = e.trim();
-	return t !== "" && t.length <= 200 && ae.test(t) && !oe.test(t);
+	return t !== "" && t.length <= 200 && st.test(t) && !ct.test(t);
 }
-function se(e) {
-	if (m(e.value)) return `${e.kind}-gradient(${e.value.trim()})`;
+function ut(e) {
+	if (lt(e.value)) return `${e.kind}-gradient(${e.value.trim()})`;
 }
 // src/schema/style/page-styles.ts
-var ce = /^#[0-9A-Fa-f]{6}$/;
-function le(e) {
-	return ce.test(e) ? [
+var dt = /^#[0-9A-Fa-f]{6}$/;
+function ft(e) {
+	return dt.test(e) ? [
 		Number.parseInt(e.slice(1, 3), 16),
 		Number.parseInt(e.slice(3, 5), 16),
 		Number.parseInt(e.slice(5, 7), 16)
 	] : null;
 }
-function ue(e) {
-	if (ee(e)) return l(e);
-	let t = le(e.hex);
-	if (!t || !Number.isFinite(e.opacity)) return;
-	if (e.opacity === 100) return e.hex.toUpperCase();
-	let n = Math.min(100, Math.max(0, e.opacity)) / 100, [r, i, a] = t;
-	return `rgba(${r}, ${i}, ${a}, ${n})`;
+function pt(t) {
+	if (se(t)) return e(t);
+	let n = ft(t.hex);
+	if (!n || !Number.isFinite(t.opacity)) return;
+	if (t.opacity === 100) return t.hex.toUpperCase();
+	let r = Math.min(100, Math.max(0, t.opacity)) / 100, [i, a, o] = n;
+	return `rgba(${i}, ${a}, ${o}, ${r})`;
 }
-function de(e) {
+function mt(e) {
 	if (!(!Number.isFinite(e) || e <= 0)) return `${e}px`;
 }
 // src/schema/style/backgroundStyle.ts
-function fe(e) {
-	if (e.backgroundType === "gradient") return "transparent";
-	if (e.backgroundColor) return ee(e.backgroundColor) ? l(e.backgroundColor) : ue(e.backgroundColor);
+function ht(t) {
+	if (t.backgroundType === "gradient") return "transparent";
+	if (t.backgroundColor) return se(t.backgroundColor) ? e(t.backgroundColor) : pt(t.backgroundColor);
 }
-function pe(e) {
+function gt(e) {
 	if (e.backgroundType !== "gradient") return "none";
-	if (e.backgroundGradient) return se(e.backgroundGradient);
+	if (e.backgroundGradient) return ut(e.backgroundGradient);
 }
-function me(e, t) {
+function _t(e, t) {
 	return e.backgroundType ? {
-		[`${t}-background-color`]: fe(e),
-		[`${t}-background-image`]: pe(e)
+		[`${t}-background-color`]: ht(e),
+		[`${t}-background-image`]: gt(e)
 	} : {};
 }
 // src/schema/style/elementStyle.ts
-var h = [
+var vt = [
 	"none",
 	"solid",
 	"dashed",
 	"dotted",
 	"double"
-], he = [
+], yt = [
 	"row",
 	"column",
 	"row-reverse",
 	"column-reverse"
-], ge = [
+], bt = [
 	"nowrap",
 	"wrap",
 	"wrap-reverse"
-], _e = [
+], xt = [
 	"flex-start",
 	"center",
 	"flex-end",
 	"space-between",
 	"space-around",
 	"space-evenly"
-], ve = [
+], St = [
 	"stretch",
 	"flex-start",
 	"center",
 	"flex-end",
 	"baseline"
-], ye = ["stretch", ..._e], g = {
+], Ct = ["stretch", ...xt], M = {
 	layout: "block",
 	flexDirection: "row",
 	flexWrap: "nowrap",
@@ -118,425 +499,326 @@ var h = [
 		hex: "#000000",
 		opacity: 100
 	}
-}, _ = /^(auto|0|-?\d+(\.\d+)?(px|rem|em|%))$/i, be = /^(0|\d+(\.\d+)?(px|rem|em))$/i;
-function v(e) {
+}, wt = /^(auto|0|-?\d+(\.\d+)?(px|rem|em|%))$/i, Tt = /^(0|\d+(\.\d+)?(px|rem|em))$/i;
+function N(e) {
 	let t = e.trim();
-	if (_.test(t)) return t;
+	if (wt.test(t)) return t;
 }
-function y(e) {
-	let t = v(e);
+function P(e) {
+	let t = N(e);
 	if (t != null) return t.toLowerCase() === "auto" ? "0" : t;
 }
-function xe(e) {
-	let t = v(e);
+function Et(e) {
+	let t = N(e);
 	return t?.toLowerCase() === "auto" ? "none" : t;
 }
-function Se(e) {
+function Dt(e) {
 	let t = e.trim();
-	return be.test(t) ? t : void 0;
+	return Tt.test(t) ? t : void 0;
 }
-function Ce(e, t) {
+function Ot(e, t) {
 	return e === "hide" ? "hidden" : t ? "auto" : "hidden";
 }
-var we = [
+var kt = [
 	"marginTop",
 	"marginBottom",
 	"marginLeft",
 	"marginRight"
 ];
-function Te(e) {
+function At(e) {
 	return e.trim().toLowerCase() === "auto";
 }
-function b(e, t) {
-	return we.every((t) => Te(e[t])) ? "0" : v(e[t]);
+function jt(e, t) {
+	return kt.every((t) => At(e[t])) ? "0" : N(e[t]);
 }
-function Ee(e) {
+function Mt(e) {
 	return e.layout !== "grid" || e.gridColumns == null ? "none" : `repeat(${e.gridColumns}, minmax(0, 1fr))`;
 }
-function De(e, t) {
+function Nt(e, t) {
 	let n = {
-		...g,
+		...M,
 		...e
 	}, r = `--palmyit-${t}`;
 	return {
 		[`${r}-display`]: n.layout,
-		[`${r}-grid-template-columns`]: Ee(n),
+		[`${r}-grid-template-columns`]: Mt(n),
 		[`${r}-flex-direction`]: n.flexDirection,
 		[`${r}-flex-wrap`]: n.flexWrap,
 		[`${r}-justify-content`]: n.justifyContent,
 		[`${r}-align-items`]: n.alignItems,
 		[`${r}-align-content`]: n.alignContent,
-		[`${r}-row-gap`]: y(n.rowGap),
-		[`${r}-column-gap`]: y(n.columnGap),
-		[`${r}-overflow-x`]: Ce(n.overflow, n.overflowHorizontal),
-		[`${r}-overflow-y`]: Ce(n.overflow, n.overflowVertical),
-		[`${r}-width`]: v(n.width),
-		[`${r}-height`]: v(n.height),
-		[`${r}-min-width`]: v(n.minWidth),
-		[`${r}-min-height`]: v(n.minHeight),
-		[`${r}-max-width`]: xe(n.maxWidth),
-		[`${r}-max-height`]: xe(n.maxHeight),
-		[`${r}-padding-top`]: y(n.paddingTop),
-		[`${r}-padding-bottom`]: y(n.paddingBottom),
-		[`${r}-padding-left`]: y(n.paddingLeft),
-		[`${r}-padding-right`]: y(n.paddingRight),
-		[`${r}-margin-top`]: b(n, "marginTop"),
-		[`${r}-margin-bottom`]: b(n, "marginBottom"),
-		[`${r}-margin-left`]: b(n, "marginLeft"),
-		[`${r}-margin-right`]: b(n, "marginRight"),
-		[`${r}-border-top-left-radius`]: y(n.borderRadiusTopLeft),
-		[`${r}-border-top-right-radius`]: y(n.borderRadiusTopRight),
-		[`${r}-border-bottom-right-radius`]: y(n.borderRadiusBottomRight),
-		[`${r}-border-bottom-left-radius`]: y(n.borderRadiusBottomLeft),
-		[`${r}-border-width`]: Se(n.borderWidth),
+		[`${r}-row-gap`]: P(n.rowGap),
+		[`${r}-column-gap`]: P(n.columnGap),
+		[`${r}-overflow-x`]: Ot(n.overflow, n.overflowHorizontal),
+		[`${r}-overflow-y`]: Ot(n.overflow, n.overflowVertical),
+		[`${r}-width`]: N(n.width),
+		[`${r}-height`]: N(n.height),
+		[`${r}-min-width`]: N(n.minWidth),
+		[`${r}-min-height`]: N(n.minHeight),
+		[`${r}-max-width`]: Et(n.maxWidth),
+		[`${r}-max-height`]: Et(n.maxHeight),
+		[`${r}-padding-top`]: P(n.paddingTop),
+		[`${r}-padding-bottom`]: P(n.paddingBottom),
+		[`${r}-padding-left`]: P(n.paddingLeft),
+		[`${r}-padding-right`]: P(n.paddingRight),
+		[`${r}-margin-top`]: jt(n, "marginTop"),
+		[`${r}-margin-bottom`]: jt(n, "marginBottom"),
+		[`${r}-margin-left`]: jt(n, "marginLeft"),
+		[`${r}-margin-right`]: jt(n, "marginRight"),
+		[`${r}-border-top-left-radius`]: P(n.borderRadiusTopLeft),
+		[`${r}-border-top-right-radius`]: P(n.borderRadiusTopRight),
+		[`${r}-border-bottom-right-radius`]: P(n.borderRadiusBottomRight),
+		[`${r}-border-bottom-left-radius`]: P(n.borderRadiusBottomLeft),
+		[`${r}-border-width`]: Dt(n.borderWidth),
 		[`${r}-border-style`]: n.borderStyle,
-		[`${r}-border-color`]: ue(n.borderColor),
-		...me(n, r)
+		[`${r}-border-color`]: pt(n.borderColor),
+		..._t(n, r)
 	};
 }
 // src/schema/styleTokensSchema.ts
-var Oe = d.enum(ie), ke = d.enum(t), Ae = d.enum(c), je = d.enum(r), Me = d.enum(ne), Ne = d.enum(i), x = d.string().trim().regex(_, "Expected auto, 0, or a px, rem, em, or % length"), S = d.union([
-	Oe,
-	Ae,
-	x
-]), Pe = d.union([ke, x]), Fe = d.union([
-	je,
-	d.number().min(1).max(200),
-	x
-]), Ie = d.union([Me, x]), Le = d.union([Ne, x]), Re = d.strictObject({
-	hex: d.string().regex(/^#[0-9A-Fa-f]{6}$/, "Expected a #RRGGBB color"),
-	opacity: d.number().int().min(0).max(100)
-}), ze = new Set(n), Be = d.strictObject({
-	name: d.enum(u),
-	opacity: d.number().int().refine((e) => ze.has(e), "Expected a Tailwind opacity step such as 0, 10, 50, or 100")
-}), C = d.union([Be, Re]), Ve = d.strictObject({
-	kind: d.enum(["linear", "radial"]),
-	value: d.string().refine(m, "Expected gradient arguments such as 135deg, #2563EB, #7C3AED")
+var Pt = y.enum(i), Ft = y.enum(pe), It = y.enum(te), Lt = y.enum(r), Rt = y.enum(n), zt = y.enum(m), F = y.string().trim().regex(wt, "Expected auto, 0, or a px, rem, em, or % length"), I = y.union([
+	Pt,
+	It,
+	F
+]), Bt = y.union([Ft, F]), Vt = y.union([
+	Lt,
+	y.number().min(1).max(200),
+	F
+]), Ht = y.union([Rt, F]), Ut = y.union([zt, F]), Wt = y.strictObject({
+	hex: y.string().regex(/^#[0-9A-Fa-f]{6}$/, "Expected a #RRGGBB color"),
+	opacity: y.number().int().min(0).max(100)
+}), Gt = new Set(fe), Kt = y.strictObject({
+	name: y.enum(ee),
+	opacity: y.number().int().refine((e) => Gt.has(e), "Expected a Tailwind opacity step such as 0, 10, 50, or 100")
+}), qt = y.union([Kt, Wt]), Jt = y.string().transform((e, t) => ot(e) || (t.addIssue({
+	code: "custom",
+	message: "Expected a color such as #DC2626, #DC2626/80, or slate-700/50"
+}), y.NEVER));
+function L(e) {
+	return {
+		...e,
+		value: qt,
+		document: {
+			schema: Jt,
+			encode: (e) => at(e)
+		}
+	};
+}
+// src/schema/Fields/FontStyleField.ts
+var Yt = [
+	"normal",
+	"italic",
+	"oblique"
+], Xt = [
+	"none",
+	"underline",
+	"overline",
+	"line-through"
+], Zt = [
+	"start",
+	"end",
+	"left",
+	"center",
+	"right",
+	"justify"
+], Qt = [
+	"none",
+	"capitalize",
+	"uppercase",
+	"lowercase"
+], $t = [
+	"100",
+	"200",
+	"300",
+	"400",
+	"500",
+	"600",
+	"700",
+	"800",
+	"900"
+], en = {
+	text: "Text",
+	...d,
+	style: {}
+}, tn = "--palmyit-text";
+function nn(e) {
+	return [
+		{
+			key: "textFont",
+			variable: `${e}-font-family`,
+			value: y.string().refine(ie, "Expected a Google Fonts family name"),
+			label: "Font family"
+		},
+		{
+			key: "fontStyle",
+			variable: `${e}-font-style`,
+			value: y.enum(Yt),
+			label: "Text style"
+		},
+		{
+			key: "textSize",
+			variable: `${e}-font-size`,
+			value: Vt,
+			label: "Text size"
+		},
+		L({
+			key: "textColor",
+			variable: `${e}-color`,
+			label: "Text color"
+		}),
+		{
+			key: "lineHeight",
+			variable: `${e}-line-height`,
+			value: Ht,
+			label: "Height"
+		},
+		{
+			key: "letterSpacing",
+			variable: `${e}-letter-spacing`,
+			value: Ut,
+			label: "Letter spacing"
+		},
+		{
+			key: "wordSpacing",
+			variable: `${e}-word-spacing`,
+			value: I,
+			label: "Word spacing"
+		},
+		{
+			key: "textDecoration",
+			variable: `${e}-text-decoration`,
+			value: y.enum(Xt),
+			label: "Text decoration"
+		},
+		{
+			key: "textAlign",
+			variable: `${e}-text-align`,
+			value: y.enum(Zt),
+			label: "Text align"
+		},
+		{
+			key: "textTransform",
+			variable: `${e}-text-transform`,
+			value: y.enum(Qt),
+			label: "Text transform"
+		},
+		{
+			key: "fontWeight",
+			variable: `${e}-font-weight`,
+			value: y.enum($t),
+			label: "Text weight"
+		}
+	];
+}
+var R = nn(tn), rn = k(x({
+	type: "PText",
+	label: "Text",
+	allowedChildren: [],
+	templates: [],
+	attributes: y.strictObject({
+		id: b,
+		text: y.string().trim().min(1, "Enter text").default(en.text),
+		...t,
+		style: D(R).transform((e) => e)
+	}),
+	toDocumentAttributes: ({ id: e, text: t, href: n, target: r, description: i, rel: a, style: o }) => ({
+		id: e,
+		text: t,
+		..._({
+			href: n,
+			target: r,
+			description: i,
+			rel: a
+		}),
+		...E(T(o, R))
+	}),
+	history: {
+		summary: ({ text: e }) => e,
+		attributes: {
+			text: "Text",
+			...g,
+			...w(R, "style.")
+		}
+	}
+}), R), an = [
+	"1",
+	"2",
+	"3",
+	"4",
+	"5",
+	"6"
+], on = /^[a-z0-9]+(?:-[a-z0-9]+)*$/, z = {
+	text: "Heading",
+	level: "2",
+	anchor: "",
+	...d,
+	style: {}
+}, sn = "--palmyit-heading", B = nn(sn), cn = k(x({
+	type: "PHeading",
+	label: "Heading",
+	allowedChildren: [],
+	templates: [],
+	attributes: y.strictObject({
+		id: b,
+		text: y.string().trim().min(1, "Enter text").default(z.text),
+		level: y.enum(an).default(z.level),
+		anchor: y.string().trim().refine((e) => e === "" || on.test(e), { message: "Use lowercase letters, numbers, and hyphens" }).default(z.anchor),
+		...t,
+		style: D(B).transform((e) => e)
+	}),
+	toDocumentAttributes: ({ id: e, text: t, level: n, anchor: r, href: i, target: a, description: o, rel: s, style: c }) => ({
+		id: e,
+		text: t,
+		level: n,
+		...r === "" ? {} : { anchor: r },
+		..._({
+			href: i,
+			target: a,
+			description: o,
+			rel: s
+		}),
+		...E(T(c, B))
+	}),
+	history: {
+		summary: ({ text: e }) => e,
+		attributes: {
+			text: "Text",
+			level: "Level",
+			anchor: "Anchor",
+			...g,
+			...w(B, "style.")
+		}
+	}
+}), B), ln = y.strictObject({
+	kind: y.enum(["linear", "radial"]),
+	value: y.string().refine(lt, "Expected gradient arguments such as 135deg, #2563EB, #7C3AED")
 });
-function w(e, { defaults: t, typeAttribute: n } = {}) {
+function V(e, { defaults: t, typeAttribute: n } = {}) {
 	return [
 		{
 			key: "backgroundType",
 			...n ? { attribute: n } : {},
-			value: d.enum(["color", "gradient"]),
+			value: y.enum(["color", "gradient"]),
 			defaultValue: t?.backgroundType,
 			label: "Background type"
 		},
-		{
+		L({
 			key: "backgroundColor",
 			variable: `${e}-background-color`,
-			value: C,
 			defaultValue: t?.backgroundColor,
 			label: "Background color"
-		},
+		}),
 		{
 			key: "backgroundGradient",
 			variable: `${e}-background-image`,
-			value: Ve,
+			value: ln,
 			defaultValue: t?.backgroundGradient,
 			label: "Background gradient"
 		}
 	];
 }
-// src/schema/device/devices.ts
-var T = [
-	{
-		name: "Desktop",
-		icon: "Monitor",
-		portrait: {
-			width: 1280,
-			height: "auto"
-		}
-	},
-	{
-		name: "Tablet",
-		icon: "Tablet",
-		portrait: {
-			width: 768,
-			height: "auto"
-		},
-		landscape: {
-			width: 1024,
-			height: 768
-		}
-	},
-	{
-		name: "Mobile",
-		icon: "Smartphone",
-		portrait: {
-			width: 360,
-			height: "auto"
-		},
-		landscape: {
-			width: 640,
-			height: 360
-		}
-	}
-], He = T.map(({ portrait: e, icon: t, name: n }) => ({
-	...e,
-	icon: t,
-	label: n
-}));
-function Ue(e) {
-	return T.find((t) => t.portrait.width === e || t.landscape?.width === e) ?? T[0];
-}
-function We(e) {
-	return Ue(e).landscape?.width === e ? "landscape" : "portrait";
-}
-// src/schema/deviceVisibility.ts
-var E = {
-	Desktop: "showOnDesktop",
-	Tablet: "showOnTablet",
-	Mobile: "showOnMobile"
-}, Ge = {
-	Tablet: "showOnTabletLandscape",
-	Mobile: "showOnMobileLandscape"
-}, Ke = [...Object.values(E), ...Object.values(Ge)], qe = T.flatMap(({ name: e, landscape: t }) => t ? [{
-	device: e,
-	orientation: "portrait"
-}, {
-	device: e,
-	orientation: "landscape"
-}] : [{
-	device: e,
-	orientation: "portrait"
-}]);
-function Je(e, t) {
-	return (t === "landscape" ? Ge[e] : void 0) ?? E[e];
-}
-function D(e, t, n = "portrait") {
-	let r = e[Je(t, n)];
-	return r === void 0 ? e[E[t]] !== !1 : r;
-}
-function Ye(e) {
-	return qe.filter(({ device: t, orientation: n }) => D(e, t, n)).length;
-}
-// src/schema/styleItems.ts
-var Xe = d.strictObject({
-	key: d.string(),
-	variable: d.string().optional(),
-	variables: d.record(d.string(), d.string()).optional(),
-	attribute: d.string().optional(),
-	value: d.unknown()
-}), Ze = [
-	"variable",
-	"variables",
-	"attribute"
-];
-function Qe(e) {
-	let t = {};
-	for (let n of e) n.defaultValue !== void 0 && (t[n.key] = n.defaultValue);
-	return t;
-}
-function $e(e, t) {
-	return Ze.find((n) => JSON.stringify(e[n]) !== JSON.stringify(t[n]));
-}
-function et(e, t, n) {
-	if (!t) return {
-		field: "key",
-		message: `Unknown style key "${e.key}"`
-	};
-	if (n.has(e.key)) return {
-		field: "key",
-		message: `Style key "${e.key}" appears twice`
-	};
-	let r = $e(e, t);
-	if (r) return {
-		field: r,
-		message: `Style "${e.key}" ${r} does not match the element configuration`
-	};
-}
-function O(e) {
-	return nt(e, () => Qe(e));
-}
-function tt(e) {
-	return nt(e, () => ({}));
-}
-function nt(e, t) {
-	let n = new Map(e.map((e) => [e.key, e]));
-	return d.array(Xe).default([]).transform((e, r) => {
-		let i = t(), a = /* @__PURE__ */ new Set();
-		return e.forEach((e, t) => {
-			let o = n.get(e.key), s = et(e, o, a);
-			if (s || !o) {
-				r.addIssue({
-					code: "custom",
-					path: [t, s?.field ?? "key"],
-					message: s?.message ?? ""
-				});
-				return;
-			}
-			a.add(e.key);
-			let c = o.value.safeParse(e.value);
-			if (c.success) i[e.key] = c.data;
-			else {
-				let e = c.error.issues[0]?.message ?? "Invalid value";
-				r.addIssue({
-					code: "custom",
-					path: [t, "value"],
-					message: e
-				});
-			}
-		}), i;
-	});
-}
-function rt(e, t) {
-	let n = Object.fromEntries(Ze.filter((t) => e[t] !== void 0).map((t) => [t, e[t]]));
-	return {
-		key: e.key,
-		...n,
-		value: t
-	};
-}
-function k(e, t = "") {
-	return Object.fromEntries(e.flatMap(({ key: e, label: n }) => n === void 0 ? [] : [[`${t}${e}`, n]]));
-}
-function A(e, t) {
-	return at({
-		...Qe(t),
-		...e
-	}, t);
-}
-function it(e, t) {
-	return at(e ?? {}, t);
-}
-function at(e, t) {
-	return t.filter((t) => e[t.key] !== void 0).map((t) => rt(t, e[t.key]));
-}
-// src/schema/deviceSettings.ts
-var j = [
-	{
-		prop: "tabletStyle",
-		device: "Tablet"
-	},
-	{
-		prop: "mobileStyle",
-		device: "Mobile"
-	},
-	{
-		prop: "tabletLandscapeStyle",
-		device: "Landscape tablet"
-	},
-	{
-		prop: "mobileLandscapeStyle",
-		device: "Landscape mobile"
-	}
-], ot = {
-	showOnDesktop: "Show on desktop",
-	showOnTablet: "Show on portrait tablet",
-	showOnTabletLandscape: "Show on landscape tablet",
-	showOnMobile: "Show on portrait mobile",
-	showOnMobileLandscape: "Show on landscape mobile"
-}, st = Object.fromEntries(Ke.map((e) => [e, d.boolean().optional()]));
-function ct(e) {
-	let t = e ? Object.fromEntries(j.map(({ prop: t }) => [t, tt(e).optional()])) : {};
-	return d.strictObject({
-		...st,
-		...t
-	}).refine((e) => Ye(e) > 0, {
-		path: ["showOnDesktop"],
-		message: "Show the element on at least one device"
-	});
-}
-function lt(e, t, n) {
-	return Object.fromEntries(Object.entries(e).filter(([e]) => t.has(e) === n));
-}
-function ut(e, t) {
-	let n = new Set(Object.keys(t.shape));
-	return d.record(d.string(), d.unknown()).transform((r, i) => {
-		let a = e.safeParse(lt(r, n, !1)), o = t.safeParse(lt(r, n, !0));
-		for (let e of [...a.error?.issues ?? [], ...o.error?.issues ?? []]) i.addIssue({
-			code: "custom",
-			path: e.path,
-			message: e.message
-		});
-		return !a.success || !o.success ? d.NEVER : {
-			...a.data,
-			...dt(o.data)
-		};
-	});
-}
-function dt(e) {
-	return Object.fromEntries(Object.entries(e).filter(([, e]) => !ft(e)));
-}
-function ft(e) {
-	return e === void 0 || typeof e == "object" && !!e && Object.keys(e).length === 0;
-}
-function pt(e) {
-	return Object.fromEntries(qe.flatMap(({ device: t, orientation: n }) => {
-		let r = D(e, t, n);
-		return (n === "portrait" ? !r : r !== D(e, t, "portrait")) ? [[Je(t, n), r]] : [];
-	}));
-}
-function mt(e, t) {
-	return Object.fromEntries(j.flatMap(({ prop: n }) => {
-		let r = it(e[n], t);
-		return r.length > 0 ? [[n, r]] : [];
-	}));
-}
-function ht(e) {
-	return `${e.charAt(0).toLowerCase()}${e.slice(1)}`;
-}
-function gt(e) {
-	return Object.fromEntries(j.flatMap(({ prop: t, device: n }) => Object.entries(k(e, `${t}.`)).map(([e, t]) => [e, `${n} ${ht(t)}`])));
-}
-function M(e, t) {
-	return {
-		...e,
-		attributes: ut(e.attributes, ct(t)),
-		toDocumentAttributes: (n) => ({
-			...e.toDocumentAttributes(n),
-			...pt(n),
-			...t ? mt(n, t) : {}
-		}),
-		history: {
-			summary: e.history.summary,
-			attributes: {
-				...e.history.attributes,
-				...ot,
-				...t ? gt(t) : {}
-			}
-		}
-	};
-}
-// src/schema/addressSchema.ts
-var _t = "Enter an https:// address or a path that starts with /";
-function vt(e) {
-	if (e.startsWith("/")) return !e.startsWith("//") && !e.startsWith("/\\");
-	try {
-		let { protocol: t } = new URL(e);
-		return t === "https:" || t === "http:";
-	} catch {
-		return !1;
-	}
-}
-var N = d.string().trim().min(1, _t).refine(vt, _t), yt = ["_self", "_blank"], P = {
-	href: "",
-	target: "_self",
-	description: ""
-}, F = {
-	href: d.string().trim().pipe(d.union([d.literal(""), N])).default(P.href),
-	target: d.enum(yt).default(P.target),
-	description: d.string().trim().default(P.description)
-}, I = {
-	href: "Link address",
-	target: "Link target",
-	description: "Link description"
-};
-function L({ href: e, target: t, description: n }) {
-	return e === "" ? {} : {
-		href: e,
-		...t === P.target ? {} : { target: t },
-		...n === "" ? {} : { description: n }
-	};
-}
-// src/elements/rich-text/richTextMarks.ts
-var bt = /^[A-Za-z0-9][A-Za-z0-9 ]*$/;
-function xt(e) {
-	return typeof e == "string" && bt.test(e);
-}
 // src/schema/elementStyleDefinitions.ts
-var R = [
+var H = [
 	[
 		"width",
 		"width",
@@ -580,12 +862,12 @@ var R = [
 	[
 		"paddingLeft",
 		"padding-left",
-		"Padding left"
+		"Padding start"
 	],
 	[
 		"paddingRight",
 		"padding-right",
-		"Padding right"
+		"Padding end"
 	],
 	[
 		"marginTop",
@@ -600,12 +882,12 @@ var R = [
 	[
 		"marginLeft",
 		"margin-left",
-		"Margin left"
+		"Margin start"
 	],
 	[
 		"marginRight",
 		"margin-right",
-		"Margin right"
+		"Margin end"
 	],
 	[
 		"borderRadiusTopLeft",
@@ -628,14 +910,14 @@ var R = [
 		"Radius bottom left"
 	]
 ];
-function St(e) {
+function un(e) {
 	let t = `--palmyit-${e}`, n = {
 		key: "gridColumns",
 		variable: `${t}-grid-template-columns`,
-		value: d.union([
-			d.literal(2),
-			d.literal(3),
-			d.literal(4)
+		value: y.union([
+			y.literal(2),
+			y.literal(3),
+			y.literal(4)
 		]),
 		label: "Grid columns"
 	};
@@ -644,7 +926,7 @@ function St(e) {
 			key: "layout",
 			variable: `${t}-display`,
 			attribute: "data-layout",
-			value: d.enum([
+			value: y.enum([
 				"block",
 				"flex",
 				"grid"
@@ -653,64 +935,64 @@ function St(e) {
 			label: "Layout"
 		},
 		n,
-		...Ct(e)
+		...dn(e)
 	];
 }
-function Ct(e) {
+function dn(e) {
 	let t = `--palmyit-${e}`;
 	return [
 		{
 			key: "flexDirection",
 			variable: `${t}-flex-direction`,
-			value: d.enum(he),
-			defaultValue: g.flexDirection,
+			value: y.enum(yt),
+			defaultValue: M.flexDirection,
 			label: "Direction"
 		},
 		{
 			key: "flexWrap",
 			variable: `${t}-flex-wrap`,
-			value: d.enum(ge),
-			defaultValue: g.flexWrap,
+			value: y.enum(bt),
+			defaultValue: M.flexWrap,
 			label: "Wrap"
 		},
 		{
 			key: "justifyContent",
 			variable: `${t}-justify-content`,
-			value: d.enum(_e),
-			defaultValue: g.justifyContent,
+			value: y.enum(xt),
+			defaultValue: M.justifyContent,
 			label: "Justify"
 		},
 		{
 			key: "alignItems",
 			variable: `${t}-align-items`,
-			value: d.enum(ve),
-			defaultValue: g.alignItems,
+			value: y.enum(St),
+			defaultValue: M.alignItems,
 			label: "Align items"
 		},
 		{
 			key: "alignContent",
 			variable: `${t}-align-content`,
-			value: d.enum(ye),
-			defaultValue: g.alignContent,
+			value: y.enum(Ct),
+			defaultValue: M.alignContent,
 			label: "Align content"
 		},
 		{
 			key: "rowGap",
 			variable: `${t}-row-gap`,
-			value: S,
-			defaultValue: g.rowGap,
+			value: I,
+			defaultValue: M.rowGap,
 			label: "Row gap"
 		},
 		{
 			key: "columnGap",
 			variable: `${t}-column-gap`,
-			value: S,
-			defaultValue: g.columnGap,
+			value: I,
+			defaultValue: M.columnGap,
 			label: "Column gap"
 		}
 	];
 }
-function wt(e, t) {
+function fn(e, t) {
 	let n = `--palmyit-${e}`;
 	return [
 		{
@@ -719,175 +1001,417 @@ function wt(e, t) {
 				x: `${n}-overflow-x`,
 				y: `${n}-overflow-y`
 			},
-			value: d.enum(["show", "hide"]),
+			value: y.enum(["show", "hide"]),
 			defaultValue: t.overflow,
 			label: "Overflowing contents"
 		},
 		{
 			key: "overflowHorizontal",
 			variable: `${n}-overflow-x`,
-			value: d.boolean(),
+			value: y.boolean(),
 			defaultValue: t.overflowHorizontal,
 			label: "Horizontal overflow"
 		},
 		{
 			key: "overflowVertical",
 			variable: `${n}-overflow-y`,
-			value: d.boolean(),
+			value: y.boolean(),
 			defaultValue: t.overflowVertical,
 			label: "Vertical overflow"
 		}
 	];
 }
-function Tt(e, t) {
-	return R.map(([n, r, i]) => ({
+function pn(e, t) {
+	return H.map(([n, r, i]) => ({
 		key: n,
 		variable: `--palmyit-${e}-${r}`,
-		value: S,
+		value: I,
 		defaultValue: t[n],
 		label: i
 	}));
 }
-function Et(e, t) {
+function mn(e, t) {
 	let n = `--palmyit-${e}`;
 	return [
 		{
 			key: "borderWidth",
 			variable: `${n}-border-width`,
-			value: Pe,
+			value: Bt,
 			defaultValue: t.borderWidth,
 			label: "Border width"
 		},
 		{
 			key: "borderStyle",
 			variable: `${n}-border-style`,
-			value: d.enum(h),
+			value: y.enum(vt),
 			defaultValue: t.borderStyle,
 			label: "Border style"
 		},
-		{
-			key: "borderColor",
-			variable: `${n}-border-color`,
-			value: C,
-			defaultValue: t.borderColor,
-			label: "Border color"
+		L({
+			key: "borderColor",
+			variable: `${n}-border-color`,
+			defaultValue: t.borderColor,
+			label: "Border color"
+		})
+	];
+}
+function hn(e, t) {
+	return [
+		...un(e),
+		...fn(e, t),
+		...pn(e, t),
+		...mn(e, t),
+		...V(`--palmyit-${e}`, { defaults: t })
+	];
+}
+function gn(e, t) {
+	return D(e).transform((e) => ({
+		...t,
+		...e
+	})).superRefine((e, t) => {
+		e.layout === "grid" && e.gridColumns == null && t.addIssue({
+			code: "custom",
+			path: ["gridColumns"],
+			message: "A grid layout needs 2, 3, or 4 columns"
+		});
+	});
+}
+// src/elements/image/definition.ts
+var _n = [
+	"width",
+	"height",
+	"minWidth",
+	"minHeight",
+	"maxWidth",
+	"maxHeight"
+], vn = [
+	"borderRadiusTopLeft",
+	"borderRadiusTopRight",
+	"borderRadiusBottomRight",
+	"borderRadiusBottomLeft"
+], yn = [..._n, ...vn], bn = [
+	"auto",
+	"square",
+	"video",
+	"3/4",
+	"4/3"
+], xn = ["cover", "contain"], Sn = [
+	"center",
+	"top",
+	"bottom",
+	"left",
+	"right",
+	"left-top",
+	"right-top",
+	"left-bottom",
+	"right-bottom"
+], Cn = [
+	"none",
+	"sm",
+	"md",
+	"lg",
+	"xl"
+], wn = ["start", "center"], U = {
+	src: "/image-placeholder.svg",
+	alt: "",
+	priority: !1,
+	caption: "",
+	decorative: !1,
+	intrinsicWidth: null,
+	intrinsicHeight: null,
+	tabletSrc: "",
+	mobileSrc: "",
+	aspectRatio: "auto",
+	objectFit: "",
+	objectPosition: "center",
+	shadow: "none",
+	captionAlign: "start",
+	style: {},
+	...d
+}, W = "--palmyit-image";
+function Tn(e) {
+	return H.filter(([t]) => e.includes(t)).map(([e, t, n]) => ({
+		key: e,
+		variable: `${W}-${t}`,
+		value: I,
+		label: n
+	}));
+}
+var G = [
+	...Tn(_n),
+	...V(W, { typeAttribute: "data-background" }),
+	{
+		key: "borderWidth",
+		variable: `${W}-border-width`,
+		value: Bt,
+		label: "Border width"
+	},
+	{
+		key: "borderStyle",
+		variable: `${W}-border-style`,
+		value: y.enum(vt),
+		label: "Border style"
+	},
+	L({
+		key: "borderColor",
+		variable: `${W}-border-color`,
+		label: "Border color"
+	}),
+	...Tn(vn)
+], En = y.string().trim().pipe(y.union([y.literal(""), v])).default(""), Dn = y.number().int().positive().nullable().default(null), On = k(x({
+	type: "PImage",
+	label: "Image",
+	allowedChildren: [],
+	templates: [],
+	attributes: y.strictObject({
+		id: b,
+		src: v.default(U.src),
+		alt: y.string().trim().default(U.alt),
+		priority: y.boolean().default(U.priority),
+		caption: y.string().trim().default(U.caption),
+		decorative: y.boolean().default(U.decorative),
+		intrinsicWidth: Dn,
+		intrinsicHeight: Dn,
+		tabletSrc: En,
+		mobileSrc: En,
+		aspectRatio: y.enum(bn).default(U.aspectRatio),
+		objectFit: y.union([y.literal(""), y.enum(xn)]).default(U.objectFit),
+		objectPosition: y.enum(Sn).default(U.objectPosition),
+		shadow: y.enum(Cn).default(U.shadow),
+		captionAlign: y.enum(wn).default(U.captionAlign),
+		style: D(G).transform((e) => e),
+		...t
+	}).refine(({ decorative: e, alt: t, src: n }) => e || t !== "" || n === U.src, {
+		path: ["alt"],
+		message: "Describe the image, or mark it decorative"
+	}).refine(({ href: e, alt: t, decorative: n }) => e === "" || n || t !== "", {
+		path: ["alt"],
+		message: "Describe a linked image so the link has a name"
+	}),
+	toDocumentAttributes: ({ id: e, src: t, alt: n, priority: r, caption: i, decorative: a, intrinsicWidth: o, intrinsicHeight: s, tabletSrc: c, mobileSrc: l, aspectRatio: u, objectFit: d, objectPosition: f, shadow: p, captionAlign: m, style: h, href: g, target: ee, description: te, rel: ne }) => ({
+		id: e,
+		src: t,
+		alt: n,
+		...r ? { priority: !0 } : {},
+		...i === "" ? {} : { caption: i },
+		...a ? { decorative: !0 } : {},
+		...o == null ? {} : { intrinsicWidth: o },
+		...s == null ? {} : { intrinsicHeight: s },
+		...c === "" ? {} : { tabletSrc: c },
+		...l === "" ? {} : { mobileSrc: l },
+		...u === U.aspectRatio ? {} : { aspectRatio: u },
+		...d === "" ? {} : { objectFit: d },
+		...f === U.objectPosition ? {} : { objectPosition: f },
+		...p === U.shadow ? {} : { shadow: p },
+		...m === U.captionAlign ? {} : { captionAlign: m },
+		...E(T(h, G)),
+		..._({
+			href: g,
+			target: ee,
+			description: te,
+			rel: ne
+		})
+	}),
+	history: {
+		summary: ({ alt: e, caption: t, decorative: n }) => n ? "Decorative image" : e || t || "Image",
+		attributes: {
+			src: "Image address",
+			alt: "Description",
+			priority: "Load first",
+			caption: "Caption",
+			decorative: "Decorative",
+			tabletSrc: "Tablet image",
+			mobileSrc: "Mobile image",
+			aspectRatio: "Aspect ratio",
+			objectFit: "Object fit",
+			objectPosition: "Focus point",
+			shadow: "Shadow",
+			captionAlign: "Caption align",
+			...g,
+			...w(G, "style.")
+		}
+	}
+}), G), kn = ["vertical", "horizontal"], An = [
+	"2",
+	"3",
+	"4",
+	"none"
+], K = {
+	title: "Article title",
+	titleLevel: "2",
+	excerpt: "A short summary of the article.",
+	href: "",
+	linkLabel: "Read more",
+	image: "",
+	imageAlt: "",
+	publishedAt: "",
+	author: "",
+	tags: [],
+	layout: "vertical",
+	clickableCard: !1,
+	excerptLines: "3",
+	imageAspect: "video",
+	shadow: "none"
+}, jn = y.string().trim().pipe(y.union([y.literal(""), v])).default(""), Mn = y.string().trim().pipe(y.union([y.literal(""), l])).default(""), Nn = k(x({
+	type: "PArticle",
+	label: "Article",
+	allowedChildren: [],
+	templates: [],
+	attributes: y.strictObject({
+		id: b,
+		title: y.string().trim().min(1, "Enter a title").default(K.title),
+		titleLevel: y.enum(an).default(K.titleLevel),
+		excerpt: y.string().trim().default(K.excerpt),
+		href: Mn,
+		linkLabel: y.string().trim().default(K.linkLabel),
+		image: jn,
+		imageAlt: y.string().trim().default(K.imageAlt),
+		publishedAt: y.string().trim().default(K.publishedAt),
+		author: y.string().trim().default(K.author),
+		tags: y.array(y.strictObject({ text: y.string().trim().min(1, "Enter tag text") })).default(K.tags),
+		layout: y.enum(kn).default(K.layout),
+		clickableCard: y.boolean().default(K.clickableCard),
+		excerptLines: y.enum(An).default(K.excerptLines),
+		imageAspect: y.enum(bn).default(K.imageAspect),
+		shadow: y.enum(Cn).default(K.shadow)
+	}).refine(({ image: e, imageAlt: t }) => e === "" || t !== "", {
+		path: ["imageAlt"],
+		message: "Describe the cover image"
+	}).refine(({ clickableCard: e, href: t }) => !e || t !== "", {
+		path: ["href"],
+		message: "Add a link for a clickable card"
+	}),
+	toDocumentAttributes: ({ id: e, title: t, titleLevel: n, excerpt: r, href: i, linkLabel: a, image: o, imageAlt: s, publishedAt: c, author: l, tags: u, layout: d, clickableCard: f, excerptLines: p, imageAspect: m, shadow: h }) => ({
+		id: e,
+		title: t,
+		...n === K.titleLevel ? {} : { titleLevel: n },
+		...r === "" ? {} : { excerpt: r },
+		...i === "" ? {} : { href: i },
+		...a === K.linkLabel ? {} : { linkLabel: a },
+		...o === "" ? {} : {
+			image: o,
+			imageAlt: s
+		},
+		...c === "" ? {} : { publishedAt: c },
+		...l === "" ? {} : { author: l },
+		...u.length === 0 ? {} : { tags: j(u) },
+		...d === K.layout ? {} : { layout: d },
+		...f ? { clickableCard: !0 } : {},
+		...p === K.excerptLines ? {} : { excerptLines: p },
+		...m === K.imageAspect ? {} : { imageAspect: m },
+		...h === K.shadow ? {} : { shadow: h }
+	}),
+	history: {
+		summary: ({ title: e }) => e,
+		attributes: {
+			title: "Title",
+			titleLevel: "Title level",
+			excerpt: "Excerpt",
+			href: "Link",
+			linkLabel: "Link label",
+			image: "Image",
+			imageAlt: "Image description",
+			publishedAt: "Published",
+			author: "Author",
+			tags: "Tags",
+			layout: "Layout",
+			clickableCard: "Clickable card",
+			excerptLines: "Excerpt lines",
+			imageAspect: "Image aspect",
+			shadow: "Shadow"
 		}
-	];
-}
-function Dt(e, t) {
-	return [
-		...St(e),
-		...wt(e, t),
-		...Tt(e, t),
-		...Et(e, t),
-		...w(`--palmyit-${e}`, { defaults: t })
-	];
-}
-function Ot(e, t) {
-	return O(e).transform((e) => ({
-		...t,
-		...e
-	})).superRefine((e, t) => {
-		e.layout === "grid" && e.gridColumns == null && t.addIssue({
-			code: "custom",
-			path: ["gridColumns"],
-			message: "A grid layout needs 2, 3, or 4 columns"
-		});
-	});
-}
-// src/schema/Fields/IconPicker/iconCatalog.ts
-var kt = /^MdOutline[A-Z0-9]/, At = "";
-function z(e) {
-	return kt.test(e);
+	}
+})), Pn = /* @__PURE__ */ "academic-cap.adjustments-horizontal.adjustments-vertical.archive-box.archive-box-arrow-down.archive-box-x-mark.arrow-down.arrow-down-circle.arrow-down-left.arrow-down-on-square.arrow-down-on-square-stack.arrow-down-right.arrow-down-tray.arrow-left.arrow-left-circle.arrow-left-end-on-rectangle.arrow-left-on-rectangle.arrow-left-start-on-rectangle.arrow-long-down.arrow-long-left.arrow-long-right.arrow-long-up.arrow-path.arrow-path-rounded-square.arrow-right.arrow-right-circle.arrow-right-end-on-rectangle.arrow-right-on-rectangle.arrow-right-start-on-rectangle.arrow-small-down.arrow-small-left.arrow-small-right.arrow-small-up.arrow-top-right-on-square.arrow-trending-down.arrow-trending-up.arrow-turn-down-left.arrow-turn-down-right.arrow-turn-left-down.arrow-turn-left-up.arrow-turn-right-down.arrow-turn-right-up.arrow-turn-up-left.arrow-turn-up-right.arrow-up.arrow-up-circle.arrow-up-left.arrow-up-on-square.arrow-up-on-square-stack.arrow-up-right.arrow-up-tray.arrow-uturn-down.arrow-uturn-left.arrow-uturn-right.arrow-uturn-up.arrows-pointing-in.arrows-pointing-out.arrows-right-left.arrows-up-down.at-symbol.backspace.backward.banknotes.bars-2.bars-3.bars-3-bottom-left.bars-3-bottom-right.bars-3-center-left.bars-4.bars-arrow-down.bars-arrow-up.battery-0.battery-100.battery-50.beaker.bell.bell-alert.bell-slash.bell-snooze.bold.bolt.bolt-slash.book-open.bookmark.bookmark-slash.bookmark-square.briefcase.bug-ant.building-library.building-office.building-office-2.building-storefront.cake.calculator.calendar.calendar-date-range.calendar-days.camera.chart-bar.chart-bar-square.chart-pie.chat-bubble-bottom-center.chat-bubble-bottom-center-text.chat-bubble-left.chat-bubble-left-ellipsis.chat-bubble-left-right.chat-bubble-oval-left.chat-bubble-oval-left-ellipsis.check.check-badge.check-circle.chevron-double-down.chevron-double-left.chevron-double-right.chevron-double-up.chevron-down.chevron-left.chevron-right.chevron-up.chevron-up-down.circle-stack.clipboard.clipboard-document.clipboard-document-check.clipboard-document-list.clock.cloud.cloud-arrow-down.cloud-arrow-up.code-bracket.code-bracket-square.cog.cog-6-tooth.cog-8-tooth.command-line.computer-desktop.cpu-chip.credit-card.cube.cube-transparent.currency-bangladeshi.currency-dollar.currency-euro.currency-pound.currency-rupee.currency-yen.cursor-arrow-rays.cursor-arrow-ripple.device-phone-mobile.device-tablet.divide.document.document-arrow-down.document-arrow-up.document-chart-bar.document-check.document-currency-bangladeshi.document-currency-dollar.document-currency-euro.document-currency-pound.document-currency-rupee.document-currency-yen.document-duplicate.document-magnifying-glass.document-minus.document-plus.document-text.ellipsis-horizontal.ellipsis-horizontal-circle.ellipsis-vertical.envelope.envelope-open.equals.exclamation-circle.exclamation-triangle.eye.eye-dropper.eye-slash.face-frown.face-smile.film.finger-print.fire.flag.folder.folder-arrow-down.folder-minus.folder-open.folder-plus.forward.funnel.gif.gift.gift-top.globe-alt.globe-americas.globe-asia-australia.globe-europe-africa.h1.h2.h3.hand-raised.hand-thumb-down.hand-thumb-up.hashtag.heart.home.home-modern.identification.inbox.inbox-arrow-down.inbox-stack.information-circle.italic.key.language.lifebuoy.light-bulb.link.link-slash.list-bullet.lock-closed.lock-open.magnifying-glass.magnifying-glass-circle.magnifying-glass-minus.magnifying-glass-plus.map.map-pin.megaphone.microphone.minus.minus-circle.minus-small.moon.musical-note.newspaper.no-symbol.numbered-list.paint-brush.paper-airplane.paper-clip.pause.pause-circle.pencil.pencil-square.percent-badge.phone.phone-arrow-down-left.phone-arrow-up-right.phone-x-mark.photo.play.play-circle.play-pause.plus.plus-circle.plus-small.power.presentation-chart-bar.presentation-chart-line.printer.puzzle-piece.qr-code.question-mark-circle.queue-list.radio.receipt-percent.receipt-refund.rectangle-group.rectangle-stack.rocket-launch.rss.scale.scissors.server.server-stack.share.shield-check.shield-exclamation.shopping-bag.shopping-cart.signal.signal-slash.slash.sparkles.speaker-wave.speaker-x-mark.square-2-stack.square-3-stack-3d.squares-2x2.squares-plus.star.stop.stop-circle.strikethrough.sun.swatch.table-cells.tag.ticket.trash.trophy.truck.tv.underline.user.user-circle.user-group.user-minus.user-plus.users.variable.video-camera.video-camera-slash.view-columns.viewfinder-circle.wallet.wifi.window.wrench.wrench-screwdriver.x-circle.x-mark".split("."), Fn = "", In = new Set(Pn);
+function Ln(e) {
+	return In.has(e);
 }
-function jt(e) {
-	return e.replace(/^MdOutline/, "").replace(/([a-z0-9])([A-Z])/g, "$1 $2");
+function Rn(e) {
+	return e ? e.split("-").map((e, t) => t === 0 ? e.charAt(0).toUpperCase() + e.slice(1) : e).join(" ") : "";
 }
 // src/elements/button/definition.ts
-var Mt = {
+var zn = {
 	name: "Button",
 	startIcon: "",
 	endIcon: "",
-	...P,
+	...d,
 	style: {}
-}, Nt = d.string().refine((e) => e === "" || z(e), "Expected an outlined Material icon name such as MdOutlineHome").default("");
-function Pt(e, t) {
+}, Bn = y.string().refine((e) => e === "" || Ln(e), "Expected a Heroicons name such as home").default("");
+function Vn(e, t) {
 	return t === "" ? {} : { [e]: t };
 }
-var B = "--palmyit-button", V = [
-	...w(B, { typeAttribute: "data-background" }),
+var q = "--palmyit-button", Hn = [
+	...V(q, { typeAttribute: "data-background" }),
 	{
 		key: "borderWidth",
-		variable: `${B}-border-width`,
-		value: Pe,
+		variable: `${q}-border-width`,
+		value: Bt,
 		label: "Border width"
 	},
 	{
 		key: "borderStyle",
-		variable: `${B}-border-style`,
-		value: d.enum(h),
+		variable: `${q}-border-style`,
+		value: y.enum(vt),
 		label: "Border style"
 	},
-	{
+	L({
 		key: "borderColor",
-		variable: `${B}-border-color`,
-		value: C,
+		variable: `${q}-border-color`,
 		label: "Border color"
-	},
-	...R.map(([e, t, n]) => ({
+	}),
+	...H.map(([e, t, n]) => ({
 		key: e,
-		variable: `${B}-${t}`,
-		value: S,
+		variable: `${q}-${t}`,
+		value: I,
 		label: n
 	})),
-	{
+	L({
 		key: "textColor",
-		variable: `${B}-text-color`,
-		value: C,
+		variable: `${q}-text-color`,
 		label: "Text color"
-	},
+	}),
 	{
 		key: "textFont",
-		variable: `${B}-font-family`,
-		value: d.string().refine(xt, "Expected a Google Fonts family name"),
+		variable: `${q}-font-family`,
+		value: y.string().refine(ie, "Expected a Google Fonts family name"),
 		label: "Font"
 	},
 	{
 		key: "textSize",
-		variable: `${B}-font-size`,
-		value: Fe,
+		variable: `${q}-font-size`,
+		value: Vt,
 		label: "Text size"
 	},
 	{
 		key: "iconGap",
-		variable: `${B}-gap`,
-		value: S,
+		variable: `${q}-gap`,
+		value: I,
 		label: "Icon gap"
 	}
-], Ft = M(p({
+], Un = k(x({
 	type: "PButton",
 	label: "Button",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		name: d.string().trim().min(1, "Enter a button label").default(Mt.name),
-		startIcon: Nt,
-		endIcon: Nt,
-		...F,
-		style: O(V).transform((e) => e)
+	attributes: y.strictObject({
+		id: b,
+		name: y.string().trim().min(1, "Enter a button label").default(zn.name),
+		startIcon: Bn,
+		endIcon: Bn,
+		...t,
+		style: D(Hn).transform((e) => e)
 	}),
-	toDocumentAttributes: ({ id: e, name: t, startIcon: n, endIcon: r, href: i, target: a, description: o, style: s }) => ({
+	toDocumentAttributes: ({ id: e, name: t, startIcon: n, endIcon: r, href: i, target: a, description: o, rel: s, style: c }) => ({
 		id: e,
 		name: t,
-		...Pt("startIcon", n),
-		...Pt("endIcon", r),
-		...L({
+		...Vn("startIcon", n),
+		...Vn("endIcon", r),
+		..._({
 			href: i,
 			target: a,
-			description: o
+			description: o,
+			rel: s
 		}),
-		style: A(s, V)
+		...E(T(c, Hn))
 	}),
 	history: {
 		summary: ({ name: e }) => e,
@@ -895,22 +1419,22 @@ var B = "--palmyit-button", V = [
 			name: "Label",
 			startIcon: "Start icon",
 			endIcon: "End icon",
-			...I,
-			...k(V, "style.")
+			...g,
+			...w(Hn, "style.")
 		}
 	}
-}), V), H = {
+}), Hn), Wn = {
 	label: "Checkbox",
 	checked: !1
-}, It = M(p({
+}, Gn = k(x({
 	type: "PCheckbox",
 	label: "Checkbox input",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		label: d.string().trim().min(1, "Enter a label").default(H.label),
-		checked: d.boolean().default(H.checked)
+	attributes: y.strictObject({
+		id: b,
+		label: y.string().trim().min(1, "Enter a label").default(Wn.label),
+		checked: y.boolean().default(Wn.checked)
 	}),
 	toDocumentAttributes: ({ id: e, label: t, checked: n }) => ({
 		id: e,
@@ -926,64 +1450,95 @@ var B = "--palmyit-button", V = [
 	}
 }));
 // src/schema/layoutElementConfiguration.ts
-function U({ type: e, label: t, kind: n, defaultStyle: r, allowedChildren: i, templates: a }) {
-	let o = Dt(n, r);
-	return M(p({
+function Kn({ type: e, label: t, kind: n, defaultStyle: r, allowedChildren: i, templates: a }) {
+	let o = hn(n, r);
+	return k(x({
 		type: e,
 		label: t,
 		allowedChildren: i,
 		templates: a,
-		attributes: d.strictObject({
-			id: f,
-			style: Ot(o, r)
+		attributes: y.strictObject({
+			id: b,
+			style: gn(o, r)
 		}),
 		toDocumentAttributes: ({ id: e, style: t }) => ({
 			id: e,
-			style: A(t, o)
+			...E(T(t, o))
 		}),
 		history: {
 			summary: () => t,
-			attributes: k(o, "style.")
+			attributes: w(o, "style.")
 		}
 	}), o);
 }
-// src/schema/layoutChildren.ts
-var W = [
-	"PContainer",
-	"PButton",
-	"PText",
-	"PRichText",
-	"PImage",
-	"PVideo",
-	"PList",
-	"PIcon",
-	"PDivider",
-	"PTable",
-	"PTextField",
-	"PTextArea",
-	"PCheckbox",
-	"PRadio",
-	"PSelect"
-], Lt = { ...g }, Rt = U({
+// src/schema/elementCategories.ts
+var qn = ["PPage", "PSection"], Jn = [
+	{
+		id: "basic",
+		title: "Basic",
+		components: [
+			"PButton",
+			"PText",
+			"PHeading",
+			"PRichText",
+			"PImage",
+			"PVideo",
+			"PList",
+			"PIcon",
+			"PDivider"
+		]
+	},
+	{
+		id: "layout",
+		title: "Layout",
+		components: [
+			"PContainer",
+			"PTable",
+			"PArticle",
+			"PNav",
+			"PFooter"
+		]
+	},
+	{
+		id: "inputs",
+		title: "Inputs",
+		components: [
+			"PTextField",
+			"PTextArea",
+			"PCheckbox",
+			"PRadio"
+		]
+	},
+	{
+		id: "dropdown",
+		title: "Dropdown",
+		components: ["PSelect"]
+	},
+	{
+		id: "feedback",
+		title: "Feedback",
+		components: []
+	}
+], Yn = /* @__PURE__ */ new Set(["PNav", "PFooter"]), Xn = Jn.flatMap(({ components: e }) => e).filter((e) => !Yn.has(e)), Zn = { ...M }, Qn = Kn({
 	type: "PContainer",
 	label: "Container",
 	kind: "container",
-	defaultStyle: Lt,
-	allowedChildren: W,
+	defaultStyle: Zn,
+	allowedChildren: Xn,
 	templates: []
-}), zt = [
+}), $n = [
 	"1",
 	"2",
 	"3",
 	"4"
-], Bt = { size: "4" }, Vt = M(p({
+], er = { size: "4" }, tr = k(x({
 	type: "PDivider",
 	label: "Divider",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		size: d.enum(zt).default(Bt.size)
+	attributes: y.strictObject({
+		id: b,
+		size: y.enum($n).default(er.size)
 	}),
 	toDocumentAttributes: ({ id: e, size: t }) => ({
 		id: e,
@@ -993,156 +1548,387 @@ var W = [
 		summary: () => "",
 		attributes: { size: "Width" }
 	}
-})), G = {
-	icon: "MdOutlineStarBorder",
+})), nr = {
+	...M,
+	layout: "grid",
+	gridColumns: 3
+}, J = {
+	linkGroups: [],
+	copyright: "© {year} All rights reserved.",
+	address: "",
+	phone: "",
+	email: "",
+	socialLinks: [],
+	style: nr
+}, rr = y.strictObject({
+	label: y.string().trim().min(1, "Enter a label"),
+	href: l
+}), ir = y.strictObject({
+	heading: y.string().trim().min(1, "Enter a heading"),
+	items: y.array(rr).min(1, "Add a link")
+}), ar = y.strictObject({
+	network: y.enum(oe),
+	href: l
+}), or = hn("footer", nr), sr = k(x({
+	type: "PFooter",
+	label: "Footer",
+	allowedChildren: Xn,
+	templates: [
+		{
+			name: "Minimal copyright",
+			shortcode: JSON.stringify({
+				copyright: "© {year} All rights reserved.",
+				linkGroups: [],
+				socialLinks: [],
+				address: "",
+				phone: "",
+				email: ""
+			})
+		},
+		{
+			name: "Link columns",
+			shortcode: JSON.stringify({
+				copyright: "© {year} All rights reserved.",
+				linkGroups: [{
+					heading: "Company",
+					items: [{
+						label: "About",
+						href: "/about"
+					}, {
+						label: "Contact",
+						href: "/contact"
+					}]
+				}, {
+					heading: "Resources",
+					items: [{
+						label: "Blog",
+						href: "/blog"
+					}, {
+						label: "Help",
+						href: "/help"
+					}]
+				}]
+			})
+		},
+		{
+			name: "Contact + social",
+			shortcode: JSON.stringify({
+				copyright: "© {year} All rights reserved.",
+				address: "123 Main Street",
+				phone: "+1 555 0100",
+				email: "hello@example.com",
+				socialLinks: [{
+					network: "x",
+					href: "https://x.com/example"
+				}, {
+					network: "linkedin",
+					href: "https://linkedin.com/company/example"
+				}]
+			})
+		}
+	],
+	attributes: y.strictObject({
+		id: b,
+		linkGroups: y.array(ir).default(J.linkGroups),
+		copyright: y.string().trim().default(J.copyright),
+		address: y.string().trim().default(J.address),
+		phone: y.string().trim().default(J.phone),
+		email: y.string().trim().default(J.email),
+		socialLinks: y.array(ar).default(J.socialLinks),
+		style: gn(or, nr)
+	}),
+	toDocumentAttributes: ({ id: e, linkGroups: t, copyright: n, address: r, phone: i, email: a, socialLinks: o, style: s }) => ({
+		id: e,
+		...t.length === 0 ? {} : { linkGroups: t },
+		...n === J.copyright ? {} : { copyright: n },
+		...r === "" ? {} : { address: r },
+		...i === "" ? {} : { phone: i },
+		...a === "" ? {} : { email: a },
+		...o.length === 0 ? {} : { socialLinks: o },
+		...E(T(s, or))
+	}),
+	history: {
+		summary: () => "Footer",
+		attributes: {
+			linkGroups: "Link groups",
+			copyright: "Copyright",
+			address: "Address",
+			phone: "Phone",
+			email: "Email",
+			socialLinks: "Social links",
+			...w(or, "style.")
+		}
+	}
+}), or), cr = [
+	"small",
+	"medium",
+	"large"
+], lr = ["outline", "solid"], Y = {
+	icon: "star",
 	label: "Icon",
-	...P
-}, Ht = M(p({
+	size: "medium",
+	shape: "outline",
+	...d
+}, ur = k(x({
 	type: "PIcon",
 	label: "Icon",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		icon: d.string().refine(z, "Choose an outlined Material icon such as MdOutlineHome").default(G.icon),
-		label: d.string().trim().default(G.label),
-		...F
+	attributes: y.strictObject({
+		id: b,
+		icon: y.string().refine(Ln, "Choose a Heroicons name such as home").default(Y.icon),
+		label: y.string().trim().default(Y.label),
+		size: y.enum(cr).default(Y.size),
+		shape: y.enum(lr).default(Y.shape),
+		...t
 	}).refine(({ href: e, label: t }) => e === "" || t !== "", {
 		path: ["label"],
 		message: "Describe a linked icon so the link has a name"
 	}),
-	toDocumentAttributes: ({ id: e, icon: t, label: n, href: r, target: i, description: a }) => ({
+	toDocumentAttributes: ({ id: e, icon: t, label: n, size: r, shape: i, href: a, target: o, description: s, rel: c }) => ({
 		id: e,
 		icon: t,
 		label: n,
-		...L({
-			href: r,
-			target: i,
-			description: a
+		size: r,
+		shape: i,
+		..._({
+			href: a,
+			target: o,
+			description: s,
+			rel: c
 		})
 	}),
 	history: {
-		summary: ({ icon: e, label: t }) => t || jt(e),
+		summary: ({ icon: e, label: t }) => t || Rn(e),
 		attributes: {
 			icon: "Icon",
 			label: "Description",
-			...I
+			size: "Size",
+			shape: "Shape",
+			...g
 		}
 	}
-})), Ut = [
-	"width",
-	"height",
-	"minWidth",
-	"minHeight",
-	"maxWidth",
-	"maxHeight"
-], Wt = [
-	"borderRadiusTopLeft",
-	"borderRadiusTopRight",
-	"borderRadiusBottomRight",
-	"borderRadiusBottomLeft"
-], Gt = [...Ut, ...Wt], Kt = {
-	src: "/image-placeholder.svg",
-	alt: "Image",
-	style: {},
-	...P
-}, K = "--palmyit-image";
-function qt(e) {
-	return R.filter(([t]) => e.includes(t)).map(([e, t, n]) => ({
-		key: e,
-		variable: `${K}-${t}`,
-		value: S,
-		label: n
-	}));
-}
-var q = [
-	...qt(Ut),
-	...w(K, { typeAttribute: "data-background" }),
-	{
-		key: "borderWidth",
-		variable: `${K}-border-width`,
-		value: Pe,
-		label: "Border width"
-	},
-	{
-		key: "borderStyle",
-		variable: `${K}-border-style`,
-		value: d.enum(h),
-		label: "Border style"
-	},
-	{
-		key: "borderColor",
-		variable: `${K}-border-color`,
-		value: C,
-		label: "Border color"
-	},
-	...qt(Wt)
-], Jt = M(p({
-	type: "PImage",
-	label: "Image",
+})), dr = [
+	"static",
+	"sticky",
+	"overlay"
+], fr = [
+	"start",
+	"center",
+	"end"
+], pr = ["collapse", "scroll"], mr = ["tablet", "mobile"], hr = [
+	"14",
+	"16",
+	"20"
+], X = {
+	brandText: "Site",
+	brandLogo: "",
+	brandHref: "/",
+	items: [{
+		label: "Home",
+		href: "/",
+		target: "_self"
+	}, {
+		label: "About",
+		href: "/about",
+		target: "_self"
+	}],
+	ctaLabel: "",
+	ctaHref: "",
+	position: "sticky",
+	alignment: "end",
+	mobileMenu: "collapse",
+	collapseAt: "mobile",
+	glass: !1,
+	border: !0,
+	shadow: !1,
+	height: "16"
+}, gr = y.strictObject({
+	label: y.string().trim().min(1, "Enter a label"),
+	href: l,
+	target: y.enum(c).default("_self")
+}), _r = x({
+	type: "PNav",
+	label: "Navigation",
 	allowedChildren: [],
-	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		src: N.default(Kt.src),
-		alt: d.string().trim().default(Kt.alt),
-		style: O(q).transform((e) => e),
-		...F
-	}).refine(({ href: e, alt: t }) => e === "" || t !== "", {
-		path: ["alt"],
-		message: "Describe a linked image so the link has a name"
+	templates: [
+		{
+			name: "Sticky links",
+			shortcode: JSON.stringify({
+				position: "sticky",
+				alignment: "end",
+				items: [
+					{
+						label: "Home",
+						href: "/",
+						target: "_self"
+					},
+					{
+						label: "About",
+						href: "/about",
+						target: "_self"
+					},
+					{
+						label: "Contact",
+						href: "/contact",
+						target: "_self"
+					}
+				]
+			})
+		},
+		{
+			name: "Brand + CTA",
+			shortcode: JSON.stringify({
+				position: "sticky",
+				alignment: "end",
+				brandText: "Site",
+				items: [{
+					label: "Home",
+					href: "/",
+					target: "_self"
+				}, {
+					label: "Services",
+					href: "/services",
+					target: "_self"
+				}],
+				ctaLabel: "Get started",
+				ctaHref: "/contact"
+			})
+		},
+		{
+			name: "Overlay glass",
+			shortcode: JSON.stringify({
+				position: "overlay",
+				alignment: "center",
+				glass: !0,
+				border: !1,
+				shadow: !1,
+				items: [
+					{
+						label: "Home",
+						href: "/",
+						target: "_self"
+					},
+					{
+						label: "Work",
+						href: "/work",
+						target: "_self"
+					},
+					{
+						label: "About",
+						href: "/about",
+						target: "_self"
+					}
+				]
+			})
+		}
+	],
+	attributes: y.strictObject({
+		id: b,
+		brandText: y.string().trim().default(X.brandText),
+		brandLogo: y.string().trim().pipe(y.union([y.literal(""), v])).default(X.brandLogo),
+		brandHref: l.default(X.brandHref),
+		items: y.array(gr).default(X.items),
+		ctaLabel: y.string().trim().default(X.ctaLabel),
+		ctaHref: y.string().trim().pipe(y.union([y.literal(""), l])).default(X.ctaHref),
+		position: y.enum(dr).default(X.position),
+		alignment: y.enum(fr).default(X.alignment),
+		mobileMenu: y.enum(pr).default(X.mobileMenu),
+		collapseAt: y.enum(mr).default(X.collapseAt),
+		glass: y.boolean().default(X.glass),
+		border: y.boolean().default(X.border),
+		shadow: y.boolean().default(X.shadow),
+		height: y.enum(hr).default(X.height)
 	}),
-	toDocumentAttributes: ({ id: e, src: t, alt: n, style: r, href: i, target: a, description: o }) => ({
-		id: e,
-		src: t,
-		alt: n,
-		style: A(r, q),
-		...L({
-			href: i,
-			target: a,
-			description: o
-		})
+	toDocumentAttributes: (e) => ({
+		id: e.id,
+		brandText: e.brandText,
+		...e.brandLogo === "" ? {} : { brandLogo: e.brandLogo },
+		brandHref: e.brandHref,
+		items: e.items,
+		...e.ctaLabel === "" || e.ctaHref === "" ? {} : {
+			ctaLabel: e.ctaLabel,
+			ctaHref: e.ctaHref
+		},
+		...e.position === X.position ? {} : { position: e.position },
+		...e.alignment === X.alignment ? {} : { alignment: e.alignment },
+		...e.mobileMenu === X.mobileMenu ? {} : { mobileMenu: e.mobileMenu },
+		...e.collapseAt === X.collapseAt ? {} : { collapseAt: e.collapseAt },
+		...e.glass ? { glass: !0 } : {},
+		...e.border === X.border ? {} : { border: e.border },
+		...e.shadow ? { shadow: !0 } : {},
+		...e.height === X.height ? {} : { height: e.height }
 	}),
 	history: {
-		summary: ({ alt: e }) => e,
+		summary: ({ brandText: e }) => e || "Navigation",
 		attributes: {
-			src: "Image address",
-			alt: "Description",
-			...I,
-			...k(q, "style.")
+			brandText: "Brand text",
+			brandLogo: "Brand logo",
+			brandHref: "Brand link",
+			items: "Items",
+			ctaLabel: "CTA label",
+			ctaHref: "CTA link",
+			position: "Position",
+			alignment: "Alignment",
+			mobileMenu: "Mobile menu",
+			collapseAt: "Collapse at",
+			glass: "Glass background",
+			border: "Border",
+			shadow: "Shadow",
+			height: "Height"
 		}
 	}
-}), q);
-// src/schema/textItems.ts
-function J(e, t) {
-	return d.array(d.strictObject({ text: d.string().trim().min(1, t) })).min(1, e);
-}
-function Y(e) {
-	return e.map(({ text: e }) => ({ text: e }));
-}
-// src/elements/list/definition.ts
-var Yt = { items: [
-	{ text: "First item" },
-	{ text: "Second item" },
-	{ text: "Third item" }
-] }, Xt = M(p({
+}), vr = {
+	items: [
+		{ text: "First item" },
+		{ text: "Second item" },
+		{ text: "Third item" }
+	],
+	ordered: !1
+}, yr = k(x({
 	type: "PList",
 	label: "List",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		items: J("Add a list item", "Enter item text").default(Yt.items)
+	attributes: y.strictObject({
+		id: b,
+		items: A("Add a list item", "Enter item text").default(vr.items),
+		ordered: y.boolean().default(vr.ordered)
 	}),
-	toDocumentAttributes: ({ id: e, items: t }) => ({
+	toDocumentAttributes: ({ id: e, items: t, ordered: n }) => ({
 		id: e,
-		items: Y(t)
+		items: j(t),
+		...n ? { ordered: !0 } : {}
 	}),
 	history: {
 		summary: ({ items: e }) => e[0]?.text ?? "",
-		attributes: { items: "Items" }
+		attributes: {
+			items: "Items",
+			ordered: "Ordered"
+		}
 	}
-})), Zt = /^\/([a-z0-9]+(-[a-z0-9]+)*)?$/, X = {
+})), br = [
+	"auto",
+	"ltr",
+	"rtl"
+], xr = [
+	"sm",
+	"base",
+	"lg"
+], Sr = [
+	"5xl",
+	"6xl",
+	"7xl",
+	"full"
+], Cr = [
+	"square",
+	"soft",
+	"rounded"
+], wr = [
+	"always",
+	"hover",
+	"never"
+], Tr = /^\/([a-z0-9]+(-[a-z0-9]+)*)?$/, Er = /^#[0-9A-Fa-f]{6}$/, Dr = /^([a-z]{2,3})(-[A-Za-z0-9]+)*$/, Or = {
 	backgroundColor: {
 		name: "white",
 		opacity: 100
@@ -1152,75 +1938,144 @@ var Yt = { items: [
 		opacity: 100
 	},
 	textSize: "sm"
-}, Z = [
-	{
+}, Z = {
+	seoTitle: "",
+	description: "",
+	lang: "",
+	dir: "auto",
+	shareImage: "",
+	hideFromSearch: !1
+}, Q = {
+	bodyFont: "",
+	headingFont: "",
+	lineHeight: "",
+	accentColor: "",
+	contentWidth: "7xl",
+	radiusStyle: "soft",
+	linkUnderline: "hover"
+}, kr = [
+	L({
 		key: "backgroundColor",
 		variable: "--palmyit-page-background-color",
-		value: C,
-		defaultValue: X.backgroundColor,
+		defaultValue: Or.backgroundColor,
 		label: "Background color"
-	},
-	{
+	}),
+	L({
 		key: "textColor",
 		variable: "--palmyit-page-text-color",
-		value: C,
-		defaultValue: X.textColor,
+		defaultValue: Or.textColor,
 		label: "Text color"
-	},
+	}),
 	{
 		key: "textSize",
 		variable: "--palmyit-page-font-size",
-		value: Fe,
-		defaultValue: X.textSize,
+		value: y.enum(xr),
+		defaultValue: Or.textSize,
 		label: "Text size"
 	}
-], Qt = Z.map(({ key: e }) => e), $t = p({
+], Ar = kr.map(({ key: e }) => e), jr = y.string().trim().refine((e) => e === "" || ie(e), "Expected a Google Fonts family name").default(""), Mr = y.string().trim().refine((e) => e === "" || Er.test(e), "Expected a #RRGGBB color").default(""), Nr = x({
 	type: "PPage",
 	label: "Page",
-	allowedChildren: ["PSection"],
+	allowedChildren: [
+		"PNav",
+		"PSection",
+		"PFooter"
+	],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		url: d.string().regex(Zt, "Expected / or a lowercase path such as /about-us"),
-		title: d.string().default(""),
-		style: O(Z)
-	}).transform(({ id: e, url: t, title: n, style: r }) => ({
+	attributes: y.strictObject({
+		id: b,
+		url: y.string().regex(Tr, "Expected / or a lowercase path such as /about-us"),
+		title: y.string().default(""),
+		seoTitle: y.string().trim().default(Z.seoTitle),
+		description: y.string().trim().max(160, "Keep the description to about 160 characters").default(Z.description),
+		lang: y.string().trim().refine((e) => e === "" || Dr.test(e), "Expected a language code such as en or ar").default(Z.lang),
+		dir: y.enum(br).default(Z.dir),
+		shareImage: y.string().trim().pipe(y.union([y.literal(""), v])).default(Z.shareImage),
+		hideFromSearch: y.boolean().default(Z.hideFromSearch),
+		bodyFont: jr,
+		headingFont: jr,
+		lineHeight: y.union([y.literal(""), y.enum(n)]).default(Q.lineHeight),
+		accentColor: Mr,
+		contentWidth: y.enum(Sr).default(Q.contentWidth),
+		radiusStyle: y.enum(Cr).default(Q.radiusStyle),
+		linkUnderline: y.enum(wr).default(Q.linkUnderline),
+		style: D(kr)
+	}).transform(({ id: e, url: t, title: n, seoTitle: r, description: i, lang: a, dir: o, shareImage: s, hideFromSearch: c, bodyFont: l, headingFont: u, lineHeight: d, accentColor: f, contentWidth: p, radiusStyle: m, linkUnderline: h, style: g }) => ({
 		pageId: e,
 		url: t,
 		title: n,
-		...r
+		seoTitle: r,
+		description: i,
+		lang: a,
+		dir: o,
+		shareImage: s,
+		hideFromSearch: c,
+		bodyFont: l,
+		headingFont: u,
+		lineHeight: d,
+		accentColor: f,
+		contentWidth: p,
+		radiusStyle: m,
+		linkUnderline: h,
+		...g
 	})),
-	toDocumentAttributes: ({ pageId: e, url: t, title: n, ...r }) => ({
+	toDocumentAttributes: ({ pageId: e, url: t, title: n, seoTitle: r, description: i, lang: a, dir: o, shareImage: s, hideFromSearch: c, bodyFont: l, headingFont: u, lineHeight: d, accentColor: f, contentWidth: p, radiusStyle: m, linkUnderline: h, ...g }) => ({
 		id: e,
 		url: t,
 		title: n,
-		style: A(r, Z)
+		...r === "" ? {} : { seoTitle: r },
+		...i === "" ? {} : { description: i },
+		...a === "" ? {} : { lang: a },
+		...o === Z.dir ? {} : { dir: o },
+		...s === "" ? {} : { shareImage: s },
+		...c ? { hideFromSearch: !0 } : {},
+		...l === "" ? {} : { bodyFont: l },
+		...u === "" ? {} : { headingFont: u },
+		...d === "" ? {} : { lineHeight: d },
+		...f === "" ? {} : { accentColor: f },
+		...p === Q.contentWidth ? {} : { contentWidth: p },
+		...m === Q.radiusStyle ? {} : { radiusStyle: m },
+		...h === Q.linkUnderline ? {} : { linkUnderline: h },
+		...E(T(g, kr))
 	}),
 	history: {
 		summary: ({ title: e, url: t }) => e || t,
 		attributes: {
 			title: "Title",
 			url: "URL",
-			...k(Z)
+			seoTitle: "Search result title",
+			description: "Search result description",
+			lang: "Language",
+			dir: "Text direction",
+			shareImage: "Social share image",
+			hideFromSearch: "Hide from search engines",
+			bodyFont: "Body font",
+			headingFont: "Heading font",
+			lineHeight: "Line height",
+			accentColor: "Accent color",
+			contentWidth: "Content width",
+			radiusStyle: "Corner style",
+			linkUnderline: "Link underline",
+			...w(kr)
 		}
 	}
-}), en = {
+}), Pr = {
 	legend: "Choose one",
 	options: [{ text: "Option 1" }, { text: "Option 2" }]
-}, tn = M(p({
+}, Fr = k(x({
 	type: "PRadio",
 	label: "Radio input",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		legend: d.string().trim().min(1, "Enter a question").default(en.legend),
-		options: J("Add an option", "Enter option text").default(en.options)
+	attributes: y.strictObject({
+		id: b,
+		legend: y.string().trim().min(1, "Enter a question").default(Pr.legend),
+		options: A("Add an option", "Enter option text").default(Pr.options)
 	}),
 	toDocumentAttributes: ({ id: e, legend: t, options: n }) => ({
 		id: e,
 		legend: t,
-		options: Y(n)
+		options: j(n)
 	}),
 	history: {
 		summary: ({ legend: e }) => e,
@@ -1229,30 +2084,30 @@ var Yt = { items: [
 			options: "Options"
 		}
 	}
-})), nn = { ...g }, rn = U({
+})), Ir = { ...M }, Lr = Kn({
 	type: "PSection",
 	label: "Section",
 	kind: "section",
-	defaultStyle: nn,
-	allowedChildren: W,
+	defaultStyle: Ir,
+	allowedChildren: Xn,
 	templates: []
-}), an = {
+}), Rr = {
 	label: "Select",
 	options: [{ text: "Option 1" }, { text: "Option 2" }]
-}, on = M(p({
+}, zr = k(x({
 	type: "PSelect",
 	label: "Select",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		label: d.string().trim().min(1, "Enter a label").default(an.label),
-		options: J("Add an option", "Enter option text").default(an.options)
+	attributes: y.strictObject({
+		id: b,
+		label: y.string().trim().min(1, "Enter a label").default(Rr.label),
+		options: A("Add an option", "Enter option text").default(Rr.options)
 	}),
 	toDocumentAttributes: ({ id: e, label: t, options: n }) => ({
 		id: e,
 		label: t,
-		options: Y(n)
+		options: j(n)
 	}),
 	history: {
 		summary: ({ label: e }) => e,
@@ -1261,7 +2116,7 @@ var Yt = { items: [
 			options: "Options"
 		}
 	}
-})), sn = {
+})), Br = {
 	headers: [
 		{ text: "Column 1" },
 		{ text: "Column 2" },
@@ -1275,20 +2130,22 @@ var Yt = { items: [
 		"Cell 4",
 		"Cell 5",
 		"Cell 6"
-	] }]
+	] }],
+	caption: ""
 };
-function cn(e, t) {
+function Vr(e, t) {
 	return t.map(({ cells: t }) => ({ cells: Array.from({ length: e }, (e, n) => t[n] ?? "") }));
 }
-var ln = d.strictObject({ cells: d.array(d.string()) }), un = M(p({
+var Hr = y.strictObject({ cells: y.array(y.string()) }), Ur = k(x({
 	type: "PTable",
 	label: "Table",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		headers: J("Add a column", "Enter a column heading").default(sn.headers),
-		rows: d.array(ln).default(sn.rows)
+	attributes: y.strictObject({
+		id: b,
+		headers: A("Add a column", "Enter a column heading").default(Br.headers),
+		rows: y.array(Hr).default(Br.rows),
+		caption: y.string().trim().default(Br.caption)
 	}).superRefine(({ headers: e, rows: t }, n) => {
 		t.forEach(({ cells: t }, r) => {
 			t.length !== e.length && n.addIssue({
@@ -1302,189 +2159,58 @@ var ln = d.strictObject({ cells: d.array(d.string()) }), un = M(p({
 			});
 		});
 	}),
-	toDocumentAttributes: ({ id: e, headers: t, rows: n }) => ({
+	toDocumentAttributes: ({ id: e, headers: t, rows: n, caption: r }) => ({
 		id: e,
-		headers: Y(t),
-		rows: n.map(({ cells: e }) => ({ cells: [...e] }))
+		headers: j(t),
+		rows: n.map(({ cells: e }) => ({ cells: [...e] })),
+		...r === "" ? {} : { caption: r }
 	}),
 	history: {
 		summary: ({ headers: e }) => e[0]?.text ?? "",
 		attributes: {
 			headers: "Column headings",
-			rows: "Rows"
+			rows: "Rows",
+			caption: "Caption"
 		}
 	}
-})), dn = /<[^>]*>/g;
-function fn(e) {
+})), Wr = /<[^>]*>/g;
+function Gr(e) {
 	let t = e.trim();
 	return t.includes("<") ? t : `<p>${t}</p>`;
 }
-function pn(e) {
-	return e.replace(dn, " ").replace(/&nbsp;/g, " ").replace(/&amp;/g, "&").replace(/\s+/g, " ").trim();
+function Kr(e) {
+	return e.replace(Wr, " ").replace(/&nbsp;/g, " ").replace(/&amp;/g, "&").replace(/\s+/g, " ").trim();
 }
 // src/elements/rich-text/definition.ts
-var mn = { text: "<p>Add your main text here. Double-click to edit and customize your content to make it selectable.</p>" }, hn = M(p({
+var qr = { text: "<p>Add your main text here. Double-click to edit and customize your content to make it selectable.</p>" }, Jr = k(x({
 	type: "PRichText",
 	label: "Rich text",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		text: d.string().transform(fn).refine((e) => pn(e).trim().length > 0, "Enter text").default(mn.text)
+	attributes: y.strictObject({
+		id: b,
+		text: y.string().transform(Gr).refine((e) => Kr(e).trim().length > 0, "Enter text").default(qr.text)
 	}),
 	toDocumentAttributes: ({ id: e, text: t }) => ({
 		id: e,
-		text: fn(t)
+		text: Gr(t)
 	}),
 	history: {
-		summary: ({ text: e }) => pn(e),
+		summary: ({ text: e }) => Kr(e),
 		attributes: { text: "Text" }
 	}
-})), gn = [
-	"normal",
-	"italic",
-	"oblique"
-], _n = [
-	"none",
-	"underline",
-	"overline",
-	"line-through"
-], vn = [
-	"left",
-	"center",
-	"right",
-	"justify"
-], yn = [
-	"none",
-	"capitalize",
-	"uppercase",
-	"lowercase"
-], bn = [
-	"100",
-	"200",
-	"300",
-	"400",
-	"500",
-	"600",
-	"700",
-	"800",
-	"900"
-], xn = {
-	text: "Text",
-	...P,
-	style: {}
-}, Sn = "--palmyit-text";
-function Cn(e) {
-	return [
-		{
-			key: "textFont",
-			variable: `${e}-font-family`,
-			value: d.string().refine(xt, "Expected a Google Fonts family name"),
-			label: "Font family"
-		},
-		{
-			key: "fontStyle",
-			variable: `${e}-font-style`,
-			value: d.enum(gn),
-			label: "Text style"
-		},
-		{
-			key: "textSize",
-			variable: `${e}-font-size`,
-			value: Fe,
-			label: "Text size"
-		},
-		{
-			key: "textColor",
-			variable: `${e}-color`,
-			value: C,
-			label: "Text color"
-		},
-		{
-			key: "lineHeight",
-			variable: `${e}-line-height`,
-			value: Ie,
-			label: "Height"
-		},
-		{
-			key: "letterSpacing",
-			variable: `${e}-letter-spacing`,
-			value: Le,
-			label: "Letter spacing"
-		},
-		{
-			key: "wordSpacing",
-			variable: `${e}-word-spacing`,
-			value: S,
-			label: "Word spacing"
-		},
-		{
-			key: "textDecoration",
-			variable: `${e}-text-decoration`,
-			value: d.enum(_n),
-			label: "Text decoration"
-		},
-		{
-			key: "textAlign",
-			variable: `${e}-text-align`,
-			value: d.enum(vn),
-			label: "Text align"
-		},
-		{
-			key: "textTransform",
-			variable: `${e}-text-transform`,
-			value: d.enum(yn),
-			label: "Text transform"
-		},
-		{
-			key: "fontWeight",
-			variable: `${e}-font-weight`,
-			value: d.enum(bn),
-			label: "Text weight"
-		}
-	];
-}
-var Q = Cn(Sn), wn = M(p({
-	type: "PText",
-	label: "Text",
-	allowedChildren: [],
-	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		text: d.string().trim().min(1, "Enter text").default(xn.text),
-		...F,
-		style: O(Q).transform((e) => e)
-	}),
-	toDocumentAttributes: ({ id: e, text: t, href: n, target: r, description: i, style: a }) => ({
-		id: e,
-		text: t,
-		...L({
-			href: n,
-			target: r,
-			description: i
-		}),
-		style: A(a, Q)
-	}),
-	history: {
-		summary: ({ text: e }) => e,
-		attributes: {
-			text: "Text",
-			...I,
-			...k(Q, "style.")
-		}
-	}
-}), Q), Tn = {
+})), Yr = {
 	label: "Text area",
 	placeholder: ""
-}, En = M(p({
+}, Xr = k(x({
 	type: "PTextArea",
 	label: "Text area",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		label: d.string().trim().min(1, "Enter a label").default(Tn.label),
-		placeholder: d.string().default(Tn.placeholder)
+	attributes: y.strictObject({
+		id: b,
+		label: y.string().trim().min(1, "Enter a label").default(Yr.label),
+		placeholder: y.string().default(Yr.placeholder)
 	}),
 	toDocumentAttributes: ({ id: e, label: t, placeholder: n }) => ({
 		id: e,
@@ -1498,18 +2224,18 @@ var Q = Cn(Sn), wn = M(p({
 			placeholder: "Placeholder"
 		}
 	}
-})), Dn = {
+})), Zr = {
 	label: "Text field",
 	placeholder: ""
-}, On = M(p({
+}, Qr = k(x({
 	type: "PTextField",
 	label: "Text field",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		label: d.string().trim().min(1, "Enter a label").default(Dn.label),
-		placeholder: d.string().default(Dn.placeholder)
+	attributes: y.strictObject({
+		id: b,
+		label: y.string().trim().min(1, "Enter a label").default(Zr.label),
+		placeholder: y.string().default(Zr.placeholder)
 	}),
 	toDocumentAttributes: ({ id: e, label: t, placeholder: n }) => ({
 		id: e,
@@ -1523,92 +2249,173 @@ var Q = Cn(Sn), wn = M(p({
 			placeholder: "Placeholder"
 		}
 	}
-})), kn = {
+})), $r = ["file", "youtube"], ei = ["none", "metadata"], ti = [
+	"video",
+	"9/16",
+	"4/3",
+	"square"
+], $ = {
+	source: "file",
 	src: "",
-	title: "Video"
-}, An = M(p({
+	youtubeUrl: "",
+	title: "Video",
+	description: "",
+	poster: "",
+	uploadDate: "",
+	captions: [],
+	autoplay: !1,
+	loop: !1,
+	muted: !1,
+	controls: !0,
+	preload: "metadata",
+	startAt: 0,
+	aspectRatio: "video",
+	caption: ""
+}, ni = y.string().trim().pipe(y.union([y.literal(""), v])).default(""), ri = y.strictObject({
+	src: v,
+	srclang: y.string().trim().min(2, "Enter a language code"),
+	label: y.string().trim().min(1, "Enter a track label")
+}), ii = k(x({
 	type: "PVideo",
 	label: "Video",
 	allowedChildren: [],
 	templates: [],
-	attributes: d.strictObject({
-		id: f,
-		src: d.union([d.literal(""), N]).default(kn.src),
-		title: d.string().trim().min(1, "Enter a video title").default(kn.title)
+	attributes: y.strictObject({
+		id: b,
+		source: y.enum($r).default($.source),
+		src: y.union([y.literal(""), v]).default($.src),
+		youtubeUrl: y.string().trim().default($.youtubeUrl),
+		title: y.string().trim().min(1, "Enter a video title").default($.title),
+		description: y.string().trim().default($.description),
+		poster: ni,
+		uploadDate: y.string().trim().default($.uploadDate),
+		captions: y.array(ri).default($.captions),
+		autoplay: y.boolean().default($.autoplay),
+		loop: y.boolean().default($.loop),
+		muted: y.boolean().default($.muted),
+		controls: y.boolean().default($.controls),
+		preload: y.enum(ei).default($.preload),
+		startAt: y.number().int().min(0).default($.startAt),
+		aspectRatio: y.enum(ti).default($.aspectRatio),
+		caption: y.string().trim().default($.caption)
+	}).superRefine((e, t) => {
+		e.source === "file" && e.src === "" || e.source !== "youtube" || ue(e.youtubeUrl) || t.addIssue({
+			code: "custom",
+			path: ["youtubeUrl"],
+			message: "Enter a YouTube watch, share, Shorts, or embed URL"
+		});
 	}),
-	toDocumentAttributes: ({ id: e, src: t, title: n }) => ({
+	toDocumentAttributes: ({ id: e, source: t, src: n, youtubeUrl: r, title: i, description: a, poster: o, uploadDate: s, captions: c, autoplay: l, loop: u, muted: d, controls: f, preload: p, startAt: m, aspectRatio: h, caption: g }) => ({
 		id: e,
-		src: t,
-		title: n
+		source: t,
+		...t === "file" ? { src: n } : { youtubeUrl: r },
+		title: i,
+		...a === "" ? {} : { description: a },
+		...o === "" ? {} : { poster: o },
+		...s === "" ? {} : { uploadDate: s },
+		...c.length === 0 ? {} : { captions: c },
+		...l ? { autoplay: !0 } : {},
+		...u ? { loop: !0 } : {},
+		...d || l ? { muted: !0 } : {},
+		...f === $.controls ? {} : { controls: f },
+		...p === $.preload ? {} : { preload: p },
+		...m === 0 ? {} : { startAt: m },
+		...h === $.aspectRatio ? {} : { aspectRatio: h },
+		...g === "" ? {} : { caption: g }
 	}),
 	history: {
 		summary: ({ title: e }) => e,
 		attributes: {
+			source: "Source",
 			src: "Video address",
-			title: "Title"
+			youtubeUrl: "YouTube URL",
+			title: "Title",
+			description: "Description",
+			poster: "Poster image",
+			uploadDate: "Upload date",
+			captions: "Captions",
+			autoplay: "Autoplay",
+			loop: "Loop",
+			muted: "Muted",
+			controls: "Controls",
+			preload: "Preload",
+			startAt: "Start at",
+			aspectRatio: "Aspect ratio",
+			caption: "Caption"
 		}
 	}
-})), $ = {
-	PPage: $t,
-	PSection: rn,
-	PContainer: Rt,
-	PButton: Ft,
-	PText: wn,
-	PRichText: hn,
-	PImage: Jt,
-	PVideo: An,
-	PList: Xt,
-	PIcon: Ht,
-	PDivider: Vt,
-	PTextField: On,
-	PTextArea: En,
-	PCheckbox: It,
-	PRadio: tn,
-	PSelect: on,
-	PTable: un
+})), ai = {
+	PPage: Nr,
+	PSection: Lr,
+	PContainer: Qn,
+	PNav: _r,
+	PFooter: sr,
+	PButton: Un,
+	PText: rn,
+	PHeading: cn,
+	PRichText: Jr,
+	PImage: On,
+	PVideo: ii,
+	PList: yr,
+	PIcon: ur,
+	PDivider: tr,
+	PTextField: Qr,
+	PTextArea: Xr,
+	PCheckbox: Gn,
+	PRadio: Fr,
+	PSelect: zr,
+	PTable: Ur,
+	PArticle: Nn
 };
-function jn(e) {
-	return typeof e == "string" && Object.hasOwn($, e);
+function oi(e) {
+	return typeof e == "string" && Object.hasOwn(ai, e);
 }
 // src/schema/elementTemplates.ts
-function Mn(e) {
+function si(e) {
 	return typeof e == "object" && !!e && !Array.isArray(e);
 }
-function Nn(e) {
+function ci(e) {
 	try {
 		let t = JSON.parse(e);
-		return Mn(t) ? t : void 0;
+		return si(t) ? t : void 0;
 	} catch {
 		return;
 	}
 }
-function Pn(e) {
-	return Array.isArray(e) ? e : [];
+function li(e) {
+	if (si(e)) return { ...e };
+	if (!Array.isArray(e)) return {};
+	let t = {};
+	for (let n of e) si(n) && typeof n.key == "string" && (t[n.key] = n.value);
+	return t;
 }
-function Fn(e, t) {
-	let n = new Map(Pn(e).map((e) => [e.key, e]));
-	for (let e of Pn(t)) n.set(e.key, {
-		...n.get(e.key),
-		...e
-	});
-	return [...n.values()];
+function ui(e, t) {
+	let n = {
+		...li(e),
+		...li(t)
+	};
+	return Object.keys(n).length > 0 ? n : void 0;
 }
-function In(e, t) {
+function di(e, t) {
 	let n = {
 		...e,
 		...t,
 		id: e.id
 	};
-	return "style" in t && (n.style = Fn(e.style, t.style)), n;
+	if ("style" in t) {
+		let r = ui(e.style, t.style);
+		r === void 0 ? delete n.style : n.style = r;
+	}
+	return n;
 }
-function Ln(e, t) {
+function fi(e, t) {
 	if (!Array.isArray(t)) return {
 		ok: !1,
 		message: "Expected a list of children"
 	};
 	let n = [];
 	for (let r of t) {
-		let t = Rn(e, r);
+		let t = pi(e, r);
 		if (!t.ok) return t;
 		n.push(t.item);
 	}
@@ -1617,21 +2424,21 @@ function Ln(e, t) {
 		content: n
 	};
 }
-function Rn(e, t) {
-	if (!Mn(t)) return {
+function pi(e, t) {
+	if (!si(t)) return {
 		ok: !1,
 		message: "Expected an element object"
 	};
 	let n = t.type;
-	if (!jn(n)) return {
+	if (!oi(n)) return {
 		ok: !1,
 		message: `Unknown element type "${String(n)}"`
 	};
-	if (!$[e].allowedChildren.includes(n)) return {
+	if (!ai[e].allowedChildren.includes(n)) return {
 		ok: !1,
 		message: `${n} is not allowed inside ${e}`
 	};
-	let { children: r, type: i, ...a } = t, o = $[n];
+	let { children: r, type: i, ...a } = t, o = ai[n];
 	if (r !== void 0 && o.allowedChildren.length === 0) return {
 		ok: !1,
 		message: `${n} cannot have children`
@@ -1652,7 +2459,7 @@ function Rn(e, t) {
 	let l = r === void 0 ? {
 		ok: !0,
 		content: []
-	} : Ln(n, r);
+	} : fi(n, r);
 	return l.ok ? {
 		ok: !0,
 		item: {
@@ -1664,19 +2471,19 @@ function Rn(e, t) {
 		}
 	} : l;
 }
-function zn(e, t, n) {
+function mi(e, t, n) {
 	let r = (e) => ({
 		ok: !1,
 		message: `Template "${n.name}": ${e}`
-	}), i = Nn(n.shortcode);
+	}), i = ci(n.shortcode);
 	if (!i) return r("Expected a JSON object");
-	let { children: a, type: o, ...s } = i, c = e.toDocumentAttributes(t), l = e.attributes.safeParse(In(c, s));
+	let { children: a, type: o, ...s } = i, c = e.toDocumentAttributes(t), l = e.attributes.safeParse(di(c, s));
 	if (!l.success) return r(l.error.issues[0]?.message ?? "Invalid template");
 	if (a === void 0) return {
 		ok: !0,
 		props: l.data
 	};
-	let u = Ln(e.type, a);
+	let u = fi(e.type, a);
 	return u.ok ? {
 		ok: !0,
 		props: l.data,
@@ -1684,28 +2491,28 @@ function zn(e, t, n) {
 	} : r(u.message);
 }
 // src/schema/Fields/ColorField/color-value.ts
-var Bn = /^#[0-9A-Fa-f]{6}$/, Vn = /^#[0-9A-Fa-f]{8}$/;
-function Hn(e) {
+var hi = /^#[0-9A-Fa-f]{6}$/, gi = /^#[0-9A-Fa-f]{8}$/;
+function _i(e) {
 	return Math.min(100, Math.max(0, Math.round(e)));
 }
-function Un(e) {
+function vi(e) {
 	let t = e.hex.toUpperCase();
-	if (!Bn.test(t)) return "#000000FF";
-	let n = Hn(e.opacity);
+	if (!hi.test(t)) return "#000000FF";
+	let n = _i(e.opacity);
 	return `${t}${Math.round(n / 100 * 255).toString(16).padStart(2, "0").toUpperCase()}`;
 }
-function Wn(e) {
+function yi(e) {
 	let t = e.trim().toUpperCase();
-	return Bn.test(t) ? {
+	return hi.test(t) ? {
 		hex: t,
 		opacity: 100
-	} : Vn.test(t) ? {
+	} : gi.test(t) ? {
 		hex: t.slice(0, 7),
-		opacity: Hn(Number.parseInt(t.slice(7, 9), 16) / 255 * 100)
+		opacity: _i(Number.parseInt(t.slice(7, 9), 16) / 255 * 100)
 	} : null;
 }
 // src/schema/device/deviceStyle.ts
-var Gn = {
+var bi = {
 	Desktop: {
 		portrait: "style",
 		landscape: "style"
@@ -1719,25 +2526,25 @@ var Gn = {
 		landscape: "mobileLandscapeStyle"
 	}
 };
-function Kn(e, t = "portrait") {
-	return Gn[e][t];
+function xi(e, t = "portrait") {
+	return bi[e][t];
 }
-function qn(e, t, n = "portrait") {
-	let r = Kn(t, n);
+function Si(e, t, n = "portrait") {
+	let r = xi(t, n);
 	return r === "style" ? {} : e[r] ?? {};
 }
-function Jn(e, t) {
+function Ci(e, t) {
 	return JSON.stringify(e) === JSON.stringify(t);
 }
-function Yn(e, t) {
-	return Object.fromEntries(Object.entries(t).filter(([t, n]) => n !== void 0 && !Jn(n, e[t])));
+function wi(e, t) {
+	return Object.fromEntries(Object.entries(t).filter(([t, n]) => n !== void 0 && !Ci(n, e[t])));
 }
-function Xn(e, t, n = "portrait") {
-	let r = n === "landscape" ? qn(e, t, "landscape") : {};
+function Ti(e, t, n = "portrait") {
+	let r = n === "landscape" ? Si(e, t, "landscape") : {};
 	return {
 		...e.style,
-		...qn(e, t, "portrait"),
+		...Si(e, t, "portrait"),
 		...r
 	};
 }
-export { h as BORDER_LINE_STYLES, u as COLOR_NAMES, qe as DEVICE_CHOICES, ye as FLEX_ALIGN_CONTENTS, ve as FLEX_ALIGN_ITEMS, he as FLEX_DIRECTIONS, _e as FLEX_JUSTIFY_CONTENTS, ge as FLEX_WRAPS, gn as FONT_STYLES, bn as FONT_WEIGHTS, Gt as IMAGE_LENGTH_KEYS, K as IMAGE_PREFIX, Ge as LANDSCAPE_VISIBILITY_PROP_BY_DEVICE, _ as LENGTH_PATTERN, At as NO_ICON, n as OPACITY_STEPS, ie as SPACING_TOKENS, vn as TEXT_ALIGNS, _n as TEXT_DECORATIONS, Sn as TEXT_PREFIX, r as TEXT_SIZE_TOKENS, yn as TEXT_TRANSFORMS, Ke as VISIBILITY_PROPS, E as VISIBILITY_PROP_BY_DEVICE, N as addressSchema, zn as applyElementTemplate, w as backgroundStyleDefinitions, me as backgroundStyleToCssVariables, T as builderDevices, He as builderViewports, Yn as changedStyle, C as colorValue, ue as colorValueToCss, Mt as defaultButtonProps, H as defaultCheckboxProps, Lt as defaultContainerStyle, Bt as defaultDividerProps, g as defaultElementStyle, G as defaultIconProps, Kt as defaultImageProps, P as defaultLinkSettings, Yt as defaultListProps, X as defaultPageStyle, en as defaultRadioProps, mn as defaultRichTextProps, nn as defaultSectionStyle, an as defaultSelectProps, sn as defaultTableProps, Tn as defaultTextAreaProps, Dn as defaultTextFieldProps, xn as defaultTextProps, kn as defaultVideoProps, p as defineElement, U as defineLayoutElement, Ue as deviceForWidth, qn as deviceOverride, Kn as deviceStyleProp, f as elementIdSchema, $ as elementRegistry, Dt as elementStyleDefinitions, Ot as elementStyleSchema, De as elementStyleToCssVariables, cn as fitRowsToHeaders, Wn as fromHexAlpha, se as gradientToCss, jn as isElementType, xt as isFontFamily, z as isOutlineIconName, ee as isPaletteColor, m as isSafeGradientArgs, D as isShownOn, jt as labelForIcon, W as layoutChildren, R as lengthKeys, S as lengthValue, I as linkHistoryLabels, F as linkSettingsShape, fn as normalizeRichText, We as orientationForWidth, Ft as pButtonDefinition, It as pCheckboxDefinition, Rt as pContainerDefinition, Vt as pDividerDefinition, Ht as pIconDefinition, Jt as pImageDefinition, Xt as pListDefinition, $t as pPageDefinition, tn as pRadioDefinition, hn as pRichTextDefinition, rn as pSectionDefinition, on as pSelectDefinition, un as pTableDefinition, En as pTextAreaDefinition, wn as pTextDefinition, On as pTextFieldDefinition, An as pVideoDefinition, Qt as pageStyleKeys, re as pageTokensToVarValues, Xn as resolveDeviceStyle, pn as richTextToPlainText, y as sanitizeAutoAsZero, Se as sanitizeBorderWidth, v as sanitizeLength, xe as sanitizeMaxLength, Ye as shownDeviceCount, O as styleItemsSchema, k as styleLabels, tt as styleOverrideItemsSchema, te as styleToClasses, J as textItemsSchema, de as textSizeToCss, Cn as textStyleDefinitions, Un as toHexAlpha, L as toLinkAttributes, o as toPaletteColor, a as toSpacingToken, A as toStyleItems, it as toStyleOverrideItems, Y as toTextItems, e as toTextSizeToken, s as unresolvedStyleForVars, Je as visibilityProp, M as withDeviceSettings };
+export { An as ARTICLE_EXCERPT_LINES, kn as ARTICLE_LAYOUTS, vt as BORDER_LINE_STYLES, ee as COLOR_NAMES, Sr as CONTENT_WIDTHS, ve as DEVICE_CHOICES, Ct as FLEX_ALIGN_CONTENTS, St as FLEX_ALIGN_ITEMS, yt as FLEX_DIRECTIONS, xt as FLEX_JUSTIFY_CONTENTS, bt as FLEX_WRAPS, Yt as FONT_STYLES, $t as FONT_WEIGHTS, an as HEADING_LEVELS, sn as HEADING_PREFIX, Pn as HEROICON_NAMES, bn as IMAGE_ASPECT_RATIOS, wn as IMAGE_CAPTION_ALIGNS, yn as IMAGE_LENGTH_KEYS, xn as IMAGE_OBJECT_FITS, Sn as IMAGE_OBJECT_POSITIONS, W as IMAGE_PREFIX, Cn as IMAGE_SHADOWS, ge as LANDSCAPE_VISIBILITY_PROP_BY_DEVICE, wt as LENGTH_PATTERN, a as LINK_RELS, wr as LINK_UNDERLINES, fr as NAV_ALIGNMENTS, mr as NAV_COLLAPSE_AT, hr as NAV_HEIGHTS, pr as NAV_MOBILE_MENUS, dr as NAV_POSITIONS, Fn as NO_ICON, fe as OPACITY_STEPS, br as PAGE_DIRS, xr as PAGE_TEXT_SIZES, Cr as RADIUS_STYLES, i as SPACING_TOKENS, Zt as TEXT_ALIGNS, Xt as TEXT_DECORATIONS, tn as TEXT_PREFIX, r as TEXT_SIZE_TOKENS, Qt as TEXT_TRANSFORMS, ti as VIDEO_ASPECT_RATIOS, ei as VIDEO_PRELOADS, $r as VIDEO_SOURCES, _e as VISIBILITY_PROPS, S as VISIBILITY_PROP_BY_DEVICE, v as addressSchema, mi as applyElementTemplate, V as backgroundStyleDefinitions, _t as backgroundStyleToCssVariables, s as builderDevices, ne as builderViewports, wi as changedStyle, qt as colorValue, pt as colorValueToCss, K as defaultArticleProps, zn as defaultButtonProps, Wn as defaultCheckboxProps, Zn as defaultContainerStyle, er as defaultDividerProps, M as defaultElementStyle, J as defaultFooterProps, nr as defaultFooterStyle, z as defaultHeadingProps, Y as defaultIconProps, U as defaultImageProps, d as defaultLinkSettings, vr as defaultListProps, X as defaultNavProps, Z as defaultPageSeo, Or as defaultPageStyle, Q as defaultPageTheme, Pr as defaultRadioProps, qr as defaultRichTextProps, Ir as defaultSectionStyle, Rr as defaultSelectProps, Br as defaultTableProps, Yr as defaultTextAreaProps, Zr as defaultTextFieldProps, en as defaultTextProps, $ as defaultVideoProps, x as defineElement, Kn as defineLayoutElement, re as deviceForWidth, o as deviceMediaQueries, Si as deviceOverride, xi as deviceStyleProp, E as documentStyleAttribute, Le as documentStyleOverrideSchema, D as documentStyleSchema, Jn as elementCategories, b as elementIdSchema, ai as elementRegistry, hn as elementStyleDefinitions, gn as elementStyleSchema, Nt as elementStyleToCssVariables, Vr as fitRowsToHeaders, yi as fromHexAlpha, ut as gradientToCss, qn as hiddenFromDrawer, lr as iconShapes, cr as iconSizes, oi as isElementType, ie as isFontFamily, Ln as isHeroiconName, se as isPaletteColor, lt as isSafeGradientArgs, C as isShownOn, Rn as labelForIcon, Xn as layoutChildren, H as lengthKeys, I as lengthValue, l as linkAddressSchema, g as linkHistoryLabels, he as linkRelAttribute, t as linkSettingsShape, Gr as normalizeRichText, u as orientationForWidth, Nn as pArticleDefinition, Un as pButtonDefinition, Gn as pCheckboxDefinition, Qn as pContainerDefinition, tr as pDividerDefinition, sr as pFooterDefinition, cn as pHeadingDefinition, ur as pIconDefinition, On as pImageDefinition, yr as pListDefinition, _r as pNavDefinition, Nr as pPageDefinition, Fr as pRadioDefinition, Jr as pRichTextDefinition, Lr as pSectionDefinition, zr as pSelectDefinition, Ur as pTableDefinition, Xr as pTextAreaDefinition, rn as pTextDefinition, Qr as pTextFieldDefinition, ii as pVideoDefinition, Ar as pageStyleKeys, ae as pageTokensToVarValues, ue as parseYoutubeId, Ti as resolveDeviceStyle, Kr as richTextToPlainText, P as sanitizeAutoAsZero, Dt as sanitizeBorderWidth, N as sanitizeLength, Et as sanitizeMaxLength, be as shownDeviceCount, Ee as styleItemsSchema, w as styleLabels, De as styleOverrideItemsSchema, de as styleToClasses, A as textItemsSchema, mt as textSizeToCss, nn as textStyleDefinitions, T as toDocumentStyle, Fe as toDocumentStyleOverride, vi as toHexAlpha, _ as toLinkAttributes, f as toPaletteColor, p as toSpacingToken, Ae as toStyleItems, je as toStyleOverrideItems, j as toTextItems, h as toTextSizeToken, me as unresolvedStyleForVars, ye as visibilityProp, k as withDeviceSettings, ce as youtubeEmbedUrl, le as youtubeThumbnailUrl };