import useXComponentConfig from "../_utils/hooks/use-x-component-config.js";
import { useSenderContext } from "./context.js";
import { computed, createVNode, defineComponent, mergeProps, ref, useAttrs, watch } from "vue";
import { useConfig } from "antdv-next/config-provider/context";
import { Button } from "antdv-next";
//#region components/sender/SenderSwitch.tsx
var SenderSwitch_default = /* @__PURE__ */ defineComponent({
	name: "AxSenderSwitch",
	inheritAttrs: false,
	props: {
		prefixCls: {
			type: String,
			default: void 0
		},
		rootClass: {
			type: String,
			default: void 0
		},
		class: {
			type: String,
			default: void 0
		},
		style: {
			type: [
				String,
				Object,
				Array
			],
			default: void 0
		},
		checkedChildren: {
			type: [String, Object],
			default: void 0
		},
		unCheckedChildren: {
			type: [String, Object],
			default: void 0
		},
		value: {
			type: Boolean,
			default: void 0
		},
		defaultValue: {
			type: Boolean,
			default: false
		},
		icon: {
			type: Object,
			default: void 0
		},
		loading: {
			type: Boolean,
			default: false
		},
		disabled: {
			type: Boolean,
			default: false
		},
		onChange: {
			type: Function,
			default: void 0
		},
		classNames: {
			type: Object,
			default: () => ({})
		},
		styles: {
			type: Object,
			default: () => ({})
		}
	},
	setup(props, { expose, slots }) {
		const attrs = useAttrs();
		const configCtx = useConfig();
		const senderCtx = useSenderContext();
		const contextConfig = useXComponentConfig("sender");
		const prefixCls = computed(() => {
			const ctxPrefix = senderCtx.value.prefixCls;
			return configCtx.value.getPrefixCls?.("sender", props.prefixCls ?? ctxPrefix) ?? props.prefixCls ?? ctxPrefix ?? "antd-sender";
		});
		const switchCls = computed(() => `${prefixCls.value}-switch`);
		const direction = computed(() => configCtx.value.direction);
		const containerRef = ref();
		const innerChecked = ref(props.defaultValue);
		watch(() => props.value, (val) => {
			if (val !== void 0) innerChecked.value = val;
		}, { immediate: true });
		const mergedChecked = computed(() => props.value ?? innerChecked.value);
		expose({ get nativeElement() {
			return containerRef.value;
		} });
		return () => {
			const cls = switchCls.value;
			const iconNode = slots.icon?.() ?? props.icon;
			const checkedChildrenNode = slots.checkedChildren?.() ?? props.checkedChildren;
			const unCheckedChildrenNode = slots.unCheckedChildren?.() ?? props.unCheckedChildren;
			return createVNode("div", mergeProps({
				"ref": containerRef,
				"class": [
					prefixCls.value,
					cls,
					props.class,
					props.rootClass,
					contextConfig.value.classes?.switch,
					senderCtx.value.classNames?.switch,
					props.classNames.root,
					{
						[`${cls}-checked`]: mergedChecked.value,
						[`${cls}-rtl`]: direction.value === "rtl"
					}
				],
				"style": [
					props.style,
					contextConfig.value.styles?.switch,
					senderCtx.value.styles?.switch,
					props.styles.root
				]
			}, attrs), [createVNode(Button, mergeProps({
				"disabled": props.disabled,
				"loading": props.loading,
				"class": [`${cls}-content`, props.classNames.content],
				"style": props.styles.content
			}, {
				classes: {
					icon: props.classNames.icon,
					content: props.classNames.title
				},
				styles: {
					icon: props.styles.icon,
					content: props.styles.title
				}
			}, {
				"variant": "outlined",
				"color": mergedChecked.value ? "primary" : "default",
				"icon": iconNode,
				"onClick": () => {
					const newValue = !mergedChecked.value;
					innerChecked.value = newValue;
					props.onChange?.(newValue);
				}
			}), { default: () => [mergedChecked.value ? checkedChildrenNode : unCheckedChildrenNode, slots.default?.()] })]);
		};
	}
});
//#endregion
export { SenderSwitch_default as default };
