Stack Overflow
Stack Overflow

Questions tagged [fluentui-react]

Fluent UI react or web represents a collection of utilities, React components, and web components for building web applications. A collection of UX frameworks for creating beautiful, cross-platform apps that share code, design, and interaction behavior. Home: https://developer.microsoft.com/en-us/fluentui#/ Source: https://github.com/microsoft/fluent-ui-react

Fluent UI react or web represents a collection of utilities, React components, and web components for building web applications. A collection of UX frameworks for creating beautiful, cross-platform apps that share code, design, and interaction behavior.

Home: https://developer.microsoft.com/en-us/fluentui#/ Source: https://github.com/microsoft/fluent-ui-react

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

Localization in Fluent UI component properties with i18n

I am trying Localize Fluent UI component by i18n solution using Typescript and React. But I stuggle with changing name in property.. i18n is implemented according to documentation using hooks (in common component it works well) but I am unable to…
Michal
  • 27
  • 6
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

Custom table filtering for MSTeams using fluentui/northstar

I am developing a custom tab for the MS Teams using the fluentui/react-northstar v0.51.4 I have a requirement to have a table with the capability of Sorting, Filtering, and Paging the table. I am not able to find any of the details for the same. If…
Sigar Dave
  • 2,598
  • 1
  • 20
  • 42
0
votes
2 answers

how to indicate loaging/searching on Office FabricUI TagPicker for large data sets?

I am using the TagPicker to get data dynamically and present a set of the results that matches with the term. The issue is that looking into the docs there is not clear indication how to determine that the component data is loading or searching. The…
Ricardo Silva
  • 1,221
  • 9
  • 19
0
votes
1 answer

How to style new @fluentui/react-button [v8 beta]?

Is there any documentation on how to apply style customisations to the new Button? The styling using the IButtonStyles interface is broken on the new button, as per code below. import { PrimaryButton } from '@fluentui/react'; import { Button as…
David Min
  • 1,246
  • 8
  • 27
0
votes
1 answer

Building a dashboard with fluent-ui in React and the cards and table appear at bottom of screen when they're not supposed to

I am following a tutorial to build a dashboard using fluentui in React, and am going to customise it and change it afterwards. However I have followed the tutorial exactly and got no errors but for some reason the cards and table appear at bottom of…
MicSt
  • 177
  • 2
  • 21
0
votes
1 answer

Update default value in React component

I would like to set a default value on an Input from a value stored in redux. I saw in this post that defaultValue is only for first rendering. So I tried to use instead value then the problem is that I'm not getting able to change it's…
infodev
  • 4,673
  • 17
  • 65
  • 138
0
votes
0 answers

calling loadTheme from a .ts file

I one of my "office-ui-fabric-react" project, I am writing a utility class(common.ts) where I have a function to load theme for a page. This utility class will be included as part of the script tag in an html file as common.js. I want to call…
Ekalavya
  • 39
  • 2
0
votes
2 answers

DetailsList Component with custom scrollbar

At the following link is the basic implementation of DetailsList with Sticky (fixed header). What I'm trying to achieve is to replace default scrollbar with custom scrollbar and to keep the same functionality/behavior. After implementation of custom…
Marko Savic
  • 2,159
  • 2
  • 14
  • 27
0
votes
0 answers

Display data in two columns with UI Fabric React

I would like to display data dynamically in 2 columns with UI Fabric React. For example I want to have 2 columns one for teachers and one for students, and each time I want to add an entry to one of these columns dynamically with code. These 2…
B1B
  • 193
  • 5
  • 16
0
votes
1 answer

Apply colors to labels with specific sizes - FluentUI

I am reading through the docs for UI Fabric React, and I can see that we have these classes to apply font sizes to our labels: https://learn.microsoft.com/en-us/office/dev/add-ins/design/add-in-typography .. I liked the size of the "Subtitle" and…
B1B
  • 193
  • 5
  • 16
0
votes
1 answer

how can we automatically add commas to numbers being typed in SPFx react fluent textfield. ex: 1,000,000,000

public onChangeBudget = (value: string) => { console.log("Budget : " + value); console.log(value.replace(/\B(?=(\d{3})+(?!\d))/g, ',')); let abc =…
Sunny Sinha
  • 21
  • 3
0
votes
1 answer

How to set dynamic options from API response in fluent ui react Dropdown control?

I have encountered a situation where I need to display a Dropdown and want the options to dynamically fetch from an API and load on clicking the caret (maybe show a loader by the time the API response comes through). The experience I am looking for…
Kaustabh Kakoty
  • 87
  • 3
  • 15
0
votes
1 answer

Change the exit button style on Fluent UI's Panel

I'm using Panel from 'office-ui-fabric-react/lib/Panel' in React. This Panel generates a little [x] button on the upper right hand corner. It is very hard to see, is there any way to change its default background color to red & modify its mouse…
Raven
  • 529
  • 7
  • 27
1 2 3
…
20
21