• Stars
    star
    708
  • Rank 63,953 (Top 2 %)
  • Language
    TypeScript
  • License
    MIT License
  • Created about 7 years ago
  • Updated 4 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

⚛️ @uiwjs A high quality UI Toolkit, A Component Library for React 16+.

uiw LOGO

Github Actions License MIT jest Open in Gitpod
Github Releases npm version Github Stars

uiw document website

uiw

The official documentation site for uiw. A high quality UI Toolkit, A Component Library for React 16+. 💘

Installation

npm install uiw --save

You can use kkt to quickly create a react + uiw project.

npx create-kkt my-app -e uiw

You can use the uiw v1.x version. Please see here for instructions. (npx comes with npm 5.2+ and higher.)

Basic Usage

import React from "react";
import ReactDOM from "react-dom";
import { Button } from "uiw";

ReactDOM.render(
  <Button type="primary">Hello</Button>,
  document.getElementById("app")
);

Documentation

Visit the uiwjs.github.io website for more information.

Or Open in VSCode Preview :

Open in VSCode

Packages

This git repository is a repo built using Lerna. It contains several packages:

Package Version Description
uiw npm version -
@uiw/formatter npm version -
@uiw/react-affix npm version -
@uiw/react-alert npm version -
@uiw/react-avatar npm version -
@uiw/react-back-top npm version -
@uiw/react-badge npm version -
@uiw/react-breadcrumb npm version -
@uiw/react-button npm version -
@uiw/react-button-group npm version -
@uiw/react-calendar npm version -
@uiw/react-card npm version -
@uiw/react-checkbox npm version -
@uiw/react-collapse npm version -
@uiw/react-copy-to-clipboard npm version -
@uiw/react-date-input npm version -
@uiw/react-date-picker npm version -
@uiw/react-descriptions npm version -
@uiw/react-divider npm version -
@uiw/react-drawer npm version -
@uiw/react-dropdown npm version
@uiw/react-empty npm version -
@uiw/react-file-input npm version -
@uiw/react-form npm version -
@uiw/react-grid npm version -
@uiw/react-icon npm version -
@uiw/react-input npm version -
@uiw/react-layout npm version -
@uiw/react-list npm version -
@uiw/react-loader npm version -
@uiw/react-menu npm version -
@uiw/react-message npm version -
@uiw/react-modal npm version -
@uiw/react-month-picker npm version -
@uiw/react-notify npm version -
@uiw/react-overlay npm version -
@uiw/react-overlay-trigger npm version -
@uiw/react-pagination npm version -
@uiw/react-pin-code npm version -
@uiw/react-popover npm version -
@uiw/react-portal npm version -
@uiw/react-progress npm version -
@uiw/react-radio npm version -
@uiw/react-rate npm version -
@uiw/react-search-select npm version -
@uiw/react-search-tree npm version -
@uiw/react-select npm version -
@uiw/react-split npm version -
@uiw/react-slider npm version -
@uiw/react-steps npm version -
@uiw/react-switch npm version -
@uiw/react-table npm version -
@uiw/react-tabs npm version -
@uiw/react-tag npm version -
@uiw/react-textarea npm version -
@uiw/react-time-picker npm version -
@uiw/react-tooltip npm version -
@uiw/react-tree npm version -
@uiw/react-tree-checked npm version -
@uiw/utils npm version -

Development

Use Gitpod, a free online dev environment for GitHub.

Open in Gitpod

Or clone locally:

$ git clone [email protected]:uiwjs/uiw.git

Install dependencies & compile component code.

$ npm install # Install dependencies

$ npm run hoist
$ npm run build

To develop, run the self-reloading build:

# Run the app
# Restart the app automatically every time code changes.
# Useful during development.
$ npm run lib:watch
$ npm run start
$ lerna run --scope uiw watch --stream
$ lerna exec --scope @uiw/button -- tsbb types --outDir lib/esm --target ESNEXT --watch
$ lerna exec --scope @uiw/button -- tsbb watch --target react --env-name esm:dev --env-name cjs

Folders

├── LICENSE
├── README.md
├── package.json
├── website
│   ├── uiw        # Documentation website source code
└── packages
    ├── uiw        # Component library source code
    ├── react-alert
    ├── react-tree
    ├── ...
    └── react-affix

Contributors

License

Licensed under the MIT License.

More Repositories

1

province-city-china

🇨🇳最全最新中国【省、市、区县、乡镇街道】json,csv,sql数据
JavaScript
2,661
star
2

react-md-editor

A simple markdown editor with preview, implemented with React.js and TypeScript.
TypeScript
2,119
star
3

react-codemirror

CodeMirror 6 component for React. @codemirror https://uiwjs.github.io/react-codemirror/
TypeScript
1,611
star
4

react-login-page

Some `react` login pages, which can be used quickly after installation.
TypeScript
570
star
5

react-textarea-code-editor

A simple code editor with syntax highlighting.
TypeScript
479
star
6

react-amap

基于 React 封装的高德地图组件,帮助你轻松的接入地图到 React 项目中。
TypeScript
415
star
7

react-markdown-editor

A markdown editor with preview, implemented with React.js and TypeScript.
TypeScript
325
star
8

react-monacoeditor

Monaco Editor component for React.
TypeScript
290
star
9

react-color

🎨 Is a tiny color picker widget component for React apps.
TypeScript
273
star
10

react-markdown-preview

React component preview markdown text in web browser. The minimal amount of CSS to replicate the GitHub Markdown style. Support dark-mode/night mode.
TypeScript
270
star
11

react-baidu-map

基于 React 封装的百度地图组件,支持 React Hook,帮助你轻松的接入地图到 React 项目中。
TypeScript
221
star
12

react-native-alipay

