David
fa9d95fa9e
- Implemented `workstationEquipment` to manage workstation asset assignments, including principal and secondary assets. - Created tests for `workstationEquipment` to ensure correct behavior with various scenarios. - Developed `workstationOrganizationalAssignments` to retrieve current assignments for a responsible person in a company. - Added tests for `workstationOrganizationalAssignments` to validate assignment retrieval logic. - Introduced UI components for displaying workstation profile configurations and responsible person details. - Created compact UI components for displaying lists and tables, enhancing the user interface for asset management. - Added utility functions for handling cell content in tables, ensuring proper rendering of data.
28 lines
1021 B
TypeScript
28 lines
1021 B
TypeScript
import type { ReactNode } from "react";
|
|
|
|
/** Etiqueta y valor responden al ancho de su ficha, no al ancho total del navegador. */
|
|
export function DetailField({
|
|
label,
|
|
children,
|
|
density = "default",
|
|
}: {
|
|
label: ReactNode;
|
|
children: ReactNode;
|
|
density?: "default" | "compact";
|
|
}) {
|
|
return (
|
|
<div
|
|
className={
|
|
density === "compact"
|
|
? "grid min-w-0 grid-cols-[minmax(0,0.7fr)_minmax(0,1.3fr)] gap-3 py-1 first:pt-0 last:pb-0"
|
|
: "grid min-w-0 gap-1 border-b border-border/60 py-2.5 first:pt-0 last:border-0 last:pb-0 @min-[240px]:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)] @min-[240px]:gap-3"
|
|
}
|
|
>
|
|
<dt className="text-xs leading-5 text-muted-foreground">{label}</dt>
|
|
<dd className="min-w-0 whitespace-pre-wrap break-words text-sm font-medium leading-5 [&_a]:cursor-pointer [&_a]:text-primary [&_a]:underline-offset-4 [&_a:hover]:underline [&_a:focus-visible]:outline-2 [&_a:focus-visible]:outline-ring">
|
|
{children}
|
|
</dd>
|
|
</div>
|
|
);
|
|
}
|