How to use the vue-types.oneOfType function in vue-types
To help you get started, we’ve selected a few vue-types examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
Waavi / vue-wcharts / src / charts2 / chartMixin.js View on Github 
import VueTypes from 'vue-types'
import debounce from 'lodash.debounce'
import sortBy from 'lodash.sortby'
// import activeMixin from '../mixins/active'
import themeMixin from '../mixins/theme'
import { random } from '../utils/maths'
import { generateUid, getOuterElementLayout } from './chartUtils'
export default {
mixins: [themeMixin],
props: {
id: VueTypes.oneOfType([VueTypes.string, VueTypes.number]).optional,
dataset: VueTypes.oneOfType([Array, Object]).def([]),
responsive: VueTypes.bool.def(false),
width: VueTypes.number.def(600),
height: VueTypes.number.def(400),
padding: VueTypes.oneOfType([
VueTypes.number,
VueTypes.arrayOf(VueTypes.number),
VueTypes.shape({
top: VueTypes.number,
right: VueTypes.number,
bottom: VueTypes.number,
left: VueTypes.number,
}),
]).def(0),
},
provide () {import { genTicks, genExactNbTicks } from '../../utils/maths'
export default {
name: 'WCartesianGrid',
type: 'grid',
inject: ['Chart'],
mixins: [themeMixin],
props: {
hideH: VueTypes.bool.def(false),
hideV: VueTypes.bool.def(false),
numLinesH: VueTypes.number,
numLinesV: VueTypes.number,
styles: VueTypes.shape({
stroke: VueTypes.string,
strokeWidth: VueTypes.number,
strokeDasharray: VueTypes.oneOfType([String, Number]),
}),
},
computed: {
hNum () {
return this.numLinesH || this.Chart.axis.y.numTicks
},
vNum () {
return this.numLinesV || this.Chart.axis.x.numTicks
},
hLines () {
const {
data, canvas, bounds, yScale,
} = this.Chart
// Return a empty array if we don't want to show horizontal lines
if (this.hideH || !data || data.length === 0) return []
// Calculate number of lines to paint),
sortByWithCount: VueTypes.oneOf(['asc', 'desc', 'count']),
stats: VueTypes.arrayOf(VueTypes.object),
string: VueTypes.string,
stringArray: VueTypes.arrayOf(VueTypes.string),
stringOrArray: VueTypes.oneOfType([VueTypes.string, VueTypes.arrayOf(VueTypes.string)]),
stringRequired: VueTypes.string.isRequired,
style: VueTypes.object,
themePreset: VueTypes.oneOf(['light', 'dark']),
// queryFormatDate: VueTypes.oneOf(VueTypes.object.keys(dateFormats)),
queryFormatSearch: VueTypes.oneOf(['and', 'or']),
queryFormatNumberBox: VueTypes.oneOf(['exact', 'lte', 'gte']),
params: VueTypes.object.isRequired,
props: VueTypes.object,
rangeLabelsAlign: VueTypes.oneOf(['left', 'right']),
title: VueTypes.oneOfType([VueTypes.string, VueTypes.any]),
tooltipTrigger: VueTypes.oneOf(['always', 'none', 'hover']),
location: VueTypes.shape({
lat: validateLocation,
lng: validateLocation,
}),
unit: VueTypes.oneOf([
'mi',
'miles',
'yd',
'yards',
'ft',
'feet',
'in',
'inch',
'km',
'kilometers',datakey: VueTypes.string,
trigger: VueTypes.oneOf(['hover', 'click', 'manual']).def('hover'),
startAngle: VueTypes.number.def(-1),
endAngle: VueTypes.number.def(-1),
radius: VueTypes.oneOfType([
VueTypes.number,
VueTypes.arrayOf(VueTypes.number).def([0, 100]),
]).def([0, 100]),
maxValue: VueTypes.number.def(-1), // Max value to limit curValues
// Styles
styles: VueTypes.object,
pathStyles: VueTypes.shape({
stroke: VueTypes.string,
}).loose,
color: VueTypes.string,
borderRadius: VueTypes.oneOfType([VueTypes.number, VueTypes.string]).def(0),
opacityDisabled: VueTypes.number.def(0.5),
// Animation
animation: VueTypes.bool.def(true),
animationDuration: VueTypes.number.def(2.5),
// index of item active
itemActive: VueTypes.oneOfType([Number, null]),
},
data () {
return {
activePath: null,
animatedSectors: [],
}
},
computed: {
// Active elem
active () {import sortBy from 'lodash.sortby'
// import activeMixin from '../mixins/active'
import themeMixin from '../mixins/theme'
import { random } from '../utils/maths'
import { generateUid, getOuterElementLayout } from './chartUtils'
export default {
mixins: [themeMixin],
props: {
id: VueTypes.oneOfType([VueTypes.string, VueTypes.number]).optional,
dataset: VueTypes.oneOfType([Array, Object]).def([]),
responsive: VueTypes.bool.def(false),
width: VueTypes.number.def(600),
height: VueTypes.number.def(400),
padding: VueTypes.oneOfType([
VueTypes.number,
VueTypes.arrayOf(VueTypes.number),
VueTypes.shape({
top: VueTypes.number,
right: VueTypes.number,
bottom: VueTypes.number,
left: VueTypes.number,
}),
]).def(0),
},
provide () {
return {
Chart: this,
}
},
data () {import VueTypes from 'vue-types';
// import dateFormats from './dateFormats';
VueTypes.sensibleDefaults = false;
const reactKeyType = VueTypes.oneOfType([
VueTypes.string,
VueTypes.arrayOf(VueTypes.string),
VueTypes.object,
VueTypes.arrayOf(VueTypes.object),
]);
function validateLocation(props, propName) {
// eslint-disable-next-line
if (isNaN(props[propName])) {
return new Error(`${propName} value must be a VueTypes.number`);
}
if (propName === 'lat' && (props[propName] < -90 || props[propName] > 90)) {
return new Error(`${propName} value should be between -90 and 90.`);
}
if (propName === 'lng' && (props[propName] < -180 || props[propName] > 180)) {
return new Error(`${propName} value should be between -180 and 180.`);}).isRequired,
date: VueTypes.oneOfType([VueTypes.string, VueTypes.arrayOf(VueTypes.string)]),
dateObject: VueTypes.object,
excludeFields: VueTypes.arrayOf(VueTypes.string),
fieldWeights: VueTypes.arrayOf(VueTypes.number),
filterLabel: VueTypes.string,
func: VueTypes.func,
funcRequired: VueTypes.func.isRequired,
fuzziness: VueTypes.oneOf([0, 1, 2, 'AUTO']),
headers: VueTypes.object,
hits: VueTypes.arrayOf(VueTypes.object),
iconPosition: VueTypes.oneOf(['left', 'right']),
includeFields: VueTypes.arrayOf(VueTypes.string),
labelPosition: VueTypes.oneOf(['left', 'right', 'top', 'bottom']),
number: VueTypes.number,
options: VueTypes.oneOfType([VueTypes.arrayOf(VueTypes.object), VueTypes.object]),
paginationAt: VueTypes.oneOf(['top', 'bottom', 'both']),
range: VueTypes.shape({
start: VueTypes.number.isRequired,
end: VueTypes.number.isRequired,
}),
rangeLabels: VueTypes.shape({
start: VueTypes.string.isRequired,
end: VueTypes.string.isRequired,
}),
react: VueTypes.shape({
and: reactKeyType,
or: reactKeyType,
not: reactKeyType,
}),
selectedValues: VueTypes.object,
selectedValue: VueTypes.oneOfType([
