st-common-ui-vue3
Version:
小尾巴通用 Vue3 UI 组件库
56 lines (55 loc) • 2.22 kB
JavaScript
import { defineComponent as l, openBlock as a, createElementBlock as d, normalizeClass as s, normalizeStyle as t, unref as r, createElementVNode as i, renderSlot as o } from "vue";
import * as n from "../../node_modules/.pnpm/st-common-ui-utils@0.1.1/node_modules/st-common-ui-utils/es/utils/el-size-util.js";
const g = /* @__PURE__ */ l({
name: "StHoverFleetingContainer",
__name: "StHoverFleetingContainer",
props: {
width: { default: "100%" },
height: { default: "100%" },
backgroundColor: { default: "#111" },
borderColor: { default: "#43CBFF" },
borderWidth: { default: "2px" },
borderRadius: { default: "0.25rem" },
start: { default: 0 },
speed: { default: "1.5s" },
shine: { type: Boolean, default: !1 },
shineRangeStart: { default: "10px" },
shineRangeEnd: { default: "30px" },
shineBrightnessStart: {},
shineBrightnessEnd: { default: 1 },
blurBorder: { type: Boolean, default: !1 },
blurSpeed: { default: "1.5s" }
},
setup(h) {
return (e, u) => (a(), d("div", {
class: s(["st-hover-fleeting-container", [
e.shine ? "st-hover-fleeting-container--shine" : "",
e.blurBorder ? "st-hover-fleeting-container--blur-border" : ""
]]),
style: t({
"--border-width": r(n).elSizePreHandler(e.borderWidth),
"--border-color": e.borderColor,
"--border-radius": r(n).elSizePreHandler(e.borderRadius),
"--start": r(n).elSizePreHandler(e.start, "deg"),
"--speed": r(n).elSizePreHandler(e.speed, "ms"),
"--shine-range-start": r(n).elSizePreHandler(e.shineRangeStart),
"--shine-range-end": r(n).elSizePreHandler(e.shineRangeEnd),
"--shine-brightness-start": e.shineBrightnessStart,
"--shine-brightness-end": e.shineBrightnessEnd,
"--blur-speed": r(n).elSizePreHandler(e.blurSpeed, "ms"),
width: r(n).elSizePreHandler(e.width),
height: r(n).elSizePreHandler(e.height)
})
}, [
i("div", {
class: "st-hover-fleeting-container__content",
style: t({ backgroundColor: e.backgroundColor })
}, [
o(e.$slots, "default", {}, void 0, !0)
], 4)
], 6));
}
});
export {
g as default
};