@factorialco/f0-react 1.294.0 → 1.295.0

package/dist/experimental.d.ts

@@ -1908,7 +1908,7 @@ export declare type DataSourceDefinition<R extends RecordType = RecordType, Filt
     /** Selectable items value under the checkbox column (undefined if not selectable) */
     selectable?: (item: R) => string | number | undefined;
     /** Default selected items */
-    defaultSelectedItems?: SelectedItemsState;
+    defaultSelectedItems?: SelectedItemsState<R>;
     /***** GROUPING ***************************************************/
     /** Grouping configuration */
     grouping?: Grouping;
@@ -2217,6 +2217,7 @@ declare const defaultTranslations: {
         readonly selected: {
             readonly singular: "Selected";
             readonly plural: "Selected";
+            readonly all: "All selected";
         };
     };
     readonly filters: {
@@ -2874,6 +2875,26 @@ declare interface F0IconProps extends SVGProps<SVGSVGElement>, VariantProps<type
     color?: "default" | "currentColor" | `#${string}` | Lowercase<NestedKeyOf<typeof f1Colors.icon>>;
 }
 
+/**
+ * Base props shared across all F0Select variants
+ */
+declare type F0SelectBaseProps<T extends string, R = unknown> = {
+    onChangeSelectedOption?: (option: F0SelectItemObject<T, ResolvedRecordType<R>> | undefined, checked: boolean) => void;
+    children?: React.ReactNode;
+    open?: boolean;
+    showSearchBox?: boolean;
+    searchBoxPlaceholder?: string;
+    onSearchChange?: (value: string) => void;
+    searchValue?: string;
+    onOpenChange?: (open: boolean) => void;
+    searchEmptyMessage?: string;
+    className?: string;
+    selectContentClassName?: string;
+    actions?: Action[];
+    /** Container element to render the portal content into */
+    portalContainer?: HTMLElement | null;
+};
+
 declare type F0SelectItemObject<T, R = unknown> = {
     type?: "item";
     value: T;
@@ -2897,42 +2918,43 @@ export { F0SelectItemProps as SelectItemProps }
 /**
  * Select component for choosing from a list of options.
  *
- * @template T - The type of the emitted  value
+ * @template T - The type of the emitted value
  * @template R - The type of the record/item data (used with data source)
- *
  */
-declare type F0SelectProps<T extends string, R = unknown> = {
-    onChangeSelectedOption?: (option: F0SelectItemObject<T, ResolvedRecordType<R>> | undefined, checked: boolean) => void;
-    children?: React.ReactNode;
-    open?: boolean;
-    showSearchBox?: boolean;
-    searchBoxPlaceholder?: string;
-    onSearchChange?: (value: string) => void;
-    searchValue?: string;
-    onOpenChange?: (open: boolean) => void;
-    searchEmptyMessage?: string;
-    className?: string;
-    selectContentClassName?: string;
-    actions?: Action[];
-    portalContainer?: HTMLElement | null;
-} & ({
+declare type F0SelectProps<T extends string, R = unknown> = F0SelectBaseProps<T, R> & // Single select not clearable
+({
     clearable?: false;
     multiple?: false;
     value?: T;
     defaultItem?: F0SelectItemObject<T, ResolvedRecordType<R>>;
     onChange?: (value: T, originalItem?: ResolvedRecordType<R> | undefined, option?: F0SelectItemObject<T, ResolvedRecordType<R>>) => void;
+    /** Callback for selection changes - provides full selection state for advanced use cases (e.g., "Select All" with exclusions) */
+    onSelectItems?: never;
 } | {
     clearable: true;
     multiple?: false;
     value?: T;
     defaultItem?: F0SelectItemObject<T, ResolvedRecordType<R>>;
     onChange?: (value: T, originalItem?: ResolvedRecordType<R> | undefined, option?: F0SelectItemObject<T, ResolvedRecordType<R>>) => void;
+    onSelectItems?: never;
 } | {
     multiple: true;
     clearable?: boolean;
     value?: T[];
     defaultItem?: F0SelectItemObject<T, ResolvedRecordType<R>>[];
     onChange?: (value: T[], originalItems: ResolvedRecordType<R>[], options: F0SelectItemObject<T, ResolvedRecordType<R>>[]) => void;
+    /**
+     * Callback for selection changes - provides full selection state including:
+     * - `status.allSelected`: true if "Select All" was used, "indeterminate" if some items deselected after Select All
+     * - `status.items`: Map of all items with their checked state
+     * - `filters`: Current applied filters
+     * - `selectedCount`: Total number of selected items
+     *
+     * Use this for "chunked" selection mode where you need to track:
+     * - When allSelected is true/indeterminate: excluded items are those with checked=false
+     * - When allSelected is false: included items are those with checked=true
+     */
+    onSelectItems?: OnSelectItemsCallback<ResolvedRecordType<R>, FiltersDefinition>;
 }) & ({
     source: DataSourceDefinition<ResolvedRecordType<R>, FiltersDefinition, SortingsDefinition, GroupingDefinition<ResolvedRecordType<R>>>;
     mapOptions: (item: ResolvedRecordType<R>) => F0SelectItemProps<T, ResolvedRecordType<R>>;
@@ -5210,10 +5232,13 @@ export declare type SelectedItems<T> = ReadonlyArray<T>;
 
 export declare type SelectedItemsDetailedStatus<R extends RecordType, Filters extends FiltersDefinition> = {
     allSelected: boolean | "indeterminate";
+    /** Status of items that have been loaded. Items not yet loaded won't appear here. */
     itemsStatus: ReadonlyArray<{
         item: R;
         checked: boolean;
     }>;
+    /** All selected item IDs, including those not yet loaded */
+    selectedIds: ReadonlyArray<SelectionId>;
     groupsStatus: Record<string, boolean>;
     filters: FiltersState<Filters>;
     selectedCount: number;
@@ -5222,18 +5247,23 @@ export declare type SelectedItemsDetailedStatus<R extends RecordType, Filters ex
 /**
  * Represents the selected items by id
  */
-export declare type SelectedItemsState = {
-    allSelected?: boolean | "indeterminate";
-    items?: ReadonlyArray<{
-        id: string;
-        checked: boolean;
-    }>;
-    groups?: ReadonlyArray<{
-        groupId: string;
-        checked: boolean;
-    }>;
+export declare type SelectedItemsState<R extends RecordType> = {
+    allSelected: boolean | "indeterminate";
+    items: Map<SelectedItemState<R>["id"], SelectedItemState<R>>;
+    groups: Map<SelectedState["id"], SelectedState>;
+};
+
+export declare type SelectedItemState<R extends RecordType> = SelectedState & {
+    item?: WithGroupId<R>;
 };
 
+export declare type SelectedState = {
+    id: SelectionId;
+    checked: boolean;
+};
+
+export declare type SelectionId = number | string;
+
 export declare type SelectQuestionOption = {
     id?: string;
     value: string;
@@ -6286,31 +6316,6 @@ declare global {
 }
 
 
-declare module "gridstack" {
-    interface GridStackWidget {
-        id?: string;
-        allowedSizes?: Array<{
-            w: number;
-            h: number;
-        }>;
-        renderFn?: () => React.ReactElement | null;
-        meta?: Record<string, unknown>;
-    }
-    interface GridStackNode {
-        id?: string;
-        w?: number;
-        h?: number;
-        x?: number;
-        y?: number;
-        allowedSizes?: Array<{
-            w: number;
-            h: number;
-        }>;
-        renderFn?: () => React.ReactElement | null;
-    }
-}
-
-
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
         aiBlock: {
@@ -6338,6 +6343,31 @@ declare module "@tiptap/core" {
 }
 
 
+declare module "gridstack" {
+    interface GridStackWidget {
+        id?: string;
+        allowedSizes?: Array<{
+            w: number;
+            h: number;
+        }>;
+        renderFn?: () => React.ReactElement | null;
+        meta?: Record<string, unknown>;
+    }
+    interface GridStackNode {
+        id?: string;
+        w?: number;
+        h?: number;
+        x?: number;
+        y?: number;
+        allowedSizes?: Array<{
+            w: number;
+            h: number;
+        }>;
+        renderFn?: () => React.ReactElement | null;
+    }
+}
+
+
 declare namespace Calendar {
     var displayName: string;
 }