mimir-ui-kit 1.5.0 → 1.5.4

Sign up to get free protection for your applications and to get access to all the features.
@@ -1 +1 @@
1
- ._button_1hqwa_2{--button-loader-color: var(--button-color);--button-cursor: pointer;position:relative;display:inline-flex;flex-shrink:0;align-items:center;box-sizing:border-box;max-width:100%;height:var(--button-height);padding:0 var(--button-space);overflow:hidden;color:var(--button-color);font-weight:var(--font-weight-text-semibold);font-size:var(--button-font-size);font-family:var(--font-inter);line-height:var(--line-height-text-s1);white-space:nowrap;-webkit-text-decoration:none;text-decoration:none;text-overflow:ellipsis;-moz-column-gap:var(--button-gap);column-gap:var(--button-gap);background:var(--button-bg-color);border:none;border-radius:var(--control-radius);cursor:pointer;cursor:var(--button-cursor);transition:background-color .3s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease,fill .15s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none}._button_1hqwa_2:hover{color:var(--button-color-hover);background:var(--button-bg-color-hover)}._button_1hqwa_2:active{color:var(--button-color-active);background:var(--button-bg-color-active)}._button_1hqwa_2:focus{box-shadow:0 0 2px var(--sapphire-normal)}._button_1hqwa_2._clear_1hqwa_41:focus{box-shadow:none}._button_1hqwa_2 svg{color:currentcolor;fill:currentcolor}._button_1hqwa_2 svg path{color:currentcolor;fill:currentcolor}._xs_1hqwa_53{--button-height: var(--button-height-xs);--button-font-size: var(--control-text-size-xs);--button-space: var(--control-space-xs);--button-gap: 4px;--button-border-radius: var(--button-border-radius-s)}._s_1hqwa_61{--button-height: var(--button-height-s);--button-font-size: var(--control-text-size-s);--button-space: var(--control-space-s);--button-gap: 4px;--button-border-radius: var(--button-border-radius-s)}._m_1hqwa_69{--button-height: var(--button-height-m);--button-font-size: var(--control-text-size-m);--button-space: var(--control-space-m);--button-gap: 8px;--button-border-radius: var(--button-border-radius-m)}._l_1hqwa_77{--button-height: var(--button-height-l);--button-font-size: var(--control-text-size-l);--button-space: var(--control-space-l);--button-gap: 8px;--button-border-radius: var(--button-border-radius-l)}._xl_1hqwa_85{--button-height: var(--button-height-xl);--button-space: var(--control-space-l);--button-gap: 8px;--button-border-radius: var(--button-border-radius-l);font-weight:var(--font-weight-text-medium);font-size:var(--size-text-l)}._xxl_1hqwa_94{--button-height: var(--button-height-xxl);--button-space: var(--control-space-xxl);--button-border-radius: var(--button-border-radius-l);--button-gap: 8px;font-weight:var(--font-weight-text-medium);font-size:var(--size-text-l)}._default-button_1hqwa_103._primary-sapphire_1hqwa_103{--button-bg-color: var(--sapphire-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--sapphire-active);--button-bg-color-hover: var(--sapphire-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_1hqwa_103._primary-citrine_1hqwa_112{--button-bg-color: var(--citrine-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--citrine-active);--button-bg-color-hover: var(--citrine-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_1hqwa_103._secondary-asphalt_1hqwa_121{--button-bg-color: var(--asphalt-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--asphalt-active);--button-bg-color-hover: var(--asphalt-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_1hqwa_103._secondary-gray_1hqwa_130{--button-bg-color: var(--gray-normal);--button-color-hover: var(--counter-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--gray-active);--button-bg-color-hover: var(--gray-hover);--button-color: var(--dark-text);--button-border: transparent}._default-button_1hqwa_103._secondary-white_1hqwa_139{--button-bg-color: var(--white-normal);--button-color-hover: var(--counter-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--white-active);--button-bg-color-hover: var(--white-hover);--button-color: var(--dark-text);--button-border: transparent}._default-button_1hqwa_103._secondary-red_1hqwa_148{--button-bg-color: var(--red-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--red-active);--button-bg-color-hover: var(--red-hover);--button-color: var(--light-text);--button-border: transparent}._round-button_1hqwa_158{--button-border-radius-l: 24px;--button-border-radius-m: 20px;--button-border-radius-s: 16px;--button-border-radius-xs: 12px;border-radius:var(--button-border-radius)}._round-button_1hqwa_158._black_1hqwa_165{--button-bg-color: var(--asphalt-normal);--button-bg-color-hover: var(--asphalt-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--light-text);--button-color-hover: var(--light-text);--button-color-active: var(--light-text)}._round-button_1hqwa_158._gray_1hqwa_174{--button-bg-color: var(--gray-normal);--button-bg-color-hover: var(--gray-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--asphalt-normal);--button-color-hover: var(--asphalt-hover);--button-color-active: var(--light-text)}._round-button_1hqwa_158._white_1hqwa_183{--button-bg-color: var(--white-normal);--button-bg-color-hover: var(--white-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--asphalt-normal);--button-color-hover: var(--asphalt-hover);--button-color-active: var(--light-text)}._full_1hqwa_193{display:block;width:100%}._disabled_1hqwa_198{--button-cursor: not-allowed;color:var(--light-text);background-color:var(--disabled)}._disabled_1hqwa_198:hover,._disabled_1hqwa_198:active,._disabled_1hqwa_198:focus{color:var(--light-text);background-color:var(--disabled);box-shadow:none}._icon-button_1hqwa_209{justify-content:center;min-width:var(--button-height);padding:0}
1
+ ._button_6nidf_2{--button-loader-color: var(--button-color);--button-cursor: pointer;position:relative;display:inline-flex;flex-shrink:0;align-items:center;box-sizing:border-box;max-width:100%;height:var(--button-height);padding:0 var(--button-space);overflow:hidden;color:var(--button-color);font-weight:var(--font-weight-text-semibold);font-size:var(--button-font-size);font-family:var(--font-inter);line-height:var(--line-height-text-s1);white-space:nowrap;text-transform:uppercase;-webkit-text-decoration:none;text-decoration:none;text-overflow:ellipsis;-moz-column-gap:var(--button-gap);column-gap:var(--button-gap);background:var(--button-bg-color);border:none;border-radius:var(--control-radius);cursor:pointer;cursor:var(--button-cursor);transition:background-color .3s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease,fill .15s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none}._button_6nidf_2:hover{color:var(--button-color-hover);background:var(--button-bg-color-hover)}._button_6nidf_2:active{color:var(--button-color-active);background:var(--button-bg-color-active)}._button_6nidf_2:focus{box-shadow:0 0 2px var(--sapphire-normal)}._button_6nidf_2._clear_6nidf_42:focus{box-shadow:none}._button_6nidf_2 svg{color:currentcolor;fill:currentcolor}._button_6nidf_2 svg path{color:currentcolor;fill:currentcolor}._xs_6nidf_54{--button-height: var(--button-height-xs);--button-font-size: var(--control-text-size-xs);--button-space: var(--control-space-xs);--button-gap: 4px;--button-border-radius: var(--button-border-radius-s)}._s_6nidf_62{--button-height: var(--button-height-s);--button-font-size: var(--control-text-size-s);--button-space: var(--control-space-s);--button-gap: 4px;--button-border-radius: var(--button-border-radius-s)}._m_6nidf_70{--button-height: var(--button-height-m);--button-font-size: var(--size-text-m);--button-space: var(--control-space-m);--button-gap: 8px;--button-border-radius: var(--button-border-radius-m)}._l_6nidf_78{--button-height: var(--button-height-l);--button-font-size: var(--size-text-m);--button-space: var(--control-space-l);--button-gap: 8px;--button-border-radius: var(--button-border-radius-l)}._xl_6nidf_86{--button-height: var(--button-height-xl);--button-space: var(--control-space-l);--button-gap: 8px;--button-border-radius: var(--button-border-radius-l);--button-font-size: var(--size-text-m);font-weight:var(--font-weight-text-medium)}._xxl_6nidf_95{--button-height: var(--button-height-xxl);--button-space: var(--control-space-xxl);--button-border-radius: var(--button-border-radius-l);--button-gap: 8px;font-weight:var(--font-weight-text-medium);--button-font-size: var(--size-text-m)}._default-button_6nidf_104._primary-sapphire_6nidf_104{--button-bg-color: var(--sapphire-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--sapphire-active);--button-bg-color-hover: var(--sapphire-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_6nidf_104._primary-citrine_6nidf_113{--button-bg-color: var(--citrine-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--citrine-active);--button-bg-color-hover: var(--citrine-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_6nidf_104._secondary-asphalt_6nidf_122{--button-bg-color: var(--asphalt-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--asphalt-active);--button-bg-color-hover: var(--asphalt-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_6nidf_104._secondary-gray_6nidf_131{--button-bg-color: var(--gray-normal);--button-color-hover: var(--counter-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--gray-active);--button-bg-color-hover: var(--gray-hover);--button-color: var(--dark-text);--button-border: transparent}._default-button_6nidf_104._secondary-white_6nidf_140{--button-bg-color: var(--white-normal);--button-color-hover: var(--counter-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--white-active);--button-bg-color-hover: var(--white);--button-color: var(--dark-text);--button-border: transparent}._default-button_6nidf_104._secondary-red_6nidf_149{--button-bg-color: var(--red-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--red-active);--button-bg-color-hover: var(--red-hover);--button-color: var(--light-text);--button-border: transparent}._round-button_6nidf_159{--button-border-radius-l: 24px;--button-border-radius-m: 20px;--button-border-radius-s: 16px;--button-border-radius-xs: 12px;border-radius:var(--button-border-radius)}._round-button_6nidf_159._black_6nidf_166{--button-bg-color: var(--asphalt-normal);--button-bg-color-hover: var(--asphalt-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--light-text);--button-color-hover: var(--light-text);--button-color-active: var(--light-text)}._round-button_6nidf_159._gray_6nidf_175{--button-bg-color: var(--gray-normal);--button-bg-color-hover: var(--gray-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--asphalt-normal);--button-color-hover: var(--asphalt-hover);--button-color-active: var(--light-text)}._round-button_6nidf_159._white_6nidf_184{--button-bg-color: var(--white-normal);--button-bg-color-hover: var(--white-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--asphalt-normal);--button-color-hover: var(--asphalt-hover);--button-color-active: var(--light-text)}._full_6nidf_194{display:flex;justify-content:center;width:100%}._disabled_6nidf_200{--button-cursor: not-allowed;color:var(--light-text);background-color:var(--disabled)}._disabled_6nidf_200:hover,._disabled_6nidf_200:active,._disabled_6nidf_200:focus{color:var(--light-text);background-color:var(--disabled);box-shadow:none}._icon-button_6nidf_211{justify-content:center;min-width:var(--button-height);padding:0}
@@ -0,0 +1 @@
1
+ ._drawer_vy4rv_3{--drawer-width: 808px;--drawer-z-index: 1000;position:fixed;z-index:1000;z-index:var(--drawer-z-index);display:flex;flex-direction:column;width:808px;width:var(--drawer-width);height:100%;overflow:auto;background-color:var(--black-5);transition:all .3s ease;pointer-events:none}._drawer_vy4rv_3 ._content_vy4rv_17{position:relative;z-index:var(--modal-z-index);display:flex;flex:1;flex-direction:column;padding:var(--space-m) var(--space-4xl) var(--space-4xl);transition:all .3s ease}@media (max-width: 600px){._drawer_vy4rv_3 ._content_vy4rv_17{--drawer-width: 100%;padding:var(--space-m)}}._drawer_vy4rv_3 ._header_vy4rv_32{display:flex;gap:var(--space-xs);height:68px}._drawer_vy4rv_3 ._header_vy4rv_32:not(:last-child){margin-bottom:var(--space-2xl)}._drawer_vy4rv_3 ._header_vy4rv_32 ._title_vy4rv_40{flex:1;align-self:flex-end;font-weight:var(--font-weight-text-medium);font-size:var(--size-text-xl3);line-height:var(--line-height-text-s1);letter-spacing:.7px}@media (max-width: 600px){._drawer_vy4rv_3 ._header_vy4rv_32 ._title_vy4rv_40{font-size:var(--size-text-xl2);line-height:var(--line-height-text-xs)}}._drawer_vy4rv_3 ._header_vy4rv_32 ._space_vy4rv_54{flex:0 0 var(--button-height-m)}@media (max-width: 600px){._drawer_vy4rv_3 ._header_vy4rv_32{height:55px}._drawer_vy4rv_3 ._header_vy4rv_32:not(:last-child){margin-bottom:var(--space-m)}}._drawer_vy4rv_3 ._inner_vy4rv_65{flex:1}._drawer_vy4rv_3 ._button_vy4rv_68{position:absolute;top:var(--space-m);right:var(--space-m)}._drawer_vy4rv_3 ._footer_vy4rv_73{display:block;padding-top:var(--space-4xl)}@media (max-width: 600px){._drawer_vy4rv_3 ._footer_vy4rv_73{padding-top:var(--space-m)}}._drawer_vy4rv_3 ._footer-button_vy4rv_82{display:block;margin-left:auto}._drawer_vy4rv_3._left_vy4rv_86{top:0;left:-100%}._drawer_vy4rv_3._right_vy4rv_90{top:0;right:-100%}._drawer_vy4rv_3._bottom_vy4rv_94{right:50%;bottom:-100%;left:50%;max-height:80vh;border-top-left-radius:var(--control-radius);border-top-right-radius:var(--control-radius);transform:translate(-50%)}._drawer_vy4rv_3._opened_vy4rv_103{transition:all .3s ease;pointer-events:auto}._drawer_vy4rv_3._opened_vy4rv_103._left_vy4rv_86{left:0%;transition:left .3s ease}._drawer_vy4rv_3._opened_vy4rv_103._right_vy4rv_90{right:0%;transition:right .3s ease}._drawer_vy4rv_3._opened_vy4rv_103._bottom_vy4rv_94{bottom:0%}._drawer_vy4rv_3._is-closing_vy4rv_118._left_vy4rv_86{left:-100%}._drawer_vy4rv_3._is-closing_vy4rv_118._right_vy4rv_90{right:-100%}._drawer_vy4rv_3._is-closing_vy4rv_118._bottom_vy4rv_94{bottom:-100%}@media (max-width: 1440px){._drawer_vy4rv_3{--drawer-width: 608px}}@media (max-width: 1280px){._drawer_vy4rv_3{--drawer-width: 648px}}@media (max-width: 768px){._drawer_vy4rv_3{--drawer-width: 584px}}@media (max-width: 600px){._drawer_vy4rv_3{--drawer-width: 100%}._drawer_vy4rv_3._bottom_vy4rv_94{max-width:359px}}._overlay_vy4rv_151{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;opacity:0;transition:all .3s ease}._overlay_vy4rv_151._opened_vy4rv_103{opacity:1;transition:all .3s ease}._overlay_vy4rv_151._is-closing_vy4rv_118{opacity:0;transition:all .3s ease}
@@ -1 +1 @@
1
- @font-face{font-weight:400;font-family:Montserrat;font-style:normal;src:url(./fonts/585d10920d676fcd.woff2) format("woff2"),url(./fonts/3b9f59412b17ff93.woff) format("woff")}@font-face{font-weight:700;font-family:Montserrat;font-style:normal;src:url(./fonts/f4d681a788c6d497.woff2) format("woff2"),url(./fonts/43b748f250df0f08.woff) format("woff")}@font-face{font-weight:300;font-family:Montserrat;font-style:normal;src:url(./fonts/ee3db32f0aadef5d.woff2) format("woff2"),url(./fonts/1a738bfdbc1e4d9d.woff) format("woff")}@font-face{font-weight:500;font-family:Montserrat;font-style:normal;src:url(./fonts/e51d2feb30084bc2.woff2) format("woff2"),url(./fonts/badaa6d1837432de.woff) format("woff")}@font-face{font-weight:600;font-family:Montserrat;font-style:normal;src:url(./fonts/63611593e008a77c.woff2) format("woff2"),url(./fonts/3cdd7fabbe89d2b9.woff) format("woff")}@font-face{font-weight:400;font-family:Inter;font-style:normal;src:url(./fonts/d080ae18fd04e52c.woff2) format("woff2");font-variant-numeric:slashed-zero}@font-face{font-weight:700;font-family:Inter;font-style:normal;src:url(./fonts/11d5bc9f0cad36d1.woff2) format("woff2");font-variant-numeric:slashed-zero}@font-face{font-weight:500;font-family:Inter;font-style:normal;src:url(./fonts/242d04bef81519ae.woff2) format("woff2");font-variant-numeric:slashed-zero}@font-face{font-weight:600;font-family:Inter;font-style:normal;src:url(./fonts/cac2ba46e8c8adc9.woff2) format("woff2");font-variant-numeric:slashed-zero}@supports (font-variation-settings: normal){:root{font-family:InterVariable,sans-serif}}:root{font-feature-settings:"zero"}*{margin:0;padding:0;border:0;outline:none}*,:after,:before{box-sizing:border-box}:active,:focus{outline:0}a,a:visited,a:hover{-webkit-text-decoration:none;text-decoration:none}a:active,a:focus{outline:0}aside,footer,header,nav{display:block}body,html{width:100%;height:100%;font-size:100%;line-height:1}button,input,textarea,select{font-family:inherit}input::-ms-clear{display:none}button{background-color:transparent;cursor:pointer}button::-moz-focus-inner{padding:0;border:0}ul li{list-style:none}img{vertical-align:top}h1,h2,h3,h4,h5,h6{font-weight:inherit;font-size:inherit}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:var(--color-typo-brand);-webkit-transition:background-color 5000s ease-in-out 0s;transition:background-color 5000s ease-in-out 0s}:root{--sapphire-100: #2355d7;--sapphire-90: #3564df;--sapphire-80: #4b75e2;--sapphire-70: #6186e6;--sapphire-60: #7797e9;--sapphire-50: #8da7ed;--sapphire-40: #9fb7f4;--sapphire-30: #b9caf4;--sapphire-20: #cfdaf7;--sapphire-10: #e5ebfb;--citrine-100: #ff7900;--citrine-90: #ff861a;--citrine-80: #ff9433;--citrine-70: #ffa14d;--citrine-60: #ffaf66;--citrine-50: #ffbc80;--citrine-40: #ffc999;--citrine-30: #ffd7b2;--citrine-20: #ffe4cc;--citrine-10: #fff2e5;--magenta-100: #bc2251;--magenta-90: #d8275d;--magenta-80: #dc3d6d;--magenta-70: #e15781;--magenta-60: #e46c91;--magenta-50: #e986a4;--magenta-40: #ed9cb4;--magenta-30: #f2b6c8;--magenta-20: #f6cbd8;--magenta-10: #fae5ec;--black-100: #000;--black-95: #0d0d0d;--black-90: #1a1a1a;--black-85: #262626;--black-80: #333;--black-75: #404040;--black-70: #4d4d4d;--black-65: #595959;--black-60: #666;--black-55: #737373;--black-50: #808080;--black-45: #8c8c8c;--black-40: #999;--black-35: #a6a6a6;--black-30: #b3b3b3;--black-25: #bfbfbf;--black-20: #ccc;--black-15: #d9d9d9;--black-10: #e6e6e6;--black-5: #f2f2f2;--white: #fff;--dark-blue: #0a38af;--blue-40: #a7bbef;--blue-20: #d3ddf7;--green: #1b770c;--red-tag: #f01406;--success-normal: #23b413;--success-bg-hover: #d5fbe2;--success-bg-active: #ebfdf1;--alarm-normal: #fdc023;--alarm-bg-hover: #fff0c7;--alarm-bg-active: #fff6de;--error-normal: #e64646;--error-bg-hover: #fadbdb;--error-bg-active: #fbe3e3;--disabled: #b3b3b3;--disabled-color: #b2b2b2;--light-text: var(--white);--dark-text: var(--black-100);--sapphire-normal: var(--sapphire-100);--sapphire-hover: #1b41a3;--sapphire-active: #122c70;--citrine-normal: var(--citrine-100);--citrine-hover: #e56d00;--citrine-active: #cc6100;--asphalt-border: var(--black-30);--asphalt-normal: var(--black-80);--asphalt-hover: var(--black-90);--asphalt-active: var(--black-100);--gray-normal: var(--black-5);--gray-hover: var(--black-10);--gray-active: var(--black-80);--white-normal: var(--white);--white-hover: var(--black-5);--white-transparent: rgba(255, 255, 255, .4);--white-active: var(--black-80);--red-normal: var(--error-normal);--red-hover: #e33030;--red-active: #dc1e1e;--green-normal: var(--green);--green-hover: #16610a;--green-active: #114a08;--counter-text: #ffa066;--button-height-xs: 24px;--button-height-s: 32px;--button-height-m: 40px;--button-height-l: 48px;--button-height-xl: 56px;--button-height-xxl: 64px;--select-search-height-l: 48px;--select-search-height-xxl: 64px;--select-search-options-height-desktop: 320px;--select-search-options-height-mobile: 264px;--control-default: var(--sapphire-20);--control-hover: var(--sapphire-40);--control-selected: var(--sapphire-100);--control-disabled: var(--black-10);--font-inter: "Inter", sans-serif;--font-montserrat: "Montserrat", sans-serif;--font-weight-text-regular: 400;--font-weight-text-medium: 500;--font-weight-text-semibold: 600;--font-weight-text-bold: 700;--font-weight-text-extrabold: 800;--font-weight-text-black: 900;--size-text-xs2: 8px;--size-text-xs: 10px;--size-text-s: 12px;--size-text-m: 14px;--size-text-l: 16px;--size-text-xl: 20px;--size-text-xl2: 24px;--size-text-2xl: 28px;--size-text-xl3: 32px;--size-text-xl4: 48px;--size-text-xl5: 72px;--size-text-xl6: 96px;--line-height-text-2xs: 1em;--line-height-text-xs: 1.1em;--line-height-text-s: 1.2em;--line-height-text-s1: 1.25em;--line-height-text-m: 1.3em;--line-height-text-m1: 1.35em;--line-height-text-l: 1.4em;--line-height-text-l1: 1.45em;--line-height-text-xl: 1.5em;--line-height-text-xl1: 1.5em;--control-radius-s: 4px;--control-radius: 6px;--control-radius-xs: 8px;--control-radius-m: 20px;--control-radius-l: 24px;--control-input-radius: 12px;--control-border-width: 1px;--control-height-xl: 60px;--control-height-xxl: 60px;--control-height-l: var(--space-4xl);--control-height-m: var(--space-3xl);--control-height-s: var(--space-2xl);--control-height-xs: var(--space-xl);--control-box-size-s: var(--space-s);--control-box-size-m: var(--space-m);--control-box-size-l: var(--space-l);--control-space-xxl: var(--space-xl);--control-space-l: var(--space-xl);--control-space-m: var(--space-l);--control-space-s: var(--space-m);--control-space-xs: var(--space-s);--control-text-size-2xl: var(--size-text-xl);--control-text-size-xl: var(--size-text-xl3);--control-text-size-l: var(--size-text-l);--control-text-size-m: var(--size-text-m);--control-text-size-s: var(--size-text-s);--control-text-size-xs: var(--size-text-xs);--space-3xs: 2px;--space-2xs: 4px;--space-1xs: 6px;--space-xs: 8px;--space-xss: 10px;--space-s: 12px;--space-2s: 14px;--space-m: 16px;--space-2m: 18px;--space-l: 20px;--space-2l: 22px;--space-xl: 24px;--space-2xl: 32px;--space-xxl: 40px;--space-3xl: 44px;--space-4xl: 48px;--space-4xxl: 64px;--space-5xl: 72px;--space-6xl: 96px;--box-shadow-active: 0 0 2px var(--sapphire-normal);--box-shadow-focus: 0px 0px 10px 2px #1389cc;--box-shadow-select-search: 0 3px 15px 0 rgba(31, 32, 35, .15);--select-search-input-top-l: -15%;--select-search-input-top-xxl: -35%}@supports (font-variation-settings: normal){:root{font-family:Inter,sans-serif}}:root{font-feature-settings:"zero";font-variant-numeric:slashed-zero}body{font-family:Inter,sans-serif;font-feature-settings:"zero";font-variant-numeric:slashed-zero;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
1
+ @font-face{font-weight:400;font-family:Montserrat;font-style:normal;src:url(./fonts/585d10920d676fcd.woff2) format("woff2"),url(./fonts/3b9f59412b17ff93.woff) format("woff")}@font-face{font-weight:700;font-family:Montserrat;font-style:normal;src:url(./fonts/f4d681a788c6d497.woff2) format("woff2"),url(./fonts/43b748f250df0f08.woff) format("woff")}@font-face{font-weight:300;font-family:Montserrat;font-style:normal;src:url(./fonts/ee3db32f0aadef5d.woff2) format("woff2"),url(./fonts/1a738bfdbc1e4d9d.woff) format("woff")}@font-face{font-weight:500;font-family:Montserrat;font-style:normal;src:url(./fonts/e51d2feb30084bc2.woff2) format("woff2"),url(./fonts/badaa6d1837432de.woff) format("woff")}@font-face{font-weight:600;font-family:Montserrat;font-style:normal;src:url(./fonts/63611593e008a77c.woff2) format("woff2"),url(./fonts/3cdd7fabbe89d2b9.woff) format("woff")}@font-face{font-weight:400;font-family:Inter;font-style:normal;src:url(./fonts/d080ae18fd04e52c.woff2) format("woff2");font-variant-numeric:slashed-zero}@font-face{font-weight:700;font-family:Inter;font-style:normal;src:url(./fonts/11d5bc9f0cad36d1.woff2) format("woff2");font-variant-numeric:slashed-zero}@font-face{font-weight:500;font-family:Inter;font-style:normal;src:url(./fonts/242d04bef81519ae.woff2) format("woff2");font-variant-numeric:slashed-zero}@font-face{font-weight:600;font-family:Inter;font-style:normal;src:url(./fonts/cac2ba46e8c8adc9.woff2) format("woff2");font-variant-numeric:slashed-zero}@supports (font-variation-settings: normal){:root{font-family:InterVariable,sans-serif}}:root{font-feature-settings:"zero"}*{margin:0;padding:0;border:0;outline:none}*,:after,:before{box-sizing:border-box}:active,:focus{outline:0}a,a:visited,a:hover{-webkit-text-decoration:none;text-decoration:none}a:active,a:focus{outline:0}aside,footer,header,nav{display:block}body,html{width:100%;height:100%;font-size:100%;line-height:1}button,input,textarea,select{font-family:inherit}input::-ms-clear{display:none}button{background-color:transparent;cursor:pointer}button::-moz-focus-inner{padding:0;border:0}ul li{list-style:none}img{vertical-align:top}h1,h2,h3,h4,h5,h6{font-weight:inherit;font-size:inherit}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:var(--color-typo-brand);-webkit-transition:background-color 5000s ease-in-out 0s;transition:background-color 5000s ease-in-out 0s}:root{--sapphire-100: #2355d7;--sapphire-90: #3564df;--sapphire-80: #4b75e2;--sapphire-70: #6186e6;--sapphire-60: #7797e9;--sapphire-50: #8da7ed;--sapphire-40: #9fb7f4;--sapphire-30: #b9caf4;--sapphire-20: #cfdaf7;--sapphire-10: #e5ebfb;--citrine-100: #ff7900;--citrine-90: #ff861a;--citrine-80: #ff9433;--citrine-70: #ffa14d;--citrine-60: #ffaf66;--citrine-50: #ffbc80;--citrine-40: #ffc999;--citrine-30: #ffd7b2;--citrine-20: #ffe4cc;--citrine-10: #fff2e5;--magenta-100: #bc2251;--magenta-90: #d8275d;--magenta-80: #dc3d6d;--magenta-70: #e15781;--magenta-60: #e46c91;--magenta-50: #e986a4;--magenta-40: #ed9cb4;--magenta-30: #f2b6c8;--magenta-20: #f6cbd8;--magenta-10: #fae5ec;--black-100: #000;--black-95: #0d0d0d;--black-90: #1a1a1a;--black-85: #262626;--black-80: #333;--black-75: #404040;--black-70: #4d4d4d;--black-65: #595959;--black-60: #666;--black-55: #737373;--black-50: #808080;--black-45: #8c8c8c;--black-40: #999;--black-35: #a6a6a6;--black-30: #b3b3b3;--black-25: #bfbfbf;--black-20: #ccc;--black-15: #d9d9d9;--black-10: #e6e6e6;--black-5: #f2f2f2;--white: #fff;--dark-blue: #0a38af;--blue-40: #a7bbef;--blue-20: #d3ddf7;--green: #1b770c;--red-tag: #f01406;--success-normal: #23b413;--success-bg-hover: #d5fbe2;--success-bg-active: #ebfdf1;--alarm-normal: #fdc023;--alarm-bg-hover: #fff0c7;--alarm-bg-active: #fff6de;--error-normal: #e64646;--error-bg-hover: #fadbdb;--error-bg-active: #fbe3e3;--disabled: #b3b3b3;--disabled-color: #b2b2b2;--light-text: var(--white);--dark-text: var(--black-100);--sapphire-normal: var(--sapphire-100);--sapphire-hover: #1b41a3;--sapphire-active: #122c70;--citrine-normal: var(--citrine-100);--citrine-hover: #e56d00;--citrine-active: #cc6100;--asphalt-border: var(--black-30);--asphalt-normal: var(--black-80);--asphalt-hover: var(--black-90);--asphalt-active: var(--black-100);--gray-normal: var(--black-5);--gray-hover: var(--black-10);--gray-active: var(--black-80);--white-normal: var(--white);--white-hover: var(--black-5);--white-transparent: rgba(255, 255, 255, .4);--white-active: var(--black-80);--red-normal: var(--error-normal);--red-hover: #e33030;--red-active: #dc1e1e;--green-normal: var(--green);--green-hover: #16610a;--green-active: #114a08;--counter-text: #ffa066;--button-height-xs: 24px;--button-height-s: 32px;--button-height-m: 40px;--button-height-l: 48px;--button-height-xl: 56px;--button-height-xxl: 64px;--select-search-height-l: 48px;--select-search-height-xxl: 64px;--select-search-options-height-desktop: 320px;--select-search-options-height-mobile: 264px;--control-default: var(--sapphire-20);--control-hover: var(--sapphire-40);--control-selected: var(--sapphire-100);--control-disabled: var(--black-10);--font-inter: "Inter", sans-serif;--font-montserrat: "Montserrat", sans-serif;--font-weight-text-regular: 400;--font-weight-text-medium: 500;--font-weight-text-semibold: 600;--font-weight-text-bold: 700;--font-weight-text-extrabold: 800;--font-weight-text-black: 900;--size-text-xs2: 8px;--size-text-xs: 10px;--size-text-s: 12px;--size-text-m: 14px;--size-text-l: 16px;--size-text-xl: 20px;--size-text-xl2: 24px;--size-text-2xl: 28px;--size-text-xl3: 32px;--size-text-xl4: 48px;--size-text-xl5: 72px;--size-text-xl6: 96px;--line-height-text-2xs: 1em;--line-height-text-xs: 1.1em;--line-height-text-s: 1.2em;--line-height-text-s1: 1.25em;--line-height-text-m: 1.3em;--line-height-text-m1: 1.35em;--line-height-text-l: 1.4em;--line-height-text-l1: 1.45em;--line-height-text-xl: 1.5em;--line-height-text-xl1: 1.5em;--control-radius-s: 4px;--control-radius: 6px;--control-radius-xs: 8px;--control-radius-m: 20px;--control-radius-l: 24px;--control-radius-xl: 32px;--control-radius-xxl: 40px;--control-input-radius: 12px;--control-border-width: 1px;--control-height-xl: 60px;--control-height-xxl: 60px;--control-height-l: var(--space-4xl);--control-height-m: var(--space-3xl);--control-height-s: var(--space-2xl);--control-height-xs: var(--space-xl);--control-box-size-s: var(--space-s);--control-box-size-m: var(--space-m);--control-box-size-l: var(--space-l);--control-space-xxl: var(--space-xl);--control-space-l: var(--space-xl);--control-space-m: var(--space-l);--control-space-s: var(--space-m);--control-space-xs: var(--space-s);--control-text-size-2xl: var(--size-text-xl);--control-text-size-xl: var(--size-text-xl3);--control-text-size-l: var(--size-text-l);--control-text-size-m: var(--size-text-m);--control-text-size-s: var(--size-text-s);--control-text-size-xs: var(--size-text-xs);--space-3xs: 2px;--space-2xs: 4px;--space-1xs: 6px;--space-xs: 8px;--space-xss: 10px;--space-s: 12px;--space-2s: 14px;--space-m: 16px;--space-2m: 18px;--space-l: 20px;--space-2l: 22px;--space-xl: 24px;--space-2xl: 32px;--space-xxl: 40px;--space-3xl: 44px;--space-4xl: 48px;--space-4xxl: 64px;--space-5xl: 72px;--space-6xl: 96px;--box-shadow-active: 0 0 2px var(--sapphire-normal);--box-shadow-focus: 0px 0px 10px 2px #1389cc;--box-shadow-select-search: 0 3px 15px 0 rgba(31, 32, 35, .15);--select-search-input-top-l: -15%;--select-search-input-top-xxl: -35%;--container-width-xs: 375px;--container-width-s: 767px;--container-width-m: 960px;--container-width-l: 1280px;--container-width-xl: 1440px;--container-width-xxl: 1920px;--zindex-fixed: 1030;--sidebar-width-collapsed: 64px;--sidebar-width-expanded: 256px;--header-height: 64px;--sidebar-form-width-tablet: 369px;--sidebar-form-width-mobile: 309px}@supports (font-variation-settings: normal){:root{font-family:Inter,sans-serif}}:root{font-feature-settings:"zero";font-variant-numeric:slashed-zero}body{font-family:Inter,sans-serif;font-feature-settings:"zero";font-variant-numeric:slashed-zero;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
@@ -26,7 +26,6 @@ export type TProps = TCommonButtonProps & ComponentProps<'button'> & {
26
26
  };
27
27
  /**
28
28
  * Компонент кнопки, который можно настраивать с различными темами и размерами.
29
-
30
29
  */
31
30
  export declare const Button: import('react').ForwardRefExoticComponent<(Omit<import('./types').TButtonDefaultFormProps & {
32
31
  isIconButton: true;
@@ -3,19 +3,19 @@ import { c as classNames } from "../../index-CweZ_OcN.js";
3
3
  import { forwardRef } from "react";
4
4
  import { EButtonVariantDefault, EButtonForm } from "./constants.js";
5
5
  import { Icon } from "../../icons/Icon.js";
6
- import '../../assets/Button.css';const button = "_button_1hqwa_2";
7
- const clear = "_clear_1hqwa_41";
8
- const xs = "_xs_1hqwa_53";
9
- const s = "_s_1hqwa_61";
10
- const m = "_m_1hqwa_69";
11
- const l = "_l_1hqwa_77";
12
- const xl = "_xl_1hqwa_85";
13
- const xxl = "_xxl_1hqwa_94";
14
- const black = "_black_1hqwa_165";
15
- const gray = "_gray_1hqwa_174";
16
- const white = "_white_1hqwa_183";
17
- const full = "_full_1hqwa_193";
18
- const disabled = "_disabled_1hqwa_198";
6
+ import '../../assets/Button.css';const button = "_button_6nidf_2";
7
+ const clear = "_clear_6nidf_42";
8
+ const xs = "_xs_6nidf_54";
9
+ const s = "_s_6nidf_62";
10
+ const m = "_m_6nidf_70";
11
+ const l = "_l_6nidf_78";
12
+ const xl = "_xl_6nidf_86";
13
+ const xxl = "_xxl_6nidf_95";
14
+ const black = "_black_6nidf_166";
15
+ const gray = "_gray_6nidf_175";
16
+ const white = "_white_6nidf_184";
17
+ const full = "_full_6nidf_194";
18
+ const disabled = "_disabled_6nidf_200";
19
19
  const cls = {
20
20
  button,
21
21
  clear,
@@ -25,20 +25,20 @@ const cls = {
25
25
  l,
26
26
  xl,
27
27
  xxl,
28
- "default-button": "_default-button_1hqwa_103",
29
- "primary-sapphire": "_primary-sapphire_1hqwa_103",
30
- "primary-citrine": "_primary-citrine_1hqwa_112",
31
- "secondary-asphalt": "_secondary-asphalt_1hqwa_121",
32
- "secondary-gray": "_secondary-gray_1hqwa_130",
33
- "secondary-white": "_secondary-white_1hqwa_139",
34
- "secondary-red": "_secondary-red_1hqwa_148",
35
- "round-button": "_round-button_1hqwa_158",
28
+ "default-button": "_default-button_6nidf_104",
29
+ "primary-sapphire": "_primary-sapphire_6nidf_104",
30
+ "primary-citrine": "_primary-citrine_6nidf_113",
31
+ "secondary-asphalt": "_secondary-asphalt_6nidf_122",
32
+ "secondary-gray": "_secondary-gray_6nidf_131",
33
+ "secondary-white": "_secondary-white_6nidf_140",
34
+ "secondary-red": "_secondary-red_6nidf_149",
35
+ "round-button": "_round-button_6nidf_159",
36
36
  black,
37
37
  gray,
38
38
  white,
39
39
  full,
40
40
  disabled,
41
- "icon-button": "_icon-button_1hqwa_209"
41
+ "icon-button": "_icon-button_6nidf_211"
42
42
  };
43
43
  const Button = forwardRef(
44
44
  (props, ref) => {
@@ -68,9 +68,9 @@ const Button = forwardRef(
68
68
  };
69
69
  const buttonClassNames = classNames(
70
70
  cls.button,
71
+ className,
71
72
  mods,
72
- clear2 ? [] : [cls[form ?? ""], cls[size]],
73
- className
73
+ clear2 ? [] : [cls[form ?? ""], cls[size]]
74
74
  );
75
75
  return /* @__PURE__ */ jsxs(
76
76
  "button",
@@ -0,0 +1,38 @@
1
+ import { PropsWithChildren, ReactNode } from 'react';
2
+ import { EDrawerPosition } from './constants';
3
+
4
+ type TProps = {
5
+ /**
6
+ * Обязательный заголовок.
7
+ */
8
+ title: string;
9
+ /**
10
+ * Флаг отвечачающий за показ/скрытие.
11
+ */
12
+ isOpen?: boolean;
13
+ /**
14
+ * Настраиваемый паддинг для body, что бы избежать скачка контента при overflow: hidden
15
+ */
16
+ paddingRight?: number;
17
+ /**
18
+ * Функция закрытия шторки
19
+ */
20
+ onClose?: VoidFunction;
21
+ /**
22
+ * Дополнительный класс для родительской обертки.
23
+ */
24
+ className?: string;
25
+ /**
26
+ * Позиция шторки.
27
+ */
28
+ position?: `${EDrawerPosition}` | EDrawerPosition;
29
+ /**
30
+ * Кастомный footer. По дефолту в нем расположена кнопка для закрытия.
31
+ */
32
+ footer?: ReactNode;
33
+ };
34
+ /**
35
+ * Компонент шторки, который может выезжать слева, справа или внизу.
36
+ */
37
+ export declare const Drawer: ({ isOpen, onClose, title, className, position, paddingRight, footer, children }: PropsWithChildren<TProps>) => import("react/jsx-runtime").JSX.Element | null;
38
+ export {};
@@ -0,0 +1,144 @@
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
+ import { c as classNames } from "../../index-CweZ_OcN.js";
3
+ import { useState, useRef, useCallback, useEffect } from "react";
4
+ import { EDrawerPosition } from "./constants.js";
5
+ import { useMediaQuery } from "../../hooks/useMediaQuery/useMediaQuery.js";
6
+ import { EMediaQuery } from "../../hooks/useMediaQuery/constants.js";
7
+ import { useLockBodyScroll } from "../../hooks/useLockBodyScroll/useLockBodyScroll.js";
8
+ import { Button } from "../Button/Button.js";
9
+ import { EButtonVariantDefault, EButtonSize } from "../Button/constants.js";
10
+ import { Portal } from "../Portal/Portal.js";
11
+ import '../../assets/Drawer.css';const drawer = "_drawer_vy4rv_3";
12
+ const content = "_content_vy4rv_17";
13
+ const header = "_header_vy4rv_32";
14
+ const title = "_title_vy4rv_40";
15
+ const space = "_space_vy4rv_54";
16
+ const inner = "_inner_vy4rv_65";
17
+ const button = "_button_vy4rv_68";
18
+ const footer = "_footer_vy4rv_73";
19
+ const left = "_left_vy4rv_86";
20
+ const right = "_right_vy4rv_90";
21
+ const bottom = "_bottom_vy4rv_94";
22
+ const opened = "_opened_vy4rv_103";
23
+ const overlay = "_overlay_vy4rv_151";
24
+ const cls = {
25
+ drawer,
26
+ content,
27
+ header,
28
+ title,
29
+ space,
30
+ inner,
31
+ button,
32
+ footer,
33
+ "footer-button": "_footer-button_vy4rv_82",
34
+ left,
35
+ right,
36
+ bottom,
37
+ opened,
38
+ "is-closing": "_is-closing_vy4rv_118",
39
+ overlay
40
+ };
41
+ const ANIMATION_DELAY = 300;
42
+ const Drawer = ({
43
+ isOpen,
44
+ onClose,
45
+ title: title2,
46
+ className,
47
+ position = EDrawerPosition.RIGHT,
48
+ paddingRight = 8,
49
+ footer: footer2,
50
+ children
51
+ }) => {
52
+ const [isClosing, setIsClosing] = useState(false);
53
+ const [isMounted, setIsMounted] = useState(false);
54
+ const [isBodyScrollLocked, setIsBodyScrollLocked] = useState(false);
55
+ const timerRef = useRef();
56
+ const contentRef = useRef(null);
57
+ const isBottomPosition = position === EDrawerPosition.BOTTOM;
58
+ const isMobile = useMediaQuery(EMediaQuery.XS1);
59
+ useLockBodyScroll({
60
+ on: isBodyScrollLocked,
61
+ paddingRight
62
+ });
63
+ const handleClose = useCallback(() => {
64
+ if (onClose) {
65
+ setIsClosing(true);
66
+ setIsBodyScrollLocked(false);
67
+ timerRef.current = setTimeout(() => {
68
+ onClose();
69
+ setIsClosing(false);
70
+ }, ANIMATION_DELAY);
71
+ }
72
+ }, [onClose]);
73
+ const handleKeyDown = useCallback(
74
+ (event) => {
75
+ if (event.key === "Escape") {
76
+ handleClose();
77
+ }
78
+ },
79
+ [handleClose]
80
+ );
81
+ useEffect(() => {
82
+ if (isOpen) {
83
+ setIsBodyScrollLocked(true);
84
+ setIsMounted(true);
85
+ window.addEventListener("keydown", handleKeyDown);
86
+ }
87
+ return () => {
88
+ setIsMounted(false);
89
+ clearTimeout(timerRef.current);
90
+ window.removeEventListener("keydown", handleKeyDown);
91
+ };
92
+ }, [isOpen, handleKeyDown]);
93
+ const mods = {
94
+ [cls.opened]: isMounted,
95
+ [cls["is-closing"]]: isClosing
96
+ };
97
+ if (!isOpen) {
98
+ return null;
99
+ }
100
+ return /* @__PURE__ */ jsxs(Portal, { children: [
101
+ /* @__PURE__ */ jsx(
102
+ "div",
103
+ {
104
+ "aria-hidden": isOpen,
105
+ role: "dialog",
106
+ style: {
107
+ minHeight: isBottomPosition && contentRef.current ? contentRef.current.offsetHeight : void 0
108
+ },
109
+ className: classNames(cls.drawer, cls[position], mods, className),
110
+ children: /* @__PURE__ */ jsxs("section", { className: classNames(cls.content, cls[position]), children: [
111
+ /* @__PURE__ */ jsxs("header", { className: cls.header, children: [
112
+ /* @__PURE__ */ jsx("h2", { className: cls.title, children: title2 }),
113
+ /* @__PURE__ */ jsx("div", { className: cls.space, children: /* @__PURE__ */ jsx(
114
+ Button,
115
+ {
116
+ variant: EButtonVariantDefault.SecondaryWhite,
117
+ isIconButton: true,
118
+ size: isMobile ? EButtonSize.S : EButtonSize.M,
119
+ iconName: "Close16px",
120
+ onClick: handleClose,
121
+ className: cls.button
122
+ }
123
+ ) })
124
+ ] }),
125
+ /* @__PURE__ */ jsx("div", { ref: contentRef, className: cls.inner, children }),
126
+ /* @__PURE__ */ jsx("footer", { className: cls.footer, children: footer2 || /* @__PURE__ */ jsx(
127
+ Button,
128
+ {
129
+ size: isMobile ? EButtonSize.M : EButtonSize.XXL,
130
+ full: isMobile,
131
+ onClick: handleClose,
132
+ className: cls["footer-button"],
133
+ children: "Закрыть"
134
+ }
135
+ ) })
136
+ ] })
137
+ }
138
+ ),
139
+ /* @__PURE__ */ jsx("div", { className: classNames(cls.overlay, mods), onClick: handleClose })
140
+ ] });
141
+ };
142
+ export {
143
+ Drawer
144
+ };
@@ -0,0 +1,5 @@
1
+ export declare enum EDrawerPosition {
2
+ LEFT = "left",
3
+ RIGHT = "right",
4
+ BOTTOM = "bottom"
5
+ }
@@ -0,0 +1,9 @@
1
+ var EDrawerPosition = /* @__PURE__ */ ((EDrawerPosition2) => {
2
+ EDrawerPosition2["LEFT"] = "left";
3
+ EDrawerPosition2["RIGHT"] = "right";
4
+ EDrawerPosition2["BOTTOM"] = "bottom";
5
+ return EDrawerPosition2;
6
+ })(EDrawerPosition || {});
7
+ export {
8
+ EDrawerPosition
9
+ };
@@ -0,0 +1,2 @@
1
+ export { Drawer } from './Drawer';
2
+ export { EDrawerPosition } from './constants';
@@ -0,0 +1,6 @@
1
+ import { Drawer } from "./Drawer.js";
2
+ import { EDrawerPosition } from "./constants.js";
3
+ export {
4
+ Drawer,
5
+ EDrawerPosition
6
+ };
@@ -0,0 +1,7 @@
1
+ import { PropsWithChildren } from 'react';
2
+
3
+ type TProps = {
4
+ element?: HTMLElement;
5
+ };
6
+ export declare const Portal: ({ element, children }: PropsWithChildren<TProps>) => import('react').ReactPortal;
7
+ export {};
@@ -0,0 +1,10 @@
1
+ import { createPortal } from "react-dom";
2
+ const Portal = ({
3
+ element = document.body,
4
+ children
5
+ }) => {
6
+ return createPortal(children, element);
7
+ };
8
+ export {
9
+ Portal
10
+ };
@@ -0,0 +1 @@
1
+ export { Portal } from './Portal';
@@ -0,0 +1,4 @@
1
+ import { Portal } from "./Portal.js";
2
+ export {
3
+ Portal
4
+ };
@@ -1,2 +1,3 @@
1
- export { SelectSearch } from './SelectSearch';
1
+ export { SelectSearch, type TProps as TSelectSearchProps } from './SelectSearch';
2
2
  export { ESelectSearchSize } from './constants';
3
+ export type { TSelectSearchItem, TSelectSearchSize } from './types';
@@ -13,5 +13,9 @@ export type { TButtonPropsWithoutStyles } from './MergedButton';
13
13
  export { Image } from './Image';
14
14
  export { Loader } from './Loader';
15
15
  export { Slider } from './Slider';
16
+ export { Drawer } from './Drawer';
17
+ export { EDrawerPosition } from './Drawer';
16
18
  export { Steps, EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize, type TCommonStepsProps } from './Steps';
17
19
  export { Vote, EVoteSize, type TCommonVoteProps } from './Vote';
20
+ export { SelectSearch, ESelectSearchSize } from './SelectSearch';
21
+ export type { TSelectSearchItem, TSelectSearchProps, TSelectSearchSize } from './SelectSearch';
@@ -12,19 +12,26 @@ import { EMergedButtonVariantRound } from "./MergedButton/constants.js";
12
12
  import { AppImage } from "./Image/Image.js";
13
13
  import { Loader } from "./Loader/Loader.js";
14
14
  import { Slider } from "./Slider/Slider.js";
15
+ import { Drawer } from "./Drawer/Drawer.js";
16
+ import { EDrawerPosition } from "./Drawer/constants.js";
15
17
  import { Steps } from "./Steps/Steps.js";
16
18
  import { EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize } from "./Steps/constants.js";
17
19
  import { Vote } from "./Vote/Vote.js";
18
20
  import { EVoteSize } from "./Vote/constants.js";
21
+ import { SelectSearch } from "./SelectSearch/SelectSearch.js";
22
+ import { ESelectSearchSize } from "./SelectSearch/constants.js";
19
23
  export {
20
24
  Button,
25
+ Drawer,
21
26
  EButtonForm,
22
27
  EButtonSize,
23
28
  EButtonVariantDefault,
24
29
  EButtonVariantRound,
30
+ EDrawerPosition,
25
31
  EInputSize,
26
32
  EInputVariant,
27
33
  EMergedButtonVariantRound,
34
+ ESelectSearchSize,
28
35
  EStepsPrimaryColor,
29
36
  EStepsSecondaryColor,
30
37
  EStepsSize,
@@ -37,6 +44,7 @@ export {
37
44
  MergedButton,
38
45
  OtpInput,
39
46
  RadioGroup,
47
+ SelectSearch,
40
48
  Slider,
41
49
  Steps,
42
50
  Vote,
@@ -1 +1,2 @@
1
1
  export { useMediaQuery, EMediaQuery } from './useMediaQuery';
2
+ export { useLockBodyScroll } from './useLockBodyScroll';
@@ -1,6 +1,8 @@
1
1
  import { useMediaQuery } from "./useMediaQuery/useMediaQuery.js";
2
2
  import { EMediaQuery } from "./useMediaQuery/constants.js";
3
+ import { useLockBodyScroll } from "./useLockBodyScroll/useLockBodyScroll.js";
3
4
  export {
4
5
  EMediaQuery,
6
+ useLockBodyScroll,
5
7
  useMediaQuery
6
8
  };
@@ -0,0 +1 @@
1
+ export { useLockBodyScroll } from './useLockBodyScroll';
@@ -0,0 +1,4 @@
1
+ import { useLockBodyScroll } from "./useLockBodyScroll.js";
2
+ export {
3
+ useLockBodyScroll
4
+ };
@@ -0,0 +1,6 @@
1
+ type TUseLockBodyScroll = {
2
+ on?: boolean;
3
+ paddingRight?: number;
4
+ };
5
+ export declare function useLockBodyScroll({ on, paddingRight }: TUseLockBodyScroll): void;
6
+ export {};
@@ -0,0 +1,20 @@
1
+ import { useLayoutEffect } from "react";
2
+ function useLockBodyScroll({ on, paddingRight }) {
3
+ useLayoutEffect(() => {
4
+ const hasVerticalScrollbar = document.documentElement.scrollHeight > document.documentElement.clientHeight;
5
+ if (!on || !hasVerticalScrollbar) return;
6
+ const originalStyle = window.getComputedStyle(document.body).overflow;
7
+ const originalPaddingStyle = window.getComputedStyle(
8
+ document.body
9
+ ).paddingRight;
10
+ document.body.style.overflow = "hidden";
11
+ document.body.style.paddingRight = `${paddingRight}px`;
12
+ return () => {
13
+ document.body.style.overflow = originalStyle;
14
+ document.body.style.paddingRight = originalPaddingStyle;
15
+ };
16
+ }, [on, paddingRight]);
17
+ }
18
+ export {
19
+ useLockBodyScroll
20
+ };
package/dist/index.js CHANGED
@@ -12,23 +12,31 @@ import { EMergedButtonVariantRound } from "./components/MergedButton/constants.j
12
12
  import { AppImage } from "./components/Image/Image.js";
13
13
  import { Loader } from "./components/Loader/Loader.js";
14
14
  import { Slider } from "./components/Slider/Slider.js";
15
+ import { Drawer } from "./components/Drawer/Drawer.js";
16
+ import { EDrawerPosition } from "./components/Drawer/constants.js";
15
17
  import { Steps } from "./components/Steps/Steps.js";
16
18
  import { EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize } from "./components/Steps/constants.js";
17
19
  import { Vote } from "./components/Vote/Vote.js";
18
20
  import { EVoteSize } from "./components/Vote/constants.js";
21
+ import { SelectSearch } from "./components/SelectSearch/SelectSearch.js";
22
+ import { ESelectSearchSize } from "./components/SelectSearch/constants.js";
19
23
  import { useMediaQuery } from "./hooks/useMediaQuery/useMediaQuery.js";
20
24
  import { EMediaQuery } from "./hooks/useMediaQuery/constants.js";
25
+ import { useLockBodyScroll } from "./hooks/useLockBodyScroll/useLockBodyScroll.js";
21
26
  import { Icon } from "./icons/Icon.js";
22
27
  import './assets/index.css';export {
23
28
  Button,
29
+ Drawer,
24
30
  EButtonForm,
25
31
  EButtonSize,
26
32
  EButtonVariantDefault,
27
33
  EButtonVariantRound,
34
+ EDrawerPosition,
28
35
  EInputSize,
29
36
  EInputVariant,
30
37
  EMediaQuery,
31
38
  EMergedButtonVariantRound,
39
+ ESelectSearchSize,
32
40
  EStepsPrimaryColor,
33
41
  EStepsSecondaryColor,
34
42
  EStepsSize,
@@ -42,10 +50,12 @@ import './assets/index.css';export {
42
50
  MergedButton,
43
51
  OtpInput,
44
52
  RadioGroup,
53
+ SelectSearch,
45
54
  Slider,
46
55
  Steps,
47
56
  Vote,
48
57
  getMaskedInputPhoneValue,
49
58
  getUnmaskedInputValue,
59
+ useLockBodyScroll,
50
60
  useMediaQuery
51
61
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "mimir-ui-kit",
3
3
  "private": false,
4
- "version": "1.5.0",
4
+ "version": "1.5.4",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {