@appcues/web-sdk 7.22.0 → 7.23.13

package/build/dist.DrPFC3yn.js

@@ -0,0 +1,2204 @@
+import { d as e, h as t, l as n, r, u as i, y as a } from "./dist.BmJY3Sl-.js";
+//#region ../../node_modules/@lit/reactive-element/css-tag.js
+var o = window, s = o.ShadowRoot && (o.ShadyCSS === void 0 || o.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, c = Symbol(), l = /* @__PURE__ */ new WeakMap(), u = class {
+	constructor(e, t, n) {
+		if (this._$cssResult$ = !0, n !== c) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+		this.cssText = e, this.t = t;
+	}
+	get styleSheet() {
+		let e = this.o, t = this.t;
+		if (s && e === void 0) {
+			let n = t !== void 0 && t.length === 1;
+			n && (e = l.get(t)), e === void 0 && ((this.o = e = new CSSStyleSheet()).replaceSync(this.cssText), n && l.set(t, e));
+		}
+		return e;
+	}
+	toString() {
+		return this.cssText;
+	}
+}, d = (e) => new u(typeof e == "string" ? e : e + "", void 0, c), f = (e, ...t) => new u(e.length === 1 ? e[0] : t.reduce(((t, n, r) => t + ((e) => {
+	if (!0 === e._$cssResult$) return e.cssText;
+	if (typeof e == "number") return e;
+	throw Error("Value passed to 'css' function must be a 'css' function result: " + e + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
+})(n) + e[r + 1]), e[0]), e, c), ee = (e, t) => {
+	s ? e.adoptedStyleSheets = t.map(((e) => e instanceof CSSStyleSheet ? e : e.styleSheet)) : t.forEach(((t) => {
+		let n = document.createElement("style"), r = o.litNonce;
+		r !== void 0 && n.setAttribute("nonce", r), n.textContent = t.cssText, e.appendChild(n);
+	}));
+}, te = s ? (e) => e : (e) => e instanceof CSSStyleSheet ? ((e) => {
+	let t = "";
+	for (let n of e.cssRules) t += n.cssText;
+	return d(t);
+})(e) : e, ne = window, p = ne.trustedTypes, m = p ? p.emptyScript : "", re = ne.reactiveElementPolyfillSupport, h = {
+	toAttribute(e, t) {
+		switch (t) {
+			case Boolean:
+				e = e ? m : null;
+				break;
+			case Object:
+			case Array: e = e == null ? e : JSON.stringify(e);
+		}
+		return e;
+	},
+	fromAttribute(e, t) {
+		let n = e;
+		switch (t) {
+			case Boolean:
+				n = e !== null;
+				break;
+			case Number:
+				n = e === null ? null : Number(e);
+				break;
+			case Object:
+			case Array: try {
+				n = JSON.parse(e);
+			} catch {
+				n = null;
+			}
+		}
+		return n;
+	}
+}, ie = (e, t) => t !== e && (t == t || e == e), g = {
+	attribute: !0,
+	type: String,
+	converter: h,
+	reflect: !1,
+	hasChanged: ie
+}, _ = "finalized", v = class extends HTMLElement {
+	constructor() {
+		super(), this._$Ei = /* @__PURE__ */ new Map(), this.isUpdatePending = !1, this.hasUpdated = !1, this._$El = null, this._$Eu();
+	}
+	static addInitializer(e) {
+		this.finalize(), (this.h ??= []).push(e);
+	}
+	static get observedAttributes() {
+		this.finalize();
+		let e = [];
+		return this.elementProperties.forEach(((t, n) => {
+			let r = this._$Ep(n, t);
+			r !== void 0 && (this._$Ev.set(r, n), e.push(r));
+		})), e;
+	}
+	static createProperty(e, t = g) {
+		if (t.state && (t.attribute = !1), this.finalize(), this.elementProperties.set(e, t), !t.noAccessor && !this.prototype.hasOwnProperty(e)) {
+			let n = typeof e == "symbol" ? Symbol() : "__" + e, r = this.getPropertyDescriptor(e, n, t);
+			r !== void 0 && Object.defineProperty(this.prototype, e, r);
+		}
+	}
+	static getPropertyDescriptor(e, t, n) {
+		return {
+			get() {
+				return this[t];
+			},
+			set(r) {
+				let i = this[e];
+				this[t] = r, this.requestUpdate(e, i, n);
+			},
+			configurable: !0,
+			enumerable: !0
+		};
+	}
+	static getPropertyOptions(e) {
+		return this.elementProperties.get(e) || g;
+	}
+	static finalize() {
+		if (this.hasOwnProperty(_)) return !1;
+		this[_] = !0;
+		let e = Object.getPrototypeOf(this);
+		if (e.finalize(), e.h !== void 0 && (this.h = [...e.h]), this.elementProperties = new Map(e.elementProperties), this._$Ev = /* @__PURE__ */ new Map(), this.hasOwnProperty("properties")) {
+			let e = this.properties, t = [...Object.getOwnPropertyNames(e), ...Object.getOwnPropertySymbols(e)];
+			for (let n of t) this.createProperty(n, e[n]);
+		}
+		return this.elementStyles = this.finalizeStyles(this.styles), !0;
+	}
+	static finalizeStyles(e) {
+		let t = [];
+		if (Array.isArray(e)) {
+			let n = new Set(e.flat(Infinity).reverse());
+			for (let e of n) t.unshift(te(e));
+		} else e !== void 0 && t.push(te(e));
+		return t;
+	}
+	static _$Ep(e, t) {
+		let n = t.attribute;
+		return !1 === n ? void 0 : typeof n == "string" ? n : typeof e == "string" ? e.toLowerCase() : void 0;
+	}
+	_$Eu() {
+		var e;
+		this._$E_ = new Promise(((e) => this.enableUpdating = e)), this._$AL = /* @__PURE__ */ new Map(), this._$Eg(), this.requestUpdate(), (e = this.constructor.h) == null || e.forEach(((e) => e(this)));
+	}
+	addController(e) {
+		var t;
+		(this._$ES ??= []).push(e), this.renderRoot !== void 0 && this.isConnected && ((t = e.hostConnected) == null || t.call(e));
+	}
+	removeController(e) {
+		var t;
+		(t = this._$ES) == null || t.splice(this._$ES.indexOf(e) >>> 0, 1);
+	}
+	_$Eg() {
+		this.constructor.elementProperties.forEach(((e, t) => {
+			this.hasOwnProperty(t) && (this._$Ei.set(t, this[t]), delete this[t]);
+		}));
+	}
+	createRenderRoot() {
+		let e = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
+		return ee(e, this.constructor.elementStyles), e;
+	}
+	connectedCallback() {
+		var e;
+		this.renderRoot === void 0 && (this.renderRoot = this.createRenderRoot()), this.enableUpdating(!0), (e = this._$ES) == null || e.forEach(((e) => e.hostConnected?.call(e)));
+	}
+	enableUpdating(e) {}
+	disconnectedCallback() {
+		var e;
+		(e = this._$ES) == null || e.forEach(((e) => e.hostDisconnected?.call(e)));
+	}
+	attributeChangedCallback(e, t, n) {
+		this._$AK(e, n);
+	}
+	_$EO(e, t, n = g) {
+		let r = this.constructor._$Ep(e, n);
+		if (r !== void 0 && !0 === n.reflect) {
+			let i = (n.converter?.toAttribute === void 0 ? h : n.converter).toAttribute(t, n.type);
+			this._$El = e, i == null ? this.removeAttribute(r) : this.setAttribute(r, i), this._$El = null;
+		}
+	}
+	_$AK(e, t) {
+		let n = this.constructor, r = n._$Ev.get(e);
+		if (r !== void 0 && this._$El !== r) {
+			let e = n.getPropertyOptions(r), i = typeof e.converter == "function" ? { fromAttribute: e.converter } : e.converter?.fromAttribute === void 0 ? h : e.converter;
+			this._$El = r, this[r] = i.fromAttribute(t, e.type), this._$El = null;
+		}
+	}
+	requestUpdate(e, t, n) {
+		let r = !0;
+		e !== void 0 && (((n ||= this.constructor.getPropertyOptions(e)).hasChanged || ie)(this[e], t) ? (this._$AL.has(e) || this._$AL.set(e, t), !0 === n.reflect && this._$El !== e && (this._$EC === void 0 && (this._$EC = /* @__PURE__ */ new Map()), this._$EC.set(e, n))) : r = !1), !this.isUpdatePending && r && (this._$E_ = this._$Ej());
+	}
+	async _$Ej() {
+		this.isUpdatePending = !0;
+		try {
+			await this._$E_;
+		} catch (e) {
+			Promise.reject(e);
+		}
+		let e = this.scheduleUpdate();
+		return e != null && await e, !this.isUpdatePending;
+	}
+	scheduleUpdate() {
+		return this.performUpdate();
+	}
+	performUpdate() {
+		var e;
+		if (!this.isUpdatePending) return;
+		this.hasUpdated, this._$Ei &&= (this._$Ei.forEach(((e, t) => this[t] = e)), void 0);
+		let t = !1, n = this._$AL;
+		try {
+			t = this.shouldUpdate(n), t ? (this.willUpdate(n), (e = this._$ES) == null || e.forEach(((e) => e.hostUpdate?.call(e))), this.update(n)) : this._$Ek();
+		} catch (e) {
+			throw t = !1, this._$Ek(), e;
+		}
+		t && this._$AE(n);
+	}
+	willUpdate(e) {}
+	_$AE(e) {
+		var t;
+		(t = this._$ES) == null || t.forEach(((e) => e.hostUpdated?.call(e))), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(e)), this.updated(e);
+	}
+	_$Ek() {
+		this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = !1;
+	}
+	get updateComplete() {
+		return this.getUpdateComplete();
+	}
+	getUpdateComplete() {
+		return this._$E_;
+	}
+	shouldUpdate(e) {
+		return !0;
+	}
+	update(e) {
+		this._$EC !== void 0 && (this._$EC.forEach(((e, t) => this._$EO(t, this[t], e))), this._$EC = void 0), this._$Ek();
+	}
+	updated(e) {}
+	firstUpdated(e) {}
+};
+v[_] = !0, v.elementProperties = /* @__PURE__ */ new Map(), v.elementStyles = [], v.shadowRootOptions = { mode: "open" }, re?.({ ReactiveElement: v }), (ne.reactiveElementVersions ??= []).push("1.6.3");
+//#endregion
+//#region ../../node_modules/lit-html/lit-html.js
+var y = window, b = y.trustedTypes, ae = b ? b.createPolicy("lit-html", { createHTML: (e) => e }) : void 0, x = "$lit$", S = `lit$${(Math.random() + "").slice(9)}$`, oe = "?" + S, se = `<${oe}>`, C = document, w = () => C.createComment(""), T = (e) => e === null || typeof e != "object" && typeof e != "function", ce = Array.isArray, le = (e) => ce(e) || typeof e?.[Symbol.iterator] == "function", ue = "[ 	\n\f\r]", E = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, de = /-->/g, fe = />/g, D = RegExp(`>|${ue}(?:([^\\s"'>=/]+)(${ue}*=${ue}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`, "g"), pe = /'/g, me = /"/g, he = /^(?:script|style|textarea|title)$/i, ge = (e) => (t, ...n) => ({
+	_$litType$: e,
+	strings: t,
+	values: n
+}), O = ge(1), _e = ge(2), k = Symbol.for("lit-noChange"), A = Symbol.for("lit-nothing"), ve = /* @__PURE__ */ new WeakMap(), j = C.createTreeWalker(C, 129, null, !1);
+function ye(e, t) {
+	if (!Array.isArray(e) || !e.hasOwnProperty("raw")) throw Error("invalid template strings array");
+	return ae === void 0 ? t : ae.createHTML(t);
+}
+var be = (e, t) => {
+	let n = e.length - 1, r = [], i, a = t === 2 ? "<svg>" : "", o = E;
+	for (let t = 0; t < n; t++) {
+		let n = e[t], s, c, l = -1, u = 0;
+		for (; u < n.length && (o.lastIndex = u, c = o.exec(n), c !== null);) u = o.lastIndex, o === E ? c[1] === "!--" ? o = de : c[1] === void 0 ? c[2] === void 0 ? c[3] !== void 0 && (o = D) : (he.test(c[2]) && (i = RegExp("</" + c[2], "g")), o = D) : o = fe : o === D ? c[0] === ">" ? (o = i ?? E, l = -1) : c[1] === void 0 ? l = -2 : (l = o.lastIndex - c[2].length, s = c[1], o = c[3] === void 0 ? D : c[3] === "\"" ? me : pe) : o === me || o === pe ? o = D : o === de || o === fe ? o = E : (o = D, i = void 0);
+		let d = o === D && e[t + 1].startsWith("/>") ? " " : "";
+		a += o === E ? n + se : l >= 0 ? (r.push(s), n.slice(0, l) + x + n.slice(l) + S + d) : n + S + (l === -2 ? (r.push(void 0), t) : d);
+	}
+	return [ye(e, a + (e[n] || "<?>") + (t === 2 ? "</svg>" : "")), r];
+}, xe = class e {
+	constructor({ strings: t, _$litType$: n }, r) {
+		let i;
+		this.parts = [];
+		let a = 0, o = 0, s = t.length - 1, c = this.parts, [l, u] = be(t, n);
+		if (this.el = e.createElement(l, r), j.currentNode = this.el.content, n === 2) {
+			let e = this.el.content, t = e.firstChild;
+			t.remove(), e.append(...t.childNodes);
+		}
+		for (; (i = j.nextNode()) !== null && c.length < s;) {
+			if (i.nodeType === 1) {
+				if (i.hasAttributes()) {
+					let e = [];
+					for (let t of i.getAttributeNames()) if (t.endsWith(x) || t.startsWith(S)) {
+						let n = u[o++];
+						if (e.push(t), n !== void 0) {
+							let e = i.getAttribute(n.toLowerCase() + x).split(S), t = /([.?@])?(.*)/.exec(n);
+							c.push({
+								type: 1,
+								index: a,
+								name: t[2],
+								strings: e,
+								ctor: t[1] === "." ? Te : t[1] === "?" ? De : t[1] === "@" ? Oe : we
+							});
+						} else c.push({
+							type: 6,
+							index: a
+						});
+					}
+					for (let t of e) i.removeAttribute(t);
+				}
+				if (he.test(i.tagName)) {
+					let e = i.textContent.split(S), t = e.length - 1;
+					if (t > 0) {
+						i.textContent = b ? b.emptyScript : "";
+						for (let n = 0; n < t; n++) i.append(e[n], w()), j.nextNode(), c.push({
+							type: 2,
+							index: ++a
+						});
+						i.append(e[t], w());
+					}
+				}
+			} else if (i.nodeType === 8) if (i.data === oe) c.push({
+				type: 2,
+				index: a
+			});
+			else {
+				let e = -1;
+				for (; (e = i.data.indexOf(S, e + 1)) !== -1;) c.push({
+					type: 7,
+					index: a
+				}), e += S.length - 1;
+			}
+			a++;
+		}
+	}
+	static createElement(e, t) {
+		let n = C.createElement("template");
+		return n.innerHTML = e, n;
+	}
+};
+function M(e, t, n = e, r) {
+	var i, a;
+	if (t === k) return t;
+	let o = r === void 0 ? n._$Cl : n._$Co?.[r], s = T(t) ? void 0 : t._$litDirective$;
+	return o?.constructor !== s && ((i = o?._$AO) == null || i.call(o, !1), s === void 0 ? o = void 0 : (o = new s(e), o._$AT(e, n, r)), r === void 0 ? n._$Cl = o : ((a = n)._$Co ?? (a._$Co = []))[r] = o), o !== void 0 && (t = M(e, o._$AS(e, t.values), o, r)), t;
+}
+var Se = class {
+	constructor(e, t) {
+		this._$AV = [], this._$AN = void 0, this._$AD = e, this._$AM = t;
+	}
+	get parentNode() {
+		return this._$AM.parentNode;
+	}
+	get _$AU() {
+		return this._$AM._$AU;
+	}
+	u(e) {
+		let { el: { content: t }, parts: n } = this._$AD, r = (e?.creationScope ?? C).importNode(t, !0);
+		j.currentNode = r;
+		let i = j.nextNode(), a = 0, o = 0, s = n[0];
+		for (; s !== void 0;) {
+			if (a === s.index) {
+				let t;
+				s.type === 2 ? t = new Ce(i, i.nextSibling, this, e) : s.type === 1 ? t = new s.ctor(i, s.name, s.strings, this, e) : s.type === 6 && (t = new ke(i, this, e)), this._$AV.push(t), s = n[++o];
+			}
+			a !== s?.index && (i = j.nextNode(), a++);
+		}
+		return j.currentNode = C, r;
+	}
+	v(e) {
+		let t = 0;
+		for (let n of this._$AV) n !== void 0 && (n.strings === void 0 ? n._$AI(e[t]) : (n._$AI(e, n, t), t += n.strings.length - 2)), t++;
+	}
+}, Ce = class e {
+	constructor(e, t, n, r) {
+		var i;
+		this.type = 2, this._$AH = A, this._$AN = void 0, this._$AA = e, this._$AB = t, this._$AM = n, this.options = r, this._$Cp = (i = r?.isConnected) == null || i;
+	}
+	get _$AU() {
+		return this._$AM?._$AU ?? this._$Cp;
+	}
+	get parentNode() {
+		let e = this._$AA.parentNode, t = this._$AM;
+		return t !== void 0 && e?.nodeType === 11 && (e = t.parentNode), e;
+	}
+	get startNode() {
+		return this._$AA;
+	}
+	get endNode() {
+		return this._$AB;
+	}
+	_$AI(e, t = this) {
+		e = M(this, e, t), T(e) ? e === A || e == null || e === "" ? (this._$AH !== A && this._$AR(), this._$AH = A) : e !== this._$AH && e !== k && this._(e) : e._$litType$ === void 0 ? e.nodeType === void 0 ? le(e) ? this.T(e) : this._(e) : this.$(e) : this.g(e);
+	}
+	k(e) {
+		return this._$AA.parentNode.insertBefore(e, this._$AB);
+	}
+	$(e) {
+		this._$AH !== e && (this._$AR(), this._$AH = this.k(e));
+	}
+	_(e) {
+		this._$AH !== A && T(this._$AH) ? this._$AA.nextSibling.data = e : this.$(C.createTextNode(e)), this._$AH = e;
+	}
+	g(e) {
+		let { values: t, _$litType$: n } = e, r = typeof n == "number" ? this._$AC(e) : (n.el === void 0 && (n.el = xe.createElement(ye(n.h, n.h[0]), this.options)), n);
+		if (this._$AH?._$AD === r) this._$AH.v(t);
+		else {
+			let e = new Se(r, this), n = e.u(this.options);
+			e.v(t), this.$(n), this._$AH = e;
+		}
+	}
+	_$AC(e) {
+		let t = ve.get(e.strings);
+		return t === void 0 && ve.set(e.strings, t = new xe(e)), t;
+	}
+	T(t) {
+		ce(this._$AH) || (this._$AH = [], this._$AR());
+		let n = this._$AH, r, i = 0;
+		for (let a of t) i === n.length ? n.push(r = new e(this.k(w()), this.k(w()), this, this.options)) : r = n[i], r._$AI(a), i++;
+		i < n.length && (this._$AR(r && r._$AB.nextSibling, i), n.length = i);
+	}
+	_$AR(e = this._$AA.nextSibling, t) {
+		var n;
+		for ((n = this._$AP) == null || n.call(this, !1, !0, t); e && e !== this._$AB;) {
+			let t = e.nextSibling;
+			e.remove(), e = t;
+		}
+	}
+	setConnected(e) {
+		var t;
+		this._$AM === void 0 && (this._$Cp = e, (t = this._$AP) == null || t.call(this, e));
+	}
+}, we = class {
+	constructor(e, t, n, r, i) {
+		this.type = 1, this._$AH = A, this._$AN = void 0, this.element = e, this.name = t, this._$AM = r, this.options = i, n.length > 2 || n[0] !== "" || n[1] !== "" ? (this._$AH = Array(n.length - 1).fill(/* @__PURE__ */ new String()), this.strings = n) : this._$AH = A;
+	}
+	get tagName() {
+		return this.element.tagName;
+	}
+	get _$AU() {
+		return this._$AM._$AU;
+	}
+	_$AI(e, t = this, n, r) {
+		let i = this.strings, a = !1;
+		if (i === void 0) e = M(this, e, t, 0), a = !T(e) || e !== this._$AH && e !== k, a && (this._$AH = e);
+		else {
+			let r = e, o, s;
+			for (e = i[0], o = 0; o < i.length - 1; o++) s = M(this, r[n + o], t, o), s === k && (s = this._$AH[o]), a ||= !T(s) || s !== this._$AH[o], s === A ? e = A : e !== A && (e += (s ?? "") + i[o + 1]), this._$AH[o] = s;
+		}
+		a && !r && this.j(e);
+	}
+	j(e) {
+		e === A ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, e ?? "");
+	}
+}, Te = class extends we {
+	constructor() {
+		super(...arguments), this.type = 3;
+	}
+	j(e) {
+		this.element[this.name] = e === A ? void 0 : e;
+	}
+}, Ee = b ? b.emptyScript : "", De = class extends we {
+	constructor() {
+		super(...arguments), this.type = 4;
+	}
+	j(e) {
+		e && e !== A ? this.element.setAttribute(this.name, Ee) : this.element.removeAttribute(this.name);
+	}
+}, Oe = class extends we {
+	constructor(e, t, n, r, i) {
+		super(e, t, n, r, i), this.type = 5;
+	}
+	_$AI(e, t = this) {
+		if ((e = M(this, e, t, 0) ?? A) === k) return;
+		let n = this._$AH, r = e === A && n !== A || e.capture !== n.capture || e.once !== n.once || e.passive !== n.passive, i = e !== A && (n === A || r);
+		r && this.element.removeEventListener(this.name, this, n), i && this.element.addEventListener(this.name, this, e), this._$AH = e;
+	}
+	handleEvent(e) {
+		typeof this._$AH == "function" ? this._$AH.call(this.options?.host ?? this.element, e) : this._$AH.handleEvent(e);
+	}
+}, ke = class {
+	constructor(e, t, n) {
+		this.element = e, this.type = 6, this._$AN = void 0, this._$AM = t, this.options = n;
+	}
+	get _$AU() {
+		return this._$AM._$AU;
+	}
+	_$AI(e) {
+		M(this, e);
+	}
+}, Ae = y.litHtmlPolyfillSupport;
+Ae?.(xe, Ce), (y.litHtmlVersions ??= []).push("2.8.0");
+var je = (e, t, n) => {
+	let r = n?.renderBefore ?? t, i = r._$litPart$;
+	if (i === void 0) {
+		let e = n?.renderBefore ?? null;
+		r._$litPart$ = i = new Ce(t.insertBefore(w(), e), e, void 0, n ?? {});
+	}
+	return i._$AI(e), i;
+}, Me, N = class extends v {
+	constructor() {
+		super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0;
+	}
+	createRenderRoot() {
+		var e;
+		let t = super.createRenderRoot();
+		return (e = this.renderOptions).renderBefore ?? (e.renderBefore = t.firstChild), t;
+	}
+	update(e) {
+		let t = this.render();
+		this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(e), this._$Do = je(t, this.renderRoot, this.renderOptions);
+	}
+	connectedCallback() {
+		var e;
+		super.connectedCallback(), (e = this._$Do) == null || e.setConnected(!0);
+	}
+	disconnectedCallback() {
+		var e;
+		super.disconnectedCallback(), (e = this._$Do) == null || e.setConnected(!1);
+	}
+	render() {
+		return k;
+	}
+};
+N.finalized = !0, N._$litElement$ = !0, (Me = globalThis.litElementHydrateSupport) == null || Me.call(globalThis, { LitElement: N });
+var Ne = globalThis.litElementPolyfillSupport;
+Ne?.({ LitElement: N }), (globalThis.litElementVersions ?? (globalThis.litElementVersions = [])).push("3.3.3");
+//#endregion
+//#region ../../node_modules/@lit/reactive-element/decorators/property.js
+var Pe = (e, t) => t.kind === "method" && t.descriptor && !("value" in t.descriptor) ? {
+	...t,
+	finisher(n) {
+		n.createProperty(t.key, e);
+	}
+} : {
+	kind: "field",
+	key: Symbol(),
+	placement: "own",
+	descriptor: {},
+	originalKey: t.key,
+	initializer() {
+		typeof t.initializer == "function" && (this[t.key] = t.initializer.call(this));
+	},
+	finisher(n) {
+		n.createProperty(t.key, e);
+	}
+}, Fe = (e, t, n) => {
+	t.constructor.createProperty(n, e);
+};
+function P(e) {
+	return (t, n) => n === void 0 ? Pe(e, t) : Fe(e, t, n);
+}
+//#endregion
+//#region ../../node_modules/@lit/reactive-element/decorators/state.js
+function F(e) {
+	return P({
+		...e,
+		state: !0
+	});
+}
+window.HTMLSlotElement?.prototype.assignedElements;
+//#endregion
+//#region ../../node_modules/lit-html/directive.js
+var Ie = {
+	ATTRIBUTE: 1,
+	CHILD: 2,
+	PROPERTY: 3,
+	BOOLEAN_ATTRIBUTE: 4,
+	EVENT: 5,
+	ELEMENT: 6
+}, Le = (e) => (...t) => ({
+	_$litDirective$: e,
+	values: t
+}), Re = class {
+	constructor(e) {}
+	get _$AU() {
+		return this._$AM._$AU;
+	}
+	_$AT(e, t, n) {
+		this._$Ct = e, this._$AM = t, this._$Ci = n;
+	}
+	_$AS(e, t) {
+		return this.update(e, t);
+	}
+	update(e, t) {
+		return this.render(...t);
+	}
+}, ze = class extends Re {
+	constructor(e) {
+		if (super(e), this.et = A, e.type !== Ie.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
+	}
+	render(e) {
+		if (e === A || e == null) return this.ft = void 0, this.et = e;
+		if (e === k) return e;
+		if (typeof e != "string") throw Error(this.constructor.directiveName + "() called with a non-string value");
+		if (e === this.et) return this.ft;
+		this.et = e;
+		let t = [e];
+		return t.raw = t, this.ft = {
+			_$litType$: this.constructor.resultType,
+			strings: t,
+			values: []
+		};
+	}
+};
+ze.directiveName = "unsafeHTML", ze.resultType = 1;
+var Be = Le(ze), Ve = Symbol(), He = class {
+	get taskComplete() {
+		return this.t || (this.i === 1 ? this.t = new Promise(((e, t) => {
+			this.o = e, this.h = t;
+		})) : this.i === 3 ? this.t = Promise.reject(this.l) : this.t = Promise.resolve(this.u)), this.t;
+	}
+	constructor(e, t, n) {
+		this.p = 0, this.i = 0, (this._ = e).addController(this);
+		let r = typeof t == "object" ? t : {
+			task: t,
+			args: n
+		};
+		this.v = r.task, this.j = r.args, this.m = r.argsEqual ?? Ue, this.k = r.onComplete, this.A = r.onError, this.autoRun = r.autoRun ?? !0, "initialValue" in r && (this.u = r.initialValue, this.i = 2, this.O = this.T?.());
+	}
+	hostUpdate() {
+		!0 === this.autoRun && this.S();
+	}
+	hostUpdated() {
+		this.autoRun === "afterUpdate" && this.S();
+	}
+	T() {
+		if (this.j === void 0) return;
+		let e = this.j();
+		if (!Array.isArray(e)) throw Error("The args function must return an array");
+		return e;
+	}
+	async S() {
+		let e = this.T(), t = this.O;
+		this.O = e, e === t || e === void 0 || t !== void 0 && this.m(t, e) || await this.run(e);
+	}
+	async run(e) {
+		let t, n;
+		e ??= this.T(), this.O = e, this.i === 1 ? this.q?.abort() : (this.t = void 0, this.o = void 0, this.h = void 0), this.i = 1, this.autoRun === "afterUpdate" ? queueMicrotask((() => this._.requestUpdate())) : this._.requestUpdate();
+		let r = ++this.p;
+		this.q = new AbortController();
+		let i = !1;
+		try {
+			t = await this.v(e, { signal: this.q.signal });
+		} catch (e) {
+			i = !0, n = e;
+		}
+		if (this.p === r) {
+			if (t === Ve) this.i = 0;
+			else {
+				if (!1 === i) {
+					try {
+						this.k?.(t);
+					} catch {}
+					this.i = 2, this.o?.(t);
+				} else {
+					try {
+						this.A?.(n);
+					} catch {}
+					this.i = 3, this.h?.(n);
+				}
+				this.u = t, this.l = n;
+			}
+			this._.requestUpdate();
+		}
+	}
+	abort(e) {
+		this.i === 1 && this.q?.abort(e);
+	}
+	get value() {
+		return this.u;
+	}
+	get error() {
+		return this.l;
+	}
+	get status() {
+		return this.i;
+	}
+	render(e) {
+		switch (this.i) {
+			case 0: return e.initial?.();
+			case 1: return e.pending?.();
+			case 2: return e.complete?.(this.value);
+			case 3: return e.error?.(this.error);
+			default: throw Error("Unexpected status: " + this.i);
+		}
+	}
+}, Ue = (e, t) => e === t || e.length === t.length && e.every(((e, n) => !ie(e, t[n]))), We = /* @__PURE__ */ a((/* @__PURE__ */ t(((e, t) => {
+	var n = "Expected a function", r = NaN, i = "[object Symbol]", a = /^\s+|\s+$/g, o = /^[-+]0x[0-9a-f]+$/i, s = /^0b[01]+$/i, c = /^0o[0-7]+$/i, l = parseInt, u = typeof global == "object" && global && global.Object === Object && global, d = typeof self == "object" && self && self.Object === Object && self, f = u || d || Function("return this")(), ee = Object.prototype.toString, te = Math.max, ne = Math.min, p = function() {
+		return f.Date.now();
+	};
+	function m(e, t, r) {
+		var i, a, o, s, c, l, u = 0, d = !1, f = !1, ee = !0;
+		if (typeof e != "function") throw TypeError(n);
+		t = g(t) || 0, re(r) && (d = !!r.leading, f = "maxWait" in r, o = f ? te(g(r.maxWait) || 0, t) : o, ee = "trailing" in r ? !!r.trailing : ee);
+		function m(t) {
+			var n = i, r = a;
+			return i = a = void 0, u = t, s = e.apply(r, n), s;
+		}
+		function h(e) {
+			return u = e, c = setTimeout(v, t), d ? m(e) : s;
+		}
+		function ie(e) {
+			var n = e - l, r = e - u, i = t - n;
+			return f ? ne(i, o - r) : i;
+		}
+		function _(e) {
+			var n = e - l, r = e - u;
+			return l === void 0 || n >= t || n < 0 || f && r >= o;
+		}
+		function v() {
+			var e = p();
+			if (_(e)) return y(e);
+			c = setTimeout(v, ie(e));
+		}
+		function y(e) {
+			return c = void 0, ee && i ? m(e) : (i = a = void 0, s);
+		}
+		function b() {
+			c !== void 0 && clearTimeout(c), u = 0, i = l = a = c = void 0;
+		}
+		function ae() {
+			return c === void 0 ? s : y(p());
+		}
+		function x() {
+			var e = p(), n = _(e);
+			if (i = arguments, a = this, l = e, n) {
+				if (c === void 0) return h(l);
+				if (f) return c = setTimeout(v, t), m(l);
+			}
+			return c === void 0 && (c = setTimeout(v, t)), s;
+		}
+		return x.cancel = b, x.flush = ae, x;
+	}
+	function re(e) {
+		var t = typeof e;
+		return !!e && (t == "object" || t == "function");
+	}
+	function h(e) {
+		return !!e && typeof e == "object";
+	}
+	function ie(e) {
+		return typeof e == "symbol" || h(e) && ee.call(e) == i;
+	}
+	function g(e) {
+		if (typeof e == "number") return e;
+		if (ie(e)) return r;
+		if (re(e)) {
+			var t = typeof e.valueOf == "function" ? e.valueOf() : e;
+			e = re(t) ? t + "" : t;
+		}
+		if (typeof e != "string") return e === 0 ? e : +e;
+		e = e.replace(a, "");
+		var n = s.test(e);
+		return n || c.test(e) ? l(e.slice(2), n ? 2 : 8) : o.test(e) ? r : +e;
+	}
+	t.exports = m;
+})))(), 1), Ge = Object.defineProperty, Ke = Object.getOwnPropertyDescriptor, I = (e, t, n, r) => {
+	for (var i = r > 1 ? void 0 : r ? Ke(t, n) : t, a = e.length - 1, o; a >= 0; a--) (o = e[a]) && (i = (r ? o(t, n, i) : o(i)) || i);
+	return r && i && Ge(t, n, i), i;
+}, L = (e = "", t) => {
+	customElements.get(e) || customElements.define(e, t);
+}, qe = (e, t) => [...e].reduce((e, n) => t?.skip?.includes(n.name) ? e : `${e}${n.name}="${n.value}" `, ""), R = class extends N {
+	constructor() {
+		super(...arguments), this.name = "", this.fallbackTag = null, this.defaultStyle = null, this.refElement = null;
+	}
+	connectedCallback() {
+		super.connectedCallback();
+		let e = this;
+		for (; e.parentNode;) e = e.parentNode;
+		if (this.refElement = e.host.querySelector(`[refElement="${this.name}"]`), this.refElement && this.fallbackTag !== null && this.refElement.tagName.toLowerCase() !== this.fallbackTag) throw Error(`Your html tag to customize ${this.name} should be <${this.fallbackTag}></<${this.fallbackTag}>`);
+	}
+	render() {
+		let e = qe(this.attributes, { skip: ["name", "fallbacktag"] }), t = qe(this.refElement?.attributes ?? []);
+		return O`${Be(`
+      <style>${this.defaultStyle}</style>
+      <${this.fallbackTag} ${e} ${t}>
+        <slot></slot>
+      </${this.fallbackTag}>`)}`;
+	}
+};
+I([P()], R.prototype, "name", 2), I([P({ type: String || null })], R.prototype, "fallbackTag", 2), I([P({ type: String || null })], R.prototype, "defaultStyle", 2), I([P({ type: String || null })], R.prototype, "refElement", 2), L("appcues-use-ref", R);
+var Je = () => {
+	let e = {}, t = window.AppcuesSettings?.userIdSignature;
+	return t && (e = { Authorization: `Bearer ${t}` }), e;
+}, Ye = async (e, t) => {
+	let n = Je();
+	return await fetch(e, {
+		headers: n,
+		...t
+	});
+}, Xe = "https://api.appcues.net/v1/", Ze = f`
+  .container {
+    background: #fff;
+    box-shadow: var(--flows-list-block-shadow);
+    border-radius: var(--flows-list-block-radius);
+    padding: 8px 0;
+    width: 100%;
+  }
+
+  .container .loading,
+  .container .error-message {
+    align-items: center;
+    color: var(--flows-list-block-color);
+    display: flex;
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 400;
+    justify-content: center;
+    line-height: 160%;
+    padding: 16px;
+    text-align: center;
+  }
+`, Qe = f`
+  slot[name='empty-message'],
+  ::slotted(p[slot='empty-message']) {
+    align-items: center;
+    color: var(--flows-list-block-color);
+    display: flex;
+    font-style: normal;
+    font-weight: 400;
+    justify-content: center;
+    line-height: 160%;
+    padding: 16px;
+    text-align: center;
+    font-size: 14px;
+  }
+`, $e = f`
+  ul {
+    list-style-type: square;
+    list-style-position: inside;
+    margin: 0;
+    padding: 0 4px;
+  }
+`, et = f`
+  li {
+    cursor: pointer;
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 160%;
+    padding: 8px 16px;
+    border-radius: var(--flows-list-block-item-radius);
+    transition: background-color 0.3s ease 0s;
+  }
+
+  li:hover {
+    background-color: var(--flows-list-block-background-hover);
+  }
+
+  li:focus-visible {
+    background-color: var(--flows-list-block-background-hover);
+    outline: 2px solid currentColor;
+    outline-offset: -2px;
+  }
+
+  li::marker {
+    color: var(--flows-list-block-marker-color);
+  }
+
+  li:hover > span {
+    background-color: var(--flows-list-block-background-hover);
+  }
+
+  li:focus-visible > span {
+    background-color: var(--flows-list-block-background-hover);
+  }
+
+  li > span {
+    color: var(--flows-list-block-color);
+  }
+
+  li appcues-use-ref {
+    display: inline-flex;
+    max-width: calc(100% - 20px);
+  }
+`, tt = f`
+  ::slotted(h1[slot='title']),
+  ::slotted(h2[slot='title']),
+  ::slotted(h3[slot='title']) {
+    color: var(--flows-list-block-color);
+    font-size: 15px;
+    font-weight: 700;
+    line-height: 24px;
+    margin: 0 0 8px;
+    padding: 0 16px 0;
+
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    max-height: 48px;
+    max-width: calc(100% - 32px);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: normal;
+  }
+`, nt = window, z = nt.trustedTypes, rt = z ? z.createPolicy("lit-html", { createHTML: (e) => e }) : void 0, it = "$lit$", B = `lit$${(Math.random() + "").slice(9)}$`, at = "?" + B, ot = `<${at}>`, V = document, st = () => V.createComment(""), H = (e) => e === null || typeof e != "object" && typeof e != "function", ct = Array.isArray, lt = (e) => ct(e) || typeof e?.[Symbol.iterator] == "function", ut = "[ 	\n\f\r]", U = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, dt = /-->/g, ft = />/g, W = RegExp(`>|${ut}(?:([^\\s"'>=/]+)(${ut}*=${ut}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`, "g"), pt = /'/g, mt = /"/g, ht = /^(?:script|style|textarea|title)$/i, gt = (e) => (t, ...n) => ({
+	_$litType$: e,
+	strings: t,
+	values: n
+}), G = gt(1), _t = gt(2), K = Symbol.for("lit-noChange"), q = Symbol.for("lit-nothing"), vt = /* @__PURE__ */ new WeakMap(), J = V.createTreeWalker(V, 129, null, !1);
+function yt(e, t) {
+	if (!Array.isArray(e) || !e.hasOwnProperty("raw")) throw Error("invalid template strings array");
+	return rt === void 0 ? t : rt.createHTML(t);
+}
+var bt = (e, t) => {
+	let n = e.length - 1, r = [], i, a = t === 2 ? "<svg>" : "", o = U;
+	for (let t = 0; t < n; t++) {
+		let n = e[t], s, c, l = -1, u = 0;
+		for (; u < n.length && (o.lastIndex = u, c = o.exec(n), c !== null);) u = o.lastIndex, o === U ? c[1] === "!--" ? o = dt : c[1] === void 0 ? c[2] === void 0 ? c[3] !== void 0 && (o = W) : (ht.test(c[2]) && (i = RegExp("</" + c[2], "g")), o = W) : o = ft : o === W ? c[0] === ">" ? (o = i ?? U, l = -1) : c[1] === void 0 ? l = -2 : (l = o.lastIndex - c[2].length, s = c[1], o = c[3] === void 0 ? W : c[3] === "\"" ? mt : pt) : o === mt || o === pt ? o = W : o === dt || o === ft ? o = U : (o = W, i = void 0);
+		let d = o === W && e[t + 1].startsWith("/>") ? " " : "";
+		a += o === U ? n + ot : l >= 0 ? (r.push(s), n.slice(0, l) + it + n.slice(l) + B + d) : n + B + (l === -2 ? (r.push(void 0), t) : d);
+	}
+	return [yt(e, a + (e[n] || "<?>") + (t === 2 ? "</svg>" : "")), r];
+}, xt = class {
+	constructor({ strings: e, _$litType$: t }, n) {
+		let r;
+		this.parts = [];
+		let i = 0, a = 0, o = e.length - 1, s = this.parts, [c, l] = bt(e, t);
+		if (this.el = xt.createElement(c, n), J.currentNode = this.el.content, t === 2) {
+			let e = this.el.content, t = e.firstChild;
+			t.remove(), e.append(...t.childNodes);
+		}
+		for (; (r = J.nextNode()) !== null && s.length < o;) {
+			if (r.nodeType === 1) {
+				if (r.hasAttributes()) {
+					let e = [];
+					for (let t of r.getAttributeNames()) if (t.endsWith(it) || t.startsWith(B)) {
+						let n = l[a++];
+						if (e.push(t), n !== void 0) {
+							let e = r.getAttribute(n.toLowerCase() + it).split(B), t = /([.?@])?(.*)/.exec(n);
+							s.push({
+								type: 1,
+								index: i,
+								name: t[2],
+								strings: e,
+								ctor: t[1] === "." ? Tt : t[1] === "?" ? Dt : t[1] === "@" ? Ot : wt
+							});
+						} else s.push({
+							type: 6,
+							index: i
+						});
+					}
+					for (let t of e) r.removeAttribute(t);
+				}
+				if (ht.test(r.tagName)) {
+					let e = r.textContent.split(B), t = e.length - 1;
+					if (t > 0) {
+						r.textContent = z ? z.emptyScript : "";
+						for (let n = 0; n < t; n++) r.append(e[n], st()), J.nextNode(), s.push({
+							type: 2,
+							index: ++i
+						});
+						r.append(e[t], st());
+					}
+				}
+			} else if (r.nodeType === 8) if (r.data === at) s.push({
+				type: 2,
+				index: i
+			});
+			else {
+				let e = -1;
+				for (; (e = r.data.indexOf(B, e + 1)) !== -1;) s.push({
+					type: 7,
+					index: i
+				}), e += B.length - 1;
+			}
+			i++;
+		}
+	}
+	static createElement(e, t) {
+		let n = V.createElement("template");
+		return n.innerHTML = e, n;
+	}
+};
+function Y(e, t, n = e, r) {
+	var i, a;
+	if (t === K) return t;
+	let o = r === void 0 ? n._$Cl : n._$Co?.[r], s = H(t) ? void 0 : t._$litDirective$;
+	return o?.constructor !== s && ((i = o?._$AO) == null || i.call(o, !1), s === void 0 ? o = void 0 : (o = new s(e), o._$AT(e, n, r)), r === void 0 ? n._$Cl = o : ((a = n)._$Co ?? (a._$Co = []))[r] = o), o !== void 0 && (t = Y(e, o._$AS(e, t.values), o, r)), t;
+}
+var St = class {
+	constructor(e, t) {
+		this._$AV = [], this._$AN = void 0, this._$AD = e, this._$AM = t;
+	}
+	get parentNode() {
+		return this._$AM.parentNode;
+	}
+	get _$AU() {
+		return this._$AM._$AU;
+	}
+	u(e) {
+		let { el: { content: t }, parts: n } = this._$AD, r = (e?.creationScope ?? V).importNode(t, !0);
+		J.currentNode = r;
+		let i = J.nextNode(), a = 0, o = 0, s = n[0];
+		for (; s !== void 0;) {
+			if (a === s.index) {
+				let t;
+				s.type === 2 ? t = new Ct(i, i.nextSibling, this, e) : s.type === 1 ? t = new s.ctor(i, s.name, s.strings, this, e) : s.type === 6 && (t = new kt(i, this, e)), this._$AV.push(t), s = n[++o];
+			}
+			a !== s?.index && (i = J.nextNode(), a++);
+		}
+		return J.currentNode = V, r;
+	}
+	v(e) {
+		let t = 0;
+		for (let n of this._$AV) n !== void 0 && (n.strings === void 0 ? n._$AI(e[t]) : (n._$AI(e, n, t), t += n.strings.length - 2)), t++;
+	}
+}, Ct = class {
+	constructor(e, t, n, r) {
+		var i;
+		this.type = 2, this._$AH = q, this._$AN = void 0, this._$AA = e, this._$AB = t, this._$AM = n, this.options = r, this._$Cp = (i = r?.isConnected) == null || i;
+	}
+	get _$AU() {
+		return this._$AM?._$AU ?? this._$Cp;
+	}
+	get parentNode() {
+		let e = this._$AA.parentNode, t = this._$AM;
+		return t !== void 0 && e?.nodeType === 11 && (e = t.parentNode), e;
+	}
+	get startNode() {
+		return this._$AA;
+	}
+	get endNode() {
+		return this._$AB;
+	}
+	_$AI(e, t = this) {
+		e = Y(this, e, t), H(e) ? e === q || e == null || e === "" ? (this._$AH !== q && this._$AR(), this._$AH = q) : e !== this._$AH && e !== K && this._(e) : e._$litType$ === void 0 ? e.nodeType === void 0 ? lt(e) ? this.T(e) : this._(e) : this.$(e) : this.g(e);
+	}
+	k(e) {
+		return this._$AA.parentNode.insertBefore(e, this._$AB);
+	}
+	$(e) {
+		this._$AH !== e && (this._$AR(), this._$AH = this.k(e));
+	}
+	_(e) {
+		this._$AH !== q && H(this._$AH) ? this._$AA.nextSibling.data = e : this.$(V.createTextNode(e)), this._$AH = e;
+	}
+	g(e) {
+		let { values: t, _$litType$: n } = e, r = typeof n == "number" ? this._$AC(e) : (n.el === void 0 && (n.el = xt.createElement(yt(n.h, n.h[0]), this.options)), n);
+		if (this._$AH?._$AD === r) this._$AH.v(t);
+		else {
+			let e = new St(r, this), n = e.u(this.options);
+			e.v(t), this.$(n), this._$AH = e;
+		}
+	}
+	_$AC(e) {
+		let t = vt.get(e.strings);
+		return t === void 0 && vt.set(e.strings, t = new xt(e)), t;
+	}
+	T(e) {
+		ct(this._$AH) || (this._$AH = [], this._$AR());
+		let t = this._$AH, n, r = 0;
+		for (let i of e) r === t.length ? t.push(n = new Ct(this.k(st()), this.k(st()), this, this.options)) : n = t[r], n._$AI(i), r++;
+		r < t.length && (this._$AR(n && n._$AB.nextSibling, r), t.length = r);
+	}
+	_$AR(e = this._$AA.nextSibling, t) {
+		var n;
+		for ((n = this._$AP) == null || n.call(this, !1, !0, t); e && e !== this._$AB;) {
+			let t = e.nextSibling;
+			e.remove(), e = t;
+		}
+	}
+	setConnected(e) {
+		var t;
+		this._$AM === void 0 && (this._$Cp = e, (t = this._$AP) == null || t.call(this, e));
+	}
+}, wt = class {
+	constructor(e, t, n, r, i) {
+		this.type = 1, this._$AH = q, this._$AN = void 0, this.element = e, this.name = t, this._$AM = r, this.options = i, n.length > 2 || n[0] !== "" || n[1] !== "" ? (this._$AH = Array(n.length - 1).fill(/* @__PURE__ */ new String()), this.strings = n) : this._$AH = q;
+	}
+	get tagName() {
+		return this.element.tagName;
+	}
+	get _$AU() {
+		return this._$AM._$AU;
+	}
+	_$AI(e, t = this, n, r) {
+		let i = this.strings, a = !1;
+		if (i === void 0) e = Y(this, e, t, 0), a = !H(e) || e !== this._$AH && e !== K, a && (this._$AH = e);
+		else {
+			let r = e, o, s;
+			for (e = i[0], o = 0; o < i.length - 1; o++) s = Y(this, r[n + o], t, o), s === K && (s = this._$AH[o]), a ||= !H(s) || s !== this._$AH[o], s === q ? e = q : e !== q && (e += (s ?? "") + i[o + 1]), this._$AH[o] = s;
+		}
+		a && !r && this.j(e);
+	}
+	j(e) {
+		e === q ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, e ?? "");
+	}
+}, Tt = class extends wt {
+	constructor() {
+		super(...arguments), this.type = 3;
+	}
+	j(e) {
+		this.element[this.name] = e === q ? void 0 : e;
+	}
+}, Et = z ? z.emptyScript : "", Dt = class extends wt {
+	constructor() {
+		super(...arguments), this.type = 4;
+	}
+	j(e) {
+		e && e !== q ? this.element.setAttribute(this.name, Et) : this.element.removeAttribute(this.name);
+	}
+}, Ot = class extends wt {
+	constructor(e, t, n, r, i) {
+		super(e, t, n, r, i), this.type = 5;
+	}
+	_$AI(e, t = this) {
+		if ((e = Y(this, e, t, 0) ?? q) === K) return;
+		let n = this._$AH, r = e === q && n !== q || e.capture !== n.capture || e.once !== n.once || e.passive !== n.passive, i = e !== q && (n === q || r);
+		r && this.element.removeEventListener(this.name, this, n), i && this.element.addEventListener(this.name, this, e), this._$AH = e;
+	}
+	handleEvent(e) {
+		typeof this._$AH == "function" ? this._$AH.call(this.options?.host ?? this.element, e) : this._$AH.handleEvent(e);
+	}
+}, kt = class {
+	constructor(e, t, n) {
+		this.element = e, this.type = 6, this._$AN = void 0, this._$AM = t, this.options = n;
+	}
+	get _$AU() {
+		return this._$AM._$AU;
+	}
+	_$AI(e) {
+		Y(this, e);
+	}
+}, At = nt.litHtmlPolyfillSupport;
+At?.(xt, Ct), (nt.litHtmlVersions ??= []).push("2.8.0");
+var jt = _t`
+  <svg
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    x="0px"
+    y="0px"
+    width="40px"
+    height="40px"
+    fill="#0072D6"
+    viewBox="0 0 40 40"
+    enable-background="new 0 0 40 40"
+    xml:space="preserve"
+  >
+    <path
+      opacity="0.2"
+      fill="#0072D6"
+      d="M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946,14.946,14.946
+ s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634
+ c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z"
+    />
+    <path
+      fill="#0072D6"
+      d="M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0
+ C22.32,8.481,24.301,9.057,26.013,10.047z"
+    >
+      <animateTransform
+        attributeType="xml"
+        attributeName="transform"
+        type="rotate"
+        from="0 20 20"
+        to="360 20 20"
+        keySplines="0.17 0.27 0.8 0.65"
+        calcMode="spline"
+        dur="0.6s"
+        repeatCount="indefinite"
+        keyTimes="0;1"
+      />
+    </path>
+  </svg>
+`, Mt = JSON.stringify([
+	{
+		id: "1",
+		name: "Item 1",
+		publicName: "Item 1 public lorem ipsum dolor lorem impsum"
+	},
+	{
+		id: "2",
+		name: "Item 2"
+	},
+	{
+		id: "3",
+		name: "Item 3"
+	},
+	{
+		id: "4",
+		name: "Item 4"
+	},
+	{
+		id: "5",
+		name: "Item 5"
+	}
+]), Nt = async ({ accountId: e, userId: t }, n) => {
+	if (!e || !t) return [];
+	let r = window.location.href, i = new URL(`${Xe}/accounts/${e}/users/${t}/widget`);
+	return i.searchParams.set("url", r), i.searchParams.set("order_by", n), (await Ye(i.toString())).json();
+}, X = class extends N {
+	constructor() {
+		super(...arguments), this.listItems = [], this.orderBy = "sort_order", this.limit = 5, this.listMock = Mt, this.mode = "live", this.fetchListItems = async () => {
+			if (this.mode === "preview") return this.listItems = JSON.parse(this.listMock), JSON.parse(this.listMock);
+			let e = await Appcues?.user() ?? {}, { contents: t } = await Nt({
+				accountId: AppcuesBundleSettings?.accountId,
+				userId: e?.userId
+			}, this.orderBy), n = t.map(({ id: e, name: t, public_name: n }) => ({
+				id: e,
+				name: t,
+				publicName: n
+			}));
+			return this.listItems = n, n;
+		}, this.getListItems = new He(this, {
+			task: this.fetchListItems,
+			args: () => []
+		}), this.handleItemClick = (e) => () => {
+			let t = new CustomEvent("flow-item-clicked", {
+				detail: this.listItems.find((t) => t.id === e),
+				bubbles: !0,
+				composed: !0
+			});
+			this.dispatchEvent(t);
+		}, this.handleItemKeydown = (e) => (t) => {
+			(t.code === "Enter" || t.code === "Space") && (t.preventDefault(), this.handleItemClick(e)());
+		}, this.handleItemHover = (e) => () => {
+			let t = new CustomEvent("flow-item-hovered", {
+				detail: this.listItems.find((t) => t.id === e),
+				bubbles: !0,
+				composed: !0
+			});
+			this.dispatchEvent(t);
+		}, this.containerTemplate = (e) => O`
+    <appcues-use-ref
+      name="list-container"
+      fallbackTag="ul"
+      defaultStyle=${$e}
+    >
+      ${e.slice(0, this.limit).map(this.itemTemplate)}
+    </appcues-use-ref>
+  `, this.itemTemplate = (e) => O`
+    <li
+      tabindex="0"
+      role="button"
+      @click="${this.handleItemClick(e.id)}"
+      @keydown="${this.handleItemKeydown(e.id)}"
+      @mouseover="${this.handleItemHover(e.id)}"
+    >
+      <appcues-use-ref fallbackTag="span" name="list-item">
+        ${e.publicName ?? e.name}
+      </appcues-use-ref>
+    </li>
+  `, this.emptyMessageTemplate = O`
+    <slot name="empty-message">
+      <p>Nothing to see here at the moment</p>
+    </slot>
+  `;
+	}
+	connectedCallback() {
+		super.connectedCallback(), this.mode !== "live" && new MutationObserver((e) => {
+			e.forEach((e) => {
+				let [t] = e.addedNodes;
+				(e.type === "attributes" || t && [
+					"UL",
+					"LI",
+					"SPAN"
+				].includes(t.nodeName)) && this.getListItems.run();
+			});
+		}).observe(this, {
+			childList: !0,
+			subtree: !0,
+			attributes: !0
+		});
+	}
+	render() {
+		return O`
+      <div class="container">
+        <slot name="title"></slot>
+        ${this.getListItems.render({
+			pending: () => O`<div class="loading">${jt}</div>`,
+			complete: (e) => e.slice(0, this.limit).length === 0 ? this.emptyMessageTemplate : this.containerTemplate(e),
+			error: () => O`
+            <div class="error-message">Nothing to see here at the moment</div>
+          `
+		})}
+      </div>
+    `;
+	}
+};
+X.styles = [
+	Ze,
+	Qe,
+	tt,
+	et
+], I([F()], X.prototype, "listItems", 2), I([P()], X.prototype, "orderBy", 2), I([P({ type: Number })], X.prototype, "limit", 2), I([P()], X.prototype, "listMock", 2), I([P({ type: String })], X.prototype, "mode", 2), L("appcues-flows-list", X);
+var Pt = f`
+  .btn-wrapper {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+  }
+
+  .btn-wrapper button {
+    background-color: var(--launcher-main-color, #0072d6);
+    color: white;
+    cursor: pointer;
+    outline-color: #0072d6;
+    outline-width: 2px;
+  }
+
+  .btn-wrapper button {
+    border: none;
+    border-start-start-radius: 80px;
+    border-end-start-radius: 80px;
+    border-start-end-radius: 0;
+    border-end-end-radius: 0;
+    padding-inline: 16px 8px;
+    padding-block: 4px;
+    height: 52px;
+    outline-offset: 3px;
+  }
+
+  .btn-wrapper ::slotted(button) {
+    padding: 10px 16px;
+    border-radius: 80px;
+    border: 2px solid transparent;
+    height: 52px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    outline-offset: 4px;
+  }
+
+  .btn-wrapper button:hover:not(:active):not([disabled]) {
+    background-color: var(--launcher-hover-color, #4848eb) !important;
+  }
+
+  .btn-wrapper button:active {
+    background-color: var(--launcher-active-color, #8c8cff) !important;
+  }
+
+  .btn-wrapper > .slot-wrapper {
+    border: 2px solid white;
+    margin-top: -2px;
+    border-radius: 80px;
+    width: max-content;
+  }
+
+  .btn-wrapper > .slot-wrapper.active {
+    margin-inline-start: -18px;
+  }
+`, Ft = f`
+  .checklist-content {
+    display: flex;
+    flex-direction: column;
+    text-align: left;
+    margin-inline-end: 18px;
+    justify-content: center;
+    gap: 6px;
+    line-height: 1.2;
+  }
+`, It = f`
+  .progress-wrapper {
+    display: flex;
+    align-items: center;
+    gap: 2px;
+    border-radius: 6px;
+    min-width: 100px;
+    overflow: hidden;
+  }
+
+  .progress-bar,
+  progress {
+    background-color: rgba(255, 255, 255, 0.4);
+    height: 4px;
+    flex-grow: 1;
+  }
+
+  .progress-bar.completed {
+    background-color: white;
+  }
+
+  progress[value] {
+    --color: white;
+    --background: rgba(255, 255, 255, 0.4);
+    appearance: none;
+    background: var(--background);
+    border: none;
+  }
+
+  progress[value]::-webkit-progress-bar {
+    background: var(--background);
+  }
+
+  progress[value]::-webkit-progress-value {
+    background: var(--color);
+  }
+
+  progress[value]::-moz-progress-bar {
+    background: var(--color);
+  }
+`, Z = class extends N {
+	constructor() {
+		super(...arguments), this.title = "Checklist", this.totalItems = 0, this.completedItems = 0, this.activeColor = "#4848eb", this.hoverColor = "#4848eb", this.mainColor = "#0072d6", this.checklistId = "", this.handleSlotchange = (e) => {
+			let t = (e.target?.assignedNodes({ flatten: !0 })).find((e) => e.querySelector ? e.querySelector("button") : !1)?.querySelector("button");
+			if (!t) return;
+			let { backgroundColor: n, background: r } = getComputedStyle(t);
+			this.mainColor = n || r, this.style.setProperty("--launcher-main-color", this.mainColor);
+		}, this.progressbar = () => {
+			if (this.totalItems > 8) return G`<progress
+        id="items"
+        value="${this.completedItems}"
+        max="${this.totalItems}"
+      ></progress>`;
+			let e = [];
+			for (let t = 0; t < this.totalItems; t++) e.push(G`<div
+          class="progress-bar ${t < this.completedItems && "completed"}"
+        ></div>`);
+			return e;
+		}, this.slotElement = () => G`
+    <slot @slotchange=${this.handleSlotchange}></slot>
+  `;
+	}
+	connectedCallback() {
+		super.connectedCallback(), this.totalItems = Number.parseInt(this.getAttribute("totalitems") || "0", 10), this.completedItems = Number.parseInt(this.getAttribute("completeditems") || "0", 10), this.title = this.getAttribute("title") || "Checklist", e((e) => {
+			let { id: t, name: n, totalItems: i, completedItems: a } = e.detail;
+			this.totalItems = i, this.completedItems = a, this.title = n, this.checklistId = t, r();
+		}), i(() => {
+			this.totalItems = 0, this.completedItems = 0, this.title = "Checklist", this.checklistId = "";
+		});
+	}
+	attributeChangedCallback(e, t, n) {
+		if (e === "totalitems") {
+			let e = Number.parseInt(n || "0", 10);
+			this.totalItems = Math.max(e, 0);
+		}
+		if (e === "completeditems") {
+			let e = Number.parseInt(n || "0", 10);
+			e > this.totalItems ? this.completedItems = this.totalItems : e < 0 ? this.completedItems = 0 : this.completedItems = e;
+		}
+		e === "title" && (this.title = n || "Checklist"), e === "hovercolor" && (this.hoverColor = n || "#4848eb", this.style.setProperty("--launcher-hover-color", this.hoverColor)), e === "activecolor" && (this.activeColor = n || "#8c8cff", this.style.setProperty("--launcher-active-color", this.activeColor));
+	}
+	render() {
+		return G`
+      <div class="btn-wrapper">
+        ${this.totalItems === 0 ? this.slotElement() : G`
+              <button @click="${() => n(this.checklistId)}">
+                <div class="checklist-content">
+                  ${this.title}
+                  <div class="progress-wrapper" aria-role="progressbar">
+                    ${this.progressbar()}
+                  </div>
+                </div>
+              </button>
+              <div
+                class="slot-wrapper ${this.totalItems > 0 && "active"}"
+                @click="${{
+			handleEvent: () => n(this.checklistId, !0),
+			capture: !0
+		}}"
+              >
+                ${this.slotElement()}
+              </div>
+            `}
+      </div>
+    `;
+	}
+};
+Z.styles = [
+	Pt,
+	Ft,
+	It
+], I([P()], Z.prototype, "title", 2), I([P()], Z.prototype, "totalItems", 2), I([P()], Z.prototype, "completedItems", 2), I([P()], Z.prototype, "activeColor", 2), I([P()], Z.prototype, "hoverColor", 2), I([F()], Z.prototype, "mainColor", 2), I([F()], Z.prototype, "checklistId", 2), L("appcues-checklist-wrapper", Z);
+var Lt = f`
+  .page {
+    display: block;
+    width: 100%;
+    height: 100%;
+  }
+
+  .idle {
+    display: none;
+  }
+
+  .hidden {
+    pointer-events: none;
+  }
+
+  .animated {
+    position: absolute;
+    top: 0;
+    left: 0;
+  }
+`, Rt = f`
+  .slide-in-bottom {
+    animation: slide-in-bottom 0.4s cubic-bezier(0.15, 1.03, 0.8, 1.03) forwards;
+  }
+
+  @keyframes slide-in-bottom {
+    0% {
+      opacity: 0;
+      transform: translateY(80%);
+    }
+    20% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+`, zt = f`
+  .slide-out-bottom {
+    animation: slide-out-bottom 0.4s cubic-bezier(0.7, 0, 0.57, 0.55) forwards;
+  }
+
+  @keyframes slide-out-bottom {
+    0% {
+      opacity: 1;
+      transform: translateY(0);
+    }
+
+    80% {
+      opacity: 1;
+    }
+
+    99% {
+      transform: translateY(80%);
+      opacity: 0;
+    }
+
+    100% {
+      display: none;
+      max-height: 0;
+      overflow: hidden;
+    }
+  }
+`, Bt = class extends N {
+	constructor() {
+		super(...arguments), this.status = "idle", this.animation = "", this.minHeight = "auto";
+	}
+	show({ animation: e = "" } = {}) {
+		e !== "" && (this.animation = e), this.status = "showing";
+	}
+	hide({ animation: e = "" } = {}) {
+		e !== "" && (this.animation = e), this.status = "hidden";
+	}
+	render() {
+		return O`
+      <div
+        class="page ${this.status} ${this.animation && "animated"} ${this.animation}"
+        aria-hidden="${["hidden", "idle"].includes(this.status)}"
+      >
+        <slot></slot>
+      </div>
+    `;
+	}
+};
+Bt.styles = [
+	Lt,
+	Rt,
+	zt
+], I([F()], Bt.prototype, "status", 2), I([P()], Bt.prototype, "minHeight", 2), L("appcues-page", Bt);
+var Vt = f`
+  .grow {
+    animation: grow-min-height 0.4s cubic-bezier(0.7, 0, 0.57, 0.55) forwards;
+    min-height: auto;
+  }
+
+  .shrink {
+    animation: shrink-min-height 0.4s cubic-bezier(0.7, 0, 0.57, 0.55) forwards;
+  }
+`, Q = class extends N {
+	constructor() {
+		super(...arguments), this.currentPage = 0, this.pages = [], this.currentHeight = "auto", this.entry = "slide-in-bottom", this.exit = "slide-out-bottom";
+	}
+	getChildren() {
+		return this.shadowRoot ? this.shadowRoot.querySelector("slot")?.assignedElements({ flatten: !0 }) ?? [] : [];
+	}
+	updateHeight(e = this.currentPage) {
+		let t = this.pages[e].minHeight || "auto";
+		this.currentHeight = t === "auto" ? "auto" : t;
+	}
+	showFirstPage() {
+		this.updateHeight(), this.pages[this.currentPage].show();
+	}
+	prev() {
+		this.currentPage <= 0 || (this.updateHeight(this.currentPage - 1), this.pages[this.currentPage].hide({ animation: this.exit }), this.pages[this.currentPage - 1].show(), --this.currentPage);
+	}
+	next() {
+		this.currentPage >= this.pages.length - 1 || (this.currentPage += 1, this.updateHeight(), this.pages[this.currentPage].show({ animation: this.entry }), this.pages[this.currentPage - 1].hide());
+	}
+	goTo(e = 0) {
+		e !== this.currentPage && (this.pages[e].show({ animation: e === 0 ? "" : this.entry }), this.pages[this.currentPage].hide({ animation: this.currentPage === 0 ? "" : this.exit }), this.currentPage = e, this.updateHeight());
+	}
+	firstUpdated() {
+		this.pages = this.getChildren(), this.showFirstPage();
+	}
+	connectedCallback() {
+		super.connectedCallback();
+	}
+	render() {
+		return O`
+      <style>
+        @keyframes grow-min-height {
+          0% {
+            min-height: 0;
+          }
+
+          100% {
+            min-height: ${this.currentHeight};
+          }
+        }
+
+        @keyframes shrink-min-height {
+          0% {
+            min-height: ${this.currentHeight};
+          }
+
+          100% {
+            min-height: auto;
+          }
+        }
+      </style>
+      <div
+        class="${this.currentPage === 0 ? "shrink" : "grow"}"
+        style="position: relative;"
+      >
+        <slot></slot>
+      </div>
+    `;
+	}
+};
+Q.styles = [Vt], I([F()], Q.prototype, "currentPage", 2), I([F()], Q.prototype, "pages", 2), I([F()], Q.prototype, "currentHeight", 2), I([P()], Q.prototype, "entry", 2), I([P()], Q.prototype, "exit", 2), L("appcues-navigation-stack", Q);
+var Ht = _t`
+  <svg
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    x="0px"
+    y="0px"
+    width="40px"
+    height="40px"
+    fill="#0072D6"
+    viewBox="0 0 40 40"
+    enable-background="new 0 0 40 40"
+    xml:space="preserve"
+  >
+    <path
+      opacity="0.2"
+      fill="#0072D6"
+      d="M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946,14.946,14.946
+ s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634
+ c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z"
+    />
+    <path
+      fill="#0072D6"
+      d="M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0
+ C22.32,8.481,24.301,9.057,26.013,10.047z"
+    >
+      <animateTransform
+        attributeType="xml"
+        attributeName="transform"
+        type="rotate"
+        from="0 20 20"
+        to="360 20 20"
+        keySplines="0.17 0.27 0.8 0.65"
+        calcMode="spline"
+        dur="0.6s"
+        repeatCount="indefinite"
+        keyTimes="0;1"
+      />
+    </path>
+  </svg>
+`, Ut = _t`
+  <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+    <g id="material-icon" clip-path="url(#clip0_19386_6120)">
+      <path
+        id="Vector" 
+        d="M6.12522 8.00305L11.9239 13.8017C12.1702 14.048 12.2953 14.3528 12.2993 14.7161C12.3033 15.0794 12.1822 15.3842 11.9359 15.6305C11.6896 15.8769 11.3828 16 11.0155 16C10.6481 16 10.3413 15.8769 10.095 15.6305L3.93523 9.47075C3.7234 9.25892 3.57007 9.02893 3.47524 8.78077C3.38042 8.53262 3.33301 8.27338 3.33301 8.00305C3.33301 7.73273 3.38042 7.47349 3.47524 7.22534C3.57007 6.97718 3.7234 6.74719 3.93523 6.53536L10.095 0.375561C10.3413 0.129259 10.6461 0.00410428 11.0094 9.62603e-05C11.3727 -0.00391176 11.6776 0.117242 11.9239 0.363558C12.1702 0.60986 12.2933 0.916664 12.2933 1.28397C12.2933 1.65128 12.1702 1.95809 11.9239 2.20441L6.12522 8.00305Z"
+        fill="currentColor"
+      />
+    </g>
+  </svg>
+`, Wt = _t`
+  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"  viewBox="0 0 24 24">
+      <path 
+        fill="currentColor" 
+        d="M8.9 17.81a8.6 8.6 0 0 1-6.31-2.59A8.6 8.6 0 0 1 0 8.91c0-2.49.86-4.6 2.59-6.32A8.6 8.6 0 0 1 8.9 0a8.6 8.6 0 0 1 6.32 2.59A8.6 8.6 0 0 1 17.8 8.9a8.39 8.39 0 0 1-1.68 5.07l7.45 7.46c.28.29.42.65.42 1.07 0 .43-.14.78-.43 1.06-.29.29-.64.43-1.07.43-.43 0-.78-.14-1.07-.43L14 16.13a8.42 8.42 0 0 1-5.09 1.68Zm0-3.05c1.63 0 3.01-.57 4.15-1.7a5.65 5.65 0 0 0 1.7-4.15c0-1.63-.56-3.02-1.7-4.15a5.64 5.64 0 0 0-4.15-1.7c-1.63 0-3 .56-4.14 1.7a5.65 5.65 0 0 0-1.7 4.15c0 1.63.56 3 1.7 4.15a5.64 5.64 0 0 0 4.14 1.7Z" 
+      />
+  </svg>
+`, Gt = f`
+  @keyframes fade-in {
+    0% {
+      opacity: 0;
+      display: none;
+    }
+
+    100% {
+      opacity: 1;
+      display: flex;
+    }
+  }
+
+  @keyframes fade-out {
+    0% {
+      opacity: 1;
+      display: flex;
+    }
+
+    100% {
+      opacity: 0;
+      display: none;
+    }
+  }
+
+  @keyframes expand {
+    0% {
+      width: 0%;
+    }
+
+    100% {
+      width: 100%;
+    }
+  }
+
+  @keyframes collapse {
+    0% {
+      width: 100%;
+    }
+
+    100% {
+      width: 0%;
+    }
+  }
+
+  @keyframes slide-in {
+    0% {
+      transform: translateX(120px);
+    }
+
+    100% {
+      transform: translateX(0);
+    }
+  }
+
+  @keyframes slide-out {
+    0% {
+      transform: translateX(0);
+    }
+
+    100% {
+      transform: translateX(120px);
+    }
+  }
+`, Kt = f`
+  :host {
+    display: flex;
+    width: 100%;
+  }
+
+  .container {
+    align-items: center;
+    display: flex;
+    height: 40px;
+    justify-content: space-between;
+    position: relative;
+    width: 100%;
+  }
+
+  svg {
+    height: 16px;
+  }
+
+  button {
+    align-items: center;
+    color: inherit;
+    cursor: pointer;
+    background: transparent;
+    border: none;
+    display: flex;
+    justify-content: center;
+    padding: 12px;
+  }
+`, qt = f`
+  .search-container {
+    align-items: center;
+    display: none;
+    opacity: 0;
+    position: absolute;
+    width: calc(100% + 12px);
+    left: -12px;
+  }
+
+  .search-container input {
+    border: none;
+    border-start-start-radius: 8px;
+    border-end-start-radius: 8px;
+    border-start-end-radius: 0;
+    border-end-end-radius: 0;
+    box-sizing: border-box;
+    height: 40px;
+    padding: 8px 12px 8px 16px;
+    width: 0;
+  }
+
+  .search-container input:focus {
+    outline: none;
+  }
+
+  .search-container .search-form {
+    display: flex;
+    flex: 1;
+    justify-content: flex-end;
+    margin-bottom: 0;
+  }
+
+  .search-container .search-button {
+    background: white;
+    border-start-end-radius: 8px;
+    border-end-end-radius: 8px;
+    border-start-start-radius: 0;
+    border-end-start-radius: 0;
+    padding: 0 12px;
+  }
+
+  .search-container .search-button svg {
+    width: 16px;
+  }
+
+  .search-container .search-button svg path {
+    fill: black;
+  }
+
+  .search-container.show {
+    animation: fade-in 0.3s cubic-bezier(0.3, 0.4, 0.3, 0.8) forwards;
+    display: flex;
+  }
+
+  .search-container.show input {
+    animation: expand 0.3s cubic-bezier(0.3, 0.4, 0.3, 0.8) forwards;
+    width: 100%;
+  }
+
+  .search-container.hide {
+    animation: fade-out 0.3s cubic-bezier(0.3, 0.4, 0.3, 0.8) forwards;
+  }
+
+  .search-container.hide input {
+    animation: collapse 0.3s cubic-bezier(0.3, 0.4, 0.3, 0.8) forwards;
+    width: 0;
+  }
+
+  .content-container {
+    align-items: center;
+    display: flex;
+    height: 40px;
+    justify-content: space-between;
+    width: 100%;
+  }
+
+  .content-container .content {
+    text-wrap: nowrap;
+  }
+
+  .content-container.show {
+    display: flex;
+    animation: fade-in 0.3s cubic-bezier(0.3, 0.4, 0.3, 0.8) forwards;
+  }
+
+  .content-container.show .content {
+    animation: slide-in 0.3s cubic-bezier(0.3, 0.4, 0.3, 0.8) forwards;
+  }
+
+  .content-container.hide {
+    animation: fade-out 0.3s cubic-bezier(0.3, 0.4, 0.3, 0.8) forwards;
+  }
+
+  .content-container.hide .content {
+    animation: slide-out 0.3s cubic-bezier(0.3, 0.4, 0.3, 0.8) forwards;
+  }
+
+  .search-bar {
+    align-items: center;
+    background: white;
+    border: none;
+    display: none;
+    justify-content: flex-end;
+    gap: 16px;
+    width: 100%;
+  }
+
+  .search-bar.show {
+    display: flex;
+  }
+`, Jt = class extends N {
+	constructor() {
+		super(...arguments), this.showSearchBar = null, this.loading = !1, this.handleSubmit = () => {
+			let e = this.shadowRoot?.querySelector("input")?.value || "";
+			this.dispatchEvent(new CustomEvent("onSearch", {
+				detail: { inputValue: e },
+				bubbles: !0,
+				composed: !0
+			})), this.requestUpdate();
+		}, this.handleSearch = (0, We.default)(this.handleSubmit, 700);
+	}
+	setSearchMode(e) {
+		this.showSearchBar = e;
+		let t = this.shadowRoot?.querySelector("input");
+		this.requestUpdate(), e ? setTimeout(() => {
+			t?.focus();
+		}, 100) : (this.dispatchEvent(new CustomEvent("onCancel", {
+			bubbles: !0,
+			composed: !0
+		})), t && (t.value = ""));
+	}
+	render() {
+		return O`
+      <div class="container">
+        <div
+          class="content-container ${this.showSearchBar === null ? "" : this.showSearchBar ? "hide" : "show"}"
+        >
+          <div class="content" style="${this.style}">
+            <slot></slot>
+          </div>
+          <button @click="${() => this.setSearchMode(!0)}">
+            ${Wt}
+          </button>
+        </div>
+        <div class="search-container ${this.showSearchBar ? "show" : "hide"}">
+          <button
+            class="return-button"
+            @click="${() => this.setSearchMode(!1)}"
+          >
+            ${Ut}
+          </button>
+          <form
+            class="search-form"
+            @submit="${(e) => {
+			e.preventDefault(), this.handleSubmit();
+		}}"
+          >
+            <input
+              type="text"
+              placeholder="Type to search"
+              @keyup=${this.handleSearch}
+            />
+            <button class="search-button" type="submit">
+              ${this.loading ? Ht : Wt}
+            </button>
+          </form>
+        </div>
+      </div>
+    `;
+	}
+};
+Jt.styles = [
+	Gt,
+	Kt,
+	qt
+], I([F()], Jt.prototype, "showSearchBar", 2), I([P({ converter: (e) => e === "true" })], Jt.prototype, "loading", 2), L("appcues-search-header", Jt);
+var Yt = (e) => e && new DOMParser().parseFromString(e, "text/html").body.textContent || "", Xt = f`
+  :host {
+    height: 100%;
+    display: block;
+  }
+
+  * {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+  }
+
+  .root-wrapper {
+    height: 100%;
+    box-shadow: var(--search-results-block-shadow);
+    color: var(--search-results-block-color);
+    background-color: var(--search-results-block-background-color);
+  }
+
+  .content-wrapper {
+    padding: 16px 16px 16px 16px;
+    background: var(--search-results-block-content-wrapper-background-color);
+    min-height: 100%;
+  }
+
+  .content-wrapper .root-wrapper {
+    height: auto;
+    border-radius: var(--search-results-block-radius);
+  }
+
+  .root-wrapper[loading='true'] {
+    overflow: hidden;
+  }
+
+  .alert-wrapper {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    padding: 16px;
+  }
+`, Zt = f`
+  .pagination-btn {
+    align-items: center;
+    background: transparent;
+    border-bottom-left-radius: var(--search-results-block-radius);
+    border-bottom-right-radius: var(--search-results-block-radius);
+    border-top: 1px solid rgba(66, 86, 120, 0.1);
+    border-left: none;
+    border-right: none;
+    border-bottom: none;
+    cursor: pointer;
+    display: flex;
+    font-size: 14px;
+    font-weight: 500;
+    justify-content: center;
+    line-height: 24px;
+    padding: 8px 16px;
+    width: 100%;
+    position: relative;
+    top: 1px;
+  }
+
+  .pagination-btn:hover {
+    background: var(--search-results-block-background-color-hover);
+  }
+
+  .pagination-btn:focus {
+    outline: 2px solid var(--search-results-block-outline-color);
+    background: var(--search-results-block-background-color-active);
+  }
+`, Qt = f`
+  .article-main-title-wrapper {
+    padding: 8px 16px;
+  }
+
+  .article-main-title {
+    font-size: 15px;
+    font-style: normal;
+    font-weight: 700;
+  }
+
+  .article-list {
+    font-style: normal;
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+    list-style: none;
+  }
+
+  .article-list a {
+    text-decoration: none;
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    padding: 8px 16px;
+    color: currentColor;
+  }
+
+  .article-list a[loading='false']:hover {
+    background-color: var(--search-results-block-background-color-hover);
+  }
+
+  .article-list a[loading='false']:focus {
+    outline: 2px solid var(--search-results-block-outline-color);
+    background: var(--search-results-block-background-color-active);
+  }
+
+  .article-title-wrapper {
+    font-size: 14px;
+    font-weight: bold;
+    line-height: 160%;
+    display: flex;
+    gap: 8px;
+    align-items: center;
+    justify-content: space-between;
+  }
+
+  .article-title-wrapper p {
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+
+  .article-title-wrapper svg {
+    min-width: 12px;
+    min-height: 12px;
+    width: 12px;
+    height: 12px;
+  }
+
+  .article-title-wrapper.loading {
+    width: 70%;
+  }
+
+  .article-description {
+    font-size: 13px;
+    font-weight: normal;
+    line-height: 160%;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 3;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+
+  .article-description.loading {
+    height: 50px;
+  }
+`, $t = f`
+  @keyframes animatedBackgroundPosition {
+    0% {
+      background-position: 0% 92%;
+    }
+    100% {
+      background-position: 100% 9%;
+    }
+  }
+
+  .loading {
+    opacity: 0.5;
+    background: linear-gradient(
+      135deg,
+      rgba(211, 223, 232, 0.5) 30%,
+      rgba(169, 184, 197, 0.5) 38%,
+      rgba(168, 182, 193, 0.6) 41%,
+      rgba(168, 182, 193, 0.6) 50%,
+      rgba(168, 182, 193, 0.6) 50%,
+      rgba(169, 184, 197, 0.6) 51%,
+      rgba(211, 223, 232, 0.6) 57%,
+      rgba(211, 223, 232, 0.6) 80%,
+      rgba(211, 223, 232, 0.6) 80%
+    );
+    background-size: 1200% 1200%;
+    animation: animatedBackgroundPosition 3s ease infinite reverse;
+    color: transparent;
+  }
+`, en = _e`
+  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g id="Icon">
+      <path id="Vector" d="M11.4752 14.475L7.8502 10.85C7.8002 10.8 7.7627 10.7458 7.7377 10.6875C7.7127 10.6292 7.7002 10.5667 7.7002 10.5C7.7002 10.3667 7.74603 10.25 7.8377 10.15C7.92936 10.05 8.0502 10 8.2002 10H15.8002C15.9502 10 16.071 10.05 16.1627 10.15C16.2544 10.25 16.3002 10.3667 16.3002 10.5C16.3002 10.5333 16.2502 10.65 16.1502 10.85L12.5252 14.475C12.4419 14.5583 12.3585 14.6167 12.2752 14.65C12.1919 14.6833 12.1002 14.7 12.0002 14.7C11.9002 14.7 11.8085 14.6833 11.7252 14.65C11.6419 14.6167 11.5585 14.5583 11.4752 14.475Z" fill="currentColor"/>
+    </g>
+  </svg>
+`, tn = _e`
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="12px"
+    height="12px"
+    viewBox="0 0 24 24"
+    fill="none"
+    aria-hidden
+  >
+    <path
+      d="M3.44444 23C2.77222 23 2.19676 22.7606 1.71806 22.2819C1.23935 21.8032 1 21.2278 1 20.5556V3.44444C1 2.77222 1.23935 2.19676 1.71806 1.71806C2.19676 1.23935 2.77222 1 3.44444 1H10.7778C11.1241 1 11.4144 1.11713 11.6486 1.35139C11.8829 1.58565 12 1.87593 12 2.22222C12 2.56852 11.8829 2.8588 11.6486 3.09306C11.4144 3.32731 11.1241 3.44444 10.7778 3.44444H3.44444V20.5556H20.5556V13.2222C20.5556 12.8759 20.6727 12.5856 20.9069 12.3514C21.1412 12.1171 21.4315 12 21.7778 12C22.1241 12 22.4144 12.1171 22.6486 12.3514C22.8829 12.5856 23 12.8759 23 13.2222V20.5556C23 21.2278 22.7606 21.8032 22.2819 22.2819C21.8032 22.7606 21.2278 23 20.5556 23H3.44444ZM20.5556 5.15556L10.0444 15.6667C9.82037 15.8907 9.53518 16.0028 9.18889 16.0028C8.84259 16.0028 8.55741 15.8907 8.33333 15.6667C8.10926 15.4426 7.99722 15.1574 7.99722 14.8111C7.99722 14.4648 8.10926 14.1796 8.33333 13.9556L18.8444 3.44444H15.6667C15.3204 3.44444 15.0301 3.32731 14.7958 3.09306C14.5616 2.8588 14.4444 2.56852 14.4444 2.22222C14.4444 1.87593 14.5616 1.58565 14.7958 1.35139C15.0301 1.11713 15.3204 1 15.6667 1H21.7778C22.1241 1 22.4144 1.11713 22.6486 1.35139C22.8829 1.58565 23 1.87593 23 2.22222V8.33333C23 8.67963 22.8829 8.96991 22.6486 9.20417C22.4144 9.43843 22.1241 9.55556 21.7778 9.55556C21.4315 9.55556 21.1412 9.43843 20.9069 9.20417C20.6727 8.96991 20.5556 8.67963 20.5556 8.33333V5.15556Z"
+      fill="currentColor"
+    />
+  </svg>
+`, $ = class extends N {
+	constructor() {
+		super(...arguments), this.state = "empty", this.searchTerm = "", this.hasNextPage = !1, this.pageSize = 10, this.results = [], this.handleRequestNextPage = () => {
+			this.dispatchEvent(new CustomEvent("onRequestNextPage", {
+				bubbles: !0,
+				composed: !0
+			}));
+		}, this.handleLinkClicked = (e) => () => {
+			this.dispatchEvent(new CustomEvent("onLinkClicked", {
+				bubbles: !0,
+				composed: !0,
+				detail: e
+			}));
+		}, this.mockResultData = () => {
+			this.results = Array.from({ length: this.pageSize }).map((e, t) => ({
+				url: `url ${t}`,
+				excerpt: `excerpt ${t}`,
+				title: `title ${t}`
+			}));
+		};
+	}
+	connectedCallback() {
+		super.connectedCallback(), this.state === "loading" && this.mockResultData();
+	}
+	attributeChangedCallback(e, t, n) {
+		super.attributeChangedCallback(e, t, n), e === "state" && (n === "loading" && this.mockResultData(), this.state = n);
+	}
+	render() {
+		return this.state === "empty" ? O`
+        <div class="root-wrapper alert-wrapper">
+          <p>No results for '${this.searchTerm}'</p>
+        </div>
+      ` : this.state === "error" ? O`
+        <div class="root-wrapper alert-wrapper">
+          <p>We could not load the results</p>
+          <p>Try again later</p>
+        </div>
+      ` : O`
+      <div class="content-wrapper">
+        <div class="root-wrapper" loading="${this.state === "loading"}">
+          <ul class="article-list">
+            ${this.results.map((e) => O`
+                <li @click=${this.handleLinkClicked(e)}>
+                  <a
+                    href="${e.url}"
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    loading="${this.state === "loading"}"
+                  >
+                    <div class="article-title-wrapper ${this.state}">
+                      <p>${e.title}</p>
+                      ${tn}
+                    </div>
+                    <p class="article-description ${this.state}">
+                      ${Yt(e.excerpt)}
+                    </p>
+                  </a>
+                </li>
+              `)}
+          </ul>
+
+          ${this.hasNextPage && this.state !== "loading" ? O`
+                <button
+                  class="pagination-btn"
+                  @click=${this.handleRequestNextPage}
+                >
+                  See more ${this.results.length} results ${en}
+                </button>
+              ` : O``}
+        </div>
+      </div>
+    `;
+	}
+};
+$.styles = [
+	Xt,
+	Qt,
+	$t,
+	Zt
+], I([P()], $.prototype, "state", 2), I([P()], $.prototype, "searchTerm", 2), I([P({ converter: (e) => e === "true" })], $.prototype, "hasNextPage", 2), I([P()], $.prototype, "pageSize", 2), I([P({ type: Array })], $.prototype, "results", 2), L("appcues-search-results", $);
+//#endregion