@wix/patterns 1.398.0 → 1.399.0

package/dist/types/components/ToolbarItem/ToolbarItem.st.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarItem.st.css.d.ts","sourceRoot":"","sources":["../../../../src/components/ToolbarItem/ToolbarItem.st.css.ts"],"names":[],"mappings":"AAUA,eAAO,IAAI,SAAS,+BAAwC,CAAC;AAC7D,eAAO,IAAI,KAAK,cAAU,CAAC;AAC3B,eAAO,IAAI,EAAE,EAAE,OAAO,mBAAmB,EAAE,UAAoB,CAAC;AAEhE,eAAO,IAAI,SAAS,QAAc,CAAC;AACnC,eAAO,IAAI,OAAO;;CAAwC,CAAC;AAC3D,eAAO,IAAI,SAAS,IAAK,CAAC;AAC1B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,UAAU,IAAK,CAAC;AAC3B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,IAAI,IAAK,CAAC"}
+{"version":3,"file":"ToolbarItem.st.css.d.ts","sourceRoot":"","sources":["../../../../src/components/ToolbarItem/ToolbarItem.st.css.ts"],"names":[],"mappings":"AAUA,eAAO,IAAI,SAAS,+BAAwC,CAAC;AAC7D,eAAO,IAAI,KAAK,cAAU,CAAC;AAC3B,eAAO,IAAI,EAAE,EAAE,OAAO,mBAAmB,EAAE,UAAoB,CAAC;AAEhE,eAAO,IAAI,SAAS,QAAc,CAAC;AACnC,eAAO,IAAI,OAAO;;CAAyC,CAAC;AAC5D,eAAO,IAAI,SAAS,IAAK,CAAC;AAC1B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,UAAU,IAAK,CAAC;AAC3B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,IAAI,IAAK,CAAC"}

package/dist/types/components/common.st.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"common.st.css.d.ts","sourceRoot":"","sources":["../../../src/components/common.st.css.ts"],"names":[],"mappings":"AAUA,eAAO,IAAI,SAAS,+BAAwC,CAAC;AAC7D,eAAO,IAAI,KAAK,cAAU,CAAC;AAC3B,eAAO,IAAI,EAAE,EAAE,OAAO,mBAAmB,EAAE,UAAoB,CAAC;AAEhE,eAAO,IAAI,SAAS,QAAc,CAAC;AACnC,eAAO,IAAI,OAAO;;;;CAAoH,CAAC;AACvI,eAAO,IAAI,SAAS,IAAK,CAAC;AAC1B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,UAAU,IAAK,CAAC;AAC3B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,IAAI,IAAK,CAAC"}
+{"version":3,"file":"common.st.css.d.ts","sourceRoot":"","sources":["../../../src/components/common.st.css.ts"],"names":[],"mappings":"AAUA,eAAO,IAAI,SAAS,+BAAwC,CAAC;AAC7D,eAAO,IAAI,KAAK,cAAU,CAAC;AAC3B,eAAO,IAAI,EAAE,EAAE,OAAO,mBAAmB,EAAE,UAAoB,CAAC;AAEhE,eAAO,IAAI,SAAS,QAAc,CAAC;AACnC,eAAO,IAAI,OAAO;;;;CAA8G,CAAC;AACjI,eAAO,IAAI,SAAS,IAAK,CAAC;AAC1B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,UAAU,IAAK,CAAC;AAC3B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,IAAI,IAAK,CAAC"}

