@uploadcare/ai-enhancer 0.1.1

package/dist/UcAiEnhancer-D1z2-v9q.js

@@ -0,0 +1,3299 @@
+var gt = Object.defineProperty;
+var Fe = (t) => {
+  throw TypeError(t);
+};
+var vt = (t, e, i) => e in t ? gt(t, e, { enumerable: !0, configurable: !0, writable: !0, value: i }) : t[e] = i;
+var b = (t, e, i) => vt(t, typeof e != "symbol" ? e + "" : e, i), ae = (t, e, i) => e.has(t) || Fe("Cannot " + i);
+var E = (t, e, i) => (ae(t, e, "read from private field"), i ? i.call(t) : e.get(t)), ne = (t, e, i) => e.has(t) ? Fe("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, i), Me = (t, e, i, r) => (ae(t, e, "write to private field"), r ? r.call(t, i) : e.set(t, i), i), X = (t, e, i) => (ae(t, e, "access private method"), i);
+import { unsafeCSS as B, LitElement as j, html as f, nothing as v } from "lit";
+import { property as c, state as C, query as F, customElement as G } from "lit/decorators.js";
+import { classMap as S } from "lit/directives/class-map.js";
+import { unsafeSVG as te } from "lit/directives/unsafe-svg.js";
+import { nothing as tt } from "lit/html.js";
+import { directive as it, PartType as rt } from "lit/directive.js";
+import { AsyncDirective as st } from "lit/async-directive.js";
+import { repeat as bt } from "lit/directives/repeat.js";
+const W = "original";
+function O(t) {
+  return t != null && t !== W;
+}
+function pe(t, e) {
+  return t === W || e === W ? t === e : $t(t, e);
+}
+const yt = [
+  [2, 3],
+  [3, 2],
+  [1, 1],
+  [9, 16],
+  [16, 9]
+], wt = [3, 2], xt = {
+  "1:1": "ai-enhancer-aspect-square",
+  "2:3": "ai-enhancer-aspect-tall",
+  "3:2": "ai-enhancer-aspect-wide",
+  "4:5": "ai-enhancer-aspect-portrait",
+  "5:4": "ai-enhancer-aspect-landscape",
+  "9:16": "ai-enhancer-aspect-vertical",
+  "16:9": "ai-enhancer-aspect-widescreen"
+}, kt = 0.1, Et = 10;
+function ye(t) {
+  const [e, i] = t;
+  if (!Number.isFinite(e) || !Number.isFinite(i) || e <= 0 || i <= 0) return !1;
+  const r = e / i;
+  return r >= kt && r <= Et;
+}
+function Z(t) {
+  return `${t[0]}:${t[1]}`;
+}
+function Rt(t) {
+  return xt[Z(t)] ?? null;
+}
+function St(t) {
+  return { value: t, labelKey: Rt(t) };
+}
+function Ct(t) {
+  const e = [];
+  for (const i of t.split(/[\s,]+/)) {
+    const r = i.trim();
+    if (!r) continue;
+    const s = r.indexOf(":");
+    if (s === -1) continue;
+    const o = Number(r.slice(0, s)), a = Number(r.slice(s + 1)), n = [o, a];
+    ye(n) && e.push(n);
+  }
+  return e;
+}
+function $t(t, e) {
+  return t[0] === e[0] && t[1] === e[1];
+}
+function At(t) {
+  const [e, i] = t, r = 12, s = e >= i ? r : r * (e / i), o = i >= e ? r : r * (i / e), a = (16 - s) / 2, n = (16 - o) / 2;
+  return `<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect x="${a.toFixed(2)}" y="${n.toFixed(2)}" width="${s.toFixed(2)}" height="${o.toFixed(2)}" rx="1.5" stroke="currentColor" stroke-width="1.4"/></svg>`;
+}
+const fe = {
+  generate: {
+    id: "generate",
+    placeholderKey: "ai-enhancer-generate-placeholder",
+    // Complete, descriptive starting prompts. Flux responds best to rich
+    // natural-language descriptions, and clicking a chip fills the prompt so the
+    // user can run it as-is or tweak it.
+    presets: [
+      {
+        label: "Portrait",
+        prompt: "A photorealistic close-up portrait of a woman with freckles and windswept hair, soft natural window light, shallow depth of field, shot on an 85mm lens, ultra-detailed skin texture"
+      },
+      {
+        label: "Cinematic",
+        prompt: "Cinematic film still of a lone traveler on a neon-lit Tokyo street at night, rain-slicked pavement, glowing reflections, moody atmosphere, anamorphic, shot on 35mm"
+      },
+      {
+        label: "Product",
+        prompt: "Product photography of a frosted glass perfume bottle on a polished marble surface, soft studio lighting, gentle reflections, minimalist composition, high detail"
+      },
+      {
+        label: "Landscape",
+        prompt: "A serene mountain landscape at golden hour, low mist drifting through the valley, dramatic clouds, mirror-still lake reflections, photorealistic, ultra-detailed"
+      },
+      {
+        label: "Illustration",
+        prompt: "A flat vector illustration of a cozy bookshop café, warm color palette, clean bold shapes, soft shadows, modern editorial style"
+      },
+      {
+        label: "3D character",
+        prompt: "A cute 3D-rendered robot character, Pixar style, big expressive eyes, soft studio lighting, pastel color palette, smooth glossy materials, octane render"
+      }
+    ]
+  },
+  edit: {
+    id: "edit",
+    placeholderKey: "ai-enhancer-edit-placeholder",
+    // Instruction-style edits Flux Kontext handles well — restyling, relighting,
+    // and background/subject changes that preserve the source image.
+    presets: [
+      {
+        label: "Enhance",
+        prompt: "Enhance the photo: improve the lighting, sharpen details, and make the colors richer while keeping it natural"
+      },
+      { label: "Golden hour", prompt: "Relight the scene with warm golden-hour sunlight and long, soft shadows" },
+      {
+        label: "White studio",
+        prompt: "Place the subject on a clean seamless white studio backdrop with soft, even lighting"
+      },
+      { label: "Remove people", prompt: "Remove all other people from the scene, keeping the main subject intact" },
+      {
+        label: "Watercolor",
+        prompt: "Restyle the image as a soft watercolor painting with delicate, visible brush strokes"
+      },
+      {
+        label: "Black & white",
+        prompt: "Convert to dramatic high-contrast black and white film photography with subtle grain"
+      }
+    ]
+  }
+};
+class we extends Error {
+  constructor(e, i, r) {
+    super(i), this.name = "AiProviderError", this.errorCode = e, this.errorSource = r;
+  }
+}
+function Ut(t) {
+  const e = t == null ? void 0 : t.error;
+  return !!e && typeof e == "object" && typeof e.error_code == "string";
+}
+async function J(t, e) {
+}
+async function Ie(t, e) {
+  const i = await t.text().catch(() => "");
+  let r = null;
+  if (i)
+    try {
+      r = JSON.parse(i);
+    } catch {
+    }
+  if (Ut(r)) {
+    const { error_code: s, content: o } = r.error;
+    throw new we(s, o ?? s);
+  }
+  if (!t.ok)
+    throw new Error(
+      `Uploadcare ${e} failed (${t.status} ${t.statusText})${i ? `: ${i}` : ""}`
+    );
+  return r;
+}
+class Tt {
+  constructor(e) {
+    if (!e.publicKey)
+      throw new Error("UploadcareApiClient: publicKey is required");
+    this.publicKey = e.publicKey, this.baseUrl = e.baseUrl ?? "https://upload.uploadcare.com", this.doFetch = e.fetch ?? globalThis.fetch.bind(globalThis);
+  }
+  /** Start a text→image generation job. Resolves to the job handle. */
+  async generate(e) {
+    const i = {
+      pub_key: this.publicKey,
+      prompt: e.prompt,
+      aspect_ratio: [e.aspectRatio[0], e.aspectRatio[1]],
+      filename: e.filename
+    };
+    return e.store !== void 0 && (i.store = e.store), e.metadata && (i.metadata = e.metadata), await J(), this.startJob(new URL("/derivative/image/generate/", this.baseUrl), i, "generate", e.signal);
+  }
+  /** Start an image→image edit job. Resolves to the job handle. */
+  async edit(e) {
+    const i = {
+      pub_key: this.publicKey,
+      prompt: e.prompt,
+      source: e.source,
+      filename: e.filename
+    };
+    return e.aspectRatio && (i.aspect_ratio = [e.aspectRatio[0], e.aspectRatio[1]]), e.store !== void 0 && (i.store = e.store), e.metadata && (i.metadata = e.metadata), await J(), this.startJob(new URL("/derivative/image/edit/", this.baseUrl), i, "edit", e.signal);
+  }
+  /** Fetch the current state of a generation/edit job. */
+  async getJobStatus(e, i) {
+    const r = new URL("/derivative/status/", this.baseUrl);
+    r.searchParams.set("pub_key", this.publicKey), r.searchParams.set("job_id", e);
+    const s = await this.doFetch(r.href, { method: "GET", headers: { Accept: "application/json" }, signal: i }), o = await Ie(s, "generate status");
+    return await J(), o;
+  }
+  async startJob(e, i, r, s) {
+    const o = await this.doFetch(e.href, {
+      method: "POST",
+      headers: { "Content-Type": "application/json", Accept: "application/json" },
+      body: JSON.stringify(i),
+      signal: s
+    }), a = await Ie(o, r);
+    return await J(), a;
+  }
+}
+const ot = "[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}", Ft = new RegExp(`^${ot}$`, "i"), Mt = new RegExp(`^(${ot})~([0-9]+)$`, "i");
+function xe(t) {
+  return t.replace(/\/+$/, "");
+}
+function me(t, e = "size") {
+  return typeof t == "number" ? String(t) : t.replace("%", "p");
+}
+function at(t, e, i = "dimensions") {
+  const r = t == null ? "" : me(t, `${i} width`), s = e == null ? "" : me(e, `${i} height`);
+  return `${r}x${s}`;
+}
+function Oe(t, e) {
+  return typeof t == "number" ? String(t) : me(t, e);
+}
+function It(t, e = "alignment") {
+  return typeof t == "string" ? t : `${Oe(t.x, `${e} x`)},${Oe(t.y, `${e} y`)}`;
+}
+const Ot = [
+  "video",
+  "document",
+  "gif2video"
+], Pt = /\/(https?:\/\/.+)$/i;
+function zt(t) {
+  return t != null && Ot.includes(t);
+}
+function nt(t) {
+  var _;
+  let e;
+  try {
+    e = new URL(t);
+  } catch {
+    throw new TypeError(`Invalid URL: "${t}"`);
+  }
+  const i = `${e.protocol}//${e.host}`, r = e.pathname, s = (_ = r.match(Pt)) == null ? void 0 : _[1];
+  if (s !== void 0) {
+    const x = r.slice(0, r.length - s.length);
+    return {
+      kind: "proxy",
+      origin: i,
+      operations: le(Pe(x), "proxy prefix"),
+      sourceUrl: s + e.search + e.hash
+    };
+  }
+  const o = r.endsWith("/"), a = Pe(r), n = a.shift();
+  if (n === void 0)
+    throw new TypeError(`Not a CDN URL (empty path): "${t}"`);
+  const l = { origin: i, search: e.search, hash: e.hash }, h = n.match(Mt);
+  if ((h == null ? void 0 : h[1]) !== void 0) {
+    const x = {
+      uuid: h[1],
+      count: Number(h[2])
+    };
+    if (a[0] === "nth") {
+      const w = Number(a[1]);
+      if (!Number.isInteger(w))
+        throw new TypeError(`Invalid group element index in "${t}"`);
+      a.splice(0, 2);
+      const $ = ze(a, o);
+      return {
+        kind: "group-element",
+        ...l,
+        group: x,
+        nth: w,
+        operations: le(a, t),
+        filename: $
+      };
+    }
+    if (a.length > 0)
+      throw new TypeError(`Unexpected path after group id in "${t}"`);
+    return { kind: "group", ...l, group: x };
+  }
+  if (!Ft.test(n))
+    throw new TypeError(
+      `Not a CDN URL (no uuid, group or proxy source): "${t}"`
+    );
+  let p = null;
+  zt(a[0]) && (p = a[0], a.shift());
+  const u = ze(a, o);
+  return {
+    kind: "file",
+    ...l,
+    uuid: n,
+    conversion: p,
+    operations: le(a, t),
+    filename: u
+  };
+}
+function Pe(t) {
+  return t.split("/").filter((e) => e !== "");
+}
+function ze(t, e) {
+  return e || t.length === 0 ? null : t.pop() ?? null;
+}
+function le(t, e) {
+  const i = [];
+  let r = 0;
+  for (; r < t.length; ) {
+    if (t[r] !== "-")
+      throw new TypeError(
+        `Unexpected path segment "${t[r]}" in "${e}"`
+      );
+    r += 1;
+    const s = t[r];
+    if (s == null || s === "-")
+      throw new TypeError(`Missing operation name in "${e}"`);
+    r += 1;
+    const o = [];
+    for (; r < t.length; ) {
+      const a = t[r];
+      if (a === void 0 || a === "-") break;
+      o.push(a), r += 1;
+    }
+    i.push({ name: s, params: o });
+  }
+  return i;
+}
+function lt(t) {
+  return t.map((e) => `-/${[e.name, ...e.params].join("/")}/`).join("");
+}
+function ct(t) {
+  const e = xe(t.origin), i = lt(t.operations ?? []);
+  if ("sourceUrl" in t && t.sourceUrl != null)
+    return `${e}/${i}${t.sourceUrl}`;
+  const r = ("search" in t ? t.search : "") ?? "", s = ("hash" in t ? t.hash : "") ?? "";
+  if ("group" in t && t.group != null) {
+    let o = `${e}/${t.group.uuid}~${t.group.count}/`;
+    return t.nth != null && (o += `nth/${t.nth}/${i}${t.filename ?? ""}`), o + r + s;
+  }
+  if ("uuid" in t && t.uuid != null) {
+    const o = t.conversion != null ? `${t.conversion}/` : "";
+    return `${e}/${t.uuid}/${o}${i}${t.filename ?? ""}${r}${s}`;
+  }
+  throw new TypeError("serializeCdnUrl requires one of: uuid, group, sourceUrl");
+}
+function Lt(t) {
+  return typeof t == "string" ? t : "opName" in t ? t.opName : t.name;
+}
+function ce(t, e) {
+  const i = Lt(e);
+  return t.name === i || t.name.startsWith(`${i}~`);
+}
+function ht(t, e) {
+  return Object.assign(e, { opName: t });
+}
+const Dt = (t, e) => {
+  const i = new URL(e);
+  return i.hostname = `${t}.${i.hostname}`, i.toString().replace(/\/$/, "");
+}, Nt = "0123456789abcdefghijklmnopqrstuvwxyz", Bt = (t) => {
+  if (t <= 0n)
+    return "0";
+  let e = "";
+  for (; t > 0n; ) {
+    const i = t % 36n;
+    e = Nt[Number(i)] + e, t = t / 36n;
+  }
+  return e;
+}, jt = (t, e) => {
+  try {
+    const i = new URL(t), r = new URL(e);
+    return i.hostname.endsWith(r.hostname);
+  } catch {
+    return !1;
+  }
+}, Gt = async (t) => {
+  const e = new TextEncoder().encode(t), i = await window.crypto.subtle.digest("SHA-256", e), r = Array.from(new Uint8Array(i)).map((s) => s.toString(16).padStart(2, "0")).join("");
+  return BigInt(`0x${r}`);
+}, Ht = 10, Wt = async (t) => {
+  const e = await Gt(t);
+  return Bt(e).slice(0, Ht);
+}, Vt = async (t, e) => {
+  const i = await Wt(t);
+  return Dt(i, e);
+};
+function Le(t) {
+  return Object.prototype.toString.call(t) === "[object Object]";
+}
+const qt = /\W|_/g;
+function Kt(t) {
+  return t.split(qt).map((e, i) => e.charAt(0)[i > 0 ? "toUpperCase" : "toLowerCase"]() + e.slice(1)).join("");
+}
+function De(t, { ignoreKeys: e } = { ignoreKeys: [] }) {
+  return Array.isArray(t) ? t.map((i) => ke(i, { ignoreKeys: e })) : t;
+}
+function ke(t, { ignoreKeys: e } = { ignoreKeys: [] }) {
+  if (Array.isArray(t))
+    return De(t, { ignoreKeys: e });
+  if (!Le(t))
+    return t;
+  const i = {};
+  for (const r of Object.keys(t)) {
+    let s = t[r];
+    if (e.includes(r)) {
+      i[r] = s;
+      continue;
+    }
+    Le(s) ? s = ke(s, { ignoreKeys: e }) : Array.isArray(s) && (s = De(s, { ignoreKeys: e })), i[Kt(r)] = s;
+  }
+  return i;
+}
+const Yt = (t) => new Promise((e) => setTimeout(e, t));
+function Xt({ libraryName: t, libraryVersion: e, userAgent: i, publicKey: r = "", integration: s = "" }) {
+  const o = "JavaScript";
+  if (typeof i == "string")
+    return i;
+  if (typeof i == "function")
+    return i({
+      publicKey: r,
+      libraryName: t,
+      libraryVersion: e,
+      languageName: o,
+      integration: s
+    });
+  const a = [t, e, r].filter(Boolean).join("/"), n = [o, s].filter(Boolean).join("; ");
+  return `${a} (${n})`;
+}
+const Jt = {
+  factor: 2,
+  time: 100
+};
+function Zt(t, e = Jt) {
+  let i = 0;
+  function r(s) {
+    const o = Math.round(e.time * e.factor ** i);
+    return s({
+      attempt: i,
+      retry: (n) => Yt(n ?? o).then(() => (i += 1, r(s)))
+    });
+  }
+  return r(t);
+}
+class Ee extends Error {
+}
+class ie extends Ee {
+  constructor(i) {
+    super();
+    b(this, "originalProgressEvent");
+    this.name = "NetworkError", this.message = "Network error", Object.setPrototypeOf(this, ie.prototype), this.originalProgressEvent = i;
+  }
+}
+const Qt = (t, e) => {
+  t && (t.aborted ? Promise.resolve().then(e) : t.addEventListener("abort", () => e(), { once: !0 }));
+};
+class Re extends Ee {
+  constructor(i = "Request canceled") {
+    super(i);
+    b(this, "isCancel", !0);
+    this.name = "CancelError", Object.setPrototypeOf(this, Re.prototype);
+  }
+}
+const Q = {
+  baseCDN: "https://ucarecdn.com",
+  baseURL: "https://upload.uploadcare.com",
+  retryThrottledRequestMaxTimes: 1,
+  retryNetworkErrorMaxTimes: 3
+}, ei = ({ method: t, url: e, data: i, headers: r = {}, signal: s, onProgress: o }) => new Promise((a, n) => {
+  const l = new XMLHttpRequest(), h = (t == null ? void 0 : t.toUpperCase()) || "GET";
+  let p = !1;
+  l.open(h, e, !0), r && Object.entries(r).forEach((u) => {
+    const [_, x] = u;
+    typeof x < "u" && !Array.isArray(x) && l.setRequestHeader(_, x);
+  }), l.responseType = "text", Qt(s, () => {
+    p = !0, l.abort(), n(new Re());
+  }), l.onload = () => {
+    if (l.status != 200)
+      n(new Error(`Error ${l.status}: ${l.statusText}`));
+    else {
+      const u = {
+        method: h,
+        url: e,
+        data: i,
+        headers: r || void 0,
+        signal: s,
+        onProgress: o
+      }, _ = l.getAllResponseHeaders().trim().split(/[\r\n]+/), x = {};
+      _.forEach(function(R) {
+        const I = R.split(": "), H = I.shift(), Y = I.join(": ");
+        H && typeof H < "u" && (x[H] = Y);
+      });
+      const w = l.response, $ = l.status;
+      a({
+        request: u,
+        data: w,
+        headers: x,
+        status: $
+      });
+    }
+  }, l.onerror = (u) => {
+    p || n(new ie(u));
+  }, o && typeof o == "function" && (l.upload.onprogress = (u) => {
+    u.lengthComputable ? o({
+      isComputable: !0,
+      value: u.loaded / u.total
+    }) : o({ isComputable: !1 });
+  }), i ? l.send(i) : l.send();
+});
+class Se extends Ee {
+  constructor(i, r, s, o, a) {
+    super();
+    b(this, "code");
+    b(this, "request");
+    b(this, "response");
+    b(this, "headers");
+    this.name = "UploadError", this.message = i, this.code = r, this.request = s, this.response = o, this.headers = a, Object.setPrototypeOf(this, Se.prototype);
+  }
+}
+const ti = (t) => {
+  const e = new URLSearchParams();
+  for (const [i, r] of Object.entries(t))
+    r && typeof r == "object" && !Array.isArray(r) ? Object.entries(r).filter((s) => s[1] ?? !1).forEach((s) => e.set(`${i}[${s[0]}]`, String(s[1]))) : Array.isArray(r) ? r.forEach((s) => {
+      e.append(`${i}[]`, s);
+    }) : typeof r == "string" && r ? e.set(i, r) : typeof r == "number" && e.set(i, r.toString());
+  return e.toString();
+}, _e = (t, e, i) => {
+  const r = new URL(t);
+  return r.pathname = (r.pathname + e).replace("//", "/"), i && (r.search = ti(i)), r.toString();
+};
+var ii = "6.18.4";
+const ri = "UploadcareUploadClient", si = ii;
+function oi(t) {
+  return Xt({
+    libraryName: ri,
+    libraryVersion: si,
+    ...t
+  });
+}
+const ai = "RequestThrottledError", Ne = 15e3, ni = 1e3;
+function li(t) {
+  const { headers: e } = t || {};
+  if (!e || typeof e["retry-after"] != "string")
+    return Ne;
+  const i = parseInt(e["retry-after"], 10);
+  return Number.isFinite(i) ? i * 1e3 : Ne;
+}
+function ci(t, e) {
+  const { retryThrottledRequestMaxTimes: i, retryNetworkErrorMaxTimes: r } = e;
+  return Zt(({ attempt: s, retry: o }) => t().catch((a) => {
+    if ("response" in a && (a == null ? void 0 : a.code) === ai && s < i)
+      return o(li(a));
+    if (a instanceof ie && s < r)
+      return o((s + 1) * ni);
+    throw a;
+  }));
+}
+var Be;
+(function(t) {
+  t.Token = "token", t.FileInfo = "file_info";
+})(Be || (Be = {}));
+var je;
+(function(t) {
+  t.Unknown = "unknown", t.Waiting = "waiting", t.Progress = "progress", t.Error = "error", t.Success = "success";
+})(je || (je = {}));
+function hi(t, { publicKey: e, baseURL: i = Q.baseURL, signal: r, source: s, integration: o, userAgent: a, retryThrottledRequestMaxTimes: n = Q.retryThrottledRequestMaxTimes, retryNetworkErrorMaxTimes: l = Q.retryNetworkErrorMaxTimes }) {
+  return ci(() => ei({
+    method: "GET",
+    headers: {
+      "X-UC-User-Agent": oi({ publicKey: e, integration: o, userAgent: a })
+    },
+    url: _e(i, "/info/", {
+      jsonerrors: 1,
+      pub_key: e,
+      file_id: t,
+      source: s
+    }),
+    signal: r
+  }).then(({ data: h, headers: p, request: u }) => {
+    const _ = ke(JSON.parse(h));
+    if ("error" in _)
+      throw new Se(_.error.content, _.error.errorCode, u, _, p);
+    return _;
+  }), { retryThrottledRequestMaxTimes: n, retryNetworkErrorMaxTimes: l });
+}
+function ui(t) {
+  return "defaultEffects" in t;
+}
+class Ge {
+  constructor(e, { baseCDN: i = Q.baseCDN, fileName: r } = {}) {
+    b(this, "uuid");
+    b(this, "name");
+    b(this, "size");
+    b(this, "isStored");
+    b(this, "isImage");
+    b(this, "mimeType");
+    b(this, "cdnUrl");
+    b(this, "s3Url");
+    b(this, "originalFilename");
+    b(this, "imageInfo");
+    b(this, "videoInfo");
+    b(this, "contentInfo");
+    b(this, "metadata");
+    b(this, "s3Bucket");
+    b(this, "defaultEffects", null);
+    const { uuid: s, s3Bucket: o } = e, a = _e(i, `${s}/`), n = o ? _e(`https://${o}.s3.amazonaws.com/`, `${s}/${e.filename}`) : null;
+    this.uuid = s, this.name = r || e.filename, this.size = e.size, this.isStored = e.isStored, this.isImage = e.isImage, this.mimeType = e.mimeType, this.cdnUrl = a, this.originalFilename = e.originalFilename, this.imageInfo = e.imageInfo, this.videoInfo = e.videoInfo, this.contentInfo = e.contentInfo, this.metadata = e.metadata || null, this.s3Bucket = o || null, this.s3Url = n, ui(e) && (this.defaultEffects = e.defaultEffects);
+  }
+}
+const di = /\W|_/g;
+function pi(t) {
+  return typeof t == "object" && t !== null && !Array.isArray(t);
+}
+function fi(t) {
+  return t.split(di).map((e, i) => e && e.charAt(0)[i > 0 ? "toUpperCase" : "toLowerCase"]() + e.slice(1)).join("");
+}
+function ge(t) {
+  if (Array.isArray(t))
+    return t.map((i) => ge(i));
+  if (!pi(t))
+    return t;
+  const e = {};
+  for (const i of Object.keys(t))
+    e[fi(i)] = ge(t[i]);
+  return e;
+}
+const mi = [1, 1], He = "https://ucarecdn.com", _i = 1500, gi = 1e6;
+function vi(t, e) {
+  return new Promise((i, r) => {
+    if (e != null && e.aborted) {
+      r(new DOMException("Aborted", "AbortError"));
+      return;
+    }
+    const s = setTimeout(() => {
+      e == null || e.removeEventListener("abort", o), i();
+    }, t), o = () => {
+      clearTimeout(s), r(new DOMException("Aborted", "AbortError"));
+    };
+    e == null || e.addEventListener("abort", o, { once: !0 });
+  });
+}
+function We() {
+  return typeof performance < "u" && typeof performance.now == "function" ? performance.now() : Date.now();
+}
+class bi {
+  constructor(e) {
+    if (this.id = "uploadcare-derivative", !e.publicKey)
+      throw new Error("UploadcareDerivativeApi: publicKey is required");
+    this.api = new Tt({
+      publicKey: e.publicKey,
+      baseUrl: e.baseUrl,
+      fetch: e.fetch
+    }), this.publicKey = e.publicKey, this.baseUrl = e.baseUrl, this.filename = e.filename ?? "generated.png", this.store = e.store, this.cname = e.cdnBaseUrl ?? He, this.cnamePrefixed = e.cdnCnamePrefixed ?? "https://ucarecd.net", this.pollIntervalMs = e.pollIntervalMs ?? _i, this.pollTimeoutMs = e.pollTimeoutMs ?? gi;
+  }
+  async generate(e) {
+    const i = await this.startJob(e);
+    return this.pollUntilDone(i, e);
+  }
+  /**
+   * Resolve a stored file's UUID to its CDN URL, using the same key-derived CDN
+   * base as generation results — so an input image displays identically to one
+   * the editor produced.
+   */
+  async resolveCdnUrl(e) {
+    return ct({ origin: await this.getCdnBase(), uuid: e });
+  }
+  /**
+   * Resolve a stored file's full info (image dimensions, original filename,
+   * mime, …) from its uuid, as an {@link UploadcareFile} — the same shape
+   * generation results carry. Lets the editor frame the canvas to the source's
+   * true aspect ratio before the image decodes, and name outputs after it.
+   */
+  async getFileInfo(e, i) {
+    const r = await hi(e, { publicKey: this.publicKey, baseURL: this.baseUrl, signal: i });
+    return new Ge(r, { baseCDN: await this.getCdnBase() });
+  }
+  async startJob(e) {
+    const i = e.aspectRatio && ye(e.aspectRatio) ? [e.aspectRatio[0], e.aspectRatio[1]] : void 0, r = e.filename ?? this.filename, s = e.mode === "edit" ? await this.startEditJob(e, i, r, e.metadata) : await this.api.generate({
+      prompt: e.prompt,
+      aspectRatio: i ?? mi,
+      filename: r,
+      store: this.store,
+      signal: e.signal,
+      metadata: e.metadata
+    });
+    if (!s.job_id)
+      throw new Error("Uploadcare derivative: response did not include a job_id");
+    return s.job_id;
+  }
+  startEditJob(e, i, r, s) {
+    if (!e.source)
+      throw new Error("Uploadcare edit: a source image uuid is required");
+    return this.api.edit({
+      prompt: e.prompt,
+      source: e.source,
+      aspectRatio: i,
+      filename: r,
+      store: this.store,
+      signal: e.signal,
+      metadata: s
+    });
+  }
+  async pollUntilDone(e, i) {
+    const r = this.pollTimeoutMs + We();
+    for (; ; ) {
+      const s = await this.api.getJobStatus(e, i.signal);
+      if (s.status === "success") {
+        if (!s.uuid)
+          throw new Error("Uploadcare derivative: response did not include a uuid");
+        const o = ge(s), a = new Ge(o, { baseCDN: await this.getCdnBase() });
+        return { url: a.cdnUrl, uuid: a.uuid, prompt: i.prompt, mode: i.mode, file: a };
+      }
+      if (s.status === "error") {
+        const o = s.error_code ?? "unknown", a = s.error ?? o;
+        throw new we(o, a, s.error_source);
+      }
+      if (We() >= r)
+        throw new Error(`Uploadcare derivative: timed out waiting for job ${e}`);
+      await vi(this.pollIntervalMs, i.signal);
+    }
+  }
+  /**
+   * Resolve the CDN base, deriving it from the public key when the cname is the
+   * default (or already a prefixed base) — the same logic the file uploader
+   * applies in its `cdnCname` computed config. Computed once and cached.
+   */
+  getCdnBase() {
+    return this.cdnBasePromise || (this.cdnBasePromise = this.cname === He || jt(this.cname, this.cnamePrefixed) ? Vt(this.publicKey, this.cnamePrefixed) : Promise.resolve(this.cname)), this.cdnBasePromise;
+  }
+}
+const Ve = 20;
+class yi {
+  constructor(e) {
+    this.busy = !1, this.resultUrl = null, this.result = null, this.error = null, this.errorCode = null, this.history = [], this._abortController = null, this._host = e, e.addController(this);
+  }
+  hostDisconnected() {
+    this.abort();
+  }
+  abort() {
+    var e;
+    (e = this._abortController) == null || e.abort();
+  }
+  reset() {
+    this.abort(), this.resultUrl = null, this.result = null, this.error = null, this.errorCode = null, this._host.requestUpdate();
+  }
+  /** Drop the prompt-history strip (e.g. on "Start over"). */
+  clearHistory() {
+    this.history = [], this._host.requestUpdate();
+  }
+  /** Replace the strip with entries hydrated from storage (e.g. when the editor
+   *  opens on a source whose lineage was generated in a past session). */
+  setHistory(e) {
+    this.history = e.slice(0, Ve), this._host.requestUpdate();
+  }
+  setResult(e) {
+    this.resultUrl = e.url, this.result = e, this.error = null, this.errorCode = null, this._host.requestUpdate();
+  }
+  async run(e) {
+    var r;
+    if (this.busy) return null;
+    (r = this._abortController) == null || r.abort();
+    const i = new AbortController();
+    this._abortController = i, this.busy = !0, this.error = null, this.errorCode = null, this._host.requestUpdate();
+    try {
+      const s = await e.provider.generate({
+        prompt: e.prompt,
+        mode: e.mode,
+        aspectRatio: e.aspectRatio,
+        source: e.source,
+        filename: e.filename,
+        metadata: e.metadata,
+        signal: i.signal
+      });
+      return i.signal.aborted ? null : (this.resultUrl = s.url, this.result = s, this.history = [
+        {
+          id: crypto.randomUUID(),
+          prompt: s.prompt,
+          mode: s.mode,
+          url: s.url,
+          file: s.file,
+          ratio: e.ratioValue ?? null
+        },
+        ...this.history
+      ].slice(0, Ve), s);
+    } catch (s) {
+      if ((s == null ? void 0 : s.name) === "AbortError") return null;
+      throw this.error = s.message || "Generation failed", this.errorCode = s instanceof we ? s.errorCode : null, s;
+    } finally {
+      this._abortController === i && (this.busy = !1, this._abortController = null), this._host.requestUpdate();
+    }
+  }
+}
+const wi = {
+  "ai-enhancer-source-label": "Generate image",
+  "ai-enhancer-file-action-label": "AI Edit",
+  "ai-enhancer-generate-title": "Generate image",
+  "ai-enhancer-edit-title": "Edit image",
+  "ai-enhancer-generate-placeholder": "Create image...",
+  "ai-enhancer-edit-placeholder": "Edit image...",
+  "ai-enhancer-cancel": "Cancel",
+  "ai-enhancer-generate-btn": "Generate",
+  "ai-enhancer-done-btn": "Done",
+  "ai-enhancer-start-over": "Start over",
+  "ai-enhancer-history-title": "Recent prompts",
+  "ai-enhancer-busy": "Generating…",
+  "ai-enhancer-error": "Something went wrong. Try again.",
+  "ai-enhancer-fullscreen": "View fullscreen",
+  "ai-enhancer-exit-fullscreen": "Exit fullscreen",
+  "ai-enhancer-aspect-ratio-aria": "Pick aspect ratio",
+  "ai-enhancer-aspect-original": "Original",
+  "ai-enhancer-aspect-square": "Square",
+  "ai-enhancer-aspect-tall": "Tall",
+  "ai-enhancer-aspect-wide": "Wide",
+  "ai-enhancer-aspect-portrait": "Portrait",
+  "ai-enhancer-aspect-landscape": "Landscape",
+  "ai-enhancer-aspect-vertical": "Vertical",
+  "ai-enhancer-aspect-widescreen": "Widescreen"
+}, xi = {
+  // Platform validation (POST generate/edit/outpaint, GET status)
+  "ai-enhancer-error-invalid_request": "Something went wrong with the request. Please try again.",
+  "ai-enhancer-error-invalid_source": "The source image couldn't be read. Please try a different image.",
+  "ai-enhancer-error-source_not_found": "The source image couldn't be found.",
+  "ai-enhancer-error-source_not_image": "The source file must be an image.",
+  "ai-enhancer-error-source_url_unavailable": "The source image couldn't be downloaded. Please try again.",
+  "ai-enhancer-error-invalid_aspect_ratio": "That aspect ratio isn't supported.",
+  "ai-enhancer-error-canvas_too_large": "The image is too large (max 4 megapixels). Try a smaller size.",
+  "ai-enhancer-error-canvas_dimension_too_small": "The image is too small — each side must be at least 256px.",
+  "ai-enhancer-error-source_extends_beyond_canvas": "The source image doesn't fit the canvas. Try a larger canvas.",
+  "ai-enhancer-error-derivative_disabled": "AI image generation isn't enabled for this account.",
+  "ai-enhancer-error-job_id_required": "Something went wrong. Please try again.",
+  "ai-enhancer-error-job_not_found": "This generation has expired. Please try again.",
+  // AI gateway (job status)
+  "ai-enhancer-error-content_moderated": "This request was blocked by content moderation. Try a different prompt.",
+  "ai-enhancer-error-provider_unavailable": "The image service is busy right now. Please try again in a moment.",
+  "ai-enhancer-error-generation_timeout": "Generation took too long and timed out. Please try again.",
+  "ai-enhancer-error-invalid_input": "Some settings are invalid. Please adjust them and try again.",
+  "ai-enhancer-error-RequestThrottledError": "Too many requests right now. Please wait a moment and try again.",
+  // Upload pipeline (job status)
+  "ai-enhancer-error-DownloadFileHTTPClientError": "Couldn't retrieve the generated image. Please try again.",
+  "ai-enhancer-error-DownloadFileNotFoundError": "The generated image couldn't be found. Please try again.",
+  "ai-enhancer-error-DownloadFileTaskFailedError": "Couldn't save the generated image. Please try again."
+}, N = { ...wi, ...xi }, he = {
+  en: async () => N,
+  ar: () => import("./ar-0rfB4z3f.js").then((t) => t.default),
+  az: () => import("./az-CyK2FKx4.js").then((t) => t.default),
+  ca: () => import("./ca-CAoPN2lq.js").then((t) => t.default),
+  cs: () => import("./cs-gutH5sZI.js").then((t) => t.default),
+  da: () => import("./da-CjNgqmRE.js").then((t) => t.default),
+  de: () => import("./de-BC0mixOW.js").then((t) => t.default),
+  el: () => import("./el-lfrMPw8j.js").then((t) => t.default),
+  es: () => import("./es-D0qq2qhV.js").then((t) => t.default),
+  et: () => import("./et-Drgz7t_M.js").then((t) => t.default),
+  fi: () => import("./fi-DA-ikQJH.js").then((t) => t.default),
+  fr: () => import("./fr-CFVF2OgM.js").then((t) => t.default),
+  he: () => import("./he-BZFhB0Wn.js").then((t) => t.default),
+  hy: () => import("./hy-DvnjH66b.js").then((t) => t.default),
+  is: () => import("./is-DLmDXgjm.js").then((t) => t.default),
+  it: () => import("./it-Ch7oZNp5.js").then((t) => t.default),
+  ja: () => import("./ja-B_rMbHKq.js").then((t) => t.default),
+  ka: () => import("./ka-cFaf_BUT.js").then((t) => t.default),
+  kk: () => import("./kk-K2vhij8e.js").then((t) => t.default),
+  ko: () => import("./ko-DeRxambx.js").then((t) => t.default),
+  lv: () => import("./lv-CizQndPI.js").then((t) => t.default),
+  nb: () => import("./nb-BxtTiZSk.js").then((t) => t.default),
+  nl: () => import("./nl-C12-qyO6.js").then((t) => t.default),
+  pl: () => import("./pl-DnVfWHgL.js").then((t) => t.default),
+  pt: () => import("./pt-JpSURXrS.js").then((t) => t.default),
+  ro: () => import("./ro-qmi5XBhp.js").then((t) => t.default),
+  ru: () => import("./ru-C_rsFTyL.js").then((t) => t.default),
+  sk: () => import("./sk-10Fuyb_E.js").then((t) => t.default),
+  sr: () => import("./sr-CTcREzcN.js").then((t) => t.default),
+  sv: () => import("./sv-BfxAcWfi.js").then((t) => t.default),
+  tr: () => import("./tr-CLDSkp-W.js").then((t) => t.default),
+  uk: () => import("./uk-BT0jZlPK.js").then((t) => t.default),
+  vi: () => import("./vi-BpWn9XQo.js").then((t) => t.default),
+  zh: () => import("./zh-C0AOtYB8.js").then((t) => t.default),
+  "zh-TW": () => import("./zh-TW-BNfdfwdz.js").then((t) => t.default)
+};
+function ki(t, e) {
+  return (e == null ? void 0 : e[t]) ?? N[t];
+}
+function Ei(t) {
+  if ("kind" in t) return t;
+  const e = xe(t.origin);
+  if ("sourceUrl" in t)
+    return {
+      kind: "proxy",
+      origin: e,
+      operations: t.operations ?? [],
+      sourceUrl: t.sourceUrl
+    };
+  const i = t.search ?? "", r = t.hash ?? "";
+  return "group" in t ? t.nth != null ? {
+    kind: "group-element",
+    origin: e,
+    group: t.group,
+    nth: t.nth,
+    operations: t.operations ?? [],
+    filename: t.filename ?? null,
+    search: i,
+    hash: r
+  } : { kind: "group", origin: e, group: t.group, search: i, hash: r } : {
+    kind: "file",
+    origin: e,
+    uuid: t.uuid,
+    conversion: t.conversion ?? null,
+    operations: t.operations ?? [],
+    filename: t.filename ?? null,
+    search: i,
+    hash: r
+  };
+}
+var k, V, ee, M;
+let Ri = (M = class {
+  constructor(e) {
+    ne(this, V);
+    ne(this, k);
+    Me(this, k, Ei(e));
+  }
+  /**
+   * Parses an existing CDN URL.
+   *
+   * @throws TypeError when the URL cannot be interpreted as a CDN URL.
+   */
+  static parse(e) {
+    return new M(nt(e));
+  }
+  /** A defensive copy of the operation chain (empty for group root urls). */
+  get operations() {
+    return "operations" in E(this, k) ? [...E(this, k).operations] : [];
+  }
+  /** The serialized URL string. */
+  get href() {
+    return ct(E(this, k));
+  }
+  /** Alias of {@link CdnUrl.href} for string coercion. */
+  toString() {
+    return this.href;
+  }
+  /** The underlying {@link ParsedCdnUrl}, discriminated by `kind`. */
+  toJSON() {
+    return "operations" in E(this, k) ? { ...E(this, k), operations: [...E(this, k).operations] } : { ...E(this, k) };
+  }
+  /**
+   * Appends operations to the chain.
+   *
+   * @throws TypeError on group root urls, which cannot carry operations.
+   */
+  with(...e) {
+    return X(this, V, ee).call(this, (i) => [...i, ...e]);
+  }
+  /**
+   * Removes every occurrence of an operation. Accepts the operation name,
+   * an operation object, or the creator itself: `url.without(resize)`.
+   */
+  without(e) {
+    return X(this, V, ee).call(this, (i) => i.filter((r) => !ce(r, e)));
+  }
+  /** Replaces the first same-named operation in place, or appends it. */
+  replace(e) {
+    return X(this, V, ee).call(this, (i) => {
+      const r = i.findIndex((o) => o.name === e.name);
+      if (r === -1) return [...i, e];
+      const s = [...i];
+      return s[r] = e, s;
+    });
+  }
+  /** Whether a matching operation is present (name, object or creator ref). */
+  has(e) {
+    return this.operations.some((i) => ce(i, e));
+  }
+  /** First matching operation (name, object or creator ref), or null. */
+  get(e) {
+    return this.operations.find((i) => ce(i, e)) ?? null;
+  }
+  /**
+   * Sets or clears (`null`) the trailing filename.
+   *
+   * @throws TypeError on group root and proxy urls.
+   */
+  setFilename(e) {
+    return E(this, k).kind === "group" || E(this, k).kind === "proxy" ? this : new M({ ...E(this, k), filename: e });
+  }
+  /** Rebases the url onto another domain. */
+  setOrigin(e) {
+    return new M({ ...E(this, k), origin: xe(e) });
+  }
+}, k = new WeakMap(), V = new WeakSet(), ee = function(e) {
+  return "operations" in E(this, k) ? new M({
+    ...E(this, k),
+    operations: e(E(this, k).operations)
+  }) : this;
+}, M);
+const ve = (t, ...e) => ({
+  name: t,
+  params: e
+}), Si = /* @__PURE__ */ ht(
+  "preview",
+  function(t, e) {
+    return t == null && e == null ? ve("preview") : ve("preview", at(t, e, "preview"));
+  }
+), Ci = /* @__PURE__ */ ht(
+  "scale_crop",
+  function(t, e, i = {}) {
+    const r = [at(t, e, "scale_crop")];
+    return i.type != null && r.push(i.type), i.align != null && r.push(It(i.align, "scale_crop alignment")), ve("scale_crop", ...r);
+  }
+), $i = 3e3;
+function ut(t) {
+  const e = typeof window < "u" ? window.devicePixelRatio : 1;
+  return Math.min(Math.ceil(t * Math.max(e, 1)), $i);
+}
+function dt(t, e) {
+  if (e.length === 0) return t;
+  try {
+    return Ri.parse(t).with(...e).href;
+  } catch {
+    return t;
+  }
+}
+function Ai(t, e) {
+  const i = ut(e);
+  return dt(t, [Si(i, i)]);
+}
+function Ui(t, e) {
+  const i = ut(e);
+  return dt(t, [Ci(i, i, { align: "center" })]);
+}
+const Ti = "uc-ai-enhancer/history", qe = 200, Fi = 10080 * 60 * 1e3;
+class Mi {
+  constructor(e) {
+    this._key = null, e.addController(this);
+  }
+  hostDisconnected() {
+  }
+  /** Namespace the store by pubkey. Passing an empty key disables persistence. */
+  setNamespace(e) {
+    this._key = e ? `${Ti}/${e}` : null;
+  }
+  /** Upsert the result as a node and persist (evicting expired/overflowing nodes). */
+  record(e) {
+    const i = this._key;
+    if (!i) return;
+    const r = this._read(i);
+    r[e.uuid] = { ...e, createdAt: Date.now() }, this._write(i, this._evict(r));
+  }
+  /**
+   * Persist the original source image as a root node (`source: null`), so it
+   * survives reloads as the base of its lineage. Idempotent: keeps an existing
+   * node untouched (preserving its ordering). New nodes are dated just before the
+   * lineage's oldest entry so the source always sorts last (the base of the strip).
+   */
+  recordSource(e) {
+    const i = this._key;
+    if (!i) return;
+    const r = this._read(i);
+    if (r[e.uuid]) return;
+    const s = Object.values(r).reduce((o, a) => Math.min(o, a.createdAt), Date.now());
+    r[e.uuid] = { ...e, source: null, createdAt: s - 1 }, this._write(i, this._evict(r));
+  }
+  /**
+   * The history strip for `uuid`'s lineage, newest-first: every stored result
+   * connected to it by parent/child links (so branches off an older result are
+   * included). Returns `[]` when persistence is off or nothing is connected — incl.
+   * the common case of opening on a freshly uploaded image with no prior edits.
+   */
+  lineage(e) {
+    const i = this._key;
+    return !i || !e ? [] : this._component(this._read(i), e).sort((r, s) => s.createdAt - r.createdAt).map(Ii);
+  }
+  /** Nodes in `start`'s connected component, walking both parent and child edges.
+   *  `start` may be a node itself or only a parent uuid (a source not yet edited). */
+  _component(e, i) {
+    const r = /* @__PURE__ */ new Map();
+    for (const n of Object.values(e)) {
+      if (!n.source) continue;
+      const l = r.get(n.source);
+      l ? l.push(n) : r.set(n.source, [n]);
+    }
+    const s = [], o = /* @__PURE__ */ new Set(), a = [i];
+    for (; a.length > 0; ) {
+      const n = a.shift();
+      if (n === void 0 || o.has(n)) continue;
+      o.add(n);
+      const l = e[n];
+      l && (s.push(l), l.source && a.push(l.source));
+      for (const h of r.get(n) ?? []) a.push(h.uuid);
+    }
+    return s;
+  }
+  /** Drop expired nodes, then the oldest beyond {@link MAX_NODES}. Dropping a
+   *  middle node just orphans its descendants (their lineage walk stops early). */
+  _evict(e) {
+    const i = Date.now();
+    let r = Object.values(e).filter((o) => i - o.createdAt < Fi);
+    r.length > qe && (r = r.sort((o, a) => a.createdAt - o.createdAt).slice(0, qe));
+    const s = {};
+    for (const o of r) s[o.uuid] = o;
+    return s;
+  }
+  _read(e) {
+    var i;
+    try {
+      const r = (i = globalThis.localStorage) == null ? void 0 : i.getItem(e);
+      if (!r) return {};
+      const s = JSON.parse(r);
+      return s && typeof s == "object" ? s : {};
+    } catch {
+      return {};
+    }
+  }
+  _write(e, i) {
+    var r;
+    try {
+      (r = globalThis.localStorage) == null || r.setItem(e, JSON.stringify(i));
+    } catch {
+    }
+  }
+}
+function Ii(t) {
+  return {
+    id: t.uuid,
+    prompt: t.prompt,
+    mode: t.mode,
+    url: t.url,
+    file: t.file,
+    ratio: t.ratio
+  };
+}
+function Oi(t) {
+  try {
+    const e = nt(t);
+    if (e.kind === "file")
+      return {
+        uuid: e.uuid,
+        cdnUrlModifiers: lt(e.operations),
+        fileName: e.filename ?? ""
+      };
+  } catch {
+  }
+  return { uuid: "", cdnUrlModifiers: "", fileName: "" };
+}
+function Pi(t, e) {
+  return e ? e(t, Oi(t)) : t;
+}
+class pt {
+  constructor(e) {
+    this._cache = /* @__PURE__ */ new Map(), this._pending = /* @__PURE__ */ new Set(), this._host = e, e.addController(this);
+  }
+  hostDisconnected() {
+    this._cache.clear(), this._pending.clear();
+  }
+  /** Point at a new resolver; clears the cache since the signing changed. */
+  setResolver(e) {
+    this._resolver = e, this._cache.clear(), this._pending.clear(), this._host.requestUpdate();
+  }
+  /** The delivery url for `url`, or `null` while an async resolver is pending. */
+  resolve(e) {
+    if (!e || !this._resolver) return e;
+    const i = this._cache.get(e);
+    if (i !== void 0) return i;
+    if (this._pending.has(e)) return null;
+    const r = Pi(e, this._resolver);
+    return typeof r == "string" ? (this._cache.set(e, r), r) : (this._pending.add(e), r.then((s) => this._cache.set(e, s)).catch(() => this._cache.set(e, e)).finally(() => {
+      this._pending.delete(e), this._host.requestUpdate();
+    }), null);
+  }
+}
+const Dr = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+  <path d="M9.5 3 11 6.5 14.5 8 11 9.5 9.5 13 8 9.5 4.5 8 8 6.5 9.5 3Z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/>
+  <path d="M17.5 12 18.4 14.1 20.5 15 18.4 15.9 17.5 18 16.6 15.9 14.5 15 16.6 14.1 17.5 12Z" stroke="currentColor" stroke-width="1.25" stroke-linejoin="round"/>
+  <path d="M5.5 16 6.1 17.4 7.5 18 6.1 18.6 5.5 20 4.9 18.6 3.5 18 4.9 17.4 5.5 16Z" stroke="currentColor" stroke-width="1.25" stroke-linejoin="round"/>
+</svg>`, Nr = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+  <path d="m14.5 4.5 5 5L9 20H4v-5L14.5 4.5Z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/>
+  <path d="m13 6 5 5" stroke="currentColor" stroke-width="1.5"/>
+  <path d="M18.5 14.5 19 16l1.5.5L19 17l-.5 1.5L18 17l-1.5-.5L18 16l.5-1.5Z" stroke="currentColor" stroke-width="1.1" stroke-linejoin="round"/>
+</svg>`, zi = `<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+  <path d="M3 6.74251L8 2L13 6.74251M7.99961 14V2.10636" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>`, Li = `<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+  <rect x="2" y="3" width="12" height="10" rx="1.6" stroke="currentColor" stroke-width="1.4"/>
+  <circle cx="5.75" cy="6.25" r="1.05" stroke="currentColor" stroke-width="1.2"/>
+  <path d="M3 11.5l3-2.6 2.3 1.8L11 8l2 2.4" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>`, Di = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+  <path d="M9 4H4v5M15 4h5v5M9 20H4v-5M15 20h5v-5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>`, Ni = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+  <path d="M4 9h5V4M20 9h-5V4M4 15h5v5M20 15h-5v5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>`, Bi = ":host{display:inline-flex;position:relative}.trigger{anchor-name:--ai-aspect-anchor;display:inline-flex;align-items:center;gap:8px;height:var(--uc-ai-button-size);padding:0 10px;background:var(--uc-ai-secondary);border:0;border-radius:var(--uc-ai-radius-button);color:var(--uc-ai-foreground);cursor:pointer;font:inherit;transition:background var(--uc-ai-transition),transform .14s var(--uc-ai-ease-out, ease)}.trigger:hover,.trigger[aria-expanded=true]{background:var(--uc-ai-secondary-hover)}.trigger:active{transform:scale(.97)}.trigger:disabled{opacity:.4;cursor:not-allowed}.trigger svg{width:14px;height:14px;color:var(--uc-ai-foreground)}.trigger-label{font-variant-numeric:tabular-nums;font-size:12px;font-weight:500;letter-spacing:.02em;line-height:20px}.popover{margin:0 0 6px;padding:0;border:0;background:transparent;color:inherit;overflow:visible;width:max-content;min-width:180px;max-width:320px;position-anchor:--ai-aspect-anchor;inset:auto;bottom:anchor(top);right:anchor(right);transform-origin:bottom right;transition:opacity .15s var(--uc-ai-ease-out, ease),transform .15s var(--uc-ai-ease-out, ease),display .15s allow-discrete,overlay .15s allow-discrete}.popover:not(:popover-open){display:none;opacity:0;transform:scale(.96) translateY(4px)}@starting-style{.popover:popover-open{opacity:0;transform:scale(.96) translateY(4px)}}.popover-inner{background:var(--uc-ai-background);border:1px solid var(--uc-ai-border);border-radius:var(--uc-ai-radius-input, 12px);box-shadow:var(--uc-ai-dialog-shadow);padding:5px;display:flex;flex-direction:column;gap:2px}.option{display:flex;align-items:center;gap:10px;width:100%;padding:6px 10px;background:transparent;border:0;border-radius:max(0px,calc(var(--uc-ai-radius-input) - 5px));cursor:pointer;color:var(--uc-ai-foreground);font:inherit;font-size:13px;text-align:left;transition:background .12s ease}.option:hover{background:var(--uc-ai-secondary)}.option[aria-selected=true]{background:var(--uc-ai-secondary-hover)}.option svg{width:16px;height:16px;flex:0 0 16px;color:var(--uc-ai-foreground)}.option-ratio{flex:0 0 36px;font-variant-numeric:tabular-nums;font-weight:500;white-space:nowrap;color:var(--uc-ai-foreground)}.option-label{flex:1;min-width:0;color:var(--uc-ai-muted-foreground);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(prefers-reduced-motion:reduce){.trigger,.popover{transition-property:opacity,background,display,overlay}.trigger:active{transform:none}.popover:not(:popover-open){transform:none}}";
+var ji = Object.defineProperty, Gi = Object.getOwnPropertyDescriptor, z = (t, e, i, r) => {
+  for (var s = r > 1 ? void 0 : r ? Gi(e, i) : e, o = t.length - 1, a; o >= 0; o--)
+    (a = t[o]) && (s = (r ? a(e, i, s) : a(s)) || s);
+  return r && s && ji(e, i, s), s;
+};
+let A = class extends j {
+  constructor() {
+    super(...arguments), this.options = [], this.selected = null, this.busy = !1, this.labelText = null, this.labelFor = (t) => O(t.value) ? Z(t.value) : "", this.open = !1, this._onToggle = (t) => {
+      t.newState === "closed" && this.open && (this.open = !1);
+    };
+  }
+  _setOpen(t) {
+    this.open = t;
+    const e = this._popover;
+    if (!e) return;
+    const i = e.matches(":popover-open");
+    t && !i ? e.showPopover() : !t && i && e.hidePopover();
+  }
+  _toggle() {
+    this._setOpen(!this.open);
+  }
+  _select(t) {
+    this.dispatchEvent(
+      new CustomEvent("uc:select", {
+        detail: { value: t },
+        bubbles: !0,
+        composed: !0
+      })
+    ), this._setOpen(!1);
+  }
+  /** Icon for a selection: the ratio's shape, or the generic "Original" glyph. */
+  _iconFor(t) {
+    return O(t) ? At(t) : Li;
+  }
+  _triggerLabel() {
+    const t = this.selected;
+    if (!t) return "";
+    if (O(t)) return Z(t);
+    const e = this.options.find((i) => i.value === t);
+    return e ? this.labelFor(e) : "";
+  }
+  render() {
+    const t = this._triggerLabel();
+    return f`
+      <button
+        type="button"
+        class="trigger"
+        aria-haspopup="listbox"
+        aria-expanded="${this.open ? "true" : "false"}"
+        aria-label="${this.labelText ?? "Aspect ratio"}"
+        ?disabled=${this.busy}
+        @click=${this._toggle}
+      >
+        ${this.selected ? te(this._iconFor(this.selected)) : null}
+        ${t ? f`<span class="trigger-label">${t}</span>` : null}
+      </button>
+      <div class="popover" popover="auto" role="listbox" @toggle=${this._onToggle}>
+        <div class="popover-inner">
+          ${this.options.map((e) => {
+      const i = this.selected ? pe(e.value, this.selected) : !1;
+      return f`
+              <button
+                type="button"
+                class="option"
+                role="option"
+                aria-selected="${i ? "true" : "false"}"
+                @click=${() => this._select(e.value)}
+              >
+                ${te(this._iconFor(e.value))}
+                <span class="option-ratio">${O(e.value) ? Z(e.value) : ""}</span>
+                <span class="option-label">${this.labelFor(e)}</span>
+              </button>
+            `;
+    })}
+        </div>
+      </div>
+    `;
+  }
+};
+A.styles = B(Bi);
+z([
+  c({ attribute: !1 })
+], A.prototype, "options", 2);
+z([
+  c({ attribute: !1 })
+], A.prototype, "selected", 2);
+z([
+  c({ type: Boolean })
+], A.prototype, "busy", 2);
+z([
+  c({ attribute: "aria-label-text" })
+], A.prototype, "labelText", 2);
+z([
+  c({ attribute: !1 })
+], A.prototype, "labelFor", 2);
+z([
+  C()
+], A.prototype, "open", 2);
+z([
+  F(".popover")
+], A.prototype, "_popover", 2);
+A = z([
+  G("uc-ai-aspect-ratio")
+], A);
+const Hi = /* @__PURE__ */ new WeakMap();
+let Ke = 0;
+const ue = /* @__PURE__ */ new Map(), Ye = /* @__PURE__ */ new WeakSet(), Xe = () => new Promise((t) => requestAnimationFrame(t)), Je = (t, e) => {
+  const i = t - e;
+  return i === 0 ? void 0 : i;
+}, Ze = (t, e) => {
+  const i = t / e;
+  return i === 1 ? void 0 : i;
+}, de = { left: (t, e) => {
+  const i = Je(t, e);
+  return { value: i, transform: i == null || isNaN(i) ? void 0 : `translateX(${i}px)` };
+}, top: (t, e) => {
+  const i = Je(t, e);
+  return { value: i, transform: i == null || isNaN(i) ? void 0 : `translateY(${i}px)` };
+}, width: (t, e) => {
+  let i;
+  e === 0 && (e = 1, i = { width: "1px" });
+  const r = Ze(t, e);
+  return { value: r, overrideFrom: i, transform: r == null || isNaN(r) ? void 0 : `scaleX(${r})` };
+}, height: (t, e) => {
+  let i;
+  e === 0 && (e = 1, i = { height: "1px" });
+  const r = Ze(t, e);
+  return { value: r, overrideFrom: i, transform: r == null || isNaN(r) ? void 0 : `scaleY(${r})` };
+} }, Wi = { duration: 333, easing: "ease-in-out" }, Vi = ["left", "top", "width", "height", "opacity", "color", "background"], Qe = /* @__PURE__ */ new WeakMap();
+class qi extends st {
+  constructor(e) {
+    if (super(e), this.t = !1, this.i = null, this.o = null, this.h = !0, this.shouldLog = !1, e.type === rt.CHILD) throw Error("The `animate` directive must be used in attribute position.");
+    this.createFinished();
+  }
+  createFinished() {
+    var e;
+    (e = this.resolveFinished) == null || e.call(this), this.finished = new Promise((i) => {
+      this.l = i;
+    });
+  }
+  async resolveFinished() {
+    var e;
+    (e = this.l) == null || e.call(this), this.l = void 0;
+  }
+  render(e) {
+    return tt;
+  }
+  getController() {
+    return Hi.get(this.u);
+  }
+  isDisabled() {
+    var e;
+    return this.options.disabled || ((e = this.getController()) == null ? void 0 : e.disabled);
+  }
+  update(e, [i]) {
+    var s;
+    const r = this.u === void 0;
+    return r && (this.u = (s = e.options) == null ? void 0 : s.host, this.u.addController(this), this.u.updateComplete.then((o) => this.t = !0), this.element = e.element, Qe.set(this.element, this)), this.optionsOrCallback = i, (r || typeof i != "function") && this.m(i), this.render(i);
+  }
+  m(e) {
+    e = e ?? {};
+    const i = this.getController();
+    i !== void 0 && ((e = { ...i.defaultOptions, ...e }).keyframeOptions = { ...i.defaultOptions.keyframeOptions, ...e.keyframeOptions }), e.properties ?? (e.properties = Vi), this.options = e;
+  }
+  p() {
+    const e = {}, i = this.element.getBoundingClientRect(), r = getComputedStyle(this.element);
+    return this.options.properties.forEach((s) => {
+      const o = i[s] ?? (de[s] ? void 0 : r[s]), a = Number(o);
+      e[s] = isNaN(a) ? o + "" : a;
+    }), e;
+  }
+  v() {
+    let e, i = !0;
+    return this.options.guard && (e = this.options.guard(), i = ((r, s) => {
+      if (Array.isArray(r)) {
+        if (Array.isArray(s) && s.length === r.length && r.every((o, a) => o === s[a])) return !1;
+      } else if (s === r) return !1;
+      return !0;
+    })(e, this._)), this.h = this.t && !this.isDisabled() && !this.isAnimating() && i && this.element.isConnected, this.h && (this._ = Array.isArray(e) ? Array.from(e) : e), this.h;
+  }
+  hostUpdate() {
+    typeof this.optionsOrCallback == "function" && this.m(this.optionsOrCallback()), this.v() && (this.A = this.p(), this.i = this.i ?? this.element.parentNode, this.o = this.element.nextSibling);
+  }
+  async hostUpdated() {
+    if (!this.h || !this.element.isConnected || this.options.skipInitial && !this.isHostRendered) return;
+    let e;
+    this.prepare(), await Xe;
+    const i = this.P(), r = this.V(this.options.keyframeOptions, i), s = this.p();
+    if (this.A !== void 0) {
+      const { from: o, to: a } = this.O(this.A, s, i);
+      this.log("measured", [this.A, s, o, a]), e = this.calculateKeyframes(o, a);
+    } else {
+      const o = ue.get(this.options.inId);
+      if (o) {
+        ue.delete(this.options.inId);
+        const { from: a, to: n } = this.O(o, s, i);
+        e = this.calculateKeyframes(a, n), e = this.options.in ? [{ ...this.options.in[0], ...e[0] }, ...this.options.in.slice(1), e[1]] : e, Ke++, e.forEach((l) => l.zIndex = Ke);
+      } else this.options.in && (e = [...this.options.in, {}]);
+    }
+    this.animate(e, r);
+  }
+  resetStyles() {
+    this.j !== void 0 && (this.element.setAttribute("style", this.j ?? ""), this.j = void 0);
+  }
+  commitStyles() {
+    var e, i;
+    this.j = this.element.getAttribute("style"), (e = this.webAnimation) == null || e.commitStyles(), (i = this.webAnimation) == null || i.cancel();
+  }
+  reconnected() {
+  }
+  async disconnected() {
+    var i;
+    if (!this.h || (this.options.id !== void 0 && ue.set(this.options.id, this.A), this.options.out === void 0)) return;
+    if (this.prepare(), await Xe(), (i = this.i) == null ? void 0 : i.isConnected) {
+      const r = this.o && this.o.parentNode === this.i ? this.o : null;
+      if (this.i.insertBefore(this.element, r), this.options.stabilizeOut) {
+        const s = this.p();
+        this.log("stabilizing out");
+        const o = this.A.left - s.left, a = this.A.top - s.top;
+        getComputedStyle(this.element).position !== "static" || o === 0 && a === 0 || (this.element.style.position = "relative"), o !== 0 && (this.element.style.left = o + "px"), a !== 0 && (this.element.style.top = a + "px");
+      }
+    }
+    const e = this.V(this.options.keyframeOptions);
+    await this.animate(this.options.out, e), this.element.remove();
+  }
+  prepare() {
+    this.createFinished();
+  }
+  start() {
+    var e, i;
+    (i = (e = this.options).onStart) == null || i.call(e, this);
+  }
+  didFinish(e) {
+    var i, r;
+    e && ((r = (i = this.options).onComplete) == null || r.call(i, this)), this.A = void 0, this.animatingProperties = void 0, this.frames = void 0, this.resolveFinished();
+  }
+  P() {
+    const e = [];
+    for (let i = this.element.parentNode; i; i = i == null ? void 0 : i.parentNode) {
+      const r = Qe.get(i);
+      r && !r.isDisabled() && r && e.push(r);
+    }
+    return e;
+  }
+  get isHostRendered() {
+    const e = Ye.has(this.u);
+    return e || this.u.updateComplete.then(() => {
+      Ye.add(this.u);
+    }), e;
+  }
+  V(e, i = this.P()) {
+    const r = { ...Wi };
+    return i.forEach((s) => Object.assign(r, s.options.keyframeOptions)), Object.assign(r, e), r;
+  }
+  O(e, i, r) {
+    e = { ...e }, i = { ...i };
+    const s = r.map((n) => n.animatingProperties).filter((n) => n !== void 0);
+    let o = 1, a = 1;
+    return s.length > 0 && (s.forEach((n) => {
+      n.width && (o /= n.width), n.height && (a /= n.height);
+    }), e.left !== void 0 && i.left !== void 0 && (e.left = o * e.left, i.left = o * i.left), e.top !== void 0 && i.top !== void 0 && (e.top = a * e.top, i.top = a * i.top)), { from: e, to: i };
+  }
+  calculateKeyframes(e, i, r = !1) {
+    const s = {}, o = {};
+    let a = !1;
+    const n = {};
+    for (const l in i) {
+      const h = e[l], p = i[l];
+      if (l in de) {
+        const u = de[l];
+        if (h === void 0 || p === void 0) continue;
+        const _ = u(h, p);
+        _.transform !== void 0 && (n[l] = _.value, a = !0, s.transform = `${s.transform ?? ""} ${_.transform}`, _.overrideFrom !== void 0 && Object.assign(s, _.overrideFrom));
+      } else h !== p && h !== void 0 && p !== void 0 && (a = !0, s[l] = h, o[l] = p);
+    }
+    return s.transformOrigin = o.transformOrigin = r ? "center center" : "top left", this.animatingProperties = n, a ? [s, o] : void 0;
+  }
+  async animate(e, i = this.options.keyframeOptions) {
+    this.start(), this.frames = e;
+    let r = !1;
+    if (!this.isAnimating() && !this.isDisabled() && (this.options.onFrames && (this.frames = e = this.options.onFrames(this), this.log("modified frames", e)), e !== void 0)) {
+      this.log("animate", [e, i]), r = !0, this.webAnimation = this.element.animate(e, i);
+      const s = this.getController();
+      s == null || s.add(this);
+      try {
+        await this.webAnimation.finished;
+      } catch {
+      }
+      s == null || s.remove(this);
+    }
+    return this.didFinish(r), r;
+  }
+  isAnimating() {
+    var e, i;
+    return ((e = this.webAnimation) == null ? void 0 : e.playState) === "running" || ((i = this.webAnimation) == null ? void 0 : i.pending);
+  }
+  log(e, i) {
+    this.shouldLog && !this.isDisabled() && console.log(e, this.options.id, i);
+  }
+}
+const Ki = it(qi), Yi = ["top", "right", "bottom", "left"];
+class Xi extends st {
+  constructor(e) {
+    if (super(e), e.type !== rt.ELEMENT) throw Error("The `position` directive must be used in attribute position.");
+  }
+  render(e, i) {
+    return tt;
+  }
+  update(e, [i, r]) {
+    var s;
+    return this.u === void 0 && (this.u = (s = e.options) == null ? void 0 : s.host, this.u.addController(this)), this.C = e.element, this.N = i, this.S = r ?? ["left", "top", "width", "height"], this.render(i, r);
+  }
+  hostUpdated() {
+    this.F();
+  }
+  F() {
+    var o, a;
+    const e = typeof this.N == "function" ? this.N() : (o = this.N) == null ? void 0 : o.value, i = e.offsetParent;
+    if (e === void 0 || !i) return;
+    const r = e.getBoundingClientRect(), s = i.getBoundingClientRect();
+    (a = this.S) == null || a.forEach((n) => {
+      const l = Yi.includes(n) ? r[n] - s[n] : r[n];
+      this.C.style[n] = l + "px";
+    });
+  }
+}
+it(Xi);
+const Ji = ':host{display:flex;justify-content:center}.strip{position:relative;display:inline-flex;align-items:center;min-height:44px}.chip{display:flex;align-items:center;padding:2px;margin-right:-11px;background:var(--uc-ai-floating, var(--uc-ai-background));border:1px solid transparent;border-radius:calc(var(--uc-ai-radius-button, 8px) + 2px);box-shadow:0 1px 8px #0000004d;cursor:pointer;transform:scale(1);transition:margin .3s var(--uc-ai-ease-out, ease),border-color 225ms ease,transform .27s var(--uc-ai-ease-out, ease),opacity .33s var(--uc-ai-ease-out, ease)}.chip:disabled{cursor:not-allowed}.chip:last-child{margin-right:0}@media(hover:hover)and (pointer:fine){.chip:hover:not(:disabled){transform:scale(1.1)}.strip:hover .chip:not(:disabled){margin-right:7px}.strip:hover .chip:not(:disabled):last-child{margin-right:0}}.chip--selected{border-color:var(--uc-ai-primary);transform:scale(1.2)}.thumb{position:relative;display:block;width:40px;height:40px;border-radius:var(--uc-ai-radius-button, 8px);background-color:var(--uc-ai-muted);overflow:hidden}.thumb:not(.thumb--loaded):after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(100deg,transparent 30%,color-mix(in srgb,var(--uc-ai-foreground) 9%,transparent) 50%,transparent 70%);transform:translate(-100%);animation:thumb-shimmer 1.2s ease-in-out infinite}@keyframes thumb-shimmer{to{transform:translate(100%)}}.thumb__img{display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .24s var(--uc-ai-ease-out, ease)}.thumb--loaded .thumb__img{opacity:1}@media(prefers-reduced-motion:reduce){.thumb:not(.thumb--loaded):after{animation:none}.thumb__img{transition:none}}.startover{position:absolute;right:calc(100% + 10px);top:50%;display:flex;align-items:center;background:var(--uc-ai-floating, var(--uc-ai-background));border:1px solid var(--uc-ai-floating-border, transparent);border-radius:calc(var(--uc-ai-radius-button, 8px) + 2px);box-shadow:var(--uc-ai-dialog-shadow);white-space:nowrap;opacity:0;transform:translateY(-50%) translate(-6px) scale(.95);transform-origin:right center;pointer-events:none;transition:opacity .26s var(--uc-ai-ease-out, ease),transform .26s var(--uc-ai-ease-out, ease)}.strip:hover .startover,.strip:focus-within .startover{opacity:1;transform:translateY(-50%) translate(0) scale(1);pointer-events:auto}.strip--empty .startover{position:static;opacity:1;transform:none;pointer-events:auto}.startover__btn{height:var(--uc-ai-button-size, 32px);padding:0 12px;background:transparent;border:0;border-radius:inherit;color:var(--uc-ai-foreground);font:inherit;font-size:13px;cursor:pointer}.startover__btn:disabled{cursor:not-allowed}.startover__btn:hover{background:var(--uc-ai-secondary)}.strip:before{content:"";position:absolute;right:100%;top:-12px;bottom:-12px;width:200px}.strip--empty:before{content:none}@media(prefers-reduced-motion:reduce){.chip,.startover{transition-property:opacity,border-color,margin}.chip:hover,.chip--selected{transform:scale(1)}.strip:not(.strip--empty) .startover,.strip:not(.strip--empty):hover .startover,.strip:not(.strip--empty):focus-within .startover{transform:translateY(-50%)}}';
+var Zi = Object.defineProperty, Qi = Object.getOwnPropertyDescriptor, L = (t, e, i, r) => {
+  for (var s = r > 1 ? void 0 : r ? Qi(e, i) : e, o = t.length - 1, a; o >= 0; o--)
+    (a = t[o]) && (s = (r ? a(e, i, s) : a(s)) || s);
+  return r && s && Zi(e, i, s), s;
+};
+const er = 80;
+let U = class extends j {
+  constructor() {
+    super(...arguments), this.entries = [], this.selectedUuid = null, this.showStartOver = !1, this.startOverLabel = "", this.listLabel = "Generation history", this.busy = !1, this._secure = new pt(this), this._loaded = /* @__PURE__ */ new Set();
+  }
+  willUpdate(t) {
+    if (t.has("secureResolver") && this._secure.setResolver(this.secureResolver), t.has("entries")) {
+      const e = new Set(this.entries.map((i) => i.id));
+      for (const i of this._loaded) e.has(i) || this._loaded.delete(i);
+    }
+  }
+  /** Mark an entry's thumbnail decoded (or failed) so it fades in over the skeleton. */
+  _onThumbSettled(t) {
+    this._loaded.has(t) || (this._loaded.add(t), this.requestUpdate());
+  }
+  _select(t) {
+    this.dispatchEvent(
+      new CustomEvent("uc:select", { detail: { entry: t }, bubbles: !0, composed: !0 })
+    );
+  }
+  _startOver() {
+    this.dispatchEvent(new CustomEvent("uc:start-over", { bubbles: !0, composed: !0 }));
+  }
+  render() {
+    const t = this.entries.length > 0;
+    if (!t && !this.showStartOver) return f`${v}`;
+    const e = { strip: !0, "strip--empty": !t }, i = [...this.entries].reverse();
+    return f`
+      <div class=${S(e)} role="toolbar" aria-label="${this.listLabel}">
+        ${this.showStartOver ? f`
+              <div class="startover">
+                <button type="button" ?disabled="${this.busy}" class="startover__btn" @click=${this._startOver}>
+                  ${this.startOverLabel}
+                </button>
+              </div>
+            ` : v}
+        ${bt(
+      i,
+      (r) => r.id,
+      (r) => {
+        const s = this._secure.resolve(Ui(r.url, er)), o = this.selectedUuid != null && r.file.uuid === this.selectedUuid, a = this._loaded.has(r.id);
+        return f`
+              <button
+                type="button"
+                ?disabled=${this.busy}
+                class=${S({ chip: !0, "chip--selected": o })}
+                aria-pressed="${o ? "true" : "false"}"
+                aria-label=${r.prompt || "Result"}
+                title=${r.prompt}
+                @click=${() => this._select(r)}
+                ${Ki({ keyframeOptions: { duration: 300, easing: "cubic-bezier(0.23, 1, 0.32, 1)" } })}
+              >
+                <span class=${S({ thumb: !0, "thumb--loaded": a })}>
+                  ${// Rendering the <img> preloads it; the skeleton shows until it
+        // decodes, then it fades in (see history.css).
+        s ? f`<img
+                          class="thumb__img"
+                          src="${s}"
+                          alt=""
+                          aria-hidden="true"
+                          decoding="async"
+                          @load=${() => this._onThumbSettled(r.id)}
+                          @error=${() => this._onThumbSettled(r.id)}
+                        />` : v}
+                </span>
+              </button>
+            `;
+      }
+    )}
+      </div>
+    `;
+  }
+};
+U.styles = B(Ji);
+L([
+  c({ attribute: !1 })
+], U.prototype, "entries", 2);
+L([
+  c({ attribute: "selected-uuid" })
+], U.prototype, "selectedUuid", 2);
+L([
+  c({ type: Boolean, attribute: "show-start-over" })
+], U.prototype, "showStartOver", 2);
+L([
+  c({ attribute: "start-over-label" })
+], U.prototype, "startOverLabel", 2);
+L([
+  c({ attribute: "list-label" })
+], U.prototype, "listLabel", 2);
+L([
+  c({ type: Boolean })
+], U.prototype, "busy", 2);
+L([
+  c({ attribute: !1 })
+], U.prototype, "secureResolver", 2);
+U = L([
+  G("uc-ai-history")
+], U);
+const tr = ':host{display:block}.card{width:100%;box-sizing:border-box;background:color-mix(in srgb,var(--uc-ai-floating, var(--uc-ai-background)) 80%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--uc-ai-floating-border, transparent);border-radius:var(--uc-ai-composer-radius-top) var(--uc-ai-composer-radius-top) var(--uc-ai-composer-radius-bottom) var(--uc-ai-composer-radius-bottom);transition:border-radius .4s var(--uc-ai-ease-out),box-shadow .4s var(--uc-ai-ease-out);box-shadow:var(--uc-ai-composer-shadow);overflow:visible;--uc-ai-radius-button: max(0px, calc(var(--uc-ai-composer-radius) - var(--uc-ai-padding)))}.body{display:flex;flex-direction:column;gap:var(--uc-ai-padding);padding:var(--uc-ai-padding)}.input{box-sizing:border-box;width:100%;min-height:40px;max-height:var(--uc-ai-prompt-max-height, calc(var(--uc-ai-prompt-max-lines, 6) * 1.5em + 10px));resize:none;border:0;outline:none;padding:0 3px;background:transparent;font-family:inherit;font-size:var(--uc-ai-font-size);line-height:20px;color:var(--uc-ai-foreground);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--uc-ai-border) transparent;transition:height .16s var(--uc-ai-ease-out, ease)}@supports (field-sizing: content){.input{field-sizing:content;transition:none}}.input::placeholder{color:var(--uc-ai-muted-foreground)}.input:disabled{color:var(--uc-ai-muted-foreground);-webkit-text-fill-color:var(--uc-ai-muted-foreground);cursor:not-allowed}.row{display:flex;align-items:center;gap:10px}.actions{flex:1;min-width:0;display:flex;align-items:center}.actions::slotted(*){min-width:0}.controls{display:flex;align-items:center;gap:0;flex:none}.send{margin-left:5px;width:var(--uc-ai-button-size, 32px);height:var(--uc-ai-button-size, 32px);flex:none;min-width:0;display:inline-flex;align-items:center;justify-content:center;position:relative;background:var(--uc-ai-primary);color:var(--uc-ai-primary-foreground);border:none;border-radius:var(--uc-ai-radius-button);cursor:pointer;overflow:hidden;transition:width .22s var(--uc-ai-ease-out, ease),margin-left .22s var(--uc-ai-ease-out, ease),opacity .15s var(--uc-ai-ease-out, ease),transform .15s var(--uc-ai-ease-out, ease),background var(--uc-ai-transition)}.send:hover:not(:disabled){background:var(--uc-ai-primary-hover)}.send:active:not(:disabled){transform:scale(.95)}.send:disabled{cursor:default}.send[hidden]{display:inline-flex;width:0;min-width:0;padding:0;margin-left:0;opacity:0;transform:scale(.8);pointer-events:none}.send__icon,.send__spinner{position:absolute;top:50%;left:50%;width:16px;height:16px;transition:opacity .2s var(--uc-ai-ease-out, ease),transform .2s var(--uc-ai-ease-out, ease),filter .2s var(--uc-ai-ease-out, ease)}.send__icon{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}.send__icon svg{width:16px;height:16px;display:block}.send__spinner{opacity:0;transform:translate(-50%,-50%) scale(.95);filter:blur(3px)}.send__spinner:before,.send__spinner:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:1.5px solid currentColor}.send__spinner:before{opacity:.3}.send__spinner:after{border-top-color:transparent;animation:send-spin .7s linear infinite;will-change:transform}@keyframes send-spin{to{transform:rotate(360deg)}}.send--busy .send__icon{opacity:0;transform:translate(-50%,-50%) scale(.95);filter:blur(3px)}.send--busy .send__spinner{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}.send--busy:disabled{opacity:1}@media(prefers-reduced-motion:reduce){.input,.send{transition-property:opacity,background,width,margin-left}.send__icon,.send__spinner{transition-property:opacity}.send__spinner:after{animation:none}.send:active:not(:disabled){transform:none}}';
+var ir = Object.defineProperty, rr = Object.getOwnPropertyDescriptor, D = (t, e, i, r) => {
+  for (var s = r > 1 ? void 0 : r ? rr(e, i) : e, o = t.length - 1, a; o >= 0; o--)
+    (a = t[o]) && (s = (r ? a(e, i, s) : a(s)) || s);
+  return r && s && ir(e, i, s), s;
+};
+let T = class extends j {
+  constructor() {
+    super(...arguments), this.mode = "generate", this.value = "", this.placeholder = "", this.busy = !1, this.allowCustom = !0, this.sendAriaLabel = "";
+  }
+  focusInput() {
+    var t;
+    (t = this._inputEl) == null || t.focus();
+  }
+  updated(t) {
+    t.has("value") && this._resize();
+  }
+  /**
+   * Auto-grow fallback for browsers without `field-sizing: content` support.
+   * The CSS `max-height` caps the growth; overflow scrolls internally.
+   */
+  _resize() {
+    const t = this._inputEl;
+    !t || CSS.supports("field-sizing", "content") || (t.style.height = "auto", t.style.height = `${t.scrollHeight}px`);
+  }
+  _onInput(t) {
+    const e = t.target.value;
+    this.value = e, this.dispatchEvent(
+      new CustomEvent("uc:input", { detail: { value: e }, bubbles: !0, composed: !0 })
+    ), this._resize();
+  }
+  _onKeydown(t) {
+    t.key === "Enter" && !t.shiftKey && !t.isComposing && this.value.trim() && !this.busy && (t.preventDefault(), this._emitSend());
+  }
+  _emitSend() {
+    this.dispatchEvent(new CustomEvent("uc:send", { bubbles: !0, composed: !0 }));
+  }
+  render() {
+    const t = this.value.trim().length === 0;
+    return f`
+      <div class="card">
+        <div class="body">
+          ${this.allowCustom ? f`<textarea
+                  class="input"
+                  rows="1"
+                  .value=${this.value}
+                  placeholder="${this.placeholder}"
+                  aria-label="${this.placeholder}"
+                  autocomplete="off"
+                  autocorrect="off"
+                  autocapitalize="off"
+                  spellcheck="false"
+                  name="uc-ai-prompt"
+                  data-1p-ignore
+                  data-lpignore="true"
+                  data-form-type="other"
+                  @input=${this._onInput}
+                  @keydown=${this._onKeydown}
+                  ?disabled=${this.busy}
+                ></textarea>` : v}
+
+          <div class="row">
+            <div class="actions">
+              <slot name="chips"></slot>
+            </div>
+            <div class="controls">
+              <slot name="aspect-ratio"></slot>
+              <button
+                type="button"
+                class=${S({ send: !0, "send--busy": this.busy })}
+                aria-label="${this.sendAriaLabel}"
+                ?hidden=${t}
+                ?disabled=${this.busy || t}
+                @click=${this._emitSend}
+              >
+                <span class="send__icon">${te(zi)}</span>
+                <span class="send__spinner" aria-hidden="true"></span>
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    `;
+  }
+};
+T.styles = B(tr);
+D([
+  c()
+], T.prototype, "mode", 2);
+D([
+  c()
+], T.prototype, "value", 2);
+D([
+  c()
+], T.prototype, "placeholder", 2);
+D([
+  c({ type: Boolean })
+], T.prototype, "busy", 2);
+D([
+  c({ type: Boolean })
+], T.prototype, "allowCustom", 2);
+D([
+  c({ attribute: "send-aria-label" })
+], T.prototype, "sendAriaLabel", 2);
+D([
+  F(".input")
+], T.prototype, "_inputEl", 2);
+T = D([
+  G("uc-ai-prompt-row")
+], T);
+const sr = ":host{display:block;min-width:0}.row{display:flex;flex-wrap:nowrap;align-items:center;gap:5px;overflow-x:auto;scrollbar-width:none}.row::-webkit-scrollbar{display:none}.row.fade-left.fade-right{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 10px,#000 calc(100% - 10px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 10px,#000 calc(100% - 10px),transparent 100%)}.row.fade-left:not(.fade-right){-webkit-mask-image:linear-gradient(to right,transparent 0,#000 10px);mask-image:linear-gradient(to right,transparent 0,#000 10px)}.row.fade-right:not(.fade-left){-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 10px),transparent 100%);mask-image:linear-gradient(to right,#000 calc(100% - 10px),transparent 100%)}.chip{flex:none;height:var(--uc-ai-button-size, 32px);display:inline-flex;align-items:center;justify-content:center;padding:0 10px;background:var(--uc-ai-secondary);border:0;border-radius:var(--uc-ai-radius-button);font-family:inherit;font-size:13px;line-height:20px;color:var(--uc-ai-secondary-foreground);cursor:pointer;white-space:nowrap;transition:background .15s ease,transform .14s var(--uc-ai-ease-out, ease)}@media(hover:hover)and (pointer:fine){.chip:hover{background:var(--uc-ai-secondary-hover)}}.chip:active{background:var(--uc-ai-secondary-hover);transform:scale(.97)}.chip:disabled{opacity:.5;cursor:not-allowed}@media(prefers-reduced-motion:reduce){.chip{transition-property:background}.chip:active{transform:none}}";
+var or = Object.defineProperty, ar = Object.getOwnPropertyDescriptor, K = (t, e, i, r) => {
+  for (var s = r > 1 ? void 0 : r ? ar(e, i) : e, o = t.length - 1, a; o >= 0; o--)
+    (a = t[o]) && (s = (r ? a(e, i, s) : a(s)) || s);
+  return r && s && or(e, i, s), s;
+};
+let P = class extends j {
+  constructor() {
+    super(...arguments), this.mode = "generate", this.presets = null, this.busy = !1, this.labelText = "Quick prompts";
+  }
+  firstUpdated() {
+    typeof ResizeObserver == "function" && this._rowEl && (this._resizeObserver = new ResizeObserver(() => this._updateFades()), this._resizeObserver.observe(this._rowEl)), this._updateFades();
+  }
+  updated() {
+    this._updateFades();
+  }
+  disconnectedCallback() {
+    var t;
+    super.disconnectedCallback(), (t = this._resizeObserver) == null || t.disconnect();
+  }
+  /**
+   * Show an edge fade only when there's more content to scroll toward. The fades
+   * are toggled imperatively (not via reactive state): they're derived from
+   * post-layout measurements and re-checked from `updated()`, so routing them
+   * through `@state` would re-schedule an update from within the update cycle.
+   */
+  _updateFades() {
+    const t = this._rowEl;
+    if (!t) return;
+    const e = t.scrollWidth - t.clientWidth, i = t.scrollLeft;
+    t.classList.toggle("fade-left", i > 1), t.classList.toggle("fade-right", i < e - 1);
+  }
+  /** Let a vertical wheel scroll the chips horizontally when they overflow. */
+  _onWheel(t) {
+    const e = this._rowEl;
+    !e || e.scrollWidth <= e.clientWidth || Math.abs(t.deltaY) <= Math.abs(t.deltaX) || (e.scrollLeft += t.deltaY, t.preventDefault());
+  }
+  _select(t) {
+    this.dispatchEvent(
+      new CustomEvent("uc:select", { detail: { preset: t }, bubbles: !0, composed: !0 })
+    );
+  }
+  render() {
+    const t = this.presets ?? fe[this.mode].presets;
+    return f`
+      <div
+        class="row"
+        role="toolbar"
+        aria-label="${this.labelText}"
+        @scroll=${this._updateFades}
+        @wheel=${this._onWheel}
+      >
+        ${t.map(
+      (e) => f`
+            <button type="button" class="chip" @click=${() => this._select(e)} ?disabled=${this.busy}>
+              ${e.label}
+            </button>
+          `
+    )}
+      </div>
+    `;
+  }
+};
+P.styles = B(sr);
+K([
+  c()
+], P.prototype, "mode", 2);
+K([
+  c({ attribute: !1 })
+], P.prototype, "presets", 2);
+K([
+  c({ type: Boolean })
+], P.prototype, "busy", 2);
+K([
+  c({ attribute: "aria-label-text" })
+], P.prototype, "labelText", 2);
+K([
+  F(".row")
+], P.prototype, "_rowEl", 2);
+P = K([
+  G("uc-ai-chips")
+], P);
+const be = 8, nr = `#version 300 es
+precision highp float;
+precision highp int;
+in vec2 aCorner;        // unit quad corner, -0.5..0.5
+in float aClip;         // per-instance frame clip, 0..1
+uniform vec2 uResolution;
+uniform float uCols;
+uniform vec2 uOffset;
+uniform float uCell;
+uniform float uBaseRadius;
+uniform float uFullHalf;
+uniform float uEnv;
+uniform float uShimMix;
+uniform int uMask;
+uniform int uGenerating;
+uniform float uMinScale;
+uniform float uPeakScale;
+uniform float uIdleScale;
+uniform int uEpiCount;
+uniform vec2 uEpis[${be}];
+uniform float uEpiRadius;
+uniform float uEpiFalloff;
+uniform float uColorA;
+uniform float uFalloffWarp;   // bends the distance field (de-ring)
+uniform float uDither;        // per-dot size dither
+out float vAlpha;
+out vec2 vLocalPx;            // fragment offset from the dot centre, CSS px
+out float vHalf;             // dot half-size, CSS px
+
+float hash(float a, float b) { return fract(sin(a * 12.9898 + b * 78.233) * 43758.5453); }
+
+float epiIntensity(vec2 p) {
+  float best = 0.0;
+  // Low-frequency warp of the distance field — dissolves ring banding.
+  float k = uFalloffWarp > 0.0 ? (6.2831853 / (uEpiRadius * 0.7)) : 0.0;
+  float warp = k > 0.0 ? uFalloffWarp * uEpiRadius * sin(p.x * k + 1.3) * cos(p.y * k * 0.9) : 0.0;
+  for (int i = 0; i < ${be}; i++) {
+    if (i >= uEpiCount) break;
+    float d = max(0.0, distance(p, uEpis[i]) + warp);
+    if (d >= uEpiRadius) continue;
+    float t = 1.0 - d / uEpiRadius;
+    float f = t * t * (3.0 - 2.0 * t);      // smoothstep
+    if (uEpiFalloff != 1.0) f = pow(f, uEpiFalloff);
+    best = max(best, f);
+  }
+  return best;
+}
+
+void main() {
+  float col = mod(float(gl_InstanceID), uCols);
+  float row = floor(float(gl_InstanceID) / uCols);
+  vec2 center = uOffset + vec2(col, row) * uCell;
+  float intensity = epiIntensity(center);
+  // When masking, ignore the per-dot frame clip and let the scissor define the
+  // frame edge instead: dots straddling the edge then poke in and cover it, so
+  // the revealed image fills the frame exactly (no uncovered strip that pops in
+  // when the grid hands off to the real <img>). The idle/shimmer grid keeps the
+  // soft per-dot clip so stray dots never show outside the frame.
+  float clipv = (uMask == 1) ? 1.0 : aClip;
+
+  // Per-dot size dither (scaled by intensity), breaking the size-wave's banding.
+  float sizeDither = (hash(col, row) - 0.5) * uDither * intensity;
+
+  float halfSize;
+  if (uMask == 1) {
+    float wave = uMinScale + (uPeakScale - uMinScale) * intensity + sizeDither;
+    float animated = (uGenerating == 1) ? wave : uMinScale;
+    float smallHalf = uBaseRadius * animated;
+    halfSize = (uFullHalf + uEnv * (smallHalf - uFullHalf)) * clipv;
+  } else {
+    float scale = uIdleScale;
+    if (uShimMix > 0.0) {
+      float wave = uMinScale + (uPeakScale - uMinScale) * intensity + sizeDither;
+      scale += (wave - scale) * uShimMix;
+    }
+    halfSize = uBaseRadius * scale * clipv;
+  }
+
+  if (halfSize <= 0.0) {
+    gl_Position = vec4(2.0, 2.0, 2.0, 1.0); // offscreen → culled
+    vAlpha = 0.0;
+    vLocalPx = vec2(0.0);
+    vHalf = 0.0;
+    return;
+  }
+
+  // Expand the quad ~1px beyond the dot so the fragment can anti-alias the edge
+  // sub-pixel — without this, hard quad edges snap to whole pixels and the
+  // grow/shrink reveal looks stepped.
+  float ext = halfSize + 1.0;
+  vLocalPx = aCorner * (2.0 * ext);
+  vHalf = halfSize;
+  vec2 pos = center + aCorner * (2.0 * ext);
+  vec2 ndc = (pos / uResolution) * 2.0 - 1.0;
+  gl_Position = vec4(ndc.x, -ndc.y, 0.0, 1.0);
+
+  vAlpha = (uMask == 1) ? 1.0 : uColorA;
+}`, lr = `#version 300 es
+precision highp float;
+precision highp int;
+in float vAlpha;
+in vec2 vLocalPx;       // CSS px from the dot centre
+in float vHalf;         // dot half-size, CSS px
+uniform vec3 uColorRGB;
+uniform int uMask;
+out vec4 frag;
+void main() {
+  // Box signed distance, evaluated in CSS px, anti-aliased over ~1px of screen
+  // space via fwidth — so size changes are sub-pixel-smooth (no stepping) while
+  // a square at idle still reads crisp.
+  vec2 d = abs(vLocalPx) - vec2(vHalf);
+  float sd = min(max(d.x, d.y), 0.0) + length(max(d, vec2(0.0)));
+  float aaw = max(fwidth(sd), 1e-4);
+  float cov = clamp(0.5 - sd / aaw, 0.0, 1.0);
+  vec3 rgb = (uMask == 1) ? vec3(1.0) : uColorRGB;
+  frag = vec4(rgb * vAlpha * cov, vAlpha * cov); // premultiplied
+}`, cr = `#version 300 es
+precision highp float;
+in vec2 aQuad;          // 0..1
+uniform vec2 uResolution;
+uniform vec4 uFrame;    // left, top, right, bottom (CSS px)
+out vec2 vFramePx;
+void main() {
+  vec2 px = mix(uFrame.xy, uFrame.zw, aQuad);
+  vFramePx = px - uFrame.xy;
+  vec2 ndc = (px / uResolution) * 2.0 - 1.0;
+  gl_Position = vec4(ndc.x, -ndc.y, 0.0, 1.0);
+}`, hr = `#version 300 es
+precision highp float;
+in vec2 vFramePx;
+uniform sampler2D uImage;
+uniform vec2 uFrameSize;
+uniform vec2 uImageSize;
+out vec4 frag;
+void main() {
+  // object-fit: cover.
+  float s = max(uFrameSize.x / uImageSize.x, uFrameSize.y / uImageSize.y);
+  vec2 dsz = uImageSize * s;
+  vec2 off = (uFrameSize - dsz) * 0.5;
+  vec2 uv = (vFramePx - off) / dsz;
+  frag = vec4(texture(uImage, uv).rgb, 1.0);
+}`;
+class Ce {
+  constructor(e) {
+    this._dotUniforms = {}, this._imgUniforms = {}, this._appliedW = 0, this._appliedH = 0, this._appliedScale = 0, this._texImage = null, this._texOk = !1, this._gl = e, this._dotProgram = this._link(nr, lr), this._imgProgram = this._link(cr, hr), this._cornerBuf = this._staticBuffer([-0.5, -0.5, 0.5, -0.5, -0.5, 0.5, 0.5, 0.5]), this._quadBuf = this._staticBuffer([0, 0, 1, 0, 0, 1, 1, 1]), this._clipBuf = e.createBuffer(), this._dotVao = e.createVertexArray(), e.bindVertexArray(this._dotVao);
+    const i = e.getAttribLocation(this._dotProgram, "aCorner");
+    e.bindBuffer(e.ARRAY_BUFFER, this._cornerBuf), e.enableVertexAttribArray(i), e.vertexAttribPointer(i, 2, e.FLOAT, !1, 0, 0);
+    const r = e.getAttribLocation(this._dotProgram, "aClip");
+    e.bindBuffer(e.ARRAY_BUFFER, this._clipBuf), e.enableVertexAttribArray(r), e.vertexAttribPointer(r, 1, e.FLOAT, !1, 0, 0), e.vertexAttribDivisor(r, 1), e.bindVertexArray(null), this._imgVao = e.createVertexArray(), e.bindVertexArray(this._imgVao);
+    const s = e.getAttribLocation(this._imgProgram, "aQuad");
+    e.bindBuffer(e.ARRAY_BUFFER, this._quadBuf), e.enableVertexAttribArray(s), e.vertexAttribPointer(s, 2, e.FLOAT, !1, 0, 0), e.bindVertexArray(null);
+    for (const o of [
+      "uResolution",
+      "uCols",
+      "uOffset",
+      "uCell",
+      "uBaseRadius",
+      "uFullHalf",
+      "uEnv",
+      "uShimMix",
+      "uMask",
+      "uGenerating",
+      "uMinScale",
+      "uPeakScale",
+      "uIdleScale",
+      "uEpiCount",
+      "uEpis",
+      "uEpiRadius",
+      "uEpiFalloff",
+      "uColorA",
+      "uColorRGB",
+      "uFalloffWarp",
+      "uDither"
+    ])
+      this._dotUniforms[o] = e.getUniformLocation(this._dotProgram, o);
+    for (const o of ["uResolution", "uFrame", "uImage", "uFrameSize", "uImageSize"])
+      this._imgUniforms[o] = e.getUniformLocation(this._imgProgram, o);
+    this._texture = e.createTexture(), e.bindTexture(e.TEXTURE_2D, this._texture), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, e.CLAMP_TO_EDGE), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, e.CLAMP_TO_EDGE), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.LINEAR), e.pixelStorei(e.UNPACK_FLIP_Y_WEBGL, !1), e.pixelStorei(e.UNPACK_PREMULTIPLY_ALPHA_WEBGL, !1);
+  }
+  /** Create a renderer on `canvas`, or null if WebGL2 / compilation is unavailable. */
+  static create(e) {
+    let i = null;
+    try {
+      i = e.getContext("webgl2", {
+        premultipliedAlpha: !0,
+        antialias: !1,
+        alpha: !0,
+        preserveDrawingBuffer: !0
+      });
+    } catch {
+      return null;
+    }
+    if (!i) return null;
+    try {
+      return new Ce(i);
+    } catch (r) {
+      return typeof console < "u" && console.warn("[dot-grid] WebGL init failed, using 2D:", r), null;
+    }
+  }
+  /** Upload (or clear) the image used for masking. Cross-origin images need CORS;
+   *  if the upload taints/fails the renderer just skips the image pass. */
+  setImage(e) {
+    const i = this._gl;
+    if (this._texImage = e, this._texOk = !1, !(!e || !e.complete || e.naturalWidth === 0)) {
+      i.bindTexture(i.TEXTURE_2D, this._texture);
+      try {
+        i.texImage2D(i.TEXTURE_2D, 0, i.RGBA, i.RGBA, i.UNSIGNED_BYTE, e), this._texOk = !0;
+      } catch {
+        this._texOk = !1;
+      }
+    }
+  }
+  /** Whether the current image was uploaded successfully (CORS-clean). */
+  get hasImage() {
+    return this._texOk;
+  }
+  render(e) {
+    const i = this._gl;
+    this._resize(e.cssW, e.cssH, e.scale), i.disable(i.SCISSOR_TEST), i.clearColor(0, 0, 0, 0), i.clear(i.COLOR_BUFFER_BIT);
+    const r = e.cols * e.rows;
+    if (r <= 0) return;
+    if (e.mask) {
+      const o = e.scale, a = Math.round(e.frameLeft * o), n = Math.round((e.cssH - e.frameBottom) * o), l = Math.round((e.frameRight - e.frameLeft) * o), h = Math.round((e.frameBottom - e.frameTop) * o);
+      i.enable(i.SCISSOR_TEST), i.scissor(a, n, Math.max(0, l), Math.max(0, h));
+    }
+    i.bindBuffer(i.ARRAY_BUFFER, this._clipBuf), i.bufferData(i.ARRAY_BUFFER, e.clip, i.DYNAMIC_DRAW), i.enable(i.BLEND), i.blendFunc(i.ONE, i.ONE_MINUS_SRC_ALPHA), i.useProgram(this._dotProgram), i.bindVertexArray(this._dotVao);
+    const s = this._dotUniforms;
+    if (i.uniform2f(s.uResolution, e.cssW, e.cssH), i.uniform1f(s.uCols, e.cols), i.uniform2f(s.uOffset, e.offsetX, e.offsetY), i.uniform1f(s.uCell, e.cell), i.uniform1f(s.uBaseRadius, e.baseRadius), i.uniform1f(s.uFullHalf, e.fullHalf), i.uniform1f(s.uEnv, e.env), i.uniform1f(s.uShimMix, e.shimMix), i.uniform1i(s.uMask, e.mask ? 1 : 0), i.uniform1i(s.uGenerating, e.generating ? 1 : 0), i.uniform1f(s.uMinScale, e.minScale), i.uniform1f(s.uPeakScale, e.peakScale), i.uniform1f(s.uIdleScale, e.idleScale), i.uniform1i(s.uEpiCount, Math.min(e.epiCount, be)), i.uniform2fv(s.uEpis, e.epis), i.uniform1f(s.uEpiRadius, e.epiRadius), i.uniform1f(s.uEpiFalloff, e.epiFalloff), i.uniform1f(s.uColorA, e.color[3]), i.uniform3f(s.uColorRGB, e.color[0], e.color[1], e.color[2]), i.uniform1f(s.uFalloffWarp, e.falloffWarp), i.uniform1f(s.uDither, e.dither), i.drawArraysInstanced(i.TRIANGLE_STRIP, 0, 4, r), e.mask && this._texOk && this._texImage) {
+      i.blendFunc(i.DST_ALPHA, i.ZERO), i.useProgram(this._imgProgram), i.bindVertexArray(this._imgVao);
+      const o = this._imgUniforms;
+      i.uniform2f(o.uResolution, e.cssW, e.cssH), i.uniform4f(o.uFrame, e.frameLeft, e.frameTop, e.frameRight, e.frameBottom), i.uniform2f(o.uFrameSize, e.frameRight - e.frameLeft, e.frameBottom - e.frameTop), i.uniform2f(o.uImageSize, this._texImage.naturalWidth, this._texImage.naturalHeight), i.activeTexture(i.TEXTURE0), i.bindTexture(i.TEXTURE_2D, this._texture), i.uniform1i(o.uImage, 0), i.drawArrays(i.TRIANGLE_STRIP, 0, 4);
+    }
+    i.disable(i.SCISSOR_TEST), i.bindVertexArray(null);
+  }
+  dispose() {
+    var i;
+    const e = this._gl;
+    e.deleteProgram(this._dotProgram), e.deleteProgram(this._imgProgram), e.deleteBuffer(this._cornerBuf), e.deleteBuffer(this._quadBuf), e.deleteBuffer(this._clipBuf), e.deleteVertexArray(this._dotVao), e.deleteVertexArray(this._imgVao), e.deleteTexture(this._texture), (i = e.getExtension("WEBGL_lose_context")) == null || i.loseContext();
+  }
+  _resize(e, i, r) {
+    if (e === this._appliedW && i === this._appliedH && r === this._appliedScale) return;
+    const s = this._gl;
+    s.canvas.width = Math.round(e * r), s.canvas.height = Math.round(i * r), s.canvas.style.width = `${e}px`, s.canvas.style.height = `${i}px`, s.viewport(0, 0, s.canvas.width, s.canvas.height), this._appliedW = e, this._appliedH = i, this._appliedScale = r;
+  }
+  _staticBuffer(e) {
+    const i = this._gl, r = i.createBuffer();
+    return i.bindBuffer(i.ARRAY_BUFFER, r), i.bufferData(i.ARRAY_BUFFER, new Float32Array(e), i.STATIC_DRAW), r;
+  }
+  _link(e, i) {
+    const r = this._gl, s = this._compile(r.VERTEX_SHADER, e), o = this._compile(r.FRAGMENT_SHADER, i), a = r.createProgram();
+    if (r.attachShader(a, s), r.attachShader(a, o), r.linkProgram(a), r.deleteShader(s), r.deleteShader(o), !r.getProgramParameter(a, r.LINK_STATUS)) {
+      const n = r.getProgramInfoLog(a);
+      throw r.deleteProgram(a), new Error(`DotGrid GL link failed: ${n}`);
+    }
+    return a;
+  }
+  _compile(e, i) {
+    const r = this._gl, s = r.createShader(e);
+    if (r.shaderSource(s, i), r.compileShader(s), !r.getShaderParameter(s, r.COMPILE_STATUS)) {
+      const o = r.getShaderInfoLog(s);
+      throw r.deleteShader(s), new Error(`DotGrid GL compile failed: ${o}`);
+    }
+    return s;
+  }
+}
+const ur = 1200, dr = 800, pr = 1.5, et = (t) => 1 - (1 - t) ** 3, fr = {
+  cellSize: 6,
+  dotRatio: 0.46,
+  sizeScale: 1,
+  minScale: 0.68,
+  peakScale: 1.6,
+  dither: 0.1,
+  epiCount: 2,
+  epiRadiusRatio: 0.4,
+  epiSpeed: 0.54,
+  epiWander: 0.115,
+  epiFalloff: 1.5,
+  falloffWarp: 0.12,
+  idleScale: 0.9,
+  maxDpr: 3,
+  edgeTau: 80,
+  enterMs: 380,
+  exitMs: 420,
+  shimEnterMs: 450,
+  shimExitMs: 450
+};
+class mr {
+  constructor(e, i) {
+    this._refs = null, this._ctx = null, this._gl = null, this._glImageEl = null, this._glImageReady = !1, this._cfg = { ...fr }, this._sizeMul = 1, this._dotColor = "rgba(0, 0, 0, 0.16)", this._dotColorRGBA = [0, 0, 0, 0.16], this._w = 0, this._h = 0, this._cols = 0, this._rows = 0, this._offsetX = 0, this._offsetY = 0, this._epiRadius = 1, this._appliedScale = 0, this._clip = new Float32Array(0), this._env = 0, this._envFrom = 0, this._envTo = 0, this._envStart = 0, this._envDur = 0, this._envAnimating = !1, this._shimMix = 0, this._shimFrom = 0, this._shimTo = 0, this._shimStart = 0, this._shimDur = 0, this._shimAnimating = !1, this._exitPending = !1, this._prevShim = !1, this._opacityManual = !1, this._hiddenImage = null, this._rafId = null, this._lastTime = 0, this._state = { shimmering: !1, empty: !0, generating: !1 }, this._epis = [], this._onThemeChange = () => {
+      this.refreshColor();
+    }, this._rectCache = null, this._glEpis = new Float32Array(16), this._tick = (r) => {
+      const s = this._lastTime ? Math.min(64, r - this._lastTime) : 16;
+      if (this._lastTime = r, this._rectCache = this._frameRect(), this._envAnimating) {
+        const a = Math.min(1, (r - this._envStart) / this._envDur);
+        this._env = this._envFrom + (this._envTo - this._envFrom) * et(a), a >= 1 && (this._env = this._envTo, this._envAnimating = !1);
+      }
+      if (this._shimAnimating) {
+        const a = Math.min(1, (r - this._shimStart) / this._shimDur);
+        this._shimMix = this._shimFrom + (this._shimTo - this._shimFrom) * et(a), a >= 1 && (this._shimMix = this._shimTo, this._shimAnimating = !1);
+      }
+      this._state.generating && !this._reduceMotion && this._moveEpicenters(s);
+      const o = this._followFrame(s);
+      this._draw(), this._rectCache = null, this._state.shimmering || this._envAnimating || this._shimAnimating || o ? this._rafId = requestAnimationFrame(this._tick) : (this._rafId = null, this._lastTime = 0);
+    }, e.addController(this), i && (this._cfg = { ...this._cfg, ...i }), this._reduceMotion = typeof window < "u" && typeof window.matchMedia == "function" ? window.matchMedia("(prefers-reduced-motion: reduce)").matches : !1;
+  }
+  /** True when either backend can paint. */
+  get _canDraw() {
+    return !!this._ctx || !!this._gl;
+  }
+  /** Dot half-size in px. A getter so live config tweaks apply. */
+  get _baseRadius() {
+    return this._cfg.cellSize * this._cfg.dotRatio / 2;
+  }
+  /** Canvas-size multiplier: ratio^sizeScale, where ratio = √(area / reference).
+   *  Exactly 1 at the reference size; sizeScale is the strength (0 = off, 1 =
+   *  proportional, >1 exaggerates, <0 inverts). Always positive, so it never
+   *  produces a negative radius/speed however far it's pushed. */
+  _computeSizeMul() {
+    return this._w <= 0 || this._h <= 0 ? 1 : Math.sqrt(this._w * this._h / (ur * dr)) ** this._cfg.sizeScale;
+  }
+  /** Wire the painter to the canvas's rendered elements. */
+  attach(e) {
+    if (this._refs = e, this._cfg.useWebgl !== !1 && (this._gl = Ce.create(e.surface)), this._gl || (this._ctx = e.surface.getContext("2d")), !!this._canDraw) {
+      if (this._readDotColor(), typeof ResizeObserver == "function" && (this._resizeObserver = new ResizeObserver(() => {
+        this._resize(), this.sync(this._state);
+      }), this._resizeObserver.observe(e.viewport), this._frameObserver = new ResizeObserver(() => this._ensureLoop()), this._frameObserver.observe(e.frame)), typeof window < "u" && typeof window.matchMedia == "function" && (this._schemeMql = window.matchMedia("(prefers-color-scheme: dark)"), this._schemeMql.addEventListener("change", this._onThemeChange)), typeof MutationObserver == "function" && typeof document < "u") {
+        this._themeObserver = new MutationObserver(this._onThemeChange);
+        for (const i of [document.documentElement, document.body])
+          i && this._themeObserver.observe(i, { attributes: !0, attributeFilter: ["class", "style", "data-theme"] });
+      }
+      this._resize(), this.sync(this._state);
+    }
+  }
+  hostDisconnected() {
+    var e, i, r, s, o;
+    (e = this._resizeObserver) == null || e.disconnect(), (i = this._frameObserver) == null || i.disconnect(), (r = this._themeObserver) == null || r.disconnect(), (s = this._schemeMql) == null || s.removeEventListener("change", this._onThemeChange), this._rafId !== null && cancelAnimationFrame(this._rafId), this._rafId = null, (o = this._gl) == null || o.dispose(), this._gl = null;
+  }
+  /** Notify the painter that the result image finished loading. */
+  onImageLoad() {
+    this._glImageReady = !1, this._tryStartExit(), this._ensureLoop();
+  }
+  /** Re-read the theme-driven overlay colour (e.g. after a theme switch). */
+  refreshColor() {
+    this._readDotColor(), this._rafId === null && this._draw();
+  }
+  /**
+   * Cancel any in-flight or pending cover/reveal and snap to the settled state —
+   * the revealed image (or the idle grid when empty). Used when the tab regains
+   * visibility: background-tab RAF/timer throttling can otherwise leave a reveal
+   * envelope frozen mid-play (or a cover armed), which would surface as a
+   * spurious shimmer on return even though nothing is generating.
+   */
+  settle() {
+    this._canDraw && (this._rafId !== null && (cancelAnimationFrame(this._rafId), this._rafId = null, this._lastTime = 0), this._exitPending = !1, this._envAnimating = !1, this._shimAnimating = !1, this._env = 0, this._shimMix = 0, this._prevShim = !1, this._showHiddenImage(), this._draw());
+  }
+  /**
+   * Reconcile to a new visual state. Drives the enter/exit envelopes off the
+   * shimmer transition, mirroring the prototype's `syncProgress`.
+   */
+  sync(e) {
+    if (this._state = e, !this._canDraw) return;
+    const i = e.shimmering;
+    i && !this._prevShim ? (this._exitPending = !1, this._initEpicenters(), this._hasImage() ? this._startEnv(1, this._cfg.enterMs) : (this._env = 1, this._envAnimating = !1, this._startShimMix(1, this._cfg.shimEnterMs))) : !i && this._prevShim && (this._hasImage() ? (this._env = 1, this._startEnv(0, this._cfg.exitMs), this._shimMix = 0) : e.empty ? (this._env = 0, this._envAnimating = !1, this._startShimMix(0, this._cfg.shimExitMs)) : this._exitPending = !0), this._prevShim = i, i || this._envAnimating || this._shimAnimating ? this._ensureLoop() : this._rafId === null && this._draw();
+  }
+  /** Merge live {@link ShimmerConfig} (host-supplied; the shimmer lab uses it for
+   *  slider tweaks). Re-applies layout-affecting params when already attached.
+   *  @internal */
+  setConfig(e) {
+    e && (this._cfg = { ...this._cfg, ...e }, this._canDraw && this.recalibrate());
+  }
+  /** Re-apply layout-affecting params (grid spacing, backing scale, epicenter
+   *  count) after a config change. Purely dynamic params are picked up by the
+   *  running animation frame. */
+  recalibrate() {
+    this._canDraw && (this._resize(), this._epis.length !== this._cfg.epiCount && this._initEpicenters(), this._rafId === null && this._draw());
+  }
+  /** Hard reset to the static initial (no-image) grid (used by "Start over"). */
+  reset() {
+    this._env = 0, this._envAnimating = !1, this._shimMix = 0, this._shimAnimating = !1, this._exitPending = !1, this._prevShim = !1, this._epis.length = 0, this._state = { shimmering: !1, empty: !0, generating: !1 }, this._restoreOpacity(), this._canDraw && (this._snapClip(), this._draw());
+  }
+  _now() {
+    return typeof performance < "u" && typeof performance.now == "function" ? performance.now() : Date.now();
+  }
+  _readDotColor() {
+    if (!this._refs) return;
+    const e = getComputedStyle(this._refs.surface).color;
+    e && (this._dotColor = e, this._dotColorRGBA = this._parseColor(e));
+  }
+  /** Resolve any CSS colour string to 0..1 RGBA via a 1×1 scratch context. */
+  _parseColor(e) {
+    if (this._scratch2d === void 0) {
+      const s = document.createElement("canvas");
+      s.width = s.height = 1, this._scratch2d = s.getContext("2d", { willReadFrequently: !0 });
+    }
+    const i = this._scratch2d;
+    if (!i) return this._dotColorRGBA;
+    i.clearRect(0, 0, 1, 1), i.fillStyle = "#000", i.fillStyle = e, i.fillRect(0, 0, 1, 1);
+    const r = i.getImageData(0, 0, 1, 1).data;
+    return [r[0] / 255, r[1] / 255, r[2] / 255, r[3] / 255];
+  }
+  _hasImage() {
+    var i;
+    const e = ((i = this._refs) == null ? void 0 : i.getImage()) ?? null;
+    return !!e && !!e.getAttribute("src") && e.complete && e.naturalWidth > 0;
+  }
+  /** The grid masks the image while shimmering and during the reveal envelope. */
+  _maskingImage() {
+    return this._hasImage() && !this._state.empty && (this._state.shimmering || this._env > 1e-3);
+  }
+  _startEnv(e, i) {
+    if (i <= 0 || this._reduceMotion) {
+      this._env = e, this._envTo = e, this._envAnimating = !1;
+      return;
+    }
+    this._envFrom = this._env, this._envTo = e, this._envStart = this._now(), this._envDur = i, this._envAnimating = !0, this._ensureLoop();
+  }
+  _startShimMix(e, i) {
+    if (i <= 0 || this._reduceMotion) {
+      this._shimMix = e, this._shimAnimating = !1;
+      return;
+    }
+    this._shimFrom = this._shimMix, this._shimTo = e, this._shimStart = this._now(), this._shimDur = i, this._shimAnimating = !0, this._ensureLoop();
+  }
+  /** Frame rectangle in viewport coordinates, read from the *live* layout. */
+  _frameRect() {
+    const e = this._refs, i = e.frame.getBoundingClientRect(), r = e.viewport.getBoundingClientRect(), s = i.left - r.left, o = i.top - r.top;
+    return { left: s, top: o, right: s + i.width, bottom: o + i.height };
+  }
+  /** The frame rect, reusing the per-tick cache when one is active. */
+  _liveRect() {
+    return this._rectCache ?? this._frameRect();
+  }
+  /** Epicentre falloff radius for the live frame. Based on the frame's geometric
+   *  mean √(w·h) — a square-equivalent size — rather than its width, so the
+   *  spotlight stays balanced on portrait frames (a narrow width would otherwise
+   *  shrink it). Stays a constant *relative* fraction of the frame on any AR. */
+  _epiRadiusFor(e) {
+    const i = Math.max(0, e.right - e.left), r = Math.max(0, e.bottom - e.top);
+    return Math.sqrt(i * r) * this._cfg.epiRadiusRatio || 1;
+  }
+  _inFrame(e, i, r) {
+    return e - this._baseRadius >= r.left && e + this._baseRadius <= r.right && i - this._baseRadius >= r.top && i + this._baseRadius <= r.bottom;
+  }
+  _snapClip() {
+    const e = this._frameRect(), i = this._cfg.cellSize;
+    let r = 0;
+    for (let s = 0; s < this._rows; s++) {
+      const o = this._offsetY + s * i;
+      for (let a = 0; a < this._cols; a++, r++)
+        this._clip[r] = this._inFrame(this._offsetX + a * i, o, e) ? 1 : 0;
+    }
+  }
+  /** Ease the mask toward the live frame. Returns true while still settling. */
+  _followFrame(e) {
+    const i = this._liveRect(), r = this._cfg.cellSize, s = this._reduceMotion ? 1 : 1 - Math.exp(-e / this._cfg.edgeTau);
+    let o = !1, a = 0;
+    for (let n = 0; n < this._rows; n++) {
+      const l = this._offsetY + n * r;
+      for (let h = 0; h < this._cols; h++, a++) {
+        const p = this._inFrame(this._offsetX + h * r, l, i) ? 1 : 0;
+        let u = this._clip[a] + (p - this._clip[a]) * s;
+        Math.abs(p - u) < 2e-3 ? u = p : o = !0, this._clip[a] = u;
+      }
+    }
+    return o;
+  }
+  _allocate() {
+    const e = this._cfg.cellSize;
+    this._cols = Math.max(1, Math.round(this._w / e)), this._rows = Math.max(1, Math.round(this._h / e)), this._offsetX = (this._w - (this._cols - 1) * e) / 2, this._offsetY = (this._h - (this._rows - 1) * e) / 2, this._clip = new Float32Array(this._cols * this._rows), this._snapClip();
+  }
+  /** Backing-store density: the device pixel ratio, capped at
+   *  {@link ShimmerConfig.maxDpr}. Rendering 1:1 with the device keeps the crisp
+   *  flat-alpha squares sharp. The animated 2D path is additionally capped at
+   *  {@link MAX_ANIMATED_DPR} so per-frame raster stays cheap on hi-dpi. */
+  _scale(e = !1) {
+    const i = Math.min(window.devicePixelRatio || 1, this._cfg.maxDpr);
+    return e ? Math.min(i, pr) : i;
+  }
+  /** Size the backing store to `scale`× the viewport. Note: setting width/height
+   *  clears the canvas and resets the context, so the transform is re-applied. */
+  _applyBacking(e) {
+    const i = this._refs, r = this._ctx;
+    !i || !r || (i.surface.width = Math.round(this._w * e), i.surface.height = Math.round(this._h * e), i.surface.style.width = `${this._w}px`, i.surface.style.height = `${this._h}px`, r.setTransform(e, 0, 0, e, 0, 0), this._appliedScale = e);
+  }
+  /** Switch backing density when the mode flips (crisp squares ↔ smooth bells).
+   *  The grid layout is unchanged, so the eased clip state is preserved. */
+  _ensureScale(e) {
+    const i = this._scale(e);
+    i !== this._appliedScale && this._applyBacking(i);
+  }
+  _resize() {
+    const e = this._refs;
+    !e || !this._canDraw || (this._w = e.viewport.clientWidth, this._h = e.viewport.clientHeight, !(this._w <= 0 || this._h <= 0) && (this._sizeMul = this._computeSizeMul(), this._allocate(), this._ctx ? this._applyBacking(this._scale()) : this._appliedScale = this._scale()));
+  }
+  // ----- Epicentre shimmer -----
+  _initEpicenters() {
+    const e = this._frameRect();
+    this._epis.length = 0;
+    const i = this._cfg.epiSpeed * this._sizeMul;
+    for (let r = 0; r < this._cfg.epiCount; r++) {
+      const s = Math.random() * Math.PI * 2;
+      this._epis.push({
+        x: e.left + Math.random() * (e.right - e.left),
+        y: e.top + Math.random() * (e.bottom - e.top),
+        vx: Math.cos(s) * i,
+        vy: Math.sin(s) * i
+      });
+    }
+  }
+  _moveEpicenters(e) {
+    this._epis.length === 0 && this._initEpicenters();
+    const i = this._liveRect(), r = this._cfg.epiSpeed * this._sizeMul;
+    for (const s of this._epis) {
+      const o = Math.atan2(s.vy, s.vx) + (Math.random() - 0.5) * this._cfg.epiWander;
+      s.vx = Math.cos(o) * r, s.vy = Math.sin(o) * r, s.x += s.vx * e, s.y += s.vy * e, s.x < i.left ? (s.x = i.left, s.vx = Math.abs(s.vx)) : s.x > i.right && (s.x = i.right, s.vx = -Math.abs(s.vx)), s.y < i.top ? (s.y = i.top, s.vy = Math.abs(s.vy)) : s.y > i.bottom && (s.y = i.bottom, s.vy = -Math.abs(s.vy));
+    }
+  }
+  _epiIntensity(e, i) {
+    let r = 0;
+    const s = this._cfg.falloffWarp, o = s > 0 ? Math.PI * 2 / (this._epiRadius * 0.7 || 1) : 0, a = o > 0 ? s * this._epiRadius * Math.sin(e * o + 1.3) * Math.cos(i * o * 0.9) : 0, n = this._cfg.epiFalloff;
+    for (const l of this._epis) {
+      const h = Math.max(0, Math.hypot(e - l.x, i - l.y) + a);
+      if (h >= this._epiRadius) continue;
+      const p = 1 - h / this._epiRadius;
+      let u = p * p * (3 - 2 * p);
+      n !== 1 && (u = u ** n), u > r && (r = u);
+    }
+    return r;
+  }
+  _staticScale() {
+    return this._cfg.idleScale;
+  }
+  /** Deterministic per-dot value in [0, 1) — a stable hash of the grid cell. */
+  _hash(e, i) {
+    const r = Math.sin(e * 12.9898 + i * 78.233) * 43758.5453;
+    return r - Math.floor(r);
+  }
+  _shimmerScale(e, i, r, s) {
+    const o = this._epiIntensity(r, s), { minScale: a, peakScale: n } = this._cfg, l = (this._hash(e, i) - 0.5) * this._cfg.dither * o;
+    return a + (n - a) * o + l;
+  }
+  _drawCover(e) {
+    var u;
+    const i = this._ctx, r = (u = this._refs) == null ? void 0 : u.getImage();
+    if (!r) return;
+    const s = r.naturalWidth, o = r.naturalHeight;
+    if (!s || !o) return;
+    const a = e.right - e.left, n = e.bottom - e.top, l = Math.max(a / s, n / o), h = s * l, p = o * l;
+    i.drawImage(r, e.left + (a - h) / 2, e.top + (n - p) / 2, h, p);
+  }
+  _setOpacity(e) {
+    const i = this._refs;
+    if (!i) return;
+    const r = i.getImage();
+    e ? (this._opacityManual || (i.surface.style.transition = "none", i.surface.style.opacity = "1", this._opacityManual = !0), r && r !== this._hiddenImage && (this._showHiddenImage(), r.style.transition = "none", r.style.opacity = "0", this._hiddenImage = r)) : (this._opacityManual && (i.surface.style.transition = "", i.surface.style.opacity = "", this._opacityManual = !1), this._showHiddenImage());
+  }
+  /** Restore the element we forced transparent (if it's still in the DOM). */
+  _showHiddenImage() {
+    const e = this._hiddenImage;
+    e && (e.isConnected && (e.style.transition = "", e.style.opacity = "1"), this._hiddenImage = null);
+  }
+  _restoreOpacity() {
+    const e = this._refs;
+    this._opacityManual && e && (e.surface.style.transition = "", e.surface.style.opacity = "", this._opacityManual = !1), this._showHiddenImage();
+  }
+  _draw() {
+    if (this._gl) {
+      this._drawGL();
+      return;
+    }
+    const e = this._ctx;
+    if (!e || this._w <= 0 || this._h <= 0) return;
+    const i = this._maskingImage();
+    if (this._setOpacity(i), !(this._state.shimmering || this._state.empty || i)) return;
+    const r = i || this._state.shimmering || this._envAnimating || this._shimAnimating;
+    this._ensureScale(r), e.clearRect(0, 0, this._w, this._h);
+    const s = this._liveRect();
+    this._epiRadius = this._epiRadiusFor(s);
+    const o = this._cfg.cellSize, a = o / 2;
+    e.fillStyle = i ? "#000" : this._dotColor;
+    const n = typeof Path2D == "function" ? new Path2D() : null;
+    let l = 0;
+    for (let h = 0; h < this._rows; h++) {
+      const p = this._offsetY + h * o;
+      for (let u = 0; u < this._cols; u++, l++) {
+        const _ = this._clip[l];
+        if (_ <= 0) continue;
+        const x = this._offsetX + u * o;
+        let w;
+        if (i) {
+          const R = this._reduceMotion ? 1 : this._state.generating ? this._shimmerScale(u, h, x, p) : this._cfg.minScale, I = this._baseRadius * R;
+          w = (a + this._env * (I - a)) * _;
+        } else {
+          let R = this._staticScale();
+          if (!this._reduceMotion && this._shimMix > 0) {
+            const I = this._shimmerScale(u, h, x, p);
+            R += (I - R) * this._shimMix;
+          }
+          w = this._baseRadius * R * _;
+        }
+        if (w <= 0) continue;
+        const $ = w * 2;
+        n ? n.rect(x - w, p - w, $, $) : e.fillRect(x - w, p - w, $, $);
+      }
+    }
+    n && e.fill(n), i && (e.globalCompositeOperation = "source-in", this._drawCover(s), e.globalCompositeOperation = "source-over");
+  }
+  /** WebGL render path — mirrors {@link _draw}'s orchestration, but the per-dot
+   *  size/brightness and the image mask are computed on the GPU. */
+  _drawGL() {
+    const e = this._gl, i = this._refs;
+    if (!e || !i || this._w <= 0 || this._h <= 0) return;
+    const r = this._maskingImage();
+    if (this._setOpacity(r), !(this._state.shimmering || this._state.empty || r)) return;
+    const s = this._liveRect();
+    if (this._epiRadius = this._epiRadiusFor(s), r) {
+      const l = i.getImage();
+      (l !== this._glImageEl || l !== null && l.complete && !this._glImageReady) && (e.setImage(l && l.complete && l.naturalWidth > 0 ? l : null), this._glImageEl = l, this._glImageReady = e.hasImage);
+    }
+    const o = Math.min(this._epis.length, 8);
+    for (let l = 0; l < o; l++)
+      this._glEpis[l * 2] = this._epis[l].x, this._glEpis[l * 2 + 1] = this._epis[l].y;
+    const a = this._cfg.cellSize, n = {
+      cssW: this._w,
+      cssH: this._h,
+      scale: this._appliedScale || this._scale(),
+      cols: this._cols,
+      rows: this._rows,
+      offsetX: this._offsetX,
+      offsetY: this._offsetY,
+      cell: a,
+      baseRadius: this._baseRadius,
+      fullHalf: a / 2,
+      env: this._env,
+      shimMix: this._shimMix,
+      mask: r,
+      // Reduced motion → uniform brightness (no roaming spotlight); the
+      // epicentres are already frozen by _tick in that case.
+      generating: this._state.generating && !this._reduceMotion,
+      minScale: this._cfg.minScale,
+      peakScale: this._cfg.peakScale,
+      idleScale: this._cfg.idleScale,
+      epis: this._glEpis,
+      epiCount: o,
+      epiRadius: this._epiRadius,
+      epiFalloff: this._cfg.epiFalloff,
+      falloffWarp: this._cfg.falloffWarp,
+      dither: this._cfg.dither,
+      color: this._dotColorRGBA,
+      clip: this._clip,
+      frameLeft: s.left,
+      frameTop: s.top,
+      frameRight: s.right,
+      frameBottom: s.bottom
+    };
+    e.render(n);
+  }
+  _ensureLoop() {
+    this._canDraw && this._rafId === null && (this._lastTime = 0, this._rafId = requestAnimationFrame(this._tick));
+  }
+  _tryStartExit() {
+    this._exitPending && this._hasImage() && (this._exitPending = !1, this._env = 1, this._startEnv(0, this._cfg.exitMs));
+  }
+}
+const _r = ":host{display:block;width:100%;height:100%;container-type:inline-size}.canvas{position:relative;width:100%;height:100%;min-height:240px;overflow:hidden}.canvas__bg{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--uc-ai-background)}.canvas__viewport{position:absolute;top:20px;right:20px;bottom:20px;left:20px;display:grid;place-items:center;pointer-events:none}.canvas__frame{position:relative;overflow:hidden}.canvas.is-ready .canvas__frame{transition:width .46s var(--uc-ai-ease-in-out, ease),height .46s var(--uc-ai-ease-in-out, ease)}.canvas__image{position:relative;z-index:1;width:100%;height:100%;display:block;object-fit:cover;transition:opacity .3s var(--uc-ai-ease-out, ease)}.canvas__under{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;width:100%;height:100%;display:block;object-fit:cover}.dot-grid{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:0;color:var(--uc-ai-dot-grid-color, color-mix(in srgb, currentColor 15%, transparent));transition:opacity .2s ease}.canvas.is-empty .dot-grid,.canvas.is-loading .dot-grid{opacity:1}.preload{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.layer.full{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;z-index:4}.fullscreen-btn{position:absolute;top:12px;right:12px;z-index:5;display:grid;place-items:center;width:var(--uc-ai-button-size, 32px);height:var(--uc-ai-button-size, 32px);padding:0;border:0;border-radius:var(--uc-ai-radius-button, 8px);background:color-mix(in oklch,var(--uc-ai-background) 75%,transparent);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:var(--uc-ai-foreground);cursor:pointer;opacity:0;transition:opacity var(--uc-ai-transition, .2s ease),background var(--uc-ai-transition, .2s ease)}.fullscreen-btn svg{width:18px;height:18px}.canvas:hover .fullscreen-btn,.fullscreen-btn:focus-visible{opacity:1}.fullscreen-btn:hover{background:var(--uc-ai-background)}@media(hover:none){.fullscreen-btn{opacity:1}}.canvas:fullscreen{background:#000}.canvas:fullscreen .canvas__bg{background:#000}.error-state{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:16px;text-align:center;color:var(--uc-ai-muted-foreground);font-size:.875em;z-index:3}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(prefers-reduced-motion:reduce){.canvas__viewport,.canvas__frame,.canvas__image,.fullscreen-btn{transition:none}}";
+var gr = Object.defineProperty, vr = Object.getOwnPropertyDescriptor, y = (t, e, i, r) => {
+  for (var s = r > 1 ? void 0 : r ? vr(e, i) : e, o = t.length - 1, a; o >= 0; o--)
+    (a = t[o]) && (s = (r ? a(e, i, s) : a(s)) || s);
+  return r && s && gr(e, i, s), s;
+};
+const br = 3 / 2, yr = 70;
+let g = class extends j {
+  constructor() {
+    super(...arguments), this.url = null, this.ratio = null, this.naturalRatio = null, this.busy = !1, this.alt = "", this.busyLabel = "", this.errorLabel = "", this.fullscreenLabel = "", this.exitFullscreenLabel = "", this.fullsizeUrl = null, this._displayedUrl = null, this._fadingUrl = null, this._failed = !1, this._frameReady = !1, this._fullscreen = !1, this._dotGrid = new mr(this), this._switchCovering = !1, this._seenUrls = /* @__PURE__ */ new Set(), this._instantSwap = !1, this._onVisibilityChange = () => {
+      document.visibilityState !== "visible" || this.busy || !this._displayedUrl || (this._clearCoverTimer(), this._switchCovering = !1, this._dotGrid.settle());
+    }, this._preloadedFullsizeUrl = null, this._onFullscreenKeydown = (t) => {
+      t.key === "Escape" && document.fullscreenElement && (t.preventDefault(), t.stopPropagation(), document.exitFullscreen());
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback(), document.addEventListener("visibilitychange", this._onVisibilityChange);
+  }
+  disconnectedCallback() {
+    var t;
+    super.disconnectedCallback(), (t = this._resizeObserver) == null || t.disconnect(), this._clearCoverTimer(), document.removeEventListener("keydown", this._onFullscreenKeydown, !0), document.removeEventListener("visibilitychange", this._onVisibilityChange);
+  }
+  firstUpdated() {
+    const t = this._dotGridEl, e = this._viewportEl, i = this._frameEl;
+    t && e && i && this._dotGrid.attach({ surface: t, viewport: e, frame: i, getImage: () => this._imageEl ?? null }), typeof ResizeObserver == "function" && e && (this._resizeObserver = new ResizeObserver(() => this._updateFrame()), this._resizeObserver.observe(e)), this._updateFrame(), requestAnimationFrame(() => {
+      requestAnimationFrame(() => {
+        this._frameReady = !0;
+      });
+    });
+  }
+  willUpdate(t) {
+    t.has("shimmerConfig") && this._dotGrid.setConfig(this.shimmerConfig), t.has("url") && (this.url ? this.url !== this._displayedUrl && (this._failed = !1) : (this._displayedUrl = null, this._failed = !1));
+  }
+  updated(t) {
+    const e = t.has("_displayedUrl");
+    (t.has("ratio") || t.has("naturalRatio") || e) && this._updateFrame(), (t.has("busy") || t.has("url") || e) && (this._updateSwitchCover(t.has("busy")), this._syncGrid());
+  }
+  _syncGrid() {
+    this._dotGrid.sync({
+      // The grid covers during a generation (`busy`) and during a slow image
+      // switch (`_switchCovering`), then materialises the result out of the dots.
+      shimmering: this.busy || this._switchCovering,
+      empty: this._displayedUrl == null,
+      // Only a real generation wanders the epicenters; switches/reveals are a
+      // uniform, ring-free growth.
+      generating: this.busy
+    });
+  }
+  /**
+   * Gate the dot transition for a plain history/source switch: only cover with
+   * dots if the new image is still loading after a short delay. A cached/instant
+   * switch skips the transition and swaps directly (no glitchy dot flash).
+   * Generations drive their own cover via `busy`, so they're left untouched.
+   */
+  _updateSwitchCover(t) {
+    if (!(this.url != null && this.url !== this._displayedUrl && !this._failed)) {
+      this._clearCoverTimer(), this._switchCovering = !1;
+      return;
+    }
+    if (this.busy) {
+      this._clearCoverTimer(), this._instantSwap = !1;
+      return;
+    }
+    if (t) {
+      this._clearCoverTimer(), this._instantSwap = !1, this._switchCovering = !0;
+      return;
+    }
+    if (this.url != null && this._seenUrls.has(this.url)) {
+      this._clearCoverTimer(), this._switchCovering = !1, this._instantSwap = !0;
+      return;
+    }
+    this._instantSwap = !1, !(this._switchCovering || this._coverTimer != null) && (this._coverTimer = window.setTimeout(() => {
+      this._coverTimer = void 0, this.url != null && this.url !== this._displayedUrl && !this._failed && !this.busy && !this._switchCovering && (this._switchCovering = !0, this._syncGrid());
+    }, yr));
+  }
+  _clearCoverTimer() {
+    this._coverTimer != null && (clearTimeout(this._coverTimer), this._coverTimer = void 0);
+  }
+  /** Reset the dot grid to its empty state — used when the editor starts over. */
+  resetGrid() {
+    this._dotGrid.reset();
+  }
+  _frameRatioValue() {
+    if (this.ratio && this.ratio > 0) return this.ratio;
+    if (this.naturalRatio && this.naturalRatio > 0) return this.naturalRatio;
+    const t = this._imageEl;
+    return t && t.naturalWidth > 0 && t.naturalHeight > 0 ? t.naturalWidth / t.naturalHeight : br;
+  }
+  /** Size the frame to the largest box of the chosen ratio that fits the viewport. */
+  _updateFrame() {
+    const t = this._viewportEl, e = this._frameEl;
+    if (!t || !e) return;
+    const i = t.clientWidth, r = t.clientHeight;
+    if (!i || !r) return;
+    const s = this._frameRatioValue();
+    let o, a;
+    i / r > s ? (a = r, o = a * s) : (o = i, a = o / s), e.style.width = `${Math.round(o)}px`, e.style.height = `${Math.round(a)}px`;
+  }
+  _onLoaded(t) {
+    const e = t.currentTarget.getAttribute("src");
+    if (!e || e !== this.url) return;
+    const i = this._displayedUrl;
+    this._instantSwap && i && i !== e && (this._fadingUrl = i), this._displayedUrl = e, this._failed = !1, this._seenUrls.add(e);
+  }
+  /**
+   * The on-screen image finished decoding. Driving the reveal off the displayed
+   * <img>'s own `load` (rather than the preload's `complete` at a microtask)
+   * makes the dot-grid reveal fire reliably, even on a cold cache.
+   */
+  _onDisplayedLoad() {
+    this._fadingUrl = null, this._updateFrame(), this._dotGrid.onImageLoad();
+  }
+  _onError() {
+    this._failed = !0, this.dispatchEvent(new CustomEvent("uc:image-error", { detail: { url: this.url }, bubbles: !0, composed: !0 }));
+  }
+  /** Fullscreen is unavailable on some platforms (e.g. iPhone Safari). */
+  get _fullscreenSupported() {
+    var t;
+    return document.fullscreenEnabled && typeof ((t = this._canvasEl) == null ? void 0 : t.requestFullscreen) == "function";
+  }
+  /** Warm the browser cache for the fullscreen rendition ahead of the click. */
+  _preloadFullsize() {
+    !this.fullsizeUrl || this.fullsizeUrl === this._preloadedFullsizeUrl || (this._preloadedFullsizeUrl = this.fullsizeUrl, new Image().src = this.fullsizeUrl);
+  }
+  _toggleFullscreen() {
+    var t;
+    document.fullscreenElement ? document.exitFullscreen() : (t = this._canvasEl) == null || t.requestFullscreen();
+  }
+  _onFullscreenChange() {
+    this._fullscreen = document.fullscreenElement != null, this._fullscreen ? document.addEventListener("keydown", this._onFullscreenKeydown, !0) : document.removeEventListener("keydown", this._onFullscreenKeydown, !0);
+  }
+  render() {
+    const t = this.url != null && this.url !== this._displayedUrl && !this._failed, e = this._displayedUrl == null, i = !e && !this._failed && !this.busy && this._fullscreenSupported, r = {
+      canvas: !0,
+      "is-empty": e,
+      "is-loading": this.busy,
+      "is-ready": this._frameReady
+    };
+    return f`
+      <div class=${S(r)} @fullscreenchange=${this._onFullscreenChange}>
+        <div class="canvas__bg"></div>
+
+        <div class="canvas__viewport">
+          <div class="canvas__frame">
+            ${// Previous image held underneath during an instant (cached) swap so
+    // the frame never blanks for the frame it takes the new <img> to
+    // paint; dropped on the new image's load.
+    this._fadingUrl ? f`<img class="canvas__under" src="${this._fadingUrl}" alt="" aria-hidden="true" crossorigin="anonymous" />` : v}
+            ${this._displayedUrl ? f`<img
+                    class="canvas__image"
+                    src="${this._displayedUrl}"
+                    alt="${this.alt || "AI image"}"
+                    decoding="async"
+                    crossorigin="anonymous"
+                    @load=${this._onDisplayedLoad}
+                  />` : v}
+          </div>
+          <canvas class="dot-grid" aria-hidden="true"></canvas>
+        </div>
+
+        ${// Full-quality rendition overlays the preview while fullscreen.
+    this._fullscreen && this.fullsizeUrl ? f`<img class="layer full" src="${this.fullsizeUrl}" alt="${this.alt || "AI image"}" decoding="async" />` : v}
+        ${t ? f`<img
+                class="preload"
+                src="${this.url}"
+                alt=""
+                aria-hidden="true"
+                decoding="async"
+                crossorigin="anonymous"
+                @load=${this._onLoaded}
+                @error=${this._onError}
+              />` : v}
+        ${this._failed ? f`<div class="error-state" role="alert">${this.errorLabel || "Failed to load image"}</div>` : v}
+        ${i ? f`
+              <button
+                type="button"
+                class="fullscreen-btn"
+                data-testid="fullscreen-btn"
+                aria-label="${this._fullscreen ? this.exitFullscreenLabel : this.fullscreenLabel}"
+                @mouseenter=${this._preloadFullsize}
+                @focus=${this._preloadFullsize}
+                @click=${this._toggleFullscreen}
+              >
+                ${te(this._fullscreen ? Ni : Di)}
+              </button>
+            ` : v}
+        <span class="sr-only" role="status" aria-live="polite">${this.busy ? this.busyLabel : ""}</span>
+      </div>
+    `;
+  }
+};
+g.styles = B(_r);
+y([
+  c()
+], g.prototype, "url", 2);
+y([
+  c({ type: Number })
+], g.prototype, "ratio", 2);
+y([
+  c({ type: Number, attribute: "natural-ratio" })
+], g.prototype, "naturalRatio", 2);
+y([
+  c({ type: Boolean })
+], g.prototype, "busy", 2);
+y([
+  c()
+], g.prototype, "alt", 2);
+y([
+  c({ attribute: "busy-label" })
+], g.prototype, "busyLabel", 2);
+y([
+  c({ attribute: "error-label" })
+], g.prototype, "errorLabel", 2);
+y([
+  c({ attribute: "fullscreen-label" })
+], g.prototype, "fullscreenLabel", 2);
+y([
+  c({ attribute: "exit-fullscreen-label" })
+], g.prototype, "exitFullscreenLabel", 2);
+y([
+  c({ attribute: "fullsize-url" })
+], g.prototype, "fullsizeUrl", 2);
+y([
+  c({ attribute: !1 })
+], g.prototype, "shimmerConfig", 2);
+y([
+  C()
+], g.prototype, "_displayedUrl", 2);
+y([
+  C()
+], g.prototype, "_fadingUrl", 2);
+y([
+  C()
+], g.prototype, "_failed", 2);
+y([
+  C()
+], g.prototype, "_frameReady", 2);
+y([
+  C()
+], g.prototype, "_fullscreen", 2);
+y([
+  F(".canvas")
+], g.prototype, "_canvasEl", 2);
+y([
+  F(".canvas__viewport")
+], g.prototype, "_viewportEl", 2);
+y([
+  F(".canvas__frame")
+], g.prototype, "_frameEl", 2);
+y([
+  F(".canvas__image")
+], g.prototype, "_imageEl", 2);
+y([
+  F(".dot-grid")
+], g.prototype, "_dotGridEl", 2);
+g = y([
+  G("uc-ai-canvas")
+], g);
+const wr = ":host{display:block;container-type:inline-size}.footer{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:var(--uc-ai-padding);background:transparent}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:var(--uc-ai-button-size);padding:0 14px;border:0;border-radius:var(--uc-ai-radius-button);font-family:inherit;font-size:14px;font-weight:500;cursor:pointer;transition:background .15s ease,filter .15s ease,transform .14s var(--uc-ai-ease-out, ease)}.btn:active{transform:scale(.97)}.btn--ghost{background:var(--uc-ai-secondary);color:var(--uc-ai-secondary-foreground)}.btn--primary{background:var(--uc-ai-primary);color:var(--uc-ai-primary-foreground)}@media(hover:hover)and (pointer:fine){.btn--ghost:hover{background:var(--uc-ai-secondary-hover)}.btn--primary:hover{background:var(--uc-ai-primary-hover)}}.btn--primary:disabled{opacity:.5;cursor:not-allowed;background:var(--uc-ai-primary)}.btn svg{width:14px;height:14px}@media(prefers-reduced-motion:reduce){.btn{transition-property:background,filter}.btn:active{transform:none}}";
+var xr = Object.defineProperty, kr = Object.getOwnPropertyDescriptor, re = (t, e, i, r) => {
+  for (var s = r > 1 ? void 0 : r ? kr(e, i) : e, o = t.length - 1, a; o >= 0; o--)
+    (a = t[o]) && (s = (r ? a(e, i, s) : a(s)) || s);
+  return r && s && xr(e, i, s), s;
+};
+let q = class extends j {
+  constructor() {
+    super(...arguments), this.cancelLabel = "", this.primaryLabel = "", this.primaryDisabled = !1;
+  }
+  _emitCancel() {
+    this.dispatchEvent(new CustomEvent("uc:cancel", { bubbles: !0, composed: !0 }));
+  }
+  _emitPrimary() {
+    this.dispatchEvent(new CustomEvent("uc:primary", { bubbles: !0, composed: !0 }));
+  }
+  render() {
+    return f`
+      <div class="footer">
+        <button type="button" class="btn btn--ghost" @click=${this._emitCancel}>
+          <span>${this.cancelLabel}</span>
+        </button>
+        <button
+          type="button"
+          class="btn btn--primary"
+          @click=${this._emitPrimary}
+          ?disabled=${this.primaryDisabled}
+        >
+          <span>${this.primaryLabel}</span>
+        </button>
+      </div>
+    `;
+  }
+};
+q.styles = B(wr);
+re([
+  c({ attribute: "cancel-label" })
+], q.prototype, "cancelLabel", 2);
+re([
+  c({ attribute: "primary-label" })
+], q.prototype, "primaryLabel", 2);
+re([
+  c({ type: Boolean, attribute: "primary-disabled" })
+], q.prototype, "primaryDisabled", 2);
+q = re([
+  G("uc-ai-footer")
+], q);
+const Er = ":host{--uc-ai-foreground: light-dark(#181818, #e1e1e1);--uc-ai-background: light-dark(#ffffff, #1b1b1b);--uc-ai-floating: var(--uc-floating, light-dark(#ffffff, #242424));--uc-ai-floating-border: var(--uc-floating-border, light-dark(transparent, rgba(255, 255, 255, .05)));--uc-ai-muted: light-dark(#f5f5f5, #242424);--uc-ai-muted-foreground: light-dark(#717171, #989898);--uc-ai-primary: light-dark(#174bd7, #579aff);--uc-ai-primary-hover: light-dark(#1141c0, #4a8aef);--uc-ai-primary-foreground: light-dark(#ffffff, #000000);--uc-ai-primary-transparent: light-dark(rgba(23, 75, 215, .07), rgba(87, 154, 255, .07));--uc-ai-secondary: light-dark(rgba(24, 24, 24, .05), rgba(225, 225, 225, .07));--uc-ai-secondary-hover: light-dark(rgba(24, 24, 24, .08), rgba(225, 225, 225, .1));--uc-ai-secondary-foreground: light-dark(#181818, #e1e1e1);--uc-ai-border: light-dark(#e4e4e8, #3d3d3d);--uc-ai-shadow-color: light-dark(rgba(24, 24, 24, .18), rgba(0, 0, 0, .5));--uc-ai-dialog-shadow: 0 6px 20px light-dark(rgba(0, 0, 0, .1), rgba(0, 0, 0, .25));--uc-ai-composer-shadow: 0 4px 14px light-dark(rgba(0, 0, 0, .18), rgba(0, 0, 0, .34)), 0 0 26px light-dark(rgba(0, 0, 0, .2), rgba(0, 0, 0, .42));--uc-ai-composer-shadow-peek: 0 2px 10px light-dark(rgba(0, 0, 0, .16), rgba(0, 0, 0, .34));--uc-ai-composer-radius: var(--uc-ai-radius-frame);--uc-ai-composer-radius-top: var(--uc-ai-composer-radius);--uc-ai-composer-radius-bottom: var(--uc-ai-composer-radius);--uc-ai-destructive: #d8473e;--uc-ai-destructive-foreground: light-dark(#b3261e, #ff9d96);--uc-ai-radius: 8px;--uc-ai-radius-button: var(--uc-ai-radius);--uc-ai-radius-input: calc(var(--uc-ai-radius) * 1.5);--uc-ai-radius-card: calc(var(--uc-ai-radius) * 2);--uc-ai-radius-frame: calc(var(--uc-ai-radius) * 2.25);--uc-ai-padding: 10px;--uc-ai-button-size: 32px;--uc-ai-font-family: system-ui, -apple-system, sans-serif;--uc-ai-font-size: 14px;--uc-ai-transition: .2s ease;--uc-ai-ease-out: cubic-bezier(.23, 1, .32, 1);--uc-ai-ease-in-out: cubic-bezier(.77, 0, .175, 1);--uc-ai-dot-grid-color: light-dark(rgba(0, 0, 0, .21), rgba(255, 255, 255, .1));--uc-ai-prompt-max-lines: 6;--uc-ai-prompt-max-height: calc(var(--uc-ai-prompt-max-lines) * 1.5em + 10px);display:block;width:100%;height:100%;font-family:var(--uc-ai-font-family);font-size:var(--uc-ai-font-size);color:var(--uc-ai-foreground);color-scheme:light dark;container-type:inline-size}:host([hidden]){display:none}:host(.uc-light),:host-context(.uc-light){color-scheme:light}:host(.uc-dark),:host-context(.uc-dark){color-scheme:dark}.shell{display:flex;flex-direction:column;background:var(--uc-ai-background);border-radius:var(--uc-ai-radius-card);overflow:hidden;box-shadow:var(--uc-ai-dialog-shadow);height:100%}.stage{position:relative;flex:1;min-height:360px;overflow:hidden;background:var(--uc-ai-background)}uc-ai-canvas{position:absolute;top:0;right:0;bottom:0;left:0}.composer{width:700px;max-width:calc(100% - 40px)}.composer__content{display:flex;flex-direction:column;gap:14px;align-items:center}.composer--overlay{position:absolute;left:50%;transform:translate(-50%);z-index:5;transition:transform .48s var(--uc-ai-ease-out)}.composer--overlay-bottom{bottom:32px}.composer--overlay-top{top:32px}.composer--docked{margin-inline:auto;padding:14px 20px;position:relative;z-index:1}.composer--docked-bottom{padding-top:8px}.composer--docked-top{padding-bottom:8px}.history-pinned{position:absolute;left:50%;transform:translate(-50%);width:700px;max-width:calc(100% - 40px);z-index:5}.history-pinned--canvas-top{top:20px}.history-pinned--canvas-bottom{bottom:20px}.history-pinned--docked.history-pinned--canvas-top{top:6px}.history-pinned--docked.history-pinned--canvas-bottom{bottom:6px}.dock-hotzone{position:absolute;left:0;right:0;height:100px;z-index:4;pointer-events:none}.dock-hotzone--bottom{bottom:0}.dock-hotzone--top{top:0}:host([composer-auto-hide]) .stage:not(.is-empty) .dock-hotzone{pointer-events:auto}.composer-fade{position:absolute;left:0;right:0;height:26px;z-index:6;pointer-events:none;opacity:0;transition:opacity .3s var(--uc-ai-ease-out)}.composer-fade--bottom{bottom:0;background:linear-gradient(to top,var(--uc-ai-background) 0,var(--uc-ai-background) 8px,transparent)}.composer-fade--top{top:0;background:linear-gradient(to bottom,var(--uc-ai-background) 0,var(--uc-ai-background) 8px,transparent)}:host([composer-auto-hide]) .stage:not(.is-empty) .composer-fade{opacity:1}:host([composer-auto-hide]) .stage:not(.is-empty):has(.dock-hotzone:hover) .composer-fade,:host([composer-auto-hide]) .stage:not(.is-empty):has(.composer--overlay:hover) .composer-fade,:host([composer-auto-hide]) .stage:not(.is-empty):has(.composer--overlay:focus-within) .composer-fade{opacity:0}:host([composer-auto-hide]) .stage:not(.is-empty) .composer--overlay-bottom{transform:translate(-50%,calc(100% + 4px))}:host([composer-auto-hide]) .stage:not(.is-empty) .composer--overlay-top{transform:translate(-50%,calc(-100% - 4px))}:host([composer-auto-hide]) .stage:not(.is-empty):not(:has(.composer--overlay:hover)):not(:has(.composer--overlay:focus-within)):not(:has(.dock-hotzone:hover)) .composer--overlay{--uc-ai-composer-shadow: var(--uc-ai-composer-shadow-peek)}:host([composer-auto-hide]) .stage:not(.is-empty):not(:has(.composer--overlay:hover)):not(:has(.composer--overlay:focus-within)):not(:has(.dock-hotzone:hover)) .composer--overlay-bottom{--uc-ai-composer-radius-bottom: 0px}:host([composer-auto-hide]) .stage:not(.is-empty):not(:has(.composer--overlay:hover)):not(:has(.composer--overlay:focus-within)):not(:has(.dock-hotzone:hover)) .composer--overlay-top{--uc-ai-composer-radius-top: 0px}:host([composer-auto-hide]) .stage:not(.is-empty):has(.dock-hotzone--bottom:hover) .composer--overlay-bottom,:host([composer-auto-hide]) .stage:not(.is-empty):has(.composer--overlay-bottom:hover) .composer--overlay-bottom,:host([composer-auto-hide]) .stage:not(.is-empty):has(.composer--overlay-bottom:focus-within) .composer--overlay-bottom,:host([composer-auto-hide]) .stage:not(.is-empty):has(.dock-hotzone--top:hover) .composer--overlay-top,:host([composer-auto-hide]) .stage:not(.is-empty):has(.composer--overlay-top:hover) .composer--overlay-top,:host([composer-auto-hide]) .stage:not(.is-empty):has(.composer--overlay-top:focus-within) .composer--overlay-top{transform:translate(-50%)}:host([composer-auto-hide]) .stage:not(.is-empty):has(.dock-hotzone:hover) .dock-hotzone,:host([composer-auto-hide]) .stage:not(.is-empty):has(.composer--overlay:hover) .dock-hotzone,:host([composer-auto-hide]) .stage:not(.is-empty):has(.composer--overlay:focus-within) .dock-hotzone{height:320px}:host([composer-auto-hide]) .shell--has-image .composer--docked{margin-block:8px 14px;position:relative}:host([composer-auto-hide]) .shell--has-image .composer--docked .composer__content{position:relative;transition:transform .5s var(--uc-ai-ease-out)}:host([composer-auto-hide]) .shell--has-image .composer--docked .composer__content uc-ai-history{position:absolute;left:0;right:0}:host([composer-auto-hide]) .shell--has-image .composer--docked-bottom .composer__content uc-ai-history{bottom:calc(100% + 14px)}:host([composer-auto-hide]) .shell--has-image .composer--docked-top .composer__content uc-ai-history{top:calc(100% + 14px)}:host([composer-auto-hide]) .shell--has-image .composer--docked-bottom{clip-path:inset(-200px -200px 0 -200px)}:host([composer-auto-hide]) .shell--has-image .composer--docked-top{clip-path:inset(0 -200px -200px -200px)}:host([composer-auto-hide]) .shell--has-image:not(:has(.composer--docked:hover)):not(:has(.composer--docked:focus-within)) .composer--docked{--uc-ai-composer-shadow: var(--uc-ai-composer-shadow-peek)}:host([composer-auto-hide]) .shell--has-image:not(:has(.composer--docked:hover)):not(:has(.composer--docked:focus-within)) .composer--docked-bottom .composer__content{transform:translateY(calc(100% - 22px))}:host([composer-auto-hide]) .shell--has-image:not(:has(.composer--docked:hover)):not(:has(.composer--docked:focus-within)) .composer--docked-top .composer__content{transform:translateY(calc(-100% + 22px))}uc-ai-history,uc-ai-prompt-row{width:100%}.error-box{position:absolute;top:0;right:0;bottom:0;left:0;z-index:6;display:grid;place-items:center;padding:20px;pointer-events:none}.error-box__card{pointer-events:auto;max-width:75%;padding:10px 15px;background:var(--uc-ai-floating, var(--uc-ai-background));border:1px solid var(--uc-ai-floating-border, transparent);border-radius:var(--uc-ai-radius-card);box-shadow:var(--uc-ai-dialog-shadow);color:var(--uc-ai-destructive-foreground);font-size:14px;line-height:1.4;text-align:center}";
+var Rr = Object.defineProperty, Sr = Object.getOwnPropertyDescriptor, m = (t, e, i, r) => {
+  for (var s = r > 1 ? void 0 : r ? Sr(e, i) : e, o = t.length - 1, a; o >= 0; o--)
+    (a = t[o]) && (s = (r ? a(e, i, s) : a(s)) || s);
+  return r && s && Rr(e, i, s), s;
+};
+const Cr = ["top", "bottom"], $r = ["full", "available"], Ar = [
+  "composer-above",
+  "composer-below",
+  "canvas-top",
+  "canvas-bottom"
+];
+let d = class extends j {
+  constructor() {
+    super(...arguments), this.sourceUuid = null, this.pubkey = "", this.aspectRatios = null, this.localeName = "en", this.localeDefinitionOverride = {}, this.presetsOnly = !1, this.presets = {}, this.composerPlacement = "bottom", this.canvasFit = "available", this.historyPlacement = "composer-above", this.composerAutoHide = !1, this.toolbarPlacement = "bottom", this._prompt = "", this._selectedRatio = null, this._inputUrl = null, this._gen = new yi(this), this._history = new Mi(this), this._secure = new pt(this), this._localeStrings = N, this._localeToken = 0, this._lastPreviewUrl = null, this._ratioOptionsCache = /* @__PURE__ */ new Map(), this._labelForOption = (t) => t.labelKey ? this._l(t.labelKey) : "";
+  }
+  /** @internal */
+  willUpdate(t) {
+    const e = t.has("provider") || t.has("pubkey") || t.has("baseUrl") || t.has("cdnCname") || t.has("cdnCnamePrefixed");
+    e && (this._provider = this.provider ?? (this.pubkey ? new bi({
+      publicKey: this.pubkey,
+      baseUrl: this.baseUrl,
+      cdnBaseUrl: this.cdnCname,
+      cdnCnamePrefixed: this.cdnCnamePrefixed
+    }) : void 0)), t.has("secureDeliveryProxyUrlResolver") && this._secure.setResolver(this.secureDeliveryProxyUrlResolver);
+    const i = t.has("sourceUuid") || t.has("sourceFileInfo");
+    if (t.has("pubkey") && this._history.setNamespace(this.pubkey), i && this._gen.reset(), i || t.has("pubkey")) {
+      const s = this._history.lineage(this._sourceUuid);
+      this._gen.setHistory(s);
+      const o = s[0];
+      o && o.file.uuid !== this._sourceUuid && this._gen.setResult({
+        url: o.url,
+        uuid: o.file.uuid,
+        prompt: o.prompt,
+        mode: o.mode,
+        file: o.file
+      });
+    }
+    (e || i) && this._resolveInputUrl(), (e || i) && this._resolveSourceFileInfo();
+    const r = this._mode;
+    if (r !== this._lastMode)
+      this._lastMode = r, this._selectedRatio = r === "edit" ? W : this._defaultGenerateRatio();
+    else if (t.has("aspectRatios")) {
+      const s = this._selectedRatio;
+      O(s) && !this._standardRatios().some((o) => pe(o, s)) && (this._selectedRatio = this._defaultGenerateRatio());
+    }
+    t.has("aspectRatios") && this._ratioOptionsCache.clear(), (t.has("localeName") || t.has("localeDefinitionOverride")) && this._resolveLocale();
+  }
+  /** Load the active locale's built-in strings and layer its overrides on top. */
+  async _resolveLocale() {
+    var s, o;
+    const t = this.localeName || "en", e = ++this._localeToken;
+    let i = N;
+    if (t !== "en")
+      try {
+        i = await ((s = he[t]) == null ? void 0 : s.call(he)) ?? N;
+      } catch {
+        i = N;
+      }
+    if (e !== this._localeToken) return;
+    const r = (o = this.localeDefinitionOverride) == null ? void 0 : o[t];
+    this._localeStrings = r ? { ...i, ...r } : i;
+  }
+  _l(t) {
+    return ki(t, this._localeStrings);
+  }
+  /** Friendly message for the current failure: the per-`error_code` string
+   *  (`ai-enhancer-error-<code>`, overridable via the locale) when one is
+   *  defined, otherwise the generic error message. */
+  _errorMessage() {
+    const t = this._gen.errorCode;
+    if (t) {
+      const e = `ai-enhancer-error-${t}`, i = this._localeStrings[e] ?? N[e];
+      if (i) return i;
+    }
+    return this._l("ai-enhancer-error");
+  }
+  /** The source image's uuid, from whichever input was given. */
+  get _sourceUuid() {
+    var t;
+    return this.sourceUuid ?? ((t = this.sourceFileInfo) == null ? void 0 : t.uuid) ?? null;
+  }
+  /** UUID of the image the editor is currently operating on, if any. */
+  get _currentSourceUuid() {
+    var t;
+    return ((t = this._gen.result) == null ? void 0 : t.uuid) ?? this._sourceUuid;
+  }
+  /**
+   * Derived editor mode: `edit` whenever there is a current image (an input
+   * source or a generation result), otherwise `generate`. This makes the first
+   * successful generation flip the editor into edit mode for free.
+   */
+  get _mode() {
+    return this._currentSourceUuid ? "edit" : "generate";
+  }
+  /** Resolve the source uuid to a display URL via the provider's CDN base.
+   *  No-op for a provider that can't resolve uuids (generate-only). */
+  _resolveInputUrl() {
+    const t = this._sourceUuid, e = this._provider;
+    if (!t || !(e != null && e.resolveCdnUrl)) {
+      this._inputUrl = null;
+      return;
+    }
+    e.resolveCdnUrl(t).then((i) => {
+      this._sourceUuid === t && this._provider === e && (this._inputUrl = i, this._persistSourceEntry());
+    });
+  }
+  /** Persist the original source as the root node of its lineage, so it survives
+   *  reloads as the base of the strip. Runs once both its url and file info are
+   *  known; idempotent in storage. */
+  _persistSourceEntry() {
+    const t = this._sourceEntry;
+    t && this._history.recordSource({
+      uuid: t.file.uuid,
+      url: t.url,
+      prompt: t.prompt,
+      mode: t.mode,
+      ratio: t.ratio,
+      file: t.file
+    });
+  }
+  /** Effective source info: the injected value, else the fetched fallback. */
+  get _effectiveSourceFileInfo() {
+    return this.sourceFileInfo ?? this._fetchedFileInfo;
+  }
+  /** Resolve the source's file info — an injected {@link sourceFileInfo} wins;
+   *  otherwise fetch it from {@link sourceUuid}. Failures fall back silently. */
+  _resolveSourceFileInfo() {
+    if (this._fetchedFileInfo = void 0, this.sourceFileInfo) return;
+    const t = this.sourceUuid, e = this._provider;
+    !t || !(e != null && e.getFileInfo) || e.getFileInfo(t).then(
+      (i) => {
+        this.sourceUuid === t && this._provider === e && !this.sourceFileInfo && (this._fetchedFileInfo = i, this._persistSourceEntry());
+      },
+      () => {
+      }
+    );
+  }
+  get _displayUrl() {
+    return this._gen.resultUrl ?? this._inputUrl;
+  }
+  /**
+   * The original source image as a strip entry, so editing always shows what you
+   * started from and lets you revert to it. Display-only — it's not a generation,
+   * so it's never persisted. `null` until the source's url and file info are
+   * known, or in generate mode (no source).
+   */
+  get _sourceEntry() {
+    const t = this._sourceUuid, e = this._effectiveSourceFileInfo, i = this._inputUrl;
+    return !t || !i || !e ? null : { id: t, prompt: "", mode: "edit", url: i, file: e, ratio: W };
+  }
+  /** Strip entries: the generated results (newest-first) plus the original source
+   *  appended as the base (oldest) when editing. */
+  get _historyEntries() {
+    const t = this._sourceEntry;
+    return !t || this._gen.history.some((e) => e.file.uuid === t.file.uuid) ? this._gen.history : [...this._gen.history, t];
+  }
+  /**
+   * Intrinsic ratio of the image currently on the canvas, from metadata when
+   * known — the displayed result's file info, else the source's. Lets the canvas
+   * frame correctly before the image decodes. `null` when unknown.
+   */
+  _displayedNaturalRatio() {
+    var e, i;
+    const t = ((e = this._gen.result) == null ? void 0 : e.file.imageInfo) ?? ((i = this._effectiveSourceFileInfo) == null ? void 0 : i.imageInfo);
+    return t && t.width > 0 && t.height > 0 ? t.width / t.height : null;
+  }
+  /** CDN-optimized, secure-delivery-resolved rendition for the on-canvas preview. */
+  get _previewUrl() {
+    const t = this._displayUrl;
+    if (!t)
+      return this._lastPreviewUrl = null, null;
+    const e = this._secure.resolve(Ai(t, this.clientWidth || 1024));
+    return e != null && (this._lastPreviewUrl = e), this._lastPreviewUrl;
+  }
+  /** Full-resolution rendition for fullscreen, secure-delivery-resolved. */
+  get _fullsizeUrl() {
+    return this._secure.resolve(this._displayUrl);
+  }
+  /** The configured (or popular) standard ratios, validated. */
+  _standardRatios() {
+    const t = (this.aspectRatios ?? []).filter(ye);
+    return t.length > 0 ? t : [...yt];
+  }
+  /**
+   * The ratio the generate flow starts on: the prototype's landscape default
+   * ({@link DEFAULT_GENERATE_RATIO}) when it's in the available set, else the
+   * first available ratio.
+   */
+  _defaultGenerateRatio() {
+    const t = this._standardRatios();
+    return t.find((e) => pe(e, wt)) ?? t[0] ?? null;
+  }
+  _ratioOptions(t) {
+    const e = this._ratioOptionsCache.get(t);
+    if (e) return e;
+    const i = this._standardRatios().map(St), r = t === "edit" ? [{ value: W, labelKey: "ai-enhancer-aspect-original" }, ...i] : i;
+    return this._ratioOptionsCache.set(t, r), r;
+  }
+  /**
+   * Resolve the result's filename from {@link outputFilename}: a function gets
+   * the source's original name + this generation's 1-based counter; a string is
+   * used verbatim. Unset preserves the source's original name (`undefined` when
+   * generating from scratch → the provider's default).
+   */
+  _resolveOutputFilename() {
+    var i;
+    const t = ((i = this._effectiveSourceFileInfo) == null ? void 0 : i.originalFilename) || void 0, e = this.outputFilename;
+    return typeof e == "function" ? e(t, this._gen.history.length + 1) || void 0 : typeof e == "string" ? e || void 0 : t;
+  }
+  /**
+   * Resolve {@link metadata}: a static bag is used as-is; a callback is invoked
+   * with the source file (only when one exists — a generate-from-scratch gets
+   * none) and may be async. A throwing callback yields no metadata.
+   */
+  async _resolveMetadata() {
+    const t = this.metadata;
+    if (typeof t != "function") return t ?? void 0;
+    const e = this._effectiveSourceFileInfo;
+    if (e)
+      try {
+        return await t(e);
+      } catch {
+        return;
+      }
+  }
+  async _generate() {
+    const t = this._prompt.trim(), e = this._provider;
+    if (!t || !e) return;
+    const i = this._mode, r = i === "edit" ? this._currentSourceUuid : null, s = await this._resolveMetadata();
+    try {
+      const o = await this._gen.run({
+        provider: e,
+        prompt: t,
+        mode: i,
+        // "Original" (and generate's null) omit the ratio; only a concrete pick
+        // is sent — in edit that reshapes, otherwise the source AR is preserved.
+        aspectRatio: O(this._selectedRatio) ? this._selectedRatio : void 0,
+        // Record the full selection (incl. "Original") so the history entry can
+        // restore the picker when re-selected.
+        ratioValue: this._selectedRatio,
+        source: i === "edit" ? this._currentSourceUuid ?? void 0 : void 0,
+        // Name the result (resolver / static string / preserved source name).
+        filename: this._resolveOutputFilename(),
+        // Attach the configured metadata to the result, for both modes.
+        metadata: s
+      });
+      o && (this._prompt = "", this._history.record({
+        uuid: o.uuid,
+        source: r,
+        url: o.url,
+        prompt: o.prompt,
+        mode: o.mode,
+        ratio: this._selectedRatio,
+        file: o.file
+      }));
+    } catch (o) {
+      this.dispatchEvent(new CustomEvent("uc:error", { detail: { error: o }, bubbles: !0, composed: !0 }));
+    }
+  }
+  /** Discard the current image (input or result) and prompt history, returning
+   *  to a blank generate session. */
+  _onStartOver() {
+    var t;
+    this.sourceUuid = null, this.sourceFileInfo = void 0, this._inputUrl = null, this._fetchedFileInfo = void 0, this._prompt = "", this._gen.reset(), this._gen.clearHistory(), (t = this._canvasEl) == null || t.resetGrid();
+  }
+  _onPromptInput(t) {
+    this._prompt = t.detail.value;
+  }
+  _onSend() {
+    this._generate();
+  }
+  _onSelectHistoryEntry(t) {
+    const { entry: e } = t.detail;
+    this._prompt = e.prompt, this._selectedRatio = e.ratio, this._gen.setResult({
+      url: e.url,
+      uuid: e.file.uuid,
+      prompt: e.prompt,
+      mode: e.mode,
+      file: e.file
+    });
+  }
+  _onSelectAspectRatio(t) {
+    this._selectedRatio = t.detail.value;
+  }
+  _onSelectPreset(t) {
+    if (this._prompt = t.detail.preset.prompt, this.presetsOnly) {
+      this._generate();
+      return;
+    }
+    queueMicrotask(() => {
+      var e;
+      return (e = this._promptRow) == null ? void 0 : e.focusInput();
+    });
+  }
+  _onPrimary() {
+    const t = this._gen.result;
+    if (!t) return;
+    const e = {
+      url: t.url,
+      uuid: t.uuid,
+      prompt: t.prompt,
+      mode: t.mode,
+      aspectRatio: O(this._selectedRatio) ? this._selectedRatio : void 0,
+      file: t.file
+    };
+    this.dispatchEvent(new CustomEvent("uc:done", { detail: e, bubbles: !0, composed: !0 }));
+  }
+  _onCancel(t) {
+    t.stopPropagation(), this.dispatchEvent(new CustomEvent("uc:cancel", { bubbles: !0, composed: !0 }));
+  }
+  /** @internal */
+  render() {
+    var Ue, Te;
+    const t = this._mode, e = t === "edit" && !this.sourceUuid && !this.sourceFileInfo, i = fe[t].placeholderKey, r = ((Ue = this.presets) == null ? void 0 : Ue[t]) ?? fe[t].presets, s = this._gen.busy || !this._gen.result, o = this._ratioOptions(t), a = this._displayUrl != null, n = O(this._selectedRatio) ? this._selectedRatio[0] / this._selectedRatio[1] : null, l = {
+      stage: !0,
+      "is-empty": !a
+    }, h = Cr.includes(this.composerPlacement) ? this.composerPlacement : "bottom", u = ($r.includes(this.canvasFit) ? this.canvasFit : "available") === "full", _ = !u, x = `${u ? "overlay" : "docked"}-${h}`, w = Ar.includes(this.historyPlacement) ? this.historyPlacement : "composer-above", $ = w === "composer-above" || w === "composer-below", R = (u || _ && this.composerAutoHide) && $, I = w === "canvas-top" ? "top" : w === "canvas-bottom" ? "bottom" : h, H = this._historyEntries, Y = H.length > 0 || e, se = Y ? f`
+          <uc-ai-history
+            .busy=${this._gen.busy}
+            .entries=${H}
+            .selectedUuid=${((Te = this._gen.result) == null ? void 0 : Te.uuid) ?? this._sourceUuid}
+            ?show-start-over=${e}
+            start-over-label="${this._l("ai-enhancer-start-over")}"
+            list-label="${this._l("ai-enhancer-history-title")}"
+            .secureResolver=${this.secureDeliveryProxyUrlResolver}
+            @uc:select=${this._onSelectHistoryEntry}
+            @uc:start-over=${this._onStartOver}
+          ></uc-ai-history>
+        ` : v, ft = f`
+      <uc-ai-prompt-row
+        .mode=${t}
+        .value=${this._prompt}
+        .placeholder=${this._l(i)}
+        .busy=${this._gen.busy}
+        .allowCustom=${!this.presetsOnly}
+        send-aria-label="${this._l("ai-enhancer-generate-btn")}"
+        @uc:input=${this._onPromptInput}
+        @uc:send=${this._onSend}
+      >
+        ${r.length > 0 ? f`
+              <uc-ai-chips
+                slot="chips"
+                .mode=${t}
+                .presets=${r}
+                .busy=${this._gen.busy}
+                @uc:select=${this._onSelectPreset}
+              ></uc-ai-chips>
+            ` : v}
+        ${o.length > 0 ? f`
+              <uc-ai-aspect-ratio
+                slot="aspect-ratio"
+                .options=${o}
+                .selected=${this._selectedRatio}
+                .busy=${this._gen.busy}
+                .labelFor=${this._labelForOption}
+                aria-label-text="${this._l("ai-enhancer-aspect-ratio-aria")}"
+                @uc:select=${this._onSelectAspectRatio}
+              ></uc-ai-aspect-ratio>
+            ` : v}
+      </uc-ai-prompt-row>
+    `, oe = f`
+      <div
+        class=${S({
+      composer: !0,
+      "composer--overlay": u,
+      "composer--docked": _,
+      [`composer--${x}`]: !0
+    })}
+      >
+        <div class="composer__content">
+          ${R && w === "composer-above" ? se : v}
+          ${ft}
+          ${R && w === "composer-below" ? se : v}
+        </div>
+      </div>
+    `, mt = Y && !R ? f`<div
+            class=${S({
+      "history-pinned": !0,
+      "history-pinned--docked": _,
+      [`history-pinned--canvas-${I}`]: !0
+    })}
+          >
+            ${se}
+          </div>` : v, _t = this.composerAutoHide && u ? f`
+            <div class=${S({ "dock-hotzone": !0, [`dock-hotzone--${h}`]: !0 })}></div>
+            <div class=${S({ "composer-fade": !0, [`composer-fade--${h}`]: !0 })}></div>
+          ` : v, $e = this.toolbarPlacement === "top", Ae = f`
+      <uc-ai-footer
+        cancel-label="${this._l("ai-enhancer-cancel")}"
+        primary-label="${this._l("ai-enhancer-done-btn")}"
+        ?primary-disabled=${s}
+        @uc:cancel=${this._onCancel}
+        @uc:primary=${this._onPrimary}
+      ></uc-ai-footer>
+    `;
+    return f`
+      <div
+        class=${S({ shell: !0, "shell--has-image": a })}
+        role="region"
+        aria-label="${this._l(t === "edit" ? "ai-enhancer-edit-title" : "ai-enhancer-generate-title")}"
+      >
+        ${$e ? Ae : v}
+        ${_ && h === "top" ? oe : v}
+        <div class=${S(l)}>
+          <uc-ai-canvas
+            .url=${this._previewUrl}
+            .ratio=${n}
+            .naturalRatio=${this._displayedNaturalRatio()}
+            .fullsizeUrl=${this._fullsizeUrl}
+            .shimmerConfig=${this.shimmerConfig}
+            .busy=${this._gen.busy}
+            .alt=${this._prompt}
+            busy-label="${this._l("ai-enhancer-busy")}"
+            error-label="${this._l("ai-enhancer-error")}"
+            fullscreen-label="${this._l("ai-enhancer-fullscreen")}"
+            exit-fullscreen-label="${this._l("ai-enhancer-exit-fullscreen")}"
+          ></uc-ai-canvas>
+
+          ${_t}
+          ${mt}
+          ${u ? oe : v}
+
+          ${this._gen.error ? f`<div class="error-box" role="alert">
+                  <div class="error-box__card">${this._errorMessage()}</div>
+                </div>` : v}
+        </div>
+        ${_ && h === "bottom" ? oe : v}
+        ${$e ? v : Ae}
+      </div>
+    `;
+  }
+};
+d.styles = B(Er);
+m([
+  c({ attribute: "source-uuid" })
+], d.prototype, "sourceUuid", 2);
+m([
+  c({ attribute: !1 })
+], d.prototype, "sourceFileInfo", 2);
+m([
+  c({ attribute: !1 })
+], d.prototype, "outputFilename", 2);
+m([
+  c({ attribute: !1 })
+], d.prototype, "metadata", 2);
+m([
+  c()
+], d.prototype, "pubkey", 2);
+m([
+  c({ attribute: !1 })
+], d.prototype, "provider", 2);
+m([
+  c({ attribute: "base-url" })
+], d.prototype, "baseUrl", 2);
+m([
+  c({ attribute: "cdn-cname" })
+], d.prototype, "cdnCname", 2);
+m([
+  c({ attribute: "cdn-cname-prefixed" })
+], d.prototype, "cdnCnamePrefixed", 2);
+m([
+  c({ attribute: !1 })
+], d.prototype, "secureDeliveryProxyUrlResolver", 2);
+m([
+  c({ type: Array, attribute: "aspect-ratios", converter: (t) => t ? Ct(t) : null })
+], d.prototype, "aspectRatios", 2);
+m([
+  c({ attribute: "locale-name" })
+], d.prototype, "localeName", 2);
+m([
+  c({ attribute: !1 })
+], d.prototype, "localeDefinitionOverride", 2);
+m([
+  c({ type: Boolean, attribute: "presets-only" })
+], d.prototype, "presetsOnly", 2);
+m([
+  c({ attribute: !1 })
+], d.prototype, "presets", 2);
+m([
+  c({ attribute: "composer-placement" })
+], d.prototype, "composerPlacement", 2);
+m([
+  c({ attribute: "canvas-fit" })
+], d.prototype, "canvasFit", 2);
+m([
+  c({ attribute: "history-placement" })
+], d.prototype, "historyPlacement", 2);
+m([
+  c({ type: Boolean, attribute: "composer-auto-hide", reflect: !0 })
+], d.prototype, "composerAutoHide", 2);
+m([
+  c({ attribute: "toolbar-placement" })
+], d.prototype, "toolbarPlacement", 2);
+m([
+  c({ attribute: !1 })
+], d.prototype, "shimmerConfig", 2);
+m([
+  C()
+], d.prototype, "_prompt", 2);
+m([
+  C()
+], d.prototype, "_selectedRatio", 2);
+m([
+  C()
+], d.prototype, "_inputUrl", 2);
+m([
+  C()
+], d.prototype, "_fetchedFileInfo", 2);
+m([
+  F("uc-ai-prompt-row")
+], d.prototype, "_promptRow", 2);
+m([
+  F("uc-ai-canvas")
+], d.prototype, "_canvasEl", 2);
+m([
+  C()
+], d.prototype, "_localeStrings", 2);
+d = m([
+  G("uc-ai-enhancer")
+], d);
+export {
+  Nr as I,
+  he as L,
+  yt as P,
+  d as U,
+  Dr as a,
+  N as e,
+  ye as i
+};