@megafon/ui-core 9.0.0 → 9.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/dist/es/components/Link/Link.d.ts +2 -0
  2. package/dist/es/components/Link/Link.js +3 -1
  3. package/dist/es/components/Modal/Modal.d.ts +4 -0
  4. package/dist/es/components/Modal/Modal.js +4 -0
  5. package/dist/es/components/Modal/_ModalContent/ModalContent.css +1 -1
  6. package/dist/es/components/Modal/_ModalContent/ModalContent.js +11 -3
  7. package/dist/es/components/Modal/types.d.ts +1 -1
  8. package/dist/es/components/SectionAccordionGroup/SectionAccordionGroup.css +1 -1
  9. package/dist/es/components/Tile/Tile.d.ts +2 -0
  10. package/dist/es/components/Tile/Tile.js +3 -1
  11. package/dist/lib/components/Link/Link.d.ts +2 -0
  12. package/dist/lib/components/Link/Link.js +3 -1
  13. package/dist/lib/components/Modal/Modal.d.ts +4 -0
  14. package/dist/lib/components/Modal/Modal.js +4 -0
  15. package/dist/lib/components/Modal/_ModalContent/ModalContent.css +1 -1
  16. package/dist/lib/components/Modal/_ModalContent/ModalContent.js +11 -3
  17. package/dist/lib/components/Modal/types.d.ts +1 -1
  18. package/dist/lib/components/SectionAccordionGroup/SectionAccordionGroup.css +1 -1
  19. package/dist/lib/components/Tile/Tile.d.ts +2 -0
  20. package/dist/lib/components/Tile/Tile.js +3 -1
  21. package/package.json +2 -2
package/dist/es/components/Link/Link.d.ts CHANGED
@@ -1,6 +1,8 @@
1
1
  import * as React from 'react';
2
2
  import './Link.scss';
