@rebasepro/plugin-insights 0.2.3 → 0.2.5

package/dist/index.umd.js

@@ -143,6 +143,7 @@
             setData(result_0);
           }
         }).catch((err_0) => {
+          cache.invalidate(cacheKey);
           if (!cancelled) {
             setError(err_0 instanceof Error ? err_0 : new Error(String(err_0)));
           }
@@ -213,13 +214,14 @@
     return formatted;
   }
   function InsightsScorecardView(t0) {
-    const $ = reactCompilerRuntime.c(58);
+    const $ = reactCompilerRuntime.c(59);
     const {
       config,
       data,
       title,
       compact: t1,
-      embedded: t2
+      embedded: t2,
+      fixedHeight
     } = t0;
     const compact = t1 === void 0 ? false : t1;
     const embedded = t2 === void 0 ? false : t2;
@@ -379,113 +381,117 @@
     }
     const baseClass = t7;
     let t8;
-    if ($[28] !== embedded || $[29] !== isSmall) {
-      t8 = embedded ? void 0 : {
+    if ($[28] !== embedded || $[29] !== fixedHeight || $[30] !== isSmall) {
+      t8 = embedded ? void 0 : fixedHeight ? {
+        height: fixedHeight
+      } : {
         minHeight: isSmall ? 68 : 92
       };
       $[28] = embedded;
-      $[29] = isSmall;
-      $[30] = t8;
+      $[29] = fixedHeight;
+      $[30] = isSmall;
+      $[31] = t8;
     } else {
-      t8 = $[30];
+      t8 = $[31];
     }
     const t9 = `flex items-center justify-between ${isSmall ? "mb-1" : "mb-2"}`;
     const t10 = `font-medium leading-snug truncate text-surface-500 dark:text-surface-400 ${isSmall ? "text-[11px]" : "text-xs"}`;
     let t11;
-    if ($[31] !== t10 || $[32] !== title) {
+    if ($[32] !== t10 || $[33] !== title) {
       t11 = /* @__PURE__ */ jsxRuntime.jsx("span", { className: t10, children: title });
-      $[31] = t10;
-      $[32] = title;
-      $[33] = t11;
+      $[32] = t10;
+      $[33] = title;
+      $[34] = t11;
     } else {
-      t11 = $[33];
+      t11 = $[34];
     }
     let t12;
-    if ($[34] !== config.dateRange || $[35] !== isSmall) {
+    if ($[35] !== config.dateRange || $[36] !== isSmall) {
       t12 = config.dateRange && !isSmall && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] text-surface-400 dark:text-surface-500 truncate mt-0.5", children: config.dateRange });
-      $[34] = config.dateRange;
-      $[35] = isSmall;
-      $[36] = t12;
+      $[35] = config.dateRange;
+      $[36] = isSmall;
+      $[37] = t12;
     } else {
-      t12 = $[36];
+      t12 = $[37];
     }
     let t13;
-    if ($[37] !== t11 || $[38] !== t12) {
+    if ($[38] !== t11 || $[39] !== t12) {
       t13 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col min-w-0", children: [
         t11,
         t12
       ] });
-      $[37] = t11;
-      $[38] = t12;
-      $[39] = t13;
+      $[38] = t11;
+      $[39] = t12;
+      $[40] = t13;
     } else {
-      t13 = $[39];
+      t13 = $[40];
     }
     let t14;
-    if ($[40] !== iconElement) {
+    if ($[41] !== iconElement) {
       t14 = iconElement && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-2 shrink-0", children: iconElement });
-      $[40] = iconElement;
-      $[41] = t14;
+      $[41] = iconElement;
+      $[42] = t14;
     } else {
-      t14 = $[41];
+      t14 = $[42];
     }
     let t15;
-    if ($[42] !== t13 || $[43] !== t14 || $[44] !== t9) {
+    if ($[43] !== t13 || $[44] !== t14 || $[45] !== t9) {
       t15 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: t9, children: [
         t13,
         t14
       ] });
-      $[42] = t13;
-      $[43] = t14;
-      $[44] = t9;
-      $[45] = t15;
+      $[43] = t13;
+      $[44] = t14;
+      $[45] = t9;
+      $[46] = t15;
     } else {
-      t15 = $[45];
+      t15 = $[46];
     }
     const t16 = `font-semibold leading-tight tracking-tight break-all text-surface-800 dark:text-surface-100 ${isSmall ? "text-lg" : containerWidth !== null && containerWidth < 300 ? "text-xl" : "text-2xl"}`;
     let t17;
-    if ($[46] !== formattedValue || $[47] !== t16) {
+    if ($[47] !== formattedValue || $[48] !== t16) {
       t17 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: t16, children: formattedValue });
-      $[46] = formattedValue;
-      $[47] = t16;
-      $[48] = t17;
+      $[47] = formattedValue;
+      $[48] = t16;
+      $[49] = t17;
     } else {
-      t17 = $[48];
+      t17 = $[49];
     }
     let t18;
-    if ($[49] !== comparisonElement || $[50] !== isSmall) {
+    if ($[50] !== comparisonElement || $[51] !== isSmall) {
       t18 = comparisonElement && /* @__PURE__ */ jsxRuntime.jsx("div", { className: isSmall ? "mt-0.5" : "mt-1", children: comparisonElement });
-      $[49] = comparisonElement;
-      $[50] = isSmall;
-      $[51] = t18;
+      $[50] = comparisonElement;
+      $[51] = isSmall;
+      $[52] = t18;
     } else {
-      t18 = $[51];
+      t18 = $[52];
     }
     let t19;
-    if ($[52] !== baseClass || $[53] !== t15 || $[54] !== t17 || $[55] !== t18 || $[56] !== t8) {
+    if ($[53] !== baseClass || $[54] !== t15 || $[55] !== t17 || $[56] !== t18 || $[57] !== t8) {
       t19 = /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: baseClass, style: t8, children: [
         t15,
         t17,
         t18
       ] });
-      $[52] = baseClass;
-      $[53] = t15;
-      $[54] = t17;
-      $[55] = t18;
-      $[56] = t8;
-      $[57] = t19;
+      $[53] = baseClass;
+      $[54] = t15;
+      $[55] = t17;
+      $[56] = t18;
+      $[57] = t8;
+      $[58] = t19;
     } else {
-      t19 = $[57];
+      t19 = $[58];
     }
     return t19;
   }
   InsightsScorecardView.displayName = "InsightsScorecardView";
   function InsightWidgetSkeleton(t0) {
-    const $ = reactCompilerRuntime.c(17);
+    const $ = reactCompilerRuntime.c(18);
     const {
       config,
       compact: t1,
-      embedded: t2
+      embedded: t2,
+      fixedHeight
     } = t0;
     const compact = t1 === void 0 ? false : t1;
     const embedded = t2 === void 0 ? false : t2;
@@ -561,25 +567,27 @@
       return t10;
     }
     let t3;
