VLEX/BPM-UI/node_modules/devextreme/ui/radio_group/radio_group.js

/**
 * DevExtreme (ui/radio_group/radio_group.js)
 * Version: 19.1.16
 * Build date: Tue Oct 18 2022
 *
 * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
 * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
 */
"use strict";

function _typeof(obj) {
    "@babel/helpers - typeof";
    return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj) {
        return typeof obj
    } : function(obj) {
        return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj
    }, _typeof(obj)
}
var _renderer = require("../../core/renderer");
var _renderer2 = _interopRequireDefault(_renderer);
var _extend = require("../../core/utils/extend");
var _devices = require("../../core/devices");
var _devices2 = _interopRequireDefault(_devices);
var _common = require("../../core/utils/common");
var _type = require("../../core/utils/type");
var _utils = require("../widget/utils.ink_ripple");
var _utils2 = _interopRequireDefault(_utils);
var _component_registrator = require("../../core/component_registrator");
var _component_registrator2 = _interopRequireDefault(_component_registrator);
var _uiCollection_widget = require("../collection/ui.collection_widget.edit");
var _uiCollection_widget2 = _interopRequireDefault(_uiCollection_widget);
var _ui = require("../editor/ui.data_expression");
var _ui2 = _interopRequireDefault(_ui);
var _editor = require("../editor/editor");
var _editor2 = _interopRequireDefault(_editor);
var _deferred = require("../../core/utils/deferred");

function _interopRequireDefault(obj) {
    return obj && obj.__esModule ? obj : {
        "default": obj
    }
}

function _classCallCheck(instance, Constructor) {
    if (!(instance instanceof Constructor)) {
        throw new TypeError("Cannot call a class as a function")
    }
}

function _defineProperties(target, props) {
    for (var i = 0; i < props.length; i++) {
        var descriptor = props[i];
        descriptor.enumerable = descriptor.enumerable || false;
        descriptor.configurable = true;
        if ("value" in descriptor) {
            descriptor.writable = true
        }
        Object.defineProperty(target, descriptor.key, descriptor)
    }
}

function _createClass(Constructor, protoProps, staticProps) {
    if (protoProps) {
        _defineProperties(Constructor.prototype, protoProps)
    }
    if (staticProps) {
        _defineProperties(Constructor, staticProps)
    }
    Object.defineProperty(Constructor, "prototype", {
        writable: false
    });
    return Constructor
}

function _get() {
    if ("undefined" !== typeof Reflect && Reflect.get) {
        _get = Reflect.get.bind()
    } else {
        _get = function(target, property, receiver) {
            var base = _superPropBase(target, property);
            if (!base) {
                return
            }
            var desc = Object.getOwnPropertyDescriptor(base, property);
            if (desc.get) {
                return desc.get.call(arguments.length < 3 ? target : receiver)
            }
            return desc.value
        }
    }
    return _get.apply(this, arguments)
}

function _superPropBase(object, property) {
    while (!Object.prototype.hasOwnProperty.call(object, property)) {
        object = _getPrototypeOf(object);
        if (null === object) {
            break
        }
    }
    return object
}

function _inherits(subClass, superClass) {
    if ("function" !== typeof superClass && null !== superClass) {
        throw new TypeError("Super expression must either be null or a function")
    }
    subClass.prototype = Object.create(superClass && superClass.prototype, {
        constructor: {
            value: subClass,
            writable: true,
            configurable: true
        }
    });
    Object.defineProperty(subClass, "prototype", {
        writable: false
    });
    if (superClass) {
        _setPrototypeOf(subClass, superClass)
    }
}

function _setPrototypeOf(o, p) {
    _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(o, p) {
        o.__proto__ = p;
        return o
    };
    return _setPrototypeOf(o, p)
}

function _createSuper(Derived) {
    var hasNativeReflectConstruct = _isNativeReflectConstruct();
    return function() {
        var result, Super = _getPrototypeOf(Derived);
        if (hasNativeReflectConstruct) {
            var NewTarget = _getPrototypeOf(this).constructor;
            result = Reflect.construct(Super, arguments, NewTarget)
        } else {
            result = Super.apply(this, arguments)
        }
        return _possibleConstructorReturn(this, result)
    }
}

function _possibleConstructorReturn(self, call) {
    if (call && ("object" === _typeof(call) || "function" === typeof call)) {
        return call
    } else {
        if (void 0 !== call) {
            throw new TypeError("Derived constructors may only return object or undefined")
        }
    }
    return _assertThisInitialized(self)
}

function _assertThisInitialized(self) {
    if (void 0 === self) {
        throw new ReferenceError("this hasn't been initialised - super() hasn't been called")
    }
    return self
}

