budibase/packages/bootstrap-components/src/Form.svelte

<script>

export let formControls = [];

export let _bb;

let htmlElements = {};
let labelElements = {};
let labels = {};
let isInitialised = false;

$ : {

    if(_bb && htmlElements && !isInitialised) {

        let cIndex = 0;
        for(let c of formControls) {
            labels[cIndex] = c.label;
            cIndex++;
        }

        for(let el in htmlElements) {
            if(formControls[el].control.controlPosition === "Before Label") {
                _bb.insertChildren(
                    _bb.props.formControls[el].control,
                    htmlElements[el],
                    htmlElements[el].childNodes.find(n => n.tagName === "LABEL"));
            } else {
                _bb.appendChildren(
                    _bb.props.formControls[el].control,
                    htmlElements[el]);
            }
        }
        isInitialised = true;
    }
}

</script>

<form>
    {#each formControls as child, idx}
    <div class="form-group" bind:this={htmlElements[idx]}>
        <label>{labels[idx]}</label>
    </div>
    {/each}
</form>