Skip to content

Commit

Permalink
Address comments
Browse files Browse the repository at this point in the history
  • Loading branch information
devversion committed Feb 1, 2017
1 parent 18e8980 commit 5ab0ea7
Show file tree
Hide file tree
Showing 5 changed files with 19 additions and 29 deletions.
2 changes: 1 addition & 1 deletion src/demo-app/input/input-container-demo.html
Original file line number Diff line number Diff line change
Expand Up @@ -188,7 +188,7 @@ <h4>Textarea</h4>
</p>

<p>
<md-input-container [floatingPlaceholder]="floatingLabel">
<md-input-container [floatPlaceholder]="floatingLabel">
<input mdInput placeholder="Placeholder">
</md-input-container>
</p>
Expand Down
6 changes: 0 additions & 6 deletions src/lib/input/input-container-errors.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,9 +28,3 @@ export class MdInputContainerMissingMdInputError extends MdError {
'to the native input or textarea element?');
}
}

export class MdInputContainerFloatingPlaceholderInvalidError extends MdError {
constructor(value: string) {
super(`The value "${value}" for the floatingPlaceholder input is not valid.`);
}
}
14 changes: 7 additions & 7 deletions src/lib/input/input-container.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ describe('MdInputContainer', function () {

let inputContainer = fixture.debugElement.query(By.directive(MdInputContainer))
.componentInstance as MdInputContainer;
expect(inputContainer.floatingPlaceholder).toBe('auto',
expect(inputContainer.floatPlaceholder).toBe('auto',
'Expected MdInputContainer to set floatingLabel to auto by default.');
});

Expand Down Expand Up @@ -406,7 +406,7 @@ describe('MdInputContainer', function () {
expect(textarea).not.toBeNull();
});

it('should float when floatingPlaceholder is set to default and text is entered', () => {
it('should float when floatPlaceholder is set to default and text is entered', () => {
let fixture = TestBed.createComponent(MdInputContainerWithDynamicPlaceholder);
fixture.detectChanges();

Expand All @@ -432,7 +432,7 @@ describe('MdInputContainer', function () {
expect(labelEl.classList).toContain('md-float');
});

it('should always float the placeholder when floatingPlaceholder is set to true', () => {
it('should always float the placeholder when floatPlaceholder is set to true', () => {
let fixture = TestBed.createComponent(MdInputContainerWithDynamicPlaceholder);
fixture.detectChanges();

Expand All @@ -455,7 +455,7 @@ describe('MdInputContainer', function () {
});


it('should never float the placeholder when floatingPlaceholder is set to false', () => {
it('should never float the placeholder when floatPlaceholder is set to false', () => {
let fixture = TestBed.createComponent(MdInputContainerWithDynamicPlaceholder);

fixture.componentInstance.shouldFloat = 'never';
Expand Down Expand Up @@ -646,7 +646,7 @@ class MdInputContainerWithValueBinding {

@Component({
template: `
<md-input-container floatingPlaceholder="never">
<md-input-container floatPlaceholder="never">
<input mdInput placeholder="Label">
</md-input-container>
`
Expand All @@ -655,8 +655,8 @@ class MdInputContainerWithStaticPlaceholder {}

@Component({
template: `
<md-input-container [floatingPlaceholder]="shouldFloat">
<input md-input placeholder="Label">
<md-input-container [floatPlaceholder]="shouldFloat">
<input mdInput placeholder="Label">
</md-input-container>`
})
class MdInputContainerWithDynamicPlaceholder {
Expand Down
22 changes: 9 additions & 13 deletions src/lib/input/input-container.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import {
MdInputContainerUnsupportedTypeError,
MdInputContainerPlaceholderConflictError,
MdInputContainerDuplicatedHintError,
MdInputContainerMissingMdInputError, MdInputContainerFloatingPlaceholderInvalidError
MdInputContainerMissingMdInputError
} from './input-container-errors';


Expand All @@ -38,9 +38,8 @@ const MD_INPUT_INVALID_TYPES = [
'submit'
];

/** Valid options for the floatingPlaceholder input binding. */
export type MD_INPUT_PLACEHOLDER_TYPES = 'always' | 'never' | 'auto';
const MD_INPUT_PLACEHOLDER_VALUES = ['always', 'never', 'auto'];
/** Type for the available floatPlaceholder values. */
export type FloatPlaceholderType = 'always' | 'never' | 'auto';

let nextUniqueId = 0;

Expand Down Expand Up @@ -248,10 +247,10 @@ export class MdInputContainer implements AfterContentInit {
@Input() dividerColor: 'primary' | 'accent' | 'warn' = 'primary';

/** Whether the floating label should always float or not. */
get _shouldAlwaysFloat() { return this._floatingPlaceholder === 'always'; };
get _shouldAlwaysFloat() { return this._floatPlaceholder === 'always'; };

/** Whether the placeholder can float or not. */
get _canPlaceholderFloat() { return this._floatingPlaceholder !== 'never'; }
get _canPlaceholderFloat() { return this._floatPlaceholder !== 'never'; }

/** Text for the input hint. */
@Input()
Expand All @@ -264,14 +263,11 @@ export class MdInputContainer implements AfterContentInit {

/** Whether the placeholder should always float, never float or float as the user types. */
@Input()
get floatingPlaceholder() { return this._floatingPlaceholder; }
set floatingPlaceholder(value: MD_INPUT_PLACEHOLDER_TYPES) {
if (value && MD_INPUT_PLACEHOLDER_VALUES.indexOf(value) === -1) {
throw new MdInputContainerFloatingPlaceholderInvalidError(value);
}
this._floatingPlaceholder = value || 'auto';
get floatPlaceholder() { return this._floatPlaceholder; }
set floatPlaceholder(value: FloatPlaceholderType) {
this._floatPlaceholder = value || 'auto';
}
private _floatingPlaceholder: MD_INPUT_PLACEHOLDER_TYPES = 'auto';
private _floatPlaceholder: FloatPlaceholderType = 'auto';

@ContentChild(MdInputDirective) _mdInputChild: MdInputDirective;

Expand Down
4 changes: 2 additions & 2 deletions src/lib/input/input.md
Original file line number Diff line number Diff line change
Expand Up @@ -38,10 +38,10 @@ be used with `md-input-container`:
A placeholder is an indicative text displayed in the input zone when the input does not contain
text. When text is present, the indicative text will float above this input zone.

The `floatingPlaceholder` attribute of `md-input-container` can be set to `never` to hide the
The `floatPlaceholder` attribute of `md-input-container` can be set to `never` to hide the
indicative text instead when text is present in the input.

When setting `floatingPlaceholder` to `always` the floating label will always show above the input.
When setting `floatPlaceholder` to `always` the floating label will always show above the input.

A placeholder for the input can be specified in one of two ways: either using the `placeholder`
attribute on the `input` or `textarea`, or using an `md-placeholder` element in the
Expand Down

0 comments on commit 5ab0ea7

Please sign in to comment.