@salutejs/sdds-finai 0.356.0 → 0.356.1-dev.0

package/dist/css/es/index.js

@@ -1,5 +1,5 @@
 export { Accordion } from './components/Accordion/Accordion.js';
-export { AccordionItem, ButtonBase, CardContent, CardInnerContent, CarouselItem, CellTextbox, CellTextboxLabel, CellTextboxSubtitle, CellTextboxTitle, Col, ListItem, ONLY_CHARS_PATTERN, ONLY_DIGITS_AND_CHARS_PATTERN, ONLY_DIGITS_PATTERN, Overlay, PopupProvider, Portal, RadioGroup, RectSkeleton, Row, SSRProvider, SegmentProvider, TabItemRefs, TabsContext, addNotification, closeNotification, codeFieldClasses, codeFieldTokens, counterTokens, datePickerClasses, datePickerTokens, dateTimePickerClasses, dateTimePickerTokens, dividerTokens, dropzoneClasses, dropzoneTokens, informationWrapperClasses, informationWrapperTokens, modalClasses, noteClasses, noteTokens, numberFormatter, numberInputClasses, numberInputTokens, popupClasses, priceClasses, rangeTokens, ratingClasses, ratingTokens, sheetClasses, textFieldTokens, timePickerClasses, timePickerTokens, toolbarTokens, usePopupContext, useSegment, useToast, withSkeleton } from '@salutejs/plasma-new-hope/css';
+export { AccordionItem, ButtonBase, CardContent, CardInnerContent, CarouselItem, CellTextbox, CellTextboxLabel, CellTextboxSubtitle, CellTextboxTitle, Col, ListItem, ONLY_CHARS_PATTERN, ONLY_DIGITS_AND_CHARS_PATTERN, ONLY_DIGITS_PATTERN, Overlay, PopupProvider, Portal, RadioGroup, RectSkeleton, Row, SSRProvider, SegmentProvider, TabItemRefs, TabsContext, addNotification, closeNotification, codeFieldClasses, codeFieldTokens, counterTokens, datePickerClasses, datePickerTokens, dateTimePickerClasses, dateTimePickerTokens, dividerTokens, dropzoneClasses, dropzoneTokens, informationWrapperClasses, informationWrapperTokens, modalClasses, noteClasses, noteTokens, numberFormatter, numberInputClasses, numberInputTokens, popupClasses, priceClasses, rangeTokens, ratingClasses, ratingTokens, sheetClasses, textFieldTokens, timePickerClasses, timePickerTokens, toolbarTokens, useNotifications, usePopupContext, useSegment, useToast, withSkeleton } from '@salutejs/plasma-new-hope/css';
 export { Attach } from './components/Attach/Attach.js';
 export { Autocomplete } from './components/Autocomplete/Autocomplete.js';
 export { Avatar } from './components/Avatar/Avatar.js';

package/dist/emotion/cjs/components/Button/Button.config.js

