mimir-ui-kit 1.17.3 → 1.18.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{Input-D-FCB1FU.js → Input-BFFPzelg.js} +2 -2
- package/dist/assets/Accordion.css +1 -1
- package/dist/assets/Drawer.css +1 -1
- package/dist/assets/NotificationBadge.css +1 -0
- package/dist/assets/SelectSearch.css +1 -1
- package/dist/assets/Switch.css +1 -1
- package/dist/assets/TabTrail.css +1 -1
- package/dist/assets/index.css +1 -1
- package/dist/components/Accordion/Accordion.d.ts +3 -1
- package/dist/components/Accordion/Accordion.js +32 -17
- package/dist/components/Accordion/constants.d.ts +8 -0
- package/dist/components/Accordion/constants.js +12 -0
- package/dist/components/DatePicker/DatePicker.js +1 -1
- package/dist/components/Drawer/Drawer.js +17 -15
- package/dist/components/Drawer/constants.d.ts +2 -1
- package/dist/components/Drawer/constants.js +1 -0
- package/dist/components/Input/Input.js +1 -1
- package/dist/components/Input/index.js +1 -1
- package/dist/components/InputPassword/InputPassword.js +1 -1
- package/dist/components/InputPhoneNumber/InputPhoneNumber.js +1 -1
- package/dist/components/NotificationBadge/NotificationBadge.d.ts +3 -0
- package/dist/components/NotificationBadge/NotificationBadge.js +38 -0
- package/dist/components/NotificationBadge/constants.d.ts +4 -0
- package/dist/components/NotificationBadge/constants.js +8 -0
- package/dist/components/NotificationBadge/index.d.ts +3 -0
- package/dist/components/NotificationBadge/index.js +6 -0
- package/dist/components/NotificationBadge/types.d.ts +25 -0
- package/dist/components/NotificationBadge/types.js +1 -0
- package/dist/components/OtpInput/OtpInput.js +1 -1
- package/dist/components/SelectSearch/SelectSearch.js +48 -29
- package/dist/components/SelectSearch/types.d.ts +8 -0
- package/dist/components/Switch/Switch.d.ts +7 -2
- package/dist/components/Switch/Switch.js +24 -17
- package/dist/components/TabTrail/TabTrail.d.ts +24 -0
- package/dist/components/TabTrail/TabTrail.js +18 -17
- package/dist/components/TextArea/TextArea.js +3 -3
- package/dist/components/index.d.ts +3 -0
- package/dist/components/index.js +5 -1
- package/dist/hooks/useMediaQuery/useMediaQuery.d.ts +2 -2
- package/dist/index.js +5 -1
- package/package.json +1 -1
@@ -84,7 +84,6 @@ const Input = memo(
|
|
84
84
|
id,
|
85
85
|
onFocus,
|
86
86
|
onBlur,
|
87
|
-
onChange,
|
88
87
|
label: label2,
|
89
88
|
withClearButton,
|
90
89
|
disabled: disabled2,
|
@@ -126,9 +125,10 @@ const Input = memo(
|
|
126
125
|
}
|
127
126
|
};
|
128
127
|
const handleChange = (event) => {
|
128
|
+
var _a;
|
129
129
|
const targetValue = event.target.value;
|
130
130
|
setWithValue(!!targetValue);
|
131
|
-
onChange == null ? void 0 :
|
131
|
+
(_a = otherProps == null ? void 0 : otherProps.onChange) == null ? void 0 : _a.call(otherProps, event);
|
132
132
|
};
|
133
133
|
const currentLeftAddon = renderAddon(leftAddon);
|
134
134
|
const currentRightAddon = renderAddon(rightAddon);
|
@@ -1 +1 @@
|
|
1
|
-
.
|
1
|
+
._accordion_11qul_2{padding-bottom:var(--accordion-space);border-bottom:1px solid var(--black-20)}._accordion_11qul_2 svg path{fill:var(--white)}._accordion_11qul_2._is-link_11qul_9{border:none}._header_11qul_13{display:flex;gap:var(--space-m);align-items:flex-start;justify-content:space-between;width:100%;font-weight:var(--font-weight-text-medium);font-family:var(--font-montserrat);text-align:left;border:none;cursor:pointer}._title_11qul_26{font-size:var(--accordion-text-size)}._title-uppercase_11qul_29{text-transform:uppercase}._icon_11qul_33{transition:transform .3s ease-in-out}._icon-container_11qul_36{display:flex;align-items:center;justify-content:center;transition:background-color .3s ease-in-out}._circle_11qul_43{min-width:var(--accordion-icon-circle-width);min-height:var(--accordion-icon-circle-height);background-color:var(--black-80);border-radius:50%}._square_11qul_50{min-width:var(--accordion-icon-square-width);min-height:var(--accordion-icon-square-height);background-color:var(--white);border-radius:var(--control-radius)}._square_11qul_50 svg path{fill:var(--black-100)}._panel_11qul_60{margin-top:var(--accordion-panel-space)}._panel_11qul_60._is-link_11qul_9{margin-top:var(--space-xs)}._open_11qul_67{background-color:var(--sapphire-100)}._open_11qul_67 svg{transform:rotate(-180deg)}._open_11qul_67._circle_11qul_43{background-color:var(--sapphire-100)}._open_11qul_67._square_11qul_50{background-color:var(--black-80)}._open_11qul_67._square_11qul_50 svg path{fill:var(--white)}._link-open_11qul_83{transform:rotate(-180deg)}._m_11qul_87{--accordion-space: var(--space-xl);--accordion-text-size: var(--size-text-xl2);--accordion-icon-circle-width: var(--accordion-icon-circle-size-m);--accordion-icon-circle-height: var(--accordion-icon-circle-size-m);--accordion-icon-square-width: var(--accordion-icon-square-size-m);--accordion-icon-square-height: var(--accordion-icon-square-size-m);--accordion-panel-space: var(--space-xl)}._s_11qul_50{--accordion-space: var(--space-m);--accordion-text-size: var(--size-text-l);--accordion-icon-circle-width: var(--accordion-icon-circle-size-s);--accordion-icon-circle-height: var(--accordion-icon-circle-size-s);--accordion-icon-square-width: var(--accordion-icon-square-size-s);--accordion-icon-square-height: var(--accordion-icon-square-size-s);--accordion-panel-space: var(--space-m)}
|
package/dist/assets/Drawer.css
CHANGED
@@ -1 +1 @@
|
|
1
|
-
.
|
1
|
+
._drawer_geqni_3{--drawer-width: 808px;--drawer-z-index: 10000;position:fixed;z-index:10000;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_geqni_3 ._content_geqni_17{position:relative;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_geqni_3 ._content_geqni_17{--drawer-width: 100%;padding:var(--space-m)}}._drawer_geqni_3 ._header_geqni_31{display:flex;gap:var(--space-xs);height:68px}._drawer_geqni_3 ._header_geqni_31:not(:last-child){margin-bottom:var(--space-2xl)}._drawer_geqni_3 ._header_geqni_31 ._title_geqni_39{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_geqni_3 ._header_geqni_31 ._title_geqni_39{font-size:var(--size-text-xl2);line-height:var(--line-height-text-xs)}}._drawer_geqni_3 ._header_geqni_31 ._space_geqni_53{flex:0 0 var(--button-height-m)}@media (max-width: 600px){._drawer_geqni_3 ._header_geqni_31{height:55px}._drawer_geqni_3 ._header_geqni_31:not(:last-child){margin-bottom:var(--space-m)}}._drawer_geqni_3 ._inner_geqni_64{flex:1}._drawer_geqni_3 ._button_geqni_67{position:absolute;top:var(--space-m);right:var(--space-m)}._drawer_geqni_3 ._footer_geqni_72{display:block;padding-top:var(--space-4xl)}@media (max-width: 600px){._drawer_geqni_3 ._footer_geqni_72{padding-top:var(--space-m)}}._drawer_geqni_3 ._footer-button_geqni_81{display:block;margin-left:auto}._drawer_geqni_3._left_geqni_85{top:0;left:-100%}._drawer_geqni_3._right_geqni_89{top:0;right:-100%}._drawer_geqni_3._full_geqni_93{top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-height:100vh;border-radius:0;transform:scale(.95);opacity:0;transition:transform .3s ease-in-out,opacity .3s ease-in-out}._drawer_geqni_3._bottom_geqni_103{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_geqni_3._opened_geqni_112{transition:all .3s ease;pointer-events:auto}._drawer_geqni_3._opened_geqni_112._left_geqni_85{left:0%;transition:left .3s ease}._drawer_geqni_3._opened_geqni_112._right_geqni_89{right:0%;transition:right .3s ease}._drawer_geqni_3._opened_geqni_112._bottom_geqni_103{bottom:0%}._drawer_geqni_3._opened_geqni_112._full_geqni_93{transform:scale(1);opacity:1}._drawer_geqni_3._is-closing_geqni_131._left_geqni_85{left:-100%}._drawer_geqni_3._is-closing_geqni_131._right_geqni_89{right:-100%}._drawer_geqni_3._is-closing_geqni_131._bottom_geqni_103{bottom:-100%}._drawer_geqni_3._is-closing_geqni_131._full_geqni_93{transform:scale(.95);opacity:0}@media (max-width: 1440px){._drawer_geqni_3{--drawer-width: 608px}}@media (max-width: 1280px){._drawer_geqni_3{--drawer-width: 648px}}@media (max-width: 768px){._drawer_geqni_3{--drawer-width: 584px}}@media (max-width: 600px){._drawer_geqni_3{--drawer-width: 100%}._drawer_geqni_3._bottom_geqni_103{max-width:359px}}._overlay_geqni_168{--overlay-z-index: 9990;position:fixed;top:0;left:0;z-index:9990;z-index:var(--overlay-z-index);width:100%;height:100%;background-color:#0009;opacity:0;transition:all .3s ease}._overlay_geqni_168._opened_geqni_112{opacity:1;transition:all .3s ease}._overlay_geqni_168._is-closing_geqni_131{opacity:0;transition:all .3s ease}
|
@@ -0,0 +1 @@
|
|
1
|
+
._notification-badge_1rrs6_2{position:relative;display:flex;align-items:center;justify-content:center;width:var(--width-notification-badge);height:var(--height-notification-badge);color:var(--white);font-size:var(--size-text-notification-badge);background-color:var(--citrine-100);border-radius:50%}._notification-badge-absolute_1rrs6_14{position:absolute}._m_1rrs6_18{--size-text-notification-badge: var(--size-text-m);--width-notification-badge: 24px;--height-notification-badge: 24px}._s_1rrs6_24{--height-notification-badge: 16px;--width-notification-badge: 16px;--size-text-notification-badge: var(--size-text-s)}
|
@@ -1 +1 @@
|
|
1
|
-
._select-
|
1
|
+
._select-search_3ezsa_2{position:relative}._select-search_3ezsa_2._disabled_3ezsa_5{cursor:not-allowed}._container_3ezsa_9{display:block;gap:var(--select-search-gap);align-items:center;justify-content:space-between;height:var(--select-search-height);background-color:var(--black-5);border-radius:var(--select-search-radius)}._container-open_3ezsa_18{border-bottom:1px solid var(--citrine-100)}._full_3ezsa_22{width:100%}._selector-icon-open_3ezsa_26{transform:rotate(180deg)}._button_3ezsa_30{position:absolute;top:0;right:0;display:flex;align-items:center;margin:var(--select-search-btn-space);background:none;border:none;cursor:pointer}._options_3ezsa_42{position:absolute;z-index:10;width:100%;height:var(--select-search-options-height);overflow-y:auto;font-size:var(--size-text-l);background:var(--white);box-shadow:var(--box-shadow-select-search)}._options_3ezsa_42._top_3ezsa_52{bottom:100%;margin-bottom:1px;border-radius:var(--select-search-radius) var(--select-search-radius) 0 0}._options_3ezsa_42._bottom_3ezsa_57{top:100%;margin-top:1px;border-radius:0 0 var(--select-search-radius) var(--select-search-radius)}._options_3ezsa_42::-webkit-scrollbar{width:3px}._options_3ezsa_42::-webkit-scrollbar-thumb{background-color:var(--black-80);border-radius:2px}._options_3ezsa_42::-webkit-scrollbar-track{background-color:var(--white)}@media (max-width: 600px){._options_3ezsa_42{max-height:var(--select-search-options-height-mobile)}}._no-options_3ezsa_78{height:100%;padding:var(--select-search-option-space);color:var(--black-80)}._m_3ezsa_84{--select-search-height: var(--select-search-height-l);--select-search-space: var(--space-xss) var(--space-m);--select-search-radius: var(--control-radius);--select-search-gap: var(--space-2xs);--select-search-btn-space: var(--space-m) var(--space-m) var(--space-m) var(--space-xs);--select-search-option-space: var(--space-2s) var(--space-m);--select-search-options-height: var(--select-search-options-height-mobile)}._l_3ezsa_95{--select-search-height: var(--select-search-height-xxl);--select-search-space: var(--space-xss) var(--space-m);--select-search-radius: var(--control-radius-s);--select-search-gap: var(--space-xs);--select-search-btn-space: var(--space-l) var(--space-m) var(--space-l) var(--space-xs);--select-search-option-space: var(--space-2l) var(--space-m);--select-search-options-height: var(--select-search-options-height-desktop)}._custom-input-class_3ezsa_106{width:100%!important}._custom-input-class_3ezsa_106:last-child{padding-right:var(--space-4xl)}._option_3ezsa_42{display:flex;gap:var(--space-m);align-items:center;width:100%;padding:var(--select-search-option-space);cursor:pointer;transition:background-color .2s ease-in-out}._option-active_3ezsa_122{background-color:var(--black-5)}._option-inner_3ezsa_125{display:flex;flex-direction:column;gap:var(--space-xs);width:100%}._selected-icon_3ezsa_132 path{fill:var(--sapphire-100)}
|
package/dist/assets/Switch.css
CHANGED
@@ -1 +1 @@
|
|
1
|
-
.
|
1
|
+
._container_18cvn_2{display:flex;gap:var(--space-xs);align-items:flex-start}._switch_18cvn_8{position:relative;display:inline-block;flex-shrink:0;width:24px;height:24px;padding:var(--space-2xs);vertical-align:middle;background-color:var(--sapphire-20);border-radius:var(--control-radius-xs);cursor:pointer}._switch_18cvn_8 svg{display:none}._switch_18cvn_8 svg path{fill:var(--white)}._label_18cvn_27{padding-top:var(--space-2xs)}._enabled_18cvn_31{background-color:var(--sapphire-100)}._enabled_18cvn_31 svg{display:block}
|
package/dist/assets/TabTrail.css
CHANGED
@@ -1 +1 @@
|
|
1
|
-
.
|
1
|
+
._container_5jk4g_2{position:relative}._group_5jk4g_6{position:relative;overflow:hidden}._group-inner_5jk4g_10{display:flex;gap:var(--space-4xl);align-items:center}._tab_5jk4g_16{position:relative;display:flex;gap:var(--space-2xs);align-items:center;height:var(--tab-trail-height);padding:0 var(--tab-padding);color:var(--disabled-color);font-weight:var(--font-weight-text-medium);font-size:var(--tab-trail-font-size);font-family:var(--font-montserrat)}._tab_5jk4g_16:after{position:absolute;bottom:0;left:0;width:100%;height:2px;background-color:transparent;transition:background-color .3s ease;content:""}._tab_5jk4g_16[data-selected]{color:var(--black-100)}._tab_5jk4g_16[data-selected]:after{background-color:var(--sapphire-100)}._tab_5jk4g_16:not([data-selected]){filter:grayscale(100%) opacity(.7)}._tab_5jk4g_16:not([data-selected]):after{background-color:var(--white)}._list_5jk4g_51{display:flex;align-items:center;overflow:auto;white-space:nowrap;scroll-behavior:smooth}._list_5jk4g_51::-webkit-scrollbar{display:none}._tabs_5jk4g_62{display:flex;align-items:center;padding-top:var(--tabs-padding-top)}._buttons_5jk4g_68{position:relative;display:flex;height:100%;max-height:40px}._m_5jk4g_75{--tab-trail-font-size: var(--size-text-xl3);--tab-trail-height: var(--tab-trail-height-m);--tabs-padding-top: var(--space-xs);--tab-padding: var(--space-m)}._s_5jk4g_82{--tab-trail-font-size: var(--size-text-xl);--tab-trail-height: var(--tab-trail-height-s);--tabs-padding-top: var(--space-3xs);--tab-padding: var(--space-s)}
|
package/dist/assets/index.css
CHANGED
@@ -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-ms: 16px;--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-l2: 18px;--size-text-xl: 20px;--size-text-xl2: 24px;--size-text-2xl: 28px;--size-text-xl3: 32px;--size-text-xl4: 48px;--size-text-4xl: 52px;--size-text-xl5: 72px;--size-text-xl6: 96px;--line-height-text-2xs: 1em;--line-height-text-xxs: 1.125em;--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-xs: 4px;--control-radius: 6px;--control-radius-s: 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-1xl: 28px;--space-2xl: 32px;--space-2xxl: 36px;--space-xxl: 40px;--space-3xl: 44px;--space-4xl: 48px;--space-4xxl: 64px;--space-
|
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-ms: 16px;--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-l2: 18px;--size-text-xl: 20px;--size-text-xl2: 24px;--size-text-3xl: 26px;--size-text-2xl: 28px;--size-text-xl3: 32px;--size-text-xl4: 48px;--size-text-4xl: 52px;--size-text-xl5: 72px;--size-text-xl6: 96px;--line-height-text-2xs: 1em;--line-height-text-xxs: 1.125em;--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-xs: 4px;--control-radius: 6px;--control-radius-s: 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-1xl: 28px;--space-2xl: 32px;--space-2xxl: 36px;--space-xxl: 40px;--space-3xl: 44px;--space-4xl: 48px;--space-5xl: 56px;--space-4xxl: 64px;--space-5xxl: 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;--tab-trail-height-m: 58px;--tab-trail-height-s: 36px;--accordion-icon-circle-size-m: 48px;--accordion-icon-circle-size-s: 36px;--accordion-icon-square-size-m: 40px;--accordion-icon-square-size-s: 32px}@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,5 +1,5 @@
|
|
1
1
|
import { ReactNode } from 'react';
|
2
|
-
import { EAccordionButtonType, EAccordionSize } from './constants';
|
2
|
+
import { EAccordionButtonStyle, EAccordionButtonType, EAccordionIconType, EAccordionSize } from './constants';
|
3
3
|
|
4
4
|
export type TAccordionProps = {
|
5
5
|
title: string;
|
@@ -7,5 +7,7 @@ export type TAccordionProps = {
|
|
7
7
|
size?: EAccordionSize;
|
8
8
|
titleUppercase?: boolean;
|
9
9
|
buttonType?: EAccordionButtonType | `${EAccordionButtonType}`;
|
10
|
+
buttonStyle?: EAccordionButtonStyle | `${EAccordionButtonStyle}`;
|
11
|
+
iconType?: EAccordionIconType | `${EAccordionIconType}`;
|
10
12
|
};
|
11
13
|
export declare const Accordion: import('react').ForwardRefExoticComponent<TAccordionProps & import('react').RefAttributes<HTMLElement>>;
|
@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
|
|
2
2
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
3
3
|
import React__default, { createContext, useRef, Fragment, useReducer, useMemo, useId, useEffect, useContext, forwardRef } from "react";
|
4
4
|
import { AccordionItem } from "./AccordionItem/AccordionItem.js";
|
5
|
-
import { EAccordionButtonType, EAccordionSize,
|
5
|
+
import { EAccordionButtonType, EAccordionSize, EAccordionButtonStyle, EAccordionIconType, EAccordionLinkIconSize, EAccordionButtonIconSize } from "./constants.js";
|
6
6
|
import { useMediaQuery } from "../../hooks/useMediaQuery/useMediaQuery.js";
|
7
7
|
import { EMediaQuery } from "../../hooks/useMediaQuery/constants.js";
|
8
8
|
import { Icon } from "../../icons/Icon.js";
|
@@ -119,25 +119,29 @@ function Re(e2, n) {
|
|
119
119
|
return React__default.createElement(s$1, null, React__default.createElement(H.Provider, { value: t2.panelId }, H$1({ mergeRefs: f, ourProps: g, theirProps: d, slot: D2, defaultTag: Se, features: be, visible: p, name: "Disclosure.Panel" })));
|
120
120
|
}
|
121
121
|
let Ae = W(me), Ce = W(ge), Ie = W(Re), We = Object.assign(Ae, { Button: Ce, Panel: Ie });
|
122
|
-
const accordion = "
|
123
|
-
const header = "
|
124
|
-
const title = "
|
125
|
-
const icon = "
|
126
|
-
const
|
127
|
-
const
|
128
|
-
const
|
129
|
-
const
|
122
|
+
const accordion = "_accordion_11qul_2";
|
123
|
+
const header = "_header_11qul_13";
|
124
|
+
const title = "_title_11qul_26";
|
125
|
+
const icon = "_icon_11qul_33";
|
126
|
+
const circle = "_circle_11qul_43";
|
127
|
+
const square = "_square_11qul_50";
|
128
|
+
const panel = "_panel_11qul_60";
|
129
|
+
const open = "_open_11qul_67";
|
130
|
+
const m = "_m_11qul_87";
|
131
|
+
const s = "_s_11qul_50";
|
130
132
|
const cls = {
|
131
133
|
accordion,
|
132
|
-
"is-link": "_is-
|
134
|
+
"is-link": "_is-link_11qul_9",
|
133
135
|
header,
|
134
136
|
title,
|
135
|
-
"title-uppercase": "_title-
|
137
|
+
"title-uppercase": "_title-uppercase_11qul_29",
|
136
138
|
icon,
|
137
|
-
"icon-container": "_icon-
|
139
|
+
"icon-container": "_icon-container_11qul_36",
|
140
|
+
circle,
|
141
|
+
square,
|
138
142
|
panel,
|
139
143
|
open,
|
140
|
-
"link-open": "_link-
|
144
|
+
"link-open": "_link-open_11qul_83",
|
141
145
|
m,
|
142
146
|
s
|
143
147
|
};
|
@@ -147,7 +151,9 @@ const Accordion = forwardRef(
|
|
147
151
|
buttonType = EAccordionButtonType.BUTTON,
|
148
152
|
children,
|
149
153
|
size = EAccordionSize.M,
|
150
|
-
titleUppercase
|
154
|
+
titleUppercase,
|
155
|
+
buttonStyle = EAccordionButtonStyle.CIRCLE,
|
156
|
+
iconType = EAccordionIconType.ARROW
|
151
157
|
}, ref) => {
|
152
158
|
const isMobile = useMediaQuery(EMediaQuery.XS1);
|
153
159
|
const isLink = buttonType === "link";
|
@@ -155,7 +161,12 @@ const Accordion = forwardRef(
|
|
155
161
|
[cls["is-link"]]: isLink
|
156
162
|
};
|
157
163
|
const renderButton = (open2) => {
|
158
|
-
const
|
164
|
+
const getIconName = () => {
|
165
|
+
if (iconType === EAccordionIconType.DROPDOWN) {
|
166
|
+
return size === EAccordionSize.S ? "DropdownArrowBottom16px" : "DropdownArrowDown24px";
|
167
|
+
}
|
168
|
+
return size === EAccordionSize.S ? EAccordionButtonIconSize.S : EAccordionButtonIconSize.M;
|
169
|
+
};
|
159
170
|
const linkIcon = size === EAccordionSize.S ? EAccordionLinkIconSize.S : EAccordionLinkIconSize.M;
|
160
171
|
switch (buttonType) {
|
161
172
|
case EAccordionButtonType.LINK: {
|
@@ -189,8 +200,12 @@ const Accordion = forwardRef(
|
|
189
200
|
/* @__PURE__ */ jsx(
|
190
201
|
"div",
|
191
202
|
{
|
192
|
-
className: classNames(
|
193
|
-
|
203
|
+
className: classNames(
|
204
|
+
cls["icon-container"],
|
205
|
+
open2 && cls.open,
|
206
|
+
cls[buttonStyle]
|
207
|
+
),
|
208
|
+
children: /* @__PURE__ */ jsx(Icon, { iconName: getIconName(), className: cls.icon })
|
194
209
|
}
|
195
210
|
)
|
196
211
|
] });
|
@@ -14,3 +14,11 @@ export declare enum EAccordionLinkIconSize {
|
|
14
14
|
M = "DropdownArrowDown24px",
|
15
15
|
S = "DropdownArrowBottom16px"
|
16
16
|
}
|
17
|
+
export declare enum EAccordionButtonStyle {
|
18
|
+
CIRCLE = "circle",
|
19
|
+
SQUARE = "square"
|
20
|
+
}
|
21
|
+
export declare enum EAccordionIconType {
|
22
|
+
ARROW = "arrow",
|
23
|
+
DROPDOWN = "dropdown"
|
24
|
+
}
|
@@ -18,9 +18,21 @@ var EAccordionLinkIconSize = /* @__PURE__ */ ((EAccordionLinkIconSize2) => {
|
|
18
18
|
EAccordionLinkIconSize2["S"] = "DropdownArrowBottom16px";
|
19
19
|
return EAccordionLinkIconSize2;
|
20
20
|
})(EAccordionLinkIconSize || {});
|
21
|
+
var EAccordionButtonStyle = /* @__PURE__ */ ((EAccordionButtonStyle2) => {
|
22
|
+
EAccordionButtonStyle2["CIRCLE"] = "circle";
|
23
|
+
EAccordionButtonStyle2["SQUARE"] = "square";
|
24
|
+
return EAccordionButtonStyle2;
|
25
|
+
})(EAccordionButtonStyle || {});
|
26
|
+
var EAccordionIconType = /* @__PURE__ */ ((EAccordionIconType2) => {
|
27
|
+
EAccordionIconType2["ARROW"] = "arrow";
|
28
|
+
EAccordionIconType2["DROPDOWN"] = "dropdown";
|
29
|
+
return EAccordionIconType2;
|
30
|
+
})(EAccordionIconType || {});
|
21
31
|
export {
|
22
32
|
EAccordionButtonIconSize,
|
33
|
+
EAccordionButtonStyle,
|
23
34
|
EAccordionButtonType,
|
35
|
+
EAccordionIconType,
|
24
36
|
EAccordionLinkIconSize,
|
25
37
|
EAccordionSize
|
26
38
|
};
|
@@ -5,7 +5,7 @@ import { c as cls, D as DatePickerModal } from "../../DatePickerModal-BM0BgzTb.j
|
|
5
5
|
import { useClickOutside } from "../../hooks/useClickOutside/useClickOutside.js";
|
6
6
|
import { formating } from "../../utils/index.js";
|
7
7
|
import { Button } from "../Button/Button.js";
|
8
|
-
import { I as Input } from "../../Input-
|
8
|
+
import { I as Input } from "../../Input-BFFPzelg.js";
|
9
9
|
const DatePicker = memo(
|
10
10
|
forwardRef(
|
11
11
|
({ size, value, onChangeValue, name, before, ...props }, ref) => {
|
@@ -8,19 +8,20 @@ import { useLockBodyScroll } from "../../hooks/useLockBodyScroll/useLockBodyScro
|
|
8
8
|
import { Button } from "../Button/Button.js";
|
9
9
|
import { EButtonVariantDefault, EButtonSize } from "../Button/constants.js";
|
10
10
|
import { Portal } from "../Portal/Portal.js";
|
11
|
-
import '../../assets/Drawer.css';const drawer = "
|
12
|
-
const content = "
|
13
|
-
const header = "
|
14
|
-
const title = "
|
15
|
-
const space = "
|
16
|
-
const inner = "
|
17
|
-
const button = "
|
18
|
-
const footer = "
|
19
|
-
const left = "
|
20
|
-
const right = "
|
21
|
-
const
|
22
|
-
const
|
23
|
-
const
|
11
|
+
import '../../assets/Drawer.css';const drawer = "_drawer_geqni_3";
|
12
|
+
const content = "_content_geqni_17";
|
13
|
+
const header = "_header_geqni_31";
|
14
|
+
const title = "_title_geqni_39";
|
15
|
+
const space = "_space_geqni_53";
|
16
|
+
const inner = "_inner_geqni_64";
|
17
|
+
const button = "_button_geqni_67";
|
18
|
+
const footer = "_footer_geqni_72";
|
19
|
+
const left = "_left_geqni_85";
|
20
|
+
const right = "_right_geqni_89";
|
21
|
+
const full = "_full_geqni_93";
|
22
|
+
const bottom = "_bottom_geqni_103";
|
23
|
+
const opened = "_opened_geqni_112";
|
24
|
+
const overlay = "_overlay_geqni_168";
|
24
25
|
const cls = {
|
25
26
|
drawer,
|
26
27
|
content,
|
@@ -30,12 +31,13 @@ const cls = {
|
|
30
31
|
inner,
|
31
32
|
button,
|
32
33
|
footer,
|
33
|
-
"footer-button": "_footer-
|
34
|
+
"footer-button": "_footer-button_geqni_81",
|
34
35
|
left,
|
35
36
|
right,
|
37
|
+
full,
|
36
38
|
bottom,
|
37
39
|
opened,
|
38
|
-
"is-closing": "_is-
|
40
|
+
"is-closing": "_is-closing_geqni_131",
|
39
41
|
overlay
|
40
42
|
};
|
41
43
|
const ANIMATION_DELAY = 300;
|
@@ -2,6 +2,7 @@ var EDrawerPosition = /* @__PURE__ */ ((EDrawerPosition2) => {
|
|
2
2
|
EDrawerPosition2["LEFT"] = "left";
|
3
3
|
EDrawerPosition2["RIGHT"] = "right";
|
4
4
|
EDrawerPosition2["BOTTOM"] = "bottom";
|
5
|
+
EDrawerPosition2["FULL"] = "full";
|
5
6
|
return EDrawerPosition2;
|
6
7
|
})(EDrawerPosition || {});
|
7
8
|
export {
|
@@ -2,7 +2,7 @@ import "react/jsx-runtime";
|
|
2
2
|
import "../../index-CweZ_OcN.js";
|
3
3
|
import "react";
|
4
4
|
import "./constants.js";
|
5
|
-
import { I } from "../../Input-
|
5
|
+
import { I } from "../../Input-BFFPzelg.js";
|
6
6
|
import "../../hooks/useMergeRefs/useMergeRefs.js";
|
7
7
|
import "../../icons/Icon.js";
|
8
8
|
import "../Button/Button.js";
|
@@ -2,7 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
2
|
import { memo, forwardRef, useState } from "react";
|
3
3
|
import { Icon } from "../../icons/Icon.js";
|
4
4
|
import { Button } from "../Button/Button.js";
|
5
|
-
import { I as Input } from "../../Input-
|
5
|
+
import { I as Input } from "../../Input-BFFPzelg.js";
|
6
6
|
import '../../assets/InputPassword.css';const input = "_input_mam1g_2";
|
7
7
|
const wrapper = "_wrapper_mam1g_6";
|
8
8
|
const button = "_button_mam1g_17";
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
2
2
|
import { memo, forwardRef, useState, useCallback, useImperativeHandle } from "react";
|
3
3
|
import { getMaskedInputPhoneValue, getUnmaskedInputValue } from "./utils.js";
|
4
|
-
import { I as Input } from "../../Input-
|
4
|
+
import { I as Input } from "../../Input-BFFPzelg.js";
|
5
5
|
const InputPhoneNumber = memo(
|
6
6
|
forwardRef(
|
7
7
|
({ value = "", onChange, ...props }, ref) => {
|
@@ -0,0 +1,38 @@
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
2
|
+
import { c as classNames } from "../../index-CweZ_OcN.js";
|
3
|
+
import { ENotificationBadgeSize } from "./constants.js";
|
4
|
+
import '../../assets/NotificationBadge.css';const m = "_m_1rrs6_18";
|
5
|
+
const s = "_s_1rrs6_24";
|
6
|
+
const cls = {
|
7
|
+
"notification-badge": "_notification-badge_1rrs6_2",
|
8
|
+
"notification-badge-absolute": "_notification-badge-absolute_1rrs6_14",
|
9
|
+
m,
|
10
|
+
s
|
11
|
+
};
|
12
|
+
const NotificationBadge = ({
|
13
|
+
count,
|
14
|
+
position,
|
15
|
+
absolute,
|
16
|
+
size = ENotificationBadgeSize.M
|
17
|
+
}) => /* @__PURE__ */ jsx(
|
18
|
+
"div",
|
19
|
+
{
|
20
|
+
className: classNames(
|
21
|
+
cls["notification-badge"],
|
22
|
+
{
|
23
|
+
[cls["notification-badge-absolute"]]: absolute
|
24
|
+
},
|
25
|
+
cls[size]
|
26
|
+
),
|
27
|
+
style: {
|
28
|
+
top: position == null ? void 0 : position.top,
|
29
|
+
right: position == null ? void 0 : position.right,
|
30
|
+
bottom: position == null ? void 0 : position.bottom,
|
31
|
+
left: position == null ? void 0 : position.left
|
32
|
+
},
|
33
|
+
children: count
|
34
|
+
}
|
35
|
+
);
|
36
|
+
export {
|
37
|
+
NotificationBadge
|
38
|
+
};
|
@@ -0,0 +1,25 @@
|
|
1
|
+
import { ENotificationBadgeSize } from './constants';
|
2
|
+
|
3
|
+
export type TNotificationBadgeProps = {
|
4
|
+
/**
|
5
|
+
* Значение количества уведомлений.
|
6
|
+
*/
|
7
|
+
count: number;
|
8
|
+
/**
|
9
|
+
* Позиция для абсолютного позиционирования.
|
10
|
+
*/
|
11
|
+
position?: {
|
12
|
+
top?: string;
|
13
|
+
right?: string;
|
14
|
+
bottom?: string;
|
15
|
+
left?: string;
|
16
|
+
};
|
17
|
+
/**
|
18
|
+
* Абсолютное позиционирование.
|
19
|
+
*/
|
20
|
+
absolute?: boolean;
|
21
|
+
/**
|
22
|
+
* Размер NotificationBadge.
|
23
|
+
*/
|
24
|
+
size?: `${ENotificationBadgeSize}` | ENotificationBadgeSize;
|
25
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
|
@@ -3,7 +3,7 @@ import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
3
3
|
import { forwardRef, useImperativeHandle, Fragment } from "react";
|
4
4
|
import { ITEMS_PER_SEPARATOR, DEFAULT_VALUE_LENGTH } from "./constants.js";
|
5
5
|
import { useOTPInput } from "./hooks.js";
|
6
|
-
import { I as Input } from "../../Input-
|
6
|
+
import { I as Input } from "../../Input-BFFPzelg.js";
|
7
7
|
import '../../assets/OtpInput.css';const otp = "_otp_196ev_3";
|
8
8
|
const input = "_input_196ev_14";
|
9
9
|
const separator = "_separator_196ev_28";
|
@@ -4,8 +4,8 @@ import * as React from "react";
|
|
4
4
|
import React__default, { useReducer, useMemo, useSyncExternalStore, useId as useId$1, useEffect, useCallback, useRef, useLayoutEffect, createContext, useContext, useState, Fragment, createRef, forwardRef } from "react";
|
5
5
|
import { ESelectSearchSize } from "./constants.js";
|
6
6
|
import { Icon } from "../../icons/Icon.js";
|
7
|
-
import { I as Input } from "../../Input-
|
8
|
-
import { EInputSize } from "../Input/constants.js";
|
7
|
+
import { I as Input } from "../../Input-BFFPzelg.js";
|
8
|
+
import { EInputVariant, EInputSize } from "../Input/constants.js";
|
9
9
|
import { n as n$2, u as u$3, d as o$1, s as s$3, o as o$2, p as p$1, t as t$3, e as s$4, W as W$1, y as y$3, T, H, M as M$1, a as u$5, $ as $f7dceffc5ad7768b$export$4e328f61c538687f, b as $6179b936705e76d3$export$ae780daf29e6d456, D as D$2, c as o$3 } from "../../keyboard-B256ZoM-.js";
|
10
10
|
import * as ReactDOM from "react-dom";
|
11
11
|
import { flushSync, createPortal } from "react-dom";
|
@@ -1991,13 +1991,13 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
|
|
1991
1991
|
const iframeRect = currentIFrame.getBoundingClientRect();
|
1992
1992
|
const css = getComputedStyle$1(currentIFrame);
|
1993
1993
|
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
1994
|
-
const
|
1994
|
+
const top2 = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
1995
1995
|
x2 *= iframeScale.x;
|
1996
1996
|
y2 *= iframeScale.y;
|
1997
1997
|
width *= iframeScale.x;
|
1998
1998
|
height *= iframeScale.y;
|
1999
1999
|
x2 += left;
|
2000
|
-
y2 +=
|
2000
|
+
y2 += top2;
|
2001
2001
|
currentWin = getWindow(currentIFrame);
|
2002
2002
|
currentIFrame = currentWin.frameElement;
|
2003
2003
|
}
|
@@ -2097,13 +2097,13 @@ function getViewportRect(element, strategy) {
|
|
2097
2097
|
}
|
2098
2098
|
function getInnerBoundingClientRect(element, strategy) {
|
2099
2099
|
const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
|
2100
|
-
const
|
2100
|
+
const top2 = clientRect.top + element.clientTop;
|
2101
2101
|
const left = clientRect.left + element.clientLeft;
|
2102
2102
|
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
|
2103
2103
|
const width = element.clientWidth * scale.x;
|
2104
2104
|
const height = element.clientHeight * scale.y;
|
2105
2105
|
const x2 = left * scale.x;
|
2106
|
-
const y2 =
|
2106
|
+
const y2 = top2 * scale.y;
|
2107
2107
|
return {
|
2108
2108
|
width,
|
2109
2109
|
height,
|
@@ -2313,7 +2313,7 @@ function observeMove(element, onMove) {
|
|
2313
2313
|
cleanup();
|
2314
2314
|
const {
|
2315
2315
|
left,
|
2316
|
-
top,
|
2316
|
+
top: top2,
|
2317
2317
|
width,
|
2318
2318
|
height
|
2319
2319
|
} = element.getBoundingClientRect();
|
@@ -2323,9 +2323,9 @@ function observeMove(element, onMove) {
|
|
2323
2323
|
if (!width || !height) {
|
2324
2324
|
return;
|
2325
2325
|
}
|
2326
|
-
const insetTop = floor(
|
2326
|
+
const insetTop = floor(top2);
|
2327
2327
|
const insetRight = floor(root.clientWidth - (left + width));
|
2328
|
-
const insetBottom = floor(root.clientHeight - (
|
2328
|
+
const insetBottom = floor(root.clientHeight - (top2 + height));
|
2329
2329
|
const insetLeft = floor(left);
|
2330
2330
|
const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
|
2331
2331
|
const options2 = {
|
@@ -3752,29 +3752,35 @@ function No(o2, r2) {
|
|
3752
3752
|
return H({ ourProps: { id: d2, ref: M2, role: "option", tabIndex: s2 === true ? void 0 : -1, "aria-disabled": s2 === true ? true : void 0, "aria-selected": C, disabled: void 0, onMouseDown: y2, onFocus: A2, onPointerEnter: h2, onMouseEnter: h2, onPointerMove: O, onMouseMove: O, onPointerLeave: G2, onMouseLeave: G2 }, theirProps: a3, slot: J2, defaultTag: ko, name: "Combobox.Option" });
|
3753
3753
|
}
|
3754
3754
|
let Uo = W$1(ho), Ho = W$1(Vo), Go = W$1(Mo), jo = K, zo = W$1(Bo), Ko = W$1(No), Nt = Object.assign(Uo, { Input: Go, Button: Ho, Label: jo, Options: zo, Option: Ko });
|
3755
|
-
const
|
3756
|
-
const
|
3757
|
-
const
|
3758
|
-
const
|
3759
|
-
const
|
3760
|
-
const
|
3761
|
-
const
|
3755
|
+
const disabled = "_disabled_3ezsa_5";
|
3756
|
+
const container = "_container_3ezsa_9";
|
3757
|
+
const full = "_full_3ezsa_22";
|
3758
|
+
const button = "_button_3ezsa_30";
|
3759
|
+
const options = "_options_3ezsa_42";
|
3760
|
+
const top = "_top_3ezsa_52";
|
3761
|
+
const bottom = "_bottom_3ezsa_57";
|
3762
|
+
const m = "_m_3ezsa_84";
|
3763
|
+
const l = "_l_3ezsa_95";
|
3764
|
+
const option = "_option_3ezsa_42";
|
3762
3765
|
const cls = {
|
3763
|
-
"select-search": "_select-
|
3766
|
+
"select-search": "_select-search_3ezsa_2",
|
3767
|
+
disabled,
|
3764
3768
|
container,
|
3765
|
-
"container-open": "_container-
|
3769
|
+
"container-open": "_container-open_3ezsa_18",
|
3766
3770
|
full,
|
3767
|
-
"selector-icon-open": "_selector-icon-
|
3771
|
+
"selector-icon-open": "_selector-icon-open_3ezsa_26",
|
3768
3772
|
button,
|
3769
3773
|
options,
|
3770
|
-
|
3774
|
+
top,
|
3775
|
+
bottom,
|
3776
|
+
"no-options": "_no-options_3ezsa_78",
|
3771
3777
|
m,
|
3772
3778
|
l,
|
3773
|
-
"custom-input-class": "_custom-input-
|
3779
|
+
"custom-input-class": "_custom-input-class_3ezsa_106",
|
3774
3780
|
option,
|
3775
|
-
"option-active": "_option-
|
3776
|
-
"option-inner": "_option-
|
3777
|
-
"selected-icon": "_selected-
|
3781
|
+
"option-active": "_option-active_3ezsa_122",
|
3782
|
+
"option-inner": "_option-inner_3ezsa_125",
|
3783
|
+
"selected-icon": "_selected-icon_3ezsa_132"
|
3778
3784
|
};
|
3779
3785
|
const SelectSearch = forwardRef(
|
3780
3786
|
(props, ref) => {
|
@@ -3789,7 +3795,10 @@ const SelectSearch = forwardRef(
|
|
3789
3795
|
classNameOption,
|
3790
3796
|
displayValue = "name",
|
3791
3797
|
filterOnSearch = true,
|
3792
|
-
onSearch
|
3798
|
+
onSearch,
|
3799
|
+
variant = EInputVariant.DefaultGray,
|
3800
|
+
menuPlacement = "bottom",
|
3801
|
+
disabled: disabled2 = false
|
3793
3802
|
} = props;
|
3794
3803
|
const [inputValue, setInputValue] = useState("");
|
3795
3804
|
const mapSizeToInputSize = (size22) => {
|
@@ -3828,9 +3837,13 @@ const SelectSearch = forwardRef(
|
|
3828
3837
|
{
|
3829
3838
|
as: "div",
|
3830
3839
|
value,
|
3831
|
-
className: classNames(cls["select-search"], {
|
3840
|
+
className: classNames(cls["select-search"], {
|
3841
|
+
[cls.full]: full2,
|
3842
|
+
[cls.disabled]: disabled2
|
3843
|
+
}),
|
3832
3844
|
onChange: handleOneChange,
|
3833
3845
|
ref,
|
3846
|
+
disabled: disabled2,
|
3834
3847
|
virtual: { options: filteredItems },
|
3835
3848
|
children: ({ open }) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
|
3836
3849
|
/* @__PURE__ */ jsxs(
|
@@ -3848,10 +3861,12 @@ const SelectSearch = forwardRef(
|
|
3848
3861
|
size: mapSizeToInputSize(size2),
|
3849
3862
|
className: cls["custom-input-class"],
|
3850
3863
|
onChange: handleInputChange,
|
3851
|
-
value: inputValue
|
3864
|
+
value: inputValue,
|
3865
|
+
disabled: disabled2,
|
3866
|
+
variant
|
3852
3867
|
}
|
3853
3868
|
),
|
3854
|
-
showArrow && /* @__PURE__ */ jsx(Ho, { className: cls.button, children: /* @__PURE__ */ jsx(
|
3869
|
+
showArrow && /* @__PURE__ */ jsx(Ho, { className: cls.button, disabled: disabled2, children: /* @__PURE__ */ jsx(
|
3855
3870
|
Icon,
|
3856
3871
|
{
|
3857
3872
|
iconName: size2 == ESelectSearchSize.M ? "DropdownArrowBottom16px" : "DropdownArrowDown24px",
|
@@ -3886,7 +3901,11 @@ const SelectSearch = forwardRef(
|
|
3886
3901
|
) : /* @__PURE__ */ jsx(
|
3887
3902
|
zo,
|
3888
3903
|
{
|
3889
|
-
className: classNames(
|
3904
|
+
className: classNames(
|
3905
|
+
cls.options,
|
3906
|
+
cls[size2],
|
3907
|
+
cls[menuPlacement]
|
3908
|
+
),
|
3890
3909
|
children: ({ option: item }) => /* @__PURE__ */ jsx(
|
3891
3910
|
Ko,
|
3892
3911
|
{
|
@@ -1,5 +1,6 @@
|
|
1
1
|
import { ReactNode } from 'react';
|
2
2
|
import { ESelectSearchSize } from './constants';
|
3
|
+
import { TVariant } from '../Input';
|
3
4
|
|
4
5
|
export type TSelectOption = {
|
5
6
|
name: string;
|
@@ -7,6 +8,7 @@ export type TSelectOption = {
|
|
7
8
|
bottom?: ReactNode;
|
8
9
|
[index: string]: unknown;
|
9
10
|
};
|
11
|
+
export type TMenuPlacement = 'top' | 'bottom';
|
10
12
|
export type TSelectSearchProps = {
|
11
13
|
/**
|
12
14
|
* Текущее выбранное значение.
|
@@ -42,4 +44,10 @@ export type TSelectSearchProps = {
|
|
42
44
|
items: TSelectOption[];
|
43
45
|
/** Класснейм для значения */
|
44
46
|
classNameOption?: string;
|
47
|
+
/** Варианты отображения ввода */
|
48
|
+
variant?: TVariant;
|
49
|
+
/** Варианты отображения выпадающего меню */
|
50
|
+
menuPlacement?: TMenuPlacement;
|
51
|
+
/** Отключает компонент SelectSearch */
|
52
|
+
disabled?: boolean;
|
45
53
|
};
|
@@ -1,6 +1,9 @@
|
|
1
1
|
import { CheckboxProps } from '@headlessui/react';
|
2
|
+
import { ReactNode } from 'react';
|
2
3
|
|
3
|
-
export type TSwitchProps = CheckboxProps
|
4
|
+
export type TSwitchProps = CheckboxProps & {
|
5
|
+
children?: ReactNode;
|
6
|
+
};
|
4
7
|
export declare const Switch: import('react').ForwardRefExoticComponent<{
|
5
8
|
suppressHydrationWarning?: boolean | undefined;
|
6
9
|
color?: string | undefined;
|
@@ -259,7 +262,7 @@ export declare const Switch: import('react').ForwardRefExoticComponent<{
|
|
259
262
|
is?: string | undefined;
|
260
263
|
} & {
|
261
264
|
as?: "span" | undefined;
|
262
|
-
children?:
|
265
|
+
children?: ReactNode | ((bag: {
|
263
266
|
checked: boolean;
|
264
267
|
changing: boolean;
|
265
268
|
focus: boolean;
|
@@ -291,4 +294,6 @@ export declare const Switch: import('react').ForwardRefExoticComponent<{
|
|
291
294
|
form?: string;
|
292
295
|
name?: string;
|
293
296
|
onChange?: (checked: boolean) => void;
|
297
|
+
} & {
|
298
|
+
children?: ReactNode;
|
294
299
|
} & import('react').RefAttributes<HTMLInputElement>>;
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import { jsx } from "react/jsx-runtime";
|
1
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
2
2
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
3
3
|
import React__default, { useId, useState, useMemo, useCallback, forwardRef, useEffect } from "react";
|
4
4
|
import { Icon } from "../../icons/Icon.js";
|
@@ -23,14 +23,18 @@ function ie(T$1, h) {
|
|
23
23
|
return React__default.createElement(React__default.Fragment, null, d != null && React__default.createElement(j, { disabled: e, data: { [d]: D$1 || "on" }, overrides: { type: "checkbox", checked: a$1 }, form: R, onReset: G$1 }), H({ ourProps: O, theirProps: A, slot: X, defaultTag: se, name: "Checkbox" }));
|
24
24
|
}
|
25
25
|
let Re = W(ie);
|
26
|
-
const
|
26
|
+
const container = "_container_18cvn_2";
|
27
|
+
const label = "_label_18cvn_27";
|
28
|
+
const enabled = "_enabled_18cvn_31";
|
27
29
|
const cls = {
|
28
|
-
|
30
|
+
container,
|
31
|
+
"switch": "_switch_18cvn_8",
|
32
|
+
label,
|
29
33
|
enabled
|
30
34
|
};
|
31
35
|
const Switch = forwardRef(
|
32
36
|
(props, ref) => {
|
33
|
-
const { checked, onChange, ...restProps } = props;
|
37
|
+
const { checked, onChange, children, ...restProps } = props;
|
34
38
|
const [enabled2, setEnabled] = useState(checked);
|
35
39
|
const handleChange = (value) => {
|
36
40
|
setEnabled(value);
|
@@ -39,19 +43,22 @@ const Switch = forwardRef(
|
|
39
43
|
useEffect(() => {
|
40
44
|
setEnabled(!!checked);
|
41
45
|
}, [checked]);
|
42
|
-
return /* @__PURE__ */
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
46
|
+
return /* @__PURE__ */ jsxs("div", { className: cls.container, children: [
|
47
|
+
/* @__PURE__ */ jsx(
|
48
|
+
Re,
|
49
|
+
{
|
50
|
+
ref,
|
51
|
+
checked: enabled2,
|
52
|
+
onChange: handleChange,
|
53
|
+
className: classNames(cls.switch, {
|
54
|
+
[cls.enabled]: enabled2
|
55
|
+
}),
|
56
|
+
...restProps,
|
57
|
+
children: /* @__PURE__ */ jsx(Icon, { iconName: "Done16px" })
|
58
|
+
}
|
59
|
+
),
|
60
|
+
children && /* @__PURE__ */ jsx("div", { className: cls.label, children })
|
61
|
+
] });
|
55
62
|
}
|
56
63
|
);
|
57
64
|
export {
|
@@ -1,11 +1,35 @@
|
|
1
1
|
import { ETabTrailSize } from './constants';
|
2
2
|
|
3
3
|
export type TCategoryTab = {
|
4
|
+
/**
|
5
|
+
* Наименование таба.
|
6
|
+
*/
|
4
7
|
name: string;
|
8
|
+
/**
|
9
|
+
* Контент, который будет отображать таб.
|
10
|
+
*/
|
5
11
|
content: React.ReactNode;
|
12
|
+
/**
|
13
|
+
* Количество уведомлений для компонента NotificationBadge.
|
14
|
+
*/
|
15
|
+
notificationCount?: number;
|
6
16
|
};
|
7
17
|
export type TTabTrailProps = {
|
18
|
+
/**
|
19
|
+
* Массив категорий, каждая из которых содержит контент.
|
20
|
+
*/
|
8
21
|
categories: TCategoryTab[];
|
22
|
+
/**
|
23
|
+
* Размер TabTrail. Допустимые значения: M, S.
|
24
|
+
*/
|
9
25
|
size?: ETabTrailSize;
|
26
|
+
/**
|
27
|
+
* Показывать ли кнопки навигации.
|
28
|
+
*/
|
29
|
+
showButtons?: boolean;
|
30
|
+
/**
|
31
|
+
* Класснейм для TabTrail.
|
32
|
+
*/
|
33
|
+
className?: string;
|
10
34
|
};
|
11
35
|
export declare const TabTrail: import('react').ForwardRefExoticComponent<TTabTrailProps & import('react').RefAttributes<HTMLElement>>;
|
@@ -4,8 +4,7 @@ import * as React from "react";
|
|
4
4
|
import React__default, { useRef, useState, createContext, useReducer, useMemo, useId, useContext, forwardRef, useEffect } from "react";
|
5
5
|
import { ETabTrailSize } from "./constants.js";
|
6
6
|
import { TabButtons } from "./TabButtons/TabButtons.js";
|
7
|
-
import {
|
8
|
-
import { EMediaQuery } from "../../hooks/useMediaQuery/constants.js";
|
7
|
+
import { NotificationBadge } from "../NotificationBadge/NotificationBadge.js";
|
9
8
|
import { n, M, W, s as s$3, y, o, H, $ as $f7dceffc5ad7768b$export$4e328f61c538687f, b as $6179b936705e76d3$export$ae780daf29e6d456, D, a as u, u as u$1, c as o$1, t } from "../../keyboard-B256ZoM-.js";
|
10
9
|
import { w } from "../../use-active-press-B6yeSopF.js";
|
11
10
|
import { T as T$1 } from "../../use-resolve-button-type-B6LE6gU3.js";
|
@@ -200,18 +199,18 @@ function He(e, r) {
|
|
200
199
|
return !s2 && ((g = n$1.unmount) == null || g) && !((R = n$1.static) != null && R) ? React__default.createElement(T, { "aria-hidden": "true", ...m2 }) : H({ ourProps: m2, theirProps: n$1, slot: b2, defaultTag: Ge, features: Ue, visible: s2, name: "Tabs.Panel" });
|
201
200
|
}
|
202
201
|
let we = W(ve), Oe = W(Se), Ne = W(Ie), ke = W(Me), Be = W(He), st = Object.assign(we, { Group: Oe, List: Ne, Panels: ke, Panel: Be });
|
203
|
-
const container = "
|
204
|
-
const group = "
|
205
|
-
const tab = "
|
206
|
-
const list = "
|
207
|
-
const tabs = "
|
208
|
-
const buttons = "
|
209
|
-
const m = "
|
210
|
-
const s = "
|
202
|
+
const container = "_container_5jk4g_2";
|
203
|
+
const group = "_group_5jk4g_6";
|
204
|
+
const tab = "_tab_5jk4g_16";
|
205
|
+
const list = "_list_5jk4g_51";
|
206
|
+
const tabs = "_tabs_5jk4g_62";
|
207
|
+
const buttons = "_buttons_5jk4g_68";
|
208
|
+
const m = "_m_5jk4g_75";
|
209
|
+
const s = "_s_5jk4g_82";
|
211
210
|
const cls = {
|
212
211
|
container,
|
213
212
|
group,
|
214
|
-
"group-inner": "_group-
|
213
|
+
"group-inner": "_group-inner_5jk4g_10",
|
215
214
|
tab,
|
216
215
|
list,
|
217
216
|
tabs,
|
@@ -220,10 +219,9 @@ const cls = {
|
|
220
219
|
s
|
221
220
|
};
|
222
221
|
const TabTrail = forwardRef(
|
223
|
-
({ categories, size = ETabTrailSize.M }, ref) => {
|
222
|
+
({ categories, size = ETabTrailSize.M, showButtons = true, className }, ref) => {
|
224
223
|
const [activeIndex, setActiveIndex] = useState(0);
|
225
224
|
const tabListRef = useRef(null);
|
226
|
-
const isTablet = useMediaQuery(EMediaQuery.S);
|
227
225
|
const handleNext = () => {
|
228
226
|
setActiveIndex((prevIndex) => (prevIndex + 1) % categories.length);
|
229
227
|
};
|
@@ -249,21 +247,24 @@ const TabTrail = forwardRef(
|
|
249
247
|
Oe,
|
250
248
|
{
|
251
249
|
ref,
|
252
|
-
className: classNames(cls.group, cls[size]),
|
250
|
+
className: classNames(cls.group, cls[size], className),
|
253
251
|
selectedIndex: activeIndex,
|
254
252
|
onChange: setActiveIndex,
|
255
253
|
children: [
|
256
254
|
/* @__PURE__ */ jsxs("div", { className: cls["group-inner"], children: [
|
257
|
-
/* @__PURE__ */ jsx(Ne, { ref: tabListRef, className: cls.list, children: /* @__PURE__ */ jsx("div", { className: cls.tabs, children: categories.map(({ name }, index) => /* @__PURE__ */
|
255
|
+
/* @__PURE__ */ jsx(Ne, { ref: tabListRef, className: cls.list, children: /* @__PURE__ */ jsx("div", { className: cls.tabs, children: categories.map(({ name, notificationCount }, index) => /* @__PURE__ */ jsxs(
|
258
256
|
st,
|
259
257
|
{
|
260
258
|
className: `${cls.tab} ${activeIndex === index ? 'data-active="true"' : ""}`,
|
261
259
|
"data-active": activeIndex === index,
|
262
|
-
children:
|
260
|
+
children: [
|
261
|
+
name,
|
262
|
+
notificationCount && /* @__PURE__ */ jsx(NotificationBadge, { count: notificationCount, size: "m" })
|
263
|
+
]
|
263
264
|
},
|
264
265
|
name
|
265
266
|
)) }) }),
|
266
|
-
|
267
|
+
showButtons && /* @__PURE__ */ jsx("div", { className: cls.buttons, children: /* @__PURE__ */ jsx(
|
267
268
|
TabButtons,
|
268
269
|
{
|
269
270
|
handlePrevTab: handlePrev,
|
@@ -5,7 +5,7 @@ import { useAutoResizeTextArea } from "./hooks.js";
|
|
5
5
|
import { useMergeRefs } from "../../hooks/useMergeRefs/useMergeRefs.js";
|
6
6
|
import { Icon } from "../../icons/Icon.js";
|
7
7
|
import { Button } from "../Button/Button.js";
|
8
|
-
import { c as cls } from "../../Input-
|
8
|
+
import { c as cls } from "../../Input-BFFPzelg.js";
|
9
9
|
import { EInputVariant } from "../Input/constants.js";
|
10
10
|
import '../../assets/TextArea.css';const textarea = "_textarea_46c4k_2";
|
11
11
|
const s = "_s_46c4k_6";
|
@@ -62,7 +62,6 @@ const TextArea = memo(
|
|
62
62
|
id,
|
63
63
|
onFocus,
|
64
64
|
onBlur,
|
65
|
-
onChange,
|
66
65
|
label,
|
67
66
|
withClearButton,
|
68
67
|
disabled,
|
@@ -105,10 +104,11 @@ const TextArea = memo(
|
|
105
104
|
}
|
106
105
|
};
|
107
106
|
const handleChange = (event) => {
|
107
|
+
var _a;
|
108
108
|
const targetValue = event.target.value;
|
109
109
|
setWithValue(!!targetValue);
|
110
110
|
handleResize();
|
111
|
-
onChange == null ? void 0 :
|
111
|
+
(_a = otherProps == null ? void 0 : otherProps.onChange) == null ? void 0 : _a.call(otherProps, event);
|
112
112
|
};
|
113
113
|
const currentLeftAddon = renderAddon(leftAddon);
|
114
114
|
const currentRightAddon = renderAddon(rightAddon);
|
@@ -38,3 +38,6 @@ export type { TUploaderPhotos, TOnChangePhotosUpdate } from './UploaderPhotos';
|
|
38
38
|
export { Uploader } from './Uploader';
|
39
39
|
export type { TUploadValue, TFileItem } from './Uploader';
|
40
40
|
export { ELinkSize, ELinkVariant, Link } from './AnchorLink';
|
41
|
+
export { NotificationBadge } from './NotificationBadge';
|
42
|
+
export type { TNotificationBadgeProps } from './NotificationBadge';
|
43
|
+
export { ENotificationBadgeSize } from './NotificationBadge';
|
package/dist/components/index.js
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
import { Button } from "./Button/Button.js";
|
2
2
|
import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./Button/constants.js";
|
3
|
-
import { I } from "../Input-
|
3
|
+
import { I } from "../Input-BFFPzelg.js";
|
4
4
|
import { EInputSize, EInputVariant } from "./Input/constants.js";
|
5
5
|
import { TextArea } from "./TextArea/TextArea.js";
|
6
6
|
import { InputPassword } from "./InputPassword/InputPassword.js";
|
@@ -39,6 +39,8 @@ import { UploaderPhotos } from "./UploaderPhotos/UploaderPhotos.js";
|
|
39
39
|
import { Uploader } from "./Uploader/Uploader.js";
|
40
40
|
import { Link } from "./AnchorLink/AnchorLink.js";
|
41
41
|
import { ELinkSize, ELinkVariant } from "./AnchorLink/constants.js";
|
42
|
+
import { NotificationBadge } from "./NotificationBadge/NotificationBadge.js";
|
43
|
+
import { ENotificationBadgeSize } from "./NotificationBadge/constants.js";
|
42
44
|
export {
|
43
45
|
Accordion,
|
44
46
|
AccordionItem,
|
@@ -57,6 +59,7 @@ export {
|
|
57
59
|
ELinkSize,
|
58
60
|
ELinkVariant,
|
59
61
|
EMergedButtonVariantRound,
|
62
|
+
ENotificationBadgeSize,
|
60
63
|
ESelectSearchSize,
|
61
64
|
EStepsPrimaryColor,
|
62
65
|
EStepsSecondaryColor,
|
@@ -74,6 +77,7 @@ export {
|
|
74
77
|
Link,
|
75
78
|
Loader,
|
76
79
|
MergedButton,
|
80
|
+
NotificationBadge,
|
77
81
|
OtpInput,
|
78
82
|
Pagination,
|
79
83
|
RadioGroup,
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import { EMediaQuery } from './constants';
|
1
|
+
import { EMediaQuery, EMinMediaQuery } from './constants';
|
2
2
|
|
3
3
|
/**
|
4
4
|
* @name useMediaQuery
|
@@ -11,4 +11,4 @@ import { EMediaQuery } from './constants';
|
|
11
11
|
* @example
|
12
12
|
* const matches = useMediaQuery('(max-width: 768px)');
|
13
13
|
*/
|
14
|
-
export declare const useMediaQuery: (query: EMediaQuery | `${EMediaQuery}`) => boolean;
|
14
|
+
export declare const useMediaQuery: (query: EMediaQuery | `${EMediaQuery}` | EMinMediaQuery | `${EMinMediaQuery}`) => boolean;
|
package/dist/index.js
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
import { Button } from "./components/Button/Button.js";
|
2
2
|
import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./components/Button/constants.js";
|
3
|
-
import { I } from "./Input-
|
3
|
+
import { I } from "./Input-BFFPzelg.js";
|
4
4
|
import { EInputSize, EInputVariant } from "./components/Input/constants.js";
|
5
5
|
import { TextArea } from "./components/TextArea/TextArea.js";
|
6
6
|
import { InputPassword } from "./components/InputPassword/InputPassword.js";
|
@@ -39,6 +39,8 @@ import { UploaderPhotos } from "./components/UploaderPhotos/UploaderPhotos.js";
|
|
39
39
|
import { Uploader } from "./components/Uploader/Uploader.js";
|
40
40
|
import { Link } from "./components/AnchorLink/AnchorLink.js";
|
41
41
|
import { ELinkSize, ELinkVariant } from "./components/AnchorLink/constants.js";
|
42
|
+
import { NotificationBadge } from "./components/NotificationBadge/NotificationBadge.js";
|
43
|
+
import { ENotificationBadgeSize } from "./components/NotificationBadge/constants.js";
|
42
44
|
import { useMediaQuery } from "./hooks/useMediaQuery/useMediaQuery.js";
|
43
45
|
import { EMediaQuery, EMinMediaQuery } from "./hooks/useMediaQuery/constants.js";
|
44
46
|
import { useLockBodyScroll } from "./hooks/useLockBodyScroll/useLockBodyScroll.js";
|
@@ -68,6 +70,7 @@ import './assets/index.css';export {
|
|
68
70
|
EMediaQuery,
|
69
71
|
EMergedButtonVariantRound,
|
70
72
|
EMinMediaQuery,
|
73
|
+
ENotificationBadgeSize,
|
71
74
|
ESelectSearchSize,
|
72
75
|
EStepsPrimaryColor,
|
73
76
|
EStepsSecondaryColor,
|
@@ -86,6 +89,7 @@ import './assets/index.css';export {
|
|
86
89
|
Link,
|
87
90
|
Loader,
|
88
91
|
MergedButton,
|
92
|
+
NotificationBadge,
|
89
93
|
OtpInput,
|
90
94
|
Pagination,
|
91
95
|
RadioGroup,
|