@wix/patterns 1.482.0 → 1.484.0

package/src/components/PickerContent/PickerContentAdditionalStep.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerContentAdditionalStep4012172053";
+var _namespace_ = "PickerContentAdditionalStep441451923";
 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":"PickerContentAdditionalStep4012172053__root","titles":"PickerContentAdditionalStep4012172053__titles","suffix":"PickerContentAdditionalStep4012172053__suffix"};
+export var classes = {"root":"PickerContentAdditionalStep441451923__root","titles":"PickerContentAdditionalStep441451923__titles","suffix":"PickerContentAdditionalStep441451923__suffix"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

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

package/src/components/SchemaSource/schemaFieldManagement.ts

@@ -67,6 +67,10 @@ export const schemaFieldManagement = (
       const { schema, source } = sourceState;
       return schema ? source.canEditField(field, schema) : false;
     },
+    canEditFieldPii: (field) => {
+      const { schema, source } = sourceState;
+      return schema ? source.canEditFieldPii?.(field, schema) ?? false : false;
+    },
     // Self-contained: does the delete and reports its own toast (matching the
     // DataExtension source). Rethrows on failure so the shared delete modal stays
     // open for a retry.

package/src/components/SchemaSource/tableSchemaSource.ts

@@ -89,6 +89,9 @@ class TableSchemaSourceImpl<T> implements TableSchemaSource<T> {
   get fieldPermissions() {
     return this.source.fieldPermissions;
   }
+  get canEditFieldPii() {
+    return this.source.canEditFieldPii;
+  }
   get supportsPii() {
     return this.source.supportsPii;
   }

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

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

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SetupWidget741893811";
+var _namespace_ = "SetupWidget1988895407";
 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":"SetupWidget741893811__root","row":"SetupWidget741893811__row","completedCta":"SetupWidget741893811__completedCta","secondaryCta":"SetupWidget741893811__secondaryCta","card":"SetupWidget741893811__card","stepIcon":"SetupWidget741893811__stepIcon","chevron":"SetupWidget741893811__chevron","chevronDisabled":"SetupWidget741893811__chevronDisabled","inProgressLabel":"SetupWidget741893811__inProgressLabel"};
+export var classes = {"root":"SetupWidget1988895407__root","row":"SetupWidget1988895407__row","completedCta":"SetupWidget1988895407__completedCta","secondaryCta":"SetupWidget1988895407__secondaryCta","card":"SetupWidget1988895407__card","stepIcon":"SetupWidget1988895407__stepIcon","chevron":"SetupWidget1988895407__chevron","chevronDisabled":"SetupWidget1988895407__chevronDisabled","inProgressLabel":"SetupWidget1988895407__inProgressLabel"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SkeletonCard1214774736";
+var _namespace_ = "SkeletonCard1588969825";
 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":"SkeletonCard1214774736__root","headerLoading":"SkeletonCard1214774736__headerLoading"};
+export var classes = {"root":"SkeletonCard1588969825__root","headerLoading":"SkeletonCard1588969825__headerLoading"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

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

package/src/components/Table/AddFieldColumnHeader.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "AddFieldColumnHeader2606439270";
+var _namespace_ = "AddFieldColumnHeader767226450";
 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":"AddFieldColumnHeader2606439270__root","anchorLayer":"AddFieldColumnHeader2606439270__anchorLayer","popover":"AddFieldColumnHeader2606439270__popover","title":"AddFieldColumnHeader2606439270__title","hoverBridge":"AddFieldColumnHeader2606439270__hoverBridge"};
+export var classes = {"root":"AddFieldColumnHeader767226450__root","anchorLayer":"AddFieldColumnHeader767226450__anchorLayer","popover":"AddFieldColumnHeader767226450__popover","title":"AddFieldColumnHeader767226450__title","hoverBridge":"AddFieldColumnHeader767226450__hoverBridge"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Table/PrimaryFieldHeaderFlag.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import { Box, Tooltip } from '@wix/design-system';
+import { FlagFilledSmall } from '@wix/wix-ui-icons-common/lazy';
+import { useWixPatternsContainer } from '@wix/bex-core/react';
+
+export function PrimaryFieldHeaderFlag() {
+  const { translate: t } = useWixPatternsContainer();
+
+  return (
+    <Tooltip
+      dataHook="primary-field-header-flag"
+      content={t('cairo.table.custom-columns.indication.primary.tooltip')}
+      appendTo="window"
+    >
+      <Box flexShrink={0} verticalAlign="middle">
+        <FlagFilledSmall />
+      </Box>
+    </Tooltip>
+  );
+}

package/src/components/TableFolders/TableFoldersContent.tsx

@@ -258,7 +258,6 @@ function _TableFoldersContent<
   return (
     <Table
       {...rest}
-      showHeaderWhenEmpty
       state={state}
       sticky
       search={search}

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "TabsFilter15615530";
+var _namespace_ = "TabsFilter3625412169";
 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":"TabsFilter15615530__root","titleBox":"TabsFilter15615530__titleBox"};
+export var classes = {"root":"TabsFilter3625412169__root","titleBox":"TabsFilter3625412169__titleBox"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Tags/ManageTags/ManageTagsModal/ManageTagsModal.st.css.ts

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

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

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

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

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

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "common3612606240";
+var _namespace_ = "common730749746";
 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":"common3612606240__root","column":"common3612606240__column","fullHeight":"common3612606240__fullHeight"};
+export var classes = {"root":"common730749746__root","column":"common730749746__column","fullHeight":"common730749746__fullHeight"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/essentials/usePickerModal.ts

@@ -10,7 +10,11 @@ import {
   FiltersMap,
   OptionalFiltersMap,
 } from '@wix/bex-core';
-import { PaginationModeConfig } from '@wix/bex-core/react';
+import {
+  CursorPaginationModeConfig,
+  OffsetPaginationModeConfig,
+  PaginationModeConfig,
+} from '@wix/bex-core/react';
 import { useEssentials } from '@wix/fe-essentials/react';
 import { useCallback, useState } from 'react';
 
@@ -34,9 +38,23 @@ export type UsePickerModalParams<
   UsePickerModalParamsOverrides<T, F> &
   PaginationModeConfig<T, F>;
 
-export type PikerModalFactory = <T, F extends FiltersMap = OptionalFiltersMap>(
-  config: UsePickerModalParams<T, F>,
-) => PickerModalState<T, F>;
+type ParamsWithoutPagination<
+  T,
+  F extends FiltersMap,
+> = UsePickerModalParamsEssentials<T, F> & UsePickerModalParamsOverrides<T, F>;
+
+// One overload per pagination branch: see `PaginationModeConfig` in bex-core.
+export type PikerModalFactory = {
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: ParamsWithoutPagination<T, F> & CursorPaginationModeConfig<T, F>,
+  ): PickerModalState<T, F>;
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: ParamsWithoutPagination<T, F> & OffsetPaginationModeConfig<T, F>,
+  ): PickerModalState<T, F>;
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: UsePickerModalParams<T, F>,
+  ): PickerModalState<T, F>;
+};
 
 export function useCreatePickerModal(): PikerModalFactory {
   const { errorMonitor, environment, biLoggerFactory } = useEssentials();
@@ -57,9 +75,18 @@ export function useCreatePickerModal(): PikerModalFactory {
   );
 }
 
+export function usePickerModal<T, F extends FiltersMap = OptionalFiltersMap>(
+  params: ParamsWithoutPagination<T, F> & CursorPaginationModeConfig<T, F>,
+): PickerModalState<T, F>;
+export function usePickerModal<T, F extends FiltersMap = OptionalFiltersMap>(
+  params: ParamsWithoutPagination<T, F> & OffsetPaginationModeConfig<T, F>,
+): PickerModalState<T, F>;
+export function usePickerModal<T, F extends FiltersMap = OptionalFiltersMap>(
+  params: UsePickerModalParams<T, F>,
+): PickerModalState<T, F>;
 export function usePickerModal<T, F extends FiltersMap = OptionalFiltersMap>(
   params: UsePickerModalParams<T, F>,
-) {
+): PickerModalState<T, F> {
   const createPickerModal = useCreatePickerModal();
   const [state] = useState(() => createPickerModal<T, F>(params));
   useSyncPickerModalProps(state, params);

package/src/giza/usePickerModal.ts

@@ -10,7 +10,11 @@ import {
   FiltersMap,
   OptionalFiltersMap,
 } from '@wix/bex-core';
-import { PaginationModeConfig } from '@wix/bex-core/react';
+import {
+  CursorPaginationModeConfig,
+  OffsetPaginationModeConfig,
+  PaginationModeConfig,
+} from '@wix/bex-core/react';
 import { useEssentials } from '@wix/yoshi-flow-bm/fe-essentials-giza';
 import { useCallback, useState } from 'react';
 
@@ -34,9 +38,23 @@ export type UsePickerModalParams<
   UsePickerModalParamsOverrides<T, F> &
   PaginationModeConfig<T, F>;
 
-export type PikerModalFactory = <T, F extends FiltersMap = OptionalFiltersMap>(
-  config: UsePickerModalParams<T, F>,
-) => PickerModalState<T, F>;
+type ParamsWithoutPagination<
+  T,
+  F extends FiltersMap,
+> = UsePickerModalParamsEssentials<T, F> & UsePickerModalParamsOverrides<T, F>;
+
+// One overload per pagination branch: see `PaginationModeConfig` in bex-core.
+export type PikerModalFactory = {
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: ParamsWithoutPagination<T, F> & CursorPaginationModeConfig<T, F>,
+  ): PickerModalState<T, F>;
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: ParamsWithoutPagination<T, F> & OffsetPaginationModeConfig<T, F>,
+  ): PickerModalState<T, F>;
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: UsePickerModalParams<T, F>,
+  ): PickerModalState<T, F>;
+};
 
 export function useCreatePickerModal(): PikerModalFactory {
   const { errorMonitor, environment, createChildEssentials } = useEssentials();
@@ -60,9 +78,18 @@ export function useCreatePickerModal(): PikerModalFactory {
   );
 }
 
+export function usePickerModal<T, F extends FiltersMap = OptionalFiltersMap>(
+  params: ParamsWithoutPagination<T, F> & CursorPaginationModeConfig<T, F>,
+): PickerModalState<T, F>;
+export function usePickerModal<T, F extends FiltersMap = OptionalFiltersMap>(
+  params: ParamsWithoutPagination<T, F> & OffsetPaginationModeConfig<T, F>,
+): PickerModalState<T, F>;
+export function usePickerModal<T, F extends FiltersMap = OptionalFiltersMap>(
+  params: UsePickerModalParams<T, F>,
+): PickerModalState<T, F>;
 export function usePickerModal<T, F extends FiltersMap = OptionalFiltersMap>(
   params: UsePickerModalParams<T, F>,
-) {
+): PickerModalState<T, F> {
   const createPickerModal = useCreatePickerModal();
   const [state] = useState(() => createPickerModal<T, F>(params));
   useSyncPickerModalProps(state, params);

package/src/hooks/useCreateWSRColumnBase.tsx

@@ -3,6 +3,7 @@ import React, { useCallback, type ReactNode } from 'react';
 import { Box, Text } from '@wix/design-system';
 import { getFieldTypeIcon } from '../utils/fieldTypePrefixIcons';
 import { AddFieldColumnHeader } from '../components/Table/AddFieldColumnHeader';
+import { PrimaryFieldHeaderFlag } from '../components/Table/PrimaryFieldHeaderFlag';
 
 export interface UseCreateWSRColumnBaseParams {
   horizontalScroll?: boolean;
@@ -31,6 +32,7 @@ export function useCreateWSRColumnBase({
         infoTooltipProps,
         fieldType,
         fieldTypeIcons,
+        isPrimary,
       } = column;
       const lastColumn = index === length - 1;
 
@@ -58,6 +60,7 @@ export function useCreateWSRColumnBase({
       const renderedTitle: ReactNode =
         title && showFieldTypeIcons ? (
           <Box gap="SP1" verticalAlign="middle" minWidth={0}>
+            {isPrimary && <PrimaryFieldHeaderFlag />}
             <Box flexShrink={0}>
               {getFieldTypeIcon({ fieldType, icons: fieldTypeIcons })}
             </Box>

package/src/hooks/useEditableTableCollection.ts

@@ -6,6 +6,9 @@ import {
 import {
   useWixPatternsContainer,
   CollectionConfigWithConditionals,
+  CollectionConfigWithoutPagination,
+  CursorPaginationModeConfig,
+  OffsetPaginationModeConfig,
   useCreateCollection,
   useCreateOptimisticActions,
 } from '@wix/bex-core/react';
@@ -20,7 +23,9 @@ import { useOptionalCachedState } from './useOptionalCachedState';
 export type EditableTableCollectionConfig<
   T,
   F extends FiltersMap,
-> = CollectionConfigWithConditionals<T, F> & {
+> = CollectionConfigWithConditionals<T, F> & EditableTableOptions<T, F>;
+
+type EditableTableOptions<T, F extends FiltersMap> = {
   permissions?: EditableTablePermissions<T>;
   mutations: EditableTableMutationHandlers<T>;
   optimisticActionParams?: Partial<CollectionOptimisticActionsBaseParams<T, F>>;
@@ -31,9 +36,22 @@ export type EditableTableCollectionConfig<
   extraCellTypes?: CellType[];
 };
 
-type EditableTableCollection = <T, F extends FiltersMap = OptionalFiltersMap>(
-  config: EditableTableCollectionConfig<T, F>,
-) => EditableTableState<T, F>;
+// One overload per pagination branch: see `PaginationModeConfig`.
+type EditableTableCollection = {
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: CollectionConfigWithoutPagination<T, F> &
+      EditableTableOptions<T, F> &
+      CursorPaginationModeConfig<T, F>,
+  ): EditableTableState<T, F>;
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: CollectionConfigWithoutPagination<T, F> &
+      EditableTableOptions<T, F> &
+      OffsetPaginationModeConfig<T, F>,
+  ): EditableTableState<T, F>;
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: EditableTableCollectionConfig<T, F>,
+  ): EditableTableState<T, F>;
+};
 
 export const useEditableTableCollection: EditableTableCollection = <
   T,

package/src/hooks/useFilterCollection/useFilterCollection.ts

@@ -8,8 +8,8 @@ import {
 import {
   CollectionConfig,
   CollectionConfigWithConditionals,
-  CursorFetchDataFn,
-  OffsetFetchDataFn,
+  CursorPaginationModeConfig,
+  OffsetPaginationModeConfig,
   useCreateCollection,
 } from '@wix/bex-core/react';
 
@@ -17,17 +17,7 @@ type FiltersConfig<F extends FiltersMap> = F extends OptionalFiltersMap
   ? { filters?: {} }
   : { filters: F };
 
-type PaginationModeConfig<T, F extends FiltersMap> =
-  | {
-      paginationMode?: 'offset';
-      fetchData: OffsetFetchDataFn<T, F>;
-    }
-  | {
-      paginationMode: 'cursor';
-      fetchData: CursorFetchDataFn<T, F>;
-    };
-
-export type FilterCollectionConfig<T, F extends FiltersMap> = Omit<
+type ConfigWithoutPagination<T, F extends FiltersMap> = Omit<
   CollectionConfig<T, F>,
   | 'itemKey'
   | 'itemName'
@@ -36,18 +26,38 @@ export type FilterCollectionConfig<T, F extends FiltersMap> = Omit<
   | 'fetchData'
   | 'fetchErrorMessage'
 > &
-  FiltersConfig<F> &
-  PaginationModeConfig<T, F>;
+  FiltersConfig<F>;
 
-export type FilterCollectionFactory = <T, F extends FiltersMap = FiltersMap>(
-  filter: Filter<T[]>,
-  config: FilterCollectionConfig<T, F>,
-) => CollectionState<T, F>;
+type CursorConfig<T, F extends FiltersMap> = ConfigWithoutPagination<T, F> &
+  Omit<CursorPaginationModeConfig<T, F>, 'fetchTotal'>;
+
+type OffsetConfig<T, F extends FiltersMap> = ConfigWithoutPagination<T, F> &
+  OffsetPaginationModeConfig<T, F>;
+
+export type FilterCollectionConfig<T, F extends FiltersMap> =
+  | OffsetConfig<T, F>
+  | CursorConfig<T, F>;
+
+// One overload per pagination branch: see `PaginationModeConfig` in bex-core.
+export type FilterCollectionFactory = {
+  <T, F extends FiltersMap = FiltersMap>(
+    filter: Filter<T[]>,
+    config: CursorConfig<T, F>,
+  ): CollectionState<T, F>;
+  <T, F extends FiltersMap = FiltersMap>(
+    filter: Filter<T[]>,
+    config: OffsetConfig<T, F>,
+  ): CollectionState<T, F>;
+  <T, F extends FiltersMap = FiltersMap>(
+    filter: Filter<T[]>,
+    config: FilterCollectionConfig<T, F>,
+  ): CollectionState<T, F>;
+};
 
 export function useCreateFilterCollection(): FilterCollectionFactory {
   const createCollection = useCreateCollection();
 
-  return useCallback(
+  return useCallback<FilterCollectionFactory>(
     <T, F extends FiltersMap = FiltersMap>(
       filter: Filter<T[]>,
       config: FilterCollectionConfig<T, F>,
@@ -67,6 +77,21 @@ export function useCreateFilterCollection(): FilterCollectionFactory {
   );
 }
 
+export function useFilterCollection<
+  T,
+  F extends FiltersMap = OptionalFiltersMap,
+>(filter: Filter<T[]>, config: CursorConfig<T, F>): CollectionState<T, F>;
+export function useFilterCollection<
+  T,
+  F extends FiltersMap = OptionalFiltersMap,
+>(filter: Filter<T[]>, config: OffsetConfig<T, F>): CollectionState<T, F>;
+export function useFilterCollection<
+  T,
+  F extends FiltersMap = OptionalFiltersMap,
+>(
+  filter: Filter<T[]>,
+  config: FilterCollectionConfig<T, F>,
+): CollectionState<T, F>;
 export function useFilterCollection<
   T,
   F extends FiltersMap = OptionalFiltersMap,

package/src/hooks/useGridCollection.ts

@@ -2,14 +2,28 @@ import { FiltersMap, OptionalFiltersMap } from '@wix/bex-core';
 import {
   useWixPatternsContainer,
   CollectionConfigWithConditionals,
+  CollectionConfigWithoutPagination,
+  CursorPaginationModeConfig,
+  OffsetPaginationModeConfig,
   useCreateCollection,
 } from '@wix/bex-core/react';
 import { GridState } from '../state';
 import { useOptionalCachedState } from './useOptionalCachedState';
 
-export type GridCollection = <T, F extends FiltersMap = OptionalFiltersMap>(
-  config: CollectionConfigWithConditionals<T, F>,
-) => GridState<T, F>;
+// One overload per pagination branch: see `PaginationModeConfig`.
+export type GridCollection = {
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: CollectionConfigWithoutPagination<T, F> &
+      CursorPaginationModeConfig<T, F>,
+  ): GridState<T, F>;
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: CollectionConfigWithoutPagination<T, F> &
+      OffsetPaginationModeConfig<T, F>,
+  ): GridState<T, F>;
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: CollectionConfigWithConditionals<T, F>,
+  ): GridState<T, F>;
+};
 
 export const useGridCollection: GridCollection = <
   T,

package/src/hooks/useLayoutSwitchCollection.ts

@@ -3,6 +3,9 @@ import {
   useWixPatternsContainer,
   useWixPatternsContainerOverrides,
   CollectionConfigWithConditionals,
+  CollectionConfigWithoutPagination,
+  CursorPaginationModeConfig,
+  OffsetPaginationModeConfig,
   useCreateCollection,
   useCreateOptimisticActions,
 } from '@wix/bex-core/react';
@@ -19,7 +22,9 @@ import { useOptionalCachedState } from './useOptionalCachedState';
 export type LayoutSwitchCollectionConfig<
   T,
   F extends FiltersMap,
-> = CollectionConfigWithConditionals<T, F> & {
+> = CollectionConfigWithConditionals<T, F> & LayoutSwitchOptions<T, F>;
+
+type LayoutSwitchOptions<T, F extends FiltersMap> = {
   table?: TableLayoutConfig;
   grid?: GridLayoutConfig;
   spreadsheet?: Omit<SpreadsheetLayoutConfig<T, F>, 'createOptimisticActions'>;
@@ -30,7 +35,24 @@ export type LayoutSwitchCollectionConfig<
   defaultViewType?: ViewType;
 };
 
-export const useLayoutSwitchCollection = <
+// One overload per pagination branch: see `PaginationModeConfig`.
+type LayoutSwitchCollection = {
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: CollectionConfigWithoutPagination<T, F> &
+      LayoutSwitchOptions<T, F> &
+      CursorPaginationModeConfig<T, F>,
+  ): LayoutSwitchState<T, F>;
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: CollectionConfigWithoutPagination<T, F> &
+      LayoutSwitchOptions<T, F> &
+      OffsetPaginationModeConfig<T, F>,
+  ): LayoutSwitchState<T, F>;
+  <T, F extends FiltersMap = OptionalFiltersMap>(
+    config: LayoutSwitchCollectionConfig<T, F>,
+  ): LayoutSwitchState<T, F>;
+};
+
+export const useLayoutSwitchCollection: LayoutSwitchCollection = <
   T,
   F extends FiltersMap = OptionalFiltersMap,
 >(