@ozen-ui/kit 0.67.0 → 0.69.0

package/__inner__/cjs/components/Popover/Popover.js

@@ -6,16 +6,18 @@ var react_1 = tslib_1.__importStar(require("react"));
 var react_popper_1 = require("react-popper");
 var react_transition_group_1 = require("react-transition-group");
 require("./Popover.css");
+var environment_1 = require("../../constants/environment");
 var useClickOutside_1 = require("../../hooks/useClickOutside");
 var useEventListener_1 = require("../../hooks/useEventListener");
 var useFocusTrap_1 = require("../../hooks/useFocusTrap");
 var useMultiRef_1 = require("../../hooks/useMultiRef");
+var usePortalContainer_1 = require("../../hooks/usePortalContainer");
 var useThemeProps_1 = require("../../hooks/useThemeProps");
 var classname_1 = require("../../utils/classname");
 var isKey_1 = require("../../utils/isKey");
 var polymorphicComponentWithRef_1 = require("../../utils/polymorphicComponentWithRef");
 var Paper_1 = require("../Paper");
-var Portal_1 = require("../Portal");
+var PortalBase_1 = require("../PortalBase");
 var components_1 = require("./components");
 var constants_1 = require("./constants");
 var index_1 = require("./index");
@@ -23,21 +25,21 @@ var PopoverContext_1 = require("./PopoverContext");
 exports.cnPopover = (0, classname_1.cn)('Popover');
 exports.Popover = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (inProps, ref) {
     var props = (0, useThemeProps_1.useThemeProps)({ props: inProps, name: 'Popover' });
-    var _a = props.arrow, arrow = _a === void 0 ? constants_1.POPOVER_DEFAULT_ARROW : _a, _b = props.open, open = _b === void 0 ? constants_1.POPOVER_DEFAULT_OPEN : _b, _c = props.disableInteractive, disableInteractive = _c === void 0 ? constants_1.POPOVER_DEFAULT_DISABLE_INTERACTIVE : _c, _d = props.disableEnforceFocus, disableEnforceFocus = _d === void 0 ? constants_1.POPOVER_DEFAULT_DISABLE_ENFORCE_FOCUS : _d, _e = props.disableReturnFocus, disableReturnFocus = _e === void 0 ? constants_1.POPOVER_DEFAULT_DISABLE_RETURN_FOCUS : _e, _f = props.disableClickOutside, disableClickOutside = _f === void 0 ? constants_1.POPOVER_DEFAULT_DISABLE_CLICK_OUTSIDE : _f, _g = props.placement, placement = _g === void 0 ? constants_1.POPOVER_DEFAULT_PLACEMENT : _g, _h = props.strategy, strategy = _h === void 0 ? constants_1.POPOVER_DEFAULT_STRATEGY : _h, _j = props.disablePreventOverflow, disablePreventOverflow = _j === void 0 ? constants_1.POPOVER_DEFAULT_DISABLE_PREVENT_OVERFLOW : _j, ignoreClickOutsideRefs = props.ignoreClickOutsideRefs, disableEscapeKeyDown = props.disableEscapeKeyDown, arrowProps = props.arrowProps, anchorRef = props.anchorRef, equalAnchorWidth = props.equalAnchorWidth, offset = props.offset, children = props.children, transitionProps = props.transitionProps, onClose = props.onClose, onEnter = props.onEnter, onEntered = props.onEntered, onExit = props.onExit, onExitedProp = props.onExited, className = props.className, position = props.position, style = props.style, setUpdate = props.setUpdate, modifiersProp = props.modifiers, _k = props.as, as = _k === void 0 ? constants_1.POPOVER_DEFAULT_TAG : _k, other = tslib_1.__rest(props, ["arrow", "open", "disableInteractive", "disableEnforceFocus", "disableReturnFocus", "disableClickOutside", "placement", "strategy", "disablePreventOverflow", "ignoreClickOutsideRefs", "disableEscapeKeyDown", "arrowProps", "anchorRef", "equalAnchorWidth", "offset", "children", "transitionProps", "onClose", "onEnter", "onEntered", "onExit", "onExited", "className", "position", "style", "setUpdate", "modifiers", "as"]);
+    var _a = props.arrow, arrow = _a === void 0 ? constants_1.POPOVER_DEFAULT_ARROW : _a, _b = props.open, open = _b === void 0 ? constants_1.POPOVER_DEFAULT_OPEN : _b, _c = props.disableInteractive, disableInteractive = _c === void 0 ? constants_1.POPOVER_DEFAULT_DISABLE_INTERACTIVE : _c, _d = props.disableEnforceFocus, disableEnforceFocus = _d === void 0 ? constants_1.POPOVER_DEFAULT_DISABLE_ENFORCE_FOCUS : _d, _e = props.disableReturnFocus, disableReturnFocus = _e === void 0 ? constants_1.POPOVER_DEFAULT_DISABLE_RETURN_FOCUS : _e, _f = props.disableClickOutside, disableClickOutside = _f === void 0 ? constants_1.POPOVER_DEFAULT_DISABLE_CLICK_OUTSIDE : _f, _g = props.placement, placement = _g === void 0 ? constants_1.POPOVER_DEFAULT_PLACEMENT : _g, _h = props.strategy, strategy = _h === void 0 ? constants_1.POPOVER_DEFAULT_STRATEGY : _h, _j = props.disablePreventOverflow, disablePreventOverflow = _j === void 0 ? constants_1.POPOVER_DEFAULT_DISABLE_PREVENT_OVERFLOW : _j, _k = props.container, containerProp = _k === void 0 ? constants_1.POPOVER_DEFAULT_PORTAL_CONTAINER : _k, ignoreClickOutsideRefs = props.ignoreClickOutsideRefs, disableEscapeKeyDown = props.disableEscapeKeyDown, arrowProps = props.arrowProps, anchorRef = props.anchorRef, equalAnchorWidth = props.equalAnchorWidth, offset = props.offset, children = props.children, transitionProps = props.transitionProps, onClose = props.onClose, onEnter = props.onEnter, onEntered = props.onEntered, onExit = props.onExit, onExitedProp = props.onExited, className = props.className, position = props.position, style = props.style, setUpdate = props.setUpdate, modifiersProp = props.modifiers, _l = props.as, as = _l === void 0 ? constants_1.POPOVER_DEFAULT_TAG : _l, other = tslib_1.__rest(props, ["arrow", "open", "disableInteractive", "disableEnforceFocus", "disableReturnFocus", "disableClickOutside", "placement", "strategy", "disablePreventOverflow", "container", "ignoreClickOutsideRefs", "disableEscapeKeyDown", "arrowProps", "anchorRef", "equalAnchorWidth", "offset", "children", "transitionProps", "onClose", "onEnter", "onEntered", "onExit", "onExited", "className", "position", "style", "setUpdate", "modifiers", "as"]);
     var Tag = (0, react_1.useMemo)(function () {
         // eslint-disable-next-line react/display-name
         return (0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(Paper_1.Paper, tslib_1.__assign({ radius: "l", shadow: "m", background: "main" }, props, { as: as, ref: ref }))); });
     }, [as]);
