@wix/patterns 1.461.0 → 1.463.0

package/dist/types/version.d.ts

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/patterns",
-  "version": "1.461.0",
+  "version": "1.463.0",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
@@ -177,6 +177,8 @@
     "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",
+    "type-check:docs-fences": "ts-node -T --project tsconfig.scripts.json scripts/type-check-docs-fences.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 +224,11 @@
   ],
   "dependencies": {
     "@wix/agent-platform-bm-sdk": "^1.0.0",
-    "@wix/bex-core": "2.367.0",
-    "@wix/bex-utils": "2.154.0",
+    "@wix/bex-core": "2.369.0",
+    "@wix/bex-utils": "2.156.0",
     "@wix/essentials": "^0.1.26",
-    "@wix/patterns-fields": "1.89.0",
-    "@wix/patterns-fields-utils": "1.70.0",
+    "@wix/patterns-fields": "1.91.0",
+    "@wix/patterns-fields-utils": "1.72.0",
     "@wix/sdk": "^1.15.22",
     "@wix/wix-style-react-incubator": "^3.23.1",
     "@wix/wix-ui-test-utils": "^1.1.9",
@@ -289,7 +291,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.129.0",
+    "@wix/cairo-integration-utils": "1.131.0",
     "@wix/ci-build-info": "^1.0.0",
     "@wix/crm": "^1.0.93",
     "@wix/dashboard": "^1.3.39",
@@ -437,6 +439,8 @@
       ],
       "postBuild": [
         "type-check:tests",
+        "type-check:docs-consumer",
+        "type-check:docs-fences",
         "test:unit"
       ]
     }
@@ -448,5 +452,5 @@
   "wallaby": {
     "autoDetect": true
   },
-  "falconPackageHash": "04cc2ad788eeaa696ce01ddb2334097a8c18ad9f62b74451770eb21f"
+  "falconPackageHash": "af6e768bd2d1bd4853efaa3b10fb6bced96f24a14d873d4a3e5f2063"
 }

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "CardContainer3835918071";
+var _namespace_ = "CardContainer3308705847";
 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":"CardContainer3835918071__root"};
