-
+
-
-
- {children}
-
+ {children}
+
- {listModel.items.entries.length > 0 && (
-
}
-
-
-
-
+
-
-
-
-
- {list.search && (
-
-
-
-
+
- {activeFilters}
+ {children}
{storeFiltersButton}
{resetFiltersButton}
- {removeAllFiltersButton}
+ {clearFiltersButton}
);
-});
+};
-export default ActiveFilters;
+export default ActiveFilterList;
diff --git a/packages/components/src/components/List/viewComponents/Header/FilterPicker/FilterPicker.tsx b/packages/components/src/components/List/viewComponents/Header/FilterPicker/FilterPicker.tsx
new file mode 100644
index 000000000..1135ee7d5
--- /dev/null
+++ b/packages/components/src/components/List/viewComponents/Header/FilterPicker/FilterPicker.tsx
@@ -0,0 +1,27 @@
+import type { FC, PropsWithChildren, ReactNode } from "react";
+import React from "react";
+import { Button } from "@/components/Button";
+import { Text } from "@/components/Text";
+import type { ContextMenuProps } from "@/components/ContextMenu";
+import { ContextMenu, ContextMenuTrigger } from "@/components/ContextMenu";
+import { IconFilter } from "@/components/Icon/components/icons";
+
+interface Props
+ extends Pick
+
+ );
+};
+
+export default Header;
diff --git a/packages/components/src/components/List/components/Header/components/SearchField/SearchField.tsx b/packages/components/src/components/List/viewComponents/Header/SearchField/SearchField.tsx
similarity index 54%
rename from packages/components/src/components/List/components/Header/components/SearchField/SearchField.tsx
rename to packages/components/src/components/List/viewComponents/Header/SearchField/SearchField.tsx
index c9775518a..11aa2fdc9 100644
--- a/packages/components/src/components/List/components/Header/components/SearchField/SearchField.tsx
+++ b/packages/components/src/components/List/viewComponents/Header/SearchField/SearchField.tsx
@@ -1,32 +1,37 @@
import type { FC, KeyboardEvent } from "react";
-import React, { createElement, useEffect, useState } from "react";
-import type { PropsWithClassName } from "@/lib/types/props";
-import type { Search } from "@/components/List/model/search/Search";
-import type { SearchFieldRenderComponent } from "@/components/List/model/search/types";
+import React, { useEffect, useState } from "react";
import { useOnChange } from "@/lib/hooks";
import { SearchField as SearchFieldComponent } from "@/components/SearchField";
+import type {
+ SearchShape,
+ SearchValue,
+} from "@/components/List/model/search/types";
-interface Props extends PropsWithClassName {
- search: Search
+
+ {activeFilterList}
+ {filterPickerList}
+
+ {showSearch && (
+
+
+ null}
+ >
+ {isInitiallyLoading ? null : children}
+
+
+ );
+};
+
+export default Items;
diff --git a/packages/components/src/components/List/viewComponents/Items/index.ts b/packages/components/src/components/List/viewComponents/Items/index.ts
new file mode 100644
index 000000000..45e4d7b87
--- /dev/null
+++ b/packages/components/src/components/List/viewComponents/Items/index.ts
@@ -0,0 +1,2 @@
+export * from "./Items";
+export * from "./Item";
diff --git a/packages/components/src/components/List/viewComponents/ListViewComponentsProvider.tsx b/packages/components/src/components/List/viewComponents/ListViewComponentsProvider.tsx
new file mode 100644
index 000000000..724ebe420
--- /dev/null
+++ b/packages/components/src/components/List/viewComponents/ListViewComponentsProvider.tsx
@@ -0,0 +1,36 @@
+import type Header from "@/components/List/viewComponents/Header/Header";
+import type { FC, PropsWithChildren } from "react";
+import React, { createContext, useContext } from "react";
+import type { FilterPicker } from "@/components/List/viewComponents/Header/FilterPicker/FilterPicker";
+import type { FilterPickerMenuItem } from "@/components/List/viewComponents/Header/FilterPicker/FilterPickerMenuItem";
+import type {
+ ActiveFilterItem,
+ ActiveFilterList,
+} from "@/components/List/viewComponents/Header";
+import type Fragment from "@/components/Fragment";
+import type Items from "@/components/List/viewComponents/Items/Items";
+import type Item from "@/components/List/viewComponents/Items/Item";
+
+interface Context {
+ fragment?: typeof Fragment;
+ header?: typeof Header;
+ filterPicker?: typeof FilterPicker;
+ filterPickerMenuItem?: typeof FilterPickerMenuItem;
+ activeFilterList?: typeof ActiveFilterList;
+ activeFilterItem?: typeof ActiveFilterItem;
+ items?: typeof Items;
+ item?: typeof Item;
+}
+
+const context = createContext