<div ng-controller="Umbraco.PropertyEditors.ColorPickerController as vm">

    <ng-form name="vm.modelValueForm">
        <div ng-if="!isConfigured">
            <localize key="colorpicker_noColors">You haven't defined any colors</localize>
        </div>

        <umb-color-swatches 
            colors="model.config.items"
            selected-color="model.value"
            size="m"
            use-label="model.useLabel"
            on-select="vm.selectColor(color)"
            ng-attr-readonly="{{ readonly || undefined }}">
        </umb-color-swatches>

        <input type="hidden" name="selectedColor" ng-model="model.selectedColor" val-property-validator="validateMandatory" />
    </ng-form>

</div>
