+ {(!isHeaderHidden || (isEditing && showHiddenElements)) && (
+
+
+ {!isClone && isEditing && (
+
+ )}
+ {!isCollapsed &&
}
+
+ );
+}
+
+function getStyles(theme: GrafanaTheme2) {
+ return {
+ rowHeader: css({
+ width: '100%',
+ display: 'flex',
+ gap: theme.spacing(1),
+ padding: theme.spacing(0, 0, 0.5, 0),
+ margin: theme.spacing(0, 0, 1, 0),
+ alignItems: 'center',
+
+ '&:hover, &:focus-within': {
+ '& > div': {
+ opacity: 1,
+ },
+ },
+
+ '& > div': {
+ marginBottom: 0,
+ marginRight: theme.spacing(1),
+ },
+ }),
+ rowTitleButton: css({
+ display: 'flex',
+ alignItems: 'center',
+ cursor: 'pointer',
+ background: 'transparent',
+ border: 'none',
+ minWidth: 0,
+ gap: theme.spacing(1),
+ }),
+ rowTitle: css({
+ fontSize: theme.typography.h5.fontSize,
+ fontWeight: theme.typography.fontWeightMedium,
+ whiteSpace: 'nowrap',
+ overflow: 'hidden',
+ textOverflow: 'ellipsis',
+ maxWidth: '100%',
+ flexGrow: 1,
+ minWidth: 0,
+ }),
+ wrapper: css({
+ display: 'flex',
+ flexDirection: 'column',
+ width: '100%',
+ minHeight: '100px',
+ }),
+ wrapperGrow: css({
+ flexGrow: 1,
+ }),
+ wrapperCollapsed: css({
+ flexGrow: 0,
+ borderBottom: `1px solid ${theme.colors.border.weak}`,
+ minHeight: 'unset',
+ }),
+ rowActions: css({
+ display: 'flex',
+ opacity: 0,
+ }),
+ };
+}
diff --git a/public/app/features/dashboard-scene/scene/layout-rows/RowItemRepeaterBehavior.test.tsx b/public/app/features/dashboard-scene/scene/layout-rows/RowItemRepeaterBehavior.test.tsx
index 753987c15ae..d152fed3a64 100644
--- a/public/app/features/dashboard-scene/scene/layout-rows/RowItemRepeaterBehavior.test.tsx
+++ b/public/app/features/dashboard-scene/scene/layout-rows/RowItemRepeaterBehavior.test.tsx
@@ -141,7 +141,7 @@ function buildScene(
$behaviors: [repeatBehavior],
layout: DefaultGridLayoutManager.fromGridItems([
new DashboardGridItem({
- key: 'griditem-1',
+ key: 'grid-item-1',
x: 0,
y: 11,
width: 24,
@@ -155,13 +155,13 @@ function buildScene(
title: 'Row at the bottom',
layout: DefaultGridLayoutManager.fromGridItems([
new DashboardGridItem({
- key: 'griditem-2',
+ key: 'grid-item-2',
x: 0,
y: 17,
body: buildTextPanel('text-2', 'Panel inside row, server = $server'),
}),
new DashboardGridItem({
- key: 'griditem-3',
+ key: 'grid-item-3',
x: 0,
y: 25,
body: buildTextPanel('text-3', 'Panel inside row, server = $server'),
diff --git a/public/app/features/dashboard-scene/scene/layout-rows/RowItemRepeaterBehavior.ts b/public/app/features/dashboard-scene/scene/layout-rows/RowItemRepeaterBehavior.ts
index 175351744a6..49b4e9c0a25 100644
--- a/public/app/features/dashboard-scene/scene/layout-rows/RowItemRepeaterBehavior.ts
+++ b/public/app/features/dashboard-scene/scene/layout-rows/RowItemRepeaterBehavior.ts
@@ -22,10 +22,6 @@ interface RowItemRepeaterBehaviorState extends SceneObjectState {
variableName: string;
}
-/**
- * This behavior will run an effect function when specified variables change
- */
-
export class RowItemRepeaterBehavior extends SceneObjectBase