<p align="center"><a href="https://www.ygyg.cn" target="_blank"><img width="100" src="https://www.ygyg.cn/static/headerPublic/images/logo.png"></a></p>

<p align="center">
  <a href="https://nodejs.org"><img src="https://img.shields.io/badge/node-%3E%3D8.9.1-green.svg?style=flat" alt="Node.js Version"></a>
  <a href="http://standardjs.com"><img src="https://img.shields.io/badge/code%20style-standard-brightgreen.svg" alt="js-standard-style"></a>
</p>

<h1 align="center">YG Design</h1>

<div align="center">

An enterprise-class UI design language and React implementation.

</div>

[![](https://cdn-images-1.medium.com/max/2000/1*NIlj0-TdLMbo_hzSBP8tmg.png)](http://ygd.ygego.dev1)

English | [简体中文](./README-zh_CN.md)

## ✨ Features

- An enterprise-class UI design system for web applications.
- A set of high-quality React components out of the box.
- Written in TypeScript with predictable static types.
- The whole package of development and design resources and tools.

## 🖥 Environment Support

* Modern browsers and Internet Explorer 9+ (with [polyfills](https://ygd.ygego.dev1/docs/react/getting-started#Compatibility))
* Server-side Rendering
* [Electron](http://electron.atom.io/)

| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png" alt="Electron" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Electron |
| --------- | --------- | --------- | --------- | --------- | --------- |
| IE9, IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions| last 2 versions

## ⌨️ ops deploy

```bash
cnpm i
npm run site
```
``` Nginx
server {
    listen       80;
    server_name  ygd.f.me;
    location / {
        add_header Access-Control-Allow-Origin *;
        add_header Access-Control-Allow-Headers: content-type;
        try_files $uri /index.html;
        autoindex on;
        root /Users/fugang/workspace/xinao/ygyg-design/_site/;
    }    
}
```

## 📦 Install

```bash
npm install ygd
```

```bash
yarn add ygd
```


## 🔨 Usage

```jsx
import { DatePicker } from 'ygd';
ReactDOM.render(<DatePicker />, mountNode);
```

And import style manually:

```jsx
import 'ygd/dist/ygd.css';  // or 'ygd/dist/ygd.less'
```

Or [import components on demand](https://ygd.ygego.dev1/docs/react/getting-started#Import-on-Demand).

### TypeScript

See [Use in TypeScript](https://ygd.ygego.dev1/docs/react/use-in-typescript).

## 🌍 Internationalization

See [i18n](http://ygd.ygego.dev1/docs/react/i18n).

## 🔗 Links

- [Home page](http://ygd.ygego.dev1/)
- [Components](http://ygd.ygego.dev1/docs/react/introduce)
- [YG Design Pro](http://pro.ygego.dev1/)
- [Change Log](CHANGELOG.en-US.md)
- [rc-components](http://react-component.github.io/)
- [Mobile UI](http://mobile.ygego.dev1)
- [Landing Pages](https://landing.ygego.dev1)
- [Motion](https://motion.ygego.dev1)
- [Scaffold Market](http://scaffold.ygego.dev1)
- [FAQ](https://ygd.ygego.dev1/docs/react/faq)
- [CodeSandbox Template](https://u.ygego.dev1/codesandbox-repro) for bug reports
- [Awesome YG Design](https://github.com/websemantics/awesome-ant-design)
- [Customize Theme](http://ygd.ygego.dev1/docs/react/customize-theme)

## ⌨️ Development

Use Gitpod, a free online dev environment for GitHub.

[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/ant-design/ant-design)

Or clone locally:

```bash
$ git clone git@git.ennew.alpha:front-end/ygyg-design.git
$ cd ygyg-design
$ npm install
$ npm start
```

Open your browser and visit http://127.0.0.1:8001 , see more at [Development](https://github.com/ant-design/ant-design/wiki/Development).

## 🤝 Contributing [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)

Read our [contributing guide](https://ygd.ygego.dev1/docs/react/contributing) and let's build a better ygd together.

We welcome all contributions. 

## plan

增加reqpath 处理 自动处理接口请求，并返回数据 。

reqpath -> dispatch -> model -> service ->
data render view ui

用于 解决 以往 cloneRow 的习惯

对应原有bind事件，如delegate ，事件一直都在。不需要再考虑.

默认resultData为列表数据，可指定列表数据返回值 是否为resultData

## border-box





menu/style/index.less  保持右侧导航
select/style/index.less




## contentbox

layout layout/style/index.less

date-picker/style/TimePicker.less

pagnation pagination/style/index.less

upload/style/index.less

time-picker/style/index.less

switch/style/index.less

carousel/style/index.less

table/style/index.less

grid/style/mixin.less

grid/style/index.less

form/style/mixin.less


start

$ antd-tools run guard
antd-tools run guard