@cloud-ru/uikit-product-site-article 1.2.11 → 1.2.12

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 1.2.12 (2026-07-22)
+
+**Note:** Version bump only for package @cloud-ru/uikit-product-site-article
+
+
+
+
+
 ## 1.2.11 (2026-07-21)
 
 ### Only dependencies have been changed

package/dist/cjs/components/ArticleLinks/ArticleLinks.js

@@ -5,24 +5,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ArticleLinks = ArticleLinks;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
 const typography_1 = require("@snack-uikit/typography");
 const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
 function ArticleLinks(props) {
     const { layoutType, links } = props;
-    const typographyProps = (0, react_1.useMemo)(() => {
-        if (layoutType === 'mobile') {
-            return {
-                family: 'sans',
-                purpose: 'title',
-                size: 'm',
-            };
-        }
-        return {
-            family: 'sans',
-            purpose: 'title',
-            size: 'l',
-        };
-    }, [layoutType]);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.articleLinks, "data-layout-type": layoutType, children: [(0, jsx_runtime_1.jsx)(typography_1.Typography, Object.assign({ className: styles_module_scss_1.default.title }, typographyProps, { tag: 'div', children: "\u0421\u043E\u0434\u0435\u0440\u0436\u0430\u043D\u0438\u0435" })), (0, jsx_runtime_1.jsx)("ul", { className: styles_module_scss_1.default.list, "data-test-id": 'article-links', children: links.map(link => ((0, jsx_runtime_1.jsx)("li", { className: styles_module_scss_1.default.listItem, children: (0, jsx_runtime_1.jsx)("a", { className: styles_module_scss_1.default.link, href: `#${link.id}`, onClick: e => { var _a; return (_a = link.onClick) === null || _a === void 0 ? void 0 : _a.call(link, e); }, children: (0, jsx_runtime_1.jsx)(typography_1.Typography.SansBodyL, { children: link.text }) }) }, link.id))) })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.articleLinks, "data-layout-type": layoutType, children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.title, children: "\u0421\u043E\u0434\u0435\u0440\u0436\u0430\u043D\u0438\u0435" }), (0, jsx_runtime_1.jsx)("ul", { className: styles_module_scss_1.default.list, "data-test-id": 'article-links', children: links.map(link => ((0, jsx_runtime_1.jsx)("li", { className: styles_module_scss_1.default.listItem, children: (0, jsx_runtime_1.jsx)("a", { className: styles_module_scss_1.default.link, href: `#${link.id}`, onClick: e => { var _a; return (_a = link.onClick) === null || _a === void 0 ? void 0 : _a.call(link, e); }, children: (0, jsx_runtime_1.jsx)(typography_1.Typography.SansBodyL, { children: link.text }) }) }, link.id))) })] }));
 }

package/dist/cjs/components/ArticleLinks/styles.module.css