@@ -125,6 +125,16 @@ const config = {
                 ${_emotion.buttonTokens.buttonColorActive}: ${_sdds_finai.onLightTextPrimaryActive};
                 ${_emotion.buttonTokens.buttonBackgroundColorHover}: ${_sdds_finai.onDarkSurfaceSolidDefaultHover};
                 ${_emotion.buttonTokens.buttonBackgroundColorActive}: ${_sdds_finai.onDarkSurfaceSolidDefaultActive};
+            `,
+            gradient: (0, _emotion.css)`
+                ${_emotion.buttonTokens.buttonColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_emotion.buttonTokens.buttonTextColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_emotion.buttonTokens.buttonIconColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_emotion.buttonTokens.buttonValueColor}: ${_sdds_finai.onLightTextSecondary};
+                ${_emotion.buttonTokens.buttonBackgroundColor}: ${_sdds_finai.surfaceAccentGradient};
+                ${_emotion.buttonTokens.buttonLoadingBackgroundColor}: var(${_emotion.buttonTokens.buttonBackgroundColor});
+                ${_emotion.buttonTokens.buttonBackgroundColorHover}: ${_sdds_finai.surfaceAccentGradient};
+                ${_emotion.buttonTokens.buttonBackgroundColorActive}: ${_sdds_finai.surfaceAccentGradient};
             `
         },
         size: {

package/dist/emotion/cjs/components/ButtonGroup/ButtonGroup.config.js

@@ -136,6 +136,16 @@ const config = {
                 ${_emotion.buttonGroupTokens.buttonBackgroundColorHover}: ${_sdds_finai.onDarkSurfaceSolidDefaultHover};
                 ${_emotion.buttonGroupTokens.buttonColorActive}: ${_sdds_finai.onLightTextPrimary};
                 ${_emotion.buttonGroupTokens.buttonBackgroundColorActive}: ${_sdds_finai.onDarkSurfaceSolidDefaultActive};
+            `,
+            gradient: (0, _emotion.css)`
+                ${_emotion.buttonGroupTokens.buttonColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_emotion.buttonGroupTokens.buttonTextColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_emotion.buttonGroupTokens.buttonIconColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_emotion.buttonGroupTokens.buttonValueColor}: ${_sdds_finai.onLightTextSecondary};
+                ${_emotion.buttonGroupTokens.buttonBackgroundColor}: ${_sdds_finai.surfaceAccentGradient};
+                ${_emotion.buttonGroupTokens.buttonLoadingBackgroundColor}: var(${_emotion.buttonGroupTokens.buttonBackgroundColor});
+                ${_emotion.buttonGroupTokens.buttonBackgroundColorHover}: ${_sdds_finai.surfaceAccentGradient};
+                ${_emotion.buttonGroupTokens.buttonBackgroundColorActive}: ${_sdds_finai.surfaceAccentGradient};
             `
         },
         size: {

package/dist/emotion/cjs/components/EmbedIconButton/EmbedIconButton.config.js

@@ -66,6 +66,13 @@ const config = {
                 ${_emotion.embedIconButtonTokens.embedIconButtonLoadingBackgroundColor}: var(${_emotion.embedIconButtonTokens.embedIconButtonBackgroundColor});
                 ${_emotion.embedIconButtonTokens.embedIconButtonColorHover}: ${_sdds_finai.textInfoHover};
                 ${_emotion.embedIconButtonTokens.embedIconButtonColorActive}: ${_sdds_finai.textInfoActive};
+            `,
+            gradient: (0, _emotion.css)`
+                ${_emotion.embedIconButtonTokens.embedIconButtonColor}: ${_sdds_finai.textAccentGradient};
+                ${_emotion.embedIconButtonTokens.embedIconButtonBackgroundColor}: ${_sdds_finai.surfaceClear};
+                ${_emotion.embedIconButtonTokens.embedIconButtonLoadingBackgroundColor}: var(${_emotion.embedIconButtonTokens.embedIconButtonBackgroundColor});
+                ${_emotion.embedIconButtonTokens.embedIconButtonColorHover}: ${_sdds_finai.textAccentGradient};
+                ${_emotion.embedIconButtonTokens.embedIconButtonColorActive}: ${_sdds_finai.textAccentGradient};
             `
         },
         size: {

package/dist/emotion/cjs/components/IconButton/IconButton.config.js

@@ -87,6 +87,13 @@ const config = {
                 ${_emotion.iconButtonTokens.iconButtonLoadingBackgroundColor}: var(${_emotion.iconButtonTokens.iconButtonBackgroundColor});
                 ${_emotion.iconButtonTokens.iconButtonColorHover}: ${_sdds_finai.onLightTextPrimaryHover};
                 ${_emotion.iconButtonTokens.iconButtonColorActive}: ${_sdds_finai.onLightTextPrimaryActive};
+            `,
+            gradient: (0, _emotion.css)`
+                ${_emotion.iconButtonTokens.iconButtonColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_emotion.iconButtonTokens.iconButtonBackgroundColor}: ${_sdds_finai.surfaceAccentGradient};
+                ${_emotion.iconButtonTokens.iconButtonLoadingBackgroundColor}: var(${_emotion.iconButtonTokens.iconButtonBackgroundColor});
+                ${_emotion.iconButtonTokens.iconButtonColorHover}: ${_sdds_finai.onLightTextPrimaryHover};
+                ${_emotion.iconButtonTokens.iconButtonColorActive}: ${_sdds_finai.onLightTextPrimaryActive};
             `
         },
         size: {

package/dist/emotion/cjs/components/LinkButton/LinkButton.config.js

@@ -86,6 +86,16 @@ const config = {
                 ${_emotion.linkButtonTokens.linkButtonFocusColor}: ${_sdds_finai.surfaceAccent};
                 ${_emotion.linkButtonTokens.linkButtonTextColorHover}: ${_sdds_finai.textInfoHover};
                 ${_emotion.linkButtonTokens.linkButtonTextColorActive}: ${_sdds_finai.textInfoActive};
+            `,
+            gradient: (0, _emotion.css)`
+                ${_emotion.linkButtonTokens.linkButtonIconColor}: ${_sdds_finai.textAccentGradient};
+                ${_emotion.linkButtonTokens.linkButtonTextColor}: ${_sdds_finai.textAccentGradient};
+                ${_emotion.linkButtonTokens.linkButtonBackgroundColor}: ${_sdds_finai.surfaceClear};
+                ${_emotion.linkButtonTokens.linkButtonIconColorHover}: ${_sdds_finai.textAccentGradient};
+                ${_emotion.linkButtonTokens.linkButtonIconColorActive}: ${_sdds_finai.textAccentGradient};
+                ${_emotion.linkButtonTokens.linkButtonFocusColor}: ${_sdds_finai.surfaceAccent};
+                ${_emotion.linkButtonTokens.linkButtonTextColorHover}: ${_sdds_finai.textAccentGradient};
+                ${_emotion.linkButtonTokens.linkButtonTextColorActive}: ${_sdds_finai.textAccentGradient};
             `
         },
         size: {

package/dist/emotion/cjs/components/LinkButton/LinkButton.js

@@ -2,13 +2,87 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-Object.defineProperty(exports, "LinkButton", {
-    enumerable: true,
-    get: function() {
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get GradientLinkButton () {
+        return GradientLinkButton;
+    },
+    get LinkButton () {
         return LinkButton;
     }
 });
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _styled = /*#__PURE__*/ _interop_require_default(require("@emotion/styled"));
 const _emotion = require("@salutejs/plasma-new-hope/emotion");
 const _LinkButtonconfig = require("./LinkButton.config");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
 const mergedConfig = (0, _emotion.mergeConfig)(_emotion.linkButtonConfig, _LinkButtonconfig.config);
-const LinkButton = (0, _emotion.component)(mergedConfig);
+const LinkButtonComponent = (0, _emotion.component)(mergedConfig);
+const GradientLinkButton = /*#__PURE__*/ (0, _styled.default)(LinkButtonComponent, {
+    target: "esqkte30",
+    label: "GradientLinkButton"
+})("& .sdds-core-text-node{background:var(", _emotion.linkButtonTokens.linkButtonTextColor, ");background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;}&:hover .sdds-core-text-node{background:var(", _emotion.linkButtonTokens.linkButtonTextColor, ");background-clip:text;-webkit-background-clip:text;}&:active .sdds-core-text-node{background:var(", _emotion.linkButtonTokens.linkButtonTextColor, ");background-clip:text;-webkit-background-clip:text;}", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjLWVtb3Rpb24vY29tcG9uZW50cy9MaW5rQnV0dG9uL0xpbmtCdXR0b24udHN4Iiwic291cmNlcyI6WyJzcmMtZW1vdGlvbi9jb21wb25lbnRzL0xpbmtCdXR0b24vTGlua0J1dHRvbi50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IENvbXBvbmVudFByb3BzLCBmb3J3YXJkUmVmIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtcbiAgICBjb21wb25lbnQsXG4gICAgbWVyZ2VDb25maWcsXG4gICAgbGlua0J1dHRvbkNvbmZpZyxcbiAgICBsaW5rQnV0dG9uVG9rZW5zLFxufSBmcm9tICdAc2FsdXRlanMvcGxhc21hLW5ldy1ob3BlL2Vtb3Rpb24nO1xuXG5pbXBvcnQgeyBjb25maWcgfSBmcm9tICcuL0xpbmtCdXR0b24uY29uZmlnJztcblxuY29uc3QgbWVyZ2VkQ29uZmlnID0gbWVyZ2VDb25maWcobGlua0J1dHRvbkNvbmZpZywgY29uZmlnKTtcblxuY29uc3QgTGlua0J1dHRvbkNvbXBvbmVudCA9IGNvbXBvbmVudChtZXJnZWRDb25maWcpO1xuXG50eXBlIExpbmtCdXR0b25Db21wb25lbnRQcm9wcyA9IENvbXBvbmVudFByb3BzPHR5cGVvZiBMaW5rQnV0dG9uQ29tcG9uZW50PjtcblxuZXhwb3J0IGNvbnN0IEdyYWRpZW50TGlua0J1dHRvbiA9IHN0eWxlZChMaW5rQnV0dG9uQ29tcG9uZW50KWBcbiAgICAmIC5zZGRzLWNvcmUtdGV4dC1ub2RlIHtcbiAgICAgICAgYmFja2dyb3VuZDogdmFyKCR7bGlua0J1dHRvblRva2Vucy5saW5rQnV0dG9uVGV4dENvbG9yfSk7XG4gICAgICAgIGJhY2tncm91bmQtY2xpcDogdGV4dDtcbiAgICAgICAgLXdlYmtpdC1iYWNrZ3JvdW5kLWNsaXA6IHRleHQ7XG4gICAgICAgIC13ZWJraXQtdGV4dC1maWxsLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgICB9XG5cbiAgICAmOmhvdmVyIC5zZGRzLWNvcmUtdGV4dC1ub2RlIHtcbiAgICAgICAgYmFja2dyb3VuZDogdmFyKCR7bGlua0J1dHRvblRva2Vucy5saW5rQnV0dG9uVGV4dENvbG9yfSk7XG4gICAgICAgIGJhY2tncm91bmQtY2xpcDogdGV4dDtcbiAgICAgICAgLXdlYmtpdC1iYWNrZ3JvdW5kLWNsaXA6IHRleHQ7XG4gICAgfVxuXG4gICAgJjphY3RpdmUgLnNkZHMtY29yZS10ZXh0LW5vZGUge1xuICAgICAgICBiYWNrZ3JvdW5kOiB2YXIoJHtsaW5rQnV0dG9uVG9rZW5zLmxpbmtCdXR0b25UZXh0Q29sb3J9KTtcbiAgICAgICAgYmFja2dyb3VuZC1jbGlwOiB0ZXh0O1xuICAgICAgICAtd2Via2l0LWJhY2tncm91bmQtY2xpcDogdGV4dDtcbiAgICB9XG5gO1xuXG5leHBvcnQgY29uc3QgTGlua0J1dHRvbiA9IGZvcndhcmRSZWY8SFRNTEFuY2hvckVsZW1lbnQsIExpbmtCdXR0b25Db21wb25lbnRQcm9wcz4oKHsgdmlldywgLi4ucmVzdCB9LCByZWYpID0+IHtcbiAgICBpZiAodmlldyA9PT0gJ2dyYWRpZW50Jykge1xuICAgICAgICByZXR1cm4gPEdyYWRpZW50TGlua0J1dHRvbiByZWY9e3JlZn0gdmlldz17dmlld30gey4uLnJlc3R9IC8+O1xuICAgIH1cblxuICAgIHJldHVybiA8TGlua0J1dHRvbkNvbXBvbmVudCByZWY9e3JlZn0gdmlldz17dmlld30gey4uLnJlc3R9IC8+O1xufSk7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUJrQyJ9 */");
+const LinkButton = /*#__PURE__*/ (0, _react.forwardRef)(({ view, ...rest }, ref)=>{
+    if (view === 'gradient') {
+        return /*#__PURE__*/ _react.default.createElement(GradientLinkButton, {
+            ref: ref,
+            view: view,
+            ...rest
+        });
+    }
+    return /*#__PURE__*/ _react.default.createElement(LinkButtonComponent, {
+        ref: ref,
+        view: view,
+        ...rest
+    });
+});

package/dist/emotion/cjs/components/Notification/index.js

@@ -20,6 +20,9 @@ _export(exports, {
     },
     get closeNotification () {
         return _emotion.closeNotification;
+    },
+    get useNotifications () {
+        return _emotion.useNotifications;
     }
 });
 const _Notification = require("./Notification");

package/dist/emotion/cjs/components/Slider/Slider.config.js

@@ -224,8 +224,7 @@ const config = {
         },
         pointerSize: {
             small: (0, _emotion.css)`
-                ${_emotion.sliderTokens.thumbSize}: 1rem;
-                ${_emotion.sliderTokens.thumbBorderStyle}: solid;
+                ${_emotion.sliderTokens.thumbWidth}: 1rem;
                 ${_emotion.sliderTokens.thumbBorderWidth}: 0.0625rem;
 
                 ${_emotion.sliderTokens.tickSeparatorWidth}: 0.25rem;
@@ -233,8 +232,7 @@ const config = {
                 ${_emotion.sliderTokens.tickSeparatorBorderRadius}: 0.25rem;
             `,
             large: (0, _emotion.css)`
-                ${_emotion.sliderTokens.thumbSize}: 1.25rem;
-                ${_emotion.sliderTokens.thumbBorderStyle}: solid;
+                ${_emotion.sliderTokens.thumbWidth}: 1.25rem;
                 ${_emotion.sliderTokens.thumbBorderWidth}: 0.0625rem;
 
                 ${_emotion.sliderTokens.tickSeparatorWidth}: 0.25rem;
@@ -242,7 +240,7 @@ const config = {
                 ${_emotion.sliderTokens.tickSeparatorBorderRadius}: 0.25rem;
             `,
             none: (0, _emotion.css)`
-                ${_emotion.sliderTokens.thumbSize}: 0rem;
+                ${_emotion.sliderTokens.thumbWidth}: 0rem;
 
                 ${_emotion.sliderTokens.tickSeparatorWidth}: 0.25rem;
                 ${_emotion.sliderTokens.tickSeparatorHeight}: 0.5rem;

package/dist/emotion/es/components/Button/Button.config.js

@@ -1,5 +1,5 @@
 import { css, buttonTokens } from '@salutejs/plasma-new-hope/emotion';
-import { bodyS, bodySBold, bodyXS, bodyXSBold, inverseTextPrimary, inverseTextPrimaryActive, inverseTextPrimaryHover, inverseTextSecondary, onDarkSurfaceSolidDefault, onDarkSurfaceSolidDefaultActive, onDarkSurfaceSolidDefaultHover, onDarkTextPrimary, onDarkTextPrimaryActive, onDarkTextPrimaryHover, onDarkTextSecondary, onLightSurfaceSolidDefault, onLightSurfaceSolidDefaultActive, onLightSurfaceSolidDefaultHover, onLightSurfaceTransparentDeep, onLightSurfaceTransparentDeepActive, onLightSurfaceTransparentDeepHover, onLightTextPrimary, onLightTextPrimaryActive, onLightTextPrimaryHover, onLightTextSecondary, surfaceAccent, surfaceAccentActive, surfaceAccentHover, surfaceClear, surfaceNegative, surfaceNegativeActive, surfaceNegativeHover, surfacePositive, surfacePositiveActive, surfacePositiveHover, surfaceSolidDefault, surfaceSolidDefaultActive, surfaceSolidDefaultHover, surfaceTransparentSecondary, surfaceTransparentSecondaryActive, surfaceTransparentSecondaryHover, surfaceWarning, surfaceWarningActive, surfaceWarningHover, textPrimary, textSecondary } from '@salutejs/sdds-themes/tokens/sdds_finai';
+import { bodyS, bodySBold, bodyXS, bodyXSBold, inverseTextPrimary, inverseTextPrimaryActive, inverseTextPrimaryHover, inverseTextSecondary, onDarkSurfaceSolidDefault, onDarkSurfaceSolidDefaultActive, onDarkSurfaceSolidDefaultHover, onDarkTextPrimary, onDarkTextPrimaryActive, onDarkTextPrimaryHover, onDarkTextSecondary, onLightSurfaceSolidDefault, onLightSurfaceSolidDefaultActive, onLightSurfaceSolidDefaultHover, onLightSurfaceTransparentDeep, onLightSurfaceTransparentDeepActive, onLightSurfaceTransparentDeepHover, onLightTextPrimary, onLightTextPrimaryActive, onLightTextPrimaryHover, onLightTextSecondary, surfaceAccent, surfaceAccentActive, surfaceAccentGradient, surfaceAccentHover, surfaceClear, surfaceNegative, surfaceNegativeActive, surfaceNegativeHover, surfacePositive, surfacePositiveActive, surfacePositiveHover, surfaceSolidDefault, surfaceSolidDefaultActive, surfaceSolidDefaultHover, surfaceTransparentSecondary, surfaceTransparentSecondaryActive, surfaceTransparentSecondaryHover, surfaceWarning, surfaceWarningActive, surfaceWarningHover, textPrimary, textSecondary } from '@salutejs/sdds-themes/tokens/sdds_finai';
 export const config = {
     defaults: {
         view: 'default',
@@ -115,6 +115,16 @@ export const config = {
                 ${buttonTokens.buttonColorActive}: ${onLightTextPrimaryActive};
                 ${buttonTokens.buttonBackgroundColorHover}: ${onDarkSurfaceSolidDefaultHover};
                 ${buttonTokens.buttonBackgroundColorActive}: ${onDarkSurfaceSolidDefaultActive};
+            `,
+            gradient: css`
+                ${buttonTokens.buttonColor}: ${onLightTextPrimary};
+                ${buttonTokens.buttonTextColor}: ${onLightTextPrimary};
+                ${buttonTokens.buttonIconColor}: ${onLightTextPrimary};
+                ${buttonTokens.buttonValueColor}: ${onLightTextSecondary};
+                ${buttonTokens.buttonBackgroundColor}: ${surfaceAccentGradient};
+                ${buttonTokens.buttonLoadingBackgroundColor}: var(${buttonTokens.buttonBackgroundColor});
+                ${buttonTokens.buttonBackgroundColorHover}: ${surfaceAccentGradient};
+                ${buttonTokens.buttonBackgroundColorActive}: ${surfaceAccentGradient};
             `
         },
         size: {

package/dist/emotion/es/components/ButtonGroup/ButtonGroup.config.js

@@ -1,5 +1,5 @@
 import { css, buttonGroupTokens } from '@salutejs/plasma-new-hope/emotion';
-import { bodyS, bodySBold, bodyXS, bodyXSBold, inverseTextPrimary, inverseTextSecondary, onDarkSurfaceSolidDefault, onDarkSurfaceSolidDefaultActive, onDarkSurfaceSolidDefaultHover, onDarkTextPrimary, onDarkTextSecondary, onLightSurfaceSolidDefault, onLightSurfaceSolidDefaultActive, onLightSurfaceSolidDefaultHover, onLightSurfaceTransparentDeep, onLightSurfaceTransparentDeepActive, onLightSurfaceTransparentDeepHover, onLightTextPrimary, onLightTextSecondary, surfaceAccent, surfaceAccentActive, surfaceAccentHover, surfaceClear, surfaceNegative, surfaceNegativeActive, surfaceNegativeHover, surfacePositive, surfacePositiveActive, surfacePositiveHover, surfaceSolidDefault, surfaceSolidDefaultActive, surfaceSolidDefaultHover, surfaceTransparentSecondary, surfaceTransparentSecondaryActive, surfaceTransparentSecondaryHover, surfaceWarning, surfaceWarningActive, surfaceWarningHover, textPrimary, textPrimaryActive, textPrimaryHover, textSecondary } from '@salutejs/sdds-themes/tokens/sdds_finai';
+import { bodyS, bodySBold, bodyXS, bodyXSBold, inverseTextPrimary, inverseTextSecondary, onDarkSurfaceSolidDefault, onDarkSurfaceSolidDefaultActive, onDarkSurfaceSolidDefaultHover, onDarkTextPrimary, onDarkTextSecondary, onLightSurfaceSolidDefault, onLightSurfaceSolidDefaultActive, onLightSurfaceSolidDefaultHover, onLightSurfaceTransparentDeep, onLightSurfaceTransparentDeepActive, onLightSurfaceTransparentDeepHover, onLightTextPrimary, onLightTextSecondary, surfaceAccent, surfaceAccentActive, surfaceAccentGradient, surfaceAccentHover, surfaceClear, surfaceNegative, surfaceNegativeActive, surfaceNegativeHover, surfacePositive, surfacePositiveActive, surfacePositiveHover, surfaceSolidDefault, surfaceSolidDefaultActive, surfaceSolidDefaultHover, surfaceTransparentSecondary, surfaceTransparentSecondaryActive, surfaceTransparentSecondaryHover, surfaceWarning, surfaceWarningActive, surfaceWarningHover, textPrimary, textPrimaryActive, textPrimaryHover, textSecondary } from '@salutejs/sdds-themes/tokens/sdds_finai';
 export const config = {
     defaults: {
         view: 'default',
@@ -126,6 +126,16 @@ export const config = {
                 ${buttonGroupTokens.buttonBackgroundColorHover}: ${onDarkSurfaceSolidDefaultHover};
                 ${buttonGroupTokens.buttonColorActive}: ${onLightTextPrimary};
                 ${buttonGroupTokens.buttonBackgroundColorActive}: ${onDarkSurfaceSolidDefaultActive};
+            `,
+            gradient: css`
+                ${buttonGroupTokens.buttonColor}: ${onLightTextPrimary};
+                ${buttonGroupTokens.buttonTextColor}: ${onLightTextPrimary};
+                ${buttonGroupTokens.buttonIconColor}: ${onLightTextPrimary};
+                ${buttonGroupTokens.buttonValueColor}: ${onLightTextSecondary};
+                ${buttonGroupTokens.buttonBackgroundColor}: ${surfaceAccentGradient};
+                ${buttonGroupTokens.buttonLoadingBackgroundColor}: var(${buttonGroupTokens.buttonBackgroundColor});
+                ${buttonGroupTokens.buttonBackgroundColorHover}: ${surfaceAccentGradient};
+                ${buttonGroupTokens.buttonBackgroundColorActive}: ${surfaceAccentGradient};
             `
         },
         size: {

package/dist/emotion/es/components/EmbedIconButton/EmbedIconButton.config.js

@@ -1,5 +1,5 @@
 import { css, embedIconButtonTokens } from '@salutejs/plasma-new-hope/emotion';
-import { bodyL, bodyLBold, bodyM, bodyMBold, bodyS, bodySBold, surfaceAccent, surfaceClear, textAccent, textAccentActive, textAccentHover, textInfo, textInfoActive, textInfoHover, textNegative, textNegativeActive, textNegativeHover, textPositive, textPositiveActive, textPositiveHover, textPrimary, textPrimaryActive, textPrimaryHover, textSecondary, textSecondaryActive, textSecondaryHover, textWarning, textWarningActive, textWarningHover } from '@salutejs/sdds-themes/tokens/sdds_finai';
+import { bodyL, bodyLBold, bodyM, bodyMBold, bodyS, bodySBold, surfaceAccent, surfaceClear, textAccent, textAccentActive, textAccentGradient, textAccentHover, textInfo, textInfoActive, textInfoHover, textNegative, textNegativeActive, textNegativeHover, textPositive, textPositiveActive, textPositiveHover, textPrimary, textPrimaryActive, textPrimaryHover, textSecondary, textSecondaryActive, textSecondaryHover, textWarning, textWarningActive, textWarningHover } from '@salutejs/sdds-themes/tokens/sdds_finai';
 export const config = {
     defaults: {
         view: 'default',
@@ -56,6 +56,13 @@ export const config = {
                 ${embedIconButtonTokens.embedIconButtonLoadingBackgroundColor}: var(${embedIconButtonTokens.embedIconButtonBackgroundColor});
                 ${embedIconButtonTokens.embedIconButtonColorHover}: ${textInfoHover};
                 ${embedIconButtonTokens.embedIconButtonColorActive}: ${textInfoActive};
+            `,
+            gradient: css`
+                ${embedIconButtonTokens.embedIconButtonColor}: ${textAccentGradient};
+                ${embedIconButtonTokens.embedIconButtonBackgroundColor}: ${surfaceClear};
+                ${embedIconButtonTokens.embedIconButtonLoadingBackgroundColor}: var(${embedIconButtonTokens.embedIconButtonBackgroundColor});
+                ${embedIconButtonTokens.embedIconButtonColorHover}: ${textAccentGradient};
+                ${embedIconButtonTokens.embedIconButtonColorActive}: ${textAccentGradient};
             `
         },
         size: {

package/dist/emotion/es/components/IconButton/IconButton.config.js

@@ -1,5 +1,5 @@
 import { css, iconButtonTokens } from '@salutejs/plasma-new-hope/emotion';
-import { bodyS, bodySBold, bodyXS, bodyXSBold, inverseTextPrimary, inverseTextPrimaryActive, inverseTextPrimaryHover, onDarkSurfaceSolidDefault, onDarkTextPrimary, onDarkTextPrimaryActive, onDarkTextPrimaryHover, onLightSurfaceSolidDefault, onLightSurfaceTransparentDeep, onLightTextPrimary, onLightTextPrimaryActive, onLightTextPrimaryHover, surfaceAccent, surfaceAccentActive, surfaceAccentHover, surfaceClear, surfaceNegative, surfaceNegativeActive, surfaceNegativeHover, surfacePositive, surfacePositiveActive, surfacePositiveHover, surfaceSolidDefault, surfaceTransparentSecondary, surfaceTransparentSecondaryActive, surfaceTransparentSecondaryHover, surfaceWarning, surfaceWarningActive, surfaceWarningHover, textPrimary } from '@salutejs/sdds-themes/tokens/sdds_finai';
+import { bodyS, bodySBold, bodyXS, bodyXSBold, inverseTextPrimary, inverseTextPrimaryActive, inverseTextPrimaryHover, onDarkSurfaceSolidDefault, onDarkTextPrimary, onDarkTextPrimaryActive, onDarkTextPrimaryHover, onLightSurfaceSolidDefault, onLightSurfaceTransparentDeep, onLightTextPrimary, onLightTextPrimaryActive, onLightTextPrimaryHover, surfaceAccent, surfaceAccentActive, surfaceAccentGradient, surfaceAccentHover, surfaceClear, surfaceNegative, surfaceNegativeActive, surfaceNegativeHover, surfacePositive, surfacePositiveActive, surfacePositiveHover, surfaceSolidDefault, surfaceTransparentSecondary, surfaceTransparentSecondaryActive, surfaceTransparentSecondaryHover, surfaceWarning, surfaceWarningActive, surfaceWarningHover, textPrimary } from '@salutejs/sdds-themes/tokens/sdds_finai';
 export const config = {
     defaults: {
         view: 'default',
@@ -77,6 +77,13 @@ export const config = {
                 ${iconButtonTokens.iconButtonLoadingBackgroundColor}: var(${iconButtonTokens.iconButtonBackgroundColor});
                 ${iconButtonTokens.iconButtonColorHover}: ${onLightTextPrimaryHover};
                 ${iconButtonTokens.iconButtonColorActive}: ${onLightTextPrimaryActive};
+            `,
+            gradient: css`
+                ${iconButtonTokens.iconButtonColor}: ${onLightTextPrimary};
+                ${iconButtonTokens.iconButtonBackgroundColor}: ${surfaceAccentGradient};
+                ${iconButtonTokens.iconButtonLoadingBackgroundColor}: var(${iconButtonTokens.iconButtonBackgroundColor});
+                ${iconButtonTokens.iconButtonColorHover}: ${onLightTextPrimaryHover};
+                ${iconButtonTokens.iconButtonColorActive}: ${onLightTextPrimaryActive};
             `
         },
         size: {

package/dist/emotion/es/components/LinkButton/LinkButton.config.js

@@ -1,5 +1,5 @@
 import { css, linkButtonTokens } from '@salutejs/plasma-new-hope/emotion';
-import { bodyS, bodySBold, bodyXS, bodyXSBold, bodyXXS, bodyXXSBold, surfaceAccent, surfaceClear, textAccent, textAccentActive, textAccentHover, textInfo, textInfoActive, textInfoHover, textNegative, textNegativeActive, textNegativeHover, textPositive, textPositiveActive, textPositiveHover, textPrimary, textPrimaryActive, textPrimaryHover, textSecondary, textSecondaryActive, textSecondaryHover, textWarning, textWarningActive, textWarningHover } from '@salutejs/sdds-themes/tokens/sdds_finai';
+import { bodyS, bodySBold, bodyXS, bodyXSBold, bodyXXS, bodyXXSBold, surfaceAccent, surfaceClear, textAccent, textAccentActive, textAccentGradient, textAccentHover, textInfo, textInfoActive, textInfoHover, textNegative, textNegativeActive, textNegativeHover, textPositive, textPositiveActive, textPositiveHover, textPrimary, textPrimaryActive, textPrimaryHover, textSecondary, textSecondaryActive, textSecondaryHover, textWarning, textWarningActive, textWarningHover } from '@salutejs/sdds-themes/tokens/sdds_finai';
 export const config = {
     defaults: {
         view: 'default',
@@ -76,6 +76,16 @@ export const config = {
                 ${linkButtonTokens.linkButtonFocusColor}: ${surfaceAccent};
                 ${linkButtonTokens.linkButtonTextColorHover}: ${textInfoHover};
                 ${linkButtonTokens.linkButtonTextColorActive}: ${textInfoActive};
+            `,
+            gradient: css`
+                ${linkButtonTokens.linkButtonIconColor}: ${textAccentGradient};
+                ${linkButtonTokens.linkButtonTextColor}: ${textAccentGradient};
+                ${linkButtonTokens.linkButtonBackgroundColor}: ${surfaceClear};
+                ${linkButtonTokens.linkButtonIconColorHover}: ${textAccentGradient};
+                ${linkButtonTokens.linkButtonIconColorActive}: ${textAccentGradient};
+                ${linkButtonTokens.linkButtonFocusColor}: ${surfaceAccent};
+                ${linkButtonTokens.linkButtonTextColorHover}: ${textAccentGradient};
+                ${linkButtonTokens.linkButtonTextColorActive}: ${textAccentGradient};
             `
         },
         size: {

package/dist/emotion/es/components/LinkButton/LinkButton.js

@@ -1,4 +1,24 @@
-import { component, mergeConfig, linkButtonConfig } from '@salutejs/plasma-new-hope/emotion';
+import React, { forwardRef } from 'react';
+import styled from '@emotion/styled';
+import { component, mergeConfig, linkButtonConfig, linkButtonTokens } from '@salutejs/plasma-new-hope/emotion';
 import { config } from './LinkButton.config';
 const mergedConfig = mergeConfig(linkButtonConfig, config);
-export const LinkButton = component(mergedConfig);
+const LinkButtonComponent = component(mergedConfig);
+export const GradientLinkButton = /*#__PURE__*/ styled(LinkButtonComponent, {
+    target: "esqkte30",
+    label: "GradientLinkButton"
+})("& .sdds-core-text-node{background:var(", linkButtonTokens.linkButtonTextColor, ");background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;}&:hover .sdds-core-text-node{background:var(", linkButtonTokens.linkButtonTextColor, ");background-clip:text;-webkit-background-clip:text;}&:active .sdds-core-text-node{background:var(", linkButtonTokens.linkButtonTextColor, ");background-clip:text;-webkit-background-clip:text;}", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjLWVtb3Rpb24vY29tcG9uZW50cy9MaW5rQnV0dG9uL0xpbmtCdXR0b24udHN4Iiwic291cmNlcyI6WyJzcmMtZW1vdGlvbi9jb21wb25lbnRzL0xpbmtCdXR0b24vTGlua0J1dHRvbi50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IENvbXBvbmVudFByb3BzLCBmb3J3YXJkUmVmIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtcbiAgICBjb21wb25lbnQsXG4gICAgbWVyZ2VDb25maWcsXG4gICAgbGlua0J1dHRvbkNvbmZpZyxcbiAgICBsaW5rQnV0dG9uVG9rZW5zLFxufSBmcm9tICdAc2FsdXRlanMvcGxhc21hLW5ldy1ob3BlL2Vtb3Rpb24nO1xuXG5pbXBvcnQgeyBjb25maWcgfSBmcm9tICcuL0xpbmtCdXR0b24uY29uZmlnJztcblxuY29uc3QgbWVyZ2VkQ29uZmlnID0gbWVyZ2VDb25maWcobGlua0J1dHRvbkNvbmZpZywgY29uZmlnKTtcblxuY29uc3QgTGlua0J1dHRvbkNvbXBvbmVudCA9IGNvbXBvbmVudChtZXJnZWRDb25maWcpO1xuXG50eXBlIExpbmtCdXR0b25Db21wb25lbnRQcm9wcyA9IENvbXBvbmVudFByb3BzPHR5cGVvZiBMaW5rQnV0dG9uQ29tcG9uZW50PjtcblxuZXhwb3J0IGNvbnN0IEdyYWRpZW50TGlua0J1dHRvbiA9IHN0eWxlZChMaW5rQnV0dG9uQ29tcG9uZW50KWBcbiAgICAmIC5zZGRzLWNvcmUtdGV4dC1ub2RlIHtcbiAgICAgICAgYmFja2dyb3VuZDogdmFyKCR7bGlua0J1dHRvblRva2Vucy5saW5rQnV0dG9uVGV4dENvbG9yfSk7XG4gICAgICAgIGJhY2tncm91bmQtY2xpcDogdGV4dDtcbiAgICAgICAgLXdlYmtpdC1iYWNrZ3JvdW5kLWNsaXA6IHRleHQ7XG4gICAgICAgIC13ZWJraXQtdGV4dC1maWxsLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgICB9XG5cbiAgICAmOmhvdmVyIC5zZGRzLWNvcmUtdGV4dC1ub2RlIHtcbiAgICAgICAgYmFja2dyb3VuZDogdmFyKCR7bGlua0J1dHRvblRva2Vucy5saW5rQnV0dG9uVGV4dENvbG9yfSk7XG4gICAgICAgIGJhY2tncm91bmQtY2xpcDogdGV4dDtcbiAgICAgICAgLXdlYmtpdC1iYWNrZ3JvdW5kLWNsaXA6IHRleHQ7XG4gICAgfVxuXG4gICAgJjphY3RpdmUgLnNkZHMtY29yZS10ZXh0LW5vZGUge1xuICAgICAgICBiYWNrZ3JvdW5kOiB2YXIoJHtsaW5rQnV0dG9uVG9rZW5zLmxpbmtCdXR0b25UZXh0Q29sb3J9KTtcbiAgICAgICAgYmFja2dyb3VuZC1jbGlwOiB0ZXh0O1xuICAgICAgICAtd2Via2l0LWJhY2tncm91bmQtY2xpcDogdGV4dDtcbiAgICB9XG5gO1xuXG5leHBvcnQgY29uc3QgTGlua0J1dHRvbiA9IGZvcndhcmRSZWY8SFRNTEFuY2hvckVsZW1lbnQsIExpbmtCdXR0b25Db21wb25lbnRQcm9wcz4oKHsgdmlldywgLi4ucmVzdCB9LCByZWYpID0+IHtcbiAgICBpZiAodmlldyA9PT0gJ2dyYWRpZW50Jykge1xuICAgICAgICByZXR1cm4gPEdyYWRpZW50TGlua0J1dHRvbiByZWY9e3JlZn0gdmlldz17dmlld30gey4uLnJlc3R9IC8+O1xuICAgIH1cblxuICAgIHJldHVybiA8TGlua0J1dHRvbkNvbXBvbmVudCByZWY9e3JlZn0gdmlldz17dmlld30gey4uLnJlc3R9IC8+O1xufSk7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUJrQyJ9 */");
+export const LinkButton = /*#__PURE__*/ forwardRef(({ view, ...rest }, ref)=>{
+    if (view === 'gradient') {
+        return /*#__PURE__*/ React.createElement(GradientLinkButton, {
+            ref: ref,
+            view: view,
+            ...rest
+        });
+    }
+    return /*#__PURE__*/ React.createElement(LinkButtonComponent, {
+        ref: ref,
+        view: view,
+        ...rest
+    });
+});

package/dist/emotion/es/components/Notification/index.js

@@ -1,2 +1,2 @@
 export { NotificationsProvider, Notification } from './Notification';
-export { addNotification, closeNotification } from '@salutejs/plasma-new-hope/emotion';
+export { addNotification, closeNotification, useNotifications } from '@salutejs/plasma-new-hope/emotion';

package/dist/emotion/es/components/Slider/Slider.config.js

@@ -214,8 +214,7 @@ export const config = {
         },
         pointerSize: {
             small: css`
-                ${sliderTokens.thumbSize}: 1rem;
-                ${sliderTokens.thumbBorderStyle}: solid;
+                ${sliderTokens.thumbWidth}: 1rem;
                 ${sliderTokens.thumbBorderWidth}: 0.0625rem;
 
                 ${sliderTokens.tickSeparatorWidth}: 0.25rem;
@@ -223,8 +222,7 @@ export const config = {
                 ${sliderTokens.tickSeparatorBorderRadius}: 0.25rem;
             `,
             large: css`
-                ${sliderTokens.thumbSize}: 1.25rem;
-                ${sliderTokens.thumbBorderStyle}: solid;
+                ${sliderTokens.thumbWidth}: 1.25rem;
                 ${sliderTokens.thumbBorderWidth}: 0.0625rem;
 
                 ${sliderTokens.tickSeparatorWidth}: 0.25rem;
@@ -232,7 +230,7 @@ export const config = {
                 ${sliderTokens.tickSeparatorBorderRadius}: 0.25rem;
             `,
             none: css`
-                ${sliderTokens.thumbSize}: 0rem;
+                ${sliderTokens.thumbWidth}: 0rem;
 
                 ${sliderTokens.tickSeparatorWidth}: 0.25rem;
                 ${sliderTokens.tickSeparatorHeight}: 0.5rem;

package/dist/styled-components/cjs/components/Button/Button.config.js

@@ -125,6 +125,16 @@ const config = {
                 ${_styledcomponents.buttonTokens.buttonColorActive}: ${_sdds_finai.onLightTextPrimaryActive};
                 ${_styledcomponents.buttonTokens.buttonBackgroundColorHover}: ${_sdds_finai.onDarkSurfaceSolidDefaultHover};
                 ${_styledcomponents.buttonTokens.buttonBackgroundColorActive}: ${_sdds_finai.onDarkSurfaceSolidDefaultActive};
+            `,
+            gradient: (0, _styledcomponents.css)`
+                ${_styledcomponents.buttonTokens.buttonColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_styledcomponents.buttonTokens.buttonTextColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_styledcomponents.buttonTokens.buttonIconColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_styledcomponents.buttonTokens.buttonValueColor}: ${_sdds_finai.onLightTextSecondary};
+                ${_styledcomponents.buttonTokens.buttonBackgroundColor}: ${_sdds_finai.surfaceAccentGradient};
+                ${_styledcomponents.buttonTokens.buttonLoadingBackgroundColor}: var(${_styledcomponents.buttonTokens.buttonBackgroundColor});
+                ${_styledcomponents.buttonTokens.buttonBackgroundColorHover}: ${_sdds_finai.surfaceAccentGradient};
+                ${_styledcomponents.buttonTokens.buttonBackgroundColorActive}: ${_sdds_finai.surfaceAccentGradient};
             `
         },
         size: {

package/dist/styled-components/cjs/components/ButtonGroup/ButtonGroup.config.js

@@ -136,6 +136,16 @@ const config = {
                 ${_styledcomponents.buttonGroupTokens.buttonBackgroundColorHover}: ${_sdds_finai.onDarkSurfaceSolidDefaultHover};
                 ${_styledcomponents.buttonGroupTokens.buttonColorActive}: ${_sdds_finai.onLightTextPrimary};
                 ${_styledcomponents.buttonGroupTokens.buttonBackgroundColorActive}: ${_sdds_finai.onDarkSurfaceSolidDefaultActive};
+            `,
+            gradient: (0, _styledcomponents.css)`
+                ${_styledcomponents.buttonGroupTokens.buttonColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_styledcomponents.buttonGroupTokens.buttonTextColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_styledcomponents.buttonGroupTokens.buttonIconColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_styledcomponents.buttonGroupTokens.buttonValueColor}: ${_sdds_finai.onLightTextSecondary};
+                ${_styledcomponents.buttonGroupTokens.buttonBackgroundColor}: ${_sdds_finai.surfaceAccentGradient};
+                ${_styledcomponents.buttonGroupTokens.buttonLoadingBackgroundColor}: var(${_styledcomponents.buttonGroupTokens.buttonBackgroundColor});
+                ${_styledcomponents.buttonGroupTokens.buttonBackgroundColorHover}: ${_sdds_finai.surfaceAccentGradient};
+                ${_styledcomponents.buttonGroupTokens.buttonBackgroundColorActive}: ${_sdds_finai.surfaceAccentGradient};
             `
         },
         size: {

package/dist/styled-components/cjs/components/EmbedIconButton/EmbedIconButton.config.js

@@ -66,6 +66,13 @@ const config = {
                 ${_styledcomponents.embedIconButtonTokens.embedIconButtonLoadingBackgroundColor}: var(${_styledcomponents.embedIconButtonTokens.embedIconButtonBackgroundColor});
                 ${_styledcomponents.embedIconButtonTokens.embedIconButtonColorHover}: ${_sdds_finai.textInfoHover};
                 ${_styledcomponents.embedIconButtonTokens.embedIconButtonColorActive}: ${_sdds_finai.textInfoActive};
+            `,
+            gradient: (0, _styledcomponents.css)`
+                ${_styledcomponents.embedIconButtonTokens.embedIconButtonColor}: ${_sdds_finai.textAccentGradient};
+                ${_styledcomponents.embedIconButtonTokens.embedIconButtonBackgroundColor}: ${_sdds_finai.surfaceClear};
+                ${_styledcomponents.embedIconButtonTokens.embedIconButtonLoadingBackgroundColor}: var(${_styledcomponents.embedIconButtonTokens.embedIconButtonBackgroundColor});
+                ${_styledcomponents.embedIconButtonTokens.embedIconButtonColorHover}: ${_sdds_finai.textAccentGradient};
+                ${_styledcomponents.embedIconButtonTokens.embedIconButtonColorActive}: ${_sdds_finai.textAccentGradient};
             `
         },
         size: {

package/dist/styled-components/cjs/components/IconButton/IconButton.config.js

@@ -87,6 +87,13 @@ const config = {
                 ${_styledcomponents.iconButtonTokens.iconButtonLoadingBackgroundColor}: var(${_styledcomponents.iconButtonTokens.iconButtonBackgroundColor});
                 ${_styledcomponents.iconButtonTokens.iconButtonColorHover}: ${_sdds_finai.onLightTextPrimaryHover};
                 ${_styledcomponents.iconButtonTokens.iconButtonColorActive}: ${_sdds_finai.onLightTextPrimaryActive};
+            `,
+            gradient: (0, _styledcomponents.css)`
+                ${_styledcomponents.iconButtonTokens.iconButtonColor}: ${_sdds_finai.onLightTextPrimary};
+                ${_styledcomponents.iconButtonTokens.iconButtonBackgroundColor}: ${_sdds_finai.surfaceAccentGradient};
+                ${_styledcomponents.iconButtonTokens.iconButtonLoadingBackgroundColor}: var(${_styledcomponents.iconButtonTokens.iconButtonBackgroundColor});
+                ${_styledcomponents.iconButtonTokens.iconButtonColorHover}: ${_sdds_finai.onLightTextPrimaryHover};
+                ${_styledcomponents.iconButtonTokens.iconButtonColorActive}: ${_sdds_finai.onLightTextPrimaryActive};
             `
         },
         size: {

package/dist/styled-components/cjs/components/LinkButton/LinkButton.config.js

@@ -86,6 +86,16 @@ const config = {
                 ${_styledcomponents.linkButtonTokens.linkButtonFocusColor}: ${_sdds_finai.surfaceAccent};
                 ${_styledcomponents.linkButtonTokens.linkButtonTextColorHover}: ${_sdds_finai.textInfoHover};
                 ${_styledcomponents.linkButtonTokens.linkButtonTextColorActive}: ${_sdds_finai.textInfoActive};
+            `,
+            gradient: (0, _styledcomponents.css)`
+                ${_styledcomponents.linkButtonTokens.linkButtonIconColor}: ${_sdds_finai.textAccentGradient};
+                ${_styledcomponents.linkButtonTokens.linkButtonTextColor}: ${_sdds_finai.textAccentGradient};
+                ${_styledcomponents.linkButtonTokens.linkButtonBackgroundColor}: ${_sdds_finai.surfaceClear};
+                ${_styledcomponents.linkButtonTokens.linkButtonIconColorHover}: ${_sdds_finai.textAccentGradient};
+                ${_styledcomponents.linkButtonTokens.linkButtonIconColorActive}: ${_sdds_finai.textAccentGradient};
+                ${_styledcomponents.linkButtonTokens.linkButtonFocusColor}: ${_sdds_finai.surfaceAccent};
+                ${_styledcomponents.linkButtonTokens.linkButtonTextColorHover}: ${_sdds_finai.textAccentGradient};
+                ${_styledcomponents.linkButtonTokens.linkButtonTextColorActive}: ${_sdds_finai.textAccentGradient};
             `
         },
         size: {

package/dist/styled-components/cjs/components/LinkButton/LinkButton.js

@@ -2,13 +2,92 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-Object.defineProperty(exports, "LinkButton", {
-    enumerable: true,
-    get: function() {
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get GradientLinkButton () {
+        return GradientLinkButton;
+    },
+    get LinkButton () {
         return LinkButton;
     }
 });
-const _styledcomponents = require("@salutejs/plasma-new-hope/styled-components");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _styledcomponents = /*#__PURE__*/ _interop_require_default(require("styled-components"));
+const _styledcomponents1 = require("@salutejs/plasma-new-hope/styled-components");
 const _LinkButtonconfig = require("./LinkButton.config");
-const mergedConfig = (0, _styledcomponents.mergeConfig)(_styledcomponents.linkButtonConfig, _LinkButtonconfig.config);
-const LinkButton = (0, _styledcomponents.component)(mergedConfig);
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const mergedConfig = (0, _styledcomponents1.mergeConfig)(_styledcomponents1.linkButtonConfig, _LinkButtonconfig.config);
+const LinkButtonComponent = (0, _styledcomponents1.component)(mergedConfig);
+const GradientLinkButton = (0, _styledcomponents.default)(LinkButtonComponent).withConfig({
+    displayName: "LinkButton__GradientLinkButton",
+    componentId: "sc-f0d786c8-0"
+})([
+    `& .sdds-core-text-node{background:var(`,
+    `);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;}&:hover .sdds-core-text-node{background:var(`,
+    `);background-clip:text;-webkit-background-clip:text;}&:active .sdds-core-text-node{background:var(`,
+    `);background-clip:text;-webkit-background-clip:text;}`
+], _styledcomponents1.linkButtonTokens.linkButtonTextColor, _styledcomponents1.linkButtonTokens.linkButtonTextColor, _styledcomponents1.linkButtonTokens.linkButtonTextColor);
+const LinkButton = /*#__PURE__*/ (0, _react.forwardRef)(({ view, ...rest }, ref)=>{
+    if (view === 'gradient') {
+        return /*#__PURE__*/ _react.default.createElement(GradientLinkButton, {
+            ref: ref,
+            view: view,
+            ...rest
+        });
+    }
+    return /*#__PURE__*/ _react.default.createElement(LinkButtonComponent, {
+        ref: ref,
+        view: view,
+        ...rest
+    });
+});

package/dist/styled-components/cjs/components/Notification/index.js

@@ -20,6 +20,9 @@ _export(exports, {
     },
     get closeNotification () {
         return _styledcomponents.closeNotification;
+    },
+    get useNotifications () {
+        return _styledcomponents.useNotifications;
     }
 });
 const _Notification = require("./Notification");