-    var _l = tslib_1.__read((0, react_1.useState)(false), 2), openState = _l[0], setOpenState = _l[1];
+    var _m = tslib_1.__read((0, react_1.useState)(false), 2), openState = _m[0], setOpenState = _m[1];
     var focusedElement = (0, react_1.useRef)(null);
     var popoverRef = (0, react_1.useRef)(null);
-    var _m = (0, index_1.usePopoverManager)(popoverRef, 1000, openState), refsClickOutside = _m.refsClickOutside, isTop = _m.isTop;
+    var _o = (0, index_1.usePopoverManager)(popoverRef, 1000, openState), refsClickOutside = _o.refsClickOutside, isTop = _o.isTop;
     // Ловушка фокуса
     var trapRef = (0, useFocusTrap_1.useFocusTrap)({
         active: !disableEnforceFocus && isTop,
         focusinTrap: false,
     });
-    var _o = tslib_1.__read((0, react_1.useState)(null), 2), popperElement = _o[0], setPopperElement = _o[1];
+    var _p = tslib_1.__read((0, react_1.useState)(null), 2), popperElement = _p[0], setPopperElement = _p[1];
     var portalRef = (0, useMultiRef_1.useMultiRef)([ref, popoverRef, trapRef, setPopperElement]);
     // Нажатие клавиши {ESC}
     (0, useEventListener_1.useEventListener)({
@@ -58,6 +60,9 @@ exports.Popover = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)
     });
     var onExited = (0, react_1.useCallback)(function () {
         var _a, _b;
+        if (environment_1.isServer) {
+            return;
+        }
         // Возвращаем фокус активного элемента
         if (!disableReturnFocus &&
             (((_a = popoverRef.current) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement)) ||
@@ -130,11 +135,11 @@ exports.Popover = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)
             };
         return undefined;
     }, [anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current, position]);
