From 98109a563f75587eadc1eda16d0f6620928e569d Mon Sep 17 00:00:00 2001
From: Kamil Mielnik <kamil@kamilmielnik.com>
Date: Fri, 26 Jul 2024 20:00:50 +0700
Subject: [PATCH] Lift className up
---
.../components/ParameterValueWidget.module.css | 4 ++++
.../parameters/components/ParameterValueWidget.tsx | 7 +++++--
.../components/WidgetStatus/WidgetStatus.module.css | 3 ---
.../components/WidgetStatus/WidgetStatus.tsx | 11 ++++++++---
4 files changed, 17 insertions(+), 8 deletions(-)
delete mode 100644 frontend/src/metabase/parameters/components/WidgetStatus/WidgetStatus.module.css
diff --git a/frontend/src/metabase/parameters/components/ParameterValueWidget.module.css b/frontend/src/metabase/parameters/components/ParameterValueWidget.module.css
index 11276686089..14a3ed0e987 100644
--- a/frontend/src/metabase/parameters/components/ParameterValueWidget.module.css
+++ b/frontend/src/metabase/parameters/components/ParameterValueWidget.module.css
@@ -69,3 +69,7 @@
font-weight: bold;
color: var(--mb-color-text-secondary);
}
+
+.widgetStatus {
+ flex: 0 0 auto;
+}
diff --git a/frontend/src/metabase/parameters/components/ParameterValueWidget.tsx b/frontend/src/metabase/parameters/components/ParameterValueWidget.tsx
index cfb6b309fa7..c691082ced9 100644
--- a/frontend/src/metabase/parameters/components/ParameterValueWidget.tsx
+++ b/frontend/src/metabase/parameters/components/ParameterValueWidget.tsx
@@ -84,6 +84,7 @@ export const ParameterValueWidget = ({
) {
return (
<WidgetStatus
+ className={S.widgetStatus}
highlighted={fieldHasValueOrFocus}
status="reset"
onClick={() => setParameterValueToDefault?.(parameter.id)}
@@ -94,6 +95,7 @@ export const ParameterValueWidget = ({
if (value != null) {
return (
<WidgetStatus
+ className={S.widgetStatus}
highlighted={fieldHasValueOrFocus}
status="clear"
onClick={() => {
@@ -105,7 +107,7 @@ export const ParameterValueWidget = ({
}
if (!hasNoPopover(parameter)) {
- return <WidgetStatus status="empty" />;
+ return <WidgetStatus className={S.widgetStatus} status="empty" />;
}
};
@@ -119,6 +121,7 @@ export const ParameterValueWidget = ({
) {
return (
<WidgetStatus
+ className={S.widgetStatus}
highlighted={fieldHasValueOrFocus}
status="reset"
onClick={() => setParameterValueToDefault?.(parameter.id)}
@@ -139,7 +142,7 @@ export const ParameterValueWidget = ({
if (!icon) {
// This is required to keep input width constant
- return <WidgetStatus status="none" />;
+ return <WidgetStatus className={S.widgetStatus} status="none" />;
}
return icon;
diff --git a/frontend/src/metabase/parameters/components/WidgetStatus/WidgetStatus.module.css b/frontend/src/metabase/parameters/components/WidgetStatus/WidgetStatus.module.css
deleted file mode 100644
index d4f55fd6e1f..00000000000
--- a/frontend/src/metabase/parameters/components/WidgetStatus/WidgetStatus.module.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.root {
- flex: 0 0 auto;
-}
diff --git a/frontend/src/metabase/parameters/components/WidgetStatus/WidgetStatus.tsx b/frontend/src/metabase/parameters/components/WidgetStatus/WidgetStatus.tsx
index 800416ce3b5..b58ddae0d06 100644
--- a/frontend/src/metabase/parameters/components/WidgetStatus/WidgetStatus.tsx
+++ b/frontend/src/metabase/parameters/components/WidgetStatus/WidgetStatus.tsx
@@ -3,10 +3,10 @@ import { t } from "ttag";
import { Button, Flex, Icon, rem, Tooltip } from "metabase/ui";
-import S from "./WidgetStatus.module.css";
import type { Status } from "./types";
type Props = {
+ className?: string;
highlighted?: boolean;
status: Status;
onClick?: () => void;
@@ -20,7 +20,12 @@ const COMPACT_BUTTON_PADDING = 4;
*/
const BUTTON_MARGIN = -COMPACT_BUTTON_PADDING;
-export const WidgetStatus = ({ highlighted, status, onClick }: Props) => {
+export const WidgetStatus = ({
+ className,
+ highlighted,
+ status,
+ onClick,
+}: Props) => {
const handleClick = (event: MouseEvent) => {
if (onClick) {
event.stopPropagation();
@@ -31,7 +36,7 @@ export const WidgetStatus = ({ highlighted, status, onClick }: Props) => {
return (
<Flex
align="center"
- className={S.root}
+ className={className}
h={0} // trick to prevent this element from affecting parent's height
ml="auto"
>
--
GitLab