diff --git a/packages/power-bi/package.json b/packages/power-bi/package.json index fee7d3d85..6b2bc8f56 100644 --- a/packages/power-bi/package.json +++ b/packages/power-bi/package.json @@ -1,6 +1,6 @@ { "name": "@equinor/workspace-powerbi", - "version": "1.0.14", + "version": "1.0.16", "type": "module", "sideEffects": false, "license": "MIT", diff --git a/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx b/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx index 442013ddf..1f5c45bd6 100644 --- a/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx +++ b/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx @@ -103,10 +103,14 @@ const StyledFilterButtons = styled.div` const StyledQuickFilterWrapper = styled.div` display: grid; width: 100%; - justify-content: flex-end; - grid-template-columns: repeat(auto-fit, minmax(60px, max-content)); - gap: 2em; + justify-content: flex-start; + grid-template-columns: repeat(auto-fit, minmax(max-content, 50px)); grid-template-rows: 1fr; + gap: 10px; + align-items: center; + overflow-x: hidden; + padding-left: 10px; + padding-right: 10px; `; const FilterButtonContainer = styled.div` diff --git a/packages/power-bi/src/lib/components/quickFilterGroup/QuickFilterGroup.tsx b/packages/power-bi/src/lib/components/quickFilterGroup/QuickFilterGroup.tsx index c293583e5..d43e3677d 100644 --- a/packages/power-bi/src/lib/components/quickFilterGroup/QuickFilterGroup.tsx +++ b/packages/power-bi/src/lib/components/quickFilterGroup/QuickFilterGroup.tsx @@ -5,7 +5,7 @@ import { ActiveFilter, PowerBiFilter, PowerBiFilterItem } from '../../types'; import { getFilterHeaderText } from '../../utils/getFilterHeader'; import { FilterController } from '../Filter/Filter'; import { PowerBiGroupPopoverMenu } from '../groupPopoverMenu/GroupPopoverMenu'; -import { StyledFilterGroupWrapper } from './quickFilterGroup.styles'; +import { StyledFilterGroupContent, StyledFilterGroupWrapper } from './quickFilterGroup.styles'; interface PowerBiFilterGroupProps { controller: FilterController; @@ -24,18 +24,21 @@ export const PowerBiFilterGroup = ({ if (!activeFilters) return null; const isAllChecked = activeFilters.length === 0 || activeFilters.length === group.filterVals.length; + return ( -
+ <> setIsOpen((s) => !s)} ref={anchorEl}> -
- {getFilterHeaderText( - isAllChecked, - group.type, - activeFilters.map((s) => s?.toString() ?? '(Blank)') - )} -
+ +
+ {getFilterHeaderText( + isAllChecked, + group.type, + activeFilters.map((s) => s?.toString() ?? '(Blank)') + )} +
- + +
{isOpen && ( setIsOpen(false)} /> )} -
+ ); }; diff --git a/packages/power-bi/src/lib/components/quickFilterGroup/quickFilterGroup.styles.ts b/packages/power-bi/src/lib/components/quickFilterGroup/quickFilterGroup.styles.ts index 1e2488add..2e64028c5 100644 --- a/packages/power-bi/src/lib/components/quickFilterGroup/quickFilterGroup.styles.ts +++ b/packages/power-bi/src/lib/components/quickFilterGroup/quickFilterGroup.styles.ts @@ -2,12 +2,19 @@ import { tokens } from '@equinor/eds-tokens'; import styled from 'styled-components'; export const StyledFilterGroupWrapper = styled.div` + height: 50px; + width: min-content; + display: flex; + align-items: center; +`; + +export const StyledFilterGroupContent = styled.div` height: auto; - width: auto; + width: min-content; display: flex; align-items: center; cursor: pointer; - + justify-content: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; diff --git a/packages/workspace-fusion/package.json b/packages/workspace-fusion/package.json index 5360306d9..aae132486 100644 --- a/packages/workspace-fusion/package.json +++ b/packages/workspace-fusion/package.json @@ -1,6 +1,6 @@ { "name": "@equinor/workspace-fusion", - "version": "7.0.4", + "version": "7.0.6", "type": "module", "sideEffects": false, "license": "MIT",