[@FOXONE/FINANCE-UI]: 0.1.0-alpha.2

Author: BobbyTalvin

@types/global.d.ts

@@ -25,3 +25,5 @@ declare module '*.vue' {
   import Vue from 'vue';
   export default Vue;
 }
+
+declare module '@foxone/uikit';

DEV.md

@@ -0,0 +1,60 @@
+# Dev
+
+### Install dependencies
+```shell
+yarn
+```
+
+### Run project
+```shell
+yarn start
+```
+or
+```shell
+yarn dev
+```
+
+### Create a Component
+```shell
+yarn new
+```
+
+*Create a functional Component which name is Button👇*
+```shell
+yarn new Button -f
+```
+
+---
+
+## Build and Release
+### Build
+```shell
+yarn build
+```
+
+*Bypass all pre-check before building👇*
+```shell
+yarn build -n
+```
+
+### Release
+```shell
+yarn release
+```
+
+*Ignoring version of iteration👇*
+```shell
+yarn release -i
+```
+
+*Manual specify version of iteration to 0.3.25👇*
+```shell
+yarn release -m 0.3.25
+```
+
+*Bypass all pre-check before release👇*
+```shell
+yarn release -n
+```
+
+**More powerful customizations is in [omni.config.js](https://github.com/omni-door/cli/blob/master/docs/OMNI.md)**

DEV.zh-CN.md

@@ -0,0 +1,60 @@
+# 开发
+
+### 安装依赖
+```shell
+yarn
+```
+
+### 启动项目
+```shell
+yarn start
+```
+or
+```shell
+yarn dev
+```
+
+### 新建组件
+```shell
+yarn new
+```
+
+*新建一个名为 Button 的函数组件👇*
+```shell
+yarn new Button -f
+```
+
+---
+
+## 构建和发布
+### 构建
+```shell
+yarn build
+```
+
+*构建项目时绕过所有检查👇*
+```shell
+yarn build -n
+```
+
+### 发布
+```shell
+yarn release
+```
+
+*发布项目时忽略版本迭代👇*
+```shell
+yarn release -i
+```
+
+*发布项目时指定迭代的版本为 0.3.25 👇*
+```shell
+yarn release -m 0.3.25
+```
+
+*发布项目时绕过所有检查👇*
+```shell
+yarn release -n
+```
+
+**更多配置项请在 [omni.config.js](https://github.com/omni-door/cli/blob/master/docs/OMNI.zh-CN.md) 中编辑**

README.md

@@ -5,61 +5,127 @@ English | [简体中文](./README.zh-CN.md)
 [Demo](https://fox-one.github.io/finance-ui/?path=/story)
 
 ## Quick start
-### Install dependencies
-```shell
-yarn
-```
+### Install
 
-### Run project
-```shell
-yarn start
-```
-or
 ```shell
-yarn dev
+yarn add @foxone/finance-ui
 ```
 
-### Create a Component
-```shell
-yarn new
-```
+### Global Usage
+`main.ts`:
+```typescript
+import Vue from "vue";
+import FinanceUI from "@foxone/finance-ui";
 
-*Create a functional Component which name is Button👇*
-```shell
-yarn new Button -f
+Vue.use(FinanceUI);
+
+// ……
 ```
 
----
+`App.vue`:
+```vue
+<template>
+  <div>
+    My Vue App With FinanceUI
+    <asset-range-input
+      v-model="amount"
+      @input="onInput"
+      :max="max"
+      :inputTips="inputTips"
+      :asset="asset"
+      :selectable="false"
+    />
+  </div>
+</template>
 
-## Build and Release
-### Build
-```shell
-yarn build
-```
+<script lang="ts">
+  import { Component, Vue } from 'vue-property-decorator';
 
-*Bypass all pre-check before building👇*
-```shell
-yarn build -n
-```
+  @Component
+  export default class App extends Vue {
+    max = 50;
+    asset = {
+      chain: {
+        chain: null,
+        chain_id: "43d61dcd-e413-450d-80b8-101d5e903357",
+        id: "43d61dcd-e413-450d-80b8-101d5e903357",
+        logo: "https://mixin-images.zeromesh.net/zVDjOxNTQvVsA8h2B4ZVxuHoCF3DJszufYKWpd9duXUSbSapoZadC7_13cnWBqg0EmwmRcKGbJaUpA8wFfpgZA=s128",
+        name: "Ether",
+        price: "2167.89",
+        symbol: "ETH"
+      },
+      chain_id: "43d61dcd-e413-450d-80b8-101d5e903357",
+      id: "965e5c6e-434c-3fa9-b780-c50f43cd955c",
+      logo: "https://mixin-images.zeromesh.net/0sQY63dDMkWTURkJVjowWY6Le4ICjAFuu3ANVyZA4uI3UdkbuOT5fjJUT82ArNYmZvVcxDXyNjxoOv0TAYbQTNKS=s128",
+      name: "Chui Niu Bi",
+      price: "0",
+      symbol: "CNB"
+    }；
+    inputTips = {
+      amount: 50,
+      amountSymbol: 'CNB',
+      tipLeft: 'Collateral',
+      tipRight: '≈ $ 6456.54',
+    }；
+    amount = 30.21;
 
-### Release
-```shell
-yarn release
+    onInput() {
+      console.log('this.amount', this.amount);
+    }
+  }
+</script>
 ```
 
-*Ignoring version of iteration👇*
-```shell
-yarn release -i
-```
+### Local Usage
+`Component.vue`:
+```vue
+<template>
+  <div>
+    It's Risk Slider
+    <risk-slider
+      v-model="precent"
+      :tips="tips"
+      :scale="scale"
+      ref="slider"
+    />
+  </div>
+</template>
 
-*Manual specify version of iteration to 0.3.25👇*
-```shell
-yarn release -m 0.3.25
+<script lang="ts">
+  import { Component, Vue } from 'vue-property-decorator';
+  import { RiskSlider } from '@foxone/finance-ui';
+
+  @Component(
+    components: {
+      RiskSlider
+    }
+  )
+  export default class App extends Vue {
+    precent = 30;
+    tips = {
+      tip: 'Collateralization Ration reach',
+      highlight: `${(30.21 / 50 * 100).toFixed(2)}%, it’s in low-risk now.`
+    };
+    scale = {
+      low: 0.65,
+      mid: 0.2,
+      high: 0.15
+    };
+  }
+</script>
 ```
 
-*Bypass all pre-check before release👇*
+
+
+## Dev
+For debugging or maintenance, you can clone the whole git repository and run the project.
+
 ```shell
-yarn release -n
+git clone --depth 1 [email protected]:fox-one/finance-ui.git
+
+cd finance-ui
+
+yarn && yarn dev
 ```
 
-**More powerful customizations is in [omni.config.js](https://github.com/omni-door/cli/blob/master/docs/OMNI.md)**
+[More Detials](./DEV.md)