myio-js-library 0.1.506 → 0.1.507

package/dist/index.cjs

@@ -1164,7 +1164,7 @@ module.exports = __toCommonJS(index_exports);
 // package.json
 var package_default = {
   name: "myio-js-library",
-  version: "0.1.506",
+  version: "0.1.507",
   description: "A clean, standalone JS SDK for MYIO projects",
   license: "MIT",
   repository: "github:gh-myio/myio-js-library",
@@ -16057,7 +16057,7 @@ var INFO_TOOLTIP_CSS = `
   border: 1px solid #e2e8f0;
   border-radius: 12px;
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12), 0 2px 10px rgba(0, 0, 0, 0.08);
-  width: 395px;
+  width: 450px;
   max-width: 90vw;
   font-size: 12px;
   color: #1e293b;
@@ -16503,6 +16503,10 @@ function toggleMaximize3(container) {
       left: container.style.left,
       top: container.style.top
     };
+    state3.isPinned = true;
+    container.classList.add("pinned");
+    const pinBtn = container.querySelector('[data-action="pin"]');
+    pinBtn?.classList.add("pinned");
   }
   container.classList.toggle("maximized", state3.isMaximized);
   const maxBtn = container.querySelector('[data-action="maximize"]');
@@ -70285,7 +70289,7 @@ var ENERGY_SUMMARY_TOOLTIP_CSS = `
   border: 1px solid #e2e8f0;
   border-radius: 12px;
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 2px 10px rgba(0, 0, 0, 0.08);
-  width: 395px;
+  width: 450px;
   max-width: 90vw;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
   font-size: 12px;
@@ -70387,7 +70391,9 @@ var ENERGY_SUMMARY_TOOLTIP_CSS = `
 }
 
 .energy-summary-tooltip.maximized .energy-summary-tooltip__body {
-  flex: 1;
+  flex: 1 1 auto;
+  min-height: 0;
+  max-height: none;
   overflow-y: auto;
 }
 
@@ -71817,6 +71823,7 @@ var EnergySummaryTooltip = {
         left: container.style.left,
         top: container.style.top
       };
+      if (!this._isPinned) this.togglePin();
     }
     container.classList.toggle("maximized", this._isMaximized);
     const maxBtn = container.querySelector('[data-action="maximize"]');
@@ -72338,7 +72345,7 @@ var WATER_SUMMARY_TOOLTIP_CSS = `
   border: 1px solid #e2e8f0;
   border-radius: 12px;
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 2px 10px rgba(0, 0, 0, 0.08);
-  width: 395px;
+  width: 450px;
   max-width: 90vw;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
   font-size: 12px;
@@ -72440,7 +72447,9 @@ var WATER_SUMMARY_TOOLTIP_CSS = `
 }
 
 .water-summary-tooltip.maximized .water-summary-tooltip__body {
-  flex: 1;
+  flex: 1 1 auto;
+  min-height: 0;
+  max-height: none;
   overflow-y: auto;
 }
 
@@ -73739,6 +73748,7 @@ var WaterSummaryTooltip = {
         left: container.style.left,
         top: container.style.top
       };
+      if (!this._isPinned) this.togglePin();
     }
     container.classList.toggle("maximized", this._isMaximized);
     const maxBtn = container.querySelector('[data-action="maximize"]');
@@ -74229,6 +74239,8 @@ var COLUMN_SUMMARY_CSS = `
   display: block; width: 100%; height: auto; aspect-ratio: 1 / 1;
   filter: drop-shadow(0 2px 8px rgba(0,0,0,0.15));
 }
+/* Footer band \u2014 hidden in compact, shown when maximized (mirrors Energy/Water). */
+.myio-col-summary__footer { display: none; }
 .myio-col-summary__slice {
   stroke: #ffffff; stroke-width: 1.5;
   transition: opacity 0.12s ease;
@@ -74283,7 +74295,9 @@ var COLUMN_SUMMARY_CSS = `
 .myio-info-tooltip.maximized .myio-col-summary__chart {
   display: block; grid-column: 1; grid-row: 1; min-width: 0;
 }
-.myio-info-tooltip.maximized .myio-col-summary__pie { max-width: 440px; margin: 0 auto; }
+.myio-info-tooltip.maximized .myio-col-summary__pie {
+  width: 320px; height: 320px; aspect-ratio: auto; margin: 0 auto;
+}
 .myio-info-tooltip.maximized .myio-col-summary__lists {
   grid-column: 1; grid-row: 2; min-height: 0; overflow-y: auto;
   display: flex; flex-direction: column; gap: 14px;
@@ -74295,6 +74309,22 @@ var COLUMN_SUMMARY_CSS = `
   border-left: 1px solid #e3d9f3; padding-left: 20px;
 }
 .myio-info-tooltip.maximized .myio-col-summary__group { margin-top: 0; }
