<div
  class="row no-card-context"
  ng-controller="DataPointWidgetConfigCtrl"
  ng-init="disableLocalStorage = true"
>
  <div class="col-md-12 a-s-stretch">
    <div class="bg-inherit p-t-8">
      <div class="p-b-8 separator-bottom">
        <div class="p-r-24 p-t-8">
          <div
            class="data-point-explorer d-flex d-col"
            ng-controller="c8yDataPointExplorerCtrl"
          >
            <c8y-widget-preview-wrapper>
              <c8y-global-context-widget-wrapper
                ng-style="{ 'z-index': 100 }"
                [display-mode]="'preview'"
                [widget-controls]="widgetControls"
                [config]="wrapperConfig"
              ></c8y-global-context-widget-wrapper>
              <div class="c8yGraphFill">
                <c8y-chart
                  datapoints="data.graphDataPoints"
                  date-from="data.dateFrom"
                  date-to="data.dateTo"
                  realtime="data.realtime"
                  aggregation="data.aggregation"
                  show-time="false"
                  on-data="(onData)"
                  on-update-dates="onUpdateDates($dateFrom, $dateTo)"
                  on-update-displayed-dates="onUpdateDisplayedDates($dateFrom, $dateTo)"
                  on-box-changed="onBoxChanged(box)"
                ></c8y-chart>
              </div>
              <c8y-alarms-events-timelines-chart
                alarms-events-configs="data.graphAlarmsEventsConfigs"
                date-from="data.displayedDateFrom"
                date-to="data.displayedDateTo"
                on-update-dates="onUpdateDates($dateFrom, $dateTo)"
                realtime="data.realtime"
                on-realtime-alarm-fn="onRealtimeAlarmFn(onRealtimeAlarm)"
                on-realtime-event-fn="onRealtimeEventFn(onRealtimeEvent)"
                chart-box="chartBox"
              ></c8y-alarms-events-timelines-chart>
            </c8y-widget-preview-wrapper>
          </div>
        </div>
      </div>
    </div>

    <c8y-data-point-list
      class="bg-inherit separator-bottom"
      datapoints="data.datapoints"
      allow-adding-data-points-from-context-mo-only="dashboard.deviceType && dashboard.deviceTypeValue"
      dont-save="true"
      no-target
      no-yellow-range
      no-red-range
    ></c8y-data-point-list>
    <c8y-alarms-events-timelines-config
      class="d-block bg-inherit separator-top"
      style="padding-top: 1px"
      configs="data.alarmsEventsConfigs"
      allow-alarms-events-from-context-mo-only="dashboard.deviceType && dashboard.deviceTypeValue"
    ></c8y-alarms-events-timelines-config>
  </div>
</div>
