diff --git a/automation/run-e2e/lib/update-test-project.mjs b/automation/run-e2e/lib/update-test-project.mjs index b1f367eaac..a6dfe5bbfe 100644 --- a/automation/run-e2e/lib/update-test-project.mjs +++ b/automation/run-e2e/lib/update-test-project.mjs @@ -6,29 +6,17 @@ import { join, resolve } from "node:path"; import sh from "shelljs"; import * as config from "./config.mjs"; import { fetchGithubRestAPI, fetchWithReport, packageMeta, streamPipe, usetmp } from "./utils.mjs"; +import { atlasCoreReleaseUrl } from "./config.mjs"; const { cp, rm, mkdir, test } = sh; -async function getLatestReleaseByName(name, atlasCoreReleaseUrl) { - const releasesResponse = await fetchGithubRestAPI(`${atlasCoreReleaseUrl}`); - - if (!releasesResponse.ok) { - throw new Error("Can't fetch releases"); - } - - const releases = await releasesResponse.json(); - - if (!Array.isArray(releases)) { - throw new Error("Releases response is not an array"); - } - - const filteredReleases = releases.filter(release => release.name.toLowerCase().includes(name.toLowerCase())); - - if (filteredReleases.length === 0) { - throw new Error(`No releases found with name: ${name}`); +async function getReleaseByTag(tag) { + const url = `${atlasCoreReleaseUrl}/tags/${tag}`; + const response = await fetchGithubRestAPI(url); + if (!response.ok) { + throw new Error(`Can't fetch release for tag: ${tag}`); } - - return filteredReleases[0]; + return await response.json(); } async function downloadAndExtract(url, downloadPath, extractPath) { @@ -47,10 +35,7 @@ async function updateAtlasThemeSource() { rm("-rf", config.atlasDirsToRemove); - const release = await getLatestReleaseByName( - "Atlas Core - Marketplace Release v3.17.0", - config.atlasCoreReleaseUrl - ); + const release = await getReleaseByTag("atlas-core-v3.17.0"); const { browser_download_url } = release.assets[0]; const downloadedPath = join(await usetmp(), config.nameForDownloadedAtlasCore); const outPath = await usetmp(); @@ -73,13 +58,10 @@ async function updateAtlasTheme() { // Fetch the specific release by tag from GitHub API const tag = "atlasui-theme-files-2024-01-25"; - const releaseResponse = await fetchGithubRestAPI(`${config.atlasCoreReleaseUrl}/tags/${tag}`); - if (!releaseResponse.ok) { - throw new Error(`Can't fetch release for tag: ${tag}`); - } - const release = await releaseResponse.json(); - if (!release.assets || release.assets.length === 0) { - throw new Error(`No assets found for release tag: ${tag}`); + const release = await getReleaseByTag(tag); + + if (!release) { + throw new Error("Can't fetch latest Atlas UI theme release"); } const [{ browser_download_url }] = release.assets; const downloadedPath = join(await usetmp(), config.nameForDownloadedAtlasTheme); diff --git a/packages/modules/data-widgets/src/themesource/datawidgets/web/_datagrid-dropdown-filter.scss b/packages/modules/data-widgets/src/themesource/datawidgets/web/_datagrid-dropdown-filter.scss index affc9a7cd0..698d9bf763 100644 --- a/packages/modules/data-widgets/src/themesource/datawidgets/web/_datagrid-dropdown-filter.scss +++ b/packages/modules/data-widgets/src/themesource/datawidgets/web/_datagrid-dropdown-filter.scss @@ -106,6 +106,12 @@ $root: ".widget-dropdown-filter"; } } + &-menu-item-text { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + &-checkbox-slot { display: flex; margin-inline-end: var(--wdf-outer-spacing); diff --git a/packages/pluggableWidgets/datagrid-dropdown-filter-web/CHANGELOG.md b/packages/pluggableWidgets/datagrid-dropdown-filter-web/CHANGELOG.md index 135c07993e..db82d14047 100644 --- a/packages/pluggableWidgets/datagrid-dropdown-filter-web/CHANGELOG.md +++ b/packages/pluggableWidgets/datagrid-dropdown-filter-web/CHANGELOG.md @@ -6,6 +6,12 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ## [Unreleased] +### Fixed + +- We implemented ellipsis truncation to resolve option caption overflow issues. + +- We fixed an issue where tooltips were not displayed correctly when hovering over options. + ## [2.32.0] - 2025-08-14 ### Fixed diff --git a/packages/pluggableWidgets/datagrid-dropdown-filter-web/package.json b/packages/pluggableWidgets/datagrid-dropdown-filter-web/package.json index 3858139725..abea9bfc8e 100644 --- a/packages/pluggableWidgets/datagrid-dropdown-filter-web/package.json +++ b/packages/pluggableWidgets/datagrid-dropdown-filter-web/package.json @@ -1,7 +1,7 @@ { "name": "@mendix/datagrid-dropdown-filter-web", "widgetName": "DatagridDropdownFilter", - "version": "2.32.0", + "version": "2.32.1", "description": "", "copyright": "© Mendix Technology BV 2025. All rights reserved.", "license": "Apache-2.0", diff --git a/packages/pluggableWidgets/datagrid-dropdown-filter-web/src/DatagridDropdownFilter.editorConfig.ts b/packages/pluggableWidgets/datagrid-dropdown-filter-web/src/DatagridDropdownFilter.editorConfig.ts index 5194e4211a..13ef41afe2 100644 --- a/packages/pluggableWidgets/datagrid-dropdown-filter-web/src/DatagridDropdownFilter.editorConfig.ts +++ b/packages/pluggableWidgets/datagrid-dropdown-filter-web/src/DatagridDropdownFilter.editorConfig.ts @@ -17,10 +17,16 @@ export function getProperties(values: DatagridDropdownFilterPreviewProps, defaul hidePropertyIn(defaultProperties, values, "filterOptions"); } + if (values.filterable || values.multiSelect) { + // empty option is not shown when any of those are enabled + hidePropertyIn(defaultProperties, values, "emptyOptionCaption"); + } + if (values.filterable) { + // when it is filterable, we always imply clearable as true, so we hide the property hidePropertyIn(defaultProperties, values, "clearable"); - hidePropertyIn(defaultProperties, values, "emptyOptionCaption"); } else { + // when it is not filterable, we hide the caption for input as input is never shown hidePropertyIn(defaultProperties, values, "filterInputPlaceholderCaption"); } diff --git a/packages/pluggableWidgets/datagrid-dropdown-filter-web/src/package.xml b/packages/pluggableWidgets/datagrid-dropdown-filter-web/src/package.xml index d21eb82bd3..f7ffc2f547 100644 --- a/packages/pluggableWidgets/datagrid-dropdown-filter-web/src/package.xml +++ b/packages/pluggableWidgets/datagrid-dropdown-filter-web/src/package.xml @@ -1,6 +1,6 @@ - + diff --git a/packages/shared/widget-plugin-filtering/src/controls/base/OptionsWrapper.tsx b/packages/shared/widget-plugin-filtering/src/controls/base/OptionsWrapper.tsx index 26fe265806..82af55dd3e 100644 --- a/packages/shared/widget-plugin-filtering/src/controls/base/OptionsWrapper.tsx +++ b/packages/shared/widget-plugin-filtering/src/controls/base/OptionsWrapper.tsx @@ -1,18 +1,10 @@ import { UseComboboxPropGetters, UseSelectPropGetters } from "downshift"; import { createElement, CSSProperties, forwardRef, ReactElement, RefObject } from "react"; import { OptionWithState } from "../../typings/OptionWithState"; - -type OptionsWrapperClassNamesProps = { - popover?: string; - menuSlot?: string; - menu?: string; - menuItem?: string; - checkboxSlot?: string; - checkbox?: string; -}; +import { PickerCssClasses } from "../picker-primitives"; type OptionsWrapperProps = { - cls: OptionsWrapperClassNamesProps; + cls: PickerCssClasses; style: CSSProperties; onMenuScroll?: React.UIEventHandler; isOpen: boolean; @@ -51,6 +43,7 @@ export const OptionsWrapper = forwardRef((props: OptionsWrapperProps, ref: RefOb data-highlighted={highlightedIndex === index || undefined} key={item.value || index} className={cls.menuItem} + title={item.caption} {...getItemProps({ item, index, @@ -73,7 +66,7 @@ export const OptionsWrapper = forwardRef((props: OptionsWrapperProps, ref: RefOb /> )} - {item.caption || "\u00A0"} + {item.caption || "\u00A0"} ))} diff --git a/packages/shared/widget-plugin-filtering/src/controls/picker-primitives.tsx b/packages/shared/widget-plugin-filtering/src/controls/picker-primitives.tsx index f98d25dd54..4d5ec5ff56 100644 --- a/packages/shared/widget-plugin-filtering/src/controls/picker-primitives.tsx +++ b/packages/shared/widget-plugin-filtering/src/controls/picker-primitives.tsx @@ -8,6 +8,7 @@ type ClassKeys = | "menu" | "menuSlot" | "menuItem" + | "menuItemText" | "menuCheckbox" | "checkboxSlot" | "popover" @@ -19,7 +20,9 @@ type ClassKeys = | "separator" | "checkbox"; -export function classes(rootName = "widget-dropdown-filter"): Record { +export type PickerCssClasses = Record; + +export function classes(rootName = "widget-dropdown-filter"): PickerCssClasses { return { root: rootName, input: `${rootName}-input`, @@ -28,6 +31,7 @@ export function classes(rootName = "widget-dropdown-filter"): Record