-    if ($[12] !== embedded || $[13] !== hasComparison || $[14] !== hasDateRange || $[15] !== hasIcon) {
-      t3 = /* @__PURE__ */ jsxRuntime.jsx(StandardSkeleton, { hasComparison, hasIcon, hasDateRange, embedded });
+    if ($[12] !== embedded || $[13] !== fixedHeight || $[14] !== hasComparison || $[15] !== hasDateRange || $[16] !== hasIcon) {
+      t3 = /* @__PURE__ */ jsxRuntime.jsx(StandardSkeleton, { hasComparison, hasIcon, hasDateRange, embedded, fixedHeight });
       $[12] = embedded;
-      $[13] = hasComparison;
-      $[14] = hasDateRange;
-      $[15] = hasIcon;
-      $[16] = t3;
+      $[13] = fixedHeight;
+      $[14] = hasComparison;
+      $[15] = hasDateRange;
+      $[16] = hasIcon;
+      $[17] = t3;
     } else {
-      t3 = $[16];
+      t3 = $[17];
     }
     return t3;
   }
   function StandardSkeleton(t0) {
-    const $ = reactCompilerRuntime.c(36);
+    const $ = reactCompilerRuntime.c(37);
     const {
       hasComparison,
       hasIcon,
       hasDateRange,
-      embedded
+      embedded,
+      fixedHeight
     } = t0;
     const containerRef = React.useRef(null);
     const [containerWidth, setContainerWidth] = React.useState(null);
@@ -626,122 +634,131 @@
       t4 = $[5];
     }
     let t5;
