@keepkit/core 0.16.0 → 0.18.0

package/dist/react.js

@@ -2,23 +2,34 @@
 import {
   KeepStore,
   exportItems,
+  getKeepNavigationState,
   importItems,
   isKeepItemMetadataStale,
+  moveKeepItem,
+  orderKeepItems,
   queryKeepItems,
+  reorderKeepItems,
   revalidateKeepItems
-} from "./chunk-MDTL5L64.js";
+} from "./chunk-62I2YZYI.js";
 import {
   parseKeepMeta
-} from "./chunk-THZ3ACR2.js";
+} from "./chunk-5W4QSJHV.js";
 import {
   createBrowserStorageAdapter,
   normalizeKeepTags
-} from "./chunk-VJDO3GFH.js";
+} from "./chunk-PNP7OALR.js";
 
-// src/hooks/useKeepItem.ts
+// src/react/components/KeepButton.tsx
+import {
+  Children,
+  cloneElement,
+  isValidElement
+} from "react";
+
+// src/react/hooks/useKeepItem.ts
 import { useCallback as useCallback3 } from "react";
 
-// src/KeepProvider.tsx
+// src/react/components/KeepProvider.tsx
 import {
   createContext,
   useCallback,
@@ -29,7 +40,7 @@ import {
   useSyncExternalStore
 } from "react";
 
-// src/KeepErrorBoundary.tsx
+// src/react/components/KeepErrorBoundary.tsx
 import { Component } from "react";
 var KeepErrorBoundary = class extends Component {
   constructor() {
@@ -55,7 +66,7 @@ var KeepErrorBoundary = class extends Component {
   }
 };
 
-// src/KeepProvider.tsx
+// src/react/components/KeepProvider.tsx
 import { jsx } from "react/jsx-runtime";
 var defaultStorage = createBrowserStorageAdapter();
 var KeepContext = createContext(null);
@@ -331,17 +342,77 @@ function KeepProviderContent({
         reportError(cause, { action: "save", id: item.id });
         throw cause;
       }
-      await runMutation("save", normalizedItem.id, (previous) => ({
-        next: [...previous.filter((current) => current.id !== normalizedItem.id), normalizedItem].sort(
-          (a, b) => b.updatedAt - a.updatedAt
-        ),
-        persist: () => storage.set(normalizedItem),
-        onSuccess: () => handlersRef.current.onSave?.(normalizedItem),
-        pluginContext: { action: "save", id: normalizedItem.id, item: normalizedItem }
-      }));
+      await runMutation("save", normalizedItem.id, (previous) => {
+        const current = previous.find((item2) => item2.id === normalizedItem.id);
+        const hasCustomOrder = previous.some((item2) => item2.order !== void 0);
+        const nextItem = {
+          ...normalizedItem,
+          ...normalizedItem.order === void 0 && current?.order !== void 0 ? { order: current.order } : {},
+          ...normalizedItem.order === void 0 && !current && hasCustomOrder ? { order: previous.reduce((max, item2) => Math.max(max, item2.order ?? -1), -1) + 1 } : {}
+        };
+        const withoutCurrent = previous.filter((item2) => item2.id !== nextItem.id);
+        const next = hasCustomOrder ? reorderKeepItems(
+          [...withoutCurrent, nextItem],
+          orderKeepItems(previous).map((item2) => item2.id === nextItem.id ? nextItem.id : item2.id)
+        ) : [...withoutCurrent, nextItem].sort((a, b) => b.updatedAt - a.updatedAt);
+        return {
+          next,
+          persist: () => storage.set(nextItem),
+          onSuccess: () => handlersRef.current.onSave?.(nextItem),
+          pluginContext: { action: "save", id: nextItem.id, item: nextItem }
+        };
+      });
     },
     [reportError, runMutation, storage]
   );
+  const reorderItems = useCallback(
+    async (orderedIds) => {
+      await runMutation("reorder", void 0, (previous) => {
+        const next = reorderKeepItems(previous, orderedIds);
+        const changedItems = next.filter(
+          (item, index) => item.id !== previous[index]?.id || item.order !== previous[index]?.order
+        );
+        return {
+          next,
+          persist: async () => {
+            try {
+              if (storage.setMany) await storage.setMany(changedItems);
+              else for (const item of changedItems) await storage.set(item);
+            } catch (cause) {
+              await restoreItems(storage, previous);
+              throw cause;
+            }
+          },
+          pluginContext: { action: "reorder", items: changedItems }
+        };
+      });
+    },
+    [runMutation, storage]
+  );
+  const moveItem = useCallback(
+    async (id, targetIndex) => {
+      await runMutation("reorder", id, (previous) => {
+        const next = moveKeepItem(previous, id, targetIndex);
+        const changedItems = next.filter(
+          (item, index) => item.id !== previous[index]?.id || item.order !== previous[index]?.order
+        );
+        return {
+          next,
+          persist: async () => {
+            try {
+              if (storage.setMany) await storage.setMany(changedItems);
+              else for (const item of changedItems) await storage.set(item);
+            } catch (cause) {
+              await restoreItems(storage, previous);
+              throw cause;
+            }
+          },
+          pluginContext: { action: "reorder", id, items: changedItems }
+        };
+      });
+    },
+    [runMutation, storage]
+  );
   const updateNote = useCallback(
     async (id, note) => {
       const nextNote = note?.trim() || void 0;
@@ -501,7 +572,8 @@ function KeepProviderContent({
   const rememberUndo = useCallback(
     (removedItems) => {
       undoRef.current?.timer && clearTimeout(undoRef.current.timer);
-      const expiresAt = Date.now() + Math.max(0, undoTimeoutMs);
+      const startedAt = Date.now();
+      const expiresAt = startedAt + Math.max(0, undoTimeoutMs);
       const timer = setTimeout(
         () => {
           undoRef.current = void 0;
@@ -510,7 +582,7 @@ function KeepProviderContent({
         Math.max(0, undoTimeoutMs)
       );
       undoRef.current = { items: removedItems, expiresAt, timer };
-      store.setState({ undo: { canUndo: true, ids: removedItems.map((item) => item.id), expiresAt } });
+      store.setState({ undo: { canUndo: true, ids: removedItems.map((item) => item.id), startedAt, expiresAt } });
     },
     [store, undoTimeoutMs]
   );
@@ -729,6 +801,8 @@ function KeepProviderContent({
       resolveSyncConflict,
       refreshItemMetadata,
       revalidateItems,
+      reorderItems,
+      moveItem,
       exportBackup,
       importBackup
     }),
@@ -758,6 +832,8 @@ function KeepProviderContent({
       removeItems,
       refreshItemMetadata,
       revalidateItems,
+      reorderItems,
+      moveItem,
       exportBackup,
       importBackup
     ]
@@ -778,7 +854,9 @@ function KeepProviderContent({
       clear,
       refresh,
       refreshItemMetadata,
-      revalidateItems
+      revalidateItems,
+      reorderItems,
+      moveItem
     }),
     [
       addTagsBatch,
@@ -793,6 +871,8 @@ function KeepProviderContent({
       updateTagsBatch,
       refreshItemMetadata,
       revalidateItems,
+      reorderItems,
+      moveItem,
       removeItemWithUndo,
       removeItemsWithUndo,
       undoLastRemoval
@@ -838,7 +918,7 @@ function useKeepStore() {
   return context;
 }
 
-// src/hooks/useKeepStoreSelector.ts
+// src/react/hooks/useKeepStoreSelector.ts
 import { useCallback as useCallback2, useRef as useRef2, useSyncExternalStore as useSyncExternalStore2 } from "react";
 function useKeepStoreSelector(store, selector) {
   const cacheRef = useRef2(null);
@@ -853,7 +933,7 @@ function useKeepStoreSelector(store, selector) {
   return useSyncExternalStore2(store.subscribe, getSelectedSnapshot, getSelectedSnapshot);
 }
 
-// src/hooks/useKeepItem.ts
+// src/react/hooks/useKeepItem.ts
 function useKeepItem(input) {
   const { store, actions } = useKeepStore();
   const id = input?.id ?? "";
@@ -873,15 +953,17 @@ function useKeepItem(input) {
     store,
     useCallback3((state) => state.error, [])
   );
+  const currentOrder = item?.order;
   const save = useCallback3(async () => {
     if (!input) throw new Error("An item input is required to save an item.");
     const now = Date.now();
     await actions.saveItem({
       ...input,
+      ...currentOrder === void 0 ? {} : { order: currentOrder },
       savedAt: item?.savedAt ?? now,
       updatedAt: now
     });
-  }, [actions, input, item?.savedAt]);
+  }, [actions, currentOrder, input, item?.savedAt]);
   const remove = useCallback3(() => actions.removeItem(id), [actions, id]);
   const removeWithUndo = useCallback3(() => actions.removeItemWithUndo(id), [actions, id]);
   const toggle = useCallback3(() => item ? remove() : save(), [item, remove, save]);
@@ -908,7 +990,96 @@ function useKeepItem(input) {
   };
 }
 
-// src/hooks/useKeepList.ts
+// src/react/components/KeepButton.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function KeepButton({
+  item,
+  children,
+  savedLabel = "Saved",
+  unsavedLabel = "Save",
+  savedAriaLabel,
+  unsavedAriaLabel,
+  getAriaLabel,
+  asChild = false,
+  onToggleError,
+  onClick,
+  disabled,
+  ...buttonProps
+}) {
+  const state = useKeepItem(item);
+  const { isSaved, toggle } = state;
+  const isDisabled = disabled ?? state.isMutating;
+  async function handleClick(event) {
+    if (isDisabled) return;
+    if (asChild) {
+      onClick?.(event);
+    } else {
+      onClick?.(
+        event
+      );
+    }
+    if (event.defaultPrevented) return;
+    try {
+      await toggle();
+    } catch (error) {
+      onToggleError?.(error);
+    }
+  }
+  const content = typeof children === "function" ? children(state) : children ?? (isSaved ? savedLabel : unsavedLabel);
+  function handleElementClick(event) {
+    if (isDisabled) return;
+    if (asChild && isValidElement(content)) {
+      content.props.onClick?.(event);
+    }
+    if (!event.defaultPrevented) void handleClick(event);
+  }
+  function handleKeyDown(event) {
+    if (asChild && isValidElement(content)) {
+      content.props.onKeyDown?.(event);
+    }
+    buttonProps.onKeyDown?.(event);
+    if (!event.defaultPrevented && !isDisabled && asChild && (event.key === "Enter" || event.key === " ")) {
+      void handleClick(event);
+      event.preventDefault();
+    }
+  }
+  const child = asChild ? Children.only(content) : void 0;
+  if (asChild && !isValidElement(child)) {
+    throw new Error("KeepButton with asChild requires a single React element child.");
+  }
+  const commonProps = {
+    ...buttonProps,
+    "aria-pressed": isSaved,
+    "data-state": state.error ? "error" : isSaved ? "saved" : "unsaved",
+    "data-loading": state.isLoading || state.isMutating ? "true" : void 0,
+    "data-disabled": isDisabled ? "true" : void 0,
+    "aria-label": ("aria-label" in buttonProps ? buttonProps["aria-label"] : void 0) ?? getAriaLabel?.(state) ?? (isSaved ? savedAriaLabel : unsavedAriaLabel) ?? getAccessibleLabel(isSaved, item, asChild),
+    ...asChild ? {
+      "aria-disabled": isDisabled,
+      role: buttonProps.role ?? "button",
+      tabIndex: isDisabled ? -1 : buttonProps.tabIndex ?? 0
+    } : { disabled: isDisabled },
+    onClick: handleElementClick,
+    onKeyDown: handleKeyDown
+  };
+  if (asChild) {
+    return cloneElement(child, commonProps);
+  }
+  return /* @__PURE__ */ jsx2("button", { ...commonProps, type: "type" in buttonProps ? buttonProps.type ?? "button" : "button", children: content });
+}
+function getAccessibleLabel(isSaved, item, asChild) {
+  if (!asChild) return isSaved ? "Remove saved item" : "Save item";
+  const title = getMetaTitle(item.meta);
+  const subject = title ? `${item.targetType ?? "item"}: ${title}` : item.targetType ?? "item";
+  return `${isSaved ? "Remove" : "Save"} ${subject}`;
+}
+function getMetaTitle(meta) {
+  if (typeof meta !== "object" || meta === null || !("title" in meta)) return void 0;
+  const title = meta.title;
+  return typeof title === "string" && title.trim() ? title.trim() : void 0;
+}
+
+// src/react/hooks/useKeepList.ts
 import { useCallback as useCallback4, useMemo as useMemo2 } from "react";
 function useKeepList(query = {}) {
   const { store, actions } = useKeepStore();
@@ -989,6 +1160,8 @@ function useKeepList(query = {}) {
     updateTagsBatch,
     addTagsBatch,
     removeTagsBatch,
+    reorder: actions.reorderItems,
+    move: actions.moveItem,
     clear: actions.clear,
     refresh: actions.refresh,
     revalidate: actions.revalidateItems
@@ -1006,7 +1179,63 @@ function sameCounts(left, right) {
   });
 }
 
-// src/hooks/useKeepShortcut.ts
+// src/react/hooks/useKeepNavigator.ts
+import { useCallback as useCallback5, useMemo as useMemo3, useState } from "react";
+function useKeepNavigator(options = {}) {
+  const { store } = useKeepStore();
+  const { currentId, initialIndex = 0, query } = options;
+  const [activeIndex, setActiveIndex] = useState(() => Math.max(0, Math.floor(initialIndex)));
+  const queryOptions = useMemo3(() => ({ ...query, pagination: void 0 }), [query]);
+  const selector = useMemo3(() => {
+    let previousSource;
+    let previousItems;
+    let previousPointer;
+    let previousResult;
+    return (state) => {
+      if (previousSource !== state.items) {
+        previousSource = state.items;
+        previousItems = queryKeepItems(state.items, queryOptions).items;
+        previousResult = void 0;
+      }
+      const items = previousItems ?? [];
+      const pointer = currentId ?? activeIndex;
+      if (previousResult && previousPointer === pointer) return previousResult;
+      previousPointer = pointer;
+      previousResult = getKeepNavigationState(items, pointer);
+      return previousResult;
+    };
+  }, [activeIndex, currentId, queryOptions]);
+  const navigation = useKeepStoreSelector(store, selector);
+  const goToIndex = useCallback5(
+    (index) => {
+      const item = navigation.items[index];
+      if (!item) return null;
+      setActiveIndex(index);
+      return item;
+    },
+    [navigation.items]
+  );
+  const goToNext = useCallback5(() => {
+    if (!navigation.nextItem) return null;
+    setActiveIndex(navigation.currentIndex + 1);
+    return navigation.nextItem;
+  }, [navigation.currentIndex, navigation.nextItem]);
+  const goToPrev = useCallback5(() => {
+    if (!navigation.prevItem) return null;
+    setActiveIndex(navigation.currentIndex - 1);
+    return navigation.prevItem;
+  }, [navigation.currentIndex, navigation.prevItem]);
+  const goToItem = useCallback5(
+    (id) => {
+      const index = navigation.items.findIndex((item) => item.id === id);
+      return index < 0 ? null : goToIndex(index);
+    },
+    [goToIndex, navigation.items]
+  );
+  return { ...navigation, goToNext, goToPrev, goToIndex, goToItem };
+}
+
+// src/react/hooks/useKeepShortcut.ts
 import { useEffect as useEffect2 } from "react";
 function useKeepShortcut(options) {
   const item = useKeepItem(options.item);
@@ -1062,101 +1291,7 @@ function isEditableTarget(target) {
   return target.isContentEditable || target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.tagName === "SELECT";
 }
 
-// src/KeepButton.tsx
-import {
-  Children,
-  cloneElement,
-  isValidElement
-} from "react";
-import { jsx as jsx2 } from "react/jsx-runtime";
-function KeepButton({
-  item,
-  children,
-  savedLabel = "Saved",
-  unsavedLabel = "Save",
-  savedAriaLabel,
-  unsavedAriaLabel,
-  getAriaLabel,
-  asChild = false,
-  onToggleError,
-  onClick,
-  disabled,
-  ...buttonProps
-}) {
-  const state = useKeepItem(item);
-  const { isSaved, toggle } = state;
-  const isDisabled = disabled ?? state.isMutating;
-  async function handleClick(event) {
-    if (isDisabled) return;
-    if (asChild) {
-      onClick?.(event);
-    } else {
-      onClick?.(
-        event
-      );
-    }
-    if (event.defaultPrevented) return;
-    try {
-      await toggle();
-    } catch (error) {
-      onToggleError?.(error);
-    }
-  }
-  const content = typeof children === "function" ? children(state) : children ?? (isSaved ? savedLabel : unsavedLabel);
-  function handleElementClick(event) {
-    if (isDisabled) return;
-    if (asChild && isValidElement(content)) {
-      content.props.onClick?.(event);
-    }
-    if (!event.defaultPrevented) void handleClick(event);
-  }
-  function handleKeyDown(event) {
-    if (asChild && isValidElement(content)) {
-      content.props.onKeyDown?.(event);
-    }
-    buttonProps.onKeyDown?.(event);
-    if (!event.defaultPrevented && !isDisabled && asChild && (event.key === "Enter" || event.key === " ")) {
-      void handleClick(event);
-      event.preventDefault();
-    }
-  }
-  const child = asChild ? Children.only(content) : void 0;
-  if (asChild && !isValidElement(child)) {
-    throw new Error("KeepButton with asChild requires a single React element child.");
-  }
-  const commonProps = {
-    ...buttonProps,
-    "aria-pressed": isSaved,
-    "data-state": state.error ? "error" : isSaved ? "saved" : "unsaved",
-    "data-loading": state.isLoading || state.isMutating ? "true" : void 0,
-    "data-disabled": isDisabled ? "true" : void 0,
-    "aria-label": ("aria-label" in buttonProps ? buttonProps["aria-label"] : void 0) ?? getAriaLabel?.(state) ?? (isSaved ? savedAriaLabel : unsavedAriaLabel) ?? getAccessibleLabel(isSaved, item, asChild),
-    ...asChild ? {
-      "aria-disabled": isDisabled,
-      role: buttonProps.role ?? "button",
-      tabIndex: isDisabled ? -1 : buttonProps.tabIndex ?? 0
-    } : { disabled: isDisabled },
-    onClick: handleElementClick,
-    onKeyDown: handleKeyDown
-  };
-  if (asChild) {
-    return cloneElement(child, commonProps);
-  }
-  return /* @__PURE__ */ jsx2("button", { ...commonProps, type: "type" in buttonProps ? buttonProps.type ?? "button" : "button", children: content });
-}
-function getAccessibleLabel(isSaved, item, asChild) {
-  if (!asChild) return isSaved ? "Remove saved item" : "Save item";
-  const title = getMetaTitle(item.meta);
-  const subject = title ? `${item.targetType ?? "item"}: ${title}` : item.targetType ?? "item";
-  return `${isSaved ? "Remove" : "Save"} ${subject}`;
-}
-function getMetaTitle(meta) {
-  if (typeof meta !== "object" || meta === null || !("title" in meta)) return void 0;
-  const title = meta.title;
-  return typeof title === "string" && title.trim() ? title.trim() : void 0;
-}
-
-// src/createKeepKit.tsx
+// src/react/createKeepKit.tsx
 import { jsx as jsx3 } from "react/jsx-runtime";
 function createKeepKit(options = {}) {
   return {
@@ -1165,6 +1300,7 @@ function createKeepKit(options = {}) {
     useContext: () => useKeepContext(),
     useItem: (item) => useKeepItem(item),
     useList: (query) => useKeepList(query),
+    useNavigator: (navigatorOptions) => useKeepNavigator(navigatorOptions),
     useShortcut: (shortcutOptions) => useKeepShortcut(shortcutOptions)
   };
 }
@@ -1177,6 +1313,7 @@ export {
   useKeepContext,
   useKeepItem,
   useKeepList,
+  useKeepNavigator,
   useKeepShortcut,
   useKeepStore
 };