feat(Indicator): allow use prop card to show as card indicator

gisce · Feb 13, 2025 · 2377876 · 2377876
1 parent 59df2fa
commit 2377876
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 4 deletions.
diff --git a/src/widgets/custom/Indicator.tsx b/src/widgets/custom/Indicator.tsx
@@ -177,6 +177,7 @@ const GraphIndicatorInput = (props: IndicatorInputProps) => {
       action={treeShortcut}
       openAction={openShortcut as any}
       tooltip={description}
+      card={ooui.card}
     >
       {loading && <CenteredSpinner />}
       {!loading && (

diff --git a/src/widgets/views/Graph/GraphCard.tsx b/src/widgets/views/Graph/GraphCard.tsx
@@ -7,7 +7,15 @@ const { useToken } = theme;
 const { Text } = Typography;
 
 export const GraphCard = (props: GraphCardProps) => {
-  const { title, children, action, openAction, parms, tooltip } = props;
+  const {
+    title,
+    children,
+    action,
+    openAction,
+    parms,
+    tooltip,
+    card = false,
+  } = props;
   const { token } = useToken();
 
   const hasDragAndDrop = Object.keys(parms).length > 0;
@@ -28,8 +36,8 @@ export const GraphCard = (props: GraphCardProps) => {
       <Row
         align="middle"
         style={{
-          borderBottom: "1px solid #ddd",
-          backgroundColor: token.colorPrimaryBg,
+          borderBottom: card ? "none" : "1px solid #ddd",
+          backgroundColor: card ? token.colorBgBase : token.colorPrimaryBg,
         }}
         wrap={false}
       >
@@ -51,7 +59,17 @@ export const GraphCard = (props: GraphCardProps) => {
               <Text ellipsis={true}>{title}</Text>
             </>
           ) : (
-            <Text ellipsis={true}>{title}</Text>
+            <Text
+              ellipsis={true}
+              style={{
+                color: card
+                  ? token.colorTextDescription
+                  : token.colorTextHeading,
+                fontWeight: card ? "normal" : "bold",
+              }}
+            >
+              {title}
+            </Text>
           )}
         </Col>
         {action && (

diff --git a/src/widgets/views/Graph/GraphCard.types.ts b/src/widgets/views/Graph/GraphCard.types.ts
@@ -8,4 +8,5 @@ export type GraphCardProps = {
   action?: ShortcutApi;
   openAction?: (shortcutApi?: ShortcutApi) => void;
   tooltip?: string;
+  card?: boolean;
 };