@wix/patterns 1.356.0 → 1.358.0

package/src/components/CollectionToolbar/CollectionToolbarActionsGroupResponsiveLayout.tsx

@@ -1,7 +1,6 @@
 import React, { cloneElement, Fragment } from 'react';
-import { HorizontalAvailableSpaceBox } from '../Responsive/HorizontalAvailableSpaceBox';
+import { Box } from '@wix/design-system';
 import { ToolbarItem } from '../ToolbarItem/ToolbarItem';
-import { HorizontalOverflowBox } from '../Responsive/HorizontalOverflowBox';
 import { ToolbarGroupScrollWidthBox } from './ToolbarGroupScrollWidthBox';
 import { SearchOrCustomFilter } from './SearchOrCustomFilter';
 import { useToolbarCollectionContext } from '../ToolbarCollectionContext';
@@ -74,17 +73,33 @@ export function CollectionToolbarActionsGroupResponsiveLayout(
   );
 
   child = (
-    <HorizontalOverflowBox state={responsive.overflow} gap="SP2">
+    <Box
+      ref={(element) => {
+        responsive._contentElement = element;
+      }}
+      dataHook="horizontal-overflow-box"
+      minWidth={0}
+      direction="horizontal"
+      gap="SP2"
+    >
       {child}
-    </HorizontalOverflowBox>
+    </Box>
   );
 
   child = <ToolbarItem>{child}</ToolbarItem>;
 
   child = (
-    <HorizontalAvailableSpaceBox state={responsive.actionsAvailableSpace}>
+    <Box
+      ref={(element) => {
+        responsive._measurementElement = element;
+      }}
+      minWidth={0}
+      flex={1}
+      align="right"
+      direction="horizontal"
+    >
       {child}
-    </HorizontalAvailableSpaceBox>
+    </Box>
   );
 
   return child;

package/src/components/CollectionToolbar/CollectionToolbarLeftGroup.tsx

@@ -26,6 +26,7 @@ function _CollectionToolbarLeftGroup<T, F extends FiltersMap>(
   } = state;
 
   const isLeftElementMode = mode === 'tabs' || mode === 'title';
+  const shouldMeasure = isLeftElementMode && !responsive.responsiveDisabled;
   const container = useRef<HTMLDivElement | null>(null);
 
   const [leftGroupState] = useState(
@@ -38,7 +39,17 @@ function _CollectionToolbarLeftGroup<T, F extends FiltersMap>(
       }),
   );
 
