@kingsimba/nc-ui 0.1.36 → 0.1.37

package/dist/index.js

@@ -135,7 +135,7 @@ function _n({
 }) {
   const o = Math.max(0, Math.min(1, Number(e) || 0)), i = o === 0 ? "-" : String(Math.round(o * 100));
   let a;
-  r ? o < 0.1 ? a = "var(--nc-danger)" : o < 0.2 ? a = "var(--nc-warning)" : a = "var(--nc-success)" : a = n ? "#ffffff" : "#000000";
+  r ? o < 0.1 ? a = "var(--nc-danger)" : o < 0.2 ? a = "var(--nc-warning)" : a = "var(--nc-success)" : a = n ? "rgba(255,255,255,0.35)" : "#000000";
   const c = "var(--nc-battery-shell-bg)", l = 24, u = 14, f = 2, b = 0, d = 12, m = 0, A = 0, v = 0, w = l, y = u, h = y - m * 2, p = w - m * 2, g = Math.max(1, Math.min(4, y / 4)), x = o === 0 ? 0 : 0.05 + o * 0.95, C = l + f + d, T = 20, E = 0.65, S = Math.max(u, T * E), L = l + f + 1, k = (u - T * E) / 2;
   return /* @__PURE__ */ N(
     "svg",
@@ -2154,26 +2154,10 @@ class nn extends ze.Component {
     console.error(`Error loading app ${this.props.appId}:`, t, n);
   }
   render() {
-    return this.state.hasError ? /* @__PURE__ */ N(
-      "div",
-      {
-        style: {
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          flex: 1,
-          flexDirection: "column",
-          gap: "16px",
-          padding: "20px",
-          textAlign: "center",
-          color: "var(--text-secondary)"
-        },
-        children: [
-          /* @__PURE__ */ s("div", { children: "Failed to load app" }),
-          this.state.error && /* @__PURE__ */ s("div", { style: { fontSize: "12px", opacity: 0.7 }, children: this.state.error.message })
-        ]
-      }
-    ) : this.props.children;
+    return this.state.hasError ? /* @__PURE__ */ N("div", { className: "nc-app-error", children: [
+      /* @__PURE__ */ s("div", { children: "Failed to load app" }),
+      this.state.error && /* @__PURE__ */ s("div", { style: { fontSize: "12px", opacity: 0.7 }, children: this.state.error.message })
+    ] }) : this.props.children;
   }
 }
 function rt({ appId: e, isActive: t, onClose: n }) {
@@ -2211,12 +2195,7 @@ function rt({ appId: e, isActive: t, onClose: n }) {
   return /* @__PURE__ */ N(
     "div",
     {
-      style: {
-        display: t ? "flex" : "none",
-        flexDirection: "column",
-        flex: 1,
-        minHeight: 0
-      },
+      className: `nc-app-container${t ? "" : " nc-hidden"}`,
       children: [
         E && /* @__PURE__ */ s(
           tn,
@@ -2231,31 +2210,15 @@ function rt({ appId: e, isActive: t, onClose: n }) {
         /* @__PURE__ */ s(
           "div",
           {
-            className: E ? "nc-app-content-wrapper" : "",
+            className: "nc-app-content-wrapper",
             style: {
               padding: o.padding,
-              flex: 1,
-              minHeight: 0,
-              display: "flex",
-              flexDirection: "column",
-              backgroundColor: "var(--nc-bg-tertiary)",
-              position: "relative"
+              overflowY: E ? "auto" : void 0
             },
             children: /* @__PURE__ */ s(nt.Provider, { value: C, children: /* @__PURE__ */ s(nn, { appId: e, children: /* @__PURE__ */ s(
               Mt,
               {
-                fallback: /* @__PURE__ */ s(
-                  "div",
-                  {
-                    style: {
-                      display: "flex",
-                      alignItems: "center",
-                      justifyContent: "center",
-                      flex: 1
-                    },
-                    children: /* @__PURE__ */ s(Qe, {})
-                  }
-                ),
+                fallback: /* @__PURE__ */ s("div", { className: "nc-app-loading", children: /* @__PURE__ */ s(Qe, {}) }),
                 children: /* @__PURE__ */ s(T, {})
               }
             ) }) })