Fluent UI web represents a collection of utilities, React components, and web components for building web applications.

Overview

Fluent UI Web

Build Status GitHub contributors GitHub top language Twitter Follow

Fluent UI web represents a collection of utilities, React components, and web components for building web applications.

This repo is home to 3 separate projects today. Mixing components between projects is not currently supported. The goal of these projects is to dedupe functionality and enable interoperability over time. For now, choose the project that best suits your needs.

The following table will help you navigate the 3 projects and understand their differences.

React React Northstar Web Components
Overview Mature, refreshing with new concepts from react-northstar. Newer, has concepts we're iterating on. Web Component implementation of Fluent UI.
Used By Office Teams Edge
Read Me README.md README.md README.md
Repo ./packages/react ./packages/fluentui/react-northstar ./packages/web-components
Quick Start Quick Start Quick Start See README.md
Docs aka.ms/fluentui-react aka.ms/fluentui-react-northstar aka.ms/fluentui-web-components
NPM @fluentui/react @fluentui/react-northstar @fluentui/web-components
Version npm version npm version npm version
Issues Fluent UI React GitHub Issues Fluent UI React Northstar GitHub Issues Fluent UI Web Components GitHub Issues

Why are there two React versions? See the FAQ on Fabric and Stardust.

Licenses

All files on the Fluent UI React GitHub repository are subject to the MIT license. Please read the License file at the root of the project.

Usage of the fonts and icons referenced in Fluent UI React is subject to the terms of the assets license agreement.

Changelog

We use GitHub Releases to manage our releases, including the changelog between every release. View a complete list of additions, fixes, and changes on the releases page.

Looking for Office UI Fabric React?

The Office UI Fabric React project has evolved to Fluent UI.

The office-ui-fabric-react repo is now this repo (fluentui in the Microsoft organization)! The name change should not disrupt any current Fabric usage, repo clones, pull requests or issue reporting. Links should redirect to the new location. The library formerly known as office-ui-fabric-react is now available as @fluentui/react (see above table for more information).

We have a lot in store for Fluent UI - Read our announcement here.


This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact [email protected] with any additional questions or comments.

