Preserve open/closed state of <details>.
rodzic
9d91a08761
commit
202259a533
|
@ -473,20 +473,33 @@ function CreaturePartEditor<T extends CreatureSymbol>({
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const RememberedDetails: React.FC<{ id: string }> = ({ id, children }) => {
|
||||||
|
const [isOpen, setIsOpen] = useRememberedState(id, false);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<details
|
||||||
|
onToggle={(e) => setIsOpen((e.currentTarget as HTMLDetailsElement).open)}
|
||||||
|
open={isOpen}
|
||||||
|
>
|
||||||
|
{children}
|
||||||
|
</details>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
const CreatureEditorWidget: React.FC<{
|
const CreatureEditorWidget: React.FC<{
|
||||||
creature: CreatureSymbol;
|
creature: CreatureSymbol;
|
||||||
onChange: (symbol: CreatureSymbol) => void;
|
onChange: (symbol: CreatureSymbol) => void;
|
||||||
}> = ({ creature, onChange }) => {
|
}> = ({ creature, onChange }) => {
|
||||||
return (
|
return (
|
||||||
<div className="thingy">
|
<div className="thingy">
|
||||||
<details>
|
<RememberedDetails id="creature_editor_widget">
|
||||||
<summary>Edit cluster…</summary>
|
<summary>Edit cluster…</summary>
|
||||||
<CreaturePartEditor
|
<CreaturePartEditor
|
||||||
creature={creature}
|
creature={creature}
|
||||||
onChange={onChange}
|
onChange={onChange}
|
||||||
idPrefix="creature_edit_"
|
idPrefix="creature_edit_"
|
||||||
/>
|
/>
|
||||||
</details>
|
</RememberedDetails>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
Ładowanie…
Reference in New Issue