@wix/patterns 1.308.0 → 1.317.0

package/src/components/CollectionToolbar/useIsCollectionToolbarExists.tsx

@@ -3,7 +3,10 @@ import { CollectionToolbarProps } from './CollectionToolbar';
 
 export const useIsCollectionToolbarExists = <T, F extends FiltersMap>(
   props: CollectionToolbarProps<T, F>,
-  { excludeSearch = false }: { excludeSearch?: boolean } = {},
+  {
+    excludeSearch = false,
+    isMobile,
+  }: { excludeSearch?: boolean; isMobile?: boolean } = {},
 ): boolean => {
   const {
     title,
@@ -22,7 +25,7 @@ export const useIsCollectionToolbarExists = <T, F extends FiltersMap>(
   } = props;
 
   const hasExplicitFeatures = !!(
-    title ||
+    (!isMobile && title) ||
     tabs ||
     views ||
     customColumns ||

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "AutoCompleteReadonly149958630";
+var _namespace_ = "AutoCompleteReadonly4275111943";
 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":"AutoCompleteReadonly149958630__root"};
+export var classes = {"root":"AutoCompleteReadonly4275111943__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_ = "ViewsDropdown388446974";
+var _namespace_ = "ViewsDropdown71665548";
 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":"ViewsDropdown388446974__root"};
+export var classes = {"root":"ViewsDropdown71665548__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CustomColumnsPanel/CustomColumnsPanel.tsx

@@ -88,6 +88,7 @@ export function _CustomColumnsPanel<T, F extends FiltersMap>({
                   dataExtension={collectionDataExtension.dataExtension}
                   onCloseSidePanel={() => sidePanel.close()}
                   dataHook="custom-columns"
+                  actionContainerProps={{ paddingInlineEnd: '12px' }}
                 />
               )}
             <ColumnsList state={state} />

package/src/components/CustomDrawerLayout.tsx

@@ -0,0 +1,82 @@
+import React, { ReactNode } from 'react';
+import { Box, Button, ButtonProps, Heading } from '@wix/design-system';
+
+export interface CustomDrawerLayoutProps {
+  dataHook?: string;
+  title?: ReactNode;
+  children?: ReactNode;
+  primaryButtonText?: ReactNode;
+  secondaryButtonText?: ReactNode;
+  secondaryButtonProps?: Partial<Omit<ButtonProps, 'as'>>;
+  primaryButtonProps?: Partial<Omit<ButtonProps, 'as'>>;
+  primaryButtonOnClick?: () => void;
+  secondaryButtonOnClick?: () => void;
+}
+
+export function CustomDrawerLayout(props: CustomDrawerLayoutProps) {
+  const {
+    dataHook,
+    title,
+    children,
+    primaryButtonText,
+    secondaryButtonText,
+    secondaryButtonProps,
+    primaryButtonProps,
+    primaryButtonOnClick,
+    secondaryButtonOnClick,
+  } = props;
+
+  return (
+    <Box
+      dataHook={dataHook}
+      direction="vertical"
+      padding="SP3"
+      backgroundColor="white"
+      borderRadius="12px"
+    >
+      {title && (
+        <Box
+          direction="vertical"
+          paddingTop="SP1"
+          paddingBottom="SP1"
+          marginBottom="SP4"
+          align="center"
+        >
+          <Heading size="small" textAlign="center">
+            {title}
+          </Heading>
+        </Box>
+      )}
+
+      <Box flex={1} marginBottom="SP4">
+        {children}
+      </Box>
+
+      <Box direction="vertical" gap="SP4">
+        {primaryButtonText && (
+          <Button
+            dataHook="baseModalLayout-primary-button"
+            fullWidth
+            priority="primary"
+            onClick={primaryButtonOnClick}
+            {...(primaryButtonProps as ButtonProps)}
+          >
+            {primaryButtonText}
+          </Button>
+        )}
+
+        {secondaryButtonText && (
+          <Button
+            dataHook="baseModalLayout-secondary-button"
+            fullWidth
+            onClick={secondaryButtonOnClick}
+            priority="secondary"
+            {...(secondaryButtonProps as ButtonProps)}
+          >
+            {secondaryButtonText}
+          </Button>
+        )}
+      </Box>
+    </Box>
+  );
+}

package/src/components/CustomFieldsWidget/CustomFieldsWidgetCommonComponents.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { observer } from 'mobx-react-lite';
 import { usePageContext } from '@wix/bex-core/react';
 import { CustomFieldsWidgetState } from '../../state';
+import { DeleteFieldModal } from '../ArchivedItemsPanel/DeleteFieldModal';
 
 interface CustomFieldsWidgetCommonComponentsProps {
   state: CustomFieldsWidgetState;
@@ -36,6 +37,9 @@ const _CustomFieldsWidgetCommonComponents = ({
       {ArchiveFieldModal && (
         <ArchiveFieldModal state={state.customFieldsPanel.archiveFieldModal} />
       )}
+      {state.dataExtension.deleteFieldModal && (
+        <DeleteFieldModal state={state.dataExtension.deleteFieldModal} />
+      )}
     </>
   );
 };

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "DragHandle4004062389";
+var _namespace_ = "DragHandle2097138654";
 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":"DragHandle4004062389__root"};
+export var classes = {"root":"DragHandle2097138654__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_ = "EntityPagePlain487832312";
+var _namespace_ = "EntityPagePlain3381948879";
 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":"EntityPagePlain487832312__root"};
+export var classes = {"root":"EntityPagePlain3381948879__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/ExportButton/ExportButton.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { FiltersMap, ModalState } from '@wix/bex-core';
-import { Box, Button, Modal } from '@wix/design-system';
+import { Box, Button, Drawer, Modal } from '@wix/design-system';
 import { UploadExport } from '@wix/wix-ui-icons-common';
 import { observer, Observer } from 'mobx-react-lite';
 import { ExportButtonModalLayout } from './ExportButtonModalLayout';
@@ -8,6 +8,7 @@ import { useWixPatternsContainer } from '@wix/bex-core/react';
 import { useToolbarCollectionContext } from '../ToolbarCollectionContext';
 import { ExportButtonProps } from './ExportProps';
 import { ResponsiveButton } from '../ResponsiveButton/ResponsiveButton';
+import { useIsMobile } from '../../hooks/useIsMobile';
 
 function _ExportButton<T, F extends FiltersMap>(
   props: ExportButtonProps<T, F>,
@@ -39,15 +40,13 @@ function _ExportButton<T, F extends FiltersMap>(
 
   const [state] = useState(() => (table.exportState ??= new ModalState()));
 
+  const isMobile = useIsMobile();
+
   useEffect(() => {
     table.featuredComponents.exportModal.set(
       <Observer>
-        {() => (
-          <Modal
-            onRequestClose={state.requestClose}
-            isOpen={state.isOpen}
-            dataHook="export-modal"
-          >
+        {() => {
+          const child = (
             <ExportButtonModalLayout
               exportModalState={state}
               renderError={renderError}
@@ -66,8 +65,30 @@ function _ExportButton<T, F extends FiltersMap>(
               onProgressModalTitle={onProgressModalTitle}
               exportToCSVMessage={exportToCSVMessage}
             />
-          </Modal>
-        )}
+          );
+
+          if (isMobile) {
+            return (
+              <Drawer
+                dataHook="export-modal"
+                open={state.isOpen}
+                onClose={state.requestClose}
+              >
+                {child}
+              </Drawer>
+            );
+          }
+
+          return (
+            <Modal
+              onRequestClose={state.requestClose}
+              isOpen={state.isOpen}
+              dataHook="export-modal"
+            >
+              {child}
+            </Modal>
+          );
+        }}
       </Observer>,
     );
 

package/src/components/ExportButton/ExportButtonModalLayout.tsx

@@ -10,6 +10,8 @@ import {
   ArrayFieldDelimiter,
 } from '@wix/bex-utils/@wix/ambassador-fedinfra-exportservice-v1-export-async-job/types';
 import { addEventListener } from '@wix/bex-core/util';
+import { useIsMobile } from '../../hooks/useIsMobile';
+import { CustomDrawerLayout } from '../CustomDrawerLayout';
 
 function _ExportButtonModalLayout<T, F extends FiltersMap>(
   props: ExportButtonModalLayoutProps<T, F>,
@@ -34,6 +36,8 @@ function _ExportButtonModalLayout<T, F extends FiltersMap>(
 
   const table = useToolbarCollectionContext<T, F>();
 
+  const isMobile = useIsMobile();
+
   const createExport = useCreateExport<T, F>({
     transformPlatformizedQuery,
     differentQueryEndpointThanCollection,
@@ -85,6 +89,16 @@ function _ExportButtonModalLayout<T, F extends FiltersMap>(
 
   useEffect(() => state.init(), []);
 
+  if (isMobile) {
+    return (
+      <CustomDrawerLayout
+        dataHook="export-modal-layout"
+        {...rest}
+        {...customModalLayoutProps}
+      />
+    );
+  }
+
   return (
     <CustomModalLayout
       width="510px"

package/src/components/ExportButton/ExportModal.tsx

@@ -1,10 +1,11 @@
-import { Modal } from '@wix/design-system';
+import { Drawer, Modal } from '@wix/design-system';
 import React, { useState } from 'react';
 import { useToolbarCollectionContext } from '../ToolbarCollectionContext';
 import { FiltersMap, ModalState } from '@wix/bex-core';
 import { ExportButtonModalLayout } from './ExportButtonModalLayout';
 import { observer } from 'mobx-react-lite';
 import { ExportModalProps } from './ExportProps';
+import { useIsMobile } from '../../hooks/useIsMobile';
 
 function _ExportModal<T, F extends FiltersMap>(props: ExportModalProps<T, F>) {
   const table = useToolbarCollectionContext<T, F>();
@@ -13,13 +14,31 @@ function _ExportModal<T, F extends FiltersMap>(props: ExportModalProps<T, F>) {
     () => (table.exportState ??= new ModalState()),
   );
 
+  const isMobile = useIsMobile();
+
+  const child = (
+    <ExportButtonModalLayout {...props} exportModalState={exportModalState} />
+  );
+
+  if (isMobile) {
+    return (
+      <Drawer
+        dataHook="export-modal"
+        open={exportModalState.isOpen}
+        onClose={exportModalState.close}
+      >
+        {child}
+      </Drawer>
+    );
+  }
+
   return (
     <Modal
       onRequestClose={exportModalState.close}
       isOpen={exportModalState.isOpen}
       dataHook="export-modal"
     >
-      <ExportButtonModalLayout {...props} exportModalState={exportModalState} />
+      {child}
     </Modal>
   );
 }

package/src/components/ExportButton/ExportModal.uni.driver.ts

@@ -10,11 +10,12 @@ import {
 
 export function ExportModalUniDriver(base: UniDriver, body: UniDriver) {
   const modalBase = () => body.$('.portal-export-modal');
+  const modalLayoutBase = () => body.$('[data-hook="export-modal-layout"]');
   const footerBase = () =>
-    modalBase().$('[data-hook="export-modal-footer-text"]');
+    modalLayoutBase().$('[data-hook="export-modal-footer-text"]');
 
   const linearProgressBarBase = () =>
-    modalBase().$('[data-hook="export-linear-progress-bar"]');
+    modalLayoutBase().$('[data-hook="export-linear-progress-bar"]');
 
   const getAbsoluteCounter = () =>
     TextUniDriver(
@@ -29,15 +30,15 @@ export function ExportModalUniDriver(base: UniDriver, body: UniDriver) {
     );
 
   const getExportRadioGroup = () =>
-    RadioGroupUniDriver(modalBase().$('[data-hook="export-group"]'), body);
+    RadioGroupUniDriver(
+      modalLayoutBase().$('[data-hook="export-group"]'),
+      body,
+    );
 
   const getModal = () => ModalUniDriver(modalBase(), modalBase());
 
   const getModalLayout = () =>
-    CustomModalLayoutUniDriver(
-      modalBase().$('[data-hook="export-modal-layout"]'),
-      body,
-    );
+    CustomModalLayoutUniDriver(modalLayoutBase(), body);
 
   const getFooterText = async () =>
     (await TextUniDriver(footerBase(), body)).getText();
@@ -47,7 +48,7 @@ export function ExportModalUniDriver(base: UniDriver, body: UniDriver) {
   const getCsvMessageText = async () =>
     (
       await TextUniDriver(
-        modalBase().$('[data-hook="export-csv-message"]'),
+        modalLayoutBase().$('[data-hook="export-csv-message"]'),
         body,
       ).getText()
     ).replace(' ', ' ');
@@ -88,10 +89,10 @@ export function ExportModalUniDriver(base: UniDriver, body: UniDriver) {
     Tests are failing with this Hex valus, so it is replaced here */
     getErrorMessageText: async () =>
       (
-        await modalBase().$('[data-hook="export-error-message"]').text()
+        await modalLayoutBase().$('[data-hook="export-error-message"]').text()
       ).replace('\u00A0', ' '),
     getErrorMessageAction: async () =>
-      modalBase().$('[data-hook="export-error-message-action"]'),
+      modalLayoutBase().$('[data-hook="export-error-message-action"]'),
     /** Get export modal footer text*/
     getFooterText,
     /** Indicates whether footer exists in the export modal */

package/src/components/ExportButton/ExportStepProgress.tsx

@@ -33,7 +33,7 @@ function _ExportStepProgress<T, F extends FiltersMap>({
   }, []);
 
   return (
-    <Box gap="SP1" direction="vertical" paddingTop="SP1">
+    <Box gap="SP1" direction="vertical" width="100%">
       <LinearAbsoluteProgressBar
         value={counter}
         count={absoluteCounter}

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

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

package/src/components/FiltersPanel/FiltersPanelAppliedFiltersSection.tsx

@@ -50,6 +50,7 @@ function _FiltersPanelAppliedFiltersSection<T, F extends FiltersMap>(
                 });
             });
             onClearButtonClicked?.();
+            state.sidePanel.focus.modalElement?.focus();
           }}
           disabled={!nonPersistentCustomFiltersCount}
         >

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "Heading1047250066";
+var _namespace_ = "Heading2772262609";
 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":"Heading1047250066__root"};
+export var classes = {"root":"Heading2772262609__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_ = "InputOverflow4035773023";
+var _namespace_ = "InputOverflow2848822892";
 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":"InputOverflow4035773023__root"};
+export var classes = {"root":"InputOverflow2848822892__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_ = "LoadingRow375204560";
+var _namespace_ = "LoadingRow3912306227";
 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":"LoadingRow375204560__root"};
-export var keyframes = {"gradientSwoosh":"LoadingRow375204560__gradientSwoosh"}; 
+export var classes = {"root":"LoadingRow3912306227__root"};
+export var keyframes = {"gradientSwoosh":"LoadingRow3912306227__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_ = "MaxHeightText3590077997";
+var _namespace_ = "MaxHeightText3608932933";
 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":"MaxHeightText3590077997__root"};
+export var classes = {"root":"MaxHeightText3608932933__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_ = "MaxLines977625515";
+var _namespace_ = "MaxLines2519136276";
 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":"MaxLines977625515__root"};
+export var classes = {"root":"MaxLines2519136276__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_ = "MultiBulkActionToolbar3384938799";
+var _namespace_ = "MultiBulkActionToolbar2871372921";
 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":"MultiBulkActionToolbar3384938799__root","leftGroupWrapper":"MultiBulkActionToolbar3384938799__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar3384938799__selectedCountItem","selectedCountText":"MultiBulkActionToolbar3384938799__selectedCountText"};
+export var classes = {"root":"MultiBulkActionToolbar2871372921__root","leftGroupWrapper":"MultiBulkActionToolbar2871372921__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar2871372921__selectedCountItem","selectedCountText":"MultiBulkActionToolbar2871372921__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_ = "NestedTablePlaceholderStatesRow4269702703";
+var _namespace_ = "NestedTablePlaceholderStatesRow1158360690";
 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":"NestedTablePlaceholderStatesRow4269702703__root"};
+export var classes = {"root":"NestedTablePlaceholderStatesRow1158360690__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_ = "NestedTableRow2773824342";
+var _namespace_ = "NestedTableRow1108205947";
 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":"NestedTableRow2773824342__root","firstLevel":"NestedTableRow2773824342__firstLevel","placeholder":"NestedTableRow2773824342__placeholder","parentHovered":"NestedTableRow2773824342__parentHovered"};
+export var classes = {"root":"NestedTableRow1108205947__root","firstLevel":"NestedTableRow1108205947__firstLevel","placeholder":"NestedTableRow1108205947__placeholder","parentHovered":"NestedTableRow1108205947__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_ = "MultipleDragOverlayEffect3250565435";
+var _namespace_ = "MultipleDragOverlayEffect435668955";
 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":"MultipleDragOverlayEffect3250565435__root"};
+export var classes = {"root":"MultipleDragOverlayEffect435668955__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_ = "NestedTableDragAndDropRow3732860894";
+var _namespace_ = "NestedTableDragAndDropRow64711421";
 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":"NestedTableDragAndDropRow3732860894__root"};
+export var classes = {"root":"NestedTableDragAndDropRow64711421__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

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