@ohu-mobile/core
Version:
137 lines (136 loc) • 6.4 kB
JavaScript
;
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.switchBaseProps = exports.switchBaseOutsideProps = exports.default = void 0;
var _CheckboxIndeterminateFilled2 = _interopRequireDefault(require("@ohu-mobile/icons/lib/CheckboxIndeterminateFilled"));
var _CheckboxBlankOutlined2 = _interopRequireDefault(require("@ohu-mobile/icons/lib/CheckboxBlankOutlined"));
var _CheckboxFilled2 = _interopRequireDefault(require("@ohu-mobile/icons/lib/CheckboxFilled"));
var _defineComponent = require("../../_utils/defineComponent");
var _variables = require("../../_config/variables");
var _iconUtils = require("../../_utils/icon-utils");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var switchBaseProps = exports.switchBaseProps = {
name: String,
value: _defineComponent.props.ofType().optional,
defaultChecked: (0, _defineComponent.props)(Boolean).default(false),
checked: (0, _defineComponent.props)(Boolean).optional,
disabled: (0, _defineComponent.props)(Boolean).optional,
labelClickable: (0, _defineComponent.props)(Boolean).default(true),
color: (0, _defineComponent.props)(String).default(_variables.$checkboxActiveColor),
unCheckedColor: (0, _defineComponent.props)(String).default(_variables.$checkboxColor),
checkedIcon: _defineComponent.props.ofType().default(function () {
return _CheckboxFilled2.default;
}),
unCheckedIcon: _defineComponent.props.ofType().default(function () {
return _CheckboxBlankOutlined2.default;
}),
indeterminate: (0, _defineComponent.props)(Boolean).default(false),
indeterminateIcon: _defineComponent.props.ofType().default(function () {
return _CheckboxIndeterminateFilled2.default;
}),
attach: _defineComponent.props.ofAny().optional
};
var switchBaseOutsideProps = exports.switchBaseOutsideProps = _objectSpread({
baseName: (0, _defineComponent.props)(String).default(''),
role: _defineComponent.props.ofStringLiterals('radio', 'checkbox').default('checkbox')
}, switchBaseProps);
var _default = exports.default = (0, _defineComponent.defineComponent)('switch-base').create({
props: switchBaseOutsideProps,
computed: {
tabIndex: function tabIndex() {
if (this.disabled) {
return -1;
}
return 0;
}
},
data: function data() {
return {
isFocused: false
};
},
methods: {
handleInputChange: function handleInputChange(e) {
if (e.target.checked !== undefined) {
this.$emit('change', e.target.checked, e);
}
},
handleBlur: function handleBlur(e) {
this.isFocused = false;
this.$emit('blur', e);
},
handleFocus: function handleFocus(e) {
this.isFocused = true;
this.$emit('focus', e);
}
},
render: function render(h) {
var $slots = this.$slots,
$scopedSlots = this.$scopedSlots,
baseName = this.baseName,
checked = this.checked,
value = this.value,
name = this.name,
role = this.role,
disabled = this.disabled,
labelClickable = this.labelClickable,
indeterminate = this.indeterminate,
indeterminateIcon = this.indeterminateIcon,
checkedIcon = this.checkedIcon,
unCheckedIcon = this.unCheckedIcon,
color = this.color,
unCheckedColor = this.unCheckedColor;
var root = this.$bem.block(baseName);
root.is([this.isFocused && 'focus']);
var wrapper = root.block('wrapper');
wrapper.is([checked && 'checked', disabled === true && 'disabled']);
var iconNode = h('i');
var iconType = indeterminate ? indeterminateIcon : checked ? checkedIcon : unCheckedIcon;
if (iconType) {
iconNode = (0, _iconUtils.getIcon)(h, iconType, {
color: indeterminate || checked ? color : unCheckedColor
});
}
var input = h("span", {
"class": root
}, [h("input", {
"attrs": {
"type": role,
"aria-checked": checked,
"name": name,
"disabled": disabled,
"data-indeterminate": indeterminate
},
"domProps": {
"value": value,
"checked": checked
},
"on": {
"change": this.handleInputChange,
"blur": this.handleBlur,
"focus": this.handleFocus
}
}), iconNode]);
var label = $scopedSlots.label ? $scopedSlots.label({
checked: checked,
indeterminate: indeterminate,
disabled: disabled,
focus: this.isFocused
}) : $slots.default && h("span", {
"class": root.element('label')
}, [$slots.default]);
return h(!labelClickable ? 'div' : 'label', {
class: wrapper,
attrs: {
tabindex: this.tabIndex
}
}, [input, label]);
}
});