@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
83 lines (82 loc) • 2.03 kB
JavaScript
import { createBlock as r, openBlock as n, Transition as o, mergeProps as s, withCtx as l, withDirectives as d, createElementVNode as p, normalizeProps as c, guardReactiveProps as f, renderSlot as u, createCommentVNode as h, vShow as m } from "vue";
import { _ as w } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
const S = {
compatConfig: { MODE: 3 },
name: "DtLazyShow",
inheritAttrs: !1,
/******************
* PROPS *
******************/
props: {
/**
* Whether the child slot is shown.
* @values true, false
*/
show: {
type: Boolean,
default: !1
},
/**
* A valid Vue enter/leave CSS transition name.
*/
transition: {
type: String,
default: null
},
/**
* Enable/Disable transition animation
* @values true, false
*/
appear: {
type: Boolean,
default: !1
}
},
/******************
* DATA *
******************/
data() {
return {
initialized: !!this.show
};
},
computed: {
/**
* Set the css property to false when running tests only.
* Refer to: https://vuejs.org/guide/built-ins/transition.html#javascript-hooks for details about
* transition `css` property
* @returns {boolean}
*/
isCSSEnabled() {
return process.env.NODE_ENV !== "test";
}
},
/******************
* WATCH *
******************/
watch: {
show: function(e) {
!e || this.initialized || (this.initialized = !0);
}
}
};
function _(e, z, t, y, a, i) {
return n(), r(o, s({
name: t.transition,
appear: t.appear
}, e.$attrs, { css: i.isCSSEnabled }), {
default: l(() => [
d(p("div", c(f(e.$attrs)), [
a.initialized ? u(e.$slots, "default", { key: 0 }) : h("", !0)
], 16), [
[m, t.show]
])
]),
_: 3
}, 16, ["name", "appear", "css"]);
}
const C = /* @__PURE__ */ w(S, [["render", _]]);
export {
C as default
};
//# sourceMappingURL=lazy-show.js.map