function _isNativeReflectConstruct() {
    if ("undefined" === typeof Reflect || !Reflect.construct) {
        return false
    }
    if (Reflect.construct.sham) {
        return false
    }
    if ("function" === typeof Proxy) {
        return true
    }
    try {
        Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {}));
        return true
    } catch (e) {
        return false
    }
}

function _getPrototypeOf(o) {
    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(o) {
        return o.__proto__ || Object.getPrototypeOf(o)
    };
    return _getPrototypeOf(o)
}
var RADIO_BUTTON_CHECKED_CLASS = "dx-radiobutton-checked";
var RADIO_BUTTON_CLASS = "dx-radiobutton";
var RADIO_BUTTON_ICON_CHECKED_CLASS = "dx-radiobutton-icon-checked";
var RADIO_BUTTON_ICON_CLASS = "dx-radiobutton-icon";
var RADIO_BUTTON_ICON_DOT_CLASS = "dx-radiobutton-icon-dot";
var RADIO_GROUP_HORIZONTAL_CLASS = "dx-radiogroup-horizontal";
var RADIO_GROUP_VERTICAL_CLASS = "dx-radiogroup-vertical";
var RADIO_VALUE_CONTAINER_CLASS = "dx-radio-value-container";
var RADIO_GROUP_CLASS = "dx-radiogroup";
var RADIO_FEEDBACK_HIDE_TIMEOUT = 100;
var RadioCollection = function(_CollectionWidget) {
    _inherits(RadioCollection, _CollectionWidget);
    var _super = _createSuper(RadioCollection);

    function RadioCollection() {
        _classCallCheck(this, RadioCollection);
        return _super.apply(this, arguments)
    }
    _createClass(RadioCollection, [{
        key: "_focusTarget",
        value: function() {
            return this.$element().parent()
        }
    }, {
        key: "_nullValueSelectionSupported",
        value: function() {
            return true
        }
    }, {
        key: "_getDefaultOptions",
        value: function() {
            var defaultOptions = _get(_getPrototypeOf(RadioCollection.prototype), "_getDefaultOptions", this).call(this);
            return (0, _extend.extend)(defaultOptions, _ui2.default._dataExpressionDefaultOptions(), {
                _itemAttributes: {
                    role: "radio"
                }
            })
        }
    }, {
        key: "_initMarkup",
        value: function() {
            var _this = this;
            _get(_getPrototypeOf(RadioCollection.prototype), "_initMarkup", this).call(this);
            (0, _common.deferRender)(function() {
                _this.itemElements().addClass(RADIO_BUTTON_CLASS)
            })
        }
    }, {
        key: "_keyboardEventBindingTarget",
        value: function() {
            return this._focusTarget()
        }
    }, {
        key: "_postprocessRenderItem",
        value: function(args) {
            var html = args.itemData.html,
                itemElement = args.itemElement;
            if (!html) {
                var $radio = (0, _renderer2.default)("<div>").addClass(RADIO_BUTTON_ICON_CLASS);
                (0, _renderer2.default)("<div>").addClass(RADIO_BUTTON_ICON_DOT_CLASS).appendTo($radio);
                var $radioContainer = (0, _renderer2.default)("<div>").append($radio).addClass(RADIO_VALUE_CONTAINER_CLASS);
                (0, _renderer2.default)(itemElement).prepend($radioContainer)
            }
            _get(_getPrototypeOf(RadioCollection.prototype), "_postprocessRenderItem", this).call(this, args)
        }
    }, {
        key: "_processSelectableItem",
        value: function($itemElement, isSelected) {
            _get(_getPrototypeOf(RadioCollection.prototype), "_processSelectableItem", this).call(this, $itemElement, isSelected);
            $itemElement.toggleClass(RADIO_BUTTON_CHECKED_CLASS, isSelected).find(".".concat(RADIO_BUTTON_ICON_CLASS)).first().toggleClass(RADIO_BUTTON_ICON_CHECKED_CLASS, isSelected);
            this.setAria("checked", isSelected, $itemElement)
        }
    }, {
        key: "_refreshContent",
        value: function() {
            this._prepareContent();
            this._renderContent()
        }
    }, {
        key: "_supportedKeys",
        value: function() {
            var parent = _get(_getPrototypeOf(RadioCollection.prototype), "_supportedKeys", this).call(this);
            return (0, _extend.extend)({}, parent, {
                enter: function(e) {
                    e.preventDefault();
                    return parent.enter.apply(this, arguments)
                },
                space: function(e) {
                    e.preventDefault();
                    return parent.space.apply(this, arguments)
                }
            })
        }
    }, {
        key: "_itemElements",
        value: function() {
            return this._itemContainer().children(this._itemSelector())
        }
    }]);
    return RadioCollection
}(_uiCollection_widget2.default);
var RadioGroup = function(_Editor) {
    _inherits(RadioGroup, _Editor);
    var _super2 = _createSuper(RadioGroup);

    function RadioGroup() {
        _classCallCheck(this, RadioGroup);
        return _super2.apply(this, arguments)
    }
    _createClass(RadioGroup, [{
        key: "_clean",
        value: function() {
            delete this._inkRipple;
            _get(_getPrototypeOf(RadioGroup.prototype), "_clean", this).call(this)
        }
    }, {
        key: "_dataSourceOptions",
        value: function() {
            return {
                paginate: false
            }
        }
    }, {
        key: "_defaultOptionsRules",
        value: function() {
            var defaultOptionsRules = _get(_getPrototypeOf(RadioGroup.prototype), "_defaultOptionsRules", this).call(this);
            return defaultOptionsRules.concat([{
                device: {
                    tablet: true
                },
                options: {
                    layout: "horizontal"
                }
            }, {
                device: function() {
                    return "desktop" === _devices2.default.real().deviceType && !_devices2.default.isSimulator()
                },
                options: {
                    focusStateEnabled: true
                }
            }])
        }
    }, {
        key: "_fireContentReadyAction",
        value: function(force) {
            force && _get(_getPrototypeOf(RadioGroup.prototype), "_fireContentReadyAction", this).call(this)
        }
    }, {
        key: "_focusTarget",
        value: function() {
            return this.$element()
        }
    }, {
        key: "_getAriaTarget",
        value: function() {
            return this.$element()
        }
    }, {
        key: "_getDefaultOptions",
        value: function() {
            var defaultOptions = _get(_getPrototypeOf(RadioGroup.prototype), "_getDefaultOptions", this).call(this);
            return (0, _extend.extend)(defaultOptions, (0, _extend.extend)(_ui2.default._dataExpressionDefaultOptions(), {
                hoverStateEnabled: true,
                activeStateEnabled: true,
                layout: "vertical",
                useInkRipple: false
            }))
        }
    }, {
        key: "_getItemValue",
        value: function(item) {
            return this._valueGetter ? this._valueGetter(item) : item.text
        }
    }, {
        key: "_getSubmitElement",
        value: function() {
            return this._$submitElement
        }
    }, {
        key: "_init",
        value: function() {
            _get(_getPrototypeOf(RadioGroup.prototype), "_init", this).call(this);
            this._activeStateUnit = ".".concat(RADIO_BUTTON_CLASS);
            this._feedbackHideTimeout = RADIO_FEEDBACK_HIDE_TIMEOUT;
            this._initDataExpressions()
        }
    }, {
        key: "_initMarkup",
        value: function() {
            this.$element().addClass(RADIO_GROUP_CLASS);
            this._renderSubmitElement();
            this.setAria("role", "radiogroup");
            this._renderRadios();
            this.option("useInkRipple") && this._renderInkRipple();
            this._renderLayout();
            _get(_getPrototypeOf(RadioGroup.prototype), "_initMarkup", this).call(this)
        }
    }, {
        key: "_itemClickHandler",
        value: function(_ref) {
            var itemElement = _ref.itemElement,
                event = _ref.event,
                itemData = _ref.itemData;
            if (this.itemElements().is(itemElement)) {
                var newValue = this._getItemValue(itemData);
                if (newValue !== this.option("value")) {
                    this._saveValueChangeEvent(event);
                    this.option("value", newValue)
                }
            }
        }
    }, {
        key: "_optionChanged",
        value: function(args) {
            var name = args.name,
                value = args.value;
            this._dataExpressionOptionChanged(args);
            switch (name) {
                case "useInkRipple":
                    this._invalidate();
                    break;
                case "focusStateEnabled":
                case "accessKey":
                case "tabIndex":
                    this._setCollectionWidgetOption(name, value);
                    break;
                case "disabled":
                    _get(_getPrototypeOf(RadioGroup.prototype), "_optionChanged", this).call(this, args);
                    this._setCollectionWidgetOption(name, value);
                    break;
                case "dataSource":
                    this._setCollectionWidgetOption("dataSource", this._dataSource);
                    break;
                case "valueExpr":
                    this._setCollectionWidgetOption("keyExpr", this._getCollectionKeyExpr());
                    break;
                case "value":
                    this._setCollectionWidgetOption("selectedItemKeys", [value]);
                    this._setSubmitValue(value);
                    _get(_getPrototypeOf(RadioGroup.prototype), "_optionChanged", this).call(this, args);
                    break;
                case "items":
                case "itemTemplate":
                case "displayExpr":
                    break;
                case "layout":
                    this._renderLayout();
                    this._updateItemsSize();
                    break;
                default:
                    _get(_getPrototypeOf(RadioGroup.prototype), "_optionChanged", this).call(this, args)
            }
        }
    }, {
        key: "_render",
        value: function() {
            _get(_getPrototypeOf(RadioGroup.prototype), "_render", this).call(this);
            this._updateItemsSize()
        }
    }, {
        key: "_renderInkRipple",
        value: function() {
            this._inkRipple = _utils2.default.render({
                waveSizeCoefficient: 3.3,
                useHoldAnimation: false,
                isCentered: true
            })
        }
    }, {
        key: "_renderLayout",
        value: function() {
            var layout = this.option("layout");
            var $element = this.$element();
            $element.toggleClass(RADIO_GROUP_VERTICAL_CLASS, "vertical" === layout);
            $element.toggleClass(RADIO_GROUP_HORIZONTAL_CLASS, "horizontal" === layout)
        }
    }, {
        key: "_renderRadios",
        value: function() {
            var _this2 = this;
            this._areRadiosCreated = new _deferred.Deferred;
            var $radios = (0, _renderer2.default)("<div>").appendTo(this.$element());
            var _this$option = this.option(),
                value = _this$option.value,
                displayExpr = _this$option.displayExpr,
                accessKey = _this$option.accessKey,
                focusStateEnabled = _this$option.focusStateEnabled,
                itemTemplate = _this$option.itemTemplate,
                tabIndex = _this$option.tabIndex,
                valueExpr = _this$option.valueExpr;
            var isNullSelectable = "this" !== valueExpr;
            this._radios = this._createComponent($radios, RadioCollection, {
                displayExpr: displayExpr,
                accessKey: accessKey,
                dataSource: this._dataSource,
                focusStateEnabled: focusStateEnabled,
                itemTemplate: itemTemplate,
                keyExpr: this._getCollectionKeyExpr(),
                noDataText: "",
                onContentReady: function() {
                    return _this2._fireContentReadyAction(true)
                },
                onItemClick: this._itemClickHandler.bind(this),
                scrollingEnabled: false,
                selectionByClick: false,
                selectionMode: "single",
                selectedItemKeys: isNullSelectable || (0, _type.isDefined)(value) ? [value] : [],
                tabIndex: tabIndex
            });
            this._areRadiosCreated.resolve()
        }
    }, {
        key: "_renderSubmitElement",
        value: function() {
            this._$submitElement = (0, _renderer2.default)("<input>").attr("type", "hidden").appendTo(this.$element());
            this._setSubmitValue()
        }
    }, {
        key: "_setOptionsByReference",
        value: function() {
            _get(_getPrototypeOf(RadioGroup.prototype), "_setOptionsByReference", this).call(this);
            (0, _extend.extend)(this._optionsByReference, {
                value: true
            })
        }
    }, {
        key: "_setSubmitValue",
        value: function(value) {
            value = value || this.option("value");
            var submitValue = "this" === this.option("valueExpr") ? this._displayGetter(value) : value;
            this._$submitElement.val(submitValue)
        }
    }, {
        key: "_setCollectionWidgetOption",
        value: function() {
            this._areRadiosCreated.done(this._setWidgetOption.bind(this, "_radios", arguments))
        }
    }, {
        key: "_toggleActiveState",
        value: function($element, value, e) {
            _get(_getPrototypeOf(RadioGroup.prototype), "_toggleActiveState", this).call(this, $element, value, e);
            if (this._inkRipple) {
                var event = {
                    element: $element.find(".".concat(RADIO_BUTTON_ICON_CLASS)),
                    event: e
                };
                value ? this._inkRipple.showWave(event) : this._inkRipple.hideWave(event)
            }
        }
    }, {
        key: "_updateItemsSize",
        value: function() {
            if ("horizontal" === this.option("layout")) {
                this.itemElements().css("height", "auto")
            } else {
                var itemsCount = this.option("items").length;
                this.itemElements().css("height", 100 / itemsCount + "%")
            }
        }
    }, {
        key: "focus",
        value: function() {
            this._radios && this._radios.focus()
        }
    }, {
        key: "itemElements",
        value: function() {
            return this._radios.itemElements()
        }
    }]);
    return RadioGroup
}(_editor2.default);
RadioGroup.include(_ui2.default);
(0, _component_registrator2.default)("dxRadioGroup", RadioGroup);
module.exports = RadioGroup;