@wix/patterns 1.486.0 → 1.487.0

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit1520496786";
+var _namespace_ = "Edit3539902594";
 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":"Edit1520496786__root","half":"Edit1520496786__half","dateHalf":"Edit1520496786__dateHalf Edit1520496786__half","timeHalf":"Edit1520496786__timeHalf Edit1520496786__half","divider":"Edit1520496786__divider","passiveText":"Edit1520496786__passiveText","placeholderText":"Edit1520496786__placeholderText Edit1520496786__passiveText"};
+export var classes = {"root":"Edit3539902594__root","half":"Edit3539902594__half","dateHalf":"Edit3539902594__dateHalf Edit3539902594__half","timeHalf":"Edit3539902594__timeHalf Edit3539902594__half","divider":"Edit3539902594__divider","passiveText":"Edit3539902594__passiveText","placeholderText":"Edit3539902594__placeholderText Edit3539902594__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_ = "View491284730";
+var _namespace_ = "View3033189113";
 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":"View491284730__root","leaf":"View491284730__leaf","datePart":"View491284730__datePart View491284730__leaf","timePart":"View491284730__timePart View491284730__leaf","placeholder":"View491284730__placeholder View491284730__leaf","divider":"View491284730__divider"};
+export var classes = {"root":"View3033189113__root","leaf":"View3033189113__leaf","datePart":"View3033189113__datePart View3033189113__leaf","timePart":"View3033189113__timePart View3033189113__leaf","placeholder":"View3033189113__placeholder View3033189113__leaf","divider":"View3033189113__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_ = "Edit1594556913";
+var _namespace_ = "Edit1307167880";
 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":"Edit1594556913__root","emailInput":"Edit1594556913__emailInput"};
+export var classes = {"root":"Edit1307167880__root","emailInput":"Edit1307167880__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_ = "View1815002344";
+var _namespace_ = "View1838232162";
 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":"View1815002344__root"};
+export var classes = {"root":"View1838232162__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -1,17 +1,26 @@
 import React from 'react';
-import { CellMultiReferenceView } from '@wix/patterns-fields';
+import { AddSmall } from '@wix/wix-ui-icons-common/lazy';
+import { CellMultiReferenceView, useTranslations } from '@wix/patterns-fields';
 import type { CellMultiReferenceItem } from '@wix/patterns-fields';
 import type { CellViewProps } from '../../types';
 import { getImageFieldId } from '../reference/getImageFieldId';
+import { EmptyReferenceView } from '../reference/EmptyReferenceView';
 import type { MultiReferenceValue, ReferenceTypeConfig } from './types';
 
 export const MultiReferenceView: React.FC<
   CellViewProps<MultiReferenceValue>
-> = ({ value, typeConfig, columnId, rowKey }) => {
+> = ({ value, typeConfig, columnId, rowKey, isEditable }) => {
+  const { t } = useTranslations();
   const config = typeConfig as ReferenceTypeConfig | undefined;
   const refs = (Array.isArray(value) ? value : []).filter(Boolean);
   if (refs.length === 0 || !config?.refSchema) {
-    return null;
+    return (
+      <EmptyReferenceView
+        isEditable={isEditable}
+        placeholder={t('CMS.cellMultiReference.placeholder')}
+        placeholderIcon={<AddSmall />}
+      />
+    );
   }
 
   const { displayField, idField } = config.refSchema;

package/src/components/EditableTable/cellTypes/multiReference/View.uni.driver.ts

@@ -6,6 +6,7 @@ export function MultiReferenceViewUniDriver(base: UniDriver, _body: UniDriver) {
   const overflow = () => base.$('[data-hook="tag-list-overflow-chip"]');
   return {
     ...baseUniDriverFactory(base),
+    hasArrow: () => base.$('[data-hook="reference-cell-arrow"]').exists(),
     hasTags: async () => (await tags().count()) > 0,
     getTagsCount: () => tags().count(),
     isEmpty: async () =>

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit2483406661";
+var _namespace_ = "Edit3689162200";
 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":"Edit2483406661__root","numberInput":"Edit2483406661__numberInput"};
+export var classes = {"root":"Edit3689162200__root","numberInput":"Edit3689162200__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_ = "View70444436";
+var _namespace_ = "View25324732";
 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":"View70444436__root","textView":"View70444436__textView"};
+export var classes = {"root":"View25324732__root","textView":"View25324732__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_ = "View2510067821";
+var _namespace_ = "View3709872906";
 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":"View2510067821__root"};
+export var classes = {"root":"View3709872906__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -0,0 +1,51 @@
+@property st-global(--wds-dropdown-icon-fill);
+@property st-global(--wsr-color-B10);
+@property st-global(--wds-color-text-placeholder);
+@property st-global(--wsr-color-D40);
+
+:import {
+  -st-from: '../../EditableCell.st.css';
+  -st-default: EditableCell;
+}
+
+/* .placeholder and .arrow sit inside CellViewLayout, which sets `flex: 1` on
+   every child. */
+
+/* Hidden until the cell is focused. */
+.placeholder {
+  flex: 1 1 0;
+  min-width: 0;
+  display: none;
+  align-items: center;
+  gap: 4px;
+  margin-inline-end: 8px;
+  font-size: 14px;
+  line-height: 18px;
+  color: var(--wds-color-text-placeholder, var(--wsr-color-D40, #868aa5));
+}
+
+.placeholderIcon {
+  display: flex;
+  flex: none;
+}
+
+.placeholderText {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+@st-scope EditableCell:focused {
+  .placeholder {
+    display: flex;
+  }
+}
+
+.arrow {
+  flex: 0 0 auto;
+  margin-inline-start: auto;
+  display: flex;
+  align-items: center;
+  color: var(--wds-dropdown-icon-fill, var(--wsr-color-B10, #116dff));
+}

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

@@ -0,0 +1,25 @@
+// @ts-nocheck
+
+import "../../EditableCell.st.css.js";
+import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.js";
+
+
+
+var _namespace_ = "EmptyReferenceView3066339619";
+var _style_ = classesRuntime.bind(null, _namespace_);
+
+export var cssStates = statesRuntime.bind(null, _namespace_);
+export var style = _style_;
+export var st: import("@stylable/runtime").STFunction = _style_;
+
+export var namespace = _namespace_;
+export var classes = {"root":"EmptyReferenceView3066339619__root","placeholder":"EmptyReferenceView3066339619__placeholder","placeholderIcon":"EmptyReferenceView3066339619__placeholderIcon","placeholderText":"EmptyReferenceView3066339619__placeholderText","arrow":"EmptyReferenceView3066339619__arrow"};
+export var keyframes = {}; 
+export var layers = {};
+export var containers = {};
+export var stVars = {}; 
+export var vars = {"wds-dropdown-icon-fill":"--wds-dropdown-icon-fill","wsr-color-B10":"--wsr-color-B10","wds-color-text-placeholder":"--wds-color-text-placeholder","wsr-color-D40":"--wsr-color-D40"}; 
+
+
+
+

package/src/components/EditableTable/cellTypes/reference/EmptyReferenceView.tsx

@@ -0,0 +1,38 @@
+import React from 'react';
+import { DropDownArrow } from '@wix/wix-ui-icons-common/system';
+import { CellViewLayout } from '../CellViewLayout';
+import { classes } from './EmptyReferenceView.st.css.js';
+
+/** Empty reference / multi-reference cell. Editable cells show the dropdown
+ *  arrow so the cell reads as a picker before the user starts editing. */
+export const EmptyReferenceView: React.FC<{
+  isEditable?: boolean;
+  /** Shown while the cell is focused (see the stylesheet). */
+  placeholder?: string;
+  placeholderIcon?: React.ReactNode;
+}> = ({ isEditable, placeholder, placeholderIcon }) => (
+  <CellViewLayout>
+    {isEditable && placeholder && (
+      <span
+        className={classes.placeholder}
+        data-hook="reference-cell-placeholder"
+      >
+        {placeholderIcon && (
+          <span className={classes.placeholderIcon} aria-hidden>
+            {placeholderIcon}
+          </span>
+        )}
+        <span className={classes.placeholderText}>{placeholder}</span>
+      </span>
+    )}
+    {isEditable && (
+      <span
+        className={classes.arrow}
+        data-hook="reference-cell-arrow"
+        aria-hidden
+      >
+        <DropDownArrow />
+      </span>
+    )}
+  </CellViewLayout>
+);

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

@@ -1,19 +1,26 @@
 import React from 'react';
-import { CellReferenceView } from '@wix/patterns-fields';
+import { CellReferenceView, useTranslations } from '@wix/patterns-fields';
 import type { CellViewProps } from '../../types';
-import { CellViewLayout } from '../CellViewLayout';
 import type { ReferenceTypeConfig } from './types';
 import { getImageFieldId } from './getImageFieldId';
+import { EmptyReferenceView } from './EmptyReferenceView';
 
 type ReferenceValue = Record<string, unknown> | null;
 
 export const ReferenceView: React.FC<CellViewProps<ReferenceValue>> = ({
   value,
   typeConfig,
+  isEditable,
 }) => {
+  const { t } = useTranslations();
   const config = typeConfig as ReferenceTypeConfig | undefined;
   if (!value || !config?.refSchema) {
-    return <CellViewLayout>{null}</CellViewLayout>;
+    return (
+      <EmptyReferenceView
+        isEditable={isEditable}
+        placeholder={t('CMS.cellReference.placeholder')}
+      />
+    );
   }
 
   const { displayField, fields } = config.refSchema;

package/src/components/EditableTable/cellTypes/reference/View.uni.driver.ts

@@ -4,6 +4,7 @@ import { baseUniDriverFactory } from '../../../../unidriver';
 export function ReferenceViewUniDriver(base: UniDriver, _body: UniDriver) {
   return {
     ...baseUniDriverFactory(base),
+    hasArrow: () => base.$('[data-hook="reference-cell-arrow"]').exists(),
     isEmpty: async () =>
       !(await base.$('[data-hook="reference-view"]').exists()),
     getName: () => base.$('[data-hook="reference-view"]').text(),

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit3171397136";
+var _namespace_ = "Edit2172195729";
 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":"Edit3171397136__root","selectInput":"Edit3171397136__selectInput"};
+export var classes = {"root":"Edit2172195729__root","selectInput":"Edit2172195729__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_ = "Edit3599959172";
+var _namespace_ = "Edit3688837703";
 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":"Edit3599959172__root","editWrapper":"Edit3599959172__editWrapper","inputArea":"Edit3599959172__inputArea"};
+export var classes = {"root":"Edit3688837703__root","editWrapper":"Edit3688837703__editWrapper","inputArea":"Edit3688837703__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_ = "View1228023964";
+var _namespace_ = "View532610434";
 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":"View1228023964__root"};
+export var classes = {"root":"View532610434__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_ = "Edit1193083035";
+var _namespace_ = "Edit506646544";
 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":"Edit1193083035__root","wrapper":"Edit1193083035__wrapper","overlay":"Edit1193083035__overlay"};
+export var classes = {"root":"Edit506646544__root","wrapper":"Edit506646544__wrapper","overlay":"Edit506646544__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_ = "Edit748417744";
+var _namespace_ = "Edit2723986264";
 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":"Edit748417744__root","urlInput":"Edit748417744__urlInput"};
+export var classes = {"root":"Edit2723986264__root","urlInput":"Edit2723986264__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_ = "View16610813";
+var _namespace_ = "View375950858";
 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":"View16610813__root","textView":"View16610813__textView","urlText":"View16610813__urlText","suffix":"View16610813__suffix"};
+export var classes = {"root":"View375950858__root","textView":"View375950858__textView","urlText":"View375950858__urlText","suffix":"View375950858__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_ = "EmptyStateBase2904811212";
+var _namespace_ = "EmptyStateBase656853121";
 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":"EmptyStateBase2904811212__root"};
+export var classes = {"root":"EmptyStateBase656853121__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_ = "EntityPagePlain2776377256";
+var _namespace_ = "EntityPagePlain3759557725";
 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":"EntityPagePlain2776377256__root"};
+export var classes = {"root":"EntityPagePlain3759557725__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_ = "Fade1696492783";
+var _namespace_ = "Fade1770349337";
 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":"Fade1696492783__root"};
+export var classes = {"root":"Fade1770349337__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/FieldActions/HeaderActionsPopover.tsx

@@ -1,7 +1,7 @@
 import React, { useState, useCallback, useEffect, useRef } from 'react';
 import { PopoverMenu, IconButton, Tooltip } from '@wix/design-system';
 import { MoreSmall } from '@wix/wix-ui-icons-common/lazy';
-import { useWixPatternsContainer } from '@wix/bex-core/react';
+import { usePageContext, useWixPatternsContainer } from '@wix/bex-core/react';
 import type { HeaderAction } from './headerActionTypes';
 import { actionMenuItems } from './actionMenuItems';
 import { useCloseOnAncestorScroll } from '../../hooks/useCloseOnAncestorScroll';
@@ -20,6 +20,7 @@ export function HeaderActionsPopover({
   onOpenChange,
 }: HeaderActionsPopoverProps) {
   const { translate: t } = useWixPatternsContainer();
+  const { stackingRootRef } = usePageContext();
   const [menuOpen, setMenuOpen] = useState(false);
   const [popoverKey, setPopoverKey] = useState(0);
   const wrapperRef = useRef<HTMLDivElement>(null);
@@ -77,7 +78,7 @@ export function HeaderActionsPopover({
               <MoreSmall />
             </IconButton>
           }
-          appendTo="window"
+          appendTo={stackingRootRef.current || 'parent'}
           placement="bottom-end"
           onShow={() => setMenuOpen(true)}
           onHide={() => setMenuOpen(false)}

package/src/components/FieldCell/FieldCell.tsx

@@ -96,11 +96,7 @@ function _FieldCell(props: FieldCellProps) {
     }
     case 'BOOLEAN':
       return (
-        <Box
-          align="center"
-          verticalAlign="middle"
-          color={props.value ? 'G10' : 'D10'}
-        >
+        <Box verticalAlign="middle" color={props.value ? 'G10' : 'D10'}>
           {props.value ? <Confirm /> : <Minus />}
         </Box>
       );

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

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

package/src/components/ImportButton/ImportStepUpload.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ImportStepUpload730546862";
+var _namespace_ = "ImportStepUpload2101281800";
 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":"ImportStepUpload730546862__root","fileUpload":"ImportStepUpload730546862__fileUpload"};
+export var classes = {"root":"ImportStepUpload2101281800__root","fileUpload":"ImportStepUpload2101281800__fileUpload"};
 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_ = "InputOverflow4003085375";
+var _namespace_ = "InputOverflow2248902607";
 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":"InputOverflow4003085375__root"};
+export var classes = {"root":"InputOverflow2248902607__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_ = "LoadingRow1313526491";
+var _namespace_ = "LoadingRow3893066163";
 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":"LoadingRow1313526491__root"};
-export var keyframes = {"gradientSwoosh":"LoadingRow1313526491__gradientSwoosh"}; 
+export var classes = {"root":"LoadingRow3893066163__root"};
+export var keyframes = {"gradientSwoosh":"LoadingRow3893066163__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_ = "MaxHeightText1042732106";
+var _namespace_ = "MaxHeightText2356253105";
 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":"MaxHeightText1042732106__root"};
+export var classes = {"root":"MaxHeightText2356253105__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};