maz-ui
Version:
A standalone components library for Vue.Js 3 & Nuxt.Js 3
107 lines (106 loc) • 5.05 kB
JavaScript
import { defineComponent, defineAsyncComponent, useAttrs, computed, createBlock, openBlock, resolveDynamicComponent, normalizeStyle, normalizeClass, withCtx, renderSlot, createElementBlock, createCommentVNode, unref, createTextVNode, toDisplayString, createVNode } from "vue";
import { g as getColor } from "../chunks/types.D0Bp_UhS.js";
import { _ as _export_sfc } from "../chunks/_plugin-vue_export-helper.B--vMWp3.js";
import '../assets/MazBtn.Dk675mx2.css';const _hoisted_1 = {
key: 0,
class: "m-btn-loader-container"
}, _sfc_main = /* @__PURE__ */ defineComponent({
__name: "MazBtn",
props: {
text: {},
size: { default: "md" },
color: { default: "primary" },
type: { default: "button" },
roundedSize: { default: "lg" },
outlined: { type: Boolean },
pastel: { type: Boolean },
block: { type: Boolean },
loading: { type: Boolean },
disabled: { type: Boolean },
fab: { type: Boolean },
icon: { type: [String, Function, Object] },
leftIcon: { type: [String, Function, Object] },
rightIcon: { type: [String, Function, Object] },
padding: { type: Boolean, default: !0 },
justify: { default: "center" }
},
setup(__props) {
const MazIcon = defineAsyncComponent(() => import("./MazIcon.js")), MazSpinner = defineAsyncComponent(() => import("./MazSpinner.js")), { href, to } = useAttrs(), component = computed(() => href ? "a" : to ? "router-link" : "button"), btnColorClass = computed(() => __props.pastel ? `--${getColor(__props.color)}-pastel` : __props.outlined ? `--${getColor(__props.color)}-outlined` : `--${getColor(__props.color)}`), isDisabled = computed(
() => (__props.loading || __props.disabled) && component.value === "button"
), cursorClass = computed(() => isDisabled.value ? "--cursor-default" : "--cursor-pointer"), btnType = computed(() => component.value === "button" ? __props.type : void 0), iconSize = computed(() => ({
xl: "lg",
lg: "md",
md: "md",
sm: "sm",
xs: "xs",
mini: "1em"
})[__props.size] || "lg");
return (_ctx, _cache) => (openBlock(), createBlock(resolveDynamicComponent(component.value), {
disabled: isDisabled.value,
class: normalizeClass(["m-btn m-reset-css", [
`--${__props.size}`,
!__props.fab && __props.roundedSize && `--rounded-${__props.roundedSize}`,
btnColorClass.value,
cursorClass.value,
{
"--block": __props.block,
"--fab": __props.fab,
"--loading": __props.loading,
"--no-padding": !__props.padding,
"--has-left-icon": !!__props.leftIcon || !!_ctx.$slots["left-icon"],
"--has-right-icon": !!__props.rightIcon || !!_ctx.$slots["right-icon"]
}
]]),
style: normalizeStyle([`--justify: ${__props.justify}`, `--color: var(--maz-${__props.color})`]),
type: btnType.value
}, {
default: withCtx(() => [
renderSlot(_ctx.$slots, "left-icon", {}, () => [
typeof __props.leftIcon == "string" ? (openBlock(), createBlock(unref(MazIcon), {
key: 0,
name: __props.leftIcon,
size: iconSize.value
}, null, 8, ["name", "size"])) : __props.leftIcon ? (openBlock(), createBlock(unref(MazIcon), {
key: 1,
icon: __props.leftIcon,
size: iconSize.value
}, null, 8, ["icon", "size"])) : createCommentVNode("", !0)
], !0),
renderSlot(_ctx.$slots, "icon", {}, () => [
typeof __props.icon == "string" ? (openBlock(), createBlock(unref(MazIcon), {
key: 0,
name: __props.icon,
size: iconSize.value
}, null, 8, ["name", "size"])) : __props.icon ? (openBlock(), createBlock(unref(MazIcon), {
key: 1,
icon: __props.icon,
size: iconSize.value
}, null, 8, ["icon", "size"])) : createCommentVNode("", !0)
], !0),
renderSlot(_ctx.$slots, "default", {}, () => [
createTextVNode(toDisplayString(__props.text), 1)
], !0),
renderSlot(_ctx.$slots, "right-icon", {}, () => [
typeof __props.rightIcon == "string" ? (openBlock(), createBlock(unref(MazIcon), {
key: 0,
name: __props.rightIcon,
size: iconSize.value
}, null, 8, ["name", "size"])) : __props.rightIcon ? (openBlock(), createBlock(unref(MazIcon), {
key: 1,
icon: __props.rightIcon,
size: iconSize.value
}, null, 8, ["icon", "size"])) : createCommentVNode("", !0)
], !0),
__props.loading ? (openBlock(), createElementBlock("div", _hoisted_1, [
renderSlot(_ctx.$slots, "loader", {}, () => [
createVNode(unref(MazSpinner), { size: "2em" })
], !0)
])) : createCommentVNode("", !0)
]),
_: 3
}, 8, ["disabled", "class", "style", "type"]));
}
}), MazBtn = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-d41a0220"]]);
export {
MazBtn as default
};