@hotelinking/ui 5.39.12 → 5.39.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/style.css +1 -1
- package/dist/ui.es.js +34 -30
- package/dist/ui.umd.cjs +1 -1
- package/package.json +1 -1
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.list-enter-active,.list-leave-active{transition:all
|
|
1
|
+
.list-enter-active,.list-leave-active,.list-move{transition:all 1s ease}.list-enter-from,.list-leave-to{opacity:0;transform:translate(30px)}.list-leave-active{position:absolute}
|
package/dist/ui.es.js
CHANGED
|
@@ -2398,62 +2398,66 @@ const ri = Ho(ni, [["render", function(t2, l2, n2, o2, r2, i2) {
|
|
|
2398
2398
|
return (l3, r2) => (e(), a("div", null, [i("div", Hs, [i("select", { onChange: r2[0] || (r2[0] = (e2) => {
|
|
2399
2399
|
o2("tabClicked", e2.target.value);
|
|
2400
2400
|
}), id: "tabs", name: "tabs", class: "block w-full rounded-md border-gray-300 py-2 pl-3 pr-10 text-base focus:border-indigo-500 focus:outline-none focus:ring-indigo-500 sm:text-sm" }, [(e(true), a(k, null, P(t2.tabs, (t3) => (e(), a("option", { value: t3.id, key: t3.name }, _(t3.name), 9, Ys))), 128))], 32)]), i("div", qs, [i("div", Us, [i("nav", Ws, [(e(true), a(k, null, P(t2.tabs, (t3) => (e(), a("a", { key: t3.name, onClick: (e2) => o2("tabClicked", t3.id), class: n([t3.current ? "border-indigo-500 text-indigo-600" : "border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-200", "whitespace-nowrap flex py-4 px-1 border-b-2 font-medium text-sm cursor-pointer"]), "aria-current": t3.current ? "page" : void 0 }, [I(_(t3.name) + " ", 1), t3.count ? (e(), a("span", { key: 0, class: n([t3.current ? "bg-indigo-100 text-indigo-600" : "bg-gray-100 text-gray-900", "hidden ml-3 py-0.5 px-2.5 rounded-full text-xs font-medium md:inline-block"]) }, _(t3.count), 3)) : R("", true)], 10, Ks))), 128))])])])]));
|
|
2401
|
-
} }), Zs = { key: 0, class: "bg-white overflow-hidden shadow rounded-lg" }, Xs = { class: "px-4 py-5 sm:px-6" }, Qs = { class: "text-xl font-bold" }, ed = { key: 0, class: "px-4 py-5 sm:p-6" }, td = { class: "flow-root" }, ld = { class: "
|
|
2401
|
+
} }), Zs = { key: 0, class: "bg-white overflow-hidden shadow rounded-lg" }, Xs = { class: "px-4 py-5 sm:px-6" }, Qs = { class: "text-xl font-bold" }, ed = { key: 0, class: "px-4 py-5 sm:p-6" }, td = { class: "flow-root" }, ld = { class: "relative pb-8" }, nd = { key: 0, class: "absolute left-4 top-4 -ml-px h-full w-0.5 bg-gray-200", "aria-hidden": "true" }, ad = { class: "relative flex space-x-3" }, od = { class: "min-w-0 flex-1 pt-1.5 flex justify-between space-x-4 items-center" }, rd = { class: "text-sm text-gray-500" }, id = ["onClick"], sd = { class: "text-right text-sm whitespace-nowrap text-gray-500" }, dd = ["datetime"], ud = { key: 1, class: "bg-gray-50 px-4 py-4 sm:px-6 z-10" }, cd = { class: "text-sm" }, pd = { key: 2, class: "h-full w-full flex items-center justify-center flex-col mb-5" }, gd = i("p", { class: "text-xs uppercase text-gray-300 font-bold" }, "No data", -1), fd = { key: 1, class: "bg-white overflow-hidden shadow rounded-lg" }, md = i("div", { class: "px-4 py-5 sm:px-6 animate-pulse" }, [i("h1", { class: "text-xl font-bold" }, [i("div", { class: "h-2.5 bg-gray-200 rounded-full dark:bg-gray-300 w-1/4" })])], -1), vd = { class: "px-4 py-5 sm:p-6 animate-pulse" }, hd = { class: "flow-root" }, bd = { class: "relative pb-8" }, yd = { key: 0, class: "absolute left-4 top-4 -ml-px h-full w-0.5 bg-gray-200", "aria-hidden": "true" }, xd = i("div", { class: "relative flex space-x-3" }, [i("div", null, [i("span", { class: "h-8 w-8 rounded-full bg-gray-300 flex items-center justify-center ring-4 ring-white" })]), i("div", { class: "min-w-0 flex-1 pt-1.5 flex justify-between space-x-4 items-center" }, [i("div", null, [i("p", { class: "text-sm text-gray-500 flex-1" }, [i("div", { class: "h-2.5 bg-gray-200 rounded-full dark:bg-gray-300 w-full" })])]), i("div", { class: "text-right text-sm whitespace-nowrap text-gray-500 flex-1" }, [i("div", { class: "h-2.5 bg-gray-200 rounded-full dark:bg-gray-300 w-1/4" })])])], -1), wd = i("div", { class: "bg-gray-50 px-4 py-4 sm:px-6 z-10 animate-pulse" }, [i("div", { class: "text-sm" }, [i("div", { class: "h-2.5 bg-gray-200 rounded-full dark:bg-gray-300 w-1/4" })])], -1), kd = { name: "uiTimeline" }, Sd = Object.assign(kd, { props: { name: { type: String, required: true }, timeline: { type: Object, default: () => {
|
|
2402
2402
|
} }, loading: { type: Boolean, default: true }, empty: { type: Boolean, default: false } }, setup(t2) {
|
|
2403
2403
|
const l2 = O(t2.timeline);
|
|
2404
|
-
return (
|
|
2404
|
+
return y(() => {
|
|
2405
|
+
setInterval(() => {
|
|
2406
|
+
l2.items.unshift({ id: 1, content: "Se ha conectado al WIFI", target: "Xisco Lladó", href: "#", date: "2 min ago", datetime: "2020-09-20", iconBackground: "bg-green-400" }), timeline.timeline.items.pop();
|
|
2407
|
+
}, 3e3);
|
|
2408
|
+
}), (r2, s2) => {
|
|
2405
2409
|
const d2 = $("uiIcon");
|
|
2406
|
-
return t2.loading ? (e(), a("div",
|
|
2410
|
+
return t2.loading ? (e(), a("div", fd, [md, i("div", vd, [i("div", hd, [o(Y, { name: "list", tag: "ul", class: "-mb-8", role: "list" }, { default: T(() => [(e(), a(k, null, P(10, (t3, l3) => i("li", { key: l3 }, [i("div", bd, [10 !== t3 ? (e(), a("span", yd)) : R("", true), xd])])), 64))]), _: 1 })])]), wd])) : (e(), a("div", Zs, [i("div", Xs, [i("h1", Qs, _(t2.name), 1)]), l2.items ? (e(), a("div", ed, [i("div", td, [o(Y, { name: "list", tag: "ul", class: "-mb-8", role: "list" }, { default: T(() => [(e(true), a(k, null, P(l2.items, (s3, u2) => {
|
|
2407
2411
|
var _a2;
|
|
2408
|
-
return e(), a("li", { key: u2 }, [i("div",
|
|
2409
|
-
}), 128))])])])) : R("", true), l2.items ? (e(), a("div",
|
|
2412
|
+
return e(), a("li", { key: u2 }, [i("div", ld, [u2 < ((_a2 = l2.items) == null ? void 0 : _a2.length) - 1 ? (e(), a("span", nd)) : R("", true), i("div", ad, [i("div", null, [i("span", { class: n([(s3 == null ? void 0 : s3.iconBackground) || "bg-indigo-600", "h-8 w-8 rounded-full flex items-center justify-center ring-4 ring-white"]) }, [o(d2, { loading: t2.loading, icon: s3 == null ? void 0 : s3.icon, "aria-hidden": "true", class: "h-5 w-5 text-white", color: "white" }, null, 8, ["loading", "icon"])], 2)]), i("div", od, [i("div", null, [i("p", rd, [i("a", { onClick: (e2) => r2.$emit("timelineEventClicked", s3 == null ? void 0 : s3.linkId), class: "font-medium text-indigo-600 hover:text-indigo-800 cursor-pointer" }, _(s3 == null ? void 0 : s3.target), 9, id), I(" " + _(s3 == null ? void 0 : s3.content), 1)])]), i("div", sd, [i("time", { datetime: s3 == null ? void 0 : s3.datetime }, _(s3 == null ? void 0 : s3.date), 9, dd)])])])])]);
|
|
2413
|
+
}), 128))]), _: 1 })])])) : R("", true), l2.items ? (e(), a("div", ud, [i("div", cd, [i("a", { class: "cursor-pointer font-medium text-indigo-600 hover:text-indigo-500", onClick: s2[0] || (s2[0] = (e2) => r2.$emit("timelineFooterClicked", t2.timeline.id)) }, _(t2.timeline.footerText), 1)])])) : (e(), a("div", pd, [o(G, { icon: u(bn), color: "gray", loading: false, size: "huge" }, null, 8, ["icon"]), gd]))]));
|
|
2410
2414
|
};
|
|
2411
|
-
} }),
|
|
2415
|
+
} }), Cd = { name: "uiTopbar", props: ["navigation", "logo", "profileMenu", "brand", "accountLogo", "alerted"], components: { Disclosure: Ml, DisclosureButton: Dl, DisclosurePanel: El, Menu: Al, MenuButton: Ll, MenuItem: Nl, MenuItems: Fl, Bars3Icon: function(t2, l2) {
|
|
2412
2416
|
return e(), a("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor", "aria-hidden": "true", "data-slot": "icon" }, [i("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" })]);
|
|
2413
|
-
}, XMarkIcon: On } },
|
|
2414
|
-
const
|
|
2417
|
+
}, XMarkIcon: On } }, Od = { class: "mx-auto px-6 lg:px-8" }, Md = { class: "flex justify-between h-20" }, Dd = { class: "flex" }, Ed = { class: "-ml-2 mr-2 flex items-center lg:hidden" }, Td = i("span", { class: "sr-only" }, "Open main menu", -1), Id = ["src"], _d = { class: "flex items-center" }, jd = { class: "lg:ml-4 lg:flex-shrink-0 lg:flex lg:items-center hidden" }, Pd = { class: "redCircle flex items-center justify-center h-4 w-4 bg-red-500 rounded-full absolute -top-0 -left-1" }, Rd = [i("span", { class: "animate-ping absolute inline-flex h-4 w-4 bg-red-500 rounded-full opacity-75" }, null, -1)], Bd = ["src"], Ad = ["onClick"], Ld = { class: "pt-2 pb-3 space-y-1" }, Fd = ["onClick"], Nd = { class: "pt-4 pb-3 border-t border-gray-200" }, zd = { class: "flex items-center px-4 sm:px-6" }, $d = { class: "flex-shrink-0" }, Vd = ["src"], Hd = { key: 0, class: "ml-3" }, Yd = { class: "text-base font-medium text-gray-800" }, qd = { class: "text-sm font-medium text-gray-500" }, Ud = { class: "mt-3 space-y-1" }, Wd = ["onClick"];
|
|
2418
|
+
const Kd = Ho(Cd, [["render", function(l2, r2, s2, d2, u2, c2) {
|
|
2415
2419
|
const p2 = $("Bars3Icon"), g2 = $("XMarkIcon"), f2 = $("DisclosureButton"), m2 = $("MenuButton"), v2 = $("MenuItem"), h2 = $("MenuItems"), b2 = $("Menu"), y2 = $("DisclosurePanel"), x2 = $("Disclosure");
|
|
2416
|
-
return e(), t(x2, { as: "nav", class: "bg-white shadow z-10" }, { default: T(({ open: d3 }) => [i("div",
|
|
2417
|
-
}]]),
|
|
2420
|
+
return e(), t(x2, { as: "nav", class: "bg-white shadow z-10" }, { default: T(({ open: d3 }) => [i("div", Od, [i("div", Md, [i("div", Dd, [i("div", Ed, [o(f2, { class: "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500" }, { default: T(() => [Td, d3 ? (e(), t(g2, { key: 1, class: "block h-6 w-6", "aria-hidden": "true" })) : (e(), t(p2, { key: 0, class: "block h-6 w-6", "aria-hidden": "true" }))]), _: 2 }, 1024)]), i("div", { class: "flex-shrink-0 flex items-center cursor-pointer", onClick: r2[0] || (r2[0] = (e2) => l2.$emit("topBarClick", "logo")) }, [i("img", { class: "h-10", src: s2.logo, alt: "Hotelinking suite product logo" }, null, 8, Id)])]), i("div", _d, [i("div", jd, [o(b2, { as: "div", class: "ml-3 relative" }, { default: T(() => [i("div", null, [B(o(m2, { class: "bg-white rounded-full flex text-sm focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 relative" }, { default: T(() => [B(i("div", Pd, Rd, 512), [[L, s2.alerted]]), i("img", { class: "h-10 w-10 rounded-full", src: s2.accountLogo }, null, 8, Bd)]), _: 1 }, 512), [[L, s2.accountLogo]])]), o(j, { "enter-active-class": "transition ease-out duration-200", "enter-from-class": "transform opacity-0 scale-95", "enter-to-class": "transform opacity-100 scale-100", "leave-active-class": "transition ease-in duration-75", "leave-from-class": "transform opacity-100 scale-100", "leave-to-class": "transform opacity-0 scale-95" }, { default: T(() => [o(h2, { class: "origin-top-right absolute right-0 mt-2 w-48 rounded-md shadow-lg py-1 bg-white ring-1 ring-black ring-opacity-5 focus:outline-none" }, { default: T(() => [(e(true), a(k, null, P(s2.profileMenu, (a2) => (e(), t(v2, { key: a2.name }, { default: T(({ active: e2 }) => [i("p", { onClick: (e3) => l2.$emit("topBarClick", a2.id), class: n(["cursor-pointer", [e2 ? "bg-gray-100" : "", "block px-4 py-2 text-sm text-gray-700"]]) }, _(a2.name), 11, Ad)]), _: 2 }, 1024))), 128))]), _: 1 })]), _: 1 })]), _: 1 })])])])]), o(y2, { class: "lg:hidden" }, { default: T(() => [i("div", Ld, [(e(true), a(k, null, P(s2.navigation, (a2) => (e(), t(f2, { as: "template", key: a2.name, class: n(["block pl-3 pr-4 py-2 border-l-4 text-base font-medium sm:pl-5 sm:pr-6", { "bg-indigo-50 border-indigo-500 text-indigo-700": a2.current && true === a2.current, "border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700": !a2.current }]) }, { default: T(() => [i("p", { onClick: (e2) => l2.$emit("topBarClick", a2.id) }, _(a2.name), 9, Fd)]), _: 2 }, 1032, ["class"]))), 128))]), i("div", Nd, [i("div", zd, [i("div", $d, [i("img", { class: "h-10 w-10 rounded-full", src: s2.accountLogo }, null, 8, Vd)]), s2.brand ? (e(), a("div", Hd, [i("div", Yd, _(s2.brand.title), 1), i("div", qd, _(s2.brand.subtitle), 1)])) : R("", true)]), i("div", Ud, [(e(true), a(k, null, P(s2.profileMenu, (n2) => (e(), t(f2, { as: "template", key: n2.name, class: "block px-4 py-2 text-base font-medium text-gray-500 hover:text-gray-800 hover:bg-gray-100 sm:px-6" }, { default: T(() => [i("p", { onClick: (e2) => l2.$emit("topBarClick", n2.id) }, _(n2.name), 9, Wd)]), _: 2 }, 1024))), 128))])])]), _: 1 })]), _: 1 });
|
|
2421
|
+
}]]), Jd = { chart: { type: "bar", toolbar: { show: false }, zoom: { enabled: false } }, colors: ["#715aff"], dataLabels: { enabled: true, formatter: function(e2, t2) {
|
|
2418
2422
|
return t2.w.globals.labels[t2.dataPointIndex] + ": " + e2;
|
|
2419
|
-
} }, markers: { strokeWidth: 0, size: 4, hover: { size: 8 } }, plotOptions: { bar: { borderRadius: 0, horizontal: true, barHeight: "80%", isFunnel: true } } },
|
|
2420
|
-
const r2 = l2, s2 = t2, c2 = d(() => ({ ...s2.options, ...
|
|
2423
|
+
} }, markers: { strokeWidth: 0, size: 4, hover: { size: 8 } }, plotOptions: { bar: { borderRadius: 0, horizontal: true, barHeight: "80%", isFunnel: true } } }, Gd = { class: "chart-header flex flex-row justify-between" }, Zd = { class: "text-sm font-medium text-gray-500 truncate" }, Xd = { class: "chart-content" }, Qd = { class: "h-full w-full flex items-center justify-center flex-col" }, eu = i("p", { class: "text-xs uppercase text-gray-300 font-bold" }, "No data", -1), tu = { class: "card chart apex-chart px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 flex grow h-80" }, lu = [i("div", { role: "status", class: "w-full animate-pulse h-full flex flex-col" }, [i("div", { class: "h-2.5 w-36 bg-gray-200 rounded-full mb-2.5" }), i("div", { class: "w-48 h-2 mb-6 bg-gray-200 rounded-full" }), i("div", { class: "flex flex-row justify-between items-baseline grow gap-x-1" }, [i("div", { class: "w-full bg-gray-200 rounded h-full" }), i("div", { class: "w-full bg-gray-200 rounded h-1/2" }), i("div", { class: "w-full bg-gray-200 rounded h-1/3" }), i("div", { class: "w-full bg-gray-200 rounded h-4/5" }), i("div", { class: "w-full bg-gray-200 rounded h-full" }), i("div", { class: "w-full bg-gray-200 rounded h-1/2" }), i("div", { class: "w-full bg-gray-200 rounded h-1/3" }), i("div", { class: "w-full bg-gray-200 rounded h-1/2" }), i("div", { class: "w-full bg-gray-200 rounded h-1/3" }), i("div", { class: "w-full bg-gray-200 rounded h-4/5" }), i("div", { class: "w-full bg-gray-200 rounded h-full" }), i("div", { class: "w-full bg-gray-200 rounded h-4/5" }), i("div", { class: "w-full bg-gray-200 rounded h-full" }), i("div", { class: "w-full bg-gray-200 rounded h-1/2" }), i("div", { class: "w-full bg-gray-200 rounded h-1/3" }), i("div", { class: "w-full bg-gray-200 rounded h-1/2" })])], -1)], nu = { name: "uiChart" }, au = Object.assign(nu, { props: { title: String, id: { type: String, default: "noChartId" }, series: { type: Object, required: true }, options: { type: Object, required: true }, loading: { type: Boolean, default: true }, empty: { type: Boolean, default: false }, range: { type: String, default: "24h" }, height: { type: Number, default: 320 } }, emits: ["selectedRange", "chartUpdated", "dataPointSelection"], setup(t2, { emit: l2 }) {
|
|
2424
|
+
const r2 = l2, s2 = t2, c2 = d(() => ({ ...s2.options, ...Jd })), p2 = d(() => s2.series), g2 = () => r2("chartUpdated"), f2 = (e2, t3, l3) => {
|
|
2421
2425
|
r2("dataPointSelection", { id: s2.id, chartContext: t3, config: l3, event: e2 });
|
|
2422
2426
|
};
|
|
2423
|
-
return (l3, r3) => (e(), a(k, null, [B(i("div", { class: n(["h-[" + t2.height + "px]", "card chart apex-chart px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 flex grow"]) }, [i("div",
|
|
2424
|
-
} }),
|
|
2427
|
+
return (l3, r3) => (e(), a(k, null, [B(i("div", { class: n(["h-[" + t2.height + "px]", "card chart apex-chart px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 flex grow"]) }, [i("div", Gd, [i("div", Zd, _(t2.title), 1), o(Wr, { range: t2.range, onRangeSelected: r3[0] || (r3[0] = (e2) => l3.$emit("selectedRange", { range: e2, chartId: t2.id })) }, null, 8, ["range"])]), B(i("div", Xd, [o(u(U), { type: l3.bar, series: p2.value, width: "100%", height: t2.height, options: c2.value, onUpdated: g2, onMounted: g2, onDataPointSelection: f2 }, null, 8, ["type", "series", "height", "options"])], 512), [[L, !t2.empty]]), B(i("div", Qd, [o(G, { icon: u(bn), color: "gray", loading: false, size: "huge" }, null, 8, ["icon"]), eu], 512), [[L, t2.empty]])], 2), [[L, !t2.loading]]), B(i("div", tu, lu, 512), [[L, t2.loading]])], 64));
|
|
2428
|
+
} }), ou = { class: "w-full flex flex-col items-center justify-center p-10 grow" }, ru = { class: "text-2xl mt-4 font-bold" }, iu = { class: "buttons flex flex-row items-center justify-center mt-8 gap-x-1" }, su = { __name: "uiNoResults", props: { title: { type: String, required: true }, message: { type: String, required: true }, actions: { type: Array } }, emits: ["action"], setup: (l2, { emit: n2 }) => (n3, r2) => (e(), a("div", ou, [o(G, { loading: false, icon: u(bn), size: "massive", color: "gray" }, null, 8, ["icon"]), i("h2", ru, _(l2.title), 1), i("p", null, _(l2.message), 1), i("div", iu, [(e(true), a(k, null, P(l2.actions, (l3, a2) => (e(), t(te, { key: a2, loading: false, onClick: (e2) => n3.$emit("action", l3.action) }, { default: T(() => [I(_(l3.text), 1)]), _: 2 }, 1032, ["onClick"]))), 128))])])) }, du = i("div", { class: "fixed inset-0" }, null, -1), uu = { class: "fixed inset-0 overflow-hidden" }, cu = { class: "absolute inset-0 overflow-hidden" }, pu = { class: "pointer-events-none fixed inset-y-0 right-0 flex max-w-full pl-10" }, gu = { class: "flex h-full flex-col overflow-y-scroll bg-white shadow-xl" }, fu = { class: "bg-indigo-700 px-4 py-6 sm:px-6" }, mu = { class: "flex items-center justify-between" }, vu = { class: "ml-3 flex h-7 items-center" }, hu = i("span", { class: "absolute -inset-2.5" }, null, -1), bu = i("span", { class: "sr-only" }, "Close panel", -1), yu = { class: "mt-1" }, xu = { class: "text-sm text-indigo-300" }, wu = { class: "relative flex-1 px-4 py-6 sm:px-6" }, ku = { name: "uiRightSidebar" }, Su = Object.assign(ku, { props: { title: { type: String, required: true }, description: { type: String }, open: { type: Boolean, default: false } }, emits: ["closeRightBar"], setup(l2, { emit: n2 }) {
|
|
2425
2429
|
const a2 = n2;
|
|
2426
|
-
return (n3, s2) => (e(), t(u(rn), { as: "template", show: l2.open }, { default: T(() => [o(u(yl), { as: "div", class: "relative z-10", onClose: s2[1] || (s2[1] = (e2) => a2("closeRightBar")) }, { default: T(() => [
|
|
2427
|
-
} }),
|
|
2430
|
+
return (n3, s2) => (e(), t(u(rn), { as: "template", show: l2.open }, { default: T(() => [o(u(yl), { as: "div", class: "relative z-10", onClose: s2[1] || (s2[1] = (e2) => a2("closeRightBar")) }, { default: T(() => [du, i("div", uu, [i("div", cu, [i("div", pu, [o(u(an), { as: "template", enter: "transform transition ease-in-out duration-500 sm:duration-700", "enter-from": "translate-x-full", "enter-to": "translate-x-0", leave: "transform transition ease-in-out duration-500 sm:duration-700", "leave-from": "translate-x-0", "leave-to": "translate-x-full" }, { default: T(() => [o(u(xl), { class: "pointer-events-auto w-screen max-w-md" }, { default: T(() => [i("div", gu, [i("div", fu, [i("div", mu, [o(u(wl), { class: "text-base font-semibold leading-6 text-white" }, { default: T(() => [I(_(l2.title), 1)]), _: 1 }), i("div", vu, [i("button", { type: "button", class: "relative rounded-md bg-indigo-700 text-indigo-200 hover:text-white outline-none", onClick: s2[0] || (s2[0] = (e2) => a2("closeRightBar")) }, [hu, bu, o(u(On), { class: "h-6 w-6 ring-0", "aria-hidden": "true" })])])]), i("div", yu, [i("p", xu, _(l2.description), 1)])]), i("div", wu, [r(n3.$slots, "default")])])]), _: 3 })]), _: 3 })])])])]), _: 3 })]), _: 3 }, 8, ["show"]));
|
|
2431
|
+
} }), Cu = { class: "uiGallery" }, Ou = { key: 1, role: "list", class: "grid grid-cols-2 gap-x-4 gap-y-8 sm:grid-cols-3 sm:gap-x-4 lg:grid-cols-6" }, Mu = { class: "group aspect-h-7 aspect-w-10 block w-full overflow-hidden rounded-lg bg-gray-100 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" }, Du = ["src"], Eu = ["onClick"], Tu = { class: "pointer-events-none mt-2 block truncate text-sm font-medium text-gray-900" }, Iu = { class: "flex items-center justify-between" }, _u = { class: "pointer-events-none block text-sm font-medium text-gray-500" }, ju = { key: 2, role: "list", class: "grid grid-cols-2 gap-x-4 gap-y-8 sm:grid-cols-3 sm:gap-x-4 lg:grid-cols-6" }, Pu = [i("div", { class: "group aspect-h-7 aspect-w-10 block w-full overflow-hidden rounded-lg bg-gray-200 animate-pulse dark:bg-gray-200 focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 focus-within:ring-offset-gray-100" }, null, -1), i("p", { class: "animate-pulse h-2.5 bg-gray-200 rounded-full dark:bg-gray-300 w-28 mt-4" }, null, -1), i("p", { class: "animate-pulse h-2.5 bg-gray-200 rounded-full dark:bg-gray-300 w-14 mt-2" }, null, -1)], Ru = { name: "uiGallery" }, Bu = Object.assign(Ru, { props: { galleryId: String, gallery: Array, loading: Boolean, literals: Object }, setup(l2, { emit: n2 }) {
|
|
2428
2432
|
const r2 = n2, d2 = s(false);
|
|
2429
|
-
return (n3, s2) => (e(), a("div",
|
|
2433
|
+
return (n3, s2) => (e(), a("div", Cu, [l2.loading ? R("", true) : (e(), t(vo, { key: 0, open: d2.value, modalName: "deleteAllImagesModal", title: l2.literals.modalTitle, type: "warning", actions: [{ value: "close", name: l2.literals.closeAction }, { value: `deleteGallery_${l2.galleryId}`, name: l2.literals.deleteAction }], onModalAction: s2[0] || (s2[0] = (e2) => {
|
|
2430
2434
|
return t2 = e2, d2.value = false, void r2("modalAction", t2);
|
|
2431
2435
|
var t2;
|
|
2432
|
-
}) }, { default: T(() => [i("p", null, _(l2.literals.modalText), 1)]), _: 1 }, 8, ["open", "title", "actions"])), l2.loading ? (e(), a("ul",
|
|
2433
|
-
} }),
|
|
2436
|
+
}) }, { default: T(() => [i("p", null, _(l2.literals.modalText), 1)]), _: 1 }, 8, ["open", "title", "actions"])), l2.loading ? (e(), a("ul", ju, [(e(), a(k, null, P(4, (e2) => i("li", null, Pu)), 64))])) : (e(), a("ul", Ou, [(e(true), a(k, null, P(l2.gallery, (t2) => (e(), a("li", { key: t2.source, class: "relative" }, [i("div", Mu, [i("img", { src: t2.source, alt: "", class: "pointer-events-none object-cover group-hover:opacity-75" }, null, 8, Du), i("button", { type: "button", class: "absolute inset-0 focus:outline-none", onClick: (e2) => n3.$emit("imgClicked", t2) }, null, 8, Eu)]), i("p", Tu, _(t2.title), 1), i("div", Iu, [i("p", _u, _(t2.size), 1), o(G, { class: "cursor-pointer", icon: u(Sn), color: "red", loading: false, onClick: (e2) => r2("deleteImage", t2) }, null, 8, ["icon", "onClick"])])]))), 128))])), l2.gallery.length > 0 && !l2.loading ? (e(), t(te, { key: 3, onClick: s2[1] || (s2[1] = (e2) => d2.value = true), class: "mt-8", loading: false, color: "red", size: "small" }, { default: T(() => [I(_(l2.literals.deleteAllImages), 1)]), _: 1 })) : R("", true)]));
|
|
2437
|
+
} }), Au = { class: "cursor-move mb-1 relative flex items-center space-x-3 rounded-lg border border-gray-300 bg-white p-4 shadow-sm focus-within:ring-2 focus-within:ring-indigo-500 focus-within:ring-offset-2 hover:border-gray-400" }, Lu = { class: "flex flex-row items-center w-full" }, Fu = { class: "content text-sm grow" }, Nu = { class: "font-bold" }, zu = { key: 0 }, $u = { class: "font-bold text-gray-400" }, Vu = { key: 1, class: "animate-pulse" }, Hu = [z('<div class="h-16 mb-1 relative flex items-center space-x-3 rounded-lg bg-gray-200 dark:bg-gray-300 p-4 shadow-sm"></div><div class="h-16 mb-1 relative flex items-center space-x-3 rounded-lg bg-gray-200 dark:bg-gray-300 p-4 shadow-sm"></div><div class="h-16 mb-1 relative flex items-center space-x-3 rounded-lg bg-gray-200 dark:bg-gray-300 p-4 shadow-sm"></div><div class="h-16 mb-1 relative flex items-center space-x-3 rounded-lg bg-gray-200 dark:bg-gray-300 p-4 shadow-sm"></div><div class="h-16 relative flex items-center space-x-3 rounded-lg bg-gray-200 dark:bg-gray-300 p-4 shadow-sm"></div>', 5)], Yu = { name: "uiDragAndDrop" }, qu = Object.assign(Yu, { props: { elements: { type: Array, required: true }, loading: true }, setup(l2) {
|
|
2434
2438
|
const n2 = l2;
|
|
2435
2439
|
let r2 = s(n2.elements);
|
|
2436
2440
|
return p(() => n2.elements, (e2) => {
|
|
2437
2441
|
r2.value = e2;
|
|
2438
|
-
}), (n3, s2) => l2.loading ? (e(), a("div",
|
|
2439
|
-
} }),
|
|
2442
|
+
}), (n3, s2) => l2.loading ? (e(), a("div", Vu, Hu)) : (e(), t(u(W), { key: 0, modelValue: u(r2), "onUpdate:modelValue": s2[0] || (s2[0] = (e2) => H(r2) ? r2.value = e2 : r2 = e2) }, { item: T(({ item: t2 }) => [i("div", Au, [i("div", Lu, [o(G, { icon: u(un), loading: false, color: "gray", class: "mr-4", size: "big" }, null, 8, ["icon"]), i("div", Fu, [i("p", Nu, _(t2.name), 1), t2.description ? (e(), a("p", zu, _(t2.description), 1)) : R("", true)]), i("div", $u, _(u(r2).indexOf(t2) + 1), 1)])])]), _: 1 }, 8, ["modelValue"]));
|
|
2443
|
+
} }), Uu = { class: "chart-header flex flex-row justify-between" }, Wu = { class: "text-sm font-medium text-gray-500 truncate" }, Ku = { class: "chart-content" }, Ju = { class: "h-full w-full flex items-center justify-center flex-col" }, Gu = i("p", { class: "text-xs uppercase text-gray-300 font-bold" }, "No data", -1), Zu = { class: "card chart apex-chart px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 flex grow h-80" }, Xu = [i("div", { role: "status", class: "w-full animate-pulse h-full flex flex-col" }, [i("div", { class: "h-2.5 w-36 bg-gray-200 rounded-full mb-2.5" }), i("div", { class: "w-48 h-2 mb-6 bg-gray-200 rounded-full" }), i("div", { class: "flex flex-row justify-between items-baseline grow gap-x-1" }, [i("div", { class: "w-full bg-gray-200 rounded h-full" }), i("div", { class: "w-full bg-gray-200 rounded h-1/2" }), i("div", { class: "w-full bg-gray-200 rounded h-1/3" }), i("div", { class: "w-full bg-gray-200 rounded h-4/5" }), i("div", { class: "w-full bg-gray-200 rounded h-full" }), i("div", { class: "w-full bg-gray-200 rounded h-1/2" }), i("div", { class: "w-full bg-gray-200 rounded h-1/3" }), i("div", { class: "w-full bg-gray-200 rounded h-1/2" }), i("div", { class: "w-full bg-gray-200 rounded h-1/3" }), i("div", { class: "w-full bg-gray-200 rounded h-4/5" }), i("div", { class: "w-full bg-gray-200 rounded h-full" }), i("div", { class: "w-full bg-gray-200 rounded h-4/5" }), i("div", { class: "w-full bg-gray-200 rounded h-full" }), i("div", { class: "w-full bg-gray-200 rounded h-1/2" }), i("div", { class: "w-full bg-gray-200 rounded h-1/3" }), i("div", { class: "w-full bg-gray-200 rounded h-1/2" })])], -1)], Qu = { name: "uiCircleChart" }, ec = Object.assign(Qu, { props: { title: String, id: { type: String, default: "noChartId" }, series: { type: Array, required: true }, labels: { type: Array, required: true }, loading: { type: Boolean, default: true }, empty: { type: Boolean, default: false }, range: { type: String, default: "24h" }, height: { type: Number, default: 320 } }, emits: ["selectedRange", "chartUpdated", "dataPointSelection"], setup(t2, { emit: l2 }) {
|
|
2440
2444
|
const r2 = l2, s2 = t2;
|
|
2441
2445
|
let c2 = { labels: s2.labels, chart: { toolbar: { show: false }, zoom: { enabled: false } }, colors: ["#715aff", "#00ffff", "#aba9ba"], stroke: { show: true, curve: "stepline", lineCap: "butt", width: 1, dashArray: 0 }, dataLabels: { enabled: true, dropShadow: { enabled: false } } };
|
|
2442
2446
|
const p2 = d(() => s2.series), g2 = d(() => ({ ...c2, ...s2.options })), f2 = () => r2("chartUpdated"), m2 = (e2, t3, l3) => {
|
|
2443
2447
|
r2("dataPointSelection", { id: s2.id, chartContext: t3, config: l3, event: e2 });
|
|
2444
2448
|
};
|
|
2445
|
-
return (l3, r3) => (e(), a(k, null, [B(i("div", { class: n(["h-[" + t2.height + "px]", "card chart apex-chart px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 flex grow"]) }, [i("div",
|
|
2446
|
-
} }),
|
|
2449
|
+
return (l3, r3) => (e(), a(k, null, [B(i("div", { class: n(["h-[" + t2.height + "px]", "card chart apex-chart px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 flex grow"]) }, [i("div", Uu, [i("div", Wu, _(t2.title), 1), o(Wr, { range: t2.range, onRangeSelected: r3[0] || (r3[0] = (e2) => l3.$emit("selectedRange", { range: e2, chartId: t2.id })) }, null, 8, ["range"])]), B(i("div", Ku, [o(u(U), { class: "flex items-center justify-center", type: "donut", series: p2.value, options: g2.value, height: t2.height, onUpdated: f2, onMounted: f2, onDataPointSelection: m2 }, null, 8, ["series", "options", "height"])], 512), [[L, !t2.empty]]), B(i("div", Ju, [o(G, { icon: u(bn), color: "gray", loading: false, size: "huge" }, null, 8, ["icon"]), Gu], 512), [[L, t2.empty]])], 2), [[L, !t2.loading]]), B(i("div", Zu, Xu, 512), [[L, t2.loading]])], 64));
|
|
2450
|
+
} }), tc = { key: 0, class: "flex flex-col lg:flex-row w-full gap-y-4 gap-x-2" }, lc = { key: 1, class: "flex flex-col lg:flex-row w-full gap-y-4 gap-x-2" }, nc = { name: "uiDateRange" }, ac = Object.assign(nc, { props: { id: { type: String, required: true }, loading: { type: Boolean, default: true }, literals: { type: Object, required: true }, color: String, values: { type: Object, default: () => ({ from: "", to: "" }) }, error: String, disabled: Boolean, label: String }, setup(t2) {
|
|
2447
2451
|
let l2 = O({ from: void 0, to: void 0 });
|
|
2448
|
-
return (r2, i2) => t2.loading ? (e(), a("div",
|
|
2449
|
-
} }),
|
|
2452
|
+
return (r2, i2) => t2.loading ? (e(), a("div", lc, [o(Vn, { loading: true }), o(Vn, { loading: true }), o(te, { loading: true }, { default: T(() => [I("Search")]), _: 1 })])) : (e(), a("div", tc, [o(Vn, { type: "date", loading: false, addOn: t2.literals.from, name: `dateFrom_${t2.id}`, color: t2.color, value: t2.values.from, error: t2.error, disabled: t2.disabled, label: t2.label, onInputChanged: i2[0] || (i2[0] = (e2) => u(l2).from = e2.value) }, null, 8, ["addOn", "name", "color", "value", "error", "disabled", "label"]), o(Vn, { type: "date", loading: false, class: n([{ "mt-6": t2.label }]), addOn: t2.literals.to, name: `dateTo_${t2.id}`, color: t2.color, value: t2.values.to, error: t2.error, disabled: t2.disabled, onInputChanged: i2[1] || (i2[1] = (e2) => u(l2).to = e2.value) }, null, 8, ["class", "addOn", "name", "color", "value", "error", "disabled"]), o(te, { disabled: t2.disabled, color: "primary", loading: false, class: n([{ "mt-6": t2.label }, "h-10"]), onClick: i2[2] || (i2[2] = (e2) => r2.$emit("uiDateRangeButtonClicked", u(l2))) }, { default: T(() => [I(_(t2.literals.search), 1)]), _: 1 }, 8, ["disabled", "class"])]));
|
|
2453
|
+
} }), oc = { class: "flex justify-between items-center" }, rc = { key: 0, class: "block text-sm font-medium text-gray-700" }, ic = { key: 1, class: "text-[10px] text-gray-500 uppercase justify-self-end" }, sc = { key: 1, class: "h-2 animate-pulse bg-gray-200 rounded-full dark:bg-gray-300 w-full" }, dc = { name: "uiRangeSlider" }, uc = Object.assign(dc, { props: { loading: { type: Boolean, default: true }, disabled: { type: Boolean, default: false }, min: Number, max: Number, sliderValue: [Array, Number], label: String, optional: String }, emits: ["sliderUpdated"], setup(l2, { emit: o2 }) {
|
|
2450
2454
|
const r2 = o2, d2 = s(l2.sliderValue);
|
|
2451
|
-
return (o3, s2) => (e(), a("div", null, [i("div",
|
|
2452
|
-
} }),
|
|
2453
|
-
Object.keys(
|
|
2454
|
-
e2.component(t2,
|
|
2455
|
+
return (o3, s2) => (e(), a("div", null, [i("div", oc, [l2.label ? (e(), a("label", rc, _(l2.label), 1)) : R("", true), l2.optional ? (e(), a("span", ic, _(l2.optional), 1)) : R("", true)]), i("div", { class: n([{ "mt-1": l2.label }, "pt-16 px-6 pb-6 bg-gray-50 border border-gray-300 rounded-lg shadow-sm"]) }, [l2.loading ? (e(), a("p", sc)) : (e(), t(u(K), { key: 0, modelValue: d2.value, "onUpdate:modelValue": s2[0] || (s2[0] = (e2) => d2.value = e2), min: l2.min, max: l2.max, disabled: l2.disabled, onChange: s2[1] || (s2[1] = (e2) => r2("sliderUpdated", e2)), classes: { base: "w-full h-full relative z-1 bg-gray-300 rounded", tooltip: "absolute block text-sm font-semibold whitespace-nowrap py-1 px-1.5 min-w-5 text-center text-white rounded border border-indigo-600 bg-indigo-600 transform h:-translate-x-1/2 h:left-1/2 v:-translate-y-1/2 v:top-1/2 slider-disabled:bg-gray-400 slider-disabled:border-gray-400 merge-h:translate-x-1/2 merge-h:left-auto merge-v:-translate-x-4 merge-v:top-auto tt-focus:hidden tt-focused:block tt-drag:hidden tt-dragging:block" } }, null, 8, ["modelValue", "min", "max", "disabled"]))], 2)]));
|
|
2456
|
+
} }), cc = { class: "mt-1 mb-8 text-sm text-gray-500" }, pc = { name: "uiSectionTitle" }, gc = Object.assign(pc, { props: { title: { type: String, required: true }, description: { type: String, default: void 0 } }, setup: (t2) => (l2, o2) => (e(), a(k, null, [i("h3", { class: n(["text-lg font-medium leading-6 text-gray-900", { "mb-8": void 0 === t2.description }]) }, _(t2.title), 3), i("p", cc, _(t2.description), 1)], 64)) }), fc = { key: 0, class: "col-span-1 flex flex-col divide-y divide-gray-200 rounded-lg bg-white text-center shadow" }, mc = { class: "flex flex-1 flex-col p-8" }, vc = { class: "text-2xl font-bold text-gray-900" }, hc = { class: "mt-1 flex flex-grow flex-col justify-between" }, bc = { class: "mt-3 flex flex-wrap gap-x-1 gap-y-1 justify-center" }, yc = { key: 1, class: "col-span-1 flex flex-col divide-y divide-gray-200 rounded-lg bg-white text-center shadow" }, xc = { class: "flex flex-1 flex-col p-8" }, wc = { class: "rounded-md p-3 flex items-center justify-center mx-auto mb-4 bg-gray-200" }, kc = i("div", { class: "h-4 bg-gray-200 rounded-full dark:bg-gray-300 w-1/3 mx-auto" }, null, -1), Sc = { class: "mt-1 flex flex-grow flex-col justify-between" }, Cc = { class: "mt-3 flex flex-wrap gap-x-1 gap-y-1 justify-center" }, Oc = { name: "uiDeviceStatus" }, Mc = Object.assign(Oc, { props: { id: { type: String, required: true }, name: { type: String, required: true }, icon: { type: Function, required: true }, color: String, qty: Number, tags: Array, loading: { type: Boolean, default: true } }, setup: (l2) => (r2, s2) => l2.loading ? (e(), a("div", yc, [i("div", xc, [i("div", wc, [o(G, { icon: l2.icon, size: "huge", class: "text-white", "aria-hidden": "true", loading: l2.loading }, null, 8, ["icon", "loading"])]), kc, i("dl", Sc, [i("dd", Cc, [(e(true), a(k, null, P(l2.tags, (n2, a2) => (e(), t(pa, { key: a2, loading: l2.loading, event: n2.event, color: n2.color, onTagEvent: s2[2] || (s2[2] = (e2) => r2.$emit("deviceStatusTagClicked", e2)) }, { default: T(() => [I(_(n2.name), 1)]), _: 2 }, 1032, ["loading", "event", "color"]))), 128))])])])])) : (e(), a("div", fc, [i("div", mc, [i("div", { class: n(["rounded-md p-3 flex items-center justify-center mx-auto mb-4", { "bg-green-500": !l2.color || "success" === l2.color, "bg-red-500": "danger" === l2.color, "bg-yellow-500": "warning" === l2.color }]) }, [o(G, { icon: l2.icon, size: "huge", class: "text-white", "aria-hidden": "true", loading: false }, null, 8, ["icon"])], 2), i("h3", vc, [I(_(l2.name) + " ", 1), B(i("span", { class: "text-indigo-600 hover:text-indigo-900 cursor-pointer", onClick: s2[0] || (s2[0] = (e2) => r2.$emit("deviceStatusQtyClicked", l2.id)) }, "(" + _(l2.qty) + ")", 513), [[L, l2.qty]])]), i("dl", hc, [i("dd", bc, [(e(true), a(k, null, P(l2.tags, (l3, n2) => (e(), t(pa, { key: n2, loading: false, event: l3.event, color: l3.color, onTagEvent: s2[1] || (s2[1] = (e2) => r2.$emit("deviceStatusTagClicked", e2)) }, { default: T(() => [I(_(l3.name), 1)]), _: 2 }, 1032, ["event", "color"]))), 128))])])])])) }), Dc = { uiButton: te, uiIcon: G, uiCheckbox: ue, uiDropdown: _n, uiInput: Vn, uiInputFile: na, uiSelect: sa, uiTag: pa, uiTextArea: ya, uiToggle: Oa, uiAlert: Aa, uiBreadcrumbs: Ua, uiCard: to, uiFilter: no, uiModal: vo, uiNotification: Eo, uiTaskList: $o, uiPriceCalendar: Yr, uiChart: li, uiFooter: ri, uiLoadingScreen: di, uiPagination: Oi, uiSidebar: $i, uiStats: ts, uiStripedCard: hs, uiTable: Vs, uiTabs: Gs, uiTimeline: Sd, uiTopbar: Kd, uiFunnelChartV2: au, uiNoResults: su, uiRightSidebar: Su, uiGallery: Bu, uiDragAndDrop: qu, uiCircleChart: ec, uiDateRange: ac, uiRangeSlider: uc, uiSectionTitle: gc, uiDeviceStatus: Mc }, Ec = { install(e2) {
|
|
2457
|
+
Object.keys(Dc).forEach((t2) => {
|
|
2458
|
+
e2.component(t2, Dc[t2]);
|
|
2455
2459
|
});
|
|
2456
2460
|
} };
|
|
2457
2461
|
export {
|
|
2458
|
-
|
|
2462
|
+
Ec as default
|
|
2459
2463
|
};
|