vuetify eingebunden + erster Versuch Combobox
This commit is contained in:
+58
@@ -0,0 +1,58 @@
|
||||
'use strict';
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
|
||||
require('../../../src/stylus/components/_responsive.styl');
|
||||
|
||||
var _measurable = require('../../mixins/measurable');
|
||||
|
||||
var _measurable2 = _interopRequireDefault(_measurable);
|
||||
|
||||
var _mixins = require('../../util/mixins');
|
||||
|
||||
var _mixins2 = _interopRequireDefault(_mixins);
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
/* @vue/component */
|
||||
|
||||
// Mixins
|
||||
exports.default = (0, _mixins2.default)(_measurable2.default).extend({
|
||||
name: 'v-responsive',
|
||||
props: {
|
||||
aspectRatio: [String, Number]
|
||||
},
|
||||
computed: {
|
||||
computedAspectRatio: function computedAspectRatio() {
|
||||
return Number(this.aspectRatio);
|
||||
},
|
||||
aspectStyle: function aspectStyle() {
|
||||
return this.computedAspectRatio ? { paddingBottom: 1 / this.computedAspectRatio * 100 + '%' } : undefined;
|
||||
},
|
||||
__cachedSizer: function __cachedSizer() {
|
||||
if (!this.aspectStyle) return [];
|
||||
return this.$createElement('div', {
|
||||
style: this.aspectStyle,
|
||||
staticClass: 'v-responsive__sizer'
|
||||
});
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
genContent: function genContent() {
|
||||
return this.$createElement('div', {
|
||||
staticClass: 'v-responsive__content'
|
||||
}, this.$slots.default);
|
||||
}
|
||||
},
|
||||
render: function render(h) {
|
||||
return h('div', {
|
||||
staticClass: 'v-responsive',
|
||||
style: this.measurableStyles,
|
||||
on: this.$listeners
|
||||
}, [this.__cachedSizer, this.genContent()]);
|
||||
}
|
||||
});
|
||||
// Utils
|
||||
//# sourceMappingURL=VResponsive.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["../../../src/components/VResponsive/VResponsive.ts"],"names":[],"mappings":";;;;;;;;AAGA;;;;AAMA;;;;;;AAEA;;AATA;kBAUe,sBAAO,oBAAP,EAAmB,MAAnB,CAA0B;AACvC,UAAM,cADiC;AAGvC,WAAO;AACL,qBAAa,CAAC,MAAD,EAAS,MAAT;AADR,KAHgC;AAOvC,cAAU;AACR,2BADQ,iCACW;AACjB,mBAAO,OAAO,KAAK,WAAZ,CAAP;AACD,SAHO;AAIR,mBAJQ,yBAIG;AACT,mBAAO,KAAK,mBAAL,GACH,EAAE,eAAgB,IAAI,KAAK,mBAAV,GAAiC,GAAjC,GAAuC,GAAxD,EADG,GAEH,SAFJ;AAGD,SARO;AASR,qBATQ,2BASK;AACX,gBAAI,CAAC,KAAK,WAAV,EAAuB,OAAO,EAAP;AAEvB,mBAAO,KAAK,cAAL,CAAoB,KAApB,EAA2B;AAChC,uBAAO,KAAK,WADoB;AAEhC,6BAAa;AAFmB,aAA3B,CAAP;AAID;AAhBO,KAP6B;AA0BvC,aAAS;AACP,kBADO,wBACG;AACR,mBAAO,KAAK,cAAL,CAAoB,KAApB,EAA2B;AAChC,6BAAa;AADmB,aAA3B,EAEJ,KAAK,MAAL,CAAY,OAFR,CAAP;AAGD;AALM,KA1B8B;AAkCvC,UAlCuC,kBAkC/B,CAlC+B,EAkC9B;AACP,eAAO,EAAE,KAAF,EAAS;AACd,yBAAa,cADC;AAEd,mBAAO,KAAK,gBAFE;AAGd,gBAAI,KAAK;AAHK,SAAT,EAIJ,CACD,KAAK,aADJ,EAED,KAAK,UAAL,EAFC,CAJI,CAAP;AAQD;AA3CsC,CAA1B,C;AAJf","sourcesContent":["import '../../stylus/components/_responsive.styl'\n\n// Mixins\nimport Measurable, { NumberOrNumberString } from '../../mixins/measurable'\n\n// Types\nimport { VNode } from 'vue'\n\n// Utils\nimport mixins from '../../util/mixins'\n\n/* @vue/component */\nexport default mixins(Measurable).extend({\n name: 'v-responsive',\n\n props: {\n aspectRatio: [String, Number] as NumberOrNumberString\n },\n\n computed: {\n computedAspectRatio (): number {\n return Number(this.aspectRatio)\n },\n aspectStyle (): object | undefined {\n return this.computedAspectRatio\n ? { paddingBottom: (1 / this.computedAspectRatio) * 100 + '%' }\n : undefined\n },\n __cachedSizer (): VNode | [] {\n if (!this.aspectStyle) return []\n\n return this.$createElement('div', {\n style: this.aspectStyle,\n staticClass: 'v-responsive__sizer'\n })\n }\n },\n\n methods: {\n genContent (): VNode {\n return this.$createElement('div', {\n staticClass: 'v-responsive__content'\n }, this.$slots.default)\n }\n },\n\n render (h): VNode {\n return h('div', {\n staticClass: 'v-responsive',\n style: this.measurableStyles,\n on: this.$listeners\n }, [\n this.__cachedSizer,\n this.genContent()\n ])\n }\n})\n"],"sourceRoot":""}
|
||||
+16
@@ -0,0 +1,16 @@
|
||||
'use strict';
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.VResponsive = undefined;
|
||||
|
||||
var _VResponsive = require('./VResponsive');
|
||||
|
||||
var _VResponsive2 = _interopRequireDefault(_VResponsive);
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
exports.VResponsive = _VResponsive2.default;
|
||||
exports.default = _VResponsive2.default;
|
||||
//# sourceMappingURL=index.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["../../../src/components/VResponsive/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;QAES,W,GAAA,qB;kBACM,qB","sourcesContent":["import VResponsive from './VResponsive'\n\nexport { VResponsive }\nexport default VResponsive\n"],"sourceRoot":""}
|
||||
Reference in New Issue
Block a user