@aujsf/bootstrap-theme/dist/aujsf-bs-object.html

Bootstrap 4 Theme for @aujsf/core

<template>

  <fieldset>
    <div>
      <legend>

        <span if.bind="title">
          ${title}
        </span>

        <span class="form-text text-muted fieldset-description" if.bind="description">${description}</span>

        <div class="input-group input-group-sm" if.bind="!readonly && supportsAdditional">
          <div class="input-group-prepend">
            <button type="button" class="btn btn-outline-success text-monospace"
                    click.delegate="add()"
                    title="Add new item"><strong class="mr-1">&plus;</strong>Add</button>
          </div>
          <input type="text" class="form-control"
                 placeholder.bind="placeholder || 'Add key'"
                 value.bind="newPropertyKey"
                 keydown.delegate="onKeyDown($event)">
        </div>
        <em class="small text-danger" if.bind="supportsAdditional && keyError">
          ${keyError}
        </em>

      </legend>
    </div>

    <span class="d-block invalid-feedback" if.bind="hasErrors" repeat.for="error of errorMessages">
      ${error}
    </span>

    <template repeat.for="definition of definitions | aujsf_sortDefinitions">
      <aujsf-slot schema.bind="definition.schema"
                  ui-schema.bind="definition.uiSchema"
                  value.bind="value[definition.key]"
                  pointer.bind="definition.pointer"
                  required.bind="definition.required"
                  parent-readonly.bind="readonly"
                  errors.bind="errors[definition.key]">
      </aujsf-slot>
    </template>

  </fieldset>
</template>