@cloud-ru/uikit-product-site-section 1.6.1 → 1.7.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# 1.7.0 (2026-06-18)
+
+
+### Features
+
+* **SITE-11464:** section benefits buttons with href ([e86742a](https://github.com/cloud-ru-tech/uikit-product/commit/e86742a257645e1fec5f58babbf2b9c0cca4629a))
+
+
+
+
+
 ## 1.6.1 (2026-06-15)
 
 ### Only dependencies have been changed

package/dist/cjs/components/SectionBenefits/SectionBenefits.js

@@ -21,7 +21,6 @@ const uikit_product_site_cards_1 = require("@cloud-ru/uikit-product-site-cards")
 const uikit_product_site_grid_1 = require("@cloud-ru/uikit-product-site-grid");
 const uikit_product_utils_1 = require("@cloud-ru/uikit-product-utils");
 const typography_1 = require("@snack-uikit/typography");
-const helperComponents_1 = require("../../helperComponents");
 const SectionBasic_1 = require("../SectionBasic");
 const components_1 = require("./components");
 const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
@@ -52,5 +51,5 @@ function SectionBenefits(_a) {
                             .map(({ cards }) => cards.map((card, index) => (0, jsx_runtime_1.jsx)(uikit_product_site_cards_1.CardProduct, Object.assign({ layoutType: layoutType }, card), index))), type === 'basic' &&
                         content
                             .filter(({ tabValue }) => tabValue === activeTab)
-                            .map(({ cards }) => cards.map((card, index) => (0, jsx_runtime_1.jsx)(uikit_product_site_cards_1.CardBasic, Object.assign({ layoutType: layoutType }, card), index)))] })), note && ((0, jsx_runtime_1.jsx)(typography_1.Typography.SansBodyM, { className: styles_module_scss_1.default.note, children: (0, jsx_runtime_1.jsx)("span", { dangerouslySetInnerHTML: { __html: note } }) })), buttons && ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.buttons, "data-buttons-align": buttonsAlign, children: buttons.map(button => (0, helperComponents_1.SectionButton)(button)) }))] })));
+                            .map(({ cards }) => cards.map((card, index) => (0, jsx_runtime_1.jsx)(uikit_product_site_cards_1.CardBasic, Object.assign({ layoutType: layoutType }, card), index)))] })), note && ((0, jsx_runtime_1.jsx)(typography_1.Typography.SansBodyM, { className: styles_module_scss_1.default.note, children: (0, jsx_runtime_1.jsx)("span", { dangerouslySetInnerHTML: { __html: note } }) })), buttons && ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.buttons, "data-buttons-align": buttonsAlign, children: buttons.map(button => (0, components_1.BenefitsButton)(button)) }))] })));
 }

package/dist/cjs/components/SectionBenefits/components/BenefitsButton/BenefitsButton.d.ts

