@vuesax-alpha/nightly
Version:
A Component Library for Vue 3
222 lines (217 loc) • 8.26 kB
JavaScript
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
require('../../../utils/index.js');
var index$4 = require('../../icon/index.js');
var index$3 = require('../../collapse-transition/index.js');
require('../../../hooks/index.js');
require('../../../constants/index.js');
var alert = require('./alert.js');
var useDeprecated = require('./use-deprecated.js');
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
var index = require('../../../hooks/use-namespace/index.js');
var index$1 = require('../../../hooks/use-base-component/index.js');
var index$2 = require('../../../hooks/use-common-props/index.js');
var color = require('../../../utils/color.js');
var event = require('../../../constants/event.js');
var types = require('../../../utils/types.js');
const __default__ = vue.defineComponent({
name: "VsAlert"
});
const _sfc_main = vue.defineComponent({
...__default__,
props: alert.alertProps,
emits: alert.alertEmits,
setup(__props, { emit }) {
const props = __props;
const slots = vue.useSlots();
useDeprecated.useAlertDeprecated(props);
const ns = index.useNamespace("alert");
const vsBaseClasses = index$1.useVuesaxBaseComponent(index$2.useColor());
const alertClasses = vue.computed(() => [
vsBaseClasses,
ns.b(),
props.type && ns.m(props.type),
getPages.value.length > 0 && ns.m("pages")
]);
const alertStyles = vue.computed(() => {
return ns.cssVar({
color: color.getVsColor(props.color)
});
});
const getTotalPages = vue.computed(() => {
const keys = Object.keys(slots).filter((slot) => slot.includes("page-"));
return keys.length;
});
const getPages = vue.computed(() => {
const pages = Object.keys(slots).filter((slot) => {
return slot.includes("page-");
});
const values = [];
pages.forEach((page) => {
values.push(`${props.page}` === page.split("-")[1] && slots[page]);
});
return values;
});
const handleClickClose = () => {
emit(event.UPDATE_MODEL_EVENT, !props.modelValue);
};
const handleClickHidden = () => {
emit("update:hiddenContent", !props.hiddenContent);
};
const handleClickPrevPage = () => {
if (props.page > 1) {
emit("update:page", props.page - 1);
}
};
const handleClickNextPage = () => {
if (props.page < getTotalPages.value) {
emit("update:page", props.page + 1);
}
};
return (_ctx, _cache) => {
return vue.openBlock(), vue.createBlock(vue.unref(index$3.VsCollapseTransition), null, {
default: vue.withCtx(() => [
_ctx.modelValue ? (vue.openBlock(), vue.createElementBlock(
"div",
{
key: 0,
class: vue.normalizeClass(alertClasses.value),
style: vue.normalizeStyle(alertStyles.value)
},
[
_ctx.$slots.icon ? (vue.openBlock(), vue.createElementBlock(
"div",
{
key: 0,
class: vue.normalizeClass(vue.unref(ns).e("icon"))
},
[
vue.renderSlot(_ctx.$slots, "icon")
],
2
)) : vue.createCommentVNode("v-if", true),
_ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock(
"div",
{
key: 1,
class: vue.normalizeClass([
vue.unref(ns).e("title"),
vue.unref(types.isBoolean)(_ctx.hiddenContent) && vue.unref(ns).em("title", "click__hidden")
]),
onClick: handleClickHidden
},
[
vue.renderSlot(_ctx.$slots, "title"),
!_ctx.closable && vue.unref(types.isBoolean)(_ctx.hiddenContent) ? (vue.openBlock(), vue.createBlock(vue.unref(index$4.IconPlus), {
key: 0,
less: !_ctx.hiddenContent,
onClick: vue.withModifiers(handleClickHidden, ["stop"])
}, null, 8, ["less", "onClick"])) : vue.createCommentVNode("v-if", true)
],
2
)) : vue.createCommentVNode("v-if", true),
vue.createVNode(vue.unref(index$3.VsCollapseTransition), null, {
default: vue.withCtx(() => [
!_ctx.hiddenContent ? (vue.openBlock(), vue.createElementBlock(
"div",
{
key: 0,
class: vue.normalizeClass(vue.unref(ns).e("content"))
},
[
vue.createElementVNode(
"div",
{
class: vue.normalizeClass(vue.unref(ns).em("content", "text"))
},
[
vue.renderSlot(_ctx.$slots, "default"),
vue.renderSlot(_ctx.$slots, `page-${_ctx.page}`)
],
2
)
],
2
)) : vue.createCommentVNode("v-if", true)
]),
_: 3
}),
_ctx.closable ? (vue.openBlock(), vue.createElementBlock(
"button",
{
key: 2,
class: vue.normalizeClass(vue.unref(ns).e("close")),
onClick: handleClickClose
},
[
vue.createVNode(vue.unref(index$4.IconClose), { hover: "less" })
],
2
)) : vue.createCommentVNode("v-if", true),
_ctx.$slots.footer ? (vue.openBlock(), vue.createElementBlock(
"div",
{
key: 3,
class: vue.normalizeClass(vue.unref(ns).e("footer"))
},
[
vue.renderSlot(_ctx.$slots, "footer")
],
2
)) : vue.createCommentVNode("v-if", true),
!!_ctx.progress ? (vue.openBlock(), vue.createElementBlock(
"div",
{
key: 4,
class: vue.normalizeClass(vue.unref(ns).e("progress"))
},
[
vue.createElementVNode(
"div",
{
class: vue.normalizeClass(vue.unref(ns).em("progress", "bar")),
style: vue.normalizeStyle({ width: `${_ctx.progress}%` })
},
null,
6
)
],
2
)) : vue.createCommentVNode("v-if", true),
getTotalPages.value > 0 ? (vue.openBlock(), vue.createElementBlock(
"div",
{
key: 5,
class: vue.normalizeClass(vue.unref(ns).e("pagination"))
},
[
vue.createElementVNode("button", {
onClick: handleClickPrevPage,
textContent: "<"
}),
vue.createElementVNode(
"span",
null,
vue.toDisplayString(_ctx.page) + " / " + vue.toDisplayString(getTotalPages.value),
1
),
vue.createElementVNode("button", {
onClick: handleClickNextPage,
textContent: ">"
})
],
2
)) : vue.createCommentVNode("v-if", true)
],
6
)) : vue.createCommentVNode("v-if", true)
]),
_: 3
});
};
}
});
var Alert = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "/home/runner/work/vuesax-alpha/vuesax-alpha/packages/components/alert/src/alert.vue"]]);
exports["default"] = Alert;
//# sourceMappingURL=alert2.js.map