+/* Footer band \u2014 same visual language as Energy/Water tooltips. */
+.myio-info-tooltip.maximized .myio-col-summary__footer {
+  display: flex; justify-content: space-between; align-items: center;
+  flex: 0 0 auto;
+  margin: 14px -16px -16px -16px;  /* bleed to the panel edges (cancels __content padding) */
+  padding: 12px 18px;
+  background: linear-gradient(135deg, #3e1a7d 0%, #6d28d9 100%);
+  color: #ffffff; border-radius: 0 0 11px 11px;
+}
+.myio-info-tooltip.maximized .myio-col-summary__footer-label {
+  font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.92);
+  letter-spacing: 0.3px;
+}
+.myio-info-tooltip.maximized .myio-col-summary__footer-value {
+  font-size: 18px; font-weight: 700; color: #ffffff;
+}
 `;
 var _cssInjected2 = false;
 function injectCSS10() {
@@ -74456,6 +74486,10 @@ function buildInner() {
         ${group("\u25BC 3 menores", bottom3)}
         ${group("\u25CF 3 na m\xE9dia", near3)}
       </div>
+    </div>
+    <div class="myio-col-summary__footer">
+      <span class="myio-col-summary__footer-label">Consumo Total \xB7 ${count} dispositivos</span>
+      <span class="myio-col-summary__footer-value">${esc3(fmt2(total))}</span>
     </div>`;
 }
 function setHighlight(idx) {

package/dist/index.js

@@ -546,7 +546,7 @@ var init_template_card = __esm({
 // package.json
 var package_default = {
   name: "myio-js-library",
-  version: "0.1.506",
+  version: "0.1.507",
   description: "A clean, standalone JS SDK for MYIO projects",
   license: "MIT",
   repository: "github:gh-myio/myio-js-library",
@@ -15439,7 +15439,7 @@ var INFO_TOOLTIP_CSS = `
   border: 1px solid #e2e8f0;
   border-radius: 12px;
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12), 0 2px 10px rgba(0, 0, 0, 0.08);
-  width: 395px;
+  width: 450px;
   max-width: 90vw;
   font-size: 12px;
   color: #1e293b;
@@ -15885,6 +15885,10 @@ function toggleMaximize3(container) {
       left: container.style.left,
       top: container.style.top
     };
+    state3.isPinned = true;
+    container.classList.add("pinned");
+    const pinBtn = container.querySelector('[data-action="pin"]');
+    pinBtn?.classList.add("pinned");
   }
   container.classList.toggle("maximized", state3.isMaximized);
   const maxBtn = container.querySelector('[data-action="maximize"]');
@@ -69667,7 +69671,7 @@ var ENERGY_SUMMARY_TOOLTIP_CSS = `
   border: 1px solid #e2e8f0;
   border-radius: 12px;
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 2px 10px rgba(0, 0, 0, 0.08);
-  width: 395px;
+  width: 450px;
   max-width: 90vw;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
   font-size: 12px;
@@ -69769,7 +69773,9 @@ var ENERGY_SUMMARY_TOOLTIP_CSS = `
 }
 
 .energy-summary-tooltip.maximized .energy-summary-tooltip__body {
-  flex: 1;
+  flex: 1 1 auto;
+  min-height: 0;
+  max-height: none;
   overflow-y: auto;
 }
 
@@ -71199,6 +71205,7 @@ var EnergySummaryTooltip = {
         left: container.style.left,
         top: container.style.top
       };
+      if (!this._isPinned) this.togglePin();
     }
     container.classList.toggle("maximized", this._isMaximized);
     const maxBtn = container.querySelector('[data-action="maximize"]');
@@ -71720,7 +71727,7 @@ var WATER_SUMMARY_TOOLTIP_CSS = `
   border: 1px solid #e2e8f0;
   border-radius: 12px;
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 2px 10px rgba(0, 0, 0, 0.08);
-  width: 395px;
+  width: 450px;
   max-width: 90vw;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
   font-size: 12px;
@@ -71822,7 +71829,9 @@ var WATER_SUMMARY_TOOLTIP_CSS = `
 }
 
 .water-summary-tooltip.maximized .water-summary-tooltip__body {
-  flex: 1;
+  flex: 1 1 auto;
+  min-height: 0;
+  max-height: none;
   overflow-y: auto;
 }
 
@@ -73121,6 +73130,7 @@ var WaterSummaryTooltip = {
         left: container.style.left,
         top: container.style.top
       };
+      if (!this._isPinned) this.togglePin();
     }
     container.classList.toggle("maximized", this._isMaximized);
     const maxBtn = container.querySelector('[data-action="maximize"]');
@@ -73611,6 +73621,8 @@ var COLUMN_SUMMARY_CSS = `
   display: block; width: 100%; height: auto; aspect-ratio: 1 / 1;
   filter: drop-shadow(0 2px 8px rgba(0,0,0,0.15));
 }
+/* Footer band \u2014 hidden in compact, shown when maximized (mirrors Energy/Water). */
+.myio-col-summary__footer { display: none; }
 .myio-col-summary__slice {
   stroke: #ffffff; stroke-width: 1.5;
   transition: opacity 0.12s ease;
@@ -73665,7 +73677,9 @@ var COLUMN_SUMMARY_CSS = `
 .myio-info-tooltip.maximized .myio-col-summary__chart {
   display: block; grid-column: 1; grid-row: 1; min-width: 0;
 }
-.myio-info-tooltip.maximized .myio-col-summary__pie { max-width: 440px; margin: 0 auto; }
+.myio-info-tooltip.maximized .myio-col-summary__pie {
+  width: 320px; height: 320px; aspect-ratio: auto; margin: 0 auto;
+}
 .myio-info-tooltip.maximized .myio-col-summary__lists {
   grid-column: 1; grid-row: 2; min-height: 0; overflow-y: auto;
   display: flex; flex-direction: column; gap: 14px;
@@ -73677,6 +73691,22 @@ var COLUMN_SUMMARY_CSS = `
   border-left: 1px solid #e3d9f3; padding-left: 20px;
 }
 .myio-info-tooltip.maximized .myio-col-summary__group { margin-top: 0; }
+/* Footer band \u2014 same visual language as Energy/Water tooltips. */
+.myio-info-tooltip.maximized .myio-col-summary__footer {
+  display: flex; justify-content: space-between; align-items: center;
+  flex: 0 0 auto;
+  margin: 14px -16px -16px -16px;  /* bleed to the panel edges (cancels __content padding) */
+  padding: 12px 18px;
+  background: linear-gradient(135deg, #3e1a7d 0%, #6d28d9 100%);
+  color: #ffffff; border-radius: 0 0 11px 11px;
+}
+.myio-info-tooltip.maximized .myio-col-summary__footer-label {
+  font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.92);
+  letter-spacing: 0.3px;
+}
+.myio-info-tooltip.maximized .myio-col-summary__footer-value {
+  font-size: 18px; font-weight: 700; color: #ffffff;
+}
 `;
 var _cssInjected2 = false;
 function injectCSS10() {
@@ -73838,6 +73868,10 @@ function buildInner() {
         ${group("\u25BC 3 menores", bottom3)}
         ${group("\u25CF 3 na m\xE9dia", near3)}
       </div>
+    </div>
+    <div class="myio-col-summary__footer">
+      <span class="myio-col-summary__footer-label">Consumo Total \xB7 ${count} dispositivos</span>
+      <span class="myio-col-summary__footer-value">${esc3(fmt2(total))}</span>
     </div>`;
 }
 function setHighlight(idx) {

package/dist/myio-js-library.umd.js

@@ -4070,7 +4070,7 @@
 
   // package.json
   var package_default = {
-    version: "0.1.506"};
+    version: "0.1.507"};
 
   // src/format/energy.ts
   function formatPower(value, decimals = 2) {
@@ -18874,7 +18874,7 @@
   border: 1px solid #e2e8f0;
   border-radius: 12px;
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12), 0 2px 10px rgba(0, 0, 0, 0.08);
-  width: 395px;
+  width: 450px;
   max-width: 90vw;
   font-size: 12px;
   color: #1e293b;
@@ -19320,6 +19320,10 @@
         left: container.style.left,
         top: container.style.top
       };
+      state3.isPinned = true;
+      container.classList.add("pinned");
+      const pinBtn = container.querySelector('[data-action="pin"]');
+      pinBtn?.classList.add("pinned");
     }
     container.classList.toggle("maximized", state3.isMaximized);
     const maxBtn = container.querySelector('[data-action="maximize"]');
