@wix/patterns 1.457.0 → 1.459.0

package/dist/dts-bundle/components/CollectionOptimisticActions.d.ts

@@ -0,0 +1,477 @@
+import { IObservableArray } from 'mobx';
+import { EventEmitter } from 'events';
+import { IterateeShorthand } from 'lodash';
+
+type Arguments<T> = [T] extends [(...args: infer U) => any] ? U : [T] extends [void] ? [] : [T];
+interface TypedEventEmitter<Events> {
+    addListener<E extends keyof Events>(event: E, listener: Events[E]): this;
+    on<E extends keyof Events>(event: E, listener: Events[E]): this;
+    once<E extends keyof Events>(event: E, listener: Events[E]): this;
+    off<E extends keyof Events>(event: E, listener: Events[E]): this;
+    removeAllListeners<E extends keyof Events>(event?: E): this;
+    removeListener<E extends keyof Events>(event: E, listener: Events[E]): this;
+    emit<E extends keyof Events>(event: E, ...args: Arguments<Events[E]>): boolean;
+    listeners<E extends keyof Events>(event: E): Events[E][];
+}
+type TypedEmitter<Events> = Omit<EventEmitter, keyof TypedEventEmitter<Events>> & TypedEventEmitter<Events>;
+
+interface ModalLayoutProps {
+    title?: string;
+    content?: string;
+    onConfirm?: () => void;
+    onResume?: () => void;
+    onClose?: () => void;
+    onAfterClose?: () => void;
+    primaryButtonText?: string;
+    secondaryButtonText?: string;
+}
+
+/**
+ * `QueryState` — you receive this, you don't construct it.
+ * An internal state object — reached through another state object, never built directly.
+ */
+declare class QueryState<F = any> {
+    [key: string]: unknown;
+}
+
+/**
+ * `CollectionState` — you receive this, you don't construct it.
+ * Produced by `useFilterCollection()` (also `useStaticListFilterCollection()`, `useCollection()`, `createCollection()`).
+ */
+declare class CollectionState<T = any, F = any> {
+    [key: string]: unknown;
+}
+
+type ToastType = 'STANDARD' | 'PREMIUM' | 'SUCCESS' | 'WARNING' | 'ERROR';
+type ToastTimeout = 'NONE' | 'NORMAL';
+type ToastPriority = 'LOW' | 'NORMAL' | 'HIGH';
+type ToastActionUiType = 'BUTTON' | 'LINK';
+type ToastAction = {
+    text: string;
+    onClick?: Function;
+    removeToastOnClick?: boolean;
+    uiType?: ToastActionUiType;
+    navigationTarget?: {
+        url: string;
+        openInNewTab?: boolean;
+    };
+};
+type ErrorToastDetails = {
+    requestId: string;
+};
+type ToastConfig = {
+    message: string;
+    biName?: string;
+    timeout?: ToastTimeout;
+    priority?: ToastPriority;
+    type?: ToastType;
+    onCloseClick?: () => unknown;
+    onToastSeen?: () => unknown;
+    action?: ToastAction;
+    details?: ErrorToastDetails;
+};
+
+/**
+ * `OptimisticPatch` — you receive this, you don't construct it.
+ * Produced by `prepareItemsToMergeIntoPage()`.
+ */
+declare class OptimisticPatch<T = any> {
+    [key: string]: unknown;
+}
+
+type EventuallyUpdated = 'submit' | number | Promise<unknown>;
+/**
+ * `CollectionOptimisticExecutor` — you receive this, you don't construct it.
+ * An internal state object — reached through another state object, never built directly.
+ */
+declare class CollectionOptimisticExecutor<A = any> {
+    [key: string]: unknown;
+}
+
+type DeepPartial<T> = T extends object ? T extends (infer U)[] ? DeepPartial<U>[] : {
+    [P in keyof T]?: DeepPartial<T[P]>;
+} : T;
+
+interface OptimisticActionBasis {
+    /**
+     * Determines whether to display an undo toast before calling the server action.
+     * @default false
+     * @external
+     */
+    showUndoToast?: boolean;
+    /**
+     * Determines whether to display a toast after clicking on undo.
+     * @default false
+     * @external
+     */
+    showUndoSuccessToast?: boolean;
+    /**
+     * Callback function triggered when the user clicks on the undo button.
+     * @external
+     */
+    onUndo?: () => void;
+    /**
+     * Function to generate error toast to show in case the server fails to perform the action.
+     * @external
+     */
+    errorToast?: (err: unknown, params: {
+        retry: () => void;
+    }) => ToastConfig | string;
+    /**
+     * Callback function triggered when an error occurs.
+     * @external
+     */
+    onError?: (err: unknown) => void;
+    /**
+     * Callback function to retry the action.
+     * @deprecated Use the prop `errorToast={(err, {retry}) => { action:{onClick: () {retry();} }}}` instead.
+     */
+    onTryAgain?: () => void | Promise<void>;
+    /**
+     * Toast message or configuration to show on successful action.
+     * @external
+     */
+    successToast?: ToastConfig | string;
+    /**
+     * Indicates when the server is eventually updated.
+     * Possible values:
+     *   - submit: Server updates immediately after the submission promise resolves.
+     *   - number: Server updates after a specified timeout (in milliseconds).
+     *   - Promise: Server updates after a forwarded promise resolves.
+     * @default submit
+     * @external
+     */
+    updateServerAfter?: EventuallyUpdated;
+}
+interface CreateManyParams<T> extends OptimisticActionBasis {
+    /**
+     * Function to submit the creation operation.
+     * @param items - The items to create.
+     */
+    submit: (items: T[]) => Promise<T[] | null | undefined | void>;
+    /**
+     * The key of the item after which to insert the created items.
+     * If not provided, items are inserted at the beginning.
+     * @external
+     */
+    afterItemKey?: string;
+}
+interface UpdateManyParams<T, R> extends OptimisticActionBasis {
+    /**
+     * Function to submit the update operation.
+     * @param items - The items to update.
+     */
+    submit: (items: T[]) => Promise<R>;
+    /**
+     * Indicates whether to keep the current position of items after the update.
+     */
+    keepPosition?: boolean;
+    /**
+     * Partial data to patch the items with.
+     */
+    patch?: DeepPartial<T>;
+}
+interface UpdateAllParams<R> extends OptimisticActionBasis {
+    /**
+     * Function to submit the update operation.
+     */
+    submit: () => Promise<R>;
+    /**
+     * Indicates whether to keep the current position of items after the update.
+     */
+    keepPosition?: boolean;
+}
+interface DeleteManyParams<T, R> extends OptimisticActionBasis {
+    /**
+     * Function to submit the deletion operation.
+     * @param items - The items to delete.
+     */
+    submit: (items: T[]) => Promise<R>;
+}
+interface OptimisticActions<T> {
+    /**
+     * Creates a single item in the collection.
+     * @param item - The item to create.
+     * @param params - Additional parameters for the operation.
+     * @external
+     */
+    createOne(item: T, params: CreateManyParams<T>): void;
+    /**
+     * Creates multiple items in the collection.
+     * @param items - The items to create.
+     * @param params - Additional parameters for the operation.
+     * @external
+     */
+    createMany(items: T[], params: CreateManyParams<T>): void;
+    updateMany<R>(items: T[], params: UpdateManyParams<T, R>): void;
+    updateOne<R>(item: T, params: UpdateManyParams<T, R>): void;
+    updateAll<R>(patchOrFn: (item: T) => Partial<T>, params: UpdateAllParams<R>): void;
+    deleteMany<R>(items: T[], params: DeleteManyParams<T, R>): void;
+    deleteOne<R>(item: T, params: DeleteManyParams<T, R>): void;
+    deleteAll<R>(params: UpdateAllParams<R>): void;
+}
+
+/**
+ * `CollectionOptimisticSequenceExecutor` — you receive this, you don't construct it.
+ * An internal state object — reached through another state object, never built directly.
+ */
+declare class CollectionOptimisticSequenceExecutor {
+    [key: string]: unknown;
+}
+
+type Iterator<T> = (value: T, index: number) => unknown;
+interface Order<T> {
+    fieldName: Iterator<T> | IterateeShorthand<T>;
+    order: 'asc' | 'desc';
+}
+
+/**
+ * `Filter` — cut here because it has its own bundle.
+ * Look `Filter` up in the bundle index for its full shape.
+ */
+interface Filter<T = any> {
+    [key: string]: unknown;
+}
+type FiltersMap = {
+    [key: string]: Filter<any> | undefined;
+};
+type OptionalFiltersMap = {
+    [key: string]: undefined;
+};
+
+type FiltersKey<F extends FiltersMap> = Partial<{
+    [P in keyof F]: string[] | undefined | null;
+}>;
+/**
+ * `ComputedQuery` — cut here because it has its own bundle.
+ * Look `ComputedQuery` up in the bundle index for its full shape.
+ */
+interface ComputedQuery<F = any> {
+    [key: string]: unknown;
+}
+interface ComputedQueryFull<F extends FiltersMap = OptionalFiltersMap> extends ComputedQuery<F> {
+    filtersKey: FiltersKey<F>;
+    nonPersistentFiltersKey: FiltersKey<F>;
+}
+
+interface KeyedItem<T> {
+    item: T;
+    key: string;
+    id: string;
+    pageIndex: number;
+    indexWithinPage: number;
+    index: number;
+}
+
+interface ActionMove<T> extends ActionMoveBase<T> {
+    filtersKeyHash: string;
+    query: ComputedQueryFull<{}>;
+}
+interface ActionMoveBase<T> {
+    moveId: string;
+    from: KeyedItem<T>;
+    after: KeyedItem<T> | null | undefined;
+    over: KeyedItem<T>;
+    isFromHandle: boolean;
+}
+
+/**
+ * `CollectionOptimisticActionsState` — you receive this, you don't construct it.
+ * An internal state object — reached through another state object, never built directly.
+ */
+declare class CollectionOptimisticActionsState<T = any> {
+    [key: string]: unknown;
+}
+
+/**
+ * `CollectionOptimisticProcessor` — you receive this, you don't construct it.
+ * An internal state object — reached through another state object, never built directly.
+ */
+declare class CollectionOptimisticProcessor<T = any, F = any> {
+    [key: string]: unknown;
+}
+
+/**
+ * `QueryResultSimulationDefault` — you receive this, you don't construct it.
+ * An internal state object — reached through another state object, never built directly.
+ */
+declare class QueryResultSimulationDefault<T = any, F = any> {
+    [key: string]: unknown;
+}
+
+interface MoveParams<T, R> extends OptimisticActionBasis {
+    /**
+     * Function to submit the move operation.
+     * @param params - The parameters for the move action.
+     */
+    submit?: (params: ActionMove<T>) => Promise<R>;
+    /**
+     * Snapshot of the collection before the move operation.
+     */
+    collectionSnapshot: {
+        [key: string]: string | number | undefined;
+    };
+}
+interface CollectionOptimisticActionsBaseParams<T, F extends FiltersMap> {
+    /**
+     * A function that simulates the filtering in the server.
+     * The function should return another function that accepts an item, and return a boolean that indicates whether the item passes the query filters or not.
+     * @param computedQuery - The computed query object.
+     * @external
+     */
+    readonly predicate?: (computedQuery: ComputedQuery<F>) => (item: T) => boolean;
+    /**
+     * A function that simulates the ordering of the items in the server.<br>
+     * The function should return a list of rules in the form of `{fieldName: string; order: 'asc' | 'desc';}` to order the items by
+     * @param computedQuery - The computed query object.
+     * @external
+     */
+    readonly orderBy?: (computedQuery: ComputedQuery<F>) => Order<T>[];
+    /**
+     * A function to retrieve the creation date of an item.
+     * @param item - The item.
+     * @external
+     */
+    readonly createdAt?: (item: T) => Date;
+    /**
+     * Time to wait before batching multiple `updateMany` calls into a single server call.
+     * @default 0
+     * @external
+     */
+    readonly batchWait?: number;
+    /**
+     * Indicates whether to refresh the current page without invalidating the cache.
+     * @external
+     */
+    readonly noInvalidate?: boolean;
+    /**
+     * Adds a namespace to the cache key.
+     * @external
+     */
+    readonly cacheNamespace?: string;
+    readonly sequences?: Map<string, CollectionOptimisticSequenceExecutor>;
+    readonly query?: QueryState<F>;
+}
+interface CollectionOptimisticActionsParams<T, F extends FiltersMap> extends CollectionOptimisticActionsBaseParams<T, F> {
+    /**
+     * The main collection to reflect changes into.
+     * @external
+     */
+    readonly collection: CollectionState<T, F>;
+    /**
+     * Additional collections to reflect changes into.
+     * @default undefined
+     * @external
+     */
+    readonly collections?: CollectionState<T, F>[];
+    /**
+     * Container holding patches cache and events emitter.
+     * @external
+     */
+    readonly container: {
+        patchesCache: Map<string, IObservableArray<OptimisticPatch<T>>>;
+        events: TypedEmitter<{
+            navigation: () => ModalLayoutProps | null | undefined;
+        }>;
+    };
+}
+declare class CollectionOptimisticActions<T, F extends FiltersMap> implements OptimisticActions<T> {
+    readonly collection: CollectionState<T, F>;
+    readonly query: QueryState<F>;
+    readonly collections: CollectionState<T, F>[];
+    readonly predicate: (computedQuery: ComputedQuery<F>) => (item: T) => boolean;
+    readonly orderBy: (computedQuery: ComputedQuery<F>) => Order<T>[];
+    readonly createdAt?: (item: T) => Date;
+    readonly events: TypedEmitter<{
+        reprocess: () => void;
+        updated: () => void;
+        refresh: (params: {
+            isStale: boolean;
+        }) => void;
+        unmount: () => void;
+        beforeResultUpdated: () => void;
+        dragAndDropSequenceError: (params: {
+            patches: OptimisticPatch<T>[];
+        }) => void;
+        dragAndDropSequenceRetry: (params: {
+            patches: OptimisticPatch<T>[];
+        }) => void;
+    }>;
+    readonly noInvalidate: boolean | undefined;
+    readonly state: CollectionOptimisticActionsState<T>;
+    readonly processors: CollectionOptimisticProcessor<T, F>[];
+    readonly executor: CollectionOptimisticExecutor<OptimisticPatch<T>>;
+    readonly sequences: Map<string, CollectionOptimisticSequenceExecutor>;
+    readonly resultSimulationDefault: QueryResultSimulationDefault<T, F>;
+    readonly reorderModeCanceledMessage = "REORDER_MODE_CANCELED";
+    _resumeNavigation: (() => void) | null;
+    _orderByMode: 'orders' | 'moves';
+    _commitMode: boolean;
+    constructor(params: CollectionOptimisticActionsParams<T, F>);
+    get _queryNames(): string[];
+    get hasRunningSequence(): boolean;
+    get pendingMovePatches(): OptimisticPatch<T>[];
+    rollback(patch: OptimisticPatch<T> | OptimisticPatch<T>[]): void;
+    private _clearPatch;
+    _clearPatchOnNextResultOrUnmount: (patch: OptimisticPatch<T>) => void;
+    pushPatchAndReprocess(patch: OptimisticPatch<T> | OptimisticPatch<T>[]): void;
+    replacePatchAndReprocess(newPatch: OptimisticPatch<T>, oldPatch: OptimisticPatch<T>): void;
+    createOne(item: T, params: CreateManyParams<T>): void;
+    createMany(items: T[], params: CreateManyParams<T>): void;
+    /**
+     * Updates multiple items in the collection.
+     * @param items - The items to update.
+     * @param params - Additional parameters for the update operation.
+     * @external
+     */
+    updateMany<R>(items: T[], params: UpdateManyParams<T, R>): void;
+    enqueueMovePatch<R>(optimisticPatch: OptimisticPatch<T>, params: MoveParams<T, R>): void;
+    move<R>(event: ActionMove<T>, params: MoveParams<T, R>): Promise<void>;
+    /**
+     * Updates a single item in the collection.
+     * @param item - The item to update.
+     * @param params - Additional parameters for the operation.
+     * @external
+     */
+    updateOne<R>(item: T, params: UpdateManyParams<T, R>): void;
+    /**
+     * > `updateAll(fn)` API is not recommended as it's not possible to calculate "optimistic total", prefer updateAll(patchObject) API if possible.
+     * Updates all items in the collection based on a function or a patch object.
+     * @param patchOrFn - A function or a patch object to apply to each item.
+     * @param params - Additional parameters for the operation.
+     */
+    updateAll<R>(patchOrFn: (item: T) => Partial<T>, params: UpdateAllParams<R>): void;
+    /**
+     * Updates all items in the collection based on a patch object.
+     * @param patch - A patch object to apply to each item.
+     * @param params - Additional parameters for the operation.
+     * @external
+     */
+    updateAll<R>(patch: Partial<T>, params: UpdateAllParams<R>): void;
+    /**
+     * Deletes multiple items from the collection.
+     * @param items - An array of items to delete.
+     * @param params - Additional parameters for the delete operation.
+     * @external
+     */
+    deleteMany<R>(items: T[], params: DeleteManyParams<T, R>): void;
+    /**
+     * Deletes a single item from the collection.
+     * @param item - The item to delete.
+     * @param params - Additional parameters for the operation.
+     * @external
+     */
+    deleteOne<R>(item: T, params: DeleteManyParams<T, R>): void;
+    /**
+     * Deletes all items from the collection.
+     * @param params - Additional parameters for the operation.
+     * @external
+     */
+    deleteAll<R>(params: UpdateAllParams<R>): void;
+    initCollection(collection: CollectionState<T, F>): () => void;
+    init(): () => void;
+    clear(): void;
+}
+
+export { CollectionOptimisticActions };
+export type { CollectionOptimisticActionsBaseParams, CollectionOptimisticActionsParams, MoveParams };

