@astral/ui 4.99.2 → 4.100.0

package/node/components/PageHeader/PageActions/SecondaryVisibleActions/styles.js

@@ -8,14 +8,14 @@ exports.StyledMobileButton = (0, styled_1.styled)(Button_1.Button) `
   display: none;
   flex-grow: 1;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: flex;
   }
 `;
 exports.StyledSecondaryVisibleActions = (0, styled_1.styled)(ActionGroup_1.SecondaryVisibleActions) `
   display: flex;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;

package/node/components/PageHeader/PageActions/styles.js

@@ -14,7 +14,7 @@ exports.Wrapper = styled_1.styled.div `
     grid-column: 4;
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;
@@ -39,7 +39,7 @@ exports.SecondaryVisibleWrapper = (0, styled_1.styled)('div') `
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     gap: ${({ theme }) => theme.spacing(2)};
   }
 `;
@@ -54,7 +54,7 @@ exports.CollapsedActionsWrapper = styled_1.styled.div `
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;
@@ -63,7 +63,7 @@ exports.ActionWrapper = styled_1.styled.div `
   flex-direction: row-reverse;
   gap: ${({ theme, $spacing }) => theme.spacing($spacing)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     gap: ${({ theme }) => theme.spacing(2)};
   }
 `;

package/node/components/PageHeader/Title/styles.js

@@ -29,7 +29,7 @@ exports.TitleWrapper = (0, styled_1.styled)(Typography_1.Typography, {
 
   line-height: ${({ theme }) => theme.typography.h2.lineHeight};
   
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     font-size: ${({ theme }) => theme.typography.h5.fontSize};
     line-height: ${({ theme }) => theme.typography.h5.lineHeight};
     white-space: nowrap;
@@ -41,7 +41,7 @@ exports.BackButton = (0, styled_1.styled)(IconButton_1.IconButton) `
 
   margin-right: ${({ theme }) => theme.spacing(3)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     margin-right: ${({ theme }) => theme.spacing(1)};
     
     border: unset;

package/node/components/PageHeader/styles.js

@@ -22,7 +22,7 @@ exports.Wrapper = styled_1.styled.header `
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     position: sticky;
     z-index: ${({ theme }) => theme.zIndex.fab};
     top: ${constants_2.PAGE_HEADER_HEIGHT_MOBILE};
@@ -71,7 +71,7 @@ exports.Wrapper = styled_1.styled.header `
       margin-top: ${({ theme }) => theme.spacing(3)};
     }
 
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       display: none;
     }
   }
@@ -79,7 +79,7 @@ exports.Wrapper = styled_1.styled.header `
 exports.MobileTitleWrapper = styled_1.styled.div `
   display: none;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     position: sticky;
     z-index: ${({ theme }) => theme.zIndex.fab};
     top: 0;

package/node/components/PageLayout/styles.js

@@ -5,7 +5,7 @@ const Alert_1 = require("../Alert");
 const styled_1 = require("../styled");
 exports.MobileAlertWrapper = styled_1.styled.div `
   display: none;
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: flex;
     flex-direction: column;
     gap: ${({ theme }) => theme.spacing(2)};
@@ -36,12 +36,12 @@ exports.DesktopAlertWrapper = styled_1.styled.div `
     margin-bottom: ${({ theme }) => theme.spacing(4)};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;
 exports.LoaderWrapper = styled_1.styled.div `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     order: 4;
 
     height: 100%;

package/node/components/PageLayoutContainer/styles.js

@@ -23,7 +23,7 @@ exports.Wrapper = styled_1.styled.div `
     padding-top: ${({ theme }) => theme.spacing(3)};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     scroll-behavior: smooth;
 
     overflow: hidden auto;
@@ -41,7 +41,7 @@ exports.Wrapper = styled_1.styled.div `
 exports.StyledPaper = (0, styled_1.styled)(Paper_1.Paper) `
   height: 100%;
   
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     border: unset;
 
     .${constants_1.pageLayoutClassnames.withoutHeader} {

package/node/components/PageLayoutFooter/styles.js

@@ -21,7 +21,7 @@ exports.Wrapper = styled_1.styled.footer `
     min-height: ${constants_1.FOOTER_LAPTOP_HEIGHT};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
 
     border-bottom-right-radius: 0;

package/node/components/PageLayoutLoader/styles.js

@@ -9,7 +9,7 @@ exports.Wrapper = styled_1.styled.div `
   border: 1px solid ${({ theme }) => theme.palette.components.border.default};
   border-radius: ${({ theme }) => theme.shape.medium};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     background-color: unset;
   }
 `;

package/node/components/PageLayoutSection/PageLayoutSectionContainer/styles.js

@@ -24,7 +24,7 @@ exports.SectionContainer = styled_1.styled.div `
     gap: ${({ theme }) => theme.spacing(5)};
   }
 