@@ -8,9 +8,23 @@
 }
 
 .title{
+  font-family:var(--sans-title-l-font-family, SB Sans Display);
+  font-weight:var(--sans-title-l-font-weight, Semibold);
+  line-height:var(--sans-title-l-line-height, 28px);
+  font-size:var(--sans-title-l-font-size, 22px);
+  letter-spacing:var(--sans-title-l-letter-spacing, 0px);
+  paragraph-spacing:var(--sans-title-l-paragraph-spacing, 12.1px);
   color:var(--sys-neutral-text-main, #41424e);
   margin-bottom:16px;
 }
+.articleLinks[data-layout-type=mobile] .title{
+  font-family:var(--sans-title-m-font-family, SB Sans Display);
+  font-weight:var(--sans-title-m-font-weight, Semibold);
+  line-height:var(--sans-title-m-line-height, 24px);
+  font-size:var(--sans-title-m-font-size, 16px);
+  letter-spacing:var(--sans-title-m-letter-spacing, 0px);
+  paragraph-spacing:var(--sans-title-m-paragraph-spacing, 8.8px);
+}
 
 .list{
   margin:0;

package/dist/esm/components/ArticleLinks/ArticleLinks.js

@@ -1,22 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
 import { Typography } from '@snack-uikit/typography';
 import styles from './styles.module.css';
 export function ArticleLinks(props) {
     const { layoutType, links } = props;
-    const typographyProps = useMemo(() => {
-        if (layoutType === 'mobile') {
-            return {
-                family: 'sans',
-                purpose: 'title',
-                size: 'm',
-            };
-        }
-        return {
-            family: 'sans',
-            purpose: 'title',
-            size: 'l',
-        };
-    }, [layoutType]);
-    return (_jsxs("div", { className: styles.articleLinks, "data-layout-type": layoutType, children: [_jsx(Typography, Object.assign({ className: styles.title }, typographyProps, { tag: 'div', children: "\u0421\u043E\u0434\u0435\u0440\u0436\u0430\u043D\u0438\u0435" })), _jsx("ul", { className: styles.list, "data-test-id": 'article-links', children: links.map(link => (_jsx("li", { className: styles.listItem, children: _jsx("a", { className: styles.link, href: `#${link.id}`, onClick: e => { var _a; return (_a = link.onClick) === null || _a === void 0 ? void 0 : _a.call(link, e); }, children: _jsx(Typography.SansBodyL, { children: link.text }) }) }, link.id))) })] }));
+    return (_jsxs("div", { className: styles.articleLinks, "data-layout-type": layoutType, children: [_jsx("div", { className: styles.title, children: "\u0421\u043E\u0434\u0435\u0440\u0436\u0430\u043D\u0438\u0435" }), _jsx("ul", { className: styles.list, "data-test-id": 'article-links', children: links.map(link => (_jsx("li", { className: styles.listItem, children: _jsx("a", { className: styles.link, href: `#${link.id}`, onClick: e => { var _a; return (_a = link.onClick) === null || _a === void 0 ? void 0 : _a.call(link, e); }, children: _jsx(Typography.SansBodyL, { children: link.text }) }) }, link.id))) })] }));
 }

package/dist/esm/components/ArticleLinks/styles.module.css

@@ -8,9 +8,23 @@
 }
 
 .title{
+  font-family:var(--sans-title-l-font-family, SB Sans Display);
+  font-weight:var(--sans-title-l-font-weight, Semibold);
+  line-height:var(--sans-title-l-line-height, 28px);
+  font-size:var(--sans-title-l-font-size, 22px);
+  letter-spacing:var(--sans-title-l-letter-spacing, 0px);
+  paragraph-spacing:var(--sans-title-l-paragraph-spacing, 12.1px);
   color:var(--sys-neutral-text-main, #41424e);
   margin-bottom:16px;
 }
+.articleLinks[data-layout-type=mobile] .title{
+  font-family:var(--sans-title-m-font-family, SB Sans Display);
+  font-weight:var(--sans-title-m-font-weight, Semibold);
+  line-height:var(--sans-title-m-line-height, 24px);
+  font-size:var(--sans-title-m-font-size, 16px);
+  letter-spacing:var(--sans-title-m-letter-spacing, 0px);
+  paragraph-spacing:var(--sans-title-m-paragraph-spacing, 8.8px);
+}
 
 .list{
   margin:0;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloud-ru/uikit-product-site-article",
   "title": "Site Article",
-  "version": "1.2.11",
+  "version": "1.2.12",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -44,5 +44,5 @@
     "@snack-uikit/utils": "4.0.0",
     "classnames": "2.5.1"
   },
-  "gitHead": "0ba8fab8e570a50b497bfcf5dfc83ddf9eef91ac"
+  "gitHead": "856720ac43c0af086de198bffa65e1af9f5efbc3"
 }

package/src/components/ArticleLinks/ArticleLinks.tsx

@@ -1,7 +1,7 @@
-import { MouseEvent, useMemo } from 'react';
+import { MouseEvent } from 'react';
 
 import { WithLayoutType } from '@cloud-ru/uikit-product-utils';
-import { Typography, TypographyProps } from '@snack-uikit/typography';
+import { Typography } from '@snack-uikit/typography';
 
 import styles from './styles.module.scss';
 
@@ -18,27 +18,9 @@ export type ArticleLinksProps = WithLayoutType<{
 export function ArticleLinks(props: ArticleLinksProps) {
   const { layoutType, links } = props;
 
-  const typographyProps: TypographyProps = useMemo(() => {
-    if (layoutType === 'mobile') {
-      return {
-        family: 'sans',
-        purpose: 'title',
-        size: 'm',
-      };
-    }
-
-    return {
-      family: 'sans',
-      purpose: 'title',
-      size: 'l',
-    };
-  }, [layoutType]);
-
   return (
     <div className={styles.articleLinks} data-layout-type={layoutType}>
-      <Typography className={styles.title} {...typographyProps} tag='div'>
-        Содержание
-      </Typography>
+      <div className={styles.title}>Содержание</div>
       <ul className={styles.list} data-test-id='article-links'>
         {links.map(link => (
           <li className={styles.listItem} key={link.id}>

package/src/components/ArticleLinks/styles.module.scss

@@ -12,8 +12,14 @@
 }
 
 .title {
+  @include var.composite-var(var.$sans-title-l);
+
   color: var.$sys-neutral-text-main;
   margin-bottom: 16px;
+
+  .articleLinks[data-layout-type='mobile'] & {
+    @include var.composite-var(var.$sans-title-m);
+  }
 }
 
 .list {