@alxgrn/telefrag-ui 0.1.2 → 0.1.4

package/README.md

@@ -1,6 +1,8 @@
 # UI-библиотека проекта [The Daily Telefrag](https://dailytelefrag.ru)
 Документация по компонентам [тут](./docs/README.md)
 
+### ВНИМАНИЕ: Для работы `Link` в навигации главного меню пришлось добавить внешнюю зависимость от `react-router`. Это не очень хорошее решение т.к. данная библиотека используется в библиотеках редакторов, которым роутер совсем не нужен, но его приходится прописывать также как внешнюю зависимость. Необходимо будет выделить компонент `Layout` и все связанные с ним компоненты в отдельную библиотеку и избавится от ненужных зависимостей от `react-router`!
+
 Ниже просто мусор для памяти :)
 
 ## Подготовка для публикации библиотеки

package/dist/assets/MainMenu.css

@@ -1 +1 @@
-.MainMenu{margin-top:var(--alxgrn-unit);margin-right:var(--alxgrn-unit-half)}.Sidebar .MainMenu{margin-top:0}.MainMenu .MainMenuAlternative{display:flex;align-items:center;gap:var(--alxgrn-unit-half);cursor:pointer;padding:var(--alxgrn-unit-half);border-radius:var(--alxgrn-unit-half)}.MainMenu .MainMenuAlternative:hover{background-color:var(--alxgrn-bg-panel)}.MainMenu .MainMenuAlternative:hover *{color:var(--alxgrn-color-accent)}.MainMenu .MainMenuAlternative svg{color:var(--alxgrn-color-accent);font-size:var(--alxgrn-font-size-big)}.MainMenu .MainMenuAlternative img{width:var(--alxgrn-font-size-big);height:var(--alxgrn-font-size-big);border-radius:50%;flex:0 0 auto}.MainMenu .MainMenuAlternative span{font-size:var(--alxgrn-font-size);overflow-wrap:break-word;display:-webkit-box;line-clamp:1;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;flex:1 1 auto}.MainMenu .MainMenuAlternative span.MainMenuCheck{display:block;width:var(--alxgrn-unit-half);height:var(--alxgrn-unit-half);border-radius:50%;background-color:var(--alxgrn-color-accent);flex:0 0 auto}.MainMenu .MainMenuNode,.MainMenu .MainMenuTitle{padding:var(--alxgrn-unit-half)}.MainMenu .MainMenuTitle span{text-transform:uppercase;font-size:var(--alxgrn-font-size-small);font-weight:600;color:var(--alxgrn-color-light)}
+.MainMenu{margin-top:var(--alxgrn-unit);margin-right:var(--alxgrn-unit-half)}.Sidebar .MainMenu{margin-top:0}.MainMenu .MainMenuAlternative{padding:var(--alxgrn-unit-half);border-radius:var(--alxgrn-unit-half);-webkit-user-select:none;user-select:none}.MainMenu .MainMenuAlternative:hover{background-color:var(--alxgrn-bg-panel)}.MainMenu .MainMenuAlternative:hover *{color:var(--alxgrn-color-accent)}.MainMenu .MainMenuAlternative a{display:flex;align-items:center;gap:var(--alxgrn-unit-half);cursor:pointer;color:var(--alxgrn-color-text)!important;text-decoration:none}.MainMenu .MainMenuAlternative svg{color:var(--alxgrn-color-accent);font-size:var(--alxgrn-font-size-big)}.MainMenu .MainMenuAlternative img{width:var(--alxgrn-font-size-big);height:var(--alxgrn-font-size-big);border-radius:50%;flex:0 0 auto}.MainMenu .MainMenuAlternative .MainMenuAlternativeText{font-size:var(--alxgrn-font-size);overflow-wrap:break-word;display:-webkit-box;line-clamp:1;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;flex:1 1 auto}.MainMenu .MainMenuAlternative .MainMenuAlternativeCheck{display:block;width:var(--alxgrn-unit-half);height:var(--alxgrn-unit-half);border-radius:50%;background-color:var(--alxgrn-color-accent);flex:0 0 auto}.MainMenu .MainMenuNode,.MainMenu .MainMenuTitle{padding:var(--alxgrn-unit-half)}.MainMenu .MainMenuTitle{text-transform:uppercase;font-size:var(--alxgrn-font-size-small);font-weight:600;color:var(--alxgrn-color-light);overflow-wrap:break-word;display:-webkit-box;line-clamp:1;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}

