@alxgrn/telefrag-ui 0.0.11 → 0.0.13

package/dist/assets/MainMenu.css

@@ -0,0 +1 @@
+.MainMenu div{display:flex;align-items:center;gap:var(--alxgrn-unit-half);margin-bottom:var(--alxgrn-unit-half);cursor:pointer}.MainMenu div:hover *{color:var(--alxgrn-color-accent)}.MainMenu div svg{font-size:var(--alxgrn-font-size-big)}.MainMenu div span{font-size:var(--alxgrn-font-size)}

package/dist/assets/Page.css

@@ -1 +1 @@
-*{box-sizing:border-box;overflow-wrap:anywhere}:root{--alxgrn-unit: 16px;--alxgrn-unit-half: 8px;--alxgrn-unit-small: 4px;--alxgrn-unit-double: 32px;--alxgrn-unit-smallest: 2px;--alxgrn-animation-length: .15s;--alxgrn-font-size: 16px;--alxgrn-font-size-large: 18px;--alxgrn-font-size-small: 14px;--alxgrn-line-height: 1.3;--alxgrn-font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;--alxgrn-color-text: #555;--alxgrn-color-dark: var(--alxgrn-color-text);--alxgrn-color-light: lightslategrey;--alxgrn-color-error: firebrick;--alxgrn-color-accent: steelblue;--alxgrn-color-active: var(--alxgrn-color-text);--alxgrn-color-success: forestgreen;--alxgrn-color-scroll: #ccc;--alxgrn-bg-main: #eee;--alxgrn-bg-panel: #fff;--alxgrn-bg-modal: var(--alxgrn-bg-panel);--alxgrn-bg-popup: var(--alxgrn-bg-panel);--alxgrn-bg-dark: #888;--alxgrn-bg-light: rgba(119, 136, 153, .1);--alxgrn-bg-error: rgba(178, 34, 34, .1);--alxgrn-bg-accent: #ecf2f7;--alxgrn-bg-active: moccasin;--alxgrn-bg-success: rgba(34, 139, 34, .1);--alxgrn-border-dark: rgba(136, 136, 136, 1);--alxgrn-border-light: rgba(119, 136, 153, 1);--alxgrn-border-error: rgba(178, 34, 34, 1);--alxgrn-border-accent: rgba(70, 130, 180, 1);--alxgrn-border-active: moccasin;--alxgrn-border-success: rgba(34, 139, 34, 1)}[data-theme=dark]{--alxgrn-color-text: #999;--alxgrn-color-light: #666;--alxgrn-color-scroll: var(--alxgrn-bg-active);--alxgrn-bg-main: #111;--alxgrn-bg-panel: #222;--alxgrn-bg-modal: #222;--alxgrn-bg-popup: #333;--alxgrn-bg-accent: #333b3f;--alxgrn-bg-active: #444;--alxgrn-border-dark: rgba(136, 136, 136, .5);--alxgrn-border-light: rgba(119, 136, 153, .5);--alxgrn-border-error: rgba(178, 34, 34, .5);--alxgrn-border-accent: rgba(70, 130, 180, .5);--alxgrn-border-active: rgba(255, 228, 181, .5);--alxgrn-border-success: rgba(34, 139, 34, .5)}.Scrollbar::-webkit-scrollbar{width:var(--alxgrn-unit-small);height:var(--alxgrn-unit-small)}.Scrollbar::-webkit-scrollbar-track{background-color:transparent;border-radius:var(--alxgrn-unit-small)}.Scrollbar::-webkit-scrollbar-thumb{background-color:var(--alxgrn-color-scroll);border-radius:var(--alxgrn-unit-small)}.Scrollbar::-webkit-scrollbar-corner{background-color:transparent}:root{--alxgrn-form-width: 512px;--alxgrn-form-width-wide: 1024px}.Form{max-width:var(--alxgrn-form-width)}.Form.FormWide{max-width:var(--alxgrn-form-width-wide)}.Form *{font-size:inherit;line-height:inherit;font-family:inherit;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}.Form .FormItem{display:block;margin:var(--alxgrn-unit) 0}.FormSubmitButtons{margin-top:var(--alxgrn-unit-double);margin-bottom:0;display:flex;flex-wrap:nowrap;justify-content:space-between;gap:var(--alxgrn-unit)}:root{--alxgrn-layout-width: 1024px;--alxgrn-layout-menu-width: 150px;--alxgrn-layout-header-height: calc(3 * var(--alxgrn-unit))}.LayoutSidebarShow{display:none}@media (max-width: 768px){.LayoutSidebarShow{display:initial}}.Page{display:flex;flex-direction:column;gap:var(--alxgrn-unit)}.Page .PageBody{display:flex;gap:var(--alxgrn-unit);align-items:stretch}.Page .PageBody .PageContent{flex:1 1 auto}.Page .PageBody .PageSidebar{flex:0 0 auto;width:33%;display:flex;align-items:flex-end}.Page .PageBody .PageSidebar .PageSidebarInner{width:100%;position:sticky;bottom:var(--alxgrn-unit);min-height:calc(100vh - var(--alxgrn-layout-header-height) - var(--alxgrn-unit))}@media (max-width: 768px){.Page .PageBody .PageSidebar{display:none}}
+*{box-sizing:border-box;overflow-wrap:anywhere}:root{--alxgrn-unit: 16px;--alxgrn-unit-half: 8px;--alxgrn-unit-small: 4px;--alxgrn-unit-double: 32px;--alxgrn-unit-smallest: 2px;--alxgrn-animation-length: .15s;--alxgrn-font-size: 16px;--alxgrn-font-size-big: 20px;--alxgrn-font-size-large: 18px;--alxgrn-font-size-small: 14px;--alxgrn-line-height: 1.3;--alxgrn-font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;--alxgrn-color-text: #555;--alxgrn-color-dark: var(--alxgrn-color-text);--alxgrn-color-light: lightslategrey;--alxgrn-color-error: firebrick;--alxgrn-color-accent: steelblue;--alxgrn-color-active: var(--alxgrn-color-text);--alxgrn-color-success: forestgreen;--alxgrn-color-scroll: #ccc;--alxgrn-bg-main: #eee;--alxgrn-bg-panel: #fff;--alxgrn-bg-modal: var(--alxgrn-bg-panel);--alxgrn-bg-popup: var(--alxgrn-bg-panel);--alxgrn-bg-dark: #888;--alxgrn-bg-light: rgba(119, 136, 153, .1);--alxgrn-bg-error: rgba(178, 34, 34, .1);--alxgrn-bg-accent: #ecf2f7;--alxgrn-bg-active: moccasin;--alxgrn-bg-success: rgba(34, 139, 34, .1);--alxgrn-border-dark: rgba(136, 136, 136, 1);--alxgrn-border-light: rgba(119, 136, 153, 1);--alxgrn-border-error: rgba(178, 34, 34, 1);--alxgrn-border-accent: rgba(70, 130, 180, 1);--alxgrn-border-active: moccasin;--alxgrn-border-success: rgba(34, 139, 34, 1)}[data-theme=dark]{--alxgrn-color-text: #999;--alxgrn-color-light: #666;--alxgrn-color-scroll: var(--alxgrn-bg-active);--alxgrn-bg-main: #111;--alxgrn-bg-panel: #222;--alxgrn-bg-modal: #222;--alxgrn-bg-popup: #333;--alxgrn-bg-accent: #333b3f;--alxgrn-bg-active: #444;--alxgrn-border-dark: rgba(136, 136, 136, .5);--alxgrn-border-light: rgba(119, 136, 153, .5);--alxgrn-border-error: rgba(178, 34, 34, .5);--alxgrn-border-accent: rgba(70, 130, 180, .5);--alxgrn-border-active: rgba(255, 228, 181, .5);--alxgrn-border-success: rgba(34, 139, 34, .5)}.Scrollbar::-webkit-scrollbar{width:var(--alxgrn-unit-small);height:var(--alxgrn-unit-small)}.Scrollbar::-webkit-scrollbar-track{background-color:transparent;border-radius:var(--alxgrn-unit-small)}.Scrollbar::-webkit-scrollbar-thumb{background-color:var(--alxgrn-color-scroll);border-radius:var(--alxgrn-unit-small)}.Scrollbar::-webkit-scrollbar-corner{background-color:transparent}:root{--alxgrn-form-width: 512px;--alxgrn-form-width-wide: 1024px}.Form{max-width:var(--alxgrn-form-width)}.Form.FormWide{max-width:var(--alxgrn-form-width-wide)}.Form *{font-size:inherit;line-height:inherit;font-family:inherit;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}.Form .FormItem{display:block;margin:var(--alxgrn-unit) 0}.FormSubmitButtons{margin-top:var(--alxgrn-unit-double);margin-bottom:0;display:flex;flex-wrap:nowrap;justify-content:space-between;gap:var(--alxgrn-unit)}:root{--alxgrn-layout-width: 1024px;--alxgrn-layout-menu-width: 150px;--alxgrn-layout-header-height: calc(3 * var(--alxgrn-unit))}.LayoutSidebarShow{display:none}@media (max-width: 768px){.LayoutSidebarShow{display:initial}}.Page{display:flex;flex-direction:column;gap:var(--alxgrn-unit)}.Page .PageBody{display:flex;gap:var(--alxgrn-unit);align-items:stretch}.Page .PageBody .PageContent{flex:1 1 auto}.Page .PageBody .PageSidebar{flex:0 0 auto;width:33%;display:flex;align-items:flex-end}.Page .PageBody .PageSidebar .PageSidebarInner{width:100%;position:sticky;bottom:var(--alxgrn-unit);min-height:calc(100vh - var(--alxgrn-layout-header-height) - var(--alxgrn-unit))}@media (max-width: 768px){.Page .PageBody .PageSidebar{display:none}}

package/dist/components/form/checkbox/Checkbox.js

@@ -1,26 +1,28 @@
 import { jsx as e } from "react/jsx-runtime";
-import { Radio as f } from "../radio/Radio.js";
-const d = ({
-  value: o,
-  onChange: a,
-  label: s,
-  bottom: m,
-  required: r = !1,
-  disabled: t = !1,
-  checked: c = !1
+import { Radio as l } from "../radio/Radio.js";
+const p = ({
+  id: o,
+  value: a,
+  onChange: s,
+  label: m,
+  bottom: r,
+  required: t = !1,
+  disabled: c = !1,
+  checked: f = !1
 }) => /* @__PURE__ */ e("div", { className: "FormItem", children: /* @__PURE__ */ e(
-  f,
+  l,
   {
+    id: o,
     type: "checkbox",
-    label: s,
-    value: o,
-    bottom: m,
-    required: r,
-    disabled: t,
-    checked: c,
-    onChange: a
+    label: m,
+    value: a,
+    bottom: r,
+    required: t,
+    disabled: c,
+    checked: f,
+    onChange: s
   }
 ) });
 export {
-  d as default
+  p as default
 };

package/dist/components/form/checkbox/CheckboxList.d.ts

@@ -9,6 +9,7 @@ export interface CheckboxListOption {
     required?: boolean | null;
 }
 export interface CheckboxListProps {
+    id: string;
     label?: string | null;
     options: CheckboxListOption[];
     onChange: (v: CheckboxListOption[]) => void;

package/dist/components/form/checkbox/CheckboxList.js

@@ -1,32 +1,34 @@
 import { jsx as f } from "react/jsx-runtime";
-import { useState as u, useEffect as b } from "react";
-import i from "../fieldset/Fieldset.js";
-import { Radio as k } from "../radio/Radio.js";
-const g = ({
-  label: d,
-  onChange: n,
+import { useState as b, useEffect as i } from "react";
+import k from "../fieldset/Fieldset.js";
+import { Radio as m } from "../radio/Radio.js";
+const v = ({
+  id: d,
+  label: n,
+  onChange: h,
   required: t = !1,
   disabled: a = !1,
   options: r
 }) => {
-  const [l, s] = u(!1);
-  b(() => {
+  const [l, s] = b(!1);
+  i(() => {
     s(!1), t && r.findIndex((o) => o.checked === !0) < 0 && s(!0);
   }, [t, r]);
-  const h = (e, o) => {
+  const u = (e, o) => {
     const c = [...r];
-    c[e].checked = o, n(c);
+    c[e].checked = o, h(c);
   };
   return /* @__PURE__ */ f(
-    i,
+    k,
     {
-      label: d,
+      label: n,
       error: l,
       disabled: a,
       required: t,
       children: r.map((e, o) => /* @__PURE__ */ f(
-        k,
+        m,
         {
+          id: d,
           type: "checkbox",
           error: l,
           label: e.label,
@@ -35,7 +37,7 @@ const g = ({
           disabled: e.disabled || a,
           required: e.required,
           checked: e.checked,
-          onChange: (c) => h(o, c)
+          onChange: (c) => u(o, c)
         },
         o
       ))
@@ -43,6 +45,6 @@ const g = ({
   );
 };
 export {
-  g as CheckboxList,
-  g as default
+  v as CheckboxList,
+  v as default
 };

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

@@ -3,7 +3,7 @@ import { useState as g, useEffect as q } from "react";
 import { deepForEach as y } from "react-children-utilities";
 import x, { isValidDate as H } from "../date/Date.js";
 import { Button as F } from "../button/Button.js";
-import '../../../assets/Content.css';import '../../../assets/Footer.css';import '../../../assets/Header.css';import '../../../assets/Editable.css';import '../../../assets/Sidebar.css';import '../../../assets/Message.css';import '../../../assets/Modal.css';import '../../../assets/Overlay.css';import '../../../assets/Panel.css';import '../../../assets/Menu.css';import '../../../assets/Popup.css';import '../../../assets/Fieldset.css';import '../../../assets/Label.css';import '../../../assets/RequiredMark.css';import '../../../assets/DatePicker.css';import '../../../assets/FormCol.css';import '../../../assets/FormRow.css';import '../../../assets/Page.css';/* empty css                     */
+import '../../../assets/Content.css';import '../../../assets/MainMenu.css';import '../../../assets/Footer.css';import '../../../assets/Header.css';import '../../../assets/Editable.css';import '../../../assets/Sidebar.css';import '../../../assets/Message.css';import '../../../assets/Modal.css';import '../../../assets/Overlay.css';import '../../../assets/Panel.css';import '../../../assets/Menu.css';import '../../../assets/Popup.css';import '../../../assets/Fieldset.css';import '../../../assets/Label.css';import '../../../assets/RequiredMark.css';import '../../../assets/DatePicker.css';import '../../../assets/FormCol.css';import '../../../assets/FormRow.css';import '../../../assets/Page.css';/* empty css                     */
 /* empty css                        */
 /* empty css                        */
 /* empty css                           */
@@ -31,8 +31,9 @@ import l from "../../ui/block/Block.js";
 /* empty css                         */
 /* empty css                       */
 /* empty css                       */
+/* empty css                         */
 /* empty css                        */
-const ye = ({
+const xe = ({
   info: u,
   error: d,
   success: k,
@@ -153,6 +154,6 @@ const ye = ({
   ] });
 };
 export {
-  ye as Form,
-  ye as default
+  xe as Form,
+  xe as default
 };

package/dist/components/form/radio/Radio.d.ts

@@ -8,6 +8,7 @@ import { default as React } from 'react';
  * отметки элемента.
  */
 export interface RadioProps {
+    id: string;
     type?: 'radio' | 'checkbox';
     value: string | number;
     error?: boolean;

package/dist/components/form/radio/Radio.js

@@ -1,29 +1,31 @@
 import { jsx as t } from "react/jsx-runtime";
-import n from "./RadioLabel.js";
-const p = ({
-  type: l = "radio",
-  value: s,
-  onChange: f,
-  label: o,
-  bottom: u,
-  error: d = !1,
+import c from "./RadioLabel.js";
+const h = ({
+  id: l,
+  type: s = "radio",
+  value: f,
+  onChange: o,
+  label: u,
+  bottom: d,
+  error: i = !1,
   required: e = !1,
   disabled: r = !1,
   checked: a = !1
 }) => /* @__PURE__ */ t(
-  n,
+  c,
   {
-    label: o,
-    bottom: u,
+    label: u,
+    bottom: d,
     required: !!e,
-    error: d || e && !a,
+    error: i || e && !a,
     disabled: !!r,
     checked: !!a,
     children: /* @__PURE__ */ t(
       "input",
       {
-        type: l,
-        onChange: (i) => f(i.target.checked, s),
+        id: l,
+        type: s,
+        onChange: (n) => o(n.target.checked, f),
         checked: !!a,
         disabled: !!r,
         required: !!e
@@ -32,6 +34,6 @@ const p = ({
   }
 );
 export {
-  p as Radio,
-  p as default
+  h as Radio,
+  h as default
 };

package/dist/components/form/radio/RadioList.d.ts

@@ -12,6 +12,7 @@ export interface RadioListOption {
     required?: boolean | null;
 }
 export interface RadioListProps {
+    id: string;
     label?: string | null;
     value: RadioListValue;
     options: RadioListOption[];

package/dist/components/form/radio/RadioList.js

@@ -1,21 +1,22 @@
 import { jsx as d } from "react/jsx-runtime";
-import { useState as m, useEffect as b } from "react";
-import { Radio as x } from "./Radio.js";
-import p from "../fieldset/Fieldset.js";
-const g = ({ label: n, value: r, onChange: i, required: o = !1, disabled: l = !1, options: a }) => {
-  const [t, s] = m(!1);
-  return b(() => {
+import { useState as b, useEffect as x } from "react";
+import { Radio as p } from "./Radio.js";
+import h from "../fieldset/Fieldset.js";
+const j = ({ id: n, label: i, value: r, onChange: c, required: o = !1, disabled: l = !1, options: a }) => {
+  const [t, s] = b(!1);
+  return x(() => {
     s(!1), o && a.findIndex((f) => f.value === r) < 0 && s(!0);
   }, [r, o, a]), /* @__PURE__ */ d(
-    p,
+    h,
     {
-      label: n,
+      label: i,
       error: t,
       disabled: l,
       required: o,
       children: a.map((e, f) => /* @__PURE__ */ d(
-        x,
+        p,
         {
+          id: n,
           label: e.label,
           value: e.value,
           error: t,
@@ -23,7 +24,7 @@ const g = ({ label: n, value: r, onChange: i, required: o = !1, disabled: l = !1
           disabled: e.disabled || l,
           required: e.required,
           checked: e.value === r,
-          onChange: (c, u) => i(u, c)
+          onChange: (u, m) => c(m, u)
         },
         f
       ))
@@ -31,6 +32,6 @@ const g = ({ label: n, value: r, onChange: i, required: o = !1, disabled: l = !1
   );
 };
 export {
-  g as RadioList,
-  g as default
+  j as RadioList,
+  j as default
 };

package/dist/components/icons/Calendar.d.ts

@@ -0,0 +1,2 @@
+declare const Calendar: () => import("react/jsx-runtime").JSX.Element;
+export default Calendar;

package/dist/components/icons/Calendar.js

@@ -0,0 +1,24 @@
+import { jsxs as e, jsx as t } from "react/jsx-runtime";
+const o = () => /* @__PURE__ */ e(
+  "svg",
+  {
+    stroke: "currentColor",
+    fill: "none",
+    strokeWidth: "2",
+    viewBox: "0 0 24 24",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    height: "1em",
+    width: "1em",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [
+      /* @__PURE__ */ t("path", { d: "M8 2v4" }),
+      /* @__PURE__ */ t("path", { d: "M16 2v4" }),
+      /* @__PURE__ */ t("rect", { width: "18", height: "18", x: "3", y: "4", rx: "2" }),
+      /* @__PURE__ */ t("path", { d: "M3 10h18" })
+    ]
+  }
+);
+export {
+  o as default
+};

package/dist/components/icons/Files.d.ts

@@ -0,0 +1,2 @@
+declare const Files: () => import("react/jsx-runtime").JSX.Element;
+export default Files;

package/dist/components/icons/Files.js

@@ -0,0 +1,23 @@
+import { jsxs as e, jsx as t } from "react/jsx-runtime";
+const r = () => /* @__PURE__ */ e(
+  "svg",
+  {
+    stroke: "currentColor",
+    fill: "none",
+    strokeWidth: "2",
+    viewBox: "0 0 24 24",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    height: "1em",
+    width: "1em",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [
+      /* @__PURE__ */ t("path", { d: "M20 7h-3a2 2 0 0 1-2-2V2" }),
+      /* @__PURE__ */ t("path", { d: "M9 18a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h7l4 4v10a2 2 0 0 1-2 2Z" }),
+      /* @__PURE__ */ t("path", { d: "M3 7.6v12.8A1.6 1.6 0 0 0 4.6 22h9.8" })
+    ]
+  }
+);
+export {
+  r as default
+};

package/dist/components/icons/Gamepad.d.ts

@@ -0,0 +1,2 @@
+declare const Gamepad: () => import("react/jsx-runtime").JSX.Element;
+export default Gamepad;

package/dist/components/icons/Gamepad.js

@@ -0,0 +1,25 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+const t = () => /* @__PURE__ */ o(
+  "svg",
+  {
+    stroke: "currentColor",
+    fill: "none",
+    strokeWidth: "2",
+    viewBox: "0 0 24 24",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    height: "1em",
+    width: "1em",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [
+      /* @__PURE__ */ e("line", { x1: "6", x2: "10", y1: "11", y2: "11" }),
+      /* @__PURE__ */ e("line", { x1: "8", x2: "8", y1: "9", y2: "13" }),
+      /* @__PURE__ */ e("line", { x1: "15", x2: "15.01", y1: "12", y2: "12" }),
+      /* @__PURE__ */ e("line", { x1: "18", x2: "18.01", y1: "10", y2: "10" }),
+      /* @__PURE__ */ e("path", { d: "M17.32 5H6.68a4 4 0 0 0-3.978 3.59c-.006.052-.01.101-.017.152C2.604 9.416 2 14.456 2 16a3 3 0 0 0 3 3c1 0 1.5-.5 2-1l1.414-1.414A2 2 0 0 1 9.828 16h4.344a2 2 0 0 1 1.414.586L17 18c.5.5 1 1 2 1a3 3 0 0 0 3-3c0-1.545-.604-6.584-.685-7.258-.007-.05-.011-.1-.017-.151A4 4 0 0 0 17.32 5z" })
+    ]
+  }
+);
+export {
+  t as default
+};

package/dist/components/icons/Rocket.d.ts

@@ -0,0 +1,2 @@
+declare const Rocket: () => import("react/jsx-runtime").JSX.Element;
+export default Rocket;

package/dist/components/icons/Rocket.js

@@ -0,0 +1,24 @@
+import { jsxs as o, jsx as t } from "react/jsx-runtime";
+const s = () => /* @__PURE__ */ o(
+  "svg",
+  {
+    stroke: "currentColor",
+    fill: "none",
+    strokeWidth: "2",
+    viewBox: "0 0 24 24",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    height: "1em",
+    width: "1em",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [
+      /* @__PURE__ */ t("path", { d: "M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z" }),
+      /* @__PURE__ */ t("path", { d: "m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z" }),
+      /* @__PURE__ */ t("path", { d: "M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0" }),
+      /* @__PURE__ */ t("path", { d: "M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5" })
+    ]
+  }
+);
+export {
+  s as default
+};

package/dist/components/icons/Users.d.ts

@@ -0,0 +1,2 @@
+declare const Users: () => import("react/jsx-runtime").JSX.Element;
+export default Users;

package/dist/components/icons/Users.js

@@ -0,0 +1,24 @@
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+const o = () => /* @__PURE__ */ r(
+  "svg",
+  {
+    stroke: "currentColor",
+    fill: "none",
+    strokeWidth: "2",
+    viewBox: "0 0 24 24",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    height: "1em",
+    width: "1em",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [
+      /* @__PURE__ */ e("path", { d: "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }),
+      /* @__PURE__ */ e("circle", { cx: "9", cy: "7", r: "4" }),
+      /* @__PURE__ */ e("path", { d: "M22 21v-2a4 4 0 0 0-3-3.87" }),
+      /* @__PURE__ */ e("path", { d: "M16 3.13a4 4 0 0 1 0 7.75" })
+    ]
+  }
+);
+export {
+  o as default
+};

package/dist/components/icons/index.d.ts

@@ -1,7 +1,12 @@
 import { default as Asterisk } from './Asterisk';
+import { default as Calendar } from './Calendar';
 import { default as ChevronLeft } from './ChevronLeft';
 import { default as ChevronRight } from './ChevronRight';
+import { default as Files } from './Files';
+import { default as Gamepad } from './Gamepad';
 import { default as Menu } from './Menu';
 import { default as Plus } from './Plus';
+import { default as Rocket } from './Rocket';
 import { default as TelefragLogo } from './TelefragLogo';
-export { Asterisk, ChevronLeft, ChevronRight, Menu, Plus, TelefragLogo, };
+import { default as Users } from './Users';
+export { Asterisk, Calendar, ChevronLeft, ChevronRight, Files, Gamepad, Menu, Plus, Rocket, TelefragLogo, Users, };

package/dist/components/icons/index.js

@@ -1,14 +1,24 @@
-import { default as r } from "./Asterisk.js";
-import { default as f } from "./ChevronLeft.js";
-import { default as s } from "./ChevronRight.js";
-import { default as u } from "./Menu.js";
-import { default as m } from "./Plus.js";
-import { default as x } from "./TelefragLogo.js";
+import { default as a } from "./Asterisk.js";
+import { default as t } from "./Calendar.js";
+import { default as s } from "./ChevronLeft.js";
+import { default as d } from "./ChevronRight.js";
+import { default as m } from "./Files.js";
+import { default as x } from "./Gamepad.js";
+import { default as g } from "./Menu.js";
+import { default as i } from "./Plus.js";
+import { default as k } from "./Rocket.js";
+import { default as L } from "./TelefragLogo.js";
+import { default as c } from "./Users.js";
 export {
-  r as Asterisk,
-  f as ChevronLeft,
-  s as ChevronRight,
-  u as Menu,
-  m as Plus,
-  x as TelefragLogo
+  a as Asterisk,
+  t as Calendar,
+  s as ChevronLeft,
+  d as ChevronRight,
+  m as Files,
+  x as Gamepad,
+  g as Menu,
+  i as Plus,
+  k as Rocket,
+  L as TelefragLogo,
+  c as Users
 };

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

@@ -1,6 +1,6 @@
-import { default as React, FC, PropsWithChildren } from 'react';
+import { FC, PropsWithChildren } from 'react';
 type Props = {
-    menu?: React.ReactNode;
+    onMenuClick?: (id: number | string) => void;
 };
 declare const Content: FC<PropsWithChildren<Props>>;
 export default Content;

package/dist/components/layout/Content.js

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

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

@@ -1,8 +1,8 @@
 import { default as React, FC, PropsWithChildren } from 'react';
 type Props = {
-    mainMenu: React.ReactNode;
     userMenu: React.ReactNode;
     onLogoClick?: () => void;
+    onMenuClick?: (id: number | string) => void;
 };
 declare const Layout: FC<PropsWithChildren<Props>>;
 export default Layout;

package/dist/components/layout/Layout.js

@@ -1,5 +1,5 @@
-import { jsxs as n, jsx as o } from "react/jsx-runtime";
-import { useState as a } from "react";
+import { jsxs as a, jsx as o } from "react/jsx-runtime";
+import { useState as n } from "react";
 import f from "./Header.js";
 import l from "./Footer.js";
 import u from "./Content.js";
@@ -26,31 +26,34 @@ import "react-dom";
 /* empty css                     */
 /* empty css                   */
 /* empty css                     */
-import { Sidebar as c } from "../ui/sidebar/Sidebar.js";
+import { Sidebar as d } from "../ui/sidebar/Sidebar.js";
 /* empty css                      */
-const Q = ({ children: i, mainMenu: r, userMenu: m, onLogoClick: p }) => {
-  const [e, t] = a(!1);
-  return /* @__PURE__ */ n("div", { className: "Layout", children: [
+import c from "./MainMenu.js";
+const U = ({ children: m, userMenu: p, onLogoClick: e, onMenuClick: r }) => {
+  const [s, t] = n(!1);
+  return /* @__PURE__ */ a("div", { className: "Layout", children: [
     /* @__PURE__ */ o(
       f,
       {
-        userMenu: m,
-        onMenuSwitch: () => t((s) => !s),
-        onLogoClick: p
+        userMenu: p,
+        onMenuSwitch: () => t((i) => !i),
+        onLogoClick: e
       }
     ),
-    /* @__PURE__ */ o(u, { menu: r, children: i }),
+    /* @__PURE__ */ o(u, { onMenuClick: r, children: m }),
     /* @__PURE__ */ o(l, {}),
     /* @__PURE__ */ o(
-      c,
+      d,
       {
-        isOpen: e,
+        isOpen: s,
         onClose: () => t(!1),
-        children: r
+        children: /* @__PURE__ */ o(c, { onMenuClick: (i) => {
+          t(!1), r && r(i);
+        } })
       }
     )
   ] });
 };
 export {
-  Q as default
+  U as default
 };

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

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+type Props = {
+    onMenuClick?: (id: number | string) => void;
+};
+declare const MainMenu: FC<Props>;
+export default MainMenu;

package/dist/components/layout/MainMenu.js

@@ -0,0 +1,37 @@
+import { jsx as i, jsxs as t } from "react/jsx-runtime";
+import e from "../icons/Calendar.js";
+import n from "../icons/Files.js";
+import c from "../icons/Gamepad.js";
+import s from "../icons/Rocket.js";
+import "react";
+import a from "../icons/Users.js";
+import '../../assets/MainMenu.css';/* empty css                      */
+const d = [{
+  id: "articles",
+  text: "Публикации",
+  icon: /* @__PURE__ */ i(n, {})
+}, {
+  id: "groups",
+  text: "Группы",
+  icon: /* @__PURE__ */ i(a, {})
+}, {
+  id: "projects",
+  text: "Проекты",
+  icon: /* @__PURE__ */ i(c, {})
+}, {
+  id: "launches",
+  text: "Запуски",
+  icon: /* @__PURE__ */ i(s, {})
+}, {
+  id: "calendar",
+  text: "Календарь",
+  icon: /* @__PURE__ */ i(e, {})
+}], M = ({ onMenuClick: r }) => /* @__PURE__ */ i("div", { className: "MainMenu", children: d.map((o) => /* @__PURE__ */ t("div", { onClick: () => {
+  r && r(o.id);
+}, children: [
+  o.icon,
+  /* @__PURE__ */ i("span", { children: o.text })
+] }, o.id)) });
+export {
+  M as default
+};

package/dist/components/layout/Page.js

@@ -1,5 +1,5 @@
 import { jsxs as t, jsx as i } from "react/jsx-runtime";
-import '../../assets/Content.css';import '../../assets/Footer.css';import '../../assets/Header.css';import '../../assets/Editable.css';import '../../assets/Message.css';import '../../assets/Modal.css';import '../../assets/Overlay.css';import '../../assets/Panel.css';import '../../assets/Block.css';import '../../assets/Select.css';import '../../assets/RadioLabel.css';import '../../assets/Input.css';import '../../assets/Files.css';import '../../assets/Fieldset.css';import '../../assets/Time.css';import '../../assets/Menu.css';import '../../assets/FormCol.css';import '../../assets/FormRow.css';import '../../assets/Button.css';import '../../assets/DatePicker.css';import '../../assets/Label.css';import '../../assets/RequiredMark.css';import '../../assets/Popup.css';import '../../assets/Page.css';/* empty css                  */
+import '../../assets/Content.css';import '../../assets/MainMenu.css';import '../../assets/Footer.css';import '../../assets/Header.css';import '../../assets/Editable.css';import '../../assets/Message.css';import '../../assets/Modal.css';import '../../assets/Overlay.css';import '../../assets/Panel.css';import '../../assets/Block.css';import '../../assets/Select.css';import '../../assets/RadioLabel.css';import '../../assets/Input.css';import '../../assets/Files.css';import '../../assets/Fieldset.css';import '../../assets/Time.css';import '../../assets/Menu.css';import '../../assets/FormCol.css';import '../../assets/FormRow.css';import '../../assets/Button.css';import '../../assets/DatePicker.css';import '../../assets/Label.css';import '../../assets/RequiredMark.css';import '../../assets/Popup.css';import '../../assets/Page.css';/* empty css                  */
 import "react";
 import "react-children-utilities";
 import "react-transition-group";
@@ -27,8 +27,9 @@ import { Sidebar as a } from "../ui/sidebar/Sidebar.js";
 /* empty css                      */
 /* empty css                    */
 /* empty css                    */
+/* empty css                      */
 /* empty css                     */
-const G = ({ header: m, children: p, sidebar: r, isSidebarVisible: e = !1, onSidebarClose: o }) => /* @__PURE__ */ t("div", { className: "Page", children: [
+const J = ({ header: m, children: p, sidebar: r, isSidebarVisible: e = !1, onSidebarClose: o }) => /* @__PURE__ */ t("div", { className: "Page", children: [
   m && /* @__PURE__ */ i("div", { className: "PageHeader", children: m }),
   /* @__PURE__ */ t("div", { className: "PageBody", children: [
     /* @__PURE__ */ i("div", { className: "PageContent", children: p }),
@@ -47,5 +48,5 @@ const G = ({ header: m, children: p, sidebar: r, isSidebarVisible: e = !1, onSid
   )
 ] });
 export {
-  G as default
+  J as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@alxgrn/telefrag-ui",
   "description": "UI library for The Daily Telefrag project",
-  "version": "0.0.11",
+  "version": "0.0.13",
   "private": false,
   "author": "Alexander Fedorov <alex@molner.ru>",
   "license": "Apache-2.0",