-    var _p = (0, react_popper_1.usePopper)(resolveReferenceElement, popperElement, {
+    var _q = (0, react_popper_1.usePopper)(resolveReferenceElement, popperElement, {
         placement: placement,
         strategy: strategy,
         modifiers: modifiers,
-    }), styles = _p.styles, attributes = _p.attributes, update = _p.update;
+    }), styles = _q.styles, attributes = _q.attributes, update = _q.update;
     // Передача метода по перерасчету расположения компонента Popover в родительский компонент
     (0, react_1.useEffect)(function () {
         setUpdate === null || setUpdate === void 0 ? void 0 : setUpdate(update);
@@ -149,9 +154,13 @@ exports.Popover = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)
         }
         setOpenState(open);
     }, [open]);
+    var container = (0, usePortalContainer_1.usePortalContainer)(containerProp);
+    if (!container) {
+        return null;
+    }
     return (react_1.default.createElement(PopoverContext_1.PopoverContext.Provider, { value: { isTop: isTop } },
         react_1.default.createElement(react_transition_group_1.CSSTransition, tslib_1.__assign({ nodeRef: popoverRef, classNames: (0, exports.cnPopover)({ animation: true }), timeout: 120 }, transitionProps, { in: openState, onEnter: onEnter, onEntered: onEntered, onExit: onExit, onExited: onExited, unmountOnExit: true }),
-            react_1.default.createElement(Portal_1.Portal, tslib_1.__assign({ as: Tag }, other, { style: tslib_1.__assign(tslib_1.__assign({}, style), styles.popper), ref: portalRef, className: (0, exports.cnPopover)({ disableInteractive: disableInteractive }, [className]) }, attributes.popper),
+            react_1.default.createElement(PortalBase_1.PortalBase, tslib_1.__assign({ as: Tag }, other, { style: tslib_1.__assign(tslib_1.__assign({}, style), styles.popper), ref: portalRef, container: container, className: (0, exports.cnPopover)({ disableInteractive: disableInteractive }, [className]) }, attributes.popper),
                 children,
                 arrow && (react_1.default.createElement(components_1.PopoverArrow, tslib_1.__assign({}, arrowProps, { style: tslib_1.__assign(tslib_1.__assign({}, arrowProps === null || arrowProps === void 0 ? void 0 : arrowProps.style), styles.arrow), "data-popper-arrow": true })))))));
 });

package/__inner__/cjs/components/Popover/constants.d.ts

@@ -8,3 +8,4 @@ export declare const POPOVER_DEFAULT_DISABLE_CLICK_OUTSIDE = false;
 export declare const POPOVER_DEFAULT_PLACEMENT = "auto";
 export declare const POPOVER_DEFAULT_STRATEGY = "fixed";
 export declare const POPOVER_DEFAULT_DISABLE_PREVENT_OVERFLOW = false;
+export declare const POPOVER_DEFAULT_PORTAL_CONTAINER: () => HTMLElement;

package/__inner__/cjs/components/Popover/constants.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.POPOVER_DEFAULT_DISABLE_PREVENT_OVERFLOW = exports.POPOVER_DEFAULT_STRATEGY = exports.POPOVER_DEFAULT_PLACEMENT = exports.POPOVER_DEFAULT_DISABLE_CLICK_OUTSIDE = exports.POPOVER_DEFAULT_DISABLE_RETURN_FOCUS = exports.POPOVER_DEFAULT_DISABLE_ENFORCE_FOCUS = exports.POPOVER_DEFAULT_DISABLE_INTERACTIVE = exports.POPOVER_DEFAULT_OPEN = exports.POPOVER_DEFAULT_ARROW = exports.POPOVER_DEFAULT_TAG = void 0;
+exports.POPOVER_DEFAULT_PORTAL_CONTAINER = exports.POPOVER_DEFAULT_DISABLE_PREVENT_OVERFLOW = exports.POPOVER_DEFAULT_STRATEGY = exports.POPOVER_DEFAULT_PLACEMENT = exports.POPOVER_DEFAULT_DISABLE_CLICK_OUTSIDE = exports.POPOVER_DEFAULT_DISABLE_RETURN_FOCUS = exports.POPOVER_DEFAULT_DISABLE_ENFORCE_FOCUS = exports.POPOVER_DEFAULT_DISABLE_INTERACTIVE = exports.POPOVER_DEFAULT_OPEN = exports.POPOVER_DEFAULT_ARROW = exports.POPOVER_DEFAULT_TAG = void 0;
 exports.POPOVER_DEFAULT_TAG = 'div';
 exports.POPOVER_DEFAULT_ARROW = false;
 exports.POPOVER_DEFAULT_OPEN = false;
