devextreme-vue/tag-box.js

DevExtreme Vue UI and Visualization Components

/*!
 * devextreme-vue
 * Version: 19.2.6
 * Build date: Thu Jan 30 2020
 *
 * Copyright (c) 2012 - 2020 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-vue
 */

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var VueType = require("vue");
var Vue = VueType.default || VueType;
var tag_box_1 = require("devextreme/ui/tag_box");
var component_1 = require("./core/component");
var configuration_component_1 = require("./core/configuration-component");
var DxTagBox = Vue.extend({
    extends: component_1.DxComponent,
    props: {
        acceptCustomValue: Boolean,
        accessKey: String,
        activeStateEnabled: Boolean,
        applyValueMode: String,
        buttons: Array,
        dataSource: [Array, Object, String],
        deferRendering: Boolean,
        disabled: Boolean,
        displayExpr: [Function, String],
        dropDownButtonTemplate: {},
        elementAttr: Object,
        fieldTemplate: {},
        focusStateEnabled: Boolean,
        grouped: Boolean,
        groupTemplate: {},
        height: [Function, Number, String],
        hideSelectedItems: Boolean,
        hint: String,
        hoverStateEnabled: Boolean,
        inputAttr: Object,
        isValid: Boolean,
        items: Array,
        itemTemplate: {},
        maxDisplayedTags: Number,
        maxLength: [Number, String],
        minSearchLength: Number,
        multiline: Boolean,
        name: String,
        noDataText: String,
        onChange: Function,
        onClosed: Function,
        onContentReady: Function,
        onCustomItemCreating: Function,
        onDisposing: Function,
        onEnterKey: Function,
        onFocusIn: Function,
        onFocusOut: Function,
        onInitialized: Function,
        onInput: Function,
        onItemClick: Function,
        onKeyDown: Function,
        onKeyPress: Function,
        onKeyUp: Function,
        onMultiTagPreparing: Function,
        onOpened: Function,
        onOptionChanged: Function,
        onSelectAllValueChanged: Function,
        onSelectionChanged: Function,
        onValueChanged: Function,
        opened: Boolean,
        openOnFieldClick: Boolean,
        placeholder: String,
        readOnly: Boolean,
        rtlEnabled: Boolean,
        searchEnabled: Boolean,
        searchExpr: [Array, Function, String],
        searchMode: String,
        searchTimeout: Number,
        selectAllMode: String,
        selectedItems: Array,
        showClearButton: Boolean,
        showDataBeforeSearch: Boolean,
        showDropDownButton: Boolean,
        showMultiTagOnly: Boolean,
        showSelectionControls: Boolean,
        stylingMode: String,
        tabIndex: Number,
        tagTemplate: {},
        text: String,
        validationError: Object,
        validationErrors: Array,
        validationMessageMode: String,
        validationStatus: String,
        value: Array,
        valueExpr: [Function, String],
        visible: Boolean,
        width: [Function, Number, String],
        wrapItemText: Boolean
    },
    model: { prop: "value", event: "update:value" },
    computed: {
        instance: function () {
            return this.$_instance;
        }
    },
    beforeCreate: function () {
        this.$_WidgetClass = tag_box_1.default;
        this.$_expectedChildren = {
            button: { isCollectionItem: true, optionName: "buttons" },
            item: { isCollectionItem: true, optionName: "items" }
        };
    }
});
exports.DxTagBox = DxTagBox;
var DxButton = Vue.extend({
    extends: configuration_component_1.DxConfiguration,
    props: {
        location: String,
        name: String,
        options: Object
    }
});
exports.DxButton = DxButton;
DxButton.$_optionName = "buttons";
DxButton.$_isCollectionItem = true;
DxButton.$_expectedChildren = {
    options: { isCollectionItem: false, optionName: "options" }
};
var DxItem = Vue.extend({
    extends: configuration_component_1.DxConfiguration,
    props: {
        disabled: Boolean,
        html: String,
        template: {},
        text: String,
        visible: Boolean
    }
});
exports.DxItem = DxItem;
DxItem.$_optionName = "items";
DxItem.$_isCollectionItem = true;
var DxOptions = Vue.extend({
    extends: configuration_component_1.DxConfiguration,
    props: {
        accessKey: String,
        activeStateEnabled: Boolean,
        bindingOptions: Object,
        disabled: Boolean,
        elementAttr: Object,
        focusStateEnabled: Boolean,
        height: [Function, Number, String],
        hint: String,
        hoverStateEnabled: Boolean,
        icon: String,
        onClick: Function,
        onContentReady: Function,
        onDisposing: Function,
        onFocusIn: Function,
        onFocusOut: Function,
        onInitialized: Function,
        onOptionChanged: Function,
        rtlEnabled: Boolean,
        stylingMode: String,
        tabIndex: Number,
        template: {},
        text: String,
        type: String,
        useSubmitBehavior: Boolean,
        validationGroup: String,
        visible: Boolean,
        width: [Function, Number, String]
    }
});
exports.DxOptions = DxOptions;
DxOptions.$_optionName = "options";
exports.default = DxTagBox;