Issues
  • Upgrade to ts 4.0

    Upgrade to ts 4.0

    • Update change files for consistency
    • Fix some pr comments
    • fix merge
    • Change files
    • Add change files
    • update api
    • fix api-extractor warnings

    Pull request checklist

    • [ ] Addresses an existing issue: fixes #16101
    • [ ] Include a change request file using $ yarn change

    Description of changes

    (give an overview)

    Focus areas to test

    (optional)

    Area: Typescript PR: API Modified 
    opened by jdhuntington 78
  • fix(eslint-plugin): properly resolve configs for projects that use so…

    fix(eslint-plugin): properly resolve configs for projects that use so…

    …lution kind of TS config

    Pull request checklist

    • ~[ ] Addresses an existing issue: Fixes #0000~
    • [x] Include a change request file using $ yarn change

    Description of changes

    Before:

    • with current setup linting was not working in editors within /tools project
    • while debugging I found out our dynamic config provided invalid paths for file property (double slash etc)

    After:

    • linting now works consistently within /tools project from CLI and Editor
    • files are properly normalized

    Focus areas to test

    (optional)

    opened by Hotell 76
  • chore: migrate packages to single version policy

    chore: migrate packages to single version policy

    Pull request checklist

    • ~[ ] Addresses an existing issue:~
    • [x] Include a change request file using $ yarn change

    Description of changes

    (give an overview)

    Focus areas to test

    (optional)

    Area: Build System dependencies 
    opened by Hotell 75
  • fix(react-tooltip): use useIsomorphicLayoutEffect to avoid SSR warnings

    fix(react-tooltip): use useIsomorphicLayoutEffect to avoid SSR warnings

    Pull request checklist

    • [x] Addresses an existing issue: Fixes #17891
    • [x] Include a change request file using $ yarn change

    Description of changes

    This PR replaces React.useLayoutEffect with useIsomorphicLayoutEffect as it produces warnings during SSR. Also modifies ESLint preset to prevent future usages. Warnings in existing places of v8 code have been suppressed.

    See more details: https://medium.com/@alexandereardon/uselayouteffect-and-ssr-192986cdcf7a

    opened by layershifter 72
  • Enable the exhaustive-deps lint rule for useIsomorphicLayoutEffect

    Enable the exhaustive-deps lint rule for useIsomorphicLayoutEffect

    Pull request checklist

    • [x] Include a change request file using $ yarn change

    Description of changes

    Enable the react-hooks/exhaustive-deps lint rule for useIsomorphicLayoutEffect. Also disable the rule in the one place that it caused a failure.

    opened by behowell 72
  • Update eslint deps for compatibility with new TS version

    Update eslint deps for compatibility with new TS version

    Pull request checklist

    • [x] Addresses an existing issue: part of #18025
    • [x] Include a change request file using $ yarn change

    Description of changes

    Update eslint-related dependencies to be compatible with TS 4.1, including proper parsing for import type/export type.

    After this change, it will probably be necessary for everyone to delete their local eslint caches (yarn rimraf '{apps,packages}/*/.eslintcache' or similar) to avoid some weird false positives.

    Thanks to one or more of the updated deps (hard to say which), usage of React components is now flagged! :tada: However, this meant that a bunch more rule disables had to be added, mainly for usage of Fabric and Customizer. Where it made sense and was clearly safe, I went ahead and changed these to use ThemeProvider, but in other cases I just disabled the rule.

    There are also a few other interesting changes that I'll comment on inline.

    Related references:

    Area: Build System PR: API Modified 
    opened by ecraig12345 69
  • @fluentui/react-tooltip: warning about useLayoutEffect in SSR

    @fluentui/react-tooltip: warning about useLayoutEffect in SSR

    Actual behavior:

    Warning: useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, u
    seLayoutEffect should only be used in components that render exclusively on the client. See https://reactjs.org/link/uselayouteffect-ssr for common fixes.
        at TooltipProvider (@fluentui\react-tooltip\lib-commonjs\components\TooltipProvider\TooltipProvider.js:12:38)
        at div
        at ThemeProvider (@fluentui\react-theme-provider\lib-commonjs\components\ThemeProvider\ThemeProvider.js:8:36)
    

    Priorities and help requested:

    Are you willing to submit a PR to fix? Yes Requested priority: Normal Products/sites affected: (if applicable)

    Type: Bug :bug: Status: Fixed Area: SSR 
    opened by layershifter 69
  • Release version 8

    Release version 8

    Pull request checklist

    • [x] Addresses an existing issue: Part of #14692
    • [x] Include a change request file using $ yarn change

    Description of changes

    Change all version 8-related packages to non-beta versions as the final step of the major release.

    Change the repo default beachball config back to:

      disallowedChangeTypes: ['major', 'prerelease'],
      tag: 'latest',
    

    As a result of this change, most pre-release package beachball configs must be updated to maintain current versions. (Some of the current versions violate the 9.0.0-alpha convention we discussed last week, but that can be fixed separately.)

    Open questions

    • react-shared-contexts: currently at 1-beta and used by both v8 (ContextualMenu) and react-button--what to do? (PR currently adds special beachball config to keep as-is)

    Deleted package

    Due to changes in plans I don't think we need this. We can bring it back later if needed.

    • ie11-polyfills

    v8-related packages bumped to major < 8

    These packages were previously on N-beta where N > 0 and < 8. To go with prior convention I just removed the -beta suffix and kept the major version.

    • common-styles: 1
    • dom-utilities: 2
    • eslint-plugin: 1
    • monaco-editor: 1
    • react-charting: 5
    • react-icons-mdl2: 1
    • react-icons-mdl2-branded: 1
    • react-icon-provider: 1 (was previously 0.x, agreed to bump to 1)
    • react-monaco-editor: 1
    • react-window-provider: 2
    • theme: 2

    Bumped to version 8

    • api-docs
    • azure-themes
    • codemods (changed from 1 b/c seems like this should match suite version)
    • date-time-utilities
    • example-data
    • font-icons-mdl2
    • foundation-legacy
    • jest-serializer-merge-styles
    • merge-styles
    • public-docsite
    • public-docsite-resources
    • react
    • react-date-time
    • react-docsite-components
    • react-examples
    • react-experiments
    • react-file-type-icons
    • react-focus
    • react-hooks
    • scheme-utilities
    • set-version
    • style-utilities
    • test-utilities
    • theme-samples
    • utilities
    • webpack-utilities

    Everything else

    I updated other packages' beachball configs to keep their current versioning approach, so the only changes should be standard prerelease or patch bumps due to dep version updates.

    v8 release: regression or todo 
    opened by ecraig12345 68
  • Add and use shared package for website setup

    Add and use shared package for website setup

    Pull request checklist

    • [x] Addresses an existing issue: Part of #14691
    • [x] Include a change request file using $ yarn change

    Description of changes

    Best viewed with "ignore whitespace changes" (for a couple of the files)

    Previously, several pieces of setup code for the public website (developer.microsoft.com/fluentui) and its local/PR deployed versions had to be duplicated across every major version branch of Fluent/Fabric. This was not ideal since the process of making updates (such as adding a new major version) was very manual and error-prone.

    This PR adds and uses a new package @fluentui/public-docsite-setup (open to naming suggestions) to de-duplicate website setup tasks, including:

    • Loading the real site (developer.microsoft.com/fluentui): get the "manifest" file for the requested (or latest) major version, then load the current website build for that major version
    • Loading the local or PR deploy site
    • Setting up the version switcher definition (also provides related types)

    Build setup

    The build steps/configuration related to this change are as follows. (These build steps will also be added in the 5.0, 6.0, and 7.0 branches, using the @fluentui/public-docsite-setup package from master.)

    Some of this is also explained in the public-docsite-setup readme.

    | File/pipeline | What's called/done | Details | |--|--|--| | apps/public-docsite webpack configs | getLoadSiteConfig() from under @fluentui/public-docsite-setup/scripts/ | Adds a webpack config that generates dist/loadSite.js (for actual loading) and copies shared index.html to website's dist folder | | Release pipeline azure-pipelines.release.yml | yarn create-site-manifests [main package path] [CDN URL root] (script is from @fluentui/public-docsite-setup's bin) | Generates "manifest" files (under site-manifests/v8-prod.js and v8-df.js) with:
    - the URL where files from that build will be uploaded
    - the full version of @fluentui/react | | Release pipeline azure-pipelines.release.yml | "Publish artifact: fabric-website-manifests" task | Uploads the generated manifest files as a build artifact | | Website release pipeline (internal) | Upload manifest files to live location | |

    Additional manual step (as needed): since the live site actually uses bootstrap code stored in an internal repo, manually copy apps/public-docsite/homepage.htm and apps/public-docsite/dist/loadSite.js to the internal repo

    What happens at runtime

    At runtime, we start with the HTML file loading the loadSite.js bundle. (The bundle is generated by webpack from @fluentui/public-docsite-setup/src/loadSite.ts, using the getLoadSiteConfig() helper.)

    image

    The version switcher definition is read from the global by apps/public-docsite/src/SiteDefinition/SiteDefinition.tsx, and various places in the site consume it from there.

    Here's a text version with more detail.
    1. HTML file loads loadSite.js bundle (it's generated by webpack from @fluentui/public-docsite-setup/src/loadSite.ts using getLoadSiteConfig)
    2. loadSite.js does the actual loading:
      1. Check location.hostname to determine which variant of the site this is (localhost, PR deploy, prod, df)
      2. If localhost or PR deploy:
        1. Get the full version of @fluentui/react being demoed from process.env.LOCAL_LIBRARY_VERSION (set by webpack helper)
        2. Call loadSiteInternal with that version and using the current URL as the base URL for files from that website build
      3. If it's the real site (prod/df):
        1. Determine the major version to load: use ?fabricVer=N from URL, or default to latest
        2. Load the "manifest" file for that major version: vN-df.js or vN-prod.js
        3. Call loadSiteInternal with the base URL and full library version from the manifest
      4. In loadSiteInternal:
        1. Set up the version switcher definition global (basically a bunch of IContextualMenuItems with pre-defined click handlers for reloading with a new version)
          • Note: in localhost/PR deploy builds, the click handler just displays an alert saying you can't switch versions. This is to avoid previous issues where the site implicitly loaded the live files for other versions (or even the current version), making it seem like you're testing your changes when in fact you're not.
        2. Set up global MonacoConfig for the example editor
        3. Load the root file of the actual site (minified or unminified as appropriate) from the given base URL
    3. The site is loading!
    4. Actual version switcher setup: apps/public-docsite/src/SiteDefinition/SiteDefinition.tsx gets the version switcher definition from the global, and various places in the site consume it from there.

    Open questions

    As the PR is now, there's quite a mix of "fabric" or not in naming. Open for suggestions for what to do here. (Also okay with just going with it as-is.)

    | Thing | Name | Notes | |--|--|--| | Main website webpack bundle | fabric-site | A slight improvement over previous name fabric-sitev5. Could let this vary across branches, but it's easiest if we don't. | | Website-related artifacts in azure-pipelines.release.yml | fabric-website-whatever | Again easiest if these stay the same across branches. Inclined to leave as-is to reduce work updating the website release pipeline (and slightly reduce churn in old branches). | | Shared setup package | public-docsite-setup | Follows website naming convention from master. Will be used in other branches but that's probably fine. | | Shared bootstrap file | loadSite.ts/.js | | | Types from shared package | SiteConfig, SiteGlobals | | | Manifest creation script | create-site-manifests | | | Generated manifest files | site-manifests/vN-prod.js | | | Global defined by manifest files | __siteConfig | |

    Area: Website PR: API Modified 
    opened by ecraig12345 68
  • Cannot use different versions of office-ui-fabric-react together in Rush

    Cannot use different versions of office-ui-fabric-react together in Rush

    Environment Information

    • Package version(s): ^5.113.1, ^7.6.3, probably 6.x too.
    • Browser and OS versions: Windows

    Please provide a reproduction of the bug in a codepen:

    1. Not a codepen, but a git repo. Check out RushWithMultipleFabricVersions.
    2. Run rush install.
    3. Run rush build.

    Actual behavior:

    The build will fail with an error like:

    ERROR in C:\Users\hegi\source\repos\test-multiple-react\packages\test-15\src\index.tsx
    ./src/index.tsx
    [tsl] ERROR in C:\Users\hegi\source\repos\test-multiple-react\packages\test-15\src\index.tsx(8,5)
          TS2605: JSX element type 'PrimaryButton' is not a constructor function for JSX elements.
      Type 'PrimaryButton' is missing the following properties from type 'ElementClass': setState, forceUpdate, props, state, and 2 more.
    
    ERROR in C:\Users\hegi\source\repos\test-multiple-react\packages\test-15\src\index.tsx
    ./src/index.tsx
    [tsl] ERROR in C:\Users\hegi\source\repos\test-multiple-react\packages\test-15\src\index.tsx(8,5)
          TS2607: JSX element class does not support attributes because it does not have a 'props' property.
    

    Expected behavior:

    The build should succeed. If you open /rush.json and comment out one of the projects, either test-15 or test-16 then the build will succeed on the uncommented project.

    Priorities and help requested:

    I originally opened Issue 1351 on the Rush team, but @octogonz said it was an issue with phantom dependencies.

    Are you willing to submit a PR to fix? No.

    Requested priority: Normal

    Products/sites affected: Internal development is slower since we can't use rush for projects with multiple UI fabric versions.

    Type: Bug :bug: Area: Build System Status: Fixed 
    opened by HarryGifford 64
  • targetWidthProportion is not working in DetailsList column

    targetWidthProportion is not working in DetailsList column

    I have columns defined like below, however, the targetWidthProportion does not make any difference, Column2 still takes all the spaces, and Column3, Column4 are just displayed with the min-width. export const columns: IColumn [] = [ { key: '1', name: 'Column1', fieldName: 'Column1', minWidth: 200, maxWidth: 300, isResizable: true, isMultiline: true }, { key: '2', name: 'Column2', fieldName: 'Column2', minWidth: 200, targetWidthProportion: 1, isResizable: true }, { key: '3', name: 'Column3', fieldName: 'Column3', minWidth: 100, targetWidthProportion: 1, isResizable: true }, { key: '4', name: 'Column4', fieldName: 'Column4', minWidth: 300, targetWidthProportion: 3, isResizable: true } ];

    Needs: Triage :mag: 
    opened by GinniFang 0
  • Multiselect dropdown FastPass errors: elements with an Aria role that require children contain them, elements with an Aria role that require parent roles are contained by them

    Multiselect dropdown FastPass errors: elements with an Aria role that require children contain them, elements with an Aria role that require parent roles are contained by them

    • Package version(s): 8.37.0 and 7.177.2
    • Browser and OS versions: (fill this out if relevant)
    • Note - I see several other dropdown accessibility issues but not this exact one -- e.g, 19518

    Describe the issue:

    1. Activate the example for v7: Multi-select uncontrolled example here: https://fabricweb.z5.web.core.windows.net/oufr/7.177.2/#/examples/dropdown v8: Multi-select uncontrolled example here: https://fabricweb.z5.web.core.windows.net/oufr/8.37.0/#/examples/dropdown
    2. Run Fast Pass

    Actual behavior:

    Accessibility insights is failing with the following errors:

    • Certain ARIA roles must contain particular children
    • Certain ARIA roles must be contained by particular parents>

    Expected behavior:

    Fast pass passes

    If applicable, please provide a codepen repro:

    v7: Multi-select uncontrolled/controlled example here: https://fabricweb.z5.web.core.windows.net/oufr/7.177.2/#/examples/dropdown v8: Multi-select uncontrolled/controlled example here: https://fabricweb.z5.web.core.windows.net/oufr/8.37.0/#/examples/dropdown

    Priorities and help requested (not applicable if asking question):

    We are on v7 of Fluent so we are hoping to see a fix there, not just in v8

    Are you willing to submit a PR to fix? (Yes, No) Yes, or help cherry pick the fix back to v7 if necessary

    Requested priority: (Blocking, High, Normal, Low) High - Blocking grade C which is required for release in our organization

    Products/sites affected: (if applicable)

    Needs: Triage :mag: 
    opened by caratyler 0
  • Docs component description

    Docs component description

    Pull request checklist

    • [x] Addresses an existing issue: Fixes #20278
    • [x] Include a change request file using $ yarn change

    Rough first draft of this PR. Creating for feedback and staging build.

    Description of changes

    Simplify vNext component descriptions to create more consistent experience across Storybook

    Focus areas to test

    (optional)

    opened by micahgodbolt 4
  • Normalized vNext component description on default page

    Normalized vNext component description on default page

    null

    Status: In PR 
    opened by micahgodbolt 0
  • Tokens parameter not found on Stack in 8.37.0

    Tokens parameter not found on Stack in 8.37.0

    Environment Information

    • Package version(s): 8.37.0
    • Browser and OS versions: All

    Please provide a reproduction of the bug in a codepen:

    Actual behavior:

    Attempting to add the tokens parameter to a Stack component results in the following compile-time error: Property 'tokens' does not exist on type 'IntrinsicAttributes & IStackProps & { children?: ReactNode; }

    The error does not occur on version 8.36.5

    Expected behavior:

    The tokens parameter should still be available to the Stack component

    Priorities and help requested:

    Are you willing to submit a PR to fix? No

    Requested priority: High

    Products/sites affected: N/A

    Needs: Triage :mag: 
    opened by mkholt 0
  • Number localization for bar charts

    Number localization for bar charts

    Pull request checklist

    • [ ] Addresses an existing issue: Fixes #0000
    • [x] Include a change request file using $ yarn change

    Description of changes

    Previously Number was not localized as per culture. So now, culture prop added for charts, and according to that culture, chart numbers will be localized. If culture prop is not passed, then the number will be localized as per system language.

    Focus areas to test

    Stacked bar Chart, Multi Stacked bar chart, Horizontal bar chart, grouped vertical bar chart

    Before changes:

    image

    image

    After Changes: In these examples, I have used culture="pt-br" brazil, which uses Decimal mark as "," and Digit grouping separator as "." image

    image

    image

    Package: charting 
    opened by scharde 4
  • Autogenerated CSS class name conflicts

    Autogenerated CSS class name conflicts

    Environment Information

    • Package version(s): fluentui/react-northstar 0.57.0

    Please provide a reproduction of the bug in a codepen:

    https://codesandbox.io/s/infallible-roentgen-wiz4b

    Actual behavior:

    Fluent UI generated css class names conflict with some third party components like Fullcalendar. Fullcalendar itself is wrapped in a div with css class "fc" which sets "display" to "flex". Fluent UI also generates DOM elements with that css class which results in a broken layout for some Fluent UI components.

    As you can see in the example provided above, the selected item label in the Dropdown on the upper left side is not aligned properly because that component also uses an autogenerated "fc" class. In more complex layouts the problem gets worse, as you can see in the screen shot below:

    fc-fluent

    Expected behavior:

    Fluent UI should not use already defined css classes or provide a way to prefix all generated classes.

    Priorities and help requested:

    Are you willing to submit a PR to fix? (Yes, No)

    Requested priority: Normal

    Needs: Triage :mag: 
    opened by marc-steinert 0
  • chore(Link): Make documentation exportable to codesandbox

    chore(Link): Make documentation exportable to codesandbox

    Pull request checklist

    • [ ] Addresses an existing issue: Fixes #0000
    • [ ] Include a change request file using $ yarn change

    Description of changes

    Separataes the link stories so that each variant can be exported to codesandbox.

    Also creates a default story so that storybook controls are usabel.

    Focus areas to test

    (optional)

    Component: Link 
    opened by ling1726 4
  • Divider: Updating the component to the latest patterns

    Divider: Updating the component to the latest patterns

    Pull request checklist

    • [x] Addresses an existing issue: Fixes #19809, part of #20101
    • [x] Include a change request file using $ yarn change

    Description of changes

    This PR updates the Divider component to the latest set of patterns used in other converged components. The changes mainly happen in the useDividerStyles.ts file and include some small updates to adhere to the latest design spec as well.

    Component: Divider 
    opened by khmakoto 4
  • DetailsList can still be selected in SelectionMode.None via keyboard

    DetailsList can still be selected in SelectionMode.None via keyboard

    Environment Information

    • Package version(s): Seems to be in v7 and v8

    Please provide a reproduction of the bug in a codepen:

    https://codepen.io/brandonthomas/pen/RwZRYjO

    • Open pen
    • Go to the configure menu, select none for selection mode.
    • Tab until you are focused on the header
    • Press arrow down

    Expected: Focus is on the first row but no selection Actual: Focus is on the first row AND it's selected.

    This also might be an accessibility bug since it is only reachable via keyboard.

    Are you willing to submit a PR to fix? No

    Requested priority: Normal

    Needs: Triage :mag: 
    opened by brandonthomas 0
Releases(@fluentui/react-button_v9.0.0-alpha.95)
Owner
Microsoft
Open source projects and samples from Microsoft
Microsoft
A React-based UI toolkit for the web

Blueprint Blueprint is a React-based UI toolkit for the web. It is optimized for building complex, data-dense web interfaces for desktop applications

Palantir Technologies 18.2k Oct 17, 2021
🌈React Rainbow is a collection of components that will reliably help you build your application in a snap

React Rainbow is a collection of components that will reliably help you build your application in a snap. Give it a hack and let us know

Nexxtway 1.6k Oct 15, 2021
A frontend Framework for building B2B applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Material Design

react-admin A frontend Framework for building data-driven applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Materi

marmelab 18k Oct 11, 2021
A collection of essential UI components written with React.

Zent ( \ˈzent\ ), a collection of essential UI components written with React.

有赞 2.1k Oct 18, 2021
dataminr-react-components - Collection of reusable React Components and utility functions.

react-components A collection of reusable React components with their own Flux lifecycle. What's inside react-components? Table Component From a simpl

Dataminr 261 Aug 5, 2021
A collection of JetBrains Web UI components

This collection of UI components aims to provide all of the necessary building blocks for web-based products built inside JetBrains, as well as third-party plugins developed for JetBrains' products.

JetBrains 2.7k Sep 16, 2021
A collection of JetBrains Web UI components

Ring UI — JetBrains Web UI components This collection of UI components aims to provide all of the necessary building blocks for web-based products bui

JetBrains 2.8k Oct 19, 2021
🌲 Evergreen React UI Framework by Segment

Works out of the box. Evergreen contains a set of polished React components that work out of the box. Flexible & composable. Evergreen components are

Segment 11.2k Oct 16, 2021
Simple React Bootstrap 4 components

reactstrap Stateless React Components for Bootstrap 4. Getting Started Follow the create-react-app instructions to get started and then follow the rea

reactstrap 10.1k Oct 15, 2021
A complete opinionated React component library with minimal dependencies powered by ZEISS.

A complete opinionated React component library with minimal dependencies powered by ZEISS. The UI component library contains both, very low-level desi

ZEISS Group 267 Oct 16, 2021
Collection of headless components/hooks that are accessible, composable, customizable from low level to build your own UI & Design System

Collection of headless components/hooks that are accessible, composable, customizable from low level to build your own UI & Design System powered by Reakit System.

Timeless 141 Oct 20, 2021
Collection of general React components used in buildo projects.

React Components This is a collection of reusable React components used at buildo. Its purpose is to give access to all these components through a sin

buildo 158 Oct 12, 2021
A small collection of React components and styles

turtle-ui A small collection of react components with styles. Install npm install --save turtle-ui Usage Import CSS @import "~turtle-ui/dist/styles.cs

Nick Sjostrom 8 Oct 12, 2020
Elastic UI Framework 🙌

Elastic UI Framework The Elastic UI Framework is a collection of React UI components for quickly building user interfaces at Elastic. Not using React?

elastic 3.1k Oct 12, 2021
React utility component primitives & UI framework for use with Tailwind CSS

Tailwind React UI NB: As the 0.#.# version number suggests this is still very much work in progress, so semantic versioning will not be followed until

Ed Mortlock 238 Oct 4, 2021
React Native horizontal scroll view component as seen on Clubhouse tags

React Native horizontal scroll view component as seen on Clubhouse tags

Fatih Taşdemir 77 Oct 9, 2021
Material-UI is a simple and customizable component library to build faster, beautiful, and more accessible React applications. Follow your own design system, or start with Material Design.

Material-UI Quickly build beautiful React apps. Material-UI is a simple and customizable component library to build faster, beautiful, and more access

Material-UI 72.2k Oct 12, 2021
A React Component library for buliding modern applications easily & quickly.

A React Component library for building modern applications easily & quickly

Elementz 336 Oct 17, 2021
TheCodingMachine React Native boilerplate - Typescript Plugin

This plugin allow thecodingmachine react-native-boilerplate ?? users to translate the boilerplate from Javascript ?? to Typescript ??

TheCodingMachine 2 Oct 13, 2021