@plutonhq/core-frontend 0.0.1

package/dist/components/App/SideNav/SideNav.d.ts

@@ -0,0 +1,3 @@
+declare const SideNav: () => import("react/jsx-runtime").JSX.Element;
+export default SideNav;
+//# sourceMappingURL=SideNav.d.ts.map

package/dist/components/App/SideNav/SideNav.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideNav.d.ts","sourceRoot":"","sources":["../../../../src/components/App/SideNav/SideNav.tsx"],"names":[],"mappings":"AASA,QAAA,MAAM,OAAO,+CA8FZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/components/App/SideNav/SideNav.js

@@ -0,0 +1,91 @@
+import { jsxs as e, jsx as t } from "react/jsx-runtime";
+import { NavLink as i } from "react-router";
+import { useState as p } from "react";
+import { useLogout as r } from "../../../services/users.js";
+import a from "../../common/Icon/Icon.js";
+import c from "../../common/Logo/Logo.js";
+import o from "./SideNav.module.scss.js";
+import u from "../../common/Modal/Modal.js";
+import { isMobile as l } from "../../../utils/helpers.js";
+const N = () => {
+  const [s, n] = p(!1), d = r();
+  return /* @__PURE__ */ e("div", { className: o.navMenu, tabIndex: -1, children: [
+    /* @__PURE__ */ t("div", { className: o.logo, children: /* @__PURE__ */ t(c, { size: 30, color: "#fff" }) }),
+    /* @__PURE__ */ e("nav", { className: o.navMenu, children: [
+      /* @__PURE__ */ t(i, { to: "/", end: !0, "aria-label": "Backup Plans", children: () => /* @__PURE__ */ t(
+        "span",
+        {
+          className: o.navMenuLabel,
+          "data-tooltip-id": "appTooltip",
+          "data-tooltip-content": "Backup Plans",
+          "data-tooltip-place": "left",
+          "data-tooltip-delay-show": 500,
+          "data-tooltip-hidden": l(),
+          children: /* @__PURE__ */ t(a, { type: "plans", size: 30 })
+        }
+      ) }),
+      /* @__PURE__ */ t(i, { to: "/storages", end: !0, "aria-label": "Storages", children: () => /* @__PURE__ */ t(
+        "span",
+        {
+          className: o.navMenuLabel,
+          "data-tooltip-id": "appTooltip",
+          "data-tooltip-content": "Storages",
+          "data-tooltip-place": "left",
+          "data-tooltip-delay-show": 500,
+          "data-tooltip-hidden": l(),
+          children: /* @__PURE__ */ t(a, { type: "storages", size: 26 })
+        }
+      ) }),
+      /* @__PURE__ */ t(i, { to: "/sources", end: !0, "aria-label": "Sources", children: () => /* @__PURE__ */ t(
+        "span",
+        {
+          className: o.navMenuLabel,
+          "data-tooltip-id": "appTooltip",
+          "data-tooltip-content": "Sources",
+          "data-tooltip-place": "left",
+          "data-tooltip-delay-show": 500,
+          "data-tooltip-hidden": l(),
+          children: /* @__PURE__ */ t(a, { type: "sources", size: 26 })
+        }
+      ) }),
+      /* @__PURE__ */ t(i, { to: "/settings", end: !0, "aria-label": "Settings", children: () => /* @__PURE__ */ t(
+        "span",
+        {
+          className: o.navMenuLabel,
+          "data-tooltip-id": "appTooltip",
+          "data-tooltip-content": "Settings",
+          "data-tooltip-place": "left",
+          "data-tooltip-delay-show": 500,
+          "data-tooltip-hidden": l(),
+          children: /* @__PURE__ */ t(a, { type: "settings", size: 30 })
+        }
+      ) }),
+      /* @__PURE__ */ t("a", { onClick: () => n(!0), "aria-label": "Logout", children: /* @__PURE__ */ t(
+        "span",
+        {
+          className: o.navMenuLabel,
+          "data-tooltip-id": "appTooltip",
+          "data-tooltip-content": "Logout",
+          "data-tooltip-place": "left",
+          "data-tooltip-delay-show": 500,
+          "data-tooltip-hidden": l(),
+          children: /* @__PURE__ */ t(a, { type: "logout", size: 30 })
+        }
+      ) })
+    ] }),
+    s && /* @__PURE__ */ e(u, { title: "Logout", closeModal: () => n(!1), width: "300px", children: [
+      /* @__PURE__ */ t("p", { children: "Are you sure you want to Logout?" }),
+      /* @__PURE__ */ e("div", { className: "modalActions", children: [
+        /* @__PURE__ */ t("button", { className: "modalButton", onClick: () => n(!1), children: "Cancel" }),
+        /* @__PURE__ */ e("button", { className: "modalButton modalButton--ok", onClick: () => d.mutate(), children: [
+          /* @__PURE__ */ t(a, { type: d.isPending ? "loading" : "logout", size: 12 }),
+          " Logout"
+        ] })
+      ] })
+    ] })
+  ] });
+};
+export {
+  N as default
+};
+//# sourceMappingURL=SideNav.js.map

