vue-star-plus
Version:
Plus version of vue-star component
73 lines (72 loc) • 2.38 kB
JavaScript
import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, normalizeClass, normalizeStyle, renderSlot } from "vue";
var vueStartPlus = "";
var _export_sfc = (sfc, props) => {
const target = sfc.__vccOpts || sfc;
for (const [key, val] of props) {
target[key] = val;
}
return target;
};
const hexColors = /^#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})$/;
const rgbColors = /^[rR][gG][Bb][Aa]?[(]([\s]*(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?),){2}[\s]*(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?),?[\s]*(0\.\d{1,2}|1|0)?[)]{1}$/g;
function isColor(color) {
return hexColors.test(color) || rgbColors.test(color);
}
const _sfc_main = defineComponent({
name: "VueStarPlus",
props: {
modelValue: Boolean,
animate: String,
color: {
type: String,
validator: isColor
},
type: {
type: String,
default: "fill",
validator: (value) => ["fill", "center"].includes(value)
}
},
emits: ["update:modelValue"],
setup(props, { emit }) {
const iconClass = computed(() => {
return props.modelValue ? props.animate : "";
});
const iconStyle = computed(() => {
return {
color: props.modelValue ? props.color : ""
};
});
const handleToggle = () => {
emit("update:modelValue", !props.modelValue);
};
return {
iconClass,
iconStyle,
handleToggle
};
}
});
const _hoisted_1 = { class: "vue-star-plus" };
const _hoisted_2 = { class: "vue-star-plus__ground" };
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return openBlock(), createElementBlock("div", _hoisted_1, [
createElementVNode("div", _hoisted_2, [
createElementVNode("div", {
class: normalizeClass(["vue-star-plus__icon", [_ctx.iconClass]]),
style: normalizeStyle(_ctx.iconStyle),
onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleToggle && _ctx.handleToggle(...args))
}, [
renderSlot(_ctx.$slots, "icon")
], 6),
createElementVNode("div", {
class: normalizeClass(["vue-star-plus__decoration", [
`vue-star-plus__decoration--${_ctx.type}`,
{ "vue-star-plus__decoration--active": _ctx.modelValue }
]])
}, null, 2)
])
]);
}
var VueStarPlus = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
export { VueStarPlus as default };