@ozen-ui/kit 0.68.0 → 0.69.0

package/__inner__/esm/components/RadioGroupNext/RadioGroupContext.js

@@ -1,8 +1,8 @@
 import { useContext, createContext } from 'react';
-import { IS_DEV } from '../../constants/environment';
+import { isDev } from '../../constants/environment';
 export var RadioGroupContext = createContext(undefined);
 export var useRadioGroupContext = function () { return useContext(RadioGroupContext); };
 // Именованный провайдер
-if (IS_DEV) {
+if (isDev) {
     RadioGroupContext.displayName = 'RadioGroupContext';
 }

package/__inner__/esm/components/RadioNext/Radio.css

@@ -69,8 +69,8 @@
   }
 
   .RadioNext-Box {
-    inline-size: var(--radio-size, 20px);
-    block-size: var(--radio-size, 20px);
+    inline-size: var(--radio-size);
+    block-size: var(--radio-size);
     position: relative;
     border-radius: 50%;
     flex-shrink: 0;

package/__inner__/esm/components/SectionMessage/SectionMessageContext.js

@@ -1,5 +1,5 @@
 import { createContext, useContext } from 'react';
-import { IS_DEV } from '../../constants/environment';
+import { isDev } from '../../constants/environment';
 import { SECTION_MESSAGE_DEFAULT_SIZE } from './constants';
 export var SectionMessageContextDefaultValue = {
     size: SECTION_MESSAGE_DEFAULT_SIZE,
@@ -7,6 +7,6 @@ export var SectionMessageContextDefaultValue = {
 export var SectionMessageContext = createContext(SectionMessageContextDefaultValue);
 export var useSectionMessageContext = function () { return useContext(SectionMessageContext); };
 // Именованный провайдер
-if (IS_DEV) {
+if (isDev) {
     SectionMessageContext.displayName = 'SectionMessageContext';
 }

package/__inner__/esm/components/Select/Select.js

@@ -148,3 +148,4 @@ var SelectRender = function (inProps, ref) {
             selected: (valueState || null) }), children)));
 };
 export var Select = forwardRef(SelectRender);
+Select.displayName = 'Select';

package/__inner__/esm/components/Select/types.d.ts

@@ -1,6 +1,7 @@
 import type { ReactElement, ReactNode, SyntheticEvent } from 'react';
 import type { ExtendableComponentPropsWithRef } from '../../types/ExtendableComponentPropsWithRef';
 import type { FormElementSizeVariant } from '../../types/FormElementSizeVariant';
+import type { WithDisplayName } from '../../types/react';
 import type { DataListBaseProps, DataListOptionProps, DataListSelected } from '../DataList';
 import type { SelectInputProps, SelectInputRef } from './components';
 export type SelectPropSize = FormElementSizeVariant;
@@ -70,5 +71,5 @@ export type SelectProps<MULTIPLE extends boolean = false> = ExtendableComponentP
     /** Идентификатор компонента для тестов */
     'data-testid'?: string;
 } & Pick<SelectInputProps, 'id' | 'name' | 'label' | 'placeholder' | 'disabled' | 'required' | 'disableStroke' | 'error' | 'hint' | 'fullWidth' | 'renderLeft' | 'renderRight' | 'multiline' | 'inputProps' | 'labelProps' | 'hintProps' | 'bodyProps' | 'inputRef' | 'labelRef' | 'bodyRef'> & SelectPropsDeprecated<MULTIPLE>, 'div'>;
-export type SelectComponent = <MULTIPLE extends boolean = false>(props: SelectProps<MULTIPLE>) => ReactElement | null;
+export type SelectComponent = WithDisplayName<(<MULTIPLE extends boolean = false>(props: SelectProps<MULTIPLE>) => ReactElement | null)>;
 export {};

package/__inner__/esm/components/Skeleton/Skeleton.js

@@ -2,7 +2,6 @@ import { __assign, __rest } from "tslib";
 import React, { forwardRef } from 'react';
 import './Skeleton.css';
 import { SkeletonCircular, SkeletonRectangular, SkeletonTypography, } from './components';