@@ -11,3 +11,6 @@ exports.POPOVER_DEFAULT_DISABLE_CLICK_OUTSIDE = false;
 exports.POPOVER_DEFAULT_PLACEMENT = 'auto';
 exports.POPOVER_DEFAULT_STRATEGY = 'fixed';
 exports.POPOVER_DEFAULT_DISABLE_PREVENT_OVERFLOW = false;
+exports.POPOVER_DEFAULT_PORTAL_CONTAINER = (function () {
+    return window.document.body;
+});

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

@@ -14,6 +14,8 @@ export declare const popoverPlacementVariant: readonly ["top-start", "top-end",
 export type PopoverPlacementVariant = (typeof popoverPlacementVariant)[number];
 export declare const popoverStrategyVariant: readonly ["absolute", "fixed"];
 export type PopoverStrategyVariant = (typeof popoverStrategyVariant)[number];
+export type PopoverUpdate = PopperJS.Instance['update'];
+export type PopoverSetUpdate = (update: PopoverUpdate | null) => void;
 export type PopoverBaseProps = {
     /** Признак по которому компонент будет представлен */
     open?: boolean;
@@ -70,7 +72,7 @@ export type PopoverBaseProps = {
     /** Идентификатор компонента для тестов */
     'data-testid'?: string;
     /** Функция обратного вызова для получения метода по перерасчету расположения компонента Popover */
-    setUpdate?(update: PopperJS.Instance['update'] | null): void;
+    setUpdate?: PopoverSetUpdate;
     /** Стратегия позиционирования */
     strategy?: PopoverStrategyVariant;
     /** Если `true` позволяет смещаться по границе якорного элемента компонента  */

package/__inner__/cjs/components/Portal/Portal.d.ts

@@ -1,2 +1,2 @@
-import type { PortalBaseProps } from './index';
+import type { PortalBaseProps } from './types';
 export declare const Portal: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<PortalBaseProps, "div">;

package/__inner__/cjs/components/Portal/Portal.js

@@ -3,18 +3,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Portal = void 0;
 var tslib_1 = require("tslib");
 var react_1 = tslib_1.__importDefault(require("react"));
-var react_dom_1 = require("react-dom");
+var usePortalContainer_1 = require("../../hooks/usePortalContainer");
 var useThemeProps_1 = require("../../hooks/useThemeProps");
 var polymorphicComponentWithRef_1 = require("../../utils/polymorphicComponentWithRef");
-var ThemeProvider_1 = require("../ThemeProvider");
+var PortalBase_1 = require("../PortalBase");
 var constants_1 = require("./constants");
 exports.Portal = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (inProps, ref) {
     var _a = (0, useThemeProps_1.useThemeProps)({
         props: inProps,
         name: 'Portal',
-    }), _b = _a.disablePortal, disablePortal = _b === void 0 ? constants_1.PORTAL_DEFAULT_DISABLE_PORTAL : _b, _c = _a.as, Tag = _c === void 0 ? constants_1.PORTAL_DEFAULT_TAG : _c, containerProp = _a.container, children = _a.children, other = tslib_1.__rest(_a, ["disablePortal", "as", "container", "children"]);
-    var container = containerProp || constants_1.PORTAL_DEFAULT_CONTAINER;
-    var theme = (0, ThemeProvider_1.useTheme)();
-    return disablePortal ? (react_1.default.createElement(Tag, tslib_1.__assign({}, other, { ref: ref }), children)) : ((0, react_dom_1.createPortal)(react_1.default.createElement(ThemeProvider_1.ThemeProvider, tslib_1.__assign({ theme: theme, as: Tag }, other, { ref: ref }), children), container));
+    }), _b = _a.disablePortal, disablePortal = _b === void 0 ? constants_1.PORTAL_DEFAULT_DISABLE_PORTAL : _b, _c = _a.as, as = _c === void 0 ? constants_1.PORTAL_DEFAULT_TAG : _c, containerProp = _a.container, children = _a.children, other = tslib_1.__rest(_a, ["disablePortal", "as", "container", "children"]);
+    var container = (0, usePortalContainer_1.usePortalContainer)(containerProp || constants_1.PORTAL_DEFAULT_CONTAINER);
+    return (react_1.default.createElement(PortalBase_1.PortalBase, tslib_1.__assign({}, other, { container: container, as: as, ref: ref, disablePortal: disablePortal }), children));
 });
 exports.Portal.displayName = 'Portal';

