yadunut/clan-core
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

form component: unify values and improve cohesiveness of overall design within dyn-form component

Browse Source
This commit is contained in:
Timo
2025-04-30 09:04:43 +02:00
committed by Johannes Kirschbauer
parent 6680044176
commit 26303eadaa
1 changed files with 18 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
pkgs/webview-ui/app/src/Form/form/index.tsx
View File

@@ -368,10 +368,10 @@ export function ListValueDisplay<T extends FieldValues, R extends ResponseData>(
const bottomMost = () => props.idx === 0; const bottomMost = () => props.idx === 0;
return ( return (
<div class="w-full border-l-4 border-gray-300"> <div class="w-full px-2 pb-4 border-b border-secondary-200">
<div class="flex w-full items-end gap-2 px-4"> <div class="flex w-full items-center gap-2">
{props.children} {props.children}
<div class="ml-4 min-w-fit pb-4"> <div class="ml-4 min-w-fit">
<Button <Button
variant="ghost" variant="ghost"
size="s" size="s"
@@ -541,7 +541,6 @@ export function ArrayFields<T extends FieldValues, R extends ResponseData>(
)} )}
</Field> </Field>
</Match> </Match>
<Match <Match
when={ when={
itemsSchema().type === "string" || itemsSchema().type === "string" ||
@@ -629,9 +628,11 @@ export function ArrayFields<T extends FieldValues, R extends ResponseData>(
</ListValueDisplay> </ListValueDisplay>
)} )}
</For> </For>
<span class=" font-bold text-error-700"> <Show when={fieldArray.error}>
{fieldArray.error} <span class="label-text-alt font-bold text-error-700">
</span> {fieldArray.error}
</span>
</Show>
{/* Add new item */} {/* Add new item */}
<DynForm <DynForm
@@ -651,14 +652,16 @@ export function ArrayFields<T extends FieldValues, R extends ResponseData>(
// Button for adding new items // Button for adding new items
components={{ components={{
before: ( before: (
<Button <div class="w-full flex justify-end pb-2">
variant="ghost" <Button
type="submit" variant="ghost"
endIcon={<Icon icon={"Plus"} />} type="submit"
class="capitalize" endIcon={<Icon size={14} icon={"Plus"} />}
> class="capitalize"
Add {itemsSchema().title} >
</Button> Add {itemsSchema().title}
</Button>
</div>
), ),
}} }}
// Add the new item to the FieldArray // Add the new item to the FieldArray