Skip to content
This repository has been archived by the owner on Oct 6, 2020. It is now read-only.

Commit

Permalink
387137c publish-0.0.25
Browse files Browse the repository at this point in the history
  • Loading branch information
@dharmeshpipariya
dharmeshpipariya committed Jun 22, 2017
1 parent 5a07791 commit 74621bb
Show file tree
Hide file tree
Showing 6 changed files with 46 additions and 14 deletions.
18 changes: 14 additions & 4 deletions bundles/md2.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/**
* @license Md2 v0.0.24
* @license Md2 v0.0.25
* Copyright (c) 2017 Promact, Inc. http://code.promactinfo.com/md2/
* License: MIT
*/
Expand Down Expand Up @@ -5766,7 +5766,7 @@ let Md2Chips = class Md2Chips {
return;
}
else {
this.chipItemList.push(new Chip(chips, this.textKey, this.valueKey));
this.chipItemList.push(new Chip(chips, this.autocompleteItemText, this.autocompleteItemValue));
this.item = null;
}
}
Expand Down Expand Up @@ -5811,7 +5811,17 @@ let Md2Chips = class Md2Chips {
*/
updateValue() {
this._value = new Array();
this._value = this.chipItemList.map((chip) => chip.value);
this._value = this.chipItemList.map((chip) => {
if (this.valueKey) {
let c = {};
c[this.textKey] = chip.text;
c[this.valueKey] = chip.value;
return c;
}
else {
return chip.value;
}
});
this._emitChangeEvent();
}
/** Emits an event when the user selects a color. */
Expand Down Expand Up @@ -5944,7 +5954,7 @@ __decorate$43([
Md2Chips = __decorate$43([
Component({
selector: 'md2-chips',
template: "<div class=\"md2-chips-container\" [class.md2-chip-disabled]=\"disabled\" [class.md2-chip-remove]=\"!isRemovable\"><span *ngFor=\"let chip of chipItemList; let i = index\" class=\"md2-chip\" [class.active]=\"selectedChip === i\"><span>{{chip.text}}</span> <span [innerHTML]=\"templateHtmlString\"></span> <svg (click)=\"removeSelectedChip(i)\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" *ngIf=\"isRemovable\"><path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"/></svg></span><ng-content select=\".md2-template\"></ng-content><form #chipInputForm=\"ngForm\" class=\"chip-input-form\"><input *ngIf=\"!isAutoComplete\" class=\"chip-input\" [disabled]=\"disabled\" [type]=\"type\" [(ngModel)]=\"inputValue\" name=\"chipInput\" [placeholder]=\"placeholder\" (paste)=\"inputPaste($event)\" (keydown)=\"inputChanged($event)\" (blur)=\"inputBlurred()\" (focus)=\"inputFocus()\"><div *ngIf=\"isAutoComplete\"><md2-autocomplete [items]=\"autocompleteDataList\" [item-text]=\"autocompleteItemText\" [(ngModel)]=\"item\" name=\"autocomplete\" [disabled]=\"disabled\" (textChange)=\"valueupdate($event)\" (change)=\"changeAutocomplete($event)\" [placeholder]=\"placeholder\" (keydown)=\"inputChanged($event)\" (click)=\"getFocusAutocomplete()\"></md2-autocomplete></div></form></div><div class=\"chip-error\" *ngIf=\"this.chipItemList.length<this.minChips\">Minimum {{minChips}} chip required.</div><div class=\"chip-error\" *ngIf=\"this.chipItemList.length>=this.maxChips\">You are able to add Maximum {{maxChips}} chip.</div>",
template: "<div class=\"md2-chips-container\" [class.md2-chip-disabled]=\"disabled\" [class.md2-chip-remove]=\"!isRemovable\"><span *ngFor=\"let chip of chipItemList; let i = index\" class=\"md2-chip\" [class.active]=\"selectedChip === i\"><span>{{chip.text}}</span> <span [innerHTML]=\"templateHtmlString\"></span> <svg (click)=\"removeSelectedChip(i)\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" *ngIf=\"isRemovable\"><path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"/></svg></span><ng-content select=\".md2-template\"></ng-content><form #chipInputForm=\"ngForm\" class=\"chip-input-form\"><input *ngIf=\"!isAutoComplete\" class=\"chip-input\" [disabled]=\"disabled\" [type]=\"type\" [(ngModel)]=\"inputValue\" name=\"chipInput\" [placeholder]=\"placeholder\" (paste)=\"inputPaste($event)\" (keydown)=\"inputChanged($event)\" (blur)=\"inputBlurred()\" (focus)=\"inputFocus()\"><div *ngIf=\"isAutoComplete\"><md2-autocomplete name=\"autocomplete\" [placeholder]=\"placeholder\" [disabled]=\"disabled\" [(ngModel)]=\"item\" [items]=\"autocompleteDataList\" [item-text]=\"autocompleteItemText\" (textChange)=\"valueupdate($event)\" (change)=\"changeAutocomplete($event)\" (keydown)=\"inputChanged($event)\" (click)=\"getFocusAutocomplete()\"></md2-autocomplete></div></form></div><div class=\"chip-error\" *ngIf=\"this.chipItemList.length<this.minChips\">Minimum {{minChips}} chip required.</div><div class=\"chip-error\" *ngIf=\"this.chipItemList.length>=this.maxChips\">You are able to add Maximum {{maxChips}} chip.</div>",
styles: [".template-content{display:inline}md2-chips{outline:0}md2-chips .md2-chips-container{display:block;box-shadow:0 1px #ccc;padding:5px 0;margin-bottom:10px;min-height:50px;box-sizing:border-box;clear:both}md2-chips .md2-chips-container::after{clear:both;content:'';display:table}md2-chips.chip-input-focus .md2-chips-container{box-shadow:0 2px #0d8bff}md2-chips .md2-chip-disabled{cursor:default}md2-chips md2-autocomplete{margin:0}md2-chips .md2-autocomplete-wrap{border-bottom:0!important}.md2-chip-remove .md2-chip{padding:0 12px}.md2-chip{font-size:14px;position:relative;cursor:default;border-radius:16px;display:block;height:32px;line-height:32px;margin:8px 8px 0 0;padding:0 28px 0 12px;float:left;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:100%;background:#e0e0e0;color:#424242;white-space:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis}.md2-chip.active{color:#fff;background:#0d8bff}.md2-chip.active svg{color:rgba(255,255,255,.87)}.md2-chip svg{position:absolute;top:4px;right:4px;cursor:pointer;display:inline-block;overflow:hidden;fill:currentColor;color:rgba(0,0,0,.54)}.md2-template{display:none}.chip-input-disabled{pointer-events:none;cursor:default}.chip-input-form{display:inline-block;height:32px;margin:8px 8px 0 0}.chip-remove{cursor:pointer;display:inline-block;padding:0 3px;color:#616161;font-size:30px;vertical-align:top;line-height:21px;font-family:serif}.chip-input{display:inline-block;width:auto;border:0;outline:0;height:32px;line-height:32px;font-size:16px;background:0 0}.chip-error{font-size:13px;color:#fd0f0f}.md2-chips-container .chip-input-form .md2-autocomplete-wrap{border-bottom:0}.md2-chips-container .md2-autocomplete-wrap.is-focused .md2-autocomplete-placeholder{display:none}.md2-chips-container .md2-autocomplete-wrap .md2-autocomplete-placeholder.has-value{display:none}.md2-chips-container .md2-autocomplete-wrap svg{display:none}.md2-chips-container .md2-autocomplete-wrap .md2-autocomplete-input{height:32px;font-size:16px} /*# sourceMappingURL=chips.css.map */ "],
providers: [MD2_CHIPS_CONTROL_VALUE_ACCESSOR],
host: {
Expand Down
19 changes: 15 additions & 4 deletions bundles/md2.umd.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/**
* @license Md2 v0.0.24
* @license Md2 v0.0.25
* Copyright (c) 2017 Promact, Inc. http://code.promactinfo.com/md2/
* License: MIT
*/
Expand Down Expand Up @@ -6133,7 +6133,7 @@ exports.Md2Chips = (function () {
return;
}
else {
this.chipItemList.push(new Chip(chips, this.textKey, this.valueKey));
this.chipItemList.push(new Chip(chips, this.autocompleteItemText, this.autocompleteItemValue));
this.item = null;
}
}
Expand Down Expand Up @@ -6177,8 +6177,19 @@ exports.Md2Chips = (function () {
* update value
*/
Md2Chips.prototype.updateValue = function () {
var _this = this;
this._value = new Array();
this._value = this.chipItemList.map(function (chip) { return chip.value; });
this._value = this.chipItemList.map(function (chip) {
if (_this.valueKey) {
var c = {};
c[_this.textKey] = chip.text;
c[_this.valueKey] = chip.value;
return c;
}
else {
return chip.value;
}
});
this._emitChangeEvent();
};
/** Emits an event when the user selects a color. */
Expand Down Expand Up @@ -6312,7 +6323,7 @@ __decorate$43([
exports.Md2Chips = __decorate$43([
_angular_core.Component({
selector: 'md2-chips',
template: "<div class=\"md2-chips-container\" [class.md2-chip-disabled]=\"disabled\" [class.md2-chip-remove]=\"!isRemovable\"><span *ngFor=\"let chip of chipItemList; let i = index\" class=\"md2-chip\" [class.active]=\"selectedChip === i\"><span>{{chip.text}}</span> <span [innerHTML]=\"templateHtmlString\"></span> <svg (click)=\"removeSelectedChip(i)\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" *ngIf=\"isRemovable\"><path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"/></svg></span><ng-content select=\".md2-template\"></ng-content><form #chipInputForm=\"ngForm\" class=\"chip-input-form\"><input *ngIf=\"!isAutoComplete\" class=\"chip-input\" [disabled]=\"disabled\" [type]=\"type\" [(ngModel)]=\"inputValue\" name=\"chipInput\" [placeholder]=\"placeholder\" (paste)=\"inputPaste($event)\" (keydown)=\"inputChanged($event)\" (blur)=\"inputBlurred()\" (focus)=\"inputFocus()\"><div *ngIf=\"isAutoComplete\"><md2-autocomplete [items]=\"autocompleteDataList\" [item-text]=\"autocompleteItemText\" [(ngModel)]=\"item\" name=\"autocomplete\" [disabled]=\"disabled\" (textChange)=\"valueupdate($event)\" (change)=\"changeAutocomplete($event)\" [placeholder]=\"placeholder\" (keydown)=\"inputChanged($event)\" (click)=\"getFocusAutocomplete()\"></md2-autocomplete></div></form></div><div class=\"chip-error\" *ngIf=\"this.chipItemList.length<this.minChips\">Minimum {{minChips}} chip required.</div><div class=\"chip-error\" *ngIf=\"this.chipItemList.length>=this.maxChips\">You are able to add Maximum {{maxChips}} chip.</div>",
template: "<div class=\"md2-chips-container\" [class.md2-chip-disabled]=\"disabled\" [class.md2-chip-remove]=\"!isRemovable\"><span *ngFor=\"let chip of chipItemList; let i = index\" class=\"md2-chip\" [class.active]=\"selectedChip === i\"><span>{{chip.text}}</span> <span [innerHTML]=\"templateHtmlString\"></span> <svg (click)=\"removeSelectedChip(i)\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" *ngIf=\"isRemovable\"><path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"/></svg></span><ng-content select=\".md2-template\"></ng-content><form #chipInputForm=\"ngForm\" class=\"chip-input-form\"><input *ngIf=\"!isAutoComplete\" class=\"chip-input\" [disabled]=\"disabled\" [type]=\"type\" [(ngModel)]=\"inputValue\" name=\"chipInput\" [placeholder]=\"placeholder\" (paste)=\"inputPaste($event)\" (keydown)=\"inputChanged($event)\" (blur)=\"inputBlurred()\" (focus)=\"inputFocus()\"><div *ngIf=\"isAutoComplete\"><md2-autocomplete name=\"autocomplete\" [placeholder]=\"placeholder\" [disabled]=\"disabled\" [(ngModel)]=\"item\" [items]=\"autocompleteDataList\" [item-text]=\"autocompleteItemText\" (textChange)=\"valueupdate($event)\" (change)=\"changeAutocomplete($event)\" (keydown)=\"inputChanged($event)\" (click)=\"getFocusAutocomplete()\"></md2-autocomplete></div></form></div><div class=\"chip-error\" *ngIf=\"this.chipItemList.length<this.minChips\">Minimum {{minChips}} chip required.</div><div class=\"chip-error\" *ngIf=\"this.chipItemList.length>=this.maxChips\">You are able to add Maximum {{maxChips}} chip.</div>",
styles: [".template-content{display:inline}md2-chips{outline:0}md2-chips .md2-chips-container{display:block;box-shadow:0 1px #ccc;padding:5px 0;margin-bottom:10px;min-height:50px;box-sizing:border-box;clear:both}md2-chips .md2-chips-container::after{clear:both;content:'';display:table}md2-chips.chip-input-focus .md2-chips-container{box-shadow:0 2px #0d8bff}md2-chips .md2-chip-disabled{cursor:default}md2-chips md2-autocomplete{margin:0}md2-chips .md2-autocomplete-wrap{border-bottom:0!important}.md2-chip-remove .md2-chip{padding:0 12px}.md2-chip{font-size:14px;position:relative;cursor:default;border-radius:16px;display:block;height:32px;line-height:32px;margin:8px 8px 0 0;padding:0 28px 0 12px;float:left;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:100%;background:#e0e0e0;color:#424242;white-space:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis}.md2-chip.active{color:#fff;background:#0d8bff}.md2-chip.active svg{color:rgba(255,255,255,.87)}.md2-chip svg{position:absolute;top:4px;right:4px;cursor:pointer;display:inline-block;overflow:hidden;fill:currentColor;color:rgba(0,0,0,.54)}.md2-template{display:none}.chip-input-disabled{pointer-events:none;cursor:default}.chip-input-form{display:inline-block;height:32px;margin:8px 8px 0 0}.chip-remove{cursor:pointer;display:inline-block;padding:0 3px;color:#616161;font-size:30px;vertical-align:top;line-height:21px;font-family:serif}.chip-input{display:inline-block;width:auto;border:0;outline:0;height:32px;line-height:32px;font-size:16px;background:0 0}.chip-error{font-size:13px;color:#fd0f0f}.md2-chips-container .chip-input-form .md2-autocomplete-wrap{border-bottom:0}.md2-chips-container .md2-autocomplete-wrap.is-focused .md2-autocomplete-placeholder{display:none}.md2-chips-container .md2-autocomplete-wrap .md2-autocomplete-placeholder.has-value{display:none}.md2-chips-container .md2-autocomplete-wrap svg{display:none}.md2-chips-container .md2-autocomplete-wrap .md2-autocomplete-input{height:32px;font-size:16px} /*# sourceMappingURL=chips.css.map */ "],
providers: [MD2_CHIPS_CONTROL_VALUE_ACCESSOR],
host: {
Expand Down
2 changes: 1 addition & 1 deletion chips/chips.html
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<div class="md2-chips-container" [class.md2-chip-disabled]="disabled" [class.md2-chip-remove]="!isRemovable"><span *ngFor="let chip of chipItemList; let i = index" class="md2-chip" [class.active]="selectedChip === i"><span>{{chip.text}}</span> <span [innerHTML]="templateHtmlString"></span> <svg (click)="removeSelectedChip(i)" width="24" height="24" viewBox="0 0 24 24" *ngIf="isRemovable"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg></span><ng-content select=".md2-template"></ng-content><form #chipInputForm="ngForm" class="chip-input-form"><input *ngIf="!isAutoComplete" class="chip-input" [disabled]="disabled" [type]="type" [(ngModel)]="inputValue" name="chipInput" [placeholder]="placeholder" (paste)="inputPaste($event)" (keydown)="inputChanged($event)" (blur)="inputBlurred()" (focus)="inputFocus()"><div *ngIf="isAutoComplete"><md2-autocomplete [items]="autocompleteDataList" [item-text]="autocompleteItemText" [(ngModel)]="item" name="autocomplete" [disabled]="disabled" (textChange)="valueupdate($event)" (change)="changeAutocomplete($event)" [placeholder]="placeholder" (keydown)="inputChanged($event)" (click)="getFocusAutocomplete()"></md2-autocomplete></div></form></div><div class="chip-error" *ngIf="this.chipItemList.length<this.minChips">Minimum {{minChips}} chip required.</div><div class="chip-error" *ngIf="this.chipItemList.length>=this.maxChips">You are able to add Maximum {{maxChips}} chip.</div>
<div class="md2-chips-container" [class.md2-chip-disabled]="disabled" [class.md2-chip-remove]="!isRemovable"><span *ngFor="let chip of chipItemList; let i = index" class="md2-chip" [class.active]="selectedChip === i"><span>{{chip.text}}</span> <span [innerHTML]="templateHtmlString"></span> <svg (click)="removeSelectedChip(i)" width="24" height="24" viewBox="0 0 24 24" *ngIf="isRemovable"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg></span><ng-content select=".md2-template"></ng-content><form #chipInputForm="ngForm" class="chip-input-form"><input *ngIf="!isAutoComplete" class="chip-input" [disabled]="disabled" [type]="type" [(ngModel)]="inputValue" name="chipInput" [placeholder]="placeholder" (paste)="inputPaste($event)" (keydown)="inputChanged($event)" (blur)="inputBlurred()" (focus)="inputFocus()"><div *ngIf="isAutoComplete"><md2-autocomplete name="autocomplete" [placeholder]="placeholder" [disabled]="disabled" [(ngModel)]="item" [items]="autocompleteDataList" [item-text]="autocompleteItemText" (textChange)="valueupdate($event)" (change)="changeAutocomplete($event)" (keydown)="inputChanged($event)" (click)="getFocusAutocomplete()"></md2-autocomplete></div></form></div><div class="chip-error" *ngIf="this.chipItemList.length<this.minChips">Minimum {{minChips}} chip required.</div><div class="chip-error" *ngIf="this.chipItemList.length>=this.maxChips">You are able to add Maximum {{maxChips}} chip.</div>
Loading

0 comments on commit 74621bb

Please sign in to comment.