var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
import { defineComponent, ref, computed } from 'vue';
import buttonProps from './validator';
const button = defineComponent({
    name: 'Button',
    props: buttonProps,
    setup(props, { slots }) {
        const waveState = ref(false);
        const timeout = ref(null);
        const onClick = () => __awaiter(this, void 0, void 0, function* () {
            var _a;
            if (props.disabled) {
                return;
            }
            //todo, more effective way
            (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props);
            waveState.value = true;
            setTimeout(() => {
                waveState.value = false;
            }, 300);
        });
        return {
            waveState,
            onClick,
            activeName: computed(() => props.type && 'u-button-wave-' + props.type),
            isDeep: computed(() => props.deep && 'u-button-deep'),
            isDashed: computed(() => props.dashed && 'u-button-dashed'),
            isDisabled: computed(() => props.disabled && 'u-button-disabled'),
            isText: computed(() => props.text && 'u-button-text'),
            isRound: computed(() => props.round && 'u-button-round'),
            iconType: computed(() => (slots.prefix || slots.suffix) &&
                !slots.default &&
                `u-button-icon-${props.size}`),
            buttonType: computed(() => 'u-button-' + props.type),
            buttonSize: computed(() => 'u-button-size-' + props.size),
        };
    },
    render() {
        var _a, _b, _c;
        const { buttonType, buttonSize, isDeep, isDashed, isText, isRound, isDisabled, iconType, prefix, suffix, waveState, activeName, onClick, $slots, } = this;
        return (<div class={[
                'u-button',
                isText,
                buttonSize,
                buttonType,
                isDeep,
                isDashed,
                isDisabled,
                iconType,
                isRound,
                { [activeName]: waveState },
            ]} onClick={onClick}>
        {/* {prefix && <UIcon type={prefix} style=""></UIcon>} */}
        {(_a = $slots.prefix) === null || _a === void 0 ? void 0 : _a.call($slots)}
        {$slots.default && (<span class={[
                    { 'u-button-prefix': $slots.prefix },
                    { 'u-button-suffix': $slots.suffix },
                ]}>
            {(_b = $slots.default) === null || _b === void 0 ? void 0 : _b.call($slots)}
          </span>)}
        {(_c = $slots.suffix) === null || _c === void 0 ? void 0 : _c.call($slots)}
        {/* {$slots.suffix && <span class="u-button-suffix">{$slots.suffix?.()}</span>} */}
        {/* {suffix && <UIcon type={suffix} style=""></UIcon>} */}
      </div>);
    },
});
export default button;