@alfalab/core-components-picker-button 7.5.0 → 7.6.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [7.6.0](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-picker-button@7.5.0...@alfalab/core-components-picker-button@7.6.0) (2022-03-03)
+
+
+### Features
+
+* **picker-button:** added new view and updated dropdown options ([#1013](https://github.com/alfa-laboratory/core-components/issues/1013)) ([050fb3e](https://github.com/alfa-laboratory/core-components/commit/050fb3eb6fd6dde057bbfcad5dd807d354125b63))
+
+
+
+
+
 # [7.5.0](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-picker-button@7.4.3...@alfalab/core-components-picker-button@7.5.0) (2022-03-01)
 
 

package/dist/{Component-4c462f50.d.ts → Component-6e9a8e09.d.ts}

@@ -5,7 +5,7 @@ import { ReactNode, FC, RefAttributes, AriaAttributes, FocusEvent, MouseEvent, R
 import { CSSTransitionProps } from "react-transition-group/CSSTransition";
 import { BasePlacement, VariationPlacement } from "@popperjs/core";
 import { ButtonProps } from "@alfalab/core-components-button";
-import { PickerButtonSize } from "./index";
+import { PickerButtonSize, PickerButtonVariant } from "./Component";
 declare function __extends(d: any, b: any): void;
 declare function __rest(s: any, e: any): {};
 declare function __decorate(decorators: any, target: any, key: any, desc: any, ...args: any[]): any;
@@ -869,6 +869,7 @@ declare const FormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<
 type BaseFieldProps = FieldProps;
 type FieldProps$0 = Omit<BaseFieldProps, 'size' | 'hint' | 'success' | 'error' | 'placeholder'> & ButtonProps & {
     buttonSize?: PickerButtonSize;
+    buttonVariant?: PickerButtonVariant;
 };
-declare const Field: ({ buttonSize, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }: FieldProps$0) => JSX.Element;
+declare const Field: ({ buttonSize, buttonVariant, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }: FieldProps$0) => JSX.Element;
 export { __extends, __rest, __decorate, __param, __metadata, __awaiter, __generator, __exportStar, __values, __read, __spread, __spreadArrays, __await, __asyncGenerator, __asyncDelegator, __asyncValues, __makeTemplateObject, __importStar, __importDefault, __classPrivateFieldGet, __classPrivateFieldSet, __assign, __createBinding, OptionShape, GroupShape, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps, stackingOrder, StackingContext, StackProps, Stack, PortalProps, Portal, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, FormControlProps, FormControl, Field };

package/dist/{Component-4c462f50.js → Component-6e9a8e09.js}

@@ -3,8 +3,7 @@
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsButton = require('@alfalab/core-components-button');
-var ArrowDownMIcon = require('@alfalab/icons-classic/ArrowDownMIcon');
-var ArrowDownSIcon = require('@alfalab/icons-classic/ArrowDownSIcon');
+var utils_index = require('./utils/index.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -50,17 +49,17 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"iconContainer":"picker-button__iconContainer_p0806","open":"picker-button__open_p0806"};
+var styles = {"iconContainer":"picker-button__iconContainer_h15km","open":"picker-button__open_h15km"};
 require('./field/index.css')
 
 var Field = function (_a) {
-    var _b = _a.buttonSize, buttonSize = _b === void 0 ? 'm' : _b, view = _a.view, label = _a.label, open = _a.open, multiple = _a.multiple, rightAddons = _a.rightAddons, Arrow = _a.Arrow, innerProps = _a.innerProps, className = _a.className, selected = _a.selected, selectedMultiple = _a.selectedMultiple, valueRenderer = _a.valueRenderer, restProps = __rest(_a, ["buttonSize", "view", "label", "open", "multiple", "rightAddons", "Arrow", "innerProps", "className", "selected", "selectedMultiple", "valueRenderer"]);
-    var Icon = buttonSize === 'xs' ? ArrowDownSIcon.ArrowDownSIcon : ArrowDownMIcon.ArrowDownMIcon;
+    var _b = _a.buttonSize, buttonSize = _b === void 0 ? 'm' : _b, _c = _a.buttonVariant, buttonVariant = _c === void 0 ? 'default' : _c, view = _a.view, label = _a.label, open = _a.open, multiple = _a.multiple, rightAddons = _a.rightAddons, Arrow = _a.Arrow, innerProps = _a.innerProps, className = _a.className, selected = _a.selected, selectedMultiple = _a.selectedMultiple, valueRenderer = _a.valueRenderer, restProps = __rest(_a, ["buttonSize", "buttonVariant", "view", "label", "open", "multiple", "rightAddons", "Arrow", "innerProps", "className", "selected", "selectedMultiple", "valueRenderer"]);
+    var Icon = utils_index.getIcon(buttonVariant, buttonSize);
     var ref = innerProps.ref, restInnerProps = __rest(innerProps, ["ref"]);
     var buttonProps = exports.__assign(exports.__assign({}, restProps), restInnerProps);
     return (React__default['default'].createElement("div", { ref: ref },
-        React__default['default'].createElement(coreComponentsButton.Button, exports.__assign({}, buttonProps, { rightAddons: rightAddons !== null && rightAddons !== void 0 ? rightAddons : (React__default['default'].createElement("span", { className: cn__default['default'](styles.iconContainer, open && styles.open) },
-                React__default['default'].createElement(Icon, { "data-test-id": 'picker-button-icon' }))), block: true, view: view, size: buttonSize, className: cn__default['default'](styles.component, view === 'primary' && styles.primary, className) }), label)));
+        React__default['default'].createElement(coreComponentsButton.Button, exports.__assign({}, buttonProps, { rightAddons: rightAddons !== null && rightAddons !== void 0 ? rightAddons : (React__default['default'].createElement("span", { className: cn__default['default'](styles.iconContainer, buttonVariant !== 'compact' && open && styles.open) },
+                React__default['default'].createElement(Icon, { "data-test-id": 'picker-button-icon' }))), block: true, view: view, size: buttonSize, className: cn__default['default'](styles.component, view === 'primary' && styles.primary, className) }), buttonVariant !== 'compact' && label)));
 };
 
 exports.Field = Field;

package/dist/Component.d.ts

@@ -1,18 +1,40 @@
 /// <reference types="react" />
 import React from 'react';
+import { FC, SVGProps } from "react";
 import { ButtonProps } from "@alfalab/core-components-button";
-import { BaseSelectProps } from "@alfalab/core-components-select";
+import { BaseSelectProps, OptionShape } from "@alfalab/core-components-select";
 type PickerButtonSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
-type PickerButtonProps = Omit<BaseSelectProps, 'Field' | 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'fieldProps' | 'hint' | 'allowUnselect'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
+type PickerButtonVariant = 'default' | 'compact';
+type PickerButtonProps = Omit<BaseSelectProps, 'Field' | 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'fieldProps' | 'hint' | 'allowUnselect' | 'options'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
+    options: Array<OptionShape & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: FC<SVGProps<SVGSVGElement>>;
+    }>;
     /**
      * Размер кнопки
      */
     size?: PickerButtonSize;
+    /**
+     * Тип кнопки
+     */
+    variant?: PickerButtonVariant;
 };
-declare const PickerButton: React.ForwardRefExoticComponent<Pick<BaseSelectProps, "className" | "dataTestId" | "label" | "block" | "id" | "onBlur" | "onChange" | "onScroll" | "disabled" | "name" | "fieldClassName" | "error" | "preventFlip" | "popperClassName" | "open" | "options" | "valueRenderer" | "Optgroup" | "visibleOptions" | "Option" | "optionsListClassName" | "optionClassName" | "circularNavigation" | "nativeSelect" | "defaultOpen" | "popoverPosition" | "optionsListWidth" | "optionsSize" | "optionsListProps" | "optionProps" | "onOpen" | "OptionsList" | "updatePopover" | "zIndexPopover" | "showEmptyOptionsList"> & Pick<Partial<import("@alfalab/core-components-button").ComponentProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> | Partial<import("@alfalab/core-components-button").ComponentProps & React.ButtonHTMLAttributes<HTMLButtonElement>>, "view" | "leftAddons" | "rightAddons" | "loading"> & {
+declare const PickerButton: React.ForwardRefExoticComponent<Pick<BaseSelectProps, "className" | "dataTestId" | "label" | "block" | "id" | "onBlur" | "onChange" | "onScroll" | "disabled" | "name" | "fieldClassName" | "error" | "preventFlip" | "popperClassName" | "open" | "valueRenderer" | "Optgroup" | "visibleOptions" | "Option" | "optionsListClassName" | "optionClassName" | "circularNavigation" | "nativeSelect" | "defaultOpen" | "popoverPosition" | "optionsListWidth" | "optionsSize" | "optionsListProps" | "optionProps" | "onOpen" | "OptionsList" | "updatePopover" | "zIndexPopover" | "showEmptyOptionsList"> & Pick<Partial<import("@alfalab/core-components-button").ComponentProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> | Partial<import("@alfalab/core-components-button").ComponentProps & React.ButtonHTMLAttributes<HTMLButtonElement>>, "view" | "leftAddons" | "rightAddons" | "loading"> & {
+    options: (OptionShape & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: React.FC<React.SVGProps<SVGSVGElement>> | undefined;
+    })[];
     /**
      * Размер кнопки
      */
     size?: "s" | "xxs" | "xs" | "m" | "l" | "xl" | undefined;
+    /**
+     * Тип кнопки
+     */
+    variant?: "default" | "compact" | undefined;
 } & React.RefAttributes<HTMLInputElement>>;
