@arthurzakharov/ui-kit 2.11.0 → 2.13.0

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,92 @@
-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 { UserPanel as w } from "../user-panel/user-panel.component.js";
+import { jsx as t, jsxs as o, Fragment as S } from "react/jsx-runtime";
+import { clsx as c, baseProps as f } from "../../utils/functions/functions.util.js";
+import { FadeScale as v } from "../../animations/fade-scale/fade-scale.component.js";
+import { Certifications as A } from "../certifications/certifications.component.js";
+import { Line as d } from "../line/line.component.js";
+import { Text as m } from "../text/text.component.js";
+import { UserPanel as B } 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 = {
+import '../../assets/sidebar-DyDlIXV0.css';const y = "_Sidebar_17t5d_1", T = "_Board_17t5d_5", R = "_SidebarTitle_17t5d_11", z = "_SidebarButton_17t5d_12", C = "_Steps_17t5d_16", $ = "_Info_17t5d_17", j = "_Step_17t5d_16", F = "_InfoRow_17t5d_30", P = "_NothingAbove_17t5d_44", i = {
   Sidebar: y,
-  Board: A,
-  SidebarTitle: T,
-  SidebarButton: R,
-  Steps: z,
-  Info: C,
-  Step: $,
-  InfoRow: j,
-  NothingAbove: F
-}, V = ({
+  Board: T,
+  SidebarTitle: R,
+  SidebarButton: z,
+  Steps: C,
+  Info: $,
+  Step: j,
+  InfoRow: F,
+  NothingAbove: P
+}, X = ({
   // Sidebar props
-  children: f,
+  children: g,
   isButtonVisible: b = !1,
-  isUserOpen: l = !1,
-  title: g = "Ihre Übersicht",
-  steps: v = [],
-  info: N = [],
-  certifications: c,
-  user: a,
+  isUserOpen: r = !1,
+  title: N = "Ihre Übersicht",
+  steps: I = [],
+  info: u = [],
+  certifications: p,
+  user: n,
+  extras: s,
   // Base props
-  ...p
+  ..._
 }) => {
-  const _ = N.filter(([, e]) => e.trim() !== ""), d = _.length > 0;
+  const h = u.filter(([, e]) => e.trim() !== ""), a = h.length > 0;
   return /* @__PURE__ */ t(
     "div",
     {
-      "data-testid": S(p, "data-testid", "sidebar"),
-      className: m(i.Sidebar, S(p, "className")),
+      "data-testid": f(_, "data-testid", "sidebar"),
+      className: c(i.Sidebar, f(_, "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(m, { preset: "sidebar-title", className: i.SidebarTitle, children: N }),
+        /* @__PURE__ */ t("div", { className: i.Steps, "data-testid": "sidebar-steps", children: I.map(({ state: e, text: l }) => /* @__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, {})
+          /* @__PURE__ */ t(m, { tag: "span", weight: "medium", size: "body-small", color: e === "idle" ? "grey-400" : "text-primary", children: l })
+        ] }, l)) }),
+        a && /* @__PURE__ */ o(S, { children: [
+          /* @__PURE__ */ t(d, {}),
+          /* @__PURE__ */ t("div", { className: i.Info, "data-testid": "sidebar-info", children: h.map(([e, l], w) => /* @__PURE__ */ o("div", { className: i.InfoRow, "data-testid": "sidebar-info-row", children: [
+            /* @__PURE__ */ t(m, { tag: "span", size: "body-small", color: "text-secondary", children: e }),
+            /* @__PURE__ */ t(m, { tag: "span", size: "body-small", align: "right", children: l })
+          ] }, `${e}-${w}`)) }),
+          /* @__PURE__ */ t(d, {})
         ] }),
-        /* @__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(v, { name: "user", condition: r, children: [
+          !a && /* @__PURE__ */ t(d, {}),
+          /* @__PURE__ */ t(B, { title: n.title, button: n.button, data: n.data, onClick: n.onClick }),
+          /* @__PURE__ */ t(d, {})
         ] }),
-        /* @__PURE__ */ t(h, { name: "button", condition: b, children: /* @__PURE__ */ t(
+        /* @__PURE__ */ t(v, { name: "button", condition: b, children: /* @__PURE__ */ t(
           "div",
           {
-            className: m(i.SidebarButton, {
-              [i.NothingAbove]: !d && !l
+            className: c(i.SidebarButton, {
+              [i.NothingAbove]: !a && !r
             }),
-            children: f
+            children: g
           }
         ) }),
-        /* @__PURE__ */ t(B, { icons: c.icons, tuvSrc: c.tuvSrc, align: c.align }),
+        s != null && /* @__PURE__ */ o(S, { children: [
+          /* @__PURE__ */ t(
+            "div",
+            {
+              "data-testid": "sidebar-extras",
+              className: c(i.SidebarExtras, {
+                [i.NothingAbove]: !a && !r && !b
+              }),
+              children: s
+            }
+          ),
+          /* @__PURE__ */ t(d, {})
+        ] }),
+        /* @__PURE__ */ t(A, { icons: p.icons, tuvSrc: p.tuvSrc, align: p.align }),
         /* @__PURE__ */ t(
           "div",
           {
-            className: m({
-              [i.NothingAbove]: !d && !l && !b
+            className: c({
+              [i.NothingAbove]: !a && !r && !b && s == null
             })
           }
         )
@@ -81,5 +95,5 @@ import '../../assets/sidebar-DyDlIXV0.css';const y = "_Sidebar_17t5d_1", A = "_B
   );
 };
 export {
-  V as Sidebar
+  X 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.13.0",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",

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)}