@vue-material/core
Version:
Yet another 'Material Design Components' library for Vue3.
53 lines (52 loc) • 1.76 kB
JavaScript
import { defineComponent, computed, openBlock, createBlock, Transition, withCtx, createElementBlock, createVNode, unref, createCommentVNode } from "vue";
import { Icon } from "@iconify/vue";
import _sfc_main$1 from "../Progress/circular-progress.vue.js";
const _hoisted_1 = {
key: 0,
class: "md-loader-default"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "default-loader",
props: {
progress: {},
ready: { type: Boolean },
error: { type: Boolean },
onRetry: { type: Function }
},
setup(__props) {
const props = __props;
const loading = computed(() => !props.ready && !props.error);
const value = computed(
() => loading.value ? props.progress >= 100 ? Infinity : props.progress : 0
);
return (_ctx, _cache) => {
return openBlock(), createBlock(Transition, { name: "md-loader" }, {
default: withCtx(() => [
!_ctx.ready ? (openBlock(), createElementBlock("div", _hoisted_1, [
createVNode(_sfc_main$1, {
value: value.value,
rotate: !_ctx.ready
}, {
default: withCtx(() => [
_ctx.error ? (openBlock(), createBlock(unref(Icon), {
key: 0,
icon: "material-symbols:refresh",
width: 24,
onClick: _ctx.onRetry,
inline: false,
style: { "cursor": "pointer" },
color: "var(--error, red)"
}, null, 8, ["onClick"])) : createCommentVNode("", true)
]),
_: 1
}, 8, ["value", "rotate"])
])) : createCommentVNode("", true)
]),
_: 1
});
};
}
});
export {
_sfc_main as default
};