@movable/ui 3.20.4 → 3.20.5

package/lib/components/InkMetricCard/InkMetricCard.d.ts

@@ -0,0 +1,48 @@
+import { SxProps, Theme } from '@mui/material';
+import { ReactNode } from 'react';
+export type MetricTrend = {
+    value: string;
+    direction: 'up' | 'down';
+};
+export type PrimaryMetricData = {
+    value: string;
+    label: string;
+    trend?: MetricTrend;
+};
+export type SecondaryMetricData = {
+    value: string;
+    label: string;
+};
+export type DirectIndirectData = {
+    directPercent: number;
+    directLabel?: string;
+    indirectLabel?: string;
+};
+type BaseProps = {
+    isEmpty?: boolean;
+    sx?: SxProps<Theme>;
+};
+type RobustCardProps = BaseProps & {
+    variant: 'robust';
+    title: string;
+    primaryMetric: PrimaryMetricData;
+    secondaryMetrics?: SecondaryMetricData[];
+    graph?: ReactNode;
+    directIndirect?: DirectIndirectData;
+};
+type InsightCardProps = BaseProps & {
+    variant: 'insight';
+    title: string;
+    primaryMetric: PrimaryMetricData;
+    secondaryMetrics?: SecondaryMetricData[];
+    graph?: ReactNode;
+};
+type SimpleCardProps = BaseProps & {
+    variant: 'simple';
+    metric: SecondaryMetricData;
+    href?: string;
+    onClick?: () => void;
+};
+export type InkMetricCardProps = RobustCardProps | InsightCardProps | SimpleCardProps;
+export declare function InkMetricCard(props: InkMetricCardProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/InkMetricCard/index.d.ts

@@ -0,0 +1 @@
+export { InkMetricCard, type InkMetricCardProps, type PrimaryMetricData, type SecondaryMetricData, type MetricTrend, type DirectIndirectData, } from './InkMetricCard';

package/lib/components/index.d.ts

@@ -28,3 +28,4 @@ export { InkCard } from './InkCard';
 export { InkGridToolBar } from './InkGridToolBar';
 export { InkDataGrid, InkDataGridEmpty, InkDataGridTextWrapCell, createEmptyColumns, createTextWrapColumn, type InkDataGridProps, type InkDataGridEmptyProps, type InkDataGridTextWrapCellProps, } from './InkDataGrid';
 export { InkHighlightAlert, InkAlert, type InkAlertProps } from './Alert';
+export { InkMetricCard, type InkMetricCardProps, type PrimaryMetricData, type SecondaryMetricData, type MetricTrend, type DirectIndirectData, } from './InkMetricCard';

package/lib/index.d.ts

@@ -96,6 +96,11 @@ declare type BaseContentLayoutProps = {
     rightProps?: Grid2Props_2;
 };
 
+declare type BaseProps = {
+    isEmpty?: boolean;
+    sx?: SxProps<Theme_2>;
+};
+
 declare type BreadcrumbProps = {
     breadcrumbs: HeaderLink[];
 };
@@ -186,6 +191,12 @@ declare const defaultDrawerWidths: {
 
 export declare function DetailsLayout({ Header, children, sx, itemProps, ...rest }: LayoutDetailsProps): JSX_2.Element;
 
+export declare type DirectIndirectData = {
+    directPercent: number;
+    directLabel?: string;
+    indirectLabel?: string;
+};
+
 declare type DrawerType = 'basic' | 'panel' | 'filter';
 
 declare type DropdownActionType = {
@@ -701,6 +712,10 @@ declare type InkImageProps = BoxProps_2 & {
     fallbackText?: string;
 };
 
+export declare function InkMetricCard(props: InkMetricCardProps): JSX_2.Element;
+
+export declare type InkMetricCardProps = RobustCardProps | InsightCardProps | SimpleCardProps;
+
 export declare function InkPageHeader({ Breadcrumbs, Subtitle, Metadata, Chips, ButtonGroup, Tabs, sx, }: InkPageHeaderProps): JSX_2.Element;
 
 export declare const inkPageHeader: InkPageHeaderPageObject;
@@ -999,6 +1014,14 @@ declare type InkWorkflowHeaderProps = {
     subtitle?: string;
 };
 
+declare type InsightCardProps = BaseProps & {
+    variant: 'insight';
+    title: string;
+    primaryMetric: PrimaryMetricData;
+    secondaryMetrics?: SecondaryMetricData[];
+    graph?: ReactNode;
+};
+
 export declare function InternalUseOnlyAlert({ message, sx, messageSx, }: InternalUseOnlyAlertProp): JSX_2.Element;
 
 declare type InternalUseOnlyAlertProp = {
@@ -1059,6 +1082,11 @@ export declare type MetadataListProps = {
     metadata: MetadataItem[];
 };
 
+export declare type MetricTrend = {
+    value: string;
+    direction: 'up' | 'down';
+};
+
 export declare const MovableUITheme: Theme;
 
 export declare class MuiDatePickerPageObject {
@@ -1133,6 +1161,26 @@ declare type PrimaryButtonType = ButtonProps & {
     loading?: boolean;
 };
 
+export declare type PrimaryMetricData = {
+    value: string;
+    label: string;
+    trend?: MetricTrend;
+};
+
+declare type RobustCardProps = BaseProps & {
+    variant: 'robust';
+    title: string;
+    primaryMetric: PrimaryMetricData;
+    secondaryMetrics?: SecondaryMetricData[];
+    graph?: ReactNode;
+    directIndirect?: DirectIndirectData;
+};
+
+export declare type SecondaryMetricData = {
+    value: string;
+    label: string;
+};
+
 export declare function SevenThreeSplitContentLayout({ leftContent, rightContent, containerProps, leftProps, rightProps, }: SevenThreeSplitContentLayoutProps): JSX_2.Element;
 
 declare type SevenThreeSplitContentLayoutProps = {
@@ -1143,6 +1191,13 @@ declare type SevenThreeSplitContentLayoutProps = {
     rightProps?: Grid2Props;
 };
 
+declare type SimpleCardProps = BaseProps & {
+    variant: 'simple';
+    metric: SecondaryMetricData;
+    href?: string;
+    onClick?: () => void;
+};
+
 declare type SkeletonGridType = {
     skeletonRows: number;
     skeletonColumns: number;