Improve <details> component (#238)

Co-authored-by: Gregory Schier <gschier1990@gmail.com>
This commit is contained in:
Song
2025-07-19 05:28:24 +08:00
committed by GitHub
parent 4a2fb6ed48
commit 0d4b7bb5e2
6 changed files with 95 additions and 65 deletions

View File

@@ -20,6 +20,7 @@ import { showDialog } from '../lib/dialog';
import { resolvedModelName } from '../lib/resolvedModelName';
import { Banner } from './core/Banner';
import { Checkbox } from './core/Checkbox';
import { DetailsBanner } from './core/DetailsBanner';
import { Editor } from './core/Editor/Editor';
import { IconButton } from './core/IconButton';
import { Input } from './core/Input';
@@ -174,22 +175,23 @@ function FormInputs<T extends Record<string, JsonPrimitive>>({
);
case 'accordion':
return (
<Banner key={i} className={classNames('!p-0', disabled && 'opacity-disabled')}>
<details>
<summary className="px-3 py-1.5 text-text-subtle">{input.label}</summary>
<div className="mb-3 px-3">
<FormInputs
data={data}
disabled={disabled}
inputs={input.inputs}
setDataAttr={setDataAttr}
stateKey={stateKey}
autocompleteFunctions={autocompleteFunctions || false}
autocompleteVariables={autocompleteVariables}
/>
</div>
</details>
</Banner>
<DetailsBanner
key={i}
summary={input.label}
className={classNames(disabled && 'opacity-disabled')}
>
<div className="mb-3 px-3">
<FormInputs
data={data}
disabled={disabled}
inputs={input.inputs}
setDataAttr={setDataAttr}
stateKey={stateKey}
autocompleteFunctions={autocompleteFunctions || false}
autocompleteVariables={autocompleteVariables}
/>
</div>
</DetailsBanner>
);
case 'banner':
return (