@multiplatform.one/components 7.7.6 → 7.8.0

package/dist/cjs/layouts/page.native.js

@@ -49,8 +49,43 @@ var PAGE_HEADING_TAGS = {
 function negateSpaceToken(token) {
   return `$-${token.startsWith("$") ? token.slice(1) : token}`;
 }
+function knobsFor(component, compact) {
+  return compact === void 0 ? {
+    component
+  } : {
+    component,
+    compact
+  };
+}
+function NestedScale(param) {
+  var {
+    density,
+    children
+  } = param;
+  if (density === "compact") return children;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_theme.Preset, {
+    overrides: {
+      density: "compact"
+    },
+    children
+  });
+}
 var CONTENT_MAX_WIDTH = import_theme.layoutBreakpoints.xl;
 function Screen(param) {
+  var {
+    compact,
+    ...props
+  } = param;
+  var density = compact === void 0 ? void 0 : compact ? "compact" : "comfortable";
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_theme.Surface, {
+    density,
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(ScreenInner, {
+      compact,
+      ...props
+    })
+  });
+}
+function ScreenInner(param) {
   var {
     children,
     scroll = true,
@@ -58,13 +93,12 @@ function Screen(param) {
     bleed = false,
     noPadding = false,
     scrollViewProps,
+    compact,
     ...rest
   } = param;
   var {
     knobProps
-  } = (0, import_theme.useResolvedKnobs)({
-    component: "Screen"
-  });
+  } = (0, import_theme.useResolvedKnobs)(knobsFor("Screen", compact));
   var inner = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
     "data-testid": "screen",
     "data-density": knobProps.density,
@@ -115,12 +149,13 @@ function PageHeader(param) {
     divider = true,
     headingLevel = 1,
     titleScale,
+    compact,
     children,
     ...rest
   } = param;
   var {
     knobProps
-  } = (0, import_theme.useResolvedKnobs)();
+  } = (0, import_theme.useResolvedKnobs)(knobsFor("PageHeader", compact));
   var insetToken = (0, import_pageHeadingScope.usePageChromeInset)();
   (0, import_pageHeadingScope.useRegisterPageHeading)({
     level: headingLevel,
@@ -135,9 +170,10 @@ function PageHeader(param) {
   var titleSize = titleScale ? (0, import_theme.resolvePageTitleScale)(titleScale) : knobProps.pageTitle;
   var titleNode = heading !== null && heading !== void 0 ? heading : title ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(TitleTag, {
     margin: 0,
-    fontWeight: knobProps.heading.fontWeight,
     ...titleSize,
+    fontWeight: knobProps.heading.fontWeight,
     ...headingFamily,
+    "data-font-weight-knob": knobProps.heading.fontWeight === "700" ? "bold" : "regular",
     children: title
   }) : null;
   var showHairline = Boolean(divider);
@@ -149,6 +185,7 @@ function PageHeader(param) {
   } : null;
   return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
     "data-testid": "page-header",
+    "data-density": knobProps.density,
     overflow: "visible",
     ...bleed,
     ...(showHairline ? {
@@ -210,12 +247,13 @@ function PageSection(param) {
     divider = true,
     surface = false,
     headingLevel = 2,
+    compact,
     children,
     ...rest
   } = param;
   var {
     knobProps
-  } = (0, import_theme.useResolvedKnobs)();
+  } = (0, import_theme.useResolvedKnobs)(knobsFor("PageSection", compact));
   var headingFamily = import_tamagui.isWeb ? null : {
     fontFamily: knobProps.heading.fontFamily
   };
@@ -244,12 +282,17 @@ function PageSection(param) {
     }) : null]
   }) : null;
   return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+    "data-testid": "page-section",
+    "data-density": knobProps.density,
     ...knobProps.gap,
     ...rest,
     children: [headerBlock, surface ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
       ...knobProps.gap,
       ...surfaceProps,
-      children
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(NestedScale, {
+        density: knobProps.density,
+        children
+      })
     }) : children]
   });
 }

package/dist/cjs/layouts/page.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","page_exports","__export","CONTENT_MAX_WIDTH","EmptyState","import_EmptyState","PageHeader","PageSection","Screen","ScreenToolbar","module","exports","import_jsx_runtime","require","import_theme","import_tamagui","import_componentColors","import_pageHeadingScope","PAGE_HEADING_TAGS","H1","H2","H3","H4","H5","H6","negateSpaceToken","token","startsWith","slice","layoutBreakpoints","xl","param","children","scroll","maxWidth","bleed","noPadding","scrollViewProps","rest","knobProps","useResolvedKnobs","component","inner","jsx","YStack","density","flex","width","alignSelf","panelPadding","gapLg","PageHeadingScope","insetToken","padding","backgroundColor","ScrollView","contentContainerStyle","flexGrow","title","subtitle","heading","actions","nav","divider","headingLevel","titleScale","usePageChromeInset","useRegisterPageHeading","level","label","enabled","headingFamily","isWeb","fontFamily","TitleTag","titleSize","resolvePageTitleScale","pageTitle","titleNode","margin","fontWeight","showHairline","Boolean","marginHorizontal","contentPad","paddingHorizontal","jsxs","overflow","hairline","bottom","borderColor","componentColors","gap","paddingBottom","XStack","justifyContent","alignItems","flexWrap","flexShrink","minWidth","Paragraph","body","color","text","muted","marginBottom","description","surface","SectionTag","headingNode","sectionHeading","surfaceProps","containerRadius","headerBlock","Separator","line"],"sources":["../../../src/layouts/page.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","page_exports","__export","CONTENT_MAX_WIDTH","EmptyState","import_EmptyState","PageHeader","PageSection","Screen","ScreenToolbar","module","exports","import_jsx_runtime","require","import_theme","import_tamagui","import_componentColors","import_pageHeadingScope","PAGE_HEADING_TAGS","H1","H2","H3","H4","H5","H6","negateSpaceToken","token","startsWith","slice","knobsFor","component","compact","NestedScale","param","density","children","jsx","Preset","overrides","layoutBreakpoints","xl","props","Surface","ScreenInner","scroll","maxWidth","bleed","noPadding","scrollViewProps","rest","knobProps","useResolvedKnobs","inner","YStack","flex","width","alignSelf","panelPadding","gapLg","PageHeadingScope","insetToken","padding","backgroundColor","ScrollView","contentContainerStyle","flexGrow","title","subtitle","heading","actions","nav","divider","headingLevel","titleScale","usePageChromeInset","useRegisterPageHeading","level","label","enabled","headingFamily","isWeb","fontFamily","TitleTag","titleSize","resolvePageTitleScale","pageTitle","titleNode","margin","fontWeight","showHairline","Boolean","marginHorizontal","contentPad","paddingHorizontal","jsxs","overflow","hairline","bottom","borderColor","componentColors","gap","paddingBottom","XStack","justifyContent","alignItems","flexWrap","flexShrink","minWidth","Paragraph","body","color","text","muted","marginBottom","description","surface","SectionTag","headingNode","sectionHeading","surfaceProps","containerRadius","headerBlock","Separator","line"],"sources":["../../../src/layouts/page.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/cjs/shared/useKeyboardInset.cjs

@@ -25,24 +25,6 @@ __export(useKeyboardInset_exports, {
   useKeyboardInset: () => useKeyboardInset
 });
 module.exports = __toCommonJS(useKeyboardInset_exports);
-var import_react = require("react");
-var import_react_native = require("react-native-web");
 function useKeyboardInset() {
-  const [inset, setInset] = (0, import_react.useState)(0);
-  (0, import_react.useEffect)(() => {
-    const showEvent = import_react_native.Platform.OS === "ios" ? "keyboardWillChangeFrame" : "keyboardDidShow";
-    const hideEvent = import_react_native.Platform.OS === "ios" ? "keyboardWillHide" : "keyboardDidHide";
-    const show = import_react_native.Keyboard.addListener(showEvent, event => {
-      const screen = event?.endCoordinates;
-      if (!screen) return;
-      const windowHeight = import_react_native.Dimensions.get("window").height;
-      setInset(Math.max(0, Math.round(windowHeight - screen.screenY)));
-    });
-    const hide = import_react_native.Keyboard.addListener(hideEvent, () => setInset(0));
-    return () => {
-      show.remove();
-      hide.remove();
-    };
-  }, []);
-  return inset;
+  return 0;
 }

package/dist/cjs/shared/useKeyboardInset.native.js

@@ -22,11 +22,11 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
   value: true
 }), mod);
