@alfalab/core-components 20.7.2 → 21.0.0

package/modal/modern/responsive.js

@@ -12,7 +12,7 @@ import './components/content/Component.js';
 import './components/content/Component.desktop.js';
 import './components/footer/Component.js';
 import './components/footer/Component.desktop.js';
-import './transitions.module-f3ebeb8b.js';
+import './transitions.module-683182f2.js';
 import './Component.desktop.js';
 import './components/header/Component.mobile.js';
 import './components/content/Component.mobile.js';

package/modal/responsive.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./tslib.es6-13ac031a.js');
+require('./tslib.es6-6d6e5bf3.js');
 require('react');
 require('classnames');
 require('../base-modal');
@@ -15,7 +15,7 @@ require('./components/content/Component.desktop.js');
 require('./components/footer/Component.js');
 require('./components/footer/Component.desktop.js');
 require('./Component.desktop.js');
-require('./transitions.module-be9bcfec.js');
+require('./transitions.module-c7d97d9d.js');
 require('@alfalab/hooks');
 require('./components/header/Component.mobile.js');
 require('./components/content/Component.mobile.js');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alfalab/core-components",
-  "version": "20.7.2",
+  "version": "21.0.0",
   "license": "MIT",
   "repository": {
     "type": "git",

package/password-input/component.js

@@ -53,7 +53,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"eye":"password-input__eye_1f90h","xl":"password-input__xl_1f90h","input":"password-input__input_1f90h"};
+var styles = {"eye":"password-input__eye_ohjru","xl":"password-input__xl_ohjru","input":"password-input__input_ohjru"};
 require('./index.css');
 
 var PasswordInput = React.forwardRef(function (_a, ref) {

package/password-input/esm/component.js

@@ -44,7 +44,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"eye":"password-input__eye_1f90h","xl":"password-input__xl_1f90h","input":"password-input__input_1f90h"};
+var styles = {"eye":"password-input__eye_ohjru","xl":"password-input__xl_ohjru","input":"password-input__input_ohjru"};
 require('./index.css');
 
 var PasswordInput = forwardRef(function (_a, ref) {

package/password-input/esm/index.css

@@ -1,16 +1,16 @@
-/* hash: 1f90h */
-.password-input__eye_1f90h:last-child {
+/* hash: ohjru */
+.password-input__eye_ohjru:last-child {
     margin-right: var(--gap-s-neg);
 }
 
-.password-input__xl_1f90h .password-input__eye_1f90h:last-child {
+.password-input__xl_ohjru .password-input__eye_ohjru:last-child {
         margin-right: var(--gap-m-neg);
     }
 
-.password-input__xl_1f90h .password-input__eye_1f90h {
+.password-input__xl_ohjru .password-input__eye_ohjru {
         margin-left: var(--gap-2xs);
     }
 
-.password-input__input_1f90h::-ms-reveal {
+.password-input__input_ohjru::-ms-reveal {
     display: none;
 }

package/password-input/index.css

@@ -1,16 +1,16 @@
-/* hash: 1f90h */
-.password-input__eye_1f90h:last-child {
+/* hash: ohjru */
+.password-input__eye_ohjru:last-child {
     margin-right: var(--gap-s-neg);
 }
 
-.password-input__xl_1f90h .password-input__eye_1f90h:last-child {
+.password-input__xl_ohjru .password-input__eye_ohjru:last-child {
         margin-right: var(--gap-m-neg);
     }
 
-.password-input__xl_1f90h .password-input__eye_1f90h {
+.password-input__xl_ohjru .password-input__eye_ohjru {
         margin-left: var(--gap-2xs);
     }
 
-.password-input__input_1f90h::-ms-reveal {
+.password-input__input_ohjru::-ms-reveal {
     display: none;
 }

package/password-input/modern/component.js

@@ -5,7 +5,7 @@ import EyeOffMIcon from '@alfalab/icons-glyph/EyeOffMIcon';
 import { Input } from '../../input/modern';
 import { IconButton } from '../../icon-button/modern';
 
-var styles = {"eye":"password-input__eye_1f90h","xl":"password-input__xl_1f90h","input":"password-input__input_1f90h"};
+var styles = {"eye":"password-input__eye_ohjru","xl":"password-input__xl_ohjru","input":"password-input__input_ohjru"};
 require('./index.css');
 
 const PasswordInput = forwardRef(({ onPasswordVisibleChange, passwordVisible, disabled, colors, rightAddons, size = 's', className, ...restProps }, ref) => {

package/password-input/modern/index.css

@@ -1,16 +1,16 @@
-/* hash: 1f90h */
-.password-input__eye_1f90h:last-child {
+/* hash: ohjru */
+.password-input__eye_ohjru:last-child {
     margin-right: var(--gap-s-neg);
 }
 
-.password-input__xl_1f90h .password-input__eye_1f90h:last-child {
+.password-input__xl_ohjru .password-input__eye_ohjru:last-child {
         margin-right: var(--gap-m-neg);
     }
 
-.password-input__xl_1f90h .password-input__eye_1f90h {
+.password-input__xl_ohjru .password-input__eye_ohjru {
         margin-left: var(--gap-2xs);
     }
 
-.password-input__input_1f90h::-ms-reveal {
+.password-input__input_ohjru::-ms-reveal {
     display: none;
 }

package/picker-button/{Component-8a497560.js → Component-bc62e4c2.js}

@@ -48,7 +48,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"iconContainer":"picker-button__iconContainer_92d9n","open":"picker-button__open_92d9n"};
+var styles = {"iconContainer":"picker-button__iconContainer_1qq3d","open":"picker-button__open_1qq3d"};
 require('./field/index.css');
 
 var Field = function (_a) {

package/picker-button/Component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var field_Component = require('./Component-8a497560.js');
+var field_Component = require('./Component-bc62e4c2.js');
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsSelect = require('../select');
@@ -13,7 +13,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"container":"picker-button__container_unhb2"};
+var styles = {"container":"picker-button__container_vu14x"};
 require('./index.css');
 
 var PickerButton = React.forwardRef(function (_a, ref) {

package/picker-button/esm/{Component-a0f8bf33.js → Component-7bcce42b.js}

@@ -43,7 +43,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"iconContainer":"picker-button__iconContainer_92d9n","open":"picker-button__open_92d9n"};
+var styles = {"iconContainer":"picker-button__iconContainer_1qq3d","open":"picker-button__open_1qq3d"};
 require('./field/index.css');
 
 var Field = function (_a) {

package/picker-button/esm/Component.js

@@ -3,10 +3,10 @@ import cn from 'classnames';
 import '../../button/esm';
 import '@alfalab/icons-classic/ArrowDownMIcon';
 import '@alfalab/icons-classic/ArrowDownSIcon';
-import { _ as __rest, a as __assign, F as Field } from './Component-a0f8bf33.js';
+import { _ as __rest, a as __assign, F as Field } from './Component-7bcce42b.js';
 import { BaseSelect, OptionsList, Optgroup, Option } from '../../select/esm';
 
-var styles = {"container":"picker-button__container_unhb2"};
+var styles = {"container":"picker-button__container_vu14x"};
 require('./index.css');
 
 var PickerButton = forwardRef(function (_a, ref) {

package/picker-button/esm/field/Component.js

@@ -3,4 +3,4 @@ import 'classnames';
 import '../../../button/esm';
 import '@alfalab/icons-classic/ArrowDownMIcon';
 import '@alfalab/icons-classic/ArrowDownSIcon';
-export { F as Field } from '../Component-a0f8bf33.js';
+export { F as Field } from '../Component-7bcce42b.js';

package/picker-button/esm/field/index.css

@@ -1,4 +1,4 @@
-/* hash: 92d9n */
+/* hash: 1qq3d */
 :root {
 
     /* Hard */
@@ -10,10 +10,10 @@
 :root {
     --arrow-transform: rotate(180deg);
 }
-.picker-button__iconContainer_92d9n {
+.picker-button__iconContainer_1qq3d {
     display: flex;
     transition: transform 0.15s ease-in-out;
 }
-.picker-button__open_92d9n {
+.picker-button__open_1qq3d {
     transform: var(--arrow-transform);
 }

package/picker-button/esm/field/index.d.ts

@@ -1 +1 @@
-export * from "../Component-a0f8bf33";
+export * from "../Component-7bcce42b";

package/picker-button/esm/field/index.js

@@ -3,4 +3,4 @@ import 'classnames';
 import '../../../button/esm';
 import '@alfalab/icons-classic/ArrowDownMIcon';
 import '@alfalab/icons-classic/ArrowDownSIcon';
-export { F as Field } from '../Component-a0f8bf33.js';
+export { F as Field } from '../Component-7bcce42b.js';

package/picker-button/esm/index.css

@@ -1,4 +1,4 @@
-/* hash: unhb2 */
-.picker-button__container_unhb2 {
+/* hash: vu14x */
+.picker-button__container_vu14x {
     min-width: auto;
 }

package/picker-button/esm/index.js

@@ -3,6 +3,6 @@ import 'classnames';
 import '../../button/esm';
 import '@alfalab/icons-classic/ArrowDownMIcon';
 import '@alfalab/icons-classic/ArrowDownSIcon';
-import './Component-a0f8bf33.js';
+import './Component-7bcce42b.js';
 import '../../select/esm';
 export { PickerButton } from './Component.js';

package/picker-button/field/Component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var field_Component = require('../Component-8a497560.js');
+var field_Component = require('../Component-bc62e4c2.js');
 require('react');
 require('classnames');
 require('../../button');

package/picker-button/field/index.css

@@ -1,4 +1,4 @@
-/* hash: 92d9n */
+/* hash: 1qq3d */
 :root {
 
     /* Hard */
@@ -10,10 +10,10 @@
 :root {
     --arrow-transform: rotate(180deg);
 }
-.picker-button__iconContainer_92d9n {
+.picker-button__iconContainer_1qq3d {
     display: flex;
     transition: transform 0.15s ease-in-out;
 }
-.picker-button__open_92d9n {
+.picker-button__open_1qq3d {
     transform: var(--arrow-transform);
 }

package/picker-button/field/index.d.ts

@@ -1 +1 @@
-export * from "../Component-8a497560";
+export * from "../Component-bc62e4c2";

package/picker-button/field/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var field_Component = require('../Component-8a497560.js');
+var field_Component = require('../Component-bc62e4c2.js');
 require('react');
 require('classnames');
 require('../../button');

package/picker-button/index.css

@@ -1,4 +1,4 @@
-/* hash: unhb2 */
-.picker-button__container_unhb2 {
+/* hash: vu14x */
+.picker-button__container_vu14x {
     min-width: auto;
 }

package/picker-button/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./Component-8a497560.js');
+require('./Component-bc62e4c2.js');
 require('react');
 require('classnames');
 require('../select');

package/picker-button/modern/Component.js

@@ -6,7 +6,7 @@ import { OptionsList, Optgroup, Option, BaseSelect } from '../../select/modern';
 import '../../button/modern';
 import { Field } from './field/Component.js';
 
-var styles = {"container":"picker-button__container_unhb2"};
+var styles = {"container":"picker-button__container_vu14x"};
 require('./index.css');
 
 const PickerButton = forwardRef(({ OptionsList: OptionsList$1 = OptionsList, Optgroup: Optgroup$1 = Optgroup, Option: Option$1 = Option, view, loading, size = 'm', className, leftAddons, ...restProps }, ref) => (React.createElement(BaseSelect, Object.assign({}, restProps, { ref: ref, Option: Option$1, Field: Field, size: size === 'm' ? 'm' : 's', fieldProps: {

package/picker-button/modern/field/Component.js

@@ -4,7 +4,7 @@ import { ArrowDownMIcon } from '@alfalab/icons-classic/ArrowDownMIcon';
 import { ArrowDownSIcon } from '@alfalab/icons-classic/ArrowDownSIcon';
 import { Button } from '../../../button/modern';
 
-var styles = {"iconContainer":"picker-button__iconContainer_92d9n","open":"picker-button__open_92d9n"};
+var styles = {"iconContainer":"picker-button__iconContainer_1qq3d","open":"picker-button__open_1qq3d"};
 require('./index.css');
 
 const Field = ({ buttonSize = 'm', view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }) => {

package/picker-button/modern/field/index.css

@@ -1,4 +1,4 @@
-/* hash: 92d9n */
+/* hash: 1qq3d */
 :root {
 
     /* Hard */
@@ -10,10 +10,10 @@
 :root {
     --arrow-transform: rotate(180deg);
 }
-.picker-button__iconContainer_92d9n {
+.picker-button__iconContainer_1qq3d {
     display: flex;
     transition: transform 0.15s ease-in-out;
 }
-.picker-button__open_92d9n {
+.picker-button__open_1qq3d {
     transform: var(--arrow-transform);
 }

package/picker-button/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: unhb2 */
-.picker-button__container_unhb2 {
+/* hash: vu14x */
+.picker-button__container_vu14x {
     min-width: auto;
 }

package/select/Component.js

@@ -1,12 +1,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-8e873691.js');
+var tslib_es6 = require('./tslib.es6-d00003ef.js');
 var React = require('react');
 require('classnames');
 require('@alfalab/hooks');
 require('../form-control');
 require('./utils.js');
 var components_field_Component = require('./components/field/Component.js');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
 var components_arrow_Component = require('./components/arrow/Component.js');
 require('react-merge-refs');
 var components_optgroup_Component = require('./components/optgroup/Component.js');

package/select/components/arrow/Component.js

@@ -2,19 +2,20 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var cn = require('classnames');
+var ChevronDownMIcon = require('@alfalab/icons-glyph/ChevronDownMIcon');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"arrow":"select__arrow_14ac7","open":"select__open_14ac7"};
+var styles = {"arrow":"select__arrow_1pfzl","open":"select__open_1pfzl"};
 require('./index.css');
 
 var Arrow = function (_a) {
     var _b;
     var open = _a.open, className = _a.className;
-    return (React__default['default'].createElement("span", { className: cn__default['default'](styles.arrow, className, (_b = {}, _b[styles.open] = open, _b)) }));
+    return (React__default['default'].createElement(ChevronDownMIcon.ChevronDownMIcon, { className: cn__default['default'](styles.arrow, className, (_b = {}, _b[styles.open] = open, _b)) }));
 };
 
 exports.Arrow = Arrow;

package/select/components/arrow/index.css

@@ -1,4 +1,7 @@
-/* hash: 14ac7 */
+/* hash: 1pfzl */
+:root {
+    --color-light-graphic-primary: #0b1f35;
+}
 :root {
 
     /* Hard */
@@ -11,7 +14,7 @@
     --arrow-transform: rotate(180deg);
 }
 :root {
-    --select-arrow-background: url('https://alfabank.st/icons/glyph_chevron-down_m.svg');
+    --select-arrow-color: var(--color-light-graphic-primary);
 
     /* options list */
 
@@ -21,16 +24,14 @@
 
     /* optgroup */
 }
-.select__arrow_14ac7 {
+.select__arrow_1pfzl {
     display: block;
     width: 24px;
     height: 24px;
+    color: var(--select-arrow-color);
 
-    background: var(--select-arrow-background);
-    background-size: cover;
-    background-position: center;
     transition: transform 0.15s ease-in-out, opacity 0.2s ease;
 }
-.select__open_14ac7 {
+.select__open_1pfzl {
     transform: var(--arrow-transform);
 }

package/select/components/arrow/index.js

@@ -2,6 +2,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 require('react');
 require('classnames');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
 var components_arrow_Component = require('./Component.js');
 
 

package/select/components/base-select/Component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-8e873691.js');
+var tslib_es6 = require('../../tslib.es6-d00003ef.js');
 var React = require('react');
 var cn = require('classnames');
 var utils = require('../../utils.js');
@@ -21,7 +21,7 @@ var getDataTestId = function (dataTestId, element) {
     return dataTestId ? "" + dataTestId + elementPart : undefined;
 };
 
-var styles = {"component":"select__component_6wx3t","popoverInner":"select__popoverInner_6wx3t","optionsList":"select__optionsList_6wx3t","nativeSelect":"select__nativeSelect_6wx3t","block":"select__block_6wx3t"};
+var styles = {"component":"select__component_jdx2x","popoverInner":"select__popoverInner_jdx2x","optionsList":"select__optionsList_jdx2x","nativeSelect":"select__nativeSelect_jdx2x","block":"select__block_jdx2x"};
 require('./index.css');
 
 var BaseSelect = React.forwardRef(function (_a, ref) {

package/select/components/base-select/index.css

@@ -1,4 +1,4 @@
-/* hash: 6wx3t */
+/* hash: jdx2x */
 :root {
     --color-light-bg-primary: #fff;
 }
@@ -28,12 +28,12 @@
 
     /* optgroup */
 }
-.select__component_6wx3t {
+.select__component_jdx2x {
     width: max-content;
     position: relative;
     outline: 0;
 }
-.select__popoverInner_6wx3t {
+.select__popoverInner_jdx2x {
     padding-top: var(--select-options-list-offset);
     padding-bottom: var(--select-options-list-offset);
     box-shadow: none;
@@ -42,7 +42,7 @@
     border-radius: 0;
     position: relative;
 }
-.select__optionsList_6wx3t {
+.select__optionsList_jdx2x {
     padding-top: var(--select-options-list-top-padding);
     padding-bottom: var(--select-options-list-bottom-padding);
     box-shadow: var(--select-options-list-box-shadow);
@@ -51,7 +51,7 @@
     overflow: hidden;
     will-change: transform;
 }
-.select__nativeSelect_6wx3t {
+.select__nativeSelect_jdx2x {
     opacity: 0;
     overflow: hidden;
     position: absolute;
@@ -65,12 +65,12 @@
     cursor: pointer;
     z-index: 1;
 }
-.select__block_6wx3t {
+.select__block_jdx2x {
     width: 100%;
 }
 /* width: max-content; fix for IE */
 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
-    .select__component_6wx3t {
+    .select__component_jdx2x {
         float: left;
         clear: left;
     }

package/select/components/base-select/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../tslib.es6-8e873691.js');
+require('../../tslib.es6-d00003ef.js');
 require('react');
 require('classnames');
 require('../../utils.js');

package/select/components/checkmark/Component.js

@@ -8,7 +8,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"checkmark":"select__checkmark_6z46i","selected":"select__selected_6z46i"};
+var styles = {"checkmark":"select__checkmark_1kdq1","selected":"select__selected_1kdq1"};
 require('./index.css');
 
 var Checkmark = function (_a) {

package/select/components/checkmark/index.css

@@ -1,4 +1,4 @@
-/* hash: 6z46i */
+/* hash: 1kdq1 */
 :root {
     --color-light-graphic-primary: #0b1f35;
 }
@@ -33,7 +33,7 @@
 
     /* optgroup */
 }
-.select__checkmark_6z46i {
+.select__checkmark_1kdq1 {
     display: flex;
     align-items: center;
     justify-content: center;
@@ -47,6 +47,6 @@
     width: var(--select-checkmark-size);
     height: var(--select-checkmark-size);
 }
-.select__selected_6z46i {
+.select__selected_1kdq1 {
     opacity: 1;
 }

package/select/components/field/Component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-8e873691.js');
+var tslib_es6 = require('../../tslib.es6-d00003ef.js');
 var React = require('react');
 var cn = require('classnames');
 var hooks = require('@alfalab/hooks');
@@ -12,7 +12,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"component":"select__component_13cpz","field":"select__field_13cpz","disabled":"select__disabled_13cpz","arrow":"select__arrow_13cpz","placeholder":"select__placeholder_13cpz","contentWrapper":"select__contentWrapper_13cpz","value":"select__value_13cpz","focusVisible":"select__focusVisible_13cpz"};
+var styles = {"component":"select__component_1ozzk","field":"select__field_1ozzk","disabled":"select__disabled_1ozzk","arrow":"select__arrow_1ozzk","placeholder":"select__placeholder_1ozzk","contentWrapper":"select__contentWrapper_1ozzk","value":"select__value_1ozzk","focusVisible":"select__focusVisible_1ozzk"};
 require('./index.css');
 
 var Field = function (_a) {

package/select/components/field/index.css

@@ -1,4 +1,4 @@
-/* hash: 13cpz */
+/* hash: 1ozzk */
 :root {
     --color-light-border-link: #007aff;
     --color-light-text-secondary: #546272;
@@ -26,24 +26,24 @@
 
     /* optgroup */
 }
-.select__component_13cpz {
+.select__component_1ozzk {
     width: 100%;
     outline: none;
 }
-.select__field_13cpz:not(.select__disabled_13cpz) {
+.select__field_1ozzk:not(.select__disabled_1ozzk) {
     cursor: pointer
 }
-.select__field_13cpz:not(.select__disabled_13cpz):hover .select__arrow_13cpz {
+.select__field_1ozzk:not(.select__disabled_1ozzk):hover .select__arrow_1ozzk {
             opacity: var(--select-arrow-hover-opacity);
         }
-.select__disabled_13cpz {
+.select__disabled_1ozzk {
     cursor: var(--disabled-cursor);
 }
 /* TODO: Заюзать переменные из инпута */
-.select__placeholder_13cpz {
+.select__placeholder_1ozzk {
     color: var(--color-light-text-secondary);
 }
-.select__contentWrapper_13cpz {
+.select__contentWrapper_1ozzk {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -53,12 +53,12 @@
     overflow: hidden;
     width: 100%;
 }
-.select__value_13cpz {
+.select__value_1ozzk {
     overflow: hidden;
     text-overflow: ellipsis;
     text-align: left;
 }
-.select__focusVisible_13cpz {
+.select__focusVisible_1ozzk {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }