@keepkit/ui 0.18.0 → 0.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -57,8 +57,10 @@ function SavedArticles() {
57
57
  ```
58
58
 
59
59
  `keep.Collection`は検索、ソート、ページング、loading / empty / error、ARIA live通知を標準で提供します。検索は既定で300msデバウンスされます。`features={{ tagFilter: true, bulkActions: true }}`でタグフィルターと一括操作も有効にできます。個別の`KeepList`、`KeepSearchInput`、`KeepSortSelect`、`KeepPagination`、`KeepItemCheckbox`、`KeepTagEditor`などは高度なレイアウト用に利用できます。`KeepBulkActions`はrender propsで操作UIを差し替えられ、`isAllSelected` / `toggleSelectAll`で表示中アイテムを一括操作できます。`KeepNoteEditor`は既定300msのデバウンス保存に対応し、`debounceMs={0}`でフォーム送信のみへ戻せます。通知領域だけを明示的に置く場合は`KeepAnnouncer`(`KeepAnnouncements`のalias)を使えます。
60
+ `KeepCollection`は検索語と選択タグを`KeepActiveFiltersSummary`のチップとして表示し、個別解除と「すべての条件をクリア」を提供します。`activeFilters`でこの領域を差し替えられます。標準の`KeepList` / `KeepCollection`は、全件0件の`empty-storage`と絞り込み結果0件の`empty-filtered`を区別し、後者では`onClearFilters`付きの解除ボタンを表示します。
60
61
  `KeepItemCard`は`href`、`onOpen`、`linkTarget`、`linkComponent`に対応し、保存アイテムから詳細ページへ遷移できます。非公開・期限切れ等の`status`を持つアイテムは自動的にリンクを無効化します。`KeepBackup`はJSONのエクスポート、merge / replaceインポート、結果件数、容量エラー表示を提供します。
61
62
  `KeepTourBar`(alias: `KeepNavigator`)は進行度、前へ・次へ、一覧へ戻る操作をURLまたはコールバックで提供します。前後ボタンには隣接アイテム名のプレビューが付き、`getItemTitle`で表示名を差し替えられます。`keyboardShortcuts`を指定するとJ/Kまたは]/[で巡回でき、`useKeepTourShortcuts`ではキーと動作を個別に差し替えられます。`KeepReorderableList`はドラッグ操作と矢印キーによる並び替えを提供し、ドラッグ中の挿入位置を表示します。
63
+ `KeepShortcutHint`はセマンティックな`<kbd>`バッジを表示します。`KeepTourBar showShortcutHint`は前へ/次へのキーを、`KeepNoteEditor showShortcutHint`は`Ctrl+Enter`を標準ボタン内に表示します。`mergeProps` / `createSlot`は`asChild`でclassName、style、ARIA属性、イベント、子と親のrefを合成し、`composeRefs`はcallback refとobject refをまとめる共通基盤です。フィルターチップは削除後に隣接チップへ戻り、ArrowLeft / ArrowRightで移動できます。
62
64
  `KeepList`や`KeepCollection`のカードは検索語を大文字小文字を区別せず`<mark class="keep-highlight" data-highlight="true">`で表示します。単体の`KeepItemCard`では`highlightQuery`、任意のテキストでは`KeepHighlight`を使えます。`KeepItemCard.Media`は読み込み状態を`data-media-status`で公開し、失敗時は`fallback`または標準SVGへ切り替わります。
63
65
  テーマCSSではハイライト用の`--keep-highlight-bg` / `--keep-highlight-fg`(ライト/ダーク対応)、タイトル2行・メモプレビュー3行の制限、メディアの固定アスペクト比を適用します。`KeepItemStatusBadge`は状態ラベルに加えてチェック・時計・進入禁止・鍵のSVGアイコンを表示し、状態ごとの形状とトーンを組み合わせます。個別の状態スタイルは`@keepkit/ui/styles/status.css`からも読み込めます。
64
66
  外部URLの詳細リンクには`target="_blank"`と`rel="noreferrer"`が既定で補完され、利用できないカードには`aria-disabled="true"`と`data-item-status`が付与されます。同期競合ダイアログではローカルとリモートの更新日時・メモを並べて確認できます。
@@ -86,7 +88,7 @@ const onFeedback = useKeepToastFeedback(toast);
86
88
  <KeepKitProvider storage={storage} onFeedback={onFeedback}>{children}</KeepKitProvider>;
87
89
  ```
88
90
 
89
- v0.18.0では`KeepTourBar` / `KeepNavigator`、`KeepReorderableList`、`useKeepTourShortcuts`を利用できます。`KeepCollection urlSync layout="list" | "grid" | "compact"`、`KeepBulkActions selectionScope="page" | "query" | "all"`、`KeepUndo`も利用できます。`createNextPagesRouterAdapter`はNext.js Pages Router用の注入adapterです。`locale`は16言語に対応し、`labels`で上書きできます。認証付き同期は`createAuthenticatedSyncKit`から利用できます。
91
+ v0.20.0では`KeepTourBar` / `KeepNavigator`、`KeepReorderableList`、`useKeepTourShortcuts`を利用できます。`KeepCollection urlSync layout="list" | "grid" | "compact"`、`KeepBulkActions selectionScope="page" | "query" | "all"`、`KeepUndo`も利用できます。`createNextPagesRouterAdapter`はNext.js Pages Router用の注入adapterです。`locale`は16言語に対応し、`labels`で上書きできます。認証付き同期は`createAuthenticatedSyncKit`から利用できます。
90
92
  Phase 4の状態UIとして`KeepItemStatusBadge`、`KeepStaleNotice`、`KeepPruneStaleButton`、`KeepSyncStatusBanner`、`KeepSyncRecoveryDialog`を利用できます。`import "@keepkit/ui/theme.css"`でテーマCSSを有効にできます。
91
93
 
92
94
  ### Tailwind/shadcnテーマ
@@ -172,10 +174,12 @@ function SavedArticles() {
172
174
  ```
173
175
 
174
176
  `keep.Collection` includes search, sorting, pagination, loading/empty/error states, and polite live announcements. Search is debounced by 300ms by default. Enable `features={{ tagFilter: true, bulkActions: true }}` for tag filtering and bulk operations. Use the individual `KeepList`, `KeepSearchInput`, `KeepSortSelect`, `KeepPagination`, `KeepItemCheckbox`, and `KeepTagEditor` primitives when you need a custom layout. `KeepBulkActions` supports render props and exposes `isAllSelected` / `toggleSelectAll` for visible-item selection. `KeepNoteEditor` auto-saves dirty notes after 300ms by default; set `debounceMs={0}` to use form submission only. Mount `KeepAnnouncer` (`KeepAnnouncements` alias) when you need the live region explicitly.
177
+ `KeepCollection` renders the current search and tag filters as `KeepActiveFiltersSummary` chips with individual removal and a “Clear all filters” action. Replace that area with the `activeFilters` slot. Default `KeepList` / `KeepCollection` output distinguishes `empty-storage` from `empty-filtered`; the filtered state includes a reset button when `onClearFilters` is provided.
175
178
 
176
179
  The opt-in theme adds neutral borders, surfaces, shadows, focus treatment, and decorative action icons without changing accessible names. Target individual controls with `data-keep-action`, or override `--keep-icon-size`, `--keep-control-gap`, `--keep-shadow`, `--keep-success`, and `--keep-warning`. Consumers that omit the CSS keep the headless markup, and `KeepButton icons` continues to take precedence over the built-in icon.
177
180
  `KeepItemCard` accepts `href`, `onOpen`, `linkTarget`, and `linkComponent` for detail-page navigation. Links are disabled for unavailable `status` values such as private or expired. `KeepBackup` provides JSON export, merge/replace import, result counts, and quota-error messaging.
178
181
  `KeepTourBar` (aliased as `KeepNavigator`) provides progress, previous/next, and return-to-list actions through URLs or callbacks. Adjacent item titles are previewed below the navigation labels; customize them with `getItemTitle`. Set `keyboardShortcuts` for J/K or ]/[ tour navigation, or use `useKeepTourShortcuts` for custom bindings. `KeepReorderableList` supports drag and keyboard reordering and shows the active insertion position.
182
+ `KeepShortcutHint` renders semantic `<kbd>` badges. `KeepTourBar showShortcutHint` displays the previous/next keys, while `KeepNoteEditor showShortcutHint` displays `Ctrl+Enter` in the save button. `mergeProps` / `createSlot` compose className, style, ARIA, events, and child/parent refs for `asChild` slots; `composeRefs` combines callback and object refs. Filter chips restore focus to an adjacent chip after removal and support ArrowLeft / ArrowRight navigation.
179
183
  Cards rendered by `KeepList` and `KeepCollection` highlight case-insensitive search matches with `<mark class="keep-highlight" data-highlight="true">`. Use `highlightQuery` on a standalone `KeepItemCard` or `KeepHighlight` for arbitrary text. `KeepItemCard.Media` exposes its loading state through `data-media-status` and replaces failed images with `fallback` or the built-in SVG placeholder.
180
184
  The theme defines WCAG-oriented `--keep-highlight-bg` / `--keep-highlight-fg` pairs for light and dark modes, clamps titles to two lines and memo previews to three, and reserves a stable media aspect ratio. `KeepItemStatusBadge` combines visible status text with check, clock, ban, or lock SVG icons; import `@keepkit/ui/styles/status.css` when using the status styles independently.
181
185
  External detail URLs receive `target="_blank"` and `rel="noreferrer"` defaults. Unavailable cards expose `aria-disabled="true"` and normalized `data-item-status` values, and the sync recovery dialog compares local and remote updated dates and notes side by side.
@@ -203,7 +207,7 @@ const onFeedback = useKeepToastFeedback(toast);
203
207
  <KeepKitProvider storage={storage} onFeedback={onFeedback}>{children}</KeepKitProvider>;
204
208
  ```
205
209
 
206
- In v0.18.0, use `KeepTourBar` / `KeepNavigator`, `KeepReorderableList`, and `useKeepTourShortcuts` for continuous saved-item tours. `KeepCollection urlSync` with `layout="list" | "grid" | "compact"`, `KeepBulkActions selectionScope="page" | "query" | "all"`, and `KeepUndo` remain available. `createNextPagesRouterAdapter` is the injected adapter for Next.js Pages Router. `locale` includes 16 built-in dictionaries, and `labels` overrides individual entries. Authenticated sync is available through `createAuthenticatedSyncKit`.
210
+ In v0.20.0, use `KeepTourBar` / `KeepNavigator`, `KeepReorderableList`, and `useKeepTourShortcuts` for continuous saved-item tours. `KeepCollection urlSync` with `layout="list" | "grid" | "compact"`, `KeepBulkActions selectionScope="page" | "query" | "all"`, and `KeepUndo` remain available. `createNextPagesRouterAdapter` is the injected adapter for Next.js Pages Router. `locale` includes 16 built-in dictionaries, and `labels` overrides individual entries. Authenticated sync is available through `createAuthenticatedSyncKit`.
207
211
  Phase 4 adds `KeepItemStatusBadge`, `KeepStaleNotice`, `KeepPruneStaleButton`, `KeepSyncStatusBanner`, and `KeepSyncRecoveryDialog` for unavailable items, sync failures, conflict resolution, and backup recovery. Import `@keepkit/ui/theme.css` or `@keepkit/ui/tailwind.css` for the opt-in theme layer.
208
212
 
209
213
  ### Tailwind and shadcn theme
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react from 'react';
2
- import { HTMLAttributes, ReactNode, ComponentType, InputHTMLAttributes, ImgHTMLAttributes, MouseEvent, HTMLAttributeAnchorTarget, KeyboardEvent, FormHTMLAttributes, SelectHTMLAttributes, ButtonHTMLAttributes, CSSProperties } from 'react';
2
+ import { HTMLAttributes, ReactNode, ComponentType, Ref, RefCallback, ReactElement, InputHTMLAttributes, ImgHTMLAttributes, MouseEvent, HTMLAttributeAnchorTarget, KeyboardEvent, FormHTMLAttributes, SelectHTMLAttributes, ButtonHTMLAttributes, CSSProperties } from 'react';
3
3
  import { KeepListQuery, KeepUrlSyncOptions, ImportItemsResult, KeepItem, KeepItemStatus, KeepSyncConflict, KeepItemInput } from '@keepkit/core/core';
4
4
  export { AuthenticatedSyncAuthContext, AuthenticatedSyncKit, AuthenticatedSyncKitOptions, AuthenticatedSyncRequestContext, AuthenticatedSyncTransport, KeepItem, KeepItemInput, KeepListQuery, KeepScope, KeepSyncConflict, KeepSyncResolution, KeepSyncState, KeepSyncStatus, KeepUndoState, KeepUrlSyncOptions, createAuthenticatedSyncKit } from '@keepkit/core/core';
5
5
  import { KeepButtonProps as KeepButtonProps$1, UseKeepListResult, KeepErrorBoundaryProps, UseKeepNavigatorResult, CreateKeepKitOptions as CreateKeepKitOptions$1, KeepProviderProps, useKeepContext, useKeepItem, useKeepList, UseKeepNavigatorOptions, KeepShortcutOptions } from '@keepkit/core/react';
@@ -72,6 +72,14 @@ type KeepButtonIcons = {
72
72
  loading?: KeepButtonIcon;
73
73
  error?: KeepButtonIcon;
74
74
  };
75
+ type MergeableProps = Record<string, unknown>;
76
+ /** Combines callback and object refs while preserving every ref target. */
77
+ declare function composeRefs<T>(...refs: Array<Ref<T> | null | undefined>): RefCallback<T>;
78
+ /** Chains child and component event handlers while preserving both handlers' event order. */
79
+ declare function chainedFunction<T extends (...args: never[]) => unknown>(childHandler: T | undefined, parentHandler: T | undefined): T | undefined;
80
+ /** Merges slot props without dropping child classes, styles, ARIA attributes, or events. */
81
+ declare function mergeProps<T extends MergeableProps>(childProps: T, parentProps: Partial<T> & MergeableProps): T;
82
+ declare function createSlot(child: ReactElement<MergeableProps>, props: MergeableProps, body?: ReactNode): ReactElement<MergeableProps>;
75
83
 
76
84
  /** Returns whether every visible item is selected. Empty lists are never all selected. */
77
85
  declare function isAllSelected<TMeta>(items: readonly Pick<KeepItem<TMeta>, "id">[], selectedIds: readonly string[]): boolean;
@@ -112,6 +120,9 @@ type KeepBulkActionsProps<TMeta = Record<string, unknown>> = Omit<HTMLAttributes
112
120
  declare function KeepBulkActions<TMeta = Record<string, unknown>>({ query, selectedIds: controlledSelectedIds, defaultSelectedIds, onSelectedIdsChange, renderItem, onCompleted, selectionScope: controlledScope, onSelectionScopeChange, render, children, ...props }: KeepBulkActionsProps<TMeta>): react.JSX.Element;
113
121
 
114
122
  type KeepButtonProps<TMeta = Record<string, unknown>> = KeepButtonProps$1<TMeta> & {
123
+ ref?: Ref<HTMLElement> | {
124
+ readonly current: unknown;
125
+ };
115
126
  labels?: KeepButtonLabels;
116
127
  icons?: KeepButtonIcons;
117
128
  iconOnly?: boolean;
@@ -157,6 +168,9 @@ type KeepImageProps = ImgHTMLAttributes<HTMLImageElement> & {
157
168
  alt: string;
158
169
  };
159
170
  type KeepItemCardProps<TMeta = Record<string, unknown>> = Omit<HTMLAttributes<HTMLElement>, "children" | "title"> & {
171
+ ref?: Ref<HTMLElement> | {
172
+ readonly current: unknown;
173
+ };
160
174
  item: KeepItem<TMeta>;
161
175
  title?: ReactNode | ((item: KeepItem<TMeta>) => ReactNode);
162
176
  getTitle?: (item: KeepItem<TMeta>) => ReactNode;
@@ -497,6 +511,9 @@ declare function KeepItemCardSkeleton({ layout, ...props }: KeepItemCardSkeleton
497
511
 
498
512
  type KeepListState<TMeta = Record<string, unknown>> = UseKeepListResult<TMeta>;
499
513
  type KeepListProps<TMeta = Record<string, unknown>> = Omit<HTMLAttributes<HTMLElement>, "children"> & {
514
+ ref?: Ref<HTMLElement> | {
515
+ readonly current: unknown;
516
+ };
500
517
  query?: KeepListQuery<TMeta>;
501
518
  children?: ReactNode | RenderProp<KeepListState<TMeta>>;
502
519
  renderItem?: (item: KeepItem<TMeta>, state: KeepListState<TMeta>) => ReactNode;
@@ -506,6 +523,7 @@ type KeepListProps<TMeta = Record<string, unknown>> = Omit<HTMLAttributes<HTMLEl
506
523
  loadingCount?: number;
507
524
  empty?: ReactNode | RenderProp<KeepListState<TMeta>>;
508
525
  error?: ReactNode | RenderProp<KeepListState<TMeta>>;
526
+ onClearFilters?: () => void;
509
527
  itemCardProps?: Omit<KeepItemCardProps<TMeta>, "item" | "children" | "render">;
510
528
  layout?: KeepLayoutPreset;
511
529
  asChild?: boolean;
@@ -531,6 +549,7 @@ type KeepCollectionProps<TMeta = Record<string, unknown>> = Omit<HTMLAttributes<
531
549
  /** Alias for `loading`. When neither is provided, KeepList renders skeleton cards. */
532
550
  renderLoading?: ReactNode | RenderProp<KeepListState<TMeta>>;
533
551
  loadingCount?: number;
552
+ activeFilters?: ReactNode | RenderProp<KeepListState<TMeta>>;
534
553
  empty?: ReactNode | RenderProp<KeepListState<TMeta>>;
535
554
  error?: ReactNode | RenderProp<KeepListState<TMeta>>;
536
555
  fallback?: KeepErrorBoundaryProps["fallback"];
@@ -593,6 +612,7 @@ type KeepNoteEditorProps<TMeta = Record<string, unknown>> = Omit<FormHTMLAttribu
593
612
  placeholder?: string;
594
613
  /** Automatically save dirty notes after this delay; set to 0 to disable auto-save. */
595
614
  debounceMs?: number;
615
+ showShortcutHint?: boolean;
596
616
  onSaved?: (note?: string) => void;
597
617
  onSaveError?: (error: unknown) => void;
598
618
  render?: RenderProp<KeepNoteEditorState<TMeta>>;
@@ -600,7 +620,7 @@ type KeepNoteEditorProps<TMeta = Record<string, unknown>> = Omit<FormHTMLAttribu
600
620
  asChild?: boolean;
601
621
  };
602
622
  /** A controlled-by-default note editor that persists through useKeepItem. */
603
- declare function KeepNoteEditor<TMeta = Record<string, unknown>>({ item, label, saveLabel, placeholder, debounceMs, onSaved, onSaveError, render, children, asChild, className, ...formProps }: KeepNoteEditorProps<TMeta>): react.JSX.Element;
623
+ declare function KeepNoteEditor<TMeta = Record<string, unknown>>({ item, label, saveLabel, placeholder, debounceMs, showShortcutHint, onSaved, onSaveError, render, children, asChild, className, ...formProps }: KeepNoteEditorProps<TMeta>): react.JSX.Element;
604
624
 
605
625
  type KeepTagEditorState = {
606
626
  tags: string[];
@@ -618,7 +638,7 @@ type KeepTagEditorProps<TMeta = Record<string, unknown>> = Omit<FormHTMLAttribut
618
638
  /** Edits one item's normalized tag set; Enter adds and Backspace removes the last tag. */
619
639
  declare function KeepTagEditor<TMeta = Record<string, unknown>>({ item, availableTags, onSaved, onSaveError, render, ...props }: KeepTagEditorProps<TMeta>): react.JSX.Element;
620
640
 
621
- type KeepUiLabelKey = "save" | "saved" | "remove" | "loading" | "saving" | "syncing" | "error" | "allTags" | "tags" | "filterTags" | "note" | "saveNote" | "noItems" | "loadingItems" | "errorItems" | "search" | "sort" | "newest" | "oldest" | "savedNewest" | "savedOldest" | "updatedNewest" | "updatedOldest" | "previousPage" | "nextPage" | "pagination" | "page" | "selectItems" | "selectedCount" | "deleteSelected" | "tagsToApply" | "applyTags" | "savedMessage" | "removedMessage" | "restoredMessage" | "syncFailedMessage" | "stalePrunedMessage" | "undo" | "undoAvailable" | "selectionScope" | "currentPage" | "searchResults" | "allItems" | "localVersion" | "remoteVersion" | "updatedAt" | "statusAvailable" | "noteSavedMessage" | "exportData" | "importData" | "importMode" | "merge" | "replace" | "importedCount" | "failedCount" | "storageQuotaError" | "statusExpired" | "statusRemoved" | "statusDeleted" | "statusPrivate" | "statusUnknown" | "retry" | "removeFromList" | "pruneStale" | "retrySync" | "resolveSync" | "keepLocal" | "useServer" | "manualMerge" | "close" | "backupRecovery" | "backupRecoveryDescription" | "syncPending" | "syncSynced" | "syncConflict";
641
+ type KeepUiLabelKey = "save" | "saved" | "remove" | "loading" | "saving" | "syncing" | "error" | "allTags" | "tags" | "filterTags" | "activeFilters" | "clearFilters" | "clearAllFilters" | "removeFilter" | "noFilteredItems" | "noFilteredItemsDescription" | "emptyStorageDescription" | "note" | "saveNote" | "noItems" | "loadingItems" | "errorItems" | "search" | "sort" | "newest" | "oldest" | "savedNewest" | "savedOldest" | "updatedNewest" | "updatedOldest" | "previousPage" | "nextPage" | "pagination" | "page" | "selectItems" | "selectedCount" | "deleteSelected" | "tagsToApply" | "applyTags" | "savedMessage" | "removedMessage" | "restoredMessage" | "syncFailedMessage" | "stalePrunedMessage" | "undo" | "undoAvailable" | "selectionScope" | "currentPage" | "searchResults" | "allItems" | "localVersion" | "remoteVersion" | "updatedAt" | "statusAvailable" | "noteSavedMessage" | "exportData" | "importData" | "importMode" | "merge" | "replace" | "importedCount" | "failedCount" | "storageQuotaError" | "statusExpired" | "statusRemoved" | "statusDeleted" | "statusPrivate" | "statusUnknown" | "retry" | "removeFromList" | "pruneStale" | "retrySync" | "resolveSync" | "keepLocal" | "useServer" | "manualMerge" | "close" | "backupRecovery" | "backupRecoveryDescription" | "syncPending" | "syncSynced" | "syncConflict";
622
642
  type KeepUiLabels = Partial<Record<KeepUiLabelKey, string>>;
623
643
  type KeepUiLocaleLabels = Record<KeepUiLabelKey, string>;
624
644
 
@@ -685,6 +705,13 @@ type KeepDisplayStatus = "available" | "expired" | "removed" | "restricted";
685
705
  /** Displays the normalized availability state of a saved item. */
686
706
  declare function KeepItemStatusBadge({ status, label, className, ...props }: KeepItemStatusBadgeProps): react.JSX.Element;
687
707
 
708
+ type KeepShortcutHintProps = Omit<HTMLAttributes<HTMLSpanElement>, "children"> & {
709
+ shortcut: string | readonly string[];
710
+ separator?: ReactNode;
711
+ };
712
+ /** Displays a keyboard shortcut using semantic kbd elements. */
713
+ declare function KeepShortcutHint({ shortcut, separator, ...props }: KeepShortcutHintProps): react.JSX.Element;
714
+
688
715
  type KeepTourShortcutsOptions = {
689
716
  onNext: () => void | Promise<void>;
690
717
  onPrev: () => void | Promise<void>;
@@ -699,6 +726,9 @@ type KeepTourShortcutsOptions = {
699
726
  declare function useKeepTourShortcuts({ onNext, onPrev, enabled, allowInEditable, preventDefault, nextKeys, prevKeys, onError, }: KeepTourShortcutsOptions): void;
700
727
 
701
728
  type KeepTourBarProps<TMeta = Record<string, unknown>> = Omit<HTMLAttributes<HTMLElement>, "children"> & {
729
+ ref?: Ref<HTMLElement> | {
730
+ readonly current: unknown;
731
+ };
702
732
  navigation?: UseKeepNavigatorResult<TMeta>;
703
733
  currentId?: string;
704
734
  initialIndex?: number;
@@ -713,14 +743,41 @@ type KeepTourBarProps<TMeta = Record<string, unknown>> = Omit<HTMLAttributes<HTM
713
743
  nextLabel?: string;
714
744
  backLabel?: string;
715
745
  keyboardShortcuts?: boolean;
746
+ showShortcutHint?: boolean;
716
747
  shortcutOptions?: Omit<KeepTourShortcutsOptions, "onNext" | "onPrev">;
717
748
  progress?: ReactNode;
718
749
  getItemTitle?: (item: KeepItem<TMeta>) => ReactNode;
750
+ children?: ReactNode;
751
+ asChild?: boolean;
719
752
  };
720
753
  /** Headless previous/current/next navigation with optional URL links and keyboard shortcuts. */
721
- declare function KeepTourBar<TMeta = Record<string, unknown>>({ navigation: providedNavigation, currentId, initialIndex, showProgress, prevHref, nextHref, backHref, onPrev, onNext, onBack, prevLabel, nextLabel, backLabel, keyboardShortcuts, shortcutOptions, progress, getItemTitle, ...props }: KeepTourBarProps<TMeta>): react.JSX.Element;
754
+ declare function KeepTourBar<TMeta = Record<string, unknown>>({ navigation: providedNavigation, currentId, initialIndex, showProgress, prevHref, nextHref, backHref, onPrev, onNext, onBack, prevLabel, nextLabel, backLabel, keyboardShortcuts, showShortcutHint, shortcutOptions, progress, getItemTitle, children, asChild, ...props }: KeepTourBarProps<TMeta>): react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
722
755
  declare const KeepNavigator: typeof KeepTourBar;
723
756
 
757
+ type KeepActiveFiltersSummaryProps<TMeta = Record<string, unknown>> = Omit<HTMLAttributes<HTMLElement>, "children"> & {
758
+ ref?: Ref<HTMLElement> | {
759
+ readonly current: unknown;
760
+ };
761
+ query?: KeepListQuery<TMeta>;
762
+ search?: string;
763
+ tags?: readonly string[];
764
+ onSearchChange?: (value: string) => void;
765
+ onTagChange?: (tag: string) => void;
766
+ onClear?: () => void;
767
+ children?: ReactNode | RenderProp<KeepActiveFiltersSummaryState>;
768
+ asChild?: boolean;
769
+ };
770
+ type KeepActiveFiltersSummaryState = {
771
+ search: string;
772
+ tags: string[];
773
+ hasFilters: boolean;
774
+ clear: () => void;
775
+ removeSearch: () => void;
776
+ removeTag: (tag: string) => void;
777
+ };
778
+ /** Lists active search and tag filters with one-tap recovery actions. */
779
+ declare function KeepActiveFiltersSummary<TMeta = Record<string, unknown>>({ query, search: providedSearch, tags: providedTags, onSearchChange, onTagChange, onClear, children, asChild, className, ...rootProps }: KeepActiveFiltersSummaryProps<TMeta>): ReactElement<unknown, string | react.JSXElementConstructor<any>> | null;
780
+
724
781
  type KeepTagFilterState = {
725
782
  tags: string[];
726
783
  tagCounts: Record<string, number>;
@@ -795,15 +852,19 @@ type KeepPruneStaleButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, "
795
852
  /** Removes all unavailable items through the provider's undo-capable batch action. */
796
853
  declare function KeepPruneStaleButton<TMeta = Record<string, unknown>>({ statuses, label, onPruned, children, disabled, ...props }: KeepPruneStaleButtonProps): react.JSX.Element;
797
854
 
855
+ type KeepEmptyStateVariant = "empty-storage" | "empty-filtered";
798
856
  type KeepEmptyStateProps = Omit<HTMLAttributes<HTMLElement>, "children" | "title"> & {
799
857
  title?: ReactNode;
800
858
  description?: ReactNode;
801
859
  action?: ReactNode;
802
860
  children?: ReactNode;
861
+ variant?: KeepEmptyStateVariant;
862
+ onClearFilters?: () => void;
803
863
  asChild?: boolean;
804
864
  };
805
- /** A style-free, reusable empty collection state. */
806
- declare function KeepEmptyState({ title, description, action, children, asChild, className, ...rootProps }: KeepEmptyStateProps): react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
865
+ /** An accessible empty state that distinguishes an empty store from an empty filter result. */
866
+ declare function KeepEmptyState({ title, description, action, children, variant, onClearFilters, asChild, className, ...rootProps }: KeepEmptyStateProps): react.ReactElement<unknown, string | react.JSXElementConstructor<any>>;
867
+
807
868
  type KeepStatusValue = "idle" | "empty" | "loading" | "saving" | "syncing" | "error";
808
869
  type KeepStatusLabels = Partial<Record<KeepStatusValue, ReactNode>>;
809
870
  type KeepStatusState<TMeta = Record<string, unknown>> = {
@@ -916,4 +977,4 @@ type KeepKit<TMeta = Record<string, unknown>> = {
916
977
  /** Create one typed application API for the core and standard UI layer. */
917
978
  declare function createKeepKit<TMeta = Record<string, unknown>>(options?: CreateKeepKitOptions<TMeta>): KeepKit<TMeta>;
918
979
 
919
- export { type CreateKeepKitOptions, KeepAnnouncements, type KeepAnnouncementsProps, KeepAnnouncer, KeepBackup, type KeepBackupProps, KeepBulkActions, type KeepBulkActionsProps, type KeepBulkActionsState, KeepButton, type KeepButtonIcon, type KeepButtonIconProps, type KeepButtonIcons, type KeepButtonLabels, type KeepButtonProps, KeepCollection, type KeepCollectionFeature, type KeepCollectionProps, type KeepDisplayStatus, KeepEmptyState, type KeepEmptyStateProps, KeepHighlight, type KeepHighlightProps, type KeepImageProps, KeepItemCard, type KeepItemCardActionsProps, type KeepItemCardContentProps, type KeepItemCardLinkProps, type KeepItemCardMediaProps, type KeepItemCardProps, KeepItemCardSkeleton, type KeepItemCardSkeletonProps, type KeepItemCardState, type KeepItemCardTagsProps, type KeepItemCardTitleProps, KeepItemCheckbox, type KeepItemCheckboxProps, KeepItemStatusBadge, type KeepItemStatusBadgeProps, type KeepKit, KeepKitProvider, type KeepKitProviderProps, KeepLayout, type KeepLayoutPreset, type KeepLayoutProps, KeepList, type KeepListProps, type KeepListState, KeepNavigator, KeepNoteEditor, type KeepNoteEditorProps, type KeepNoteEditorState, type KeepPagesRouterLike, KeepPagination, type KeepPaginationProps, type KeepPaginationState, KeepPruneStaleButton, type KeepPruneStaleButtonProps, type KeepReorderableItemState, KeepReorderableList, type KeepReorderableListProps, KeepSearchInput, type KeepSearchInputProps, type KeepSelectionScope, KeepSortSelect, type KeepSortSelectProps, type KeepSortValue, KeepStaleNotice, type KeepStaleNoticeProps, KeepStatus, type KeepStatusLabels, type KeepStatusProps, type KeepStatusState, type KeepStatusValue, KeepSyncRecoveryDialog, type KeepSyncRecoveryDialogProps, KeepSyncStatusBanner, type KeepSyncStatusBannerProps, KeepTagEditor, type KeepTagEditorProps, type KeepTagEditorState, KeepTagFilter, type KeepTagFilterProps, type KeepTagFilterState, type KeepThemeDensity, type KeepThemeMode, type KeepThemeName, KeepThemeProvider, type KeepThemeProviderProps, type KeepThemeRadius, type KeepThemeVariables, type KeepToastFeedbackOptions, type KeepToastHandler, KeepTourBar, type KeepTourBarProps, type KeepTourShortcutsOptions, type KeepUiFeedbackEvent, type KeepUiLabelContext, type KeepUiLabelKey, type KeepUiLabels, type KeepUiLocale, type KeepUiLocaleLabels, KeepUiProvider, type KeepUiProviderProps, KeepUndo, type KeepUndoProps, type KeepUrlAdapter, type RenderProp, createKeepKit, createNextPagesRouterAdapter, getKeepLocaleLabels, highlightText, isAllSelected, keepThemeNames, toggleSelectAll, useKeepToastFeedback, useKeepTourShortcuts, useKeepUiLabels, useKeepUrlSync };
980
+ export { type CreateKeepKitOptions, KeepActiveFiltersSummary, type KeepActiveFiltersSummaryProps, type KeepActiveFiltersSummaryState, KeepAnnouncements, type KeepAnnouncementsProps, KeepAnnouncer, KeepBackup, type KeepBackupProps, KeepBulkActions, type KeepBulkActionsProps, type KeepBulkActionsState, KeepButton, type KeepButtonIcon, type KeepButtonIconProps, type KeepButtonIcons, type KeepButtonLabels, type KeepButtonProps, KeepCollection, type KeepCollectionFeature, type KeepCollectionProps, type KeepDisplayStatus, KeepEmptyState, type KeepEmptyStateProps, type KeepEmptyStateVariant, KeepHighlight, type KeepHighlightProps, type KeepImageProps, KeepItemCard, type KeepItemCardActionsProps, type KeepItemCardContentProps, type KeepItemCardLinkProps, type KeepItemCardMediaProps, type KeepItemCardProps, KeepItemCardSkeleton, type KeepItemCardSkeletonProps, type KeepItemCardState, type KeepItemCardTagsProps, type KeepItemCardTitleProps, KeepItemCheckbox, type KeepItemCheckboxProps, KeepItemStatusBadge, type KeepItemStatusBadgeProps, type KeepKit, KeepKitProvider, type KeepKitProviderProps, KeepLayout, type KeepLayoutPreset, type KeepLayoutProps, KeepList, type KeepListProps, type KeepListState, KeepNavigator, KeepNoteEditor, type KeepNoteEditorProps, type KeepNoteEditorState, type KeepPagesRouterLike, KeepPagination, type KeepPaginationProps, type KeepPaginationState, KeepPruneStaleButton, type KeepPruneStaleButtonProps, type KeepReorderableItemState, KeepReorderableList, type KeepReorderableListProps, KeepSearchInput, type KeepSearchInputProps, type KeepSelectionScope, KeepShortcutHint, type KeepShortcutHintProps, KeepSortSelect, type KeepSortSelectProps, type KeepSortValue, KeepStaleNotice, type KeepStaleNoticeProps, KeepStatus, type KeepStatusLabels, type KeepStatusProps, type KeepStatusState, type KeepStatusValue, KeepSyncRecoveryDialog, type KeepSyncRecoveryDialogProps, KeepSyncStatusBanner, type KeepSyncStatusBannerProps, KeepTagEditor, type KeepTagEditorProps, type KeepTagEditorState, KeepTagFilter, type KeepTagFilterProps, type KeepTagFilterState, type KeepThemeDensity, type KeepThemeMode, type KeepThemeName, KeepThemeProvider, type KeepThemeProviderProps, type KeepThemeRadius, type KeepThemeVariables, type KeepToastFeedbackOptions, type KeepToastHandler, KeepTourBar, type KeepTourBarProps, type KeepTourShortcutsOptions, type KeepUiFeedbackEvent, type KeepUiLabelContext, type KeepUiLabelKey, type KeepUiLabels, type KeepUiLocale, type KeepUiLocaleLabels, KeepUiProvider, type KeepUiProviderProps, KeepUndo, type KeepUndoProps, type KeepUrlAdapter, type RenderProp, chainedFunction, composeRefs, createKeepKit, createNextPagesRouterAdapter, createSlot, getKeepLocaleLabels, highlightText, isAllSelected, keepThemeNames, mergeProps, toggleSelectAll, useKeepToastFeedback, useKeepTourShortcuts, useKeepUiLabels, useKeepUrlSync };