@wix/patterns 1.364.0 → 1.369.0

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "LoadingRow3461175397";
+var _namespace_ = "LoadingRow488784554";
 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":"LoadingRow3461175397__root"};
-export var keyframes = {"gradientSwoosh":"LoadingRow3461175397__gradientSwoosh"}; 
+export var classes = {"root":"LoadingRow488784554__root"};
+export var keyframes = {"gradientSwoosh":"LoadingRow488784554__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_ = "MaxHeightText216893253";
+var _namespace_ = "MaxHeightText2696233809";
 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":"MaxHeightText216893253__root"};
+export var classes = {"root":"MaxHeightText2696233809__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

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

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "MultiBulkActionToolbar791660869";
+var _namespace_ = "MultiBulkActionToolbar821506402";
 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":"MultiBulkActionToolbar791660869__root","leftGroupWrapper":"MultiBulkActionToolbar791660869__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar791660869__selectedCountItem","selectedCountText":"MultiBulkActionToolbar791660869__selectedCountText"};
+export var classes = {"root":"MultiBulkActionToolbar821506402__root","leftGroupWrapper":"MultiBulkActionToolbar821506402__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar821506402__selectedCountItem","selectedCountText":"MultiBulkActionToolbar821506402__selectedCountText"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTable/NestedTablePlaceholderStatesRow.st.css.ts

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

package/src/components/NestedTable/NestedTableRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "NestedTableRow2704827787";
+var _namespace_ = "NestedTableRow3906551943";
 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":"NestedTableRow2704827787__root","firstLevel":"NestedTableRow2704827787__firstLevel","placeholder":"NestedTableRow2704827787__placeholder","parentHovered":"NestedTableRow2704827787__parentHovered"};
+export var classes = {"root":"NestedTableRow3906551943__root","firstLevel":"NestedTableRow3906551943__firstLevel","placeholder":"NestedTableRow3906551943__placeholder","parentHovered":"NestedTableRow3906551943__parentHovered"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTableDragAndDrop/MultipleDragOverlayEffect.st.css.ts

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

package/src/components/NestedTableDragAndDrop/NestedTableDragAndDropRow.st.css.ts

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

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

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

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerContentAdditionalStep1256051322";
+var _namespace_ = "PickerContentAdditionalStep3378583378";
 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":"PickerContentAdditionalStep1256051322__root","titles":"PickerContentAdditionalStep1256051322__titles","suffix":"PickerContentAdditionalStep1256051322__suffix"};
+export var classes = {"root":"PickerContentAdditionalStep3378583378__root","titles":"PickerContentAdditionalStep3378583378__titles","suffix":"PickerContentAdditionalStep3378583378__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_ = "PickerTableListItem1960942270";
+var _namespace_ = "PickerTableListItem3045741371";
 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":"PickerTableListItem1960942270__root"};
+export var classes = {"root":"PickerTableListItem3045741371__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ScrollableContent4102213427";
+var _namespace_ = "ScrollableContent1159900848";
 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":"ScrollableContent4102213427__root"};
+export var classes = {"root":"ScrollableContent1159900848__root"};
 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_ = "SkeletonCard543860056";
+var _namespace_ = "SkeletonCard2332620532";
 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":"SkeletonCard543860056__root","headerLoading":"SkeletonCard543860056__headerLoading"};
+export var classes = {"root":"SkeletonCard2332620532__root","headerLoading":"SkeletonCard2332620532__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_ = "SlidingModal3880889394";
+var _namespace_ = "SlidingModal2730405760";
 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":"SlidingModal3880889394__root"};
+export var classes = {"root":"SlidingModal2730405760__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Suggestions/Suggestions.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import {
-  CarouselWIP,
-  CarouselWIPProps,
+  Carousel,
+  CarouselProps,
   COLOR_TOKENS,
   Box,
 } from '@wix/design-system';
@@ -13,20 +13,22 @@ import { SuggestionsProps } from './types';
 import { VisibilityTrackedCard } from './VisibilityTrackedCard';
 import { SuggestionsProvider } from './SuggestionsContext';
 
-const defaultCarouselProps: CarouselWIPProps = {
-  hideDots: true,
+const defaultCarouselProps: CarouselProps = {
+  dots: false,
   infinite: false,
-  variableWidth: false,
+  variableWidth: true,
+  slideSpacing: 24,
   controlsPosition: 'overlay',
   showControlsShadow: true,
-  sidesGradientColor: COLOR_TOKENS['--wsr-color-D70'],
+  gradientColor: COLOR_TOKENS['--wsr-color-D70'],
+  gradient: true,
   controlsStartEnd: 'hidden',
 };
 
 interface SuggestionsContainerProps {
   count: number;
   children: React.ReactNode;
-  carouselProps?: CarouselWIPProps;
+  carouselProps?: CarouselProps;
   dataHook: string;
   dataState: 'idle' | 'loading';
   maxInlineItems: number;
@@ -67,13 +69,13 @@ const SuggestionsContainer: React.FC<SuggestionsContainerProps> = ({
 
   return (
     <div data-hook={dataHook}>
-      <CarouselWIP
-        dataHook={`suggestions-carousel-${dataState}`}
+      <Carousel
         {...defaultCarouselProps}
         {...carouselProps}
+        dataHook={`suggestions-carousel-${dataState}`}
       >
         {children}
-      </CarouselWIP>
+      </Carousel>
     </div>
   );
 };

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

@@ -1,4 +1,4 @@
-import { CarouselWIPUniDriver } from '@wix/design-system/dist/testkit/unidriver';
+import { CarouselUniDriver } from '@wix/design-system/dist/testkit/unidriver';
 import {
   baseUniDriverFactory,
   UniDriver,
@@ -7,11 +7,11 @@ import {
 export const SuggestionsUniDriver = (base: UniDriver, body: UniDriver) => {
   const dataHook = 'suggestions';
 
-  const carouselIdle = CarouselWIPUniDriver(
+  const carouselIdle = CarouselUniDriver(
     base.$(`[data-hook="${dataHook}-carousel-idle"]`),
     body,
   );
-  const carouselLoading = CarouselWIPUniDriver(
+  const carouselLoading = CarouselUniDriver(
     base.$(`[data-hook="${dataHook}-carousel-loading"]`),
     body,
   );

package/src/components/Suggestions/types.ts

@@ -1,4 +1,4 @@
-import { CarouselWIPProps } from '@wix/design-system';
+import { CarouselProps } from '@wix/design-system';
 import { Offer } from '@wix/bex-utils/@wix/ambassador-dealer-v1-serving-offer/types';
 
 // Re-export Offer for external consumers
@@ -35,7 +35,7 @@ export interface SuggestionsProps {
    * Props to pass to the carousel component.
    * @external
    */
-  carouselProps?: CarouselWIPProps;
+  carouselProps?: CarouselProps;
   /**
    * Render function for each offer card. Return `null` to filter out a card.
    * @external

package/src/components/TableGridSwitchButton/TableGridSwitchButton.tsx

@@ -7,35 +7,16 @@ import {
   SegmentedToggle,
   Tooltip,
 } from '@wix/design-system';
-import {
-  LayoutGallery,
-  LayoutList,
-  LayoutSplit,
-} from '@wix/wix-ui-icons-common';
+import { LayoutGallery, LayoutList } from '@wix/wix-ui-icons-common';
 import { useWixPatternsContainer } from '@wix/bex-core/react';
 import { TranslationsKeys } from '@wix/bex-core';
 import { ViewType, ViewTypeState } from '../../state/ViewTypeState';
-
-const layoutOptions: ViewType[] = ['table', 'grid'];
+import { layoutOptions, layoutConfig } from './layoutConfig';
 
 export interface TableGridSwitchButtonProps {
   state: ViewTypeState;
 }
 
-const layoutConfig: Record<
-  ViewType,
-  { icon: React.ReactNode; translationKey: TranslationsKeys }
-> = {
-  table: {
-    icon: <LayoutSplit />,
-    translationKey: 'cairo.table.layout.table' as TranslationsKeys,
-  },
-  grid: {
-    icon: <LayoutGallery />,
-    translationKey: 'cairo.table.layout.grid' as TranslationsKeys,
-  },
-};
-
 function _TableGridSwitchButton(props: TableGridSwitchButtonProps) {
   const { translate: t, experiments } = useWixPatternsContainer();
   const { state } = props;

package/src/components/TableGridSwitchButton/layoutConfig.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import { LayoutGallery, LayoutSplit } from '@wix/wix-ui-icons-common';
+import { TranslationsKeys } from '@wix/bex-core';
+import { ViewType } from '../../state/ViewTypeState';
+
+export const layoutOptions: ViewType[] = ['table', 'grid'];
+
+export const layoutConfig: Record<
+  ViewType,
+  { icon: React.ReactNode; translationKey: TranslationsKeys }
+> = {
+  table: {
+    icon: <LayoutSplit />,
+    translationKey: 'cairo.table.layout.table' as TranslationsKeys,
+  },
+  grid: {
+    icon: <LayoutGallery />,
+    translationKey: 'cairo.table.layout.grid' as TranslationsKeys,
+  },
+};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "TabsFilter1147196558";
+var _namespace_ = "TabsFilter409906628";
 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":"TabsFilter1147196558__root","title":"TabsFilter1147196558__title"};
+export var classes = {"root":"TabsFilter409906628__root","title":"TabsFilter409906628__title"};
 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_ = "ManageTagsModal3682471619";
+var _namespace_ = "ManageTagsModal3917873617";
 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":"ManageTagsModal3682471619__root"};
+export var classes = {"root":"ManageTagsModal3917873617__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_ = "ToolbarItem1139159954";
+var _namespace_ = "ToolbarItem15520440";
 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":"ToolbarItem1139159954__root"};
+export var classes = {"root":"ToolbarItem15520440__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_ = "ToolbarItemBox20441471";
+var _namespace_ = "ToolbarItemBox939755603";
 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":"ToolbarItemBox20441471__root"};
+export var classes = {"root":"ToolbarItemBox939755603__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_ = "common909002123";
+var _namespace_ = "common1802833007";
 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":"common909002123__root","column":"common909002123__column","fullHeight":"common909002123__fullHeight"};
+export var classes = {"root":"common1802833007__root","column":"common1802833007__column","fullHeight":"common1802833007__fullHeight"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/hooks/useEditableTableCollection.ts

@@ -0,0 +1,54 @@
+import {
+  CollectionOptimisticActionsBaseParams,
+  FiltersMap,
+  OptionalFiltersMap,
+} from '@wix/bex-core';
+import {
+  useWixPatternsContainer,
+  CollectionConfigWithConditionals,
+  useCreateCollection,
+  useCreateOptimisticActions,
+} from '@wix/bex-core/react';
+import {
+  EditableTableState,
+  EditableTablePermissions,
+  EditableTableMutationHandlers,
+} from '../state/EditableTable';
+import { useOptionalCachedState } from './useOptionalCachedState';
+
+export type EditableTableCollectionConfig<
+  T,
+  F extends FiltersMap,
+> = CollectionConfigWithConditionals<T, F> & {
+  permissions?: EditableTablePermissions;
+  mutations: EditableTableMutationHandlers<T>;
+  optimisticActionParams?: Partial<CollectionOptimisticActionsBaseParams<T, F>>;
+};
+
+type EditableTableCollection = <T, F extends FiltersMap = OptionalFiltersMap>(
+  config: EditableTableCollectionConfig<T, F>,
+) => EditableTableState<T, F>;
+
+export const useEditableTableCollection: EditableTableCollection = <
+  T,
+  F extends FiltersMap = OptionalFiltersMap,
+>(
+  config: EditableTableCollectionConfig<T, F>,
+): EditableTableState<T, F> => {
+  const container = useWixPatternsContainer();
+  const createCollection = useCreateCollection();
+  const createOptimisticActions = useCreateOptimisticActions();
+
+  const state = useOptionalCachedState(() => {
+    return new EditableTableState<T, F>({
+      collection: createCollection<T, F>(config),
+      container,
+      permissions: config.permissions,
+      mutations: config.mutations,
+      createOptimisticActions: (collection) =>
+        createOptimisticActions(collection, config.optimisticActionParams),
+    });
+  });
+
+  return state;
+};

package/src/hooks/useStaticListFilterCollection.ts

@@ -46,6 +46,7 @@ export function useStaticListFilterCollection<T>(
 
         return {
           items: filteredList,
+          hasNext: false,
         };
       },
       queryOptions: {

package/src/index.ts

@@ -84,6 +84,7 @@ export * from './components/TableGridSwitchFolders/TableGridSwitchFolders';
 export * from './components/TableGridSwitch/TableGridSwitchDragAndDrop';
 export * from './components/TabTotal';
 export * from './components/NestedTable';
+export * from './components/EditableTable';
 export * from './components/FiltersPanel/AddApplyFiltersButton';
 export * from './components/EmptyState/CollectionEmptyState';
 export * from './components/EmptyState/CollectionNoResultsState';
@@ -132,6 +133,7 @@ export * from './hooks/useTableFolders';
 export * from './hooks/useEntityPage';
 export * from './hooks/useSettingsPage';
 export * from './hooks/useNestedTable';
+export * from './hooks/useEditableTableCollection';
 export * from './hooks/useCreateNestedOptimisticActions';
 export * from './hooks/useEntity';
 export * from './hooks/useSettings';
@@ -150,6 +152,7 @@ export * from './state/TableFoldersState';
 export * from './state/TableGridSwitchFoldersState';
 export * from './state/CustomFields/CustomFieldsWidgetState';
 export * from './state/NestedTableState';
+export * from './state/EditableTable';
 export { DateRangeFilterStateParams } from './state/DateRangeFilterState';
 
 export { TableDragAndDrop } from './components/TableDragAndDrop';

package/src/state/CollectionPage/CollectionPageHeader.st.css.ts

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