@@ -72897,7 +72901,7 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
   border: 1px solid #e2e8f0;
   border-radius: 12px;
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 2px 10px rgba(0, 0, 0, 0.08);
-  width: 395px;
+  width: 450px;
   max-width: 90vw;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
   font-size: 12px;
@@ -72999,7 +73003,9 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
 }
 
 .energy-summary-tooltip.maximized .energy-summary-tooltip__body {
-  flex: 1;
+  flex: 1 1 auto;
+  min-height: 0;
+  max-height: none;
   overflow-y: auto;
 }
 
@@ -74429,6 +74435,7 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
           left: container.style.left,
           top: container.style.top
         };
+        if (!this._isPinned) this.togglePin();
       }
       container.classList.toggle("maximized", this._isMaximized);
       const maxBtn = container.querySelector('[data-action="maximize"]');
@@ -74950,7 +74957,7 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
   border: 1px solid #e2e8f0;
   border-radius: 12px;
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 2px 10px rgba(0, 0, 0, 0.08);
-  width: 395px;
+  width: 450px;
   max-width: 90vw;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
   font-size: 12px;
@@ -75052,7 +75059,9 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
 }
 
 .water-summary-tooltip.maximized .water-summary-tooltip__body {
-  flex: 1;
+  flex: 1 1 auto;
+  min-height: 0;
+  max-height: none;
   overflow-y: auto;
 }
 
