@keepkit/ui 0.18.0 → 0.20.0

package/dist/index.js

@@ -107,6 +107,13 @@ var DE_LABELS = {
   allTags: "Alle",
   tags: "Tags",
   filterTags: "Gespeicherte Elemente nach Tag filtern",
+  activeFilters: "Aktive Filter",
+  clearFilters: "Filter l\xF6schen",
+  clearAllFilters: "Alle Filter l\xF6schen",
+  removeFilter: "entfernen",
+  noFilteredItems: "Keine passenden Elemente gefunden.",
+  noFilteredItemsDescription: "Passe die Suche an oder entferne einen Tag-Filter.",
+  emptyStorageDescription: "Speichere ein Element, damit es hier angezeigt wird.",
   note: "Notiz",
   saveNote: "Notiz speichern",
   noItems: "Keine gespeicherten Elemente.",
@@ -186,6 +193,13 @@ var EN_LABELS = {
   allTags: "All",
   tags: "Tags",
   filterTags: "Filter saved items by tag",
+  activeFilters: "Active filters",
+  clearFilters: "Clear filters",
+  clearAllFilters: "Clear all filters",
+  removeFilter: "Remove",
+  noFilteredItems: "No matching items found.",
+  noFilteredItemsDescription: "Try adjusting your search or removing a tag filter.",
+  emptyStorageDescription: "Save an item to see it here.",
   note: "Note",
   saveNote: "Save note",
   noItems: "No saved items.",
@@ -265,6 +279,13 @@ var ES_LABELS = {
   allTags: "Todos",
   tags: "Etiquetas",
   filterTags: "Filtrar elementos guardados por etiqueta",
+  activeFilters: "Filtros activos",
+  clearFilters: "Borrar filtros",
+  clearAllFilters: "Borrar todos los filtros",
+  removeFilter: "quitar",
+  noFilteredItems: "No se encontraron elementos coincidentes.",
+  noFilteredItemsDescription: "Ajusta la b\xFAsqueda o quita un filtro de etiqueta.",
+  emptyStorageDescription: "Guarda un elemento para verlo aqu\xED.",
   note: "Nota",
   saveNote: "Guardar nota",
   noItems: "No hay elementos guardados.",
@@ -344,6 +365,13 @@ var FIL_LABELS = {
   allTags: "Lahat",
   tags: "Mga tag",
   filterTags: "I-filter ang mga naka-save na item ayon sa tag",
+  activeFilters: "Mga aktibong filter",
+  clearFilters: "I-clear ang mga filter",
+  clearAllFilters: "I-clear ang lahat ng filter",
+  removeFilter: "alisin",
+  noFilteredItems: "Walang nakitang tumutugmang item.",
+  noFilteredItemsDescription: "Baguhin ang paghahanap o alisin ang filter ng tag.",
+  emptyStorageDescription: "Mag-save ng item para makita ito rito.",
   note: "Tala",
   saveNote: "I-save ang tala",
   noItems: "Walang naka-save na item.",
@@ -423,6 +451,13 @@ var FR_LABELS = {
   allTags: "Tous",
   tags: "\xC9tiquettes",
   filterTags: "Filtrer les \xE9l\xE9ments enregistr\xE9s par \xE9tiquette",
+  activeFilters: "Filtres actifs",
+  clearFilters: "Effacer les filtres",
+  clearAllFilters: "Effacer tous les filtres",
+  removeFilter: "supprimer",
+  noFilteredItems: "Aucun \xE9l\xE9ment correspondant trouv\xE9.",
+  noFilteredItemsDescription: "Modifiez votre recherche ou supprimez un filtre de tag.",
+  emptyStorageDescription: "Enregistrez un \xE9l\xE9ment pour le voir ici.",
   note: "Note",
   saveNote: "Enregistrer la note",
   noItems: "Aucun \xE9l\xE9ment enregistr\xE9.",
@@ -502,6 +537,13 @@ var ID_LABELS = {
   allTags: "Semua",
   tags: "Tag",
   filterTags: "Filter item tersimpan berdasarkan tag",
+  activeFilters: "Filter aktif",
+  clearFilters: "Hapus filter",
+  clearAllFilters: "Hapus semua filter",
+  removeFilter: "hapus",
+  noFilteredItems: "Tidak ada item yang cocok.",
+  noFilteredItemsDescription: "Ubah pencarian atau hapus filter tag.",
+  emptyStorageDescription: "Simpan item untuk melihatnya di sini.",
   note: "Catatan",
   saveNote: "Simpan catatan",
   noItems: "Belum ada item tersimpan.",
@@ -581,6 +623,13 @@ var IT_LABELS = {
   allTags: "Tutti",
   tags: "Tag",
   filterTags: "Filtra gli elementi salvati per tag",
+  activeFilters: "Filtri attivi",
+  clearFilters: "Cancella filtri",
+  clearAllFilters: "Cancella tutti i filtri",
+  removeFilter: "rimuovi",
+  noFilteredItems: "Nessun elemento corrispondente trovato.",
+  noFilteredItemsDescription: "Modifica la ricerca o rimuovi un filtro tag.",
+  emptyStorageDescription: "Salva un elemento per visualizzarlo qui.",
   note: "Nota",
   saveNote: "Salva nota",
   noItems: "Nessun elemento salvato.",
@@ -660,6 +709,13 @@ var JA_LABELS = {
   allTags: "\u3059\u3079\u3066",
   tags: "\u30BF\u30B0",
   filterTags: "\u4FDD\u5B58\u30A2\u30A4\u30C6\u30E0\u3092\u30BF\u30B0\u3067\u7D5E\u308A\u8FBC\u3080",
+  activeFilters: "\u9069\u7528\u4E2D\u306E\u6761\u4EF6",
+  clearFilters: "\u30D5\u30A3\u30EB\u30BF\u30FC\u3092\u30AF\u30EA\u30A2",
+  clearAllFilters: "\u3059\u3079\u3066\u306E\u6761\u4EF6\u3092\u30AF\u30EA\u30A2",
+  removeFilter: "\u3092\u89E3\u9664",
+  noFilteredItems: "\u4E00\u81F4\u3059\u308B\u30A2\u30A4\u30C6\u30E0\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093\u3067\u3057\u305F",
+  noFilteredItemsDescription: "\u691C\u7D22\u8A9E\u3092\u5909\u66F4\u3059\u308B\u304B\u3001\u30BF\u30B0\u306E\u7D5E\u308A\u8FBC\u307F\u3092\u89E3\u9664\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
+  emptyStorageDescription: "\u30A2\u30A4\u30C6\u30E0\u3092\u4FDD\u5B58\u3059\u308B\u3068\u3001\u3053\u3053\u306B\u8868\u793A\u3055\u308C\u307E\u3059\u3002",
   note: "\u30E1\u30E2",
   saveNote: "\u30E1\u30E2\u3092\u4FDD\u5B58",
   noItems: "\u4FDD\u5B58\u3055\u308C\u305F\u30A2\u30A4\u30C6\u30E0\u306F\u3042\u308A\u307E\u305B\u3093\u3002",
@@ -739,6 +795,13 @@ var KO_LABELS = {
   allTags: "\uBAA8\uB450",
   tags: "\uD0DC\uADF8",
   filterTags: "\uD0DC\uADF8\uB85C \uC800\uC7A5 \uD56D\uBAA9 \uD544\uD130\uB9C1",
+  activeFilters: "\uD65C\uC131 \uD544\uD130",
+  clearFilters: "\uD544\uD130 \uC9C0\uC6B0\uAE30",
+  clearAllFilters: "\uBAA8\uB4E0 \uD544\uD130 \uC9C0\uC6B0\uAE30",
+  removeFilter: "\uC81C\uAC70",
+  noFilteredItems: "\uC77C\uCE58\uD558\uB294 \uD56D\uBAA9\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.",
+  noFilteredItemsDescription: "\uAC80\uC0C9\uC5B4\uB97C \uBC14\uAFB8\uAC70\uB098 \uD0DC\uADF8 \uD544\uD130\uB97C \uC81C\uAC70\uD574 \uBCF4\uC138\uC694.",
+  emptyStorageDescription: "\uD56D\uBAA9\uC744 \uC800\uC7A5\uD558\uBA74 \uC5EC\uAE30\uC5D0 \uD45C\uC2DC\uB429\uB2C8\uB2E4.",
   note: "\uBA54\uBAA8",
   saveNote: "\uBA54\uBAA8 \uC800\uC7A5",
   noItems: "\uC800\uC7A5\uB41C \uD56D\uBAA9\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.",
@@ -818,6 +881,13 @@ var MS_LABELS = {
   allTags: "Semua",
   tags: "Tag",
   filterTags: "Tapis item yang disimpan mengikut tag",
+  activeFilters: "Penapis aktif",
+  clearFilters: "Kosongkan penapis",
+  clearAllFilters: "Kosongkan semua penapis",
+  removeFilter: "alih keluar",
+  noFilteredItems: "Tiada item yang sepadan ditemui.",
+  noFilteredItemsDescription: "Laraskan carian atau alih keluar penapis tag.",
+  emptyStorageDescription: "Simpan item untuk melihatnya di sini.",
   note: "Nota",
   saveNote: "Simpan nota",
   noItems: "Tiada item disimpan.",
@@ -897,6 +967,13 @@ var PT_BR_LABELS = {
   allTags: "Todos",
   tags: "Tags",
   filterTags: "Filtrar itens salvos por tag",
+  activeFilters: "Filtros ativos",
+  clearFilters: "Limpar filtros",
+  clearAllFilters: "Limpar todos os filtros",
+  removeFilter: "remover",
+  noFilteredItems: "Nenhum item correspondente encontrado.",
+  noFilteredItemsDescription: "Ajuste sua busca ou remova um filtro de tag.",
+  emptyStorageDescription: "Salve um item para v\xEA-lo aqui.",
   note: "Nota",
   saveNote: "Salvar nota",
   noItems: "Nenhum item salvo.",
@@ -976,6 +1053,13 @@ var RU_LABELS = {
   allTags: "\u0412\u0441\u0435",
   tags: "\u0422\u0435\u0433\u0438",
   filterTags: "\u0424\u0438\u043B\u044C\u0442\u0440\u043E\u0432\u0430\u0442\u044C \u0441\u043E\u0445\u0440\u0430\u043D\u0451\u043D\u043D\u044B\u0435 \u044D\u043B\u0435\u043C\u0435\u043D\u0442\u044B \u043F\u043E \u0442\u0435\u0433\u0443",
+  activeFilters: "\u0410\u043A\u0442\u0438\u0432\u043D\u044B\u0435 \u0444\u0438\u043B\u044C\u0442\u0440\u044B",
+  clearFilters: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440\u044B",
+  clearAllFilters: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0432\u0441\u0435 \u0444\u0438\u043B\u044C\u0442\u0440\u044B",
+  removeFilter: "\u0443\u0434\u0430\u043B\u0438\u0442\u044C",
+  noFilteredItems: "\u041F\u043E\u0434\u0445\u043E\u0434\u044F\u0449\u0438\u0435 \u044D\u043B\u0435\u043C\u0435\u043D\u0442\u044B \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u044B.",
+  noFilteredItemsDescription: "\u0418\u0437\u043C\u0435\u043D\u0438\u0442\u0435 \u043F\u043E\u0438\u0441\u043A \u0438\u043B\u0438 \u0443\u0434\u0430\u043B\u0438\u0442\u0435 \u0444\u0438\u043B\u044C\u0442\u0440 \u0442\u0435\u0433\u0430.",
+  emptyStorageDescription: "\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u0435 \u044D\u043B\u0435\u043C\u0435\u043D\u0442, \u0447\u0442\u043E\u0431\u044B \u0443\u0432\u0438\u0434\u0435\u0442\u044C \u0435\u0433\u043E \u0437\u0434\u0435\u0441\u044C.",
   note: "\u0417\u0430\u043C\u0435\u0442\u043A\u0430",
   saveNote: "\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C \u0437\u0430\u043C\u0435\u0442\u043A\u0443",
   noItems: "\u041D\u0435\u0442 \u0441\u043E\u0445\u0440\u0430\u043D\u0451\u043D\u043D\u044B\u0445 \u044D\u043B\u0435\u043C\u0435\u043D\u0442\u043E\u0432.",
@@ -1055,6 +1139,13 @@ var TH_LABELS = {
   allTags: "\u0E17\u0E31\u0E49\u0E07\u0E2B\u0E21\u0E14",
   tags: "\u0E41\u0E17\u0E47\u0E01",
   filterTags: "\u0E01\u0E23\u0E2D\u0E07\u0E23\u0E32\u0E22\u0E01\u0E32\u0E23\u0E17\u0E35\u0E48\u0E1A\u0E31\u0E19\u0E17\u0E36\u0E01\u0E14\u0E49\u0E27\u0E22\u0E41\u0E17\u0E47\u0E01",
+  activeFilters: "\u0E15\u0E31\u0E27\u0E01\u0E23\u0E2D\u0E07\u0E17\u0E35\u0E48\u0E43\u0E0A\u0E49\u0E07\u0E32\u0E19\u0E2D\u0E22\u0E39\u0E48",
+  clearFilters: "\u0E25\u0E49\u0E32\u0E07\u0E15\u0E31\u0E27\u0E01\u0E23\u0E2D\u0E07",
+  clearAllFilters: "\u0E25\u0E49\u0E32\u0E07\u0E15\u0E31\u0E27\u0E01\u0E23\u0E2D\u0E07\u0E17\u0E31\u0E49\u0E07\u0E2B\u0E21\u0E14",
+  removeFilter: "\u0E19\u0E33\u0E2D\u0E2D\u0E01",
+  noFilteredItems: "\u0E44\u0E21\u0E48\u0E1E\u0E1A\u0E23\u0E32\u0E22\u0E01\u0E32\u0E23\u0E17\u0E35\u0E48\u0E15\u0E23\u0E07\u0E01\u0E31\u0E19",
+  noFilteredItemsDescription: "\u0E25\u0E2D\u0E07\u0E1B\u0E23\u0E31\u0E1A\u0E01\u0E32\u0E23\u0E04\u0E49\u0E19\u0E2B\u0E32\u0E2B\u0E23\u0E37\u0E2D\u0E19\u0E33\u0E15\u0E31\u0E27\u0E01\u0E23\u0E2D\u0E07\u0E41\u0E17\u0E47\u0E01\u0E2D\u0E2D\u0E01",
+  emptyStorageDescription: "\u0E1A\u0E31\u0E19\u0E17\u0E36\u0E01\u0E23\u0E32\u0E22\u0E01\u0E32\u0E23\u0E40\u0E1E\u0E37\u0E48\u0E2D\u0E14\u0E39\u0E17\u0E35\u0E48\u0E19\u0E35\u0E48",
   note: "\u0E1A\u0E31\u0E19\u0E17\u0E36\u0E01\u0E22\u0E48\u0E2D",
   saveNote: "\u0E1A\u0E31\u0E19\u0E17\u0E36\u0E01\u0E1A\u0E31\u0E19\u0E17\u0E36\u0E01\u0E22\u0E48\u0E2D",
   noItems: "\u0E44\u0E21\u0E48\u0E21\u0E35\u0E23\u0E32\u0E22\u0E01\u0E32\u0E23\u0E17\u0E35\u0E48\u0E1A\u0E31\u0E19\u0E17\u0E36\u0E01\u0E44\u0E27\u0E49",
@@ -1134,6 +1225,13 @@ var VI_LABELS = {
   allTags: "T\u1EA5t c\u1EA3",
   tags: "Th\u1EBB",
   filterTags: "L\u1ECDc m\u1EE5c \u0111\xE3 l\u01B0u theo th\u1EBB",
+  activeFilters: "B\u1ED9 l\u1ECDc \u0111ang d\xF9ng",
+  clearFilters: "X\xF3a b\u1ED9 l\u1ECDc",
+  clearAllFilters: "X\xF3a t\u1EA5t c\u1EA3 b\u1ED9 l\u1ECDc",
+  removeFilter: "x\xF3a",
+  noFilteredItems: "Kh\xF4ng t\xECm th\u1EA5y m\u1EE5c ph\xF9 h\u1EE3p.",
+  noFilteredItemsDescription: "H\xE3y \u0111i\u1EC1u ch\u1EC9nh t\xECm ki\u1EBFm ho\u1EB7c x\xF3a b\u1ED9 l\u1ECDc th\u1EBB.",
+  emptyStorageDescription: "L\u01B0u m\u1ED9t m\u1EE5c \u0111\u1EC3 xem m\u1EE5c \u0111\xF3 t\u1EA1i \u0111\xE2y.",
   note: "Ghi ch\xFA",
   saveNote: "L\u01B0u ghi ch\xFA",
   noItems: "Ch\u01B0a c\xF3 m\u1EE5c n\xE0o \u0111\u01B0\u1EE3c l\u01B0u.",
@@ -1213,6 +1311,13 @@ var ZH_HANS_LABELS = {
   allTags: "\u5168\u90E8",
   tags: "\u6807\u7B7E",
   filterTags: "\u6309\u6807\u7B7E\u7B5B\u9009\u5DF2\u4FDD\u5B58\u9879\u76EE",
+  activeFilters: "\u5F53\u524D\u7B5B\u9009\u6761\u4EF6",
+  clearFilters: "\u6E05\u9664\u7B5B\u9009",
+  clearAllFilters: "\u6E05\u9664\u6240\u6709\u7B5B\u9009\u6761\u4EF6",
+  removeFilter: "\u79FB\u9664",
+  noFilteredItems: "\u672A\u627E\u5230\u5339\u914D\u9879\u76EE\u3002",
+  noFilteredItemsDescription: "\u8BF7\u8C03\u6574\u641C\u7D22\u6761\u4EF6\u6216\u79FB\u9664\u6807\u7B7E\u7B5B\u9009\u3002",
+  emptyStorageDescription: "\u4FDD\u5B58\u9879\u76EE\u540E\u4F1A\u663E\u793A\u5728\u8FD9\u91CC\u3002",
   note: "\u5907\u6CE8",
   saveNote: "\u4FDD\u5B58\u5907\u6CE8",
   noItems: "\u6CA1\u6709\u5DF2\u4FDD\u5B58\u7684\u9879\u76EE\u3002",
@@ -1292,6 +1397,13 @@ var ZH_HANT_LABELS = {
   allTags: "\u5168\u90E8",
   tags: "\u6A19\u7C64",
   filterTags: "\u4F9D\u6A19\u7C64\u7BE9\u9078\u5DF2\u5132\u5B58\u9805\u76EE",
+  activeFilters: "\u76EE\u524D\u7BE9\u9078\u689D\u4EF6",
+  clearFilters: "\u6E05\u9664\u7BE9\u9078",
+  clearAllFilters: "\u6E05\u9664\u6240\u6709\u7BE9\u9078\u689D\u4EF6",
+  removeFilter: "\u79FB\u9664",
+  noFilteredItems: "\u627E\u4E0D\u5230\u76F8\u7B26\u9805\u76EE\u3002",
+  noFilteredItemsDescription: "\u8ACB\u8ABF\u6574\u641C\u5C0B\u689D\u4EF6\u6216\u79FB\u9664\u6A19\u7C64\u7BE9\u9078\u3002",
+  emptyStorageDescription: "\u5132\u5B58\u9805\u76EE\u5F8C\u6703\u986F\u793A\u5728\u9019\u88E1\u3002",
   note: "\u5099\u8A3B",
   saveNote: "\u5132\u5B58\u5099\u8A3B",
   noItems: "\u6C92\u6709\u5DF2\u5132\u5B58\u7684\u9805\u76EE\u3002",
@@ -1600,7 +1712,8 @@ import {
   cloneElement,
   createContext as createContext2,
   isValidElement,
-  useContext as useContext2
+  useContext as useContext2,
+  useMemo as useMemo2
 } from "react";
 import { Fragment, jsx as jsx3 } from "react/jsx-runtime";
 var KeepSearchQueryContext = createContext2(void 0);
@@ -1613,8 +1726,11 @@ function useKeepSearchQuery() {
 function KeepHighlight({ children, query }) {
   const contextQuery = useKeepSearchQuery();
   const resolvedQuery = query ?? contextQuery;
-  if (typeof children !== "string" || !resolvedQuery?.trim()) return children ?? null;
-  return highlightText(children, resolvedQuery);
+  const normalizedQuery = resolvedQuery?.trim() ?? "";
+  return useMemo2(() => {
+    if (typeof children !== "string" || !normalizedQuery) return children ?? null;
+    return highlightText(children, normalizedQuery);
+  }, [children, normalizedQuery]);
 }
 function highlightText(text, query) {
   const normalizedQuery = query.trim();
@@ -1664,10 +1780,79 @@ function sortToValue(sort) {
 function resolveContent(content, state) {
   return typeof content === "function" ? content(state) : content;
 }
+function composeRefs(...refs) {
+  return (value) => {
+    for (const ref of refs) {
+      if (typeof ref === "function") {
+        ref(value);
+      } else if (ref !== null && ref !== void 0) {
+        ref.current = value;
+      }
+    }
+  };
+}
+function chainedFunction(childHandler, parentHandler) {
+  if (!childHandler) return parentHandler;
+  if (!parentHandler) return childHandler;
+  return ((...args) => {
+    childHandler(...args);
+    parentHandler(...args);
+  });
+}
+function mergeProps(childProps, parentProps) {
+  const merged = { ...parentProps, ...childProps };
+  if ("ref" in childProps || "ref" in parentProps) {
+    merged.ref = composeRefs(
+      childProps.ref,
+      parentProps.ref
+    );
+  }
+  const className = mergeClassNames(childProps.className, parentProps.className);
+  if (className) merged.className = className;
+  const style = mergeStyles(childProps.style, parentProps.style);
+  if (style) merged.style = style;
+  for (const key of Object.keys(parentProps)) {
+    if (!isEventProp(key)) continue;
+    const chained = chainedFunction(getHandler(childProps[key]), getHandler(parentProps[key]));
+    if (chained) merged[key] = chained;
+  }
+  for (const [key, value] of Object.entries(merged)) {
+    if (value === void 0 && key.startsWith("aria-") && childProps[key] !== void 0) {
+      merged[key] = childProps[key];
+    }
+  }
+  return merged;
+}
+function getHandler(value) {
+  return typeof value === "function" ? value : void 0;
+}
+function isEventProp(key) {
+  return key.startsWith("on") && key.length > 2 && key[2] === key[2]?.toUpperCase();
+}
+function mergeClassNames(childClassName, parentClassName) {
+  const values = [childClassName, parentClassName].filter(
+    (value) => typeof value === "string" && Boolean(value)
+  );
+  return values.length > 0 ? values.join(" ") : void 0;
+}
+function mergeStyles(childStyle, parentStyle) {
+  if (!childStyle && !parentStyle) return void 0;
+  return {
+    ...isObject(childStyle) ? childStyle : {},
+    ...isObject(parentStyle) ? parentStyle : {}
+  };
+}
+function isObject(value) {
+  return typeof value === "object" && value !== null;
+}
+function createSlot(child, props, body) {
+  const nextProps = body === void 0 ? props : { ...props, children: body };
+  return cloneElement(child, mergeProps(child.props, nextProps));
+}
 function renderRoot(asChild, child, props, body, componentName) {
   if (asChild) {
     if (!isValidElement(child)) throw new Error(`${componentName} with asChild requires a single React element child.`);
-    return cloneElement(child, { ...props, children: body });
+    return createSlot(child, props, body);
   }
   return /* @__PURE__ */ jsx3("div", { ...props, children: body });
 }
@@ -2087,12 +2272,157 @@ function KeepUndo({ children, label, ...props }) {
 // src/features/collection/KeepCollection.tsx
 import { KeepErrorBoundary as KeepErrorBoundary2 } from "@keepkit/core/react";
 
+// src/features/query/KeepActiveFiltersSummary.tsx
+import {
+  isValidElement as isValidElement2,
+  useRef as useRef4
+} from "react";
+import { Fragment as Fragment4, jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+function KeepActiveFiltersSummary({
+  query,
+  search: providedSearch,
+  tags: providedTags,
+  onSearchChange,
+  onTagChange,
+  onClear,
+  children,
+  asChild = false,
+  className,
+  ...rootProps
+}) {
+  const search = (providedSearch ?? query?.search?.query ?? "").trim();
+  const tags = normalizeTags(providedTags ?? query?.tags ?? []);
+  const hasFilters = Boolean(search) || tags.length > 0;
+  const activeFiltersLabel = useUiLabel("activeFilters");
+  const clearAllLabel = useUiLabel("clearAllFilters");
+  const clearLabel = useUiLabel("clearFilters");
+  const removeLabel = useUiLabel("removeFilter");
+  const chipRefs = useRef4([]);
+  const filterCount = Number(Boolean(search)) + tags.length;
+  function focusChip(index) {
+    chipRefs.current[index]?.focus();
+  }
+  function focusAfterRemoval(index, source) {
+    const summaryRoot = source.closest('[data-keepkit="active-filters"]');
+    const fallbackScope = source.closest('[data-keepkit="collection"]') ?? summaryRoot?.parentElement ?? source.parentElement;
+    queueMicrotask(() => {
+      const nextIndex = index < filterCount - 1 ? index : index - 1;
+      const nextChip = nextIndex >= 0 ? chipRefs.current[nextIndex] : null;
+      if (nextChip?.isConnected) {
+        nextChip.focus();
+        return;
+      }
+      focusFilterFallback(fallbackScope);
+    });
+  }
+  function handleChipKeyDown(event, index) {
+    const nextIndex = event.key === "ArrowRight" ? index + 1 : event.key === "ArrowLeft" ? index - 1 : -1;
+    if (nextIndex < 0 || nextIndex >= filterCount || !chipRefs.current[nextIndex]) return;
+    event.preventDefault();
+    focusChip(nextIndex);
+  }
+  function removeSearch(event) {
+    focusAfterRemoval(0, event.currentTarget);
+    onSearchChange?.("");
+  }
+  function removeTag(tag, index, event) {
+    focusAfterRemoval(index, event.currentTarget);
+    onTagChange?.(tag);
+  }
+  const state = {
+    search,
+    tags,
+    hasFilters,
+    clear: () => onClear?.(),
+    removeSearch: () => onSearchChange?.(""),
+    removeTag: (tag) => onTagChange?.(tag)
+  };
+  const contentChildren = asChild && isElement(children) ? void 0 : children;
+  const body = typeof contentChildren === "function" ? contentChildren(state) : contentChildren ?? (hasFilters ? /* @__PURE__ */ jsxs5(Fragment4, { children: [
+    /* @__PURE__ */ jsx8("span", { "data-active-filters-label": "true", children: activeFiltersLabel }),
+    /* @__PURE__ */ jsxs5("ul", { "data-active-filters-list": "true", children: [
+      search ? /* @__PURE__ */ jsxs5("li", { "data-filter-kind": "search", children: [
+        /* @__PURE__ */ jsx8("span", { "data-filter-value": "true", children: search }),
+        /* @__PURE__ */ jsx8(
+          "button",
+          {
+            type: "button",
+            "data-keep-action": "remove-search-filter",
+            "aria-label": `${search} ${removeLabel}`,
+            ref: (element) => {
+              chipRefs.current[0] = element;
+            },
+            onKeyDown: (event) => handleChipKeyDown(event, 0),
+            onClick: removeSearch,
+            children: "\xD7"
+          }
+        )
+      ] }) : null,
+      tags.map((tag, tagIndex) => /* @__PURE__ */ jsxs5("li", { "data-filter-kind": "tag", children: [
+        /* @__PURE__ */ jsx8("span", { "data-filter-value": "true", children: tag }),
+        /* @__PURE__ */ jsx8(
+          "button",
+          {
+            type: "button",
+            "data-keep-action": "remove-tag-filter",
+            "aria-label": `${tag} ${removeLabel}`,
+            ref: (element) => {
+              chipRefs.current[tagIndex + Number(Boolean(search))] = element;
+            },
+            onKeyDown: (event) => handleChipKeyDown(event, tagIndex + Number(Boolean(search))),
+            onClick: (event) => removeTag(tag, tagIndex + Number(Boolean(search)), event),
+            children: "\xD7"
+          }
+        )
+      ] }, tag))
+    ] }),
+    /* @__PURE__ */ jsx8("button", { type: "button", "data-keep-action": "clear-filters", onClick: state.clear, children: clearAllLabel || clearLabel })
+  ] }) : null);
+  if (!hasFilters && !asChild && contentChildren === void 0) return null;
+  return renderRoot(
+    asChild,
+    isElement(children) ? children : void 0,
+    {
+      ...rootProps,
+      className,
+      "data-keepkit": "active-filters",
+      "data-state": hasFilters ? "active" : "idle",
+      "aria-label": rootProps["aria-label"] ?? activeFiltersLabel
+    },
+    body,
+    "KeepActiveFiltersSummary"
+  );
+}
+function normalizeTags(tags) {
+  return [...new Set(tags.map((tag) => tag.trim()).filter(Boolean))];
+}
+function isElement(value) {
+  return isValidElement2(value);
+}
+function focusFilterFallback(scope) {
+  const searchInput = scope?.querySelector('[data-keep-action="search"]');
+  if (searchInput) {
+    searchInput.focus();
+    return;
+  }
+  const listCard = scope?.querySelector('[data-keepkit="card"][tabindex="0"]');
+  if (listCard) {
+    listCard.focus();
+    return;
+  }
+  const list = scope?.querySelector('[data-keepkit="list"]');
+  if (list) {
+    if (!list.hasAttribute("tabindex")) list.tabIndex = -1;
+    list.focus();
+  }
+}
+
 // src/features/query/KeepTagFilter.tsx
-import { isValidElement as isValidElement2 } from "react";
+import { isValidElement as isValidElement3 } from "react";
 
 // src/features/query/hooks/useKeepTagFilter.ts
 import { useKeepList as useKeepList2 } from "@keepkit/core/react";
-import { useCallback as useCallback2, useMemo as useMemo2, useState as useState4 } from "react";
+import { useCallback as useCallback2, useMemo as useMemo3, useState as useState4 } from "react";
 function useKeepTagFilter(options) {
   const { query, controlledValue, defaultValue, onChange, onValueChange } = options;
   const [uncontrolledValue, setUncontrolledValue] = useState4(defaultValue);
@@ -2109,7 +2439,7 @@ function useKeepTagFilter(options) {
     },
     [controlledValue, onChange, onValueChange]
   );
-  const state = useMemo2(
+  const state = useMemo3(
     () => ({ tags: list.tags, tagCounts: list.tagCounts, value: resolvedValue, select }),
     [list.tagCounts, list.tags, resolvedValue, select]
   );
@@ -2121,7 +2451,7 @@ function useKeepTagFilter(options) {
 }
 
 // src/features/query/KeepTagFilter.tsx
-import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
 function KeepTagFilter({
   query,
   value: controlledValue,
@@ -2138,10 +2468,10 @@ function KeepTagFilter({
   ...rootProps
 }) {
   const view = useKeepTagFilter({ query, controlledValue, defaultValue, onChange, onValueChange });
-  const contentChildren = asChild && isValidElement2(children) ? void 0 : children;
-  const body = render ? render(view.state) : typeof contentChildren === "function" ? contentChildren(view.state) : contentChildren ?? /* @__PURE__ */ jsxs5("fieldset", { children: [
-    /* @__PURE__ */ jsx8("legend", { children: ariaLabel ?? view.labels.aria }),
-    /* @__PURE__ */ jsx8(
+  const contentChildren = asChild && isValidElement3(children) ? void 0 : children;
+  const body = render ? render(view.state) : typeof contentChildren === "function" ? contentChildren(view.state) : contentChildren ?? /* @__PURE__ */ jsxs6("fieldset", { children: [
+    /* @__PURE__ */ jsx9("legend", { children: ariaLabel ?? view.labels.aria }),
+    /* @__PURE__ */ jsx9(
       "button",
       {
         type: "button",
@@ -2151,7 +2481,7 @@ function KeepTagFilter({
         children: allLabel ?? view.labels.all
       }
     ),
-    view.state.tags.map((tag) => /* @__PURE__ */ jsxs5(
+    view.state.tags.map((tag) => /* @__PURE__ */ jsxs6(
       "button",
       {
         type: "button",
@@ -2160,7 +2490,7 @@ function KeepTagFilter({
         onClick: () => view.state.select(tag),
         children: [
           renderTag ? renderTag(tag, view.state.tagCounts[tag] ?? 0, view.state.value === tag) : tag,
-          /* @__PURE__ */ jsxs5("span", { children: [
+          /* @__PURE__ */ jsxs6("span", { children: [
             " (",
             view.state.tagCounts[tag] ?? 0,
             ")"
@@ -2172,7 +2502,7 @@ function KeepTagFilter({
   ] });
   return renderRoot(
     asChild,
-    isValidElement2(children) ? children : void 0,
+    isValidElement3(children) ? children : void 0,
     {
       ...rootProps,
       className,
@@ -2258,7 +2588,7 @@ function getVisiblePages(currentPage, pageCount, maxPageButtons) {
 }
 
 // src/features/query/query-controls.tsx
-import { Fragment as Fragment4, jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
 function KeepSearchInput({
   value: controlledValue,
   defaultValue = "",
@@ -2269,7 +2599,7 @@ function KeepSearchInput({
   ...props
 }) {
   const view = useKeepSearchInput({ controlledValue, defaultValue, debounceMs, onValueChange });
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     "input",
     {
       ...props,
@@ -2294,13 +2624,13 @@ function KeepSortSelect({
   ...props
 }) {
   const view = useKeepSortSelect({ controlledValue, defaultValue, onValueChange });
-  const options = children ?? /* @__PURE__ */ jsxs6(Fragment4, { children: [
-    /* @__PURE__ */ jsx9("option", { value: "updatedAt:desc", children: view.labels.updatedNewest }),
-    /* @__PURE__ */ jsx9("option", { value: "updatedAt:asc", children: view.labels.updatedOldest }),
-    /* @__PURE__ */ jsx9("option", { value: "savedAt:desc", children: view.labels.savedNewest }),
-    /* @__PURE__ */ jsx9("option", { value: "savedAt:asc", children: view.labels.savedOldest })
+  const options = children ?? /* @__PURE__ */ jsxs7(Fragment5, { children: [
+    /* @__PURE__ */ jsx10("option", { value: "updatedAt:desc", children: view.labels.updatedNewest }),
+    /* @__PURE__ */ jsx10("option", { value: "updatedAt:asc", children: view.labels.updatedOldest }),
+    /* @__PURE__ */ jsx10("option", { value: "savedAt:desc", children: view.labels.savedNewest }),
+    /* @__PURE__ */ jsx10("option", { value: "savedAt:asc", children: view.labels.savedOldest })
   ] });
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     "select",
     {
       ...props,
@@ -2332,9 +2662,9 @@ function KeepPagination({
     "data-state": view.pageCount > 1 ? "active" : "idle"
   };
   if (render)
-    return /* @__PURE__ */ jsx9("nav", { ...navProps, children: render({ page: view.currentPage, pageCount: view.pageCount, goToPage: view.goToPage }) });
-  return /* @__PURE__ */ jsxs6("nav", { ...navProps, children: [
-    /* @__PURE__ */ jsx9(
+    return /* @__PURE__ */ jsx10("nav", { ...navProps, children: render({ page: view.currentPage, pageCount: view.pageCount, goToPage: view.goToPage }) });
+  return /* @__PURE__ */ jsxs7("nav", { ...navProps, children: [
+    /* @__PURE__ */ jsx10(
       "button",
       {
         type: "button",
@@ -2344,7 +2674,7 @@ function KeepPagination({
         children: view.labels.previous
       }
     ),
-    view.visiblePages.map((nextPage) => /* @__PURE__ */ jsx9(
+    view.visiblePages.map((nextPage) => /* @__PURE__ */ jsx10(
       "button",
       {
         type: "button",
@@ -2356,7 +2686,7 @@ function KeepPagination({
       },
       nextPage
     )),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(
       "button",
       {
         type: "button",
@@ -2371,7 +2701,7 @@ function KeepPagination({
 
 // src/features/collection/hooks/useKeepCollection.ts
 import { useKeepList as useKeepList3 } from "@keepkit/core/react";
-import { useMemo as useMemo3, useState as useState6 } from "react";
+import { useMemo as useMemo4, useState as useState6 } from "react";
 function useKeepCollection({
   query,
   pageSize,
@@ -2389,18 +2719,18 @@ function useKeepCollection({
   };
   const [searchValue, setSearchValue] = useState6(query.search?.query ?? "");
   const [sort, setSort] = useState6(query.sort ?? { by: "updatedAt", direction: "desc" });
-  const [tag, setTag] = useState6(query.tags?.[0]);
+  const [activeTags, setActiveTags] = useState6(query.tags ?? []);
   const [page, setPage] = useState6(query.pagination?.page ?? 1);
   const resolvedPageSize = query.pagination?.pageSize ?? pageSize;
-  const resolvedQuery = useMemo3(
+  const resolvedQuery = useMemo4(
     () => ({
       ...query,
       search: enabled.search ? { ...query.search, query: searchValue } : query.search,
       sort: enabled.sort ? sort : query.sort,
-      tags: tag ? [.../* @__PURE__ */ new Set([...query.tags ?? [], tag])] : query.tags,
+      tags: activeTags.length > 0 ? activeTags : void 0,
       pagination: enabled.pagination ? { ...query.pagination, page, pageSize: resolvedPageSize } : query.pagination
     }),
-    [enabled.pagination, enabled.search, enabled.sort, page, query, resolvedPageSize, searchValue, sort, tag]
+    [activeTags, enabled.pagination, enabled.search, enabled.sort, page, query, resolvedPageSize, searchValue, sort]
   );
   useKeepUrlSync({
     enabled: Boolean(urlSync),
@@ -2409,21 +2739,23 @@ function useKeepCollection({
       const next = typeof nextOrUpdater === "function" ? nextOrUpdater(resolvedQuery) : nextOrUpdater;
       setSearchValue(next.search?.query ?? "");
       setSort(next.sort ?? { by: "updatedAt", direction: "desc" });
-      setTag(next.tags?.[0]);
+      setActiveTags(next.tags ?? []);
       setPage(next.pagination?.page ?? 1);
     },
     options: typeof urlSync === "object" ? urlSync : {},
     adapter: urlAdapter
   });
   const list = useKeepList3(resolvedQuery);
+  const allState = useKeepList3({});
   return {
     enabled,
     searchValue,
     sortValue: sortToValue(sort),
-    tag,
+    activeTags,
     resolvedPageSize,
     resolvedQuery,
     list,
+    allState,
     setSearchValue: (value) => {
       setSearchValue(value);
       setPage(1);
@@ -2433,7 +2765,16 @@ function useKeepCollection({
       setPage(1);
     },
     setTag: (value) => {
-      setTag(value);
+      setActiveTags(value ? [value] : []);
+      setPage(1);
+    },
+    removeTag: (tagToRemove) => {
+      setActiveTags((current) => current.filter((tag) => tag !== tagToRemove));
+      setPage(1);
+    },
+    clearFilters: () => {
+      setSearchValue("");
+      setActiveTags([]);
       setPage(1);
     },
     setPage
@@ -2442,13 +2783,13 @@ function useKeepCollection({
 
 // src/features/collection/KeepList.tsx
 import { KeepErrorBoundary } from "@keepkit/core/react";
-import { isValidElement as isValidElement4 } from "react";
+import { isValidElement as isValidElement6 } from "react";
 
 // src/features/item/KeepItemCard.tsx
 import {
   createContext as createContext3,
   createElement as createElement2,
-  isValidElement as isValidElement3,
+  isValidElement as isValidElement4,
   useContext as useContext3,
   useEffect as useEffect5,
   useState as useState8
@@ -2494,10 +2835,10 @@ function getDisplayStatus(status) {
 }
 
 // src/features/item/KeepItemStatusBadge.tsx
-import { Fragment as Fragment5, jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
 function KeepItemStatusBadge({ status = "available", label, className, ...props }) {
   const view = useKeepItemStatusBadge(status);
-  return /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(
     "span",
     {
       ...props,
@@ -2508,14 +2849,14 @@ function KeepItemStatusBadge({ status = "available", label, className, ...props
       "data-status": status,
       "data-item-status": view.resolvedStatus,
       children: [
-        /* @__PURE__ */ jsx10(StatusIcon, { name: view.icon }),
-        /* @__PURE__ */ jsx10("span", { "data-status-label": "true", children: label ?? view.statusLabel })
+        /* @__PURE__ */ jsx11(StatusIcon, { name: view.icon }),
+        /* @__PURE__ */ jsx11("span", { "data-status-label": "true", children: label ?? view.statusLabel })
       ]
     }
   );
 }
 function StatusIcon({ name }) {
-  return /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(
     "svg",
     {
       "data-status-icon": name,
@@ -2530,18 +2871,18 @@ function StatusIcon({ name }) {
       "aria-hidden": "true",
       focusable: "false",
       children: [
-        name === "check" ? /* @__PURE__ */ jsx10("path", { d: "m5 12 4 4L19 6" }) : null,
-        name === "clock" ? /* @__PURE__ */ jsxs7(Fragment5, { children: [
-          /* @__PURE__ */ jsx10("circle", { cx: "12", cy: "12", r: "8" }),
-          /* @__PURE__ */ jsx10("path", { d: "M12 7v5l3 2" })
+        name === "check" ? /* @__PURE__ */ jsx11("path", { d: "m5 12 4 4L19 6" }) : null,
+        name === "clock" ? /* @__PURE__ */ jsxs8(Fragment6, { children: [
+          /* @__PURE__ */ jsx11("circle", { cx: "12", cy: "12", r: "8" }),
+          /* @__PURE__ */ jsx11("path", { d: "M12 7v5l3 2" })
         ] }) : null,
-        name === "ban" ? /* @__PURE__ */ jsxs7(Fragment5, { children: [
-          /* @__PURE__ */ jsx10("circle", { cx: "12", cy: "12", r: "8" }),
-          /* @__PURE__ */ jsx10("path", { d: "m6.5 6.5 11 11" })
+        name === "ban" ? /* @__PURE__ */ jsxs8(Fragment6, { children: [
+          /* @__PURE__ */ jsx11("circle", { cx: "12", cy: "12", r: "8" }),
+          /* @__PURE__ */ jsx11("path", { d: "m6.5 6.5 11 11" })
         ] }) : null,
-        name === "lock" ? /* @__PURE__ */ jsxs7(Fragment5, { children: [
-          /* @__PURE__ */ jsx10("rect", { x: "5", y: "10", width: "14", height: "10", rx: "2" }),
-          /* @__PURE__ */ jsx10("path", { d: "M8 10V7a4 4 0 0 1 8 0v3" })
+        name === "lock" ? /* @__PURE__ */ jsxs8(Fragment6, { children: [
+          /* @__PURE__ */ jsx11("rect", { x: "5", y: "10", width: "14", height: "10", rx: "2" }),
+          /* @__PURE__ */ jsx11("path", { d: "M8 10V7a4 4 0 0 1 8 0v3" })
         ] }) : null
       ]
     }
@@ -2638,7 +2979,7 @@ function useKeepPruneStale({ statuses, onPruned }) {
 }
 
 // src/features/status/KeepStaleNotice.tsx
-import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
 function KeepStaleNotice({
   item,
   onRetry,
@@ -2650,11 +2991,11 @@ function KeepStaleNotice({
   ...props
 }) {
   const view = useKeepStaleNotice({ item, onRetry, onRemoved });
-  return /* @__PURE__ */ jsxs8("aside", { ...props, className, "data-keepkit": "stale-notice", "data-state": view.error ? "error" : "stale", children: [
-    /* @__PURE__ */ jsx11(KeepItemStatusBadge, { status: view.status }),
-    children ?? (item.statusReason ? /* @__PURE__ */ jsx11("p", { children: item.statusReason }) : null),
-    /* @__PURE__ */ jsxs8("div", { children: [
-      /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsxs9("aside", { ...props, className, "data-keepkit": "stale-notice", "data-state": view.error ? "error" : "stale", children: [
+    /* @__PURE__ */ jsx12(KeepItemStatusBadge, { status: view.status }),
+    children ?? (item.statusReason ? /* @__PURE__ */ jsx12("p", { children: item.statusReason }) : null),
+    /* @__PURE__ */ jsxs9("div", { children: [
+      /* @__PURE__ */ jsx12(
         "button",
         {
           type: "button",
@@ -2664,7 +3005,7 @@ function KeepStaleNotice({
           children: retryLabel ?? view.labels.retry
         }
       ),
-      /* @__PURE__ */ jsx11(
+      /* @__PURE__ */ jsx12(
         "button",
         {
           type: "button",
@@ -2675,7 +3016,7 @@ function KeepStaleNotice({
         }
       )
     ] }),
-    view.error ? /* @__PURE__ */ jsx11("p", { role: "alert", children: view.error instanceof Error ? view.error.message : view.labels.error }) : null
+    view.error ? /* @__PURE__ */ jsx12("p", { role: "alert", children: view.error instanceof Error ? view.error.message : view.labels.error }) : null
   ] });
 }
 function KeepPruneStaleButton({
@@ -2687,7 +3028,7 @@ function KeepPruneStaleButton({
   ...props
 }) {
   const view = useKeepPruneStale({ statuses, onPruned });
-  return /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsx12(
     "button",
     {
       ...props,
@@ -2800,7 +3141,7 @@ function getDisplayStatus2(status) {
 }
 
 // src/features/item/KeepItemCard.tsx
-import { Fragment as Fragment6, jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
 var KeepItemCardContext = createContext3(null);
 function useKeepItemCardCompound(part) {
   const context = useContext3(KeepItemCardContext);
@@ -2850,7 +3191,7 @@ function KeepItemCardRoot({
   });
   const contextQuery = useKeepSearchQuery();
   const searchQuery = highlightQuery ?? contextQuery;
-  const contentChildren = asChild && isValidElement3(children) ? void 0 : children;
+  const contentChildren = asChild && isValidElement4(children) ? void 0 : children;
   function renderLink(content) {
     if (!view.href || !view.isAvailable) return content;
     const linkProps = {
@@ -2860,12 +3201,12 @@ function KeepItemCardRoot({
       onClick: (event) => onOpen?.(item, event),
       children: content
     };
-    return LinkComponent ? /* @__PURE__ */ jsx12(LinkComponent, { ...linkProps }) : /* @__PURE__ */ jsx12("a", { ...linkProps });
+    return LinkComponent ? /* @__PURE__ */ jsx13(LinkComponent, { ...linkProps }) : /* @__PURE__ */ jsx13("a", { ...linkProps });
   }
   function renderTitle(content) {
     if (linkTarget !== "title") return content;
     if (view.isAvailable) return renderLink(content);
-    return view.href ? /* @__PURE__ */ jsx12("span", { "aria-disabled": "true", "data-link-disabled": "true", children: content }) : content;
+    return view.href ? /* @__PURE__ */ jsx13("span", { "aria-disabled": "true", "data-link-disabled": "true", children: content }) : content;
   }
   const resolvedImageProps = view.imageProps ? { ...view.imageProps, alt: imageAlt ?? view.imageProps.alt } : void 0;
   const imageSource = resolvedImageProps?.src;
@@ -2888,21 +3229,21 @@ function KeepItemCardRoot({
         setImageStatus("error");
       }
     };
-    image = renderImage?.(imagePropsWithHandlers, item) ?? (ImageComponent ? /* @__PURE__ */ jsx12(ImageComponent, { ...imagePropsWithHandlers }) : /* @__PURE__ */ jsx12("img", { ...imagePropsWithHandlers, alt: imagePropsWithHandlers.alt }));
+    image = renderImage?.(imagePropsWithHandlers, item) ?? (ImageComponent ? /* @__PURE__ */ jsx13(ImageComponent, { ...imagePropsWithHandlers }) : /* @__PURE__ */ jsx13("img", { ...imagePropsWithHandlers, alt: imagePropsWithHandlers.alt }));
   }
   const tags = showTags ? item.tags ?? [] : [];
   const renderedTags = showTags && tags.length > 0 ? renderTags?.(tags, item) ?? null : null;
-  const meta = showSavedAt ? /* @__PURE__ */ jsxs9("div", { "data-card-meta": true, children: [
-    /* @__PURE__ */ jsxs9("span", { children: [
+  const meta = showSavedAt ? /* @__PURE__ */ jsxs10("div", { "data-card-meta": true, children: [
+    /* @__PURE__ */ jsxs10("span", { children: [
       view.labels.savedAt,
       ":"
     ] }),
     " ",
-    /* @__PURE__ */ jsx12("time", { dateTime: new Date(item.savedAt).toISOString(), children: formatSavedAt(item.savedAt) })
+    /* @__PURE__ */ jsx13("time", { dateTime: new Date(item.savedAt).toISOString(), children: formatSavedAt(item.savedAt) })
   ] }) : null;
-  const error = view.itemState.error ? /* @__PURE__ */ jsx12("p", { role: "alert", children: getErrorMessage2(view.itemState.error, view.labels.error) }) : null;
-  const actions = view.statusLabel ? /* @__PURE__ */ jsx12(KeepStaleNotice, { item, onRetry, onRemoved }) : /* @__PURE__ */ jsxs9(Fragment6, { children: [
-    showSaveButton ? /* @__PURE__ */ jsx12(
+  const error = view.itemState.error ? /* @__PURE__ */ jsx13("p", { role: "alert", children: getErrorMessage2(view.itemState.error, view.labels.error) }) : null;
+  const actions = view.statusLabel ? /* @__PURE__ */ jsx13(KeepStaleNotice, { item, onRetry, onRemoved }) : /* @__PURE__ */ jsxs10(Fragment7, { children: [
+    showSaveButton ? /* @__PURE__ */ jsx13(
       KeepButton,
       {
         item: toKeepButtonItem(item),
@@ -2910,7 +3251,7 @@ function KeepItemCardRoot({
         getAriaLabel: (buttonState) => `${buttonState.isSaved ? view.labels.remove : view.labels.save} ${String(view.resolvedTitle)}`
       }
     ) : null,
-    /* @__PURE__ */ jsx12(
+    /* @__PURE__ */ jsx13(
       "button",
       {
         type: "button",
@@ -2933,18 +3274,18 @@ function KeepItemCardRoot({
     meta,
     error,
     actions,
-    renderText: (content) => /* @__PURE__ */ jsx12(KeepHighlight, { query: searchQuery, children: content })
+    renderText: (content) => /* @__PURE__ */ jsx13(KeepHighlight, { query: searchQuery, children: content })
   };
-  const defaultBody = /* @__PURE__ */ jsxs9(Fragment6, { children: [
-    /* @__PURE__ */ jsx12(KeepItemCardMedia, {}),
-    /* @__PURE__ */ jsx12(KeepItemCardContent, {}),
-    /* @__PURE__ */ jsx12(KeepItemCardActions, {})
+  const defaultBody = /* @__PURE__ */ jsxs10(Fragment7, { children: [
+    /* @__PURE__ */ jsx13(KeepItemCardMedia, {}),
+    /* @__PURE__ */ jsx13(KeepItemCardContent, {}),
+    /* @__PURE__ */ jsx13(KeepItemCardActions, {})
   ] });
   const body = render ? render(view.state) : typeof contentChildren === "function" ? contentChildren(view.state) : contentChildren ?? defaultBody;
   const linkedBody = linkTarget === "card" && view.isAvailable ? renderLink(body) : body;
   const root = renderRoot(
     asChild,
-    isValidElement3(children) ? children : void 0,
+    isValidElement4(children) ? children : void 0,
     {
       ...rootProps,
       className,
@@ -2959,18 +3300,18 @@ function KeepItemCardRoot({
     linkedBody,
     "KeepItemCard"
   );
-  return /* @__PURE__ */ jsx12(KeepItemCardContext.Provider, { value: compoundValue, children: root });
+  return /* @__PURE__ */ jsx13(KeepItemCardContext.Provider, { value: compoundValue, children: root });
 }
 function KeepItemCardMedia({ children, fallback, ...props }) {
   const context = useKeepItemCardCompound("Media");
-  return /* @__PURE__ */ jsx12("div", { ...props, "data-keep-card-part": "media", "data-media-status": context.imageStatus, "data-aspect-ratio": "1/1", children: children ?? context.image ?? /* @__PURE__ */ jsx12("span", { role: "img", "aria-label": context.fallbackLabel, "data-keep-card-fallback": "true", children: fallback ?? /* @__PURE__ */ jsx12(KeepMediaPlaceholderIcon, {}) }) });
+  return /* @__PURE__ */ jsx13("div", { ...props, "data-keep-card-part": "media", "data-media-status": context.imageStatus, "data-aspect-ratio": "1/1", children: children ?? context.image ?? /* @__PURE__ */ jsx13("span", { role: "img", "aria-label": context.fallbackLabel, "data-keep-card-fallback": "true", children: fallback ?? /* @__PURE__ */ jsx13(KeepMediaPlaceholderIcon, {}) }) });
 }
 function KeepItemCardContent({ children, ...props }) {
   const context = useKeepItemCardCompound("Content");
-  return /* @__PURE__ */ jsx12("div", { ...props, "data-keep-card-part": "content", children: children === void 0 ? /* @__PURE__ */ jsxs9(Fragment6, { children: [
-    /* @__PURE__ */ jsx12(KeepItemCardTitle, {}),
+  return /* @__PURE__ */ jsx13("div", { ...props, "data-keep-card-part": "content", children: children === void 0 ? /* @__PURE__ */ jsxs10(Fragment7, { children: [
+    /* @__PURE__ */ jsx13(KeepItemCardTitle, {}),
     context.meta,
-    /* @__PURE__ */ jsx12(KeepItemCardTags, {}),
+    /* @__PURE__ */ jsx13(KeepItemCardTags, {}),
     context.error
   ] }) : context.renderText(children) });
 }
@@ -2983,8 +3324,8 @@ function KeepItemCardTitle({ as = "h3", children, ...props }) {
   );
 }
 function KeepMediaPlaceholderIcon() {
-  return /* @__PURE__ */ jsxs9("svg", { "data-media-fallback-icon": "true", viewBox: "0 0 24 24", "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsxs10("svg", { "data-media-fallback-icon": "true", viewBox: "0 0 24 24", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx13(
       "path",
       {
         d: "M4 5.5A1.5 1.5 0 0 1 5.5 4h13A1.5 1.5 0 0 1 20 5.5v13a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 18.5v-13Z",
@@ -2992,19 +3333,19 @@ function KeepMediaPlaceholderIcon() {
         stroke: "currentColor"
       }
     ),
-    /* @__PURE__ */ jsx12("circle", { cx: "9", cy: "9", r: "1.5", fill: "currentColor" }),
-    /* @__PURE__ */ jsx12("path", { d: "m5.5 18 4.5-4.5 3 3 2-2L19 18", fill: "none", stroke: "currentColor" })
+    /* @__PURE__ */ jsx13("circle", { cx: "9", cy: "9", r: "1.5", fill: "currentColor" }),
+    /* @__PURE__ */ jsx13("path", { d: "m5.5 18 4.5-4.5 3 3 2-2L19 18", fill: "none", stroke: "currentColor" })
   ] });
 }
 function KeepItemCardTags({ children, ...props }) {
   const context = useKeepItemCardCompound("Tags");
   if (children === void 0 && context.renderedTags) return context.renderedTags;
   if (children === void 0 && context.tags.length === 0) return null;
-  return /* @__PURE__ */ jsx12("ul", { ...props, "aria-label": props["aria-label"] ?? context.tagsLabel, "data-keep-card-part": "tags", children: children ?? context.tags.map((tag) => /* @__PURE__ */ jsx12("li", { children: tag }, tag)) });
+  return /* @__PURE__ */ jsx13("ul", { ...props, "aria-label": props["aria-label"] ?? context.tagsLabel, "data-keep-card-part": "tags", children: children ?? context.tags.map((tag) => /* @__PURE__ */ jsx13("li", { children: tag }, tag)) });
 }
 function KeepItemCardActions({ children, ...props }) {
   const context = useKeepItemCardCompound("Actions");
-  return /* @__PURE__ */ jsx12("div", { ...props, "data-keep-card-part": "actions", children: children ?? context.actions });
+  return /* @__PURE__ */ jsx13("div", { ...props, "data-keep-card-part": "actions", children: children ?? context.actions });
 }
 var KeepItemCard = Object.assign(KeepItemCardRoot, {
   Media: KeepItemCardMedia,
@@ -3014,12 +3355,12 @@ var KeepItemCard = Object.assign(KeepItemCardRoot, {
   Actions: KeepItemCardActions
 });
 function KeepItemCardSkeleton({ layout = "list", ...props }) {
-  return /* @__PURE__ */ jsxs9("article", { ...props, "aria-hidden": "true", "data-keepkit": "card-skeleton", "data-layout": layout, "data-state": "loading", children: [
-    /* @__PURE__ */ jsx12("span", { "data-skeleton-part": "media" }),
-    /* @__PURE__ */ jsx12("span", { "data-skeleton-part": "title" }),
-    /* @__PURE__ */ jsx12("span", { "data-skeleton-part": "meta" }),
-    /* @__PURE__ */ jsx12("span", { "data-skeleton-part": "tag" }),
-    /* @__PURE__ */ jsx12("span", { "data-skeleton-part": "tag" })
+  return /* @__PURE__ */ jsxs10("article", { ...props, "aria-hidden": "true", "data-keepkit": "card-skeleton", "data-layout": layout, "data-state": "loading", children: [
+    /* @__PURE__ */ jsx13("span", { "data-skeleton-part": "media" }),
+    /* @__PURE__ */ jsx13("span", { "data-skeleton-part": "title" }),
+    /* @__PURE__ */ jsx13("span", { "data-skeleton-part": "meta" }),
+    /* @__PURE__ */ jsx13("span", { "data-skeleton-part": "tag" }),
+    /* @__PURE__ */ jsx13("span", { "data-skeleton-part": "tag" })
   ] });
 }
 function formatSavedAt(timestamp) {
@@ -3029,11 +3370,47 @@ function getErrorMessage2(error, fallback) {
   return error instanceof Error ? error.message : fallback;
 }
 
+// src/features/status/KeepEmptyState.tsx
+import { isValidElement as isValidElement5 } from "react";
+import { Fragment as Fragment8, jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
+function KeepEmptyState({
+  title,
+  description,
+  action,
+  children,
+  variant,
+  onClearFilters,
+  asChild = false,
+  className,
+  ...rootProps
+}) {
+  const resolvedVariant = variant ?? "empty-storage";
+  const defaultTitle = useUiLabel(resolvedVariant === "empty-filtered" ? "noFilteredItems" : "noItems");
+  const defaultDescription = useUiLabel(
+    resolvedVariant === "empty-filtered" ? "noFilteredItemsDescription" : "emptyStorageDescription"
+  );
+  const clearLabel = useUiLabel("clearFilters");
+  const contentChildren = asChild && isValidElement5(children) ? void 0 : children;
+  const body = contentChildren ?? /* @__PURE__ */ jsxs11(Fragment8, { children: [
+    /* @__PURE__ */ jsx14("h2", { children: title ?? defaultTitle }),
+    description ?? /* @__PURE__ */ jsx14("p", { children: defaultDescription }),
+    action ?? (resolvedVariant === "empty-filtered" && onClearFilters ? /* @__PURE__ */ jsx14("button", { type: "button", "data-keep-action": "clear-filters", onClick: onClearFilters, children: clearLabel }) : null)
+  ] });
+  return renderRoot(
+    asChild,
+    children,
+    { ...rootProps, className, "data-keepkit": "empty-state", "data-state": variant ?? "empty" },
+    body,
+    "KeepEmptyState"
+  );
+}
+
 // src/features/collection/hooks/useKeepListView.ts
 import { useKeepList as useKeepList4 } from "@keepkit/core/react";
 function useKeepListView(query) {
   return {
     state: useKeepList4(query),
+    allState: useKeepList4({}),
     labels: {
       loading: useUiLabel("loadingItems"),
       empty: useUiLabel("noItems"),
@@ -3043,9 +3420,9 @@ function useKeepListView(query) {
 }
 
 // src/features/collection/hooks/useRovingTabIndex.ts
-import { useCallback as useCallback3, useEffect as useEffect6, useRef as useRef4 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect6, useRef as useRef5 } from "react";
 function useRovingTabIndex() {
-  const ref = useRef4(null);
+  const ref = useRef5(null);
   const getItems = useCallback3(() => {
     const root = ref.current;
     if (!root) return [];
@@ -3108,12 +3485,12 @@ function useRovingTabIndex() {
 }
 
 // src/features/collection/KeepList.tsx
-import { Fragment as Fragment7, jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
 function KeepList(props) {
   const { fallback, onBoundaryError, boundaryResetKey, ...listProps } = props;
-  const content = /* @__PURE__ */ jsx13(KeepListContent, { ...listProps });
+  const content = /* @__PURE__ */ jsx15(KeepListContent, { ...listProps });
   if (fallback === void 0 && onBoundaryError === void 0) return content;
-  return /* @__PURE__ */ jsx13(KeepErrorBoundary, { fallback, onError: onBoundaryError, resetKey: boundaryResetKey, children: content });
+  return /* @__PURE__ */ jsx15(KeepErrorBoundary, { fallback, onError: onBoundaryError, resetKey: boundaryResetKey, children: content });
 }
 function KeepListContent({
   query,
@@ -3124,6 +3501,7 @@ function KeepListContent({
   loadingCount = 6,
   empty,
   error: errorContent,
+  onClearFilters,
   itemCardProps,
   layout = "list",
   asChild = false,
@@ -3141,14 +3519,17 @@ function KeepListContent({
     loading: renderLoading !== void 0 ? renderLoading : loading,
     loadingCount,
     loadingLabel: view.labels.loading,
-    empty: empty ?? view.labels.empty,
+    empty,
     error: errorContent ?? view.labels.error,
+    onClearFilters,
+    allItemCount: view.allState.totalCount,
+    query,
     itemCardProps,
     layout
   });
   return renderRoot(
     asChild,
-    asChild && isValidElement4(children) ? children : void 0,
+    asChild && isValidElement6(children) ? children : void 0,
     {
       ...rootProps,
       className,
@@ -3159,7 +3540,7 @@ function KeepListContent({
       "data-loading": state.isLoading ? "true" : void 0,
       "data-roving-tabindex": "true",
       role: rootProps.role ?? "group",
-      ref: roving.ref,
+      ref: composeRefs(roving.ref, rootProps.ref),
       onKeyDown: (event) => {
         onKeyDown?.(event);
         if (!event.defaultPrevented) roving.onKeyDown(event);
@@ -3169,7 +3550,7 @@ function KeepListContent({
         if (!event.defaultPrevented) roving.onFocusCapture(event);
       }
     },
-    /* @__PURE__ */ jsx13(KeepSearchQueryProvider, { query: query?.search?.query, children: body }),
+    /* @__PURE__ */ jsx15(KeepSearchQueryProvider, { query: query?.search?.query, children: body }),
     "KeepList"
   );
 }
@@ -3184,29 +3565,44 @@ function getListBody(state, options) {
   if (state.isLoading && !state.isHydrated) {
     if (options.loading !== void 0) return resolveContent(options.loading, state);
     const count = Number.isFinite(options.loadingCount) ? Math.max(0, Math.floor(options.loadingCount)) : 6;
-    return /* @__PURE__ */ jsxs10(Fragment7, { children: [
-      /* @__PURE__ */ jsx13("span", { role: "status", "data-keepkit": "loading-label", children: options.loadingLabel }),
-      /* @__PURE__ */ jsx13("ul", { "data-keepkit": "skeleton-list", "data-layout": options.layout, children: Array.from({ length: count }, (_, index) => (
+    return /* @__PURE__ */ jsxs12(Fragment9, { children: [
+      /* @__PURE__ */ jsx15("span", { role: "status", "data-keepkit": "loading-label", children: options.loadingLabel }),
+      /* @__PURE__ */ jsx15("ul", { "data-keepkit": "skeleton-list", "data-layout": options.layout, children: Array.from({ length: count }, (_, index) => (
         // biome-ignore lint/suspicious/noArrayIndexKey: Static loading placeholders never reorder.
-        /* @__PURE__ */ jsx13("li", { children: /* @__PURE__ */ jsx13(KeepItemCardSkeleton, { layout: options.layout }) }, index)
+        /* @__PURE__ */ jsx15("li", { children: /* @__PURE__ */ jsx15(KeepItemCardSkeleton, { layout: options.layout }) }, index)
       )) })
     ] });
   }
-  if (state.isHydrated && state.items.length === 0) return resolveContent(options.empty, state);
+  if (state.isHydrated && state.items.length === 0) {
+    if (options.empty !== void 0) return resolveContent(options.empty, state);
+    return /* @__PURE__ */ jsx15(
+      KeepEmptyState,
+      {
+        variant: options.allItemCount > 0 && hasActiveQueryFilters(options.query) ? "empty-filtered" : "empty-storage",
+        onClearFilters: options.onClearFilters
+      }
+    );
+  }
   if (typeof options.children === "function") return options.children(state);
-  if (options.children !== void 0 && !isValidElement4(options.children)) return options.children;
-  return /* @__PURE__ */ jsx13("ul", { "data-layout": options.layout, children: state.items.map(
-    (item) => options.renderItem ? options.renderItem(item, state) : /* @__PURE__ */ jsx13("li", { children: /* @__PURE__ */ jsx13(KeepItemCard, { item, ...options.itemCardProps }) }, item.id)
+  if (options.children !== void 0 && !isValidElement6(options.children)) return options.children;
+  return /* @__PURE__ */ jsx15("ul", { "data-layout": options.layout, children: state.items.map(
+    (item) => options.renderItem ? options.renderItem(item, state) : /* @__PURE__ */ jsx15("li", { children: /* @__PURE__ */ jsx15(KeepItemCard, { item, ...options.itemCardProps }) }, item.id)
   ) });
 }
+function hasActiveQueryFilters(query) {
+  if (!query) return false;
+  return Boolean(
+    query.search?.query?.trim() || query.tags?.some((tag) => tag.trim()) || query.targetType || query.savedBetween || query.filter
+  );
+}
 
 // src/features/collection/KeepCollection.tsx
-import { jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
 function KeepCollection(props) {
   const { fallback, onBoundaryError, boundaryResetKey, ...collectionProps } = props;
-  const content = /* @__PURE__ */ jsx14(KeepCollectionContent, { ...collectionProps });
+  const content = /* @__PURE__ */ jsx16(KeepCollectionContent, { ...collectionProps });
   if (fallback === void 0 && onBoundaryError === void 0) return content;
-  return /* @__PURE__ */ jsx14(KeepErrorBoundary2, { fallback, onError: onBoundaryError, resetKey: boundaryResetKey, children: content });
+  return /* @__PURE__ */ jsx16(KeepErrorBoundary2, { fallback, onError: onBoundaryError, resetKey: boundaryResetKey, children: content });
 }
 function KeepCollectionContent({
   query = {},
@@ -3220,13 +3616,14 @@ function KeepCollectionContent({
   loading,
   renderLoading,
   loadingCount,
+  activeFilters,
   empty,
   error,
   className,
   ...rootProps
 }) {
   const view = useKeepCollection({ query, pageSize, urlSync, urlAdapter, features });
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs13(
     "section",
     {
       ...rootProps,
@@ -3237,12 +3634,22 @@ function KeepCollectionContent({
       "data-state": getCollectionState(view.list),
       "data-loading": view.list.isLoading || view.list.isMutating ? "true" : void 0,
       children: [
-        /* @__PURE__ */ jsxs11("div", { children: [
-          view.enabled.search ? /* @__PURE__ */ jsx14(KeepSearchInput, { value: view.searchValue, onValueChange: view.setSearchValue }) : null,
-          view.enabled.sort ? /* @__PURE__ */ jsx14(KeepSortSelect, { value: view.sortValue, onValueChange: view.setSortValue }) : null,
-          view.enabled.tagFilter ? /* @__PURE__ */ jsx14(KeepTagFilter, { query, value: view.tag, onValueChange: view.setTag }) : null
+        /* @__PURE__ */ jsxs13("div", { children: [
+          view.enabled.search ? /* @__PURE__ */ jsx16(KeepSearchInput, { value: view.searchValue, onValueChange: view.setSearchValue }) : null,
+          view.enabled.sort ? /* @__PURE__ */ jsx16(KeepSortSelect, { value: view.sortValue, onValueChange: view.setSortValue }) : null,
+          view.enabled.tagFilter ? /* @__PURE__ */ jsx16(KeepTagFilter, { query, value: view.activeTags[0], onValueChange: view.setTag }) : null
         ] }),
-        /* @__PURE__ */ jsx14(
+        activeFilters === void 0 ? /* @__PURE__ */ jsx16(
+          KeepActiveFiltersSummary,
+          {
+            search: view.searchValue,
+            tags: view.activeTags,
+            onSearchChange: view.setSearchValue,
+            onTagChange: view.removeTag,
+            onClear: view.clearFilters
+          }
+        ) : resolveContent(activeFilters, view.list),
+        /* @__PURE__ */ jsx16(
           KeepList,
           {
             query: view.resolvedQuery,
@@ -3252,11 +3659,12 @@ function KeepCollectionContent({
             loading,
             renderLoading,
             loadingCount,
-            empty,
+            onClearFilters: view.clearFilters,
+            empty: view.list.totalCount === 0 && view.allState.totalCount > 0 ? void 0 : empty,
             error
           }
         ),
-        view.enabled.pagination ? /* @__PURE__ */ jsx14(
+        view.enabled.pagination ? /* @__PURE__ */ jsx16(
           KeepPagination,
           {
             totalCount: view.list.totalCount,
@@ -3265,7 +3673,7 @@ function KeepCollectionContent({
             onPageChange: view.setPage
           }
         ) : null,
-        view.enabled.bulkActions ? /* @__PURE__ */ jsx14(KeepBulkActions, { query: view.resolvedQuery }) : null
+        view.enabled.bulkActions ? /* @__PURE__ */ jsx16(KeepBulkActions, { query: view.resolvedQuery }) : null
       ]
     }
   );
@@ -3278,12 +3686,12 @@ function getCollectionState(list) {
 }
 
 // src/features/collection/KeepLayout.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 function KeepLayout({ layout = "list", children, onKeyDown, onFocusCapture, ...props }) {
   const roving = useRovingTabIndex();
   return (
     // biome-ignore lint/a11y/noStaticElementInteractions: The group manages keyboard focus for descendant cards.
-    /* @__PURE__ */ jsx15(
+    /* @__PURE__ */ jsx17(
       "div",
       {
         ...props,
@@ -3308,7 +3716,7 @@ function KeepLayout({ layout = "list", children, onKeyDown, onFocusCapture, ...p
 
 // src/features/collection/KeepReorderableList.tsx
 import { useState as useState9 } from "react";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 function KeepReorderableList({
   items,
   onReorder,
@@ -3342,7 +3750,7 @@ function KeepReorderableList({
     if (next[index] === id) return;
     commit(next);
   }
-  return /* @__PURE__ */ jsx16("ul", { ...props, "data-keepkit": "reorderable-list", children: items.map((item, index) => {
+  return /* @__PURE__ */ jsx18("ul", { ...props, "data-keepkit": "reorderable-list", children: items.map((item, index) => {
     const moveUp = () => move(index, index - 1);
     const moveDown = () => move(index, index + 1);
     const onHandleKeyDown = (event) => {
@@ -3377,7 +3785,7 @@ function KeepReorderableList({
         onKeyDown: onHandleKeyDown
       }
     };
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx18(
       "li",
       {
         "data-reorder-index": index,
@@ -3409,18 +3817,34 @@ function KeepReorderableList({
 }
 
 // src/features/editor/KeepNoteEditor.tsx
-import { isValidElement as isValidElement5 } from "react";
+import { isValidElement as isValidElement7 } from "react";
+
+// src/features/navigation/KeepShortcutHint.tsx
+import { jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
+function KeepShortcutHint({ shortcut, separator = "+", ...props }) {
+  const keys = typeof shortcut === "string" ? shortcut.split("+") : [...shortcut];
+  const occurrences = /* @__PURE__ */ new Map();
+  const keyedKeys = keys.map((key) => {
+    const occurrence = occurrences.get(key) ?? 0;
+    occurrences.set(key, occurrence + 1);
+    return { id: `${key}-${occurrence}`, value: key };
+  });
+  return /* @__PURE__ */ jsx19("span", { ...props, "data-keepkit": "shortcut-hint", "aria-hidden": props["aria-hidden"] ?? true, children: keyedKeys.map((key, index) => /* @__PURE__ */ jsxs14("span", { children: [
+    index > 0 ? /* @__PURE__ */ jsx19("span", { "data-shortcut-separator": "true", children: separator }) : null,
+    /* @__PURE__ */ jsx19("kbd", { children: key.value.trim() })
+  ] }, key.id)) });
+}
 
 // src/features/editor/hooks/useKeepNoteEditor.ts
 import { useKeepItem as useKeepItem3 } from "@keepkit/core/react";
-import { useCallback as useCallback4, useEffect as useEffect7, useRef as useRef5, useState as useState10 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect7, useRef as useRef6, useState as useState10 } from "react";
 function useKeepNoteEditor({ item, debounceMs, onSaved, onSaveError }) {
   const itemState = useKeepItem3(item);
   const { error, isMutating, item: savedItem, updateNote } = itemState;
   const [note, setNote] = useState10(item.note ?? "");
   const baselineNote = savedItem?.note ?? item.note ?? "";
   const isDirty = note !== baselineNote;
-  const lastSavedNoteRef = useRef5(void 0);
+  const lastSavedNoteRef = useRef6(void 0);
   useEffect7(() => setNote(baselineNote), [baselineNote]);
   const save = useCallback4(async () => {
     const nextNote = note.trim() || void 0;
@@ -3468,13 +3892,14 @@ function useKeepNoteEditor({ item, debounceMs, onSaved, onSaveError }) {
 }
 
 // src/features/editor/KeepNoteEditor.tsx
-import { Fragment as Fragment8, jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx20, jsxs as jsxs15 } from "react/jsx-runtime";
 function KeepNoteEditor({
   item,
   label,
   saveLabel,
   placeholder,
   debounceMs = 300,
+  showShortcutHint = false,
   onSaved,
   onSaveError,
   render,
@@ -3485,11 +3910,11 @@ function KeepNoteEditor({
 }) {
   const view = useKeepNoteEditor({ item, debounceMs, onSaved, onSaveError });
   const { error, isDirty, isSaving, note, setNote } = view.state;
-  const contentChildren = asChild && isValidElement5(children) ? void 0 : children;
-  const body = render ? render(view.state) : typeof contentChildren === "function" ? contentChildren(view.state) : contentChildren ?? /* @__PURE__ */ jsxs12(Fragment8, { children: [
-    /* @__PURE__ */ jsxs12("label", { children: [
+  const contentChildren = asChild && isValidElement7(children) ? void 0 : children;
+  const body = render ? render(view.state) : typeof contentChildren === "function" ? contentChildren(view.state) : contentChildren ?? /* @__PURE__ */ jsxs15(Fragment10, { children: [
+    /* @__PURE__ */ jsxs15("label", { children: [
       label ?? view.labels.note,
-      /* @__PURE__ */ jsx17(
+      /* @__PURE__ */ jsx20(
         "textarea",
         {
           "data-keep-action": "edit-note",
@@ -3501,10 +3926,13 @@ function KeepNoteEditor({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx17("button", { type: "submit", "data-keep-action": "save-note", disabled: isSaving, "aria-busy": isSaving, children: saveLabel ?? view.labels.save })
+    /* @__PURE__ */ jsxs15("button", { type: "submit", "data-keep-action": "save-note", disabled: isSaving, "aria-busy": isSaving, children: [
+      saveLabel ?? view.labels.save,
+      showShortcutHint ? /* @__PURE__ */ jsx20(KeepShortcutHint, { shortcut: "Ctrl+Enter" }) : null
+    ] })
   ] });
   if (!asChild) {
-    return /* @__PURE__ */ jsxs12(
+    return /* @__PURE__ */ jsxs15(
       "form",
       {
         ...formProps,
@@ -3517,14 +3945,14 @@ function KeepNoteEditor({
         "data-disabled": isSaving ? "true" : void 0,
         children: [
           body,
-          error ? /* @__PURE__ */ jsx17("p", { role: "alert", children: getErrorMessage3(error, view.labels.error) }) : null
+          error ? /* @__PURE__ */ jsx20("p", { role: "alert", children: getErrorMessage3(error, view.labels.error) }) : null
         ]
       }
     );
   }
   return renderRoot(
     true,
-    isValidElement5(children) ? children : void 0,
+    isValidElement7(children) ? children : void 0,
     {
       ...formProps,
       className,
@@ -3597,7 +4025,7 @@ function useKeepTagEditor({ item, onSaved, onSaveError }) {
 }
 
 // src/features/editor/KeepTagEditor.tsx
-import { Fragment as Fragment9, jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx21, jsxs as jsxs16 } from "react/jsx-runtime";
 function KeepTagEditor({
   item,
   availableTags = [],
@@ -3608,10 +4036,10 @@ function KeepTagEditor({
 }) {
   const view = useKeepTagEditor({ item, onSaved, onSaveError });
   const { isSaving, tags } = view.state;
-  const body = render ? render(view.state) : /* @__PURE__ */ jsxs13(Fragment9, { children: [
-    /* @__PURE__ */ jsxs13("label", { children: [
+  const body = render ? render(view.state) : /* @__PURE__ */ jsxs16(Fragment11, { children: [
+    /* @__PURE__ */ jsxs16("label", { children: [
       view.labels.tags,
-      /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsx21(
         "input",
         {
           "data-keep-action": "edit-tags",
@@ -3622,14 +4050,14 @@ function KeepTagEditor({
         }
       )
     ] }),
-    availableTags.length > 0 ? /* @__PURE__ */ jsx18("datalist", { id: `keep-tags-${item.id}`, children: availableTags.map((tag) => /* @__PURE__ */ jsx18("option", { value: tag }, tag)) }) : null,
-    /* @__PURE__ */ jsx18("ul", { "aria-label": view.labels.tags, children: tags.map((tag) => /* @__PURE__ */ jsxs13("li", { children: [
+    availableTags.length > 0 ? /* @__PURE__ */ jsx21("datalist", { id: `keep-tags-${item.id}`, children: availableTags.map((tag) => /* @__PURE__ */ jsx21("option", { value: tag }, tag)) }) : null,
+    /* @__PURE__ */ jsx21("ul", { "aria-label": view.labels.tags, children: tags.map((tag) => /* @__PURE__ */ jsxs16("li", { children: [
       tag,
-      /* @__PURE__ */ jsx18("button", { type: "button", "data-keep-action": "remove-tag", onClick: () => view.removeTag(tag), children: view.labels.remove })
+      /* @__PURE__ */ jsx21("button", { type: "button", "data-keep-action": "remove-tag", onClick: () => view.removeTag(tag), children: view.labels.remove })
     ] }, tag)) }),
-    /* @__PURE__ */ jsx18("button", { type: "submit", "data-keep-action": "apply-tags", disabled: isSaving, "aria-busy": isSaving, children: view.labels.apply })
+    /* @__PURE__ */ jsx21("button", { type: "submit", "data-keep-action": "apply-tags", disabled: isSaving, "aria-busy": isSaving, children: view.labels.apply })
   ] });
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs16(
     "form",
     {
       ...props,
@@ -3641,7 +4069,7 @@ function KeepTagEditor({
       "data-disabled": isSaving ? "true" : void 0,
       children: [
         body,
-        view.error ? /* @__PURE__ */ jsx18("p", { role: "alert", children: getErrorMessage4(view.error, view.labels.error) }) : null
+        view.error ? /* @__PURE__ */ jsx21("p", { role: "alert", children: getErrorMessage4(view.error, view.labels.error) }) : null
       ]
     }
   );
@@ -3707,7 +4135,7 @@ function isEditableTarget(target) {
 }
 
 // src/features/navigation/KeepTourBar.tsx
-import { Fragment as Fragment10, jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx22, jsxs as jsxs17 } from "react/jsx-runtime";
 function KeepTourBar({
   navigation: providedNavigation,
   currentId,
@@ -3723,9 +4151,12 @@ function KeepTourBar({
   nextLabel,
   backLabel,
   keyboardShortcuts = false,
+  showShortcutHint = false,
   shortcutOptions,
   progress,
   getItemTitle = (item) => getMetaTitle(item.meta) ?? item.id,
+  children,
+  asChild = false,
   ...props
 }) {
   const ownNavigation = useKeepNavigator({ currentId, initialIndex });
@@ -3746,16 +4177,17 @@ function KeepTourBar({
       return resolvedPrev();
     }
   });
-  return /* @__PURE__ */ jsxs14("nav", { ...props, "data-keepkit": "tour-bar", "aria-label": props["aria-label"] ?? labels.pagination, children: [
-    showProgress ? /* @__PURE__ */ jsx19("span", { "data-keepkit": "tour-progress", "aria-live": "polite", children: progress ?? `${navigation.currentPosition ?? 0} / ${navigation.items.length}` }) : null,
-    /* @__PURE__ */ jsx19(
+  const body = /* @__PURE__ */ jsxs17(Fragment12, { children: [
+    showProgress ? /* @__PURE__ */ jsx22("span", { "data-keepkit": "tour-progress", "aria-live": "polite", children: progress ?? `${navigation.currentPosition ?? 0} / ${navigation.items.length}` }) : null,
+    /* @__PURE__ */ jsx22(
       TourAction,
       {
         href: prevHref,
         disabled: !navigation.hasPrev,
         onClick: prevHref ? onPrev : resolvedPrev,
         "data-keep-action": "tour-prev",
-        preview: navigation.prevItem ? /* @__PURE__ */ jsxs14(Fragment10, { children: [
+        shortcut: showShortcutHint ? shortcutOptions?.prevKeys?.[0] ?? "K" : void 0,
+        preview: navigation.prevItem ? /* @__PURE__ */ jsxs17(Fragment12, { children: [
           previousLabel,
           ": ",
           getItemTitle(navigation.prevItem)
@@ -3763,14 +4195,15 @@ function KeepTourBar({
         children: previousLabel
       }
     ),
-    /* @__PURE__ */ jsx19(
+    /* @__PURE__ */ jsx22(
       TourAction,
       {
         href: nextHref,
         disabled: !navigation.hasNext,
         onClick: nextHref ? onNext : resolvedNext,
         "data-keep-action": "tour-next",
-        preview: navigation.nextItem ? /* @__PURE__ */ jsxs14(Fragment10, { children: [
+        shortcut: showShortcutHint ? shortcutOptions?.nextKeys?.[0] ?? "J" : void 0,
+        preview: navigation.nextItem ? /* @__PURE__ */ jsxs17(Fragment12, { children: [
           nextItemLabel,
           ": ",
           getItemTitle(navigation.nextItem)
@@ -3778,17 +4211,25 @@ function KeepTourBar({
         children: nextItemLabel
       }
     ),
-    backHref || onBack ? /* @__PURE__ */ jsx19(TourAction, { href: backHref, onClick: onBack, "data-keep-action": "tour-back", children: listLabel }) : null
+    backHref || onBack ? /* @__PURE__ */ jsx22(TourAction, { href: backHref, onClick: onBack, "data-keep-action": "tour-back", children: listLabel }) : null
   ] });
+  return renderRoot(
+    asChild,
+    children,
+    { ...props, "data-keepkit": "tour-bar", "aria-label": props["aria-label"] ?? labels.pagination },
+    body,
+    "KeepTourBar"
+  );
 }
-function TourAction({ href, disabled = false, onClick, children, preview, ...props }) {
+function TourAction({ href, disabled = false, onClick, children, preview, shortcut, ...props }) {
   const previewId = useId();
-  const content = /* @__PURE__ */ jsxs14(Fragment10, { children: [
-    /* @__PURE__ */ jsx19("span", { "data-tour-label": "true", children }),
-    preview ? /* @__PURE__ */ jsx19("small", { id: previewId, "data-tour-preview": "true", children: preview }) : null
+  const content = /* @__PURE__ */ jsxs17(Fragment12, { children: [
+    /* @__PURE__ */ jsx22("span", { "data-tour-label": "true", children }),
+    shortcut ? /* @__PURE__ */ jsx22(KeepShortcutHint, { shortcut }) : null,
+    preview ? /* @__PURE__ */ jsx22("small", { id: previewId, "data-tour-preview": "true", children: preview }) : null
   ] });
   if (href && !disabled) {
-    return /* @__PURE__ */ jsx19(
+    return /* @__PURE__ */ jsx22(
       "a",
       {
         ...props,
@@ -3800,7 +4241,7 @@ function TourAction({ href, disabled = false, onClick, children, preview, ...pro
       }
     );
   }
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx22(
     "button",
     {
       ...props,
@@ -3820,14 +4261,11 @@ function navigateTo(item, href) {
 }
 
 // src/features/status/status.tsx
-import { isValidElement as isValidElement6 } from "react";
+import { isValidElement as isValidElement8 } from "react";
 
 // src/features/status/hooks/useStatusViews.ts
 import { useKeepContext as useKeepContext4 } from "@keepkit/core/react";
-import { useEffect as useEffect10, useRef as useRef6, useState as useState12 } from "react";
-function useKeepEmptyState() {
-  return useUiLabel("noItems").replace(/\.$/, "");
-}
+import { useEffect as useEffect10, useRef as useRef7, useState as useState12 } from "react";
 function useKeepStatus(status) {
   const context = useKeepContext4();
   const resolvedStatus = status ?? getDerivedStatus(context);
@@ -3845,7 +4283,7 @@ function useKeepAnnouncements(messages) {
   const removedMessage = useUiLabel("removedMessage", messages?.remove);
   const noteSavedMessage = useUiLabel("noteSavedMessage", messages?.note);
   const [message, setMessage] = useState12("");
-  const lastChangeRef = useRef6(void 0);
+  const lastChangeRef = useRef7(void 0);
   useEffect10(() => {
     const change = context.lastChange;
     if (!change || change === lastChangeRef.current) return;
@@ -3874,31 +4312,7 @@ function getStatusLabelKey3(status) {
 }
 
 // src/features/status/status.tsx
-import { Fragment as Fragment11, jsx as jsx20, jsxs as jsxs15 } from "react/jsx-runtime";
-function KeepEmptyState({
-  title,
-  description,
-  action,
-  children,
-  asChild = false,
-  className,
-  ...rootProps
-}) {
-  const defaultTitle = useKeepEmptyState();
-  const contentChildren = asChild && isValidElement6(children) ? void 0 : children;
-  const body = contentChildren ?? /* @__PURE__ */ jsxs15(Fragment11, { children: [
-    /* @__PURE__ */ jsx20("h2", { children: title ?? defaultTitle }),
-    description ? /* @__PURE__ */ jsx20("p", { children: description }) : null,
-    action
-  ] });
-  return renderRoot(
-    asChild,
-    children,
-    { ...rootProps, className, "data-keepkit": "empty-state", "data-state": "empty" },
-    body,
-    "KeepEmptyState"
-  );
-}
+import { jsx as jsx23 } from "react/jsx-runtime";
 function KeepStatus({
   status,
   labels,
@@ -3909,12 +4323,12 @@ function KeepStatus({
   ...rootProps
 }) {
   const view = useKeepStatus(status);
-  const contentChildren = asChild && isValidElement6(children) ? void 0 : children;
+  const contentChildren = asChild && isValidElement8(children) ? void 0 : children;
   const body = render ? render(view.state) : typeof contentChildren === "function" ? contentChildren(view.state) : contentChildren ?? labels?.[view.state.status] ?? view.defaultLabel;
   const role = rootProps.role ?? (view.state.status === "error" ? "alert" : "status");
   return renderRoot(
     asChild,
-    isValidElement6(children) ? children : void 0,
+    isValidElement8(children) ? children : void 0,
     {
       ...rootProps,
       className,
@@ -3930,7 +4344,7 @@ function KeepStatus({
 }
 function KeepAnnouncements({ messages, ...props }) {
   const message = useKeepAnnouncements(messages);
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx23(
     "div",
     {
       ...props,
@@ -3947,13 +4361,13 @@ var KeepAnnouncer = KeepAnnouncements;
 
 // src/features/sync/hooks/useKeepSyncFeedback.ts
 import { useKeepContext as useKeepContext5 } from "@keepkit/core/react";
-import { useEffect as useEffect11, useRef as useRef7 } from "react";
+import { useEffect as useEffect11, useRef as useRef8 } from "react";
 function useKeepSyncFeedback() {
   const { syncState } = useKeepContext5();
   const emitFeedback = useKeepUiFeedback();
   const completedMessage = useUiLabel("syncSynced");
   const failedMessage = useUiLabel("syncFailedMessage");
-  const previousStatus = useRef7("idle");
+  const previousStatus = useRef8("idle");
   useEffect11(() => {
     const previous = previousStatus.current;
     previousStatus.current = syncState.status;
@@ -4029,7 +4443,7 @@ function useKeepSyncRecoveryDialog(options) {
 }
 
 // src/features/sync/KeepSyncRecoveryDialog.tsx
-import { jsx as jsx21, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
 function KeepSyncRecoveryDialog({
   open,
   onOpenChange,
@@ -4044,7 +4458,7 @@ function KeepSyncRecoveryDialog({
 }) {
   const view = useKeepSyncRecoveryDialog({ open, onOpenChange, conflicts, onManualMerge });
   if (!view.isOpen) return null;
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs18(
     "section",
     {
       ...props,
@@ -4058,17 +4472,17 @@ function KeepSyncRecoveryDialog({
       "data-state": view.conflictList.length > 0 ? "conflict" : "error",
       "data-loading": view.busyId !== void 0 ? "true" : void 0,
       children: [
-        /* @__PURE__ */ jsxs16("header", { children: [
-          /* @__PURE__ */ jsx21("h2", { id: "keepkit-sync-recovery-title", children: title ?? view.labels.title }),
-          /* @__PURE__ */ jsx21("button", { type: "button", "data-keep-action": "close-dialog", onClick: view.close, "aria-label": view.labels.close, children: view.labels.close })
+        /* @__PURE__ */ jsxs18("header", { children: [
+          /* @__PURE__ */ jsx24("h2", { id: "keepkit-sync-recovery-title", children: title ?? view.labels.title }),
+          /* @__PURE__ */ jsx24("button", { type: "button", "data-keep-action": "close-dialog", onClick: view.close, "aria-label": view.labels.close, children: view.labels.close })
         ] }),
         children,
-        view.conflictList.length > 0 ? /* @__PURE__ */ jsxs16("div", { children: [
-          /* @__PURE__ */ jsx21("p", { children: view.labels.conflict }),
-          view.conflictList.map((conflict) => /* @__PURE__ */ jsxs16("article", { "data-conflict-id": conflict.id, children: [
-            /* @__PURE__ */ jsx21("h3", { children: getMetaTitle(conflict.operation.item?.meta) ?? conflict.id }),
-            /* @__PURE__ */ jsxs16("div", { "data-conflict-preview": true, children: [
-              /* @__PURE__ */ jsx21(
+        view.conflictList.length > 0 ? /* @__PURE__ */ jsxs18("div", { children: [
+          /* @__PURE__ */ jsx24("p", { children: view.labels.conflict }),
+          view.conflictList.map((conflict) => /* @__PURE__ */ jsxs18("article", { "data-conflict-id": conflict.id, children: [
+            /* @__PURE__ */ jsx24("h3", { children: getMetaTitle(conflict.operation.item?.meta) ?? conflict.id }),
+            /* @__PURE__ */ jsxs18("div", { "data-conflict-preview": true, children: [
+              /* @__PURE__ */ jsx24(
                 ConflictPreview,
                 {
                   item: conflict.operation.item,
@@ -4078,7 +4492,7 @@ function KeepSyncRecoveryDialog({
                   side: "local"
                 }
               ),
-              /* @__PURE__ */ jsx21(
+              /* @__PURE__ */ jsx24(
                 ConflictPreview,
                 {
                   item: conflict.remote,
@@ -4089,8 +4503,8 @@ function KeepSyncRecoveryDialog({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs16("div", { children: [
-              /* @__PURE__ */ jsx21(
+            /* @__PURE__ */ jsxs18("div", { children: [
+              /* @__PURE__ */ jsx24(
                 "button",
                 {
                   type: "button",
@@ -4100,7 +4514,7 @@ function KeepSyncRecoveryDialog({
                   children: view.labels.keepLocal
                 }
               ),
-              /* @__PURE__ */ jsx21(
+              /* @__PURE__ */ jsx24(
                 "button",
                 {
                   type: "button",
@@ -4110,7 +4524,7 @@ function KeepSyncRecoveryDialog({
                   children: view.labels.useServer
                 }
               ),
-              /* @__PURE__ */ jsx21(
+              /* @__PURE__ */ jsx24(
                 "button",
                 {
                   type: "button",
@@ -4123,12 +4537,12 @@ function KeepSyncRecoveryDialog({
             ] })
           ] }, conflict.id))
         ] }) : null,
-        view.showBackupRecovery ? /* @__PURE__ */ jsxs16("section", { "data-recovery": "backup", children: [
-          /* @__PURE__ */ jsx21("h3", { children: view.labels.backupRecovery }),
-          /* @__PURE__ */ jsx21("p", { children: view.labels.backupRecoveryDescription }),
-          backup ?? (showBackupControls ? /* @__PURE__ */ jsx21(KeepBackup, {}) : null)
+        view.showBackupRecovery ? /* @__PURE__ */ jsxs18("section", { "data-recovery": "backup", children: [
+          /* @__PURE__ */ jsx24("h3", { children: view.labels.backupRecovery }),
+          /* @__PURE__ */ jsx24("p", { children: view.labels.backupRecoveryDescription }),
+          backup ?? (showBackupControls ? /* @__PURE__ */ jsx24(KeepBackup, {}) : null)
         ] }) : null,
-        view.error ? /* @__PURE__ */ jsx21("p", { id: "keepkit-sync-recovery-error", role: "alert", "aria-live": "assertive", children: view.error instanceof Error ? view.error.message : view.labels.error }) : null
+        view.error ? /* @__PURE__ */ jsx24("p", { id: "keepkit-sync-recovery-error", role: "alert", "aria-live": "assertive", children: view.error instanceof Error ? view.error.message : view.labels.error }) : null
       ]
     }
   );
@@ -4140,16 +4554,16 @@ function ConflictPreview({
   noteLabel,
   side
 }) {
-  return /* @__PURE__ */ jsxs16("article", { "data-conflict-version": side, "aria-label": heading, children: [
-    /* @__PURE__ */ jsx21("h4", { children: heading }),
-    /* @__PURE__ */ jsxs16("dl", { children: [
-      /* @__PURE__ */ jsxs16("div", { children: [
-        /* @__PURE__ */ jsx21("dt", { children: updatedAtLabel }),
-        /* @__PURE__ */ jsx21("dd", { children: item ? /* @__PURE__ */ jsx21("time", { dateTime: new Date(item.updatedAt).toISOString(), children: formatConflictDate(item.updatedAt) }) : "\u2014" })
+  return /* @__PURE__ */ jsxs18("article", { "data-conflict-version": side, "aria-label": heading, children: [
+    /* @__PURE__ */ jsx24("h4", { children: heading }),
+    /* @__PURE__ */ jsxs18("dl", { children: [
+      /* @__PURE__ */ jsxs18("div", { children: [
+        /* @__PURE__ */ jsx24("dt", { children: updatedAtLabel }),
+        /* @__PURE__ */ jsx24("dd", { children: item ? /* @__PURE__ */ jsx24("time", { dateTime: new Date(item.updatedAt).toISOString(), children: formatConflictDate(item.updatedAt) }) : "\u2014" })
       ] }),
-      /* @__PURE__ */ jsxs16("div", { children: [
-        /* @__PURE__ */ jsx21("dt", { children: noteLabel }),
-        /* @__PURE__ */ jsx21("dd", { children: item?.note || "\u2014" })
+      /* @__PURE__ */ jsxs18("div", { children: [
+        /* @__PURE__ */ jsx24("dt", { children: noteLabel }),
+        /* @__PURE__ */ jsx24("dd", { children: item?.note || "\u2014" })
       ] })
     ] })
   ] });
@@ -4193,7 +4607,7 @@ function getErrorMessage5(error) {
 }
 
 // src/features/sync/KeepSyncStatusBanner.tsx
-import { jsx as jsx22, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
 function KeepSyncStatusBanner({
   onRetry,
   onResolveConflicts,
@@ -4203,7 +4617,7 @@ function KeepSyncStatusBanner({
 }) {
   const view = useKeepSyncStatusBanner({ onRetry, children });
   if (view.status === "idle" && !view.hasConflicts) return null;
-  return /* @__PURE__ */ jsxs17(
+  return /* @__PURE__ */ jsxs19(
     "aside",
     {
       ...props,
@@ -4213,8 +4627,8 @@ function KeepSyncStatusBanner({
       "data-keepkit": "sync-status",
       "data-state": view.status,
       children: [
-        /* @__PURE__ */ jsx22("p", { children: view.message }),
-        view.showRetry ? /* @__PURE__ */ jsx22(
+        /* @__PURE__ */ jsx25("p", { children: view.message }),
+        view.showRetry ? /* @__PURE__ */ jsx25(
           "button",
           {
             type: "button",
@@ -4224,7 +4638,7 @@ function KeepSyncStatusBanner({
             children: view.retryLabel
           }
         ) : null,
-        view.hasConflicts ? /* @__PURE__ */ jsx22(
+        view.hasConflicts ? /* @__PURE__ */ jsx25(
           "button",
           {
             type: "button",
@@ -4240,8 +4654,8 @@ function KeepSyncStatusBanner({
 }
 
 // src/foundation/theme.tsx
-import { cloneElement as cloneElement2, isValidElement as isValidElement7 } from "react";
-import { jsx as jsx23 } from "react/jsx-runtime";
+import { isValidElement as isValidElement9 } from "react";
+import { jsx as jsx26 } from "react/jsx-runtime";
 var keepThemeNames = [
   "default",
   "ocean",
@@ -4296,11 +4710,11 @@ function KeepThemeProvider({
     "data-reduced-motion": reducedMotion ? "true" : void 0
   };
   if (asChild) {
-    if (!isValidElement7(children))
+    if (!isValidElement9(children))
       throw new Error("KeepThemeProvider with asChild requires a single React element child.");
-    return cloneElement2(children, rootProps);
+    return createSlot(children, rootProps);
   }
-  return /* @__PURE__ */ jsx23("div", { ...rootProps, children });
+  return /* @__PURE__ */ jsx26("div", { ...rootProps, children });
 }
 
 // src/index.tsx
@@ -4324,7 +4738,7 @@ import {
   LocalStorageSyncQueueAdapter,
   SyncStorageAdapter
 } from "@keepkit/core/storage";
-import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
 function KeepKitProvider({
   labels,
   locale,
@@ -4344,7 +4758,7 @@ function KeepKitProvider({
   children,
   ...providerProps
 }) {
-  return /* @__PURE__ */ jsx24(KeepUiProvider, { labels, locale, labelResolver, onFeedback, children: /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx27(KeepUiProvider, { labels, locale, labelResolver, onFeedback, children: /* @__PURE__ */ jsx27(
     KeepThemeProvider,
     {
       theme,
@@ -4358,10 +4772,10 @@ function KeepKitProvider({
       className: themeClassName,
       style: themeStyle,
       asChild: themeAsChild,
-      children: /* @__PURE__ */ jsxs18(CoreKeepProvider, { ...providerProps, children: [
-        /* @__PURE__ */ jsx24(KeepSyncFeedbackObserver, {}),
+      children: /* @__PURE__ */ jsxs20(CoreKeepProvider, { ...providerProps, children: [
+        /* @__PURE__ */ jsx27(KeepSyncFeedbackObserver, {}),
         children,
-        /* @__PURE__ */ jsx24(KeepAnnouncements, {})
+        /* @__PURE__ */ jsx27(KeepAnnouncements, {})
       ] })
     }
   ) });
@@ -4388,7 +4802,7 @@ function createKeepKit(options = {}) {
   } = options;
   const coreKit = createCoreKeepKit(coreOptions);
   return {
-    Provider: (props) => /* @__PURE__ */ jsx24(
+    Provider: (props) => /* @__PURE__ */ jsx27(
       KeepKitProvider,
       {
         ...coreOptions,
@@ -4409,9 +4823,9 @@ function createKeepKit(options = {}) {
         ...props
       }
     ),
-    Button: (props) => /* @__PURE__ */ jsx24(KeepButton, { ...props }),
-    Backup: (props) => /* @__PURE__ */ jsx24(KeepBackup, { ...props }),
-    Collection: (props) => /* @__PURE__ */ jsx24(
+    Button: (props) => /* @__PURE__ */ jsx27(KeepButton, { ...props }),
+    Backup: (props) => /* @__PURE__ */ jsx27(KeepBackup, { ...props }),
+    Collection: (props) => /* @__PURE__ */ jsx27(
       KeepCollection,
       {
         ...props,
@@ -4433,6 +4847,7 @@ export {
   FallbackStorageAdapter,
   IndexedDBAdapter,
   IndexedDBSyncQueueAdapter,
+  KeepActiveFiltersSummary,
   KeepAnnouncements,
   KeepAnnouncer,
   KeepBackup,
@@ -4456,6 +4871,7 @@ export {
   KeepPruneStaleButton,
   KeepReorderableList,
   KeepSearchInput,
+  KeepShortcutHint,
   KeepSortSelect,
   KeepStaleNotice,
   KeepStatus,
@@ -4470,15 +4886,19 @@ export {
   LocalStorageAdapter,
   LocalStorageSyncQueueAdapter,
   SyncStorageAdapter,
+  chainedFunction,
+  composeRefs,
   createAuthenticatedSyncKit,
   createBrowserStorageAdapter,
   createKeepKit,
   createNextPagesRouterAdapter,
+  createSlot,
   createStorageAdapter,
   getKeepLocaleLabels,
   highlightText,
   isAllSelected,
   keepThemeNames,
+  mergeProps,
   toggleSelectAll,
   useKeepContext8 as useKeepContext,
   useKeepItem5 as useKeepItem,