urfu-ui-kit-react 2.0.6-next.1 → 2.1.0

package/dist/dev/index.js

@@ -0,0 +1,838 @@
+import { useSyncExternalStore as It } from "react";
+let O = [], Mt = 1;
+const H = /* @__PURE__ */ new Set();
+let R = !1;
+function _() {
+  R || (R = !0, setTimeout(() => {
+    R = !1, H.forEach((t) => t());
+  }, 16));
+}
+function zt(t, e, n) {
+  const a = Date.now(), s = { id: Mt++, service: t, method: e.toUpperCase(), path: n, status: "pending", duration: null, endedAt: null, faked: !1 };
+  O = [...O.slice(-49), s], _();
+  let o = !1;
+  return (i, r) => {
+    o || (o = !0, s.status = i, s.faked = r, s.endedAt = Date.now(), s.duration = s.endedAt - a, _());
+  };
+}
+function Q() {
+  return [...O].reverse();
+}
+function ct() {
+  O = [], R = !1, _();
+}
+function qt(t) {
+  return H.add(t), () => {
+    H.delete(t);
+  };
+}
+const ut = "urfu-ui-kit:dev:", v = /* @__PURE__ */ new Map(), W = /* @__PURE__ */ new Set();
+let dt;
+const ft = (t) => `${ut}${t}`, jt = ["offline", "network", "slow"];
+let E = null;
+const C = /* @__PURE__ */ new Set();
+function Ut() {
+  let t;
+  try {
+    t = new URLSearchParams(window.location.search).get("dev");
+  } catch {
+    return;
+  }
+  if (t !== null) {
+    if (t === "off") {
+      E = null;
+      try {
+        Object.keys(localStorage).filter((e) => e.startsWith(ut)).forEach((e) => localStorage.removeItem(e));
+      } catch {
+      }
+    } else
+      E = t.split(",").map((e) => e.trim()).filter(Boolean), C.clear();
+    try {
+      const e = new URL(window.location.href);
+      e.searchParams.delete("dev"), window.history.replaceState(window.history.state, "", e.href);
+    } catch {
+    }
+  }
+}
+function Ft(t) {
+  return [...jt, ...t.builtins ?? [], ...(t.groups ?? []).flatMap((e) => e.items.map((n) => n.id))];
+}
+function Nt(t) {
+  if (!E || C.has(t.config.service)) return;
+  const e = new Set(Ft(t.config)), n = E.filter((a) => e.has(a));
+  n.length && (C.add(t.config.service), t.state = { ...t.state, faults: n }, F(t.config.service, t.state));
+}
+function Ht(t) {
+  try {
+    const e = JSON.parse(localStorage.getItem(ft(t)) ?? "null");
+    return {
+      faults: Array.isArray(e == null ? void 0 : e.faults) ? e.faults.filter((n) => typeof n == "string") : [],
+      rules: Array.isArray(e == null ? void 0 : e.rules) ? e.rules : [],
+      ...(e == null ? void 0 : e.launcher) === "visible" || (e == null ? void 0 : e.launcher) === "hidden" ? { launcher: e.launcher } : {}
+    };
+  } catch {
+    return { faults: [], rules: [] };
+  }
+}
+function F(t, e) {
+  try {
+    localStorage.setItem(ft(t), JSON.stringify(e));
+  } catch {
+  }
+}
+function _t(t) {
+  t && (dt = t);
+}
+function Wt() {
+  return dt;
+}
+function Bt(t) {
+  const e = { config: t, state: Ht(t.service) };
+  return Nt(e), v.set(t.service, e), P(), e;
+}
+function Kt(t) {
+  v.delete(t), v.size || (E = null, C.clear()), P();
+}
+function m() {
+  return [...v.values()];
+}
+function Jt(t) {
+  return t ? v.get(t) : v.values().next().value;
+}
+function pt(t) {
+  return W.add(t), () => {
+    W.delete(t);
+  };
+}
+function P() {
+  W.forEach((t) => t());
+}
+function N(t, e) {
+  t.state = e, F(t.config.service, e), P();
+}
+function Xt(t, e, n) {
+  const a = t.state.faults.filter((s) => s !== e);
+  N(t, { ...t.state, faults: n ? [...a, e] : a });
+}
+function Gt(t, e) {
+  const n = `rule-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 6)}`;
+  N(t, { ...t.state, rules: [...t.state.rules, { ...e, id: n, enabled: !0 }] });
+}
+function Yt(t, e, n) {
+  N(t, { ...t.state, rules: t.state.rules.map((a) => a.id === e ? { ...a, enabled: n } : a) });
+}
+function Vt(t, e) {
+  N(t, { ...t.state, rules: t.state.rules.filter((n) => n.id !== e) });
+}
+function Qt() {
+  v.forEach((t) => {
+    t.state = { faults: [], rules: [], ...t.state.launcher ? { launcher: t.state.launcher } : {} }, F(t.config.service, t.state);
+  }), P();
+}
+function I(t) {
+  return t.state.faults.length + t.state.rules.filter((e) => e.enabled).length;
+}
+function Zt(t) {
+  return t.state.launcher ?? t.config.launcher ?? "visible";
+}
+function tt(t) {
+  v.forEach((e) => {
+    e.state = { ...e.state, launcher: t }, F(e.config.service, e.state);
+  }), P();
+}
+const te = 1e4, et = 200, T = ".u-error-screen, .u-notification-fail, .u-notification-warning, .u-offline-banner-offline";
+let M = [], ee = 1;
+const B = /* @__PURE__ */ new WeakMap(), z = /* @__PURE__ */ new Set();
+let w = null;
+const x = (t) => {
+  const e = (t ?? "").replace(/\s+/g, " ").trim();
+  return e.length > et ? `${e.slice(0, et - 1)}…` : e;
+}, ne = (t) => t.status === "network" || typeof t.status == "number" && t.status >= 400;
+function ae(t, e) {
+  var r;
+  const n = m().map((l) => l.config.service), a = (r = e.closest("[data-name]")) == null ? void 0 : r.getAttribute("data-name"), s = a && n.includes(a) ? a : null, o = Q().find((l) => ne(l) && l.endedAt !== null && t - l.endedAt <= te && (!s || l.service === s));
+  if (!o) return;
+  const i = `${o.method} ${o.path} → ${o.status === "network" ? "сеть" : o.status}`;
+  return n.length > 1 ? `${o.service}: ${i}` : i;
+}
+function oe(t) {
+  var a, s, o;
+  if (t.classList.contains("u-error-screen"))
+    return {
+      kind: "screen",
+      // Код — в data-error-code на корне заглушки: крупный код рисуется не у всех вариантов (forbidden, serverError).
+      // .u-error-screen-code — для разметки кита до появления атрибута.
+      code: x(t.dataset.errorCode || ((a = t.querySelector(".u-error-screen-code")) == null ? void 0 : a.textContent)) || void 0,
+      title: x((s = t.querySelector(".u-error-screen-title")) == null ? void 0 : s.textContent) || x(t.getAttribute("aria-label")) || "Заглушка",
+      text: x((o = t.querySelector(".u-error-screen-description")) == null ? void 0 : o.textContent) || void 0
+    };
+  if (t.classList.contains("u-offline-banner-offline"))
+    return { kind: "offline", title: x(t.textContent) || "Нет связи" };
+  const e = t.classList.contains("u-notification-fail") ? "fail" : "warning", n = t.querySelector(".u-notification-content") ?? t;
+  return { kind: "notification", variant: e, title: x(n.textContent) || "Уведомление" };
+}
+function nt(t) {
+  if (!t.isConnected || !t.matches(T)) return;
+  const e = oe(t);
+  if (!e) return;
+  const n = JSON.stringify(e);
+  if (B.get(t) === n) return;
+  B.set(t, n);
+  const a = Date.now();
+  M = [...M.slice(-29), { id: ee++, at: a, ...e, cause: ae(a, t) }], z.forEach((s) => s());
+}
+function se(t, e) {
+  t instanceof Element && (t.matches(T) && e.push(t), t.querySelectorAll(T).forEach((n) => e.push(n)));
+}
+function re() {
+  w || typeof MutationObserver > "u" || (w = new MutationObserver((t) => {
+    const e = [];
+    t.forEach((n) => {
+      if (n.type === "childList") {
+        n.addedNodes.forEach((s) => se(s, e));
+        return;
+      }
+      const a = n.target;
+      a.matches(T) ? e.push(a) : B.delete(a);
+    }), e.length && setTimeout(() => e.forEach(nt), 0);
+  }), w.observe(document.documentElement, { childList: !0, subtree: !0, attributes: !0, attributeFilter: ["data-error-code", "class"] }), document.querySelectorAll(T).forEach(nt));
+}
+function ie() {
+  w == null || w.disconnect(), w = null;
+}
+function K() {
+  return [...M].reverse();
+}
+function ht() {
+  M = [], z.forEach((t) => t());
+}
+function le(t) {
+  return z.add(t), () => {
+    z.delete(t);
+  };
+}
+const bt = 4e3, ce = /* @__PURE__ */ new Set(["GET", "HEAD"]);
+function ue(t, e) {
+  let n;
+  try {
+    n = new URL(t, window.location.href).pathname;
+  } catch {
+    return null;
+  }
+  if (!e) return n;
+  const a = e.replace(/\/+$/, ""), s = n.indexOf(a);
+  if (s < 0) return null;
+  const o = n.slice(s + a.length);
+  return o.startsWith("/") || o === "" ? o || "/" : null;
+}
+function de(t, e) {
+  const n = (i) => i.split("/").filter(Boolean), a = n(t.trim()), s = n(e), o = (i, r) => i === a.length ? r === s.length : a[i] === "**" ? o(i + 1, r) || r < s.length && o(i, r + 1) : r === s.length ? !1 : (a[i] === "*" || a[i] === s[r]) && o(i + 1, r + 1);
+  return o(0, 0);
+}
+function fe(t, e) {
+  var a;
+  const n = (a = t.method) == null ? void 0 : a.trim().toUpperCase();
+  return !n || n === "*" ? !0 : n === "WRITE" ? !ce.has(e) : n === e;
+}
+function pe(t, e) {
+  return t.html ? {
+    kind: "response",
+    delay: e,
+    status: t.status,
+    contentType: "text/html",
+    body: `<html><body><h1>${t.status} ${t.message ?? "Bad Gateway"}</h1></body></html>`
+  } : {
+    kind: "response",
+    delay: e,
+    status: t.status,
+    contentType: "application/json",
+    body: JSON.stringify({ statusCode: t.status, message: t.message ?? `Сбой из dev-панели: ${t.status}` })
+  };
+}
+function he(t) {
+  const e = new Set(t.state.faults);
+  return [...(t.config.groups ?? []).flatMap((a) => a.items).filter((a) => e.has(a.id)).flatMap((a) => [].concat(a.request ?? [])), ...t.state.rules.filter((a) => a.enabled)];
+}
+function gt(t) {
+  for (const e of m()) {
+    const n = ue(t, e.config.apiBase);
+    if (n !== null) return { entry: e, path: n };
+  }
+  return null;
+}
+function mt({ entry: t, path: e }, n) {
+  const a = n.toUpperCase(), s = new Set(t.state.faults), o = s.has("slow") ? bt : 0;
+  if (s.has("offline") || s.has("network")) return { kind: "network", delay: o };
+  const i = he(t).find((r) => fe(r, a) && de(r.path, e));
+  return i ? pe(i, o) : o ? { kind: "pass", delay: o } : null;
+}
+const vt = (t, e) => zt(t.entry.config.service, e, t.path), J = (t) => t.reason ?? new DOMException("The operation was aborted.", "AbortError");
+function be(t, e) {
+  return new Promise((n, a) => {
+    if (e != null && e.aborted) {
+      a(J(e));
+      return;
+    }
+    const s = setTimeout(n, t);
+    e == null || e.addEventListener("abort", () => {
+      clearTimeout(s), a(J(e));
+    }, { once: !0 });
+  });
+}
+const wt = /* @__PURE__ */ new Set([204, 205, 304]);
+let at = !1;
+function ge() {
+  at || typeof window > "u" || (at = !0, me(), we());
+}
+function me() {
+  var e;
+  const t = (e = window.fetch) == null ? void 0 : e.bind(window);
+  t && (window.fetch = async (n, a) => {
+    const s = typeof n == "object" && "url" in n ? n : null, o = gt(s ? s.url : String(n));
+    if (!o) return t(n, a);
+    const i = (a == null ? void 0 : a.method) ?? (s == null ? void 0 : s.method) ?? "GET", r = vt(o, i), l = mt(o, i), f = (a == null ? void 0 : a.signal) ?? (s == null ? void 0 : s.signal);
+    try {
+      if (l != null && l.delay && await be(l.delay, f), f != null && f.aborted) throw J(f);
+      if ((l == null ? void 0 : l.kind) === "network")
+        throw r("network", !0), new TypeError("Failed to fetch");
+      if ((l == null ? void 0 : l.kind) === "response")
+        return r(l.status, !0), new Response(wt.has(l.status) ? null : l.body, {
+          status: l.status,
+          headers: { "Content-Type": l.contentType }
+        });
+      const p = await t(n, a);
+      return r(p.status, !1), p;
+    } catch (p) {
+      throw r(f != null && f.aborted ? "abort" : "network", !1), p;
+    }
+  });
+}
+const ot = /* @__PURE__ */ new WeakMap(), st = /* @__PURE__ */ new WeakMap(), q = /* @__PURE__ */ new WeakMap(), ve = ["readyState", "responseURL", "status", "statusText", "responseText", "response", "getAllResponseHeaders", "getResponseHeader"];
+function we() {
+  if (typeof XMLHttpRequest > "u") return;
+  const t = XMLHttpRequest.prototype, e = t.open, n = t.send, a = t.abort;
+  t.open = function(o, i, ...r) {
+    rt(this), ve.forEach((l) => {
+      Reflect.deleteProperty(this, l);
+    }), ot.set(this, { method: o, url: String(i) }), e.call(this, o, i, ...r);
+  }, t.send = function(o) {
+    const i = ot.get(this), r = i ? gt(i.url) : null;
+    if (!i || !r) {
+      n.call(this, o);
+      return;
+    }
+    const l = vt(r, i.method);
+    st.set(this, l);
+    const f = mt(r, i.method), p = () => {
+      this.addEventListener("abort", () => l("abort", !1), { once: !0 }), this.addEventListener("loadend", () => l(this.status || "network", !1), { once: !0 }), n.call(this, o);
+    };
+    if (!f) {
+      p();
+      return;
+    }
+    q.set(this, setTimeout(() => {
+      if (q.delete(this), f.kind === "pass") {
+        p();
+        return;
+      }
+      l(f.kind === "network" ? "network" : f.status, !0), xe(this, f, i.url);
+    }, f.delay));
+  }, t.abort = function() {
+    var i;
+    if (!rt(this)) {
+      a.call(this);
+      return;
+    }
+    (i = st.get(this)) == null || i("abort", !1);
+    const o = xt(this);
+    o("readyState", 4), o("status", 0), X(this, ["readystatechange", "abort", "loadend"]), o("readyState", 0);
+  };
+}
+function rt(t) {
+  const e = q.get(t);
+  return e === void 0 ? !1 : (clearTimeout(e), q.delete(t), !0);
+}
+const xt = (t) => (e, n) => {
+  Object.defineProperty(t, e, { configurable: !0, get: () => n });
+}, X = (t, e) => {
+  e.forEach((n) => t.dispatchEvent(new ProgressEvent(n)));
+};
+function xe(t, e, n) {
+  const a = xt(t);
+  if (a("readyState", 4), a("responseURL", n), e.kind === "network") {
+    a("status", 0), a("statusText", ""), X(t, ["readystatechange", "error", "loadend"]);
+    return;
+  }
+  const s = wt.has(e.status) ? "" : e.body;
+  let o = s;
+  if (t.responseType === "json")
+    try {
+      o = e.contentType === "application/json" && s ? JSON.parse(s) : null;
+    } catch {
+      o = null;
+    }
+  a("status", e.status), a("statusText", String(e.status)), a("responseText", s), a("response", o);
+  const i = `content-type: ${e.contentType}\r
+`;
+  Object.defineProperty(t, "getAllResponseHeaders", { configurable: !0, value: () => i }), Object.defineProperty(t, "getResponseHeader", {
+    configurable: !0,
+    value: (r) => r.toLowerCase() === "content-type" ? e.contentType : null
+  }), X(t, ["readystatechange", "load", "loadend"]);
+}
+function Z(t) {
+  try {
+    t ? Reflect.deleteProperty(navigator, "onLine") : Object.defineProperty(navigator, "onLine", { configurable: !0, get: () => !1 }), window.dispatchEvent(new Event(t ? "online" : "offline"));
+  } catch {
+  }
+}
+function yt() {
+  const t = m().some((e) => e.state.faults.includes("offline"));
+  Qt(), ct(), ht(), t && Z(!0);
+}
+const ye = {
+  title: "Сеть",
+  items: [
+    { id: "offline", label: "Офлайн браузера", hint: "Полоса «Нет связи», запросы к API падают" },
+    { id: "network", label: "Обрыв соединения", hint: "Сеть есть, а сервер не отвечает" },
+    { id: "slow", label: "Медленные ответы", hint: `Задержка ${bt / 1e3} с на запросы к API` }
+  ]
+}, $e = {
+  authFail: { label: "Сбой входа", hint: "После перезагрузки сервис рисует заглушку входа" },
+  crashApp: { label: "Падение приложения", hint: "Ошибка рендера над каркасом сервиса" },
+  crashPage: { label: "Падение страницы", hint: "Каждая открытая страница падает, пока флаг включён" }
+}, G = [["", "Любой"], ["GET", "GET"], ["write", "Запись"], ["POST", "POST"], ["PUT", "PUT"], ["PATCH", "PATCH"], ["DELETE", "DELETE"]], Se = [400, 401, 403, 404, 409, 422, 429, 500, 502, 503, 504], d = (t) => String(t ?? "").replace(/[&<>"']/g, (e) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[e]), ke = `
+:host { all: initial; }
+* { box-sizing: border-box; }
+.root { --p: #1e4391; --p-soft: #e8eef9; --fg: #222; --muted: #6b7280; --line: #d9dee8; --bg: #fff; --soft: #f5f7fb;
+  --danger: #d6342c; --danger-soft: #fdeceb;
+  font-family: Montserrat, "Segoe UI", Arial, sans-serif; font-size: 13px; line-height: 1.4; color: var(--fg); }
+button, input, select { font: inherit; color: inherit; }
+.pill { position: fixed; left: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 2147483000;
+  display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border: 0; border-radius: 14px;
+  background: #222; color: #fff; font-size: 12px; font-weight: 600; cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.2); opacity: .85; }
+.pill:hover, .pill:focus-visible { opacity: 1; }
+.pill.on { background: var(--danger); opacity: 1; }
+.pill .dot { width: 7px; height: 7px; border-radius: 50%; background: #4ade80; }
+.pill.on .dot { background: #fff; }
+.panel { position: fixed; left: 12px; bottom: calc(48px + env(safe-area-inset-bottom, 0px)); z-index: 2147483001;
+  width: 360px; max-width: calc(100vw - 24px); max-height: min(70vh, 640px); display: flex; flex-direction: column;
+  background: var(--bg); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 12px 32px rgba(16,24,40,.25); }
+.panel.alone { bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
+.hint { position: fixed; left: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 2147483000;
+  max-width: calc(100vw - 24px); padding: 8px 12px; border-radius: 10px; background: #222; color: #fff; font-size: 12px;
+  box-shadow: 0 4px 14px rgba(0,0,0,.2); }
+.note { margin: 0 12px 8px; padding: 6px 10px; border-radius: 8px; background: var(--p-soft); color: var(--fg); font-size: 12px; overflow-wrap: anywhere; }
+.pill ~ .hint { bottom: calc(48px + env(safe-area-inset-bottom, 0px)); }
+.head { display: flex; align-items: center; gap: 8px; padding: 10px 12px 8px; }
+.title { flex: 1; min-width: 0; font-weight: 700; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.title select { font-weight: 700; border: 1px solid var(--line); border-radius: 6px; padding: 2px 4px; background: var(--bg); max-width: 100%; }
+.reset { border: 0; border-radius: 6px; padding: 5px 10px; background: var(--danger-soft); color: var(--danger); font-weight: 600; font-size: 12px; cursor: pointer; }
+.close { width: 26px; height: 26px; border: 0; border-radius: 6px; background: none; color: var(--muted); font-size: 18px; line-height: 1; cursor: pointer; }
+.escape { padding: 0 12px 6px; color: var(--muted); font-size: 11px; }
+.tabs { display: flex; gap: 4px; padding: 0 12px; border-bottom: 1px solid var(--line); }
+.tab { border: 0; background: none; padding: 6px 8px; font-weight: 600; font-size: 12px; color: var(--muted); border-bottom: 2px solid transparent; cursor: pointer; }
+.tab[aria-selected="true"] { color: var(--p); border-color: var(--p); }
+.body { overflow: auto; padding: 8px 12px 10px; display: flex; flex-direction: column; gap: 10px; }
+.search { width: 100%; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--soft); }
+.group-title { margin: 2px 0 2px; font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
+.row { display: flex; align-items: center; gap: 10px; padding: 4px 0; cursor: pointer; }
+.row .text { flex: 1; min-width: 0; }
+.row small { display: block; color: var(--muted); font-size: 11px; }
+.switch { appearance: none; flex: none; width: 30px; height: 18px; border-radius: 9px; background: var(--line); position: relative; margin: 0; cursor: pointer; }
+.switch::after { content: ''; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.3); transition: left .12s; }
+.switch:checked { background: var(--danger); }
+.switch:checked::after { left: 14px; }
+.switch:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible { outline: 2px solid var(--p); outline-offset: 2px; }
+.rule { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 8px; background: var(--soft); font-family: Consolas, monospace; font-size: 12px; }
+.rule .text { flex: 1; min-width: 0; overflow-wrap: anywhere; }
+.remove { border: 0; background: none; color: var(--muted); font-size: 16px; line-height: 1; cursor: pointer; padding: 0 2px; }
+.add { display: grid; grid-template-columns: auto 1fr auto auto; gap: 6px; }
+.add select, .add input { min-width: 0; padding: 5px 6px; border: 1px solid var(--line); border-radius: 6px; background: var(--bg); font-size: 12px; }
+.btn { border: 1px solid var(--line); border-radius: 6px; background: var(--bg); padding: 5px 10px; font-size: 12px; font-weight: 600; cursor: pointer; }
+.btn.primary { background: var(--p); border-color: var(--p); color: #fff; }
+.foot { display: flex; gap: 6px; flex-wrap: wrap; padding: 8px 12px; border-top: 1px solid var(--line); }
+.empty { color: var(--muted); font-size: 12px; }
+.requests { display: flex; flex-direction: column; gap: 2px; }
+.req { display: grid; grid-template-columns: 52px 1fr auto auto; gap: 8px; align-items: center; padding: 4px 0;
+  border-bottom: 1px solid var(--soft); font-family: Consolas, monospace; font-size: 12px; }
+.req .path { min-width: 0; overflow-wrap: anywhere; }
+.req .status { font-weight: 700; }
+.req .status.bad { color: var(--danger); }
+.req small { display: block; color: var(--muted); font-family: Montserrat, "Segoe UI", Arial, sans-serif; font-size: 11px; }
+.req .btn { padding: 3px 8px; font-family: Montserrat, "Segoe UI", Arial, sans-serif; }
+.shown { padding: 6px 0; border-bottom: 1px solid var(--soft); }
+.shown-head { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 11px; }
+.shown-head .kind { font-weight: 600; color: var(--danger); }
+.shown-head .kind.warning { color: #b45309; }
+.shown-title { font-weight: 600; }
+.shown small { display: block; color: var(--muted); font-size: 11px; }
+.shown .cause { margin-top: 2px; font-family: Consolas, monospace; font-size: 12px; }
+.requests-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 11px; }
+dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; margin: 0; }
+dt { color: var(--muted); }
+dd { margin: 0; font-family: Consolas, monospace; font-size: 12px; overflow-wrap: anywhere; }
+@media (max-width: 576px) {
+  .panel { left: 0; right: 0; bottom: 0; width: auto; max-width: none; max-height: 70vh; border-radius: 14px 14px 0 0;
+    padding-bottom: env(safe-area-inset-bottom, 0px); }
+  .panel ~ .pill { display: none; }
+}
+@media (prefers-reduced-motion: reduce) { .switch::after { transition: none; } }
+`, Ee = 6e3;
+let Y, h = null, u = null, S = null, y = null, L = !1, k = !1;
+const $t = { open: !1, tab: "faults", search: "", service: void 0, hint: "" }, c = { ...$t };
+function D() {
+  const t = m();
+  return t.find((e) => e.config.service === c.service) ?? t[0];
+}
+function St(t) {
+  const e = (t.config.builtins ?? []).map((n) => ({ id: n, ...$e[n] }));
+  return [
+    ...e.length ? [{ title: "Весь сервис", items: e }] : [],
+    ye,
+    ...t.config.groups ?? []
+  ];
+}
+function Te(t, e) {
+  var n;
+  return ((n = St(t).flatMap((a) => a.items).find((a) => a.id === e)) == null ? void 0 : n.label) ?? e;
+}
+function kt(t) {
+  return [
+    ...t.state.faults.map((e) => Te(t, e)),
+    ...t.state.rules.filter((e) => e.enabled).map((e) => `${e.path} → ${e.status}`)
+  ];
+}
+function Le(t, e, n, a) {
+  const s = t % 100, o = t % 10;
+  return s >= 11 && s <= 14 ? a : o === 1 ? e : o >= 2 && o <= 4 ? n : a;
+}
+const it = (t) => !c.search || t.toLowerCase().includes(c.search.toLowerCase());
+function Ae(t) {
+  const e = new Set(t.state.faults), n = St(t).map((o) => {
+    const i = o.items.filter((r) => it(`${r.label} ${r.hint ?? ""} ${r.id}`));
+    return i.length ? `<div><div class="group-title">${d(o.title)}</div>${i.map((r) => `
+      <label class="row"><span class="text">${d(r.label)}${r.hint ? `<small>${d(r.hint)}</small>` : ""}</span>
+        <input class="switch" type="checkbox" role="switch" data-fault="${d(r.id)}" ${e.has(r.id) ? "checked" : ""}
+          aria-label="${d(r.label)}"></label>`).join("")}</div>` : "";
+  }).join(""), a = t.state.rules.filter((o) => it(`${o.method ?? ""} ${o.path} ${o.status}`)), s = (o) => {
+    var i;
+    return ((i = G.find(([r]) => r === (o ?? ""))) == null ? void 0 : i[1]) ?? o;
+  };
+  return `
+    <input class="search" type="search" data-search placeholder="Поиск: 503, офлайн, роли…" aria-label="Поиск по сценариям" value="${d(c.search)}">
+    ${n || (a.length ? "" : '<div class="empty">Ничего не найдено.</div>')}
+    <div><div class="group-title">Ответы сервера</div>
+      ${a.map((o) => `<div class="rule"><span class="text">${d(s(o.method))} ${d(o.path)} → ${o.status}</span>
+        <input class="switch" type="checkbox" role="switch" data-rule="${d(o.id)}" ${o.enabled ? "checked" : ""}
+          aria-label="${d(`${o.path} → ${o.status}`)}">
+        <button class="remove" type="button" data-remove="${d(o.id)}" aria-label="Удалить правило">×</button></div>`).join("")}
+      <form class="add" data-add>
+        <select name="method" aria-label="Метод">${G.map(([o, i]) => `<option value="${o}">${i}</option>`).join("")}</select>
+        <input name="path" required placeholder="/assets/*" aria-label="Путь после ${d(t.config.apiBase ?? "адреса сайта")}">
+        <select name="status" aria-label="Код ответа">${Se.map((o) => `<option${o === 503 ? " selected" : ""}>${o}</option>`).join("")}</select>
+        <button class="btn primary" type="submit">Добавить</button>
+      </form>
+    </div>`;
+}
+function Pe() {
+  const t = document.documentElement.getAttribute("data-u-viewport");
+  return t || (window.matchMedia("(max-width: 576px)").matches ? "mobile" : window.matchMedia("(max-width: 900px)").matches ? "tablet" : "desktop");
+}
+function De(t) {
+  var r, l, f;
+  const e = document.documentElement, n = getComputedStyle(e).getPropertyValue("--u-unit").trim(), a = Wt();
+  let s = "—";
+  try {
+    const p = (l = (r = t.config).user) == null ? void 0 : l.call(r);
+    p && (s = [p.name, (f = p.roles) != null && f.length ? p.roles.join(", ") : "без ролей"].filter(Boolean).join(" · "));
+  } catch {
+    s = "не удалось прочитать";
+  }
+  const o = kt(t);
+  return `<dl>${[
+    ["Ширина", `${window.innerWidth} px · ${Pe()}`],
+    ["Шкала", `${e.getAttribute("data-u-responsive") ?? "legacy"}${n ? ` · --u-unit ${n}` : ""}`],
+    ["Кит", a ? `${a.name} ${a.version}` : "—"],
+    ["Сервис", [t.config.service, t.config.version].filter(Boolean).join(" ")],
+    ["API", t.config.apiBase ?? "все запросы"],
+    ["Оболочка ЛК", window.__POWERED_BY_QIANKUN__ ? "да (Qiankun)" : "нет"],
+    ["Ввод", e.getAttribute("data-input-mode") ?? "—"],
+    ["Сеть", navigator.onLine ? "онлайн" : "офлайн"],
+    ["Пользователь", s],
+    ["Включено", o.length ? o.join("; ") : "ничего"]
+  ].map(([p, $]) => `<dt>${d(p)}</dt><dd>${d($)}</dd>`).join("")}</dl>`;
+}
+function g() {
+  if (!u) return;
+  const t = D();
+  if (!t) {
+    u.innerHTML = "";
+    return;
+  }
+  const e = m().flatMap(kt), n = e.length, a = n ? `Dev · ${n === 1 ? e[0] : `${n} ${Le(n, "сбой", "сбоя", "сбоев")}`}` : "Dev", s = m(), o = s.every((b) => Zt(b) === "hidden"), i = !o || n > 0, r = s.length > 1 ? `<select data-service aria-label="Сервис">${s.map((b) => `<option value="${d(b.config.service)}"${b === t ? " selected" : ""}>Dev · ${d(b.config.service)}</option>`).join("")}</select>` : `Dev · ${d(t.config.service)}`, l = c.open ? `
+    <section class="panel${i ? "" : " alone"}" role="region" aria-label="Панель разработки">
+      <div class="head"><span class="title">${r}</span>
+        <button class="reset" type="button" data-reset>Сбросить всё</button>
+        <button class="close" type="button" data-close aria-label="Свернуть панель">×</button></div>
+      <div class="escape">Без панели: адрес с ?dev=off · открыть и закрыть: Ctrl+Alt+D</div>
+      <div class="tabs" role="tablist">
+        <button class="tab" type="button" role="tab" data-tab="faults" aria-selected="${c.tab === "faults"}">Сбои${I(t) ? ` · ${I(t)}` : ""}</button>
+        <button class="tab" type="button" role="tab" data-tab="requests" aria-selected="${c.tab === "requests"}">Запросы</button>
+        <button class="tab" type="button" role="tab" data-tab="errors" aria-selected="${c.tab === "errors"}">Ошибки${K().length ? ` · ${K().length}` : ""}</button>
+        <button class="tab" type="button" role="tab" data-tab="view" aria-selected="${c.tab === "view"}">Смотреть</button>
+      </div>
+      <div class="body">${c.tab === "faults" ? Ae(t) : c.tab === "requests" ? Lt(t) : c.tab === "errors" ? Me() : De(t)}</div>
+      ${c.hint ? `<div class="note" role="status">${d(c.hint)}</div>` : ""}
+      <div class="foot">
+        ${t.config.onRefetch ? '<button class="btn" type="button" data-refetch>Перезапросить данные</button>' : ""}
+        <button class="btn" type="button" data-reload>Перезагрузить</button>
+        ${s.some((b) => b.state.faults.length) ? '<button class="btn" type="button" data-share>Ссылка на сбои</button>' : ""}
+        <button class="btn" type="button" data-launcher="${o ? "visible" : "hidden"}">${o ? "Показывать кнопку" : "Скрыть кнопку"}</button>
+      </div>
+    </section>` : "", f = u.activeElement, p = Et(f), $ = (f == null ? void 0 : f.dataset.search) !== void 0 ? f.selectionStart : null, Dt = V ?? je();
+  V = null;
+  const Rt = [
+    e.length ? `Включено: ${e.join(", ")}` : "Панель разработки (Ctrl+Alt+D)",
+    o ? "Кнопка скрыта и видна, пока включены сбои" : ""
+  ].filter(Boolean).join(". "), Ot = i ? `
+    <button class="pill${n ? " on" : ""}" type="button" data-toggle aria-expanded="${c.open}"
+      title="${d(Rt)}"><span class="dot"></span>${d(a)}</button>` : "", Ct = c.hint && !c.open ? `<div class="hint" role="status">${d(c.hint)}</div>` : "";
+  if (u.innerHTML = `<style>${ke}</style><div class="root">${l}${Ot}${Ct}</div>`, Ue(Dt), p) {
+    const b = u.querySelector(p);
+    b == null || b.focus(), b instanceof HTMLInputElement && $ !== null && b.setSelectionRange($, $);
+  }
+}
+const Re = ["search", "fault", "rule", "tab", "service", "reset", "close", "toggle", "ruleFrom", "clearJournal"];
+function Et(t) {
+  if (!t) return null;
+  const e = t.getAttribute("name");
+  if (e && t.closest("[data-add]")) return `[data-add] [name="${e}"]`;
+  const n = Re.find((o) => t.dataset[o] !== void 0);
+  if (!n) return null;
+  const a = t.dataset[n], s = `data-${n.replace(/[A-Z]/g, (o) => `-${o.toLowerCase()}`)}`;
+  return a ? `[${s}="${a.replace(/["\\]/g, "\\$&")}"]` : `[${s}]`;
+}
+const Tt = ["method", "path", "status"];
+let V = null;
+const Oe = { network: "сеть", abort: "отмена", pending: "…" };
+function Lt(t) {
+  const e = Q().filter((n) => n.service === t.config.service);
+  return e.length ? `<div class="requests-head"><span>Последние ${e.length}, новые сверху</span>
+      <button class="btn" type="button" data-clear-journal>Очистить</button></div>
+    <div class="requests">${e.map((n) => {
+    const a = typeof n.status == "number" ? String(n.status) : Oe[n.status], s = n.status === "network" || typeof n.status == "number" && n.status >= 400, o = [n.duration === null ? "" : `${n.duration} мс`, n.faked ? "подменён панелью" : ""].filter(Boolean).join(" · ");
+    return `<div class="req"><span>${d(n.method)}</span>
+        <span class="path">${d(n.path)}${o ? `<small>${d(o)}</small>` : ""}</span>
+        <span class="status${s ? " bad" : ""}">${d(a)}</span>
+        <button class="btn" type="button" data-rule-from="${n.id}" title="Ответ на этот адрес — в «Ответах сервера»">Правило</button></div>`;
+  }).join("")}</div>` : '<div class="empty">Запросов к API пока не было. Журнал помнит последние 50 и очищается при перезагрузке.</div>';
+}
+const Ce = {
+  screen: "Заглушка",
+  fail: "Уведомление об ошибке",
+  warning: "Предупреждение",
+  offline: "Нет связи"
+}, Ie = (t) => Ce[t.kind === "notification" ? t.variant ?? "fail" : t.kind];
+function Me() {
+  const t = K();
+  return t.length ? `<div class="requests-head"><span>Последние ${t.length}, новые сверху</span>
+      <button class="btn" type="button" data-clear-shown>Очистить</button></div>
+    <div>${t.map((e) => `<div class="shown">
+      <div class="shown-head"><span class="kind${e.variant === "warning" ? " warning" : ""}">${d(Ie(e))}${e.code ? ` · ${d(e.code)}` : ""}</span>
+        <time>${d(new Date(e.at).toLocaleTimeString("ru-RU"))}</time></div>
+      <div class="shown-title">${d(e.title)}</div>
+      ${e.text ? `<small>${d(e.text)}</small>` : ""}
+      <div class="cause">${e.cause ? `← ${d(e.cause)}` : "<small>Неудачных запросов к API перед показом не было</small>"}</div>
+    </div>`).join("")}</div>` : '<div class="empty">Ошибок пользователю пока не показывали. Здесь появятся заглушки, уведомления об ошибке и полоса «Нет связи» — с причиной из запросов к API.</div>';
+}
+function ze(t) {
+  var a;
+  const e = Q().find((s) => String(s.id) === String(t));
+  if (!e) return;
+  V = { method: G.some(([s]) => s === e.method) ? e.method : "", path: e.path, status: "503" }, c.tab = "faults", c.search = "", g(), (a = u == null ? void 0 : u.querySelector('[data-add] [name="status"]')) == null || a.focus();
+}
+function qe() {
+  const t = [...new Set(m().flatMap((r) => r.state.faults))], e = new URL(window.location.href);
+  e.searchParams.set("dev", t.join(","));
+  const n = e.href.replace(/%2C/gi, ","), s = m().some((r) => r.state.rules.some((l) => l.enabled)) ? " Свои правила «адрес → код» в неё не входят." : "", o = () => {
+    A(`Ссылка скопирована.${s}`), g();
+  }, i = () => {
+    A(`Ссылка: ${n}${s}`), g();
+  };
+  try {
+    navigator.clipboard.writeText(n).then(o, i);
+  } catch {
+    i();
+  }
+}
+function je() {
+  const t = u == null ? void 0 : u.querySelector("[data-add]");
+  return t ? Object.fromEntries(Tt.map((e) => {
+    var n;
+    return [e, ((n = t.elements.namedItem(e)) == null ? void 0 : n.value) ?? ""];
+  })) : null;
+}
+function Ue(t) {
+  const e = u == null ? void 0 : u.querySelector("[data-add]");
+  !e || !t || Tt.forEach((n) => {
+    const a = e.elements.namedItem(n);
+    a && (a.value = t[n]);
+  });
+}
+function Fe(t) {
+  if (!t) {
+    A(""), tt("visible");
+    return;
+  }
+  c.open = !1;
+  const e = m().some((n) => I(n) > 0);
+  A(`Кнопка Dev скрыта${e ? " и видна, пока включены сбои" : ""}. Панель: Ctrl+Alt+D`), tt("hidden");
+}
+function A(t) {
+  clearTimeout(Y), c.hint = t, t && (Y = setTimeout(() => {
+    c.hint = "", g();
+  }, Ee));
+}
+function j(t = !c.open) {
+  var e, n;
+  t && A(""), c.open = t, g(), t ? (e = u == null ? void 0 : u.querySelector("[data-search], [data-tab]")) == null || e.focus() : (n = u == null ? void 0 : u.querySelector("[data-toggle]")) == null || n.focus();
+}
+function Ne(t) {
+  var a, s, o, i;
+  const e = t.target, n = D();
+  if (n)
+    if (e.closest("[data-toggle]")) j();
+    else if (e.closest("[data-close]")) j(!1);
+    else if (e.closest("[data-reset]"))
+      yt(), (s = (a = n.config).onRefetch) == null || s.call(a);
+    else if (e.closest("[data-reload]")) window.location.reload();
+    else if (e.closest("[data-rule-from]")) ze(Number(e.closest("[data-rule-from]").dataset.ruleFrom));
+    else if (e.closest("[data-clear-journal]"))
+      ct(), g();
+    else if (e.closest("[data-clear-shown]")) ht();
+    else if (e.closest("[data-share]")) qe();
+    else if (e.closest("[data-launcher]")) Fe(e.closest("[data-launcher]").dataset.launcher === "hidden");
+    else if (e.closest("[data-refetch]")) (i = (o = n.config).onRefetch) == null || i.call(o);
+    else if (e.closest("[data-tab]")) {
+      const r = e.closest("[data-tab]").dataset.tab;
+      c.tab = r === "view" || r === "requests" || r === "errors" ? r : "faults", g();
+    } else e.closest("[data-remove]") && Vt(n, e.closest("[data-remove]").dataset.remove);
+}
+function He(t) {
+  const e = t.target, n = D();
+  if (n)
+    if (e.dataset.fault) {
+      const a = e.checked;
+      Xt(n, e.dataset.fault, a), e.dataset.fault === "offline" && Z(!a);
+    } else e.dataset.rule ? Yt(n, e.dataset.rule, e.checked) : e.dataset.service !== void 0 && (c.service = e.value, g());
+}
+function _e(t) {
+  const e = t.target;
+  e.dataset.search !== void 0 && (c.search = e.value, g());
+}
+function We(t) {
+  const e = t.target;
+  if (e.dataset.add === void 0) return;
+  t.preventDefault();
+  const n = D(), a = new FormData(e), s = String(a.get("path") ?? "").trim();
+  !n || !s || (e.reset(), Gt(n, {
+    method: String(a.get("method") ?? "") || void 0,
+    path: s.startsWith("/") ? s : `/${s}`,
+    status: Number(a.get("status")) || 500,
+    html: Number(a.get("status")) === 502 || void 0
+  }));
+}
+function At(t) {
+  t.ctrlKey && t.altKey && t.code === "KeyD" ? (t.preventDefault(), j()) : t.key === "Escape" && c.open && h && t.composedPath().includes(h) && (t.preventDefault(), t.stopPropagation(), j(!1));
+}
+function Be() {
+  if (h || typeof document > "u") return;
+  h = document.createElement("div"), h.id = "urfu-ui-kit-dev", h.setAttribute("data-urfu-ui-kit-dev", ""), u = h.attachShadow({ mode: "open" }), u.addEventListener("click", Ne), u.addEventListener("change", He), u.addEventListener("input", _e), u.addEventListener("submit", We), window.addEventListener("keydown", At, !0), lt(), y = new MutationObserver((a) => {
+    (!(h != null && h.isConnected) || a.some((s) => s.type === "attributes")) && lt();
+  }), y.observe(document.documentElement, { childList: !0, subtree: !0, attributes: !0, attributeFilter: ["open"] }), c.open = m().some((a) => I(a) > 0);
+  const t = pt(g), e = qt(Pt);
+  u.addEventListener("pointerdown", Je), window.addEventListener("pointerup", U, !0), window.addEventListener("pointercancel", U, !0);
+  const n = le(() => {
+    c.open && g();
+  });
+  re(), S = () => {
+    t(), e(), n(), ie();
+  }, g();
+}
+function Ke() {
+  try {
+    const t = document.querySelectorAll("dialog:modal");
+    return t[t.length - 1] ?? null;
+  } catch {
+    return null;
+  }
+}
+function lt() {
+  if (!h) return;
+  const t = Ke() ?? document.documentElement;
+  h.parentNode !== t && t.appendChild(h);
+}
+function Pt() {
+  var s;
+  if (!c.open || c.tab !== "requests") {
+    k = !1;
+    return;
+  }
+  if (L) {
+    k = !0;
+    return;
+  }
+  k = !1;
+  const t = u == null ? void 0 : u.querySelector(".body"), e = D();
+  if (!u || !t || !e) {
+    g();
+    return;
+  }
+  const n = u.activeElement, a = n && t.contains(n) ? Et(n) : null;
+  t.innerHTML = Lt(e), a && ((s = t.querySelector(a)) == null || s.focus());
+}
+function Je() {
+  L = !0;
+}
+function U() {
+  L && (L = !1, k && setTimeout(Pt, 0));
+}
+function Xe() {
+  S == null || S(), S = null, y == null || y.disconnect(), y = null, window.removeEventListener("keydown", At, !0), window.removeEventListener("pointerup", U, !0), window.removeEventListener("pointercancel", U, !0), L = !1, k = !1, clearTimeout(Y), h == null || h.remove(), h = null, u = null, Object.assign(c, $t);
+}
+function Ge(t, e) {
+  return typeof window > "u" ? () => {
+  } : (Ut(), _t(e), Bt(t).state.faults.includes("offline") && Z(!1), ge(), Be(), () => {
+    Kt(t.service), m().length || Xe();
+  });
+}
+function Ye(t, e) {
+  var n;
+  return ((n = Jt(e)) == null ? void 0 : n.state.faults.includes(t)) ?? !1;
+}
+function Ve(t) {
+  return pt(t);
+}
+function en() {
+  yt();
+}
+const Qe = () => "2.1.0";
+function nn(t) {
+  return Ge(t, { name: "urfu-ui-kit-react", version: Qe() });
+}
+function Ze(t, e) {
+  return It(Ve, () => Ye(t, e), () => !1);
+}
+function an({ scope: t, service: e }) {
+  if (Ze(t === "app" ? "crashApp" : "crashPage", e)) throw new Error(`Сбой из dev-панели: падение ${t === "app" ? "приложения" : "страницы"}`);
+  return null;
+}
+export {
+  an as DevCrashProbe,
+  Ye as isDevFault,
+  de as matchPath,
+  nn as mountDevPanel,
+  en as resetDevFaults,
+  Ve as subscribeDevFaults,
+  Ze as useDevFault
+};