@solidxai/core-ui 0.1.14-beta.9 → 0.1.15-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/common/DropzonePlaceholder.d.ts +2 -1
- package/dist/components/common/DropzonePlaceholder.d.ts.map +1 -1
- package/dist/components/common/DropzonePlaceholder.js +10 -7
- package/dist/components/common/DropzonePlaceholder.js.map +1 -1
- package/dist/components/common/DropzonePlaceholder.tsx +14 -9
- package/dist/components/core/card/CardItem.js +1 -1
- package/dist/components/core/card/CardItem.js.map +1 -1
- package/dist/components/core/card/CardItem.tsx +1 -1
- package/dist/components/core/card/SolidCardView.d.ts.map +1 -1
- package/dist/components/core/card/SolidCardView.js +2 -2
- package/dist/components/core/card/SolidCardView.js.map +1 -1
- package/dist/components/core/card/SolidCardView.tsx +7 -12
- package/dist/components/core/common/SolidGlobalSearchElement.d.ts.map +1 -1
- package/dist/components/core/common/SolidGlobalSearchElement.js +101 -86
- package/dist/components/core/common/SolidGlobalSearchElement.js.map +1 -1
- package/dist/components/core/common/SolidGlobalSearchElement.tsx +161 -98
- package/dist/components/core/form/SolidFormView.d.ts.map +1 -1
- package/dist/components/core/form/SolidFormView.js +96 -72
- package/dist/components/core/form/SolidFormView.js.map +1 -1
- package/dist/components/core/form/SolidFormView.tsx +39 -17
- package/dist/components/core/form/fields/SolidMediaMultipleField.d.ts.map +1 -1
- package/dist/components/core/form/fields/SolidMediaMultipleField.js +3 -2
- package/dist/components/core/form/fields/SolidMediaMultipleField.js.map +1 -1
- package/dist/components/core/form/fields/SolidMediaMultipleField.tsx +3 -1
- package/dist/components/core/form/fields/SolidMediaSingleField.d.ts.map +1 -1
- package/dist/components/core/form/fields/SolidMediaSingleField.js +3 -2
- package/dist/components/core/form/fields/SolidMediaSingleField.js.map +1 -1
- package/dist/components/core/form/fields/SolidMediaSingleField.tsx +3 -1
- package/dist/components/core/form/fields/relations/SolidRelationManyToManyField.d.ts +1 -0
- package/dist/components/core/form/fields/relations/SolidRelationManyToManyField.d.ts.map +1 -1
- package/dist/components/core/form/fields/relations/SolidRelationManyToManyField.js +20 -2
- package/dist/components/core/form/fields/relations/SolidRelationManyToManyField.js.map +1 -1
- package/dist/components/core/form/fields/relations/SolidRelationManyToManyField.tsx +29 -2
- package/dist/components/core/form/fields/solidFields.module.css +7 -0
- package/dist/components/core/kanban/KanbanCard.js +1 -1
- package/dist/components/core/kanban/KanbanCard.js.map +1 -1
- package/dist/components/core/kanban/KanbanCard.tsx +1 -1
- package/dist/components/core/kanban/SolidKanbanView.d.ts.map +1 -1
- package/dist/components/core/kanban/SolidKanbanView.js +7 -1
- package/dist/components/core/kanban/SolidKanbanView.js.map +1 -1
- package/dist/components/core/kanban/SolidKanbanView.tsx +10 -5
- package/dist/components/core/list/SolidListView.d.ts.map +1 -1
- package/dist/components/core/list/SolidListView.js +44 -88
- package/dist/components/core/list/SolidListView.js.map +1 -1
- package/dist/components/core/list/SolidListView.tsx +19 -93
- package/dist/components/core/list/SolidListViewColumn.d.ts +2 -1
- package/dist/components/core/list/SolidListViewColumn.d.ts.map +1 -1
- package/dist/components/core/list/SolidListViewColumn.js +2 -2
- package/dist/components/core/list/SolidListViewColumn.js.map +1 -1
- package/dist/components/core/list/SolidListViewColumn.tsx +4 -3
- package/dist/components/core/list/columns/SolidRelationColumn.d.ts +1 -1
- package/dist/components/core/list/columns/SolidRelationColumn.d.ts.map +1 -1
- package/dist/components/core/list/columns/SolidRelationColumn.js +2 -2
- package/dist/components/core/list/columns/SolidRelationColumn.js.map +1 -1
- package/dist/components/core/list/columns/SolidRelationColumn.tsx +2 -2
- package/dist/components/core/list/columns/relations/SolidRelationManyToOneColumn.d.ts +2 -2
- package/dist/components/core/list/columns/relations/SolidRelationManyToOneColumn.d.ts.map +1 -1
- package/dist/components/core/list/columns/relations/SolidRelationManyToOneColumn.js +5 -4
- package/dist/components/core/list/columns/relations/SolidRelationManyToOneColumn.js.map +1 -1
- package/dist/components/core/list/columns/relations/SolidRelationManyToOneColumn.tsx +5 -4
- package/dist/components/core/model/FieldMetaDataForm.d.ts.map +1 -1
- package/dist/components/core/model/FieldMetaDataForm.js +147 -97
- package/dist/components/core/model/FieldMetaDataForm.js.map +1 -1
- package/dist/components/core/model/FieldMetaDataForm.tsx +123 -31
- package/dist/components/core/tree/SolidTreeView.d.ts.map +1 -1
- package/dist/components/core/tree/SolidTreeView.js +1 -1
- package/dist/components/core/tree/SolidTreeView.js.map +1 -1
- package/dist/components/core/tree/SolidTreeView.tsx +4 -12
- package/dist/components/layout/AdminHeaderActions.js +1 -1
- package/dist/components/layout/AdminHeaderActions.js.map +1 -1
- package/dist/components/layout/AdminHeaderActions.tsx +1 -1
- package/dist/helpers/getAcceptedFileTypes.d.ts +12 -2
- package/dist/helpers/getAcceptedFileTypes.d.ts.map +1 -1
- package/dist/helpers/getAcceptedFileTypes.js +72 -16
- package/dist/helpers/getAcceptedFileTypes.js.map +1 -1
- package/dist/helpers/getAcceptedFileTypes.tsx +101 -18
- package/dist/helpers/registry.js +2 -1
- package/dist/helpers/registry.js.map +1 -1
- package/dist/helpers/registry.ts +3 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.ts +1 -2
- package/dist/resources/globals.css +259 -109
- package/dist/resources/solid-responsive.css +1 -5
- package/dist/resources/solid-tailwind-generated.css +1 -1
- package/dist/resources/themes/solid-light-modern/theme.css +3 -4
- package/dist/types/index.d.ts +2 -4
- package/dist/types/solid-core.d.ts +4 -13
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
|
|
1
|
+
import React, { forwardRef, useCallback, useEffect, useId, useImperativeHandle, useMemo, useRef, useState } from "react";
|
|
2
2
|
import FilterComponent, { FilterOperator, FilterRule, FilterRuleType } from "../../../components/core/common/FilterComponent";
|
|
3
3
|
import { toTitleCase } from "../../../helpers/helpers";
|
|
4
4
|
import {clearFilterObjectFromLocalStorage,getFilterObjectFromLocalStorage,setFilterObjectToLocalStorage,
|
|
@@ -11,7 +11,7 @@ import { hydrateRelationRules } from "../../../helpers/hydrateRelationRules";
|
|
|
11
11
|
import { useSession } from '../../../hooks/useSession'
|
|
12
12
|
import { getUnboundSavedFilterVariableNames, parseSavedFilterQueryJson, resolveSavedFilterVariables } from '../../../helpers/resolveActiveUserId';
|
|
13
13
|
import GroupingComponent, { AggregationRule, GroupingRule, DateGroupingFormat } from "./GroupingComponent";
|
|
14
|
-
import { Bookmark, Check, Filter,
|
|
14
|
+
import { Bookmark, Check, Filter, Pencil, Plus, Search, SearchX, Sparkles, Trash2, X } from "lucide-react";
|
|
15
15
|
import { SolidButton } from "../../shad-cn-ui/SolidButton";
|
|
16
16
|
import { SolidInput } from "../../shad-cn-ui/SolidInput";
|
|
17
17
|
import {
|
|
@@ -418,7 +418,7 @@ export const mergeAllDiffFilters = (customFilter: any, searchFilter: any, savedF
|
|
|
418
418
|
return filters;
|
|
419
419
|
}
|
|
420
420
|
|
|
421
|
-
const SavedFilterList = ({ savedfilter, activeSavedFilterReference, applySavedFilter, openSavedCustomFilter, setSavedFilterTobeDeleted, setIsDeleteSQDialogVisible, isFocused, onMouseEnter }: any) => {
|
|
421
|
+
const SavedFilterList = ({ savedfilter, activeSavedFilterReference, applySavedFilter, openSavedCustomFilter, setSavedFilterTobeDeleted, setIsDeleteSQDialogVisible, isFocused, onMouseEnter, optionId }: any) => {
|
|
422
422
|
const isActive = savedfilter?.systemKey
|
|
423
423
|
? activeSavedFilterReference === savedfilter.systemKey
|
|
424
424
|
: String(activeSavedFilterReference) === String(savedfilter.id);
|
|
@@ -430,13 +430,32 @@ const SavedFilterList = ({ savedfilter, activeSavedFilterReference, applySavedFi
|
|
|
430
430
|
variant="ghost"
|
|
431
431
|
size="sm"
|
|
432
432
|
className={`solid-saved-filter-main w-full ${isActive ? "is-active" : ""} ${isFocused ? "solid-search-overlay-option-active" : ""}`}
|
|
433
|
+
id={optionId}
|
|
434
|
+
role="option"
|
|
435
|
+
aria-selected={isFocused}
|
|
436
|
+
aria-label={`${savedfilter.name}${isActive ? ", applied" : ""}`}
|
|
433
437
|
onMouseDown={(e) => {
|
|
434
438
|
e.preventDefault();
|
|
435
439
|
applySavedFilter(savedfilter);
|
|
436
440
|
}}
|
|
437
441
|
title={savedfilter?.description}
|
|
438
442
|
>
|
|
439
|
-
|
|
443
|
+
<span className="solid-search-overlay-option-content">
|
|
444
|
+
<span className="solid-search-overlay-option-icon" aria-hidden="true">
|
|
445
|
+
<Bookmark size={15} />
|
|
446
|
+
</span>
|
|
447
|
+
<span className="solid-search-overlay-option-copy">
|
|
448
|
+
<span className="solid-search-overlay-option-title">{savedfilter.name}</span>
|
|
449
|
+
{savedfilter?.description && (
|
|
450
|
+
<span className="solid-search-overlay-option-description">{savedfilter.description}</span>
|
|
451
|
+
)}
|
|
452
|
+
</span>
|
|
453
|
+
{isActive && (
|
|
454
|
+
<span className="solid-search-overlay-option-check" aria-hidden="true">
|
|
455
|
+
<Check size={14} />
|
|
456
|
+
</span>
|
|
457
|
+
)}
|
|
458
|
+
</span>
|
|
440
459
|
</SolidButton>
|
|
441
460
|
</div>
|
|
442
461
|
<div className="solid-saved-filter-actions">
|
|
@@ -450,6 +469,7 @@ const SavedFilterList = ({ savedfilter, activeSavedFilterReference, applySavedFi
|
|
|
450
469
|
e.preventDefault();
|
|
451
470
|
openSavedCustomFilter(savedfilter);
|
|
452
471
|
}}
|
|
472
|
+
aria-label={`Edit ${savedfilter.name}`}
|
|
453
473
|
>
|
|
454
474
|
<Pencil size={14} />
|
|
455
475
|
</SolidButton>
|
|
@@ -462,6 +482,7 @@ const SavedFilterList = ({ savedfilter, activeSavedFilterReference, applySavedFi
|
|
|
462
482
|
setSavedFilterTobeDeleted(savedfilter.id),
|
|
463
483
|
setIsDeleteSQDialogVisible(true);
|
|
464
484
|
}}
|
|
485
|
+
aria-label={`Delete ${savedfilter.name}`}
|
|
465
486
|
>
|
|
466
487
|
<Trash2 size={14} />
|
|
467
488
|
</SolidButton>
|
|
@@ -550,16 +571,19 @@ type RelationCache = Map<string, { label: string; value: number }>;
|
|
|
550
571
|
|
|
551
572
|
|
|
552
573
|
|
|
553
|
-
export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handleApplyCustomFilter, showSaveFilterPopup, setShowSaveFilterPopup, filterPredicates
|
|
574
|
+
export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handleApplyCustomFilter, showSaveFilterPopup, setShowSaveFilterPopup, filterPredicates }: any, ref) => {
|
|
554
575
|
type OverlayOption =
|
|
555
576
|
| { id: string; kind: "field"; field: any }
|
|
556
577
|
| { id: string; kind: "predefined"; predefined: any }
|
|
557
578
|
| { id: string; kind: "saved"; saved: any }
|
|
558
579
|
| { id: string; kind: "custom" }
|
|
559
580
|
| { id: string; kind: "grouping" };
|
|
581
|
+
const overlayInstanceId = useId();
|
|
582
|
+
const overlayListboxId = `${overlayInstanceId}-search-options`;
|
|
583
|
+
const getOverlayOptionId = (index: number) => `${overlayInstanceId}-search-option-${index}`;
|
|
560
584
|
type ManagedChipItem = {
|
|
561
585
|
id: string;
|
|
562
|
-
type: "saved" | "search" | "predefined" | "custom" | "grouping"
|
|
586
|
+
type: "saved" | "search" | "predefined" | "custom" | "grouping";
|
|
563
587
|
label: string;
|
|
564
588
|
onRemove: () => void;
|
|
565
589
|
onOpen?: () => void;
|
|
@@ -678,7 +702,7 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
678
702
|
|
|
679
703
|
useEffect(() => {
|
|
680
704
|
if (focusedIndex >= 0 && showOverlay) {
|
|
681
|
-
const activeElement =
|
|
705
|
+
const activeElement = overlayRef.current?.querySelector(`.solid-search-overlay-option-active`);
|
|
682
706
|
if (activeElement) {
|
|
683
707
|
activeElement.scrollIntoView({
|
|
684
708
|
block: 'nearest',
|
|
@@ -1529,6 +1553,25 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
1529
1553
|
return false;
|
|
1530
1554
|
}
|
|
1531
1555
|
|
|
1556
|
+
// Applying the already-active filter must be a no-op. This is important
|
|
1557
|
+
// for lifecycle extensions: applying a filter causes a new list load,
|
|
1558
|
+
// which invokes onBeforeListDataLoad/onListLoad again.
|
|
1559
|
+
const sameSavedFilterReference =
|
|
1560
|
+
(currentSavedFilterData?.id != null &&
|
|
1561
|
+
savedfilter?.id != null &&
|
|
1562
|
+
areFilterStateValuesEqual(currentSavedFilterData.id, savedfilter.id)) ||
|
|
1563
|
+
(currentSavedFilterData?.systemKey != null &&
|
|
1564
|
+
savedfilter?.systemKey != null &&
|
|
1565
|
+
areFilterStateValuesEqual(currentSavedFilterData.systemKey, savedfilter.systemKey));
|
|
1566
|
+
const sameSavedFilter =
|
|
1567
|
+
sameSavedFilterReference &&
|
|
1568
|
+
areFilterStateValuesEqual(currentSavedFilterQuery, filterJson) &&
|
|
1569
|
+
areFilterStateValuesEqual(currentSavedFilterVariables, variables);
|
|
1570
|
+
|
|
1571
|
+
if (sameSavedFilter) {
|
|
1572
|
+
return true;
|
|
1573
|
+
}
|
|
1574
|
+
|
|
1532
1575
|
setSearchChips([]);
|
|
1533
1576
|
setSearchFilter(null);
|
|
1534
1577
|
setFilterRules(initialState);
|
|
@@ -1705,16 +1748,6 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
1705
1748
|
});
|
|
1706
1749
|
});
|
|
1707
1750
|
|
|
1708
|
-
(definedFilters || []).forEach((definedFilter: any) => {
|
|
1709
|
-
if (!definedFilter?.applied) return;
|
|
1710
|
-
items.push({
|
|
1711
|
-
id: `handler:${definedFilter.key}`,
|
|
1712
|
-
type: "handler",
|
|
1713
|
-
label: definedFilter.label,
|
|
1714
|
-
onRemove: () => onRemoveDefinedFilter?.(definedFilter.key),
|
|
1715
|
-
});
|
|
1716
|
-
});
|
|
1717
|
-
|
|
1718
1751
|
return items;
|
|
1719
1752
|
}, [
|
|
1720
1753
|
currentSavedFilterData,
|
|
@@ -1724,8 +1757,6 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
1724
1757
|
groupingRules,
|
|
1725
1758
|
groupedSearchChips,
|
|
1726
1759
|
searchableFields,
|
|
1727
|
-
definedFilters,
|
|
1728
|
-
onRemoveDefinedFilter,
|
|
1729
1760
|
]);
|
|
1730
1761
|
|
|
1731
1762
|
const MAX_VISIBLE_CHIPS = 3;
|
|
@@ -1784,7 +1815,7 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
1784
1815
|
}]
|
|
1785
1816
|
: [];
|
|
1786
1817
|
|
|
1787
|
-
return [...
|
|
1818
|
+
return [...predefined, ...fields, ...saved, ...custom, ...grouping];
|
|
1788
1819
|
}, [inputValue, searchableFields, predefinedSearches, selectableSavedFilters, viewType]);
|
|
1789
1820
|
|
|
1790
1821
|
const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
|
|
@@ -1808,6 +1839,12 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
1808
1839
|
setShowOverlay(false);
|
|
1809
1840
|
};
|
|
1810
1841
|
|
|
1842
|
+
if (e.key === "Escape") {
|
|
1843
|
+
e.preventDefault();
|
|
1844
|
+
setShowOverlay(false);
|
|
1845
|
+
return;
|
|
1846
|
+
}
|
|
1847
|
+
|
|
1811
1848
|
if ((e.key === "ArrowDown" || e.key === "ArrowUp") && overlayOptions.length > 0) {
|
|
1812
1849
|
e.preventDefault();
|
|
1813
1850
|
setShowOverlay(true);
|
|
@@ -1819,6 +1856,12 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
1819
1856
|
return;
|
|
1820
1857
|
}
|
|
1821
1858
|
|
|
1859
|
+
if ((e.key === "Home" || e.key === "End") && showOverlay && overlayOptions.length > 0) {
|
|
1860
|
+
e.preventDefault();
|
|
1861
|
+
setFocusedIndex(e.key === "Home" ? 0 : overlayOptions.length - 1);
|
|
1862
|
+
return;
|
|
1863
|
+
}
|
|
1864
|
+
|
|
1822
1865
|
if (e.key === "Enter") {
|
|
1823
1866
|
if (currentValue || focusedIndex >= 0) {
|
|
1824
1867
|
e.preventDefault();
|
|
@@ -2036,7 +2079,13 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2036
2079
|
ref={searchInputRef}
|
|
2037
2080
|
className="solid-global-search-input"
|
|
2038
2081
|
value={inputValue || ""}
|
|
2039
|
-
placeholder="Search
|
|
2082
|
+
placeholder="Search…"
|
|
2083
|
+
role="combobox"
|
|
2084
|
+
aria-label="Search and filter"
|
|
2085
|
+
aria-autocomplete="list"
|
|
2086
|
+
aria-expanded={showOverlay}
|
|
2087
|
+
aria-controls={showOverlay ? overlayListboxId : undefined}
|
|
2088
|
+
aria-activedescendant={showOverlay && focusedIndex >= 0 ? getOverlayOptionId(focusedIndex) : undefined}
|
|
2040
2089
|
onChange={(e) => {
|
|
2041
2090
|
setInputValue(e.target.value);
|
|
2042
2091
|
setShowChipManager(false);
|
|
@@ -2067,6 +2116,7 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2067
2116
|
focusSearchInput();
|
|
2068
2117
|
}}
|
|
2069
2118
|
className="custom-filter-button solid-global-search-trigger"
|
|
2119
|
+
aria-label="Open search options"
|
|
2070
2120
|
>
|
|
2071
2121
|
<Search size={14} />
|
|
2072
2122
|
</SolidButton>
|
|
@@ -2111,53 +2161,77 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2111
2161
|
)} */}
|
|
2112
2162
|
|
|
2113
2163
|
{showOverlay && (
|
|
2114
|
-
<div
|
|
2164
|
+
<div
|
|
2165
|
+
ref={overlayRef}
|
|
2166
|
+
id={overlayListboxId}
|
|
2167
|
+
role="listbox"
|
|
2168
|
+
aria-label="Search and filter options"
|
|
2169
|
+
className="solid-search-overlay-panel"
|
|
2170
|
+
>
|
|
2115
2171
|
<div className="solid-search-overlay-scroll">
|
|
2116
|
-
{(definedFilters || []).some((f: any) => !f?.applied) && (
|
|
2117
|
-
<>
|
|
2118
|
-
<div className="custom-filter-search-options solid-search-overlay-section flex flex-col px-3 py-2">
|
|
2119
|
-
<h6 className="my-1 solid-search-overlay-heading solid-search-overlay-section-title solid-search-overlay-heading-with-icon">
|
|
2120
|
-
<ListFilter size={13} />
|
|
2121
|
-
<span>Defined filters</span>
|
|
2122
|
-
</h6>
|
|
2123
|
-
<div className="solid-defined-filter-badge-row">
|
|
2124
|
-
{(definedFilters || [])
|
|
2125
|
-
.filter((f: any) => !f?.applied)
|
|
2126
|
-
.map((definedFilter: any) => (
|
|
2127
|
-
<button
|
|
2128
|
-
key={definedFilter.key}
|
|
2129
|
-
type="button"
|
|
2130
|
-
className="solid-defined-filter-badge"
|
|
2131
|
-
onMouseDown={(e) => {
|
|
2132
|
-
e.preventDefault();
|
|
2133
|
-
onApplyDefinedFilter?.(definedFilter.key);
|
|
2134
|
-
setShowOverlay(false);
|
|
2135
|
-
}}
|
|
2136
|
-
>
|
|
2137
|
-
<Plus size={12} />
|
|
2138
|
-
<span className="solid-defined-filter-badge-label">{definedFilter.label}</span>
|
|
2139
|
-
</button>
|
|
2140
|
-
))}
|
|
2141
|
-
</div>
|
|
2142
|
-
</div>
|
|
2143
|
-
<div className="solid-filter-dialog-sep" />
|
|
2144
|
-
</>
|
|
2145
|
-
)}
|
|
2146
2172
|
{inputValue ? (
|
|
2147
2173
|
<>
|
|
2148
|
-
|
|
2174
|
+
{predefinedSearches && predefinedSearches.length > 0 && (
|
|
2175
|
+
<>
|
|
2176
|
+
<div className="solid-search-overlay-section solid-search-overlay-section--predefined">
|
|
2177
|
+
<h6 className="my-1 solid-search-overlay-heading solid-search-overlay-section-title solid-search-overlay-heading-with-icon">
|
|
2178
|
+
<Sparkles size={14} />
|
|
2179
|
+
<span>Suggested searches</span>
|
|
2180
|
+
<span className="solid-search-overlay-section-count">{predefinedSearches.length}</span>
|
|
2181
|
+
</h6>
|
|
2182
|
+
{predefinedSearches.map((predefinedSearch: any, index: number) => {
|
|
2183
|
+
const optionIndex = overlayOptions.findIndex((option) => option.id === `predefined:${predefinedSearch.name || index}`);
|
|
2184
|
+
return (
|
|
2185
|
+
<SolidButton
|
|
2186
|
+
key={index}
|
|
2187
|
+
id={getOverlayOptionId(optionIndex)}
|
|
2188
|
+
role="option"
|
|
2189
|
+
aria-selected={focusedIndex === optionIndex}
|
|
2190
|
+
variant="ghost"
|
|
2191
|
+
size="sm"
|
|
2192
|
+
className={`text-color solid-search-overlay-option ${focusedIndex === optionIndex ? "solid-search-overlay-option-active" : ""}`}
|
|
2193
|
+
onMouseDown={(e) => {
|
|
2194
|
+
e.preventDefault();
|
|
2195
|
+
handlePredefinedSearch(predefinedSearch);
|
|
2196
|
+
}}
|
|
2197
|
+
onMouseEnter={() => setFocusedIndex(optionIndex)}
|
|
2198
|
+
>
|
|
2199
|
+
<span className="solid-search-overlay-option-content">
|
|
2200
|
+
<span className="solid-search-overlay-option-icon" aria-hidden="true">
|
|
2201
|
+
<Sparkles size={15} />
|
|
2202
|
+
</span>
|
|
2203
|
+
<span className="solid-search-overlay-option-copy">
|
|
2204
|
+
<span className="solid-search-overlay-option-title">{predefinedSearch.name}</span>
|
|
2205
|
+
<span className="solid-search-overlay-option-description">
|
|
2206
|
+
Search for “{inputValue}”{predefinedSearch.description ? ` — ${predefinedSearch.description}` : ""}
|
|
2207
|
+
</span>
|
|
2208
|
+
</span>
|
|
2209
|
+
</span>
|
|
2210
|
+
</SolidButton>
|
|
2211
|
+
);
|
|
2212
|
+
})}
|
|
2213
|
+
</div>
|
|
2214
|
+
<div className="solid-filter-dialog-sep" />
|
|
2215
|
+
</>
|
|
2216
|
+
)}
|
|
2217
|
+
<div className="solid-search-overlay-section solid-search-overlay-section--search">
|
|
2149
2218
|
<h6 className="my-1 solid-search-overlay-heading solid-search-overlay-section-title solid-search-overlay-heading-with-icon">
|
|
2150
2219
|
<Search size={13} />
|
|
2151
|
-
<span>Search
|
|
2220
|
+
<span>Search individual fields</span>
|
|
2221
|
+
<span className="solid-search-overlay-section-count">{searchableFields.length}</span>
|
|
2152
2222
|
</h6>
|
|
2153
2223
|
{searchableFields.length > 0 ? (
|
|
2154
2224
|
searchableFields.map((value: any, index: number) => {
|
|
2225
|
+
const optionIndex = overlayOptions.findIndex((option) => option.id === `field:${value.fieldName}`);
|
|
2155
2226
|
return (
|
|
2156
2227
|
<SolidButton
|
|
2157
2228
|
key={index}
|
|
2229
|
+
id={getOverlayOptionId(optionIndex)}
|
|
2230
|
+
role="option"
|
|
2231
|
+
aria-selected={focusedIndex === optionIndex}
|
|
2158
2232
|
variant="ghost"
|
|
2159
2233
|
size="sm"
|
|
2160
|
-
className={`
|
|
2234
|
+
className={`text-color solid-search-overlay-option ${focusedIndex === optionIndex ? "solid-search-overlay-option-active" : ""}`}
|
|
2161
2235
|
onMouseDown={(e) => {
|
|
2162
2236
|
e.preventDefault();
|
|
2163
2237
|
const currentValue = inputValue?.trim();
|
|
@@ -2177,9 +2251,17 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2177
2251
|
setShowOverlay(false);
|
|
2178
2252
|
}
|
|
2179
2253
|
}}
|
|
2180
|
-
onMouseEnter={() => setFocusedIndex(
|
|
2254
|
+
onMouseEnter={() => setFocusedIndex(optionIndex)}
|
|
2181
2255
|
>
|
|
2182
|
-
|
|
2256
|
+
<span className="solid-search-overlay-option-content">
|
|
2257
|
+
<span className="solid-search-overlay-option-icon" aria-hidden="true">
|
|
2258
|
+
<Search size={15} />
|
|
2259
|
+
</span>
|
|
2260
|
+
<span className="solid-search-overlay-option-copy">
|
|
2261
|
+
<span className="solid-search-overlay-option-title">{toTitleCase(value.displayName.trim())}</span>
|
|
2262
|
+
<span className="solid-search-overlay-option-description">Search for “{inputValue}”</span>
|
|
2263
|
+
</span>
|
|
2264
|
+
</span>
|
|
2183
2265
|
</SolidButton>
|
|
2184
2266
|
)
|
|
2185
2267
|
})
|
|
@@ -2194,37 +2276,10 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2194
2276
|
</div>
|
|
2195
2277
|
)}
|
|
2196
2278
|
</div>
|
|
2197
|
-
{predefinedSearches && predefinedSearches.length > 0 && (
|
|
2198
|
-
<>
|
|
2199
|
-
<div className="solid-filter-dialog-sep" />
|
|
2200
|
-
<div className="custom-filter-search-options solid-search-overlay-section flex flex-col px-3 py-1">
|
|
2201
|
-
<h6 className="my-1 solid-search-overlay-heading solid-search-overlay-section-title">Predefined searches</h6>
|
|
2202
|
-
{predefinedSearches.map((predefinedSearch: any, index: number) => (
|
|
2203
|
-
<SolidButton
|
|
2204
|
-
key={index}
|
|
2205
|
-
variant="ghost"
|
|
2206
|
-
size="sm"
|
|
2207
|
-
className={`flex flex-col items-start gap-1 text-color solid-search-overlay-option solid-search-overlay-option-stacked ${focusedIndex === searchableFields.length + index ? "solid-search-overlay-option-active" : ""}`}
|
|
2208
|
-
onMouseDown={(e) => {
|
|
2209
|
-
e.preventDefault();
|
|
2210
|
-
handlePredefinedSearch(predefinedSearch);
|
|
2211
|
-
}}
|
|
2212
|
-
onMouseEnter={() => setFocusedIndex(searchableFields.length + index)}
|
|
2213
|
-
>
|
|
2214
|
-
<div className="flex items-center gap-1">
|
|
2215
|
-
<strong>{predefinedSearch.name}:</strong>
|
|
2216
|
-
<span className="font-bold text-color pr-1">{inputValue} </span>
|
|
2217
|
-
</div>
|
|
2218
|
-
<div className="text-xs">{predefinedSearch.description}</div>
|
|
2219
|
-
</SolidButton>
|
|
2220
|
-
))}
|
|
2221
|
-
</div>
|
|
2222
|
-
</>
|
|
2223
|
-
)}
|
|
2224
2279
|
</>
|
|
2225
2280
|
) :
|
|
2226
2281
|
<>
|
|
2227
|
-
<div className="
|
|
2282
|
+
<div className="solid-search-overlay-empty">
|
|
2228
2283
|
<div className="solid-search-overlay-panel-callout">
|
|
2229
2284
|
<div className="solid-search-overlay-panel-callout-icon">
|
|
2230
2285
|
<Search size={13} />
|
|
@@ -2234,7 +2289,7 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2234
2289
|
Start typing to search
|
|
2235
2290
|
</div>
|
|
2236
2291
|
<div className="solid-search-overlay-empty-subtitle">
|
|
2237
|
-
|
|
2292
|
+
Enter a value to see suggested searches and searchable {searchableEntityLabel} fields.
|
|
2238
2293
|
</div>
|
|
2239
2294
|
</div>
|
|
2240
2295
|
</div>
|
|
@@ -2244,19 +2299,20 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2244
2299
|
}
|
|
2245
2300
|
{selectableSavedFilters.length > 0 &&
|
|
2246
2301
|
<>
|
|
2247
|
-
<
|
|
2302
|
+
<hr className="solid-search-overlay-section-separator" />
|
|
2303
|
+
<div className="solid-search-overlay-section solid-search-overlay-section--saved">
|
|
2248
2304
|
<div className="solid-search-overlay-panel-callout solid-search-overlay-panel-callout-compact">
|
|
2249
2305
|
<div className="solid-search-overlay-panel-callout-icon">
|
|
2250
2306
|
<Bookmark size={13} />
|
|
2251
2307
|
</div>
|
|
2252
2308
|
<div className="solid-search-overlay-panel-callout-copy">
|
|
2253
|
-
<p className="solid-search-overlay-heading solid-search-overlay-section-title">
|
|
2254
|
-
|
|
2255
|
-
|
|
2256
|
-
</
|
|
2309
|
+
<p className="solid-search-overlay-heading solid-search-overlay-section-title">
|
|
2310
|
+
<span>Saved filters</span>
|
|
2311
|
+
<span className="solid-search-overlay-section-count">{selectableSavedFilters.length}</span>
|
|
2312
|
+
</p>
|
|
2257
2313
|
</div>
|
|
2258
2314
|
</div>
|
|
2259
|
-
<div className="
|
|
2315
|
+
<div className="solid-search-overlay-saved-list">
|
|
2260
2316
|
{selectableSavedFilters.map((savedfilter: any, index: number) => (
|
|
2261
2317
|
<SavedFilterList
|
|
2262
2318
|
key={savedfilter.id}
|
|
@@ -2271,6 +2327,7 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2271
2327
|
const optIndex = overlayOptions.findIndex(o => o.id === `saved:${savedfilter.id}`);
|
|
2272
2328
|
if (optIndex !== -1) setFocusedIndex(optIndex);
|
|
2273
2329
|
}}
|
|
2330
|
+
optionId={getOverlayOptionId(overlayOptions.findIndex(o => o.id === `saved:${savedfilter.id}`))}
|
|
2274
2331
|
/>
|
|
2275
2332
|
))}
|
|
2276
2333
|
</div>
|
|
@@ -2282,7 +2339,10 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2282
2339
|
<div className="solid-search-overlay-footer">
|
|
2283
2340
|
<button
|
|
2284
2341
|
type="button"
|
|
2285
|
-
|
|
2342
|
+
id={getOverlayOptionId(overlayOptions.findIndex((option) => option.id === "footer:custom"))}
|
|
2343
|
+
role="option"
|
|
2344
|
+
aria-selected={overlayOptions[focusedIndex]?.id === "footer:custom"}
|
|
2345
|
+
className={`solid-search-overlay-footer-action solid-search-overlay-footer-action--custom ${overlayOptions[focusedIndex]?.id === "footer:custom" ? "solid-search-overlay-option-active" : ""}`}
|
|
2286
2346
|
onMouseDown={(event) => {
|
|
2287
2347
|
event.preventDefault();
|
|
2288
2348
|
openCustomFilterDialog();
|
|
@@ -2298,10 +2358,10 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2298
2358
|
</div>
|
|
2299
2359
|
<div className="solid-search-overlay-panel-callout-copy">
|
|
2300
2360
|
<div className="solid-search-overlay-footer-title solid-search-overlay-section-title">
|
|
2301
|
-
|
|
2361
|
+
Advanced filters
|
|
2302
2362
|
</div>
|
|
2303
2363
|
<div className="solid-search-overlay-footer-subtitle">
|
|
2304
|
-
|
|
2364
|
+
Combine fields, operators and values.
|
|
2305
2365
|
</div>
|
|
2306
2366
|
</div>
|
|
2307
2367
|
</div>
|
|
@@ -2309,7 +2369,10 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2309
2369
|
{viewType === "tree" && (
|
|
2310
2370
|
<button
|
|
2311
2371
|
type="button"
|
|
2312
|
-
|
|
2372
|
+
id={getOverlayOptionId(overlayOptions.findIndex((option) => option.id === "footer:grouping"))}
|
|
2373
|
+
role="option"
|
|
2374
|
+
aria-selected={overlayOptions[focusedIndex]?.id === "footer:grouping"}
|
|
2375
|
+
className={`solid-search-overlay-footer-action solid-search-overlay-footer-action-secondary ${overlayOptions[focusedIndex]?.id === "footer:grouping" ? "solid-search-overlay-option-active" : ""}`}
|
|
2313
2376
|
onMouseDown={(event) => {
|
|
2314
2377
|
event.preventDefault();
|
|
2315
2378
|
openGroupingDialog();
|
|
@@ -2325,10 +2388,10 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, viewType, handle
|
|
|
2325
2388
|
</div>
|
|
2326
2389
|
<div className="solid-search-overlay-panel-callout-copy">
|
|
2327
2390
|
<div className="solid-search-overlay-footer-title solid-search-overlay-section-title">
|
|
2328
|
-
|
|
2391
|
+
Group and aggregate
|
|
2329
2392
|
</div>
|
|
2330
2393
|
<div className="solid-search-overlay-footer-subtitle">
|
|
2331
|
-
|
|
2394
|
+
Organise records and calculate aggregate values.
|
|
2332
2395
|
</div>
|
|
2333
2396
|
</div>
|
|
2334
2397
|
</div>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SolidFormView.d.ts","sourceRoot":"","sources":["../../../../src/components/core/form/SolidFormView.tsx"],"names":[],"mappings":"AA+DA,MAAM,MAAM,kBAAkB,GAAG;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,OAAO,CAAC;IACjB,gBAAgB,CAAC,EAAE,GAAG,CAAC;IACvB,mBAAmB,CAAC,EAAE,GAAG,CAAA;IACzB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,gCAAgC,CAAC,EAAE,OAAO,CAAC;IAC3C,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAChC,CAAC;
|
|
1
|
+
{"version":3,"file":"SolidFormView.d.ts","sourceRoot":"","sources":["../../../../src/components/core/form/SolidFormView.tsx"],"names":[],"mappings":"AA+DA,MAAM,MAAM,kBAAkB,GAAG;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,OAAO,CAAC;IACjB,gBAAgB,CAAC,EAAE,GAAG,CAAC;IACvB,mBAAmB,CAAC,EAAE,GAAG,CAAA;IACzB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,gCAAgC,CAAC,EAAE,OAAO,CAAC;IAC3C,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAChC,CAAC;AA6IF,eAAO,MAAM,uBAAuB,WAAY,GAAG,EAAE,KAAG,GAQvD,CAAA;AACD,eAAO,MAAM,sBAAsB,QAAS,MAAM,uBAAuB,OAAO,MAAM,EAAE,GAAG,CAAC,QAa3F,CAAC;AAkXF,QAAA,MAAM,aAAa,WAAY,kBAAkB,4CA++ChD,CAAC;AAEF,eAAe,aAAa,CAAC"}
|