-    if ($[6] !== embedded || $[7] !== isSmall) {
-      t5 = embedded ? void 0 : {
+    if ($[6] !== embedded || $[7] !== fixedHeight || $[8] !== isSmall) {
+      t5 = embedded ? void 0 : fixedHeight ? {
+        height: fixedHeight
+      } : {
         minHeight: isSmall ? 68 : 92
       };
       $[6] = embedded;
-      $[7] = isSmall;
-      $[8] = t5;
+      $[7] = fixedHeight;
+      $[8] = isSmall;
+      $[9] = t5;
     } else {
-      t5 = $[8];
+      t5 = $[9];
     }
     const t6 = `flex items-center justify-between ${isSmall ? "mb-1" : "mb-2"}`;
     let t7;
-    if ($[9] !== titleHeight) {
+    if ($[10] !== titleHeight) {
       t7 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-surface-200 dark:bg-surface-700 rounded", style: {
         height: titleHeight,
         width: "60%"
       } });
-      $[9] = titleHeight;
-      $[10] = t7;
+      $[10] = titleHeight;
+      $[11] = t7;
     } else {
-      t7 = $[10];
+      t7 = $[11];
     }
     let t8;
-    if ($[11] !== hasDateRange || $[12] !== isSmall) {
+    if ($[12] !== hasDateRange || $[13] !== isSmall) {
       t8 = hasDateRange && !isSmall && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-surface-200/60 dark:bg-surface-700/60 rounded mt-0.5", style: {
         height: 14,
         width: "40%"
       } });
-      $[11] = hasDateRange;
-      $[12] = isSmall;
-      $[13] = t8;
+      $[12] = hasDateRange;
+      $[13] = isSmall;
+      $[14] = t8;
     } else {
-      t8 = $[13];
+      t8 = $[14];
     }
     let t9;
-    if ($[14] !== t7 || $[15] !== t8) {
+    if ($[15] !== t7 || $[16] !== t8) {
       t9 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col min-w-0", children: [
         t7,
         t8
       ] });
-      $[14] = t7;
-      $[15] = t8;
-      $[16] = t9;
+      $[15] = t7;
+      $[16] = t8;
+      $[17] = t9;
     } else {
-      t9 = $[16];
+      t9 = $[17];
     }
     let t10;
-    if ($[17] !== hasIcon || $[18] !== iconSize) {
+    if ($[18] !== hasIcon || $[19] !== iconSize) {
       t10 = hasIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-2 shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-surface-200 dark:bg-surface-700 rounded", style: {
         height: iconSize,
         width: iconSize
       } }) });
-      $[17] = hasIcon;
-      $[18] = iconSize;
-      $[19] = t10;
+      $[18] = hasIcon;
+      $[19] = iconSize;
+      $[20] = t10;
     } else {
-      t10 = $[19];
+      t10 = $[20];
     }
     let t11;
-    if ($[20] !== t10 || $[21] !== t6 || $[22] !== t9) {
+    if ($[21] !== t10 || $[22] !== t6 || $[23] !== t9) {
       t11 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: t6, children: [
         t9,
         t10
       ] });
-      $[20] = t10;
-      $[21] = t6;
-      $[22] = t9;
-      $[23] = t11;
+      $[21] = t10;
+      $[22] = t6;
+      $[23] = t9;
+      $[24] = t11;
     } else {
-      t11 = $[23];
+      t11 = $[24];
     }
     let t12;
-    if ($[24] !== valueHeight) {
+    if ($[25] !== valueHeight) {
       t12 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-surface-200 dark:bg-surface-700 rounded", style: {
         height: valueHeight,
         width: "40%"
       } });
-      $[24] = valueHeight;
-      $[25] = t12;
+      $[25] = valueHeight;
+      $[26] = t12;
     } else {
-      t12 = $[25];
+      t12 = $[26];
     }
     let t13;
-    if ($[26] !== hasComparison || $[27] !== isSmall) {
+    if ($[27] !== hasComparison || $[28] !== isSmall) {
       t13 = hasComparison && /* @__PURE__ */ jsxRuntime.jsx("div", { className: isSmall ? "mt-0.5" : "mt-1", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-surface-200/60 dark:bg-surface-700/60 rounded", style: {
         height: 16,
         width: "25%"
       } }) });
-      $[26] = hasComparison;
-      $[27] = isSmall;
-      $[28] = t13;
+      $[27] = hasComparison;
+      $[28] = isSmall;
+      $[29] = t13;
     } else {
-      t13 = $[28];
+      t13 = $[29];
     }
     let t14;