package/dist/components/App/SideNav/SideNav.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideNav.js","sources":["../../../../src/components/App/SideNav/SideNav.tsx"],"sourcesContent":["import { NavLink } from 'react-router';\r\nimport { useState } from 'react';\r\nimport { useLogout } from '../../../services/users';\r\nimport Icon from '../../common/Icon/Icon';\r\nimport Logo from '../../common/Logo/Logo';\r\nimport classes from './SideNav.module.scss';\r\nimport Modal from '../../common/Modal/Modal';\r\nimport { isMobile } from '../../../utils/helpers';\r\n\r\nconst SideNav = () => {\r\n   const [showLogoutModal, setShowLogoutModal] = useState(false);\r\n   const logoutMutation = useLogout();\r\n\r\n   return (\r\n      <div className={classes.navMenu} tabIndex={-1}>\r\n         <div className={classes.logo}>\r\n            <Logo size={30} color=\"#fff\" />\r\n         </div>\r\n         <nav className={classes.navMenu}>\r\n            <NavLink to=\"/\" end aria-label=\"Backup Plans\">\r\n               {() => (\r\n                  <span\r\n                     className={classes.navMenuLabel}\r\n                     data-tooltip-id=\"appTooltip\"\r\n                     data-tooltip-content=\"Backup Plans\"\r\n                     data-tooltip-place=\"left\"\r\n                     data-tooltip-delay-show={500}\r\n                     data-tooltip-hidden={isMobile()}\r\n                  >\r\n                     <Icon type=\"plans\" size={30} />\r\n                  </span>\r\n               )}\r\n            </NavLink>\r\n            <NavLink to=\"/storages\" end aria-label=\"Storages\">\r\n               {() => (\r\n                  <span\r\n                     className={classes.navMenuLabel}\r\n                     data-tooltip-id=\"appTooltip\"\r\n                     data-tooltip-content=\"Storages\"\r\n                     data-tooltip-place=\"left\"\r\n                     data-tooltip-delay-show={500}\r\n                     data-tooltip-hidden={isMobile()}\r\n                  >\r\n                     <Icon type=\"storages\" size={26} />\r\n                  </span>\r\n               )}\r\n            </NavLink>\r\n            <NavLink to=\"/sources\" end aria-label=\"Sources\">\r\n               {() => (\r\n                  <span\r\n                     className={classes.navMenuLabel}\r\n                     data-tooltip-id=\"appTooltip\"\r\n                     data-tooltip-content=\"Sources\"\r\n                     data-tooltip-place=\"left\"\r\n                     data-tooltip-delay-show={500}\r\n                     data-tooltip-hidden={isMobile()}\r\n                  >\r\n                     <Icon type=\"sources\" size={26} />\r\n                  </span>\r\n               )}\r\n            </NavLink>\r\n            <NavLink to=\"/settings\" end aria-label=\"Settings\">\r\n               {() => (\r\n                  <span\r\n                     className={classes.navMenuLabel}\r\n                     data-tooltip-id=\"appTooltip\"\r\n                     data-tooltip-content=\"Settings\"\r\n                     data-tooltip-place=\"left\"\r\n                     data-tooltip-delay-show={500}\r\n                     data-tooltip-hidden={isMobile()}\r\n                  >\r\n                     <Icon type=\"settings\" size={30} />\r\n                  </span>\r\n               )}\r\n            </NavLink>\r\n            <a onClick={() => setShowLogoutModal(true)} aria-label=\"Logout\">\r\n               <span\r\n                  className={classes.navMenuLabel}\r\n                  data-tooltip-id=\"appTooltip\"\r\n                  data-tooltip-content=\"Logout\"\r\n                  data-tooltip-place=\"left\"\r\n                  data-tooltip-delay-show={500}\r\n                  data-tooltip-hidden={isMobile()}\r\n               >\r\n                  <Icon type=\"logout\" size={30} />\r\n               </span>\r\n            </a>\r\n         </nav>\r\n         {showLogoutModal && (\r\n            <Modal title=\"Logout\" closeModal={() => setShowLogoutModal(false)} width=\"300px\">\r\n               <p>Are you sure you want to Logout?</p>\r\n               <div className=\"modalActions\">\r\n                  <button className=\"modalButton\" onClick={() => setShowLogoutModal(false)}>\r\n                     Cancel\r\n                  </button>\r\n                  <button className=\"modalButton modalButton--ok\" onClick={() => logoutMutation.mutate()}>\r\n                     <Icon type={logoutMutation.isPending ? 'loading' : 'logout'} size={12} /> Logout\r\n                  </button>\r\n               </div>\r\n            </Modal>\r\n         )}\r\n      </div>\r\n   );\r\n};\r\n\r\nexport default SideNav;\r\n"],"names":["SideNav","showLogoutModal","setShowLogoutModal","useState","logoutMutation","useLogout","classes","jsx","Logo","jsxs","NavLink","isMobile","Icon","Modal"],"mappings":"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"}

package/dist/components/App/SideNav/SideNav.module.scss

@@ -0,0 +1,58 @@
+.sideNav {
+   position: absolute;
+}
+
+.logo {
+   position: relative;
+   background-color: var(--primary-color);
+   padding: 10px;
+   border-radius: 50%;
+   box-sizing: border-box;
+   display: flex;
+}
+
+.navMenu {
+   display: flex;
+   flex-direction: column;
+   gap: 10px;
+   align-items: center;
+   margin-top: 10px;
+   & > a {
+      width: 50px;
+      height: 50px;
+      background: transparent;
+      border-radius: 50%;
+      color: var(--nav-color);
+      cursor: pointer;
+
+      &:global(.active) {
+         background-color: var(--content-background-color);
+         color: var(--primary-color);
+      }
+   }
+}
+
+.navMenuLabel {
+   padding: 10px;
+   display: block;
+   text-align: center;
+}
+
+@media only screen and (max-width: 768px) {
+   .logo {
+      display: none;
+   }
+   .navMenu {
+      position: fixed;
+      width: 100%;
+      left: 0;
+      bottom: 0;
+      z-index: 999;
+      flex-direction: row-reverse;
+      background: var(--content-background-color);
+      box-shadow: 0 0 15px var(--content-shadow-color);
+      margin-top: 0;
+      gap: 0;
+      justify-content: space-around;
+   }
+}

package/dist/components/App/SideNav/SideNav.module.scss.js

@@ -0,0 +1,12 @@
+const e = "SideNav-module__logo___xEdBv", n = "SideNav-module__navMenu___xM1X6", a = "SideNav-module__navMenuLabel___lcM-4", _ = {
+  logo: e,
+  navMenu: n,
+  navMenuLabel: a
+};
+export {
+  _ as default,
+  e as logo,
+  n as navMenu,
+  a as navMenuLabel
+};
+//# sourceMappingURL=SideNav.module.scss.js.map

package/dist/components/App/SideNav/SideNav.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideNav.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/components/Device/DeviceBackups/DeviceBackups.d.ts