+export var classes = {"root":"CardContainer3308705847__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_ = "CmsFieldForm2783539848";
+var _namespace_ = "CmsFieldForm2644181114";
 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":"CmsFieldForm2783539848__root","fullBleedDivider":"CmsFieldForm2783539848__fullBleedDivider"};
+export var classes = {"root":"CmsFieldForm2644181114__root","fullBleedDivider":"CmsFieldForm2644181114__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_ = "CmsFieldModal3339688929";
+var _namespace_ = "CmsFieldModal2826391627";
 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":"CmsFieldModal3339688929__root","modal":"CmsFieldModal3339688929__modal"};
+export var classes = {"root":"CmsFieldModal2826391627__root","modal":"CmsFieldModal2826391627__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_ = "ValidationAndDefaultsSection273088678";
+var _namespace_ = "ValidationAndDefaultsSection136873467";
 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":"ValidationAndDefaultsSection273088678__root","accordionWrapper":"ValidationAndDefaultsSection273088678__accordionWrapper"};
+export var classes = {"root":"ValidationAndDefaultsSection136873467__root","accordionWrapper":"ValidationAndDefaultsSection136873467__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_ = "Collapse2666109171";
+var _namespace_ = "Collapse2094159886";
 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":"Collapse2666109171__root","exit":"Collapse2666109171__exit"};
+export var classes = {"root":"Collapse2094159886__root","exit":"Collapse2094159886__exit"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionPage/CollectionPage.tsx

@@ -1,14 +1,16 @@
 import { Page, PageProps } from '@wix/design-system';
 import React, { Children, ReactNode } from 'react';
-import { CollectionState, FiltersMap } from '@wix/bex-core';
+import { CollectionState, FiltersMap, OptionalFiltersMap } from '@wix/bex-core';
 import { CollectionPageHeader } from '../CollectionPageHeader';
 import { InfiniteScrollPage } from '../PageWrapper/InfiniteScrollPage';
 import { CollectionProvider } from '../CollectionContext';
 import { useCollectionPageState } from '@wix/bex-core/react';
 import { usePageHeader } from '../../hooks/usePageHeader';
 
-export interface CollectionPageProps<T, F extends FiltersMap>
-  extends PageProps {
+export interface CollectionPageProps<
+  T,
+  F extends FiltersMap = OptionalFiltersMap,
+> extends PageProps {
   /**
    * A collection state instance created with [useCollection](./?path=/story/common-hooks--usecollection)
    * @external
@@ -25,7 +27,7 @@ export interface CollectionPageProps<T, F extends FiltersMap>
  * @deprecated Use [CollectionPage](./?path=%2Fstory%2Fbase-components-pages-collection-page--collectionpage) from
  * `@wix/patterns/page`
  */
-export function CollectionPage<T, F extends FiltersMap = FiltersMap>({
+export function CollectionPage<T, F extends FiltersMap = OptionalFiltersMap>({
   children,
   state,
   hideTotal,

package/src/components/CollectionPageHeader/CollectionPageHeader.tsx

@@ -2,17 +2,20 @@ import React, { ReactNode } from 'react';
 import { Box, BoxProps } from '@wix/design-system';
 import { CollectionStateProps } from '../collectionStateProps';
 import { observer } from 'mobx-react-lite';
-import { FiltersMap } from '@wix/bex-core';
+import { FiltersMap, OptionalFiltersMap } from '@wix/bex-core';
 
-export interface CollectionPageHeaderProps<T, F extends FiltersMap = FiltersMap>
-  extends Partial<BoxProps>,
+export interface CollectionPageHeaderProps<
+  T,
+  F extends FiltersMap = OptionalFiltersMap,
+> extends Partial<BoxProps>,
     CollectionStateProps<T, F> {
   children?: ReactNode;
 }
 
-export function _CollectionPageHeader<T, F extends FiltersMap = FiltersMap>(
-  props: CollectionPageHeaderProps<T, F>,
-) {
+export function _CollectionPageHeader<
+  T,
+  F extends FiltersMap = OptionalFiltersMap,
+>(props: CollectionPageHeaderProps<T, F>) {
   const { state, children, ...rest } = props;
   const {
     initTask,

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_ = "CollectionPage3980667022";
+var _namespace_ = "CollectionPage1282182167";
 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":"CollectionPage3980667022__root"};
+export var classes = {"root":"CollectionPage1282182167__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_ = "CollectionSectionHeader3075660753";
+var _namespace_ = "CollectionSectionHeader614425748";
 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":"CollectionSectionHeader3075660753__root","summaryIcon":"CollectionSectionHeader3075660753__summaryIcon"};
+export var classes = {"root":"CollectionSectionHeader614425748__root","summaryIcon":"CollectionSectionHeader614425748__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_ = "CollectionTable842236443";
+var _namespace_ = "CollectionTable1743838388";
 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":"CollectionTable842236443__root"};
+export var classes = {"root":"CollectionTable1743838388__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_ = "CollectionTableWSRTable2546952532";
+var _namespace_ = "CollectionTableWSRTable3268631546";
 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":"CollectionTableWSRTable2546952532__root"};
+export var classes = {"root":"CollectionTableWSRTable3268631546__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_ = "CollectionToolbar4143698975";
+var _namespace_ = "CollectionToolbar2935144884";
 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":"CollectionToolbar4143698975__root","right":"CollectionToolbar4143698975__right","left":"CollectionToolbar4143698975__left","fullWidth":"CollectionToolbar4143698975__fullWidth"};
+export var classes = {"root":"CollectionToolbar2935144884__root","right":"CollectionToolbar2935144884__right","left":"CollectionToolbar2935144884__left","fullWidth":"CollectionToolbar2935144884__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_ = "SearchOrCustomFilter4233897407";
+var _namespace_ = "SearchOrCustomFilter2767854994";
 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":"SearchOrCustomFilter4233897407__root","search":"SearchOrCustomFilter4233897407__search","searchMobile":"SearchOrCustomFilter4233897407__searchMobile"};
+export var classes = {"root":"SearchOrCustomFilter2767854994__root","search":"SearchOrCustomFilter2767854994__search","searchMobile":"SearchOrCustomFilter2767854994__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_ = "AutoCompleteReadonly2918676909";
+var _namespace_ = "AutoCompleteReadonly4069259101";
 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":"AutoCompleteReadonly2918676909__root"};
+export var classes = {"root":"AutoCompleteReadonly4069259101__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -59,6 +59,24 @@ export const CollectionViewsDropdownUniDriver = (
     );
   };
 
+  const getViewNames = () =>
+    viewsDropdownDriverBase().$$('[data-hook="view-item"]').text();
+
+  const getViewListItemByName = async (name: string) => {
+    const names = await getViewNames();
+    const index = names.indexOf(name);
+
+    if (index === -1) {
+      throw new Error(
+        `View "${name}" is not in the dropdown. Views found: ${
+          names.join(', ') || '<none>'
+        }`,
+      );
+    }
+
+    return getViewListItemAt(index);
+  };
+
   const getCategoryListItemById = (id: string) => {
     return ListItemSectionUniDriver(
       viewsDropdownDriverBase().$(`[data-hook="dropdown-item-${id}"]`),
@@ -175,8 +193,7 @@ export const CollectionViewsDropdownUniDriver = (
     getViewsCount: async () =>
       viewsDropdownDriverBase().$$('[data-hook="view-item"]').count(),
     /** Get array of all view names in the dropdown */
-    getViewsContent: async () =>
-      viewsDropdownDriverBase().$$('[data-hook="view-item"]').text(),
+    getViewsContent: getViewNames,
     /** Get array popover content , like empty state */
     getViewsPopoverContent: async () =>
       viewsDropdownDriver().dropdownLayoutDriver.optionsContent(),
@@ -193,6 +210,11 @@ export const CollectionViewsDropdownUniDriver = (
     getViewListItemById,
     /** Get view list item driver by view index */
     getViewListItemAt,
+    /** Get view list item driver by view name. Throws when no view has that name */
+    getViewListItemByName,
+    /** Clicks the view with a given name */
+    selectViewByName: async (name: string) =>
+      (await getViewListItemByName(name)).click(),
     /** Get category list item driver by category id */
     getCategoryListItemById,
     /** Get category list item driver by category index */

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ViewsDropdown1450285275";
+var _namespace_ = "ViewsDropdown2440813327";
 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":"ViewsDropdown1450285275__root"};
+export var classes = {"root":"ViewsDropdown2440813327__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_ = "DragHandle3340491551";
+var _namespace_ = "DragHandle2231511974";
 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":"DragHandle3340491551__root"};
+export var classes = {"root":"DragHandle2231511974__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_ = "EditableCell853184343";
+var _namespace_ = "EditableCell234905505";
 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":"EditableCell853184343__root","errorMessage":"EditableCell853184343__errorMessage"};
+export var classes = {"root":"EditableCell234905505__root","errorMessage":"EditableCell234905505__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"]');
@@ -88,29 +105,21 @@ export function EditableTableUniDriver(base: UniDriver, body: UniDriver) {
     },
 
     /** Dispatch a copy event on the table container and return its text payload */
-    dispatchCopy: async () => {
-      const el = await base.getNative();
-      let copiedText = '';
-      const event = Object.assign(
-        new Event('copy', { bubbles: true, cancelable: true }),
-        {
-          clipboardData: {
-            setData: (_format: string, value: string) => {
-              copiedText = value;
-            },
-          },
-        },
-      );
-      el.dispatchEvent(event);
-      return copiedText;
-    },
+    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);
     },
   };