david
1506a78582
- Exported detail components in proformas index. - Enhanced proforma grid with view action. - Implemented navigation to proforma detail page. - Created proforma detail controller for data fetching and actions. - Developed proforma detail page with various inspector cards for displaying information. - Added reusable ProformaPageHeader component for consistent header layout. - Introduced FieldValueList component for displaying key-value pairs. - Implemented PDFViewer component for previewing proforma PDFs.
46 lines
1.0 KiB
TypeScript
46 lines
1.0 KiB
TypeScript
import { cn } from "@repo/shadcn-ui/lib/utils";
|
|
|
|
export interface FieldValueItem {
|
|
label: string;
|
|
value: string;
|
|
valueClassName?: string;
|
|
}
|
|
|
|
interface FieldValueListProps {
|
|
items: FieldValueItem[];
|
|
className?: string;
|
|
itemClassName?: string;
|
|
labelClassName?: string;
|
|
valueClassName?: string;
|
|
}
|
|
|
|
export const FieldValueList = ({
|
|
items,
|
|
className,
|
|
itemClassName,
|
|
labelClassName,
|
|
valueClassName,
|
|
}: FieldValueListProps) => {
|
|
return (
|
|
<dl className={cn("space-y-3", className)}>
|
|
{items.map((item) => (
|
|
<div
|
|
className={cn("flex items-start justify-between gap-4 text-sm", itemClassName)}
|
|
key={item.label}
|
|
>
|
|
<dt className={cn("text-muted-foreground", labelClassName)}>{item.label}</dt>
|
|
<dd
|
|
className={cn(
|
|
"text-right font-medium text-foreground text-balance",
|
|
valueClassName,
|
|
item.valueClassName
|
|
)}
|
|
>
|
|
{item.value}
|
|
</dd>
|
|
</div>
|
|
))}
|
|
</dl>
|
|
);
|
|
};
|