[ViewSettingsDialog] Display radio buttons in FilterItem

[martpet]

Hi,

How would you show radio buttons, instead of checkboxes, inside FilterItem?

<FilterItem
  text="Time"
  values={
    <>
      <FilterItemOption text="Last 7 Days" />
      <FilterItemOption text="Last 30 Days" />
    </>
  }
/>

[Lukas742]

Hi @martpet

There's no radio mode in FilterItemOption, but you can use the customTabs slot on ViewSettingsDialog to avoid building everything from scratch:

import {
  ViewSettingsDialog,
  ViewSettingsDialogCustomTab,
  RadioButton
} from '@ui5/webcomponents-react';

<ViewSettingsDialog
  customTabs={
    <ViewSettingsDialogCustomTab text="Time">
      <RadioButton name="time" text="Last 7 Days" />
      <RadioButton name="time" text="Last 30 Days" />
    </ViewSettingsDialogCustomTab>
  }
/>

You keep the ViewSettingsDialog shell but manage the selected state yourself, it won't appear in the built-in filters payload of onConfirm.

If native radio support in FilterItem matters to you, consider filing a Feature Request in the UI5 Web Components repo (as the component is maintained there) suggesting a selectionMode prop (Single/Multiple) on FilterItem for example.