-export { PickerButtonSize, PickerButtonProps, PickerButton };
+export { PickerButtonSize, PickerButtonVariant, PickerButtonProps, PickerButton };

package/dist/Component.js

@@ -2,37 +2,41 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var field_Component = require('./Component-4c462f50.js');
+var field_Component = require('./Component-6e9a8e09.js');
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsSelect = require('@alfalab/core-components-select');
 require('@alfalab/core-components-button');
-require('@alfalab/icons-classic/ArrowDownMIcon');
-require('@alfalab/icons-classic/ArrowDownSIcon');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
+require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
+require('@alfalab/icons-glyph/MoreMIcon');
+require('@alfalab/icons-glyph/MoreSIcon');
+require('./utils/index.js');
 
 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 = {"container":"picker-button__container_12ijs","optionsPopover":"picker-button__optionsPopover_12ijs","sideGap":"picker-button__sideGap_12ijs","optionsListContainer":"picker-button__optionsListContainer_12ijs"};
+var styles = {"container":"picker-button__container_lu5mb","optionsPopover":"picker-button__optionsPopover_lu5mb","sideGap":"picker-button__sideGap_lu5mb","optionsListContainer":"picker-button__optionsListContainer_lu5mb","option":"picker-button__option_lu5mb"};
 require('./index.css')
 
 var SIDE_POSITIONS = ['right', 'right-start', 'right-end', 'left', 'left-start', 'left-end'];
 var PickerButton = React.forwardRef(function (_a, ref) {
     var _b;
-    var _c = _a.OptionsList, OptionsList = _c === void 0 ? coreComponentsSelect.OptionsList : _c, _d = _a.Optgroup, Optgroup = _d === void 0 ? coreComponentsSelect.Optgroup : _d, _e = _a.Option, Option = _e === void 0 ? coreComponentsSelect.Option : _e, view = _a.view, loading = _a.loading, _f = _a.size, size = _f === void 0 ? 'm' : _f, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, popperClassName = _a.popperClassName, optionsListClassName = _a.optionsListClassName, restProps = field_Component.__rest(_a, ["OptionsList", "Optgroup", "Option", "view", "loading", "size", "className", "leftAddons", "rightAddons", "popperClassName", "optionsListClassName"]);
+    var _c = _a.OptionsList, OptionsList = _c === void 0 ? coreComponentsSelect.OptionsList : _c, _d = _a.Optgroup, Optgroup = _d === void 0 ? coreComponentsSelect.Optgroup : _d, _e = _a.Option, Option = _e === void 0 ? coreComponentsSelect.Option : _e, view = _a.view, loading = _a.loading, _f = _a.size, size = _f === void 0 ? 'm' : _f, _g = _a.variant, variant = _g === void 0 ? 'default' : _g, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, popperClassName = _a.popperClassName, optionsListClassName = _a.optionsListClassName, optionClassName = _a.optionClassName, restProps = field_Component.__rest(_a, ["OptionsList", "Optgroup", "Option", "view", "loading", "size", "variant", "className", "leftAddons", "rightAddons", "popperClassName", "optionsListClassName", "optionClassName"]);
     var isSideGap = !!restProps.popoverPosition && SIDE_POSITIONS.includes(restProps.popoverPosition);
-    return (React__default['default'].createElement(coreComponentsSelect.BaseSelect, field_Component.__assign({}, restProps, { ref: ref, Option: Option, Field: field_Component.Field, size: size === 'm' ? 'm' : 's', fieldProps: {
+    return (React__default['default'].createElement(coreComponentsSelect.BaseSelect, field_Component.__assign({}, restProps, { optionProps: { Checkmark: null }, ref: ref, Option: Option, Field: field_Component.Field, size: size === 'm' ? 'm' : 's', fieldProps: {
             view: view,
             loading: loading,
             /** size у select, button несовместимы */
             buttonSize: size,
+            buttonVariant: variant,
             leftAddons: leftAddons,
             rightAddons: rightAddons,
         }, Optgroup: Optgroup, OptionsList: OptionsList, className: cn__default['default'](styles.container, className), popperClassName: cn__default['default'](styles.optionsPopover, popperClassName, (_b = {},
             _b[styles.sideGap] = isSideGap,
-            _b)), optionsListClassName: cn__default['default'](styles.optionsListContainer, optionsListClassName), selected: [], closeOnSelect: true })));
+            _b)), optionsListClassName: cn__default['default'](styles.optionsListContainer, optionsListClassName), optionClassName: cn__default['default'](styles.option, optionClassName), selected: [], closeOnSelect: true })));
 });
 
 exports.PickerButton = PickerButton;

package/dist/{esm/Component-d9d92ac3.d.ts → cssm/Component-2bc0d9b7.d.ts}

@@ -5,7 +5,7 @@ import { ReactNode, FC, RefAttributes, AriaAttributes, FocusEvent, MouseEvent, R
 import { CSSTransitionProps } from "react-transition-group/CSSTransition";
 import { BasePlacement, VariationPlacement } from "@popperjs/core";
 import { ButtonProps } from "@alfalab/core-components-button";
-import { PickerButtonSize } from "./index";
+import { PickerButtonSize, PickerButtonVariant } from "./Component";
 declare function __extends(d: any, b: any): void;
 declare function __rest(s: any, e: any): {};
 declare function __decorate(decorators: any, target: any, key: any, desc: any, ...args: any[]): any;
@@ -869,6 +869,7 @@ declare const FormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<
 type BaseFieldProps = FieldProps;
 type FieldProps$0 = Omit<BaseFieldProps, 'size' | 'hint' | 'success' | 'error' | 'placeholder'> & ButtonProps & {
     buttonSize?: PickerButtonSize;
+    buttonVariant?: PickerButtonVariant;
 };
-declare const Field: ({ buttonSize, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }: FieldProps$0) => JSX.Element;
+declare const Field: ({ buttonSize, buttonVariant, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }: FieldProps$0) => JSX.Element;
 export { __extends, __rest, __decorate, __param, __metadata, __awaiter, __generator, __exportStar, __values, __read, __spread, __spreadArrays, __await, __asyncGenerator, __asyncDelegator, __asyncValues, __makeTemplateObject, __importStar, __importDefault, __classPrivateFieldGet, __classPrivateFieldSet, __assign, __createBinding, OptionShape, GroupShape, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps, stackingOrder, StackingContext, StackProps, Stack, PortalProps, Portal, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, FormControlProps, FormControl, Field };

package/dist/cssm/{Component-aeb02c1b.js → Component-2bc0d9b7.js}

@@ -3,8 +3,7 @@
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsButton = require('@alfalab/core-components-button/dist/cssm');
-var ArrowDownMIcon = require('@alfalab/icons-classic/ArrowDownMIcon');
-var ArrowDownSIcon = require('@alfalab/icons-classic/ArrowDownSIcon');
+var utils_index = require('./utils/index.js');
 var styles = require('./field/index.module.css');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -53,13 +52,13 @@ function __rest(s, e) {
 }
 
 var Field = function (_a) {
-    var _b = _a.buttonSize, buttonSize = _b === void 0 ? 'm' : _b, view = _a.view, label = _a.label, open = _a.open, multiple = _a.multiple, rightAddons = _a.rightAddons, Arrow = _a.Arrow, innerProps = _a.innerProps, className = _a.className, selected = _a.selected, selectedMultiple = _a.selectedMultiple, valueRenderer = _a.valueRenderer, restProps = __rest(_a, ["buttonSize", "view", "label", "open", "multiple", "rightAddons", "Arrow", "innerProps", "className", "selected", "selectedMultiple", "valueRenderer"]);
-    var Icon = buttonSize === 'xs' ? ArrowDownSIcon.ArrowDownSIcon : ArrowDownMIcon.ArrowDownMIcon;
+    var _b = _a.buttonSize, buttonSize = _b === void 0 ? 'm' : _b, _c = _a.buttonVariant, buttonVariant = _c === void 0 ? 'default' : _c, view = _a.view, label = _a.label, open = _a.open, multiple = _a.multiple, rightAddons = _a.rightAddons, Arrow = _a.Arrow, innerProps = _a.innerProps, className = _a.className, selected = _a.selected, selectedMultiple = _a.selectedMultiple, valueRenderer = _a.valueRenderer, restProps = __rest(_a, ["buttonSize", "buttonVariant", "view", "label", "open", "multiple", "rightAddons", "Arrow", "innerProps", "className", "selected", "selectedMultiple", "valueRenderer"]);
+    var Icon = utils_index.getIcon(buttonVariant, buttonSize);
     var ref = innerProps.ref, restInnerProps = __rest(innerProps, ["ref"]);
     var buttonProps = exports.__assign(exports.__assign({}, restProps), restInnerProps);
     return (React__default['default'].createElement("div", { ref: ref },
-        React__default['default'].createElement(coreComponentsButton.Button, exports.__assign({}, buttonProps, { rightAddons: rightAddons !== null && rightAddons !== void 0 ? rightAddons : (React__default['default'].createElement("span", { className: cn__default['default'](styles__default['default'].iconContainer, open && styles__default['default'].open) },
-                React__default['default'].createElement(Icon, { "data-test-id": 'picker-button-icon' }))), block: true, view: view, size: buttonSize, className: cn__default['default'](styles__default['default'].component, view === 'primary' && styles__default['default'].primary, className) }), label)));
+        React__default['default'].createElement(coreComponentsButton.Button, exports.__assign({}, buttonProps, { rightAddons: rightAddons !== null && rightAddons !== void 0 ? rightAddons : (React__default['default'].createElement("span", { className: cn__default['default'](styles__default['default'].iconContainer, buttonVariant !== 'compact' && open && styles__default['default'].open) },
+                React__default['default'].createElement(Icon, { "data-test-id": 'picker-button-icon' }))), block: true, view: view, size: buttonSize, className: cn__default['default'](styles__default['default'].component, view === 'primary' && styles__default['default'].primary, className) }), buttonVariant !== 'compact' && label)));
 };
 
 exports.Field = Field;

