@alfalab/core-components-custom-picker-button 1.0.7 → 2.0.0

package/modern/{Component-2aef4eba.d.ts → desktop-d446ae02.d.ts}

@@ -1,12 +1,11 @@
 /// <reference types="react" />
-import React from 'react';
+import React from "react";
 import { FC, SVGProps } from "react";
-import { ButtonProps } from "./index-ebda875c";
-import { BaseSelectProps } from "./index-3e68f8db";
-type PickerButtonSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
-type PickerButtonVariant = 'default' | 'compact';
-type PickerButtonDesktopProps = Omit<BaseSelectProps, 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'hint' | 'allowUnselect' | 'options'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
-    options: Array<BaseSelectProps['options'][0] & {
+import { ButtonProps } from "./index-8b2c2707";
+import { BaseSelectProps } from "./shared-4cd3936b";
+import { PickerButtonSize, PickerButtonVariant } from "./types-4480ac4f";
+type PickerButtonDesktopProps = Omit<BaseSelectProps, "placeholder" | "Arrow" | "autocomplete" | "size" | "onFocus" | "selected" | "closeOnSelect" | "multiple" | "hint" | "allowUnselect" | "options"> & Pick<ButtonProps, "view" | "loading" | "leftAddons" | "rightAddons"> & {
+    options: Array<BaseSelectProps["options"][0] & {
         /**
          * Иконка, отображающаяся слева от текстового представления пункта
          */
@@ -27,24 +26,14 @@ type PickerButtonDesktopProps = Omit<BaseSelectProps, 'placeholder' | 'Arrow' |
     showArrow?: boolean;
 };
 declare const PickerButtonDesktop: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "size" | "placeholder" | "onFocus" | "selected" | "multiple" | "hint" | "options" | "autocomplete" | "allowUnselect" | "closeOnSelect" | "Arrow"> & Pick<ButtonProps, "view" | "leftAddons" | "rightAddons" | "loading"> & {
-    options: Array<BaseSelectProps['options'][0] & {
+    options: Array<BaseSelectProps["options"][0] & {
         /**
          * Иконка, отображающаяся слева от текстового представления пункта
          */
         icon?: FC<SVGProps<SVGSVGElement>>;
     }>;
-    /**
-     * Размер кнопки
-     */
     size?: PickerButtonSize | undefined;
-    /**
-     * Тип кнопки
-     */
     variant?: PickerButtonVariant | undefined;
-    /**
-     * Показывать стрелку
-     * @default true
-     */
     showArrow?: boolean | undefined;
 } & React.RefAttributes<HTMLInputElement>>;
-export { PickerButtonSize, PickerButtonVariant, PickerButtonDesktopProps, PickerButtonDesktop };
+export { PickerButtonDesktopProps, PickerButtonDesktop };

package/modern/desktop.d.ts

@@ -1,2 +1,2 @@
-export * from "./Component.desktop";
+export { CustomPickerButtonDesktop, CustomPickerButtonDesktopProps } from "./Component.desktop";
 export {};

package/modern/desktop.js

@@ -4,4 +4,4 @@ import '@alfalab/core-components-picker-button/modern/desktop';
 import './field/Component.js';
 import 'classnames';
 import '@alfalab/core-components-custom-button/modern';
-import '@alfalab/core-components-picker-button/modern';
+import '@alfalab/core-components-picker-button/modern/shared';

package/modern/field/Component.d.ts

@@ -1,8 +1,7 @@
 /// <reference types="react" />
 import React from 'react';
 import { CustomButtonProps } from "@alfalab/core-components-custom-button";
-import { PickerButtonSize, PickerButtonVariant } from "../index-2aef4eba";
-import { FieldProps as BaseFieldProps } from "../typings-5e1b8383";
+import { FieldProps as BaseFieldProps } from "../shared-4cd3936b";
 type FieldProps = Pick<BaseFieldProps, 'open' | 'label' | 'innerProps'> & CustomButtonProps & {
     buttonSize?: PickerButtonSize;
     buttonVariant?: PickerButtonVariant;

package/modern/field/Component.js

@@ -1,9 +1,9 @@
 import React, { Fragment } from 'react';
 import cn from 'classnames';
 import { CustomButton } from '@alfalab/core-components-custom-button/modern';
-import { getIcon } from '@alfalab/core-components-picker-button/modern';
+import { getIcon } from '@alfalab/core-components-picker-button/modern/shared';
 
-const styles = {"iconContainer":"custom-picker-button__iconContainer_1otdn","addonsContainer":"custom-picker-button__addonsContainer_1otdn","showControlIcon":"custom-picker-button__showControlIcon_1otdn","open":"custom-picker-button__open_1otdn"};
+const styles = {"iconContainer":"custom-picker-button__iconContainer_9jivq","addonsContainer":"custom-picker-button__addonsContainer_9jivq","showControlIcon":"custom-picker-button__showControlIcon_9jivq","open":"custom-picker-button__open_9jivq"};
 require('./index.css')
 
 const Field = ({ buttonSize = 'm', buttonVariant = 'default', backgroundColor, contentColor, stateType, label, open, rightAddons, innerProps, className, showArrow = true, ...restProps }) => {

package/modern/field/index.css

@@ -1,4 +1,4 @@
-/* hash: tncvo */
+/* hash: ncege */
 :root {
 } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -16,13 +16,13 @@
 } :root {
 } :root {
     --arrow-transform: rotate(180deg);
-} .custom-picker-button__iconContainer_1otdn {
+} .custom-picker-button__iconContainer_9jivq {
     display: flex;
     transition: transform 0.15s ease-in-out;
-} .custom-picker-button__addonsContainer_1otdn {
+} .custom-picker-button__addonsContainer_9jivq {
     display: flex
-} .custom-picker-button__addonsContainer_1otdn.custom-picker-button__showControlIcon_1otdn {
+} .custom-picker-button__addonsContainer_9jivq.custom-picker-button__showControlIcon_9jivq {
         margin-right: var(--gap-2xs);
-    } .custom-picker-button__open_1otdn {
+    } .custom-picker-button__open_9jivq {
     transform: var(--arrow-transform);
 }

package/modern/field/index.js

@@ -2,4 +2,4 @@ export { Field } from './Component.js';
 import 'react';
 import 'classnames';
 import '@alfalab/core-components-custom-button/modern';
-import '@alfalab/core-components-picker-button/modern';
+import '@alfalab/core-components-picker-button/modern/shared';

package/modern/{hook-3e68f8db.d.ts → hook-9ea9e32c.d.ts}

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { BaseSelectProps, OptionShape } from "./index-3e68f8db";
+import { BaseSelectProps, OptionShape } from "./typings-5e1b8383";
 type UseSelectWithApplyProps = {
     /**
      * Список выбранных пунктов
@@ -36,18 +36,20 @@ type UseSelectWithApplyProps = {
 };
 declare const SELECT_ALL_KEY = "select_all";
 declare function useSelectWithApply({ options, selected, onChange, OptionsList, optionsListProps, showClear, showSelectAll, showHeaderWithSelectAll, }: UseSelectWithApplyProps): {
-    OptionsList: import("react").ForwardRefExoticComponent<import("./index-3e68f8db").OptionsListProps & {
+    OptionsList: import("react").ForwardRefExoticComponent<import("./typings-5e1b8383").OptionsListProps & {
         showClear?: boolean | undefined;
         onClose?: (() => void) | undefined;
         selectedDraft?: OptionShape[] | undefined;
-        OptionsList?: import("react").FC<import("./index-3e68f8db").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
-        Footer?: import("react").FC<import("./Component-ebda875c").FooterProps> | undefined;
+        OptionsList?: import("react").FC<import("./typings-5e1b8383").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
+        Footer?: import("react").FC<import("./Component-5e1b8383").FooterProps> | undefined;
         Header?: import("react").FC<import("./Component-ebda875c").HeaderProps> | undefined;
-        headerProps?: import("./Component-ebda875c").HeaderProps | undefined;
+        headerProps?: import("./Component-ebda875c").HeaderProps | undefined; /**
+         * Показывать кнопку очистки
+         */
         showHeaderWithSelectAll?: boolean | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
     optionsListProps: {
-        OptionsList: import("react").FC<import("./index-3e68f8db").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
+        OptionsList: import("react").FC<import("./typings-5e1b8383").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
         showClear: boolean;
         onClear: () => void;
         onApply: () => void;
@@ -62,11 +64,11 @@ declare function useSelectWithApply({ options, selected, onChange, OptionsList,
     };
     allowUnselect: boolean;
     multiple: boolean;
-    options: (OptionShape | import("./index-3e68f8db").GroupShape | {
+    options: (OptionShape | import("./typings-5e1b8383").GroupShape | {
         key: string;
         content: string;
     })[];
-    onChange: (payload: import("./index-3e68f8db").BaseSelectChangePayload) => void;
+    onChange: (payload: import("./typings-5e1b8383").BaseSelectChangePayload) => void;
     selected: string | OptionShape | (string | OptionShape)[] | null | undefined;
 };
 export * from "./Component-5e1b8383";

package/modern/{index-3885b0d7.d.ts → index-89a3cf4c.d.ts}

@@ -1,3 +1,3 @@
-declare const getDataTestId: (dataTestId?: string, element?: string) => string | undefined;
 declare const isClient: () => boolean;
-export { getDataTestId, isClient };
+declare const getDataTestId: (dataTestId?: string, element?: string) => string | undefined;
+export { isClient, getDataTestId };

package/modern/index-8b2c2707.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import React from "react";
+import { ButtonProps } from "./typings-9211a437";
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
+export { Button };
+export type { ButtonProps } from "./typings-9211a437";

package/modern/index-c44170fe.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import React from "react";
+type InputProps = Omit<BaseInputProps, "FormControlComponent" | "colorStyles"> & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+    /**
+     * Значение по-умолчанию для хука useMatchMedia
+     */
+    defaultMatchMediaValue?: boolean | (() => boolean);
+};
+declare const Input: React.ForwardRefExoticComponent<Omit<BaseInputProps, "FormControlComponent" | "colorStyles"> & {
+    breakpoint?: number | undefined;
+    defaultMatchMediaValue?: boolean | (() => boolean) | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
+type InputDesktopProps = Omit<BaseInputProps, "FormControlComponent" | "colorStyles">;
+declare const InputDesktop: React.ForwardRefExoticComponent<InputDesktopProps & React.RefAttributes<HTMLInputElement>>;
+type InputMobileProps = Omit<BaseInputProps, "FormControlComponent" | "colorStyles">;
+declare const InputMobile: React.ForwardRefExoticComponent<InputMobileProps & React.RefAttributes<HTMLInputElement>>;
+export { InputProps, Input, InputDesktopProps, InputDesktop, InputMobileProps, InputMobile };
+export * from "./Component.desktop-785df74d";

package/modern/{index-701e77da.d.ts → index-df3978fd.d.ts}

@@ -1,4 +1,4 @@
 import { FC, SVGProps } from 'react';
-import { PickerButtonSize, PickerButtonVariant } from "./index-2aef4eba";
+import { PickerButtonSize, PickerButtonVariant } from "./types-4480ac4f";
 declare const getIcon: (variant: PickerButtonVariant, size: PickerButtonSize) => FC<SVGProps<SVGSVGElement>>;
 export { getIcon };

package/modern/index-e81c389f.d.ts

@@ -1,3 +1,3 @@
-export * from "./Component-3885b0d7";
+export * from "./Component-89a3cf4c";
 export * from "./index-ebda875c";
 export type { NavigationBarProps } from "./types-ebda875c";

package/modern/index-ebda875c.d.ts

@@ -34,4 +34,4 @@ interface CloserProps extends ButtonHTMLAttributes<HTMLButtonElement> {
 }
 declare const Closer: FC<CloserProps>;
 export { CloserProps, Closer };
-export * from "./Component-ebda875c";
+export * from "./Component-8b2c2707";

package/modern/index-f12ee135.d.ts

@@ -1,3 +1,3 @@
-export * from "./component-3885b0d7";
-export type { BottomSheetProps, BottomSheetTitleAlign } from "./types-3441be57";
-export { CLOSE_OFFSET, HEADER_OFFSET } from "./utils-b64479aa";
+export * from "./component-89a3cf4c";
+export type { BottomSheetProps, BottomSheetTitleAlign } from "./types-d9f9bbcc";
+export { CLOSE_OFFSET, HEADER_OFFSET } from "./utils-49cc3c24";

package/modern/index.d.ts

@@ -1,2 +1,2 @@
-export { CustomPickerButtonResponsive as CustomPickerButton } from "./responsive";
-export type { CustomPickerButtonResponsiveProps as CustomPickerButtonProps } from "./responsive";
+export { CustomPickerButtonResponsive as CustomPickerButton, CustomPickerButtonResponsiveProps as CustomPickerButtonProps } from "./Component.responsive";
+export {};

package/modern/index.js

@@ -6,6 +6,6 @@ import '@alfalab/core-components-picker-button/modern/desktop';
 import './field/Component.js';
 import 'classnames';
 import '@alfalab/core-components-custom-button/modern';
-import '@alfalab/core-components-picker-button/modern';
+import '@alfalab/core-components-picker-button/modern/shared';
 import './Component.mobile.js';
 import '@alfalab/core-components-picker-button/modern/mobile';

package/modern/mobile-755fbaa3.d.ts

@@ -0,0 +1,2 @@
+export * from "./Component.mobile-755fbaa3";
+export {};

package/modern/mobile-96988a65.d.ts

@@ -0,0 +1,2 @@
+export * from "./Component.mobile-d7e9f69d";
+export {};

package/modern/mobile.d.ts

@@ -1,2 +1,2 @@
-export * from "./Component.mobile";
+export { CustomPickerButtonMobile, CustomPickerButtonMobileProps } from "./Component.mobile";
 export {};

package/modern/mobile.js

@@ -4,4 +4,4 @@ import '@alfalab/core-components-picker-button/modern/mobile';
 import './field/Component.js';
 import 'classnames';
 import '@alfalab/core-components-custom-button/modern';
-import '@alfalab/core-components-picker-button/modern';
+import '@alfalab/core-components-picker-button/modern/shared';

package/{index-3e68f8db.d.ts → modern/shared-4cd3936b.d.ts}

@@ -1,18 +1,7 @@
 /// <reference types="react" />
 import React from "react";
 import { ReactNode } from "react";
-import { FormControlProps } from "./Component-3ebe4754";
 import { BaseSelectProps, OptionProps, OptionShape } from "./typings-5e1b8383";
-type SelectFieldProps = Omit<FormControlProps, "size"> & Record<string, unknown>;
-type SelectProps = Omit<BaseSelectProps, "fieldProps"> & {
-    /**
-     * Пропсы, которые будут прокинуты в компонент поля
-     */
-    fieldProps?: SelectFieldProps;
-};
-declare const Select: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "fieldProps"> & {
-    fieldProps?: SelectFieldProps | undefined;
-} & React.RefAttributes<HTMLDivElement>>;
 // eslint-disable-next-line @typescript-eslint/naming-convention
 type useSelectWithLoadingProps = {
     loading?: boolean;
@@ -81,6 +70,10 @@ type SkeletonProps = {
      * Дополнительный класс
      */
     className?: string;
+    /**
+     * Дополнительные инлайн стили
+     */
+    style?: React.CSSProperties;
     /**
      * Идентификатор для систем автоматизированного тестирования
      */
@@ -91,10 +84,11 @@ type SkeletonProps = {
     children?: ReactNode;
 };
 declare const Skeleton: React.FC<SkeletonProps>;
-export { SelectFieldProps, SelectProps, Select, useSelectWithLoading, useLazyLoading, SkeletonProps, Skeleton };
 export * from "./index-ebda875c";
-export * from "./Component-3885b0d7";
+export * from "./Component-89a3cf4c";
 export * from "./Component-5e1b8383";
-export * from "./hook-3e68f8db";
+export { useSelectWithLoading, useLazyLoading, SkeletonProps, Skeleton };
+export * from "./hook-9ea9e32c";
 export * from "./typings-5e1b8383";
 export * from "./utils-5e1b8383";
+export type { AdditionalMobileProps } from "./Component.mobile-06ffd24b";

package/modern/types-4480ac4f.d.ts

@@ -0,0 +1,3 @@
+type PickerButtonSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
+type PickerButtonVariant = 'default' | 'compact';
+export { PickerButtonSize, PickerButtonVariant };

package/{cssm/types-3441be57.d.ts → modern/types-d9f9bbcc.d.ts}

@@ -105,6 +105,14 @@ type BottomSheetProps = {
      * @default true
      */
     swipeable?: boolean;
+    /**
+     * Будет ли свайпаться контент
+     */
+    swipeableContent?: boolean;
+    /**
+     * Порог свайпа
+     */
+    swipeThreshold?: number;
     /**
      * Слот слева
      */
@@ -208,17 +216,9 @@ type BottomSheetProps = {
      */
     hideScrollbar?: boolean;
     /**
-     * Обработчик закрытия
-     */
-    onClose: () => void;
-    /**
-     * Обработчик нажатия на стрелку назад
+     * Верхний отступ шторки, если она открыта на максимальную высоту
      */
-    onBack?: () => void;
-    /**
-     * Вызывается после притягивания к одной из `magneticAreas`
-     */
-    onMagnetize?: (index: number) => void;
+    headerOffset?: number;
     /**
      * Содержимое bottom-sheet всегда в DOM
      */
@@ -235,5 +235,25 @@ type BottomSheetProps = {
      * Отключает вызов `onClose` при нажатии Escape
      */
     disableEscapeKeyDown?: boolean;
+    /**
+     * Обработчик закрытия
+     */
+    onClose: () => void;
+    /**
+     * Обработчик нажатия на стрелку назад
+     */
+    onBack?: () => void;
+    /**
+     * Вызывается в начале анимации притягивания к одной из `magneticAreas`
+     */
+    onMagnetize?: (index: number) => void;
+    /**
+     * Вызывается после окончания анимации притягивания
+     */
+    onMagnetizeEnd?: () => void;
+    /**
+     * Вызывается при изменении положения шторки
+     */
+    onOffsetChange?: (offset: number, percent: number) => void;
 };
 export { BottomSheetTitleAlign, BottomSheetProps };

package/modern/typings-5e1b8383.d.ts

@@ -1,5 +1,6 @@
 import { AriaAttributes, FC, FocusEvent, MouseEvent, ReactElement, ReactNode, RefAttributes, SVGProps } from 'react';
-import { InputProps, PopoverProps } from "./index-ebda875c";
+import { InputProps } from "./index-c44170fe";
+import { PopoverProps } from "./index-ebda875c";
 type AnyObject = Record<string, any>;
 type OptionShape = {
     /**

package/modern/typings-9211a437.d.ts

@@ -0,0 +1,95 @@
+import { AnchorHTMLAttributes, ButtonHTMLAttributes, ElementType, ReactNode } from 'react';
+type StyleColors = {
+    default: {
+        [key: string]: string;
+    };
+    inverted: {
+        [key: string]: string;
+    };
+};
+type ComponentProps = {
+    /**
+     * Тип кнопки
+     * @default secondary
+     */
+    view?: 'accent' | 'primary' | 'secondary' | 'tertiary' | 'outlined' | 'filled' | 'transparent' | 'link' | 'ghost';
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: ReactNode;
+    /**
+     * Размер компонента
+     * @default m
+     */
+    size?: 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
+    /**
+     * Растягивает компонент на ширину контейнера
+     * @default false
+     */
+    block?: boolean;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс для спиннера
+     */
+    spinnerClassName?: string;
+    /**
+     * Выводит ссылку в виде кнопки
+     */
+    href?: string;
+    /**
+     * Позволяет использовать кастомный компонент для кнопки (например Link из роутера)
+     */
+    Component?: ElementType;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Показать лоадер
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Не переносить текст кнопки на новую строку
+     * @default false
+     */
+    nowrap?: boolean;
+    /**
+     * Набор цветов для компонента
+     */
+    colors?: 'default' | 'inverted';
+    /**
+     * Дочерние элементы.
+     */
+    children?: ReactNode;
+    /**
+     * Основные стили компонента.
+     */
+    styles: {
+        [key: string]: string;
+    };
+    /**
+     * Стили компонента для default и inverted режима.
+     */
+    colorStylesMap: StyleColors;
+};
+type AnchorBaseButtonProps = ComponentProps & AnchorHTMLAttributes<HTMLAnchorElement>;
+type NativeBaseButtonProps = ComponentProps & ButtonHTMLAttributes<HTMLButtonElement>;
+type BaseButtonProps = Partial<AnchorBaseButtonProps | NativeBaseButtonProps>;
+type AnchorButtonProps = Omit<BaseButtonProps, 'styles' | 'colorStylesMap'> & AnchorHTMLAttributes<HTMLAnchorElement>;
+type NativeButtonProps = Omit<BaseButtonProps, 'styles' | 'colorStylesMap'> & ButtonHTMLAttributes<HTMLButtonElement>;
+type ButtonProps = Partial<AnchorButtonProps | NativeButtonProps> & {
+    /**
+     * Контрольная точка, с нее начинается desktop версия
+     * @default 1024
+     */
+    breakpoint?: number;
+};
+export { StyleColors, ComponentProps, AnchorBaseButtonProps, NativeBaseButtonProps, BaseButtonProps, AnchorButtonProps, NativeButtonProps, ButtonProps };

package/modern/{utils-b64479aa.d.ts → utils-49cc3c24.d.ts}

@@ -1,8 +1,8 @@
 declare const TIMEOUT = 500;
 declare const SWIPE_VELOCITY = 0.4;
 declare const MARKER_HEIGHT = 24;
-declare const HEADER_OFFSET = 24;
 declare const CLOSE_OFFSET = 0.2;
 declare const SCROLL_OFFSET = 1;
-declare const convertPercentToNumber: (value: string | number, fullHeight: number) => number;
-export { TIMEOUT, SWIPE_VELOCITY, MARKER_HEIGHT, HEADER_OFFSET, CLOSE_OFFSET, SCROLL_OFFSET, convertPercentToNumber };
+declare const HEADER_OFFSET = 24;
+declare const convertPercentToNumber: (value: string | number, fullHeight: number, headerOffset?: number) => number;
+export { TIMEOUT, SWIPE_VELOCITY, MARKER_HEIGHT, CLOSE_OFFSET, SCROLL_OFFSET, HEADER_OFFSET, convertPercentToNumber };

package/package.json

@@ -1,11 +1,31 @@
 {
     "name": "@alfalab/core-components-custom-picker-button",
-    "version": "1.0.7",
+    "version": "2.0.0",
     "description": "Custom picker button component",
     "keywords": [],
     "license": "MIT",
     "main": "index.js",
     "module": "./esm/index.js",
+    "exports": {
+        ".": {
+            "import": "./esm/index.js",
+            "require": "./index.js"
+        },
+        "./mobile": {
+            "import": "./esm/mobile.js",
+            "require": "./mobile.js"
+        },
+        "./desktop": {
+            "import": "./esm/desktop.js",
+            "require": "./desktop.js"
+        },
+        "./esm": "./esm/index.js",
+        "./cssm": "./cssm/index.js",
+        "./modern": "./modern/index.js",
+        "./esm/*": "./esm/*",
+        "./cssm/*": "./cssm/*",
+        "./modern/*": "./modern/*"
+    },
     "publishConfig": {
         "access": "public",
         "directory": "dist"
@@ -15,9 +35,9 @@
         "react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"
     },
     "dependencies": {
-        "@alfalab/core-components-picker-button": "^10.3.30",
-        "@alfalab/core-components-custom-button": "^3.2.2",
-        "@alfalab/core-components-mq": "^4.1.5",
+        "@alfalab/core-components-picker-button": "^11.0.0",
+        "@alfalab/core-components-custom-button": "^3.3.0",
+        "@alfalab/core-components-mq": "^4.2.0",
         "classnames": "^2.3.1",
         "tslib": "^2.4.0"
     }

package/{modern/index-3e68f8db.d.ts → shared-4cd3936b.d.ts}

@@ -1,18 +1,7 @@
 /// <reference types="react" />
 import React from "react";
 import { ReactNode } from "react";
-import { FormControlProps } from "./Component-3ebe4754";
 import { BaseSelectProps, OptionProps, OptionShape } from "./typings-5e1b8383";
-type SelectFieldProps = Omit<FormControlProps, "size"> & Record<string, unknown>;
-type SelectProps = Omit<BaseSelectProps, "fieldProps"> & {
-    /**
-     * Пропсы, которые будут прокинуты в компонент поля
-     */
-    fieldProps?: SelectFieldProps;
-};
-declare const Select: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "fieldProps"> & {
-    fieldProps?: SelectFieldProps | undefined;
-} & React.RefAttributes<HTMLDivElement>>;
 // eslint-disable-next-line @typescript-eslint/naming-convention
 type useSelectWithLoadingProps = {
     loading?: boolean;
@@ -81,6 +70,10 @@ type SkeletonProps = {
      * Дополнительный класс
      */
     className?: string;
+    /**
+     * Дополнительные инлайн стили
+     */
+    style?: React.CSSProperties;
     /**
      * Идентификатор для систем автоматизированного тестирования
      */
@@ -91,10 +84,11 @@ type SkeletonProps = {
     children?: ReactNode;
 };
 declare const Skeleton: React.FC<SkeletonProps>;
-export { SelectFieldProps, SelectProps, Select, useSelectWithLoading, useLazyLoading, SkeletonProps, Skeleton };
 export * from "./index-ebda875c";
-export * from "./Component-3885b0d7";
+export * from "./Component-89a3cf4c";
 export * from "./Component-5e1b8383";
-export * from "./hook-3e68f8db";
+export { useSelectWithLoading, useLazyLoading, SkeletonProps, Skeleton };
+export * from "./hook-9ea9e32c";
 export * from "./typings-5e1b8383";
 export * from "./utils-5e1b8383";
+export type { AdditionalMobileProps } from "./Component.mobile-06ffd24b";

package/src/Component.desktop.tsx

@@ -0,0 +1,42 @@
+import React, { forwardRef } from 'react';
+
+import type { CustomButtonProps } from '@alfalab/core-components-custom-button';
+import {
+    PickerButtonDesktop,
+    PickerButtonDesktopProps,
+} from '@alfalab/core-components-picker-button/desktop';
+
+import { Field as DefaultField } from './field';
+
+const DEFAULT_BUTTON_COLOR = '#FF45C3';
+const DEFAULT_CONTENT_COLOR = 'white';
+
+export type CustomPickerButtonDesktopProps = Omit<PickerButtonDesktopProps, 'view' | 'colors'> &
+    Pick<CustomButtonProps, 'backgroundColor' | 'contentColor' | 'stateType'>;
+
+export const CustomPickerButtonDesktop = forwardRef<
+    HTMLInputElement,
+    CustomPickerButtonDesktopProps
+>(
+    (
+        {
+            backgroundColor = DEFAULT_BUTTON_COLOR,
+            contentColor = DEFAULT_CONTENT_COLOR,
+            stateType = 'darkening',
+            ...restProps
+        },
+        ref,
+    ) => (
+        <PickerButtonDesktop
+            {...restProps}
+            fieldProps={{
+                backgroundColor,
+                contentColor,
+                stateType,
+                breakpoint: 1,
+            }}
+            Field={DefaultField}
+            ref={ref}
+        />
+    ),
+);