@@ -0,0 +1,7 @@
+import { DevicePlan } from '../../../@types/devices';
+interface DeviceBackupsProps {
+    plans: DevicePlan[];
+}
+declare const DeviceBackups: ({ plans }: DeviceBackupsProps) => import("react/jsx-runtime").JSX.Element;
+export default DeviceBackups;
+//# sourceMappingURL=DeviceBackups.d.ts.map

package/dist/components/Device/DeviceBackups/DeviceBackups.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceBackups.d.ts","sourceRoot":"","sources":["../../../../src/components/Device/DeviceBackups/DeviceBackups.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAKrD,UAAU,kBAAkB;IACzB,KAAK,EAAE,UAAU,EAAE,CAAC;CACtB;AAED,QAAA,MAAM,aAAa,GAAI,WAAW,kBAAkB,4CAyHnD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/Device/DeviceBackups/DeviceBackups.js

@@ -0,0 +1,94 @@
+import { jsxs as i, jsx as s, Fragment as v } from "react/jsx-runtime";
+import { useMemo as N } from "react";
+import { NavLink as h } from "react-router";
+import n from "../../common/Icon/Icon.js";
+import e from "./DeviceBackups.module.scss.js";
+import { formatBytes as p } from "../../../utils/helpers.js";
+const w = ({ plans: l }) => {
+  const m = N(() => {
+    const t = [], c = {};
+    return l.forEach((a) => {
+      const d = a.storage.id;
+      c[d] || (c[d] = 0), c[d] += a.size;
+    }), l.forEach((a) => {
+      t.some((d) => d.id === a.storage.id) || t.push({ ...a.storage, size: c[a.storage.id] });
+    }), t;
+  }, [l]);
+  return console.log("plansStorages :", m), /* @__PURE__ */ i("div", { className: e.devicePlans, children: [
+    /* @__PURE__ */ i("div", { className: `${e.widget} ${e.plans}`, children: [
+      /* @__PURE__ */ i("div", { className: e.widgetTitle, children: [
+        /* @__PURE__ */ s(n, { type: "plans", size: 12 }),
+        " Backup Plans"
+      ] }),
+      /* @__PURE__ */ i("div", { className: e.widgetContent, children: [
+        l.length === 0 && /* @__PURE__ */ s("div", { className: e.noData, children: "No backup plans found for this device." }),
+        l.length > 0 && l.map(({ id: t, title: c, sourceConfig: a, storage: d, isActive: r, method: o, size: g }) => /* @__PURE__ */ i("div", { className: e.planItem, children: [
+          /* @__PURE__ */ s("div", { className: `${e.status} ${r ? "" : e.paused}`, children: /* @__PURE__ */ s("div", { className: e.iconBlock, children: /* @__PURE__ */ s(n, { type: o === "backup" ? "plans" : "sync", size: 20 }) }) }),
+          /* @__PURE__ */ i("div", { className: e.planContent, children: [
+            /* @__PURE__ */ s("h4", { children: /* @__PURE__ */ s(h, { to: `/plan/${t}`, children: c }) }),
+            /* @__PURE__ */ i("div", { className: e.planStats, children: [
+              /* @__PURE__ */ i("div", { children: [
+                /* @__PURE__ */ s(n, { type: "folders", size: 12 }),
+                " ",
+                a.includes.length,
+                " ",
+                a.includes.length > 1 ? "paths" : "path"
+              ] }),
+              /* @__PURE__ */ i("div", { children: [
+                /* @__PURE__ */ s(n, { type: "storages", size: 12 }),
+                " ",
+                d.name
+              ] }),
+              /* @__PURE__ */ i("div", { children: [
+                /* @__PURE__ */ s(n, { type: "disk", size: 12 }),
+                " ",
+                p(g)
+              ] })
+            ] })
+          ] })
+        ] }, t))
+      ] })
+    ] }),
+    /* @__PURE__ */ i("div", { className: `${e.widget} ${e.paths}`, children: [
+      /* @__PURE__ */ i("div", { className: e.widgetTitle, children: [
+        /* @__PURE__ */ s(n, { type: "folders", size: 12 }),
+        " Protected Paths"
+      ] }),
+      /* @__PURE__ */ i("div", { className: e.widgetContent, children: [
+        l.length === 0 && /* @__PURE__ */ s("div", { className: e.noData, children: "No protected paths found for this device." }),
+        l.length > 0 && l.map(({ id: t, title: c, sourceConfig: a, method: d }) => /* @__PURE__ */ i("div", { className: e.pathItem, children: [
+          /* @__PURE__ */ s("div", { className: e.pathPlanTitle, children: /* @__PURE__ */ s(h, { to: `/plan/${t}`, children: /* @__PURE__ */ i(v, { children: [
+            /* @__PURE__ */ s(n, { type: d === "backup" ? "plans" : "sync", size: 14 }),
+            " ",
+            c
+          ] }) }) }),
+          /* @__PURE__ */ s("div", { className: e.planPaths, children: a.includes.map((r, o) => /* @__PURE__ */ i("div", { className: e.path, children: [
+            /* @__PURE__ */ s(n, { type: "folder", size: 14 }),
+            " ",
+            r
+          ] }, o)) })
+        ] }, t))
+      ] })
+    ] }),
+    /* @__PURE__ */ i("div", { className: `${e.widget} ${e.storages}`, children: [
+      /* @__PURE__ */ i("div", { className: e.widgetTitle, children: [
+        /* @__PURE__ */ s(n, { type: "storages", size: 12 }),
+        " Connected Storages"
+      ] }),
+      /* @__PURE__ */ i("div", { className: e.widgetContent, children: [
+        l.length === 0 && /* @__PURE__ */ s("div", { className: e.noData, children: "No Remote storages are being used by this device." }),
+        l.length > 0 && m.map(({ id: t, name: c, size: a, type: d, typeName: r }) => /* @__PURE__ */ i("div", { className: e.planItem, children: [
+          /* @__PURE__ */ s("div", { className: `${e.status}`, children: /* @__PURE__ */ s("div", { className: e.iconBlock, title: r, children: d === "local" ? /* @__PURE__ */ s(n, { type: "storages", size: 12 }) : /* @__PURE__ */ s("img", { src: `/providers/${d}.png` }) }) }),
+          /* @__PURE__ */ i("div", { className: e.planContent, children: [
+            /* @__PURE__ */ s("h4", { children: /* @__PURE__ */ s(h, { to: `/storage/${t}`, children: c }) }),
+            /* @__PURE__ */ s("div", { className: e.planStats, children: p(a) })
+          ] })
+        ] }, t))
+      ] })
+    ] })
+  ] });
+};
+export {
+  w as default
+};
+//# sourceMappingURL=DeviceBackups.js.map

