analytica-frontend-lib 1.1.95 → 1.1.96

package/dist/index.d.mts

@@ -150,7 +150,7 @@ declare const CheckboxListItem: react.ForwardRefExoticComponent<{
     state?: CheckboxListState;
     /** Additional CSS classes */
     className?: string;
-} & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "value" | "checked" | "type" | "name" | "onChange"> & react.RefAttributes<HTMLInputElement>>;
+} & Omit<InputHTMLAttributes<HTMLInputElement>, "onChange" | "name" | "type" | "size" | "value" | "checked"> & react.RefAttributes<HTMLInputElement>>;
 
 /**
  * Notification store state interface

package/dist/index.d.ts

@@ -150,7 +150,7 @@ declare const CheckboxListItem: react.ForwardRefExoticComponent<{
     state?: CheckboxListState;
     /** Additional CSS classes */
     className?: string;
-} & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "value" | "checked" | "type" | "name" | "onChange"> & react.RefAttributes<HTMLInputElement>>;
+} & Omit<InputHTMLAttributes<HTMLInputElement>, "onChange" | "name" | "type" | "size" | "value" | "checked"> & react.RefAttributes<HTMLInputElement>>;
 
 /**
  * Notification store state interface

package/dist/index.js

@@ -8170,7 +8170,7 @@ var VALUE_TEXT_COLORS = {
   low: "text-error-700",
   total: "text-info-700"
 };
-var StatCard = ({ item }) => {
+var StatCard = ({ item, showPlaceholder = false }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
     "div",
     {
@@ -8182,7 +8182,7 @@ var StatCard = ({ item }) => {
             size: "4xl",
             weight: "bold",
             className: `${VALUE_TEXT_COLORS[item.variant]} leading-[42px] tracking-[0.2px] self-stretch`,
-            children: item.value
+            children: showPlaceholder ? "-" : item.value
           }
         ),
         /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
@@ -8198,9 +8198,16 @@ var StatCard = ({ item }) => {
     }
   );
 };
+var getGridColumnsClass = (itemCount) => {
+  if (itemCount === 4) return "lg:grid-cols-4";
+  if (itemCount === 3) return "lg:grid-cols-3";
+  if (itemCount === 2) return "lg:grid-cols-2";
+  return "lg:grid-cols-1";
+};
 var StatisticsCard = ({
   title,
   data,
+  showPlaceholder = false,
   emptyStateMessage,
   emptyStateButtonText,
   onEmptyStateButtonClick,
@@ -8212,6 +8219,7 @@ var StatisticsCard = ({
   className = ""
 }) => {
   const hasData = data && data.length > 0;
+  const gridColumnsClass = hasData ? getGridColumnsClass(data.length) : "";
   return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
     "div",
     {
@@ -8239,13 +8247,20 @@ var StatisticsCard = ({
             }
           ) })
         ] }),
-        hasData ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-[13px]", children: data.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-          StatCard,
+        hasData ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+          "div",
           {
-            item
-          },
-          `${item.variant}-${item.label}-${index}`
-        )) }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "border border-dashed border-border-300 rounded-lg p-6 min-h-[105px] flex flex-col items-center justify-center gap-2", children: [
+            className: `grid grid-cols-1 sm:grid-cols-2 gap-[13px] ${gridColumnsClass}`,
+            children: data.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              StatCard,
+              {
+                item,
+                showPlaceholder
+              },
+              `${item.variant}-${item.label}-${index}`
+            ))
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "border border-dashed border-border-300 rounded-lg p-6 min-h-[105px] flex flex-col items-center justify-center gap-2", children: [
           /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
             Text_default,
             {