@arthurzakharov/ui-kit 2.11.0 → 2.12.0

package/dist/assets/sidebar-rLhJNVa5.css

@@ -0,0 +1 @@
+._Sidebar_ex9j5_1{display:block}._Board_ex9j5_5{border-radius:var(--rm-ui-border-radius-md);padding:var(--rm-ui-padding-lg);background-color:var(--rm-ui-sidebar-bg)}._SidebarTitle_ex9j5_11,._SidebarButton_ex9j5_12{padding-bottom:var(--rm-ui-padding-md)}._Steps_ex9j5_16,._Info_ex9j5_17{display:flex;flex-direction:column;align-items:flex-start;gap:var(--rm-ui-padding-sm)}._Step_ex9j5_16{display:inline-flex;align-items:center;gap:var(--rm-ui-padding-xs)}._InfoRow_ex9j5_30{display:inline-flex;align-items:center;justify-content:space-between;gap:var(--rm-ui-padding-xs)}._SidebarButton_ex9j5_12{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start}._SidebarExtras_ex9j5_44{padding-bottom:var(--rm-ui-padding-md)}@media screen and (min-width:1200px){._SidebarExtras_ex9j5_44{padding-bottom:var(--rm-ui-padding-lg)}}._NothingAbove_ex9j5_54{margin-top:var(--rm-ui-padding-lg)}@media screen and (min-width:1024px){._Board_ex9j5_5{padding:var(--rm-ui-padding-xl)}}@media screen and (min-width:1200px){._Board_ex9j5_5{padding:var(--rm-ui-padding-xxl)}._SidebarTitle_ex9j5_11,._SidebarButton_ex9j5_12{padding-bottom:var(--rm-ui-padding-lg)}}

package/dist/assets/timetable-CqiWwUNY.css

@@ -0,0 +1 @@
+._Timetable_zg6h3_1{display:flex;flex-direction:column;gap:var(--rm-ui-padding-xxs)}

package/dist/components/sidebar/sidebar.component.d.ts

@@ -1,4 +1,4 @@
-import { PropsWithChildren } from 'react';
+import { PropsWithChildren, ReactNode } from 'react';
 import { CertificationsProps } from '../certifications';
 import { UserPanelProps } from '../user-panel';
 import { State } from '../../controls/utils';
@@ -16,6 +16,7 @@ export interface SidebarProps extends PropsWithChildren<Base> {
     info: SidebarInfo[];
     user: UserPanelProps;
     certifications: CertificationsProps;
+    extras?: ReactNode;
 }