package/dist/cssm/Component.d.ts

@@ -1,18 +1,40 @@
 /// <reference types="react" />
 import React from 'react';
+import { FC, SVGProps } from "react";
 import { ButtonProps } from "@alfalab/core-components-button";
-import { BaseSelectProps } from "@alfalab/core-components-select";
+import { BaseSelectProps, OptionShape } from "@alfalab/core-components-select";
 type PickerButtonSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
-type PickerButtonProps = Omit<BaseSelectProps, 'Field' | 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'fieldProps' | 'hint' | 'allowUnselect'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
+type PickerButtonVariant = 'default' | 'compact';
+type PickerButtonProps = Omit<BaseSelectProps, 'Field' | 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'fieldProps' | 'hint' | 'allowUnselect' | 'options'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
+    options: Array<OptionShape & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: FC<SVGProps<SVGSVGElement>>;
+    }>;
     /**
      * Размер кнопки
      */
     size?: PickerButtonSize;
+    /**
+     * Тип кнопки
+     */
+    variant?: PickerButtonVariant;
 };
-declare const PickerButton: React.ForwardRefExoticComponent<Pick<BaseSelectProps, "className" | "dataTestId" | "label" | "block" | "id" | "onBlur" | "onChange" | "onScroll" | "disabled" | "name" | "fieldClassName" | "error" | "preventFlip" | "popperClassName" | "open" | "options" | "valueRenderer" | "Optgroup" | "visibleOptions" | "Option" | "optionsListClassName" | "optionClassName" | "circularNavigation" | "nativeSelect" | "defaultOpen" | "popoverPosition" | "optionsListWidth" | "optionsSize" | "optionsListProps" | "optionProps" | "onOpen" | "OptionsList" | "updatePopover" | "zIndexPopover" | "showEmptyOptionsList"> & Pick<Partial<import("@alfalab/core-components-button").ComponentProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> | Partial<import("@alfalab/core-components-button").ComponentProps & React.ButtonHTMLAttributes<HTMLButtonElement>>, "view" | "leftAddons" | "rightAddons" | "loading"> & {
+declare const PickerButton: React.ForwardRefExoticComponent<Pick<BaseSelectProps, "className" | "dataTestId" | "label" | "block" | "id" | "onBlur" | "onChange" | "onScroll" | "disabled" | "name" | "fieldClassName" | "error" | "preventFlip" | "popperClassName" | "open" | "valueRenderer" | "Optgroup" | "visibleOptions" | "Option" | "optionsListClassName" | "optionClassName" | "circularNavigation" | "nativeSelect" | "defaultOpen" | "popoverPosition" | "optionsListWidth" | "optionsSize" | "optionsListProps" | "optionProps" | "onOpen" | "OptionsList" | "updatePopover" | "zIndexPopover" | "showEmptyOptionsList"> & Pick<Partial<import("@alfalab/core-components-button").ComponentProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> | Partial<import("@alfalab/core-components-button").ComponentProps & React.ButtonHTMLAttributes<HTMLButtonElement>>, "view" | "leftAddons" | "rightAddons" | "loading"> & {
+    options: (OptionShape & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: React.FC<React.SVGProps<SVGSVGElement>> | undefined;
+    })[];
     /**
      * Размер кнопки
      */
     size?: "s" | "xxs" | "xs" | "m" | "l" | "xl" | undefined;
+    /**
+     * Тип кнопки
+     */
+    variant?: "default" | "compact" | undefined;
 } & React.RefAttributes<HTMLInputElement>>;
-export { PickerButtonSize, PickerButtonProps, PickerButton };
+export { PickerButtonSize, PickerButtonVariant, PickerButtonProps, PickerButton };

package/dist/cssm/Component.js

@@ -2,13 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var field_Component = require('./Component-aeb02c1b.js');
+var field_Component = require('./Component-2bc0d9b7.js');
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsSelect = require('@alfalab/core-components-select/dist/cssm');
 require('@alfalab/core-components-button/dist/cssm');
-require('@alfalab/icons-classic/ArrowDownMIcon');
-require('@alfalab/icons-classic/ArrowDownSIcon');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
+require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
+require('@alfalab/icons-glyph/MoreMIcon');
+require('@alfalab/icons-glyph/MoreSIcon');
+require('./utils/index.js');
 require('./field/index.module.css');
 var styles = require('./index.module.css');
 
@@ -21,18 +24,19 @@ var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
 var SIDE_POSITIONS = ['right', 'right-start', 'right-end', 'left', 'left-start', 'left-end'];
 var PickerButton = React.forwardRef(function (_a, ref) {
     var _b;
-    var _c = _a.OptionsList, OptionsList = _c === void 0 ? coreComponentsSelect.OptionsList : _c, _d = _a.Optgroup, Optgroup = _d === void 0 ? coreComponentsSelect.Optgroup : _d, _e = _a.Option, Option = _e === void 0 ? coreComponentsSelect.Option : _e, view = _a.view, loading = _a.loading, _f = _a.size, size = _f === void 0 ? 'm' : _f, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, popperClassName = _a.popperClassName, optionsListClassName = _a.optionsListClassName, restProps = field_Component.__rest(_a, ["OptionsList", "Optgroup", "Option", "view", "loading", "size", "className", "leftAddons", "rightAddons", "popperClassName", "optionsListClassName"]);
+    var _c = _a.OptionsList, OptionsList = _c === void 0 ? coreComponentsSelect.OptionsList : _c, _d = _a.Optgroup, Optgroup = _d === void 0 ? coreComponentsSelect.Optgroup : _d, _e = _a.Option, Option = _e === void 0 ? coreComponentsSelect.Option : _e, view = _a.view, loading = _a.loading, _f = _a.size, size = _f === void 0 ? 'm' : _f, _g = _a.variant, variant = _g === void 0 ? 'default' : _g, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, popperClassName = _a.popperClassName, optionsListClassName = _a.optionsListClassName, optionClassName = _a.optionClassName, restProps = field_Component.__rest(_a, ["OptionsList", "Optgroup", "Option", "view", "loading", "size", "variant", "className", "leftAddons", "rightAddons", "popperClassName", "optionsListClassName", "optionClassName"]);
     var isSideGap = !!restProps.popoverPosition && SIDE_POSITIONS.includes(restProps.popoverPosition);
-    return (React__default['default'].createElement(coreComponentsSelect.BaseSelect, field_Component.__assign({}, restProps, { ref: ref, Option: Option, Field: field_Component.Field, size: size === 'm' ? 'm' : 's', fieldProps: {
+    return (React__default['default'].createElement(coreComponentsSelect.BaseSelect, field_Component.__assign({}, restProps, { optionProps: { Checkmark: null }, ref: ref, Option: Option, Field: field_Component.Field, size: size === 'm' ? 'm' : 's', fieldProps: {
             view: view,
             loading: loading,
             /** size у select, button несовместимы */
             buttonSize: size,
+            buttonVariant: variant,
             leftAddons: leftAddons,
             rightAddons: rightAddons,
         }, Optgroup: Optgroup, OptionsList: OptionsList, className: cn__default['default'](styles__default['default'].container, className), popperClassName: cn__default['default'](styles__default['default'].optionsPopover, popperClassName, (_b = {},
             _b[styles__default['default'].sideGap] = isSideGap,
-            _b)), optionsListClassName: cn__default['default'](styles__default['default'].optionsListContainer, optionsListClassName), selected: [], closeOnSelect: true })));
+            _b)), optionsListClassName: cn__default['default'](styles__default['default'].optionsListContainer, optionsListClassName), optionClassName: cn__default['default'](styles__default['default'].option, optionClassName), selected: [], closeOnSelect: true })));
 });
 
 exports.PickerButton = PickerButton;