package/dist/types/state/CollectionPage/CollectionPageHeader.st.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CollectionPageHeader.st.css.d.ts","sourceRoot":"","sources":["../../../../src/state/CollectionPage/CollectionPageHeader.st.css.ts"],"names":[],"mappings":"AAUA,eAAO,IAAI,SAAS,+BAAwC,CAAC;AAC7D,eAAO,IAAI,KAAK,cAAU,CAAC;AAC3B,eAAO,IAAI,EAAE,EAAE,OAAO,mBAAmB,EAAE,UAAoB,CAAC;AAEhE,eAAO,IAAI,SAAS,QAAc,CAAC;AACnC,eAAO,IAAI,OAAO;;CAAiD,CAAC;AACpE,eAAO,IAAI,SAAS,IAAK,CAAC;AAC1B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,UAAU,IAAK,CAAC;AAC3B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,IAAI,IAAK,CAAC"}
+{"version":3,"file":"CollectionPageHeader.st.css.d.ts","sourceRoot":"","sources":["../../../../src/state/CollectionPage/CollectionPageHeader.st.css.ts"],"names":[],"mappings":"AAUA,eAAO,IAAI,SAAS,+BAAwC,CAAC;AAC7D,eAAO,IAAI,KAAK,cAAU,CAAC;AAC3B,eAAO,IAAI,EAAE,EAAE,OAAO,mBAAmB,EAAE,UAAoB,CAAC;AAEhE,eAAO,IAAI,SAAS,QAAc,CAAC;AACnC,eAAO,IAAI,OAAO;;CAAkD,CAAC;AACrE,eAAO,IAAI,SAAS,IAAK,CAAC;AAC1B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,UAAU,IAAK,CAAC;AAC3B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,IAAI,IAAK,CAAC"}

package/dist/types/state/FormPage/FormPageHeader.st.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormPageHeader.st.css.d.ts","sourceRoot":"","sources":["../../../../src/state/FormPage/FormPageHeader.st.css.ts"],"names":[],"mappings":"AAUA,eAAO,IAAI,SAAS,+BAAwC,CAAC;AAC7D,eAAO,IAAI,KAAK,cAAU,CAAC;AAC3B,eAAO,IAAI,EAAE,EAAE,OAAO,mBAAmB,EAAE,UAAoB,CAAC;AAEhE,eAAO,IAAI,SAAS,QAAc,CAAC;AACnC,eAAO,IAAI,OAAO;;CAA2C,CAAC;AAC9D,eAAO,IAAI,SAAS,IAAK,CAAC;AAC1B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,UAAU,IAAK,CAAC;AAC3B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,IAAI,IAAK,CAAC"}
+{"version":3,"file":"FormPageHeader.st.css.d.ts","sourceRoot":"","sources":["../../../../src/state/FormPage/FormPageHeader.st.css.ts"],"names":[],"mappings":"AAUA,eAAO,IAAI,SAAS,+BAAwC,CAAC;AAC7D,eAAO,IAAI,KAAK,cAAU,CAAC;AAC3B,eAAO,IAAI,EAAE,EAAE,OAAO,mBAAmB,EAAE,UAAoB,CAAC;AAEhE,eAAO,IAAI,SAAS,QAAc,CAAC;AACnC,eAAO,IAAI,OAAO;;CAA4C,CAAC;AAC/D,eAAO,IAAI,SAAS,IAAK,CAAC;AAC1B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,UAAU,IAAK,CAAC;AAC3B,eAAO,IAAI,MAAM,IAAK,CAAC;AACvB,eAAO,IAAI,IAAI,IAAK,CAAC"}

package/dist/types/version.d.ts

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/patterns",
-  "version": "1.398.0",
+  "version": "1.399.0",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
@@ -437,5 +437,5 @@
   "wallaby": {
     "autoDetect": true
   },
-  "falconPackageHash": "9714a3f10bd07748a6b17a03bd9bfecfa6893c800975d116b9cb404a"
+  "falconPackageHash": "0335279651501f63044b55b2acfc09132a8e9dd35043847a720a10e8"
 }