package/dist/dts-bundle/components/CollectionPage.d.ts

@@ -0,0 +1,43 @@
+import { PageProps } from '@wix/design-system';
+import React, { ReactNode } from 'react';
+
+/**
+ * `CollectionState` — you receive this, you don't construct it.
+ * Produced by `useFilterCollection()` (also `useStaticListFilterCollection()`, `useCollection()`, `createCollection()`).
+ */
+declare class CollectionState<T = any, F = any> {
+    [key: string]: unknown;
+}
+
+/**
+ * `Filter` — cut here because it has its own bundle.
+ * Look `Filter` up in the bundle index for its full shape.
+ */
+interface Filter<T = any> {
+    [key: string]: unknown;
+}
+type FiltersMap = {
+    [key: string]: Filter<any> | undefined;
+};
+
+interface CollectionPageProps<T, F extends FiltersMap> extends PageProps {
+    /**
+     * A collection state instance created with [useCollection](./?path=/story/common-hooks--usecollection)
+     * @external
+     */
+    state: CollectionState<T, F>;
+    children?: ReactNode;
+    /**
+     * Hide total items count
+     * @external
+     */
+    hideTotal?: boolean;
+}
+/**
+ * @deprecated Use [CollectionPage](./?path=%2Fstory%2Fbase-components-pages-collection-page--collectionpage) from
+ * `@wix/patterns/page`
+ */
+declare function CollectionPage<T, F extends FiltersMap = FiltersMap>({ children, state, hideTotal, ...rest }: CollectionPageProps<T, F>): React.JSX.Element;
+
+export { CollectionPage };
+export type { CollectionPageProps };