@@ -0,0 +1,10 @@
+import { ButtonFilledProps } from '@snack-uikit/button';
+type SectionButtonProps = {
+    label: string;
+    href?: string;
+    target?: ButtonFilledProps['target'];
+    onClick?: ButtonFilledProps['onClick'];
+    type?: 'brand' | 'outline';
+};
+export declare function BenefitsButton(button: SectionButtonProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/components/SectionBenefits/components/BenefitsButton/BenefitsButton.js

@@ -0,0 +1,24 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BenefitsButton = BenefitsButton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const uikit_product_icons_1 = require("@cloud-ru/uikit-product-icons");
+const button_1 = require("@snack-uikit/button");
+function BenefitsButton(button) {
+    const { type } = button, buttonProps = __rest(button, ["type"]);
+    if (type === 'outline') {
+        return ((0, jsx_runtime_1.jsx)(button_1.ButtonOutline, Object.assign({ size: 'l', href: button.href, appearance: 'neutral', icon: (0, jsx_runtime_1.jsx)(uikit_product_icons_1.ArrowLinksSVG, {}) }, buttonProps), button.label));
+    }
+    return (0, jsx_runtime_1.jsx)(button_1.ButtonFilled, Object.assign({ size: 'l', href: button.href }, buttonProps), button.label);
+}

package/dist/cjs/components/SectionBenefits/components/BenefitsButton/index.d.ts

@@ -0,0 +1 @@
+export * from './BenefitsButton';

package/dist/cjs/components/SectionBenefits/components/BenefitsButton/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./BenefitsButton"), exports);

package/dist/cjs/components/SectionBenefits/components/index.d.ts

@@ -1 +1,2 @@
 export * from './CardNumeric';
+export * from './BenefitsButton';

package/dist/cjs/components/SectionBenefits/components/index.js

@@ -15,3 +15,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./CardNumeric"), exports);
+__exportStar(require("./BenefitsButton"), exports);

package/dist/esm/components/SectionBenefits/SectionBenefits.js

@@ -15,9 +15,8 @@ import { CardBasic, CardInfo, CardProduct } from '@cloud-ru/uikit-product-site-c
 import { Grid } from '@cloud-ru/uikit-product-site-grid';
 import { extractSupportProps } from '@cloud-ru/uikit-product-utils';
 import { Typography } from '@snack-uikit/typography';
-import { SectionButton } from '../../helperComponents';
 import { SectionBasic } from '../SectionBasic';
-import { CardNumeric } from './components';
+import { BenefitsButton, CardNumeric } from './components';
 import styles from './styles.module.css';
 export function SectionBenefits(_a) {
     var { id, title, titleTag, subtitle, subtitleTag, description, type, content, tabBarItems, columnsConfig, layoutType, buttons, note, backgroundColor, buttonsAlign = 'left' } = _a, rest = __rest(_a, ["id", "title", "titleTag", "subtitle", "subtitleTag", "description", "type", "content", "tabBarItems", "columnsConfig", "layoutType", "buttons", "note", "backgroundColor", "buttonsAlign"]);
@@ -46,5 +45,5 @@ export function SectionBenefits(_a) {
                             .map(({ cards }) => cards.map((card, index) => _jsx(CardProduct, Object.assign({ layoutType: layoutType }, card), index))), type === 'basic' &&
                         content
                             .filter(({ tabValue }) => tabValue === activeTab)
-                            .map(({ cards }) => cards.map((card, index) => _jsx(CardBasic, Object.assign({ layoutType: layoutType }, card), index)))] })), note && (_jsx(Typography.SansBodyM, { className: styles.note, children: _jsx("span", { dangerouslySetInnerHTML: { __html: note } }) })), buttons && (_jsx("div", { className: styles.buttons, "data-buttons-align": buttonsAlign, children: buttons.map(button => SectionButton(button)) }))] })));
+                            .map(({ cards }) => cards.map((card, index) => _jsx(CardBasic, Object.assign({ layoutType: layoutType }, card), index)))] })), note && (_jsx(Typography.SansBodyM, { className: styles.note, children: _jsx("span", { dangerouslySetInnerHTML: { __html: note } }) })), buttons && (_jsx("div", { className: styles.buttons, "data-buttons-align": buttonsAlign, children: buttons.map(button => BenefitsButton(button)) }))] })));
 }

package/dist/esm/components/SectionBenefits/components/BenefitsButton/BenefitsButton.d.ts

@@ -0,0 +1,10 @@
+import { ButtonFilledProps } from '@snack-uikit/button';
+type SectionButtonProps = {
+    label: string;
+    href?: string;
+    target?: ButtonFilledProps['target'];
+    onClick?: ButtonFilledProps['onClick'];
+    type?: 'brand' | 'outline';
+};
+export declare function BenefitsButton(button: SectionButtonProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/components/SectionBenefits/components/BenefitsButton/BenefitsButton.js

@@ -0,0 +1,21 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ArrowLinksSVG } from '@cloud-ru/uikit-product-icons';
+import { ButtonFilled, ButtonOutline } from '@snack-uikit/button';
+export function BenefitsButton(button) {
+    const { type } = button, buttonProps = __rest(button, ["type"]);
+    if (type === 'outline') {
+        return (_jsx(ButtonOutline, Object.assign({ size: 'l', href: button.href, appearance: 'neutral', icon: _jsx(ArrowLinksSVG, {}) }, buttonProps), button.label));
+    }
+    return _jsx(ButtonFilled, Object.assign({ size: 'l', href: button.href }, buttonProps), button.label);
+}