基于 React Native 的宝支付包,已更新到最新的支付宝 SDK 版本,支持Android/iOS。
Java
208
star
13

react-heat-map

A lightweight calendar heatmap react component built on SVG, customizable version of GitHub's contribution graph.
TypeScript
198
star
14

react-json-view

A React component for displaying and editing javascript arrays and JSON objects.
TypeScript
187
star
15

icons

The premium icon font for @uiwjs Component Library. https://uiwjs.github.io/icons
HTML
138
star
16

npm-unpkg

A web application to view npm package files, Based on unpkg.
TypeScript
101
star
17

react-split

A piece of view can be divided into areas where the width or height can be adjusted by dragging.
TypeScript
66
star
18

react-code-preview

Code edit preview for React.
TypeScript
64
star
19

react-native-uiw

A UI component library based on React Native (Android & iOS).
TypeScript
45
star
20

json-viewer

Online JSON Viewer, JSON Beautifier to beautify and tree view of JSON data - It works as JSON Pretty Print to pretty print JSON data.
TypeScript
45
star
21

react-native-amap-geolocation

React Native 高德地图定位模块,支持 Android/iOS。
Java
42
star
22

react-signature

A signature board component for react.
TypeScript
36
star
23

react-watermark

A react component that adds a watermark to an area of a web page.
TypeScript
33
star
24

react-native-wechat

React Native 包使用微信分享、登录、收藏、支付等功能,支持Android/iOS。
Java
31
star
25

file-icons

File icons in the file tree.
HTML
30
star
26

free-font

收录商用免费汉字字体 Free Font
JavaScript
26
star
27

uiw-admin

UIW-Admin Panel Framework, Powered by React and @uiwjs.
TypeScript
22
star
28

babel-plugin-transform-remove-imports

Remove the specified import declaration when you use the babel transform to build the package.
JavaScript
22
star
29

react-run-web

Online Code Editor for Rapid Web Development.
TypeScript
21
star
30

react-mac-keyboard

Macbook computer keyboard style for react component.
TypeScript
18
star
31

react-native-template

React Native template for react-native-uiw.
JavaScript
17
star
32

next-remove-imports

The default behavior is to remove all .less/.css/.scss/.sass/.styl imports from all packages in node_modules.
JavaScript
17
star
33

react-use-online

useOnline is a tiny, zero-dependency hook for responding to online/offline changes.
TypeScript
17
star
34

ui-color

Converting HEX & RGB colors to UIColor/NSColor/Color for both Objective C & Swift.
TypeScript
16
star
35

copy-to-clipboard

Copy text to the clipboard in modern browsers
JavaScript
16
star
36

react-iframe

This component allows you to wrap your entire React application or each component in an <iframe>.
TypeScript
16
star
37

keycode-info

A simple web page that responds to the pressed key and returns information about the JavaScript'on-key press' key.
TypeScript
15
star
38

reset-css

A tiny modern CSS reset.
CSS
14
star
39

react-codesandbox

A React component is provided that allows you to programmatically generate codesandbox projects from code samples on the fly.
TypeScript
12
star
40

react-github-corners

Add a Github corner to your project page, This GitHub corner for react component/web component.
TypeScript
12
star
41

react-only-when

A declarative component for conditional rendering.
TypeScript
10
star
42

react-tabs-draggable

Draggable tabs for React.
TypeScript
8
star
43

bootstrap-icons

Official open source SVG icon library for Bootstrap.
8
star
44

uiwjs.github.io

The official documentation site for @uiwjs. https://uiwjs.github.io
8
star
45

react-clock

An analog clock for your React app.
TypeScript
7
star
46

vscode-uiw

Preview uiw document in vscode.
TypeScript
7
star
47

react-code-preview-layout

A react component showing the layout of `code` and `code preview example`.
TypeScript
7
star
48

react-layout

Layout component for React. Handling the overall layout of a page.
TypeScript
7
star
49

react-markdown-preview-example

Preview the markdown files and run the React examples in the documentation.
TypeScript
7
star
50

react-csv-reader

React component that handles csv file input and its parsing.
TypeScript
7
star
51

react-prismjs

React Component for prismjs.
TypeScript
7
star
52

react-use-colorscheme

useColorScheme() provides access to the devices color scheme.
TypeScript
7
star
53

react-native-transport-location

Objective-C
6
star
54

date-formatter

Get a formatted date.
TypeScript
6
star
55

react-head

React components will manage your changes to the document head
TypeScript
4
star
56

react-shields

Shields.io for react component, Quality metadata badges for open source projects.
TypeScript
4
star
57

react-stackblitz

A React component is provided that allows you to programmatically generate stackblitz projects from code samples on the fly.
TypeScript
4
star
58

react-back-to-top

A minimal lightweight react component for adding a nice scroll up (back to top) button with onScroll progress.
TypeScript
4
star
59

react-monorepo-template

Simple React package development project example template.
TypeScript
3
star
60

auto-gitee-mirror

Use GitHub Actions to sync from GitHub to Gitee
3
star
61

react-keywords

Highlight a keyword in a piece of text and return a React element.
TypeScript
3
star
62

react-codepen

A React component is provided that allows you to programmatically generate codepen projects from code samples on the fly.
TypeScript
3
star
63

css-filter

A filter CSS generator that helps you quickly generate filter CSS declarations for your website. It comes with many options and it demonstrates instantly.
TypeScript
3
star
64

babel-plugin-transform-uiw-import

Modular import plugin for babel.
JavaScript
2
star
65

react-xml-reader

React component that handles xml file input and its parsing.
TypeScript
2
star
66

rematch-loading

Loading indicator plugin for @rematch.
TypeScript
1
star
67

logo

Source files of uiw's logo.
1
star
68

.github

Welcome to the uiwjs organization.
1
star