@solidxai/core-ui 0.1.9-beta.2 → 0.1.9-beta.20

package/dist/components/core/common/SolidAccountSettings/SolidNotifications.tsx

@@ -1,30 +1,25 @@
-import { useEffect, useState } from "react";
+import { useEffect } from "react";
+import { useDispatch } from "react-redux";
 import { useFormik } from "formik";
 import { ERROR_MESSAGES } from "../../../../constants/error-messages";
 import { useBulkUpdateSolidUserSettingsMutation, useGetSolidSettingsQuery } from "../../../../redux/api/solidSettingsApi";
+import { showToast } from "../../../../redux/features/toastSlice";
 import { SolidButton } from "../../../shad-cn-ui/SolidButton";
 import styles from "./SolidAccountSettings.module.css";
 import { getSettingsMap } from "../../../../helpers/settingsPayload";
 
-type ToastState = {
-  id: number;
-  severity: "success" | "error" | "info" | "warn";
-  summary: string;
-  detail: string;
-} | null;
-
 export const SolidNotifications = () => {
+  const dispatch = useDispatch();
   const { data: solidSettingsData, refetch } = useGetSolidSettingsQuery(undefined);
   const settingsMap = getSettingsMap(solidSettingsData);
   const [bulkUpdateSolidSettings] = useBulkUpdateSolidUserSettingsMutation();
-  const [toast, setToast] = useState<ToastState>(null);
 
   useEffect(() => {
     refetch();
   }, [refetch]);
 
   const notify = (severity: "success" | "error" | "info" | "warn", summary: string, detail: string) => {
-    setToast({ id: Date.now(), severity, summary, detail });
+    dispatch(showToast({ severity, summary, detail }));
   };
 
   const formik = useFormik({
@@ -62,29 +57,8 @@ export const SolidNotifications = () => {
     },
   });
 
-  const severityClass =
-    toast?.severity === "error"
-      ? styles.toastError
-      : toast?.severity === "success"
-        ? styles.toastSuccess
-        : toast?.severity === "warn"
-          ? styles.toastWarn
-          : styles.toastInfo;
-
   return (
     <form onSubmit={formik.handleSubmit} className={styles.accountForm}>
-      {toast ? (
-        <div className={`${styles.toast} ${severityClass}`} role="status" aria-live="polite">
-          <div>
-            <div className={styles.toastTitle}>{toast.summary}</div>
-            <div className={styles.toastBody}>{toast.detail}</div>
-          </div>
-          <button type="button" className={styles.toastClose} onClick={() => setToast(null)} aria-label="Close notification">
-            ×
-          </button>
-        </div>
-      ) : null}
-
       <div className={styles.accountScroll}>
         <div className={styles.switchRow}>
           <div>

package/dist/components/core/common/SolidGenericImport/SolidImport.module.css

@@ -321,7 +321,7 @@
     align-items: center;
     justify-content: center;
     gap: 10px;
-    cursor: pointer;
+    cursor: default;
     transition: border-color 120ms ease, box-shadow 120ms ease, background 120ms ease;
 }
 

package/dist/components/core/common/SolidGenericImport/SolidImportDropzone.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidImportDropzone.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/common/SolidGenericImport/SolidImportDropzone.tsx"],"names":[],"mappings":"AAWA,eAAO,MAAM,mBAAmB,yDAA0D,GAAG,4CA6H5F,CAAA"}
+{"version":3,"file":"SolidImportDropzone.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/common/SolidGenericImport/SolidImportDropzone.tsx"],"names":[],"mappings":"AAWA,eAAO,MAAM,mBAAmB,yDAA0D,GAAG,4CA+H5F,CAAA"}

package/dist/components/core/common/SolidGenericImport/SolidImportDropzone.js

@@ -108,6 +108,8 @@ export var SolidImportDropzone = function (_a) {
             'text/csv': ['.csv']
         },
         multiple: false,
