@wix/patterns 1.460.0 → 1.462.0

package/dist/types/version.d.ts

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/patterns",
-  "version": "1.460.0",
+  "version": "1.462.0",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
@@ -177,6 +177,7 @@
     "type-check": "tsc --noEmit",
     "type-check:tests": "tsc -p tsconfig.tests.json",
     "type-check:handoffs": "tsc -p tsconfig.handoffs.json",
+    "type-check:docs-consumer": "ts-node -T --project tsconfig.scripts.json scripts/type-check-docs-consumer.ts",
     "coverage:publish": "janet deploy --config janet/coverage.janet.json --timeout 600000",
     "visual-e2e:start": "yarn stc:all && STORYBOOK_VISUAL_E2E=true start-storybook --no-version-updates -c .storybook-visual-e2e -p 49896",
     "docs:start": "STORYBOOK_DOCS=true start-storybook --no-version-updates -c .storybook -p 49895 ",
@@ -222,11 +223,11 @@
   ],
   "dependencies": {
     "@wix/agent-platform-bm-sdk": "^1.0.0",
-    "@wix/bex-core": "2.366.0",
-    "@wix/bex-utils": "2.153.0",
+    "@wix/bex-core": "2.368.0",
+    "@wix/bex-utils": "2.155.0",
     "@wix/essentials": "^0.1.26",
-    "@wix/patterns-fields": "1.88.0",
-    "@wix/patterns-fields-utils": "1.69.0",
+    "@wix/patterns-fields": "1.90.0",
+    "@wix/patterns-fields-utils": "1.71.0",
     "@wix/sdk": "^1.15.22",
     "@wix/wix-style-react-incubator": "^3.23.1",
     "@wix/wix-ui-test-utils": "^1.1.9",
@@ -289,7 +290,7 @@
     "@wix/awaiter-utils": "^1.0.76",
     "@wix/babel-cli": "^1.11.0",
     "@wix/business-manager-api": "^1.470.0",
-    "@wix/cairo-integration-utils": "1.128.0",
+    "@wix/cairo-integration-utils": "1.130.0",
     "@wix/ci-build-info": "^1.0.0",
     "@wix/crm": "^1.0.93",
     "@wix/dashboard": "^1.3.39",
@@ -437,6 +438,7 @@
       ],
       "postBuild": [
         "type-check:tests",
+        "type-check:docs-consumer",
         "test:unit"
       ]
     }
@@ -448,5 +450,5 @@
   "wallaby": {
     "autoDetect": true
   },
-  "falconPackageHash": "5c39c6bd574c6a2f15aca5e96bda8db8f2fd1acf570a6373c28a3826"
+  "falconPackageHash": "3b4d2beabb5dfb2e803c7a10b478614439cf1cccfcc98c5e5e1600c6"
 }

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CardContainer3046349765";
+var _namespace_ = "CardContainer4169661533";
 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":"CardContainer3046349765__root"};
