@wix/patterns 1.494.0 → 1.496.0

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "EditableCell222919926";
+var _namespace_ = "EditableCell3613531573";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,12 +13,12 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"EditableCell222919926__root","textInputArea":"Edit19302658__inputArea","selectorRow":"EditableCell222919926__selectorRow","errorMessage":"EditableCell222919926__errorMessage"};
+export var classes = {"root":"EditableCell3613531573__root","textInputArea":"Edit2648970855__inputArea","selectorRow":"EditableCell3613531573__selectorRow","errorPopover":"EditableCell3613531573__errorPopover","errorMessage":"EditableCell3613531573__errorMessage"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 
-export var vars = {"wds-outline-focus-outer":"--wds-outline-focus-outer","wds-outline-focus-inner":"--wds-outline-focus-inner","wds-color-fill-surface-raised":"--wds-color-fill-surface-raised","wds-color-border-dark-secondary":"--wds-color-border-dark-secondary","wds-color-black-750":"--wds-color-black-750","wds-color-red-100":"--wds-color-red-100","wds-color-fill-surface-overlay":"--wds-color-fill-surface-overlay","wds-input-border-color-hover":"--wds-input-border-color-hover","wds-input-border-color-focus":"--wds-input-border-color-focus","wds-border-width-default":"--wds-border-width-default","wds-border-radius-400":"--wds-border-radius-400","wds-popover-fill":"--wds-popover-fill","wds-popover-border-radius":"--wds-popover-border-radius","wds-shadow-surface-overlay":"--wds-shadow-surface-overlay","wsr-color-B10":"--wsr-color-B10","wsr-color-B40":"--wsr-color-B40","wsr-color-D60":"--wsr-color-D60","wsr-color-D80":"--wsr-color-D80","wsr-color-R10":"--wsr-color-R10","wds-color-text-standard-primary":"--wds-color-text-standard-primary","wds-color-text-placeholder":"--wds-color-text-placeholder","wds-color-text-disabled":"--wds-color-text-disabled","wds-color-black-700":"--wds-color-black-700","wsr-color-D10-30":"--wsr-color-D10-30","wsr-color-D70":"--wsr-color-D70","wds-input-value-font-size-small":"--wds-input-value-font-size-small","wds-input-value-font-line-height-small":"--wds-input-value-font-line-height-small","wds-font-size-body-small":"--wds-font-size-body-small","wds-font-line-height-body-small":"--wds-font-line-height-body-small","wsr-text-font-size-small":"--wsr-text-font-size-small","wsr-text-line-height-small":"--wsr-text-line-height-small","wds-input-padding-horizontal-small":"--wds-input-padding-horizontal-small","wds-table-action-cell-backdrop-opacity":"--wds-table-action-cell-backdrop-opacity"}; 
+export var vars = {"wds-outline-focus-outer":"--wds-outline-focus-outer","wds-outline-focus-inner":"--wds-outline-focus-inner","wds-color-fill-surface-raised":"--wds-color-fill-surface-raised","wds-color-border-dark-secondary":"--wds-color-border-dark-secondary","wds-color-black-750":"--wds-color-black-750","wds-color-red-100":"--wds-color-red-100","wds-input-border-color-hover":"--wds-input-border-color-hover","wds-input-border-color-focus":"--wds-input-border-color-focus","wds-border-width-default":"--wds-border-width-default","wsr-color-B10":"--wsr-color-B10","wsr-color-B40":"--wsr-color-B40","wsr-color-D60":"--wsr-color-D60","wsr-color-D80":"--wsr-color-D80","wsr-color-R10":"--wsr-color-R10","wds-color-text-standard-primary":"--wds-color-text-standard-primary","wds-color-text-placeholder":"--wds-color-text-placeholder","wds-color-text-disabled":"--wds-color-text-disabled","wds-color-black-700":"--wds-color-black-700","wsr-color-D10-30":"--wsr-color-D10-30","wsr-color-D70":"--wsr-color-D70","wds-input-value-font-size-small":"--wds-input-value-font-size-small","wds-input-value-font-line-height-small":"--wds-input-value-font-line-height-small","wds-font-size-body-small":"--wds-font-size-body-small","wds-font-line-height-body-small":"--wds-font-line-height-body-small","wsr-text-font-size-small":"--wsr-text-font-size-small","wsr-text-line-height-small":"--wsr-text-line-height-small","wds-input-padding-horizontal-small":"--wds-input-padding-horizontal-small","wds-table-action-cell-backdrop-opacity":"--wds-table-action-cell-backdrop-opacity"}; 
 
 
 

package/src/components/EditableTable/EditableCell.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect, useRef } from 'react';
 import { observer } from 'mobx-react-lite';
 import type { FiltersMap } from '@wix/bex-core';