+        noClick: true,
+        noKeyboard: true,
     }), getRootProps = _d.getRootProps, getInputProps = _d.getInputProps, open = _d.open;
     var rootProps = getRootProps({ className: 'solid-import-dropzone-shell' });
     var removeFile = function () {

package/dist/components/core/common/SolidGenericImport/SolidImportDropzone.js.map

@@ -1 +1 @@
-{"version":3,"file":"SolidImportDropzone.js","sourceRoot":"","sources":["../../../../../src/components/core/common/SolidGenericImport/SolidImportDropzone.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport { useCallback, useState } from 'react';\nimport { useDropzone } from 'react-dropzone';\nimport { FileSpreadsheet, FileText, Trash2, Upload } from 'lucide-react';\nimport { useDispatch } from 'react-redux';\nimport { showToast } from '../../../../redux/features/toastSlice';\nimport styles from './SolidImport.module.css'\nimport { DocumentSvg } from './DocumentSvg';\nimport { useCreateImportTransactionMutation } from '../../../../redux/api/importTransactionApi';\nimport { ERROR_MESSAGES } from '../../../../constants/error-messages';\nimport { SolidButton } from '../../../shad-cn-ui';\nexport const SolidImportDropzone = ({ setImportStep, setTransactionId, modelMetadataId }: any) => {\n    const dispatch = useDispatch();\n\n    const [file, setFile] = useState<File | null>(null);\n    const [createImportTransaction, { isLoading }] = useCreateImportTransactionMutation();\n\n\n    const uploadFile = async (uploadFile: File) => {\n        const formData = new FormData();\n        formData.append('fileLocation', uploadFile);\n        formData.append('modelMetadataId', modelMetadataId);\n\n        try {\n            const response = await createImportTransaction(formData).unwrap();\n            console.log('Upload success:', response);\n            if (response?.statusCode === 200) {\n                setFile(uploadFile);\n                dispatch(showToast({ severity: \"success\", summary: ERROR_MESSAGES.FILE_UPLOAD, detail: ERROR_MESSAGES.FILE_UPLOAD_SUCCESSFULLY }));\n                setTransactionId?.(response?.data?.id);\n            } else {\n                dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.FAILED, detail: ERROR_MESSAGES.FAILED_UPLOAD_FILE }))\n            }\n        } catch (error) {\n            console.error(ERROR_MESSAGES.FAILED_UPLOAD_FILE, error);\n            dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.FAILED, detail: ERROR_MESSAGES.FAILED_UPLOAD_FILE }))\n        }\n    };\n\n    const onDrop = useCallback((acceptedFiles: File[]) => {\n        if (acceptedFiles.length > 0) {\n            const selectedFile = acceptedFiles[0];\n            uploadFile(selectedFile); // 👈 Auto upload on drop\n        }\n    }, []);\n\n    const { getRootProps, getInputProps, open } = useDropzone({\n        onDrop,\n        accept: {\n            'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': ['.xlsx'],\n            'text/csv': ['.csv']\n        },\n        multiple: false,\n    });\n\n    const rootProps = getRootProps({ className: 'solid-import-dropzone-shell' });\n\n    const removeFile = () => {\n        setFile(null);\n    };\n\n    const formatBytes = (bytes: number) => {\n        const sizes = ['Bytes', 'KB', 'MB', 'GB'];\n        if (bytes === 0) return '0 Byte';\n        const i = Math.floor(Math.log(bytes) / Math.log(1024));\n        return `${(bytes / Math.pow(1024, i)).toFixed(2)} ${sizes[i]}`;\n    };\n\n    return (\n        <div>\n            <div className={styles.SolidImportContextWrapper}>\n                <div {...rootProps}>\n                    <input {...getInputProps()} />\n                    <div className=\"solid-import-dropzone-copy\">\n                        <div className='flex justify-content-center'>\n                            <DocumentSvg />\n                        </div>\n                        <div className=\"solid-import-dropzone-kicker\">Accepted formats</div>\n                        <h5 className='text-center solid-primary-black-text solid-import-section-title solid-import-dropzone-title'>Drop or upload a file to import</h5>\n                        <p className='text-center m-0 solid-import-section-copy'>Excel files are recommended as formatting is automatic. You can also import plain <code>.csv</code> files.</p>\n                        <div className=\"solid-import-dropzone-format-list\" aria-hidden=\"true\">\n                            <span className=\"solid-import-dropzone-format-pill\">\n                                <FileSpreadsheet size={13} />\n                                Excel\n                            </span>\n                            <span className=\"solid-import-dropzone-format-pill\">\n                                <FileText size={13} />\n                                CSV\n                            </span>\n                        </div>\n                        <div className='flex justify-content-center mt-3'>\n                            <SolidButton type=\"button\" variant=\"outline\" size=\"small\" leftIcon={<Upload size={14} />} onClick={(event) => {\n                                event.stopPropagation();\n                                open();\n                            }}>\n                                Browse Files\n                            </SolidButton>\n                        </div>\n                    </div>\n                    {file &&\n                        <div className=\"solid-import-file-card\" onClick={(e) => e.stopPropagation()}>\n                            <div className=\"solid-import-file-card-main\">\n                                <div className=\"solid-import-file-icon\">\n                                    <FileSpreadsheet size={18} />\n                                </div>\n                                <div className=\"solid-import-file-meta\">\n                                    <p className='m-0 solid-import-file-name'>{file.name}</p>\n                                    <p className='m-0 solid-import-file-caption'>{file.type || 'Unknown type'}</p>\n                                    <p className='m-0 solid-import-file-caption'>{formatBytes(file.size)}</p>\n                                </div>\n                            </div>\n                            <SolidButton type=\"button\" variant=\"ghost\" size=\"small\" className=\"solid-import-file-remove\" leftIcon={<Trash2 size={14} />} onClick={removeFile} />\n                        </div>\n                    }\n                </div>\n            </div>\n            <div className='solid-import-actions'>\n                <p className=\"solid-import-actions-copy\">Upload one source file and continue to field mapping.</p>\n                <SolidButton\n                    type=\"button\"\n                    size='small'\n                    onClick={() => {\n                        if (!file) {\n                            dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.MISSING_FILE, detail: ERROR_MESSAGES.FAILED_UPLOAD_FILE }));\n                            return;\n                        }\n                        setImportStep(3);\n                    }}\n                    disabled={!file || isLoading}\n                    loading={isLoading}\n                >\n                    Continue\n                </SolidButton>\n            </div>\n        </div>\n    )\n}\n"]}
+{"version":3,"file":"SolidImportDropzone.js","sourceRoot":"","sources":["../../../../../src/components/core/common/SolidGenericImport/SolidImportDropzone.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport { useCallback, useState } from 'react';\nimport { useDropzone } from 'react-dropzone';\nimport { FileSpreadsheet, FileText, Trash2, Upload } from 'lucide-react';\nimport { useDispatch } from 'react-redux';\nimport { showToast } from '../../../../redux/features/toastSlice';\nimport styles from './SolidImport.module.css'\nimport { DocumentSvg } from './DocumentSvg';\nimport { useCreateImportTransactionMutation } from '../../../../redux/api/importTransactionApi';\nimport { ERROR_MESSAGES } from '../../../../constants/error-messages';\nimport { SolidButton } from '../../../shad-cn-ui';\nexport const SolidImportDropzone = ({ setImportStep, setTransactionId, modelMetadataId }: any) => {\n    const dispatch = useDispatch();\n\n    const [file, setFile] = useState<File | null>(null);\n    const [createImportTransaction, { isLoading }] = useCreateImportTransactionMutation();\n\n\n    const uploadFile = async (uploadFile: File) => {\n        const formData = new FormData();\n        formData.append('fileLocation', uploadFile);\n        formData.append('modelMetadataId', modelMetadataId);\n\n        try {\n            const response = await createImportTransaction(formData).unwrap();\n            console.log('Upload success:', response);\n            if (response?.statusCode === 200) {\n                setFile(uploadFile);\n                dispatch(showToast({ severity: \"success\", summary: ERROR_MESSAGES.FILE_UPLOAD, detail: ERROR_MESSAGES.FILE_UPLOAD_SUCCESSFULLY }));\n                setTransactionId?.(response?.data?.id);\n            } else {\n                dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.FAILED, detail: ERROR_MESSAGES.FAILED_UPLOAD_FILE }))\n            }\n        } catch (error) {\n            console.error(ERROR_MESSAGES.FAILED_UPLOAD_FILE, error);\n            dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.FAILED, detail: ERROR_MESSAGES.FAILED_UPLOAD_FILE }))\n        }\n    };\n\n    const onDrop = useCallback((acceptedFiles: File[]) => {\n        if (acceptedFiles.length > 0) {\n            const selectedFile = acceptedFiles[0];\n            uploadFile(selectedFile); // 👈 Auto upload on drop\n        }\n    }, []);\n\n    const { getRootProps, getInputProps, open } = useDropzone({\n        onDrop,\n        accept: {\n            'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': ['.xlsx'],\n            'text/csv': ['.csv']\n        },\n        multiple: false,\n        noClick: true,\n        noKeyboard: true,\n    });\n\n    const rootProps = getRootProps({ className: 'solid-import-dropzone-shell' });\n\n    const removeFile = () => {\n        setFile(null);\n    };\n\n    const formatBytes = (bytes: number) => {\n        const sizes = ['Bytes', 'KB', 'MB', 'GB'];\n        if (bytes === 0) return '0 Byte';\n        const i = Math.floor(Math.log(bytes) / Math.log(1024));\n        return `${(bytes / Math.pow(1024, i)).toFixed(2)} ${sizes[i]}`;\n    };\n\n    return (\n        <div>\n            <div className={styles.SolidImportContextWrapper}>\n                <div {...rootProps}>\n                    <input {...getInputProps()} />\n                    <div className=\"solid-import-dropzone-copy\">\n                        <div className='flex justify-content-center'>\n                            <DocumentSvg />\n                        </div>\n                        <div className=\"solid-import-dropzone-kicker\">Accepted formats</div>\n                        <h5 className='text-center solid-primary-black-text solid-import-section-title solid-import-dropzone-title'>Drop or upload a file to import</h5>\n                        <p className='text-center m-0 solid-import-section-copy'>Excel files are recommended as formatting is automatic. You can also import plain <code>.csv</code> files.</p>\n                        <div className=\"solid-import-dropzone-format-list\" aria-hidden=\"true\">\n                            <span className=\"solid-import-dropzone-format-pill\">\n                                <FileSpreadsheet size={13} />\n                                Excel\n                            </span>\n                            <span className=\"solid-import-dropzone-format-pill\">\n                                <FileText size={13} />\n                                CSV\n                            </span>\n                        </div>\n                        <div className='flex justify-content-center mt-3'>\n                            <SolidButton type=\"button\" variant=\"outline\" size=\"small\" leftIcon={<Upload size={14} />} onClick={(event) => {\n                                event.stopPropagation();\n                                open();\n                            }}>\n                                Browse Files\n                            </SolidButton>\n                        </div>\n                    </div>\n                    {file &&\n                        <div className=\"solid-import-file-card\" onClick={(e) => e.stopPropagation()}>\n                            <div className=\"solid-import-file-card-main\">\n                                <div className=\"solid-import-file-icon\">\n                                    <FileSpreadsheet size={18} />\n                                </div>\n                                <div className=\"solid-import-file-meta\">\n                                    <p className='m-0 solid-import-file-name'>{file.name}</p>\n                                    <p className='m-0 solid-import-file-caption'>{file.type || 'Unknown type'}</p>\n                                    <p className='m-0 solid-import-file-caption'>{formatBytes(file.size)}</p>\n                                </div>\n                            </div>\n                            <SolidButton type=\"button\" variant=\"ghost\" size=\"small\" className=\"solid-import-file-remove\" leftIcon={<Trash2 size={14} />} onClick={removeFile} />\n                        </div>\n                    }\n                </div>\n            </div>\n            <div className='solid-import-actions'>\n                <p className=\"solid-import-actions-copy\">Upload one source file and continue to field mapping.</p>\n                <SolidButton\n                    type=\"button\"\n                    size='small'\n                    onClick={() => {\n                        if (!file) {\n                            dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.MISSING_FILE, detail: ERROR_MESSAGES.FAILED_UPLOAD_FILE }));\n                            return;\n                        }\n                        setImportStep(3);\n                    }}\n                    disabled={!file || isLoading}\n                    loading={isLoading}\n                >\n                    Continue\n                </SolidButton>\n            </div>\n        </div>\n    )\n}\n"]}

package/dist/components/core/common/SolidGenericImport/SolidImportDropzone.tsx

@@ -51,6 +51,8 @@ export const SolidImportDropzone = ({ setImportStep, setTransactionId, modelMeta
             'text/csv': ['.csv']
         },
         multiple: false,
+        noClick: true,
+        noKeyboard: true,
     });
 
     const rootProps = getRootProps({ className: 'solid-import-dropzone-shell' });

