@salutejs/plasma-new-hope 0.344.0-canary.2397.20460422822.0 → 0.344.0-canary.2397.20463641544.0

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

@@ -91,7 +91,7 @@ var mergedConfig = (0, _engines.mergeConfig)(_Spinner.spinnerConfig);
 var Spinner = (0, _engines.component)(mergedConfig);
 var ButtonText = _styledcomponents.default.span.withConfig({
     displayName: "Button.styles__ButtonText",
-    componentId: "sc-b7c1e7a-0"
+    componentId: "sc-b5ceadd3-0"
 })([
     "min-width:4ch;&.",
     "{flex-grow:2;text-align:start;}color:var(",
@@ -100,7 +100,7 @@ var ButtonText = _styledcomponents.default.span.withConfig({
 ], String(_Buttontokens.classes.contentRelaxed), _Buttontokens.tokens.buttonTextColor, (0, _mixins.applyEllipsis)());
 var StyledAdditionalContent = _styledcomponents.default.div.withConfig({
     displayName: "Button.styles__StyledAdditionalContent",
-    componentId: "sc-b7c1e7a-1"
+    componentId: "sc-b5ceadd3-1"
 })([
     "display:flex;align-items:center;margin:var(",
     ");&.",
@@ -110,7 +110,7 @@ var StyledAdditionalContent = _styledcomponents.default.div.withConfig({
 ], _Buttontokens.tokens.buttonAdditionalContentMargin, String(_Buttontokens.classes.contentRelaxed), _Buttontokens.classes.buttonHasValue, _Buttontokens.tokens.buttonAdditionalContentMarginRightWidthValue);
 var ButtonValue = _styledcomponents.default.span.withConfig({
     displayName: "Button.styles__ButtonValue",
-    componentId: "sc-b7c1e7a-2"
+    componentId: "sc-b5ceadd3-2"
 })([
     "color:var(",
     ");margin:var(",
@@ -119,7 +119,7 @@ var ButtonValue = _styledcomponents.default.span.withConfig({
 ], _Buttontokens.tokens.buttonValueColor, _Buttontokens.tokens.buttonValueMargin, (0, _mixins.applyEllipsis)());
 var LoadWrap = _styledcomponents.default.div.withConfig({
     displayName: "Button.styles__LoadWrap",
-    componentId: "sc-b7c1e7a-3"
+    componentId: "sc-b5ceadd3-3"
 })([
     "opacity:",
     ";display:flex;align-items:inherit;justify-content:",
@@ -133,13 +133,13 @@ var LoadWrap = _styledcomponents.default.div.withConfig({
 });
 var Loader = _styledcomponents.default.div.withConfig({
     displayName: "Button.styles__Loader",
-    componentId: "sc-b7c1e7a-4"
+    componentId: "sc-b5ceadd3-4"
 })([
     "position:absolute;"
 ]);
 var StyledSpinner = (0, _styledcomponents.default)(Spinner).withConfig({
     displayName: "Button.styles__StyledSpinner",
-    componentId: "sc-b7c1e7a-5"
+    componentId: "sc-b5ceadd3-5"
 })([
     "",
     ":var(",
@@ -149,7 +149,7 @@ var StyledSpinner = (0, _styledcomponents.default)(Spinner).withConfig({
 ], _Spinner.spinnerTokens.size, _Buttontokens.tokens.buttonSpinnerSize, _Spinner.spinnerTokens.color, _Buttontokens.tokens.buttonSpinnerColor);
 var StyledContentLeft = _styledcomponents.default.div.withConfig({
     displayName: "Button.styles__StyledContentLeft",
-    componentId: "sc-b7c1e7a-6"
+    componentId: "sc-b5ceadd3-6"
 })([
     "display:flex;align-self:var(",
     ");color:var(",
@@ -161,7 +161,7 @@ var StyledContentLeft = _styledcomponents.default.div.withConfig({
 });
 var StyledContentRight = _styledcomponents.default.div.withConfig({
     displayName: "Button.styles__StyledContentRight",
-    componentId: "sc-b7c1e7a-7"
+    componentId: "sc-b5ceadd3-7"
 })([
     "display:flex;align-self:var(",
     ");color:var(",
@@ -176,9 +176,9 @@ var base = (0, _styledcomponents.css)([
     "{width:var(",
     ");padding:0;}"
 ], String(_Buttontokens.classes.buttonSquare), _Buttontokens.tokens.buttonHeight);
-var baseContent = "\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    box-sizing: border-box;\n    justify-content: center;\n\n    appearance: none;\n    border: none;\n    cursor: pointer;\n    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n    a& {\n        text-decoration: none;\n    }\n\n    /* NOTE:\n        --plasma_computed-btn-br-radius is defined in Button.tsx\n    */\n    --plasma_private-btn-br: var(--plasma_computed-btn-br);\n    border-radius: var(--plasma_private-btn-br);\n\n    &&.".concat(String(_Buttontokens.classes.buttonSquare), " {\n        width: var(").concat(_Buttontokens.tokens.buttonHeight, ");\n        padding: 0;\n    }\n\n    color: var(").concat(_Buttontokens.tokens.buttonColor, ");\n    background: var(").concat(_Buttontokens.tokens.buttonBackgroundColor, ");\n\n    :hover {\n        color: var(").concat(_Buttontokens.tokens.buttonColorHover, ", var(").concat(_Buttontokens.tokens.buttonColor, "));\n        background: var(").concat(_Buttontokens.tokens.buttonBackgroundColorHover, ", var(").concat(_Buttontokens.tokens.buttonBackgroundColor, "));\n\n        scale: var(").concat(_Buttontokens.tokens.buttonScaleHover, ");\n    }\n\n    :active {\n        color: var(").concat(_Buttontokens.tokens.buttonColorActive, ", var(").concat(_Buttontokens.tokens.buttonColor, "));\n        background: var(").concat(_Buttontokens.tokens.buttonBackgroundColorActive, ", var(").concat(_Buttontokens.tokens.buttonBackgroundColor, "));\n\n        scale: var(").concat(_Buttontokens.tokens.buttonScaleActive, ");\n    }\n\n    height: var(").concat(_Buttontokens.tokens.buttonHeight, ");\n    width: var(").concat(_Buttontokens.tokens.buttonWidth, ");\n\n    /* TODO: #714 move these calc's to plasma-mapping | ds-generator and add Math.round() */\n    padding: 0 var(").concat(_Buttontokens.tokens.buttonPadding, ", calc(var(").concat(_Buttontokens.tokens.buttonHeight, ") * 1.618 / 4));\n\n    font-family: var(").concat(_Buttontokens.tokens.buttonFontFamily, ");\n    font-size: var(").concat(_Buttontokens.tokens.buttonFontSize, ");\n    font-style: var(").concat(_Buttontokens.tokens.buttonFontStyle, ");\n    font-weight: var(").concat(_Buttontokens.tokens.buttonFontWeight, ");\n    letter-spacing: var(").concat(_Buttontokens.tokens.buttonLetterSpacing, ");\n    line-height: var(").concat(_Buttontokens.tokens.buttonLineHeight, ");\n\n    /* TODO: #710 make it token API ? */\n    --plasma_private-btn-outline-size: var(--plasma-button-outline-size, 0.0625rem);\n\n    :focus {\n        outline: none;\n    }\n\n    ").concat((0, _mixins.addFocus)({
+var baseContent = "\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    box-sizing: border-box;\n    justify-content: center;\n\n    appearance: none;\n    border: none;\n    cursor: pointer;\n    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n    a& {\n        text-decoration: none;\n    }\n\n    /* NOTE:\n        --plasma_computed-btn-br-radius is defined in Button.tsx\n    */\n    --plasma_private-btn-br: var(--plasma_computed-btn-br);\n    border-radius: var(--plasma_private-btn-br);\n\n    &&.".concat(String(_Buttontokens.classes.buttonSquare), " {\n        width: var(").concat(_Buttontokens.tokens.buttonHeight, ");\n        padding: 0;\n    }\n\n    color: var(").concat(_Buttontokens.tokens.buttonColor, ");\n    background: var(").concat(_Buttontokens.tokens.buttonBackgroundColor, ");\n\n    @media (hover: hover) and (pointer: fine) {\n        :hover {\n            color: var(").concat(_Buttontokens.tokens.buttonColorHover, ", var(").concat(_Buttontokens.tokens.buttonColor, "));\n            background: var(").concat(_Buttontokens.tokens.buttonBackgroundColorHover, ", var(").concat(_Buttontokens.tokens.buttonBackgroundColor, "));\n\n            scale: var(").concat(_Buttontokens.tokens.buttonScaleHover, ");\n        }\n    }\n\n    :active {\n        color: var(").concat(_Buttontokens.tokens.buttonColorActive, ", var(").concat(_Buttontokens.tokens.buttonColor, "));\n        background: var(").concat(_Buttontokens.tokens.buttonBackgroundColorActive, ", var(").concat(_Buttontokens.tokens.buttonBackgroundColor, "));\n\n        scale: var(").concat(_Buttontokens.tokens.buttonScaleActive, ");\n    }\n\n    height: var(").concat(_Buttontokens.tokens.buttonHeight, ");\n    width: var(").concat(_Buttontokens.tokens.buttonWidth, ");\n\n    /* TODO: #714 move these calc's to plasma-mapping | ds-generator and add Math.round() */\n    padding: 0 var(").concat(_Buttontokens.tokens.buttonPadding, ", calc(var(").concat(_Buttontokens.tokens.buttonHeight, ") * 1.618 / 4));\n\n    font-family: var(").concat(_Buttontokens.tokens.buttonFontFamily, ");\n    font-size: var(").concat(_Buttontokens.tokens.buttonFontSize, ");\n    font-style: var(").concat(_Buttontokens.tokens.buttonFontStyle, ");\n    font-weight: var(").concat(_Buttontokens.tokens.buttonFontWeight, ");\n    letter-spacing: var(").concat(_Buttontokens.tokens.buttonLetterSpacing, ");\n    line-height: var(").concat(_Buttontokens.tokens.buttonLineHeight, ");\n\n    /* TODO: #710 make it token API ? */\n    --plasma_private-btn-outline-size: var(--plasma-button-outline-size, 0.0625rem);\n\n    :focus-visible {\n        outline: none;\n    }\n\n    ").concat((0, _mixins.addFocus)({
     outlineOffset: '-0.125rem',
     outlineSize: 'var(--plasma_private-btn-outline-size)',
     outlineRadius: 'calc(0.125rem + var(--plasma_private-btn-br))',
     outlineColor: "var(".concat(_Buttontokens.tokens.buttonFocusColor, ")")
-}), "\n\n    &[disabled] {\n        opacity: var(").concat(_Buttontokens.tokens.buttonDisabledOpacity, ");\n        cursor: not-allowed;\n\n        :hover,\n        :active {\n            scale: none;\n\n            color: var(").concat(_Buttontokens.tokens.buttonColor, ");\n            background: var(").concat(_Buttontokens.tokens.buttonBackgroundColor, ");\n        }\n    }\n\n    &.").concat(_Buttontokens.classes.fixedStretching, " {\n        width: var(").concat(_Buttontokens.tokens.buttonWidth, ");\n    }\n    &.").concat(_Buttontokens.classes.filledStretching, " {\n        width: 100%;\n    }\n    &.").concat(_Buttontokens.classes.autoStretching, " {\n        width: fit-content;\n    }\n");
+}), "\n\n    &[disabled] {\n        opacity: var(").concat(_Buttontokens.tokens.buttonDisabledOpacity, ");\n        cursor: not-allowed;\n\n        @media (hover: hover) and (pointer: fine) {\n            :hover,\n            :active {\n                scale: none;\n\n                color: var(").concat(_Buttontokens.tokens.buttonColor, ");\n                background: var(").concat(_Buttontokens.tokens.buttonBackgroundColor, ");\n            }\n        }\n    }\n\n    &.").concat(_Buttontokens.classes.fixedStretching, " {\n        width: var(").concat(_Buttontokens.tokens.buttonWidth, ");\n    }\n    &.").concat(_Buttontokens.classes.filledStretching, " {\n        width: 100%;\n    }\n    &.").concat(_Buttontokens.classes.autoStretching, " {\n        width: fit-content;\n    }\n");

package/dist/styled-components/cjs/components/Button/variations/_focused/base.js

@@ -12,7 +12,7 @@ var _styledcomponents = require("styled-components");
 var _Buttontokens = require("../../Button.tokens");
 var _mixins = require("../../../../mixins");
 var base = (0, _styledcomponents.css)([
-    ":focus{outline:none;}",
+    ":focus{outline:none;}:focus-visible{outline:none;}",
     ""
 ], (0, _mixins.addFocus)({
     outlineOffset: '-0.125rem',

package/dist/styled-components/cjs/components/Button/variations/_view/base.js

@@ -15,12 +15,12 @@ var base = (0, _styledcomponents.css)([
     ");background:var(",
     ");&.",
     "{background:var(",
-    ");}:hover{color:var(",
+    ");}@media (hover:hover) and (pointer:fine){:hover{color:var(",
     ",var(",
     "));background:var(",
     ",var(",
     "));scale:var(",
-    ");}:active{color:var(",
+    ");}}:active{color:var(",
     ",var(",
     "));background:var(",
     ",var(",

package/dist/styled-components/cjs/examples/components/Combobox/Combobox.js

@@ -1,16 +1 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "Combobox", {
-    enumerable: true,
-    get: function() {
-        return Combobox;
-    }
-});
-var _engines = require("../../../engines");
-var _ = require("../../..");
-var _Comboboxconfig = require("./Combobox.config");
-var mergedConfig = (0, _engines.mergeConfig)(_.comboboxNewConfig, _Comboboxconfig.config);
-var ComboboxComponent = (0, _engines.component)(mergedConfig);
-var Combobox = ComboboxComponent;

package/dist/styled-components/cjs/examples/components/Range/Range.clear.config.js

@@ -48,7 +48,7 @@ var config = {
                 ":var(--text-positive);",
                 ":var(--text-negative);",
                 ":var(--text-accent);",
-                ":var(--text-tertiary);",
+                ":var(--text-secondary);",
                 ":var(--text-tertiary);",
                 ":var(--text-tertiary);",
                 ":var(--text-accent);",

package/dist/styled-components/es/components/Button/Button.styles.js

@@ -9,7 +9,7 @@ var mergedConfig = mergeConfig(spinnerConfig);
 var Spinner = component(mergedConfig);
 export var ButtonText = styled.span.withConfig({
     displayName: "Button.styles__ButtonText",
-    componentId: "sc-b7c1e7a-0"
+    componentId: "sc-b5ceadd3-0"
 })([
     "min-width:4ch;&.",
     "{flex-grow:2;text-align:start;}color:var(",
@@ -18,7 +18,7 @@ export var ButtonText = styled.span.withConfig({
 ], String(classes.contentRelaxed), tokens.buttonTextColor, applyEllipsis());
 export var StyledAdditionalContent = styled.div.withConfig({
     displayName: "Button.styles__StyledAdditionalContent",
-    componentId: "sc-b7c1e7a-1"
+    componentId: "sc-b5ceadd3-1"
 })([
     "display:flex;align-items:center;margin:var(",
     ");&.",
@@ -28,7 +28,7 @@ export var StyledAdditionalContent = styled.div.withConfig({
 ], tokens.buttonAdditionalContentMargin, String(classes.contentRelaxed), classes.buttonHasValue, tokens.buttonAdditionalContentMarginRightWidthValue);
 export var ButtonValue = styled.span.withConfig({
     displayName: "Button.styles__ButtonValue",
-    componentId: "sc-b7c1e7a-2"
+    componentId: "sc-b5ceadd3-2"
 })([
     "color:var(",
     ");margin:var(",
@@ -38,7 +38,7 @@ export var ButtonValue = styled.span.withConfig({
 // TODO: #720
 export var LoadWrap = styled.div.withConfig({
     displayName: "Button.styles__LoadWrap",
-    componentId: "sc-b7c1e7a-3"
+    componentId: "sc-b5ceadd3-3"
 })([
     "opacity:",
     ";display:flex;align-items:inherit;justify-content:",
@@ -52,13 +52,13 @@ export var LoadWrap = styled.div.withConfig({
 });
 export var Loader = styled.div.withConfig({
     displayName: "Button.styles__Loader",
-    componentId: "sc-b7c1e7a-4"
+    componentId: "sc-b5ceadd3-4"
 })([
     "position:absolute;"
 ]);
 export var StyledSpinner = styled(Spinner).withConfig({
     displayName: "Button.styles__StyledSpinner",
-    componentId: "sc-b7c1e7a-5"
+    componentId: "sc-b5ceadd3-5"
 })([
     "",
     ":var(",
@@ -68,7 +68,7 @@ export var StyledSpinner = styled(Spinner).withConfig({
 ], spinnerTokens.size, tokens.buttonSpinnerSize, spinnerTokens.color, tokens.buttonSpinnerColor);
 export var StyledContentLeft = styled.div.withConfig({
     displayName: "Button.styles__StyledContentLeft",
-    componentId: "sc-b7c1e7a-6"
+    componentId: "sc-b5ceadd3-6"
 })([
     "display:flex;align-self:var(",
     ");color:var(",
@@ -80,7 +80,7 @@ export var StyledContentLeft = styled.div.withConfig({
 });
 export var StyledContentRight = styled.div.withConfig({
     displayName: "Button.styles__StyledContentRight",
-    componentId: "sc-b7c1e7a-7"
+    componentId: "sc-b5ceadd3-7"
 })([
     "display:flex;align-self:var(",
     ");color:var(",
@@ -96,9 +96,9 @@ export var base = css([
     ");padding:0;}"
 ], String(classes.buttonSquare), tokens.buttonHeight);
 // INFO: Для возможности переиспользования стилей в других компонентах
-export var baseContent = "\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    box-sizing: border-box;\n    justify-content: center;\n\n    appearance: none;\n    border: none;\n    cursor: pointer;\n    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n    a& {\n        text-decoration: none;\n    }\n\n    /* NOTE:\n        --plasma_computed-btn-br-radius is defined in Button.tsx\n    */\n    --plasma_private-btn-br: var(--plasma_computed-btn-br);\n    border-radius: var(--plasma_private-btn-br);\n\n    &&.".concat(String(classes.buttonSquare), " {\n        width: var(").concat(tokens.buttonHeight, ");\n        padding: 0;\n    }\n\n    color: var(").concat(tokens.buttonColor, ");\n    background: var(").concat(tokens.buttonBackgroundColor, ");\n\n    :hover {\n        color: var(").concat(tokens.buttonColorHover, ", var(").concat(tokens.buttonColor, "));\n        background: var(").concat(tokens.buttonBackgroundColorHover, ", var(").concat(tokens.buttonBackgroundColor, "));\n\n        scale: var(").concat(tokens.buttonScaleHover, ");\n    }\n\n    :active {\n        color: var(").concat(tokens.buttonColorActive, ", var(").concat(tokens.buttonColor, "));\n        background: var(").concat(tokens.buttonBackgroundColorActive, ", var(").concat(tokens.buttonBackgroundColor, "));\n\n        scale: var(").concat(tokens.buttonScaleActive, ");\n    }\n\n    height: var(").concat(tokens.buttonHeight, ");\n    width: var(").concat(tokens.buttonWidth, ");\n\n    /* TODO: #714 move these calc's to plasma-mapping | ds-generator and add Math.round() */\n    padding: 0 var(").concat(tokens.buttonPadding, ", calc(var(").concat(tokens.buttonHeight, ") * 1.618 / 4));\n\n    font-family: var(").concat(tokens.buttonFontFamily, ");\n    font-size: var(").concat(tokens.buttonFontSize, ");\n    font-style: var(").concat(tokens.buttonFontStyle, ");\n    font-weight: var(").concat(tokens.buttonFontWeight, ");\n    letter-spacing: var(").concat(tokens.buttonLetterSpacing, ");\n    line-height: var(").concat(tokens.buttonLineHeight, ");\n\n    /* TODO: #710 make it token API ? */\n    --plasma_private-btn-outline-size: var(--plasma-button-outline-size, 0.0625rem);\n\n    :focus {\n        outline: none;\n    }\n\n    ").concat(addFocus({
+export var baseContent = "\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    box-sizing: border-box;\n    justify-content: center;\n\n    appearance: none;\n    border: none;\n    cursor: pointer;\n    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n    a& {\n        text-decoration: none;\n    }\n\n    /* NOTE:\n        --plasma_computed-btn-br-radius is defined in Button.tsx\n    */\n    --plasma_private-btn-br: var(--plasma_computed-btn-br);\n    border-radius: var(--plasma_private-btn-br);\n\n    &&.".concat(String(classes.buttonSquare), " {\n        width: var(").concat(tokens.buttonHeight, ");\n        padding: 0;\n    }\n\n    color: var(").concat(tokens.buttonColor, ");\n    background: var(").concat(tokens.buttonBackgroundColor, ");\n\n    @media (hover: hover) and (pointer: fine) {\n        :hover {\n            color: var(").concat(tokens.buttonColorHover, ", var(").concat(tokens.buttonColor, "));\n            background: var(").concat(tokens.buttonBackgroundColorHover, ", var(").concat(tokens.buttonBackgroundColor, "));\n\n            scale: var(").concat(tokens.buttonScaleHover, ");\n        }\n    }\n\n    :active {\n        color: var(").concat(tokens.buttonColorActive, ", var(").concat(tokens.buttonColor, "));\n        background: var(").concat(tokens.buttonBackgroundColorActive, ", var(").concat(tokens.buttonBackgroundColor, "));\n\n        scale: var(").concat(tokens.buttonScaleActive, ");\n    }\n\n    height: var(").concat(tokens.buttonHeight, ");\n    width: var(").concat(tokens.buttonWidth, ");\n\n    /* TODO: #714 move these calc's to plasma-mapping | ds-generator and add Math.round() */\n    padding: 0 var(").concat(tokens.buttonPadding, ", calc(var(").concat(tokens.buttonHeight, ") * 1.618 / 4));\n\n    font-family: var(").concat(tokens.buttonFontFamily, ");\n    font-size: var(").concat(tokens.buttonFontSize, ");\n    font-style: var(").concat(tokens.buttonFontStyle, ");\n    font-weight: var(").concat(tokens.buttonFontWeight, ");\n    letter-spacing: var(").concat(tokens.buttonLetterSpacing, ");\n    line-height: var(").concat(tokens.buttonLineHeight, ");\n\n    /* TODO: #710 make it token API ? */\n    --plasma_private-btn-outline-size: var(--plasma-button-outline-size, 0.0625rem);\n\n    :focus-visible {\n        outline: none;\n    }\n\n    ").concat(addFocus({
     outlineOffset: '-0.125rem',
     outlineSize: 'var(--plasma_private-btn-outline-size)',
     outlineRadius: 'calc(0.125rem + var(--plasma_private-btn-br))',
     outlineColor: "var(".concat(tokens.buttonFocusColor, ")")
-}), "\n\n    &[disabled] {\n        opacity: var(").concat(tokens.buttonDisabledOpacity, ");\n        cursor: not-allowed;\n\n        :hover,\n        :active {\n            scale: none;\n\n            color: var(").concat(tokens.buttonColor, ");\n            background: var(").concat(tokens.buttonBackgroundColor, ");\n        }\n    }\n\n    &.").concat(classes.fixedStretching, " {\n        width: var(").concat(tokens.buttonWidth, ");\n    }\n    &.").concat(classes.filledStretching, " {\n        width: 100%;\n    }\n    &.").concat(classes.autoStretching, " {\n        width: fit-content;\n    }\n");
+}), "\n\n    &[disabled] {\n        opacity: var(").concat(tokens.buttonDisabledOpacity, ");\n        cursor: not-allowed;\n\n        @media (hover: hover) and (pointer: fine) {\n            :hover,\n            :active {\n                scale: none;\n\n                color: var(").concat(tokens.buttonColor, ");\n                background: var(").concat(tokens.buttonBackgroundColor, ");\n            }\n        }\n    }\n\n    &.").concat(classes.fixedStretching, " {\n        width: var(").concat(tokens.buttonWidth, ");\n    }\n    &.").concat(classes.filledStretching, " {\n        width: 100%;\n    }\n    &.").concat(classes.autoStretching, " {\n        width: fit-content;\n    }\n");

package/dist/styled-components/es/components/Button/variations/_focused/base.js

@@ -1,9 +1,8 @@
 import { css } from "styled-components";
 import { tokens } from "../../Button.tokens";
 import { addFocus } from "../../../../mixins";
-// TODO: focus-visible #711
 export var base = css([
-    ":focus{outline:none;}",
+    ":focus{outline:none;}:focus-visible{outline:none;}",
     ""
 ], addFocus({
     outlineOffset: '-0.125rem',

package/dist/styled-components/es/components/Button/variations/_view/base.js

@@ -5,12 +5,12 @@ export var base = css([
     ");background:var(",
     ");&.",
     "{background:var(",
-    ");}:hover{color:var(",
+    ");}@media (hover:hover) and (pointer:fine){:hover{color:var(",
     ",var(",
     "));background:var(",
     ",var(",
     "));scale:var(",
-    ");}:active{color:var(",
+    ");}}:active{color:var(",
     ",var(",
     "));background:var(",
     ",var(",

package/dist/styled-components/es/examples/components/Range/Range.clear.config.js

@@ -38,7 +38,7 @@ export var config = {
                 ":var(--text-positive);",
                 ":var(--text-negative);",
                 ":var(--text-accent);",
-                ":var(--text-tertiary);",
+                ":var(--text-secondary);",
                 ":var(--text-tertiary);",
                 ":var(--text-tertiary);",
                 ":var(--text-accent);",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salutejs/plasma-new-hope",
-  "version": "0.344.0-canary.2397.20460422822.0",
+  "version": "0.344.0-canary.2397.20463641544.0",
   "description": "Salute Design System blueprint",
   "exports": {
     ".": {
@@ -92,8 +92,8 @@
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^25.0.4",
     "@rollup/plugin-node-resolve": "^15.1.0",
-    "@salutejs/plasma-cy-utils": "0.142.0-canary.2397.20460422822.0",
-    "@salutejs/plasma-sb-utils": "0.212.0-canary.2397.20460422822.0",
+    "@salutejs/plasma-cy-utils": "0.142.0-canary.2397.20463641544.0",
+    "@salutejs/plasma-sb-utils": "0.212.0-canary.2397.20463641544.0",
     "@salutejs/plasma-themes": "0.38.0",
     "@types/lodash": "^4.14.191",
     "@types/lodash.chunk": "4.2.9",
@@ -122,7 +122,7 @@
     "@linaria/react": "5.0.3",
     "@popperjs/core": "2.11.8",
     "@salutejs/input-core": "2.1.2",
-    "@salutejs/plasma-core": "1.212.0-canary.2397.20460422822.0",
+    "@salutejs/plasma-core": "1.212.0-canary.2397.20463641544.0",
     "@salutejs/react-maskinput": "3.3.2",
     "@tanstack/react-table": "8.21.2",
     "@tanstack/react-virtual": "3.13.2",
@@ -142,5 +142,5 @@
   "sideEffects": [
     "*.css"
   ],
-  "gitHead": "a28b5296ef319d50dcf7d518c527304ca3eeefbb"
+  "gitHead": "b8d841b1a5fa3470e63a4da2e9affb8abf17f9d7"
 }

package/types/components/Button/Button.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.styles.ts"],"names":[],"mappings":"AAaA,eAAO,MAAM,UAAU,uKAWtB,CAAC;AAEF,eAAO,MAAM,uBAAuB,qKAanC,CAAC;AAEF,eAAO,MAAM,WAAW,uKAQvB,CAAC;AAGF,eAAO,MAAM,QAAQ;oBAAgC,MAAM;gBAAc,OAAO;EAO/E,CAAC;AAEF,eAAO,MAAM,MAAM,qKAElB,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;oDAGzB,CAAC;AAEF,eAAO,MAAM,iBAAiB;uBAAmC,OAAO;EAMvE,CAAC;AAEF,eAAO,MAAM,kBAAkB;uBAAmC,OAAO;EAMxE,CAAC;AAEF,eAAO,MAAM,IAAI,0CA0BhB,CAAC;AAGF,eAAO,MAAM,WAAW,QA6FvB,CAAC"}
+{"version":3,"file":"Button.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.styles.ts"],"names":[],"mappings":"AAaA,eAAO,MAAM,UAAU,uKAWtB,CAAC;AAEF,eAAO,MAAM,uBAAuB,qKAanC,CAAC;AAEF,eAAO,MAAM,WAAW,uKAQvB,CAAC;AAGF,eAAO,MAAM,QAAQ;oBAAgC,MAAM;gBAAc,OAAO;EAO/E,CAAC;AAEF,eAAO,MAAM,MAAM,qKAElB,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;oDAGzB,CAAC;AAEF,eAAO,MAAM,iBAAiB;uBAAmC,OAAO;EAMvE,CAAC;AAEF,eAAO,MAAM,kBAAkB;uBAAmC,OAAO;EAMxE,CAAC;AAEF,eAAO,MAAM,IAAI,0CA0BhB,CAAC;AAGF,eAAO,MAAM,WAAW,QAiGvB,CAAC"}

package/types/components/Button/variations/_focused/base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/Button/variations/_focused/base.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,IAAI,0CAWhB,CAAC"}
+{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/Button/variations/_focused/base.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,0CAehB,CAAC"}

package/types/components/Button/variations/_view/base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/Button/variations/_view/base.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,0CAqBhB,CAAC"}
+{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/Button/variations/_view/base.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,0CAwBhB,CAAC"}

package/dist/css/cjs/components/Button/variations/_focused/base_1kq737e.css

@@ -1 +0,0 @@
-.b187cmzt{position:relative;}.b187cmzt:focus{outline:none;}.b187cmzt::before{content:'';position:absolute;top:-0.125rem;left:-0.125rem;right:-0.125rem;bottom:-0.125rem;z-index:1;display:block;box-sizing:content-box;border:var(--plasma_private-btn-outline-size) solid transparent;border-radius:calc(0.125rem + var(--plasma_private-btn-br));-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.b187cmzt.focus-visible:focus::before,.b187cmzt[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 var(--plasma_private-btn-outline-size) var(--plasma-button-focus-color);}

package/dist/css/cjs/components/Button/variations/_view/base_jfbpjg.css

@@ -1 +0,0 @@
-.b1ty39ru{color:var(--plasma-button-color);background:var(--plasma-button-background-color);}.b1ty39ru.button-loading{background:var(--plasma-button-loading-background-color);}.b1ty39ru:hover{color:var(--plasma-button-color-hover,var(--plasma-button-color));background:var(--plasma-button-background-color-hover,var(--plasma-button-background-color));scale:var(--plasma-button-scale-hover);}.b1ty39ru:active{color:var(--plasma-button-color-active,var(--plasma-button-color));background:var(--plasma-button-background-color-active,var(--plasma-button-background-color));scale:var(---plasma-button-scale-active);}

package/dist/css/es/components/Button/variations/_focused/base_1kq737e.css

@@ -1 +0,0 @@
-.b187cmzt{position:relative;}.b187cmzt:focus{outline:none;}.b187cmzt::before{content:'';position:absolute;top:-0.125rem;left:-0.125rem;right:-0.125rem;bottom:-0.125rem;z-index:1;display:block;box-sizing:content-box;border:var(--plasma_private-btn-outline-size) solid transparent;border-radius:calc(0.125rem + var(--plasma_private-btn-br));-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.b187cmzt.focus-visible:focus::before,.b187cmzt[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 var(--plasma_private-btn-outline-size) var(--plasma-button-focus-color);}

package/dist/css/es/components/Button/variations/_view/base_jfbpjg.css

@@ -1 +0,0 @@
-.b1ty39ru{color:var(--plasma-button-color);background:var(--plasma-button-background-color);}.b1ty39ru.button-loading{background:var(--plasma-button-loading-background-color);}.b1ty39ru:hover{color:var(--plasma-button-color-hover,var(--plasma-button-color));background:var(--plasma-button-background-color-hover,var(--plasma-button-background-color));scale:var(--plasma-button-scale-hover);}.b1ty39ru:active{color:var(--plasma-button-color-active,var(--plasma-button-color));background:var(--plasma-button-background-color-active,var(--plasma-button-background-color));scale:var(---plasma-button-scale-active);}