@alfalab/core-components 48.6.0-beta.1 → 48.7.0

package/picker-button/typings-a9c8f92e.d.ts

@@ -6,13 +6,13 @@ import { HandledEvents } from "react-swipeable/es/types";
 import { TransitionProps } from "react-transition-group/Transition";
 import { BaseModalProps, BaseModalContext } from "./index-11f20b2e";
 import { BaseInputProps, BackdropProps } from "./index-ebda875c";
+import { ContentProps } from "./typings-4b7234ef";
+import { ModalResponsiveProps as ModalProps } from "./typings-4b7234ef";
 import { SwipeableHandlers, SwipeDirections } from "react-swipeable";
 import { Color } from "./colors-facf1d2a";
 import { TextElementType, TextSkeletonProps } from "./types-1328ead9";
 import { Title, TitleProps } from "./index-03d088c4";
 import { TitleMobile, TitleMobileProps } from "./index-281accb7";
-import { ContentProps } from "./typings-4b7234ef";
-import { ModalResponsiveProps as ModalProps } from "./typings-4b7234ef";
 import { FormControlProps } from "./index-c44170fe";
 import { PopoverProps } from "../popover";
 import { UseSelectWithApplyProps } from "./field/Component";
@@ -481,29 +481,6 @@ declare const Input: React.ForwardRefExoticComponent<Omit<BaseInputProps, "FormC
     client?: "desktop" | "mobile" | undefined;
     defaultMatchMediaValue?: boolean | (() => boolean) | undefined;
 } & React.RefAttributes<HTMLInputElement>>;
-type HeaderProps = Omit<NavigationBarPrivateProps, "size" | "view" | "parentRef">;
-type FooterProps = {
-    /**
-     * Контент футера
-     */
-    children?: ReactNode;
-    /**
-     * Дополнительный класс
-     */
-    className?: string;
-    /**
-     * Фиксирует футер
-     */
-    sticky?: boolean;
-    /**
-     * Выравнивание элементов футера
-     */
-    layout?: "start" | "center" | "space-between" | "column";
-    /**
-     * Отступы между элементами футера
-     */
-    gap?: 16 | 24 | 32;
-};
 interface ControlsProps {
     /**
      * Основной слот
@@ -528,6 +505,29 @@ interface ControlsProps {
      */
     gap?: 16 | 24 | 32;
 }