-import { Text } from '@wix/design-system';
+import { Popover, Text } from '@wix/design-system';
 import { st, classes } from './EditableCell.st.css.js';
 import type { EditableTableState } from '../../state/EditableTable';
 import { useBmHarmonyTheme } from '../../hooks/useBmHarmonyTheme';
@@ -189,6 +189,8 @@ function _EditableCell<T, F extends FiltersMap>({
       columnId={columnId}
       rowKey={rowKey}
       isEditable={canEdit}
+      // Keep the focused view from expanding over other cells in a range selection.
+      isFocused={isFocused && !isRangeSelection}
     />
   );
 
@@ -245,16 +247,30 @@ function _EditableCell<T, F extends FiltersMap>({
         )}
       </div>
       {showErrorMessage && (
-        <div
-          className={classes.errorMessage}
-          data-hook="cell-error-message"
-          data-row-key={rowKey}
-          data-column-id={columnId}
+        <Popover
+          className={classes.errorPopover}
+          shown
+          skin="light"
+          placement="bottom-start"
+          showArrow={false}
+          appendTo="window"
         >
-          <Text size="small" skin="error">
-            {cellValidation.errors?.join(', ')}
-          </Text>
-        </div>
+          <Popover.Element>
+            <span aria-hidden />
+          </Popover.Element>
+          <Popover.Content>
+            <div
+              className={classes.errorMessage}
+              data-hook="cell-error-message"
+              data-row-key={rowKey}
+              data-column-id={columnId}
+            >
+              <Text size="small" skin="error">
+                {cellValidation.errors?.join(', ')}
+              </Text>
+            </div>
+          </Popover.Content>
+        </Popover>
       )}
     </>
   );

package/src/components/EditableTable/EditableCell.uni.driver.ts