package/dist/dts-bundle/components/CollectionPremiumEmptyState.d.ts

@@ -0,0 +1,56 @@
+import React, { ReactNode, MouseEvent as MouseEvent$1 } from 'react';
+import { EmptyStateProps } from '@wix/design-system';
+
+interface EmptyStateBaseProps extends EmptyStateBasePrivateProps, Omit<Partial<EmptyStateProps>, 'title' | 'subtitle' | 'image'> {
+    /**
+     * Overrides the default title.
+     * @external
+     */
+    title: string;
+    /**
+     * Overrides the default subtitle.
+     * @external
+     */
+    subtitle: string;
+    /**
+     * Overrides the default image.
+     * Accepts a custom `ReactElement` or boolean value.
+     * Pass `false` to hide the default image.
+     * @external
+     */
+    image?: boolean | ReactNode;
+    children?: ReactNode;
+    cta?: ReactNode;
+    /**
+     * Adds another custom call to action button.
+     * Pass a [TextButton](https://www.docs.wixdesignsystem.com/?path=/story/components-actions--textbutton) component.
+     * @external
+     */
+    customCta?: ReactNode;
+}
+interface EmptyStateBasePrivateProps {
+    title: string;
+    subtitle: string;
+    cta?: ReactNode;
+    image?: string | ReactNode;
+}
+
+interface PremiumButtonProps {
+    onClick: (e: MouseEvent$1<HTMLButtonElement, MouseEvent>) => void;
+    text?: string;
+}
+
+interface CollectionPremiumEmptyStateProps extends Omit<Partial<EmptyStateBaseProps>, 'cta'> {
+    /**
+     * Configures the default call to action button.\
+     * `onClick`: Adds a callback for when the button is clicked. <br>
+     * `text`: Text of the button.
+     *  To render the default upgrade button, you must provide the `onClick` callback.
+     * @external
+     */
+    upgradeCta: PremiumButtonProps;
+}
+declare function CollectionPremiumEmptyState(props: CollectionPremiumEmptyStateProps): React.JSX.Element;
+
+export { CollectionPremiumEmptyState };
+export type { CollectionPremiumEmptyStateProps };

