budibase/packages/builder/src/common/Textbox.svelte

33 lines
727 B
Svelte

<script>
export let text = "";
export let label = "";
export let width = "medium";
export let size = "small";
export let margin = true;
export let infoText = "";
export let hasError = false;
export let disabled = false;
</script>
<div class:uk-margin={margin}>
<label class="uk-form-label">{label}</label>
<div class="uk-form-controls">
<input class="uk-input uk-form-width-{width} uk-form-{size}"
class:uk-form-danger={hasError}
on:change
bind:value={text}
{disabled}>
</div>
{#if infoText}
<div class="info-text">{infoText}</div>
{/if}
</div>
<style>
.info-text {
font-size: 0.7rem;
color: var(--secondary50);
}
</style>