+export var classes = {"root":"CardContainer4169661533__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_ = "CmsFieldForm3421283849";
+var _namespace_ = "CmsFieldForm547150418";
 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":"CmsFieldForm3421283849__root","fullBleedDivider":"CmsFieldForm3421283849__fullBleedDivider"};
+export var classes = {"root":"CmsFieldForm547150418__root","fullBleedDivider":"CmsFieldForm547150418__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_ = "CmsFieldModal2414173530";
+var _namespace_ = "CmsFieldModal1799131433";
 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":"CmsFieldModal2414173530__root","modal":"CmsFieldModal2414173530__modal"};
+export var classes = {"root":"CmsFieldModal1799131433__root","modal":"CmsFieldModal1799131433__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_ = "ValidationAndDefaultsSection1354747095";
+var _namespace_ = "ValidationAndDefaultsSection2260299288";
 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":"ValidationAndDefaultsSection1354747095__root","accordionWrapper":"ValidationAndDefaultsSection1354747095__accordionWrapper"};
+export var classes = {"root":"ValidationAndDefaultsSection2260299288__root","accordionWrapper":"ValidationAndDefaultsSection2260299288__accordionWrapper"};
 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_ = "Collapse2746528810";
+var _namespace_ = "Collapse3883776103";
 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":"Collapse2746528810__root","exit":"Collapse2746528810__exit"};
+export var classes = {"root":"Collapse3883776103__root","exit":"Collapse3883776103__exit"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionPageHeaderNew/CollectionPageHeader.tsx

@@ -1,4 +1,8 @@
-import { Breadcrumbs, BreadcrumbsProps } from '@wix/design-system';
+import type {
+  BadgeProps,
+  Breadcrumbs,
+  BreadcrumbsProps,
+} from '@wix/design-system';
 import { ReactElement } from 'react';
 import { useCollectionPageHeader } from '../../state/CollectionPage';
 import { MoreActionsElement } from '../MoreActions';
@@ -11,6 +15,13 @@ export type BreadcrumbsElement = ReactElement<
   typeof Breadcrumbs
 >;
 
+export type CollectionPageHeaderBadge = Pick<
+  BadgeProps,
+  'skin' | 'prefixIcon' | 'suffixIcon'
+> & {
+  text: string;
+};
+
 export interface CollectionPageHeaderProps {
   /**
    * A [`Breadcrumbs`](https://www.docs.wixdesignsystem.com/?path=/story/components-navigation--breadcrumbs) element to be rendered on the header.
@@ -21,10 +32,16 @@ export interface CollectionPageHeaderProps {
 
   /**
    * `text`: The title text. \
-   * `hideTotal`: Determines whether to hide the number of total entities on the title of the page.
+   * `hideTotal`: Determines whether to hide the number of total entities on the title of the page. \
+   * `badges`: Badges rendered at the end of the title row, after the total. Their size is always `small`. \
+   * The minimized header shows the title text on its own, so badges are not rendered while it is collapsed.
    * @external
    */
-  title: { text: string; hideTotal?: boolean };
+  title: {
+    text: string;
+    hideTotal?: boolean;
+    badges?: CollectionPageHeaderBadge[];
+  };
 
   /**
    * The page subtitle text.

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

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

package/src/components/CollectionPageNew/CollectionPage.tsx

@@ -75,6 +75,7 @@ function _CollectionPage({
   if (container.isPanelLayout) {
     child = (
       <Box
+        dataHook={rest.dataHook}
         direction="vertical"
         className={st(classes.root, {
           panel: true,

package/src/components/CollectionPageNew/CollectionPage.uni.driver.ts

@@ -1,6 +1,7 @@
 import { UniDriver } from '@wix/wix-ui-test-utils/unidriver';
 import { baseUniDriverFactory } from '../../unidriver';
 import {
+  BadgeUniDriver,
   PageHeaderUniDriver,
   ButtonUniDriver,
 } from '@wix/design-system/dist/testkit/unidriver';
@@ -32,9 +33,20 @@ export default (base: UniDriver, body: UniDriver) => {
     getPageHeader: () =>
       PageHeaderUniDriver(base.$(`[data-hook="collection-page-header"]`), body),
 
+    /** Returns the WDS heading size the page title renders at */
+    getTitleSize: () =>
+      base.$('[data-hook="collection-page-header-title"]').attr('data-size'),
+
     getTotal: async () =>
       Number(await base.$('[data-hook="page-header-total-count"]').text()),
 
+    /** Returns the header title badge driver at the given index */
+    getHeaderBadgeAt: (index: number) =>
+      BadgeUniDriver(
+        base.$(`[data-hook="collection-page-header-badge-${index}"]`),
+        body,
+      ),
+
     subTitleDriver: SubTitleUniDriver(base, body),
 
     ...baseUniDriverFactory(base),

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CollectionSectionHeader1382747161";
+var _namespace_ = "CollectionSectionHeader1403109224";
 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":"CollectionSectionHeader1382747161__root","summaryIcon":"CollectionSectionHeader1382747161__summaryIcon"};
+export var classes = {"root":"CollectionSectionHeader1403109224__root","summaryIcon":"CollectionSectionHeader1403109224__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_ = "CollectionTable886770172";
+var _namespace_ = "CollectionTable556496282";
 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":"CollectionTable886770172__root"};
+export var classes = {"root":"CollectionTable556496282__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_ = "CollectionTableWSRTable4278368432";
+var _namespace_ = "CollectionTableWSRTable1318192250";
 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":"CollectionTableWSRTable4278368432__root"};
+export var classes = {"root":"CollectionTableWSRTable1318192250__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CollectionToolbar1404698966";
+var _namespace_ = "CollectionToolbar1587251440";
 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":"CollectionToolbar1404698966__root","right":"CollectionToolbar1404698966__right","left":"CollectionToolbar1404698966__left","fullWidth":"CollectionToolbar1404698966__fullWidth"};
+export var classes = {"root":"CollectionToolbar1587251440__root","right":"CollectionToolbar1587251440__right","left":"CollectionToolbar1587251440__left","fullWidth":"CollectionToolbar1587251440__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_ = "SearchOrCustomFilter673030868";
+var _namespace_ = "SearchOrCustomFilter7814507";
 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":"SearchOrCustomFilter673030868__root","search":"SearchOrCustomFilter673030868__search","searchMobile":"SearchOrCustomFilter673030868__searchMobile"};
+export var classes = {"root":"SearchOrCustomFilter7814507__root","search":"SearchOrCustomFilter7814507__search","searchMobile":"SearchOrCustomFilter7814507__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_ = "AutoCompleteReadonly3301679173";
+var _namespace_ = "AutoCompleteReadonly1212018788";
 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":"AutoCompleteReadonly3301679173__root"};
+export var classes = {"root":"AutoCompleteReadonly1212018788__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_ = "ViewsDropdown1992487734";
+var _namespace_ = "ViewsDropdown1721159365";
 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":"ViewsDropdown1992487734__root"};
+export var classes = {"root":"ViewsDropdown1721159365__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CustomFieldModal/CustomFieldForm.tsx

@@ -226,7 +226,10 @@ export const _CustomFieldForm = (props: CustomFieldFormProps) => {
                         <CustomFieldFormPermissions state={state} />
                       )}
                       {SettingsSection && (
-                        <SettingsSection fieldType={type.value} />
+                        <SettingsSection
+                          fieldType={type.value}
+                          lockedRules={lockedProperties}
+                        />
                       )}
                     </Box>
                   ),

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "DragHandle3337898535";
+var _namespace_ = "DragHandle3857496114";
 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":"DragHandle3337898535__root"};
+export var classes = {"root":"DragHandle3857496114__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_ = "EditableCell1363090160";
+var _namespace_ = "EditableCell3695138072";
 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":"EditableCell1363090160__root","errorMessage":"EditableCell1363090160__errorMessage"};
+export var classes = {"root":"EditableCell3695138072__root","errorMessage":"EditableCell3695138072__errorMessage"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -18,6 +18,23 @@ const { fireEvent = null } =
 export function EditableTableUniDriver(base: UniDriver, body: UniDriver) {
   const table = TableUniDriver(base, body);
 
+  const dispatchClipboardWrite = async (type: 'copy' | 'cut') => {
+    const el = await base.getNative();
+    let text = '';
+    const event = Object.assign(
+      new Event(type, { bubbles: true, cancelable: true }),
+      {
+        clipboardData: {
+          setData: (_format: string, value: string) => {
+            text = value;
+          },
+        },
+      },
+    );
+    el.dispatchEvent(event);
+    return { text, defaultPrevented: event.defaultPrevented };
+  };
+
   const getRows = () => base.$$('tbody tr[data-table-row="dataTableRow"]');
 
   const getCells = () => base.$$('[role="gridcell"]');
@@ -87,12 +104,22 @@ export function EditableTableUniDriver(base: UniDriver, body: UniDriver) {
       }
     },
 
+    /** Dispatch a copy event on the table container and return its text payload */
+    dispatchCopy: async () => (await dispatchClipboardWrite('copy')).text,
+
+    /** Dispatch a copy event and return its payload and browser-fallback state. */
+    dispatchCopyEvent: () => dispatchClipboardWrite('copy'),
+
+    /** Dispatch a cut event and return its payload and browser-fallback state. */
+    dispatchCutEvent: () => dispatchClipboardWrite('cut'),
+
     /** Dispatch a paste event on the table container */
     dispatchPaste: async (text: string) => {
       const el = await base.getNative();
-      const event = Object.assign(new Event('paste', { bubbles: true }), {
-        clipboardData: { getData: () => text },
-      });
+      const event = Object.assign(
+        new Event('paste', { bubbles: true, cancelable: true }),
+        { clipboardData: { getData: () => text } },
+      );
       el.dispatchEvent(event);
     },
   };

package/src/components/EditableTable/EditableTableContextMenu.tsx

@@ -112,10 +112,6 @@ function _EditableTableContextMenu<T, F extends FiltersMap>({
     }
     try {
       const rawData = await navigator.clipboard.readText();
-      if (!rawData) {
-        onClose();
-        return;
-      }
       clipboard.paste(rawData);
     } catch {}
     onClose();
@@ -147,15 +143,22 @@ function _EditableTableContextMenu<T, F extends FiltersMap>({
   const hasMultipleRows = selectedRowCount > 1;
   const isMultiCellSelection = !isRowSelectionMode && selectedCount > 1;
 
-  const areSelectedCellsReadOnly =
-    selectedCount > 0 &&
-    selectedCells.every((c) => !state.isColumnEditable(c.rowKey, c.columnId));
-  const isPasteTargetReadOnly =
-    !cellInteraction.focusedCell ||
-    !state.isColumnEditable(
-      cellInteraction.focusedCell.rowKey,
-      cellInteraction.focusedCell.columnId,
-    );
+  const copyAvailability = state.cellValue.getCellActionMenuAvailability(
+    'copy',
+    selectedCells,
+  );
+  const cutAvailability = state.cellValue.getCellActionMenuAvailability(
+    'cut',
+    selectedCells,
+  );
+  const clearAvailability = state.cellValue.getCellActionMenuAvailability(
+    'clear',
+    selectedCells,
+  );
+  const pasteAvailability = state.cellValue.getCellActionMenuAvailability(
+    'paste',
+    cellInteraction.focusedCell ? [cellInteraction.focusedCell] : [],
+  );
 
   const options = [];
 
@@ -261,33 +264,31 @@ function _EditableTableContextMenu<T, F extends FiltersMap>({
       buildMenuAction({
         id: 'copy',
         title: t('cairo.editableTable.contextMenu.copy.CTA'),
-        disabled: selectedCount === 0,
+        disabled: copyAvailability.disabled,
+        disabledDescription: copyAvailability.disabledTooltip,
       }),
       buildMenuAction({
         id: 'cut',
         title: t('cairo.editableTable.contextMenu.cut.CTA'),
-        disabled:
-          selectedCount === 0 ||
-          !!updateItemDisabled ||
-          areSelectedCellsReadOnly,
-        disabledDescription: updateDisabledReason,
+        disabled: !!updateItemDisabled || cutAvailability.disabled,
+        disabledDescription:
+          updateDisabledReason ?? cutAvailability.disabledTooltip,
       }),
       buildMenuAction({
         id: 'paste',
         title: t('cairo.editableTable.contextMenu.paste.CTA'),
-        disabled: !!updateItemDisabled || isPasteTargetReadOnly,
-        disabledDescription: updateDisabledReason,
+        disabled: !!updateItemDisabled || pasteAvailability.disabled,
+        disabledDescription:
+          updateDisabledReason ?? pasteAvailability.disabledTooltip,
       }),
       buildMenuAction({
         id: 'clear',
         title: t('cairo.editableTable.contextMenu.clearCell.CTA', {
           count: selectedCount,
         }),
-        disabled:
-          selectedCount === 0 ||
-          !!updateItemDisabled ||
-          areSelectedCellsReadOnly,
-        disabledDescription: updateDisabledReason,
+        disabled: !!updateItemDisabled || clearAvailability.disabled,
+        disabledDescription:
+          updateDisabledReason ?? clearAvailability.disabledTooltip,
       }),
     );
 

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "HeaderActionsPopover2463284946";
+var _namespace_ = "HeaderActionsPopover1774199072";
 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":"HeaderActionsPopover2463284946__root"};
+export var classes = {"root":"HeaderActionsPopover1774199072__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_ = "CellViewLayout3429307342";
+var _namespace_ = "CellViewLayout3458924742";
 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":"CellViewLayout3429307342__root"};
+export var classes = {"root":"CellViewLayout3458924742__root"};
 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_ = "Edit3214654020";
+var _namespace_ = "Edit4124644988";
 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":"Edit3214654020__root","addressInput":"Edit3214654020__addressInput"};
+export var classes = {"root":"Edit4124644988__root","addressInput":"Edit4124644988__addressInput"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/cellTypes/address/index.tsx

@@ -59,7 +59,6 @@ export const addressCellType = defineCellType<Address | undefined>({
     return translate!('cairo.editableTable.address.validation.invalid');
   },
   editable: true,
-  clearable: true,
   // Type-to-edit clears the cell so the user starts a fresh search query.
   onTypeToEdit: () => ({ value: undefined }),
 });