@dcodegroup-au/dsg-vue
Version:
Front-end Vue/Tailwind DSG for UntitledUI.
1,550 lines • 169 kB
JavaScript
import { _ as G, D as fe, a as fi, b as xs, c as Tt, k as hi, d as Ve, e as vs, u as pi, f as gi, g as mi, h as bi, i as vi } from "./DsgTablePerPage.vue_vue_type_style_index_0_lang-BOlPdhxa.js";
import { defineComponent as _, createElementBlock as v, openBlock as c, normalizeClass as V, unref as ae, createVNode as L, normalizeProps as Fs, guardReactiveProps as yi, ref as W, useTemplateRef as be, createElementVNode as E, createCommentVNode as k, renderSlot as T, createBlock as M, toDisplayString as D, reactive as De, mergeProps as ee, toRaw as ne, createApp as wi, nextTick as cs, computed as q, onMounted as Mt, onUnmounted as fs, Fragment as X, h as vt, isVNode as qs, cloneVNode as ki, watchEffect as lt, useAttrs as Ci, mergeModels as Lt, useModel as At, resolveDirective as Ei, renderList as le, withDirectives as Ae, onBeforeUnmount as Si, withCtx as Ie, withKeys as de, withModifiers as z, vShow as Ge, Transition as ys, normalizeStyle as rt, createTextVNode as We, watch as Oi, vModelSelect as $i, resolveDynamicComponent as Ti } from "vue";
import { C as Li } from "./DsgColoursConfig-BseFo6-R.js";
import { _ as _s } from "./DsgLabel.vue_vue_type_style_index_0_lang-BRVMqZ-w.js";
const Ai = /* @__PURE__ */ _({
__name: "DsgMiscIcon",
props: {
theme: { default: "brand" },
type: { default: "light-outline" },
size: { default: "lg" },
icon: {},
classes: { default: "" }
},
setup(e) {
const t = ["dsg-misc-icon", `dsg-misc-icon--${e.theme}`, `dsg-misc-icon--${e.type}`, `dsg-misc-icon--${e.size}`, e.classes].join(" ").replace(/\s+/g, " ").trim();
return (s, o) => (c(), v("div", {
class: V(ae(t))
}, [
L(G, Fs(yi(s.icon)), null, 16)
], 2));
}
}), js = (e, t) => {
const s = e.__vccOpts || e;
for (const [o, i] of t)
s[o] = i;
return s;
}, Ne = /* @__PURE__ */ js(Ai, [["__scopeId", "data-v-6f50208c"]]), Bi = `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="Size=4xl" clip-path="url(#clip0_3302_422487)">
<path id="Vector" d="M24.711 5.66721C25.0149 6.40224 25.5983 6.98649 26.3328 7.29151L28.9086 8.35843C29.6437 8.66292 30.2277 9.24694 30.5322 9.98202C30.8367 10.7171 30.8367 11.543 30.5322 12.2781L29.466 14.8521C29.1614 15.5875 29.161 16.4142 29.467 17.1493L30.5313 19.7224C30.6822 20.0865 30.76 20.4768 30.76 20.8709C30.7601 21.265 30.6825 21.6553 30.5317 22.0194C30.3808 22.3836 30.1597 22.7144 29.881 22.993C29.6023 23.2717 29.2714 23.4927 28.9072 23.6434L26.3333 24.7096C25.5982 25.0135 25.014 25.5968 24.709 26.3314L23.642 28.9072C23.3376 29.6423 22.7535 30.2263 22.0185 30.5308C21.2834 30.8353 20.4574 30.8353 19.7224 30.5308L17.1484 29.4646C16.4133 29.1609 15.5877 29.1615 14.853 29.4663L12.2773 30.5317C11.5426 30.8355 10.7174 30.8353 9.98289 30.531C9.2484 30.2268 8.6647 29.6435 8.36001 28.9092L7.29277 26.3326C6.98885 25.5976 6.40548 25.0133 5.67091 24.7083L3.09514 23.6414C2.36037 23.337 1.77652 22.7534 1.47193 22.0187C1.16734 21.2841 1.16692 20.4585 1.47078 19.7236L2.53694 17.1496C2.84067 16.4145 2.84005 15.5889 2.53521 14.8542L1.47059 12.2766C1.31964 11.9125 1.24192 11.5223 1.24186 11.1282C1.24179 10.734 1.31939 10.3438 1.47022 9.97962C1.62104 9.6155 1.84214 9.28466 2.12088 9.00601C2.39961 8.72737 2.73052 8.50638 3.09469 8.35567L5.66862 7.28951C6.40301 6.98586 6.98691 6.40322 7.29216 5.6695L8.35908 3.09372C8.66357 2.35864 9.24759 1.77461 9.98267 1.47013C10.7178 1.16565 11.5437 1.16565 12.2788 1.47013L14.8527 2.53629C15.5878 2.84002 16.4134 2.8394 17.1481 2.53456L19.7249 1.47178C20.4599 1.16747 21.2857 1.16754 22.0206 1.47196C22.7556 1.77638 23.3395 2.36023 23.644 3.09513L24.7113 5.67167L24.711 5.66721Z" fill="#0788F5"/>
<path id="Vector_2" fill-rule="evenodd" clip-rule="evenodd" d="M22.2665 11.8058C22.4803 11.4701 22.5519 11.0631 22.4656 10.6746C22.3794 10.286 22.1423 9.94759 21.8065 9.73383C21.4708 9.52006 21.0638 9.44843 20.6753 9.5347C20.2867 9.62097 19.9483 9.85806 19.7345 10.1938L13.8605 19.4238L11.1725 16.0638C10.924 15.753 10.5622 15.5536 10.1667 15.5095C9.77118 15.4655 9.37436 15.5803 9.06352 15.8288C8.75269 16.0773 8.55331 16.4391 8.50923 16.8347C8.46516 17.2302 8.58001 17.627 8.82852 17.9378L12.8285 22.9378C12.9776 23.1244 13.1691 23.2727 13.387 23.3703C13.6049 23.468 13.843 23.5122 14.0815 23.4993C14.32 23.4864 14.5519 23.4167 14.758 23.2961C14.9641 23.1755 15.1385 23.0074 15.2665 22.8058L22.2665 11.8058Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0_3302_422487">
<rect width="32" height="32" fill="white"/>
</clipPath>
</defs>
</svg>
`, Ii = ["href", "title"], Di = {
class: "dsg-avatar--image-wrapper",
tabindex: "0",
ref: "avatarImageWrapperEl"
}, Mi = ["src", "alt"], Pi = {
key: 1,
class: "dsg-avatar--initials"
}, Ni = { class: "dsg-avatar--status" }, Vi = {
key: 0,
class: "dsg-avatar--activity"
}, Ri = ["innerHTML"], Ui = {
key: 2,
class: "dsg-avatar--logo"
}, Hi = ["src", "alt"], zi = {
key: 0,
class: "dsg-avatar--info"
}, xi = { class: "dsg-avatar--title" }, Fi = { class: "dsg-avatar--subtext" }, ct = /* @__PURE__ */ _({
__name: "DsgAvatar",
props: {
profileUri: { default: "" },
fullName: { default: "" },
size: { default: "md" },
theme: { default: "activity" },
isOnline: { type: Boolean, default: !1 },
uri: { default: () => {
} },
classes: { default: "" },
companyLogoUri: { default: () => {
} },
preventDefault: { type: Boolean, default: !1 },
title: { default: "" },
subText: { default: "" },
noFocus: { type: Boolean, default: !1 }
},
emits: ["avatar-clicked", "before-change-status", "after-change-status"],
setup(e, { expose: t, emit: s }) {
const o = [
"dsg-avatar",
`dsg-avatar--${e.size}`,
`dsg-avatar--${e.theme}`,
`dsg-avatar--${e.isOnline ? "online" : "offline"}`,
`dsg-avatar--${e.title?.length ? "has-info" : "no-info"}`,
`dsg-avatar--${e.uri ? "has-link" : "no-link"}`,
`dsg-avatar--${e.noFocus ? "no-focus" : "focus"}`,
`dsg-avatar--${["profile-photo", "profile-photo-verified"].indexOf(e.theme) !== -1 ? "profile-photo" : "non-profile-photo"}`,
e.classes
].join(" ");
["profile-photo", "profile-photo-verified"].indexOf(e.theme) !== -1 && (["sm", "md", "lg"].indexOf(e.size) === -1 && new fe("DsgAvatar: The 'profile-photo' theme only supports the 'sm', 'md', and 'lg' sizes."), (e.fullName || e.title || e.subText) && new fi("DsgAvatar: The 'profile-photo' theme will not display the 'title' or 'subText' props.")), e.theme === "logo" && !e.companyLogoUri && new fe("DsgAvatar: The 'logo' theme requires a 'companyLogoUri' prop."), ["activity", "verified", "logo"].indexOf(e.theme) !== -1 && e.title?.length && e.subText?.length && ["xs", "sm", "md", "lg", "xl", "2xl"].indexOf(e.size) === -1 && new fe(
"DsgAvatar: The 'activity', 'verified', and 'logo' themes only support the 'xs', 'sm', 'md', 'lg', and 'xl' sizes when 'title' and 'subText' are provided."
), e.theme === "tile" && !e.title?.length && !e.fullName && new fe("DsgAvatar: The 'tile' theme requires either 'title' or 'fullName' prop."), e.size === "xxs" && (e.title?.length || e.subText?.length) && new fe("DsgAvatar: The 'xxs' size does not support the 'title' or 'subText' props.");
const i = (b) => {
const m = b.split(" ");
return (m[0].charAt(0) + m[m.length - 1].charAt(0)).toUpperCase();
}, n = () => e.fullName ? "Avatar of " + e.fullName : "Avatar", a = s, l = W(!1), r = (b) => {
a("before-change-status", l.value, b), l.value = b, a("after-change-status", l.value);
}, w = be("avatarImageWrapperEl"), g = (b) => {
e.preventDefault || (a("avatar-clicked", b), w.value && !e.uri && w.value.focus());
};
return t({
setUserActiveStatus: r,
toggleFocus: (b) => {
w.value && (b ? w.value.focus() : w.value.blur());
}
}), (b, m) => (c(), v("div", {
class: V(ae(o))
}, [
E("a", {
class: "dsg-avatar--link",
href: b.uri,
title: n(),
target: "_blank",
ref: "avatarLink",
onClick: g
}, [
E("div", Di, [
T(b.$slots, "dsg-avatar--background", {}, () => [
b.profileUri ? (c(), v("img", {
key: 0,
class: "dsg-avatar--profile-image",
src: b.profileUri,
alt: n()
}, null, 8, Mi)) : k("", !0),
!b.profileUri && b.fullName ? (c(), v("span", Pi, D(i(b.fullName)), 1)) : k("", !0),
!b.profileUri && !b.fullName ? (c(), M(G, {
key: 2,
class: "dsg-avatar--user-icon",
icon: "user-01",
color: ae(Li).gray[600],
size: b.size
}, null, 8, ["color", "size"])) : k("", !0)
]),
["tile"].indexOf(b.theme) === -1 ? T(b.$slots, "dsg-avatar--status", { key: 0 }, () => [
E("div", Ni, [
b.theme === "activity" && b.isOnline ? (c(), v("span", Vi)) : k("", !0),
["verified", "profile-photo-verified"].indexOf(b.theme) !== -1 ? (c(), v("span", {
key: 1,
class: "dsg-avatar--verified",
innerHTML: ae(Bi)
}, null, 8, Ri)) : k("", !0),
b.theme === "logo" ? (c(), v("span", Ui, [
E("img", {
src: b.companyLogoUri,
alt: n(),
class: "dsg-avatar--company-logo"
}, null, 8, Hi)
])) : k("", !0)
])
]) : k("", !0)
], 512),
b.title?.length || b.theme === "tile" && (b.title?.length || b.fullName) ? (c(), v("div", zi, [
b.title?.length || b.theme === "tile" && (b.title?.length || b.fullName) ? T(b.$slots, "dsg-avatar--title", { key: 0 }, () => [
E("h3", xi, D(b.title?.length ? b.title : b.fullName), 1)
]) : k("", !0),
b.subText?.length ? T(b.$slots, "dsg-avatar--subtext", { key: 1 }, () => [
E("p", Fi, D(b.subText), 1)
]) : k("", !0)
])) : k("", !0)
], 8, Ii)
], 2));
}
}), bt = {
TOP_LEFT: "top-left",
TOP_RIGHT: "top-right",
TOP_CENTER: "top-center",
BOTTOM_LEFT: "bottom-left",
BOTTOM_RIGHT: "bottom-right",
BOTTOM_CENTER: "bottom-center"
}, ze = {
LIGHT: "light",
DARK: "dark",
COLORED: "colored",
AUTO: "auto"
}, Y = {
INFO: "info",
SUCCESS: "success",
WARNING: "warning",
ERROR: "error",
DEFAULT: "default"
}, qi = {
BOUNCE: "bounce",
SLIDE: "slide",
FLIP: "flip",
ZOOM: "zoom",
NONE: "none"
}, _i = {
dangerouslyHTMLString: !1,
multiple: !0,
position: bt.TOP_RIGHT,
autoClose: 5e3,
transition: "bounce",
hideProgressBar: !1,
pauseOnHover: !0,
pauseOnFocusLoss: !0,
closeOnClick: !0,
className: "",
bodyClassName: "",
style: {},
progressClassName: "",
progressStyle: {},
role: "alert",
theme: "light"
}, ji = {
rtl: !1,
newestOnTop: !1,
toastClassName: ""
}, Ks = {
..._i,
...ji
};
Y.DEFAULT;
var I = /* @__PURE__ */ ((e) => (e[e.COLLAPSE_DURATION = 300] = "COLLAPSE_DURATION", e[e.DEBOUNCE_DURATION = 50] = "DEBOUNCE_DURATION", e.CSS_NAMESPACE = "Toastify", e))(I || {}), ss = /* @__PURE__ */ ((e) => (e.ENTRANCE_ANIMATION_END = "d", e))(ss || {});
const Ki = {
enter: "Toastify--animate Toastify__bounce-enter",
exit: "Toastify--animate Toastify__bounce-exit",
appendPosition: !0
}, Gi = {
enter: "Toastify--animate Toastify__slide-enter",
exit: "Toastify--animate Toastify__slide-exit",
appendPosition: !0
}, Wi = {
enter: "Toastify--animate Toastify__zoom-enter",
exit: "Toastify--animate Toastify__zoom-exit"
}, Xi = {
enter: "Toastify--animate Toastify__flip-enter",
exit: "Toastify--animate Toastify__flip-exit"
}, ws = "Toastify--animate Toastify__none-enter";
function Gs(e, t = !1) {
var s;
let o = Ki;
if (!e || typeof e == "string")
switch (e) {
case "flip":
o = Xi;
break;
case "zoom":
o = Wi;
break;
case "slide":
o = Gi;
break;
}
else
o = e;
if (t)
o.enter = ws;
else if (o.enter === ws) {
const i = (s = o.exit.split("__")[1]) == null ? void 0 : s.split("-")[0];
o.enter = `Toastify--animate Toastify__${i}-enter`;
}
return o;
}
function Yi(e) {
return e.containerId || String(e.position);
}
const Pt = "will-unmount";
function Zi(e = bt.TOP_RIGHT) {
return !!document.querySelector(`.${I.CSS_NAMESPACE}__toast-container--${e}`);
}
function Ji(e = bt.TOP_RIGHT) {
return `${I.CSS_NAMESPACE}__toast-container--${e}`;
}
function Qi(e, t, s = !1) {
const o = [
`${I.CSS_NAMESPACE}__toast-container`,
`${I.CSS_NAMESPACE}__toast-container--${e}`,
s ? `${I.CSS_NAMESPACE}__toast-container--rtl` : null
].filter(Boolean).join(" ");
return Re(t) ? t({
position: e,
rtl: s,
defaultClassName: o
}) : `${o} ${t || ""}`;
}
function eo(e) {
var t;
const { position: s, containerClassName: o, rtl: i = !1, style: n = {} } = e, a = I.CSS_NAMESPACE, l = Ji(s), r = document.querySelector(`.${a}`), w = document.querySelector(`.${l}`), g = !!w && !((t = w.className) != null && t.includes(Pt)), C = r || document.createElement("div"), b = document.createElement("div");
b.className = Qi(
s,
o,
i
), b.dataset.testid = `${I.CSS_NAMESPACE}__toast-container--${s}`, b.id = Yi(e);
for (const m in n)
if (Object.prototype.hasOwnProperty.call(n, m)) {
const A = n[m];
b.style[m] = A;
}
return r || (C.className = I.CSS_NAMESPACE, document.body.appendChild(C)), g || C.appendChild(b), b;
}
function is(e) {
var t, s, o;
const i = typeof e == "string" ? e : ((t = e.currentTarget) == null ? void 0 : t.id) || ((s = e.target) == null ? void 0 : s.id), n = document.getElementById(i);
n && n.removeEventListener("animationend", is, !1);
try {
ft[i].unmount(), (o = document.getElementById(i)) == null || o.remove(), delete ft[i], delete j[i];
} catch {
}
}
const ft = De({});
function to(e, t) {
const s = document.getElementById(String(t));
s && (ft[s.id] = e);
}
function os(e, t = !0) {
const s = String(e);
if (!ft[s]) return;
const o = document.getElementById(s);
o && o.classList.add(Pt), t ? (io(e), o && o.addEventListener("animationend", is, !1)) : is(s), pe.items = pe.items.filter((i) => i.containerId !== e);
}
function so(e) {
for (const t in ft)
os(t, e);
pe.items = [];
}
function Ws(e, t) {
const s = document.getElementById(e.toastId);
if (s) {
let o = e;
o = {
...o,
...Gs(o.transition)
};
const i = o.appendPosition ? `${o.exit}--${o.position}` : o.exit;
s.className += ` ${i}`, t && t(s);
}
}
function io(e) {
for (const t in j)
if (t === e)
for (const s of j[t] || [])
Ws(s);
}
function oo(e) {
const t = xe().find((s) => s.toastId === e);
return t?.containerId;
}
function hs(e) {
return document.getElementById(e);
}
function no(e) {
const t = hs(e.containerId);
return t && t.classList.contains(Pt);
}
function ks(e) {
var t;
const s = qs(e.content) ? ne(e.content.props) : null;
return s ?? ne((t = e.data) != null ? t : {});
}
function ao(e) {
return e ? pe.items.filter((t) => t.containerId === e).length > 0 : pe.items.length > 0;
}
function lo() {
if (pe.items.length > 0) {
const e = pe.items.shift();
Et(e?.toastContent, e?.toastProps);
}
}
const j = De({}), pe = De({ items: [] });
function xe() {
const e = ne(j);
return Object.values(e).reduce((t, s) => [...t, ...s], []);
}
function ro(e) {
return xe().find((t) => t.toastId === e);
}
function Et(e, t = {}) {
if (no(t)) {
const s = hs(t.containerId);
s && s.addEventListener("animationend", ns.bind(null, e, t), !1);
} else
ns(e, t);
}
function ns(e, t = {}) {
const s = hs(t.containerId);
s && s.removeEventListener("animationend", ns.bind(null, e, t), !1);
const o = j[t.containerId] || [], i = o.length > 0;
if (!i && !Zi(t.position)) {
const n = eo(t), a = wi(Ao, t);
t.useHandler && t.useHandler(a), a.mount(n), to(a, n.id);
}
i && !t.updateId && (t.position = o[0].position), cs(() => {
t.updateId ? te.update(t) : te.add(e, t);
});
}
const te = {
/**
* add a toast
* @param _ ..
* @param opts toast props
*/
add(e, t) {
const { containerId: s = "" } = t;
s && (j[s] = j[s] || [], j[s].find((o) => o.toastId === t.toastId) || setTimeout(() => {
var o, i;
t.newestOnTop ? (o = j[s]) == null || o.unshift(t) : (i = j[s]) == null || i.push(t), t.onOpen && t.onOpen(ks(t));
}, t.delay || 0));
},
/**
* remove a toast
* @param id toastId
*/
remove(e) {
if (e) {
const t = oo(e);
if (t) {
const s = j[t];
let o = s.find((i) => i.toastId === e);
j[t] = s.filter((i) => i.toastId !== e), !j[t].length && !ao(t) && os(t, !1), lo(), cs(() => {
o != null && o.onClose && (o.onClose(ks(o)), o = void 0);
});
}
}
},
/**
* update the toast
* @param opts toast props
*/
update(e = {}) {
const { containerId: t = "" } = e;
if (t && e.updateId) {
j[t] = j[t] || [];
const s = j[t].find((n) => n.toastId === e.toastId), o = s?.position !== e.position || s?.transition !== e.transition, i = {
...e,
disabledEnterTransition: !o,
updateId: void 0
};
te.dismissForce(e?.toastId), setTimeout(() => {
R(i.content, i);
}, e.delay || 0);
}
},
/**
* clear all toasts in container.
* @param containerId container id
*/
clear(e, t = !0) {
e ? os(e, t) : so(t);
},
dismissCallback(e) {
var t;
const s = (t = e.currentTarget) == null ? void 0 : t.id, o = document.getElementById(s);
o && (o.removeEventListener("animationend", te.dismissCallback, !1), setTimeout(() => {
te.remove(s);
}));
},
dismiss(e) {
if (e) {
const t = xe();
for (const s of t)
if (s.toastId === e) {
Ws(s, (o) => {
o.addEventListener("animationend", te.dismissCallback, !1);
});
break;
}
}
},
dismissForce(e) {
if (e) {
const t = xe();
for (const s of t)
if (s.toastId === e) {
const o = document.getElementById(e);
o && (o.remove(), o.removeEventListener("animationend", te.dismissCallback, !1), te.remove(e));
break;
}
}
}
}, uo = De({ useHandler: void 0 }), Xs = De({}), Bt = De({});
function Ys() {
return Math.random().toString(36).substring(2, 9);
}
function co(e) {
return typeof e == "number" && !isNaN(e);
}
function as(e) {
return typeof e == "string";
}
function Re(e) {
return typeof e == "function";
}
function Nt(...e) {
return ee(...e);
}
function St(e) {
return typeof e == "object" && (!!(e != null && e.render) || !!(e != null && e.setup) || typeof e?.type == "object");
}
function fo(e = {}) {
Xs[`${I.CSS_NAMESPACE}-default-options`] = e;
}
function ho() {
return Xs[`${I.CSS_NAMESPACE}-default-options`] || Ks;
}
function po() {
const e = window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches;
return document.documentElement.classList.contains("dark") || e ? "dark" : "light";
}
var Ot = /* @__PURE__ */ ((e) => (e[e.Enter = 0] = "Enter", e[e.Exit = 1] = "Exit", e))(Ot || {});
const Zs = {
containerId: {
type: [String, Number],
required: !1,
default: ""
},
clearOnUrlChange: {
type: Boolean,
required: !1,
default: !0
},
disabledEnterTransition: {
type: Boolean,
required: !1,
default: !1
},
dangerouslyHTMLString: {
type: Boolean,
required: !1,
default: !1
},
multiple: {
type: Boolean,
required: !1,
default: !0
},
limit: {
type: Number,
required: !1,
default: void 0
},
position: {
type: String,
required: !1,
default: bt.TOP_LEFT
},
bodyClassName: {
type: String,
required: !1,
default: ""
},
autoClose: {
type: [Number, Boolean],
required: !1,
default: !1
},
closeButton: {
type: [Boolean, Function, Object],
required: !1,
default: void 0
},
transition: {
type: [String, Object],
required: !1,
default: "bounce"
},
hideProgressBar: {
type: Boolean,
required: !1,
default: !1
},
pauseOnHover: {
type: Boolean,
required: !1,
default: !0
},
pauseOnFocusLoss: {
type: Boolean,
required: !1,
default: !0
},
closeOnClick: {
type: Boolean,
required: !1,
default: !0
},
progress: {
type: Number,
required: !1,
default: void 0
},
progressClassName: {
type: String,
required: !1,
default: ""
},
toastStyle: {
type: Object,
required: !1,
default() {
return {};
}
},
progressStyle: {
type: Object,
required: !1,
default() {
return {};
}
},
role: {
type: String,
required: !1,
default: "alert"
},
theme: {
type: String,
required: !1,
default: ze.AUTO
},
content: {
type: [String, Object, Function],
required: !1,
default: ""
},
toastId: {
type: [String, Number],
required: !1,
default: ""
},
data: {
type: [Object, String],
required: !1,
default() {
return {};
}
},
type: {
type: String,
required: !1,
default: Y.DEFAULT
},
icon: {
type: [Boolean, String, Number, Object, Function],
required: !1,
default: void 0
},
delay: {
type: Number,
required: !1,
default: void 0
},
onOpen: {
type: Function,
required: !1,
default: void 0
},
onClose: {
type: Function,
required: !1,
default: void 0
},
onClick: {
type: Function,
required: !1,
default: void 0
},
isLoading: {
type: Boolean,
required: !1,
default: void 0
},
rtl: {
type: Boolean,
required: !1,
default: !1
},
toastClassName: {
type: String,
required: !1,
default: ""
},
updateId: {
type: [String, Number],
required: !1,
default: ""
},
contentProps: {
type: Object,
required: !1,
default: null
},
expandCustomProps: {
type: Boolean,
required: !1,
default: !1
}
}, go = {
autoClose: {
type: [Number, Boolean],
required: !0
},
isRunning: {
type: Boolean,
required: !1,
default: void 0
},
type: {
type: String,
required: !1,
default: Y.DEFAULT
},
theme: {
type: String,
required: !1,
default: ze.AUTO
},
hide: {
type: Boolean,
required: !1,
default: void 0
},
className: {
type: [String, Function],
required: !1,
default: ""
},
controlledProgress: {
type: Boolean,
required: !1,
default: void 0
},
rtl: {
type: Boolean,
required: !1,
default: void 0
},
isIn: {
type: Boolean,
required: !1,
default: void 0
},
progress: {
type: Number,
required: !1,
default: void 0
},
closeToast: {
type: Function,
required: !1,
default: void 0
}
}, mo = /* @__PURE__ */ _({
name: "ProgressBar",
props: go,
// @ts-ignore
setup(e, {
attrs: t
}) {
const s = W(), o = q(() => e.hide ? "true" : "false"), i = q(() => ({
...t.style || {},
animationDuration: `${e.autoClose === !0 ? 5e3 : e.autoClose}ms`,
animationPlayState: e.isRunning ? "running" : "paused",
opacity: e.hide || e.autoClose === !1 ? 0 : 1,
transform: e.controlledProgress ? `scaleX(${e.progress})` : "none"
})), n = q(() => [`${I.CSS_NAMESPACE}__progress-bar`, e.controlledProgress ? `${I.CSS_NAMESPACE}__progress-bar--controlled` : `${I.CSS_NAMESPACE}__progress-bar--animated`, `${I.CSS_NAMESPACE}__progress-bar-theme--${e.theme}`, `${I.CSS_NAMESPACE}__progress-bar--${e.type}`, e.rtl ? `${I.CSS_NAMESPACE}__progress-bar--rtl` : null].filter(Boolean).join(" ")), a = q(() => `${n.value} ${t?.class || ""}`), l = () => {
s.value && (s.value.onanimationend = null, s.value.ontransitionend = null);
}, r = () => {
e.isIn && e.closeToast && e.autoClose !== !1 && (e.closeToast(), l());
}, w = q(() => e.controlledProgress ? null : r), g = q(() => e.controlledProgress ? r : null);
return lt(() => {
s.value && (l(), s.value.onanimationend = w.value, s.value.ontransitionend = g.value);
}), () => L("div", {
ref: s,
role: "progressbar",
"aria-hidden": o.value,
"aria-label": "notification timer",
class: a.value,
style: i.value
}, null);
}
}), bo = /* @__PURE__ */ _({
name: "CloseButton",
inheritAttrs: !1,
props: {
theme: {
type: String,
required: !1,
default: ze.AUTO
},
type: {
type: String,
required: !1,
default: ze.LIGHT
},
ariaLabel: {
type: String,
required: !1,
default: "close"
},
closeToast: {
type: Function,
required: !1,
default: void 0
}
},
setup(e) {
return () => L("button", {
class: `${I.CSS_NAMESPACE}__close-button ${I.CSS_NAMESPACE}__close-button--${e.theme}`,
type: "button",
onClick: (t) => {
t.stopPropagation(), e.closeToast && e.closeToast(t);
},
"aria-label": e.ariaLabel
}, [L("svg", {
"aria-hidden": "true",
viewBox: "0 0 14 16"
}, [L("path", {
"fill-rule": "evenodd",
d: "M7.71 8.23l3.75 3.75-1.48 1.48-3.75-3.75-3.75 3.75L1 11.98l3.75-3.75L1 4.48 2.48 3l3.75 3.75L9.98 3l1.48 1.48-3.75 3.75z"
}, null)])]);
}
}), Vt = ({
theme: e,
type: t,
path: s,
...o
}) => L("svg", ee({
viewBox: "0 0 24 24",
width: "100%",
height: "100%",
fill: e === "colored" ? "currentColor" : `var(--toastify-icon-color-${t})`
}, o), [L("path", {
d: s
}, null)]);
function vo(e) {
return L(Vt, ee(e, {
path: "M23.32 17.191L15.438 2.184C14.728.833 13.416 0 11.996 0c-1.42 0-2.733.833-3.443 2.184L.533 17.448a4.744 4.744 0 000 4.368C1.243 23.167 2.555 24 3.975 24h16.05C22.22 24 24 22.044 24 19.632c0-.904-.251-1.746-.68-2.44zm-9.622 1.46c0 1.033-.724 1.823-1.698 1.823s-1.698-.79-1.698-1.822v-.043c0-1.028.724-1.822 1.698-1.822s1.698.79 1.698 1.822v.043zm.039-12.285l-.84 8.06c-.057.581-.408.943-.897.943-.49 0-.84-.367-.896-.942l-.84-8.065c-.057-.624.25-1.095.779-1.095h1.91c.528.005.84.476.784 1.1z"
}), null);
}
function yo(e) {
return L(Vt, ee(e, {
path: "M12 0a12 12 0 1012 12A12.013 12.013 0 0012 0zm.25 5a1.5 1.5 0 11-1.5 1.5 1.5 1.5 0 011.5-1.5zm2.25 13.5h-4a1 1 0 010-2h.75a.25.25 0 00.25-.25v-4.5a.25.25 0 00-.25-.25h-.75a1 1 0 010-2h1a2 2 0 012 2v4.75a.25.25 0 00.25.25h.75a1 1 0 110 2z"
}), null);
}
function wo(e) {
return L(Vt, ee(e, {
path: "M12 0a12 12 0 1012 12A12.014 12.014 0 0012 0zm6.927 8.2l-6.845 9.289a1.011 1.011 0 01-1.43.188l-4.888-3.908a1 1 0 111.25-1.562l4.076 3.261 6.227-8.451a1 1 0 111.61 1.183z"
}), null);
}
function ko(e) {
return L(Vt, ee(e, {
path: "M11.983 0a12.206 12.206 0 00-8.51 3.653A11.8 11.8 0 000 12.207 11.779 11.779 0 0011.8 24h.214A12.111 12.111 0 0024 11.791 11.766 11.766 0 0011.983 0zM10.5 16.542a1.476 1.476 0 011.449-1.53h.027a1.527 1.527 0 011.523 1.47 1.475 1.475 0 01-1.449 1.53h-.027a1.529 1.529 0 01-1.523-1.47zM11 12.5v-6a1 1 0 012 0v6a1 1 0 11-2 0z"
}), null);
}
function Co() {
return L("div", {
class: `${I.CSS_NAMESPACE}__spinner`
}, null);
}
const $t = {
info: yo,
warning: vo,
success: wo,
error: ko,
spinner: Co
}, Eo = (e) => e in $t;
function So({
theme: e,
type: t,
isLoading: s,
icon: o
}) {
let i;
const n = !!s || t === "loading", a = {
theme: e,
type: t
};
if (n && (o === void 0 || typeof o == "boolean")) return $t.spinner();
if (o !== !1) {
if (St(o))
i = ne(o);
else if (Re(o)) {
const l = o;
a.type = n ? "loading" : t, i = l(a), i = !i && n ? $t.spinner() : i;
} else qs(o) ? i = ki(o, a) : as(o) || co(o) ? i = o : Eo(t) && (i = $t[t](a));
return i;
}
}
const Oo = () => {
};
function $o(e, t, s = I.COLLAPSE_DURATION) {
const { scrollHeight: o, style: i } = e, n = s;
requestAnimationFrame(() => {
i.minHeight = "initial", i.height = o + "px", i.transition = `all ${n}ms`, requestAnimationFrame(() => {
i.height = "0", i.padding = "0", i.margin = "0", setTimeout(t, n);
});
});
}
function To(e) {
const t = W(!1), s = W(!1), o = W(!1), i = W(Ot.Enter), n = De({
...e,
appendPosition: e.appendPosition || !1,
collapse: typeof e.collapse > "u" ? !0 : e.collapse,
collapseDuration: e.collapseDuration || I.COLLAPSE_DURATION
}), a = n.done || Oo, l = q(() => n.appendPosition ? `${n.enter}--${n.position}` : n.enter), r = q(() => n.appendPosition ? `${n.exit}--${n.position}` : n.exit), w = q(() => e.pauseOnHover ? {
onMouseenter: F,
onMouseleave: S
} : {});
function g() {
const y = l.value.split(" ");
b().addEventListener(
ss.ENTRANCE_ANIMATION_END,
S,
{ once: !0 }
);
const $ = (N) => {
const Te = b();
N.target === Te && (Te.dispatchEvent(new Event(ss.ENTRANCE_ANIMATION_END)), Te.removeEventListener("animationend", $), Te.removeEventListener("animationcancel", $), i.value === Ot.Enter && N.type !== "animationcancel" && Te.classList.remove(...y));
}, B = () => {
const N = b();
N.classList.add(...y), N.addEventListener("animationend", $), N.addEventListener("animationcancel", $);
};
e.pauseOnFocusLoss && m(), B();
}
function C() {
if (!b()) return;
const y = () => {
const B = b();
B.removeEventListener("animationend", y), n.collapse ? $o(B, a, n.collapseDuration) : a();
}, $ = () => {
const B = b();
i.value = Ot.Exit, B && (B.className += ` ${r.value}`, B.addEventListener("animationend", y));
};
s.value || (o.value ? y() : setTimeout($));
}
function b() {
return e.toastRef.value;
}
function m() {
document.hasFocus() || F(), window.addEventListener("focus", S), window.addEventListener("blur", F);
}
function A() {
window.removeEventListener("focus", S), window.removeEventListener("blur", F);
}
function S() {
(!e.loading.value || e.isLoading === void 0) && (t.value = !0);
}
function F() {
t.value = !1;
}
function se(y) {
y && (y.stopPropagation(), y.preventDefault()), s.value = !1;
}
return lt(C), lt(() => {
const y = xe();
s.value = y.findIndex(($) => $.toastId === n.toastId) > -1;
}), lt(() => {
e.isLoading !== void 0 && (e.loading.value ? F() : S());
}), Mt(g), fs(() => {
e.pauseOnFocusLoss && A();
}), {
isIn: s,
isRunning: t,
hideToast: se,
eventHandlers: w
};
}
const Lo = /* @__PURE__ */ _({
name: "ToastItem",
inheritAttrs: !1,
props: Zs,
// @ts-ignore
setup(e) {
const t = W(), s = q(() => !!e.isLoading), o = q(() => e.progress !== void 0 && e.progress !== null), i = q(() => So(e)), n = q(() => [`${I.CSS_NAMESPACE}__toast`, `${I.CSS_NAMESPACE}__toast-theme--${e.theme}`, `${I.CSS_NAMESPACE}__toast--${e.type}`, e.rtl ? `${I.CSS_NAMESPACE}__toast--rtl` : void 0, e.toastClassName || ""].filter(Boolean).join(" ")), {
isRunning: a,
isIn: l,
hideToast: r,
eventHandlers: w
} = To({
toastRef: t,
loading: s,
done: () => {
te.remove(e.toastId);
},
...Gs(e.transition, e.disabledEnterTransition),
...e
});
return () => L("div", ee({
id: e.toastId,
class: n.value,
style: e.toastStyle || {},
ref: t,
"data-testid": `toast-item-${e.toastId}`,
onClick: (g) => {
e.closeOnClick && r(), e.onClick && e.onClick(g);
}
}, w.value), [L("div", {
role: e.role,
"data-testid": "toast-body",
class: `${I.CSS_NAMESPACE}__toast-body ${e.bodyClassName || ""}`
}, [i.value != null && L("div", {
"data-testid": `toast-icon-${e.type}`,
class: [`${I.CSS_NAMESPACE}__toast-icon`, e.isLoading ? "" : `${I.CSS_NAMESPACE}--animate-icon ${I.CSS_NAMESPACE}__zoom-enter`].join(" ")
}, [St(i.value) ? vt(ne(i.value), {
theme: e.theme,
type: e.type
}) : Re(i.value) ? i.value({
theme: e.theme,
type: e.type
}) : i.value]), L("div", {
"data-testid": "toast-content"
}, [St(e.content) ? vt(ne(e.content), {
toastProps: ne(e),
closeToast: r,
data: e.data,
...e.expandCustomProps ? e.contentProps : {
contentProps: e.contentProps || {}
}
}) : Re(e.content) ? e.content({
toastProps: ne(e),
closeToast: r,
data: e.data
}) : e.dangerouslyHTMLString ? vt("div", {
innerHTML: e.content
}) : e.content])]), (e.closeButton === void 0 || e.closeButton === !0) && L(bo, {
theme: e.theme,
closeToast: (g) => {
g.stopPropagation(), g.preventDefault(), r();
}
}, null), St(e.closeButton) ? vt(ne(e.closeButton), {
closeToast: r,
type: e.type,
theme: e.theme
}) : Re(e.closeButton) ? e.closeButton({
closeToast: r,
type: e.type,
theme: e.theme
}) : null, L(mo, {
className: e.progressClassName,
style: e.progressStyle,
rtl: e.rtl,
theme: e.theme,
isIn: l.value,
type: e.type,
hide: e.hideProgressBar,
isRunning: a.value,
autoClose: e.autoClose,
controlledProgress: o.value,
progress: e.progress,
closeToast: e.isLoading ? void 0 : r
}, null)]);
}
});
let dt = 0;
function Js() {
typeof window > "u" || (dt && window.cancelAnimationFrame(dt), dt = window.requestAnimationFrame(Js), Bt.lastUrl !== window.location.href && (Bt.lastUrl = window.location.href, te.clear()));
}
const Ao = /* @__PURE__ */ _({
name: "ToastifyContainer",
inheritAttrs: !1,
props: Zs,
// @ts-ignore
setup(e) {
const t = q(() => e.containerId), s = q(() => j[t.value] || []), o = q(() => s.value.filter((i) => i.position === e.position));
return Mt(() => {
typeof window < "u" && e.clearOnUrlChange && window.requestAnimationFrame(Js);
}), fs(() => {
typeof window < "u" && dt && (window.cancelAnimationFrame(dt), Bt.lastUrl = "");
}), () => L(X, null, [o.value.map((i) => {
const {
toastId: n = ""
} = i;
return L(Lo, ee({
key: n
}, i), null);
})]);
}
});
let Ht = !1;
const Qs = {
isLoading: !0,
autoClose: !1,
closeOnClick: !1,
closeButton: !1,
draggable: !1
};
function ei() {
const e = [];
return xe().forEach((t) => {
const s = document.getElementById(t.containerId);
s && !s.classList.contains(Pt) && e.push(t);
}), e;
}
function Bo(e) {
const t = ei().length, s = e ?? 0;
return s > 0 && t + pe.items.length >= s;
}
function Io(e) {
Bo(e.limit) && !e.updateId && pe.items.push({
toastId: e.toastId,
containerId: e.containerId,
toastContent: e.content,
toastProps: e
});
}
function Oe(e, t, s = {}) {
if (Ht) return;
s = Nt(ho(), {
type: t
}, ne(s)), (!s.toastId || typeof s.toastId != "string" && typeof s.toastId != "number") && (s.toastId = Ys()), s = {
...s,
...s.type === "loading" ? Qs : {},
content: e,
containerId: s.containerId || String(s.position)
};
const o = Number(s?.progress);
return !isNaN(o) && o < 0 && (s.progress = 0), o > 1 && (s.progress = 1), s.theme === "auto" && (s.theme = po()), Io(s), Bt.lastUrl = window.location.href, s.multiple ? pe.items.length ? s.updateId && Et(e, s) : Et(e, s) : (Ht = !0, R.clearAll(void 0, !1), setTimeout(() => {
Et(e, s);
}, 0), setTimeout(() => {
Ht = !1;
}, 390)), s.toastId;
}
const R = (e, t) => Oe(e, Y.DEFAULT, t);
R.info = (e, t) => Oe(e, Y.DEFAULT, {
...t,
type: Y.INFO
});
R.error = (e, t) => Oe(e, Y.DEFAULT, {
...t,
type: Y.ERROR
});
R.warning = (e, t) => Oe(e, Y.DEFAULT, {
...t,
type: Y.WARNING
});
R.warn = R.warning;
R.success = (e, t) => Oe(e, Y.DEFAULT, {
...t,
type: Y.SUCCESS
});
R.loading = (e, t) => Oe(e, Y.DEFAULT, Nt(t, Qs));
R.dark = (e, t) => Oe(e, Y.DEFAULT, Nt(t, {
theme: ze.DARK
}));
R.remove = (e) => {
e ? te.dismiss(e) : te.clear();
};
R.clearAll = (e, t) => {
cs(() => {
te.clear(e, t);
});
};
R.isActive = (e) => {
let t = !1;
return t = ei().findIndex((s) => s.toastId === e) > -1, t;
};
R.update = (e, t = {}) => {
setTimeout(() => {
const s = ro(e);
if (s) {
const o = ne(s), {
content: i
} = o, n = {
...o,
...t,
toastId: t.toastId || e,
updateId: Ys()
}, a = n.render || i;
delete n.render, Oe(a, n.type, n);
}
}, 0);
};
R.done = (e) => {
R.update(e, {
isLoading: !1,
progress: 1
});
};
R.promise = Do;
function Do(e, {
pending: t,
error: s,
success: o
}, i) {
var n, a, l;
let r;
const w = {
...i || {},
autoClose: !1
};
t && (r = as(t) ? R.loading(t, w) : R.loading(t.render, {
...w,
...t
}));
const g = {
autoClose: (n = i?.autoClose) != null ? n : !0,
closeOnClick: (a = i?.closeOnClick) != null ? a : !0,
closeButton: (l = i?.autoClose) != null ? l : null,
isLoading: void 0,
draggable: null,
delay: 100
}, C = (m, A, S) => {
if (A == null) {
R.remove(r);
return;
}
const F = {
type: m,
...g,
...i,
data: S
}, se = as(A) ? {
render: A
} : A;
return r ? R.update(r, {
...F,
...se,
isLoading: !1
}) : R(se.render, {
...F,
...se,
isLoading: !1
}), S;
}, b = Re(e) ? e() : e;
return b.then((m) => {
C("success", o, m);
}).catch((m) => {
C("error", s, m);
}), b;
}
R.POSITION = bt;
R.THEME = ze;
R.TYPE = Y;
R.TRANSITIONS = qi;
const Mo = {
install(e, t = {}) {
uo.useHandler = t.useHandler || (() => {
}), Po(t);
}
};
typeof window < "u" && (window.Vue3Toastify = Mo);
function Po(e = {}) {
const t = Nt(Ks, e);
fo(t);
}
const No = { class: "dsg-alert__wrapper" }, Vo = ["innerHTML"], Ro = /* @__PURE__ */ _({
__name: "DsgAlertComponent",
props: {
contentProps: { default: () => ({ title: "", message: "", type: "gray", hasCloseButton: !0 }) }
},
setup(e) {
const t = ["dsg-alert", "dsg-alert--" + e.contentProps.type, e.contentProps.hasCloseButton ? "dsg-alert--has-close" : "dsg-alert--no-close"], o = Ci().closeToast, i = () => {
o();
};
return (n, a) => (c(), v("div", {
class: V(t)
}, [
n.contentProps.type === "gray" ? (c(), M(Ne, {
key: 0,
icon: { icon: "info-circle" },
type: "outline",
theme: "gray",
size: "lg"
})) : k("", !0),
n.contentProps.type === "error" ? (c(), M(Ne, {
key: 1,
icon: { icon: "alert-circle" },
type: "outline",
theme: "error",
size: "lg"
})) : k("", !0),
n.contentProps.type === "warning" ? (c(), M(Ne, {
key: 2,
icon: { icon: "alert-circle" },
type: "outline",
theme: "warning",
size: "lg"
})) : k("", !0),
n.contentProps.type === "success" ? (c(), M(Ne, {
key: 3,
icon: { icon: "check-circle" },
type: "outline",
theme: "success",
size: "lg"
})) : k("", !0),
E("div", No, [
E("p", {
class: V(["dsg-alert__title", { "dsg-alert__title--with-close-button": n.contentProps.hasCloseButton }])
}, D(n.contentProps.title), 3),
n.contentProps.message ? (c(), v("p", {
key: 0,
innerHTML: n.contentProps.message,
class: "dsg-alert__message"
}, null, 8, Vo)) : k("", !0)
]),
n.contentProps.hasCloseButton ? (c(), v("button", {
key: 4,
onClick: i,
class: "dsg-alert__close-button"
}, [
L(G, {
icon: "x-close",
size: "sm"
})
])) : k("", !0)
]));
}
}), Uo = new class it {
info(t = "", s = "", o = {}) {
it.showToast("gray", t, s, o);
}
error(t = "", s = "", o = {}) {
it.showToast("error", t, s, o);
}
warning(t = "", s = "", o = {}) {
it.showToast("warning", t, s, o);
}
success(t = "", s = "", o = {}) {
it.showToast("success", t, s, o);
}
static showToast(t, s, o, i) {
const n = {
hasCloseButton: !1,
position: "top-right",
maxWidthClass: "",
...i
};
R(Ro, {
autoClose: !n.hasCloseButton,
closeButton: !1,
hideProgressBar: !0,
closeOnClick: !n.hasCloseButton,
position: n.position,
containerClassName: `dsg-alert-container ${n.maxWidthClass}`,
toastClassName: "dsg-alert",
bodyClassName: "dsg-alert--body",
contentProps: {
title: s,
message: o,
type: t,
hasCloseButton: n.hasCloseButton
},
onClick: () => {
}
});
}
}(), Ho = { class: "dsg-badge--before" }, zo = {
key: 2,
class: "dsg-badge--dot"
}, xo = {
key: 1,
class: "dsg-badge--label"
}, Fo = { class: "dsg-badge--after" }, qo = {
key: 1,
class: "dsg-badge--close-wrapper"
}, ti = /* @__PURE__ */ _({
__name: "DsgBadge",
props: {
label: { default: "" },
classes: { default: "" },
type: { default: "standard" },
size: { default: "md" },
hasClose: { type: Boolean, default: !1 },
avatarUri: { default: "" },
iconBefore: { default: "" },
icon: { default: "" },
iconAfter: { default: "" },
iconOnly: { type: Boolean, default: !1 },
hasDot: { type: Boolean, default: !1 },
theme: { default: "badge-modern" },
themeColor: { default: "gray" },
destroyOnClose: { type: Boolean, default: !1 }
},
emits: ["before-hide", "after-hide", "before-destroy", "after-destroy", "on-click"],
setup(e, { expose: t, emit: s }) {
const o = e.iconBefore || e.iconAfter || e.type === "add" || e.type === "icon", i = [
"dsg-badge",
`dsg-badge--${e.size}`,
`dsg-badge--${e.type}`,
`dsg-badge--${e.theme}`,
`dsg-badge--${e.themeColor}`,
`dsg-badge--${e.iconOnly ? "icon-only" : "label"}`,
`${e.hasClose ? "dsg-badge--has-close" : ""}`,
`${e.avatarUri ? "dsg-badge--has-avatar" : ""}`,
`${e.hasDot ? "dsg-badge--has-dot" : ""}`,
`${o ? "dsg-badge--has-icon" : ""}`,
`${e.iconBefore ? "dsg-badge--has-icon-before" : ""}`,
`${e.iconAfter ? "dsg-badge--has-icon-after" : ""}`,
e.classes
].join(" ").replaceAll(/\s+/g, " ").trim();
(e.type === "add" || e.type === "icon") && (e.label || e.avatarUri || e.hasDot || e.iconBefore || e.iconAfter || e.hasClose) && e.theme !== "badge-modern" && e.themeColor && new fe(
"DsgBadge: 'add'/'icon' type badges should only be called with 'size', 'theme' and 'themeColor' props. Note that 'themeColor' prop is discarded for theme 'badge-modern'."
), [e.avatarUri, e.iconBefore, e.hasDot].filter(Boolean).length > 1 && new fe("DsgBadge: 'avatarUri', 'iconBefore' and 'hasDot' props are mutually exclusive. Please use only one of them."), [e.iconAfter, e.hasClose].filter(Boolean).length > 1 && new fe("DsgBadge: 'iconAfter' and 'hasClose' props are mutually exclusive. Please use only one of them.");
const l = s, r = be("dsgBadge"), w = (C) => {
e.destroyOnClose ? (l("before-destroy", r.value), r.value?.remove(), l("after-destroy")) : (l("before-hide", r.value), r.value && (r.value.style.display = "none"), l("after-hide", r.value));
}, g = (C) => {
l("on-click", r.value);
};
return t({
/**
* Hide or Destroy the badge based on the 'destroyOnClose' prop
*
* @param {Event} clickEvent - The click event
* @returns void
*/
hideOrDestroy: w,
/**
* Click Event handler for the badge to manually trigger the 'on-click' event
*
* @param {Event} clickEvent - The click event
* @returns void
*/
clickEvent: g
}), (C, b) => (c(), v("div", {
class: V(ae(i)),
ref: "dsgBadge",
onClick: g
}, [
C.type === "standard" ? T(C.$slots, "dsg-badge--before", { key: 0 }, () => [
E("div", Ho, [
C.avatarUri ? (c(), M(ct, {
key: 0,
"profile-uri": C.avatarUri,
class: "dsg-badge--avatar",
size: "xxs"
}, null, 8, ["profile-uri"])) : k("", !0),
C.iconBefore ? (c(), M(G, {
key: 1,
icon: C.iconBefore,
size: "xxs",
class: "dsg-badge--icon-before dsg-badge--icon"
}, null, 8, ["icon"])) : k("", !0),
C.hasDot ? (c(), v("span", zo)) : k("", !0)
])
]) : k("", !0),
C.type === "standard" ? (c(), v("label", xo, D(C.label), 1)) : k("", !0),
C.type === "add" ? (c(), M(G, {
key: 2,
icon: "plus",
size: "xxs",
class: "dsg-badge--icon-add dsg-badge--icon"
})) : k("", !0),
C.type === "icon" ? (c(), M(G, {
key: 3,
icon: C.icon,
size: "xxs",
class: "dsg-badge--icon-icon dsg-badge--icon"
}, null, 8, ["icon"])) : k("", !0),
C.type === "standard" ? T(C.$slots, "dsg-badge--after", { key: 4 }, () => [
E("div", Fo, [
C.iconAfter ? (c(), M(G, {
key: 0,
icon: C.iconAfter,
size: "xxs",
class: "dsg-badge--icon-after dsg-badge--icon"
}, null, 8, ["icon"])) : k("", !0),
C.hasClose ? (c(), v("span", qo, [
C.hasClose ? (c(), M(G, {
key: 0,
icon: "x-close",
class: "dsg-badge--close",
size: "xxs",
onClick: w
})) : k("", !0)
])) : k("", !0)
])
]) : k("", !0)
], 2));
}
}), _o = {
key: 0,
class: "dsg-checkbox-group--form-wrapper"
}, jo = { class: "dsg-checkbox-group--header" }, Ko = { class: "dsg-checkbox-group--header-title-wrapper" }, Go = { class: "dsg-checkbox-group--title" }, Wo = ["innerHTML"], Xo = { class: "dsg-checkbox-group--options" }, Yo = ["onClick"], Zo = { class: "dsg-checkbox-group--panel-left" }, Jo = ["textContent"], Qo = ["innerHTML", "data"], en = /* @__PURE__ */ _({
__name: "DsgCheckboxGroup",
props: /* @__PURE__ */ Lt({
size: { default: "md" },
theme: { default: "form" },
title: { default: "" },
subtext: { default: "" },
options: { default: () => [] },
tooltip: { default: null },
defaultValue: { type: [String, Number, Boolean, Array, null], default: () => [] }
}, {
modelValue: { type: [String, Number, Boolean, Array, null], default: [] },
modelModifiers: {}
}),
emits: ["update:modelValue"],
setup(e) {
const t = At(e, "modelValue"), s = ["dsg-checkbox-group", `dsg-checkbox-group--${e.size}`, `dsg-checkbox-group--theme-${e.theme}`], o = (i, n) => {
i.target instanceof HTMLAnchorElement || (t.value = n.value);
};
return (i, n) => {
const a = Ei("key");
return c(), v("div", {
class: V(s)
}, [
["form", "form-radio"].includes(i.theme) ? (c(), v("div", _o, [
E("div", jo, [
T(i.$slots, "dsg-checkbox-group--header", {}, () => [
E("div", Ko, [
E("h3", Go, D(i.title), 1),
i.tooltip ? (c(), M(xs, {
key: 0,
label: i.tooltip,
position: "top",
triggers: ["hover"],
"auto-hide": !0,
theme: "dark",
class: "dsg-checkbox-group--tooltip"
}, null, 8, ["label"])) : k("", !0)
]),
i.subtext ? (c(), v("p", {
key: 0,
class: "dsg-checkbox-group--subtext",
innerHTML: i.subtext
}, null, 8, Wo)) : k("", !0)
])
]),
E("div", Xo, [
(c(!0), v(X, null, le(i.options, (l, r) => (c(), v("div", {
key: r,
class: "dsg-checkbox-group--option"
}, [
L(Tt, {
label: l.label,
value: l.value,
disabled: l.disabled,
size: "sm",
type: ["form", "panel"].includes(i.theme) ? "checkbox" : "radio",
modelValue: t.value,
"onUpdate:modelValue": n[0] || (n[0] = (w) => t.value = w)
}, null, 8, ["label", "value", "disabled", "type", "modelValue"])
]))), 128))
])
])) : k("", !0),
["panel", "panel-content"].includes(i.theme) ? (c(!0), v(X, { key: 1 }, le(i.options, (l, r) => Ae((c(), v("div", {
class: V(["dsg-checkbox-group--panel", `dsg-checkbox-group--panel-${t.value === l.value ? "selected" : "unselected"}`]),
onClick: (w) => o(w, l)
}, [
E("div", Zo, [
T(i.$slots, `dsg-checkbox-group--panel-title--${String(l.value).trim().toLowerCase().replace(/[^0-9a-zA-Z]/g, "-").replace(/-+/g, "-")}`, { data: l }, () => [
l.icon ? (c(), M(G, {
key: 0,
icon: l.icon,
size: "xl"
}, null, 8, ["icon"])) : k("", !0),
E("h3", {
class: "dsg-checkbox-group--panel-title",
textContent: D(l.label)
}, null, 8, Jo)
]),
T(i.$slots, `dsg-checkbox-group--panel-subtext--${String(l.value).trim().toLowerCase().replace(/[^0-9a-zA-Z]/g, "-").replace(/-+/g, "-")}`, {}, () => [
l.subtext ? (c(), v("p", {
key: 0,
class: "dsg-checkbox-group--panel-subtext",
innerHTML: l.subtext,
data: l
}, null, 8, Qo)) : k("", !0)
])
]),
(c(), v("div", {
key: r,
class: "dsg-checkbox-group--panel-right"
}, [
L