package/dist/components/Device/DeviceBackups/DeviceBackups.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceBackups.js","sources":["../../../../src/components/Device/DeviceBackups/DeviceBackups.tsx"],"sourcesContent":["import { useMemo } from 'react';\r\nimport { NavLink } from 'react-router';\r\nimport { DevicePlan } from '../../../@types/devices';\r\nimport Icon from '../../common/Icon/Icon';\r\nimport classes from './DeviceBackups.module.scss';\r\nimport { formatBytes } from '../../../utils/helpers';\r\n\r\ninterface DeviceBackupsProps {\r\n   plans: DevicePlan[];\r\n}\r\n\r\nconst DeviceBackups = ({ plans }: DeviceBackupsProps) => {\r\n   const plansStorages = useMemo(() => {\r\n      const storages: (DevicePlan['storage'] & { size: number })[] = [];\r\n\r\n      //first calculate each storage's size from the plan size.\r\n      const storageSizes: { [key: string]: number } = {};\r\n      plans.forEach((plan) => {\r\n         const planStorageId = plan.storage.id;\r\n         if (!storageSizes[planStorageId]) {\r\n            storageSizes[planStorageId] = 0;\r\n         }\r\n         storageSizes[planStorageId] += plan.size;\r\n      });\r\n\r\n      plans.forEach((plan) => {\r\n         if (!storages.some((storage) => storage.id === plan.storage.id)) {\r\n            // if (plan.storage.id !== 'local') {\r\n            // TODO: implement this check\r\n            storages.push({ ...plan.storage, size: storageSizes[plan.storage.id] });\r\n            // }\r\n         }\r\n      });\r\n      return storages;\r\n   }, [plans]);\r\n\r\n   console.log('plansStorages :', plansStorages);\r\n\r\n   return (\r\n      <div className={classes.devicePlans}>\r\n         {/* Backup Plans */}\r\n         <div className={`${classes.widget} ${classes.plans}`}>\r\n            <div className={classes.widgetTitle}>\r\n               <Icon type=\"plans\" size={12} /> Backup Plans\r\n            </div>\r\n            <div className={classes.widgetContent}>\r\n               {plans.length === 0 && <div className={classes.noData}>No backup plans found for this device.</div>}\r\n               {plans.length > 0 &&\r\n                  plans.map(({ id, title, sourceConfig, storage, isActive, method, size }) => (\r\n                     <div key={id} className={classes.planItem}>\r\n                        <div className={`${classes.status} ${!isActive ? classes.paused : ''}`}>\r\n                           <div className={classes.iconBlock}>\r\n                              <Icon type={method === 'backup' ? 'plans' : 'sync'} size={20} />\r\n                           </div>\r\n                        </div>\r\n                        <div className={classes.planContent}>\r\n                           <h4>\r\n                              <NavLink to={`/plan/${id}`}>{title}</NavLink>\r\n                           </h4>\r\n                           <div className={classes.planStats}>\r\n                              <div>\r\n                                 <Icon type=\"folders\" size={12} /> {sourceConfig.includes.length}{' '}\r\n                                 {sourceConfig.includes.length > 1 ? 'paths' : 'path'}\r\n                              </div>\r\n                              <div>\r\n                                 <Icon type=\"storages\" size={12} /> {storage.name}\r\n                              </div>\r\n                              <div>\r\n                                 <Icon type=\"disk\" size={12} /> {formatBytes(size)}\r\n                              </div>\r\n                           </div>\r\n                        </div>\r\n                     </div>\r\n                  ))}\r\n            </div>\r\n         </div>\r\n         {/* Protected Paths */}\r\n         <div className={`${classes.widget} ${classes.paths}`}>\r\n            <div className={classes.widgetTitle}>\r\n               <Icon type=\"folders\" size={12} /> Protected Paths\r\n            </div>\r\n            <div className={classes.widgetContent}>\r\n               {plans.length === 0 && <div className={classes.noData}>No protected paths found for this device.</div>}\r\n\r\n               {plans.length > 0 &&\r\n                  plans.map(({ id, title, sourceConfig, method }) => (\r\n                     <div key={id} className={classes.pathItem}>\r\n                        <div className={classes.pathPlanTitle}>\r\n                           <NavLink to={`/plan/${id}`}>\r\n                              <>\r\n                                 <Icon type={method === 'backup' ? 'plans' : 'sync'} size={14} /> {title}\r\n                              </>\r\n                           </NavLink>\r\n                        </div>\r\n                        <div className={classes.planPaths}>\r\n                           {sourceConfig.includes.map((path, index) => (\r\n                              <div key={index} className={classes.path}>\r\n                                 <Icon type=\"folder\" size={14} /> {path}\r\n                              </div>\r\n                           ))}\r\n                        </div>\r\n                     </div>\r\n                  ))}\r\n            </div>\r\n         </div>\r\n         {/* Connected Storages */}\r\n         <div className={`${classes.widget} ${classes.storages}`}>\r\n            <div className={classes.widgetTitle}>\r\n               <Icon type=\"storages\" size={12} /> Connected Storages\r\n            </div>\r\n            <div className={classes.widgetContent}>\r\n               {plans.length === 0 && <div className={classes.noData}>No Remote storages are being used by this device.</div>}\r\n               {plans.length > 0 &&\r\n                  plansStorages.map(({ id, name, size, type, typeName }) => (\r\n                     <div key={id} className={classes.planItem}>\r\n                        <div className={`${classes.status}`}>\r\n                           <div className={classes.iconBlock} title={typeName}>\r\n                              {type === 'local' ? <Icon type=\"storages\" size={12} /> : <img src={`/providers/${type}.png`} />}\r\n                           </div>\r\n                        </div>\r\n                        <div className={classes.planContent}>\r\n                           <h4>\r\n                              <NavLink to={`/storage/${id}`}>{name}</NavLink>\r\n                           </h4>\r\n                           <div className={classes.planStats}>{formatBytes(size)}</div>\r\n                        </div>\r\n                     </div>\r\n                  ))}\r\n            </div>\r\n         </div>\r\n      </div>\r\n   );\r\n};\r\n\r\nexport default DeviceBackups;\r\n"],"names":["DeviceBackups","plans","plansStorages","useMemo","storages","storageSizes","plan","planStorageId","storage","jsxs","classes","jsx","Icon","id","title","sourceConfig","isActive","method","size","NavLink","formatBytes","Fragment","path","index","name","type","typeName"],"mappings":"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"}

package/dist/components/Device/DeviceBackups/DeviceBackups.module.scss

@@ -0,0 +1,142 @@
+.devicePlans {
+   display: flex;
+   gap: 20px;
+   margin-bottom: 30px;
+
+   .widget {
+      border: 1px solid var(--line-color);
+      padding: 20px;
+      border-radius: 6px;
+      box-sizing: border-box;
+      width: calc(33.33% - 15px);
+      .widgetTitle {
+         padding: 2px 6px;
+         background-color: var(--content-background-color);
+         border: 1px solid var(--line-color);
+         color: var(--content-title-color);
+         border-radius: 4px;
+         font-size: 0.6875rem;
+         font-weight: 600;
+         width: max-content;
+         position: relative;
+         margin-top: -30px;
+         span {
+            color: var(--icon-color);
+         }
+      }
+      .widgetContent {
+         width: 100%;
+         display: flex;
+         flex-direction: column;
+         gap: 20px;
+         padding-top: 20px;
+         padding-bottom: 10px;
+
+         .noData {
+            width: 100%;
+            text-align: center;
+            font-size: 0.9em;
+            padding-top: 20px;
+         }
+      }
+   }
+
+   .plans,
+   .storages {
+      width: 40%;
+      .planItem {
+         display: flex;
+         .status {
+            display: flex;
+            align-items: center;
+            margin-right: 10px;
+            position: relative;
+            color: var(--success-label);
+            &.paused {
+               color: var(--icon-color);
+            }
+            .iconBlock {
+               width: 40px;
+               height: 40px;
+               flex: 0 0 40px;
+               display: flex;
+               align-items: center;
+               justify-content: center;
+               border-radius: 50%;
+               background-color: var(--background-color);
+            }
+         }
+         .planContent {
+            display: flex;
+            flex-direction: column;
+            font-size: 0.9em;
+            h4 {
+               margin: 0;
+               margin-bottom: 4px;
+               color: var(--content-title-color);
+               a {
+                  color: inherit;
+                  &:hover {
+                     color: var(--primary-color);
+                  }
+               }
+            }
+            .planStats {
+               display: flex;
+               flex-direction: row;
+               gap: 10px;
+            }
+         }
+      }
+   }
+
+   .paths {
+      .pathItem {
+         display: flex;
+         flex-direction: column;
+         font-size: 0.9em;
+         .pathPlanTitle {
+            color: var(--content-title-color);
+            margin-bottom: 4px;
+            :global(.icon) {
+               color: var(--icon-color);
+            }
+            a {
+               color: inherit;
+               &:hover {
+                  color: var(--primary-color);
+               }
+            }
+         }
+         .planPaths {
+            display: flex;
+            flex-direction: column;
+            gap: 3px;
+            padding-left: 20px;
+         }
+      }
+   }
+
+   .storages {
+      width: 25%;
+      .planItem {
+         .iconBlock {
+            img {
+               max-width: 16px;
+               height: auto;
+            }
+         }
+      }
+   }
+}
+
+@media only screen and (max-width: 768px) {
+   .devicePlans {
+      flex-direction: column;
+      .plans,
+      .storages,
+      .widget {
+         width: 100%;
+      }
+   }
+}

package/dist/components/Device/DeviceBackups/DeviceBackups.module.scss.js

@@ -0,0 +1,40 @@
+const e = "DeviceBackups-module__devicePlans___oPHBo", _ = "DeviceBackups-module__widget___pP7ZW", t = "DeviceBackups-module__widgetTitle___5Xj8p", a = "DeviceBackups-module__widgetContent___-ROg2", s = "DeviceBackups-module__noData___CyjQd", c = "DeviceBackups-module__plans___g2T66", o = "DeviceBackups-module__storages___oZov3", n = "DeviceBackups-module__planItem___KSAvN", l = "DeviceBackups-module__status___5AT-C", p = "DeviceBackups-module__paused___WISSg", u = "DeviceBackups-module__iconBlock___2ylnG", i = "DeviceBackups-module__planContent___6sPYI", d = "DeviceBackups-module__planStats___IOmIU", m = "DeviceBackups-module__paths___0-H0o", v = "DeviceBackups-module__pathItem___k7KFs", k = "DeviceBackups-module__pathPlanTitle___fzETc", B = "DeviceBackups-module__planPaths___6NZ3a", D = {
+  devicePlans: e,
+  widget: _,
+  widgetTitle: t,
+  widgetContent: a,
+  noData: s,
+  plans: c,
+  storages: o,
+  planItem: n,
+  status: l,
+  paused: p,
+  iconBlock: u,
+  planContent: i,
+  planStats: d,
+  paths: m,
+  pathItem: v,
+  pathPlanTitle: k,
+  planPaths: B
+};
+export {
+  D as default,
+  e as devicePlans,
+  u as iconBlock,
+  s as noData,
+  v as pathItem,
+  k as pathPlanTitle,
+  m as paths,
+  p as paused,
+  i as planContent,
+  n as planItem,
+  B as planPaths,
+  d as planStats,
+  c as plans,
+  l as status,
+  o as storages,
+  _ as widget,
+  a as widgetContent,
+  t as widgetTitle
+};
+//# sourceMappingURL=DeviceBackups.module.scss.js.map

package/dist/components/Device/DeviceBackups/DeviceBackups.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceBackups.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}

package/dist/components/Device/DeviceCPU/DeviceCPU.d.ts

@@ -0,0 +1,7 @@
+import { DeviceMetrics } from '../../../@types/devices';
+interface DeviceCPUProps {
+    cpu: DeviceMetrics['cpu'];
+}
+declare const DeviceCPU: ({ cpu }: DeviceCPUProps) => import("react/jsx-runtime").JSX.Element;
+export default DeviceCPU;
+//# sourceMappingURL=DeviceCPU.d.ts.map

package/dist/components/Device/DeviceCPU/DeviceCPU.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceCPU.d.ts","sourceRoot":"","sources":["../../../../src/components/Device/DeviceCPU/DeviceCPU.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAIxD,UAAU,cAAc;IACrB,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;CAC5B;AAED,QAAA,MAAM,SAAS,GAAI,SAAS,cAAc,4CAgDzC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/components/Device/DeviceCPU/DeviceCPU.js

@@ -0,0 +1,51 @@
+import { jsxs as i, jsx as s } from "react/jsx-runtime";
+import e from "../DeviceInfo/DeviceInfo.module.scss.js";
+import c from "../../common/Icon/Icon.js";
+import { getProcessorIcon as d } from "../../../utils/helpers.js";
+const v = ({ cpu: r }) => {
+  var l, n;
+  const o = d(r.manufacturer), a = (l = r.load) != null && l.currentLoad ? Math.round((n = r.load) == null ? void 0 : n.currentLoad) : 0;
+  return /* @__PURE__ */ i("div", { className: `${e.widget} ${e.cpu}`, children: [
+    /* @__PURE__ */ i("div", { className: e.widgetTitle, children: [
+      /* @__PURE__ */ s(c, { type: "speed", size: 12 }),
+      " CPU"
+    ] }),
+    /* @__PURE__ */ i("div", { className: e.widgetContent, children: [
+      /* @__PURE__ */ i("div", { className: e.infoBlock, children: [
+        /* @__PURE__ */ s("div", { className: e.iconBlock, children: /* @__PURE__ */ s(c, { type: o, size: 24 }) }),
+        /* @__PURE__ */ i("div", { className: e.infoBlockRight, children: [
+          /* @__PURE__ */ s("span", { children: "Processor" }),
+          /* @__PURE__ */ s("span", { title: `${r.manufacturer} ${r.brand}`, children: `${r.manufacturer} ${r.brand}` })
+        ] })
+      ] }),
+      /* @__PURE__ */ i("div", { className: e.infoBlock, children: [
+        /* @__PURE__ */ s("div", { className: e.iconBlock, children: /* @__PURE__ */ s(c, { type: "cpu", size: 20 }) }),
+        /* @__PURE__ */ i("div", { className: e.infoBlockRight, children: [
+          /* @__PURE__ */ s("span", { children: "Physical Cores / Cores" }),
+          /* @__PURE__ */ s("span", { children: `${r.physicalCores} / ${r.cores}` })
+        ] })
+      ] }),
+      /* @__PURE__ */ i("div", { className: e.infoBlock, children: [
+        /* @__PURE__ */ s("div", { className: e.iconBlock, children: /* @__PURE__ */ s(c, { type: "speed", size: 20 }) }),
+        /* @__PURE__ */ i("div", { className: e.infoBlockRight, children: [
+          /* @__PURE__ */ s("span", { children: "CPU Usage" }),
+          /* @__PURE__ */ s("div", { className: e.progressBar, children: /* @__PURE__ */ s(
+            "div",
+            {
+              className: `${e.progressBarFill} ${a > 10 ? e.progressBarFilled : ""}`,
+              style: { width: a + "%" },
+              children: /* @__PURE__ */ i("span", { children: [
+                a,
+                "%"
+              ] })
+            }
+          ) })
+        ] })
+      ] })
+    ] })
+  ] });
+};
+export {
+  v as default
+};
+//# sourceMappingURL=DeviceCPU.js.map

package/dist/components/Device/DeviceCPU/DeviceCPU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceCPU.js","sources":["../../../../src/components/Device/DeviceCPU/DeviceCPU.tsx"],"sourcesContent":["import classes from '../DeviceInfo/DeviceInfo.module.scss';\r\nimport { DeviceMetrics } from '../../../@types/devices';\r\nimport Icon from '../../common/Icon/Icon';\r\nimport { getProcessorIcon } from '../../../utils/helpers';\r\n\r\ninterface DeviceCPUProps {\r\n   cpu: DeviceMetrics['cpu'];\r\n}\r\n\r\nconst DeviceCPU = ({ cpu }: DeviceCPUProps) => {\r\n   const processorIcon = getProcessorIcon(cpu.manufacturer);\r\n\r\n   const cpuPercent = cpu.load?.currentLoad ? Math.round(cpu.load?.currentLoad) : 0;\r\n\r\n   return (\r\n      <div className={`${classes.widget} ${classes.cpu}`}>\r\n         <div className={classes.widgetTitle}>\r\n            <Icon type=\"speed\" size={12} /> CPU\r\n         </div>\r\n         <div className={classes.widgetContent}>\r\n            <div className={classes.infoBlock}>\r\n               <div className={classes.iconBlock}>\r\n                  <Icon type={processorIcon} size={24} />\r\n               </div>\r\n               <div className={classes.infoBlockRight}>\r\n                  <span>Processor</span>\r\n                  <span title={`${cpu.manufacturer} ${cpu.brand}`}>{`${cpu.manufacturer} ${cpu.brand}`}</span>\r\n               </div>\r\n            </div>\r\n            <div className={classes.infoBlock}>\r\n               <div className={classes.iconBlock}>\r\n                  <Icon type={'cpu'} size={20} />\r\n               </div>\r\n               <div className={classes.infoBlockRight}>\r\n                  <span>Physical Cores / Cores</span>\r\n                  <span>{`${cpu.physicalCores} / ${cpu.cores}`}</span>\r\n               </div>\r\n            </div>\r\n            <div className={classes.infoBlock}>\r\n               <div className={classes.iconBlock}>\r\n                  <Icon type={'speed'} size={20} />\r\n               </div>\r\n               <div className={classes.infoBlockRight}>\r\n                  <span>CPU Usage</span>\r\n                  <div className={classes.progressBar}>\r\n                     <div\r\n                        className={`${classes.progressBarFill} ${cpuPercent > 10 ? classes.progressBarFilled : ''}`}\r\n                        style={{ width: cpuPercent + '%' }}\r\n                     >\r\n                        <span>{cpuPercent}%</span>\r\n                     </div>\r\n                  </div>\r\n               </div>\r\n            </div>\r\n         </div>\r\n      </div>\r\n   );\r\n};\r\n\r\nexport default DeviceCPU;\r\n"],"names":["DeviceCPU","cpu","processorIcon","getProcessorIcon","cpuPercent","_a","_b","jsxs","classes","jsx","Icon"],"mappings":";;;;AASA,MAAMA,IAAY,CAAC,EAAE,KAAAC,QAA0B;;AAC5C,QAAMC,IAAgBC,EAAiBF,EAAI,YAAY,GAEjDG,KAAaC,IAAAJ,EAAI,SAAJ,QAAAI,EAAU,cAAc,KAAK,OAAMC,IAAAL,EAAI,SAAJ,gBAAAK,EAAU,WAAW,IAAI;AAE/E,SACG,gBAAAC,EAAC,SAAI,WAAW,GAAGC,EAAQ,MAAM,IAAIA,EAAQ,GAAG,IAC7C,UAAA;AAAA,IAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAQ,aACrB,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAK,MAAK,SAAQ,MAAM,IAAI;AAAA,MAAE;AAAA,IAAA,GAClC;AAAA,IACA,gBAAAH,EAAC,OAAA,EAAI,WAAWC,EAAQ,eACrB,UAAA;AAAA,MAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAQ,WACrB,UAAA;AAAA,QAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWD,EAAQ,WACrB,UAAA,gBAAAC,EAACC,KAAK,MAAMR,GAAe,MAAM,GAAA,CAAI,EAAA,CACxC;AAAA,QACA,gBAAAK,EAAC,OAAA,EAAI,WAAWC,EAAQ,gBACrB,UAAA;AAAA,UAAA,gBAAAC,EAAC,UAAK,UAAA,YAAA,CAAS;AAAA,4BACd,QAAA,EAAK,OAAO,GAAGR,EAAI,YAAY,IAAIA,EAAI,KAAK,IAAK,aAAGA,EAAI,YAAY,IAAIA,EAAI,KAAK,GAAA,CAAG;AAAA,QAAA,EAAA,CACxF;AAAA,MAAA,GACH;AAAA,MACA,gBAAAM,EAAC,OAAA,EAAI,WAAWC,EAAQ,WACrB,UAAA;AAAA,QAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWD,EAAQ,WACrB,UAAA,gBAAAC,EAACC,KAAK,MAAM,OAAO,MAAM,GAAA,CAAI,EAAA,CAChC;AAAA,QACA,gBAAAH,EAAC,OAAA,EAAI,WAAWC,EAAQ,gBACrB,UAAA;AAAA,UAAA,gBAAAC,EAAC,UAAK,UAAA,yBAAA,CAAsB;AAAA,UAC5B,gBAAAA,EAAC,UAAM,UAAA,GAAGR,EAAI,aAAa,MAAMA,EAAI,KAAK,GAAA,CAAG;AAAA,QAAA,EAAA,CAChD;AAAA,MAAA,GACH;AAAA,MACA,gBAAAM,EAAC,OAAA,EAAI,WAAWC,EAAQ,WACrB,UAAA;AAAA,QAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWD,EAAQ,WACrB,UAAA,gBAAAC,EAACC,KAAK,MAAM,SAAS,MAAM,GAAA,CAAI,EAAA,CAClC;AAAA,QACA,gBAAAH,EAAC,OAAA,EAAI,WAAWC,EAAQ,gBACrB,UAAA;AAAA,UAAA,gBAAAC,EAAC,UAAK,UAAA,YAAA,CAAS;AAAA,UACf,gBAAAA,EAAC,OAAA,EAAI,WAAWD,EAAQ,aACrB,UAAA,gBAAAC;AAAA,YAAC;AAAA,YAAA;AAAA,cACE,WAAW,GAAGD,EAAQ,eAAe,IAAIJ,IAAa,KAAKI,EAAQ,oBAAoB,EAAE;AAAA,cACzF,OAAO,EAAE,OAAOJ,IAAa,IAAA;AAAA,cAE7B,4BAAC,QAAA,EAAM,UAAA;AAAA,gBAAAA;AAAA,gBAAW;AAAA,cAAA,EAAA,CAAC;AAAA,YAAA;AAAA,UAAA,EACtB,CACH;AAAA,QAAA,EAAA,CACH;AAAA,MAAA,EAAA,CACH;AAAA,IAAA,EAAA,CACH;AAAA,EAAA,GACH;AAEN;"}

package/dist/components/Device/DeviceInfo/DeviceInfo.d.ts

@@ -0,0 +1,8 @@
+import { DeviceMetrics } from '../../../@types/devices';
+interface DeviceInfoProps {
+    metrics: DeviceMetrics;
+    isRefetching: boolean;
+}
+declare const DeviceInfo: ({ metrics, isRefetching }: DeviceInfoProps) => import("react/jsx-runtime").JSX.Element;
+export default DeviceInfo;
+//# sourceMappingURL=DeviceInfo.d.ts.map

package/dist/components/Device/DeviceInfo/DeviceInfo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceInfo.d.ts","sourceRoot":"","sources":["../../../../src/components/Device/DeviceInfo/DeviceInfo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AASxD,UAAU,eAAe;IACtB,OAAO,EAAE,aAAa,CAAC;IACvB,YAAY,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,UAAU,GAAI,2BAA2B,eAAe,4CA2B7D,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/Device/DeviceInfo/DeviceInfo.js

@@ -0,0 +1,27 @@
+import { jsxs as m, jsx as o } from "react/jsx-runtime";
+import r from "./DeviceInfo.module.scss.js";
+import f from "../DeviceNetworks/DeviceNetworks.js";
+import D from "../DeviceStorageDrives/DeviceStorageDrives.js";
+import g from "../DeviceStorageDisks/DeviceStorageDisks.js";
+import h from "../DeviceMemory/DeviceMemory.js";
+import d from "../DeviceCPU/DeviceCPU.js";
+import y from "../DeviceSystem/DeviceSystem.js";
+const $ = ({ metrics: c, isRefetching: n }) => {
+  const { os: a, time: l, cpu: p, memory: v, disks: e, network: t } = c, s = (e == null ? void 0 : e.physical) || [], i = (e == null ? void 0 : e.filesystems) || [];
+  return /* @__PURE__ */ m("div", { className: `${r.deviceInfo} ${n ? r.reloading : ""}`, children: [
+    /* @__PURE__ */ m("div", { className: r.topComponents, children: [
+      /* @__PURE__ */ o(y, { os: a, time: l }),
+      /* @__PURE__ */ o(d, { cpu: p }),
+      /* @__PURE__ */ o(h, { memory: v })
+    ] }),
+    /* @__PURE__ */ m("div", { className: r.otherComponents, children: [
+      s && s.length > 0 && /* @__PURE__ */ o(g, { storageDisks: s }),
+      i && i.length > 0 && /* @__PURE__ */ o(D, { storageDrives: i }),
+      t && t.length > 0 && /* @__PURE__ */ o(f, { network: t })
+    ] })
+  ] });
+};
+export {
+  $ as default
+};
+//# sourceMappingURL=DeviceInfo.js.map

package/dist/components/Device/DeviceInfo/DeviceInfo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceInfo.js","sources":["../../../../src/components/Device/DeviceInfo/DeviceInfo.tsx"],"sourcesContent":["import { DeviceMetrics } from '../../../@types/devices';\r\nimport classes from './DeviceInfo.module.scss';\r\nimport DeviceNetworks from '../DeviceNetworks/DeviceNetworks';\r\nimport DeviceStorageDrives from '../DeviceStorageDrives/DeviceStorageDrives';\r\nimport DeviceStorageDisks from '../DeviceStorageDisks/DeviceStorageDisks';\r\nimport DeviceMemory from '../DeviceMemory/DeviceMemory';\r\nimport DeviceCPU from '../DeviceCPU/DeviceCPU';\r\nimport DeviceSystem from '../DeviceSystem/DeviceSystem';\r\n\r\ninterface DeviceInfoProps {\r\n   metrics: DeviceMetrics;\r\n   isRefetching: boolean;\r\n}\r\n\r\nconst DeviceInfo = ({ metrics, isRefetching }: DeviceInfoProps) => {\r\n   // const { name } = data.device;\r\n   const { os, time, cpu, memory, disks, network } = metrics;\r\n\r\n   const storageDisks = disks?.physical || [];\r\n   const storageDrives = disks?.filesystems || [];\r\n\r\n   return (\r\n      <div className={`${classes.deviceInfo} ${isRefetching ? classes.reloading : ''}`}>\r\n         <div className={classes.topComponents}>\r\n            {/* SYSTEM */}\r\n            <DeviceSystem os={os} time={time} />\r\n            {/* CPU */}\r\n            <DeviceCPU cpu={cpu} />\r\n            {/* MEMORY */}\r\n            <DeviceMemory memory={memory} />\r\n         </div>\r\n         <div className={classes.otherComponents}>\r\n            {/* Storage Disks */}\r\n            {storageDisks && storageDisks.length > 0 && <DeviceStorageDisks storageDisks={storageDisks} />}\r\n            {/* Storage Drives */}\r\n            {storageDrives && storageDrives.length > 0 && <DeviceStorageDrives storageDrives={storageDrives} />}\r\n            {/* Networks */}\r\n            {network && network.length > 0 && <DeviceNetworks network={network} />}\r\n         </div>\r\n      </div>\r\n   );\r\n};\r\n\r\nexport default DeviceInfo;\r\n"],"names":["DeviceInfo","metrics","isRefetching","os","time","cpu","memory","disks","network","storageDisks","storageDrives","jsxs","classes","jsx","DeviceSystem","DeviceCPU","DeviceMemory","DeviceStorageDisks","DeviceStorageDrives","DeviceNetworks"],"mappings":";;;;;;;;AAcA,MAAMA,IAAa,CAAC,EAAE,SAAAC,GAAS,cAAAC,QAAoC;AAEhE,QAAM,EAAE,IAAAC,GAAI,MAAAC,GAAM,KAAAC,GAAK,QAAAC,GAAQ,OAAAC,GAAO,SAAAC,MAAYP,GAE5CQ,KAAeF,KAAA,gBAAAA,EAAO,aAAY,CAAA,GAClCG,KAAgBH,KAAA,gBAAAA,EAAO,gBAAe,CAAA;AAE5C,SACG,gBAAAI,EAAC,OAAA,EAAI,WAAW,GAAGC,EAAQ,UAAU,IAAIV,IAAeU,EAAQ,YAAY,EAAE,IAC3E,UAAA;AAAA,IAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAQ,eAErB,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAa,IAAAX,GAAQ,MAAAC,EAAA,CAAY;AAAA,MAElC,gBAAAS,EAACE,KAAU,KAAAV,GAAU;AAAA,MAErB,gBAAAQ,EAACG,KAAa,QAAAV,EAAA,CAAgB;AAAA,IAAA,GACjC;AAAA,IACA,gBAAAK,EAAC,OAAA,EAAI,WAAWC,EAAQ,iBAEpB,UAAA;AAAA,MAAAH,KAAgBA,EAAa,SAAS,KAAK,gBAAAI,EAACI,KAAmB,cAAAR,GAA4B;AAAA,MAE3FC,KAAiBA,EAAc,SAAS,KAAK,gBAAAG,EAACK,KAAoB,eAAAR,GAA8B;AAAA,MAEhGF,KAAWA,EAAQ,SAAS,KAAK,gBAAAK,EAACM,KAAe,SAAAX,EAAA,CAAkB;AAAA,IAAA,EAAA,CACvE;AAAA,EAAA,GACH;AAEN;"}