27 lines
926 B
JavaScript
27 lines
926 B
JavaScript
import { $, html } from "sigpro";
|
|
|
|
$.component(
|
|
"c-input",
|
|
(props, { slot, emit }) => {
|
|
return html`
|
|
<div class="${props.tooltip() ? "tooltip" : ""}" data-tip=${() => props.tooltip() ?? ""}>
|
|
<label class="floating-label">
|
|
<span>${() => props.label() ?? ""}</span>
|
|
<label class=${() => `input ${props.ui() ?? ""}`}>
|
|
<input
|
|
type=${() => props.type() ?? "text"}
|
|
class="input"
|
|
:value=${props.value}
|
|
placeholder=${() => props.place() ?? props.label() ?? ""}
|
|
@input=${(e) => emit("input", e.target.value)}
|
|
@change=${(e) => emit("change", e.target.value)} />
|
|
<span>${slot("icon-action")}</span>
|
|
<span class=${() => props.icon() ?? ""}></span>
|
|
</label>
|
|
</label>
|
|
</div>
|
|
`;
|
|
},
|
|
["label", "value", "icon", "tooltip", "ui", "place", "type"],
|
|
);
|