-  ${({ theme }) => theme.breakpoints.up('sm')} {
+  ${({ theme }) => theme.breakpoints.up('mobile')} {
     &.${constants_1.pageLayoutSectionContainerClassnames.withDivider} {
       & > :not(:last-child)::after {
         content: '';
@@ -40,7 +40,7 @@ exports.SectionContainer = styled_1.styled.div `
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     overflow: unset;
     gap: ${({ theme }) => theme.spacing(4)};
     order: 4;

package/node/components/PageLayoutSection/styles.js

@@ -4,7 +4,7 @@ exports.SectionWrapper = exports.Section = void 0;
 const styled_1 = require("../styled");
 const constants_1 = require("./constants");
 exports.Section = styled_1.styled.section `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     margin: ${({ theme }) => theme.spacing(0, 4)};
 
     background-color: ${({ theme }) => theme.palette.background.default};
@@ -19,7 +19,7 @@ exports.SectionWrapper = styled_1.styled.div `
     padding: ${({ theme }) => theme.spacing(0, 4)};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     padding: ${({ theme }) => theme.spacing(4)};
 
     &.${constants_1.pageLayoutSectionClassnames.isNoMobileSidePadding} {

package/node/components/PagePinnableAside/styles.js

@@ -31,7 +31,7 @@ exports.Aside = (0, styled_1.styled)('aside', {
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;
@@ -96,7 +96,7 @@ exports.Content = (0, styled_1.styled)('div', {
     border-radius: ${theme.shape.medium};
   `}
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     overflow: unset;
     order: -1;
 
@@ -128,7 +128,7 @@ exports.Footer = styled_1.styled.footer `
   background-color: ${({ theme }) => theme.palette.background.default};
   border-top: 1px solid ${({ theme }) => theme.palette.components.border.default};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 

package/node/components/Pagination/PaginationItem/styles.js

@@ -23,7 +23,7 @@ exports.StyledButton = (0, styled_1.styled)(Button_1.Button) `
   min-width: 32px;
   padding: 0;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     &.${constants_1.paginationItemClassnames.previousButton},
     &.${constants_1.paginationItemClassnames.nextButton} {
       padding: ${({ theme }) => theme.spacing(2)};

package/node/components/PdfViewer/ControlBar/styles.js

@@ -18,7 +18,7 @@ exports.Wrapper = styled_1.styled.div `
   width: ${constants_1.RESERVED_CONTROL_BAR_SPACE}px;
   height: 100%;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;

package/node/components/PdfViewer/List/styles.js

@@ -7,7 +7,7 @@ exports.Wrapper = styled_1.styled.div `
   flex-direction: column;
   gap: ${({ theme }) => theme.spacing(4)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     gap: 0;
   }
 `;

package/node/components/PdfViewer/PdfDocument/styles.js

@@ -51,7 +51,7 @@ exports.StyledDocument = (0, styled_1.styled)(react_pdf_1.Document, {
     }
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     margin: 0;
     padding: 0;
   }

package/node/components/PdfViewer/PdfPage/styles.js

@@ -25,7 +25,7 @@ exports.Wrapper = styled_1.styled.div `
     padding-top: 0;
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     border-top: ${({ $isViewerLite, theme }) => ($isViewerLite ? 'unset' : `1px solid ${theme.palette.components.border.default}`)};
     border-radius: ${({ $isViewerLite }) => !$isViewerLite && 0};
     box-shadow: ${({ $isViewerLite }) => !$isViewerLite && 'none'};

package/node/components/PdfViewer/styles.js

@@ -12,7 +12,7 @@ exports.PDFViewerContainer = styled_1.styled.div `
   height: 100%;
   padding-right: ${({ $isViewerLite, $enabledZoom }) => $isViewerLite || !$enabledZoom ? '0' : `${constants_1.RESERVED_CONTROL_BAR_SPACE}px`};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     padding-right: 0;
   }
 `;
@@ -23,7 +23,7 @@ exports.ScrollContainer = styled_1.styled.div `
 
   height: 100%;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     scrollbar-gutter: unset;
   }
 `;

package/node/components/Profile/MenuList/styles.js

@@ -25,19 +25,19 @@ exports.DisplayNameMenuItem = styled_1.styled.div `
 
   padding: ${({ theme }) => theme.spacing(3)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;
 exports.StyledMenuList = (0, styled_1.styled)(MenuList_1.MenuList) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     &.MuiList-root {
       border-radius: 0;
     }
   }
 `;
 exports.StyledDivider = (0, styled_1.styled)(Divider_1.Divider) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
    display: none;
   }
 `;

package/node/components/Profile/ProfileSkeleton/styles.js

@@ -6,7 +6,7 @@ exports.Wrapper = (0, styled_1.styled)('div') `
   display: flex;
   gap: ${({ theme }) => theme.spacing(3)};
   
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;

package/node/components/Profile/styles.js

@@ -18,7 +18,7 @@ exports.ProfileRoot = (0, styled_1.styled)(Button_1.Button) `
 
   text-align: left;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: 40px;
     height: 40px;
   }
@@ -33,7 +33,7 @@ exports.User = styled_1.styled.div `
   gap: ${({ theme }) => theme.spacing(1)};
   align-items: center;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     display: none;
   }
 `;
@@ -52,7 +52,7 @@ exports.StyledChevron = (0, styled_1.styled)(Chevron_1.Chevron) `
   height: 24px;
 `;
 exports.StyledAvatar = (0, styled_1.styled)(Avatar_1.Avatar) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: 32px;
     height: 32px;
   }

package/node/components/Radio/styles.js

@@ -91,7 +91,7 @@ exports.Input = styled_1.styled.input `
 
   opacity: 0;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: ${constants_1.MOBILE_RADIO_SIZE};
     height: ${constants_1.MOBILE_RADIO_SIZE};
   }
@@ -112,7 +112,7 @@ exports.IconWrapper = styled_1.styled.span `
   width: ${constants_1.RADIO_SIZE};
   height: ${constants_1.RADIO_SIZE};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: ${constants_1.MOBILE_RADIO_SIZE};
     height: ${constants_1.MOBILE_RADIO_SIZE};
 

package/node/components/RadioCard/styles.js

@@ -24,6 +24,12 @@ exports.Wrapper = styled_1.styled.label `
     ? theme.palette.error[700]
     : theme.palette.components.border.default};
 
