tp-react-elements 1.3.2 → 1.3.4

package/dist/components/PaginatedGrid/GenericPaginatedGrid.esm.js

@@ -1,8 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState, useMemo } from 'react';
 import { useMaterialReactTable, MaterialReactTable } from 'material-react-table';
-import { keepPreviousData } from '../../node_modules/@tanstack/query-core/build/modern/utils.esm.js';
-import { useQuery } from '../../node_modules/@tanstack/react-query/build/modern/useQuery.esm.js';
+import { useQuery, keepPreviousData } from '@tanstack/react-query';
 import { Box, Tooltip, IconButton, Button, GlobalStyles, Typography, Select, MenuItem, CircularProgress } from '@mui/material';
 import RefreshIcon from '@mui/icons-material/Refresh';
 import FileDownloadIcon from '@mui/icons-material/FileDownload';
@@ -67,14 +66,59 @@ function GenericPaginatedGrid({ columns, fetchPage, queryKey, serverFilterDefs,
     });
     const rows = data?.data ?? [];
     const totalRecords = data?.totalRecords ?? 0;
+    // ── Strip custom props + auto-inject filterFn before passing to MRT ──────────
+    //
+    // `TPColumnDef` extends `MRT_ColumnDef` with `filterType` and `options`.
+    // MRT doesn't know these props, so we strip them here. We also inject the
+    // appropriate `filterFn` automatically so callers never have to write one.
+    const processedColumns = useMemo(() => {
+        return columns.map((col) => {
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            const { filterType, options, ...mrtCol } = col;
+            // Auto-inject filterFn only when the user hasn't already supplied one.
+            if (!mrtCol.filterFn && filterType) {
+                if (filterType === 'date') {
+                    // ISO date strings: "2026-05-05T00:00:00" → startsWith "2026-05-05"
+                    mrtCol.filterFn = (row, columnId, filterValue) => filterValue
+                        ? (row.getValue(columnId) ?? '').startsWith(filterValue)
+                        : true;
+                }
+                else if (filterType === 'select' || filterType === 'searchable-select') {
+                    // Exact-value match (avoids substring false positives)
+                    mrtCol.filterFn = (row, columnId, filterValue) => filterValue
+                        ? row.getValue(columnId) === filterValue
+                        : true;
+                }
+                // 'text' and 'number' use MRT's built-in client-side filtering
+            }
+            return mrtCol;
+        });
+    }, [columns]);
     // ── Derive column list for filter chip picker ──────────────────────────────
