Skip to content

Commit 93b0bc9

Browse files
karakara
authored
chore(input): fix selector on mdInput (#2514)
1 parent ec21ae1 commit 93b0bc9

11 files changed

+77
-73
lines changed

‎src/demo-app/baseline/baseline-demo.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
<md-input placeholder="Input"></md-input>
1414
| Text 5 |
1515
<md-input-container>
16-
<input md-input placeholder="Input">
16+
<input mdInput placeholder="Input">
1717
</md-input-container>
1818
| Text After
1919
</md-card-content>
@@ -35,7 +35,7 @@ <h1>
3535
<md-input placeholder="Input"></md-input>
3636
| Text 5 |
3737
<md-input-container>
38-
<input md-input placeholder="Input">
38+
<input mdInput placeholder="Input">
3939
</md-input-container>
4040
| Text After
4141
</h1>

‎src/demo-app/chips/chips-demo.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ <h4>Input Container</h4>
4444
</md-chip-list>
4545

4646
<md-input-container>
47-
<input md-input #input (keyup.enter)="add(input)" placeholder="New Contributor..."/>
47+
<input mdInput #input (keyup.enter)="add(input)" placeholder="New Contributor..."/>
4848
</md-input-container>
4949

5050
<h4>Stacked Chips</h4>

‎src/demo-app/input/input-container-demo.html

Lines changed: 30 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -3,43 +3,43 @@
33
<md-card-content>
44
<form>
55
<md-input-container class="demo-full-width">
6-
<input md-input placeholder="Company (disabled)" disabled value="Google">
6+
<input mdInput placeholder="Company (disabled)" disabled value="Google">
77
</md-input-container>
88

99
<table style="width: 100%" cellspacing="0"><tr>
1010
<td>
1111
<md-input-container style="width: 100%">
12-
<input md-input placeholder="First name">
12+
<input mdInput placeholder="First name">
1313
</md-input-container>
1414
</td>
1515
<td>
1616
<md-input-container style="width: 100%">
17-
<input md-input placeholder="Long Last Name That Will Be Truncated">
17+
<input mdInput placeholder="Long Last Name That Will Be Truncated">
1818
</md-input-container>
1919
</td>
2020
</tr></table>
2121
<p>
2222
<md-input-container class="demo-full-width">
23-
<textarea md-input placeholder="Address">1600 Amphitheatre Pkway</textarea>
23+
<textarea mdInput placeholder="Address">1600 Amphitheatre Pkway</textarea>
2424
</md-input-container>
2525
<md-input-container class="demo-full-width">
26-
<textarea md-input placeholder="Address 2"></textarea>
26+
<textarea mdInput placeholder="Address 2"></textarea>
2727
</md-input-container>
2828
</p>
2929
<table style="width: 100%" cellspacing="0"><tr>
3030
<td>
3131
<md-input-container class="demo-full-width">
32-
<input md-input placeholder="City" value="Mountain View">
32+
<input mdInput placeholder="City" value="Mountain View">
3333
</md-input-container>
3434
</td>
3535
<td>
3636
<md-input-container class="demo-full-width">
37-
<input md-input placeholder="State" maxLength="2" value="CA">
37+
<input mdInput placeholder="State" maxLength="2" value="CA">
3838
</md-input-container>
3939
</td>
4040
<td>
4141
<md-input-container class="demo-full-width">
42-
<input md-input #postalCode maxLength="5" placeholder="Postal Code" value="94043">
42+
<input mdInput #postalCode maxLength="5" placeholder="Postal Code" value="94043">
4343
<md-hint align="end">{{postalCode.value.length}} / 5</md-hint>
4444
</md-input-container>
4545
</td>
@@ -52,7 +52,7 @@
5252
<md-toolbar color="primary">Prefix + Suffix</md-toolbar>
5353
<md-card-content>
5454
<md-input-container align="end">
55-
<input md-input placeholder="amount">
55+
<input mdInput placeholder="amount">
5656
<span md-prefix>$&nbsp;</span>
5757
<span md-suffix>.00</span>
5858
</md-input-container>
@@ -64,24 +64,24 @@
6464
<md-card-content>
6565
<h4>Input</h4>
6666
<md-input-container dividerColor="primary" >
67-
<input md-input placeholder="Default Color" value="example">
67+
<input mdInput placeholder="Default Color" value="example">
6868
</md-input-container>
6969
<md-input-container dividerColor="accent">
70-
<input md-input placeholder="Accent Color" value="example">
70+
<input mdInput placeholder="Accent Color" value="example">
7171
</md-input-container>
7272
<md-input-container dividerColor="warn">
73-
<input md-input placeholder="Warn Color" value="example">
73+
<input mdInput placeholder="Warn Color" value="example">
7474
</md-input-container>
7575

7676
<h4>Textarea</h4>
7777
<md-input-container dividerColor="primary">
78-
<textarea md-input placeholder="Default Color">example</textarea>
78+
<textarea mdInput placeholder="Default Color">example</textarea>
7979
</md-input-container>
8080
<md-input-container dividerColor="accent">
81-
<textarea md-input placeholder="Accent Color">example</textarea>
81+
<textarea mdInput placeholder="Accent Color">example</textarea>
8282
</md-input-container>
8383
<md-input-container dividerColor="warn">
84-
<textarea md-input placeholder="Warn Color">example</textarea>
84+
<textarea mdInput placeholder="Warn Color">example</textarea>
8585
</md-input-container>
8686
</md-card-content>
8787
</md-card>
@@ -118,33 +118,33 @@ <h4>Textarea</h4>
118118
<md-toolbar color="primary">
119119
Hello&nbsp;
120120
<md-input-container dividerColor="accent">
121-
<input md-input [(ngModel)]="name" type="text" placeholder="First name">
121+
<input mdInput [(ngModel)]="name" type="text" placeholder="First name">
122122
</md-input-container>,
123123
how are you?
124124
</md-toolbar>
125125
<md-card-content>
126126
<p>
127127
<md-input-container>
128-
<input md-input disabled placeholder="Disabled field" value="Value">
128+
<input mdInput disabled placeholder="Disabled field" value="Value">
129129
</md-input-container>
130130
<md-input-container>
131-
<input md-input required placeholder="Required field">
131+
<input mdInput required placeholder="Required field">
132132
</md-input-container>
133133
</p>
134134
<p>
135135
<md-input-container style="width: 100%">
136-
<input md-input placeholder="100% width placeholder">
136+
<input mdInput placeholder="100% width placeholder">
137137
</md-input-container>
138138
</p>
139139
<p>
140140
<md-input-container style="width: 100%">
141-
<input md-input #input placeholder="Character count (100 max)" maxLength="100">
141+
<input mdInput #input placeholder="Character count (100 max)" maxLength="100">
142142
<md-hint align="end">{{input.value.length}} / 100</md-hint>
143143
</md-input-container>
144144
</p>
145145
<p>
146146
<md-input-container hintLabel="Hint label" style="width: 100%">
147-
<input md-input placeholder="Show Hint Label">
147+
<input mdInput placeholder="Show Hint Label">
148148
</md-input-container>
149149
</p>
150150

@@ -161,14 +161,14 @@ <h4>Textarea</h4>
161161
</p>
162162
<p>
163163
<md-input-container hintLabel="Hint label" style="width: 100%">
164-
<input md-input #hintLabelWithCharCount placeholder="Show Hint Label With Character Count">
164+
<input mdInput #hintLabelWithCharCount placeholder="Show Hint Label With Character Count">
165165
<md-hint align="end">{{hintLabelWithCharCount.value.length}}</md-hint>
166166
</md-input-container>
167167
</p>
168168
<p>
169169
<md-checkbox [(ngModel)]="dividerColor">Check to change the divider color:</md-checkbox>
170170
<md-input-container [dividerColor]="dividerColor ? 'primary' : 'accent'">
171-
<input md-input [placeholder]="dividerColor ? 'Primary color' : 'Accent color'">
171+
<input mdInput [placeholder]="dividerColor ? 'Primary color' : 'Accent color'">
172172
</md-input-container>
173173
</p>
174174
<p>
@@ -182,23 +182,23 @@ <h4>Textarea</h4>
182182
<p>
183183
<md-checkbox [(ngModel)]="floatingLabel"> Check to make floating label:</md-checkbox>
184184
<md-input-container [floatingPlaceholder]="floatingLabel">
185-
<input md-input [placeholder]="floatingLabel ? 'Floating label' : 'Not floating label'">
185+
<input mdInput [placeholder]="floatingLabel ? 'Floating label' : 'Not floating label'">
186186
</md-input-container>
187187
</p>
188188

189189
<p>
190190
<md-input-container>
191-
<input md-input placeholder="Prefixed" value="example">
191+
<input mdInput placeholder="Prefixed" value="example">
192192
<div md-prefix>Example:&nbsp;</div>
193193
</md-input-container>
194194
<md-input-container align="end">
195-
<input md-input placeholder="Suffixed" value="123">
195+
<input mdInput placeholder="Suffixed" value="123">
196196
<span md-suffix>.00 €</span>
197197
</md-input-container>
198198
<br/>
199199
Both:
200200
<md-input-container align="end">
201-
<input md-input #email placeholder="Email Address" value="angular-core">
201+
<input mdInput #email placeholder="Email Address" value="angular-core">
202202
<span md-prefix>
203203
<md-icon [class.primary]="email.focused" class="demo-icons demo-transform">email</md-icon>
204204
&nbsp;
@@ -252,8 +252,8 @@ <h4>Textarea</h4>
252252
<md-card class="demo-card demo-basic">
253253
<md-toolbar color="primary">Forms</md-toolbar>
254254
<md-card-content>
255-
<md-input-container><input md-input placeholder="reactive" [formControl]="formControl"></md-input-container>
256-
<md-input-container><input md-input placeholder="template" [(ngModel)]="model" required></md-input-container>
255+
<md-input-container><input mdInput placeholder="reactive" [formControl]="formControl"></md-input-container>
256+
<md-input-container><input mdInput placeholder="template" [(ngModel)]="model" required></md-input-container>
257257
</md-card-content>
258258
</md-card>
259259

@@ -263,7 +263,7 @@ <h4>Textarea</h4>
263263
<textarea md-autosize class="demo-textarea"></textarea>
264264
<div>
265265
<md-input-container>
266-
<textarea md-input
266+
<textarea mdInput
267267
md-autosize
268268
placeholder="Autosized textarea"></textarea>
269269
</md-input-container>

‎src/demo-app/ripple/ripple-demo.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -28,13 +28,13 @@
2828
</section>
2929
<section>
3030
<md-input-container>
31-
<input md-input placeholder="Max radius" aria-label="radius" [(ngModel)]="maxRadius">
31+
<input mdInput placeholder="Max radius" aria-label="radius" [(ngModel)]="maxRadius">
3232
</md-input-container>
3333
<md-input-container>
34-
<input md-input placeholder="Ripple color" aria-label="color" [(ngModel)]="rippleColor">
34+
<input mdInput placeholder="Ripple color" aria-label="color" [(ngModel)]="rippleColor">
3535
</md-input-container>
3636
<md-input-container>
37-
<input md-input
37+
<input mdInput
3838
placeholder="Ripple background"
3939
aria-label="background"
4040
[(ngModel)]="rippleBackgroundColor">

‎src/demo-app/snack-bar/snack-bar-demo.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<h1>SnackBar demo</h1>
22
<div>
33
<div>
4-
Message: <md-input-container><input md-input type="text" [(ngModel)]="message"></md-input-container>
4+
Message: <md-input-container><input mdInput type="text" [(ngModel)]="message"></md-input-container>
55
</div>
66
<div>
77
<md-checkbox [(ngModel)]="action">

‎src/demo-app/tabs/tabs-demo.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -126,7 +126,7 @@ <h1>Tab Group Demo - Dynamic Height</h1>
126126
<br>
127127
<br>
128128
<md-input-container>
129-
<input md-input placeholder="Tab Label" [(ngModel)]="tab.label">
129+
<input mdInput placeholder="Tab Label" [(ngModel)]="tab.label">
130130
</md-input-container>
131131
</md-tab>
132132
</md-tab-group>
@@ -170,7 +170,7 @@ <h1>Tab Group Demo - Fixed Height</h1>
170170
<br>
171171
<br>
172172
<md-input-container>
173-
<input md-input placeholder="Tab Label" [(ngModel)]="tab.label">
173+
<input mdInput placeholder="Tab Label" [(ngModel)]="tab.label">
174174
</md-input-container>
175175
</md-tab>
176176
</md-tab-group>
@@ -195,7 +195,7 @@ <h1>Async Tabs</h1>
195195
<br>
196196
<br>
197197
<md-input-container>
198-
<input md-input placeholder="Tab Label" [(ngModel)]="tab.label">
198+
<input mdInput placeholder="Tab Label" [(ngModel)]="tab.label">
199199
</md-input-container>
200200
</md-tab>
201201
</md-tab-group>

‎src/demo-app/tooltip/tooltip-demo.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ <h1>Tooltip Demo</h1>
2626

2727
<p>
2828
<strong>Message: </strong>
29-
<md-input-container><input md-input type="text" [(ngModel)]="message"></md-input-container>
29+
<md-input-container><input mdInput type="text" [(ngModel)]="message"></md-input-container>
3030
</p>
3131

3232
<p>

‎src/lib/input/README.md

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,19 @@ used instead.**
66
Inputs are the basic input component of Material 2. The spec can be found
77
[here](https://www.google.com/design/spec/components/text-fields.html). `md-input-container` acts as
88
a wrapper for native `input` and `textarea` elements. The native element wrapped by the
9-
`md-input-container` must be marked with the `md-input` directive.
9+
`md-input-container` must be marked with the `mdInput` directive.
1010

1111
Simple `input` example:
1212
```html
1313
<md-input-container>
14-
<input md-input>
14+
<input mdInput>
1515
</md-input-container>
1616
```
1717

1818
Simple `textarea` example:
1919
```html
2020
<md-input-container>
21-
<textarea md-input></textarea>
21+
<textarea mdInput></textarea>
2222
</md-input-container>
2323
```
2424

@@ -73,7 +73,7 @@ To add a prefix, use the `md-prefix` attribute on the element. Similarly, to add
7373

7474
```html
7575
<md-input-container align="end">
76-
<input md-input placeholder="amount">
76+
<input mdInput placeholder="amount">
7777
<span md-prefix>$&nbsp;</span>
7878
<span md-suffix>.00</span>
7979
</md-input-container>
@@ -94,7 +94,7 @@ Specifying a side twice will result in an exception during initialization.
9494
For example, a simple character counter can be made like the following:
9595
```html
9696
<md-input-container>
97-
<input md-input
97+
<input mdInput
9898
placeholder="Character count (100 max)"
9999
maxlength="100"
100100
value="Hello world. How are you?"
@@ -113,13 +113,13 @@ theme primary color. Alternatively, you can specify `accent` or `warn`.
113113

114114
```html
115115
<md-input-container>
116-
<input md-input placeholder="Default color" value="example">
116+
<input mdInput placeholder="Default color" value="example">
117117
</md-input-container>
118118
<md-input-container dividerColor="accent">
119-
<input md-input placeholder="Accent color" value="example">
119+
<input mdInput placeholder="Accent color" value="example">
120120
</md-input-container>
121121
<md-input-container dividerColor="warn">
122-
<input md-input placeholder="Warn color" value="example">
122+
<input mdInput placeholder="Warn color" value="example">
123123
</md-input-container>
124124
```
125125

@@ -133,36 +133,36 @@ You can make a full form using inputs, and they will support autofill natively.
133133
```html
134134
<form>
135135
<md-input-container style="width: 100%">
136-
<input md-input placeholder="Company (disabled)" disabled value="Google">
136+
<input mdInput placeholder="Company (disabled)" disabled value="Google">
137137
</md-input-container>
138138

139139
<table style="width: 100%" cellspacing="0"><tr>
140140
<td><md-input-container style="width: 100%">
141-
<input md-input placeholder="First name">
141+
<input mdInput placeholder="First name">
142142
</md-input-container></td>
143143
<td><md-input-container style="width: 100%">
144-
<input md-input placeholder="Long Last Name That Will Be Truncated">
144+
<input mdInput placeholder="Long Last Name That Will Be Truncated">
145145
</md-input-container></td>
146146
</tr></table>
147147

148148
<p>
149149
<md-input-container width="100%">
150-
<textarea md-input placeholder="Address" value="1600 Amphitheatre Pkway"></textarea>
150+
<textarea mdInput placeholder="Address" value="1600 Amphitheatre Pkway"></textarea>
151151
</md-input-container>
152152
<md-input-container width="100%">
153-
<textarea md-input placeholder="Address 2"></textarea>
153+
<textarea mdInput placeholder="Address 2"></textarea>
154154
</md-input-container>
155155
</p>
156156

157157
<table style="width: 100%" cellspacing="0"><tr>
158158
<td><md-input-container width="100%">
159-
<input md-input placeholder="City">
159+
<input mdInput placeholder="City">
160160
</md-input-container></td>
161161
<td><md-input-container width="100%">
162-
<input md-input placeholder="State">
162+
<input mdInput placeholder="State">
163163
</md-input-container></td>
164164
<td><md-input-container width="100%">
165-
<input md-input #postalCode maxlength="5" placeholder="Postal Code" value="94043">
165+
<input mdInput #postalCode maxlength="5" placeholder="Postal Code" value="94043">
166166
<md-hint align="end">{{postalCode.value.length}} / 5</md-hint>
167167
</md-input-container></td>
168168
</tr></table>

‎src/lib/input/input-container-errors.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export class MdInputContainerDuplicatedHintError extends MdError {
2424
/** @docs-private */
2525
export class MdInputContainerMissingMdInputError extends MdError {
2626
constructor() {
27-
super('md-input-container must contain an md-input directive. Did you forget to add md-input ' +
27+
super('md-input-container must contain an mdInput directive. Did you forget to add mdInput ' +
2828
'to the native input or textarea element?');
2929
}
3030
}

0 commit comments

Comments
 (0)