32 lines
1.0 KiB
JavaScript
32 lines
1.0 KiB
JavaScript
// components/Checkbox.js
|
|
// import { Tag } from "../sigpro.js";
|
|
import { val, ui } from "../core/utils.js";
|
|
|
|
/**
|
|
* Checkbox component
|
|
*
|
|
* daisyUI classes used:
|
|
* - checkbox, checkbox-primary, checkbox-secondary, checkbox-accent
|
|
* - checkbox-info, checkbox-success, checkbox-warning, checkbox-error
|
|
* - checkbox-xs, checkbox-sm, checkbox-md, checkbox-lg
|
|
* - toggle, toggle-primary, toggle-secondary, toggle-accent
|
|
* - toggle-xs, toggle-sm, toggle-md, toggle-lg
|
|
* - label, label-text, cursor-pointer
|
|
*/
|
|
export const Checkbox = (props) => {
|
|
const { class: className, value, tooltip, toggle, label, ...rest } = props;
|
|
|
|
const checkEl = Tag("input", {
|
|
...rest,
|
|
type: "checkbox",
|
|
class: () => ui(val(toggle) ? "toggle" : "checkbox", className),
|
|
checked: value
|
|
});
|
|
|
|
const layout = Tag("label", { class: "label cursor-pointer justify-start gap-3" }, [
|
|
checkEl,
|
|
label ? Tag("span", { class: "label-text" }, label) : null,
|
|
]);
|
|
|
|
return tooltip ? Tag("div", { class: "tooltip", "data-tip": tooltip }, layout) : layout;
|
|
}; |