+    //
+    // A column is excluded from the "Column Filters" section of Manage Filters
+    // when ANY of the following are true:
+    //   1. It has no accessorKey (computed / display columns).
+    //   2. Its accessorKey is already handled by a server-side 'date' filter def.
+    //   3. Its MRT `enableColumnFilter` prop is explicitly set to `false` —
+    //      use this for numeric/computed columns that don't need a filter chip.
     const availableColumns = useMemo(() => {
         const serverManagedColKeys = new Set(serverFilterDefs
             .filter((d) => d.type === 'date')
             .map((d) => d.columnKey));
         return columns
-            .filter((c) => 'accessorKey' in c && c.accessorKey && !serverManagedColKeys.has(c.accessorKey))
-            .map((c) => ({ id: c.accessorKey, label: c.header }));
+            .filter((c) => 'accessorKey' in c &&
+            c.accessorKey &&
+            !serverManagedColKeys.has(c.accessorKey) &&
+            c.enableColumnFilter !== false)
+            .map((c) => ({
+            id: c.accessorKey,
+            label: c.header,
+            // Pass filterType directly from TPColumnDef (no meta unwrapping needed)
+            filterType: c.filterType,
+            // Map TPColumnDef.options → AvailableColumn.filterOptions
+            filterOptions: c.options,
+        }));
     }, [columns, serverFilterDefs]);
     // ── Handlers ───────────────────────────────────────────────────────────────
     const handleFilterValuesChange = (newValues) => {
@@ -109,7 +153,7 @@ function GenericPaginatedGrid({ columns, fetchPage, queryKey, serverFilterDefs,
         columnFilters.some((f) => f.value);
     // ── Table instance ─────────────────────────────────────────────────────────
     const table = useMaterialReactTable({
-        columns,
+        columns: processedColumns,
         data: rows,
         manualPagination: true,
         rowCount: totalRecords,

package/dist/components/PaginatedGrid/columns.d.ts

@@ -1,3 +1,3 @@
-import type { MRT_ColumnDef } from 'material-react-table';
+import type { TPColumnDef } from './types';
 import type { InvoiceDetail } from './types';
-export declare const invoiceColumns: MRT_ColumnDef<InvoiceDetail>[];
+export declare const invoiceColumns: TPColumnDef<InvoiceDetail>[];

package/dist/components/PaginatedGrid/types.d.ts

@@ -1,3 +1,64 @@
+import type { MRT_ColumnDef } from 'material-react-table';
+/**
+ * Filter chip variant shown in Manage Filters → Column Filters.
+ *
+ *  | Value               | Chip rendered             |
+ *  |---------------------|---------------------------|
+ *  | `'text'`            | Free-text input (default) |
+ *  | `'date'`            | Calendar date picker      |
+ *  | `'select'`          | Searchable option list    |
+ *  | `'searchable-select'` | Searchable option list  |
+ *  | `'number'`          | Numeric input             |
+ *
+ * Set `enableColumnFilter: false` to hide the column from Manage Filters
+ * entirely (e.g. for computed or numeric columns that don't need filtering).
+ */
+export type ColumnFilterType = 'text' | 'date' | 'select' | 'searchable-select' | 'number';
+/**
+ * Drop-in replacement for `MRT_ColumnDef` that adds top-level
+ * `filterType` and `options` so you never have to write `meta` blocks
+ * or custom `filterFn` — the grid handles both automatically.
+ *
+ * @example
+ * ```ts
+ * import type { TPColumnDef } from './types';
+ *
+ * const columns: TPColumnDef<MyRow>[] = [
+ *   // Date picker chip
+ *   { accessorKey: 'invoiceDate', header: 'Invoice Date', filterType: 'date' },
+ *
+ *   // Searchable option list chip
+ *   {
+ *     accessorKey: 'status',
+ *     header: 'Status',
+ *     filterType: 'searchable-select',
+ *     options: [
+ *       { label: 'Active',   value: 'A' },
+ *       { label: 'Inactive', value: 'I' },
+ *     ],
+ *   },
+ *
+ *   // Hidden from Manage Filters (numeric column)
+ *   { accessorKey: 'qty', header: 'Qty', enableColumnFilter: false },
+ * ];
+ * ```
+ */
+export type TPColumnDef<TData extends object = object> = MRT_ColumnDef<TData> & {
+    /**
+     * Which filter chip to show in Manage Filters → Column Filters.
+     * Omit (or set to `'text'`) for a plain text-input chip.
+     */
+    filterType?: ColumnFilterType;
+    /**
+     * Option pairs for `'select'` and `'searchable-select'` filter types.
+     * Each entry needs `label` (display text) and `value` (filter value sent).
+     */
+    options?: {
+        label: string;
+        value: string | number;
+        disable?: boolean;
+    }[];
+};
 export interface InvoiceDetail {
     Data_from: string;
     FINYEAR: string;

package/dist/index.d.ts

@@ -6,6 +6,7 @@ export { default as SessionTimeoutField } from './components/SessionTimeOut/Sess
 export { default as useFormValidatingContext } from './components/Form/FormConstants';
 export { default as MultiSelectFieldComponent } from './components/SelectField/MultiSelectFieldComponent';
 export { default as GenericPaginatedGrid } from './components/PaginatedGrid/GenericPaginatedGrid';
+export { default as SearchableSelect } from './components/FormComponents/Select/SearchableSelect';
 export { TPElementsProvider } from './auth/authContext';
 export { calculateTotalArrayValueTotal, checkIsDateIsBefore, findMenuHierarchy, getDesiredDate, getFormattedDate, getInitials, getUsernameFromEmail, handleDownloadReactTableDataExcel, lightenColor, } from './utils';
 export * as Utils from './utils';

package/dist/index.esm.css

@@ -1 +1 @@
-.m-form__input .prestashop-switch.switch{display:block;height:30px;position:relative;width:160px}.m-form__input .prestashop-switch.switch.stactv{display:block;height:30px;position:relative;width:162px}.prestashop-switch.switch{background-color:#eee;border:1px solid #ccc;border-radius:50px;-webkit-box-shadow:inset 0 1px 4px 1px rgba(0,0,0,.15);-moz-box-shadow:inset 0 1px 4px 1px rgba(0,0,0,.15);box-shadow:inset 0 1px 4px 1px rgba(0,0,0,.15);color:#333;text-align:center}.prestashop-switch.switch *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.m-form__input .prestashop-switch.switch *{outline:0!important}.m-form__input .prestashop-switch.switch input[type=radio]{line-height:normal;margin:4px 0 0;opacity:0;position:absolute}.m-form__input .prestashop-switch.switch label,.m-form__input .prestashop-switch.switch>span{display:inline-block;line-height:30px;max-width:100%;vertical-align:middle}.m-form__input .prestashop-switch.switch label{color:#bbb;cursor:pointer;float:left;font-size:11px;font-weight:400;height:100%;margin:0;position:relative;text-align:center;text-transform:uppercase;-webkit-transition:color .2s ease-out;-o-transition:color .2s ease-out;transition:color .2s ease-out;width:50%;z-index:2}.m-form__input .prestashop-switch.switch input:checked+label{color:#fff}.m-form__input .prestashop-switch.switch .slide-button{background-color:green;border:1px solid green;border-radius:50px;-webkit-box-shadow:inset -1px 0 green;-moz-box-shadow:inset 0 -1px 0 green;box-shadow:inset 0 -1px 0 green;color:#fff;display:block;height:100%;left:0;padding:0;position:absolute;top:0;-webkit-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out;width:50%;z-index:1}.m-form__input{align-items:center;display:flex}.m-form__input .prestashop-switch.switch input:last-of-type:checked~.slide-button{background-color:#ec5c29;border:1px solid #fb561c;-webkit-box-shadow:inset 0 -1px 0 #fb561c;-moz-box-shadow:inset 0 -1px 0 #fb561c;box-shadow:inset 0 -1px 0 #fb561c;left:50%}#list-component{background-color:#fff;max-height:200px;overflow:auto!important}#list-component #MuiScrol-listbox{max-height:none!important;overflow:visible}.css-k2lwa0,.css-svpvcz-MuiFormLabel-root-MuiInputLabel-root{background:#fff;font-size:14px!important}.rdrCalendarWrapper{background:#fff;box-sizing:border-box;display:inline-flex;flex-direction:column;-webkit-user-select:none;-moz-user-select:none;user-select:none}.rdrDateDisplay{display:flex;justify-content:space-between}.rdrDateDisplayItem{color:inherit;flex:1 1;text-align:center;width:0}.rdrDateDisplayItem+.rdrDateDisplayItem{margin-left:.833em}.rdrDateDisplayItem input{text-align:inherit}.rdrDateDisplayItem input:disabled{cursor:default}.rdrMonthAndYearWrapper{box-sizing:inherit;display:flex;justify-content:space-between}.rdrMonthAndYearPickers{align-items:center;display:flex;flex:1 1 auto;justify-content:center}.rdrNextPrevButton{box-sizing:inherit;cursor:pointer;outline:none}.rdrMonths{display:flex}.rdrMonthsVertical{flex-direction:column}.rdrMonthsHorizontal>div>div>div{display:flex;flex-direction:row}.rdrMonth{width:27.667em}.rdrWeekDays{display:flex}.rdrWeekDay{box-sizing:inherit;flex-basis:14.28571%;text-align:center}.rdrDays{display:flex;flex-wrap:wrap}.rdrInfiniteMonths{overflow:auto}.rdrDateRangeWrapper{-webkit-user-select:none;-moz-user-select:none;user-select:none}.rdrDateInput{position:relative}.rdrDateInput input{outline:none}.rdrDateInput .rdrWarning{color:red;font-size:1.6em;line-height:1.6em;position:absolute;right:.25em;top:0}.rdrDay{box-sizing:inherit;cursor:pointer;font:inherit;position:relative;width:14.28571%}.rdrDayNumber{display:block;position:relative}.rdrDayNumber span{color:#1d2429}.rdrDayDisabled{cursor:not-allowed}@supports (-ms-ime-align:auto){.rdrDay{flex-basis:14.285%!important}}.rdrEndEdge,.rdrInRange,.rdrSelected,.rdrStartEdge{pointer-events:none}.rdrDateRangePickerWrapper{display:inline-flex;-webkit-user-select:none;-moz-user-select:none;user-select:none}.rdrStaticRanges{display:flex;flex-direction:column}.rdrStaticRange{font-size:inherit}.rdrInputRange{display:flex}.rdrCalendarWrapper{color:#000;font-size:12px}.rdrDateDisplayWrapper{background-color:#eff2f7}.rdrDateDisplay{margin:.833em}.rdrDateDisplayItem{background-color:#fff;border:1px solid transparent;border-radius:4px;box-shadow:0 1px 2px 0 rgba(35,57,66,.21)}.rdrDateDisplayItem input{background:transparent;border:0;color:#849095;cursor:pointer;height:2.5em;line-height:2.5em;width:100%}.rdrDateDisplayItemActive{border-color:currentColor}.rdrDateDisplayItemActive input{color:#7d888d}.rdrMonthAndYearWrapper{align-items:center;height:60px;padding-top:10px}.rdrMonthAndYearPickers{font-weight:600}.rdrMonthAndYearPickers select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;background:url("data:image/svg+xml;utf8,<svg width='9px' height='6px' viewBox='0 0 9 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g id='Artboard' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' transform='translate(-636.000000, -171.000000)' fill-opacity='0.368716033'><g id='input' transform='translate(172.000000, 37.000000)' fill='%230E242F' fill-rule='nonzero'><g id='Group-9' transform='translate(323.000000, 127.000000)'><path d='M142.280245,7.23952813 C141.987305,6.92353472 141.512432,6.92361662 141.219585,7.23971106 C140.926739,7.5558055 140.926815,8.06821394 141.219755,8.38420735 L145.498801,13 L149.780245,8.38162071 C150.073185,8.0656273 150.073261,7.55321886 149.780415,7.23712442 C149.487568,6.92102998 149.012695,6.92094808 148.719755,7.23694149 L145.498801,10.7113732 L142.280245,7.23952813 Z' id='arrow'></path></g></g></g></svg>") no-repeat;background-position:right 8px center;border:0;border-radius:4px;color:#3e484f;cursor:pointer;outline:0;padding:10px 30px 10px 10px;text-align:center}.rdrMonthAndYearPickers select:hover{background-color:rgba(0,0,0,.07)}.rdrMonthPicker,.rdrYearPicker{margin:0 5px}.rdrNextPrevButton{background:#eff2f7;border:0;border-radius:5px;display:block;height:24px;margin:0 .833em;padding:0;width:24px}.rdrNextPrevButton:hover{background:#e1e7f0}.rdrNextPrevButton i{border-style:solid;display:block;height:0;margin:auto;padding:0;text-align:center;transform:translate(-3px);width:0}.rdrPprevButton i{border-color:transparent #34495e transparent transparent;border-width:4px 6px 4px 4px;transform:translate(-3px)}.rdrNextButton i{border-color:transparent transparent transparent #34495e;border-width:4px 4px 4px 6px;margin:0 0 0 7px;transform:translate(3px)}.rdrWeekDays{padding:0 .833em}.rdrMonth{padding:0 .833em 1.666em}.rdrMonth .rdrWeekDays{padding:0}.rdrMonths.rdrMonthsVertical .rdrMonth:first-child .rdrMonthName{display:none}.rdrWeekDay{color:#849095;font-weight:400;line-height:2.667em}.rdrDay{background:transparent;border:0;color:#1d2429;height:3em;line-height:3em;padding:0;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}.rdrDay:focus{outline:0}.rdrDayNumber{align-items:center;bottom:0;bottom:5px;display:flex;font-weight:300;justify-content:center;left:0;outline:0;position:absolute;right:0;top:0;top:5px}.rdrDayToday .rdrDayNumber span{font-weight:500}.rdrDayToday .rdrDayNumber span:after{background:#3d91ff;border-radius:2px;bottom:4px;content:"";height:2px;left:50%;position:absolute;transform:translate(-50%);width:18px}.rdrDayToday:not(.rdrDayPassive) .rdrEndEdge~.rdrDayNumber span:after,.rdrDayToday:not(.rdrDayPassive) .rdrInRange~.rdrDayNumber span:after,.rdrDayToday:not(.rdrDayPassive) .rdrSelected~.rdrDayNumber span:after,.rdrDayToday:not(.rdrDayPassive) .rdrStartEdge~.rdrDayNumber span:after{background:#fff}.rdrDay:not(.rdrDayPassive) .rdrEndEdge~.rdrDayNumber span,.rdrDay:not(.rdrDayPassive) .rdrInRange~.rdrDayNumber span,.rdrDay:not(.rdrDayPassive) .rdrSelected~.rdrDayNumber span,.rdrDay:not(.rdrDayPassive) .rdrStartEdge~.rdrDayNumber span{color:hsla(0,0%,100%,.85)}.rdrEndEdge,.rdrInRange,.rdrSelected,.rdrStartEdge{background:currentColor;bottom:5px;left:0;position:absolute;right:0;top:5px}.rdrSelected{left:2px;right:2px}.rdrStartEdge{border-bottom-left-radius:1.042em;border-top-left-radius:1.042em;left:2px}.rdrEndEdge{border-bottom-right-radius:1.042em;border-top-right-radius:1.042em;right:2px}.rdrSelected{border-radius:1.042em}.rdrDayStartOfMonth .rdrEndEdge,.rdrDayStartOfMonth .rdrInRange,.rdrDayStartOfWeek .rdrEndEdge,.rdrDayStartOfWeek .rdrInRange{border-bottom-left-radius:1.042em;border-top-left-radius:1.042em;left:2px}.rdrDayEndOfMonth .rdrInRange,.rdrDayEndOfMonth .rdrStartEdge,.rdrDayEndOfWeek .rdrInRange,.rdrDayEndOfWeek .rdrStartEdge{border-bottom-right-radius:1.042em;border-top-right-radius:1.042em;right:2px}.rdrDayStartOfMonth .rdrDayEndPreview,.rdrDayStartOfMonth .rdrDayInPreview,.rdrDayStartOfWeek .rdrDayEndPreview,.rdrDayStartOfWeek .rdrDayInPreview{border-bottom-left-radius:1.333em;border-left-width:1px;border-top-left-radius:1.333em;left:0}.rdrDayEndOfMonth .rdrDayInPreview,.rdrDayEndOfMonth .rdrDayStartPreview,.rdrDayEndOfWeek .rdrDayInPreview,.rdrDayEndOfWeek .rdrDayStartPreview{border-bottom-right-radius:1.333em;border-right-width:1px;border-top-right-radius:1.333em;right:0}.rdrDayEndPreview,.rdrDayInPreview,.rdrDayStartPreview{background:hsla(0,0%,100%,.09);border:0 solid;bottom:3px;left:0;pointer-events:none;position:absolute;right:0;top:3px;z-index:1}.rdrDayStartPreview{border-bottom-left-radius:1.333em;border-bottom-width:1px;border-left-width:1px;border-top-left-radius:1.333em;border-top-width:1px;left:0}.rdrDayInPreview{border-bottom-width:1px;border-top-width:1px}.rdrDayEndPreview{border-bottom-right-radius:1.333em;border-bottom-width:1px;border-right-width:1px;border-top-right-radius:1.333em;border-top-width:1px;right:2px;right:0}.rdrDefinedRangesWrapper{background:#fff;border-right:1px solid #eff2f7;font-size:12px;width:226px}.rdrDefinedRangesWrapper .rdrStaticRangeSelected{color:currentColor;font-weight:600}.rdrStaticRange{background:#fff;border:0;border-bottom:1px solid #eff2f7;cursor:pointer;display:block;outline:0;padding:0}.rdrStaticRange:focus .rdrStaticRangeLabel,.rdrStaticRange:hover .rdrStaticRangeLabel{background:#eff2f7}.rdrStaticRangeLabel{display:block;line-height:18px;outline:0;padding:10px 20px;text-align:left}.rdrInputRanges{padding:10px 0}.rdrInputRange{align-items:center;padding:5px 20px}.rdrInputRangeInput{border:1px solid #dee7eb;border-radius:4px;color:#6c767a;height:30px;line-height:30px;margin-right:10px;text-align:center;width:30px}.rdrInputRangeInput:focus,.rdrInputRangeInput:hover{border-color:#b4bfc4;color:#333;outline:0}.rdrCalendarWrapper:not(.rdrDateRangeWrapper) .rdrDayHovered .rdrDayNumber:after{background:transparent;border:1px solid;border-radius:1.333em;bottom:-2px;content:"";left:0;position:absolute;right:0;top:-2px}.rdrDayPassive{pointer-events:none}.rdrDayPassive .rdrDayNumber span{color:#d5dce0}.rdrDayPassive .rdrDayEndPreview,.rdrDayPassive .rdrDayInPreview,.rdrDayPassive .rdrDayStartPreview,.rdrDayPassive .rdrEndEdge,.rdrDayPassive .rdrInRange,.rdrDayPassive .rdrSelected,.rdrDayPassive .rdrStartEdge{display:none}.rdrDayDisabled{background-color:#f8f8f8}.rdrDayDisabled .rdrDayNumber span{color:#aeb9bf}.rdrDayDisabled .rdrDayEndPreview,.rdrDayDisabled .rdrDayInPreview,.rdrDayDisabled .rdrDayStartPreview,.rdrDayDisabled .rdrEndEdge,.rdrDayDisabled .rdrInRange,.rdrDayDisabled .rdrSelected,.rdrDayDisabled .rdrStartEdge{filter:grayscale(100%) opacity(60%)}.rdrMonthName{color:#849095;font-weight:600;padding:.833em;text-align:left}.rdrCalendarWrapper .rdrDay:not(.rdrDayPassive) .rdrEndEdge~.rdrDayNumber span,.rdrCalendarWrapper .rdrDay:not(.rdrDayPassive) .rdrInRange~.rdrDayNumber span,.rdrCalendarWrapper .rdrDay:not(.rdrDayPassive) .rdrSelected~.rdrDayNumber span,.rdrCalendarWrapper .rdrDay:not(.rdrDayPassive) .rdrStartEdge~.rdrDayNumber span{color:#fff!important}
+.m-form__input .prestashop-switch.switch{display:block;height:30px;position:relative;width:160px}.m-form__input .prestashop-switch.switch.stactv{display:block;height:30px;position:relative;width:162px}.prestashop-switch.switch{background-color:#eee;border:1px solid #ccc;border-radius:50px;-webkit-box-shadow:inset 0 1px 4px 1px rgba(0,0,0,.15);-moz-box-shadow:inset 0 1px 4px 1px rgba(0,0,0,.15);box-shadow:inset 0 1px 4px 1px rgba(0,0,0,.15);color:#333;text-align:center}.prestashop-switch.switch *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.m-form__input .prestashop-switch.switch *{outline:0!important}.m-form__input .prestashop-switch.switch input[type=radio]{line-height:normal;margin:4px 0 0;opacity:0;position:absolute}.m-form__input .prestashop-switch.switch label,.m-form__input .prestashop-switch.switch>span{display:inline-block;line-height:30px;max-width:100%;vertical-align:middle}.m-form__input .prestashop-switch.switch label{color:#bbb;cursor:pointer;float:left;font-size:11px;font-weight:400;height:100%;margin:0;position:relative;text-align:center;text-transform:uppercase;-webkit-transition:color .2s ease-out;-o-transition:color .2s ease-out;transition:color .2s ease-out;width:50%;z-index:2}.m-form__input .prestashop-switch.switch input:checked+label{color:#fff}.m-form__input .prestashop-switch.switch .slide-button{background-color:green;border:1px solid green;border-radius:50px;-webkit-box-shadow:inset -1px 0 green;-moz-box-shadow:inset 0 -1px 0 green;box-shadow:inset 0 -1px 0 green;color:#fff;display:block;height:100%;left:0;padding:0;position:absolute;top:0;-webkit-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out;width:50%;z-index:1}.m-form__input{align-items:center;display:flex}.m-form__input .prestashop-switch.switch input:last-of-type:checked~.slide-button{background-color:#ec5c29;border:1px solid #fb561c;-webkit-box-shadow:inset 0 -1px 0 #fb561c;-moz-box-shadow:inset 0 -1px 0 #fb561c;box-shadow:inset 0 -1px 0 #fb561c;left:50%}#list-component{background-color:#fff;max-height:200px;overflow:auto!important}#list-component #MuiScrol-listbox{max-height:none!important;overflow:visible}

package/dist/index.esm.js

@@ -6,6 +6,7 @@ export { default as SessionTimeoutField } from './components/SessionTimeOut/Sess
 export { default as useFormValidatingContext } from './components/Form/FormConstants.esm.js';
 export { default as MultiSelectFieldComponent } from './components/SelectField/MultiSelectFieldComponent.esm.js';
 export { default as GenericPaginatedGrid } from './components/PaginatedGrid/GenericPaginatedGrid.esm.js';
+export { default as SearchableSelect } from './components/FormComponents/Select/SearchableSelect.esm.js';
 export { TPElementsProvider } from './auth/authContext.esm.js';
 import * as index$1 from './utils/index.esm.js';
 export { index$1 as Utils };

package/dist/node_modules/prop-types/index.esm.js

@@ -1,4 +1,4 @@
-import { __module as propTypes } from '../../_virtual/index.esm10.js';
+import { __module as propTypes } from '../../_virtual/index.esm9.js';
 import { __require as requireReactIs } from './node_modules/react-is/index.esm.js';
 import { __require as requireFactoryWithTypeCheckers } from './factoryWithTypeCheckers.esm.js';
 import { __require as requireFactoryWithThrowingShims } from './factoryWithThrowingShims.esm.js';

package/dist/node_modules/react-date-range/dist/accessibility/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as accessibility } from '../../../../_virtual/index.esm9.js';
+import { __exports as accessibility } from '../../../../_virtual/index.esm10.js';
 import { __require as requirePropTypes } from '../../../prop-types/index.esm.js';
 
 var hasRequiredAccessibility;

package/dist/node_modules/react-date-range/dist/components/Calendar/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as Calendar } from '../../../../../_virtual/index.esm5.js';
+import { __exports as Calendar } from '../../../../../_virtual/index.esm7.js';
 import React__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireDayCell } from '../DayCell/index.esm.js';

package/dist/node_modules/react-date-range/dist/components/DateRange/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as DateRange } from '../../../../../_virtual/index.esm4.js';
+import { __exports as DateRange } from '../../../../../_virtual/index.esm5.js';
 import React__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireCalendar } from '../Calendar/index.esm.js';

package/dist/node_modules/react-date-range/dist/components/DefinedRange/index.esm.js

@@ -1,4 +1,4 @@
-import { __exports as DefinedRange } from '../../../../../_virtual/index.esm7.js';
+import { __exports as DefinedRange } from '../../../../../_virtual/index.esm4.js';
 import React__default from 'react';
 import { __require as requirePropTypes } from '../../../../prop-types/index.esm.js';
 import { __require as requireStyles } from '../../styles.esm.js';

package/dist/utils/Interface/FormInterface.d.ts

@@ -11,7 +11,7 @@ export interface TextFieldInputProps {
 export interface FormSectionPropsItem {
     name: string;
     label: string;
-    inputType: 'text' | 'password' | 'number' | 'select' | 'autocomplete-select' | 'autocomplete-multi-select' | 'single-select-search' | 'datepicker' | 'datetimepicker' | 'multiselect' | 'select-v2' | 'basic-select' | 'decimal' | 'alpha-numerical' | 'yearpicker' | 'dateRangePicker' | 'monthpicker' | 'multiselect' | 'file' | 'multifile' | 'multifile-with-preview' | 'textarea' | 'phoneNumber' | 'pincode' | 'email' | 'toggleSwitch' | 'rich-text-editor' | 'multiEmail' | 'timepicker' | 'checkbox-group' | 'radio-group' | 'checkbox' | 'custom' | 'input-select' | 'date-range-picker' | 'multiselect-table' | '';
+    inputType: 'text' | 'password' | 'number' | 'select' | 'autocomplete-select' | 'autocomplete-multi-select' | 'single-select-search' | 'datepicker' | 'datetimepicker' | 'multiselect' | 'select-v2' | 'basic-select' | 'searchable-select' | 'decimal' | 'alpha-numerical' | 'yearpicker' | 'dateRangePicker' | 'monthpicker' | 'multiselect' | 'file' | 'multifile' | 'multifile-with-preview' | 'textarea' | 'phoneNumber' | 'pincode' | 'email' | 'toggleSwitch' | 'rich-text-editor' | 'multiEmail' | 'timepicker' | 'checkbox-group' | 'radio-group' | 'checkbox' | 'custom' | 'input-select' | 'date-range-picker' | 'multiselect-table' | '';
     options?: OptionsProps[];
     required?: boolean;
     errorMessage?: string;

package/dist/utils/rdrStyles.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Call this hook at the top of any component that renders a `<DateRange />` calendar
+ * from `react-date-range`.  The styles are injected once into `document.head` and
+ * never removed (the injection is idempotent — safe to call from multiple components).
+ *
+ * @example
+ * const MyCalendarChip = () => {
+ *   useRdrStyles();
+ *   return <DateRange ... />;
+ * };
+ */
+export declare function useRdrStyles(): void;

package/dist/utils/rdrStyles.esm.js

@@ -0,0 +1,180 @@
+import { useEffect } from 'react';
+
+/**
+ * react-date-range CSS injected as a JavaScript string — NOT as a CSS import.
+ *
+ * WHY THIS FILE EXISTS
+ * --------------------
+ * Importing `react-date-range/dist/styles.css` and `theme/default.css` directly
+ * in the component source causes rollup-plugin-postcss (extract: true) to bundle
+ * those rules into the library's extracted `dist/index.css`.  When a consumer
+ * app imports that CSS file they get the react-date-range rules applied globally,
+ * which can interfere with the consumer's own MUI dropdowns and date-pickers.
+ *
+ * Instead we ship the CSS as a JavaScript string and inject a single <style> tag
+ * the first time any DateRange calendar is rendered.  This means:
+ *   • The CSS is NOT in the extracted CSS bundle.
+ *   • The CSS IS present at runtime (injected when the component mounts).
+ *   • The CSS only affects elements with react-date-range's own `.rdr*` class names,
+ *     so it cannot conflict with MUI or any other library.
+ *
+ * USAGE
+ * -----
+ * Call `useRdrStyles()` at the top of any component that renders <DateRange />.
+ * The injection is idempotent — subsequent calls are no-ops.
+ */
+const STYLE_ID = 'tp-rdr-styles';
+/* ─── Combined CSS from react-date-range ──────────────────────────────────── */
+/* Source: react-date-range/dist/styles.css + theme/default.css v2.0.1        */
+const RDR_CSS = `
+/* ── react-date-range/dist/styles.css ── */
+.rdrCalendarWrapper{box-sizing:border-box;background:#ffffff;display:inline-flex;flex-direction:column;-webkit-user-select:none;-moz-user-select:none;user-select:none}
+.rdrDateDisplay{display:flex;justify-content:space-between}
+.rdrDateDisplayItem{flex:1 1;width:0;text-align:center;color:inherit}
+.rdrDateDisplayItem+.rdrDateDisplayItem{margin-left:.833em}
+.rdrDateDisplayItem input{text-align:inherit}
+.rdrDateDisplayItem input:disabled{cursor:default}
+.rdrDateDisplayItemActive{}
+.rdrMonthAndYearWrapper{box-sizing:inherit;display:flex;justify-content:space-between}
+.rdrMonthAndYearPickers{flex:1 1 auto;display:flex;justify-content:center;align-items:center}
+.rdrMonthPicker{}
+.rdrYearPicker{}
+.rdrNextPrevButton{box-sizing:inherit;cursor:pointer;outline:none}
+.rdrPprevButton{}
+.rdrNextButton{}
+.rdrMonths{display:flex}
+.rdrMonthsVertical{flex-direction:column}
+.rdrMonthsHorizontal>div>div>div{display:flex;flex-direction:row}
+.rdrMonth{width:27.667em}
+.rdrWeekDays{display:flex}
+.rdrWeekDay{flex-basis:calc(100% / 7);box-sizing:inherit;text-align:center}
+.rdrDays{display:flex;flex-wrap:wrap}
+.rdrDateDisplayWrapper{}
+.rdrMonthName{}
+.rdrInfiniteMonths{overflow:auto}
+.rdrDateRangeWrapper{-webkit-user-select:none;-moz-user-select:none;user-select:none}
+.rdrDateInput{position:relative}
+.rdrDateInput input{outline:none}
+.rdrDateInput .rdrWarning{position:absolute;font-size:1.6em;line-height:1.6em;top:0;right:.25em;color:#FF0000}
+.rdrDay{box-sizing:inherit;width:calc(100% / 7);position:relative;font:inherit;cursor:pointer}
+.rdrDayNumber{display:block;position:relative}
+.rdrDayNumber span{color:#1d2429}
+.rdrDayDisabled{cursor:not-allowed}
+@supports (-ms-ime-align:auto){.rdrDay{flex-basis:14.285% !important}}
+.rdrSelected,.rdrInRange,.rdrStartEdge,.rdrEndEdge{pointer-events:none}
+.rdrInRange{}
+.rdrDayStartPreview,.rdrDayInPreview,.rdrDayEndPreview{pointer-events:none}
+.rdrDayHovered{}
+.rdrDayActive{}
+.rdrDateRangePickerWrapper{display:inline-flex;-webkit-user-select:none;-moz-user-select:none;user-select:none}
+.rdrDefinedRangesWrapper{}
+.rdrStaticRanges{display:flex;flex-direction:column}
+.rdrStaticRange{font-size:inherit}
+.rdrStaticRangeLabel{}
+.rdrInputRanges{}
+.rdrInputRange{display:flex}
+.rdrInputRangeInput{}
+
+/* ── react-date-range/dist/theme/default.css ── */
+.rdrCalendarWrapper{color:#000000;font-size:12px}
+.rdrDateDisplayWrapper{background-color:rgb(239,242,247)}
+.rdrDateDisplay{margin:.833em}
+.rdrDateDisplayItem{border-radius:4px;background-color:rgb(255,255,255);box-shadow:0 1px 2px 0 rgba(35,57,66,.21);border:1px solid transparent}
+.rdrDateDisplayItem input{cursor:pointer;height:2.5em;line-height:2.5em;border:0;background:transparent;width:100%;color:#849095}
+.rdrDateDisplayItemActive{border-color:currentColor}
+.rdrDateDisplayItemActive input{color:#7d888d}
+.rdrMonthAndYearWrapper{align-items:center;height:60px;padding-top:10px}
+.rdrMonthAndYearPickers{font-weight:600}
+.rdrMonthAndYearPickers select{-moz-appearance:none;appearance:none;-webkit-appearance:none;border:0;background:transparent;padding:10px 30px 10px 10px;border-radius:4px;outline:0;color:#3e484f;background:url("data:image/svg+xml;utf8,<svg width='9px' height='6px' viewBox='0 0 9 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g id='Artboard' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' transform='translate(-636.000000, -171.000000)' fill-opacity='0.368716033'><g id='input' transform='translate(172.000000, 37.000000)' fill='%230E242F' fill-rule='nonzero'><g id='Group-9' transform='translate(323.000000, 127.000000)'><path d='M142.280245,7.23952813 C141.987305,6.92353472 141.512432,6.92361662 141.219585,7.23971106 C140.926739,7.5558055 140.926815,8.06821394 141.219755,8.38420735 L145.498801,13 L149.780245,8.38162071 C150.073185,8.0656273 150.073261,7.55321886 149.780415,7.23712442 C149.487568,6.92102998 149.012695,6.92094808 148.719755,7.23694149 L145.498801,10.7113732 L142.280245,7.23952813 Z' id='arrow'></path></g></g></g></svg>") no-repeat;background-position:right 8px center;cursor:pointer;text-align:center}
+.rdrMonthAndYearPickers select:hover{background-color:rgba(0,0,0,.07)}
+.rdrMonthPicker,.rdrYearPicker{margin:0 5px}
+.rdrNextPrevButton{display:block;width:24px;height:24px;margin:0 .833em;padding:0;border:0;border-radius:5px;background:#EFF2F7}
+.rdrNextPrevButton:hover{background:#E1E7F0}
+.rdrNextPrevButton i{display:block;width:0;height:0;padding:0;text-align:center;border-style:solid;margin:auto;transform:translate(-3px,0)}
+.rdrPprevButton i{border-width:4px 6px 4px 4px;border-color:transparent rgb(52,73,94) transparent transparent;transform:translate(-3px,0)}
+.rdrNextButton i{margin:0 0 0 7px;border-width:4px 4px 4px 6px;border-color:transparent transparent transparent rgb(52,73,94);transform:translate(3px,0)}
+.rdrWeekDays{padding:0 .833em}
+.rdrMonth{padding:0 .833em 1.666em .833em}
+.rdrMonth .rdrWeekDays{padding:0}
+.rdrMonths.rdrMonthsVertical .rdrMonth:first-child .rdrMonthName{display:none}
+.rdrWeekDay{font-weight:400;line-height:2.667em;color:rgb(132,144,149)}
+.rdrDay{background:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none;border:0;padding:0;line-height:3em;height:3em;text-align:center;color:#1d2429}
+.rdrDay:focus{outline:0}
+.rdrDayNumber{outline:0;font-weight:300;position:absolute;left:0;right:0;top:5px;bottom:5px;display:flex;align-items:center;justify-content:center}
+.rdrDayToday .rdrDayNumber span{font-weight:500}
+.rdrDayToday .rdrDayNumber span:after{content:'';position:absolute;bottom:4px;left:50%;transform:translate(-50%,0);width:18px;height:2px;border-radius:2px;background:#3d91ff}
+.rdrDayToday:not(.rdrDayPassive) .rdrInRange~.rdrDayNumber span:after,.rdrDayToday:not(.rdrDayPassive) .rdrStartEdge~.rdrDayNumber span:after,.rdrDayToday:not(.rdrDayPassive) .rdrEndEdge~.rdrDayNumber span:after,.rdrDayToday:not(.rdrDayPassive) .rdrSelected~.rdrDayNumber span:after{background:#fff}
+.rdrDay:not(.rdrDayPassive) .rdrInRange~.rdrDayNumber span,.rdrDay:not(.rdrDayPassive) .rdrStartEdge~.rdrDayNumber span,.rdrDay:not(.rdrDayPassive) .rdrEndEdge~.rdrDayNumber span,.rdrDay:not(.rdrDayPassive) .rdrSelected~.rdrDayNumber span{color:rgba(255,255,255,.85)}
+.rdrSelected,.rdrInRange,.rdrStartEdge,.rdrEndEdge{background:currentColor;position:absolute;top:5px;left:0;right:0;bottom:5px}
+.rdrSelected{left:2px;right:2px}
+.rdrInRange{}
+.rdrStartEdge{border-top-left-radius:1.042em;border-bottom-left-radius:1.042em;left:2px}
+.rdrEndEdge{border-top-right-radius:1.042em;border-bottom-right-radius:1.042em;right:2px}
+.rdrSelected{border-radius:1.042em}
+.rdrDayStartOfMonth .rdrInRange,.rdrDayStartOfMonth .rdrEndEdge,.rdrDayStartOfWeek .rdrInRange,.rdrDayStartOfWeek .rdrEndEdge{border-top-left-radius:1.042em;border-bottom-left-radius:1.042em;left:2px}
+.rdrDayEndOfMonth .rdrInRange,.rdrDayEndOfMonth .rdrStartEdge,.rdrDayEndOfWeek .rdrInRange,.rdrDayEndOfWeek .rdrStartEdge{border-top-right-radius:1.042em;border-bottom-right-radius:1.042em;right:2px}
+.rdrDayStartOfMonth .rdrDayInPreview,.rdrDayStartOfMonth .rdrDayEndPreview,.rdrDayStartOfWeek .rdrDayInPreview,.rdrDayStartOfWeek .rdrDayEndPreview{border-top-left-radius:1.333em;border-bottom-left-radius:1.333em;border-left-width:1px;left:0}
+.rdrDayEndOfMonth .rdrDayInPreview,.rdrDayEndOfMonth .rdrDayStartPreview,.rdrDayEndOfWeek .rdrDayInPreview,.rdrDayEndOfWeek .rdrDayStartPreview{border-top-right-radius:1.333em;border-bottom-right-radius:1.333em;border-right-width:1px;right:0}
+.rdrDayStartPreview,.rdrDayInPreview,.rdrDayEndPreview{background:rgba(255,255,255,.09);position:absolute;top:3px;left:0;right:0;bottom:3px;pointer-events:none;border:0 solid currentColor;z-index:1}
+.rdrDayStartPreview{border-top-width:1px;border-left-width:1px;border-bottom-width:1px;border-top-left-radius:1.333em;border-bottom-left-radius:1.333em;left:0}
+.rdrDayInPreview{border-top-width:1px;border-bottom-width:1px}
+.rdrDayEndPreview{border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-top-right-radius:1.333em;border-bottom-right-radius:1.333em;right:0}
+.rdrDefinedRangesWrapper{font-size:12px;width:226px;border-right:solid 1px #eff2f7;background:#fff}
+.rdrDefinedRangesWrapper .rdrStaticRangeSelected{color:currentColor;font-weight:600}
+.rdrStaticRange{border:0;cursor:pointer;display:block;outline:0;border-bottom:1px solid #eff2f7;padding:0;background:#fff}
+.rdrStaticRange:hover .rdrStaticRangeLabel,.rdrStaticRange:focus .rdrStaticRangeLabel{background:#eff2f7}
+.rdrStaticRangeLabel{display:block;outline:0;line-height:18px;padding:10px 20px;text-align:left}
+.rdrInputRanges{padding:10px 0}
+.rdrInputRange{align-items:center;padding:5px 20px}
+.rdrInputRangeInput{width:30px;height:30px;line-height:30px;border-radius:4px;text-align:center;border:solid 1px rgb(222,231,235);margin-right:10px;color:rgb(108,118,122)}
+.rdrInputRangeInput:focus,.rdrInputRangeInput:hover{border-color:rgb(180,191,196);outline:0;color:#333}
+.rdrCalendarWrapper:not(.rdrDateRangeWrapper) .rdrDayHovered .rdrDayNumber:after{content:'';border:1px solid currentColor;border-radius:1.333em;position:absolute;top:-2px;bottom:-2px;left:0;right:0;background:transparent}
+.rdrDayPassive{pointer-events:none}
+.rdrDayPassive .rdrDayNumber span{color:#d5dce0}
+.rdrDayPassive .rdrInRange,.rdrDayPassive .rdrStartEdge,.rdrDayPassive .rdrEndEdge,.rdrDayPassive .rdrSelected,.rdrDayPassive .rdrDayStartPreview,.rdrDayPassive .rdrDayInPreview,.rdrDayPassive .rdrDayEndPreview{display:none}
+.rdrDayDisabled{background-color:rgb(248,248,248)}
+.rdrDayDisabled .rdrDayNumber span{color:#aeb9bf}
+.rdrDayDisabled .rdrInRange,.rdrDayDisabled .rdrStartEdge,.rdrDayDisabled .rdrEndEdge,.rdrDayDisabled .rdrSelected,.rdrDayDisabled .rdrDayStartPreview,.rdrDayDisabled .rdrDayInPreview,.rdrDayDisabled .rdrDayEndPreview{filter:grayscale(100%) opacity(60%)}
+.rdrMonthName{text-align:left;font-weight:600;color:#849095;padding:.833em}
+
+/* ── DateRangePicker.scss override (compiled) ── */
+.rdrCalendarWrapper .rdrDay:not(.rdrDayPassive) .rdrInRange~.rdrDayNumber span,
+.rdrCalendarWrapper .rdrDay:not(.rdrDayPassive) .rdrStartEdge~.rdrDayNumber span,
+.rdrCalendarWrapper .rdrDay:not(.rdrDayPassive) .rdrEndEdge~.rdrDayNumber span,
+.rdrCalendarWrapper .rdrDay:not(.rdrDayPassive) .rdrSelected~.rdrDayNumber span{color:#fff !important}
+`;
+/* ─── Singleton injection ─────────────────────────────────────────────────── */
+let _injected = false;
+function injectRdrStyles() {
+    if (_injected)
+        return;
+    if (typeof document === 'undefined')
+        return;
+    if (document.getElementById(STYLE_ID)) {
+        _injected = true;
+        return;
+    }
+    const style = document.createElement('style');
+    style.id = STYLE_ID;
+    style.textContent = RDR_CSS;
+    document.head.appendChild(style);
+    _injected = true;
+}
+/**
+ * Call this hook at the top of any component that renders a `<DateRange />` calendar
+ * from `react-date-range`.  The styles are injected once into `document.head` and
+ * never removed (the injection is idempotent — safe to call from multiple components).
+ *
+ * @example
+ * const MyCalendarChip = () => {
+ *   useRdrStyles();
+ *   return <DateRange ... />;
+ * };
+ */
+function useRdrStyles() {
+    useEffect(() => {
+        injectRdrStyles();
+    }, []);
+}
+
+export { useRdrStyles };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tp-react-elements",
-  "version": "1.3.2",
+  "version": "1.3.4",
   "private": false,
   "type": "module",
   "description": "React form components library built with React Hook Form and Yup",
@@ -81,6 +81,7 @@
     "prepublishOnly": "npm run build:lib"
   },
   "peerDependencies": {
+    "@tanstack/react-query": ">=5.0.0 <6.0.0",
     "@emotion/react": ">=11.14.0 <13.0.0",
     "@emotion/styled": ">=11.14.1 <13.0.0",
     "@hookform/error-message": ">=2.0.1 <3.0.0",
@@ -102,6 +103,9 @@
     "yup": ">=1.7.0 <2.0.0"
   },
   "peerDependenciesMeta": {
+    "@tanstack/react-query": {
+      "optional": true
+    },
     "react-idle-timer": {
       "optional": true
     },

package/dist/node_modules/@tanstack/query-core/build/modern/environmentManager.esm.js

@@ -1,22 +0,0 @@
-import { isServer } from './utils.esm.js';
-
-// src/environmentManager.ts
-var environmentManager = /* @__PURE__ */ (() => {
-  let isServerFn = () => isServer;
-  return {
-    /**
-     * Returns whether the current runtime should be treated as a server environment.
-     */
-    isServer() {
-      return isServerFn();
-    },
-    /**
-     * Overrides the server check globally.
-     */
-    setIsServer(isServerValue) {
-      isServerFn = isServerValue;
-    }
-  };
-})();
-
-export { environmentManager };

package/dist/node_modules/@tanstack/query-core/build/modern/focusManager.esm.js

@@ -1,65 +0,0 @@
-import { Subscribable } from './subscribable.esm.js';
-
-// src/focusManager.ts
-var FocusManager = class extends Subscribable {
-  #focused;
-  #cleanup;
-  #setup;
-  constructor() {
-    super();
-    this.#setup = (onFocus) => {
-      if (typeof window !== "undefined" && window.addEventListener) {
-        const listener = () => onFocus();
-        window.addEventListener("visibilitychange", listener, false);
-        return () => {
-          window.removeEventListener("visibilitychange", listener);
-        };
-      }
-      return;
-    };
-  }
-  onSubscribe() {
-    if (!this.#cleanup) {
-      this.setEventListener(this.#setup);
-    }
-  }
-  onUnsubscribe() {
-    if (!this.hasListeners()) {
-      this.#cleanup?.();
-      this.#cleanup = void 0;
-    }
-  }
-  setEventListener(setup) {
-    this.#setup = setup;
-    this.#cleanup?.();
-    this.#cleanup = setup((focused) => {
-      if (typeof focused === "boolean") {
-        this.setFocused(focused);
-      } else {
-        this.onFocus();
-      }
-    });
-  }
-  setFocused(focused) {
-    const changed = this.#focused !== focused;
-    if (changed) {
-      this.#focused = focused;
-      this.onFocus();
-    }
-  }
-  onFocus() {
-    const isFocused = this.isFocused();
-    this.listeners.forEach((listener) => {
-      listener(isFocused);
-    });
-  }
-  isFocused() {
-    if (typeof this.#focused === "boolean") {
-      return this.#focused;
-    }
-    return globalThis.document?.visibilityState !== "hidden";
-  }
-};
-var focusManager = new FocusManager();
-
-export { FocusManager, focusManager };

package/dist/node_modules/@tanstack/query-core/build/modern/notifyManager.esm.js

@@ -1,83 +0,0 @@
-import { systemSetTimeoutZero } from './timeoutManager.esm.js';
-
-// src/notifyManager.ts
-var defaultScheduler = systemSetTimeoutZero;
-function createNotifyManager() {
-  let queue = [];
-  let transactions = 0;
-  let notifyFn = (callback) => {
-    callback();
-  };
-  let batchNotifyFn = (callback) => {
-    callback();
-  };
-  let scheduleFn = defaultScheduler;
-  const schedule = (callback) => {
-    if (transactions) {
-      queue.push(callback);
-    } else {
-      scheduleFn(() => {
-        notifyFn(callback);
-      });
-    }
-  };
-  const flush = () => {
-    const originalQueue = queue;
-    queue = [];
-    if (originalQueue.length) {
-      scheduleFn(() => {
-        batchNotifyFn(() => {
-          originalQueue.forEach((callback) => {
-            notifyFn(callback);
-          });
-        });
-      });
-    }
-  };
-  return {
-    batch: (callback) => {
-      let result;
-      transactions++;
-      try {
-        result = callback();
-      } finally {
-        transactions--;
-        if (!transactions) {
-          flush();
-        }
-      }
-      return result;
-    },
-    /**
-     * All calls to the wrapped function will be batched.
-     */
-    batchCalls: (callback) => {
-      return (...args) => {
-        schedule(() => {
-          callback(...args);
-        });
-      };
-    },
-    schedule,
-    /**
-     * Use this method to set a custom notify function.
-     * This can be used to for example wrap notifications with `React.act` while running tests.
-     */
-    setNotifyFunction: (fn) => {
-      notifyFn = fn;
-    },
-    /**
-     * Use this method to set a custom function to batch notifications together into a single tick.
-     * By default React Query will use the batch function provided by ReactDOM or React Native.
-     */
-    setBatchNotifyFunction: (fn) => {
-      batchNotifyFn = fn;
-    },
-    setScheduler: (fn) => {
-      scheduleFn = fn;
-    }
-  };
-}
-var notifyManager = createNotifyManager();
-
-export { createNotifyManager, defaultScheduler, notifyManager };