3
3
  export interface ILinkProps {
4
+ /** Индекс для навигации через tab */
5
+ tabIndex?: number;
4
6
  /** Дополнительный класс корневого элемента */
5
7
  className?: string;
6
8
  /** Ссылка */
package/dist/es/components/Link/Link.js CHANGED
@@ -4,7 +4,8 @@ import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
4
4
  import "./Link.css";
5
5
  var cn = cnCreate('mfui-9-link');
6
6
  var Link = function Link(_ref) {
7
- var target = _ref.target,
7
+ var tabIndex = _ref.tabIndex,
8
+ target = _ref.target,
8
9
  href = _ref.href,
9
10
  rel = _ref.rel,
10
11
  onClick = _ref.onClick,
@@ -15,6 +16,7 @@ var Link = function Link(_ref) {
15
16
  dataAttrs = _ref.dataAttrs;
16
17
  return /*#__PURE__*/React.createElement("a", _extends({
17
18
  className: cn([className]),
19
+ tabIndex: tabIndex,
18
20
  href: href,
19
21
  target: target,
20
22
  rel: rel,
package/dist/es/components/Modal/Modal.d.ts CHANGED
@@ -91,6 +91,10 @@ export interface IModalProps {
91
91
  headerProps?: ModalHeaderPropsType;
92
92
  /** Настройки для футера модального окна */
93
93
  footerProps?: ModalFooterPropsType;
94
+ /** Ширина модального окна на разрешении 767- */
95
+ desktopWidth?: 'small' | 'medium';
96
+ /** Внутренний отступ контента без шапки и футера на разрешении 767- */
97
+ contentPadding?: 'small' | 'large';
94
98
  /** Вид модального окна на разрешении 767- */
95
99
  mobileView?: ModalMobileViewsType;
96
100
  /** Включить дефолтный скролл (отключает кастомный компонент скролла) */
package/dist/es/components/Modal/Modal.js CHANGED
@@ -39,6 +39,8 @@ var Modal = function Modal(_ref) {
39
39
  isOpened = _ref.isOpened,
40
40
  headerProps = _ref.headerProps,
41
41
  footerProps = _ref.footerProps,
42
+ desktopWidth = _ref.desktopWidth,
43
+ contentPadding = _ref.contentPadding,
42
44
  _ref$mobileView = _ref.mobileView,
43
45
  mobileView = _ref$mobileView === void 0 ? ModalMobileViews.FULL_SCREEN : _ref$mobileView,
44
46
  isEnabledNativeScroll = _ref.isEnabledNativeScroll,
@@ -258,6 +260,8 @@ var Modal = function Modal(_ref) {
258
260
  }),
259
261
  headerProps: headerProps,
260
262
  footerProps: footerProps,
263
+ desktopWidth: desktopWidth,
264
+ contentPadding: contentPadding,
261
265
  refs: {
262
266
  overlayRef: overlayRef,
263
267
  headerRef: headerRef,
package/dist/es/components/Modal/_ModalContent/ModalContent.css CHANGED
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-9-modal-content__background{background-color:rgba(0,0,0,.8);bottom:0;left:0;position:fixed;right:0;top:0}.mfui-9-modal-content__container-wrap{-webkit-animation:show-popup .3s ease-out;animation:show-popup .3s ease-out;position:relative;width:100%}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap{-webkit-transition:height .1s;transition:height .1s;width:740px}}.mfui-9-modal-content__container-inner{background-color:var(--background);font-family:inherit;width:100%}.mfui-9-modal-content__container-inner_native-scroll{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media screen and (min-width:768px){.mfui-9-modal-content__container-inner_native-scroll{max-height:80vh}}.mfui-9-modal-content__header{position:relative}.mfui-9-modal-content__header_shadow{-webkit-box-shadow:0 2px 12px rgba(0,0,0,.1);box-shadow:0 2px 12px rgba(0,0,0,.1)}.mfui-9-modal-content__header_gray{background-color:var(--backgroundGray)}.mfui-9-modal-content__header_native-scroll{background-color:var(--background);border-radius:12px;position:sticky;top:0}.mfui-9-modal-content__header-main{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-height:64px}@media screen and (min-width:768px){.mfui-9-modal-content__header-main{min-height:64px}}.mfui-9-modal-content__header-custom-content{width:100%}.mfui-9-modal-content__header-button{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:12px;z-index:2;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background:transparent;border:none;cursor:pointer;height:44px;justify-content:center;outline:none;width:44px}.mfui-9-modal-content__header-button_back{left:14px}@media screen and (max-width:767px){.mfui-9-modal-content__header-button_back{left:10px;top:10px}}.mfui-9-modal-content__header-button_close{right:18px}@media screen and (max-width:767px){.mfui-9-modal-content__header-button_close{right:10px;top:10px}}.mfui-9-modal-content__header-inner{background-color:var(--spbSky0);border-radius:12px;height:32px;position:relative;-webkit-transition:background-color .3s;transition:background-color .3s;width:32px}.mfui-9-modal-content__header-inner:focus-visible{-webkit-animation:focus-outline-shrink .3s linear forwards;animation:focus-outline-shrink .3s linear forwards;outline-offset:2px}@-webkit-keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}@keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}.mfui-9-modal-content__header-inner:focus{outline:none}.mfui-9-modal-content__header-inner:hover{background-color:var(--spbSky1)}.mfui-9-modal-content__header-inner:active{background-color:var(--spbSky2)}.mfui-9-modal-content__header-icon{height:32px;min-width:32px;width:32px;fill:var(--content)}.mfui-9-modal-content__title-area{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 48px;padding:12px}@media screen and (min-width:768px){.mfui-9-modal-content__title-area{margin:0 56px;padding:16px}}.mfui-9-modal-content__title{font-size:18px;font-weight:500;letter-spacing:.5px;line-height:24px;text-align:center}@media screen and (min-width:1280px){.mfui-9-modal-content__title{font-size:20px;line-height:28px}}@media screen and (min-width:768px){.mfui-9-modal-content__title{font-size:20px;font-weight:500;letter-spacing:.5px;line-height:28px}}.mfui-9-modal-content__header-additional{-webkit-box-sizing:border-box;box-sizing:border-box;padding:8px 16px;text-align:center}@media screen and (min-width:768px){.mfui-9-modal-content__header-additional{padding-left:32px;padding-right:32px}}.mfui-9-modal-content__container-body{-webkit-box-sizing:border-box;box-sizing:border-box;padding-bottom:24px;padding-right:6px}@media screen and (min-width:768px){.mfui-9-modal-content__container-body{padding-bottom:24px;padding-right:12px}}.mfui-9-modal-content__container-body_native-scroll{-webkit-box-flex:1;-ms-flex-positive:1;background-color:var(--base);border-bottom-left-radius:32px;border-top-left-radius:32px;flex-grow:1;overflow-x:hidden;overflow-y:auto}.mfui-9-modal-content__container-body_gray{background-color:var(--backgroundGray)}.mfui-9-modal-content__container-body_gray-with-footer{background-color:var(--backgroundGray);border-bottom-left-radius:32px;border-bottom-right-radius:32px}.mfui-9-modal-content__children{-webkit-box-sizing:border-box;box-sizing:border-box;padding-left:16px;padding-right:4px;padding-top:24px}@media screen and (min-width:768px){.mfui-9-modal-content__children{padding-left:24px;padding-right:6px}}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner{background-color:var(--stcWhite);position:relative}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:after{background-color:var(--stcBlack);border-radius:12px;bottom:0;content:"";left:0;opacity:0;pointer-events:none;position:absolute;right:0;top:0;-webkit-transition:opacity .3s;transition:opacity .3s}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:hover:after{opacity:.1}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:active:after{opacity:.2}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-icon{fill:var(--stcBlack)}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__children{overflow-x:hidden;padding-top:0}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header{margin-bottom:24px;margin-left:-16px;margin-right:-16px}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header{margin-left:-32px;margin-right:-32px}}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header-main{min-height:40px}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header-button{top:0}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__title-area{padding-bottom:4px;padding-top:4px}.mfui-9-modal-content__container-wrap_hide-header .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_hide-header .mfui-9-modal-content__children{padding-top:0}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__container-body{padding-bottom:0}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer{padding-left:16px;padding-right:16px}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer{padding-left:32px;padding-right:32px}}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_native-scroll{background-color:var(--background);border-radius:12px;bottom:0;position:sticky}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_shadow{-webkit-box-shadow:0 2px 12px rgba(0,0,0,.1);box-shadow:0 2px 12px rgba(0,0,0,.1)}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_gray{background-color:var(--backgroundGray);border-bottom-left-radius:32px;border-bottom-right-radius:32px}.mfui-9-modal-content__container-wrap_out-side-buttons .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_native-scroll .mfui-9-modal-content__children,.mfui-9-modal-content__container-wrap_native-scroll .mfui-9-modal-content__container-body{padding:0}.mfui-9-modal-content__container-wrap_transition-end{-webkit-animation:hide-popup .2s ease-in;animation:hide-popup .2s ease-in}@-webkit-keyframes show-popup{0%{-webkit-transform:scale(95%);transform:scale(95%);-webkit-transform-origin:top;transform-origin:top}to{-webkit-transform:scale(100%);transform:scale(100%)}}@keyframes show-popup{0%{-webkit-transform:scale(95%);transform:scale(95%);-webkit-transform-origin:top;transform-origin:top}to{-webkit-transform:scale(100%);transform:scale(100%)}}@-webkit-keyframes hide-popup{0%{-webkit-transform:scale(100%);transform:scale(100%)}to{-webkit-transform:scale(95%);transform:scale(95%)}}@keyframes hide-popup{0%{-webkit-transform:scale(100%);transform:scale(100%)}to{-webkit-transform:scale(95%);transform:scale(95%)}}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-9-modal-content__background{background-color:rgba(0,0,0,.8);bottom:0;left:0;position:fixed;right:0;top:0}.mfui-9-modal-content__container-wrap{-webkit-animation:show-popup .3s ease-out;animation:show-popup .3s ease-out;position:relative;width:100%}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap{-webkit-transition:height .1s;transition:height .1s;width:740px}.mfui-9-modal-content__container-wrap_small{width:400px}.mfui-9-modal-content__container-wrap_medium{width:540px}}.mfui-9-modal-content__container-inner{background-color:var(--background);font-family:inherit;width:100%}.mfui-9-modal-content__container-inner_native-scroll{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media screen and (min-width:768px){.mfui-9-modal-content__container-inner_native-scroll{max-height:80vh}}.mfui-9-modal-content__header{position:relative}.mfui-9-modal-content__header_shadow{-webkit-box-shadow:0 2px 12px rgba(0,0,0,.1);box-shadow:0 2px 12px rgba(0,0,0,.1)}.mfui-9-modal-content__header_gray{background-color:var(--backgroundGray)}.mfui-9-modal-content__header_native-scroll{background-color:var(--background);border-radius:12px;position:sticky;top:0}.mfui-9-modal-content__header-main{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-height:64px}@media screen and (min-width:768px){.mfui-9-modal-content__header-main{min-height:64px}}.mfui-9-modal-content__header-custom-content{width:100%}.mfui-9-modal-content__header-button{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:12px;z-index:2;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background:transparent;border:none;cursor:pointer;height:44px;justify-content:center;outline:none;width:44px}.mfui-9-modal-content__header-button_back{left:14px}@media screen and (max-width:767px){.mfui-9-modal-content__header-button_back{left:10px;top:10px}}.mfui-9-modal-content__header-button_close{right:18px}@media screen and (max-width:767px){.mfui-9-modal-content__header-button_close{right:10px;top:10px}}.mfui-9-modal-content__header-inner{background-color:var(--spbSky0);border-radius:12px;height:32px;position:relative;-webkit-transition:background-color .3s;transition:background-color .3s;width:32px}.mfui-9-modal-content__header-inner:focus-visible{-webkit-animation:focus-outline-shrink .3s linear forwards;animation:focus-outline-shrink .3s linear forwards;outline-offset:2px}@-webkit-keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}@keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}.mfui-9-modal-content__header-inner:focus{outline:none}.mfui-9-modal-content__header-inner:hover{background-color:var(--spbSky1)}.mfui-9-modal-content__header-inner:active{background-color:var(--spbSky2)}.mfui-9-modal-content__header-icon{height:32px;min-width:32px;width:32px;fill:var(--content)}.mfui-9-modal-content__title-area{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 48px;padding:12px}@media screen and (min-width:768px){.mfui-9-modal-content__title-area{margin:0 56px;padding:16px}}.mfui-9-modal-content__title{font-size:18px;font-weight:500;letter-spacing:.5px;line-height:24px;text-align:center}@media screen and (min-width:1280px){.mfui-9-modal-content__title{font-size:20px;line-height:28px}}@media screen and (min-width:768px){.mfui-9-modal-content__title{font-size:20px;font-weight:500;letter-spacing:.5px;line-height:28px}}.mfui-9-modal-content__header-additional{-webkit-box-sizing:border-box;box-sizing:border-box;padding:8px 16px;text-align:center}@media screen and (min-width:768px){.mfui-9-modal-content__header-additional{padding-left:32px;padding-right:32px}}.mfui-9-modal-content__container-body{-webkit-box-sizing:border-box;box-sizing:border-box;padding-bottom:24px;padding-right:6px}@media screen and (min-width:768px){.mfui-9-modal-content__container-body{padding-bottom:24px;padding-right:12px}.mfui-9-modal-content__container-body_small-padding{padding-right:4px}}.mfui-9-modal-content__container-body_native-scroll{-webkit-box-flex:1;-ms-flex-positive:1;background-color:var(--base);border-bottom-left-radius:32px;border-top-left-radius:32px;flex-grow:1;overflow-x:hidden;overflow-y:auto}.mfui-9-modal-content__container-body_gray{background-color:var(--backgroundGray)}.mfui-9-modal-content__container-body_gray-with-footer{background-color:var(--backgroundGray);border-bottom-left-radius:32px;border-bottom-right-radius:32px}.mfui-9-modal-content__children{-webkit-box-sizing:border-box;box-sizing:border-box;padding-left:16px;padding-right:4px;padding-top:24px}@media screen and (min-width:768px){.mfui-9-modal-content__children{padding-left:24px;padding-right:6px}.mfui-9-modal-content__children_small-padding{padding-left:16px}.mfui-9-modal-content__children_large-padding{padding-left:32px;padding-right:12px}}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner{background-color:var(--stcWhite);position:relative}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:after{background-color:var(--stcBlack);border-radius:12px;bottom:0;content:"";left:0;opacity:0;pointer-events:none;position:absolute;right:0;top:0;-webkit-transition:opacity .3s;transition:opacity .3s}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:hover:after{opacity:.1}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:active:after{opacity:.2}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-icon{fill:var(--stcBlack)}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__children{overflow-x:hidden;padding-top:0}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header{margin-bottom:24px;margin-left:-16px;margin-right:-16px}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header{margin-left:-32px;margin-right:-32px}}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header-main{min-height:40px}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header-button{top:0}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__title-area{padding-bottom:4px;padding-top:4px}.mfui-9-modal-content__container-wrap_hide-header .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_hide-header .mfui-9-modal-content__children{padding-top:0}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__container-body{padding-bottom:0}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer{padding-left:16px;padding-right:16px}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer{padding-left:32px;padding-right:32px}}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_native-scroll{background-color:var(--background);border-radius:12px;bottom:0;position:sticky}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_shadow{-webkit-box-shadow:0 2px 12px rgba(0,0,0,.1);box-shadow:0 2px 12px rgba(0,0,0,.1)}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_gray{background-color:var(--backgroundGray);border-bottom-left-radius:32px;border-bottom-right-radius:32px}.mfui-9-modal-content__container-wrap_out-side-buttons .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_native-scroll .mfui-9-modal-content__children,.mfui-9-modal-content__container-wrap_native-scroll .mfui-9-modal-content__container-body{padding:0}.mfui-9-modal-content__container-wrap_transition-end{-webkit-animation:hide-popup .2s ease-in;animation:hide-popup .2s ease-in}@-webkit-keyframes show-popup{0%{-webkit-transform:scale(95%);transform:scale(95%);-webkit-transform-origin:top;transform-origin:top}to{-webkit-transform:scale(100%);transform:scale(100%)}}@keyframes show-popup{0%{-webkit-transform:scale(95%);transform:scale(95%);-webkit-transform-origin:top;transform-origin:top}to{-webkit-transform:scale(100%);transform:scale(100%)}}@-webkit-keyframes hide-popup{0%{-webkit-transform:scale(100%);transform:scale(100%)}to{-webkit-transform:scale(95%);transform:scale(95%)}}@keyframes hide-popup{0%{-webkit-transform:scale(100%);transform:scale(100%)}to{-webkit-transform:scale(95%);transform:scale(95%)}}
package/dist/es/components/Modal/_ModalContent/ModalContent.js CHANGED
@@ -44,6 +44,8 @@ var ModalContent = function ModalContent(_ref) {
44
44
  isStickyFooterProps = _ref$footerProps2.isStickyFooter,
45
45
  hasFooterShadow = _ref$footerProps2.hasFooterShadow,
46
46
  isGrayColorFooter = _ref$footerProps2.isGrayColorFooter,
47
+ desktopWidth = _ref.desktopWidth,
48
+ contentPadding = _ref.contentPadding,
47
49
  _ref$refs = _ref.refs,
48
50
  headerRef = _ref$refs.headerRef,
49
51
  footerRef = _ref$refs.footerRef,
@@ -135,7 +137,10 @@ var ModalContent = function ModalContent(_ref) {
135
137
  ref: footerRef
136
138
  }, footer);
