42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
import { TranslatedString } from "@gnu-taler/taler-util";
|
|
import { VNode, h } from "preact";
|
|
import { LabelWithTooltipMaybeRequired } from "./InputLine.js";
|
|
import { RenderAllFieldsByUiConfig, UIFormField } from "./forms.js";
|
|
|
|
interface Props {
|
|
before?: TranslatedString;
|
|
after?: TranslatedString;
|
|
tooltipBefore?: TranslatedString;
|
|
tooltipAfter?: TranslatedString;
|
|
fields: UIFormField[];
|
|
}
|
|
|
|
export function Group({
|
|
before,
|
|
after,
|
|
tooltipAfter,
|
|
tooltipBefore,
|
|
fields,
|
|
}: Props): VNode {
|
|
return (
|
|
<div class="sm:col-span-6 p-4 rounded-lg border-r-2 border-2 bg-gray-50">
|
|
<div class="pb-4">
|
|
{before && (
|
|
<LabelWithTooltipMaybeRequired
|
|
label={before}
|
|
tooltip={tooltipBefore}
|
|
/>
|
|
)}
|
|
</div>
|
|
<div class="grid max-w-2xl grid-cols-1 gap-x-6 gap-y-2 sm:grid-cols-6">
|
|
<RenderAllFieldsByUiConfig fields={fields} />
|
|
</div>
|
|
<div class="pt-4">
|
|
{after && (
|
|
<LabelWithTooltipMaybeRequired label={after} tooltip={tooltipAfter} />
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|