-export declare const Sidebar: ({ children, isButtonVisible, isUserOpen, title, steps, info, certifications, user, ...base }: SidebarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Sidebar: ({ children, isButtonVisible, isUserOpen, title, steps, info, certifications, user, extras, ...base }: SidebarProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/sidebar/sidebar.component.js

@@ -1,78 +1,90 @@
-import { jsx as t, jsxs as o, Fragment as u } from "react/jsx-runtime";
-import { clsx as m, baseProps as S } from "../../utils/functions/functions.util.js";
-import { FadeScale as h } from "../../animations/fade-scale/fade-scale.component.js";
-import { Certifications as B } from "../certifications/certifications.component.js";
-import { Line as n } from "../line/line.component.js";
-import { Text as s } from "../text/text.component.js";
+import { jsx as t, jsxs as o, Fragment as I } from "react/jsx-runtime";
+import { clsx as l, baseProps as h } from "../../utils/functions/functions.util.js";
+import { FadeScale as f } from "../../animations/fade-scale/fade-scale.component.js";
+import { Certifications as u } from "../certifications/certifications.component.js";
+import { Line as c } from "../line/line.component.js";
+import { Text as m } from "../text/text.component.js";
 import { UserPanel as w } from "../user-panel/user-panel.component.js";
 import "../../controls/primitives/box/box.component.js";
 import "../../utils/content/content.component.js";
 import "lucide-react";
 import "usehooks-ts";
-import { Status as x } from "../../controls/primitives/status/status.component.js";
-import '../../assets/sidebar-DyDlIXV0.css';const y = "_Sidebar_17t5d_1", A = "_Board_17t5d_5", T = "_SidebarTitle_17t5d_11", R = "_SidebarButton_17t5d_12", z = "_Steps_17t5d_16", C = "_Info_17t5d_17", $ = "_Step_17t5d_16", j = "_InfoRow_17t5d_30", F = "_NothingAbove_17t5d_44", i = {
-  Sidebar: y,
-  Board: A,
+import { Status as A } from "../../controls/primitives/status/status.component.js";
+import '../../assets/sidebar-rLhJNVa5.css';const B = "_Sidebar_ex9j5_1", y = "_Board_ex9j5_5", T = "_SidebarTitle_ex9j5_11", E = "_SidebarButton_ex9j5_12", R = "_Steps_ex9j5_16", z = "_Info_ex9j5_17", C = "_Step_ex9j5_16", $ = "_InfoRow_ex9j5_30", F = "_SidebarExtras_ex9j5_44", P = "_NothingAbove_ex9j5_54", e = {
+  Sidebar: B,
+  Board: y,
   SidebarTitle: T,
-  SidebarButton: R,
-  Steps: z,
-  Info: C,
-  Step: $,
-  InfoRow: j,
-  NothingAbove: F
-}, V = ({
+  SidebarButton: E,
+  Steps: R,
+  Info: z,
+  Step: C,
+  InfoRow: $,
+  SidebarExtras: F,
+  NothingAbove: P
+}, Y = ({
   // Sidebar props
-  children: f,
+  children: v,
   isButtonVisible: b = !1,
-  isUserOpen: l = !1,
-  title: g = "Ihre Übersicht",
-  steps: v = [],
+  isUserOpen: r = !1,
+  title: x = "Ihre Übersicht",
+  steps: g = [],
   info: N = [],
-  certifications: c,
-  user: a,
+  certifications: _,
+  user: d,
+  extras: n,
   // Base props
-  ...p
+  ...S
 }) => {
-  const _ = N.filter(([, e]) => e.trim() !== ""), d = _.length > 0;
+  const p = N.filter(([, i]) => i.trim() !== ""), a = p.length > 0;
   return /* @__PURE__ */ t(
     "div",
     {
-      "data-testid": S(p, "data-testid", "sidebar"),
-      className: m(i.Sidebar, S(p, "className")),
-      children: /* @__PURE__ */ o("div", { className: i.Board, children: [
-        /* @__PURE__ */ t(s, { preset: "sidebar-title", className: i.SidebarTitle, children: g }),
-        /* @__PURE__ */ t("div", { className: i.Steps, "data-testid": "sidebar-steps", children: v.map(({ state: e, text: r }) => /* @__PURE__ */ o("div", { className: i.Step, "data-testid": "sidebar-step", children: [
-          /* @__PURE__ */ t(x, { state: e }),
-          /* @__PURE__ */ t(s, { tag: "span", weight: "medium", size: "body-small", color: e === "idle" ? "grey-400" : "text-primary", children: r })
-        ] }, r)) }),
-        d && /* @__PURE__ */ o(u, { children: [
-          /* @__PURE__ */ t(n, {}),
-          /* @__PURE__ */ t("div", { className: i.Info, "data-testid": "sidebar-info", children: _.map(([e, r], I) => /* @__PURE__ */ o("div", { className: i.InfoRow, "data-testid": "sidebar-info-row", children: [
-            /* @__PURE__ */ t(s, { tag: "span", size: "body-small", color: "text-secondary", children: e }),
-            /* @__PURE__ */ t(s, { tag: "span", size: "body-small", align: "right", children: r })
-          ] }, `${e}-${I}`)) }),
-          /* @__PURE__ */ t(n, {})
+      "data-testid": h(S, "data-testid", "sidebar"),
+      className: l(e.Sidebar, h(S, "className")),
+      children: /* @__PURE__ */ o("div", { className: e.Board, children: [
+        /* @__PURE__ */ t(m, { preset: "sidebar-title", className: e.SidebarTitle, children: x }),
+        /* @__PURE__ */ t("div", { className: e.Steps, "data-testid": "sidebar-steps", children: g.map(({ state: i, text: s }) => /* @__PURE__ */ o("div", { className: e.Step, "data-testid": "sidebar-step", children: [
+          /* @__PURE__ */ t(A, { state: i }),
+          /* @__PURE__ */ t(m, { tag: "span", weight: "medium", size: "body-small", color: i === "idle" ? "grey-400" : "text-primary", children: s })
+        ] }, s)) }),
+        a && /* @__PURE__ */ o(I, { children: [
+          /* @__PURE__ */ t(c, {}),
+          /* @__PURE__ */ t("div", { className: e.Info, "data-testid": "sidebar-info", children: p.map(([i, s], j) => /* @__PURE__ */ o("div", { className: e.InfoRow, "data-testid": "sidebar-info-row", children: [
+            /* @__PURE__ */ t(m, { tag: "span", size: "body-small", color: "text-secondary", children: i }),
+            /* @__PURE__ */ t(m, { tag: "span", size: "body-small", align: "right", children: s })
+          ] }, `${i}-${j}`)) }),
+          /* @__PURE__ */ t(c, {})
         ] }),
-        /* @__PURE__ */ o(h, { name: "user", condition: l, children: [
-          !d && /* @__PURE__ */ t(n, {}),
-          /* @__PURE__ */ t(w, { title: a.title, button: a.button, data: a.data, onClick: a.onClick }),
-          /* @__PURE__ */ t(n, {})
+        /* @__PURE__ */ o(f, { name: "user", condition: r, children: [
+          !a && /* @__PURE__ */ t(c, {}),
+          /* @__PURE__ */ t(w, { title: d.title, button: d.button, data: d.data, onClick: d.onClick }),
+          /* @__PURE__ */ t(c, {})
         ] }),
-        /* @__PURE__ */ t(h, { name: "button", condition: b, children: /* @__PURE__ */ t(
+        /* @__PURE__ */ t(f, { name: "button", condition: b, children: /* @__PURE__ */ t(
           "div",
           {
-            className: m(i.SidebarButton, {
-              [i.NothingAbove]: !d && !l
+            className: l(e.SidebarButton, {
+              [e.NothingAbove]: !a && !r
             }),
-            children: f
+            children: v
           }
         ) }),
-        /* @__PURE__ */ t(B, { icons: c.icons, tuvSrc: c.tuvSrc, align: c.align }),
+        n != null && /* @__PURE__ */ t(
+          "div",
+          {
+            "data-testid": "sidebar-extras",
+            className: l(e.SidebarExtras, {
+              [e.NothingAbove]: !a && !r && !b
+            }),
+            children: n
+          }
+        ),
+        /* @__PURE__ */ t(u, { icons: _.icons, tuvSrc: _.tuvSrc, align: _.align }),
         /* @__PURE__ */ t(
           "div",
           {
-            className: m({
-              [i.NothingAbove]: !d && !l && !b
+            className: l({
+              [e.NothingAbove]: !a && !r && !b && n == null
             })
           }
         )
@@ -81,5 +93,5 @@ import '../../assets/sidebar-DyDlIXV0.css';const y = "_Sidebar_17t5d_1", A = "_B
   );
 };
 export {
-  V as Sidebar
+  Y as Sidebar
 };

package/dist/components/timetable/timetable.component.js

@@ -1,16 +1,15 @@
-import { jsxs as d, jsx as s } from "react/jsx-runtime";
-import { baseProps as l, clsx as o } from "../../utils/functions/functions.util.js";
-import '../../assets/timetable-C4OGIa6M.css';const r = "_Timetable_1y4a7_1", T = "_Title_1y4a7_8", _ = "_Line_1y4a7_16", e = {
-  Timetable: r,
-  Title: T,
-  Line: _
-}, L = ({ title: c, lines: m, ...a }) => {
-  const t = l(a, "data-testid", "timetable");
-  return /* @__PURE__ */ d("div", { "data-testid": t, className: o(e.Timetable, l(a, "className")), children: [
-    /* @__PURE__ */ s("p", { "data-testid": `${t}-title`, className: e.Title, children: c }),
-    m.map((n, i) => /* @__PURE__ */ s("p", { "data-testid": `${t}-line-${i}`, className: e.Line, children: n }, i))
+import { jsxs as r, jsx as s } from "react/jsx-runtime";
+import { baseProps as i, clsx as c } from "../../utils/functions/functions.util.js";
+import { Text as l } from "../text/text.component.js";
+import '../../assets/timetable-CqiWwUNY.css';const n = "_Timetable_zg6h3_1", b = {
+  Timetable: n
+}, h = ({ title: m, lines: o, ...e }) => {
+  const t = i(e, "data-testid", "timetable");
+  return /* @__PURE__ */ r("div", { "data-testid": t, className: c(b.Timetable, i(e, "className")), children: [
+    /* @__PURE__ */ s(l, { tag: "span", size: "body-small", color: "text-secondary", "data-testid": `${t}-title`, children: m }),
+    o.map((d, a) => /* @__PURE__ */ s(l, { tag: "span", size: "body-small", "data-testid": `${t}-line-${a}`, children: d }, a))
   ] });
 };
 export {
-  L as Timetable
+  h as Timetable
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@arthurzakharov/ui-kit",
   "private": false,
-  "version": "2.11.0",
+  "version": "2.12.0",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",

package/dist/assets/sidebar-DyDlIXV0.css

@@ -1 +0,0 @@
-._Sidebar_17t5d_1{display:block}._Board_17t5d_5{border-radius:var(--rm-ui-border-radius-md);padding:var(--rm-ui-padding-lg);background-color:var(--rm-ui-sidebar-bg)}._SidebarTitle_17t5d_11,._SidebarButton_17t5d_12{padding-bottom:var(--rm-ui-padding-md)}._Steps_17t5d_16,._Info_17t5d_17{display:flex;flex-direction:column;align-items:flex-start;gap:var(--rm-ui-padding-sm)}._Step_17t5d_16{display:inline-flex;align-items:center;gap:var(--rm-ui-padding-xs)}._InfoRow_17t5d_30{display:inline-flex;align-items:center;justify-content:space-between;gap:var(--rm-ui-padding-xs)}._SidebarButton_17t5d_12{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start}._NothingAbove_17t5d_44{margin-top:var(--rm-ui-padding-lg)}@media screen and (min-width:1024px){._Board_17t5d_5{padding:var(--rm-ui-padding-xl)}}@media screen and (min-width:1200px){._Board_17t5d_5{padding:var(--rm-ui-padding-xxl)}._SidebarTitle_17t5d_11,._SidebarButton_17t5d_12{padding-bottom:var(--rm-ui-padding-lg)}}

package/dist/assets/timetable-C4OGIa6M.css

@@ -1 +0,0 @@
-._Timetable_1y4a7_1{display:flex;flex-direction:column;gap:var(--rm-ui-padding-xxs);padding:var(--rm-ui-padding-sm) var(--rm-ui-padding-md)}._Title_1y4a7_8{margin:0;font-weight:var(--rm-ui-font-weight-medium);font-size:var(--rm-ui-font-size-body-small);line-height:var(--rm-ui-line-height-body-small);color:var(--rm-ui-color-text-primary)}._Line_1y4a7_16{margin:0;font-weight:var(--rm-ui-font-weight-regular);font-size:var(--rm-ui-font-size-body-small);line-height:var(--rm-ui-line-height-body-small);color:var(--rm-ui-color-text-secondary)}