Date & Time Pickers

Single Date

<baremetrics-calendar class="d-block daterange daterange--single mb-3" current-date="$ctrl.singleDate"></baremetrics-calendar>

Single Time

<time-picker ng-model="$ctrl.selectedTime" ng-change="$ctrl.onSelectedTimeChanged($event)"></time-picker>

Date Range

<date-range-selector ng-if="$ctrl.availableDateRanges != null"
    class="d-block mb-3"
    page-name="example" //  page state name to save to
    selected-date-range="$ctrl.selectedDateRange"
    available-date-ranges="$ctrl.availableDateRanges"
></date-range-selector>

Date Range with Intervals

<date-range-selector ng-if="$ctrl.availableDateRanges != null"
    class="d-block mb-3"
    page-name="example" //  page state name to save to
    selected-date-range="$ctrl.selectedDateRange"
    available-date-ranges="$ctrl.availableDateRanges"
></date-range-selector>
<div class="btn-group checkbox-based">
   <label class="btn btn-secondary" ng-model="checkModel.mon" uib-btn-checkbox>Monday</label>
   <label class="btn btn-secondary" ng-model="checkModel.tue" uib-btn-checkbox>Tuesday</label>
   <label class="btn btn-secondary" ng-model="checkModel.wed" uib-btn-checkbox>Wednesday</label>
   <label class="btn btn-secondary" ng-model="checkModel.thu" uib-btn-checkbox>Thursday</label>
<label class="btn btn-secondary" ng-model="checkModel.fri" uib-btn-checkbox>Friday</label>
<label class="btn btn-secondary" ng-model="checkModel.sat" uib-btn-checkbox>Saturday</label>
<label class="btn btn-secondary" ng-model="checkModel.sun" uib-btn-checkbox>Sunday</label>
</div>
<rzslider rz-slider-model="slider.min" rz-slider-high="slider.max" rz-slider-options="slider.options"></rzslider>