office-ui-fabric-react (now called Fluent UI) is a component library created by Microsoft for use with React.
Questions tagged [office-ui-fabric-react]
109 questions
0
votes
1 answer
Component does not rerender in react when changing tab item
I would make a dynamic tabs chat using fluent ui for react.
Actually I'm showing content using a conditional switch that return chat content depending on tab item clicked.
Here's the switch condition
let switchTasks = (type, data) => {
switch…
infodev
- 4,673
- 17
- 65
- 138
0
votes
2 answers
Chat scroll to bottom when send a message using React
I would like that chat window scrolls down when I send a text.
Actually messages sent don't trigger the scroll, so they are hidden.
Here's an example ( I'm using the chat component of MS Fluent UI for React library )
I have found this post but I'm…
infodev
- 4,673
- 17
- 65
- 138
0
votes
1 answer
How do I integrate Office Fluent UI React into a Blazor WebAssembly?
I'm interested in using the controls in OfficeUI /Fluent UI in a Blazor Webassembly project.
How can I add these items, ideally so that I don't have a dependency on a server runtime (and can use Azure Blobs) to host a website.
CMEdge
- 103
- 11
0
votes
1 answer
read the Form component from @fluentui/react-northstar@0.48.0
There is a nice looking schema-based Form component on fluentui
import React from 'react';
import { Form, Button } from '@fluentui/react-northstar';
const fields = [
{
label: 'First name',
name: 'firstName',
id:…
WouldBeNerd
- 629
- 11
- 29
0
votes
1 answer
Office UI Fabric: ScrollablePane's Position is not being reset to the initial position when details list is updated
Replication Steps:
https://developer.microsoft.com/en-us/fluentui#/controls/web/scrollablepane
In the 'DetailsList Locked Header' scroll down to a non zero position exceeding the first page and enter 'sed' in the 'filter by name'. This updates the…
gottacodeemall
- 83
- 1
- 9
0
votes
2 answers
How to make select all checkbox always visible in office-ui-fabric-react DetailsList
I am using the DetailsList component of office-ui-fabric-react to display my table. I am setting the prop
checkboxVisibility={CheckboxVisibility.always}
to make the checkboxes visible always. But this is not working for the select all checkbox…
LJP
- 1,811
- 4
- 23
- 34
0
votes
1 answer
Office Fluent UI / Fabric UI Modal - how can I control where it appears?
I'm currently using the MS Fluent UI controls (formerly known as Office Fabric UI | https://developer.microsoft.com/en-us/fluentui#/controls/web) and I'm getting stuck with the 'Modal' control.
I am triggering a Modal dialog control as the onClick…
Martin Hatch
- 279
- 2
- 16
0
votes
1 answer
get a list of iconNames from office UI fabric
How can i get a list of valid IconNames from office UI fabric. I am trying to create an icon Picker for an spfx webpart. I've tried importin IconNames from @uiFabric/icons :
import{IconNames} from "@uifabric/icons"
but i get an error : const enum…
RussGove
- 322
- 5
- 18
0
votes
1 answer
theme set via Customizations component does not match getTheme() theme
I apply themes from @uifabric/azure-themes or @uifabric/theme-samples via the Customization component.
However, once I change the theme, I noticed that the theme colors set by the Customization component do not match those retrieved from…
user1763729
- 167
- 1
- 11
0
votes
1 answer
Wrap text of Office UI Fabric DetailsRow
I am trying to get my text to wrap around and display in multiple lines in Office UI Fabric's DetailsRow. At the moment some of my rows that have long text go off the screen, and I would like them to wrap around so the user does not have to scroll…
nsharma98
- 223
- 2
- 14
0
votes
1 answer
What is the best way to create a dynamically growing Stack Item in Fabric React?
I have a use case where I have a sidepanel containing Searchbox, Some MessageBoxes and two lists which get filtered when user searches for something.
The searchbox and messagebox occupies the fixed height but I want both the lists to occupy equal…
Ashit Vora
- 2,902
- 2
- 27
- 39
0
votes
1 answer
How to use DragDropHelper from fluentUI / office-ui-fabric?
FluentUI (aka office-ui-fabric) has a helper class named DragDropHelper. Unfortunately there isn't any documentation, and I don't really understand how I'm expected to use it.
A short example would be appreciated.
dgellow
- 692
- 1
- 11
- 18
0
votes
1 answer
Office Fabric Basic List - how to bind button in rows to function?
I am trying to do a button on each row in an Office UI Fabric React Basic List. The button will basically call a function with the item id. The code is like this
- 21
- 5
Charlie C
0
votes
1 answer
Get value of input controls which were created dynamically
In my React TypeScript project, I am dynamically creating multiple input controls like TextField, DatePicker, Checkbox, ComboBox etc... in a form like UI. On click on Submit, I want to get the value of each of the input controls. What's an effective…
Putta
- 67
- 7
0
votes
1 answer
Office UI Fabric React - Combobox auto open when freeform==true
Hello I have found that ComboBox component is not opening automaticaly when clicking inside the field when 'freeform' option is enabled - I understand that is by design but is there a way to force it to open even if freeform is enabled - this is my…
Piotr Smyda
- 177
- 1
- 15