@dmitriikapustin/ui 0.4.2 → 0.4.4

package/dist/index.cjs

@@ -1690,10 +1690,9 @@ function Skeleton({ variant = "line", width, height, className = "" }) {
 
 // css-inject-scss:/Users/dimakozh/Desktop/projects/kapustin.cc/packages/ui/src/atoms/SectionHeading.module.scss
 __styleInject(`@charset "UTF-8";
-/* SectionHeading \u2014 \u0435\u0434\u0438\u043D\u0430\u044F \u0442\u0438\u043F\u043E\u0433\u0440\u0430\u0444\u0438\u043A\u0430 \u0434\u043B\u044F section-h2 \u0432 \u043F\u0430\u043A\u0435\u0442\u0435 \u0438 \u043F\u043E\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043B\u044F\u0445.
-   \u0417\u043D\u0430\u0447\u0435\u043D\u0438\u044F \u0437\u0435\u0440\u043A\u0430\u043B\u044F\u0442 PromoSplit-module_heading / PromoTestimonials-module_heading. */
+/* SectionHeading \u2014 \u0442\u0438\u043F\u043E\u0433\u0440\u0430\u0444\u0438\u043A\u0430 \u0434\u043B\u044F section-headings.
+   \u0422\u0440\u0438 \u0440\u0430\u0437\u043C\u0435\u0440\u0430: sm (sub-block), md (default, typical section h2), lg (landing promo). */
 .SectionHeading-module_heading {
-  font-size: clamp(1.75rem, 4vw, 2.75rem);
   font-weight: 700;
   line-height: 1.1;
   letter-spacing: -0.03em;
@@ -1702,6 +1701,21 @@ __styleInject(`@charset "UTF-8";
   margin: 0;
 }
 
+/* \u2014 \u0420\u0430\u0437\u043C\u0435\u0440\u044B (responsive clamp) \u2014 */
+.SectionHeading-module_sizeSm {
+  font-size: clamp(1.125rem, 2.5vw, 1.375rem);
+  letter-spacing: -0.02em;
+}
+
+.SectionHeading-module_sizeMd {
+  font-size: clamp(1.5rem, 3vw, 2rem);
+}
+
+.SectionHeading-module_sizeLg {
+  font-size: clamp(1.75rem, 4vw, 2.75rem);
+}
+
+/* \u2014 \u0412\u044B\u0440\u0430\u0432\u043D\u0438\u0432\u0430\u043D\u0438\u0435 \u2014 */
 .SectionHeading-module_alignLeft {
   text-align: left;
 }
@@ -1710,6 +1724,7 @@ __styleInject(`@charset "UTF-8";
   text-align: center;
 }
 
+/* \u2014 Wrapper \u0434\u043B\u044F subtitle \u2014 */
 .SectionHeading-module_wrap {
   display: flex;
   flex-direction: column;
@@ -1737,15 +1752,21 @@ __styleInject(`@charset "UTF-8";
     font-size: 1.125rem;
   }
 }`);
-var __default20 = { "heading": "SectionHeading-module_heading", "alignLeft": "SectionHeading-module_alignLeft", "alignCenter": "SectionHeading-module_alignCenter", "wrap": "SectionHeading-module_wrap", "wrapCenter": "SectionHeading-module_wrapCenter", "subtitle": "SectionHeading-module_subtitle" };
+var __default20 = { "heading": "SectionHeading-module_heading", "sizeSm": "SectionHeading-module_sizeSm", "sizeMd": "SectionHeading-module_sizeMd", "sizeLg": "SectionHeading-module_sizeLg", "alignLeft": "SectionHeading-module_alignLeft", "alignCenter": "SectionHeading-module_alignCenter", "wrap": "SectionHeading-module_wrap", "wrapCenter": "SectionHeading-module_wrapCenter", "subtitle": "SectionHeading-module_subtitle" };
+var SIZE_CLASS = {
+  sm: __default20.sizeSm,
+  md: __default20.sizeMd,
+  lg: __default20.sizeLg
+};
 function SectionHeading({
   children,
+  size = "md",
   as = "h2",
   align = "left",
   subtitle,
   className = ""
 }) {
-  const headingClass = `${__default20.heading} ${align === "center" ? __default20.alignCenter : __default20.alignLeft}${className ? ` ${className}` : ""}`;
+  const headingClass = `${__default20.heading} ${SIZE_CLASS[size]} ${align === "center" ? __default20.alignCenter : __default20.alignLeft}${className ? ` ${className}` : ""}`;
   if (subtitle) {
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: align === "center" ? __default20.wrapCenter : __default20.wrap, children: [
       react.createElement(as, { className: headingClass }, children),
@@ -6513,15 +6534,6 @@ __styleInject(`@charset "UTF-8";
   }
 }
 