+type FooterProps = {
+    /**
+     * Контент футера
+     */
+    children?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Фиксирует футер
+     */
+    sticky?: boolean;
+    /**
+     * Выравнивание элементов футера
+     */
+    layout?: "start" | "center" | "space-between" | "column";
+    /**
+     * Отступы между элементами футера
+     */
+    gap?: 16 | 24 | 32;
+};
+type HeaderProps = Omit<NavigationBarPrivateProps, "size" | "view" | "parentRef">;
 declare const ModalResponsive: React.ForwardRefExoticComponent<import("./index-11f20b2e").BaseModalProps & {
     size?: "s" | "m" | "l" | "xl" | 500 | "fullscreen" | 600 | 800 | 1140 | undefined;
     fullscreen?: boolean | undefined;
@@ -692,7 +692,6 @@ declare enum SwipeDirection {
     Up = "Up",
     Down = "Down"
 }
-declare const Content: FC<ContentProps>;
 type AnyObject = Record<string, any>;
 type OptionShape = {
     /**
@@ -1444,7 +1443,7 @@ type ClearButtonProps = {
      */
     dataTestId?: string;
 };
-export { BottomSheet, CLOSE_OFFSET, HEADER_OFFSET, InputProps, Input, ModalResponsive as Modal, ModalContext, getModalTestIds, FooterProps$0 as FooterProps, Footer$0 as Footer, HeaderProps$0 as HeaderProps, Header$0 as Header, SwipeableBackdropProps, SwipeableBackdrop, horizontalDirections, ShouldSkipSwipingParams, useVisibleViewportSize, Typography, Text, Title as TitleDesktop, TitleResponsive, TitleMobile, typographyPresets, SwipeDirection, Content, AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps, SearchProps, SelectFieldProps, AdditionalMobileProps, BottomSheetSelectMobileProps, ModalSelectMobileProps, SelectModalMobileProps, SelectMobileProps, SelectDesktopProps, SelectProps, ClearButtonProps };
+export { BottomSheet, CLOSE_OFFSET, HEADER_OFFSET, InputProps, Input, ModalResponsive as Modal, ModalContext, getModalTestIds, FooterProps$0 as FooterProps, Footer$0 as Footer, HeaderProps$0 as HeaderProps, Header$0 as Header, SwipeableBackdropProps, SwipeableBackdrop, horizontalDirections, ShouldSkipSwipingParams, useVisibleViewportSize, Typography, Text, Title as TitleDesktop, TitleResponsive, TitleMobile, typographyPresets, SwipeDirection, AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps, SearchProps, SelectFieldProps, AdditionalMobileProps, BottomSheetSelectMobileProps, ModalSelectMobileProps, SelectModalMobileProps, SelectMobileProps, SelectDesktopProps, SelectProps, ClearButtonProps };
 export type { BottomSheetProps, BottomSheetTitleAlign, HeaderProps as ModalHeaderProps, FooterProps as ModalFooterProps, TextProps };
 export { ModalResponsiveProps as ModalProps } from "./typings-4b7234ef";
 export type { ContentProps as ModalContentProps } from "./typings-4b7234ef";

package/plate/components/base-plate/Component.js

@@ -5,7 +5,7 @@ var React = require('react');
 var mergeRefs = require('react-merge-refs');
 var cn = require('classnames');
 var coreComponentsIconButton = require('../../../icon-button');
-var warning = require('../../warning-5c40c8ff.js');
+var warning = require('../../warning-6210dd39.js');
 var hooks = require('@alfalab/hooks');
 var ChevronDownMIcon = require('@alfalab/icons-glyph/ChevronDownMIcon');
 var CrossMIcon = require('@alfalab/icons-glyph/CrossMIcon');
@@ -17,7 +17,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var commonStyles = {"component":"plate__component_1y4y7","foldable":"plate__foldable_1y4y7","focused":"plate__focused_1y4y7","inner":"plate__inner_1y4y7","rounded":"plate__rounded_1y4y7","noBorder":"plate__noBorder_1y4y7","shadow":"plate__shadow_1y4y7","common":"plate__common_1y4y7","negative":"plate__negative_1y4y7","positive":"plate__positive_1y4y7","attention":"plate__attention_1y4y7","custom":"plate__custom_1y4y7","rect":"plate__rect_1y4y7","isHidden":"plate__isHidden_1y4y7","leftAddons":"plate__leftAddons_1y4y7","rightAddons":"plate__rightAddons_1y4y7","subAddons":"plate__subAddons_1y4y7","rowReverse":"plate__rowReverse_1y4y7","bold":"plate__bold_1y4y7","light":"plate__light_1y4y7","content":"plate__content_1y4y7","isFolded":"plate__isFolded_1y4y7","contentContainer":"plate__contentContainer_1y4y7","withoutTitle":"plate__withoutTitle_1y4y7","limitWidth":"plate__limitWidth_1y4y7","description":"plate__description_1y4y7","closer":"plate__closer_1y4y7","folder":"plate__folder_1y4y7","containerButton":"plate__containerButton_1y4y7","button":"plate__button_1y4y7","rowLimit1":"plate__rowLimit1_1y4y7","rowLimit2":"plate__rowLimit2_1y4y7","rowLimit3":"plate__rowLimit3_1y4y7"};
+var commonStyles = {"component":"plate__component_1y4y7","customBorder":"plate__customBorder_1y4y7","foldable":"plate__foldable_1y4y7","focused":"plate__focused_1y4y7","inner":"plate__inner_1y4y7","rounded":"plate__rounded_1y4y7","noBorder":"plate__noBorder_1y4y7","shadow":"plate__shadow_1y4y7","common":"plate__common_1y4y7","negative":"plate__negative_1y4y7","positive":"plate__positive_1y4y7","attention":"plate__attention_1y4y7","custom":"plate__custom_1y4y7","rect":"plate__rect_1y4y7","isHidden":"plate__isHidden_1y4y7","leftAddons":"plate__leftAddons_1y4y7","rightAddons":"plate__rightAddons_1y4y7","subAddons":"plate__subAddons_1y4y7","rowReverse":"plate__rowReverse_1y4y7","bold":"plate__bold_1y4y7","light":"plate__light_1y4y7","content":"plate__content_1y4y7","isFolded":"plate__isFolded_1y4y7","contentContainer":"plate__contentContainer_1y4y7","withoutTitle":"plate__withoutTitle_1y4y7","limitWidth":"plate__limitWidth_1y4y7","description":"plate__description_1y4y7","closer":"plate__closer_1y4y7","folder":"plate__folder_1y4y7","containerButton":"plate__containerButton_1y4y7","button":"plate__button_1y4y7","rowLimit1":"plate__rowLimit1_1y4y7","rowLimit2":"plate__rowLimit2_1y4y7","rowLimit3":"plate__rowLimit3_1y4y7"};
 require('./index.css');
 
 /* eslint-disable complexity */
@@ -38,6 +38,7 @@ var BasePlate = React.forwardRef(function (_a, ref) {
     var hasSubAddons = !!subAddons && typeof subAddons !== 'boolean';
     var hasAnyAddons = leftAddons || subAddons || foldable || hasCloser;
     var rowLimitStyles = rowLimit && commonStyles["rowLimit".concat(rowLimit)];
+    var isCustomView = view === 'custom';
     var handleClick = React.useCallback(function (event) {
         var clickSimilarKeys = ['Enter', ' '].includes(event.key);
         if (event.type !== 'click' && !clickSimilarKeys) {
@@ -66,6 +67,23 @@ var BasePlate = React.forwardRef(function (_a, ref) {
             onClose(event);
         }
     }, [onClose]);
+    var setCustomViewColors = function () {
+        if (isCustomView) {
+            return {
+                background: background,
+                borderColor: borderColor,
+            };
+        }
+        return {};
+    };
+    var setCustomViewRectangleBorderColor = function () {
+        if (isCustomView && border && !rounded && borderColor) {
+            return {
+                boxShadow: "2px 0 0 0 ".concat(borderColor, " inset"),
+            };
+        }
+        return {};
+    };
     return (
     // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
     React__default.default.createElement("div", { className: cn__default.default(commonStyles.component, commonStyles[view], (_b = {},
@@ -79,7 +97,8 @@ var BasePlate = React.forwardRef(function (_a, ref) {
             _b[commonStyles.noBorder] = !border,
             _b[commonStyles.shadow] = shadow,
             _b[styles.shadow] = shadow,
-            _b), className), style: tslib.__assign({}, (view === 'custom' && { background: background, borderColor: borderColor })), onClick: handleClick, onKeyDown: handleClick, role: 'alert', ref: mergeRefs__default.default([plateRef, ref]), 
+            _b[commonStyles.customBorder] = border && !rounded && isCustomView,
+            _b), className), style: tslib.__assign(tslib.__assign({}, setCustomViewColors()), setCustomViewRectangleBorderColor()), onClick: handleClick, onKeyDown: handleClick, role: 'alert', ref: mergeRefs__default.default([plateRef, ref]), 
         /* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */
         tabIndex: foldable ? 0 : -1, "data-test-id": dataTestId },
         React__default.default.createElement("div", { className: commonStyles.inner },

package/plate/components/base-plate/index.css

@@ -69,6 +69,8 @@
         height: 100%;
         top: var(--gap-0);
         left: var(--gap-0);
+    } .plate__component_1y4y7.plate__customBorder_1y4y7:before {
+        all: unset;
     } .plate__foldable_1y4y7 {
     cursor: pointer;
 } .plate__component_1y4y7 * {

package/plate/cssm/components/base-plate/Component.js

@@ -37,6 +37,7 @@ var BasePlate = React.forwardRef(function (_a, ref) {
     var hasSubAddons = !!subAddons && typeof subAddons !== 'boolean';
     var hasAnyAddons = leftAddons || subAddons || foldable || hasCloser;
     var rowLimitStyles = rowLimit && commonStyles__default.default["rowLimit".concat(rowLimit)];
+    var isCustomView = view === 'custom';
     var handleClick = React.useCallback(function (event) {
         var clickSimilarKeys = ['Enter', ' '].includes(event.key);
         if (event.type !== 'click' && !clickSimilarKeys) {
@@ -65,6 +66,23 @@ var BasePlate = React.forwardRef(function (_a, ref) {
             onClose(event);
         }
     }, [onClose]);
+    var setCustomViewColors = function () {
+        if (isCustomView) {
+            return {
+                background: background,
+                borderColor: borderColor,
+            };
+        }
+        return {};
+    };
+    var setCustomViewRectangleBorderColor = function () {
+        if (isCustomView && border && !rounded && borderColor) {
+            return {
+                boxShadow: "2px 0 0 0 ".concat(borderColor, " inset"),
+            };
+        }
+        return {};
+    };
     return (
     // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
     React__default.default.createElement("div", { className: cn__default.default(commonStyles__default.default.component, commonStyles__default.default[view], (_b = {},
@@ -78,7 +96,8 @@ var BasePlate = React.forwardRef(function (_a, ref) {
             _b[commonStyles__default.default.noBorder] = !border,
             _b[commonStyles__default.default.shadow] = shadow,
             _b[styles.shadow] = shadow,
-            _b), className), style: tslib.__assign({}, (view === 'custom' && { background: background, borderColor: borderColor })), onClick: handleClick, onKeyDown: handleClick, role: 'alert', ref: mergeRefs__default.default([plateRef, ref]), 
+            _b[commonStyles__default.default.customBorder] = border && !rounded && isCustomView,
+            _b), className), style: tslib.__assign(tslib.__assign({}, setCustomViewColors()), setCustomViewRectangleBorderColor()), onClick: handleClick, onKeyDown: handleClick, role: 'alert', ref: mergeRefs__default.default([plateRef, ref]), 
         /* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */
         tabIndex: foldable ? 0 : -1, "data-test-id": dataTestId },
         React__default.default.createElement("div", { className: commonStyles__default.default.inner },

package/plate/cssm/components/base-plate/index.module.css

@@ -68,6 +68,8 @@
         height: 100%;
         top: var(--gap-0);
         left: var(--gap-0);
+    } .component.customBorder:before {
+        all: unset;
     } .foldable {
     cursor: pointer;
 } .component * {

package/plate/esm/Component.responsive.js

@@ -7,7 +7,7 @@ import './components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../icon-button/esm';
-import './warning-f71305f9.js';
+import './warning-555f5627.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/esm/components/base-plate/Component.js

@@ -3,13 +3,13 @@ import React, { forwardRef, useRef, useState, useCallback } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { IconButton } from '../../../../icon-button/esm';
-import { g as getDataTestId } from '../../warning-f71305f9.js';
+import { g as getDataTestId } from '../../warning-555f5627.js';
 import { useFocus } from '@alfalab/hooks';
 import { ChevronDownMIcon } from '@alfalab/icons-glyph/ChevronDownMIcon';
 import { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';
 import { ButtonList } from '../button-list/component.js';
 
-var commonStyles = {"component":"plate__component_1y4y7","foldable":"plate__foldable_1y4y7","focused":"plate__focused_1y4y7","inner":"plate__inner_1y4y7","rounded":"plate__rounded_1y4y7","noBorder":"plate__noBorder_1y4y7","shadow":"plate__shadow_1y4y7","common":"plate__common_1y4y7","negative":"plate__negative_1y4y7","positive":"plate__positive_1y4y7","attention":"plate__attention_1y4y7","custom":"plate__custom_1y4y7","rect":"plate__rect_1y4y7","isHidden":"plate__isHidden_1y4y7","leftAddons":"plate__leftAddons_1y4y7","rightAddons":"plate__rightAddons_1y4y7","subAddons":"plate__subAddons_1y4y7","rowReverse":"plate__rowReverse_1y4y7","bold":"plate__bold_1y4y7","light":"plate__light_1y4y7","content":"plate__content_1y4y7","isFolded":"plate__isFolded_1y4y7","contentContainer":"plate__contentContainer_1y4y7","withoutTitle":"plate__withoutTitle_1y4y7","limitWidth":"plate__limitWidth_1y4y7","description":"plate__description_1y4y7","closer":"plate__closer_1y4y7","folder":"plate__folder_1y4y7","containerButton":"plate__containerButton_1y4y7","button":"plate__button_1y4y7","rowLimit1":"plate__rowLimit1_1y4y7","rowLimit2":"plate__rowLimit2_1y4y7","rowLimit3":"plate__rowLimit3_1y4y7"};
+var commonStyles = {"component":"plate__component_1y4y7","customBorder":"plate__customBorder_1y4y7","foldable":"plate__foldable_1y4y7","focused":"plate__focused_1y4y7","inner":"plate__inner_1y4y7","rounded":"plate__rounded_1y4y7","noBorder":"plate__noBorder_1y4y7","shadow":"plate__shadow_1y4y7","common":"plate__common_1y4y7","negative":"plate__negative_1y4y7","positive":"plate__positive_1y4y7","attention":"plate__attention_1y4y7","custom":"plate__custom_1y4y7","rect":"plate__rect_1y4y7","isHidden":"plate__isHidden_1y4y7","leftAddons":"plate__leftAddons_1y4y7","rightAddons":"plate__rightAddons_1y4y7","subAddons":"plate__subAddons_1y4y7","rowReverse":"plate__rowReverse_1y4y7","bold":"plate__bold_1y4y7","light":"plate__light_1y4y7","content":"plate__content_1y4y7","isFolded":"plate__isFolded_1y4y7","contentContainer":"plate__contentContainer_1y4y7","withoutTitle":"plate__withoutTitle_1y4y7","limitWidth":"plate__limitWidth_1y4y7","description":"plate__description_1y4y7","closer":"plate__closer_1y4y7","folder":"plate__folder_1y4y7","containerButton":"plate__containerButton_1y4y7","button":"plate__button_1y4y7","rowLimit1":"plate__rowLimit1_1y4y7","rowLimit2":"plate__rowLimit2_1y4y7","rowLimit3":"plate__rowLimit3_1y4y7"};
 require('./index.css');
 
 /* eslint-disable complexity */
@@ -30,6 +30,7 @@ var BasePlate = forwardRef(function (_a, ref) {
     var hasSubAddons = !!subAddons && typeof subAddons !== 'boolean';
     var hasAnyAddons = leftAddons || subAddons || foldable || hasCloser;
     var rowLimitStyles = rowLimit && commonStyles["rowLimit".concat(rowLimit)];
+    var isCustomView = view === 'custom';
     var handleClick = useCallback(function (event) {
         var clickSimilarKeys = ['Enter', ' '].includes(event.key);
         if (event.type !== 'click' && !clickSimilarKeys) {
@@ -58,6 +59,23 @@ var BasePlate = forwardRef(function (_a, ref) {
             onClose(event);
         }
     }, [onClose]);
+    var setCustomViewColors = function () {
+        if (isCustomView) {
+            return {
+                background: background,
+                borderColor: borderColor,
+            };
+        }
+        return {};
+    };
+    var setCustomViewRectangleBorderColor = function () {
+        if (isCustomView && border && !rounded && borderColor) {
+            return {
+                boxShadow: "2px 0 0 0 ".concat(borderColor, " inset"),
+            };
+        }
+        return {};
+    };
     return (
     // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
     React.createElement("div", { className: cn(commonStyles.component, commonStyles[view], (_b = {},
@@ -71,7 +89,8 @@ var BasePlate = forwardRef(function (_a, ref) {
             _b[commonStyles.noBorder] = !border,
             _b[commonStyles.shadow] = shadow,
             _b[styles.shadow] = shadow,
-            _b), className), style: __assign({}, (view === 'custom' && { background: background, borderColor: borderColor })), onClick: handleClick, onKeyDown: handleClick, role: 'alert', ref: mergeRefs([plateRef, ref]), 
+            _b[commonStyles.customBorder] = border && !rounded && isCustomView,
+            _b), className), style: __assign(__assign({}, setCustomViewColors()), setCustomViewRectangleBorderColor()), onClick: handleClick, onKeyDown: handleClick, role: 'alert', ref: mergeRefs([plateRef, ref]), 
         /* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */
         tabIndex: foldable ? 0 : -1, "data-test-id": dataTestId },
         React.createElement("div", { className: commonStyles.inner },

package/plate/esm/components/base-plate/index.css

@@ -69,6 +69,8 @@
         height: 100%;
         top: var(--gap-0);
         left: var(--gap-0);
+    } .plate__component_1y4y7.plate__customBorder_1y4y7:before {
+        all: unset;
     } .plate__foldable_1y4y7 {
     cursor: pointer;
 } .plate__component_1y4y7 * {

package/plate/esm/components/base-plate/index.js

@@ -4,7 +4,7 @@ import 'react';
 import 'react-merge-refs';
 import 'classnames';
 import '../../../../icon-button/esm';
-import '../../warning-f71305f9.js';
+import '../../warning-555f5627.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/esm/desktop/Component.desktop.js

@@ -4,7 +4,7 @@ import { BasePlate } from '../components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../../icon-button/esm';
-import '../warning-f71305f9.js';
+import '../warning-555f5627.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/esm/desktop/index.js

@@ -5,7 +5,7 @@ import '../components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../../icon-button/esm';
-import '../warning-f71305f9.js';
+import '../warning-555f5627.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/esm/index-a8f55d3a.d.ts

@@ -77,7 +77,7 @@ declare const dom: {
 declare const exhaustiveCheck: (value: never) => never;
 export { isClient, os, createPaddingStyle, easingFns, maskUtils, isObject, hasOwnProperty, hooks, dom, exhaustiveCheck };
 export { useIsMounted } from "./useIsMounted-edf8408d";
-export * from "./warning-f71305f9";
-export { PortalContext } from "./warning-f71305f9";
+export * from "./warning-555f5627";
+export { PortalContext } from "./warning-555f5627";
 export * from "./fnUtils-edf8408d";
 export * from "./browser-a216f694";

package/plate/esm/index.js

@@ -7,7 +7,7 @@ import './components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../icon-button/esm';
-import './warning-f71305f9.js';
+import './warning-555f5627.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/esm/mobile/Component.mobile.js

@@ -4,7 +4,7 @@ import { BasePlate } from '../components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../../icon-button/esm';
-import '../warning-f71305f9.js';
+import '../warning-555f5627.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/esm/mobile/index.js

@@ -5,7 +5,7 @@ import '../components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../../icon-button/esm';
-import '../warning-f71305f9.js';
+import '../warning-555f5627.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/esm/shared/index.js

@@ -1,4 +1,4 @@
 export { getPlateTestIds } from '../utils.js';
-import '../warning-f71305f9.js';
+import '../warning-555f5627.js';
 import 'react';
 import '@alfalab/hooks';

package/plate/esm/utils.js

@@ -1,4 +1,4 @@
-import { g as getDataTestId } from './warning-f71305f9.js';
+import { g as getDataTestId } from './warning-555f5627.js';
 import 'react';
 import '@alfalab/hooks';
 

package/plate/index-a8f55d3a.d.ts

@@ -77,7 +77,7 @@ declare const dom: {
 declare const exhaustiveCheck: (value: never) => never;
 export { isClient, os, createPaddingStyle, easingFns, maskUtils, isObject, hasOwnProperty, hooks, dom, exhaustiveCheck };
 export { useIsMounted } from "./useIsMounted-edf8408d";
-export * from "./warning-5c40c8ff";
-export { PortalContext } from "./warning-5c40c8ff";
+export * from "./warning-6210dd39";
+export { PortalContext } from "./warning-6210dd39";
 export * from "./fnUtils-edf8408d";
 export * from "./browser-a216f694";

package/plate/modern/Component.responsive.js

@@ -6,7 +6,7 @@ import './components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../icon-button/modern';
-import './warning-529d7e2e.js';
+import './warning-edbf6a14.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/modern/components/base-plate/Component.js

@@ -2,13 +2,13 @@ import React, { forwardRef, useRef, useState, useCallback } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { IconButton } from '../../../../icon-button/modern';
-import { g as getDataTestId } from '../../warning-529d7e2e.js';
+import { g as getDataTestId } from '../../warning-edbf6a14.js';
 import { useFocus } from '@alfalab/hooks';
 import { ChevronDownMIcon } from '@alfalab/icons-glyph/ChevronDownMIcon';
 import { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';
 import { ButtonList } from '../button-list/component.js';
 
-const commonStyles = {"component":"plate__component_1y4y7","foldable":"plate__foldable_1y4y7","focused":"plate__focused_1y4y7","inner":"plate__inner_1y4y7","rounded":"plate__rounded_1y4y7","noBorder":"plate__noBorder_1y4y7","shadow":"plate__shadow_1y4y7","common":"plate__common_1y4y7","negative":"plate__negative_1y4y7","positive":"plate__positive_1y4y7","attention":"plate__attention_1y4y7","custom":"plate__custom_1y4y7","rect":"plate__rect_1y4y7","isHidden":"plate__isHidden_1y4y7","leftAddons":"plate__leftAddons_1y4y7","rightAddons":"plate__rightAddons_1y4y7","subAddons":"plate__subAddons_1y4y7","rowReverse":"plate__rowReverse_1y4y7","bold":"plate__bold_1y4y7","light":"plate__light_1y4y7","content":"plate__content_1y4y7","isFolded":"plate__isFolded_1y4y7","contentContainer":"plate__contentContainer_1y4y7","withoutTitle":"plate__withoutTitle_1y4y7","limitWidth":"plate__limitWidth_1y4y7","description":"plate__description_1y4y7","closer":"plate__closer_1y4y7","folder":"plate__folder_1y4y7","containerButton":"plate__containerButton_1y4y7","button":"plate__button_1y4y7","rowLimit1":"plate__rowLimit1_1y4y7","rowLimit2":"plate__rowLimit2_1y4y7","rowLimit3":"plate__rowLimit3_1y4y7"};
+const commonStyles = {"component":"plate__component_1y4y7","customBorder":"plate__customBorder_1y4y7","foldable":"plate__foldable_1y4y7","focused":"plate__focused_1y4y7","inner":"plate__inner_1y4y7","rounded":"plate__rounded_1y4y7","noBorder":"plate__noBorder_1y4y7","shadow":"plate__shadow_1y4y7","common":"plate__common_1y4y7","negative":"plate__negative_1y4y7","positive":"plate__positive_1y4y7","attention":"plate__attention_1y4y7","custom":"plate__custom_1y4y7","rect":"plate__rect_1y4y7","isHidden":"plate__isHidden_1y4y7","leftAddons":"plate__leftAddons_1y4y7","rightAddons":"plate__rightAddons_1y4y7","subAddons":"plate__subAddons_1y4y7","rowReverse":"plate__rowReverse_1y4y7","bold":"plate__bold_1y4y7","light":"plate__light_1y4y7","content":"plate__content_1y4y7","isFolded":"plate__isFolded_1y4y7","contentContainer":"plate__contentContainer_1y4y7","withoutTitle":"plate__withoutTitle_1y4y7","limitWidth":"plate__limitWidth_1y4y7","description":"plate__description_1y4y7","closer":"plate__closer_1y4y7","folder":"plate__folder_1y4y7","containerButton":"plate__containerButton_1y4y7","button":"plate__button_1y4y7","rowLimit1":"plate__rowLimit1_1y4y7","rowLimit2":"plate__rowLimit2_1y4y7","rowLimit3":"plate__rowLimit3_1y4y7"};
 require('./index.css');
 
 /* eslint-disable complexity */
@@ -27,6 +27,7 @@ const BasePlate = forwardRef(({ hasCloser, foldable: foldableProp = false, folde
     const hasSubAddons = !!subAddons && typeof subAddons !== 'boolean';
     const hasAnyAddons = leftAddons || subAddons || foldable || hasCloser;
     const rowLimitStyles = rowLimit && commonStyles[`rowLimit${rowLimit}`];
+    const isCustomView = view === 'custom';
     const handleClick = useCallback((event) => {
         const clickSimilarKeys = ['Enter', ' '].includes(event.key);
         if (event.type !== 'click' && !clickSimilarKeys) {
@@ -55,6 +56,23 @@ const BasePlate = forwardRef(({ hasCloser, foldable: foldableProp = false, folde
             onClose(event);
         }
     }, [onClose]);
+    const setCustomViewColors = () => {
+        if (isCustomView) {
+            return {
+                background,
+                borderColor,
+            };
+        }
+        return {};
+    };
+    const setCustomViewRectangleBorderColor = () => {
+        if (isCustomView && border && !rounded && borderColor) {
+            return {
+                boxShadow: `2px 0 0 0 ${borderColor} inset`,
+            };
+        }
+        return {};
+    };
     return (
     // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
     React.createElement("div", { className: cn(commonStyles.component, commonStyles[view], {
@@ -68,8 +86,10 @@ const BasePlate = forwardRef(({ hasCloser, foldable: foldableProp = false, folde
             [commonStyles.noBorder]: !border,
             [commonStyles.shadow]: shadow,
             [styles.shadow]: shadow,
+            [commonStyles.customBorder]: border && !rounded && isCustomView,
         }, className), style: {
-            ...(view === 'custom' && { background, borderColor }),
+            ...setCustomViewColors(),
+            ...setCustomViewRectangleBorderColor(),
         }, onClick: handleClick, onKeyDown: handleClick, role: 'alert', ref: mergeRefs([plateRef, ref]), 
         /* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */
         tabIndex: foldable ? 0 : -1, "data-test-id": dataTestId },

package/plate/modern/components/base-plate/index.css

@@ -69,6 +69,8 @@
         height: 100%;
         top: var(--gap-0);
         left: var(--gap-0);
+    } .plate__component_1y4y7.plate__customBorder_1y4y7:before {
+        all: unset;
     } .plate__foldable_1y4y7 {
     cursor: pointer;
 } .plate__component_1y4y7 * {

package/plate/modern/components/base-plate/index.js

@@ -3,7 +3,7 @@ import 'react';
 import 'react-merge-refs';
 import 'classnames';
 import '../../../../icon-button/modern';
-import '../../warning-529d7e2e.js';
+import '../../warning-edbf6a14.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/modern/desktop/Component.desktop.js

@@ -3,7 +3,7 @@ import { BasePlate } from '../components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../../icon-button/modern';
-import '../warning-529d7e2e.js';
+import '../warning-edbf6a14.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/modern/desktop/index.js

@@ -4,7 +4,7 @@ import '../components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../../icon-button/modern';
-import '../warning-529d7e2e.js';
+import '../warning-edbf6a14.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/modern/index-a8f55d3a.d.ts

@@ -77,7 +77,7 @@ declare const dom: {
 declare const exhaustiveCheck: (value: never) => never;
 export { isClient, os, createPaddingStyle, easingFns, maskUtils, isObject, hasOwnProperty, hooks, dom, exhaustiveCheck };
 export { useIsMounted } from "./useIsMounted-edf8408d";
-export * from "./warning-529d7e2e";
-export { PortalContext } from "./warning-529d7e2e";
+export * from "./warning-edbf6a14";
+export { PortalContext } from "./warning-edbf6a14";
 export * from "./fnUtils-edf8408d";
 export * from "./browser-a216f694";

package/plate/modern/index.js

@@ -6,7 +6,7 @@ import './components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../icon-button/modern';
-import './warning-529d7e2e.js';
+import './warning-edbf6a14.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/modern/mobile/Component.mobile.js

@@ -3,7 +3,7 @@ import { BasePlate } from '../components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../../icon-button/modern';
-import '../warning-529d7e2e.js';
+import '../warning-edbf6a14.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/modern/mobile/index.js

@@ -4,7 +4,7 @@ import '../components/base-plate/Component.js';
 import 'react-merge-refs';
 import 'classnames';
 import '../../../icon-button/modern';
-import '../warning-529d7e2e.js';
+import '../warning-edbf6a14.js';
 import '@alfalab/hooks';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';

package/plate/modern/shared/index.js

@@ -1,4 +1,4 @@
 export { getPlateTestIds } from '../utils.js';
-import '../warning-529d7e2e.js';
+import '../warning-edbf6a14.js';
 import 'react';
 import '@alfalab/hooks';

package/plate/modern/utils.js

@@ -1,4 +1,4 @@
-import { g as getDataTestId } from './warning-529d7e2e.js';
+import { g as getDataTestId } from './warning-edbf6a14.js';
 import 'react';
 import '@alfalab/hooks';
 

package/plate/moderncssm/components/base-plate/Component.js

@@ -25,6 +25,7 @@ const BasePlate = forwardRef(({ hasCloser, foldable: foldableProp = false, folde
     const hasSubAddons = !!subAddons && typeof subAddons !== 'boolean';
     const hasAnyAddons = leftAddons || subAddons || foldable || hasCloser;
     const rowLimitStyles = rowLimit && commonStyles[`rowLimit${rowLimit}`];
+    const isCustomView = view === 'custom';
     const handleClick = useCallback((event) => {
         const clickSimilarKeys = ['Enter', ' '].includes(event.key);
         if (event.type !== 'click' && !clickSimilarKeys) {
@@ -53,6 +54,23 @@ const BasePlate = forwardRef(({ hasCloser, foldable: foldableProp = false, folde
             onClose(event);
         }
     }, [onClose]);
+    const setCustomViewColors = () => {
+        if (isCustomView) {
+            return {
+                background,
+                borderColor,
+            };
+        }
+        return {};
+    };
+    const setCustomViewRectangleBorderColor = () => {
+        if (isCustomView && border && !rounded && borderColor) {
+            return {
+                boxShadow: `2px 0 0 0 ${borderColor} inset`,
+            };
+        }
+        return {};
+    };
     return (
     // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
     React.createElement("div", { className: cn(commonStyles.component, commonStyles[view], {
@@ -66,8 +84,10 @@ const BasePlate = forwardRef(({ hasCloser, foldable: foldableProp = false, folde
             [commonStyles.noBorder]: !border,
             [commonStyles.shadow]: shadow,
             [styles.shadow]: shadow,
+            [commonStyles.customBorder]: border && !rounded && isCustomView,
         }, className), style: {
-            ...(view === 'custom' && { background, borderColor }),
+            ...setCustomViewColors(),
+            ...setCustomViewRectangleBorderColor(),
         }, onClick: handleClick, onKeyDown: handleClick, role: 'alert', ref: mergeRefs([plateRef, ref]), 
         /* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */
         tabIndex: foldable ? 0 : -1, "data-test-id": dataTestId },

package/plate/moderncssm/components/base-plate/index.module.css

@@ -30,6 +30,9 @@
         top: var(--gap-0);
         left: var(--gap-0);
     }
+.component.customBorder:before {
+        all: unset;
+    }
 .foldable {
     cursor: pointer;
 }