-  useEffect(() => leftGroupState.init(container.current?.parentElement), []);
+  useEffect(() => {
+    if (!shouldMeasure) {
+      return;
+    }
+    responsive.leftGroupState = leftGroupState;
+    const dispose = leftGroupState.init(container.current?.parentElement);
+    return () => {
+      dispose();
+      responsive.leftGroupState = null;
+    };
+  }, [shouldMeasure]);
 
   const content = left ?? (
     <>

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SearchOrCustomFilter2160477628";
+var _namespace_ = "SearchOrCustomFilter2095154025";
 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":"SearchOrCustomFilter2160477628__root","search":"SearchOrCustomFilter2160477628__search","searchMobile":"SearchOrCustomFilter2160477628__searchMobile"};
+export var classes = {"root":"SearchOrCustomFilter2095154025__root","search":"SearchOrCustomFilter2095154025__search","searchMobile":"SearchOrCustomFilter2095154025__searchMobile"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionToolbar/SearchOrCustomFilter.tsx

@@ -7,6 +7,10 @@ import { observer } from 'mobx-react-lite';
 import { useIsMobile } from '../../hooks/useIsMobile';
 import { CollectionSearchElement } from '../assertComponentType.js';
 import { runInAction } from 'mobx';
+import {
+  SEARCH_COLLAPSED_WIDTH,
+  SEARCH_EXPANDED_WIDTH,
+} from '../../state/Toolbar/toolbarResponsiveConstants';
 
 export interface SearchOrCustomFilterProps {
   search: ToolbarBaseProps['search'];
@@ -94,9 +98,11 @@ function _SearchOrCustomFilter(props: SearchOrCustomFilterProps) {
 
   const shouldShrink = searchResponsive._shouldShrink;
 
+  const width = shouldShrink ? SEARCH_COLLAPSED_WIDTH : SEARCH_EXPANDED_WIDTH;
+
   return (
-    <Box direction="horizontal" width={shouldShrink ? '140px' : '240px'}>
-      <Box width={shouldShrink ? '140px' : '240px'}>{search}</Box>
+    <Box direction="horizontal" width={`${width}px`}>
+      <Box width={`${width}px`}>{search}</Box>
     </Box>
   );
 }

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "AutoCompleteReadonly1513506310";
+var _namespace_ = "AutoCompleteReadonly3763682685";
 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":"AutoCompleteReadonly1513506310__root"};
+export var classes = {"root":"AutoCompleteReadonly3763682685__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_ = "ViewsDropdown2961856319";
+var _namespace_ = "ViewsDropdown3132423709";
 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":"ViewsDropdown2961856319__root"};
+export var classes = {"root":"ViewsDropdown3132423709__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CustomFieldsTransforms/transformOperatorFilterToWQL.tsx

@@ -117,38 +117,13 @@ export const transformOperatorFilterToWQL = <T,>(
         },
       ];
 
-    case FilterOperator.LESS_THAN:
+    case FilterOperator.NOT_EXISTS:
       return [
         {
-          [filterName]: {
-            $lt: value,
-          },
-        },
-      ];
-
-    case FilterOperator.LESS_THAN_OR_EQUAL:
-      return [
-        {
-          [filterName]: {
-            $lte: value,
-          },
-        },
-      ];
-
-    case FilterOperator.GREATER_THAN:
-      return [
-        {
-          [filterName]: {
-            $gt: value,
-          },
-        },
-      ];
-
-    case FilterOperator.GREATER_THAN_OR_EQUAL:
-      return [
-        {
-          [filterName]: {
-            $gte: value,
+          $not: {
+            [filterName]: {
+              $exists: true,
+            },
           },
         },
       ];

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "DragHandle4277933372";
+var _namespace_ = "DragHandle3887572879";
 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":"DragHandle4277933372__root"};
+export var classes = {"root":"DragHandle3887572879__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_ = "EntityPagePlain1591347465";
+var _namespace_ = "EntityPagePlain673223306";
 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":"EntityPagePlain1591347465__root"};
+export var classes = {"root":"EntityPagePlain673223306__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_ = "Fade1764712389";
+var _namespace_ = "Fade4075889701";
 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":"Fade1764712389__root"};
+export var classes = {"root":"Fade4075889701__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "Heading847109370";
+var _namespace_ = "Heading2155534684";
 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":"Heading847109370__root"};
+export var classes = {"root":"Heading2155534684__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_ = "InputOverflow2088092077";
+var _namespace_ = "InputOverflow549173886";
 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":"InputOverflow2088092077__root"};
+export var classes = {"root":"InputOverflow549173886__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_ = "LoadingRow1000755167";
+var _namespace_ = "LoadingRow715355924";
 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":"LoadingRow1000755167__root"};
-export var keyframes = {"gradientSwoosh":"LoadingRow1000755167__gradientSwoosh"}; 
+export var classes = {"root":"LoadingRow715355924__root"};
+export var keyframes = {"gradientSwoosh":"LoadingRow715355924__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_ = "MaxHeightText127484102";
+var _namespace_ = "MaxHeightText2159478735";
 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":"MaxHeightText127484102__root"};
+export var classes = {"root":"MaxHeightText2159478735__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_ = "MaxLines4185833091";
+var _namespace_ = "MaxLines2795738033";
 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":"MaxLines4185833091__root"};
+export var classes = {"root":"MaxLines2795738033__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_ = "MultiBulkActionToolbar3485840595";
+var _namespace_ = "MultiBulkActionToolbar1326572443";
 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":"MultiBulkActionToolbar3485840595__root","leftGroupWrapper":"MultiBulkActionToolbar3485840595__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar3485840595__selectedCountItem","selectedCountText":"MultiBulkActionToolbar3485840595__selectedCountText"};
+export var classes = {"root":"MultiBulkActionToolbar1326572443__root","leftGroupWrapper":"MultiBulkActionToolbar1326572443__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar1326572443__selectedCountItem","selectedCountText":"MultiBulkActionToolbar1326572443__selectedCountText"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTable/NestedTablePlaceholderStatesRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "NestedTablePlaceholderStatesRow3102582073";
+var _namespace_ = "NestedTablePlaceholderStatesRow300385774";
 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":"NestedTablePlaceholderStatesRow3102582073__root"};
+export var classes = {"root":"NestedTablePlaceholderStatesRow300385774__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTable/NestedTableRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "NestedTableRow435395777";
+var _namespace_ = "NestedTableRow1027691268";
 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":"NestedTableRow435395777__root","firstLevel":"NestedTableRow435395777__firstLevel","placeholder":"NestedTableRow435395777__placeholder","parentHovered":"NestedTableRow435395777__parentHovered"};
+export var classes = {"root":"NestedTableRow1027691268__root","firstLevel":"NestedTableRow1027691268__firstLevel","placeholder":"NestedTableRow1027691268__placeholder","parentHovered":"NestedTableRow1027691268__parentHovered"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTableDragAndDrop/MultipleDragOverlayEffect.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "MultipleDragOverlayEffect1798748667";
+var _namespace_ = "MultipleDragOverlayEffect1844988275";
 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":"MultipleDragOverlayEffect1798748667__root"};
+export var classes = {"root":"MultipleDragOverlayEffect1844988275__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTableDragAndDrop/NestedTableDragAndDropRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "NestedTableDragAndDropRow536739820";
+var _namespace_ = "NestedTableDragAndDropRow2212520299";
 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":"NestedTableDragAndDropRow536739820__root"};
+export var classes = {"root":"NestedTableDragAndDropRow2212520299__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/OperatorFilterPicker/OperatorFilterPicker.tsx

@@ -73,6 +73,10 @@ function _OperatorFilterPicker<T>(props: OperatorPickerProps<T>) {
           selectedId={state.operator}
           onSelect={(option) => state.setOperator(option.id as FilterOperator)}
           dataHook="operator-picker-operator-dropdown"
+          appendTo="window"
+          flip
+          fixed
+          placement="bottom-start"
         >
           {({ toggle }) => (
             <TextButton

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerContent1483133467";
+var _namespace_ = "PickerContent103951023";
 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":"PickerContent1483133467__root"};
+export var classes = {"root":"PickerContent103951023__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/PickerContent/PickerContentAdditionalStep.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerContentAdditionalStep2350456131";
+var _namespace_ = "PickerContentAdditionalStep1773642125";
 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":"PickerContentAdditionalStep2350456131__root","titles":"PickerContentAdditionalStep2350456131__titles","suffix":"PickerContentAdditionalStep2350456131__suffix"};
+export var classes = {"root":"PickerContentAdditionalStep1773642125__root","titles":"PickerContentAdditionalStep1773642125__titles","suffix":"PickerContentAdditionalStep1773642125__suffix"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerTableListItem1352494786";
+var _namespace_ = "PickerTableListItem4187040111";
 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":"PickerTableListItem1352494786__root"};
+export var classes = {"root":"PickerTableListItem4187040111__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ScrollableContent2750337770";
+var _namespace_ = "ScrollableContent4163581334";
 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":"ScrollableContent2750337770__root"};
+export var classes = {"root":"ScrollableContent4163581334__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SkeletonCard706388614";
+var _namespace_ = "SkeletonCard916187800";
 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":"SkeletonCard706388614__root","headerLoading":"SkeletonCard706388614__headerLoading"};
+export var classes = {"root":"SkeletonCard916187800__root","headerLoading":"SkeletonCard916187800__headerLoading"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SlidingModal1582328146";
+var _namespace_ = "SlidingModal1944906977";
 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":"SlidingModal1582328146__root"};
+export var classes = {"root":"SlidingModal1944906977__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};