package/dist/components/form/form/Form.js

@@ -1,6 +1,6 @@
 import { jsxs as b, jsx as m } from "react/jsx-runtime";
-import { useState as q, useEffect as H } from "react";
-import h, { isValidDate as R } from "../date/Date.js";
+import { useState as H, useEffect as R } from "react";
+import h, { isValidDate as T } from "../date/Date.js";
 import { RadioList as x } from "../radio/RadioList.js";
 import { Select as y } from "../select/Select.js";
 import { CheckboxList as F } from "../checkbox/CheckboxList.js";
@@ -17,8 +17,8 @@ import { Image as D } from "../image/Image.js";
 import E from "../input/Input.js";
 /* empty css                             */
 /* empty css                      */
-import T from "../hidden/Hidden.js";
-import B from "../checkbox/Checkbox.js";
+import B from "../hidden/Hidden.js";
+import S from "../checkbox/Checkbox.js";
 /* empty css                         */
 import "react-transition-group";
 import "react-dom";
@@ -36,61 +36,65 @@ import l from "../../ui/block/Block.js";
 /* empty css                           */
 /* empty css                       */
 /* empty css                         */
+import "react-router";
 /* empty css                        */
-import S from "./traverse.js";
-const Eo = ({
+import j from "./traverse.js";
+const Ee = ({
   info: u,
   error: d,
   success: k,
   submit: p,
   cancel: f,
-  submitType: j = "Accent",
-  cancelType: w = "Error",
-  wide: A,
+  submitType: w = "Accent",
+  cancelType: A = "Error",
+  wide: L,
   onSubmit: v,
-  onCancel: L,
+  onCancel: N,
   children: c
 }) => {
-  const [N, i] = q(!1);
-  return H(() => {
-    p && (i(!1), S(c, (r) => {
-      const e = r.props;
+  const [q, r] = H(!1);
+  return R(() => {
+    p && (r(!1), j(c, (t) => {
+      const e = t.props;
       if (e.required)
-        switch (r.type) {
+        switch (t.type) {
           case I:
           case E:
-            e.value.trim() || i(!0);
+            e.value.trim() || r(!0);
             break;
-          case B:
-            e.checked || i(!0);
+          case S:
+            e.checked || r(!0);
             break;
           case y:
             {
-              const s = e.value;
-              e.options.findIndex((a) => a.value === s) < 0 && i(!0);
+              const a = e.value;
+              e.options.findIndex((s) => s.value === a) < 0 && r(!0);
             }
             break;
           case x:
             {
-              const s = e.value;
-              e.options.findIndex((a) => a.value === s) < 0 && i(!0);
+              const a = e.value;
+              e.options.findIndex((s) => s.value === a) < 0 && r(!0);
             }
             break;
           case g:
-            e.files.length < 1 && i(!0);
+            e.files.length < 1 && r(!0);
             break;
           case D:
-            e.value || i(!0);
+            e.value || r(!0);
             break;
           case h:
-            R(e.value.trim()) || i(!0);
+            T(e.value.trim()) || r(!0);
             break;
           case F:
-            e.options.findIndex((n) => n.checked === !0) < 0 && i(!0);
+            e.options.findIndex((n) => n.checked === !0) < 0 && r(!0);
+            break;
+          case B:
+            `${e.value}`.trim() || r(!0);
             break;
         }
     }));
-  }, [c, p]), /* @__PURE__ */ b("div", { className: A ? "Form FormWide" : "Form", children: [
+  }, [c, p]), /* @__PURE__ */ b("div", { className: L ? "Form FormWide" : "Form", children: [
     k && /* @__PURE__ */ m(l, { type: "Success", children: k }),
     d && /* @__PURE__ */ m(l, { type: "Error", children: d }),
     u && /* @__PURE__ */ m(l, { children: u }),
@@ -99,27 +103,27 @@ const Eo = ({
       p && /* @__PURE__ */ m(
         C,
         {
-          type: j,
+          type: w,
           label: p,
-          disabled: N,
+          disabled: q,
           onClick: () => {
             if (!v) return;
-            const r = {}, e = (t, o) => {
-              if (!r[t]) {
-                r[t] = o;
+            const t = {}, e = (i, o) => {
+              if (!t[i]) {
+                t[i] = o;
                 return;
               }
-              r[t] instanceof Array ? r[t].push(o) : r[t] = [r[t], o];
+              t[i] instanceof Array ? t[i].push(o) : t[i] = [t[i], o];
             };
-            S(c, (t) => {
-              const o = t.props;
-              switch (t.type) {
+            j(c, (i) => {
+              const o = i.props;
+              switch (i.type) {
                 case h:
                 case I:
                 case E:
                   e(o.id, o.value.trim());
                   break;
-                case B:
+                case S:
                   e(o.id, o.checked ? o.value : void 0);
                   break;
                 case y:
@@ -132,34 +136,34 @@ const Eo = ({
                 case D:
                   e(o.id, o.value);
                   break;
-                case T:
+                case B:
                   e(o.id, o.value);
                   break;
                 case F:
                   {
-                    const s = [];
-                    o.options.forEach((a) => {
-                      a.checked && s.push(a.value);
-                    }), e(o.id, s);
+                    const a = [];
+                    o.options.forEach((s) => {
+                      s.checked && a.push(s.value);
+                    }), e(o.id, a);
                   }
                   break;
               }
-            }), v(r);
+            }), v(t);
           }
         }
       ),
       f && /* @__PURE__ */ m(
         C,
         {
-          type: w,
+          type: A,
           label: f,
-          onClick: L
+          onClick: N
         }
       )
     ] })
   ] });
 };
 export {
-  Eo as Form,
-  Eo as default
+  Ee as Form,
+  Ee as default
 };

package/dist/components/form/form/traverse.js

@@ -6,6 +6,7 @@ function i(t) {
   var o;
   if (!r.isValidElement(t)) return !1;
   let e = t.type;
+  if (typeof e == "string") return !1;
   for (; f(e) && (e.$$typeof === Symbol.for("react.memo") || e.$$typeof === Symbol.for("react.forward_ref")); )
     e = e.type;
   return typeof e == "function" && !((o = e.prototype) != null && o.isReactComponent);

package/dist/components/form/hidden/Hidden.d.ts

@@ -2,6 +2,7 @@ import { default as React } from 'react';
 export interface HiddenProps {
     id: string;
     value: string | number;
+    required?: boolean;
 }
 declare const Hidden: React.FC<HiddenProps>;
 export default Hidden;

package/dist/components/form/hidden/Hidden.js

@@ -1,12 +1,13 @@
-import { jsx as e } from "react/jsx-runtime";
-const n = ({ id: t, value: d }) => /* @__PURE__ */ e(
+import { jsx as i } from "react/jsx-runtime";
+const o = ({ id: t, value: d, required: e }) => /* @__PURE__ */ i(
   "input",
   {
     id: t,
     type: "hidden",
-    value: d
+    value: d,
+    required: e
   }
 );
 export {
-  n as default
+  o as default
 };

package/dist/components/form/image/Image.js

@@ -32,8 +32,9 @@ import j from "../../icons/Trash.js";
 /* empty css                           */
 /* empty css                       */
 /* empty css                         */
+import "react-router";
 /* empty css                        */
-const cr = ({
+const gr = ({
   id: u,
   value: o,
   text: l,
@@ -100,6 +101,6 @@ const cr = ({
   ) });
 };
 export {
-  cr as Image,
-  cr as default
+  gr as Image,
+  gr as default
 };

package/dist/components/form/select/Select.js

@@ -31,8 +31,9 @@ import { Menu as E } from "../../ui/menu/Menu.js";
 /* empty css                           */
 /* empty css                       */
 /* empty css                         */
+import "react-router";
 /* empty css                        */
-const cr = ({
+const ur = ({
   id: f,
   value: o,
   onChange: d,
@@ -108,6 +109,6 @@ const cr = ({
   ] });
 };
 export {
-  cr as Select,
-  cr as default
+  ur as Select,
+  ur as default
 };

package/dist/components/form/time/Time.js

@@ -30,10 +30,11 @@ import O from "../../icons/Check.js";
 /* empty css                           */
 /* empty css                       */
 /* empty css                         */
+import "react-router";
 /* empty css                        */
-const hr = ({
+const vr = ({
   id: d,
-  value: m,
+  value: l,
   step: x = 1,
   onChange: o,
   label: g,
@@ -42,13 +43,13 @@ const hr = ({
   required: $ = !1,
   disabled: p = !1
 }) => {
-  const a = k(null), c = k(null), [n, C] = s(""), [l, I] = s(""), [j, w] = s([]), [z, E] = s([]), [S, u] = s(!1), [T, f] = s(!1);
+  const a = k(null), c = k(null), [n, C] = s(""), [m, I] = s(""), [j, w] = s([]), [z, E] = s([]), [S, u] = s(!1), [T, f] = s(!1);
   H(() => {
-    let [r, t] = m.split(":");
+    let [r, t] = l.split(":");
     r = parseInt(r), t = parseInt(t), (isNaN(r) || r < 0 || r > 23) && (r = 0), (isNaN(t) || t < 0 || t > 59) && (t = 0), r = `0${r}`.slice(-2), t = `0${t}`.slice(-2), C(r), I(t);
     const i = `${r}:${t}`;
-    i !== m && o && o(i);
-  }, [m, o]), H(() => {
+    i !== l && o && o(i);
+  }, [l, o]), H(() => {
     const r = [], t = [];
     for (let i = 0; i < 24; i++)
       r.push(`0${i}`.slice(-2));
@@ -56,14 +57,14 @@ const hr = ({
       t.push(`0${i}`.slice(-2));
     w(r), E(t);
   }, [x]);
-  const h = () => !!($ && (!n || !l)), v = () => {
+  const h = () => !!($ && (!n || !m)), v = () => {
     if (h()) return {
       caretColor: "var(--alxgrn-input-border-error)",
       borderColor: "var(--alxgrn-input-border-error)",
       backgroundColor: "var(--alxgrn-input-bg-error)"
     };
   }, F = (r) => {
-    u(!1), o && o(`${r.text ?? ""}:${l}`);
+    u(!1), o && o(`${r.text ?? ""}:${m}`);
   }, L = (r) => {
     f(!1), o && o(`${n}:${r.text ?? ""}`);
   };
@@ -98,7 +99,7 @@ const hr = ({
               id: `${d}-min`,
               ref: c,
               type: "text",
-              value: l,
+              value: m,
               style: v(),
               disabled: !!p,
               onClick: () => f(!0),
@@ -130,7 +131,7 @@ const hr = ({
         onClose: () => f(!1),
         horizontal: "inner-right",
         margin: "var(--alxgrn-unit-small)",
-        items: z.map((r) => ({ id: r, text: r, icon: r === l ? /* @__PURE__ */ e(O, {}) : /* @__PURE__ */ e("div", { className: "empty" }) })),
+        items: z.map((r) => ({ id: r, text: r, icon: r === m ? /* @__PURE__ */ e(O, {}) : /* @__PURE__ */ e("div", { className: "empty" }) })),
         onClick: L,
         maxHeight: "auto",
         width: "auto"
@@ -139,5 +140,5 @@ const hr = ({
   ] });
 };
 export {
-  hr as default
+  vr as default
 };

package/dist/components/layout/Content.d.ts

@@ -2,7 +2,6 @@ import { FC, PropsWithChildren } from 'react';
 import { MainMenuItem } from './MainMenu';
 type Props = {
     mainMenu: MainMenuItem[];
-    onMenuClick?: (id: string) => void;
 };
 declare const Content: FC<PropsWithChildren<Props>>;
 export default Content;

package/dist/components/layout/Content.js

@@ -1,10 +1,10 @@
-import { jsxs as a, jsx as n } from "react/jsx-runtime";
-import i from "./MainMenu.js";
+import { jsxs as s, jsx as n } from "react/jsx-runtime";
+import a from "./MainMenu.js";
 import '../../assets/Content.css';/* empty css                     */
-const c = ({ children: t, mainMenu: e, onMenuClick: s }) => /* @__PURE__ */ a("main", { className: "Content", children: [
-  /* @__PURE__ */ n("div", { className: "ContentMenu", children: /* @__PURE__ */ n(i, { items: e, onMenuClick: s }) }),
+const r = ({ children: t, mainMenu: e }) => /* @__PURE__ */ s("main", { className: "Content", children: [
+  /* @__PURE__ */ n("div", { className: "ContentMenu", children: /* @__PURE__ */ n(a, { items: e }) }),
   /* @__PURE__ */ n("div", { className: "ContentMain", children: t })
 ] });
 export {
-  c as default
+  r as default
 };

package/dist/components/layout/Layout.d.ts

@@ -4,7 +4,6 @@ type Props = {
     mainMenu: MainMenuItem[];
     userMenu: React.ReactNode;
     onLogoClick?: () => void;
-    onMenuClick?: (id: string) => void;
 };
 declare const Layout: FC<PropsWithChildren<Props>>;
 export default Layout;

package/dist/components/layout/Layout.js

@@ -1,7 +1,7 @@
-import { jsxs as f, jsx as o } from "react/jsx-runtime";
-import { useState as n } from "react";
+import { jsxs as n, jsx as o } from "react/jsx-runtime";
+import { useState as a } from "react";
 import l from "./Header.js";
-import u from "./Content.js";
+import f from "./Content.js";
 import '../../assets/Expandable.css';import '../../assets/Editable.css';import '../../assets/Toolbar.css';import '../../assets/Scroll.css';import '../../assets/Message.css';import '../../assets/Modal.css';import '../../assets/Overlay.css';import '../../assets/Panel.css';import '../../assets/Block.css';import '../../assets/Input.css';import '../../assets/Files.css';import '../../assets/Menu.css';import '../../assets/FormCol.css';import '../../assets/FormRow.css';import '../../assets/Button.css';import '../../assets/Fieldset.css';import '../../assets/RadioLabel.css';import '../../assets/DatePicker.css';import '../../assets/Label.css';import '../../assets/RequiredMark.css';import '../../assets/TelefragLogo.css';import '../../assets/TelefragSymbol.css';import '../../assets/Popup.css';import '../../assets/PageHeader.css';/* empty css                        */
 import "react-transition-group";
 import "react-dom";
@@ -25,35 +25,33 @@ import "react-dom";
 /* empty css                   */
 /* empty css                     */
 /* empty css                    */
-import { Sidebar as d } from "../ui/sidebar/Sidebar.js";
+import { Sidebar as u } from "../ui/sidebar/Sidebar.js";
 /* empty css                     */
 /* empty css                      */
 /* empty css                        */
 import c from "./MainMenu.js";
-const W = ({ children: p, mainMenu: m, userMenu: e, onLogoClick: s, onMenuClick: t }) => {
-  const [a, r] = n(!1);
-  return /* @__PURE__ */ f("div", { className: "Layout", children: [
+const T = ({ children: r, mainMenu: i, userMenu: m, onLogoClick: p }) => {
+  const [e, t] = a(!1);
+  return /* @__PURE__ */ n("div", { className: "Layout", children: [
     /* @__PURE__ */ o(
       l,
       {
-        userMenu: e,
-        onMenuSwitch: () => r((i) => !i),
-        onLogoClick: s
+        userMenu: m,
+        onMenuSwitch: () => t((s) => !s),
+        onLogoClick: p
       }
     ),
-    /* @__PURE__ */ o(u, { mainMenu: m, onMenuClick: t, children: p }),
+    /* @__PURE__ */ o(f, { mainMenu: i, children: r }),
     /* @__PURE__ */ o(
-      d,
+      u,
       {
-        isOpen: a,
-        onClose: () => r(!1),
+        isOpen: e,
+        onClose: () => t(!1),
         children: /* @__PURE__ */ o(
           c,
           {
-            items: m,
-            onMenuClick: (i) => {
-              r(!1), t && t(i);
-            }
+            items: i,
+            onMenuClick: () => t(!1)
           }
         )
       }
@@ -61,5 +59,5 @@ const W = ({ children: p, mainMenu: m, userMenu: e, onLogoClick: s, onMenuClick:
   ] });
 };
 export {
-  W as default
+  T as default
 };

package/dist/components/layout/MainMenu.d.ts

@@ -1,24 +1,24 @@
 import { FC, ReactNode } from 'react';
 export type MainMenuTitle = {
-    id?: never;
     text?: never;
     icon?: never;
+    link?: never;
     title: string;
     checked?: never;
     node?: never;
 };
 export type MainMenuAlternative = {
-    id: string;
     text: string;
     icon: ReactNode;
+    link: string;
     title?: never;
     checked?: boolean;
     node?: never;
 };
 export type MainMenuNode = {
-    id?: never;
     text?: never;
     icon?: never;
+    link?: never;
     title?: string;
     checked?: never;
     node: ReactNode;
@@ -26,7 +26,7 @@ export type MainMenuNode = {
 export type MainMenuItem = MainMenuTitle | MainMenuAlternative | MainMenuNode;
 type Props = {
     items: MainMenuItem[];
-    onMenuClick?: (id: string) => void;
+    onMenuClick?: () => void;
 };
 declare const MainMenu: FC<Props>;
 export default MainMenu;

package/dist/components/layout/MainMenu.js

@@ -1,21 +1,17 @@
-import { jsx as e, jsxs as l, Fragment as c } from "react/jsx-runtime";
+import { jsx as n, jsxs as t } from "react/jsx-runtime";
 import '../../assets/MainMenu.css';/* empty css                      */
-const o = ({ items: s, onMenuClick: a }) => /* @__PURE__ */ e("div", { className: "MainMenu", children: s.map((n, i) => /* @__PURE__ */ l(
+import { Link as i } from "react-router";
+const o = ({ items: r, onMenuClick: a }) => /* @__PURE__ */ n("div", { className: "MainMenu", children: r.map((e, s) => /* @__PURE__ */ n(
   "div",
   {
-    onClick: () => {
-      a && n.id && a(n.id);
-    },
-    className: n.node ? "MainMenuNode" : n.title ? "MainMenuTitle" : "MainMenuAlternative",
-    children: [
-      n.node ? n.node : n.title ? /* @__PURE__ */ e("span", { className: "one-line", children: n.title }) : /* @__PURE__ */ l(c, { children: [
-        n.icon,
-        /* @__PURE__ */ e("span", { className: "one-line", children: n.text })
-      ] }),
-      n.checked && /* @__PURE__ */ e("span", { className: "MainMenuCheck" })
-    ]
+    className: e.node ? "MainMenuNode" : e.title ? "MainMenuTitle" : "MainMenuAlternative",
+    children: e.node ? e.node : e.title ? e.title : /* @__PURE__ */ t(i, { to: e.link ?? "/", onClick: () => a == null ? void 0 : a(), children: [
+      e.icon,
+      /* @__PURE__ */ n("span", { className: "MainMenuAlternativeText", children: e.text }),
+      e.checked && /* @__PURE__ */ n("span", { className: "MainMenuAlternativeCheck" })
+    ] })
   },
-  i
+  s
 )) });
 export {
   o as default

package/dist/components/layout/Page.js

@@ -29,8 +29,9 @@ import { Sidebar as n } from "../ui/sidebar/Sidebar.js";
 /* empty css                        */
 /* empty css                    */
 /* empty css                      */
+import "react-router";
 /* empty css                     */
-const K = ({ header: o, children: p, sidebar: i, isSidebarVisible: e = !1, onSidebarClose: t }) => /* @__PURE__ */ m("div", { className: "Page", children: [
+const L = ({ header: o, children: p, sidebar: i, isSidebarVisible: e = !1, onSidebarClose: t }) => /* @__PURE__ */ m("div", { className: "Page", children: [
   o && /* @__PURE__ */ r(a, { children: o }),
   /* @__PURE__ */ m("div", { className: i ? "PageBody" : "PageBody Wide", children: [
     /* @__PURE__ */ r("div", { className: "PageContent", children: p }),
@@ -49,5 +50,5 @@ const K = ({ header: o, children: p, sidebar: i, isSidebarVisible: e = !1, onSid
   )
 ] });
 export {
-  K as default
+  L as default
 };

package/dist/components/layout/PageHeader.js

@@ -31,8 +31,9 @@ import x from "../ui/toolbar/Toolbar.js";
 /* empty css                        */
 /* empty css                    */
 /* empty css                      */
+import "react-router";
 /* empty css                     */
-const de = ({
+const te = ({
   menu: d,
   title: C,
   subtitle: T,
@@ -106,5 +107,5 @@ const de = ({
   ] });
 };
 export {
-  de as default
+  te as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@alxgrn/telefrag-ui",
   "description": "UI library for The Daily Telefrag project",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "private": false,
   "author": "Alexander Fedorov <alex@molner.ru>",
   "license": "Apache-2.0",
@@ -30,6 +30,7 @@
   "peerDependencies": {
     "react": "^19.2.0",
     "react-dom": "^19.2.0",
+    "react-router": "^7.8.1",
     "react-transition-group": "^4.4.5"
   },
   "devDependencies": {