@alfalab/core-components 36.1.2 → 36.3.0

package/plate/esm/index.css

@@ -1,4 +1,4 @@
-/* hash: 1hmc5 */
+/* hash: 1ijxj */
 :root {
     --color-static-status-green: #13a463;
     --color-static-status-grey: #6d7986;
@@ -51,7 +51,7 @@
     --plate-border-color: var(--color-static-status-grey);
     --plate-box-shadow: var(--shadow-s);
 }
-.plate__component_mi13p {
+.plate__component_b8ykj {
     position: relative;
     display: inline-flex;
     box-sizing: border-box;
@@ -61,7 +61,7 @@
     padding: var(--gap-s);
     outline: none
 }
-.plate__component_mi13p:before {
+.plate__component_b8ykj:before {
         content: '';
         width: var(--plate-border-left);
         position: absolute;
@@ -69,106 +69,119 @@
         top: 0;
         left: 0;
     }
-.plate__foldable_mi13p {
+.plate__foldable_b8ykj {
     cursor: pointer;
 }
-.plate__component_mi13p * {
+.plate__component_b8ykj * {
     box-sizing: border-box;
 }
-.plate__focused_mi13p {
+.plate__focused_b8ykj {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }
-.plate__inner_mi13p {
+.plate__inner_b8ykj {
     position: relative;
     width: 100%;
     display: flex;
     justify-content: space-between;
 }
-.plate__rounded_mi13p:before, .plate__noBorder_mi13p:before {
+.plate__rounded_b8ykj:before, .plate__noBorder_b8ykj:before {
         display: none;
     }
-.plate__rounded_mi13p {
-    border-radius: var(--plate-border-radius);
-}
-.plate__shadow_mi13p {
+.plate__shadow_b8ykj:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    width: 100%;
+    height: 100%;
+    display: block;
     box-shadow: var(--plate-box-shadow);
+    pointer-events: none;
 }
-.plate__common_mi13p {
+.plate__rounded_b8ykj {
+    border-radius: var(--plate-border-radius)
+}
+.plate__rounded_b8ykj.plate__shadow_b8ykj:after {
+        border-radius: var(--plate-border-radius);
+    }
+.plate__common_b8ykj {
     background-color: var(--color-light-specialbg-secondary-transparent);
     box-shadow: var(--plate-border) var(--color-static-status-grey)
 }
-.plate__common_mi13p:before {
+.plate__common_b8ykj:before {
         background-color: var(--color-static-status-grey);
     }
-.plate__negative_mi13p {
+.plate__negative_b8ykj {
     background-color: var(--color-light-bg-negative-muted);
     box-shadow: var(--plate-border) var(--color-static-status-red)
 }
-.plate__negative_mi13p:before {
+.plate__negative_b8ykj:before {
         background-color: var(--color-static-status-red);
     }
-.plate__positive_mi13p {
+.plate__positive_b8ykj {
     background-color: var(--color-light-bg-positive-muted);
     box-shadow: var(--plate-border) var(--color-static-status-green)
 }
-.plate__positive_mi13p:before {
+.plate__positive_b8ykj:before {
         background-color: var(--color-static-status-green);
     }
-.plate__attention_mi13p {
+.plate__attention_b8ykj {
     background-color: var(--color-light-bg-attention-muted);
     box-shadow: var(--plate-border) var(--color-static-status-orange)
 }
-.plate__attention_mi13p:before {
+.plate__attention_b8ykj:before {
         background-color: var(--color-static-status-orange);
     }
-.plate__custom_mi13p {
+.plate__custom_b8ykj {
     background: var(--plate-background);
     box-shadow: var(--plate-border) var(--plate-border-color)
 }
-.plate__custom_mi13p:before {
+.plate__custom_b8ykj:before {
         background-color: var(--plate-border-color);
     }
-.plate__rect_mi13p,
-.plate__noBorder_mi13p {
+.plate__rect_b8ykj,
+.plate__noBorder_b8ykj {
     box-shadow: none;
 }
-.plate__isHidden_mi13p {
+.plate__isHidden_b8ykj {
     display: none;
 }
-.plate__leftAddons_mi13p,
-.plate__rightAddons_mi13p {
+.plate__leftAddons_b8ykj,
+.plate__rightAddons_b8ykj {
     padding: var(--gap-2xs);
 }
-.plate__leftAddons_mi13p {
+.plate__leftAddons_b8ykj {
     flex-shrink: 0;
     min-width: 24px;
     margin-right: var(--gap-2xs);
 }
-.plate__subAddons_mi13p {
+.plate__subAddons_b8ykj {
     cursor: default;
     align-self: flex-start;
 }
-.plate__bold_mi13p,
-.plate__light_mi13p {
+.plate__bold_b8ykj,
+.plate__light_b8ykj {
     word-break: break-word;
 }
-.plate__bold_mi13p {
+.plate__bold_b8ykj {
     font-size: 18px;
     line-height: 22px;
     font-weight: 700;
     padding: 5px var(--gap-s) 5px var(--gap-2xs);
 }
-.plate__light_mi13p {
+.plate__light_b8ykj {
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
     padding: 6px var(--gap-s) 6px var(--gap-2xs);
 }
-.plate__foldable_mi13p .plate__content_mi13p {
+.plate__foldable_b8ykj .plate__content_b8ykj {
     max-height: 300vh;
 }
-.plate__content_mi13p {
+.plate__content_b8ykj {
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
@@ -177,31 +190,31 @@
     transition: max-height 2s ease-in-out;
     cursor: default
 }
-.plate__content_mi13p.plate__isFolded_mi13p.plate__isFolded_mi13p {
+.plate__content_b8ykj.plate__isFolded_b8ykj.plate__isFolded_b8ykj {
         max-height: 0;
         transition: max-height 1s cubic-bezier(0, 1, 0, 1);
     }
-.plate__contentContainer_mi13p {
+.plate__contentContainer_b8ykj {
     flex: 1;
     margin-right: auto
 }
-.plate__contentContainer_mi13p.plate__withoutTitle_mi13p {
+.plate__contentContainer_b8ykj.plate__withoutTitle_b8ykj {
         padding-top: var(--gap-3xs);
     }
-.plate__limitWidth_mi13p {
+.plate__limitWidth_b8ykj {
     max-width: var(--plate-width-limit);
 }
-.plate__description_mi13p {
+.plate__description_b8ykj {
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
     padding: var(--gap-2xs) var(--gap-s) var(--gap-2xs) var(--gap-2xs);
 }
-.plate__footer_mi13p {
+.plate__footer_b8ykj {
     padding: var(--gap-l) 0 var(--gap-2xs) var(--gap-2xs);
 }
-.plate__closer_mi13p,
-.plate__folder_mi13p {
+.plate__closer_b8ykj,
+.plate__folder_b8ykj {
     display: block;
     height: 24px;
     width: 24px;
@@ -210,37 +223,37 @@
     cursor: pointer;
     margin-left: var(--gap-s)
 }
-.plate__closer_mi13p:hover, .plate__folder_mi13p:hover {
+.plate__closer_b8ykj:hover, .plate__folder_b8ykj:hover {
         opacity: 0.7;
     }
-.plate__closer_mi13p:active, .plate__folder_mi13p:active {
+.plate__closer_b8ykj:active, .plate__folder_b8ykj:active {
         opacity: 0.5;
     }
-.plate__folder_mi13p {
+.plate__folder_b8ykj {
     transition: transform 0.15s ease-in-out, opacity 0.2s ease;
     transform: var(--arrow-transform)
 }
-.plate__folder_mi13p.plate__isFolded_mi13p {
+.plate__folder_b8ykj.plate__isFolded_b8ykj {
         transform: rotate(0deg);
     }
-.plate__button_mi13p:not(:last-child) {
+.plate__button_b8ykj:not(:last-child) {
         margin-right: var(--gap-xs);
     }
-.plate__rowLimit1_mi13p {
+.plate__rowLimit1_b8ykj {
     -webkit-line-clamp: 1;
     display: -webkit-box;
     -webkit-box-orient: vertical;
     overflow: hidden;
     word-break: break-all;
 }
-.plate__rowLimit2_mi13p {
+.plate__rowLimit2_b8ykj {
     -webkit-line-clamp: 2;
     display: -webkit-box;
     -webkit-box-orient: vertical;
     overflow: hidden;
     word-break: break-all;
 }
-.plate__rowLimit3_mi13p {
+.plate__rowLimit3_b8ykj {
     -webkit-line-clamp: 3;
     display: -webkit-box;
     -webkit-box-orient: vertical;

package/plate/index.css

@@ -1,4 +1,4 @@
-/* hash: 1hmc5 */
+/* hash: 1ijxj */
 :root {
     --color-static-status-green: #13a463;
     --color-static-status-grey: #6d7986;
@@ -51,7 +51,7 @@
     --plate-border-color: var(--color-static-status-grey);
     --plate-box-shadow: var(--shadow-s);
 }
-.plate__component_mi13p {
+.plate__component_b8ykj {
     position: relative;
     display: inline-flex;
     box-sizing: border-box;
@@ -61,7 +61,7 @@
     padding: var(--gap-s);
     outline: none
 }
-.plate__component_mi13p:before {
+.plate__component_b8ykj:before {
         content: '';
         width: var(--plate-border-left);
         position: absolute;
@@ -69,106 +69,119 @@
         top: 0;
         left: 0;
     }
-.plate__foldable_mi13p {
+.plate__foldable_b8ykj {
     cursor: pointer;
 }
-.plate__component_mi13p * {
+.plate__component_b8ykj * {
     box-sizing: border-box;
 }
-.plate__focused_mi13p {
+.plate__focused_b8ykj {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }
-.plate__inner_mi13p {
+.plate__inner_b8ykj {
     position: relative;
     width: 100%;
     display: flex;
     justify-content: space-between;
 }
-.plate__rounded_mi13p:before, .plate__noBorder_mi13p:before {
+.plate__rounded_b8ykj:before, .plate__noBorder_b8ykj:before {
         display: none;
     }
-.plate__rounded_mi13p {
-    border-radius: var(--plate-border-radius);
-}
-.plate__shadow_mi13p {
+.plate__shadow_b8ykj:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    width: 100%;
+    height: 100%;
+    display: block;
     box-shadow: var(--plate-box-shadow);
+    pointer-events: none;
 }
-.plate__common_mi13p {
+.plate__rounded_b8ykj {
+    border-radius: var(--plate-border-radius)
+}
+.plate__rounded_b8ykj.plate__shadow_b8ykj:after {
+        border-radius: var(--plate-border-radius);
+    }
+.plate__common_b8ykj {
     background-color: var(--color-light-specialbg-secondary-transparent);
     box-shadow: var(--plate-border) var(--color-static-status-grey)
 }
-.plate__common_mi13p:before {
+.plate__common_b8ykj:before {
         background-color: var(--color-static-status-grey);
     }
-.plate__negative_mi13p {
+.plate__negative_b8ykj {
     background-color: var(--color-light-bg-negative-muted);
     box-shadow: var(--plate-border) var(--color-static-status-red)
 }
-.plate__negative_mi13p:before {
+.plate__negative_b8ykj:before {
         background-color: var(--color-static-status-red);
     }
-.plate__positive_mi13p {
+.plate__positive_b8ykj {
     background-color: var(--color-light-bg-positive-muted);
     box-shadow: var(--plate-border) var(--color-static-status-green)
 }
-.plate__positive_mi13p:before {
+.plate__positive_b8ykj:before {
         background-color: var(--color-static-status-green);
     }
-.plate__attention_mi13p {
+.plate__attention_b8ykj {
     background-color: var(--color-light-bg-attention-muted);
     box-shadow: var(--plate-border) var(--color-static-status-orange)
 }
-.plate__attention_mi13p:before {
+.plate__attention_b8ykj:before {
         background-color: var(--color-static-status-orange);
     }
-.plate__custom_mi13p {
+.plate__custom_b8ykj {
     background: var(--plate-background);
     box-shadow: var(--plate-border) var(--plate-border-color)
 }
-.plate__custom_mi13p:before {
+.plate__custom_b8ykj:before {
         background-color: var(--plate-border-color);
     }
-.plate__rect_mi13p,
-.plate__noBorder_mi13p {
+.plate__rect_b8ykj,
+.plate__noBorder_b8ykj {
     box-shadow: none;
 }
-.plate__isHidden_mi13p {
+.plate__isHidden_b8ykj {
     display: none;
 }
-.plate__leftAddons_mi13p,
-.plate__rightAddons_mi13p {
+.plate__leftAddons_b8ykj,
+.plate__rightAddons_b8ykj {
     padding: var(--gap-2xs);
 }
-.plate__leftAddons_mi13p {
+.plate__leftAddons_b8ykj {
     flex-shrink: 0;
     min-width: 24px;
     margin-right: var(--gap-2xs);
 }
-.plate__subAddons_mi13p {
+.plate__subAddons_b8ykj {
     cursor: default;
     align-self: flex-start;
 }
-.plate__bold_mi13p,
-.plate__light_mi13p {
+.plate__bold_b8ykj,
+.plate__light_b8ykj {
     word-break: break-word;
 }
-.plate__bold_mi13p {
+.plate__bold_b8ykj {
     font-size: 18px;
     line-height: 22px;
     font-weight: 700;
     padding: 5px var(--gap-s) 5px var(--gap-2xs);
 }
-.plate__light_mi13p {
+.plate__light_b8ykj {
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
     padding: 6px var(--gap-s) 6px var(--gap-2xs);
 }
-.plate__foldable_mi13p .plate__content_mi13p {
+.plate__foldable_b8ykj .plate__content_b8ykj {
     max-height: 300vh;
 }
-.plate__content_mi13p {
+.plate__content_b8ykj {
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
@@ -177,31 +190,31 @@
     transition: max-height 2s ease-in-out;
     cursor: default
 }
-.plate__content_mi13p.plate__isFolded_mi13p.plate__isFolded_mi13p {
+.plate__content_b8ykj.plate__isFolded_b8ykj.plate__isFolded_b8ykj {
         max-height: 0;
         transition: max-height 1s cubic-bezier(0, 1, 0, 1);
     }
-.plate__contentContainer_mi13p {
+.plate__contentContainer_b8ykj {
     flex: 1;
     margin-right: auto
 }
-.plate__contentContainer_mi13p.plate__withoutTitle_mi13p {
+.plate__contentContainer_b8ykj.plate__withoutTitle_b8ykj {
         padding-top: var(--gap-3xs);
     }
-.plate__limitWidth_mi13p {
+.plate__limitWidth_b8ykj {
     max-width: var(--plate-width-limit);
 }
-.plate__description_mi13p {
+.plate__description_b8ykj {
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
     padding: var(--gap-2xs) var(--gap-s) var(--gap-2xs) var(--gap-2xs);
 }
-.plate__footer_mi13p {
+.plate__footer_b8ykj {
     padding: var(--gap-l) 0 var(--gap-2xs) var(--gap-2xs);
 }
-.plate__closer_mi13p,
-.plate__folder_mi13p {
+.plate__closer_b8ykj,
+.plate__folder_b8ykj {
     display: block;
     height: 24px;
     width: 24px;
@@ -210,37 +223,37 @@
     cursor: pointer;
     margin-left: var(--gap-s)
 }
-.plate__closer_mi13p:hover, .plate__folder_mi13p:hover {
+.plate__closer_b8ykj:hover, .plate__folder_b8ykj:hover {
         opacity: 0.7;
     }
-.plate__closer_mi13p:active, .plate__folder_mi13p:active {
+.plate__closer_b8ykj:active, .plate__folder_b8ykj:active {
         opacity: 0.5;
     }
-.plate__folder_mi13p {
+.plate__folder_b8ykj {
     transition: transform 0.15s ease-in-out, opacity 0.2s ease;
     transform: var(--arrow-transform)
 }
-.plate__folder_mi13p.plate__isFolded_mi13p {
+.plate__folder_b8ykj.plate__isFolded_b8ykj {
         transform: rotate(0deg);
     }
-.plate__button_mi13p:not(:last-child) {
+.plate__button_b8ykj:not(:last-child) {
         margin-right: var(--gap-xs);
     }
-.plate__rowLimit1_mi13p {
+.plate__rowLimit1_b8ykj {
     -webkit-line-clamp: 1;
     display: -webkit-box;
     -webkit-box-orient: vertical;
     overflow: hidden;
     word-break: break-all;
 }
-.plate__rowLimit2_mi13p {
+.plate__rowLimit2_b8ykj {
     -webkit-line-clamp: 2;
     display: -webkit-box;
     -webkit-box-orient: vertical;
     overflow: hidden;
     word-break: break-all;
 }
-.plate__rowLimit3_mi13p {
+.plate__rowLimit3_b8ykj {
     -webkit-line-clamp: 3;
     display: -webkit-box;
     -webkit-box-orient: vertical;

package/plate/modern/Component.js

@@ -7,7 +7,7 @@ import { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';
 import { IconButton } from '../../icon-button/modern';
 import { ButtonList } from './components/button-list/component.js';
 
-var styles = {"component":"plate__component_mi13p","foldable":"plate__foldable_mi13p","focused":"plate__focused_mi13p","inner":"plate__inner_mi13p","rounded":"plate__rounded_mi13p","noBorder":"plate__noBorder_mi13p","shadow":"plate__shadow_mi13p","common":"plate__common_mi13p","negative":"plate__negative_mi13p","positive":"plate__positive_mi13p","attention":"plate__attention_mi13p","custom":"plate__custom_mi13p","rect":"plate__rect_mi13p","isHidden":"plate__isHidden_mi13p","leftAddons":"plate__leftAddons_mi13p","rightAddons":"plate__rightAddons_mi13p","subAddons":"plate__subAddons_mi13p","bold":"plate__bold_mi13p","light":"plate__light_mi13p","content":"plate__content_mi13p","isFolded":"plate__isFolded_mi13p","contentContainer":"plate__contentContainer_mi13p","withoutTitle":"plate__withoutTitle_mi13p","limitWidth":"plate__limitWidth_mi13p","description":"plate__description_mi13p","footer":"plate__footer_mi13p","closer":"plate__closer_mi13p","folder":"plate__folder_mi13p","button":"plate__button_mi13p","rowLimit1":"plate__rowLimit1_mi13p","rowLimit2":"plate__rowLimit2_mi13p","rowLimit3":"plate__rowLimit3_mi13p"};
+var styles = {"component":"plate__component_b8ykj","foldable":"plate__foldable_b8ykj","focused":"plate__focused_b8ykj","inner":"plate__inner_b8ykj","rounded":"plate__rounded_b8ykj","noBorder":"plate__noBorder_b8ykj","shadow":"plate__shadow_b8ykj","common":"plate__common_b8ykj","negative":"plate__negative_b8ykj","positive":"plate__positive_b8ykj","attention":"plate__attention_b8ykj","custom":"plate__custom_b8ykj","rect":"plate__rect_b8ykj","isHidden":"plate__isHidden_b8ykj","leftAddons":"plate__leftAddons_b8ykj","rightAddons":"plate__rightAddons_b8ykj","subAddons":"plate__subAddons_b8ykj","bold":"plate__bold_b8ykj","light":"plate__light_b8ykj","content":"plate__content_b8ykj","isFolded":"plate__isFolded_b8ykj","contentContainer":"plate__contentContainer_b8ykj","withoutTitle":"plate__withoutTitle_b8ykj","limitWidth":"plate__limitWidth_b8ykj","description":"plate__description_b8ykj","footer":"plate__footer_b8ykj","closer":"plate__closer_b8ykj","folder":"plate__folder_b8ykj","button":"plate__button_b8ykj","rowLimit1":"plate__rowLimit1_b8ykj","rowLimit2":"plate__rowLimit2_b8ykj","rowLimit3":"plate__rowLimit3_b8ykj"};
 require('./index.css');
 
 /* eslint-disable complexity */
@@ -54,43 +54,42 @@ const Plate = forwardRef(({ hasCloser, foldable: foldableProp = false, folded: f
             onClose(event);
         }
     }, [onClose]);
-    return (React.createElement("div", { className: cn({
-            [styles.shadow]: shadow,
+    return (
+    // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
+    React.createElement("div", { className: cn(styles.component, styles[view], {
+            [styles.foldable]: foldable,
+            [styles.focused]: focused,
+            [styles.isHidden]: hasCloser && isHidden,
+            [styles.isFolded]: foldable && folded,
             [styles.rounded]: rounded,
-        }) },
-        React.createElement("div", { className: cn(styles.component, styles[view], {
-                [styles.foldable]: foldable,
-                [styles.focused]: focused,
-                [styles.isHidden]: hasCloser && isHidden,
-                [styles.isFolded]: foldable && folded,
-                [styles.rounded]: rounded,
-                [styles.rect]: !rounded,
-                [styles.noBorder]: !border,
-            }, className), 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: styles.inner },
-                leftAddons && React.createElement("div", { className: styles.leftAddons }, leftAddons),
-                React.createElement("div", { className: cn(styles.contentContainer, contentClassName, {
-                        [styles.withoutTitle]: !title && hasAnyAddons,
-                        [styles.limitWidth]: limitContentWidth,
+            [styles.rect]: !rounded,
+            [styles.noBorder]: !border,
+            [styles.shadow]: shadow,
+        }, className), 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: styles.inner },
+            leftAddons && React.createElement("div", { className: styles.leftAddons }, leftAddons),
+            React.createElement("div", { className: cn(styles.contentContainer, contentClassName, {
+                    [styles.withoutTitle]: !title && hasAnyAddons,
+                    [styles.limitWidth]: limitContentWidth,
+                }) },
+                title && React.createElement("div", { className: styles[titleView] }, title),
+                hasContent && (React.createElement("div", { ref: contentRef, className: cn(styles.content, {
+                        [styles.isFolded]: foldable && folded,
+                    }) },
+                    children && (React.createElement("div", { className: cn(styles.description, rowLimitStyles) }, children)),
+                    hasButtons && (React.createElement("div", { className: styles.footer },
+                        React.createElement(ButtonList, { buttons: buttons, containerClassName: buttonsClassName, buttonClassName: cn(styles.button, buttonsClassName) })))))),
+            hasSubAddons && (React.createElement("div", { ref: subAddonsRef, className: styles.subAddons },
+                React.createElement(ButtonList, { buttons: subAddons, containerClassName: subAddonsClassName, buttonClassName: styles.button }))),
+            foldable && (React.createElement("div", { className: styles.rightAddons },
+                React.createElement("div", { className: cn(styles.folder, {
+                        [styles.isFolded]: folded,
                     }) },
-                    title && React.createElement("div", { className: styles[titleView] }, title),
-                    hasContent && (React.createElement("div", { ref: contentRef, className: cn(styles.content, {
-                            [styles.isFolded]: foldable && folded,
-                        }) },
-                        children && (React.createElement("div", { className: cn(styles.description, rowLimitStyles) }, children)),
-                        hasButtons && (React.createElement("div", { className: styles.footer },
-                            React.createElement(ButtonList, { buttons: buttons, containerClassName: buttonsClassName, buttonClassName: cn(styles.button, buttonsClassName) })))))),
-                hasSubAddons && (React.createElement("div", { ref: subAddonsRef, className: styles.subAddons },
-                    React.createElement(ButtonList, { buttons: subAddons, containerClassName: subAddonsClassName, buttonClassName: styles.button }))),
-                foldable && (React.createElement("div", { className: styles.rightAddons },
-                    React.createElement("div", { className: cn(styles.folder, {
-                            [styles.isFolded]: folded,
-                        }) },
-                        React.createElement(ChevronDownMIcon, null)))),
-                hasCloser && !foldable && (React.createElement("div", { className: styles.rightAddons },
-                    React.createElement(IconButton, { className: styles.closer, "aria-label": '\u0437\u0430\u043A\u0440\u044B\u0442\u044C', icon: CrossMIcon, size: 'xxs', onClick: handleClose })))))));
+                    React.createElement(ChevronDownMIcon, null)))),
+            hasCloser && !foldable && (React.createElement("div", { className: styles.rightAddons },
+                React.createElement(IconButton, { className: styles.closer, "aria-label": '\u0437\u0430\u043A\u0440\u044B\u0442\u044C', icon: CrossMIcon, size: 'xxs', onClick: handleClose }))))));
 });
 /* eslint-enable complexity */
 /**