@wix/patterns 1.263.0 → 1.264.0

package/dist/types/themes/panel-theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel-theme.d.ts","sourceRoot":"","sources":["../../../src/themes/panel-theme.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,eAAO,MAAM,UAAU,EAAE,aAkBxB,CAAC"}

package/dist/types/version.d.ts

@@ -1,2 +1,2 @@
-export declare const version = "patterns@1.263.0";
+export declare const version = "patterns@1.264.0";
 //# sourceMappingURL=version.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/patterns",
-  "version": "1.263.0",
+  "version": "1.264.0",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
@@ -198,7 +198,7 @@
   ],
   "dependencies": {
     "@wix/agent-platform-bm-sdk": "^1.0.0",
-    "@wix/bex-core": "2.212.0",
+    "@wix/bex-core": "2.213.0",
     "@wix/bex-utils": "2.61.0",
     "@wix/essentials": "^0.1.26",
     "@wix/sdk": "^1.15.22",
@@ -417,5 +417,5 @@
   "wallaby": {
     "autoDetect": true
   },
-  "falconPackageHash": "792a5f6ce3962fa5dbff3757cea0c4d6214118b9377ef49491d9d105"
+  "falconPackageHash": "03cfe29d0b8e7601405ee3b6f093253d30507d3c1432f9a6b8701008"
 }

