@faith-tools/bible-sdk 0.0.0-stage → 0.6.0

package/dist/index.js

@@ -0,0 +1,946 @@
+import { a as e, c as t, i as n, l as r, n as i, o as a, r as o, s } from "./providers-D_4UrThl.js";
+import { OSIS_BOOK_CODES as c, OSIS_BOOK_NAMES as l, autocompletePassage as u, formatPassageForDisplay as d, getChapterCount as f, getVerseCount as p, parsePassage as m, parseToResolverUrl as h, resolveBookAlias as g, tryParsePassage as _ } from "grab-bcv";
+import { Effect as v, Exit as y, Scope as b } from "effect";
+// src/dom-runtime.ts
+var x = (e, t, n, r) => v.acquireRelease(v.sync(() => e.addEventListener(t, n, r)), () => v.sync(() => e.removeEventListener(t, n, r))), S = v.callback((e) => {
+	let t = requestAnimationFrame(() => e(v.void));
+	return v.sync(() => cancelAnimationFrame(t));
+}), C = (e, t) => v.callback((n) => {
+	let r = () => n(v.void);
+	for (let n of t) e.addEventListener(n, r);
+	return v.sync(() => {
+		for (let n of t) e.removeEventListener(n, r);
+	});
+}), w = "si-passage", T = "bible-sk-passage", E = {
+	"font-sans": "\"Inter\",sans-serif",
+	"font-serif": "\"Source Serif 4\",serif",
+	"font-mono": "ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace",
+	"color-black": "#000",
+	"color-white": "#fff",
+	spacing: ".25rem",
+	"container-sm": "24rem",
+	"container-md": "28rem",
+	"container-lg": "32rem",
+	"text-xs": ".75rem",
+	"text-xs--line-height": "calc(1/.75)",
+	"text-sm": ".875rem",
+	"text-sm--line-height": "calc(1.25/.875)",
+	"text-base": "1rem",
+	"text-base--line-height": "calc(1.5/1)",
+	"text-lg": "1.125rem",
+	"text-lg--line-height": "calc(1.75/1.125)",
+	"text-xl": "1.25rem",
+	"text-xl--line-height": "calc(1.75/1.25)",
+	"text-2xl": "1.5rem",
+	"text-2xl--line-height": "calc(2/1.5)",
+	"text-3xl": "1.875rem",
+	"text-3xl--line-height": "calc(2.25/1.875)",
+	"font-weight-normal": "400",
+	"font-weight-medium": "500",
+	"font-weight-bold": "700",
+	"tracking-widest": ".1em",
+	"leading-tight": "1.25",
+	"leading-snug": "1.375",
+	"leading-normal": "1.5",
+	"radius-2xl": "1rem",
+	"radius-3xl": "1.5rem",
+	"ease-out": "cubic-bezier(0,0,.2,1)",
+	"animate-spin": "spin 1s linear infinite",
+	"animate-pulse": "pulse 2s cubic-bezier(.4,0,.6,1)infinite",
+	"blur-sm": "8px",
+	"default-transition-duration": ".15s",
+	"default-transition-timing-function": "cubic-bezier(.4,0,.2,1)"
+}, D = Object.keys(E), O = `
+/* flow-root keeps the passage's margins inside, so its layout is identical during and after the grow.
+   The host takes bible.css's tokens from the page when it sets them, and the wrapper uses them. */
+:host {
+  display: flow-root;
+  position: relative;
+  ${D.map((e) => `--yv-${e}: inherit; --si-${e}: var(--yv-${e}, ${E[e]});`).join("\n  ")}
+}
+.scripture-root {
+  all: initial;
+  display: block;
+  color: inherit;
+  ${D.map((e) => `--yv-${e}: var(--si-${e});`).join("\n  ")}
+}
+.scripture-root { --scripture-muted: #666; --scripture-red: #a52424; }
+.scripture-root[data-theme="dark"] { --scripture-muted: #aaa; --scripture-red: #ff9090; }
+.scripture-bible {
+  font: var(--scripture-font-size, 20px)/var(--scripture-line-height, 1.625) var(--scripture-font-family, Georgia, serif);
+  max-width: var(--scripture-max-width, 32rem);
+  overflow-wrap: break-word;
+}
+.scripture-bible .scripture-verse-number, .fetch-bible sup[data-v] { font: 0.65em/1 system-ui, sans-serif; color: var(--scripture-muted); }
+.fetch-bible sup[data-v] { padding-inline-end: 0.3em; }
+.scripture-bible.fetch-bible .fb-wj { color: var(--scripture-red); }
+.scripture-bible .scripture-heading { display: block; margin: 1em 0 0.5em; font: 600 0.85em/1.5 system-ui, sans-serif; }
+.scripture-bible > .scripture-heading:first-child { margin-top: 0; }
+.scripture-bible .scripture-jesus { color: var(--scripture-red); }
+.scripture-bible .scripture-poetry { display: block; padding-inline-start: calc(var(--indent) * 1em); }
+.scripture-bible .scripture-subtitle { margin: 0 0 0.5em; font-style: italic; }
+:host([verse-numbers="hide"]) .scripture-verse-number { display: none; }
+:host([red-letter="off"]) .scripture-jesus { color: inherit; }
+:host([headings="hide"]) .scripture-heading { display: none; }
+:host([verse-numbers="hide"]) .fetch-bible sup[data-v] { display: none; }
+:host([red-letter="off"]) .fetch-bible .fb-wj { color: inherit; }
+:host([headings="hide"]) .fetch-bible :is(.fb-ms, .fb-ms1, .fb-ms2, .fb-ms3, .fb-ms4, .fb-mr, .fb-s, .fb-s1, .fb-s2, .fb-s3, .fb-s4, .fb-sr, .fb-r, .fb-sp, .fb-qa) { display: none; }
+/* Typography comes from --scripture-* properties, which pages set like any CSS. The fallbacks
+   are bible.css's own values, except the font: Untitled Serif is YouVersion's Bible typeface,
+   but bible.css defaults to Source Serif 4. */
+[data-slot="yv-bible-renderer"] {
+  --yv-reader-font-family: var(--scripture-font-family, "Untitled Serif", "Source Serif 4", serif);
+  --yv-reader-font-size: var(--scripture-font-size, 20px);
+  --yv-reader-line-height: var(--scripture-line-height, 1.625);
+  --yv-reader-max-width: var(--scripture-max-width, 65ch);
+  /* bible.css caps each paragraph at this width. */
+  --yv-container-lg: var(--scripture-max-width, 32rem);
+}
+/* Content switches. CSS alone applies them, so toggling one never refetches or re-renders. */
+:host([verse-numbers="hide"]) .yv-vlbl { display: none; }
+:host([red-letter="off"]) .wj { color: inherit; }
+/* .yv-h marks editorial headings. Psalm titles (.d) are Scripture, so they stay. */
+:host([headings="hide"]) .yv-h { display: none; }
+/* Translators' added words read as italic, as in print Bibles. bible.css also bolds them,
+   which stresses the words the original text does not contain. */
+[data-slot="yv-bible-renderer"] .add { font-weight: inherit; }
+/* Page frameworks (Sensible UI, Pico) draw their own spinner on [aria-busy]; this element has one.
+   !important in a shadow root beats the page's rules for the host. */
+:host([aria-busy])::before, :host([aria-busy])::after { content: none !important; }
+.scripture-loading { display: flex; padding: 0.75rem 0; opacity: 0.5; }
+.scripture-stage { position: absolute; inset: 0 0 auto; height: 0; overflow: hidden; visibility: hidden; }
+.scripture-loading > svg { animation: scripture-spin 0.8s linear infinite; }
+@keyframes scripture-spin { to { transform: rotate(360deg); } }
+[role="alert"] { margin: 0; opacity: 0.7; font-family: var(--yv-font-sans, system-ui, sans-serif); }
+/* Every layout uses the same citation; only its place changes. */
+.scripture-citation {
+  all: unset;
+  display: block;
+  /* Match the width bible.css gives the text. */
+  max-width: var(--scripture-max-width, 32rem);
+  margin-block-start: 1rem;
+  font: calc(var(--scripture-font-size, 20px) * 0.8)/1.5 var(--yv-font-sans, system-ui, sans-serif);
+  color: var(--yv-foreground);
+}
+.scripture-root > .scripture-citation:first-child { margin-block: 0 1rem; }
+.scripture-citation > .scripture-version { color: var(--yv-muted-foreground, var(--scripture-muted)); }
+/* The attribution always comes after the text, right under a citation when one follows it. */
+.scripture-attribution {
+  all: unset;
+  display: block;
+  max-width: var(--scripture-max-width, 32rem);
+  margin-block-start: 1rem;
+  font: 0.75rem/1.5 var(--yv-font-sans, system-ui, sans-serif);
+  color: var(--yv-muted-foreground, var(--scripture-muted));
+}
+.scripture-root .scripture-attribution a { color: inherit; text-decoration: none; text-underline-offset: 0.15em; }
+.scripture-root .scripture-attribution a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
+@media (hover: hover) and (pointer: fine) {
+  .scripture-root .scripture-attribution a:hover { text-decoration: underline; }
+}
+.scripture-citation + .scripture-attribution { margin-block-start: 0; }
+.scripture-quote {
+  all: unset;
+  display: block;
+  padding-inline-start: 1rem;
+  border-inline-start: 2px solid color-mix(in srgb, currentColor 18%, transparent);
+}
+@media (prefers-reduced-motion: reduce) { .scripture-loading > svg { animation-duration: 2.4s; } }`, k = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M21 12a9 9 0 1 1-6.219-8.56\"/></svg>", A = matchMedia("(prefers-reduced-motion: reduce)"), j = [
+	"heading",
+	"citation",
+	"quote",
+	"none"
+], M = class extends HTMLElement {
+	static observedAttributes = [
+		"provider",
+		"bible-version-id",
+		"yvp-public-app-key",
+		"yvp-api-host",
+		"yvp-bible-version-id",
+		"passage-id",
+		"theme",
+		"reference",
+		"direction"
+	];
+	providerOverride;
+	get bibleProvider() {
+		return this.providerOverride;
+	}
+	set bibleProvider(e) {
+		this.providerOverride = e, this.isConnected && this.scheduleLoad();
+	}
+	generation = 0;
+	loaded = null;
+	scheduled = !1;
+	cancelLoad;
+	cancelTheme;
+	cancelAnimation;
+	systemDark = matchMedia("(prefers-color-scheme: dark)");
+	onSystemTheme = () => this.applyTheme();
+	root = document.createElement("div");
+	constructor() {
+		super();
+		let e = this.attachShadow({ mode: "open" }), t = document.createElement("style");
+		t.textContent = O, this.root.className = "scripture-root", e.append(t, this.root);
+	}
+	connectedCallback() {
+		this.cancelTheme = v.runCallback(x(this.systemDark, "change", this.onSystemTheme).pipe(v.andThen(v.never), v.scoped)), this.root.childElementCount || this.showLoading(), this.scheduleLoad();
+	}
+	disconnectedCallback() {
+		this.cancelTheme?.(), this.cancelAnimation?.(), this.generation += 1, this.cancelLoad?.();
+	}
+	attributeChangedCallback(e, t, n) {
+		t !== n && this.isConnected && (e === "theme" ? this.applyTheme() : e === "reference" || e === "direction" ? this.relayout() : this.scheduleLoad());
+	}
+	scheduleLoad() {
+		this.generation += 1, this.cancelLoad?.(), this.cancelAnimation?.(), this.scheduled || (this.scheduled = !0, queueMicrotask(() => {
+			this.scheduled = !1, this.isConnected && (this.cancelLoad = v.runCallback(this.load(this.generation).pipe(v.catch((e) => v.sync(() => {
+				this.showError("Unable to display Bible text. Check the provider, version, and passage."), this.dispatchEvent(new CustomEvent("scripture-error", { detail: e }));
+			})), v.scoped)));
+		}));
+	}
+	applyTheme() {
+		let e = this.getAttribute("theme"), t = e === "dark" || e === "auto" && this.systemDark.matches ? "dark" : "light";
+		this.root.dataset.theme = t;
+		for (let e of this.root.querySelectorAll("[data-yv-sdk]")) e.setAttribute("data-yv-theme", t);
+	}
+	get referenceLayout() {
+		let e = this.getAttribute("reference");
+		return e && j.includes(e) ? e : "heading";
+	}
+	relayout() {
+		this.loaded && !this.getAttribute("aria-busy") && (this.root.replaceChildren(...this.compose(this.loaded.display, this.loaded.passageId)), this.applyTheme());
+	}
+	compose(e, t) {
+		let n = this.ownerDocument, r = (e, t, r, i) => {
+			let a = n.createElement(e);
+			return a.className = t, a.setAttribute("part", r), i !== void 0 && (a.textContent = i), a;
+		}, i = _(t), a = i.ok ? d(i.value) : t, o = n.createElement("section");
+		o.setAttribute("part", "text");
+		for (let [t, n] of Object.entries(e.containerAttributes ?? {})) o.setAttribute(t, n);
+		let s = this.getAttribute("direction");
+		o.setAttribute("dir", s === "ltr" || s === "rtl" ? s : e.direction ?? "auto"), o.innerHTML = e.html;
+		let c = r("p", "scripture-citation", "citation");
+		e.yvpBibleVersion && c.setAttribute("data-yv-sdk", ""), c.append(a, " ", r("span", "scripture-version", "version", e.version.abbreviation));
+		let l = r("p", "scripture-attribution", "attribution");
+		e.yvpBibleVersion && l.setAttribute("data-yv-sdk", "");
+		let u = n.createElement("bdi");
+		switch (u.setAttribute("dir", "auto"), e.attributionHtml === void 0 ? u.textContent = e.attribution : u.innerHTML = e.attributionHtml, l.append(u), this.referenceLayout) {
+			case "heading": return [
+				c,
+				o,
+				l
+			];
+			case "citation": return [
+				o,
+				c,
+				l
+			];
+			case "quote": {
+				let e = r("blockquote", "scripture-quote", "quote");
+				return e.append(o, c, l), [e];
+			}
+			case "none": return [o, l];
+		}
+	}
+	showLoading() {
+		this.setAttribute("aria-busy", "true");
+		let e = this.ownerDocument.createElement("div");
+		e.className = "scripture-loading", e.setAttribute("part", "loader"), e.setAttribute("role", "status"), e.setAttribute("aria-label", "Loading Bible text"), e.innerHTML = k, this.root.replaceChildren(e);
+	}
+	showError(e) {
+		let t = this.ownerDocument.createElement("p");
+		t.setAttribute("role", "alert"), t.setAttribute("part", "error"), t.textContent = e, this.removeAttribute("aria-busy"), this.root.replaceChildren(t);
+	}
+	load = v.fn("scripture.passage.load")(function* (e) {
+		this.loaded = null;
+		let n = this.getAttribute("passage-id")?.trim();
+		if (!n) {
+			this.showError("Set passage-id to display Bible text.");
+			return;
+		}
+		this.root.querySelector(":scope > .scripture-loading") || this.showLoading();
+		let i = !1;
+		yield* S.pipe(v.andThen(v.sync(() => {
+			i = !0;
+		})), v.forkScoped);
+		let a = yield* r({
+			...s,
+			provider: this.getAttribute("provider") || this.providerOverride || s.provider,
+			yvpPublicAppKey: this.getAttribute("yvp-public-app-key")?.trim() || s.yvpPublicAppKey,
+			yvpApiHost: this.getAttribute("yvp-api-host") || s.yvpApiHost
+		}), c = a === t(s) ? s.bibleVersionId ?? (a.id === "youversion" ? s.yvpBibleVersionId?.toString() : void 0) : void 0, l = this.getAttribute("bible-version-id") || (a.id === "youversion" ? this.getAttribute("yvp-bible-version-id") : void 0) || c || a.defaultVersionId, u = yield* o(a, l, n);
+		if (!this.isConnected || e !== this.generation || (yield* this.installStylesheets(u), !this.isConnected || e !== this.generation)) return;
+		let d = this.compose(u, n), f = this.ownerDocument.createElement("div");
+		if (f.className = "scripture-stage", f.setAttribute("aria-hidden", "true"), f.append(...d), this.root.append(f), yield* v.addFinalizer(() => v.sync(() => f.remove())), f.offsetHeight, yield* v.promise(() => this.ownerDocument.fonts.ready).pipe(v.timeoutOrElse({
+			duration: "3 seconds",
+			orElse: () => v.void
+		})), !this.isConnected || e !== this.generation) return;
+		let p = this.offsetHeight;
+		this.root.replaceChildren(...d), this.loaded = {
+			display: u,
+			passageId: n
+		}, this.applyTheme(), i && this.growFrom(p), this.removeAttribute("aria-busy"), this.dispatchEvent(new CustomEvent("scripture-load", { detail: {
+			provider: a.id,
+			bibleVersionId: l,
+			passageId: n,
+			bibleVersion: u.version,
+			...u.yvpBibleVersion ? {
+				yvpBibleVersionId: Number(l),
+				yvpBibleVersion: u.yvpBibleVersion
+			} : {}
+		} }));
+	});
+	installStylesheets(e) {
+		return v.forEach(e.stylesheets ?? [], ({ kind: e, href: t }) => v.suspend(() => {
+			let n = e === "font" ? this.ownerDocument.head : this.shadowRoot, r = n.querySelectorAll("link[rel=\"stylesheet\"]"), i = Array.from(r).find((e) => e.href === t);
+			if (!i) i = this.ownerDocument.createElement("link"), i.rel = "stylesheet", i.href = t, n.append(i);
+			else if (i.sheet || i.dataset.scriptureLoaded) return v.void;
+			let a = i;
+			return C(a, ["load", "error"]).pipe(v.tap(() => v.sync(() => {
+				a.dataset.scriptureLoaded = "";
+			})), v.timeoutOrElse({
+				duration: "5 seconds",
+				orElse: () => v.void
+			}));
+		}), {
+			concurrency: "unbounded",
+			discard: !0
+		});
+	}
+	growFrom(e) {
+		let t = this.offsetHeight, n = "cubic-bezier(0.23, 1, 0.32, 1)", r = Array.from(this.root.children), i = this;
+		this.cancelAnimation = v.runCallback(v.gen(function* () {
+			let a = yield* v.acquireRelease(v.sync(() => {
+				if (A.matches) return r.map((e) => e.animate({ opacity: [0, 1] }, {
+					duration: 200,
+					easing: n
+				}));
+				let a = [];
+				return e !== t && (i.style.overflow = "hidden", a.push(i.animate({ height: [`${e}px`, `${t}px`] }, {
+					duration: 280,
+					easing: n
+				}))), a.push(...r.map((e) => e.animate({
+					opacity: [0, 1],
+					filter: ["blur(4px)", "blur(0)"]
+				}, {
+					duration: 280,
+					easing: n
+				}))), a;
+			}), (e) => v.sync(() => {
+				for (let t of e) t.cancel();
+				i.style.overflow = "";
+			}));
+			yield* v.forEach(a, (e) => v.tryPromise(() => e.finished).pipe(v.ignore), {
+				concurrency: "unbounded",
+				discard: !0
+			});
+		}).pipe(v.scoped));
+	}
+};
+function N(e = {}) {
+	Object.assign(s, e), customElements.get("si-passage") || customElements.define(w, M), customElements.get("bible-sk-passage") || customElements.define(T, class extends M {});
+}
+// src/card.css?inline
+var P = ":host{all:initial;--scripture-font-size:17px;--scripture-line-height:1.6;pointer-events:none;z-index:2147483000;position:fixed;inset:0}.card{--bg:#fff;--fg:#1c1917;--muted:#78716c;--border:#1c19171a;--accent:#b91c1c;--hover:#f0eeed;--yv-font-sans:ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", sans-serif;box-sizing:border-box;width:min(380px,100vw - 16px);max-height:min(440px, 70vh, var(--space,100vh));pointer-events:auto;background:var(--bg);color:var(--fg);border:1px solid var(--border);font:14px/1.4 var(--yv-font-sans);--ease-out:cubic-bezier(.23, 1, .32, 1);opacity:0;transform:translateY(var(--enter-shift,4px)) scale(.97);transform-origin:var(--origin-x,50%) var(--origin-y,100%);transition:opacity .18s var(--ease-out), transform .18s var(--ease-out);border-radius:14px;outline:none;flex-direction:column;display:flex;position:absolute;box-shadow:0 1px 2px #0000000f,0 12px 32px -8px #00000038}.card[data-state=open]{opacity:1;transform:none}.card[data-state=closing]{transition-duration:.14s}@media (prefers-color-scheme:dark){.card{--bg:#1f1d1c;--fg:#f5f5f4;--muted:#a8a29e;--border:#ffffff1a;--accent:#f87171;--hover:#2c2a29}}@media (prefers-reduced-motion:reduce){.card{transition:opacity .12s linear;transform:none}}.close{all:unset;z-index:1;width:28px;height:28px;color:var(--muted);cursor:pointer;transition:background-color .15s ease, color .15s ease, transform .16s var(--ease-out);border-radius:8px;place-items:center;display:grid;position:absolute;top:12px;right:12px}@media (hover:hover) and (pointer:fine){.close:hover{background:var(--hover);color:var(--fg)}}.close:active{transform:scale(.95)}.close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.body{overscroll-behavior:contain;padding:16px;overflow-y:auto}.body>:not([reference=citation],[reference=quote],[reference=none])::part(citation){padding-inline-end:36px}.body>:is([reference=citation],[reference=none])::part(text),.body>[reference=quote]::part(quote),.body>*::part(error){margin-block-start:28px}", F = 8, I = 8;
+function L({ reference: e, ...n }) {
+	N();
+	let r = t(n), i = n.bibleVersionId || (r.id === "youversion" && n.yvpBibleVersionId ? String(n.yvpBibleVersionId) : r.defaultVersionId), a = document.createElement("scripture-card"), o = a.attachShadow({ mode: "open" }), s = document.createElement("style");
+	s.textContent = P, o.append(s);
+	let c = null, l = null, u = !1, f, p, h = b.makeUnsafe();
+	function g() {
+		if (!c || !l) return;
+		let e = l.getBoundingClientRect();
+		c.style.removeProperty("--space");
+		let t = c.offsetWidth, n = parseFloat(getComputedStyle(c).maxHeight), r = e.top - F - I, i = innerHeight - e.bottom - F - I, a = n <= r || n > i && r > i;
+		c.style.setProperty("--space", `${Math.max(a ? r : i, 120)}px`);
+		let o = Math.min(Math.max(I, e.left + e.width / 2 - t / 2), innerWidth - I - t);
+		c.style.top = a ? "" : `${e.bottom + F}px`, c.style.bottom = a ? `${innerHeight - e.top + F}px` : "", c.style.left = `${o}px`, c.style.setProperty("--origin-x", `${e.left + e.width / 2 - o}px`), c.style.setProperty("--origin-y", a ? "100%" : "0%"), c.style.setProperty("--enter-shift", a ? "4px" : "-4px");
+	}
+	function _(e = !1) {
+		f?.();
+		let t = c;
+		if (!t) return;
+		let n = l;
+		c = null, l = null, A(), e ? t.remove() : (t.dataset.state = "closing", v.runSync(C(t, ["transitionend"]).pipe(v.timeoutOrElse({
+			duration: "250 millis",
+			orElse: () => v.void
+		}), v.ensuring(v.sync(() => t.remove())), v.forkIn(h))), n && o.activeElement && n.focus());
+	}
+	function T(t, n = !1) {
+		let s = c !== null;
+		_(s), u = n;
+		let p = t.dataset.passage, y = d(m(p));
+		a.isConnected || document.body.append(a), c = document.createElement("div"), c.className = "card", s && (c.dataset.state = "open"), c.tabIndex = -1, c.setAttribute("role", "dialog"), c.setAttribute("aria-label", y), c.innerHTML = "\n      <button class=\"close\" type=\"button\" aria-label=\"Close\">\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" aria-hidden=\"true\">\n          <path d=\"M3 3l8 8M11 3l-8 8\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" />\n        </svg>\n      </button>\n      <div class=\"body\" aria-live=\"polite\"></div>";
+		let b = document.createElement(w);
+		if (b.bibleProvider = r, b.setAttribute("bible-version-id", i), b.setAttribute("passage-id", p), b.setAttribute("theme", "auto"), b.setAttribute("reference", e), b.addEventListener("scripture-error", (e) => console.error("[scripture-inline]", e.detail)), c.querySelector(".body").append(b), c.querySelector(".close").addEventListener("click", () => _()), c.addEventListener("pointerenter", () => f?.()), c.addEventListener("pointerleave", M), o.append(c), l = t, g(), k(), n || c.focus({ preventScroll: !0 }), !s) {
+			c.getBoundingClientRect();
+			let e = c;
+			v.runSync(S.pipe(v.andThen(v.sync(() => {
+				c === e && (e.dataset.state = "open");
+			})), v.forkIn(h)));
+		}
+	}
+	let E = (e) => e.key === "Escape" && _(), D = (e) => {
+		let t = e.composedPath();
+		c && !t.includes(c) && !(l && t.includes(l)) && _();
+	}, O = () => v.runSync(S.pipe(v.andThen(v.sync(g)), v.forkIn(h)));
+	function k() {
+		p = v.runCallback(v.gen(function* () {
+			yield* x(document, "keydown", E), yield* x(document, "pointerdown", D, !0), yield* x(window, "scroll", O, {
+				capture: !0,
+				passive: !0
+			}), yield* x(window, "resize", O, { passive: !0 }), yield* v.never;
+		}).pipe(v.scoped));
+	}
+	function A() {
+		p?.();
+	}
+	function j(e) {
+		f?.(), l !== e && (!c || u) && (f = v.runCallback(v.sleep(c ? 150 : 350).pipe(v.andThen(v.sync(() => T(e, !0))), v.withSpan("scripture.card.hover"))));
+	}
+	function M(e) {
+		e && e.pointerType !== "mouse" || (f?.(), c && u && (f = v.runCallback(v.sleep(250).pipe(v.andThen(v.sync(() => _())), v.withSpan("scripture.card.unhover")))));
+	}
+	return {
+		toggle(e) {
+			l === e && u ? (f?.(), u = !1, c.focus({ preventScroll: !0 })) : l === e ? _() : T(e);
+		},
+		hover: j,
+		unhover: M,
+		close: _,
+		closeIfDetached() {
+			l && !l.isConnected && _(!0);
+		},
+		destroy() {
+			_(!0), v.runSync(b.close(h, y.void)), a.remove();
+		}
+	};
+}
+// src/find.ts
+var ee = /(?<![\w:.])(?:[1-3]\s?)?[A-Za-z]{2,}\.?(?:\s+of\s+[A-Za-z]+)?\s+\d{1,3}(?:[:.]\d{1,3})?(?:\s?[-\u2010-\u2015]\s?\d{1,3}(?:[:.]\d{1,3})?)?(?![\w:])/g;
+function R(e) {
+	let t = [], n = new RegExp(ee), r;
+	for (; r = n.exec(e);) {
+		let e = _(r[0]);
+		e.ok ? t.push({
+			start: r.index,
+			end: r.index + r[0].length,
+			text: r[0],
+			passage: e.value
+		}) : n.lastIndex = r.index + 1;
+	}
+	return t;
+}
+// src/scan.ts
+var z = "scripture-inline-ref", B = "a,button,script,style,noscript,template,textarea,input,select,option,code,pre,kbd,samp,svg,math,[contenteditable],si-passage,si-passage-input,bible-sk-passage,bible-sk-passage-input,[data-scripture-inline-ignore]";
+function V(e) {
+	let t = e.ownerDocument ?? e, n = t.createTreeWalker(e, NodeFilter.SHOW_TEXT, { acceptNode: (e) => e.parentElement && !e.parentElement.closest(B) && /\d/.test(e.nodeValue ?? "") ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT }), r = [];
+	for (; n.nextNode();) r.push(n.currentNode);
+	let i = [];
+	for (let e of r) {
+		let n = e.nodeValue ?? "", r = R(n);
+		if (r.length === 0) continue;
+		let a = t.createDocumentFragment(), o = 0;
+		for (let e of r) {
+			a.append(n.slice(o, e.start));
+			let r = t.createElement("a");
+			r.className = z, r.href = h("https://route.bible", e.passage.canonical), r.target = "_blank", r.rel = "noopener", r.dataset.passage = e.passage.canonical, r.textContent = e.text, a.append(r), i.push(r), o = e.end;
+		}
+		a.append(n.slice(o)), e.replaceWith(a);
+	}
+	return i;
+}
+function H(e) {
+	for (let t of e) {
+		let e = t.parentNode;
+		e && (t.replaceWith(t.textContent ?? ""), e.normalize());
+	}
+}
+// src/passage-input.ts
+var U = "si-passage-input", W = "bible-sk-passage-input", te = "\n:host { display: block; position: relative; }\n.root { all: initial; display: block; position: relative; color: inherit; font: 0.875rem/1.5 var(--font-sans, system-ui, sans-serif); }\ninput {\n  box-sizing: border-box;\n  width: 100%;\n  height: 2.25rem;\n  margin: 0;\n  padding: 0.25rem 0.75rem;\n  font: inherit;\n  color: inherit;\n  background: none;\n  border: 1px solid var(--input, color-mix(in srgb, currentColor 20%, transparent));\n  border-radius: calc(var(--radius, 0.625rem) - 2px);\n  box-shadow: 0 1px 2px #0000000d;\n  outline: none;\n  transition: color 0.15s, box-shadow 0.15s;\n}\n/* iOS Safari zooms the page into a focused field whose text is under 16px. */\n@media (pointer: coarse) { input { font-size: 16px; } }\ninput:focus-visible {\n  border-color: var(--ring, Highlight);\n  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring, Highlight) 50%, transparent);\n}\ninput[aria-invalid=\"true\"] { border-color: var(--destructive, #dc2626); }\ninput:disabled { cursor: not-allowed; opacity: 0.5; }\n[role=\"listbox\"] {\n  position: absolute;\n  inset: calc(100% + 4px) 0 auto;\n  z-index: 50;\n  box-sizing: border-box;\n  max-height: 16rem;\n  margin: 0;\n  padding: 4px;\n  overflow-y: auto;\n  list-style: none;\n  color: var(--popover-foreground, inherit);\n  background: var(--popover, Canvas);\n  border: 1px solid var(--border, color-mix(in srgb, currentColor 15%, transparent));\n  border-radius: var(--radius, 0.625rem);\n  box-shadow: 0 8px 24px -8px rgb(0 0 0 / 0.2);\n}\n[role=\"listbox\"][hidden] { display: none; }\n[role=\"option\"] > .si-passage-count {\n  /* The label wraps before the count does. */\n  flex-shrink: 0;\n  white-space: nowrap;\n  margin-inline-start: auto;\n  font-size: 0.75rem;\n  color: var(--muted-foreground, color-mix(in srgb, currentColor 60%, transparent));\n}\n[role=\"option\"] {\n  /* Baseline alignment keeps the smaller count on the label's line. */\n  display: flex;\n  align-items: baseline;\n  gap: 1rem;\n  padding: 0.375rem 0.5rem;\n  border-radius: calc(var(--radius, 0.625rem) - 4px);\n  cursor: default;\n}\n[role=\"option\"][aria-selected=\"true\"] {\n  color: var(--accent-foreground, inherit);\n  background: var(--accent, color-mix(in srgb, currentColor 10%, transparent));\n}\n[role=\"option\"][aria-disabled=\"true\"] {\n  color: var(--muted-foreground, color-mix(in srgb, currentColor 60%, transparent));\n}\n@media (hover: hover) and (pointer: fine) {\n  [role=\"option\"]:not([aria-disabled]):hover {\n    background: var(--accent, color-mix(in srgb, currentColor 10%, transparent));\n  }\n}", ne = 0, G = (e, t) => `${e} ${t}${e === 1 ? "" : "s"}`, re = [...c].sort((e, t) => l[e].localeCompare(l[t], void 0, { numeric: !0 }));
+function K(e) {
+	return (e === "alphabetical" ? re : c).map((e) => ({
+		kind: "book",
+		canonical: e,
+		label: l[e],
+		insertText: l[e]
+	}));
+}
+function q(e) {
+	return /^\s*(\d\s*)?[^\d:;,\-–—]+$/.test(e) ? g(e) : null;
+}
+function ie(e, t, n) {
+	let r = p(e, t) ?? 0;
+	return Array.from({ length: Math.max(r - n, 0) }, (r, i) => {
+		let a = `${l[e]} ${t}:${n}-${n + i + 1}`;
+		return {
+			kind: "range",
+			canonical: `${e}.${t}.${n}-${n + i + 1}`,
+			label: a,
+			insertText: a
+		};
+	});
+}
+var ae = (e) => e.replace(/^(\d) /, "$1\xA0").replace(/ (?=[\d:-]+$)/, "\xA0");
+function oe(e, t) {
+	return Array.from({ length: p(e, t) ?? 0 }, (n, r) => {
+		let i = `${l[e]} ${t}:${r + 1}`;
+		return {
+			kind: "verse",
+			canonical: `${e}.${t}.${r + 1}`,
+			label: i,
+			insertText: i
+		};
+	});
+}
+function J(e) {
+	return Array.from({ length: f(e) }, (t, n) => {
+		let r = `${l[e]} ${n + 1}`;
+		return {
+			kind: "chapter",
+			canonical: `${e}.${n + 1}`,
+			label: r,
+			insertText: r
+		};
+	});
+}
+function se({ kind: e, canonical: t }) {
+	let [n, r] = t.split(".");
+	if (e === "book") return G(f(n), "chapter");
+	if (e === "chapter") {
+		let e = p(n, Number(r));
+		return e ? G(e, "verse") : "";
+	}
+	return "";
+}
+var Y = class extends HTMLElement {
+	static formAssociated = !0;
+	static observedAttributes = [
+		"value",
+		"placeholder",
+		"disabled",
+		"book-order"
+	];
+	internals = this.attachInternals();
+	input = document.createElement("input");
+	list = document.createElement("ul");
+	suggestions = [];
+	active = -1;
+	committed = "";
+	constructor() {
+		super();
+		let e = document.createElement("div");
+		e.className = "root";
+		let t = document.createElement("style");
+		t.textContent = te, e.append(this.input, this.list), this.attachShadow({ mode: "open" }).append(t, e), this.input.setAttribute("part", "input"), this.list.setAttribute("part", "listbox");
+		let n = `${U}-${++ne}`;
+		Object.assign(this.input, {
+			type: "text",
+			autocomplete: "off",
+			spellcheck: !1
+		}), this.input.setAttribute("role", "combobox"), this.input.setAttribute("aria-autocomplete", "list"), this.input.setAttribute("aria-expanded", "false"), this.input.setAttribute("aria-controls", `${n}-list`), this.list.id = `${n}-list`, this.list.setAttribute("role", "listbox"), this.list.hidden = !0, this.input.addEventListener("input", () => {
+			this.input.removeAttribute("aria-invalid"), this.internals.setValidity({}), this.suggest();
+		}), this.input.addEventListener("keydown", (e) => this.onKeydown(e)), this.input.addEventListener("focus", () => this.suggest()), this.input.addEventListener("click", () => this.list.hidden && this.suggest()), this.input.addEventListener("change", (e) => e.stopPropagation()), this.input.addEventListener("blur", () => {
+			this.close(), this.commit(this.input.value);
+		}), this.list.addEventListener("pointerdown", (e) => e.preventDefault());
+		let r = (e) => {
+			let t = e.target.closest("[role=option]:not([aria-disabled])");
+			t && this.accept(this.suggestions[Number(t.dataset.index)]);
+		};
+		this.list.addEventListener("click", r);
+		let i;
+		this.list.addEventListener("touchstart", (e) => i = e.touches[0], { passive: !0 }), this.list.addEventListener("touchend", (e) => {
+			let t = e.changedTouches[0];
+			!i || !t || Math.hypot(t.clientX - i.clientX, t.clientY - i.clientY) > 10 || (e.preventDefault(), r(e));
+		}), this.addEventListener("click", (e) => e.composedPath()[0] === this && this.input.focus());
+	}
+	connectedCallback() {
+		let e = this.getAttribute("aria-label") ?? [...this.internals.labels].map((e) => e.textContent?.trim()).join(" ");
+		e && this.input.setAttribute("aria-label", e);
+	}
+	attributeChangedCallback(e, t, n) {
+		e === "value" ? this.commit(n ?? "", !1) : e === "placeholder" ? this.input.placeholder = n ?? "" : e === "disabled" ? this.input.disabled = n !== null : this.list.hidden || this.suggest();
+	}
+	get value() {
+		return this.committed;
+	}
+	set value(e) {
+		this.commit(e, !1);
+	}
+	get form() {
+		return this.internals.form;
+	}
+	get validity() {
+		return this.internals.validity;
+	}
+	get validationMessage() {
+		return this.internals.validationMessage;
+	}
+	checkValidity() {
+		return this.internals.checkValidity();
+	}
+	reportValidity() {
+		return this.internals.reportValidity();
+	}
+	focus(e) {
+		this.input.focus(e);
+	}
+	formResetCallback() {
+		this.commit(this.getAttribute("value") ?? "", !1);
+	}
+	formDisabledCallback(e) {
+		this.input.disabled = e;
+	}
+	commit(e, t = !0) {
+		let n = e.trim(), r = n ? _(n) : null, i = r?.ok && (r.value.start.book !== r.value.end.book || r.value.start.chapter !== r.value.end.chapter);
+		if (r && !r.ok || i) {
+			let t = i ? "Choose verses within one chapter." : "Enter a Bible passage, such as Romans 8.";
+			this.input.value = e, this.input.setAttribute("aria-invalid", "true"), this.internals.setValidity({ customError: !0 }, t, this.input);
+			return;
+		}
+		this.input.removeAttribute("aria-invalid"), this.internals.setValidity({});
+		let a = r?.value.canonical ?? "", o = r ? d(r.value) : "";
+		this.input.value = o, a !== this.committed && (this.committed = a, this.internals.setFormValue(a || null), t && this.dispatchEvent(new CustomEvent("change", {
+			bubbles: !0,
+			detail: {
+				passageId: a,
+				label: o
+			}
+		})));
+	}
+	get bookOrder() {
+		return this.getAttribute("book-order") === "alphabetical" ? "alphabetical" : "canonical";
+	}
+	options(e) {
+		if (!e) return K(this.bookOrder);
+		let t = /^(.+?)\s*(\d+)\s*:\s*(\d+)\s*[-–—]\s*(\d*)$/.exec(e), n = t && q(t[1]);
+		if (n) {
+			let e = t[4];
+			return ie(n, Number(t[2]), Number(t[3])).filter((t) => t.canonical.split("-")[1].startsWith(e));
+		}
+		let r = /^(.+?)\s*(\d+)\s*:\s*(\d*)$/.exec(e), i = r && q(r[1]);
+		if (i) return oe(i, Number(r[2])).filter((e) => e.canonical.split(".")[2].startsWith(r[3]));
+		let a = /^(.+?)\s*(\d+)$/.exec(e), o = a && q(a[1]);
+		if (o) return J(o).filter((e) => e.canonical.split(".")[1].startsWith(a[2]));
+		let s = u(e, { limit: 200 }).filter((e) => e.kind === "book"), c = K(this.bookOrder).map((e) => e.canonical);
+		s.sort((e, t) => c.indexOf(e.canonical) - c.indexOf(t.canonical));
+		let l = q(e), f = s.find((t) => t.insertText.toLowerCase() === e.toLowerCase());
+		if (l && (f || !s.length)) return J(l);
+		if (s.length) return s;
+		let p = _(e);
+		if (!p.ok) return [];
+		let { start: m, end: h, canonical: g, rangeType: v } = p.value;
+		if (m.book !== h.book || m.chapter !== h.chapter) return [];
+		let y = d(p.value);
+		return [{
+			kind: v === "chapter" ? "chapter" : v === "single" ? "verse" : "range",
+			canonical: g,
+			label: y,
+			insertText: y
+		}];
+	}
+	suggest() {
+		if (this.suggestions = this.options(this.input.value.trim()), this.active = -1, this.list.replaceChildren(...this.suggestions.map((e, t) => {
+			let n = document.createElement("li");
+			n.id = `${this.list.id}-${t}`, n.dataset.index = String(t), n.setAttribute("role", "option"), n.setAttribute("part", "option"), n.setAttribute("aria-selected", "false"), n.textContent = ae(e.label);
+			let r = se(e);
+			if (r) {
+				let e = document.createElement("span");
+				e.className = "si-passage-count", e.setAttribute("part", "count"), e.textContent = r, n.append(e);
+			}
+			return n;
+		})), !this.suggestions.length && this.input.value.trim()) {
+			let e = document.createElement("li");
+			e.setAttribute("role", "option"), e.setAttribute("part", "option"), e.setAttribute("aria-disabled", "true"), e.textContent = "No passage matches", this.list.append(e);
+		}
+		this.list.hidden = !this.list.childElementCount, this.input.setAttribute("aria-expanded", String(!this.list.hidden)), this.input.removeAttribute("aria-activedescendant");
+	}
+	highlight(e) {
+		this.active = e;
+		for (let t of this.list.children) t.setAttribute("aria-selected", String(t.id === `${this.list.id}-${e}`));
+		let t = this.list.children[e];
+		t ? (this.input.setAttribute("aria-activedescendant", t.id), t.scrollIntoView({ block: "nearest" })) : this.input.removeAttribute("aria-activedescendant");
+	}
+	close() {
+		this.list.hidden = !0, this.input.setAttribute("aria-expanded", "false"), this.input.removeAttribute("aria-activedescendant"), this.active = -1;
+	}
+	accept(e) {
+		e.kind === "book" ? (this.input.value = `${e.insertText} `, this.suggest()) : (this.close(), this.commit(e.insertText));
+	}
+	onKeydown(e) {
+		let t = !this.list.hidden, n = this.suggestions.length;
+		switch (e.key) {
+			case "ArrowDown":
+			case "ArrowUp": {
+				if (e.preventDefault(), !t) return this.suggest();
+				let r = this.active + (e.key === "ArrowDown" ? 1 : -1);
+				this.highlight(r >= n ? -1 : r < -1 ? n - 1 : r);
+				return;
+			}
+			case "Enter": {
+				let r = _(this.input.value.trim());
+				return t && e.preventDefault(), !this.input.value.trim() && this.active < 0 ? (this.close(), this.commit("")) : this.active >= 0 ? this.accept(this.suggestions[this.active]) : r.ok || !n ? (this.close(), this.commit(this.input.value)) : this.accept(this.suggestions[0]);
+			}
+			case "Tab":
+				if (n && !e.shiftKey && this.input.value.trim()) {
+					let t = this.suggestions[Math.max(this.active, 0)];
+					t.kind === "book" && `${t.insertText} ` !== this.input.value && (e.preventDefault(), this.accept(t));
+				}
+				return;
+			case "Escape":
+				t ? (e.preventDefault(), this.close()) : this.commit(this.committed, !1);
+				return;
+		}
+	}
+};
+function ce() {
+	customElements.get("si-passage-input") || customElements.define(U, Y), customElements.get("bible-sk-passage-input") || customElements.define(W, class extends Y {});
+}
+// src/version-input.ts
+var X = "si-version-input", Z = "bible-sk-version-input", le = "\n:host { display: block; position: relative; min-width: 0; }\n.root { all: initial; display: grid; gap: 0.375rem; color: inherit; font: 0.875rem/1.5 var(--font-sans, system-ui, sans-serif); }\ninput, select, button { box-sizing: border-box; font: inherit; color: inherit; }\ninput, select {\n  width: 100%; min-width: 0; height: 2.25rem; margin: 0; padding: 0.25rem 0.75rem;\n  background: none; border: 1px solid var(--input, color-mix(in srgb, currentColor 20%, transparent));\n  border-radius: calc(var(--radius, 0.625rem) - 2px); outline: none; box-shadow: 0 1px 2px #0000000d;\n  transition: color 0.15s, box-shadow 0.15s;\n}\ninput:focus-visible, select:focus-visible {\n  border-color: var(--ring, Highlight);\n  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring, Highlight) 50%, transparent);\n}\nbutton:focus-visible { outline: 2px solid var(--ring, Highlight); outline-offset: 2px; }\ninput:disabled, select:disabled { opacity: 0.5; cursor: not-allowed; }\ninput[aria-invalid=\"true\"] { border-color: var(--destructive, #dc2626); }\n.language { position: relative; }\n.language select { appearance: none; padding-inline-end: 2.5rem; }\n.language svg { position: absolute; inset-inline-end: 0.75rem; top: 50%; transform: translateY(-50%); pointer-events: none; }\n.language select:disabled + svg { opacity: 0.5; }\n.search { position: relative; }\n[role=\"listbox\"] {\n  position: absolute; inset: calc(100% + 4px) 0 auto; z-index: 50; box-sizing: border-box;\n  max-height: 16rem; margin: 0; padding: 4px; overflow-y: auto; list-style: none;\n  color: var(--popover-foreground, inherit); background: var(--popover, Canvas);\n  border: 1px solid var(--border, color-mix(in srgb, currentColor 15%, transparent));\n  border-radius: var(--radius, 0.625rem); box-shadow: 0 8px 24px -8px #0003;\n}\n[hidden] { display: none !important; }\n[role=\"option\"] { padding: 0.5rem; border-radius: calc(var(--radius, 0.625rem) - 4px); overflow-wrap: anywhere; cursor: default; }\n[role=\"option\"][aria-selected=\"true\"] { color: var(--accent-foreground, inherit); background: var(--accent, color-mix(in srgb, currentColor 10%, transparent)); }\n.language-name { display: block; font-size: 0.75rem; opacity: 0.7; }\n.feedback { display: flex; align-items: center; gap: 0.5rem; min-height: 1.5rem; font-size: 0.75rem; }\n[role=\"status\"] { display: flex; align-items: center; gap: 0.375rem; }\nsvg { flex: none; }\n[role=\"status\"] svg { animation: spin 0.8s linear infinite; }\nbutton { border: 0; padding: 0; background: none; text-decoration: underline; cursor: pointer; }\n@keyframes spin { to { transform: rotate(360deg); } }\n@media (pointer: coarse) { input, select { font-size: 16px; } }\n@media (prefers-reduced-motion: reduce) { [role=\"status\"] svg { animation-duration: 2.4s; } }\n@media (hover: hover) and (pointer: fine) { [role=\"option\"]:hover { background: var(--accent, color-mix(in srgb, currentColor 10%, transparent)); } }\n", ue = 0, Q = (e) => `${e.title} (${e.abbreviation})`, $ = class extends HTMLElement {
+	static formAssociated = !0;
+	static observedAttributes = [
+		"value",
+		"language",
+		"provider",
+		"yvp-public-app-key",
+		"yvp-api-host",
+		"placeholder",
+		"disabled"
+	];
+	internals = this.attachInternals();
+	input = document.createElement("input");
+	language = document.createElement("select");
+	list = document.createElement("ul");
+	status = document.createElement("span");
+	retry = document.createElement("button");
+	versions = [];
+	filtered = [];
+	selected;
+	pendingValue;
+	provider;
+	override;
+	active = -1;
+	generation = 0;
+	scheduled = !1;
+	cancelLoad;
+	loading = !1;
+	failed = !1;
+	formDisabled = !1;
+	constructor() {
+		super();
+		let e = document.createElement("style");
+		e.textContent = le;
+		let t = document.createElement("div");
+		t.className = "root";
+		let n = document.createElement("div");
+		n.className = "language", n.append(this.language), n.insertAdjacentHTML("beforeend", "<svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m6 9 6 6 6-6\"/></svg>");
+		let r = document.createElement("div");
+		r.className = "search", r.append(this.input, this.list);
+		let i = document.createElement("div");
+		i.className = "feedback", i.append(this.status, this.retry), t.append(n, r, i), this.attachShadow({ mode: "open" }).append(e, t), this.input.type = "text", this.input.autocomplete = "off", this.input.spellcheck = !1, this.input.placeholder = "Search translations", this.input.setAttribute("part", "input"), this.input.setAttribute("role", "combobox"), this.input.setAttribute("aria-autocomplete", "list"), this.input.setAttribute("aria-expanded", "false"), this.list.id = `${X}-${++ue}`, this.list.setAttribute("part", "listbox"), this.list.setAttribute("role", "listbox"), this.list.setAttribute("aria-label", "Bible translations"), this.list.hidden = !0, this.input.setAttribute("aria-controls", this.list.id), this.language.setAttribute("part", "language"), this.language.setAttribute("aria-label", "Translation language"), this.status.setAttribute("role", "status"), this.status.setAttribute("part", "status"), this.retry.type = "button", this.retry.textContent = "Retry", this.retry.setAttribute("part", "retry"), this.retry.hidden = !0, this.retry.addEventListener("click", () => this.scheduleLoad()), this.input.addEventListener("input", () => this.suggest()), this.input.addEventListener("focus", () => {
+			this.input.select(), this.suggest();
+		}), this.input.addEventListener("click", () => this.list.hidden && this.suggest()), this.input.addEventListener("change", (e) => e.stopPropagation()), this.input.addEventListener("blur", () => {
+			this.input.value = this.selected ? Q(this.selected) : "", this.close();
+		}), this.language.addEventListener("change", (e) => {
+			e.stopPropagation(), this.input.focus(), this.suggest();
+		}), this.input.addEventListener("keydown", (e) => {
+			e.key === "Escape" ? (this.close(), this.input.value = this.selected ? Q(this.selected) : "") : e.key === "ArrowDown" || e.key === "ArrowUp" ? (e.preventDefault(), this.list.hidden ? this.suggest() : this.highlight(Math.max(0, Math.min(this.filtered.length - 1, this.active + (e.key === "ArrowDown" ? 1 : -1))))) : e.key === "Enter" && !this.list.hidden && (e.preventDefault(), this.filtered[this.active] && this.commit(this.filtered[this.active].id, !0));
+		}), this.list.addEventListener("pointerdown", (e) => e.preventDefault());
+		let a = (e) => {
+			let t = e.target.closest("[role=option]");
+			t && this.commit(this.filtered[Number(t.dataset.index)].id, !0);
+		};
+		this.list.addEventListener("click", a);
+		let o;
+		this.list.addEventListener("touchstart", (e) => {
+			o = e.touches[0];
+		}, { passive: !0 }), this.list.addEventListener("touchend", (e) => {
+			let t = e.changedTouches[0];
+			!o || !t || Math.hypot(t.clientX - o.clientX, t.clientY - o.clientY) > 10 || (e.preventDefault(), a(e));
+		}), this.addEventListener("click", (e) => e.composedPath()[0] === this && this.input.focus());
+	}
+	connectedCallback() {
+		this.input.setAttribute("aria-label", this.getAttribute("aria-label") || [...this.internals.labels].map((e) => e.textContent?.trim()).join(" ") || "Bible translation"), this.scheduleLoad();
+	}
+	disconnectedCallback() {
+		this.generation++, this.cancelLoad?.(), this.close();
+	}
+	attributeChangedCallback(e, t, n) {
+		t !== n && (e === "value" ? (this.pendingValue = n ?? "", this.loading || this.commit(this.pendingValue, !1)) : e === "placeholder" ? this.input.placeholder = n ?? "Search translations" : e === "disabled" ? this.updateDisabled() : e === "language" ? (this.language.value = n ?? "all", this.close()) : this.isConnected && this.scheduleLoad());
+	}
+	get value() {
+		return this.selected?.id ?? "";
+	}
+	set value(e) {
+		this.pendingValue = e, this.loading || this.commit(e, !1);
+	}
+	get bibleProvider() {
+		return this.override;
+	}
+	set bibleProvider(e) {
+		this.override = e, this.isConnected && this.scheduleLoad();
+	}
+	get form() {
+		return this.internals.form;
+	}
+	get validity() {
+		return this.internals.validity;
+	}
+	get validationMessage() {
+		return this.internals.validationMessage;
+	}
+	checkValidity() {
+		return this.internals.checkValidity();
+	}
+	reportValidity() {
+		return this.internals.reportValidity();
+	}
+	focus(e) {
+		this.input.focus(e);
+	}
+	formResetCallback() {
+		this.value = this.defaultValue(this.provider ?? t(s));
+	}
+	formDisabledCallback(e) {
+		this.formDisabled = e, this.updateDisabled();
+	}
+	defaultValue(e) {
+		let n = e === t(s) ? s.bibleVersionId ?? (e.id === "youversion" ? s.yvpBibleVersionId?.toString() : void 0) : void 0;
+		return this.getAttribute("value") ?? n ?? e.defaultVersionId;
+	}
+	updateDisabled() {
+		let e = this.loading || this.failed || this.formDisabled || this.hasAttribute("disabled");
+		this.input.disabled = e, this.language.disabled = e, this.retry.disabled = this.formDisabled || this.hasAttribute("disabled"), e && this.close();
+	}
+	close() {
+		this.list.hidden = !0, this.input.setAttribute("aria-expanded", "false"), this.input.removeAttribute("aria-activedescendant");
+	}
+	highlight(e) {
+		this.active = e, [...this.list.children].forEach((t, n) => t.setAttribute("aria-selected", String(n === e)));
+		let t = this.list.children[e];
+		t ? (this.input.setAttribute("aria-activedescendant", t.id), t.offsetTop < this.list.scrollTop ? this.list.scrollTop = t.offsetTop : t.offsetTop + t.offsetHeight > this.list.scrollTop + this.list.clientHeight && (this.list.scrollTop = t.offsetTop + t.offsetHeight - this.list.clientHeight)) : this.input.removeAttribute("aria-activedescendant");
+	}
+	suggest() {
+		if (this.input.disabled) return;
+		let e = this.selected && this.input.value === Q(this.selected) ? "" : this.input.value.trim().toLocaleLowerCase();
+		this.filtered = this.versions.filter((t) => (!this.language.value || this.language.value === "all" || t.language === this.language.value) && `${t.title} ${t.abbreviation} ${t.languageName ?? ""}`.toLocaleLowerCase().includes(e)), this.list.replaceChildren(...this.filtered.map((e, t) => {
+			let n = document.createElement("li");
+			if (n.id = `${this.list.id}-${t}`, n.dataset.index = String(t), n.setAttribute("role", "option"), n.setAttribute("part", "option"), n.textContent = Q(e), this.language.value === "all" && e.languageName) {
+				let t = document.createElement("span");
+				t.className = "language-name", t.textContent = e.languageName, n.append(t);
+			}
+			return n;
+		})), this.status.textContent = this.filtered.length ? `${this.filtered.length} translations` : "No matching translations. Try another search or language.", this.list.hidden = !this.filtered.length, this.input.setAttribute("aria-expanded", String(!this.list.hidden)), this.highlight(Math.max(0, this.filtered.findIndex((e) => e.id === this.value)));
+	}
+	commit(e, t) {
+		let n = this.value;
+		this.selected = this.versions.find((t) => t.id === e), this.input.value = this.selected ? Q(this.selected) : "", this.internals.setFormValue(this.selected?.id ?? null);
+		let r = !!(e && !this.selected && this.provider);
+		this.internals.setValidity(r ? { customError: !0 } : {}, r ? "This translation is not available from the selected provider." : "", this.input), this.input.setAttribute("aria-invalid", String(r)), r ? this.status.textContent = "This translation is not available from the selected provider." : this.status.textContent = `${this.versions.filter((e) => !this.language.value || this.language.value === "all" || e.language === this.language.value).length} translations available`, this.close(), t && n !== this.value && (this.pendingValue = this.value, this.dispatchEvent(new CustomEvent("change", {
+			bubbles: !0,
+			detail: {
+				provider: this.provider.id,
+				bibleVersionId: this.value,
+				bibleVersion: this.selected ?? null
+			}
+		})));
+	}
+	scheduleLoad() {
+		this.generation++, this.cancelLoad?.(), this.scheduled || (this.scheduled = !0, queueMicrotask(() => {
+			this.scheduled = !1, this.isConnected && (this.cancelLoad = v.runCallback(this.load(this.generation).pipe(v.catch((e) => v.sync(() => {
+				this.selected = void 0, this.versions = [], this.input.value = "", this.status.textContent = "Unable to load translations.", this.internals.setValidity({ customError: !0 }, "Unable to load translations.", this.input), this.input.setAttribute("aria-invalid", "true"), this.loading = !1, this.failed = !0, this.updateDisabled(), this.retry.hidden = !1, this.dispatchEvent(new CustomEvent("scripture-error", { detail: e }));
+			})))));
+		}));
+	}
+	load = v.fn("scripture.versionInput.load")(function* (e) {
+		let t = this.pendingValue ?? this.selected?.id;
+		this.loading = !0, this.failed = !1, this.updateDisabled(), this.retry.hidden = !0, this.status.innerHTML = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\"><path d=\"M21 12a9 9 0 1 1-6.219-8.56\"/></svg>Loading translations", this.internals.setFormValue(null), this.internals.setValidity({}), this.input.setAttribute("aria-invalid", "false");
+		let n = yield* r({
+			...s,
+			provider: this.getAttribute("provider") || this.override || s.provider,
+			yvpPublicAppKey: this.getAttribute("yvp-public-app-key") || s.yvpPublicAppKey,
+			yvpApiHost: this.getAttribute("yvp-api-host") || s.yvpApiHost
+		}), i = yield* a({ provider: n });
+		if (!this.isConnected || e !== this.generation) return;
+		this.provider = n, this.versions = [...i].sort((e, t) => e.title.localeCompare(t.title));
+		let o = /* @__PURE__ */ new Map();
+		for (let e of i) e.language && o.set(e.language, e.languageName || e.language);
+		this.language.replaceChildren(new Option("All languages", "all"), ...[...o].sort((e, t) => e[1].localeCompare(t[1])).map(([e, t]) => new Option(t, e)));
+		let c = this.pendingValue ?? t ?? this.defaultValue(n), l = i.find((e) => e.id === c), u = this.getAttribute("language") || l?.language || new Intl.Locale(navigator.language).language;
+		this.language.value = o.has(u) ? u : "all", this.commit(c, !1), this.pendingValue = void 0, this.loading = !1, this.updateDisabled(), this.dispatchEvent(new CustomEvent("scripture-versions-load", { detail: {
+			provider: n.id,
+			versions: i
+		} }));
+	});
+};
+function de(e = {}) {
+	Object.assign(s, e), customElements.get("si-version-input") || customElements.define(X, $), customElements.get("bible-sk-version-input") || customElements.define(Z, class extends $ {});
+}
+// src/index.ts
+var fe = `
+.${z} {
+  /* Lay out exactly like the text it replaced, whatever the host styles links as,
+     so linking a reference never reflows the line. Only paint-only styles below. */
+  display: inline !important;
+  font: inherit !important;
+  letter-spacing: inherit !important;
+  word-spacing: inherit !important;
+  margin: 0 !important;
+  padding: 0 !important;
+  border: 0 !important;
+  color: inherit;
+  text-decoration: underline dotted;
+  text-decoration-thickness: 1.5px;
+  text-underline-offset: 0.2em;
+  cursor: pointer;
+}
+.${z}:hover { text-decoration-style: solid; }`;
+function pe({ mode: e = "card", trigger: t = "click", reference: n = "heading", root: r, watch: i = !0, ...a } = {}) {
+	if (!document.getElementById("scripture-inline-styles")) {
+		let e = document.createElement("style");
+		e.id = "scripture-inline-styles", e.textContent = fe, document.head.append(e);
+	}
+	let o = V(r ?? document.body), s = new AbortController(), { signal: c } = s, l = null, u = r ?? document, d = new MutationObserver((e) => {
+		for (let t of e) for (let e of t.addedNodes) {
+			if (!e.isConnected || !r && !document.body?.contains(e)) continue;
+			let t = e.nodeType === Node.TEXT_NODE ? e.parentNode : e;
+			if (t && (o.push(...V(t)), t instanceof Element)) for (let e of t.querySelectorAll(`a.${z}`)) o.includes(e) || o.push(e);
+		}
+		d.takeRecords();
+		for (let e = o.length - 1; e >= 0; e--) o[e].isConnected || o.splice(e, 1);
+		l?.closeIfDetached();
+	});
+	if (e === "card") {
+		let e = l = L({
+			...a,
+			reference: n
+		}), r = (e) => e.target.closest?.(`a.${z}`);
+		u.addEventListener("click", (t) => {
+			let n = t;
+			if (n.metaKey || n.ctrlKey || n.shiftKey || n.altKey || n.button !== 0) return;
+			let i = r(t);
+			i && (t.preventDefault(), e.toggle(i));
+		}, { signal: c }), t === "hover" && (u.addEventListener("pointerover", (t) => {
+			let n = r(t);
+			n && t.pointerType === "mouse" && e.hover(n);
+		}, { signal: c }), u.addEventListener("pointerout", (t) => {
+			r(t) && e.unhover(t);
+		}, { signal: c }));
+	}
+	return {
+		links: o,
+		stop: v.runCallback(v.gen(function* () {
+			yield* v.acquireRelease(v.sync(() => {
+				i && d.observe(r ?? document.documentElement, {
+					childList: !0,
+					subtree: !0
+				});
+			}), () => v.sync(() => {
+				d.disconnect(), s.abort(), l?.destroy(), H(o);
+			})), yield* v.never;
+		}).pipe(v.scoped, v.withSpan("scripture.references.watch")))
+	};
+}
+export { W as BIBLE_PASSAGE_INPUT_TAG, T as BIBLE_PASSAGE_TAG, Z as BIBLE_VERSION_INPUT_TAG, U as PASSAGE_INPUT_TAG, w as SCRIPTURE_PASSAGE_TAG, M as ScripturePassage, Y as ScripturePassageInput, $ as ScriptureVersionInput, X as VERSION_INPUT_TAG, L as createScriptureCard, i as createYouVersionProvider, ce as definePassageInput, N as defineScripturePassage, de as defineVersionInput, R as findReferences, n as helloaoProvider, e as listBibleVersions, pe as scriptureInline, H as unwrapReferences, V as wrapReferences };