David
ece38c741e
- Added ResourceTemplateIcon component to display icons for resource templates in CatalogDefinitionDialog and CatalogName. - Updated CatalogDefinitionDialog to conditionally render template icons in the title. - Enhanced ResourcesPage to include ResourceSelectionPanel for detailed resource views and actions. - Implemented compact view options in ResourceDetail for a cleaner interface. - Introduced new resource template icons and updated related tests to ensure proper functionality. - Added PersonPhotoField component for managing user photos with preview functionality. - Improved characteristics summary display in resources list.
45 lines
1.2 KiB
TypeScript
45 lines
1.2 KiB
TypeScript
import { Button } from "@repo/shadcn-ui/components/button";
|
|
import type { ReactNode } from "react";
|
|
|
|
import { XIcon } from "../lib/icons";
|
|
|
|
/** Estructura común de las fichas laterales; el consumidor aporta datos, textos y acciones. */
|
|
export function SelectionPanel({
|
|
label,
|
|
title,
|
|
closeLabel,
|
|
onClose,
|
|
summary,
|
|
actions,
|
|
children,
|
|
}: {
|
|
label: string;
|
|
title: ReactNode;
|
|
closeLabel: string;
|
|
onClose: () => void;
|
|
summary?: ReactNode;
|
|
actions: ReactNode;
|
|
children: ReactNode;
|
|
}) {
|
|
return (
|
|
<aside
|
|
aria-label={label}
|
|
className="@container hidden min-w-0 grid-cols-[minmax(0,1fr)] gap-4 rounded-panel border border-border bg-card p-4 [overflow-wrap:anywhere] inventory:grid"
|
|
>
|
|
<header className="space-y-2">
|
|
<div className="flex items-start justify-between gap-3">
|
|
<h2 className="flex min-w-0 items-center gap-2 break-words text-lg font-semibold">
|
|
{title}
|
|
</h2>
|
|
<Button aria-label={closeLabel} onClick={onClose} size="icon-sm" variant="ghost">
|
|
<XIcon aria-hidden="true" className="size-4" />
|
|
</Button>
|
|
</div>
|
|
{summary}
|
|
</header>
|
|
<div className="flex flex-wrap gap-2">{actions}</div>
|
|
{children}
|
|
</aside>
|
|
);
|
|
}
|