@cloudgrid-io/ui 0.41.0 → 0.43.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/dist/blocks/confirm-delete-dialog.d.ts.map +1 -1
- package/dist/blocks/confirm-delete-dialog.js +5 -1
- package/dist/blocks/confirm-delete-dialog.js.map +1 -1
- package/dist/blocks/locked-section.d.ts +36 -9
- package/dist/blocks/locked-section.d.ts.map +1 -1
- package/dist/blocks/locked-section.js +31 -6
- package/dist/blocks/locked-section.js.map +1 -1
- package/dist/blocks/search-field.d.ts +24 -0
- package/dist/blocks/search-field.d.ts.map +1 -0
- package/dist/blocks/search-field.js +28 -0
- package/dist/blocks/search-field.js.map +1 -0
- package/dist/blocks/shelf.d.ts +24 -9
- package/dist/blocks/shelf.d.ts.map +1 -1
- package/dist/blocks/shelf.js +52 -15
- package/dist/blocks/shelf.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/lib/cloudgrid-cn.d.ts +14 -0
- package/dist/lib/cloudgrid-cn.d.ts.map +1 -1
- package/dist/lib/cloudgrid-cn.js +17 -0
- package/dist/lib/cloudgrid-cn.js.map +1 -1
- package/dist/ui/badge.d.ts +1 -1
- package/dist/ui/badge.d.ts.map +1 -1
- package/dist/ui/badge.js +19 -0
- package/dist/ui/badge.js.map +1 -1
- package/dist/ui/button.d.ts +4 -2
- package/dist/ui/button.d.ts.map +1 -1
- package/dist/ui/button.js +97 -43
- package/dist/ui/button.js.map +1 -1
- package/dist/ui/dialog.d.ts +52 -0
- package/dist/ui/dialog.d.ts.map +1 -1
- package/dist/ui/dialog.js +57 -5
- package/dist/ui/dialog.js.map +1 -1
- package/dist/ui/drawer.d.ts +83 -11
- package/dist/ui/drawer.d.ts.map +1 -1
- package/dist/ui/drawer.js +137 -17
- package/dist/ui/drawer.js.map +1 -1
- package/dist/ui/input-group.d.ts.map +1 -1
- package/dist/ui/input-group.js +7 -2
- package/dist/ui/input-group.js.map +1 -1
- package/dist/ui/input.d.ts +6 -1
- package/dist/ui/input.d.ts.map +1 -1
- package/dist/ui/input.js +61 -3
- package/dist/ui/input.js.map +1 -1
- package/dist/ui/radio-group.d.ts.map +1 -1
- package/dist/ui/radio-group.js +24 -6
- package/dist/ui/radio-group.js.map +1 -1
- package/dist/ui/select.d.ts +10 -0
- package/dist/ui/select.d.ts.map +1 -1
- package/dist/ui/select.js +11 -1
- package/dist/ui/select.js.map +1 -1
- package/dist/ui/table.d.ts +27 -0
- package/dist/ui/table.d.ts.map +1 -1
- package/dist/ui/table.js +39 -6
- package/dist/ui/table.js.map +1 -1
- package/dist/ui/tabs.d.ts +1 -1
- package/dist/ui/textarea.d.ts +7 -0
- package/dist/ui/textarea.d.ts.map +1 -1
- package/dist/ui/textarea.js +8 -1
- package/dist/ui/textarea.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"confirm-delete-dialog.d.ts","sourceRoot":"","sources":["../../src/blocks/confirm-delete-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAa9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkDG;AAEH,+EAA+E;AAC/E,eAAO,MAAM,0BAA0B,kGAC0D,CAAA;AAEjG,MAAM,MAAM,wBAAwB,GAAG;IACrC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,8CAA8C;IAC9C,IAAI,EAAE,MAAM,CAAA;IACZ,mEAAmE;IACnE,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,0EAA0E;IAC1E,SAAS,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACrC,sFAAsF;IACtF,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,oDAAoD;IACpD,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,2BAA2B;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,sCAAsC;IACtC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,+BAA+B;IAC/B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,iBAAS,mBAAmB,CAAC,EAC3B,IAAI,EACJ,YAAY,EACZ,IAAI,EACJ,WAAW,EACX,SAAS,EACT,OAAe,EACf,KAAK,EACL,KAAK,EACL,WAAwC,EACxC,YAAuB,EACvB,YAAyB,EACzB,WAAsB,EACtB,SAAS,GACV,EAAE,wBAAwB,
|
|
1
|
+
{"version":3,"file":"confirm-delete-dialog.d.ts","sourceRoot":"","sources":["../../src/blocks/confirm-delete-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAa9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkDG;AAEH,+EAA+E;AAC/E,eAAO,MAAM,0BAA0B,kGAC0D,CAAA;AAEjG,MAAM,MAAM,wBAAwB,GAAG;IACrC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,8CAA8C;IAC9C,IAAI,EAAE,MAAM,CAAA;IACZ,mEAAmE;IACnE,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,0EAA0E;IAC1E,SAAS,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACrC,sFAAsF;IACtF,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,oDAAoD;IACpD,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,2BAA2B;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,sCAAsC;IACtC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,+BAA+B;IAC/B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,iBAAS,mBAAmB,CAAC,EAC3B,IAAI,EACJ,YAAY,EACZ,IAAI,EACJ,WAAW,EACX,SAAS,EACT,OAAe,EACf,KAAK,EACL,KAAK,EACL,WAAwC,EACxC,YAAuB,EACvB,YAAyB,EACzB,WAAsB,EACtB,SAAS,GACV,EAAE,wBAAwB,qBA0F1B;AAED,OAAO,EAAE,mBAAmB,EAAE,CAAA"}
|
|
@@ -83,7 +83,11 @@ function ConfirmDeleteDialog({ open, onOpenChange, name, confirmText, onConfirm,
|
|
|
83
83
|
return;
|
|
84
84
|
void onConfirm();
|
|
85
85
|
}
|
|
86
|
-
return (_jsx(Dialog, { open: open, onOpenChange: changeOpen, children: _jsxs(DialogContent, { "data-slot": "confirm-delete-dialog", initialFocus: field, className: cn("gap-5 p-6 sm:max-w-md", className), children: [_jsxs(DialogHeader, { className: "gap-3 pr-8", children: [_jsx(DialogTitle, { className: "text-heading-sm leading-tight", children: title ?? `Delete ${name}?` }), _jsx(DialogDescription, { className: "text-body-sm text-body", children: description })] }), _jsxs("form", { className: "grid gap-5", onSubmit: submit, noValidate: true, children: [_jsxs("div", { className: "grid gap-2", children: [_jsxs("label", { htmlFor: fieldId, className: "text-body-sm font-medium text-ink", children: ["Type ", _jsx("span", { className: "font-mono text-mono", children: target }), " to confirm"] }), _jsx(Input, { ref: field, id: fieldId, value: typed, onChange: (event) => setTyped(event.target.value), disabled: pending, autoComplete: "off", autoCapitalize: "off", spellCheck: false, "aria-describedby": error ? errorId : undefined, "data-slot": "confirm-delete-field" }), error ? (_jsx("p", { id: errorId, role: "alert", className: "m-0 text-caption text-danger-strong", children: error })) : null] }), _jsxs("div", { className: "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", children: [_jsx(Button, { type: "button", variant: "outline", disabled: pending, onClick: () => changeOpen(false), children: cancelLabel }), _jsx(Button, { type: "submit",
|
|
86
|
+
return (_jsx(Dialog, { open: open, onOpenChange: changeOpen, children: _jsxs(DialogContent, { "data-slot": "confirm-delete-dialog", initialFocus: field, className: cn("gap-5 p-6 sm:max-w-md", className), children: [_jsxs(DialogHeader, { className: "gap-3 pr-8", children: [_jsx(DialogTitle, { className: "text-heading-sm leading-tight", children: title ?? `Delete ${name}?` }), _jsx(DialogDescription, { className: "text-body-sm text-body", children: description })] }), _jsxs("form", { className: "grid gap-5", onSubmit: submit, noValidate: true, children: [_jsxs("div", { className: "grid gap-2", children: [_jsxs("label", { htmlFor: fieldId, className: "text-body-sm font-medium text-ink", children: ["Type ", _jsx("span", { className: "font-mono text-mono", children: target }), " to confirm"] }), _jsx(Input, { ref: field, id: fieldId, value: typed, onChange: (event) => setTyped(event.target.value), disabled: pending, autoComplete: "off", autoCapitalize: "off", spellCheck: false, "aria-describedby": error ? errorId : undefined, "data-slot": "confirm-delete-field" }), error ? (_jsx("p", { id: errorId, role: "alert", className: "m-0 text-caption text-danger-strong", children: error })) : null] }), _jsxs("div", { className: "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", children: [_jsx(Button, { type: "button", variant: "outline", disabled: pending, onClick: () => changeOpen(false), children: cancelLabel }), _jsx(Button, { type: "submit",
|
|
87
|
+
// `primary` for its metrics only (#376): the colours below are the
|
|
88
|
+
// danger pair, and Cancel beside it is `outline` at the same 32px.
|
|
89
|
+
// The Style Guide default would make Delete 40 tall next to it.
|
|
90
|
+
variant: "primary", disabled: !matches || pending, "data-slot": "confirm-delete-submit", className: "bg-danger-strong text-on-primary hover:bg-danger-strong/90 focus-visible:border-danger-strong focus-visible:ring-danger-border", children: pending ? pendingLabel : confirmLabel })] })] })] }) }));
|
|
87
91
|
}
|
|
88
92
|
export { ConfirmDeleteDialog };
|
|
89
93
|
//# sourceMappingURL=confirm-delete-dialog.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"confirm-delete-dialog.js","sourceRoot":"","sources":["../../src/blocks/confirm-delete-dialog.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"confirm-delete-dialog.js","sourceRoot":"","sources":["../../src/blocks/confirm-delete-dialog.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,17 +1,44 @@
|
|
|
1
1
|
/**
|
|
2
|
-
*
|
|
2
|
+
* The action under the message: a link (`href`) or a button (`onClick`), never
|
|
3
|
+
* both. The `never` halves are what make passing both a type error (ui#387).
|
|
3
4
|
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
6
|
-
*
|
|
5
|
+
* - `{ label, href }` navigates: an `<a href>` drawn as the library Button, so
|
|
6
|
+
* middle-click and open-in-new-tab keep working.
|
|
7
|
+
* - `{ label, onClick, pending? }` runs the caller's handler: a `<button>`.
|
|
8
|
+
* `pending` disables it the focusable way (`aria-disabled`, focus stays on
|
|
9
|
+
* it), marks it `aria-busy` and shows the library Spinner while the caller's
|
|
10
|
+
* request is in flight.
|
|
7
11
|
*/
|
|
8
|
-
|
|
12
|
+
type LockedSectionAction = {
|
|
13
|
+
label: string;
|
|
14
|
+
href: string;
|
|
15
|
+
onClick?: never;
|
|
16
|
+
pending?: never;
|
|
17
|
+
} | {
|
|
18
|
+
label: string;
|
|
19
|
+
onClick: () => void;
|
|
20
|
+
pending?: boolean;
|
|
21
|
+
href?: never;
|
|
22
|
+
};
|
|
23
|
+
/**
|
|
24
|
+
* A greyed, read-only form section with a centred overlay message.
|
|
25
|
+
*
|
|
26
|
+
* Children render at reduced opacity, inert. The title stays above in normal
|
|
27
|
+
* flow; under it the children and the overlay share one grid cell, so the
|
|
28
|
+
* section is as tall as the taller of the two and the overlay never covers the
|
|
29
|
+
* title. The overlay's message, optional description and optional action sit
|
|
30
|
+
* on the card ground (padded, the library radius), so they read over faded
|
|
31
|
+
* children instead of overprinting them (ui#387; the Console's SSO tab showed
|
|
32
|
+
* the message across the faded title and button). Used in the Console for
|
|
33
|
+
* settings that are locked or available on request.
|
|
34
|
+
*/
|
|
35
|
+
declare function LockedSection({ title, message, description, action, children, className, ...props }: React.ComponentProps<"section"> & {
|
|
9
36
|
title?: string;
|
|
10
37
|
message: string;
|
|
11
|
-
action
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
};
|
|
38
|
+
/** A longer paragraph between the message and the action. */
|
|
39
|
+
description?: React.ReactNode;
|
|
40
|
+
action?: LockedSectionAction;
|
|
15
41
|
}): import("react").JSX.Element;
|
|
16
42
|
export { LockedSection };
|
|
43
|
+
export type { LockedSectionAction };
|
|
17
44
|
//# sourceMappingURL=locked-section.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"locked-section.d.ts","sourceRoot":"","sources":["../../src/blocks/locked-section.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"locked-section.d.ts","sourceRoot":"","sources":["../../src/blocks/locked-section.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;GAUG;AACH,KAAK,mBAAmB,GACpB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,KAAK,CAAC;IAAC,OAAO,CAAC,EAAE,KAAK,CAAA;CAAE,GACjE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,IAAI,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,IAAI,CAAC,EAAE,KAAK,CAAA;CAAE,CAAA;AAE3E;;;;;;;;;;;GAWG;AACH,iBAAS,aAAa,CAAC,EACrB,KAAK,EACL,OAAO,EACP,WAAW,EACX,MAAM,EACN,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,GAAG;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,EAAE,MAAM,CAAA;IACf,6DAA6D;IAC7D,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,MAAM,CAAC,EAAE,mBAAmB,CAAA;CAC7B,+BA2CA;AAoCD,OAAO,EAAE,aAAa,EAAE,CAAA;AACxB,YAAY,EAAE,mBAAmB,EAAE,CAAA"}
|
|
@@ -1,14 +1,39 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from "../lib/cloudgrid-cn.js";
|
|
3
|
+
import { Button } from "../ui/button.js";
|
|
4
|
+
import { Spinner } from "../ui/spinner.js";
|
|
3
5
|
/**
|
|
4
|
-
* A greyed, read-only form section with a
|
|
6
|
+
* A greyed, read-only form section with a centred overlay message.
|
|
5
7
|
*
|
|
6
|
-
* Children render at reduced opacity
|
|
7
|
-
*
|
|
8
|
-
* the
|
|
8
|
+
* Children render at reduced opacity, inert. The title stays above in normal
|
|
9
|
+
* flow; under it the children and the overlay share one grid cell, so the
|
|
10
|
+
* section is as tall as the taller of the two and the overlay never covers the
|
|
11
|
+
* title. The overlay's message, optional description and optional action sit
|
|
12
|
+
* on the card ground (padded, the library radius), so they read over faded
|
|
13
|
+
* children instead of overprinting them (ui#387; the Console's SSO tab showed
|
|
14
|
+
* the message across the faded title and button). Used in the Console for
|
|
15
|
+
* settings that are locked or available on request.
|
|
9
16
|
*/
|
|
10
|
-
function LockedSection({ title, message, action, children, className, ...props }) {
|
|
11
|
-
return (_jsxs("section", { "data-slot": "locked-section", className: cn("
|
|
17
|
+
function LockedSection({ title, message, description, action, children, className, ...props }) {
|
|
18
|
+
return (_jsxs("section", { "data-slot": "locked-section", className: cn("rounded-xl", className), ...props, children: [title ? (_jsx("div", { inert: true, className: "pointer-events-none select-none opacity-40", children: _jsx("h3", { className: "mb-3 font-heading text-body-md font-medium", children: title }) })) : null, _jsxs("div", { className: "grid", children: [_jsx("div", { inert: true, className: "pointer-events-none col-start-1 row-start-1 select-none opacity-40", children: children }), _jsx("div", { className: "relative z-10 col-start-1 row-start-1 flex items-center justify-center", children: _jsxs("div", { "data-slot": "locked-section-ground", className: "flex max-w-full flex-col items-center gap-3 bg-card rounded-xl px-6 py-5 text-center", children: [_jsx("p", { className: "text-body-sm font-medium text-muted-foreground", children: message }), description ? (_jsx("p", { "data-slot": "locked-section-description", className: "max-w-md text-body-sm font-regular text-body text-pretty", children: description })) : null, action ? _jsx(LockedSectionActionButton, { action: action }) : null] }) })] })] }));
|
|
19
|
+
}
|
|
20
|
+
function LockedSectionActionButton({ action }) {
|
|
21
|
+
if (action.href !== undefined) {
|
|
22
|
+
return (_jsx(Button
|
|
23
|
+
// eslint-disable-next-line jsx-a11y/anchor-has-content -- a Base UI render target: the button's children (the label) are rendered into this anchor
|
|
24
|
+
, {
|
|
25
|
+
// eslint-disable-next-line jsx-a11y/anchor-has-content -- a Base UI render target: the button's children (the label) are rendered into this anchor
|
|
26
|
+
render: _jsx("a", { href: action.href }), nativeButton: false,
|
|
27
|
+
// Base UI stamps role="button" on a non-native target; this one navigates.
|
|
28
|
+
role: "link", children: action.label }));
|
|
29
|
+
}
|
|
30
|
+
const pending = action.pending === true;
|
|
31
|
+
return (_jsxs(Button, { type: "button",
|
|
32
|
+
// Disabled the focusable way, as DisabledButton is: native `disabled`
|
|
33
|
+
// would drop keyboard focus to <body> the moment the request starts.
|
|
34
|
+
// Base UI keeps the button in the tab order with aria-disabled, swallows
|
|
35
|
+
// presses, and sets data-disabled for the dimmed look.
|
|
36
|
+
disabled: pending, focusableWhenDisabled: true, "aria-busy": pending || undefined, className: "data-disabled:cursor-not-allowed data-disabled:opacity-50", onClick: action.onClick, children: [pending ? _jsx(Spinner, { decorative: true, size: "sm" }) : null, action.label] }));
|
|
12
37
|
}
|
|
13
38
|
export { LockedSection };
|
|
14
39
|
//# sourceMappingURL=locked-section.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"locked-section.js","sourceRoot":"","sources":["../../src/blocks/locked-section.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;
|
|
1
|
+
{"version":3,"file":"locked-section.js","sourceRoot":"","sources":["../../src/blocks/locked-section.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAA;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAiB/C;;;;;;;;;;;GAWG;AACH,SAAS,aAAa,CAAC,EACrB,KAAK,EACL,OAAO,EACP,WAAW,EACX,MAAM,EACN,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EAOT;IACC,OAAO,CACL,gCACY,gBAAgB,EAC1B,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,KAClC,KAAK,aAGR,KAAK,CAAC,CAAC,CAAC,CACP,cAAK,KAAK,QAAC,SAAS,EAAC,4CAA4C,YAC/D,aAAI,SAAS,EAAC,4CAA4C,YAAE,KAAK,GAAM,GACnE,CACP,CAAC,CAAC,CAAC,IAAI,EAER,eAAK,SAAS,EAAC,MAAM,aAEnB,cAAK,KAAK,QAAC,SAAS,EAAC,oEAAoE,YACtF,QAAQ,GACL,EAKN,cAAK,SAAS,EAAC,wEAAwE,YACrF,4BACY,uBAAuB,EACjC,SAAS,EAAC,sFAAsF,aAEhG,YAAG,SAAS,EAAC,gDAAgD,YAAE,OAAO,GAAK,EAC1E,WAAW,CAAC,CAAC,CAAC,CACb,yBACY,4BAA4B,EACtC,SAAS,EAAC,0DAA0D,YAEnE,WAAW,GACV,CACL,CAAC,CAAC,CAAC,IAAI,EACP,MAAM,CAAC,CAAC,CAAC,KAAC,yBAAyB,IAAC,MAAM,EAAE,MAAM,GAAI,CAAC,CAAC,CAAC,IAAI,IAC1D,GACF,IACF,IACE,CACX,CAAA;AACH,CAAC;AAED,SAAS,yBAAyB,CAAC,EAAE,MAAM,EAAmC;IAC5E,IAAI,MAAM,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;QAC9B,OAAO,CACL,KAAC,MAAM;QACL,mJAAmJ;;YAAnJ,mJAAmJ;YACnJ,MAAM,EAAE,YAAG,IAAI,EAAE,MAAM,CAAC,IAAI,GAAI,EAChC,YAAY,EAAE,KAAK;YACnB,2EAA2E;YAC3E,IAAI,EAAC,MAAM,YAEV,MAAM,CAAC,KAAK,GACN,CACV,CAAA;IACH,CAAC;IACD,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,KAAK,IAAI,CAAA;IACvC,OAAO,CACL,MAAC,MAAM,IACL,IAAI,EAAC,QAAQ;QACb,sEAAsE;QACtE,qEAAqE;QACrE,yEAAyE;QACzE,uDAAuD;QACvD,QAAQ,EAAE,OAAO,EACjB,qBAAqB,qBACV,OAAO,IAAI,SAAS,EAC/B,SAAS,EAAC,2DAA2D,EACrE,OAAO,EAAE,MAAM,CAAC,OAAO,aAEtB,OAAO,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,UAAU,QAAC,IAAI,EAAC,IAAI,GAAG,CAAC,CAAC,CAAC,IAAI,EACjD,MAAM,CAAC,KAAK,IACN,CACV,CAAA;AACH,CAAC;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* The search field above every Admin list, as the CloudGrid 2026 Figma draws it
|
|
4
|
+
* (#384; 7404:5007, 7414:5979): the 2026 text field with a 20px MagnifyingGlass
|
|
5
|
+
* 19px in from the left and the text starting at 56px, 200 wide by default.
|
|
6
|
+
*
|
|
7
|
+
* ## The name is not the placeholder
|
|
8
|
+
*
|
|
9
|
+
* A placeholder disappears the moment someone types, and is not a reliable
|
|
10
|
+
* accessible name. So the field always carries one: `label` (default "Search")
|
|
11
|
+
* becomes its `aria-label`, and also its placeholder unless the caller passes a
|
|
12
|
+
* different one. A caller with a visible heading that names the list passes
|
|
13
|
+
* `aria-labelledby` instead, and the `aria-label` is dropped so the two cannot
|
|
14
|
+
* disagree.
|
|
15
|
+
*
|
|
16
|
+
* `className` sizes the field (it lands on the wrapper, so `w-full` or `w-72`
|
|
17
|
+
* works); every other prop goes to the `<input>`.
|
|
18
|
+
*/
|
|
19
|
+
declare function SearchField({ label, className, placeholder, ...props }: Omit<React.ComponentProps<"input">, "type"> & {
|
|
20
|
+
/** The field's accessible name, and its placeholder unless one is given. */
|
|
21
|
+
label?: string;
|
|
22
|
+
}): React.JSX.Element;
|
|
23
|
+
export { SearchField };
|
|
24
|
+
//# sourceMappingURL=search-field.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search-field.d.ts","sourceRoot":"","sources":["../../src/blocks/search-field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B;;;;;;;;;;;;;;;;GAgBG;AACH,iBAAS,WAAW,CAAC,EACnB,KAAgB,EAChB,SAAS,EACT,WAAW,EACX,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC,GAAG;IAC/C,4EAA4E;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,qBAaA;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { cn } from "../lib/cloudgrid-cn.js";
|
|
4
|
+
import { SearchIcon } from "./icons.js";
|
|
5
|
+
import { Input } from "../ui/input.js";
|
|
6
|
+
/**
|
|
7
|
+
* The search field above every Admin list, as the CloudGrid 2026 Figma draws it
|
|
8
|
+
* (#384; 7404:5007, 7414:5979): the 2026 text field with a 20px MagnifyingGlass
|
|
9
|
+
* 19px in from the left and the text starting at 56px, 200 wide by default.
|
|
10
|
+
*
|
|
11
|
+
* ## The name is not the placeholder
|
|
12
|
+
*
|
|
13
|
+
* A placeholder disappears the moment someone types, and is not a reliable
|
|
14
|
+
* accessible name. So the field always carries one: `label` (default "Search")
|
|
15
|
+
* becomes its `aria-label`, and also its placeholder unless the caller passes a
|
|
16
|
+
* different one. A caller with a visible heading that names the list passes
|
|
17
|
+
* `aria-labelledby` instead, and the `aria-label` is dropped so the two cannot
|
|
18
|
+
* disagree.
|
|
19
|
+
*
|
|
20
|
+
* `className` sizes the field (it lands on the wrapper, so `w-full` or `w-72`
|
|
21
|
+
* works); every other prop goes to the `<input>`.
|
|
22
|
+
*/
|
|
23
|
+
function SearchField({ label = "Search", className, placeholder, ...props }) {
|
|
24
|
+
const labelledBy = props["aria-labelledby"];
|
|
25
|
+
return (_jsx("div", { "data-slot": "search-field", className: cn("w-50 shrink-0", className), children: _jsx(Input, { type: "search", "aria-label": labelledBy ? undefined : label, placeholder: placeholder ?? label, leading: _jsx(SearchIcon, {}), ...props }) }));
|
|
26
|
+
}
|
|
27
|
+
export { SearchField };
|
|
28
|
+
//# sourceMappingURL=search-field.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search-field.js","sourceRoot":"","sources":["../../src/blocks/search-field.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAChD,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAA;AAE3C;;;;;;;;;;;;;;;;GAgBG;AACH,SAAS,WAAW,CAAC,EACnB,KAAK,GAAG,QAAQ,EAChB,SAAS,EACT,WAAW,EACX,GAAG,KAAK,EAIT;IACC,MAAM,UAAU,GAAG,KAAK,CAAC,iBAAiB,CAAC,CAAA;IAC3C,OAAO,CACL,2BAAe,cAAc,EAAC,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,YACrE,KAAC,KAAK,IACJ,IAAI,EAAC,QAAQ,gBACD,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,EAC1C,WAAW,EAAE,WAAW,IAAI,KAAK,EACjC,OAAO,EAAE,KAAC,UAAU,KAAG,KACnB,KAAK,GACT,GACE,CACP,CAAA;AACH,CAAC;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}
|
package/dist/blocks/shelf.d.ts
CHANGED
|
@@ -2,8 +2,9 @@ import * as React from "react";
|
|
|
2
2
|
import { DrawerContent } from "../ui/drawer.js";
|
|
3
3
|
import { type EntityKind } from "./entity-card.js";
|
|
4
4
|
/**
|
|
5
|
-
* The Shelf (Shelf spec 2026-10-07, Part B): where things that expired
|
|
6
|
-
* never
|
|
5
|
+
* The Shelf (Shelf spec 2026-10-07, Part B): where things that expired, were
|
|
6
|
+
* never plugged or had no activity go on their own, and where they are moved
|
|
7
|
+
* back from.
|
|
7
8
|
*
|
|
8
9
|
* Figma `5ouhISIL0mwYGHurvCGoEO`, section "Shelf v2 - 2026-10-07" (9834:7965),
|
|
9
10
|
* frames 01 to 09b. The frames are the LAYOUT. The sizes are the Console's: the
|
|
@@ -57,18 +58,32 @@ import { type EntityKind } from "./entity-card.js";
|
|
|
57
58
|
* phone breakpoint.
|
|
58
59
|
*/
|
|
59
60
|
/**
|
|
60
|
-
* Why something is on the shelf. The
|
|
61
|
-
*
|
|
62
|
-
*
|
|
61
|
+
* Why something is on the shelf. The server says, per item; the block takes it
|
|
62
|
+
* as given and never derives it from the kind, so nothing here pairs a reason
|
|
63
|
+
* with a kind. Which kinds a reason can reach is the API's rule, not the
|
|
64
|
+
* block's: No activity is apps and agents only (cloudgrid#5827 excludes pages
|
|
65
|
+
* and drafts). The keys are the API's (`never_published` stays the wire name;
|
|
66
|
+
* its word is "Never plugged").
|
|
63
67
|
*/
|
|
64
|
-
export declare const SHELF_REASON_ORDER: readonly ["expired", "never_published"];
|
|
68
|
+
export declare const SHELF_REASON_ORDER: readonly ["expired", "never_published", "no_activity"];
|
|
65
69
|
export type ShelfReason = (typeof SHELF_REASON_ORDER)[number];
|
|
66
70
|
/** The pill's word. */
|
|
67
71
|
export declare const SHELF_REASON_LABEL: Record<ShelfReason, string>;
|
|
68
|
-
/**
|
|
72
|
+
/**
|
|
73
|
+
* The line beside the pill. Library copy, the cloudgrid-console#958 wording
|
|
74
|
+
* (ui#387); it must say what the API counts for each reason.
|
|
75
|
+
*/
|
|
69
76
|
export declare const SHELF_REASON_DETAIL: Record<ShelfReason, string>;
|
|
77
|
+
/**
|
|
78
|
+
* The line the block shows beside the reason's word: in the table row, on a
|
|
79
|
+
* card and in the details drawer. The detail without repeating the word, so
|
|
80
|
+
* "Never plugged" is followed by "Or the plug failed..." rather than read
|
|
81
|
+
* twice (audit on #393). `SHELF_REASON_DETAIL` stays the full sentence for a
|
|
82
|
+
* caller that shows the detail on its own.
|
|
83
|
+
*/
|
|
84
|
+
export declare const SHELF_REASON_NOTE: Record<ShelfReason, string>;
|
|
70
85
|
/** The reason tabs. `all` first, then the reasons in their own order. */
|
|
71
|
-
export declare const SHELF_TAB_ORDER: readonly ["all", "expired", "never_published"];
|
|
86
|
+
export declare const SHELF_TAB_ORDER: readonly ["all", "expired", "never_published", "no_activity"];
|
|
72
87
|
export type ShelfTab = (typeof SHELF_TAB_ORDER)[number];
|
|
73
88
|
export declare const SHELF_TAB_LABEL: Record<ShelfTab, string>;
|
|
74
89
|
/** The sort menu, in the order frame 08 lists it. The first is the default. */
|
|
@@ -79,7 +94,7 @@ export declare const SHELF_VIEW_ORDER: readonly ["list", "compact"];
|
|
|
79
94
|
export type ShelfView = (typeof SHELF_VIEW_ORDER)[number];
|
|
80
95
|
export declare const SHELF_VIEW_LABEL: Record<ShelfView, string>;
|
|
81
96
|
export declare const SHELF_EMPTY_TITLE = "Your shelf is empty";
|
|
82
|
-
export declare const SHELF_EMPTY_DESCRIPTION = "Things that expire
|
|
97
|
+
export declare const SHELF_EMPTY_DESCRIPTION = "Things that expire, are never plugged or have no activity will show up here on their own.";
|
|
83
98
|
export declare const SHELF_NO_MATCHES = "Nothing on your shelf matches that.";
|
|
84
99
|
export declare const SHELF_SEARCH_PLACEHOLDER = "Search your shelf";
|
|
85
100
|
export declare const SHELF_AVAILABILITY_NOTE = "Move it to your grid to bring it back.";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shelf.d.ts","sourceRoot":"","sources":["../../src/blocks/shelf.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,OAAO,EAGL,aAAa,EAEd,MAAM,sBAAsB,CAAA;AAS7B,OAAO,EAIL,KAAK,UAAU,EAChB,MAAM,2BAA2B,CAAA;AAclC
|
|
1
|
+
{"version":3,"file":"shelf.d.ts","sourceRoot":"","sources":["../../src/blocks/shelf.tsx"],"names":[],"mappings":"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"}
|
package/dist/blocks/shelf.js
CHANGED
|
@@ -15,8 +15,9 @@ import { InputGroup, InputGroupAddon, InputGroupInput } from "../ui/input-group.
|
|
|
15
15
|
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "../ui/table.js";
|
|
16
16
|
import { Tabs, TabsList, TabsTrigger } from "../ui/tabs.js";
|
|
17
17
|
/**
|
|
18
|
-
* The Shelf (Shelf spec 2026-10-07, Part B): where things that expired
|
|
19
|
-
* never
|
|
18
|
+
* The Shelf (Shelf spec 2026-10-07, Part B): where things that expired, were
|
|
19
|
+
* never plugged or had no activity go on their own, and where they are moved
|
|
20
|
+
* back from.
|
|
20
21
|
*
|
|
21
22
|
* Figma `5ouhISIL0mwYGHurvCGoEO`, section "Shelf v2 - 2026-10-07" (9834:7965),
|
|
22
23
|
* frames 01 to 09b. The frames are the LAYOUT. The sizes are the Console's: the
|
|
@@ -73,20 +74,39 @@ import { Tabs, TabsList, TabsTrigger } from "../ui/tabs.js";
|
|
|
73
74
|
/* Model and copy */
|
|
74
75
|
/* ------------------------------------------------------------------ */
|
|
75
76
|
/**
|
|
76
|
-
* Why something is on the shelf. The
|
|
77
|
-
*
|
|
78
|
-
*
|
|
77
|
+
* Why something is on the shelf. The server says, per item; the block takes it
|
|
78
|
+
* as given and never derives it from the kind, so nothing here pairs a reason
|
|
79
|
+
* with a kind. Which kinds a reason can reach is the API's rule, not the
|
|
80
|
+
* block's: No activity is apps and agents only (cloudgrid#5827 excludes pages
|
|
81
|
+
* and drafts). The keys are the API's (`never_published` stays the wire name;
|
|
82
|
+
* its word is "Never plugged").
|
|
79
83
|
*/
|
|
80
|
-
export const SHELF_REASON_ORDER = ["expired", "never_published"];
|
|
84
|
+
export const SHELF_REASON_ORDER = ["expired", "never_published", "no_activity"];
|
|
81
85
|
/** The pill's word. */
|
|
82
86
|
export const SHELF_REASON_LABEL = {
|
|
83
87
|
expired: "Expired",
|
|
84
88
|
never_published: "Never plugged",
|
|
89
|
+
no_activity: "No activity",
|
|
85
90
|
};
|
|
86
|
-
/**
|
|
91
|
+
/**
|
|
92
|
+
* The line beside the pill. Library copy, the cloudgrid-console#958 wording
|
|
93
|
+
* (ui#387); it must say what the API counts for each reason.
|
|
94
|
+
*/
|
|
87
95
|
export const SHELF_REASON_DETAIL = {
|
|
88
|
-
expired: "
|
|
89
|
-
never_published: "
|
|
96
|
+
expired: "Past its expiry date",
|
|
97
|
+
never_published: "Never plugged, or the plug failed and was not retried. Includes creations only ever run with grid dev",
|
|
98
|
+
no_activity: "No views, plugs or pickups for 30 days",
|
|
99
|
+
};
|
|
100
|
+
/**
|
|
101
|
+
* The line the block shows beside the reason's word: in the table row, on a
|
|
102
|
+
* card and in the details drawer. The detail without repeating the word, so
|
|
103
|
+
* "Never plugged" is followed by "Or the plug failed..." rather than read
|
|
104
|
+
* twice (audit on #393). `SHELF_REASON_DETAIL` stays the full sentence for a
|
|
105
|
+
* caller that shows the detail on its own.
|
|
106
|
+
*/
|
|
107
|
+
export const SHELF_REASON_NOTE = {
|
|
108
|
+
...SHELF_REASON_DETAIL,
|
|
109
|
+
never_published: "Or the plug failed and was not retried. Includes creations only ever run with grid dev",
|
|
90
110
|
};
|
|
91
111
|
/** The reason tabs. `all` first, then the reasons in their own order. */
|
|
92
112
|
export const SHELF_TAB_ORDER = ["all", ...SHELF_REASON_ORDER];
|
|
@@ -107,7 +127,7 @@ export const SHELF_VIEW_LABEL = {
|
|
|
107
127
|
compact: "Compact",
|
|
108
128
|
};
|
|
109
129
|
export const SHELF_EMPTY_TITLE = "Your shelf is empty";
|
|
110
|
-
export const SHELF_EMPTY_DESCRIPTION = "Things that expire
|
|
130
|
+
export const SHELF_EMPTY_DESCRIPTION = "Things that expire, are never plugged or have no activity will show up here on their own.";
|
|
111
131
|
export const SHELF_NO_MATCHES = "Nothing on your shelf matches that.";
|
|
112
132
|
export const SHELF_SEARCH_PLACEHOLDER = "Search your shelf";
|
|
113
133
|
export const SHELF_AVAILABILITY_NOTE = "Move it to your grid to bring it back.";
|
|
@@ -165,7 +185,7 @@ function ShelfThumbnail({ item, size = "row", className, }) {
|
|
|
165
185
|
}
|
|
166
186
|
/** The grey pill and its detail line. */
|
|
167
187
|
function ShelfReasonTag({ reason, className }) {
|
|
168
|
-
return (_jsxs("span", { "data-slot": "shelf-reason", "data-reason": reason, className: cn("flex min-w-0 items-center gap-2", className), children: [_jsx(Badge, { variant: "secondary", children: SHELF_REASON_LABEL[reason] }), _jsx("span", { className: "
|
|
188
|
+
return (_jsxs("span", { "data-slot": "shelf-reason", "data-reason": reason, className: cn("flex min-w-0 items-center gap-2", className), children: [_jsx(Badge, { variant: "secondary", children: SHELF_REASON_LABEL[reason] }), _jsx("span", { "data-slot": "shelf-reason-note", className: "min-w-0 whitespace-normal text-caption text-faint", children: SHELF_REASON_NOTE[reason] })] }));
|
|
169
189
|
}
|
|
170
190
|
/** The row's "..." menu. Delete is its only item (frame 06). */
|
|
171
191
|
function ShelfRowMenu({ item, onRequestDelete, }) {
|
|
@@ -178,6 +198,23 @@ function MoveButton({ item, moving, onMoveToGrid, className, }) {
|
|
|
178
198
|
function fromControl(event) {
|
|
179
199
|
return Boolean(event.target.closest("button, a, input, [role=menuitem]"));
|
|
180
200
|
}
|
|
201
|
+
/**
|
|
202
|
+
* The Shelf's own table look, kept when `Table` took the 2026 Figma list
|
|
203
|
+
* (#383: zebra rounded rows, an N3 13px header). The Shelf is drawn to its own
|
|
204
|
+
* frame, a bordered card of hairline-ruled rows under a 40px 15px header, so
|
|
205
|
+
* it states that look here instead of inheriting it:
|
|
206
|
+
*
|
|
207
|
+
* - the table collapses its borders, so a row's rule paints;
|
|
208
|
+
* - the cells drop the list's grounds and corners, and the row paints the
|
|
209
|
+
* hover and selected grounds instead, as it did before;
|
|
210
|
+
* - the end cells keep their 16px insets (`first:`/`last:` so they replace
|
|
211
|
+
* the list's 12, rather than lose to them on specificity).
|
|
212
|
+
*/
|
|
213
|
+
const SHELF_TABLE = "border-collapse border-spacing-0";
|
|
214
|
+
const SHELF_HEAD_ROW = "border-b";
|
|
215
|
+
const SHELF_HEAD = "h-10 py-0 text-body-sm font-medium text-foreground first:pl-4 last:pr-4";
|
|
216
|
+
const SHELF_ROW = "border-b transition-colors last:border-0 hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted";
|
|
217
|
+
const SHELF_CELL = "p-2 first:rounded-none first:pl-4 last:rounded-none last:pr-4 group-odd/row:bg-transparent group-hover/row:bg-transparent group-has-aria-expanded/row:bg-transparent group-data-[state=selected]/row:bg-transparent";
|
|
181
218
|
/**
|
|
182
219
|
* The List view (frame 01): Creation, Why it's here, Moved here, actions.
|
|
183
220
|
*
|
|
@@ -187,13 +224,13 @@ function fromControl(event) {
|
|
|
187
224
|
* same for a mouse, and ignores clicks that land on the row's own buttons.
|
|
188
225
|
*/
|
|
189
226
|
function ShelfTable({ items, onOpenDetails, onMoveToGrid, onRequestDelete, selectedId, movingIds, caption = "Your shelf", className, }) {
|
|
190
|
-
return (_jsx("div", { "data-slot": "shelf-table", className: cn("overflow-hidden rounded-xl border border-hairline bg-card", className), children: _jsxs(Table, { className: "table-fixed", children: [_jsx("caption", { className: "sr-only", children: caption }), _jsx(TableHeader, { children: _jsxs(TableRow, { className: "hover:bg-transparent", children: [_jsx(TableHead, { className: "w-auto
|
|
227
|
+
return (_jsx("div", { "data-slot": "shelf-table", className: cn("overflow-hidden rounded-xl border border-hairline bg-card", className), children: _jsxs(Table, { className: cn("table-fixed", SHELF_TABLE), children: [_jsx("caption", { className: "sr-only", children: caption }), _jsx(TableHeader, { children: _jsxs(TableRow, { className: cn(SHELF_HEAD_ROW, "hover:bg-transparent"), children: [_jsx(TableHead, { className: cn(SHELF_HEAD, "w-auto"), children: "Creation" }), _jsx(TableHead, { className: cn(SHELF_HEAD, "w-[34%]"), children: "Why it's here" }), _jsx(TableHead, { className: cn(SHELF_HEAD, "w-[13%]"), children: "Moved here" }), _jsx(TableHead, { className: cn(SHELF_HEAD, "w-[168px]"), children: _jsx("span", { className: "sr-only", children: "Actions" }) })] }) }), _jsx(TableBody, { children: items.map((item) => {
|
|
191
228
|
const selected = selectedId === item.id;
|
|
192
229
|
return (_jsxs(TableRow, { "data-slot": "shelf-row", "data-id": item.id, "data-state": selected ? "selected" : undefined, onClick: (event) => {
|
|
193
230
|
if (!onOpenDetails || fromControl(event))
|
|
194
231
|
return;
|
|
195
232
|
onOpenDetails(item);
|
|
196
|
-
}, className: cn(onOpenDetails && "cursor-pointer"), children: [_jsx(TableCell, { className:
|
|
233
|
+
}, className: cn(SHELF_ROW, onOpenDetails && "cursor-pointer"), children: [_jsx(TableCell, { className: SHELF_CELL, children: _jsxs("span", { className: "flex min-w-0 items-center gap-3", children: [_jsx(ShelfThumbnail, { item: item }), _jsxs("span", { className: "flex min-w-0 flex-col", children: [onOpenDetails ? (_jsx("button", { type: "button", "aria-haspopup": "dialog", onClick: () => onOpenDetails(item), className: "w-fit max-w-full cursor-pointer truncate rounded-xs text-left text-body-sm font-medium text-ink outline-none hover:underline focus-visible:ring-3 focus-visible:ring-ring", children: item.name })) : (_jsx("span", { className: "truncate text-body-sm font-medium text-ink", children: item.name })), _jsx("span", { className: "truncate text-caption text-faint", children: kindWord(item) })] })] }) }), _jsx(TableCell, { className: SHELF_CELL, children: _jsx(ShelfReasonTag, { reason: item.reason }) }), _jsx(TableCell, { className: cn(SHELF_CELL, "tabular-nums text-ink"), children: _jsx("time", { dateTime: new Date(item.movedAt).toISOString(), children: formatShelfDate(item.movedAt) }) }), _jsx(TableCell, { className: SHELF_CELL, children: _jsxs("span", { className: "flex items-center justify-end gap-1", children: [_jsx(MoveButton, { item: item, moving: movingIds?.has(item.id), onMoveToGrid: onMoveToGrid }), onRequestDelete ? _jsx(ShelfRowMenu, { item: item, onRequestDelete: onRequestDelete }) : null] }) })] }, item.id));
|
|
197
234
|
}) })] }) }));
|
|
198
235
|
}
|
|
199
236
|
/* ------------------------------------------------------------------ */
|
|
@@ -209,7 +246,7 @@ function ShelfTable({ items, onOpenDetails, onMoveToGrid, onRequestDelete, selec
|
|
|
209
246
|
* detail line and all left out.
|
|
210
247
|
*/
|
|
211
248
|
function ShelfCard({ item, onOpenDetails, onMoveToGrid, onRequestDelete, selected, moving, }) {
|
|
212
|
-
const identity = (_jsxs(_Fragment, { children: [_jsx(ShelfThumbnail, { item: item, size: "card", className: "@max-md/shelf-card:h-10 @max-md/shelf-card:w-16 @max-md/shelf-card:rounded-2xs" }), _jsxs("span", { className: "flex min-w-0 flex-col gap-0.5", children: [_jsx("span", { className: "line-clamp-2 text-body-sm font-medium text-ink", children: item.name }), _jsxs("span", { className: "truncate text-caption text-body", children: [SHELF_REASON_LABEL[item.reason], " \u00B7 ", formatShelfDate(item.movedAt)] }), _jsx("span", { className: "
|
|
249
|
+
const identity = (_jsxs(_Fragment, { children: [_jsx(ShelfThumbnail, { item: item, size: "card", className: "@max-md/shelf-card:h-10 @max-md/shelf-card:w-16 @max-md/shelf-card:rounded-2xs" }), _jsxs("span", { className: "flex min-w-0 flex-col gap-0.5", children: [_jsx("span", { className: "line-clamp-2 text-body-sm font-medium text-ink", children: item.name }), _jsxs("span", { className: "truncate text-caption text-body", children: [SHELF_REASON_LABEL[item.reason], " \u00B7 ", formatShelfDate(item.movedAt)] }), _jsx("span", { className: "text-caption text-faint @max-md/shelf-card:hidden", children: SHELF_REASON_NOTE[item.reason] })] })] }));
|
|
213
250
|
return (_jsx("li", { "data-slot": "shelf-card", "data-id": item.id, "data-state": selected ? "selected" : undefined, className: "@container/shelf-card list-none", children: _jsxs("div", { className: cn("flex items-center gap-3 rounded-xl border border-hairline bg-card p-4 transition-colors", "@max-md/shelf-card:flex-wrap @max-md/shelf-card:gap-y-3", selected && "border-line bg-muted/50"), children: [onOpenDetails ? (_jsx("button", { type: "button", "aria-haspopup": "dialog", "aria-label": `${item.name}, ${kindWord(item)}. Open details`, onClick: () => onOpenDetails(item), className: "flex min-w-0 flex-1 cursor-pointer items-center gap-4 rounded-md text-left outline-none focus-visible:ring-3 focus-visible:ring-ring @max-md/shelf-card:gap-3", children: identity })) : (_jsx("span", { className: "flex min-w-0 flex-1 items-center gap-4 @max-md/shelf-card:gap-3", children: identity })), _jsx(MoveButton, { item: item, moving: moving, onMoveToGrid: onMoveToGrid, className: "@max-md/shelf-card:order-last @max-md/shelf-card:h-8 @max-md/shelf-card:w-full" }), onRequestDelete ? _jsx(ShelfRowMenu, { item: item, onRequestDelete: onRequestDelete }) : null] }) }));
|
|
214
251
|
}
|
|
215
252
|
/**
|
|
@@ -332,7 +369,7 @@ function ShelfItemDetails({ item, open, onOpenChange, side = "right", onMoveToGr
|
|
|
332
369
|
setShown(item);
|
|
333
370
|
}, [item]);
|
|
334
371
|
const current = item ?? shown;
|
|
335
|
-
return (_jsx(Drawer, { open: open && current !== null, onOpenChange: onOpenChange, children: _jsxs(DrawerContent, { side: side, size: "md", container: container, "data-slot": "shelf-details", children: [_jsx(DrawerHeader, { title: "Item details", closeLabel: "Close item details", className: "pt-6 pb-5" }), current ? (_jsxs(DrawerBody, { className: "flex flex-col gap-5 pb-6", children: [side === "bottom" ? (_jsxs("div", { className: "flex items-center gap-4", children: [_jsx(ShelfThumbnail, { item: current, size: "sheet" }), _jsx(NameAndKind, { item: current })] })) : (_jsxs(_Fragment, { children: [_jsx(ShelfThumbnail, { item: current, size: "preview" }), _jsx(NameAndKind, { item: current })] })), _jsxs("dl", { className: "m-0 grid gap-4", children: [_jsxs("div", { className: "grid gap-1", children: [_jsx("dt", { className: "text-caption text-faint", children: "On your shelf" }), _jsxs("dd", { className: "m-0 grid text-body-sm text-ink", children: [_jsx("span", { children: SHELF_REASON_LABEL[current.reason] }), _jsx("span", { children:
|
|
372
|
+
return (_jsx(Drawer, { open: open && current !== null, onOpenChange: onOpenChange, children: _jsxs(DrawerContent, { side: side, size: "md", container: container, "data-slot": "shelf-details", children: [_jsx(DrawerHeader, { title: "Item details", closeLabel: "Close item details", className: "pt-6 pb-5" }), current ? (_jsxs(DrawerBody, { className: "flex flex-col gap-5 pb-6", children: [side === "bottom" ? (_jsxs("div", { className: "flex items-center gap-4", children: [_jsx(ShelfThumbnail, { item: current, size: "sheet" }), _jsx(NameAndKind, { item: current })] })) : (_jsxs(_Fragment, { children: [_jsx(ShelfThumbnail, { item: current, size: "preview" }), _jsx(NameAndKind, { item: current })] })), _jsxs("dl", { className: "m-0 grid gap-4", children: [_jsxs("div", { className: "grid gap-1", children: [_jsx("dt", { className: "text-caption text-faint", children: "On your shelf" }), _jsxs("dd", { className: "m-0 grid text-body-sm text-ink", children: [_jsx("span", { children: SHELF_REASON_LABEL[current.reason] }), _jsx("span", { children: SHELF_REASON_NOTE[current.reason] })] })] }), _jsxs("div", { className: "grid gap-1", children: [_jsx("dt", { className: "text-caption text-faint", children: "Moved here" }), _jsx("dd", { className: "m-0 text-body-sm text-ink", children: _jsx("time", { dateTime: new Date(current.movedAt).toISOString(), children: formatShelfDate(current.movedAt, "long") }) })] }), _jsxs("div", { className: "flex items-center justify-between gap-4", children: [_jsx("dt", { className: "text-caption text-faint", children: "Availability" }), _jsx("dd", { className: "m-0", children: _jsx(EntityStatus, { status: "stopped", label: "Not live" }) })] })] }), _jsx("p", { className: "m-0 text-caption text-body", children: SHELF_AVAILABILITY_NOTE }), _jsxs("div", { className: "grid gap-2", children: [_jsx(Button, { variant: "cta", "data-slot": "shelf-details-move", disabled: moving, onClick: () => onMoveToGrid?.(current), className: "w-full", children: moving ? "Moving" : SHELF_MOVE_LABEL }), onRequestDelete ? (_jsx(Button, { variant: "ghost", "data-slot": "shelf-details-delete", onClick: () => onRequestDelete(current), className: "w-full text-danger-strong hover:bg-danger-fill hover:text-danger-strong", children: "Delete" })) : null] })] })) : null] }) }));
|
|
336
373
|
}
|
|
337
374
|
function NameAndKind({ item }) {
|
|
338
375
|
return (_jsxs("div", { className: "flex min-w-0 flex-col gap-0.5", children: [_jsx("span", { className: "text-body-md font-medium break-words text-ink", children: item.name }), _jsx("span", { className: "text-caption text-faint", children: kindWord(item) })] }));
|