@apteva/apteva-kit 0.1.49 → 0.1.50

package/dist/index.js

@@ -916,26 +916,29 @@ function Table({ widget, onAction }) {
 // src/components/Widgets/WidgetRenderer.tsx
 
 function WidgetRenderer({ widget, onAction }) {
-  switch (widget.type) {
-    case "card":
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Card, { widget, onAction });
-    case "list":
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, List, { widget, onAction });
-    case "button":
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Button, { widget, onAction });
-    case "button_group":
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ButtonGroup, { widget, onAction });
-    case "table":
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Table, { widget, onAction });
-    default:
-      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "p-4 border border-yellow-300 bg-yellow-50 rounded-lg", children: [
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "p", { className: "text-sm text-yellow-800", children: [
-          "Unknown widget type: ",
-          widget.type
-        ] }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "pre", { className: "text-xs mt-2 overflow-auto", children: JSON.stringify(widget, null, 2) })
-      ] });
-  }
+  const renderWidget = () => {
+    switch (widget.type) {
+      case "card":
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Card, { widget, onAction });
+      case "list":
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, List, { widget, onAction });
+      case "button":
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Button, { widget, onAction });
+      case "button_group":
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ButtonGroup, { widget, onAction });
+      case "table":
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Table, { widget, onAction });
+      default:
+        return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "p-4 border border-yellow-300 bg-yellow-50 rounded-lg", children: [
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "p", { className: "text-sm text-yellow-800", children: [
+            "Unknown widget type: ",
+            widget.type
+          ] }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "pre", { className: "text-xs mt-2 overflow-auto", children: JSON.stringify(widget, null, 2) })
+        ] });
+    }
+  };
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "apteva-widget", children: renderWidget() });
 }
 
 // src/components/Widgets/Widgets.tsx
@@ -972,13 +975,13 @@ function Widgets({
 function WidgetSkeleton({ type, className }) {
   switch (type) {
     case "card":
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 overflow-hidden", className), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "p-4 space-y-3", children: [
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("apteva-widget-skeleton animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 overflow-hidden", className), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "p-4 space-y-3", children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-4 bg-neutral-200 dark:bg-neutral-700 rounded w-3/4" }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-full" }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-5/6" })
       ] }) });
     case "list":
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("animate-pulse space-y-2", className), children: [1, 2, 3].map((i) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-3 p-3 rounded-lg border border-neutral-200 dark:border-neutral-800", children: [
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("apteva-widget-skeleton animate-pulse space-y-2", className), children: [1, 2, 3].map((i) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-3 p-3 rounded-lg border border-neutral-200 dark:border-neutral-800", children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-10 h-10 bg-neutral-200 dark:bg-neutral-700 rounded-full flex-shrink-0" }),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 space-y-2", children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-1/2" }),
@@ -986,13 +989,13 @@ function WidgetSkeleton({ type, className }) {
         ] })
       ] }, i)) });
     case "button_group":
-      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("animate-pulse flex gap-2", className), children: [
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("apteva-widget-skeleton animate-pulse flex gap-2", className), children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-9 bg-neutral-200 dark:bg-neutral-700 rounded-lg w-20" }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-9 bg-neutral-200 dark:bg-neutral-700 rounded-lg w-20" }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-9 bg-neutral-200 dark:bg-neutral-700 rounded-lg w-20" })
       ] });
     case "form":
-      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 p-4 space-y-4", className), children: [
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("apteva-widget-skeleton animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 p-4 space-y-4", className), children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-4 bg-neutral-200 dark:bg-neutral-700 rounded w-1/3" }),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-3", children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-10 bg-neutral-200 dark:bg-neutral-700 rounded" }),
@@ -1001,7 +1004,7 @@ function WidgetSkeleton({ type, className }) {
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-9 bg-neutral-200 dark:bg-neutral-700 rounded w-24" })
       ] });
     case "chart":
-      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 p-4", className), children: [
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("apteva-widget-skeleton animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 p-4", className), children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-4 bg-neutral-200 dark:bg-neutral-700 rounded w-1/4 mb-4" }),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-end gap-2 h-32", children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex-1 bg-neutral-200 dark:bg-neutral-700 rounded-t h-1/2" }),
@@ -1012,16 +1015,16 @@ function WidgetSkeleton({ type, className }) {
         ] })
       ] });
     case "image":
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("animate-pulse", className), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "aspect-video bg-neutral-200 dark:bg-neutral-700 rounded-lg" }) });
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("apteva-widget-skeleton animate-pulse", className), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "aspect-video bg-neutral-200 dark:bg-neutral-700 rounded-lg" }) });
     case "gallery":
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("animate-pulse grid grid-cols-3 gap-2", className), children: [1, 2, 3].map((i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "aspect-square bg-neutral-200 dark:bg-neutral-700 rounded-lg" }, i)) });
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("apteva-widget-skeleton animate-pulse grid grid-cols-3 gap-2", className), children: [1, 2, 3].map((i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "aspect-square bg-neutral-200 dark:bg-neutral-700 rounded-lg" }, i)) });
     case "map":
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("animate-pulse", className), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-48 bg-neutral-200 dark:bg-neutral-700 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "svg", { className: "w-8 h-8 text-neutral-400 dark:text-neutral-500", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: [
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("apteva-widget-skeleton animate-pulse", className), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-48 bg-neutral-200 dark:bg-neutral-700 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "svg", { className: "w-8 h-8 text-neutral-400 dark:text-neutral-500", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M15 11a3 3 0 11-6 0 3 3 0 016 0z" })
       ] }) }) });
     case "table":
-      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 overflow-hidden", className), children: [
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("apteva-widget-skeleton animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 overflow-hidden", className), children: [
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex bg-neutral-100 dark:bg-neutral-800 border-b border-neutral-200 dark:border-neutral-700", children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex-1 px-4 py-3", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-3 bg-neutral-300 dark:bg-neutral-600 rounded w-16" }) }),
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex-1 px-4 py-3", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-3 bg-neutral-300 dark:bg-neutral-600 rounded w-20" }) }),
@@ -1034,7 +1037,7 @@ function WidgetSkeleton({ type, className }) {
         ] }, i))
       ] });
     default:
-      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 p-4", className), children: [
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("apteva-widget-skeleton animate-pulse rounded-lg border border-neutral-200 dark:border-neutral-800 p-4", className), children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-4 bg-neutral-200 dark:bg-neutral-700 rounded w-1/2 mb-2" }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-3 bg-neutral-200 dark:bg-neutral-700 rounded w-full" })
       ] });