@ozen-ui/kit 0.79.0 → 0.80.0

package/__inner__/cjs/components/ChipNext/types.d.ts

@@ -1,17 +1,7 @@
-import type { ElementType, MouseEvent, ReactNode } from 'react';
-import type { IconProps } from '@ozen-ui/icons';
+import type { ComponentRef, ElementType, ReactNode } from 'react';
 import type { PolymorphicComponentPropsWithRef } from '../../utils/polymorphicComponentWithRef';
-import type { RenderContentType } from '../../utils/renderContent';
 import type { CHIP_DEFAULT_TAG } from './constants';
-export declare const chipColorVariant: readonly ["primary", "secondary", "main", "overlay"];
-export type ChipColorVariant = (typeof chipColorVariant)[number];
-export declare const chipSizeVariant: readonly ["xs", "s", "m", "l"];
-export type ChipSizeVariant = (typeof chipSizeVariant)[number];
-export type ChipIcon = RenderContentType<IconProps>['content'];
-export type ChipOnClick = (event: MouseEvent<HTMLElement>, payload: {
-    checked: boolean;
-    value: string | undefined;
-}) => void;
+import type { ChipColorVariant, ChipSizeVariant, ChipOnClick, ChipIcon } from './entities';
 export type ChipBaseProps = {
     /** Размер компонента */
     size?: ChipSizeVariant;
@@ -39,3 +29,4 @@ export type ChipBaseProps = {
     'data-testid'?: string;
 };
 export type ChipProps<As extends ElementType = typeof CHIP_DEFAULT_TAG> = PolymorphicComponentPropsWithRef<ChipBaseProps, As>;
+export type ChipRef<As extends ElementType = typeof CHIP_DEFAULT_TAG> = ComponentRef<As>;

package/__inner__/cjs/components/ChipNext/types.js

@@ -1,12 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.chipSizeVariant = exports.chipColorVariant = void 0;
-// ---- COLOR ----
-exports.chipColorVariant = [
-    'primary',
-    'secondary',
-    'main',
-    'overlay',
-];
-// ---- SIZE ----
-exports.chipSizeVariant = ['xs', 's', 'm', 'l'];

package/__inner__/cjs/components/DatePicker/components/DatePickerRenderRight/DatePickerRenderRight.js

@@ -17,7 +17,7 @@ var DatePickerRenderRight = function (_a) {
         onClear === null || onClear === void 0 ? void 0 : onClear(e);
     };
     return (react_1.default.createElement("div", { className: (0, index_1.cnDatePicker)('RenderRight') },
-        !disableClearButton && (react_1.default.createElement(IconButtonNext_1.IconButton, { size: size, type: "button", tabIndex: -1, icon: icons_1.CrossIcon, title: clearText, variant: "function", onClick: handleClear, "aria-label": clearText, className: (0, index_1.cnDatePicker)('ClearButton', {
+        !disableClearButton && (react_1.default.createElement(IconButtonNext_1.IconButton, { size: size, type: "button", tabIndex: -1, icon: icons_1.CrossIcon, title: clearText, variant: "function", color: "tertiary", onClick: handleClear, "aria-label": clearText, className: (0, index_1.cnDatePicker)('ClearButton', {
                 visibility: isVisibleClearButton,
             }), compressed: true })),
         react_1.default.createElement(FieldIcon_1.FieldIcon, { icon: renderRight }),

package/__inner__/cjs/components/DialogNext/Dialog.d.ts

@@ -5,6 +5,7 @@ import './modules/DialogBody/DialogBody.css';
 import './modules/DialogFooter/DialogFooter.css';
 import './modules/DialogFooterButtonsGroup/DialogFooterButtonsGroup.css';
 import './modules/DialogHeader/DialogHeader.css';
+import './modules/DialogIllustration/DialogIllustration.css';
 import './modules/DialogSubtitle/DialogSubtitle.css';
 import './modules/DialogTitle/DialogTitle.css';
 import React from 'react';

package/__inner__/cjs/components/DialogNext/Dialog.js

@@ -9,6 +9,7 @@ require("./modules/DialogBody/DialogBody.css");
 require("./modules/DialogFooter/DialogFooter.css");
 require("./modules/DialogFooterButtonsGroup/DialogFooterButtonsGroup.css");
 require("./modules/DialogHeader/DialogHeader.css");
+require("./modules/DialogIllustration/DialogIllustration.css");
 require("./modules/DialogSubtitle/DialogSubtitle.css");
 require("./modules/DialogTitle/DialogTitle.css");
 var react_1 = tslib_1.__importStar(require("react"));

package/__inner__/cjs/components/DialogNext/components/DialogBottomSheet/DialogBottomSheet.d.ts

@@ -9,4 +9,5 @@ export declare const DialogBottomSheet: React.ForwardRefExoticComponent<{
     hideCloseButton: boolean | undefined;
     className: string | undefined;
     onClose: (() => void) | undefined;
-} & Omit<Omit<import("../../../BottomSheetBase").BottomSheetBaseProps, "snaps">, "className" | "size" | "open" | "variant" | "onClose" | "hideCloseButton" | "closeButton"> & React.RefAttributes<HTMLDivElement>>;
+    headerProps?: Omit<import("../../../BottomSheetBase").BottomSheetBaseHeaderProps, "children">;
+} & Omit<Omit<import("../../../BottomSheetBase").BottomSheetBaseProps, "snaps">, "className" | "size" | "open" | "variant" | "onClose" | "hideCloseButton" | "closeButton" | "headerProps"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/cjs/components/DialogNext/components/DialogBottomSheet/DialogBottomSheet.js

@@ -9,11 +9,11 @@ var BottomSheetBase_1 = require("../../../BottomSheetBase");
 var constants_1 = require("./constants");
 exports.cnDialogBottomSheet = (0, classname_1.cn)('DialogNextBottomSheet');
 exports.DialogBottomSheet = (0, react_1.forwardRef)(function (_a, ref) {
-    var children = _a.children, open = _a.open, closeButton = _a.closeButton, onClose = _a.onClose, size = _a.size, variant = _a.variant, className = _a.className, hideCloseButton = _a.hideCloseButton, other = tslib_1.__rest(_a, ["children", "open", "closeButton", "onClose", "size", "variant", "className", "hideCloseButton"]);
+    var children = _a.children, open = _a.open, closeButton = _a.closeButton, onClose = _a.onClose, size = _a.size, variant = _a.variant, className = _a.className, hideCloseButton = _a.hideCloseButton, headerProps = _a.headerProps, other = tslib_1.__rest(_a, ["children", "open", "closeButton", "onClose", "size", "variant", "className", "hideCloseButton", "headerProps"]);
     return (react_1.default.createElement(BottomSheetBase_1.BottomSheetBase, tslib_1.__assign({ ref: ref, className: (0, exports.cnDialogBottomSheet)({
             size: size,
         }, [className]), bottomSheetClassName: (0, exports.cnDialogBottomSheet)('BottomSheet'), snaps: constants_1.DIALOG_BOTTOM_SHEET_SNAPS_BY_VARIANT[variant], maxHeight: constants_1.DIALOG_BOTTOM_SHEET_MAX_HEIGHT_BY_VARIANT[variant], open: open, onClose: onClose, role: "dialog" }, other),
-        react_1.default.createElement(BottomSheetBase_1.BottomSheetBaseHeader, { className: (0, exports.cnDialogBottomSheet)('Header') }, !hideCloseButton && (react_1.default.createElement("div", { className: (0, exports.cnDialogBottomSheet)('CloseButton') }, closeButton))),
+        react_1.default.createElement(BottomSheetBase_1.BottomSheetBaseHeader, tslib_1.__assign({}, headerProps, { className: (0, exports.cnDialogBottomSheet)('Header', [headerProps === null || headerProps === void 0 ? void 0 : headerProps.className]) }), !hideCloseButton && (react_1.default.createElement("div", { className: (0, exports.cnDialogBottomSheet)('CloseButton') }, closeButton))),
         children));
 });
 exports.DialogBottomSheet.displayName = 'DialogBottomSheet';

package/__inner__/cjs/components/DialogNext/components/DialogBottomSheet/types.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 import type { ExtendableProps } from '../../../../types/ExtendableProps';
-import type { BottomSheetBaseProps } from '../../../BottomSheetBase';
+import type { BottomSheetBaseHeaderProps, BottomSheetBaseProps } from '../../../BottomSheetBase';
 import type { DialogVariant, DialogSizeAllVariants } from '../../entities';
 import type { DialogRef } from '../../types';
 export type DialogBottomSheetRef = DialogRef;
@@ -12,4 +12,5 @@ export type DialogBottomSheetProps = ExtendableProps<{
     hideCloseButton: boolean | undefined;
     className: string | undefined;
     onClose: (() => void) | undefined;
+    headerProps?: Omit<BottomSheetBaseHeaderProps, 'children'>;
 }, Omit<BottomSheetBaseProps, 'snaps'>>;

package/__inner__/cjs/components/DialogNext/modules/DialogFooter/index.d.ts

@@ -1,3 +1,4 @@
-export * from './DialogFooter';
 export * from './entities';
+export * from './constants';
+export * from './DialogFooter';
 export * from './types';

package/__inner__/cjs/components/DialogNext/modules/DialogFooter/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./DialogFooter"), exports);
 tslib_1.__exportStar(require("./entities"), exports);
+tslib_1.__exportStar(require("./constants"), exports);
+tslib_1.__exportStar(require("./DialogFooter"), exports);
 tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/DialogNext/modules/DialogHeader/index.d.ts

@@ -1,2 +1,3 @@
+export * from './constants';
 export * from './DialogHeader';
 export * from './types';

package/__inner__/cjs/components/DialogNext/modules/DialogHeader/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./constants"), exports);
 tslib_1.__exportStar(require("./DialogHeader"), exports);
 tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/DialogNext/modules/DialogIllustration/DialogIllustration.css

@@ -0,0 +1,5 @@
+.DialogNextIllustration {
+  block-size: 80px;
+  inline-size: 80px;
+  margin-block-end: var(--spacing-m);
+}

package/__inner__/cjs/components/DialogNext/modules/DialogIllustration/DialogIllustration.d.ts

@@ -0,0 +1,3 @@
+import type { DialogIllustrationBaseProps } from './types';
+export declare const cnDialogIllustration: import("@bem-react/classname").ClassNameFormatter;
+export declare const DialogIllustration: import("../../../../utils").PolymorphicComponentWithRef<DialogIllustrationBaseProps, "div", "as">;

package/__inner__/cjs/components/DialogNext/modules/DialogIllustration/DialogIllustration.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogIllustration = exports.cnDialogIllustration = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var utils_1 = require("../../../../utils");
+var constants_1 = require("./constants");
+exports.cnDialogIllustration = (0, utils_1.cn)('DialogNextIllustration');
+exports.DialogIllustration = (0, utils_1.polymorphicComponentWithRef)(function (_a, ref) {
+    var children = _a.children, className = _a.className, _b = _a.as, Tag = _b === void 0 ? constants_1.DIALOG_ILLUSTRATION_DEFAULT_TAG : _b, other = tslib_1.__rest(_a, ["children", "className", "as"]);
+    return (react_1.default.createElement(Tag, tslib_1.__assign({}, other, { ref: ref, className: (0, exports.cnDialogIllustration)('', [className]) }), children));
+});
+exports.DialogIllustration.displayName = 'DialogIllustration';

package/__inner__/cjs/components/DialogNext/modules/DialogIllustration/constants.d.ts

@@ -0,0 +1 @@
+export declare const DIALOG_ILLUSTRATION_DEFAULT_TAG = "div";

package/__inner__/cjs/components/DialogNext/modules/DialogIllustration/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DIALOG_ILLUSTRATION_DEFAULT_TAG = void 0;
+exports.DIALOG_ILLUSTRATION_DEFAULT_TAG = 'div';

package/__inner__/cjs/components/DialogNext/modules/DialogIllustration/index.d.ts

@@ -0,0 +1,3 @@
+export * from './constants';
+export * from './DialogIllustration';
+export * from './types';

package/__inner__/cjs/components/DialogNext/modules/DialogIllustration/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./constants"), exports);
+tslib_1.__exportStar(require("./DialogIllustration"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/DialogNext/modules/DialogIllustration/types.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentRef, ElementType } from 'react';
+import type { PolymorphicComponentPropsWithoutRef } from '../../../../utils';
+import type { DIALOG_ILLUSTRATION_DEFAULT_TAG } from './constants';
+export type DialogIllustrationRef<As extends ElementType = typeof DIALOG_ILLUSTRATION_DEFAULT_TAG> = ComponentRef<As>;
+export type DialogIllustrationBaseProps = {
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+};
+export type DialogIllustrationProps<As extends ElementType = typeof DIALOG_ILLUSTRATION_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<DialogIllustrationBaseProps, As>;

package/__inner__/cjs/components/DialogNext/modules/DialogIllustration/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/DialogNext/modules/DialogTitle/index.d.ts

@@ -1 +1,2 @@
 export * from './DialogTitle';
+export * from './types';

package/__inner__/cjs/components/DialogNext/modules/DialogTitle/index.js

@@ -2,3 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./DialogTitle"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/DialogNext/modules/index.d.ts

@@ -4,5 +4,6 @@ export * from './DialogFooter';
 export * from './DialogFooterButton';
 export * from './DialogFooterButtonsGroup';
 export * from './DialogHeader';
+export * from './DialogIllustration';
 export * from './DialogSubtitle';
 export * from './DialogTitle';

package/__inner__/cjs/components/DialogNext/modules/index.js

@@ -7,5 +7,6 @@ tslib_1.__exportStar(require("./DialogFooter"), exports);
 tslib_1.__exportStar(require("./DialogFooterButton"), exports);
 tslib_1.__exportStar(require("./DialogFooterButtonsGroup"), exports);
 tslib_1.__exportStar(require("./DialogHeader"), exports);
+tslib_1.__exportStar(require("./DialogIllustration"), exports);
 tslib_1.__exportStar(require("./DialogSubtitle"), exports);
 tslib_1.__exportStar(require("./DialogTitle"), exports);

package/__inner__/cjs/components/DialogNext/types.d.ts

@@ -7,7 +7,7 @@ import type { DialogDeviceType, DialogSizeVariantByDeviceType, DialogVariant } f
 export type DialogRef = HTMLDivElement;
 export type DialogRenderCloseButton = RenderContentTypeEmptyProps['content'];
 export type DialogContentBottomSheetProps = Omit<DialogBottomSheetProps, 'hideCloseButton' | 'backdrop' | 'open' | 'size' | 'variant' | 'closeButton' | 'onClose' | 'className'>;
-export type DialogContentModalProps = Omit<DialogModalProps, 'open' | 'onClose' | 'hideCloseButton' | 'className' | 'closeButton' | 'size' | 'variant'>;
+export type DialogContentModalProps = Omit<DialogModalProps, 'open' | 'onClose' | 'hideCloseButton' | 'className' | 'closeButton' | 'size' | 'variant' | 'children'>;
 export type DialogBaseProps = {
     /** Если `true`, будет отображаться окно диалога */
     open: boolean;

package/__inner__/cjs/components/FilePicker/FilePicker.js

@@ -66,7 +66,7 @@ exports.FilePicker = (0, react_1.forwardRef)(function (inProps, ref) {
                 react_1.default.createElement("input", tslib_1.__assign({ id: id, name: name, accept: accept, multiple: multiple, onBlur: handleBlur, required: required, disabled: disabled, autoFocus: autoFocus, onFocus: handleFocus, className: (0, exports.cnFilePicker)('Input') }, inputProps, { type: "file", onChange: onChange, onKeyDown: onKeyDown, ref: (0, useMultiRef_1.useMultiRef)([inputRef || (inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref), inputInnerRef]) })),
                 hasFiles ? (react_1.default.createElement("span", { className: (0, exports.cnFilePicker)('FileName') }, renderValue(fileList, disableTruncate))) : (react_1.default.createElement("span", { "aria-placeholder": placeholder, className: (0, exports.cnFilePicker)('Placeholder') }, placeholder))),
             react_1.default.createElement("div", { className: (0, exports.cnFilePicker)('RenderRight') },
-                onClearProp && (react_1.default.createElement(IconButtonNext_1.IconButton, { size: size, tabIndex: -1, icon: icons_1.CrossIcon, onClick: onClear, variant: "function", "aria-label": clearText, className: (0, exports.cnFilePicker)('ClearButton', {
+                onClearProp && (react_1.default.createElement(IconButtonNext_1.IconButton, { size: size, tabIndex: -1, icon: icons_1.CrossIcon, color: "tertiary", onClick: onClear, variant: "function", "aria-label": clearText, className: (0, exports.cnFilePicker)('ClearButton', {
                         visibility: hasFiles,
                     }) })),
                 react_1.default.createElement(FieldIcon_1.FieldIcon, { icon: renderRight })),

package/__inner__/cjs/components/IconButtonNext/IconButton.css

@@ -90,10 +90,10 @@
       --color-content-action-secondary-pressed
     );
     --icon-button-bg-color-focus: var(--color-content-action-secondary-hover);
-    --icon-button-font-color: var(--color-content-action-on);
-    --icon-button-font-color-hover: var(--color-content-action-on);
-    --icon-button-font-color-active: var(--color-content-action-on);
-    --icon-button-font-color-focus: var(--color-content-action-on);
+    --icon-button-font-color: var(--color-content-primary-inverse);
+    --icon-button-font-color-hover: var(--color-content-primary-inverse);
+    --icon-button-font-color-active: var(--color-content-primary-inverse);
+    --icon-button-font-color-focus: var(--color-content-primary-inverse);
   }
 
   .IconButtonNext_variant_contained.IconButtonNext_color_tertiary {
@@ -125,17 +125,17 @@
     --icon-button-bg-color-hover: var(--color-background-action-light-hover);
     --icon-button-bg-color-active: var(--color-background-action-light-pressed);
     --icon-button-bg-color-focus: var(--color-background-action-light-hover);
-    --icon-button-font-color: var(--color-content-action);
-    --icon-button-font-color-hover: var(--color-content-action);
-    --icon-button-font-color-active: var(--color-content-action);
-    --icon-button-font-color-focus: var(--color-content-action);
+    --icon-button-font-color: var(--color-content-action-dark);
+    --icon-button-font-color-hover: var(--color-content-action-dark);
+    --icon-button-font-color-active: var(--color-content-action-dark);
+    --icon-button-font-color-focus: var(--color-content-action-dark);
   }
 
   .IconButtonNext_variant_contained-additional.IconButtonNext_color_secondary {
-    --icon-button-bg-color: var(--color-background-secondary);
-    --icon-button-bg-color-hover: var(--color-background-secondary-hover);
-    --icon-button-bg-color-active: var(--color-background-secondary-pressed);
-    --icon-button-bg-color-focus: var(--color-background-secondary-hover);
+    --icon-button-bg-color: var(--color-background-action-secondary-light);
+    --icon-button-bg-color-hover: var(--color-background-action-secondary-light-hover);
+    --icon-button-bg-color-active: var(--color-background-action-secondary-light-pressed);
+    --icon-button-bg-color-focus: var(--color-background-action-secondary-light-hover);
     --icon-button-font-color: var(--color-content-primary);
     --icon-button-font-color-hover: var(--color-content-primary);
     --icon-button-font-color-active: var(--color-content-primary);
@@ -158,10 +158,10 @@
     --icon-button-bg-color-hover: var(--color-background-error-light-hover);
     --icon-button-bg-color-active: var(--color-background-error-light-pressed);
     --icon-button-bg-color-focus: var(--color-background-error-light-hover);
-    --icon-button-font-color: var(--color-content-error);
-    --icon-button-font-color-hover: var(--color-content-error);
-    --icon-button-font-color-active: var(--color-content-error);
-    --icon-button-font-color-focus: var(--color-content-error);
+    --icon-button-font-color: var(--color-content-error-dark);
+    --icon-button-font-color-hover: var(--color-content-error-dark);
+    --icon-button-font-color-active: var(--color-content-error-dark);
+    --icon-button-font-color-focus: var(--color-content-error-dark);
   }
 
   /** ghost */
@@ -179,9 +179,9 @@
 
   .IconButtonNext_variant_ghost.IconButtonNext_color_secondary {
     --icon-button-bg-color: transparent;
-    --icon-button-bg-color-hover: var(--color-background-secondary-hover);
-    --icon-button-bg-color-active: var(--color-background-secondary-pressed);
-    --icon-button-bg-color-focus: var(--color-background-secondary-hover);
+    --icon-button-bg-color-hover: var(--color-background-action-secondary-light);
+    --icon-button-bg-color-active: var(--color-background-action-secondary-light-pressed);
+    --icon-button-bg-color-focus: var(--color-background-action-secondary-light-hover);
     --icon-button-font-color: var(--color-content-primary);
     --icon-button-font-color-hover: var(--color-content-primary);
     --icon-button-font-color-active: var(--color-content-primary);
@@ -230,32 +230,28 @@
     --icon-button-font-color: var(--color-content-action);
     --icon-button-font-color-hover: var(--color-background-action-hover);
     --icon-button-font-color-active: var(--color-background-action-pressed);
-    --icon-button-font-color-focus: var(--color-background-action-pressed);
+    --icon-button-font-color-focus: var(--color-background-action-hover);
   }
 
   .IconButtonNext_variant_function.IconButtonNext_color_secondary {
     --icon-button-font-color: var(--color-content-action-secondary);
     --icon-button-font-color-hover: var(--color-content-action-secondary-hover);
-    --icon-button-font-color-active: var(
-      --color-content-action-secondary-pressed
-    );
-    --icon-button-font-color-focus: var(
-      --color-content-action-secondary-pressed
-    );
+    --icon-button-font-color-active: var(--color-content-action-secondary-pressed);
+    --icon-button-font-color-focus: var(--color-content-action-secondary-hover);
   }
 
   .IconButtonNext_variant_function.IconButtonNext_color_tertiary {
     --icon-button-font-color: var(--color-content-secondary);
-    --icon-button-font-color-hover: var(--color-content-secondary);
-    --icon-button-font-color-active: var(--color-content-secondary);
-    --icon-button-font-color-focus: var(--color-content-secondary);
+    --icon-button-font-color-hover: var(--color-content-primary);
+    --icon-button-font-color-active: var(--color-content-primary);
+    --icon-button-font-color-focus: var(--color-content-primary);
   }
 
   .IconButtonNext_variant_function.IconButtonNext_color_error {
     --icon-button-font-color: var(--color-content-error);
     --icon-button-font-color-hover: var(--color-content-error-hover);
     --icon-button-font-color-active: var(--color-content-error-pressed);
-    --icon-button-font-color-focus: var(--color-content-error-pressed);
+    --icon-button-font-color-focus: var(--color-content-error-hover);
   }
 
   /** floating */

package/__inner__/cjs/components/OzenProvider/providers/theme/entities/defaultProps.d.ts

@@ -62,7 +62,7 @@ import type { RadioGroupProps as RadioGroupNextProps } from '../../../../RadioGr
 import type { RadioProps as RadioNextProps } from '../../../../RadioNext';
 import type { SectionMessageProps } from '../../../../SectionMessage';
 import type { SegmentProps } from '../../../../Segment';
-import type { SelectProps } from '../../../../Select';
+import type { SelectIconButtonProps, SelectProps } from '../../../../Select';
 import type { SliderProps } from '../../../../Slider';
 import type { SnackbarProviderProps } from '../../../../Snackbar';
 import type { StackProps } from '../../../../Stack';
@@ -186,6 +186,7 @@ export type ThemeDefaultProps = {
     SectionMessage?: Partial<SectionMessageProps>;
     Segment?: Partial<SegmentProps>;
     Select?: Partial<SelectProps>;
+    SelectIconButton?: Partial<SelectIconButtonProps>;
     Slider?: Partial<SliderProps>;
     SnackbarProvider?: Partial<SnackbarProviderProps>;
     Stack?: Partial<StackProps>;

package/__inner__/cjs/components/Select/components/SelectInputRenderRight/SelectInputRenderRight.js

@@ -2,19 +2,22 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SelectInputRenderRight = void 0;
 var tslib_1 = require("tslib");
-var react_1 = tslib_1.__importDefault(require("react"));
+var react_1 = tslib_1.__importStar(require("react"));
 var classnames_1 = require("@bem-react/classnames");
 var icons_1 = require("@ozen-ui/icons");
+var react_is_1 = require("react-is");
+var utils_1 = require("../../../../utils");
 var FieldControl_1 = require("../../../FieldControl");
 var FieldIcon_1 = require("../../../FieldIcon");
 var IconButtonNext_1 = require("../../../IconButtonNext");
 var classNames_1 = require("../../classNames");
+var modules_1 = require("../../modules");
 var SelectContext_1 = require("../../SelectContext");
 var SelectInputRenderRight = function () {
     var _a = tslib_1.__read((0, FieldControl_1.useFieldControl)(), 1), _b = _a[0], focused = _b.focused, hovered = _b.hovered;
     var _c = (0, SelectContext_1.useSelectContext)(), hasValue = _c.hasValue, open = _c.open, onClear = _c.onClear, renderRight = _c.renderRight, clearText = _c.clearText, renderRightLayout = _c.renderRightLayout, showClearButton = _c.showClearButton, size = _c.size;
     var isVisibleClearButton = !!(hovered || open || focused) && hasValue;
-    var clearButton = (react_1.default.createElement(IconButtonNext_1.IconButton, { key: "clear", tabIndex: -1, size: size, variant: "function", icon: icons_1.CrossIcon, title: clearText, "aria-label": clearText, onClick: function (event) {
+    var clearButton = (react_1.default.createElement(IconButtonNext_1.IconButton, { key: "clear", tabIndex: -1, size: size, variant: "function", icon: icons_1.CrossIcon, color: "tertiary", title: clearText, "aria-label": clearText, onClick: function (event) {
             event.preventDefault();
             event.stopPropagation();
             onClear === null || onClear === void 0 ? void 0 : onClear(event);
@@ -25,6 +28,11 @@ var SelectInputRenderRight = function () {
         showClearButton && !isVisibleClearButton && clearButton,
         renderRightLayout.map(function (element) {
             if (element === 'suffix') {
+                var isSelectIconButton = (0, react_is_1.isElement)(renderRight) &&
+                    (0, utils_1.isNodeWithDisplayName)(renderRight, modules_1.SELECT_ICON_BUTTON_DISPLAY_NAME);
+                if (isSelectIconButton) {
+                    return react_1.default.createElement(react_1.Fragment, { key: element }, renderRight);
+                }
                 return (react_1.default.createElement(FieldIcon_1.FieldIcon, { key: element, icon: renderRight, className: (0, classnames_1.classnames)((0, classNames_1.cnSelect)('RenderRight', { nonInteractive: true }), (0, classNames_1.cnSelect)('Suffix')) }));
             }
             if (element === 'clear') {

package/__inner__/cjs/components/Select/index.d.ts

@@ -1,6 +1,7 @@
 export { DataListOption as Option } from '../DataList';
 export { ListItemText as OptionItemText, ListItemIcon as OptionItemIcon, } from '../List';
 export * from './entities';
+export * from './modules';
 export * from './constants';
 export * from './classNames';
 export * from './Select';

package/__inner__/cjs/components/Select/index.js

@@ -8,6 +8,7 @@ var List_1 = require("../List");
 Object.defineProperty(exports, "OptionItemText", { enumerable: true, get: function () { return List_1.ListItemText; } });
 Object.defineProperty(exports, "OptionItemIcon", { enumerable: true, get: function () { return List_1.ListItemIcon; } });
 tslib_1.__exportStar(require("./entities"), exports);
+tslib_1.__exportStar(require("./modules"), exports);
 tslib_1.__exportStar(require("./constants"), exports);
 tslib_1.__exportStar(require("./classNames"), exports);
 tslib_1.__exportStar(require("./Select"), exports);

package/__inner__/cjs/components/Select/modules/SelectIconButton/SelectIconButton.d.ts

@@ -0,0 +1,3 @@
+import type { SelectIconButtonBaseProps } from './types';
+export declare const cnSelectIconButton: import("@bem-react/classname").ClassNameFormatter;
+export declare const SelectIconButton: import("../../../../utils").PolymorphicComponentWithRef<SelectIconButtonBaseProps, "button", "as">;

package/__inner__/cjs/components/Select/modules/SelectIconButton/SelectIconButton.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SelectIconButton = exports.cnSelectIconButton = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var useThemeProps_1 = require("../../../../hooks/useThemeProps");
+var utils_1 = require("../../../../utils");
+var IconButtonNext_1 = require("../../../IconButtonNext");
+var classNames_1 = require("../../classNames");
+var SelectContext_1 = require("../../SelectContext");
+var constants_1 = require("./constants");
+exports.cnSelectIconButton = (0, utils_1.cn)('SelectIconButton');
+exports.SelectIconButton = (0, utils_1.polymorphicComponentWithRef)(function (inProps, ref) {
+    var props = (0, useThemeProps_1.useThemeProps)({
+        props: inProps,
+        name: 'SelectIconButton',
+    });
+    var icon = props.icon, onClick = props.onClick, className = props.className, _a = props.as, as = _a === void 0 ? constants_1.SELECT_ICON_BUTTON_DEFAULT_TAG : _a, _b = props.tabIndex, tabIndex = _b === void 0 ? constants_1.SELECT_ICON_BUTTON_DEFAULT_TAB_INDEX : _b, other = tslib_1.__rest(props, ["icon", "onClick", "className", "as", "tabIndex"]);
+    var size = (0, SelectContext_1.useSelectContext)().size;
+    return (react_1.default.createElement(IconButtonNext_1.IconButton, tslib_1.__assign({}, other, { ref: ref, as: as, tabIndex: tabIndex, size: size, variant: "function", icon: icon, color: "tertiary", onClick: function (event) {
+            event.preventDefault();
+            event.stopPropagation();
+            onClick === null || onClick === void 0 ? void 0 : onClick(event);
+        }, compressed: true, className: (0, exports.cnSelectIconButton)('', [(0, classNames_1.cnSelect)('Suffix'), className]) })));
+});
+exports.SelectIconButton.displayName = constants_1.SELECT_ICON_BUTTON_DISPLAY_NAME;

package/__inner__/cjs/components/Select/modules/SelectIconButton/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const SELECT_ICON_BUTTON_DEFAULT_TAG = "button";
+export declare const SELECT_ICON_BUTTON_DEFAULT_TAB_INDEX = -1;
+export declare const SELECT_ICON_BUTTON_DISPLAY_NAME = "SelectIconButton";

package/__inner__/cjs/components/Select/modules/SelectIconButton/constants.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SELECT_ICON_BUTTON_DISPLAY_NAME = exports.SELECT_ICON_BUTTON_DEFAULT_TAB_INDEX = exports.SELECT_ICON_BUTTON_DEFAULT_TAG = void 0;
+var IconButtonNext_1 = require("../../../IconButtonNext");
+exports.SELECT_ICON_BUTTON_DEFAULT_TAG = IconButtonNext_1.ICON_BUTTON_DEFAULT_TAG;
+exports.SELECT_ICON_BUTTON_DEFAULT_TAB_INDEX = -1;
+exports.SELECT_ICON_BUTTON_DISPLAY_NAME = 'SelectIconButton';

package/__inner__/cjs/components/Select/modules/SelectIconButton/index.d.ts

@@ -0,0 +1,3 @@
+export * from './constants';
+export * from './SelectIconButton';
+export * from './types';

package/__inner__/cjs/components/Select/modules/SelectIconButton/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./constants"), exports);
+tslib_1.__exportStar(require("./SelectIconButton"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/Select/modules/SelectIconButton/types.d.ts

@@ -0,0 +1,7 @@
+import type { ComponentRef, ElementType } from 'react';
+import type { PolymorphicComponentPropsWithoutRef } from '../../../../utils';
+import type { IconButtonBaseProps } from '../../../IconButtonNext';
+import type { SELECT_ICON_BUTTON_DEFAULT_TAG } from './constants';
+export type SelectIconButtonBaseProps = Omit<IconButtonBaseProps, 'size' | 'color' | 'variant' | 'compressed'>;
+export type SelectIconButtonProps<As extends ElementType = typeof SELECT_ICON_BUTTON_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<SelectIconButtonBaseProps, As>;
+export type SelectIconButtonRef<As extends ElementType = typeof SELECT_ICON_BUTTON_DEFAULT_TAG> = ComponentRef<As>;

package/__inner__/cjs/components/Select/modules/SelectIconButton/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/Select/modules/index.d.ts

@@ -0,0 +1 @@
+export * from './SelectIconButton';

package/__inner__/cjs/components/Select/modules/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./SelectIconButton"), exports);

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInput/components/AutocompleteBaseRenderRight/AutocompleteBaseRenderRight.js

@@ -11,7 +11,7 @@ export var AutocompleteBaseRenderRight = function (_a) {
     var open = dropdownControl.isOpen;
     var _c = __read(useFieldControl(), 1), _d = _c[0], focused = _d.focused, hovered = _d.hovered;
     var isVisibleClearButton = !!(hovered || open || focused) && valueControl.hasValue;
-    var clearButton = (React.createElement(IconButton, { size: size, type: "button", tabIndex: -1, icon: CrossIcon, variant: "function", title: clearText, "aria-label": clearText, onClick: function (event) {
+    var clearButton = (React.createElement(IconButton, { size: size, type: "button", tabIndex: -1, icon: CrossIcon, variant: "function", color: "tertiary", title: clearText, "aria-label": clearText, onClick: function (event) {
             event.preventDefault();
             clear(event);
         }, className: cnAutocompleteBaseInput('ClearButton', {
@@ -22,7 +22,7 @@ export var AutocompleteBaseRenderRight = function (_a) {
         suffixPosition === 'before' && suffix,
         showClearButton && isVisibleClearButton && clearButton,
         suffixPosition === 'between' && suffix,
-        showChevron && (React.createElement(IconButton, { size: size, type: "button", tabIndex: -1, variant: "ghost", disabled: disabled, title: open ? closeText : openText, "aria-label": open ? closeText : openText, icon: open ? ChevronUpIcon : ChevronDownIcon, onClick: function (event) {
+        showChevron && (React.createElement(IconButton, { size: size, type: "button", tabIndex: -1, variant: "ghost", color: "tertiary", disabled: disabled, title: open ? closeText : openText, "aria-label": open ? closeText : openText, icon: open ? ChevronUpIcon : ChevronDownIcon, onClick: function (event) {
                 event.preventDefault();
                 dropdownControl.toggle();
             }, compressed: true })),

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputIcon/types.d.ts

@@ -1,4 +1,3 @@
-import type { FieldIconProps } from '../../../FieldIcon';
-import type { TagRef } from '../../../TagNext';
+import type { FieldIconProps, FieldIconRef } from '../../../FieldIcon';
 export type AutocompleteBaseInputIconProps = Omit<FieldIconProps, 'size'>;
-export type AutocompleteBaseInputIconRef = TagRef;
+export type AutocompleteBaseInputIconRef = FieldIconRef;

package/__inner__/esm/components/AutocompleteNext/components/AutocompleteRenderRight/AutocompleteRenderRight.js

@@ -10,7 +10,7 @@ export var AutocompleteRenderRight = function (_a) {
     var _b = __read(useFieldControl(), 1), _c = _b[0], focused = _c.focused, hovered = _c.hovered;
     var isVisibleClearButton = !!(hovered || open || focused) && hasValue;
     var renderedIcon = React.createElement(FieldIcon, { icon: renderRight });
-    var clearButton = (React.createElement(IconButton, { size: size, type: "button", tabIndex: -1, icon: CrossIcon, variant: "function", title: clearText, "aria-label": clearText, onClick: function (e) {
+    var clearButton = (React.createElement(IconButton, { size: size, type: "button", tabIndex: -1, icon: CrossIcon, variant: "function", color: "tertiary", title: clearText, "aria-label": clearText, onClick: function (e) {
             e.preventDefault();
             onClear === null || onClear === void 0 ? void 0 : onClear(e);
         }, className: cnAutocomplete('ClearButton', {
@@ -21,7 +21,7 @@ export var AutocompleteRenderRight = function (_a) {
         renderRightPosition === 'before' && renderedIcon,
         !disableClearButton && isVisibleClearButton && clearButton,
         renderRightPosition === 'between' && renderedIcon,
-        !disableShowChevron && (React.createElement(IconButton, { size: size, type: "button", tabIndex: -1, variant: "ghost", disabled: disabled, title: open ? closeText : openText, "aria-label": open ? closeText : openText, icon: open ? ChevronUpIcon : ChevronDownIcon, onClick: function (e) {
+        !disableShowChevron && (React.createElement(IconButton, { size: size, type: "button", tabIndex: -1, variant: "ghost", color: "tertiary", disabled: disabled, title: open ? closeText : openText, "aria-label": open ? closeText : openText, icon: open ? ChevronUpIcon : ChevronDownIcon, onClick: function (e) {
                 e.preventDefault();
                 onOpen();
             }, compressed: true })),

package/__inner__/esm/components/BottomSheetBase/modules/BottomSheetBaseBlock/BottomSheetBaseBlock.d.ts

@@ -1,6 +1,5 @@
 import './BottomSheetBaseBlock.css';
 import React from 'react';
+import type { BottomSheetBaseBlockProps } from './types';
 export declare const cnBottomSheetBaseBlock: import("@bem-react/classname").ClassNameFormatter;
-export declare const BottomSheetBaseBlock: React.ForwardRefExoticComponent<{
-    expandOnDrag?: boolean;
-} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "expandOnDrag"> & React.RefAttributes<HTMLDivElement>>;
+export declare const BottomSheetBaseBlock: React.ForwardRefExoticComponent<Omit<BottomSheetBaseBlockProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/BottomSheetBase/modules/BottomSheetBaseBlock/types.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentPropsWithoutRef } from 'react';
+import type { ComponentPropsWithRef } from 'react';
 import type { ExtendableProps } from '../../../../types/ExtendableProps';
 export type BottomSheetBaseBlockProps = ExtendableProps<{
     expandOnDrag?: boolean;
-}, ComponentPropsWithoutRef<'div'>>;
+}, ComponentPropsWithRef<'div'>>;

package/__inner__/esm/components/BottomSheetBase/modules/BottomSheetBaseFooter/BottomSheetBaseFooter.d.ts

@@ -1,5 +1,3 @@
 import React from 'react';
 export declare const cnBottomSheetBaseFooter: import("@bem-react/classname").ClassNameFormatter;
-export declare const BottomSheetBaseFooter: React.ForwardRefExoticComponent<{
-    expandOnDrag?: boolean;
-} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "expandOnDrag"> & React.RefAttributes<HTMLDivElement>>;
+export declare const BottomSheetBaseFooter: React.ForwardRefExoticComponent<Omit<import("../BottomSheetBaseBlock").BottomSheetBaseBlockProps, "ref"> & React.RefAttributes<HTMLDivElement>>;