-    if ($[29] !== t11 || $[30] !== t12 || $[31] !== t13 || $[32] !== t3 || $[33] !== t4 || $[34] !== t5) {
+    if ($[30] !== t11 || $[31] !== t12 || $[32] !== t13 || $[33] !== t3 || $[34] !== t4 || $[35] !== t5) {
       t14 = /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: t3, className: t4, style: t5, children: [
         t11,
         t12,
         t13
       ] });
-      $[29] = t11;
-      $[30] = t12;
-      $[31] = t13;
-      $[32] = t3;
-      $[33] = t4;
-      $[34] = t5;
-      $[35] = t14;
+      $[30] = t11;
+      $[31] = t12;
+      $[32] = t13;
+      $[33] = t3;
+      $[34] = t4;
+      $[35] = t5;
+      $[36] = t14;
     } else {
-      t14 = $[35];
+      t14 = $[36];
     }
     return t14;
   }
   InsightWidgetSkeleton.displayName = "InsightWidgetSkeleton";
+  function computeFixedHeight(config) {
+    let h = 86.5;
+    if (config.dateRange) h += 16;
+    if (config.comparison) h += 20;
+    return Math.ceil(h);
+  }
   function InsightWidget(t0) {
-    const $ = reactCompilerRuntime.c(25);
+    const $ = reactCompilerRuntime.c(37);
     const {
       definition,
       collectionSlug,
@@ -771,82 +788,117 @@
       loading,
       error
     } = useInsightsData(definition, t3);
+    let t4;
+    if ($[4] !== compact || $[5] !== definition.scorecard || $[6] !== embedded) {
+      t4 = !compact && !embedded ? computeFixedHeight(definition.scorecard) : void 0;
+      $[4] = compact;
+      $[5] = definition.scorecard;
+      $[6] = embedded;
+      $[7] = t4;
+    } else {
+      t4 = $[7];
+    }
+    const fixedHeight = t4;
     if (loading) {
-      let t42;
-      if ($[4] !== compact || $[5] !== definition.scorecard || $[6] !== embedded) {
-        t42 = /* @__PURE__ */ jsxRuntime.jsx(InsightWidgetSkeleton, { config: definition.scorecard, compact, embedded });
-        $[4] = compact;
-        $[5] = definition.scorecard;
-        $[6] = embedded;
-        $[7] = t42;
+      let t52;
+      if ($[8] !== compact || $[9] !== definition.scorecard || $[10] !== embedded || $[11] !== fixedHeight) {
+        t52 = /* @__PURE__ */ jsxRuntime.jsx(InsightWidgetSkeleton, { config: definition.scorecard, compact, embedded, fixedHeight });
+        $[8] = compact;
+        $[9] = definition.scorecard;
+        $[10] = embedded;
+        $[11] = fixedHeight;
+        $[12] = t52;
       } else {
-        t42 = $[7];
+        t52 = $[12];
       }
-      return t42;
+      return t52;
     }
     if (error) {
-      const t42 = `text-red-500/70 dark:text-red-400/70 text-[0.8125rem] ${embedded ? "px-5 py-4 h-full" : `rounded-lg bg-red-500/5 dark:bg-red-400/5 border border-red-500/10 dark:border-red-400/10 ${compact ? "px-3.5 py-3" : "px-5 py-4"}`}`;
-      let t52;
-      if ($[8] !== definition.title) {
-        t52 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-semibold mb-1", children: definition.title });
-        $[8] = definition.title;
-        $[9] = t52;
+      const t52 = `text-red-500/70 dark:text-red-400/70 text-[0.8125rem] ${embedded ? "px-5 py-4 h-full" : `rounded-lg bg-red-500/5 dark:bg-red-400/5 border border-red-500/10 dark:border-red-400/10 ${compact ? "px-3.5 py-3" : "px-5 py-4"}`}`;
+      let t62;
+      if ($[13] !== fixedHeight) {
+        t62 = fixedHeight ? {
+          height: fixedHeight
+        } : void 0;
+        $[13] = fixedHeight;
+        $[14] = t62;
       } else {
-        t52 = $[9];
+        t62 = $[14];
       }
-      let t6;
-      if ($[10] !== error.message) {
-        t6 = /* @__PURE__ */ jsxRuntime.jsx("div", { children: error.message });
-        $[10] = error.message;
-        $[11] = t6;
+      let t7;
+      if ($[15] !== definition.title) {
+        t7 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-semibold mb-1", children: definition.title });
+        $[15] = definition.title;
+        $[16] = t7;
       } else {
-        t6 = $[11];
+        t7 = $[16];
       }
-      let t7;
-      if ($[12] !== t42 || $[13] !== t52 || $[14] !== t6) {
-        t7 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: t42, children: [
-          t52,
-          t6
+      let t8;
+      if ($[17] !== error.message) {
+        t8 = /* @__PURE__ */ jsxRuntime.jsx("div", { children: error.message });
+        $[17] = error.message;
+        $[18] = t8;
+      } else {
+        t8 = $[18];
+      }
+      let t9;
+      if ($[19] !== t52 || $[20] !== t62 || $[21] !== t7 || $[22] !== t8) {
+        t9 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: t52, style: t62, children: [
+          t7,
+          t8
         ] });
-        $[12] = t42;
-        $[13] = t52;
-        $[14] = t6;
-        $[15] = t7;
+        $[19] = t52;
+        $[20] = t62;
+        $[21] = t7;
+        $[22] = t8;
+        $[23] = t9;
       } else {
-        t7 = $[15];
+        t9 = $[23];
       }
-      return t7;
+      return t9;
     }
     if (!data || data.rows.length === 0) {
-      const t42 = `text-surface-400 dark:text-surface-500 text-[0.8125rem] ${embedded ? "px-5 py-4 h-full" : `rounded-lg bg-surface-100 dark:bg-surface-800 border border-surface-200 dark:border-surface-700 ${compact ? "px-3.5 py-3" : "px-5 py-4"}`}`;
-      let t52;
-      if ($[16] !== definition.title || $[17] !== t42) {
-        t52 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: t42, children: [
+      const t52 = `text-surface-400 dark:text-surface-500 text-[0.8125rem] ${embedded ? "px-5 py-4 h-full" : `rounded-lg bg-surface-100 dark:bg-surface-800 border border-surface-200 dark:border-surface-700 ${compact ? "px-3.5 py-3" : "px-5 py-4"}`}`;
+      let t62;
+      if ($[24] !== fixedHeight) {
+        t62 = fixedHeight ? {
+          height: fixedHeight
+        } : void 0;
+        $[24] = fixedHeight;
+        $[25] = t62;
+      } else {
+        t62 = $[25];
+      }
+      let t7;
+      if ($[26] !== definition.title || $[27] !== t52 || $[28] !== t62) {
+        t7 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: t52, style: t62, children: [
           definition.title,
           " — No data"
         ] });
-        $[16] = definition.title;
-        $[17] = t42;
-        $[18] = t52;
+        $[26] = definition.title;
+        $[27] = t52;
+        $[28] = t62;
+        $[29] = t7;
       } else {
-        t52 = $[18];
+        t7 = $[29];
       }
-      return t52;
+      return t7;
     }
-    const t4 = data.rows[0];
-    let t5;
-    if ($[19] !== compact || $[20] !== definition.scorecard || $[21] !== definition.title || $[22] !== embedded || $[23] !== t4) {
-      t5 = /* @__PURE__ */ jsxRuntime.jsx(InsightsScorecardView, { config: definition.scorecard, data: t4, title: definition.title, compact, embedded });
-      $[19] = compact;
-      $[20] = definition.scorecard;
-      $[21] = definition.title;
-      $[22] = embedded;
-      $[23] = t4;
-      $[24] = t5;
+    const t5 = data.rows[0];
+    let t6;
+    if ($[30] !== compact || $[31] !== definition.scorecard || $[32] !== definition.title || $[33] !== embedded || $[34] !== fixedHeight || $[35] !== t5) {
+      t6 = /* @__PURE__ */ jsxRuntime.jsx(InsightsScorecardView, { config: definition.scorecard, data: t5, title: definition.title, compact, embedded, fixedHeight });
+      $[30] = compact;
+      $[31] = definition.scorecard;
+      $[32] = definition.title;
+      $[33] = embedded;
+      $[34] = fixedHeight;
+      $[35] = t5;
+      $[36] = t6;
     } else {
-      t5 = $[24];
+      t6 = $[36];
     }
-    return t5;
+    return t6;
   }
   InsightWidget.displayName = "InsightWidget";
   function HomeCardInsightSlot(t0) {