package/dist/components/core/common/SolidGlobalSearchElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidGlobalSearchElement.d.ts","sourceRoot":"","sources":["../../../../src/components/core/common/SolidGlobalSearchElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgF,MAAM,OAAO,CAAC;AAYrG,OAA0B,EAAE,eAAe,EAAE,YAAY,EAAsB,MAAM,qBAAqB,CAAC;AA0B3G,MAAM,MAAM,eAAe,GAAG;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;CACrB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,sBAAsB,EAAE,MAAM,CAAC;CAClC,CAAA;AA2TD,eAAO,MAAM,2BAA2B,sBAAuB,GAAG,aAAa,GAAG,yBAAyB,MAAM,iBAAiB,MAAM,QAavI,CAAA;AAGD,eAAO,MAAM,mBAAmB,iBAAkB,GAAG,gBAAgB,GAAG,eAAe,GAAG,qBAAqB,GAAG,kBAAkB,YAAY,EAAE,qBAAqB,eAAe,EAAE,QAwBvL,CAAA;AA0HD,eAAO,MAAM,wBAAwB,kFAumDnC,CAAC"}
+{"version":3,"file":"SolidGlobalSearchElement.d.ts","sourceRoot":"","sources":["../../../../src/components/core/common/SolidGlobalSearchElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgF,MAAM,OAAO,CAAC;AAYrG,OAA0B,EAAE,eAAe,EAAE,YAAY,EAAsB,MAAM,qBAAqB,CAAC;AA0B3G,MAAM,MAAM,eAAe,GAAG;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;CACrB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,sBAAsB,EAAE,MAAM,CAAC;CAClC,CAAA;AAoUD,eAAO,MAAM,2BAA2B,sBAAuB,GAAG,aAAa,GAAG,yBAAyB,MAAM,iBAAiB,MAAM,QAavI,CAAA;AAGD,eAAO,MAAM,mBAAmB,iBAAkB,GAAG,gBAAgB,GAAG,eAAe,GAAG,qBAAqB,GAAG,kBAAkB,YAAY,EAAE,qBAAqB,eAAe,EAAE,QAwBvL,CAAA;AA0HD,eAAO,MAAM,wBAAwB,kFA+qDnC,CAAC"}

package/dist/components/core/common/SolidGlobalSearchElement.js

@@ -185,8 +185,19 @@ var transformRulesToFilters = function (input, viewData) {
         var _a, _b, _c, _d;
         var _e, _f;
         if (rule.value !== undefined && rule.value !== null) {
-            // Ensure rule.value is always an array
-            var values = typeof rule.value[0] === "object" ? rule.value.map(function (i) { return (i === null || i === void 0 ? void 0 : i.value) ? i === null || i === void 0 ? void 0 : i.value : i; }) : rule === null || rule === void 0 ? void 0 : rule.value;
+            // Ensure rule.value is always an array of primitive values.
+            // Mixed arrays like ["failed", { label: "pending", value: "pending" }]
+            // must be normalized before query serialization.
+            var rawValues = Array.isArray(rule === null || rule === void 0 ? void 0 : rule.value) ? rule.value : [rule === null || rule === void 0 ? void 0 : rule.value];
+            var values = rawValues.map(function (item) {
+                if (item && typeof item === "object") {
+                    if (Object.prototype.hasOwnProperty.call(item, "value"))
+                        return item.value;
+                    if (Object.prototype.hasOwnProperty.call(item, "label"))
+                        return item.label;
+                }
+                return item;
+            });
             if (rule.matchMode !== '$in' && rule.matchMode !== '$notIn' && rule.matchMode !== '$between' && rule.matchMode !== '$null' && rule.matchMode !== '$notNull') {
                 values = values[0];
             }
@@ -468,7 +479,7 @@ var extractChips = function (node) {
     return [];
 };
 export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
-    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
     var viewData = _a.viewData, viewType = _a.viewType, handleApplyCustomFilter = _a.handleApplyCustomFilter, showSaveFilterPopup = _a.showSaveFilterPopup, setShowSaveFilterPopup = _a.setShowSaveFilterPopup, filterPredicates = _a.filterPredicates;
     var defaultState = [
         {
@@ -509,7 +520,7 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
     var defaultGroupingRules = [
         { id: 1, fieldName: null, dateGrouping: null }
     ];
-    var _t = useState(defaultState), initialState = _t[0], setInitialState = _t[1];
+    var _v = useState(defaultState), initialState = _v[0], setInitialState = _v[1];
     var pathname = usePathname();
     var searchableEntityLabel = ((_c = (_b = viewData === null || viewData === void 0 ? void 0 : viewData.data) === null || _b === void 0 ? void 0 : _b.solidView) === null || _c === void 0 ? void 0 : _c.displayName) ||
         ((_f = (_e = (_d = viewData === null || viewData === void 0 ? void 0 : viewData.data) === null || _d === void 0 ? void 0 : _d.solidView) === null || _e === void 0 ? void 0 : _e.model) === null || _f === void 0 ? void 0 : _f.displayName) ||
@@ -520,43 +531,50 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
     var chipsRef = useRef(null);
     // filterRules is used to maintian the ui of custom filter 
     // customFilter is used to maintian the transformed filter object of custom filter
-    var _u = useState(initialState), filterRules = _u[0], setFilterRules = _u[1];
-    var _v = useState(null), customFilter = _v[0], setCustomFilter = _v[1];
-    var _w = useState([]), fields = _w[0], setFields = _w[1];
-    var _x = useState([]), searchableFields = _x[0], setSearchableFields = _x[1];
-    var _y = useState([]), groupableFields = _y[0], setGroupableFields = _y[1];
-    var _z = useState(defaultGroupingRules), groupingRules = _z[0], setGroupingRules = _z[1];
-    var _0 = useState(defaultAggregationRules), aggregationRules = _0[0], setAggregationRules = _0[1];
+    var _w = useState(initialState), filterRules = _w[0], setFilterRules = _w[1];
+    var _x = useState(null), customFilter = _x[0], setCustomFilter = _x[1];
+    var _y = useState([]), fields = _y[0], setFields = _y[1];
+    var _z = useState([]), searchableFields = _z[0], setSearchableFields = _z[1];
+    var _0 = useState([]), groupableFields = _0[0], setGroupableFields = _0[1];
+    var _1 = useState(defaultGroupingRules), groupingRules = _1[0], setGroupingRules = _1[1];
+    var _2 = useState(defaultAggregationRules), aggregationRules = _2[0], setAggregationRules = _2[1];
     // used to show the list of predefined searches 
-    var _1 = useState([]), predefinedSearches = _1[0], setPredefinedSearches = _1[1];
+    var _3 = useState([]), predefinedSearches = _3[0], setPredefinedSearches = _3[1];
     // used to open / close the custom fitler popup 
-    var _2 = useState(false), showGlobalSearchElement = _2[0], setShowGlobalSearchElement = _2[1];
+    var _4 = useState(false), showGlobalSearchElement = _4[0], setShowGlobalSearchElement = _4[1];
     // used to open / close the group fitler popup 
-    var _3 = useState(false), showGroupFilterElement = _3[0], setShowGroupFilterElement = _3[1];
+    var _5 = useState(false), showGroupFilterElement = _5[0], setShowGroupFilterElement = _5[1];
     // searchChips maintain the ui to display searched query 
     // searchFilter maintain the transformed filter of the  searched query 
-    var _4 = useState([]), searchChips = _4[0], setSearchChips = _4[1];
-    var _5 = useState(null), searchFilter = _5[0], setSearchFilter = _5[1];
+    var _6 = useState([]), searchChips = _6[0], setSearchChips = _6[1];
+    var _7 = useState(null), searchFilter = _7[0], setSearchFilter = _7[1];
     // predefinedSearchChip maintain the ui to display predefined searches query 
-    var _6 = useState(null), predefinedSearchChip = _6[0], setPredefinedSearchChip = _6[1];
+    var _8 = useState(null), predefinedSearchChip = _8[0], setPredefinedSearchChip = _8[1];
     //  state to maintain the text typed in the search input box
-    var _7 = useState(""), inputValue = _7[0], setInputValue = _7[1];
-    var _8 = useState(-1), focusedIndex = _8[0], setFocusedIndex = _8[1];
+    var _9 = useState(""), inputValue = _9[0], setInputValue = _9[1];
+    var _10 = useState(-1), focusedIndex = _10[0], setFocusedIndex = _10[1];
     // flag to prevent un necessary re renders
-    var _9 = useState(false), hasSearched = _9[0], setHasSearched = _9[1];
+    var _11 = useState(false), hasSearched = _11[0], setHasSearched = _11[1];
     // currentSavedFilterData  is used to save the whole object of saved filter 
-    var _10 = useState(), currentSavedFilterData = _10[0], setCurrentSavedFilterData = _10[1];
-    var _11 = useState(), currentSavedFilterQuery = _11[0], setCurrentSavedFilterQuery = _11[1];
-    var _12 = useState(), currentSavedFilterRules = _12[0], setCurrentSavedFilterRules = _12[1];
-    var _13 = useState(false), showSavedFilterComponent = _13[0], setShowSavedFilterComponent = _13[1];
-    var _14 = useState(), savedFilterTobeDeleted = _14[0], setSavedFilterTobeDeleted = _14[1];
-    var _15 = useState(false), isDeleteSQDialogVisible = _15[0], setIsDeleteSQDialogVisible = _15[1];
-    var _16 = useState(), savedFilterQueryString = _16[0], setSavedFilterQueryString = _16[1];
-    var _17 = useState(false), showOverlay = _17[0], setShowOverlay = _17[1];
+    var _12 = useState(), currentSavedFilterData = _12[0], setCurrentSavedFilterData = _12[1];
+    var _13 = useState(), currentSavedFilterQuery = _13[0], setCurrentSavedFilterQuery = _13[1];
+    var _14 = useState(), currentSavedFilterRules = _14[0], setCurrentSavedFilterRules = _14[1];
+    var _15 = useState(false), showSavedFilterComponent = _15[0], setShowSavedFilterComponent = _15[1];
+    var _16 = useState(), savedFilterTobeDeleted = _16[0], setSavedFilterTobeDeleted = _16[1];
+    var _17 = useState(false), isDeleteSQDialogVisible = _17[0], setIsDeleteSQDialogVisible = _17[1];
+    var _18 = useState(), savedFilterQueryString = _18[0], setSavedFilterQueryString = _18[1];
+    var _19 = useState(false), showOverlay = _19[0], setShowOverlay = _19[1];
     var overlayRef = useRef(null);
-    var _18 = useState(false), showChipManager = _18[0], setShowChipManager = _18[1];
+    var searchInputRef = useRef(null);
+    var _20 = useState(false), showChipManager = _20[0], setShowChipManager = _20[1];
     var chipManagerRef = useRef(null);
     var chipManagerTriggerRef = useRef(null);
+    var focusSearchInput = function () {
+        requestAnimationFrame(function () {
+            var _a;
+            (_a = searchInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        });
+    };
     useEffect(function () {
         if (focusedIndex >= 0 && showOverlay) {
             var activeElement = document.querySelector(".solid-search-overlay-option-active");
@@ -568,19 +586,19 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
             }
         }
     }, [focusedIndex, showOverlay]);
-    var _19 = useSession(), session = _19.data, status = _19.status;
+    var _21 = useSession(), session = _21.data, status = _21.status;
     var user = session === null || session === void 0 ? void 0 : session.user;
-    var _20 = useState(0), refreshKey = _20[0], setRefreshKey = _20[1];
-    var _21 = useState(null), predefinedSearchBaseFilter = _21[0], setPredefinedSearchBaseFilter = _21[1];
-    var _22 = useState([]), savedFilters = _22[0], setSavedFilters = _22[1];
-    var _23 = useState(false), savedFiltersLoaded = _23[0], setSavedFiltersLoaded = _23[1];
+    var _22 = useState(0), refreshKey = _22[0], setRefreshKey = _22[1];
+    var _23 = useState(null), predefinedSearchBaseFilter = _23[0], setPredefinedSearchBaseFilter = _23[1];
+    var _24 = useState([]), savedFilters = _24[0], setSavedFilters = _24[1];
+    var _25 = useState(false), savedFiltersLoaded = _25[0], setSavedFiltersLoaded = _25[1];
     var entityApi = createSolidEntityApi("savedFilters");
     var useCreateSolidEntityMutation = entityApi.useCreateSolidEntityMutation, useDeleteSolidEntityMutation = entityApi.useDeleteSolidEntityMutation, useGetSolidEntityByIdQuery = entityApi.useGetSolidEntityByIdQuery, useUpdateSolidEntityMutation = entityApi.useUpdateSolidEntityMutation, useLazyGetSolidEntitiesQuery = entityApi.useLazyGetSolidEntitiesQuery;
-    var _24 = useCreateSolidEntityMutation(), createEntity = _24[0], _25 = _24[1], isEntityCreateSuccess = _25.isSuccess, isEntityCreateError = _25.isError, entityCreateError = _25.error;
-    var _26 = useUpdateSolidEntityMutation(), updateEntity = _26[0], _27 = _26[1], isEntityUpdateSuceess = _27.isSuccess, isEntityUpdateError = _27.isError, entityUpdateError = _27.error;
-    var _28 = useDeleteSolidEntityMutation(), deleteEntity = _28[0], _29 = _28[1], isEntityDeleteSuceess = _29.isSuccess, isEntityDeleteError = _29.isError, entityDeleteError = _29.error;
-    var _30 = useLazyGetSolidEntitiesQuery(), triggerGetSolidEntities = _30[0], _31 = _30[1], solidEntityListViewData = _31.data, isSavedFilterLoading = _31.isLoading, error = _31.error;
-    var _32 = useState(0), savedFilterFetchDataRefreshKey = _32[0], setSavedFilterFetchDataRefreshKey = _32[1];
+    var _26 = useCreateSolidEntityMutation(), createEntity = _26[0], _27 = _26[1], isEntityCreateSuccess = _27.isSuccess, isEntityCreateError = _27.isError, entityCreateError = _27.error;
+    var _28 = useUpdateSolidEntityMutation(), updateEntity = _28[0], _29 = _28[1], isEntityUpdateSuceess = _29.isSuccess, isEntityUpdateError = _29.isError, entityUpdateError = _29.error;
+    var _30 = useDeleteSolidEntityMutation(), deleteEntity = _30[0], _31 = _30[1], isEntityDeleteSuceess = _31.isSuccess, isEntityDeleteError = _31.isError, entityDeleteError = _31.error;
+    var _32 = useLazyGetSolidEntitiesQuery(), triggerGetSolidEntities = _32[0], _33 = _32[1], solidEntityListViewData = _33.data, isSavedFilterLoading = _33.isLoading, error = _33.error;
+    var _34 = useState(0), savedFilterFetchDataRefreshKey = _34[0], setSavedFilterFetchDataRefreshKey = _34[1];
     useEffect(function () {
         var fn = function () { return __awaiter(void 0, void 0, void 0, function () {
             var filters, queryData, queryString, savedFilter;
@@ -770,27 +788,61 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
             setPredefinedSearchChip(null);
             setPredefinedSearchBaseFilter(null);
             setInputValue("");
-            var fieldsData = (_b = viewData === null || viewData === void 0 ? void 0 : viewData.data) === null || _b === void 0 ? void 0 : _b.solidFieldsMetadata;
+            var fieldsData_1 = (_b = viewData === null || viewData === void 0 ? void 0 : viewData.data) === null || _b === void 0 ? void 0 : _b.solidFieldsMetadata;
             // console.log(`fiels data while rendering solid global search element: `);
             // console.log(fieldsData);
             var layoutChildren = (_f = (_e = (_d = (_c = viewData === null || viewData === void 0 ? void 0 : viewData.data) === null || _c === void 0 ? void 0 : _c.solidView) === null || _d === void 0 ? void 0 : _d.layout) === null || _e === void 0 ? void 0 : _e.children) !== null && _f !== void 0 ? _f : [];
             var fieldElements_1 = extractFields(layoutChildren);
-            var fieldsList = Object.entries(fieldsData !== null && fieldsData !== void 0 ? fieldsData : {}).map(function (_a) {
-                var _b, _c, _d, _e, _f, _g;
+            // Build one entry per layout column (not per field name), so multiple columns
+            // sharing the same field name (e.g. several viewMetadata columns with different
+            // searchFields/labels) each appear as a separate searchable option.
+            var seenKeys_1 = new Set();
+            var fieldsList_1 = [];
+            // First pass: one entry per unique field name (for non-searchable / filter use)
+            Object.entries(fieldsData_1 !== null && fieldsData_1 !== void 0 ? fieldsData_1 : {}).forEach(function (_a) {
+                var _b, _c, _d, _e, _f, _g, _h, _j;
                 var key = _a[0], value = _a[1];
                 var viewFieldElement = fieldElements_1.find(function (f) { var _a; return ((_a = f === null || f === void 0 ? void 0 : f.attrs) === null || _a === void 0 ? void 0 : _a.name) === key; });
-                return {
-                    name: value.displayName,
+                seenKeys_1.add(key);
+                fieldsList_1.push({
+                    name: (_c = (_b = viewFieldElement === null || viewFieldElement === void 0 ? void 0 : viewFieldElement.attrs) === null || _b === void 0 ? void 0 : _b.label) !== null && _c !== void 0 ? _c : value.displayName,
                     value: key,
                     type: value.type,
                     ormType: value.ormType,
-                    matchMode: (_b = viewFieldElement === null || viewFieldElement === void 0 ? void 0 : viewFieldElement.attrs) === null || _b === void 0 ? void 0 : _b.searchMatchMode,
-                    searchField: (_d = (_c = viewFieldElement === null || viewFieldElement === void 0 ? void 0 : viewFieldElement.attrs) === null || _c === void 0 ? void 0 : _c.searchField) !== null && _d !== void 0 ? _d : null,
-                    isSearchable: (_f = (_e = viewFieldElement === null || viewFieldElement === void 0 ? void 0 : viewFieldElement.attrs) === null || _e === void 0 ? void 0 : _e.isSearchable) !== null && _f !== void 0 ? _f : false,
-                    relationType: (_g = value === null || value === void 0 ? void 0 : value.relationType) !== null && _g !== void 0 ? _g : null,
-                };
+                    matchMode: (_d = viewFieldElement === null || viewFieldElement === void 0 ? void 0 : viewFieldElement.attrs) === null || _d === void 0 ? void 0 : _d.searchMatchMode,
+                    searchField: (_f = (_e = viewFieldElement === null || viewFieldElement === void 0 ? void 0 : viewFieldElement.attrs) === null || _e === void 0 ? void 0 : _e.searchField) !== null && _f !== void 0 ? _f : null,
+                    isSearchable: (_h = (_g = viewFieldElement === null || viewFieldElement === void 0 ? void 0 : viewFieldElement.attrs) === null || _g === void 0 ? void 0 : _g.isSearchable) !== null && _h !== void 0 ? _h : false,
+                    relationType: (_j = value === null || value === void 0 ? void 0 : value.relationType) !== null && _j !== void 0 ? _j : null,
+                });
+            });
+            // Second pass: for any layout column that shares a field name but has a
+            // distinct searchField, add it as an additional searchable entry.
+            fieldElements_1.forEach(function (fieldElement) {
+                var _a, _b, _c, _d, _e, _f, _g, _h;
+                var key = (_a = fieldElement === null || fieldElement === void 0 ? void 0 : fieldElement.attrs) === null || _a === void 0 ? void 0 : _a.name;
+                var searchField = (_b = fieldElement === null || fieldElement === void 0 ? void 0 : fieldElement.attrs) === null || _b === void 0 ? void 0 : _b.searchField;
+                var isSearchable = (_d = (_c = fieldElement === null || fieldElement === void 0 ? void 0 : fieldElement.attrs) === null || _c === void 0 ? void 0 : _c.isSearchable) !== null && _d !== void 0 ? _d : false;
+                if (!isSearchable || !searchField)
+                    return;
+                // Already covered by the first pass entry for this key?
+                var existingEntry = fieldsList_1.find(function (e) { return e.value === key && e.searchField === searchField; });
+                if (existingEntry)
+                    return; // already in list
+                var value = (fieldsData_1 !== null && fieldsData_1 !== void 0 ? fieldsData_1 : {})[key];
+                if (!value)
+                    return;
+                fieldsList_1.push({
+                    name: (_f = (_e = fieldElement === null || fieldElement === void 0 ? void 0 : fieldElement.attrs) === null || _e === void 0 ? void 0 : _e.label) !== null && _f !== void 0 ? _f : value.displayName,
+                    value: key,
+                    type: value.type,
+                    ormType: value.ormType,
+                    matchMode: (_g = fieldElement === null || fieldElement === void 0 ? void 0 : fieldElement.attrs) === null || _g === void 0 ? void 0 : _g.searchMatchMode,
+                    searchField: searchField,
+                    isSearchable: true,
+                    relationType: (_h = value === null || value === void 0 ? void 0 : value.relationType) !== null && _h !== void 0 ? _h : null,
+                });
             });
-            var filterableFieldsList = fieldsList.filter(function (field) {
+            var filterableFieldsList = fieldsList_1.filter(function (field) {
                 switch (field.type) {
                     case "mediaSingle":
                     case "mediaMultiple":
@@ -800,7 +852,7 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
                 }
             });
             setFields(filterableFieldsList);
-            var searchableFieldsList = fieldsList.filter(function (field) {
+            var searchableFieldsList = fieldsList_1.filter(function (field) {
                 if (!field.isSearchable)
                     return false;
                 switch (field.type) {
@@ -819,7 +871,7 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
                         return false;
                 }
             });
-            var groupableFieldsList = fieldsList.filter(function (field) {
+            var groupableFieldsList = fieldsList_1.filter(function (field) {
                 switch (field.type) {
                     case "relation":
                         // Only include relation if searchField is present
@@ -1352,8 +1404,18 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
             kind: "saved",
             saved: s,
         }); });
-        return __spreadArray(__spreadArray(__spreadArray([], fields, true), predefined, true), saved, true);
-    }, [inputValue, searchableFields, predefinedSearches, savedFilters]);
+        var custom = [{
+                id: "footer:custom",
+                kind: "custom",
+            }];
+        var grouping = viewType === "tree"
+            ? [{
+                    id: "footer:grouping",
+                    kind: "grouping",
+                }]
+            : [];
+        return __spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray([], fields, true), predefined, true), saved, true), custom, true), grouping, true);
+    }, [inputValue, searchableFields, predefinedSearches, savedFilters, viewType]);
     var handleKeyDown = function (e) {
         var currentValue = (inputValue === null || inputValue === void 0 ? void 0 : inputValue.trim()) || "";
         var applyFieldOption = function (value) {
@@ -1396,6 +1458,12 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
                 else if ((activeOption === null || activeOption === void 0 ? void 0 : activeOption.kind) === "saved") {
                     applySavedFilter(activeOption.saved);
                 }
+                else if ((activeOption === null || activeOption === void 0 ? void 0 : activeOption.kind) === "custom") {
+                    openCustomFilterDialog();
+                }
+                else if ((activeOption === null || activeOption === void 0 ? void 0 : activeOption.kind) === "grouping") {
+                    openGroupingDialog();
+                }
                 else if (currentValue) {
                     handleAddChip();
                     setShowOverlay(false);
@@ -1479,7 +1547,7 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
     };
     var PredefinedSearchChip = function () { return (_jsx("li", { children: _jsxs("div", { className: "search-filter-chip-type", children: [_jsxs("div", { className: "flex align-items-center gap-2", children: [_jsxs("strong", { children: [predefinedSearchChip === null || predefinedSearchChip === void 0 ? void 0 : predefinedSearchChip.name, ":"] }), _jsx("span", { className: "custom-chip-value", children: predefinedSearchChip === null || predefinedSearchChip === void 0 ? void 0 : predefinedSearchChip.value })] }), _jsx("button", { type: "button", className: "ml-1", style: { cursor: "pointer" }, onClick: removePredefinedSearchChip, children: _jsx(X, { size: 14 }) })] }) })); };
     // predefinedfilter related code end
-    return (_jsx(_Fragment, { children: _jsxs("div", { className: "flex justify-content-center solid-custom-filter-wrapper relative", children: [_jsx("div", { className: "solid-global-search-element", children: _jsxs("ul", { className: "solid-global-search-chip-list", children: [visibleChipItems.map(function (chip) { return (_jsx("li", { children: _jsxs("div", { className: "search-filter-chip-type solid-chip-pill solid-chip-tone-".concat(chip.type), children: [_jsx("span", { className: "custom-chip-value solid-chip-pill-label", title: chip.label, children: chip.label }), _jsx("button", { type: "button", className: "solid-chip-pill-remove", onMouseDown: function (e) { return e.preventDefault(); }, onClick: chip.onRemove, "aria-label": "Remove ".concat(chip.label), children: _jsx(X, { size: 14 }) })] }) }, chip.id)); }), hiddenChipCount > 0 && (_jsx("li", { children: _jsxs("button", { type: "button", ref: chipManagerTriggerRef, className: "solid-chip-manage-trigger", onMouseDown: function (e) { return e.preventDefault(); }, onClick: function () { return setShowChipManager(function (prev) { return !prev; }); }, children: ["+", hiddenChipCount, " more"] }) })), managedChipItems.length > 0 && hiddenChipCount === 0 && (_jsx("li", { children: _jsx("button", { type: "button", ref: chipManagerTriggerRef, className: "solid-chip-manage-trigger solid-chip-manage-trigger-secondary", onMouseDown: function (e) { return e.preventDefault(); }, onClick: function () { return setShowChipManager(function (prev) { return !prev; }); }, children: "Manage" }) })), _jsx("li", { ref: chipsRef, className: "solid-global-search-input-item", children: _jsxs("div", { className: "relative solid-global-search-element-wrapper", children: [_jsx(SolidInput, { className: "solid-global-search-input", value: inputValue || "", placeholder: "Search.", onChange: function (e) {
+    return (_jsx(_Fragment, { children: _jsxs("div", { className: "flex justify-content-center solid-custom-filter-wrapper relative", children: [_jsx("div", { className: "solid-global-search-element", children: _jsxs("ul", { className: "solid-global-search-chip-list", children: [visibleChipItems.map(function (chip) { return (_jsx("li", { children: _jsxs("div", { className: "search-filter-chip-type solid-chip-pill solid-chip-tone-".concat(chip.type), children: [_jsx("span", { className: "custom-chip-value solid-chip-pill-label", title: chip.label, children: chip.label }), _jsx("button", { type: "button", className: "solid-chip-pill-remove", onMouseDown: function (e) { return e.preventDefault(); }, onClick: chip.onRemove, "aria-label": "Remove ".concat(chip.label), children: _jsx(X, { size: 14 }) })] }) }, chip.id)); }), hiddenChipCount > 0 && (_jsx("li", { children: _jsxs("button", { type: "button", ref: chipManagerTriggerRef, className: "solid-chip-manage-trigger", onMouseDown: function (e) { return e.preventDefault(); }, onClick: function () { return setShowChipManager(function (prev) { return !prev; }); }, children: ["+", hiddenChipCount, " more"] }) })), managedChipItems.length > 0 && hiddenChipCount === 0 && (_jsx("li", { children: _jsx("button", { type: "button", ref: chipManagerTriggerRef, className: "solid-chip-manage-trigger solid-chip-manage-trigger-secondary", onMouseDown: function (e) { return e.preventDefault(); }, onClick: function () { return setShowChipManager(function (prev) { return !prev; }); }, children: "Manage" }) })), _jsx("li", { ref: chipsRef, className: "solid-global-search-input-item", children: _jsxs("div", { className: "relative solid-global-search-element-wrapper", children: [_jsx(SolidInput, { ref: searchInputRef, className: "solid-global-search-input", value: inputValue || "", placeholder: "Search.", onChange: function (e) {
                                                 setInputValue(e.target.value);
                                                 setShowChipManager(false);
                                                 setShowOverlay(true);
@@ -1491,9 +1559,13 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
                                             }, onBlur: function () {
                                                 // Delay so you can click buttons inside overlay
                                                 setTimeout(function () { return setShowOverlay(false); }, 150);
-                                            }, onKeyDown: handleKeyDown }), _jsx(SolidButton, { variant: "outline", size: "sm", onClick: function () {
+                                            }, onKeyDown: handleKeyDown }), _jsx(SolidButton, { variant: "outline", size: "sm", onMouseDown: function (e) {
+                                                // Preserve input focus so overlay keyboard navigation continues to work.
+                                                e.preventDefault();
+                                            }, onClick: function () {
                                                 setShowChipManager(false);
                                                 setShowOverlay(true);
+                                                focusSearchInput();
                                             }, className: "custom-filter-button solid-global-search-trigger", children: _jsx(Search, { size: 14 }) })] }) })] }) }), showChipManager && managedChipItems.length > 0 && (_jsxs("div", { ref: chipManagerRef, className: "absolute z-5 solid-chip-manager-panel", children: [_jsxs("div", { className: "solid-chip-manager-header", children: [_jsxs("div", { className: "solid-chip-manager-title", children: ["Applied chips (", managedChipItems.length, ")"] }), _jsx("button", { type: "button", className: "solid-chip-manager-clear-btn", onClick: clearAllAppliedChips, children: "Clear all" })] }), _jsx("div", { className: "solid-chip-manager-body", children: managedChipItems.map(function (chip) { return (_jsxs("div", { className: "solid-chip-manager-item solid-chip-tone-".concat(chip.type), onClick: function () {
                                     if (chip.id == "custom-filter" || chip.id == "grouping-rules") {
                                         if (chip.onOpen) {
@@ -1532,7 +1604,15 @@ export var SolidGlobalSearchElement = forwardRef(function (_a, ref) {
                                                                 if (optIndex !== -1)
                                                                     setFocusedIndex(optIndex);
                                                             } }, savedfilter.id));
-                                                    }) })] }) })] }), _jsxs("div", { className: "solid-search-overlay-footer", children: [_jsx("button", { type: "button", className: "px-3 py-2 flex flex-column solid-search-overlay-footer-action", onClick: openCustomFilterDialog, children: _jsxs("div", { className: "solid-search-overlay-footer-action-main", children: [_jsx("div", { className: "solid-search-overlay-panel-callout-icon", children: _jsx(Filter, { size: 14 }) }), _jsxs("div", { className: "solid-search-overlay-panel-callout-copy", children: [_jsx("div", { className: "solid-search-overlay-footer-title solid-search-overlay-section-title", children: "Click here to apply custom filters" }), _jsx("div", { className: "solid-search-overlay-footer-subtitle", children: "Use custom filters to apply conditions on any field using any operator." })] })] }) }), viewType === "tree" && (_jsx("button", { type: "button", className: "px-3 py-2 flex flex-column solid-search-overlay-footer-action solid-search-overlay-footer-action-secondary", onClick: openGroupingDialog, children: _jsxs("div", { className: "solid-search-overlay-footer-action-main", children: [_jsx("div", { className: "solid-search-overlay-panel-callout-icon", children: _jsx(Plus, { size: 14 }) }), _jsxs("div", { className: "solid-search-overlay-panel-callout-copy", children: [_jsx("div", { className: "solid-search-overlay-footer-title solid-search-overlay-section-title", children: "Click here to do custom grouping" }), _jsx("div", { className: "solid-search-overlay-footer-subtitle", children: "Configure grouping rules and aggregations for the tree view." })] })] }) }))] })] })), _jsxs(SolidDialog, { open: showGlobalSearchElement, onOpenChange: setShowGlobalSearchElement, className: "solid-global-search-filter solid-filter-dialog-shell", style: { width: "min(960px, calc(100vw - 2rem))" }, children: [_jsxs(SolidDialogHeader, { className: "solid-filter-dialog-head", children: [_jsxs("div", { children: [_jsx(SolidDialogTitle, { className: "solid-filter-dialog-title m-0", children: "Add Custom Filter" }), _jsx(SolidDialogDescription, { className: "solid-filter-dialog-subtitle m-0", children: "Apply conditions on any field with operators." })] }), _jsx(SolidDialogClose, { className: "solid-filter-dialog-close" })] }), _jsx(SolidDialogSeparator, { className: "solid-filter-dialog-sep" }), _jsx(SolidDialogBody, { className: "solid-filter-dialog-body", children: fields.length > 0 &&
+                                                    }) })] }) })] }), _jsxs("div", { className: "solid-search-overlay-footer", children: [_jsx("button", { type: "button", className: "px-3 py-2 flex flex-column solid-search-overlay-footer-action ".concat(((_t = overlayOptions[focusedIndex]) === null || _t === void 0 ? void 0 : _t.id) === "footer:custom" ? "solid-search-overlay-option-active" : ""), onClick: openCustomFilterDialog, onMouseEnter: function () {
+                                        var optIndex = overlayOptions.findIndex(function (o) { return o.id === "footer:custom"; });
+                                        if (optIndex !== -1)
+                                            setFocusedIndex(optIndex);
+                                    }, children: _jsxs("div", { className: "solid-search-overlay-footer-action-main", children: [_jsx("div", { className: "solid-search-overlay-panel-callout-icon", children: _jsx(Filter, { size: 14 }) }), _jsxs("div", { className: "solid-search-overlay-panel-callout-copy", children: [_jsx("div", { className: "solid-search-overlay-footer-title solid-search-overlay-section-title", children: "Click here to apply custom filters" }), _jsx("div", { className: "solid-search-overlay-footer-subtitle", children: "Use custom filters to apply conditions on any field using any operator." })] })] }) }), viewType === "tree" && (_jsx("button", { type: "button", className: "px-3 py-2 flex flex-column solid-search-overlay-footer-action solid-search-overlay-footer-action-secondary ".concat(((_u = overlayOptions[focusedIndex]) === null || _u === void 0 ? void 0 : _u.id) === "footer:grouping" ? "solid-search-overlay-option-active" : ""), onClick: openGroupingDialog, onMouseEnter: function () {
+                                        var optIndex = overlayOptions.findIndex(function (o) { return o.id === "footer:grouping"; });
+                                        if (optIndex !== -1)
+                                            setFocusedIndex(optIndex);
+                                    }, children: _jsxs("div", { className: "solid-search-overlay-footer-action-main", children: [_jsx("div", { className: "solid-search-overlay-panel-callout-icon", children: _jsx(Plus, { size: 14 }) }), _jsxs("div", { className: "solid-search-overlay-panel-callout-copy", children: [_jsx("div", { className: "solid-search-overlay-footer-title solid-search-overlay-section-title", children: "Click here to do custom grouping" }), _jsx("div", { className: "solid-search-overlay-footer-subtitle", children: "Configure grouping rules and aggregations for the tree view." })] })] }) }))] })] })), _jsxs(SolidDialog, { open: showGlobalSearchElement, onOpenChange: setShowGlobalSearchElement, className: "solid-global-search-filter solid-filter-dialog-shell", style: { width: "min(960px, calc(100vw - 2rem))" }, children: [_jsxs(SolidDialogHeader, { className: "solid-filter-dialog-head", children: [_jsxs("div", { children: [_jsx(SolidDialogTitle, { className: "solid-filter-dialog-title m-0", children: "Add Custom Filter" }), _jsx(SolidDialogDescription, { className: "solid-filter-dialog-subtitle m-0", children: "Apply conditions on any field with operators." })] }), _jsx(SolidDialogClose, { className: "solid-filter-dialog-close" })] }), _jsx(SolidDialogSeparator, { className: "solid-filter-dialog-sep" }), _jsx(SolidDialogBody, { className: "solid-filter-dialog-body", children: fields.length > 0 &&
                                 _jsx(FilterComponent, { viewData: viewData, fields: fields, filterRules: filterRules, setFilterRules: setFilterRules, transformFilterRules: transformCustomFilterRules, closeDialog: function () { return setShowGlobalSearchElement(false); } }) })] }), _jsxs(SolidDialog, { open: showGroupFilterElement, onOpenChange: setShowGroupFilterElement, className: "solid-global-search-filter solid-filter-dialog-shell solid-filter-dialog-shell-grouping", style: { width: "min(560px, calc(100vw - 2rem))" }, children: [_jsxs(SolidDialogHeader, { className: "solid-filter-dialog-head", children: [_jsxs("div", { children: [_jsx(SolidDialogTitle, { className: "solid-filter-dialog-title m-0", children: "Grouping" }), _jsx(SolidDialogDescription, { className: "solid-filter-dialog-subtitle m-0", children: "Configure grouping and aggregation." })] }), _jsx(SolidDialogClose, { className: "solid-filter-dialog-close" })] }), _jsx(SolidDialogSeparator, { className: "solid-filter-dialog-sep" }), _jsx(SolidDialogBody, { className: "solid-filter-dialog-body", children: groupableFields.length > 0 &&
                                 _jsx(GroupingComponent, { viewData: viewData, fields: groupableFields, groupingRules: groupingRules, setGroupingRules: setGroupingRules, aggregationRules: aggregationRules, setAggregationRules: setAggregationRules, applyGrouping: applyGrouping, closeDialog: function () { return setShowGroupFilterElement(false); } }) })] }), _jsxs(SolidDialog, { open: showSavedFilterComponent, onOpenChange: setShowSavedFilterComponent, className: "solid-global-search-filter solid-filter-dialog-shell", style: { width: "min(960px, calc(100vw - 2rem))" }, children: [_jsxs(SolidDialogHeader, { className: "solid-filter-dialog-head", children: [_jsxs("div", { children: [_jsx(SolidDialogTitle, { className: "solid-filter-dialog-title m-0", children: "Saved Filter" }), _jsx(SolidDialogDescription, { className: "solid-filter-dialog-subtitle m-0", children: "Review and refine the saved filter conditions." })] }), _jsx(SolidDialogClose, { className: "solid-filter-dialog-close" })] }), _jsx(SolidDialogSeparator, { className: "solid-filter-dialog-sep" }), _jsx(SolidDialogBody, { className: "solid-filter-dialog-body", children: fields.length > 0 &&
                                 _jsx(FilterComponent, { viewData: viewData, fields: fields, filterRules: currentSavedFilterRules, setFilterRules: setCurrentSavedFilterRules, transformFilterRules: transformSavedFilterRules, closeDialog: function () { return setShowSavedFilterComponent(false); } }) })] }), _jsxs(SolidDialog, { open: showSaveFilterPopup, onOpenChange: setShowSaveFilterPopup, className: "solid-custom-filter-dialog solid-save-filter-dialog", style: { width: "min(420px, calc(100vw - 2rem))" }, children: [_jsxs(SolidDialogHeader, { className: "solid-filter-dialog-head", children: [_jsxs("div", { children: [_jsx(SolidDialogTitle, { className: "solid-filter-dialog-title m-0", children: "Save Custom Filter" }), _jsx(SolidDialogDescription, { className: "solid-filter-dialog-subtitle m-0", children: "Name this filter so you can reuse it later." })] }), _jsx(SolidDialogClose, { className: "solid-filter-dialog-close" })] }), _jsx(SolidDialogSeparator, { className: "solid-filter-dialog-sep" }), _jsx(SolidDialogBody, { className: "solid-filter-dialog-body", children: _jsx(SolidSaveCustomFilterForm, { currentSavedFilterData: currentSavedFilterData, handleSaveFilter: handleSaveFilter, closeDialog: function () { return setShowSaveFilterPopup(false); } }) })] }), _jsxs(SolidDialog, { open: isDeleteSQDialogVisible, onOpenChange: setIsDeleteSQDialogVisible, className: "solid-confirm-dialog", style: { width: "min(420px, calc(100vw - 2rem))" }, children: [_jsxs(SolidDialogHeader, { children: [_jsxs("div", { children: [_jsx(SolidDialogTitle, { children: "Confirm Delete" }), _jsxs(SolidDialogDescription, { children: ["Are you sure you want to delete the ", currentSavedFilterData === null || currentSavedFilterData === void 0 ? void 0 : currentSavedFilterData.name, " saved query?"] })] }), _jsx(SolidDialogClose, {})] }), _jsx(SolidDialogSeparator, {}), _jsxs(SolidDialogFooter, { className: "justify-content-center", children: [_jsxs(SolidButton, { variant: "destructive", size: "sm", onClick: deleteSavedFilter, children: [_jsx(Check, { size: 14 }), "Yes"] }), _jsxs(SolidButton, { variant: "outline", size: "sm", onClick: function () { return setIsDeleteSQDialogVisible(false); }, children: [_jsx(X, { size: 14 }), "No"] })] })] })] }) }));