UNPKG

flex-render-react

Version:

React components for rendering LINE Flex Message

831 lines (828 loc) 32.2 kB
var Qe = Object.defineProperty; var De = (e, a, t) => a in e ? Qe(e, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[a] = t; var O = (e, a, t) => De(e, typeof a != "symbol" ? a + "" : a, t); import et from "react"; var H = { exports: {} }, X = {}; /** * @license React * react-jsx-runtime.production.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var _e; function tt() { if (_e) return X; _e = 1; var e = Symbol.for("react.transitional.element"), a = Symbol.for("react.fragment"); function t(n, l, o) { var d = null; if (o !== void 0 && (d = "" + o), l.key !== void 0 && (d = "" + l.key), "key" in l) { o = {}; for (var c in l) c !== "key" && (o[c] = l[c]); } else o = l; return l = o.ref, { $$typeof: e, type: n, key: d, ref: l !== void 0 ? l : null, props: o }; } return X.Fragment = a, X.jsx = t, X.jsxs = t, X; } var L = {}; /** * @license React * react-jsx-runtime.development.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var je; function rt() { return je || (je = 1, process.env.NODE_ENV !== "production" && function() { function e(r) { if (r == null) return null; if (typeof r == "function") return r.$$typeof === Ie ? null : r.displayName || r.name || null; if (typeof r == "string") return r; switch (r) { case Q: return "Fragment"; case Je: return "Portal"; case he: return "Profiler"; case me: return "StrictMode"; case ee: return "Suspense"; case te: return "SuspenseList"; } if (typeof r == "object") switch (typeof r.tag == "number" && console.error( "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue." ), r.$$typeof) { case ge: return (r.displayName || "Context") + ".Provider"; case pe: return (r._context.displayName || "Context") + ".Consumer"; case D: var s = r.render; return r = r.displayName, r || (r = s.displayName || s.name || "", r = r !== "" ? "ForwardRef(" + r + ")" : "ForwardRef"), r; case re: return s = r.displayName || null, s !== null ? s : e(r.type) || "Memo"; case ae: s = r._payload, r = r._init; try { return e(r(s)); } catch { } } return null; } function a(r) { return "" + r; } function t(r) { try { a(r); var s = !1; } catch { s = !0; } if (s) { s = console; var i = s.error, f = typeof Symbol == "function" && Symbol.toStringTag && r[Symbol.toStringTag] || r.constructor.name || "Object"; return i.call( s, "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", f ), a(r); } } function n() { } function l() { if (B === 0) { be = console.log, Ce = console.info, Ee = console.warn, ye = console.error, Ne = console.group, we = console.groupCollapsed, Se = console.groupEnd; var r = { configurable: !0, enumerable: !0, value: n, writable: !0 }; Object.defineProperties(console, { info: r, log: r, warn: r, error: r, group: r, groupCollapsed: r, groupEnd: r }); } B++; } function o() { if (B--, B === 0) { var r = { configurable: !0, enumerable: !0, writable: !0 }; Object.defineProperties(console, { log: _({}, r, { value: be }), info: _({}, r, { value: Ce }), warn: _({}, r, { value: Ee }), error: _({}, r, { value: ye }), group: _({}, r, { value: Ne }), groupCollapsed: _({}, r, { value: we }), groupEnd: _({}, r, { value: Se }) }); } 0 > B && console.error( "disabledDepth fell below zero. This is a bug in React. Please file an issue." ); } function d(r) { if (le === void 0) try { throw Error(); } catch (i) { var s = i.stack.trim().match(/\n( *(at )?)/); le = s && s[1] || "", Te = -1 < i.stack.indexOf(` at`) ? " (<anonymous>)" : -1 < i.stack.indexOf("@") ? "@unknown:0:0" : ""; } return ` ` + le + r + Te; } function c(r, s) { if (!r || oe) return ""; var i = se.get(r); if (i !== void 0) return i; oe = !0, i = Error.prepareStackTrace, Error.prepareStackTrace = void 0; var f = null; f = R.H, R.H = null, l(); try { var p = { DetermineComponentFrameRoot: function() { try { if (s) { var k = function() { throw Error(); }; if (Object.defineProperty(k.prototype, "props", { set: function() { throw Error(); } }), typeof Reflect == "object" && Reflect.construct) { try { Reflect.construct(k, []); } catch (T) { var F = T; } Reflect.construct(r, [], k); } else { try { k.call(); } catch (T) { F = T; } r.call(k.prototype); } } else { try { throw Error(); } catch (T) { F = T; } (k = r()) && typeof k.catch == "function" && k.catch(function() { }); } } catch (T) { if (T && F && typeof T.stack == "string") return [T.stack, F.stack]; } return [null, null]; } }; p.DetermineComponentFrameRoot.displayName = "DetermineComponentFrameRoot"; var h = Object.getOwnPropertyDescriptor( p.DetermineComponentFrameRoot, "name" ); h && h.configurable && Object.defineProperty( p.DetermineComponentFrameRoot, "name", { value: "DetermineComponentFrameRoot" } ); var u = p.DetermineComponentFrameRoot(), S = u[0], M = u[1]; if (S && M) { var g = S.split(` `), j = M.split(` `); for (u = h = 0; h < g.length && !g[h].includes( "DetermineComponentFrameRoot" ); ) h++; for (; u < j.length && !j[u].includes( "DetermineComponentFrameRoot" ); ) u++; if (h === g.length || u === j.length) for (h = g.length - 1, u = j.length - 1; 1 <= h && 0 <= u && g[h] !== j[u]; ) u--; for (; 1 <= h && 0 <= u; h--, u--) if (g[h] !== j[u]) { if (h !== 1 || u !== 1) do if (h--, u--, 0 > u || g[h] !== j[u]) { var W = ` ` + g[h].replace( " at new ", " at " ); return r.displayName && W.includes("<anonymous>") && (W = W.replace("<anonymous>", r.displayName)), typeof r == "function" && se.set(r, W), W; } while (1 <= h && 0 <= u); break; } } } finally { oe = !1, R.H = f, o(), Error.prepareStackTrace = i; } return g = (g = r ? r.displayName || r.name : "") ? d(g) : "", typeof r == "function" && se.set(r, g), g; } function v(r) { if (r == null) return ""; if (typeof r == "function") { var s = r.prototype; return c( r, !(!s || !s.isReactComponent) ); } if (typeof r == "string") return d(r); switch (r) { case ee: return d("Suspense"); case te: return d("SuspenseList"); } if (typeof r == "object") switch (r.$$typeof) { case D: return r = c(r.render, !1), r; case re: return v(r.type); case ae: s = r._payload, r = r._init; try { return v(r(s)); } catch { } } return ""; } function C() { var r = R.A; return r === null ? null : r.getOwner(); } function V(r) { if (xe.call(r, "key")) { var s = Object.getOwnPropertyDescriptor(r, "key").get; if (s && s.isReactWarning) return !1; } return r.key !== void 0; } function I(r, s) { function i() { ke || (ke = !0, console.error( "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)", s )); } i.isReactWarning = !0, Object.defineProperty(r, "key", { get: i, configurable: !0 }); } function He() { var r = e(this.type); return $e[r] || ($e[r] = !0, console.error( "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release." )), r = this.props.ref, r !== void 0 ? r : null; } function Ue(r, s, i, f, p, h) { return i = h.ref, r = { $$typeof: K, type: r, key: s, props: h, _owner: p }, (i !== void 0 ? i : null) !== null ? Object.defineProperty(r, "ref", { enumerable: !1, get: He }) : Object.defineProperty(r, "ref", { enumerable: !1, value: null }), r._store = {}, Object.defineProperty(r._store, "validated", { configurable: !1, enumerable: !1, writable: !0, value: 0 }), Object.defineProperty(r, "_debugInfo", { configurable: !1, enumerable: !1, writable: !0, value: null }), Object.freeze && (Object.freeze(r.props), Object.freeze(r)), r; } function ue(r, s, i, f, p, h) { if (typeof r == "string" || typeof r == "function" || r === Q || r === he || r === me || r === ee || r === te || r === Ve || typeof r == "object" && r !== null && (r.$$typeof === ae || r.$$typeof === re || r.$$typeof === ge || r.$$typeof === pe || r.$$typeof === D || r.$$typeof === Ze || r.getModuleId !== void 0)) { var u = s.children; if (u !== void 0) if (f) if (ne(u)) { for (f = 0; f < u.length; f++) ce(u[f], r); Object.freeze && Object.freeze(u); } else console.error( "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead." ); else ce(u, r); } else u = "", (r === void 0 || typeof r == "object" && r !== null && Object.keys(r).length === 0) && (u += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."), r === null ? f = "null" : ne(r) ? f = "array" : r !== void 0 && r.$$typeof === K ? (f = "<" + (e(r.type) || "Unknown") + " />", u = " Did you accidentally export a JSX literal instead of a component?") : f = typeof r, console.error( "React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", f, u ); if (xe.call(s, "key")) { u = e(r); var S = Object.keys(s).filter(function(g) { return g !== "key"; }); f = 0 < S.length ? "{key: someKey, " + S.join(": ..., ") + ": ...}" : "{key: someKey}", Ae[u + f] || (S = 0 < S.length ? "{" + S.join(": ..., ") + ": ...}" : "{}", console.error( `A props object containing a "key" prop is being spread into JSX: let props = %s; <%s {...props} /> React keys must be passed directly to JSX without using spread: let props = %s; <%s key={someKey} {...props} />`, f, u, S, u ), Ae[u + f] = !0); } if (u = null, i !== void 0 && (t(i), u = "" + i), V(s) && (t(s.key), u = "" + s.key), "key" in s) { i = {}; for (var M in s) M !== "key" && (i[M] = s[M]); } else i = s; return u && I( i, typeof r == "function" ? r.displayName || r.name || "Unknown" : r ), Ue(r, u, h, p, C(), i); } function ce(r, s) { if (typeof r == "object" && r && r.$$typeof !== Ke) { if (ne(r)) for (var i = 0; i < r.length; i++) { var f = r[i]; Z(f) && fe(f, s); } else if (Z(r)) r._store && (r._store.validated = 1); else if (r === null || typeof r != "object" ? i = null : (i = ve && r[ve] || r["@@iterator"], i = typeof i == "function" ? i : null), typeof i == "function" && i !== r.entries && (i = i.call(r), i !== r)) for (; !(r = i.next()).done; ) Z(r.value) && fe(r.value, s); } } function Z(r) { return typeof r == "object" && r !== null && r.$$typeof === K; } function fe(r, s) { if (r._store && !r._store.validated && r.key == null && (r._store.validated = 1, s = Ge(s), !Re[s])) { Re[s] = !0; var i = ""; r && r._owner != null && r._owner !== C() && (i = null, typeof r._owner.tag == "number" ? i = e(r._owner.type) : typeof r._owner.name == "string" && (i = r._owner.name), i = " It was passed a child from " + i + "."); var f = R.getCurrentStack; R.getCurrentStack = function() { var p = v(r.type); return f && (p += f() || ""), p; }, console.error( 'Each child in a list should have a unique "key" prop.%s%s See https://react.dev/link/warning-keys for more information.', s, i ), R.getCurrentStack = f; } } function Ge(r) { var s = "", i = C(); return i && (i = e(i.type)) && (s = ` Check the render method of \`` + i + "`."), s || (r = e(r)) && (s = ` Check the top-level render call using <` + r + ">."), s; } var qe = et, K = Symbol.for("react.transitional.element"), Je = Symbol.for("react.portal"), Q = Symbol.for("react.fragment"), me = Symbol.for("react.strict_mode"), he = Symbol.for("react.profiler"), pe = Symbol.for("react.consumer"), ge = Symbol.for("react.context"), D = Symbol.for("react.forward_ref"), ee = Symbol.for("react.suspense"), te = Symbol.for("react.suspense_list"), re = Symbol.for("react.memo"), ae = Symbol.for("react.lazy"), Ve = Symbol.for("react.offscreen"), ve = Symbol.iterator, Ie = Symbol.for("react.client.reference"), R = qe.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, xe = Object.prototype.hasOwnProperty, _ = Object.assign, Ze = Symbol.for("react.client.reference"), ne = Array.isArray, B = 0, be, Ce, Ee, ye, Ne, we, Se; n.__reactDisabledLog = !0; var le, Te, oe = !1, se = new (typeof WeakMap == "function" ? WeakMap : Map)(), Ke = Symbol.for("react.client.reference"), ke, $e = {}, Ae = {}, Re = {}; L.Fragment = Q, L.jsx = function(r, s, i, f, p) { return ue(r, s, i, !1, f, p); }, L.jsxs = function(r, s, i, f, p) { return ue(r, s, i, !0, f, p); }; }()), L; } var Oe; function at() { return Oe || (Oe = 1, process.env.NODE_ENV === "production" ? H.exports = tt() : H.exports = rt()), H.exports; } var nt = at(), lt = { giga: "LyGi", mega: "LyMe", kilo: "LyKi", hecto: "LyHe", deca: "LyDe", micro: "LyMi", nano: "LyNa" }, ot = { ltr: "fxLTR", rtl: "fxRTL" }, Me = { header: "t1Header", hero: "t1Hero", body: "t1Body", footer: "t1Footer" }, w = { box: "MdBx", text: "MdTxt", icon: "MdIco", button: "MdBtn", separator: "MdSep", image: "MdImg", filler: "mdBxFiller", span: "MdSpn", video: "MdVid", spacer: "mdBxSpacer" }, st = { vertical: "vr", horizontal: "hr", baseline: "hr bl" }, it = { relative: "", absolute: "ExAbs" }, dt = { none: "", xs: "spcXs", sm: "spcSm", md: "spcMd", lg: "spcLg", xl: "spcXl", xxl: "spcXXl" }, ut = { link: "ExBtnL", primary: "ExBtn1", secondary: "ExBtn2" }, ct = { cover: "ExCover", fit: "ExFit" }, ft = { xxs: "ExXXs", xs: "ExXs", sm: "ExSm", md: "ExMd", lg: "ExLg", xl: "ExXl", xxl: "ExXXl", "3xl": "Ex3Xl", "4xl": "Ex4Xl", "5xl": "Ex5Xl", full: "ExFull" }, mt = { start: "ExAlgS", end: "ExAlgE", center: "ExAlgC" }, ht = { top: "", bottom: "grvB", center: "grvC" }, pt = { center: "itms-jfcC", "flex-start": "itms-jfcS", "flex-end": "itms-jfcE", "space-between": "itms-jfcSB", "space-around": "itms-jfcSA", "space-evenly": "itms-jfcSE" }, gt = { center: "itms-algC", "flex-start": "itms-algS", "flex-end": "itms-algE" }, E = { none: "None", xxs: "XXs", xs: "Xs", sm: "Sm", md: "Md", lg: "Lg", xl: "Xl", xxl: "XXl", "3xl": "3Xl", "4xl": "4Xl", "5xl": "5Xl", full: "Full" }, vt = { 0: "fl0", 1: "fl1", 2: "fl2", 3: "fl3" }, xt = { regular: "ExWR", bold: "ExWB" }, bt = { none: "", light: "ExBdrWdtLgh", normal: "ExBdrWdtNml", medium: "ExBdrWdtMdm", "semi-bold": "ExBdrWdtSbd", bold: "ExBdrWdtBld" }, Ct = { normal: "ExFntStyNml", italic: "ExFntStyIt" }, Et = { none: "ExTxtDecNone", underline: "ExTxtDecUl", "line-through": "ExTxtDecLt" }, N = ["none", "xxs", "xs", "sm", "md", "lg", "xl", "xxl", "3xl", "4xl", "5xl", "full"], x = /^(-?[\d.]+)px$/, b = /^(-?[\d.]+)%$/, Pe = (e, a) => { if (!a || a === "none") return e; let t = dt[a] || void 0; return t && e.addClassNames(t), e; }, P = (e, a, t) => { if (!a) return e; let n = Pt(t) ? "L" : "T", l = E[a] || void 0; if (l) e.addClassNames(`ExMgn${n}${l}`); else { let o = a.match(x), d = a.match(b); (o || d) && (n === "T" ? e.setStyle("marginTop", a) : n === "L" && e.setStyle("marginLeft", a)); } return e; }, yt = (e, a) => { if (!a) return e; let t = ct[a] || void 0; return t && e.addClassNames(t), e; }, y = (e, a, t = "height") => { if (!a) return e; let n = ft[a] || void 0; if (n) e.addClassNames(n); else { let l = a.match(x), o = a.match(b); (l || o) && e.setStyle(t, a); } return e; }, Be = (e, a) => { if (!a) return e; let t = xt[a] || void 0; return t && e.addClassNames(t), e; }, Nt = (e, a) => { let t = 100, n = a == null ? void 0 : a.match(/^([\d.]+):([\d.]+)$/); return n && (t = Number(n[2]) / Number(n[1]) * 100), e.setStyle("paddingBottom", `${t}%`), e; }, We = (e, a) => { if (!a) return e; let t = mt[a] || void 0; return t && e.addClassNames(t), e; }, de = (e, a) => { if (!a) return e; let t = ht[a] || void 0; return t && e.addClassNames(t), e; }, Y = (e, a) => { if (!a) return e; let t = it[a] || void 0; return t && e.addClassNames(t), e; }, wt = (e, a) => { if (!a) return e; let t = gt[a] || void 0; return t && e.addClassNames(t), e; }, St = (e, a) => { if (!a) return e; let t = pt[a] || void 0; return t && e.addClassNames(t), e; }, z = (e, { offsetBottom: a, offsetEnd: t, offsetStart: n, offsetTop: l }) => { if (!a && !t && !n && !l) return e; if (a) if (N.includes(a)) e.addClassNames(`ExB${E[a]}`); else { let o = a.match(x), d = a.match(b); (o || d) && e.setStyle("bottom", a); } if (l) if (N.includes(l)) e.addClassNames(`ExT${E[l]}`); else { let o = l.match(x), d = l.match(b); (o || d) && e.setStyle("top", l); } if (t) if (N.includes(t)) e.addClassNames(`ExR${E[t]}`); else { let o = t.match(x), d = t.match(b); (o || d) && e.setStyle("right", t); } if (n) if (N.includes(n)) e.addClassNames(`ExL${E[n]}`); else { let o = n.match(x), d = n.match(b); (o || d) && e.setStyle("left", n); } return e; }, Tt = (e, { paddingAll: a, paddingBottom: t, paddingEnd: n, paddingStart: l, paddingTop: o }) => { if (!a && !t && !n && !l && !o) return e; if (a) if (N.includes(a)) e.addClassNames(`ExPadA${E[a]}`); else { let d = a.match(x), c = a.match(b); (d || c) && e.setStyle("padding", a); } if (t) if (N.includes(t)) e.addClassNames(`ExPadB${E[t]}`); else { let d = t.match(x), c = t.match(b); (d || c) && e.setStyle("paddingBottom", t); } if (n) if (N.includes(n)) e.addClassNames(`ExPadR${E[n]}`); else { let d = n.match(x), c = n.match(b); (d || c) && e.setStyle("paddingRight", n); } if (l) if (N.includes(l)) e.addClassNames(`ExPadL${E[l]}`); else { let d = l.match(x), c = l.match(b); (d || c) && e.setStyle("paddingLeft", l); } if (o) if (N.includes(o)) e.addClassNames(`ExPadT${E[o]}`); else { let d = o.match(x), c = o.match(b); (d || c) && e.setStyle("paddingTop", o); } return e; }, $ = (e, a) => { if (a == null) return e; let t = a.toString(), n = vt[t] || void 0; return n ? e.addClassNames(n) : (e.setStyle("WebkitFlex", t), e.setStyle("flexGrow", t)), e; }, kt = (e, a) => { if (!a) return e; let t = ut[a] || void 0; return t && e.addClassNames(t), e; }, G = /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/, A = (e, a, t = "color") => (a && a.match(G) && e.setStyle(t, a), e), $t = (e, a) => { if (!a) return e; if (a.type === "linearGradient") { let { angle: t, startColor: n, endColor: l, centerColor: o, centerPosition: d } = a, c = t == null ? void 0 : t.match(/^(\d+)deg$/), v = n == null ? void 0 : n.match(G), C = l == null ? void 0 : l.match(G), V = o == null ? void 0 : o.match(G), I = d == null ? void 0 : d.match(/^([\d.]+)%$/); !o || !d ? c && v && C && e.setStyle("background", `linear-gradient(${t}, ${n} 0%, ${l} 100%)`) : c && v && V && I && C && e.setStyle("background", `linear-gradient(${t}, ${n} 0%, ${o} ${d}, ${l} 100%)`); } return e; }, At = (e, a) => (a && e.addClassNames("ExWrap"), e), Rt = (e, a) => { if (!a) return e; let t = bt[a] || void 0; if (t) e.addClassNames(t); else { let n = a.match(x), l = a.match(b); (n || l) && e.setStyle("borderWidth", a); } return e; }, _t = (e, a) => { if (!a) return e; let t = E[a] || void 0; if (t) e.addClassNames(`ExBdrRad${t}`); else { let n = a.match(x), l = a.match(b); (n || l) && e.setStyle("borderRadius", a); } return e; }, jt = (e, a) => { let t = 1, n = a == null ? void 0 : a.match(/^([\d.]+):([\d.]+)$/); return n && (t = Number(n[1]) / Number(n[2])), e.setStyle("width", `${t}em`), e; }, Xe = (e, a) => { if (!a) return e; let t = Ct[a] || void 0; return t && e.addClassNames(t), e; }, Le = (e, a) => { if (!a) return e; let t = Et[a] || void 0; return t && e.addClassNames(t), e; }, U = (e, a, t, n) => { if (a) { let { separator: l, separatorColor: o, backgroundColor: d } = a; if (e = A(e, d, "backgroundColor"), t !== "header" && l) { let c = Fe({ type: "separator", color: o }); n == null || n.appendChild(c); } } return [e, n]; }, q = (e, a) => { if (!a) return e; switch (a.type) { case "uri": e.setAttribute("target", "_blank"), e.setAttribute("href", a.uri || ""), e.setAttribute("onclick", `window.open('${a.uri || ""}')`); break; case "message": e.setAttribute("onclick", `alert('Send Message: ${a.text} to chatroom')`); break; case "postback": e.setAttribute("onclick", `alert('Send Postback: ${a.data}')`); break; case "datetimepicker": e.setAttribute("onclick", "alert('Open Datepicker')"); break; case "clipboard": e.setAttribute("onclick", `window.navigator.clipboard.writeText('${a.clipboardText}').then(() => alert('Copied to Clipboard: ${a.clipboardText}'))`); break; } return e.setStyle("cursor", "pointer"), e; }, Ot = (e) => N.includes(e), Mt = (e) => x.test(e) || b.test(e), Pt = (e) => (e == null ? void 0 : e.type) === "box" && (e.layout === "horizontal" || e.layout === "baseline"), Bt = (e) => e.replace(/[A-Z]/g, (a) => `-${a.toLowerCase()}`), m = class { constructor(e, a = {}, t = [], n = {}, l = [], o = void 0) { O(this, "tagName"); O(this, "attributes"); O(this, "className"); O(this, "style"); O(this, "children"); O(this, "textContent"); this.tagName = e, this.attributes = a, this.className = t, this.style = n, this.children = l, this.textContent = o; } getTagName() { return this.tagName; } setTextContent(e) { this.textContent = e || void 0; } getTextContent() { return this.textContent; } removeTextContent() { this.textContent = void 0; } getAttribute(e) { return this.attributes[e]; } setAttribute(e, a) { this.attributes[e] = a; } removeAttribute(e) { delete this.attributes[e]; } getClassName() { return this.className; } addClassName(e) { this.className.push(e); } addClassNames(...e) { this.className.push(...e); } removeClassName(e) { this.className = this.className.filter((a) => a !== e); } getStyle() { return this.style; } setStyle(e, a) { this.style[e] = a; } removeStyle(e) { delete this.style[e]; } appendChild(e) { this.children.push(e); } render() { let e = Object.entries(this.attributes).map(([o, d]) => `${o}="${d}"`).join(" "), a = this.className.join(" "), t = Object.entries(this.style).map(([o, d]) => `${Bt(o)}:${d.replace(/"/g, "").replace(/\//g, "/")}`).join(";"), n = `${e !== "" ? e : ""} ${a !== "" ? `class="${a}"` : ""} ${t !== "" ? `style="${t}"` : ""}`.trim(), l = this.children.map((o) => o.render()).join(""); return `<${this.tagName}${n !== "" ? ` ${n}` : ""}>${l !== "" ? l : this.textContent || ""}</${this.tagName}>`; } }, Wt = (e) => { let a = new m("div"); if (a.addClassNames("flex-preview"), e.type === "carousel") { let t = Xt(e); a.appendChild(t); } else { let t = Ye(e); a.appendChild(t); } return a.render(); }, Xt = (e) => { let a = new m("div"); a.addClassName("lyInner"); for (let n of e.contents) { let l = Ye(n); l.addClassNames("lyItem"), a.appendChild(l); } let t = new m("div"); return t.addClassName("LySlider"), t.appendChild(a), t; }, Ye = (e) => { var a, t, n, l; let o = new m("div"); if (o.addClassNames("T1", ot[e.direction || "ltr"]), o.setAttribute("dir", e.direction || "ltr"), e.header) { let c = ie("header", e.header), [v] = U(c, (a = e.styles) == null ? void 0 : a.header, "header", o); c = v, o.appendChild(c); } if (e.hero) { let c = Lt(e.hero), [v, C] = U(c, (t = e.styles) == null ? void 0 : t.hero, "hero", o); c = v, o = C, o.appendChild(c); } if (e.body) { let c = ie("body", e.body); e.footer && c.addClassNames("ExHasFooter"); let [v, C] = U(c, (n = e.styles) == null ? void 0 : n.body, "body", o); c = v, o = C, o.appendChild(c); } if (e.footer) { let c = ie("footer", e.footer), [v, C] = U(c, (l = e.styles) == null ? void 0 : l.footer, "footer", o); c = v, o = C, o.appendChild(c); } let d = new m("div"); return d.addClassName(lt[e.size || "mega"]), d.appendChild(o), d; }, ie = (e, a) => { let t = new m("div"); t.addClassNames(Me[e]); let n = ze(a); return t.appendChild(n), t; }, Lt = (e) => { let a = new m("div"); a.addClassNames(Me.hero); let t = J(e); return t && a.appendChild(t), a; }, ze = (e, a) => { let t = new m("div"); if (e.contents) for (let n of e.contents) { let l = J(n, e); l && t.appendChild(l); } return t.addClassNames(w.box, ...st[e.layout || "vertical"].split(" ")), t = Y(t, e.position), t = e.height || e.width ? $(t, 0) : $(t, e.flex), t = Pe(t, e.spacing), t = P(t, e.margin, a), t = y(t, e.width, "width"), t = y(t, e.height, "height"), t = y(t, e.maxWidth, "maxWidth"), t = y(t, e.maxHeight, "maxHeight"), t = A(t, e.backgroundColor, "backgroundColor"), t = Rt(t, e.borderWidth), t = A(t, e.borderColor, "borderColor"), t = _t(t, e.cornerRadius), t = St(t, e.justifyContent), t = wt(t, e.alignItems), t = z(t, e), t = Tt(t, e), t = $t(t, e.background), e.action && (t = q(t, e.action)), t; }, J = (e, a) => { switch (e.type) { case "box": return ze(e, a); case "button": return Yt(e, a); case "image": return zt(e, a); case "video": return qt(e); case "icon": return Ft(e, a); case "text": return Ht(e, a); case "span": return Ut(e); case "separator": return Fe(e, a); case "filler": return Gt(e); case "spacer": return Jt(e); default: return null; } }, Yt = (e, a) => { let t = new m("div"); if (t.addClassNames(w.button), e.action) { let n = new m("a"); n = A(n, e.color, e.style === "primary" || e.style === "secondary" ? "backgroundColor" : "color"); let l = new m("div"); l.setTextContent(e.action.label), n.appendChild(l), n = q(n, e.action), t.appendChild(n); } return t = $(t, e.flex), t = Y(t, e.position), t = P(t, e.margin, a), t = y(t, e.height, "height"), t = kt(t, e.style || "link"), t = de(t, e.gravity), t = z(t, e), t; }, zt = (e, a) => { let t = new m("div"); t.addClassNames(w.image), t = $(t, e.flex), t = Y(t, e.position), t = P(t, e.margin, a), t = We(t, e.align), t = de(t, e.gravity), Ot(e.size || "md") && (t = y(t, e.size || "md")), t = yt(t, e.aspectMode || "fit"), t = z(t, e); let n = new m("span"); n.setStyle("background-image", `url("${e.url}")`), n = A(n, e.backgroundColor, "backgroundColor"); let l = new m("a"); l = Nt(l, e.aspectRatio), l = q(l, e.action), l.appendChild(n); let o = new m("div"); return Mt(e.size || "md") && (o = y(o, e.size, "width")), o.appendChild(l), t.appendChild(o), t; }, Ft = (e, a) => { let t = new m("div"); t.addClassNames(w.icon); let n = new m("span"); n.setStyle("background-image", `url(${e.url})`), t = Y(t, e.position), t = P(t, e.margin, a), t = y(t, e.size), n = jt(n, e.aspectRatio), t = z(t, e), t = $(t, 0); let l = new m("div"); return l.appendChild(n), t.appendChild(l), t; }, Ht = (e, a) => { let t = new m("div"); if (t.addClassNames(w.text), e.contents && e.contents.length > 0) { let n = new m("p"); for (let l of e.contents) { let o = J(l, e); o && n.appendChild(o); } t.appendChild(n); } else if (e.text) { let n = new m("p"); if (n.setTextContent(e.text), e.action) { let l = new m("a"); l = q(l, e.action), l.appendChild(n), t.appendChild(l); } else t.appendChild(n); } return t = $(t, e.flex), t = P(t, e.margin, a), t = y(t, e.size, "fontSize"), t = y(t, e.lineSpacing, "lineHeight"), t = A(t, e.color, "color"), t = Be(t, e.weight), t = Xe(t, e.style), t = Le(t, e.decoration), t = Y(t, e.position), t = We(t, e.align), t = de(t, e.gravity), t = At(t, e.wrap), t = z(t, e), t; }, Ut = (e, a) => { let t = new m("span"); return t.addClassNames(w.span), t.setTextContent(e.text), t = y(t, e.size, "fontSize"), t = A(t, e.color, "color"), t = Be(t, e.weight), t = Xe(t, e.style), t = Le(t, e.decoration), t; }, Fe = (e, a) => { let t = new m("div"); return t.addClassNames(w.separator), t = P(t, e.margin, a), t = A(t, e.color, "borderColor"), t; }, Gt = (e, a) => { let t = new m("div"); return t.addClassNames(w.filler), t = $(t, e.flex), t; }, qt = (e, a) => { let t = new m("div"); if (t.addClassNames(w.video), e.altContent) { let n = J(e.altContent); n && t.appendChild(n); } return t; }, Jt = (e, a) => { let t = new m("div"); return t.addClassNames(w.spacer), t = $(t, 0), t = Pe(t, e.size || "md"), t; }; const Zt = ({ json: e }) => /* @__PURE__ */ nt.jsx("div", { dangerouslySetInnerHTML: { __html: Wt(e) } }); export { Zt as FlexPreview };