137
139
  var renderChildren = /*#__PURE__*/React.createElement("div", {
138
- className: cn('children', classes === null || classes === void 0 ? void 0 : classes.children)
140
+ className: cn('children', {
141
+ 'small-padding': contentPadding === 'small',
142
+ 'large-padding': contentPadding === 'large'
143
+ }, classes === null || classes === void 0 ? void 0 : classes.children)
139
144
  }, isStaticHeader && renderHeader, /*#__PURE__*/React.createElement("div", {
140
145
  className: cn('children-content', classes === null || classes === void 0 ? void 0 : classes.childrenContent)
141
146
  }, children), isStaticFooter && renderFooter);
@@ -146,7 +151,9 @@ var ModalContent = function ModalContent(_ref) {
146
151
  'sticky-footer': isStickyFooter,
147
152
  'static-header': isStaticHeader,
148
153
  'transition-end': isTransitionEndStep,
149
- 'out-side-buttons': isOutSideHeaderButtons
154
+ 'out-side-buttons': isOutSideHeaderButtons,
155
+ small: desktopWidth === 'small',
156
+ medium: desktopWidth === 'medium'
150
157
  }, classes === null || classes === void 0 ? void 0 : classes.containerWrap),
151
158
  style: {
152
159
  height: containerWrapHeight ? "".concat(containerWrapHeight, "px") : undefined,
@@ -164,7 +171,8 @@ var ModalContent = function ModalContent(_ref) {
164
171
  className: cn('container-body', {
165
172
  gray: isGrayColorModal,
166
173
  'gray-with-footer': isGrayColorModal && !isStickyFooter,
167
- 'native-scroll': isEnabledNativeScroll
174
+ 'native-scroll': isEnabledNativeScroll,
175
+ 'small-padding': contentPadding === 'small'
168
176
  }, classes === null || classes === void 0 ? void 0 : classes.containerBody),
169
177
  ref: containerBodyRef,
170
178
  onScroll: hasHeaderShadow ? handleChangeShadowState : undefined
package/dist/es/components/Modal/types.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { IScrollBarProps } from '../ScrollBar/ScrollBar';
2
2
  import type { IModalProps } from './Modal';
3
- type ModalComponentPropsType = Pick<IModalProps, 'classes' | 'dataAttrs' | 'headerProps' | 'footerProps' | 'isEnabledNativeScroll' | 'isDisabledBackgroundClick' | 'isGrayColorModal'>;
3
+ type ModalComponentPropsType = Pick<IModalProps, 'classes' | 'dataAttrs' | 'headerProps' | 'footerProps' | 'isEnabledNativeScroll' | 'isDisabledBackgroundClick' | 'isGrayColorModal' | 'desktopWidth' | 'contentPadding'>;
4
4
  type RefType = React.MutableRefObject<HTMLDivElement | null>;
5
5
  type ModalContextPropsType = ModalComponentPropsType & {
6
6
  scrollBarParams: IScrollBarProps;
package/dist/es/components/SectionAccordionGroup/SectionAccordionGroup.css CHANGED
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-9-section-accordion-group{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mfui-9-section-accordion-group__item{background-color:var(--base);overflow:hidden;-webkit-transition:margin-top .3s ease-out,border-radius .3s ease-out;transition:margin-top .3s ease-out,border-radius .3s ease-out}.mfui-9-section-accordion-group__item:has(.mfui-9-section-accordion-group__header:focus-visible){-webkit-animation:focus-outline-shrink .3s linear forwards;animation:focus-outline-shrink .3s linear forwards;outline-offset:2px;position:relative;z-index:1}@-webkit-keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}@keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}.mfui-9-section-accordion-group__item_closed-single{border-radius:24px}.mfui-9-section-accordion-group__item_closed-single .mfui-9-section-accordion-group__header{padding:20px 16px}.mfui-9-section-accordion-group__item_closed-top{border-radius:24px 24px 8px 8px}.mfui-9-section-accordion-group__item_closed-top .mfui-9-section-accordion-group__header{padding:20px 16px 16px}.mfui-9-section-accordion-group__item_closed-middle{border-radius:8px}.mfui-9-section-accordion-group__item_closed-middle .mfui-9-section-accordion-group__header{padding:16px}.mfui-9-section-accordion-group__item_closed-bottom{border-radius:8px 8px 24px 24px}.mfui-9-section-accordion-group__item_closed-bottom .mfui-9-section-accordion-group__header{padding:16px 16px 20px}.mfui-9-section-accordion-group__item_opened{border-radius:24px}.mfui-9-section-accordion-group__item_opened .mfui-9-section-accordion-group__header{padding:20px 16px 16px}.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_closed{margin-top:1px}.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_opened,.mfui-9-section-accordion-group__item_opened+.mfui-9-section-accordion-group__item_closed{margin-top:12px}@media screen and (min-width:1024px){.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_opened,.mfui-9-section-accordion-group__item_opened+.mfui-9-section-accordion-group__item_closed{margin-top:24px}}.mfui-9-section-accordion-group__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;cursor:pointer;justify-content:space-between;width:100%;-webkit-tap-highlight-color:transparent;-webkit-transition:background-color .3s ease-out;transition:background-color .3s ease-out}.mfui-9-section-accordion-group__header:focus,.mfui-9-section-accordion-group__header:focus-visible{outline:none}@media screen and (max-width:767px){.mfui-9-section-accordion-group__header:active{background-color:var(--spbSky1)}}@media screen and (min-width:1024px){.mfui-9-section-accordion-group__header:hover{background-color:var(--spbSky1)}.mfui-9-section-accordion-group__header:hover+.mfui-9-section-accordion-group__divider{background-color:var(--spbSky1);margin:0;opacity:1}.mfui-9-section-accordion-group__header:hover+.mfui-9-section-accordion-group__divider_visible{opacity:0}}.mfui-9-section-accordion-group__header-left,.mfui-9-section-accordion-group__header-right{display:-webkit-box;display:-ms-flexbox;display:flex;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-9-section-accordion-group__icon{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;height:24px;justify-content:center;width:24px}.mfui-9-section-accordion-group__icon svg{fill:var(--brandGreen)}.mfui-9-section-accordion-group__title{font-size:15px;font-weight:500;line-height:24px}.mfui-9-section-accordion-group__arrow-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:var(--spbSky0);border-radius:50%;height:24px;justify-content:center;width:24px}@media screen and (min-width:768px){.mfui-9-section-accordion-group__arrow-wrapper{height:32px;width:32px}}.mfui-9-section-accordion-group__arrow-icon{-webkit-transition:-webkit-transform .3s ease-out;transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out,-webkit-transform .3s ease-out}.mfui-9-section-accordion-group__item_opened .mfui-9-section-accordion-group__arrow-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.mfui-9-section-accordion-group__divider{background-color:var(--spbSky1);height:1px;opacity:0;-webkit-transition:opacity .3s ease-out,height .3s ease-out,margin .3s ease-out;transition:opacity .3s ease-out,height .3s ease-out,margin .3s ease-out}@media screen and (max-width:767px){.mfui-9-section-accordion-group__divider{margin:0 16px}}.mfui-9-section-accordion-group__divider_visible{margin:0 16px;opacity:1}.mfui-9-section-accordion-group__content-inner{padding:12px 16px 16px}.mfui-9-section-accordion-group__body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-9-section-accordion-group{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mfui-9-section-accordion-group__item{background-color:var(--base);overflow:hidden;-webkit-transition:margin-top .3s ease-out,border-radius .3s ease-out;transition:margin-top .3s ease-out,border-radius .3s ease-out}.mfui-9-section-accordion-group__item:has(.mfui-9-section-accordion-group__header:focus-visible){-webkit-animation:focus-outline-shrink .3s linear forwards;animation:focus-outline-shrink .3s linear forwards;outline-offset:2px;position:relative;z-index:1}@-webkit-keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}@keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}.mfui-9-section-accordion-group__item_closed-single{border-radius:24px}.mfui-9-section-accordion-group__item_closed-single .mfui-9-section-accordion-group__header{padding:20px 16px}.mfui-9-section-accordion-group__item_closed-top{border-radius:24px 24px 8px 8px}.mfui-9-section-accordion-group__item_closed-top .mfui-9-section-accordion-group__header{padding:20px 16px 16px}.mfui-9-section-accordion-group__item_closed-middle{border-radius:8px}.mfui-9-section-accordion-group__item_closed-middle .mfui-9-section-accordion-group__header{padding:16px}.mfui-9-section-accordion-group__item_closed-bottom{border-radius:8px 8px 24px 24px}.mfui-9-section-accordion-group__item_closed-bottom .mfui-9-section-accordion-group__header{padding:16px 16px 20px}.mfui-9-section-accordion-group__item_opened{border-radius:24px}.mfui-9-section-accordion-group__item_opened .mfui-9-section-accordion-group__header{padding:20px 16px 16px}.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_closed{margin-top:1px}.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_opened,.mfui-9-section-accordion-group__item_opened+.mfui-9-section-accordion-group__item_closed{margin-top:12px}@media screen and (min-width:1024px){.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_opened,.mfui-9-section-accordion-group__item_opened+.mfui-9-section-accordion-group__item_closed{margin-top:24px}}.mfui-9-section-accordion-group__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;justify-content:space-between;width:100%;-webkit-tap-highlight-color:transparent;-webkit-transition:background-color .3s ease-out;transition:background-color .3s ease-out}.mfui-9-section-accordion-group__header:focus,.mfui-9-section-accordion-group__header:focus-visible{outline:none}@media screen and (max-width:767px){.mfui-9-section-accordion-group__header:active{background-color:var(--spbSky1)}}@media screen and (min-width:1024px) and (hover:none),screen and (min-width:1024px) and (pointer:coarse){.mfui-9-section-accordion-group__header:active{background-color:var(--spbSky1)}}@media screen and (min-width:1024px) and (hover:hover) and (pointer:fine){.mfui-9-section-accordion-group__header:hover{background-color:var(--spbSky1)}.mfui-9-section-accordion-group__header:hover+.mfui-9-section-accordion-group__divider{background-color:var(--spbSky1);margin:0;opacity:1}.mfui-9-section-accordion-group__header:hover+.mfui-9-section-accordion-group__divider_visible{opacity:0}}.mfui-9-section-accordion-group__header-left,.mfui-9-section-accordion-group__header-right{display:-webkit-box;display:-ms-flexbox;display:flex;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-9-section-accordion-group__icon{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;height:24px;justify-content:center;width:24px}.mfui-9-section-accordion-group__icon svg{fill:var(--brandGreen)}.mfui-9-section-accordion-group__title{font-size:18px;font-weight:500;letter-spacing:.5px;line-height:24px}@media screen and (min-width:1280px){.mfui-9-section-accordion-group__title{font-size:20px;line-height:28px}}@media screen and (max-width:1023px){.mfui-9-section-accordion-group__title{font-size:15px;letter-spacing:normal;line-height:24px}}.mfui-9-section-accordion-group__arrow-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:var(--spbSky0);border-radius:50%;height:24px;justify-content:center;width:24px}@media screen and (min-width:768px){.mfui-9-section-accordion-group__arrow-wrapper{height:32px;width:32px}}.mfui-9-section-accordion-group__arrow-icon{-webkit-transition:-webkit-transform .3s ease-out;transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out,-webkit-transform .3s ease-out;fill:var(--content)}.mfui-9-section-accordion-group__item_opened .mfui-9-section-accordion-group__arrow-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.mfui-9-section-accordion-group__divider{background-color:var(--spbSky1);height:1px;opacity:0;-webkit-transition:opacity .3s ease-out,height .3s ease-out,margin .3s ease-out;transition:opacity .3s ease-out,height .3s ease-out,margin .3s ease-out}@media screen and (max-width:767px){.mfui-9-section-accordion-group__divider{margin:0 16px}}.mfui-9-section-accordion-group__divider_visible{margin:0 16px;opacity:1}.mfui-9-section-accordion-group__content-inner{padding:12px 16px 16px}.mfui-9-section-accordion-group__body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px}
package/dist/es/components/Tile/Tile.d.ts CHANGED
@@ -26,6 +26,8 @@ export declare const ShadowLevel: {
26
26
  };