+  transition: ${({ theme }) => {
+    return theme.transitions.create(['background-color', 'border-color'], {
+        duration: theme.transitions.duration.standard,
+    });
+}};
+
   ${({ $isDisabled, theme }) => $isDisabled &&
     `
       cursor: default;
@@ -56,12 +62,6 @@ exports.Wrapper = styled_1.styled.label `
       outline-offset: -2px;
     `}
 
-  transition: ${({ theme }) => {
-    return theme.transitions.create(['background-color', 'border-color'], {
-        duration: theme.transitions.duration.standard,
-    });
-}};
-
   & .${Radio_1.radioClassnames.disabled} ~ .${constants_1.radioCardClassnames.content} {
     cursor: default;
   }

package/node/components/RadioField/styles.js

@@ -17,7 +17,7 @@ exports.StyledFormControlLabel = (0, styled_1.styled)(FormControlLabel_1.default
     margin-left: 0;
     padding-top: calc(${({ theme }) => theme.spacing(1)} + 2px);
 
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       padding-top: calc(${({ theme }) => theme.spacing(2)} + 2px);
     }
   }

package/node/components/ScrollToTopButton/styles.js

@@ -8,7 +8,7 @@ exports.StyledFab = (0, styled_1.styled)(Fab_1.Fab) `
   right: ${({ theme }) => theme.spacing(3)};
   bottom: ${({ theme }) => theme.spacing(8)};
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     right: ${({ theme }) => theme.spacing(9)};
   }
 `;

package/node/components/Select/styles.js

@@ -49,7 +49,7 @@ exports.StyledSelect = (0, styled_1.styled)(Select_1.default, {
 
     border-radius: ${({ theme }) => theme.shape.small};
 
-    ${({ theme }) => theme.breakpoints.down('sm')} {
+    ${({ theme }) => theme.breakpoints.down('mobile')} {
       width: 24px;
       height: 24px;
     }

package/node/components/SideDialog/styles.js

@@ -60,7 +60,7 @@ exports.StyledDrawer = (0, styled_1.styled)(Drawer_1.default, {
   }
 `;
 exports.StyledBottomDrawer = (0, styled_1.styled)(BottomDrawer_1.BottomDrawer) `
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     /* Причина игнора: Не критично для отображения */
     /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
     &:has(.${constants_1.sideDialogHeaderClassnames.root}) {

package/node/components/SideDialogHeader/styles.js

@@ -22,7 +22,7 @@ exports.StyledDialogHeader = (0, styled_1.styled)(DialogHeader_1.DialogHeader) `
     border-bottom: 1px solid ${({ theme }) => theme.palette.components.border.default};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     position: sticky;
     z-index: ${({ theme }) => theme.zIndex.modal};
     top: 0;

package/node/components/StaticCalendar/StaticCalendarButton/styles.js