-// eslint-disable-next-line react/display-name
 export var Skeleton = forwardRef(function (props, ref) {
     var variant = props.variant, children = props.children, waveColor = props.waveColor, bgColor = props.bgColor, styleProp = props.style, other = __rest(props, ["variant", "children", "waveColor", "bgColor", "style"]);
     var style = __assign({ '--skeleton-wave-color': waveColor, '--skeleton-bg-color': bgColor }, styleProp);
@@ -15,3 +14,4 @@ export var Skeleton = forwardRef(function (props, ref) {
     }
     return React.createElement(SkeletonRectangular, __assign({}, commonProps), children);
 });
+Skeleton.displayName = 'Skeleton';

package/__inner__/esm/components/Skeleton/types.d.ts

@@ -1,4 +1,5 @@
 import type { ReactNode } from 'react';
+import type { WithDisplayName } from '../../types/react';
 import type { SkeletonCircularProps, SkeletonRectangularProps, SkeletonTypographyProps } from './index';
 export type SkeletonProps = (({
     variant: 'rectangular';
@@ -12,4 +13,4 @@ export type SkeletonProps = (({
     /** Цвет фона */
     bgColor?: string;
 };
-export type SkeletonComponent = (props: SkeletonProps) => ReactNode;
+export type SkeletonComponent = WithDisplayName<(props: SkeletonProps) => ReactNode>;

package/__inner__/esm/components/Snackbar/components/Snackbar/Snackbar.d.ts

@@ -8,9 +8,11 @@ export type SnackbarProps = PortalProps & {
     /** Расположение сообщения относительно контейнера */
     anchorOrigin?: SnackbarAnchorOrigin;
 };
-export declare const Snackbar: React.ForwardRefExoticComponent<import("../../../Portal").PortalBaseProps & {
+export declare const Snackbar: React.ForwardRefExoticComponent<{
+    container?: import("../../../../hooks/usePortalContainer").PortalContainer;
+} & Omit<import("../../../PortalBase").PortalBaseBaseProps, "container"> & {
     as?: "div" | undefined;
-} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof import("../../../Portal").PortalBaseProps> & {
+} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "data-testid" | "container" | "disablePortal"> & {
     /** Расположение сообщения относительно контейнера */
     anchorOrigin?: SnackbarAnchorOrigin;
 } & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/Snackbar/constants.d.ts

@@ -2,7 +2,7 @@ import type { SnackbarAnchorOrigin } from './types';
 export declare const SNACKBAR_DEFAULT_ANCHOR_ORIGIN: SnackbarAnchorOrigin;
 export declare const SNACKBAR_DEFAULT_MAX_MESSAGES = 3;
 export declare const SNACKBAR_DEFAULT_DISABLE_WINDOW_BLUR_LISTENER = false;
-export declare const SNACKBAR_DEFAULT_CONTAINER: HTMLElement;
+export declare const SNACKBAR_DEFAULT_CONTAINER: () => HTMLElement;
 export declare const SNACKBAR_DEFAULT_LIFETIME = 5000;
 export declare const SNACKBAR_ITEM_DEFAULT_STATUS = "info";
 export declare const SNACKBAR_ITEM_COLLAPSE_TRANSITION_TIMEOUT = 300;

package/__inner__/esm/components/Snackbar/constants.js

@@ -4,7 +4,9 @@ export var SNACKBAR_DEFAULT_ANCHOR_ORIGIN = {
 };
 export var SNACKBAR_DEFAULT_MAX_MESSAGES = 3;
 export var SNACKBAR_DEFAULT_DISABLE_WINDOW_BLUR_LISTENER = false;
-export var SNACKBAR_DEFAULT_CONTAINER = document.body;
+export var SNACKBAR_DEFAULT_CONTAINER = (function () {
+    return document.body;
+});
 export var SNACKBAR_DEFAULT_LIFETIME = 5000;
 export var SNACKBAR_ITEM_DEFAULT_STATUS = 'info';
 export var SNACKBAR_ITEM_COLLAPSE_TRANSITION_TIMEOUT = 300;

package/__inner__/esm/components/Stack/Stack.js

@@ -36,3 +36,4 @@ export var Stack = polymorphicComponentWithRef(function (inProps, ref) {
             wrap: wrap,
         }), generateDirectionCn(cnStack, direction), generateGapCn(cnStack, gap), className), ref: ref }), resolveChildren()));
 });
+Stack.displayName = 'Stack';

package/__inner__/esm/components/Tabs/Tabs.js