package/src/components/CardContainer/CardContainer.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CardContainer2488312148";
+var _namespace_ = "CardContainer2055806073";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"CardContainer2488312148__root"};
+export var classes = {"root":"CardContainer2055806073__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Collapse/Collapse.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "Collapse3409195705";
+var _namespace_ = "Collapse2575569709";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"Collapse3409195705__root","exit":"Collapse3409195705__exit"};
+export var classes = {"root":"Collapse2575569709__root","exit":"Collapse2575569709__exit"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionCard/CollectionCard.tsx

@@ -43,7 +43,7 @@ function _CollectionCard<T, F extends FiltersMap>({
 }: CollectionCardProps<T, F>) {
   const page = usePageContext();
 
-  const { containerLayoutType } = useWixPatternsContainer();
+  const { isPanelLayout } = useWixPatternsContainer();
 
   const { modalsContainerRef, stackingRootRef } = page;
 
@@ -119,7 +119,7 @@ function _CollectionCard<T, F extends FiltersMap>({
           }}
         />
 
-        {containerLayoutType === 'panel' ? (
+        {isPanelLayout ? (
           <WixPatternsPanelModalsContainer state={state.panels} />
         ) : (
           <WixPatternsModalsContainer

package/src/components/CollectionPageFooter/CollectionPageFooter.tsx

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { ReactElement } from 'react';
+import { useCollectionPageFooter } from '../../state/CollectionPage';
+
+export interface CollectionPageFooterProps {
+  children?: React.ReactNode;
+}
+
+export type CollectionPageFooterElement = ReactElement<
+  CollectionPageFooterProps,
+  typeof CollectionPageFooter
+>;
+
+export function CollectionPageFooter(_props: CollectionPageFooterProps) {
+  return null;
+}
+
+CollectionPageFooter.useCollectionPageFooter = useCollectionPageFooter;
+CollectionPageFooter.displayName = 'CollectionPageFooter';

package/src/components/CollectionPageFooter/index.ts

@@ -0,0 +1 @@
+export * from './CollectionPageFooter';

package/src/components/CollectionPageNew/CollectionPage.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CollectionPage3091439071";
+var _namespace_ = "CollectionPage83339576";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"CollectionPage3091439071__root"};
+export var classes = {"root":"CollectionPage83339576__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionPageNew/CollectionPage.tsx

@@ -1,4 +1,4 @@
-import { PageProps, Page } from '@wix/design-system';
+import { PageProps, Page, SidePanel } from '@wix/design-system';
 import React, { ReactNode, useEffect, useState } from 'react';
 import { useCollectionPageChild } from '../../hooks/useCollectionPageChild';
 import { CollectionPageHeader } from '../CollectionPageHeaderNew';
@@ -16,6 +16,7 @@ import {
 
 import { useCollectionPageLoadReporting } from './useCollectionPageLoadReporting';
 import { useIsMobile } from '../../hooks/useIsMobile';
+import { CollectionPageFooter } from '../CollectionPageFooter';
 
 export interface CollectionPageProps extends PageProps {
   /**
@@ -63,8 +64,16 @@ function _CollectionPage({
 
   const isMobile = useIsMobile();
 
-  return (
-    <CollectionPageContextProvider value={collectionPageState}>
+  let child;
+
+  if (container.isPanelLayout) {
+    child = (
+      <SidePanel width="100%" skin="floating">
+        {wrappedChildren}
+      </SidePanel>
+    );
+  } else {
+    child = (
       <PageWrapperBase pageState={collectionPageState.pageState}>
         <Page
           className={st(classes.root, { mobile: isMobile })}
@@ -78,12 +87,19 @@ function _CollectionPage({
           {wrappedChildren}
         </Page>
       </PageWrapperBase>
+    );
+  }
+
+  return (
+    <CollectionPageContextProvider value={collectionPageState}>
+      {child}
     </CollectionPageContextProvider>
   );
 }
 
 _CollectionPage.Header = CollectionPageHeader;
 _CollectionPage.Content = CollectionPageContent;
+_CollectionPage.Footer = CollectionPageFooter;
 
 _CollectionPage.displayName = 'CollectionPage';
 

package/src/components/CollectionTable/CollectionTable.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CollectionTable3574185100";
+var _namespace_ = "CollectionTable1873965278";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"CollectionTable3574185100__root"};
+export var classes = {"root":"CollectionTable1873965278__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionToolbar/CollectionToolbar.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CollectionToolbar1743802385";
+var _namespace_ = "CollectionToolbar363269901";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"CollectionToolbar1743802385__root","left":"CollectionToolbar1743802385__left","right":"CollectionToolbar1743802385__right","fullWidth":"CollectionToolbar1743802385__fullWidth"};
+export var classes = {"root":"CollectionToolbar363269901__root","left":"CollectionToolbar363269901__left","right":"CollectionToolbar363269901__right","fullWidth":"CollectionToolbar363269901__fullWidth"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionToolbar/CollectionToolbar.tsx

@@ -31,6 +31,7 @@ import { CollectionToolbarSkeletonItem } from './CollectionToolbarSkeletonItem';
 import { useIsMobile } from '../../hooks/useIsMobile';
 import { isValidElement } from '../isValidElement';
 import { CollectionSearch } from '../CollectionSearch';
+import { useWixPatternsContainer } from '@wix/bex-core/react';
 
 export interface CollectionToolbarProps<T, F extends FiltersMap> {
   state: ToolbarCollectionState<T, F>;
@@ -77,6 +78,8 @@ function _CollectionToolbar<T, F extends FiltersMap>(
     moreActions,
   } = props;
 
+  const { isPanelLayout } = useWixPatternsContainer();
+
   const isMobile = useIsMobile();
 
   assertComponentType(
@@ -291,7 +294,11 @@ function _CollectionToolbar<T, F extends FiltersMap>(
   return (
     <CollectionProvider value={collection}>
       <Box direction="vertical" dataHook={dataHook}>
-        <Box minHeight={title?.props.subtitle ? '78px' : '60px'}>
+        <Box
+          minHeight={
+            isPanelLayout ? '48px' : title?.props.subtitle ? '78px' : '60px'
+          }
+        >
           {state.isReorderModeToolbarVisible ? (
             dragAndDropReorderModeToolbar
           ) : (

package/src/components/CollectionToolbar/SearchOrCustomFilter.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SearchOrCustomFilter1952909110";
+var _namespace_ = "SearchOrCustomFilter3001369942";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"SearchOrCustomFilter1952909110__root","search":"SearchOrCustomFilter1952909110__search","searchMobile":"SearchOrCustomFilter1952909110__searchMobile"};
+export var classes = {"root":"SearchOrCustomFilter3001369942__root","search":"SearchOrCustomFilter3001369942__search","searchMobile":"SearchOrCustomFilter3001369942__searchMobile"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionViewsDropdown/AutoCompleteReadonly.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "AutoCompleteReadonly779197060";
+var _namespace_ = "AutoCompleteReadonly789628355";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"AutoCompleteReadonly779197060__root"};
+export var classes = {"root":"AutoCompleteReadonly789628355__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionViewsDropdown/ViewsDropdown.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ViewsDropdown3379161903";
+var _namespace_ = "ViewsDropdown1461627814";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"ViewsDropdown3379161903__root"};
+export var classes = {"root":"ViewsDropdown1461627814__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CustomColumnsPanel/CustomColumnsPanel.tsx

@@ -1,4 +1,4 @@
-import { SidePanel, Box } from '@wix/design-system';
+import { Box, SidePanel } from '@wix/design-system';
 import React, { useEffect } from 'react';
 import { CustomColumnsState } from '../../state';
 import { FiltersMap, withoutDefaults } from '@wix/bex-core';
@@ -10,6 +10,7 @@ import { CustomColumnsNoResults } from './CustomColumnsNoResults';
 import { useRafRender } from '../../hooks/useRafRender';
 import { cairoFiltersPanelUsed } from '@wix/bex-core/bi';
 import { ScrollableContent } from '../ScrollableContent';
+import { PatternsSidePanel } from '../SidePanel/PatternsSidePanel';
 
 export interface CustomColumnsPanelProps<T, F extends FiltersMap> {
   state: CustomColumnsState<T, F>;
@@ -39,10 +40,10 @@ export function _CustomColumnsPanel<T, F extends FiltersMap>({
   const shouldShowSearch = isUsingDataExtension || totalColumns > 5;
 
   return (
-    <SidePanel
+    <PatternsSidePanel
       dataHook="custom-columns-panel"
       width="100%"
-      onCloseButtonClick={() => {
+      onClose={() => {
         table.reportBi(
           withoutDefaults(cairoFiltersPanelUsed)({
             isOpened: false,
@@ -86,7 +87,7 @@ export function _CustomColumnsPanel<T, F extends FiltersMap>({
         ?.CustomColumnsAddCustomFieldCTAButton && (
         <collectionDataExtension.DataExtension.CustomColumnsAddCustomFieldCTAButton />
       )}
-    </SidePanel>
+    </PatternsSidePanel>
   );
 }
 

package/src/components/CustomFieldsPanel/CustomFieldsPanel.tsx

@@ -9,6 +9,7 @@ import { CustomFieldsList } from './CustomFieldsList';
 import { AddCustomFieldCTAButton } from './AddCustomFieldCTAButton';
 import { cairoFiltersPanelUsed } from '@wix/bex-core/bi';
 import { CustomFieldsPanelState } from '../../state/CustomFields/CustomFieldsPanelState';
+import { PatternsSidePanel } from '../SidePanel/PatternsSidePanel';
 
 export interface CustomFieldsPanelProps {
   state: CustomFieldsPanelState;
@@ -25,10 +26,10 @@ export function _CustomFieldsPanel({ state }: CustomFieldsPanelProps) {
   }
 
   return (
-    <SidePanel
+    <PatternsSidePanel
       dataHook="custom-fields-panel"
       width="100%"
-      onCloseButtonClick={() => {
+      onClose={() => {
         state.reportBi(
           withoutDefaults(cairoFiltersPanelUsed)({
             isOpened: false,
@@ -61,7 +62,7 @@ export function _CustomFieldsPanel({ state }: CustomFieldsPanelProps) {
           />
         </Box>
       </Box>
-    </SidePanel>
+    </PatternsSidePanel>
   );
 }
 

package/src/components/DateRangeFilter/DateRangeFilter.tsx

@@ -16,6 +16,7 @@ import {
   renderPresetToolbarTag,
 } from '@wix/bex-core';
 import { useDateRangeFilterState } from '../../hooks';
+import { usePatternsTheme } from '../../themes/PatternsThemeProvider';
 
 export interface DateRangeFilterProps
   extends FilterProps<RangeItem<Date>>,
@@ -52,6 +53,9 @@ function _DateRangeFilter(props: DateRangeFilterProps) {
   } = props;
 
   const { translate: t } = useWixPatternsContainer();
+  const {
+    radioGroup: { spacing },
+  } = usePatternsTheme();
   const state = useDateRangeFilterState({
     filter,
     filterByTime,
@@ -100,6 +104,7 @@ function _DateRangeFilter(props: DateRangeFilterProps) {
           onChange={(v) =>
             v && state.dateRangePicker.onPresetChanged(v.toString())
           }
+          spacing={spacing}
           dataHook="date-range-filter-group"
         >
           {Object.values(dateRangePreset).map((preset) =>

package/src/components/DragHandle/DragHandle.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "DragHandle3491303079";
+var _namespace_ = "DragHandle1355224633";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"DragHandle3491303079__root"};
+export var classes = {"root":"DragHandle1355224633__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EntityPage/EntityPagePlain.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "EntityPagePlain2805193397";
+var _namespace_ = "EntityPagePlain3842564122";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"EntityPagePlain2805193397__root"};
+export var classes = {"root":"EntityPagePlain3842564122__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Fade/Fade.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "Fade801000593";
+var _namespace_ = "Fade1408656930";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"Fade801000593__root"};
+export var classes = {"root":"Fade1408656930__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/FiltersPanel/FilterAccordionTitle.tsx

@@ -4,6 +4,7 @@ import { Filter } from '@wix/bex-core';
 import { observer } from 'mobx-react-lite';
 import { FilterProps } from '../../model';
 import { FilterToolbarState } from '../../providers';
+import { usePatternsTheme } from '../../themes/PatternsThemeProvider';
 
 export interface FilterAccordionTitleProps<V> {
   state: FilterToolbarState;
@@ -17,11 +18,14 @@ function _FilterAccordionTitle<V>(props: FilterAccordionTitleProps<V>) {
 
   const filter = state.getPendingFilter(props.filter);
 
+  const { sizes } = usePatternsTheme();
+
   return (
     <Text
       dataHook={`accordion-item-title-${filter.name}`}
       ellipsis
       weight="normal"
+      size={sizes.medium}
     >
       {`${accordionItemProps?.label ?? ''}${
         filter.size > 0 ? ` (${filter.size})` : ''

package/src/components/FiltersPanel/FiltersPanel.tsx

@@ -1,9 +1,4 @@
-import {
-  Accordion,
-  SidePanel,
-  SidePanelProps,
-  WixStyleReactDefaultsOverrideProvider,
-} from '@wix/design-system';
+import { Accordion, SidePanel, SidePanelProps, WixStyleReactDefaultsOverrideProvider } from '@wix/design-system';
 import React, { useState } from 'react';
 import { FiltersMap } from '@wix/bex-core';
 import { observer } from 'mobx-react-lite';
@@ -14,6 +9,7 @@ import { FiltersPanelState } from './FiltersPanelState';
 import { useWixPatternsContainer } from '@wix/bex-core/react';
 import { useRafRender } from '../../hooks/useRafRender';
 import { CollectionToolbarFiltersState } from '../CollectionToolbarFilters/CollectionToolbarFiltersState';
+import { PatternsSidePanel } from '../SidePanel/PatternsSidePanel';
 
 export interface FiltersPanelProps<T, F extends FiltersMap>
   extends Partial<SidePanelProps> {
@@ -61,9 +57,9 @@ function _FiltersPanel<T, F extends FiltersMap>(
   }
 
   let child = (
-    <SidePanel
+    <PatternsSidePanel
       dataHook="filters-side-panel"
-      onCloseButtonClick={filtersPanelState.onCloseButtonClick}
+      onClose={filtersPanelState.onCloseButtonClick}
       width="100%"
       {...rest}
     >
@@ -97,7 +93,7 @@ function _FiltersPanel<T, F extends FiltersMap>(
         />
       </SidePanel.Footer>
       {children}
-    </SidePanel>
+    </PatternsSidePanel>
   );
 
   child = (

package/src/components/Heading/Heading.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "Heading3921377375";
+var _namespace_ = "Heading1971196384";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"Heading3921377375__root"};
+export var classes = {"root":"Heading1971196384__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/InputOverflow/InputOverflow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "InputOverflow1473031221";
+var _namespace_ = "InputOverflow1986854382";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"InputOverflow1473031221__root"};
+export var classes = {"root":"InputOverflow1986854382__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/LoadingRow/LoadingRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "LoadingRow3543269352";
+var _namespace_ = "LoadingRow2368040009";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,8 +13,8 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"LoadingRow3543269352__root"};
-export var keyframes = {"gradientSwoosh":"LoadingRow3543269352__gradientSwoosh"}; 
+export var classes = {"root":"LoadingRow2368040009__root"};
+export var keyframes = {"gradientSwoosh":"LoadingRow2368040009__gradientSwoosh"}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 

package/src/components/MaxHeightText/MaxHeightText.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "MaxHeightText3576219268";
+var _namespace_ = "MaxHeightText4145661589";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"MaxHeightText3576219268__root"};
+export var classes = {"root":"MaxHeightText4145661589__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/MaxLines/MaxLines.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "MaxLines1857967116";
+var _namespace_ = "MaxLines2629824244";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"MaxLines1857967116__root"};
+export var classes = {"root":"MaxLines2629824244__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/MultiBulkActionToolbar/MultiBulkActionToolbar.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "MultiBulkActionToolbar1719938158";
+var _namespace_ = "MultiBulkActionToolbar132225335";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"MultiBulkActionToolbar1719938158__root"};
+export var classes = {"root":"MultiBulkActionToolbar132225335__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/MultiLevelSorting/MultiLevelSortingCTAButton.tsx

@@ -19,7 +19,7 @@ export function _MultiLevelSortingCTAButton<T, F extends FiltersMap>(
   const { state } = props;
   const {
     panels,
-    container: { translate: t },
+    container: { translate: t, isPanelLayout },
     toolbar: { responsive },
   } = state;
 
@@ -49,6 +49,7 @@ export function _MultiLevelSortingCTAButton<T, F extends FiltersMap>(
     >
       <ResponsiveButton
         state={responsive.actions}
+        shouldShrink={!isPanelLayout}
         icon={<ChangeOrderSmall />}
         dataHook="multi-level-sorting-button"
         onClick={() => {