package/__inner__/cjs/components/Portal/constants.d.ts

@@ -1,3 +1,3 @@
 export declare const PORTAL_DEFAULT_TAG = "div";
-export declare const PORTAL_DEFAULT_CONTAINER: HTMLElement;
+export declare const PORTAL_DEFAULT_CONTAINER: () => HTMLElement;
 export declare const PORTAL_DEFAULT_DISABLE_PORTAL = false;

package/__inner__/cjs/components/Portal/constants.js

@@ -2,5 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PORTAL_DEFAULT_DISABLE_PORTAL = exports.PORTAL_DEFAULT_CONTAINER = exports.PORTAL_DEFAULT_TAG = void 0;
 exports.PORTAL_DEFAULT_TAG = 'div';
-exports.PORTAL_DEFAULT_CONTAINER = window.document.body;
+exports.PORTAL_DEFAULT_CONTAINER = (function () {
+    return window.document.body;
+});
 exports.PORTAL_DEFAULT_DISABLE_PORTAL = false;

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

@@ -1,12 +1,11 @@
 import type { ComponentRef, ElementType } from 'react';
+import type { PortalContainer } from '../../hooks/usePortalContainer';
+import type { ExtendableProps } from '../../types/ExtendableProps';
 import type { PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
+import type { PortalBaseBaseProps } from '../PortalBase';
 import type { PORTAL_DEFAULT_TAG } from './constants';
 export type PortalRef = ComponentRef<typeof PORTAL_DEFAULT_TAG>;
-export type PortalBaseProps = {
-    /** Контейнер для монтирования портала */
-    container?: Element | DocumentFragment | null;
-    /** Если `true` отключает портал для компонента.
-     * Подробнее — https://react.dev/reference/react-dom/createPortal. */
-    disablePortal?: boolean;
-};
+export type PortalBaseProps = ExtendableProps<{
+    container?: PortalContainer;
+}, PortalBaseBaseProps>;
 export type PortalProps<As extends ElementType = typeof PORTAL_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<PortalBaseProps, As>;

package/__inner__/cjs/components/PortalBase/PortalBase.d.ts

@@ -0,0 +1,2 @@
+import type { PortalBaseBaseProps } from './types';
+export declare const PortalBase: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<PortalBaseBaseProps, "div">;

package/__inner__/cjs/components/PortalBase/PortalBase.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PortalBase = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var react_dom_1 = require("react-dom");
+var polymorphicComponentWithRef_1 = require("../../utils/polymorphicComponentWithRef");
+var ThemeProvider_1 = require("../ThemeProvider");
+var constants_1 = require("./constants");
+exports.PortalBase = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (_a, ref) {
+    var _b = _a.disablePortal, disablePortal = _b === void 0 ? constants_1.PORTAL_BASE_DEFAULT_DISABLE_PORTAL : _b, _c = _a.as, Tag = _c === void 0 ? constants_1.PORTAL_BASE_DEFAULT_TAG : _c, container = _a.container, children = _a.children, other = tslib_1.__rest(_a, ["disablePortal", "as", "container", "children"]);
+    var theme = (0, ThemeProvider_1.useTheme)();
+    if (disablePortal) {
+        return (react_1.default.createElement(Tag, tslib_1.__assign({}, other, { ref: ref }), children));
+    }
+    if (!container) {
+        return null;
+    }
+    return (0, react_dom_1.createPortal)(react_1.default.createElement(ThemeProvider_1.ThemeProvider, tslib_1.__assign({ theme: theme, as: Tag }, other, { ref: ref }), children), container);
+});
+exports.PortalBase.displayName = 'PortalBase';

package/__inner__/cjs/components/PortalBase/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const PORTAL_BASE_DEFAULT_TAG = "div";
+export declare const PORTAL_BASE_DEFAULT_DISABLE_PORTAL = false;

package/__inner__/cjs/components/PortalBase/constants.js

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

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

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

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

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

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