27
27
  type ShadowLevelType = (typeof ShadowLevel)[keyof typeof ShadowLevel];
28
28
  export interface ITileProps {
29
+ /** Индекс для навигации через tab */
30
+ tabIndex?: number;
29
31
  /** Ссылка */
30
32
  href?: string;
31
33
  /** Атрибут для открытия ссылки */
package/dist/es/components/Tile/Tile.js CHANGED
@@ -25,7 +25,8 @@ export var ShadowLevel = {
25
25
  };
26
26
  var cn = cnCreate('mfui-9-tile');
27
27
  var Tile = function Tile(_ref) {
28
- var href = _ref.href,
28
+ var tabIndex = _ref.tabIndex,
29
+ href = _ref.href,
29
30
  children = _ref.children,
30
31
  className = _ref.className,
31
32
  _ref$theme = _ref.theme,
@@ -57,6 +58,7 @@ var Tile = function Tile(_ref) {
57
58
  pointer: isPointer,
58
59
  interactive: isInteractive
59
60
  }, className),
61
+ tabIndex: tabIndex,
60
62
  onClick: handleClick
61
63
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), href && /*#__PURE__*/React.createElement("a", {
62
64
  href: href,
package/dist/lib/components/Link/Link.d.ts CHANGED
@@ -1,6 +1,8 @@
1
1
  import * as React from 'react';
2
2
  import './Link.scss';
3
3
  export interface ILinkProps {
4
+ /** Индекс для навигации через tab */
5
+ tabIndex?: number;
4
6
  /** Дополнительный класс корневого элемента */
5
7
  className?: string;
6
8
  /** Ссылка */
package/dist/lib/components/Link/Link.js CHANGED
@@ -13,7 +13,8 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
13
13
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
14
14
  var cn = (0, _uiHelpers.cnCreate)('mfui-9-link');
15
15
  var Link = function Link(_ref) {
16
- var target = _ref.target,
16
+ var tabIndex = _ref.tabIndex,
17
+ target = _ref.target,
17
18
  href = _ref.href,
18
19
  rel = _ref.rel,
19
20
  onClick = _ref.onClick,
@@ -24,6 +25,7 @@ var Link = function Link(_ref) {
24
25
  dataAttrs = _ref.dataAttrs;
25
26
  return /*#__PURE__*/React.createElement("a", (0, _extends2["default"])({
26
27
  className: cn([className]),
28
+ tabIndex: tabIndex,
27
29
  href: href,
28
30
  target: target,
29
31
  rel: rel,
package/dist/lib/components/Modal/Modal.d.ts CHANGED
@@ -91,6 +91,10 @@ export interface IModalProps {
91
91
  headerProps?: ModalHeaderPropsType;
92
92
  /** Настройки для футера модального окна */
93
93
  footerProps?: ModalFooterPropsType;
94
+ /** Ширина модального окна на разрешении 767- */
95
+ desktopWidth?: 'small' | 'medium';
96
+ /** Внутренний отступ контента без шапки и футера на разрешении 767- */
97
+ contentPadding?: 'small' | 'large';
94
98
  /** Вид модального окна на разрешении 767- */
95
99
  mobileView?: ModalMobileViewsType;
96
100
  /** Включить дефолтный скролл (отключает кастомный компонент скролла) */
package/dist/lib/components/Modal/Modal.js CHANGED
@@ -48,6 +48,8 @@ var Modal = function Modal(_ref) {
48
48
  isOpened = _ref.isOpened,
49
49
  headerProps = _ref.headerProps,
50
50
  footerProps = _ref.footerProps,
51
+ desktopWidth = _ref.desktopWidth,
52
+ contentPadding = _ref.contentPadding,
51
53
  _ref$mobileView = _ref.mobileView,
52
54
  mobileView = _ref$mobileView === void 0 ? ModalMobileViews.FULL_SCREEN : _ref$mobileView,
53
55
  isEnabledNativeScroll = _ref.isEnabledNativeScroll,
@@ -267,6 +269,8 @@ var Modal = function Modal(_ref) {
267
269
  }),
268
270
  headerProps: headerProps,
269
271
  footerProps: footerProps,
272
+ desktopWidth: desktopWidth,
273
+ contentPadding: contentPadding,
270
274
  refs: {
271
275
  overlayRef: overlayRef,
272
276
  headerRef: headerRef,
package/dist/lib/components/Modal/_ModalContent/ModalContent.css CHANGED
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-9-modal-content__background{background-color:rgba(0,0,0,.8);bottom:0;left:0;position:fixed;right:0;top:0}.mfui-9-modal-content__container-wrap{-webkit-animation:show-popup .3s ease-out;animation:show-popup .3s ease-out;position:relative;width:100%}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap{-webkit-transition:height .1s;transition:height .1s;width:740px}}.mfui-9-modal-content__container-inner{background-color:var(--background);font-family:inherit;width:100%}.mfui-9-modal-content__container-inner_native-scroll{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media screen and (min-width:768px){.mfui-9-modal-content__container-inner_native-scroll{max-height:80vh}}.mfui-9-modal-content__header{position:relative}.mfui-9-modal-content__header_shadow{-webkit-box-shadow:0 2px 12px rgba(0,0,0,.1);box-shadow:0 2px 12px rgba(0,0,0,.1)}.mfui-9-modal-content__header_gray{background-color:var(--backgroundGray)}.mfui-9-modal-content__header_native-scroll{background-color:var(--background);border-radius:12px;position:sticky;top:0}.mfui-9-modal-content__header-main{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-height:64px}@media screen and (min-width:768px){.mfui-9-modal-content__header-main{min-height:64px}}.mfui-9-modal-content__header-custom-content{width:100%}.mfui-9-modal-content__header-button{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:12px;z-index:2;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background:transparent;border:none;cursor:pointer;height:44px;justify-content:center;outline:none;width:44px}.mfui-9-modal-content__header-button_back{left:14px}@media screen and (max-width:767px){.mfui-9-modal-content__header-button_back{left:10px;top:10px}}.mfui-9-modal-content__header-button_close{right:18px}@media screen and (max-width:767px){.mfui-9-modal-content__header-button_close{right:10px;top:10px}}.mfui-9-modal-content__header-inner{background-color:var(--spbSky0);border-radius:12px;height:32px;position:relative;-webkit-transition:background-color .3s;transition:background-color .3s;width:32px}.mfui-9-modal-content__header-inner:focus-visible{-webkit-animation:focus-outline-shrink .3s linear forwards;animation:focus-outline-shrink .3s linear forwards;outline-offset:2px}@-webkit-keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}@keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}.mfui-9-modal-content__header-inner:focus{outline:none}.mfui-9-modal-content__header-inner:hover{background-color:var(--spbSky1)}.mfui-9-modal-content__header-inner:active{background-color:var(--spbSky2)}.mfui-9-modal-content__header-icon{height:32px;min-width:32px;width:32px;fill:var(--content)}.mfui-9-modal-content__title-area{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 48px;padding:12px}@media screen and (min-width:768px){.mfui-9-modal-content__title-area{margin:0 56px;padding:16px}}.mfui-9-modal-content__title{font-size:18px;font-weight:500;letter-spacing:.5px;line-height:24px;text-align:center}@media screen and (min-width:1280px){.mfui-9-modal-content__title{font-size:20px;line-height:28px}}@media screen and (min-width:768px){.mfui-9-modal-content__title{font-size:20px;font-weight:500;letter-spacing:.5px;line-height:28px}}.mfui-9-modal-content__header-additional{-webkit-box-sizing:border-box;box-sizing:border-box;padding:8px 16px;text-align:center}@media screen and (min-width:768px){.mfui-9-modal-content__header-additional{padding-left:32px;padding-right:32px}}.mfui-9-modal-content__container-body{-webkit-box-sizing:border-box;box-sizing:border-box;padding-bottom:24px;padding-right:6px}@media screen and (min-width:768px){.mfui-9-modal-content__container-body{padding-bottom:24px;padding-right:12px}}.mfui-9-modal-content__container-body_native-scroll{-webkit-box-flex:1;-ms-flex-positive:1;background-color:var(--base);border-bottom-left-radius:32px;border-top-left-radius:32px;flex-grow:1;overflow-x:hidden;overflow-y:auto}.mfui-9-modal-content__container-body_gray{background-color:var(--backgroundGray)}.mfui-9-modal-content__container-body_gray-with-footer{background-color:var(--backgroundGray);border-bottom-left-radius:32px;border-bottom-right-radius:32px}.mfui-9-modal-content__children{-webkit-box-sizing:border-box;box-sizing:border-box;padding-left:16px;padding-right:4px;padding-top:24px}@media screen and (min-width:768px){.mfui-9-modal-content__children{padding-left:24px;padding-right:6px}}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner{background-color:var(--stcWhite);position:relative}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:after{background-color:var(--stcBlack);border-radius:12px;bottom:0;content:"";left:0;opacity:0;pointer-events:none;position:absolute;right:0;top:0;-webkit-transition:opacity .3s;transition:opacity .3s}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:hover:after{opacity:.1}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:active:after{opacity:.2}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-icon{fill:var(--stcBlack)}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__children{overflow-x:hidden;padding-top:0}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header{margin-bottom:24px;margin-left:-16px;margin-right:-16px}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header{margin-left:-32px;margin-right:-32px}}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header-main{min-height:40px}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header-button{top:0}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__title-area{padding-bottom:4px;padding-top:4px}.mfui-9-modal-content__container-wrap_hide-header .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_hide-header .mfui-9-modal-content__children{padding-top:0}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__container-body{padding-bottom:0}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer{padding-left:16px;padding-right:16px}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer{padding-left:32px;padding-right:32px}}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_native-scroll{background-color:var(--background);border-radius:12px;bottom:0;position:sticky}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_shadow{-webkit-box-shadow:0 2px 12px rgba(0,0,0,.1);box-shadow:0 2px 12px rgba(0,0,0,.1)}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_gray{background-color:var(--backgroundGray);border-bottom-left-radius:32px;border-bottom-right-radius:32px}.mfui-9-modal-content__container-wrap_out-side-buttons .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_native-scroll .mfui-9-modal-content__children,.mfui-9-modal-content__container-wrap_native-scroll .mfui-9-modal-content__container-body{padding:0}.mfui-9-modal-content__container-wrap_transition-end{-webkit-animation:hide-popup .2s ease-in;animation:hide-popup .2s ease-in}@-webkit-keyframes show-popup{0%{-webkit-transform:scale(95%);transform:scale(95%);-webkit-transform-origin:top;transform-origin:top}to{-webkit-transform:scale(100%);transform:scale(100%)}}@keyframes show-popup{0%{-webkit-transform:scale(95%);transform:scale(95%);-webkit-transform-origin:top;transform-origin:top}to{-webkit-transform:scale(100%);transform:scale(100%)}}@-webkit-keyframes hide-popup{0%{-webkit-transform:scale(100%);transform:scale(100%)}to{-webkit-transform:scale(95%);transform:scale(95%)}}@keyframes hide-popup{0%{-webkit-transform:scale(100%);transform:scale(100%)}to{-webkit-transform:scale(95%);transform:scale(95%)}}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-9-modal-content__background{background-color:rgba(0,0,0,.8);bottom:0;left:0;position:fixed;right:0;top:0}.mfui-9-modal-content__container-wrap{-webkit-animation:show-popup .3s ease-out;animation:show-popup .3s ease-out;position:relative;width:100%}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap{-webkit-transition:height .1s;transition:height .1s;width:740px}.mfui-9-modal-content__container-wrap_small{width:400px}.mfui-9-modal-content__container-wrap_medium{width:540px}}.mfui-9-modal-content__container-inner{background-color:var(--background);font-family:inherit;width:100%}.mfui-9-modal-content__container-inner_native-scroll{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media screen and (min-width:768px){.mfui-9-modal-content__container-inner_native-scroll{max-height:80vh}}.mfui-9-modal-content__header{position:relative}.mfui-9-modal-content__header_shadow{-webkit-box-shadow:0 2px 12px rgba(0,0,0,.1);box-shadow:0 2px 12px rgba(0,0,0,.1)}.mfui-9-modal-content__header_gray{background-color:var(--backgroundGray)}.mfui-9-modal-content__header_native-scroll{background-color:var(--background);border-radius:12px;position:sticky;top:0}.mfui-9-modal-content__header-main{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-height:64px}@media screen and (min-width:768px){.mfui-9-modal-content__header-main{min-height:64px}}.mfui-9-modal-content__header-custom-content{width:100%}.mfui-9-modal-content__header-button{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:12px;z-index:2;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background:transparent;border:none;cursor:pointer;height:44px;justify-content:center;outline:none;width:44px}.mfui-9-modal-content__header-button_back{left:14px}@media screen and (max-width:767px){.mfui-9-modal-content__header-button_back{left:10px;top:10px}}.mfui-9-modal-content__header-button_close{right:18px}@media screen and (max-width:767px){.mfui-9-modal-content__header-button_close{right:10px;top:10px}}.mfui-9-modal-content__header-inner{background-color:var(--spbSky0);border-radius:12px;height:32px;position:relative;-webkit-transition:background-color .3s;transition:background-color .3s;width:32px}.mfui-9-modal-content__header-inner:focus-visible{-webkit-animation:focus-outline-shrink .3s linear forwards;animation:focus-outline-shrink .3s linear forwards;outline-offset:2px}@-webkit-keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}@keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}.mfui-9-modal-content__header-inner:focus{outline:none}.mfui-9-modal-content__header-inner:hover{background-color:var(--spbSky1)}.mfui-9-modal-content__header-inner:active{background-color:var(--spbSky2)}.mfui-9-modal-content__header-icon{height:32px;min-width:32px;width:32px;fill:var(--content)}.mfui-9-modal-content__title-area{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 48px;padding:12px}@media screen and (min-width:768px){.mfui-9-modal-content__title-area{margin:0 56px;padding:16px}}.mfui-9-modal-content__title{font-size:18px;font-weight:500;letter-spacing:.5px;line-height:24px;text-align:center}@media screen and (min-width:1280px){.mfui-9-modal-content__title{font-size:20px;line-height:28px}}@media screen and (min-width:768px){.mfui-9-modal-content__title{font-size:20px;font-weight:500;letter-spacing:.5px;line-height:28px}}.mfui-9-modal-content__header-additional{-webkit-box-sizing:border-box;box-sizing:border-box;padding:8px 16px;text-align:center}@media screen and (min-width:768px){.mfui-9-modal-content__header-additional{padding-left:32px;padding-right:32px}}.mfui-9-modal-content__container-body{-webkit-box-sizing:border-box;box-sizing:border-box;padding-bottom:24px;padding-right:6px}@media screen and (min-width:768px){.mfui-9-modal-content__container-body{padding-bottom:24px;padding-right:12px}.mfui-9-modal-content__container-body_small-padding{padding-right:4px}}.mfui-9-modal-content__container-body_native-scroll{-webkit-box-flex:1;-ms-flex-positive:1;background-color:var(--base);border-bottom-left-radius:32px;border-top-left-radius:32px;flex-grow:1;overflow-x:hidden;overflow-y:auto}.mfui-9-modal-content__container-body_gray{background-color:var(--backgroundGray)}.mfui-9-modal-content__container-body_gray-with-footer{background-color:var(--backgroundGray);border-bottom-left-radius:32px;border-bottom-right-radius:32px}.mfui-9-modal-content__children{-webkit-box-sizing:border-box;box-sizing:border-box;padding-left:16px;padding-right:4px;padding-top:24px}@media screen and (min-width:768px){.mfui-9-modal-content__children{padding-left:24px;padding-right:6px}.mfui-9-modal-content__children_small-padding{padding-left:16px}.mfui-9-modal-content__children_large-padding{padding-left:32px;padding-right:12px}}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner{background-color:var(--stcWhite);position:relative}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:after{background-color:var(--stcBlack);border-radius:12px;bottom:0;content:"";left:0;opacity:0;pointer-events:none;position:absolute;right:0;top:0;-webkit-transition:opacity .3s;transition:opacity .3s}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:hover:after{opacity:.1}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-inner:active:after{opacity:.2}.mfui-9-modal-content__header-button_theme_white .mfui-9-modal-content__header-icon{fill:var(--stcBlack)}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__children{overflow-x:hidden;padding-top:0}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header{margin-bottom:24px;margin-left:-16px;margin-right:-16px}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header{margin-left:-32px;margin-right:-32px}}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header-main{min-height:40px}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__header-button{top:0}.mfui-9-modal-content__container-wrap_static-header .mfui-9-modal-content__title-area{padding-bottom:4px;padding-top:4px}.mfui-9-modal-content__container-wrap_hide-header .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_hide-header .mfui-9-modal-content__children{padding-top:0}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__container-body{padding-bottom:0}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer{padding-left:16px;padding-right:16px}@media screen and (min-width:768px){.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer{padding-left:32px;padding-right:32px}}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_native-scroll{background-color:var(--background);border-radius:12px;bottom:0;position:sticky}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_shadow{-webkit-box-shadow:0 2px 12px rgba(0,0,0,.1);box-shadow:0 2px 12px rgba(0,0,0,.1)}.mfui-9-modal-content__container-wrap_sticky-footer .mfui-9-modal-content__footer_gray{background-color:var(--backgroundGray);border-bottom-left-radius:32px;border-bottom-right-radius:32px}.mfui-9-modal-content__container-wrap_out-side-buttons .mfui-9-modal-content__container-body{padding-top:24px}.mfui-9-modal-content__container-wrap_native-scroll .mfui-9-modal-content__children,.mfui-9-modal-content__container-wrap_native-scroll .mfui-9-modal-content__container-body{padding:0}.mfui-9-modal-content__container-wrap_transition-end{-webkit-animation:hide-popup .2s ease-in;animation:hide-popup .2s ease-in}@-webkit-keyframes show-popup{0%{-webkit-transform:scale(95%);transform:scale(95%);-webkit-transform-origin:top;transform-origin:top}to{-webkit-transform:scale(100%);transform:scale(100%)}}@keyframes show-popup{0%{-webkit-transform:scale(95%);transform:scale(95%);-webkit-transform-origin:top;transform-origin:top}to{-webkit-transform:scale(100%);transform:scale(100%)}}@-webkit-keyframes hide-popup{0%{-webkit-transform:scale(100%);transform:scale(100%)}to{-webkit-transform:scale(95%);transform:scale(95%)}}@keyframes hide-popup{0%{-webkit-transform:scale(100%);transform:scale(100%)}to{-webkit-transform:scale(95%);transform:scale(95%)}}
package/dist/lib/components/Modal/_ModalContent/ModalContent.js CHANGED
@@ -53,6 +53,8 @@ var ModalContent = function ModalContent(_ref) {
53
53
  isStickyFooterProps = _ref$footerProps2.isStickyFooter,
54
54
  hasFooterShadow = _ref$footerProps2.hasFooterShadow,
55
55
  isGrayColorFooter = _ref$footerProps2.isGrayColorFooter,
56
+ desktopWidth = _ref.desktopWidth,
57
+ contentPadding = _ref.contentPadding,
56
58
  _ref$refs = _ref.refs,
57
59
  headerRef = _ref$refs.headerRef,
58
60
  footerRef = _ref$refs.footerRef,
@@ -144,7 +146,10 @@ var ModalContent = function ModalContent(_ref) {
144
146
  ref: footerRef
145
147
  }, footer);
146
148
  var renderChildren = /*#__PURE__*/React.createElement("div", {
147
- className: cn('children', classes === null || classes === void 0 ? void 0 : classes.children)
149
+ className: cn('children', {
150
+ 'small-padding': contentPadding === 'small',
151
+ 'large-padding': contentPadding === 'large'
152
+ }, classes === null || classes === void 0 ? void 0 : classes.children)
148
153
  }, isStaticHeader && renderHeader, /*#__PURE__*/React.createElement("div", {
149
154
  className: cn('children-content', classes === null || classes === void 0 ? void 0 : classes.childrenContent)
150
155
  }, children), isStaticFooter && renderFooter);
@@ -155,7 +160,9 @@ var ModalContent = function ModalContent(_ref) {
155
160
  'sticky-footer': isStickyFooter,
156
161
  'static-header': isStaticHeader,
157
162
  'transition-end': isTransitionEndStep,
158
- 'out-side-buttons': isOutSideHeaderButtons
163
+ 'out-side-buttons': isOutSideHeaderButtons,
164
+ small: desktopWidth === 'small',
165
+ medium: desktopWidth === 'medium'
159
166
  }, classes === null || classes === void 0 ? void 0 : classes.containerWrap),
160
167
  style: {
161
168
  height: containerWrapHeight ? "".concat(containerWrapHeight, "px") : undefined,
@@ -173,7 +180,8 @@ var ModalContent = function ModalContent(_ref) {
173
180
  className: cn('container-body', {
174
181
  gray: isGrayColorModal,
175
182
  'gray-with-footer': isGrayColorModal && !isStickyFooter,
176
- 'native-scroll': isEnabledNativeScroll
183
+ 'native-scroll': isEnabledNativeScroll,
184
+ 'small-padding': contentPadding === 'small'
177
185
  }, classes === null || classes === void 0 ? void 0 : classes.containerBody),
178
186
  ref: containerBodyRef,
179
187
  onScroll: hasHeaderShadow ? handleChangeShadowState : undefined
package/dist/lib/components/Modal/types.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { IScrollBarProps } from '../ScrollBar/ScrollBar';
2
2
  import type { IModalProps } from './Modal';
3
- type ModalComponentPropsType = Pick<IModalProps, 'classes' | 'dataAttrs' | 'headerProps' | 'footerProps' | 'isEnabledNativeScroll' | 'isDisabledBackgroundClick' | 'isGrayColorModal'>;
3
+ type ModalComponentPropsType = Pick<IModalProps, 'classes' | 'dataAttrs' | 'headerProps' | 'footerProps' | 'isEnabledNativeScroll' | 'isDisabledBackgroundClick' | 'isGrayColorModal' | 'desktopWidth' | 'contentPadding'>;
4
4
  type RefType = React.MutableRefObject<HTMLDivElement | null>;
5
5
  type ModalContextPropsType = ModalComponentPropsType & {
6
6
  scrollBarParams: IScrollBarProps;
package/dist/lib/components/SectionAccordionGroup/SectionAccordionGroup.css CHANGED
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-9-section-accordion-group{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mfui-9-section-accordion-group__item{background-color:var(--base);overflow:hidden;-webkit-transition:margin-top .3s ease-out,border-radius .3s ease-out;transition:margin-top .3s ease-out,border-radius .3s ease-out}.mfui-9-section-accordion-group__item:has(.mfui-9-section-accordion-group__header:focus-visible){-webkit-animation:focus-outline-shrink .3s linear forwards;animation:focus-outline-shrink .3s linear forwards;outline-offset:2px;position:relative;z-index:1}@-webkit-keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}@keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}.mfui-9-section-accordion-group__item_closed-single{border-radius:24px}.mfui-9-section-accordion-group__item_closed-single .mfui-9-section-accordion-group__header{padding:20px 16px}.mfui-9-section-accordion-group__item_closed-top{border-radius:24px 24px 8px 8px}.mfui-9-section-accordion-group__item_closed-top .mfui-9-section-accordion-group__header{padding:20px 16px 16px}.mfui-9-section-accordion-group__item_closed-middle{border-radius:8px}.mfui-9-section-accordion-group__item_closed-middle .mfui-9-section-accordion-group__header{padding:16px}.mfui-9-section-accordion-group__item_closed-bottom{border-radius:8px 8px 24px 24px}.mfui-9-section-accordion-group__item_closed-bottom .mfui-9-section-accordion-group__header{padding:16px 16px 20px}.mfui-9-section-accordion-group__item_opened{border-radius:24px}.mfui-9-section-accordion-group__item_opened .mfui-9-section-accordion-group__header{padding:20px 16px 16px}.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_closed{margin-top:1px}.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_opened,.mfui-9-section-accordion-group__item_opened+.mfui-9-section-accordion-group__item_closed{margin-top:12px}@media screen and (min-width:1024px){.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_opened,.mfui-9-section-accordion-group__item_opened+.mfui-9-section-accordion-group__item_closed{margin-top:24px}}.mfui-9-section-accordion-group__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;cursor:pointer;justify-content:space-between;width:100%;-webkit-tap-highlight-color:transparent;-webkit-transition:background-color .3s ease-out;transition:background-color .3s ease-out}.mfui-9-section-accordion-group__header:focus,.mfui-9-section-accordion-group__header:focus-visible{outline:none}@media screen and (max-width:767px){.mfui-9-section-accordion-group__header:active{background-color:var(--spbSky1)}}@media screen and (min-width:1024px){.mfui-9-section-accordion-group__header:hover{background-color:var(--spbSky1)}.mfui-9-section-accordion-group__header:hover+.mfui-9-section-accordion-group__divider{background-color:var(--spbSky1);margin:0;opacity:1}.mfui-9-section-accordion-group__header:hover+.mfui-9-section-accordion-group__divider_visible{opacity:0}}.mfui-9-section-accordion-group__header-left,.mfui-9-section-accordion-group__header-right{display:-webkit-box;display:-ms-flexbox;display:flex;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-9-section-accordion-group__icon{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;height:24px;justify-content:center;width:24px}.mfui-9-section-accordion-group__icon svg{fill:var(--brandGreen)}.mfui-9-section-accordion-group__title{font-size:15px;font-weight:500;line-height:24px}.mfui-9-section-accordion-group__arrow-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:var(--spbSky0);border-radius:50%;height:24px;justify-content:center;width:24px}@media screen and (min-width:768px){.mfui-9-section-accordion-group__arrow-wrapper{height:32px;width:32px}}.mfui-9-section-accordion-group__arrow-icon{-webkit-transition:-webkit-transform .3s ease-out;transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out,-webkit-transform .3s ease-out}.mfui-9-section-accordion-group__item_opened .mfui-9-section-accordion-group__arrow-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.mfui-9-section-accordion-group__divider{background-color:var(--spbSky1);height:1px;opacity:0;-webkit-transition:opacity .3s ease-out,height .3s ease-out,margin .3s ease-out;transition:opacity .3s ease-out,height .3s ease-out,margin .3s ease-out}@media screen and (max-width:767px){.mfui-9-section-accordion-group__divider{margin:0 16px}}.mfui-9-section-accordion-group__divider_visible{margin:0 16px;opacity:1}.mfui-9-section-accordion-group__content-inner{padding:12px 16px 16px}.mfui-9-section-accordion-group__body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-9-section-accordion-group{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mfui-9-section-accordion-group__item{background-color:var(--base);overflow:hidden;-webkit-transition:margin-top .3s ease-out,border-radius .3s ease-out;transition:margin-top .3s ease-out,border-radius .3s ease-out}.mfui-9-section-accordion-group__item:has(.mfui-9-section-accordion-group__header:focus-visible){-webkit-animation:focus-outline-shrink .3s linear forwards;animation:focus-outline-shrink .3s linear forwards;outline-offset:2px;position:relative;z-index:1}@-webkit-keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}@keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}.mfui-9-section-accordion-group__item_closed-single{border-radius:24px}.mfui-9-section-accordion-group__item_closed-single .mfui-9-section-accordion-group__header{padding:20px 16px}.mfui-9-section-accordion-group__item_closed-top{border-radius:24px 24px 8px 8px}.mfui-9-section-accordion-group__item_closed-top .mfui-9-section-accordion-group__header{padding:20px 16px 16px}.mfui-9-section-accordion-group__item_closed-middle{border-radius:8px}.mfui-9-section-accordion-group__item_closed-middle .mfui-9-section-accordion-group__header{padding:16px}.mfui-9-section-accordion-group__item_closed-bottom{border-radius:8px 8px 24px 24px}.mfui-9-section-accordion-group__item_closed-bottom .mfui-9-section-accordion-group__header{padding:16px 16px 20px}.mfui-9-section-accordion-group__item_opened{border-radius:24px}.mfui-9-section-accordion-group__item_opened .mfui-9-section-accordion-group__header{padding:20px 16px 16px}.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_closed{margin-top:1px}.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_opened,.mfui-9-section-accordion-group__item_opened+.mfui-9-section-accordion-group__item_closed{margin-top:12px}@media screen and (min-width:1024px){.mfui-9-section-accordion-group__item_closed+.mfui-9-section-accordion-group__item_opened,.mfui-9-section-accordion-group__item_opened+.mfui-9-section-accordion-group__item_closed{margin-top:24px}}.mfui-9-section-accordion-group__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;justify-content:space-between;width:100%;-webkit-tap-highlight-color:transparent;-webkit-transition:background-color .3s ease-out;transition:background-color .3s ease-out}.mfui-9-section-accordion-group__header:focus,.mfui-9-section-accordion-group__header:focus-visible{outline:none}@media screen and (max-width:767px){.mfui-9-section-accordion-group__header:active{background-color:var(--spbSky1)}}@media screen and (min-width:1024px) and (hover:none),screen and (min-width:1024px) and (pointer:coarse){.mfui-9-section-accordion-group__header:active{background-color:var(--spbSky1)}}@media screen and (min-width:1024px) and (hover:hover) and (pointer:fine){.mfui-9-section-accordion-group__header:hover{background-color:var(--spbSky1)}.mfui-9-section-accordion-group__header:hover+.mfui-9-section-accordion-group__divider{background-color:var(--spbSky1);margin:0;opacity:1}.mfui-9-section-accordion-group__header:hover+.mfui-9-section-accordion-group__divider_visible{opacity:0}}.mfui-9-section-accordion-group__header-left,.mfui-9-section-accordion-group__header-right{display:-webkit-box;display:-ms-flexbox;display:flex;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-9-section-accordion-group__icon{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;height:24px;justify-content:center;width:24px}.mfui-9-section-accordion-group__icon svg{fill:var(--brandGreen)}.mfui-9-section-accordion-group__title{font-size:18px;font-weight:500;letter-spacing:.5px;line-height:24px}@media screen and (min-width:1280px){.mfui-9-section-accordion-group__title{font-size:20px;line-height:28px}}@media screen and (max-width:1023px){.mfui-9-section-accordion-group__title{font-size:15px;letter-spacing:normal;line-height:24px}}.mfui-9-section-accordion-group__arrow-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:var(--spbSky0);border-radius:50%;height:24px;justify-content:center;width:24px}@media screen and (min-width:768px){.mfui-9-section-accordion-group__arrow-wrapper{height:32px;width:32px}}.mfui-9-section-accordion-group__arrow-icon{-webkit-transition:-webkit-transform .3s ease-out;transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out,-webkit-transform .3s ease-out;fill:var(--content)}.mfui-9-section-accordion-group__item_opened .mfui-9-section-accordion-group__arrow-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.mfui-9-section-accordion-group__divider{background-color:var(--spbSky1);height:1px;opacity:0;-webkit-transition:opacity .3s ease-out,height .3s ease-out,margin .3s ease-out;transition:opacity .3s ease-out,height .3s ease-out,margin .3s ease-out}@media screen and (max-width:767px){.mfui-9-section-accordion-group__divider{margin:0 16px}}.mfui-9-section-accordion-group__divider_visible{margin:0 16px;opacity:1}.mfui-9-section-accordion-group__content-inner{padding:12px 16px 16px}.mfui-9-section-accordion-group__body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px}
package/dist/lib/components/Tile/Tile.d.ts CHANGED
@@ -26,6 +26,8 @@ export declare const ShadowLevel: {
26
26
  };