@@ -2,6 +2,7 @@ import { __assign, __read, __rest } from "tslib";
 import './Tabs.css';
 import React, { useState, useCallback, useMemo, useEffect, forwardRef, useRef, } from 'react';
 import { isFragment } from 'react-is';
+import { isServer } from '../../constants/environment';
 import { useDebounceCallback } from '../../hooks/useDebounceCallback';
 import { useEventListener } from '../../hooks/useEventListener';
 import { animateProperty } from '../../utils/animateProperty';
@@ -118,6 +119,9 @@ export var Tabs = forwardRef(function (_a, ref) {
     };
     var handleKeyDown = useCallback(function (e) {
         var _a, _b;
+        if (isServer) {
+            return;
+        }
         var event = e;
         var key = event.key;
         if (!Object.keys(ControlKeys).includes(key))

package/__inner__/esm/components/Tabs/components/Tab/Tab.js

@@ -40,3 +40,4 @@ export var TabComponent = polymorphicComponentWithRef(function (_a, ref) {
 });
 TabComponent.displayName = 'Tab';
 export var Tab = React.memo(TabComponent);
+Tab.displayName = 'Tab';

package/__inner__/esm/components/Tag/Tag.js

@@ -1,7 +1,7 @@
 import { __assign, __rest } from "tslib";
 import './Tag.css';
 import React from 'react';
-import { deprecate } from '@ozen-ui/logger';
+import { useDeprecatedComponent } from '../../hooks/useDeprecated';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
 import { polymorphicComponentWithRef, } from '../../utils/polymorphicComponentWithRef';
@@ -20,9 +20,7 @@ export var cnTag = cn('Tag');
 export var Tag = polymorphicComponentWithRef(function (inProps, ref) {
     var props = useThemeProps({ props: inProps, name: 'Tag' });
     var _a = props.size, size = _a === void 0 ? TAG_DEFAULT_SIZE : _a, _b = props.as, Tag = _b === void 0 ? TAG_DEFAULT_AS : _b, _c = props.variant, variant = _c === void 0 ? TAG_DEFAULT_VARIANT : _c, IconLeft = props.iconLeft, IconRight = props.iconRight, label = props.label, className = props.className, onRemove = props.onRemove, other = __rest(props, ["size", "as", "variant", "iconLeft", "iconRight", "label", "className", "onRemove"]);
-    if (process.env.NODE_ENV !== 'production') {
-        deprecate('Компонент «Tag» устарел. Для замены используйте компонент «TagNext».');
-    }
+    useDeprecatedComponent('Tag');
     return (React.createElement(Tag, __assign({ className: cnTag({ variant: variant, size: size }, [className]) }, other, { ref: ref }),
         IconLeft && React.createElement(IconLeft, { size: "s" }),
         React.createElement("span", { className: cnTag('Label') }, label),

package/__inner__/esm/components/ThemeProvider/types.d.ts

@@ -4,6 +4,7 @@ import type { PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphi
 import type { AccordionProps, AccordionSummaryProps } from '../Accordion';
 import type { AlertProps } from '../Alert';
 import type { AutocompleteProps } from '../Autocomplete';
+import type { AutocompleteBaseProps, AutocompleteBaseInputProps, AutocompleteBaseInputTagProps, AutocompleteBaseInputIconProps } from '../AutocompleteBase';
 import type { AutocompleteProps as AutocompletePropsNext } from '../AutocompleteNext';
 import type { AvatarProps } from '../Avatar';
 import type { BackdropProps } from '../Backdrop';
@@ -89,6 +90,10 @@ export type Theme = {
         Alert?: Partial<AlertProps>;
         Autocomplete?: Partial<AutocompleteProps>;
         AutocompleteNext?: Partial<AutocompletePropsNext>;
+        AutocompleteBase?: Partial<AutocompleteBaseProps>;
+        AutocompleteBaseInput?: Partial<AutocompleteBaseInputProps>;
+        AutocompleteBaseInputIcon?: Partial<AutocompleteBaseInputIconProps>;
+        AutocompleteBaseInputTag?: Partial<AutocompleteBaseInputTagProps>;
         Avatar?: Partial<AvatarProps>;
         Backdrop?: Partial<BackdropProps>;
         Badge?: Partial<BadgeProps>;

package/__inner__/esm/components/Title/TitleContext.js

@@ -1,5 +1,5 @@
 import React, { useContext } from 'react';
-import { IS_DEV } from '../../constants/environment';
+import { isDev } from '../../constants/environment';
 import { TITLE_DEFAULT_SIZE, TITLE_DEFAULT_VARIANT } from './constants';
 export var TitleContextDefaultValue = {
     variant: TITLE_DEFAULT_VARIANT,
@@ -8,6 +8,6 @@ export var TitleContextDefaultValue = {
 export var TitleContext = React.createContext(TitleContextDefaultValue);
 export var useTitleContext = function () { return useContext(TitleContext); };
 // Именованный провайдер
-if (IS_DEV) {
+if (isDev) {
     TitleContext.displayName = 'TitleContext';
 }

package/__inner__/esm/components/Title/components/variant/TitleVariant.js

@@ -1,7 +1,7 @@
 import { __assign, __rest } from "tslib";
 import React from 'react';
 import { logger } from '@ozen-ui/logger';
-import { IS_DEV } from '../../../../constants/environment';
+import { isDev } from '../../../../constants/environment';
 import { polymorphicComponentWithRef } from '../../../../utils/polymorphicComponentWithRef';
 import { titleVariant } from '../../entities';
 import { TitleMain } from './main';
@@ -14,8 +14,9 @@ export var TitleVariant = polymorphicComponentWithRef(function (_a, ref) {
     if (variant === 'secondary') {
         return React.createElement(TitleSecondary, __assign({}, other, { as: as, ref: ref }));
     }
-    if (IS_DEV) {
+    if (isDev) {
         logger.error("\u0423 \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442\u0430 'Title' \u043D\u0435\u0442 \u0432\u0430\u0440\u0438\u0430\u043D\u0442\u0430 '".concat(variant, "'. \u0414\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0435 \u0432\u0430\u0440\u0438\u0430\u043D\u0442\u044B: [").concat(titleVariant.join(', '), "]'"));
     }
     return null;
 });
+TitleVariant.displayName = 'TitleVariant';

package/__inner__/esm/components/Title/modules/TitleTag/TitleTag.js

@@ -6,3 +6,4 @@ import { Tag } from '../../../TagNext';
 import { TITLE_TAG_DEFAULT_TAG } from './constants';
 export var cnTitleTag = cn('TitleTag');
 export var TitleTag = polymorphicComponentWithRef(function (props, ref) { return (React.createElement(Tag, __assign({ as: TITLE_TAG_DEFAULT_TAG }, props, { ref: ref, size: "xs", variant: "primary", color: "uncolored", className: cnTitleTag('', [props.className]) }))); });
+TitleTag.displayName = 'TitleTag';

package/__inner__/esm/components/Toggle/Toggle.js

@@ -1,6 +1,7 @@
 import { __assign, __rest } from "tslib";
 import './Toggle.css';
 import React, { forwardRef } from 'react';
+import { useDeprecatedComponent } from '../../hooks/useDeprecated';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
 import { FormControlLabel } from '../FormControlLabel';
@@ -9,6 +10,7 @@ export var cnToggle = cn('Toggle');
  * @deprecated Компонент устарел. Для замены используйте компонент ToggleNext
  */
 export var Toggle = forwardRef(function (inProps, ref) {
+    useDeprecatedComponent('Toggle');
     var props = useThemeProps({
         props: inProps,
         name: 'Toggle',

package/__inner__/esm/components/ToggleNext/Toggle.css

@@ -22,11 +22,11 @@
   }
 
   .ToggleNext_size_m {
-    --form-control-carcass-control-block-padding: 0;
+    --form-control-carcass-control-block-margin: 0;
   }
 
   .ToggleNext_size_l {
-    --form-control-carcass-control-block-padding: var(--spacing-4xs);
+    --form-control-carcass-control-block-margin: var(--spacing-4xs);
   }
 
   .ToggleNext_variant_default {
@@ -107,6 +107,7 @@
 
   .ToggleNext-Switch {
     position: relative;
+    box-sizing: border-box;
     cursor: pointer;
     flex-shrink: 0;
     inline-size: var(--toggle-switch-inline-size);

package/__inner__/esm/components/Tooltip/Tooltip.js

@@ -1,10 +1,10 @@
 import { __assign, __read, __rest, __spreadArray } from "tslib";
 import './Tooltip.css';
 import React, { useRef, useMemo, useEffect, useState } from 'react';
-import { deprecate } from '@ozen-ui/logger';
 import { useBoolean } from '../../hooks/useBoolean';
 import { useControlled } from '../../hooks/useControlled';
 import { useDebounceCallback } from '../../hooks/useDebounceCallback';
+import { useDeprecatedProperty } from '../../hooks/useDeprecated';
 import { useMultiRef } from '../../hooks/useMultiRef';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
@@ -15,9 +15,7 @@ export var cnTooltip = cn('Tooltip');
 export var Tooltip = polymorphicComponentWithRef(function (inProps, ref) {
     var props = useThemeProps({ props: inProps, name: 'Tooltip' });
     var _a = props.trigger, trigger = _a === void 0 ? TOOLTIP_DEFAULT_TRIGGER : _a, _b = props.size, size = _b === void 0 ? TOOLTIP_DEFAULT_SIZE : _b, _c = props.offset, offset = _c === void 0 ? TOOLTIP_DEFAULT_OFFSET : _c, _d = props.delayEnter, delayEnter = _d === void 0 ? TOOLTIP_DEFAULT_DELAY_ENTER : _d, _e = props.delayLeave, delayLeave = _e === void 0 ? TOOLTIP_DEFAULT_DELAY_LEAVE : _e, _f = props.arrow, arrow = _f === void 0 ? TOOLTIP_DEFAULT_ARROW : _f, _g = props.shouldWrapChildren, shouldWrapChildren = _g === void 0 ? TOOLTIP_DEFAULT_SHOULD_WRAP_CHILDREN : _g, _h = props.disabled, disabled = _h === void 0 ? TOOLTIP_DEFAULT_DISABLED : _h, _j = props.inverse, inverse = _j === void 0 ? TOOLTIP_DEFAULT_INVERSE : _j, _k = props.as, as = _k === void 0 ? TOOLTIP_DEFAULT_TAG : _k, modifiersProp = props.modifiers, onMouseEnter = props.onMouseEnter, onMouseLeave = props.onMouseLeave, variant = props.variant, children = props.children, label = props.label, openProp = props.open, className = props.className, onOpen = props.onOpen, onClose = props.onClose, other = __rest(props, ["trigger", "size", "offset", "delayEnter", "delayLeave", "arrow", "shouldWrapChildren", "disabled", "inverse", "as", "modifiers", "onMouseEnter", "onMouseLeave", "variant", "children", "label", "open", "className", "onOpen", "onClose"]);
-    if (process.env.NODE_ENV !== 'production' && variant) {
-        deprecate('Свойство «variant» устарело. Для замены используйте «inverse».');
-    }
+    useDeprecatedProperty(!!variant, 'variant', 'inverse');
     var anchorRef = useRef(null);
     var _l = __read(useState(), 2), delay = _l[0], setDelay = _l[1];
     var _m = __read(useBoolean(), 2), focused = _m[0], setFocused = _m[1];

package/__inner__/esm/constants/environment/isDev.d.ts

@@ -1 +1 @@
-export declare const IS_DEV: boolean;
+export declare const isDev: boolean;

package/__inner__/esm/constants/environment/isDev.js

@@ -1,2 +1,2 @@
-import { IS_PRODUCTION } from './isProduction';
-export var IS_DEV = !IS_PRODUCTION;
+import { isProduction } from './isProduction';
+export var isDev = !isProduction;

package/__inner__/esm/constants/environment/isProduction.d.ts

@@ -1 +1 @@
-export declare const IS_PRODUCTION: boolean;
+export declare const isProduction: boolean;

package/__inner__/esm/constants/environment/isProduction.js

@@ -1 +1 @@
-export var IS_PRODUCTION = process.env.NODE_ENV === 'production';
+export var isProduction = process.env.NODE_ENV === 'production';

package/__inner__/esm/hooks/useBreakpoints/useBreakpoints.d.ts

@@ -1,4 +1,7 @@
 import { type BreakpointVariant } from '../../types/Breakpoints';
 type BreakpointMatches = Record<BreakpointVariant, boolean>;
+/**
+ * @deprecated Хук устарел. Для замены используйте useBreakpointsNext
+ */
 export declare function useBreakpoints(): BreakpointMatches;
 export {};

package/__inner__/esm/hooks/useBreakpoints/useBreakpoints.js

@@ -1,6 +1,7 @@
 import { __assign, __read, __values } from "tslib";
 import { useState, useCallback, useDebugValue } from 'react';
 import { breakpointVariant, } from '../../types/Breakpoints';
+import { useDeprecatedHook } from '../useDeprecated';
 import { useIsomorphicEffect } from '../useIsomorphicEffect';
 var breakpoint = {
     xs: '(min-width: 0px)',
@@ -8,7 +9,11 @@ var breakpoint = {
     m: '(min-width: 1024px)',
     l: '(min-width: 1280px)',
 };
+/**
+ * @deprecated Хук устарел. Для замены используйте useBreakpointsNext
+ */
 export function useBreakpoints() {
+    useDeprecatedHook('useBreakpoints');
     var _a = __read(useState(breakpointVariant.reduce(function (acc, key) {
         var _a;
         return (__assign(__assign({}, acc), (_a = {}, _a[key] = window.matchMedia(breakpoint[key]).matches, _a)));

package/__inner__/esm/hooks/useBreakpointsNext/index.d.ts

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

package/__inner__/esm/hooks/useBreakpointsNext/index.js

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

package/__inner__/esm/hooks/useBreakpointsNext/useBreakpoints.d.ts

@@ -0,0 +1 @@
+export declare function useBreakpoints(): import("../../types/Breakpoints").BreakpointMatches;

package/__inner__/esm/hooks/useBreakpointsNext/useBreakpoints.js

@@ -0,0 +1,7 @@
+import { useBreakpointsObserver } from '../useBreakpointsObserver';
+import { useRerender } from '../useRerender';
+export function useBreakpoints() {
+    var rerender = useRerender();
+    var matches = useBreakpointsObserver(rerender);
+    return matches.current;
+}

package/__inner__/esm/hooks/useBreakpointsObserver/index.d.ts

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

package/__inner__/esm/hooks/useBreakpointsObserver/index.js

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

package/__inner__/esm/hooks/useBreakpointsObserver/types.d.ts

@@ -0,0 +1,2 @@
+import type { BreakpointMatches } from '../../types/Breakpoints';
+export type UseBreakpointsObserverOnChange = (matches: BreakpointMatches, width: number) => void;

package/__inner__/esm/hooks/useBreakpointsObserver/types.js

@@ -0,0 +1 @@
+export {};

package/__inner__/esm/hooks/useBreakpointsObserver/useBreakpointsObserver.d.ts

@@ -0,0 +1,3 @@
+import type { BreakpointMatches } from '../../types/Breakpoints';
+import type { UseBreakpointsObserverOnChange } from './types';
+export declare function useBreakpointsObserver(onChange?: UseBreakpointsObserverOnChange): import("../useStoredValue").StoredValue<BreakpointMatches>;

package/__inner__/esm/hooks/useBreakpointsObserver/useBreakpointsObserver.js

@@ -0,0 +1,32 @@
+import { useOzenSSR } from '../../components/OzenProvider';
+import { calculateBreakpoints } from '../../utils/breakpoint';
+import { useEventListener } from '../useEventListener';
+import { useIsomorphicEffect } from '../useIsomorphicEffect';
+import { useStoredValue } from '../useStoredValue';
+export function useBreakpointsObserver(onChange) {
+    var ssr = useOzenSSR();
+    var matches = useStoredValue(function () {
+        if (ssr.config.isEnabled) {
+            return calculateBreakpoints(ssr.config.serverWidth);
+        }
+        return calculateBreakpoints(window.innerWidth);
+    });
+    var recalculateMatches = function (width) {
+        var newMatches = calculateBreakpoints(width);
+        var hasChanges = newMatches.currentBreakpoint !== matches.current.currentBreakpoint;
+        if (hasChanges) {
+            matches.current = newMatches;
+            onChange === null || onChange === void 0 ? void 0 : onChange(newMatches, width);
+        }
+    };
+    useEventListener({
+        eventName: 'resize',
+        handler: function () {
+            recalculateMatches(window.innerWidth);
+        },
+    });
+    useIsomorphicEffect(function () {
+        recalculateMatches(window.innerWidth);
+    }, []);
+    return matches;
+}

package/__inner__/esm/hooks/useControlled/useControlled.js

@@ -2,6 +2,7 @@ import { __read } from "tslib";
 /* eslint-disable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */
 import { useState, useCallback, useEffect, useRef } from 'react';
 import { logger } from '@ozen-ui/logger';
+import deepEqual from 'lodash.isequal';
 /** Управляет значением компонента при контролируемом и неконтролируемом поведении */
 export var useControlled = function (_a) {
     var valueProp = _a.value, defaultProp = _a.defaultValue, name = _a.name, _b = _a.state, state = _b === void 0 ? 'value' : _b;
@@ -21,7 +22,7 @@ export var useControlled = function (_a) {
         }, [state, name, valueProp]);
         var defaultValue_1 = useRef(defaultProp).current;
         useEffect(function () {
-            if (!isControlled && defaultValue_1 !== defaultProp) {
+            if (!isControlled && !deepEqual(defaultValue_1, defaultProp)) {
                 logger.error([
                     "\u041D\u0435\u043A\u043E\u043D\u0442\u0440\u043E\u043B\u0438\u0440\u0443\u0435\u043C\u044B\u0439 \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442 ".concat(name, " \u0441\u043C\u0435\u043D\u0438\u043B \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435 \u043F\u043E \u0443\u043C\u043E\u043B\u0447\u0430\u043D\u0438\u044E \u0434\u043B\u044F \u00AB").concat(state, "\u00BB \u043F\u043E\u0441\u043B\u0435 \u043F\u0435\u0440\u0432\u043E\u0439 \u0438\u043D\u0438\u0446\u0438\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u0438."),
                     "\n",

package/__inner__/esm/hooks/useCreateResizeObserver/useCreateResizeObserver.js

@@ -1,11 +1,12 @@
 import { useEffect, useMemo } from 'react';
+import { isClient } from '../../constants/environment';
 import { useStoredValue } from '../useStoredValue';
 export function useCreateResizeObserver(onChange) {
     var frameID = useStoredValue(0);
     var onChangeStored = useStoredValue(function () { return onChange; });
     onChangeStored.current = onChange;
     var observer = useMemo(function () {
-        return typeof window !== 'undefined' && typeof ResizeObserver !== 'undefined'
+        return isClient && typeof ResizeObserver !== 'undefined'
             ? new ResizeObserver(function (entries) {
                 cancelAnimationFrame(frameID.current);
                 frameID.current = requestAnimationFrame(function () {

package/__inner__/esm/hooks/useDeprecated/base/index.d.ts

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

package/__inner__/esm/hooks/useDeprecated/base/index.js

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

package/__inner__/esm/hooks/useDeprecated/base/types.d.ts

@@ -0,0 +1,6 @@
+export type UseDeprecatedBaseParams = {
+    type: string;
+    name: string;
+    nameNext?: string;
+    isLogNeeded?: boolean;
+};

package/__inner__/esm/hooks/useDeprecated/base/types.js

@@ -0,0 +1 @@
+export {};

package/__inner__/esm/hooks/useDeprecated/base/useDeprecatedBase.d.ts

@@ -0,0 +1,2 @@
+import type { UseDeprecatedBaseParams } from './types';
+export declare const useDeprecatedBase: ({ type: typeProp, name, nameNext, isLogNeeded, }: UseDeprecatedBaseParams) => void;

package/__inner__/esm/hooks/useDeprecated/base/useDeprecatedBase.js

@@ -0,0 +1,11 @@
+import { deprecate } from '@ozen-ui/logger';
+import { isProduction } from '../../../constants/environment';
+import { capitalizeFirstLetter } from '../../../utils/capitalizeFirstLetter';
+export var useDeprecatedBase = function (_a) {
+    var typeProp = _a.type, name = _a.name, nameNext = _a.nameNext, isLogNeeded = _a.isLogNeeded;
+    if (isProduction || !isLogNeeded) {
+        return;
+    }
+    var type = typeProp.toLowerCase();
+    deprecate("".concat(capitalizeFirstLetter(type), " \u00AB").concat(name, "\u00BB deprecated.").concat(nameNext ? " \u0414\u043B\u044F \u0437\u0430\u043C\u0435\u043D\u044B \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0439\u0442\u0435 ".concat(type, " \u00AB").concat(nameNext, "\u00BB.") : ''));
+};

package/__inner__/esm/hooks/useDeprecated/component/index.d.ts

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

package/__inner__/esm/hooks/useDeprecated/component/index.js

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

package/__inner__/esm/hooks/useDeprecated/component/useDeprecatedComponent.d.ts

@@ -0,0 +1 @@
+export declare const useDeprecatedComponent: (name: string, nameNext?: string) => void;

package/__inner__/esm/hooks/useDeprecated/component/useDeprecatedComponent.js

@@ -0,0 +1,9 @@
+import { useDeprecatedBase } from '../base';
+export var useDeprecatedComponent = function (name, nameNext) {
+    useDeprecatedBase({
+        name: name,
+        nameNext: nameNext !== null && nameNext !== void 0 ? nameNext : "".concat(name, "Next"),
+        type: 'компонент',
+        isLogNeeded: true,
+    });
+};

package/__inner__/esm/hooks/useDeprecated/hook/index.d.ts

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

package/__inner__/esm/hooks/useDeprecated/hook/index.js

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

package/__inner__/esm/hooks/useDeprecated/hook/useDeprecatedHook.d.ts

@@ -0,0 +1 @@
+export declare const useDeprecatedHook: (name: string, nameNext?: string) => void;

package/__inner__/esm/hooks/useDeprecated/hook/useDeprecatedHook.js

@@ -0,0 +1,9 @@
+import { useDeprecatedBase } from '../base';
+export var useDeprecatedHook = function (name, nameNext) {
+    useDeprecatedBase({
+        name: name,
+        nameNext: nameNext !== null && nameNext !== void 0 ? nameNext : "".concat(name, "Next"),
+        type: 'хук',
+        isLogNeeded: true,
+    });
+};

package/__inner__/esm/hooks/useDeprecated/index.d.ts

@@ -0,0 +1,3 @@
+export * from './component';
+export * from './hook';
+export * from './property';

package/__inner__/esm/hooks/useDeprecated/index.js

@@ -0,0 +1,3 @@
+export * from './component';
+export * from './hook';
+export * from './property';

package/__inner__/esm/hooks/useDeprecated/property/index.d.ts

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

package/__inner__/esm/hooks/useDeprecated/property/index.js

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

package/__inner__/esm/hooks/useDeprecated/property/useDeprecatedProperty.d.ts

@@ -0,0 +1 @@
+export declare const useDeprecatedProperty: (isUsing: boolean, name: string, nameNext?: string) => void;

package/__inner__/esm/hooks/useDeprecated/property/useDeprecatedProperty.js

@@ -0,0 +1,9 @@
+import { useDeprecatedBase } from '../base';
+export var useDeprecatedProperty = function (isUsing, name, nameNext) {
+    useDeprecatedBase({
+        name: name,
+        nameNext: nameNext,
+        type: 'свойство',
+        isLogNeeded: isUsing,
+    });
+};

package/__inner__/esm/hooks/useDeviceDetect/useDeviceDetect.js

@@ -1,5 +1,6 @@
 import { __read } from "tslib";
 import { useState } from 'react';
+import { isServer } from '../../constants/environment';
 import { useIsomorphicEffect } from '../useIsomorphicEffect';
 function getPlatform(userAgent) {
     var iosPlatforms = /iphone|ipad|ipod/i.test(userAgent);
@@ -32,7 +33,7 @@ export function useDeviceDetect() {
     var _a = __read(useState(false), 2), isMobile = _a[0], setIsMobile = _a[1];
     var _b = __read(useState('undetermined'), 2), platform = _b[0], setPlatform = _b[1];
     useIsomorphicEffect(function () {
-        if (typeof window === 'undefined') {
+        if (isServer) {
             return;
         }
         var userAgent = window.navigator.userAgent;

package/__inner__/esm/hooks/useIsomorphicEffect/useIsomorphicEffect.js

@@ -1,2 +1,3 @@
 import { useEffect, useLayoutEffect } from 'react';
-export var useIsomorphicEffect = typeof window === 'undefined' ? useEffect : useLayoutEffect;
+import { isServer } from '../../constants/environment';
+export var useIsomorphicEffect = isServer ? useEffect : useLayoutEffect;