Skip to content

Commit e30e22c

Browse files
committed
update dist
1 parent 2093252 commit e30e22c

File tree

4 files changed

+95
-23
lines changed

4 files changed

+95
-23
lines changed

dist/vue-aspect-ratio.common.js

Lines changed: 31 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* vue-aspect-ratio v0.1.0
2+
* vue-aspect-ratio v0.1.1
33
* (c) 2019 [email protected]
44
* Released under the MIT License.
55
*/
@@ -60,6 +60,12 @@ function _nonIterableRest() {
6060
var script = {
6161
name: "VueAspectRatio",
6262
props: {
63+
/**
64+
* Aspect Ratio.
65+
* String with the following pattern
66+
* <aspect_ratio_width>:<aspect_ratio_height>
67+
* Default is "1:1" meaning that the component will be a square
68+
*/
6369
ar: {
6470
type: String,
6571
default: "1:1",
@@ -73,7 +79,13 @@ var script = {
7379

7480
return !Number.isNaN(w) && !Number.isNaN(h);
7581
}
76-
}
82+
},
83+
84+
/**
85+
* Width to set to the component.
86+
* Optional, if not set the width will be 100% like a normal "div" element
87+
*/
88+
width: String
7789
},
7890
data: function data() {
7991
return {
@@ -84,15 +96,27 @@ var script = {
8496
};
8597
},
8698
computed: {
99+
/**
100+
* Style for the outer div element, this can just set the width of the component itself
101+
*/
102+
componentStyle: function componentStyle() {
103+
return this.width ? {
104+
width: this.width
105+
} : {};
106+
},
107+
108+
/**
109+
* Style for the inner div element, this will define the aspect ratio
110+
*/
87111
innerStyle: function innerStyle() {
88-
// set the padding, this is actually what gives the aspect ratio
112+
// set the padding top, this is actually what gives the aspect ratio
89113
return {
90114
paddingTop: this.h / this.w * 100 + "%"
91115
};
92116
}
93117
},
94118
created: function created() {
95-
// set w and h data
119+
// set w and h data parsing the ar prop
96120
var _this$ar$split$map = this.ar.split(":").map(function (v) {
97121
return parseInt(v);
98122
}),
@@ -246,17 +270,17 @@ var browser = createInjector;
246270
const __vue_script__ = script;
247271

248272
/* template */
249-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"vue-aspect-ratio"},[_c('div',{staticClass:"vue-aspect-ratio__inner",style:(_vm.innerStyle)},[_c('div',{staticClass:"vue-aspect-ratio__content"},[_vm._t("default")],2)])])};
273+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"vue-aspect-ratio",style:(_vm.componentStyle)},[_c('div',{staticClass:"vue-aspect-ratio__inner",style:(_vm.innerStyle)},[_c('div',{staticClass:"vue-aspect-ratio__content"},[_vm._t("default")],2)])])};
250274
var __vue_staticRenderFns__ = [];
251275

252276
/* style */
253277
const __vue_inject_styles__ = function (inject) {
254278
if (!inject) return
255-
inject("data-v-69342252_0", { source: ".vue-aspect-ratio__inner[data-v-69342252]{position:relative}.vue-aspect-ratio__content[data-v-69342252]{position:absolute;top:0;left:0;width:100%;height:100%}", map: undefined, media: undefined });
279+
inject("data-v-f0460d78_0", { source: ".vue-aspect-ratio__inner[data-v-f0460d78]{position:relative}.vue-aspect-ratio__content[data-v-f0460d78]{position:absolute;top:0;left:0;width:100%;height:100%}", map: undefined, media: undefined });
256280

257281
};
258282
/* scoped */
259-
const __vue_scope_id__ = "data-v-69342252";
283+
const __vue_scope_id__ = "data-v-f0460d78";
260284
/* module identifier */
261285
const __vue_module_identifier__ = undefined;
262286
/* functional template */

dist/vue-aspect-ratio.esm.js

Lines changed: 31 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* vue-aspect-ratio v0.1.0
2+
* vue-aspect-ratio v0.1.1
33
* (c) 2019 [email protected]
44
* Released under the MIT License.
55
*/
@@ -58,6 +58,12 @@ function _nonIterableRest() {
5858
var script = {
5959
name: "VueAspectRatio",
6060
props: {
61+
/**
62+
* Aspect Ratio.
63+
* String with the following pattern
64+
* <aspect_ratio_width>:<aspect_ratio_height>
65+
* Default is "1:1" meaning that the component will be a square
66+
*/
6167
ar: {
6268
type: String,
6369
default: "1:1",
@@ -71,7 +77,13 @@ var script = {
7177

7278
return !Number.isNaN(w) && !Number.isNaN(h);
7379
}
74-
}
80+
},
81+
82+
/**
83+
* Width to set to the component.
84+
* Optional, if not set the width will be 100% like a normal "div" element
85+
*/
86+
width: String
7587
},
7688
data: function data() {
7789
return {
@@ -82,15 +94,27 @@ var script = {
8294
};
8395
},
8496
computed: {
97+
/**
98+
* Style for the outer div element, this can just set the width of the component itself
99+
*/
100+
componentStyle: function componentStyle() {
101+
return this.width ? {
102+
width: this.width
103+
} : {};
104+
},
105+
106+
/**
107+
* Style for the inner div element, this will define the aspect ratio
108+
*/
85109
innerStyle: function innerStyle() {
86-
// set the padding, this is actually what gives the aspect ratio
110+
// set the padding top, this is actually what gives the aspect ratio
87111
return {
88112
paddingTop: this.h / this.w * 100 + "%"
89113
};
90114
}
91115
},
92116
created: function created() {
93-
// set w and h data
117+
// set w and h data parsing the ar prop
94118
var _this$ar$split$map = this.ar.split(":").map(function (v) {
95119
return parseInt(v);
96120
}),
@@ -244,17 +268,17 @@ var browser = createInjector;
244268
const __vue_script__ = script;
245269

246270
/* template */
247-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"vue-aspect-ratio"},[_c('div',{staticClass:"vue-aspect-ratio__inner",style:(_vm.innerStyle)},[_c('div',{staticClass:"vue-aspect-ratio__content"},[_vm._t("default")],2)])])};
271+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"vue-aspect-ratio",style:(_vm.componentStyle)},[_c('div',{staticClass:"vue-aspect-ratio__inner",style:(_vm.innerStyle)},[_c('div',{staticClass:"vue-aspect-ratio__content"},[_vm._t("default")],2)])])};
248272
var __vue_staticRenderFns__ = [];
249273