package/src/components/ActionCell/ActionCell.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import {
   TableActionCellMainAction as TableActionCellMainActionWds,
   TableActionCellPrimaryAction as TableActionCellPrimaryActionWds,
@@ -31,6 +32,18 @@ export type TableActionCellPrimaryAction = TableActionCellPrimaryActionWds & {
 
 export interface ActionCellProps
   extends Omit<TableActionCellProps, 'primaryAction' | 'secondaryActions'> {
+  /**
+   * Whether the secondary actions menu (3-dots) is disabled. When `true`, a disabled icon button replaces the menu.
+   * @external
+   */
+  secondaryMenuDisabled?: boolean;
+
+  /**
+   * Tooltip content shown on hover when the secondary actions menu is disabled.
+   * @external
+   */
+  secondaryMenuDisabledTooltip?: React.ReactNode;
+
   /**
    * Primary call to action for each item in a table. Controls the behavior and appearance of the primary action. <br>
    * Can be a single action object or an array of actions. When an array is provided, the first action becomes the primary action and the rest are added to secondary actions. <br>

package/src/components/ActionCell/DisabledActionCellMenu.tsx

@@ -0,0 +1,55 @@
+import React, { ReactElement } from 'react';
+import { Box, IconButton, IconButtonProps } from '@wix/design-system';
+import { More } from '@wix/wix-ui-icons-common';
+import { DisabledTooltip } from '../DisabledTooltip';
+
+export interface DisabledActionCellMenuProps {
+  dataHook?: string;
+  tooltipContent?: React.ReactNode;
+  size?: IconButtonProps['size'];
+  skin?: IconButtonProps['skin'];
+  icon?: ReactElement;
+  ariaLabel?: string;
+}
+
+export function DisabledActionCellMenu({
+  dataHook,
+  tooltipContent,
+  size = 'medium',
+  skin = 'standard',
+  icon = <More />,
+  ariaLabel,
+}: DisabledActionCellMenuProps) {
+  const buttonAriaLabel =
+    typeof tooltipContent === 'string'
+      ? tooltipContent
+      : ariaLabel;
+
+  const button = (
+    <IconButton
+      dataHook={dataHook}
+      disabled
+      priority="secondary"
+      size={size}
+      skin={skin}
+      ariaLabel={buttonAriaLabel}
+    >
+      {icon}
+    </IconButton>
+  );
+
+  return (
+    <Box verticalAlign="middle" align="center" width="100%">
+      {tooltipContent ? (
+        <DisabledTooltip
+          dataHook={dataHook ? `${dataHook}-tooltip` : undefined}
+          content={tooltipContent}
+        >
+          {button}
+        </DisabledTooltip>
+      ) : (
+        button
+      )}
+    </Box>
+  );
+}

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

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

package/src/components/CmsFieldManagement/CmsFieldForm.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CmsFieldForm620051302";
+var _namespace_ = "CmsFieldForm1657847466";
 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":"CmsFieldForm620051302__root","fullBleedDivider":"CmsFieldForm620051302__fullBleedDivider"};
+export var classes = {"root":"CmsFieldForm1657847466__root","fullBleedDivider":"CmsFieldForm1657847466__fullBleedDivider"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CmsFieldManagement/CmsFieldModal.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CmsFieldModal856061327";
+var _namespace_ = "CmsFieldModal1555536254";
 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":"CmsFieldModal856061327__root","modal":"CmsFieldModal856061327__modal"};
+export var classes = {"root":"CmsFieldModal1555536254__root","modal":"CmsFieldModal1555536254__modal"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CmsFieldManagement/Sections/ValidationAndDefaultsSection.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js"
 
 
 
-var _namespace_ = "ValidationAndDefaultsSection2469205065";
+var _namespace_ = "ValidationAndDefaultsSection1284280707";
 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":"ValidationAndDefaultsSection2469205065__root","accordionWrapper":"ValidationAndDefaultsSection2469205065__accordionWrapper"};
+export var classes = {"root":"ValidationAndDefaultsSection1284280707__root","accordionWrapper":"ValidationAndDefaultsSection1284280707__accordionWrapper"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CmsFieldManagement/formFields/CharactersLimitInput.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js"
 
 
 
-var _namespace_ = "CharactersLimitInput3249916756";
+var _namespace_ = "CharactersLimitInput3979604300";
 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":"CharactersLimitInput3249916756__root","field":"CharactersLimitInput3249916756__field"};
+export var classes = {"root":"CharactersLimitInput3979604300__root","field":"CharactersLimitInput3979604300__field"};
 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_ = "Collapse3305460696";
+var _namespace_ = "Collapse2058769786";
 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":"Collapse3305460696__root","exit":"Collapse3305460696__exit"};
+export var classes = {"root":"Collapse2058769786__root","exit":"Collapse2058769786__exit"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionItemActions/CollectionItemActions.tsx

@@ -5,6 +5,7 @@ import { observer } from 'mobx-react-lite';
 import { ItemActionsState } from '../../state';
 import { MessageActionModal } from '../ActionModal';
 import { ActionCellProps, TableActionCellMainAction } from '../ActionCell';
+import { DisabledActionCellMenu } from '../ActionCell/DisabledActionCellMenu';
 import { useToolbarCollectionContext } from '../ToolbarCollectionContext';
 import {
   createPrimaryActionCellPropsWithBI,
@@ -34,6 +35,11 @@ function _CollectionItemActions<T, F extends FiltersMap = FiltersMap>({
   const toolbarState = useToolbarCollectionContext();
   const { toolbarBIReporter } = toolbarState;
   const actionCellProps = renderActionCell?.(state) ?? {};
+  const {
+    secondaryMenuDisabled,
+    secondaryMenuDisabledTooltip,
+    ...tableActionCellProps
+  } = actionCellProps;
   const keyedItem = state.actionCellAPI.keyedItem;
 
   const existingExtension = actionCellProps.containerId
@@ -54,6 +60,20 @@ function _CollectionItemActions<T, F extends FiltersMap = FiltersMap>({
     }
   }, [extensionMenuItems, actionCellProps.containerId]);
 
+  if (secondaryMenuDisabled) {
+    return (
+      <DisabledActionCellMenu
+        dataHook="collection-action-cell-disabled"
+        tooltipContent={
+          secondaryMenuDisabledTooltip ??
+          toolbarState.container.translate('cairo.disabled')
+        }
+        size={actionCellProps.size ?? 'medium'}
+        ariaLabel={toolbarState.container.translate('cairo.moreActions')}
+      />
+    );
+  }
+
   const secondaryActionCellPropsWithBI = createSecondaryActionCellPropWithBi({
     toolbarBIReporter,
     actionCellProps,
@@ -96,7 +116,7 @@ function _CollectionItemActions<T, F extends FiltersMap = FiltersMap>({
       )}
       <TableActionCell
         dataHook="collection-action-cell"
-        {...actionCellProps}
+        {...tableActionCellProps}
         popoverMenuProps={{
           ...getDefaultActionCellProps(),
           onShow: () =>

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

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

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CollectionSectionHeader699658794";
+var _namespace_ = "CollectionSectionHeader2472631887";
 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":"CollectionSectionHeader699658794__root","summaryIcon":"CollectionSectionHeader699658794__summaryIcon"};
+export var classes = {"root":"CollectionSectionHeader2472631887__root","summaryIcon":"CollectionSectionHeader2472631887__summaryIcon"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

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

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

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

package/src/components/CollectionTable/CollectionTableWSRTable.tsx

@@ -44,7 +44,13 @@ export interface CollectionTableWSRTableBaseProps<U, T, F extends FiltersMap>
       | 'onDragCancel'
       | 'isDragAndDropDisabled'
       | 'hideBulkSelectionCheckbox'
+      | 'skin'
     > {
+  /**
+   * @deprecated The table skin is fixed to `"neutral"` and any value passed here is ignored. This prop will be removed in a future release.
+   */
+  skin?: TableProps<KeyedItem<U>>['skin'];
+
   useShowLoaderWhenEmpty?: boolean;
   useNewInfiniteScrollLoader?: boolean;
 
@@ -142,11 +148,8 @@ function _CollectionTableWSRTable<U, T, F extends FiltersMap = FiltersMap>(
     tableState: table,
     keyedItems: stateKeyedItems,
   } = state;
-  const { internalExperiments, isPanelLayout } = useWixPatternsContainer();
+  const { isPanelLayout } = useWixPatternsContainer();
 
-  const isGreyHeadersEnabled = internalExperiments?.enabled(
-    'specs.cairo.tableGreyHeaders',
-  );
   const { bulk, initTask } = toolbar;
 
   const keyedItems = props.keyedItems ?? stateKeyedItems;
@@ -228,7 +231,7 @@ function _CollectionTableWSRTable<U, T, F extends FiltersMap = FiltersMap>(
     >
       <Table
         {...props}
-        skin={isGreyHeadersEnabled ? 'neutral' : props.skin}
+        skin="neutral"
         withWrapper={false}
         data={keyedItemsWithTooltip}
         viewportRef={stackingRootRef}

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CollectionToolbar1939696381";
+var _namespace_ = "CollectionToolbar1283127643";
 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":"CollectionToolbar1939696381__root","left":"CollectionToolbar1939696381__left","right":"CollectionToolbar1939696381__right","fullWidth":"CollectionToolbar1939696381__fullWidth"};
+export var classes = {"root":"CollectionToolbar1283127643__root","left":"CollectionToolbar1283127643__left","right":"CollectionToolbar1283127643__right","fullWidth":"CollectionToolbar1283127643__fullWidth"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SearchOrCustomFilter1858433612";
+var _namespace_ = "SearchOrCustomFilter3320570748";
 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":"SearchOrCustomFilter1858433612__root","search":"SearchOrCustomFilter1858433612__search","searchMobile":"SearchOrCustomFilter1858433612__searchMobile"};
+export var classes = {"root":"SearchOrCustomFilter3320570748__root","search":"SearchOrCustomFilter3320570748__search","searchMobile":"SearchOrCustomFilter3320570748__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_ = "AutoCompleteReadonly2062627611";
+var _namespace_ = "AutoCompleteReadonly1410501715";
 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":"AutoCompleteReadonly2062627611__root"};
+export var classes = {"root":"AutoCompleteReadonly1410501715__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_ = "ViewsDropdown1133598523";
+var _namespace_ = "ViewsDropdown3487777479";
 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":"ViewsDropdown1133598523__root"};
+export var classes = {"root":"ViewsDropdown3487777479__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

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

package/src/components/EditableTable/EditableCell.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "EditableCell2410741874";
+var _namespace_ = "EditableCell1716212578";
 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":"EditableCell2410741874__root","validationIndicator":"EditableCell2410741874__validationIndicator"};
+export var classes = {"root":"EditableCell1716212578__root","validationIndicator":"EditableCell1716212578__validationIndicator"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/HeaderActionsPopover.st.css.ts

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

package/src/components/EditableTable/cellTypes/CellViewLayout.st.css.ts

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

package/src/components/EditableTable/cellTypes/boolean/Edit.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit2926467071";
+var _namespace_ = "Edit2120335743";
 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":"Edit2926467071__root","booleanEdit":"Edit2926467071__booleanEdit"};
+export var classes = {"root":"Edit2120335743__root","booleanEdit":"Edit2120335743__booleanEdit"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/cellTypes/boolean/View.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "View630518677";
+var _namespace_ = "View986678745";
 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":"View630518677__root","booleanView":"View630518677__booleanView"};
+export var classes = {"root":"View986678745__root","booleanView":"View986678745__booleanView"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/cellTypes/date/Edit.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit1344500611";
+var _namespace_ = "Edit3871826497";
 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":"Edit1344500611__root","dateInput":"Edit1344500611__dateInput"};
+export var classes = {"root":"Edit3871826497__root","dateInput":"Edit3871826497__dateInput"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/cellTypes/date/View.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "View2958462894";
+var _namespace_ = "View225825299";
 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":"View2958462894__root"};
+export var classes = {"root":"View225825299__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/cellTypes/email/Edit.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit3075222500";
+var _namespace_ = "Edit3156477067";
 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":"Edit3075222500__root","emailInput":"Edit3075222500__emailInput"};
+export var classes = {"root":"Edit3156477067__root","emailInput":"Edit3156477067__emailInput"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};