paperless-ngx/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.html

<div ngbDropdown #fieldDropdown="ngbDropdown" (openChange)="onOpenClose()">
    <button class="btn btn-sm btn-outline-primary" id="customFieldsDropdown" [disabled]="disabled" ngbDropdownToggle>
      <i-bs name="ui-radios"></i-bs>
      <div class="d-none d-sm-inline">&nbsp;<ng-container i18n>Custom Fields</ng-container></div>
    </button>
    <div ngbDropdownMenu aria-labelledby="customFieldsDropdown" class="shadow custom-fields-dropdown">
        <ul class="list-group list-group-flush">
            <li class="list-group-item">
                <pngx-input-select
                    [items]="unusedFields"
                    bindLabel="name"
                    [(ngModel)]="field"
                    [placeholder]="placeholderText"
                    [notFoundText]="notFoundText"
                    [disableCreateNew]="!canCreateFields"
                    (createNew)="createField($event)"
                    [hideAddButton]="true"
                    bindValue="id">
                </pngx-input-select>
                <div class="btn-toolbar" role="toolbar">
                    <button class="btn btn-sm btn-outline-secondary me-auto" type="button" (click)="createField()" [disabled]="!canCreateFields">
                        <i-bs width="1em" height="1em" name="asterisk"></i-bs>&nbsp;<ng-container i18n>Create New Field</ng-container>
                    </button>
                    <button class="btn btn-sm btn-outline-primary" type="button" (click)="addField(); fieldDropdown.close()" [disabled]="field === undefined">
                        <i-bs width="1.2em" height="1.2em" name="plus-circle"></i-bs>&nbsp;<ng-container i18n>Add to document</ng-container>
                    </button>
                </div>
            </li>
        </ul>
    </div>
</div>