@@ -0,0 +1,15 @@
+import type { ComponentRef, ElementType } from 'react';
+import type { PortalContainerElement } from '../../hooks/usePortalContainer';
+import type { PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
+import type { PORTAL_BASE_DEFAULT_TAG } from './constants';
+export type PortalBaseRef = ComponentRef<typeof PORTAL_BASE_DEFAULT_TAG>;
+export type PortalBaseBaseProps = {
+    /** Контейнер для монтирования портала */
+    container: PortalContainerElement;
+    /** Если `true` отключает портал для компонента.
+     * Подробнее — https://react.dev/reference/react-dom/createPortal. */
+    disablePortal?: boolean;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+};
+export type PortalBaseProps<As extends ElementType = typeof PORTAL_BASE_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<PortalBaseBaseProps, As>;

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

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

package/__inner__/cjs/components/Radio/Radio.d.ts

@@ -2,4 +2,7 @@ import './Radio.css';
 import React from 'react';
 import type { RadioProps } from './index';
 export declare const cnRadio: import("@bem-react/classname").ClassNameFormatter;
+/**
+ * @deprecated Компонент устарел. Для замены используйте компонент RadioNext
+ */
 export declare const Radio: React.ForwardRefExoticComponent<Omit<RadioProps, "ref"> & React.RefAttributes<HTMLLabelElement>>;

package/__inner__/cjs/components/Radio/Radio.js

@@ -4,13 +4,18 @@ exports.Radio = exports.cnRadio = void 0;
 var tslib_1 = require("tslib");
 require("./Radio.css");
 var react_1 = tslib_1.__importStar(require("react"));
+var useDeprecated_1 = require("../../hooks/useDeprecated");
 var useThemeProps_1 = require("../../hooks/useThemeProps");
 var classname_1 = require("../../utils/classname");
 var FormControlLabel_1 = require("../FormControlLabel");
 var RadioGroupContext_1 = require("../RadioGroup/RadioGroupContext");
 var constants_1 = require("./constants");
 exports.cnRadio = (0, classname_1.cn)('Radio');
+/**
+ * @deprecated Компонент устарел. Для замены используйте компонент RadioNext
+ */
 exports.Radio = (0, react_1.forwardRef)(function (inProps, ref) {
+    (0, useDeprecated_1.useDeprecatedComponent)('Radio');
     var props = (0, useThemeProps_1.useThemeProps)({
         props: inProps,
         name: 'Radio',

package/__inner__/cjs/components/RadioGroup/RadioGroup.d.ts

@@ -1,4 +1,7 @@
 import './RadioGroup.css';
 import type { RadioGroupBaseProps } from './index';
 export declare const cnRadioGroup: import("@bem-react/classname").ClassNameFormatter;
+/**
+ * @deprecated Компонент устарел. Для замены используйте компонент RadioGroupNext
+ */
 export declare const RadioGroup: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<RadioGroupBaseProps, "div">;

package/__inner__/cjs/components/RadioGroup/RadioGroup.js

@@ -5,6 +5,7 @@ var tslib_1 = require("tslib");
 require("./RadioGroup.css");
 var react_1 = tslib_1.__importDefault(require("react"));
 var useControlled_1 = require("../../hooks/useControlled");
+var useDeprecated_1 = require("../../hooks/useDeprecated");
 var useThemeProps_1 = require("../../hooks/useThemeProps");
 var classname_1 = require("../../utils/classname");
 var polymorphicComponentWithRef_1 = require("../../utils/polymorphicComponentWithRef");
@@ -13,7 +14,11 @@ var FormTitle_1 = require("../FormTitle");
 var constants_1 = require("./constants");
 var RadioGroupContext_1 = require("./RadioGroupContext");
 exports.cnRadioGroup = (0, classname_1.cn)('RadioGroup');
+/**
+ * @deprecated Компонент устарел. Для замены используйте компонент RadioGroupNext
+ */
 exports.RadioGroup = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (inProps, ref) {
+    (0, useDeprecated_1.useDeprecatedComponent)('RadioGroup');
     var props = (0, useThemeProps_1.useThemeProps)({
         props: inProps,
         name: 'RadioGroup',

package/__inner__/cjs/components/RadioGroupNext/RadioGroup.css

@@ -0,0 +1,8 @@
+.RadioGroupNext {
+  display: flex;
+  flex-direction: column;
+}
+
+  .RadioGroupNext .FormGroup {
+    align-items: flex-start;
+  }

package/__inner__/cjs/components/RadioGroupNext/RadioGroup.d.ts

@@ -0,0 +1,4 @@
+import './RadioGroup.css';
+import type { RadioGroupBaseProps } from './types';
+export declare const cnRadioGroup: import("@bem-react/classname").ClassNameFormatter;
+export declare const RadioGroup: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<RadioGroupBaseProps, "div">;

package/__inner__/cjs/components/RadioGroupNext/RadioGroup.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RadioGroup = exports.cnRadioGroup = void 0;
+var tslib_1 = require("tslib");
+require("./RadioGroup.css");
+var react_1 = tslib_1.__importDefault(require("react"));
+var useControlled_1 = require("../../hooks/useControlled");
+var useThemeProps_1 = require("../../hooks/useThemeProps");
+var classname_1 = require("../../utils/classname");
+var polymorphicComponentWithRef_1 = require("../../utils/polymorphicComponentWithRef");
+var FormGroup_1 = require("../FormGroup");
+var FormTitle_1 = require("../FormTitle");
+var constants_1 = require("./constants");
+var RadioGroupContext_1 = require("./RadioGroupContext");
+exports.cnRadioGroup = (0, classname_1.cn)('RadioGroupNext');
+exports.RadioGroup = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (inProps, ref) {
+    var props = (0, useThemeProps_1.useThemeProps)({
+        props: inProps,
+        name: 'RadioGroupNext',
+    });
+    var _a = props.direction, direction = _a === void 0 ? constants_1.RADIO_GROUP_DEFAULT_DIRECTION : _a, _b = props.size, size = _b === void 0 ? constants_1.RADIO_GROUP_DEFAULT_SIZE : _b, _c = props.as, Tag = _c === void 0 ? constants_1.RADIO_GROUP_DEFAULT_AS : _c, _d = props.variant, variant = _d === void 0 ? constants_1.RADIO_GROUP_DEFAULT_VARIANT : _d, _e = props.mirrored, mirrored = _e === void 0 ? constants_1.RADIO_GROUP_DEFAULT_MIRRORED : _e, _f = props.align, align = _f === void 0 ? constants_1.RADIO_GROUP_DEFAULT_ALIGN : _f, title = props.title, className = props.className, children = props.children, name = props.name, valueProp = props.value, defaultValue = props.defaultValue, onChange = props.onChange, other = tslib_1.__rest(props, ["direction", "size", "as", "variant", "mirrored", "align", "title", "className", "children", "name", "value", "defaultValue", "onChange"]);
+    var _g = tslib_1.__read((0, useControlled_1.useControlled)({
+        value: valueProp,
+        defaultValue: defaultValue,
+        name: 'RadioGroup',
+        state: 'value',
+    }), 2), valueState = _g[0], setValueState = _g[1];
+    var handleChange = function (event) {
+        setValueState(event.target.value);
+        onChange === null || onChange === void 0 ? void 0 : onChange(event);
+    };
+    return (react_1.default.createElement(RadioGroupContext_1.RadioGroupContext.Provider, { value: {
+            value: valueState,
+            onChange: handleChange,
+            name: name,
+            size: size,
+            variant: variant,
+            mirrored: mirrored,
+            align: align,
+        } },
+        react_1.default.createElement(Tag, tslib_1.__assign({ className: (0, exports.cnRadioGroup)({ size: size }, [className]), role: "radiogroup" }, other, { ref: ref }),
+            title && react_1.default.createElement(FormTitle_1.FormTitle, { size: size }, title),
+            react_1.default.createElement(FormGroup_1.FormGroup, { direction: direction, size: size }, children))));
+});
+exports.RadioGroup.displayName = 'RadioGroup';

package/__inner__/cjs/components/RadioGroupNext/RadioGroupContext.d.ts

@@ -0,0 +1,13 @@
+import type React from 'react';
+import type { RadioAlignVariant, RadioSizeVariant, RadioVariant } from '../RadioNext';
+export type RadioGroupContextValue = {
+    name: string | undefined;
+    onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    value?: string;
+    size?: RadioSizeVariant;
+    variant?: RadioVariant;
+    align?: RadioAlignVariant;
+    mirrored?: boolean;
+};
+export declare const RadioGroupContext: React.Context<RadioGroupContextValue | undefined>;
+export declare const useRadioGroupContext: () => RadioGroupContextValue | undefined;

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

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useRadioGroupContext = exports.RadioGroupContext = void 0;
+var react_1 = require("react");
+var environment_1 = require("../../constants/environment");
+exports.RadioGroupContext = (0, react_1.createContext)(undefined);
+var useRadioGroupContext = function () { return (0, react_1.useContext)(exports.RadioGroupContext); };
+exports.useRadioGroupContext = useRadioGroupContext;
+// Именованный провайдер
+if (environment_1.isDev) {
+    exports.RadioGroupContext.displayName = 'RadioGroupContext';
+}

package/__inner__/cjs/components/RadioGroupNext/constants.d.ts

@@ -0,0 +1,6 @@
+export declare const RADIO_GROUP_DEFAULT_DIRECTION = "column";
+export declare const RADIO_GROUP_DEFAULT_SIZE = "m";
+export declare const RADIO_GROUP_DEFAULT_MIRRORED = false;
+export declare const RADIO_GROUP_DEFAULT_ALIGN = "top";
+export declare const RADIO_GROUP_DEFAULT_AS = "div";
+export declare const RADIO_GROUP_DEFAULT_VARIANT = "default";

package/__inner__/cjs/components/RadioGroupNext/constants.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RADIO_GROUP_DEFAULT_VARIANT = exports.RADIO_GROUP_DEFAULT_AS = exports.RADIO_GROUP_DEFAULT_ALIGN = exports.RADIO_GROUP_DEFAULT_MIRRORED = exports.RADIO_GROUP_DEFAULT_SIZE = exports.RADIO_GROUP_DEFAULT_DIRECTION = void 0;
+var constants_1 = require("../RadioNext/constants");
+exports.RADIO_GROUP_DEFAULT_DIRECTION = 'column';
+exports.RADIO_GROUP_DEFAULT_SIZE = constants_1.RADIO_DEFAULT_SIZE;
+exports.RADIO_GROUP_DEFAULT_MIRRORED = constants_1.RADIO_DEFAULT_MIRRORED;
+exports.RADIO_GROUP_DEFAULT_ALIGN = constants_1.RADIO_DEFAULT_ALIGN;
+exports.RADIO_GROUP_DEFAULT_AS = 'div';
+exports.RADIO_GROUP_DEFAULT_VARIANT = constants_1.RADIO_DEFAULT_VARIANT;

package/__inner__/cjs/components/RadioGroupNext/entities/direction.d.ts

@@ -0,0 +1,2 @@
+export declare const radioGroupDirection: readonly ["row", "column", "rowReverse", "columnReverse"];
+export type RadioGroupDirection = (typeof radioGroupDirection)[number];

package/__inner__/cjs/components/RadioGroupNext/entities/direction.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.radioGroupDirection = void 0;
+var FormGroup_1 = require("../../FormGroup");
+exports.radioGroupDirection = FormGroup_1.formGroupDirectionVariant;

package/__inner__/cjs/components/RadioGroupNext/entities/index.d.ts

@@ -0,0 +1,2 @@
+export * from './direction';
+export * from './value';

package/__inner__/cjs/components/RadioGroupNext/entities/index.js

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

package/__inner__/cjs/components/RadioGroupNext/entities/value.d.ts

@@ -0,0 +1 @@
+export type RadioGroupValue = string;

package/__inner__/cjs/components/RadioGroupNext/entities/value.js

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

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

@@ -0,0 +1,4 @@
+export * from './entities';
+export * from './RadioGroupContext';
+export * from './RadioGroup';
+export * from './types';

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

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

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

@@ -0,0 +1,32 @@
+import type { ElementType, ReactNode, ChangeEvent } from 'react';
+import type { PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
+import type { FormGroupProps } from '../FormGroup';
+import type { RadioAlignVariant, RadioSizeVariant, RadioVariant } from '../RadioNext';
+import type { RADIO_GROUP_DEFAULT_AS } from './constants';
+export type RadioGroupBaseProps = {
+    /** Имя группы радиокнопок (передается всем вложенным радиокнопкам) */
+    name: string;
+    /** Значение по умолчанию (неконтролируемое состояние) */
+    defaultValue?: string;
+    /** Текущее значение */
+    value?: string;
+    /** Заголовок группы */
+    title?: string;
+    /** Размер */
+    size?: RadioSizeVariant;
+    /** Вариант отображения */
+    variant?: RadioVariant;
+    /** Выравнивание */
+    align?: RadioAlignVariant;
+    /** Если `true` делает чекбокс отзеркаленным */
+    mirrored?: boolean;
+    /** Содержимое компонента */
+    children?: ReactNode;
+    /** Направление */
+    direction?: FormGroupProps['direction'];
+    /** Событие изменения состояния */
+    onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+};
+export type RadioGroupProps<As extends ElementType = typeof RADIO_GROUP_DEFAULT_AS> = PolymorphicComponentPropsWithoutRef<RadioGroupBaseProps, As>;

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

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