-var useKeyboardInset_exports = {};
-__export(useKeyboardInset_exports, {
+var useKeyboardInset_native_exports = {};
+__export(useKeyboardInset_native_exports, {
   useKeyboardInset: () => useKeyboardInset
 });
-module.exports = __toCommonJS(useKeyboardInset_exports);
+module.exports = __toCommonJS(useKeyboardInset_native_exports);
 var import_react = require("react");
 var import_react_native = require("react-native");
 function useKeyboardInset() {

package/dist/cjs/shared/useKeyboardInset.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","useKeyboardInset_exports","__export","useKeyboardInset","module","exports","import_react","require","import_react_native","inset","setInset","useState","useEffect","showEvent","Platform","OS","hideEvent","show","Keyboard","addListener","event","screen","endCoordinates","windowHeight","Dimensions","get","height","Math","max","round","screenY","hide","remove"],"sources":["../../../src/shared/useKeyboardInset.ts"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,wBAAA;AAAAC,QAAA,CAAAD,wBAAA;EAAAE,gBAAA,EAAAA,CAAA,KAAAA;AAAA;AAeAC,MAAA,CAAAC,OAAA,GAAAT,YAAoC,CAAAK,wBAAA;AACpC,IAAAK,YAAA,GAAAC,OAA+C;AAExC,IAAAC,mBAAS,GAAAD,OAA2B;AACzC,SAAOJ,gBAAeA,CAAA;EAEtB,KAAAM,KAAA,EAAAC,QAAA,QAAUJ,YAAM,CAAAK,QAAA;EAGd,IAAAL,YAAM,CAAAM,SAAY;IAClB,IAAAC,SAAM,GAAAL,mBAAY,CAAAM,QAAA,CAAAC,EAAS,UAAO,4BAA6B;IAE/D,IAAAC,SAAa,GAAAR,mBAAA,CAAAM,QAAS,CAAAC,EAAA,UAAY,qBAAsB;IACtD,IAAAE,IAAM,GAAAT,mBAAgB,CAAAU,QAAA,CAAAC,WAAA,CAAAN,SAAA,YAAAO,KAAA;MACtB,IAAIC,MAAC,GAAQD,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAAE,cAAA;MACb,KAAAD,MAAM;MACN,IAAAE,YAAc,GAAIf,mBAAc,CAAAgB,UAAe,CAAAC,GAAA,CAAO,QAAQ,CAAC,CAAAC,MAAA;MAChEhB,QAAA,CAAAiB,IAAA,CAAAC,GAAA,IAAAD,IAAA,CAAAE,KAAA,CAAAN,YAAA,GAAAF,MAAA,CAAAS,OAAA;IACD;IAEA,IAAAC,IAAO,GAAAvB,mBAAM,CAAAU,QAAA,CAAAC,WAAA,CAAAH,SAAA;MACX,OAAKN,QAAO;IACZ;IACF;MACEO,IAAC,CAAAe,MAAA;MAELD,IAAO,CAAAC,MAAA;IACT","ignoreList":[]}
+{"version":3,"names":["useKeyboardInset_native_exports","__export","useKeyboardInset","module","exports","__toCommonJS","import_react","require","import_react_native","inset","setInset","useState","useEffect","showEvent","Platform","OS","hideEvent","show","Keyboard","addListener","event","screen","endCoordinates","windowHeight","Dimensions","get","height","Math","max","round","screenY","hide","remove"],"sources":["../../../src/shared/useKeyboardInset.native.ts"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,+BAAA;AAAAC,QAAA,CAAAD,+BAAA;EAAAE,gBAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAC,YAAA,CAAAL,+BAAA;AAaI,IAAAM,YAAA,GAAoCC,OAAA;AACxC,IAAAC,mBAAA,GAA+CD,OAAA;AACxC,SAASL,iBAAA,EAAmB;EAC/B,IAAI,CAACO,KAAA,EAAOC,QAAQ,QAAIJ,YAAA,CAAAK,QAAA,EAAS,CAAC;EAClC,IAAAL,YAAA,CAAAM,SAAA,EAAU,YAAW;IAGjB,IAAIC,SAAA,GAAYL,mBAAA,CAAAM,QAAA,CAASC,EAAA,KAAO,QAAQ,4BAA4B;IACpE,IAAIC,SAAA,GAAYR,mBAAA,CAAAM,QAAA,CAASC,EAAA,KAAO,QAAQ,qBAAqB;IAC7D,IAAIE,IAAA,GAAOT,mBAAA,CAAAU,QAAA,CAASC,WAAA,CAAYN,SAAA,EAAW,UAASO,KAAA,EAAO;MACvD,IAAIC,MAAA,GAASD,KAAA,KAAU,QAAQA,KAAA,KAAU,SAAS,SAASA,KAAA,CAAME,cAAA;MACjE,IAAI,CAACD,MAAA,EAAQ;MACb,IAAIE,YAAA,GAAef,mBAAA,CAAAgB,UAAA,CAAWC,GAAA,CAAI,QAAQ,EAAEC,MAAA;MAC5ChB,QAAA,CAASiB,IAAA,CAAKC,GAAA,CAAI,GAAGD,IAAA,CAAKE,KAAA,CAAMN,YAAA,GAAeF,MAAA,CAAOS,OAAO,CAAC,CAAC;IACnE,CAAC;IACD,IAAIC,IAAA,GAAOvB,mBAAA,CAAAU,QAAA,CAASC,WAAA,CAAYH,SAAA,EAAW,YAAW;MAClD,OAAON,QAAA,CAAS,CAAC;IACrB,CAAC;IACD,OAAO,YAAW;MACdO,IAAA,CAAKe,MAAA,CAAO;MACZD,IAAA,CAAKC,MAAA,CAAO;IAChB;EACJ,GAAG,EAAE;EACL,OAAOvB,KAAA;AACX","ignoreList":[]}

package/dist/cjs/views/Dashboard.cjs

@@ -35,6 +35,7 @@ __export(Dashboard_exports, {
 });
 module.exports = __toCommonJS(Dashboard_exports);
 var import_Meter = require("../Meter/index.cjs");
+var import_ChartDataView = require("../charts/ChartDataView.cjs");
 var import_BarChart = require("../charts/BarChart.cjs");
 var import_LineChart = require("../charts/LineChart.cjs");
 var import_PieChart = require("../charts/PieChart.cjs");
@@ -71,6 +72,11 @@ function trendFill(color) {
   if (color === import_componentColors.componentColors.semantic.error) return "$red4";
   return "$color4";
 }
+function trendInk(color) {
+  if (color === import_componentColors.componentColors.semantic.success) return "$green12";
+  if (color === import_componentColors.componentColors.semantic.error) return "$red12";
+  return color;
+}
 function useWidgetChrome(onPress) {
   const resolved = (0, import_theme.useResolvedKnobs)();
   const {
@@ -131,11 +137,11 @@ function TrendPill({
     "data-nested-px": px,
     children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
       ...label,
-      color,
+      color: trendInk(color),
       children: symbol
     }), value != null && value !== "" && /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
       ...label,
-      color,
+      color: trendInk(color),
       children: value
     })]
   });
@@ -152,15 +158,26 @@ function KPICard({
   const {
     t
   } = (0, import_i18n.useTranslation)();
+  const {
+    onPress: consumerOnPress,
+    ...cardProps
+  } = stackProps;
+  const onPress = Object.hasOwn(stackProps, "onPress") ? consumerOnPress : config.onClick;
   const {
     knobProps,
     nested,
     interactive
-  } = useWidgetChrome(config.onClick);
+  } = useWidgetChrome(onPress);
   const {
     px,
     box
   } = nested;
+  const [dataActionSize, setDataActionSize] = (0, import_react.useState)({
+    width: 0,
+    height: 44
+  });
+  const [dataHeaderHeight, setDataHeaderHeight] = (0, import_react.useState)(44);
+  const hasDataView = Boolean(config.sparkline?.length);
   const formatMetric = (0, import_react.useCallback)(num => {
     if (config.format === "currency") {
       return (0, import_theme.formatCurrency)(num, {
@@ -178,15 +195,12 @@ function KPICard({
     if (config.trend === "down") return "\u2193";
     return "\u2014";
   }, [config.trend]);
-  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_surfaces.Card, {
-    width: "100%",
-    elevation: knobProps.elevation,
-    ...knobProps.surface,
-    ...interactive,
-    ...stackProps,
+  const content = /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
     children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
       justifyContent: "space-between",
-      alignItems: "flex-start",
+      alignItems: "center",
+      ...knobProps.gap,
+      onLayout: hasDataView ? event => setDataHeaderHeight(event.nativeEvent.layout.height) : void 0,
       children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
         ...knobProps.label,
         color: knobProps.textAccentColor,
@@ -198,6 +212,10 @@ function KPICard({
         px,
         radius: knobProps.borderRadius,
         children: config.icon
+      }) : null, hasDataView ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+        width: dataActionSize.width,
+        height: dataActionSize.height,
+        pointerEvents: "none"
       }) : null]
     }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
       fontSize: "$8",
@@ -207,7 +225,8 @@ function KPICard({
     }), config.sparkline && config.sparkline.length > 0 ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Sparkline.Sparkline, {
       data: config.sparkline,
       height: px,
-      title: config.title
+      title: config.title,
+      valueFormatter: formatMetric
     }) : null, (config.trend || config.trendValue) && /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
       gap: "$2",
       alignItems: "center",
@@ -228,6 +247,64 @@ function KPICard({
       })]
     })]
   });