package/dist/dts-bundle/components/CollectionSearch.d.ts

@@ -0,0 +1,26 @@
+import { SearchProps } from '@wix/design-system';
+import React, { CSSProperties } from 'react';
+
+/**
+ * `Filter` — cut here because it has its own bundle.
+ * Look `Filter` up in the bundle index for its full shape.
+ */
+interface Filter<T = any> {
+    [key: string]: unknown;
+}
+type FiltersMap = {
+    [key: string]: Filter<any> | undefined;
+};
+
+interface CollectionSearchProps extends Partial<SearchProps> {
+    onSearchChange?: (value: string) => unknown;
+    onSearchClick?: () => unknown;
+    onSearchBlur?: (value: string) => unknown;
+    visibility?: CSSProperties['visibility'];
+}
+declare const CollectionSearch: (<T, F extends FiltersMap = FiltersMap>({ onSearchChange, onSearchClick, onSearchBlur, visibility, expandable, ...rest }: CollectionSearchProps) => React.JSX.Element) & {
+    displayName: string;
+};
+
+export { CollectionSearch };
+export type { CollectionSearchProps };

package/dist/dts-bundle/components/CollectionToolbarFilters.d.ts

@@ -0,0 +1,54 @@
+import React, { ReactElement, JSXElementConstructor, ReactNode } from 'react';
+
+/**
+ * `FilterProps` — cut here because it has its own bundle.
+ * Look `FilterProps` up in the bundle index for its full shape.
+ */
+interface FilterProps<V = any> {
+    [key: string]: unknown;
+}
+
+type FilterElement<V = any> = ReactElement<FilterProps<V>, JSXElementConstructor<FilterProps<V>>>;
+
+interface CollectionToolbarFiltersProps {
+    /**
+     * Number of filter controls to be rendered inside the table toolbar
+     */
+    inline?: 0 | 1 | 2 | 3;
+    /**
+     * A flag that indicates whether Patterns should use a new filters layout our not.
+     */
+    useNewFilters?: true;
+    maxInlineFilters?: number;
+    maxInlineLabels?: number;
+    /**
+     * Title of the filters panel
+     * @external
+     */
+    panelTitle?: string | ReactNode;
+    /**
+     * `React` children elements, that must accept [FilterProps](./?path=/story/features-filter-props--filterprops), such as:
+     * - [MultiSelectCheckboxFilter](./?path=/story/features-filter-components--multiselectcheckboxfilter)
+     * - [Custom Filters](./?path=/story/features-filter-factories--customfilter)
+     * @external
+     */
+    children: (FilterElement | undefined | boolean) | (FilterElement | undefined | boolean)[];
+    onPanelClearButtonClicked?: () => unknown;
+    onSearchAppliedFilterTagRemove?: (item: string) => unknown;
+    onSubToolbarClearButtonClicked?: () => unknown;
+    hideAppliedFiltersTagList?: boolean;
+}
+/**
+ * Filters that need the side panel rather than an inline slot — they are too
+ * tall or too interactive to sit in the toolbar. One of these among the inline
+ * filters forces the panel for all of them.
+ *
+ * Matched against `displayName`, so a component that wraps one of these has to
+ * declare its own name here; a wrapper with no `displayName` silently renders
+ * inline. See `ReferenceFieldFilter`.
+ */
+declare const SIDE_PANEL_FILTER_DISPLAY_NAMES: string[];
+declare function CollectionToolbarFilters(props: CollectionToolbarFiltersProps): React.JSX.Element;
+
+export { CollectionToolbarFilters, SIDE_PANEL_FILTER_DISPLAY_NAMES };
+export type { CollectionToolbarFiltersProps };