Files
Dare2/components_/Button.js
2026-03-25 02:03:59 +01:00

32 lines
944 B
JavaScript

import { $, html } from "sigpro";
$.component(
"c-button",
(props, { emit, slot }) => {
const spinner = () => html`
<span .class="${() => `loading loading-spinner loading-xs ${props.loading() ? "" : "hidden"}`}"></span>
`;
return html`
<div class="${props.tooltip() ? "tooltip" : ""}" data-tip=${() => props.tooltip() ?? ""}>
<button
class="${() => `btn ${props.cls() ?? ""} ${props.badge() ? "indicator" : ""}`}"
?disabled=${props.loading}
@click=${(e) => {
e.stopPropagation();
if (!props.loading()) emit("click", e);
}}>
${spinner} ${slot()}
${() =>
props.badge()
? html`
<span class="indicator-item badge badge-secondary">${props.badge()}</span>
`
: null}
</button>
</div>
`;
},
["cls", "loading", "badge", "tooltip"],
);