emma/tabletop-commander
1
0
Fork 0
Code Issues 2 Pull Requests Packages Projects 3 Releases Wiki Activity

Adds capability of on-demand resolver to render more complex stack items

Browse Source
This commit is contained in:
Emmaline Autumn 2024-08-21 16:08:10 -06:00
parent 1799c8da79
commit b2e7223c16
1 changed files with 21 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
lib/tcmd/Resolver.tsx
View File

@ -21,6 +21,7 @@ export function Resolver({ resolver }: { resolver: string }) {
return <span>{content}</span>; return <span>{content}</span>;
} }
const defaultTemplate = "$x";
export function OnDemandResolver({ export function OnDemandResolver({
resolver, resolver,
template, template,
@ -34,16 +35,25 @@ export function OnDemandResolver({
const res = useRef(new TTCQueryResolver(parser)); const res = useRef(new TTCQueryResolver(parser));
const [content, setContent] = useState<ReactNode>(""); const [content, setContent] = useState<ReactNode>("");
const generateContent = useCallback(() => { const generateContent = useCallback(() => {
let content = template || "$x"; setContent(() => {
const stackIdxs = Array.from(new Set(content.match(/\$(?:\d+|x)/g))); let content = template || defaultTemplate;
for (const idx of stackIdxs) {
let thing = res.current.getFromStack(idx); const stackIdxs = Array.from(new Set(content.match(/\$(?:\d+|x)/g)));
if (Array.isArray(thing)) thing = thing.at(0); for (const idx of stackIdxs) {
if (typeof thing.display === "function") let thing = res.current.getFromStack(idx);
content = content.replaceAll(idx, thing.display() as string); if (Array.isArray(thing)) thing = thing.at(0);
else content = content.replaceAll(idx, thing.display as string); console.log(thing);
} if (typeof thing.display === "function") {
setContent(content); const disp = thing.display();
if (typeof disp === "string" || typeof disp === "number")
content = content.replaceAll(idx, disp.toString());
else return disp as ReactNode;
}
// else if (idx === defaultTemplate && )
else content = content.replaceAll(idx, thing.display as string);
return content;
}
});
}, [res, template]); }, [res, template]);
const resolve = useCallback(() => { const resolve = useCallback(() => {
@ -52,7 +62,7 @@ export function OnDemandResolver({
}, [res, resolver, generateContent]); }, [res, resolver, generateContent]);
return ( return (
<div className="my-2 rounded-md p-1 bg-black/20 w-min"> <div className="my-2 rounded-md p-1 bg-black/20 flex flex-col">
<button <button
className="text-primary-600" className="text-primary-600"
onMouseDown={() => setContent("")} onMouseDown={() => setContent("")}