urfu-ui-kit-react 2.0.6-next.2 → 2.1.1

package/dist/dev/index.js

@@ -0,0 +1,852 @@
+import { useSyncExternalStore as Rt } from "react";
+let M = [], It = 1;
+const N = /* @__PURE__ */ new Set();
+let P = !1;
+function _() {
+  P || (P = !0, setTimeout(() => {
+    P = !1, N.forEach((t) => t());
+  }, 16));
+}
+function zt(t, e, n) {
+  const a = Date.now(), r = { id: It++, service: t, method: e.toUpperCase(), path: n, status: "pending", duration: null, endedAt: null, faked: !1 };
+  M = [...M.slice(-49), r], _();
+  let o = !1;
+  return (i, s) => {
+    o || (o = !0, r.status = i, r.faked = s, r.endedAt = Date.now(), r.duration = r.endedAt - a, _());
+  };
+}
+function Y() {
+  return [...M].reverse();
+}
+function ct() {
+  M = [], P = !1, _();
+}
+function qt(t) {
+  return N.add(t), () => {
+    N.delete(t);
+  };
+}
+const ut = "urfu-ui-kit:dev:", m = /* @__PURE__ */ new Map(), B = /* @__PURE__ */ new Set();
+let dt;
+const ft = (t) => `${ut}${t}`, jt = ["offline", "network", "slow"];
+let E = null;
+const O = /* @__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), O.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 Ht(t) {
+  if (!E || O.has(t.config.service)) return;
+  const e = new Set(Ft(t.config)), n = E.filter((a) => e.has(a));
+  n.length && (O.add(t.config.service), t.state = { ...t.state, faults: n }, F(t.config.service, t.state));
+}
+function Nt(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 Bt() {
+  return dt;
+}
+function Wt(t) {
+  const e = { config: t, state: Nt(t.service) };
+  return Ht(e), m.set(t.service, e), C(), e;
+}
+function Kt(t) {
+  m.delete(t), m.size || (E = null, O.clear()), C();
+}
+function v() {
+  return [...m.values()];
+}
+function Jt(t) {
+  return t ? m.get(t) : m.values().next().value;
+}
+function pt(t) {
+  return B.add(t), () => {
+    B.delete(t);
+  };
+}
+function C() {
+  B.forEach((t) => t());
+}
+function H(t, e) {
+  t.state = e, F(t.config.service, e), C();
+}
+function Zt(t, e, n) {
+  const a = t.state.faults.filter((r) => r !== e);
+  H(t, { ...t.state, faults: n ? [...a, e] : a });
+}
+function Xt(t, e) {
+  const n = `rule-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 6)}`;
+  H(t, { ...t.state, rules: [...t.state.rules, { ...e, id: n, enabled: !0 }] });
+}
+function Vt(t, e, n) {
+  H(t, { ...t.state, rules: t.state.rules.map((a) => a.id === e ? { ...a, enabled: n } : a) });
+}
+function Gt(t, e) {
+  H(t, { ...t.state, rules: t.state.rules.filter((n) => n.id !== e) });
+}
+function Yt() {
+  m.forEach((t) => {
+    t.state = { faults: [], rules: [], ...t.state.launcher ? { launcher: t.state.launcher } : {} }, F(t.config.service, t.state);
+  }), C();
+}
+function R(t) {
+  return t.state.faults.length + t.state.rules.filter((e) => e.enabled).length;
+}
+function Qt(t) {
+  return t.state.launcher ?? t.config.launcher ?? "visible";
+}
+function tt(t) {
+  m.forEach((e) => {
+    e.state = { ...e.state, launcher: t }, F(e.config.service, e.state);
+  }), C();
+}
+const te = 1e4, et = 200, L = ".u-error-screen, .u-notification-fail, .u-notification-warning, .u-offline-banner-offline";
+let I = [], ee = 1;
+const W = /* @__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 s;
+  const n = v().map((l) => l.config.service), a = (s = e.closest("[data-name]")) == null ? void 0 : s.getAttribute("data-name"), r = a && n.includes(a) ? a : null, o = Y().find((l) => ne(l) && l.endedAt !== null && t - l.endedAt <= te && (!r || l.service === r));
+  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, r, 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((r = t.querySelector(".u-error-screen-title")) == null ? void 0 : r.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(L)) return;
+  const e = oe(t);
+  if (!e) return;
+  const n = JSON.stringify(e);
+  if (W.get(t) === n) return;
+  W.set(t, n);
+  const a = Date.now();
+  I = [...I.slice(-29), { id: ee++, at: a, ...e, cause: ae(a, t) }], z.forEach((r) => r());
+}
+function re(t, e) {
+  t instanceof Element && (t.matches(L) && e.push(t), t.querySelectorAll(L).forEach((n) => e.push(n)));
+}
+function se() {
+  w || typeof MutationObserver > "u" || (w = new MutationObserver((t) => {
+    const e = [];
+    t.forEach((n) => {
+      if (n.type === "childList") {
+        n.addedNodes.forEach((r) => re(r, e));
+        return;
+      }
+      const a = n.target;
+      a.matches(L) ? e.push(a) : W.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(L).forEach(nt));
+}
+function ie() {
+  w == null || w.disconnect(), w = null;
+}
+function K() {
+  return [...I].reverse();
+}
+function ht() {
+  I = [], 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(/\/+$/, ""), r = n.indexOf(a);
+  if (r < 0) return null;
+  const o = n.slice(r + a.length);
+  return o.startsWith("/") || o === "" ? o || "/" : null;
+}
+function de(t, e) {
+  const n = (i) => i.split("/").filter(Boolean), a = n(t.trim()), r = n(e), o = (i, s) => i === a.length ? s === r.length : a[i] === "**" ? o(i + 1, s) || s < r.length && o(i, s + 1) : s === r.length ? !1 : (a[i] === "*" || a[i] === r[s]) && o(i + 1, s + 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 v()) {
+    const n = ue(t, e.config.apiBase);
+    if (n !== null) return { entry: e, path: n };
+  }
+  return null;
+}
+function vt({ entry: t, path: e }, n) {
+  const a = n.toUpperCase(), r = new Set(t.state.faults), o = r.has("slow") ? bt : 0;
+  if (r.has("offline") || r.has("network")) return { kind: "network", delay: o };
+  const i = he(t).find((s) => fe(s, a) && de(s.path, e));
+  return i ? pe(i, o) : o ? { kind: "pass", delay: o } : null;
+}
+const mt = (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 r = setTimeout(n, t);
+    e == null || e.addEventListener("abort", () => {
+      clearTimeout(r), a(J(e));
+    }, { once: !0 });
+  });
+}
+const wt = /* @__PURE__ */ new Set([204, 205, 304]);
+let at = !1;
+function ge() {
+  at || typeof window > "u" || (at = !0, ve(), we());
+}
+function ve() {
+  var e;
+  const t = (e = window.fetch) == null ? void 0 : e.bind(window);
+  t && (window.fetch = async (n, a) => {
+    const r = typeof n == "object" && "url" in n ? n : null, o = gt(r ? r.url : String(n));
+    if (!o) return t(n, a);
+    const i = (a == null ? void 0 : a.method) ?? (r == null ? void 0 : r.method) ?? "GET", s = mt(o, i), l = vt(o, i), f = (a == null ? void 0 : a.signal) ?? (r == null ? void 0 : r.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 s("network", !0), new TypeError("Failed to fetch");
+      if ((l == null ? void 0 : l.kind) === "response")
+        return s(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 s(p.status, !1), p;
+    } catch (p) {
+      throw s(f != null && f.aborted ? "abort" : "network", !1), p;
+    }
+  });
+}
+const ot = /* @__PURE__ */ new WeakMap(), rt = /* @__PURE__ */ new WeakMap(), q = /* @__PURE__ */ new WeakMap(), me = ["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, ...s) {
+    st(this), me.forEach((l) => {
+      Reflect.deleteProperty(this, l);
+    }), ot.set(this, { method: o, url: String(i) }), e.call(this, o, i, ...s);
+  }, t.send = function(o) {
+    const i = ot.get(this), s = i ? gt(i.url) : null;
+    if (!i || !s) {
+      n.call(this, o);
+      return;
+    }
+    const l = mt(s, i.method);
+    rt.set(this, l);
+    const f = vt(s, 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 (!st(this)) {
+      a.call(this);
+      return;
+    }
+    (i = rt.get(this)) == null || i("abort", !1);
+    const o = xt(this);
+    o("readyState", 4), o("status", 0), Z(this, ["readystatechange", "abort", "loadend"]), o("readyState", 0);
+  };
+}
+function st(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 });
+}, Z = (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", ""), Z(t, ["readystatechange", "error", "loadend"]);
+    return;
+  }
+  const r = wt.has(e.status) ? "" : e.body;
+  let o = r;
+  if (t.responseType === "json")
+    try {
+      o = e.contentType === "application/json" && r ? JSON.parse(r) : null;
+    } catch {
+      o = null;
+    }
+  a("status", e.status), a("statusText", String(e.status)), a("responseText", r), 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: (s) => s.toLowerCase() === "content-type" ? e.contentType : null
+  }), Z(t, ["readystatechange", "load", "loadend"]);
+}
+function Q(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 = v().some((e) => e.state.faults.includes("offline"));
+  Yt(), ct(), ht(), t && Q(!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: "Каждая открытая страница падает, пока флаг включён" }
+}, X = [["", "Любой"], ["GET", "GET"], ["write", "Запись"], ["POST", "POST"], ["PUT", "PUT"], ["PATCH", "PATCH"], ["DELETE", "DELETE"]], ke = [400, 401, 403, 404, 409, 422, 429, 500, 502, 503, 504], d = (t) => String(t ?? "").replace(/[&<>"']/g, (e) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[e]), Se = '<svg viewBox="0 0 36 36" fill="none" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M28 0L20 16H36L28 0ZM28 5.11101L23.6984 13.7143H32.3016L28 5.11101Z" fill="#3BA68C"/><path fill-rule="evenodd" clip-rule="evenodd" d="M9 33.7143C12.1559 33.7143 14.7143 31.1559 14.7143 28C14.7143 24.8441 12.1559 22.2857 9 22.2857C5.84409 22.2857 3.28571 24.8441 3.28571 28C3.28571 31.1559 5.84409 33.7143 9 33.7143ZM9 36C13.4183 36 17 32.4183 17 28C17 23.5817 13.4183 20 9 20C4.58172 20 1 23.5817 1 28C1 32.4183 4.58172 36 9 36Z" fill="#E54B6A"/><path fill-rule="evenodd" clip-rule="evenodd" d="M33.7143 22.2857H22.2857V33.7143H33.7143V22.2857ZM20 20V36H36V20H20Z" fill="#1E4391"/><path fill-rule="evenodd" clip-rule="evenodd" d="M12.0593 4.9091L9 0L5.94073 4.9091L0 6.11146L4.05 10.3478L3.43769 16L9 13.7091L14.5623 16L13.95 10.3478L18 6.11146L12.0593 4.9091ZM14.0262 7.31822L10.7085 6.64674L9 3.90515L7.29149 6.64674L3.97378 7.31822L6.23558 9.68408L5.89362 12.8407L9 11.5613L12.1064 12.8407L11.7644 9.68408L14.0262 7.31822Z" fill="#E98446"/></svg>', Ee = `
+: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;
+  /* Отступ кнопки снизу: StickyActionBar кита, пока стоит у нижнего края, задаёт на <html>
+     --u-dev-launcher-bottom (его высота + 12px) — кнопка и панель поднимаются над ним. */
+  --launcher-bottom: var(--u-dev-launcher-bottom, calc(12px + env(safe-area-inset-bottom, 0px)));
+  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; }
+/* Кнопка панели — в цветах кита: токены --u-color-* с :root сервиса проходят в shadow DOM
+   (all: initial их не сбрасывает), запасные значения — как в ките. В покое — круг с логотипом,
+   чтобы меньше закрывать нижние липкие панели сервиса; при наведении и фокусе раскрывается
+   в «логотип + Dev»; при включённых сбоях раскрыта всегда, цвет ошибки и число сбоев. */
+.pill { --kit-p: var(--u-color-primary, #1e4391); --kit-error: var(--u-color-error, #ef302b);
+  --kit-surface: var(--u-color-surface, #fff); --kit-line: var(--u-color-border, #748ab9);
+  position: fixed; left: 12px; bottom: var(--launcher-bottom); z-index: 2147483000;
+  display: inline-flex; align-items: center; height: 36px; padding: 0; border: 1px solid var(--kit-line); border-radius: 18px;
+  background: var(--kit-surface); color: var(--kit-p); font-size: 13px; font-weight: 500; white-space: nowrap; cursor: pointer;
+  box-shadow: 0 2px 8px rgba(0,0,0,.15); }
+.pill .logo { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--kit-surface); }
+.pill .logo svg { display: block; width: 20px; height: 20px; }
+.pill .label { max-width: 0; overflow: hidden; opacity: 0; padding: 0;
+  transition: max-width .2s ease, opacity .2s ease, padding .2s ease; }
+.pill:hover .label, .pill:focus-visible .label, .pill.on .label { max-width: 260px; opacity: 1; padding: 0 14px 0 2px; }
+.pill.on { background: var(--kit-error); border-color: var(--kit-error); color: #fff; }
+.pill.on .logo { width: 30px; height: 30px; margin: 0 1px 0 2px; }
+.pill:focus-visible { outline: 2px solid var(--kit-p); outline-offset: 2px; }
+.panel { position: fixed; left: 12px; bottom: calc(var(--launcher-bottom) + 44px); 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: var(--launcher-bottom); }
+.hint { position: fixed; left: 12px; bottom: var(--launcher-bottom); 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(var(--launcher-bottom) + 44px); }
+.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, .pill .label { transition: none; } }
+`, Le = 6e3;
+let V, h = null, u = null, k = null, y = null, T = !1, S = !1;
+const $t = { open: !1, tab: "faults", search: "", service: void 0, hint: "" }, c = { ...$t };
+function D() {
+  const t = v();
+  return t.find((e) => e.config.service === c.service) ?? t[0];
+}
+function kt(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 = kt(t).flatMap((a) => a.items).find((a) => a.id === e)) == null ? void 0 : n.label) ?? e;
+}
+function St(t) {
+  return [
+    ...t.state.faults.map((e) => Te(t, e)),
+    ...t.state.rules.filter((e) => e.enabled).map((e) => `${e.path} → ${e.status}`)
+  ];
+}
+function Ae(t, e, n, a) {
+  const r = t % 100, o = t % 10;
+  return r >= 11 && r <= 14 ? a : o === 1 ? e : o >= 2 && o <= 4 ? n : a;
+}
+const it = (t) => !c.search || t.toLowerCase().includes(c.search.toLowerCase());
+function Ce(t) {
+  const e = new Set(t.state.faults), n = kt(t).map((o) => {
+    const i = o.items.filter((s) => it(`${s.label} ${s.hint ?? ""} ${s.id}`));
+    return i.length ? `<div><div class="group-title">${d(o.title)}</div>${i.map((s) => `
+      <label class="row"><span class="text">${d(s.label)}${s.hint ? `<small>${d(s.hint)}</small>` : ""}</span>
+        <input class="switch" type="checkbox" role="switch" data-fault="${d(s.id)}" ${e.has(s.id) ? "checked" : ""}
+          aria-label="${d(s.label)}"></label>`).join("")}</div>` : "";
+  }).join(""), a = t.state.rules.filter((o) => it(`${o.method ?? ""} ${o.path} ${o.status}`)), r = (o) => {
+    var i;
+    return ((i = X.find(([s]) => s === (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(r(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="Метод">${X.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="Код ответа">${ke.map((o) => `<option${o === 503 ? " selected" : ""}>${o}</option>`).join("")}</select>
+        <button class="btn primary" type="submit">Добавить</button>
+      </form>
+    </div>`;
+}
+function De() {
+  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 Pe(t) {
+  var s, l, f;
+  const e = document.documentElement, n = getComputedStyle(e).getPropertyValue("--u-unit").trim(), a = Bt();
+  let r = "—";
+  try {
+    const p = (l = (s = t.config).user) == null ? void 0 : l.call(s);
+    p && (r = [p.name, (f = p.roles) != null && f.length ? p.roles.join(", ") : "без ролей"].filter(Boolean).join(" · "));
+  } catch {
+    r = "не удалось прочитать";
+  }
+  const o = St(t);
+  return `<dl>${[
+    ["Ширина", `${window.innerWidth} px · ${De()}`],
+    ["Шкала", `${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 ? "онлайн" : "офлайн"],
+    ["Пользователь", r],
+    ["Включено", 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 = v().flatMap(St), n = e.length, a = n ? `Dev · ${n === 1 ? e[0] : `${n} ${Ae(n, "сбой", "сбоя", "сбоев")}`}` : "Dev", r = v(), o = r.every((b) => Qt(b) === "hidden"), i = !o || n > 0, s = r.length > 1 ? `<select data-service aria-label="Сервис">${r.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">${s}</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"}">Сбои${R(t) ? ` · ${R(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" ? Ce(t) : c.tab === "requests" ? Tt(t) : c.tab === "errors" ? ze() : Pe(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>
+        ${r.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 = G ?? Ue();
+  G = null;
+  const Pt = [
+    e.length ? `Включено: ${e.join(", ")}` : "Панель разработки (Ctrl+Alt+D)",
+    o ? "Кнопка скрыта и видна, пока включены сбои" : ""
+  ].filter(Boolean).join(". "), Mt = i ? `
+    <button class="pill${n ? " on" : ""}" type="button" data-toggle aria-expanded="${c.open}"
+      title="${d(Pt)}"><span class="logo">${Se}</span><span class="label">${d(a)}</span></button>` : "", Ot = c.hint && !c.open ? `<div class="hint" role="status">${d(c.hint)}</div>` : "";
+  if (u.innerHTML = `<style>${Ee}</style><div class="root">${l}${Mt}${Ot}</div>`, Fe(Dt), p) {
+    const b = u.querySelector(p);
+    b == null || b.focus(), b instanceof HTMLInputElement && $ !== null && b.setSelectionRange($, $);
+  }
+}
+const Me = ["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 = Me.find((o) => t.dataset[o] !== void 0);
+  if (!n) return null;
+  const a = t.dataset[n], r = `data-${n.replace(/[A-Z]/g, (o) => `-${o.toLowerCase()}`)}`;
+  return a ? `[${r}="${a.replace(/["\\]/g, "\\$&")}"]` : `[${r}]`;
+}
+const Lt = ["method", "path", "status"];
+let G = null;
+const Oe = { network: "сеть", abort: "отмена", pending: "…" };
+function Tt(t) {
+  const e = Y().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], r = 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${r ? " 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 Re = {
+  screen: "Заглушка",
+  fail: "Уведомление об ошибке",
+  warning: "Предупреждение",
+  offline: "Нет связи"
+}, Ie = (t) => Re[t.kind === "notification" ? t.variant ?? "fail" : t.kind];
+function ze() {
+  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 qe(t) {
+  var a;
+  const e = Y().find((r) => String(r.id) === String(t));
+  if (!e) return;
+  G = { method: X.some(([r]) => r === 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 je() {
+  const t = [...new Set(v().flatMap((s) => s.state.faults))], e = new URL(window.location.href);
+  e.searchParams.set("dev", t.join(","));
+  const n = e.href.replace(/%2C/gi, ","), r = v().some((s) => s.state.rules.some((l) => l.enabled)) ? " Свои правила «адрес → код» в неё не входят." : "", o = () => {
+    A(`Ссылка скопирована.${r}`), g();
+  }, i = () => {
+    A(`Ссылка: ${n}${r}`), g();
+  };
+  try {
+    navigator.clipboard.writeText(n).then(o, i);
+  } catch {
+    i();
+  }
+}
+function Ue() {
+  const t = u == null ? void 0 : u.querySelector("[data-add]");
+  return t ? Object.fromEntries(Lt.map((e) => {
+    var n;
+    return [e, ((n = t.elements.namedItem(e)) == null ? void 0 : n.value) ?? ""];
+  })) : null;
+}
+function Fe(t) {
+  const e = u == null ? void 0 : u.querySelector("[data-add]");
+  !e || !t || Lt.forEach((n) => {
+    const a = e.elements.namedItem(n);
+    a && (a.value = t[n]);
+  });
+}
+function He(t) {
+  if (!t) {
+    A(""), tt("visible");
+    return;
+  }
+  c.open = !1;
+  const e = v().some((n) => R(n) > 0);
+  A(`Кнопка Dev скрыта${e ? " и видна, пока включены сбои" : ""}. Панель: Ctrl+Alt+D`), tt("hidden");
+}
+function A(t) {
+  clearTimeout(V), c.hint = t, t && (V = setTimeout(() => {
+    c.hint = "", g();
+  }, Le));
+}
+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, r, 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(), (r = (a = n.config).onRefetch) == null || r.call(a);
+    else if (e.closest("[data-reload]")) window.location.reload();
+    else if (e.closest("[data-rule-from]")) qe(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]")) je();
+    else if (e.closest("[data-launcher]")) He(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 s = e.closest("[data-tab]").dataset.tab;
+      c.tab = s === "view" || s === "requests" || s === "errors" ? s : "faults", g();
+    } else e.closest("[data-remove]") && Gt(n, e.closest("[data-remove]").dataset.remove);
+}
+function _e(t) {
+  const e = t.target, n = D();
+  if (n)
+    if (e.dataset.fault) {
+      const a = e.checked;
+      Zt(n, e.dataset.fault, a), e.dataset.fault === "offline" && Q(!a);
+    } else e.dataset.rule ? Vt(n, e.dataset.rule, e.checked) : e.dataset.service !== void 0 && (c.service = e.value, g());
+}
+function Be(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), r = String(a.get("path") ?? "").trim();
+  !n || !r || (e.reset(), Xt(n, {
+    method: String(a.get("method") ?? "") || void 0,
+    path: r.startsWith("/") ? r : `/${r}`,
+    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 Ke() {
+  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", _e), u.addEventListener("input", Be), u.addEventListener("submit", We), window.addEventListener("keydown", At, !0), lt(), y = new MutationObserver((a) => {
+    (!(h != null && h.isConnected) || a.some((r) => r.type === "attributes")) && lt();
+  }), y.observe(document.documentElement, { childList: !0, subtree: !0, attributes: !0, attributeFilter: ["open"] }), c.open = v().some((a) => R(a) > 0);
+  const t = pt(g), e = qt(Ct);
+  u.addEventListener("pointerdown", Ze), window.addEventListener("pointerup", U, !0), window.addEventListener("pointercancel", U, !0);
+  const n = le(() => {
+    c.open && g();
+  });
+  se(), k = () => {
+    t(), e(), n(), ie();
+  }, g();
+}
+function Je() {
+  try {
+    const t = document.querySelectorAll("dialog:modal");
+    return t[t.length - 1] ?? null;
+  } catch {
+    return null;
+  }
+}
+function lt() {
+  if (!h) return;
+  const t = Je() ?? document.documentElement;
+  h.parentNode !== t && t.appendChild(h);
+}
+function Ct() {
+  var r;
+  if (!c.open || c.tab !== "requests") {
+    S = !1;
+    return;
+  }
+  if (T) {
+    S = !0;
+    return;
+  }
+  S = !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 = Tt(e), a && ((r = t.querySelector(a)) == null || r.focus());
+}
+function Ze() {
+  T = !0;
+}
+function U() {
+  T && (T = !1, S && setTimeout(Ct, 0));
+}
+function Xe() {
+  k == null || k(), k = null, y == null || y.disconnect(), y = null, window.removeEventListener("keydown", At, !0), window.removeEventListener("pointerup", U, !0), window.removeEventListener("pointercancel", U, !0), T = !1, S = !1, clearTimeout(V), h == null || h.remove(), h = null, u = null, Object.assign(c, $t);
+}
+function Ve(t, e) {
+  return typeof window > "u" ? () => {
+  } : (Ut(), _t(e), Wt(t).state.faults.includes("offline") && Q(!1), ge(), Ke(), () => {
+    Kt(t.service), v().length || Xe();
+  });
+}
+function Ge(t, e) {
+  var n;
+  return ((n = Jt(e)) == null ? void 0 : n.state.faults.includes(t)) ?? !1;
+}
+function Ye(t) {
+  return pt(t);
+}
+function nn() {
+  yt();
+}
+const Qe = () => "2.1.1";
+function an(t) {
+  return Ve(t, { name: "urfu-ui-kit-react", version: Qe() });
+}
+function tn(t, e) {
+  return Rt(Ye, () => Ge(t, e), () => !1);
+}
+function on({ scope: t, service: e }) {
+  if (tn(t === "app" ? "crashApp" : "crashPage", e)) throw new Error(`Сбой из dev-панели: падение ${t === "app" ? "приложения" : "страницы"}`);
+  return null;
+}
+export {
+  on as DevCrashProbe,
+  Ge as isDevFault,
+  de as matchPath,
+  an as mountDevPanel,
+  nn as resetDevFaults,
+  Ye as subscribeDevFaults,
+  tn as useDevFault
+};