package/dist/cssm/field/Component.js

@@ -2,12 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var field_Component = require('../Component-aeb02c1b.js');
+var field_Component = require('../Component-2bc0d9b7.js');
 require('react');
 require('classnames');
 require('@alfalab/core-components-button/dist/cssm');
-require('@alfalab/icons-classic/ArrowDownMIcon');
-require('@alfalab/icons-classic/ArrowDownSIcon');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
+require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
+require('@alfalab/icons-glyph/MoreMIcon');
+require('@alfalab/icons-glyph/MoreSIcon');
+require('../utils/index.js');
 require('./index.module.css');
 
 

package/dist/cssm/field/index.d.ts

@@ -1 +1 @@
-export * from "../Component-aeb02c1b";
+export * from "../Component-2bc0d9b7";

package/dist/cssm/field/index.js

@@ -2,12 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var field_Component = require('../Component-aeb02c1b.js');
+var field_Component = require('../Component-2bc0d9b7.js');
 require('react');
 require('classnames');
 require('@alfalab/core-components-button/dist/cssm');
-require('@alfalab/icons-classic/ArrowDownMIcon');
-require('@alfalab/icons-classic/ArrowDownSIcon');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
+require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
+require('@alfalab/icons-glyph/MoreMIcon');
+require('@alfalab/icons-glyph/MoreSIcon');
+require('../utils/index.js');
 require('./index.module.css');
 
 

package/dist/cssm/index.js

@@ -2,13 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./Component-aeb02c1b.js');
+require('./Component-2bc0d9b7.js');
 require('react');
 require('classnames');
 require('@alfalab/core-components-select/dist/cssm');
 require('@alfalab/core-components-button/dist/cssm');
-require('@alfalab/icons-classic/ArrowDownMIcon');
-require('@alfalab/icons-classic/ArrowDownSIcon');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
+require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
+require('@alfalab/icons-glyph/MoreMIcon');
+require('@alfalab/icons-glyph/MoreSIcon');
+require('./utils/index.js');
 require('./field/index.module.css');
 require('./index.module.css');
 var Component = require('./Component.js');

package/dist/cssm/index.module.css