+  if (!hasDataView) return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_surfaces.Card, {
+    width: "100%",
+    elevation: knobProps.elevation,
+    ...knobProps.surface,
+    ...interactive,
+    ...stackProps,
+    children: content
+  });
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ChartDataView.ChartDataView, {
+    data: config.sparkline,
+    title: config.title,
+    valueFormatter: formatMetric,
+    children: ({
+      action
+    }) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_surfaces.Card, {
+      width: "100%",
+      elevation: knobProps.elevation,
+      ...knobProps.surface,
+      ...cardProps,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+        position: "relative",
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+          ...knobProps.gap,
+          ...knobProps.containerRadius,
+          ...interactive,
+          focusable: Boolean(onPress),
+          ...(import_tamagui.isWeb ? {
+            "data-mpo-kpi-navigation": config.id,
+            tabIndex: onPress ? 0 : void 0,
+            onKeyDown: onPress ? event => {
+              if (event.key === "Enter" || event.key === " ") {
+                event.preventDefault();
+                if (!event.repeat) event.currentTarget.click();
+              }
+            } : void 0
+          } : {}),
+          children: content
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+          position: "absolute",
+          top: Math.max(0, (dataHeaderHeight - dataActionSize.height) / 2),
+          right: 0,
+          minHeight: 44,
+          justifyContent: "center",
+          onLayout: event => {
+            const {
+              width,
+              height
+            } = event.nativeEvent.layout;
+            setDataActionSize(previous => previous.width === width && previous.height === height ? previous : {
+              width,
+              height
+            });
+          },
+          children: action
+        })]
+      })
+    })
+  });
 }
 function ChartCard({
   config,
@@ -241,15 +318,22 @@ function ChartCard({
   const HeadingTag = SECTION_HEADING_TAGS[headingLevel];
   const dataColors = config.colors ?? colors;
   const showXAxis = config.showLabels !== false;
-  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+  const renderCard = action => /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
     ...knobProps.gap,
     width: "100%",
     ...stackProps,
-    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(HeadingTag, {
-      margin: 0,
-      ...knobProps.heading,
-      ...import_componentColors.sectionHeading,
-      children: config.title
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+      alignItems: "center",
+      justifyContent: "space-between",
+      ...knobProps.gap,
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(HeadingTag, {
+        flex: 1,
+        minWidth: 0,
+        margin: 0,
+        ...knobProps.heading,
+        ...import_componentColors.sectionHeading,
+        children: config.title
+      }), action]
     }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_surfaces.Card, {
       elevation: knobProps.elevation,
       ...knobProps.surface,
@@ -262,6 +346,7 @@ function ChartCard({
         title: config.title
       }) : config.type === "line" ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_LineChart.LineChart, {
         data: config.data,
+        title: config.title,
         height: config.height,
         color: dataColors?.[0],
         showPoints: true,
@@ -269,6 +354,7 @@ function ChartCard({
         showYAxis: false
       }) : /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_BarChart.BarChart, {
         data: config.data,
+        title: config.title,
         height: config.height,
         colors: dataColors,
         showXAxis,
@@ -276,6 +362,13 @@ function ChartCard({
       })
     })]
   });
+  return config.type === "pie" && config.showLegend !== false ? renderCard() : /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ChartDataView.ChartDataView, {
+    data: config.data,
+    title: config.title,
+    children: ({
+      action
+    }) => renderCard(action)
+  });
 }
 function ProgressCard({
   config,