@cloudgrid-io/ui 0.31.2 → 0.31.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/blocks/confirm-delete-dialog.d.ts +81 -0
- package/dist/blocks/confirm-delete-dialog.d.ts.map +1 -0
- package/dist/blocks/confirm-delete-dialog.js +89 -0
- package/dist/blocks/confirm-delete-dialog.js.map +1 -0
- package/dist/blocks/icons.d.ts +1 -1
- package/dist/blocks/icons.d.ts.map +1 -1
- package/dist/blocks/icons.js +1 -1
- package/dist/blocks/icons.js.map +1 -1
- package/dist/blocks/phosphor-marks.d.ts +2 -0
- package/dist/blocks/phosphor-marks.d.ts.map +1 -1
- package/dist/blocks/phosphor-marks.js +3 -0
- package/dist/blocks/phosphor-marks.js.map +1 -1
- package/dist/blocks/shelf.d.ts +384 -0
- package/dist/blocks/shelf.d.ts.map +1 -0
- package/dist/blocks/shelf.js +489 -0
- package/dist/blocks/shelf.js.map +1 -0
- package/dist/blocks/showcase-scroll.d.ts +103 -0
- package/dist/blocks/showcase-scroll.d.ts.map +1 -0
- package/dist/blocks/showcase-scroll.js +432 -0
- package/dist/blocks/showcase-scroll.js.map +1 -0
- package/dist/brand/showcase/all-the-way-down.webp +0 -0
- package/dist/brand/showcase/analytics-dashboard.webp +0 -0
- package/dist/brand/showcase/campaign-brief-builder.webp +0 -0
- package/dist/brand/showcase/chess-puzzles.webp +0 -0
- package/dist/brand/showcase/fox-tales.webp +0 -0
- package/dist/brand/showcase/invoices.webp +0 -0
- package/dist/brand/showcase/living-board-update.webp +0 -0
- package/dist/brand/showcase/moon-run.webp +0 -0
- package/dist/brand/showcase/onboarding-guide.webp +0 -0
- package/dist/brand/showcase/online-shop.webp +0 -0
- package/dist/brand/showcase/operating-review.webp +0 -0
- package/dist/brand/showcase/pricing-simulator.webp +0 -0
- package/dist/brand/showcase/rent-or-buy.webp +0 -0
- package/dist/brand/showcase/sales-call-coach.webp +0 -0
- package/dist/brand/showcase/space-today.webp +0 -0
- package/dist/brand/showcase/stocks-dashboard.webp +0 -0
- package/dist/brand/showcase/task-manager.webp +0 -0
- package/dist/brand/showcase/tour-poster.webp +0 -0
- package/dist/brand/showcase/your-crm.webp +0 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -0
- package/dist/index.js.map +1 -1
- package/dist/shadcn.css +41 -0
- package/dist/theme.css +5 -0
- package/dist/tokens/base.json +20 -0
- package/dist/tokens/surface-ink.json +21 -0
- package/dist/tokens/surface-panel.json +21 -0
- package/dist/tokens.css +33 -0
- package/dist/tokens.json +8 -2
- package/package.json +1 -1
|
@@ -0,0 +1,384 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { DrawerContent } from "../ui/drawer.js";
|
|
3
|
+
import { type EntityKind } from "./entity-card.js";
|
|
4
|
+
/**
|
|
5
|
+
* The Shelf (Shelf spec 2026-10-07, Part B): where things that expired or were
|
|
6
|
+
* never published go on their own, and where they are moved back from.
|
|
7
|
+
*
|
|
8
|
+
* Figma `5ouhISIL0mwYGHurvCGoEO`, section "Shelf v2 - 2026-10-07" (9834:7965),
|
|
9
|
+
* frames 01 to 09b. The frames are the LAYOUT. The sizes are the Console's: the
|
|
10
|
+
* founder's instruction was that the Shelf look like the app page and the grid
|
|
11
|
+
* settings page do as they render, so every height and type size below is the
|
|
12
|
+
* one measured off those pages (audit log `2026-10-07-shelf-blocks.md`, step 0)
|
|
13
|
+
* and expressed with the library primitive that already produces it:
|
|
14
|
+
*
|
|
15
|
+
* table head 40, 15/500 `TableHead` as is
|
|
16
|
+
* row 57 (two lines) `TableCell` as is, 8 padding
|
|
17
|
+
* reason pill 20, 13/500 `Badge variant="secondary"`, the Versions table's grey pill
|
|
18
|
+
* row buttons 28, 13/500 `Button size="sm"` / `size="icon-sm"`, the app header's rung
|
|
19
|
+
* toolbar 32 `InputGroup`, `Button`, `Tabs` default, all h-8
|
|
20
|
+
* drawer 448 `DrawerContent size="md"`, every Console drawer
|
|
21
|
+
*
|
|
22
|
+
* ## What is in here
|
|
23
|
+
*
|
|
24
|
+
* The parts, each usable alone, and `Shelf`, which composes them the way the
|
|
25
|
+
* frames do and owns the transient state between them: which row's drawer is
|
|
26
|
+
* open, which item the delete dialog is about, which rows are mid-request.
|
|
27
|
+
*
|
|
28
|
+
* ShelfToolbar reason tabs with counts, search, sort menu, List/Compact
|
|
29
|
+
* ShelfTable the List view: a real <table>
|
|
30
|
+
* ShelfCardList the Compact view, and every view under 768px of shelf
|
|
31
|
+
* ShelfItemDetails the drawer (right) or bottom sheet (phone)
|
|
32
|
+
* ShelfEmpty "Your shelf is empty"
|
|
33
|
+
* ShelfFooter "Showing 6 of 24 creations" and Show more
|
|
34
|
+
* toastMovedToGrid the confirmation toast, no Undo
|
|
35
|
+
*
|
|
36
|
+
* The type-to-confirm dialog is its own module, `confirm-delete-dialog`,
|
|
37
|
+
* because nothing about it is Shelf-specific.
|
|
38
|
+
*
|
|
39
|
+
* ## Data-agnostic
|
|
40
|
+
*
|
|
41
|
+
* Nothing here fetches, filters, sorts or counts. The spec is explicit that the
|
|
42
|
+
* counts, search and sort come from the server (Part D) and that the Console must
|
|
43
|
+
* not filter a truncated list in the browser, so the blocks only REPORT what the
|
|
44
|
+
* reader asked for (`onTabChange`, `onSearch`, `onSort`) and render the `items`
|
|
45
|
+
* they are handed. Counts are optional: until the server sends them, a tab is
|
|
46
|
+
* its word alone.
|
|
47
|
+
*
|
|
48
|
+
* ## Narrow
|
|
49
|
+
*
|
|
50
|
+
* By container query on the block, not the window: under 48rem of shelf the
|
|
51
|
+
* table becomes the stacked cards, the cards go to one column with a full-width
|
|
52
|
+
* Move to grid, and the sort menu and view toggle leave (frame 09 draws neither).
|
|
53
|
+
* The reason tabs are the library's `pill` chips at every width, which is what
|
|
54
|
+
* frame 09 draws and what scrolls rather than wraps on a phone. The drawer is
|
|
55
|
+
* the one thing that asks the WINDOW, because a sheet is a property of the
|
|
56
|
+
* screen: `detailsSide="auto"` is a bottom sheet under 768px, the Console's own
|
|
57
|
+
* phone breakpoint.
|
|
58
|
+
*/
|
|
59
|
+
/**
|
|
60
|
+
* Why something is on the shelf. The reason follows the kind (spec, "The
|
|
61
|
+
* model"): a page only ever expires, an app or agent is only ever never
|
|
62
|
+
* published. The Console derives it from `realm`; the block takes it as given.
|
|
63
|
+
*/
|
|
64
|
+
export declare const SHELF_REASON_ORDER: readonly ["expired", "never_published"];
|
|
65
|
+
export type ShelfReason = (typeof SHELF_REASON_ORDER)[number];
|
|
66
|
+
/** The pill's word. */
|
|
67
|
+
export declare const SHELF_REASON_LABEL: Record<ShelfReason, string>;
|
|
68
|
+
/** The line beside the pill. Library copy, from the frames' annotation. */
|
|
69
|
+
export declare const SHELF_REASON_DETAIL: Record<ShelfReason, string>;
|
|
70
|
+
/** The reason tabs. `all` first, then the reasons in their own order. */
|
|
71
|
+
export declare const SHELF_TAB_ORDER: readonly ["all", "expired", "never_published"];
|
|
72
|
+
export type ShelfTab = (typeof SHELF_TAB_ORDER)[number];
|
|
73
|
+
export declare const SHELF_TAB_LABEL: Record<ShelfTab, string>;
|
|
74
|
+
/** The sort menu, in the order frame 08 lists it. The first is the default. */
|
|
75
|
+
export declare const SHELF_SORT_ORDER: readonly ["recent", "oldest", "name"];
|
|
76
|
+
export type ShelfSort = (typeof SHELF_SORT_ORDER)[number];
|
|
77
|
+
export declare const SHELF_SORT_LABEL: Record<ShelfSort, string>;
|
|
78
|
+
export declare const SHELF_VIEW_ORDER: readonly ["list", "compact"];
|
|
79
|
+
export type ShelfView = (typeof SHELF_VIEW_ORDER)[number];
|
|
80
|
+
export declare const SHELF_VIEW_LABEL: Record<ShelfView, string>;
|
|
81
|
+
export declare const SHELF_EMPTY_TITLE = "Your shelf is empty";
|
|
82
|
+
export declare const SHELF_EMPTY_DESCRIPTION = "Things that expire or are never published will show up here on their own.";
|
|
83
|
+
export declare const SHELF_NO_MATCHES = "Nothing on your shelf matches that.";
|
|
84
|
+
export declare const SHELF_SEARCH_PLACEHOLDER = "Search your shelf";
|
|
85
|
+
export declare const SHELF_AVAILABILITY_NOTE = "Move it to your grid to bring it back.";
|
|
86
|
+
export declare const SHELF_MOVE_LABEL = "Move to grid";
|
|
87
|
+
/** The toast after a move. No Undo: the move is the undo. */
|
|
88
|
+
export declare function shelfMovedMessage(name: string): string;
|
|
89
|
+
/** One thing on the shelf. */
|
|
90
|
+
export type ShelfItem = {
|
|
91
|
+
id: string;
|
|
92
|
+
/** The display name. */
|
|
93
|
+
name: string;
|
|
94
|
+
/** What the reader types to confirm a delete. Falls back to `name`. */
|
|
95
|
+
slug?: string;
|
|
96
|
+
/** Drives the fallback mark and, without `kindLabel`, the word under the name. */
|
|
97
|
+
kind: EntityKind;
|
|
98
|
+
/** The word under the name, when the kind's own word is not specific enough ("Presentation"). */
|
|
99
|
+
kindLabel?: string;
|
|
100
|
+
reason: ShelfReason;
|
|
101
|
+
/** When it moved to the shelf. An ISO string, a Date or epoch milliseconds. */
|
|
102
|
+
movedAt: string | number | Date;
|
|
103
|
+
/** A preview picture. Without one, or if it fails to load, the kind's mark. */
|
|
104
|
+
thumbnailSrc?: string;
|
|
105
|
+
};
|
|
106
|
+
/** Per-tab counts. Any that are missing render as the tab's word alone. */
|
|
107
|
+
export type ShelfCounts = Partial<Record<ShelfTab, number>>;
|
|
108
|
+
/**
|
|
109
|
+
* "Sep 14" in a row, "Sep 12, 2026" in the drawer. English months, the
|
|
110
|
+
* reader's own time zone, which is how the Console prints every other date.
|
|
111
|
+
*/
|
|
112
|
+
export declare function formatShelfDate(value: ShelfItem["movedAt"], style?: "short" | "long"): string;
|
|
113
|
+
declare const THUMB_SIZE: {
|
|
114
|
+
readonly row: "h-10 w-16 rounded-2xs";
|
|
115
|
+
readonly card: "h-[70px] w-28 rounded-xs";
|
|
116
|
+
readonly sheet: "h-[70px] w-28 rounded-xs";
|
|
117
|
+
readonly preview: "aspect-[16/9] w-full rounded-lg";
|
|
118
|
+
};
|
|
119
|
+
/**
|
|
120
|
+
* The picture, or the kind's mark on the kind's tint when there is none.
|
|
121
|
+
*
|
|
122
|
+
* Decorative in both forms (`alt=""`, `aria-hidden` mark): the name is always
|
|
123
|
+
* beside it, and a screenshot of an app has nothing a screen reader needs. A
|
|
124
|
+
* picture that fails to load falls back to the mark rather than a broken box.
|
|
125
|
+
*/
|
|
126
|
+
declare function ShelfThumbnail({ item, size, className, }: {
|
|
127
|
+
item: Pick<ShelfItem, "kind" | "thumbnailSrc">;
|
|
128
|
+
size?: keyof typeof THUMB_SIZE;
|
|
129
|
+
className?: string;
|
|
130
|
+
}): React.JSX.Element;
|
|
131
|
+
/** The grey pill and its detail line. */
|
|
132
|
+
declare function ShelfReasonTag({ reason, className }: {
|
|
133
|
+
reason: ShelfReason;
|
|
134
|
+
className?: string;
|
|
135
|
+
}): React.JSX.Element;
|
|
136
|
+
/** The row's "..." menu. Delete is its only item (frame 06). */
|
|
137
|
+
declare function ShelfRowMenu({ item, onRequestDelete, }: {
|
|
138
|
+
item: ShelfItem;
|
|
139
|
+
onRequestDelete: (item: ShelfItem) => void;
|
|
140
|
+
}): React.JSX.Element;
|
|
141
|
+
type RowActions = {
|
|
142
|
+
/** The reader asked to see an item: its name was pressed, or its row clicked. */
|
|
143
|
+
onOpenDetails?: (item: ShelfItem) => void;
|
|
144
|
+
onMoveToGrid?: (item: ShelfItem) => void;
|
|
145
|
+
/** The reader picked Delete in a row's menu. Absent, the menu is not drawn. */
|
|
146
|
+
onRequestDelete?: (item: ShelfItem) => void;
|
|
147
|
+
/** The item whose details are open; its row is drawn selected. */
|
|
148
|
+
selectedId?: string | null;
|
|
149
|
+
/** Items with a Move to grid in flight. */
|
|
150
|
+
movingIds?: ReadonlySet<string>;
|
|
151
|
+
};
|
|
152
|
+
/**
|
|
153
|
+
* The List view (frame 01): Creation, Why it's here, Moved here, actions.
|
|
154
|
+
*
|
|
155
|
+
* A real `<table>` with a header row, because it is one: four facts per item in
|
|
156
|
+
* columns a reader compares down the page. The name is a button that opens the
|
|
157
|
+
* details, which is the keyboard path; a click anywhere else on the row does the
|
|
158
|
+
* same for a mouse, and ignores clicks that land on the row's own buttons.
|
|
159
|
+
*/
|
|
160
|
+
declare function ShelfTable({ items, onOpenDetails, onMoveToGrid, onRequestDelete, selectedId, movingIds, caption, className, }: RowActions & {
|
|
161
|
+
items: readonly ShelfItem[];
|
|
162
|
+
/** The table's accessible name. Rendered for screen readers only. */
|
|
163
|
+
caption?: string;
|
|
164
|
+
className?: string;
|
|
165
|
+
}): React.JSX.Element;
|
|
166
|
+
/**
|
|
167
|
+
* One item as a card (frames 02 and 09).
|
|
168
|
+
*
|
|
169
|
+
* Two arrangements by container query on the card itself. Wide (a Compact
|
|
170
|
+
* column on a desktop): picture, three lines, Move to grid and the menu in a
|
|
171
|
+
* row. Narrow (a phone): a smaller picture and two lines with the menu top
|
|
172
|
+
* right, and Move to grid full width underneath, which is frame 09 exactly,
|
|
173
|
+
* detail line and all left out.
|
|
174
|
+
*/
|
|
175
|
+
declare function ShelfCard({ item, onOpenDetails, onMoveToGrid, onRequestDelete, selected, moving, }: Omit<RowActions, "selectedId" | "movingIds"> & {
|
|
176
|
+
item: ShelfItem;
|
|
177
|
+
selected?: boolean;
|
|
178
|
+
moving?: boolean;
|
|
179
|
+
}): React.JSX.Element;
|
|
180
|
+
/**
|
|
181
|
+
* The cards as a list. `columns="auto"` is two columns from 48rem of shelf and
|
|
182
|
+
* one below, which is the Compact view; `columns={1}` is one at every width,
|
|
183
|
+
* which is the List view on a phone.
|
|
184
|
+
*/
|
|
185
|
+
declare function ShelfCardList({ items, columns, label, onOpenDetails, onMoveToGrid, onRequestDelete, selectedId, movingIds, className, }: RowActions & {
|
|
186
|
+
items: readonly ShelfItem[];
|
|
187
|
+
columns?: "auto" | 1;
|
|
188
|
+
/** The list's accessible name. */
|
|
189
|
+
label?: string;
|
|
190
|
+
className?: string;
|
|
191
|
+
}): React.JSX.Element;
|
|
192
|
+
/** What the reason tabs, search and sort do: work, go, or show and refuse. */
|
|
193
|
+
export declare const SHELF_QUERY_CONTROLS_ORDER: readonly ["enabled", "hidden", "disabled"];
|
|
194
|
+
export type ShelfQueryControls = (typeof SHELF_QUERY_CONTROLS_ORDER)[number];
|
|
195
|
+
/**
|
|
196
|
+
* Reason tabs, then search, sort and the view toggle (frames 01, 08 and 09).
|
|
197
|
+
*
|
|
198
|
+
* Every control is controlled: the toolbar reports and the caller decides,
|
|
199
|
+
* because what a tab or a sort MEANS is a server query (spec, Part D).
|
|
200
|
+
*
|
|
201
|
+
* - The reason tabs are `Tabs` with the `pill` list: the chips frame 09 draws,
|
|
202
|
+
* scrolling rather than wrapping on a phone. A count renders only when the
|
|
203
|
+
* caller has one; "All" alone is honest, "All 0" while loading is not.
|
|
204
|
+
* - The view toggle is `Tabs` with the default list, the library's segmented
|
|
205
|
+
* control. Hidden under 48rem of shelf, where there is one view.
|
|
206
|
+
* - Sort is a `DropdownMenu` radio group, so the current order carries the tick
|
|
207
|
+
* frame 08 draws and a screen reader hears which one is checked.
|
|
208
|
+
*
|
|
209
|
+
* ## `queryControls`, for a caller whose server cannot filter yet
|
|
210
|
+
*
|
|
211
|
+
* The tabs, the search and the sort are QUERIES. Until the server answers them
|
|
212
|
+
* (spec, Part D), a caller holding a paged list must not offer them, because
|
|
213
|
+
* answering them in the browser over the rows it happens to have loaded is the
|
|
214
|
+
* silent data loss the spec forbids. So:
|
|
215
|
+
*
|
|
216
|
+
* "enabled" the default: all of it works
|
|
217
|
+
* "hidden" the three are not rendered at all; the List/Compact toggle
|
|
218
|
+
* stays, because the view is presentation, not a query
|
|
219
|
+
* "disabled" the three render, dimmed and refusing: the tabs and the sort
|
|
220
|
+
* are disabled, the search field is a real `disabled` input so
|
|
221
|
+
* Tab skips it (no focusable dead box), each group carries
|
|
222
|
+
* `aria-disabled`, and none of them calls back. One tab stop
|
|
223
|
+
* is left on purpose: Base UI keeps the selected tab focusable
|
|
224
|
+
* while disabled (the ARIA pattern for a disabled tab), and that
|
|
225
|
+
* is where a screen reader hears `queryHint`.
|
|
226
|
+
*
|
|
227
|
+
* `queryHint` is the one line saying why, where the controls are or would be.
|
|
228
|
+
* When the controls are disabled it also describes them (`aria-describedby`), so
|
|
229
|
+
* a screen reader that lands on a dimmed tab hears the reason.
|
|
230
|
+
*/
|
|
231
|
+
declare function ShelfToolbar({ tab, onTabChange, counts, query, onSearch, sort, onSort, view, onViewChange, showControls, queryControls, queryHint, className, }: {
|
|
232
|
+
tab: ShelfTab;
|
|
233
|
+
onTabChange?: (tab: ShelfTab) => void;
|
|
234
|
+
counts?: ShelfCounts;
|
|
235
|
+
query: string;
|
|
236
|
+
onSearch?: (query: string) => void;
|
|
237
|
+
sort: ShelfSort;
|
|
238
|
+
onSort?: (sort: ShelfSort) => void;
|
|
239
|
+
view: ShelfView;
|
|
240
|
+
onViewChange?: (view: ShelfView) => void;
|
|
241
|
+
/** False draws the tabs alone: the empty shelf (frame 05) has nothing to search. */
|
|
242
|
+
showControls?: boolean;
|
|
243
|
+
/** Whether the reason tabs, search and sort work, are left out, or show disabled. */
|
|
244
|
+
queryControls?: ShelfQueryControls;
|
|
245
|
+
/**
|
|
246
|
+
* One quiet line where the query controls are or would be, saying why they are
|
|
247
|
+
* off. Shown with `"hidden"` and `"disabled"` only: beside working controls it
|
|
248
|
+
* would be a reason for nothing.
|
|
249
|
+
*/
|
|
250
|
+
queryHint?: React.ReactNode;
|
|
251
|
+
className?: string;
|
|
252
|
+
}): React.JSX.Element | null;
|
|
253
|
+
/**
|
|
254
|
+
* "Showing 6 of 24 creations" and Show more. The count line needs `total`; a
|
|
255
|
+
* caller without one (no server count yet, spec Part C) gets Show more alone.
|
|
256
|
+
*/
|
|
257
|
+
declare function ShelfFooter({ shown, total, hasMore, onShowMore, loadingMore, className, }: {
|
|
258
|
+
shown: number;
|
|
259
|
+
total?: number;
|
|
260
|
+
hasMore?: boolean;
|
|
261
|
+
onShowMore?: () => void;
|
|
262
|
+
loadingMore?: boolean;
|
|
263
|
+
className?: string;
|
|
264
|
+
}): React.JSX.Element | null;
|
|
265
|
+
/**
|
|
266
|
+
* The empty shelf (frame 05). The way out is a link when `backHref` is given,
|
|
267
|
+
* rendered through `linkComponent` (Next's `Link`, say), or a button for
|
|
268
|
+
* `onBack` alone.
|
|
269
|
+
*/
|
|
270
|
+
declare function ShelfEmpty({ backHref, onBack, backLabel, linkComponent, title, description, headingLevel, className, }: {
|
|
271
|
+
backHref?: string;
|
|
272
|
+
onBack?: () => void;
|
|
273
|
+
backLabel?: string;
|
|
274
|
+
linkComponent?: React.ElementType;
|
|
275
|
+
title?: React.ReactNode;
|
|
276
|
+
description?: React.ReactNode;
|
|
277
|
+
headingLevel?: 2 | 3;
|
|
278
|
+
className?: string;
|
|
279
|
+
}): React.JSX.Element;
|
|
280
|
+
/**
|
|
281
|
+
* The details drawer (frame 03), or the bottom sheet on a phone (frame 09b).
|
|
282
|
+
*
|
|
283
|
+
* The library `Drawer` at its `md` rung, 448, which is every Console drawer.
|
|
284
|
+
* What it says is the frames' list and nothing more: no Open app, because
|
|
285
|
+
* nothing on the shelf is live, and no Last opened, because the platform does
|
|
286
|
+
* not record it (annotation 9837:8842).
|
|
287
|
+
*
|
|
288
|
+
* Move to grid is the page's primary action, so it takes the Console's primary
|
|
289
|
+
* variant (`cta`, the teal, `PrimaryAction`). Delete is a quiet red link under
|
|
290
|
+
* it and opens the confirm dialog; the caller decides what that means.
|
|
291
|
+
*/
|
|
292
|
+
declare function ShelfItemDetails({ item, open, onOpenChange, side, onMoveToGrid, onRequestDelete, moving, container, }: {
|
|
293
|
+
item: ShelfItem | null;
|
|
294
|
+
open: boolean;
|
|
295
|
+
onOpenChange: (open: boolean) => void;
|
|
296
|
+
side?: "right" | "bottom";
|
|
297
|
+
onMoveToGrid?: (item: ShelfItem) => void;
|
|
298
|
+
onRequestDelete?: (item: ShelfItem) => void;
|
|
299
|
+
moving?: boolean;
|
|
300
|
+
/** Forwarded to the portal, for a drawer that must stay inside a surface scope. */
|
|
301
|
+
container?: React.ComponentProps<typeof DrawerContent>["container"];
|
|
302
|
+
}): React.JSX.Element;
|
|
303
|
+
/**
|
|
304
|
+
* "{name} moved to your grid", with View grid when the caller can take the
|
|
305
|
+
* reader there (frame 04). No Undo: moving it back is what the Shelf is for.
|
|
306
|
+
*
|
|
307
|
+
* Fires through the library `Toaster` (`sonner`), which the Console already
|
|
308
|
+
* mounts once at its root. Returns the toast's id.
|
|
309
|
+
*/
|
|
310
|
+
export declare function toastMovedToGrid(name: string, { onViewGrid, viewGridLabel }?: {
|
|
311
|
+
onViewGrid?: () => void;
|
|
312
|
+
viewGridLabel?: string;
|
|
313
|
+
}): string | number;
|
|
314
|
+
export type ShelfProps = {
|
|
315
|
+
/** What to show: the server's page for the current tab, search and sort. */
|
|
316
|
+
items: readonly ShelfItem[];
|
|
317
|
+
/** Per-tab counts from the server. Missing ones render as the word alone. */
|
|
318
|
+
counts?: ShelfCounts;
|
|
319
|
+
/** The total for the current tab and search, for "Showing 6 of 24". */
|
|
320
|
+
total?: number;
|
|
321
|
+
/** More pages exist; draws Show more when `onShowMore` is given. */
|
|
322
|
+
hasMore?: boolean;
|
|
323
|
+
onShowMore?: () => void;
|
|
324
|
+
loadingMore?: boolean;
|
|
325
|
+
tab?: ShelfTab;
|
|
326
|
+
defaultTab?: ShelfTab;
|
|
327
|
+
onTabChange?: (tab: ShelfTab) => void;
|
|
328
|
+
query?: string;
|
|
329
|
+
defaultQuery?: string;
|
|
330
|
+
/** Every keystroke. Debounce on the caller's side if the server needs it. */
|
|
331
|
+
onSearch?: (query: string) => void;
|
|
332
|
+
sort?: ShelfSort;
|
|
333
|
+
defaultSort?: ShelfSort;
|
|
334
|
+
onSort?: (sort: ShelfSort) => void;
|
|
335
|
+
view?: ShelfView;
|
|
336
|
+
defaultView?: ShelfView;
|
|
337
|
+
onViewChange?: (view: ShelfView) => void;
|
|
338
|
+
/** Move to grid, from a row or the drawer. A returned promise disables the button until it settles. */
|
|
339
|
+
onMoveToGrid?: (item: ShelfItem) => void | Promise<void>;
|
|
340
|
+
/**
|
|
341
|
+
* The CONFIRMED delete, after the reader has typed the slug. A returned promise
|
|
342
|
+
* keeps the dialog open and pending until it settles; a rejection shows
|
|
343
|
+
* `deleteErrorMessage` and keeps it open. Absent, no Delete is offered anywhere.
|
|
344
|
+
*/
|
|
345
|
+
onDelete?: (item: ShelfItem) => void | Promise<void>;
|
|
346
|
+
deleteErrorMessage?: string;
|
|
347
|
+
/** A row or card was opened; the drawer opens either way. */
|
|
348
|
+
onOpenDetails?: (item: ShelfItem) => void;
|
|
349
|
+
/**
|
|
350
|
+
* Whether the reason tabs, search and sort work (`"enabled"`, the default), are
|
|
351
|
+
* left out (`"hidden"`), or show disabled (`"disabled"`). For a caller whose
|
|
352
|
+
* server cannot answer them yet: answering them over a partly loaded list is
|
|
353
|
+
* silent data loss. The List/Compact toggle is unaffected.
|
|
354
|
+
*/
|
|
355
|
+
queryControls?: ShelfQueryControls;
|
|
356
|
+
/** Why the query controls are off, in one line where they are or would be. Not shown on an empty shelf. */
|
|
357
|
+
queryHint?: React.ReactNode;
|
|
358
|
+
/** The empty state's way out. */
|
|
359
|
+
emptyBackHref?: string;
|
|
360
|
+
onEmptyBack?: () => void;
|
|
361
|
+
linkComponent?: React.ElementType;
|
|
362
|
+
/**
|
|
363
|
+
* Where the details open. `auto` is a bottom sheet under 768px of window and
|
|
364
|
+
* a right-hand drawer above.
|
|
365
|
+
*/
|
|
366
|
+
detailsSide?: "auto" | "right" | "bottom";
|
|
367
|
+
className?: string;
|
|
368
|
+
};
|
|
369
|
+
/**
|
|
370
|
+
* The whole Shelf body, as frames 01 to 09b compose it: toolbar, then the
|
|
371
|
+
* table, the cards or the empty state, then the footer, plus the drawer and the
|
|
372
|
+
* delete dialog it opens.
|
|
373
|
+
*
|
|
374
|
+
* NOT in it: the page around it. The breadcrumb, the "Shelf" title and its
|
|
375
|
+
* subtitle, the white box and the Back pill are the Console's page frame, and the
|
|
376
|
+
* gallery's full-page frame draws them at the Console's measured sizes.
|
|
377
|
+
*
|
|
378
|
+
* Empty means the server says the whole shelf is empty: `counts.all === 0`, or
|
|
379
|
+
* no counts, no items, the All tab and no search. A tab or a search with no
|
|
380
|
+
* results is not an empty shelf, and says so in one line instead.
|
|
381
|
+
*/
|
|
382
|
+
declare function Shelf({ items, counts, total, hasMore, onShowMore, loadingMore, tab: tabProp, defaultTab, onTabChange, query: queryProp, defaultQuery, onSearch, sort: sortProp, defaultSort, onSort, view: viewProp, defaultView, onViewChange, onMoveToGrid, onDelete, deleteErrorMessage, onOpenDetails, emptyBackHref, onEmptyBack, linkComponent, detailsSide, queryControls, queryHint, className, }: ShelfProps): React.JSX.Element;
|
|
383
|
+
export { Shelf, ShelfCard, ShelfCardList, ShelfEmpty, ShelfFooter, ShelfItemDetails, ShelfReasonTag, ShelfRowMenu, ShelfTable, ShelfThumbnail, ShelfToolbar, };
|
|
384
|
+
//# sourceMappingURL=shelf.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"shelf.d.ts","sourceRoot":"","sources":["../../src/blocks/shelf.tsx"],"names":[],"mappings":"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"}
|