-.PromoSplit-module_heading {
-  font-size: clamp(1.75rem, 4vw, 2.75rem);
-  font-weight: 700;
-  line-height: 1.1;
-  letter-spacing: -0.03em;
-  color: var(--fg);
-  text-wrap: balance;
-}
-
 .PromoSplit-module_description {
   font-size: 1rem;
   line-height: 1.625;
@@ -6607,7 +6619,7 @@ __styleInject(`@charset "UTF-8";
   align-items: center;
   justify-content: center;
 }`);
-var __default63 = { "root": "PromoSplit-module_root", "rootNoVertical": "PromoSplit-module_rootNoVertical", "grid": "PromoSplit-module_grid", "gridReversed": "PromoSplit-module_gridReversed PromoSplit-module_grid", "textColumn": "PromoSplit-module_textColumn", "textColumnLtr": "PromoSplit-module_textColumnLtr", "heading": "PromoSplit-module_heading", "description": "PromoSplit-module_description", "features": "PromoSplit-module_features", "feature": "PromoSplit-module_feature", "featureTitle": "PromoSplit-module_featureTitle", "featureDesc": "PromoSplit-module_featureDesc", "mediaColumn": "PromoSplit-module_mediaColumn", "mediaColumnLtr": "PromoSplit-module_mediaColumnLtr", "mediaBox": "PromoSplit-module_mediaBox", "mediaContent": "PromoSplit-module_mediaContent", "mediaPlaceholder": "PromoSplit-module_mediaPlaceholder", "placeholderCircle": "PromoSplit-module_placeholderCircle" };
+var __default63 = { "root": "PromoSplit-module_root", "rootNoVertical": "PromoSplit-module_rootNoVertical", "grid": "PromoSplit-module_grid", "gridReversed": "PromoSplit-module_gridReversed PromoSplit-module_grid", "textColumn": "PromoSplit-module_textColumn", "textColumnLtr": "PromoSplit-module_textColumnLtr", "description": "PromoSplit-module_description", "features": "PromoSplit-module_features", "feature": "PromoSplit-module_feature", "featureTitle": "PromoSplit-module_featureTitle", "featureDesc": "PromoSplit-module_featureDesc", "mediaColumn": "PromoSplit-module_mediaColumn", "mediaColumnLtr": "PromoSplit-module_mediaColumnLtr", "mediaBox": "PromoSplit-module_mediaBox", "mediaContent": "PromoSplit-module_mediaContent", "mediaPlaceholder": "PromoSplit-module_mediaPlaceholder", "placeholderCircle": "PromoSplit-module_placeholderCircle" };
 function PromoSplit({
   heading,
   description,
@@ -6621,7 +6633,7 @@ function PromoSplit({
   const noVerticalClass = verticalPadding === "none" ? ` ${__default63.rootNoVertical}` : "";
   return /* @__PURE__ */ jsxRuntime.jsx("section", { className: `${__default63.root}${noVerticalClass}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: isLeft ? __default63.gridReversed : __default63.grid, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${__default63.textColumn}${isLeft ? ` ${__default63.textColumnLtr}` : ""}`, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: __default63.heading, children: heading }),
+      /* @__PURE__ */ jsxRuntime.jsx(SectionHeading, { size: "lg", children: heading }),
       description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: __default63.description, children: description }),
       features && features.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: __default63.features, children: features.map((feature, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: __default63.feature, children: [
         /* @__PURE__ */ jsxRuntime.jsx("h3", { className: __default63.featureTitle, children: feature.title }),
@@ -7052,25 +7064,6 @@ __styleInject(`@charset "UTF-8";
   }
 }
 
-.PromoTestimonials-module_heading {
-  font-size: clamp(1.75rem, 4vw, 2.75rem);
-  font-weight: 700;
-  line-height: 1.1;
-  letter-spacing: -0.03em;
-  color: var(--fg);
-  text-wrap: balance;
-}
-
-.PromoTestimonials-module_subtitle {
-  margin-top: 0.75rem;
-  font-size: 1rem;
-  color: var(--fg-secondary);
-  line-height: 1.625;
-  max-width: 32rem;
-  margin-left: auto;
-  margin-right: auto;
-}
-
 .PromoTestimonials-module_cardsSection {
   padding: 0 1.5rem 2rem;
 }
@@ -7163,7 +7156,7 @@ __styleInject(`@charset "UTF-8";
   background: var(--bg-secondary);
   overflow: hidden;
 }`);
-var __default66 = { "root": "PromoTestimonials-module_root", "rootNoVertical": "PromoTestimonials-module_rootNoVertical", "wrapper": "PromoTestimonials-module_wrapper", "avatarSection": "PromoTestimonials-module_avatarSection", "avatarStack": "PromoTestimonials-module_avatarStack", "avatarRing": "PromoTestimonials-module_avatarRing", "overflowBadge": "PromoTestimonials-module_overflowBadge", "overflowCircle": "PromoTestimonials-module_overflowCircle", "headingSection": "PromoTestimonials-module_headingSection", "heading": "PromoTestimonials-module_heading", "subtitle": "PromoTestimonials-module_subtitle", "cardsSection": "PromoTestimonials-module_cardsSection", "cardsGrid": "PromoTestimonials-module_cardsGrid", "card": "PromoTestimonials-module_card", "quote": "PromoTestimonials-module_quote", "author": "PromoTestimonials-module_author", "authorInfo": "PromoTestimonials-module_authorInfo", "authorName": "PromoTestimonials-module_authorName", "authorRole": "PromoTestimonials-module_authorRole", "mediaSection": "PromoTestimonials-module_mediaSection", "mediaBox": "PromoTestimonials-module_mediaBox" };
+var __default66 = { "root": "PromoTestimonials-module_root", "rootNoVertical": "PromoTestimonials-module_rootNoVertical", "wrapper": "PromoTestimonials-module_wrapper", "avatarSection": "PromoTestimonials-module_avatarSection", "avatarStack": "PromoTestimonials-module_avatarStack", "avatarRing": "PromoTestimonials-module_avatarRing", "overflowBadge": "PromoTestimonials-module_overflowBadge", "overflowCircle": "PromoTestimonials-module_overflowCircle", "headingSection": "PromoTestimonials-module_headingSection", "cardsSection": "PromoTestimonials-module_cardsSection", "cardsGrid": "PromoTestimonials-module_cardsGrid", "card": "PromoTestimonials-module_card", "quote": "PromoTestimonials-module_quote", "author": "PromoTestimonials-module_author", "authorInfo": "PromoTestimonials-module_authorInfo", "authorName": "PromoTestimonials-module_authorName", "authorRole": "PromoTestimonials-module_authorRole", "mediaSection": "PromoTestimonials-module_mediaSection", "mediaBox": "PromoTestimonials-module_mediaBox" };
 function PromoTestimonials({
   heading,
   subtitle,
@@ -7199,10 +7192,7 @@ function PromoTestimonials({
         testimonials.length - 5
       ] }) })
     ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: __default66.headingSection, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: __default66.heading, children: heading }),
-      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: __default66.subtitle, children: subtitle })
-    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: __default66.headingSection, children: /* @__PURE__ */ jsxRuntime.jsx(SectionHeading, { size: "lg", align: "center", subtitle, children: heading }) }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: __default66.cardsSection, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: __default66.cardsGrid, children: testimonials.map((t, i) => {
       const initials = t.name.split(" ").map((n) => n[0]).join("").toUpperCase();
       return /* @__PURE__ */ jsxRuntime.jsxs(

package/dist/index.d.cts

@@ -203,9 +203,17 @@ declare function Skeleton({ variant, width, height, className }: SkeletonProps):
 
 type HeadingTag = 'h1' | 'h2' | 'h3';
 type HeadingAlign = 'left' | 'center';
+type HeadingSize = 'sm' | 'md' | 'lg';
 interface SectionHeadingProps {
     children: ReactNode;
-    /** HTML-тег. Default `'h2'` (стандартный section heading). */
+    /**
+     * Размер заголовка (responsive clamp).
+     * - `'sm'` — `clamp(1.125rem, 2.5vw, 1.375rem)` ≈ 18-22px. Sub-block heading, card group titles.
+     * - `'md'` (default) — `clamp(1.5rem, 3vw, 2rem)` ≈ 24-32px. Typical section h2 (industry-standard).
+     * - `'lg'` — `clamp(1.75rem, 4vw, 2.75rem)` ≈ 28-44px. Landing promo section (= PromoSplit/PromoTestimonials).
+     */
+    size?: HeadingSize;
+    /** HTML-тег. Default `'h2'`. Не привязан к size — используй для семантики. */
     as?: HeadingTag;
     /** Выравнивание. Default `'left'`. */
     align?: HeadingAlign;
@@ -214,20 +222,21 @@ interface SectionHeadingProps {
     className?: string;
 }
 /**
- * Единый source для section-h2 типографики во всём пакете и потребителях.
- * Берёт ту же типографику что у `PromoSplit.heading` / `PromoTestimonials.heading`:
- * `font-size: clamp(1.75rem, 4vw, 2.75rem); line-height: 1.1; letter-spacing: -0.03em`.
+ * Единый source типографики для section-headings во всём пакете и потребителях.
+ * Три размера:
+ * - `sm` (18-22px) — подсекции, group titles.
+ * - `md` (24-32px, default) — typical section h2 (industry-standard: shadcn / Tailwind UI / Linear).
+ * - `lg` (28-44px) — landing promo headings (идентично PromoSplit/PromoTestimonials).
  *
- * Закрывает кейс когда потребитель кладёт `FeatureGrid` / `BentoGrid` / `Gallery`
- * без встроенного title и вынужден захардкоживать ту же типографику в своём `.heading`
- * — теперь импортирует `<SectionHeading>` и получает единый стиль автоматически.
+ * Прop `as` (h1/h2/h3) независим от `size` — используй для семантики:
  *
  * ```tsx
- * <SectionHeading>Почему гости выбирают этот отель</SectionHeading>
- * <FeatureGrid features={...} verticalPadding="none" />
+ * <SectionHeading>Section h2 — default md size</SectionHeading>
+ * <SectionHeading size="lg" as="h1">Landing hero h1 — large</SectionHeading>
+ * <SectionHeading size="sm" as="h3">Subsection</SectionHeading>
  * ```
  */
-declare function SectionHeading({ children, as, align, subtitle, className, }: SectionHeadingProps): react_jsx_runtime.JSX.Element;
+declare function SectionHeading({ children, size, as, align, subtitle, className, }: SectionHeadingProps): react_jsx_runtime.JSX.Element;
 
 interface TicketButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     children: ReactNode;

package/dist/index.d.ts

@@ -203,9 +203,17 @@ declare function Skeleton({ variant, width, height, className }: SkeletonProps):
 
 type HeadingTag = 'h1' | 'h2' | 'h3';
 type HeadingAlign = 'left' | 'center';
+type HeadingSize = 'sm' | 'md' | 'lg';
 interface SectionHeadingProps {
     children: ReactNode;
-    /** HTML-тег. Default `'h2'` (стандартный section heading). */
+    /**
+     * Размер заголовка (responsive clamp).
+     * - `'sm'` — `clamp(1.125rem, 2.5vw, 1.375rem)` ≈ 18-22px. Sub-block heading, card group titles.
+     * - `'md'` (default) — `clamp(1.5rem, 3vw, 2rem)` ≈ 24-32px. Typical section h2 (industry-standard).
+     * - `'lg'` — `clamp(1.75rem, 4vw, 2.75rem)` ≈ 28-44px. Landing promo section (= PromoSplit/PromoTestimonials).
+     */
+    size?: HeadingSize;
+    /** HTML-тег. Default `'h2'`. Не привязан к size — используй для семантики. */
     as?: HeadingTag;
     /** Выравнивание. Default `'left'`. */
     align?: HeadingAlign;
@@ -214,20 +222,21 @@ interface SectionHeadingProps {
     className?: string;
 }
 /**
- * Единый source для section-h2 типографики во всём пакете и потребителях.
- * Берёт ту же типографику что у `PromoSplit.heading` / `PromoTestimonials.heading`:
- * `font-size: clamp(1.75rem, 4vw, 2.75rem); line-height: 1.1; letter-spacing: -0.03em`.
+ * Единый source типографики для section-headings во всём пакете и потребителях.
+ * Три размера:
+ * - `sm` (18-22px) — подсекции, group titles.
+ * - `md` (24-32px, default) — typical section h2 (industry-standard: shadcn / Tailwind UI / Linear).
+ * - `lg` (28-44px) — landing promo headings (идентично PromoSplit/PromoTestimonials).
  *
- * Закрывает кейс когда потребитель кладёт `FeatureGrid` / `BentoGrid` / `Gallery`
- * без встроенного title и вынужден захардкоживать ту же типографику в своём `.heading`
- * — теперь импортирует `<SectionHeading>` и получает единый стиль автоматически.
+ * Прop `as` (h1/h2/h3) независим от `size` — используй для семантики:
  *
  * ```tsx
- * <SectionHeading>Почему гости выбирают этот отель</SectionHeading>
- * <FeatureGrid features={...} verticalPadding="none" />
+ * <SectionHeading>Section h2 — default md size</SectionHeading>
+ * <SectionHeading size="lg" as="h1">Landing hero h1 — large</SectionHeading>
+ * <SectionHeading size="sm" as="h3">Subsection</SectionHeading>
  * ```
  */
-declare function SectionHeading({ children, as, align, subtitle, className, }: SectionHeadingProps): react_jsx_runtime.JSX.Element;
+declare function SectionHeading({ children, size, as, align, subtitle, className, }: SectionHeadingProps): react_jsx_runtime.JSX.Element;
 
 interface TicketButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     children: ReactNode;

package/dist/index.js

@@ -1684,10 +1684,9 @@ function Skeleton({ variant = "line", width, height, className = "" }) {
 
 // css-inject-scss:/Users/dimakozh/Desktop/projects/kapustin.cc/packages/ui/src/atoms/SectionHeading.module.scss
 __styleInject(`@charset "UTF-8";
-/* SectionHeading \u2014 \u0435\u0434\u0438\u043D\u0430\u044F \u0442\u0438\u043F\u043E\u0433\u0440\u0430\u0444\u0438\u043A\u0430 \u0434\u043B\u044F section-h2 \u0432 \u043F\u0430\u043A\u0435\u0442\u0435 \u0438 \u043F\u043E\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043B\u044F\u0445.
-   \u0417\u043D\u0430\u0447\u0435\u043D\u0438\u044F \u0437\u0435\u0440\u043A\u0430\u043B\u044F\u0442 PromoSplit-module_heading / PromoTestimonials-module_heading. */
+/* SectionHeading \u2014 \u0442\u0438\u043F\u043E\u0433\u0440\u0430\u0444\u0438\u043A\u0430 \u0434\u043B\u044F section-headings.
+   \u0422\u0440\u0438 \u0440\u0430\u0437\u043C\u0435\u0440\u0430: sm (sub-block), md (default, typical section h2), lg (landing promo). */
 .SectionHeading-module_heading {
-  font-size: clamp(1.75rem, 4vw, 2.75rem);
   font-weight: 700;
   line-height: 1.1;
   letter-spacing: -0.03em;
@@ -1696,6 +1695,21 @@ __styleInject(`@charset "UTF-8";
   margin: 0;
 }
 
+/* \u2014 \u0420\u0430\u0437\u043C\u0435\u0440\u044B (responsive clamp) \u2014 */
+.SectionHeading-module_sizeSm {
+  font-size: clamp(1.125rem, 2.5vw, 1.375rem);
+  letter-spacing: -0.02em;
+}
+
+.SectionHeading-module_sizeMd {
+  font-size: clamp(1.5rem, 3vw, 2rem);
+}
+
+.SectionHeading-module_sizeLg {
+  font-size: clamp(1.75rem, 4vw, 2.75rem);
+}
+
+/* \u2014 \u0412\u044B\u0440\u0430\u0432\u043D\u0438\u0432\u0430\u043D\u0438\u0435 \u2014 */
 .SectionHeading-module_alignLeft {
   text-align: left;
 }
@@ -1704,6 +1718,7 @@ __styleInject(`@charset "UTF-8";
   text-align: center;
 }
 
+/* \u2014 Wrapper \u0434\u043B\u044F subtitle \u2014 */
 .SectionHeading-module_wrap {
   display: flex;
   flex-direction: column;
@@ -1731,15 +1746,21 @@ __styleInject(`@charset "UTF-8";
     font-size: 1.125rem;
   }
 }`);
-var __default20 = { "heading": "SectionHeading-module_heading", "alignLeft": "SectionHeading-module_alignLeft", "alignCenter": "SectionHeading-module_alignCenter", "wrap": "SectionHeading-module_wrap", "wrapCenter": "SectionHeading-module_wrapCenter", "subtitle": "SectionHeading-module_subtitle" };
+var __default20 = { "heading": "SectionHeading-module_heading", "sizeSm": "SectionHeading-module_sizeSm", "sizeMd": "SectionHeading-module_sizeMd", "sizeLg": "SectionHeading-module_sizeLg", "alignLeft": "SectionHeading-module_alignLeft", "alignCenter": "SectionHeading-module_alignCenter", "wrap": "SectionHeading-module_wrap", "wrapCenter": "SectionHeading-module_wrapCenter", "subtitle": "SectionHeading-module_subtitle" };
+var SIZE_CLASS = {
+  sm: __default20.sizeSm,
+  md: __default20.sizeMd,
+  lg: __default20.sizeLg
+};
 function SectionHeading({
   children,
+  size = "md",
   as = "h2",
   align = "left",
   subtitle,
   className = ""
 }) {
-  const headingClass = `${__default20.heading} ${align === "center" ? __default20.alignCenter : __default20.alignLeft}${className ? ` ${className}` : ""}`;
+  const headingClass = `${__default20.heading} ${SIZE_CLASS[size]} ${align === "center" ? __default20.alignCenter : __default20.alignLeft}${className ? ` ${className}` : ""}`;
   if (subtitle) {
     return /* @__PURE__ */ jsxs("div", { className: align === "center" ? __default20.wrapCenter : __default20.wrap, children: [
       createElement(as, { className: headingClass }, children),
@@ -6507,15 +6528,6 @@ __styleInject(`@charset "UTF-8";
   }
 }
 
-.PromoSplit-module_heading {
-  font-size: clamp(1.75rem, 4vw, 2.75rem);
-  font-weight: 700;
-  line-height: 1.1;
-  letter-spacing: -0.03em;
-  color: var(--fg);
-  text-wrap: balance;
-}
-
 .PromoSplit-module_description {
   font-size: 1rem;
   line-height: 1.625;
@@ -6601,7 +6613,7 @@ __styleInject(`@charset "UTF-8";
   align-items: center;
   justify-content: center;
 }`);
-var __default63 = { "root": "PromoSplit-module_root", "rootNoVertical": "PromoSplit-module_rootNoVertical", "grid": "PromoSplit-module_grid", "gridReversed": "PromoSplit-module_gridReversed PromoSplit-module_grid", "textColumn": "PromoSplit-module_textColumn", "textColumnLtr": "PromoSplit-module_textColumnLtr", "heading": "PromoSplit-module_heading", "description": "PromoSplit-module_description", "features": "PromoSplit-module_features", "feature": "PromoSplit-module_feature", "featureTitle": "PromoSplit-module_featureTitle", "featureDesc": "PromoSplit-module_featureDesc", "mediaColumn": "PromoSplit-module_mediaColumn", "mediaColumnLtr": "PromoSplit-module_mediaColumnLtr", "mediaBox": "PromoSplit-module_mediaBox", "mediaContent": "PromoSplit-module_mediaContent", "mediaPlaceholder": "PromoSplit-module_mediaPlaceholder", "placeholderCircle": "PromoSplit-module_placeholderCircle" };
+var __default63 = { "root": "PromoSplit-module_root", "rootNoVertical": "PromoSplit-module_rootNoVertical", "grid": "PromoSplit-module_grid", "gridReversed": "PromoSplit-module_gridReversed PromoSplit-module_grid", "textColumn": "PromoSplit-module_textColumn", "textColumnLtr": "PromoSplit-module_textColumnLtr", "description": "PromoSplit-module_description", "features": "PromoSplit-module_features", "feature": "PromoSplit-module_feature", "featureTitle": "PromoSplit-module_featureTitle", "featureDesc": "PromoSplit-module_featureDesc", "mediaColumn": "PromoSplit-module_mediaColumn", "mediaColumnLtr": "PromoSplit-module_mediaColumnLtr", "mediaBox": "PromoSplit-module_mediaBox", "mediaContent": "PromoSplit-module_mediaContent", "mediaPlaceholder": "PromoSplit-module_mediaPlaceholder", "placeholderCircle": "PromoSplit-module_placeholderCircle" };
 function PromoSplit({
   heading,
   description,
@@ -6615,7 +6627,7 @@ function PromoSplit({
   const noVerticalClass = verticalPadding === "none" ? ` ${__default63.rootNoVertical}` : "";
   return /* @__PURE__ */ jsx("section", { className: `${__default63.root}${noVerticalClass}${className ? ` ${className}` : ""}`, children: /* @__PURE__ */ jsxs("div", { className: isLeft ? __default63.gridReversed : __default63.grid, children: [
     /* @__PURE__ */ jsxs("div", { className: `${__default63.textColumn}${isLeft ? ` ${__default63.textColumnLtr}` : ""}`, children: [
-      /* @__PURE__ */ jsx("h2", { className: __default63.heading, children: heading }),
+      /* @__PURE__ */ jsx(SectionHeading, { size: "lg", children: heading }),
       description && /* @__PURE__ */ jsx("p", { className: __default63.description, children: description }),
       features && features.length > 0 && /* @__PURE__ */ jsx("div", { className: __default63.features, children: features.map((feature, i) => /* @__PURE__ */ jsxs("div", { className: __default63.feature, children: [
         /* @__PURE__ */ jsx("h3", { className: __default63.featureTitle, children: feature.title }),
@@ -7046,25 +7058,6 @@ __styleInject(`@charset "UTF-8";
   }
 }
 
-.PromoTestimonials-module_heading {
-  font-size: clamp(1.75rem, 4vw, 2.75rem);
-  font-weight: 700;
-  line-height: 1.1;
-  letter-spacing: -0.03em;
-  color: var(--fg);
-  text-wrap: balance;
-}
-
-.PromoTestimonials-module_subtitle {
-  margin-top: 0.75rem;
-  font-size: 1rem;
-  color: var(--fg-secondary);
-  line-height: 1.625;
-  max-width: 32rem;
-  margin-left: auto;
-  margin-right: auto;
-}
-
 .PromoTestimonials-module_cardsSection {
   padding: 0 1.5rem 2rem;
 }
@@ -7157,7 +7150,7 @@ __styleInject(`@charset "UTF-8";
   background: var(--bg-secondary);
   overflow: hidden;
 }`);
-var __default66 = { "root": "PromoTestimonials-module_root", "rootNoVertical": "PromoTestimonials-module_rootNoVertical", "wrapper": "PromoTestimonials-module_wrapper", "avatarSection": "PromoTestimonials-module_avatarSection", "avatarStack": "PromoTestimonials-module_avatarStack", "avatarRing": "PromoTestimonials-module_avatarRing", "overflowBadge": "PromoTestimonials-module_overflowBadge", "overflowCircle": "PromoTestimonials-module_overflowCircle", "headingSection": "PromoTestimonials-module_headingSection", "heading": "PromoTestimonials-module_heading", "subtitle": "PromoTestimonials-module_subtitle", "cardsSection": "PromoTestimonials-module_cardsSection", "cardsGrid": "PromoTestimonials-module_cardsGrid", "card": "PromoTestimonials-module_card", "quote": "PromoTestimonials-module_quote", "author": "PromoTestimonials-module_author", "authorInfo": "PromoTestimonials-module_authorInfo", "authorName": "PromoTestimonials-module_authorName", "authorRole": "PromoTestimonials-module_authorRole", "mediaSection": "PromoTestimonials-module_mediaSection", "mediaBox": "PromoTestimonials-module_mediaBox" };
+var __default66 = { "root": "PromoTestimonials-module_root", "rootNoVertical": "PromoTestimonials-module_rootNoVertical", "wrapper": "PromoTestimonials-module_wrapper", "avatarSection": "PromoTestimonials-module_avatarSection", "avatarStack": "PromoTestimonials-module_avatarStack", "avatarRing": "PromoTestimonials-module_avatarRing", "overflowBadge": "PromoTestimonials-module_overflowBadge", "overflowCircle": "PromoTestimonials-module_overflowCircle", "headingSection": "PromoTestimonials-module_headingSection", "cardsSection": "PromoTestimonials-module_cardsSection", "cardsGrid": "PromoTestimonials-module_cardsGrid", "card": "PromoTestimonials-module_card", "quote": "PromoTestimonials-module_quote", "author": "PromoTestimonials-module_author", "authorInfo": "PromoTestimonials-module_authorInfo", "authorName": "PromoTestimonials-module_authorName", "authorRole": "PromoTestimonials-module_authorRole", "mediaSection": "PromoTestimonials-module_mediaSection", "mediaBox": "PromoTestimonials-module_mediaBox" };
 function PromoTestimonials({
   heading,
   subtitle,
@@ -7193,10 +7186,7 @@ function PromoTestimonials({
         testimonials.length - 5
       ] }) })
     ] }) }),
-    /* @__PURE__ */ jsxs("div", { className: __default66.headingSection, children: [
-      /* @__PURE__ */ jsx("h2", { className: __default66.heading, children: heading }),
-      subtitle && /* @__PURE__ */ jsx("p", { className: __default66.subtitle, children: subtitle })
-    ] }),
+    /* @__PURE__ */ jsx("div", { className: __default66.headingSection, children: /* @__PURE__ */ jsx(SectionHeading, { size: "lg", align: "center", subtitle, children: heading }) }),
     /* @__PURE__ */ jsx("div", { className: __default66.cardsSection, children: /* @__PURE__ */ jsx("div", { className: __default66.cardsGrid, children: testimonials.map((t, i) => {
       const initials = t.name.split(" ").map((n) => n[0]).join("").toUpperCase();
       return /* @__PURE__ */ jsxs(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dmitriikapustin/ui",
-  "version": "0.4.2",
+  "version": "0.4.4",
   "description": "Universal UI/UX Kit — React 19 component library with Atomic Design, CSS custom properties, and SCSS modules",
   "author": "Kapustin Team",
   "license": "MIT",