@agendize/vue-settings
Version:
Vue agendize's settings component
924 lines • 52.3 kB
JavaScript
import { ref as d, inject as cl, onMounted as Zl, computed as ml, defineComponent as Nl, openBlock as p, createBlock as Ae, unref as e, withCtx as _, createElementVNode as s, toDisplayString as k, createVNode as r, isRef as z, createCommentVNode as C, withKeys as me, createElementBlock as y, Fragment as Le, renderList as We, normalizeStyle as Kl } from "vue";
import { _ as Ml } from "./index.f5b6d925.js";
import { ConfirmDialog as pl, PageWithTabsAndPanel as Ol, Section as R, FieldInput as pe, Mandatory as g, FieldFile as gl, FieldTextArea as Rl, FieldSelect as bl, FieldEmail as Gl, FieldPhone as Yl, FieldUrl as fe, FieldDateTime as vl } from "@agendize/design-system";
import { i as _l, S as Se } from "./index.d2d0aba2.js";
import { _ as ql, i as Pe } from "./index.b1f405e6.js";
import { CompanyEntity as Jl, ImageEntity as yl } from "@agendize/js-calendar-api";
import { readBlobFromUrl as fl, toBase64 as zl, formatDate as hl } from "@agendize/vue-tools";
import { _ as Ql } from "./View.vue_vue_type_script_setup_true_lang.434f3142.js";
import "./__commonjsHelpers__.389925fa.js";
import "./vendor.26bbd9f1.js";
import "@agendize/az-i18n";
import "vue-router";
import "@agendize/vue-acl";
function Xl(Ee, G, u, t, He, D, Y, se, T, V) {
const l = d(), L = d(!0), E = d(""), ze = d(""), U = d([]), I = d(), $ = d(void 0), ie = d(), q = d(), J = d(void 0), A = d(), Q = d(""), X = d(""), W = d(""), ee = d(""), j = d([]), de = d(""), P = d(""), he = d(), H = d(""), B = d(""), Z = d(""), N = d(""), K = d(""), ue = d(""), x = d([""]), h = d([{}]), M = d([]), _e = d(["monday", "tuesday", "wednesday", "thursday", "friday", "saturday", "sunday"]), F = d(!1), le = d(""), ge = d(""), f = _l(t), ae = cl("toaster"), be = cl("createConfirmDialog"), De = d([]);
je(t);
const oe = d(!0), ke = d(!0), Ue = d(!0), re = d(!0), ve = d(!0), Fe = d(!0), w = d(!0), Ve = d(!0), Ie = d(!0), O = d([!0]), ce = d({
title: f.global.t("settings.company-details.new.title"),
subTitle: f.global.t("settings.company-details.new.subTitle"),
mobileBack: !0,
tabs: [
{ id: "general", title: f.global.t("settings.company-details.tabs.general") },
{ id: "hours", title: f.global.t("settings.company-details.tabs.hours") },
{ id: "advanced", title: f.global.t("settings.company-details.tabs.advanced") }
]
});
function je(n) {
ql(/* @__PURE__ */ Object.assign({ "../../../../node_modules/i18n-iso-countries/langs/af.json": () => import("./af.9791e65f.js"), "../../../../node_modules/i18n-iso-countries/langs/am.json": () => import("./am.6beb8adc.js"), "../../../../node_modules/i18n-iso-countries/langs/ar.json": () => import("./ar.cd9c1297.js"), "../../../../node_modules/i18n-iso-countries/langs/az.json": () => import("./az.f34e988d.js"), "../../../../node_modules/i18n-iso-countries/langs/be.json": () => import("./be.8d3df6e4.js"), "../../../../node_modules/i18n-iso-countries/langs/bg.json": () => import("./bg.fb41032b.js"), "../../../../node_modules/i18n-iso-countries/langs/bn.json": () => import("./bn.fa251f69.js"), "../../../../node_modules/i18n-iso-countries/langs/br.json": () => import("./br.e3d5f4e5.js"), "../../../../node_modules/i18n-iso-countries/langs/bs.json": () => import("./bs.cb22ca47.js"), "../../../../node_modules/i18n-iso-countries/langs/ca.json": () => import("./ca.fba6a8dd.js"), "../../../../node_modules/i18n-iso-countries/langs/cs.json": () => import("./cs.bb5994e1.js"), "../../../../node_modules/i18n-iso-countries/langs/cy.json": () => import("./cy.fe708358.js"), "../../../../node_modules/i18n-iso-countries/langs/da.json": () => import("./da.65d2675c.js"), "../../../../node_modules/i18n-iso-countries/langs/de.json": () => import("./de.938a6382.js"), "../../../../node_modules/i18n-iso-countries/langs/dv.json": () => import("./dv.400e6b8a.js"), "../../../../node_modules/i18n-iso-countries/langs/el.json": () => import("./el.d6af8e91.js"), "../../../../node_modules/i18n-iso-countries/langs/en.json": () => import("./en.2e30e0a3.js"), "../../../../node_modules/i18n-iso-countries/langs/es.json": () => import("./es.7f502ba6.js"), "../../../../node_modules/i18n-iso-countries/langs/et.json": () => import("./et.157d6f40.js"), "../../../../node_modules/i18n-iso-countries/langs/eu.json": () => import("./eu.d11eb4f0.js"), "../../../../node_modules/i18n-iso-countries/langs/fa.json": () => import("./fa.6631a37f.js"), "../../../../node_modules/i18n-iso-countries/langs/fi.json": () => import("./fi.8fcd83ff.js"), "../../../../node_modules/i18n-iso-countries/langs/fr.json": () => import("./fr.c0d17ed7.js"), "../../../../node_modules/i18n-iso-countries/langs/gl.json": () => import("./gl.efd7f5fd.js"), "../../../../node_modules/i18n-iso-countries/langs/ha.json": () => import("./ha.86fac30b.js"), "../../../../node_modules/i18n-iso-countries/langs/he.json": () => import("./he.a63d15b4.js"), "../../../../node_modules/i18n-iso-countries/langs/hi.json": () => import("./hi.f4fbcf2c.js"), "../../../../node_modules/i18n-iso-countries/langs/hr.json": () => import("./hr.bb3497ef.js"), "../../../../node_modules/i18n-iso-countries/langs/hu.json": () => import("./hu.a47a06f6.js"), "../../../../node_modules/i18n-iso-countries/langs/hy.json": () => import("./hy.288b93c3.js"), "../../../../node_modules/i18n-iso-countries/langs/id.json": () => import("./id.ef385918.js"), "../../../../node_modules/i18n-iso-countries/langs/is.json": () => import("./is.c16f489f.js"), "../../../../node_modules/i18n-iso-countries/langs/it.json": () => import("./it.8998cc3c.js"), "../../../../node_modules/i18n-iso-countries/langs/ja.json": () => import("./ja.fb587cb8.js"), "../../../../node_modules/i18n-iso-countries/langs/ka.json": () => import("./ka.9155120e.js"), "../../../../node_modules/i18n-iso-countries/langs/kk.json": () => import("./kk.258f7a79.js"), "../../../../node_modules/i18n-iso-countries/langs/km.json": () => import("./km.62c6ce6d.js"), "../../../../node_modules/i18n-iso-countries/langs/ko.json": () => import("./ko.97510975.js"), "../../../../node_modules/i18n-iso-countries/langs/ku.json": () => import("./ku.1bcd31d3.js"), "../../../../node_modules/i18n-iso-countries/langs/ky.json": () => import("./ky.6d758964.js"), "../../../../node_modules/i18n-iso-countries/langs/lt.json": () => import("./lt.826c871f.js"), "../../../../node_modules/i18n-iso-countries/langs/lv.json": () => import("./lv.6f78127d.js"), "../../../../node_modules/i18n-iso-countries/langs/mk.json": () => import("./mk.e4b1d17d.js"), "../../../../node_modules/i18n-iso-countries/langs/ml.json": () => import("./ml.2372894f.js"), "../../../../node_modules/i18n-iso-countries/langs/mn.json": () => import("./mn.b6bd20a4.js"), "../../../../node_modules/i18n-iso-countries/langs/mr.json": () => import("./mr.719a0d4a.js"), "../../../../node_modules/i18n-iso-countries/langs/ms.json": () => import("./ms.69e3e324.js"), "../../../../node_modules/i18n-iso-countries/langs/nb.json": () => import("./nb.291a1e2d.js"), "../../../../node_modules/i18n-iso-countries/langs/nl.json": () => import("./nl.f22c5d5c.js"), "../../../../node_modules/i18n-iso-countries/langs/nn.json": () => import("./nn.cd3d39be.js"), "../../../../node_modules/i18n-iso-countries/langs/no.json": () => import("./no.0699c91a.js"), "../../../../node_modules/i18n-iso-countries/langs/pl.json": () => import("./pl.da3412b5.js"), "../../../../node_modules/i18n-iso-countries/langs/ps.json": () => import("./ps.bdd65a4a.js"), "../../../../node_modules/i18n-iso-countries/langs/pt.json": () => import("./pt.c8e5a82a.js"), "../../../../node_modules/i18n-iso-countries/langs/ro.json": () => import("./ro.98cd3834.js"), "../../../../node_modules/i18n-iso-countries/langs/ru.json": () => import("./ru.ad11eb7e.js"), "../../../../node_modules/i18n-iso-countries/langs/sd.json": () => import("./sd.36cdd425.js"), "../../../../node_modules/i18n-iso-countries/langs/sk.json": () => import("./sk.16747a3d.js"), "../../../../node_modules/i18n-iso-countries/langs/sl.json": () => import("./sl.0ece0e7b.js"), "../../../../node_modules/i18n-iso-countries/langs/so.json": () => import("./so.3e79250c.js"), "../../../../node_modules/i18n-iso-countries/langs/sq.json": () => import("./sq.c167efdc.js"), "../../../../node_modules/i18n-iso-countries/langs/sr.json": () => import("./sr.decc6a1f.js"), "../../../../node_modules/i18n-iso-countries/langs/sv.json": () => import("./sv.5d8b0c11.js"), "../../../../node_modules/i18n-iso-countries/langs/sw.json": () => import("./sw.7585b7a1.js"), "../../../../node_modules/i18n-iso-countries/langs/ta.json": () => import("./ta.c3f77bde.js"), "../../../../node_modules/i18n-iso-countries/langs/tg.json": () => import("./tg.63c13aaa.js"), "../../../../node_modules/i18n-iso-countries/langs/th.json": () => import("./th.249b3cae.js"), "../../../../node_modules/i18n-iso-countries/langs/tr.json": () => import("./tr.427fffa7.js"), "../../../../node_modules/i18n-iso-countries/langs/tt.json": () => import("./tt.e725c37f.js"), "../../../../node_modules/i18n-iso-countries/langs/ug.json": () => import("./ug.478e62d8.js"), "../../../../node_modules/i18n-iso-countries/langs/uk.json": () => import("./uk.59b3784b.js"), "../../../../node_modules/i18n-iso-countries/langs/ur.json": () => import("./ur.04c17e7a.js"), "../../../../node_modules/i18n-iso-countries/langs/uz.json": () => import("./uz.2a7d4e7c.js"), "../../../../node_modules/i18n-iso-countries/langs/vi.json": () => import("./vi.f357f2fb.js"), "../../../../node_modules/i18n-iso-countries/langs/zh.json": () => import("./zh.507137ba.js") }), `../../../../node_modules/i18n-iso-countries/langs/${n}.json`).then((i) => {
Pe.registerLocale(i);
const c = Pe.getNames(n);
for (let m in c)
De.value.push({ value: m, label: c[m] });
});
}
function ye() {
var n, i, c;
se || (ce.value.titleTranslatable = !1, ce.value.title = (i = (n = l.value) == null ? void 0 : n.name) != null ? i : "", ce.value.subTitleTranslatable = !1, ce.value.subTitle = (c = Ne.value) != null ? c : "");
}
Zl(async () => {
var i, c, m, S, te, ne, xe, we, Ce;
if (se) {
Y == null || Y.info("vue-settings", "[Company details] : Open new"), l.value = new Jl(), oe.value = !1, U.value = [(c = (i = u.profileSettings) == null ? void 0 : i.timeZone) != null ? c : "Europe/Paris"], ye(), L.value = !1, ge.value = (S = (m = u.profileSettings) == null ? void 0 : m.country) != null ? S : "FR";
return;
}
if (!D) {
a();
return;
}
let n;
try {
n = await G.getCompanyById(D, u.email);
} catch {
a();
}
n && n.result ? o(n.result) : a(), ge.value = (Ce = (we = (ne = (te = n == null ? void 0 : n.result) == null ? void 0 : te.address) == null ? void 0 : ne.country) != null ? we : (xe = u.profileSettings) == null ? void 0 : xe.country) != null ? Ce : "FR";
});
function a() {
V == null || V.push({ name: Se.Companies });
}
function o(n) {
l.value = n, kl(), ye(), L.value = !1;
}
function b(n) {
var i, c;
I.value = ((c = (i = l.value) == null ? void 0 : i.picture) == null ? void 0 : c.url) || "", ie.value = n;
}
function v(n) {
var i, c;
q.value = ((c = (i = l.value) == null ? void 0 : i.photo) == null ? void 0 : c.url) || "", A.value = n;
}
function Be() {
var n, i, c, m, S, te, ne;
(n = l.value) != null && n.picture && (I.value = (i = l.value.picture) == null ? void 0 : i.url, $.value = void 0, T && fl((c = l.value.picture) == null ? void 0 : c.url, b)), (m = l.value) != null && m.photo && (q.value = (te = (S = l == null ? void 0 : l.value) == null ? void 0 : S.photo) == null ? void 0 : te.url, J.value = void 0, T && fl((ne = l.value.photo) == null ? void 0 : ne.url, v));
}
function kl() {
var n, i, c, m, S, te, ne, xe, we, Ce, $e, Ke, Me, Oe, Re, Ge, Ye, qe, Je, Qe, Xe, el, ll, al, ol, tl, nl, sl, il, dl, ul, rl;
l.value ? (E.value = (n = l == null ? void 0 : l.value) == null ? void 0 : n.name, he.value = ((i = l == null ? void 0 : l.value) == null ? void 0 : i.phone) || "", P.value = (c = l == null ? void 0 : l.value) == null ? void 0 : c.email, Q.value = (S = (m = l == null ? void 0 : l.value) == null ? void 0 : m.address) == null ? void 0 : S.street, X.value = (ne = (te = l == null ? void 0 : l.value) == null ? void 0 : te.address) == null ? void 0 : ne.otherStreet, ee.value = (we = (xe = l == null ? void 0 : l.value) == null ? void 0 : xe.address) == null ? void 0 : we.city, W.value = ($e = (Ce = l == null ? void 0 : l.value) == null ? void 0 : Ce.address) == null ? void 0 : $e.zipCode, de.value = (Me = (Ke = l.value) == null ? void 0 : Ke.address) == null ? void 0 : Me.state, (Re = (Oe = l == null ? void 0 : l.value) == null ? void 0 : Oe.address) != null && Re.country && j.value.push((Ye = (Ge = l == null ? void 0 : l.value) == null ? void 0 : Ge.address) == null ? void 0 : Ye.country), Be(), ze.value = (qe = l == null ? void 0 : l.value) == null ? void 0 : qe.description, Z.value = (Je = l == null ? void 0 : l.value) == null ? void 0 : Je.instagramLink, B.value = (Qe = l.value) == null ? void 0 : Qe.facebookLink, N.value = (Xe = l.value) == null ? void 0 : Xe.twitterLink, K.value = (el = l.value) == null ? void 0 : el.linkedInLink, H.value = (ll = l.value) == null ? void 0 : ll.websiteLink, ue.value = (al = l.value) == null ? void 0 : al.externalId, x.value = [], O.value = [], (tl = (ol = l.value) == null ? void 0 : ol.externalCalendars) == null || tl.forEach((Te) => {
x.value.push(Te.address), O.value.push(!0);
}), x.value.push(""), O.value.push(!0), (nl = l.value) != null && nl.timeZone && U.value.push((sl = l.value) == null ? void 0 : sl.timeZone), h.value = [], (dl = (il = l.value) == null ? void 0 : il.vacations) == null || dl.forEach((Te) => h.value.push({
startDate: new Date(Te.startDate),
endDate: new Date(Te.endDate)
})), h.value.push({}), M.value = (ul = l.value) != null && ul.workingHours ? (rl = l.value) == null ? void 0 : rl.workingHours : [], Vl()) : j.value = [];
}
function Vl() {
le.value = "", D && (le.value = u.userDomain + "/web/widget/?c=" + D);
}
function jl(n) {
I.value = void 0, $.value = n, ie.value = void 0, n && zl(n).then((i) => {
!i || typeof i == "string" && (ie.value = i);
});
}
function xl(n) {
q.value = void 0, J.value = n, A.value = void 0, n && zl(n).then((i) => {
!i || typeof i == "string" && (A.value = i);
});
}
function Ze(n) {
return n.filter((i) => i.startDate && i.endDate).map((i) => ({ startDate: hl(i.startDate), endDate: hl(i.endDate) }));
}
function wl() {
!l.value || !E.value || (l.value.name = E.value, l.value.description = ze.value, l.value.address = {
street: Q.value,
otherStreet: X.value,
zipCode: W.value,
city: ee.value,
country: j.value && j.value.length > 0 ? j.value[0] : "",
state: de.value
}, l.value.phone = he.value, l.value.email = P.value, l.value.websiteLink = H.value, l.value.twitterLink = N.value, l.value.facebookLink = B.value, l.value.instagramLink = Z.value, l.value.linkedInLink = K.value, l.value.picture = yl.fromFileData(I.value === void 0 && $.value === void 0, ie.value), l.value.photo = yl.fromFileData(q.value === void 0 && J.value === void 0, A.value), l.value.timeZone = U.value && U.value.length >= 0 ? U.value[0] : "Europe/Paris", l.value.workingHours = M.value, h.value && (l.value.vacations = Ze(h.value)), l.value.externalId = ue.value, l.value.externalCalendars = x.value.filter((n) => n).map((n) => ({ address: n, type: "ics" })));
}
async function Cl() {
if (be) {
const { reveal: n, onConfirm: i } = be(pl, {
locale: t,
closeOnBlurClick: !0,
confirmation: f.global.t("common.action.confirm"),
description: f.global.t("settings.company-details.unavailable.confirmApply"),
title: f.global.t("common.title.warning")
});
i(async () => {
await G.patchAllStaff(D, null, Ze(h.value));
}), await n();
}
}
function Dl() {
F.value = !0;
}
function Ul(n) {
M.value = n, F.value = !1;
}
async function Fl() {
if (be) {
const { reveal: n, onConfirm: i } = be(pl, {
locale: t,
closeOnBlurClick: !0,
confirmation: f.global.t("common.action.confirm"),
description: f.global.t("settings.company-details.hours.confirmApply"),
title: f.global.t("common.title.warning")
});
i(async () => {
await G.patchAllStaff(D, M.value, null);
}), await n();
}
}
function Tl() {
L.value = !0, l.value && (wl(), Ll().then((n) => {
n && (Ee("companyUpdated", n), ae == null || ae.success(f.global.t("settings.company-details.save-success")), l.value = n, (se || T) && (V == null || V.push({ name: Se.CompanyDetails, params: { companyId: n.id } })), Be(), L.value = !1);
}).catch((n) => {
Y == null || Y.error("vue-settings", "[Company Details] Error", n), ae == null || ae.error(f.global.t("settings.company-details.save-error")), L.value = !1;
}));
}
async function Ll() {
if (!!l.value)
return T && D ? await G.cloneCompany(D, l.value) : se || T ? await G.createCompany(u.email, l.value) : await G.updateCompany(D, l.value);
}
function Sl() {
x.value.push(""), O.value.push(!0);
}
function El(n, i) {
n === x.value[i] && (x.value.splice(i, 1), O.value.splice(i, 1));
}
function Il() {
h.value.push({});
}
function $l(n, i) {
n === h.value[i] && h.value.splice(i, 1);
}
function Al(n) {
var c;
const i = (c = M.value) == null ? void 0 : c.find((m) => m.day === n);
return i ? i.hours.map((m) => `${m.start} - ${m.end}`).join(" / ") : f.global.t("settings.common.day.closed");
}
function Wl(n, i, ...c) {
const m = typeof i == "boolean" ? i : i.isValid;
switch (n) {
case "name":
oe.value = m;
break;
case "phone":
ke.value = m;
break;
case "email":
Ue.value = m;
break;
case "website":
re.value = m;
break;
case "facebook":
ve.value = m;
break;
case "twitter":
Fe.value = m;
break;
case "instagram":
w.value = m;
break;
case "linkedIn":
Ve.value = m;
break;
case "timeZone":
Ie.value = m;
break;
case "externalCalendars":
const [S] = c;
O.value[S] = m;
break;
}
}
function Pl() {
}
function Hl() {
V == null || V.push({ name: se ? Se.Companies : Se.CompanyHome });
}
const Ne = ml(() => {
var i;
return [Q.value, X.value, W.value, ee.value, de.value, Pe.getName(((i = j.value) != null ? i : [""])[0], t)].filter((c) => c).join(", ");
}), Bl = ml(() => oe.value && Ie.value && ke.value && Ue.value && re.value && ve.value && Fe.value && w.value && Ve.value && O.value.filter((n) => !n).length === 0);
return {
company: l,
companyName: E,
companyDescription: ze,
companyLogo: I,
companyLogoFile: $,
companyLogoFileData: ie,
onCompanyLogoUpdated: jl,
companyPhoto: q,
companyPhotoFile: J,
companyPhotoFileData: A,
onCompanyPhotoUpdated: xl,
companyFullAddress: Ne,
companyAddress: Q,
companyAddress2: X,
companyZipCode: W,
companyCity: ee,
companyCountry: j,
companyState: de,
companyEmail: P,
phoneCountry: ge,
companyPhone: he,
companyWidgetUrl: le,
companyWebSite: H,
companyFacebook: B,
companyInstagram: Z,
companyTwitter: N,
companyLinkedIn: K,
companyIdExterne: ue,
companyExternalCalendars: x,
addExternalCalendar: Sl,
sliceExternalCalendar: El,
companyTimeZone: U,
companyVacations: h,
addVacation: Il,
sliceVacation: $l,
onVacationsApply: Cl,
companyWorkingHours: M,
formatWorkingHours: Al,
WORKING_DAYS: _e,
onWorkingHoursEdit: Dl,
showWorkingHoursModal: F,
onWorkingHoursModalSave: Ul,
onWorkingHoursApply: Fl,
loading: L,
submitReady: Bl,
validatedField: Wl,
onSave: Tl,
openMenu: Pl,
pageOptions: ce,
countriesValues: De,
back: Hl
};
}
const ea = ["aria-label"], la = ["disabled", "aria-label"], aa = { class: "az-flex az-flex-col az-gap-4" }, oa = /* @__PURE__ */ s("div", { class: "az-divider" }, null, -1), ta = { class: "az-flex az-flex-col az-gap-4" }, na = { class: "az-settings-split az-flex az-gap-4" }, sa = { class: "az-settings-split az-flex az-gap-4" }, ia = /* @__PURE__ */ s("div", { class: "az-divider" }, null, -1), da = { class: "az-flex az-flex-col az-gap-4" }, ua = { class: "az-settings-split az-flex az-gap-4" }, ra = /* @__PURE__ */ s("div", { class: "az-divider" }, null, -1), ca = { class: "az-flex az-flex-col az-gap-4" }, ma = { class: "az-settings-split az-flex az-gap-4" }, pa = { class: "az-settings-split az-flex az-gap-4" }, ga = /* @__PURE__ */ s("div", { class: "az-divider" }, null, -1), ba = { class: "az-flex az-flex-col az-gap-2" }, va = { class: "az-settings-hours" }, ya = { class: "az-flex az-flex-col az-justify-between" }, fa = { class: "az-body-1 az-font-medium" }, za = { class: "az-body-2" }, ha = { class: "az-flex az-flex-col az-items-end" }, _a = { class: "az-settings-hours-list" }, ka = { class: "az-font-medium" }, Va = /* @__PURE__ */ s("div", { class: "az-flex az-w-full az-justify-end" }, null, -1), ja = /* @__PURE__ */ s("div", { class: "az-divider" }, null, -1), xa = { class: "az-flex az-gap-2 az-flex-col" }, wa = { class: "az-flex az-flex-1 az-gap-4" }, Ca = /* @__PURE__ */ s("i", {
class: "fas fa-plus",
"aria-hidden": "true"
}, null, -1), Da = [
Ca
], Ua = ["onClick", "onKeyup"], Fa = /* @__PURE__ */ s("i", {
class: "fas fa-xmark",
"aria-hidden": "true"
}, null, -1), Ta = [
Fa
], La = { class: "az-flex az-flex-col az-gap-1" }, Sa = { class: "az-flex az-gap-2 az-items-center" }, Ea = {
class: "az-body-2 az-font-medium",
style: { color: "var(--az-black)" }
}, Ia = { class: "az-flex az-flex-col az-gap-2" }, $a = { class: "az-flex az-gap-2 az-w-full" }, Aa = /* @__PURE__ */ s("i", {
class: "fas fa-plus",
"aria-hidden": "true"
}, null, -1), Wa = [
Aa
], Pa = ["onClick", "onKeyup"], Ha = /* @__PURE__ */ s("i", {
class: "fas fa-xmark",
"aria-hidden": "true"
}, null, -1), Ba = [
Ha
], Za = /* @__PURE__ */ s("div", { class: "az-divider" }, null, -1), Na = { class: "az-flex az-flex-col az-gap-4" }, Ka = { class: "az-settings-preview" }, Ma = { class: "az-title-h3" }, Oa = { class: "az-flex az-border az-border-grey-50 az-rounded-200 az-overflow-hidden az-justify-center az-flex-col" }, Ra = {
class: "az-bg-grey-50 az-w-full az-flex az-items-center az-justify-center",
style: { height: "154px" }
}, Ga = {
key: 0,
class: "fa fa-image az-text-title1 az-text-grey-500",
"aria-hidden": "true"
}, Ya = { class: "az-flex az-flex-col az-p-4 az-text-center az-gap-2" }, qa = { class: "az-text-title3 az-font-medium" }, Ja = {
key: 0,
class: "az-text-body2 az-text-grey-500"
}, Qa = ["href"], Xa = {
class: "az-flex az-justify-between az-settings-preview-actions",
style: { color: "var(--az-grey-500)" }
}, eo = { class: "az-flex" }, lo = ["href"], ao = /* @__PURE__ */ s("i", {
class: "fa-regular fa-phone az-text-primary-500",
"aria-hidden": "true"
}, null, -1), oo = [
ao
], to = ["href"], no = /* @__PURE__ */ s("i", {
class: "fa-regular fa-envelope az-text-primary-500",
"aria-hidden": "true"
}, null, -1), so = [
no
], io = { class: "az-flex" }, uo = ["href"], ro = /* @__PURE__ */ s("i", {
class: "fa-regular fa-globe az-text-grey-500",
"aria-hidden": "true"
}, null, -1), co = [
ro
], mo = ["href"], po = /* @__PURE__ */ s("i", {
class: "fa-brands fa-facebook az-text-grey-500",
"aria-hidden": "true"
}, null, -1), go = [
po
], bo = ["href"], vo = /* @__PURE__ */ s("i", {
class: "fa-brands fa-instagram az-text-grey-500",
"aria-hidden": "true"
}, null, -1), yo = [
vo
], fo = ["href"], zo = /* @__PURE__ */ s("i", {
class: "fa-brands fa-twitter az-text-grey-500",
"aria-hidden": "true"
}, null, -1), ho = [
zo
], _o = ["href"], ko = /* @__PURE__ */ s("i", {
class: "fa-brands fa-linkedin az-text-grey-500",
"aria-hidden": "true"
}, null, -1), Vo = [
ko
], Ao = /* @__PURE__ */ Nl({
__name: "View",
props: {
api: {},
organisation: {},
locale: {},
companyId: {},
logger: {},
new: { type: Boolean },
clone: { type: Boolean },
router: {}
},
emits: ["companyUpdated", "menuClick"],
setup(Ee, { emit: G }) {
const u = Ee, t = _l(u.locale), He = G, D = d(null), Y = Ml.map((ye) => ({ label: ye.label, value: ye.tzCode })), {
company: se,
companyName: T,
companyDescription: V,
companyLogo: l,
companyLogoFile: L,
companyLogoFileData: E,
onCompanyLogoUpdated: ze,
companyPhoto: U,
companyPhotoFile: I,
companyPhotoFileData: $,
onCompanyPhotoUpdated: ie,
companyFullAddress: q,
companyAddress: J,
companyAddress2: A,
companyZipCode: Q,
companyCity: X,
companyCountry: W,
companyState: ee,
companyEmail: j,
phoneCountry: de,
companyPhone: P,
companyWidgetUrl: he,
companyWebSite: H,
companyFacebook: B,
companyInstagram: Z,
companyTwitter: N,
companyLinkedIn: K,
companyIdExterne: ue,
companyExternalCalendars: x,
addExternalCalendar: h,
sliceExternalCalendar: M,
companyTimeZone: _e,
companyVacations: F,
addVacation: le,
sliceVacation: ge,
onVacationsApply: f,
companyWorkingHours: ae,
formatWorkingHours: be,
WORKING_DAYS: De,
onWorkingHoursEdit: oe,
showWorkingHoursModal: ke,
onWorkingHoursModalSave: Ue,
onWorkingHoursApply: re,
loading: ve,
submitReady: Fe,
validatedField: w,
onSave: Ve,
openMenu: Ie,
pageOptions: O,
countriesValues: ce,
back: je
} = Xl(He, u.api, u.organisation, u.locale, D, u.companyId, u.logger, u.new, u.clone, u.router);
return (ye, a) => (p(), Ae(e(Ol), {
id: "settings-company-details",
options: e(O),
locale: u.locale,
onMobileBack: e(je)
}, {
actions: _(() => [
s("button", {
ref_key: "cancelButton",
ref: D,
onClick: a[0] || (a[0] = (...o) => e(je) && e(je)(...o)),
class: "az-btn az-btn-color-neutral az-whitespace-nowrap",
"aria-label": e(t).global.t("settings.action.cancel")
}, k(e(t).global.t("settings.action.cancel")), 9, ea),
s("button", {
class: "az-btn az-btn-color-primary",
onClick: a[1] || (a[1] = (...o) => e(Ve) && e(Ve)(...o)),
disabled: !e(Fe) || e(ve),
"aria-label": e(t).global.t("settings.action.save")
}, k(e(t).global.t("settings.action.save")), 9, la)
]),
general: _(() => [
r(e(R), { id: "company-settings-general-main" }, {
content: _(() => [
s("div", aa, [
r(e(pe), {
id: "companyName",
modelValue: e(T),
"onUpdate:modelValue": a[2] || (a[2] = (o) => z(T) ? T.value = o : null),
onValidated: a[3] || (a[3] = (o) => {
e(w)("name", o);
}),
locale: u.locale,
label: e(t).global.t("settings.company-details.name.label"),
mandatory: e(g).mandatory,
placeholder: e(t).global.t("settings.company-details.name.placeholder")
}, null, 8, ["modelValue", "locale", "label", "mandatory", "placeholder"]),
r(e(gl), {
disabled: e(ve),
id: "companyLogo",
modelValue: e(L),
"onUpdate:modelValue": [
a[4] || (a[4] = (o) => z(L) ? L.value = o : null),
e(ze)
],
locale: u.locale,
fileInfo: { maxSize: 5, extensions: [".png", ".gif", ".jpeg", ".jpg"] },
label: e(t).global.t("settings.company-details.logo.label"),
mandatory: e(g).optional,
defaultFilename: e(l) ? e(t).global.t("settings.company-details.logo.default-name") : void 0,
placeholder: e(t).global.t("settings.company-details.logo.placeholder"),
"helper-message": e(t).global.t("settings.company-details.logo.helper"),
buttonLabel: e(t).global.t("settings.company-details.logo.button")
}, null, 8, ["disabled", "modelValue", "onUpdate:modelValue", "locale", "fileInfo", "label", "mandatory", "defaultFilename", "placeholder", "helper-message", "buttonLabel"]),
r(e(Rl), {
id: "companyDescription",
modelValue: e(V),
"onUpdate:modelValue": a[5] || (a[5] = (o) => z(V) ? V.value = o : null),
locale: u.locale,
label: e(t).global.t("settings.company-details.description.label"),
mandatory: e(g).optional,
placeholder: e(t).global.t("settings.company-details.description.placeholder")
}, null, 8, ["modelValue", "locale", "label", "mandatory", "placeholder"]),
r(e(gl), {
disabled: e(ve),
id: "companyPhoto",
modelValue: e(I),
"onUpdate:modelValue": [
a[6] || (a[6] = (o) => z(I) ? I.value = o : null),
e(ie)
],
locale: u.locale,
fileInfo: { maxSize: 5, extensions: [".png", ".gif", ".jpeg", ".jpg"] },
label: e(t).global.t("settings.company-details.photo.label"),
mandatory: e(g).optional,
defaultFilename: e(U) ? e(t).global.t("settings.company-details.photo.default-name") : void 0,
placeholder: e(t).global.t("settings.company-details.photo.placeholder"),
"helper-message": e(t).global.t("settings.company-details.photo.helper"),
buttonLabel: e(t).global.t("settings.company-details.photo.button")
}, null, 8, ["disabled", "modelValue", "onUpdate:modelValue", "locale", "fileInfo", "label", "mandatory", "defaultFilename", "placeholder", "helper-message", "buttonLabel"])
])
]),
_: 1
}),
oa,
r(e(R), {
id: "company-settings-general-address",
title: e(t).global.t("settings.company-details.address.title"),
subTitle: e(t).global.t("settings.company-details.address.subtitle")
}, {
content: _(() => [
s("div", ta, [
r(e(pe), {
id: "companyAddress",
modelValue: e(J),
"onUpdate:modelValue": a[7] || (a[7] = (o) => z(J) ? J.value = o : null),
locale: u.locale,
label: e(t).global.t("settings.company-details.address.label"),
mandatory: e(g).optional,
placeholder: e(t).global.t("settings.company-details.address.placeholder")
}, null, 8, ["modelValue", "locale", "label", "mandatory", "placeholder"]),
r(e(pe), {
id: "companyAddress2",
modelValue: e(A),
"onUpdate:modelValue": a[8] || (a[8] = (o) => z(A) ? A.value = o : null),
locale: u.locale,
label: e(t).global.t("settings.company-details.address2.label"),
mandatory: e(g).optional,
placeholder: ""
}, null, 8, ["modelValue", "locale", "label", "mandatory"]),
s("div", na, [
r(e(pe), {
id: "companyZipCode",
class: "az-flex-1",
modelValue: e(Q),
"onUpdate:modelValue": a[9] || (a[9] = (o) => z(Q) ? Q.value = o : null),
locale: u.locale,
label: e(t).global.t("settings.company-details.zipcode.label"),
mandatory: e(g).optional,
placeholder: e(t).global.t("settings.company-details.zipcode.placeholder")
}, null, 8, ["modelValue", "locale", "label", "mandatory", "placeholder"]),
r(e(pe), {
id: "companyCity",
class: "az-flex-1",
modelValue: e(X),
"onUpdate:modelValue": a[10] || (a[10] = (o) => z(X) ? X.value = o : null),
locale: u.locale,
label: e(t).global.t("settings.company-details.city.label"),
mandatory: e(g).optional,
placeholder: e(t).global.t("settings.company-details.city.placeholder")
}, null, 8, ["modelValue", "locale", "label", "mandatory", "placeholder"])
]),
s("div", sa, [
r(e(pe), {
id: "companyState",
class: "az-flex-1",
modelValue: e(ee),
"onUpdate:modelValue": a[11] || (a[11] = (o) => z(ee) ? ee.value = o : null),
locale: u.locale,
label: e(t).global.t("settings.company-details.state.label"),
mandatory: e(g).optional,
placeholder: ""
}, null, 8, ["modelValue", "locale", "label", "mandatory"]),
e(W) !== void 0 ? (p(), Ae(e(bl), {
key: 0,
id: "companyCountry",
class: "az-flex-1",
modelValue: e(W),
"onUpdate:modelValue": a[12] || (a[12] = (o) => z(W) ? W.value = o : null),
values: e(ce),
locale: u.locale,
label: e(t).global.t("settings.company-details.country.label"),
mandatory: e(g).optional,
placeholder: ""
}, null, 8, ["modelValue", "values", "locale", "label", "mandatory"])) : C("", !0)
])
])
]),
_: 1
}, 8, ["title", "subTitle"]),
ia,
r(e(R), {
id: "company-settings-general-contact",
title: e(t).global.t("settings.company-details.contact.title"),
subTitle: e(t).global.t("settings.company-details.contact.subtitle")
}, {
content: _(() => [
s("div", da, [
s("div", ua, [
r(e(Gl), {
id: "companyEmail",
class: "az-flex-1",
onValidated: a[13] || (a[13] = (o) => {
e(w)("email", o);
}),
modelValue: e(j),
"onUpdate:modelValue": a[14] || (a[14] = (o) => z(j) ? j.value = o : null),
locale: u.locale,
label: e(t).global.t("settings.company-details.email.label"),
mandatory: e(g).optional,
placeholder: e(t).global.t("settings.company-details.email.placeholder")
}, null, 8, ["modelValue", "locale", "label", "mandatory", "placeholder"]),
e(de) ? (p(), Ae(e(Yl), {
key: 0,
id: "companyPhone",
class: "az-flex-1",
onValidated: a[15] || (a[15] = (o) => {
e(w)("phone", o);
}),
modelValue: e(P),
"onUpdate:modelValue": a[16] || (a[16] = (o) => z(P) ? P.value = o : null),
"default-country": e(de),
locale: u.locale,
label: e(t).global.t("settings.company-details.phone.label"),
placeholder: e(t).global.t("settings.company-details.phone.placeholder"),
mandatory: e(g).optional
}, null, 8, ["modelValue", "default-country", "locale", "label", "placeholder", "mandatory"])) : C("", !0)
])
])
]),
_: 1
}, 8, ["title", "subTitle"]),
ra,
r(e(R), {
id: "company-settings-general-web",
title: e(t).global.t("settings.company-details.web.title"),
subTitle: e(t).global.t("settings.company-details.contact.subtitle")
}, {
content: _(() => [
s("div", ca, [
r(e(fe), {
id: "companyWebSite",
modelValue: e(H),
"onUpdate:modelValue": a[17] || (a[17] = (o) => z(H) ? H.value = o : null),
onValidated: a[18] || (a[18] = (o) => {
e(w)("website", o);
}),
locale: u.locale,
label: e(t).global.t("settings.company-details.website.label"),
mandatory: e(g).optional,
placeholder: e(t).global.t("settings.company-details.website.placeholder")
}, null, 8, ["modelValue", "locale", "label", "mandatory", "placeholder"]),
s("div", ma, [
r(e(fe), {
id: "companyFacebook",
class: "az-flex-1",
modelValue: e(B),
"onUpdate:modelValue": a[19] || (a[19] = (o) => z(B) ? B.value = o : null),
onValidated: a[20] || (a[20] = (o) => {
e(w)("facebook", o);
}),
locale: u.locale,
label: e(t).global.t("settings.company-details.facebook.label"),
mandatory: e(g).optional,
placeholder: ""
}, null, 8, ["modelValue", "locale", "label", "mandatory"]),
r(e(fe), {
id: "companyInstagram",
class: "az-flex-1",
modelValue: e(Z),
"onUpdate:modelValue": a[21] || (a[21] = (o) => z(Z) ? Z.value = o : null),
onValidated: a[22] || (a[22] = (o) => {
e(w)("instagram", o);
}),
locale: u.locale,
label: e(t).global.t("settings.company-details.instagram.label"),
mandatory: e(g).optional,
placeholder: ""
}, null, 8, ["modelValue", "locale", "label", "mandatory"])
]),
s("div", pa, [
r(e(fe), {
id: "companyTwitter",
class: "az-flex-1",
modelValue: e(N),
"onUpdate:modelValue": a[23] || (a[23] = (o) => z(N) ? N.value = o : null),
onValidated: a[24] || (a[24] = (o) => {
e(w)("twitter", o);
}),
locale: u.locale,
label: e(t).global.t("settings.company-details.twitter.label"),
mandatory: e(g).optional,
placeholder: ""
}, null, 8, ["modelValue", "locale", "label", "mandatory"]),
r(e(fe), {
id: "companyLinkedIn",
class: "az-flex-1",
modelValue: e(K),
"onUpdate:modelValue": a[25] || (a[25] = (o) => z(K) ? K.value = o : null),
onValidated: a[26] || (a[26] = (o) => {
e(w)("linkedIn", o);
}),
locale: u.locale,
label: e(t).global.t("settings.company-details.linkedin.label"),
mandatory: e(g).optional,
placeholder: ""
}, null, 8, ["modelValue", "locale", "label", "mandatory"])
])
])
]),
_: 1
}, 8, ["title", "subTitle"])
]),
hours: _(() => [
r(e(R), {
id: "company-settings-hours-timezone",
title: e(t).global.t("settings.company-details.timeZone.title"),
subTitle: ""
}, {
content: _(() => [
s("div", null, [
r(e(bl), {
id: "companyTimeZone",
locale: u.locale,
mandatory: e(g).mandatory,
values: e(Y),
onValidated: a[27] || (a[27] = (o) => {
e(w)("timeZone", o);
}),
modelValue: e(_e),
"onUpdate:modelValue": a[28] || (a[28] = (o) => z(_e) ? _e.value = o : null),
placeholder: e(t).global.t("settings.company-details.timeZone.placeholder"),
label: e(t).global.t("settings.company-details.timeZone.label"),
"helper-message": e(t).global.t("settings.company-details.timeZone.helper")
}, null, 8, ["locale", "mandatory", "values", "modelValue", "placeholder", "label", "helper-message"])
])
]),
_: 1
}, 8, ["title"]),
ga,
r(e(R), {
id: "company-settings-hours-hours",
title: e(t).global.t("settings.company-details.hours.title"),
subTitle: ""
}, {
content: _(() => [
s("div", ba, [
s("div", va, [
s("div", ya, [
s("div", null, [
s("div", fa, k(e(t).global.t("settings.company-details.hours.open")), 1),
s("div", za, k(e(t).global.t("settings.company-details.hours.all-weeks")), 1)
]),
s("button", {
class: "az-btn az-btn-color-neutral az-w-fit",
onClick: a[29] || (a[29] = (...o) => e(oe) && e(oe)(...o)),
onKeyup: a[30] || (a[30] = me(
(...o) => e(oe) && e(oe)(...o),
["enter"]
))
}, k(e(t).global.t("settings.company-details.hours.edit")), 33)
]),
s("div", ha, [
s("div", _a, [
(p(!0), y(Le, null, We(e(De), (o) => (p(), y(Le, null, [
s("div", ka, k(e(t).global.t(`settings.common.day.${o}`)) + " :", 1),
s("div", null, k(e(be)(o)), 1)
], 64))), 256))
]),
r(Ql, {
locale: u.locale,
display: e(ke),
workingHours: e(ae),
onClose: a[31] || (a[31] = (o) => ke.value = !1),
onSave: e(Ue)
}, null, 8, ["locale", "display", "workingHours", "onSave"])
]),
Va
]),
s("button", {
class: "az-btn az-btn-color-secondary az-w-fit",
onClick: a[32] || (a[32] = (...o) => e(re) && e(re)(...o)),
onKeyup: a[33] || (a[33] = me(
(...o) => e(re) && e(re)(...o),
["enter"]
))
}, k(e(t).global.t("settings.company-details.hours.apply-to-staff")), 33)
])
]),
_: 1
}, 8, ["title"]),
ja,
r(e(R), {
id: "company-settings-hours-unavailable",
title: e(t).global.t("settings.company-details.unavailable.title"),
subTitle: ""
}, {
content: _(() => [
s("div", xa, [
(p(!0), y(Le, null, We(e(F), (o, b) => (p(), y("div", wa, [
r(e(vl), {
id: `companyVacation-${b}-start`,
modelValue: e(F)[b].startDate,
"onUpdate:modelValue": (v) => e(F)[b].startDate = v,
mandatory: e(g).ignore,
label: "",
locale: u.locale,
"max-date": e(F)[b].endDate,
mode: "date",
class: "az-flex-1",
placeholder: ""
}, null, 8, ["id", "modelValue", "onUpdate:modelValue", "mandatory", "locale", "max-date"]),
r(e(vl), {
id: `companyVacation-${b}-end`,
modelValue: e(F)[b].endDate,
"onUpdate:modelValue": (v) => e(F)[b].endDate = v,
"min-date": e(F)[b].startDate,
mandatory: e(g).ignore,
locale: u.locale,
label: "",
class: "az-flex-1",
mode: "date",
placeholder: ""
}, null, 8, ["id", "modelValue", "onUpdate:modelValue", "min-date", "mandatory", "locale"]),
b === e(F).length - 1 ? (p(), y("button", {
key: 0,
class: "az-btn az-btn-color-neutral az-btn-icon-alone",
onClick: a[34] || (a[34] = (...v) => e(le) && e(le)(...v)),
onKeyup: a[35] || (a[35] = me(
(...v) => e(le) && e(le)(...v),
["enter"]
))
}, Da, 32)) : (p(), y("button", {
key: 1,
class: "az-btn az-btn-color-neutral az-btn-icon-alone",
onClick: (v) => e(ge)(o, b),
onKeyup: me((v) => e(ge)(o, b), ["enter"])
}, Ta, 40, Ua))
]))), 256)),
s("button", {
class: "az-btn az-btn-color-secondary az-w-fit",
onClick: a[36] || (a[36] = (...o) => e(f) && e(f)(...o)),
onKeyup: a[37] || (a[37] = me(
(...o) => e(f) && e(f)(...o),
["enter"]
))
}, k(e(t).global.t("settings.company-details.unavailable.apply-to-staff")), 33)
])
]),
_: 1
}, 8, ["title"])
]),
advanced: _(() => [
r(e(R), {
id: "company-settings-advanced-external-calendars",
title: e(t).global.t("settings.company-details.external-calendars"),
subTitle: ""
}, {
content: _(() => [
s("div", La, [
s("div", Sa, [
s("div", Ea, k(e(t).global.t("settings.company-details.icals.title")), 1)
]),
s("div", Ia, [
(p(!0), y(Le, null, We(e(x), (o, b) => (p(), y("div", $a, [
r(e(fe), {
class: "az-w-full",
id: `companyExternalCalendars-${b}`,
modelValue: e(x)[b],
"onUpdate:modelValue": (v) => e(x)[b] = v,
label: "",
mandatory: e(g).ignore,
onValidated: (v) => {
e(w)("externalCalendars", v, b);
},
locale: u.locale,
placeholder: e(t).global.t("settings.company-details.icals.placeholder")
}, null, 8, ["id", "modelValue", "onUpdate:modelValue", "mandatory", "onValidated", "locale", "placeholder"]),
b === e(x).length - 1 ? (p(), y("button", {
key: 0,
class: "az-btn az-btn-color-neutral az-btn-icon-alone",
onClick: a[38] || (a[38] = (...v) => e(h) && e(h)(...v)),
onKeyup: a[39] || (a[39] = me(
(...v) => e(h) && e(h)(...v),
["enter"]
))
}, Wa, 32)) : (p(), y("button", {
key: 1,
class: "az-btn az-btn-color-neutral az-btn-icon-alone",
onClick: (v) => e(M)(o, b),
onKeyup: me((v) => e(M)(o, b), ["enter"])
}, Ba, 40, Pa))
]))), 256))
])
])
]),
_: 1
}, 8, ["title"]),
Za,
r(e(R), {
id: "company-settings-advanced-external-ref",
title: e(t).global.t("settings.company-details.external-ref"),
subTitle: ""
}, {
content: _(() => [
s("div", Na, [
r(e(pe), {
mandatory: e(g).optional,
id: "companyExternalId",
locale: u.locale,
label: e(t).global.t("settings.company-details.id-externe.label"),
placeholder: e(t).global.t("settings.company-details.id-externe.placeholder"),
"helper-message": e(t).global.t("settings.company-details.id-externe.helper"),
modelValue: e(ue),
"onUpdate:modelValue": a[40] || (a[40] = (o) => z(ue) ? ue.value = o : null)
}, null, 8, ["mandatory", "locale", "label", "placeholder", "helper-message", "modelValue"])
])
]),
_: 1
}, 8, ["title"])
]),
share: _(() => {
var o;
return [
s("div", Ka, [
s("div", Ma, k(e(t).global.t("settings.common.preview")), 1),
s("div", Oa, [
s("div", Ra, [
!e($) && !e(U) && !e(E) && !e(l) ? (p(), y("i", Ga)) : C("", !0),
e($) || e(U) || e(E) || e(l) ? (p(), y("div", {
key: 1,
class: "az-h-full az-w-full az-bg-cover az-bg-center az-bg-no-repeat",
style: Kl(e($) ? `background-image:url('${e($)}');` : e(U) ? `background-image:url(${e(U)}?d=${new Date().getTime()});` : e(E) ? `background-image:url('${e(E)}');` : e(l) ? `background-image:url(${e(l)}?d=${new Date().getTime()});` : "")
}, null, 4)) : C("", !0)
]),
s("div", Ya, [
s("div", qa, k(e(T)), 1),
e(q) ? (p(), y("div", Ja, k(e(q)), 1)) : C("", !0),
(o = e(se)) != null && o.id ? (p(), y("a", {
key: 1,
class: "az-btn az-btn-color-primary az-mt-2",
target: "_blank",
href: e(he)
}, k(e(t).global.t("settings.common.book")), 9, Qa)) : C("", !0),
s("div", Xa, [
s("div", e