package/dist/esm/components/SectionBenefits/components/BenefitsButton/index.d.ts

@@ -0,0 +1 @@
+export * from './BenefitsButton';

package/dist/esm/components/SectionBenefits/components/BenefitsButton/index.js

@@ -0,0 +1 @@
+export * from './BenefitsButton';

package/dist/esm/components/SectionBenefits/components/index.d.ts

@@ -1 +1,2 @@
 export * from './CardNumeric';
+export * from './BenefitsButton';

package/dist/esm/components/SectionBenefits/components/index.js

@@ -1 +1,2 @@
 export * from './CardNumeric';
+export * from './BenefitsButton';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloud-ru/uikit-product-site-section",
   "title": "Site Section",
-  "version": "1.6.1",
+  "version": "1.7.0",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -67,5 +67,5 @@
     "@cloud-ru/uikit-product-locale": "*",
     "@snack-uikit/figma-tokens": "*"
   },
-  "gitHead": "82c3199da1b9ed2c30651169a39e0848d2b8a519"
+  "gitHead": "4aa36e044c8f063a246474132e66d71061f2f9df"
 }

package/src/components/SectionBenefits/SectionBenefits.tsx

@@ -5,11 +5,11 @@ import { Grid, GridProps } from '@cloud-ru/uikit-product-site-grid';
 import { extractSupportProps, WithLayoutType, WithSupportProps } from '@cloud-ru/uikit-product-utils';
 import { Typography } from '@snack-uikit/typography';
 
-import { SectionButton, SectionTitleProps } from '../../helperComponents';
+import { SectionTitleProps } from '../../helperComponents';
 import { SectionButtonProps } from '../../helperComponents/SectionButton/types';
 import { SectionColor } from '../../types';
 import { SectionBasic } from '../SectionBasic';
-import { CardNumeric } from './components';
+import { BenefitsButton, CardNumeric } from './components';
 import styles from './styles.module.scss';
 import { ContentBasic, ContentInfo, ContentNumeric, ContentProduct } from './types';
 
@@ -155,7 +155,7 @@ export function SectionBenefits({
 
       {buttons && (
         <div className={styles.buttons} data-buttons-align={buttonsAlign}>
-          {buttons.map(button => SectionButton(button))}
+          {buttons.map(button => BenefitsButton(button))}
         </div>
       )}
     </SectionBasic>

package/src/components/SectionBenefits/components/BenefitsButton/BenefitsButton.tsx

@@ -0,0 +1,29 @@
+import { ArrowLinksSVG } from '@cloud-ru/uikit-product-icons';
+import { ButtonFilled, ButtonFilledProps, ButtonOutline } from '@snack-uikit/button';
+
+type SectionButtonProps = {
+  label: string;
+  href?: string;
+  target?: ButtonFilledProps['target'];
+  onClick?: ButtonFilledProps['onClick'];
+  type?: 'brand' | 'outline';
+};
+
+export function BenefitsButton(button: SectionButtonProps) {
+  const { type, ...buttonProps } = button;
+
+  if (type === 'outline') {
+    return (
+      <ButtonOutline
+        key={button.label}
+        size='l'
+        href={button.href}
+        appearance='neutral'
+        icon={<ArrowLinksSVG />}
+        {...buttonProps}
+      />
+    );
+  }
+
+  return <ButtonFilled key={button.label} size='l' href={button.href} {...buttonProps} />;
+}

package/src/components/SectionBenefits/components/BenefitsButton/index.ts

@@ -0,0 +1 @@
+export * from './BenefitsButton';

package/src/components/SectionBenefits/components/index.ts

@@ -1 +1,2 @@
 export * from './CardNumeric';
+export * from './BenefitsButton';