27
27
  type ShadowLevelType = (typeof ShadowLevel)[keyof typeof ShadowLevel];
28
28
  export interface ITileProps {
29
+ /** Индекс для навигации через tab */
30
+ tabIndex?: number;
29
31
  /** Ссылка */
30
32
  href?: string;
31
33
  /** Атрибут для открытия ссылки */
package/dist/lib/components/Tile/Tile.js CHANGED
@@ -34,7 +34,8 @@ var ShadowLevel = exports.ShadowLevel = {
34
34
  };
35
35
  var cn = (0, _uiHelpers.cnCreate)('mfui-9-tile');
36
36
  var Tile = function Tile(_ref) {
37
- var href = _ref.href,
37
+ var tabIndex = _ref.tabIndex,
38
+ href = _ref.href,
38
39
  children = _ref.children,
39
40
  className = _ref.className,
40
41
  _ref$theme = _ref.theme,
@@ -66,6 +67,7 @@ var Tile = function Tile(_ref) {
66
67
  pointer: isPointer,
67
68
  interactive: isInteractive
68
69
  }, className),
70
+ tabIndex: tabIndex,
69
71
  onClick: handleClick
70
72
  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), href && /*#__PURE__*/React.createElement("a", {
71
73
  href: href,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-core",
3
- "version": "9.0.0",
3
+ "version": "9.1.0",
4
4
  "files": [
5
5
  "dist",
6
6
  "styles"
@@ -104,5 +104,5 @@
104
104
  "simplebar-react": "^3.2.5",
105
105
  "swiper": "^12.1.2"
106
106
  },
107
- "gitHead": "7bc0de9281b32fa6cda0c6d6e2b48bec67be30b7"
107
+ "gitHead": "ec5702576bd66b78721a47df7b50619083f9fb1d"
108
108
  }