import React from "https://esm.sh/preact@10.11.3/compat";
import { html } from "https://esm.sh/htm@3.1.1/preact";
import * as Store from "./store.js";
/** @typedef {({children}:{children?:preact.ComponentChildren})=>preact.VNode} BasicElement */
/** @type {({children, icon, light, disabled, inactive, onClick}:{children:preact.VNode, icon?:preact.VNode, light:boolean, disabled:boolean, inactive:boolean, onClick:()=>void})=>preact.VNode} */
export function Button({children, icon, light, disabled, inactive, onClick})
{
const [FlashGet, FlashSet] = React.useState(0);
const handleClick =()=>
{
if(inactive||disabled){ return; }
FlashSet(FlashGet+1);
onClick();
};
return html`
`;
}
/** @type {BasicElement} */
export function Chart({children})
{
const [State] = Store.Consumer();
const inset = 20;
/** @type {Array} */
const rules = [];
Store.ColumnMapping.forEach(([label, position, normal])=>
{
rules.push(html`
${label}
`
);
});
for(let db = State.Stim.Min; db <= State.Stim.Max; db+=10)
{
rules.push(html`
${db}
`
);
}
return html`
Frequency in Hz
Hearing Level (dbHL)
`;
}
/** @type {Record} */
const Glyph = {
Arrow:()=> html`
`,
X: ({children})=> html`
${children}`,
O: ({children})=> html`
${children}`
};
/** @type {({right, response, x, y, classes}:{right:boolean, response?:boolean, x:number|string, y:number|string, classes:string})=>preact.VNode} */
export const Mark =({right, response, x, y, classes})=>
{
return html`
`;
}