@trops/dash-core 0.1.215 → 0.1.216

package/dist/index.esm.js

@@ -5961,13 +5961,13 @@ var WizardDiscoverStep = function WizardDiscoverStep(_ref) {
             className: "text-sm font-semibold text-gray-300 flex items-center gap-2",
             children: ["Dashboards (", filteredDashboards.length, " result", filteredDashboards.length !== 1 ? "s" : "", ")"]
           }), /*#__PURE__*/jsx("div", {
-            className: "grid grid-cols-2 lg:grid-cols-3 gap-3",
+            className: "grid grid-cols-3 gap-3",
             children: filteredDashboards.map(function (dash) {
               var isSelected = state.selectedDashboard && state.selectedDashboard.name === dash.name;
               var widgetCount = (dash.widgets || []).length;
-              var providerNames = (dash.providers || []).map(function (p) {
+              var providerTags = (dash.providers || []).map(function (p) {
                 return p.name || p.type;
-              }).join(", ");
+              }).filter(Boolean);
               return /*#__PURE__*/jsxs(Card2, {
                 hover: true,
                 selected: isSelected,
@@ -5978,27 +5978,40 @@ var WizardDiscoverStep = function WizardDiscoverStep(_ref) {
                   return handleSelectDashboard(dash);
                 },
                 children: [/*#__PURE__*/jsxs("div", {
-                  className: "flex items-center gap-2",
-                  children: [/*#__PURE__*/jsx(FontAwesomeIcon, {
-                    icon: resolveIcon(dash.icon || "grid-2"),
-                    fixedWidth: true,
-                    className: "text-gray-400"
+                  className: "flex flex-col items-center text-center gap-2",
+                  children: [/*#__PURE__*/jsxs("div", {
+                    className: "relative",
+                    children: [/*#__PURE__*/jsx("span", {
+                      className: "text-2xl",
+                      children: /*#__PURE__*/jsx(FontAwesomeIcon, {
+                        icon: resolveIcon(dash.icon || "grid-2"),
+                        fixedWidth: true,
+                        className: "text-gray-400"
+                      })
+                    }), isSelected && /*#__PURE__*/jsx(FontAwesomeIcon, {
+                      icon: "circle-check",
+                      className: "absolute -top-1 -right-3 text-blue-400 text-xs"
+                    })]
                   }), /*#__PURE__*/jsx("span", {
-                    className: "text-sm font-medium text-gray-200",
+                    className: "text-sm font-semibold text-gray-200",
                     children: dash.displayName || dash.name
-                  }), isSelected && /*#__PURE__*/jsx(FontAwesomeIcon, {
-                    icon: "circle-check",
-                    className: "ml-auto text-blue-400"
                   })]
                 }), dash.description && /*#__PURE__*/jsx("p", {
-                  className: "text-xs text-gray-400 mt-1 line-clamp-2",
+                  className: "text-xs text-gray-400 mt-2 line-clamp-2 text-center",
                   children: dash.description
                 }), /*#__PURE__*/jsxs("div", {
-                  className: "flex items-center gap-3 mt-2 text-xs text-gray-500",
+                  className: "flex items-center justify-between mt-3 pt-2 border-t border-gray-700/50",
                   children: [/*#__PURE__*/jsxs("span", {
+                    className: "text-xs text-gray-500",
                     children: [widgetCount, " widget", widgetCount !== 1 ? "s" : ""]
-                  }), providerNames && /*#__PURE__*/jsx("span", {
-                    children: providerNames
+                  }), providerTags.length > 0 && /*#__PURE__*/jsx("div", {
+                    className: "flex flex-wrap gap-1 justify-end",
+                    children: providerTags.slice(0, 3).map(function (tag) {
+                      return /*#__PURE__*/jsx("span", {
+                        className: "text-xs px-1.5 py-0.5 rounded bg-gray-800 text-gray-400",
+                        children: tag
+                      }, tag);
+                    })
                   })]
                 })]
               }, dash.name);