devextreme-vue
Version:
DevExtreme UI and Visualization Components for Vue
293 lines (291 loc) • 9 kB
JavaScript
/*!
* devextreme-vue
* Version: 25.2.7
* Build date: Tue May 05 2026
*
* Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED
*
* This software may be modified and distributed under the terms
* of the MIT license. See the LICENSE file in the root of the project for details.
*
* https://github.com/DevExpress/DevExtreme
*/
import { defineComponent } from "vue";
import { prepareComponentConfig } from "./core/index";
import Sparkline from "devextreme/viz/sparkline";
import { prepareConfigurationComponentConfig } from "./core/index";
const componentConfig = {
props: {
argumentField: String,
barNegativeColor: String,
barPositiveColor: String,
dataSource: [Array, Object, String],
disabled: Boolean,
elementAttr: Object,
firstLastColor: String,
ignoreEmptyPoints: Boolean,
lineColor: String,
lineWidth: Number,
lossColor: String,
margin: Object,
maxColor: String,
maxValue: Number,
minColor: String,
minValue: Number,
onDisposing: Function,
onDrawn: Function,
onExported: Function,
onExporting: Function,
onFileSaving: Function,
onIncidentOccurred: Function,
onInitialized: Function,
onOptionChanged: Function,
onTooltipHidden: Function,
onTooltipShown: Function,
pathModified: Boolean,
pointColor: String,
pointSize: Number,
pointSymbol: String,
rtlEnabled: Boolean,
showFirstLast: Boolean,
showMinMax: Boolean,
size: Object,
theme: String,
tooltip: Object,
type: String,
valueField: String,
winColor: String,
winlossThreshold: Number
},
emits: {
"update:isActive": null,
"update:hoveredElement": null,
"update:argumentField": null,
"update:barNegativeColor": null,
"update:barPositiveColor": null,
"update:dataSource": null,
"update:disabled": null,
"update:elementAttr": null,
"update:firstLastColor": null,
"update:ignoreEmptyPoints": null,
"update:lineColor": null,
"update:lineWidth": null,
"update:lossColor": null,
"update:margin": null,
"update:maxColor": null,
"update:maxValue": null,
"update:minColor": null,
"update:minValue": null,
"update:onDisposing": null,
"update:onDrawn": null,
"update:onExported": null,
"update:onExporting": null,
"update:onFileSaving": null,
"update:onIncidentOccurred": null,
"update:onInitialized": null,
"update:onOptionChanged": null,
"update:onTooltipHidden": null,
"update:onTooltipShown": null,
"update:pathModified": null,
"update:pointColor": null,
"update:pointSize": null,
"update:pointSymbol": null,
"update:rtlEnabled": null,
"update:showFirstLast": null,
"update:showMinMax": null,
"update:size": null,
"update:theme": null,
"update:tooltip": null,
"update:type": null,
"update:valueField": null,
"update:winColor": null,
"update:winlossThreshold": null,
},
computed: {
instance() {
return this.$_instance;
}
},
beforeCreate() {
this.$_WidgetClass = Sparkline;
this.$_hasAsyncTemplate = true;
this.$_expectedChildren = {
margin: { isCollectionItem: false, optionName: "margin" },
size: { isCollectionItem: false, optionName: "size" },
tooltip: { isCollectionItem: false, optionName: "tooltip" }
};
}
};
prepareComponentConfig(componentConfig);
const DxSparkline = defineComponent(componentConfig);
const DxBorderConfig = {
emits: {
"update:isActive": null,
"update:hoveredElement": null,
"update:color": null,
"update:dashStyle": null,
"update:opacity": null,
"update:visible": null,
"update:width": null,
},
props: {
color: String,
dashStyle: String,
opacity: Number,
visible: Boolean,
width: Number
}
};
prepareConfigurationComponentConfig(DxBorderConfig);
const DxBorder = defineComponent(DxBorderConfig);
DxBorder.$_optionName = "border";
const DxFontConfig = {
emits: {
"update:isActive": null,
"update:hoveredElement": null,
"update:color": null,
"update:family": null,
"update:opacity": null,
"update:size": null,
"update:weight": null,
},
props: {
color: String,
family: String,
opacity: Number,
size: [Number, String],
weight: Number
}
};
prepareConfigurationComponentConfig(DxFontConfig);
const DxFont = defineComponent(DxFontConfig);
DxFont.$_optionName = "font";
const DxFormatConfig = {
emits: {
"update:isActive": null,
"update:hoveredElement": null,
"update:currency": null,
"update:formatter": null,
"update:parser": null,
"update:precision": null,
"update:type": null,
"update:useCurrencyAccountingStyle": null,
},
props: {
currency: String,
formatter: Function,
parser: Function,
precision: Number,
type: String,
useCurrencyAccountingStyle: Boolean
}
};
prepareConfigurationComponentConfig(DxFormatConfig);
const DxFormat = defineComponent(DxFormatConfig);
DxFormat.$_optionName = "format";
const DxMarginConfig = {
emits: {
"update:isActive": null,
"update:hoveredElement": null,
"update:bottom": null,
"update:left": null,
"update:right": null,
"update:top": null,
},
props: {
bottom: Number,
left: Number,
right: Number,
top: Number
}
};
prepareConfigurationComponentConfig(DxMarginConfig);
const DxMargin = defineComponent(DxMarginConfig);
DxMargin.$_optionName = "margin";
const DxShadowConfig = {
emits: {
"update:isActive": null,
"update:hoveredElement": null,
"update:blur": null,
"update:color": null,
"update:offsetX": null,
"update:offsetY": null,
"update:opacity": null,
},
props: {
blur: Number,
color: String,
offsetX: Number,
offsetY: Number,
opacity: Number
}
};
prepareConfigurationComponentConfig(DxShadowConfig);
const DxShadow = defineComponent(DxShadowConfig);
DxShadow.$_optionName = "shadow";
const DxSizeConfig = {
emits: {
"update:isActive": null,
"update:hoveredElement": null,
"update:height": null,
"update:width": null,
},
props: {
height: Number,
width: Number
}
};
prepareConfigurationComponentConfig(DxSizeConfig);
const DxSize = defineComponent(DxSizeConfig);
DxSize.$_optionName = "size";
const DxTooltipConfig = {
emits: {
"update:isActive": null,
"update:hoveredElement": null,
"update:arrowLength": null,
"update:border": null,
"update:color": null,
"update:container": null,
"update:contentTemplate": null,
"update:cornerRadius": null,
"update:customizeTooltip": null,
"update:enabled": null,
"update:font": null,
"update:format": null,
"update:interactive": null,
"update:opacity": null,
"update:paddingLeftRight": null,
"update:paddingTopBottom": null,
"update:shadow": null,
"update:zIndex": null,
},
props: {
arrowLength: Number,
border: Object,
color: String,
container: {},
contentTemplate: {},
cornerRadius: Number,
customizeTooltip: Function,
enabled: Boolean,
font: Object,
format: [Object, String, Function],
interactive: Boolean,
opacity: Number,
paddingLeftRight: Number,
paddingTopBottom: Number,
shadow: Object,
zIndex: Number
}
};
prepareConfigurationComponentConfig(DxTooltipConfig);
const DxTooltip = defineComponent(DxTooltipConfig);
DxTooltip.$_optionName = "tooltip";
DxTooltip.$_expectedChildren = {
border: { isCollectionItem: false, optionName: "border" },
font: { isCollectionItem: false, optionName: "font" },
format: { isCollectionItem: false, optionName: "format" },
shadow: { isCollectionItem: false, optionName: "shadow" }
};
export default DxSparkline;
export { DxSparkline, DxBorder, DxFont, DxFormat, DxMargin, DxShadow, DxSize, DxTooltip };