TypeScript UI Components

Open-source TypeScript projects categorized as UI Components | Edit details

Top 23 TypeScript UI Component Projects

  • GitHub repo storybook

    📓 The UI component explorer. Develop, document, & test React, Vue, Angular, Web Components, Ember, Svelte & more!

    Project mention: Getting Started with Blast – Storybook for Laravel Blade | dev.to | 2021-10-18

    At AREA 17, we've been using Storybook for many years with both Vue and React and we love it, but our core technology is Laravel, and we want to be able to work with Storybook in that environment too. We've been able to in the past using the Twig loader, but our heart is closer to Blade. When Quentin, our Engineering Group Director, realized Storybook Server was a thing, and what the Rails community was able to do with it, he started to dream big and threw a quick prototype at it. We then worked together to make that prototype a reality and it became Blast – Storybook for Laravel Blade.

  • GitHub repo vuetify

    🐉 Material Component Framework for Vue

    Project mention: ⚡ Release September 28th, 2021 | reddit.com/r/vuetifyjs | 2021-09-28

    Vuetify v2.5.9 is live! It includes fixes for the click-outside directive, multiple fixes for inputs including Autocompletes, Sliders, 2 reverts, and more! Full Release notes here: https://github.com/vuetifyjs/vuetify/releases/tag/v2.5.9

  • Syncfusion

    Syncfusion - See why our products are consistently getting 4.6 out of 5 stars by your peers.. Syncfusion Essential Studio for JavaScript is a modern UI control library built from the ground up to be lightweight, responsive, modular, and touch-friendly.

  • GitHub repo react-select

    The Select Component for React.js

    Project mention: Renderless Component Libraries? | reddit.com/r/vuejs | 2021-10-10

    Sure, we're still waiting for some components, like a UI-less Select component from Radix, so we're forced (time constraint) to build upon react-select (https://react-select.com), but that is easily the most bothersome component I've worked with in our library.

  • GitHub repo slate

    A completely customizable framework for building rich text editors. (Currently in beta.) (by ianstormtaylor)

    Project mention: Anyone ever tried creating a text input similar to discord's in react? | reddit.com/r/reactjs | 2021-10-08

    Ok good to know. Although, the Mention Example seem pretty complicated for what feels like such a simple task but still good to know about this in case I ever need it in the future

  • GitHub repo react-native-elements

    Cross-Platform React Native UI Toolkit

    Project mention: Top 7 React Native UI toolkits and component libraries in 2021 | dev.to | 2021-06-15

    More information available here: https://reactnativeelements.com

  • GitHub repo chakra-ui

    ⚡️ Simple, Modular & Accessible UI Components for your React Applications

    Project mention: Testing | reddit.com/r/webdev | 2021-10-18

    So far, "React Testing Library" and "Mock Service Worker" have covered my bases in the frontend. The hardest part in getting started for me was honestly getting myself to understand just how dead simple unit tests were suppose to be. I think charka-ui offers some great examples (although they have their own testing library, it's pretty similiar to RTL): https://github.com/chakra-ui/chakra-ui/tree/main/packages

  • GitHub repo react-dnd

    Drag and Drop for React

    Project mention: A powerful drag and drop library for Angular | reddit.com/r/Angular2 | 2021-08-15

    Yes, there has many differences. it's based on html5 drag and drop. You can check the examples here, it's difficult to achieve with @angular/cdk. The library is cloned from angular-skyhook which inspired by react-dnd.

  • Scout APM

    Scout APM: A developer's best friend. Try free for 14-days. Scout APM uses tracing logic that ties bottlenecks to source code so you know the exact line of code causing performance issues and can get back to building a great product faster.

  • GitHub repo NativeBase

    Mobile-first, accessible components for React Native & Web to build consistent UI across Android, iOS and Web.

    Project mention: NativeBase v3 is now live on Product Hunt | reddit.com/r/opensource | 2021-09-21

    Thanks for the suggestion. Will update it. Link - https://github.com/GeekyAnts/nativebase.

  • GitHub repo Bit

    A tool for component-driven application development.

    Project mention: Documentation techniques in FE | reddit.com/r/Frontend | 2021-10-15

    Bit is a development platform/styleguide/package mono-repo in one system.

  • GitHub repo react-content-loader

    ⚪ SVG-Powered component to easily create skeleton loadings.

    Project mention: Awesome Things Related To React Hooks 😍 | dev.to | 2021-09-23

    React Content Loader - SVG-Powered component to easily create placeholder loadings (like Facebook’s cards loading).

  • GitHub repo TinyMCE

    The world's #1 JavaScript library for rich text editing. Available for React, Vue and Angular

    Project mention: My pain building a WYSIWYG editor with contenteditable | reddit.com/r/webdev | 2021-09-17

    There's quite a few. I use TinyMCE : https://www.tiny.cloud/

  • GitHub repo react-toastify

    React notification made easy 🚀 !

    Project mention: Toast Notification for React Apps | dev.to | 2021-10-04

    React Toastify

  • GitHub repo ng-zorro-antd

    Angular UI Component Library based on Ant Design

    Project mention: Ultimate 2021 List of CSS Frameworks and Component Libraries for Angular, React, Vue and Svelte | dev.to | 2021-03-28

    NG Zorro

  • GitHub repo react-native-calendars

    React Native Calendar Components 🗓️ 📆

    Project mention: Quick Intro to Storybook with React Native | dev.to | 2021-10-14
  • GitHub repo react-icons

    svg react icons of popular icon packs

    Project mention: How to use React icons in Next.js | dev.to | 2021-10-05

    Then we can get started by importing the icons. Head over to the React icons website and find the icon you would like to use (use the left-hand search).

  • GitHub repo naive-ui

    A Vue 3 Component Library. Fairly Complete. Customizable Themes. Uses TypeScript. Not too Slow.

    Project mention: Is it a bad time to start a project in Vue? | reddit.com/r/vuejs | 2021-09-07

    Try Naive UI, it's a Vue 3 component library that uses Typescript and it has more than 70 components. I find it pretty intuitive.

  • GitHub repo lightGallery

    A customizable, modular, responsive, lightbox gallery plugin.

    Project mention: Show HN: JavaScript image viewer. Works with React, angular, & vue.js | news.ycombinator.com | 2021-05-24
  • GitHub repo react-day-picker

    Reusable date picker component for React

    Project mention: Counting Days on React-Day-Picker | dev.to | 2021-07-27

    At first, I was feeling overly ambitious and thought I could build my own calendar. After reviewing some examples online, I quickly realized it would take a lot of time and work considering the differing days in a month and adding basic functionality. Instead I found a React component, React Day Picker, that could be easily inserted into my application.

  • GitHub repo react-hot-toast.com

    Smoking hot React Notifications 🔥

    Project mention: Awesome Things Related To React Hooks 😍 | dev.to | 2021-09-23

    React Hot Toast - The Best Toast in Town. Smoking hot React notifications.

  • GitHub repo react-leaflet

    React components for Leaflet maps

    Project mention: Criando mapas utilizando Leaflet via CDN em um projeto React | dev.to | 2021-09-15
  • GitHub repo pigeon-maps

    ReactJS Maps without external dependencies

    Project mention: Pigeon Maps – ReactJS maps without external dependencies | news.ycombinator.com | 2021-03-19
  • GitHub repo react-image-crop

    A responsive image cropping tool for React

  • GitHub repo react-mosaic

    A React tiling window manager

    Project mention: Show HN: Omnino, a windowing system for web apps, inspired by the Acme editor | news.ycombinator.com | 2021-10-07

    While the conservative reproduction of Acme's interaction will appeal to fans who have used the editor I guess, I think a lot of people would find the interactivity (esp. the resizers, left scrollbar) very non-intuitive in present day and age.

    A good example of a more modern and practical tiling system for web is mosaic (https://nomcopter.github.io/react-mosaic/)

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2021-10-18.

Index

What are some of the best open-source UI Component projects in TypeScript? This list will help you:

Project Stars
1 storybook 65,266
2 vuetify 32,330
3 react-select 23,514
4 slate 22,429
5 react-native-elements 21,450
6 chakra-ui 21,119
7 react-dnd 16,522
8 NativeBase 16,266
9 Bit 14,120
10 react-content-loader 11,600
11 TinyMCE 9,880
12 react-toastify 7,761
13 ng-zorro-antd 7,737
14 react-native-calendars 7,180
15 react-icons 6,951
16 naive-ui 6,190
17 lightGallery 4,699
18 react-day-picker 4,316
19 react-hot-toast.com 3,879
20 react-leaflet 3,862
21 pigeon-maps 3,135
22 react-image-crop 2,808
23 react-mosaic 2,756
Find remote jobs at our new job board 99remotejobs.com. There are 35 new remote jobs listed recently.
Are you hiring? Post a new remote job listing for free.