@@ -61,8 +61,8 @@ export function EditableCellUniDriver(base: UniDriver, body: UniDriver) {
     /** Get the column id from data attribute */
     getColumnId: () => base.attr('data-column-id'),
 
-    /** Error message shown under the cell while it's focused/editing (null when hidden).
-     *  It renders next to the cell, not inside it, so it's queried from the body. */
+    /** Error message shown while the cell is focused/editing (null when hidden).
+     *  It renders in a portal, so it is queried from the body. */
     getErrorMessage: async () => {
       const rowKey = await base.attr('data-row-key');
       const columnId = await base.attr('data-column-id');

package/src/components/EditableTable/EditableTableContextMenu.tsx

@@ -14,6 +14,7 @@ import {
   DuplicateSmall,
 } from '@wix/wix-ui-icons-common/lazy';
 import type { EditableTableState, Cell } from '../../state/EditableTable';
+import { useBmHarmonyTheme } from '../../hooks/useBmHarmonyTheme';
 import { startEditingNewRow } from './useAddRow';
 
 type ListItemActionBuilderParams = Omit<
@@ -90,6 +91,7 @@ function _EditableTableContextMenu<T, F extends FiltersMap>({
   onClose,
 }: EditableTableContextMenuProps<T, F>) {
   const { translate: t } = useWixPatternsContainer();
+  const isBmHarmonyTheme = useBmHarmonyTheme();
   const {
     cellInteraction,
     clipboard,
@@ -404,10 +406,13 @@ function _EditableTableContextMenu<T, F extends FiltersMap>({
         top: y,
         zIndex: CONTEXT_MENU_Z_INDEX,
         width: MENU_WIDTH,
+        boxSizing: isBmHarmonyTheme ? 'border-box' : undefined,
         background: SURFACE_BACKGROUND,
         borderRadius: SURFACE_BORDER_RADIUS,
         boxShadow: SURFACE_BOX_SHADOW,
-        padding: `var(--wds-space-200, ${SURFACE_PADDING_Y}px) 0`,
+        padding: isBmHarmonyTheme
+          ? `var(--wds-space-200, ${SURFACE_PADDING_Y}px)`
+          : `var(--wds-space-200, ${SURFACE_PADDING_Y}px) 0`,
         overflow: 'hidden',
       }}
       onMouseDown={(e) => e.preventDefault()}

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

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

package/src/components/EditableTable/HeaderFieldActions.tsx

@@ -80,11 +80,10 @@ function _HeaderFieldActions<T, F extends FiltersMap>({
       state.sort(id, { forceDirection: 'desc' });
   }
 
-  if (
-    toolbarFiltersState &&
-    state.collection.query.customFilters[column.id] != null
-  ) {
-    handlers.filter = () => toolbarFiltersState.openFromColumnHeader();
+  const columnFilter = state.collection.query.customFilters[column.id];
+  if (toolbarFiltersState && columnFilter != null) {
+    handlers.filter = (_id, event) =>
+      toolbarFiltersState.openFromColumnHeader(columnFilter.name, event);
   }
 
   const groups = buildFieldActionGroups({

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

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

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js"
 
 
 
-var _namespace_ = "JsonInputEdit3904331697";
+var _namespace_ = "JsonInputEdit1717190880";
 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":"JsonInputEdit3904331697__root","jsonInput":"JsonInputEdit3904331697__jsonInput"};
+export var classes = {"root":"JsonInputEdit1717190880__root","jsonInput":"JsonInputEdit1717190880__jsonInput"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit4010411396";
+var _namespace_ = "Edit82479914";
 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":"Edit4010411396__root","addressInput":"Edit4010411396__addressInput"};
+export var classes = {"root":"Edit82479914__root","addressInput":"Edit82479914__addressInput"};
 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_ = "Edit3166583434";
+var _namespace_ = "Edit832820748";
 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":"Edit3166583434__root","booleanEdit":"Edit3166583434__booleanEdit"};
+export var classes = {"root":"Edit832820748__root","booleanEdit":"Edit832820748__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_ = "View1657982704";
+var _namespace_ = "View329175887";
 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":"View1657982704__root","booleanView":"View1657982704__booleanView"};
+export var classes = {"root":"View329175887__root","booleanView":"View329175887__booleanView"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit3427717467";
+var _namespace_ = "Edit1493720931";
 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":"Edit3427717467__root"};
+export var classes = {"root":"Edit1493720931__root"};
 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_ = "Edit514332001";
+var _namespace_ = "Edit1691346528";
 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":"Edit514332001__root","dateInput":"Edit514332001__dateInput"};
+export var classes = {"root":"Edit1691346528__root","dateInput":"Edit1691346528__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_ = "View1529146851";
+var _namespace_ = "View2155624156";
 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":"View1529146851__root"};
+export var classes = {"root":"View2155624156__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit770565810";
+var _namespace_ = "Edit593812387";
 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":"Edit770565810__root","half":"Edit770565810__half","dateHalf":"Edit770565810__dateHalf Edit770565810__half","timeHalf":"Edit770565810__timeHalf Edit770565810__half","divider":"Edit770565810__divider","passiveText":"Edit770565810__passiveText","placeholderText":"Edit770565810__placeholderText Edit770565810__passiveText"};
+export var classes = {"root":"Edit593812387__root","half":"Edit593812387__half","dateHalf":"Edit593812387__dateHalf Edit593812387__half","timeHalf":"Edit593812387__timeHalf Edit593812387__half","divider":"Edit593812387__divider","passiveText":"Edit593812387__passiveText","placeholderText":"Edit593812387__placeholderText Edit593812387__passiveText"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "View2164594497";
+var _namespace_ = "View3414503761";
 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":"View2164594497__root","leaf":"View2164594497__leaf","datePart":"View2164594497__datePart View2164594497__leaf","timePart":"View2164594497__timePart View2164594497__leaf","placeholder":"View2164594497__placeholder View2164594497__leaf","divider":"View2164594497__divider"};
+export var classes = {"root":"View3414503761__root","leaf":"View3414503761__leaf","datePart":"View3414503761__datePart View3414503761__leaf","timePart":"View3414503761__timePart View3414503761__leaf","placeholder":"View3414503761__placeholder View3414503761__leaf","divider":"View3414503761__divider"};
 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_ = "Edit2379122669";
+var _namespace_ = "Edit1380986158";
 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":"Edit2379122669__root","emailInput":"Edit2379122669__emailInput"};
+export var classes = {"root":"Edit1380986158__root","emailInput":"Edit1380986158__emailInput"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

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

package/src/components/EditableTable/cellTypes/multiReference/View.tsx

@@ -9,7 +9,7 @@ import type { MultiReferenceValue, ReferenceTypeConfig } from './types';
 
 export const MultiReferenceView: React.FC<
   CellViewProps<MultiReferenceValue>
-> = ({ value, typeConfig, columnId, rowKey, isEditable }) => {
+> = ({ value, typeConfig, columnId, rowKey, isEditable, isFocused }) => {
   const { t } = useTranslations();
   const config = typeConfig as ReferenceTypeConfig | undefined;
   const refs = (Array.isArray(value) ? value : []).filter(Boolean);
@@ -35,6 +35,7 @@ export const MultiReferenceView: React.FC<
   return (
     <CellMultiReferenceView
       items={items}
+      expanded={isEditable === false && isFocused}
       dataHook="multi-reference-view"
       fieldId={`multi-reference-view-${columnId}-${rowKey}`}
     />

package/src/components/EditableTable/cellTypes/multiReference/index.ts

@@ -30,6 +30,7 @@ export const multiReferenceCellType = defineCellType<MultiReferenceValue>({
     return parsed;
   },
   editable: true,
+  growable: true,
   // Single click opens the chip editor (parity with the UX handoff).
   editOnClick: () => true,
   // Enter edit on a printable key without clearing the existing chips — the

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit3007089961";
+var _namespace_ = "Edit4137898944";
 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":"Edit3007089961__root","numberInput":"Edit3007089961__numberInput"};
+export var classes = {"root":"Edit4137898944__root","numberInput":"Edit4137898944__numberInput"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "View1871936684";
+var _namespace_ = "View1050885943";
 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":"View1871936684__root","textView":"View1871936684__textView"};
+export var classes = {"root":"View1050885943__root","textView":"View1050885943__textView"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

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

package/src/components/EditableTable/cellTypes/reference/EmptyReferenceView.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "EmptyReferenceView3244837461";
+var _namespace_ = "EmptyReferenceView1590175613";
 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":"EmptyReferenceView3244837461__root","placeholder":"EmptyReferenceView3244837461__placeholder","placeholderIcon":"EmptyReferenceView3244837461__placeholderIcon","placeholderText":"EmptyReferenceView3244837461__placeholderText","arrow":"EmptyReferenceView3244837461__arrow"};
+export var classes = {"root":"EmptyReferenceView1590175613__root","placeholder":"EmptyReferenceView1590175613__placeholder","placeholderIcon":"EmptyReferenceView1590175613__placeholderIcon","placeholderText":"EmptyReferenceView1590175613__placeholderText","arrow":"EmptyReferenceView1590175613__arrow"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit1135665701";
+var _namespace_ = "Edit3100283366";
 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":"Edit1135665701__root","selectInput":"Edit1135665701__selectInput"};
+export var classes = {"root":"Edit3100283366__root","selectInput":"Edit3100283366__selectInput"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit19302658";
+var _namespace_ = "Edit2648970855";
 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":"Edit19302658__root","editWrapper":"Edit19302658__editWrapper","inputArea":"Edit19302658__inputArea"};
+export var classes = {"root":"Edit2648970855__root","editWrapper":"Edit2648970855__editWrapper","inputArea":"Edit2648970855__inputArea"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

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

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit288431653";
+var _namespace_ = "Edit2431693639";
 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":"Edit288431653__root","wrapper":"Edit288431653__wrapper","overlay":"Edit288431653__overlay"};
+export var classes = {"root":"Edit2431693639__root","wrapper":"Edit2431693639__wrapper","overlay":"Edit2431693639__overlay"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit3350619743";
+var _namespace_ = "Edit2091273722";
 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":"Edit3350619743__root","urlInput":"Edit3350619743__urlInput"};
+export var classes = {"root":"Edit2091273722__root","urlInput":"Edit2091273722__urlInput"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "View583628029";
+var _namespace_ = "View799396297";
 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":"View583628029__root","textView":"View583628029__textView","urlText":"View583628029__urlText","suffix":"View583628029__suffix"};
+export var classes = {"root":"View799396297__root","textView":"View799396297__textView","urlText":"View799396297__urlText","suffix":"View799396297__suffix"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EmptyState/EmptyStateBase.st.css.ts

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