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
1 answer

CommandBar Buttons Hover

I am using the CommandBar Component to display links. (The buttons are href links). I want to remove the underline from buttons when hover. Is it possible? enter image description…
Lirlev4
  • 3
  • 1
0
votes
1 answer

How to do Layout with Microsoft FAST controls

until now I have used Bootstrap for building my sites. I heard about Microsoft FAST web-controls, and I want to try it but there is no layout grid. How am I supposed to do layouting in MS FAST? I am no web designer, this is why I use bootstrap…
Luka
  • 4,075
  • 3
  • 35
  • 61
0
votes
1 answer

export error while bundling @fluentui/react with webpack

I am getting webpack 5.25.0 compiled with 7 warnings in 6734 ms with version 7.167.0 and with v8.10.1 I was getting 1513 they were all same and something like this, instead of createElement there will be another react function like useEffect, with…
mukuljainx
  • 716
  • 1
  • 6
  • 16
0
votes
1 answer

How to properly use Modal in Fluent UI

I am new to React and Fluent UI, I loaded all my files from CDNs, when I tried execute the following code, the modal didn't open. Please tell me what I am doing wrong here. I searched up examples but wasn't able to find one. Here is the code: …
Abaan Shanid
  • 422
  • 3
  • 15
0
votes
1 answer

How to use local svg files in NavItems in Fluent UI React

I was trying to use custom svg files in my nav bar but not able to render then. I'm using fluentui-react onLinkClick={onLinkClick} className="menuLinks" selectedKey={'quickStart'} …
pavan anand chinthalapudi
  • 586
  • 6
  • 12
0
votes
2 answers

Is there a way to limit the number of selectable items in Selection component of Office UI Fabric React's Details list?

Selection Component of fluent UI has a property to let the user select either single or multiple items. However, I don't see a straight-forward way to limit the user to select certain maximum number of items. Is there a way get this done? I have…
Sampath Kumar K
  • 61
  • 1
  • 3
0
votes
1 answer

Where to calculate groups for fluentui detaillist in nextjs

I am learning react, and given this simple example of using SWR to fetch some items from an API and showing the items with groups using fluentui DetailedList - I am running into a problem with the groups. Whenever I click a group in UI to…
Poul K. Sørensen
  • 16,950
  • 21
  • 126
  • 283
0
votes
2 answers

How to keep FluentUI SearchBox keep Icon as fixed?

I am using SearchBox in my application. On click of searchbox the icon is hidden. I am looking for way to have it always. Can't find relevant property in IconProps which I can leverage import React, { useRef } from 'react'; import { SearchBox }…
Jimit.Gandhi
  • 371
  • 4
  • 12
0
votes
2 answers

DetailsList is getting re-rendered and hence is loosing its state

So I have been trying to accomplish the idea that whenever the user clicks any row in the DetailsList the Button gets enabled and when the user clicks outside the selectionzone the Button gets disabled. This is my code import { DetailsList,…
Ceroy
  • 181
  • 2
  • 11
0
votes
1 answer

Embed Web Page with Fluent UI Northstar

I am trying to use the Embed component in Fluent UI Northstar to embed a SharePoint Web Page:
Christophe
  • 27,383
  • 28
  • 97
  • 140
0
votes
1 answer

How to display percentage of progress completion in progress bar using fabric UI?

I'm using fluent UI to display progress bar. Link which I refered: https://developer.microsoft.com/en-us/fluentui#/controls/web/progressindicator I'm facing difficulty in displaying percentage in progress bar using react. Can someone suggest on…
sss
  • 251
  • 5
  • 18
0
votes
1 answer

How to center button in Fluent UI Dialog component?

Dialog component in Fluent UI has DialogFooter. I want to place a button inside that footer and I want it to be in the center. How can that be achieved? I'm unable to move it from its default location. Sample code (taken from [official…
Alcibiades
  • 335
  • 5
  • 16
0
votes
1 answer

Close button not having "X" in Fluent UI

I'm trying to create a TeachingBubble using Fluent UI. I want it to have close button, marked with "x". I'd like to have a closing button like in this example: How can that be done in react, using Fluent UI? My current code: import { TeachingBubble…
Alcibiades
  • 335
  • 5
  • 16
0
votes
2 answers

Why is the component fully re-rendering when updating a single state through context?

I have created a page which has two columns: In one column the idea is to display a list of items On the other column, I should show some info related to the selected item The code I have so far is: import { INavLink, INavLinkGroup, INavStyles,…
Andry
  • 16,172
  • 27
  • 138
  • 246
0
votes
1 answer

Unable to get the selected value from the React fluent UI dropdown

I am trying to do something extremely simple, something that in JS I can do in a fraction of a second, but that for some reason is not working in the React I am trying to change the dropdown value and capture the target element in the event, so I…
James
  • 1,081
  • 4
  • 15
  • 34
1 2 3
…
25 26