250274
/* style */
251275
const __vue_inject_styles__ = function (inject) {
252276
if (!inject) return
253-
inject("data-v-69342252_0", { source: ".vue-aspect-ratio__inner[data-v-69342252]{position:relative}.vue-aspect-ratio__content[data-v-69342252]{position:absolute;top:0;left:0;width:100%;height:100%}", map: undefined, media: undefined });
277+
inject("data-v-f0460d78_0", { source: ".vue-aspect-ratio__inner[data-v-f0460d78]{position:relative}.vue-aspect-ratio__content[data-v-f0460d78]{position:absolute;top:0;left:0;width:100%;height:100%}", map: undefined, media: undefined });
254278

255279
};
256280
/* scoped */
257-
const __vue_scope_id__ = "data-v-69342252";
281+
const __vue_scope_id__ = "data-v-f0460d78";
258282
/* module identifier */
259283
const __vue_module_identifier__ = undefined;
260284
/* functional template */

dist/vue-aspect-ratio.umd.js

Lines changed: 31 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* vue-aspect-ratio v0.1.0
2+
* vue-aspect-ratio v0.1.1
33
* (c) 2019 [email protected]
44
* Released under the MIT License.
55
*/
@@ -64,6 +64,12 @@
6464
var script = {
6565
name: "VueAspectRatio",
6666
props: {
67+
/**
68+
* Aspect Ratio.
69+
* String with the following pattern
70+
* <aspect_ratio_width>:<aspect_ratio_height>
71+
* Default is "1:1" meaning that the component will be a square
72+
*/
6773
ar: {
6874
type: String,
6975
default: "1:1",
@@ -77,7 +83,13 @@
7783

7884
return !Number.isNaN(w) && !Number.isNaN(h);
7985
}
80-
}
86+
},
87+
88+
/**
89+
* Width to set to the component.
90+
* Optional, if not set the width will be 100% like a normal "div" element
91+
*/
92+
width: String
8193
},
8294
data: function data() {
8395
return {
@@ -88,15 +100,27 @@
88100
};
89101
},
90102
computed: {
103+
/**
104+
* Style for the outer div element, this can just set the width of the component itself
105+
*/
106+
componentStyle: function componentStyle() {
107+
return this.width ? {
108+
width: this.width
109+
} : {};
110+
},
111+
112+
/**
113+
* Style for the inner div element, this will define the aspect ratio
114+
*/
91115
innerStyle: function innerStyle() {
92-
// set the padding, this is actually what gives the aspect ratio
116+
// set the padding top, this is actually what gives the aspect ratio
93117
return {
94118
paddingTop: this.h / this.w * 100 + "%"
95119
};
96120
}
97121
},
98122
created: function created() {
99-
// set w and h data
123+
// set w and h data parsing the ar prop
100124
var _this$ar$split$map = this.ar.split(":").map(function (v) {
101125
return parseInt(v);
102126
}),
@@ -250,17 +274,17 @@
250274
const __vue_script__ = script;
251275

252276
/* template */
253-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"vue-aspect-ratio"},[_c('div',{staticClass:"vue-aspect-ratio__inner",style:(_vm.innerStyle)},[_c('div',{staticClass:"vue-aspect-ratio__content"},[_vm._t("default")],2)])])};
277+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"vue-aspect-ratio",style:(_vm.componentStyle)},[_c('div',{staticClass:"vue-aspect-ratio__inner",style:(_vm.innerStyle)},[_c('div',{staticClass:"vue-aspect-ratio__content"},[_vm._t("default")],2)])])};
254278
var __vue_staticRenderFns__ = [];
255279

256280
/* style */
257281
const __vue_inject_styles__ = function (inject) {
258282
if (!inject) return
259-
inject("data-v-69342252_0", { source: ".vue-aspect-ratio__inner[data-v-69342252]{position:relative}.vue-aspect-ratio__content[data-v-69342252]{position:absolute;top:0;left:0;width:100%;height:100%}", map: undefined, media: undefined });
283+
inject("data-v-f0460d78_0", { source: ".vue-aspect-ratio__inner[data-v-f0460d78]{position:relative}.vue-aspect-ratio__content[data-v-f0460d78]{position:absolute;top:0;left:0;width:100%;height:100%}", map: undefined, media: undefined });
260284

261285
};
262286
/* scoped */
263-
const __vue_scope_id__ = "data-v-69342252";
287+
const __vue_scope_id__ = "data-v-f0460d78";
264288
/* module identifier */
265289
const __vue_module_identifier__ = undefined;
266290
/* functional template */

dist/vue-aspect-ratio.umd.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)