@@ -8,6 +8,7 @@
 }
 :root {
     --gap-xs: 8px;
+    --gap-m: 16px;
 }
 :root {
     --border-radius-s: 4px;
@@ -24,3 +25,6 @@
 .optionsListContainer {
     border-radius: var(--border-radius-s);
 }
+.option {
+    padding: 0 var(--gap-m);
+}

package/dist/cssm/utils/index.d.ts

@@ -0,0 +1,4 @@
+import { FC, SVGProps } from 'react';
+import { PickerButtonVariant } from "../index";
+declare const getIcon: (variant: PickerButtonVariant, size: "s" | "xxs" | "xs" | "m" | "l" | "xl") => FC<SVGProps<SVGSVGElement>>;
+export { getIcon };

package/dist/cssm/utils/index.js

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ChevronDownMIcon = require('@alfalab/icons-glyph/ChevronDownMIcon');
+var ChevronDownCompactSIcon = require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
+var MoreMIcon = require('@alfalab/icons-glyph/MoreMIcon');
+var MoreSIcon = require('@alfalab/icons-glyph/MoreSIcon');
+
+var getIcon = function (variant, size) {
+    if (variant === 'compact') {
+        return size === 'xxs' ? MoreSIcon.MoreSIcon : MoreMIcon.MoreMIcon;
+    }
+    return size === 'xxs' ? ChevronDownCompactSIcon.ChevronDownCompactSIcon : ChevronDownMIcon.ChevronDownMIcon;
+};
+
+exports.getIcon = getIcon;

package/dist/{cssm/Component-aeb02c1b.d.ts → esm/Component-b141ddb0.d.ts}

@@ -5,7 +5,7 @@ import { ReactNode, FC, RefAttributes, AriaAttributes, FocusEvent, MouseEvent, R
 import { CSSTransitionProps } from "react-transition-group/CSSTransition";
 import { BasePlacement, VariationPlacement } from "@popperjs/core";
 import { ButtonProps } from "@alfalab/core-components-button";
-import { PickerButtonSize } from "./index";
+import { PickerButtonSize, PickerButtonVariant } from "./Component";
 declare function __extends(d: any, b: any): void;
 declare function __rest(s: any, e: any): {};
 declare function __decorate(decorators: any, target: any, key: any, desc: any, ...args: any[]): any;
@@ -869,6 +869,7 @@ declare const FormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<
 type BaseFieldProps = FieldProps;
 type FieldProps$0 = Omit<BaseFieldProps, 'size' | 'hint' | 'success' | 'error' | 'placeholder'> & ButtonProps & {
     buttonSize?: PickerButtonSize;
+    buttonVariant?: PickerButtonVariant;
 };
-declare const Field: ({ buttonSize, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }: FieldProps$0) => JSX.Element;
+declare const Field: ({ buttonSize, buttonVariant, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }: FieldProps$0) => JSX.Element;
 export { __extends, __rest, __decorate, __param, __metadata, __awaiter, __generator, __exportStar, __values, __read, __spread, __spreadArrays, __await, __asyncGenerator, __asyncDelegator, __asyncValues, __makeTemplateObject, __importStar, __importDefault, __classPrivateFieldGet, __classPrivateFieldSet, __assign, __createBinding, OptionShape, GroupShape, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps, stackingOrder, StackingContext, StackProps, Stack, PortalProps, Portal, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, FormControlProps, FormControl, Field };

package/dist/esm/{Component-d9d92ac3.js → Component-b141ddb0.js}

@@ -1,8 +1,7 @@
 import React from 'react';
 import cn from 'classnames';
 import { Button } from '@alfalab/core-components-button/dist/esm';
-import { ArrowDownMIcon } from '@alfalab/icons-classic/ArrowDownMIcon';
-import { ArrowDownSIcon } from '@alfalab/icons-classic/ArrowDownSIcon';
+import { getIcon } from './utils/index.js';
 
 /*! *****************************************************************************
 Copyright (c) Microsoft Corporation.
@@ -43,17 +42,17 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"iconContainer":"picker-button__iconContainer_p0806","open":"picker-button__open_p0806"};
+var styles = {"iconContainer":"picker-button__iconContainer_h15km","open":"picker-button__open_h15km"};
 require('./field/index.css')
 
 var Field = function (_a) {
-    var _b = _a.buttonSize, buttonSize = _b === void 0 ? 'm' : _b, view = _a.view, label = _a.label, open = _a.open, multiple = _a.multiple, rightAddons = _a.rightAddons, Arrow = _a.Arrow, innerProps = _a.innerProps, className = _a.className, selected = _a.selected, selectedMultiple = _a.selectedMultiple, valueRenderer = _a.valueRenderer, restProps = __rest(_a, ["buttonSize", "view", "label", "open", "multiple", "rightAddons", "Arrow", "innerProps", "className", "selected", "selectedMultiple", "valueRenderer"]);
-    var Icon = buttonSize === 'xs' ? ArrowDownSIcon : ArrowDownMIcon;
+    var _b = _a.buttonSize, buttonSize = _b === void 0 ? 'm' : _b, _c = _a.buttonVariant, buttonVariant = _c === void 0 ? 'default' : _c, view = _a.view, label = _a.label, open = _a.open, multiple = _a.multiple, rightAddons = _a.rightAddons, Arrow = _a.Arrow, innerProps = _a.innerProps, className = _a.className, selected = _a.selected, selectedMultiple = _a.selectedMultiple, valueRenderer = _a.valueRenderer, restProps = __rest(_a, ["buttonSize", "buttonVariant", "view", "label", "open", "multiple", "rightAddons", "Arrow", "innerProps", "className", "selected", "selectedMultiple", "valueRenderer"]);
+    var Icon = getIcon(buttonVariant, buttonSize);
     var ref = innerProps.ref, restInnerProps = __rest(innerProps, ["ref"]);
     var buttonProps = __assign(__assign({}, restProps), restInnerProps);
     return (React.createElement("div", { ref: ref },
-        React.createElement(Button, __assign({}, buttonProps, { rightAddons: rightAddons !== null && rightAddons !== void 0 ? rightAddons : (React.createElement("span", { className: cn(styles.iconContainer, open && styles.open) },
-                React.createElement(Icon, { "data-test-id": 'picker-button-icon' }))), block: true, view: view, size: buttonSize, className: cn(styles.component, view === 'primary' && styles.primary, className) }), label)));
+        React.createElement(Button, __assign({}, buttonProps, { rightAddons: rightAddons !== null && rightAddons !== void 0 ? rightAddons : (React.createElement("span", { className: cn(styles.iconContainer, buttonVariant !== 'compact' && open && styles.open) },
+                React.createElement(Icon, { "data-test-id": 'picker-button-icon' }))), block: true, view: view, size: buttonSize, className: cn(styles.component, view === 'primary' && styles.primary, className) }), buttonVariant !== 'compact' && label)));
 };
 
 export { Field as F, __rest as _, __assign as a };

package/dist/esm/Component.d.ts

@@ -1,18 +1,40 @@
 /// <reference types="react" />
 import React from 'react';
+import { FC, SVGProps } from "react";
 import { ButtonProps } from "@alfalab/core-components-button";
-import { BaseSelectProps } from "@alfalab/core-components-select";
+import { BaseSelectProps, OptionShape } from "@alfalab/core-components-select";
 type PickerButtonSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
-type PickerButtonProps = Omit<BaseSelectProps, 'Field' | 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'fieldProps' | 'hint' | 'allowUnselect'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
+type PickerButtonVariant = 'default' | 'compact';
+type PickerButtonProps = Omit<BaseSelectProps, 'Field' | 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'fieldProps' | 'hint' | 'allowUnselect' | 'options'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
+    options: Array<OptionShape & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: FC<SVGProps<SVGSVGElement>>;
+    }>;
     /**
      * Размер кнопки
      */
     size?: PickerButtonSize;
+    /**
+     * Тип кнопки
+     */
+    variant?: PickerButtonVariant;
 };
-declare const PickerButton: React.ForwardRefExoticComponent<Pick<BaseSelectProps, "className" | "dataTestId" | "label" | "block" | "id" | "onBlur" | "onChange" | "onScroll" | "disabled" | "name" | "fieldClassName" | "error" | "preventFlip" | "popperClassName" | "open" | "options" | "valueRenderer" | "Optgroup" | "visibleOptions" | "Option" | "optionsListClassName" | "optionClassName" | "circularNavigation" | "nativeSelect" | "defaultOpen" | "popoverPosition" | "optionsListWidth" | "optionsSize" | "optionsListProps" | "optionProps" | "onOpen" | "OptionsList" | "updatePopover" | "zIndexPopover" | "showEmptyOptionsList"> & Pick<Partial<import("@alfalab/core-components-button").ComponentProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> | Partial<import("@alfalab/core-components-button").ComponentProps & React.ButtonHTMLAttributes<HTMLButtonElement>>, "view" | "leftAddons" | "rightAddons" | "loading"> & {
+declare const PickerButton: React.ForwardRefExoticComponent<Pick<BaseSelectProps, "className" | "dataTestId" | "label" | "block" | "id" | "onBlur" | "onChange" | "onScroll" | "disabled" | "name" | "fieldClassName" | "error" | "preventFlip" | "popperClassName" | "open" | "valueRenderer" | "Optgroup" | "visibleOptions" | "Option" | "optionsListClassName" | "optionClassName" | "circularNavigation" | "nativeSelect" | "defaultOpen" | "popoverPosition" | "optionsListWidth" | "optionsSize" | "optionsListProps" | "optionProps" | "onOpen" | "OptionsList" | "updatePopover" | "zIndexPopover" | "showEmptyOptionsList"> & Pick<Partial<import("@alfalab/core-components-button").ComponentProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> | Partial<import("@alfalab/core-components-button").ComponentProps & React.ButtonHTMLAttributes<HTMLButtonElement>>, "view" | "leftAddons" | "rightAddons" | "loading"> & {
+    options: (OptionShape & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: React.FC<React.SVGProps<SVGSVGElement>> | undefined;
+    })[];
     /**
      * Размер кнопки
      */
     size?: "s" | "xxs" | "xs" | "m" | "l" | "xl" | undefined;
+    /**
+     * Тип кнопки
+     */
+    variant?: "default" | "compact" | undefined;
 } & React.RefAttributes<HTMLInputElement>>;
-export { PickerButtonSize, PickerButtonProps, PickerButton };
+export { PickerButtonSize, PickerButtonVariant, PickerButtonProps, PickerButton };

package/dist/esm/Component.js

@@ -1,29 +1,33 @@
-import { _ as __rest, a as __assign, F as Field } from './Component-d9d92ac3.js';
+import { _ as __rest, a as __assign, F as Field } from './Component-b141ddb0.js';
 import React, { forwardRef } from 'react';
 import cn from 'classnames';
 import { BaseSelect, OptionsList, Optgroup, Option } from '@alfalab/core-components-select/dist/esm';
 import '@alfalab/core-components-button/dist/esm';
-import '@alfalab/icons-classic/ArrowDownMIcon';
-import '@alfalab/icons-classic/ArrowDownSIcon';
+import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownCompactSIcon';
+import '@alfalab/icons-glyph/MoreMIcon';
+import '@alfalab/icons-glyph/MoreSIcon';
+import './utils/index.js';
 
-var styles = {"container":"picker-button__container_12ijs","optionsPopover":"picker-button__optionsPopover_12ijs","sideGap":"picker-button__sideGap_12ijs","optionsListContainer":"picker-button__optionsListContainer_12ijs"};
+var styles = {"container":"picker-button__container_lu5mb","optionsPopover":"picker-button__optionsPopover_lu5mb","sideGap":"picker-button__sideGap_lu5mb","optionsListContainer":"picker-button__optionsListContainer_lu5mb","option":"picker-button__option_lu5mb"};
 require('./index.css')
 
 var SIDE_POSITIONS = ['right', 'right-start', 'right-end', 'left', 'left-start', 'left-end'];
 var PickerButton = forwardRef(function (_a, ref) {
     var _b;
-    var _c = _a.OptionsList, OptionsList$1 = _c === void 0 ? OptionsList : _c, _d = _a.Optgroup, Optgroup$1 = _d === void 0 ? Optgroup : _d, _e = _a.Option, Option$1 = _e === void 0 ? Option : _e, view = _a.view, loading = _a.loading, _f = _a.size, size = _f === void 0 ? 'm' : _f, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, popperClassName = _a.popperClassName, optionsListClassName = _a.optionsListClassName, restProps = __rest(_a, ["OptionsList", "Optgroup", "Option", "view", "loading", "size", "className", "leftAddons", "rightAddons", "popperClassName", "optionsListClassName"]);
+    var _c = _a.OptionsList, OptionsList$1 = _c === void 0 ? OptionsList : _c, _d = _a.Optgroup, Optgroup$1 = _d === void 0 ? Optgroup : _d, _e = _a.Option, Option$1 = _e === void 0 ? Option : _e, view = _a.view, loading = _a.loading, _f = _a.size, size = _f === void 0 ? 'm' : _f, _g = _a.variant, variant = _g === void 0 ? 'default' : _g, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, popperClassName = _a.popperClassName, optionsListClassName = _a.optionsListClassName, optionClassName = _a.optionClassName, restProps = __rest(_a, ["OptionsList", "Optgroup", "Option", "view", "loading", "size", "variant", "className", "leftAddons", "rightAddons", "popperClassName", "optionsListClassName", "optionClassName"]);
     var isSideGap = !!restProps.popoverPosition && SIDE_POSITIONS.includes(restProps.popoverPosition);
-    return (React.createElement(BaseSelect, __assign({}, restProps, { ref: ref, Option: Option$1, Field: Field, size: size === 'm' ? 'm' : 's', fieldProps: {
+    return (React.createElement(BaseSelect, __assign({}, restProps, { optionProps: { Checkmark: null }, ref: ref, Option: Option$1, Field: Field, size: size === 'm' ? 'm' : 's', fieldProps: {
             view: view,
             loading: loading,
             /** size у select, button несовместимы */
             buttonSize: size,
+            buttonVariant: variant,
             leftAddons: leftAddons,
             rightAddons: rightAddons,
         }, Optgroup: Optgroup$1, OptionsList: OptionsList$1, className: cn(styles.container, className), popperClassName: cn(styles.optionsPopover, popperClassName, (_b = {},
             _b[styles.sideGap] = isSideGap,
-            _b)), optionsListClassName: cn(styles.optionsListContainer, optionsListClassName), selected: [], closeOnSelect: true })));
+            _b)), optionsListClassName: cn(styles.optionsListContainer, optionsListClassName), optionClassName: cn(styles.option, optionClassName), selected: [], closeOnSelect: true })));
 });
 
 export { PickerButton };

