Stack Overflow
Stack Overflow

Questions tagged [fluent-ui]

Fluent UI is set of cross platform UI libraries from Microsoft. A collection of UX frameworks for creating beautiful, cross-platform apps that share code, design, and interaction behavior. Build for one platform or for all. Everything you need is here. Components for React, Web Components (Typescript and Blazor), Windows, iOS, Android, macOS and Cross-platform

Fluent UI is a collection of UX frameworks for creating, cross-platform apps that share code, design, and interaction behavior.

Build for one platform or for all. Everything you need is here.

Components for React, Web Components (Typescript and Blazor), Windows, iOS, Android, macOS and Cross-platform

386 questions
0
votes
0 answers

Modal opens up scrolled down to the nearest button

I am developing app for Microsoft Teams using React and FluentUI. Problem is modal opens up scrolled down to the buttons. I fixed it by creating "X" close button in the top, however it is a walk-around. Styling of position does not seem to be a…
markko
  • 1
  • 1
0
votes
1 answer

AutomaticKeepAliveClientMixin with Fluent UI's NavigationView not working

Im currently creating my first Desktop App: NavigationView NavigationPane PaneItem(Downloads) Paneitem(Settings) The pane items are individual Stateful Widgets in classes, they are ScaffoldPages to be specific. I want to keep the state of…
pedrek
  • 69
  • 1
  • 5
0
votes
0 answers

Filtering menu items inside the Fluent UI command bar causes the command bar to re-render and close the menu

I'm trying to add a custom menu with a search box to filter menu items to a command bar. and as soon as I change the menu items the command bar re-renders and ends up closing the menu. Is there to programmatically open a command bar menu? CommandBar…
Ahmed Attia
  • 3
  • 3
0
votes
1 answer

FluentUI Web Components Select with Blazor - Select Enum values

https://learn.microsoft.com/en-us/fluent-ui/web-components/components/select?pivots=blazor https://github.com/microsoft/fast-blazor/blob/main/examples/FluentUI.Demo.Shared/Pages/SelectPage.razor https://brave-cliff-0c0c93310.azurestaticapps.net/Selec…
Ogglas
  • 62,132
  • 37
  • 328
  • 418
0
votes
1 answer

Change the color of asterisk symbol for required Input Fields and FormDropdown in Fluent UI Components

I am using FluentUI components for developing Teams App. And have a form where I need to mark some Input and FormDropdown fields as required. On adding required flag, the required fields sign (*) comes up beside the field label in default i.e black…
Naina
  • 63
  • 6
0
votes
2 answers

Spreading return value of lamda function as props

I know my title is quite weird. but allow me explain this first. const alter = (currentFloor: number) => { if (overallState.startFloor === '' || overallState.endFloor === '') return {} if ( …
SpookyJelly
  • 105
  • 10
0
votes
1 answer

How to place stack item at custom position in horizontal alignment in fluent ui

I want to place one stack item to the end and two stack items to the start in horizontally aligned stacks. I want to move the stack with the x icon to be at the end. This is the code snippet I used
Saurav Likhar
  • 31
  • 8
0
votes
1 answer

Add icon to DetailsList in fluent UI React

I am trying to add icon to my DetailsList. this is my code. But its nothing visible. I need to add recycle Bin Icon here. Now i just added sample icon. But not visible anything. { key: "BinIcon", fieldName: "delete", minWidth: 16, maxWidth:…
AlexDemo
  • 141
  • 3
  • 14
0
votes
1 answer

How to group items in a DetailsList using Fluent UI

I'm attempting to group items in a DetailsList using Fluent UI controls. The example they give is this for the grouping: const groups = [ { key: 'groupred0', name: 'Color: "red"', startIndex: 0, count: 2, level: 0 }, { key:…
NightTom
  • 418
  • 15
  • 37
0
votes
1 answer

Is it possible to queue function calls in react?

I'm having a page with a textbox on (Textfield from fluent UI). I want to update a server stored value every time the user changes the text. I do not want the user to click a separate 'Save' button since that will interfer with the workflow on the…
Joakim
  • 114
  • 1
  • 7
0
votes
2 answers

How to populate dropdown options dynamically using a promise

import { getCustomer } from './Customers'; let optionItems=[]; export const LOV: React.FunctionComponent = () => { const loadCustomer = async () => { const data = await getCustomer(); for (var i=0; i < data.value.length ; ++i) { …
Intern
  • 51
  • 7
0
votes
1 answer

How to show dropdown options in fluent UI breadcrumbs

i wanted to show dropdown in fluent ui breadcrumbs help on building the code. please refer below image Reference image copied from azure devops
Alien 'D' mars
  • 1
  • 3
0
votes
1 answer

Fluent UI Checkbox - How to NOT show check mark on hover

I am trying to use the Checkbox from https://developer.microsoft.com/en-us/fluentui#/controls/web/checkbox. By default, it will show the check mark when I hover on the checkbox (please see below), whereas I don't want to show that check mark on…
flyingbee
  • 601
  • 1
  • 7
  • 17
0
votes
0 answers

How to display hierarchical data structure with selectable Fluent UI DetailsList?

I have a nested data structure that looks like the following snippet: [ { id: "item1", children: [ { id: "item1child1", children: [] }, { id: "item1child2", children: [] } ] }, …
wahoowa
  • 358
  • 1
  • 10
1 2 3
…
25 26