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

Which npm package to use Fluent UI in Vue.js: @fluentui/web-components or @microsoft/fast-components?

As far as I understand, @fluentui/web-components depends on @microsoft/fast-components: The @fluentui/web-components library are web components built on top of Microsoft's web component and design system foundation, FAST. The Fluent UI Web…
OneWorld
  • 17,512
  • 21
  • 86
  • 136
0
votes
0 answers

Add icon for group Header in GoupList of Fluent UI

I am using the GroupList and wanted to show the icon as a prefix to the header. just like the UI shown below. I am not able to add the icon as a prefix to the header. how to achieve this
Ramusesan
  • 854
  • 2
  • 11
  • 32
0
votes
0 answers

Fluent UI Combobox [mobile] focuses on option selection and launches mobile keyboard

So for a Fluent UI Combobox, on a mobile phone, after the dropdown is clicked and the menu expands, when a selection itself is made, the combobox looks to be refocused and the mobile keyboard expands with a blinking cursor. The keyboard should not…
Danny Byrne
  • 1
  • 1
0
votes
1 answer

How to add the Search to CommandBar (MS Fluent UI)?

How to add a SearchBox to a CommandBar? I would like to achieve something like this : I use this Fluent UI CommandBar CodePen here const _items: ICommandBarItemProps[] = [ { key: 'newItem', text: 'New', iconProps: { iconName:…
serge
  • 13,940
  • 35
  • 121
  • 205
0
votes
1 answer

How do I change the Icon of IconButton.shinyInput in R?

I'd like my Icon to be "InfoSolid" There isn't a lot of documentation about this. Cheers!
DJ Freeman
  • 399
  • 2
  • 14
0
votes
0 answers

Adding Datepicker as an option for dropdowns using Fluent UI

I'm working with dropdowns extensively, and I'd like to add Datepickers to get date range from the users along with other options in the dropdown, and would like them as two options in the dropdown. I'm using fluent UI. Any references, links or…
Ayush Singh
  • 1
0
votes
2 answers

Get the key of the clicked fluent ui button menu

Once again I have the confirmation the Microsoft documentation, is really poorly auto-generated with a useless content. I have a Fluent UI, Splitbutton. Here are the poorly generated docs. And there are two options "Email message" and "Calendar…
serge
  • 13,940
  • 35
  • 121
  • 205
0
votes
0 answers

Fluent UI TagPicker How add the resultsFooter in the pickersuggestionprops

Trying to get the Footer option in the TagPicker, but it does not seems to work, how to get the Footer in TagPicker const pickerSuggestionsProps = { suggestionsHeaderText: "suggestedResults", noResultsFoundText:"resultsNotfound", …
umgolla
  • 39
  • 8
0
votes
0 answers

React Fluent Combobox with full-text suggestions

Is there a way to make the fluent combobox to propose search suggestions in the Contains mode, (searching the options full text), not only the StartWith (searches only the beginning of options text) as it seem to work in the doc samples?
serge
  • 13,940
  • 35
  • 121
  • 205
0
votes
0 answers

When having two buttons in TooltipHost, one is clickable and as soon as I try to click on the other one the tooltip closes itself

import { DefaultButton } from '@fluentui/react/lib/Button'; import { TooltipHost, ITooltipHostStyles } from '@fluentui/react/lib/Tooltip'; import { useId } from '@fluentui/react-hooks'; const calloutProps = { gapSpace: 0 }; // The TooltipHost root…
Isidora Bojovic
  • 1
  • 1
0
votes
0 answers

Turn off Fluent UI scorllable Pane when printing

I'm wondering if there is a native way to turn off the Fluent UI Scrollable Pane https://developer.microsoft.com/en-us/fluentui#/controls/web/scrollablepane when you print. I have a detailslist that is enclosed in a scrollable pane which works…
Phil
  • 1,852
  • 2
  • 28
  • 55
0
votes
1 answer

Error in makePage: unused argument (alist(div(HorizontalStack(makeCard(NULL, firstcard, size = 4, style = "max-height: 320px"))), ))

So I get this error and don't know how to solve this: simsettings.R: source("helperfunctions.R") time_hours <- seq.int(0, 23) time_minutes <- seq.int(0, 59) bg_values <- seq.int(30, 200) firstcard <- Stack( tokens = list(childrenGap = 10), …
DJ Freeman
  • 399
  • 2
  • 14
0
votes
1 answer

Is it possible to change backgroundColor of selectedItem on hover in Fluent UI?

I have a dropdown component from Fluent UI. There is a default style for selected item. I can change this style, but I couldn't change color and backgroundColor of selected item when I hover on it. Is it possible to give a custom style when I hover…
Ozan Bilgiç
  • 215
  • 1
  • 9
0
votes
2 answers

React dynamic state for input elements

Parent: (The TextField component is a styled input element from office-ui-fabric-react: Link) Searchbar component: export default class Searchbar…
Grobanix
  • 139
  • 1
  • 3
  • 12
0
votes
0 answers

How to prevent focus for canRevealPassword on Fluent UI?

I have a login page. I am using the Fluent UI TextField component. After I press Tab, I want to focus Login button -which is under Password TextField-, but this component focuses canRevealPassword icon instead of the login button. Is there a way to…
Ozan Bilgiç
  • 215
  • 1
  • 9
1 2 3
…
25 26