<div class="gf-form-inline">
	<div class="gf-form">
		<label class="gf-form-label query-keyword width-7">Metric</label>

		<metric-segment segment="regionSegment" get-options="getRegions()" on-change="regionChanged()"></metric-segment>
		<metric-segment segment="namespaceSegment" get-options="getNamespaces()" on-change="namespaceChanged()"></metric-segment>
		<metric-segment segment="metricSegment" get-options="getMetrics()" on-change="metricChanged()"></metric-segment>
	</div>

	<div class="gf-form">
		<label class="gf-form-label query-keyword">Stats</label>
	</div>

	<div class="gf-form" ng-repeat="segment in statSegments">
		<metric-segment segment="segment" get-options="getStatSegments(segment, $index)" on-change="statSegmentChanged(segment, $index)"></metric-segment>
	</div>

	<div class="gf-form gf-form--grow">
		<div class="gf-form-label gf-form-label--grow"></div>
	</div>
</div>

<div class="gf-form-inline">
	<div class="gf-form">
		<label class="gf-form-label query-keyword width-7">Dimensions</label>
		<metric-segment ng-repeat="segment in dimSegments" segment="segment" get-options="getDimSegments(segment, $index)" on-change="dimSegmentChanged(segment, $index)"></metric-segment>
	</div>

	<div class="gf-form gf-form--grow">
		<div class="gf-form-label gf-form-label--grow"></div>
	</div>
</div>

<div class="gf-form-inline">
	<div class="gf-form">
		<label class="gf-form-label query-keyword width-7">
			Period
			<info-popover mode="right-normal">Interval between points in seconds</info-popover>
		</label>
		<input type="text" class="gf-form-input" ng-model="target.period" spellcheck='false' placeholder="auto" ng-model-onblur ng-change="onChange()" />
	</div>
	<div class="gf-form max-width-30">
		<label class="gf-form-label query-keyword width-7">Alias</label>
		<input type="text" class="gf-form-input"  ng-model="target.alias" spellcheck='false' ng-model-onblur ng-change="onChange()">
		<info-popover mode="right-absolute">
			Alias replacement variables:
			<ul ng-non-bindable>
				<li>{{metric}}</li>
				<li>{{stat}}</li>
				<li>{{namespace}}</li>
				<li>{{region}}</li>
				<li>{{YOUR_DIMENSION_NAME}}</li>
			</ul>
		</info-popover>
	</div>
	<div class="gf-form gf-form--grow">
		<div class="gf-form-label gf-form-label--grow"></div>
	</div>
</div>
