maz-ui
Version:
A standalone components library for Vue.Js 3 & Nuxt.Js 3
59 lines (58 loc) • 2.05 kB
JavaScript
import { defineComponent as l, mergeModels as u, useModel as m, ref as d, onMounted as f, onUnmounted as v, openBlock as c, createElementBlock as p, normalizeClass as _, normalizeStyle as x, createElementVNode as E, mergeProps as g, renderSlot as h } from "vue";
import './assets/MazExpandAnimation.iDSQfAB4.css';const M = ["aria-hidden"], y = /* @__PURE__ */ l({
inheritAttrs: !1,
__name: "MazExpandAnimation",
props: /* @__PURE__ */ u({
duration: { default: "300ms" },
timingFunction: { default: "ease-in-out" }
}, {
modelValue: { type: Boolean },
modelModifiers: {}
}),
emits: ["update:modelValue"],
setup(i) {
const n = m(i, "modelValue"), t = d(!n.value), a = d();
function s() {
n.value || (t.value = !0);
}
function r() {
n.value && (t.value = !1);
}
return f(() => {
var e, o;
(e = a.value) == null || e.addEventListener("transitionstart", s, !1), (o = a.value) == null || o.addEventListener("transitionend", r, !1);
}), v(() => {
var e, o;
(e = a.value) == null || e.removeEventListener("transitionstart", s, !1), (o = a.value) == null || o.removeEventListener("transitionend", r, !1);
}), (e, o) => (c(), p("div", {
ref_key: "expandAnimationRef",
ref: a,
class: _(["m-expand-animation m-reset-css", { "m-expand-animation--expanded": n.value }]),
"aria-hidden": !n.value,
role: "region",
style: x([{ "--expand-animation-duration": e.duration, "--expand-animation-timing-function": e.timingFunction }])
}, [
E(
"div",
g({ class: "m-expand-animation__inner" }, e.$attrs, {
class: {
"--overflow-hidden": t.value
}
}),
[
h(e.$slots, "default", {}, void 0, !0)
],
16
/* FULL_PROPS */
)
], 14, M));
}
}), A = (i, n) => {
const t = i.__vccOpts || i;
for (const [a, s] of n)
t[a] = s;
return t;
}, z = /* @__PURE__ */ A(y, [["__scopeId", "data-v-058a2912"]]);
export {
z as default
};