package/dist/esm/field/Component.js

@@ -1,6 +1,9 @@
-export { F as Field } from '../Component-d9d92ac3.js';
+export { F as Field } from '../Component-b141ddb0.js';
 import 'react';
 import 'classnames';
 import '@alfalab/core-components-button/dist/esm';
-import '@alfalab/icons-classic/ArrowDownMIcon';
-import '@alfalab/icons-classic/ArrowDownSIcon';
+import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownCompactSIcon';
+import '@alfalab/icons-glyph/MoreMIcon';
+import '@alfalab/icons-glyph/MoreSIcon';
+import '../utils/index.js';

package/dist/esm/field/index.css

@@ -1,4 +1,4 @@
-/* hash: h1l5h */
+/* hash: a0xav */
 :root {
 
     /* Hard */
@@ -10,10 +10,10 @@
 :root {
     --arrow-transform: rotate(180deg);
 }
-.picker-button__iconContainer_p0806 {
+.picker-button__iconContainer_h15km {
     display: flex;
     transition: transform 0.15s ease-in-out;
 }
-.picker-button__open_p0806 {
+.picker-button__open_h15km {
     transform: var(--arrow-transform);
 }

package/dist/esm/field/index.d.ts

@@ -1 +1 @@
-export * from "../Component-d9d92ac3";
+export * from "../Component-b141ddb0";

package/dist/esm/field/index.js

@@ -1,6 +1,9 @@
-export { F as Field } from '../Component-d9d92ac3.js';
+export { F as Field } from '../Component-b141ddb0.js';
 import 'react';
 import 'classnames';
 import '@alfalab/core-components-button/dist/esm';
-import '@alfalab/icons-classic/ArrowDownMIcon';
-import '@alfalab/icons-classic/ArrowDownSIcon';
+import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownCompactSIcon';
+import '@alfalab/icons-glyph/MoreMIcon';
+import '@alfalab/icons-glyph/MoreSIcon';
+import '../utils/index.js';

package/dist/esm/index.css

@@ -1,4 +1,4 @@
-/* hash: 1qe6w */
+/* hash: 8bi4r */
 :root {
 
     /* Hard */
@@ -9,19 +9,23 @@
 }
 :root {
     --gap-xs: 8px;
+    --gap-m: 16px;
 }
 :root {
     --border-radius-s: 4px;
 }
-.picker-button__container_12ijs {
+.picker-button__container_lu5mb {
     min-width: auto;
 }
-.picker-button__optionsPopover_12ijs {
+.picker-button__optionsPopover_lu5mb {
     padding: var(--gap-xs) 0
 }
-.picker-button__optionsPopover_12ijs.picker-button__sideGap_12ijs {
+.picker-button__optionsPopover_lu5mb.picker-button__sideGap_lu5mb {
         padding: 0 var(--gap-xs);
     }
-.picker-button__optionsListContainer_12ijs {
+.picker-button__optionsListContainer_lu5mb {
     border-radius: var(--border-radius-s);
 }
+.picker-button__option_lu5mb {
+    padding: 0 var(--gap-m);
+}

package/dist/esm/index.js

@@ -1,8 +1,11 @@
-import './Component-d9d92ac3.js';
+import './Component-b141ddb0.js';
 import 'react';
 import 'classnames';
 import '@alfalab/core-components-select/dist/esm';
 import '@alfalab/core-components-button/dist/esm';
-import '@alfalab/icons-classic/ArrowDownMIcon';
-import '@alfalab/icons-classic/ArrowDownSIcon';
+import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownCompactSIcon';
+import '@alfalab/icons-glyph/MoreMIcon';
+import '@alfalab/icons-glyph/MoreSIcon';
+import './utils/index.js';
 export { PickerButton } from './Component.js';

package/dist/esm/utils/index.d.ts

@@ -0,0 +1,4 @@
+import { FC, SVGProps } from 'react';
+import { PickerButtonVariant } from "../index";
+declare const getIcon: (variant: PickerButtonVariant, size: "s" | "xxs" | "xs" | "m" | "l" | "xl") => FC<SVGProps<SVGSVGElement>>;
+export { getIcon };

package/dist/esm/utils/index.js

@@ -0,0 +1,13 @@
+import { ChevronDownMIcon } from '@alfalab/icons-glyph/ChevronDownMIcon';
+import { ChevronDownCompactSIcon } from '@alfalab/icons-glyph/ChevronDownCompactSIcon';
+import { MoreMIcon } from '@alfalab/icons-glyph/MoreMIcon';
+import { MoreSIcon } from '@alfalab/icons-glyph/MoreSIcon';
+
+var getIcon = function (variant, size) {
+    if (variant === 'compact') {
+        return size === 'xxs' ? MoreSIcon : MoreMIcon;
+    }
+    return size === 'xxs' ? ChevronDownCompactSIcon : ChevronDownMIcon;
+};
+
+export { getIcon };

package/dist/field/Component.js

@@ -2,12 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var field_Component = require('../Component-4c462f50.js');
+var field_Component = require('../Component-6e9a8e09.js');
 require('react');
 require('classnames');
 require('@alfalab/core-components-button');
-require('@alfalab/icons-classic/ArrowDownMIcon');
-require('@alfalab/icons-classic/ArrowDownSIcon');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
+require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
+require('@alfalab/icons-glyph/MoreMIcon');
+require('@alfalab/icons-glyph/MoreSIcon');
+require('../utils/index.js');
 
 
 

package/dist/field/index.css

@@ -1,4 +1,4 @@
-/* hash: h1l5h */
+/* hash: a0xav */
 :root {
 
     /* Hard */
@@ -10,10 +10,10 @@
 :root {
     --arrow-transform: rotate(180deg);
 }
-.picker-button__iconContainer_p0806 {
+.picker-button__iconContainer_h15km {
     display: flex;
     transition: transform 0.15s ease-in-out;
 }
-.picker-button__open_p0806 {
+.picker-button__open_h15km {
     transform: var(--arrow-transform);
 }

package/dist/field/index.d.ts

@@ -1 +1 @@
-export * from "../Component-4c462f50";
+export * from "../Component-6e9a8e09";

package/dist/field/index.js

@@ -2,12 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var field_Component = require('../Component-4c462f50.js');
+var field_Component = require('../Component-6e9a8e09.js');
 require('react');
 require('classnames');
 require('@alfalab/core-components-button');
-require('@alfalab/icons-classic/ArrowDownMIcon');
-require('@alfalab/icons-classic/ArrowDownSIcon');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
+require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
+require('@alfalab/icons-glyph/MoreMIcon');
+require('@alfalab/icons-glyph/MoreSIcon');
+require('../utils/index.js');
 
 
 

package/dist/index.css

@@ -1,4 +1,4 @@
-/* hash: 1qe6w */
+/* hash: 8bi4r */
 :root {
 
     /* Hard */
@@ -9,19 +9,23 @@
 }
 :root {
     --gap-xs: 8px;
+    --gap-m: 16px;
 }
 :root {
     --border-radius-s: 4px;
 }
-.picker-button__container_12ijs {
+.picker-button__container_lu5mb {
     min-width: auto;
 }
-.picker-button__optionsPopover_12ijs {
+.picker-button__optionsPopover_lu5mb {
     padding: var(--gap-xs) 0
 }
-.picker-button__optionsPopover_12ijs.picker-button__sideGap_12ijs {
+.picker-button__optionsPopover_lu5mb.picker-button__sideGap_lu5mb {
         padding: 0 var(--gap-xs);
     }
-.picker-button__optionsListContainer_12ijs {
+.picker-button__optionsListContainer_lu5mb {
     border-radius: var(--border-radius-s);
 }
+.picker-button__option_lu5mb {
+    padding: 0 var(--gap-m);
+}

package/dist/index.js

@@ -2,13 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./Component-4c462f50.js');
+require('./Component-6e9a8e09.js');
 require('react');
 require('classnames');
 require('@alfalab/core-components-select');
 require('@alfalab/core-components-button');
-require('@alfalab/icons-classic/ArrowDownMIcon');
-require('@alfalab/icons-classic/ArrowDownSIcon');
+require('@alfalab/icons-glyph/ChevronDownMIcon');
+require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
+require('@alfalab/icons-glyph/MoreMIcon');
+require('@alfalab/icons-glyph/MoreSIcon');
+require('./utils/index.js');
 var Component = require('./Component.js');
 
 

package/dist/modern/Component.d.ts

@@ -1,18 +1,40 @@
 /// <reference types="react" />
 import React from 'react';
+import { FC, SVGProps } from "react";
 import { ButtonProps } from "@alfalab/core-components-button";
-import { BaseSelectProps } from "@alfalab/core-components-select";
+import { BaseSelectProps, OptionShape } from "@alfalab/core-components-select";
 type PickerButtonSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
-type PickerButtonProps = Omit<BaseSelectProps, 'Field' | 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'fieldProps' | 'hint' | 'allowUnselect'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
+type PickerButtonVariant = 'default' | 'compact';
+type PickerButtonProps = Omit<BaseSelectProps, 'Field' | 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'fieldProps' | 'hint' | 'allowUnselect' | 'options'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
+    options: Array<OptionShape & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: FC<SVGProps<SVGSVGElement>>;
+    }>;
     /**
      * Размер кнопки
      */
     size?: PickerButtonSize;
+    /**
+     * Тип кнопки
+     */
+    variant?: PickerButtonVariant;
 };
-declare const PickerButton: React.ForwardRefExoticComponent<Pick<BaseSelectProps, "className" | "dataTestId" | "label" | "block" | "id" | "onBlur" | "onChange" | "onScroll" | "disabled" | "name" | "fieldClassName" | "error" | "preventFlip" | "popperClassName" | "open" | "options" | "valueRenderer" | "Optgroup" | "visibleOptions" | "Option" | "optionsListClassName" | "optionClassName" | "circularNavigation" | "nativeSelect" | "defaultOpen" | "popoverPosition" | "optionsListWidth" | "optionsSize" | "optionsListProps" | "optionProps" | "onOpen" | "OptionsList" | "updatePopover" | "zIndexPopover" | "showEmptyOptionsList"> & Pick<Partial<import("@alfalab/core-components-button").ComponentProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> | Partial<import("@alfalab/core-components-button").ComponentProps & React.ButtonHTMLAttributes<HTMLButtonElement>>, "view" | "leftAddons" | "rightAddons" | "loading"> & {
+declare const PickerButton: React.ForwardRefExoticComponent<Pick<BaseSelectProps, "className" | "dataTestId" | "label" | "block" | "id" | "onBlur" | "onChange" | "onScroll" | "disabled" | "name" | "fieldClassName" | "error" | "preventFlip" | "popperClassName" | "open" | "valueRenderer" | "Optgroup" | "visibleOptions" | "Option" | "optionsListClassName" | "optionClassName" | "circularNavigation" | "nativeSelect" | "defaultOpen" | "popoverPosition" | "optionsListWidth" | "optionsSize" | "optionsListProps" | "optionProps" | "onOpen" | "OptionsList" | "updatePopover" | "zIndexPopover" | "showEmptyOptionsList"> & Pick<Partial<import("@alfalab/core-components-button").ComponentProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> | Partial<import("@alfalab/core-components-button").ComponentProps & React.ButtonHTMLAttributes<HTMLButtonElement>>, "view" | "leftAddons" | "rightAddons" | "loading"> & {
+    options: (OptionShape & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: React.FC<React.SVGProps<SVGSVGElement>> | undefined;
+    })[];
     /**
      * Размер кнопки
      */
     size?: "s" | "xxs" | "xs" | "m" | "l" | "xl" | undefined;
+    /**
+     * Тип кнопки
+     */
+    variant?: "default" | "compact" | undefined;
 } & React.RefAttributes<HTMLInputElement>>;
-export { PickerButtonSize, PickerButtonProps, PickerButton };
+export { PickerButtonSize, PickerButtonVariant, PickerButtonProps, PickerButton };

package/dist/modern/Component.js

@@ -2,26 +2,30 @@ import React, { forwardRef } from 'react';
 import cn from 'classnames';
 import { OptionsList, Optgroup, Option, BaseSelect } from '@alfalab/core-components-select/dist/modern';
 import '@alfalab/core-components-button/dist/modern';
-import '@alfalab/icons-classic/ArrowDownMIcon';
-import '@alfalab/icons-classic/ArrowDownSIcon';
+import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownCompactSIcon';
+import '@alfalab/icons-glyph/MoreMIcon';
+import '@alfalab/icons-glyph/MoreSIcon';
+import './utils/index.js';
 import { Field } from './field/Component.js';
 
-var styles = {"container":"picker-button__container_12ijs","optionsPopover":"picker-button__optionsPopover_12ijs","sideGap":"picker-button__sideGap_12ijs","optionsListContainer":"picker-button__optionsListContainer_12ijs"};
+var styles = {"container":"picker-button__container_lu5mb","optionsPopover":"picker-button__optionsPopover_lu5mb","sideGap":"picker-button__sideGap_lu5mb","optionsListContainer":"picker-button__optionsListContainer_lu5mb","option":"picker-button__option_lu5mb"};
 require('./index.css')
 
 const SIDE_POSITIONS = ['right', 'right-start', 'right-end', 'left', 'left-start', 'left-end'];
-const PickerButton = forwardRef(({ OptionsList: OptionsList$1 = OptionsList, Optgroup: Optgroup$1 = Optgroup, Option: Option$1 = Option, view, loading, size = 'm', className, leftAddons, rightAddons, popperClassName, optionsListClassName, ...restProps }, ref) => {
+const PickerButton = forwardRef(({ OptionsList: OptionsList$1 = OptionsList, Optgroup: Optgroup$1 = Optgroup, Option: Option$1 = Option, view, loading, size = 'm', variant = 'default', className, leftAddons, rightAddons, popperClassName, optionsListClassName, optionClassName, ...restProps }, ref) => {
     const isSideGap = !!restProps.popoverPosition && SIDE_POSITIONS.includes(restProps.popoverPosition);
-    return (React.createElement(BaseSelect, Object.assign({}, restProps, { ref: ref, Option: Option$1, Field: Field, size: size === 'm' ? 'm' : 's', fieldProps: {
+    return (React.createElement(BaseSelect, Object.assign({}, restProps, { optionProps: { Checkmark: null }, ref: ref, Option: Option$1, Field: Field, size: size === 'm' ? 'm' : 's', fieldProps: {
             view,
             loading,
             /** size у select, button несовместимы */
             buttonSize: size,
+            buttonVariant: variant,
             leftAddons,
             rightAddons,
         }, Optgroup: Optgroup$1, OptionsList: OptionsList$1, className: cn(styles.container, className), popperClassName: cn(styles.optionsPopover, popperClassName, {
             [styles.sideGap]: isSideGap,
-        }), optionsListClassName: cn(styles.optionsListContainer, optionsListClassName), selected: [], closeOnSelect: true })));
+        }), optionsListClassName: cn(styles.optionsListContainer, optionsListClassName), optionClassName: cn(styles.option, optionClassName), selected: [], closeOnSelect: true })));
 });
 
 export { PickerButton };

package/dist/modern/field/Component.d.ts

@@ -5,7 +5,7 @@ import React from "react";
 import { ReactNode, FC, RefAttributes, AriaAttributes, FocusEvent, MouseEvent, ReactElement, CSSProperties, MutableRefObject, InputHTMLAttributes, ChangeEvent } from "react";
 import { CSSTransitionProps } from "react-transition-group/CSSTransition";
 import { BasePlacement, VariationPlacement } from "@popperjs/core";
-import { PickerButtonSize } from "../index";
+import { PickerButtonSize, PickerButtonVariant } from "../Component";
 type RefElement = HTMLElement | null;
 type Position = BasePlacement | VariationPlacement;
 type PopoverProps = {
@@ -707,6 +707,7 @@ type CheckmarkProps = {
 type BaseFieldProps = FieldProps;
 type FieldProps$0 = Omit<BaseFieldProps, 'size' | 'hint' | 'success' | 'error' | 'placeholder'> & ButtonProps & {
     buttonSize?: PickerButtonSize;
+    buttonVariant?: PickerButtonVariant;
 };
-declare const Field: ({ buttonSize, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }: FieldProps$0) => JSX.Element;
+declare const Field: ({ buttonSize, buttonVariant, view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }: FieldProps$0) => JSX.Element;
 export { Field };

package/dist/modern/field/Component.js

@@ -1,22 +1,25 @@
 import React from 'react';
 import cn from 'classnames';
 import { Button } from '@alfalab/core-components-button/dist/modern';
-import { ArrowDownMIcon } from '@alfalab/icons-classic/ArrowDownMIcon';
-import { ArrowDownSIcon } from '@alfalab/icons-classic/ArrowDownSIcon';
+import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownCompactSIcon';
+import '@alfalab/icons-glyph/MoreMIcon';
+import '@alfalab/icons-glyph/MoreSIcon';
+import { getIcon } from '../utils/index.js';
 
-var styles = {"iconContainer":"picker-button__iconContainer_p0806","open":"picker-button__open_p0806"};
+var styles = {"iconContainer":"picker-button__iconContainer_h15km","open":"picker-button__open_h15km"};
 require('./index.css')
 
-const Field = ({ buttonSize = 'm', view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }) => {
-    const Icon = buttonSize === 'xs' ? ArrowDownSIcon : ArrowDownMIcon;
+const Field = ({ buttonSize = 'm', buttonVariant = 'default', view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, valueRenderer, ...restProps }) => {
+    const Icon = getIcon(buttonVariant, buttonSize);
     const { ref, ...restInnerProps } = innerProps;
     const buttonProps = {
         ...restProps,
         ...restInnerProps,
     };
     return (React.createElement("div", { ref: ref },
-        React.createElement(Button, Object.assign({}, buttonProps, { rightAddons: rightAddons ?? (React.createElement("span", { className: cn(styles.iconContainer, open && styles.open) },
-                React.createElement(Icon, { "data-test-id": 'picker-button-icon' }))), block: true, view: view, size: buttonSize, className: cn(styles.component, view === 'primary' && styles.primary, className) }), label)));
+        React.createElement(Button, Object.assign({}, buttonProps, { rightAddons: rightAddons ?? (React.createElement("span", { className: cn(styles.iconContainer, buttonVariant !== 'compact' && open && styles.open) },
+                React.createElement(Icon, { "data-test-id": 'picker-button-icon' }))), block: true, view: view, size: buttonSize, className: cn(styles.component, view === 'primary' && styles.primary, className) }), buttonVariant !== 'compact' && label)));
 };
 
 export { Field };

package/dist/modern/field/index.css

@@ -1,4 +1,4 @@
-/* hash: h1l5h */
+/* hash: a0xav */
 :root {
 
     /* Hard */
@@ -10,10 +10,10 @@
 :root {
     --arrow-transform: rotate(180deg);
 }
-.picker-button__iconContainer_p0806 {
+.picker-button__iconContainer_h15km {
     display: flex;
     transition: transform 0.15s ease-in-out;
 }
-.picker-button__open_p0806 {
+.picker-button__open_h15km {
     transform: var(--arrow-transform);
 }

package/dist/modern/field/index.js

@@ -1,6 +1,9 @@
 import 'react';
 import 'classnames';
 import '@alfalab/core-components-button/dist/modern';
-import '@alfalab/icons-classic/ArrowDownMIcon';
-import '@alfalab/icons-classic/ArrowDownSIcon';
+import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownCompactSIcon';
+import '@alfalab/icons-glyph/MoreMIcon';
+import '@alfalab/icons-glyph/MoreSIcon';
+import '../utils/index.js';
 export { Field } from './Component.js';

package/dist/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: 1qe6w */
+/* hash: 8bi4r */
 :root {
 
     /* Hard */
@@ -9,19 +9,23 @@
 }
 :root {
     --gap-xs: 8px;
+    --gap-m: 16px;
 }
 :root {
     --border-radius-s: 4px;
 }
-.picker-button__container_12ijs {
+.picker-button__container_lu5mb {
     min-width: auto;
 }
-.picker-button__optionsPopover_12ijs {
+.picker-button__optionsPopover_lu5mb {
     padding: var(--gap-xs) 0
 }
-.picker-button__optionsPopover_12ijs.picker-button__sideGap_12ijs {
+.picker-button__optionsPopover_lu5mb.picker-button__sideGap_lu5mb {
         padding: 0 var(--gap-xs);
     }
-.picker-button__optionsListContainer_12ijs {
+.picker-button__optionsListContainer_lu5mb {
     border-radius: var(--border-radius-s);
 }
+.picker-button__option_lu5mb {
+    padding: 0 var(--gap-m);
+}

package/dist/modern/index.js

@@ -2,7 +2,10 @@ import 'react';
 import 'classnames';
 import '@alfalab/core-components-select/dist/modern';
 import '@alfalab/core-components-button/dist/modern';
-import '@alfalab/icons-classic/ArrowDownMIcon';
-import '@alfalab/icons-classic/ArrowDownSIcon';
+import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownCompactSIcon';
+import '@alfalab/icons-glyph/MoreMIcon';
+import '@alfalab/icons-glyph/MoreSIcon';
+import './utils/index.js';
 import './field/Component.js';
 export { PickerButton } from './Component.js';

package/dist/modern/utils/index.d.ts

@@ -0,0 +1,4 @@
+import { FC, SVGProps } from 'react';
+import { PickerButtonVariant } from "../index";
+declare const getIcon: (variant: PickerButtonVariant, size: "s" | "xxs" | "xs" | "m" | "l" | "xl") => FC<SVGProps<SVGSVGElement>>;
+export { getIcon };

package/dist/modern/utils/index.js

@@ -0,0 +1,13 @@
+import { ChevronDownMIcon } from '@alfalab/icons-glyph/ChevronDownMIcon';
+import { ChevronDownCompactSIcon } from '@alfalab/icons-glyph/ChevronDownCompactSIcon';
+import { MoreMIcon } from '@alfalab/icons-glyph/MoreMIcon';
+import { MoreSIcon } from '@alfalab/icons-glyph/MoreSIcon';
+
+const getIcon = (variant, size) => {
+    if (variant === 'compact') {
+        return size === 'xxs' ? MoreSIcon : MoreMIcon;
+    }
+    return size === 'xxs' ? ChevronDownCompactSIcon : ChevronDownMIcon;
+};
+
+export { getIcon };

package/dist/utils/index.d.ts

@@ -0,0 +1,4 @@
+import { FC, SVGProps } from 'react';
+import { PickerButtonVariant } from "../index";
+declare const getIcon: (variant: PickerButtonVariant, size: "s" | "xxs" | "xs" | "m" | "l" | "xl") => FC<SVGProps<SVGSVGElement>>;
+export { getIcon };

package/dist/utils/index.js

@@ -0,0 +1,17 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ChevronDownMIcon = require('@alfalab/icons-glyph/ChevronDownMIcon');
+var ChevronDownCompactSIcon = require('@alfalab/icons-glyph/ChevronDownCompactSIcon');
+var MoreMIcon = require('@alfalab/icons-glyph/MoreMIcon');
+var MoreSIcon = require('@alfalab/icons-glyph/MoreSIcon');
+
+var getIcon = function (variant, size) {
+    if (variant === 'compact') {
+        return size === 'xxs' ? MoreSIcon.MoreSIcon : MoreMIcon.MoreMIcon;
+    }
+    return size === 'xxs' ? ChevronDownCompactSIcon.ChevronDownCompactSIcon : ChevronDownMIcon.ChevronDownMIcon;
+};
+
+exports.getIcon = getIcon;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-picker-button",
-    "version": "7.5.0",
+    "version": "7.6.0",
     "description": "Picker button component",
     "keywords": [],
     "license": "MIT",
@@ -20,10 +20,10 @@
     },
     "dependencies": {
         "@alfalab/core-components-button": "^5.1.1",
-        "@alfalab/core-components-select": "^10.5.0",
+        "@alfalab/core-components-select": "^10.6.0",
         "@alfalab/icons-classic": "^1.76.0",
-        "@alfalab/icons-glyph": "^2.14.0",
+        "@alfalab/icons-glyph": "^2.15.0",
         "classnames": "^2.2.6"
     },
-    "gitHead": "ddf4fab6035139cf412e0acb7174ef388f23e4f2"
+    "gitHead": "e2a33a61248e7a64a8f7a857a59f8beaf7234f93"
 }