vuetify eingebunden + erster Versuch Combobox
This commit is contained in:
+102
@@ -0,0 +1,102 @@
|
||||
'use strict';
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
|
||||
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
||||
// Components
|
||||
|
||||
// Mixins
|
||||
|
||||
|
||||
require('../../../src/stylus/components/_chips.styl');
|
||||
|
||||
var _mixins = require('../../util/mixins');
|
||||
|
||||
var _mixins2 = _interopRequireDefault(_mixins);
|
||||
|
||||
var _VIcon = require('../VIcon');
|
||||
|
||||
var _VIcon2 = _interopRequireDefault(_VIcon);
|
||||
|
||||
var _colorable = require('../../mixins/colorable');
|
||||
|
||||
var _colorable2 = _interopRequireDefault(_colorable);
|
||||
|
||||
var _themeable = require('../../mixins/themeable');
|
||||
|
||||
var _themeable2 = _interopRequireDefault(_themeable);
|
||||
|
||||
var _toggleable = require('../../mixins/toggleable');
|
||||
|
||||
var _toggleable2 = _interopRequireDefault(_toggleable);
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
/* @vue/component */
|
||||
exports.default = (0, _mixins2.default)(_colorable2.default, _themeable2.default, _toggleable2.default).extend({
|
||||
name: 'v-chip',
|
||||
props: {
|
||||
close: Boolean,
|
||||
disabled: Boolean,
|
||||
label: Boolean,
|
||||
outline: Boolean,
|
||||
// Used for selects/tagging
|
||||
selected: Boolean,
|
||||
small: Boolean,
|
||||
textColor: String,
|
||||
value: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
classes: function classes() {
|
||||
return _extends({
|
||||
'v-chip--disabled': this.disabled,
|
||||
'v-chip--selected': this.selected && !this.disabled,
|
||||
'v-chip--label': this.label,
|
||||
'v-chip--outline': this.outline,
|
||||
'v-chip--small': this.small,
|
||||
'v-chip--removable': this.close
|
||||
}, this.themeClasses);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
genClose: function genClose(h) {
|
||||
var _this = this;
|
||||
|
||||
var data = {
|
||||
staticClass: 'v-chip__close',
|
||||
on: {
|
||||
click: function click(e) {
|
||||
e.stopPropagation();
|
||||
_this.$emit('input', false);
|
||||
}
|
||||
}
|
||||
};
|
||||
return h('div', data, [h(_VIcon2.default, '$vuetify.icons.delete')]);
|
||||
},
|
||||
genContent: function genContent(h) {
|
||||
return h('span', {
|
||||
staticClass: 'v-chip__content'
|
||||
}, [this.$slots.default, this.close && this.genClose(h)]);
|
||||
}
|
||||
},
|
||||
render: function render(h) {
|
||||
var data = this.setBackgroundColor(this.color, {
|
||||
staticClass: 'v-chip',
|
||||
'class': this.classes,
|
||||
attrs: { tabindex: this.disabled ? -1 : 0 },
|
||||
directives: [{
|
||||
name: 'show',
|
||||
value: this.isActive
|
||||
}],
|
||||
on: this.$listeners
|
||||
});
|
||||
var color = this.textColor || this.outline && this.color;
|
||||
return h('span', this.setTextColor(color, data), [this.genContent(h)]);
|
||||
}
|
||||
});
|
||||
//# sourceMappingURL=VChip.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["../../../src/components/VChip/VChip.ts"],"names":[],"mappings":";;;;;;;AAMA;;AAGA;;;;;AALA;;;;AAGA;;;;AAGA;;;;AACA;;;;AACA;;;;;;AAEA;kBACe,sBAAO,mBAAP,EAAkB,mBAAlB,EAA6B,oBAA7B,EAAyC,MAAzC,CAAgD;AAC7D,UAAM,QADuD;AAG7D,WAAO;AACL,eAAO,OADF;AAEL,kBAAU,OAFL;AAGL,eAAO,OAHF;AAIL,iBAAS,OAJJ;AAKL;AACA,kBAAU,OANL;AAOL,eAAO,OAPF;AAQL,mBAAW,MARN;AASL,eAAO;AACL,kBAAM,OADD;AAEL,qBAAS;AAFJ;AATF,KAHsD;AAkB7D,cAAU;AACR,eADQ,qBACD;AACL;AACE,oCAAoB,KAAK,QAD3B;AAEE,oCAAoB,KAAK,QAAL,IAAiB,CAAC,KAAK,QAF7C;AAGE,iCAAiB,KAAK,KAHxB;AAIE,mCAAmB,KAAK,OAJ1B;AAKE,iCAAiB,KAAK,KALxB;AAME,qCAAqB,KAAK;AAN5B,eAOK,KAAK,YAPV;AASD;AAXO,KAlBmD;AAgC7D,aAAS;AACP,gBADO,oBACG,CADH,EACmB;AAAA;;AACxB,gBAAM,OAAO;AACX,6BAAa,eADF;AAEX,oBAAI;AACF,2BAAO,eAAC,CAAD,EAAa;AAClB,0BAAE,eAAF;AAEA,8BAAK,KAAL,CAAW,OAAX,EAAoB,KAApB;AACD;AALC;AAFO,aAAb;AAWA,mBAAO,EAAE,KAAF,EAAS,IAAT,EAAe,CACpB,EAAE,eAAF,EAAS,uBAAT,CADoB,CAAf,CAAP;AAGD,SAhBM;AAiBP,kBAjBO,sBAiBK,CAjBL,EAiBqB;AAC1B,mBAAO,EAAE,MAAF,EAAU;AACf,6BAAa;AADE,aAAV,EAEJ,CACD,KAAK,MAAL,CAAY,OADX,EAED,KAAK,KAAL,IAAc,KAAK,QAAL,CAAc,CAAd,CAFb,CAFI,CAAP;AAMD;AAxBM,KAhCoD;AA2D7D,UA3D6D,kBA2DrD,CA3DqD,EA2DpD;AACP,YAAM,OAAO,KAAK,kBAAL,CAAwB,KAAK,KAA7B,EAAoC;AAC/C,yBAAa,QADkC;AAE/C,qBAAS,KAAK,OAFiC;AAG/C,mBAAO,EAAE,UAAU,KAAK,QAAL,GAAgB,CAAC,CAAjB,GAAqB,CAAjC,EAHwC;AAI/C,wBAAY,CAAC;AACX,sBAAM,MADK;AAEX,uBAAO,KAAK;AAFD,aAAD,CAJmC;AAQ/C,gBAAI,KAAK;AARsC,SAApC,CAAb;AAWA,YAAM,QAAQ,KAAK,SAAL,IAAmB,KAAK,OAAL,IAAgB,KAAK,KAAtD;AACA,eAAO,EAAE,MAAF,EAAU,KAAK,YAAL,CAAkB,KAAlB,EAAyB,IAAzB,CAAV,EAA0C,CAAC,KAAK,UAAL,CAAgB,CAAhB,CAAD,CAA1C,CAAP;AACD;AAzE4D,CAAhD,C","sourcesContent":["import '../../stylus/components/_chips.styl'\n\n// Types\nimport { CreateElement, VNode } from 'vue'\nimport mixins from '../../util/mixins'\n\n// Components\nimport VIcon from '../VIcon'\n\n// Mixins\nimport Colorable from '../../mixins/colorable'\nimport Themeable from '../../mixins/themeable'\nimport Toggleable from '../../mixins/toggleable'\n\n/* @vue/component */\nexport default mixins(Colorable, Themeable, Toggleable).extend({\n name: 'v-chip',\n\n props: {\n close: Boolean,\n disabled: Boolean,\n label: Boolean,\n outline: Boolean,\n // Used for selects/tagging\n selected: Boolean,\n small: Boolean,\n textColor: String,\n value: {\n type: Boolean,\n default: true\n }\n },\n\n computed: {\n classes (): object {\n return {\n 'v-chip--disabled': this.disabled,\n 'v-chip--selected': this.selected && !this.disabled,\n 'v-chip--label': this.label,\n 'v-chip--outline': this.outline,\n 'v-chip--small': this.small,\n 'v-chip--removable': this.close,\n ...this.themeClasses\n }\n }\n },\n\n methods: {\n genClose (h: CreateElement): VNode {\n const data = {\n staticClass: 'v-chip__close',\n on: {\n click: (e: Event) => {\n e.stopPropagation()\n\n this.$emit('input', false)\n }\n }\n }\n\n return h('div', data, [\n h(VIcon, '$vuetify.icons.delete')\n ])\n },\n genContent (h: CreateElement): VNode {\n return h('span', {\n staticClass: 'v-chip__content'\n }, [\n this.$slots.default,\n this.close && this.genClose(h)\n ])\n }\n },\n\n render (h): VNode {\n const data = this.setBackgroundColor(this.color, {\n staticClass: 'v-chip',\n 'class': this.classes,\n attrs: { tabindex: this.disabled ? -1 : 0 },\n directives: [{\n name: 'show',\n value: this.isActive\n }],\n on: this.$listeners\n })\n\n const color = this.textColor || (this.outline && this.color)\n return h('span', this.setTextColor(color, data), [this.genContent(h)])\n }\n})\n"],"sourceRoot":""}
|
||||
+16
@@ -0,0 +1,16 @@
|
||||
'use strict';
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.VChip = undefined;
|
||||
|
||||
var _VChip = require('./VChip');
|
||||
|
||||
var _VChip2 = _interopRequireDefault(_VChip);
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
exports.VChip = _VChip2.default;
|
||||
exports.default = _VChip2.default;
|
||||
//# sourceMappingURL=index.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["../../../src/components/VChip/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;QAES,K,GAAA,e;kBACM,e","sourcesContent":["import VChip from './VChip'\n\nexport { VChip }\nexport default VChip\n"],"sourceRoot":""}
|
||||
Reference in New Issue
Block a user