@@ -6,7 +6,7 @@ const styled_1 = require("../../styled");
 exports.Wrapper = (0, styled_1.styled)(Button_1.Button) `
   min-width: auto;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     min-width: 48px;
   }
 `;

package/node/components/StaticCalendar/StaticCalendarGridButton/styles.js

@@ -73,7 +73,7 @@ exports.StaticCalendarGridButton = (0, styled_1.styled)(StaticCalendarButton_1.S
     color: ${(props) => (0, utils_1.getTextColor)(props)};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: 100%;
     min-width: 48px;
     height: 48px;

package/node/components/Stepper/StepIcon/styles.js

@@ -9,7 +9,7 @@ const iconsSize = (theme) => (0, styled_1.css) `
   width: 20px;
   height: 20px;
 
-  ${theme.breakpoints.down('sm')} {
+  ${theme.breakpoints.down('mobile')} {
     width: 24px;
     height: 24px;
   }

package/node/components/SvgIcon/styles.js

@@ -34,7 +34,6 @@ exports.StyledSvg = styled_1.styled.svg `
   flex-shrink: 0;
 
   font-size: ${({ theme }) => theme.typography.pxToRem(24)};
-
   color: ${({ theme, color }) => getColor(theme, color)};
   
   fill: currentColor; 

package/node/components/Switch/styles.js

@@ -38,7 +38,7 @@ exports.StyledSwitch = (0, styled_1.styled)(Switch_1.default) `
     display: none;
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     margin: ${({ theme }) => theme.microSpacing(3, 0)};
   }
 `;
@@ -51,7 +51,7 @@ exports.StyledFormControlLabel = (0, styled_1.styled)(FormControlLabel_2.FormCon
     margin: 0;
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     gap: ${({ theme }) => theme.spacing(2)};
   }
 `;

package/node/components/Tabs/styles.js

@@ -31,7 +31,7 @@ exports.Container = styled_1.styled.div `
 
   width: 100%;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     /* Убираем видимую полосу прокрутки в firefox */
     scrollbar-width: none;
 

package/node/components/Tag/styles.js

@@ -191,7 +191,7 @@ exports.StyledIconButton = (0, styled_1.styled)(IconButton_1.IconButton, {
     background-color: ${({ theme, $color, $variant }) => getDeleteIconBgColor({ theme, variant: $variant, color: $color })};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: ${({ $size }) => ($size === 'large' ? '24px' : '16px')};
     height: ${({ $size }) => ($size === 'large' ? '24px' : '16px')};
     padding: 0;

package/node/components/ToggleButtonGroup/styles.js

@@ -9,7 +9,7 @@ const styled_1 = require("../styled");
 exports.ScrollContainer = styled_1.styled.div `
   overflow-x: auto;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     /* Убираем видимую полосу прокрутки в firefox */
     scrollbar-width: none;
 

package/node/components/Tree/MultipleTreeList/TreeItem/styles.js

@@ -15,13 +15,13 @@ exports.StyledCheckbox = (0, styled_1.styled)(Checkbox_1.Checkbox) `
     height: 16px;
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
-    height: 20px;
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     width: ${Checkbox_1.MOBILE_CHECKBOX_SIZE};
+    height: 20px;
 
     & .${Checkbox_1.checkboxClassnames.iconWrapper}, & .${Checkbox_1.checkboxClassnames.input} {
-      height: 20px;
       width: ${Checkbox_1.MOBILE_CHECKBOX_SIZE};
+      height: 20px;
     }
   }
 `;
@@ -37,10 +37,11 @@ exports.StyledTreeItem = (0, styled_1.styled)(TreeItem_1.TreeItem) `
     margin-left: ${Checkbox_1.CHECKBOX_SIZE};
   }
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     & .${FormControlLabel_1.formControlLabelClasses.root} {
-      margin-left: 0;
       gap: ${({ theme }) => theme.spacing(1)};
+
+      margin-left: 0;
     }
 
     & .${TreeItem_1.treeClassnames.note} {

package/node/components/Tree/MultipleTreeList/styles.js

@@ -6,29 +6,28 @@ const mixins_1 = require("../../styled/mixins");
 exports.ListWrapper = styled_1.styled.div `
   display: contents;
   
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
     position: relative;
+    transform: translateZ(0);
 
+    overflow: hidden;
     display: flex;
     flex-direction: column;
 
     height: 100%;
     min-height: 0;
-
-    overflow: hidden;
-
-    transform: translateZ(0);
   }
 `;
 exports.List = styled_1.styled.ul `
   ${mixins_1.listContainer};
   position: relative;
+
   overflow: hidden;
 
-  ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
+    overflow-y: auto;
     flex-grow: 1;
-    min-height: 0;
 
-    overflow-y: auto;
+    min-height: 0;
   }
 `;