xdesign-vue-next/cjs/radio/radio.js

XDesign Component for vue-next

/**
 * xdesign v1.0.6
 * (c) 2023 xdesign
 * @license MIT
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var vue = require('vue');
var hooks_useConfig = require('../hooks/useConfig.js');
var utils_helper = require('../utils/helper.js');
var radio_props = require('./props.js');
var radio_constants = require('./constants.js');
var form_hooks = require('../form/hooks.js');
var hooks_useVModel = require('../hooks/useVModel.js');
var hooks_tnode = require('../hooks/tnode.js');
var isUndefined = require('lodash/isUndefined');
var isString = require('lodash/isString');
require('../config-provider/useConfig.js');
require('lodash/isFunction');
require('lodash/cloneDeep');
require('../config-provider/context.js');
require('lodash/mergeWith');
require('lodash/merge');
require('../_common/js/global-config/default-config.js');
require('../_common/js/global-config/locale/en_US.js');
require('../_chunks/dep-8d10b59f.js');
require('lodash/isArray');
require('@babel/runtime/helpers/objectWithoutProperties');
require('lodash/camelCase');
require('lodash/isNull');
require('lodash/isNumber');
require('lodash/kebabCase');
require('../utils/render-tnode.js');
require('lodash/isEmpty');
require('lodash/isObject');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
var isUndefined__default = /*#__PURE__*/_interopDefaultLegacy(isUndefined);
var isString__default = /*#__PURE__*/_interopDefaultLegacy(isString);

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function getValidAttrs(obj) {
  var newObj = {};
  Object.keys(obj).forEach(function (key) {
    if (!isUndefined__default["default"](obj[key])) {
      newObj[key] = obj[key];
    }
  });
  return newObj;
}
var _Radio = vue.defineComponent({
  name: "XRadio",
  inheritAttrs: false,
  props: _objectSpread({}, radio_props["default"]),
  setup: function setup(props2, _ref) {
    var attrs = _ref.attrs;
    var inputRef = vue.ref();
    var _toRefs = vue.toRefs(props2),
      checked = _toRefs.checked,
      modelValue = _toRefs.modelValue;
    var _useVModel = hooks_useVModel["default"](checked, modelValue, props2.defaultChecked, props2.onChange, "checked"),
      _useVModel2 = _slicedToArray__default["default"](_useVModel, 2),
      innerChecked = _useVModel2[0],
      setInnerChecked = _useVModel2[1];
    var radioChecked = vue.computed(function () {
      return radioGroup ? props2.value === radioGroup.value : innerChecked.value;
    });
    var radioGroup = vue.inject(radio_constants.RadioGroupInjectionKey, void 0);
    var allowUncheck = vue.computed(function () {
      return Boolean(props2.allowUncheck || (radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.allowUncheck));
    });
    var handleClick = function handleClick(e) {
      e.stopPropagation();
    };
    var onLabelClick = function onLabelClick(e) {
      var _props2$onClick;
      if (disabled.value) return;
      (_props2$onClick = props2.onClick) === null || _props2$onClick === void 0 ? void 0 : _props2$onClick.call(props2, {
        e: e
      });
      if (radioGroup) {
        var value = radioChecked.value && allowUncheck.value ? void 0 : props2.value;
        radioGroup.setValue(value, {
          e: e
        });
      } else {
        var _value = allowUncheck.value ? !radioChecked.value : true;
        setInnerChecked(_value, {
          e: e
        });
      }
    };
    var inputEvents = vue.computed(function () {
      return getValidAttrs({
        focus: attrs.onFocus,
        blur: attrs.onBlur,
        keydown: attrs.onKeydown,
        keyup: attrs.onKeyup,
        keypresss: attrs.onKeypresss
      });
    });
    var wrapperAttrs = vue.computed(function () {
      var events = [].concat(_toConsumableArray__default["default"](Object.keys(inputEvents.value)), ["input", "change"]).map(function (str) {
        return "on".concat(str[0].toUpperCase()).concat(str.slice(1));
      });
      return utils_helper.omit(attrs, events);
    });
    var groupDisabled = vue.computed(function () {
      return radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.disabled;
    });
    var disabled = form_hooks.useFormDisabled(groupDisabled);
    var inputProps = vue.computed(function () {
      return {
        name: radioGroup ? radioGroup.name : props2.name,
        checked: radioChecked.value,
        disabled: disabled.value,
        value: props2.value
      };
    });
    var _useCommonClassName = hooks_useConfig.useCommonClassName(),
      STATUS = _useCommonClassName.STATUS;
    var radioButton = vue.inject(radio_constants.RadioButtonInjectionKey, void 0);
    var radioBtnName = hooks_useConfig.usePrefixClass("radio-button");
    var COMPONENT_NAME = hooks_useConfig.usePrefixClass("radio");
    var prefixCls = vue.computed(function () {
      return radioButton ? radioBtnName.value : COMPONENT_NAME.value;
    });
    var inputClass = vue.computed(function () {
      var _ref2;
      return ["".concat(prefixCls.value), (_ref2 = {}, _defineProperty__default["default"](_ref2, STATUS.value.checked, inputProps.value.checked), _defineProperty__default["default"](_ref2, STATUS.value.disabled, inputProps.value.disabled), _ref2)];
    });
    var renderContent = hooks_tnode.useContent();
    return function () {
      return vue.createVNode("label", vue.mergeProps({
        "ref": inputRef,
        "class": inputClass.value
      }, wrapperAttrs.value, {
        "tabindex": disabled.value ? void 0 : "0",
        "onClick": onLabelClick
      }), [vue.createVNode("input", vue.mergeProps({
        "type": "radio",
        "class": "".concat(prefixCls.value, "__former")
      }, inputEvents.value, inputProps.value, {
        "onClick": handleClick,
        "tabindex": "-1",
        "data-value": isString__default["default"](props2.value) ? "'".concat(props2.value, "'") : props2.value,
        "data-allow-uncheck": allowUncheck.value || void 0
      }), null), vue.createVNode("span", {
        "class": "".concat(prefixCls.value, "__input")
      }, null), vue.createVNode("span", {
        "class": "".concat(prefixCls.value, "__label")
      }, [renderContent("default", "label")])]);
    };
  }
});

exports["default"] = _Radio;
//# sourceMappingURL=radio.js.map