refactor(grafana/ui): Replace <input />with Input component from grafana/ui (#16085)

* replace with Input component from grafana/ui

* removing placeholder classname

* change import

* fix import
This commit is contained in:
Peter Holmberg
2019-03-25 15:53:05 +01:00
committed by GitHub
parent dd388ed578
commit 4898502e4e
26 changed files with 86 additions and 67 deletions

View File

@@ -1,5 +1,6 @@
import React, { Component } from 'react';
import { debounce } from 'lodash';
import { Input } from '@grafana/ui';
export interface Props {
onChange: (alignmentPeriod) => void;
@@ -40,7 +41,7 @@ export class AliasBy extends Component<Props, State> {
<div className="gf-form-inline">
<div className="gf-form">
<label className="gf-form-label query-keyword width-9">Alias By</label>
<input type="text" className="gf-form-input width-24" value={this.state.value} onChange={this.onChange} />
<Input type="text" className="gf-form-input width-24" value={this.state.value} onChange={this.onChange} />
</div>
<div className="gf-form gf-form--grow">
<div className="gf-form-label gf-form-label--grow" />

View File

@@ -1,5 +1,5 @@
import React from 'react';
import _ from 'lodash';
import { Input } from '@grafana/ui';
import { TemplateSrv } from 'app/features/templating/template_srv';
@@ -91,7 +91,7 @@ export class AnnotationQueryEditor extends React.Component<Props, State> {
<div className="gf-form gf-form-inline">
<div className="gf-form">
<span className="gf-form-label query-keyword width-9">Title</span>
<input
<Input
type="text"
className="gf-form-input width-20"
value={title}
@@ -100,7 +100,7 @@ export class AnnotationQueryEditor extends React.Component<Props, State> {
</div>
<div className="gf-form">
<span className="gf-form-label query-keyword width-9">Text</span>
<input
<Input
type="text"
className="gf-form-input width-20"
value={text}

View File

@@ -1,4 +1,5 @@
import React from 'react';
import { Input } from '@grafana/ui';
import StackdriverDatasource from '../datasource';
export interface Props {
@@ -24,7 +25,7 @@ export class Project extends React.Component<Props, State> {
return (
<div className="gf-form">
<span className="gf-form-label width-9 query-keyword">Project</span>
<input className="gf-form-input width-15" disabled type="text" value={projectName} />
<Input className="gf-form-input width-15" disabled type="text" value={projectName} />
</div>
);
}

View File

@@ -398,12 +398,14 @@ Array [
>
Alias By
</label>
<input
className="gf-form-input width-24"
onChange={[Function]}
type="text"
value=""
/>
<div>
<input
className="gf-form-input gf-form-input width-24"
onChange={[Function]}
type="text"
value=""
/>
</div>
</div>
<div
className="gf-form gf-form--grow"
@@ -424,12 +426,14 @@ Array [
>
Project
</span>
<input
className="gf-form-input width-15"
disabled={true}
type="text"
value="Loading project..."
/>
<div>
<input
className="gf-form-input gf-form-input width-15"
disabled={true}
type="text"
value="Loading project..."
/>
</div>
</div>
<div
className="gf-form"