@@ -76351,6 +76360,7 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
           left: container.style.left,
           top: container.style.top
         };
+        if (!this._isPinned) this.togglePin();
       }
       container.classList.toggle("maximized", this._isMaximized);
       const maxBtn = container.querySelector('[data-action="maximize"]');
@@ -76841,6 +76851,8 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
   display: block; width: 100%; height: auto; aspect-ratio: 1 / 1;
   filter: drop-shadow(0 2px 8px rgba(0,0,0,0.15));
 }
+/* Footer band \u2014 hidden in compact, shown when maximized (mirrors Energy/Water). */
+.myio-col-summary__footer { display: none; }
 .myio-col-summary__slice {
   stroke: #ffffff; stroke-width: 1.5;
   transition: opacity 0.12s ease;
@@ -76895,7 +76907,9 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
 .myio-info-tooltip.maximized .myio-col-summary__chart {
   display: block; grid-column: 1; grid-row: 1; min-width: 0;
 }
-.myio-info-tooltip.maximized .myio-col-summary__pie { max-width: 440px; margin: 0 auto; }
+.myio-info-tooltip.maximized .myio-col-summary__pie {
+  width: 320px; height: 320px; aspect-ratio: auto; margin: 0 auto;
+}
 .myio-info-tooltip.maximized .myio-col-summary__lists {
   grid-column: 1; grid-row: 2; min-height: 0; overflow-y: auto;
   display: flex; flex-direction: column; gap: 14px;
@@ -76907,6 +76921,22 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
   border-left: 1px solid #e3d9f3; padding-left: 20px;
 }
 .myio-info-tooltip.maximized .myio-col-summary__group { margin-top: 0; }
+/* Footer band \u2014 same visual language as Energy/Water tooltips. */
+.myio-info-tooltip.maximized .myio-col-summary__footer {
+  display: flex; justify-content: space-between; align-items: center;
+  flex: 0 0 auto;
+  margin: 14px -16px -16px -16px;  /* bleed to the panel edges (cancels __content padding) */
+  padding: 12px 18px;
+  background: linear-gradient(135deg, #3e1a7d 0%, #6d28d9 100%);
+  color: #ffffff; border-radius: 0 0 11px 11px;
+}
+.myio-info-tooltip.maximized .myio-col-summary__footer-label {
+  font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.92);
+  letter-spacing: 0.3px;
+}
+.myio-info-tooltip.maximized .myio-col-summary__footer-value {
+  font-size: 18px; font-weight: 700; color: #ffffff;
+}
 `;
   var _cssInjected2 = false;
   function injectCSS10() {
@@ -77068,6 +77098,10 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
         ${group("\u25BC 3 menores", bottom3)}
         ${group("\u25CF 3 na m\xE9dia", near3)}
       </div>
+    </div>
+    <div class="myio-col-summary__footer">
+      <span class="myio-col-summary__footer-label">Consumo Total \xB7 ${count} dispositivos</span>
+      <span class="myio-col-summary__footer-value">${esc3(fmt2(total))}</span>
     </div>`;
   }
   function setHighlight(idx) {