12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485 |
- import { defineComponent, createVNode as _createVNode } from "vue";
- import { addUnit, numericProp, unknownProp, createNamespace } from "../utils/index.mjs";
- import { useCustomFieldValue } from "@vant/use";
- import { Loading } from "../loading/index.mjs";
- const [name, bem] = createNamespace("switch");
- const switchProps = {
- size: numericProp,
- loading: Boolean,
- disabled: Boolean,
- modelValue: unknownProp,
- activeColor: String,
- inactiveColor: String,
- activeValue: {
- type: unknownProp,
- default: true
- },
- inactiveValue: {
- type: unknownProp,
- default: false
- }
- };
- var stdin_default = defineComponent({
- name,
- props: switchProps,
- emits: ["change", "update:modelValue"],
- setup(props, {
- emit,
- slots
- }) {
- const isChecked = () => props.modelValue === props.activeValue;
- const onClick = () => {
- if (!props.disabled && !props.loading) {
- const newValue = isChecked() ? props.inactiveValue : props.activeValue;
- emit("update:modelValue", newValue);
- emit("change", newValue);
- }
- };
- const renderLoading = () => {
- if (props.loading) {
- const color = isChecked() ? props.activeColor : props.inactiveColor;
- return _createVNode(Loading, {
- "class": bem("loading"),
- "color": color
- }, null);
- }
- if (slots.node) {
- return slots.node();
- }
- };
- useCustomFieldValue(() => props.modelValue);
- return () => {
- var _a;
- const {
- size,
- loading,
- disabled,
- activeColor,
- inactiveColor
- } = props;
- const checked = isChecked();
- const style = {
- fontSize: addUnit(size),
- backgroundColor: checked ? activeColor : inactiveColor
- };
- return _createVNode("div", {
- "role": "switch",
- "class": bem({
- on: checked,
- loading,
- disabled
- }),
- "style": style,
- "tabindex": disabled ? void 0 : 0,
- "aria-checked": checked,
- "onClick": onClick
- }, [_createVNode("div", {
- "class": bem("node")
- }, [renderLoading()]), (_a = slots.background) == null ? void 0 : _a.call(slots)]);
- };
- }
- });
- export {
- stdin_default as default,
- switchProps
- };
|