UNPKG

@lucsoft/webgen

Version:

Collection of lucsofts Components

22 lines (21 loc) 1.03 kB
import { createElement, draw } from "../Components"; import '../../css/checkbox.webgen.static.css'; import { conditionalCSSClass } from "../Helper"; import { accessibilityButton, accessibilityDisableTabOnDisabled } from "../../lib/Accessibility"; import { CommonIcon, Icon } from "./Icon"; export const Checkbox = ({ color, selected, toggledOn, icon }) => { let button = createElement("div"); button.tabIndex = accessibilityDisableTabOnDisabled(color); button.classList.add("wcheckbox", color ?? "grayscaled" /* Grayscaled */); if (selected) button.classList.add("selected"); button.append(draw(Icon(icon ?? CommonIcon(1 /* Done */)))); button.onkeydown = accessibilityButton(button); button.onclick = () => { if (button.classList.contains("disabled" /* Disabled */)) return; conditionalCSSClass(button, !button.classList.contains("selected"), "selected"); setTimeout(() => toggledOn?.(button.classList.contains("selected")), 300); }; return button; };