@hh.ru/magritte-ui-modal 11.1.3 → 11.2.0

package/index.css

@@ -15,7 +15,7 @@
   --magritte-color-stroke-neutral-v26-0-2:#303030;
   --magritte-color-component-modal-background-content-v26-0-2:#111;
 }
-.magritte-sticky-header___TPafy_11-1-3{
+.magritte-sticky-header___TPafy_11-2-0{
   position:sticky;
   top:0;
   z-index:10;
@@ -27,14 +27,14 @@
   --magritte-ui-nav-bar-stage-horizontal-padding-override:24px;
 }
 @supports selector(:has(*)){
-  .magritte-sticky-header___TPafy_11-1-3{
+  .magritte-sticky-header___TPafy_11-2-0{
     --magritte-ui-nav-bar-stage-horizontal-padding-override:24px;
   }
-  .magritte-sticky-header-inner___u5p8h_11-1-3{
+  .magritte-sticky-header-inner___u5p8h_11-2-0{
     margin:0 calc(-1 * var(--magritte-ui-modal-hor-padding-mul) * 24px);
   }
 }
-.magritte-modal-media___UqHGM_11-1-3{
+.magritte-modal-media___UqHGM_11-2-0{
   display:flex;
   position:relative;
   overflow:hidden;
@@ -44,35 +44,35 @@
   background-position:center;
   background-repeat:no-repeat;
 }
-.magritte-modal-media___UqHGM_11-1-3 img{
+.magritte-modal-media___UqHGM_11-2-0 img{
   max-width:100%;
   max-height:100%;
 }
-.magritte-fixed-height___wyJ7-_11-1-3{
+.magritte-fixed-height___wyJ7-_11-2-0{
   aspect-ratio:auto;
   height:var(--height, auto);
 }
-.magritte-contain___3QD0Z_11-1-3{
+.magritte-contain___3QD0Z_11-2-0{
   background-size:contain;
 }
-.magritte-contain___3QD0Z_11-1-3 img{
+.magritte-contain___3QD0Z_11-2-0 img{
   object-fit:contain;
 }
-.magritte-cover___nry9O_11-1-3{
+.magritte-cover___nry9O_11-2-0{
   background-size:cover;
 }
-.magritte-cover___nry9O_11-1-3 img{
+.magritte-cover___nry9O_11-2-0 img{
   object-fit:cover;
 }
 @supports selector(:has(*)){
-  .magritte-modal-media___UqHGM_11-1-3{
+  .magritte-modal-media___UqHGM_11-2-0{
     margin:0 calc(var(--magritte-ui-modal-hor-padding-mul) * -12px);
   }
-  .magritte-content-overlay-top___6snWk_11-1-3 + .magritte-grow-limiter___GmpBj_11-1-3 .magritte-modal-media___UqHGM_11-1-3:first-child{
+  .magritte-content-overlay-top___6snWk_11-2-0 + .magritte-grow-limiter___GmpBj_11-2-0 .magritte-modal-media___UqHGM_11-2-0:first-child{
     margin-top:0;
   }
 }
-.magritte-modal-overlay___WwfCg_11-1-3{
+.magritte-modal-overlay___WwfCg_11-2-0{
   position:fixed;
   top:0;
   right:0;
@@ -82,25 +82,25 @@
   align-items:center;
   justify-content:center;
 }
-.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   background-color:var(--magritte-color-background-overlay-v26-0-2);
   transition-property:opacity, transform;
   user-select:text;
   z-index:1;
 }
-.magritte-modal-overlay___WwfCg_11-1-3:not(.magritte-modal-overlay-with-background___DDxJn_11-1-3){
+.magritte-modal-overlay___WwfCg_11-2-0:not(.magritte-modal-overlay-with-background___DDxJn_11-2-0){
   pointer-events:none;
 }
-.magritte-modal-overlay___WwfCg_11-1-3:not(.magritte-modal-overlay-with-background___DDxJn_11-1-3) .magritte-modal___C4o5U_11-1-3{
+.magritte-modal-overlay___WwfCg_11-2-0:not(.magritte-modal-overlay-with-background___DDxJn_11-2-0) .magritte-modal___C4o5U_11-2-0{
   pointer-events:auto;
 }
-.magritte-modal-overlay-left___agPyC_11-1-3{
+.magritte-modal-overlay-left___agPyC_11-2-0{
   justify-content:flex-start;
 }
-.magritte-modal-overlay-right___-XDAx_11-1-3{
+.magritte-modal-overlay-right___-XDAx_11-2-0{
   justify-content:flex-end;
 }
-.magritte-modal___C4o5U_11-1-3{
+.magritte-modal___C4o5U_11-2-0{
   display:flex;
   box-sizing:border-box;
   margin:0 12px;
@@ -122,25 +122,25 @@
   --magritte-ui-modal-vert-padding-mul:1;
   --magritte-ui-snackbar-container-overflow-override:visible;
 }
-.magritte-modal___C4o5U_11-1-3.magritte-size-small___cI-Ql_11-1-3{
+.magritte-modal___C4o5U_11-2-0.magritte-size-small___cI-Ql_11-2-0{
   width:480px;
 }
-.magritte-modal___C4o5U_11-1-3.magritte-size-medium___jnqfu_11-1-3{
+.magritte-modal___C4o5U_11-2-0.magritte-size-medium___jnqfu_11-2-0{
   width:620px;
 }
-.magritte-no-vertical-paddings___dxyot_11-1-3{
+.magritte-no-vertical-paddings___dxyot_11-2-0{
   --magritte-ui-modal-vert-padding-mul:0;
 }
-.magritte-no-horizontal-paddings___Q-i-5_11-1-3{
+.magritte-no-horizontal-paddings___Q-i-5_11-2-0{
   --magritte-ui-modal-hor-padding-mul:0;
 }
-.magritte-modal-full-height___Aew5F_11-1-3{
+.magritte-modal-full-height___Aew5F_11-2-0{
   height:100%;
 }
-.magritte-modal-with-border___KSnhf_11-1-3{
+.magritte-modal-with-border___KSnhf_11-2-0{
   outline:1px solid var(--magritte-color-stroke-neutral-v26-0-2);
 }
-.magritte-modal-content-wrapper___VzoTN_11-1-3{
+.magritte-modal-content-wrapper___VzoTN_11-2-0{
   position:relative;
   display:flex;
   flex-direction:column;
@@ -148,188 +148,188 @@
   flex:1 1;
   padding:24px 0 0;
 }
-.magritte-no-horizontal-paddings___Q-i-5_11-1-3 .magritte-modal-content-wrapper___VzoTN_11-1-3{
+.magritte-no-horizontal-paddings___Q-i-5_11-2-0 .magritte-modal-content-wrapper___VzoTN_11-2-0{
   padding-right:0;
   padding-left:0;
 }
-.magritte-no-vertical-paddings___dxyot_11-1-3 .magritte-modal-content-wrapper___VzoTN_11-1-3{
+.magritte-no-vertical-paddings___dxyot_11-2-0 .magritte-modal-content-wrapper___VzoTN_11-2-0{
   padding-top:0;
   padding-bottom:0;
 }
-.magritte-modal-footer___Ha-sZ_11-1-3{
+.magritte-modal-footer___Ha-sZ_11-2-0{
   background-color:var(--magritte-color-component-modal-background-content-v26-0-2);
   z-index:1;
   --magritte-ui-container-background-color-override:var(--magritte-color-component-modal-background-content-v26-0-2);
 }
-.magritte-modal-footer___Ha-sZ_11-1-3.magritte-modal-footer-empty___tmH-x_11-1-3{
+.magritte-modal-footer___Ha-sZ_11-2-0.magritte-modal-footer-empty___tmH-x_11-2-0{
   flex:0 0 calc(var(--magritte-ui-modal-vert-padding-mul) * 24px);
 }
-.magritte-animation-timeout___G4Hl1_11-1-3{
+.magritte-animation-timeout___G4Hl1_11-2-0{
   --enter-animation-duration:0;
   --exit-animation-duration:0;
 }
 @media (prefers-reduced-motion: no-preference){
-  .magritte-animation-timeout___G4Hl1_11-1-3{
+  .magritte-animation-timeout___G4Hl1_11-2-0{
     --enter-animation-duration:var(--magritte-semantic-animation-ease-in-out-300-duration-v26-0-2);
     --exit-animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v26-0-2);
   }
 }
-.magritte-animation-enter-center___sq8j7_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-enter-center___sq8j7_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:0;
 }
-.magritte-animation-enter-center___sq8j7_11-1-3 .magritte-modal___C4o5U_11-1-3{
+.magritte-animation-enter-center___sq8j7_11-2-0 .magritte-modal___C4o5U_11-2-0{
   opacity:0;
 }
-.magritte-animation-enter-center-active___ORYEh_11-1-3{
+.magritte-animation-enter-center-active___ORYEh_11-2-0{
   --enter-animation-duration:0;
   --exit-animation-duration:0;
 }
 @media (prefers-reduced-motion: no-preference){
-  .magritte-animation-enter-center-active___ORYEh_11-1-3{
+  .magritte-animation-enter-center-active___ORYEh_11-2-0{
     --enter-animation-duration:var(--magritte-semantic-animation-ease-in-out-300-duration-v26-0-2);
     --exit-animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v26-0-2);
   }
 }
-.magritte-animation-enter-center-active___ORYEh_11-1-3 .magritte-modal___C4o5U_11-1-3,
-.magritte-animation-enter-center-active___ORYEh_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-enter-center-active___ORYEh_11-2-0 .magritte-modal___C4o5U_11-2-0,
+.magritte-animation-enter-center-active___ORYEh_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:1;
   transition-duration:var(--enter-animation-duration);
   transition-timing-function:var(--magritte-semantic-animation-ease-in-out-300-timing-function-v26-0-2);
 }
-.magritte-animation-exit-center___lLCX1_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-exit-center___lLCX1_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:1;
 }
-.magritte-animation-exit-center___lLCX1_11-1-3 .magritte-modal___C4o5U_11-1-3{
+.magritte-animation-exit-center___lLCX1_11-2-0 .magritte-modal___C4o5U_11-2-0{
   opacity:1;
 }
-.magritte-animation-exit-center-active___Ik2Yl_11-1-3{
+.magritte-animation-exit-center-active___Ik2Yl_11-2-0{
   --enter-animation-duration:0;
   --exit-animation-duration:0;
 }
 @media (prefers-reduced-motion: no-preference){
-  .magritte-animation-exit-center-active___Ik2Yl_11-1-3{
+  .magritte-animation-exit-center-active___Ik2Yl_11-2-0{
     --enter-animation-duration:var(--magritte-semantic-animation-ease-in-out-300-duration-v26-0-2);
     --exit-animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v26-0-2);
   }
 }
-.magritte-animation-exit-center-active___Ik2Yl_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-exit-center-active___Ik2Yl_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:0;
 }
-.magritte-animation-exit-center-active___Ik2Yl_11-1-3 .magritte-modal___C4o5U_11-1-3{
+.magritte-animation-exit-center-active___Ik2Yl_11-2-0 .magritte-modal___C4o5U_11-2-0{
   opacity:0;
 }
-.magritte-animation-exit-center-active___Ik2Yl_11-1-3 .magritte-modal___C4o5U_11-1-3,
-.magritte-animation-exit-center-active___Ik2Yl_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-exit-center-active___Ik2Yl_11-2-0 .magritte-modal___C4o5U_11-2-0,
+.magritte-animation-exit-center-active___Ik2Yl_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   transition-duration:var(--exit-animation-duration);
   transition-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v26-0-2);
 }
-.magritte-animation-enter-left___jJDlv_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-enter-left___jJDlv_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:0;
 }
-.magritte-animation-enter-left___jJDlv_11-1-3 .magritte-modal___C4o5U_11-1-3{
+.magritte-animation-enter-left___jJDlv_11-2-0 .magritte-modal___C4o5U_11-2-0{
   opacity:0;
   transform:translateX(-100%);
 }
-.magritte-animation-enter-left-active___-kFij_11-1-3{
+.magritte-animation-enter-left-active___-kFij_11-2-0{
   --enter-animation-duration:0;
   --exit-animation-duration:0;
 }
 @media (prefers-reduced-motion: no-preference){
-  .magritte-animation-enter-left-active___-kFij_11-1-3{
+  .magritte-animation-enter-left-active___-kFij_11-2-0{
     --enter-animation-duration:var(--magritte-semantic-animation-ease-in-out-300-duration-v26-0-2);
     --exit-animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v26-0-2);
   }
 }
-.magritte-animation-enter-left-active___-kFij_11-1-3 .magritte-modal___C4o5U_11-1-3,
-.magritte-animation-enter-left-active___-kFij_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-enter-left-active___-kFij_11-2-0 .magritte-modal___C4o5U_11-2-0,
+.magritte-animation-enter-left-active___-kFij_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:1;
   transition-duration:var(--enter-animation-duration);
   transition-timing-function:var(--magritte-semantic-animation-ease-in-out-300-timing-function-v26-0-2);
   transform:translateX(0);
 }
-.magritte-animation-exit-left___G2Plq_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-exit-left___G2Plq_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:1;
 }
-.magritte-animation-exit-left___G2Plq_11-1-3 .magritte-modal___C4o5U_11-1-3{
+.magritte-animation-exit-left___G2Plq_11-2-0 .magritte-modal___C4o5U_11-2-0{
   opacity:1;
   transform:translateX(0);
 }
-.magritte-animation-exit-left-active___XW2K4_11-1-3{
+.magritte-animation-exit-left-active___XW2K4_11-2-0{
   --enter-animation-duration:0;
   --exit-animation-duration:0;
 }
 @media (prefers-reduced-motion: no-preference){
-  .magritte-animation-exit-left-active___XW2K4_11-1-3{
+  .magritte-animation-exit-left-active___XW2K4_11-2-0{
     --enter-animation-duration:var(--magritte-semantic-animation-ease-in-out-300-duration-v26-0-2);
     --exit-animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v26-0-2);
   }
 }
-.magritte-animation-exit-left-active___XW2K4_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-exit-left-active___XW2K4_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:0;
 }
-.magritte-animation-exit-left-active___XW2K4_11-1-3 .magritte-modal___C4o5U_11-1-3{
+.magritte-animation-exit-left-active___XW2K4_11-2-0 .magritte-modal___C4o5U_11-2-0{
   opacity:0;
   transform:translateX(-100%);
 }
-.magritte-animation-exit-left-active___XW2K4_11-1-3 .magritte-modal___C4o5U_11-1-3,
-.magritte-animation-exit-left-active___XW2K4_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-exit-left-active___XW2K4_11-2-0 .magritte-modal___C4o5U_11-2-0,
+.magritte-animation-exit-left-active___XW2K4_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   transition-duration:var(--exit-animation-duration);
   transition-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v26-0-2);
 }
-.magritte-animation-enter-right___rrMS0_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-enter-right___rrMS0_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:0;
 }
-.magritte-animation-enter-right___rrMS0_11-1-3 .magritte-modal___C4o5U_11-1-3{
+.magritte-animation-enter-right___rrMS0_11-2-0 .magritte-modal___C4o5U_11-2-0{
   opacity:0;
   transform:translateX(100%);
 }
-.magritte-animation-enter-right-active___p7rg-_11-1-3{
+.magritte-animation-enter-right-active___p7rg-_11-2-0{
   --enter-animation-duration:0;
   --exit-animation-duration:0;
 }
 @media (prefers-reduced-motion: no-preference){
-  .magritte-animation-enter-right-active___p7rg-_11-1-3{
+  .magritte-animation-enter-right-active___p7rg-_11-2-0{
     --enter-animation-duration:var(--magritte-semantic-animation-ease-in-out-300-duration-v26-0-2);
     --exit-animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v26-0-2);
   }
 }
-.magritte-animation-enter-right-active___p7rg-_11-1-3 .magritte-modal___C4o5U_11-1-3,
-.magritte-animation-enter-right-active___p7rg-_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-enter-right-active___p7rg-_11-2-0 .magritte-modal___C4o5U_11-2-0,
+.magritte-animation-enter-right-active___p7rg-_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:1;
   transition-duration:var(--enter-animation-duration);
   transition-timing-function:var(--magritte-semantic-animation-ease-in-out-300-timing-function-v26-0-2);
   transform:translateX(0);
 }
-.magritte-animation-exit-right___f3qIC_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-exit-right___f3qIC_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:1;
 }
-.magritte-animation-exit-right___f3qIC_11-1-3 .magritte-modal___C4o5U_11-1-3{
+.magritte-animation-exit-right___f3qIC_11-2-0 .magritte-modal___C4o5U_11-2-0{
   opacity:1;
   transform:translateX(0);
 }
-.magritte-animation-exit-right-active___-sG1k_11-1-3{
+.magritte-animation-exit-right-active___-sG1k_11-2-0{
   --enter-animation-duration:0;
   --exit-animation-duration:0;
 }
 @media (prefers-reduced-motion: no-preference){
-  .magritte-animation-exit-right-active___-sG1k_11-1-3{
+  .magritte-animation-exit-right-active___-sG1k_11-2-0{
     --enter-animation-duration:var(--magritte-semantic-animation-ease-in-out-300-duration-v26-0-2);
     --exit-animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v26-0-2);
   }
 }
-.magritte-animation-exit-right-active___-sG1k_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-exit-right-active___-sG1k_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   opacity:0;
 }
-.magritte-animation-exit-right-active___-sG1k_11-1-3 .magritte-modal___C4o5U_11-1-3{
+.magritte-animation-exit-right-active___-sG1k_11-2-0 .magritte-modal___C4o5U_11-2-0{
   opacity:0;
   transform:translateX(100%);
 }
-.magritte-animation-exit-right-active___-sG1k_11-1-3 .magritte-modal___C4o5U_11-1-3,
-.magritte-animation-exit-right-active___-sG1k_11-1-3.magritte-modal-overlay-with-background___DDxJn_11-1-3{
+.magritte-animation-exit-right-active___-sG1k_11-2-0 .magritte-modal___C4o5U_11-2-0,
+.magritte-animation-exit-right-active___-sG1k_11-2-0.magritte-modal-overlay-with-background___DDxJn_11-2-0{
   transition-duration:var(--exit-animation-duration);
   transition-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v26-0-2);
 }
-.magritte-tree-selector-container___4cdf5_11-1-3{
+.magritte-tree-selector-container___4cdf5_11-2-0{
   height:100%;
   overflow:hidden;
   max-width:calc(100% - 24px);
@@ -339,16 +339,16 @@
   --magritte-ui-scrollbar-offset-right:-24px;
   --magritte-ui-scrollbar-offset-top:0;
 }
-.magritte-no-horizontal-paddings___Q-i-5_11-1-3 .magritte-tree-selector-container___4cdf5_11-1-3{
+.magritte-no-horizontal-paddings___Q-i-5_11-2-0 .magritte-tree-selector-container___4cdf5_11-2-0{
   margin:0;
   padding:0;
   --magritte-ui-scrollbar-offset-right:0;
 }
-.magritte-grow-limiter___GmpBj_11-1-3{
+.magritte-grow-limiter___GmpBj_11-2-0{
   flex:1 0;
   --magritte-ui-scrollbar-offset-top:0;
 }
-.magritte-modal-scroll-container___hOCdh_11-1-3{
+.magritte-modal-scroll-container___hOCdh_11-2-0{
   display:flex;
   flex-direction:column;
   flex:1 1;
@@ -359,23 +359,23 @@
   padding:0 calc(var(--magritte-ui-modal-hor-padding-mul) * 24px);
   margin:0;
 }
-.magritte-modal-scroll-container___hOCdh_11-1-3::-webkit-scrollbar{
+.magritte-modal-scroll-container___hOCdh_11-2-0::-webkit-scrollbar{
   display:none;
 }
-.magritte-content-overlay-top___6snWk_11-1-3{
+.magritte-content-overlay-top___6snWk_11-2-0{
   position:absolute;
   height:0;
   left:calc(var(--magritte-ui-modal-hor-padding-mul) * 24px);
   right:calc(var(--magritte-ui-modal-hor-padding-mul) * 24px);
 }
-.magritte-content-overlay-top___6snWk_11-1-3.magritte-nav-bar___CL7d-_11-1-3,
-.magritte-content-overlay-top___6snWk_11-1-3.magritte-header___pufwA_11-1-3{
+.magritte-content-overlay-top___6snWk_11-2-0.magritte-nav-bar___CL7d-_11-2-0,
+.magritte-content-overlay-top___6snWk_11-2-0.magritte-header___pufwA_11-2-0{
   bottom:0;
 }
-.magritte-content-overlay-top___6snWk_11-1-3.magritte-static___3B6cn_11-1-3{
+.magritte-content-overlay-top___6snWk_11-2-0.magritte-static___3B6cn_11-2-0{
   top:0;
 }
-.magritte-content-overlay-bottom___bDuPC_11-1-3{
+.magritte-content-overlay-bottom___bDuPC_11-2-0{
   position:absolute;
   left:calc(var(--magritte-ui-modal-hor-padding-mul) * 24px);
   right:calc(var(--magritte-ui-modal-hor-padding-mul) * 24px);
@@ -383,10 +383,10 @@
   bottom:0;
 }
 @supports selector(:has(*)){
-  .magritte-modal-content-wrapper___VzoTN_11-1-3:has(.magritte-sticky-header___TPafy_11-1-3){
+  .magritte-modal-content-wrapper___VzoTN_11-2-0:has(.magritte-sticky-header___TPafy_11-2-0){
     padding:0;
   }
-  .magritte-modal-content-wrapper___VzoTN_11-1-3:not(:has(.magritte-sticky-header___TPafy_11-1-3)):has(.magritte-grow-limiter___GmpBj_11-1-3 > .magritte-modal-media___UqHGM_11-1-3:first-child){
+  .magritte-modal-content-wrapper___VzoTN_11-2-0:not(:has(.magritte-sticky-header___TPafy_11-2-0)):has(.magritte-grow-limiter___GmpBj_11-2-0 > .magritte-modal-media___UqHGM_11-2-0:first-child){
     padding-top:12px;
   }
 }

package/index.js

@@ -17,7 +17,7 @@ import './internal/ModalContent.js';
 import './internal/isTreeSelectorChild.js';
 import '@hh.ru/magritte-ui-tree-selector';
 import '@hh.ru/magritte-ui-textarea';
-import './modal-f3544Spk.js';
+import './modal-DPOMjFyz.js';
 import './internal/ModalInner.js';
 import '@hh.ru/magritte-ui-action-bar';
 import './actionBarDefaults.js';
@@ -30,6 +30,7 @@ import '@hh.ru/magritte-ui-nav-bar';
 import '@hh.ru/magritte-ui-scrollbar';
 import './internal/constants.js';
 import '@hh.ru/magritte-design-tokens/core-tokens';
+import './internal/useHeightOnShow.js';
 import './internal/useModalTransition.js';
 import '@hh.ru/magritte-common-modal-helper';
 import '@hh.ru/magritte-ui-breakpoint';

package/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/internal/ModalBody.js

@@ -7,7 +7,7 @@ import { useContentOverlay, ContentOverlayRoot } from '@hh.ru/magritte-ui-conten
 import { useRegisterTopOverlayCandidate, TOP_OVERLAY_PRIORITY, useResolvedTopOverlayElement } from './ModalSlotsContext.js';
 import { ModalStickyHeader } from './ModalStickyHeader.js';
 import { useScrollbar, Scrollbar } from '@hh.ru/magritte-ui-scrollbar';
-import { s as styles } from '../modal-f3544Spk.js';
+import { s as styles } from '../modal-DPOMjFyz.js';
 import '@hh.ru/magritte-internal-slot-registry';
 import '@hh.ru/magritte-ui-nav-bar';
 

package/internal/ModalContent.js

@@ -2,7 +2,7 @@ import './../index.css';
 import { jsx } from 'react/jsx-runtime';
 import { isTreeSelectorChild } from './isTreeSelectorChild.js';
 import { TextAreaGrowLimiter } from '@hh.ru/magritte-ui-textarea';
-import { s as styles } from '../modal-f3544Spk.js';
+import { s as styles } from '../modal-DPOMjFyz.js';
 import 'react';
 import '@hh.ru/magritte-ui-tree-selector';
 

package/internal/ModalInner.js

@@ -7,7 +7,7 @@ import { ActionBarDefaultPropsContext } from '@hh.ru/magritte-ui-action-bar';
 import { MODAL_ACTION_BAR_DEFAULTS } from '../actionBarDefaults.js';
 import { ModalBody } from './ModalBody.js';
 import { NavBar } from '@hh.ru/magritte-ui-nav-bar';
-import { s as styles } from '../modal-f3544Spk.js';
+import { s as styles } from '../modal-DPOMjFyz.js';
 import '@hh.ru/magritte-common-use-multiple-refs';
 import '@hh.ru/magritte-ui-content-overlay';
 import './ModalSlotsContext.js';

package/internal/ModalStickyHeader.js

@@ -4,7 +4,7 @@ import { useMemo } from 'react';
 import classnames from 'classnames';
 import { useRegisterTopOverlayCandidate, TOP_OVERLAY_PRIORITY } from './ModalSlotsContext.js';
 import { NavBarDefaultPropsContext } from '@hh.ru/magritte-ui-nav-bar';
-import { s as styles } from '../modal-f3544Spk.js';
+import { s as styles } from '../modal-DPOMjFyz.js';
 import '@hh.ru/magritte-internal-slot-registry';
 
 const NAV_BAR_ACTIONS_DEFAULT_PROPS = {
@@ -12,7 +12,8 @@ const NAV_BAR_ACTIONS_DEFAULT_PROPS = {
 };
 const NAV_BAR_ACTIONS_ICONS_DEFAULT_PROPS = {
   borderRadius: 12,
-  padding: 8
+  padding: 8,
+  backgroundStyle: "overlay-modal-action"
 };
 const NAV_BAR_ROOT_DEFAULT_PROPS = { showDivider: "with-scroll", snapScroll: false };
 const ModalStickyHeader = ({ children }) => {

package/internal/ModalStickyHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalStickyHeader.js","sources":["src/internal/ModalStickyHeader.tsx"],"sourcesContent":["import { type FC, PropsWithChildren, useMemo } from 'react';\nimport classnames from 'classnames';\n\nimport { type IconProps } from '@hh.ru/magritte-ui-icon';\nimport {\n    TOP_OVERLAY_PRIORITY,\n    useRegisterTopOverlayCandidate,\n} from '@hh.ru/magritte-ui-modal/internal/ModalSlotsContext';\nimport { type NavBarProps, NavBarDefaultPropsContext, type ActionsProps } from '@hh.ru/magritte-ui-nav-bar';\n\nimport styles from './modal.less';\n\nconst NAV_BAR_ACTIONS_DEFAULT_PROPS: Partial<ActionsProps> = {\n    verticalAlign: 'top',\n};\n\nconst NAV_BAR_ACTIONS_ICONS_DEFAULT_PROPS: Partial<IconProps> = {\n    borderRadius: 12,\n    padding: 8,\n};\n\nconst NAV_BAR_ROOT_DEFAULT_PROPS = { showDivider: 'with-scroll', snapScroll: false } as const;\n\nexport type ModalStickyHeaderProps = PropsWithChildren;\n\n/**\n * Sticky-хедер модала. Нижний край хедера (для `offsetTop` скроллбара и контейнера top-overlay) берётся\n * из `bottomAttachment` навбара / запасного `div` хедера — они позиционируются по визуальному низу хедера\n * и переживают overlay-навбар (когда его обёртка схлопывается в 0), поэтому отдельный flow-маркер не нужен.\n */\nexport const ModalStickyHeader: FC<ModalStickyHeaderProps> = ({ children }) => {\n    // Хедер предлагает в слот `top` двух кандидатов: контейнер у нижнего края навбара (если навбар внутри\n    // есть) и собственный запасной `div`. Каждый реф регистрирует свою ноду в общем реестре\n    // `topOverlayContainer` (победитель резолвится по приоритету в ModalBody): навбар важнее запасного\n    // `div` хедера, а тот — важнее запасного `div` тела. Незадействованный кандидат (например навбар, когда\n    // навбара нет) просто не монтируется → его реф не срабатывает → он не регистрируется и не участвует.\n    const navBarRef = useRegisterTopOverlayCandidate(TOP_OVERLAY_PRIORITY.navBar);\n    const headerFallbackRef = useRegisterTopOverlayCandidate(TOP_OVERLAY_PRIORITY.headerFallback);\n\n    const navBarRootProps = useMemo<Partial<NavBarProps>>(\n        () => ({\n            ...NAV_BAR_ROOT_DEFAULT_PROPS,\n            bottomAttachment: <div ref={navBarRef} className={classnames(styles.contentOverlayTop, styles.navBar)} />,\n        }),\n        [navBarRef]\n    );\n\n    return (\n        <div className={styles.stickyHeader}>\n            {/*\n             * Отрицательные марджины-«вылет» хедера висят на этом внутреннем статичном элементе, а не на\n             * самом sticky-хедере. Причина — баг WebKit/Safari: для `position: sticky` отрицательные\n             * марджины попадают в scrollable-overflow скролл-контейнера (для статичных элементов — нет),\n             * из-за чего в Safari появляется фантомный горизонтальный скролл.\n             */}\n            <div className={styles.stickyHeaderInner}>\n                <NavBarDefaultPropsContext\n                    rootProps={navBarRootProps}\n                    actionsProps={NAV_BAR_ACTIONS_DEFAULT_PROPS}\n                    actionsIconsProps={NAV_BAR_ACTIONS_ICONS_DEFAULT_PROPS}\n                >\n                    {children}\n                </NavBarDefaultPropsContext>\n                <div ref={headerFallbackRef} className={classnames(styles.contentOverlayTop, styles.header)} />\n            </div>\n        </div>\n    );\n};\n\nModalStickyHeader.displayName = 'ModalStickyHeader';\n"],"names":[],"mappings":";;;;;;;;AAYA,MAAM,6BAAuD,GAAA;AAAA,EACzD,aAAe,EAAA,KAAA;AACnB,CAAA,CAAA;AAEA,MAAM,mCAA0D,GAAA;AAAA,EAC5D,YAAc,EAAA,EAAA;AAAA,EACd,OAAS,EAAA,CAAA;AACb,CAAA,CAAA;AAEA,MAAM,0BAA6B,GAAA,EAAE,WAAa,EAAA,aAAA,EAAe,YAAY,KAAM,EAAA,CAAA;AAS5E,MAAM,iBAAgD,GAAA,CAAC,EAAE,QAAA,EAAe,KAAA;AAM3E,EAAM,MAAA,SAAA,GAAY,8BAA+B,CAAA,oBAAA,CAAqB,MAAM,CAAA,CAAA;AAC5E,EAAM,MAAA,iBAAA,GAAoB,8BAA+B,CAAA,oBAAA,CAAqB,cAAc,CAAA,CAAA;AAE5F,EAAA,MAAM,eAAkB,GAAA,OAAA;AAAA,IACpB,OAAO;AAAA,MACH,GAAG,0BAAA;AAAA,MACH,gBAAA,kBAAmB,GAAA,CAAA,KAAA,EAAA,EAAI,GAAK,EAAA,SAAA,EAAW,SAAW,EAAA,UAAA,CAAW,MAAO,CAAA,iBAAA,EAAmB,MAAO,CAAA,MAAM,CAAG,EAAA,CAAA;AAAA,KAC3G,CAAA;AAAA,IACA,CAAC,SAAS,CAAA;AAAA,GACd,CAAA;AAEA,EACI,uBAAA,GAAA,CAAC,SAAI,SAAW,EAAA,MAAA,CAAO,cAOnB,QAAC,kBAAA,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,iBACnB,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,yBAAA;AAAA,MAAA;AAAA,QACG,SAAW,EAAA,eAAA;AAAA,QACX,YAAc,EAAA,6BAAA;AAAA,QACd,iBAAmB,EAAA,mCAAA;AAAA,QAElB,QAAA;AAAA,OAAA;AAAA,KACL;AAAA,oBACA,GAAA,CAAC,KAAI,EAAA,EAAA,GAAA,EAAK,iBAAmB,EAAA,SAAA,EAAW,WAAW,MAAO,CAAA,iBAAA,EAAmB,MAAO,CAAA,MAAM,CAAG,EAAA,CAAA;AAAA,GAAA,EACjG,CACJ,EAAA,CAAA,CAAA;AAER,EAAA;AAEA,iBAAA,CAAkB,WAAc,GAAA,mBAAA;;;;"}
+{"version":3,"file":"ModalStickyHeader.js","sources":["src/internal/ModalStickyHeader.tsx"],"sourcesContent":["import { type FC, PropsWithChildren, useMemo } from 'react';\nimport classnames from 'classnames';\n\nimport { type IconProps } from '@hh.ru/magritte-ui-icon';\nimport {\n    TOP_OVERLAY_PRIORITY,\n    useRegisterTopOverlayCandidate,\n} from '@hh.ru/magritte-ui-modal/internal/ModalSlotsContext';\nimport { type NavBarProps, NavBarDefaultPropsContext, type ActionsProps } from '@hh.ru/magritte-ui-nav-bar';\n\nimport styles from './modal.less';\n\nconst NAV_BAR_ACTIONS_DEFAULT_PROPS: Partial<ActionsProps> = {\n    verticalAlign: 'top',\n};\n\nconst NAV_BAR_ACTIONS_ICONS_DEFAULT_PROPS: Partial<IconProps> = {\n    borderRadius: 12,\n    padding: 8,\n    backgroundStyle: 'overlay-modal-action',\n};\n\nconst NAV_BAR_ROOT_DEFAULT_PROPS = { showDivider: 'with-scroll', snapScroll: false } as const;\n\nexport type ModalStickyHeaderProps = PropsWithChildren;\n\n/**\n * Sticky-хедер модала. Нижний край хедера (для `offsetTop` скроллбара и контейнера top-overlay) берётся\n * из `bottomAttachment` навбара / запасного `div` хедера — они позиционируются по визуальному низу хедера\n * и переживают overlay-навбар (когда его обёртка схлопывается в 0), поэтому отдельный flow-маркер не нужен.\n */\nexport const ModalStickyHeader: FC<ModalStickyHeaderProps> = ({ children }) => {\n    // Хедер предлагает в слот `top` двух кандидатов: контейнер у нижнего края навбара (если навбар внутри\n    // есть) и собственный запасной `div`. Каждый реф регистрирует свою ноду в общем реестре\n    // `topOverlayContainer` (победитель резолвится по приоритету в ModalBody): навбар важнее запасного\n    // `div` хедера, а тот — важнее запасного `div` тела. Незадействованный кандидат (например навбар, когда\n    // навбара нет) просто не монтируется → его реф не срабатывает → он не регистрируется и не участвует.\n    const navBarRef = useRegisterTopOverlayCandidate(TOP_OVERLAY_PRIORITY.navBar);\n    const headerFallbackRef = useRegisterTopOverlayCandidate(TOP_OVERLAY_PRIORITY.headerFallback);\n\n    const navBarRootProps = useMemo<Partial<NavBarProps>>(\n        () => ({\n            ...NAV_BAR_ROOT_DEFAULT_PROPS,\n            bottomAttachment: <div ref={navBarRef} className={classnames(styles.contentOverlayTop, styles.navBar)} />,\n        }),\n        [navBarRef]\n    );\n\n    return (\n        <div className={styles.stickyHeader}>\n            {/*\n             * Отрицательные марджины-«вылет» хедера висят на этом внутреннем статичном элементе, а не на\n             * самом sticky-хедере. Причина — баг WebKit/Safari: для `position: sticky` отрицательные\n             * марджины попадают в scrollable-overflow скролл-контейнера (для статичных элементов — нет),\n             * из-за чего в Safari появляется фантомный горизонтальный скролл.\n             */}\n            <div className={styles.stickyHeaderInner}>\n                <NavBarDefaultPropsContext\n                    rootProps={navBarRootProps}\n                    actionsProps={NAV_BAR_ACTIONS_DEFAULT_PROPS}\n                    actionsIconsProps={NAV_BAR_ACTIONS_ICONS_DEFAULT_PROPS}\n                >\n                    {children}\n                </NavBarDefaultPropsContext>\n                <div ref={headerFallbackRef} className={classnames(styles.contentOverlayTop, styles.header)} />\n            </div>\n        </div>\n    );\n};\n\nModalStickyHeader.displayName = 'ModalStickyHeader';\n"],"names":[],"mappings":";;;;;;;;AAYA,MAAM,6BAAuD,GAAA;AAAA,EACzD,aAAe,EAAA,KAAA;AACnB,CAAA,CAAA;AAEA,MAAM,mCAA0D,GAAA;AAAA,EAC5D,YAAc,EAAA,EAAA;AAAA,EACd,OAAS,EAAA,CAAA;AAAA,EACT,eAAiB,EAAA,sBAAA;AACrB,CAAA,CAAA;AAEA,MAAM,0BAA6B,GAAA,EAAE,WAAa,EAAA,aAAA,EAAe,YAAY,KAAM,EAAA,CAAA;AAS5E,MAAM,iBAAgD,GAAA,CAAC,EAAE,QAAA,EAAe,KAAA;AAM3E,EAAM,MAAA,SAAA,GAAY,8BAA+B,CAAA,oBAAA,CAAqB,MAAM,CAAA,CAAA;AAC5E,EAAM,MAAA,iBAAA,GAAoB,8BAA+B,CAAA,oBAAA,CAAqB,cAAc,CAAA,CAAA;AAE5F,EAAA,MAAM,eAAkB,GAAA,OAAA;AAAA,IACpB,OAAO;AAAA,MACH,GAAG,0BAAA;AAAA,MACH,gBAAA,kBAAmB,GAAA,CAAA,KAAA,EAAA,EAAI,GAAK,EAAA,SAAA,EAAW,SAAW,EAAA,UAAA,CAAW,MAAO,CAAA,iBAAA,EAAmB,MAAO,CAAA,MAAM,CAAG,EAAA,CAAA;AAAA,KAC3G,CAAA;AAAA,IACA,CAAC,SAAS,CAAA;AAAA,GACd,CAAA;AAEA,EACI,uBAAA,GAAA,CAAC,SAAI,SAAW,EAAA,MAAA,CAAO,cAOnB,QAAC,kBAAA,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,iBACnB,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,yBAAA;AAAA,MAAA;AAAA,QACG,SAAW,EAAA,eAAA;AAAA,QACX,YAAc,EAAA,6BAAA;AAAA,QACd,iBAAmB,EAAA,mCAAA;AAAA,QAElB,QAAA;AAAA,OAAA;AAAA,KACL;AAAA,oBACA,GAAA,CAAC,KAAI,EAAA,EAAA,GAAA,EAAK,iBAAmB,EAAA,SAAA,EAAW,WAAW,MAAO,CAAA,iBAAA,EAAmB,MAAO,CAAA,MAAM,CAAG,EAAA,CAAA;AAAA,GAAA,EACjG,CACJ,EAAA,CAAA,CAAA;AAER,EAAA;AAEA,iBAAA,CAAkB,WAAc,GAAA,mBAAA;;;;"}

package/internal/constants.js

@@ -1,6 +1,6 @@
 import './../index.css';
 import coreTokens from '@hh.ru/magritte-design-tokens/core-tokens';
-import { s as styles } from '../modal-f3544Spk.js';
+import { s as styles } from '../modal-DPOMjFyz.js';
 
 const DEFAULT_PAGE_HEADER_PADDING = 72;
 const noop = () => void 0;

package/internal/useHeightOnShow.d.ts

@@ -0,0 +1,15 @@
+import { type RefObject } from 'react';
+interface UseHeightOnShowParams {
+    /** Режим `height="content-on-show"` включён. */
+    enabled: boolean;
+    /** Модал показан и смонтирован (не скрыт на текущем брейкпоинте). */
+    shown: boolean;
+    modalRef: RefObject<HTMLDivElement>;
+}
+/**
+ * Высота модала в режиме `height="content-on-show"`: замеряется по контенту в момент показа и дальше не
+ * меняется, пока модал не покажут заново. Уменьшиться при сжатии вьюпорта модалу даёт `max-height` в стилях.
+ * Возвращает `undefined`, пока замера нет (режим выключен или модал ещё не показан).
+ */
+export declare const useHeightOnShow: ({ enabled, shown, modalRef }: UseHeightOnShowParams) => number | undefined;
+export {};

package/internal/useHeightOnShow.js

@@ -0,0 +1,21 @@
+import './../index.css';
+import { useState, useLayoutEffect } from 'react';
+
+const useHeightOnShow = ({ enabled, shown, modalRef }) => {
+  const [height, setHeight] = useState();
+  useLayoutEffect(() => {
+    const modal = modalRef.current;
+    if (!enabled || !shown || !modal) {
+      return;
+    }
+    const prevHeight = modal.style.height;
+    modal.style.height = "";
+    const measuredHeight = modal.offsetHeight;
+    modal.style.height = prevHeight;
+    setHeight(measuredHeight);
+  }, [enabled, shown, modalRef]);
+  return enabled ? height : void 0;
+};
+
+export { useHeightOnShow };
+//# sourceMappingURL=useHeightOnShow.js.map

package/internal/useHeightOnShow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHeightOnShow.js","sources":["src/internal/useHeightOnShow.ts"],"sourcesContent":["import { type RefObject, useLayoutEffect, useState } from 'react';\n\ninterface UseHeightOnShowParams {\n    /** Режим `height=\"content-on-show\"` включён. */\n    enabled: boolean;\n    /** Модал показан и смонтирован (не скрыт на текущем брейкпоинте). */\n    shown: boolean;\n    modalRef: RefObject<HTMLDivElement>;\n}\n\n/**\n * Высота модала в режиме `height=\"content-on-show\"`: замеряется по контенту в момент показа и дальше не\n * меняется, пока модал не покажут заново. Уменьшиться при сжатии вьюпорта модалу даёт `max-height` в стилях.\n * Возвращает `undefined`, пока замера нет (режим выключен или модал ещё не показан).\n */\nexport const useHeightOnShow = ({ enabled, shown, modalRef }: UseHeightOnShowParams): number | undefined => {\n    const [height, setHeight] = useState<number>();\n\n    useLayoutEffect(() => {\n        const modal = modalRef.current;\n        if (!enabled || !shown || !modal) {\n            return;\n        }\n\n        // Замеряем без высоты, зафиксированной прошлым показом, и сразу её возвращаем:\n        // если замер совпадёт со стейтом, ререндера не будет и React стиль не восстановит.\n        const prevHeight = modal.style.height;\n        modal.style.height = '';\n        const measuredHeight = modal.offsetHeight;\n        modal.style.height = prevHeight;\n\n        setHeight(measuredHeight);\n    }, [enabled, shown, modalRef]);\n\n    return enabled ? height : undefined;\n};\n"],"names":[],"mappings":";;AAeO,MAAM,kBAAkB,CAAC,EAAE,OAAS,EAAA,KAAA,EAAO,UAA0D,KAAA;AACxG,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,QAAiB,EAAA,CAAA;AAE7C,EAAA,eAAA,CAAgB,MAAM;AAClB,IAAA,MAAM,QAAQ,QAAS,CAAA,OAAA,CAAA;AACvB,IAAA,IAAI,CAAC,OAAA,IAAW,CAAC,KAAA,IAAS,CAAC,KAAO,EAAA;AAC9B,MAAA,OAAA;AAAA,KACJ;AAIA,IAAM,MAAA,UAAA,GAAa,MAAM,KAAM,CAAA,MAAA,CAAA;AAC/B,IAAA,KAAA,CAAM,MAAM,MAAS,GAAA,EAAA,CAAA;AACrB,IAAA,MAAM,iBAAiB,KAAM,CAAA,YAAA,CAAA;AAC7B,IAAA,KAAA,CAAM,MAAM,MAAS,GAAA,UAAA,CAAA;AAErB,IAAA,SAAA,CAAU,cAAc,CAAA,CAAA;AAAA,GACzB,EAAA,CAAC,OAAS,EAAA,KAAA,EAAO,QAAQ,CAAC,CAAA,CAAA;AAE7B,EAAA,OAAO,UAAU,MAAS,GAAA,KAAA,CAAA,CAAA;AAC9B;;;;"}

package/modal-DPOMjFyz.js

@@ -0,0 +1,5 @@
+import './index.css';
+var styles = {"sticky-header":"magritte-sticky-header___TPafy_11-2-0","stickyHeader":"magritte-sticky-header___TPafy_11-2-0","sticky-header-inner":"magritte-sticky-header-inner___u5p8h_11-2-0","stickyHeaderInner":"magritte-sticky-header-inner___u5p8h_11-2-0","modal-media":"magritte-modal-media___UqHGM_11-2-0","modalMedia":"magritte-modal-media___UqHGM_11-2-0","fixed-height":"magritte-fixed-height___wyJ7-_11-2-0","fixedHeight":"magritte-fixed-height___wyJ7-_11-2-0","contain":"magritte-contain___3QD0Z_11-2-0","cover":"magritte-cover___nry9O_11-2-0","content-overlay-top":"magritte-content-overlay-top___6snWk_11-2-0","contentOverlayTop":"magritte-content-overlay-top___6snWk_11-2-0","grow-limiter":"magritte-grow-limiter___GmpBj_11-2-0","growLimiter":"magritte-grow-limiter___GmpBj_11-2-0","modal-overlay":"magritte-modal-overlay___WwfCg_11-2-0","modalOverlay":"magritte-modal-overlay___WwfCg_11-2-0","modal-overlay-with-background":"magritte-modal-overlay-with-background___DDxJn_11-2-0","modalOverlayWithBackground":"magritte-modal-overlay-with-background___DDxJn_11-2-0","modal":"magritte-modal___C4o5U_11-2-0","modal-overlay-left":"magritte-modal-overlay-left___agPyC_11-2-0","modalOverlayLeft":"magritte-modal-overlay-left___agPyC_11-2-0","modal-overlay-right":"magritte-modal-overlay-right___-XDAx_11-2-0","modalOverlayRight":"magritte-modal-overlay-right___-XDAx_11-2-0","size-small":"magritte-size-small___cI-Ql_11-2-0","sizeSmall":"magritte-size-small___cI-Ql_11-2-0","size-medium":"magritte-size-medium___jnqfu_11-2-0","sizeMedium":"magritte-size-medium___jnqfu_11-2-0","no-vertical-paddings":"magritte-no-vertical-paddings___dxyot_11-2-0","noVerticalPaddings":"magritte-no-vertical-paddings___dxyot_11-2-0","no-horizontal-paddings":"magritte-no-horizontal-paddings___Q-i-5_11-2-0","noHorizontalPaddings":"magritte-no-horizontal-paddings___Q-i-5_11-2-0","modal-full-height":"magritte-modal-full-height___Aew5F_11-2-0","modalFullHeight":"magritte-modal-full-height___Aew5F_11-2-0","modal-with-border":"magritte-modal-with-border___KSnhf_11-2-0","modalWithBorder":"magritte-modal-with-border___KSnhf_11-2-0","modal-content-wrapper":"magritte-modal-content-wrapper___VzoTN_11-2-0","modalContentWrapper":"magritte-modal-content-wrapper___VzoTN_11-2-0","modal-footer":"magritte-modal-footer___Ha-sZ_11-2-0","modalFooter":"magritte-modal-footer___Ha-sZ_11-2-0","modal-footer-empty":"magritte-modal-footer-empty___tmH-x_11-2-0","modalFooterEmpty":"magritte-modal-footer-empty___tmH-x_11-2-0","animation-timeout":"magritte-animation-timeout___G4Hl1_11-2-0","animationTimeout":"magritte-animation-timeout___G4Hl1_11-2-0","animation-enter-center":"magritte-animation-enter-center___sq8j7_11-2-0","animationEnterCenter":"magritte-animation-enter-center___sq8j7_11-2-0","animation-enter-center-active":"magritte-animation-enter-center-active___ORYEh_11-2-0","animationEnterCenterActive":"magritte-animation-enter-center-active___ORYEh_11-2-0","animation-exit-center":"magritte-animation-exit-center___lLCX1_11-2-0","animationExitCenter":"magritte-animation-exit-center___lLCX1_11-2-0","animation-exit-center-active":"magritte-animation-exit-center-active___Ik2Yl_11-2-0","animationExitCenterActive":"magritte-animation-exit-center-active___Ik2Yl_11-2-0","animation-enter-left":"magritte-animation-enter-left___jJDlv_11-2-0","animationEnterLeft":"magritte-animation-enter-left___jJDlv_11-2-0","animation-enter-left-active":"magritte-animation-enter-left-active___-kFij_11-2-0","animationEnterLeftActive":"magritte-animation-enter-left-active___-kFij_11-2-0","animation-exit-left":"magritte-animation-exit-left___G2Plq_11-2-0","animationExitLeft":"magritte-animation-exit-left___G2Plq_11-2-0","animation-exit-left-active":"magritte-animation-exit-left-active___XW2K4_11-2-0","animationExitLeftActive":"magritte-animation-exit-left-active___XW2K4_11-2-0","animation-enter-right":"magritte-animation-enter-right___rrMS0_11-2-0","animationEnterRight":"magritte-animation-enter-right___rrMS0_11-2-0","animation-enter-right-active":"magritte-animation-enter-right-active___p7rg-_11-2-0","animationEnterRightActive":"magritte-animation-enter-right-active___p7rg-_11-2-0","animation-exit-right":"magritte-animation-exit-right___f3qIC_11-2-0","animationExitRight":"magritte-animation-exit-right___f3qIC_11-2-0","animation-exit-right-active":"magritte-animation-exit-right-active___-sG1k_11-2-0","animationExitRightActive":"magritte-animation-exit-right-active___-sG1k_11-2-0","tree-selector-container":"magritte-tree-selector-container___4cdf5_11-2-0","treeSelectorContainer":"magritte-tree-selector-container___4cdf5_11-2-0","modal-scroll-container":"magritte-modal-scroll-container___hOCdh_11-2-0","modalScrollContainer":"magritte-modal-scroll-container___hOCdh_11-2-0","nav-bar":"magritte-nav-bar___CL7d-_11-2-0","navBar":"magritte-nav-bar___CL7d-_11-2-0","header":"magritte-header___pufwA_11-2-0","static":"magritte-static___3B6cn_11-2-0","content-overlay-bottom":"magritte-content-overlay-bottom___bDuPC_11-2-0","contentOverlayBottom":"magritte-content-overlay-bottom___bDuPC_11-2-0"};
+
+export { styles as s };
+//# sourceMappingURL=modal-DPOMjFyz.js.map

package/modal-DPOMjFyz.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal-DPOMjFyz.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hh.ru/magritte-ui-modal",
-  "version": "11.1.3",
+  "version": "11.2.0",
   "main": "index.js",
   "types": "index.d.ts",
   "sideEffects": [
@@ -47,10 +47,10 @@
     "@hh.ru/magritte-ui-nav-bar": "2.1.0",
     "@hh.ru/magritte-ui-progress-bar": "5.1.0",
     "@hh.ru/magritte-ui-scrollbar": "1.1.0",
-    "@hh.ru/magritte-ui-textarea": "3.4.0",
+    "@hh.ru/magritte-ui-textarea": "3.4.1",
     "@hh.ru/magritte-ui-theme-wrapper": "1.1.30",
     "@hh.ru/magritte-ui-title": "8.3.15",
-    "@hh.ru/magritte-ui-tree-selector": "5.7.2"
+    "@hh.ru/magritte-ui-tree-selector": "5.7.3"
   },
   "peerDependencies": {
     "classnames": ">=2.3.2",
@@ -61,5 +61,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "c4a95a3ae0a370fb14e16f79e2294b053bfcf67e"
+  "gitHead": "ad19ed51701dafb78eb62deec0a4cf7448b0ff47"
 }

package/public/Modal.js

@@ -16,11 +16,12 @@ import { ModalInner } from '../internal/ModalInner.js';
 import { ModalSlotsProvider } from '../internal/ModalSlotsContext.js';
 import { getAnimationTimeout, CSS_CLASSES, noop, DEFAULT_PAGE_HEADER_PADDING } from '../internal/constants.js';
 import { isTreeSelectorChild } from '../internal/isTreeSelectorChild.js';
+import { useHeightOnShow } from '../internal/useHeightOnShow.js';
 import { useModalTransition } from '../internal/useModalTransition.js';
 import { usePageHeaderScrollAnimation } from '../internal/usePageHeaderScrollAnimation.js';
 import { ModalMedia } from './ModalMedia.js';
 import { ThemeWrapper } from '@hh.ru/magritte-ui-theme-wrapper';
-import { s as styles } from '../modal-f3544Spk.js';
+import { s as styles } from '../modal-DPOMjFyz.js';
 import '@hh.ru/magritte-ui-textarea';
 import '@hh.ru/magritte-ui-action-bar';
 import '../actionBarDefaults.js';
@@ -83,6 +84,11 @@ const Modal = forwardRef(
       modalRef,
       animationTimeoutExit: animationTimeout.exit
     });
+    const heightOnShow = useHeightOnShow({
+      enabled: resolvedHeight === "content-on-show",
+      shown: !!visible && !isHiddenForBreakpoint && !isServerEnv,
+      modalRef
+    });
     usePageHeaderScrollAnimation({
       overlayRef,
       showOverlay,
@@ -149,7 +155,7 @@ const Modal = forwardRef(
                   ariaModal: visible && showOverlay && !isServerEnv,
                   refCallback: modalRefCallback,
                   size,
-                  height: resolvedHeight,
+                  height: resolvedHeight === "content-on-show" ? heightOnShow ?? "content" : resolvedHeight,
                   minHeight,
                   disableVerticalPaddings,
                   disableHorizontalPaddings,

package/public/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sources":["src/public/Modal.tsx"],"sourcesContent":["import {\n    forwardRef,\n    type HTMLAttributes,\n    useRef,\n    useState,\n    type ForwardRefExoticComponent,\n    type PropsWithoutRef,\n    type RefAttributes,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { CSSTransition } from 'react-transition-group';\nimport classnames from 'classnames';\n\nimport { useServerEnv } from '@hh.ru/magritte-common-is-server-env';\nimport { keyboardMatch, keyboardKeys, useKeyboardNavigation } from '@hh.ru/magritte-common-keyboard';\nimport { CloseByClickOutsideContext } from '@hh.ru/magritte-common-mouse/useCloseByClickOutside';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { useNoBubbling } from '@hh.ru/magritte-common-use-no-bubbling';\nimport { AccessibleRegionProvider, type ExplicitRegionProps } from '@hh.ru/magritte-internal-accessible-region';\nimport { Layer } from '@hh.ru/magritte-ui-layer';\nimport { ModalContent } from '@hh.ru/magritte-ui-modal/internal/ModalContent';\nimport { ModalInner } from '@hh.ru/magritte-ui-modal/internal/ModalInner';\nimport { ModalSlotsProvider } from '@hh.ru/magritte-ui-modal/internal/ModalSlotsContext';\nimport {\n    CSS_CLASSES,\n    DEFAULT_PAGE_HEADER_PADDING,\n    getAnimationTimeout,\n    noop,\n} from '@hh.ru/magritte-ui-modal/internal/constants';\nimport { isTreeSelectorChild } from '@hh.ru/magritte-ui-modal/internal/isTreeSelectorChild';\nimport { useModalTransition } from '@hh.ru/magritte-ui-modal/internal/useModalTransition';\nimport { usePageHeaderScrollAnimation } from '@hh.ru/magritte-ui-modal/internal/usePageHeaderScrollAnimation';\nimport { ModalMedia, type ModalMediaProps } from '@hh.ru/magritte-ui-modal/public/ModalMedia';\nimport { type ModalProps } from '@hh.ru/magritte-ui-modal/public/types';\nimport { ThemeWrapper } from '@hh.ru/magritte-ui-theme-wrapper';\n\nimport styles from '../internal/modal.less';\n\ntype ModalRootProps = ModalProps &\n    ExplicitRegionProps &\n    Omit<HTMLAttributes<HTMLDivElement>, keyof ModalProps | 'role' | 'tabIndex' | 'className'>;\n\ninterface ModalCompound {\n    Media: ForwardRefExoticComponent<ModalMediaProps & RefAttributes<HTMLDivElement>>;\n}\n\nexport const Modal = forwardRef<HTMLDivElement, ModalRootProps>(\n    (\n        {\n            visible,\n            size = 'medium',\n            header,\n            footer,\n            children,\n            onClose = noop,\n            host,\n            disableVerticalPaddings = false,\n            disableHorizontalPaddings = false,\n            closeByClickOutside = true,\n            onAppear,\n            onBeforeExit,\n            onAfterExit,\n            position = 'center',\n            height = position === 'center' ? 'content' : 'full-screen',\n            minHeight,\n            showOverlay: _showOverlay = true,\n            pageHeaderPadding = DEFAULT_PAGE_HEADER_PADDING,\n            returnFocusOnClose,\n            'aria-label': ariaLabel,\n            'aria-labelledby': ariaLabelledby,\n            'aria-describedby': ariaDescribedby,\n            'aria-description': ariaDescription,\n            ...rest\n        },\n        ref\n    ) => {\n        const isServerEnv = useServerEnv();\n        const [animationTimeout] = useState(getAnimationTimeout);\n\n        const modalRef = useRef<HTMLDivElement>(null);\n        const overlayRef = useRef<HTMLDivElement>(null);\n        const keyboardNavigationRef = useKeyboardNavigation({ enabled: visible && !isServerEnv, mode: 'loop' });\n        const modalRefCallback = useMultipleRefs(ref, modalRef, keyboardNavigationRef);\n\n        const showOverlay = position === 'center' || _showOverlay;\n\n        // TreeSelector сам управляет своим скроллом и должен занимать всю высоту модала.\n        const resolvedHeight = isTreeSelectorChild(children) ? 'full-screen' : height;\n\n        const { onEntering, onEntered, onExit, onExited, isHiddenForBreakpoint } = useModalTransition({\n            visible,\n            isServerEnv,\n            showOverlay,\n            returnFocusOnClose,\n            onAppear,\n            onBeforeExit,\n            onAfterExit,\n            modalRef,\n            animationTimeoutExit: animationTimeout.exit,\n        });\n\n        usePageHeaderScrollAnimation({\n            overlayRef,\n            showOverlay,\n            pageHeaderPadding,\n            visible: visible && !isHiddenForBreakpoint,\n        });\n\n        const overlayEventHandlers = useNoBubbling({\n            onKeyDown: (event) => {\n                if (keyboardMatch(event.nativeEvent as KeyboardEvent, keyboardKeys.Escape)) {\n                    onClose(event);\n                }\n            },\n            onMouseDown: (event) => {\n                if (closeByClickOutside && !modalRef.current?.contains(event.target as HTMLElement)) {\n                    onClose(event);\n                }\n            },\n        });\n        const overlayProps = showOverlay\n            ? overlayEventHandlers\n            : {\n                  onKeyDown: (event: React.KeyboardEvent) => {\n                      if (keyboardMatch(event.nativeEvent, keyboardKeys.Escape)) {\n                          onClose(event);\n                      }\n                  },\n              };\n\n        if (isHiddenForBreakpoint || isServerEnv) {\n            return null;\n        }\n\n        return createPortal(\n            <CSSTransition\n                appear\n                in={visible && !isServerEnv}\n                nodeRef={overlayRef}\n                onEntering={onEntering}\n                onEntered={onEntered}\n                onExit={onExit}\n                onExited={onExited}\n                classNames={CSS_CLASSES[position]}\n                timeout={animationTimeout}\n                unmountOnExit\n            >\n                <ThemeWrapper>\n                    {(themeClass) => (\n                        <Layer layer=\"modal\">\n                            <div\n                                {...overlayProps}\n                                ref={overlayRef}\n                                className={classnames(styles.modalOverlay, themeClass, {\n                                    [styles.modalOverlayWithBackground]: showOverlay,\n                                    [styles.modalOverlayLeft]: position === 'left',\n                                    [styles.modalOverlayRight]: position === 'right',\n                                })}\n                                data-qa=\"modal-overlay\"\n                            >\n                                <CloseByClickOutsideContext.Provider value={overlayRef}>\n                                    <AccessibleRegionProvider>\n                                        <ModalSlotsProvider>\n                                            <ModalInner\n                                                {...rest}\n                                                explicitAria={{\n                                                    'aria-label': ariaLabel,\n                                                    'aria-labelledby': ariaLabelledby,\n                                                    'aria-describedby': ariaDescribedby,\n                                                    'aria-description': ariaDescription,\n                                                }}\n                                                ariaModal={visible && showOverlay && !isServerEnv}\n                                                refCallback={modalRefCallback}\n                                                size={size}\n                                                height={resolvedHeight}\n                                                minHeight={minHeight}\n                                                disableVerticalPaddings={disableVerticalPaddings}\n                                                disableHorizontalPaddings={disableHorizontalPaddings}\n                                                showOverlay={showOverlay}\n                                                header={header}\n                                                footer={footer}\n                                            >\n                                                <ModalContent>{children}</ModalContent>\n                                            </ModalInner>\n                                        </ModalSlotsProvider>\n                                    </AccessibleRegionProvider>\n                                </CloseByClickOutsideContext.Provider>\n                            </div>\n                        </Layer>\n                    )}\n                </ThemeWrapper>\n            </CSSTransition>,\n            host || document.body\n        );\n    }\n) as ForwardRefExoticComponent<PropsWithoutRef<ModalRootProps> & RefAttributes<HTMLDivElement>> & ModalCompound;\n\nModal.displayName = 'Modal';\nModal.Media = ModalMedia;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Modal.js","sources":["src/public/Modal.tsx"],"sourcesContent":["import {\n    forwardRef,\n    type HTMLAttributes,\n    useRef,\n    useState,\n    type ForwardRefExoticComponent,\n    type PropsWithoutRef,\n    type RefAttributes,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { CSSTransition } from 'react-transition-group';\nimport classnames from 'classnames';\n\nimport { useServerEnv } from '@hh.ru/magritte-common-is-server-env';\nimport { keyboardMatch, keyboardKeys, useKeyboardNavigation } from '@hh.ru/magritte-common-keyboard';\nimport { CloseByClickOutsideContext } from '@hh.ru/magritte-common-mouse/useCloseByClickOutside';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { useNoBubbling } from '@hh.ru/magritte-common-use-no-bubbling';\nimport { AccessibleRegionProvider, type ExplicitRegionProps } from '@hh.ru/magritte-internal-accessible-region';\nimport { Layer } from '@hh.ru/magritte-ui-layer';\nimport { ModalContent } from '@hh.ru/magritte-ui-modal/internal/ModalContent';\nimport { ModalInner } from '@hh.ru/magritte-ui-modal/internal/ModalInner';\nimport { ModalSlotsProvider } from '@hh.ru/magritte-ui-modal/internal/ModalSlotsContext';\nimport {\n    CSS_CLASSES,\n    DEFAULT_PAGE_HEADER_PADDING,\n    getAnimationTimeout,\n    noop,\n} from '@hh.ru/magritte-ui-modal/internal/constants';\nimport { isTreeSelectorChild } from '@hh.ru/magritte-ui-modal/internal/isTreeSelectorChild';\nimport { useHeightOnShow } from '@hh.ru/magritte-ui-modal/internal/useHeightOnShow';\nimport { useModalTransition } from '@hh.ru/magritte-ui-modal/internal/useModalTransition';\nimport { usePageHeaderScrollAnimation } from '@hh.ru/magritte-ui-modal/internal/usePageHeaderScrollAnimation';\nimport { ModalMedia, type ModalMediaProps } from '@hh.ru/magritte-ui-modal/public/ModalMedia';\nimport { type ModalProps } from '@hh.ru/magritte-ui-modal/public/types';\nimport { ThemeWrapper } from '@hh.ru/magritte-ui-theme-wrapper';\n\nimport styles from '../internal/modal.less';\n\ntype ModalRootProps = ModalProps &\n    ExplicitRegionProps &\n    Omit<HTMLAttributes<HTMLDivElement>, keyof ModalProps | 'role' | 'tabIndex' | 'className'>;\n\ninterface ModalCompound {\n    Media: ForwardRefExoticComponent<ModalMediaProps & RefAttributes<HTMLDivElement>>;\n}\n\nexport const Modal = forwardRef<HTMLDivElement, ModalRootProps>(\n    (\n        {\n            visible,\n            size = 'medium',\n            header,\n            footer,\n            children,\n            onClose = noop,\n            host,\n            disableVerticalPaddings = false,\n            disableHorizontalPaddings = false,\n            closeByClickOutside = true,\n            onAppear,\n            onBeforeExit,\n            onAfterExit,\n            position = 'center',\n            height = position === 'center' ? 'content' : 'full-screen',\n            minHeight,\n            showOverlay: _showOverlay = true,\n            pageHeaderPadding = DEFAULT_PAGE_HEADER_PADDING,\n            returnFocusOnClose,\n            'aria-label': ariaLabel,\n            'aria-labelledby': ariaLabelledby,\n            'aria-describedby': ariaDescribedby,\n            'aria-description': ariaDescription,\n            ...rest\n        },\n        ref\n    ) => {\n        const isServerEnv = useServerEnv();\n        const [animationTimeout] = useState(getAnimationTimeout);\n\n        const modalRef = useRef<HTMLDivElement>(null);\n        const overlayRef = useRef<HTMLDivElement>(null);\n        const keyboardNavigationRef = useKeyboardNavigation({ enabled: visible && !isServerEnv, mode: 'loop' });\n        const modalRefCallback = useMultipleRefs(ref, modalRef, keyboardNavigationRef);\n\n        const showOverlay = position === 'center' || _showOverlay;\n\n        // TreeSelector сам управляет своим скроллом и должен занимать всю высоту модала.\n        const resolvedHeight = isTreeSelectorChild(children) ? 'full-screen' : height;\n\n        const { onEntering, onEntered, onExit, onExited, isHiddenForBreakpoint } = useModalTransition({\n            visible,\n            isServerEnv,\n            showOverlay,\n            returnFocusOnClose,\n            onAppear,\n            onBeforeExit,\n            onAfterExit,\n            modalRef,\n            animationTimeoutExit: animationTimeout.exit,\n        });\n\n        const heightOnShow = useHeightOnShow({\n            enabled: resolvedHeight === 'content-on-show',\n            shown: !!visible && !isHiddenForBreakpoint && !isServerEnv,\n            modalRef,\n        });\n\n        usePageHeaderScrollAnimation({\n            overlayRef,\n            showOverlay,\n            pageHeaderPadding,\n            visible: visible && !isHiddenForBreakpoint,\n        });\n\n        const overlayEventHandlers = useNoBubbling({\n            onKeyDown: (event) => {\n                if (keyboardMatch(event.nativeEvent as KeyboardEvent, keyboardKeys.Escape)) {\n                    onClose(event);\n                }\n            },\n            onMouseDown: (event) => {\n                if (closeByClickOutside && !modalRef.current?.contains(event.target as HTMLElement)) {\n                    onClose(event);\n                }\n            },\n        });\n        const overlayProps = showOverlay\n            ? overlayEventHandlers\n            : {\n                  onKeyDown: (event: React.KeyboardEvent) => {\n                      if (keyboardMatch(event.nativeEvent, keyboardKeys.Escape)) {\n                          onClose(event);\n                      }\n                  },\n              };\n\n        if (isHiddenForBreakpoint || isServerEnv) {\n            return null;\n        }\n\n        return createPortal(\n            <CSSTransition\n                appear\n                in={visible && !isServerEnv}\n                nodeRef={overlayRef}\n                onEntering={onEntering}\n                onEntered={onEntered}\n                onExit={onExit}\n                onExited={onExited}\n                classNames={CSS_CLASSES[position]}\n                timeout={animationTimeout}\n                unmountOnExit\n            >\n                <ThemeWrapper>\n                    {(themeClass) => (\n                        <Layer layer=\"modal\">\n                            <div\n                                {...overlayProps}\n                                ref={overlayRef}\n                                className={classnames(styles.modalOverlay, themeClass, {\n                                    [styles.modalOverlayWithBackground]: showOverlay,\n                                    [styles.modalOverlayLeft]: position === 'left',\n                                    [styles.modalOverlayRight]: position === 'right',\n                                })}\n                                data-qa=\"modal-overlay\"\n                            >\n                                <CloseByClickOutsideContext.Provider value={overlayRef}>\n                                    <AccessibleRegionProvider>\n                                        <ModalSlotsProvider>\n                                            <ModalInner\n                                                {...rest}\n                                                explicitAria={{\n                                                    'aria-label': ariaLabel,\n                                                    'aria-labelledby': ariaLabelledby,\n                                                    'aria-describedby': ariaDescribedby,\n                                                    'aria-description': ariaDescription,\n                                                }}\n                                                ariaModal={visible && showOverlay && !isServerEnv}\n                                                refCallback={modalRefCallback}\n                                                size={size}\n                                                height={\n                                                    resolvedHeight === 'content-on-show'\n                                                        ? (heightOnShow ?? 'content')\n                                                        : resolvedHeight\n                                                }\n                                                minHeight={minHeight}\n                                                disableVerticalPaddings={disableVerticalPaddings}\n                                                disableHorizontalPaddings={disableHorizontalPaddings}\n                                                showOverlay={showOverlay}\n                                                header={header}\n                                                footer={footer}\n                                            >\n                                                <ModalContent>{children}</ModalContent>\n                                            </ModalInner>\n                                        </ModalSlotsProvider>\n                                    </AccessibleRegionProvider>\n                                </CloseByClickOutsideContext.Provider>\n                            </div>\n                        </Layer>\n                    )}\n                </ThemeWrapper>\n            </CSSTransition>,\n            host || document.body\n        );\n    }\n) as ForwardRefExoticComponent<PropsWithoutRef<ModalRootProps> & RefAttributes<HTMLDivElement>> & ModalCompound;\n\nModal.displayName = 'Modal';\nModal.Media = ModalMedia;\n"],"names":[],"mappings":"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"}

package/public/ModalMedia.js

@@ -2,7 +2,7 @@ import './../index.css';
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import classnames from 'classnames';
-import { s as styles } from '../modal-f3544Spk.js';
+import { s as styles } from '../modal-DPOMjFyz.js';
 
 const ModalMedia = forwardRef(
   ({ ratio, height, backgroundUrl, className, style, children, imageSize = "cover", ...rest }, ref) => {

package/public/ModalWithImage.js

@@ -21,7 +21,7 @@ import '../internal/ModalContent.js';
 import '../internal/isTreeSelectorChild.js';
 import '@hh.ru/magritte-ui-tree-selector';
 import '@hh.ru/magritte-ui-textarea';
-import '../modal-f3544Spk.js';
+import '../modal-DPOMjFyz.js';
 import '../internal/ModalInner.js';
 import '@hh.ru/magritte-ui-action-bar';
 import '../actionBarDefaults.js';
@@ -33,6 +33,7 @@ import '../internal/ModalStickyHeader.js';
 import '@hh.ru/magritte-ui-scrollbar';
 import '../internal/constants.js';
 import '@hh.ru/magritte-design-tokens/core-tokens';
+import '../internal/useHeightOnShow.js';
 import '../internal/useModalTransition.js';
 import '@hh.ru/magritte-common-modal-helper';
 import '@hh.ru/magritte-ui-breakpoint';

package/public/ModalWithImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalWithImage.js","sources":["src/public/ModalWithImage.tsx"],"sourcesContent":["import {\n    forwardRef,\n    type ForwardRefExoticComponent,\n    type HTMLAttributes,\n    type PropsWithoutRef,\n    type ReactNode,\n    type RefAttributes,\n} from 'react';\n\nimport { type ExplicitRegionProps } from '@hh.ru/magritte-internal-accessible-region';\nimport { Flex } from '@hh.ru/magritte-ui-layout';\nimport { Modal } from '@hh.ru/magritte-ui-modal/public/Modal';\nimport { ModalMedia, type ModalMediaProps } from '@hh.ru/magritte-ui-modal/public/ModalMedia';\nimport { type ModalProps } from '@hh.ru/magritte-ui-modal/public/types';\nimport {\n    MODAL_WITH_IMAGE_NAV_BAR_DEFAULTS,\n    MODAL_WITH_IMAGE_TITLE_DEFAULTS,\n} from '@hh.ru/magritte-ui-modal/withImageDefaults';\nimport { NavBarDefaultPropsContext } from '@hh.ru/magritte-ui-nav-bar';\nimport { TitleDefaultPropsContext } from '@hh.ru/magritte-ui-title';\n\nexport interface ModalWithImageProps extends ModalProps {\n    /** Изображение (медиа), располагается над контентом */\n    image?: ReactNode;\n    /** Заголовок, располагается над контентом */\n    title?: ReactNode;\n}\n\nconst NAV_BAR_DEFAULT_PROPS = MODAL_WITH_IMAGE_NAV_BAR_DEFAULTS;\n\nconst TITLE_DEFAULT_PROPS = MODAL_WITH_IMAGE_TITLE_DEFAULTS;\n\ntype ModalWithImageRootProps = ModalWithImageProps &\n    ExplicitRegionProps &\n    Omit<HTMLAttributes<HTMLDivElement>, keyof ModalWithImageProps | 'role' | 'tabIndex' | 'className'>;\n\ninterface ModalWithImageCompound {\n    Media: ForwardRefExoticComponent<ModalMediaProps & RefAttributes<HTMLDivElement>>;\n}\n\nexport const ModalWithImage = forwardRef<HTMLDivElement, ModalWithImageRootProps>(\n    ({ image, title, children, ...rest }, ref) => (\n        <NavBarDefaultPropsContext rootProps={NAV_BAR_DEFAULT_PROPS}>\n            <Modal {...rest} ref={ref}>\n                {image}\n                {(!!title || !!children) && (\n                    <Flex gap={24} direction=\"column\" my={24}>\n                        {!!title && (\n                            <div>\n                                <TitleDefaultPropsContext props={TITLE_DEFAULT_PROPS}>{title}</TitleDefaultPropsContext>\n                            </div>\n                        )}\n                        {!!children && <div>{children}</div>}\n                    </Flex>\n                )}\n            </Modal>\n        </NavBarDefaultPropsContext>\n    )\n) as ForwardRefExoticComponent<PropsWithoutRef<ModalWithImageRootProps> & RefAttributes<HTMLDivElement>> &\n    ModalWithImageCompound;\n\nModalWithImage.displayName = 'ModalWithImage';\nModalWithImage.Media = ModalMedia;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAM,qBAAwB,GAAA,iCAAA,CAAA;AAE9B,MAAM,mBAAsB,GAAA,+BAAA,CAAA;AAUrB,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC1B,CAAC,EAAE,KAAA,EAAO,KAAO,EAAA,QAAA,EAAU,GAAG,IAAK,EAAA,EAAG,GAClC,qBAAA,GAAA,CAAC,6BAA0B,SAAW,EAAA,qBAAA,EAClC,+BAAC,KAAO,EAAA,EAAA,GAAG,MAAM,GACZ,EAAA,QAAA,EAAA;AAAA,IAAA,KAAA;AAAA,IAAA,CACC,CAAC,CAAC,KAAS,IAAA,CAAC,CAAC,QAAA,qBACV,IAAA,CAAA,IAAA,EAAA,EAAK,GAAK,EAAA,EAAA,EAAI,SAAU,EAAA,QAAA,EAAS,IAAI,EACjC,EAAA,QAAA,EAAA;AAAA,MAAC,CAAA,CAAC,yBACE,GAAA,CAAA,KAAA,EAAA,EACG,8BAAC,wBAAyB,EAAA,EAAA,KAAA,EAAO,mBAAsB,EAAA,QAAA,EAAA,KAAA,EAAM,CACjE,EAAA,CAAA;AAAA,MAEH,CAAC,CAAC,QAAY,oBAAA,GAAA,CAAC,SAAK,QAAS,EAAA,CAAA;AAAA,KAClC,EAAA,CAAA;AAAA,GAAA,EAER,CACJ,EAAA,CAAA;AAER,EAAA;AAGA,cAAA,CAAe,WAAc,GAAA,gBAAA,CAAA;AAC7B,cAAA,CAAe,KAAQ,GAAA,UAAA;;;;"}
+{"version":3,"file":"ModalWithImage.js","sources":["src/public/ModalWithImage.tsx"],"sourcesContent":["import {\n    forwardRef,\n    type ForwardRefExoticComponent,\n    type HTMLAttributes,\n    type PropsWithoutRef,\n    type ReactNode,\n    type RefAttributes,\n} from 'react';\n\nimport { type ExplicitRegionProps } from '@hh.ru/magritte-internal-accessible-region';\nimport { Flex } from '@hh.ru/magritte-ui-layout';\nimport { Modal } from '@hh.ru/magritte-ui-modal/public/Modal';\nimport { ModalMedia, type ModalMediaProps } from '@hh.ru/magritte-ui-modal/public/ModalMedia';\nimport { type ModalProps } from '@hh.ru/magritte-ui-modal/public/types';\nimport {\n    MODAL_WITH_IMAGE_NAV_BAR_DEFAULTS,\n    MODAL_WITH_IMAGE_TITLE_DEFAULTS,\n} from '@hh.ru/magritte-ui-modal/withImageDefaults';\nimport { NavBarDefaultPropsContext } from '@hh.ru/magritte-ui-nav-bar';\nimport { TitleDefaultPropsContext } from '@hh.ru/magritte-ui-title';\n\nexport interface ModalWithImageProps extends ModalProps {\n    /** Изображение (медиа), располагается над контентом */\n    image?: ReactNode;\n    /** Заголовок, располагается над контентом */\n    title?: ReactNode;\n}\n\nconst NAV_BAR_DEFAULT_PROPS = MODAL_WITH_IMAGE_NAV_BAR_DEFAULTS;\n\nconst TITLE_DEFAULT_PROPS = MODAL_WITH_IMAGE_TITLE_DEFAULTS;\n\ntype ModalWithImageRootProps = ModalWithImageProps &\n    ExplicitRegionProps &\n    Omit<HTMLAttributes<HTMLDivElement>, keyof ModalWithImageProps | 'role' | 'tabIndex' | 'className'>;\n\ninterface ModalWithImageCompound {\n    Media: ForwardRefExoticComponent<ModalMediaProps & RefAttributes<HTMLDivElement>>;\n}\n\nexport const ModalWithImage = forwardRef<HTMLDivElement, ModalWithImageRootProps>(\n    ({ image, title, children, ...rest }, ref) => (\n        <NavBarDefaultPropsContext rootProps={NAV_BAR_DEFAULT_PROPS}>\n            <Modal {...rest} ref={ref}>\n                {image}\n                {(!!title || !!children) && (\n                    <Flex gap={24} direction=\"column\" my={24}>\n                        {!!title && (\n                            <div>\n                                <TitleDefaultPropsContext props={TITLE_DEFAULT_PROPS}>{title}</TitleDefaultPropsContext>\n                            </div>\n                        )}\n                        {!!children && <div>{children}</div>}\n                    </Flex>\n                )}\n            </Modal>\n        </NavBarDefaultPropsContext>\n    )\n) as ForwardRefExoticComponent<PropsWithoutRef<ModalWithImageRootProps> & RefAttributes<HTMLDivElement>> &\n    ModalWithImageCompound;\n\nModalWithImage.displayName = 'ModalWithImage';\nModalWithImage.Media = ModalMedia;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAM,qBAAwB,GAAA,iCAAA,CAAA;AAE9B,MAAM,mBAAsB,GAAA,+BAAA,CAAA;AAUrB,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC1B,CAAC,EAAE,KAAA,EAAO,KAAO,EAAA,QAAA,EAAU,GAAG,IAAK,EAAA,EAAG,GAClC,qBAAA,GAAA,CAAC,6BAA0B,SAAW,EAAA,qBAAA,EAClC,+BAAC,KAAO,EAAA,EAAA,GAAG,MAAM,GACZ,EAAA,QAAA,EAAA;AAAA,IAAA,KAAA;AAAA,IAAA,CACC,CAAC,CAAC,KAAS,IAAA,CAAC,CAAC,QAAA,qBACV,IAAA,CAAA,IAAA,EAAA,EAAK,GAAK,EAAA,EAAA,EAAI,SAAU,EAAA,QAAA,EAAS,IAAI,EACjC,EAAA,QAAA,EAAA;AAAA,MAAC,CAAA,CAAC,yBACE,GAAA,CAAA,KAAA,EAAA,EACG,8BAAC,wBAAyB,EAAA,EAAA,KAAA,EAAO,mBAAsB,EAAA,QAAA,EAAA,KAAA,EAAM,CACjE,EAAA,CAAA;AAAA,MAEH,CAAC,CAAC,QAAY,oBAAA,GAAA,CAAC,SAAK,QAAS,EAAA,CAAA;AAAA,KAClC,EAAA,CAAA;AAAA,GAAA,EAER,CACJ,EAAA,CAAA;AAER,EAAA;AAGA,cAAA,CAAe,WAAc,GAAA,gBAAA,CAAA;AAC7B,cAAA,CAAe,KAAQ,GAAA,UAAA;;;;"}

package/public/types.d.ts

@@ -1,5 +1,5 @@
 import { PropsWithChildren, ReactNode, SyntheticEvent } from 'react';
-export type ModalHeight = 'content' | 'full-screen' | number;
+export type ModalHeight = 'content' | 'content-on-show' | 'full-screen' | number;
 export interface ModalProps extends PropsWithChildren {
     /** Шапка модала (обычно `NavBar`). Рендерится sticky-хедером, прижатым к верху */
     header?: ReactNode;
@@ -25,7 +25,11 @@ export interface ModalProps extends PropsWithChildren {
     onBeforeExit?: VoidFunction;
     /** Колбек, который будет вызван после анимации закрытия */
     onAfterExit?: VoidFunction;
-    /** Высота (по контенту, во весь экран или фиксированная в пикселях) */
+    /**
+     * Высота: по контенту (`content`), по контенту на момент показа (`content-on-show` — высота фиксируется
+     * при показе и дальше не растёт, уменьшается только вслед за вьюпортом), во весь экран (`full-screen`)
+     * или фиксированная в пикселях
+     */
     height?: ModalHeight;
     /** Минимальная высота в пикселях. Имеет приоритет перед height. */
     minHeight?: number;

package/modal-f3544Spk.js

@@ -1,5 +0,0 @@
-import './index.css';
-var styles = {"sticky-header":"magritte-sticky-header___TPafy_11-1-3","stickyHeader":"magritte-sticky-header___TPafy_11-1-3","sticky-header-inner":"magritte-sticky-header-inner___u5p8h_11-1-3","stickyHeaderInner":"magritte-sticky-header-inner___u5p8h_11-1-3","modal-media":"magritte-modal-media___UqHGM_11-1-3","modalMedia":"magritte-modal-media___UqHGM_11-1-3","fixed-height":"magritte-fixed-height___wyJ7-_11-1-3","fixedHeight":"magritte-fixed-height___wyJ7-_11-1-3","contain":"magritte-contain___3QD0Z_11-1-3","cover":"magritte-cover___nry9O_11-1-3","content-overlay-top":"magritte-content-overlay-top___6snWk_11-1-3","contentOverlayTop":"magritte-content-overlay-top___6snWk_11-1-3","grow-limiter":"magritte-grow-limiter___GmpBj_11-1-3","growLimiter":"magritte-grow-limiter___GmpBj_11-1-3","modal-overlay":"magritte-modal-overlay___WwfCg_11-1-3","modalOverlay":"magritte-modal-overlay___WwfCg_11-1-3","modal-overlay-with-background":"magritte-modal-overlay-with-background___DDxJn_11-1-3","modalOverlayWithBackground":"magritte-modal-overlay-with-background___DDxJn_11-1-3","modal":"magritte-modal___C4o5U_11-1-3","modal-overlay-left":"magritte-modal-overlay-left___agPyC_11-1-3","modalOverlayLeft":"magritte-modal-overlay-left___agPyC_11-1-3","modal-overlay-right":"magritte-modal-overlay-right___-XDAx_11-1-3","modalOverlayRight":"magritte-modal-overlay-right___-XDAx_11-1-3","size-small":"magritte-size-small___cI-Ql_11-1-3","sizeSmall":"magritte-size-small___cI-Ql_11-1-3","size-medium":"magritte-size-medium___jnqfu_11-1-3","sizeMedium":"magritte-size-medium___jnqfu_11-1-3","no-vertical-paddings":"magritte-no-vertical-paddings___dxyot_11-1-3","noVerticalPaddings":"magritte-no-vertical-paddings___dxyot_11-1-3","no-horizontal-paddings":"magritte-no-horizontal-paddings___Q-i-5_11-1-3","noHorizontalPaddings":"magritte-no-horizontal-paddings___Q-i-5_11-1-3","modal-full-height":"magritte-modal-full-height___Aew5F_11-1-3","modalFullHeight":"magritte-modal-full-height___Aew5F_11-1-3","modal-with-border":"magritte-modal-with-border___KSnhf_11-1-3","modalWithBorder":"magritte-modal-with-border___KSnhf_11-1-3","modal-content-wrapper":"magritte-modal-content-wrapper___VzoTN_11-1-3","modalContentWrapper":"magritte-modal-content-wrapper___VzoTN_11-1-3","modal-footer":"magritte-modal-footer___Ha-sZ_11-1-3","modalFooter":"magritte-modal-footer___Ha-sZ_11-1-3","modal-footer-empty":"magritte-modal-footer-empty___tmH-x_11-1-3","modalFooterEmpty":"magritte-modal-footer-empty___tmH-x_11-1-3","animation-timeout":"magritte-animation-timeout___G4Hl1_11-1-3","animationTimeout":"magritte-animation-timeout___G4Hl1_11-1-3","animation-enter-center":"magritte-animation-enter-center___sq8j7_11-1-3","animationEnterCenter":"magritte-animation-enter-center___sq8j7_11-1-3","animation-enter-center-active":"magritte-animation-enter-center-active___ORYEh_11-1-3","animationEnterCenterActive":"magritte-animation-enter-center-active___ORYEh_11-1-3","animation-exit-center":"magritte-animation-exit-center___lLCX1_11-1-3","animationExitCenter":"magritte-animation-exit-center___lLCX1_11-1-3","animation-exit-center-active":"magritte-animation-exit-center-active___Ik2Yl_11-1-3","animationExitCenterActive":"magritte-animation-exit-center-active___Ik2Yl_11-1-3","animation-enter-left":"magritte-animation-enter-left___jJDlv_11-1-3","animationEnterLeft":"magritte-animation-enter-left___jJDlv_11-1-3","animation-enter-left-active":"magritte-animation-enter-left-active___-kFij_11-1-3","animationEnterLeftActive":"magritte-animation-enter-left-active___-kFij_11-1-3","animation-exit-left":"magritte-animation-exit-left___G2Plq_11-1-3","animationExitLeft":"magritte-animation-exit-left___G2Plq_11-1-3","animation-exit-left-active":"magritte-animation-exit-left-active___XW2K4_11-1-3","animationExitLeftActive":"magritte-animation-exit-left-active___XW2K4_11-1-3","animation-enter-right":"magritte-animation-enter-right___rrMS0_11-1-3","animationEnterRight":"magritte-animation-enter-right___rrMS0_11-1-3","animation-enter-right-active":"magritte-animation-enter-right-active___p7rg-_11-1-3","animationEnterRightActive":"magritte-animation-enter-right-active___p7rg-_11-1-3","animation-exit-right":"magritte-animation-exit-right___f3qIC_11-1-3","animationExitRight":"magritte-animation-exit-right___f3qIC_11-1-3","animation-exit-right-active":"magritte-animation-exit-right-active___-sG1k_11-1-3","animationExitRightActive":"magritte-animation-exit-right-active___-sG1k_11-1-3","tree-selector-container":"magritte-tree-selector-container___4cdf5_11-1-3","treeSelectorContainer":"magritte-tree-selector-container___4cdf5_11-1-3","modal-scroll-container":"magritte-modal-scroll-container___hOCdh_11-1-3","modalScrollContainer":"magritte-modal-scroll-container___hOCdh_11-1-3","nav-bar":"magritte-nav-bar___CL7d-_11-1-3","navBar":"magritte-nav-bar___CL7d-_11-1-3","header":"magritte-header___pufwA_11-1-3","static":"magritte-static___3B6cn_11-1-3","content-overlay-bottom":"magritte-content-overlay-bottom___bDuPC_11-1-3","contentOverlayBottom":"magritte-content-overlay-bottom___bDuPC_11-1-3"};
-
-export { styles as s };
-//# sourceMappingURL=modal-f3544Spk.js.map

package/modal-f3544Spk.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"modal-f3544Spk.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}