@mozaic-ds/vue
Version:
Mozaic-Vue is the Vue.js implementation of ADEO Design system
1,410 lines • 343 kB
JavaScript
import { Fragment as e, computed as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createSlots as o, createTextVNode as s, createVNode as c, defineComponent as l, guardReactiveProps as u, inject as d, mergeModels as f, mergeProps as p, nextTick as m, normalizeClass as h, normalizeProps as g, normalizeStyle as _, onBeforeUnmount as v, onMounted as y, onUnmounted as b, openBlock as x, provide as S, ref as C, renderList as w, renderSlot as T, resolveDynamicComponent as E, toDisplayString as D, toHandlers as O, unref as k, useId as A, useModel as j, useSlots as M, useTemplateRef as N, vModelDynamic as P, vModelSelect as F, vModelText as ee, watch as I, withCtx as L, withDirectives as R, withKeys as te, withModifiers as z } from "vue";
//#region src/components/accordionlist/m-accordion-list.const.ts
var ne = Symbol(), re = Symbol(), ie = /*@__PURE__*/ l({
__name: "MAccordionList",
props: {
appearance: { default: "standard" },
behavior: { default: "multiple" },
modelValue: {}
},
emits: ["update:modelValue"],
setup(e, { emit: n }) {
let r = e, a = t(() => ({ [`mc-accordion--${r.appearance}`]: r.appearance && r.appearance != "standard" })), o = n, s = t({
get() {
return r.modelValue || [];
},
set(e) {
o("update:modelValue", e);
}
});
function c(e) {
if (r.behavior === "single") s.value = s.value?.[0] === e ? [] : [e];
else {
let t = /* @__PURE__ */ new Set([...s.value]);
s.value?.includes(e) ? t.delete(e) : t.add(e), s.value = [...t];
}
}
return S(ne, s), S(re, c), (e, t) => (x(), i("div", { class: h(["mc-accordion", a.value]) }, [T(e.$slots, "default", {}, void 0, !0)], 2));
}
}), B = (e, t) => {
let n = e.__vccOpts || e;
for (let [e, r] of t) n[e] = r;
return n;
}, ae = /*#__PURE__*/ B(ie, [["__scopeId", "data-v-ee9f6d4f"]]), oe = { class: "mc-accordion__item" }, se = { class: "mc-accordion__header" }, ce = [
"id",
"aria-controls",
"aria-expanded"
], le = { class: "mc-accordion__title-wrapper" }, ue = {
key: 0,
class: "mc-accordion__subtitle"
}, de = [
"id",
"inert",
"aria-labelledby"
], fe = { key: 0 }, pe = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MAccordionListItem",
props: {
id: {},
title: {},
subtitle: {},
content: {},
icon: {},
tag: { default: "h2" }
},
setup(e) {
let o = e, s = d(ne), c = d(re), l = t(() => s.value.includes(o.id));
return (t, o) => (x(), i("div", oe, [a("div", se, [(x(), n(E(e.tag), { class: "mc-accordion__title" }, {
default: L(() => [a("button", {
id: `accordion-${e.id}`,
class: "mc-accordion__trigger",
"aria-controls": `content-${e.id}`,
"aria-expanded": l.value,
onClick: o[0] ||= (t) => k(c)(e.id)
}, [e.icon ? (x(), n(E(e.icon), {
key: 0,
class: "mc-accordion__icon"
})) : r("", !0), a("div", le, [a("span", null, D(e.title), 1), e.subtitle ? (x(), i("span", ue, D(e.subtitle), 1)) : r("", !0)])], 8, ce)]),
_: 1
}))]), a("div", {
id: `content-${e.id}`,
class: h({
"mc-accordion__content": !0,
"mc-accordion__content--open": l.value
}),
inert: !l.value || void 0,
"aria-labelledby": `accordion-${e.id}`,
role: "region"
}, [T(t.$slots, "default", {}, () => [e.content ? (x(), i("p", fe, D(e.content), 1)) : r("", !0)], !0)], 10, de)]));
}
}), [["__scopeId", "data-v-dbf031eb"]]), me = { class: "mc-divider" }, V = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MDivider",
props: {
orientation: { default: "horizontal" },
appearance: { default: "primary" },
size: { default: "s" }
},
setup(e) {
let n = e, r = t(() => ({
[`mc-divider-${n.orientation}`]: n.orientation,
[`mc-divider-horizontal--${n.appearance}`]: n.appearance && n.appearance != "primary",
[`mc-divider-horizontal--${n.size}`]: n.size && n.size != "s"
}));
return (e, t) => (x(), i("div", me, [a("div", { class: h(r.value) }, null, 2), T(e.$slots, "default", {}, void 0, !0)]));
}
}), [["__scopeId", "data-v-49acd035"]]), he = { class: "mc-action-bottom-bar__left" }, ge = { class: "mc-action-bottom-bar__right" }, _e = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MActionBottomBar",
props: { shadow: { type: Boolean } },
setup(e) {
return (t, n) => (x(), i("div", { class: h(["mc-action-bottom-bar", { "mc-action-bottom-bar--shadow": e.shadow }]) }, [
c(V, { class: "mc-action-bottom-bar__divider" }),
a("div", he, [T(t.$slots, "left", {}, void 0, !0)]),
a("div", ge, [T(t.$slots, "right", {}, void 0, !0)])
], 2));
}
}), [["__scopeId", "data-v-6e7cbeeb"]]), ve = { class: "mc-loader__spinner" }, ye = ["viewBox"], be = ["r"], xe = {
key: 0,
class: "mc-loader__text",
role: "status"
}, H = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MLoader",
props: {
appearance: { default: "standard" },
size: { default: "m" },
text: {}
},
setup(e) {
let n = e, o = t(() => ({
[`mc-loader--${n.size}`]: n.size && n.size !== "m",
[`mc-loader--${n.appearance}`]: n.appearance && n.appearance !== "standard",
"mc-loader--text-visible": n.text
})), s = t(() => {
let e;
switch (n.size) {
case "xs":
e = "0 0 20 20";
break;
case "s":
e = "0 0 24 24";
break;
case "l":
e = "0 0 64 64";
break;
default: e = "0 0 32 32";
}
return e;
}), c = t(() => {
let e;
switch (n.size) {
case "xs":
e = 6;
break;
case "s":
e = 6;
break;
case "l":
e = 19;
break;
default: e = 9;
}
return e;
});
return (t, n) => (x(), i("div", { class: h(["mc-loader", o.value]) }, [a("span", ve, [(x(), i("svg", {
class: "mc-loader__icon",
xmlns: "http://www.w3.org/2000/svg",
viewBox: s.value,
"aria-hidden": "true"
}, [a("circle", {
class: "mc-loader__path",
cx: "50%",
cy: "50%",
r: c.value
}, null, 8, be)], 8, ye))]), e.text ? (x(), i("p", xe, D(e.text), 1)) : r("", !0)], 2));
}
}), [["__scopeId", "data-v-a750e3dc"]]), Se = [
"disabled",
"type",
"aria-busy"
], Ce = {
key: 0,
class: "mc-button__icon",
style: { position: "absolute" }
}, we = {
key: 1,
class: "mc-button__icon"
}, U = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MIconButton",
props: {
appearance: { default: "standard" },
size: { default: "m" },
disabled: { type: Boolean },
ghost: { type: Boolean },
outlined: { type: Boolean },
type: { default: "button" },
isLoading: { type: Boolean }
},
setup(e) {
let n = e, r = t(() => ({
[`mc-button--${n.appearance}`]: n.appearance && n.appearance != "standard",
[`mc-button--${n.size}`]: n.size && n.size != "m",
"mc-button--ghost": n.ghost,
"mc-button--outlined": n.outlined
}));
return (t, n) => (x(), i("button", {
class: h(["mc-button mc-button--icon-button", r.value]),
disabled: e.disabled,
type: e.type,
"aria-busy": e.isLoading || void 0
}, [e.isLoading ? (x(), i("span", Ce, [c(H, {
style: { color: "currentColor" },
size: "s"
})])) : (x(), i("span", we, [T(t.$slots, "icon", {}, void 0, !0)]))], 10, Se));
}
}), [["__scopeId", "data-v-d8d3cde8"]]), Te = ["fill"], Ee = /* @__PURE__ */ l({
__name: "WarningTriangleFilled24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", { d: "M10.286 4.915c.776-1.295 2.652-1.294 3.43 0L20.95 16.97c.8 1.332-.162 3.029-1.716 3.029H4.767c-1.555 0-2.516-1.697-1.716-3.03l7.235-12.055ZM11.9 15a1 1 0 0 0 0 2h.2a1 1 0 0 0 0-2zm.1-6a1 1 0 0 0-1 1v3.5a1 1 0 0 0 2 0V10a1 1 0 0 0-1-1" }, null, -1)]], 8, Te));
}
}), De = ["fill"], Oe = /* @__PURE__ */ l({
__name: "WarningCircle32",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 32 32",
width: "32px",
height: "32px"
}, [...n[0] ||= [a("path", { d: "M16 3c7.18 0 13 5.82 13 13s-5.82 13-13 13S3 23.18 3 16 8.82 3 16 3m0 2C9.925 5 5 9.925 5 16s4.925 11 11 11 11-4.925 11-11S22.075 5 16 5m.134 15.333a1 1 0 0 1 0 2h-.267a1 1 0 1 1 0-2zM16 9.667a1 1 0 0 1 1 1v6.667a1 1 0 0 1-2 0v-6.667a1 1 0 0 1 1-1" }, null, -1)]], 8, De));
}
}), ke = ["fill"], Ae = /* @__PURE__ */ l({
__name: "WarningCircleFilled32",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 32 32",
width: "32px",
height: "32px"
}, [...n[0] ||= [a("path", { d: "M16 3c7.18 0 13 5.82 13 13s-5.82 13-13 13S3 23.18 3 16 8.82 3 16 3m-.133 17.333a1 1 0 0 0 0 2h.267a1 1 0 1 0 0-2zM16 9.667a1 1 0 0 0-1 1v6.667a1 1 0 0 0 2 0v-6.667a1 1 0 0 0-1-1" }, null, -1)]], 8, ke));
}
}), je = ["fill"], Me = /* @__PURE__ */ l({
__name: "ViewGridX424",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M2 3a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1zm2 1v5h5V4zm9-1a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1zm2 1v5h5V4zM2 14a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1zm2 1v5h5v-5zm9-1a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1zm2 1v5h5v-5z"
}, null, -1)]], 8, je));
}
}), Ne = ["fill"], Pe = /* @__PURE__ */ l({
__name: "Star24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M12 3a1 1 0 0 1 .916.598l2.178 4.969 5.055.76a1 1 0 0 1 .504 1.747l-3.923 3.378 1.435 5.286a1 1 0 0 1-1.509 1.101L12 17.823 7.344 20.84a1 1 0 0 1-1.509-1.101l1.435-5.286-3.923-3.379a1 1 0 0 1 .504-1.746l5.055-.76 2.178-4.969A1 1 0 0 1 12 3m0 3.49-1.484 3.385-.222.505-.545.083-3.445.518 2.749 2.366.477.412-.165.608-.915 3.373 3.006-1.948.544-.352.544.352 3.006 1.948-.915-3.373-.165-.608.477-.412 2.749-2.367-3.445-.517-.545-.083-.222-.505z"
}, null, -1)]], 8, Ne));
}
}), Fe = ["fill"], Ie = /* @__PURE__ */ l({
__name: "StarHalf24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M12.916 3.598a1 1 0 0 0-1.832 0L8.906 8.567l-5.055.76a1 1 0 0 0-.504 1.747l3.923 3.378-1.435 5.286a1 1 0 0 0 1.509 1.101L12 17.823l4.656 3.016a1 1 0 0 0 1.51-1.101l-1.436-5.286 3.923-3.379a1 1 0 0 0-.504-1.746l-5.055-.76zM12 6.49v8.95l.544.352 3.006 1.948-.915-3.373-.165-.608.477-.411 2.749-2.367-3.445-.518-.545-.082-.222-.506z"
}, null, -1)]], 8, Fe));
}
}), Le = ["fill"], Re = /* @__PURE__ */ l({
__name: "StarFilled24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M12.916 3.598a1 1 0 0 0-1.832 0L8.906 8.567l-5.055.76a1 1 0 0 0-.504 1.747l3.923 3.378-1.435 5.286a1 1 0 0 0 1.509 1.101L12 17.823l4.656 3.016a1 1 0 0 0 1.51-1.101l-1.436-5.286 3.923-3.379a1 1 0 0 0-.504-1.746l-5.055-.76z"
}, null, -1)]], 8, Le));
}
}), ze = ["fill"], Be = /* @__PURE__ */ l({
__name: "Search24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M8 11a5 5 0 1 1 10 0 5 5 0 0 1-10 0m5-7a7 7 0 0 0-5.606 11.192l-3.101 3.1a1 1 0 1 0 1.414 1.415l3.1-3.1A7 7 0 1 0 13 4"
}, null, -1)]], 8, ze));
}
}), Ve = ["fill"], He = /* @__PURE__ */ l({
__name: "More24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M13 5a1 1 0 1 0-2 0v6H5a1 1 0 1 0 0 2h6v6a1 1 0 1 0 2 0v-6h6a1 1 0 1 0 0-2h-6z"
}, null, -1)]], 8, Ve));
}
}), Ue = ["fill"], We = /* @__PURE__ */ l({
__name: "Menu24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M3 5a1 1 0 0 1 1-1h16a1 1 0 1 1 0 2H4a1 1 0 0 1-1-1m0 7a1 1 0 0 1 1-1h16a1 1 0 1 1 0 2H4a1 1 0 0 1-1-1m0 7a1 1 0 0 1 1-1h16a1 1 0 1 1 0 2H4a1 1 0 0 1-1-1"
}, null, -1)]], 8, Ue));
}
}), Ge = ["fill"], Ke = /* @__PURE__ */ l({
__name: "LogOut24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M3 2a1 1 0 0 0-1 1v18a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1v-4a1 1 0 1 0-2 0v3H4V4h8v3a1 1 0 1 0 2 0V3a1 1 0 0 0-1-1zm15.707 6.293a1 1 0 1 0-1.414 1.414L18.586 11H9a1 1 0 1 0 0 2h9.586l-1.293 1.293a1 1 0 0 0 1.414 1.414l3-3a1 1 0 0 0 0-1.414z"
}, null, -1)]], 8, Ge));
}
}), qe = ["fill"], Je = /* @__PURE__ */ l({
__name: "Less24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M6 12a1 1 0 0 1 1-1h10a1 1 0 1 1 0 2H7a1 1 0 0 1-1-1"
}, null, -1)]], 8, qe));
}
}), Ye = ["fill"], Xe = /* @__PURE__ */ l({
__name: "Less20",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 20 20",
width: "20px",
height: "20px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M5.083 10a.75.75 0 0 1 .75-.75h8.333a.75.75 0 1 1 0 1.5H5.833a.75.75 0 0 1-.75-.75"
}, null, -1)]], 8, Ye));
}
}), Ze = ["fill"], Qe = /* @__PURE__ */ l({
__name: "InfoCircleFilled32",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 32 32",
width: "32px",
height: "32px"
}, [...n[0] ||= [a("path", { d: "M16 3c7.18 0 13 5.82 13 13s-5.82 13-13 13S3 23.18 3 16 8.82 3 16 3m.608 10.874a1 1 0 0 0-.867-.173l-2 .536a1 1 0 0 0 .518 1.932l.741-.2v4.365h-1a1 1 0 0 0 0 2h4a1 1 0 0 0 0-2h-1v-5.667a1 1 0 0 0-.392-.793m-1.275-4.791a1.584 1.584 0 1 0 .002 3.168 1.584 1.584 0 0 0-.002-3.168" }, null, -1)]], 8, Ze));
}
}), $e = ["fill"], et = /* @__PURE__ */ l({
__name: "InfoCircleFilled24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", { d: "M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2m.608 8.207a1 1 0 0 0-.867-.173l-1.5.401a1.001 1.001 0 0 0 .518 1.933l.241-.065V15h-.5a1 1 0 0 0 0 2h3a1 1 0 1 0 0-2H13v-4a1 1 0 0 0-.392-.793M11.5 6.75a1.25 1.25 0 1 0 0 2.5 1.25 1.25 0 0 0 0-2.5" }, null, -1)]], 8, $e));
}
}), tt = ["fill"], nt = /* @__PURE__ */ l({
__name: "ExternalLink20",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 20 20",
width: "20px",
height: "20px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M10.084 4.167c0 .414.335.75.75.75h3.189l-6.22 6.22a.75.75 0 0 0 1.061 1.06l6.22-6.22v3.19a.75.75 0 1 0 1.5 0v-5a.75.75 0 0 0-.75-.75h-5a.75.75 0 0 0-.75.75m-5.917.916a.75.75 0 0 0-.75.75v10c0 .414.336.75.75.75h10a.75.75 0 0 0 .75-.75v-3.75a.75.75 0 0 0-1.5 0v3h-8.5v-8.5h3a.75.75 0 1 0 0-1.5z"
}, null, -1)]], 8, tt));
}
}), rt = ["fill"], it = /* @__PURE__ */ l({
__name: "ErrorFilled24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", { d: "M10.286 4.915c.777-1.294 2.653-1.294 3.43 0l7.234 12.056c.8 1.333-.161 3.029-1.716 3.03H4.767c-1.554 0-2.515-1.697-1.715-3.03zm4.42 6.13a1 1 0 0 0-1.413 0L12 12.336l-1.293-1.293a1 1 0 1 0-1.414 1.414l1.293 1.293-1.293 1.293a1 1 0 0 0 1.414 1.414L12 15.165l1.293 1.293a1.001 1.001 0 0 0 1.414-1.414l-1.293-1.293 1.293-1.293a1 1 0 0 0 0-1.414Z" }, null, -1)]], 8, rt));
}
}), at = ["fill"], ot = /* @__PURE__ */ l({
__name: "Cross24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M17.707 7.707a1 1 0 0 0-1.414-1.414L12 10.586 7.707 6.293a1 1 0 0 0-1.414 1.414L10.586 12l-4.293 4.293a1 1 0 1 0 1.414 1.414L12 13.414l4.293 4.293a1 1 0 0 0 1.414-1.414L13.414 12z"
}, null, -1)]], 8, at));
}
}), st = ["fill"], ct = /* @__PURE__ */ l({
__name: "Cross20",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 20 20",
width: "20px",
height: "20px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M14.697 6.364a.75.75 0 1 0-1.061-1.061L10 8.939 6.363 5.303a.75.75 0 0 0-1.06 1.06L8.939 10l-3.636 3.636a.75.75 0 1 0 1.06 1.06L10 11.062l3.636 3.636a.75.75 0 0 0 1.06-1.06L11.06 10z"
}, null, -1)]], 8, st));
}
}), lt = ["fill"], ut = /* @__PURE__ */ l({
__name: "CrossCircleFilled32",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 32 32",
width: "32px",
height: "32px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M16 3C8.82 3 3 8.82 3 16s5.82 13 13 13 13-5.82 13-13S23.18 3 16 3m-4.707 8.293a1 1 0 0 1 1.414 0L16 14.586l3.293-3.293a1 1 0 0 1 1.414 1.414L17.414 16l3.293 3.293a1 1 0 0 1-1.414 1.414L16 17.414l-3.293 3.293a1 1 0 0 1-1.414-1.414L14.586 16l-3.293-3.293a1 1 0 0 1 0-1.414"
}, null, -1)]], 8, lt));
}
}), dt = ["fill"], ft = /* @__PURE__ */ l({
__name: "CrossCircleFilled24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2M8.293 8.293a1 1 0 0 1 1.414 0L12 10.586l2.293-2.293a1 1 0 1 1 1.414 1.414L13.414 12l2.293 2.293a1 1 0 0 1-1.414 1.414L12 13.414l-2.293 2.293a1 1 0 0 1-1.414-1.414L10.586 12 8.293 9.707a1 1 0 0 1 0-1.414"
}, null, -1)]], 8, dt));
}
}), pt = ["fill"], mt = /* @__PURE__ */ l({
__name: "CrossCircleFilled20",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 20 20",
width: "20px",
height: "20px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M10 1.75a8.25 8.25 0 1 0 0 16.5 8.25 8.25 0 0 0 0-16.5M6.97 6.97a.75.75 0 0 1 1.06 0L10 8.94l1.97-1.97a.75.75 0 1 1 1.06 1.06L11.06 10l1.97 1.97a.75.75 0 1 1-1.06 1.06L10 11.06l-1.97 1.97a.75.75 0 0 1-1.06-1.06L8.94 10 6.97 8.03a.75.75 0 0 1 0-1.06"
}, null, -1)]], 8, pt));
}
}), ht = ["fill"], gt = /* @__PURE__ */ l({
__name: "ChevronUp24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M11.293 8.793a1 1 0 0 1 1.414 0l5 5a1 1 0 0 1-1.414 1.414L12 10.914l-4.293 4.293a1 1 0 0 1-1.414-1.414z"
}, null, -1)]], 8, ht));
}
}), _t = ["fill"], vt = /* @__PURE__ */ l({
__name: "ChevronRight24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M9.793 6.293a1 1 0 0 1 1.414 0l5 5a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414-1.414L14.086 12 9.793 7.707a1 1 0 0 1 0-1.414"
}, null, -1)]], 8, _t));
}
}), yt = ["fill"], bt = /* @__PURE__ */ l({
__name: "ChevronRight20",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 20 20",
width: "20px",
height: "20px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M8.22 5.303a.75.75 0 0 1 1.06 0l4.167 4.167a.75.75 0 0 1 0 1.06L9.28 14.698a.75.75 0 1 1-1.06-1.06L11.856 10 8.22 6.364a.75.75 0 0 1 0-1.06"
}, null, -1)]], 8, yt));
}
}), xt = ["fill"], St = /* @__PURE__ */ l({
__name: "ChevronLeft24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M14.207 6.293a1 1 0 0 1 0 1.414L9.914 12l4.293 4.293a1 1 0 0 1-1.414 1.414l-5-5a1 1 0 0 1 0-1.414l5-5a1 1 0 0 1 1.414 0"
}, null, -1)]], 8, xt));
}
}), Ct = ["fill"], wt = /* @__PURE__ */ l({
__name: "ChevronLeft20",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 20 20",
width: "20px",
height: "20px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M11.78 5.303a.75.75 0 0 1 0 1.06L8.144 10l3.636 3.637a.75.75 0 0 1-1.06 1.06l-4.167-4.166a.75.75 0 0 1 0-1.061l4.166-4.167a.75.75 0 0 1 1.061 0"
}, null, -1)]], 8, Ct));
}
}), Tt = ["fill"], Et = /* @__PURE__ */ l({
__name: "ChevronDown24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M6.293 8.793a1 1 0 0 1 1.414 0L12 13.086l4.293-4.293a1 1 0 1 1 1.414 1.414l-5 5a1 1 0 0 1-1.414 0l-5-5a1 1 0 0 1 0-1.414"
}, null, -1)]], 8, Tt));
}
}), Dt = ["fill"], Ot = /* @__PURE__ */ l({
__name: "ChevronDown20",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 20 20",
width: "20px",
height: "20px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M5.303 7.386a.75.75 0 0 1 1.06 0L10 11.023l3.636-3.637a.75.75 0 0 1 1.06 1.06l-4.166 4.168a.75.75 0 0 1-1.06 0L5.302 8.447a.75.75 0 0 1 0-1.06"
}, null, -1)]], 8, Dt));
}
}), kt = ["fill"], At = /* @__PURE__ */ l({
__name: "Check24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M17.707 7.793a1 1 0 0 1 0 1.414l-7 7a1 1 0 0 1-1.414 0l-3-3a1 1 0 1 1 1.414-1.414L10 14.086l6.293-6.293a1 1 0 0 1 1.414 0"
}, null, -1)]], 8, kt));
}
}), jt = ["fill"], Mt = /* @__PURE__ */ l({
__name: "Check20",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 20 20",
width: "20px",
height: "20px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M14.697 6.553a.75.75 0 0 1 0 1.06l-5.834 5.834a.75.75 0 0 1-1.06 0l-2.5-2.5a.75.75 0 0 1 1.06-1.06l1.97 1.97 5.303-5.304a.75.75 0 0 1 1.06 0"
}, null, -1)]], 8, jt));
}
}), Nt = ["fill"], Pt = /* @__PURE__ */ l({
__name: "CheckCircle32",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 32 32",
width: "32px",
height: "32px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M5 16C5 9.925 9.925 5 16 5s11 4.925 11 11-4.925 11-11 11S5 22.075 5 16M16 3C8.82 3 3 8.82 3 16s5.82 13 13 13 13-5.82 13-13S23.18 3 16 3m6.707 10.374a1 1 0 0 0-1.414-1.414l-6.626 6.626-3.293-3.293a1 1 0 0 0-1.414 1.414l4 4a1 1 0 0 0 1.414 0z"
}, null, -1)]], 8, Nt));
}
}), Ft = ["fill"], It = /* @__PURE__ */ l({
__name: "CheckCircleFilled32",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 32 32",
width: "32px",
height: "32px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M16 3C8.82 3 3 8.82 3 16s5.82 13 13 13 13-5.82 13-13S23.18 3 16 3m6.707 8.96a1 1 0 0 1 0 1.414l-7.333 7.333a1 1 0 0 1-1.414 0l-4-4a1 1 0 1 1 1.414-1.414l3.293 3.293 6.626-6.626a1 1 0 0 1 1.414 0"
}, null, -1)]], 8, Ft));
}
}), Lt = ["fill"], Rt = /* @__PURE__ */ l({
__name: "CheckCircleFilled24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2m5.207 6.793a1 1 0 0 1 0 1.414l-5.5 5.5a1 1 0 0 1-1.414 0l-3-3a1 1 0 1 1 1.414-1.414L11 13.586l4.793-4.793a1 1 0 0 1 1.414 0"
}, null, -1)]], 8, Lt));
}
}), zt = ["fill"], Bt = /* @__PURE__ */ l({
__name: "SidebarExpand24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", { d: "M19 6a1 1 0 0 1 1 1v10a1 1 0 1 1-2 0V7a1 1 0 0 1 1-1m-8.707 1.293a1 1 0 0 1 1.338-.068l.076.068 4 4 .068.076a1 1 0 0 1-.068 1.338l-4 4a1 1 0 1 1-1.414-1.414L12.586 13H5a1 1 0 1 1 0-2h7.586l-2.293-2.293-.068-.076a1 1 0 0 1 .068-1.338" }, null, -1)]], 8, zt));
}
}), Vt = ["fill"], Ht = /* @__PURE__ */ l({
__name: "Lock20",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 20 20",
width: "20px",
height: "20px"
}, [...n[0] ||= [a("g", { "clip-path": "url(#ui_lock_20__a)" }, [a("path", { d: "M10 1.75a4.084 4.084 0 0 1 4.084 4.083v1.75h1.75l.076.004a.75.75 0 0 1 .674.746V17.5a.75.75 0 0 1-.75.75H4.167a.75.75 0 0 1-.75-.75V8.333a.75.75 0 0 1 .75-.75h1.75v-1.75A4.083 4.083 0 0 1 10 1.75m-5.083 15h10.167V9.083H4.917zM10 11.167a1.333 1.333 0 0 1 .5 2.567v.432a.5.5 0 1 1-1 0v-.43a1.333 1.333 0 0 1 .5-2.569m0 1a.333.333 0 0 0-.005.666h.009a.334.334 0 0 0 .33-.333.334.334 0 0 0-.334-.333m0-8.917a2.583 2.583 0 0 0-2.583 2.583v1.75h5.167v-1.75A2.584 2.584 0 0 0 10 3.25" })], -1), a("defs", null, [a("clipPath", { id: "ui_lock_20__a" }, [a("path", {
fill: "#fff",
d: "M0 0h20v20H0z"
})])], -1)]], 8, Vt));
}
}), Ut = ["fill"], Wt = /* @__PURE__ */ l({
__name: "ArrowTopRight24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("g", { "clip-path": "url(#ui_arrow-top-right_24__a)" }, [a("path", { d: "M17 6a1 1 0 0 1 1 1v7a1 1 0 1 1-2 0V9.414l-8.293 8.293a1 1 0 1 1-1.414-1.414L14.586 8H10a1 1 0 1 1 0-2z" })], -1), a("defs", null, [a("clipPath", { id: "ui_arrow-top-right_24__a" }, [a("path", {
fill: "#fff",
d: "M0 0h24v24H0z"
})])], -1)]], 8, Ut));
}
}), Gt = ["fill"], Kt = /* @__PURE__ */ l({
__name: "ArrowBottomRight24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("g", { "clip-path": "url(#ui_arrow-bottom-right_24__a)" }, [a("path", { d: "M6.293 6.293a1 1 0 0 1 1.414 0L16 14.586V10a1 1 0 1 1 2 0v7a1 1 0 0 1-1 1h-7a1 1 0 0 1 0-2h4.586L6.293 7.707a1 1 0 0 1 0-1.414" })], -1), a("defs", null, [a("clipPath", { id: "ui_arrow-bottom-right_24__a" }, [a("path", {
fill: "#fff",
d: "M0 0h24v24H0z"
})])], -1)]], 8, Gt));
}
}), qt = ["fill"], Jt = /* @__PURE__ */ l({
__name: "ArrowBack24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("g", { "clip-path": "url(#ui_arrow-back_24__a)" }, [a("path", { d: "M9.293 6.293a1 1 0 1 1 1.414 1.414L7.414 11H19a1 1 0 0 1 0 2H7.414l3.293 3.293a1 1 0 0 1-1.414 1.414l-5-5a1 1 0 0 1 0-1.414z" })], -1), a("defs", null, [a("clipPath", { id: "ui_arrow-back_24__a" }, [a("path", {
fill: "#fff",
d: "M0 0h24v24H0z"
})])], -1)]], 8, qt));
}
}), Yt = ["fill"], Xt = /* @__PURE__ */ l({
__name: "Upload24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M12.707 2.293a1 1 0 0 0-1.414 0l-5 5a1 1 0 0 0 1.414 1.414L11 5.414V15a1 1 0 1 0 2 0V5.414l3.293 3.293a1 1 0 1 0 1.414-1.414zM4 15a1 1 0 1 0-2 0v6a1 1 0 0 0 1 1h18a1 1 0 0 0 1-1v-6a1 1 0 1 0-2 0v5H4z"
}, null, -1)]], 8, Yt));
}
}), Zt = ["fill"], Qt = /* @__PURE__ */ l({
__name: "PlayCircle24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0m8-10C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2m-1.726 5.148A1 1 0 0 0 8.75 8v8a1 1 0 0 0 1.524.852l6.5-4a1 1 0 0 0 0-1.704zM14.342 12l-3.592 2.21V9.79z"
}, null, -1)]], 8, Zt));
}
}), $t = ["fill"], en = /* @__PURE__ */ l({
__name: "PauseCircle24",
props: { color: { default: "currentColor" } },
setup(e) {
return (t, n) => (x(), i("svg", {
"aria-hidden": "true",
fill: e.color,
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "24px",
height: "24px"
}, [...n[0] ||= [a("path", {
"fill-rule": "evenodd",
d: "M12 4a8 8 0 1 0 0 16 8 8 0 0 0 0-16M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12m8-4a1 1 0 0 1 1 1v6a1 1 0 1 1-2 0V9a1 1 0 0 1 1-1m5 1a1 1 0 1 0-2 0v6a1 1 0 1 0 2 0z"
}, null, -1)]], 8, $t));
}
}), tn = { class: "mc-listbox__header" }, nn = ["id"], rn = { class: "mc-listbox__body" }, an = ["aria-label", "aria-labelledby"], on = ["disabled", "onClick"], sn = { class: "mc-action-list__text" }, cn = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MActionListbox",
props: {
title: {},
position: { default: "bottom" },
items: {}
},
emits: ["close", "action"],
setup(t, { emit: o }) {
let s = t, l = o, d = M(), f = A(), _ = N("popover"), v = N("menuEl");
function y() {
return Array.from(v.value?.querySelectorAll("button[role=\"menuitem\"]:not(:disabled)") ?? []);
}
function b(e) {
let t = y();
if (!t.length) return;
let n = t.findIndex((e) => e === document.activeElement);
e.key === "ArrowDown" ? (e.preventDefault(), t[(n + 1) % t.length].focus()) : e.key === "ArrowUp" ? (e.preventDefault(), t[(n - 1 + t.length) % t.length].focus()) : e.key === "Home" ? (e.preventDefault(), t[0].focus()) : e.key === "End" ? (e.preventDefault(), t[t.length - 1].focus()) : e.key === "Escape" && C();
}
function S(e) {
e.newState === "open" ? m(() => y()[0]?.focus()) : document.querySelector(`[popovertarget="${f}"]`)?.focus();
}
function C() {
l("close"), d.activator && _.value?.hidePopover();
}
return (o, d) => (x(), i(e, null, [a("div", { class: h({
"mc-listbox": !0,
[`mc-listbox--${s.position}`]: !0
}) }, [a("div", p({
ref_key: "popover",
ref: _,
class: "mc-listbox__content"
}, o.$slots.activator ? {
id: k(f),
popover: ""
} : {}, { onToggle: S }), [a("div", tn, [t.title ? (x(), i("h3", {
key: 0,
id: `${k(f)}-title`,
class: "mc-listbox__title"
}, D(t.title), 9, nn)) : r("", !0), c(U, {
class: "mc-listbox__close",
ghost: "",
"aria-label": "Close",
onClick: C
}, {
icon: L(() => [c(k(ot), { "aria-hidden": "true" })]),
_: 1
})]), a("div", rn, [a("ul", {
ref_key: "menuEl",
ref: v,
class: "mc-action-list",
role: "menu",
tabindex: "-1",
"aria-label": t.title || void 0,
"aria-labelledby": t.title ? `${k(f)}-title` : void 0,
onKeydown: b
}, [(x(!0), i(e, null, w(t.items, (t, o) => (x(), i(e, { key: `item-${o}` }, [t.divider ? (x(), n(V, {
key: 0,
class: "mc-action-list__divider",
role: "separator"
})) : r("", !0), a("li", {
class: h(["mc-action-list__element", {
"mc-action-list__element--danger": t.appearance === "danger",
"mc-action-list__element--disabled": t.disabled
}]),
role: "presentation"
}, [a("button", {
type: "button",
role: "menuitem",
class: "mc-action-list__button",
disabled: t.disabled || void 0,
onClick: (e) => l("action", t?.id || o)
}, [t.icon ? (x(), n(E(t.icon), {
key: 0,
class: "mc-action-list__icon",
"aria-hidden": "true"
})) : r("", !0), a("p", sn, D(t.label), 1)], 8, on)], 2)], 64))), 128))], 40, an)])], 16)], 2), T(o.$slots, "activator", g(u({ id: k(f) })), void 0, !0)], 64));
}
}), [["__scopeId", "data-v-681c7b98"]]), ln = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MAvatar",
props: { size: { default: "s" } },
setup(e) {
let n = e, r = t(() => ({ [`mc-avatar--${n.size}`]: n.size && n.size != "s" }));
return (e, t) => (x(), i("span", { class: h(["mc-avatar", r.value]) }, [T(e.$slots, "default", {}, void 0, !0)], 2));
}
}), [["__scopeId", "data-v-9ebdb5d7"]]), un = {
key: 0,
class: "mc-link__icon",
"aria-hidden": "true"
}, dn = { class: "mc-link__label" }, fn = {
key: 1,
class: "mc-link__icon",
"aria-hidden": "true"
}, pn = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MLink",
props: {
iconPosition: { default: "left" },
appearance: { default: "primary" },
size: { default: "s" },
href: {},
target: {},
inline: { type: Boolean },
router: { type: Boolean }
},
setup(e) {
let o = e, s = t(() => ({
[`mc-link--${o.appearance}`]: o.appearance && o.appearance !== "standard" && o.appearance !== "primary",
[`mc-link--${o.size}`]: o.size && o.size != "s",
"mc-link--inline": o.inline,
"mc-link--stand-alone": !o.inline
})), c = t(() => o.router ? {
to: o.href,
target: o.target
} : {
href: o.href,
target: o.target
});
return y(() => {
o.appearance;
}), (t, o) => (x(), n(E(e.router ? "router-link" : "a"), p({ class: ["mc-link", s.value] }, c.value), {
default: L(() => [
t.$slots.icon && e.iconPosition == "left" ? (x(), i("span", un, [T(t.$slots, "icon", {}, void 0, !0)])) : r("", !0),
a("span", dn, [T(t.$slots, "default", {}, void 0, !0)]),
t.$slots.icon && e.iconPosition == "right" ? (x(), i("span", fn, [T(t.$slots, "icon", {}, void 0, !0)])) : r("", !0)
]),
_: 3
}, 16, ["class"]));
}
}), [["__scopeId", "data-v-0bb4346d"]]), mn = { class: "mc-breadcrumb__container" }, hn = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MBreadcrumb",
props: {
appearance: {},
links: {}
},
setup(n) {
let r = n, l = t(() => ({ [`mc-breadcrumb--${r.appearance}`]: r.appearance && r.appearance != "standard" })), u = (e) => e === (r.links?.length ?? 0) - 1;
return (t, r) => (x(), i("nav", {
class: h(["mc-breadcrumb", l.value]),
"aria-label": "Breadcrumb"
}, [a("ul", mn, [(x(!0), i(e, null, w(n.links, (e, t) => (x(), i("li", {
class: "mc-breadcrumb__item",
key: `breadcrumb-${t}`
}, [c(pn, {
href: e.href,
router: e.router,
appearance: n.appearance,
inline: "",
class: h({ "mc-breadcrumb__current": u(t) }),
iconPosition: "right",
"aria-current": u(t) ? "page" : void 0
}, o({
default: L(() => [s(D(e.label) + " ", 1)]),
_: 2
}, [t === n.links.length - 1 ? void 0 : {
name: "icon",
fn: L(() => [c(k(bt))]),
key: "0"
}]), 1032, [
"href",
"router",
"appearance",
"class",
"aria-current"
])]))), 128))])], 2));
}
}), [["__scopeId", "data-v-f084eea2"]]), gn = ["aria-label"], _n = { class: "mc-built-in-menu__list" }, vn = { class: "mc-built-in-menu__label" }, yn = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MBuiltInMenu",
props: {
modelValue: {},
items: {},
outlined: { type: Boolean },
label: { default: "Menu" }
},
emits: ["update:modelValue"],
setup(o, { emit: s }) {
let l = o, u = s, d = t({
get() {
return l.modelValue;
},
set(e) {
u("update:modelValue", e);
}
});
function f(e) {
return e.href ? "a" : e.to ? "router-link" : "button";
}
function m(e) {
return f(e) === "a" || f(e) === "router-link";
}
function g(e) {
return {
...f(e) === "a" ? { href: e.href } : { to: e.to },
target: e.target || "_self"
};
}
return (t, o) => (x(), i("nav", {
class: h({
"mc-built-in-menu": !0,
"mc-built-in-menu--outlined": l.outlined
}),
"aria-label": l.label
}, [a("ul", _n, [(x(!0), i(e, null, w(l.items, (e, t) => (x(), i("li", {
key: t,
class: h({
"mc-built-in-menu__item": !0,
"mc-built-in-menu__item--selected": d.value === t
})
}, [(x(), n(E(f(e)), p({ class: {
"mc-built-in-menu__button": f(e) === "button",
"mc-built-in-menu__link": m(e)
} }, { ref_for: !0 }, m(e) ? g(e) : {}, {
"aria-current": d.value === t ? !0 : void 0,
onClick: (e) => d.value = t
}), {
default: L(() => [
e.icon ? (x(), n(E(e.icon), {
key: 0,
class: "mc-built-in-menu__icon",
"aria-hidden": "true"
})) : r("", !0),
a("span", vn, D(e.label), 1),
c(k(bt), {
class: "mc-built-in-menu__icon",
"aria-hidden": "true"
})
]),
_: 2
}, 1040, [
"class",
"aria-current",
"onClick"
]))], 2))), 128))])], 10, gn));
}
}), [["__scopeId", "data-v-5f1e6702"]]), bn = [
"disabled",
"type",
"aria-busy"
], xn = {
key: 0,
class: "mc-button__icon"
}, Sn = {
key: 1,
class: "mc-button__icon",
style: { position: "absolute" },
"aria-hidden": "true"
}, Cn = {
key: 2,
class: "mc-button__icon"
}, wn = {
key: 4,
class: "mc-button__icon"
}, W = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MButton",
props: {
appearance: { default: "standard" },
size: { default: "m" },
disabled: { type: Boolean },
ghost: { type: Boolean },
outlined: { type: Boolean },
iconPosition: {},
type: { default: "button" },
isLoading: { type: Boolean }
},
setup(e) {
let n = e, a = t(() => ({
[`mc-button--${n.appearance}`]: n.appearance && n.appearance != "standard",
[`mc-button--${n.size}`]: n.size && n.size != "m",
"mc-button--ghost": n.ghost,
"mc-button--outlined": n.outlined,
"mc-button--icon-only": n.iconPosition == "only"
}));
return (t, n) => (x(), i("button", {
class: h(["mc-button", a.value]),
disabled: e.disabled,
type: e.type,
"aria-busy": e.isLoading || void 0
}, [
t.$slots.icon && e.iconPosition == "left" && !e.isLoading ? (x(), i("span", xn, [T(t.$slots, "icon", {}, void 0, !0)])) : r("", !0),
e.isLoading ? (x(), i("span", Sn, [c(H, {
style: { color: "currentColor" },
size: "s"
})])) : r("", !0),
t.$slots.icon && e.iconPosition == "only" ? (x(), i("span", Cn, [T(t.$slots, "icon", {}, void 0, !0)])) : (x(), i("span", {
key: 3,
class: "mc-button__label",
style: _({ visibility: e.isLoading ? "hidden" : "visible" })
}, [T(t.$slots, "default", {}, () => [n[0] ||= s("Button Label", -1)], !0)], 4)),
t.$slots.icon && e.iconPosition == "right" && !e.isLoading ? (x(), i("span", wn, [T(t.$slots, "icon", {}, void 0, !0)])) : r("", !0)
], 10, bn));
}
}), [["__scopeId", "data-v-cb5836e4"]]), Tn = ["aria-labelledby"], En = {
class: "mc-callout__icon",
"aria-hidden": "true"
}, Dn = { class: "mc-callout__content" }, On = {
key: 1,
class: "mc-callout__message"
}, kn = {
key: 2,
class: "mc-callout__footer"
}, An = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MCallout",
props: {
title: {},
description: {},
appearance: { default: "standard" },
tag: { default: "h2" }
},
setup(e) {
let o = e, c = A(), l = t(() => ({ [`mc-callout--${o.appearance}`]: o.appearance && o.appearance != "standard" }));
return (t, u) => (x(), i("section", {
class: h(["mc-callout", l.value]),
role: "status",
"aria-labelledby": `callout-title-${k(c)}`
}, [a("div", En, [T(t.$slots, "icon", {}, void 0, !0)]), a("div", Dn, [
e.title ? (x(), n(E(o.tag), {
key: 0,
id: `callout-title-${k(c)}`,
class: "mc-callout__title"
}, {
default: L(() => [s(D(e.title), 1)]),
_: 1
}, 8, ["id"])) : r("", !0),
e.description ? (x(), i("p", On, D(e.description), 1)) : r("", !0),
t.$slots.footer ? (x(), i("div", kn, [T(t.$slots, "footer", {}, void 0, !0)])) : r("", !0)
])], 10, Tn));
}
}), [["__scopeId", "data-v-78657c6b"]]), jn = ["aria-labelledby"], Mn = { class: "mc-carousel__header" }, Nn = ["id"], Pn = { class: "mc-carousel__controls" }, Fn = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MCarousel",
props: {
previousButtonAriaLabel: { default: "previous" },
nextButtonAriaLabel: { default: "next" }
},
setup(r) {
let o = A(), s = C(0), l = C(null), u = C(!1), d = C(!1), f = {
behavior: "smooth",
block: "nearest",
inline: "start"
};
function p() {
return l.value ? [...l.value.children] : [];
}
function m() {
if (!l.value) return;
let e = l.value, t = e.scrollLeft, n = e.scrollWidth, r = e.clientWidth;
u.value = t > 1;
let i = p();
d.value = s.value !== i.length - 1 && t < n - r - 1;
}
function h() {
if (!l.value) return;
let e = l.value, t = p();
if (t.length === 0) return;
let n = e.getBoundingClientRect().left, r = 0, i = Infinity;
t.forEach((e, t) => {
let a = e.getBoundingClientRect(), o = Math.abs(a.left - n);
o < i && (i = o, r = t);
}), s.value = r;
}
let g = null;
function _() {
m(), g && clearTimeout(g), g = setTimeout(() => {
h();
}, 150);
}
function v(e) {
let t = p();
e >= 0 && e < t.length && (t[e].scrollIntoView(f), s.value = e);
}
function S() {
u.value && s.value > 0 && v(s.value - 1);
}
function D() {
let e = p();
d.value && s.value < e.length - 1 && v(s.value + 1);
}
let O = t(() => !u.value), j = t(() => !d.value);
return y(() => {
if (l.value) {
l.value.addEventListener("scroll", _, { passive: !0 }), m(), h();
let e = new ResizeObserver(() => {
m(), h();
});
e.observe(l.value), b(() => {
e.disconnect(), g && clearTimeout(g);
});
}
}), b(() => {
l.value && l.value.removeEventListener("scroll", _), g && clearTimeout(g);
}), (t, s) => (x(), i("div", {
class: "mc-carousel",
role: "group",
"aria-roledescription": "carousel",
"aria-labelledby": k(o)
}, [a("div", Mn, [a("div", {
id: k(o),
class: "mc-carousel__headings"
}, [T(t.$slots, "header", {}, void 0, !0)], 8, Nn), a("div", Pn, [c(U, {
size: "s",
outlined: "",
onClick: S,
disabled: O.value,
"aria-label": r.previousButtonAriaLabel
}, {
icon: L(() => [c(k(wt))]),
_: 1
}, 8, ["disabled", "aria-label"]), c(U, {
size: "s",
outlined: "",
onClick: D,
disabled: j.value,
"aria-label": r.nextButtonAriaLabel
}, {
icon: L(() => [c(k(bt))]),
_: 1
}, 8, ["disabled", "aria-label"])])]), a("div", {
class: "mc-carousel__content",
ref_key: "contentContainer",
ref: l,
"aria-live": "polite",
"aria-atomic": "false"
}, [(x(!0), i(e, null, w(t.$slots.default?.(), (e, t) => (x(), n(E(e), { key: `carousel-slide-${t}` }))), 128))], 512)], 8, jn));
}
}), [["__scopeId", "data-v-9515be43"]]), In = [
"id",
"name",
"checked",
"indeterminate",
"disabled",
"aria-invalid"
], Ln = ["for"], Rn = /*#__PURE__*/ B(/* @__PURE__ */ l({
inheritAttrs: !1,
__name: "MCheckbox",
props: {
id: {},
name: {},
label: {},
modelValue: { type: Boolean },
indeterminate: { type: Boolean },
isInvalid: { type: Boolean },
disabled: { type: Boolean },
indented: { type: Boolean }
},
emits: ["update:modelValue"],
setup(e, { emit: n }) {
let o = e, s = t(() => ({ "is-invalid": o.isInvalid })), c = t(() => ({ "mc-checkbox--indented": o.indented })), l = n;
return (t, n) => (x(), i("div", { class: h(["mc-checkbox", c.value]) }, [a("input", p({
id: e.id,
type: "checkbox",
class: ["mc-checkbox__input", s.value],
name: e.name,
checked: e.modelValue,
indeterminate: e.indeterminate,
disabled: e.disabled,
"aria-invalid": e.isInvalid
}, t.$attrs, { onChange: n[0] ||= (e) => l("update:modelValue", e.target.checked) }), null, 16, In), e.label ? (x(), i("label", {
key: 0,
for: e.id,
class: "mc-checkbox__label"
}, D(e.label), 9, Ln)) : r("", !0)], 2));
}
}), [["__scopeId", "data-v-829485d4"]]), zn = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MCheckboxGroup",
props: {
name: {},
modelValue: {},
options: {},
inline: { type: Boolean }
},
emits: ["update:modelValue"],
setup(r, { emit: a }) {
let o = r, s = C([]);
I(() => o.modelValue, (e) => {
s.value = e || [];
}, { immediate: !0 });
let c = (e, t) => {
let n = [...s.value];
e && !n.includes(t) ? n.push(t) : n = n.filter((e) => e !== t), u("update:modelValue", n), s.value = n;
}, l = t(() => ({ "mc-field__content--inline": o.inline })), u = a;
return (t, a) => (x(), i("div", { class: h(["mc-field__content", l.value]) }, [(x(!0), i(e, null, w(r.options, (e) => (x(), n(Rn, {
id: e.id,
key: e.id,
label: e.label,
"is-invalid": e.isInvalid,
name: r.name,
class: "mc-field__item",
"model-value": r.modelValue ? r.modelValue.includes(e.value) : void 0,
disabled: e.disabled,
indented: e.indented,
"onUpdate:modelValue": (t) => c(t, e.value)
}, null, 8, [
"id",
"label",
"is-invalid",
"name",
"model-value",
"disabled",
"indented",
"onUpdate:modelValue"
]))), 128))], 2));
}
}), [["__scopeId", "data-v-5c346a17"]]), Bn = /* @__PURE__ */ l({
__name: "MCheckListMenu",
props: {
modelValue: {},
items: {},
outlined: { type: Boolean },
label: {}
},
emits: ["update:modelValue"],
setup(e, { emit: r }) {
let i = e, a = r, o = t({
get() {
return i.modelValue;
},
set(e) {
a("update:modelValue", e);
}
}), s = t(() => i.items.map((e) => ({
label: e.label,
icon: e.checked ? Rt : void 0,
href: e.href,
to: e.to,
target: e.target
})));
return (e, t) => (x(), n(yn, {
modelValue: o.value,
"onUpdate:modelValue": t[0] ||= (e) => o.value = e,
items: s.value,
outlined: i.outlined,
label: i.label
}, null, 8, [
"modelValue",
"items",
"outlined",
"label"
]));
}
}), Vn = ["aria-valuenow"], Hn = {
key: 0,
class: "mc-circular-progressbar__percentage"
}, Un = { class: "mc-circular-progressbar__value" }, Wn = {
key: 1,
class: "mc-circular-progressbar__content"
}, Gn = { class: "mc-circular-progressbar__number" }, Kn = {
key: 0,
class: "mc-circular-progressbar__text"
}, qn = /*#__PURE__*/ B(/* @__PURE__ */ l({
__name: "MCircularProgressbar",
props: {
size: {},
value: { default: 0 },
type: { default: "percentage" },
contentValue: {},
additionalInfo: {}
},
setup(e) {
let n = e, o = t(() => ({ [`mc-circular-progressbar--${n.size}`]: n.size && n.size != "l" }));
return