st-common-ui-vue3
Version:
小尾巴通用 Vue3 UI 组件库
73 lines (72 loc) • 2.52 kB
JavaScript
import { defineComponent as n, ref as s, onMounted as i, onBeforeUnmount as p, openBlock as g, createElementBlock as u, normalizeStyle as f, unref as l, renderSlot as d } from "vue";
import * as r from "../../node_modules/.pnpm/st-common-ui-utils@0.1.1/node_modules/st-common-ui-utils/es/utils/el-size-util.js";
import c from "../../node_modules/.pnpm/vanilla-tilt@1.8.1/node_modules/vanilla-tilt/lib/vanilla-tilt.es2015.js";
const M = /* @__PURE__ */ n({
name: "St3DTiltContainer",
__name: "St3DTiltContainer",
props: {
width: { default: "100%" },
height: { default: "100%" },
max: { default: 35 },
startX: { default: 0 },
startY: { default: 0 },
perspective: { default: 1e3 },
scale: { default: 1 },
speed: { default: 300 },
transition: { type: Boolean, default: !0 },
axis: { default: null },
reset: { type: Boolean, default: !0 },
resetToStart: { type: Boolean, default: !0 },
easing: { default: "cubic-bezier(.03,.98,.52,.99)" },
glare: { type: Boolean, default: !1 },
maxGlare: { default: 1 },
gyroscope: { type: Boolean, default: !0 },
gyroscopeMinAngleX: { default: -45 },
gyroscopeMaxAngleX: { default: 45 },
gyroscopeMinAngleY: { default: -45 },
gyroscopeMaxAngleY: { default: 45 },
fullPageListening: { type: Boolean, default: !1 }
},
setup(o) {
const e = o, a = s(null);
return i(() => {
c.init(a.value, {
max: e.max,
startX: e.startX,
startY: e.startY,
perspective: e.perspective,
scale: e.scale,
speed: e.speed,
transition: e.transition,
axis: e.axis,
reset: e.reset,
"reset-to-start": e.resetToStart,
easing: e.easing,
glare: e.glare,
"max-glare": e.maxGlare,
gyroscope: e.gyroscope,
gyroscopeMinAngleX: e.gyroscopeMinAngleX,
gyroscopeMaxAngleX: e.gyroscopeMaxAngleX,
gyroscopeMinAngleY: e.gyroscopeMinAngleY,
gyroscopeMaxAngleY: e.gyroscopeMaxAngleY,
"full-page-listening": e.fullPageListening
});
}), p(() => {
a.value.destroy();
}), (t, y) => (g(), u("div", {
ref_key: "st3DContainerRef",
ref: a,
class: "st-3d-container",
style: f({
width: l(r).elSizePreHandler(t.width),
height: l(r).elSizePreHandler(t.height),
perspective: l(r).elSizePreHandler(t.perspective)
})
}, [
d(t.$slots, "default", {}, void 0, !0)
], 4));
}
});
export {
M as default
};