@arthurzakharov/ui-kit 1.3.9 → 1.4.1

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

@@ -1,11 +1,14 @@
-import { BaseProps } from '../../utils/types';
+import { Base } from '../../utils/types';
 type FooterLink = {
     text: string;
     onClick: () => void;
 };
-export interface FooterProps extends BaseProps {
+interface FooterProps extends Base {
     name: string;
     links: FooterLink[];
 }
-export declare const Footer: ({ name, links, className }: FooterProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Displays a footer with copyright text and navigational links.
+ */
+export declare const Footer: ({ name, links, ...base }: FooterProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/footer/footer.component.js

@@ -1,35 +1,43 @@
 import { jsxs as e, jsx as r } from "react/jsx-runtime";
-import p from "clsx";
-import '../../assets/footer-Dt0rYt73.css';const c = "_Footer_1qjpp_1", l = "_Copyright_1qjpp_11", _ = "_Links_1qjpp_18", d = "_Link_1qjpp_18", m = "_Button_1qjpp_32", u = "_Separator_1qjpp_44", t = {
-  Footer: c,
-  Copyright: l,
+import c from "clsx";
+import { baseProps as s } from "../../utils/functions/functions.util.js";
+import '../../assets/footer-Dt0rYt73.css';const l = "_Footer_1qjpp_1", d = "_Copyright_1qjpp_11", _ = "_Links_1qjpp_18", m = "_Link_1qjpp_18", u = "_Button_1qjpp_32", h = "_Separator_1qjpp_44", t = {
+  Footer: l,
+  Copyright: d,
   Links: _,
-  Link: d,
-  Button: m,
-  Separator: u
-}, f = ({ name: a, links: s, className: n = "" }) => /* @__PURE__ */ e("footer", { "data-testid": "footer", className: p(t.Footer, n), children: [
-  /* @__PURE__ */ e("span", { "data-testid": "footer-copyright", className: t.Copyright, children: [
-    "© ",
-    (/* @__PURE__ */ new Date()).getFullYear(),
-    " ",
-    a
-  ] }),
-  /* @__PURE__ */ r("ul", { className: t.Links, children: s.map((o) => /* @__PURE__ */ e("li", { "data-testid": "footer-link", className: t.Link, children: [
-    /* @__PURE__ */ r(
-      "button",
-      {
-        "data-testid": "footer-button",
-        type: "button",
-        className: t.Button,
-        onClick: (i) => {
-          i.currentTarget.blur(), o.onClick();
-        },
-        children: o.text
-      }
-    ),
-    /* @__PURE__ */ r("div", { "data-testid": "footer-separator", className: t.Separator })
-  ] }, o.text)) })
-] });
+  Link: m,
+  Button: u,
+  Separator: h
+}, L = ({ name: n, links: i, ...a }) => /* @__PURE__ */ e(
+  "footer",
+  {
+    "data-testid": s(a, "data-testid", "footer"),
+    className: c(t.Footer, s(a, "className")),
+    children: [
+      /* @__PURE__ */ e("span", { "data-testid": "footer-copyright", className: t.Copyright, children: [
+        "© ",
+        (/* @__PURE__ */ new Date()).getFullYear(),
+        " ",
+        n
+      ] }),
+      /* @__PURE__ */ r("ul", { className: t.Links, children: i.map((o) => /* @__PURE__ */ e("li", { "data-testid": "footer-link", className: t.Link, children: [
+        /* @__PURE__ */ r(
+          "button",
+          {
+            "data-testid": "footer-button",
+            type: "button",
+            className: t.Button,
+            onClick: (p) => {
+              p.currentTarget.blur(), o.onClick();
+            },
+            children: o.text
+          }
+        ),
+        /* @__PURE__ */ r("div", { "data-testid": "footer-separator", className: t.Separator })
+      ] }, o.text)) })
+    ]
+  }
+);
 export {
-  f as Footer
+  L as Footer
 };

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

@@ -1 +1 @@
-export { Footer, type FooterProps } from './footer.component';
+export { Footer } from './footer.component';

package/dist/components/info-panel/info-panel.component.d.ts

@@ -1,5 +1,8 @@
-import { BaseProps } from '../../utils/types';
-export interface InfoPanelProps extends BaseProps {
+import { Base } from '../../utils/types';
+export interface InfoPanelProps extends Base {
     data: [string, string][];
 }
-export declare const InfoPanel: ({ data, className }: InfoPanelProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Displays a key-value list of informational rows.
+ */
+export declare const InfoPanel: ({ data, ...base }: InfoPanelProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/info-panel/info-panel.component.js

@@ -1,15 +1,23 @@
-import { jsx as s, jsxs as i } from "react/jsx-runtime";
-import o from "clsx";
-import '../../assets/info-panel-BAcoIlE-.css';const c = "_InfoPanel_h5syx_1", _ = "_List_h5syx_30", d = "_Item_h5syx_40", m = "_Key_h5syx_47", f = "_Value_h5syx_51", e = {
-  InfoPanel: c,
-  List: _,
-  Item: d,
-  Key: m,
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import c from "clsx";
+import { baseProps as n } from "../../utils/functions/functions.util.js";
+import '../../assets/info-panel-BAcoIlE-.css';const m = "_InfoPanel_h5syx_1", d = "_List_h5syx_30", _ = "_Item_h5syx_40", r = "_Key_h5syx_47", f = "_Value_h5syx_51", s = {
+  InfoPanel: m,
+  List: d,
+  Item: _,
+  Key: r,
   Value: f
-}, r = ({ data: n, className: t = "" }) => /* @__PURE__ */ s("div", { "data-testid": "info-panel", className: o(e.InfoPanel, t), children: /* @__PURE__ */ s("ul", { "data-testid": "info-panel-list", className: e.List, children: n.map(([a, l]) => /* @__PURE__ */ i("li", { className: e.Item, children: [
-  /* @__PURE__ */ s("span", { "data-testid": "info-panel-key", className: e.Key, children: a }),
-  /* @__PURE__ */ s("span", { "data-testid": "info-panel-value", className: e.Value, children: l })
-] }, a)) }) });
+}, y = ({ data: l, ...e }) => /* @__PURE__ */ a(
+  "div",
+  {
+    "data-testid": n(e, "data-testid", "info-panel"),
+    className: c(s.InfoPanel, n(e, "className")),
+    children: /* @__PURE__ */ a("ul", { "data-testid": "info-panel-list", className: s.List, children: l.map(([t, i]) => /* @__PURE__ */ o("li", { className: s.Item, children: [
+      /* @__PURE__ */ a("span", { "data-testid": "info-panel-key", className: s.Key, children: t }),
+      /* @__PURE__ */ a("span", { "data-testid": "info-panel-value", className: s.Value, children: i })
+    ] }, t)) })
+  }
+);
 export {
-  r as InfoPanel
+  y as InfoPanel
 };

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

@@ -1 +1 @@
-export { Information, type InformationProps } from './information.component';
+export { Information } from './information.component';

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

@@ -1,6 +1,7 @@
-import { PropsWithChildren } from 'react';
-import { BaseProps } from '../../utils/types';
-export type InformationProps = PropsWithChildren<BaseProps>;
-export declare const Information: import('react').ForwardRefExoticComponent<BaseProps & {
+import { Base } from '../../utils/types';
+/**
+ * Displays informational content with an icon and rich child elements.
+ */
+export declare const Information: import('react').ForwardRefExoticComponent<Base & {
     children?: import('react').ReactNode | undefined;
 } & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/information/information.component.js

@@ -1,15 +1,24 @@
-import { jsxs as s, jsx as n } from "react/jsx-runtime";
-import { forwardRef as a } from "react";
+import { jsxs as a, jsx as n } from "react/jsx-runtime";
+import { forwardRef as i } from "react";
 import { Info as c } from "lucide-react";
-import i from "clsx";
-import '../../assets/information-D-nqKgE6.css';const f = "_Information_1g632_1", e = "_Icon_1g632_16", I = "_Text_1g632_25", o = {
-  Information: f,
-  Icon: e,
-  Text: I
-}, p = a(({ children: t, className: r = "" }, m) => /* @__PURE__ */ s("div", { "data-testid": "information", ref: m, className: i(o.Information, r), children: [
-  /* @__PURE__ */ n(c, { className: o.Icon }),
-  /* @__PURE__ */ n("div", { className: o.Text, children: t })
-] }));
+import f from "clsx";
+import { baseProps as r } from "../../utils/functions/functions.util.js";
+import '../../assets/information-D-nqKgE6.css';const e = "_Information_1g632_1", I = "_Icon_1g632_16", _ = "_Text_1g632_25", o = {
+  Information: e,
+  Icon: I,
+  Text: _
+}, T = i(({ children: m, ...t }, s) => /* @__PURE__ */ a(
+  "div",
+  {
+    "data-testid": r(t, "data-testid", "information"),
+    ref: s,
+    className: f(o.Information, r(t, "className")),
+    children: [
+      /* @__PURE__ */ n(c, { className: o.Icon }),
+      /* @__PURE__ */ n("div", { className: o.Text, children: m })
+    ]
+  }
+));
 export {
-  p as Information
+  T as Information
 };

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

@@ -1 +1 @@
-export { Loader, type LoaderProps } from './loader.component';
+export { Loader } from './loader.component';

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

@@ -1,9 +1,13 @@
-import { BaseProps, Size } from '../../utils/types';
-type LoaderColor = 'white' | 'primary' | 'secondary';
-export interface LoaderProps extends BaseProps {
-    size: Size;
+import { Base, FontColor, Size } from '../../utils/types';
+type LoaderColor = 'white' | Extract<FontColor, 'text-primary' | 'text-secondary' | 'accent-primary' | 'accent-secondary'>;
+export interface LoaderProps extends Base {
     color: LoaderColor;
+    size: Size;
     padding?: Size;
 }
-export declare const Loader: ({ size, color, padding, className }: LoaderProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * `Loader` renders a spinning icon and supports multiple sizes and colors. Use `padding` when
+ * the loader needs extra breathing room inside a container.
+ */
+export declare const Loader: ({ color, size, padding, ...base }: LoaderProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/loader/loader.component.js

@@ -1,65 +1,52 @@
-import { jsxs as t, jsx as c } from "react/jsx-runtime";
-import s from "clsx";
-import { Loader as X } from "lucide-react";
-import '../../assets/loader-C0f3AvRU.css';const n = "_Loader_11mao_1", m = "_Padding_11mao_5", L = "_XXS_11mao_10", x = "_XS_11mao_14", i = "_SM_11mao_18", S = "_MD_11mao_22", d = "_LG_11mao_26", l = "_XL_11mao_30", y = "_XXL_11mao_34", u = "_XXXL_11mao_38", M = "_Icon_11mao_42", P = "_White_11mao_47", h = "_Primary_11mao_51", D = "_Secondary_11mao_55", o = {
-  Loader: n,
-  Padding: m,
+import { jsxs as n, jsx as s } from "react/jsx-runtime";
+import _ from "clsx";
+import { Loader as x } from "lucide-react";
+import { baseProps as o } from "../../utils/functions/functions.util.js";
+import { getLoaderSize as X } from "./loader.utils.js";
+import '../../assets/loader-DadlBlOF.css';const m = "_Loader_px5cg_1", i = "_Padding_px5cg_5", L = "_XXS_px5cg_10", d = "_XS_px5cg_14", S = "_SM_px5cg_18", y = "_MD_px5cg_22", p = "_LG_px5cg_26", g = "_XL_px5cg_30", P = "_XXL_px5cg_34", A = "_XXXL_px5cg_38", M = "_Icon_px5cg_42", T = "_White_px5cg_47", l = "_TextPrimary_px5cg_51", h = "_TextSecondary_px5cg_55", f = "_AccentPrimary_px5cg_59", D = "_AccentSecondary_px5cg_63", c = {
+  Loader: m,
+  Padding: i,
   XXS: L,
-  XS: x,
-  SM: i,
-  MD: S,
-  LG: d,
-  XL: l,
-  XXL: y,
-  XXXL: u,
+  XS: d,
+  SM: S,
+  MD: y,
+  LG: p,
+  XL: g,
+  XXL: P,
+  XXXL: A,
   Icon: M,
-  White: P,
-  Primary: h,
-  Secondary: D
-}, f = ({ size: e, color: r, padding: a, className: _ = "" }) => /* @__PURE__ */ t(
+  White: T,
+  TextPrimary: l,
+  TextSecondary: h,
+  AccentPrimary: f,
+  AccentSecondary: D
+}, z = ({ color: e, size: a, padding: t, ...r }) => /* @__PURE__ */ n(
   "div",
   {
-    "data-testid": "loader",
-    className: s(o.Loader, _, {
-      [o.Padding]: !!a,
-      [o.XXS]: a === "xxs",
-      [o.XS]: a === "xs",
-      [o.SM]: a === "sm",
-      [o.MD]: a === "md",
-      [o.LG]: a === "lg",
-      [o.XL]: a === "xl",
-      [o.XXL]: a === "xxl",
-      [o.XXXL]: a === "xxxl"
+    "data-testid": o(r, "data-testid", "loader"),
+    className: _(c.Loader, o(r, "className"), {
+      [c.Padding]: !!t,
+      [c.XXS]: t === "xxs",
+      [c.XS]: t === "xs",
+      [c.SM]: t === "sm",
+      [c.MD]: t === "md",
+      [c.LG]: t === "lg",
+      [c.XL]: t === "xl",
+      [c.XXL]: t === "xxl",
+      [c.XXXL]: t === "xxxl"
     }),
     children: [
-      /* @__PURE__ */ c(
-        X,
+      /* @__PURE__ */ s(
+        x,
         {
           "data-testid": "loader-icon",
-          size: (() => {
-            switch (e) {
-              case "xxs":
-                return 16;
-              case "xs":
-                return 24;
-              case "sm":
-                return 32;
-              case "md":
-                return 40;
-              case "lg":
-                return 48;
-              case "xl":
-                return 56;
-              case "xxl":
-                return 64;
-              case "xxxl":
-                return 72;
-            }
-          })(),
-          className: s(o.Icon, {
-            [o.White]: r === "white",
-            [o.Primary]: r === "primary",
-            [o.Secondary]: r === "secondary"
+          size: X(a),
+          className: _(c.Icon, {
+            [c.White]: e === "white",
+            [c.TextPrimary]: e === "text-primary",
+            [c.TextSecondary]: e === "text-secondary",
+            [c.AccentPrimary]: e === "accent-primary",
+            [c.AccentSecondary]: e === "accent-secondary"
           })
         }
       ),
@@ -68,5 +55,5 @@ import '../../assets/loader-C0f3AvRU.css';const n = "_Loader_11mao_1", m = "_Pad
   }
 );
 export {
-  f as Loader
+  z as Loader
 };

package/dist/components/loader/loader.utils.d.ts

@@ -0,0 +1,2 @@
+import { Size } from '../../utils/types';
+export declare const getLoaderSize: (size: Size) => number;

package/dist/components/loader/loader.utils.js

@@ -0,0 +1,13 @@
+const s = {
+  xxs: 16,
+  xs: 24,
+  sm: 32,
+  md: 40,
+  lg: 48,
+  xl: 56,
+  xxl: 64,
+  xxxl: 72
+}, e = (x) => s[x];
+export {
+  e as getLoaderSize
+};

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

@@ -1,6 +1,6 @@
 import { jsxs as m, jsx as t } from "react/jsx-runtime";
 import h from "clsx";
-import { Animation as o } from "../../animations/animation.component.js";
+import { AnimationFadeScale as o } from "../../animations/animation-fade-scale/animation-fade-scale.component.js";
 import { Text as a } 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", i = {
   MainAttachment: r,
@@ -12,7 +12,7 @@ import '../../assets/main-attachment-Cw8AP6xv.css';const r = "_MainAttachment_1o
   return /* @__PURE__ */ m("div", { className: i.MainAttachment, children: [
     e ? /* @__PURE__ */ t("div", { className: h(i.MainAttachmentTitle, { [i.MainAttachmentTitleWithSubtitle]: !!n }), children: /* @__PURE__ */ t(a.PageTitle, { children: e }) }) : null,
     n ? /* @__PURE__ */ t("div", { className: i.MainAttachmentSubtitle, children: /* @__PURE__ */ t(a.PageSubtitle, { children: n }) }) : null,
-    /* @__PURE__ */ t(o.FadeScale, { name: "attachment-main", condition: !0, animateOnStart: !0, duration: 0.2, delay: 0.1, children: l })
+    /* @__PURE__ */ t(o, { name: "attachment-main", condition: !0, animateOnStart: !0, duration: 0.2, delay: 0.1, children: l })
   ] });
 };
 export {

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

@@ -1,10 +1,13 @@
 import { ReactNode } from 'react';
-import { BaseProps } from '../../utils/types';
+import { Base } from '../../utils/types';
 type MessageType = 'success' | 'question' | 'error' | 'info';
-export interface MessageProps extends BaseProps {
+export interface MessageProps extends Base {
     type: MessageType;
     title: ReactNode;
     text: ReactNode;
 }
-export declare const Message: ({ type, title, text, className }: MessageProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Displays a message with an icon, title, and text content based on the message type (`success`, `question`, `error`, or `info`).
+ */
+export declare const Message: ({ type, title, text, ...base }: MessageProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/message/message.component.js

@@ -1,39 +1,40 @@
-import { jsxs as c, jsx as t } from "react/jsx-runtime";
-import { Check as r, CircleQuestionMark as l, X as _, CircleAlert as d } from "lucide-react";
+import { jsxs as o, jsx as t } from "react/jsx-runtime";
+import { Check as l, CircleQuestionMark as _, X as d, CircleAlert as m } from "lucide-react";
 import f from "clsx";
-import { Content as o } from "../../utils/content/content.component.js";
-import '../../assets/message-CgGyIv5e.css';const m = "_Message_fkc6l_1", u = "_Success_fkc6l_15", k = "_Icon_fkc6l_19", I = "_Question_fkc6l_23", x = "_Info_fkc6l_39", C = "_Content_fkc6l_52", g = "_Title_fkc6l_62", N = "_Text_fkc6l_66", s = {
-  Message: m,
-  Success: u,
-  Icon: k,
-  Question: I,
+import { baseProps as n } from "../../utils/functions/functions.util.js";
+import { Content as a } from "../../utils/content/content.component.js";
+import '../../assets/message-CgGyIv5e.css';const u = "_Message_fkc6l_1", k = "_Success_fkc6l_15", I = "_Icon_fkc6l_19", x = "_Question_fkc6l_23", C = "_Info_fkc6l_39", N = "_Content_fkc6l_52", g = "_Title_fkc6l_62", T = "_Text_fkc6l_66", s = {
+  Message: u,
+  Success: k,
+  Icon: I,
+  Question: x,
   Error: "_Error_fkc6l_31",
-  Info: x,
-  Content: C,
+  Info: C,
+  Content: N,
   Title: g,
-  Text: N
-}, S = ({ type: e, title: n, text: a, className: i = "" }) => /* @__PURE__ */ c(
+  Text: T
+}, E = ({ type: e, title: i, text: r, ...c }) => /* @__PURE__ */ o(
   "div",
   {
-    "data-testid": "message",
-    className: f(s.Message, i, {
+    "data-testid": n(c, "data-testid", "message"),
+    className: f(s.Message, n(c, "className"), {
       [s.Success]: e === "success",
       [s.Question]: e === "question",
       [s.Error]: e === "error",
       [s.Info]: e === "info"
     }),
     children: [
-      e === "success" && /* @__PURE__ */ t(r, { "data-testid": "success-icon", className: s.Icon }),
-      e === "question" && /* @__PURE__ */ t(l, { "data-testid": "question-icon", className: s.Icon }),
-      e === "error" && /* @__PURE__ */ t(_, { "data-testid": "error-icon", className: s.Icon }),
-      e === "info" && /* @__PURE__ */ t(d, { "data-testid": "info-icon", className: s.Icon }),
-      /* @__PURE__ */ c("div", { className: s.Content, children: [
-        /* @__PURE__ */ t(o, { "data-testid": "message-title", className: s.Title, children: n }),
-        /* @__PURE__ */ t(o, { "data-testid": "message-text", className: s.Text, children: a })
+      e === "success" && /* @__PURE__ */ t(l, { "data-testid": "success-icon", className: s.Icon }),
+      e === "question" && /* @__PURE__ */ t(_, { "data-testid": "question-icon", className: s.Icon }),
+      e === "error" && /* @__PURE__ */ t(d, { "data-testid": "error-icon", className: s.Icon }),
+      e === "info" && /* @__PURE__ */ t(m, { "data-testid": "info-icon", className: s.Icon }),
+      /* @__PURE__ */ o("div", { className: s.Content, children: [
+        /* @__PURE__ */ t(a, { "data-testid": "message-title", className: s.Title, children: i }),
+        /* @__PURE__ */ t(a, { "data-testid": "message-text", className: s.Text, children: r })
       ] })
     ]
   }
 );
 export {
-  S as Message
+  E as Message
 };

package/dist/components/message-block/index.d.ts

@@ -0,0 +1 @@
+export { MessageBlock } from './message-block.component';

package/dist/components/message-block/index.js

@@ -0,0 +1,4 @@
+import { MessageBlock as r } from "./message-block.component.js";
+export {
+  r as MessageBlock
+};

package/dist/components/message-block/message-block.component.d.ts

@@ -1,7 +1,12 @@
 import { PropsWithChildren } from 'react';
-export interface MessageBlockProps extends PropsWithChildren {
+import { Base } from '../../utils/types';
+interface MessageBlockProps extends PropsWithChildren<Base> {
     emoji?: string;
     title?: string;
     subtitle?: string;
 }
-export declare const MessageBlock: (props: MessageBlockProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Displays a message block with optional `emoji`, `title`, `subtitle`, and rich content (`children`).
+ */
+export declare const MessageBlock: ({ children, emoji, title, subtitle, ...base }: MessageBlockProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/message-block/message-block.component.js

@@ -1,20 +1,38 @@
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { Flex as i } from "../flex/flex.component.js";
-import { Text as l } from "../text/text.component.js";
-import '../../assets/message-block-BVk5u9rO.css';const g = "_MessageBlockEmoji_1882v_1", m = "_MessageBlockContent_1882v_6", c = {
-  MessageBlockEmoji: g,
-  MessageBlockContent: m
-}, j = (a) => {
-  const { children: n, emoji: t = "", title: o = "", subtitle: s = "" } = a;
-  return /* @__PURE__ */ r(i, { direction: "column", justify: "start", gap: "lg", children: [
-    t ? /* @__PURE__ */ e("div", { className: c.MessageBlockEmoji, children: t }) : null,
-    o || s ? /* @__PURE__ */ r(i, { direction: "column", justify: "start", gap: "xs", children: [
-      o ? /* @__PURE__ */ e(l.Tag, { tag: "h2", weight: "medium", size: "hl2", color: "primary", children: o }) : null,
-      s ? /* @__PURE__ */ e(l.Tag, { tag: "h6", weight: "regular", size: "regular", color: "secondary", children: s }) : null
-    ] }) : null,
-    /* @__PURE__ */ e(l.Tag, { tag: "div", weight: "regular", size: "regular", color: "primary", className: c.MessageBlockContent, children: n })
-  ] });
-};
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import m from "clsx";
+import { baseProps as r } from "../../utils/functions/functions.util.js";
+import { Text as o } from "../text/text.component.js";
+import '../../assets/message-block-DG1cePyB.css';const d = "_MessageBlock_14g5p_1", n = "_Emoji_14g5p_7", p = "_Titles_14g5p_12", _ = "_Content_14g5p_18", s = {
+  MessageBlock: d,
+  Emoji: n,
+  Titles: p,
+  Content: _
+}, b = ({ children: g, emoji: i = "", title: t = "", subtitle: a = "", ...c }) => /* @__PURE__ */ l(
+  "div",
+  {
+    "data-testid": r(c, "data-testid", "message-block"),
+    className: m(s.MessageBlock, r(c, "className")),
+    children: [
+      i && /* @__PURE__ */ e("div", { "data-testid": "message-block-emoji", className: s.Emoji, children: i }),
+      (t || a) && /* @__PURE__ */ l("div", { "data-testid": "message-block-titles", className: s.Titles, children: [
+        t && /* @__PURE__ */ e(o.Tag, { "data-testid": "message-block-title", tag: "h2", weight: "medium", size: "hl2", color: "primary", children: t }),
+        a && /* @__PURE__ */ e(o.Tag, { "data-testid": "message-block-subtitle", tag: "h6", weight: "regular", size: "regular", color: "secondary", children: a })
+      ] }),
+      /* @__PURE__ */ e(
+        o.Tag,
+        {
+          "data-testid": "message-block-content",
+          tag: "div",
+          weight: "regular",
+          size: "regular",
+          color: "primary",
+          className: s.Content,
+          children: g
+        }
+      )
+    ]
+  }
+);
 export {
-  j as MessageBlock
+  b as MessageBlock
 };

package/dist/components/not-found/not-found.component.d.ts

@@ -1,13 +1,16 @@
-import { BaseProps } from '../../utils/types';
+import { Base } from '../../utils/types';
 type TableRow = {
     key: string;
     value: string;
 };
-export interface NotFoundProps extends BaseProps {
+export interface NotFoundProps extends Base {
     title: string;
     subtitle: string;
     tableTitle: string;
     tableRows: TableRow[];
 }
-export declare const NotFound: ({ title, subtitle, tableTitle, tableRows, className }: NotFoundProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Displays a 404 not found page with title, subtitle, and contact information table.
+ */
+export declare const NotFound: ({ title, subtitle, tableTitle, tableRows, ...base }: NotFoundProps) => import("react/jsx-runtime").JSX.Element;
 export {};