/**
 * @since Last modified: 2024-09-04 20:02:34
 * @function easeHeight
 * @description The element height changes smoothly.
 * @param {object} options  - The parameters of slide down.
 * @param {getEl} [options.el]  - The target node.The writing is the same as getEl.
 * @param {number} [options.height]  - The height value of the setting element can be a specific value, and if it is not set, it is the height of the element itself.
 * @param {'down'|'up'|'to'} [options.type='down']  - Type of ease."down" means to slide down;"up" means to slide up;"to" means to slide to a height value;
 * @param {curve} [options.curve=easeOut]  - Animation curve.Can be filled in:'linear'|'ease'|'easeIn'|'easeOut'|'easeInOut'|'easeOutIn'.
 * @param {boolean} [options.cut=true]  - Forced overflow truncation,means to add the style attribute of the element:"overflow:hidden".
 * @param {number} [options.duration]  - The duration of slide down.The unit is ms.The default is automatically calculated by the element height.
 * @param {fn_cb_ease_app} [options.doing]  - The call back in progress.Support parameters:"frame"(animation frame) , "step"(progress) and "value" (height).
 * @param {fn_cb_ease_app} [options.done]  - The call back after completion.Support parameters:"frame"(animation frame) , "step"(progress) and "value" (height:0).
 * @returns {*} - The the target dom.
 * @see {@link https://codepen.io/axui/pen/xxMBWKz|demo @ codepen}
 * @example
 * ax.easeHeight({el:'#demo'});
 * <!--return the target dom-->
 */
'use strict';
import getEl from "./getEl";
import getHeights from "./getHeights";
import elState from "./elState";
import ease from "./ease";
let easeHeight = ({ el, height, type = 'down', doing, done, duration, curve = 'easeOut', cut = true }) => {
    let target = getEl(el);
    if (!target) {
        throw new Error('The target node does not exist!');
    }
    if (elState(target).isCalc) {
        let dftTime = (height) => height / 3 + 250, size = getHeights(target).height, _height = ~~height && height !== 0 ? ~~height : size, time = ~~duration && duration !== 0 ? ~~duration : dftTime(_height), dftCss = `${target.style.cssText} ${cut ? 'overflow:hidden;' : ''};`, from = {}, to = {};
        target.style.cssText = `${dftCss}`;
        if (type === 'to' && ~~height) {
            from = { height: size };
            to = { height };
        }
        else if (type === 'up') {
            from = { height: _height };
            to = { height: 0 };
        }
        else {
            from = { height: 0 };
            to = { height: _height };
        }
        ease({
            from,
            to,
            duration: time,
            curve,
            doing: (e) => {
                target.style.cssText = `
                ${dftCss}
                height: ${e.value.height}px
                `;
                doing && doing.call(target, { frame: e.frame, value: e.value.height, step: e.step });
            }, done: (e) => {
                done && done.call(target, { frame: e.frame, value: e.value.height, step: e.step });
            }
        });
    }
    return target;
};
export default easeHeight;
