@arthurzakharov/ui-kit 3.4.0 → 3.5.0

package/dist/components/main-attachment/main-attachment.component.d.ts

@@ -1,6 +1,6 @@
-import { PropsWithChildren } from 'react';
+import { PropsWithChildren, ReactNode } from 'react';
 export interface MainAttachmentProps extends PropsWithChildren {
-    title?: string;
-    subtitle?: string;
+    title?: ReactNode;
+    subtitle?: ReactNode;
 }
 export declare const MainAttachment: (props: MainAttachmentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/main-attachment/main-attachment.component.js

@@ -1,25 +1,33 @@
-import { jsxs as m, jsx as a } from "react/jsx-runtime";
-import { clsx as h } from "../../utils/functions/functions.util.js";
-import { FadeScale as o } from "../../animations/fade-scale/fade-scale.component.js";
-import { Text as i } from "../text/text.component.js";
-import '../../assets/main-attachment-Cw8AP6xv.css';const r = "_MainAttachment_1oa7f_1", s = "_MainAttachmentTitle_1oa7f_5", A = "_MainAttachmentTitleWithSubtitle_1oa7f_9", M = "_MainAttachmentSubtitle_1oa7f_13", t = {
-  MainAttachment: r,
-  MainAttachmentTitle: s,
-  MainAttachmentTitleWithSubtitle: A,
-  MainAttachmentSubtitle: M
-}, d = (c) => {
-  const { children: l, title: n = "", subtitle: e = "" } = c;
-  return /* @__PURE__ */ m("div", { className: t.MainAttachment, children: [
-    n ? /* @__PURE__ */ a(
+import { jsxs as h, jsx as r } from "react/jsx-runtime";
+import { clsx as s } from "../../utils/functions/functions.util.js";
+import { isValidElement as o, cloneElement as u } from "react";
+import { FadeScale as A } from "../../animations/fade-scale/fade-scale.component.js";
+import { Text as M } from "../text/text.component.js";
+import '../../assets/main-attachment-Cw8AP6xv.css';const f = "_MainAttachment_1oa7f_1", p = "_MainAttachmentTitle_1oa7f_5", b = "_MainAttachmentTitleWithSubtitle_1oa7f_9", _ = "_MainAttachmentSubtitle_1oa7f_13", a = {
+  MainAttachment: f,
+  MainAttachmentTitle: p,
+  MainAttachmentTitleWithSubtitle: b,
+  MainAttachmentSubtitle: _
+}, c = (t) => t == null || t === "" || t === !1, m = (t, n, i) => {
+  if (typeof t == "string" || typeof t == "number")
+    return /* @__PURE__ */ r(M, { preset: i, className: n, children: t });
+  if (o(t)) {
+    const e = t;
+    return u(e, {
+      className: s(e.props.className, n)
+    });
+  }
+  return t;
+}, d = (t) => {
+  const { children: n, title: i, subtitle: e } = t, l = !c(e);
+  return /* @__PURE__ */ h("div", { className: a.MainAttachment, children: [
+    c(i) ? null : m(
       i,
-      {
-        preset: "page-title",
-        className: h(t.MainAttachmentTitle, { [t.MainAttachmentTitleWithSubtitle]: !!e }),
-        children: n
-      }
-    ) : null,
-    e ? /* @__PURE__ */ a(i, { preset: "page-subtitle", className: t.MainAttachmentSubtitle, children: e }) : null,
-    /* @__PURE__ */ a(o, { name: "attachment-main", condition: !0, animateOnStart: !0, duration: 0.2, delay: 0.1, children: l })
+      s(a.MainAttachmentTitle, { [a.MainAttachmentTitleWithSubtitle]: l }),
+      "page-title"
+    ),
+    l ? m(e, a.MainAttachmentSubtitle, "page-subtitle") : null,
+    /* @__PURE__ */ r(A, { name: "attachment-main", condition: !0, animateOnStart: !0, duration: 0.2, delay: 0.1, children: n })
   ] });
 };
 export {

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

@@ -1,11 +1,11 @@
-import { PropsWithChildren } from 'react';
+import { PropsWithChildren, ReactNode } from 'react';
 import { CertificationsProps } from '../certifications';
 import { UserPanelProps } from '../user-panel';
 import { State } from '../../controls/utils';
 import { Base } from '../../utils/types';
 type SidebarStep = {
     state: State;
-    text: string;
+    text: ReactNode;
 };
 type SidebarInfoRow = [string, string];
 interface SidebarStepsProps extends Base {

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

@@ -1,5 +1,5 @@
 import { jsx as e, jsxs as b } from "react/jsx-runtime";
-import { clsx as l, baseProps as d, parseSpacingValue as m } from "../../utils/functions/functions.util.js";
+import { clsx as l, baseProps as s, parseSpacingValue as m } from "../../utils/functions/functions.util.js";
 import { FadeScale as p } from "../../animations/fade-scale/fade-scale.component.js";
 import { Certifications as S } from "../certifications/certifications.component.js";
 import { Line as _ } from "../line/line.component.js";
@@ -10,7 +10,7 @@ import "../../utils/content/content.component.js";
 import "lucide-react";
 import "usehooks-ts";
 import { Status as u } from "../../controls/primitives/status/status.component.js";
-import '../../assets/sidebar-C-EyF8q9.css';const N = "_Sidebar_bino6_1", h = "_Board_bino6_5", v = "_Steps_bino6_13", g = "_Info_bino6_14", I = "_Step_bino6_13", y = "_InfoRow_bino6_27", T = "_SidebarButton_bino6_35", B = "_Timetable_bino6_42", w = "_Space_bino6_48", o = {
+import '../../assets/sidebar-C-EyF8q9.css';const N = "_Sidebar_bino6_1", h = "_Board_bino6_5", v = "_Steps_bino6_13", g = "_Info_bino6_14", I = "_Step_bino6_13", y = "_InfoRow_bino6_27", T = "_SidebarButton_bino6_35", B = "_Timetable_bino6_42", x = "_Space_bino6_48", n = {
   Sidebar: N,
   Board: h,
   Steps: v,
@@ -19,85 +19,85 @@ import '../../assets/sidebar-C-EyF8q9.css';const N = "_Sidebar_bino6_1", h = "_B
   InfoRow: y,
   SidebarButton: T,
   Timetable: B,
-  Space: w
-}, x = ({ children: a, ...t }) => /* @__PURE__ */ e(
+  Space: x
+}, w = ({ children: a, ...t }) => /* @__PURE__ */ e(
   "div",
   {
-    "data-testid": d(t, "data-testid", "sidebar"),
-    className: l(o.Sidebar, d(t, "className")),
-    children: /* @__PURE__ */ e("div", { className: o.Board, children: a })
+    "data-testid": s(t, "data-testid", "sidebar"),
+    className: l(n.Sidebar, s(t, "className")),
+    children: /* @__PURE__ */ e("div", { className: n.Board, children: a })
   }
 ), $ = ({ children: a, ...t }) => /* @__PURE__ */ e(
   c,
   {
     preset: "sidebar-title",
-    "data-testid": d(t, "data-testid", "sidebar-title"),
-    className: d(t, "className"),
+    "data-testid": s(t, "data-testid", "sidebar-title"),
+    className: s(t, "className"),
     children: a
   }
 ), z = ({ steps: a, ...t }) => /* @__PURE__ */ e(
   "div",
   {
-    "data-testid": d(t, "data-testid", "sidebar-steps"),
-    className: l(o.Steps, d(t, "className")),
-    children: a.map(({ state: i, text: s }) => /* @__PURE__ */ b("div", { className: o.Step, "data-testid": "sidebar-step", children: [
+    "data-testid": s(t, "data-testid", "sidebar-steps"),
+    className: l(n.Steps, s(t, "className")),
+    children: a.map(({ state: i, text: d }, r) => /* @__PURE__ */ b("div", { className: n.Step, "data-testid": "sidebar-step", children: [
       /* @__PURE__ */ e(u, { state: i }),
-      /* @__PURE__ */ e(c, { tag: "span", weight: "medium", size: "body-small", color: i === "idle" ? "grey-400" : "text-primary", children: s })
-    ] }, s))
+      /* @__PURE__ */ e(c, { tag: "span", weight: "medium", size: "body-small", color: i === "idle" ? "grey-400" : "text-primary", children: d })
+    ] }, r))
   }
 ), R = ({ rows: a, ...t }) => {
-  const i = a.filter(([, s]) => s.trim() !== "");
+  const i = a.filter(([, d]) => d.trim() !== "");
   return i.length === 0 ? null : /* @__PURE__ */ e(
     "div",
     {
-      "data-testid": d(t, "data-testid", "sidebar-info"),
-      className: l(o.Info, d(t, "className")),
-      children: i.map(([s, n], r) => /* @__PURE__ */ b("div", { className: o.InfoRow, "data-testid": "sidebar-info-row", children: [
-        /* @__PURE__ */ e(c, { tag: "span", size: "body-small", color: "text-secondary", children: s }),
-        /* @__PURE__ */ e(c, { tag: "span", size: "body-small", align: "right", children: n })
-      ] }, `${s}-${r}`))
+      "data-testid": s(t, "data-testid", "sidebar-info"),
+      className: l(n.Info, s(t, "className")),
+      children: i.map(([d, r], o) => /* @__PURE__ */ b("div", { className: n.InfoRow, "data-testid": "sidebar-info-row", children: [
+        /* @__PURE__ */ e(c, { tag: "span", size: "body-small", color: "text-secondary", children: d }),
+        /* @__PURE__ */ e(c, { tag: "span", size: "body-small", align: "right", children: r })
+      ] }, `${d}-${o}`))
     }
   );
-}, j = ({ isOpen: a, title: t, data: i, button: s, onClick: n, ...r }) => /* @__PURE__ */ e(
+}, j = ({ isOpen: a, title: t, data: i, button: d, onClick: r, ...o }) => /* @__PURE__ */ e(
   p,
   {
     name: "sidebar-user",
     condition: a,
-    "data-testid": d(r, "data-testid", "sidebar-user"),
-    className: d(r, "className"),
-    children: /* @__PURE__ */ e(f, { title: t, data: i, button: s, onClick: n })
+    "data-testid": s(o, "data-testid", "sidebar-user"),
+    className: s(o, "className"),
+    children: /* @__PURE__ */ e(f, { title: t, data: i, button: d, onClick: r })
   }
 ), C = ({ isVisible: a, children: t, ...i }) => /* @__PURE__ */ e(
   p,
   {
     name: "sidebar-submit",
     condition: a,
-    "data-testid": d(i, "data-testid", "sidebar-submit"),
-    className: d(i, "className"),
-    children: /* @__PURE__ */ e("div", { className: o.SidebarButton, children: t })
+    "data-testid": s(i, "data-testid", "sidebar-submit"),
+    className: s(i, "className"),
+    children: /* @__PURE__ */ e("div", { className: n.SidebarButton, children: t })
   }
 ), L = (a) => /* @__PURE__ */ e(S, { ...a }), U = ({ title: a, lines: t, ...i }) => {
-  const s = d(i, "data-testid", "sidebar-timetable");
-  return /* @__PURE__ */ b("div", { "data-testid": s, className: l(o.Timetable, d(i, "className")), children: [
-    /* @__PURE__ */ e(c, { tag: "span", size: "body-small", color: "text-secondary", "data-testid": `${s}-title`, children: a }),
-    t.map((n, r) => /* @__PURE__ */ e(c, { tag: "span", size: "body-small", "data-testid": `${s}-line-${r}`, children: n }, r))
+  const d = s(i, "data-testid", "sidebar-timetable");
+  return /* @__PURE__ */ b("div", { "data-testid": d, className: l(n.Timetable, s(i, "className")), children: [
+    /* @__PURE__ */ e(c, { tag: "span", size: "body-small", color: "text-secondary", "data-testid": `${d}-title`, children: a }),
+    t.map((r, o) => /* @__PURE__ */ e(c, { tag: "span", size: "body-small", "data-testid": `${d}-line-${o}`, children: r }, o))
   ] });
-}, P = () => /* @__PURE__ */ e(_, {}), F = ({ height: a, 768: t, 1024: i, 1200: s, ...n }) => {
-  const r = {
+}, P = () => /* @__PURE__ */ e(_, {}), F = ({ height: a, 768: t, 1024: i, 1200: d, ...r }) => {
+  const o = {
     "--rm-ui-sidebar-space-base": m(a),
     ...t !== void 0 ? { "--rm-ui-sidebar-space-768": m(t) } : {},
     ...i !== void 0 ? { "--rm-ui-sidebar-space-1024": m(i) } : {},
-    ...s !== void 0 ? { "--rm-ui-sidebar-space-1200": m(s) } : {}
+    ...d !== void 0 ? { "--rm-ui-sidebar-space-1200": m(d) } : {}
   };
   return /* @__PURE__ */ e(
     "div",
     {
-      "data-testid": d(n, "data-testid", "sidebar-space"),
-      className: l(o.Space, d(n, "className")),
-      style: r
+      "data-testid": s(r, "data-testid", "sidebar-space"),
+      className: l(n.Space, s(r, "className")),
+      style: o
     }
   );
-}, W = Object.assign(x, {
+}, W = Object.assign(w, {
   Title: $,
   Steps: z,
   Info: R,

package/package.json

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